/* BASIC css start */
/* ============================================================
   세인트크로익스 코리아 — 워런티 안내 페이지
   2026-08-28 / 메이크샵 개별디자인 붙여넣기용
   · 모든 규칙은 .scw 안에만 적용됩니다. 쇼핑몰 스킨 CSS를 건드리지 않습니다.
   · 색은 1_기획\색토큰-260827.md 확정판을 따릅니다.
     흰 바탕 위 골드 글자는 메탈릭 골드 #7C6F45 를 씁니다 (#C9AE17 은 흰 위 2.20 미달).
   ============================================================ */
.scw{
  --gold:#C9AE17;        /* GOLD PMS 7752 — 검정 위 글자 · 장식선 */
  --gold-text:#7C6F45;   /* METALLIC GOLD PMS 871 — 흰 바탕 위 골드 글자 (4.98 AA) */
  --black:#292522;       /* BLACK C */
  --ivory:#FFFEF2;
  --canvas:#DAD9A6;
  --teal:#547D6C;
  --line:#E4E1D6;
  --line-soft:#EFEDE4;
  --bg-soft:#FBFAF5;
  --ink:#2B2825;
  --ink-soft:#6B655C;
  --ink-mute:#9A948A;

  max-width:1080px; margin:0 auto; padding:0 20px 90px;
  background:#fff; color:var(--ink);
  font-family:'Pretendard','Apple SD Gothic Neo','Malgun Gothic','맑은 고딕',sans-serif;
  font-size:15px; line-height:1.75; letter-spacing:-.01em;
  -webkit-text-size-adjust:100%;
}
.scw *{ box-sizing:border-box; }
.scw p{ margin:0 0 14px; }
.scw p:last-child{ margin-bottom:0; }
.scw strong{ font-weight:700; color:var(--black); }
.scw a{ color:inherit; text-decoration:none; }

/* ============ 히어로 ============ */
.scw-hero{
  background:var(--black); color:var(--ivory);
  margin:0 -20px; padding:66px 24px 58px; text-align:center;
}
.scw-hero img{ width:230px; max-width:62%; height:auto; display:block; margin:0 auto 30px; }
.scw-hero .eyebrow{
  font-size:11px; letter-spacing:.3em; color:var(--gold); font-weight:700; margin:0 0 16px;
}
.scw-hero h1{
  margin:0 0 24px; font-size:33px; line-height:1.32; font-weight:800; letter-spacing:-.025em;
  color:var(--ivory);
}
.scw-hero .lead{
  max-width:660px; margin:0 auto; font-size:15px; line-height:1.9; color:#CFCABC;
}
.scw-hero .lead b{ color:var(--ivory); font-weight:700; }
.scw-hero .note{
  margin:26px auto 0; padding-top:18px; max-width:660px;
  border-top:1px solid rgba(255,255,255,.16); font-size:12.5px; color:#9C968A;
}

/* ============ 목차 ============ */
.scw-nav{
  margin:0 -20px 64px; padding:16px 20px;
  border-bottom:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:8px; justify-content:center;
}
.scw-nav a{
  display:inline-block; padding:7px 15px; font-size:13px; font-weight:700;
  color:var(--ink-soft); border:1px solid var(--line); border-radius:100px;
}
.scw-nav a b{ color:var(--gold-text); font-weight:800; margin-right:5px; letter-spacing:.04em; }
.scw-nav a:hover{ border-color:var(--gold-text); color:var(--black); }

/* ============ 섹션 ============ */
.scw-sec{ margin:0 0 66px; scroll-margin-top:20px; }
.scw-sec > .num{
  display:block; font-size:11px; font-weight:800; letter-spacing:.22em;
  color:var(--gold-text); margin:0 0 10px;
}
.scw-sec > h2{
  margin:0 0 8px; font-size:23px; font-weight:800; color:var(--black); letter-spacing:-.025em;
}
.scw-sec > .sub{ margin:0 0 26px; color:var(--ink-soft); font-size:14px; }
.scw-sub{ margin:38px 0 0; }
.scw-sub > h3{
  margin:0 0 12px; padding:0 0 0 12px; font-size:16px; font-weight:700; color:var(--black);
  border-left:3px solid var(--gold);
}

/* ============ 표 ============ */
.scw-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--line); }
.scw table{ width:100%; border-collapse:collapse; font-size:13.5px; }
.scw table.wide{ min-width:660px; }
.scw thead th{
  background:var(--black); color:var(--ivory); font-weight:700; font-size:12.5px;
  padding:13px 14px; text-align:center; white-space:nowrap;
  border-right:1px solid rgba(255,255,255,.13);
}
.scw thead th:last-child{ border-right:0; }
.scw tbody td{
  padding:12px 14px; text-align:center; color:var(--ink-soft);
  border-top:1px solid var(--line-soft); border-right:1px solid var(--line-soft);
}
.scw tbody td:last-child{ border-right:0; }
.scw tbody td.m{
  text-align:left; font-weight:700; color:var(--black);
  position:sticky; left:0; background:#fff; z-index:1; white-space:nowrap;
}
.scw tbody tr:nth-child(even) td,
.scw tbody tr:nth-child(even) td.m{ background:var(--bg-soft); }
.scw tbody tr:hover td,
.scw tbody tr:hover td.m{ background:#F5F2E6; }
.scw td.price{ font-weight:700; color:var(--black); white-space:nowrap; }
.scw .y{ font-weight:700; color:var(--black); white-space:nowrap; }
.scw .y15{ color:var(--gold-text); }
.scw .disc{ font-weight:400; font-size:11.5px; color:var(--ink-mute); }
.scw .ok{ color:var(--gold-text); font-weight:700; }
.scw .no{ color:#CAC5BA; }
.scw-legend{ margin:12px 0 0; font-size:12.5px; color:var(--ink-mute); }
.scw-hint{ display:none; font-size:12px; color:var(--ink-mute); margin:0 0 12px; }

/* ============ 콜아웃 ============ */
.scw-call{
  border:1px solid var(--line); border-left:3px solid var(--gold-text);
  background:var(--bg-soft); padding:20px 24px; margin:22px 0 0;
}
.scw-call h4{ margin:0 0 8px; font-size:15px; font-weight:800; color:var(--black); }
.scw-call.dark{
  background:var(--black); border-color:var(--black); border-left-color:var(--gold); color:#CFCABC;
}
.scw-call.dark h4{ color:var(--gold); }
.scw-call.dark strong{ color:var(--ivory); }

/* ============ 리스트 ============ */
.scw ul{ margin:0; padding:0; list-style:none; }
.scw ul li{ position:relative; padding:0 0 0 15px; margin:0 0 7px; }
.scw ul li:last-child{ margin-bottom:0; }
.scw ul li::before{
  content:''; position:absolute; left:0; top:10px;
  width:4px; height:4px; background:var(--gold-text); border-radius:50%;
}
.scw-call.dark ul li::before{ background:var(--gold); }

/* ============ STEP ============ */
.scw-steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.scw-step{ border:1px solid var(--line); padding:22px 20px; }
.scw-step .n{
  display:block; font-size:11px; letter-spacing:.18em; font-weight:800;
  color:var(--gold-text); margin:0 0 10px;
}
.scw-step h4{ margin:0 0 8px; font-size:15px; font-weight:700; color:var(--black); }
.scw-step p{ margin:0; font-size:13.5px; color:var(--ink-soft); line-height:1.7; }

/* ============ 정의형 목록 ============ */
.scw-def{ margin:22px 0 0; border-top:1px solid var(--line); }
.scw-def > div{ display:grid; grid-template-columns:190px 1fr; border-bottom:1px solid var(--line-soft); }
.scw-def dt{ padding:14px 16px 14px 0; font-weight:700; color:var(--black); font-size:14px; }
.scw-def dd{ margin:0; padding:14px 0; color:var(--ink-soft); font-size:14px; }
.scw-def dd b{ color:var(--black); }

/* ============ 연락처 ============ */
.scw-contact{
  background:var(--black); color:var(--ivory); padding:44px 30px; text-align:center; margin:0 -20px;
}
.scw-contact .eyebrow{
  font-size:11px; letter-spacing:.26em; color:var(--gold); font-weight:700; margin:0 0 14px;
}
.scw-contact .tel{ font-size:32px; font-weight:800; color:var(--gold); margin:0 0 10px; }
.scw-contact .addr{ font-size:13.5px; color:#A8A296; margin:0; }

/* ============ 태그 ============ */
.scw-tag{
  display:inline-block; padding:2px 8px; font-size:11px; font-weight:700;
  border:1px solid var(--gold-text); color:var(--gold-text); border-radius:2px;
  margin-left:7px; vertical-align:2px; letter-spacing:0;
}

/* ============ 모바일 ============ */
@media (max-width:760px){
  .scw{ font-size:14.5px; padding-bottom:60px; }
  .scw-hero{ padding:48px 20px 42px; }
  .scw-hero img{ width:190px; margin-bottom:24px; }
  .scw-hero h1{ font-size:25px; }
  .scw-hero .lead{ font-size:14px; line-height:1.85; }
  .scw-nav{ margin-bottom:48px; gap:6px; }
  .scw-nav a{ padding:6px 12px; font-size:12.5px; }
  .scw-sec{ margin-bottom:52px; }
  .scw-sec > h2{ font-size:20px; }
  .scw-hint{ display:block; }
  .scw-steps{ grid-template-columns:1fr; }
  .scw-def > div{ grid-template-columns:1fr; }
  .scw-def dt{ padding:14px 0 0; }
  .scw-def dd{ padding:4px 0 14px; }
  .scw-contact .tel{ font-size:26px; }
}
/* ============ 모바일 스킨 방어 ============ */
/* 모바일 스킨은 #contents img{width:100%} 를 쓰므로
   ID 선택자를 앞에 붙여 로고 폭을 지킵니다. */
#contents .scw-hero img{ width:230px; max-width:62%; }
@media (max-width:760px){
  #contents .scw-hero img{ width:190px; }
}

/* BASIC css end */