@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

@font-face {
    font-family: 'notokr';
    src: url('/skin/font/notokr/notokr-thin.woff2') format('woff2'),
         url('/skin/font/notokr/notokr-thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: 'notokr';
    src: url('/skin/font/notokr/notokr-light.woff2') format('woff2'),
         url('/skin/font/notokr/notokr-light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'notokr';
    src: url('/skin/font/notokr/notokr-demilight.woff2') format('woff2'),
         url('/skin/font/notokr/notokr-demilight.ttf') format('truetype');
    font-weight: 350;
    font-style: normal;
}
@font-face {
    font-family: 'notokr';
    src: url('/skin/font/notokr/notokr-regular.woff2') format('woff2'),
         url('/skin/font/notokr/notokr-regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'notokr';
    src: url('/skin/font/notokr/notokr-medium.woff2') format('woff2'),
         url('/skin/font/notokr/notokr-medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'notokr';
    src: url('/skin/font/notokr/notokr-bold.woff2') format('woff2'),
         url('/skin/font/notokr/notokr-bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'notokr';
    src: url('/skin/font/notokr/notokr-black.woff2') format('woff2'),
         url('/skin/font/notokr/notokr-black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: 'NanumSquareNeo';
    font-weight: 300;
    font-style: normal;
    src: url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-aLt.eot');
    src: url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-aLt.eot?#iefix') format('embedded-opentype'),
         url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-aLt.woff2') format('woff2'),
         url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-aLt.woff') format('woff'),
         url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-aLt.ttf') format("truetype");
    font-display: swap;
} 
@font-face {
    font-family: 'NanumSquareNeo';
    font-weight: 400;
    font-style: normal;
    src: url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-bRg.eot');
    src: url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-bRg.eot?#iefix') format('embedded-opentype'),
         url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-bRg.woff2') format('woff2'),
         url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-bRg.woff') format('woff'),
         url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-bRg.ttf') format("truetype");
    font-display: swap;
} 
@font-face {
    font-family: 'NanumSquareNeo';
    font-weight: 700;
    font-style: normal;
    src: url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-cBd.eot');
    src: url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-cBd.eot?#iefix') format('embedded-opentype'),
         url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-cBd.woff2') format('woff2'),
         url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-cBd.woff') format('woff'),
         url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-cBd.ttf') format("truetype");
    font-display: swap;
} 
@font-face {
    font-family: 'NanumSquareNeo';
    font-weight: 800;
    font-style: normal;
    src: url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-dEb.eot');
    src: url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-dEb.eot?#iefix') format('embedded-opentype'),
         url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-dEb.woff2') format('woff2'),
         url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-dEb.woff') format('woff'),
         url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-dEb.ttf') format("truetype");
    font-display: swap;
} 
@font-face {
    font-family: 'NanumSquareNeo';
    font-weight: 900;
    font-style: normal;
    src: url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-eHv.eot');
    src: url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-eHv.eot?#iefix') format('embedded-opentype'),
         url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-eHv.woff2') format('woff2'),
         url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-eHv.woff') format('woff'),
         url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo-eHv.ttf') format("truetype");
    font-display: swap;
} 
/* @import url(//fonts.googleapis.com/earlyaccess/notosanskr.css); */
/* html {
    overflow-x: hidden;
    overflow-y: scroll;
}

.body-layout {
    background-color: #f4f4f4;
}

/* 폰트 설정 */

/* .body-layout,
h1,
h2,
h3,
h4,
h5,
h6,
input,
textarea,
button {
    font-family: 'Noto Sans KR', "NanumGothic", "나눔고딕", 'NanumBarunGothic', 'Apple SD Neo Gothic', 'Malgun Gothic', 'Gulim', sans-serif;
} */

/* h1, h2, h3, h4, h5, h6, p { margin: 0px; } */

.body-layout {
    font-size: 16px;
    font-family: 'NanumSquareNeo', 'Inter','notokr', sans-serif;
    letter-spacing: -0.025em;
}

p {
    line-height: 1.6em;
}

h1, h2, h3, h4, h5, h6, p, li, td, dt, dd, figcaption {
    word-break: keep-all;
}

/* 페이지 준비중입니다 */
.prepare-page {
    padding: 100px;
    text-align: center;
    background-color: #f7f7f7;
}
.prepare-page > .exclamation {
    width: 80px;
    height: 80px;
    position: relative;
    margin: 0 auto;
    padding: 33px;
    line-height: 1em;
    background: #333;
    border-radius: 100%;
}
.prepare-page > .exclamation::before {
    content: '\e645';
    top: 50%;
    left: 50%;
    position: absolute;
    font-size: 42px;
    font-family: 'Material Symbols Outlined';
    color: #fff;
    line-height: 1em;
    transform: translate(-50%,-50%);
}
.prepare-page > h4 {
    margin: 20px 0 22px;
    font-size: 28px;
    color: #444;
}
.prepare-page > h4 strong {
    font-weight: 700;
}
.prepare-page > p {
    margin: 0;
    line-height: 1.4em;
    color: #666;
}

/* ol,
ul,
li {
    list-style: none;
    list-style-position: inside;
} */

.navbar .caret,
.navbar .divider-vertical,
.navbar~br,
.footer-social-layout,
.footer_copy .text-center>br {
    display: none;
}

/* 상단 메뉴 설정 시작 */

.navbar-inverse {
    background: #fff;
    border: none;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
    padding: 0;
    margin: 0;
}

.navbar-inverse>.container {
    padding: 0;
}

.navbar-brand {
    padding: 20px 0 !important;
    margin: 5px 0 0 !important;
}

.navbar-brand img {
    margin: -2px 0 0;
    height: 45px;
}

.navbar-inverse .navbar-brand,
.navbar-inverse .navbar-nav>li>a {
    text-shadow: 0 0 0 rgba(0, 0, 0, 0);
}

.navbar-inverse .divider-vertical,
.navbar~br {
    display: none;
}

.topmarginLay_a {
    height: 90px !important;
}

/*----- 상단 메인 메뉴 설정 -----*/

.navbar-inverse .navbar-nav>li>a {
    background: #fff;
    color: #333;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -0.02em;
    padding: 25px;
    margin: 0;
}

.navbar-inverse .navbar-nav>li>a:hover,
.navbar-inverse .navbar-nav>li>a:focus {
    color: #4c89df;
}

.navbar-inverse .navbar-nav>.open>a,
.navbar-inverse .navbar-nav>.open>a:focus,
.navbar-inverse .navbar-nav>.open>a:hover {
    background: none;
    color: #4c89df;
}

.navbar-inverse .navbar-nav>.active>a,
.navbar-inverse .navbar-nav>.open>a {
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}

/*----- 상단 서브 메뉴 설정 -----*/

.navbar-inverse .dropdown-menu {
    background: rgba(0, 0, 0, 0.86);
    padding: 0;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
    border: none;
    border-radius: 0;
    min-width: 160px;
    left: 0;
    right: auto;
}

.navbar-inverse .dropdown-menu>li>a {
    color: #fff;
    padding: 12px 20px;
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: -0.02em;
    text-align: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.navbar-inverse .dropdown-menu>li>a:hover,
.navbar-inverse .navbar-nav>li>a:focus {
    background: #4c89df;
    color: #fff;
}
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover {
    background: #4c89df;
    color: #fff;
}
.navbar-inverse .dropdown-menu>li:last-child>a {
    border-bottom: 1px solid rgba(0, 0, 0, 0);
}

@media screen and (max-width: 991px) {
    .navbar-inverse>.container {
        margin: 0;
        width: 100%;
    }
    .navbar-brand {
        padding: 15px !important;
        margin: 8px 0 0 !important;
    }
    .navbar-brand img {
        width: 80%;
    }
    .navbar-inverse .navbar-nav>li>a {
        padding: 22px 20px 20px;
    }
    .topmarginLay_a {
        height: 64px !important;
    }
}

@media screen and (max-width: 767px) {
    .navbar-brand {
        margin: 5px 0 0 !important;
    }
    .navbar-brand img {
        width: 90%;
    }
    .navbar-inverse .navbar-toggle {
        margin: 15px;
        background: #093889;
        border: none;
        border-radius: 0;
    }
    .topmarginLay_a {
        height: 66px !important;
    }
}

@media (min-width: 768px) {
    .navbar-right {
        float: right!important;
        margin-right: -15px;
        margin-top: 20px;
    }
    .navbar .navbar-nav>.dropdown>.dropdown-menu {
        left: 50%;
        right: auto;
        transform: translate(-50%, 0);
    }
}

/* 상단 메뉴 설정 끝 */

/* 슬라이드 설정 */

.container.container_slide {
    width: 100%;
    padding: 0;
}

.carousel-control {
    display: none;
}

.fill {
    height: 620px !important;
}

.fill h1,
.fill p {
    margin: 0;
    font-size: 25px;
}

.fill h1 span,
.fill p span {
    background: none;
    opacity: 1;
    text-shadow: 0 0 0 rgba(0, 0, 0, 0);
    padding: 0;
}

.fill h1 span {
    margin: 0 0 20px;
    display: inline-block;
    font-size: 29px;
    font-weight: 800;
    letter-spacing: 0.02em;
}

.fill h1 span .caption-line {
    width: 50px;
    border-top: 1px solid #fff;
    margin-bottom: 20px;
}

.fill p span {
    color: #f8f8f8;
    font-size: 36px;
    font-weight: 400;
    line-height: 1.6;
}

.carousel-caption {
    margin: -104px 0 0;
    /* padding: 60px 50px 50px !important; */
    /* background-color: rgba(9, 56, 137, 0.8); */
    text-align: left;
    /* width: 380px !important; */
    top: 50%;
    bottom: auto;
}

.carousel-indicators li,
.carousel-indicators li.active {
    width: 40px;
    height: 6px;
    margin: 0 4px;
    border-radius: 0;
}

@media screen and (max-width: 991px) {
    .carousel-caption {
        padding: 35px 30px !important;
        width: 50% !important;
        margin: -113px auto 0;
        left: 0;
        right: 0;
    }
    .fill {
        height: 360px !important;
    }
}

@media screen and (max-width: 767px) {
    .fill {
        height: 300px !important;
    }
    .carousel-caption {
        top: 45%;
        width: 100% !important;
        margin: 0;
        padding: 0;
        transform: translateY(-50%);
    }
    .fill h1 span {
        margin: 0 0 15px;
        font-size: 20px;
    }
    .fill p {
        line-height: 1em;
    }
    .fill p span {
        font-size: 22px;
    }
}

/* 하단 카피라이트 설정 시작*/
.footer_copy .text-center {
    padding: 45px 0;
    color: #999;
    text-align: left;
    background-color: #333;
}
.footer-wrap ul {
    margin: 0;
    padding: 0;
}
.footer-wrap ul > li {
    display: inline-block;
    font-size: 14px;
    line-height: 26px;
    color: #bbb;
}
.footer-wrap ul > li+li {
    margin-left: 15px;
}
.footer-wrap ul > li.copy {
    font-size: 12px;
    color: #999;
    letter-spacing: 0.02em;
    line-height: 1;
}
/* .footer_copy .text-center {
    background-color: #fff;
    padding: 30px 0 20px;
    margin: 0;
    color: #333;
    font-size: 13px;
    text-align: left;
    display: inline-block;
    width: 100%;
    border-top: 1px solid #efefef;
}

.footer_copy p {
    line-height: 22px;
}

.footer_copy p strong {
    color: #666;
}

.footer_copy .footer-logo {
    margin-top: 10px;
} */

/* .footer_copy .footer-wrap {
    width: 1170px;
    margin: 0 auto;
} */
/* 
@media screen and (max-width: 991px) {
    .footer_copy .footer-wrap {
        width: 100%;
    }
} */

.container.footer-social-layout {
    display: none;
}

/* 하단 카피라이트 설정 끝*/

.mainthumbs {
    padding: 60px 0;
}

.mainthumbs>.col-md-12 {
    padding: 0;
}

.mainthumbs h3 {
    display: inline-block;
    margin: 0 0 20px;
    padding: 0 8px 0 0;
    float: left;
}

.mainthumbs .main-btn {
    display: inline-block;
    padding: 2px 0 0;
}

.mainthumbs div>img {
    width: 65%;
    border: 10px solid #dfdfdf;
}

.mainthumbs div h4 {
    color: #333;
    margin: 5px 0 15px 0;
    font-weight: 500;
    font-size: 24px;
}

.mainthumbs .main-box ul {
    padding: 0;
    margin: 0;
}

.mainthumbs .main-box ul li {
    font-size: 13px;
    color: #555;
    line-height: 1.8em;
    letter-spacing: -0.5px;
}

.maintxt {
    border-radius: 0;
}

.maintxt p {
    font-weight: bold;
    font-size: 16px;
    color: #333;
}

@media screen and (max-width: 767px) {
    .mainthumbs {
        padding: 30px 10px;
    }
}

.intro-boardbox {
    padding: 0;
}

.intro-boardbox>.page-header {
    display: none;
}

.intro-widgetbox {
    margin-top: 0;
    margin-bottom: 15px;
}

.intro-widgetBoardbox>a,
.intro-widgetbox>.page-header {
    display: none;
}

.skin-page-title {
    border-radius: 0;
    border-right: 13px solid #333;
}

.skin-page-title p {
    margin: 0;
}

.none-radius {
    border-radius: 0;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0);
}

.none-radius img {
    border: 10px solid #dfdfdf;
}

.reset-padding {
    padding: 10px 0;
}

.caret {
    display: none;
}

/*    main content 설정 시작     */

.main-box {
    background: #fff;
    border-radius: 4px;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
    padding: 30px 40px;
    min-height: 240px;
}

@media screen and (max-width: 991px) {
    .main-box {
        min-height: 300px;
    }
}

@media screen and (max-width: 767px) {
    .main-box {
        min-height: 240px;
    }
}

.main-box:hover {
    background-color: #f4f7fc;
}

.main-box .strategy-text {
    display: inline-block;
    padding: 20px 0 20px 10px;
    font-size: 12px;
    color: #999;
}

.main-box .line {
    border-bottom: 1px solid #333;
    margin: 5px 0 15px;
    width: 30px;
    display: block;
}

.main-box .main-img {
    display: inline-block;
    float: left;
}

.main-wrap>div {
    padding: 0 15px;
}

.main-img.main-hover {
    visibility: hidden;
    position: absolute;
    left: 15px;
    top: 0;
    margin: 30px 40px !important;
    z-index: 999;
}

.main-box:hover .main-img {
    visibility: hidden;
}

.main-box:hover .main-img.main-hover {
    visibility: visible;
}

.mainthumbs a {
    text-decoration: none;
}

.mainthumbs div h4 {
    color: #222;
    margin: 0 0 14px;
    font-weight: 500;
    font-size: 24px;
    letter-spacing: -0.02em;
}

.main-box:hover .line {
    border-bottom: 1px solid #093889;
}

.main-box:hover>p {
    color: #777;
}

.main-box:hover>p.strategy-text {
    color: #aaa;
}

/*     widget 설정     */

/* 게시판 영역 설정 */

.intro-board-layout {
    padding: 0 10px 0 0;
}

.intro-board-layout h3 {
    display: inline-block;
    margin: 0 0 15px;
    padding: 0 10px 0 0;
    float: left;
}

.intro-board-layout .main-btn {
    display: inline-block;
    padding: 5px 0 0;
}

.intro-board-layout .panel-body {
    padding: 0;
}

.intro-board-layout .panel-body .dh-front-list2-words {
    padding: 28px 30px !important;
    border-bottom: 1px solid #dedede;
    max-height: 135px;
}

.intro-board-layout .panel-body .dh-front-list2-words:last-child {
    border-bottom: 1px solid #eee;
}

.intro-board-layout .panel-body>div:hover {
    background-color: #f4f7fc;
}

.dh-front-list2 h6 {
    padding: 0 0 15px !important;
}

.dh-front-list2 h6 a,
.dh-front-list2 h6 a span {
    color: #333;
    font-weight: 600;
    font-size: 16px;
    letter-spacing: -0.5px;
}

.dh-front-list2 h6 a span.label {
    color: #093889 !important;
}

.dh-front-list2 h6:hover a span {
    text-decoration: none !important;
}

.dh-front-list2 h6:hover a span.list-row-subject {
    color: #093889 !important;
}

.dh-front-list2 h5 {
    border-top: none !important;
    padding: 0 !important;
    margin: 0;
    height: 50px !important;
    overflow: hidden;
}

.dh-front-list2 h5,
.dh-front-list2 h5 a,
.dh-front-list2 h5 p,
.dh-front-list2 h5 span {
    font-size: 13px !important;
    font-weight: 400;
    line-height: 1.8;
    color: #555 !important;
}

.dh-front-list2-words {
    margin: 0 !important;
}

.list-row-contents {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}

.list-row-regdate {
    float: right;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #999 !important;
}

.row-separator {
    display: none;
}

@media screen and (max-width: 767px) {
    .intro-board-layout {
        padding: 0 10px;
    }
    .intro-board-layout .intro-boardbox {
        display: inline-block;
    }
    .dh-front-list2 h6 a span.list-row-regdate {
        display: block;
        padding: 8px 10px 0 0;
        float: none;
    }
    .dh-front-list2 h5 {
        height: 25px !important;
    }
}

/* //게시판 영역 설정 */

/* 위젯 영역 설정 */

.intro-widget-layout {
    padding: 0 0 0 20px;
}

.intro-widget-layout>h3 {
    margin: 0 0 15px;
    padding: 0 10px 0 0;
}

.main-about {
    background-color: #fff;
    border-top: 1px solid #dedede;
    border-left: 1px solid #dedede;
    border-right: 1px solid #dedede;
    padding: 25px;
    height: 135px;
}

.main-about:hover.main-about1,
.main-about:hover.main-about2,
.main-about:hover.main-about3 {
    background-color: #f4f7fc;
}

.main-about:hover.main-about1 h5,
.main-about:hover.main-about2 h5,
.main-about:hover.main-about3 h5 {
    color: #093889;
}

.main-about:hover.main-about1 p,
.main-about:hover.main-about2 p,
.main-about:hover.main-about3 p {
    color: #777 !important;
}

.main-about>h5 {
    margin: 0;
    font-size: 16px;
    color: #343434;
}

.main-about p {
    font-size: 13px !important;
    font-weight: 400;
    line-height: 23px;
    color: #555;
    padding: 15px 0 0;
    margin: 0;
}

.main-about2>div {
    display: inline-block;
}

.main-about2>div:last-child {
    margin-left: 16px;
}

.main-about3 {
    padding: 23px 30px;
    border-bottom: 1px solid #dedede;
}

.main-about3>div {
    display: inline-block;
}

.main-about3>div:last-child {
    margin-left: 20px;
}

.main-about3 .icon-about {
    float: left;
    margin-right: 6px;
}

@media screen and (max-width: 991px) {
    .main-about2>div:last-child,
    .main-about3>div:last-child {
        display: none;
    }
}

@media screen and (max-width: 767px) {
    .intro-widget-layout {
        padding: 0 10px;
    }
}

/*    //main content 설정 끝     */

/*    sub page 설정 시작     */

.sub-top-wrap {
    height: 220px;
    background-image: url(/skin/img/sub/subTop.jpg);
}

.sub-top {
    background-color: rgba(0, 0, 0, 0.25);
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
}

.sub-top>div {
    width: 100%;
    max-width: 1170px;
    height: 100%;
    position: relative;
    padding: 20px 0 0;
}

.sub-top>div>h2 {
    display: block;
    color: #fff;
    font-size: 40px;
    font-weight: 500;
    letter-spacing: -0.02em;
    margin: -32px 0 0;
    padding: 20px 0 0;
    position: relative;
    top: 50%;
}

.sub-top>div>h2::before {
    content: '';
    position: absolute;
    width: 40px;
    height: 2px;
    background: #fff;
    top: 0;
    left: 0;
}

.sub-top>div>dl {
    margin: 0;
    list-style: none;
    position: absolute;
    right: 0;
    bottom: 0;
}

.sub-top>div>dl>dd {
    display: inline-block;
    line-height: 32px;
    font-size: 15px;
    padding: 15px 10px;
}

.sub-top>div>dl>dd.on {
    background: url(/skin/img/default/sub/menu_arrow.png) center bottom no-repeat;
}

.sub-top>div>dl>dd>a {
    color: #fff;
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0.02em;
    padding: 0 10px;
    text-decoration: none;
}

.sub-top>div>dl>dd>a.on {
    font-weight: 700;
}

.sub-layout {
    width: 100%;
    min-height: 750px;
    padding: 0;
    background: #fff;
}

.sub-layout .content {
    width: 100%;
    max-width: 1170px;
    margin: 0 auto;
    padding: 0 0 80px;
}

.sub-layout .content .page-header {
    margin: 20px 0 0;
    padding: 0;
    border: none;
    text-align: right;
}

.sub-layout .content .page-header .breadcrumb {
    border-radius: 0;
    margin: 0;
    padding: 0;
    display: inline-block;
    background: #ffffff;
    font-size: 12px;
    color: #999999;
}

.breadcrumb>.active {
    font-weight: 700;
}

.breadcrumb>li+li::before {
    content: '>';
}

.content-wrap {
    padding: 0;
}

.content-wrap .text-wrap {
    text-align: center;
    margin-bottom: 40px;
}

.content-wrap .text-wrap h3 {
    margin: 0;
    padding: 40px 0 0;
    color: #093889;
    font-size: 34px;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: normal;
}

.content-wrap .text-wrap h5 {
    margin: 0;
    color: #888;
    font-size: 15px;
    font-weight: 400;
}

.content-wrap .text-wrap p {
    margin: 0;
    padding-top: 40px;
    color: #666;
    font-size: 15px;
    line-height: 24px;
    letter-spacing: -0.04em;
}

/*----- about page -----*/

.about_tit {
    position: relative;
}

.about_tit .caption {
    background: rgba(12, 76, 163, 0.7);
    position: absolute;
    bottom: 0;
    color: #fff;
    padding: 40px 40px;
}

.about_tit .caption h3 {
    margin: 0 0 20px;
    font-size: 30px;
    font-family: 'Nanummyeongjo' !important;
    letter-spacing: -0.04em;
}

.about_tit .caption p {
    width: 100%;
    margin: 0;
    font-size: 15px;
    line-height: 1.8;
    color: #fff;
}

.about_tit .caption p:nth-of-type(2) {
    text-align: right;
    margin-top: 20px;
    display: block;
}

/*----- location page -----*/

.location_wrap .default_tb {
    margin-top: 30px;
}

/*----- business page -----*/

.business_wrap {
    margin: 0;
    padding: 6px 6px 0;
    width: 100%;
    background: url(/skin/img/default/sub/bg_border.png) repeat;
}

.business_wrap ul {
    display: inline-block;
    margin: 0;
    padding: 25px;
    width: 100%;
    background-color: #fff;
}

.business_wrap ul li.tit {
    text-align: center;
}

.business_wrap ul li.tit h3 {
    margin: 0;
    color: #333;
    font-size: 23px;
    letter-spacing: -0.04em;
    line-height: 1.4;
}

.business_wrap ul li.tit p {
    color: #777;
    font-size: 13px;
}

ul.middot_list {
    margin: 0 !important;
    padding: 0;
}

ul.middot_list li {
    margin: 0;
    padding: 0 0 0 15px;
    line-height: 2;
    font-size: 13px;
    color: #555;
    position: relative;
}

ul.middot_list li::before {
    content: '';
    background: #aaa;
    width: 3px;
    height: 3px;
    border-radius: 100%;
    position: absolute;
    top: 10px;
    left: 0;
}

.grid_wrap {
    margin-top: 40px;
}

.grid_left {
    padding: 0;
    width: 25%;
    margin-left: 0%;
    float: left;
    overflow: hidden;
}

.grid_left h3 {
    color: #333;
    font-size: 18px;
    letter-spacing: -0.06em;
    margin: 0;
}

.grid_right {
    padding: 0 0 0 30px;
    width: 75%;
    margin-left: 0%;
    float: left;
    border-left: 1px #e7e7e7 dashed;
}

.grid_right h3 {
    margin: 0 0 15px;
    color: #555;
    font-size: 15px;
    letter-spacing: -0.04em;
}

.grid_right h3.color {
    color: #093889;
}

.grid_wrap ul.middot_list {
    margin: 0 0 30px !important;
}

.grid_wrap .default_tb_wrap {
    margin-bottom: 30px;
}

ul.litxt_body {
    padding: 0;
}

ul.litxt_body li {
    padding: 0;
}

ul.litxt_body li::before {
    content: '';
    background: none;
    width: 0;
    height: 0;
}

/* 게시판 설정 시작 */

/*=====----- 메일폼 설정 -----=====*/

#mailForm {
    width: 100%;
    max-width: 1170px;
    margin: 0 auto;
    padding: 60px 0;
}

#mailForm .form-group {
    margin: 0;
    padding: 25px 35px;
    background: #f8f8f8;
    border-bottom: 1px solid #e0e0e0;
}

#mailForm .form-group:first-child {
    border-top: 2px solid #000;
}

#mailForm .form-group:nth-child(5) {
    background: none;
    border: none;
    padding: 30px 25px;
}

#mailForm .form-group label {
    width: 15%;
    float: left;
    margin: 10px 0 0;
}

#mailForm .form-group input.form-control,
#mailForm .form-group textarea.form-control {
    width: 85%;
    max-width: 935px;
    border: 1px solid #d0d0d0;
    border-radius: 0;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}

#mailForm .form-group input.form-control {
    height: 40px;
}

#mailForm .form-group p.error,
#mailForm .form-group~p.error {
    margin: 0;
    color: #093889;
    font-size: 12px
}

#mailForm .form-group~p.error {
    padding-left: 35px;
    margin: -15px 0 0;
}

#mailForm .form-group .checkbox {
    margin: -8px 0 0;
}

#mailForm .form-group .checkbox label {
    width: 100%;
    margin: 0;
}

input[type=button].btn-block,
input[type=reset].btn-block,
input[type=submit].btn-block {
    width: 220px;
    margin: 0 auto;
    margin-top: 30px;
    padding: 15px 0;
    border: 1px solid #bebebe !important;
    border-radius: 0;
    background: #fff !important;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
    color: #666;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: -0.03em;
    text-shadow: 0 0 0 rgba(0, 0, 0, 0);
}

input[type=button].btn-block:hover,
input[type=reset].btn-block:hover,
input[type=submit].btn-block:hover {
    background: #093889 !important;
    border: 1px solid #093889 !important;
    color: #fff;
}

@media screen and (max-width: 991px) {
    #mailForm .form-group input.form-control,
    #mailForm .form-group textarea.form-control {
        max-width: 567px;
    }
}

@media screen and (max-width: 767px) {
    #mailForm .form-group {
        padding: 20px 15px;
    }
    #mailForm .form-group label {
        width: 20%;
        font-size: 13px;
        font-weight: 500;
        letter-spacing: -0.05em;
    }
    #mailForm .form-group input.form-control,
    #mailForm .form-group textarea.form-control {
        width: 80%;
    }
    #mailForm .form-group~p.error {
        padding-left: 15px;
        margin: 0;
    }
    input[type=button].btn-block,
    input[type=reset].btn-block,
    input[type=submit].btn-block {
        margin-top: 80px;
    }
}

/*=====----- 게시판 설정 -----=====*/

/* .dh-board,
.img-bbs-default-index-layout .page_wrap~div,
.dh-view-box,
.form-horizontal,
#mailForm {
    width: 100%;
    max-width: 1170px;
    margin: 0 auto;
    padding: 0 0 70px;
} */

.bbs-list-index-layout .content,
.bbs-blog2-index-layout .content,
.bbs-list-view-layout .content,
.bbs-blog-view-layout .content,
.bbs-list-edit-layout .content,
.bbs-list-add-layout .content,
.contact-mail-layout .content {
    padding: 0;
}

/*=====----- 텍스트 게시판 설정 -----=====*/

/* .table {
    border-top: 1px solid #093889 !important;
    border-bottom: 1px solid #ccc !important;
}

.table>thead>tr>th,
.table>tbody>tr>th,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>tbody>tr>td,
.table>tfoot>tr>td {
    padding: 14px 16px !important;
    color: #666;
    font-size: 14px;
    letter-spacing: -0.04em;
}

.table>thead>tr>th {
    background: #f4f4f4;
    vertical-align: middle;
    border-bottom: 1px solid #dedede;
    font-size: 15px;
    font-weight: 500;
    color: #222;
}

.table>tbody>tr>td {
    border-bottom: 1px dotted #dedede;
}

.table>tbody>tr>td>strong>a {
    color: #555;
} */

.dh-board>.table-hover {
    border-top: 2px solid #2d2d2d;
    border-bottom: 1px solid #ccc;
    margin: 0px 0 30px;
}

.dh-board>.table-hover>tbody>tr:hover td {
    background-color: #f9f9f9;
}

.dh-board>.table-hover>tbody>tr:hover>td>strong>a {
    color: #000;
}

.dh-margin-top {
    margin-top: 100px;
    display: inline-block;
}

/* ----- 블로그 B타입 게시판 ----- */

.bbs-blog2-index-layout .dhb-txt-box-type-b {
    border: none;
    background-color: #fff;
    width: 25%;
    margin: 0 0 20px;
    padding: 0 10px;
}

.bbs-blog2-index-layout .dhb-txt-box-type-b>div {
    margin: 0;
    padding: 0;
    border: 1px solid #e5e5e5;
}

.dhb-txt-box-type-b-img-layout {
    padding: 0;
}

.dhb-txt-box-type-b-img-layout .thumb-hidden {
    border: none;
    min-height: 180px;
    max-height: 180px;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}

.dhb-txt-box-type-b-text-layout h4 {
    font-size: 14px;
    margin: 15px 0;
}

.dhb-txt-box-type-b-text-layout .txt-box-footer {
    margin-top: 0;
    float: none;
    text-align: left;
    display: none;
}

.txt-box-footer em {
    display: none;
}

.txt-box-footer em>span.regdate {
    font-style: normal;
    color: #666;
    font-size: 13px;
}

.txt-box-footer em>span:last-child {
    display: none;
}

.txt-box-footer small.hits {
    display: none;
}

@media screen and (max-width: 767px) {
    .bbs-blog2-index-layout .dhb-txt-box-type-b {
        width: 100%;
        margin: 10px 0 20px;
    }
}

/* ----- 게시판 버튼 설정 ----- */

.label {
    background: rgba(0, 0, 0, 0);
    padding: 3px 5px;
    font-size: 90%;
}

.label-danger {
    color: #093889;
    background: #4a89e0;
    color: #fff;
}

.label-primary {
    color: #093889;
}

/* .pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover,
.pagination>.active>span,
.pagination>.active>span:focus,
.pagination>.active>span:hover {
    background-color: #093889;
    border: 1px solid #093889 !important;
}

.pagination>li>a,
.pagination>li>span {
    color: #9D8478;
    border: 1px solid #fff !important;
}

.pagination>li>a:focus,
.pagination>li>a:hover,
.pagination>li>span:focus,
.pagination>li>span:hover {
    color: #9D8478;
} */

.dh-margin-top form#insertForm {
    width: 100%;
    max-width: 100%;
    display: block;
    margin: 0 0 0;
}

.btnRead {
    font-weight: 500;
}

.btn-default,
.btn-primary,
.btn-danger {
    background-image: none;
}

.btn-group,
.btn-group-vertical {
    margin: 10px 0 30px;
}

/* ----- 게시글 뷰 페이지 설정 ----- */

.dh-view-box {
    margin-top: 0px;
}

.sns-box {
    display: none;
}

.dh-view-box>.row>.page-header {
    border-top: 2px solid #000;
    border-bottom: 1px solid #ccc;
    padding: 0 20px;
    margin: 0;
}

.dh-view-box>.row>.page-header>h4 {
    color: #333;
    font-size: 23px;
    margin: 14px 0;
}

.dh-view-box>.row>.dh-view-info {
    border-bottom: 1px solid #ccc;
    background: rgba(0, 0, 0, 0);
    padding: 8px 20px 8px;
    color: #888;
}

.dh-view-box>.row>.dh-view-info>span {
    padding: 0 15px 0 0;
}

.dh-view-box>.row>.dh-view-info>span>strong {
    color: #555;
    padding: 0 5px 0 0;
}

.dh-view-box .dh-attach h6 {
    margin: 0 0 0;
    padding: 5px 5px 0;
}

.dh-view-box>.row:nth-child(2)>div:nth-child(3) {
    padding: 30px 20px 60px !important;
    min-height: 300px;
}

@media screen and (max-width: 991px) {
    /* .dh-board,
    .img-bbs-default-index-layout .page_wrap~div,
    .dh-view-box,
    .form-horizontal,
    #mailForm {
        padding: 60px 15px;
    } */
}

@media screen and (max-width: 767px) {
    /* .dh-board,
    .img-bbs-default-index-layout .page_wrap~div,
    .dh-view-box,
    .form-horizontal,
    #mailForm {
        padding: 40px 15px;
    } */
}

/* 게시판 설정 끝 */

/* 회원가입 */

.login-layout,
.id-find-layout,
.pw-find-layout {
    background: #efefef;
    min-height: 790px;
}

.login-layout .inner-box-wrapper,
.id-find-layout .inner-box-wrapper,
.pw-find-layout .inner-box-wrapper {
    width: 100%;
    max-width: 1170px;
    margin: 0 auto;
    padding: 100px 0 0;
}

.login-layout .inner-box-wrapper,
.id-find-layout .inner-box-wrapper,
.pw-find-layout {
    margin-top: -20px;
}

.join-agree-layout,
.join-layout {
    width: 1170px;
    margin: 0 auto 70px;
}

.join-agree-layout .panel,
.join-layout .panel {
    border: 1px solid #dedede;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
    border-radius: 0;
}

.join-agree-layout .panel-heading,
.join-layout .panel-heading {
    background-image: none !important;
    background-color: #f7f7f7 !important;
}

.join-agree-layout .btn-primary,
.join-layout .btn-primary {
    background-color: #093889 !important;
    border: 0px;
    border-radius: 0;
}

@media screen and (max-width: 991px) {
    .login-layout,
    .id-find-layout,
    .pw-find-layout {
        width: 100%;
        margin: 0;
    }
}

/* 로그인 / 아이디, 비밀번호 찾기 */

.login-layout .panel,
.id-find-layout .panel,
.pw-find-layout .panel {
    border-radius: 8px;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
    border: 1px solid rgba(0, 0, 0, 0);
    min-height: 440px;
    margin: 0;
    padding: 50px 30px 80px;
}

.login-layout .panel-body h2,
.id-find-layout .panel-body h2,
.pw-find-layout .panel-body h2 {
    margin: 0;
    color: #454545;
    font-size: 28px;
    font-weight: 500;
    letter-spacing: 0.01em;
}

.login-layout .inner-box-msg p,
.id-find-layout .inner-box-msg p,
.pw-find-layout .inner-box-msg p {
    font-size: 13px;
    color: #666;
    margin: 0;
}

.login-layout .inner-box-form form label,
.id-find-layout .inner-box-form form label,
.pw-find-layout .inner-box-form form label {
    font-size: 14px;
}

.login-layout .inner-box-form form label.error,
.id-find-layout .inner-box-form form label.error,
.pw-find-layout .inner-box-form form label.error {
    font-weight: 400;
    color: #093889;
    font-size: 12px;
}

.login-layout input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
    background: #fff !important;
    border: 1px solid #d5d5d5;
}

.login-layout .btn-warning,
.id-find-layout .btn-warning,
.pw-find-layout .btn-warning {
    background-image: none;
    background-color: #2a2a2a;
    border: none;
    border-radius: 0;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
    text-shadow: 0 0 0 rgba(0, 0, 0, 0);
    color: #f5f5f5;
}

.login-layout .btn-warning:focus,
.login-layout .btn-warning:hover,
.id-find-layout .btn-warning:focus,
.id-find-layout .btn-warning:hover,
.pw-find-layout .btn-warning:focus,
.pw-find-layout .btn-warning:hover {
    background: #093889;
}

.login-layout form>div>p>a {
    display: inline-block;
    float: left;
    font-size: 12px;
    color: #777;
}

.login-layout form>div>p>a:hover {
    color: #303030;
}

.login-layout form>div>p>a:after {
    content: " | ";
    font-size: 8px;
    padding: 0 8px 0;
    margin: 0;
    color: #d9d9d9;
}

.login-layout form>div>p:last-child>a:after {
    content: "";
}

.id-find-layout .panel-body,
.pw-find-layout .panel-body {
    margin-top: 40px;
}

/*    //sub page 설정 끝     */

/**************서브 페이지 - RESUME *******************/

#resume .content-wrap .con1 {
    margin: 0;
}

#resume .content-wrap .con1>.col-md-12 {
    border-bottom: 1px solid #dedede;
    margin-bottom: 40px;
}

#resume .content-wrap .con1>.col-md-12:last-child {
    border-bottom: none;
    margin-bottom: 0;
}

#resume .content-wrap .con1 p {
    color: #222;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 1;
    margin: 0 0 20px;
}

#resume .content-wrap .con1 ul {
    margin: 0 0 40px;
    padding: 0;
}

#resume .content-wrap .con1 ul li {
    line-height: 2;
    font-weight: 300;
    letter-spacing: -0.04em;
    padding-left: 15px;
    position: relative;
}

#resume .content-wrap .con1 ul li:before {
    content: "";
    background: #ccc;
    width: 5px;
    height: 2px;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -1px;
}

/**************서브 페이지 - work_flow *******************/
#work_flow .content-wrap .con1 p, #project .content-wrap .con1 p, #pro_reperence .content-wrap .con1 p, #qa_contents .content-wrap .con1 p, #validation_con .content-wrap .con1 p, #test_equipment .content-wrap .con1 p, #quality .content-wrap .con1 p, #qualification .content-wrap .con1 p, #csv .content-wrap .con1 p {
    margin-bottom: 30px;
    text-align: center;
    color: #222;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: -0.02em;
}

/**************서브 페이지 - project *******************/

#project .content-wrap .con1 p {
    color: #555;
}

#project .content-wrap .con1 p b {
    color: #0d4da1;
}

#project .content-wrap .con1 dt {
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    letter-spacing: -0.04em;
    background: #093889;
    padding: 12px 0;
    margin-bottom: 20px;
    border-radius: 4px;
}

#project .content-wrap .con1 dd {
    margin-bottom: 5px;
    color: #555;
}

@media(min-width:767px) {
    #project .content-wrap .con1 dd span {
        text-indent: 20px;
        display: block;
    }
}

#project .content-wrap .con1 dd:before {
    content: "";
    width: 5px;
    height: 5px;
    display: inline-block;
    background: #0d4da1;
    margin-bottom: 3px;
    border-radius: 50%;
    margin-right: 5px;
    margin-left: 10px;
}

/**************서브 페이지 - reperence *******************/

/* #pro_reperence .content-wrap .con1 tr {font-size:13px}
#pro_reperence .content-wrap .con1 tr th, #qa_contents .content-wrap .con1 tr th, #validation_con .content-wrap .con1 tr th, #test_equipment .content-wrap .con1 tr th,
#quality .content-wrap .con1 tr th,#qualification .content-wrap .con1 tr th,#csv .content-wrap .con1 tr th {  
    background: #0d4da1;
    color: #fff;}

#pro_reperence .content-wrap .con1 tr td{    
    padding: 10px;}
#pro_reperence .content-wrap .con1 tr td:nth-of-type(2), #validation_con .content-wrap .con1 tr td:nth-of-type(1){  max-width: 300px;} */

/**************서브 페이지 - GMP & QA CONTENTS *******************/
#qa_contents .content-wrap .con1 .col-md-8 p, #validation_con .content-wrap .con1 .col-md-8 p, #quality .content-wrap .con1 .col-md-8 p, #qualification .content-wrap .con1 .col-md-8 p, #csv .content-wrap .con1 .col-md-8 p {
    margin-bottom: 10px;
    text-align: left;
    font-size: 13px;
    color: #444;
    font-weight: 500;
    letter-spacing: -0.04em;
}

/**************서브 페이지 - test_equipment *******************/

#test_equipment .content-wrap .con1 tr td {
    vertical-align: middle;
}

#mailForm {
    max-width: 980px;
}

/*************** 메인 ***************/
.mainPage {
    padding: 120px 0;
    position: relative;
}
.mainPage .tit {
    margin: 0 0 50px;
    text-align: center;
}
.mainPage .tit h2 {
    margin: 0;
    font-size: 42px;
    font-weight: 800;
    line-height: 1em;
    color: #111;
}
.mainPage .tit p {
    margin: 25px 0 0;
    font-size: 20px;
}
.dh-front-blog {
    margin: 0 -10px;
}
.dh-front-blog>.col-md-4 {
    padding: 0 10px;
}
.dh-front-blog>.col-md-4>.thumbnail>a.blogthumb {
    height: 200px;
    border: none;
    border-bottom: 1px solid #ddd;
}
.dh-front-blog>.col-md-4>.thumbnail>.caption {
    padding: 15px;
}
.dh-front-blog>.col-md-4>.thumbnail>.caption h5 {
    font-size: 18px;
    font-weight: 600;
}
.dh-front-blog>.col-md-4>.thumbnail:hover>.caption h5 {
    color: #4d89db;
    border-color: #4d89db;
}
.dh-front-blog>.col-md-4>.thumbnail {
    display: block;
    padding: 0px 20px;
}
.dh-front-blog>.col-md-4>.thumbnail:hover {
    border-color: #4d89db;
    box-shadow: 6px 6px 10px rgba(0, 0, 0, 0.19);
}
.dh-front-blog>.col-md-4>.thumbnail>.caption p {
    width: 100%;
    height: 98px;
    color: #777;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
}
.dh-front-blog>.col-md-4>.thumbnail>a {
    text-decoration: none;
}
.mainPage a.btn {
    width: 160px;
    margin-top: 30px;
    padding: 14px 40px 14px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    letter-spacing: 0.02em;
    background: #999;
    border-radius: 0;
}
.mainPage a.btn:hover {
    background: #387dd8;
}

/*************** 서브 시작 ***************/
/* 공통 스타일 */
#site > .container {
    width: 100%;
    padding: 0;
}
.subPage > .pageTop {
    height: 290px;
    position: relative;
    color: #fff;
    background: #333 url(/skin/img/sub/subTop.jpg) no-repeat center / cover;
}
.subPage > .pageTop::before {
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    display: block;
    background: #000;
    opacity: 0.3;
}
.subPage > .pageTop h2 {
    top: 45%;
    position: relative;
    display: block;
    margin: 0;
    padding-top: 0;
    font-weight: 700;
    font-size: 41px;
    text-align: center;
    transform: translateY(-50%);
}

/* Link */
.link .container .nav {
    margin-top: -33px;
    background: #fff;
    position: relative;
    z-index: 1;
    box-shadow: 3px 3px 9px rgba(0, 0, 0, 0.12);
}
.subPage .link ul > li {
    flex: 1 1 0;
    text-align: center;
}
.subPage .link ul > li > a {
    padding: 23px 5px 23px;
    font-size: 18px;
    font-weight: 700;
    color: #999;
    line-height: 1em;
}
.subPage .link ul > li > a::after {
    content: '';
    top: 50%;
    left: 0;
    width: 1px;
    height: 16px;
    position: absolute;
    display: block;
    background: rgba(0, 0, 0, 0.12);
    transform: translateY(-50%);
}
.subPage .link ul > li:first-child > a::after {
  display: none;
}
.subPage .link ul > li.active > a {
    color: #fff;
    background: #4b89dc;
    font-weight: 700;
}
.subPage .link ul > li > a:hover,
.subPage .link ul > li > a:focus {
    color: #4b89dc;
    background: #fff;
}
.subPage .link ul > li.active > a:hover {
    color: #fff;
    background: #4b89dc;
}
.subPage .link ul > li.active > a::before,
.subPage .link ul > li:not(.active) > a:hover::before,
.subPage .link ul > li:not(.active) > a:focus::before {
    width: 100%;
}

/* Link - Depth 3 */
.link-depth-3 .nav {
    display: flex;
    justify-content: center;
    margin-bottom: 100px;
    margin-top: 10px;
}
.link-depth-3 ul > li {
    margin: 0;
}
.link-depth-3 ul > li > a {
    min-width: 110px;
    padding: 0px 34px;
    color: #777;
    text-align: center;
    border-radius: 30px;
    font-weight: 600;
    font-size: 19px;
    position: relative;
}
.link-depth-3 ul > li > a::before {
    content: '';
    display: block;
    position: absolute;
    width: 1px;
    height: 16px;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: #ccc;
}

.link-depth-3 ul > li:first-child > a::before {
    display:none;
}
.link-depth-3 ul > li > a:hover {background: none;font-weight: 600;}
.link-depth-3 ul > li.active > a {
    color: #000;
    position: relative;
    background: none;
}
.nav>li>a:focus, .nav>li>a:hover {
    background:#fff;
}
.link-depth-3 ul > li.active > a::after {
    content: '';
    display: block;
    position: absolute;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #333;
    top: -14px;
    left: 50%;
    transform: translateY(-50%);
}
/* Breadcrumb */
.subPage .breadcrumb {
    margin: 0 0 60px;
    padding: 0;
    font-size: 13px;
    text-align: right;
    background-color: transparent;
    opacity: 0.9;
    display: none;
}
.subPage .breadcrumb>li+li:before {
    content: "\e258";
    padding: 0 4px;
    font-family: 'Glyphicons Halflings';
    font-size: 10px;
}
.subPage .breadcrumb>li.current {
    font-weight: 600;
}

.breadcrumb>li+li:before {
    padding: 0 2px;
}

.subPage > .contents {
    padding: 100px 0 120px;
}
  
.title-lv-1 {
    margin: 0px 0 100px;
    font-size: 38px;
    font-weight: 700;
    color: #222;
    line-height: 1em;
    text-align: center;
    letter-spacing: -0.015em;
    position: relative;
}
#intro05 .title-lv-1 {
    margin: 0px 0 60px;
}
#intro02 .title-lv-1, #culture .title-lv-1,
#service01 .title-lv-1, #service02 .title-lv-1, #story02 .title-lv-1{
    margin: 0px 0 40px;
}

.list-default {
    margin: 0;
    padding-left: 0;
    list-style-type: none;
}
.list-default > li {
    position: relative;
}
.list-style-1 {
    padding-left: 3px;
}
.list-style-1 > li {
    padding-left: 14px;
    line-height: 1.6;
}
.list-style-1 > li+li {
    margin-top: 25px;
}
.list-style-1 > li::before {
    content: '';
    top: 8px;
    left: 0;
    width: 5px;
    height: 5px;
    position: absolute;
    background: #333;
}
.list-style-2 > li {
    padding-left: 13px;
    font-size: 16px;
    line-height: 1.6;
    color: #222;
}
.list-style-2 > li+li {
    margin-top: 3px;
}
.list-style-2 > li::before {
    content: '';
    top: 12px;
    left: 0;
    width: 5px;
    height: 1px;
    position: absolute;
    background: #333;
}
.list-dash > li {
    padding-left: 12px;
    font-size: 14px;
    color: #555;
    margin-bottom: 3px;
}
.list-dash > li::before {
    content: '-';
    top: 0px;
    left: 0;
    position: absolute;
}

table.tb-default {
    margin-bottom: 0;
}
table.tb-default > thead > tr > th,
table.tb-default > tbody > tr > th,
table.tb-default > tbody > tr > td {
    padding: 16px;
    border-bottom: 1px solid #e3e3e3;
    vertical-align: middle;
}
table.tb-style-1 {
    border-top: 2px solid #387dd8;
}
table.tb-style-1 > thead > tr > th,
table.tb-style-1 > tbody > tr > th,
table.tb-style-1 > tbody > tr > td {
    padding: 16px;
    font-size: 15px;
    line-height: 1.5;
    text-align: center;
}
table.tb-style-1 > thead > tr > th {
    padding: 12px;
    font-size: 15px;
    background: #f3f5f8;
}
table.tb-style-1 > tbody > tr > th {
    background: #f5f6f7;
}

/* 기업소개 (페이지) */
.wrap-intro .box-bg {
    height: 300px;
    background: #333 url(/skin/img/sub/intro01_text_bg.jpg) no-repeat center / cover;
}
.wrap-intro .box-text {
    width: 86%;
    margin: 0 auto;
    margin-top: -55px;
    padding: 65px 15px 0;
    text-align: center;
    background: #fff;
}
.wrap-intro .box-text p {
    margin: 0 0 30px;
    font-size: 18px;
    color: #555;
    line-height: 1.75em;
    font-weight: 400;
}
.wrap-intro .box-text p strong {
    color: #333;
    font-weight: 800;
}

/* 윤리규범 (페이지) */
.text-top {
    margin-bottom: 60px;
    text-align: center;
}
.text-top p {
    font-size: 19px;
    font-weight: 500;
    color: #222;
    line-height: 1.7em;
    margin-bottom: 100px;
}
#intro02 .text-top p {
    margin-bottom: 130px;
}
.box-ethics {
    display: flex;
    gap: 20px;
    margin-top: 110px;
}
.box-ethics > .item {
    flex-basis: 33.333%;
    padding: 30px;
    text-align: center;
    border: 1px solid #d5d5d5;
    border-top: 3px solid #255097;
}
.box-ethics > .item .icon {
    width: 115px;
    height: 115px;
    margin: -92px auto 18px;
    padding-top: 25px;
    color: #fff;
    background: #255097;
    border-radius: 100%;
    border: 7px solid #ffffff;
}
.box-ethics > .item .icon span[class^='material'] {
    font-size: 50px;
}
.box-ethics > .item h4 {
    margin: 0px 0 25px;
    font-size: 21px;
    font-weight: 800;
    color: #154688;
    position: relative;
}
.box-ethics > .item .detail {
    font-size: 16px;
    color: #555;
}
.box-ethics > .item .detail p {
    margin-bottom: 13px;
}

/* 경영이념 (페이지) */
.box-ideology > .item {
    display: flex;
}
.box-ideology > .item+.item {
    margin-top: 30px;
}
.box-ideology > .item .tit {
    flex-basis: 23%;
}
.box-ideology > .item .tit h4 {
    margin: 0;
    padding: 34px 0 0 0;
    font-size: 23px;
    font-weight: 800;
    /* border-top: 2px solid #387dd8; */
    position: relative;
    color: #222;
}
.box-ideology > .item .tit h4::before {
    content: '';
    display: block;
    position: absolute;
    width: 110px;
    height: 1px;
    right: -50px;
    top: 45px;
    border: 1px;
    border-style: dashed;
    border-color: #aaa;
}
.box-ideology > .item .tit h4::after {
    content: '';
    display: block;
    position: absolute;
    width: 20px;
    height: 20px;
    border: 5px solid #cae1fa;
    border-radius: 50%;
    background: #498bda;
    right: -60px;
    top: 36px;
}
.box-ideology > .item .detail {
    flex-basis: 77%;
    padding-left: 50px;
}
.box-ideology > .item .detail .inner {
    padding: 35px 35px;
    background: #f5f7f9;
}
.box-ideology > .item .detail p {
    margin: 0;
    font-size: 16px;
    font-weight: 800;
}
.box-ideology > .item .detail ul li .tit-sub {
    display: block;
    font-weight: 800;
    margin-bottom: 5px;
    font-size: 17px;
}

/* 비전 (페이지) */
.box-vision {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: -15px;
}
.box-vision > .item {
    flex-basis: 33.333%;
    padding: 12px;
}
.box-vision > .item .inner {
    height: 100%;
    padding: 45px 25px 50px;
    text-align: center;
    border: 0;
    background: #255097;
    /* border: 1px solid #154688; */
    position: relative;
    min-height: 384px;
    z-index: 0;
}
.box-vision > .item .inner::before {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url(/skin/img/sub/sub-bg.png);
    bottom: 0;
    right: 0;
    opacity: .05;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: -1;
}
.box-vision > .item span[class^='material'] {
    font-size: 40px;
    font-variation-settings: 'FILL' 1;
    color: #255097;
    background: #fff;
    width: 88px;
    height: 88px;
    border-radius: 50%;
    padding: 24px;
}
.box-vision > .item .tit {
    margin: 25px 0 25px;
    padding-bottom: 25px;
    font-size: 21px;
    font-weight: 800;
    color: #fff;
    border-bottom: 1px solid rgba(219, 226, 236, 0.17);
}
.box-vision > .item p {
    font-size: 15px;
    /* word-break: break-all; */
    color: rgba(255, 255, 255, 0.86);
    margin-bottom: 0;
    letter-spacing: -0.02em;
}

/* 영입 프로세스 (페이지) */
#recruit01 span.material-symbols-outlined {
    margin-top: -80px;
    color: #c9c9d5;
    font-size: 35px;
}
.list-process {
    display: flex;
    max-width: 995px;
    margin: 0 auto;
    gap: 15px;
    align-items: center;
}
.list-process > li {
    flex-basis: 25%;
    min-height: 287px;
}
.list-process > li .circle {
    width: 200px;
    height: 200px;
    margin-bottom: 22px;
    padding-top: 60px;
    color: #fff;
    text-align: center;
    background-color: #222;
    border-radius: 50%;
    position: relative;
    margin-right: 0;
}
.list-process > li .circle::before {
    content: '';
    display: block;
    position: absolute;
    width: 186px;
    height: 186px;
    border-radius: 50%;
    left: 7px;
    top: 7px;
    border: 1px solid rgba(255, 255, 255, 0.31);
}
.list-process > li .circle .no {
    display: block;
    font-size: 20px;
    font-weight: 300;
    margin-bottom: 10px;
    letter-spacing: 0;
}
.list-process > li .circle strong {
    font-size: 22px;
    font-weight: 800;
}
.list-process > li:last-child .circle {
    background: #4b89dc;
}
.list-process > li .info {
    font-size: 15px;
    color: #555;
    line-height: 1.5;
    padding-right: 0px;
    text-align: center;
    position: relative;
    padding-left: 0;
    /* border-left: 1px solid #999; */
    margin-left: 0;
}

#recruit01 .bottom {
    margin-top: 80px;
}
#recruit01 .bottom .box-notice {
    margin: 0 auto;
    max-width: 995px;
    font-size: 14px;
}
#recruit01 .bottom .box-notice+.box-notice {
    margin-top: 40px;
}
#recruit01 .bottom .box-notice .tit {
    margin: -1px 0 11px;
    font-size: 17px;
    font-weight: 800;
    color: #387dd8;
}
#recruit01 .bottom .box-notice ul li .sm {
    color: #777;
}

/* 서비스 공통 스타일 */
.service-top {
    margin-bottom: 100px;
    /* padding: 30px; */
    /* background: #f5f5f5; */
    text-align: center;
    line-height: 1.65em;
}
.service-top .tit {
    margin: 0 0 20px;
    font-size: 20px;
    font-weight: 600;
    color: #4e89d7;
}
.service-top p {
    font-size: 19px;
    font-weight: 500;
    color: #222;
    line-height: 1.7em;
    /* padding: 0 180px; */
}
.service-top p:last-child {
    margin-bottom: 0;
}
#service01 img {
    max-width: 780px;
}
/* 시험장비 보유현황 (페이지) */
p.tb-notice {
    margin: 0 0 15px;
    font-size: 15px;
    text-align: left;
    color: #222;
    position: relative;
    padding-left: 12px;
}
p.tb-notice::before {
    content: '';
    display: block;
    position: absolute;
    width: 3px;
    height: 3px;
    background: #333;
    left: 0;
    top: 10px;
    border-radius: 50%;
}
/* REFERNECES (페이지) */
#story01 table.tb-style-1 > thead > tr > th:nth-child(2),
#story01 table.tb-style-1 > thead > tr > th:nth-child(3) {
    width: 22%;
}
#story01 table.tb-style-1 > thead > tr > th:nth-child(4) {
    width: 10%;
}
#story01 table.tb-style-1 > thead > tr > th:nth-child(6) {
    width: 24%;
}
#story01 table.tb-style-1 > tbody > tr > td {
    font-size: 14px;
    text-align: left;
}
#story01 table.tb-style-1 > tbody > tr > td:first-child {
    text-align: center;
}

/* 커뮤니케이션 (페이지) */
.box-comm {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 100px;
    margin-top: -35px;
    padding: 45px 45px;
    background: #fff;
    position: relative;
    z-index: 1;
    box-shadow: 3px 3px 12px rgba(0, 0, 0, 0.09);
}
.box-comm p {
    font-size: 20px;
    font-weight: 800;
    margin-bottom: 0;
}
.box-comm .sns ul {
    display: flex;
    gap: 12px;
}
.box-comm .sns ul li img {
    width: 35px;
}
.box-comm .sns ul li a:hover img {
    opacity: 0.8;
}

/* 문의하기 (주문폼) */
#contact01 .board-area {
    padding: 45px;
    background: #f5f5f5;
}
#contact01 .board-area .q_number:nth-child(1) {
    float: left;
    position: relative;
    margin-bottom: 30px;
    z-index: 100;
}
#contact01 .board-area .q_number:nth-child(1) > div {
    width: auto;
    display: inline-block;
}
#contact01 .board-area .q_number:nth-child(1) h3 {
    margin: 9px 0 0;
}
#contact01 .board-area .q_number:nth-child(1) .radio label+label {
    margin-left: 15px;
}
#contact01 .board-area .q_number:nth-child(1) .radio label input {
    margin-top: 5px;
}
#contact01 .board-area .q_number input:not(.file_name),
#contact01 .board-area .q_number .input-group {
    margin-top: 5px;
}
#contact01 .board-area .q_number#privacy {
    float: left;
    width: 100%;
    margin: 40px 0 30px;
}
#contact01 .board-area .q_number#privacy .checkbox label {
    color: #333;
}
#contact01 .board-area .q_number#privacy .checkbox input {
    top: 5px;
}
#contact01 .board-area .q_number#privacy .warning {
    padding: 0 10px 0 0;
    font-size: 14px;
    font-weight: 600;
    text-align: right;
    color: #ff0000;
}
#contact01 .board-area .q_number#privacy .warning span {
    top: 5px;
    position: relative;
    font-size: 19px;
    font-weight: 600;
}

/* 문의하기 (주문폼) */
.box-contact .root_daum_roughmap {
    width: 100%;
}
.box-contact .bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 30px 35px;
    /* margin: 0 100px;
    margin-top: -35px;
    padding: 45px 45px; */
    background: #fff;
    position: relative;
    z-index: 1;
    box-shadow: 3px 3px 12px rgba(0, 0, 0, 0.09);
}
.box-contact .bottom img {
    height: 50px;
}
.box-contact .bottom p {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
}

.dh-board>.table-hover th {
    background: #ffffff;
}
.dh-board .table-hover th, .dh-board .table-hover td {
    padding: 15px;
    border-bottom:1px solid #ddd;
    font-size: 16px;
    font-weight: 400;
    color: #555;
}
.dh-board .table-hover th {
    font-weight: 600;
    color: #333;
}
.dh-board * a {
    color: #333;
    text-decoration: none;
    margin: 3px 0;
    font-weight: 400;
}
.dh-board .table-hover {
    border-top: 2px solid #333;
    border-bottom: 1px solid #ddd;
}

.dh-board>.table-hover {
	margin: 0;
}

.dh-view-box {
	margin: 0 auto 100px;
	width: 100%;
	max-width: 1170px;
	padding-left: 30px;
	padding-right: 30px;
}
.dh-view-box.dh-margin-topx2 {
    margin-bottom: 100px;
}
.dh-board>.table-hover,
.dh-view-box {
	margin: 0px auto 80px;
}

.dh-view-box .row > .dh-attach + div {
	padding: 20px !important;
	font-size: 16px;
}

.dh-view-box>.row>.page-header {
    border-top: 2px solid #333;
    border-bottom: 1px solid #ddd;
    margin: 0;
    padding: 35px 0px;
    text-align: center;
}
.dh-view-box>.row>.dh-view-info .pull-right {
    display: none;
}
.dh-view-box>.row>.dh-view-info {
    background: #fff;
    text-align: center;
    padding: 15px 0 14px;
}
.dh-view-box>.row>.dh-view-info span {
    font-size: 14px;
}
.dh-view-box>.row>.page-header h4 {
    font-size: 24px;
}
.login-layout .inner-box {
    max-width: 1170px;
    margin: 30px auto 80px;
}

.login-layout .btn-warning {
    background: #d90d27;
    border: 1px solid #d90d27;
    box-shadow: none;
    border-radius: 0px;
}

.text-danger {
    margin-top: 8px;
    font-size: 14px;
}
/* 게시판 하단 페이지, 검색 영역 */
.input-group button, .input-group input,
.btn-group .btn{
    background: #f8f8f8;
    border: 1px solid #ccc;
    border-radius: 0;
    box-shadow: none;
    color: #565656;
    text-shadow: none;
}
.input-group button:hover, .input-group button:focus, 
.input-group input:hover,.input-group input:focus {
    border-color: #aaa;
    background: #f8f8f8;
    color: #565656;
}
.input-group .form-control {
    background: #fff;
    border-right: none;
}
.input-group .form-control:hover,.input-group .form-control:focus{
	background: #fff;
}
.pagination>.active>a, .pagination>.active>span{
    background: #fff;
    color: #387dd8;
    font-weight: 600;
    border: 1px solid #ccc;
}
.pagination>.active>a:focus, .pagination>.active>a:hover, 
.pagination>.active>span:focus, .pagination>.active>span:hover{
	border:1px solid #aaa;
	border-bottom:1px solid #aaa !important;
	background: #fff;
    color: #387dd8;
}
.pagination li a {
    border-radius: 0 !important;
    border: 1px solid #ccc;
    margin-right: 9px;
    background: #fff;
}
.pagination li a:hover,
.pagination li a:focus{
    border:1px solid #aaa;
	border-bottom:1px solid #aaa !important;
    background: #fff;
}
button#btnNew {
    background: #565656;
    border: 1px solid #4a4a4a;
    color: #fff;
}

/* 카테고리 */
.dh-board > .form-group {
    margin-bottom: 30px;
    text-align: right;
}
.dh-board > .form-group .form-control {
    border-radius: 0;
}

/* 블로그A 게시판 */
.dhb-txt-box {
    position: relative;
    margin: 0;
    padding: 0;
    background: transparent;
    border: none;
}
.dhb-txt-box+.dhb-txt-box {
    padding-top: 45px;
}
.dhb-txt-box .dhb-txt-list {
    width: 100%;
    max-height: unset;
    border:none;
    box-shadow: none;
    -webkit-box-shadow: none;
    
}
#culture .dhb-txt-box .dhb-txt-list, #recruit02 .dhb-txt-box .dhb-txt-list{
    padding: 0 35px;
    border: 1px solid #ddd;
}
#culture .dhb-txt-box .dhb-txt-list:hover h4 a, #recruit02 .dhb-txt-box .dhb-txt-list:hover h4 a{
    color:#488add;
}
#culture .dhb-txt-box .dhb-txt-list:hover, #recruit02 .dhb-txt-box .dhb-txt-list:hover{
    border-color: #488add;
    box-shadow: 6px 6px 10px rgba(0, 0, 0, 0.19);
}
#intro05 .dhb-txt-box .dhb-txt-list {
    padding: 30px 45px;
    background: #fff;
    border: 1px solid #eee;
    border-left: 1px solid #387dd8;
}
.dhb-txt-box .dhb-txt-list .row > div:nth-child(1) {
    width: 22%;
    padding: 0;
}
.dhb-txt-box .dhb-txt-list .row > div:nth-child(2) {
    width: 78%;
    padding: 0 0 0 45px;
}
#culture .dhb-txt-box .dhb-txt-list .row > div:nth-child(2), #recruit02 .dhb-txt-box .dhb-txt-list .row > div:nth-child(2) {
    border-top: 1px solid #ddd;
}
.bbs-blog-index-layout .dhb-txt-box .text-right {
    display: none;
}
.dhb-txt-box .dhb-txt-list .thumb-hidden {
    max-height: unset;
    border: 0;
    box-shadow: none;
}
#story02 .dhb-txt-box .dhb-txt-list .thumb-hidden {
    border: 1px solid #ddd;
}

/* 히스토리 (블로그A 게시판) */
#intro05 .dhb-txt-box {
    padding: 0 0 0 120px;
}
#intro05 .dhb-txt-box+.dhb-txt-box {
    padding-top: 35px;
}
#intro05 .dhb-txt-box::before {
    content: '';
    top: 0;
    left: -1px;
    height: 100%;
    position: absolute;
    border: 5px solid #f5f5f5;
}
#intro05 .dhb-txt-box .dhb-txt-list::before {
    content: '';
    top: 50%;
    left: -123px;
    width: 12px;
    height: 12px;
    position: absolute;
    background: #387dd8;
    border: 0;
    border-radius: 30px;
    transform: translateY(-50%);
    z-index: 1;
}
#intro05 .dhb-txt-box .dhb-txt-list::after {
    content: '';
    display: block;
    position: absolute;
    height: 1px;
    width: 116px;
    background: #387dd8;
    left: -117px;
    top: 50%;
}
#intro05 .dhb-txt-box .dhb-txt-list h4 {
    margin: 20px 0 20px;
}
#intro05 .dhb-txt-box .dhb-txt-list h4 a {
    font-size: 19px;
    font-weight: 600;
}
#intro05 .dhb-txt-box .dhb-txt-list h5 {
    height: 20px;
    text-overflow: ellipsis;
    overflow: hidden;
}
#intro05 .dhb-txt-box .dhb-txt-list h5 a {
    white-space: nowrap;
    font-size: 16px;
    color: #777;
}

/* 지캣 문화 (블로그A 게시판) */
/* 어떻게 일해요? (블로그A 게시판) */
#culture .dh-board,
#recruit02 .dh-board {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -10px;
}
#culture .dh-board > *,
#recruit02 .dh-board > * {
    flex-basis: 100%;
}
#culture .dhb-txt-box,
#recruit02 .dhb-txt-box {
    width: 33.333%;
    flex-basis: 33.333%;
    margin-bottom: 20px;
    padding: 0 10px;
}
#culture .dhb-txt-box .dhb-txt-list .row > div,
#recruit02 .dhb-txt-box .dhb-txt-list .row > div {
    width: 100%;
    padding: 10px 0;
    background: #fff;
}
#culture .dhb-txt-box .dhb-txt-list h4,
#recruit02 .dhb-txt-box .dhb-txt-list h4 {
    margin: 0;
    font-size: 17px;
}
#culture .dhb-txt-box .dhb-txt-list h4 a,
#recruit02 .dhb-txt-box .dhb-txt-list h4 a {
    width: 100%;
    height: 20px;
    display: inline-block;
    font-weight: 700;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin: 15px 0;
}
#culture .dhb-txt-box .dhb-txt-list h4 small,
#recruit02 .dhb-txt-box .dhb-txt-list h4 small {
    display: none;
}
#culture .dhb-txt-box .dhb-txt-list h5,
#recruit02 .dhb-txt-box .dhb-txt-list h5 {
    margin: 0;
}
#culture .dhb-txt-box .dhb-txt-list h5 a,
#recruit02 .dhb-txt-box .dhb-txt-list h5 a {
    width: 100%;
    height: 100px;
    font-size: 14px;
    color: #555;
    line-height: 1.3em;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    line-height: 1.4;
    margin-bottom: 15px;
}

/* REFERNECES (블로그A 게시판) */
#story02 .dh-board {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -10px;
}
#story02 .dh-board > * {
    flex-basis: 100%;
    margin-right: 0;
    margin-left: 0;
}
#story02 .dhb-txt-box {
    width: 50%;
    flex-basis: 50%;
    margin-bottom: 45px;
    padding: 0 10px;
}
#story02 .dhb-txt-box .dhb-txt-list .row > div:nth-child(1) {
    width: 35%;
}
#story02 .dhb-txt-box .dhb-txt-list .row > div:nth-child(2) {
    width: 65%;
    padding: 0 0 0 30px;
}
#story02 .dhb-txt-box .dhb-txt-list h4 {
    margin: 0 0 15px;
    display: flex;
    gap: 7px;
    align-items: center;
}
#story02 .dhb-txt-box .dhb-txt-list h4 a {
    font-weight: 800;
}
#story02 .dhb-txt-box .dhb-txt-list h5 a {
    font-weight: 500;
    color: #555;
    line-height: 1.6em;
}









/**************** 서브 끝 ****************/

/*********** 모바일 최적화 시작 ***********/
@media (max-width: 767px) { /* Small devices (col-xs-*) 모바일 */
    .body-layout{font-size:15px}
    p{line-height:1.5em}
    .prepare-page{padding:35px 20px}
    .prepare-page > .exclamation{width:70px;height:70px}
    .prepare-page > .exclamation::before{font-size:38px}
    .prepare-page > h4{margin:15px 0 17px;font-size:24px}

    .navbar-brand{margin:0 !important}
    .navbar-brand img{width:146px;height:38px}
    .navbar-nav{margin:0 -15px}
    .navbar-inverse > .container{padding:0 15px}
    .navbar-inverse .navbar-nav > li > a{padding:10px 20px;font-size:16px;font-weight:700}
    .navbar-inverse .navbar-nav > .open > a,
    .navbar-inverse .navbar-nav>.open>a:focus,
    .navbar-inverse .navbar-nav>.open>a:hover{color:#fff !important;background:#4c89df}
    .navbar-nav .open .dropdown-menu{padding:10px 0;background:#f8f8f8}
    .navbar-inverse .navbar-nav .open .dropdown-menu > li > a{margin:0;padding:6px 25px;font-size:15px;color:#333 !important;text-align:left;border:none}
    .navbar-inverse .navbar-nav .open .dropdown-menu>li>a:focus,
    .navbar-inverse .navbar-nav .open .dropdown-menu>li>a:hover{font-weight:600;color:#000}
    .navbar-inverse .navbar-toggle{margin:19px 15px;padding:7px 8px;background:#4c89df;border-color:#4c89df}
    .navbar-inverse .navbar-toggle:focus,
    .navbar-inverse .navbar-toggle:hover{background-color:#4c89df}

    .mainPage{padding:60px 0}
    .mainPage .tit{margin:0 0 30px}
    .mainPage .tit h2{font-size:32px}
    .mainPage .tit p{margin:20px 0 0;font-size:17px}
    .dh-front-blog > .col-md-4 > .thumbnail{padding:0 15px}
    .dh-front-blog > .col-md-4 > .thumbnail > a.blogthumb{height:170px}
    .dh-front-blog > .col-md-4 > .thumbnail > .caption h5{font-size:16px}
    .dh-front-blog > .col-md-4 > .thumbnail > .caption p{height:auto;-webkit-line-clamp:3}

    .footer_copy .text-center{padding:30px 0}
    .footer-wrap ul > li{margin-right:10px;font-size:12px;line-height:22px}
    .footer-wrap ul > li+li{margin-left:0}
    .footer-wrap ul > li.copy{font-size:10px}

    .subPage > .pageTop{height:160px}
    .subPage > .pageTop h2{top:50%;font-size:35px}
    .link .container .nav{margin-top:15px}
    .subPage .link ul > li > a{padding:15px;font-size:15px}
    .subPage .link ul > li+li > a{border-top:1px solid #eee}
    .subPage .link ul > li > a::after{display:none}
    .subPage > .contents{padding:60px 0 80px}
    .link-depth-3 .nav{flex-wrap:wrap;margin:-12px -12px 50px}
    .link-depth-3 ul > li{flex:1 1 33.333%}
    .link-depth-3 ul > li > a{min-width:unset;padding:12px;font-size:16px}
    .link-depth-3 ul > li.active > a::after{top:0}
    .title-lv-1{margin:0 0 60px;font-size:32px}
    .list-style-1{padding-left:0}
    .list-style-1 > li{padding-left:12px;line-height:1.5}
    .list-style-1 > li+li{margin-top:20px}
    .list-style-2 > li{padding-left:11px;font-size:15px;line-height:1.5}
    .list-style-2 > li::before{top:10px}
    table.tb-style-1 > thead > tr > th,
    table.tb-style-1 > tbody > tr > th,
    table.tb-style-1 > tbody > tr > td{padding:12px;font-size:14px}
    table.tb-style-1 > thead > tr > th{padding:8px;font-size:14px}
    p.tb-notice{padding-left:10px;font-size:14px}
    p.tb-notice::before{top:8px}
    .text-top p{margin-bottom:50px;font-size:18px;line-height:1.6em}

    .wrap-intro .box-bg{height:200px}
    .wrap-intro .box-text{width:100%;margin-top:35px;padding:0}
    .wrap-intro .box-text p{margin:0 0 20px;font-size:16px;line-height:1.65em}
    .wrap-intro .box-text p strong{display:inline-block;padding-bottom:3px}
    #intro02 .text-top p{margin-bottom:50px}
    .box-ethics{flex-wrap:wrap}
    .box-ethics > .item{flex-basis:100%;padding:15px}
    .box-ethics > .item+.item{margin-top:45px}
    .box-ethics > .item .icon{width:95px;height:95px;margin:-65px auto 18px;padding-top:22px;border-width:5px}
    .box-ethics > .item .icon span[class^='material']{font-size:45px}
    .box-ethics > .item h4{margin:0 0 20px;font-size:20px}
    .box-ethics > .item .detail p{margin-bottom:10px}
    .box-ideology > .item{flex-direction:column}
    .box-ideology > .item .tit h4{padding:0 0 15px;font-size:21px}
    .box-ideology > .item .tit h4::before,
    .box-ideology > .item .tit h4::after{display:none}
    .box-ideology > .item .detail{padding-left:0}
    .box-ideology > .item .detail .inner{padding:20px}
    .box-ideology > .item .detail p{font-size:15px}
    .box-ideology > .item .detail ul li .tit-sub{font-size:16px}
    .box-vision{flex-direction:column}
    .box-vision > .item .inner{min-height:auto;padding:30px 15px 35px}
    .box-vision > .item .inner::before{background-size:cover;background-position:50% 100%}
    .box-vision > .item span[class^='material']{width:78px;height:78px;padding:22px;font-size:35px}
    .box-vision > .item .tit{margin:20px 0;padding-bottom:20px;font-size:19px}
    .list-process{flex-direction:column}
    .list-process > li{width:100%;min-height:auto}
    .list-process > span[class^='material']+li{margin-top:-10px}
    #recruit01 span[class^='material']{margin-top:-10px;font-size:30px;transform:rotate(90deg)}
    .list-process > li .circle{display:flex;width:100%;height:auto;margin-bottom:0;padding:25px 25px 10px;border-radius:10px}
    .list-process > li .circle::before{width:calc(100% - 12px);height:calc(100% - 12px);border-radius:10px}
    .list-process > li .circle .no{padding-top:2px;padding-right:8px;font-size:18px}
    .list-process > li .circle strong{font-size:20px}
    .list-process > li .info{padding:15px 10px 0}
    #recruit01 .bottom{margin-top:40px}
    #recruit01 .bottom .box-notice+.box-notice{margin-top:25px}
    #recruit01 .bottom .box-notice .tit{font-size:16px}
    .service-top{margin-bottom:50px}
    .service-top .tit{margin:0 0 15px;font-size:18px}
    .service-top p{font-size:16px}
    #service01 img{max-width:-webkit-fill-available}
    .box-comm{flex-direction:column;margin:35px 0 0;padding:20px}
    .box-comm p{margin-bottom:15px;font-size:18px}
    .box-contact .root_daum_roughmap{height:300px}
    .box-contact .bottom{flex-direction:column}
    .box-contact .bottom img{height:40px;margin-bottom:15px}
    .box-contact .bottom p{font-size:16px;text-align:center}

    .dhb-txt-list{padding:0 15px}
    .dhb-txt-list > .row div{padding:0;overflow:hidden}
    .dhb-txt-box .thumb-hidden a{height:250px;margin:0}
    .dhb-txt-box .thumb-hidden img{top:50%;left:50%;position:absolute;transform:translate(-50%, -50%)}
    .dhb-txt-box h4 .btnRead{min-height:auto;font-size:14px}
    .dh-board .pagination{margin:0;position:relative;left:50%;transform:translateX(-50%)}
    .dh-board > .table-hover td,
    .dh-board > .table-hover th{padding:8px !important;font-size:13px !important}
    .dh-board > .table th.writer,
    .dh-board > .table th.hits,
    .dh-board > .table td.writer,
    .dh-board > .table td.hits{display:none}
    .dh-board > .table-hover th.num{white-space:nowrap}
    .dh-board > .table-hover tr .num{width:3% !important}
    .bbs-list-index-layout .dh-board .table tr .regdate{width:3%}
    .dh-board > .table-hover td.regdate{font-size:12px !important;white-space:nowrap}
    .bbs-list-index-layout .dh-board .subject > strong > a{font-size:13px}
    .dh-view-box{margin:0 0 60px;padding:0}
    .bbs-list-view-layout+div.row,
    .bbs-blog-view-layout+div.row{margin-bottom:0}
    .bbs-blog-view-layout .dh-view-box,
    .bbs-list-view-layout .dh-view-box{margin:0;padding:0 15px}
    .dh-view-box > .row{padding:0}
    .dh-view-box > .row > .page-header{padding:20px 10px}
    .dh-view-box > .row > .page-header > h4{font-size:18px;line-height:1.35em}
    .dh-view-box > .row > .dh-view-info{padding:10px 0 9px}
    .dh-view-box > .row > .dh-view-info > span{padding:0 5px 0 0;font-size:12px}

    #intro05 .dhb-txt-box{padding:0 0 0 30px}
    #intro05 .dhb-txt-box::before{border-width:3px}
    #intro05 .dhb-txt-box .dhb-txt-list{padding:0 30px 10px}
    #intro05 .dhb-txt-box .dhb-txt-list::before{left:-35px;width:10px;height:10px}
    #intro05 .dhb-txt-box .dhb-txt-list::after{left:-33px;width:33px}
    .dhb-txt-box .dhb-txt-list .row > div{width:100% !important;overflow:visible}
    .dhb-txt-box .dhb-txt-list .row > div:nth-child(1) img{width:200px;margin:0 auto;position:static;transform:none}
    .dhb-txt-box .dhb-txt-list .row > div:nth-child(2){padding:0}
    #intro05 .dhb-txt-box .dhb-txt-list h4{margin:0}
    #intro05 .dhb-txt-box .dhb-txt-list h4 a{font-size:16px}
    #intro05 .dhb-txt-box .dhb-txt-list h5 a{font-size:15px}
    #culture .dh-board,
    #recruit02 .dh-board{flex-direction:column;margin:0}
    #culture .dhb-txt-box,
    #recruit02 .dhb-txt-box{width:100%;padding:0}
    #culture .dhb-txt-box .dhb-txt-list h5 a,
    #recruit02 .dhb-txt-box .dhb-txt-list h5 a{height:55px;-webkit-line-clamp:3}
    #story02 .dh-board{flex-direction:column;margin:0 -15px}
    #story02 .dhb-txt-box{width:100%;margin-bottom:0;padding:0 15px}
    #story02 .dhb-txt-box+.dhb-txt-box{margin-top:30px}
    #story02 .dhb-txt-box .dhb-txt-list .row > div:nth-child(2){padding:20px 0 0 15px}
    .dh-margin-top{margin-top:50px}
    .q_number div h3{font-size:16px}
    .q_number input{margin:0 0 15px}
    .q_number div:nth-child(n + 2){font-size:14px}
    #contact01 .board-area{padding:15px 10px}
    #contact01 .board-area .q_number:nth-child(1){margin-bottom:10px}
    #contact01 .board-area .q_number:nth-child(1) .radio label{margin:0 15px 5px 0}
    #contact01 .board-area .q_number:nth-child(1) .radio label+label{margin-left:0}
    #contact01 .board-area .q_number#privacy .warning{font-size:13px}
    #contact01 .board-area .q_number#privacy .warning span{font-size:17px}
    #contact01 .board-area .q_number#privacy{margin:30px 0 0}
    .login-layout .inner-box-wrapper {
        padding: 10px;
    }
}
@media (min-width: 768px) { /* Medium·Large·Extra large devices */
    .container .nav{display:flex}
}
@media (min-width: 768px) and (max-width: 1199px) { /* Medium·Large devices */
    .carousel-caption{right:5%;left:5%}
    .list-process{gap:5px}
}
/************ 모바일 최적화 끝 ************/




/* 특화 섹션 (구조 단순화) */
    .g-special { 
        margin-top: 15px; 
        background: #fff7ed; 
        padding: 12px; 
        border-radius: 8px; 
        border: 1px solid #ffedd5; 
        text-align: left; 
    }
    .g-special-title { 
        font-size: 14px; 
        font-weight: 800; 
        color: #c2410c; 
        display: block; 
        margin-bottom: 5px; 
    }
    .g-special-text { 
        font-size: 13px; 
        color: #9a3412; 
        line-height: 1.5; 
    }
    /* 방문자 카운터 섹션 */
.visitor-stat-footer {
    padding: 30px 20px;
    background: #f8fafc;
    text-align: center;
    border-top: 1px solid #e2e8f0;
    font-family: sans-serif;
}

.visitor-stat-label {
    display: block;
    font-size: 13px;
    color: #64748b;
    margin-bottom: 10px;
    font-weight: 600;
    letter-spacing: 1px;
}

/* 카운터 이미지 스타일: 지워짐 방지 및 정렬 */
.visitor-stat-counter img {
    border: 0 !important;
    display: inline-block !important;
    vertical-align: middle;
    /* 이미지가 너무 크게 나오지 않도록 높이 제한 */
    height: 35px; 
}

.footer-copy {
    font-size: 11px;
    color: #cbd5e1;
    margin-top: 15px;
}

/* [공통] 폰트 및 기본 설정 */
#recruit01 { 
    font-family: 'Pretendard', -apple-system, sans-serif; 
    color: #334155; 
    word-break: keep-all; /* 한글 줄바꿈 최적화 */
}

/* [영입 프로세스] 카드 스타일 업그레이드 및 중앙 정렬 강화 */
.list-process { 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    list-style: none; 
    padding: 0; 
    margin: 60px auto; /* 좌우 auto로 중앙 배치 */
    max-width: 1100px; /* 너무 퍼지지 않도록 최대 너비 설정 */
    width: 100%;
}

.list-process > li { 
    flex: 1; /* 모든 카드가 동일한 너비를 가짐 */
    text-align: center; 
    position: relative; 
    min-width: 0; /* flex 레이아웃 붕괴 방지 */
}

.list-process > li .circle { 
    background: #f1f5f9; 
    padding: 30px 20px; 
    border-radius: 15px; 
    border: 1px solid #e2e8f0;
    transition: all 0.3s ease;
    margin: 0 5px; /* 카드 간 미세 간격 */
}

.list-process > li .circle:hover { 
    background: #fff; 
    border-color: #387dd8; 
    box-shadow: 0 10px 20px rgba(56, 125, 216, 0.1); 
    transform: translateY(-5px);
}

.list-process > li .circle .no { 
    display: block; 
    font-size: 14px; 
    font-weight: 800; 
    color: #387dd8; 
    margin-bottom: 8px; 
}

.list-process > li .circle strong { 
    display: block;
    font-size: 19px; 
    color: #0f172a; 
    letter-spacing: -0.5px; 
}

.list-process > li .info { 
    margin-top: 15px; 
    font-size: 14px; 
    color: #64748b; 
    line-height: 1.5; 
    padding: 0 10px;
}

/* [화살표] 중앙 정렬 보정 */
#recruit01 span.material-symbols-outlined {
    color: #cbd5e1;
    font-size: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 40px;
    height: 100px;
    margin-top: -50px;
}

/* [하단 공지/복지] 카드 UI 적용 */
#recruit01 .bottom { 
    margin: 80px auto 0; 
    max-width: 1100px; 
    width: 100%;
}

#recruit01 .bottom .box-notice {
    background: #fff;
    padding: 35px;
    border-radius: 16px;
    border: 1px solid #f1f5f9;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}

#recruit01 .bottom .box-notice + .box-notice { margin-top: 30px; }

#recruit01 .bottom .box-notice .tit {
    margin-bottom: 15px;
    font-size: 18px;
    font-weight: 800;
    color: #387dd8;
    display: flex;
    align-items: center;
}

#recruit01 .bottom .box-notice .tit::before {
    content: '';
    display: inline-block;
    width: 4px;
    height: 16px;
    background: #387dd8;
    margin-right: 10px;
    border-radius: 2px;
}

/* --- 점 정렬 수정 섹션 --- */
#recruit01 .bottom .box-notice ul { list-style: none; padding: 0; margin: 0; }

#recruit01 .bottom .box-notice ul li { 
    font-size: 15px;
    margin-bottom: 10px; 
    line-height: 1.6; 
    position: relative;
    padding-left: 18px; /* 점이 들어갈 공간 확보 */
    color: #475569;
}

/* 처진 점 대신 수직 중앙에 맞춰진 도형 점 생성 */
#recruit01 .bottom .box-notice ul li::before {
    content: '';
    position: absolute;
    left: 4px;
    top: 0.75em; /* 글자 첫 줄의 중간 높이에 고정 */
    transform: translateY(-50%); /* 정확한 수직 중앙 정렬 */
    width: 4px;
    height: 4px;
    background-color: #387dd8;
    border-radius: 50%;
}

#recruit01 .bottom .box-notice ul li .sm { 
    color: #94a3b8; 
    font-size: 13px; 
    margin-left: 5px;
    font-weight: normal;
}

/* [모바일 대응] 기존 세로형 로직 유지 및 최적화 */
@media (max-width: 768px) {
    .list-process { flex-direction: column; gap: 0; margin: 40px auto; }
    .list-process > li { width: 100%; min-height: auto; margin-bottom: 0; }
    
    #recruit01 span.material-symbols-outlined {
        width: 100%;
        height: auto;
        margin: 10px 0 !important;
        transform: rotate(90deg);
        font-size: 30px;
    }

    .list-process > li .circle {
        display: flex;
        align-items: center;
        padding: 20px 25px;
        text-align: left;
        margin: 0;
    }

    .list-process > li .circle .no { margin-bottom: 0; margin-right: 15px; }
    .list-process > li .info { padding: 10px 10px 20px; text-align: left; }
    
    .box-notice { padding: 25px !important; }
}

/* 기업소개 레이아웃 확장 */
.wrap-intro { margin-top: 50px; }

/* 메인 대형 박스 */
.box-intro-premium {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 30px;
    padding: 80px 50px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.03);
    position: relative;
    overflow: hidden;
}

/* 전문성 강조 슬로건 */
.intro-header-group { margin-bottom: 50px; }
.intro-sub-tit { 
    display: inline-block;
    color: #387dd8;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 15px;
}
.intro-main-tit {
    font-size: 34px;
    font-weight: 900;
    color: #0f172a;
    line-height: 1.4;
    letter-spacing: -1px;
}
.intro-main-tit span { color: #387dd8; }

/* 본문 텍스트 */
.intro-body-text {
    font-size: 17px;
    color: #475569;
    line-height: 1.9;
    margin-bottom: 40px;
    word-break: keep-all;
}

/* 프로젝트 실적 기반 핵심 역량 섹션 */
.intro-core-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-top: 60px;
}

.core-card {
    background: #f8fafc;
    padding: 40px;
    border-radius: 20px;
    border: 1px solid #f1f5f9;
    transition: 0.3s;
}
.core-card:hover { transform: translateY(-5px); border-color: #387dd8; }

.core-card h4 {
    font-size: 20px;
    font-weight: 800;
    color: #1e293b;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
}
.core-card h4::before {
    content: '';
    width: 6px;
    height: 6px;
    background: #387dd8;
    border-radius: 50%;
    margin-right: 12px;
}

.core-card p {
    font-size: 15px;
    color: #64748b;
    line-height: 1.7;
    margin: 0;
}

@media (max-width: 991px) {
    .intro-core-grid { grid-template-columns: 1fr; }
    .box-intro-premium { padding: 50px 25px; }
    .intro-main-tit { font-size: 26px; }
}

/* 윤리규범 전용 스타일 */
#intro02 .contents { padding-bottom: 80px; }

/* 상단 도입부 문구 스타일 */
#intro02 .text-top {
    text-align: center;
    margin: 50px auto 60px;
    max-width: 800px;
    padding: 0 20px;
}

#intro02 .text-top p {
    font-size: 18px;
    color: #475569;
    line-height: 1.8;
    word-break: keep-all;
    position: relative;
    display: inline-block;
}

/* 문구 양옆에 은은한 따옴표 포인트 */
#intro02 .text-top p::before,
#intro02 .text-top p::after {
    font-size: 40px;
    color: #cbd5e1;
    position: absolute;
    font-family: serif;
    opacity: 0.5;
}
#intro02 .text-top p::before { content: '“'; left: -30px; top: -10px; }
#intro02 .text-top p::after { content: '”'; right: -30px; bottom: -20px; }


/* 윤리규범 3대 핵심가치 카드 섹션 */
.box-ethics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
    margin-top: 50px;
}

.box-ethics .item {
    background: #ffffff;
    border: 1px solid #f1f5f9;
    border-radius: 20px;
    padding: 40px 30px;
    text-align: center;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* 마우스 호버 효과: 블루 컬러 테두리와 그림자 */
.box-ethics .item:hover {
    transform: translateY(-10px);
    border-color: #387dd8;
    box-shadow: 0 20px 25px -5px rgba(56, 125, 216, 0.1);
}

/* 아이콘 영역 */
.box-ethics .item .icon {
    width: 70px;
    height: 70px;
    background: #f0f7ff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 25px;
    color: #387dd8;
}

.box-ethics .item .icon .material-symbols-outlined {
    font-size: 36px;
}

/* 카드 제목 */
.box-ethics .item h4 {
    font-size: 22px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 20px;
    position: relative;
}

/* 제목 아래 포인터 라인 */
.box-ethics .item h4::after {
    content: '';
    display: block;
    width: 30px;
    height: 3px;
    background: #387dd8;
    margin: 10px auto 0;
    border-radius: 2px;
}

/* 상세 설명 텍스트 */
.box-ethics .item .detail {
    text-align: left; /* 설명은 좌측 정렬이 읽기 편함 */
    width: 100%;
}

.box-ethics .item .detail p {
    font-size: 14.5px;
    color: #64748b;
    line-height: 1.7;
    margin-bottom: 12px;
    word-break: keep-all;
    position: relative;
    padding-left: 15px;
}

/* 설명 문구 앞 작은 dot 포인트 */
.box-ethics .item .detail p::before {
    content: '•';
    position: absolute;
    left: 0;
    color: #387dd8;
    font-weight: bold;
}

/* 반응형 모바일 대응 */
@media (max-width: 991px) {
    .box-ethics { grid-template-columns: 1fr; gap: 20px; }
    #intro02 .text-top { margin-bottom: 40px; }
    #intro02 .text-top p { font-size: 16px; }
}

/* 경영이념 섹션 통합 스타일 */
.box-ideology {
    margin-top: 50px;
}

/* 01. 최상단 메인 이념 섹션 */
.ideology-main-card {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
    border-radius: 30px;
    padding: 60px 40px;
    text-align: center;
    color: #fff;
    margin-bottom: 50px;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.1);
}

.ideology-main-card .label {
    display: inline-block;
    background: rgba(56, 125, 216, 0.2);
    color: #387dd8;
    padding: 8px 20px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 14px;
    margin-bottom: 20px;
    border: 1px solid rgba(56, 125, 216, 0.3);
}

.ideology-main-card h3 {
    font-size: 32px;
    font-weight: 800;
    line-height: 1.5;
    word-break: keep-all;
}

.ideology-main-card h3 span {
    color: #387dd8;
}

/* 02. 하단 2열 상세 이념 그리드 */
.ideology-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.ideology-item {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    padding: 45px 35px;
    height: 100%;
    transition: all 0.3s ease;
}

.ideology-item:hover {
    border-color: #387dd8;
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.05);
}

.ideology-item .icon-box {
    font-size: 40px;
    color: #387dd8;
    margin-bottom: 20px;
}

.ideology-item h4 {
    font-size: 24px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 30px;
    display: flex;
    align-items: center;
}

/* 상세 리스트 스타일 */
.ideology-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.ideology-list li {
    margin-bottom: 25px;
}

.ideology-list li:last-child { margin-bottom: 0; }

.ideology-list .sub-tit {
    display: block;
    font-size: 16px;
    font-weight: 800;
    color: #387dd8;
    margin-bottom: 8px;
}

.ideology-list .sub-desc {
    font-size: 15px;
    color: #475569;
    line-height: 1.6;
    word-break: keep-all;
}

/* 반응형 대응 */
@media (max-width: 991px) {
    .ideology-grid { grid-template-columns: 1fr; }
    .ideology-main-card h3 { font-size: 24px; }
    .ideology-item { padding: 35px 25px; }
}

/* 비전 섹션 최종 보정 스타일 */
#intro04 .box-vision {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 50px;
}

#intro04 .box-vision .item {
    /* 배경색이 확실히 들어가야 흰색 아이콘이 보입니다 */
    background: #387dd8 !important; 
    border-radius: 24px;
    padding: 40px 30px;
    display: flex; /* 가로 배치를 위한 flex */
    flex-direction: column; /* 기본은 세로 방향 */
    align-items: flex-start; /* 왼쪽 정렬 */
    transition: all 0.4s ease;
    border: none;
}

/* 아이콘 스타일 - 왼쪽 상단 고정 */
#intro04 .box-vision .item .material-symbols-outlined {
    font-size: 48px !important;
    color: #ffffff !important; /* 강제 흰색 설정 */
    margin-bottom: 20px;
    display: block !important;
    font-variation-settings: 'FILL' 1; /* 아이콘 내부 채우기 */
}

/* 제목 색상 */
#intro04 .box-vision .item h4.tit {
    font-size: 22px;
    font-weight: 800;
    color: #ffffff !important;
    margin-bottom: 15px;
    line-height: 1.3;
}

/* 설명글 색상 */
#intro04 .box-vision .item p {
    font-size: 15px;
    color: rgba(255, 255, 255, 0.9) !important;
    line-height: 1.6;
    margin: 0;
    word-break: keep-all;
}

/* 5번째 강조 카드 - 가로로 길게 */
@media (min-width: 992px) {
    #intro04 .box-vision .item:nth-child(5) { 
        grid-column: span 2; 
        background: #0f172a !important; /* 도전 카드는 짙은 네이비 */
        flex-direction: row; /* 아이콘과 텍스트 가로 배치 */
        align-items: center;
        gap: 30px;
    }
    #intro04 .box-vision .item:nth-child(5) .material-symbols-outlined { margin-bottom: 0; }
}

@media (max-width: 991px) {
    #intro04 .box-vision { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    #intro04 .box-vision { grid-template-columns: 1fr; }
}


    /* 공통 레이아웃 */
    .gmp-section { padding: 80px 20px; font-family: 'Pretendard', sans-serif; max-width: 1100px; margin: 0 auto; }
    .section-title { font-size: 32px; font-weight: 800; color: #1e293b; text-align: center; margin-bottom: 50px; }
    
    /* 1. Data Integrity 섹션 */
    .di-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 25px; }
    .di-card { padding: 40px 30px; border: 1px solid #e2e8f0; border-radius: 20px; background: #f8fafc; text-align: center; transition: 0.3s; }
    .di-card:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.05); }
    .di-icon { width: 52px; height: 52px; fill: #0056b3; margin-bottom: 20px; }
    .di-card h3 { font-size: 20px; font-weight: 700; color: #0f172a; margin-bottom: 12px; }
    .di-card p { font-size: 15px; color: #64748b; line-height: 1.6; word-break: keep-all; margin: 0; }

    /* 2. Global GMP Trends 섹션 */
    .gmp-trend-bg { background: #f1f5f9; padding: 80px 20px; }
    .trend-wrapper { display: flex; flex-direction: column; gap: 40px; max-width: 1100px; margin: 0 auto; }
    .trend-container { background: #fff; border-radius: 24px; overflow: hidden; display: flex; box-shadow: 0 15px 35px rgba(0,0,0,0.05); min-height: 320px; }
    
    /* 트렌드 이미지 비중 조절 */
    .trend-image { flex: 0.8; min-height: 300px; }
    .trend-content { flex: 1.2; padding: 50px; display: flex; flex-direction: column; justify-content: center; }
    
    .badge { display: inline-block; padding: 5px 14px; border-radius: 20px; font-size: 12px; font-weight: 700; margin-bottom: 15px; text-transform: uppercase; }
    .badge-blue { background: #0056b3; color: #fff; }
    .badge-red { background: #e11d48; color: #fff; }
    
    .trend-content h3 { font-size: 24px; color: #0f172a; font-weight: 800; margin-bottom: 15px; line-height: 1.4; }
    .trend-content p { font-size: 16px; color: #475569; line-height: 1.7; margin-bottom: 25px; }
    .tag-group { display: flex; gap: 8px; flex-wrap: wrap; }
    .tag { font-size: 13px; color: #0056b3; background: #eff6ff; padding: 4px 12px; border-radius: 6px; font-weight: 600; }
    .tag-red { color: #e11d48; background: #fff1f2; }

    /* 3. Freeze Drying 섹션 */
    .fd-header { text-align: center; margin-bottom: 50px; }
    .fd-header p { color: #64748b; font-size: 18px; margin-top: 10px; }
    .fd-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; }
    .fd-item { padding: 35px 25px; border: 1px solid #edf2f7; border-radius: 16px; transition: 0.3s; background: #fff; }
    .fd-item:hover { border-color: #0056b3; box-shadow: 0 10px 20px rgba(0,86,179,0.05); }
    .fd-item .num { font-size: 14px; font-weight: 800; color: #0056b3; margin-bottom: 12px; display: block; letter-spacing: 1px; }
    .fd-item h3 { font-size: 19px; font-weight: 700; margin-bottom: 12px; color: #1a202c; }
    .fd-item p { font-size: 15px; color: #4a5568; line-height: 1.6; margin: 0; }
    .fd-footer { text-align: center; margin-top: 50px; padding: 25px; background: #f8fafc; border-radius: 15px; font-weight: 600; color: #334155; }

    /* 4. Footer */
    .visitor-stat-footer { background: #0f172a; padding: 40px 20px; text-align: center; color: #94a3b8; }
    .visitor-stat-label { font-size: 12px; font-weight: 700; letter-spacing: 2px; color: #387dd8; display: block; margin-bottom: 15px; }
    .visitor-stat-counter { margin-bottom: 20px; }
    .footer-copy { font-size: 14px; opacity: 0.8; }

    /* 반응형 조절 */
    @media (max-width: 850px) {
        .trend-container { flex-direction: column; }
        .trend-image { min-height: 220px; flex: none; }
        .trend-content { padding: 30px; }
    }


    /* 기존 스타일 유지하면서 아래 클래스 추가/수정 */
    .badge-purple { background: #7c3aed; color: #fff; } /* 트렌드 3용 보라색 */
    .tag-purple { color: #7c3aed; background: #f5f3ff; }

    /* 트렌드 이미지 내 워터마크 효과를 위한 스타일 (선택사항) */
    .trend-image.digital-infra {
        background: linear-gradient(rgba(124, 58, 237, 0.1), rgba(124, 58, 237, 0.1)), 
                    url('https://images.unsplash.com/photo-1558494949-ef010cbdcc51?auto=format&fit=crop&q=80&w=800') center/cover no-repeat;
    }

/* GMP 역량 강화 그리드 시스템 전용 스타일 */
.gmp-modern-wrapper {
    max-width: 1100px;
    margin: 0 auto;
    font-family: 'Pretendard', 'Nanum Gothic', sans-serif;
    color: #333;
    padding-bottom: 80px;
}

/* 상단 섹션 */
.gmp-intro {
    text-align: left;
    margin-bottom: 40px;
    padding: 25px;
    background: #fdfdfd;
    border-radius: 15px;
    border: 1px solid #eee;
}
.gmp-intro h2 {
    font-size: 22pt;
    font-weight: 800;
    color: #1a1a1a;
    margin-bottom: 12px;
    letter-spacing: -0.5px;
}
.gmp-intro p {
    font-size: 11pt;
    color: #666;
    line-height: 1.7;
    margin: 0;
}

/* 그리드 레이아웃 */
.program-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
    margin-top: 30px;
}

/* 카드 기본 스타일 */
.program-card {
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 16px;
    padding: 30px;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}

/* 카드 배경 숫자 (신규 반영) */
.program-card .card-number {
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 40pt;
    font-weight: 900;
    color: rgba(46, 125, 50, 0.04);
    line-height: 1;
    z-index: 0;
    pointer-events: none;
    transition: color 0.3s;
}

.program-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 25px rgba(0,0,0,0.07);
    border-color: #2e7d32;
}

.program-card:hover .card-number {
    color: rgba(46, 125, 50, 0.1);
}

/* 왼쪽 강조 라인 */
.program-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 5px; height: 100%;
    background: #eee;
    transition: background 0.3s;
}
.program-card:hover::before {
    background: #2e7d32;
}

/* 내부 콘텐츠 */
.card-tag {
    position: relative;
    z-index: 1;
    display: inline-block;
    font-size: 9pt;
    font-weight: 700;
    color: #2e7d32;
    background: #e8f5e9;
    padding: 4px 12px;
    border-radius: 4px;
    margin-bottom: 18px;
    width: fit-content;
}
.card-title {
    position: relative;
    z-index: 1;
    font-size: 15pt;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 12px;
}
.card-desc {
    position: relative;
    z-index: 1;
    font-size: 10.5pt;
    color: #666;
    margin-bottom: 22px;
    line-height: 1.6;
    flex-grow: 1;
}
.card-curriculum {
    position: relative;
    z-index: 1;
    background: #f9f9f9;
    border-radius: 12px;
    padding: 18px;
}
.curriculum-item {
    display: flex;
    align-items: flex-start;
    font-size: 9.5pt;
    margin-bottom: 7px;
    color: #444;
}
.curriculum-item i {
    color: #2e7d32;
    margin-right: 8px;
    font-style: normal;
    font-weight: bold;
}

/* 반응형 */
@media (max-width: 850px) {
    .program-grid { grid-template-columns: 1fr; }
}



/* GMP Reference Page Modern Style */

/* 전반적인 레이아웃 및 폰트 설정 */
body { 
    background-color: #f4f7f9; 
    margin: 0; 
    padding: 20px; 
}

.ref-modern-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    color: #333;
}

/* 상단 공지사항 박스 */
.tb-notice-modern {
    background: #fff;
    border-left: 5px solid #1a3a5a;
    padding: 15px 20px;
    margin-bottom: 25px;
    font-size: 10.5pt;
    color: #555;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

/* 검색창 영역 */
.ref-search-container {
    margin-bottom: 20px;
    display: flex;
    justify-content: flex-end;
}

.ref-search-container input {
    width: 300px;
    padding: 12px 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 10pt;
    outline: none;
    transition: border-color 0.3s, box-shadow 0.3s;
}

.ref-search-container input:focus {
    border-color: #1a3a5a;
    box-shadow: 0 0 0 3px rgba(26, 58, 90, 0.1);
}

/* 테이블 컨테이너 및 본체 */
.ref-table-wrap {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e1e4e8;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}

.ref-table-modern {
    width: 100%;
    border-collapse: collapse;
}

.ref-table-modern thead {
    background: #1a3a5a;
    color: #fff;
}

.ref-table-modern th {
    padding: 18px 15px;
    font-weight: 600;
    font-size: 10.5pt;
    text-align: center;
}

.ref-table-modern td {
    padding: 15px;
    border-bottom: 1px solid #f0f0f0;
    font-size: 10pt;
    vertical-align: middle;
}

.ref-table-modern tbody tr:hover {
    background-color: #f8fbff;
}

/* 각 셀별 세부 스타일 */
.ref-no { 
    text-align: center; 
    color: #999; 
    font-weight: 600; 
}

.ref-title { 
    font-weight: 700; 
    color: #222; 
    line-height: 1.4; 
    display: block; 
}

.ref-scope { 
    text-align: center; 
}

.ref-scope-badge {
    display: inline-block;
    padding: 3px 10px;
    background: #eef2f7;
    color: #3a5a7a;
    border-radius: 4px;
    font-size: 8.5pt;
    font-weight: 700;
    border: 1px solid #d1d9e6;
    white-space: nowrap;
}

.ref-date { 
    text-align: center; 
    color: #666; 
    font-size: 9pt; 
    line-height: 1.5; 
}

.ref-customer { 
    text-align: center; 
    font-weight: 600; 
    color: #1a3a5a; 
}

.ref-note { 
    color: #666; 
    font-size: 9.5pt; 
    line-height: 1.5; 
    word-break: keep-all; 
}

/* 모바일/태블릿 반응형 대응 */
@media (max-width: 992px) {
    .ref-table-wrap { 
        overflow-x: auto; 
    }
    .ref-table-modern { 
        min-width: 1000px; 
    }
    .ref-search-container input { 
        width: 100%; 
    }
}



/* 홍보 채널 블로그 영역 최적화 스타일 */
.blog-feed-section {
    margin-top: 50px;
    width: 100%; /* 부모 너비를 넘지 않도록 설정 */
}

/* 블로그 카드 그리드 설정 */
.blog-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); /* 최소 너비를 늘려 글자 공간 확보 */
    gap: 25px;
    margin-top: 30px;
}

.blog-card {
    background: #fff;
    border: 1px solid #e1e4e8;
    border-radius: 12px;
    padding: 25px; /* 안쪽 여백을 넓혀서 시원하게 보이게 함 */
    transition: all 0.3s ease;
    text-decoration: none !important;
    display: flex;
    flex-direction: column;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.blog-card:hover {
    box-shadow: 0 12px 24px rgba(0,0,0,0.1);
    transform: translateY(-5px);
    border-color: #1a3a5a;
}

/* 날짜 폰트 크기 조절 */
.blog-card .post-date {
    font-size: 14px; /* 기존보다 크게 조정 */
    color: #888;
    margin-bottom: 12px;
    font-weight: 500;
}

/* 제목 폰트 크기 및 스타일 조절 */
.blog-card .post-title {
    font-size: 19px; /* 제목 크기를 확실히 키움 */
    font-weight: 700;
    color: #222;
    line-height: 1.5;
    margin-bottom: 20px;
    /* 세 줄까지 노출 후 말줄임표 */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 85px; /* 제목 영역 높이 고정으로 카드 높이 통일 */
}

/* 자세히 보기 링크 스타일 */
.blog-card .post-link {
    margin-top: auto;
    color: #1a3a5a;
    font-weight: 700;
    font-size: 15px;
    padding-top: 15px;
    border-top: 1px dashed #eee;
}

/* 모바일 대응 */
@media (max-width: 768px) {
    .blog-grid {
        grid-template-columns: 1fr; /* 모바일에서는 한 줄로 표시 */
    }
    .blog-card .post-title {
        font-size: 17px;
        height: auto;
    }
}




/* 찾아오시는 길 섹션 디자인 */
.box-contact {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    border: 1px solid #e1e4e8;
    margin-bottom: 50px;
}

/* 하단 정보 레이아웃 */
.contact-info-wrapper {
    padding: 50px 40px;
    display: flex;
    align-items: center;
    gap: 50px;
    background: #fff;
}

/* 로고 영역 */
.contact-logo {
    flex: 0 0 auto;
    width: 160px;
    text-align: center;
}

/* 정보 텍스트 영역 */
.contact-details {
    flex: 1;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
    border-left: 1px solid #eee;
    padding-left: 50px;
}

/* 개별 정보 항목 */
.info-item {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* 항목 레이블 (ADDRESS, SUBWAY 등) */
.info-label {
    font-size: 12px;
    color: #1a3a5a;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
    display: flex;
    align-items: center;
}

/* 레이블 옆 포인트 선 */
.info-label::after {
    content: "";
    display: inline-block;
    width: 20px;
    height: 2px;
    background: #1a3a5a;
    margin-left: 8px;
}

/* 본문 텍스트 */
.info-content {
    font-size: 16px;
    color: #333;
    font-weight: 500;
    line-height: 1.6;
    margin: 0;
    word-break: keep-all;
}

.info-content b {
    color: #000;
    font-weight: 700;
}

/* 네이버 지도 버튼 스타일 */
.btn-naver-map {
    display: inline-block;
    margin-top: 10px;
    padding: 8px 16px;
    background-color: #03c75a; /* 네이버 브랜드 컬러 */
    color: #fff !important;
    font-size: 13px;
    font-weight: 600;
    border-radius: 6px;
    text-decoration: none !important;
    transition: background 0.2s ease;
}

.btn-naver-map:hover {
    background-color: #02b350;
}

/* 반응형 모바일 설정 */
@media (max-width: 991px) {
    .contact-info-wrapper {
        flex-direction: column;
        padding: 40px 25px;
        gap: 30px;
    }
    .contact-logo {
        width: 100%;
        border-bottom: 1px solid #eee;
        padding-bottom: 30px;
    }
    .contact-details {
        border-left: none;
        padding-left: 0;
        width: 100%;
    }
}
/* 기존 스타일은 유지하고 아래 버튼 스타일을 추가하거나 덮어씌워 주세요 */

/* 네이버 지도 버튼 스타일 */
.btn-naver-map {
    display: inline-block;
    margin-top: 10px;
    padding: 8px 16px;
    background-color: #03c75a;
    color: #fff !important;
    font-size: 13px;
    font-weight: 600;
    border-radius: 6px;
    text-decoration: none !important;
    transition: background 0.2s ease;
}

/* 문의하기 이동 버튼 스타일 */
.btn-contact-link {
    display: inline-block;
    margin-top: 10px;
    padding: 8px 16px;
    background-color: #1a3a5a; /* 지캣 브랜드 메인 컬러 계열 */
    color: #fff !important;
    font-size: 13px;
    font-weight: 600;
    border-radius: 6px;
    text-decoration: none !important;
    transition: opacity 0.2s ease;
}

.btn-contact-link:hover {
    opacity: 0.9;
}



/* 문의하기 폼 디자인 */
.board-area {
    background: #fff;
    padding: 20px 0;
}

.form-table {
    width: 100%;
    border-top: 2px solid #1a3a5a; /* 포인트 컬러 */
    border-bottom: 1px solid #ddd;
    margin-bottom: 30px;
}

.form-table th {
    width: 20%;
    padding: 20px;
    background: #f9fafb;
    border-bottom: 1px solid #eee;
    font-size: 15px;
    font-weight: 600;
    color: #333;
    text-align: left;
    vertical-align: middle;
}

.form-table td {
    padding: 15px 20px;
    border-bottom: 1px solid #eee;
    vertical-align: middle;
}

/* 라디오 버튼 & 체크박스 세련되게 */
.radio-group label {
    margin-right: 20px;
    cursor: pointer;
    font-weight: 500;
    font-size: 15px;
}

.radio-group input[type="radio"] {
    margin-right: 6px;
    accent-color: #1a3a5a;
}

/* 입력 필드 스타일 */
.form-control-custom {
    width: 100%;
    height: 45px;
    padding: 10px 15px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
    transition: border-color 0.2s;
}

.form-control-custom:focus {
    border-color: #1a3a5a;
    outline: none;
    box-shadow: 0 0 5px rgba(26, 58, 90, 0.1);
}

textarea.form-control-custom {
    height: 150px;
    resize: vertical;
}

/* 개인정보 동의 영역 */
.privacy-box {
    background: #f4f7fa;
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 30px;
}

.privacy-box label {
    font-size: 14px;
    color: #666;
    line-height: 1.6;
    cursor: pointer;
}

.privacy-box input[type="checkbox"] {
    margin-right: 10px;
    accent-color: #1a3a5a;
}

/* 하단 버튼 */
.submit-btn-wrap {
    text-align: center;
    margin-bottom: 50px;
}

.btn-submit {
    display: inline-block;
    padding: 15px 60px;
    background: #1a3a5a;
    color: #fff !important;
    font-size: 18px;
    font-weight: 700;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    transition: background 0.2s;
}

.btn-submit:hover {
    background: #122a42;
}

/* 파일 업로드 커스텀 */
.file-upload-wrapper {
    display: flex;
    gap: 10px;
}

.file-name-display {
    flex: 1;
    background: #f9f9f9;
}

/* 모바일 대응 */
@media (max-width: 768px) {
    .form-table th { width: 30%; padding: 15px 10px; font-size: 13px; }
    .form-table td { padding: 10px; }
    .radio-group label { display: block; margin-bottom: 10px; }
}


/* CTA Section Layout */
.cta-section {
    padding: 100px 0;
    background: linear-gradient(135deg, #1a3a5a 0%, #2c5282 100%);
    text-align: center;
    color: #fff;
    clear: both;
}

.cta-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Text Elements */
.cta-subtitle {
    display: inline-block;
    color: #4fd1c5; /* Point Mint Color */
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 2px;
    margin-bottom: 15px;
    text-transform: uppercase;
}

.cta-title {
    font-size: 36px;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 25px;
    color: #ffffff;
}

.cta-desc {
    font-size: 18px;
    color: rgba(255, 255, 255, 0.8);
    max-width: 700px;
    margin: 0 auto 40px;
    line-height: 1.6;
}

/* CTA Button */
.cta-button-wrap {
    margin-top: 20px;
}

.cta-btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    color: #1a3a5a !important; /* 글자색 강제 유지 */
    padding: 20px 45px;
    border-radius: 50px;
    font-size: 18px;
    font-weight: 700;
    text-decoration: none !important;
    transition: all 0.3s ease;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    cursor: pointer;
}

.cta-btn-primary:hover {
    transform: translateY(-5px);
    background: #4fd1c5;
    color: #fff !important;
    box-shadow: 0 15px 40px rgba(0,0,0,0.3);
}

.cta-btn-primary i {
    font-size: 16px;
    transition: transform 0.3s ease;
}

.cta-btn-primary:hover i {
    transform: translateX(5px);
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .cta-section { padding: 60px 0; }
    .cta-title { font-size: 26px; }
    .cta-desc { font-size: 15px; }
    .cta-btn-primary { 
        padding: 15px 30px; 
        font-size: 16px; 
        width: 100%; 
        max-width: 300px; /* 모바일에서 너무 커지지 않게 제한 */
        justify-content: center; 
    }
}


/* Service Section Layout */
.service-section {
    padding: 80px 0;
    background-color: #f8f9fa;
    clear: both;
}

.service-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.service-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 40px;
}

/* Service Card Style */
.service-card {
    flex: 1;
    min-width: 250px;
    background: #fff;
    padding: 40px 30px;
    border-radius: 12px;
    text-align: center;
    text-decoration: none !important;
    transition: all 0.3s ease;
    border: 1px solid #eee;
    box-shadow: 0 4px 6px rgba(0,0,0,0.05);
}

.service-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.1);
    border-color: #2c5282;
}

/* Icon & Text */
.service-icon {
    width: 70px;
    height: 70px;
    margin: 0 auto 25px;
    background: #eef2f7;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.service-icon i {
    font-size: 30px;
    color: #1a3a5a;
}

.service-card:hover .service-icon {
    background: #1a3a5a;
}

.service-card:hover .service-icon i {
    color: #fff;
}

.service-card h3 {
    font-size: 20px;
    font-weight: 700;
    color: #333;
    margin-bottom: 15px;
}

.service-card p {
    font-size: 15px;
    color: #666;
    line-height: 1.5;
    word-break: keep-all;
}

/* Mobile Responsive */
@media (max-width: 992px) {
    .service-grid { gap: 15px; }
    .service-card { min-width: calc(50% - 15px); }
}

@media (max-width: 576px) {
    .service-section { padding: 50px 0; }
    .service-card { min-width: 100%; }
}



/* GMP 팝업 로직 및 디자인 */

/* GMP 팝업 스타일 시트 */

/* 체크박스 로직 */
#gmp-chk { 
    display: none; 
}

#gmp-chk:checked + .g-ov { 
    display: none; 
}

/* 팝업 배경 및 정렬 (왼쪽 상단 배치) */
.g-ov { 
    position: fixed; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background: rgba(0,0,0,0.6); 
    display: flex; 
    align-items: flex-start; /* 상단 정렬 */
    justify-content: flex-start; /* 왼쪽 정렬 */
    padding: 0px; /* 화면 끝에서의 여백 */
    z-index: 9999; 
    font-family: 'Pretendard', sans-serif; 
}

/* 박스 디자인 (플랫하게 수정됨) */
.g-bx { 
    background: #fff; 
    width: 90%; 
    max-width: 420px; 
    border-radius: 16px; 
    overflow: hidden; 
    /* 그림자를 줄이고 테두리를 강조하여 플랫한 느낌 구현 */
    box-shadow: 0 4px 20px rgba(0,0,0,0.15); 
    border: 1px solid #cbd5e1; 
}

/* 헤더: 신뢰감 있는 다크 블루 */
.g-hd { 
    background: #002d5d; 
    padding: 18px; 
    color: #fff; 
    text-align: center; 
}

.g-hd h3 { 
    margin: 0; 
    font-size: 19px; 
    font-weight: 800; 
    letter-spacing: -0.5px; 
}

/* 본문 */
.g-bd { 
    padding: 20px; 
    color: #333; 
}

/* 베테랑 인력 강조 */
.g-staff { 
    display: flex; 
    gap: 8px; 
    margin-bottom: 15px; 
}

.g-staff-card { 
    flex: 1; 
    background: #f0f7ff; 
    padding: 10px; 
    border-radius: 8px; 
    text-align: center; 
    border: 1px solid #cce3ff; 
}

.g-staff-card span { 
    font-size: 11px; 
    color: #0056b3; 
    font-weight: 700; 
    display: block; 
    margin-bottom: 2px; 
}

.g-staff-card b { 
    font-size: 14px; 
    color: #1e293b; 
}

/* 주요 서비스 & 장점 */
.g-sec-tt { 
    font-size: 14px; 
    font-weight: 800; 
    color: #002d5d; 
    margin-bottom: 8px; 
    display: flex; 
    align-items: center; 
}

.g-sec-tt::before { 
    content: ''; 
    display: inline-block; 
    width: 3px; 
    height: 13px; 
    background: #002d5d; 
    margin-right: 7px; 
}

.g-li { 
    list-style: none; 
    padding: 0; 
    margin: 0 0 15px 0; 
}

.g-li li { 
    font-size: 13.5px; 
    margin-bottom: 6px; 
    padding-left: 18px; 
    position: relative; 
    color: #475569; 
    line-height: 1.5; 
}

.g-li li::before { 
    content: '•'; 
    position: absolute; 
    left: 5px; 
    color: #002d5d; 
    font-weight: bold; 
}

.g-li b { 
    color: #0f172a; 
}

/* 특화 분야 강조 */
.g-special { 
    background: #fff7ed; 
    padding: 12px; 
    border-radius: 8px; 
    border: 1px solid #ffedd5; 
    margin-bottom: 15px; 
}

.g-special-tt { 
    font-size: 13px; 
    font-weight: 800; 
    color: #c2410c; 
    margin-bottom: 4px; 
    display: block; 
}

.g-special p { 
    font-size: 12.5px; 
    color: #9a3412; 
    margin: 0; 
    line-height: 1.4; 
    word-break: keep-all; 
}

/* 푸터 및 닫기 버튼 */
.g-ft { 
    background: #f8fafc; 
    padding: 12px; 
    text-align: center; 
    border-top: 1px solid #e2e8f0; 
}

.g-btn { 
    background: #002d5d; 
    color: #fff; 
    padding: 10px 40px; 
    font-size: 13px; 
    border-radius: 8px; 
    cursor: pointer; 
    font-weight: 700; 
    display: inline-block; 
    transition: background 0.2s; 
}

.g-btn:hover { 
    background: #001a38; 
}

/* 푸터 및 버튼 레이아웃 */
.g-ft { 
    background: #f8fafc; 
    padding: 12px; 
    text-align: center; 
    border-top: 1px solid #e2e8f0; 
    display: flex; 
    justify-content: center; 
    gap: 8px; /* 버튼 사이 간격 */
}

/* 실적 보기 버튼 (밝은 톤) */
.g-btn-link {
    background: #fff;
    color: #002d5d;
    padding: 10px 20px;
    font-size: 13px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 700;
    display: inline-block;
    text-decoration: none;
    border: 1px solid #002d5d;
    transition: all 0.2s;
}

.g-btn-link:hover {
    background: #f0f7ff;
}

/* 팝업 닫기 버튼 (기존 유지) */
.g-btn { 
    background: #002d5d; 
    color: #fff; 
    padding: 10px 30px; 
    font-size: 13px; 
    border-radius: 8px; 
    cursor: pointer; 
    font-weight: 700; 
    display: inline-block; 
    transition: background 0.2s; 
    border: none;
}

.g-btn:hover { 
    background: #001a38; 
}