@charset "UTF-8";
/* ==========================================================================
   autobase — 제품 상세 (데스크톱)
   레퍼런스: odhitec.com 제품 뷰 (실측: 컨테이너 1400 동일, 1rem=10px 환산,
   포인트 #004bd5 → 브랜드 var(--brand) 치환). 내용은 autobase.biz 원문.
   ※ @media 는 m.product-view.css 에만.
   ========================================================================== */

/* 채움 버튼 — btn-line 의 파랑 채움 변형 */
.btn-fill {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  height: 40px;
  padding: 0 16px;
  border-radius: 100px;
  background: var(--brand);
  font-size: 16px;
  font-weight: 500;
  line-height: normal;
  color: #fff;
}
.btn-fill img { width: 6.06px; height: 10.71px; margin: 0 -0.53px; }

/* ── 카테고리 타이틀 (원본 #contentInfoCon .content-tit — 60px 센터) ────── */
.pv-cat-tit { margin: 72px auto 50px; text-align: center; }
.pv-cat-tit h2 { font-size: 60px; font-weight: 700; line-height: 1.2; color: #000; }

/* ── 섹션 센터 헤드 (원본 cm-top-txt-box) — 영문 24px 파랑+밑줄, 한글 44px ─ */
.pv-head { text-align: center; }
.pv-head__en {
  display: inline-block;
  position: relative;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.41;
  color: var(--brand);
}
.pv-head__en::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: var(--brand);
}
.pv-head__ko { padding-top: 20px; font-size: 44px; font-weight: 700; line-height: 1.22; color: #222; }

/* ── 히어로 (원본 product-view-top-con) — 원본 배경 이미지 적용 ────────── */
.pv-hero {
  padding: 115px 0 80px;
  background: #f2f5fc center / cover no-repeat url('../../images/product/view-top-bg.jpg');
  text-align: center;
}
.pv-hero__txt { max-width: 800px; margin: 0 auto; }
.pv-hero__model { font-size: 72px; font-weight: 700; line-height: 1.2; color: #000; }
.pv-hero__subtitle { padding-top: 10px; font-size: 22px; font-weight: 500; line-height: 1.54; color: #222; }

/* 해시태그 칩 — 원본 category-list (h45, r22.5, 15px, #888, 흰 배경) */
.pv-hero__tags {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  padding-top: 50px;
}
.pv-hero__tags li {
  display: flex;
  align-items: center;
  height: 45px;
  padding: 0 25px;
  border-radius: 22.5px;
  background: #fff;
  font-size: 15px;
  line-height: 1.2;
  color: #888;
}
.pv-hero__img { display: flex; align-items: center; justify-content: center; margin-top: 60px; }
.pv-hero__img img { max-width: 100%; max-height: 420px; }

/* ── 섹션 공통 (원본 product-view-content-con: 상단 120) ────────────────── */
.pv-feat, .pv-spec, .pv-dim, .pv-rel { margin-top: 120px; }
/* 페이지 하단 여백 (원본 product-view-page pb 120) — 목록으로 버튼 영역 */
.pv-back { margin-top: 80px; padding-bottom: 40px; text-align: center; }

/* ── 주요 특징 ───────────────────────────────────────────────────────── */
/* 요약 점 리스트 — 원본 feature-txt-list (2열, 18px #666, 파랑 점) */
.pv-feat__points {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 80px;
  margin-top: 33px;
  padding: 0 20px;
}
.pv-feat__points li {
  position: relative;
  width: calc(50% - 54px);
  padding-left: 14px;
  font-size: 18px;
  line-height: 1.5;
  color: #666;
}
.pv-feat__points li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 11.5px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--brand);
}

/* 번호 특징 리스트 — 원본 product-appli-list 언어 (2열, 좌 텍스트/우 원형 아이콘) */
.pv-feat__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px 18px;
  margin-top: 45px;
}
.pv-feat__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 35px 40px;
  border-radius: 20px;
  background: #f6f6f6;
}
.pv-feat__txt { width: calc(100% - 120px); }
.pv-feat__no { display: block; font-size: 14px; font-weight: 500; font-style: normal; line-height: 1.3; color: #185fe4; }
.pv-feat__title { margin-top: 6px; font-size: 20px; font-weight: 700; line-height: 1.5; }
.pv-feat__desc { margin-top: 7px; font-size: 15px; line-height: 1.5; color: #555; }
/* 원형 아이콘 배지 — 원본 icon-box (100px 흰 원) */
.pv-feat__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  align-self: flex-start;
  width: 100px;
  height: 100px;
  margin-left: 20px;
  border-radius: 50%;
  background: #fff;
}

/* ── Specification 표 (원본 product-spec-table) ─────────────────────────── */
.pv-spec__table {
  width: 100%;
  margin-top: 43px;
  border-spacing: 0;
  border-collapse: separate;
}
.pv-spec__table th {
  height: 55px;
  border-radius: 20px 20px 0 0;
  background: var(--brand);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  color: #fff;
}
.pv-spec__table td {
  padding: 14px 24px;
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  font-size: 14px;
  line-height: 2;
  color: #333;
  word-break: break-word;
}
.pv-spec__table td:last-child { border-right: 0; }
/* 라벨 셀 — 원본 td.bg */
.pv-spec__table td.bg {
  width: 260px;
  background: #f6f6f6;
  font-weight: 500;
  text-align: center;
}

/* ── Dimensions — 원본 feature-img-box 언어 (#f6f6f6, r20) ─────────────── */
.pv-dim__box {
  display: flex;
  justify-content: center;
  margin-top: 45px;
  padding: 60px 40px;
  border-radius: 20px;
  background: #f6f6f6;
}
.pv-dim__box img { max-width: 100%; height: auto; }

/* ── 관련 제품 — 목록 카드(.pl-card) 재사용 ─────────────────────────────── */
.pv-rel__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  margin-top: 42px;
}

/* ── 준비 중 ─────────────────────────────────────────────────────────── */
.pv { margin-top: 140px; }
.pv__empty { padding: 120px 0 0; font-size: 18px; color: #666; text-align: center; }
.pv__empty-back { margin-top: 32px; text-align: center; }