@charset "utf-8";

#container {position: relative; width: 100%;}
.subcontainer {width: 100%; margin: 0 auto;}

/* gnb */
header { width: 100%; height: 110px; position: relative; z-index: 100; }

header a { width: 100%; height: 100%; display: block; }

header > h1 { display: none; }

header .burger { display: none; }

.gnb { width: 100%; height: 110px; margin: 0 auto;border-bottom: solid 1px #ddd;}
.gnb .area_top h1 {position:absolute; left:10px; top:10px; width:184px; height:44px;}
.gnb .area_top {position:relative; margin:0 auto;width: 1110px; height:70px;}
.gnb .area_top ul {position:relative;text-align: right;}
.gnb .area_top ul li { display: inline-block; text-align: center; line-height: 35px; }
.gnb .area_top ul li::after { content:"."; margin: 0 5px; display: inline-block; color: #f1f1f1;}
.gnb .area_top ul li:last-child::after { content:""; margin: 0 0 0 0;}
.gnb .area_top ul li a { color:#999; display: inline; }
.gnb .area_top .logo_b_name {
        font-weight: bold;
        font-size: 16px;
        color: #686868;
        position: absolute;
        top: 40px;
        left: 195px;
        z-index: 3 !important;
    }
.gnb .area_main_nav {width: 100%; background: #116dd4; height: 45px;}
.gnb .area_main_nav nav {width: 100%; height: 45px; margin: 0 auto; position: relative;text-align: center;}
.gnb .area_main_nav nav a { color: #333; }
.gnb .area_main_nav nav a:focus, .gnb .area_main_nav nav a:active { color: #39b54a; text-decoration: none; }
.gnb .area_main_nav nav > ul {min-width:140px;max-width:140px;height: 100%; display: inline-block;margin:0 20px;}
.gnb .area_main_nav nav > ul > li { width: 100%; height: 100%; font-size: 18px; display: table; position: relative; text-align: center;}
.gnb .area_main_nav nav > ul > li a { color: #fff; display: table-cell; vertical-align: middle;font-weight:bold;}
.gnb .area_main_nav nav > ul:hover > li > a, .gnb .area_main_nav nav > ul > li.on > a { color: #fff; border-bottom:solid 3px #74b5ff;}

.gnb .area_main_nav nav .menu_list { width: 100%; height: auto; position: absolute; top:55px; left: 0; display: none; }

/* line-height:24px; -> line-height:32px; 변경*/
.gnb .area_main_nav nav .menu_list > li { width: 100%; height: auto; font-size: 14px; line-height:32px; position: relative; }

.gnb .area_main_nav nav .menu_list a { display: block; text-align: center; color:#777;}
.gnb .area_main_nav nav .menu_list li:hover, .gnb .area_main_nav nav .menu_list li.on {color: #116dd4;}
.gnb .area_main_nav nav .menu_list li a:hover, .gnb .area_main_nav nav .menu_list li.on a {background:#116dd4;color:#fff;}

.gnb .area_main_nav nav .btn_close { width: 30px; height: 30px; position: absolute; font-size: 1rem; color: #fff; right: -30px; top: 30px; background: #666; display: none; }

header > .bg { width: 100%; height: 180px; background: #fafafa; position: absolute; z-index: -1; top: 110px; border-top: 1px #ddd solid; border-bottom: 1px #ddd solid; display: none; }
header > .bg > span {display: block; width: 1100px; background: url(../images/common/nav_bg.png) left top no-repeat; height: 180px;position: relative; margin:0 auto;}


/** footer **/
footer {background: #eee; clear: both;}
.footCont {position: relative; margin:0 auto; width: 1050px; color: #999; padding: 20px 0 50px 0; line-height: 20px;}
.footCont span {display: inline-block; margin-right: 30px;}
.footCont p > span {color: #000;}
.footCont p > span > strong {color: #fe4e00; font-weight: 700; font-size: 14px;}
.footLogo {position:absolute; /*right: 0; top:30px;*/}




/* gnb tablet */
@media only screen and (max-width:1024px) {

  html, body { min-width:320px; }
  
  header { width: 100%; height: 60px; position: relative; z-index: 100; background: rgba(255, 255, 255, 1); border-bottom: solid 1px #116dd4;}

  header .burger { width: 30px; height: 19px; display: block; position: absolute; left: 10px; top: 20px; z-index: 1; cursor: pointer;}
  header .burger span { width: 26px; height: 2px; border-radius: 3px; display: block; background: #000; position: relative; }
  header .burger span:nth-child(2) { margin-top: 5px; }
  header .burger span:nth-child(3) { margin-top: 5px; }

  header  > h1 { width: auto; height: 59px; line-height:59px; background-size: cover; z-index: 1; display: block; padding-top:8px;text-align:center;}
  
  .gnb { width: 100%; height: 100%; position: fixed; z-index: 2; overflow-x: hidden; background: #fafafa; overflow: hidden; overflow-y: auto; left: -100%; }

  .gnb .area_main_nav { width: 100%; height: auto;background: #fff;}
  .gnb .area_main_nav nav{ white-space:initial !important;}

  .gnb .btn_close { width: 20px; height: 20px; position: absolute; top: 20px; right: 20px; background: url('../images/common/btn_close.png') left center no-repeat; background-size: cover; display: block; text-indent: -201%; font-size: 0; z-index: 10; cursor: pointer;}
  .gnb .area_top h1 {display:none;}
  .gnb .area_top { width: 100%; height:auto; padding: 50px 20px 20px; box-sizing: border-box; background: transparent; border-bottom: 1px #aaa solid ; }
  .gnb .area_top .btn_login span { width: 40px; height: 40px; }
  .gnb .area_top ul { width: 100%; margin: 0 auto; text-align: right; }
  .gnb .area_top ul::after { content:""; display: block; clear: both; }
  .gnb .area_top ul li { width: 50%; outline: 1px #fff solid; height: 40px; display: block; float: left; text-align: center; line-height: 40px; background: #aaa; }
  .gnb .area_top ul li a { width: 100%; height: 100%; display: block; color: #fff; font-size: 1rem; line-height: 40px; }
  .gnb .area_top ul li::after { content:""; margin: 0; }
  .gnb .area_top .logo_b_name {display:none;}

  .gnb a { width: 100%; height: 100%; box-sizing: border-box; display: block; }
  .gnb .area_main_nav nav a { color: #666; }
  .gnb .area_main_nav nav a:focus { color: #116dd4;text-decoration: none;}
  .gnb .area_main_nav h1 { width: 110px; height: 30px; margin-left: -55px; background: url('../images/common/logo.png') left center no-repeat; background-size: cover; position: absolute; z-index: 1; top: 15px; left: 50%; }
  .gnb .area_main_nav nav { width: 100%;height:auto;}
  .gnb .area_main_nav nav > ul { width: 100%; max-width:none;text-align: left;margin:0;}
  .gnb .area_main_nav nav > ul > li { width: 100%; height: auto; font-size: 18px; display: block; border-bottom: 1px #ddd solid ; }
  .gnb .area_main_nav nav > ul > li a { color: #000; height: 40px; padding: 0 20px; display: block; line-height: 40px; }
  .gnb .area_main_nav nav > ul > li a:hover { color: #116dd4; text-decoration: none; }
  .gnb .area_main_nav nav > ul:hover > li > a { color: #116dd4; text-decoration: none; }
  .gnb .area_main_nav nav .menu_list { width: 100%; height: auto; position: static; background: #116dd4; }
  .gnb .area_main_nav nav .menu_list::after { content:""; display: block; clear: both; }
  .gnb .area_main_nav nav .menu_list::before { content: ""; width:100%; height: 0px; position: absolute; bottom: 0;}
  .gnb .area_main_nav nav .menu_list li { width: 100%; height: auto; font-size: 16px; line-height: 35px; float: left; border-bottom: 1px solid #fff; }
  .gnb .area_main_nav nav .menu_list li:hover, .gnb .area_main_nav nav .menu_list li.on { background: transparent; }
  
  .gnb .area_main_nav nav > ul:hover > li > a, .gnb .area_main_nav nav > ul > li.on > a { color: #116dd4; }
  .gnb .area_main_nav nav > ul > li:hover > a::after, .gnb .area_main_nav nav > ul > li.on > a::after { display: none; }

  .gnb .area_main_nav nav .menu_list a { padding: 0 20px; display: block; color: #fff; }

  
  header > .bg { display: none; }

  .subcontainer {width: 100%;}
  .hidden {display: none;}

footer {background: #fafafa; padding: 0 0 20px 0;}
footer .footCont {position: relative; margin:0 auto; width: 100%; border-top: solid 1px #ddd;padding: 10px;}
footer .footCont span {display: none;}
footer .footCont p > span {display: inline-block;}
footer .footLogo {position:relative; margin: 0 auto; top:0; margin-bottom: 10px;}
}

/* utill*/
.clf::after { content:""; display: block; clear: both; }
.blind { overflow: hidden!important; position: absolute!important; clip: rect(0 0 0 0)!important; width: 1px!important; height: 1px!important; margin: -1px!important; }