/*Content CSS*/
#header_wrap { width:100%; height:90px; background-color:transparent; z-index:57; position: fixed; top:0; left:0;}
#header #logo { margin-left:0; display: flex; align-items: center; padding:40px 0 0;}
#header #logo a { display:block; width: 250px; height: 50px; transition: all .3s; background: url('../img/logo_b.png') 50% 50% no-repeat; }
#header #logo.active a { background-image: url('../img/logo_b.png');}

#header {left:0;top:0px; width:100%; z-index:6;height:90px;-webkit-transition:all .3s ease;-moz-transition: all .3s ease;-ms-transition: all .3s ease;-o-transition: all .3s ease;transition: all .3s ease; margin:0 auto; position: relative; z-index: 1000;}
#header .header-inner {width:100%; height:100%; max-width:1740px; margin:0 auto; display: flex; justify-content:space-between;  padding:0 20px;}

/* 히든메뉴*/
/* #menu_slider_btn { display: flex; padding-top: 55px; cursor: pointer; z-index: 10;}
#menu_slider_btn .line { width:32px; height: 23px; background:url('../img/btn_menu.png') no-repeat center; transition: all .3s; }
#menu_slider_btn .close { display: none; }
#menu_slider_btn.active .close { display: block; }
#menu_slider_btn.active .line { display: none; } */


.hidden_nav {text-align: center; width:0; height: 100vh; right:0; position: absolute; z-index: 999; position: fixed; top:0; padding:0; transition: all .8s cubic-bezier(0.215, 0.610, 0.355, 1); background:rgba(255,255,255,.85);
    mix-blend-mode: multiply; }
.hidden_nav.active { left:0; width:100%;  }
.hidden_nav > div { position: absolute; width: 90%; left:50%; transform:translate(-50%,-50%); top:50%; display: none;}

.hidden_nav .hidden_gnb  { width: 100%; }
.h_gnb { display: flex; align-items: center; width: 100%; flex-direction: column; line-height: 1; }
.h_lm { position: relative; padding-bottom: 30px; }
.h_gnb .h_lm:last-child {margin-bottom: 0;}
.h_lm > a { position:relative; display: inline-block; font-size:40px; font-weight: 500; font-family: 'Poppins', sans-serif; white-space: nowrap; line-height: 50px; transition: all .3s; cursor: pointer;  }
.h_lm > a:before { content:""; position:absolute; left:0; width:0; bottom:0; height: 3px; background:#e20419; transition: all .3s; }

.h_lm > a.active { color:#e20419; }
.h_lm > a.active:before { width:100%; }

.h_lm > a:hover { color:#e20419; }

.h_snb { margin-top:30px; display: none; }
.h_snb li {margin-bottom:25px; }
.h_snb li a {font-size:25px; font-weight: 300; font-family: 'Poppins', sans-serif; transition: all 3s;}
.h_snb li a:hover {color:#000; }

/* black */
#header_wrap.black #logo a { background-image: url('../img/logo_b.png?v=220215');}

/* .scrolled #header #logo a { background-image: url('../img/logo_b.png');}
.scrolled #menu_slider_btn .line { background-image:url('../img/btn_menu2.png'); } */

/* 햄버거 버튼  */
#open-button { top:0px; z-index:10000; padding-top:55px; -webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out;cursor:pointer;display:block; }
#open-button > div { width:75px; height:30px; }
#open-button .navicon-line {position:absolute;width:20px;height:2px;border-radius:1px;background-color:#000;-webkit-transition:all .7s ease-out;-moz-transition:all .7s ease-out;-o-transition:all .7s ease-out;transition:all .7s ease-out}
#open-button .nl1 { top: 0; right: 0; width:24px;}
#open-button .nl2 { top: 10px; right: 0; width:32px;}
#open-button .nl3 { top: 20px; right: 0; width:24px;}
#open-button.on>div>div{transform:rotate(225deg);-ms-transform:rotate(225deg);-webkit-transform:rotate(225deg);width:28px;position:absolute;top:15px;right:0;margin:0;padding:0;background-color:#000;}
#open-button.on>div>div:first-child{transform:rotate(135deg);-ms-transform:rotate(135deg);-webkit-transform:rotate(135deg)}

.scrolled #open-button .navicon-line {background-color: #000;}
.scrolled #open-button.on .navicon-line {background-color: #000;}


@media screen and (max-width: 1700px) {
    #header_wrap { position:absolute; }
}

@media screen and (max-width: 1024px) {
    #header_wrap { position:fixed; height: 60px; }
    #header { height: 60px; }
    /* #header .header-inner { justify-content: center; } */
    #header #logo { padding:0;}
    #header #logo a { width: 150px; height: 40px; background-size: contain; background-image: url('../img/logo_b.png'); }

    #open-button { padding-top:20px; }
    #open-button .navicon-line { background-color: #000; }
}

@media screen and (max-width: 768px) {
    .h_lm { padding-bottom: 20px; }
    .h_lm > a { font-size: 26px; line-height: 38px; }

    .h_snb { margin-top: 20px; }
    .h_snb li { margin-bottom: 20px; }
    .h_snb li a { font-size: 18px; }

    #open-button .nl1 { width: 22px; }
    #open-button .nl2 { top:9px; width: 30px; }
    #open-button .nl3 { top:18px; width: 22px; }
    #open-button.on>div { top:-5px; }
    #open-button.on>div>div{ width:23px;}
}
