@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */ 

.sub-sec {margin-bottom:var(--space-110);}
.sub-sec:last-child {margin-bottom:0;}

.sub-tab {margin-bottom:var(--space-50);}
.sub-tab ul {display:flex; flex-wrap:wrap; gap:var(--space-20); justify-content:center;}
.sub-tab ul li a {display:block; padding:var(--space-15) var(--space-30); border-radius:30px; font-size:var(--font-size-20); line-height:1.2em; color:#888; border:1px solid #888;}
.sub-tab ul li a:hover {color:var(--color-primary); border-color:var(--color-primary);}
.sub-tab ul li.active a {color:#fff; background:var(--color-primary); border-color:var(--color-primary);}

.sub-top-text {margin-bottom:var(--space-70); text-align:center;}
.sub-top-text p {font-size:var(--font-size-18); line-height:1.5em; letter-spacing:-0.03em; color:#454545;}

.doc-tit {margin-bottom:var(--space-28);}
.doc-tit h3 {display:flex; align-items:flex-start; gap:var(--space-14); font-size:var(--font-size-32); line-height:1.3em; letter-spacing:-0.03em; color:#2c2c2c;}
.doc-tit h3::before {content:''; flex-shrink:0; margin-top:.2em; width:8px; aspect-ratio:1/1; border-radius:2px; background:#2C2C2C;}
.doc-tit p {margin-top:var(--space-15); font-size:var(--font-size-18); line-height:1.5em; letter-spacing:-0.03em; color:#454545;}

/* 회사소개 */
.greetings {display:flex; gap:var(--space-50); align-items:center; overflow:hidden; color:#454545;}
.greetings .image {flex-shrink:0; width:40%; max-width:445px;}
.greetings .content {flex:1;}
.greetings .title {font-size:var(--font-size-34); line-height:1.35em; letter-spacing:-.03em;}
.greetings .text {margin:var(--space-50) 0 16px; font-size:var(--font-size-18); line-height:1.66em;}
.greetings .sign {font-size:var(--font-size-22); line-height:1.4em;}
.greetings .sign strong {font-weight:600;}
.greetings .sign img {vertical-align:middle;}

.company-overview table {width:100%; border-collapse:collapse; border-spacing:0px; border-top:2px solid #2c2c2c;}
.company-overview table th, 
.company-overview table td {padding:var(--space-20); border-bottom:1px solid #ddd; font-size:var(--font-size-18); line-height:1.5em;}
.company-overview table tbody th {font-weight:600; color:#2c2c2c; background:#F0F3F7;}
.company-overview table tbody td {color:#454545;}

.history {display:flex; flex-direction:column; gap:var(--space-100);}
.history .period-tit {font-size:var(--font-size-32); font-weight:600; letter-spacing:-.03em; color:var(--color-primary); text-align:center; margin-bottom:var(--space-60);}
.history .period-cont {display:flex; gap:var(--space-60); align-items:center;}
.history .period-cont.reverse {flex-direction:row-reverse;}
.history .period-cont .img {width:50%; border-radius:var(--radius-8); overflow:hidden;}
.history .period-cont .img img {width:100%; aspect-ratio:531/340; object-fit:cover;}
.history .timeline {position:relative; width:18px; flex-shrink:0; align-self:stretch;}
.history .timeline::before {content:''; position:absolute; top:5px; bottom:5px; left:50%; width:1px; background:#D1D5DB; transform:translateX(-50%);}
.history .timeline::after {content:''; position:absolute; top:0; left:50%; width:18px; height:18px; border-radius:50%; border:5px solid #eaeaea; background:var(--color-primary); transform:translateX(-50%);}
.history .timeline span {position:absolute; bottom:0; left:50%; width:18px; height:18px; border-radius:50%; border:5px solid #eaeaea; background:var(--color-primary); transform:translateX(-50%);}
.history .info {width:50%; display:flex; flex-direction:column; gap:var(--space-60);}
.history .year-group {display:flex; gap:var(--space-30); align-items:flex-start;}
.history .year-group .year {flex-shrink:0; font-size:var(--font-size-24); font-weight:700; letter-spacing:-.03em; color:#2c2c2c; line-height:26px;}
.history .events {display:flex; flex-direction:column; gap:var(--space-16); flex:1; min-width:0;}
.history .events li {display:flex; gap:var(--space-20); align-items:flex-start; font-size:var(--font-size-18); line-height:1.5; letter-spacing:-.03em; color:#454545;}
.history .events .month {flex-shrink:0; width:23px; font-weight:600;}
.history .events .txt {flex:1; min-width:0;}
.history .period-cont.reverse .info {text-align:right;}
.history .period-cont.reverse .year-group {flex-direction:row-reverse;}
.history .period-cont.reverse .events li {flex-direction:row-reverse;}
.history .period-cont.reverse .events .month {text-align:left;}
.history .period:last-child .period-cont {margin-left:50%;}
.history .period:last-child .info {width:auto;}

.partners {display:grid; grid-template-columns:repeat(6, 1fr); gap:var(--space-40) var(--space-24);}
.partners .item {position:relative; aspect-ratio:180/70; border:1px solid #ddd;}
.partners .item img {display:block; width:100%; height:100%; object-fit:contain;}

.root_daum_roughmap {width:100% !important;}
.root_daum_roughmap .wrap_map {height:clamp(240px, calc(500 / var(--inner) * 100vw), 500px) !important;}
.root_daum_roughmap .cont {display:none !important;}
.map-frame iframe {display:block; width:100% !important; height:clamp(240px, calc(500 / var(--inner) * 100vw), 500px) !important;}
.directions .address-info {padding:24px 0;}
.directions .address-info .addr {color:#2c2c2c; font-size:var(--font-size-24); font-weight:700; line-height:1.33em; letter-spacing:-.03em; margin-bottom:10px;}
.directions .address-info .etc {color:#454545; font-size:var(--font-size-18);}
.directions .address-info .etc span {display:inline-block; margin-right:24px;}
.directions .address-info .etc span:last-child {margin-right:0;}
.directions .contact-info {border-top:1px solid #ddd; font-size:var(--font-size-18); line-height:1.5em;}
.directions .contact-info dl {display:flex; padding:15px 0; border-bottom:1px solid #ddd;}
.directions .contact-info dt {flex-shrink:0; width:130px; color:#2c2c2c; font-weight:600;}
.directions .contact-info dt svg {vertical-align:middle; margin:-.2em 15px 0 0;}
.directions .contact-info dd {color:#454545;}

/* 사업분야 */
.project-hero {position:relative; overflow:hidden; background:rgba(6,53,122,0.05); padding:var(--space-80) 0; margin-top:var(--space-80);}
.project-hero h3 {font-size:var(--font-size-28); font-weight:700; text-align:center; color:#2c2c2c; line-height:1.2; letter-spacing:-.03em; margin-bottom:var(--space-40);}
.project-hero .slider {position:relative;}
.project-hero .slick-slide {padding:0 var(--space-15);}
.project-hero .slick-list {margin:0 calc(var(--space-15) * -1);}
.project-hero .link-item {display:block; text-align:center;}
.project-hero .link-item:hover .thumb img {transform:scale(1.05);}
.project-hero .thumb {border-radius:var(--radius-16); overflow:hidden; aspect-ratio:380/280;}
.project-hero .thumb img {display:block; width:100%; height:100%; object-fit:cover; transition:.4s;}
.project-hero .tit {margin-top:var(--space-16); font-size:var(--font-size-18); line-height:1.5; color:#454545; letter-spacing:-.03em;}
.project-hero .slick-arrow {position:absolute; top:50%; transform:translateY(-100%); z-index:10; width:48px; height:48px; border:1px solid #ddd; border-radius:50%; background:#fff; cursor:pointer; font-size:0; line-height:0; padding:0; transition:.2s; overflow:hidden;}
.project-hero .slick-arrow:hover {border-color:var(--color-primary); background-color:var(--color-primary);}
.project-hero .slick-arrow:hover path {fill:#fff;}
.project-hero .slick-prev {left:-88px;}
.project-hero .slick-next {right:-88px;}

.project-list-wrap {padding-top:var(--space-80);}
.project-list-wrap .board-list table {border-top:1px solid #686868;}
.project-list-wrap .board-list table thead th {font-size:var(--font-size-16); font-weight:700; color:#2c2c2c;}
.project-list-wrap .board-list table tbody td {font-size:14px; color:#454545;}


.business-detail {display:flex; gap:var(--space-60); align-items:center;}
.business-detail .image {flex-shrink:0; width:57%; border-radius:var(--radius-32); overflow:hidden;}
.business-detail .image img {width:100%; aspect-ratio:684/540; object-fit:cover;}
.business-detail .content {flex:1; min-width:0;}
.business-detail h3 {font-size:var(--font-size-36); font-weight:700; line-height:1.28; letter-spacing:-.03em; color:#2c2c2c;}
.business-detail .info-table {margin-top:var(--space-30); display:flex; flex-direction:column; gap:var(--space-10);}
.business-detail .info-table dl {display:flex; gap:var(--space-40); font-size:var(--font-size-16); line-height:1.5em; letter-spacing:-.03em;}
.business-detail .info-table dt {flex-shrink:0; width:120px; font-weight:500; color:#666;}
.business-detail .info-table dd {flex:1; min-width:0; color:#454545;}
.business-detail .btn-list {display:inline-flex; align-items:center; justify-content:center; width:130px; height:42px; margin-top:var(--space-70); border:1px solid #ddd; border-radius:30px; font-size:14px; color:#888;}


.management-policy ul {display:flex; flex-direction:column; gap:var(--space-40);}
.management-policy li {display:flex; gap:var(--space-50); align-items:center; padding:var(--space-50) var(--space-100); border:1px solid #ddd; border-radius:var(--radius-8);}
.management-policy .number {flex-shrink:0; font-size:var(--font-size-42); font-weight:600;}
.management-policy .content {flex:1; min-width:0; display:flex; flex-direction:column; gap:var(--space-10);}
.management-policy .content h4 {font-size:var(--font-size-22); font-weight:600; line-height:1.4em; letter-spacing:-.03em; color:#454545;}
.management-policy .content p {font-size:var(--font-size-18); line-height:1.5em; letter-spacing:-.03em; color:#454545;}
.management-policy .icon {flex-shrink:0; width:48px; height:48px;}

.management-system {display:flex; justify-content:center; align-items:stretch; gap:10px; margin-top:var(--space-40);}
.management-system .image {order:2; flex-shrink:0; width:50%; max-width:532px;}
.management-system .list {display:flex; flex-direction:column; justify-content:space-between; width:20%;}
.management-system .list.left {order:1;}
.management-system .list.right {order:3;}
.management-system dl {display:flex; flex-direction:column; gap:var(--space-15);}
.management-system dt {padding:var(--space-15) var(--space-40); border:1px solid; border-radius:var(--radius-8); font-size:var(--font-size-22); font-weight:600; line-height:1em; text-align:center;}
.management-system dd {font-size:var(--font-size-18); line-height:1.33; color:#454545;}
.management-system .n1 dt {color:#06357a; border-color:#06357a;}
.management-system .n2 dt {color:#516c92; border-color:#516c92;}
.management-system .n3 dt {color:#2b73de; border-color:#2b73de;}
.management-system .n4 dt {color:#3e87bd; border-color:#3e87bd;}


.ethic-declare {display:flex; flex-direction:column; gap:var(--space-30); padding:var(--space-50) var(--space-100); border:1px solid var(--color-primary); border-radius:var(--radius-8); background:rgba(128,166,222,0.08); font-size:var(--font-size-18); line-height:1.67; color:#454545;}
.ethic-declare strong {font-weight:600;}

.ethic-charter {margin-top:var(--space-60); border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
.ethic-charter li {display:flex; gap:var(--space-50); align-items:center; padding:var(--space-60) var(--space-100); border-bottom:1px dashed #ddd;}
.ethic-charter li:last-child {border-bottom:0;}
.ethic-charter .number {flex-shrink:0; font-size:38px; font-weight:600;}
.ethic-charter .txt {flex:1; min-width:0; font-size:var(--font-size-18); line-height:1.33; letter-spacing:-.03em; color:#454545;}
.ethic-charter .icon {flex-shrink:0; width:48px;}

.license-table table {width:100%; border-collapse:collapse; border-spacing:0;}
.license-table table thead th {padding:var(--space-16) 10px; font-size:var(--font-size-20); font-weight:600; line-height:1.3; letter-spacing:-.03em; color:#fff; background:var(--color-primary); text-align:center; border:1px solid #ddd; border-top:0; border-bottom:0;}
.license-table table tbody td {padding:var(--space-16) 10px; font-size:var(--font-size-18); line-height:1.5; letter-spacing:-.03em; color:#454545; text-align:center; border:1px solid #ddd;}
.license-table table tbody td.type {background:#fafafa;}
.license-table tr th:first-child,
.license-table tr td:first-child {border-left:0;}
.license-table tr th:last-child,
.license-table tr td:last-child {border-right:0;}

.license-list-m {display:none; border-top:2px solid #686868;}
.license-list-m li {padding:var(--space-30) var(--space-15); border-bottom:1px solid #ddd;}
.license-list-m .type {display:inline-block; padding:5px 10px; font-size:var(--font-size-16); font-weight:500; line-height:1.3; color:#fff; background:var(--color-primary); border-radius:4px; margin-bottom:8px;}
.license-list-m .tit {display:block; font-size:var(--font-size-22); font-weight:700; color:#2c2c2c; line-height:1.4;}
.license-list-m .info {display:flex; flex-wrap:wrap; gap:var(--space-10) var(--space-40); margin-top:6px; font-size:var(--font-size-16); color:#888; line-height:1.3;}