

#wrapper {position:relative; width:100%; margin:0 auto; }


@media all and (min-width:1200px) {
    
#header {width:100%; height:152px; position: fixed; z-index: 9999; background-color:#fff;}
.m_top_logo{display: none;}  
.m_menu2{display: none;}
.menu-hide{display: none;}
/* header pc*/
.headerall{height:50px; width:100%; margin: auto; line-height:50px;}
.headerall ul{}
.headerleft{float:left; margin-left:50px;}
.headerleft li{float:left; margin-right:20px;}
.headericon{float:left; padding-top:16px; padding-right:5px;}
.headertext{float:left; font-size:13px;}
.headerright{float:right; margin-right:50px;}
.headerright li{float:left;}
.headericon2{margin-left:40px;}
.headericon2 a img{display: block; margin-top:15px; width:25px;}
/* nav */
#nav {clear:both; position:relative; width:100%; height:100px; font-family: 'NBGothicB', sans-serif, '돋움'; font-size:12px; border-top:1px solid #e1e1e1; border-bottom:1px solid #e1e1e1;}   
#nav ul{height:85px;}
    
.sdi_logo{width:240px;}
    
.gnb{float:left; width:55%;}
    
.nav_gnb {font: 18px 'NBGothicR', sans-serif, '돋움'; letter-spacing:1px; display:inline-block; color:#010101; width:100%; line-height:100px; 
    box-sizing:border-box; text-align:center; transition:all 0.4s; -moz-transition:all 0.4s; -webkit-transition:all 0.4s; -o-transition:all 0.4s; }
.lnb {position:absolute; left:0; top:100px; z-index:20; display:none; width:100%; text-align:left; transition:all 0.6s; -moz-transition:all 0.6s; -webkit-transition:all 0.6s; -o-transition:all 0.6s; text-align:center;}
.lnb a {float:left; /*display:block;*/width:100%; height:45px; background:#ececec; border-bottom:1px solid #fff; font: 15px 'NBGothicR', sans-serif, '돋움'; letter-spacing:1px; color:#000; box-sizing:border-box;  line-height:45px; transition:all 0.5s; -moz-transition:all 0.5s; -webkit-transition:all 0.5s; 	-o-transition:all 0.5s; text-align:center;}
.lnb a:hover {background:#0a1057; color:#fff;}
    
.navonline{background-color:#0a1057; height:100px;}
.navonline a{margin: auto; display: block; text-align: center; width:100%; margin: auto;}
.navonline a img{margin-top:35px;}

}



@media all and (min-width:1500px) {
    
.navleft{width:19%; float:left; padding-top:15px; padding-left:2.5%; border-right:1px solid #c0c0c0;}
.gnb > li {float:left; position:relative; width:20%;}
.navright{float:right; width:22.4%;}

}


@media all and (min-width:1200px) and (max-width:1499px) {
    
.navleft{width:22%; float:left; padding-top:15px; padding-left:2.5%; border-right:1px solid #c0c0c0;}
.gnb > li {float:left; position:relative; width:25%;}
.navright{float:right; width:20.4%;}

}




@media all and (min-width:320px) and (max-width:1199px) {
    
#header {width:100%; height:70px; position: fixed; z-index: 9999; background-color:#fff;}
.headerall{display: none;}   
#nav{display: none;} 
    
.m_top_logo{margin-top:5px; padding-lefT:5px; width:175px;}

     
/*header mobile*/
.menu-hide {width: 60%; right: -70%; height: 100%; position:fixed; z-index: 10; top: 0px;
            -webkit-transition: all .6s ease-in-out; transition: all .6s ease-in-out; -moz-transition: all .6s ease-in-out; -ms-transition: all .6s ease-in-out;}

.menu-hide_bg{background-color: #fff;}
.m_gnb {border-top:1.5px solid #b3b3b3; margin-top:70px;}
.m_gnb .subm{list-style-type: none; text-align: left;
  line-height: 50px; padding-left: 15px; letter-spacing: 2px;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
border-bottom:0.5px solid #b3b3b3;}

.subm:hover {color:black; cursor: pointer; background:#0a1057; color:#fff;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;}
.subm:hover a{color:#fff;}
.subm a{text-decoration: none; font: 16px 'NBGothicR', sans-serif, '돋움'; letter-spacing:1px; color:#0a1057;}

.subs{display: none; background-color:#eeeeee;;}
.subs a{font: 16px 'NBGothicR', sans-serif, '돋움'; letter-spacing:1px; clear: both; width:100%; display: block; height:40px; border-bottom:0.5px solid #eeeeee;
        letter-spacing: 1.3px; line-height:40px; padding-lefT:17px; color:#0a1057;}
.subs a:last-child{border-bottom:0.5px solid #8b8daf;}
.subs a:hover{background:#0a1057; color:#fff;}
.subs a > em{font-size:5px; padding-left:5px;}

    
/*end of menu-hide*/
.menu-hide.show {right: 0px; background-color:#fff;
  -webkit-transition: all .6s ease-in-out;
  transition: all .6s ease-in-out;
    -moz-transition: all .6s ease-in-out;
    -ms-transition: all .6s ease-in-out;}
    
    
.m_menu2{}
.m_menu2 li{clear: both;}
.m_menu2_1{padding-left: 15px; height:50px; border-bottom:0.5px solid #b3b3b3;}
.m_menu2_1_icon{float: left; margin-top:16px; margin-right:10px; display: block;}
.m_menu2_1_text{line-height: 50px; color: #161b2e;}
.m_menu2_2{padding-left: 15px; height:50px;  border-bottom:0.5px solid #b3b3b3;}
.m_menu2_2_icon{float: left; margin-top:14px; margin-right:8px; display: block; margin-top:17px; width:18px;}
.m_menu2_2_text{line-height: 50px; color: #161b2e;}
.m_menu2_1_text{color: #161b2e;}
.m_menu2_3{height:80px; background:#0a1057; color:#fff; padding-left:15px; border-bottom:1.5px solid #b3b3b3;}
.m_menu2_3 p{padding-top:12px; text-align: left; font:18px 'NBGothicR', sans-serif, '돋움'; line-height: 30px;}
.m_menu2_3 p a{display: block; color:#fff;}


    
    
}

