/*Content CSS*/
#header_wrap { position:fixed; left:0; top:0; width:100%; height:90px; z-index:111; background: #fff;
    -webkit-transition:all .3s ease;-moz-transition: all .3s ease;-ms-transition: all .3s ease;-o-transition: all .3s ease;
    transition: all .3s ease; border-bottom: 1px solid #ddd;}
#header_wrap #header { position: relative; height: 100%; width: 100%; max-width: 100%;  z-index:6; -webkit-transition:all .3s ease;
    -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease;transition: all .3s ease; }
#header .header-inner { position: relative; display: flex; justify-content: space-between; align-items: center; max-width:1700px;
    height:100%; margin:0 auto; z-index: 10; padding:0 60px; width:100%; }
#header #logo { position: relative; display: flex; justify-content: center; align-items: center; z-index: 2; }
#header #logo a { display:block; transition: all .3s ease; width: 133px; height: 43px; background:url('../img/logo_c.png') no-repeat center; }

#top_nav { display: flex; height: 100%; }
#top_nav .gnb { list-style:none; display: flex; justify-content: flex-end; padding:0; height: 100%; }
#top_nav .gnb > li { position: relative; display:block; width:auto; text-align:center; margin-left:90px; height: 100%; }
#top_nav .gnb > li:first-child { margin-left:0;}
#top_nav .gnb > li { -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease;
    -o-transition: all .3s ease; transition: all .3s ease; height:100%; }
#top_nav .gnb > li > a { display: flex; align-items: center; font-size:20px; font-weight: 500;
 height: 100%; color:#000; transition: all .3s; white-space: nowrap; }
#top_nav .gnb > li > a::after { content: ""; position: absolute; bottom: -1px; left:50%; transform:translateX(-50%); width: 0; height: 2px; background-color:#008bf6; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s;}
#top_nav .gnb > li > a:hover::after,
#top_nav .gnb > li.active > a::after { width:130%; }
#top_nav .gnb > li > a.active::after { width:130%; }

/*child_menu*/
#top_nav .gnb .snb { display: none; position: absolute; left:50%; transform:translateX(-50%); top:90px; height:70px; z-index:2;
    text-align: center; flex-wrap:nowrap; list-style:none; }
#top_nav .gnb .snb li a { display: flex; align-items: center; text-align: left; font-weight: 300; white-space: nowrap; font-size:16px; height: 70px; color:#000; transition: all .3s ease; padding:0 35px; }
#top_nav .gnb .snb li:last-child a { padding-right: 0; }

.snb_bg { display: none; position: absolute; left:0; right:0; top:90px; height: 70px; background: #fff; z-index: -1; border-bottom: 1px solid #ddd; }

#top_nav .gnb > li:nth-child(3) .snb,
#top_nav .gnb > li:nth-child(4) .snb { width: 100%; justify-content: flex-end; }




/* media query */
@media screen and (max-width: 1420px) {

    #header_wrap { height: 80px; }
    #top_nav .gnb > li > a { font-size: 19px; }
    #top_nav .gnb .snb { top: 80px; height: 65px; }
    #top_nav .gnb .snb li a { height: 65px; padding: 0 28px; }

    .snb_bg { top: 80px; height: 65px; }

    #top_nav .gnb > li { margin-left: 60px; }


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

    #header_wrap { height: 60px; }
    #header .header-inner { justify-content: center; }

    #header #logo a { width: 100px; height: 36px; background-size: contain; }

    #top_nav { display: none; }


}