@charset "utf-8";

/* 사업소개 기본 */
.biz-sub { --content-text-color: #000000; --biz-border-color: #666666; --biz-tab-active-text-color: var(--primary-color); --biz-tab-active-border: var(--primary-color); --biz-tab-underline-height: 5px; --biz-tab-underline-width: calc(100% - 3.5rem); --biz-filter-active-bg: var(--primary-color); --biz-filter-inactive-bg: var(--gray-100); --biz-filter-inactive-color: #666666; color: var(--content-text-color); padding-top: 100px; padding-bottom: 188px; }

/* 1차 탭 */
.biz-sub .tab-line { display: flex; flex-wrap: wrap; gap: 0; margin: 0; padding: 0; list-style: none; border-bottom: 1px solid var(--biz-border-color); }
.biz-sub .tab-line__item { margin: 0; }
.biz-sub .tab-line__link { display: block; padding: 23px 30px; font-size: var(--font-size-ui); font-weight: 500; color: var(--content-text-color); border-bottom: 0; margin-bottom: 0; transition: color 0.2s, border-color 0.2s; position: relative; }
.biz-sub .tab-line__link.is-active { font-weight: 700; color: var(--biz-tab-active-text-color); border-bottom-color: transparent; }
.biz-sub .tab-line__link.is-active::after { content: ''; position: absolute; left: 50%; bottom: -1px; width: var(--biz-tab-underline-width); height: var(--biz-tab-underline-height); background-color: var(--biz-tab-active-border); transform: translateX(-50%); }

/* 2차 필터 */
.biz-sub .filter-pills { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.biz-sub .filter-pills__btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 1.25rem; font-size: var(--font-size-ui); font-weight: 500; color: var(--biz-filter-inactive-color); background-color: var(--biz-filter-inactive-bg); border-radius: var(--radius-sm); transition: background-color 0.2s, color 0.2s; }
.biz-sub .filter-pills__btn.is-active { font-weight: 700; color: var(--light-color); background-color: var(--biz-filter-active-bg); }

/* 히어로 및 본문 */
.sub-hero.sub-hero--business { background-color: #2a3540; background-image: url("../images/common/sub_visual_business.jpg"); }
.biz-sub__intro { margin-bottom: 50px; }
.biz-sub__intro .biz-bullets { font-size: var(--fs-20); }
.biz-sub__tabs { margin-bottom: 55px; }
.biz-sub__block { margin-bottom: 55px; }
.biz-sub__block__02 { margin-bottom: 50px; }
.biz-sub__section-title { margin-bottom: 16px; }

/* 불릿 */
.biz-sub .biz-bullets { margin: 0; padding-left: 0; list-style: none; font-size: var(--font-size-body); font-weight: 400; line-height: 1.65; color: var(--content-text-color); }
.biz-sub .biz-bullets li { position: relative; padding-left: 16px; }
.biz-sub .biz-bullets li::before { content: ''; position: absolute; left: 0; top: 0.78em; width: 4px; height: 4px; background-color: var(--content-text-color); transform: translateY(-50%); }
.biz-sub .biz-bullets li + li { margin-top: 0.35rem; }

/* 탭 레이아웃 */
.biz-sub .biz-tab-line-wrap { overflow-x: auto; overflow-y: hidden; margin-left: calc(-1 * var(--inner-padding-x)); margin-right: calc(-1 * var(--inner-padding-x)); padding-left: var(--inner-padding-x); padding-right: var(--inner-padding-x); -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; }
.biz-sub .biz-tab-line-wrap::-webkit-scrollbar { height: 0; }
.biz-sub .biz-tab-line-wrap .tab-line { flex-wrap: nowrap; min-width: min-content; }
.biz-sub .tab-line { border-top: 1px solid var(--biz-border-color); border-bottom: 1px solid var(--biz-border-color); }
.biz-sub .filter-pills--equal { width: 840px; max-width: 100%; margin-left: auto; margin-right: auto; gap: 0; overflow: hidden; border: 1px solid #999999; flex-wrap: nowrap; }
.biz-sub .filter-pills--equal > li { flex: 0 0 280px; min-width: 0; }
.biz-sub .filter-pills--equal .filter-pills__btn { width: 100%; min-height: 52px; padding: 0 0.75rem; border-radius: 0; border-right: 1px solid #999999; }
.biz-sub .filter-pills__btn.is-active { background-color: #0082cf; }
.biz-sub .filter-pills--equal > li:last-child .filter-pills__btn { border-right: 0; }

/* 제품 행 */
.biz-sub .product-title { font-size: var(--fs-24); font-weight: 700; line-height: 1.35; color: var(--font-color); margin: 0 0 18px; }
.biz-sub .product-rows { margin: 0; padding: 0; list-style: none; }
.biz-sub .product-row { display: grid; grid-template-columns: 280px minmax(0, 1fr) 560px; gap: 40px; align-items: start; padding: 25px 0; border-bottom: 0; }
.biz-sub .product-row:first-child { padding-top: 0; }
.biz-sub .product-row:last-child { padding-bottom: 0; }
.biz-sub .product-row__media { margin: 0; }
.biz-sub .product-row__placeholder { width: 280px; height: 217px; background: linear-gradient(145deg, var(--gray-200), var(--gray-100)); border: 1px solid #cccccc; }
.biz-sub .product-row__img { display: block; width: 280px; height: 217px; object-fit: contain; }
.biz-sub .product-row__body { min-width: 0; align-self: center; }
.biz-sub .product-row__desc { margin: 0; font-size: var(--font-size-body); font-weight: 400; line-height: 1.65; color: var(--content-text-color); }
.biz-sub .product-row__spec { min-width: 0; align-self: center; }

/* 제품 스펙 표 */
.biz-sub .spec-table { width: 100%; border-collapse: collapse; font-size: var(--font-size-body); border: 1px solid var(--biz-border-color); }
.biz-sub .spec-table th, .biz-sub .spec-table td { padding: 0.65rem 0.85rem; text-align: left; vertical-align: top; border: 1px solid var(--biz-border-color); }
.biz-sub .spec-table tr:first-child th, .biz-sub .spec-table tr:first-child td { border-top: 0; }
.biz-sub .spec-table th { width: 28%; min-width: 6.5rem; font-weight: 600; color: var(--font-color); background-color: var(--gray-color); }
.biz-sub .spec-table td { font-weight: 400; color: var(--font-sec-color); }
.biz-sub .spec-table th, .biz-sub .spec-table td { color: var(--content-text-color); border-color: #cccccc; vertical-align: middle; }
.biz-sub .spec-table .spec-grade { font-weight: 600; }
.biz-sub .spec-table th { background-color: transparent; }
.biz-sub .spec-table tbody tr:nth-child(2) > th, .biz-sub .spec-table tbody tr:nth-child(2) > td { background-color: #f5fbff; }
.biz-sub .spec-table { width: 560px; max-width: 100%; border-color: #cccccc; border-left: 0; border-right: 0; }
.biz-sub .spec-table tr > :first-child { border-left: 0; }
.biz-sub .spec-table tr > :last-child { border-right: 0; }

/* 지원 조건 */
@supports (top: 1lh) { .biz-sub .biz-bullets li::before { top: 0.5lh; } }

/* 반응형 */
@media (max-width: 1023px) {
  .biz-sub .product-row { grid-template-columns: 1fr 1fr; gap: 1.25rem; }
  .biz-sub .product-row__media { grid-column: 1; }
  .biz-sub .product-row__body { grid-column: 2; }
  .biz-sub .product-row__spec { grid-column: 1 / -1; }
}

@media (max-width: 879px) {
  .biz-sub .filter-pills--equal { overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; }
  .biz-sub .filter-pills--equal::-webkit-scrollbar { height: 0; }
}

@media (max-width: 639px) {
  .biz-sub .filter-pills--equal { flex-direction: column; }
  .biz-sub .filter-pills--equal .filter-pills__btn { border-right: 0; border-bottom: 1px solid #999999; }
  .biz-sub .filter-pills--equal > li:last-child .filter-pills__btn { border-bottom: 0; }
}

@media (max-width: 559px) {
  .biz-sub .product-row { grid-template-columns: 1fr; }
  .biz-sub .product-row__body { grid-column: 1; }
  .biz-sub .product-row__placeholder, .biz-sub .product-row__img { width: 100%; height: auto; aspect-ratio: 280 / 217; }
}