@charset "utf-8";
/* ==========================================================================
   KUKDO Trading — sub.css (서브 공통 + COMPANY)
   2026-09-28 용재 / 피그마 aB00ULWDedWQexCskEYmrv 서브 시안 기준
   표준: .container 오버라이드 금지 · 색상 var() · MQ는 각 컴포넌트 바로 아래
   ========================================================================== */

/* --------------------------------------------------------------------------
 * 서브 공통 — 헤더 (서브는 흰 배경 위 고정 헤더: isFixed와 동일 톤)
 * -------------------------------------------------------------------------- */
.page-sub .header {background-color: var(--bs-white); border-color: var(--bs-gray-200);}
.page-sub .header .nav-link,
.page-sub .header .util-link,
.page-sub .header .btn {color: var(--bs-dark);}
.page-sub .header .bi {color: var(--bs-dark);}
.page-sub .header .dropdown-toggle {color: var(--bs-dark);}
.page-sub .header .navbar-brand .logo-dark {display: block;}
.page-sub .header .navbar-brand .logo-wh {display: none;}
.page-sub .header .navbar-brand .logo-txt {color: var(--bs-secondary);}
.page-sub .header .navbar-brand .logo-txt small {color: var(--bs-gray-666);}

/* --------------------------------------------------------------------------
 * 서브 히어로 (시안: 브레드크럼 우측 + 1720x600 r10 카드 · 오버레이 #000 30%
 *  · 라벨 24/500 상단 · 타이틀 64/700 하단) — basic.css 레거시 .sub-visual 미사용
 * -------------------------------------------------------------------------- */
.sub-hero {padding-top: 100px; padding-bottom: 0;}
.sub-hero .location {letter-spacing:0; display: block; margin: 1rem 0; font-size: 0.8125rem;}
.sub-hero .location ul {justify-content: flex-end; color: var(--bs-gray-666);}
.sub-hero .location ul li:last-child {margin-right:0; color: var(--bs-body-color); font-weight: 700;}
.sv-card {position: relative; border-radius: 10px; overflow: hidden; background: center / cover no-repeat; color: var(--bs-white); display: flex;}
.sv-card::before {content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, 0.3);}
.sv-inner {position: relative; z-index: 1; flex: 1; min-height: clamp(320px, 40vw, 600px); padding: clamp(2rem, 4vw, 3.75rem) clamp(4%, 6vw, 6.25rem); display: flex; flex-direction: column; justify-content: space-between;}
.sv-card .sv-label {font-size: clamp(1rem, 0.5357rem + 2.0635vw, 1.5rem); font-weight: 500; margin: 0;}
.sv-card .sv-title {font-size: clamp(1.875rem, 0.6607rem + 5.3968vw, 4rem); font-weight: 700; line-height: 1.25; margin: 2rem 0 0; color: var(--bs-white);}
@media (min-width: 1200px) {
    .sv-card .sv-label {font-size: 1.5rem;}
    .sv-card .sv-title {font-size: 4rem;}
}

/* --------------------------------------------------------------------------
 * 서브 공통 타이포 (시안: 섹션 타이틀 36/800 · 본문 18/300 lh30)
 * -------------------------------------------------------------------------- */
.sub-tit {font-size: clamp(1.5rem, 1.1786rem + 1.4286vw, 2.25rem); font-weight: 800; margin: 0 0 1.875rem;}
@media (min-width: 1200px) {
    .sub-tit {font-size: 2.25rem;}
}
.sub-body { font-weight: 300; line-height: 1.67;}
.sub-body p {margin: 0 0 1.875rem;}
.sub-body p:last-child {margin-bottom: 0;}

.sub-max {max-width:1520px; margin:0 auto;}

/* --------------------------------------------------------------------------
 * COMPANY — CEO Message (본문 18/300 · 서명 18/700)
 * -------------------------------------------------------------------------- */
.ceo-section .ceo-sign {margin: 3.125rem 0 0; font-weight: 700;}
.ceo-section .sub-body {max-width:1520px; margin:0 auto;}


/* --------------------------------------------------------------------------
 * COMPANY — 회사소개 · 유통에서 제조까지 (원 300px x4 · 아이콘 48 · 라벨 28/700)
 * -------------------------------------------------------------------------- */
.about-flow .flow-list {--flow-c2: #0350b4; --flow-c3: #0c2578; --flow-c4: #000000; display: flex; justify-content: center; flex-wrap: wrap; gap: clamp(1.25rem, 4.1vw, 5rem); list-style: none; padding: 0; margin: 0 0 3.125rem;}
.about-flow .flow-item {width: clamp(160px, 15.6vw, 300px); aspect-ratio: 1 / 1; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.5rem; color: var(--bs-white); text-align: center;}
.about-flow .flow-item img {width: clamp(32px, 2.5vw, 48px); height: auto;}
.about-flow .flow-item span {font-size: clamp(1.125rem, 1.46vw, 1.75rem); font-weight: 700;}
.about-flow .flow-01 {background-color: var(--bs-primary);}
.about-flow .flow-02 {background-color: var(--flow-c2);}
.about-flow .flow-03 {background-color: var(--flow-c3);}
.about-flow .flow-04 {background-color: var(--flow-c4);}
@media (max-width: 768px) {
    .about-flow .flow-list {gap: 1rem;}
    .about-flow .flow-item {width: calc(50% - 0.5rem);}
}

/* --------------------------------------------------------------------------
 * COMPANY — 회사소개 · 주요 사업영역 (카드 294x430 r10 x5 · 간격 12
 *  · EN 라벨 16/500 primary · 타이틀 18/700)
 * -------------------------------------------------------------------------- */
.about-biz .biz-list {display: grid; grid-template-columns: repeat(5, 1fr); gap: 1.5rem 12px;}
.about-biz .biz-thumb {border-radius: 10px; overflow: hidden; aspect-ratio: 294 / 430;}
.about-biz .biz-thumb img {width: 100%; height: 100%; object-fit: cover;}
.about-biz .biz-label {margin: 1.25rem 0 0; font-size: 1rem; font-weight: 500; color: var(--bs-primary);}
.about-biz .biz-tit {margin: 0.375rem 0 0;  font-weight: 700; }
@media (max-width: 1200px) {
    .about-biz .biz-list {grid-template-columns: repeat(3, 1fr);}
}
@media (max-width: 768px) {
    .about-biz .biz-list {grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 576px) {
    .about-biz .biz-list {grid-template-columns: 1fr;}
    .about-biz .biz-thumb {aspect-ratio: 3 / 2;}
}

/* --------------------------------------------------------------------------
 * COMPANY — 회사소개 · Our Value (1720x800 r10 · 오버레이 #000 30%
 *  · 라벨 36/800 · 타이틀 64/700 · 본문 18/700 · 브랜드 우하단 28/700+18/700)
 * -------------------------------------------------------------------------- */
.about-value .value-card {position: relative; border-radius: 10px; overflow: hidden; background: center / cover no-repeat; color: var(--bs-white);}
.about-value .value-card::before {content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, 0.3);}
.about-value .value-inner {position: relative; z-index: 1; min-height: clamp(420px, 41.7vw, 800px); padding: clamp(4rem, 7.8vw, 9.375rem) clamp(4%, 5.2vw, 6.25rem) clamp(4rem, 3.1vw, 3.75rem); display: flex; flex-direction: column; justify-content: flex-start;}
.about-value .value-label {font-size: clamp(1.5rem, 1.1786rem + 1.4286vw, 2.25rem); font-weight: 800; margin: 0;}
.about-value .value-tit {font-size: clamp(2.25rem, 1.0714rem + 5.2381vw, 4rem); font-weight: 700; line-height: 1.25; margin: 1.5rem 0 0; color: var(--bs-white);}
.about-value .value-desc { font-weight: 700; line-height: 1.67; margin: 2rem 0 0; }
.about-value .value-brand {margin-top: auto; padding-top: 2rem; align-self: flex-end; text-align: right;}
.about-value .value-brand strong {display: block;font-size: clamp(1rem, 0.8929rem + 0.4762vw, 1.25rem); font-weight: 700;}
.about-value .value-brand strong.fs-28 {font-size: clamp(1.25rem, 0.9643rem + 0.9524vw, 1.75rem);}
.about-value .value-brand span {font-weight: 700;}
@media (min-width: 1200px) {
    .about-value .value-label {font-size: 2.25rem;}
    .about-value .value-tit {font-size: 4rem;}
}

/* --------------------------------------------------------------------------
 * PRODUCTS — 제품 리드 문단 (시안: 22/700 lh32)
 * -------------------------------------------------------------------------- */
.prod-lead {font-size: clamp(1.0625rem, 0.8839rem + 0.5952vw, 1.375rem); font-weight: 700; line-height: 1.45; margin: 0 0 3.125rem;}
@media (min-width: 1200px) {
    .prod-lead {font-size: 1.375rem;}
}

/* --------------------------------------------------------------------------
 * PRODUCTS — 제품 테이블 (시안: 헤더 50px rgba(12,37,120,.2) r5 · 행 50px
 *  짝수행 #edf0f8 r5 · 18/300 lh30 · 하단 라인 #ddd · 모바일 가로 스크롤)
 * -------------------------------------------------------------------------- */
.prod-group + .prod-group {margin-top: clamp(3.75rem, 7.8vw, 9.375rem);}
.prod-table-wrap {overflow-x: auto; -webkit-overflow-scrolling: touch;}
.prod-table {width: 100%;  border-collapse: separate; border-spacing: 0; text-align: left; margin: 0;}
.prod-table th,
.prod-table td {padding: 0.625rem 1.25rem; vertical-align: top;}
.prod-table thead th {background-color: rgba(12, 37, 120, 0.2); font-weight: 700;}
.prod-table thead th:first-child {border-radius: 5px 0 0 5px;}
.prod-table thead th:last-child {border-radius: 0 5px 5px 0;}
.prod-table tbody td {font-weight: 300;}
.prod-table tbody tr:nth-child(even) td {background-color: #edf0f8;}
.prod-table tbody tr:nth-child(even) td:first-child {border-radius: 5px 0 0 5px;}
.prod-table tbody tr:nth-child(even) td:last-child {border-radius: 0 5px 5px 0;}
.prod-table tbody tr:last-child td {border-bottom: 1px solid var(--bs-gray-300, #ddd);}
@media (max-width: 768px) {
    .prod-table {min-width: 860px; font-size: 1rem;}
}


/* --------------------------------------------------------------------------
 * FACILITY 공통 — 영문 리드(22/700 primary) · 소제목(28/700)
 *  · 소제목+리스트 2단(.fac-cols: 시안 x200 타이틀 / x520 리스트)
 * -------------------------------------------------------------------------- */
.fac-block .sub-tit {margin-bottom: 1.875rem;}

.fac-lead {font-size: clamp(1.0625rem, 0.8839rem + 0.5952vw, 1.375rem); font-weight: 700; line-height: 1.45; color: var(--bs-primary); margin: 0 0 1.25rem;}
@media (min-width: 1200px) {
    .fac-lead {font-size: 1.375rem;}
}
.fac-subtit {font-size: clamp(1.25rem, 0.9643rem + 0.9524vw, 1.75rem); font-weight: 700; margin: 5rem 0 1.875rem;}
@media (min-width: 1200px) {
    .fac-subtit {font-size: 1.75rem;}
}
.biz-sec .fac-cols {margin-top: 5rem;}
.biz-subtit {margin-top: 5rem!important;}


.fac-cols {display: grid; grid-template-columns: 300px 1fr; gap: 1.25rem; margin-top: 5rem;}
.fac-cols .fac-subtit {margin: 0;}
@media (max-width: 992px) {
    .fac-cols {grid-template-columns: 1fr;}
}
@media (max-width: 768px) {
    .fac-cols {margin-top: 3rem;}
	.fac-subtit {margin-top:3rem;}
}

/* --------------------------------------------------------------------------
 * FACILITY — 본문 블록(타이틀+영문리드+본문+와이드 이미지 250px r10)
 * -------------------------------------------------------------------------- */
.fac-block + .fac-block {margin-top: clamp(3.75rem, 7.8vw, 9.375rem);}
.fac-block .fac-img {margin-top: 3.125rem; border-radius: 10px; overflow: hidden;}
.fac-block .fac-img img {width: 100%; height: clamp(160px, 13vw, 250px); object-fit: cover; display: block;}

/* --------------------------------------------------------------------------
 * FACILITY — 컬러 카드 5종(시안 294x210 r10: 4 primary + 마지막 #0c2578)
 * -------------------------------------------------------------------------- */
.fac-cards {display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; list-style: none; padding: 0; margin: 0;}
.fac-cards li {line-height: 1.7; background-color: var(--bs-primary); border-radius: 10px; color: var(--bs-white); padding: 40px 30px; min-height: 210px;}
.fac-cards li:last-child {background-color: #0c2578;}
.fac-cards li strong {display: block; font-weight: 700; margin-bottom: 0.5rem;}
.fac-cards li span {display: block; font-weight: 300;}
@media (max-width: 1200px) {
    .fac-cards {grid-template-columns: repeat(3, 1fr);}
}
@media (max-width: 768px) {
    .fac-cards {grid-template-columns: repeat(2, 1fr);}
    .fac-cards li {min-height: 0; padding: 1.25rem;}
}
@media (max-width: 576px) {
    .fac-cards {grid-template-columns: 1fr;}
}

/* --------------------------------------------------------------------------
 * FACILITY — 풀폭 패널(회색 r10) · 이미지+오버레이 다크 패널(흰 글)
 * -------------------------------------------------------------------------- */
.fac-panel {border-radius: 10px; background-color: #edf0f8; padding: clamp(4rem, 8vw, 9.5rem) clamp(4%, 5.2vw, 6.25rem);}
.fac-panel--img {background: center / cover no-repeat; color: var(--bs-white);}
.fac-panel--img .sub-tit {color: var(--bs-white);}
.fac-panel--img .fac-lead {color: #66c8ff;}
.fac-panel--img .sub-body {font-weight: 700;}

/* --------------------------------------------------------------------------
 * FACILITY — 체크 카드(시안 386x100 r10 · 반투명/솔리드 #0c2578 · 아이콘 36)
 * -------------------------------------------------------------------------- */
.fac-checks {display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; list-style: none; padding: 0; margin: 0;}
.fac-checks.cols-4 {grid-template-columns: repeat(4, 1fr);}
.fac-checks li {display: flex; align-items: center; gap: 0.375rem; background-color: rgba(12, 37, 120, 0.8); border-radius: 10px; color: var(--bs-white); padding: 1.875rem 1.5rem; min-height: 100px;}
.fac-checks--solid li {background-color: #0c2578;}
.fac-checks li img {width: 36px; height: 36px; flex: 0 0 auto; }
.fac-checks li strong {font-weight: 700;}
.fac-checks li strong span {display: block; margin-top:8px; font-weight: 300;}
@media (max-width: 992px) {
    .fac-checks, .fac-checks.cols-4 {grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 576px) {
    .fac-checks, .fac-checks.cols-4 {grid-template-columns: 1fr; gap:10px;}
    .fac-checks li {min-height: 0; padding: 1.25rem 1rem;}
}

/* --------------------------------------------------------------------------
 * FACILITY — 번호 리스트(01~08 · 4열 · 셀 상단 라인 + 전체 하단 라인 20%)
 * -------------------------------------------------------------------------- */
.fac-numlist {display: grid; grid-template-columns: repeat(4, 1fr); gap: 0 20px; list-style: none; padding: 0; margin: 0; border-bottom: 1px solid rgba(0, 0, 0, 0.2);}
.fac-numlist li {border-top: 1px solid var(--bs-dark); padding: 30px 0 60px; display: flex; gap: 1rem;}
.fac-numlist li b {font-weight: 700; color: var(--bs-primary);}
.fac-numlist li span {font-weight: 300;}
.fac-panel--img .fac-numlist {border-bottom-color: rgba(255, 255, 255, 0.2);}
.fac-panel--img .fac-numlist li {border-top-color: var(--bs-white);}
.fac-panel--img .fac-numlist li b {color: #66c8ff;}
.fac-panel--img .fac-numlist li span {color: var(--bs-white); font-weight: 300;}
@media (max-width: 992px) {
    .fac-numlist {grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 576px) {
    .fac-numlist {grid-template-columns: 1fr;}
    .fac-numlist li {padding: 1.5rem 0;}
}

/* --------------------------------------------------------------------------
 * FACILITY — 공정 플로우(카드 r10 + 연결선 #a8bed8 · 한줄/두줄 스네이크)
 * -------------------------------------------------------------------------- */
.fac-flow {width: calc(100% - 30px); position: relative; display: grid; grid-template-columns: repeat(5, 1fr); gap: 3.3rem 2.9rem; list-style: none; padding: 0; margin: 0;}
.fac-flow::before {content: ""; position: absolute; z-index: 0; left: 0; right: 0; top: 50%; border-top: 2px solid #a8bed8;}
.fac-flow.rows-2::before {top: 25%; bottom: 25%; border: 2px solid #a8bed8; border-radius: 20px; width: calc(100% + 30px);    border-width: 2px 2px 2px 0;}
.fac-flow li {position: relative; z-index: 1; background-color: var(--bs-white); border-radius: 10px; padding: 30px 28px;}
.fac-flow li b {display: block; font-weight: 700; color: var(--bs-primary); margin-bottom: 8px;}
.fac-flow li.on {background-color: #0c2578; color: var(--bs-white); font-weight: 700;}
.fac-flow li.on b {color: #66c8ff;}
.fac-flow--gray li {background-color: #edf0f8;}
.fac-flow--gray li.on {background-color: #0c2578;}
@media (max-width: 992px) {
    .fac-flow {grid-template-columns: repeat(2, 1fr); gap: 10px; width:100%;}
    .fac-flow::before, .fac-flow.rows-2::before {display: none;}
    .fac-flow li {min-height: 0; padding: 1.25rem 1.5rem;}
	.fac-flow li:nth-child(1) {order:1;}
	.fac-flow li:nth-child(2) {order:2;}
	.fac-flow li:nth-child(3) {order:3;}
	.fac-flow li:nth-child(4) {order:4;}
	.fac-flow li:nth-child(5) {order:5;}
	.fac-flow li:nth-child(10) {order:6;}
	.fac-flow li:nth-child(9) {order:7;}
	.fac-flow li:nth-child(8) {order:8;}
	.fac-flow li:nth-child(7) {order:9;}
	.fac-flow li:nth-child(6) {order:10;}


	.fac-flow.biz-flow-4 li:nth-child(1) {order:1;}
	.fac-flow.biz-flow-4 li:nth-child(2) {order:2;}
	.fac-flow.biz-flow-4 li:nth-child(3) {order:3;}
	.fac-flow.biz-flow-4 li:nth-child(4) {order:4;}
	.fac-flow.biz-flow-4 li:nth-child(5) {order:8;}
	.fac-flow.biz-flow-4 li:nth-child(6) {order:7;}
	.fac-flow.biz-flow-4 li:nth-child(7) {order:6;}
	.fac-flow.biz-flow-4 li:nth-child(8) {order:5;}

}

/* --------------------------------------------------------------------------
 * FACILITY — 배너(이미지+오버레이 r10 · 라벨 36/800 · 타이틀 64/700)
 * -------------------------------------------------------------------------- */
.fac-banner {position: relative; border-radius: 10px; overflow: hidden; background: center / cover no-repeat; color: var(--bs-white);}
.fac-banner .fb-inner {padding: clamp(4rem, 8vw, 9.5rem) clamp(4%, 5.2vw, 6.25rem); display: flex; flex-direction: column; justify-content: center;}

.fac-banner .fb-label {font-size: clamp(1.5rem, 1.1786rem + 1.4286vw, 2.25rem); font-weight: 800; margin: 0;}
.fac-banner .fb-tit {font-size: clamp(2rem, 0.8571rem + 5.0794vw, 4rem); font-weight: 700; line-height: 1.25; margin: 1rem 0 0; color: var(--bs-white);}
.fac-banner .fb-desc {font-weight: 700; line-height: 1.67; margin: 2rem 0 0; max-width: 1240px;}
.fac-banner .fac-lead {color: #66c8ff; margin: 2rem 0 0;}
.fac-banner .fac-checks {margin-top: 2.5rem;}
.fac-banner .fb-brand {margin-top: auto; padding-top: 2rem; align-self: flex-end; text-align: right;}
.fac-banner .fb-brand strong {display: block; font-size: clamp(1.125rem, 0.9107rem + 0.9524vw, 1.75rem); font-weight: 700;}
.fac-banner .fb-brand span {font-weight: 700;}
@media (min-width: 1200px) {
    .fac-banner .fb-label {font-size: 2.25rem;}
    .fac-banner .fb-tit {font-size: 4rem;}
}

/* --------------------------------------------------------------------------
 * FACILITY — 안전관리 항목 리스트(dt 20/700 불릿 + dd 18/300 · lh45)
 * -------------------------------------------------------------------------- */
.fac-dl {margin: 0; border-top: 1px solid var(--bs-dark); border-bottom: 1px solid rgba(0, 0, 0, 0.2); padding: 1.25rem 0;}
.fac-dl > div {display: grid; grid-template-columns: 200px 1fr; gap: 0 1.5rem; line-height: 2.5;}
.fac-dl dt {font-size: clamp(1.0625rem, 0.9821rem + 0.3571vw, 1.25rem); font-weight: 700; position: relative; padding-left: 1rem;}
.fac-dl dt::before {content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 3px; height: 3px; border-radius: 50%; background: var(--bs-dark);}
.fac-dl dd {margin: 0; font-weight: 300;}
@media (min-width: 1200px) {
    .fac-dl dt {font-size: 1.25rem;}
}
@media (max-width: 768px) {
    .fac-dl > div {grid-template-columns: 1fr; line-height: 1.67; padding: 0.75rem 0;}
    .fac-dl dd {padding-left: 1rem;}
}

/* --------------------------------------------------------------------------
 * FACILITY — 품질관리 프로세스(4열 2행 327x189 r10 · 7번 다크 · 스네이크 연결선)
 * -------------------------------------------------------------------------- */
.fac-qc {width: calc(100% - 34px); position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.7rem 3.75rem; list-style: none; padding: 0; margin: 0;}
.fac-qc::before {width: calc(100% + 30px);  content: ""; position: absolute; z-index: 0; top: 25%; bottom: 25%; border: 2px solid #a8bed8;     border-width: 2px 2px 2px 0; border-radius: 20px;}
.fac-qc li {position: relative; z-index: 1; background-color: #edf0f8; border-radius: 10px; padding: 1.875rem; min-height: 189px;}
.fac-qc li b {display: block; font-weight: 700; color: var(--bs-primary);}
.fac-qc li strong {display: block; font-weight: 700; margin: 0.375rem 0;}
.fac-qc li span {display: block; font-weight: 300; line-height: 1.35;}
.fac-qc li.blank {background-color: var(--bs-white); border-radius: 0; margin-right: -3.75rem;}
.fac-qc li.on {background-color: #0c2578; color: var(--bs-white);}
.fac-qc li.on b {color: #66c8ff;}
@media (max-width: 992px) {
    .fac-qc {grid-template-columns: repeat(2, 1fr); gap: 10px; width:100%;}
    .fac-qc::before {display: none;}
    .fac-qc li.blank {display: none;}
    .fac-qc li {min-height: 0;}
	.fac-qc li:nth-child(1) {order:1;}
	.fac-qc li:nth-child(2) {order:2;}
	.fac-qc li:nth-child(3) {order:3;}
	.fac-qc li:nth-child(4) {order:4;}
	.fac-qc li:nth-child(6) {order:7;}
	.fac-qc li:nth-child(7) {order:6;}
	.fac-qc li:nth-child(8) {order:5;}
}


/* --------------------------------------------------------------------------
 * CONTACT — 오시는 길 · 주소/연락처 (시안: 3열 870/285/285 · 상단 1px 라인
 *  · 라벨 18/700 + 값 18/300 lh30 · 지도 1520x500 r10 · 지도와 간격 50)
 *  2026-10-06 용재
 * -------------------------------------------------------------------------- */
.loc-info {display: grid; grid-template-columns: minmax(0, 870fr) minmax(0, 285fr) minmax(0, 285fr); gap: 2.5rem; margin: 0;}
.loc-cell {display: flex; gap: 1.25rem; border-top: 1px solid var(--bs-dark); padding-top: 1.875rem; line-height: 1.67;}
.loc-cell dt {flex: 0 0 auto; min-width: 2.25rem; font-weight: 700;}
.loc-cell--addr dt {min-width: 4.25rem;}
.loc-cell dd {margin: 0; font-weight: 300;}
.loc-cell dd a {color: inherit; text-decoration: none;}
.loc-map {margin-top: 3.125rem; border-radius: 10px; overflow: hidden;}
.loc-map a {display: block;}
.loc-map img {display: block; width: 100%; aspect-ratio: 1520 / 500; object-fit: cover;}
@media (max-width: 1200px) {
    .loc-info {grid-template-columns: 1fr 1fr; gap: 1.5rem 2rem;}
    .loc-cell--addr {grid-column: 1 / -1;}
}
@media (max-width: 768px) {
    .loc-info {grid-template-columns: 1fr; gap: 1rem;}
    .loc-cell {padding-top: 1rem;}
    .loc-cell dd {font-size: 1rem;}
    .loc-en {display: block; margin-top: 0.25rem;}
    .loc-map {margin-top: 2rem;}
    .loc-map img {aspect-ratio: 4 / 3;}
}

/* --------------------------------------------------------------------------
 * CONTACT — 오시는 길 · 안산공장 소개 + 방문 안내 박스 (시안: 타이틀 36/800 →30→
 *  리드 22/700 primary →20→ 본문 18/300 →50→ 박스 #edf0f8 r10 1520x130
 *  · 박스 타이틀 28/700 좌측 280px 컬럼 · 본문 18/300 lh30)
 * -------------------------------------------------------------------------- */
.loc-intro .sub-tit {margin-bottom: 1.875rem;}
.loc-intro .fac-lead {margin-bottom: 1.25rem;}
.loc-notice {display: grid; grid-template-columns: 280px 1fr; align-items: center; margin-top: 3.125rem; padding: 2.1875rem 2.5rem; background-color: #edf0f8; border-radius: 10px;}
.loc-notice-tit {font-size: clamp(1.25rem, 0.9643rem + 0.9524vw, 1.75rem); font-weight: 700; margin: 0;}
.loc-notice-txt {margin: 0; font-weight: 300; }
@media (min-width: 1200px) {
    .loc-notice-tit {font-size: 1.75rem;}
}
@media (max-width: 992px) {
    .loc-notice {grid-template-columns: 1fr; gap: 1rem; padding: 1.5rem;}
    .loc-notice-tit {font-size: 1.375rem;}
}

/* ==========================================================================
   BUSINESS (business01~05) — .biz-* 컴포넌트군 · sub.css 끝에 append
   피그마 노드 29:360 / 34:1148 / 38:1886 / 44:652 / 44:1841
   표준: .container 오버라이드 금지 · 색상 var() · MQ는 각 컴포넌트 바로 아래
   FACILITY(.fac-*) 컴포넌트를 그대로 재사용하고, 모양이 다른 것만 .biz-* 로 추가/변형
   ========================================================================== */

/* --------------------------------------------------------------------------
 * BUSINESS 공통 — 섹션 블록 리듬(시안: 타이틀 36 →30→ 리드 →20→ 본문 →80→ 소제목/2단)
 *  .biz-sec 를 sub-max / fac-panel 에 함께 붙인다. .fac-cols 는 본문과 80px 간격.
 *  .biz-subtit = 본문 아래 단독 소제목(2단이 아닌 경우) 위 간격 80px
 * -------------------------------------------------------------------------- */
.biz-sec .sub-tit {margin-bottom: 1.875rem;}
.biz-sec .fac-lead {margin-bottom: 1.25rem;}
.biz-sec .fac-cols {margin-top: 5rem;}
.biz-subtit {margin-top: 5rem!important;}
@media (max-width: 768px) {
    .biz-sec .fac-cols, .biz-subtit {margin-top: 3rem!important;}
}

/* 이미지 패널 안 본문을 가는 굵기로(시안 w300) — 기본 .fac-panel--img 본문은 w700 */
.fac-panel--img .sub-body.biz-light {font-weight: 300;}

/* --------------------------------------------------------------------------
 * BUSINESS — 패널 변형(.fac-panel 에 덧붙임)
 *  --soft : #edf0f8 80% (시안 레이어 불투명도 .8)
 *  --navy : 짙은 남색 #143561 패널 · 흰 타이틀 · 하늘색 리드
 * -------------------------------------------------------------------------- */
.fac-panel.biz-panel--soft {background-color: rgba(237, 240, 248, 0.8);}
.fac-panel.biz-panel--navy {background-color: #143561; color: var(--bs-white);}
.biz-panel--navy .sub-tit {color: var(--bs-white);}
.biz-panel--navy .fac-lead {color: #66c8ff; margin-bottom: 3.125rem;}

/* --------------------------------------------------------------------------
 * BUSINESS — 배너 변형: 높이를 콘텐츠로(상하 150) · 소제목/2단/체크카드 수용
 *  .fac-banner 와 함께 사용. 라벨 없는 배너는 첫 요소 위 여백 제거
 * -------------------------------------------------------------------------- */
.biz-banner--auto .fb-inner {min-height: 0; justify-content: flex-start; }
.biz-banner--auto .fb-tit:first-child {margin-top: 0;}
.biz-banner--auto .biz-subtit {margin: 5rem 0 1.875rem; color: var(--bs-white);}
.biz-banner--auto .fac-cols {margin-top: 5rem;}
.biz-banner--auto .fac-cols .fac-subtit {color: var(--bs-white);}
.biz-banner--auto .fac-checks {margin-top: 0;}
@media (max-width: 768px) {
    .biz-banner--auto .biz-subtit, .biz-banner--auto .fac-cols {margin-top: 3rem;}
}

/* --------------------------------------------------------------------------
 * BUSINESS — 번호 리스트 변형(.fac-numlist 에 덧붙임)
 *  .biz-numlist : 시안 행 피치 121(상 30/하 60) · 칼럼 간격 20
 *  .biz-cols-3  : 3열(시안 382 · 간격 27)  /  .biz-wide : 마지막 칸 2칸 폭
 * -------------------------------------------------------------------------- */
.fac-numlist.biz-numlist {column-gap: 1.25rem;}
.fac-numlist.biz-numlist li {padding-bottom: 3.75rem;}
@media (min-width: 992px) {
    .fac-numlist.biz-cols-3 {grid-template-columns: repeat(3, 1fr); column-gap: 1.6875rem;}
    .fac-numlist .biz-wide {grid-column: span 2;}
}
@media (max-width: 576px) {
    .fac-numlist.biz-numlist li {padding: 1.5rem 0;}
}

/* --------------------------------------------------------------------------
 * BUSINESS — 항목 dl 변형(.fac-dl 에 덧붙임)
 *  --sm  : 라벨 칼럼을 좁게(시안 라벨 ~110 / 값 시작 x651)
 *  --img : 이미지 패널(어두운 배경) 위 — 흰 라인 · 흰 불릿
 * -------------------------------------------------------------------------- */
.fac-dl.biz-dl--sm > div {grid-template-columns: 7.25rem 1fr;}
.fac-dl.biz-dl--img {border-top-color: var(--bs-white); border-bottom-color: rgba(255, 255, 255, 0.2);}
.biz-dl--img dt::before {background: var(--bs-white);}
@media (max-width: 768px) {
    .fac-dl.biz-dl--sm > div {grid-template-columns: 1fr;}
}

/* 이미지 패널 하단 강조 문구(시안 28/700 #66c8ff) — 리스트 아래 40px */
.biz-claim {font-size: clamp(1.25rem, 0.9643rem + 0.9524vw, 1.75rem); font-weight: 700; line-height: 1.25; color: #66c8ff; margin: 2.5rem 0 0;}
@media (min-width: 1200px) {
    .biz-claim {font-size: 1.75rem;}
}

/* --------------------------------------------------------------------------
 * BUSINESS — 체크 카드 변형(.fac-checks 에 덧붙임)
 *  --light   : #edf0f8 카드 · 어두운 글(체크 아이콘은 /images/sub/biz/check-01.svg · #0070af)
 *  --white   : 흰 카드(회색 패널 위)
 *  --primary : #0070af 카드(체크 아이콘 #66c8ff 그대로 — 시안 실측)
 *  --desc    : 제목+설명 2줄 카드(시안 386x138)
 *  (남색 솔리드 = 기존 .fac-checks--solid)
 * -------------------------------------------------------------------------- */
.fac-checks.biz-checks--light li {background-color: #edf0f8; color: var(--bs-dark);}
.fac-checks.biz-checks--white li {background-color: var(--bs-white); color: var(--bs-dark);}
.fac-checks.biz-checks--primary li {background-color: var(--bs-primary);}

/* 2단(.fac-cols) 우측 칼럼이 좁아지는 1199 이하에서는 체크 카드 2열 */
.biz-checks--desc li strong {min-width: 0; overflow-wrap: anywhere;}
@media (max-width: 1200px) {
    .biz-sec .fac-cols .fac-checks, .biz-banner--auto .fac-cols .fac-checks {grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 576px) {
    .biz-sec .fac-cols .fac-checks, .biz-banner--auto .fac-cols .fac-checks {grid-template-columns: 1fr;}
    .fac-checks.biz-checks--desc li {min-height: 0;}
}

/* --------------------------------------------------------------------------
 * BUSINESS — 낮은 컬러 카드(.fac-cards 에 덧붙임, 시안 294x150)
 * -------------------------------------------------------------------------- */
.fac-cards.biz-cards-sm li {min-height: 150px;}
@media (max-width: 768px) {
    .fac-cards.biz-cards-sm li {min-height: 0;}
}

/* --------------------------------------------------------------------------
 * BUSINESS — 플로우 카드 변형(.fac-flow 에 덧붙임)
 *  .biz-flow-4 : 4열(ODM 8단계) · .biz-flow-tit/.biz-flow-desc : 굵은 제목 + 가는 설명
 * -------------------------------------------------------------------------- */
@media (min-width: 992px) {
    .fac-flow.biz-flow-4 {grid-template-columns: repeat(4, 1fr);}
}
.fac-flow .biz-flow-tit {display: block; font-weight: 700; margin-bottom: 0.375rem;}
.fac-flow .biz-flow-desc {display: block; font-weight: 300; line-height: 1.22;}
.fac-flow li.on .biz-flow-desc {font-weight: 300;}
.fac-flow.biz-flow-tall li {min-height: 189px;}
@media (max-width: 992px) {
    .fac-flow.biz-flow-tall li {min-height: 0;}
}

/* --------------------------------------------------------------------------
 * BUSINESS — 이미지 카드 그리드(시안: 썸네일 r10 + 이름 20/700 + 영문 16/500 #999 + 설명 18/300)
 *  .biz-thumbs        : 4열(361x353) · 영문은 이름 옆(--inline)
 *  .biz-thumbs--3     : 3열(485x353) · 영문은 이름 아래
 *  .bt-img--fade      : 시안의 #d9d9d9 30% 덮개(4번째 카드)
 * -------------------------------------------------------------------------- */
.biz-thumbs {display: grid; grid-template-columns: repeat(4, 1fr); gap: 3.125rem 1.5rem; list-style: none; padding: 0; margin: 0;}
.biz-thumbs--3 {grid-template-columns: repeat(3, 1fr); column-gap: 2rem;}
.biz-thumbs .bt-img {position: relative; border-radius: 10px; overflow: hidden; aspect-ratio: 361 / 353; margin-bottom: 1.875rem;}
.biz-thumbs--3 .bt-img {aspect-ratio: 485 / 353;}
.biz-thumbs .bt-img img {display: block; width: 100%; height: 100%; object-fit: cover;}
.biz-thumbs .bt-img--fade::after {content: ""; position: absolute; inset: 0; background: rgba(217, 217, 217, 0.3);mix-blend-mode: multiply;}
.biz-thumbs .bt-head {display: flex; flex-direction: column; gap: 0.625rem; margin-bottom: 0.625rem;}
.biz-thumbs--inline .bt-head {flex-direction: row; flex-wrap: wrap; align-items: baseline; column-gap: 0.5rem; row-gap: 0;}
.biz-thumbs .bt-tit {font-size: clamp(1.0625rem, 0.9821rem + 0.3571vw, 1.25rem);  font-weight: 700; line-height: 1.25; margin: 0;}
.biz-thumbs .bt-en {font-size: clamp(0.875rem, 0.7679rem + 0.2381vw, 1rem); font-weight: 500; line-height: 1.25; color: #999;}
.biz-thumbs .bt-desc {font-weight: 300; line-height: 1.67; margin: 0;}
@media (min-width: 1200px) {
    .biz-thumbs .bt-tit {font-size: 1.25rem;}
}
@media (max-width: 992px) {
    .biz-thumbs, .biz-thumbs--3 {grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 576px) {
    .biz-thumbs, .biz-thumbs--3 {grid-template-columns: 1fr;}
    .biz-thumbs .bt-img, .biz-thumbs--3 .bt-img {aspect-ratio: 16 / 10; margin-bottom: 1.25rem;}
}

/* --------------------------------------------------------------------------
 * BUSINESS — 산업군 행 리스트(시안: 상단 1px #000 · 행 하단 #ccc · 행 패딩 40
 *  · 이름 20/700 + 영문 16/500 #999 · 설명 18/300) — .fac-cols 우측 칼럼에 배치
 * -------------------------------------------------------------------------- */
.biz-rows {list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--bs-dark);}
.biz-rows li {padding: 2.5rem 0; border-bottom: 1px solid #ccc;}
.biz-rows .br-head {display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 0.5rem; margin-bottom: 0.625rem;}
.biz-rows .br-tit {font-size: clamp(1.0625rem, 0.9821rem + 0.3571vw, 1.25rem); font-weight: 700; line-height: 1.25; margin: 0;}
.biz-rows .br-en {font-size: clamp(0.875rem, 0.7679rem + 0.2381vw, 1rem); font-weight: 500; color: #999;}
.biz-rows .br-desc {font-weight: 300; line-height: 1.67; margin: 0;}
@media (min-width: 1200px) {
    .biz-rows .br-tit {font-size: 1.25rem;}
}
@media (max-width: 768px) {
    .biz-rows li {padding: 1.5rem 0;}
}

/* --------------------------------------------------------------------------
 * BUSINESS — 공정 행(PCB 주요 대응 공정: 좌 이름 28/700 + 영문 16/500 #999
 *  · 우 본문 + "주요 대응제품" 20/700 + 태그 · 행 상단 1px #000 · 행 패딩 40/80)
 * -------------------------------------------------------------------------- */
.biz-proc {margin: 0; padding: 0; list-style: none;}
.biz-proc > li {display: grid; grid-template-columns: 300px 1fr; gap: 1.25rem; border-top: 1px solid var(--bs-dark); padding: 2.5rem 0 5rem;}
.biz-proc .bp-name {font-size: clamp(1.25rem, 0.9643rem + 0.9524vw, 1.75rem); font-weight: 700; line-height: 1.25; margin: 0;}
.biz-proc .bp-en {display: block; font-size: clamp(0.875rem, 0.7679rem + 0.2381vw, 1rem); font-weight: 500; line-height: 1.25; color: #999; margin-top: 0.5rem;}
.biz-proc .bp-body {font-weight: 300; line-height: 1.67;}
.biz-proc .bp-body p {margin: 0;}
.biz-proc .bp-sub {font-size: clamp(1.0625rem, 0.9821rem + 0.3571vw, 1.25rem); font-weight: 700; line-height: 1.25; margin: 1.875rem 0 0.9375rem;}
@media (min-width: 1200px) {
    .biz-proc .bp-name {font-size: 1.75rem;}
    .biz-proc .bp-sub {font-size: 1.25rem;}
}
@media (max-width: 992px) {
    .biz-proc > li {grid-template-columns: 1fr; padding-bottom: 3rem;}
}

/* 태그 알약(시안 h44 · r40 · #edf0f8 · 1px #c5ccd3 · 18/300) */
.biz-tags {display: flex; flex-wrap: wrap; gap: 0.5rem; list-style: none; padding: 0; margin: 0;}
.biz-tags li {background-color: #edf0f8; border: 1px solid #c5ccd3; border-radius: 40px; padding: 0.375rem 1.25rem; font-weight: 300; line-height: 1.67;}
@media (max-width: 576px) {
    .biz-tags li {padding: 0.25rem 0.875rem;}
}

/* --------------------------------------------------------------------------
 * BUSINESS — 프로세스 스텝 카드(아이콘 36 + 번호 18/700 + 라벨 18/300 · 카드 r10 h211
 *  · 마지막 카드 강조 · 7~10열)
 *  구성: <ul class="biz-steps biz-steps--8"> <li [class="on"]><img /><b>1</b><span>라벨</span>
 *  --7/--8/--9/--10 : 열 수 · --white : 흰 카드 · --accent : 강조 카드 #0070af(기본 #0c2578)
 *  --qc : 아이콘 없는 품질관리형(번호 + 영문 제목 strong + 설명 small 14/500 #666)
 * -------------------------------------------------------------------------- */
.biz-steps {display: grid; grid-template-columns: repeat(9, 1fr); gap: 12px; list-style: none; padding: 0; margin: 0;}
.biz-steps--7 {grid-template-columns: repeat(7, 1fr);}
.biz-steps--8 {grid-template-columns: repeat(8, 1fr);}
.biz-steps--10 {grid-template-columns: repeat(10, 1fr);}
.biz-steps li {display: flex; flex-direction: column; align-items: center; min-height: 211px; padding: 3.125rem 0.75rem 1rem; background-color: #edf0f8; border-radius: 10px; color: var(--bs-dark); text-align: center; font-weight: 300; line-height: 1.22;}
.biz-steps--white li {background-color: var(--bs-white);}
.biz-steps li img {width: 36px; height: 36px; margin-bottom: 1.125rem;}
.biz-steps li b {display: block; font-weight: 700; line-height: 1.67; color: var(--bs-primary);}
.biz-steps li span {display: block; margin-top: 0.3125rem;}
.biz-steps li.on {background-color: #0c2578; color: var(--bs-white); font-weight: 700;}
.biz-steps--accent li.on {background-color: var(--bs-primary);}
.biz-steps li.on b {color: #66c8ff;}
.biz-steps li.on img {filter: brightness(0) invert(1);}
.biz-steps--qc b {text-decoration-line: underline;text-decoration-style: solid;text-decoration-skip-ink: auto;text-decoration-thickness: auto;text-underline-offset: auto;text-underline-position: from-font;}
.biz-steps--qc li {padding: 2.1875rem 1.5rem 1rem;}
.biz-steps--qc li strong {display: block; margin-top: 1.4rem; font-weight: 700; line-height: 1.22;}
.biz-steps--qc li small {display: block; margin-top: 0.625rem; font-size: 0.875rem; font-weight: 500; line-height: 1.22; color: var(--bs-gray-666);}
.biz-steps--qc li.on small {color: var(--bs-white);}
.biz-steps--qc li span {margin-top: 0;}
@media (max-width: 1400px) {
    .biz-steps--9, .biz-steps--10 {grid-template-columns: repeat(5, 1fr);}
}
@media (max-width: 1200px) {
    .biz-steps--7, .biz-steps--8 {grid-template-columns: repeat(4, 1fr);}
    .biz-steps li {min-height: 0; padding-bottom: 1.5rem;}
}
@media (max-width: 768px) {
    .biz-steps, .biz-steps--9, .biz-steps--10 {grid-template-columns: repeat(3, 1fr);}
    .biz-steps--7, .biz-steps--8 {grid-template-columns: repeat(2, 1fr);}
    .biz-steps--10 {grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 576px) {
    .biz-steps, .biz-steps--9 {grid-template-columns: repeat(2, 1fr);}
    .biz-steps li {padding-left: 0.5rem; padding-right: 0.5rem; word-break: keep-all;}
}

/* --------------------------------------------------------------------------
 * BUSINESS — 원형 3종 박스(시안: 정제·여과 공정 = #edf0f8 r10 · 원 300 · 색 primary/#0350b4/#0c2578
 *  · 영문 18/300 + 한글 28/700 · 하단 캡션 22/700)
 *  --dark : R&D+Production+Quality = #1d2950 · 원 250 + 사이 플러스 아이콘 · 3번째 원 #66c8ff
 *  구성: <div class="biz-circles"><ul class="biz-circles-list"><li class="biz-circle biz-circle--1"> …
 * -------------------------------------------------------------------------- */
.biz-circles {padding: clamp(3rem, 4.2vw, 5rem) clamp(4%, 5.2vw, 6.2rem); background-color: #edf0f8; border-radius: 10px; text-align: center;}
.biz-circles--dark {--biz-d: clamp(64px, 13vw, 250px); margin-top: 2.5rem; background-color: #1d2950; color: var(--bs-white);}
.biz-circles-list {display: flex; align-items: center; justify-content: center; gap: clamp(0.5rem, 4.1vw, 5rem); list-style: none; padding: 0; margin: 0;}
.biz-circles--dark .biz-circles-list {gap: clamp(0.25rem, 2.3vw, 2.8rem);}
.biz-circle {display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; max-width:300px; aspect-ratio: 1 / 1; border-radius: 50%; color: var(--bs-white); background-color: var(--bs-primary);}
.biz-circle--2 {background-color: #0350b4;}
.biz-circle--3 {background-color: #0c2578;}
.biz-circles--dark .biz-circle--3 {background-color: #66c8ff;}
.biz-circle small {display: block; letter-spacing: 0;font-size: clamp(0.9375rem, 0.8571rem + 0.3571vw, 1.125rem); font-weight: 300; line-height: 1.67;}
.biz-circle strong {display: block; font-size: clamp(1.25rem, 0.9643rem + 0.9524vw, 1.75rem);  font-weight: 700; line-height: 1.25;}
.biz-circles-plus {flex: 0 0 auto; opacity: 0.5;}
.biz-circles-plus img {display: block; width: clamp(16px, 2.1vw, 40px); height: auto;}
.biz-circles-cap {margin: clamp(1.5rem, 2.6vw, 3.125rem) 0 0;font-size: clamp(1.0625rem, 0.8839rem + 0.5952vw, 1.375rem); font-weight: 700; line-height: 1.45;}
@media (max-width: 576px) {
    .biz-circles-list {flex-wrap:wrap;}
	.biz-circle {width:46%;}
	.biz-circles {padding: clamp(3rem, 4.2vw, 5rem) 4%; }
	.biz-circles-plus {width:100%; display:flex; justify-content:center;}

}

/* 배너 타이틀 — 가운뎃점(·)으로만 이어진 긴 영문은 keep-all로 줄바꿈 기회가 없어 모바일에서 잘림(business04 실측) → 임의 지점 줄바꿈 허용 */
@media (max-width: 768px) {
    .fac-banner .fb-tit {overflow-wrap: anywhere;}
}

/* ---- CONTACT — 문의폼 3종 (.inq-*) ---- */
.inq-head {padding-top: 100px;}
.inq-head .location {letter-spacing: 0; display: block; margin: 1rem 0; font-size: 0.8125rem;}
.inq-head .location ul {justify-content: flex-end; color: var(--bs-gray-666);}
.inq-head .location ul li:last-child {margin-right: 0; color: var(--bs-body-color); font-weight: 700;}
.inq-title {padding-bottom: clamp(3rem, 7.8125vw, 9.375rem); border-bottom: 1px solid var(--bs-dark);}
.inq-title-label {font-size: 1.5rem; font-weight: 500; line-height: 1.25; color: var(--bs-primary); margin: 0 0 1.25rem;}
.inq-title-en {font-size: clamp(2rem, 1.2rem + 3vw, 4rem); font-weight: 700; line-height: 1.25; color: var(--bs-dark); margin: 0;}
@media (max-width: 992px) {
    .inq-head {padding-top: 80px;}
    .inq-title-label {font-size: 1.125rem; margin-bottom: 0.75rem;}
}

.inq-section {padding-top: 3.125rem;}
.inq-intro {font-size: 1.125rem; font-weight: 300; line-height: 1.67; margin: 0 0 2.5rem;}
.inq-intro p {margin: 0;}
.inq-intro strong {font-weight: 700;}
@media (max-width: 768px) {
    .inq-intro {font-size: 1rem;}
}

.inq-cols {display: grid; grid-template-columns: 320px 1fr; gap: 1.25rem; margin: 0 0 4.375rem;}
.inq-cols .biz-tags {gap: 0.625rem;}
.inq-cols-tit {font-size: clamp(1.375rem, 1.1rem + 1.2vw, 1.75rem); font-weight: 700; line-height: 1.4; margin: 0;}
@media (max-width: 992px) {
    .inq-cols {grid-template-columns: 1fr; gap: 1rem; margin-bottom: 3rem;}
}

.fac-checks li .inq-check {width: 36px; height: 36px; flex: 0 0 auto; margin: -0.375rem 0 0 -0.625rem; margin-bottom:auto;}

.inq-grid {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 106px; row-gap: 1.25rem;}
.inq-row {display: grid; grid-template-columns: 157px minmax(0, 1fr); align-items: start;}
.inq-row--full, .inq-row--area {grid-column: 1 / -1;}
.inq-row--area {grid-template-columns: 1fr; row-gap: 0.625rem;}
.inq-label {display: flex; align-items: center; min-height: 60px; font-size: 1.125rem; font-weight: 400; color: var(--bs-dark); margin: 0;}
.inq-row--area .inq-label {min-height: 0;}
.inq-req {color: var(--bs-primary); margin-left: 0.25rem;}
.inq-field {min-width: 0;}
@media (max-width: 992px) {
    .inq-grid {grid-template-columns: 1fr; column-gap: 0; row-gap: 1rem;}
    .inq-row {grid-template-columns: 1fr; row-gap: 0.5rem;}
    .inq-label {min-height: 0; font-size: 1rem;}
}

.inq-input, .inq-textarea, .inq-file {display: block; width: 100%; background-color: #f1f1f1; border: 0; border-radius: 4px; color: var(--bs-body-color); font-family: inherit; font-size: 1.125rem; font-weight: 300; box-shadow: none;}
.inq-input, .inq-file {height: 60px; padding: 0 20px;}
.inq-textarea {height: 18.75rem; padding: 1.25rem; line-height: 1.67; resize: vertical;}
.inq-input::placeholder, .inq-textarea::placeholder {color: #999; font-weight: 300;}
.inq-input:focus, .inq-textarea:focus, .inq-file:focus {outline: 0; box-shadow: 0 0 0 2px var(--bs-primary);}
.inq-file {padding: 0.75rem 20px; font-size: 1rem;}
.inq-file::file-selector-button {border: 0; border-radius: 4px; background-color: var(--bs-white); color: var(--bs-body-color); font-family: inherit; padding: 0.375rem 1rem; margin-right: 1rem; cursor: pointer;}
.inq-note {font-size: 0.875rem; font-weight: 300; color: var(--bs-gray-666); margin: 0.5rem 0 0;}
@media (max-width: 992px) {
    .inq-input {height: 50px; padding: 0 1rem; font-size: 1rem;}
    .inq-file {height: 50px; padding: 0.5rem 1rem;}
    .inq-textarea {height: 15rem; padding: 1rem; font-size: 1rem;}
}

.inq-spam {display: flex; align-items: center; flex-wrap: wrap; gap: 0.75rem;}
.inq-spam img {display: block; flex: 0 0 auto;}
.inq-spam .inq-input {width: 180px; max-width: 100%;}
.inq-spam-re {font-size: 0.875rem; color: var(--bs-gray-666); text-decoration: underline;}

.inq-form .privacy-bag {height: 150px; overflow: auto; background-color: #f1f1f1; border: 0; border-radius: 4px; padding: 1.25rem; font-size: 0.875rem; font-weight: 300;}
.inq-form .privacy-bag:focus {outline: 0; box-shadow: 0 0 0 2px var(--bs-primary);}

.inq-notice {font-size: 1.125rem; font-weight: 700; line-height: 1.67; margin: 3.125rem 0 0;}
@media (max-width: 768px) {
    .inq-notice {font-size: 1rem;}
}

.inq-btn-wrap {display: flex; justify-content: center; margin-top: 3.125rem;}
.inq-submit {width: 146px; height: 60px; padding: 0; border-radius: 5px; font-size: 1rem; font-weight: 700; color: var(--bs-white);}
@media (max-width: 992px) {
    .inq-submit {height: 50px;}
}

/* 관리자용 목록/보기(L.contact 복제 마크업)는 폼과 같은 1520 폭으로 */
.inq-section .board-list, .inq-section .board-view {max-width: 1520px; margin: 0 auto;}