
/* ************************ 데스크탑 (1249~) ************************ */
@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:90vw; margin:0 auto; position:relative; } 
	header .headerWrap h1 {position:absolute; z-index:99999; left:0; top:50px; } 
	header .headerWrap h1 a { } 
	header .headerWrap h1 a img { width:100%; height:44px;} 
	header .headerWrap h1 a img.off { width:100%; height:44px; display:none;} 
	header .headerWrap h1 a img.on {display:block;} 
	
	header .gnb_contain {}
	header .gnb_wrap {width:100%; max-width:90%; margin:0 auto; height:100px; background:transparent;position:relative;text-align:right;}
	header .gnb_wrap aside {display:flex; position:absolute; right:0; top:40px; letter-spacing:0; align-items: center; z-index:999;}
	header .gnb_wrap aside a {color:#fff; font-size:13px;}
	header .gnb_wrap aside .inputWrap {display:flex; gap:5px;}
	header .gnb_wrap aside .inputWrap input {height:40px; max-width:150px; border:1px solid var(--border1); border-radius:10px; padding: 0 10px;}
	header .gnb_wrap aside .inputWrap input::placeholder {font-size:14px; color:#000;}
	header .gnb_wrap aside .inputWrap button {height:40px; width:65px; border-radius:10px; background:var(--blue2); font-size:14px; color:#fff; cursor: pointer;}
	header .gnb_wrap aside .inputWrap label {display:none;}
	header .gnb_wrap aside .link {display:flex; margin-left:30px;}
	header .gnb_wrap aside .link a {display:inline-block; color:#000; font-size:14px; font-weight:700; transform:var(--textRotate); padding:0 20px; height:40px; line-height:40px; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;}
	header .gnb_wrap aside .link a.login {background:#fff; border-radius:2rem; padding: 0 20px;}
	header .gnb_wrap aside .link a.login img {margin-right:10px;}
	header .gnb_wrap aside .link a.join {border:2px solid #fff; border-radius:2rem; color:#fff; line-height: 36px;}
	header .gnb_wrap aside .link a.mall {border:2px solid #fff; border-radius:5px; color:#000; line-height: 36px; background:#fff; padding:0 15px;}
	header .gnb_wrap aside .link a.mall img {width:18px; margin-right:5px;}
	header .gnb_wrap aside .link a+a {margin-left:15px;}
	header .gnb_wrap h1.logo {position:absolute;top:0;left:0;height: 100%; padding-top:50px; z-index:999;}
	header .gnb_wrap #gnb{display:flex; justify-content:center; padding-top:60px;}
	header .gnb_wrap #gnb ul{position:relative; width:100%; display:flex; padding-left:160px; gap:70px; justify-content:center;}
	header .gnb_wrap #gnb>ul>li{}
	header .gnb_wrap #gnb>.gnb>ul>li:before {}
	header .gnb_wrap #gnb>ul.gnb>li>ul>li+li {margin-top:15px;}
	header .gnb_wrap #gnb>.gnb ul ul ol.dep3 + li {margin-top:15px;}
	header .gnb_wrap #gnb>.gnb>ul>li>a{position:relative; height:auto;line-height: 1; font-size:var(--fs22); font-weight:600; letter-spacing: -.8px; color:#fff; z-index:999; transform:var(--textRotate);  }
	header .gnb_wrap.sub #gnb>ul>li>a {color:#fff!important;}
	

	header .gnb_wrap #gnb>.gnb ul a{display:block;color:#000;text-decoration:none;font-weight:400; transition:.3s ease;}
	header .gnb_wrap #gnb>.gnb ul li{position:relative;}
	header .gnb_wrap #gnb>.gnb ul.dep2 li+li {margin-top:15px;}
	header .gnb_wrap #gnb>.gnb>ul>li{height:50px;}
	
	header .gnb_wrap #gnb>.gnb ul ul{display:none; position:absolute; width:100%;background:#fff;padding:30px;box-shadow:4px 6px 8px rgba(0,0,0,.2)!important;z-index:9; border-radius:15px; border:1px solid var(--border1); min-width:120px; top:40px; padding:25px 10px; left:50%; transform:translateX(-50%); box-sizing:content-box; overflow:hidden;}
	header .gnb_wrap #gnb>.gnb ul ul:before {content:""; display:block; width:140px; height:3px; background:var(--amethyst); position:absolute; top:0px; }
	header .gnb_wrap #gnb>.gnb ul ul a:hover {color:var(--c_base1);}
	
	header .gnb_wrap #gnb ul ul li{width:100%}
	header .gnb_wrap #gnb>.gnb>ul>li>a {height:100%;} 
	/*header .gnb_wrap #gnb>ul>li.on>a {color:var(--green); }*/
	header .gnb_wrap #gnb>.gnb ul ul a{position:relative; font-size:var(--fs18);padding:0px;text-align:center;line-height: 1.2; transform:var(--textRotate);  font-weight:400;}
	header .gnb_wrap #gnb>.gnb ul ul a:hover, header .gnb_wrap #gnb>.gnb ul ul li.on a {color:var(--c_base1)!important; font-weight:500;}
	header .gnb_wrap #gnb>.gnb ul ul a:hover:before, header .gnb_wrap #gnb>.gnb ul ul li.on a:before  {content:""; display:block; width:5px; height:5px; border-radius:50%; background:var(--c_base1); position:absolute; left:15px; top:8px;}
	
	header .gnb_wrap #gnb>.gnb ul li:hover>a {/*background:#fff;*/ color:var(--c_base3);}
	/*header .gnb_wrap #gnb ul li:hover ul:before {animation: wider .5s ;}*/
	header .gnb_wrap #gnb>.gnb ul li:hover > ul {display:block;}
	
	header .asideWrap {display:flex; gap:15px; height: 45px; position: absolute; right:0; top:50px; z-index: 9}
	header .asideWrap a {height:45px; display:flex; align-items:center; color: #FFF;font-size:var(--fs14);font-weight: 300;line-height: normal;}
	header .asideWrap a.homelink:before {content:""; display:block; width:35px; height:35px; background:#fff url(/images/common/i-home.svg) no-repeat 53% center / 16px; border-radius:50%; position:absolute; left:-47px; top:6px;}
	header.on .asideWrap a.homelink:before {background:var(--c_base1) url(/images/common/i-homeW.svg) no-repeat center / 16px;}
    header .asideWrap .loginBtn {width:45px; background:#fff url(/images/common/icon_login.svg)center no-repeat; border-radius:50%; }
	header .asideWrap .logoutBtn {}
    header .asideWrap .joinBtn {}
    header .asideWrap .findBtn {}
}

/* ************************ 태블릿 이하(~1249) ************************ */
@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 .gnbView img { } 
	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:35px;}
	header .headerWrap h1 a img.off {display:none;}
	
	
	/*gnb*/
	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:10px; 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 .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); } 
	
	nav .closeWrap a.homelink {position:relative; display:flex; align-items:center; gap:10px; }
	nav .closeWrap a.homelink:before {content:""; display:block; background:var(--c_base1) url(/images/common/i-homeW.svg) no-repeat center / 13px; width: 30px;
        height: 30px;
        border-radius: 50%;}
}

/* ************************ 모바일 (0~767) ************************ */
@media screen and (max-width: 767px) {
	header .headerWrap h1 a {padding-left:20px;}
	
}
