/* 서브 비주얼 */
#visual.visual1 .bg{ background: url("/img/sub/academy_bg.jpg") no-repeat center center / cover; }
#visual.visual2 .bg{ background: url("/img/sub/program_bg.jpg") no-repeat center center / cover; }
#visual.visual4 .bg{ background: url("/img/sub/work_bg.jpg") no-repeat center center / cover; }
#visual.visual5 .bg{ background: url("/img/sub/community_bg.jpg") no-repeat center center / cover; }
#visual.visual6 .bg{ background: url("/img/sub/class_bg.jpg") no-repeat center center / cover; }
#visual.visual7 .bg{ background: url("/img/sub/member_bg.jpg") no-repeat center center / cover; }


/* visual */
#visual .visual-wrap{ position: relative; }
#visual .bg{ padding-bottom: 21.1115%; border-radius: 20px; }
#visual .text-box{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 50px 60px; display: flex; flex-direction: column; justify-content: flex-end; opacity: 1; transition: unset; }
#visual .text-box h2{ font-size: 6rem; font-weight: 700; color: #fff; letter-spacing: -0.02em; margin-bottom: 10px; }

/* lnb */
#lnb ul{ display: flex; align-items: center; margin-left: -20px; margin-bottom: -20px; }
#lnb ul li{ position: relative; }
#lnb ul li::after{ content: url("/img/sub/lnb_arrow.svg"); position: absolute; top: 50%; right: 0; transform: translate(50%, -50%); }
#lnb ul li:last-of-type::after{ display: none; }
#lnb ul li a{ display: inline-block; font-size: 1.8rem; font-weight: 500; color: #fff; letter-spacing: -0.02em; padding: 20px; }


/* common */
.sub-content{ padding: 85px 0 100px; position: relative; }
#bottom{ padding-top: 100px; position: relative; }
#bottom::before{ content: ""; max-width: 1800px; width: 100%; height: 1px; background: #CCC; position: absolute; top: 0; left: 50%; transform: translateX(-50%); }

.radius{ border-radius: 20px; }

.zoom{ border-radius: 20px; overflow: hidden; opacity: 1; }
.zoom img{ opacity: 0; transform: scale(1.15); transition: opacity 1s, transform 1s; }
.zoom.aos-animate img{ opacity: 1; transform: scale(1); }


/* 간격 */
.pt120{ padding-top: 120px; }
.pb120{ padding-bottom: 120px; }
.pt140{ padding-top: 140px; }
.pb140{ padding-bottom: 140px; }

@media screen and (max-width: 1840px){
	/* common */
	.sub-content::after{ max-width: calc(100% - 40px); }
}

@media screen and (max-width: 1700px){
	/* common */
	.sub-content{ padding: 60px 0 70px; }
	#bottom{ padding-top: 70px; }

	/* 간격 */
	.pt120{ padding-top: 100px; }
	.pb120{ padding-bottom: 100px; }
	.pt140{ padding-top: 120px; }
	.pb140{ padding-bottom: 120px; }

	/* visual */
	#visual .text-box h2{ font-size: 5rem; }

	/* lnb */
	#lnb ul li a{ font-size: 1.7rem; }
}

@media screen and (max-width: 1600px){
	/* visual */
	#visual .text-box{ padding: 40px; }
}

@media screen and (max-width: 1280px){
	/* common */
	.sub-content{ padding: 40px 0 50px; }
	#bottom{ padding-top: 50px; }

	/* 간격 */
	.pt120{ padding-top: 80px; }
	.pb120{ padding-bottom: 80px; }
	.pt140{ padding-top: 100px; }
	.pb140{ padding-bottom: 100px; }

	/* visual */
	#visual .text-box{ padding: 30px 25px; }
	#visual .text-box h2{ font-size: 4rem; }

	/* lnb */
	#lnb ul{ margin-left: -15px; margin-bottom: -10px; }
	#lnb ul li a{ font-size: 1.6rem; padding: 10px 15px; }
}

@media screen and (max-width: 1240px){
	/* visual */
	#visual .bg{ padding-bottom: 250px; }
}

@media screen and (max-width: 900px){
	/* visual */
	#visual .text-box h2{ font-size: 3rem; }

	#lnb ul{ margin-left: -10px; }
	#lnb ul li::after{ top: 52%; }
	#lnb ul li a{ font-size: 1.55rem; padding: 10px; }
	#lnb ul li a img{ width: 10px; height: auto; }
}


/* page-top */
.page-top{ border-bottom: 1px solid #CCC; text-align: center; padding-bottom: 40px; margin-bottom: 80px; }
.page-top h2{ font-size: 4rem; font-weight: 700; color: #222; letter-spacing: -0.02em; transform: translateY(100%); clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); -webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); }
.page-top.aos-animate h2{ animation: textClip 1s both; }


/* page-title */
.page-title{ text-align: center; margin-bottom: 120px; position: relative; opacity: 1 !important; transition: unset; opacity: 1; }
.page-title h3{ font-size: 4rem; font-weight: 700; color: #333; letter-spacing: -0.02em; }
.page-title.aos-init h3{ transform: translateY(100%); clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); -webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); }
.page-title.aos-animate h3{ animation: textClip 1s both; }

.page-title.mb60{ margin-bottom: 60px; }
.page-title.underline{ border-bottom: 1px solid #CCC; padding-bottom: 50px; margin-bottom: 70px; }


/* sec-title */
.sec-title{ margin-bottom: 40px; }
.sec-title h4{ font-size: 3.6rem; font-weight: 700; color: #333; letter-spacing: -0.02em; transform: translateY(100%); clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); -webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); }
.sec-title p{ font-size: 2.6rem; font-weight: 500; color: #111; letter-spacing: -0.02em; line-height: 1.5; margin-top: 20px; transform: translateY(100%); clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); -webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); }

.sec-title.aos-animate h4{ animation: textClip 1s both; }
.sec-title.aos-animate p{ animation: textClip 1s 0.3s both; }


/* shadow */
.shadow{ 
	--padding: 60px;
	--pt: 100px;
}
.shadow{ background: #fff; box-shadow: var(--shadow); border-radius: 20px; padding: var(--padding); }
.shadow.padding{ padding: var(--pt) var(--padding); }
.shadow .inner{ max-width: 1640px; width: 100%; margin: 0 auto; }


/* table-box */
.table-box th, .table-box td{ padding: 18px; border: 1px solid #CCC; border-left: none; }
.table-box th{ background: #E7E7E7; font-size: 2rem; font-weight: 700; color: #333; letter-spacing: -0.02em; line-height: 1.7; }
.table-box td{ font-size: 1.8rem; font-weight: 400; color: #333; letter-spacing: -0.02em; text-align: center; }
.table-box tr > *:last-of-type{ border-right: none; }
.table-box .left{ text-align: left !important; }

.table-box + .guide{ margin-top: 35px; }
.table-box + .guide p{ font-size: 1.8rem; font-weight: 400; color: #666; letter-spacing: -0.02em; }

@media screen and (max-width: 1700px){
	/* page-top */
	.page-top{ padding-bottom: 30px; margin-bottom: 50px; }
	.page-top h2{ font-size: 3.5rem; }

	/* page-title */
	.page-title{ margin-bottom: 80px; }
	.page-title h3{ font-size: 3.5rem; }
	.page-title.mb60{ margin-bottom: 50px; }
	.page-title.underline{ padding-bottom: 30px; margin-bottom: 50px; }

	/* sec-title */
	.sec-title h4{ font-size: 3rem; }
	.sec-title p{ font-size: 2.2rem; margin-top: 20px; }

	/* shadow */
	.shadow{ 
		--padding: 40px;
		--pt: 70px;
	}

	/* table-box */
	.table-box th, .table-box td{ padding: 15px; }
	.table-box th{ font-size: 1.8rem; }
	.table-box td{ font-size: 1.7rem; }

	.table-box + .guide{ margin-top: 25px; }
	.table-box + .guide p{ font-size: 1.7rem; }
}

@media screen and (max-width: 1280px){
	/* page-top */
	.page-top{ padding-bottom: 20px; margin-bottom: 30px; }
	.page-top h2{ font-size: 3rem; }

	/* page-title */
	.page-title{ margin-bottom: 40px; }
	.page-title h3{ font-size: 3rem; }
	.page-title.mb60{ margin-bottom: 60px; }
	.page-title.underline{ padding-bottom: 20px; margin-bottom: 30px; }

	/* sec-title */
	.sec-title{ margin-bottom: 20px; }
	.sec-title h4{ font-size: 2.6rem; }
	.sec-title p{ font-size: 2rem; margin-top: 10px; }

	/* shadow */
	.shadow{ 
		--padding: 25px;
		--pt: 40px;
	}

	/* table-box */
	.table-box th{ font-size: 1.7rem; }
	.table-box td{ font-size: 1.6rem; }
	.table-box th, .table-box td{ padding: 10px; }

	.table-box + .guide{ margin-top: 15px; }
	.table-box + .guide p{ font-size: 1.5rem; }
}

@media screen and (max-width: 900px){
	/* page-top */
	.page-top h2{ font-size: 2.6rem; }

	/* page-title */
	.page-title h3{ font-size: 2.4rem; }

	/* sec-title */
	.sec-title h4{ font-size: 2.3rem; }
	.sec-title p{ font-size: 1.8rem; }
}

/* profile-layout */
.profile-layout{
	--gap: 80px;
}
.profile-layout{ display: flex; justify-content: space-between; }
.profile-layout .img{ width: 46%; }
.profile-layout figure{ width: 100%; }
.profile-layout  figure img{ width: 100%; border-radius: 20px; }

.profile-layout .content{ display: flex; flex-direction: column; width: calc(54% - var(--gap)); }
.profile-layout .vertical{ flex: 1 0 auto; }
.profile-layout .vertical.center{ display: flex; flex-direction: column; justify-content: center; }
.profile-layout .name{ padding-top: 40px; }
.profile-layout .name h6{ font-size: 3rem; font-weight: 600; color: #111; letter-spacing: -0.02em; margin-bottom: 20px; }
.profile-layout .name h6 span{ font-size: 2.4rem; font-weight: 500; color: #AAA; letter-spacing: -0.02em; margin-left: 10px; }
.profile-layout .name p{ font-size: 2rem; font-weight: 400; color: #666; letter-spacing: -0.02em; }

.profile-layout.reverse{ flex-direction: row-reverse; }

@media screen and (max-width: 1700px){
	.profile-layout .name h6{ font-size: 2.6rem; }
	.profile-layout .name h6 span{ font-size: 2.1rem; }
	.profile-layout .name p{ font-size: 1.8rem; }
}

@media screen and (max-width: 1400px){
	.profile-layout{
		--gap: 50px;
	}
	.profile-layout .name{ padding-top: 20px; }
}

@media screen and (max-width: 1280px){
	.profile-layout .name h6{ font-size: 2.4rem; margin-bottom: 10px; }
	.profile-layout .name h6 span{ font-size: 1.9rem; }
	.profile-layout .name p{ font-size: 1.7rem; }
}

@media screen and (max-width: 1200px){
	.profile-layout{ flex-direction: column !important; }
	.profile-layout .img, .profile-layout .content{ width: 100%; }
	.profile-layout .content{ padding-top: 40px; }
}

@media screen and (max-width: 900px){
	.profile-layout .name h6{ font-size: 2.2rem; }
	.profile-layout .name h6 span{ font-size: 1.6rem; margin-left: 7px; }
	.profile-layout .name p{ font-size: 1.6rem; }
}


/* 협회소개 - 협회소개 / 찾아오시는 길 */
#greeting{ overflow: hidden; }
#greeting section .sec:not(:last-of-type){ margin-bottom: 40px; }
#greeting h5{ font-size: 3rem; font-weight: 600; color: #111; letter-spacing: -0.02em; }
#greeting .tit{ text-align: center; opacity: 1; }
#greeting .tit h2{ font-size: 6.4rem; font-weight: 700; color: #333; letter-spacing: -0.02em; transform: translateY(100%); clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); -webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); }
#greeting .tit h2.eng{ font-family: var(--engFont); color: #111; letter-spacing: 0; }
#greeting .tit h2:not(:last-of-type){ margin-bottom: 20px; }
#greeting .tit.aos-animate h2{ animation: textClip 1s both; }
#greeting .tit.aos-animate h2:not(:first-of-type){ animation-delay: 200ms; }

#greeting .profile-layout h5{ font-weight: 300; line-height: 1.7; }
#greeting .profile-layout h5 strong{ font-weight: 600; line-height: inherit; }
#greeting .profile-layout p{ font-size: 2rem; font-weight: 300; color: #333; letter-spacing: -0.02em; line-height: 1.7; }

#greeting .profile-layout .name a{ display: inline-block; font-size: 2rem; font-weight: 400; color: #666; letter-spacing: -0.02em; line-height: 1.2; text-decoration: underline; text-underline-position: from-font; padding: 20px; padding-left: 32px; margin: -20px 0; position: relative; }
#greeting .profile-layout .name a::before{ content: ""; width: 24px; height: 24px; background: url("/img/sub/academy/tel_icon.svg") no-repeat center center / contain; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
#greeting .profile-layout .name p{ font-weight: 400; line-height: 1.3; }

#greeting .profile-layout .p-box{ margin-top: 50px; }
#greeting .profile-layout .p-box p:not(:last-of-type){ margin-bottom: 10px; }


#greeting .chairman .profile-layout .content{ padding: 40px 0; }


#greeting .effect .table table{ border-collapse: unset; border-spacing: 10px; }
#greeting .effect .table th{ width: 440px; position: relative; z-index: 10; }
#greeting .effect .table th::before{ content: ""; width: 100%; height: 100%; background: var(--bg); border-radius: 10px; position: absolute; top: 0; left: 0; z-index: -1; }
#greeting .effect .table th span{ font-size: 5rem; font-weight: 600; color: var(--color); }
#greeting .effect .table th p{ font-size: 2.4rem; font-weight: 600; color: #333; letter-spacing: -0.02em; }
#greeting .effect .table td{ position: relative; z-index: 10; padding: 60px 50px; }
#greeting .effect .table td::before{ content: ""; width: 100%; height: 100%; background: #F6F6F6; border-radius: 10px; position: absolute; top: 0; left: 0; z-index: -1; }
#greeting .effect .table dl dt{ font-size: 2.4rem; font-weight: 600; color: #333; letter-spacing: -0.02em; margin-bottom: 10px; }
#greeting .effect .table dl dd{ font-size: 1.8rem; font-weight: 300; color: #333; letter-spacing: -0.02em; }


#greeting .philosophy .text{ margin-bottom: 60px; }
#greeting .philosophy .text h5{ margin-bottom: 35px; }
#greeting .philosophy .text p{ font-size: 1.8rem; font-weight: 300; color: #333; letter-spacing: -0.02em; line-height: 1.7; }
#greeting .philosophy .diagram{ max-width: 850px; display: flex; flex-wrap: wrap; justify-content: center; letter-spacing: -0.02em; margin: 0 auto; margin-bottom: -10px; }
#greeting .philosophy .diagram .box{ display: flex; flex-direction: column; gap: 37px 0; width: calc((100% - 10px) / 2); padding: 20px; margin-bottom: 10px; }
#greeting .philosophy .diagram .box:nth-of-type(odd){ margin-right: 10px; }
#greeting .philosophy .diagram span{ font-size: 2.8rem; font-weight: 600; letter-spacing: -0.02em; }
#greeting .philosophy .diagram dl{ padding: 20px; text-align: left; }
#greeting .philosophy .diagram dl *{ color: #fff; }
#greeting .philosophy .diagram dl dt{ font-family: var(--engFont); font-size: 2.8rem; font-weight: 600; margin-bottom: 10px; }
#greeting .philosophy .diagram dl dd{ font-size: 2rem; font-weight: 500; }

#greeting .philosophy .diagram .box01, #greeting .philosophy .diagram .box02{ flex-direction: column-reverse; }
#greeting .philosophy .diagram .box02, #greeting .philosophy .diagram .box03{ border-radius: 20px 0 20px 0; }
#greeting .philosophy .diagram .box01, #greeting .philosophy .diagram .box03{ text-align: right; }
#greeting .philosophy .diagram .box01, #greeting .philosophy .diagram .box04{ border-radius: 0px 20px 0 20px; }

#greeting .philosophy .diagram .box01{ background: #C9E5EE; }
#greeting .philosophy .diagram .box01 span{ color: #6595C1; }
#greeting .philosophy .diagram .box01 dl *{ color: #111; }

#greeting .philosophy .diagram .box02{ background: #7DBCD1;  }
#greeting .philosophy .diagram .box02 span{ color: #C9E5EE; }

#greeting .philosophy .diagram .box03{ background: #006692; }
#greeting .philosophy .diagram .box03 span{ color: #7DBCD1; }

#greeting .philosophy .diagram .box04{ background: #008FB0; }
#greeting .philosophy .diagram .box04 span{ color: #7DBCD1; }


#greeting .location h5{ margin-bottom: 50px; }
#greeting .location .inner{ max-width: 1050px; }
#greeting .location figure{ border: 12px solid #000; }
#greeting .location dl *{ font-size: 2rem; }
#greeting .location dl dt{ display: inline-block; background: #000; border-radius: 10px; font-weight: 600; color: #fff; padding: 12px 30px; margin-bottom: 30px; }
#greeting .location dl dd{ font-weight: 300; color: #333; letter-spacing: -0.02em; line-height: 1.5; }
#greeting .location dl dd p{ line-height: inherit; }
#greeting .location dl dd p:not(:last-of-type){ margin-bottom: 10px; }
#greeting .location .iframe{ width: 100%; position: relative; padding-bottom: 74.286%; overflow: hidden; border-radius: 20px; margin: 70px 0; }
#greeting .location .iframe .root_daum_roughmap{ width: 100% !important; height: 100% !important; position: absolute; top: 0; left: 0; }
#greeting .location .iframe .root_daum_roughmap .wrap_map{ height: 100%; }
#greeting .location .iframe .root_daum_roughmap .map_border{ display: none; }

#greeting .location .way .flex-box{ display: flex; flex-wrap: wrap; justify-content: space-between; }
#greeting .location .way dl{ width: calc((100% - 20px) / 2); }
#greeting .location .way dl p{ display: flex; align-items: baseline; }
#greeting .location .way dl p span{ white-space: nowrap; padding-right: 5px; }

@media screen and (max-width: 1780px){
	#greeting .philosophy br{ display: none; }
}

@media screen and (max-width: 1700px){
	#greeting h5{ font-size: 2.6rem; }
	#greeting .tit h2{ font-size: 5rem; }

	#greeting .profile-layout p{ font-size: 1.8rem; }
	#greeting .profile-layout .name a{ font-size: 1.8rem; }

	#greeting .effect .table th{ width: 350px; }
	#greeting .effect .table th span{ font-size: 4rem; }
	#greeting .effect .table th p{ font-size: 2.1rem; }
	#greeting .effect .table td{ padding: 50px 40px; }
	#greeting .effect .table dl dt{ font-size: 2.1rem; }

	#greeting .philosophy .text h5{ margin-bottom: 25px; }

	#greeting .philosophy .diagram span{ font-size: 2.4rem; }
	#greeting .philosophy .diagram dl dt{ font-size: 2.4rem; }
	#greeting .philosophy .diagram dl dd{ font-size: 1.9rem; }

	#greeting .location dl *{ font-size: 1.8rem; }
	#greeting .location dl dt{ padding: 10px 25px; }
}

@media screen and (max-width: 1400px){
	#greeting .profile-layout .p-box{ margin-top: 30px; }

	#greeting .chairman br{ display: none; }
	#greeting .chairman .profile-layout .content{ padding: 20px 0; }
}

@media screen and (max-width: 1280px){
	#greeting section .sec:not(:last-of-type){ margin-bottom: 20px; }
	#greeting .page-title:not(.underline){ margin-bottom: 10px; }
	#greeting h5{ font-size: 2.2rem; }
	#greeting .tit h2{ font-size: 4rem; }
	#greeting .tit h2:not(:last-of-type){ margin-bottom: 10px; }

	#greeting .profile-layout p{ font-size: 1.7rem; }
	#greeting .profile-layout .name a{ font-size: 1.7rem; padding-left: 25px; }
	#greeting .profile-layout .name a::before{ width: 20px; height: 20px; }

	#greeting .effect .table th{ width: 250px; }
	#greeting .effect .table th span{ font-size: 3rem; }
	#greeting .effect .table th p{ font-size: 1.9rem; }
	#greeting .effect .table td{ padding: 40px 30px; }
	#greeting .effect .table dl dt{ font-size: 1.9rem; margin-bottom: 5px; }
	#greeting .effect .table dl dd{ font-size: 1.7rem; }

	#greeting .philosophy .text{ margin-bottom: 30px; }
	#greeting .philosophy .text h5{ margin-bottom: 15px; }
	#greeting .philosophy .text p{ font-size: 1.7rem; }

	#greeting .philosophy .diagram{ max-width: 550px; }
	#greeting .philosophy .diagram .box{ gap: 20px 0; padding: 15px; }
	#greeting .philosophy .diagram span{ font-size: 2.2rem; }
	#greeting .philosophy .diagram dl{ padding: 10px; }
	#greeting .philosophy .diagram dl dt{ font-size: 2.2rem; margin-bottom: 5px; }
	#greeting .philosophy .diagram dl dd{ font-size: 1.8rem; }

	#greeting .location figure{ border-width: 8px; }
	#greeting .location h5{ margin-bottom: 30px; }
	#greeting .location dl *{ font-size: 1.7rem; }
	#greeting .location dl dt{ padding: 8px 20px; margin-bottom: 15px; }
	#greeting .location dl dd p:not(:last-of-type){ margin-bottom: 5px; }
	#greeting .location .iframe{ margin: 40px 0; }
}

@media screen and (max-width: 1200px){
	#greeting .profile-layout .name{ padding: 0 0 10px; }

	#greeting .chairman .profile-layout .content{ padding: 30px 0 0; }
	#greeting .chairman .name{ padding-top: 20px; }

	#greeting .location .way br{ display: none; }
	#greeting .location .way dl{ width: 100%; }
	#greeting .location .way dl:not(:last-of-type){ margin-bottom: 30px; }
}

@media screen and (max-width: 900px){
	#greeting h5{ font-size: 2rem; }
	#greeting .tit h2{ font-size: 3rem; }

	#greeting .profile-layout p{ font-size: 1.6rem; }
	#greeting .profile-layout .name a{ font-size: 1.6rem; }

	#greeting .effect .table th{ width: 150px; }
	#greeting .effect .table th span{ font-size: 2.6rem; }
	#greeting .effect .table th p{ font-size: 1.8rem; }
	#greeting .effect .table td{ padding: 25px; }
	#greeting .effect .table dl dt{ font-size: 1.8rem; }
	#greeting .effect .table dl dd{ font-size: 1.6rem; }

	#greeting .philosophy .diagram span{ font-size: 2rem; }
	#greeting .philosophy .diagram dl dt{ font-size: 2rem; }
	#greeting .philosophy .diagram dl dd{ font-size: 1.7rem; }

	#greeting .location dl dt{ padding: 6px 15px; }
}

@media screen and (max-width: 650px){
	#greeting .effect .table tr{ display: flex; flex-direction: column; }
	#greeting .effect .table tr:not(:last-of-type){ margin-bottom: 30px; }
	#greeting .effect .table th{ width: 100%; padding: 10px 10px 15px; margin-bottom: 10px; }
}


/* 협회소개 - 교육 / 전문강사 */
#teacher section .sec:not(:last-of-type){ margin-bottom: 40px; }

#teacher .intro .page-title{ text-align: left; margin-bottom: 40px; }
#teacher .intro .page-title h3{ font-weight: 300; line-height: 1.7; }
#teacher .intro .page-title h3 strong{ font-weight: 700; }
#teacher .intro p{ font-size: 2rem; font-weight: 300; color: #333; letter-spacing: -0.02em; line-height: 1.7; }


#teacher .profile-layout .name{ padding: 20px 0 50px; }
#teacher .profile-layout .name h6{ font-size: 3.6rem; margin-bottom: 10px; }
#teacher .profile-layout .list{ flex: 1 0 auto; background: #FAFAFA; border-radius: 20px; padding: 40px; }
#teacher .profile-layout .list ul:not(:last-of-type){ margin-bottom: 20px; }
#teacher .profile-layout .list ul li{ font-size: 1.8rem; font-weight: 300; color: #333; letter-spacing: -0.02em; /* padding-left: 25px; */ position: relative; height:22px;}
/* #teacher .profile-layout .list ul li::before{ content: ""; width: 3px; height: 3px; background: #333; border-radius: 50%; position: absolute; top: calc(1.3em / 2); left: 12px; transform: translateY(-50%); } */
#teacher .profile-layout .list ul li:not(:last-of-type){ margin-bottom: 8px; }

@media screen and (max-width: 1700px){
	#teacher .intro p{ font-size: 1.8rem; }

	#teacher .profile-layout .name h6{ font-size: 3rem; }
	#teacher .profile-layout .list{ padding: 30px; }
}

@media screen and (max-width: 1280px){
	#teacher .intro .page-title{ margin-bottom: 20px; }
	#teacher .intro p{ font-size: 1.7rem; }

	#teacher .profile-layout .name{ padding: 20px 0; }
	#teacher .profile-layout .name h6{ font-size: 2.6rem; }
	#teacher .profile-layout .list{ padding: 20px; }
	#teacher .profile-layout .list ul li{ font-size: 1.7rem; }
}

@media screen and (max-width: 1200px){
	#teacher .profile-layout .name{ padding: 0 0 10px; }
}

@media screen and (max-width: 900px){
	#teacher .profile-layout .name h6{ font-size: 2.4rem; }
	#teacher .profile-layout .list{ padding: 20px 15px; }
}

@media screen and (max-width: 550px){
	#teacher .intro br{ display: none; }
}



/* 협회소개 - 교육과정 모집 (공통) */
#program section .sec:not(:last-of-type){ margin-bottom: 30px; }
#program .page-title{ margin-bottom: 30px; }
#program .page-title h3{ font-weight: 600; }

#program .bg-layout{ position: relative; }
#program .bg-layout .bg{ position: relative; padding-bottom: var(--padding); overflow: hidden; border-radius: 20px; }
#program .bg-layout .bg img{ width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; }
#program .bg-layout .text{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 10; padding: 60px; }
#program .bg-layout .inner{ max-width: 100%; width: max-content; background: #fff; border-radius: 20px; padding: 50px; box-shadow: var(--shadow); }


#program .intro .sec:not(:last-of-type){ margin-bottom: 40px; }
#program .intro dl dt{ font-size: 2.4rem; font-weight: 600; color: #111; letter-spacing: -0.02em; line-height: 1.5; margin-bottom: 20px; }
#program .intro dl dd{ font-size: 2rem; font-weight: 300; color: #333; letter-spacing: -0.02em; line-height: 1.6; }


#program .black-dl *{ font-size: 2rem; }
#program .black-dl dt{ font-size: 2.4rem; font-weight: 600; color: #111; letter-spacing: -0.02em; margin-bottom: 30px; }
#program .black-dl dt span{ display: inline-block; background: #000; border-radius: 10px; font-weight: 600; color: #fff; padding: 6px 20px; }
#program .black-dl ul{ margin-bottom: -15px; }
#program .black-dl ul li{ font-weight: 300; color: #333; letter-spacing: -0.02em; position: relative; padding: calc((var(--circle) - 1.3em) / 2) 15px; padding-left: calc(var(--circle) + 15px); margin-bottom: 15px; }
#program .black-dl ul li::before{ content: ""; width: var(--circle); height: var(--circle); display: flex; justify-content: center; align-items: center; border-radius: 50%; font-family: var(--engFont); font-size: 1.5rem; font-weight: 600; color: #fff; letter-spacing: -0.02em; position: absolute; top: 0; left: 0; }
#program .black-dl .flex{ display: flex; flex-wrap: wrap; }

#program .num-list{
	--circle: 30px;
}
#program .num-list.flex{ flex-direction: column; }
#program .num-list li{ font-size: 2rem; }
#program .num-list li::before{ content: attr(data-num) !important; background: #CCC; }

#program .check-list{
	--circle: 24px;
}
#program .check-list{ display: flex; flex-wrap: wrap; }
#program .check-list li{ width: calc(100% / 4); font-size: 1.8rem; }
#program .check-list li::before{ background: #000 url("/img/sub/program/check_icon.svg") no-repeat center center / contain; }


#program .diagram .flex-box{ max-width: 1208px; width: 100%; display: flex; justify-content: space-between; border: 1px dashed rgba(0, 0, 0, 0.2); border-radius: 315px; padding: 40px; margin: 0 auto; position: relative; }
#program .diagram .flex-box::before{ content: ""; width: 66px; height: 66px; background: #000 url("/img/sub/program/plus_icon.svg") no-repeat center center / auto; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#program .diagram .half{ width: calc((100% - 160px) / 2); position: relative; }
#program .diagram .circle{ width: 100%; position: relative; padding-bottom: 100%; background: linear-gradient(to bottom, #8D8D8D, #DFDFDF); border-radius: 50%; }
#program .diagram .circle::before{ content: ""; width: calc(100% - 8px); height: calc(100% - 8px); background: #fff; border-radius: inherit; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#program .diagram .txt{ position: absolute; top: 50%; right: 0; left: 0; transform: translateY(-50%); z-index: 10; text-align: center; }
#program .diagram .txt dl dt{ font-size: 3rem; font-weight: 600; color: #111; letter-spacing: -0.02em; padding-bottom: 35px; position: relative; }
#program .diagram .txt dl dt::after{ content: ""; width: 45%; height: 1px; background: #CCC; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); }
#program .diagram .txt dl dd{ font-size: 1.8rem; font-weight: 300; color: #333; letter-spacing: -0.02em; line-height: 1.7; padding-top: 35px; }
#program .diagram .txt dl dd p{ min-height: 6.8em; line-height: inherit; }


#program .table-top{ display: flex; justify-content: space-between; font-size: 2rem; font-weight: 500; color: #111; letter-spacing: -0.02em; margin-bottom: 30px; }
#program .table-box colgroup col.s{ width: 15%; }
#program .table-box colgroup col.m{ width: 35%; }
#program .table-box td{ padding: 19px 100px; }
#program .table-box td.none{ padding: 0; }
#program .table-box td, #program .table-box td *{ line-height: 1.7; }
#program .table-box ul{ width: calc(100% + 40px); text-align: left; margin-left: -40px; }
#program .table-box ul.hyphen li{ padding-left: 15px; position: relative; line-height: 1.7; }
#program .table-box ul.hyphen li::before{ content: "-"; position: absolute; top: 0; left: 0; 0 }

#program .table-box .flex{ display: flex; }
#program .table-box .flex > div{ display: flex; justify-content: center; align-items: center; padding: 19px; }
#program .table-box .flex > div:not(:last-of-type){ border-right: 1px solid #CCC; }
#program .table-box .flex.three > div{ width: calc(100% / 3); }

@media screen and (max-width: 1700px){
	#program .bg-layout .text{ padding: 40px; }
	#program .bg-layout .inner{ padding: 40px; }

	#program .intro dl dt{ font-size: 2.1rem; margin-bottom: 20px; }
	#program .intro dl dd{ font-size: 1.8rem; }

	#program .black-dl *{ font-size: 1.8rem; }
	#program .black-dl dt{ font-size: 2.1rem; }

	#program .num-list li{ font-size: 1.8rem; }
	#program .check-list li{ font-size: 1.7rem; }

	#program .diagram .txt dl dt{ font-size: 2.6rem; }

	#program .table-top{ font-size: 1.8rem; }
	#program .table-box td{ padding: 18px 60px; }
	#program .table-box ul{ width: calc(100% + 30px); margin-left: -30px; }
	#program .table-box .flex > div{ padding: 18px; }
}

@media screen and (max-width: 1600px){
	#program .bg-layout .text{ position: static; padding: 0; }
	#program .bg-layout .inner{ width: 100%; padding: 25px; margin-bottom: 20px; }

	#program .check-list li{ width: calc(100% / 2); }

	#program .diagram .flex-box{ max-width: 1000px; padding: 30px; }
	#program .diagram .flex-box::before{ width: 55px; height: 55px; }
	#program .diagram .half{ width: calc((100% - 100px) / 2); }
}

@media screen and (max-width: 1450px){
	#program .bg-layout .text{ position: static; padding: 0; margin-bottom: 30px; }
	#program .bg-layout .inner{ width: 100%; }
}

@media screen and (max-width: 1280px){
	#program section .sec:not(:last-of-type){ margin-bottom: 20px; }

	#program .bg-layout .text{ margin-bottom: 20px; }
	
	#program .intro .sec:not(:last-of-type){ margin-bottom: 20px; }
	#program .intro dl dt{ font-size: 1.9rem; margin-bottom: 10px; }
	#program .intro dl dd{ font-size: 1.7rem; }

	#program .black-dl *{ font-size: 1.7rem; }
	#program .black-dl dt{ font-size: 1.9rem; margin-bottom: 15px; }
	#program .black-dl dt span{ padding: 5px 15px; }
	#program .black-dl ul{ margin-bottom: -10px; }
	#program .black-dl ul li{ padding-left: calc(var(--circle) + 10px); margin-bottom: 10px; }
	#program .black-dl ul li::before{ font-size: 1.4rem; }

	#program .num-list{ --circle: 24px; }
	#program .num-list li{ font-size: 1.7rem; }

	#program .check-list{ --circle: 24px; }
	#program .check-list li{ font-size: 1.6rem; }

	#program .diagram .flex-box{ padding: 20px; }
	#program .diagram .flex-box::before{ width: 45px; height: 45px; }
	#program .diagram .txt dl dt{ font-size: 2.2rem; padding-bottom: 20px; }
	#program .diagram .txt dl dd{ font-size: 1.7rem; padding-top: 20px; }

	#program .table-top{ font-size: 1.7rem; margin-bottom: 20px; }
	#program .table-box colgroup col.s{ width: 20%; }
	#program .table-box colgroup col.m{ width: 30%; }
	#program .table-box td{ padding: 10px; }
	#program .table-box ul{ width: 100%; margin-left: 0; }
	#program .table-box .flex > div{ padding: 10px; }
}

@media screen and (max-width: 1200px){
	#program .num-list.flex{ height: auto !important; }

	#program .curriculum thead, #program .curriculum colgroup{ display: none; }
	#program .curriculum tr{ display: flex; flex-wrap: wrap; }
	#program .curriculum tr:not(:last-of-type){ margin-bottom: 20px; }
	#program .curriculum tr td{ width: 100%; border-right: none; padding-left: 160px; position: relative; }
	#program .curriculum tr td:not(:last-of-type){ border-bottom: none; }
	#program .curriculum tr td::before{ content: attr(data-txt); width: 150px; height: 100%; display: flex; justify-content: center; align-items: center; background: #E7E7E7; font-weight: 700; color: #333; position: absolute; bottom: 0; left: 0; border-top: 1px solid #CCC; }
}

@media screen and (max-width: 900px){
	#program .diagram .flex-box::before{ width: 40px; height: 40px; }
	#program .diagram .txt dl dt{ font-size: 2rem; padding-bottom: 15px; }
	#program .diagram .txt dl dd{ padding-top: 15px; }

	#program .table-top{ font-size: 1.6rem; margin-bottom: 10px; }
	#program .table-box colgroup col.s{ width: 50px; }
}

@media screen and (max-width: 850px){
	#program .diagram .flex-box{ max-width: 350px; flex-direction: column; }
	#program .diagram .half{ width: 100%; }
	#program .diagram .half:not(:last-of-type){ margin-bottom: 80px; }
}

@media screen and (max-width: 800px){
	#program .check-list li{ width: 100%; padding-right: 0; }
}

@media screen and (max-width: 650px){
	#program .curriculum tr td{ padding-left: 110px; }
	#program .curriculum tr td::before{ width: 100px; }
}


/* 협회소개 - 교육과정 모집 (왁싱) */
@media screen and (max-width: 700px){
	#program.waxing .intro br{ display: none; }
	#program.waxing .table-box br{ display: none; }
}


/* 협회소개 - 교육과정 모집 (속눈썹) */
#program.eyelashes .intro .page-title{ text-align: left; }
#program.eyelashes .intro .page-title h3{ font-weight: 700; color: #111; }
#program.eyelashes .intro p{ font-size: 2rem; font-weight: 300; color: #333; letter-spacing: -0.02em; line-height: 1.7; }

#program.eyelashes .gallery{ display: flex; flex-wrap: wrap; justify-content: space-between; }
#program.eyelashes .gallery:not(:last-of-type){ margin-bottom: 50px; }
#program.eyelashes .gallery li{ width: calc((100% - 40px) / 2); }
#program.eyelashes .gallery li:nth-of-type(odd) figure img{ border-radius: 20px 0 0 0; }
#program.eyelashes .gallery li:nth-of-type(even) figure img{ border-radius: 0 20px 0 0; }
#program.eyelashes .gallery li span{ display: block; font-size: 4rem; font-weight: 600; color: #111; letter-spacing: -0.02em; text-align: center; margin-top: 30px; }

@media screen and (max-width: 1700px){
	#program.eyelashes .intro p{ font-size: 1.8rem; }

	#program.eyelashes .gallery li span{ font-size: 3rem; }
}

@media screen and (max-width: 1280px){
	#program .page-title{ margin-bottom: 15px; }
	#program.eyelashes .intro p{ font-size: 1.7rem; }

	#program.eyelashes .gallery:not(:last-of-type){ margin-bottom: 30px; }
	#program.eyelashes .gallery li{ width: calc((100% - 20px) / 2); }
	#program.eyelashes .gallery li span{ font-size: 2.5rem; margin-top: 10px; }
}

@media screen and (max-width: 900px){
	#program.eyelashes .gallery li span{ font-size: 2rem; }
}

@media screen and (max-width: 600px){
	#program.eyelashes .gallery li{ width: 100%; }
	#program.eyelashes .gallery li:not(:first-of-type){ margin-top: 20px; }
}


/* 증서 / 현판 / 트로피 (공통) */
#work .shadow{ padding: 120px var(--padding); }
#work .work-box .item{ text-align: center; position: relative; }
#work .work-box .item:not(:first-of-type){ padding-top: 95px; }
#work .work-box .item:not(:last-of-type){ padding-bottom: 95px; }
#work .work-box .item::after{ content: ""; max-width: 1000px; width: 100%; height: 1px; background: #CCC; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); }
#work .work-box .item:last-of-type::after{ display: none; }
#work .work-box .item figure{ display: block; max-width: 700px; width: 100%; margin: 0 auto; }
#work .work-box .item h6{ font-size: 3.6rem; font-weight: 700; color: #333; letter-spacing: -0.02em; margin-top: 40px; }

@media screen and (max-width: 1700px){
	#work .shadow{ padding: 80px var(--padding); }
	#work .work-box .item:not(:first-of-type){ padding-top: 70px; }
	#work .work-box .item:not(:last-of-type){ padding-bottom: 70px; }
	#work .work-box .item h6{ font-size: 3rem; }
}

@media screen and (max-width: 1280px){
	#work .shadow{ padding: 40px var(--padding); }
	#work .work-box .item:not(:first-of-type){ padding-top: 40px; }
	#work .work-box .item:not(:last-of-type){ padding-bottom: 40px; }
	#work .work-box .item h6{ font-size: 2.6rem; margin-top: 20px; }
}

@media screen and (max-width: 900px){
	#work .work-box .item h6{ font-size: 2.2rem; }
}


/* 비용 문의 */
#form #bottom{ padding-top: 0; margin-bottom: 0; }
#form #bottom::before{ display: none; }
#form #bottom .title h3{ display: none; }


/* 비용 문의 - 카카오 상담 */
#kakao .flex-box{ display: flex; border-radius: 20px; overflow: hidden; text-align: center; }
#kakao .flex-box > div{ width: 50%; display: flex; justify-content: center; align-items: center; padding: 90px; }
#kakao .flex-box .vertical{ width: 100%; }

#kakao .kakao{ background: #FAE301; }
#kakao .kakao .qr{ width: 100%; display: flex; justify-content: center; margin-top: 65px; }
#kakao .kakao .qr .item{ max-width: calc((100% - 80px) / 2); }
#kakao .kakao .qr .item:not(:last-of-type){ margin-right: 80px; }
#kakao .kakao .qr p{ font-size: 2.4rem; font-weight: 600; color: #000; letter-spacing: -0.02em; margin-top: 20px; }

#kakao .gray{ background: #EEE; }
#kakao .gray h6{ font-size: 3rem; font-weight: 700; color: #3B1E1D; letter-spacing: -0.02em; line-height: 1.6; margin-bottom: 20px; }
#kakao .gray p{ font-size: 2rem; font-weight: 400; color: #333; letter-spacing: -0.02em; line-height: 1.6; }

@media screen and (max-width: 1700px){
	#kakao .kakao .qr{ margin-top: 45px; }
	#kakao .kakao .qr .item:not(:last-of-type){ margin-right: 60px; }
	#kakao .kakao .qr p{ font-size: 2.2rem; }

	#kakao .gray h6{ font-size: 2.6rem; }
	#kakao .gray p{ font-size: 1.8rem; }
}

@media screen and (max-width: 1280px){
	#kakao .flex-box > div{ padding: 40px; }

	#kakao .kakao .qr p{ font-size: 2rem; }

	#kakao .gray h6{ font-size: 2.2rem; margin-bottom: 5px; }
	#kakao .gray p{ font-size: 1.7rem; }
}

@media screen and (max-width: 1000px){
	#kakao .flex-box{ flex-direction: column; }
	#kakao .flex-box > div{ width: 100%; }
}

@media screen and (max-width: 600px){
	#kakao .flex-box > div{ padding: 30px 25px; }
	#kakao .kakao .qr .item:not(:last-of-type){ margin-right: 40px; }
}


/* 로그인 , 아이디/비밀번호 찾기 */
#member .form-table{
	--th: 190px;
}

#member .form-table .th, #member .form-table th{ width: var(--th); }
#member .submit{ padding-top: 40px; }
#member .link{ display: flex; justify-content: center; margin-top: 26px; }
#member .link li{ position: relative; }
#member .link li::after{ content: ""; width: 1px; height: 13px; background: #999; position: absolute; top: 50%; right: 0; transform: translate(50%, -50%); }
#member .link li:last-of-type::after{ display: none; }
#member .link li a{ display: inline-block; font-size: 1.8rem; font-weight: 400; color: #888; line-height: -0.02em; padding: 14px; }

@media screen and (max-width: 1280px){
	#member .form-table{
		--th: 150px;
	}
	
	#member .link{ margin-top: 6px; }
	#member .link li a{ font-size: 1.7rem; }

	#member .submit{ padding-top: 20px; }
}

@media screen and (max-width: 1000px){
	#member .form-table tr{ flex-direction: row; }
	#member .form-table tr:not(:last-of-type){ margin-bottom: 10px; }
	#member .form-table th{ margin-bottom: 0; }
	#member .form-table td{ width: calc(100% - var(--th) - 10px); margin-left: 10px; }
}

@media screen and (max-width: 600px){
	#member .form-table{
		--th: 120px;
	}

	#member .form-table td{ width: calc(100% - var(--th) - 10px); }
}



/* 로그인 */
#member.login .shadow{ max-width: 800px; margin: 0 auto; }
#member.login .shadow .inner{ max-width: 600px; }
#member.login .page-title{ margin-bottom: 40px; }
#member.login .submit button{ width: 100%; }

@media screen and (max-width: 1280px){
	#member.login .page-title{ margin-bottom: 10px; }
}


/* 아이디/비밀번호 찾기 */
#member.find .shadow .inner{ max-width: 1540px; }
#member.find .page-title{ margin-bottom: 80px; }
#member.find .flex-box{ display: flex; justify-content: space-between; position: relative; }
#member.find .flex-box::after{ content: ""; width: 1px; height: 100%; background: #E0E0E0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#member.find .flex-box > div{ max-width: 635px; width: calc((100% - 100px) / 2); display: flex; flex-direction: column; }
#member.find .txt{ margin-bottom: 25px; }
#member.find .txt h6{ font-size: 2.4rem; font-weight: 600; color: #252525; letter-spacing: -0.02em; padding-bottom: 10px; border-bottom: 2px solid #666; margin-bottom: 30px; }
#member.find .txt p{ min-height: 4.5em; font-size: 1.8rem; font-weight: 300; color: #888; letter-spacing: -0.02em; line-height: 1.5; }
#member.find form{ display: flex; flex-direction: column; flex: 1 0 auto; }
#member.find .form-table{ height: 100%; display: flex; flex-direction: column; justify-content: space-between; }

@media screen and (max-width: 1700px){
	#member.find .page-title{ margin-bottom: 60px; }
	#member.find .txt h6{ font-size: 2.2rem; }
	#member.find .txt p{ font-size: 1.7rem; }
}

@media screen and (max-width: 1280px){
	#member.find .page-title{ margin-bottom: 40px; }
	#member.find .txt{ margin-bottom: 15px; }
	#member.find .txt h6{ font-size: 2rem; margin-bottom: 15px; }
	#member.find .txt p{ font-size: 1.6rem; }
}

@media screen and (max-width: 1000px){
	#member.find .flex-box{ flex-direction: column; align-items: center; }
	#member.find .flex-box::after{ display: none; }
	#member.find .flex-box > div{ width: 100%; }
	#member.find .flex-box > div:not(:last-of-type){ padding-bottom: 40px; margin-bottom: 40px; border-bottom: 1px solid #E0E0E0; }
	#member.find .txt h6{ font-size: 1.8rem; } 
}


/* 회원가입 */
#join .page-title{ margin-bottom: 30px; }

@media screen and (max-width: 1280px){
	#join .page-title{ margin-bottom: 10px; }
}


/* 마이페이지 */
#mypage .page-title{ margin-bottom: 30px; }
#mypage .form-table .submit{ position: relative; }
#mypage .form-table .submit > *.out{ width: 160px; background: #fff; border: 1px solid #AAA; color: #AAA; position: absolute; bottom: 0; right: 0; }

@media screen and (max-width: 1700px){ 
	#mypage .form-table .submit > *.out{ width: 140px; }
}

@media screen and (max-width: 1280px){ 
	#mypage .page-title{ margin-bottom: 10px; }
	#mypage .form-table .submit > *.out{ width: 120px; }
}

@media screen and (max-width: 1000px){
	#mypage .form-table .submit{ padding-top: calc(var(--height) + 30px); }
	#mypage .form-table .submit > *.out{ bottom: unset; top: 0; }
}



/* site-manage-btns (관리자) */
.site-manage-btns{ display: flex; justify-content: flex-end; margin-top: 15px; }
.site-manage-btns *{ background: none; border: 1px solid rgba(0, 0, 0, 0.7); font-family: var(--baseFont); font-size: 1.7rem; font-weight: 500; color: #111 !important; border-radius: 10px; padding: 10px 15px; }
.site-manage-btns > *:not(:last-child){ margin-right: 10px; }
.site-manage-btns a{ display: inline-block; }

@media screen and (max-width: 1280px){
	.site-manage-btns *{ font-size: 1.6rem; padding: 8px 13px; }
}


/* 쓰기 페이지 */
#write .input-list{ justify-content: flex-start; flex-wrap: wrap; gap: 0 20px; }
#write .input-list li{ width: auto; }