/* 동네방네 렌탈 — 고객 화면 스타일
 * 원본: D:/app/rental/_preview_v9_live.html <style> 블록. 기계적으로 추출한다.
 * --rt-topgap 은 rental_app.js 가 사이트 헤더 높이로 채운다(두 sticky 바가 겹치지 않게).
 */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.css');
:root{
  --rt-accent:#1b64da; --rt-accent-d:#144da8; --rt-ink:#191f28; --rt-sub:#59636f;
  --rt-line:#e5e8eb; --rt-bg:#f7f8fa; --rt-card:#fff; --rt-kakao:#fee500;
  --rt-ok:#0f9d58; --rt-warn:#dc2626; --rt-pend:#8b5cf6; --rt-down:#8a5a00;
  --rt-radius:16px; --rt-bar:76px;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;font-family:'Pretendard Variable','Pretendard',-apple-system,BlinkMacSystemFont,'Malgun Gothic','맑은 고딕',sans-serif;
  background:var(--rt-bg);color:var(--rt-ink);-webkit-font-smoothing:antialiased;letter-spacing:-.015em;
  padding-bottom:calc(var(--rt-bar) + 8px)}
button{font-family:inherit;cursor:pointer}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #ffb300;outline-offset:2px}
h1,h2,h3,h4,p,ul{margin:0}
ul{padding-left:18px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.rt-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#rtMain:focus{outline:0}

.rt-wrap{max-width:560px;margin:0 auto;padding:0 16px}

/* ===== 상단 고정 ===== */
.rt-top{position:sticky;top:var(--rt-topgap,0px);z-index:6;background:#fff;border-bottom:1px solid var(--rt-line)}
.rt-top-r1{display:flex;align-items:center;gap:8px;height:52px}
.rt-back{width:44px;height:44px;border:0;background:none;font-size:26px;line-height:1;color:var(--rt-ink);padding:0}
.rt-title{flex:1;font-size:16px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rt-title small{display:block;font-size:11.5px;font-weight:600;color:var(--rt-sub);margin-top:1px}
.rt-cartbtn{border:1px solid var(--rt-line);background:#fff;border-radius:999px;
  font-size:12.5px;font-weight:700;padding:7px 12px;color:var(--rt-ink);white-space:nowrap}
.rt-cartbtn b{color:var(--rt-accent);margin-left:3px}

/* ===== 홈 배너 자리 ===== */
.rt-hero{position:relative;min-height:132px;background:linear-gradient(135deg,#eef4ff 0%,#f8fbff 100%);border-radius:var(--rt-radius);
  padding:18px 18px 16px;margin:12px 0 10px;border:1px solid #dbe6ff;overflow:hidden}
.rt-hero::after{content:'';position:absolute;width:156px;height:156px;right:-60px;top:-74px;border-radius:50%;background:rgba(27,100,218,.08);pointer-events:none}
.rt-hero > *{position:relative;z-index:1}
.rt-hero h1{max-width:278px;font-size:20px;line-height:1.34;font-weight:800;letter-spacing:-.45px}
.rt-hero h1 em{font-style:normal;color:var(--rt-accent-d)}
.rt-hero p{display:none;margin-top:8px;font-size:13.5px;line-height:1.65;color:var(--rt-sub)}
.rt-hero button{margin-top:11px;border:0;background:var(--rt-accent);color:#fff;
  border-radius:10px;font-size:13px;font-weight:800;min-height:38px;padding:8px 14px}

.rt-hero.bundle{background:linear-gradient(135deg,#f0fdf4 0%,#f8fef9 100%);border-color:#bbf7d0}
.rt-hero.bundle::after{background:rgba(15,157,88,.08)}
.rt-hero.bundle h1 em{color:var(--rt-ok)}
.rt-hero.bundle p{display:block}
.rt-hero.bundle button{background:var(--rt-ok)}

/* ===== 필터 ===== */
.rt-ctrl{margin:4px 0 22px;padding:4px 0 20px;border-bottom:1px solid var(--rt-line)}
.rt-chips{display:flex;gap:6px;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none;margin:0 -16px 8px;padding:0 16px 2px;flex-wrap:nowrap}
.rt-chips::-webkit-scrollbar{display:none}
/* ===== 제품 종류 타일 (v8) — 렌트리 홈 타일의 '모양'만 가져오고 별도 디렉토리 페이지는 만들지 않는다.
   접힌 상태 = CAT_FEATURED개(모바일 가로 스크롤 한 줄 / PC 한 줄), '전체 N개 보기' → 같은 자리에서 격자로 펼침. 애니메이션 없음 ===== */
.rt-cats{margin:0 0 18px}
.rt-cats-h{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:36px;margin-bottom:8px}
.rt-cats-h .t{font-size:14px;font-weight:800;color:var(--rt-ink)}
.rt-cats-toggle{display:none;border:0;background:none;min-height:36px;padding:5px 0 5px 12px;font-size:13px;font-weight:800;color:var(--rt-accent-d)}
.rt-cat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;list-style:none;margin:0;padding:0}
.rt-cat-grid::-webkit-scrollbar{display:none}
.rt-cat-grid li{min-width:0}
.rt-cat-grid.open{grid-template-columns:repeat(4,minmax(0,1fr))}

.rt-cat{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;min-height:88px;padding:4px 2px 5px;border-radius:12px;color:var(--rt-sub);text-decoration:none}
.rt-cat-ic{display:flex;align-items:center;justify-content:center;width:58px;height:58px;border-radius:17px;background:#f1f4f8;border:1.5px solid transparent;color:#3f5673}
.rt-cat-ic svg{width:27px;height:27px}
.rt-cat-l{font-size:13px;font-weight:700;line-height:1.3;text-align:center;word-break:keep-all}
.rt-cat:hover .rt-cat-ic{border-color:#c9d3e0}
.rt-cat[aria-current="true"]{color:var(--rt-accent-d)}
.rt-cat[aria-current="true"] .rt-cat-ic{background:#eef4ff;border-color:var(--rt-accent);color:var(--rt-accent-d)}
.rt-cat[aria-current="true"] .rt-cat-l{font-weight:800}
.rt-chip{border:1px solid var(--rt-line);background:#fff;border-radius:999px;
  min-height:44px;flex:0 0 auto;padding:6px 13px;font-size:12.5px;font-weight:700;color:var(--rt-sub)}
.rt-chip.on{background:var(--rt-accent);border-color:var(--rt-accent);color:#fff}
.rt-chip.bf.on{background:#eef4ff;color:var(--rt-accent-d);border-color:var(--rt-accent)}
.rt-brand-chips{display:none}
.rt-tools{display:flex;gap:8px;margin:16px 0 0}
.rt-tools input{flex:1;border:1.5px solid var(--rt-line);border-radius:11px;padding:10px 12px;
  min-height:48px;font-size:15px;font-family:inherit;min-width:0}
.rt-tools select{border:1.5px solid var(--rt-line);border-radius:11px;padding:10px 10px;
  font-size:14px;font-weight:700;font-family:inherit;background:#fff;color:var(--rt-ink)}
.rt-brand-mobile{display:block;flex:0 0 106px;min-width:0}
.rt-brand-mobile select{width:100%;min-height:48px;padding:8px 7px;font-size:13px;overflow:hidden;text-overflow:ellipsis}
.rt-facet-row{margin:0 -16px 14px;padding:0 16px 4px}
.rt-facet-chips{display:flex;min-width:0;gap:6px;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none}
.rt-facet-chips::-webkit-scrollbar{display:none}
.rt-facet-chip{flex:0 0 auto;min-height:40px;padding:7px 12px;border:1px solid var(--rt-line);border-radius:999px;background:#fff;color:var(--rt-sub);font-size:13.5px;font-weight:700}
.rt-facet-chip.on{border-color:var(--rt-accent);background:#eef4ff;color:var(--rt-accent-d)}

/* ===== 목록 ===== */
.rt-listhead{display:flex;align-items:baseline;justify-content:space-between;margin:4px 0 16px}
.rt-listhead .n{font-size:18px;font-weight:800}
.rt-listhead .n b{color:var(--rt-accent)}
.rt-basis{margin:0 0 12px;font-size:12px;color:var(--rt-sub);line-height:1.6}
.rt-guide{display:none;margin:0 0 12px;padding:10px 12px;background:#eef4ff;border-radius:11px;color:#3f5673;font-size:12px;line-height:1.55}
.rt-guide b{display:block;margin-bottom:2px;color:var(--rt-ink);font-size:12.5px}
.rt-cards{display:grid;gap:10px}
.rt-pcard{display:flex;gap:12px;align-items:flex-start;width:100%;min-height:120px;text-align:left;background:var(--rt-card);
  border:1px solid var(--rt-line);border-radius:var(--rt-radius);padding:14px;color:var(--rt-ink)}
.rt-pcard:hover{border-color:#c9d3e0}
.rt-pthumb{flex:0 0 64px;width:64px;height:64px;border-radius:12px;background:#f2f4f6;border:1px solid var(--rt-line);
  display:flex;align-items:center;justify-content:center;overflow:hidden}
.rt-pthumb img{width:100%;height:100%;object-fit:cover;display:block}
.rt-pbody{flex:1;min-width:0}
@media (min-width:900px){
  .rt-pthumb{flex-basis:76px;width:76px;height:76px}
}
.rt-pbrand{font-size:12.5px;color:var(--rt-sub);font-weight:700}
.rt-pname{font-size:16px;font-weight:800;margin-top:3px;line-height:1.42}
.rt-pname small{font-weight:600;color:var(--rt-sub);font-size:12px;margin-left:5px}
.rt-popt{font-size:11.5px;color:var(--rt-sub);margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rt-promos{display:flex;flex-wrap:wrap;gap:4px;margin-top:7px}
.rt-promos span{font-size:10.5px;font-weight:700;color:#0f7b45;background:#e7f6ee;border-radius:5px;padding:2px 6px}
.rt-promos span.wa{color:var(--rt-down);background:#fff4d6}
.rt-ribbon{display:inline-block;background:var(--rt-accent);color:#fff;font-size:10px;font-weight:800;
  border-radius:5px;padding:2px 6px;margin-right:5px;vertical-align:2px}
.rt-ribbon.mo{background:#495057}
.rt-ptotal{margin-top:9px;font-size:17px;font-weight:800;letter-spacing:-.3px}
.rt-ptotal small{display:block;font-size:11px;font-weight:600;color:var(--rt-sub);margin-top:2px;letter-spacing:0}
.rt-pmonthly{margin-top:10px;font-size:18px;font-weight:800;letter-spacing:-.3px}
.rt-pmonthly small{display:block;margin-top:3px;font-size:12px;font-weight:600;letter-spacing:0;color:var(--rt-sub)}

/* 제품 종류 바로 아래에서 먼저 살펴볼 상품. 인기·판매량 주장은 데이터가 생기기 전까지 넣지 않는다. */
.rt-featured{margin:0 0 32px;padding:0;background:transparent;border:0;border-radius:0}
.rt-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:14px}
.rt-section-head h2{font-size:18px;line-height:1.3;font-weight:800}
.rt-featured .rt-cards{gap:9px}
@media (max-width:599px){
  .rt-featured .rt-cards{display:flex;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;padding:0 18px 4px 0;
    scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
  .rt-featured .rt-pcard{flex:0 0 min(82vw,310px);scroll-snap-align:start}
}
.rt-cardwarn{display:inline-block;margin-top:6px;padding:3px 6px;background:#fff4d6;border-radius:5px;color:#745300;font-size:10.5px;font-weight:800}
.rt-pdisc{margin-top:3px;font-size:11.5px;color:var(--rt-ok);font-weight:700}
.rt-more{display:block;width:100%;margin-top:10px;border:1px solid var(--rt-line);background:#fff;
  border-radius:12px;padding:12px;font-size:13px;font-weight:700;color:var(--rt-accent-d)}

/* 총 이용 금액으로 줄을 세울 때만 카드에 뜬다 — 안 보이는 값으로 정렬하면 고장으로 읽힌다 */
.rt-ptotalline{margin-top:5px;font-size:13px;font-weight:800;color:var(--rt-sub);letter-spacing:-.2px}
.rt-ptotalline small{font-size:11px;font-weight:600;color:var(--rt-sub);margin-left:5px;letter-spacing:0}

/* 번호 페이지네이션 — PC 에서만 그려진다(무한 스크롤과 마크업이 아예 갈린다) */
.rt-pager{margin-top:22px}
.rt-pg-note{text-align:center;font-size:12px;color:var(--rt-sub);margin-bottom:10px}
.rt-pg-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px}
.rt-pg{min-width:38px;min-height:38px;padding:0 10px;border:1px solid var(--rt-line);border-radius:9px;
  background:#fff;color:var(--rt-sub);font-size:13.5px;font-weight:700}
.rt-pg:hover:not(:disabled){border-color:#c9d3e0;color:var(--rt-ink)}
.rt-pg.on{border-color:var(--rt-accent);background:var(--rt-accent);color:#fff;font-weight:800}
.rt-pg:disabled{opacity:.35}
.rt-pg:focus-visible{outline:3px solid #ffb300;outline-offset:2px}
.rt-pg-gap{padding:0 2px;color:var(--rt-sub);font-size:13px}
.rt-noresult{padding:30px 10px;text-align:center;font-size:13px;color:var(--rt-sub);line-height:1.7}

/* ===== 공통 섹션 ===== */
.rt-sec{background:#fff;border:1px solid var(--rt-line);border-radius:var(--rt-radius);
  padding:16px;margin-top:12px}
.rt-sec-t{font-size:15px;font-weight:800;margin-bottom:12px;display:flex;align-items:center;gap:7px}
.rt-sec-t .step{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;
  border-radius:50%;background:var(--rt-accent);color:#fff;font-size:11.5px;font-weight:800}

/* ===== 상세 ===== */
.rt-dbrand{font-size:12.5px;color:var(--rt-sub);font-weight:700}
.rt-dname{font-size:20px;font-weight:800;margin-top:2px;letter-spacing:-.3px}
.rt-dcode{font-size:11.5px;color:var(--rt-sub);margin-top:4px}
.rt-ptags{display:flex;flex-wrap:wrap;gap:5px}
.rt-ptags span{font-size:11px;font-weight:700;color:#3f5673;background:#eef2f7;border-radius:6px;padding:3px 7px}
.rt-ptags span.wa{color:var(--rt-down);background:#fff4d6}
.rt-q-label{font-size:12.5px;font-weight:800;color:var(--rt-sub);margin-bottom:7px}
/* 축 설명 ⓘ 팝오버 (2026-09-03) */
.rt-q-label{display:flex;align-items:center;gap:6px}
.rt-q-info{border:0;background:none;padding:4px;margin:-4px;font-size:13px;line-height:1;color:var(--rt-sub);cursor:pointer}   /* 여백으로 탭 영역만 넓힌다 */
.rt-q-pop{margin:-2px 0 9px;padding:10px 12px;border:1px solid var(--rt-line);border-radius:10px;background:#f7f9fc;font-size:12px;line-height:1.6;color:var(--rt-ink)}
.rt-q-pop b{font-weight:800}
.rt-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.rt-opt{display:block;min-height:72px;text-align:left;background:#fff;border:1.5px solid var(--rt-line);
  border-radius:12px;padding:11px 12px;color:var(--rt-ink)}
.rt-opt.on{border-color:var(--rt-accent);background:#f4f8ff}
.rt-opt .oy{display:block;font-size:14px;font-weight:800}
.rt-opt .om{display:block;font-size:12.5px;font-weight:700;color:var(--rt-accent-d);margin-top:3px}
.rt-opt .ot{display:block;font-size:11.5px;color:var(--rt-sub);margin-top:3px;line-height:1.5}
.rt-opt .od{display:block;font-size:11px;color:var(--rt-warn);font-weight:700;margin-top:3px}
.rt-opt .ob{display:block;font-size:10.5px;color:var(--rt-down);font-weight:700;margin-top:3px}
/* 할인 리본 — 카드 오른쪽 위 안쪽. 기존 .rt-ribbon(히어로용)과 이름을 나눈다(2026-09-03) */
.rt-opt{position:relative}
.rt-opt .rt-opt-ribbon + .oy{padding-right:38px}   /* 긴 제목 첫 줄이 리본 밑으로 들어가지 않게 */
.rt-opt-ribbon{position:absolute;top:-1px;right:-1px;padding:2px 7px;border-radius:0 12px 0 8px;background:#0f7b45;color:#fff;font-size:10px;font-weight:800;letter-spacing:.02em}
.rt-note{margin-top:9px;font-size:12px;line-height:1.65;color:var(--rt-sub);
  background:#f7f8fa;border-radius:9px;padding:9px 11px}

/* 비용 */
.rt-cost{background:#fff;border:1px solid var(--rt-line);border-radius:var(--rt-radius);
  overflow:hidden;margin-top:12px}
.rt-cost-h{display:flex;width:100%;align-items:center;justify-content:space-between;gap:12px;background:#f4f8ff;border:0;
  padding:13px 16px;font-size:14px;font-weight:800;text-align:left;color:var(--rt-ink)}
.rt-cost-h .more{font-size:12px;font-weight:700;color:var(--rt-accent-d)}
.rt-cost-b{padding:4px 16px 14px}
.rt-cr{padding:11px 0;border-bottom:1px dashed var(--rt-line)}
.rt-cr:last-child{border-bottom:0}
.rt-cr-top{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.rt-cr .l{font-size:13px;font-weight:700}
.rt-cr .v{font-size:14px;font-weight:800;text-align:right}
.rt-cr .v .was{font-weight:600;color:var(--rt-sub);text-decoration:line-through;font-size:11.5px;margin-right:5px}
.rt-cr .n{margin-top:5px;font-size:11.5px;line-height:1.6;color:var(--rt-sub)}
.rt-cr.total{border-top:2px solid var(--rt-ink);border-bottom:0;margin-top:4px;padding-top:13px}
.rt-cr.total .l{font-size:14.5px}
.rt-cr.total .v{font-size:20px;color:var(--rt-accent-d)}
.minus{color:var(--rt-ok)}
.rt-pending{font-size:11.5px;font-weight:800;color:var(--rt-pend);background:#f3eeff;border-radius:5px;padding:2px 6px}
.rt-range{font-size:11.5px;color:var(--rt-sub)}
.rt-safe{margin:10px 0 0;background:#fff8e8;border:1px solid #f6d68a;border-radius:10px;padding:10px 11px;font-size:11.5px;line-height:1.65;color:#745300}
.rt-safe b{color:var(--rt-ink)}
.rt-pricebox{background:#fff;border:1px solid var(--rt-line);border-radius:var(--rt-radius);padding:18px 16px}
.rt-pricebox .eyebrow{font-size:12px;font-weight:800;color:var(--rt-sub)}
.rt-pricebox .price{margin-top:5px;font-size:25px;font-weight:800;letter-spacing:-.6px;color:var(--rt-accent-d)}
.rt-pricebox .condition{margin-top:5px;font-size:12.5px;font-weight:700;color:var(--rt-ink)}
.rt-pricebox .note{margin-top:13px;padding-top:12px;border-top:1px dashed var(--rt-line);font-size:11.5px;line-height:1.6;color:var(--rt-sub)}
.rt-pricebox .price-was{margin-top:3px;font-size:13px;font-weight:600;color:var(--rt-sub)}
.rt-pricebox .note .row{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:3px 0;font-size:12px}
.rt-pricebox .note .row .l{flex:0 0 auto;color:var(--rt-sub)}
.rt-pricebox .note .row .v{font-weight:700;color:var(--rt-ink);text-align:right}
/* 예상 렌탈료(할인 적용) — 2026-09-01. 취소선 = 할인 전 기본 요금, 큰 숫자 = 파트너 요금표의 할인 구간 요금 */
.rt-pricebox .was{margin-top:5px;font-size:13.5px;font-weight:600;color:var(--rt-sub);text-decoration:line-through}
.rt-pricebox .was + .price{margin-top:1px}
.rt-pricebox .until{margin-top:4px;font-size:12.5px;font-weight:700;color:var(--rt-ink);line-height:1.5}
.rt-pricebox .rt-badges{display:flex;flex-wrap:wrap;gap:4px;margin-top:7px}
.rt-pricebox .rt-badges span{font-size:10.5px;font-weight:700;color:#0f7b45;background:#e7f6ee;border-radius:5px;padding:2px 6px}
.rt-pricebox .rt-applied-note{margin:10px 0 0;font-size:11px;line-height:1.5;color:var(--rt-sub)}
.rt-tradein{margin-top:12px;padding:11px 10px;border:1px solid var(--rt-line);border-radius:10px;background:#fafcff}
.rt-tradein .t{font-size:12px;font-weight:800;color:var(--rt-ink)}
.rt-tradein .sub{margin-top:2px;font-size:11.5px;color:var(--rt-sub)}
.rt-tradein .btns{display:flex;gap:6px;margin-top:8px}
.rt-tradein .btns button{flex:1;padding:8px 6px;border:1.5px solid var(--rt-line);border-radius:9px;background:#fff;font-size:12px;font-weight:700;color:var(--rt-ink);cursor:pointer}
.rt-tradein .btns button .om{display:block;margin-top:2px;font-size:11px;font-weight:800;color:var(--rt-accent-d)}
.rt-tradein .btns button[aria-pressed="true"]{border-color:var(--rt-accent);background:#eef6ff}
.rt-tradein .note{margin:8px 0 0;padding:0;border:0;font-size:11px;line-height:1.5;color:var(--rt-sub)}
/* 파트너가 같은 계약에 함께 보낸 다른 선택지 — 읽기 전용 안내다(여기서 고를 수 없다) */
.rt-alts{margin-top:10px;border:1px solid var(--rt-line);border-radius:10px;background:#fff}
.rt-alts>summary{list-style:none;cursor:pointer;padding:11px 13px;font-size:12.5px;font-weight:700;color:var(--rt-ink)}
.rt-alts>summary::-webkit-details-marker{display:none}
.rt-alts>summary::after{content:'▾';float:right;color:var(--rt-sub)}
.rt-alts[open]>summary::after{content:'▴'}
.rt-alts .body{padding:0 13px 12px}
.rt-alts .row{display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  padding:7px 0;border-top:1px dashed var(--rt-line);font-size:12px}
.rt-alts .row .l{color:var(--rt-sub)}
.rt-alts .row .v{flex:0 0 auto;font-weight:700;color:var(--rt-ink)}
.rt-alts .row.more{color:var(--rt-sub);justify-content:flex-start}
.rt-alts .note{margin-top:9px;font-size:11px;line-height:1.6;color:var(--rt-sub)}
.rt-picker{background:#fff;border:1px solid var(--rt-line);border-radius:var(--rt-radius);padding:18px 16px;box-shadow:0 8px 24px rgba(29,43,57,.08)}
.rt-picker-head{padding-bottom:15px;border-bottom:1px solid var(--rt-line)}
.rt-picker-title{margin-top:3px;font-size:17px;font-weight:800;letter-spacing:-.3px}
/* 조건 카드 머리 제품 요약 (2026-09-03) */
.rt-picker-prod{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.rt-picker-prod .th{flex:0 0 52px;width:52px;height:52px;border-radius:10px;background:#f1f4f8;overflow:hidden}
.rt-picker-prod .th img{width:100%;height:100%;object-fit:contain}
.rt-picker-prod .b{font-size:11.5px;font-weight:700;color:var(--rt-sub)}
.rt-picker-prod .n{font-size:13.5px;font-weight:800;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rt-picker-prod .m{font-size:11px;color:var(--rt-sub);margin-top:2px}
.rt-picker-prod .tx{min-width:0}
.rt-picker-help{margin-top:5px;font-size:12px;line-height:1.55;color:var(--rt-sub)}
.rt-picker-row{margin-top:16px}
.rt-picker .rt-opts{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.rt-picker .rt-opt{min-height:67px;padding:10px}
.rt-picker .rt-opt .oy{font-size:13px}
.rt-picker .rt-opt .om{font-size:11.5px;font-weight:600;color:var(--rt-sub)}
.rt-picker .rt-opt.on .om{color:var(--rt-accent-d);font-weight:700}
.rt-picker .rt-pricebox{margin-top:18px;background:#f7faff;border-color:#dce9fb;box-shadow:none}
.rt-picker-cta{width:100%;min-height:52px;margin-top:10px;border:0;border-radius:12px;background:var(--rt-accent);color:#fff;font-size:15px;font-weight:800}
.rt-picker-cta:hover{background:var(--rt-accent-d)}
.rt-picker-cta.ghost{background:#fff;color:var(--rt-accent-d);border:1.5px solid var(--rt-accent);margin-top:8px}
.rt-picker-cta.ghost:hover{background:#f4f8ff}
.rt-picker-close{display:none}
.rt-picker-backdrop{position:fixed;inset:0;z-index:60;background:rgba(17,24,39,.45)}
.rt-mobile-detail-bar{position:fixed;right:0;bottom:0;left:0;z-index:45;display:flex;align-items:center;gap:12px;
  min-height:76px;padding:10px max(16px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
  background:rgba(255,255,255,.97);border-top:1px solid var(--rt-line);box-shadow:0 -6px 22px rgba(29,43,57,.08)}
.rt-mobile-detail-bar .sum{min-width:0;flex:1}
.rt-mobile-detail-bar .sum span{display:block;font-size:11px;font-weight:700;color:var(--rt-sub)}
.rt-mobile-detail-bar .sum strong{display:block;margin-top:2px;font-size:19px;font-weight:800;letter-spacing:-.35px}
.rt-mobile-detail-bar .sum strong{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px}
.rt-mobile-detail-bar .sum .was{font-size:11.5px;font-weight:600;color:var(--rt-sub);white-space:nowrap}
.rt-mobile-detail-bar button{flex:0 0 auto;min-height:48px;border:0;border-radius:12px;padding:10px 15px;background:var(--rt-accent);color:#fff;font-size:14px;font-weight:800}
.rt-mobile-detail-bar button.ghost{background:#fff;color:var(--rt-accent-d);border:1.5px solid var(--rt-accent)}
body.rt-picker-open{overflow:hidden}
@media (max-width:899px){
  .rt-picker[role="dialog"]{position:fixed;right:0;bottom:0;left:0;z-index:61;max-height:min(84dvh,720px);overflow-y:auto;overflow-x:hidden;
    border-radius:20px 20px 0 0;padding:19px 16px calc(18px + env(safe-area-inset-bottom));box-shadow:0 -12px 32px rgba(17,24,39,.18)} /* 2026-09-03 overflow-x: 모바일 폭 검증에서 닫기 버튼 4px 가로 넘침(데스크톱 스크롤바 폭) */
  .rt-picker[role="dialog"] .rt-picker-head{position:relative;padding-right:44px}
  .rt-picker[role="dialog"] .rt-picker-close{position:absolute;top:-7px;right:-4px;display:flex;width:40px;height:40px;
    align-items:center;justify-content:center;border:0;border-radius:50%;background:#f1f3f5;color:var(--rt-ink);font-size:22px;line-height:1}
  .rt-picker[role="dialog"] .rt-picker-prod{display:none}   /* 시트 아래 화면이 이미 그 제품이다(2026-09-03) */
  /* PC 전용 하단 요약바 요소 — 모바일은 기존 "조건 고르기" 버튼만 남긴다.
     .cond 는 .sum span{display:block} 보다 명시도가 낮아지므로 .sum 을 끼워 넣어야 실제로 숨는다(2026-09-03). */
  .rt-mobile-detail-bar .pc-only{display:none}
  .rt-mobile-detail-bar .sum .cond{display:none}
}

/* 사양 */
.rt-sr{padding:10px 0;border-bottom:1px dashed var(--rt-line)}
.rt-sr:last-child{border-bottom:0}
.rt-sr-top{display:flex;justify-content:space-between;gap:10px}
.rt-sr .l{font-size:12.5px;color:var(--rt-sub);font-weight:700;flex:0 0 88px}
.rt-sr .v{font-size:13px;font-weight:700;text-align:right;word-break:break-all}
.rt-decision{margin-top:12px;padding:14px;background:#f7f8fa;border-radius:12px}
.rt-decision h3{font-size:13.5px;font-weight:800}
.rt-decision p{margin-top:5px;font-size:12px;line-height:1.6;color:var(--rt-sub)}
.rt-decision ul{margin-top:8px;padding-left:17px;font-size:12px;line-height:1.7;color:var(--rt-sub)}

/* 고지 아코디언 */
.rt-acc{border:1px solid var(--rt-line);border-radius:12px;background:#fff;margin-top:8px;overflow:hidden}
.rt-acc-h{display:flex;width:100%;justify-content:space-between;align-items:center;gap:10px;
  background:none;border:0;padding:13px 14px;font-size:13px;font-weight:700;text-align:left;color:var(--rt-ink)}
.rt-acc-b{padding:0 14px 14px;font-size:12px;line-height:1.75;color:var(--rt-sub)}
.rt-acc-b b{color:var(--rt-ink)}

/* ===== 상담 ===== */
.rt-empty{padding:26px 10px;text-align:center;font-size:13px;line-height:1.7;color:var(--rt-sub);
  background:#f7f8fa;border-radius:12px}
.rt-ci{position:relative;border:1px solid var(--rt-line);border-radius:12px;padding:12px 34px 12px 12px;margin-bottom:8px}
.rt-ci .x{position:absolute;top:8px;right:8px;width:36px;height:36px;border:0;background:#f1f3f5;
  border-radius:50%;font-size:14px;color:var(--rt-sub);line-height:1}
.rt-ci .nm{font-size:14px;font-weight:800}
.rt-ci .op{font-size:11.5px;color:var(--rt-sub);margin-top:3px}
.rt-ci .pr{font-size:13px;font-weight:800;margin-top:6px}
.rt-ci .gf{font-size:11px;color:var(--rt-ok);font-weight:700;margin-top:4px}
.rt-ci .gp{font-size:11px;color:var(--rt-pend);font-weight:700;margin-top:4px}
.rt-net{background:#fff;border:1px solid var(--rt-line);border-radius:var(--rt-radius);padding:14px 16px;margin-top:12px}
.rt-net label{display:flex;gap:9px;align-items:center;font-size:14px;font-weight:700}
.rt-net .det{margin-top:10px;font-size:12px;line-height:1.7;color:var(--rt-sub)}
.rt-net .det li{margin-top:5px}
.rt-sum-row{display:flex;justify-content:space-between;align-items:baseline;padding:9px 0;
  border-bottom:1px dashed var(--rt-line)}
.rt-sum-row .l{font-size:13px;font-weight:700}
.rt-sum-row .v{font-size:14px;font-weight:800}
.rt-sum-row.big{border-bottom:0;border-top:2px solid var(--rt-ink);margin-top:4px;padding-top:12px}
.rt-sum-row.big .l{font-size:14.5px}
.rt-sum-row.big .v{font-size:21px;color:var(--rt-accent-d)}
.rt-calc{margin-top:8px;border:0;background:none;color:var(--rt-sub);font-size:12px;font-weight:700;padding:0}
.rt-calcbox{margin-top:7px;background:#f7f8fa;border-radius:9px;padding:10px;font-size:11.5px;
  line-height:1.8;color:var(--rt-sub)}
.rt-guar div{font-size:12.5px;line-height:1.7;color:var(--rt-sub)}
.rt-guar div+div{margin-top:11px}
.rt-guar b{display:block;color:var(--rt-ink);font-size:13.5px;margin-bottom:2px}
.rt-btn{display:block;width:100%;border:0;border-radius:13px;padding:15px;font-size:15px;font-weight:800}
.rt-btn.kakao{background:var(--rt-kakao);color:#3c1e1e}
.rt-btn.kakao:disabled{opacity:.45}
.rt-btn.ghost{background:#fff;border:1.5px solid var(--rt-line);color:var(--rt-ink)}
.rt-btn.apply{background:var(--rt-accent);color:#fff}
.rt-micro{margin-top:9px;font-size:11.5px;line-height:1.6;color:var(--rt-sub);text-align:center}
.rt-field{margin-bottom:10px}
.rt-field label{display:block;font-size:12.5px;font-weight:700;margin-bottom:5px}
.rt-field input,.rt-field select{width:100%;border:1.5px solid var(--rt-line);border-radius:11px;
  padding:12px;font-size:14px;font-family:inherit}
.rt-agree{display:flex;gap:9px;align-items:flex-start;font-size:12px;line-height:1.6;
  color:var(--rt-sub);margin:12px 0}
.rt-agree a{color:var(--rt-accent);font-weight:700;text-decoration:underline;cursor:pointer}

/* ===== 완료 ===== */
.rt-done{background:#fff;border:1px solid var(--rt-line);border-radius:var(--rt-radius);
  padding:30px 20px;margin-top:16px;text-align:center}
.rt-done .ic{width:54px;height:54px;border-radius:50%;background:#e7f6ee;color:var(--rt-ok);
  display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:800;margin:0 auto 14px}
.rt-done h2{font-size:19px;font-weight:800}
.rt-done .ref{margin-top:8px;font-size:12.5px;color:var(--rt-sub)}
.rt-done .ref b{color:var(--rt-ink);letter-spacing:.5px}
.rt-done-sum{text-align:left;background:#f7f8fa;border-radius:12px;padding:13px;margin-top:16px;
  font-size:12.5px;line-height:1.75;color:var(--rt-sub)}
.rt-done-sum b{color:var(--rt-ink)}
.rt-done-note{text-align:left;margin-top:14px;font-size:12px;line-height:1.75;color:var(--rt-sub)}

/* ===== 푸터 ===== */
.rt-foot{margin-top:22px;padding:18px 0 26px;border-top:1px solid var(--rt-line);
  font-size:11px;line-height:1.75;color:#59636f}
.rt-foot .mid{background:#f1f3f5;border-radius:9px;padding:10px 12px;margin-bottom:10px;color:var(--rt-sub)}

/* ===== 하단 고정 요약바 ===== */
/* 무한 스크롤은 아래로만 길어져 되돌아 올라갈 길이 없다 — 오른쪽 아래에 [맨 위로]를 띄운다.
   상담 바(40) 위, 필터 시트(50) 아래. 시트를 열면 시트가 덮는다. */
.rt-totop{position:fixed;right:16px;bottom:calc(84px + env(safe-area-inset-bottom));z-index:41;
  width:46px;height:46px;border-radius:50%;border:1px solid var(--rt-line);background:#fff;
  color:var(--rt-sub);box-shadow:0 4px 14px rgba(29,43,57,.16);
  display:flex;align-items:center;justify-content:center;padding:0}
.rt-totop[hidden]{display:none}
.rt-totop:focus-visible{outline:3px solid #ffb300;outline-offset:2px}

.rt-bar{position:fixed;left:0;right:0;bottom:0;z-index:40;background:#fff;
  border-top:1px solid var(--rt-line);padding:10px 0 calc(10px + env(safe-area-inset-bottom))}
.rt-bar-in{max-width:560px;margin:0 auto;padding:0 16px;display:flex;align-items:center;gap:12px}
.rt-bar .info{flex:1;min-width:0}
.rt-bar .info .l{font-size:11px;color:var(--rt-sub);font-weight:700}
.rt-bar .info .m{font-size:19px;font-weight:800;letter-spacing:-.3px;line-height:1.25}
.rt-bar .info .t{font-size:11.5px;color:var(--rt-sub);margin-top:1px}
.rt-bar button{flex:0 0 auto;border:0;border-radius:12px;background:var(--rt-accent);color:#fff;
  font-size:14.5px;font-weight:800;padding:14px 20px}
.rt-bar button.kakao{background:var(--rt-kakao);color:#3c1e1e}

/* ===== 동의 팝업 / 토스트 ===== */
.rt-pop-bg{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:60;display:none;
  align-items:center;justify-content:center;padding:18px}
.rt-pop-bg.show{display:flex}
.rt-pop{background:#fff;border-radius:16px;max-width:520px;width:100%;max-height:82vh;
  display:flex;flex-direction:column;padding:20px}
.rt-pop h3{font-size:16px;font-weight:800;margin-bottom:12px}
.rt-consent-body{overflow:auto;font-size:12px;line-height:1.8;color:var(--rt-sub);margin-bottom:14px}
.rt-toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--rt-bar) + 22px);
  background:rgba(25,31,40,.94);color:#fff;font-size:13px;padding:12px 18px;border-radius:11px;
  z-index:70;display:none;max-width:88%;text-align:center;line-height:1.5}
.rt-toast.show{display:block}

/* ===== 태블릿·PC 확장 ===== */
@media (min-width:600px){
  .rt-wrap{max-width:760px}
  .rt-hero{min-height:154px;padding:25px 26px;margin-top:18px}
  .rt-hero h1{max-width:430px;font-size:26px}
  .rt-hero p{display:block;max-width:520px}
  .rt-hero button{min-height:42px;font-size:14px}
  .rt-guide{display:block}
  .rt-cards{grid-template-columns:1fr 1fr}
  .rt-cat-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
  .rt-cat-more{display:none}
  .rt-cats-toggle{display:inline-block}
  .rt-cat-grid.open{grid-template-columns:repeat(7,minmax(0,1fr))}
  .rt-cat-grid li{flex:none}
  .rt-cat-ic{width:62px;height:62px}
}
@media (min-width:900px){
  .rt-wrap{max-width:1060px}
  .rt-bar-in{max-width:1060px}
  .rt-hero{min-height:210px;padding:44px 40px 40px;text-align:center}
  .rt-hero h1{font-size:34px}
  .rt-hero p{font-size:15px;max-width:620px;margin-left:auto;margin-right:auto}
  .rt-hero button{min-height:44px;font-size:15px}
  .rt-brand-mobile{display:none}
  .rt-brand-chips{display:block}
  .rt-mobile-detail-bar{display:none!important}
  /* 상세 화면에서만 PC 하단 요약바로 재사용한다(2026-09-03) */
  body.rt-view-detail .rt-mobile-detail-bar{display:flex!important;left:50%;transform:translateX(-50%);right:auto;width:min(100%,1060px);border-radius:14px 14px 0 0}
  .rt-mobile-detail-bar .mo-only{display:none}
  body.rt-view-detail main.rt-wrap{padding-bottom:96px}   /* main 에만 — .rt-top 안의 .rt-wrap 까지 먹으면 상단 바가 부푼다(2026-09-03 운영 발견) */
  .rt-cards{grid-template-columns:1fr 1fr}
  .rt-detail-cols,.rt-consult-cols{display:grid;grid-template-columns:1fr 400px;gap:20px;align-items:start}
  .rt-detail-rail,.rt-consult-rail{position:sticky;top:calc(var(--rt-topgap,0px) + 66px)}
  .rt-detail-rail .rt-picker{max-height:calc(100vh - var(--rt-topgap,0px) - 86px);overflow-y:auto;overscroll-behavior:contain}
}
/* 상세 화면일 때 PC 하단 요약바 높이만큼 우측 레일 스크롤 영역을 줄인다.
   기존 .rt-detail-rail .rt-picker max-height 규칙은 그대로 두고 더 구체적인 선택자로 뒤에 얹는다(2026-09-03). */
@media (min-width:900px){ body.rt-view-detail .rt-detail-rail .rt-picker{max-height:calc(100vh - var(--rt-topgap,0px) - 86px - 84px)} }

/* ── 목록 필터 ──
   마크업은 한 벌이고 폭에 따라 모양만 바뀐다.
   ~599 모바일 · 600~899 태블릿 세로 : 아래에서 올라오는 시트
   900~ 태블릿 가로·PC : 목록 머리 아래로 펼쳐지는 인라인 패널 */
.rt-listhead{flex-wrap:wrap;gap:8px}
.rt-lh-tools{display:flex;align-items:center;gap:6px;margin-left:auto;flex:0 0 auto}
.rt-lh-btn{display:inline-flex;align-items:center;gap:5px;min-height:38px;padding:7px 13px;
  border:1px solid var(--rt-line);border-radius:999px;background:#fff;color:var(--rt-ink);
  font-size:13px;font-weight:700;white-space:nowrap}
.rt-lh-btn.on{border-color:var(--rt-accent);background:#eef4ff;color:var(--rt-accent-d)}
.rt-lh-btn .cnt{display:inline-block;min-width:18px;height:18px;line-height:18px;padding:0 5px;
  border-radius:999px;background:var(--rt-accent);color:#fff;font-size:11px;font-weight:800;text-align:center}
.rt-lh-btn:focus-visible{outline:3px solid #ffb300;outline-offset:2px}
.rt-lh-select{min-width:0;max-width:180px;min-height:38px;padding:7px 30px 7px 13px;
  border:1px solid var(--rt-line);border-radius:999px;background:#fff;color:var(--rt-ink);
  font-size:13px;font-weight:700;appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 11 7'%3E%3Cpath d='M1 1l4.5 4.5L10 1' fill='none' stroke='%2359636f' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 11px center}
.rt-lh-select:focus-visible{outline:3px solid #ffb300;outline-offset:2px}

.rt-filter[hidden]{display:none}
.rt-filter-back{display:none}
.rt-filter-inner{background:#fff}
.rt-filter-head{display:none;align-items:center;justify-content:space-between;
  padding-bottom:10px;border-bottom:1px solid var(--rt-line);margin-bottom:14px}
.rt-filter-head b{font-size:16px;font-weight:800}
.rt-filter-close{border:0;background:none;min-height:44px;min-width:44px;font-size:22px;color:var(--rt-sub);line-height:1}
/* 마크업은 PC 표와 시트가 한 벌이다 — 시트에서는 표 쪽 글자를 감춘다(그 반대는 900 이상 블록에서) */
.rt-fh-pc{display:none}
.rt-fx-reset-top{display:none}
.rt-filter-close .t{display:none}
.rt-fx{margin-bottom:14px}
.rt-fx-name{font-size:12.5px;font-weight:800;color:var(--rt-sub);margin-bottom:7px}
.rt-fx-chips{display:flex;flex-wrap:wrap;gap:6px}
.rt-fx-chip{min-height:40px;padding:8px 13px;border:1px solid var(--rt-line);border-radius:999px;
  background:#fff;color:var(--rt-ink);font-size:13.5px;font-weight:700;text-align:left}
.rt-fx-chip.on{border-color:var(--rt-accent);background:#eef4ff;color:var(--rt-accent-d)}
.rt-fx-chip:focus-visible{outline:3px solid #ffb300;outline-offset:2px}
.rt-fx-foot{display:flex;align-items:center;gap:8px;padding-top:12px;border-top:1px solid var(--rt-line)}
.rt-fx-reset{border:0;background:none;min-height:44px;padding:0 8px;font-size:13px;font-weight:700;color:var(--rt-sub)}
.rt-fx-apply{margin-left:auto;border:0;border-radius:10px;background:var(--rt-accent);color:#fff;
  min-height:44px;padding:11px 22px;font-size:14px;font-weight:800}

@media (max-width:899px){
  .rt-filter{position:fixed;inset:0;z-index:50}   /* 하단 상담 바(40) 위, 상세 시트(60) 아래 */
  .rt-filter-back{display:block;position:absolute;inset:0;background:rgba(20,26,33,.45)}
  .rt-filter-inner{position:absolute;left:0;right:0;bottom:0;max-height:82vh;overflow-y:auto;
    overscroll-behavior:contain;border-radius:18px 18px 0 0;
    padding:14px 18px calc(16px + env(safe-area-inset-bottom));box-shadow:0 -8px 28px rgba(29,43,57,.18)}
  .rt-filter-head{display:flex}
  .rt-fx-foot{position:sticky;bottom:0;background:#fff;margin-top:4px}
}
@media (min-width:600px) and (max-width:899px){
  /* 태블릿 세로 — 종류 타일 7칸이 그대로 한 줄에 들어가되 폭이 좁으므로 간격·글자를 줄인다 */
  .rt-cat-grid, .rt-cat-grid.open{gap:8px}
  .rt-cat-l{font-size:12px}
  /* 시트가 화면 전폭으로 늘어지면 칩이 흩어져 읽기 나쁘다. 가운데로 모은다 */
  .rt-filter-inner{left:50%;right:auto;transform:translateX(-50%);width:min(600px,100%);
    border-radius:18px 18px 0 0;padding:16px 22px calc(18px + env(safe-area-inset-bottom))}
  .rt-fx-chip{min-height:42px}
}
/* 직접 입력 구간은 PC 표에서만 쓴다 — 모바일 시트에는 넣을 자리가 없다 */
.rt-fx-range{display:none}

@media (min-width:900px){
  /* PC 필터는 '상세검색' 표다 — 줄마다 [축 이름 | 값]이고, 값은 즉시 반영된다.
     모바일·태블릿(≤899)의 바텀시트 규칙은 위 블록 그대로 둔다. */
  .rt-filter{margin:0 0 20px}
  .rt-filter-inner{border:0;border-top:2px solid var(--rt-ink);border-bottom:1px solid var(--rt-line);
    border-radius:0;padding:0;background:#fff}

  .rt-filter-head{display:flex;margin:0;padding:15px 20px;border-bottom:1px solid var(--rt-line)}
  .rt-filter-head b{font-size:15px}
  .rt-fh-pc{display:block}
  .rt-fh-mo{display:none}
  .rt-filter-headtools{display:flex;align-items:center}
  .rt-fx-reset-top{display:inline-flex;align-items:center;gap:6px;border:0;background:none;
    min-height:36px;padding:0 16px 0 0;font-size:13px;font-weight:700;color:var(--rt-sub)}
  .rt-fx-reset-top:hover{color:var(--rt-ink)}
  .rt-filter-close{display:inline-flex;align-items:center;gap:7px;min-width:0;min-height:36px;
    padding:0 0 0 16px;border-left:1px solid var(--rt-line);font-size:13px;font-weight:700;color:var(--rt-sub)}
  .rt-filter-close:hover{color:var(--rt-ink)}
  .rt-filter-close .x{display:none}
  .rt-filter-close .t{display:inline}

  .rt-fx{display:grid;grid-template-columns:150px minmax(0,1fr);margin:0}
  .rt-fx + .rt-fx{border-top:1px solid var(--rt-line)}
  .rt-fx-name{display:flex;align-items:center;margin:0;padding:14px 20px;background:#fafbfc;
    font-size:13.5px;font-weight:800;color:var(--rt-ink)}
  .rt-fx-chips{align-items:center;padding:10px 20px;gap:2px 8px}
  .rt-fx-chip{min-height:34px;padding:6px 11px;border:1px solid transparent;border-radius:7px;
    background:transparent;font-size:13.5px;font-weight:600;color:var(--rt-sub)}
  .rt-fx-chip:hover{background:#f2f4f6;color:var(--rt-ink)}
  .rt-fx-chip.on{border-color:var(--rt-accent);background:#eef4ff;color:var(--rt-accent-d);font-weight:800}

  /* 구간 칩으로 안 맞는 사람을 위한 직접 입력. 칩과 같은 축이라 하나를 쓰면 다른 쪽은 풀린다 */
  .rt-fx-range{display:inline-flex;align-items:center;gap:7px;margin-left:14px;padding-left:18px;
    border-left:1px solid var(--rt-line)}
  .rt-fx-range .l{font-size:13px;font-weight:700;color:var(--rt-sub);margin-right:2px}
  .rt-fx-range .u,.rt-fx-range .t{font-size:12.5px;color:var(--rt-sub)}
  .rt-fx-num{width:112px;min-height:36px;border:1px solid var(--rt-line);border-radius:7px;
    padding:0 10px;font-size:13.5px;font-weight:700;text-align:right;color:var(--rt-ink);background:#fff}
  .rt-fx-num:focus-visible{outline:3px solid #ffb300;outline-offset:1px}
  .rt-fx-num-ok{min-height:36px;padding:0 17px;border:0;border-radius:7px;
    background:var(--rt-ink);color:#fff;font-size:13px;font-weight:800}

  /* 즉시 반영이라 [N개 보기]로 닫을 일이 없다 — 닫기는 머리의 CLOSE 가 한다 */
  .rt-fx-foot{display:none}
}

/* ── 상세 v10 (2026-08-28): 기본 요금·할인 분해·조건 비교표·안내 ── */
.rt-promos{margin-top:13px;padding-top:12px;border-top:1px dashed var(--rt-line)}
.rt-promos-t{font-size:12.5px;font-weight:800;color:var(--rt-ink);margin-bottom:4px}
.rt-promos .row{display:flex;justify-content:space-between;gap:10px;padding:5px 0;font-size:12.5px;line-height:1.45}
.rt-promos .row .l{color:var(--rt-sub);font-weight:700}
.rt-promos .row .l small{font-weight:600;color:var(--rt-sub)}
.rt-promos .row .l .need{color:var(--rt-down)}
.rt-promos .row .v{font-weight:800;color:var(--rt-accent-d);white-space:nowrap}
.rt-promos .row .v small{font-weight:600;color:var(--rt-sub)}
.rt-promos .note{margin:8px 0 0;padding:0;border:0;font-size:11.5px;line-height:1.5;color:var(--rt-sub)}
/* 가격박스 안의 할인 목록 — 목록 카드 배지(위쪽 .rt-promos 칩 규칙)와 클래스가 겹쳐 칩으로 뭉개지던 것을 줄 형태로 되돌린다(2026-09-01) */
.rt-pricebox .rt-promos{display:block;gap:0}
.rt-pricebox .rt-promos span{font-size:inherit;font-weight:inherit;color:inherit;background:none;border-radius:0;padding:0}
.rt-cmp-wrap{overflow-x:auto}
.rt-cmp{width:100%;border-collapse:collapse;font-size:12.5px}
.rt-cmp th{font-weight:700;color:var(--rt-sub);text-align:left;padding:6px 4px;border-bottom:1px solid var(--rt-line);font-size:11.5px;white-space:nowrap}
.rt-cmp td{padding:8px 4px;border-bottom:1px dashed var(--rt-line);vertical-align:top;line-height:1.4}
.rt-cmp th.num,.rt-cmp td.num{text-align:right;white-space:nowrap}
.rt-cmp td.num{font-weight:700}
.rt-cmp td:nth-child(2){min-width:96px}
.rt-cmp tr[role="button"]{cursor:pointer}
.rt-cmp tr[role="button"]:hover td{background:#f7faff}
.rt-cmp tr.on td{background:#eef6ff;font-weight:800}
.rt-cmp .has{display:inline-block;margin-left:4px;padding:1px 5px;border-radius:5px;background:#fff4d6;color:#745300;font-size:10.5px;font-weight:800;vertical-align:middle}
.rt-help{margin-top:12px;padding-top:10px;border-top:1px solid var(--rt-line)}
.rt-help-t{margin:0 0 4px;font-size:12.5px;font-weight:800}
.rt-help dl{margin:0}
.rt-help dt{margin-top:8px;font-size:12px;font-weight:800}
.rt-help dd{margin:2px 0 0;font-size:12px;line-height:1.55;color:var(--rt-sub)}
.rt-pbadge{display:inline-block;margin-top:6px;padding:3px 6px;border-radius:5px;background:#eef6ff;color:var(--rt-accent-d);font-size:10.5px;font-weight:800}
/* ── 검색 중 브랜드 줄 숨김 · 브랜드 칩 접기 (2026-08-28) ── */
.rt-q-on .rt-brand-chips{display:none}
.rt-chip.more{background:#f2f5f9;color:var(--rt-accent-d);border-style:dashed}
@media (max-width:899px){ .rt-chip.more{display:none} }
@media (min-width:900px){
  .rt-chips{flex-wrap:wrap;overflow:visible;margin:0 0 8px;padding:0}
  .rt-chips.many:not(.open) .rt-chip.bf:not(.more):nth-child(n+17){display:none}
}


.rt-detail-html{position:relative;z-index:0;overflow:hidden}
.rt-detail-html img,.rt-detail-html video{max-width:100%;height:auto;display:block}
.rt-detail-html table{max-width:100%;display:block;overflow-x:auto}

/* ── 사이트 공용 CSS 충돌 보정 (2026-08-25 이식) ──
   common.css 가 input[type=checkbox|radio]{display:none} 을 전역으로 건다(사이트는
   input+label:before 스프라이트 패턴을 쓴다). 렌탈 화면은 네이티브 체크박스를 쓰므로
   이 영역에서만 되살린다. 안 되살리면 [필수] 동의 체크박스가 보이지 않아 접수 자체가 막힌다. */
#rtMain input[type=checkbox],
#rtMain input[type=radio],
#rtConsentPop input[type=checkbox]{
  display:inline-block!important;
  -webkit-appearance:auto;appearance:auto;
  width:18px;height:18px;margin:0 8px 0 0;flex:0 0 auto;
  accent-color:var(--rt-accent);vertical-align:middle}
/* ── 상단 이미지 배너 (알뜰폰 허브 히어로 배너와 같은 규격) ──
   슬라이드에 고정 높이를 주지 않고 권장 규격의 비율을 그대로 박스에 준다.
   PC 16:5(권장 1920×600) · 모바일 4:3(권장 1080×810). 이 값은 관리자 [배너] 탭의
   권장 규격 문구와 한 쌍이라 한쪽만 바꾸면 어긋난다.
   object-fit:cover 는 규격을 벗어난 이미지가 올라왔을 때의 안전망이다. */
.rt-hb{position:relative;margin:12px 0 10px}
.rt-hb-track{display:flex;flex-wrap:nowrap;gap:0;overflow-x:auto;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;border-radius:var(--rt-radius)}
.rt-hb-track::-webkit-scrollbar{display:none}
.rt-hb-track:focus-visible{outline:3px solid #ffb300;outline-offset:2px}
.rt-hb-slide{flex:0 0 100%;width:100%;scroll-snap-align:center;display:block;
  aspect-ratio:4 / 3;overflow:hidden;background:#f2f4f6}
.rt-hb-slide picture{display:block;width:100%;height:100%}
.rt-hb-pic{width:100%;height:100%;object-fit:cover;display:block}
.rt-hb-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:36px;height:36px;border-radius:50%;border:1px solid var(--rt-line);
  background:rgba(255,255,255,.92);color:var(--rt-ink);font-size:20px;line-height:1;
  display:none;align-items:center;justify-content:center;padding:0}
.rt-hb-nav[hidden]{display:none}
.rt-hb-nav.prev{left:8px}
.rt-hb-nav.next{right:8px}
.rt-hb-dots{display:flex;justify-content:center;align-items:center;gap:0;margin-top:8px}
.rt-hb-dots[hidden]{display:none}
/* 투명 테두리로 히트영역만 넓힌다 — 보이는 점은 8px, 누르는 범위는 손가락에 맞게 24px */
.rt-hb-dot{width:24px;height:24px;padding:0;border:8px solid transparent;background-clip:padding-box;
  border-radius:999px;background-color:#cfd6dd}
/* 활성 표시는 색이 아니라 폭 — 색만으로 구분하면 저대비·색각 환경에서 안 보인다 */
.rt-hb-dot[aria-current="true"]{width:34px;background-color:var(--rt-accent)}
@media (min-width:900px){
  .rt-hb-slide{aspect-ratio:16 / 5}
  .rt-hb-nav{display:flex}
  .rt-hb-nav[hidden]{display:none}
}

/* ── 자립형 셸 (2026-08-25) ──
   사이트 PC 헤더·푸터·공용 CSS 를 쓰지 않는다(알뜰폰 허브와 같은 방식).
   상단바(rt-top)가 이 페이지의 헤더이고, 왼쪽 슬롯은 목록에서 로고, 상세에서 뒤로 버튼이다. */
/* ── dnbn 공식 푸터 ──
   본사이트(app/Views/pc/layout.php)의 푸터 마크업을 그대로 쓰고, 스타일만 여기로 옮겼다.
   알뜰폰 허브(MVNO/hub/assets/style.css)에서 이식했다 — 공용 CSS 를 링크하지 않는 자립형이라
   값을 복사해 둔다. 본사이트 푸터가 바뀌면 여기도 같이 고칠 것.
   .wrap 폭은 렌탈 본문(.rt-wrap)과 같은 열에 정렬되도록 맞춘다. */
.footer .wrap{max-width:1060px;margin:0 auto;padding:0 16px}
.footer { background-color:#F3F4F6; border-top:1px solid #D1D5DB; padding:3rem 0 4.8125rem; }
.footer .wrap .qlink-social { display:flex; align-items:center; justify-content:space-between; }
.footer .wrap .qlink-social .logo img { display:block; width:83px; height:24px; }
.footer .wrap .qlink-social .sns { display:flex; align-items:center; }
.footer .wrap .qlink-social .sns a { display:flex; align-items:center; justify-content:center; font-size:0; line-height:0; text-indent:-9999px; overflow:hidden; width:1.5rem; height:1.5rem; background:no-repeat center center; }
.footer .wrap .qlink-social .sns a + a { margin-left:0.75rem; }
.footer .wrap .qlink-social .sns a.f-insta { background-image:url('/public/pc/assets/images/common/f-social-insta.svg'); }
.footer .wrap .qlink-social .sns a.f-youtube { background-image:url('/public/pc/assets/images/common/f-social-youtube.svg'); }
.footer .wrap .qlink-social .sns a.f-face { background-image:url('/public/pc/assets/images/common/f-social-facebook.svg'); }
.footer .wrap .qlink-social .sns a.f-blog { background-image:url('/public/pc/assets/images/common/f-social-blog.svg'); }
.footer .wrap .b-footer { margin-top:1.5rem; display:flex; justify-content:space-between; }
/* 본사이트 PC 마크업의 .l-ft(좌측 열) — 우측 r-ft가 주석 처리된 상태라 폭을 다 쓰게 둔다(모바일 전폭 버튼도 이게 있어야 산다) */
.footer .wrap .b-footer .l-ft { flex:1 1 auto; min-width:0; }
.footer .wrap .b-footer .cscenter { display:flex; align-items:center; }
.footer .wrap .b-footer .cscenter > a { display:flex; align-items:center; justify-content:center; border:1px solid rgba(209,213,219,1); border-radius:0.25rem; width:7rem; height:3rem; color:rgba(3,7,18,1); font-size:1rem; font-weight:600; text-decoration:none; }
.footer .wrap .b-footer .cscenter > a:after { content:''; background:url('/public/pc/assets/images/common/footer-btn-arrow.svg') no-repeat; display:inline-block; width:1rem; height:1rem; margin-left:0.5rem; }
.footer .wrap .b-footer .cscenter > div { margin-left:1.5rem; }
.footer .wrap .b-footer .cscenter > div h4 { font-size:1.125rem; font-weight:700; color:rgba(3,7,18,1); }
.footer .wrap .b-footer .cscenter > div p { font-size:0.875rem; color:rgba(3,7,18,1); margin-top:0.3125rem; }
.footer .wrap .b-footer .quick { margin-top:1.5rem; }
.footer .wrap .b-footer .quick > ul { display:flex; list-style:none; margin:0; padding:0; }
.footer .wrap .b-footer .quick > ul > li { position:relative; }
.footer .wrap .b-footer .quick > ul > li + li { margin-left:0.5rem; padding-left:0.5rem; }
.footer .wrap .b-footer .quick > ul > li + li:before { content:''; background-color:rgba(3,7,18,1); position:absolute; left:0; top:50%; transform:translateY(-50%); width:1px; height:0.75rem; }
.footer .wrap .b-footer .quick > ul > li > a { color:rgba(3,7,18,1); font-size:0.875rem; text-decoration:underline; text-underline-offset:2px; }
.footer .wrap .b-footer .conts { margin-top:1.5rem; }
.footer .wrap .b-footer .conts p { margin:0; }
.footer .wrap .b-footer .conts p > span { font-size:0.875rem; color:rgba(107,114,128,1); font-style:normal; }
.footer .wrap .b-footer .conts p > span em { font-style:normal; font-weight:400; }
.footer .wrap .b-footer .conts p > span + span { margin-left:0.5rem; padding-left:0.5rem; position:relative; }
.footer .wrap .b-footer .conts p > span + span:before { content:''; background-color:rgba(107,114,128,1); width:1px; height:0.75rem; position:absolute; left:0; top:50%; transform:translateY(-50%); }
.footer .wrap .b-footer .conts span.name { font-size:0.875rem; font-weight:700; color:rgba(107,114,128,1); }
.footer .wrap .b-footer .conts p > span.underline { text-decoration:underline; text-underline-offset:2px; }
.footer .wrap .b-footer .copyright { margin-top:1.5rem; }
.footer .wrap .b-footer .copyright .t1 { font-size:0.875rem; color:rgba(107,114,128,1); }
.footer .wrap .b-footer .copyright .t2 { font-size:0.75rem; color:rgba(107,114,128,1); margin-top:0.25rem; }
/* 모바일 — 본사이트 모바일 푸터와 동일: 아이콘 1.25rem, 고객지원 버튼 전폭(연락처 아래), 주소·통신판매번호 줄바꿈(.noline) */
@media (max-width:640px){
  .footer { padding:1.5rem 0; }
  .footer .wrap .qlink-social .sns a { width:1.25rem; height:1.25rem; background-size:1.25rem 1.25rem; }
  .footer .wrap .b-footer { margin-top:0; } /* 모바일은 .cscenter 쪽 margin-top으로 간격을 준다(본사이트 동일) */
  .footer .wrap .b-footer .cscenter { display:flex; flex-direction:column-reverse; align-items:stretch; margin-top:1.5rem; }
  .footer .wrap .b-footer .cscenter > a { width:100%; margin-top:1.5rem; }
  .footer .wrap .b-footer .cscenter > a:after { flex:none; }
  .footer .wrap .b-footer .cscenter > div { margin-left:0; }
  .footer .wrap .b-footer .quick > ul { flex-wrap:wrap; }
  .footer .wrap .b-footer .conts p > span { position:relative; display:inline-block; }
  .footer .wrap .b-footer .conts p > span.noline { width:100%; display:block; padding-left:0; margin-left:0; }
  .footer .wrap .b-footer .conts p > span.noline:before { display:none; }
}

/* 검색 대기 표시 — 결과가 늦게 바뀌는 동안 "멈춘 것"으로 보이지 않게 한다.
   자리를 차지하지 않는 오버레이다(요소가 끼어들면 타자 중에 목록이 밀려 화면이 튄다). */
.rt-product-panel{position:relative}
.rt-searching .rt-listhead,
.rt-searching .rt-cards,
.rt-searching .rt-noresult,
.rt-searching .rt-guide,
.rt-searching .rt-more,
.rt-searching .rt-pager{opacity:.3}
/* 상단 고정 배지 — 결과 목록은 화면 아래에 있어 그 안에 두면 정작 안 보인다.
   fixed 라 어떤 요소도 밀지 않는다(타자 중 화면 튐 방지). */
.rt-searching-note{position:fixed;left:0;right:0;top:66px;z-index:20;pointer-events:none;
  display:flex;justify-content:center}
.rt-busy-pill{display:inline-flex;align-items:center;gap:8px;
  background:rgba(255,255,255,.96);border:1px solid var(--rt-line);border-radius:999px;
  padding:8px 16px;box-shadow:0 4px 14px rgba(17,24,39,.10);
  font-size:13px;font-weight:700;color:var(--rt-sub)}
.rt-spin{width:16px;height:16px;border-radius:50%;border:2px solid var(--rt-line);
  border-top-color:var(--rt-accent);animation:rt-spin .7s linear infinite}
@keyframes rt-spin{to{transform:rotate(360deg)}}
/* 움직임을 줄이는 환경에서는 회전 대신 색으로만 표시한다(전역 규칙이 animation 을 끈다) */
@media (prefers-reduced-motion:reduce){
  .rt-spin{border-color:var(--rt-accent);opacity:.55}
}

/* PC(900 이상) 제품 종류 격자 — 8열. 접힘 = 7종 + [전체보기] 가 한 줄에 딱 맞고,
   펼침 = 14종 + [접기] 로 둘째 줄 일곱 번째 칸(에어컨 아래)에 놓인다.
   토글 타일은 늘리지 않는다 — 남는 칸을 채우려고 넓히면 칸과 칸 사이에 떠 보인다(사용자 확인).
   타일이 토글을 겸하므로 헤더의 텍스트 토글은 모바일과 같이 감춘다. */
@media (min-width:900px){
  .rt-cat-grid, .rt-cat-grid.open{grid-template-columns:repeat(8,minmax(0,1fr))}
  .rt-cat-more{display:block}
  .rt-cats-toggle{display:none}
}

/* 제품 종류 격자의 마지막 칸(전체보기/접기) — .rt-cat 은 <a> 기준이라 버튼 기본값을 지운다 */
.rt-cat-toggle{border:0;background:none;font-family:inherit;cursor:pointer;width:100%}
.rt-cat-toggle .rt-cat-ic{background:#eef4ff;color:var(--rt-accent-d)}
.rt-cat-toggle:hover .rt-cat-ic{border-color:var(--rt-accent)}
/* 격자의 다른 타일과 달리 버튼이라 브라우저 기본 링이 붙는다 — 화면의 다른 포커스 표시와 맞춘다 */
.rt-cat-toggle:focus-visible{outline:3px solid #ffb300;outline-offset:2px;border-radius:12px}

.rt-home{display:inline-flex;align-items:center;flex:0 0 auto;padding:4px 2px}
.rt-home img{display:block;height:22px;width:auto}
.rt-home[hidden]{display:none}

.rt-foot{border-top:1px solid var(--rt-line);background:#fff;margin-top:32px;padding:22px 0 34px}
.rt-foot .mid{font-size:12px;line-height:1.7;color:var(--rt-sub)}
.rt-foot-links{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:14px}
.rt-foot-links a{font-size:12.5px;font-weight:700;color:var(--rt-ink);text-decoration:none}
.rt-foot-links a:hover{text-decoration:underline}
.rt-foot-co{margin-top:14px;font-size:11.5px;line-height:1.9;color:var(--rt-sub)}
.rt-foot-co b{display:block;font-size:12.5px;color:var(--rt-ink);margin-bottom:2px}
.rt-foot-co span{display:inline-block;margin-right:12px;word-break:keep-all}
.rt-foot-copy{margin-top:10px;font-size:11px;color:#98a2ad}

/* 조건 카드의 '옵션(색상)' 값 — 고를 게 하나뿐이라 선택 카드가 아니라 값 칩으로 보여준다.
   (기간·관리 카드용 .rt-opt 를 재사용하면 72px 빈 상자가 된다) */
.rt-optval{display:inline-block;background:#f2f4f6;border-radius:999px;
  padding:6px 12px;font-size:12.5px;font-weight:700;color:var(--rt-ink);
  max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}