@charset "utf-8";

/* 공지 유무와 관계없이 두 구간 모두 자체 상단 선을 가진다. 공지 하단 선은 중복하지 않는다. */
main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent div.content.notice {margin:0 !important;padding:24px 0;border-top:1px solid var(--tp-line);border-bottom:0}
main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent div.content.notice .content_tit {margin:0 0 12px !important;padding:0;line-height:1.5;font-size:20px;}


/* 상단 상품명 블록 — 샘플 `.hero`: 좌측 상품명·영문명·평점, 우측 `1박 최저가 N원~`.
   grid-area 로 배치해 태그·영문명·평점이 없어도 행이 비어 접힌다(마크업 순서는 B0 공통 그대로). */
.item-head--hotel {display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"tags tags" "title price" "en price" "rate price";column-gap:20px;align-items:start}
.item-head--hotel .item-head__tags {grid-area:tags;margin:0 0 8px;}
.item-head--hotel .item-head__title {grid-area:title;font-size:28px;}
.item-head--hotel .item-head__title-en {grid-area:en;margin-top:4px;color:var(--tp-hotel-muted);font-size:14px}
.item-head--hotel .item-head__rate {grid-area:rate;justify-self:start;margin-top:10px;font-size:13px}
.item-head--hotel .item-head__rate-num {font-size:15px}
.item-head--hotel .item-head__rate-cnt {color:var(--tp-hotel-muted)}
.item-head--hotel .item-head__price {grid-area:price;margin:0;text-align:right;white-space:nowrap;color:var(--tp-hotel-muted);font-size:12px;line-height:1.5}
.item-head--hotel .item-head__price-prefix {display:block;margin:0}
.item-head--hotel .item-head__price-num,.item-head--hotel .item-head__price-unit,.item-head--hotel .item-head__price-suffix {margin:0;color:var(--tp-hotel-ink);font-size:23px;line-height:1.4;}
/* PC: 2단 레이아웃 바깥(갤러리 바로 아래)에 놓일 때만 전체 폭 구분선을 긋고, 본문 첫 섹션의 윗선·레거시 여백을 걷는다.
   모바일은 블록이 본문 안에 남고 아래에 지도 배너가 오므로 기존 선 구조를 쓴다. */
/* 갤러리~해시태그 18px(샘플) — 갤러리 레거시 margin-bottom 25px(`item.css:4`)를 음수 마진으로 상쇄한다 */
div.tourpik.item-detail--hotel > div > .item-head--hotel {margin-top:-25px;padding:18px 0 24px;border-bottom:1px solid var(--tp-line)}
div.tourpik.item-detail--hotel .item-head--hotel + section.itemDetail .titProduct {margin-bottom:0}
main.sub div.tourpik.item-detail.item-detail--hotel .item-head--hotel + section.itemDetail div.itemContent > div.content.notice:first-child,
.item-detail--hotel .item-head--hotel + section.itemDetail div.itemContent > #item-detail-room:first-child {border-top:0}
/* 예약 패널 윗면을 본문 첫 섹션 제목(공지·객실)에 맞춘다 — 섹션 상단 여백 26px 과 같은 값. ≤980 은 바텀시트라 제외 */
@media (min-width:981px) {
    div.tourpik.item-detail--hotel .item-head--hotel + section.itemDetail > .css-qdh81c {padding-top:26px}
}
/* 가독성(2026-10-07 사용자 결정): 샘플 크기는 9~11px 이 많아 저시력 사용자에게 작다 — 레이아웃·색 체계는 샘플 그대로 두고
   객실·요금제 목록 글자를 PC 12px · 모바일 11.5px 이상으로 올리고, 작은 회색 글자는 --tp-hotel-average(대비 약 6:1)로 진하게 한다. */
.item-detail--hotel .item-room__intro {display:flex;justify-content:space-between;gap:16px; margin:0 0 16px; color:var(--tp-hotel-average);font-size:13px;}
.item-detail--hotel .item-room__intro p {margin:0}
.item-detail--hotel .item-room__intro span {flex-shrink:0}
.item-detail--hotel .item-room__search {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.25fr) auto;gap:16px;border:1px solid var(--tp-blue);border-radius:12px;background:white;padding:16px; align-items:center}
.item-detail--hotel .item-room__date {min-width:0;border:0;border-right:1px solid var(--tp-hotel-line);background:transparent;padding:0 10px;justify-content:space-between;border-radius:0;min-height:40px}
.item-detail--hotel .item-room__date:first-child {padding-left:4px}
.item-detail--hotel .item-room__date-field {flex:1}
.item-detail--hotel .item-room__date-label,.item-room__guest-summary small {color:var(--tp-hotel-average);font-size:12.5px;font-weight:400}
.item-detail--hotel .item-room__date-value,.item-room__guest-summary b {font-size:16px; line-height:1.5; overflow-wrap:anywhere}
.item-room__guest-summary {display:flex;min-width:0;min-height:40px;flex-direction:column;justify-content:center;gap:2px;border:0;border-right:1px solid var(--tp-hotel-line);padding:0 10px;text-align:left;background:transparent;cursor:pointer}
.item-detail--hotel .item-room__search-btn {min-height:46px;font-size:15px;padding:0 12px;background:var(--tp-hotel-blue);border-radius:8px;font-weight:600}
.item-detail--hotel .item-room__search-btn:hover {background:var(--tp-hotel-blue-dark)}
.item-detail--hotel .item-room__list {margin-top:40px}
.item-detail--hotel .item-room__card {border-radius:12px;margin-bottom:16px}
.item-detail--hotel .item-room__head {display:grid;grid-template-columns:158px minmax(0,1fr) 186px;gap:16px;padding:16px;}
.item-detail--hotel .item-room__photo {width:158px;height:104px;padding:0;border:0;background:transparent;cursor:pointer}
.item-detail--hotel .item-room__thumb-label {right:7px;bottom:7px;padding:4px 8px;font-size:11.5px;font-weight:800}
.item-detail--hotel .item-room__name {font-size:18px;line-height:1.5}
.item-detail--hotel .item-room__name-en {font-size:12px;color:var(--tp-hotel-average)}
/* 샘플 `.room-quick` — 기준 인원·면적·침대·전망·편의시설을 한 줄로, 사진·상세 링크는 다음 줄 */
.item-detail--hotel .item-room__specs {margin-top:8px;color:#555;font-size:13px;line-height:1.7}
.item-detail--hotel .item-room__specs .item-room__meta,.item-detail--hotel .item-room__specs .item-room__amenities {display:inline;margin:0;color:inherit;font-size:inherit}
.item-detail--hotel .item-room__specs .item-room__meta + .item-room__amenities::before {content:" · "}
/* 객실 요약 다음 줄의 사진·상세 모달 링크 — 객실정보 더보기 자리(2026-10-07). 탭 영역은 패딩으로 넓힌다 */
.item-room__detail-link {display:inline-block; margin:4px 0 0; padding:6px 0; border:0; background:none;color:var(--tp-hotel-blue);font:inherit;font-size:15px;font-weight:500;white-space:nowrap;cursor:pointer;text-decoration: underline; text-underline-position: from-font;}
.item-room__detail-link:hover {color:var(--tp-hotel-blue-dark);text-decoration:underline}
.item-room__detail-link:focus-visible {outline:2px solid var(--tp-hotel-blue);outline-offset:2px;border-radius:3px}
.item-room__rate-summary {border-left:1px solid var(--tp-line);padding-left:16px;text-align:right;min-width:0}
.item-room__rate-summary small,.item-room__rate-summary span {display:block;color:var(--tp-hotel-average);font-size:12px;line-height:1.5}
.item-room__rate-summary strong {display:block;color:var(--tp-hotel-red);font-size:20px;line-height:1.6}
.item-room__toggle {width:100%;min-height:44px;margin-top:8px;padding:6px;border:1px solid var(--tp-info-line);border-radius:8px;background:var(--tp-hotel-lowest-bg);font-size:13px;font-weight:500;cursor:pointer; color: var(--tp-blue);}
.item-detail--hotel .item-room__promos {padding:0}
.item-detail--hotel .item-room__promos[hidden],.item-detail--hotel [hidden],.item-hotel-dialog[hidden],.item-hotel-dialog [hidden] {display:none}
.item-room__rate-head,.item-detail--hotel .item-room__promo-top {display:grid;grid-template-columns:minmax(160px,1fr) minmax(150px,.82fr) 268px;gap:0;align-items:stretch; padding:16px;}
.item-room__rate-head {margin-bottom: 8px; padding:10px 16px;background:var(--tp-bg);font-size:13px;font-weight:500;color:var(--tp-hotel-average)}
.item-room__rate-head span:last-child {text-align:right}
.item-detail--hotel .item-room__promo {padding:0;border-bottom:1px solid var(--tp-line)}
.item-detail--hotel .item-room__promo:last-child {border-bottom:0}
/* 테두리는 덮개(::after)로 그린다 — inset 그림자는 자식 칸의 세로 구분선·배경에 덮여 끊기고, 카드 마지막 행이면 카드 테두리와 겹친다 */
.item-detail--hotel .item-room__promo--lowest {position:relative;background:var(--tp-hotel-lowest-bg);border-radius:12px;}
.item-detail--hotel .item-room__promo--lowest::after {content:"";position:absolute;inset:0;z-index:1;border:1px solid var(--tp-hotel-lowest-line);border-radius:inherit;pointer-events:none}
/* 카드 맨 아래 행이면 아래 모서리를 카드 안쪽 곡선(카드 15px − 테두리 1px)에 맞춘다 — 9px 이면 카드 곡선과 어긋나 양쪽 끝이 깨져 보인다 */
.item-detail--hotel .item-room__promo--lowest:last-child {border-bottom-left-radius:14px;border-bottom-right-radius:14px}
.item-detail--hotel .item-room__promo--selected {background:var(--tp-hotel-selected-bg)}
.item-detail--hotel .item-room__promo-info,.item-room__conditions {}
.item-detail--hotel .item-room__promo-info {display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start}
.item-detail--hotel .item-room__promo-name {font-size:18px; font-weight:700; line-height:1.55;overflow-wrap:anywhere; letter-spacing: -0.02em;}
.item-detail--hotel .item-room__promo-bed {margin:3px 0 0;font-size:12px;color:var(--tp-hotel-average)}
.item-detail--hotel .item-room__promo-more {display:inline-flex;align-items:center;gap:4px;margin-top:8px;min-height:32px;text-align:left;font-size:14px; color:var(--tp-hotel-average); font-weight:500; letter-spacing: -0.02em;}
.item-room__conditions {min-width:0;font-size:12px;line-height:1.6;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start}
.item-room__conditions .item-room__promo-meal,.item-room__conditions .item-room__promo-flag {margin:0;font-size:14px;}
.item-detail--hotel .item-room__conditions .item-room__promo-meal:not(.item-room__promo-meal--off) {color:var(--tp-breakfast);font-weight:500}
.item-room__availability {color:var(--tp-hotel-mismatch);background:var(--tp-hotel-mismatch-bg);margin-top:4px;border-radius:4px;padding:4px 8px;font-size:13px;font-weight:500; line-height: 1.4; overflow-wrap:anywhere}
.item-room__availability--available {color:var(--tp-hotel-available);background:var(--tp-hotel-available-bg)}
.item-detail--hotel .item-room__promo-price {padding:10px 12px;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) 88px;gap:16px;align-items:center;width:auto}
.item-detail--hotel .item-room__promo-amount {align-items:flex-end;text-align:right;min-width:0}
.item-detail--hotel .item-room__promo-now {color:var(--tp-hotel-red);font-size:20px;font-weight:700;letter-spacing: -0.02em;overflow-wrap:anywhere}
.item-detail--hotel .item-room__promo-avg {font-size:12px;line-height:1.5;color:var(--tp-hotel-average);margin-top:2px}
/* 할인율 → 정상가 → 판매가 → 1박 평균 → 세금 문구 순서(샘플 ratePrice) */
.item-detail--hotel .item-room__promo-discount {display:inline-flex;border-radius:4px;background:var(--tp-hotel-available-bg);color:var(--tp-hotel-available);padding:2px 4px;font-size:11px;font-weight:600;line-height:1.3;}
.item-detail--hotel .item-room__promo-original {margin-top:2px;color:var(--tp-hotel-original);font-size:13px;font-weight:400;font-variant-numeric:tabular-nums}
.item-detail--hotel .item-room__promo-tax {color:var(--tp-hotel-average);font-size:12px;line-height:1.4}
.item-detail--hotel .item-room__cta {min-height:40px;font-size:15px;padding:6px;border-radius:8px;white-space:normal;background:var(--tp-hotel-blue);font-weight:700}
.item-detail--hotel .item-room__cta--selected {background:var(--tp-hotel-selected)}
.item-detail--hotel .item-room__cta--off {background:var(--tp-bg);color:var(--tp-hotel-muted);font-weight:400}
.item-detail--hotel .item-room__slots {grid-column:1/-1}
.item-room__lowest {display:table;padding:3px 8px;margin-bottom:5px;border-radius:4px;background:var(--tp-hotel-lowest-badge);color:white;font-size:12px;font-weight:500;line-height:1.4}
/* 요금 강조 배지(관리자 프로모션 문구) — 최저가 배지와 구분되게 검정 계열(레거시 요금표 `style_v3.css` .roomItem[badge] 와 같은 결정) */
.item-room__badge {display:table;padding:3px 8px;margin-bottom:5px;border-radius:4px;background:var(--tp-text);color:white;font-size:12px;font-weight:500;line-height:1.4;overflow-wrap:anywhere}
.item-detail--hotel .item-room__promo-detail {display:none}

.item-book-panel--hotel {border-radius:16px;box-shadow:0 4px 16px rgba(25,38,57,.09);color:var(--tp-hotel-ink)}
.item-book-panel--hotel .item-book-panel__head {padding:18px 18px 16px;border-bottom:1px solid var(--tp-line)}
.item-book-panel--hotel .item-book-panel__head-top {align-items:center}
/* 패널·하단 바도 목록과 같은 가독성 기준(PC 12px·모바일 11.5px 이상, 작은 회색 글자는 --tp-hotel-average) — 2026-10-07 U26 */
.item-book-panel--hotel .item-book-panel__head small {display:block;color:var(--tp-hotel-average);font-size:12.5px;margin-bottom:4px}
.item-book-panel--hotel .item-book-panel__title {font-size:18px}
.item-book-panel--hotel .item-book-panel__ic {width:36px;height:36px}
.item-book-panel--hotel .item-book-panel__body {padding:16px 20px;}
.item-book-panel__stay {display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:8px;align-items:center;border:1px solid var(--tp-hotel-line);border-radius:12px;padding:12px;margin-bottom:16px}
.item-book-panel__stay > div:last-of-type {text-align:right}
.item-book-panel__stay small {display:block;color:var(--tp-hotel-average);font-size:12px;margin-bottom:4px}
.item-book-panel__stay b {display:block;font-size:14px; font-weight:600; overflow-wrap:anywhere;}
.item-book-panel__stay-change {grid-column:1/-1;text-align:right;color:var(--tp-hotel-blue);font-size:13px;line-height:1.7}
.item-book-panel--hotel .item-book-panel__cart {gap:10px;max-height:320px}
.item-book-panel--hotel .item-book-panel__empty {border:1px dashed var(--tp-disabled);border-radius:12px;background:var(--tp-hotel-lowest-bg);padding:24px 12px; font-size:13px; line-height:1.7;margin:0}
.item-book-panel--hotel .item-book-panel__ci {position:relative;display:block;padding:16px;background:var(--tp-hotel-selected-bg);border:0;border-radius:12px}
.item-book-panel__selected-label {color:var(--tp-hotel-blue);font-size:12px;}
.item-book-panel__room-name {padding-right:25px; margin-top:4px;font-size:15px;line-height:1.55;font-weight:600;overflow-wrap:anywhere}
.item-book-panel__rate-name {padding-right:25px;margin:3px 0 0;font-size:13px;color:var(--tp-hotel-average);line-height:1.6;overflow-wrap:anywhere}
.item-book-panel__room-price {display:flex; flex-direction: column; justify-content:space-between; gap: 8px; border-top:1px solid var(--tp-hotel-line); margin-top:12px; padding-top:12px}
.item-book-panel__room-price > span {font-size:12px; letter-spacing: -0.01em; color:var(--tp-hotel-average);}
.item-book-panel__room-price > b {font-size:24px; letter-spacing: -0.02em; text-align:right; overflow-wrap:anywhere;}
.item-book-panel--hotel .item-book-panel__ci-x {position:absolute;right:9px;top:9px;width:26px;height:26px;border-radius:50%;background:white;color:var(--tp-hotel-muted);font-size:16px;margin:0}
.item-book-panel--hotel .item-book-panel__total {border-top:1px solid var(--tp-hotel-line);padding:12px 0 0}
.item-book-panel--hotel .item-book-panel__cta {min-height:50px;border-radius:8px;background:var(--tp-hotel-blue);font-weight:700}
.item-book-panel--hotel .item-book-panel__cta:disabled,.item-book-bar--hotel .item-book-bar__cta:disabled {background:var(--tp-hotel-disabled)}
.item-book-panel--hotel .item-book-panel__cta:not(:disabled):hover {background:var(--tp-hotel-blue-dark)}
.item-book-panel__hotel-note {color:var(--tp-hotel-average);font-size:12px;line-height:1.6;margin-top:10px}
.item-book-bar--hotel .item-book-bar__lbl {display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-width:100%;overflow:hidden;white-space:normal;font-size:12px;line-height:1.4}
.item-book-bar--hotel .item-book-bar__total:not(.item-book-bar__total--filled) .item-book-bar__lbl {color:var(--tp-hotel-average)}
.item-book-bar--hotel .item-book-bar__total {min-width:0;flex:1;text-align:left; gap: 2px;}
.item-book-bar--hotel .item-book-bar__amt {font-size:18px;font-weight:700;color:var(--tp-hotel-red);overflow-wrap:anywhere}
.item-book-bar__remove {width:36px;min-height:40px;flex-shrink:0;border:0;border-radius:8px;background:var(--tp-bg);color:var(--tp-hotel-muted);font-size:20px;cursor:pointer}

body.item-hotel-dialog-open {position:fixed;left:0;right:0;overflow:hidden}
.item-hotel-dialog {position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;background:rgba(20,30,55,.62);padding:20px;box-sizing:border-box;padding-top:calc(var(--safeAreaTop2,0px) + 20px);padding-top:calc(var(--safeAreaTop1,0px) + 20px);padding-bottom:calc(var(--safeAreaBottom2,0px) + 20px);padding-bottom:calc(var(--safeAreaBottom1,0px) + 20px)}
.item-hotel-dialog__box {display:flex;flex-direction:column;width:100%;max-width:1100px;max-height:100%;min-height:0;border-radius:18px;background:white;overflow:hidden;color:var(--tp-text)}
.item-hotel-dialog__head {display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-bottom:1px solid var(--tp-line);flex-shrink:0}
.item-hotel-dialog__head h3 {font-size:17px;line-height:1.5;margin:0}
.item-hotel-dialog__close {flex-shrink:0;width:40px;height:40px;border:0;border-radius:10px;font-size:26px;background:var(--tp-bg);cursor:pointer}
.item-hotel-dialog__body {display:grid;grid-template-columns:minmax(0,1.6fr) minmax(230px,.8fr);min-height:0;overflow-y:auto;overscroll-behavior:contain}
.item-hotel-dialog__gallery {padding:20px;min-width:0;background:var(--tp-bg)}
.item-hotel-dialog__visual {position:relative;min-height:220px}
.item-hotel-dialog__image {display:block;width:100%;height:48vh;max-height:470px;object-fit:contain;border-radius:12px}
.item-hotel-dialog__prev,.item-hotel-dialog__next {position:absolute;top:50%;transform:translateY(-50%);border:0;border-radius:50%;width:38px;height:38px;background:rgba(20,30,55,.7);color:white;font-size:25px;cursor:pointer}
.item-hotel-dialog__prev {left:10px}
.item-hotel-dialog__next {right:10px}
.item-hotel-dialog__count {position:absolute;right:12px;bottom:12px;padding:5px 10px;border-radius:20px;background:rgba(20,30,55,.7);color:white;font-size:11px}
.item-hotel-dialog__count:empty {display:none}
.item-hotel-dialog__thumbs {display:flex;gap:8px;overflow-x:auto;padding:10px 0 4px}
.item-hotel-dialog__thumb {flex:0 0 76px;width:76px;height:56px;border:2px solid transparent;padding:0;border-radius:8px;overflow:hidden;cursor:pointer;background:white}
.item-hotel-dialog__thumb img {width:100%;height:100%;object-fit:cover}
.item-hotel-dialog__thumb--active {border-color:var(--tp-blue)}
.item-hotel-dialog__info {padding:23px 21px;min-width:0}
.item-hotel-dialog__name {font-size:18px;line-height:1.6;margin:0}
.item-hotel-dialog__meta {color:var(--tp-gray);font-size:13px;line-height:1.7;margin:8px 0 16px;}
.item-hotel-dialog__info h4 {font-size:15px;margin:0 0 10px}
.item-hotel-dialog__amenities {display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:13px;line-height:1.6}
.item-hotel-dialog__amenities span {background:var(--tp-bg);padding:8px 12px;border-radius:4px}
.item-hotel-dialog__promo {display:none}
.item-hotel-dialog--promo .item-hotel-dialog__box {max-width:740px}
.item-hotel-dialog--promo .item-hotel-dialog__body {display:block}
.item-hotel-dialog--promo .item-hotel-dialog__gallery,.item-hotel-dialog--promo .item-hotel-dialog__info {display:none}
.item-hotel-dialog--promo .item-hotel-dialog__promo {display:block;padding:20px;font-size:14px;line-height:1.8;overflow-wrap:anywhere}
.item-hotel-dialog__promo img {max-width:100%;height:auto}
.item-hotel-dialog__promo table {max-width:100%}
.item-hotel-dialog__promo-room {padding:12px; background:var(--tp-bg);border-radius:8px; font-size:15px; font-weight:700; margin-bottom:16px;}
.item-hotel-dialog__empty {text-align:center;padding:80px 12px;color:var(--tp-gray)}
.item-hotel-dialog button:focus-visible,.item-detail--hotel button:focus-visible {outline:2px solid var(--tp-blue);outline-offset:3px}

/* 기본정보는 티켓과 동일한 itemDetailLegacy.css 공용 표 스타일을 사용한다. */
.item-hotel-facilities {margin:0;padding:32px 0; border-bottom: 1px solid var(--tp-line);}
.item-hotel-facilities h3 {font-size:20px; margin:0 0 16px; font-weight:700}

.item-hotel-facilities__grid {
    display: flex;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    row-gap: 20px;
    font-size:14px;
    font-weight: 500;
}
.item-hotel-facilities__card {display: flex; align-items: center; gap: 6px; flex: 0 0 calc(50% - 6px); min-width: 0;}
.item-hotel-facilities__icon {display:inline-flex;flex:none;align-items:center;justify-content:center;width:20px;height:20px}
.item-hotel-facilities__icon--emoji {font-size:17px;line-height:1}
.item-hotel-facilities__icon--svg {color:var(--tp-hotel-blue)}
.item-hotel-facilities__icon--svg svg {width:18px;height:18px}
.item-hotel-facilities__name {min-width:0;word-break:keep-all}

main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .RrefundPolicy > p,main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .reviewGroup {padding:16px;background:var(--tp-bg);border-radius:10px;font-size:13px;line-height:1.45}
main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .reviewGroup .title {font-size: 15px;}

/* 이용방법은 레거시 ID 선택자보다 우선하도록 #view_rule_bx 를 함께 쓴다. */

main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail summary {border-bottom: 0;}
main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .tap_info_tit h3 {font-size: 20px; font-weight: 700;}
main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .item-hotel-steps .tap_info_tit{border-bottom: 0;}
main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .item-hotel-steps #view_rule_bx .how_to_use {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;counter-reset:hotel-step}
main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .item-hotel-steps #view_rule_bx .how_to_use > .arrow {display:none}
main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .item-hotel-steps #view_rule_bx .how_to_use > .box {width:auto;min-width:0;margin:0;padding:16px;border:1px solid var(--tp-line);border-radius:12px;background:white;counter-increment:hotel-step}
main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .item-hotel-steps #view_rule_bx .how_to_use > .box:before {content:counter(hotel-step);display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:var(--tp-blue-tint);color:var(--tp-blue);font-size:12px;font-weight:700;margin-bottom:12px}
main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .item-hotel-steps #view_rule_bx .tit {margin:0;padding:0;border:0;background:none;color:var(--tp-text);font-size:15px;font-weight:700;}
main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .item-hotel-steps #view_rule_bx .tit > span {display:none}
main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .item-hotel-steps #view_rule_bx .text {line-height:1.6; margin-top:8px}
main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .item-hotel-steps #view_rule_bx .text .text-tit{display: inline-block; color: var(--tp-hotel-blue);}
main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .item-hotel-steps #view_rule_bx .text span {display:block;margin-top:8px;color:var(--tp-gray);line-height:1.6;}

/* 취소 규정은 다른 RrefundPolicy(업체정보/이용안내)와 분리한다. 원문 강조색은 유지한다. */
main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .item-hotel-policy > .content_tit {margin:0 0 15px;font-size:20px;font-weight:700;line-height:1.5;letter-spacing:-.4px}
.item-detail--hotel .item-hotel-policy__body {box-sizing:border-box;margin-top:15px;padding:14px;border:1px solid var(--tp-line);border-radius:13px;background:white;color:var(--tp-text);font-size:13px;line-height:1.75;overflow-x:auto;overflow-wrap:anywhere}
.item-detail--hotel .item-hotel-policy__body p {margin:0 0 10px;line-height:inherit}
.item-detail--hotel .item-hotel-policy__body p:last-child {margin-bottom:0}
.item-detail--hotel .item-hotel-policy__body ul,.item-detail--hotel .item-hotel-policy__body ol {margin:8px 0;padding-left:20px}
.item-detail--hotel .item-hotel-policy__body ul {list-style:disc}
.item-detail--hotel .item-hotel-policy__body ol {list-style:decimal}
.item-detail--hotel .item-hotel-policy__body li {margin:4px 0}
.item-detail--hotel .item-hotel-policy__body img {max-width:100%;height:auto}
.item-detail--hotel .item-hotel-policy__body a {text-decoration:underline;text-underline-offset:3px}
.item-detail--hotel .item-hotel-policy__body--rows {padding:0}
.item-detail--hotel .item-hotel-policy__row {display:grid;grid-template-columns:120px minmax(0,1fr);border-top:1px solid var(--tp-line)}
.item-detail--hotel .item-hotel-policy__row:first-child {border-top:0}
.item-detail--hotel .item-hotel-policy__label {padding:14px;background:var(--tp-bg);font-weight:700}
.item-detail--hotel .item-hotel-policy__content,.item-detail--hotel .item-hotel-policy__intro {min-width:0;padding:14px}
.item-detail--hotel .item-hotel-policy__label > * {margin:0;font-size:inherit;line-height:inherit}
/* 에디터 표의 인라인 폭/테두리만 정규화한다. 다열·셀병합 표에는 적용하지 않는다. */
.item-detail--hotel .item-hotel-policy__table {width:100% !important;max-width:100%;height:auto !important;margin:0;border:0 !important;border-collapse:collapse;font-size:13px}
.item-detail--hotel .item-hotel-policy__table > colgroup {display:none}
.item-detail--hotel .item-hotel-policy__table > tbody > tr > *,
.item-detail--hotel .item-hotel-policy__table > thead > tr > *,
.item-detail--hotel .item-hotel-policy__table > tfoot > tr > * {padding:14px !important;border:0 !important;border-bottom:1px solid var(--tp-line) !important;vertical-align:top;text-align:left;line-height:1.75}
.item-detail--hotel .item-hotel-policy__table > tbody > tr > :first-child,
.item-detail--hotel .item-hotel-policy__table > thead > tr > :first-child,
.item-detail--hotel .item-hotel-policy__table > tfoot > tr > :first-child {box-sizing:border-box;width:120px !important;background:var(--tp-bg) !important;font-weight:700}
.item-detail--hotel .item-hotel-policy__table > tbody > tr > :last-child,
.item-detail--hotel .item-hotel-policy__table > thead > tr > :last-child,
.item-detail--hotel .item-hotel-policy__table > tfoot > tr > :last-child {width:auto !important;background:white !important}
.item-detail--hotel .item-hotel-policy__table > tbody:last-child > tr:last-child > *,
.item-detail--hotel .item-hotel-policy__table > tfoot:last-child > tr:last-child > * {border-bottom:0 !important}

@media (max-width:780px) {
    .item-detail--hotel .item-hotel-policy__row {grid-template-columns:minmax(0,1fr)}
    .item-detail--hotel .item-hotel-policy__label {padding:12px 14px}
    .item-detail--hotel .item-hotel-policy__content {padding:12px 14px}
    .item-detail--hotel .item-hotel-policy__table,
    .item-detail--hotel .item-hotel-policy__table > tbody,
    .item-detail--hotel .item-hotel-policy__table > thead,
    .item-detail--hotel .item-hotel-policy__table > tfoot,
    .item-detail--hotel .item-hotel-policy__table tr {display:block}
    .item-detail--hotel .item-hotel-policy__body .item-hotel-policy__table tr > th,
    .item-detail--hotel .item-hotel-policy__body .item-hotel-policy__table tr > td {display:block;width:100% !important;box-sizing:border-box}

    main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .tap_info_tit h3 {font-size: 18px;}
    main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .item-hotel-policy > .content_tit {font-size: 18px;}
    main.sub div.tourpik.item-detail section.itemDetail div.itemContent .content_tit {font-size: 18px;}
}

@media (max-width:1150px) {
    .item-detail--hotel .item-room__search {grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.1fr)}
    .item-detail--hotel .item-room__search > .item-room__search-btn {grid-column:1/-1;min-height:42px}
    .item-room__guest-summary {border-right:0}
    .item-room__rate-head {display:none}
    .item-detail--hotel .item-room__promo-top {grid-template-columns:minmax(0,1fr) 206px; padding: 12px 16px;}
    .item-detail--hotel .item-room__promo-info {grid-column:1;grid-row:1;}
    .item-detail--hotel .item-room__promo-more {margin:3px 0 0}
    .item-room__conditions {grid-column:1;grid-row:2;border:0;padding:0 10px 10px;font-size:12.5px;line-height:1.5}
    .item-room__availability {max-width:100%;margin-top:4px;padding:0;background:none;font-size:12px;}
    .item-detail--hotel .item-room__promo-price {grid-column:2;grid-row:1/3;grid-template-columns:minmax(0,1fr) 68px; gap:12px}
    .item-detail--hotel .item-room__promo-now {font-size:18px}
    .item-detail--hotel .item-room__promo-avg {font-size:12px}
    .item-detail--hotel .item-room__promo-tax {font-size:12px}
    .item-detail--hotel .item-room__cta {font-size:13px}
}
@media (max-width:980px) {
    .item-detail--hotel .item-room__head {grid-template-columns:130px minmax(0,1fr) 155px;gap:12px}
    .item-detail--hotel .item-room__photo {width:130px;height:92px}
    /* 선택 내역 2줄이면 바가 89px 까지 커진다 — 공용 고정 여백(86px) 대신 detail.js 가 잰 바 높이를 따른다 */
    .item-detail.item-detail--hotel {padding-bottom:calc(var(--item-book-bar-h, 86px) + 10px)}
    .item-book-bar--hotel {padding:10px 15px;padding-bottom:calc(var(--safeAreaBottom2,0px) + 10px);padding-bottom:calc(var(--safeAreaBottom1,0px) + 10px)}
    .item-book-bar--hotel .item-book-bar__inner {gap:8px}
    .item-book-bar--hotel .item-book-bar__cta {flex:0 0 auto;max-width:45%;min-height:46px;padding:0 24px;border-radius:8px;font-size:16px;font-weight:700;background:var(--tp-hotel-blue)}
    .item-book-bar--hotel .item-book-bar__cta:active:not(:disabled) {background:var(--tp-hotel-blue-dark)}
    .item-hotel-facilities__grid {grid-template-columns:repeat(2,minmax(0,1fr))}
    main.sub div.tourpik.item-detail.item-detail--hotel section.itemDetail div.itemContent .item-hotel-steps #view_rule_bx .how_to_use {grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:780px) {
    .item-head--hotel {grid-template-columns:minmax(0,1fr);grid-template-areas:"tags" "title" "en" "rate" "price"}
    .item-head--hotel .item-head__title {font-size:22px}
    .item-head--hotel .item-head__price {margin-top:12px;text-align:left}
    .item-detail--hotel .item-room__intro {font-size:13px;gap:8px}
    .item-detail--hotel .item-room__search {gap:12px 6px;padding:12px}
    .item-detail--hotel .item-room__date,.item-detail--hotel .item-room__date:first-child {padding:0;border:0}
    .item-detail--hotel .item-room__date-value,.item-room__guest-summary b {margin-top: 4px; font-size:13px; font-weight: 500; line-height: 1.4;}
    .item-room__guest-summary {padding:0;border:0}
    .item-detail--hotel .item-room__search-btn {padding:8px; min-height: 42px;}
    .item-detail--hotel .item-room__head {grid-template-columns:88px minmax(0,1fr);gap:12px;padding:12px;}
    .item-detail--hotel .item-room__photo {width:88px;height:84px}
    .item-detail--hotel .item-room__name {font-size:16px;line-height:1.45}
    .item-detail--hotel .item-room__name-en {font-size:12px}
    .item-detail--hotel .item-room__specs {font-size:12px;margin-top:6px;line-height:1.6}
    .item-room__detail-link {font-size:12.5px;margin-top:2px}
    .item-room__rate-summary {grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) 128px;border:0;border-top:1px solid var(--tp-line);padding:10px 0 0;text-align:left}
    .item-room__rate-summary small {font-size:12px}
    .item-room__rate-summary small,.item-room__rate-summary strong,.item-room__rate-summary span {grid-column:1}
    .item-room__rate-summary strong {font-size:18px; letter-spacing: -0.02em;}
    .item-room__toggle {grid-column:2;grid-row:1/4;align-self:center;margin:0;min-height:42px}
    .item-room__rate-head {display:none}
    .item-detail--hotel .item-room__promo-top {grid-template-columns:minmax(0,1fr) 186px; padding: 12px 16px;}
    .item-detail--hotel .item-room__promo-info {grid-column:1;}
    .item-detail--hotel .item-room__promo-name {font-size:15px;font-weight: 600;line-height:1.4}
    .item-detail--hotel .item-room__promo-bed {font-size:11px}
    .item-detail--hotel .item-room__promo-more {font-size:13px;font-weight: 600;margin:2px 0 0; padding:3px 0;}
    .item-room__conditions {grid-column:1;border:0;padding:0;font-size:12px}
    .item-room__conditions .item-room__promo-meal,.item-room__conditions .item-room__promo-flag {font-size:13px; font-weight: 500;}
    .item-room__availability {font-size:12px}
    .item-detail--hotel .item-room__promo-price {grid-template-columns:minmax(0,1fr) 64px;gap:16px; padding:0;}
    .item-detail--hotel .item-room__promo-now {font-size:16px;display: flex; flex-direction: column;}
    .item-detail--hotel .item-room__promo-avg {font-size:11px}
    .item-detail--hotel .item-room__promo-discount {padding:2px 4px;font-size:11px;}
    .item-detail--hotel .item-room__promo-original {margin:0;font-size:13px; font-weight: 400;}
    .item-detail--hotel .item-room__promo-tax {font-size:11px}
    .item-detail--hotel .item-room__cta {font-size:13px;min-height:42px;padding:3px 2px}
    .item-room__lowest,.item-room__badge {font-size:11px;padding:2px 6px}
    .item-hotel-dialog {padding-left:10px;padding-right:10px}
    .item-hotel-dialog__body {display:block}
    .item-hotel-dialog__head {padding:12px 14px}
    .item-hotel-dialog__gallery,.item-hotel-dialog__info {padding:14px}
    .item-hotel-dialog__image {height:32vh;min-height:180px}
    .item-hotel-dialog__visual {min-height:180px}
}
@media (max-width:480px) {
    .item-detail--hotel .item-room__intro {display:block; margin-bottom:12px;}
    .item-detail--hotel .item-room__intro span {display:block; margin-top:12px;}

    .item-detail--hotel .item-room__promo {padding: 12px; background-color: var(--tp-bg); border: 0;}
    .item-detail--hotel .item-room__promo-top {padding: 10px; background-color: #fff; border-radius: 8px;}
    .item-detail--hotel .item-room__promo--lowest {border-radius: 6px;}
}
/* 하단 바 칩(선택내역)이 요금제명·금액을 담을 폭 — 360px 이하에서는 CTA·칩 여백을 줄여 금액이 잘리지 않게 한다(2026-10-06 QA) */
@media (max-width:360px) {
    .item-book-bar--hotel .item-book-bar__cta {padding:0 14px}
    .item-book-bar--hotel .item-book-bar__total {padding-right:34px;padding-left:10px}
    .item-book-bar--hotel .item-book-bar__chev {right:7px}
}
