/*Content CSS*/
#header_wrap {position: absolute; top:0; left:0; width:100%; height:90px; background-color:transparent; z-index:57;
border-bottom: 1px solid rgba(255,255,255,.3); transition: all .3s; }


#header #logo { display: flex; align-items: center; margin-left:0; padding:0; }
#header #logo a { display:block; font-size: 0;}
#header { position: absolute; left:0; top:0px; width:100%; z-index:50; 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; z-index: 10; }
#header .header-inner { display: flex; justify-content: space-between; align-content: center; width:100%; height:100%;
    max-width:1740px; margin:0 auto; padding:0 20px; }
#header .header-inner .menu { cursor:pointer; text-indent:-9999px; position:absolute; top:29px; left:50%; width:25px;height:20px; background-image:url('../img/cate_more.gif'); margin-left:200px; border:0; display:none}
#header .header-inner .menu.on { background-image: url('../img/cate_close.gif')}
/* .scrolled #header_wrap  { background-color:#000; border-bottom:none; -webkit-transition:all .3s ease;-moz-transition: all .3s ease;-ms-transition: all .3s ease;-o-transition: all .3s ease;transition: all .3s ease; } */

#top_nav { display: flex; align-items: center; height:100%; }
#top_nav .gnb { display: flex; list-style:none; height:100%; }
#top_nav .gnb > li { position:relative; display:block; width:auto; vertical-align:middle; text-align:center; margin-left:100px;}
#top_nav .gnb > li { height:90px; line-height:90px; -webkit-transition: all .4s ease; -moz-transition: all .3s ease;
    -ms-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; }
#top_nav .gnb > li > a { display:block; line-height:90px; height: 90px;  width:100%; color:#fff; font-size:18px; font-weight:600;
    text-decoration:none; white-space: nowrap; transition: all .3s ease; border-bottom: 2px solid transparent;
    font-family: 'NanumSquare',sans-serif; position: relative; transition: all .3s; }

#top_nav .gnb > li:first-child { margin-left:0;}
#top_nav .gnb > li:last-child a::after { display: none; }


/*child_menu*/
#top_nav .gnb .snb { display:none; list-style:none; }
#top_nav .gnb .snb,
.device-md #top_nav .gnb .snb { display: none; position: absolute; left:50%; transform:translateX(-50%); width: 250px; top:90px;
    border-top: 0; z-index:30; padding-top: 10px; margin-top: -10px; background:url('../img/navi_tri.png') no-repeat 50% 0;}

#top_nav .gnb .snb li { font-size:15px; line-height:50px; border-top:1px solid rgba(255,255,255,.1);
    background-color:rgba(0,85,144,.85); transition: all .3s ease; }
#top_nav .gnb .snb li a { display:block; color:#fff; opacity: 1; text-align: center; line-height:50px; font-size:15px;
    font-weight: 300; transition: all .3s ease;}
#top_nav .gnb .snb li a:hover { display:block; color:#fff; text-decoration:none; opacity: 1; }
#top_nav .gnb .snb li:hover a { background-color: #005590; }
#top_nav .gnb .snb li:first-child { border-top:0; }


/* 제품&기술 snb */
#top_nav .gnb .snb.type { width:500px; }
#top_nav .gnb .snb.type::after { content:""; display: block; clear:both; }
#top_nav .gnb .snb.type ul,
.device-md #top_nav .gnb .snb.type ul { width:250px; }
#top_nav .gnb .snb.type li { background-color:rgba(0,108,184,.9); }
#top_nav .gnb .snb.type li:first-child { background-color:rgba(0,85,144,.85); }
#top_nav .gnb .snb.type li:first-child a { font-weight: bold; }
#top_nav .gnb .snb.type .left { float:left; }
#top_nav .gnb .snb.type .right { float:right; }
#top_nav .gnb .snb.type .right li:first-child { background-color:rgba(0,79,134,.85); }
#top_nav .gnb .snb.type .right li { background-color:rgba(0,96,164,.85); }


.menu_slider_btn { display: block; position: relative; cursor: pointer; width: 45px; height: 30px;
    background: url('../img/menu_slider_btn.png') no-repeat center; }

.menu_slider_btn2 { display: block; position: absolute; right:60px; top:80px; cursor: pointer; transform: translate(-50%, -50%); }
.menu_slider_btn2 span { display: block; background:#005590; width: 25px; height: 2px; border-radius: 3px; }
.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 { display: none; position:fixed; top: 0; left: 0; z-index: 9999; width :100%; height: 100%; background: rgba(0,0,0,0.7); }
.hidden_nav { position: fixed; top: 0; right: -640px;  width: 640px; height: 100vh; background: #fbfbfb; z-index: 10000;
    text-align: left; padding:200px 80px 0 80px; }
.hidden_nav .hidden_gnb  { width: 100%; }

.h_lm {  position: relative; margin-bottom:50px; }
.h_lm > a { display: block; position: relative; z-index: 1; font-size:26px; font-weight: 600; color:rgba(0,0,0,.5) !important; transition: all .3s ease;
    max-width:180px; 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:20px; }
.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; }
.h_snb li a:hover { padding:2px 15px; border-bottom:2px solid #005590; color:#005590;}


/* h_right */
.h_right { display: flex; align-items: center; }
#lang_btn { position: relative; z-index: 1; overflow: hidden; display: block; text-align: center; margin-right:35px;
    width: 110px; height: 38px; line-height: 38px; border:1px solid #fff; font-size:14px; font-weight: 500; color:#fff;
    font-family: 'Montserrat'; transition: all .3s ease; text-transform: uppercase; }
#lang_btn::after { content: ""; position: absolute; width: 0; height: 100%; top: 0; right: 0; z-index: -1; background: #006cb8;
 transition: all .3s ease;}
#lang_btn:hover { border-color:#006cb8; }
#lang_btn:hover::after {left: 0; width: 100%; }


/* hover */
#header_wrap:hover { background:#fff; }
#header_wrap:hover #top_nav .gnb > li > a { color:#000; }
#header_wrap:hover #lang_btn { color:#006cb8; border-color:#006cb8; }
#header_wrap:hover #lang_btn:hover { color:#fff; }
#header_wrap:hover .menu_slider_btn { background-image: url('../img/menu_slider_btn2.png'); }



@media screen and (max-width: 1300px) {
    #top_nav .gnb > li { margin-left:70px; }
}


@media screen and (max-width: 1024px) {
    #top_nav { display:none; }
    .h_right { display:none; }
    #header .header-inner { justify-content:center; }
    #header_wrap { position:fixed; height:60px; border-bottom: 1px solid rgba(255,255,255,.1); }
    #header { height:60px; background:#fff; }
    .scrolled #header { border-bottom: 1px solid #eee; }
    #header #logo a img { transform: scale(.8); }
}

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