@charset "utf-8";

/* mBc */
.mBc {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	min-width: 220px;
}
.mBc > .home {
	background: url(/static/prjt/cmmn/img/ico_home.svg) no-repeat;
	background-size: 16px auto;
	width: 16px;
	height: 16px;
	filter: brightness(0);
}
.mBc > .bar {
	background: url(/static/prjt/cmmn/img/ico-mBcnext.svg) no-repeat;
	background-size: 24px auto;
	width: 24px;
	height: 24px;
}
.dropdown-group {
	position: relative;
}

.main-text {
	color: #333;
	font-size: var(--font-media);
	line-height: 22px;
}

.triangle-dropdown {
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
	background-color: var(--color-white);
	border: 1px solid var(--color-primary);
	border-radius: 0.5rem;
	box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.12);
	position: absolute;
	top: 40px;
	left: 50%;
	transform: translateX(-50%);
	padding: 0.5rem;
	min-width: 145px;
	z-index: 4;
	display: flex;
	flex-direction: column;
    -ms-user-select: none;
    -moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}
.triangle-dropdown.active {
	opacity: 1;
	visibility: visible;
}
.triangle {
	top: -0.75rem;
	left: 50%;
	content: "";
	background: url(/static/prjt/cmmn/img/triangle-ico.svg) no-repeat;
	background-size: cover;
	width: 1.25rem;
	transform: translateX(-50%);
	height: 0.75rem;
	position: absolute;
	pointer-events: none;
	z-index: 3;
}

.dropdown {
	padding: 0.9375rem 1rem;
	background-color: var(--color-white);
	cursor: pointer;
}
.dropdown:hover {
	background-color: #f8f9ff;
	transition: all 0.5s;
}
.dropdown.active {
	background-color: var(--color-primary);
	transition: all 0.5s;
}
.item {
	color: #1d1d1d;
	font-size: var(--font-media);
	line-height: 20px;
}
.dropdown:hover > .item {
	color: var(--color-primary);
	font-family: "NanumSquareNeoBold";
}
.dropdown.active > .item {
	color: var(--color-white);
	font-family: "NanumSquareNeoBold";
}
/* //mBc */

/* lnb */
.lnb {
	width: 20%;
	max-width: 15.5625rem;
	height: fit-content;
	border: 1px solid var(--color-primary);
	border-radius: 0.5rem;
	padding: 0 0.625rem 2rem;
}
.lnb-titlearea {
	padding: 3rem 0.5rem 0.5rem;
}
.lnb-tit {
	font-size: 24px;
	line-height: 32px;
	font-family: "NanumSquareNeoExtraBold";
	color: #1d1d1d;
	text-align: center;
	display: block;
	width: 100%;
}
.lnb-tit.activity em {
	display: block;
	width: 100%;
	margin-bottom: 1rem;
}
.lnbmenugroups {
	padding: 0 0.5rem;
}
.lnbmenu {
	transition: all 0.3s ease-in-out;
	overflow: hidden;
	cursor: pointer;
}

.lnbmenu-title {
	border-bottom: 1px solid #d6dcf7;
	transition: box-shadow 0.2s ease-in-out, background-color 0.2s ease-in-out;
	padding: 0 0.5rem;
	height: 3.37rem;
	line-height: 50px;
	align-content: center;
	display: block;
	position: relative;
}
.lnbmenu:last-child .lnbmenu-title {
	box-shadow: none;
}
.lnbmenu-title.active a::before {
	border-bottom: 1px solid #e4e4e4;
	background: url(/static/prjt/cmmn/img/select-arrowup.svg) no-repeat right center;
	filter: invert(13%) sepia(100%) saturate(4582%) hue-rotate(233deg) brightness(102%) contrast(122%);
	background-size: 20px auto;
	transform: rotate(90deg);
}
.lnbmenu-title.active .lnbmenu-tit {
	color:var(--color-primary);
}
.lnbmenu:last-child .lnbmenu-title.active {
	border-bottom: 1px solid var(--color-primary);
}
.lnbmenu-tit {
	font-size: 15px;
	line-height: 22.5px;
	color: #1d1d1d;
	font-family: "NanumSquareNeoBold";
}

.lnb-panel {
	display: none;
	background-color: #f8f9ff;
	padding: 0.625rem;
}

.lnb-panel.active {
	max-height: 200px;
	display: block;
}

.panel-tit {
	color: #1d1d1d;
	font-size: var(--font-media);
	font-family: "NanumSquareNeo";
	line-height: 21px;
	padding: 0.5rem 0 0.5rem 1rem;
	letter-spacing: -0.1px;
	position: relative;
	word-break:keep-all;
}
.panel-tit > .dot {
	top: 18px;
	left: 5px;
	background: url(/static/prjt/cmmn/img/middot-small.svg);
	background-size: 2px auto;
	width: 2px;
	height: 2px;
}
/* //lnb */

#container > .contents-wrapping {
	padding: 0 3.3vw;
}
.maincontents-area {
	display: flex;
	justify-content: space-between;
	max-width: var(--otherlayout);
	width: var(--otherlayout);
	margin: 3rem auto 0;
	position: relative;
	gap: 2rem;
}

.maincontents {
	width: 100%;
	position: relative;
}
.maincontents.small {
	width: 80%;
}
/* youthActivity */
.title-area {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 2.75rem;
}
.title-area.rule {
	margin-top: 1.5rem;
}

/* selection-area */
.selection-area {
	display: flex;
	flex-direction: column;
	padding: 2.2rem;
	background-color: #f8f9ff;
	margin-top: 2.5rem;
}
.selection-area.other {
	flex-direction: row;
	justify-content: space-between;
	padding: 2.5rem 0 0;
	position: inherit;
}
.tabs.host.forWeb {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	width: 90%;
	grid-auto-rows: 50px;
	border-radius: 0.125rem 0rem 0rem 0.125rem;
}
.tab.host.all {
	grid-row: span 2;
	border-left: 1px solid #d6dcf7;
}

.tab.host {
	font-size: 15px;
	line-height: 20px;
	color: var(--color-black);
	cursor: pointer;
	background-color: var(--color-white);
	width: 100%;
	height: 100%;
	display: inline-block;
	align-content: center;
	text-align: center;
	border: 1px solid #d6dcf7;
	border-left: none;
	padding: 0 10px;
}
.tab.host:hover {
	background-color: #f8f9ff;
	color: var(--color-primary);
	font-family: "NanumSquareNeoBold";
	text-decoration-line: underline;
	text-underline-offset: 6px;
}

.tab.host.active {
	background-color: var(--color-primary);
	color: var(--color-white);
	font-family: "NanumSquareNeoBold";
	border: 1px solid var(--color-primary);
}
.tab.host.noline {
	border-top: none;
}

.age-inputs {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	width: 90%;
	gap: 0.5rem;
}
.age-inputs > .text-input.num {
	text-align: center;
}
.selection-input {
	width: 90%;
}
.selection-input input {
	border: 1px solid #d6dcf7;
	border-radius: 0.125rem;
	background-color: var(--color-white);
	padding: 0.7rem 1.2rem;
	color: var(--color-black);
	font-size: var(--font-media);
	line-height: 19.6px;
	width: 100%;
}
.sticky-search {
	position: sticky;
	z-index: 1;
	padding: 3.75rem 0 2rem;
	top: 0;
	background-color: var(--color-white);
}
.year-state {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.select-year {
	display: flex;
	align-items: center;
}
.now-year {
	padding: 0 1.19rem;
}
.year-state .arrow {
	width: 2.5rem;
	height: 2.5rem;
	cursor: pointer;
}

.year-state .prev {
	background: url(/static/prjt/cmmn/img/select-yearprev.svg) no-repeat;
	background-size: cover;
}
.year-state .next {
	background: url(/static/prjt/cmmn/img/select-yearnext.svg) no-repeat;
	background-size: cover;
}
.maintit,
.yeartit {
	font-size: 30px;
	font-family: "NanumSquareNeoBold";
	line-height: 42px;
	letter-spacing: -0.3px;
	color: var(--color-black);
}
.tab.state {
	background-color: var(--color-white);
	color: var(--color-black);
	font-size: var(--font-media);
	line-height: 19px;
	border: 1px solid #d6dcf7;
	border-radius: 20px;
	padding: 9px 21px;
	text-align: center;
	min-height: fit-content;
}
.tab.state + .tab.state {
	margin-left: 6px;
}
.tab.state:hover {
	background-color: #f8f9ff;
	color: var(--color-primary);
	font-family: "NanumSquareNeoBold";
}
.tab.state.active {
	background-color: var(--color-primary);
	border: 1px solid var(--color-primary);
	color: var(--color-white);
	font-family: "NanumSquareNeoExtraBold ";
}
.selection > .radio-box {
	width: 90%;
	justify-content: flex-start;
}
/*// selection-area */
.contents-result {
	width: 100%;
	padding: 0.01rem;
	display: flex;
	flex-direction: column;
}

.maincontents .tabcontents {
	width: 100%;
	display: block;
}
.tabcontents{min-height:auto;}
.tabcontents-tit {
	color: var(--color-black);
	font-size: 22px;
	font-family: "NanumSquareNeoBold";
	line-height: 30px;
}

.line.moretop {
	margin-top: 1.75rem;
}
.contents-group {
	display: grid;
	grid-template-columns: repeat(5, 260px);
	gap: 6.5rem 1.5rem;
	margin-top: 1.6rem;
}

.contents {
	width: 100%;
	height: fit-content;
	cursor: default;
}
.contents-banner {
	box-shadow: inset 0 0 0 1px #ddd;
	width: 100%;
	aspect-ratio: 11/ 16;
	object-fit: cover;
	position: relative;
	box-sizing: border-box;
	cursor: pointer;
	overflow:hidden;
}

.contents-banner img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	box-sizing: border-box;
    transition: transform 0.4s ease;
    position: relative;
}
.contents:hover .contents-banner img {
    transform: scale(1.1);
}

.hover-bg {
	opacity: 0;
	visibility: hidden;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(25, 65, 227, 0.9);
	background-size: cover;
	transition: all 0.5s;
	display: none;
}

.contents:hover .hover-bg {
	opacity: 1;
	visibility: visible;
	transition: all 0.5s;
}

.contents-textgroup {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	padding-top: 1.5rem;
}
.value-group {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 0.4rem;
}
.value,
.host {
	font-size: 13px;
	line-height: 15px;
	color: var(--color-black);
}
.value.blue {
	color: var(--color-primary);
}
.banner-tit {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	text-overflow: ellipsis;
	overflow: hidden;
	color: var(--color-black);
	font-size: 17px;
	line-height: 25px;
	max-height: 50px;
	min-height: 50px;
	font-family: "NanumSquareNeoBold";
	cursor:pointer;
}
.contents:hover .banner-tit {
	text-decoration-line: underline;
	text-underline-offset: 1px;
	text-decoration-color: var(--color-primary);
	text-underline-position: from-font;
	color: var(--color-primary);
	font-family: "NanumSquareNeoBold";
}
.info-group {
	display: grid;
	grid-template-columns: 82px auto;
	grid-row-gap: 0.3rem;
	grid-column-gap: 0.3rem;
}

.infotit {
	font-size: 13px;
	line-height: 19px;
	color: var(--color-black);
	font-family: "NanumSquareNeoBold";
}
.infocon {
	font-size: 13px;
	line-height: 19px;
	color: var(--color-black);
	font-family: "NanumSquareNeo";
}

.space-tit {
	color: var(--color-black);
	font-size: 18px;
	line-height: 27px;
	font-family: "NanumSquareNeoBold";
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	cursor:pointer;
}
.space-tit:hover {
	text-decoration-line: underline;
	text-underline-offset: 1px;
	text-decoration-color: var(--color-primary);
	text-underline-position: from-font;
	color: var(--color-primary);
	font-family: "NanumSquareNeoBold";
}
.contents:hover .space-tit {
	text-decoration-line: underline;
	text-underline-offset: 1px;
	text-decoration-color: var(--color-primary);
	text-underline-position: from-font;
	color: var(--color-primary);
	font-family: "NanumSquareNeoBold";
}
/* youthActivity */

/* youthActivityDetail */
.maincontents-group {
	display: flex;
	flex-direction: column;
	max-width: var(--otherlayout);
	margin: 3rem auto 0;
	position: relative;
}
.maincontents-group > .maincontents-area {
	width: 100%;
	margin: 2.5rem auto 0;
	gap: 2.5rem;
}
.maincontents-area.detail .line.blue {
	margin-top: 0;
}
.maincontents.detail {
	width: calc(100% - 540px);
}
.title-area.detail {
	width: 100%;
}
.maincontents.detail>.subinfo{    border-bottom: 1px solid #d6dcf7;}
/* stickycontents*/
/* 0711 박민지 수정 */
.sticky-area {
	max-width: 540px;
	min-height: 30rem;
	height: fit-content;
	border: 1px solid #d6dcf7;
	background-color: var(--color-white);
	margin-top: 0;
	top: 0;
	position: sticky;
	padding: 3.5rem 2.5rem;
}
/* //0711 박민지 수정 */
.stickyline.forMobile {
	display: none;
	background: url(/static/prjt/cmmn/img/ico_dropdownline.svg) no-repeat;
	width: 1.5rem;
	height: 0.0625rem;
	background-size: cover;
	min-height: 0.0625rem;
	margin: 0 auto;
}
.sticky-title {
	position: relative;
	display: flex;
	flex-direction: column;
}
.stickycontents + .stickycontents {
	margin-top: 2rem;
}
.stickycontents.cost {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.stickycontents-title {
	padding: 0.5rem 0;
	cursor: pointer;
}

.stickycontents-tit {
	font-size: 15px;
	font-family: "NanumSquareNeoBold";
	line-height: 22.5px;
	color: var(--color-black);
	background: url(/static/prjt/cmmn/img/select-arrow.svg) no-repeat right center;
}
.stickycontents-title.active > .stickycontents-tit {
	background: url(/static/prjt/cmmn/img/select-arrowup.svg) no-repeat right center;
}
.share {
	background: url(/static/prjt/cmmn/img/share-ico.svg) no-repeat;
	width: 1.5rem;
	height: 1.5rem;
	background-size: cover;
	position: absolute;
	top: 0;
	right: 0;
}
.stickycontents-group {
	padding-top: 1.25rem;
}
.stickycontents-panel {
	border-top: 1px solid #d6dcf7;
	border-bottom: 1px solid #d6dcf7;
	margin-top: 0.25rem;
	display: none;
}
.stickycontents-panel.active {
	display: block;
}
.stickycontents-tit.grade {
	background: none;
}

.stickycontents .buttons {
	padding-top: 0.25rem;
	gap: 0;
}
.stickycontents .btn-box {
	width: 100%;
	border: 1px solid #d6dcf7;
	background-color: var(--color-white);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	flex: 1;
}

.btn-box.space {
	flex-direction: row;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0.75rem 1.88rem;
	height: 3.75rem;
	gap: 0;
}
.btn-box.active {
	border: 1px solid #0134ff;
	background: #f8f9ff;
}

.btn-box.active > .btn-tit {
	color: var(--color-primary);
	font-family: "NanumSquareNeoBold";
}
.btn-box.active > .con {
	color: var(--color-primary);
	font-family: "NanumSquareNeoBold";
}
.btn-box.space > .con {
	padding-top: 0.5rem;
}
/* //stickycontents*/
.infocontents.now {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

.maincontents-area .tabarea {
	padding-top: 3.5rem;
}

.tabcontents-group {
	display: flex;
	flex-direction: column;
	width: 100%;
}
.maincontents.detail .tabcontents {
	padding-top: 3.12rem;
	margin:0;
	}
.subtit,
.program-tit {
	color: var(--color-black);
	font-size: 24px;
	font-family: "NanumSquareNeoBold";
	letter-spacing: 0.24px;
	line-height: 33.6px;
}

.subtit.small {
	font-size: 20px;
	line-height: 28px;
}
.content-box.detail {
	margin-top: 1rem;
	padding: 1.5rem;
	border-top: 1px solid #d6dcf7;
	border-bottom: 1px solid #d6dcf7;
	position: relative;
	width: 100%;
	height: fit-content;
	border-left: none;
	border-right: none;
	border-radius: 0;
}
.content-box.detail > .dot {
	top: 32px;
	left: 25px;
}
.content-box.detail .con{font-size:14px;}
.content-box.detail .con.gray{padding-left:12px;}

.con.state {
	font-family: "NanumSquareNeoBold";
	line-height: 1.25rem;
	color: var(--color-primary);
}
.state.black {
	color: var(--color-black);
}
.state.gray {
	color: #666;
}

.clubmember .main-tit.media {
	font-size: var(--font-media);
	line-height: normal;
	text-align: center;
	text-wrap: wrap;
	overflow: unset;
	display: inline-block;
	max-height: none;
	-webkit-line-clamp: none;
	font-family: "NanumSquareNeo";
}
.con.member.bold {
	font-family: "NanumSquareNeoBold";
}

.cost-tit {
	font-size: var(--font-media);
	color: var(--color-primary);
	font-family: "NanumSquareNeoBold";
	letter-spacing: 0.009rem;
}
.cost-price {
	color: var(--color-black);
	font-size: 24px;
	font-family: "NanumSquareNeoBold";
	line-height: 33.6px;
	letter-spacing: 0.24px;
}
.state-round {
	border: 1px solid var(--color-primary);
	background-color: var(--color-white);
	border-radius: 13px;
	padding: 0.313rem 0.813rem;
	margin-left: 0.938rem;
}
.state-tit {
	font-size: var(--font-tiny);
	line-height: 16.8px;
	letter-spacing: -0.12px;
	color: var(--color-black);
}
.state-con {
	color: var(--color-primary);
}
.sticky-area .buttons.other {
	padding-top: 1.25rem;
	gap: 0.5rem;
}

.other-contents {
	padding-top: 2rem;
	line-height: 1.5;
}
.other-con {
	position: relative;
}
.other-con .dot {
	top: 6px;
	left: 0;
}
.other-contents .con {
	font-size: 13px;
	padding-left: 10px;
	width: 85%;
	display: block;
	line-height: 19.6px;
}
/* //youthActivityDetail */

/* youthClub */
.totalview.only {
	margin: 4.38rem 0 1.94rem 0;
}
.line.blue.zero {
	margin: 0;
}
/* //youthClub */

/* youthClubDetail */
.banner-imgs {
	padding: 3rem 4rem;
}
.banner-imgs img {
	object-fit: cover;
	width: 44.375rem;
	aspect-ratio: 71/100;
}
/* //youthClubDetail */

/* youthClubForm*/
.table1.form th {
	border-bottom: 1px solid #d6dcf7;
	background: #f8f9ff;
}
.table1.form .tit {
	color: var(--color-black);
	font-size: var(--font-media);
	line-height: 19.6px;
	text-align: center;
}
.table1.form .tit:hover {
	text-decoration-line: unset;
}
.table1.form .con {
	color: #444;
	text-align: left;
	font-size: var(--font-media);
	line-height: 19.6px;
}
.clubform .infocontents {
	display: table-cell;
}
.infocontents.clubform {
	padding: 0.19rem 1.56rem;
}
.table1 td.emptyrow {
	padding: 0.5rem 0;
}

/* //youthClubForm*/

/* youthSpace */
.hover-facility {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
}
.facility {
	padding: 0.11rem 0.38rem;
	background-color: #f8f9ff;
	border-radius: 0.25rem;
	min-width: 3.1rem;
	min-height: 1.5rem;
	display: block;
	align-content: center;
}
.facility-txt {
	color: var(--color-black);
	font-size: var(--font-tiny);
	text-align: center;
}
.contents-textgroup.space {
	width: 100%;
}


.age-total {
	color: var(--color-black);
	font-size: 13px;
	line-height: 19.5px;
	font-family: "NanumSquareNeoLight";
	padding-top: 0.5rem;
}
.contents-banner.space {
	aspect-ratio: 16/11;
}

.custom-radio.auto {
	width: auto;
}
/* //youthSpace */
/* youthSpaceDetail */

.space-imgs {
	padding-bottom: 2.5rem;
}
.space-imgs img {
	aspect-ratio: 3/2;
	width: 100%;
	object-fit: cover;
}
.con.space {
	display: -webkit-box;
	text-overflow: ellipsis;
	overflow: hidden;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	max-height: 37px;
	text-wrap: wrap;
}

.tit.red {
	color: #e12121;
}
.tit.large {
	font-size: 20px;
	font-family:"NanumSquareNeoBold";
	line-height: 30px;
	padding-top: 1rem;
	color: var(--color-black);
}
.tit.large.red {
	color: #e12121;
}
.table1 {
	margin-top: 1.5rem;
}
.table1 tr {
	border-color: #d6dcf7;
}
.table1 tr:hover,
.table1 tr.active {
	background-color: transparent;
	transition: none;
}
td {
	text-align: center;
	font-size: var(--font-media);
	color: var(--color-black);
	line-height: 19.6px;
	padding: 20px 0;
}

td.left {
	text-align: left;
	padding: 20px 30px;
}
td.blue {
	color: var(--color-primary);
}

.placeinfos {
	display: grid;
	grid-template-columns: 3.375rem auto;
	padding: 0.625rem 0;
}
.placeinfos .tit {
	color: var(--color-black);
	font-size: var(--font-media);
	line-height: 30px;
}
.placecontent {
	padding-left: 2.5rem;
	align-content: center;
}
.placecontents .con {
	padding-left: 0;
	line-height: 30px;
}
.way-directiongroup {
	padding: 1rem 0;
}
.way-direction {
	gap: 0.5rem;
	display: flex;
	flex-direction: column;
	margin-top: 3rem;
}
.way-direction:first-child {
	margin-top: 0;
}
.way-title {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}
.subway-ico {
	display: block;
	width: 2.18rem;
	height: 2.18rem;
	background: url(/static/prjt/cmmn/img/ico_subway.svg) no-repeat;
	background-size: cover;
}
.bus-ico {
	display: block;
	width: 2.18rem;
	height: 2.18rem;
	background: url(/static/prjt/cmmn/img/ico_bus.svg) no-repeat;
	background-size: cover;
}
.way-tit {
	font-size: 18px;
	font-family: "NanumSqureNeoBold";
	line-height: 40px;
	padding-left: 0.625rem;
}
.content-box.con {
	padding-left: 12px;
}
.con.sub {
	color: #666;
}
.stickycontents-panel.noline {
	border-top: transparent;
	border-bottom: transparent;
}

.stickycontents-panel .btn-tit {
	font-size: 18px;
	color: var(--color-black);
	line-height: 25.2px;
}
.btn-box > .con.price {
	font-size: var(--font-primary);
	line-height: 24px;
	color: var(--color-primary);
	padding-right: 0;
	padding-top: 0;
}
.stickycontents-panel .unit {
	font-family: "NanumGothic";
}
.btn-box.active > .con.price {
	font-family: "NanumSquareNeoBold";
}
.timechoice-group {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 0.4rem;
}
.timechoice {
	border: 0.5px solid #d6dcf7;
	background-color: var(--color-white);
	min-width: 4.8rem;
	min-height: 3.75rem;
	display: flex;
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
	gap: 0.3rem;
}

.time {
	color: var(--color-black);
	font-size: var(--font-media);
}
.timechoice:disabled {
	background-color: var(--color-white);
	margin-top: 0;
}
.timechoice:disabled > .time {
	color: #777;
}
.timechoice .unit {
	font-size: var(--font-tiny);
}
.timechoice > .price {
	color: var(--color-primary);
	font-size: var(--font-tiny);
}
.timechoice:disabled > .price {
	color: #777;
}

.timechoice.active {
	border: 1px solid var(--color-primary);
	background-color: #f8f9ff;
}
.timechoice.active .price {
	color: var(--color-primary);
}
.timechoice.active .time {
	color: var(--color-primary);
	font-family: "NanumSquareNeoExtraBold";
}
/* //youthSpaceDetail */

/* youthEducation */

.selection-group {
	display: flex;
	flex-direction: column;
}
.selection {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	min-height: 3rem;
}
.selection + .selection {
	margin-top: 1.25rem;
}

.selection-title {
	width: 10%;
}
.selection-tit {
	font-size: var(--font-media);
	line-height: 19.6px;
	font-family: "NanumSquareNeoBold";
	color: var(--color-black);
}
.maintit,
.yeartit {
	font-size: 30px;
	font-family: "NanumSquareNeoBold";
	line-height: 42px;
	letter-spacing: -0.3px;
	color: var(--color-black);
}
.categories {
	display: flex;
	width: 90%;
	gap: 0.5rem;
}
.category {
	background-color: var(--color-white);
	flex: 1;
	padding: 0.5rem;
	overflow-y: scroll;
	height: 11rem;
	box-sizing: border-box;
	border: 1px solid #d6dcf7;
	scrollbar-width: thin;
	scrollbar-color: #a4b2e8 #fff;
}
.category::-webkit-scrollbar {
	width: 3px;
}
.category::-webkit-scrollbar-thumb {
	background: #a4b2e8;
	border: 3px solid#a4b2e8;
	border-radius: 10px;
}
.category-name {
	padding: 0.7rem 1rem;
	background-color: var(--color-white);
	border: 1px solid transparent;
	border-radius: 0.375rem;
	cursor: pointer;
}
.category-name.active {
	background-color: #f8f9ff;
}
.category-label {
	width: auto;
}
.category-tit {
	font-size: var(--font-media);
	line-height: 19.6px;
	color: var(--color-black);
}
.category-name.active > .category-tit {
	color: var(--color-primary);
	font-family: "NanumSquareNeoBold";
}
.select-months {
	padding-top: 3.9rem;
	width: 100%;
	display: flex;
}
.selection > .select-months {
	padding-top: 0;
	width: 28.5rem;
}
.months {
	padding: 13px 0 14px;
	background-color: var(--color-white);
	border-bottom: 1px solid #d6dcf7;
	border-top: 1px solid #d6dcf7;
	border-left: 1px solid #d6dcf7;
	flex: 1 0 0;
	cursor: pointer;
}

.months:last-child {
	border-right: 1px solid #d6dcf7;
}
.months-txt {
	color: var(--color-black);
	font-size: 15px;
	line-height: 21px;
	text-align: center;
}
.months:hover {
	background-color: #f8f9ff;
}

.months:hover .months-txt {
	color: var(--color-primary);
	font-family: "NanumSquareNeoBold";
}
.months.active {
	background-color: var(--color-primary);
	border: 1px solid var(--color-primary);
	font-family: "NanumSquareNeoBold";
}
.months.active .months-txt {
	color: var(--color-white);
	font-family: "NanumSquareNeoBold";
}
.selection-area .buttons {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 1.5rem;
}
.selection-area button {
	padding: 0.8rem 2.5rem;
	font-size: 17px;
	line-height: 25px;
	font-family: "NanumSquareNeoExtraBold";
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
}

.selection-area .search {
	color: var(--color-white);
	background-color: var(--color-primary);
}
.selection-area .reset {
	color: var(--color-white);
	background-color: #a4b2e8;
}
.search img,
.reset img {
	width: 24px;
	height: 24px;
	object-fit: cover;
}
.selection-area button + button {
	margin-left: 1.25rem;
}
.divide-tit {
	margin-top: 1rem;
}
.add-tit + .add-tit {
	margin-left: 1.5rem;
}
.table1.edu th {
	padding: 0.7rem 0;
}
.table1.edu td {
	padding: 1.25rem 0.625rem;
}

.table1 td.button {
	display: none;
}

.table1.edu .con {
	font-size: var(--font-media);
	line-height: 19.6px;
}

.now-mem {
	display: flex;
	align-items: center;
	justify-content: space-around;
}
.gonext-mo {
	width: 100%;
	padding: 0.6rem 1.55rem;
	align-content: center;
	color: var(--color-white);
	background: url(/static/prjt/cmmn/img/ico_slidenext.svg) no-repeat right 38% top 45%;
	background-size: 20px auto;
	background-color: var(--color-primary);
	font-size: var(--font-media);
	font-family: "NanumSquareNeoBold";
	line-height: 19.6px;
}
.gonext-mo:disabled {
	background: url(/static/prjt/cmmn/img/ico_slidenextdisabled.svg) no-repeat right 38% top 45%;
	background-color: #ddd;
	background-size: 20px auto;
}
.filterarea {
	background-color: #f8f9ff;
	align-items: center;
	justify-content: space-between;
	border-radius: 0.5rem;
	min-height: 3.75rem;
	padding: 0 0.62rem;
	cursor: pointer;
}
.filter {
	color: var(--color-primary);
	font-size: var(--font-media);
	font-family: "NanumSquareNeoBold";
	background: url(/static/prjt/cmmn/img/ico_filter.svg) no-repeat right 5px center;
	background-size: 20px auto;
	padding-right: 1.75rem;
	text-decoration-line: underline;
	text-decoration-color: var(--color-primary);
	text-underline-offset: 3px;
	text-underline-position: from-font;
}
.con.left {
	text-align: left;
}
/* //youthEducation */

/* youthEducationDetail */
.content-box.edu .con {
	padding-left: 0;
}
.monthlylist-group {
	display: flex;
	flex-direction: column;
}

.monthlylist {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding-top: 0.625rem;
}
.monthlylist:first-child {
	padding-top: 0;
}
.monthlylist-group .tit {
	color: var(--color-black);
	font-size: 20px;
	line-height: 28px;
}

/* 0714 추가 & 수정 */
.boxgroup {
	display: flex;
	flex-wrap: wrap;
	gap: 0.38rem;
	width: calc(100% - 7.5rem);
}
.boxgroup>.box{	padding:4px 12px;}
.box {
	border-radius: 0.125rem;
	border: 1px solid #d6dcf7;
	background-color: var(--color-white);
	width: 7.5rem;
	height:3rem;
	align-content: center;
	text-align: center;
}

/* //0714 추가 & 수정*/
.box.noline {
	border: 1px solid transparent;
}
.box.active {
	border: 1px solid var(--color-primary);
}

.boxgroup .con {
	color: var(--color-black);
	font-size: var(--font-tiny);
	line-height: unset;
	padding-left: 0;
}
.box.disabled{border:1px solid #e12121;}
.box.disabled>.noclass{color:#e12121;}
.box.disabled > .con {
	color: #e12121;;
}
.box.active > .con {
	color: var(--color-primary);
	font-family: "NanumSquareNeoBold";
}
.noclass {
	color: var(--color-primary);
	font-size: var(--font-tiny);
	margin-top:-7px;
}
.box.active > .noclass {
	font-family: "NanumSquareNeoBold";
}
/* //youthEducationDetail */
/* youthActivityForm */
.applyform {
	background-color: var(--color-white);
	border-radius: 0.5rem;
	border: 1px solid #cfd8fa;
	padding: 3.75rem 4.375rem;
	max-width: 860px;
	margin: 0 auto;
	position: relative;
}
.bg {
	background-color: #f8f9ff;
	padding-bottom: 60px;
}
.bg #header {
	background-color: #f8f9ff;
}
.form-maintit {
	font-size: 30px;
	line-height: 42px;
	font-family: "NanumSquareNeoBold";
	letter-spacing: 0.3px;
	color: var(--color-black);
	text-align: center;
}
.form-subtit {
	font-size: 20px;
	line-height: 28px;
	font-family: "NanumSquareNeoBold";
	letter-spacing: 0.2px;
	color: var(--color-black);
}
.form-info {
	margin-top: 2.5rem;
}

.tit-main {
	font-size: var(--font-media);
	line-height: 19.6px;
	color: var(--color-black);
	text-align: center;
}

.infocontents.large.space {
	min-height: 3.5rem;
	padding: 0;
}

input:focus {
	outline: 1px solid #d6dcf7;
}
input::placeholder {
	font-size: var(--font-media);
}

.btn-searchmember {
	border-radius: 0.125rem;
	padding: 0.5rem;
	border: 1px solid #d6dcf7;
	background-color: #f8f9ff;
	text-align: right;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.2rem;
}
.btn-searchmember img {
	width: 16px;
	height: 16px;
	object-fit: cover;
}
.deletemember {
	border: 1px solid #d6dcf7;
	border-radius: 0.8125rem;
	background-color: var(--color-white);
	padding: 0.2rem 0.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.2rem;
	margin: 0 auto;
}
.deletemember.end {
	margin: 0;
}
.deletemember img {
	width: 16px;
	height: 16px;
	object-fit: cover;
}
.addrow {
	margin-top: 0.875rem;
	width: 100%;
	background-color: #f8f9ff;
	border: 1px solid #d6dcf7;
	min-height: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.625rem 0;
}
.addrow img {
	width: 20px;
	height: 20px;
	object-fit: cover;
}

.table1 tr.onlybutton {
	border-bottom: none;
}
.rule-tit {
	font-size: 20px;
	color: #1d1d1d;
	font-family: "NanumSquareNeoBold";
	line-height: 30px;
}


.confirm {
	background-color: var(--color-primary);
	color: var(--color-white);
	padding: 0.75rem 0;
	min-width: 12.5rem;
	font-size: 18px;
	color: var(--color-white);
	line-height: 25.2px;
	letter-spacing: 0.18px;
	font-family: "NanumSquareNeoExtraBold";
	margin: 2.65rem 0;
}

.applyform > .buttons {
	align-items: center;
	justify-content: center;
	padding-top: 3.75rem;
}
.back {
	padding: 0.75rem 0;
	min-width: 15rem;
	min-height: 3.125rem;
	background-color: var(--color-white);
	border: 1px solid #d6dcf7;
	color: var(--color-black);
	font-size: 18px;
	font-family: "NanumSquareNeoBold";
	line-height: 25.2px;
	letter-spacing: 0.18px;
	text-align: center;
	display: block;
	align-content: center;
}
.back.form {
	padding: 0.75rem 0;
	min-width: 15rem;
	min-height: 3.125rem;
	background-color: var(--color-white);
	border: 1px solid #d6dcf7;
	color: var(--color-black);
	font-size: 18px;
	line-height: 25.2px;
}

.gonext {
	padding: 0.8125rem 0;
	min-width: 26rem;
	min-height: 3.75rem;
	background-color: var(--color-primary);
	color: var(--color-white);
	font-size: 24px;
	font-family: "NanumSquareNeoBold";
	line-height: 33.6px;
	letter-spacing: 0.18px;
	text-align: center;
	display: block;
	align-content: center;
}
.gonext.form {
	margin-left: 1.25rem;
	padding: 0.75rem 0;
	min-width: 15rem;
	min-height: 3.125rem;
	font-size: 18px;
	line-height: 25.2px;
}
/* //youthActivityForm */

/* youthSpaceForm */

.spaceform-tit {
	font-size: var(--font-media);
	line-height: 19.6px;
	width: 50%;
	height: 100%;
	padding: 15px 0;
}

.line.right {
	border-right: 1px solid #d6dcf7;
	width: 1px;
	height: 49px;
	margin: 0 20px;
}
.numinput {
	gap: 0.625rem;
}
.line.form {
	margin-top: 1rem;
}
.school-tit {
	color: #2472ef;
	font-size: 13px;
	font-family: "NanumSquareNeoBold";
	line-height: 18px;
	text-decoration-line: underline;
	text-decoration-color: #2472ef;
	text-underline-offset: 3px;
	text-underline-position: from-font;
}
.con.member {
	font-size: var(--font-media);
	color: var(--color-black);
	line-height: 20px;
}

td.check {
	display: flex;
	align-items: center;
	justify-content: center;
}

.con.price {
	text-align: right;
	padding-right: 2.5rem;
}
.con.red {
	color: #e12121;
}
.tit-main.total {
	font-family: "NanumSquareNeoBold";
}
.price.total {
	font-size: var(--font-primary);
	font-family: "NanumSquareNeoBold";
	line-height: 24px;
}
.discount-info {
	margin-top: 1.25rem;
}
/* //youthSpaceForm */

/* mypage */
.contents-result.mypage {
	padding: 0;
}

.onlinebtn-group {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	width: 100%;
	gap: 0.2rem;
	padding-top: 2rem;
}
.onlinebtn-group button {
	width: 100%;
	min-height: 2.5rem;
	font-size: var(--font-media);
	font-family: "NanumSquareNeoBold";
	line-height: 19.6px;
	border-radius: 0.125rem 0rem 0rem 0.125rem;
}
.onlineclass {
	background-color: var(--color-primary);
	color: var(--color-white);
	border: 1px solid transparent;
}

.middlecontents {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: 3.2rem;
	position: relative;
}
.con.add {
	font-size: var(--font-media);
	line-height: 19.6px;
	color: #666;
}

.pay-more {
	gap: 0.25rem;
}
.btn-pay {
	border-radius: 0.125rem;
	background-color: var(--color-primary);
	padding: 0.45rem 1.05rem;
	font-size: var(--font-media);
	color: var(--color-white);
	font-family: "NanumSquareNeoBold";
	line-height: 19.6px;
}
.btn-more {
	border: 1px solid var(--color-primary);
	border-radius: 0.125rem;
	padding: 0.6rem 1.05rem;
	background-color: var(--color-white);
	font-size: 0;
	position: relative;
}
.btn-more::before {
	position: absolute;
	content: "";
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: url(/static/prjt/cmmn/img/ico_morebtn.svg) no-repeat center center;
	background-size: contain;
	width: 1rem;
	height: 1rem;
}
.btn-more:disabled {
	border: 1px solid #ddd;
	background-color: var(--color-white);
}
.btn-more:disabled::before {
	filter: invert(74%) sepia(98%) saturate(1%) hue-rotate(7deg) brightness(97%) contrast(100%);
}

.onlyPop,
.hiddenpop {
	display: none;
}
.hiddenpop {
	width: 100%;
	height: fit-content;
	border: 1px solid #0134ff;
	background: var(--gray-gray-0, #fff);
	box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.12);
	position: relative;
	z-index: 1;
}

.popclose {
	background: url(/static/prjt/cmmn/img/ico_popclose.svg) no-repeat;
	background-size: cover;
	width: 1.25rem;
	height: 1.25rem;
	position: absolute;
	right: -10px;
	top: -10px;
	cursor: pointer;
	z-index: 2;
}
.hiddenpop.other {
	max-width: 16.5rem;
	height: 5rem;
	align-content: center;
}
.btnpopup {
	position: relative;
}
.buttonpop {
	position: absolute;
	height: fit-content;
	right: 0;
	top: 120%;
	z-index: 1;
	width: fit-content;
}

.buttonpop > .buttons {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 0.5rem;
}

.refusepop {
	position: absolute;
	height: fit-content;
	left: 0;
	top: 100%;
	min-width: 16rem;
}

.refusepop-contents {
	height: 100%;
	display: block;
	align-content: center;
}
.refuse-tit {
	font-size: var(--font-tiny);
	color: var(--color-primary);
	font-family: "NanumSquareNeoBold";
	line-height: 18px;
}
.refuse-con {
	font-size: var(--font-tiny);
	color: #1d1d1d;
	font-family: "NanumSquareNeoBold";
	line-height: 18px;
	margin-top: 0.2rem;
}
.state-btn {
	border-radius: 0.25rem;
	background-color: #f8f9ff;
	padding: 0.11rem 0.45rem;
}
.state-btn.round {
	border: 1px solid var(--color-primary);
	border-radius: 0.85rem;
	background-color: var(--color-white);
	padding: 0.2rem 1.1rem;
	text-align: center;
}
.table1 .state-btn.round > .con {
	color: var(--color-primary);
	font-size: 13px;
	line-height: 18px;
	font-family: "NanumSquareNeoBold";
}
.state-btn.round.gray {
	background-color: #ddd;
	border: 1px solid #ddd;
}
.state-btn.round.gray > .con {
	color: var(--color-black);
	font-family: "NanumSquareNeo";
}
.state-btn.round.blue {
	background-color: var(--color-primary);
}
.state-btn.round.lightblue {
	background-color: #a4b2e8;
	border: 1px solid #a4b2e8;
}
.state-btn.round.blue > .con {
	color: var(--color-white);
}
.state-btn.round.lightblue > .con {
	font-family: "NanumSquareNeo";
	color: var(--color-white);
}
.con.gray {
	color: #777;
}
.con.blue {
	color: var(--color-primary);
}
/* //mypage */

/* mypage-history */
.dategroup {
	gap: 0.5rem;
}
.date-inputarea {
	position: relative;
}
.date-input {
	border-radius: 0.125rem;
	border: 1px solid #d6dcf7;
	background: url(/static/prjt/cmmn/img/ico_calendar.svg) no-repeat right 20px center;
	background-size: 16px auto;
	background-color: var(--color-white);
	width: 15rem;
	height: 2.5rem;
	padding: 0.5625rem 1.25rem;
	position: relative;
}
.datepop {
	position: absolute;
	min-width: 17rem;
	min-height: 17.8rem;
	max-width:19rem;
	left: 0px;
	top: 50px;
	height: 5rem;
	display: none;
	border: 1px solid transparent;
	z-index: 1;
}
.datepop.active {
	display: block;
}
.datepop.right {
	left: auto;
	right: 0;
}
.todaydate-con {
	color: var(--color-black);
	font-size: var(--font-media);
	line-height: 19.6px;
	text-align: left;
}
.todaydate-con2 {
	color: var(--color-black);
	font-size: var(--font-media);
	line-height: 19.6px;
	text-align: left;
}
.datepop .date {
	position: absolute;
	z-index: 1;
	width: 100%;
}
.datepop .ui-widget.ui-widget-content {
	padding: 1rem;
}
.datepop .ui-datepicker {
	border: 1px solid transparent;
}

.datepop .ui-datepicker table {
	margin: 0;
}
.datepop .ui-datepicker th span {
	font-size: var(--font-tiny);
}
.datepop .ui-datepicker .ui-state-default {
	width: 1.8rem;
	height: 1.8rem;
	line-height: 1.8rem;
	font-size: var(--font-tiny);
}
.datepop .ui-datepicker .ui-datepicker-header {
	width: 100%;
}
.datepop .ui-datepicker .ui-datepicker-prev {
	left: 38px;
}
.datepop .ui-datepicker .ui-datepicker-next {
	right: 38px;
}
.datepop .ui-datepicker .ui-datepicker-prev .ui-icon,
.datepop .ui-datepicker .ui-datepicker-next .ui-icon {
	background-size: 15px auto;
}
.middlecontents.addinfo {
	align-items: flex-end;
}
.season {
	border-radius: 1rem;
	border: 1px solid var(--color-primary);
	background-color: var(--color-white);
	padding: 0.25rem 0.56rem;
	display: inline-block;
	margin-bottom: 0.25rem;
}
.season > .con {
	font-family: "NanumSqaureNeoBold";
	letter-spacing: -0.0075rem;
}
/* //mypage-history */
/* mypage-club */
.middlecontents.dates {
	justify-content: flex-end;
	align-items: flex-end;
}
.middlecontents.dates .datepop {
	left: auto;
	right: 0;
	z-index: 2;
}
.result-club {
	margin-top: 2rem;
}
.result-club:first-child {
	margin-top: 0;
}
.result-clubtitle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1.56rem 0;
	cursor: pointer;
	z-index: 1;
	position: relative;
	border-bottom: 1px solid #d6dcf7;
}

.clubbtn {
	background: url(/static/prjt/cmmn/img/ico_clubbtn.svg) no-repeat right center;
	width: 1.45rem;
	height: 1.45rem;
	background-size: 18px auto;
	z-index: 2;
}

.club-tit {
	font-size: 20px;
	line-height: 28px;
	color: var(--color-black);
	font-family: "NanumSquareNeoBold";
}
.moblock.club {
	display: none;
	margin-top: 0;
}
.moblock.club.active {
	display: table;
}

/* //mypage-club */
/* mypage-pay */
input[type="checkbox"]:disabled {
	background-color: #d8d8d8;
}
label.disabeld {
	backdrop-filter: invert(100%) sepia(3%) saturate(782%) hue-rotate(264deg) brightness(118%) contrast(95%);
}

.btn-print {
	padding: 0.5rem 1rem;
	border: 1px solid var(--color-primary);
	background-color: var(--color-primary);
	color: var(--color-white);
	font-size: var(--font-media);
	font-family: "NanumSquareNeoBold";
	margin-top: 1.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	width: fit-content;
}
.btn-print img {
	width: 20px;
	height: 20px;
	object-fit: cover;
}

.tit-toast {
	font-size: var(--font-tiny);
	color: #1d1d1d;
	font-family: "NanumSquareNeoBold";
	line-height: 18px;
	margin-top: 0.2rem;
	text-align: center;
}
/* //mypage-pay */

/* mypage-reservelist */
.notice-info {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.3rem;
}
.notice.red {
	color: #e12121;
}
.season.noline {
	border: 1px solid transparent;
	margin-bottom: 0;
}

/* //mypage-reservelist */

/* pay */
.paycontents-group {
	padding-bottom: 1.06rem;
}
.paycontents {
	width: 100%;
	padding: 1.62rem 0;
	border-bottom: 1px solid #d6dcf7;
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
}
.paycontents .host {
	font-size: 13px;
	line-height: 18px;
	color: var(--color-black);
}

.paycontents > .main-tit {
	font-size: 17px;
	line-height: 25.5px;
	color: var(--color-black);
	font-family: "NanumSquareNeoBold";
}
.datecontents {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 0.5rem;
}
.datecontents > .con {
	font-size: 13px;
}
.datecontents > .line {
	width: 1px;
	height: 12px;
	border-left: 1px solid var(--color-black);
}
.price-contents {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	gap: 0.1rem;
}
.original-price {
	font-size: var(--font-tiny);
	line-height: 16.8px;
	letter-spacing: 0.12px;
	font-family: "NanumSquareNeoBold";
	text-align: right;
}
.pay-price {
	font-size: var(--font-primary);
	line-height: 22.4px;
	font-family: "NanumSquareNeoBold";
	color: var(--color-black);
	text-align: right;
}
.smallinfo {
	font-family: "NanumSquareNeoBold";
	letter-spacing: 0.12px;
	text-align: right;
}
.discount-info > .notice.small {
	margin-top: 0.1rem;
}
.qualifyinfo-area {
	width: 100%;
	background-color: #f8f9ff;
	padding: 2.5rem 1.5rem 1.94rem;
	gap: 0.81rem;
	display: flex;
	flex-direction: column;
}
.qualify-tit {
	font-size: 20px;
	line-height: 31px;
	color: var(--color-black);
	font-family: "NanumSquareNeoBold";
	letter-spacing: 0.0125rem;
}
.qualify-smalltit {
	font-size: 18px;
	line-height: 25.2px;
	color: #e12121;
}
.qualify-infogroup {
	width: 100%;
}

.qualify-info {
	font-size: 13px;
	line-height: 18px;
	color: var(--color-black);
	margin-top: 0.2rem;
	position: relative;
	padding-left: 16px;
	word-break: keep-all;
}

.qualify-info:first-child {
	margin-top: 0;
}
.qualify-info > .dot {
	top: 6px;
	left: 5px;
}
.qualify-info.lastcon {
	color: var(--color-black);
	font-family: "NanumSquareNeoBold";
	text-align: right;
	display: none;
}
.qualify-info.lastcon.active {
	display: block;
}
.qualify-info.red {
	color: #e12121;
	margin-right: 0.2rem;
	padding-left: 0;
}
.verify-btn {
	border: 1px solid var(--color-primary);
	color: var(--color-primary);
	background-color: var(--color-white);
	width: 100%;
	min-height: 2.25rem;
	display: block;
	align-content: center;
	font-size: var(--font-media);
	font-family: "NanumSquareNeoBold";
}
.verify-btn.small {
	padding: 0.5rem 1.94rem;
	width: fit-content;
}
.verify-popup,.popup-member{width:auto;}
.personal-input {
	gap: 0.5rem;
}
.verify-toggle {
	width: 100%;
	margin-top: 1.5rem;
}
.verify-toggle > .title-area {
	padding: 0.5rem 0rem;
	cursor: pointer;
	margin: 0;
}
.verify-subtit {
	color: #1d1d1d;
	font-size: 20px;
	line-height: 32px;
	font-family: "NanumSquareNeoBold";
}
.verify-titlebtn {
	background: url(/static/prjt/cmmn/img/ico_clubbtn.svg) no-repeat right center;
	background-size: cover;
	width: 1.625rem;
	height: 1.625rem;
}

.verify-subcontents {
	border: 1px solid transparent;
	background-color: var(--color-white);
	padding: 0;
	overflow: hidden;
	max-height: 0;
	transition: max-height 0.3s ease;
	scrollbar-gutter: stable;
}

.verify-subcontents .verify-inner {
	padding: 0.5rem;
	height: 100%;
	overflow-y: auto;
	scrollbar-width: thin;
}

.verify-subcontents .verify-inner::-webkit-scrollbar {
	width: 3px;
}
.verify-subcontents .verify-inner::-webkit-scrollbar-thumb {
	background: #a4b2e8;
	border-radius: 10px;
}

.verify-subcontents.active {
	max-height: 16rem;
	border: 1px solid #d6dcf7;
}

.verify-toggle .con.small {
	margin-top: 0.2rem;
	width: 100%;
}

.back.form.large {
	font-size: 18px;
	line-height: 25.2px;
	min-height: 3.125rem;
	min-width: 26rem;
	font-family: "NanumSquareNeoBold";
}
.gonext.form.large {
	font-size: 20px;
	line-height: 28px;
	margin-left: 0;
	min-width: 26rem;
	font-family: "NanumSquareNeoBold";
}
/* //pay */
/* payfinish */
.finish {
	background: url(/static/prjt/cmmn/img/ico_finish.png) no-repeat center center;
	width: 3.75rem;
	height: 3.75rem;
	background-size: cover;
	margin: 0 auto 3.12rem auto;
	display: block;
}
/* //payfinish */
/* refund */
.price-btn {
	background: url(/static/prjt/cmmn/img/ico_pricebtn.svg) no-repeat right 5px center;
	background-size: 16px auto;
	padding-right: 1.5rem;
	cursor: pointer;
}
.pay-panel {
	display: none;
}
.pay-panel.active {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
}
.pay-title {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 0.5rem;
}
.pay-title > .con {
	font-size: 13px;
}
.pay-contents {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: flex-start;
	gap: 0.5rem;
}
.pay-contents > .con {
	font-family: "NanumSquareNeoBold";
}
.pay-price.refund {
	color: var(--color-primary);
}
/* //refund */
/* survey */
.btn-survey {
	border-radius: 0.125rem;
	background-color: var(--color-primary);
	padding: 0.45rem 1.05rem;
	min-height: 2.125rem;
	display: block;
	align-content: center;
	font-size: var(--font-media);
	color: var(--color-white);
	font-family: "NanumSquareNeoBold";
	line-height: 19.6px;
}
.btn-survey:focus {
	outline: none;
}
/* //survey */

/* surveypop */
.surveyPop {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 100%;
	height: fit-content;
	padding: 3.75rem 2.5rem 5.25rem;
}

.surveyPop > .subtit {
	font-size: var(--font-primary);
	color: var(--color-primary);
	line-height: 22.4px;
	font-family: "NanumSquareNeoBold";
}
.surveyPop > .maintit {
	font-size: 28px;
	color: var(--color-black);
	line-height: 40px;
	font-family: "NanumSquareNeoBold";
}
.contentbox-group {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.625rem;
	margin-top: 1.69rem;
	width: 100%;
}
.contentbox {
	display: flex;
	flex-direction: column;
	width: 100%;
}
.contentbox.line {
	border: 1px solid #d6dcf7;
	display: flex;
	flex-direction: column;
	padding: 1.25rem;
}
.contentbox-group .title-area {
	margin-top: 0;
	justify-content: space-between;
	align-items: flex-start;
	position: relative;
	gap: 0.69rem;
}
.subname-subadd {
	display: block;
}
.subname {
	padding: 0.31rem 0.81rem;
	border: 1px solid var(--color-primary);
	border-radius: 0.81rem;
	background-color: var(--color-white);
	display: block;
	align-content: center;
	text-align: center;
	font-size: var(--font-tiny);
	color: var(--color-primary);
	line-height: 16.8px;
	font-family: "NanumSquareNeoBold";
}
.subadd {
	font-size: var(--font-tiny);
	color: #e12121;
	font-family: "NanumSquareNeoBold";
	position: absolute;
	right: 0;
	top: 35px;
}
.question-tit {
	font-size: var(--font-primary);
	color: var(--color-black);
	font-family: "NanumSquareNeoBold";
	line-height: 25px;
	flex: 1;
}
.survey-feedback {
	width: 100%;
	display: flex;
	flex-direction: column;
	margin-top: 1rem;
	gap: 0.875rem;
}

.survey-feedback label {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 0.5rem;
	width: 100%;
	cursor: pointer;
}
.survey-feedback label + label {
	margin-left: 0;
}
.survey-feedback .con {
	color: #1d1d1d;
	font-family: "NanumSquareNeoBold";
}

.multi-check {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
	gap: 0.5rem;
}
.answer-more {
	resize: none;
	border: 1px solid #d6dcf7;
	border-radius: 0.125rem;
	background-color: var(--color-white);
	padding: 0.56rem 1.25rem;
	font-size: var(--font-media);
	color: var(--color-black);
	font-family: "NanumSquareNeoBold";
	height: 6.25rem;
	margin-top: 1rem;
}
.answer-more::placeholder {
	color: #666;
}
.answer-more:focus {
	outline: none;
}
.surveyPop > .buttons {
	margin-top: 2.5rem;
	width: 100%;
	align-items: center;
	justify-content: center;
}
/* //surveypop */

/* info */

.personal-infoarea {
	width: 100%;
	height: 11.25rem;
	background-color: #f8f9ff;
	display: block;
	align-content: center;
	position: relative;
	margin-top: 1.56rem;
}
.text-input.birth {
	width: 30rem;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.myinfogroup {
	display: flex;
	flex-direction: column;
	gap: 40px;
	padding-top: 3rem;
}
.myinfogroup .title-area {
	margin-top: 0;
}
.info-subtit {
	color: var(--color-black);
	font-size: 20px;
	line-height: 28px;
	font-family: "NanumSquareNeoBold";
}
.line.blue.other {
	margin-top: 0.81rem;
}
.gonext.form.personal {
	margin: 5rem auto 0 auto;
}

.myinfo.notedit {
	display: block;
}
.subinfo.line.buttons {
	gap: 0.44rem;
}
.myinfo.edit {
	display: none;
}
.horizontal-con.school,
.horizontal-con.timegroup {
	gap: 0.5rem;
}
.timegroup > .datearea {
	width: auto;
}
.title-area > .buttons {
	gap: 0.44rem;
}

.radio-box.info label + label {
	margin-left: 1.5rem;
}

/* //info */

/* account */
.notice-agree.account {
	margin-top: 0.62rem;
	justify-content: center;
	padding: 0.5rem;
}
.notice-icon {
	background: url(/static/prjt/cmmn/img/ico_notice.svg) no-repeat;
	background-size: 16px auto;
	width: 1rem;
	height: 1rem;
	margin-right: 0.5rem;
}
.content-box.account {
	gap: 2.5rem;
}
/* //account */

/* addinfoform */

.form-infogroup {
	display: flex;
	flex-direction: column;
	gap: 2.5rem;
	width: 100%;
	margin-top: 3rem;
}
.form-infogroup > .form-info {
	margin-top: 0;
}
.popup-infocontents.infoform {
	margin-top: 1rem;
	width: 70%;
}
.verify-btn.right {
	margin-left: auto;
}
.form-infogroup > .buttons {
	width: 100%;
	align-content: center;
	justify-content: center;
}
/* //addinfoform */

/* onlinebook */
.maincontents.only {
	width: 100%;
	max-width: var(--sublayout);
	margin: 0 auto;
}
.safeedu-btn {
	padding: 0.45rem 1.15rem;
	font-size: var(--font-media);
	font-family: "NanumSquareNeoBold";
}

.btn-onlinebook {
	display: block;
	align-content: center;
	background-color: var(--color-primary);
	color: var(--color-white);
	padding: 0.45rem 1.55rem;
	font-size: var(--font-media);
	font-family: "NanumSquareNeoBold";
}
.btn-onlinebook:disabled {
	background-color: #ddd;
	border: 1px solid #ddd;
	color: #777;
}
.title-group {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 1rem;
}
.total-num {
	margin-top: 1.3rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
}
.select-choice.online {
	width: auto;
	font-size: var(--font-media);
	color: var(--color-black);
	line-height: 22.4px;
	padding: 0.5rem 0.625rem;
	min-width: 8.75rem;
}
.subtit.online {
	font-size: 20px;
	line-height: 28px;
}
.table1.online tr {
	padding: 1.3rem 0;
}
.todayclass {
	display: none;
}
.todayclass.active {
	display: block;
}
/* selectdays-group */
.selectdays-group {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	margin-top: 3.12rem;
	gap: 0.06rem;
}

.prev.dates {
	background: url(/static/prjt/cmmn/img/ico_prevbtn.svg) no-repeat;
	width: 2.5rem;
	height: 2.5rem;
	background-size: cover;
	display: none;
}
.next.dates {
	background: url(/static/prjt/cmmn/img/ico_nextbtn.svg) no-repeat;
	width: 2.5rem;
	height: 2.5rem;
	background-size: cover;
	display: none;
}

.selectdays {
	display: flex;
	width: calc(100% - 40px);
	padding-bottom: 5px;
	gap: 0.25rem;
	overflow-x: auto;
	scrollbar-width: thin;
	scrollbar-color: #a4b2e8 #fff;
}

.selectdays::-webkit-scrollbar {
	width: 2px;
}
.selectdays::-webkit-scrollbar-thumb {
	background: #a4b2e8;
	border: 2px solid#a4b2e8;
	border-radius: 10px;
}
.days {
	background-color: var(--color-white);
	border: 1px solid #d6dcf7;
	border-radius: 3rem;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	cursor: pointer;
	width: 6.3rem;
	height: 3.75rem;
	min-width: 100px;
}
.days-txt.sub {
	color: var(--color-black);
	font-size: var(--font-tiny);
	line-height: 14.4px;
	text-align: center;
}
.days-txt.main {
	color: var(--color-black);
	font-size: var(--font-media);
	line-height: 16.8px;
	text-align: center;
	padding-top: 0.2rem;
}
.days:hover {
	background-color: #f8f9ff;
	border: 1px solid #d6dcf7;
	border-radius: 3rem;
}

.days:hover .days-txt {
	color: var(--color-primary);
	font-family: "NanumSquareNeoBold";
}
.days.active {
	background-color: var(--color-primary);
	border: 1px solid var(--color-primary);
	border-radius: 3rem;
	font-family: "NanumSquareNeoBold";
}
.days.active .days-txt {
	color: var(--color-white);
	font-family: "NanumSquareNeoBold";
}
/* //selectdays-group */
.todaydate-tit {
	font-size: 24px;
	line-height: 33.6px;
	font-family: "NanumSquareNeoBold";
	letter-spacing: 0.015rem;
	color: var(--color-black);
}
.totalstudent {
	font-size: var(--font-media);
	color: var(--color-black);
	line-height: 19.6px;
	color: var(--color-black);
}
.nowstudent {
	color: var(--color-primary);
	font-family: "NanumSquareNeoExtraBold";
}
.totalstudent-check {
	padding-top: 2rem;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
}
.btn-allclasson {
	padding: 0.5rem 1.2rem;
	border-radius: 0.125rem 0rem 0rem 0.125rem;
	border: 1px solid #d6dcf7;
	background: #fff;
	color: var(--color-black);
	font-size: var(--font-media);
	line-height: 21px;
}
.buttons.onoff {
	align-items: center;
	justify-content: center;
}
.nowclass {
	font-size: var(--font-media);
	line-height: 21px;
	color: #777;
	text-align: center;
	border: 1px solid #d6dcf7;
	background-color: #fff;
	display: block;
	align-content: center;
	padding: 0.35rem 1.61rem;
}
.nowclass.off {
	border-radius: 0.125rem 0rem 0rem 0.125rem;
}
.nowclass.on {
	border-radius: 0 0.125rem 0.125rem 0;
}
.nowclass:hover {
	border: 1px solid #0134ff;
	color: var(--color-primary);
	background: #f8f9ff;
}
.nowclass.on.active {
	background-color: var(--color-primary);
	border: 1px solid var(--color-primary);
	color: var(--color-white);
}
.nowclass.off.active {
	border: 1px solid #0134ff;
	color: var(--color-primary);
	background: #f8f9ff;
}
.buttons.online {
	align-items: center;
	justify-content: center;
	padding-top: 4.25rem;
}

.edu-tit {
	font-size: var(--font-media);
	color: var(--color-black);
	line-height: 22.4px;
	text-wrap: wrap;
	text-overflow: unset;
	overflow: auto;
	text-align: left;
}

.safeedu-contents {
	padding: 0.69rem 1.28rem;
	border-radius: 0.125rem;
	border: 1px solid #d6dcf7;
	background-color: var(--color-white);
	width: 100%;
	min-height: 4.125rem;
	font-size: var(--font-media);
	color: var(--color-black);
	line-height: 21px;
	resize: none;
}
.safeedu-contents::placeholder {
	font-size: var(--font-media);
}

.infocontents.onlineday {
	padding: 0.31rem 1.22rem;
}

/* //onlinebook */

/* clubmember*/
.clubtitle-area {
	margin: 2.56rem 0 2.5rem 0;
}
.host.large {
	font-size: var(--font-primary);
	line-height: 24px;
}
.maintit.medium {
	font-size: 26px;
	line-height: 39px;
	margin-top: 0.44rem;
}
.club-subcontents {
	margin-top: 0.88rem;
	display: flex;
	align-items: center;
	gap: 1rem;
}
.club-subcontents > .line {
	border-left: 0.5px solid var(--color-black);
	width: 1px;
	height: 12px;
}
.tabs.club {
	padding-top: 0;
}
.maincontents.clubmember .tabcontents {
	display: none;
}
.maincontents.clubmember .tabcontents.active {
	display: inline-block;
}
.morebuttons {
	margin-top: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	z-index: 1;
}

.clubmember-tabcontents {
	display: none;
}
.clubmember-tabcontents.active {
	display: block;
}

.table1.clubmember {
	margin-top: 1.75rem;
}
.table1.clubmember .textbtn {
	margin-top: 0;
	display: inline-block;
	padding-left: 0;
}

.popup-infocontents.small {
	margin-top: 0.5rem;
}

.btn-admit {
	visibility: hidden;
}
.notice-group {
	margin-top: 2.5rem;
}
.notice-group > .notice {
	margin-top: 0;
}
.table1.clubactivity {
	margin-top: 3.88rem;
}
.tabcontents-schedule {
	display: block;
}
.tabcontents-schedule.write {
	display: none;
}

.buttons.form {
	justify-content: center;
	padding-top: 4.38rem;
}
.form-infogroup.clubedit {
	margin-top: 0;
	gap: 3.75rem;
}
.form-infogroup.clubedit > .form-info {
	margin-top: 0;
}
/* //clubmember*/

/* youthClubActivityForm*/
.subtit.clubactivity {
	margin-top: 2.5rem;
}
.datearea {
	display: flex;
	gap: 0.3rem;
}

.editorarea {
	padding: 0.62rem;
}
.safeedu-contents.large {
	width: 100%;
	min-height: 18.75rem;
	text-align: left;
}
.clubwrite .buttons {
	position: relative;
	justify-content: center;
	padding-top: 4.3rem;
}

.title-area.yearschedule {
	margin: 2.5rem 0 1rem 0;
	flex-direction: row;
}
.clubactivity.titlearea {
	margin: 3.5rem 0;
}
.subtitlearea {
	padding-top: 1rem;
}
.button.list {
	margin: 4.38rem auto 0 auto;
}
/* //youthClubActivityForm*/

/*footer 수정 */

.footer-corp{margin-top:0;}

.footer-contents {
	max-width: var(--otherlayout);
	width: 100%;
	margin: 0 auto;
}
.footer.forMobile .line-full {
	margin: 2.5rem 0;
}
.footer-maininfo {
	margin-bottom: 1.72rem;
}

.footer.select-information {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	padding-top: 2.25rem;
}
.infogroup-copy {
	display: flex;
	flex-direction: column;
}
.step.forMobile {
	margin-top: 20px;
	position: sticky;
	bottom: 0;
	z-index: 2;
	display: none;
}
.nextstep {
	width: 100%;
	min-height: 60px;
	text-align: center;
	align-items: center;
	justify-content: center;
	align-content: center;
	font-size: 20px;
	line-height: 28px;
	letter-spacing: 0.2px;
	color: var(--color-white);
	z-index: 5;
	font-weight: "NanumSquareNeoBold";
	background-color: var(--color-primary);
}
/* 2025-07-11 천재우 */
.box-tit {
    font-size: 17px; padding:10px 0; font-family: var(--font-bold)
}

.schedule-box {
    width:100%; display: flex; margin-bottom: 50px; border: 1px solid #eaeaea;
}
.calendar-box {
    width:100%; padding:10px;

    -ms-user-select: none;
    -moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}
.time-select-box {
    width: calc(100% - 200px ); border-left: 1px solid #eaeaea; margin-left:15px; padding:8px; overflow: hidden; overflow-y: auto; height:365px;
}
.time-select-box ul {
    display: flex; flex-direction: column; flex-wrap: wrap; width:100%
}
.time-select-box ul li {
    border-bottom: 1px solid #eaeaea; padding:7px 2px; width:100%; text-align: center; cursor: pointer; font-size: 13px;
    	-ms-user-select: none;
    	-moz-user-select: -moz-none;
    	-khtml-user-select: none;
    	-webkit-user-select: none;
    	user-select: none;
}
.time-select-box ul li.selected {
    background-color: #1333f5; color:#fff; font-weight: bold; bord
}
.time-select-box ul li:disabled {
    background-color: #d0f0ff; font-weight: bold; bord
}
.time-select-box li[disabled] {
    background-color: #f5f5f5; color: #c9c9c9; border-style: dashed; cursor: not-allowed; pointer-events: none;
}
/* 2025-07-11 천재우 */


/*//footer 수정 */

@media screen and (max-width: 1280px) {
	.lnb {
		display: none;
	}
	.maincontents-area {
		margin: 2rem auto 0;
		width:100%;
		min-width:auto;
	}
	.maincontents,
	.maincontents.small {
		width: 100%;
		padding: 0;
	}
	.title-area {
		margin: 0;
	}
	.selection-area {
		padding: 2rem;
	}
	.selected-item {
		background: url(/static/prjt/cmmn/img/ico_dropdownarrow.svg) no-repeat right 0px center;
		background-size: 16px auto;
		padding-right: 20px;
	}
	.selection-area.other {
		padding: 2rem 0 0;
	}
	.tab.host {
		font-size: 13px;
	}
	.dropdown {
		padding: 0.938rem 0.625rem;
	}
	.item {
		font-size: var(--font-media);
	}

	.banner-tit {
		font-size: var(--font-primary);
		line-height: 24px;
	}
	.maincontents-group {
		width: 100%;
		margin: 2rem auto 0 auto;
	}
	.maincontents-group > .maincontents-area {
		flex-direction: column;
		margin: 2rem auto 0;
	}
	.maincontents.detail {
		width: 100%;
		padding: 0;
	}
	.result-club {
		margin-top: 0;
	}
	.table1.club {
		margin-bottom: 2rem;
	}
	/* sticky-area */
	.sticky-area {
		max-width: 100%;
		margin-left: 0;
	}
	.stickycontents-group {
		padding-top: 0.7rem;
	}
	.stickycontents .btn-box {
		height: 4rem;
	}
	.sticky-area .buttons {
		padding-top: 0.8rem;
	}
	.stickycontents-panel .btn-tit {
		font-size: var(--font-primary);
	}
	/* sticky-area */
	.cost-price {
		font-size: 21px;
	}
	.banner-imgs {
		padding: 3rem 0;
	}
	.space-imgs img {
		width: 100%;
	}
	.banner-imgs img {
		width: 100%;
	}
	.contents-group {
		grid-template-columns: repeat(4, 1fr);
	}
	td.left {
		padding: 20px 45px;
	}

	.btn-box > .con.price {
		font-size: var(--font-media);
	}
	.triangle-dropdown {
		min-width: 120px;
	}
	.applyform > .title-area {
		margin-top: 2.75rem;
	}
	.applyform > .title-area.rule {
		margin-top: 1.5rem;
	}
	.timegroup > .datearea {
		min-width: 8rem;
	}
	/* selectdays-group */
	.selectdays-group {
		gap: 0;
		width: 100%;
		justify-content: space-between;
		margin-top: 2.75rem;
	}
	.selectdays {
		gap: 0.45rem;
	}
	/* //selectdays-group */
	.gonext.form.personal {
		margin: 4rem 0 0 0;
		width: 100%;
	}
	/* footer */
	/* 0715 수정 */
	.footer-bottom{flex-direction:column;}

	#footer > .contents-wrapping {
		padding: 15vw 3.3vw 2vw 3.3vw;
	}
	.footer-other {
		display: flex;
		flex-direction: column;
		order:1;
	}
	.footer-infogroup{order:2;}
		/* //0715 수정 */
	.footer-infogroup li{margin-right:24px;}
	.footer.select-information {
		flex-direction: column;
	}
	.infogroup-copy {
		width: 100%;
		order: 2;
		padding-top: 2.25rem;
	}

	.scroll-top {
		display: none;
	}
	.search-result .tit {
		font-size: var(--font-media);
	}
	/* 0711 박민지 수정 */
	.familysite-select {
		width: 100%;
		min-width: 10rem;
		height: 3.5rem
	}

	/* //0711 박민지 수정 */
	/* //footer */
}
@media screen and (max-width: 1080px) {
	.age-membertotal {
		flex-direction: column;
		padding-top: 0.5rem;
	}
	.agerange,
	.memtotal {
		width: 100%;
		display: block;
		font-size: var(--font-tiny);
	}
	.date {
		font-size: 2rem;
	}
	td.left {
		padding: 20px 30px;
	}


	.contents-group {
		grid-template-columns: repeat(3, 1fr);
	}

	.count.num,
	.count.sum {
		flex-direction: column;
		align-items: center;
	}

	.category-tit {
		font-size: 13px;
		line-height: 18px;
	}
	/* youthEducation */
	.table1.edu td {
		padding: 1.25rem 0.25rem;
	}

	.table1.edu .con {
		font-size: 13px;
		line-height: 18px;
	}

	.table1.edu .main-tit {
		font-size: 13px;
		line-height: 18px;
		max-height: 2.25rem;
	}
	/*// youthEducation */
	.btn-pay {
		font-size: 13px;
	}

	.btn-survey {
		width: 100%;
		min-height: 2.15rem;
	}
	.timegroup > .datearea {
		min-width: 6.1rem;
	}
	.date-input {
		width: 13rem;
		padding: 0.5625rem 0.5rem;
		background: url(/static/prjt/cmmn/img/ico_calendar.svg) no-repeat right 10px center;
	}
	.todaydate-con {
		font-size: 13px;
		line-height: 18px;
	}
	.todaydate-con2 {
		font-size: 13px;
		line-height: 18px;
	}

	.btn-onlinebook,
	.safeedu-btn {
		font-size: 13px;
	}

	.middlecontents {
		padding-top: 2.5rem;
	}
	.popup-infocontents.infoform {
		width: 100%;
	}
	/* selectdays-group */
	.selectdays {
		overflow-x: auto;
		gap: 0.4rem;
	}
	.days {
		width: auto;
		min-width: 5.5rem;
		height: 3.35rem;
	}
	.days-txt.sub {
		font-size: 11px;
		line-height: 16.5px;
	}
	.days-txt.main {
		font-size: 13px;
		line-height: 18px;
		padding-top: 0.1rem;
	}

	/* //selectdays-group */
	.table1.form .con,
	.table1.form .tit {
		font-size: 13px;
	}

	.input-grade {
		padding-left: 0.69rem;
	}
	.maintit.medium {
		font-size: 22px;
	}
	.clubtitle-area {
		margin: 2.06rem 0 2rem 0;
	}
	.morebuttons {
		margin-top: 2rem;
	}

	.clubwrite .buttons,
	.buttons.form {
		padding-top: 3rem;
	}
	.form-infogroup.clubedit {
		gap: 3rem;
	}
}
@media screen and (max-width: 768px) {
	.maincontents {
		padding: 0;
	}
	.maincontents-area {
		margin: 1.5rem auto 0;
	}
	.maintit {
		font-size: 26px;
		line-height: 40px;
	}
	.now-year {
		padding: 0 0.6rem;
	}
	.maincontents-group > .maincontents-area {
		margin: 1.5rem auto 0 auto;
	}

	.space-imgs {
		padding-bottom: 1.5rem;
	}
	.title-area {
		flex-direction: column;
		align-items: flex-start;
		margin: 0 0 1rem;
	}
	.title-area.other {
		flex-direction: row;
	}
	.line.blue {
		margin-top: 0.75rem;
	}
	.year-state .arrow {
		width: 2rem;
		height: 2rem;
	}

	.mBc {
		padding: 0.5rem 0 0 0.3rem;
		justify-content: flex-start;
	}

	.tab.state {
		padding: 6px 18px;
		font-size: 13px;
	}
	.selection-area {
		padding: 1.5rem 0;
	}
	.selection-area.other {
		padding: 1.5rem 0 0;
	}
	.content-box.detail {
		padding: 1rem 0.25rem;
		min-height:200px;
		margin-bottom:3rem;
	}
	.btn-onlinebook {
		width: 100%;
		padding: 0.7rem 1.55rem;
		font-size: var(--font-primary);
	}
	/*youthActivity */
	.tabs.host.forWeb {
		display: none;
	}
	.tabs.host.forMobile {
		width: 100%;
	}
	.age-inputs {
		width: 100%;
	}
	.select-months {
		-ms-overflow-style: none;
		scrollbar-width: none;
		overflow-x: auto;
		padding-top: 1.5rem;
	}
	.select-months::-webkit-scrollbar {
		display: none;
	}
	.value-group {
		flex-wrap: wrap;
	}
	.value {
		font-size: 11px;
	}
	.value.full {
		width: 100%;
	}
	.infocon,
	.infotit {
		font-size: 11px;
	}
	.months {
		min-width: 3.125rem;
	}
	.banner-tit {
		font-size: var(--font-media);
		line-height: 21px;
		max-height: 42px;
		min-height: 42px;
	}
	.info-group {
		grid-template-columns: 52px auto;
	}
	/* //youthActivity */
	.safeedu-contents.large {
		min-width: 12.75rem;
	}

	.info-subtit {
		font-size: 18px;
	}
	.contents-textarea {
		align-items: center;
		flex-direction: column;
		padding-top: 1rem;
	}
	.infocontents.clubform {
		padding: 0.19rem 0.6rem;
	}
	.host {
		font-size: 11px;
	}
	/* 0711 박민지 수정 */
	.sticky-area {
		min-height: auto;
	}
	/* //0711 박민지 수정 */

	.btn-small {
		padding: 0.3rem 1.3rem;
		min-width: 4rem;
		font-size: 13px;
		line-height: 18px;
	}
	.text-input.birth {
		width: 90%;
	}

	.notice-group {
		margin-top: 1.75rem;
	}
	.bus-ico,
	.subway-ico {
		width: 1.5rem;
		height: 1.5rem;
	}
	.monthly {
		margin-bottom: 0.25rem;
	}

	.date-input.left + .datepop {
		left: 0;
		left: auto;
	}
	.date-input.right + .datepop {
		right: 0;
		left: auto;
	}
	.date {
		font-size: var(--font-big);
	}

	.contents-textgroup {
		padding-top: 0;
		gap: 0.3rem;
	}
	.applyform {
		max-width: 100%;
		padding: 1rem;
	}

	.infocontent {
		padding-left: 1.5rem;
	}

	.monthlylist {
		padding-top: 1rem;
		flex-direction: column;
		align-items: flex-start;
	}
	.monthlylist-group .tit {
		font-size: var(--font-primary);
	}
	/* 0714 수정 */
	.boxgroup {
		margin-left: 0;
		width:100%;
	}
	.boxgroup>.box{padding:3px 6px;}
	.box {
        width: 6.8rem;
        height: 2.8rem;
    }
	/* //0714 수정 */
	.box.noline {
		text-align: left;
		height:auto;
	}

	td.left {
		padding: 15px 5px;
	}
	.table1 td {
		padding: 15px 0;
		font-size: 13px;
		line-height: 18px;
	}

	.tit.large.space {
		padding-top: 0;
		font-size:18px;
	}
	.table1 .con.light {
		color: #777;
	}
	.maincontents-area .tabarea {
		padding-top: 2rem;
	}
	.maincontents.detail .tabcontents {
		padding-top: 2rem;
		margin-bottom:3rem;
	}

	.line-full {
		margin: 1rem 0;
	}
	.placecontent > .con {
		line-height: 30px;
	}
	.way-tit {
		font-size: var(--font-primary);
		line-height: 22px;
	}
	.now-mem {
		justify-content: flex-end;
	}
	.now-mem > .line,
	.datearea > .line {
		width: 1px;
		height: 12px;
		margin: 0 5px;
		border-left: 1px solid #aaa;
	}

	.step.forMobile {
		display: flex;
		bottom: 0;
		margin-top: 0;
	}
	/* 상세페이지 스티키 영역 & 교육 모바일 */

	/*0807 z-인덱스 수정*/
	.sticky-area,
	.selection-area {
		position: fixed;
		left: 0;
		top: auto;
		bottom: 0;
		width: 100%;
		max-height: calc(100% - 200px);
		height: auto;

		transform: translateY(100%);
		transition: transform 0.3s ease-in-out;
		z-index: 100;
		display: none;
		flex-direction: column;
		border-top-left-radius: 16px;
		border-top-right-radius: 16px;
		box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
		box-sizing: border-box;
		scrollbar-gutter: stable;
		padding: 1rem 0 0 0;
	}
	/*//0807 z-인덱스 수정*/
	.sticky-area.active,
	.selection-area.active {
		padding: 1rem 0;
		transform: translateY(0);
		display: flex;
	}
	.sticky-area {
		background-color: var(--color-white);
	}

	.stickycontents-area::-webkit-scrollbar {
		width: 3px;
	}
	.stickyline-area {
		padding: 0 0 20px;
	}
	.stickycontents-area {
		overflow-y: auto;
		padding: 0 2rem;
	}
	.stickycontents-area::-webkit-scrollbar-thumb {
		background: #a4b2e8;
		border: 3px solid#a4b2e8;
		border-radius: 10px;
	}
	.sticky-area .buttons {
		padding-top: 0.5rem;
	}
	.sticky-area .buttons.choices {
		padding-top: 0.25rem;
	}

	.share {
		width: 1rem;
		height: 1rem;
	}

	.category-label {
		width: 30%;
	}
	/*// youthEducation */

	/* //상세페이지 스티키 영역 & 교육 모바일 */
	.select-months > .months {
		min-width: 2.75rem;
	}

	.other-contents {
		padding-top: 1rem;
		margin-bottom: 2.5rem;
	}
	.other-contents .con {
		width: 100%;
		font-size: var(--font-tiny);
		line-height: 18px;
	}
	.subtit,
	.program-tit {
		font-size: 21px;
	}
	.clubtitle-area {
		margin: 1.5rem 0;
	}
	.safeedu-btn {
		padding: 0.4rem;
		font-size: var(--font-tiny);
	}
	.totalview{order:1;}
	.safeedu-btn:disabled {
		display: none;
	}
	.datecontents {
		gap: 0.3rem;
	}
	.form-maintit {
		font-size: 21px;
	}
	.form-subtit {
		font-size: var(--font-primary);
	}
	.qualify-tit {
		font-size: 17px;
	}

	.applyform > .title-area,
	.applyform .title-area {
		flex-direction: row;
		align-items: center;
	}

	.subinfo.extralarge .con {
		font-size: var(--font-tiny);
		line-height: 18px;
	}
	.map-image {
		height: 10rem;
	}
	.space-info {
		min-height: 2.2rem;
	}
	.cost-price {
		font-size: 19px;
	}
	.tit-main {
		font-size: 13px;
	}
	input::placeholder {
		font-size: var(--font-tiny);
	}
	.rule-tit {
		font-size: var(--font-primary);
		line-height: 22px;
	}

	.timechoice-group {
		grid-template-columns: repeat(3, 1fr);
	}

	.gonext {
		min-width: 12rem;
		min-height: 3.125rem;
		font-size: 19px;
		line-height: 28px;
		padding: 0.5rem 0;
	}
	.back {
		min-width: 12rem;
		min-height: auto;
		max-height: 2.8rem;
		font-size: var(--font-primary);
		line-height: 20px;
	}
	.gonext.form,
	.back.form {
		min-width: 45%;
		width: 45%;
		min-height: 3rem;
		font-size: var(--font-primary);
		line-height: 24px;
	}

	.gonext.form.large,
	.back.form.large {
		width: 100%;
		min-width: auto;
		min-height: 3.125rem;
		font-size: var(--font-primary);
		line-height: 24px;
	}

	.line.right {
		margin: 0 8px;
	}
	.numinput {
		gap: 0.3rem;
	}

	.layer-tit {
		padding-top: 1.6rem;
		font-size: var(--font-big);
	}
	.confirm {
		margin: 2rem 0;
	}

	.title.club,
	.clubinfo {
		min-height: 2.75rem;
		padding: 0.25rem 0.8rem;
	}
	.clubinfo input {
		min-height: 2.2rem;
		padding: 0;
		padding-left: 1rem;
	}
	.clubinfo select {
		min-height: 2.2rem;
		padding: 0;
		padding-left: 1rem;
	}
	.middlecontents.addinfo {
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
	}
	.addinfo > .totalview {
		padding-top: 0.5rem;
	}

	.form-info .gender-select.club {
		min-width: 3.2rem;
		padding: 0.1rem;
	}
	.filecontents {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.5rem;
		justify-content: center;
	}
	.forMobile {
		display: block;
	}
	.table1.edu td.full-width {
		width: 100%;
	}
	.filterarea {
		display: flex !important;
		margin-top: 1.5rem;
	}

	.selection {
		flex-direction: column;
		gap: 0.5rem;
	}
	.selection-title {
		width: 100%;
	}
	.categories,
	.selection > .select-months,
	.selection-input {
		width: 100%;
	}

	.selection-input input {
		min-width: 100%;
	}

	.categories.forWeb {
		display: none;
	}
	.category-selectgroup {
		display: flex;
		flex-direction: column;
		width: 100%;
		gap: 0.3rem;
	}
	.category-select {
		width: 100%;
		border: 1px solid #d6dcf7;
		padding: 10px 15px 10px 10px;
		appearance: none;
		-webkit-appearance: none;
		-moz-appearance: none;
		background-color: var(--color-white);
		font-size: 15px;
		color: var(--color-black);
		display: flex;
		min-height:47px;
	}
	.category-select option {
		width: 100%;
	}
	.category-select:focus {
		outline: 1px solid #d6dcf7;
	}

	.selection-area .search {
		background-color: var(--color-primary);
	}
	.selection-area .reset {
		background-color: #a4b2e8;
	}
	.selection-area .buttons {
		margin-top: 1.5rem;
		margin-bottom: 3rem;
	}

	.selection-area button {
		line-height: normal;
		font-size: var(--font-primary);
		padding: 0.8rem 1.5rem;
		min-width: auto;
	}
	.selection + .selection {
		margin-top: 1rem;
	}
	.months.small {
		max-height: 3rem;
	}
	.months.small > .months-txt {
		font-size: var(--font-media);
		line-height: 19.6px;
	}

	.table1.edu thead {
		display: none;
	}
	.table1.edu tr {
		display: flex;
		flex-wrap: wrap;
		padding: 1.88rem 0.5rem;
	}
	.table1.edu col {
		width: 100%;
	}
	.table1.edu td {
		width: 50%;
		padding: 0;
	}
	.table1.edu td + td {
		margin-top: 0.5rem;
	}
	.table1.edu td.button {
		margin-top: 1rem;
	}
	.table1.moblock.club td + td {
		margin-top: 0.3rem;
	}

	.table1.edu .con {
		text-align: left;
	}
	.table1.edu .con.state {
		text-align: center;
	}
	.table1.edu .noresult {
		text-align: center;
	}

	.table1.edu .main-tit {
		font-size: 17px;
		line-height: 25.5px;
		max-height:3rem;
	}
	.stickycontents + .stickycontents {
		margin-top: 1rem;
	}
	.hour {
		padding-left: 0.3rem;
	}

	.clubmember .main-tit.media {
		font-size: var(--font-tiny);
		line-height: 16.8px;
	}
	.title-area.yearschedule {
		margin-top: 1.5rem;
	}
	.table1 td.button {
		display: block;
		margin-top: 0.62rem;
	}
	.season {
		margin-bottom: 0;
	}
	.middlecontents {
		padding-top: 2.5rem;
	}

	.clubmember .main-tit {
		font-size: 17px;
		line-height: 25.5px;
	}
	.table1.form .con,
	.table1.form .tit {
		font-size: var(--font-tiny);
	}
	.con.member {
		font-size: var(--font-tiny);
	}
	.date-con {
		display: flex;
		gap: 0.2rem;
	}
	.history .date-con {
		gap: 0.3rem;
		align-items: center;
	}

	.datearea,
	.periodarea {
		gap: 0.3rem;
		width: 100%;
	}
	.pay-more {
		width: 100%;
	}
	.btn-pay {
		flex: 1;
		font-size: 16px;
		line-height: 24px;
	}

	.onlyPop {
		display: block;
	}
	.onlyPop > .textbtn {
		text-align: left;
		width: 100%;
		padding-left: 0;
	}
	.spaceform-tit {
		font-size: var(--font-tiny);
		line-height: 17px;
	}
	.totalview.only {
		margin: 1.75rem 0 1rem 0;
	}
	.discount-info > .notice.small {
		font-size: var(--font-tiny);
		line-height: 17px;
	}
	.selection > .radio-box {
		width: 100%;
	}
	.finish {
		margin: 1rem auto 1rem auto;
		width: 3rem;
		height: 3rem;
	}

	.datecontents > .con {
		font-size: var(--font-tiny);
	}

	.btn-pay.reserve {
		width: 100%;
	}

	.middlecontents {
		padding-top: 1rem;
	}

	.notice {
		font-size: var(--font-tiny);
		line-height: 16.8px;
	}
	.totalview {
		font-size: var(--font-tiny);
	}
	.bluenum {
		font-size: var(--font-tiny);
	}
	.club-tit {
		font-size: 18px;
		line-height: 28px;
	}
	.btn-print.forWeb {
		display: none;
	}
	.date-input {
		width: 8rem;
		background: url(/static/prjt/cmmn/img/ico_calendar.svg) no-repeat right 15px center;
		background-size: 13px auto;
		padding: 0.5625rem;
	}
	.contents-group {
        grid-template-columns: repeat(2, 46%);
        gap: 3.5rem 1.25rem;
	}
	.contentbox-group .title-area {
		margin: 0;
		flex-direction: row;
	}
	.contentbox-group .title-area.subgroup {
		flex-direction: column;
	}
	.question-tit {
		font-size: var(--font-media);
		line-height: 19.6px;
		order: 2;
	}

	/* survey */
	.btn-survey {
		min-height: 2.375rem;
		background: url(/static/prjt/cmmn/img/ico_slidenext.svg) no-repeat right 45% center;
		background-size: 20px auto;
		background-color: var(--color-primary);
	}
	.btn-survey:disabled {
		background: url(/static/prjt/cmmn/img/ico_slidenextdisabled.svg) no-repeat right 45% center;
		background-size: 20px auto;
		background-color: #ddd;
		color: #777;
	}
	/* //survey */

	/* surveyPop */
	.surveyPop {
		padding: 3.75rem 1.25rem 5.25rem;
	}
	.surveyPop > .maintit {
		font-size: 23px;
		line-height: 38px;
		padding-top: 0.2rem;
	}
	.survey-feedback .radio-btn {
		width: 1rem;
		height: 1rem;
	}
	.subname-subadd {
		gap: 0.5rem;
		display: flex;
		align-items: center;
		justify-content: flex-end;
		order: 1;
		width: 100%;
	}
	.subname {
		order: 2;
		line-height: normal;
	}

	.subadd {
		font-size: 11px;
		order: 1;
		position: unset;
	}
	.surveyPop > .buttons {
		position: relative;
	}
	/* //surveyPop */

	.hiddenpop.other {
		max-width: 14rem;
	}
	.dategroup {
		gap: 0.5rem;
		margin-bottom: 0.5rem;
	}
	.todaydate-con {
		font-size: var(--font-tiny);
		line-height: 18px;
	}
	.todaydate-con2 {
		font-size: var(--font-tiny);
		line-height: 18px;
	}
	.myinfogroup .title-area {
		flex-direction: row;
	}
	.radio-box.info label + label {
		margin-left: 0.3rem;
	}
	.club-subcontents {
		margin-top: 0.4rem;
	}
	.personal-infoarea {
		height: 9.25rem;
	}
	.gonext.personal {
		margin-top: 3rem;
	}
	.table1.form th {
		padding: 10px;
	}
	/* onlinebook-teacher */
	.middlecontents.addDate {
		align-items: flex-start;
		justify-content: space-between;
	}
	.subtit.online {
		font-size: 18px;
	}
	.todaydate-tit {
		font-size: 21px;
	}
.verify-popup,.popup-member{width:90%;}
	.selectdays {
		gap: 0.2rem;
	}
	.middlecontents.todaystudent {
		padding-top: 2.5rem;
	}
	.days-txt.sub {
		font-size: 10px;
		line-height: 15px;
	}
	.days.active .days-txt {
		font-size: var(--font-tiny);
	}
	.nowclass {
		flex: 1;
	}
	/* //onlinebook-teacher */

	.safeedu-contents {
		padding: 0.5rem 0.8rem;
		font-size: var(--font-tiny);
		line-height: 18px;
	}

	.safeedu-contents::placeholder {
		font-size: 13px;
	}
	.table1 .state-btn > .con {
		font-size: var(--font-tiny);
		line-height: 16.8px;
	}
	.gonext.member {
		font-size: var(--font-media);
		line-height: 19.6px;
		margin-top: 2rem;
		min-width: 11rem;
		min-height: 2.75rem;
	}
	.gonext.form.personal {
		margin: 3rem auto 0 auto;
	}
	.notice-agree.account {
		align-items: center;
	}
	.sticky-search {
		padding: 1.5rem 0;
	}
	.year-state {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.5rem;
	}
	.yeartit {
		font-size: 21px;
	}
	.maintit.medium {
		font-size: 18px;
	}

	.content-box.detail > .dot {
		top: 24px;
		left: 17px;
	}
	.table-group {
		display: block;
	}
	/* youthClubmember */
	.clubmember .buttonpop {
		right: auto;
		left: 0;
	}
	.table1.clubactivity.line {
		border-right: none;
	}
	.table1.clubactivity.notitle {
		margin-top: 0;
		border: none;
	}
	.table1.clubactivity.notitle thead {
		display: none;
	}
	.vertical-con.clubactivity {
		flex-direction: column;
		align-items: center;
	}
	.clubactivity.titlearea {
		margin: 2.5rem 0;
	}
	/* //youthClubmember */
	.subtitlearea {
		padding-top: 0.5rem;
	}
	.clubwrite .buttons,
	.buttons.form {
		padding-top: 2rem;
	}
	.stickyline.forMobile {
		display: block;
	}

	.personal-input {
		gap: 0.3rem;
	}
	.form-infogroup.clubedit {
		gap: 2.75rem;
	}
	.way-direction {
		margin-top: 2rem;
	}
	.con.state {
		font-size: var(--font-tiny);
	}
	.table1.edu .con {
		font-size: var(--font-tiny);
	}
	.space-tit {
		font-size: var(--font-media);
		line-height: 21px;
	}
	.value-group {
		gap: 0.3rem;
	}
	.way-directiongroup {
    padding: 1rem 0 0;
}
	/* footer */
	#footer > .contents-wrapping {
		padding: 15vw 3.3vw 2vw 3.3vw;
	}
	.footer.select-information {
		padding-top: 0.8rem;
	}
	.footer-maintit {
		font-size: 11px;
		line-height: 16px;
	}
	.infogroup-copy {
		padding-top: 0.8rem;
	}

	.footer-maininfo a::after {
		right: -18px;
		top: 2px;
	}
	/* //footer */
}