@charset "utf-8";
/* 서브공통 */
/* 슬라이드 버튼 */
.com-nav {position: absolute; bottom: var(--space-16); 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/compet-arrow.svg) no-repeat center / contain;}
.com-prev {left: var(--space-16);}
.com-next {right: var(--space-16);}

/********************* 회사소개 *********************/
/* 인사말 */
.greeting-image {margin-bottom: var(--space-60); border-radius: var(--radius-24); overflow: hidden;}
.greeting-image img {min-height: 120px; height: 100%; object-fit: cover;}
.greeting-text {gap: var(--space-85);}
.greeting-title {width: clamp(350px, calc(500 / var(--inner) * 100vw), 500px); font-size: var(--font-size-32); font-weight: 600; line-height: 1.43em; color: #222; letter-spacing: -0.03em;}
.greeting-title strong {color: var(--color-primary);}
.greeting-desc {gap: var(--space-30); font-size: var(--font-size-16); color: #484848; line-height: 1.87em; margin-bottom: var(--space-30); letter-spacing: -0.03em;}
.greeting-signature p {font-size: var(--font-size-18); font-weight: 600; line-height: 1.777em; color: #484848; }

/* 비전 및 경영이념 */
.vision-content .top-img {margin-bottom: var(--space-100); border-radius: var(--radius-24); overflow: hidden;}
.vision-content .top-img img {min-height: 130px; height: 100%; object-fit: cover;}
.vision-content {display: flex; flex-direction: column; width: 100%;}
.vision-content .intro {display: flex; flex-direction: column; gap: var(--space-25); width: 100%; margin-bottom: var(--space-80);}
.vision-content .intro .lbl {margin: 0; font-size: var(--font-size-20); font-weight: 600; line-height: 1.7em; letter-spacing: -0.03em; color: #999;}
.vision-content .intro .head {display: flex; flex-direction: column; gap: 0; width: 100%; font-size: var(--font-size-32); letter-spacing: -0.03em; color: #242424;}
.vision-content .intro .head .line {margin: 0; font-weight: 600; line-height: 1.4375em;}
.vision-content .intro .head .line .brand {display: inline-block; font-weight: 700; color: var(--color-primary);}
.vision-content .intro .head .line .rest {font-weight: 600;}
.vision-content .card-list {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-24); width: 100%; max-width: 1440px; margin: 0 auto var(--space-20); padding: 0; list-style: none;}
.vision-content .card-list .item {min-width: 0;}
.vision-content .card-list .box {display: flex; flex-direction: column; position: relative; width: 100%; height: 100%; filter: drop-shadow(0 0 24px rgba(28, 74, 159, 0.08))}
.vision-content .card-list .img {margin: 0; width: 100%; border-radius: var(--radius-24) var(--radius-24) 0 0; overflow: hidden;}
.vision-content .card-list .img img {display: block; width: 100%; height: 100%; object-fit: cover;}
.vision-content .card-list .body {flex: 1; position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: var(--space-80) var(--space-30) var(--space-45); background: #fff; border-radius: 0 0 var(--radius-24) var(--radius-24); text-align: center;}
.vision-content .card-list .ico {position: absolute; top: 0; left: 50%; z-index: 2; width: 100px; height: 100px; transform: translate(-50%, -50%);}
.vision-content .card-list .tit {margin: 0; width: 100%; font-size: var(--font-size-24); font-weight: 600; line-height: 1.583em; letter-spacing: -0.03em; color: #242424;}
.vision-content .card-list .desc {width: 100%; font-size: var(--font-size-16); line-height: 1.875em; letter-spacing: -0.03em; color: #454545;}
.vision-content .card-list .desc p {margin: 0;}
.vision-content .deco {display: flex; justify-content: center; width: 100%; margin: 0 auto var(--space-40); padding: 0;}
.vision-content .closing {display: flex; flex-direction: column; align-items: center; gap: 0; width: 100%; max-width: 1440px; margin: 0 auto; padding: var(--space-80) var(--space-30); background: #f0f5ff; border-radius: var(--radius-24); text-align: center;}
.vision-content .closing .line {margin: 0; font-size: var(--font-size-32); line-height: 1.4375em; font-weight: 500; letter-spacing: -0.03em; color: #242424;}
.vision-content .closing .brand {font-weight: 700; color: var(--color-primary);}
.vision-content .closing .em {font-weight: 700;}

/* 회사 연혁 */
.history-wrap {position: relative;}
.history-wrap .bar {position: absolute; z-index: 1; width: 1px; margin: 0; padding: 0; background: #dfdfdf; pointer-events: none;}
.history-item .history-year {position: relative; z-index: 2; display: flex; align-items: center; gap: 40px; font-size: var(--font-size-24); font-weight: 600; line-height: 1.66em; color: #2c2c2c;}
.history-txt {margin-bottom: var(--space-40);}
.history-txt .tit {display: block; font-size:var(--font-size-24); font-weight:600; line-height:1em; color:#505050; margin-bottom: 15px;}
.history-txt .tit-year {display: block; font-size:var(--font-size-48); font-weight:700; line-height:1.25em; color:#1C4A9F;}
.history-item-wrap {display: flex; gap: var(--space-140); margin-bottom: 90px;}
.history-item-wrap:last-child {margin-bottom: 0;}
.history-item-box {padding-top: 170px;}
.history-img-wrap {flex-shrink: 0; width: clamp(350px, calc(586 / 1400 * 100vw), 586px);}
.history-img {border-radius: var(--radius-24); overflow: hidden;}
.history-item {padding-bottom:30px; display:flex; align-items: start;}
.history-item:last-child {padding-bottom:0;}
.history-item .history-year:before {content: ""; width: 16px; height: 16px; background: #fff; border-radius: 50%; border: 5px solid #1C4A9F;}
.history-month-box {padding-left:80px; flex:1;}
.history-detail li {font-size:var(--font-size-20); line-height:2.3em; color:#121212;}
.history-detail li.strong {color: var(--color-primary);}

/* 찾아오시는길 */
.root_daum_roughmap {width: 100% !important;}
.root_daum_roughmap .wrap_map {height: 578px !important;}

.location-section {align-items: center;}
.location-section .map {flex: 1; max-width: 766px; min-width: 0; border-radius: var(--radius-24); overflow: hidden;}
.location-section .lct-info {display: flex; flex-direction: column; gap: var(--space-60); padding: var(--space-20) 0;}
.location-section .lct-head {margin: 0; font-size: var(--font-size-32); font-weight: 600; line-height: 1.4375em; letter-spacing: -0.03em; color: #242424;}
.location-section .lct-head .brand {color: var(--color-primary);}
.location-section .lct-list {display: flex; flex-direction: column; gap: var(--space-30); margin: 0; padding: 0; list-style: none;}
.location-section .lct-list .row {display: flex; align-items: center; gap: var(--space-36);}
.location-section .ico-wrap {display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: clamp(50px, calc(72 / var(--inner) * 100vw), 72px); height: clamp(50px, calc(72 / var(--inner) * 100vw), 72px);}
.location-section .txt {display: flex; flex-direction: column; gap: 6px; min-width: 0;}
.location-section .lbl {margin: 0; font-size: var(--font-size-20); font-weight: 600; line-height: 1.7em; letter-spacing: -0.03em; color: #a8a8a8;}
.location-section .val {margin: 0; font-size: var(--font-size-20); font-weight: 500; line-height: 1.7em; letter-spacing: -0.03em; color: #2c2c2c;}

/********************* 사업분야 *********************/
.business-section {display: flex; align-items: center; gap: var(--space-120); width: 100%;}
.business-section .img {flex-shrink: 0; width: clamp(280px, calc(586 / var(--inner) * 100vw), 586px); margin: 0; aspect-ratio: 586 / 720; border-radius: var(--radius-24); overflow: hidden;}
.business-section .detail {display: flex; flex-direction: column; gap: var(--space-50); flex: 1; min-width: 0;}
.business-section .intro {display: flex; flex-direction: column; gap: var(--space-15);}
.business-section .intro .lbl {margin: 0; font-size: var(--font-size-20); font-weight: 500; line-height: 1.7em; letter-spacing: -0.03em; color: #a8a8a8;}
.business-section .intro .head {font-size: var(--font-size-40); font-weight: 700; line-height: 1.4em; letter-spacing: -0.03em; color: #222;}
.business-section .intro .head .em {color: var(--color-primary);}
.business-section .body {display: flex; flex-direction: column; gap: var(--space-70);}
.business-section .check-list {display: flex; flex-direction: column; gap: var(--space-20); margin: 0; padding: 0; list-style: none;}
.business-section .check-list li {display: flex; align-items: flex-start; gap: var(--space-8); position: relative; padding-left: 28px;}
.business-section .check-list li:before {content: ""; position: absolute; top: 4px; left: 0; width: 20px; height: 20px; background: url(../images/sub/biz-chk.svg) no-repeat center / contain;}
.business-section .check-list p {font-size: var(--font-size-16); line-height: 1.875em; letter-spacing: -0.03em; color: #484848;}
.business-section .acts {display: flex; flex-wrap: wrap; gap: var(--space-16);}

/********************* 제조경쟁력 및 보유설비 *********************/
/* 제조 경쟁력 */
.compet {display: flex; flex-direction: column; align-items: center; gap: var(--space-100); width: 100%;}
.compet-hero {display: flex; flex-direction: column; align-items: center; gap: var(--space-22); width: 100%; text-align: center;}
.compet-hero .ico {width: 56px; height: 56px; margin: 0;}
.compet-hero .ico img {display: block; width: 100%; height: 100%; object-fit: contain;}
.compet-hero .intro {display: flex; flex-direction: column; align-items: center; gap: var(--space-36); width: 100%;}
.compet-hero .head {margin: 0; font-size: var(--font-size-40); font-weight: 700; line-height: 1.4em; letter-spacing: -0.03em; color: #222;}
.compet-hero .head .years {color: #6483bd;}
.compet-hero .lead {margin: 0; max-width: 42em; font-size: var(--font-size-18); line-height: 1.67em; letter-spacing: -0.03em; color: #484848;}
.compet-stack {display: flex; flex-direction: column; align-items: center; gap: var(--space-80); width: 100%; max-width: 1400px;}
.compet-row {display: flex; align-items: center; justify-content: center; gap: var(--space-120); width: 100%; padding-bottom: var(--space-80); border-bottom: 1px dashed #ddd;}
.compet-row:last-child {padding-bottom: 0; border-bottom: none;}
.compet-row.rev {flex-direction: row-reverse;}
.compet-row .txt {position: relative; flex: 1; display: flex; flex-direction: column; gap: var(--space-60); min-width: 0; max-width: 611px;}
.compet-row .water {position: absolute; left: 90px; top: 15px; z-index: 0; margin: 0; font-size: var(--font-size-48); font-weight: 700; line-height: 1; letter-spacing: -0.03em; color: rgba(238, 238, 238, 0.8); white-space: nowrap; pointer-events: none;}
.compet-row .tit-wrap {position: relative; z-index: 1; display: flex; flex-direction: column; gap: var(--space-10);}
.compet-row .step {margin: 0; font-size: var(--font-size-20); font-weight: 600; line-height: 1.7em; letter-spacing: -0.03em; color: var(--color-primary);}
.compet-row .tit {margin: 0; font-size: var(--font-size-48); font-weight: 700; line-height: 1.17em; letter-spacing: -0.03em; color: #2c2c2c;}
.compet-row .desc {margin: 0; position: relative; z-index: 1; max-width: 585px; font-size: var(--font-size-24); font-weight: 500; line-height: 1.583em; letter-spacing: -0.03em; color: #676767;}
.compet-row .desc p {margin: 0;}
.compet-gallery {position: relative; flex-shrink: 0; width: clamp(280px, calc(586 / var(--inner) * 100vw), 586px);}
.compet-gallery .compet-swiper {width: 100%; height: 100%; border-radius: var(--radius-24); overflow: hidden;}
.compet-gallery .swiper-slide .img {width: 100%; border-radius: var(--radius-24); overflow: hidden;}
.com-next .nav-arr {transform: rotate(180deg);}

/* 보유설비 */
.equip {display: flex; flex-direction: column; align-items: stretch; gap: var(--space-120); width: 100%;}
.equip .band {position: relative; display: flex; flex-direction: column; width: 100%;}
.equip .hero {position: relative; width: 100%; height: clamp(220px, calc(380 / var(--inner) * 100vw), 380px); border-radius: var(--radius-24); overflow: hidden;}
.equip .hero .img {width: 100%; height: 100%; margin: 0; border-radius: var(--radius-24); overflow: hidden;}
.equip .hero .img img {display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 28%;}
.equip .slogan {position: absolute; left: 50%; top: 50%; z-index: 1; margin: 0; max-width: calc(100% - var(--space-40)); padding: 0 var(--space-20); transform: translate(-50%, -50%); font-size: var(--font-size-50); font-weight: 700; line-height: 1.2em; letter-spacing: -0.03em; text-align: center; color: #fff;}
.equip .slogan .dim {color: rgba(255, 255, 255, 0.5);}
.equip .block {display: flex; flex-direction: column; align-items: stretch; gap: var(--space-80); width: 100%;}
.equip .intro {display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-40); width: 100%;}
.equip .intro .en {margin: 0; font-size: var(--font-size-20); font-weight: 500; line-height: 1.7em; letter-spacing: -0.03em; color: #a8a8a8;}
.equip .intro .tit {margin: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 0; font-size: var(--font-size-32); font-weight: 600; line-height: 1.44em; letter-spacing: -0.03em; color: var(--color-sub);}
.equip .intro .tit .point {color: var(--color-primary);}
.equip .equip-list {width: 100%; overflow: hidden;}
.equip .equip-list ul {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-70) var(--space-24); margin: 0; padding: 0; list-style: none;}
.equip .equip-list .item {display: flex; flex-direction: column; align-items: center; gap: var(--space-20);}
.equip .equip-list .item .img {width: 100%; margin: 0; border-radius: var(--radius-24); overflow: hidden;}
.equip .equip-list .item .tit {margin: 0; width: 100%; font-size: var(--font-size-24); font-weight: 600; line-height: 1.58em; letter-spacing: -0.03em; color: var(--color-sub); text-align: center;}

/********************* 사업실적 *********************/
.performance-list {padding:40px 0 0 0; border-top:2px solid #686868;}
.performance-list ul {display:flex; flex-wrap:wrap; margin:0 -30px;}
.performance-list ul li {width:33.333%; padding:0 30px; margin-bottom:50px; text-align:center;}
.performance-list ul li.none {width:100%; padding:70px 0; margin:0; text-align:center; color:#767676;}
.performance-list ul li a {display:block;}
.performance-list ul li .thumb {position:relative; padding-bottom:118%; margin-bottom:21px; border-radius: var(--radius-16); overflow:hidden;}
.performance-list ul li .thumb 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;}
.performance-list ul li a:hover img {transform:translateY(-50%) scale(1.1);}
.performance-list ul li .info {display:flex; align-items: center; justify-content: space-between; width: 100%;}
.performance-list ul li .info .arrow {width: 56px; height: 56px; background: url(../images/sub/perform-arrow.png) no-repeat center / contain;}
.performance-list ul li .tit {color:#222; font-size:24px; font-weight: 600; line-height:1.583em; text-align: left; transition: .4s;}
.performance-list ul li a:hover .tit {color:var(--color-primary);}
.performance-list ul li .date {color:#999; font-size:20px; line-height:1.7em; margin-top:4px; text-align: left; transition: .4s;}
.performance-list ul li a:hover .date {color:var(--color-primary);}

/* 상세페이지 */
.performance-summary {display:flex; margin-bottom:80px;}
.performance-image {width:580px; margin-right:60px;}
.performance-image .perform-view-swiper {position: relative; width: 100%;  border-radius: var(--radius-24); overflow: hidden;}
.performance-image .swiper-slide .img {position:relative; margin: 0; padding-bottom:117%; overflow:hidden;}
.performance-image .swiper-slide .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;}
.performance-image .perform-slide-btn {position: absolute; top: 50%; z-index: 3; width: 48px; height: 48px; background: rgba(255, 255, 255, 0.24); backdrop-filter: blur(12px); border-radius: 12px; cursor: pointer;}
.performance-image .perform-prev {left: var(--space-16);}
.performance-image .perform-next {right: var(--space-16);}
.performance-image .perform-next .nav-arr {transform: rotate(180deg);}
.performance-info {flex:1 1 auto; min-width:0; width:1%;}
.performance-info .tit {color:#222; font-size:36px; font-weight: 600; line-height:1.3em; padding:20px 0 35px; margin-bottom:38px; border-bottom:1px solid #eee;}
.performance-info .txt {display: flex; flex-direction: column; gap: var(--space-30); padding-bottom: 40px; margin-bottom: 48px; border-bottom:1px solid #eee;}
.performance-info .txt dl dt {font-size: var(--font-size-18); font-weight: 600; line-height: 1.7em; letter-spacing: -0.03em; color: var(--color-primary); margin-bottom: 4px;}
.performance-info .txt dl dd {font-size: var(--font-size-20); line-height: 1.7em; letter-spacing: -0.03em; color: #484848;}
.perform-btn {display: flex; align-items: center; justify-content: center; width: 100%; height: 78px; background: #222; color: #fff; font-size: var(--font-size-20); font-weight: 600; line-height: 1.5em; letter-spacing: -0.03em; border-radius: var(--radius-16);}
.perform-editor {margin-bottom: 64px;}
.perform-view-swiper .com-nav {bottom: var(--space-24);}
.perform-view-swiper .com-prev {left: var(--space-24);}
.perform-view-swiper .com-next {right: var(--space-24);}

/********************* 커뮤니티 *********************/
.board-form .input {border-radius: 8px;}
.form-agree .scroll-box {border-radius: 8px;}
.btn-pack.xlarge.inq-btn { min-width: 160px !important; font-size: var(--font-size-16) !important; border-radius: var(--radius-8);}
.form-agree .checkbox label:before {border-radius: 4px;}
.faq li.active .tit {border-bottom: 1px solid #ddd;}
.faq .btn-pack {border-radius: 4px;}
/********************* 고객센터 *********************/