/*Content CSS*/
#header_wrap { width:100%; height:120px; z-index:57; background:#fff; border-bottom:1px solid #ddd; left:0; top:0; position: fixed; -webkit-transition:all .2s ease;-moz-transition: all .2s ease;-ms-transition: all .2s ease;-o-transition: all .2s ease;transition: all .2s ease; }
#header { height: 100%; width: 100%; }
#header .header-inner { max-width:1760px; padding:0 20px; height:100%; margin:0 auto; display: flex; justify-content: space-between; align-items: center; position: relative; z-index: 10;  }
#header #logo { position: relative; z-index: 2; display: flex; justify-content: center; align-items: center; }
#header #logo a { display:block; width: 200px; transition: all .2s; }

#top_nav {height: 100%; display: flex; align-items: center; }
#top_nav .gnb { list-style:none; display: flex; justify-content: flex-end; padding:0; }
#top_nav .gnb > li { display:block; width:auto; text-align:center; margin-left:70px; position: relative; }
#top_nav .gnb > li:first-child {margin-left:0;}
#top_nav .gnb > li {-webkit-transition: all .2s ease;-moz-transition: all .2s ease;-ms-transition: all .2s ease;-o-transition: all .2s ease;transition: all .2s ease; }
#top_nav .gnb > li > a { font-size:19px; font-weight: 500; color:#000; font-family: 'Karla', sans-serif; height: 100%; display: flex; align-items: center; transition: color .2s ease; height: 35px;  white-space: nowrap; }
/* #top_nav .gnb > li > a::after {position: absolute; bottom: -1px; left:50%; transform:translateX(-50%); content: ""; width: 0px; height: 2px; background:#f14d0d; }
 #top_nav .gnb > li > a:hover::after,
#top_nav .gnb > li.active > a::after { width:200px; }
#top_nav .gnb > li > a.active::after {width:200px; } */
#top_nav .gnb > li > a:hover {color:#ff6127 !important;}
#top_nav .gnb > li > a.active {color:#ff6127; }


#top_nav .gnb > li:last-child > a { padding:8px 20px; background:#f14d0d; border-radius: 5px; color:#fff !important; font-size:14px; border:1px solid #f14d0d; transition: all .2s; }


/*child_menu*/
#top_nav .gnb .snb { position:relative; list-style:none; display:none; }
#top_nav .gnb .snb::before { content: ""; position: absolute; top:0; left:50%; transform:translateX(-50%); width: 100%; height: 2px; background:#f14d0d; }
#top_nav .gnb .snb,
.device-md #top_nav .gnb .snb { display: none; position: absolute; top:77px; border-top: 0; z-index:2; left:50%; transform:translateX(-50%); }
#top_nav .gnb .snb li { width:200px; border-top:1px solid rgba(255,255,255,.2); background-color: rgba(0, 0, 0, 0.8); transition: all .3s; }
#top_nav .gnb .snb li a { white-space: nowrap; color:#fff; display:block; text-align: center; line-height:3.7; font-size:14px; transition: all .2s; letter-spacing: -0.35px; font-weight: 300; }
#top_nav .gnb .snb li:hover { background:rgba(255,255,255,0.9); }
#top_nav .gnb .snb li a:hover { color:#ff530e;}
#top_nav .gnb .snb li:first-child { border-top:0;}

/* #top_nav .gnb > li:nth-child(2) .snb li { width:250px; } */


/* .snb_bg { width:100%; height: 80px; background: #fff; position: absolute; left:0; top:90px; z-index: -1; display: none; } */


/* hidden_nav */
#hd_btn_wr { width:200px; text-align: right; display: flex; align-items: center; justify-content: flex-end; }
.menu_slider_btn { display:inline-block; width: 20px; height: 20px; background:url('../img/btn_menu_b.png'); cursor: pointer; position: relative; }

.menu_slider_btn2 { display: block; cursor: pointer; transform: translate(-50%, -50%); position: absolute; right:60px; top:80px;}
.menu_slider_btn2 span { display: block; background: #ff530e; width: 25px; height: 2px; border-radius: 3px; transition: 0.25s margin 0.25s, 0.25s transform;}
.menu_slider_btn2 span:nth-child(1) { margin-top: 0; margin-bottom: -0; transform: rotate(45deg);}
.menu_slider_btn2 span:nth-child(2) { transform: rotate(45deg); display: none; }
.menu_slider_btn2 span:nth-child(3) { margin-top: -2px; transform: rotate(135deg); }

.hidden_nav_box {width :100%; height: 100%; background: rgba(0,0,0,0.7); position: absolute; top: 0; left: 0; z-index: 9999; position: fixed; display: none;}
.hidden_nav {text-align: center; width: 640px; height: 100vh; position: absolute; top: 0; right: -640px; background: #fbfbfb; z-index: 10000; position: fixed; text-align: left;
    padding:140px 70px 0 70px;}
.hidden_nav .hidden_gnb  { width: 100%; }
.h_lm {margin-bottom:50px; position: relative; }
.h_lm > a {display: block; font-size:26px; font-weight: 700; color:rgba(0,0,0,.5) !important; transition: all .3s ease; max-width:200px; position: relative; font-family: 'NanumSquare',sans-serif; }
.h_lm > a:hover,
.h_lm > a.active {color:rgba(0,0,0,1) !important;}
.h_snb {display: none; position: absolute; left:200px; top:5px; z-index: 2;}
.h_snb li {margin-bottom:25px;}
.h_snb li a {font-size:18px; font-weight: 400; color:#707070; transition: all .3s ease; border-bottom:2px solid transparent; padding:2px 0; font-family: 'NanumSquare',sans-serif;
white-space: nowrap; }
.h_snb li a:hover {padding:2px 15px; border-bottom:2px solid #ff530e; color:#ff530e;}

.h_lm:last-child > a { color:#ff530e !important; }


/* select_link */
.lang_li { display: flex; margin-right: 30px; }
.lang_li a { position:relative; font-family: 'Karla', sans-serif; color: #ccc; display: block; font-size: 15px; font-weight: 500; transition: all .2s; }
.lang_li a::after { content:""; display: inline-block; width:1px; height: 11px; background:#ccc; margin:0 10px; }
.lang_li li:last-child a::after { display: none; }
.lang_li a.active { color:#f14d0d; }


/* white header(scrolled) */
.scrolled #header_wrap { height: 80px; box-shadow:0 0 7px rgb(0 0 0 / 30%); border-bottom-color:transparent; }
.scrolled #header_wrap #logo a img { height: 58px; }
.scrolled #top_nav .gnb .snb,
.scrolled .device-md #top_nav .gnb .snb { top:58px; }
.scrolled .lang_li a:hover { color:#000; }




/* hover */
@media screen and (min-width:1101px) {
    #header_wrap:hover #top_nav .gnb > li:last-child > a:hover { background:#fff; color:#f14d0d !important; }
    #header_wrap:hover .lang_li a:hover { color:#000; }
}



/* 반응형 */
@media screen and (max-width:1760px) {

    #header .header-inner { padding: 0 40px; }

}

@media screen and (max-width:1500px) {

    #header #logo a { width: 150px; }
    #top_nav .gnb > li { margin-left: 35px; }
    #hd_btn_wr { width: 150px; }

}

@media screen and (max-width:1200px) {

    #top_nav .gnb > li:last-child > a { padding: 8px 10px; }
    .lang_li { margin-right: 20px; }
    #header_wrap #logo a img { height: 58px; }
}


@media screen and (max-width:1100px) {

    #top_nav { display: none; }
    #hd_btn_wr { display: none; }


    #header_wrap { height: 60px; }
    #header_wrap #logo a { width:auto; }
    #header_wrap #logo a img { height: 43px; }

    #header .header-inner { justify-content: center; }

    .scrolled #header_wrap { height: 60px; }
    .scrolled #header_wrap #logo a img { height: 43px; }

}