@charset "UTF-8";
/* CSS Document */


/**/
*{margin:0; padding:0;}
ol,ul{list-style:none;}
a{text-decoration:none; color:inherit; outline:none;}
img{border:0;}
body{font-family: 'Noto Sans KR', sans-serif; font-size: 13px; color: #272727;}

/*T_nav*/
.nav1{width:100%; height: 40px;}
.wrap{max-width:1200px; height:100hv; margin: 0 auto;}
#menu1{float: right; height: 40px; line-height: 40px;}
#menu1 li{width: 125px; float: left;}
/*T_nav*/

/*nav*/
.nav2{width:100%; height: 50px; text-align: center;}
.logo{width:180px; height:50px; float: left; position: relative;}
.logo a{height:30px; width: 47px; position: absolute; top:50%; transform: translateY(-50%);}
#menu2{float: left; height: 50px; line-height: 50px; font-size: 15px; color: white;}
#menu2 li{width: 155px; float: left;}
#menu2 a:hover{color:#f7dd5e;}
    /*m_nav*/
    .nav2 .nm_wrap2{display: none;}
    .side{position:fixed; width:50%; height:100%; background:black; left:-50%; top:0; color:#fff; z-index:999; font-size:15px;}
    .icon{position:absolute; right:-50px; top:10px; transition:all 0.4s;}
    .bar1, .bar2, .bar3{width:30px; height:2px; margin:6px 0; background-color:#ccc;}
    
    .change{right:20px;}
    .change .bar1{transform:rotate(-45deg) translate(-5px,6px); background-color:#fff;}
    .change .bar2{opacity:0;}
    .change .bar3{transform:rotate(45deg) translate(-5px,-6px); background-color:#fff}
    
    .nav3{padding-top:120px; box-sizing:border-box; border-bottom:1px solid #fff; margin-left:25%; width:50%;}
    .nav3 li{ font-weight:300; line-height:40px; margin-bottom:20px; transition:all 0.4s; }
    
    .nav3_1{box-sizing:border-box; margin-left:25%; width:50%; padding-top: 20px;}
    .nav3_1 li{font-weight:300; line-height:40px; margin-bottom:20px; transition:all 0.4s; }
    .nav3_1_txt1{border-radius: 20px; background-color:#434343; font-size: 12px; opacity: 0.8;} 
    #nav3_1_txt1_m{margin-top: 50px;}
    /*m_nav*/
/*nav*/


/*tablet*/
@media (min-width:768px) and (max-width:1024px) {
    .wrap{max-width:1023px;}
    .nm_wrap2{width: 768px; margin: 0 auto;}
    #menu2 li{width: 140px;}    
}
    
/*mobile*/
 @media (min-width:376px) and (max-width:767px) {
    .wrap{max-width:376px;}
    .nav2 .nm_wrap2{width:376px; margin: 0 auto; display: block;}
    #menu1{width:250px; text-align: center; float: none; margin: 0 auto;}
    .logo{width:47px; float: none; margin: 0 auto; text-align:left;}
    .nav1, #menu2{display: none;}
 }


/*mobile min*/
@media (max-width:375px) {
    .wrap{max-width:375px;}
    .nav2 .nm_wrap2{width:376px; margin: 0 auto; display: block;}
    #menu1{width:250px; text-align: center; float: none; margin: 0 auto;}
    .logo{width:47px; float: none; margin: 0 auto; text-align:left;}
    .nav1, #menu2{display: none;}
    .nav3 li, .nav3_1 li{line-height: 24px; font-size: 14px;}
 }