@charset 'utf-8';

/* ���� */
body.fixed{ overflow:hidden; }
.inner { width: calc(100% - 60px); max-width:1720px; margin:0 auto; }
video::-webkit-media-controls { display:none; }
.ls-2em{letter-spacing: -0.02em;}

/* header */
.header { position: fixed; left: 0; top: 0; width: 100%; height: var(--header-H); z-index: 800; transition: 0.4s ease-out;}
.header::after{ content:""; position:absolute; left: 0; top: var(--header-H); display: block; width: 100%; height: 1px; background-color: #DDD; z-index: 10; opacity:0; transition: 0.4s ease-out;}
.header-bg { position: fixed; left: 0; top: 0; width: 100%; height: 0; background-color: #fff; opacity:0; transition: 0.4s linear; z-index: -1; box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.05);}
.header>.inner { display: flex; justify-content:space-between; align-items:center; height: var(--header-H); }
.gnb { overflow:hidden; position: relative; height: 100%; margin-right: 53px;}
.gnb .gnb__list { padding-top: 47px; display: flex; column-gap:100px; }
.gnb .gnb__item{ font-size: 20px; font-weight: 600; }
.gnb .gnb__item>a { display: block; color: #111; transition: 0.4s linear; }
.gnb .depth2__wrap { overflow:hidden; position:fixed; left: 0; top:var(--header-H); display: flex; justify-content:space-between; width: 100%; height: 302px; transition: all 0.4s linear; opacity:0; z-index:-1; visibility: hidden; transform: translateY(-2px);}
.gnb .depth2__wrap .depth__inner{ position: relative; display: flex; justify-content:space-between; width: calc(100% - 60px); max-width:1720px; margin:0 auto; height: 100%; padding-top: 50px; }
.gnb .depth2__wrap .depth__inner strong{ font-size: clamp(24px,3.125vw,60px); font-weight: 700; letter-spacing: -0.02em; }
.gnb .depth2__wrap .header-banner { display: flex; flex-direction:column; justify-content:space-between; width: 380px; height: 190px; padding: 25px 30px; background: url('/img/common/banner_bg.jpg') no-repeat center center/cover ; opacity:0; transform:translateY(-50px); }
.gnb .depth2__wrap .header-banner>p{ font-size: 28px; font-weight: 600; line-height: 1.4; color:#fff; }
.gnb .depth2__wrap .header-banner>a{ display: flex; align-items:center; width: fit-content; padding: 8px 20px; font-size: 15px; letter-spacing: -0.02em; font-weight: 500; color: #444; background-color: #fff; }
.header .depth2__wrap .header-banner>a::after{ content:""; display: block; width: 9px; height: 9px; margin-left: 10px; background: url('/img/common/banner_arrow.svg') no-repeat center center/contain; }
.gnb .lnb__list { position:absolute; left: 50%; top:50px; display: flex; flex-wrap:wrap; gap:60px; width: 100%; max-width:746px; transform:translateX(-50%); transition: 0.4s linear;}
.gnb .lnb__item>a { font-size: 20px; font-weight: 500; color: #333; }
.header .btn-menu { position: relative; padding: 0; z-index: 999; }
.header .btn-menu.mobile { display: none; }
.header .btn-menu.active { position: relative; padding: 0; z-index: 999; }
.header .btn-menu.active svg rect { fill: #fff; }
.header .btn-menu svg rect { transition: 0.4s ease-out; }
.header .btn-menu.active svg rect:nth-child(even){ opacity:0; }
.header.on .btn-menu.active svg rect { fill: #fff; }
.header.scroll .btn-menu.active svg rect { fill: #fff; }

/* dark */
.dark .gnb__item>a{ color: #fff; }
.dark .btn-menu svg rect { fill: #fff; }
/* light */
.light .gnb__item>a{ color: #111; }
.light .btn-menu svg rect { fill: var(--main-color); }

/* hover */
.gnb .gnb__item>a:hover,.gnb .gnb__item>a:focus,.gnb .gnb__item>a:active { color: var(--main-color) !important; }
.header.on { background-color: #fff;}
.header.on::after{ opacity:1;}
.header.on .gnb { overflow: visible; }
.header.on .gnb .gnb__item>a { color: #111; }
.header.on .btn-menu svg rect { fill: #1A1A7C; }
.header.on .btn-menu svg rect { fill: #1A1A7C; }
.header.depth2 .header-bg { height: 420px; opacity: 1; }
.gnb .depth2__wrap.on .header-banner { opacity:1; transform:translateY(0); transition: transform 0.3s ease-out;}
.gnb .depth2__wrap.on { opacity:1; visibility: visible;}

/* fixed*/
.header.scroll { background-color: #fff;}
.header.scroll::after{ opacity:1;}
.header.scroll .gnb { overflow: visible; }
.header.scroll .gnb .gnb__item>a { color: #111; }
.header.scroll .btn-menu svg rect { fill: #1A1A7C; }
.header.scroll .btn-menu svg rect { fill: #1A1A7C; }

/* all menu */
#allMenu { position: fixed; left: 0; top: 0; display: none; width: 100%; height: 100dvh; background-color: rgba(255,255,255,0.01); -moz-backdrop-filter:blur(30px); -webkit-backdrop-filter:blur(30px); backdrop-filter:blur(30px); z-index: 900;}
.menu__inner { height: 100%; }
#allMenu .gnb__list { display: flex; height: 100%; }
#allMenu .gnb__item { flex:1; padding-top: min(25.53vh,240px); border-left: 1px solid rgba(255,255,255,0.15); }
#allMenu .gnb__item>a { display: block; width: calc(100% - 40px); max-width:187px; margin-left:20.83%; font-size: clamp(24px,2.4vw,46px); font-weight: 700; color: #fff; }
#allMenu .depth__inner strong { display: none; }
#allMenu .header-banner { display: none; }
#allMenu .lnb__list { width: calc(100% - 40px); max-width:187px; margin-top: 60px; margin-left:20.83%; }
#allMenu .lnb__list>li+li { margin-top: 20px; }
#allMenu .lnb__list>li>a { font-size: clamp(16px,1.042vw,20px); font-weight: 300; color: rgba(255,255,255,0.6); transition:0.3s ease-out;}
#allMenu.dark{ background-color: rgba(0,0,0,0.7); }
#allMenu .lnb__list>li>a:hover{ color: rgba(255,255,255,1); }

/* mo menu */
.mo-menu__wrap { display:none; position:fixed; right:0; top:0; width: 100%; height: 100dvh; z-index: 900; background-color: rgba(0,0,0,0.7); -moz-backdrop-filter:blur(30px); -webkit-backdrop-filter:blur(30px); backdrop-filter:blur(30px); }
#moMenu { width: 100%; height: 100%; }
#moMenu .depth__inner strong { display: none; }
#moMenu .header-banner { display: none; }
#moMenu .gnb__list{ margin-top: 80px; padding:40px; max-width:500px; }
#moMenu .gnb__list>*+* { margin-top: 20px;}
#moMenu .gnb__item>a{ position:relative; display:block; width:fit-content; padding: 10px 5px; font-size: 24px; font-weight: 500; line-height: 1.3; color: #fff;}
#moMenu .gnb__item>a::after { content:""; position: absolute; left: -5px; top:50%; display: block; width: 4px; height: 4px; background-color: #fff; transform:translateY(-50%); }
#moMenu .depth2__wrap { display: none; }
#moMenu .depth2__wrap { margin-top: 10px; }
#moMenu .depth2__wrap .inner { width: auto; max-width: initial; margin: 0; }
#moMenu .lnb__list { display: flex; flex-wrap:wrap; gap: 20px; }
#moMenu .lnb__list>li { width: calc(50% - 10px); }
#moMenu .lnb__list>li>a { font-size: 16px; padding: 0 10px; color: #ccc; }

/* footer */
.footer { padding: 80px 0; background-color: #151515; }
.footer>.inner { position:relative; }
.footer .top, .footer .bottom { display: flex; justify-content:space-between; column-gap:40px; }
.footer .bottom{ align-items:flex-end; margin-top: 89px; }
.footer .top .footer-title { font-size: clamp(22px,3.13vw,60px); font-weight: 600; color:#fff; }
.footer .top .footer-title>br{ display: none; }

.site-map .gnb__list { display: flex; }
.site-map .gnb__item { width: 200px; }
.site-map .gnb__item:last-child{ width: fit-content; }
.site-map .gnb__item>a{ font-size: 20px; font-weight: 600; color: #fff; }
.site-map .depth__inner strong { display: none; }
.site-map .header-banner { display: none; }
.site-map .lnb__list { margin-top: 20px; }
.site-map .lnb__list>li+li { margin-top: 10px; }
.site-map .lnb__list>li>a{ font-size: 17px; font-weight: 200; color: rgba(255,255,255,0.8); }

.footer__address { overflow:hidden; max-width:486px; font-size: 18px; font-weight: 200; color: rgba(255,255,255,0.8); }
.footer__address>ul { display: flex; flex-wrap:wrap; gap:10px 20px;}
.footer__address>ul>li{ position:relative; font-family: var(--font-Pretendard);}
.footer__address>ul>li::after{ content:""; display: block; position: absolute; left: -10px; top:50%; width: 1px; height: 12px; background-color: #fff; transform:translateY(-50%); }
.footer__address .copyright { font-family: var(--font-Pretendard); margin-top: 30px; color: rgba(255,255,255,0.4); }
.footer .bottom .etc-link{ display: flex; column-gap:25px; }
.footer .bottom .etc-link>a{ font-size: 20px; color: #fff; }
.btn-top__wrap { position:absolute; right: 0px; bottom:66px; }
.btn-top__wrap .btn-top { display: flex; flex-direction:column; justify-content:center; align-items:center; width: 100px; height: 100px; border: 1px solid rgba(255,255,255,0.15); border-radius:50%; }
.btn-top__wrap .btn-top>span{ font-size: 20px; font-weight: 300; letter-spacing: -0.02em; color: #fff; }
.btn-top__wrap .btn-top .arrow { width: 12px; height: 12px; margin-bottom: 3px; background: url('/img/common/arrow_up.svg') no-repeat center center/auto; }

/* privacy */
.privacy { color:#666; width: 100%; overflow: hidden; margin:0 auto; box-sizing:border-box; font-size:17px;	line-height: 140%; word-break:break-all; }
.privacy h2 { font-size:20px; font-weight:bold; color:#000; text-align: left; margin:50px 0 30px; }
.privacy h2:first-child { margin-top: 0; }
.privacy > p { margin:15px 0; }
.privacy > p+dl { margin-top: 30px; }
.privacy > dl { padding-bottom:20px;}
.privacy > dl > dt{ font-size:20px;color:var(--main-color);font-weight:700;padding-bottom:5px;}
.privacy > dl > dd{ padding-bottom:10px; font-size:17px; line-height:1.5; word-break: keep-all; }
.privacy > dl > dd ul{ padding:10px; }
.privacy > dl > dd ul li{ line-height:120%; margin-top: 10px; }
.privacy > dl > dd ul li:first-child { margin-top: 0; }
.privacy > dl > dd ul li p { margin:0 10px 5px; line-height: 140%; }
.sTxt h3 { font-size:20px; color: #333; font-weight: 700; margin: 20px 0 10px; }
.sTxt p { margin-top: 10px; }
.sTxt dt { margin-top: 10px; }
.sTxt dd { margin:0 8px; }

/* btn */
.button__wrap { display: flex; justify-content: center; align-items: center; }
.btn { display: flex; justify-content: center; align-items: center; }
.btn-box { width: 300px; height: 90px; font-family: var(--font-Pretendard); font-size: 24px; font-weight: 500; line-height: 1.3; letter-spacing: -0.02em; color: #fff; background-color: var(--main-color); }

@media screen and (max-width:1650px){
	.gnb .gnb__list { gap: 80px; }
	.gnb .lnb__list { max-width: 666px; gap: 40px; }
	.gnb .lnb__item>a { font-size: 16px; }
	.site-map .gnb__item { width: 130px; }
	.site-map .gnb__item>a { font-size: 16px; }
	.site-map .lnb__list>li>a { font-size: 14px; }
}
@media screen and (max-width:1200px){
	/* header */
	.header .gnb{display: none;}
	#allMenu{ background-color: rgba(0,0,0,0.7); }

	.dark .btn-menu svg rect { fill: #fff; }
	.light .btn-menu svg rect { fill: #fff; }
	
	/* footer */
	.btn-top__wrap { bottom:60px; }
	.footer .top .footer-title>br{ display: inline; }
	.footer__address { max-width:420px; font-size: 14px; }
	.footer .bottom .etc-link>a { font-size: 16px; }

	.privacy { font-size: 16px; }
	.privacy > dl > dt { font-size: 18px; }
	.privacy > dl > dd { font-size: 16px; }
	.sTxt h3 { font-size: 18px; }
}
@media screen and (min-width:1025px){
	.mo-menu__wrap { display:none !important;}
}
@media screen and (max-width:1024px){
	:root {
		--header-H:80px;
	}
	.header .logo { width: 60px; }
	.header .btn-menu svg { width: 20px; }
	.header .btn-menu.pc { display: none; }
	.header .btn-menu.mobile { display: block; }


	#allMenu { display: none !important; }
	.footer { padding: 40px 0; }
	.footer .top .footer-title>br{ display: none; }
	.footer .bottom { margin-top: 40px; }
	.site-map { display: none; }
	.btn-top__wrap .btn-top { width: 60px; height: 60px; }
	.btn-top__wrap .btn-top .arrow { width: 8px; height: 8px; background-size: contain; }
	.btn-top__wrap .btn-top>span { font-size: 14px; }

    .btn-box { width: 200px; height: 60px; font-size: 20px; }
}
@media screen and (max-width:768px){
	.footer .bottom { flex-direction:column-reverse; align-items:start; row-gap:20px; }
	.btn-top__wrap { top:0; bottom:auto; }
	.footer .bottom .etc-link>a { font-size: 14px; }

	.privacy { font-size: 14px; }
	.privacy > dl > dt { font-size: 16px; }
	.privacy > dl > dd { font-size: 14px; }
	.sTxt h3 { font-size: 16px; }

    .btn-box { width: 140px; height: 50px; font-size: 16px; }
}