@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.root_daum_roughmap {width:100% !important; height:clamp(250px, calc( 450 / var(--inner) * 100vw ), 450px) !important;}
.root_daum_roughmap .wrap_map {height:clamp(250px, calc( 450 / var(--inner) * 100vw ), 450px) !important;}
.roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.roughmap_lebel_text:after {content:"경기도 성남시 분당구 황새울로319번길 6"; font-size:12px; line-height:15px;}

.bullet-item .bullet-list {position:relative; padding-left:15px; margin-top:10px; line-height:1.3;}
.bullet-item .bullet-list:first-child {margin-top:0;}
.bullet-item .bullet-list::before {position:absolute; content:''; left:0; top:9px; width:3px; height: 3px; background:var(--color-primary); border-radius: 50%;}
.bullet-item .bullet-list.none {padding-left: 0;}
.bullet-item .bullet-list.none::before {display: none;}
.bulletitem2 { padding-left: 0.6em; text-indent: -0.6em;}

/*  css 파일 추가 처리(선택사항)  */
.fr-box .swiper-wrapper {display:block;}

.blocker {z-index: 100;}
.modal {max-width:980px; width: 100%;}

.bg-gray {background:#fafafa;}
.overhidden {overflow: hidden;}
.subsec-pd {padding: clamp(50px, calc( 150 / var(--inner) * 100vw ), 150px) 0;}

.radiobx {display: flex; flex-wrap: wrap;}
.radiobx .item {display: flex;align-items: center; min-height: clamp(38px, calc( 44 / var(--inner) * 100vw ), 44px);}
.radiobx .item:not(:last-child) {margin-right: clamp(15px, calc( 40 / var(--inner) * 100vw ), 40px);}

/* 서브 공통 */
.sub-eyebrow {font-size:var(--font-size-20); font-weight:700; line-height:1.1em; letter-spacing:-0.04em; background:linear-gradient(90deg, #00b2ff 0%, var(--color-primary) 100%); -webkit-background-clip:text; background-clip:text; color:transparent;}
.sub-tit-lg {font-size:clamp(26px, calc( 50 / var(--inner) * 100vw ), 50px); font-weight:600; line-height:1.28em; letter-spacing:-0.03em; color:var(--color-secondary); text-align:center;}
.sub-tit-md {font-size:var(--font-size-40); font-weight:600; line-height:1.35em; letter-spacing:-0.03em; color:var(--color-secondary); text-align:center;}
.sub-desc {display:flex; flex-direction:column; gap:0; max-width:962px; margin:40px auto 0; font-size:var(--font-size-20); line-height:1.7em; letter-spacing:-0.03em; color:#676767; text-align:center;}

/* CEO 인사말 */
.greetings {display:flex; flex-direction:column; gap:var(--padding-80);}
.greetings-head {display:flex; flex-direction:column; gap:var(--padding-28); }
.greetings-eyebrow {font-size:var(--font-size-20); font-weight:700; line-height:1.1em; letter-spacing:-0.04em; background:linear-gradient(90deg, #00b2ff 0%, var(--color-primary) 100%); -webkit-background-clip:text; background-clip:text; color:transparent;}
.greetings-tit { font-size:var(--font-size-48); font-weight:600; line-height:1.33em; letter-spacing:-0.03em; color:var(--color-secondary);}
.greetings-tit .point {color:var(--color-primary); font-style:normal;}
.greetings-banner {display: flex;align-items: center; justify-content: center; background: url(/images/sub/greetings-banner.jpg) no-repeat center center / cover; height:clamp(260px, calc( 560 / var(--inner) * 100vw ), 560px); border-radius:20px; overflow:hidden; color:#fff;}
.greetings-banner-txt {padding: 0 var(--container-space);position:relative; z-index:1; max-width: 1380px;margin: 0 auto; width: 100%;}
.greetings-banner-lead {font-size:var(--font-size-36); font-weight:400; line-height:1.44em; letter-spacing:-0.03em;}
.greetings-banner-lead strong {font-weight:600;}
.greetings-banner-desc {margin-top:var(--padding-30); font-size:var(--font-size-20); font-weight:500; line-height:1.6em; letter-spacing:-0.03em; color:rgba(255,255,255,0.8);}
.greetings-body {display:flex; flex-direction:column; gap:var(--padding-40); align-items:flex-end;}
.greetings-txt {width:100%; display:flex; flex-direction:column; gap:var(--padding-25); font-size:var(--font-size-20); line-height:1.6em; letter-spacing:-0.03em; color:#676767;}
.greetings-sign {font-size:var(--font-size-24); font-weight:600; line-height:1.33em; letter-spacing:-0.03em; color:var(--color-secondary); text-align:right;}
.greetings-sign .point {color:var(--color-primary); font-style:normal;}

/* 비전 */
.vision {display:flex; flex-direction:column; gap:clamp(50px, calc( 150 / var(--inner) * 100vw ), 150px);}
.vision-sec+.vision-sec {padding-top:clamp(50px, calc( 150 / var(--inner) * 100vw ), 150px) ;}
.vision-sec {display:flex; flex-direction:column; gap:var(--padding-50);}
.vision-head {display:flex; flex-direction:column; gap:var(--padding-28); text-align:center;}
.vision-head .sub-desc {margin-top: var(--padding-10);}
.vision-visual {border-radius:20px; overflow:hidden; margin-top: var(--padding-30);}
.vision-visual img {display:block; width:100%; height:auto;}
.mission-list {display:flex; flex-wrap:wrap; gap:var(--padding-25); justify-content:center;}
.mission-item {display:flex; flex-direction:column; justify-content:space-between; gap:var(--padding-120); width:calc(25% - 20px); padding:var(--padding-40) var(--padding-35); border-radius:10px; background:#f0f8fe;}
.mission-icon {display:flex; align-items:center; justify-content:center; width:clamp(50px, calc( 74 / var(--inner) * 100vw ), 74px); height:auto; aspect-ratio: 1/1; border-radius:8px; background:#fff;}
.mission-icon img {max-width:clamp(30px, calc( 38 / var(--inner) * 100vw ), 38px); height:auto; aspect-ratio: 1/1;}
.mission-tit {font-size:var(--font-size-28); font-weight:600; line-height:1.43em; letter-spacing:-0.03em; color:var(--color-primary);}
.mission-desc {margin-top:16px; font-size:var(--font-size-18); line-height:1.67em; letter-spacing:-0.03em; color:#676767;}
.value-list {display:flex; flex-wrap:wrap; gap:10px;}
.value-item {display:flex; flex:1; flex-direction:column; gap:var(--padding-50);padding:var(--padding-40) var(--padding-24); border:1px solid #eee; border-radius:8px; background:#fff;}
.value-icon {display:flex; align-items:center; justify-content:flex-start; height:auto; width: clamp(30px, calc( 48 / var(--inner) * 100vw ), 48px); aspect-ratio: 1/1;}
.value-icon img {width: 100%; height: 100%;}
.value-tit {font-size:var(--font-size-24); font-weight:600; line-height:1.33em; letter-spacing:-0.02em; color:var(--color-secondary);}
.value-desc {margin-top:16px; font-size:var(--font-size-16); line-height:1.75em; letter-spacing:-0.02em; color:#676767;}

/* 연혁 */
.history-cont {display:flex; flex-direction:column; gap:var(--padding-80);}
.history-head {display:flex; flex-direction:column; gap:var(--padding-28); text-align:center;}
.history-flx {display:flex; flex-wrap:nowrap; align-items:flex-start; gap:clamp(20px, calc(40 / var(--inner) * 100vw), 40px); overflow:hidden; position: relative;}
.histor-txt {flex-shrink:0; font-family:'Jost',sans-serif; font-size:clamp(60px, calc(200 / var(--inner) * 100vw), 200px); font-weight:700; line-height:1; letter-spacing:-0.03em; color:#F8F8F8; writing-mode:vertical-rl; text-orientation:mixed; white-space:nowrap; user-select:none; pointer-events:none;}
.history {flex: 1 0 auto; width: 1%;}
.history .item {display:flex; align-items:flex-start; gap:clamp(40px, calc(110 / var(--inner) * 100vw), 110px);}
.history .item h3 {flex-shrink:0; margin:0; font-size:clamp(32px, calc(50 / var(--inner) * 100vw), 50px); font-weight:600; line-height:1em; letter-spacing:-0.03em; color:#2c2c2c;}
.history .list {flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; position:relative; padding:0 0 var(--padding-100) clamp(30px, calc(110 / var(--inner) * 100vw), 110px);}
.history .list:before {content:""; position:absolute; left:1px; top:12px; width:14px; height:14px; border-radius:50%; background:var(--color-primary); transform:translateX(-50%); z-index:1;}
.history .list:after {content:""; position:absolute; left:0; top:32px; width:2px; height:calc(100% - 32px + var(--padding-100)); background:#ddd; z-index:0;}
.history .list li {display:flex; align-items:flex-start; gap:10px; font-size:var(--font-size-20); line-height:1.6em; letter-spacing:-0.03em; color:#676767;}
.history .list li:before {content:""; flex-shrink:0; width:6px; height:6px; margin-top:13px; border-radius:50%; background:#676767;}
.history .item:last-child .list {padding-bottom:0;}
.history .item:last-child .list:after {display:none;}
@media (max-width: 1024px) {
	.history {gap:var(--padding-80);}
	.history .item {gap:clamp(30px, calc(120 / var(--inner) * 100vw), 120px);}
	.history .list {padding-bottom:var(--padding-80);}
}
@media (max-width: 640px) {
	.history {gap:var(--padding-60);}
	.history .item {flex-direction:column; gap:15px;}
	.history .item h3 {font-size:24px;}
	.history .list {width:100%; padding:0 0 var(--padding-50) 0;}
	.history .list:before {display: none;}
	.history .list:after {display: none;}
	.history .list li:before {margin-top:11px; width: 4px; height: 4px;}
	.history .item:last-child .list {padding-bottom:0;}
	.histor-txt {position: absolute; right: 0; top: 0; z-index: -1;}
}


/* 조직도 */
.organization {display:flex; flex-direction:column; gap:clamp(50px, calc( 80 / var(--inner) * 100vw ), 80px);}
.organization-head {display:flex; flex-direction:column; gap:28px; text-align:center;}
.organization-chart img {display:block; width:100%; height:auto;}

/* 오시는 길 */
.directions {display:flex; flex-direction:column; gap:var(--padding-80);}
.directions-head {display:flex; flex-direction:column; gap:var(--padding-28); text-align:center;}
.directions-body {display:flex; flex-direction:column; gap:var(--padding-40);}
.directions-map {border-radius:12px; overflow:hidden;}
.directions-map .root_daum_roughmap,
.directions-map .root_daum_roughmap .wrap_map {height:clamp(250px, calc( 510 / var(--inner) * 100vw ), 510px) !important;}
.directions-info {display:flex; flex-direction:column; gap:var(--padding-40);}
.directions-company {font-size:var(--font-size-18); font-weight:700; line-height:1.44em; letter-spacing:-0.03em; color:var(--color-primary);}
.directions-addr-tit {margin-top:10px; font-size:var(--font-size-28); font-weight:600; line-height:1.29em; letter-spacing:-0.03em; color:var(--color-secondary);}
.directions-addr-desc {margin-top:10px; font-size:var(--font-size-18); line-height:1.44em; letter-spacing:-0.03em; color:#676767;}
.directions-line {height:1px; background:#eee;}
.directions-contact-row {display:flex; align-items:center; gap:var(--padding-30); padding: var(--padding-22) 0;} 
.directions-contact-icon {flex-shrink:0; }
.directions-contact-icon img {display:block; width:clamp(30px, calc( 48 / var(--inner) * 100vw ), 48px); height:auto; aspect-ratio: 1/1;}
.directions-contact-label {font-size:var(--font-size-20); font-weight:600; line-height:2em; letter-spacing:-0.03em; color:var(--color-secondary);}
.directions-contact-val {font-size:var(--font-size-20); line-height:2em; letter-spacing:-0.03em; color:#676767;}

/* Q&A */
.qa {display:flex; flex-direction:column; gap:var(--padding-80);}
.qa-head {display:flex; flex-direction:column; gap:var(--padding-35); text-align:center;}
.qa-head .sub-desc {margin-top: 0;}
.qa-list {border-top:1px solid #505050;}
.qa-item {display:flex; align-items: center; gap:var(--padding-40);  padding:var(--padding-40) 0; border-bottom:1px solid #eee;}
.qa-num {display:flex; flex-shrink:0; align-items:center; justify-content:center; width:clamp(50px, calc( 80 / var(--inner) * 100vw ), 80px); height:auto; aspect-ratio: 1/1; border-radius:8px; background:#f0f8fe; font-size:var(--font-size-20); font-weight:700; line-height:1.5em; letter-spacing:-0.02em; color:var(--color-primary);}
.qa-q {font-size:var(--font-size-24); font-weight:600; line-height:1.67em; letter-spacing:-0.02em; color:#2c2c2c;}
.qa-a {margin-top:10px; font-size:var(--font-size-20); line-height:1.6em; letter-spacing:-0.02em; color:#676767;}

/* 서브 공통 — 배너·카드·리스트 */
.sub-page {display:flex; flex-direction:column; gap:clamp(80px, calc( 150 / var(--inner) * 100vw ), 150px);}
.sub-sec {display:flex; flex-direction:column; gap:clamp(30px, calc( 50 / var(--inner) * 100vw ), 50px);}
.sub-sec-head {margin-bottom: var(--padding-30); text-align:center;}
.sub-sec-head.ty2 {margin-bottom: var(--padding-80);}
.sub-sec-head .sub-eyebrow {margin-bottom: var(--padding-28);}
.sub-sec-tit {font-size:var(--font-size-40); font-weight:600; line-height:1.35em; letter-spacing:-0.03em; color:var(--color-secondary);}
.sub-sec-tit .point {color:var(--color-primary);}
.sub-lead { margin:var(--padding-35) auto 0; font-size:var(--font-size-20); line-height:1.6em; letter-spacing:-0.03em; color:#505050; text-align:center;}
.sub-banner {position:relative; display:flex; align-items:center; justify-content:center; min-height:clamp(320px, calc( 560 / var(--inner) * 100vw ), 560px); padding:clamp(40px, calc( 80 / var(--inner) * 100vw ), 80px) clamp(24px, calc( 60 / var(--inner) * 100vw ), 60px); border-radius:20px; overflow:hidden; color:#fff; text-align:center;}
.sub-banner-bg {position:absolute; inset:0; background-position:50% 50%; background-repeat:no-repeat; background-size:cover;}
.sub-banner-bg::after {content:''; position:absolute; inset:0; background:rgba(0,0,0,0.3);}
.sub-banner-txt {position:relative; z-index:1; max-width:1400px; padding: 0 var(--container-space);}
.sub-banner-label {font-size:var(--font-size-20); font-weight:700; line-height:1.1em; letter-spacing:-0.04em; color:rgba(255,255,255,0.7);}
.sub-banner-tit {margin-top:24px; font-size:clamp(24px, calc( 40 / var(--inner) * 100vw ), 40px); font-weight:600; line-height:1.35em; letter-spacing:-0.03em;}
.sub-banner-desc {margin-top:30px; font-size:var(--font-size-20); font-weight:500; line-height:1.6em; letter-spacing:-0.03em; color:rgba(255,255,255,0.8);}
.sub-banner-btn {display:inline-flex; align-items:center; justify-content:center; min-height:clamp(40px, calc( 60 / var(--inner) * 100vw ), 60px); margin-top:var(--padding-60); padding:0 30px; border:1px solid #fff; border-radius:4px; font-size:var(--font-size-18); font-weight:500; line-height:1.67em; letter-spacing:-0.03em; color:#fff;}
.sub-card-grid {display:grid; grid-template-columns: repeat(3,1fr); gap:16px;}

.sub-card {display:flex; flex-direction:column; gap:var(--padding-45); padding:var(--padding-40); border-radius:10px; background:#f8f8f8;}
.sub-card.bg-light {background:#f6f6f6;}
.sub-card-icon {display:flex; align-items:center; justify-content:center; width:clamp(40px, calc( 70 / var(--inner) * 100vw ), 70px); height:auto; aspect-ratio: 1/1; border-radius:8px; background:#fff;}
.sub-card-icon img {width:clamp(24px, calc( 38 / var(--inner) * 100vw ), 38px); height:auto; aspect-ratio: 1/1;}
.sub-card-tit {font-size:var(--font-size-28); font-weight:500; line-height:1.5em; letter-spacing:-0.03em; color:var(--color-secondary);}
.sub-card-desc {margin-top:var(--padding-16); font-size:var(--font-size-18); line-height:1.67em; letter-spacing:-0.03em; color:#676767;}
.sub-status-list {width:100%;}
.sub-status-item {display:flex; gap:var(--padding-30); align-items:center; padding:var(--padding-32) 0; border-top:1px solid #eee;}
.sub-status-item:last-child {border-bottom:1px solid #eee;}
.sub-status-icon {display:flex; flex-shrink:0; align-items:center; justify-content:center; width:clamp(50px, calc( 80 / var(--inner) * 100vw ), 80px); height:auto; aspect-ratio: 1/1; border-radius:8px; background:#f0f8fe;}
.sub-status-icon img {max-width:clamp(24px, calc( 38 / var(--inner) * 100vw ), 38px); height:auto; aspect-ratio: 1/1;}
.sub-status-tit {flex-shrink:0; width:clamp(140px, calc( 300 / var(--inner) * 100vw ), 300px); font-size:var(--font-size-28); font-weight:500; line-height:1.5em; letter-spacing:-0.02em; color:var(--color-secondary);}
.sub-status-desc {flex:1; font-size:var(--font-size-20); line-height:1.6em; letter-spacing:-0.02em; color:#676767;}
.sub-status-desc .point {font-weight:500; color:#2c2c2c;}
.sub-bottom-sec {padding-bottom: var(--padding-150); background: url(../images/sub/sub-bottom-sec-bg.jpg) no-repeat center bottom /cover;}
.sub-bottom-inner {position:relative; z-index:1; display:flex; flex-direction:column; gap:var(--padding-50); align-items:center;  text-align:center;}
.sub-benefit-list {display:grid; grid-template-columns: repeat(3,1fr); gap:var(--padding-40); justify-content:center; width: 100%;}

.sub-benefit-item {display:flex; align-items:center; gap:var(--padding-25); padding:9px; border:1px solid #dfdfdf; border-radius:10px; background:rgba(255,255,255,0.5); backdrop-filter:blur(10px);}
.sub-benefit-icon {display:flex; flex-shrink:0; align-items:center; justify-content:center; width:clamp(50px, calc( 82 / var(--inner) * 100vw ), 82px); height:auto; aspect-ratio: 1/1; border-radius:8px; background:#003682;}
.sub-benefit-icon img {max-width:clamp(28px, calc( 48 / var(--inner) * 100vw ), 48px); height:auto; aspect-ratio: 1/1;}
.sub-benefit-tit {font-size:var(--font-size-24); font-weight:500; line-height:1.42em; letter-spacing:-0.03em; color:var(--color-secondary);}
.sub-guide-grid {display:grid; grid-template-columns: repeat(2,1fr); gap:var(--padding-80) var(--padding-40); justify-content:space-between;}
.sub-guide-item {display:flex; gap:var(--padding-40); align-items:center; }
.sub-guide-icon {display:flex; flex-shrink:0; align-items:center; justify-content:center; width:clamp(80px, calc( 200 / var(--inner) * 100vw ), 200px); height:auto; aspect-ratio: 1/1; border-radius:10px; background:#f0f8fe;}
.sub-guide-icon img {width:var(--padding-80); height:auto; aspect-ratio: 1/1;}
.sub-guide-tit {font-size:var(--font-size-28); font-weight:500; line-height:1.5em; letter-spacing:-0.02em; color:var(--color-secondary);}
.sub-guide-desc {margin-top:var(--padding-20); font-size:var(--font-size-18); line-height:1.67em; letter-spacing:-0.02em; color:#676767;}
.sub-effect-grid {display:flex; flex-wrap:wrap; gap:var(--padding-16);}
.sub-effect-item {display:flex; flex:1; gap:24px; align-items:center; min-width:280px; padding:24px; border-radius:10px; background:#f0f8fe;}
.sub-effect-icon {display:flex; flex-shrink:0; align-items:center; justify-content:center; width:82px; height:82px; border-radius:8px; background:#003682;}
.sub-effect-icon img {max-width:48px; max-height:42px;}
.sub-effect-tit {font-size:var(--font-size-24); font-weight:600; line-height:1.33em; letter-spacing:-0.02em; color:var(--color-secondary);}
.sub-effect-desc {margin-top:8px; font-size:var(--font-size-16); line-height:1.75em; letter-spacing:-0.02em; color:#676767;}
.sub-split {display:flex; flex-wrap:wrap; gap:40px; align-items:center;}
.sub-split-img {flex:1; min-width:280px; border-radius:20px; overflow:hidden;}
.sub-split-img img {display:block; width:100%; height:auto;}
.sub-split-txt {flex:1; min-width:280px;}
.sub-split-tit {font-size:var(--font-size-32); font-weight:600; line-height:1.31em; letter-spacing:-0.03em; color:var(--color-secondary);}
.sub-split-desc {margin-top:24px; font-size:var(--font-size-18); line-height:1.67em; letter-spacing:-0.03em; color:#676767;}
.sub-lead p + p {margin-top:0;}
.sub-banner-desc p + p {margin-top:0;}
.sub-split-desc p + p {margin-top:0;}
.sub-visual-img {border-radius:20px; overflow:hidden;}
.sub-visual-img img {display:block; width:100%; height:auto;}
.overview-banner .sub-banner-bg {background-image:url('/images/sub/overview-banner.jpg');}
.overview-bottom {background-image:url('/images/sub/overview-bottom-bg.jpg');}
.digital-banner .sub-banner-bg {background-image:url('/images/sub/digital-banner.jpg');}
.digital-banner-tit {font-size:clamp(24px, calc(36 / var(--inner) * 100vw), 36px); line-height:1.33em;}
.sub-process-grid {display:flex; flex-direction:column; border-top:1px solid #eee;}
.sub-process-row {display:flex; flex-wrap:wrap;}
.sub-process-row + .sub-process-row {border-top:1px solid #eee;}
.sub-process-item {display:flex; flex:1; flex-direction:column; gap:20px; min-width:280px; padding:16px 16px 40px;}
.sub-process-row .sub-process-item + .sub-process-item {border-left:1px solid #eee;}
.sub-process-img {position:relative; height:clamp(200px, calc(360 / var(--inner) * 100vw), 360px); padding:10px; border-radius:8px; overflow:hidden;}
.sub-process-img img {position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:8px;}
.sub-process-num {position:relative; z-index:1; display:flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:4px; background:rgba(0,71,171,0.8); font-size:var(--font-size-16); font-weight:600; line-height:1.63em; color:#fff;}
.sub-process-tit {font-size:var(--font-size-28); font-weight:500; line-height:1.5em; letter-spacing:-0.02em; color:var(--color-secondary);}
.sub-process-list {display:flex; flex-direction:column; gap:4px; margin-top:12px;}
.sub-process-list li {position:relative; padding-left:14px; font-size:var(--font-size-20); line-height:1.6em; letter-spacing:-0.02em; color:#676767;}
.sub-process-list li::before {content:''; position:absolute; left:0; top:14px; width:4px; height:4px; border-radius:50%; background:var(--color-primary);}
.sub-bottom-split {display:flex; flex-wrap:wrap; gap:clamp(30px, calc(120 / var(--inner) * 100vw), 200px); align-items:center; justify-content:space-between;}
.sub-bottom-split-txt {flex:1; min-width:280px;}
.sub-bottom-split .sub-benefit-list {display: flex; flex-direction:column; flex:1; max-width:666px; align-items:stretch; gap:var(--padding-20);}
.sub-bottom-split .sub-benefit-item {width:100%; max-width:none; border-color:#eee;}