@charset "UTF-8";

header{left:0; top:0; width:100%;  z-index:998; color: #464646; background:#fff; border-bottom:1px solid #e9e9e9;/* box-shadow: 1px -11px 31px #454545;*/ position:absolute;}
header .white{color: #fff;}
header.fixed{position:fixed;}
header h1{float:left; padding-top:21px; transition: padding .5s ease}
header h1 img{transition:width .5s ease; display: block;}
header .lnb{position: relative; z-index:2; margin-right:0px; /*margin-left: calc(50% - 300px);*/ float:right;}
header .lnb .dep1 > li{float:left; position: relative;}
header .lnb .dep1 > li > a{line-height:75px; display: block; font-size:17px; position: relative; padding:0 35px; text-align: center; letter-spacing:-.03em; font-weight:600; transition:line-height .5s ease}
header.scrolled h1{padding-top:9px;}
header.scrolled h1 img{width:100px;}
header.scrolled .lnb .dep1 > li > a{line-height:60px;}
header .lnb .dep1 > li > div {overflow:hidden;position:absolute; visibility: hidden; text-align:left;  width:180px; opacity:0; transition:all .3s ease; -webkit-transition:all .3s ease;     transform: translateY(10px);
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);}
header .lnb .dep1 > li:last-child > div{left:auto; right:0;}
header .lnb .dep1 > li:hover > div {opacity:1; visibility:visible;     transform: translateY(0px);
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px); padding-top:1px;}
header .lnb .dep2 {padding:8px 0; vertical-align:top;white-space:nowrap; background:#222;}
header .lnb .dep2 > li {font-size:0;}
header .lnb .dep2 > li > a {display:block;padding:10px 15px;font-size:14px; margin-right:0px; font-weight:400; color: #888;}
header .lnb .dep2 > li:last-child > a {margin-right:0;}
header .lnb .dep2 > li.on > a, header .lnb .dep2 > li:hover > a {color:#eee;}
header  .sns{position:absolute; right:0; top:29px;}
header  .sns li{display:inline-block; margin-left:14px; font-size: 18px;}

.nav_btn{position:absolute; right:20px; top:21px; width:24px;height:19px; display:none;}
.gnb{position: absolute; top: 26px; right: 110px; display:none;}
.gnb a{border: 1px solid #dcdcdc; padding: 5px 22px; font-size: 13px; border-radius: 18px; color: #666; margin-left:2px;}
.gnb a.filled{background:#666; color: #fff; border-color:#666}
@media screen and (max-width: 1280px) {

}
@media screen and (max-width: 1020px) {
header .lnb .dep1 > li > a{padding:0 18px; font-size:15px;}
}
@media screen and (max-width: 767px) {
header h1{padding-top:17px; padding-bottom:17px;}
header h1 img{width:140px;}
  .nav_btn{display: block;}
   .lnb{display:none;}
}
@media screen and (max-width: 640px) {
.nav_btn{right:10px;}
}