@charset "UTF-8";

/*S : 웹 시작*/
#pc_header{padding:40px 12px; background:#19479d; position:fixed; width:300px; left:0; top:0; z-index:1; height:100vh;
background-image:url(/resources/custom/images/sso/sub/ico-logo-deco.png); background-repeat: no-repeat;
background-position: 99% 99%; background-size: 140px auto;}
#pc_header h1 a{display:flex; align-items:center; flex-direction:column; gap:10px;}
#pc_header h1 span{font-family:'Gmarket'; font-size:20px; font-weight:300; color:#fff;}
.open-menu{display:none;}
.open-menu img{width:32px;}

#pc_header nav{margin-top:40px;}
#gnb > ul > li{margin-bottom:10px;}
#gnb > ul > li a{display:block; padding:12px; background-color:#fff; font-size:16px; color:#19479d; border-radius:4px;}
#gnb > ul > li a span{font-weight:600;}

@media all and (max-width:1024px){
		#pc_header{width:100%; height:auto; position:relative; padding: 20px 12px; background-image:none; display:flex; align-items:center; justify-content: space-between;}
		#pc_header h1 a{flex-direction:row;}
		#pc_header nav{position:absolute; top:77px; left:-250px; height:100vh; background:#fff; width:100%; max-width:250px; padding:30px 12px; background-image:url(/resources/custom/images/sso/sub/ico-logo-deco.png); background-repeat: no-repeat;
         background-position: 99% 99%; background-size: 140px auto; margin-top:0; transition:all .3;}
         #gnb > ul > li a{border:1px solid #eee;}
         .open-menu{display:block;}
}
@media all and (max-width:767px){
		#pc_header h1 a img{width:150px;}
		#pc_header h1 a span{font-size:16px;}
		#pc_header nav{top:77px;}
}
@media all and (max-width:400px){
		#pc_header h1 a{        flex-direction: column; gap:4px;}
		#pc_header nav{top:85px;}
}

.backdrop{width:100%; height:100%; background:rgba(0,0,0,.3); position:fixed; top:0; left:0; z-index:1; }