@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@400;700;800&display=swap');
html, body {font-family: 'NanumSquare', sans-serif !important;}
html{overflow: hidden;}
/*서브페이지 공통 메인*/
        * {margin: 0 ; padding: 0;}
        a {text-decoration: none; color: inherit;}
        li, ul, ol {list-style: none;}
        #container{position: relative; overflow:hidden; height: 100%; }
        .main{position: relative; height: 100vh; background: #000;}
        .top{width: 100%; height: 80px; border-bottom: 1px solid rgba(248, 248, 248, 0.5); position: absolute; top: 0; display: flex;}
        .top img{ width: 130px; margin: 12px 15px;}
        .Menu{margin-top: 2.5rem; padding-left: 30%; overflow: hidden;}
        .Menu li{ float: left; color: #fff; padding-left: 5rem; font-weight: bold; overflow: hidden;}
        .Menu li a{ font-size:17px;}
        .line{position: absolute;  bottom:-1px; height: 2px; background-color: #ec741e; width: 80px;  display: block; display: none;}
        .Menu li:hover {color:#ec741e; }
        .Menu li:hover .line{display: block;}
        .dropdown{display: none;}
        #main_name{position: absolute; top: 100px;  width:100%; }
        #main_name > h3{ color:#ec741e; font-size: 80px; font-weight: bold; text-align: center; position: relative; top:50px;}
        #main_name > h3::after{content:""; border-radius:50%; width: 15px; height: 15px; display: inline-block; background: #ec741e; margin-bottom: -3px;}
        footer{position: absolute; bottom: 5px; width: 100%; font-size: 12px; text-align: center; line-height: 20px; display: flex; justify-content: center; }
        footer h3{color: #fff; opacity: 0.5; font-size: 12px; font-weight: 600; }
        .nas{ border: 2px solid #fff;  opacity: 0.5; border-radius: 5px; height: 33px;  margin-left: 10px; margin-top: 5px; }
        .nas a{color: #fff; font-weight: bold; font-size: 15px; line-height: 32px; padding: 10px 15px}
        .nas:hover{border-style:dashed; border-color: #ec741e;}
    
      
    

/*서브페이지 공통 반응형*/
@media (max-width: 1200px){
                
                .dropdown{display: block;}
                .dropdown{ position: absolute; display:inline-block;  top: 1.5rem; right:15px; width: 80px; height: 80px; transition: 0.1s;}
                .dropbtn{cursor: pointer;  width: 30px; height: 30px; line-height: 10px;}
                .dropbtn span{display: inline-block; width: 100%; height: 3px; background: #fff; }
                .dropdown_menu{display: none; position: absolute; background:black; min-width: 100px; z-index: 1; }
                .dropdown_menu li{display: block; text-align: center;}
                .dropdown_menu li a{color: #fff; padding:12px 16px; display: block; font-size: 15px; font-weight: 500;}
                .dropdown_menu li a:hover{background-color:  #f1f1f1; color: black; font-size: 13px;}
                .dropdown:hover .dropdown_menu{display: block;}
                .Menu{display: none;}
}


@media (max-width: 767px) {
           
                .top img{width: 90px; margin: 10px 15px; transition: 0.1s;}
                .top{height: 60px; }
                .dropdown{ top: 1rem;}
                #main_name { top: 50px;}
                #main_name .name{ font-size: 40px;}
                .nas a{font-size: 12px;}
                
}

@media (max-width: 500px) {
       
                .contact01{ margin-top: 13px;}
               
}