@charset "utf-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);

/* reset.css */
body{font-family: 'Noto Sans KR', sans-serif; line-height: 20px;}
html, body, div, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, address, dl, dt, dd, ol, ul, li, fieldset, form, legend, table, caption, tbody, tfoot, thead, tr, th, td, input, select, textarea, strong {margin:0; padding:0; color:#303030;}
h1, h2, h3, h4, h5, h6{font-size:100%;}
img, fieldset{border:0px;}
table{border-collapse:collapse;}
ul, ol, li{list-style:none;}
address, em{font-style:normal;}
li img, object{vertical-align:top;}
input, select, textarea, form img{vertical-align:middle;}
a{ outline:0; text-decoration:none; border:none; color: #000;}
/* layout */

.headerWrap{
   /* background-color: rgba(255, 255, 255, 0.6);*/
    background-size: cover;
    width: 100%; height: 90px;
    position: absolute;
    left: 0; top: 0;
    z-index: 10;
}


/*custom*/
.gnb{
    overflow: hidden; 
    float: right; 
    margin-right: 10%;
    margin-top: 10px;
    position: absolute;
    right: 0px;
}
.gnb li{
    float: left; 
    margin-left: 50px;
    
}
.gnb li:first-child{
    border: 0; padding: 0; margin: 0;
}
.gnb li a{
    color: #acacac;
    font-size: 20px;
    font-weight: 500;
    display: block;
   
}
.gnb li a:hover{
    color: #363636;
    padding-bottom: 13px;
    border-bottom: 3px solid #3f95ce;
     
}
    .back {
        background-color: #fff;
      position: absolute;
      top: 0;
      left: 0;
      text-align: center;
      display: block;
      padding: 15px;
      width: 100%;
      box-sizing: border-box;
      -moz-box-sizing: border-box;
      -webkit-box-sizing: border-box;
    }


.logo{
    float: left; 
    margin-left: 10%;
    margin-top: 1px;
    height: 30px;
}
.viewing-page-1 .gnb_layer{background-color:#fff;}
.gnb_layer{
    width: 100%;
    background-color:#fff;
   position: absolute; 
    top: 61px; left: 0; z-index: 20; 
    /*display: none;*/
    
    border-top: 1px solid #d4d4d4;
    border-bottom: 1px solid #d4d4d4;
}

.gnb_layerInner{
    width: 100%;
}

.gnb_layerInner ul{
    opacity: 0;
}

.gnb_layerInner ul li{
   /* margin-bottom: 6px;*/
    line-height: 2.5em;
}
.viewing-page-1 .gnb_layerInner a{color: #363636;}
.gnb_layerInner a{color: #363636;}
.gnb_layerInner a:hover{color: #63bbf5; text-decoration: none;}

.gnb_layerInner .sub_m1{
   position: absolute;
    right:10%; top: 20px;
     margin-right:410px;
}
.gnb_layerInner .sub_m2{
   position: absolute;
    right:10%; top: 20px;
     margin-right:295px;
}
.gnb_layerInner .sub_m3{
    position: absolute;
    right:10%; top: 20px;
     margin-right:203px;
}

.gnb_layerInner .sub_m5{
    position: absolute;
    right:10%; top: 20px;
    margin-right:100px;
}



/*footer*/

.footerWrap{
    height: 65px; width: 100%;
    background-color: #606060;   
}

.footer{width: 80%; margin: 0 auto;font-size: 11px; line-height: 14px; }

.footer .footLogo{float: left; margin-right:50px; margin-top: 19px;}
.footer .footLogo img{}

.footer p{color: #a6a6a6;line-height: 16px; margin-top: 15Px;}
.footer p.last{margin-top: 5px;}

.footer .footGroup{float: left;}





    /*moblie ver*/
@media screen and (max-width : 699px){
    
    .headerWrap{
   /* background-color: rgba(255, 255, 255, 0.6);*/
    background-size: cover;
    width: 100%; height: 90px;
    position: absolute;
    left: 0; top: 0;
    z-index: 1;
}
    
    
    .gnb{
        float: right; 
        font-size: 17px;
        font-weight: bold;
        background-color:#fff; 
        width: 35%; height: 230px; 
        padding: 10px;
        border: 1px solid #ddd;
        position: absolute;
        right: 0%;
        z-index: 222222222;
        margin: 0 auto;
        text-align: center;
        top: 60px;
        
        -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.65);
        -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.65);
        box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.65);
        display: none;
    }
    
    .gnb li{
        padding-top: 20px;
        float: none;
        margin-left: 0px;
        background: none;
        padding-right: 0px;
    }
    .gnb li:nth-child(1){
        margin-top: 20px;
    }

    .gnb li:last-child{
        margin-right: 0px;
        background: none;
        padding-right: 0px;
    }
    
    .gnb>li>a{ 
        color:#646363; font-size: 20px;
        font-weight: 500;
    }

    .gnb li a:hover{
        color: #151515;
        padding-bottom: 0px;
        border-bottom: 0;    
    }

    .back .logo{
        float: left; 
        margin-left: 0%;
        margin-top: 5px;
        height: 30px;
    }
    .gnb_layer{display: none;}
        
    .open{
        display: block;
        cursor: pointer;
        float: right;
        position: absolute;
        top: 10px; right: 5%;
        z-index: 2;
    }
    .open img{width: 80%;}
    
    .back {
      position: absolute;
      top: 0;
      left: 0;
      text-align: center;
      display: block;
      padding: 12px;
      width: 100%;
      box-sizing: border-box;
      -moz-box-sizing: border-box;
      -webkit-box-sizing: border-box;
    }
    
    .footerWrap{
    height: 65px; width: 100%;
    background-color: #606060;   
}

    .footer{width: 95%; overflow: hidden;font-size: 10px; }
    .footer div{}

    .footer .footLogo{float: left; margin-right:5%; margin-top: 22px;width:25%}
    .footer .footLogo img{width: 100%;}

    .footer p{color: #a6a6a6;line-height: 16px; margin-top: 10px; }
    .footer p.last{margin-top: 0px;}

    .footer .footGroup{float: right; width: 70%;}
}