@charset "utf-8";

/********************* about *********************/
/* 인사말 */
.greeting-image {margin-bottom: var(--space-60);}
.greeting-title {max-width: 950px; font-size: var(--font-size-28); font-weight: 500; line-height: 1.39em; color: #242424; margin-bottom: var(--space-45);}
.greeting-title strong {color: #C1232A; font-weight: 700;}
.greeting-desc {gap: var(--space-30); font-size: var(--font-size-16); color: #454545; line-height: 1.5em; font-weight: 500;}
.greeting-signature {text-align: right;}
.greeting-signature p {font-size: var(--font-size-16); font-weight: 600; line-height: 1.5em; color: #000; }

/* 회사 연혁 */
.history-top { width: 100%; background: url(../images/sub/sub1-2-img.jpg) no-repeat center center / cover; min-height: 282px; border-radius: var(--radius-16); overflow: hidden; text-align: center;}
.history-top .since {font-size: var(--font-size-24); font-weight: 700; line-height: 1em; color: #242424; }
.history-top h3 {font-size: var(--font-size-40); font-weight: 700; color: #C1232A; margin-bottom: 20px;}
.history-top-desc {font-size: var(--font-size-18); font-weight: 700; line-height: 1.33em; color: #242424; }

.history {position:relative; }
.start-dot {position:absolute; top:-15px; left:50%; transform: translateX(-50%); width:30px; height:30px; background: #fff; border-radius: 100%; z-index: 1;}
.start-dot .dot-inner {position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:10px; height:10px; background: #C1232A; border-radius: 100%;}
.history .group {position:relative; padding-top: 20px; padding-bottom:58px;}
.history .group:before {content:""; position:absolute; left:50%; top:0; bottom:0; width:1px; background:#ddd;}
.history .group:last-child {margin-bottom:0;}
.history .group h3 {position:relative; font-size:var(--font-size-32); font-weight:700; color:var(--color-sub); line-height:1em; margin-bottom:10px; z-index:2;}
.history .group ul {position: relative;}
.history .group ul:before {content:""; position:absolute; top:2px; width:20px; height:20px; background: url(../images/sub/history-dot.png) no-repeat center center / contain;}
.history .group ul li {position:relative; color:#000; font-size:var(--font-size-16); font-weight: 400; line-height:1.5em;}
.history .group ul li:before {content:""; position:absolute; top:10px; width:3px; height:3px; background:#454545; border-radius:100%;}
.history .group ul li:last-child {margin-bottom:0;}
.history .group ul li .month {position:absolute; top:0; color:#C1232A; font-weight:700;}
.history .group ul li:first-of-type .month:before {content:""; position:absolute; top:50%; transform: translateY(-50%); width:64px; height:1px; background:#ddd;}
.history .group:nth-child(1) {padding-top: 52px;}
.history .group:nth-child(odd) {padding-left:50%;}
.history .group:nth-child(odd) h3 {padding-left:90px;}
.history .group:nth-child(odd) ul:before {left:-10px;}
.history .group:nth-child(odd) ul {padding-left:90px;}
.history .group:nth-child(odd) ul li {padding-left:35px;}
.history .group:nth-child(odd) ul li .month {left:0;}
.history .group:nth-child(odd) ul li:first-of-type .month:before {left:-78px;}
.history .group:nth-child(odd) ul li:before {left:25px;}
.history .group:nth-child(even) {padding-right:50%; text-align:right;}
.history .group:nth-child(even) h3 {padding-right:90px;}
.history .group:nth-child(even) ul:before {right:-10px; }
.history .group:nth-child(even) ul {padding-right:90px;}
.history .group:nth-child(even) ul li {padding-right:35px;}
.history .group:nth-child(even) ul li .month {right:0;}
.history .group:nth-child(even) ul li:first-of-type .month:before {right:-78px;}
.history .group:nth-child(even) ul li:before {right:25px;}

.history {--history-dot-size:20px; --history-dot-top:2px;}
.history.history--trim-last .group.is-history-last:before {bottom:auto; height:var(--history-line-end);}


/* 면허 인증 및 현황 */
.license-tab {margin-bottom:var(--space-60); }
.license-tab ul {display:flex; border: 1px solid #ddd;}
.license-tab ul li {position: relative; flex:1; height: 58px; background:#fff; border-right: 1px solid #ddd;}
.license-tab ul li:last-child {border-right: 0;}
.license-tab ul li a {display:flex; justify-content:center; align-items:center; width:100%; height: 100%; padding: 0 20px; color:#505050; text-align:center; font-size:var(--font-size-18); line-height: 1.2em;}
.license-tab ul li.active {background:#C1232A;}
.license-tab ul li.active a {color:#fff; }
.license-tab-slider .slider {position:relative; text-align:center;}
.license {display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-50) var(--space-40);}
.ls-img-wrap {width: 100%; position: relative; border: 1px solid #ddd; margin-bottom: var(--space-30);background: #fff;}
.ls-img-wrap > div {position: relative; padding-bottom: 129%; display: block; overflow: hidden;}
.ls-img-wrap > div img {position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; object-fit: contain; max-width: 68%; max-height: 69%; transform: translate(-50%, -50%);}
.ls-tit {font-size: var(--font-size-18); line-height: 1.666em; color: #454545; text-align: center;}

/* 찾아오시는 길 */
.map-wrap {position: relative;}
.root_daum_roughmap {width: 100% !important;}
.root_daum_roughmap .wrap_map {height: 440px !important;}
.root_daum_roughmap .wrap_controllers {display: none !important;}
.drc-info {display: flex; justify-content: center; gap: 36px; padding: var(--space-50) 0 var(--space-100) 130px;}
.drc-info dl {display: flex; align-items: center; gap: 20px;}
.drc-info dl dt:before {content: ""; display: block; width: 6px; height: 6px; background: #C1232A;}
.drc-info dl dt {display: flex; align-items: center; gap: 14px; font-size: var(--font-size-18); font-weight: 600; color: #C1232A;}
.drc-info dl dd {font-size: var(--font-size-16); color: #242424;}
.drc-adress {position: absolute; bottom: 0; left: 30px; max-width: 340px; font-size: var(--font-size-24); line-height: 1.33em; color: #fff; background: #C1232A; padding: 40px 45px 40px 40px; z-index: 1; font-weight: 600;}
.drc-adress p.small {font-size: 17px; color: #fff; margin-bottom: 70px; font-weight: 400; }

/********************* 사업소개 *********************/
/* 커튼월 */
#contArea.wide.cw-wide {padding-bottom: 0;}
.cw-def {background:linear-gradient(#fafafa,#fafafa) bottom left / max(1400px, calc(100vw * 1630 / 1920)) 93% no-repeat; margin-bottom: var(--space-100);}
.cw-def-reverse {background-position: bottom right;}
.cw-def:last-child {margin-bottom: 0;}
.cw-def-inner {display:flex; align-items:flex-start; gap:var(--space-90); padding-bottom: var(--space-130);}
.cw-def-reverse .cw-def-inner {flex-direction: row-reverse;}
.cw-def-media {flex:0 0 auto; width:clamp(400px, calc(650 / var(--inner) * 100vw), 650px);}
.cw-def-content {flex:1; display:flex; flex-direction:column; gap:var(--space-50); padding-top: var(--space-40);}
.cw-def-reverse .cw-def-content {flex: unset;}
.cw-def-title {display: inline-block; position: relative; font-size:var(--font-size-32); font-weight:700; line-height:1.2em; color:#C1232A; margin-bottom: var(--space-30);}
.cw-def-title:before {content: ''; position: absolute; top: -5px; right: -10px; width: 10px; height: 10px; background: url(../images/sub/sub2-dot.png) no-repeat center center / contain;}
.cw-def-text {font-size:var(--font-size-16); font-weight:400; line-height:1.56em; color:#454545; padding-right: 15px;}
.cw-def-text {padding-right: 55px;}
.cw-def-divider {width:1px; height:clamp(40px, calc(68 / var(--inner) * 100vw), 68px); background:#BEBCBC;}
.cw-def-list li {font-size:var(--font-size-16); font-weight:400; line-height:1.56em; color:#454545; padding-left:var(--space-16); position:relative;}
.cw-def-list li:before {content:"·"; position:absolute; left:0; top:0; color:#242424; font-weight:700;}

/********************* 시공실적 *********************/
.btn-pack.medium.com-btn {min-width: 86px !important;}

/* 상세페이지 */
.ct-view-top {display: flex; align-items: flex-start; gap: var(--space-90); margin-bottom: var(--space-100);}
.slide-wrap { flex: 1; max-width: 678px;}
.ct-board-swiper .thumb { position: relative; padding-bottom: 67%; display: block; border: 1px solid #ddd; overflow: hidden;}
.ct-board-swiper .thumb img { position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; object-fit: contain ; transform: translate(-50%, -50% );}
.ct-board-swiper { width: 100%; margin-bottom: 30px; }
.ct-thumb-swiper { width: 100%; }
.ct-thumb-swiper .swiper-slide { cursor: pointer;}
.ct-thumb-swiper .thumb {position: relative; padding-bottom: 66%; display: block; overflow: hidden;}
.ct-thumb-swiper .thumb img { position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; object-fit: contain ; max-width: 100%; max-height: 100%; transform: translate(-50%, -50% );}
.ct-thumb-swiper .thumb img {opacity: 0.5;}
.swiper-slide-thumb-active .thumb img {opacity: 1;}
.ct-thumb-swiper .thumb::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border: 1px solid #ddd; }
.ct-thumb-swiper .swiper-slide.swiper-slide-thumb-active .thumb::after { border: 2px solid #C1232A;}
.ct-view-info {flex: 1;}
.ct-view-info .tit {font-size: var(--font-size-32); font-weight: 600; color: #242424; margin-bottom: var(--space-60); line-height: 1.12em;}

.ct-view-desc {padding-bottom: var(--space-40);}
.ct-view-desc .desc-tit {font-size: var(--font-size-24); color: #454545; line-height: 1.16em; padding-bottom: var(--space-20); border-bottom: 1px solid #454545;}
.ct-view-desc .desc-txt {font-size: var(--font-size-20); color: #454545; line-height: 1.4em; margin-top: 12px; }
.ct-board-view .back-btn {display: inline-flex; align-items: center; justify-content: center; min-width: 150px; height: 55px; font-size: 20px; font-weight: 600; margin: 0 auto;}