/* include 공통 CSS */

/************************* 공통 시작*************************/
.inner {width: 100%; max-width:1360px; margin: 0 auto; }
.inner--fill {max-width:none; padding-right: calc((100% - 1360px) / 2); padding-left: calc((100% - 1360px) / 2);}
@media(max-width:1400px){
	.inner {padding: 0 4%;}
}

.sub-container {min-height:5rem;}
/************************* 공통 끝 *************************/

/************************* header_inc 시작*************************/
.header__fix {position: fixed; left:0; top:0; z-index: 100;width:100%;  height: var(--hd-gap); font-size: var(--fz); background-color: #fff; --menu-height : 0; transition: 0.15s ease-in-out all;}
.header__fix:after {position: absolute; content:''; top: 100%; left: 0; z-index: -1; width: 100%; height: var(--menu-height); background-color: #fff; transition: 0.15s ease-in-out all;}
.header__inner {display: flex; align-items: center; height: inherit; padding:0 4.6875em; gap:8.8em;}
.header__ctrl {display: flex; align-items: center; height: inherit;}
@media(max-width:1400px){
	.header__inner {padding:0 4%}
}

.header-home {position: relative; transition: .15s ease-in-out all;}
.header-home__logo {width: 10em; transition: .15s ease-in-out all;}
.header-home__logo--hover {position: absolute; top: 0; left: 0; opacity: 0; visibility:hidden;}


.header-navi {position: relative; transition: .3s ease-in-out all;}
.header-navi__m-item {position: relative;}
.header-navi__m-btn {position: relative; display: flex; align-items: center;}
.header-navi__s-btn {display: block;}
@media(max-width:1320px){
	.header-navi {display: none;}
}

.header-lang {position: relative; display: flex; align-items: center;  text-align:center; height: inherit; transition: .15s ease-in-out all;}
.header-lang__btn{display: flex; align-items:center; transition: 0.15s ease-in-out all;}
.header-lang__btn,
.header-lang__btn:link,
.header-lang__btn:visited {color: #fff;}
.header-lang__navi{position:absolute; top: 100%; left: 50%; transform:translateX(-50%); min-width:100%; height: 0; overflow: hidden;}
.header-lang__list {margin: 1em; background-color: rgba(0,0,0,0.5); border-radius: 0.5em; box-shadow:var(--shadow-1); transition: .15s ease-in-out all;}
.header-lang__link{padding:0.5em 1.5em; display: block; white-space: nowrap; transition: 0.15s ease-in-out all;}
.header-lang__link,
.header-lang__link:visited,
.header-lang__link:link {color: #fff;}
.header-lang__icon {width: 1.25em; filter:brightness(0) invert(1)}
@media(hover:hover){
	.header-lang__btn:hover {color: var(--main-color);}
	.header-lang__link:hover {color: var(--main-color);}
}
@media(max-width:1080px){
	.header-lang {display: none;}	
}

.header-login {margin-left: 1.5em;}
.header-login__list {display: flex; align-items: center;}
.header-login__item {margin-right: 1em;}
.header-login__item:last-child {margin-right: 0;}
.header-login__link {display: block; transition:.15s ease-in-out all;}
.header-login__link,
.header-login__link:visited,
.header-login__link:link {color: #fff;}
@media(hover:hover){
	.header-login__link:hover {color: var(--main-color);}
}
@media(max-width:1080px){
	.header-login{display: none;}	
}

.header-drawer {position: relative; margin-left: auto;}
.header-drawer__btn {position: relative; width: 22px; height: 22px; z-index: 0; transition:.15s ease-in-out all;}
.header-drawer__dot {position: absolute; width: 8px; height: 8px; background-color: var(--main-color);}
.header-drawer__dot:first-child {top: 0; left: 0;}
.header-drawer__dot:nth-child(2) {top: 0; right: 0;}
.header-drawer__dot:nth-child(3) {bottom: 0; left: 0;}
.header-drawer__dot:nth-child(4) {bottom: 0; right: 0;}



/************************* header_inc 끝*************************/

/************************* sub-dropdown 시작 *************************/
.drop-menu {border-bottom:1px solid var(--main-gray);}
.drop-menu__inner {display: flex; border-right:1px solid var(--main-gray); border-left:1px solid var(--main-gray);}
.drop-menu__home {display: inline-flex; min-width: 3em; min-height: 3em; height: inherit; justify-content: center; align-items: center;}
.drop-menu__icon {width: 1.75em;}
.drop-menu__wrap {position: relative; z-index: 0; border-left:1px solid var(--main-gray);}
.drop-menu__wrap:last-child {border-right:1px solid var(--main-gray); }
.drop-menu__btn {display: flex; justify-content: space-between; align-items: center; min-width:15em; height: 100%; padding:0 0.15rem; font-weight: 500; transition:.15s ease-in-out all;}
.drop-menu__tit {display: block; font-size: 1.125em;}
.drop-menu__arr {margin-left: 1.5em; width: 0.75em; transition:.15s ease-in-out all;}
.drop-menu__navi {position: absolute; top: 100%; left: -1px; z-index: 10; width:calc(100% + 2px);  height: 0; overflow: hidden;}
.drop-menu__list {background-color: #fff; border:1px solid var(--main-gray);}
.drop-menu__link {display: block; padding:0.5em 0.15rem; transition:.15s ease-in-out all;}
@media(hover:hover){
	.drop-menu__link:hover {color: #fff;}
}

.drop-menu__btn.on {background-color: var(--main-color); color: #fff;}
.drop-menu__btn.on .drop-menu__arr {filter:brightness(0) invert(1); transform:rotate(180deg);}

/************************* dropdown 끝 *************************/
/************************* tabmenu 시작 *************************/
.tab-menu {padding: 5.1875em 0 0;}
.tab-menu__list {display: flex; border-bottom:1px solid var(--gray-200)}
.tab-menu__item {flex:1;}
.tab-menu__btn {position: relative; display: flex; justify-content: center; align-items: center; padding:0 0.5em; font-size: 1.5em; font-weight: 500; height: 100%; min-height: 2.8334em; text-align: center; border-bottom:5px solid transparent; transition: .3s;}
.tab-menu__btn[aria-current="page"] {pointer-events:none; border-color:var(--third)}
.tab-menu__btn--22[aria-current="page"] {border-color:var(--seventh)}
.tab-menu__btn--23[aria-current="page"],
.tab-menu__btn--32[aria-current="page"] {border-color:var(--fifth)}
.tab-menu__btn--24[aria-current="page"],
.tab-menu__btn--33[aria-current="page"] {border-color:var(--sixth)}
.tab-menu__btn:before {content:'';  position: absolute; top: 0; left: 50%; transform:translate(-50%, -50%); display: block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: cover; background-position: center;}
.tab-menu__btn--21[aria-current="page"]:before,
.tab-menu__btn--31[aria-current="page"]:before {background-image: url('./img/focus_green.svg');}
.tab-menu__btn--22[aria-current="page"]:before {background-image: url('./img/focus_sky.svg');}
.tab-menu__btn--23[aria-current="page"]:before,
.tab-menu__btn--32[aria-current="page"]:before {background-image: url('./img/focus_blue.svg');}
.tab-menu__btn--24[aria-current="page"]:before,
.tab-menu__btn--33[aria-current="page"]:before {background-image: url('./img/focus_purple.svg');}


@media(max-width:500px){
	.tab-menu__btn {font-size: 1.125em;}
}

@media(hover:hover){
	.tab-menu__btn--21:hover,
	.tab-menu__btn--31:hover {border-color:var(--third)}
	.tab-menu__btn--22:hover {border-color:var(--seventh)}
	.tab-menu__btn--23:hover,
	.tab-menu__btn--32:hover {border-color:var(--fifth)}
	.tab-menu__btn--24:hover,
	.tab-menu__btn--33:hover {border-color:var(--sixth)}
}
/************************* sub-tabmenu 끝 *************************/

/************************* depth3 시작 *************************/
.depth3__list {display: flex; flex-flow: row wrap;}
.depth3__item {flex:1;}
.depth3__item:last-child {border:0;}
.depth3__btn {padding:1.5em 0.75em; width: 100%; height: 100%; display: flex; align-items: center;justify-content: center; border-bottom:2px solid var(--main-gray); transition:.15s ease all;}
.depth3__btn--crt {border-color:var(--main-color);}
@media(hover:hover){
	.depth3__btn:hover {border-color:var(--main-color);}
}
/************************* depth3 끝 *************************/


/************************* footer_inc 시작 *************************/
.footer {font-size: var(--fz); padding:5em 0 4.851em; background-color: var(--main-black); color:  var(--gray-200);}
.footer__container {display: flex; flex-wrap:wrap; gap:1.95em;}
.footer__home {display: block; width: 10em;}
.footer__info {flex:1;}
.footer__meta {display: flex; flex-wrap:wrap; margin-bottom: 0.5em; line-height: 1.6;}
.footer__meta:last-child {margin-bottom: 0;}
.footer__dt {font-weight: 700; margin-right: 1em;}
.footer__dd {font-weight: 500; }
.footer__dd:after {content:'|'; margin:0 1.125em;}
.footer__dd:last-child:after {display: none;}
.footer__adm {display: flex; align-items: center; gap:0.25em; margin-top: 1.4em;}
.footer__cprt {font-size: 0.875em;}
.footer__link {font-size: 0.875em;}
.footer__terms {margin-left: auto; width: 100%; display: flex; justify-content: flex-end;}
.footer__btn {font-weight: 500; }
.footer__btn:after {content:'|'; margin:0 0.75em 0 1em;}
.footer__btn:last-child:after {display: none;}

@media(max-width:768px){
	.footer__terms {margin-left: 0;}
}
@media(max-width:500px){
	.footer {padding:3em 0;}
	.footer__meta {display: grid; grid-template-columns: 4.5em 1fr; row-gap:0.5em;}
	.footer__dt {margin-right: 0;}
	.footer__dd:after {display: none;}
}

/************************* footer_inc 끝 *************************/


.noto { font-family:'Noto Serif KR', 'Pretendard', '맑은고딕', sans-serif;}

.cate {width:max-content; padding:0 0.3405em; font-size: 1.5em; font-weight: 600; color: #fff; background-color: var(--main-color); border-radius:0.3em;}

.heading {font-size: 2.5em; font-weight: 600; line-height: 1.215; letter-spacing: -0.02em;  color: var(--main-color);}
.heading-2 {font-size: 2.25em;}
@media(max-width:768px){
	.heading {font-size: 2em;}
	.heading-2 {font-size: 1.75em;}
}

.fw-600 {font-weight: 600;}

.int-tit {display: flex; flex-direction:column; gap:0.5em;}

.int-box {position: relative; z-index: 1; padding:2.25em 1em 2.426em; max-width:902px; width: 67%; margin: 0 auto; border:1px solid var(--gray-200); border-radius: 1.25em; text-align: center; background-color: #fff;}
.int-box__tit {font-size: 1.5em; font-weight: 600; line-height: 1.3; }
.int-box__desc {font-size: 1.125em; font-weight: 500; line-height: 1.5; color: #626262; letter-spacing: -0.012em;}
.int-box__desc:before {content:''; display: block; width: 5.4em; height: 2px; background-color: var(--main-color); margin: 1em auto 0.9em;}
@media(max-width:768px){
	.int-box {max-width:100%; width: 100%;}
}

.card {display: grid;}
.card--col-2 {grid-template-columns: repeat(2, 1fr); gap:1.4375em 1.25em;}
.card--col-3 {grid-template-columns: repeat(3, 1fr); gap:2.5em;}
.card--twist {grid-template-columns: repeat(3, 1fr); gap:2.0625em}
.card--twist .card__item {border-radius:1.25em; overflow: hidden;}
.card--twist .card__item:nth-child(3n - 1) {transform:translateY(7.25em);}
@media(max-width:768px){
	.card--twist {gap:1em;}
	
	.card--twist .card__item {border-radius:0.75em}
	.card--twist .card__item:nth-child(3n - 1) {transform:translateY(3.125em);}
}


.ui-btn {display: flex; justify-content: center; align-items: center; min-width:9em; min-height: 2.4em; padding:0.5em 0.75em; text-align: center; background-color: var(--fourth); font-size: 1.25em; color: #fff; color: var(--gray-100);}
.ui-btn--flexible {flex:1;}

.mt-container {margin-top: -5.6875em;}
.mt-container--bg {background-color: var(--gray-50);}
@media(max-width:1080px){
	.mt-container {margin-top: 2em;}
	.mt-container--bg {background-color: transparent;}
}

.ready-page {display: flex; justify-content: center; align-items: center; text-align: center; min-height: 100dvh;}
.ready-page__text {font-size: clamp(24px, 7vw ,112px); font-weight: 700; color: var(--main-color);}