@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css);
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700&display=swap');
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    position: relative;
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 16px;
    font: inherit;
    font-family: /* "Montserrat","Noto Sans KR", sans-serif; */ 'Segoe UI Symbol', 'Open Sans', 'NanumSquare'; 
    text-decoration: none;
    word-break: keep-all;
    color: #333;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul, li{
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
p{word-break: keep-all;}
.blind, caption{font-size: 0; position: absolute; top: -999999px; visibility: hidden;}
.wrap {position: relative; width: 100%; height: 100%;}




/*header*/
.header {z-index: 1000; position: relative; width: 100%; height:auto;}
.header .gnb {z-index: 100; position: fixed; width: 100%; height: 70px; background: #fff; box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.3);margin-top:30px;}
.header .gnb.on {box-shadow: 0px 3px 7px 100000px rgba(0, 0, 0, 0.7);}
.header .top_logo {position: absolute; top:11px; left: 0;}
.header .gnb_con {position: relative; margin: 0 auto; width: 1200px; height:100%;}
.header .gnb_con .gnb_menu {z-index: 10; position: relative; width: 100%; height:100%; background: #fff;}
.header .gnb_con .gnb_menu ul, .header .gnb .gnb_submenu ul {z-index: 100; position: absolute; right: 0px; top:0; width: auto; height: auto;}
.header .gnb_con .gnb_menu ul .gnb_li, .header .gnb .gnb_submenu li {float: left; display: inline-block; width: 150px;}
.header .gnb_con .gnb_menu ul .gnb_li a {display: block; width: 100%; height: 67px; line-height: 70px; text-align: center; font-size:18px; font-weight:bold;}
.header .gnb.on .gnb_menu ul .gnb_li a:hover, .header .gnb .gnb_menu ul .gnb_li a:hover {border-bottom: 3px solid #0d0f9a; color: #0d0f9a;}
    /*gnb_submenu*/
    .header .gnb .gnb_submenu {z-index: 9; overflow: hidden; display: block; position: absolute; top: 70px; left: 0; width: 1200px; height: 0px; background: rgba(255,255,255,0.9); box-shadow: inset 0px 3px 7px rgba(0, 0, 0, 0.3); }
    .header .gnb.on .gnb_submenu {height: 270px; -webkit-transition: height 0.5s; /* For Safari 3.1 to 6.0 */ transition:height 0.5s;}
    .header .gnb .gnb_submenu ul li {padding-top: 18px; height: 100%;}
    .header .gnb .gnb_submenu ul li a {text-align:center; display: block; width: 100%; line-height: 30px;}
    .header .gnb .gnb_submenu ul li a:hover {color: #0002ad;font-weight:600;}
    .header .gnb .gnb_submenu ul li img {position: absolute; top:0; left: -600px;   }
    .lng_index {z-index: 100; position: fixed; height: 20px; background: #101284; width: 100%; height: 30px; }
    .lng_index ul {overflow:hidden; max-width:1200px; margin: 0 auto;}
    .lng_index li {float:right; display:inline-block; margin: 0 5px;}
    .lng_index li a {color:#fff; font-size:15px; line-height:30px;}
    .lng_index li:last-child::after {margin:5px 7px; width:1px; height:10px; background:#ddd;display:lnline-block;}

/*footer*/
.footer {background-color: #313131;}
.f_wrap {position: relative; margin: 0 auto; width: 1180px; height: auto;}
.f_wrap.pd_ {padding: 40px 10px 45px 10px;}
.f_wrap ul:after {content:""; display:block; clear:both;}
.f_wrap ul.ch01 {position: relative; float: left; width: auto;}
.f_wrap ul.ch02 {position: relative; float: right; width: auto;}
.f_wrap ul li {float: left; display: inline-block;}
.f_wrap ul li a {display: inline-block; padding: 0 22px; height: 15px; font-size: 14px; color:#fff; border-right: 1px solid #fff;}
.f_wrap ul.ch01 li:first-child a {padding-left: 0px;}
.f_wrap ul.ch01 li:last-child a {border: none;}
.f_wrap ul.ch02 li:last-child a {padding-right: 0px; border: none;}
.f_wrap .ch03 {padding-top: 10px; padding-right: 50%; overflow: hidden; width: 50%; height: auto;}
.f_wrap .ch03 dl {float: left; padding-top: 5px; display: inline-block;}
.f_wrap .ch03 dl dt, .f_wrap .ch03 dl dd {display: inline-block; line-height: 2em; font-size: 13px; color: #fff;}
.f_wrap .ch03 dl dt {margin-right: 10px}
.f_wrap .ch03 dl dd {margin-right: 50px}
.footer_logo {position: relative; float: left;}
.copy{padding: 15px 10px; width: auto; height: auto; background-color: #2b2b2b;}
.copy p {width: 100%; font-size: 13px;color: #a8a8a8; text-align: right; vertical-align: middle;}
/*mobile*/
.gnb_m {display: none;}
@media screen and (max-width: 1200px){
    /*header*/
    .header {height: 40px;}
    .header .gnb{display: none;}
    .header .top_logo {left: 2px;top:7px;}
        /*mobile*/
        .gnb_m {display: block; position: relative; top: 0; left: 0; width: 100%; height:100%; box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.3);}
        .m_top {z-index: 10; }
        .toggle_btn {position: absolute; top: 10px; right: 10px; display: block; width: 40px; height: 40px; background: no-repeat center;}
        .m_menu {display: block; position: relative; padding-top: 60px; overflow: hidden; 
            width: 100%; height: 0px; background: #fff;}
        .m_menu.on {height: auto; box-shadow: 0px 3px 7px 100000px rgba(0, 0, 0, 0.7); -webkit-transition: height 0.5s; /* For Safari 3.1 to 6.0 */ transition:height 0.5s;}
        .m_menu li {overflow: hidden; width: 100%; height: auto; line-height: 40px; border-top: 1px solid #d7d7d7;}
        .m_menu li a {display: block; width: 100%; height: 40px; text-indent: 20px; font-size:14px;}
        .mm_sub li {border-top: 0px; background: #305ed2;}
        .mm_sub li a {padding: 0 20px; height: 0px; color: #fff; text-indent: 0px; font-weight: 400; border-top: 1px solid #fff;}
        .mm_sub.on li a {height: 40px; -webkit-transition: height 0.5s; /* For Safari 3.1 to 6.0 */ transition:height 0.5s;}
.lng_index {position:relative;}
        
        
    /*footer*/
    .f_wrap {width: auto;}
    .f_wrap .ch03 {padding-top: 25px; padding-right: 0; width: 100%;}
    .footer_logo {padding-left: 10px;}
}
@media screen and (max-width:640px) {
     /*footer*/
    .f_wrap.pd_ {padding: 20px 10px;}
    .f_wrap ul.ch01,
    .f_wrap ul.ch02,
    .f_wrap ul.ch03 {float: none; margin: 0 auto; width: 90%; text-align: center;}
  
    .f_wrap ul.ch02 li:last-child a {padding-right: 30px; border: none;}
    .f_wrap .ch03 dl dt, .f_wrap .ch03 dl dd {font-size: 12px;}
    .f_wrap ul.ch01 {margin-bottom: 10px; }
    .f_wrap .ch03 dl dt {margin-right: 5px;}
    .f_wrap ul li {float: none;}
    .f_wrap ul li a {padding: 0 10px;}
    .f_wrap ul.ch01 li.ch_f a, .f_wrap ul.ch02 li.ch_l a {padding: 0 10px;}
    .f_wrap .ch03 {text-align: center;}
    .f_wrap .ch03 dl {float: none; margin: 0;}
    .f_wrap .ch03 dl dd {margin: 0;}
.copy p {width: 100%; font-size: 13px;color: #a8a8a8; text-align: center; vertical-align: middle;}
}