@charset "utf-8";

/*
    에디터 너비를 페이지와 맞추기 위해 좌우 20px 늘림
*/
#cke_document-editor { margin:0 -20px }
#view-title { background:#eeeeee; border:1px solid #cccccc; padding:10px 20px }
.wrap {width:1200px; margin:0 auto}
.wrap-md {width:850px; margin:0 auto}

/*
================================================================================
    페이지 떠다니는 버튼
    버전관리 / 페이지수정
================================================================================
*/
.view-page-buttons {z-index: 999;position:relative;}
.view-page-buttons.fixed {position: fixed;top:120px;}
.view-page-buttons .buttons {position:absolute;left:20px; top:20px;display:flex;flex-direction: column;}
.view-page-buttons .buttons .btn {width:35px; height:35px;overflow:hidden;display:block;color:#191919;background:#f9f9f9; font-size:17px }
.view-page-buttons .buttons .btn:hover {width:150px;margin-right:-150px;}
.view-page-buttons .buttons .btn:hover {background:#dfdfdf}

/*
================================================================================
    글쓰기 페이지
================================================================================
*/
.write-page-buttons { padding:20px 0; display:flex; justify-content: center }
.write-page-buttons .gs-btn { width:200px; }

/*
================================================================================
    dropzone.js
    커스터마이징
================================================================================
*/
.dropzone {min-height: auto;margin:20px -20px; border:2px dotted #3a8afd; border-radius: 20px; padding:5px;display:flex; flex-wrap: wrap; justify-content: flex-start;}
.dropzone .dz-message {width:100%;text-align: center;}
.dropzone .dz-message .dz-button {font-size:30px;font-weight: 900;color:rgba(0,0,0,0.1);}
.dropzone .dz-image,
.dropzone .dz-details { cursor:pointer }
.dropzone .dz-image img { width:120px; height:120px; }

/**
================================================================================
    swiper
    custom
================================================================================
 */
.swiper { position:relative; overflow:hidden }
.swiper .swiper-slide { display:flex; justify-content: space-between; }
.swiper .swiper-slide h3 { padding-top:167px; padding-left: 45px; font-size:30px }
.swiper .swiper-slide img { width:740px; height:450px }
.swiper .swiper-pagination.swiper-pagination-bullets {position:absolute;top: 130px;left: 45px;transform: none;width:auto;}

/*
================================================================================
    jquery-ui
    탭 디자인
================================================================================
*/
.tabs.ui-tabs .ui-tabs-nav {margin: 0 0 40px 0;padding: 0;display: flex; width:100%;}
.tabs.ui-widget.ui-widget-content {border: none;border-radius: 0;padding:0;}
.tabs.ui-widget.ui-widget-content img {margin-bottom:20px}
.tabs .ui-widget-header {border: none;background: none;}
.ui-tabs .ui-tabs-panel {padding: 0;}
.ui-tabs .ui-tabs-nav li {margin: 0 -1px 0 0;width:100%; min-width:fit-content;background:none;border:none}
.ui-tabs .ui-tabs-nav li a {display: block; background:#fff; border:1px solid #e2e2e2; width:100%; padding:15px 20px; text-align: center; font-size:20px; font-weight: 400; color:#7f7f7f}
.ui-tabs .ui-tabs-nav li.ui-tabs-active a {outline: none;background:#4876f0; color:#fff}
.ui-tabs .ui-tabs-nav li.ui-tabs-active:focus a,
.ui-tabs .ui-tabs-nav li.ui-tabs-active a:focus {outline: 0;border: none;}
.ui-tabs .ui-tabs-nav li a:hover {color:#000}
.ui-tabs .ui-tabs-panel p { display: flex; justify-content: space-around; flex-wrap: wrap }

/*
================================================================================
    레이어 팝업 스타일
    페이지 히스토리
================================================================================
*/
.pop-layer .pop-container {padding: 20px 25px;font-size:15px;}
.pop-layer p.ctxt {color: #191919;line-height: 25px;}
.pop-layer .btn-r {width: 100%;margin: 10px 0 20px;padding-top: 10px;border-top: 1px solid #DDD;text-align: right;}
.pop-layer {display: none;position: absolute;top: 50%;left: 50%;width: 510px;height: auto;background-color: #fff;border: 5px solid #3571B5;z-index: 10;}
.dim-layer {display: none;position: fixed;_position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 999;}
.dim-layer .dimBg {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: #000;opacity: .5;filter: alpha(opacity=50);}
.dim-layer .pop-layer {display: block;}
a.btn-layerClose {display: inline-block;padding: 10px 20px;border: 1px solid #304a8a;background-color: #3f5a9d;font-size: 18px;color: #fff;line-height: 18px;}
a.btn-layerClose:hover {border: 1px solid #091940;background-color: #1f326a;color: #fff;}
#page-history .pop-container ul li {
    padding-left:16px;
    font-size:17px;
    font-weight: 400;
    color:#111111; margin-bottom: 10px;
    background:no-repeat left .6em url("img/detail-page-bullet-type1.png")
}
#page-history .pop-container ul li a:hover { text-decoration: underline }
#page-history .pop-container h2 { margin-bottom:20px }

/*
================================================================================
    jquery-ui
    아코디언 커스텀
================================================================================
*/
.page-contents .accordion { border-top: 1px solid #000;border-bottom:1px solid #c0c0c0;}
.page-contents .ui-accordion .ui-accordion-header {border:none;border-top:1px solid #c0c0c0;border-radius: 0;margin-top:0;padding:20px 40px;background-color: #fff;line-height: 40px;font-size:20px;outline: none;color: #191919}
.page-contents .ui-accordion .ui-accordion-header.ui-state-active {color: #4876ef}
.page-contents .ui-accordion .ui-accordion-header span { display:none }
.page-contents .ui-accordion .ui-accordion-header:after {content: "\f067";font-family: FontAwesome, serif;float:right;}
.page-contents .ui-accordion .ui-accordion-header.ui-state-active:after {content: "\f068";}
.page-contents .ui-accordion .ui-accordion-content {padding: 55px 45px;border: none;font-size:15pt;background: #f9f9f9}
.page-contents .ui-accordion .ui-accordion-content h4 {margin-bottom:20px}


/*
================================================================================
    페이지 컨텐츠 디자인 (공통)
================================================================================
*/
.page-contents { font-size:18px; line-height: 1.6; min-height: 500px  }
.page-contents img { max-width: 100% }

/* Headings */
.page-contents h1 {font-size:40px; color:#191919; font-weight:700; margin-bottom:10px}
.page-contents h2 {font-size:23px; color:#191919; font-weight:700; margin-bottom:20px}
.page-contents h3 {font-size:20px; color:#191919; font-weight:700; margin-bottom:20px}

/* 기본 목록 스타일 */
.page-contents ul { list-style:none; margin:0; padding:0 }
.page-contents ul li {
    padding-left:1em;
    font-size:18px;
    font-weight: 400;
    color:#111111; margin-bottom: .5em;
    background:no-repeat left .6em url("img/detail-page-bullet-type1.png")
}

/* 페이지 섹션 */
.page-contents .gs-section { color:#191919; font-weight: 400; padding:50px 0 50px 0 }
.page-contents .gs-section.center {text-align:center}
.page-contents .gs-section.bg {background-repeat: no-repeat; background-position: center bottom; background-size: cover}
.page-contents .gs-section.gray {background-color:#f7f7f7}
.page-contents .gs-section h2 { color:#191919; font-size: 42px; font-weight: 700 }
.page-contents .gs-section .f-left { float:left; margin:0 20px 20px 0 }
.page-contents .gs-section.full-width {
    margin-left:calc((100vw - 1729px) / 2 - (100vw - 1729px));
    margin-right:calc((100vw - 1729px) / 2 - (100vw - 1729px) - 150px);
    padding-right:150px;
}
.page-contents.cke_editable .gs-section.full-width {margin:0}

.page-contents .gs-section.animation { padding:0; overflow: hidden }
.page-contents .gs-section.animation .background { transform: scale(1.2); color:#191919; font-weight: 400; padding:150px 0 50px 0  }
.page-contents .gs-section.animation.on .background {transform: scale(1);transition: transform 0.7s ease-out}
.page-contents.cke_editable .gs-section.animation .background { transform: scale(1)}

/* 컬럼 디자인 */
.page-contents .gs-column { display:flex; max-width:100%; justify-content: space-between }
.page-contents .gs-column.wrap { flex-wrap: wrap }
.page-contents .gs-column.full-width {
    position: absolute;
    z-index: 0;
    left: 379px;
    padding-right:50px;
    width: calc(100vw - 379px);
}
.page-contents.cke_editable .gs-section.full-width {position: relative;left: 0;width: 100%; padding-right: 0 }
.page-contents .gs-column .col { flex-grow:1; box-sizing: border-box; margin-bottom:15px; }
.page-contents .gs-column.wrap .col { flex-grow: unset }
.page-contents .gs-column .col.circle { border-radius: 50%; display: flex; align-items: center; justify-content: center }
.page-contents .gs-column .col.gray { background-color: #f7f7f7 }
.page-contents .gs-column .col.padding { padding:70px 40px }

.page-contents .gs-column.wrap.col2 .col { flex-basis: 50% }
.page-contents .gs-column.wrap.col2.space20 .col { flex-basis: calc(50% - 20px) }
.page-contents .gs-column.wrap.col3 .col { flex-basis: 33.33% }
.page-contents .gs-column.wrap.col3.space15 .col { flex-basis: calc(33.33% - 15px) }

.page-contents .gs-column.col-2-1 { flex-grow: unset }
.page-contents .gs-column.col-2-1 .col:first-child { width:66% }
.page-contents .gs-column.col-2-1 .col:last-child { width:33% }
.page-contents .gs-column.col-1-3 .col:first-child { width:25% }
.page-contents .gs-column.col-1-3 .col:last-child { width:75% }
.page-contents .gs-column.col-3-1 .col:first-child { width:75% }
.page-contents .gs-column.col-3-1 .col:last-child { width:25% }

.page-contents .gs-column .col .header { border-bottom:1px solid #cccfd6; padding-bottom:60px; margin-bottom:37px }
.page-contents .gs-column .col .header.no-padding { padding-bottom:0 }

.page-contents .gs-column.col2.space20 .col { margin-right:20px }
.page-contents .gs-column.col2.space20 .col:nth-child(2n + 2) { margin-right:0 }

.page-contents .gs-column.col3.space15 .col { margin-right:15px }
.page-contents .gs-column.col3.space15 .col:nth-child(3n + 3) { margin-right:0 }

/* 박스 디자인 */
.page-contents .gs-box { border:1px solid #d5d5d5; padding:50px }

/* 타이틀과 설명 2컬럼 */
.title-desc-2col .item { border-top:1px solid #e8e8e8; padding:35px 0; font-size:18px; display:flex }
.title-desc-2col .item:first-child { border-top:none }
.title-desc-2col .item .title { width:140px; font-size: 20px; font-weight: 700; margin-right:20px !important; }
.title-desc-2col .item .info { width:1000px; font-weight: 300 }
.title-desc-2col .item .info ul li { font-size:18px; font-weight: 300; }

/* 테이블 스타일 */
.page-contents table.gs-table { border-collapse: collapse; border:none; margin-bottom:20px }
.page-contents table.gs-table td,
.page-contents table.gs-table th { padding:15px; border:1px solid #e1e1e1 }
.page-contents table.gs-table th { font-weight:500; background-color: #f9f9f9; border-top:1px solid #000 }
.page-contents table.gs-table td:first-child,
.page-contents table.gs-table th:first-child { border-left:0 }
.page-contents table.gs-table td:last-child,
.page-contents table.gs-table th:last-child { border-right:0 }
.page-contents table.gs-table.no-border td,
.page-contents table.gs-table.no-border th { border-left:0; border-right:0 }
.page-contents table.gs-table tbody .last-line td { position:absolute; margin-top:-1px; padding:0; border:none; border-bottom: 1px solid #c0c0c0 }
.page-contents table.gs-table.no-outer-border tr:first-child td,
.page-contents table.gs-table.no-outer-border tr:first-child th { border-top:0 }
.page-contents table.gs-table.no-outer-border tr:last-child th,
.page-contents table.gs-table.no-outer-border tr:last-child td { border-bottom:0 }

.page-contents table.gs-table.center { text-align:center }
.page-contents table.gs-table.nowrap tr,
.page-contents table.gs-table.nowrap td,
.page-contents table.gs-table.nowrap { white-space: nowrap }

/* Text Style */
.page-contents .normal {font-size:18px}
.page-contents .small li,
.page-contents .small {font-size:15px}
.page-contents .text-shadow {text-shadow: 0 0 10px #001559}

/* 페이지 버튼 디자인 */
.gs-btn {
    font-size: 18px;text-decoration: none; text-align: center;
    padding:.6em 1em;height:3em;
    display:inline-block;
    border:0;
    color:#191919;
    background:#f9f9f9;
}
.gs-btn:hover {background: #dbdbdb;}
.gs-btn.btn-primary {color:#fff;background: #4876ef;}
.gs-btn.btn-primary:hover {background:#3a8afd;}
.gs-btn.btn-round {border-radius: 1.5em;}
.gs-btn.btn-secondary {
    border:2px solid #a0a0a0;
    color:#656565;
}
.gs-btn.btn-big { font-size:1.1em; font-weight: 700; }
.gs-btn.btn-bordered { border:2px solid #656565; color:#656565 }
.gs-btn.btn-bordered:hover { background-color:#656565; color:#fff}


/* gs-tabs */
.gs-tabs { padding-top:70px; width:100%; max-width: 100%; }
.gs-tabs .tabs { display:flex; width:100%; margin-bottom:50px }
.gs-tabs .tabs .tab {
    flex-grow: 1; flex-basis: 33.33%; text-align:center; height:747px;
    background:no-repeat center center;
    background-size: cover;
    color:#fff; font-size:42px; line-height: 1.4;
    display:flex;
    justify-content: center;
    align-items: center;
    cursor:pointer;
}
.gs-tabs .tabs .tab:nth-child(1) { background-image:url("/data/file/field_of_work/2887188481_asFeqAd8_e952f4c991cbc2d9aee670d1bc989c14969e9c48.png"); }
.gs-tabs .tabs .tab:nth-child(2) { background-image:url("/data/file/field_of_work/2887188481_Fpqx0sJf_fcf31432674923d390c83d69b8c465f8b61e4e06.png"); }
.gs-tabs .tabs .tab:nth-child(3) { background-image:url("/data/file/field_of_work/2887188481_YdR5QOkw_39f43c9faa2c3bff4c7870877d86cd71697b72c6.png"); }
.gs-tabs .tabs .tab.on:nth-child(1),
.gs-tabs .tabs .tab:hover:nth-child(1) { background-image:url("/data/file/field_of_work/2887188481_RjFK0HVS_119d288c9030061cb427c3c6cbe82425fb9ed2f4.png"); }
.gs-tabs .tabs .tab.on:nth-child(2),
.gs-tabs .tabs .tab:hover:nth-child(2) { background-image:url("/data/file/field_of_work/2887188481_1l0COihF_ef06d683cb129601f2b2512a9e549b3781d6fbeb.png"); }
.gs-tabs .tabs .tab.on:nth-child(3),
.gs-tabs .tabs .tab:hover:nth-child(3) { background-image:url("/data/file/field_of_work/2887188481_9uwva0AI_c5a38c4da921d7ae5270841b0768de99ac26b36a.png"); }

.gs-tabs .tab-contents p { display:none }
.gs-tabs .tab-contents p:nth-child(1) { display:block }

/* recruitment */
.page-contents .gs-section.recruitment h2 {
    color:#af3638; font-size:30px; font-weight: 500;
    padding-bottom:20px; margin-bottom:40px;
    border-bottom:1px solid #c3686a
}
.page-contents .gs-section.recruitment .gs-column.col2 {
    align-items: center;
    padding-bottom:50px;
    border-bottom: 1px solid #a3a4a5;
    margin-bottom: 50px;
}
.page-contents .gs-section.recruitment .gs-column:nth-child(2) {border-bottom: 2px solid #919293 }
.page-contents .gs-section.recruitment .gs-column:nth-child(4) {border-bottom: 0}
.page-contents .gs-section.recruitment .gs-column .col {margin-bottom: 0}
.page-contents .gs-section.recruitment .gs-column .col:nth-child(1) {
    color:#535353;
    width:420px
}
.page-contents .gs-section.recruitment .gs-column.col2 .col:nth-child(1) h3 {
    color:#535353; font-size:32px
}
.page-contents .gs-section.recruitment .gs-column.col2 .col:nth-child(2) {
    width:505px
}

.greeting-bold span { font-weight: 900 }

@media screen and (max-width: 900px) {
    .page-contents {padding:0}
    .page-contents .gs-section {padding: 10px 0}
    /*.page-contents .gs-section {margin:0 -30px}*/
    .page-contents .gs-column.wrap.col2 .col {
        flex: 1 0 100%;
    }
    .page-contents .gs-column.col2 {
        flex-wrap: wrap;
    }
    .page-contents .gs-column.col2 .col {
        flex: 1 0 100%;
    }
    .gs-tabs .tabs .tab {
        height:300px;
    }

    #greeting-contents { flex-wrap: wrap;}
    #greeting-contents .col { padding:0 20px }
    #greeting-contents .col:nth-child(1) { order: 1; text-align:center; }
    #greeting-contents .col:nth-child(2) { order: 0; margin-bottom:50px !important; }

    #about-us .col:nth-child(2),
    #about-us .col:nth-child(4) { padding:0 20px }

    #way-to-come .col { padding:0 20px }
    #way-to-come .col table th { vertical-align:top; width:100px }

    .gs-tabs {padding-top:0}
    .gs-tabs .tabs { margin-bottom:0 }
    .gs-tabs .tabs .tab {
        height:150px;
        color:#fff; font-size:20px;
        display:flex;
    }

    .gs-section.recruitment h2 { margin: 0 20px }
    .page-contents .gs-section.recruitment .gs-column {border-bottom: 0 !important; padding-bottom: 0 !important;}
    .gs-section.recruitment p { padding: 0 20px; font-size:20px !important; }
    .gs-section.recruitment p span { font-size:20px !important; }
    .gs-section.recruitment .gs-column .col:nth-child(1) { padding: 0 20px 30px 20px }

    .gs-section.recruitment .gs-column.col4 { flex-wrap: wrap }
    .gs-section.recruitment .gs-column.col4 .col { flex:1 0 calc(50% - 5px) !important; margin-bottom: 5px }
    .gs-section.recruitment .gs-column.col4 .col:nth-child(2) { margin-right: 0 !important; }

    .recruitment-top-buttons { flex-wrap: wrap }
    .recruitment-top-buttons .col { flex: 1 0 100% }

}