@charset "utf-8";
/* 서브공통 */
#contArea.bg-pb {padding-bottom: 0;}
.content-bg {background:linear-gradient(to top, #FAFAFA 85%, transparent 85%);}
.content-bg .contain { padding-bottom: var(--space-120);}

/********************* 회사소개 *********************/
/* 인사말 */
.greeting-content .contain {justify-content: space-between; gap: var(--space-40);}
.greeting-top { margin-bottom: var(--space-110);}
.greeting-top p {position: relative; font-size:var(--font-size-32); font-weight:700; color:var(--color-primary); line-height:1.43em; padding-left: 28px;}
.greeting-top p:before {content: ''; width: 4px; height: 69px; background: var(--color-primary); position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.greeting-desc {margin-bottom: var(--space-60);}
.greeting-desc p {font-size: var(--font-size-18); line-height:1.777em; margin-bottom: var(--space-40);}
.greeting-descp p strong {font-weight:600;}
.greeting-sign p {font-size: var(--font-size-18); line-height:1.7em;}
.greeting-sign p strong {color:var(--color-sub); font-size: var(--font-size-24); font-weight:600; margin-left: 20px;}

/* 비전 및 경영이념 */
.vision-section {padding-bottom: var(--space-110);}
.vision-tit-wrap {background: url("/images/sub/vision-bg.png") no-repeat right center / clamp(160px, calc(208 / var(--inner) * 100vw), 208px);}
.vision-tit {font-size: var(--font-size-20); font-weight:600; color:var(--color-primary); line-height:1.9em; margin-bottom: var(--space-20);}
.vision-tit.center {text-align:center;}
.vision-sub-tit {font-size: var(--font-size-32); font-weight:600; color:var(--color-sub); line-height:1.437em; }
.vision-sub-tit.center {text-align:center;}
.vision-desc {margin-top: var(--space-35); font-size: var(--font-size-18); line-height:1.777em; }

.vision-section2 {background-color:#FAFAFA; padding-top: var(--space-120);}
.vision-section .vision-card-list {display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--space-48); margin-top: var(--space-80);}
.vision-section .card {position:relative; }
.vision-section .card .num {font-size:100px; font-weight:800; color:var(--color-primary); line-height:1em;}
.vision-section .card:first-child .num {opacity: .16;}
.vision-section .card:nth-child(2) .num {opacity: .32;}
.vision-section .card:last-child .num {opacity: .48;}
.vision-img {position:relative; top: -20px;}
.vision-section .card .txt {position:absolute; bottom:0; left:0; right:0; padding:var(--space-36); color:#FFFFFF;}
.vision-section .card .tit {font-size:var(--font-size-28); font-weight:600; line-height:1.5em; margin-bottom:var(--space-10);}
.vision-section .card .desc {font-size:var(--font-size-16); font-weight:400; line-height:1.875em;}

/* 찾아오시는 길 */
.root_daum_roughmap {width: 100% !important;}
.root_daum_roughmap .wrap_map {height: 600px !important;}
.root_daum_roughmap .wrap_controllers {display: none !important;}
.map {margin-bottom: var(--space-24);}
.adress {gap: 10px; margin-bottom: var(--space-36);}
.adress p {font-size: var(--font-size-24); font-weight: 600; line-height: 1.583em;}
.lct-item-wrap {gap: var(--space-24);}
.lct-item {flex:1; display: flex; align-items: center; flex-direction: column; gap: var(--space-30); padding: var(--space-60) var(--space-20); border: 1px solid #ddd;}
.lct-item dl {display: flex; align-items: center; flex-direction: column; gap: var(--space-20);}
.lct-item dl dt {font-size: var(--font-size-24); font-weight: 600; line-height: 1.583em;}
.lct-item dl dd {font-size: var(--font-size-20); font-weight: 500; line-height: 1.7em;}


/********************* 사업분야 *********************/

.business-electrical {text-align:center;}
.business-electrical .desc {font-size:var(--font-size-32); color:var(--color-sub); font-weight: 600; line-height:1.437em; margin-bottom:var(--space-40);}
.business-electrical .desc .highlight {color:var(--color-primary);}
.business-electrical .note {font-size:var(--font-size-16); line-height:1.875em; margin-bottom:var(--space-70);}
.business-electrical .business-card-list {display:grid; grid-template-columns:repeat(2, 1fr); gap:var(--space-40); text-align:left;}
.business-card {position: relative;}
.business-card .btn-more {position: absolute; bottom: 0; right: 0;}
.business-card .img {margin-bottom:var(--space-40); transition: .3s;}
.business-card .tit {font-size:var(--font-size-28); font-weight:600; color:var(--color-sub); line-height:1.5em; margin-bottom:var(--space-30); transition:color .3s ease-in-out;}
.business-card .list {padding-right: 70px;}
.business-card .list li {position:relative; padding-left:14px; font-size:16px; line-height:1.875em;}
.business-card .list li strong {font-weight: 600;}
.business-card .list li::before {content:""; position:absolute; top: 12px; left:0; width: 4px; height: 4px; border-radius: 100%; background: var(--color-primary);}
.business-card .list li:last-child {margin-bottom:0;}
.business-card .flex {align-items:flex-end; justify-content:space-between;}
.business-card:hover .tit {color:var(--color-primary);}
.business-card:hover .btn-more {background: var(--color-primary); color:#fff;}
.business-card:hover .img {box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.08);}

/* 부스덕트 공사, 내선 전기 공사 */
.business-intro {text-align:left; padding: var(--space-48); margin-bottom:var(--space-120); background: #F8FBFA;}
.business-tit {font-size:var(--font-size-28); font-weight:600; color:var(--color-primary); line-height:1.5em; margin-bottom:var(--space-35);}
.business-desc {font-size:var(--font-size-16); color:#484848; line-height:1.875em;}
.business-section {padding:var(--space-70) 0; border-bottom:1px solid #eee;}
.business-section:nth-child(2) {border-top:2px solid #027441;}
.business-section:last-child {padding-bottom:0;}
.business-cont-tit {margin-bottom:var(--space-40);}
.business-cont-tit .tit {font-size:var(--font-size-28); font-weight:600; color:var(--color-sub); line-height:1.5em;}
.business-cont-tit .tit::before {content:""; display:inline-block; width:20px; height:18px; background:url("/images/sub/business-tit-icon.png") no-repeat center center / contain; margin-right:var(--space-16); vertical-align:middle;}

/* 적용 분야 */
.area-card-list {display:grid; grid-template-columns:repeat(4, 1fr); gap:var(--space-16);}
.area-card-list .card {display:flex; flex-direction:column; max-width: 338px;}
.area-card-list .img {position: relative;}
.area-card-list .label {position: absolute; bottom:0; left:0; right:0; padding:var(--space-24) var(--space-26); font-size:var(--font-size-20); font-weight:600; color:#fff; line-height:1.7em; background: rgba(0, 0, 0, 0.48); backdrop-filter: blur(2px);}

/* 주요 서비스 */
.service-list {display:flex; flex-direction:column; gap:var(--space-16);}
.service-list li {display:flex; align-items:flex-start; gap:var(--space-16); padding:var(--space-24); border:1px solid #ddd;}
.service-list .num {display:flex; align-items:center; justify-content:center; flex-shrink:0; width:32px; height:32px; font-size:var(--font-size-16); font-weight:600; color:#FFFFFF; background:var(--color-primary);}
.service-list .txt {font-size:var(--font-size-16); line-height:1.875em;}

/* 수행 프로세스 */
.process-list {display:grid; grid-template-columns:repeat(4, 1fr); gap:20px;}
.process-list .item {position: relative; display:flex; flex-direction:column; align-items:center; text-align:center;}
.process-list .item .icon {position: relative; margin-bottom: var(--space-16);}
.process-list .item .icon:after {content:""; position: absolute; top: 50%; right: -16px; transform: translateY(-50%); width:12px; height:12px; background:linear-gradient(45deg, #027441 -1.25%, #97C6B1 98.75%); border-radius:50%;}
.process-list .item:last-child .icon:after {display: none;}
.process-list .tit {font-size:var(--font-size-24); font-weight:600; color:var(--color-primary); line-height:1.25em; margin-bottom:var(--space-15);}
.process-list .desc {font-size:var(--font-size-16); color:#484848; line-height:1.25em;}

/* 품질 · 안전 관리 */
.quality-list {display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--space-24);}
.quality-list .card {display:flex; flex-direction:column; align-items:center; text-align:center; padding:var(--space-48); border:1px solid #DDDDDD; gap: var(--space-32);}
.quality-list .txt {font-size:var(--font-size-20); font-weight: 600; line-height:1.7em;}

/********************* 사업실적 *********************/
/* 상세페이지 */
/* 제품 상세 페이지 */
.pf-view-top {margin-bottom: var(--space-64);}
.view-tit {font-size: var(--font-size-40); font-weight:700; color:var(--color-sub); line-height:1.4em; margin-bottom: var(--space-64); text-align: left;}
.view-img {margin-bottom: 16px;}
.view-img div {position:relative; padding-bottom:44.5%; overflow:hidden;}
.view-img img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.pf-view-info {border: none; padding: 0;}
.view-info-wrap {gap: 240px; padding: var(--space-40) var(--space-48); border: 1px solid #ddd; margin-bottom: var(--space-64);}
.view-info-wrap dl {display: flex; align-items: center; gap: var(--space-24);}
.view-info-wrap dl dt {color: var(--color-primary); font-size: var(--font-size-16); font-weight: 600;}
.pf-view-editor {width: 100%; margin-bottom: var(--space-64);}

.btn-pack.com-btn {min-width: 160px; height: 60px; background: var(--color-primary); font-weight: 700; border-color: var(--color-primary); color: #fff; line-height: 58px; margin-right: 5px;}
.btn-pack.com-btn.dark {background: #222; border-color: #222;}
.btn-pack.com-btn.xlarge {min-width: 160px; font-size: 16px;}
.buttons.view-buttons {margin: 0;}

/********************* 커뮤니티 *********************/
/********************* 고객센터 *********************/