@charset "UTF-8";
/* index.css — 홈(index.html) 전용 스타일
   2026-07-23: 인라인 <style> 6,572자 분리.
   공통 스타일 53개는 region.css 와 중복이라 제거하고 region.css 를 로드하도록 변경.
   ⚠️ 로드 순서: cable-guide.css -> region.css -> index.css */

@media(max-width:760px){.rc-grid{grid-template-columns:1fr}}
/* 데스크탑: 표 아래 note를 표와 같은 축(가운데)으로 — 영수증카드 안·경고박스는 예외 */
@media(min-width:701px){
  .rc-note{text-align:center}
  .receipt .rc-note{text-align:left;max-width:none}
}
/* 모바일: 순수표를 양옆으로 넓게 (히어로 wrap 미닫힘으로 생긴 이중 패딩 상쇄) */
@media(max-width:600px){
  .ptable:not(.rtable){width:calc(100% + 48px);max-width:none;margin-left:-24px;margin-right:-24px}
}
/* ── B안: 모바일에서 표를 행별 카드로 변환 (AI는 table 구조 그대로 읽음) ── */
@media(max-width:600px){
  .rtable,.rtable tbody,.rtable tr,.rtable td{display:block;width:100%}
  .rtable thead{position:absolute;left:-9999px}
  .rtable tr{background:var(--navy2);border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:12px}
  .rtable tr td{border:none;padding:6px 0;text-align:right;display:flex;justify-content:space-between;align-items:baseline;font-size:var(--fs-body)}
  .rtable tr td::before{content:attr(data-label);color:var(--mut);font-size:var(--fs-sm);font-weight:600;text-align:left}
  /* 첫 칸(구성/속도) = 카드 제목 */
  .rtable tr td:first-child{color:#0b1c4d;font-weight:800;font-size:var(--fs-subtitle);border-bottom:1px dashed var(--line);padding-bottom:8px;margin-bottom:4px;display:block;text-align:left}
  .rtable tr td:first-child::before{display:none}
  /* 최종금액(마지막 칸) 강조 */
  .rtable tr td:last-child{padding-top:8px;border-top:1px dashed var(--line);margin-top:4px}
  .rtable tr td:last-child b{color:var(--blue);font-size:var(--fs-title)}
}
@media(max-width:700px){.chan-grid{grid-template-columns:1fr}}
.rgbr{display:none}
@media(max-width:560px){.rgbr{display:inline}}
.live-panel{max-width:760px;margin:0 auto;border:1px solid #e3e8f2;border-radius:18px;background:#fff;box-shadow:0 10px 30px rgba(11,28,77,.06);overflow:hidden}
.live-top{display:flex;align-items:center;justify-content:space-between;padding:15px 22px;border-bottom:1px solid #eef1f7}
.live-ttl{font-weight:800;color:#0b1c4d;font-size:1.02rem}
.live-badge{display:inline-flex;align-items:center;gap:6px;background:#fdecec;color:#e02424;font-weight:800;font-size:.76rem;padding:4px 11px;border-radius:999px}
.live-dot2{width:7px;height:7px;border-radius:50%;background:#e02424;animation:livepulse 1.4s infinite}
@keyframes livepulse{0%,100%{opacity:1}50%{opacity:.2}}
.live-list{padding:4px 0}
.live-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:14px 22px;border-bottom:1px solid #f4f6fb}
.live-row:last-child{border-bottom:0}
.live-list .live-row:first-child{animation:liverow .45s ease}
@keyframes liverow{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
.live-name{font-weight:800;color:#0b1c4d;font-size:.96rem;white-space:nowrap}
.live-loc{color:#8a97bd;font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.live-prod{justify-self:end;background:#eef2fb;color:#1E40AF;font-weight:800;font-size:.8rem;padding:6px 12px;border-radius:999px;white-space:nowrap}
.live-note{text-align:center;color:#8a97bd;font-size:.82rem;margin:12px 22px 16px;line-height:1.5}
@media(max-width:420px){.live-prod{font-size:.74rem;padding:5px 9px}.live-row{gap:8px;padding:13px 16px}.live-name{font-size:.9rem}.live-loc{font-size:.8rem}}

/* 화이트 히어로 브랜드 색 오버라이드 (cable-guide 다크값 덮기) 2026-07-26 */
.bhero__brand span{color:#0b1c4d}
.bhero__brand b{color:#1E40AF}