/* ************************ 데스크탑 (1200~) ************************ */
@media screen and (min-width: 1200px), print {

	header {z-index:999; position:absolute; width:100%; min-width:1200px; top:0; left:0;}
	header .headerWrap {width:100%; max-width: 1400px; margin:0 auto; position:relative;}
	header .headerWrap h1 {position:absolute; z-index:99999; left:0; top:0;}
	header .headerWrap h1 a {height:150px; display:flex; align-items:center;}
	header .headerWrap h1 a img { width:100%; height:70px;}
	header .headerWrap h1 a img.off { width:100%; height:70px; display:none;}
	header .headerWrap h1 a img.on {display:block;}

	header .navBg {
		background:transparent; position:absolute; left:0; top:0; width:100%; height:0;
		transition:all .3s ease !important;
	}

	header .asideWrap {display:flex; height: 150px; position: absolute; right:0; top:0; z-index: 9}
	header .asideWrap a {align-self:center; color: rgba(255, 255, 255, 0.50);font-size:var(--fs14);font-weight: 600; line-height:1;}
	header .asideWrap a.active {color: var(--c_base2);}
	header .asideWrap a+a {padding-left:20px; margin-left:20px; border-left:2px solid #fff;}

	nav {height:150px; position:relative; margin:0 auto; overflow:hidden; transition:all .3s;}
	nav .gnb {width: 100%; max-width: 1400px; margin: 0 auto; display: flex; justify-content: flex-end; align-items: center; gap: 50px;}
	nav .gnb .dep1 {height:150px; display:flex; gap:6vw;}
	nav .gnb .dep1>li {padding:60px 0;display:flex; flex-direction:column;}
	nav .gnb .dep1>li>a { color:rgba(255, 255, 255, 0.90); font-weight:600; font-size:20px; display:block; position:relative;transition:0.2s;}
	nav .gnb .dep1>li>a:after {width:100%; height:2px; left:0; bottom:0; position:absolute; display:block; content:'';transition:0.2s;}

	nav .gnb .dep2 {opacity:0; top:120px; position:absolute; gap:10px; display:flex; flex-direction:column;transition:all .3s;}
	nav .gnb .dep2>li {}
	nav .gnb .dep2>li a {display:inline-block; color:#333; white-space:nowrap; position:relative; transition:0.2s;}
	nav .gnb .dep2>li a:hover,
	nav .gnb .dep2>li.on a {color:var(--c_base1); border-color:inherit;}

	nav .gnb .dep1>li.on>a:after {background:#fff;}

	header .navBg {background:transparent; position:absolute; left:0; top:0; width:100%; height:0; transition:all .3s ease !important;}

	header.on {}
	header.on .headerWrap h1 a img.off {display:block;}
	header.on .headerWrap h1 a img.on {display:none;}
	header.on .navBg {height:100%; background:#fff;}
	header.on .navBg:after {opacity:1;transition:all .5s ease;}
	header.on nav {height:375px; box-shadow:0 0 10px rgba(0,0,0,.2)}
	header.on nav .gnb>ul {height:auto;}
	header.on nav .gnb>ul>li.on>a,
	header.on nav .gnb>ul>li:hover>a {color:var(--c_base1) !important;}
	header.on nav .gnb>ul>li.on>a:after {background:var(--c_base1);}
	header.on nav .gnb>ul>li>ul {opacity:1;}
	header.on .gnb>ul>li>a {color:#000;}
	header.on .asideWrap {}
	header.on .asideWrap a {color:#aaa;}
	header.on .asideWrap a+a {border-color:#999}
	header.on .asideWrap a.active {color: var(--c_base2);}

}

/* ************************ 태블릿 이하(~1199) ************************ */
@media screen and (max-width: 1199px) {

	header { position:absolute; left:0; top:0; width:100%; z-index:999; height:70px;}
	header .headerWrap { }
	header .headerWrap .gnbView { position:absolute; right:0; top:0; width:70px; height:70px; background:url(/images/common/menu.svg)center /22px no-repeat; } /* ✅ 이미지 경로 교체 허용 */
	header .headerWrap h1 { display:inline-block; }
	header .headerWrap h1 a { height:70px; display:flex; align-items:center; padding-left:30px;}
	header .headerWrap h1 a img { height:40px;}
	header .headerWrap h1 a img.off {display:none;}

	header .gnbCover {display:none; background:rgba(0,0,0,.8); width:100%; height:100vh; left:0; top:0; position:fixed; }

	nav {transform:translateX(100%); z-index:9999; position:fixed; right:0; top:0; width:600px; max-width:80%; min-width:320px; height:100%; overflow:hidden; background:#fff; transition:all .3s;}
	nav.active {transform:translateX(0);}
	nav .closeWrap {padding-left:20px; display:flex; gap:20px; align-items:center; position:relative; height:60px; border-bottom: 1px solid rgba(0,0,0,.15); overflow:hidden; font-weight : 500; }
	nav .closeWrap a {font-size:var(--fs14);}
	nav .closeWrap a.lang {color:var(--c_base2);}
	nav .closeWrap .gnbClose {
		position:absolute; right:0; top:0;
		width:60px; height:60px; background:url(/images/common/icon_close.png)center no-repeat; background-size:20px; border-left:1px solid rgba(0,0,0,.15); /* ✅ 이미지 경로 교체 허용 */
	}
	nav .gnb { position:relative; width:100%; height:calc(100% - 60px); overflow-y:auto; text-align:left !important; font-weight : 400; }
	nav .gnb * {width:100% !important; }
	nav .gnb .dep1>li { clear:both; position:relative; border-bottom:1px solid #e5e5e5; }
	nav .gnb .dep1>li>a { display:block; padding:20px; font-size:17px; }
	nav .gnb .dep1>li>a span { font-size:14px; color:#999; padding-left:5px; }
	nav .gnb .dep1>li.on { border-color:var(--c_base1); }
	nav .gnb .dep1>li.on>a { background:var(--c_base1); color:#fff; }
	nav .gnb .dep1>li.on>a span { color:#fff; }

	nav .gnb .dep2 {display:none;}
	nav .gnb .dep2>li {position:relative; border-top: 1px solid #eee; }
	nav .gnb .dep2>li a { display:block; padding:15px 40px; font-size:15px; letter-spacing:-.8px; background:#fff; }
	nav .gnb .dep2>li a span { font-size:14px; color:#999; padding-left:5px; }
	nav .gnb .dep2>li:last-child a { border-color:#e0e0e0; }
	nav .gnb .dep2>li a:hover { color:#000; background-color:#f5f5f5; }
	nav .gnb .dep2>li.on a { color:var(--c_base1); font-weight:700; }
	nav .gnb .dep2>li.on a span { color:var(--c_base1); }

}

/* ************************ 모바일 (0~767) ************************ */
@media screen and (max-width: 767px) {

}
