@charset "utf-8";
/* ============================================================
 * reservation_v2.css — 사전예약(reservation.do) 전체 리디자인 v2.0 / 2026-07-21 창B
 *
 * [왜 새 파일인가]
 *  기존 reservation_draft.css(v1.0~v1.10, 468줄)는 사전예약 + 산지직송이 공유하며
 *  기능 추가마다 레이어(v1.2 PC 2열 가로카드 → v1.3 안내패널 → v1.4/1.5 테마 달력판 →
 *  v1.8 접기 → v1.10 달력 nowrap 긴급패치)가 덧쌓여 서로 덮어쓰는 상태였다.
 *  사전예약만 새 스코프(.rvz)로 분리해 한 겹으로 다시 쓰고, 기존 파일은 산지직송 전용으로
 *  그대로 남긴다(= 산지직송 무영향 보장. 공유 CSS 수정으로 인한 회귀 원천 차단).
 *
 * [디자인 언어] 프로젝트 표준 준수
 *  · 딥그린 #3D6041 / 세리프 히어로 / 이모지 0 / 인라인 스타일 0
 *  · 본문 14px 하한(시니어 가독), 터치 타깃 44px 이상
 *  · 여백 4/6/10/14 스케일, radius 12~16, 옅은 그림자
 *  · 카드 내부 칩·메타는 dure_card.css(.dcz) 공용 문법과 조화(중복 정의 금지)
 *
 * [정보 위계] "지금 주문하면 언제 받는다"가 화면 최상단 축
 *  ① 히어로 → ② 예약판(달력 + 예약→마감→배송 3단계 실날짜) → ③ 필터바(테마칩+검색)
 *  → ④ 테마 그룹(헤더에 받는날/마감 D-day) → ⑤ 카드(받는날 1줄 + 예약하기)
 *
 * PC(≥1025) 4열 / 태블릿(769~1024) 3열 / 모바일(≤768) 2열
 *
 * [v2.7 / 2026-07-24] PC 사전예약 정리 — 파일 하단 @media(min-width:769px) 블록:
 *   · 달력 제거(모바일 정리와 동일 취지). 예약판 = 예약→마감→받는날 3단계 가로 타임라인만.
 *   · 검색창 = 라운드 pill + 인디고(#4a4a7d) 포커스. 테마칩 = 인디고 채움 pill + 가로 스크롤 레일.
 *   · 모바일(≤768)은 base 규칙 그대로 유지 = 무영향.
 * ============================================================ */

.rvz{
	--green:#3d6041;
	--green-d:#2f5233;
	--green-l:#eef4ea;
	--green-b:#cfe0d2;
	--ink:#1d271e;
	--sub:#4f554b;
	--mute:#6c7268;
	--sale:#d8352a;
	--warn:#c56a00;
	--line:#e8e6dc;
	--wash:#f6faf4;
	background:#fff;
	color:var(--ink);
	padding-bottom:56px;
	font-family:"Pretendard","Apple SD Gothic Neo","Malgun Gothic",sans-serif;
	-webkit-text-size-adjust:100%;
}
.rvz *{ box-sizing:border-box; }
.rvz .serif{ font-family:"Noto Serif KR","Maru Buri","Nanum Myeongjo",serif; }
.rvz .roboto{ font-family:"Roboto","Pretendard",sans-serif; }

/* ===== ① 히어로 ===== */
/* 2026-07-23 사전예약 제목띠 컬러헤더(딥 인디고) — 더큰혜택·신규·두레추천 GNB와 동일 톤(딥 그라데이션+흰글자+골드 em) */
.rvz .rvz_hero{ text-align:center; padding:40px 20px 26px; background:linear-gradient(160deg,#4a4a7d,#2e2b54); }
.rvz .rvz_eb{ margin:0; font-size:14px; font-weight:800; letter-spacing:.16em; color:rgba(255,255,255,.74); }
.rvz .rvz_h{ margin:10px 0 0; font-family:"Noto Serif KR","Maru Buri",serif; font-size:34px; font-weight:600; line-height:1.24; letter-spacing:-.01em; color:#fff; }
.rvz .rvz_h em{ font-style:normal; color:#f8d78a; }
.rvz .rvz_lead{ margin:10px 0 0; font-size:15.5px; line-height:1.6; color:rgba(255,255,255,.86); word-break:keep-all; }
/* 상단 헤더바(.head_def .head_top)도 제목띠 인디고로 통일. :has 미지원 웹뷰 대비 html.rvzpg(JSP)·html.thm-reservation(데코레이터) 병행 */
/* 2026-07-25: 160deg→180deg(수직) — 최상단 픽셀행을 시작색(#4a4a7d)으로 균일화해 theme-color 메타·사파리 주소창과 정합(기존 우측 상단이 #363460 로 어긋남). */
html.rvzpg .head_def .head_top,
html.thm-reservation .head_def .head_top,
body:has(.rvz) .head_def .head_top{ background:linear-gradient(180deg,#4a4a7d,#2e2b54); }
/* 2026-07-25 [앱 웹뷰 상태바 배경] viewport-fit=cover(테마페이지 한정) 하에서 상단띠를 세이프에어리어만큼 늘려 테마색으로 칠함. 비커버·미지원 웹뷰=inset 0(무해). 사전예약 헤더 기본 상단패딩=19px(style_v2). */
html.rvzpg .head_def .head_top,
html.thm-reservation .head_def .head_top{
	padding-top:calc(19px + constant(safe-area-inset-top));
	padding-top:calc(19px + env(safe-area-inset-top));
}
html.rvzpg .main_area,
html.thm-reservation .main_area{
	padding-top:calc(99px + constant(safe-area-inset-top));
	padding-top:calc(99px + env(safe-area-inset-top));
}
/* PC 상단 로고바(.header_wrap .head_visual)도 동일 인디고 (2026-07-23) */
html.rvzpg .header_wrap .head_visual,
body:has(.rvz) .header_wrap .head_visual{ background:linear-gradient(160deg,#4a4a7d,#2e2b54); }

.rvz .rvz_wrap{ max-width:1200px; margin:0 auto; padding:26px 20px 0; }

/* ===== 탭(사전예약 / 산지직송) ===== */
.rvz .rvz_tab{ display:flex; gap:6px; list-style:none; margin:0 0 20px; padding:0; border-bottom:1px solid #ecebe3; }
.rvz .rvz_tab li{ margin:0; }
.rvz .rvz_tab a{ position:relative; display:inline-block; padding:6px 4px 14px; font-size:16px; font-weight:700; color:#9aa09b; text-decoration:none; }
.rvz .rvz_tab li.on a{ color:var(--ink); font-weight:800; }
.rvz .rvz_tab li.on a::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:2.5px; border-radius:2px; background:var(--green); }

/* ============================================================
 * ② 예약판(rvz_plan) — 이 화면의 심장.
 *   좌: 달력(받는 날 클릭 = 필터) / 우: 예약 → 마감 → 배송 3단계 실날짜
 *   기존 "테마마다 미니 달력 반복"을 이 하나로 통합(중복 제거).
 * ============================================================ */
.rvz .rvz_plan{ margin:0 0 20px; border:1px solid var(--green-b); border-radius:16px; background:#fff; box-shadow:0 1px 4px rgba(29,39,30,.05); overflow:hidden; }
.rvz .rvz_plan:empty{ display:none; }
.rvz .rvz_plan_in{ display:grid; grid-template-columns:minmax(0,340px) 1fr; }

/* --- 달력 --- */
.rvz .rvz_cal{ padding:18px 20px 20px; }
.rvz .rvz_cal_top{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 0 10px; }
.rvz .rvz_cal_t{ font-family:"Noto Serif KR","Maru Buri",serif; font-size:19px; font-weight:700; color:var(--green); letter-spacing:-.01em; }
.rvz .rvz_nav{ display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; padding:0; border:1.5px solid #d7ddd2; border-radius:12px; background:#fff; color:var(--green); font-size:15px; line-height:1; cursor:pointer; transition:background .12s, border-color .12s; }
.rvz .rvz_nav:hover{ background:var(--green-l); border-color:#9dc4a5; }
.rvz .rvz_nav.off{ color:#c8cec2; border-color:#eceae1; background:#fafaf7; cursor:default; }
.rvz .rvz_cal_g{ display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
.rvz .rvz_wd{ padding:4px 0 6px; text-align:center; font-size:14px; font-weight:700; color:#8a9086; }
.rvz .rvz_wd.sun{ color:#cf6b5f; }
.rvz .rvz_wd.sat{ color:#5a7fae; }
.rvz .rvz_c{ position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; min-height:46px; padding:4px 2px; border:1.5px solid transparent; border-radius:10px; background:#fafaf7; }
.rvz .rvz_c.empty{ background:transparent; }
.rvz .rvz_d{ font-family:"Roboto","Pretendard",sans-serif; font-size:15px; font-weight:700; line-height:1.1; color:#4f554b; }
.rvz .rvz_c.sun .rvz_d{ color:#cf6b5f; }
.rvz .rvz_c.sat .rvz_d{ color:#5a7fae; }
.rvz .rvz_c.today{ box-shadow:0 0 0 2px var(--green) inset; }
/* 마감일 = 주황 라벨 */
.rvz .rvz_c.close{ background:#fdf2e4; border-color:#f2ddbf; }
.rvz .rvz_flag{ font-size:11px; font-weight:800; line-height:1.3; color:var(--warn); }
/* 배송일 = 딥그린, 클릭 가능 */
.rvz .rvz_c.deliv{ background:var(--green-l); border-color:var(--green-b); cursor:pointer; }
.rvz .rvz_c.deliv:hover{ background:var(--green); border-color:var(--green); }
.rvz .rvz_c.deliv:hover .rvz_d,
.rvz .rvz_c.deliv:hover .rvz_flag{ color:#fff; }
.rvz .rvz_c.deliv.on{ background:var(--green); border-color:var(--green); }
.rvz .rvz_c.deliv.on .rvz_d,
.rvz .rvz_c.deliv.on .rvz_flag{ color:#fff; }
.rvz .rvz_cal_help{ margin:10px 0 0; font-size:14px; line-height:1.5; color:var(--mute); word-break:keep-all; }

/* --- 우측: 예약 흐름 3단계 --- */
.rvz .rvz_side{ display:flex; flex-direction:column; justify-content:center; padding:18px 22px 20px; background:var(--wash); border-left:1px solid #e2eede; }
.rvz .rvz_side_ttl{ margin:0 0 14px; font-family:"Noto Serif KR","Maru Buri",serif; font-size:20px; font-weight:800; color:var(--ink); letter-spacing:-.01em; }
.rvz .rvz_flow{ list-style:none; margin:0; padding:0; }
.rvz .rvz_step{ position:relative; display:flex; align-items:flex-start; gap:10px; padding:0 0 14px; }
.rvz .rvz_step:last-child{ padding-bottom:0; }
.rvz .rvz_step::before{ content:""; position:absolute; left:13px; top:28px; bottom:0; width:2px; background:var(--green-b); }
.rvz .rvz_step:last-child::before{ display:none; }
.rvz .rvz_num{ position:relative; z-index:1; flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:50%; background:var(--green); color:#fff; font-family:"Roboto","Pretendard",sans-serif; font-size:14px; font-weight:800; }
.rvz .rvz_step.wait .rvz_num{ background:#fff; color:var(--green); border:1.5px solid var(--green-b); }
.rvz .rvz_stxt{ padding-top:2px; min-width:0; }
.rvz .rvz_slbl{ display:block; font-size:14px; font-weight:700; color:var(--mute); }
.rvz .rvz_sval{ display:block; margin-top:2px; font-family:"Noto Serif KR","Maru Buri",serif; font-size:19px; font-weight:800; line-height:1.35; color:var(--ink); word-break:keep-all; }
.rvz .rvz_step.deliv .rvz_sval{ color:var(--green-d); }
/* 색 범례는 두지 않는다 — 달력 셀이 "배송"·"마감" 글자를 직접 달고 있어 범례가 중복(2026-07-21 덜어냄) */

/* D-day 배지(예약판·그룹헤더·카드 공용) */
.rvz .rvz_dday{ display:inline-flex; align-items:center; margin-left:6px; padding:3px 9px; border-radius:8px; background:var(--green); color:#fff; font-family:"Roboto","Pretendard",sans-serif; font-size:13px; font-weight:800; white-space:nowrap; vertical-align:middle; }
.rvz .rvz_dday.soon{ background:#e0821a; }
.rvz .rvz_dday.urgent{ background:var(--sale); }

/* ============================================================
 * ③ 필터바(rvz_bar) — 테마 칩 + 검색을 한 줄로 통합해 상단 고정.
 *   기존: 검색창 / 달력 / 칩 / 더보기버튼이 각각 따로 쌓여 있던 것을 하나로.
 * ============================================================ */
.rvz .rvz_bar{ position:sticky; top:0; z-index:20; display:flex; align-items:center; gap:10px; margin:0 0 14px; padding:10px 0; background:#fff; box-shadow:0 8px 14px -12px rgba(29,39,30,.3); }
.rvz .rvz_chips{ display:flex; flex-wrap:wrap; gap:6px; min-width:0; flex:1 1 auto; margin:0; padding:0; list-style:none; }
.rvz .rvz_chip{ display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 18px; border:1.5px solid #d7ddd2; border-radius:12px; background:#fff; color:#4f554b; font-size:15px; font-weight:700; line-height:1.2; white-space:nowrap; text-decoration:none; cursor:pointer; transition:background .12s, border-color .12s, color .12s; }
.rvz .rvz_chip:hover{ border-color:#9dc4a5; color:var(--ink); }
.rvz .rvz_chip.on{ background:var(--green); border-color:var(--green); color:#fff; font-weight:800; }
.rvz .rvz_chip .rvz_cn{ margin-left:6px; font-family:"Roboto","Pretendard",sans-serif; font-size:14px; font-weight:700; opacity:.72; }

.rvz .rvz_search{ position:relative; flex:0 0 260px; }
.rvz .rvz_q{ width:100%; height:48px; padding:0 84px 0 42px; border:1.5px solid #d7ddd2; border-radius:12px; background:#fff; color:var(--ink); font-family:inherit; font-size:15px; font-weight:600; }
.rvz .rvz_q::placeholder{ color:#9aa09b; font-weight:500; }
.rvz .rvz_q:focus{ outline:none; border-color:var(--green); box-shadow:0 0 0 3px rgba(61,96,65,.12); }
/* 돋보기(도형 2개, 이미지·이모지 미사용) */
.rvz .rvz_search::before{ content:""; position:absolute; left:15px; top:50%; width:15px; height:15px; margin-top:-10px; border:2px solid #7d8a76; border-radius:50%; pointer-events:none; }
.rvz .rvz_search::after{ content:""; position:absolute; left:26px; top:50%; width:8px; height:2px; margin-top:3px; background:#7d8a76; border-radius:2px; transform:rotate(45deg); transform-origin:left center; pointer-events:none; }
.rvz .rvz_qx{ display:none; position:absolute; right:6px; top:50%; transform:translateY(-50%); padding:8px 12px; border:0; border-radius:10px; background:#eef1ea; color:var(--sub); font-family:inherit; font-size:14px; font-weight:700; cursor:pointer; }
.rvz .rvz_qx.show{ display:inline-block; }

/* 활성 필터 요약(받는 날 선택 시에만 노출) */
.rvz .rvz_state{ display:none; margin:0 0 14px; }
.rvz .rvz_state.show{ display:block; }
.rvz .rvz_pill{ display:inline-flex; align-items:center; gap:10px; max-width:100%; padding:6px 6px 6px 16px; border:1.5px solid var(--green-b); border-radius:999px; background:var(--green-l); }
.rvz .rvz_pill_t{ font-size:15px; font-weight:700; color:var(--green); }
.rvz .rvz_pill_t b{ font-family:"Roboto","Pretendard",sans-serif; font-weight:800; }
.rvz .rvz_pill_x{ display:inline-flex; align-items:center; min-height:36px; padding:6px 14px; border:0; border-radius:999px; background:var(--green); color:#fff; font-family:inherit; font-size:14px; font-weight:700; white-space:nowrap; cursor:pointer; }
.rvz .rvz_pill_x:hover{ background:var(--green-d); }

/* ============================================================
 * ④ 테마 그룹
 * ============================================================ */
.rvz .rvg{ margin:0 0 30px; }
.rvz .rvz_gh{ display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:6px 20px; margin:0 0 14px; padding:0 0 10px; border-bottom:2px solid var(--green); }
.rvz .rvz_gh_l{ min-width:0; }
.rvz .rvz_gname{ display:flex; align-items:baseline; flex-wrap:wrap; gap:8px; margin:0; font-family:"Noto Serif KR","Maru Buri",serif; font-size:22px; font-weight:700; color:var(--green); letter-spacing:-.01em; word-break:keep-all; }
.rvz .rvz_gcnt{ font-family:"Roboto","Pretendard",sans-serif; font-size:14px; font-weight:800; color:var(--mute); }
.rvz .rvz_gphrase{ margin:6px 0 0; font-size:15px; font-weight:600; line-height:1.5; color:var(--sub); word-break:keep-all; }
.rvz .rvz_gh_r{ flex:0 0 auto; text-align:right; }
.rvz .rvz_gwhen{ display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:6px; margin:0; }
.rvz .rvz_gclose{ display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:6px; margin:6px 0 0; }
.rvz .rvz_lbl{ display:inline-block; padding:3px 9px; border-radius:7px; background:var(--green); color:#fff; font-size:13px; font-weight:800; }
.rvz .rvz_lbl_c{ background:var(--warn); }
.rvz .rvz_gwhen b{ font-family:"Noto Serif KR","Maru Buri",serif; font-size:19px; font-weight:800; color:var(--ink); }
.rvz .rvz_gclose b{ font-size:15px; font-weight:700; color:var(--sub); }

/* --- 카드 그리드 --- */
.rvz .rvz_grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px 18px; list-style:none; margin:0; padding:0; }
.rvz .rvz_card{ display:flex; flex-direction:column; position:relative; background:#fff; border:1px solid var(--line); border-radius:15px; overflow:hidden; box-shadow:0 1px 4px rgba(29,39,30,.05); transition:box-shadow .15s, transform .15s; }
.rvz .rvz_card:hover{ box-shadow:0 10px 26px rgba(29,39,30,.11); transform:translateY(-3px); }
.rvz .rvz_card.hide{ display:none; }
.rvz .rvz_card .plink{ display:block; color:inherit; text-decoration:none; }
.rvz .rvz_thumb{ position:relative; aspect-ratio:1/1; overflow:hidden; background:#f4f4f2; }
.rvz .rvz_thumb img{ display:block; width:100%; height:100%; object-fit:cover; }
.rvz .rvz_tag{ position:absolute; top:10px; left:10px; z-index:2; display:flex; flex-wrap:wrap; gap:4px; margin:0; padding:0; list-style:none; }
.rvz .rvz_tag li{ padding:3px 9px; border-radius:8px; background:#f8a31e; color:#3a2408; font-family:"Roboto",sans-serif; font-size:13px; font-weight:800; line-height:1.35; box-shadow:0 1px 3px rgba(0,0,0,.16); }
.rvz .rvz_body{ display:flex; flex-direction:column; flex:1; padding:12px 14px 4px; }
.rvz .rvz_nm{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:44px; margin:0 0 6px; font-size:16px; font-weight:700; line-height:1.34; color:var(--ink); word-break:keep-all; }
/* metatop/specrow/cpill/tpill = dure_card.css(.dcz) 공용 문법. 여기서 재정의하지 않는다. */
.rvz .dcz .metatop .farmer{ font-size:14px; font-weight:600; color:var(--green); }
.rvz .rvz_price{ display:flex; align-items:baseline; flex-wrap:wrap; gap:6px; margin-top:6px; }
.rvz .rvz_price .dc{ font-family:"Roboto",sans-serif; font-size:16px; font-weight:800; color:var(--sale); }
.rvz .rvz_price .now{ font-family:"Roboto","Pretendard",sans-serif; font-size:21px; font-weight:800; color:var(--ink); }
.rvz .rvz_price .won{ margin-left:-3px; font-size:14px; font-weight:800; color:var(--ink); }
.rvz .rvz_price .old{ font-family:"Roboto",sans-serif; font-size:14px; font-weight:500; color:#767c72; text-decoration:line-through; }
/* 카드 받는 날 1줄 — 예약 상품의 본질 정보 */
.rvz .rvz_when{ display:flex; align-items:center; flex-wrap:wrap; gap:4px 6px; margin:8px 0 0; padding-top:8px; border-top:1px dashed #e2eede; font-size:14px; color:var(--sub); }
.rvz .rvz_when i{ font-style:normal; font-weight:700; color:var(--mute); }
.rvz .rvz_when b{ font-family:"Roboto","Pretendard",sans-serif; font-weight:800; color:var(--green-d); }
.rvz .rvz_when .rvz_dday{ margin-left:0; padding:2px 7px; font-size:12.5px; }
/* 2026-07-23 사전예약 버튼 = 상단(제목띠) 인디고와 통일 */
.rvz .rvz_btn{ display:flex; align-items:center; justify-content:center; min-height:46px; margin:10px 14px 14px; border:1.5px solid #2e2b54; border-radius:12px; background:linear-gradient(160deg,#4a4a7d,#2e2b54); color:#fff; font-size:16px; font-weight:800; letter-spacing:.02em; text-decoration:none; cursor:pointer; transition:background .15s, border-color .15s; }
.rvz .rvz_btn:hover,.rvz .rvz_btn:active{ background:#2e2b54; border-color:#232049; color:#fff; }

/* 그룹 더보기 */
.rvz .rvz_more{ display:flex; align-items:center; justify-content:center; width:100%; min-height:46px; margin-top:14px; padding:10px 20px; border:1.5px solid var(--green-b); border-radius:12px; background:var(--green-l); color:var(--green); font-family:inherit; font-size:16px; font-weight:700; cursor:pointer; transition:background .12s, border-color .12s; }
.rvz .rvz_more:hover{ background:#e2ecdc; border-color:#9dc4a5; }

/* 빈 결과 */
.rvz .rvz_empty{ display:none; }
.rvz .rvz_empty.show{ display:block; padding:56px 20px; text-align:center; font-size:16px; font-weight:600; color:var(--mute); word-break:keep-all; }

/* ============================================================
 * 2026-07-24 [모바일 전용] 베스트 예약상품 1~4위 — 히어로 아래.
 *   컨테이너(#id_rvz_best)는 모바일 JSP에만 존재하고 렌더도 ≤768px에서만 → PC 무영향.
 *   현재 ordCnt 데이터 없어 자연 미노출(3차 매퍼 추가 시 자동 활성).
 * ============================================================ */
.rvz .rvz_best_sec{ padding:20px 15px 4px; }
.rvz .rvz_best_ttl{ margin:0 0 12px; font-size:19px; font-weight:800; color:var(--ink); letter-spacing:-.01em; }
.rvz .rvz_best_grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px; list-style:none; margin:0; padding:0; }
.rvz .rvz_best_card{ background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; box-shadow:0 1px 4px rgba(29,39,30,.05); }
.rvz .rvz_best_card .plink{ position:relative; display:flex; align-items:center; gap:10px; padding:10px; color:inherit; text-decoration:none; }
.rvz .rvz_best_rank{ position:absolute; top:8px; left:8px; z-index:2; display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:50%; background:linear-gradient(160deg,#e8b84b,#c9962c); color:#fff; font-family:"Roboto","Pretendard",sans-serif; font-size:14px; font-weight:800; box-shadow:0 1px 4px rgba(0,0,0,.2); }
.rvz .rvz_best_thumb{ flex:0 0 64px; width:64px; height:64px; border-radius:10px; overflow:hidden; background:#f4f4f2; }
.rvz .rvz_best_thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.rvz .rvz_best_info{ flex:1 1 auto; min-width:0; }
.rvz .rvz_best_nm{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:14px; font-weight:700; line-height:1.35; color:var(--ink); word-break:keep-all; }
.rvz .rvz_best_pr{ display:block; margin-top:4px; font-size:14px; color:var(--sub); }
.rvz .rvz_best_pr b{ font-family:"Roboto","Pretendard",sans-serif; font-size:16px; font-weight:800; color:var(--ink); }

/* ============================================================
 * 반응형
 * ============================================================ */
@media (max-width:1024px){
	.rvz .rvz_plan_in{ grid-template-columns:1fr; }
	.rvz .rvz_side{ border-left:0; border-top:1px solid #e2eede; }
	.rvz .rvz_grid{ grid-template-columns:repeat(3,1fr); }
	.rvz .rvz_bar{ flex-wrap:wrap; }
	.rvz .rvz_search{ flex:1 1 100%; order:-1; }
}
@media (max-width:768px){
	.rvz{ padding-bottom:40px; }
	.rvz .rvz_hero{ padding:24px 18px 22px; }
	.rvz .rvz_eb{ font-size:13px; letter-spacing:.14em; }
	.rvz .rvz_h{ font-size:24px; margin-top:8px; }
	.rvz .rvz_lead{ font-size:15px; }
	.rvz .rvz_wrap{ padding:18px 15px 0; }
	.rvz .rvz_tab a{ font-size:15px; }

	/* 2026-07-24 모바일 재구성: 예약판(달력+3단계 흐름)·달력 도움말 숨김. 테마 그룹이 첫 콘텐츠가 되도록. PC는 유지 */
	.rvz .rvz_plan{ display:none; }
	.rvz .rvz_plan{ border-radius:14px; }
	.rvz .rvz_cal{ padding:14px 14px 16px; }
	.rvz .rvz_cal_t{ font-size:18px; }
	.rvz .rvz_nav{ width:44px; height:44px; }
	.rvz .rvz_cal_g{ gap:3px; }
	.rvz .rvz_c{ min-height:44px; border-radius:9px; }
	.rvz .rvz_d{ font-size:14px; }
	.rvz .rvz_side{ padding:16px 16px 18px; }
	.rvz .rvz_side_ttl{ font-size:18px; }
	.rvz .rvz_sval{ font-size:17px; }

	/* 모바일 칩 = 가로 스크롤 1줄(더보기 버튼 제거) */
	.rvz .rvz_bar{ gap:8px; padding:8px 0; }
	.rvz .rvz_chips{ flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; padding-bottom:2px; }
	.rvz .rvz_chips::-webkit-scrollbar{ display:none; }
	.rvz .rvz_chips{ flex:1 1 100%; }
	.rvz .rvz_chip{ flex:0 0 auto; min-height:44px; padding:9px 15px; font-size:15px; }
	.rvz .rvz_search{ flex:1 1 100%; order:0; }
	.rvz .rvz_q{ height:46px; }

	.rvz .rvz_gh{ align-items:flex-start; flex-direction:column; gap:8px; }
	.rvz .rvz_gh_r{ text-align:left; width:100%; }
	.rvz .rvz_gwhen, .rvz .rvz_gclose{ justify-content:flex-start; }
	.rvz .rvz_gname{ font-size:19px; }
	.rvz .rvz_gphrase{ font-size:14px; }
	.rvz .rvz_gwhen b{ font-size:17px; }

	.rvz .rvz_grid{ grid-template-columns:repeat(2,1fr); gap:16px 11px; }
	.rvz .rvz_body{ padding:11px 12px 3px; }
	.rvz .rvz_nm{ font-size:15px; min-height:41px; }
	.rvz .rvz_price .now{ font-size:19px; }
	.rvz .rvz_when{ font-size:14px; }
	.rvz .rvz_btn{ min-height:44px; margin:9px 12px 12px; font-size:15px; }
	.rvz .rvz_more{ min-height:44px; font-size:15px; }
}
@media (max-width:360px){
	.rvz .rvz_grid{ gap:12px 9px; }
	.rvz .rvz_c{ min-height:40px; }
}
@media (prefers-reduced-motion: reduce){
	.rvz .rvz_card, .rvz .rvz_btn, .rvz .rvz_chip, .rvz .rvz_nav{ transition:none; }
	.rvz .rvz_card:hover{ transform:none; }
}

/* 2026-07-24 사전예약: 하단 홈 아이콘 인디고 + 앱 배경(오버스크롤) 인디고 통일 */
html.rvzpg .bottom_menu_wrap .bt_menu_home .icon_wrap img,
body:has(.rvz) .bottom_menu_wrap .bt_menu_home .icon_wrap img{ content:url("../../images/mobile/icon_f_home_indigo.svg"); }
/* 2026-07-24 PC 상단 유틸바 비침 수정: html 인디고 배경(앱 외곽용)은 모바일 한정 */
@media (max-width:1024px){ html.rvzpg, html:has(.rvz), html.thm-reservation{ background:#4a4a7d; } }

/* ============================================================
 * 2026-07-24 [PC 전용 · v2.7] 사전예약 정리 (min-width:769px)
 *   달력 제거(마크업은 comm에서 미생성) 후 예약판 = 3단계 가로 타임라인.
 *   검색 pill·인디고 포커스 / 테마칩 인디고 pill·가로 스크롤 레일.
 *   모바일(≤768)은 이 블록 밖(base) → 무영향. 산지직송(.rvdz)·탭(.rvz_tab) 무접촉.
 * ============================================================ */
@media (min-width:769px){
	/* ② 예약판: 달력 제거 → 단일 컬럼, 3단계를 가로 카드 타임라인으로 */
	.rvz .rvz_plan_in{ grid-template-columns:1fr; }
	.rvz .rvz_side{ border-left:0; padding:16px 22px 18px; }
	.rvz .rvz_side_ttl{ margin:0 0 12px; font-size:18px; }
	.rvz .rvz_flow{ display:flex; flex-wrap:wrap; align-items:stretch; gap:10px 12px; }
	.rvz .rvz_flow .rvz_step{ flex:1 1 170px; align-items:center; gap:10px; padding:11px 16px; background:#fff; border:1px solid var(--green-b); border-radius:12px; }
	.rvz .rvz_flow .rvz_step::before{ display:none; }
	.rvz .rvz_slbl{ font-size:13px; }
	.rvz .rvz_sval{ margin-top:1px; font-size:17px; }

	/* ③ 테마칩 = 인디고 채움 pill + 가로 스크롤 레일(44px 터치 유지) */
	.rvz .rvz_chips{ flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; padding-bottom:2px; }
	.rvz .rvz_chips::-webkit-scrollbar{ display:none; }
	.rvz .rvz_chip{ border-radius:999px; }
	.rvz .rvz_chip:hover{ border-color:#b3b3cd; color:#4a4a7d; }
	.rvz .rvz_chip.on{ background:#4a4a7d; border-color:#4a4a7d; color:#fff; }
	.rvz .rvz_chip.on:hover{ color:#fff; }

	/* ③ 검색 = 라운드 pill + 인디고 포커스(높이 48px = 44px+ 충족) */
	.rvz .rvz_q{ border-radius:999px; }
	.rvz .rvz_q:focus{ border-color:#4a4a7d; box-shadow:0 0 0 3px rgba(74,74,125,.15); }
}