@charset 'utf-8';

.page-content .at-container { overflow: inherit;}
.page-content ol, .page-content ul {padding: 0; margin: 0;}
.page-content .orange { color: #fc8902; }
.page-content article { position: relative;}
.page-content article:after { content:''; display: block; clear:both}

.greeting {}
.greeting .con1 { position: relative; top: 50px; height: 450px; background: url('/page/imgs/bg_greeting.jpg') no-repeat center / cover;}
.greeting .con1 .box { display: inline-block; padding: 85px 100px 85px 50px; margin-top: -50px; background: #001b3f;  }
.greeting .con1 .box p {color: #fff; font-weight: 500; }
.greeting .con1 .box .p1 { padding: 0 0 40px;  }
.greeting .con1 .box .p2 { font-size: 50px; line-height: 1.3; }
.greeting .con2 { }
.greeting .con2 p { margin: 0 0 20px;}
.greeting .con2 .p1 { padding: 50px 0 0; margin: 90px 0 45px; font-size: 25px; }
.greeting .con2 .sign { padding: 20px 0 0;}

@media (max-width:991px){
    .greeting .con1 .box { padding: 70px 50px }
    .greeting .con1 .box .p2 { font-size: 40px;}
    .greeting .con2 .p1 { font-size: 23px;}
    .greeting .con2 .p1 { margin: 70px 0 45px; }
}
@media (max-width:768px){
    .greeting .con1 { height: 380px;}
    .greeting .con1 .box { padding: 60px 40px }
    .greeting .con1 .box .p1 { padding: 0 0 30px;}
    .greeting .con1 .box .p2 { font-size: 36px;}
    .greeting .con2 .p1 { margin: 60px 0 40px; }

}
@media (max-width:576px){
    .greeting .con1 { height: 330px;}
    .greeting .con1 .box { padding: 60px 40px }
    .greeting .con1 .box .p2 { font-size: 32px;}
    .greeting .con2 .p1 { font-size: 18px;}
    .greeting .con2 .p1 { margin: 50px 0 30px; }
}
@media (max-width:480px){
    .greeting .con1 { top: 0; padding: 20px 0; height: auto; }
    .greeting .con1 .box {  padding: 40px 20px; width: 100%; }
    .greeting .con1 .box .p1 { padding: 0 0 20px;}
    .greeting .con1 .box .p2 { font-size: 28px;}
    .greeting .con2 .p1  { padding: 0;}
    .greeting .con2 .p1 { margin: 30px 0 20px; }
    .greeting .con2 p { margin: 0 0 10px;}
}
@media (max-width:400px){
    .greeting .con1 .box {  padding: 30px 20px; width: 100%; }
    .greeting .con1 .box .p1 { padding: 0 0 15px;}
    .greeting .con1 .box .p2 { font-size: 21px;}
}

.history {}
.history .con1 p { text-align: center; line-height: 1; }
.history .con1 .p1 { font-weight: 500;}
.history .con1 .p2 { padding: 10px 0 40px; font-size: 35px; font-weight: 700;}
.history .h-list { padding: 0 0 100px ; }
.history .h-list p.tit { margin: 0 auto; width: 180px; height: 40px; color: #001b3f;  font-weight: 400; text-align: center; line-height: 40px; border-radius:20px; border: 1px solid #001b3f;}
.history .h-list .list-box { position: relative; padding: 80px 0 0;}
.history .h-list .list-box:before { content: ''; display: block; position: absolute; left: 50%; top: 0; width: 1px; height: 100%; background: #001b3f;}
.history .h-list .list-box .wrap { position: relative; }
.history .h-list .list-box .wrap:after { content:''; display: block; clear: both;}
.history .h-list .list-box .wrap dl { position: relative; margin: 0 0 30px; width: 50%;}
.history .h-list .list-box .wrap:last-of-type dl { margin: 0;}
.history .h-list .list-box .wrap dl dt { padding: 0 0 10px; font-size: 25px; font-weight: 500;  line-height: 1;}
.history .h-list .list-box .wrap dl dd {  position: relative; padding: 0 10px 5px; font-size: 16px; word-break: keep-all;  }
.history .h-list .list-box .wrap.right dl { float:right; padding: 0 0 0 90px;}
.history .h-list .list-box .wrap.left dl { float:left; padding: 0 90px 0 0 ; text-align: right; }

.history .h-list .list-box .wrap dl:before, .history .h-list .list-box .wrap dl:after { content:''; display: block; position: absolute; }
.history .h-list .list-box .wrap dl:before  { z-index: 2; width: 19px; height: 19px; background: url('/page/imgs/mk_circle.gif') no-repeat top center / contain;}
.history .h-list .list-box .wrap dl:after {  width: 50px; height: 1px; background: #001b3f; }
.history .h-list .list-box .wrap.right dl:before  { left: -9px; top: 6px; }
.history .h-list .list-box .wrap.right dl:after { left: 0; top: 15px;  }
.history .h-list .list-box .wrap.left dl:before  { right: -9px; top: 11px; }
.history .h-list .list-box .wrap.left dl:after { right: 0; top: 20px;  }
.history .h-list .list-box .wrap dd:before { content:''; display: block; position: absolute; top: 12px; width: 5px; height: 1px; background: #111;  }
.history .h-list .list-box .wrap.right dd:before { left: 0; }
.history .h-list .list-box .wrap.left dd:before { right: 0; }

.history .h-list .list-box .wrap.bg:before { content:''; display: block; position: absolute; top: 0;  width: calc(50% - 90px); height: 475px; }
.history .h-list .list-box .wrap.bg1:before { top: 0; left: 0; background: url('/page/imgs/bg_history1.jpg') no-repeat top center / cover;}
.history .h-list .list-box .wrap.bg2:before { top: 0; right: 0; background: url('/page/imgs/bg_history2.jpg') no-repeat top center / cover;}
.history .h-list .list-box .wrap.bg3:before { top: 0; left: 0; background: url('/page/imgs/bg_history3.jpg') no-repeat top center / cover;}
.history .h-list .list-box .wrap.bg4:before { top: 0; right: 0; background: url('/page/imgs/bg_history4.jpg') no-repeat top center / cover;}
.history .h-list .list-box .wrap.bg5:before { top: 0; left: 0; background: url('/page/imgs/bg_history5.jpg') no-repeat top center / cover;}


@media (max-width:768px){
    .history .h-list .list-box .wrap.right dl { padding: 0 0 0 40px;}
    .history .h-list .list-box .wrap.left dl {padding: 0 40px 0 0 ; }
    .history .h-list .list-box .wrap.bg:before { width: calc(50% - 40px);}
    .history .h-list .list-box .wrap dl:after { width: 30px;}
}
@media (max-width:576px){
    .history .h-list { padding: 0 0 50px ; }
    .history .h-list p.tit { margin: 0 0 10px; text-align: left; font-size: 22px; font-weight: 500; color: #fc8902; border: none;}
    .history .h-list .list-box { padding: 20px 0 0;}
    .history .h-list .list-box:before { left: 20px;}
    .history .h-list .list-box .wrap dl { margin: 0 0 25px; width: calc(100% - 20px);}
    .history .h-list .list-box .wrap.left dl { float:right; text-align: left;}
    .history .h-list .list-box .wrap dl dt { font-size: 18px;}
    .history .h-list .list-box .wrap dl dd { font-size: 15px;}
    .history .h-list .list-box .wrap dd:before { left: 0; }
    .history .h-list .list-box .wrap dl:before { top: 0 !important; left:-9px; right:auto;}
    .history .h-list .list-box .wrap dl:after { display: none;}

    .history .h-list .list-box .wrap.right dl,
    .history .h-list .list-box .wrap.left dl {padding: 0 0 0 20px; }
    .history .h-list .list-box .wrap.bg:before { display: none;}

}



.staff {}
.staff article { padding: 0 0 100px;}
.staff article h4 { margin: 0 auto 50px; width: 180px; height: 40px; background: #001b3f; text-align: center; font-size: 18px; color: #fff;  font-weight: 300; line-height: 40px;  border-radius: 20px;}
.staff article .flex { flex-wrap:wrap; border-top:1px solid #e1e1e1; border-left:1px solid #e1e1e1;}
.staff article .flex .wrap { display: flex; justify-content: space-between; padding: 3.486% 2.307%; width: 33.33%; border-right: 1px solid #e1e1e1; border-bottom:1px solid #e1e1e1;}
.staff article .flex .wrap .name {  }
.staff article .flex .wrap .name h5 { font-size: 25px; font-weight: 500;}
.staff article .flex .wrap .name p { padding: 10px 0 0 ; font-size: 16px; font-weight: 400; color: #fc8902; }
.staff article .flex .wrap .career { width: 57%; }
.staff article .flex .wrap .career p {padding: 0 0 10px;  font-size: 20px; font-weight: 500;}
.staff article .flex .wrap .career li { padding: 0 0 10px; line-height: 1.2;}
.staff .con2 h4 { background: #08a0e0; }


@media (min-width:577px){
    .staff article.con2 .flex .wrap { display: block; width: 25%;}
    .staff article.con2 .flex .wrap .name { padding: 0 0 20px;}
    .staff article.con2 .flex .wrap .name h5 { display: inline-block;}
    .staff article.con2 .flex .wrap .name p { display: inline-block; padding: 0 0 0 10px;}
}

@media (max-width:992px){
    .staff article .flex .wrap { display: block; }
    .staff article .flex .wrap .name { padding: 0 0 10px; margin: 0 0 10px; border-bottom: 1px dotted #e1e1e1;}
    .staff article .flex .wrap .name h5 { display: inline-block;}
    .staff article .flex .wrap .name p { display: inline-block; padding: 0 0 0 10px;}
    .staff article .flex .wrap .career { width: 100%; }
}

@media (max-width:768px){
    .staff article .flex .wrap .name h5 { font-size: 21px;}
    .staff article .flex .wrap .career p { font-size: 18px; }
    .staff article .flex .wrap .career li { font-size: 16px;}
}
@media (max-width:576px){
    .staff article { padding: 0 0 50px;}
    .staff article h4 { margin: 0 auto 30px;}
    .staff article .flex { border: none;}
    .staff article .flex .wrap { padding: 15px 10px; margin: 0 0 10px; width: 49%; border: 1px solid #e1e1e1;}
    .staff article .flex .wrap .name { text-align: center;}
}
@media (max-width:400px){
    .staff article .flex .wrap .name h5 { font-size: 19px;}
    .staff article .flex .wrap .career li { font-size: 15px;}
}


.location {}
.location .root_daum_roughmap { width: 100%; }
.location table { margin: 30px 0 0 ; width: 100%; border-top: 2px solid #001b3f;}
.location table th, .location table td { padding: 10px 30px; border-bottom: 1px solid #e1e1e1; word-break: keep-all;}
.location table th { text-align: center; background: #f2f5f9; font-weight: 500; letter-spacing: 0.2em; }

@media (max-width:576px){
    .location table th, .location table td { padding: 10px 10px; }
    .location table th { letter-spacing: inherit;}
}
.group .con1 {text-align: center;}
.group .con1 img:nth-of-type(2) { display: none;}

@media (max-width:900px){
    .group .con1 img:nth-of-type(2) { display: inline-block;}
    .group .con1 img:nth-of-type(1) { display: none;}


}
