@import url('https://fonts.googleapis.com/css2?family=Exo+2:wght@600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap');
@import url(//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSansNeo.css);

*
{}

h1,h2,h3,h4,h5,h6,small, p, li, ul, span, td, tr, th, i, strong, b
{font-family:'Spoqa Han Sans Neo'; margin:0px;}
.container
{max-width:1270px; padding:0px; width:100%;}

.main-title
{text-align:center; margin-bottom:25px;}
.main-title h2
{font-family:'Exo 2'; color:#313131; font-size:50px;}
.section05 .main-title h2 {
    font-family: 'Spoqa Han Sans Neo';
    font-size: 45px;
    margin-bottom: 25px;
    letter-spacing: -0.05em;
    text-transform: uppercase;
}
input, button, select, textarea,.sub-body-cn li {font-family: 'Roboto', 'Noto Sans KR', sans-serif!important;}
.main-title p
{font-weight:300; font-size:17px; color:#787878;}
td.formmail_title_bgcolor font {font-family: 'Roboto', 'Noto Sans KR', sans-serif!important;    color: #666!important;}
.formmail_border,.formmail_cell_bgcolor textarea.formmail_textarea_style {font-family: 'Roboto', 'Noto Sans KR', sans-serif!important; font-size: 15px!important;}
input[type="file"] {font-size: 12px!important;}

#head-area .container-mn
{max-width:1270px; width:100%; margin:0 auto; float:none;}
#head-area .container-mn:after
{clear:both; content:''; display:block;}
#head-area .menu-wrp
{float:right;}
#head-area .menu-wrp .main-nav > ul > li > a
{padding:10px 40px; font-size:20px; color:#393838}
#head-area .menu-wrp .main-nav > ul > li:last-child > a
{padding-right:0px; }
#head-area.header_scroll .menu-wrp .main-nav > ul > li > a
{line-height:2;}



.section01
{padding:85px 0 80px; background:#f0f0f0;}
.sec01-wrap
{display:flex; justify-content:space-between; }
.sec01-box-wrap
{box-shadow:5px 5px 10px #d2d2d2;}
.sec01-box-wrap .sec01-img
{overflow:hidden;}
.sec01-box-wrap .sec01-txt
{background:#fff;}
.sec01-txt
{padding:35px 25px;}
.sec01-txt h3
{font-size:22px; color:#383838; margin:0 0 10px;}
.sec01-txt p
{font-size:16px; color:#787878; margin:0 0 20px; font-weight:300; line-height:130%;}
.sec01-txt .more
{font-family:'Lato'; font-size:15px; color:#535353; font-weight:500;}
.sec01-box-wrap:hover .sec01-img img
{transform:scale(1.1); transition-duration:0.4s; }
.sec01-box-wrap:hover .sec01-txt
{background:#2d358f; transition-duration:0.4s;}
.sec01-box-wrap:hover .sec01-txt h3,
.sec01-box-wrap:hover .sec01-txt p,
.sec01-box-wrap:hover .sec01-txt span
{color:#fff; transition-duration:0.4s;}


.section02
{display:flex; height:415px; align-items:flex-end; overflow:hidden; background:#f0f0f0;}
.sec02-youtube
{width:50%; height:90%;}

.youtube-wrap {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
}
.player {
    position: absolute;
    width: 100%;
    height: 100%;
    max-height: 373px;
    background: #000;
}
.sec02-right-wrap
{width:50%; background:url('../img/sec02-bg.jpg'); height:100%;}
.sec02-right-wrap .sec02-txt-wrap
{padding:65px 100px 65px 60px; }
.sec02-txt-wrap .sec02-tit h2
{font-family:'Exo 2'; color:#fff; margin:0 0 10px; font-size:40px;}
.sec02-txt-wrap .sec02-tit small
{font-size:17px; color:#b0b4de;}
.sec02-txt-wrap .sec02-txt
{margin-top:50px;}
.sec02-txt-wrap .sec02-txt p
{color:#fff; font-weight:300; word-break:keep-all; line-height:30px; font-size:16px;}
.sec02-txt-wrap .sec02-txt a
{font-family:'Lato'; font-size:16px; color:#fff; display:inline-block; margin-top:30px;}


.section03
{padding:80px 0 90px; background:url('../img/sec03-bg.jpg') center bottom no-repeat;}
.sec03-wrap
{display:flex; justify-content:space-between; }
.sec03-wrap > div
{width:49%;}
.sec03-tit
{}
.sec03-wrap > div > div > table {
    margin-top: 15px!important;
}
.sec03-tit h2
{font-family:'Lato'; font-size:28px; display:inline-block; color:#353535;}
.sec03-tit > a
{color:#606060; font-size:16px!important; font-family:'Lato'!important; float:right;}
tr.board_output_11_tr td:nth-child(3) {
    text-align: right;
}
.section03 .gallerybbs table td.board_output_gallery_img img {width: 100%;}


.section04
{display:flex;}
.section04 > a 
{width:100%; padding:25px 0px;}
.sec04-faq
{background:#04214d; }
.sec04-faq:hover
{background:#093270}
.sec04-inq
{background:#031634; }
.sec04-inq:hover
{background:#00245e }
.sec04-faq .sec04-txt
{width:calc(100% - 41%); float:right; margin-right:70px; background-image:url('../img/faq-icon.png');}
.sec04-inq .sec04-txt
{width:calc(100% - 41%); float:left; margin-left: 70px;background-image:url('../img/inq-icon.png');}
.sec04-txt
{background-repeat:no-repeat; background-position:right; }
.sec04-txt h3
{font-size:28px;color:#fff; font-weight:300; margin: 0 0 10px;}
.sec04-txt p
{font-size:17px; color:#fff; font-weight:30;}


.section05 {padding: 80px 0;}
/*.section05 .container {max-width: 1170px;}*/
.section05 textarea {max-height: 200px;}
table textarea {
    width: 100%;
    border-color: #ddd;
}
td.formmail_cell_bgcolor input {width: 90%;}
input[type="radio"], input[type="checkbox"] {width: auto!important;}
td.formmail_cell_bgcolor {text-align: left;}
.section05 .table_02 > tbody > tr:last-child td {border: none !important;
    text-align: right!important;}
.section05 .table_02 > tbody > tr:last-child textarea {display: none;}


.footer
{padding:45px 0 40px;    border-top: 1px solid #ededed;}
.f-logo
{background:url('../img/f-logo.png'); float:left; width:209px; height:30px; margin-top:60px;}
.f-txt
{float:right; width:78%;}
.f-txt .f-policy ul li a
{color:#686868; font-size:15px; font-weight:400; padding-right:10px;}
.f-txt .f-policy ul li a:hover
{color:#838383}
.f-txt .f-info,.f-sns 
{margin-top:30px;}
.f-txt .f-info ul li
{line-height:25px;}
.f-txt .f-info ul li span
{font-size:15px; color:#a2a2a2; font-weight:300; padding-right:15px;}
.f-txt .f-info ul li.copy
{margin-top:5px;}

.f-info {
    width: 75%;
    float: left;
}
.f-sns {
    width: 25%;
    float: right;
}
.f-sns li {
    width: 25%;
    text-align: right;
}
.f-sns a {
    display: inline-block;
    background-color: #f1f1f1;
    border-radius: 100%;
    height: 60px;
    width: 60px;
    line-height: 60px;
    text-align: center;
}
.f-sns li:hover a {background-color: #2d358f;} 
.d-flex {display: flex;}


li.copy a {    font-size: 15px;
    color: #a2a2a2; }







/*-------------------------------------------------------------------------
서브페이지
-------------------------------------------------------------------------*/
p.pbrnone {margin-bottom: 10px;}
.sign {
    font-size: 1.3em;
    color: #222;
}



td.board_bgcolor font,.board, .board a:link, .board_description,.board_desc,.paging a:link
{
    font-size: 15px!important;
    font-family: 'Noto Sans KR', sans-serif !important;
    color: #333!important;
    padding: 5px;
}

.qalist > tbody > tr:hover td,
.qalist > tbody > tr:hover .bbsnewf5 a:link,
.bbsnewf5 a:hover,.paging {color: #2d358f!important;}
.paging {padding-top: 30px;    height: auto;}

.txt-wrap {
    padding: 20px 10px;
    margin: 30px 0;
    border: 1px solid #ddd;
}

.txt-wrap h4 {line-height: 1.8!important;}
.sub-body-cn li {font-size: 16px;}

.sub-body-cn .list {padding-left: 20px!important;}
.sub-body-cn .list li {list-style: square!important;}
.img-wrap {
    border: 1px solid #ddd;
}
.company-cnt h4 {
    color: #2d358f;
    border-bottom: 1px solid #2d358f;
    padding-bottom: 10px;
    font-weight: 600;
    letter-spacing: -0.02em;
}
.w4 li {width: 20%;}
.flex-wrap {flex-wrap: wrap;}






























/*-------------------------------------------------------------------------

-------------------------------------------------------------------------*/


@media screen and (max-width:1199px){
    #head-area.header_scroll .menu-wrp .main-nav > ul > li > a,
    #head-area .menu-wrp .main-nav > ul > li > a
    {line-height:2;}
    .sec01-box-wrap {margin: 0 5px;}
    .section02 {flex-wrap: wrap;    height: auto;}
    .section02 > div {width: 100%; height: 100%;}
    .sec02-youtube {margin-bottom: 30px;}
    .player {max-height: 100%;}
    .sec02-txt-wrap > div {
        width: 100%;
        max-width: 800px;
        margin: auto;
    }
    .sec03-wrap {flex-wrap: wrap;}
    .sec03-wrap > div {
        width: 100%;
        margin: 0 auto 30px;
        max-width: 800px;
    }
    .section04 {flex-wrap: wrap;}
    .section04 > a {width: 100%;}
    .section04 > a .sec04-txt {
        width: 100%;
        float: inherit;
        max-width: 800px;
        margin:0 auto;
    }
    .f-info {width: 100%; float: inherit;}
    .f-sns {width: auto; float: left;}
    .f-sns li {text-align: left; margin-right: 5px;}
    .f-sns li:last-child {margin-right: 0px;}
    d-flex {flex-wrap: wrap;}
    .subbg1 .sub-menus, .subbg2 .sub-menus, .subbg6 .sub-menus {padding: 80px 0 100px;}
    
    .sub-menus ul {bottom: 10px;}

}
    
    


@media screen and (max-width:768px){
    .sec01-wrap {flex-wrap: wrap;}
    .sec01-box-wrap {
        width: 49%;
        margin: 0 auto 30px;
    }
    .sec01-box-wrap img {
        max-width: 100%;
        width: 100%;
    }
    .sec03-wrap > div, .section04 > a .sec04-txt {max-width: 640px;}
    
    .f-logo {
        background: url(../img/f-logo.png) center top no-repeat;
        float: inherit;
        width: 100%;
        height: 30px;
        margin: 30px 0;
    }
    .f-txt {
        float: inherit;
        width: 96%;
        margin: auto;
        text-align: center;
    }
    .f-txt .f-info {margin-top: 15px;}
    .f-sns {
        float: inherit;
        display: inline-block;
        }
    .w4 li {width: 33.33%;}
    .subbg1 .sub-menus, .subbg2 .sub-menus, .subbg6 .sub-menus {padding: 80px 0 10px;}

    .sub-menus ul {
        bottom: 0px;
        position: static;
        margin-top: 50px!important;
    }
    
}


@media screen and (max-width:650px){
/*    .sec03-wrap .sec03-gal {max-width: 450px;}*/
    .gallerybbs > tbody > tr > td {margin-bottom: 30px;}
}

@media screen and (max-width:414px){
    #head-mn
    {padding:0 15px;}
    .tlogo
    {line-height:60px; padding:0px; width:60%;}
    .tlogo a
    {display:inline-block; width:100%; height:100%;}
    .mob-btn
    {top:20px;}
    .header_scroll .resmn, .header_scroll .tlogo
    {line-height:60px;}

    #head-area .menu-wrp .main-nav > ul > li > a
    {font-size:17px; padding:10px 20px;}
    .main-nav ul li.submenu i
    {top:0px; right:0px; width:100%;     height: 54px;}
    #head-area.header_scroll .menu-wrp .main-nav > ul > li > a
    {line-height:24px;}
    tr.board_output_11_tr > td:nth-child(2) {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 200px;
    }

    .board_output td, table.board_output td a {font-size: 13px!important;}



    .main-title h2
    {font-size:36px; margin-bottom:10px;}
    .main-title p
    {word-break:keep-all; line-height:20px; }


    .sec01-wrap
    {flex-wrap:wrap; justify-content:space-around;}
    .sec01-box-wrap
    {margin-bottom:30px; width: 90%;}
    .sec01-box-wrap .sec01-txt {text-align: center;}

    .section02
    {display:inline-block; height:auto;}
    .sec02-youtube
    {height:200px; width:100%;}
    .sec02-right-wrap
    {width:100%; background-position:center; background-size:cover; }
    .sec02-right-wrap .sec02-txt-wrap
    {padding:40px 15px;}
    .sec02-txt-wrap .sec02-tit small
    {font-size:15px; word-break:keep-all;}
    .sec02-txt-wrap .sec02-txt p br
    {display:none;}
    .sec02-txt-wrap .sec02-txt {margin-top: 20px;}
    .sec02-txt-wrap .sec02-txt a {
        display: block;
        text-align: center;
        border: 1px solid #fff;
        padding: 10px;
    }

    .sec03-wrap
    {flex-wrap:wrap; padding:0 10px;}
    .sec03-wrap > div
    {width:100%; margin-bottom:20px;}
    .sec03-tit h2
    {font-size:24px;}

    .section04
    {flex-wrap: wrap;}
    .section04 a
    {padding:20px 0px;}
    .sec04-faq .sec04-txt,
    .sec04-inq .sec04-txt
    {float:none; margin:0px; width:100%; background-position:50% 0; padding:90px 10px 30px;text-align: center;}
    .sec04-txt p
    {font-size:16px; word-break:keep-all; font-weight:300; line-height:20px;}
    
    .section05 .main-title h2 {font-size: 36px;}

    .footer .f-logo
    {float:none; width:100%; margin:0px; background-position:center; background-repeat:no-repeat;}
    .footer .f-txt
    { width:100%; float:none; padding:0 10px; margin-top:20px;}
    .footer .f-txt .f-info
    {margin-top:10px;}
    .footer .f-txt .f-info ul li
    {line-height:23px;}
    .f-txt .f-info ul li span {font-size: 13px;    letter-spacing: -0.03em;}
    .w4 li {width: 50%;    font-size: 1em;}
    .sub-body-cn li {font-size: 1em;}
    
    .subbg1 .sub-menus, .subbg2 .sub-menus, .subbg6 .sub-menus {padding: 50px 0 10px;}
    
    .root_daum_roughmap .wrap_map {height: 300px!important;}
    .location1 .col-md-4 {margin-bottom: 20px;}
    .location1 dt,.location1 dd {width: 100%;}
    .location1 dt {margin-top: 10px;}
    
}










/*histoy*/
.his_top {
    display: inline-block;
    background: #121212;
    height: 180px;
    width: 180px;
    line-height: 180px;
    border-radius: 50%;
}


.his_list {position: relative; width: 100%;padding-top:0px;}
.his_list ul{margin:0 auto!important; padding:0!important;}
.his_list ul li {margin-bottom: 50px; list-style-type: none;  display: flex; flex-direction: row; align-items: center;}
.his_point {
    min-width: 15px;
    height: 15px;
    background-color: #fff;
    border-radius: 100%;
    z-index: 2;
    border: 3px #182d70 solid;
    position: absolute;
    left: 50%;
    margin-left: -6px;
    transition: all 0.5s;
}
.his_list ul li:hover .his_point {background: #182d70;}
.his_list h3 {
    margin-bottom: 0px!important;
    font-family: 'SpoqaHanSans'!important;
    color: #182d70;
    font-weight: 700;
    padding-bottom: 10px;
}
.his_list ul li .his_content {width: 45%;}
.his_list ul li .date {width: 50%;padding: 0 20px;font-weight: normal;}
#subarea .his_list p {margin-bottom: 0; font-size: 16px!important;    padding: 0;}
.his_list::before {content: "";position: absolute; top: 0; height: 100%; width: 2px; left: 50%; background-color: #333;}
.h_no {display: inline-block; color: #182d70; font-weight: 600; vertical-align: top;    padding-right: 20px;}
.his_list ul li:nth-child(odd) .h_no {
    float: right;    padding-right: 0px;    padding-left: 10px;
}
.h_cons{display: inline-block;padding-left: 0px;    max-width: 90%;}
.h_cons br{display: inline-block!important;}

.his_list ul li:nth-child(odd) {text-align: right;}
.his_list ul li:nth-child(odd) .his_content {padding-left: 0;}
.his_list ul li:nth-child(odd) .date {padding-right: 0;}

.his_list ul li:nth-child(even) .his_content {padding-right: 0;}
.his_list ul li:nth-child(even) .date {padding-left: 0; }
.his_list ul li:nth-child(even) {    flex-direction: row-reverse;}





@media (max-width: 575px){

    .his_point,
    .his_list::before{left:0;}
    .his_list ul li .his_content { width: 90%; margin-left: 7%;}
    .his_list ul li:nth-child(odd) {text-align: left;}
    .his_list ul li:nth-child(even) { flex-direction: row;}
    .his_top {display: none;}
    .his_list {padding-top: 0;}
    .his_list ul li:nth-child(odd) .h_no {float: inherit;padding-left: 0;}
    .shtitle .path-nav {display: none!important;}

}	


@media (max-width: 480px){
    .h_cons{display: block;}
    .h_cons{padding-left: 0; letter-spacing: -0.02em;}

}	





















