@charset "utf-8";
/* 서브공통 */
.primary {color: var(--color-primary);}
.strong {display: inline-block; color: #98B6D9;}
.strong2 {display: inline-block; color: #3C76B7;}
.doc-top {text-align: center;}
.doc-top .doc-tit {color: #939598; font-size: var(--font-size-18); font-weight: 700; line-height: 1em; letter-spacing: -0.02em;}
.doc-top .doc-txt {color: var(--color-sub); font-size: var(--font-size-45); font-weight: 700; line-height: 1.244em; letter-spacing: -0.02em; margin-top: var(--space-40);}

/********************* COMPANY *********************/
/* ceo */
.greeting-img {margin-bottom: var(--space-80);}
.greeting-img img {min-height: 200px; object-fit: cover; object-position: center;}
.greeting-txt-box .box1 {flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: space-between;}
.greeting-txt-box .box1 .sub-tit {color:#939598; font-size: var(--font-size-20); font-weight: 700; line-height: 1.7em; letter-spacing: -0.02em; letter-spacing: -0.02em; margin-bottom: var(--space-24);}
.greeting-txt-box .box1 h3 {color: var(--color-sub); font-size: var(--font-size-36); font-weight: 700; line-height: 1.27em; letter-spacing: -0.02em; }
.greeting-txt-box .box1 h3 strong {color: var(--color-primary);}
.greeting-txt-box .box2 {flex: 1; min-width: 0;}
.greeting-txt-box .box2 {font-size: var(--font-size-18); line-height: 1.777em; letter-spacing: -0.02em;}
.greeting-txt-box .box2 p:first-child {margin-bottom: var(--space-24);}
.greeting-txt-box .box2 p strong {color: var(--color-sub); font-weight: 600;}
.greeting-txt-box .box2 .sign {display: flex; gap: var(--space-24); flex-wrap: wrap; align-items: center; font-size: var(--font-size-20); line-height: 1.7em; letter-spacing: -0.02em; margin-top: var(--space-60);}

/* vision-mission */
/* vision */
.vision-section {padding: var(--space-140) 0 var(--space-160); background: url(../images/sub/vision-bg.jpg) no-repeat center / cover;}
.vision-section .contain {max-width: 1260px;}
.vision-section .doc-top .doc-tit {color: rgba(255, 255, 255, 0.50);}
.vision-section .doc-top .doc-txt { color: #fff;}
.vision-card-grid {display:flex; gap:20px; align-items:stretch; justify-content:center; margin-top: var(--space-100);}
.vision-card {display:flex; flex:1 1 0; flex-direction:column; align-items:center; justify-content:center; gap:var(--space-30); padding: var(--space-42) var(--space-33); text-align:center; background:rgba(255,255,255,0.1); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); box-sizing:border-box; min-width:0;}
.vision-card-head {display:flex; flex-direction:column; align-items:center; gap:var(--space-8);}
.vision-card-head::before {content:""; display:block; width:6px; height:6px; border-radius:50%; background:#fff; flex-shrink:0;}
.vision-card-title {margin:0; padding-bottom:4px; border-bottom:1px solid #fff; font-size:var(--font-size-26); font-weight:700; line-height:1.6em; letter-spacing:-0.02em; color:#fff;}
.vision-card-body {font-size:var(--font-size-18); font-weight:400; line-height:1.77em; letter-spacing:-0.02em; color:#e7e7e7;}

/* mission*/
.mission-section {padding: var(--space-120) 0; background:rgba(3, 78, 162, 0.05);}
.mission-step-list {display:flex; flex-direction:column; align-items:center; gap:var(--space-10); width:100%; margin-top: var(--space-80);}
.mission-step {display:flex; align-items:center; gap:var(--space-60); width:100%; max-width:1440px; padding:0; background:#fff; box-sizing:border-box;}
.mission-step-media {position:relative; flex:0 0 37.3%; max-width:537px; min-width:0; aspect-ratio:537 / 345; overflow:hidden;}
.mission-step-media img {position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center;}
.mission-step-media-crop img {object-position:20% 45%;}
.mission-step-text {display:flex; flex:1; flex-direction:column; align-items:flex-start; justify-content:center; gap:var(--space-24); min-width:0; padding:var(--space-20) var(--space-20) var(--space-20) 0;}
.mission-step-head {display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-10);}
.mission-step-num {display:inline-flex; align-items:center; justify-content:center; padding:1px var(--space-16) 0; border-radius:24px; background:var(--color-primary); font-size:var(--font-size-14); font-weight:600; line-height:1.5em; letter-spacing:-0.02em; color:#fff;}
.mission-step-title {margin:0; font-size:var(--font-size-24); font-weight:700; line-height:1.583em; letter-spacing:-0.02em; color:var(--color-sub);}
.mission-step-body {font-size:var(--font-size-18); font-weight:400; line-height:1.777em; letter-spacing:-0.02em; color:#505050;}

/* core values*/
.core-values-section {padding:var(--space-80) 0 var(--space-120);}
.core-values-section .doc-top .doc-txt {font-size: var(--font-size-40);}
.core-slider {padding-left: max(0px, (100% - 1440px) / 2); margin-top:var(--space-60); overflow:hidden;}
.core-values-swiper .swiper-slide {max-width:383px; aspect-ratio:383 / 430;}
.core-slide {position:relative; display:flex; height:100%; flex-direction:column; align-items:center; justify-content:flex-end; padding-bottom:var(--space-30); background: no-repeat center / cover; overflow:hidden;}
.core-slide1 {background-image: url(../images/sub/core1.jpg);}
.core-slide2 {background-image: url(../images/sub/core2.jpg);}
.core-slide3 {background-image: url(../images/sub/core3.jpg);}
.core-slide4 {background-image: url(../images/sub/core4.jpg);}
.core-slide5 {background-image: url(../images/sub/core5.jpg);}
.core-slide-txt {position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--space-8); max-width:100%; padding:0 var(--space-12); text-align:center;}
.core-slide-tit {margin:0; font-size:var(--font-size-28); font-weight:700; line-height:1.5em; letter-spacing:-0.02em; color:#fff;}
.core-slide-desc {font-size:var(--font-size-16); font-weight:400; line-height:1.875em; letter-spacing:-0.02em; color:#fff;}

/* history */
.history-era-grid {display:grid; grid-template-columns:repeat(3, 1fr); gap:20px;}
.history-era {display:flex; flex-direction:column; gap:var(--space-30); min-width:0;}
.history-era-period {margin:0; font-size:var(--font-size-32); font-weight:700; line-height:1.437em; letter-spacing:-0.02em; color:#939598;}
.history-era-body {display:flex; flex-direction:column; gap:var(--space-16); align-items:flex-start;}
.history-era-title {margin:0; font-size:var(--font-size-32); font-weight:700; line-height:1.437em; letter-spacing:-0.02em; color:#001225;}
.history-era-list {list-style:none; margin:0; padding:0; display:flex; flex-direction:column; align-items:flex-start;}
.history-era-list li {display:flex; align-items:center; gap:var(--space-8); position: relative; padding-left: 12px; font-size:var(--font-size-18); font-weight:400; line-height:1.777em; letter-spacing:-0.02em; color:#505050;}
.history-era-list li::before {content:""; position: absolute; left: 0; top: 14px; width:4px; height:4px; border-radius:50%; background:var(--color-primary);}

/* project */
.project-list {display:grid; grid-template-columns:repeat(5, 1fr); gap:var(--space-30);}

/* contact */
.map {margin-bottom: var(--space-44);}
.map iframe {width:100%; height:560px;}
.root_daum_roughmap {width: 100% !important;}
.root_daum_roughmap .wrap_map {height: 560px !important;}
.root_daum_roughmap .wrap_controllers {display: none !important;}
.contact-info h3 {font-size: var(--font-size-36); font-weight:700; line-height:1.388em; letter-spacing:-0.02em; color:var(--color-sub); margin-bottom: var(--space-16);}
.contact-wrap {gap: 10px var(--space-30); flex-wrap: wrap;}
.contact-wrap dl {flex-wrap: wrap; gap: 0 var(--space-24);}
.contact-wrap dl dt {flex-shrink: 0; font-size: var(--font-size-20); font-weight:700; line-height:1.7em; letter-spacing:-0.02em;}
.contact-wrap dl dd {font-size: var(--font-size-18); line-height:1.777em; letter-spacing:-0.02em; margin-top: 2px;}

/********************* BUSINESS *********************/
.business-img-wrap {display:grid; gap:var(--space-20); grid-template-columns:repeat(2, 1fr); margin-bottom: var(--space-120);}
.business-img {position:relative; display:flex; flex-direction:column; justify-content:flex-end; min-width:0; aspect-ratio: 71/48; max-height: 480px; overflow:hidden;}
.business-img .img {position:absolute; inset:0; z-index:0; pointer-events:none;}
.business-img .img img {display:block; width:100%; height:100%; object-fit:cover; object-position:center;}
.business-img-cap {position:relative; z-index:1; display:flex; width:100%; flex-direction:column; align-items:center; justify-content:center; padding:var(--space-24) var(--space-10); box-sizing:border-box; background:rgba(0,0,0,0.56); backdrop-filter:blur(8px);}
.business-img-cap p {margin:0; max-width:100%; font-size:var(--font-size-26); font-weight:700; line-height:1.461em; text-align:center; color:#fff;} 

/* modular */
.business-img-wrap.modularization-img {grid-template-columns:repeat(1, 1fr);}
.modularization-img .business-img2 .business-img-cap {position: absolute; bottom: 0; left: 0;}

/* table */
.business-table-title {margin-bottom: var(--space-40); font-size:var(--font-size-32); font-weight:700; line-height:1.437em; letter-spacing:-0.02em; color:var(--color-sub);}
.business-table {width:100%; border-collapse:collapse; border-spacing:0; background:#fff;border-top:2px solid var(--color-primary);}
.business-table thead th,
.business-table tbody td {border:1px solid #ddd;}
.business-table thead th:first-child,
.business-table tbody td:first-child {border-left:none;}
.business-table thead th:last-child,
.business-table tbody td:last-child {border-right:none;}
.business-table thead th {padding:var(--space-16) var(--space-12); background:#f3f7fb; font-size:var(--font-size-18); font-weight:600; line-height:1.777em; letter-spacing:-0.02em; text-align:center; color:var(--color-primary); border-top:none}
.business-table tbody td {padding:var(--space-16) var(--space-12); font-size:var(--font-size-18); font-weight:400; line-height:1.777em; letter-spacing:-0.02em; text-align:center; color:#505050;}
.business-table tbody td:nth-child(3) {padding: var(--space-16) var(--space-24); text-align:left; white-space:normal; word-break:break-word;}


/********************* R&D *********************/
.campus-item {gap:var(--space-80); padding-bottom: var(--space-70); margin-bottom: var(--space-70); border-bottom: 1px solid #ddd;}
.campus-item:last-child {padding-bottom: 0; margin-bottom: 0; border-bottom: none;}
.campus-title {font-size:var(--font-size-40); font-weight:700; line-height:1.4em; letter-spacing:-0.02em; margin-bottom: var(--space-40);}
.campus-txt .address {color:var(--color-sub); font-size:var(--font-size-20); font-weight:600; line-height:1.7em; letter-spacing:-0.02em; margin-bottom: var(--space-24);}
.campus-info li {position: relative; padding-left: 14px; margin-bottom: 8px; font-size:var(--font-size-18); font-weight:400; line-height:1.777em; letter-spacing:-0.02em;}
.campus-info li:last-child {margin-bottom: 0;}
.campus-info li::before {content:""; position: absolute; left: 0; top: 14px; width:4px; height:4px; border-radius:50%; background:var(--color-primary);}
.campus-info li span {font-weight:600;}

.campus-slider {position: relative; flex-shrink: 0; width: clamp(300px, calc(636 / var(--inner) * 100vw), 636px);}
.campus-slider .campus-swiper {width: 100%; height: 100%; overflow: hidden;}
.campus-slider .campus-slide .img {width: 100%;}
.com-next .nav-arr {transform: rotate(180deg);}
.com-nav {position: absolute; bottom: var(--space-24); z-index: 3; display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; padding: 0; border: none; border-radius: 12px; background: var(--color-primary); cursor: pointer;}
.com-nav.swiper-button-disabled {background: rgba(255, 255, 255, 0.24); backdrop-filter: blur(12px); pointer-events: none;}
.com-nav .nav-arr {display: block; width: 8px; height: 14px; background: url(../images/sub/campus-arrow.svg) no-repeat center / contain;}
.com-prev {left: var(--space-42);}
.com-next {right: var(--space-42);}

/********************* SUSTAINABILITY *********************/
/* sustainability 공통 */
.sustain-intro {position:relative; width:100%;}
.sustain-deco {position:absolute; z-index:0; left:50%; top:-80px; width:100%; margin:0; transform:translateX(-50%); font-size:128px; font-weight:700; line-height:1.05em; letter-spacing:-0.02em; text-align:center; color:#f5f5f5; pointer-events:none; white-space:nowrap; z-index: -1;}
.sustain-top {position:relative; z-index:1; width:100%;}
.sustain-img-wrap {display:flex; width:100%; margin-bottom: var(--space-120);}
.sustain-img-wrap .img {flex: 1;}
.sustain-overlay {position:absolute; z-index:2; left:50%; top:50%; display:flex; width:clamp(430px, calc(673 / var(--inner) * 100vw), 673px); min-height: clamp(200px, calc(301 / var(--inner) * 100vw), 301px);  flex-direction:column; align-items:center; justify-content:center; gap:var(--space-30); padding:var(--space-30) var(--space-24); border-radius:200px; background:rgba(0,0,0,0.16); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); box-sizing:border-box; transform:translate(-50%, -50%); text-align:center;}
.sustain-overlay .icon {flex-shrink:0; display:block;}
.sustain-overlay-box {display:flex; flex-direction:column; align-items:center; gap:var(--space-20); color:#fff;}
.sustain-en {margin:0; color: rgba(255, 255, 255, 0.70); font-size:var(--font-size-32); font-weight:700; line-height:1.44em; letter-spacing:-0.02em;}
.sustain-en strong {color:#fff;}
.sustain-ko {margin:0; font-size:var(--font-size-18); font-weight:600; line-height:1.777em; letter-spacing:-0.02em; color:#fff;}

.sustain-body {width:100%;}
.sustain-body-inner {display:flex; align-items:flex-start; justify-content:space-between; gap:var(--space-40); flex-wrap:wrap;}
.sustain-body-main {display:flex; flex-direction:column; gap:var(--space-40); min-width:0; max-width:630px; width: 100%;}
/* tab menu */
.sustain-tab-menu {display:inline-flex; align-items:stretch;}
.sustain-tab-menu li a {display:block; width:63px; margin:0; padding:0 var(--space-18); border:none; box-sizing:border-box; font-family:'cambria',serif; font-size:var(--font-size-20); font-weight:700; line-height:1.7em; letter-spacing:-0.02em; text-align:center; cursor:pointer; background:#f5f5f5; color:#878787; overflow:hidden;}
.sustain-tab-menu li.active a {background:var(--color-primary); color:#fff;}
.sustain-desc {display: flex; flex-direction:column; gap:var(--space-24); font-size:var(--font-size-20); font-weight:400; line-height:1.7em; letter-spacing:-0.02em; color:#505050;}

.cert-wrap {display:flex; flex-shrink:0; align-items:stretch; gap:var(--space-20);}
.cert-wrap .img {position:relative; flex-shrink: 0; height: clamp(260px, calc(417 / var(--inner) * 100vw), 417px);}
.cert-wrap .img:after {content:""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.25)}
.cert-wrap .img img {height: 100%;}

/* compliance */
.compliance-body-main {max-width:1290px;}

/********************* CAREER *********************/
/* ideal-talent */
.career-img {margin-bottom: var(--space-70);}
.career-section .doc-top .doc-txt {margin-top: var(--space-24); font-size: var(--font-size-40);}
.ideal-value-grid {display:flex; flex-wrap:wrap; gap:var(--space-20); align-items:stretch; justify-content:center; width:100%; margin-top:var(--space-60);}
.ideal-value-card {display:flex; flex:1; max-width:100%; min-height:485px; flex-direction:column; align-items:center; justify-content:center; gap:var(--space-60); padding:var(--space-40) var(--space-24); border:1px solid #dfdfdf; background:#fff;}
.ideal-value-body {display:flex; width:100%; max-width:467px; flex-direction:column; align-items:center; gap:var(--space-24); text-align:center;}
.ideal-value-title {margin:0; font-size:var(--font-size-24); font-weight:700; line-height:1.583em; letter-spacing:-0.02em; color:var(--color-sub);}
.ideal-value-list {list-style:none; margin:0; padding:0; display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-8);}
.ideal-value-list li {position:relative; padding-left:calc(4px + var(--space-8)); font-size:var(--font-size-16); font-weight:400; line-height:1.875em; letter-spacing:-0.02em; color:#505050; text-align:left; word-break:keep-all;}
.ideal-value-list li::before {content:""; position:absolute; left:0; top:13px; width:4px; height:4px; border-radius:50%; background:var(--color-primary);}

/* job-application */
.job-recruit {display:flex; width:100%; flex-direction:column; align-items:stretch; gap:var(--space-40); margin-bottom: var(--space-120);}
.job-recruit:last-child {margin-bottom: 0;}
.job-recruit-title {margin:0; font-size:var(--font-size-32); font-weight:700; line-height:1.437em; letter-spacing:-0.02em; color:var(--color-sub);}
.job-recruit-inner {display:flex; width:100%; flex-direction:column; align-items:stretch; gap:var(--space-30);}
.job-recruit-list {list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:var(--space-8);}
.job-recruit-item {display:flex; align-items:center; gap:var(--space-16); padding:var(--space-30) var(--space-24); border-radius:8px; background:#f8f8f8; box-sizing:border-box;}
.job-recruit-txt {position: relative; padding-left: 36px; margin:0; flex:1; min-width:0; font-size:var(--font-size-20); font-weight:400; line-height:1.7em; letter-spacing:-0.02em; color:#505050;}
.job-recruit-txt::before {content: ""; position: absolute; left: 0; top: 7px; width:20px; height:20px; background:url("../images/sub/check-icon.svg") no-repeat center / contain;}
.recruit-contact-label {font-size:var(--font-size-16); font-weight:500; line-height:1.875em; letter-spacing:-0.02em; color:#505050;}
.recruit-contact-detail {font-size:var(--font-size-16); font-weight:400; line-height:1.875em; letter-spacing:-0.02em; color:#939598;}
.recruit-contact-detail a:hover {text-decoration:underline;}

/* Required Documents */
.job-docs-grid {display:flex; width:100%; flex-wrap:wrap; gap:var(--space-20); align-items:stretch;}
.job-docs-column {display:flex; flex:1; min-width:0; max-width:100%; flex-direction:column; align-items:stretch; border-radius:8px; overflow:hidden;}
.job-docs-head {display:flex; align-items:center; justify-content:center; padding:var(--space-24); background:var(--color-primary);}
.job-docs-title {margin:0; font-size:var(--font-size-28); font-weight:700; line-height:1.5em; letter-spacing:-0.02em; text-align:center; color:#eee;}
.job-docs-body {display:flex; flex:1; flex-direction:column; gap:var(--space-16); padding:var(--space-40); background:#f8f8f8; box-sizing:border-box;}
.job-docs-list {list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:var(--space-16);}
.job-docs-row {display:flex; align-items:flex-start; gap:var(--space-16); min-width:0; font-size:var(--font-size-18); font-weight:400; line-height:1.555em; letter-spacing:-0.02em; }
.job-docs-row.muted {opacity:0.6;}
.job-docs-row .num {flex-shrink:0; color:#86a1bf; font-weight: 600;}
.job-docs-row .txt {color:#505050;}

/* Recruitment Process */
.job-process {display:flex; width:100%; flex-direction:column; align-items:stretch; gap:var(--space-30);}
.job-process-track {display:flex; flex-wrap:wrap; gap:56px; align-items:stretch; width:100%;}
.job-process-step {display:flex; flex: 1; max-width:100%; flex-direction:column; position: relative;}
.job-process-step:not(:last-child):after {content: ""; position: absolute; top: 50%; right: -38px;width: 16px; height: 16px; background: url(../images/sub/process-arrow.svg) no-repeat center / contain;}
.job-process-step .inner {display:flex; height:100%; flex-direction:column; align-items:flex-start; justify-content:space-between; gap:var(--space-50); padding:var(--space-40); border-radius:16px; background:#f6f6f6; box-sizing:border-box;}
.process-head {display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-10); text-align:left;}
.process-num {font-size:var(--font-size-18); font-weight:600; line-height:1.777em; letter-spacing:-0.02em; color:var(--color-primary);}
.process-titles {display:flex; flex-direction:column; align-items:flex-start; gap:0;}
.process-title-line {display:block; font-size:var(--font-size-18); font-weight:600; line-height:1.777em; letter-spacing:-0.02em; color:var(--color-sub);}
.process-icon {display:flex; flex-shrink:0; align-items:center; justify-content:flex-end; width: 100%;}
.job-process-arrow {flex-shrink:0;}
.process-note {margin-top:var(--space-30); font-size:var(--font-size-16); font-weight:400; line-height:1.875em; letter-spacing:-0.02em; color:#939598; white-space:normal;}

/********************* NEWS *********************/
/* 게시판 공통 */
.board-search.type2 {display: flex; align-items: center; justify-content: space-between;}
.board-search.type2:after {display: none;}
.board-search.type2 .total-page {display: flex; align-items: center; font-size: 20px; color: #505050; line-height: 1.5em; font-weight: 500;}
.board-search.type2 .total-page .num {display: inline-flex; align-items: center; color: var(--color-primary);}
.board-search.type2 .total-page .num:before {content: ""; display: inline-block; width: 1px; height: 12px; background: #ddd; margin: 010px;}
.board-search.type2 .input {height: 56px; border-color: #ddd; border-radius: 8px; font-size: 18px; line-height: 1.33em; color: #505050; }
.board-search.type2 .input.search-input {height: 100%; width: 306px; padding: 0; border: none; border-radius: 0;}
.board-search.type2 select.input {padding-right: 69px; padding-left: 24px; background-position: right 24px center;}
.board-search.type2 .search {display: flex; align-items: center; gap: 10px;}
.board-search.type2 .cate {float: unset; margin-left: 0;}
.input-wrap {gap: 20px; height: 56px; padding: 6px 24px; background: #fff; border-radius: 8px; border: 1px solid #ddd; }
.submit-btn {width: 24px; height: 24px; background: url(../images/common/search-icon.svg) no-repeat center / contain; border: none;}