@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.root_daum_roughmap {width:100% !important; height:clamp(250px, calc( 500 / var(--inner) * 100vw ), 500px) !important;}
.root_daum_roughmap .wrap_map {height:clamp(250px, calc( 500 / var(--inner) * 100vw ), 500px) !important;}
.roughmap_lebel_text {display: none; line-height:0 !important; font-size:0 !important;}
.roughmap_lebel_text:after {display: none; content:"경기도 화성시 동탄기흥로 557"; font-size:12px; line-height:15px;}
.roughmap_maker_label {display: none;}

.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( 120 / var(--inner) * 100vw ), 120px) 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);}

.mvgrid {display: flex;flex-direction: column;gap: var(--padding-120);}
.mvgrid .imgwrap {max-width:1140px; width: 100%;}
.mvgrid .imgbx {position: relative;}
.mvgrid .imgbx img {border-radius: var(--border-radius-32); overflow: hidden;}
.mvgrid .imgbx .tit {position: absolute; left: var(--padding-20); bottom: clamp(-10px, calc( -10 / var(--inner) * 100vw ), -2px); font-size: var(--font-size-80); font-weight: bold; letter-spacing: 12px; line-height: 1; color: #fff;}
.mvgrid .textbx {display: flex; gap: var(--padding-50); margin-top: var(--padding-60); font-size: var(--font-size-24); font-weight: 600;}
.mvgrid .textbx .name {font-weight: bold;color: var(--color-primary);}
.mvgrid .textbx .desc {color: #222;}
.mvgrid .item:nth-child(even) .imgwrap {margin-left: auto;}
.mvgrid .item:nth-child(even) .imgbx .tit {left: initial; right: var(--padding-20);}
.mvgrid .item:nth-child(even) .textbx {flex-direction: row-reverse;}

.sub1_1_2 {background: url(../images/sub/sub1_1_2-bg.jpg) no-repeat center center / cover;}
.sub1_1_2 .intit {margin-bottom: var(--padding-50); color: #fff; font-size: var(--font-size-48); font-weight: 500; line-height: 1;}
.sub1_1_2 .valuelist {display: flex; flex-direction: column; gap: var(--padding-50);}
.sub1_1_2 .valuecard {background: rgba(255,255,255,0.9); border: 1px solid #fff; border-radius: 16px; padding: var(--padding-50);}
.sub1_1_2 .valuecard__inner {display: flex; flex-wrap: wrap; align-items: center; gap: var(--padding-50);}
.sub1_1_2 .valuecard__media { width:  clamp(300px, calc( 500 / var(--inner) * 100vw ), 500px); max-width: 100%; border-radius: 16px; overflow: hidden;}
.sub1_1_2 .valuecard__media img {display: block; width: 100%; height: auto; aspect-ratio: 500 / 245; object-fit: cover; border-radius: 16px;}
.sub1_1_2 .valuecard__body {flex: 1 ; display: flex; flex-direction: column; gap: var(--padding-40); }
.sub1_1_2 .valuecard__lead {display: flex; flex-direction: column; gap: var(--padding-20);}
.sub1_1_2 .valuecard__tit {margin: 0; color: #222; font-size: var(--font-size-32); font-weight: 600; line-height: 1.44; letter-spacing: -0.03em;}
.sub1_1_2 .valuecard__quote {margin: 0; color: #222; font-size: var(--font-size-18); font-weight: 600; line-height: 1.44; letter-spacing: -0.03em;}
.sub1_1_2 .valuecard__desc {color: var(--color-body); font-size: var(--font-size-18); font-weight: 400; line-height: 1.67; letter-spacing: -0.03em;}

.history-bg {padding: var(--padding-160) 16px; margin-bottom: var(--padding-100); background: url(../images/sub/his-bg.jpg) no-repeat center center / cover; text-align: center;}
.history-bg .text {font-size: var(--font-size-28); font-weight: 600; line-height: 1.64; color: #fff;} 

.history {position:relative; overflow:hidden;}
.history .group {position:relative; padding-bottom:80px;}
.history .group:before {content:""; position:absolute; left:50%; top:30px; bottom:0; width:1px; height: 100%; background:#ccc;}
.history .group:last-child {margin-bottom:0;}
.history .group:last-child::before {display:none;}
.history .group .hisflx {display: flex; flex-wrap: wrap; position: relative; gap: var(--padding-60);}
.history .group h3 {width: 90px; font-size:32px; font-weight:bold; color: var(--color-primary); line-height:1.21; margin-bottom:var(--padding-24); z-index:2; letter-spacing: -0.5px; text-align: left;}
.history .group .hisflx:before {content:""; position:absolute; top:6px; width:32px; height:32px; background:var(--color-primary); border:8px solid rgba(255, 255, 255, 0.70); border-radius:100%;}
.history .group ul {flex: 1; margin-top: var(--padding-10);}
.history .group ul li {position:relative; padding-left: 15px; margin-bottom:var(--padding-15); color:var(--color-body); font-size:18px;  letter-spacing:-.04em;}
.history .group ul li:after {position: absolute; content: ''; left: 0; top: 11px; width: 3px; height: 3px; background:var(--color-body); border-radius: 50%;}
.history .group ul li:last-child {margin-bottom:0;}

.history .group:nth-child(odd) .hisflx {padding-left: var(--padding-70);}
.history .group:nth-child(odd) .hisflx:before {left:-16px;}
.history .group:nth-child(odd) {padding-left:50%;}
.history .group:nth-child(even) .hisflx {padding-right: var(--padding-70); flex-direction: row-reverse;}
.history .group:nth-child(even) .hisflx:before {right:-16px; }
.history .group:nth-child(even) {padding-right:50%; text-align:right;}
.history .group:nth-child(even) ul li {padding-left: 0; padding-right: 15px;}
.history .group:nth-child(even) ul li:after {left: initial; right: 0;}

@media (max-width: 1024px) {
	.history {padding-top:var(--padding-100);}
    .history .group:before {top: 20px;}
    .history .group .hisflx:before {width:24px; height:24px; border-width: 5px;} 
	.history .group h3 {font-size:28px;}
	.history .group ul li {font-size:16px;}
    .history .group ul li:after {top: 9px;}

    .history .group:nth-child(odd) .hisflx:before {left:-12px;}
    .history .group:nth-child(even) .hisflx:before {right:-12px; }
}
@media (max-width: 640px) {
	.history .group {padding:0 0 40px 0 !important; text-align:left !important;}
	.history .group:before {left:10px; top: 5px;}
    .history .group .hisflx  {padding: 0 0 0 40px !important; gap: 0;}
    .history .group .hisflx:before {top: 5px; left:0 !important; margin:0 !important; right:auto !important; width: 20px; height: 20px; }
	.history .group h3 {font-size:24px; width: 100%; }
	.history .group ul li {font-size:15px;}
    .history .group ul li {padding-left:12px !important; padding-right:0 !important;}
    .history .group ul li:after {top: 8px; left: 0 !important; right: inherit;}
}

.contentcol-wrap {display: flex;flex-direction: column;gap: var(--padding-150);}
.line-title {margin-bottom: var(--padding-50); padding-left: clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); position: relative; font-size:var(--font-size-40); font-weight: bold;}
.line-title:before {content:""; position:absolute; left:0; top: clamp(6px, calc( 11 / var(--inner) * 100vw ), 11px); width: clamp(4px, calc( 6 / var(--inner) * 100vw ), 6px); height: clamp(18px, calc( 30 / var(--inner) * 100vw ), 30px); background:var(--color-primary); border-radius: 8px;}

.certi-list {display: grid; grid-template-columns: repeat(4, 1fr); gap:var(--padding-55) var(--padding-20);}
.certi-list .images {position:relative; padding-bottom:135.52%; overflow:hidden;}
.certi-list .images img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; height:auto; max-width:100%; min-height:100%;object-fit : cover;}
.certi-list .images:after {content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid #ddd;}
.certi-list span {display: block;}
.certi-list .txt {padding-top:var(--padding-20); font-size: var(--font-size-18); text-align: center; font-weight: 600;}

.client-list {display: grid; grid-template-columns: repeat(5, 1fr); gap:var(--padding-40);}
.client-item {display: flex;align-items: center;justify-content: center; padding: 10px; height: clamp(70px, calc( 80 / var(--inner) * 100vw ), 80px); border-radius: 8px; border: 1px solid #ddd; text-align: center;}
.client-item img {height: 100%; object-fit: scale-down;}


.location-area .maptit {margin-bottom: var(--padding-30); display: flex;align-items: center; gap: var(--padding-12);}
.location-area .maptit img {width:clamp(16px, calc( 24 / var(--inner) * 100vw ), 24px); height: auto; aspect-ratio: 1 / 1; vertical-align: middle;}
.location-area .maptit .tit {font-size:var(--font-size-24); font-weight: 600; line-height: 1.25; color: var(--color-body);}
.location-area .map {border-radius:24px; overflow: hidden; height: clamp(250px, calc( 500 / var(--inner) * 100vw ), 500px);}
.location-area .map iframe {width: 100%; height: 100%; border: 0;}
.location-area .locinfo-bar {display:flex; flex-wrap:wrap; align-items:center; gap: var(--padding-80); margin:0; padding: var(--padding-40) 0 0;}
.location-area .locinfo-item {display:flex; flex-wrap:wrap; align-items:center; gap: var(--padding-20); margin:0;}
.location-area .locinfo-tt {display:flex; align-items:center; gap: 14px; margin:0;}
.location-area .locinfo-mark {flex-shrink:0; width:6px; height:6px; background:var(--color-primary);}
.location-area .locinfo-lbl {font-size:var(--font-size-18); font-weight:600; line-height:1.44; letter-spacing:-0.03em; color:var(--color-primary);}
.location-area .locinfo-val {margin:0; font-size:var(--font-size-16); font-weight:400; line-height:1.5; letter-spacing:-0.03em; color:var(--color-body);}
.location-area .locinfo-item:first-child .locinfo-val {color:#484848;}
.location-area .locinfo-val a {color:inherit; text-decoration:none;}
@media (max-width: 1024px) {
.location-area .locinfo-bar {gap: var(--padding-40); flex-direction:column; align-items:flex-start;}
}

.btmsubtitbx {display: flex;flex-direction: column;gap: var(--padding-10); max-width: 550px; width: 100%; margin: 0 auto; padding:var(--padding-30) 16px 0;}
.btmsubtitbx .txt {display: flex; align-items: center;gap:var(--padding-10 ); padding-left: clamp(20px, calc( 26 / var(--inner) * 100vw ), 26px); position: relative; font-size:var(--font-size-18); color: var(--color-body); letter-spacing: -0.6px;text-align: left;}   
.btmsubtitbx .txt:before {content:""; position:absolute; left:0; top:4px; width:clamp(12px, calc( 16 / var(--inner) * 100vw ), 16px); height:clamp(12px, calc( 16 / var(--inner) * 100vw ), 16px); background:url(../images/sub/badge.png) no-repeat center center / contain; }

.sub2-topimg {margin-bottom:clamp(50px, calc( 80 / var(--inner) * 100vw ), 80px); text-align: center;}
.sub2-topimg img {width: 100%;}


.wfeat-row {display:flex; flex-wrap:wrap; align-items:center; gap:var(--padding-60); border-top:1px solid #ddd; padding:var(--padding-60) 0;}
.wfeat-cell {display:flex; flex:1; align-items:center; gap:var(--padding-30); }
.wfeat-iconbx {display:flex; flex-shrink:0; align-items:center; justify-content:center;  width:clamp(70px, calc( 100 / var(--inner) * 100vw ), 100px); height:clamp(70px, calc( 100 / var(--inner) * 100vw ), 100px); padding:8px 6px; border:1px solid #ddd; border-radius:80px; background:#fafafa;}
.wfeat-iconbx img {display:block; width:auto; max-width:100%; height:auto; max-height:clamp(30px, calc( 40 / var(--inner) * 100vw ), 40px);}
.wfeat-body {display:flex; flex:1; flex-direction:column; gap:var(--padding-15); }
.wfeat-titgrp {display:flex; flex-direction:column; gap:8px;}
.wfeat-sub { color:var(--color-primary); font-size:var(--font-size-16); font-weight:400; line-height:1.5; letter-spacing:-0.03em;}
.wfeat-tit { color:#222; font-size:var(--font-size-24); font-weight:600; line-height:1.25; letter-spacing:-0.03em;}
.wfeat-desc { color:var(--color-body); font-size:var(--font-size-18); font-weight:400; line-height:1.56; letter-spacing:-0.03em;}
.wfeat-gallery {display:flex; flex-wrap:wrap; gap:var(--padding-40); align-items:stretch; margin-top: var(--padding-50);}
.wfeat-photo {flex:1 ; max-width:100%; border:1px solid #ddd; border-radius:16px; overflow:hidden; background:#fff;}

.appfield-grid {display:grid; grid-template-columns:repeat(2, 1fr); gap:var(--padding-40);}
.appfield-card {display:flex; flex-direction:column; align-items:flex-start; gap:var(--padding-20); padding:var(--padding-40); border:1px solid #ddd; border-radius:16px; background:#fff;}
.appfield-badge {display:inline-flex; align-items:center; justify-content:center; align-self:flex-start; box-sizing:border-box; min-width:50px; padding:6px var(--padding-16); border:1px solid var(--color-primary); border-radius:999px; background:#fff5f5; color:var(--color-primary); font-size:var(--font-size-14); font-weight:600; line-height:1; letter-spacing:-0.03em; text-align:center;}
.appfield-name {color:#222; font-size:var(--font-size-24); font-weight:600; line-height:1.25; letter-spacing:-0.03em;}
.appfield-grid--detail {row-gap:var(--padding-30); column-gap:var(--padding-40);}
.appfield-grid--detail .appfield-card {gap:var(--padding-20);}
.appfield-grid--detail .appfield-body {display:flex; flex-direction:column; gap:var(--padding-15); width:100%;}
.appfield-grid--detail .appfield-desc {color:#222; font-size:var(--font-size-18); font-weight:400; line-height:1.33; letter-spacing:-0.03em;}
.appfield-grid--detail .appfield-desc p {margin:0;}
.appfield-grid--detail .appfield-parts {display:flex; align-items:center; gap:6px; margin:0; color:#505050; font-size:var(--font-size-16); font-weight:400; line-height:1; letter-spacing:-0.03em;}
.appfield-grid--detail .appfield-parts::before {content:""; flex-shrink:0; width:5px; height:5px; border-radius:50%; background:#505050;}
.appfield-grid--detail .appfield-card--full {grid-column:1 / -1;}


.strpoint-grid {display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--padding-40);}
.strpoint-card {display:flex; flex-direction:column; justify-content:space-between; gap:var(--padding-24); min-height:clamp(180px, calc( 260 / var(--inner) * 100vw ), 260px); padding:var(--padding-40); border:1px solid #ddd; border-radius:16px; background:#fff;}
.strpoint-body {display:flex; flex-direction:column; align-self:flex-start; width:100%;}
.strpoint-tit {color:#222; font-size:var(--font-size-24); font-weight:600; line-height:1.33; letter-spacing:-0.03em;}
.strpoint-sub {color:#222; font-size:var(--font-size-18); font-weight:400; line-height:1.56; letter-spacing:-0.03em;}
.strpoint-icnbx {display:flex; flex-shrink:0; align-items:center; justify-content:center; align-self:flex-end; width:clamp(40px, calc( 72 / var(--inner) * 100vw ), 72px); height:clamp(40px, calc( 72 / var(--inner) * 100vw ), 72px); border-radius:40px; background:#fff2f2;}
.strpoint-icnbx img {display:block; width:auto; height:auto; max-height:clamp(24px, calc( 32 / var(--inner) * 100vw ), 32px);}
.strpoint-grid.ty2 {grid-template-columns:repeat(2, 1fr);}

.sub2_3_link {display: flex;flex-direction: column;gap: var(--padding-30); padding: var(--padding-40); margin-bottom:var(--padding-50); border: 1px solid #DDD; background: #FAFAFA; border-radius: 16px; text-align: center;}
.sub2_3_link .textbx {display: flex;flex-direction: column;gap: var(--padding-18);}
.sub2_3_link .txt1 {font-size: var(--font-size-24); font-weight: 600;}
.sub2_3_link .txt2 {font-size: var(--font-size-18); color: var(--color-body);}
.sub2_3_link .linkbx a {display: inline-flex;align-items: center;justify-content: center;padding:12px 20px; background: var(--color-primary); color: #fff; border-radius:32px;}

.esg-container {margin-top: var(--padding-120);}
.esg-container.bg1 {background: url(../images/sub/esg-bg1.jpg) no-repeat center center / cover;}
.esg-container.bg2 {background: url(../images/sub/esg-bg2.jpg) no-repeat center center / cover;}
.esg-container.bg3 {background: url(../images/sub/esg-bg3.jpg) no-repeat center center / cover;}
.esg-container.bg4 {background: url(../images/sub/esg-bg4.jpg) no-repeat center center / cover;}
.esg-container .sub-title .maintit ,
.esg-container .sub-title .maindec  {color: #fff;}

.esg-grid {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:var(--padding-30); }
.esg-card--full {grid-column:1 / -1; min-width:0;}
.esg-card {padding:var(--padding-50); border-radius:16px; background:rgba(255,255,255,0.92);}
.esg-card__inner {display:flex; align-items:center; gap:var(--padding-30); }
.esg-card__icon {display:flex; align-items:center; justify-content:center; width:clamp(35px, calc( 50 / var(--inner) * 100vw ), 50px); height:clamp(35px, calc( 50 / var(--inner) * 100vw ), 50px); overflow:hidden;}
.esg-card__vline {width:1px; height:48px; background:#ddd;}
.esg-card__text {display:flex; flex:1; flex-direction:column; align-items:flex-start; gap:var(--padding-12); }
.esg-card__tit {color:#222; font-size:var(--font-size-24); font-weight:600; line-height:1; letter-spacing:-0.03em;}
.esg-card__sub {color:#777; font-size:var(--font-size-16); font-weight:400; line-height:1.5; letter-spacing:-0.03em;}

.esg-toptext {display: flex;flex-direction: column;gap: var(--padding-20); padding: 15px 0 var(--padding-80); text-align: center; color: #fff; letter-spacing: -0.6px; line-height: 1.5;}
.esg-toptext .toptxt {font-size:var(--font-size-24); font-weight: 600;}
.esg-toptext .btmtxt {font-size:var(--font-size-18); font-weight: 400;}