/*웹 브라우저 같은 프로그램(user agent)이나 스크린 리더, 맞춤법 검사기, 검색 엔진에 유용한 정보를 제공하기 위함*/
abbr,acronym{border:0;}

body{ font-family:"Lato-Regular","Malgun Gothic","맑은 고딕","나눔 고딕","Dotum","돋움","굴림",Sans-serif !important;
            width:100%;  margin:0px; padding:0px; font:inherit; }
article, aside, hgroup, header, footer, figure, figcaption, nav, section,time, mark, canvas, video, audio, details, summary {display:block;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
address,caption,cite,code{font-style:normal;font-weight:normal;}
table{border-collapse:collapse;}
ol,ul,li{ list-style:none; }

a, img{border:none;}
a:visited, a:link, a:active, a:hover{color:#323232; text-decoration:none; color:inherit; border:none;}

.wrap{width:100%; }
.clearfix:before, .clearfix:after {content:"";display:table;}
.clearfix:after {clear:both;}


@font-face {
    font-family: Lato-Regular;
    src:local('Lato-Regular');
    src: url('../fonts/Lato-Regular.ttf');
    src: url('../fonts/Lato-Regular.eot');
    src: url('../fonts/Lato-Regular.eot?') format('eot');
    src: url('../fonts/Lato-Regular.woff') format('woff'); 

}

/*header*/
#header{width:100%; height:100px; background:#fff; position:fixed; top:0; z-index:999;}
#header .header_inner{width:1400px; margin:0 auto;}
#header .header_inner h1{width:210px; height:57px; float:left; margin:22px 140px 21px 0;}
#header .header_inner .lnb{float:left;  }
#header .header_inner .lnb > li{width:auto;  line-height:1.6em; text-align:center; float:left; padding:38px 60px 0 60px;  position:relative;}
#header .header_inner .lnb > li > a{display:block; width:100%; height:auto; text-transform: uppercase; margin-bottom:36px;  text-decoration: none;   position: relative; font-size:18px;}
#header .header_inner .lnb > li > .lnb_sub{width:90%; position:absolute; left:0; z-index:999; padding-top:30px; color:#fff; margin-left:5%;}
#header .header_inner .lnb > li > .lnb_sub > li{width:100%; height:200px; height:auto; text-align:center;}
#header .header_inner .lnb > li > .lnb_sub > li > a{display:block; width:auto; font-size:15px; padding:8px 0; }
#header .header_inner .lnb > li > .lnb_sub:hover{ height:360px; background:#296594;}
#header .header_inner .lnb > li:nth-child(2) > .lnb_sub{width:120%; margin-left:-10%; }
#header .header_inner .lnb > li > .lnb_sub > li > a:hover{background:#000;}

#header .header_inner .lnb li:hover a:before{width:100%; border-bottom: solid 2px #296594; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; }

#header .header_inner .gnb{width:auto; height:27px; margin:34px 0 0 130px; float:left; }
#header .header_inner .gnb > li{width:25px; height:25px; line-height:25px; float:left; text-align:center; border:1px solid #e2e2e2; margin-right:12px; font-size:13px;}
#header .header_inner .gnb > li > a{display:block; width:100%; height:auto;}

#header .bg{width:100%; height:390px; background:rgba(0,0,0,0.5); position:relative; top:0; overflow:hidden;}

#header .header_inner .menu_btn{width:auto; float:left;  display: block;  float:left;  margin-top: 28px;  color: #ecf0f1; text-align: center;}
#header .header_inner .menu_btn:hover{animation:menu_motion 0.5s .5s linear;   cursor: pointer;}
#header .header_inner .hamburger .line{ width: 28px; height: 3px; background-color: #606060; display: block; margin: 7px auto; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}



/*footer*/
#footer {width:100%; height:auto; background:#1c1c1c;}
#footer .footer_inner{width:1400px; height:auto; margin:0 auto; padding:40px 0 ; }
#footer .footer_inner .f_logo{width:1400px; height:auto; padding:0 0 30px 10px;}
#footer .footer_inner .f_logo img{display:block; width:407px; height:48px; margin:0 auto;}
#footer .footer_inner address{width:1400px; height:auto;  font-size:16px; line-height:2.2em; text-align:center; color:#b1b1b1;}
#footer .footer_inner address span{padding:0 20px;}








/* underline */

[class^="underline-"] {
  display: inline-block;
  margin: 2em
}

.underline > a:before, .underline > a:after {
  content: '';
  border-bottom: solid 2px #296594;
  position: absolute;
  bottom: 0;
  width: 0;
}

.underline > a:before { left: 0; }
.underline > a:after { right: 0; }

.underline > a:hover:before, .underline > a:hover:after {
  width: 50%;
}

.underline > a:before, .underline > a:after {
  -webkit-transition: all 0.2s ease;
          transition: all 0.2s ease;
}



/*menu_btn*/

.hamburger.is-active{
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

.hamburger.is-active .line:nth-child(2){
  -webkit-transition: none;
  -o-transition: none;
  transition: none;
}

.hamburger .line:nth-child(2){
  -webkit-transition-delay: 0.3s;
  -o-transition-delay: 0.3s;
  transition-delay: 0.3s;
}

.hamburger.is-active .line:nth-child(2){
  opacity: 0;
}

.hamburger.is-active .line:nth-child(1),
.hamburger.is-active .line:nth-child(3){
  width: 25px;
  -webkit-transform-origin: right;
  -moz-transform-origin: right;
  -ms-transform-origin: right;
  -o-transform-origin: right;
  transform-origin: right;
}

.hamburger.is-active .line:nth-child(1){
  -webkit-transform: translateY(11px) rotate(40deg);
  -ms-transform: translateY(11px) rotate(40deg);
  -o-transform: translateY(11px) rotate(40deg);
  transform: translateY(11px) rotate(40deg);
}

.hamburger.is-active .line:nth-child(3){
  -webkit-transform: translateY(-10px) rotate(-40deg);
  -ms-transform: translateY(-10px) rotate(-40deg);
  -o-transform: translateY(-10px) rotate(-40deg);
  transform: translateY(-10px) rotate(-40deg);
}