@charset "UTF-8";
/* ==========================================================================
   trp-design.css — 자사몰 크림슨 MVP 톤 (2026-10-09, 디자인 A 의 코랄 톤을 대체)
   정본: 기획/자사몰-디자인-레퍼런스-2026-10-09/crimson/README.md
   - 첫 MVP 상품 페이지(2026-10-07)의 '옷'만 입힌다: 헤리티지 크림슨 #7C1B28 + 아이보리 #F6EDDC(승인 브랜드 기록 2026-07-13),
     종이색 바탕, Georgia 세리프 제목, 대문자 아이브로(앞 가는 선), 직각(2px) 단색 버튼, 그림자 대신 1px 선.
   - 링크·onclick·폼·결제/예약 동작·레이아웃 골격·운영 데이터·사진은 그대로.
   - 모든 규칙은 body.trp-dsg 스코프. body 에 trp-dsg 가 없는 화면(로그인·마이페이지·CRM)에는 번지지 않는다.
   - 신규 클래스는 trp- 접두. 운영 layout.css·main.css·sub.css 규칙은 지우지 않고 구체도 높은 셀렉터로 덮는다.
   - 리뷰 섹션(.trp-ota-*)은 trp-review.css 담당 — 이 파일에서 다루지 않는다(같은 토큰 값을 쓴다).
   - 모바일(≤768) 콘텐츠 display:none 금지, 글자 12px 이상, 터치 대상 44px 이상, 가로 넘침 0.
   - 롤백: 이 커밋 revert. (userComHead.jsp 의 이 파일 링크 1줄 주석은 홈·목록·헤더·푸터만 레거시로 되돌린다)
   ========================================================================== */

/* ---------- 1. 토큰 (README §1 — trp-review.css·itemView 인라인 토큰과 같은 값) ---------- */
body.trp-dsg {
    --trp-brand: #7C1B28; --trp-brand-deep: #5E141F; --trp-brand-ink: #7C1B28;
    --trp-tint-6: #F7EFED; --trp-tint-12: #EFE2E1; --trp-tint-24: #E0C7C8;
    --trp-ivory: #F6EDDC; --trp-ivory-soft: #FBF6EC; --trp-paper: #FFFDFA;
    --trp-ink: #20201E; --trp-text: #3A3935; --trp-muted: #62605B; --trp-meta: #6B6963;
    --trp-line: #D7D0C5; --trp-line-soft: #E8E1D4; --trp-dark: #20201E;
    --trp-serif: Georgia, "Iowan Old Style", "Times New Roman", serif;
    --trp-radius: 2px;
    --trp-shadow: none;
    --trp-float: 0 -8px 20px -14px rgba(32,32,30,.30);   /* 떠 있는 하단 예약 바·옵션 시트 전용 */
    --trp-star: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%237C1B28' d='M12 2l2.9 6.6 7.1.7-5.4 4.8 1.6 7L12 17.4 5.8 21l1.6-7L2 9.3l7.1-.7z'/%3E%3C/svg%3E");
    background-color: var(--trp-paper);
    color: var(--trp-ink);
}
body.trp-dsg ::selection {background: var(--trp-tint-24); color: var(--trp-ink);}
body.trp-dsg a:focus-visible, body.trp-dsg button:focus-visible, body.trp-dsg input:focus-visible,
body.trp-dsg select:focus-visible, body.trp-dsg textarea:focus-visible {outline: 2px solid var(--trp-brand); outline-offset: 3px;}
@media (prefers-reduced-motion: reduce) {
    body.trp-dsg *, body.trp-dsg *::before, body.trp-dsg *::after {transition-duration: 0s !important; animation-duration: 0s !important;}
}

/* ---------- 2. 아이브로(MVP .eyebrow) — 마크업 추가 없이 ::before 로: 12px 700 대문자 자간 .16em 크림슨 + 앞 24px 가는 선 ----------
   문구는 장식(content 의 대체 텍스트 "" → 스크린리더는 읽지 않음). 문구 변경은 아래 content 한 줄씩. */
body.trp-dsg .sub-main.main1 .sub-main-tit-wrap::before, body.trp-dsg .sub-main.main4 .sub-r .r-tit-wrap::before,
body.trp-dsg .contact-wrap::before, body.trp-dsg .best-tour-wrap_ .bt-tit {
    display: block; margin: 0 0 14px; padding: 0 0 0 36px; background: linear-gradient(var(--trp-brand), var(--trp-brand)) no-repeat left center / 24px 1px;
    font-family: inherit; font-size: 12px; font-weight: 700; line-height: 1.4; letter-spacing: .16em; text-transform: uppercase; color: var(--trp-brand-ink);}
body.trp-dsg .sub-main.main1 .sub-main-tit-wrap::before {content: "Tripper Korea"; content: "Tripper Korea" / ""; flex: 0 0 100%; box-sizing: border-box;}
body.trp-dsg .sub-main.main4 .sub-r .r-tit-wrap::before {content: "About us"; content: "About us" / ""; margin-bottom: 36px;}   /* 아래 레거시 여는 따옴표(top:-20px)와 겹치지 않게 */
body.trp-dsg .contact-wrap::before {content: "Contact"; content: "Contact" / "";}
/* 가운데 정렬 제목(맞춤투어)은 선을 글자 위 가운데로 */
body.trp-dsg .sub-main.main2 .custom-tit-wrap::before {content: "Tailor-made"; content: "Tailor-made" / ""; flex: 0 0 100%; display: block; margin: 0 0 16px; padding: 16px 0 0;
    background: linear-gradient(var(--trp-brand), var(--trp-brand)) no-repeat center top / 24px 1px; text-align: center;
    font-family: inherit; font-size: 12px; font-weight: 700; line-height: 1.4; letter-spacing: .16em; text-transform: uppercase; color: var(--trp-brand-ink);}

/* ---------- 3. 헤더 (topMenu.jsp — 링크·동작 불변, 클래스만 기존 그대로) — 흰 바탕 + 아래 1px 선, 그림자 없음 ---------- */
body.trp-dsg header {background-color: #FFFFFF; border-bottom: 1px solid var(--trp-line);}
body.trp-dsg header.active {box-shadow: none;}
body.trp-dsg .pc-ver .hd-wrap {height: 80px;}
body.trp-dsg .hd-wrap .menu-wrap .menu.trp-hd-menu {min-height: 44px; min-width: 44px; padding: 0 8px; margin-left: -8px; border-radius: var(--trp-radius);}
body.trp-dsg .hd-wrap .menu-wrap .menu.trp-hd-menu p {font-size: 13px; font-weight: 700; letter-spacing: .16em; color: var(--trp-ink); margin-left: 12px;}
body.trp-dsg .hd-wrap .menu-wrap .menu.trp-hd-menu .ico-menu {width: 22px; height: 18px;}
body.trp-dsg .hd-wrap .menu-wrap .menu.trp-hd-menu:hover {background-color: var(--trp-ivory-soft);}
body.trp-dsg .hd-wrap .menu-wrap .menu.trp-hd-menu:hover p {color: var(--trp-brand-ink);}
body.trp-dsg .hd-wrap__logo > a.main-logo {width: 132px; height: 47px; min-height: 44px; background-size: contain;}
body.trp-dsg .hd-wrap .trp-hd-ico {width: 44px; height: 44px; margin: 0; border-radius: var(--trp-radius); background-size: 24px 24px; background-position: center; background-repeat: no-repeat;}
body.trp-dsg .hd-wrap .trp-hd-ico:hover {background-color: var(--trp-ivory-soft);}
body.trp-dsg .hd-wrap__link .mypage.trp-hd-ico {display: inline-flex; align-items: center; justify-content: center;}
body.trp-dsg .hd-wrap__link .mypage.trp-hd-ico .ico-mypage {width: 32px; height: 32px;}
body.trp-dsg .pc-ver .hd-wrap__link > li:not(:last-child)::after {background: var(--trp-line); margin: 0 10px;}
/* Log In / Log Out: 검정 알약 → 직각 크림슨 테두리, hover 크림슨 단색 (MVP 보조 버튼) */
body.trp-dsg .hd-wrap__link .login-btn.trp-login {width: auto; height: 44px; padding: 0 20px; border: 1px solid var(--trp-brand); border-radius: var(--trp-radius);
    background: #FFFFFF; color: var(--trp-brand-ink); font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; box-shadow: none; transition: background-color .15s, color .15s;}
body.trp-dsg .hd-wrap__link .login-btn.trp-login:hover {background: var(--trp-brand); color: #FFFFFF;}
/* 사이드 메뉴(열림 패널): 세리프 목록, hover 크림슨 */
body.trp-dsg .menu-list .menu-tit-wrap .menu-tit {font-family: var(--trp-serif); font-weight: 400; letter-spacing: -.02em; color: var(--trp-ink);}
body.trp-dsg .menu-list .menu-tit-wrap button {min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center;}
body.trp-dsg .menu-list ul li a, body.trp-dsg .menu-list ul li a .menu-li {font-family: var(--trp-serif); color: var(--trp-muted); letter-spacing: -.01em;}
body.trp-dsg .menu-list ul li:hover .menu-li {font-weight: 400; color: var(--trp-brand-ink); border-bottom-color: var(--trp-brand);}
@media screen and (max-width: 1300px) {
    body.trp-dsg .mobile-ver .hd-wrap {height: 60px;}
    body.trp-dsg .mobile-ver .hd-wrap__logo > a.main-logo {width: 110px; height: 44px;}
    body.trp-dsg .mobile-ver .menu-wrap .trp-hd-ico {width: 44px; height: 44px; margin-right: 4px; background-size: 22px 22px;}
    body.trp-dsg .mobile-ver .hd-wrap .menu-wrap .menu.trp-hd-menu {margin-left: 0;}
    body.trp-dsg .mobile-ver .hd-wrap .menu-wrap .menu.trp-hd-menu p {font-size: 12px; margin-left: 8px;}
    body.trp-dsg .sub-main.main1 {margin-top: 110px;}
}
@media screen and (max-width: 768px) {
    body.trp-dsg .hd-wrap .menu-wrap .menu-list {width: min(374px, 88vw); padding: 32px 24px;}
    body.trp-dsg .menu-list ul li a {font-size: 22px; min-height: 44px;}
    body.trp-dsg .sub-tag-wrap .item-location {height: 44px;}
    body.trp-dsg .dtView-swiper-button-prev, body.trp-dsg .dtView-swiper-button-next {width: 44px;}
}

/* ---------- 4. 푸터 (userUnitBottom.jsp: trp-ft · trp-ft-grid · trp-ft-brand · trp-ft-col) — 잉크 바탕 + 흰 로고 ---------- */
body.trp-dsg footer.trp-ft {background: var(--trp-dark); color: #D6D2CA;}
body.trp-dsg footer.trp-ft .inner.trp-ft-grid {height: auto; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 3fr); gap: 32px; padding-top: 56px; padding-bottom: 48px; align-items: start;}
body.trp-dsg footer.trp-ft .trp-ft-brand {width: auto; padding: 0;}
/* 로고는 어떤 색 자산이 와도 흰색으로 (현재 ft-logo.svg 도 흰색 — 반전은 안전장치) */
body.trp-dsg footer.trp-ft .ft-cont__logo {width: 120px; height: 44px; background-position: left center; filter: brightness(0) invert(1);}
body.trp-dsg footer.trp-ft .ft-cont__copy p {color: #BDB8AE; font-size: 13px; line-height: 1.6; margin-top: 14px;}
body.trp-dsg footer.trp-ft .ft-cont__info {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; max-width: none; padding: 0; margin: 0;}
body.trp-dsg footer.trp-ft .ft-cont__info li.trp-ft-col {width: auto; margin: 0;}
body.trp-dsg footer.trp-ft .ft-cont__info li .ft-info-tit {color: #FFFFFF; font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; margin-bottom: 12px;}
body.trp-dsg footer.trp-ft .ft-cont__info li .ft-info-cont {color: #D6D2CA; font-size: 14px; line-height: 1.6;}
body.trp-dsg footer.trp-ft .ft-cont__info li .ft-info-cont p {font-size: 14px; overflow-wrap: anywhere;}
body.trp-dsg footer.trp-ft .ft-cont__info li .ft-info-cont p + p {margin-top: 2px;}
body.trp-dsg footer.trp-ft .ft-cont__info li .ft-info-cont a {color: #FFFFFF;}
body.trp-dsg footer.trp-ft .ft-cont__info .ft-info-sns {gap: 4px; margin-top: 10px;}
body.trp-dsg footer.trp-ft .ft-cont__info .ft-info-sns a {display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.18); border-radius: var(--trp-radius);}
body.trp-dsg footer.trp-ft .ft-cont__info .ft-info-sns a:hover {background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.4);}
body.trp-dsg footer.trp-ft .ft-cont__info li .ft-info-sns i {margin: 0; width: 22px; height: 22px; background-size: contain; background-repeat: no-repeat;}
@media screen and (max-width: 1300px) {
    body.trp-dsg footer.trp-ft .inner.trp-ft-grid {grid-template-columns: minmax(0, 1fr); gap: 28px; height: auto; padding-top: 40px; padding-bottom: 40px;}
}
@media screen and (max-width: 768px) {
    body.trp-dsg footer.trp-ft .inner.trp-ft-grid {padding: 32px 16px 40px; gap: 20px;}
    body.trp-dsg footer.trp-ft .ft-cont__info {grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px 16px;}
    body.trp-dsg footer.trp-ft .ft-cont__info li.trp-ft-col + li.trp-ft-col {margin: 0;}
    body.trp-dsg footer.trp-ft .ft-cont__info li.trp-ft-col:nth-child(2) {grid-column: 1 / -1; grid-row: 2;}
    body.trp-dsg footer.trp-ft .ft-cont__info li .ft-info-cont, body.trp-dsg footer.trp-ft .ft-cont__info li .ft-info-cont p {font-size: 13px;}
    body.trp-dsg footer.trp-ft .ft-cont__copy p {font-size: 12px; margin-top: 8px;}
}

/* ---------- 5. 공통: 페이지 제목·태그·브레드크럼(=아이브로) ----------
   주의: reset.css 가 * {font-family: SUIT} 라 세리프는 글자를 가진 요소(자식 span 포함)에 직접 지정해야 한다. */
/* 레거시 헤더(100px) 시절 .container 윗선(#E4E4E4) — 80px 헤더 아래 이중 선이 되므로 지운다(헤더 아래 1px 선 하나만) */
body.trp-dsg .container {border-top: 0;}
body.trp-dsg .sub-tit-wrap .sub-tit {font-family: var(--trp-serif); font-weight: 400; letter-spacing: -.03em; line-height: 1.12; color: var(--trp-ink);}
body.trp-dsg .sub-tit-wrap .sub-cont {color: var(--trp-text); font-size: 18px; line-height: 1.55;}
body.trp-dsg .sub-tag-wrap .sub-tag {border: 1px solid var(--trp-line); border-radius: var(--trp-radius); color: var(--trp-ink); background: var(--trp-ivory-soft); font-weight: 500;}
/* 브레드크럼: 아래 회색 줄 대신 MVP 아이브로(앞 24px 크림슨 선 + 12px 대문자), 현재 위치는 크림슨 */
body.trp-dsg .top-loca ul {border-bottom: 0; padding-bottom: 0;}
body.trp-dsg .top-loca ul::before {content: ""; flex: 0 0 24px; height: 1px; margin-right: 12px; background: var(--trp-brand);}
body.trp-dsg .top-loca ul li {font-size: 12px; font-weight: 700; letter-spacing: .16em; color: var(--trp-muted);}
body.trp-dsg .top-loca ul li:last-child {color: var(--trp-brand-ink);}

/* ---------- 6. 홈 (userUnitMain.jsp) ---------- */
/* 섹션 제목: 검정 블록 → 아이브로 + 세리프 40/28 + 아래 1px 선 */
body.trp-dsg .sub-main .sub-main-tit-wrap {align-items: flex-end; flex-wrap: wrap; gap: 0 16px; padding-bottom: 18px; border-bottom: 1px solid var(--trp-line);}
body.trp-dsg .sub-main-tit-wrap .sub-main-tit {width: auto; height: auto; justify-content: flex-start; text-align: left; margin: 0; padding: 0; background: none; border-radius: 0; font-family: var(--trp-serif); font-size: 40px; line-height: 1.1; font-weight: 400; letter-spacing: -.03em; color: var(--trp-ink);}
body.trp-dsg .sub-main-tit-wrap .sub-main-tit .ico-badge, body.trp-dsg .sub-main-tit-wrap .sub-main-more .ico-badge {display: none;}
body.trp-dsg .sub-main-tit-wrap .sub-main-more a {width: auto; height: auto; min-height: 44px; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: none;
    font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--trp-brand-ink);}
body.trp-dsg .sub-main-tit-wrap .sub-main-more a:hover {color: var(--trp-ink); text-decoration: underline; text-underline-offset: 4px;}
body.trp-dsg .sub-main.main1 {margin-top: 136px;}   /* 헤더 80 + 여백 56 */
body.trp-dsg .sub-main-wrap {margin-top: 32px;}
/* 히어로 검색창: 알약 → 직각 */
body.trp-dsg .main-sch-wrap, body.trp-dsg .main-sch-wrap .sch-input-wrap input {border-radius: var(--trp-radius);}

/* 상품 카드(홈·목록 공통): a.trp-pcard — 4:3 사진(직각), 아이보리 배지·크림슨 글자, 대문자 메타, 세리프 제목·가격, 크림슨 별, 그림자 없음 */
body.trp-dsg .sub-main-wrap ul.trp-pcards {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px 24px; margin: 0;}
body.trp-dsg .sub-main-wrap ul.trp-pcards > li {width: auto; min-width: 0; padding: 0; margin: 0;}
body.trp-dsg a.trp-pcard {display: flex; flex-direction: column; gap: 8px; width: 100%; color: var(--trp-text); text-align: left;}
body.trp-dsg a.trp-pcard .sub-li-img {width: 100%; max-width: none; max-height: none; height: 0; padding-bottom: 75%; border-radius: var(--trp-radius); background-color: var(--trp-ivory); overflow: hidden; box-shadow: none;}
body.trp-dsg a.trp-pcard .sub-li-img::after {content: none;}
body.trp-dsg a.trp-pcard .sub-li-img img {inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; object-fit: cover; border-radius: 0;}  /* main.css 의 img max-height:400px 해제(768 폭 빈 띠 D1) */
body.trp-dsg a.trp-pcard:hover .sub-li-img img {transform: scale(1.03);}
body.trp-dsg a.trp-pcard .sub-li-tag.top {display: flex; top: 12px; left: 12px; right: auto; bottom: auto;}
body.trp-dsg a.trp-pcard .sub-li-tag.top .tag {display: inline-flex; margin: 0; padding: 6px 10px; border: 0; border-radius: var(--trp-radius); background-color: var(--trp-ivory); color: var(--trp-brand-ink);
    font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; line-height: 1.2;}
body.trp-dsg a.trp-pcard .trp-pcard-meta {display: block; margin: 8px 0 0; font-size: 12px; font-weight: 700; line-height: 1.5; letter-spacing: .12em; text-transform: uppercase; color: var(--trp-muted);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
body.trp-dsg a.trp-pcard .trp-pcard-meta span + span::before {content: "\00B7"; margin: 0 8px; color: var(--trp-brand);}
body.trp-dsg a.trp-pcard .sub-li-tit {margin: 0; padding: 2px 0 0; border-bottom: 0; font-family: var(--trp-serif); font-size: 22px; line-height: 1.25; font-weight: 400; letter-spacing: -.02em; color: var(--trp-ink);
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; height: auto; max-height: none;}
body.trp-dsg a.trp-pcard:hover .sub-li-tit {color: var(--trp-brand-ink);}
body.trp-dsg a.trp-pcard .sub-li-cont:empty {display: none;}
body.trp-dsg a.trp-pcard .sub-li-cont {margin: 2px 0 0; color: var(--trp-text); font-size: 14px; line-height: 1.55;}
body.trp-dsg a.trp-pcard .relation-score-wrap {display: flex; align-items: center; gap: 6px; margin: 0; min-height: 20px;}
body.trp-dsg a.trp-pcard .relation-score {display: inline-flex; gap: 1px; width: auto; height: auto;}
body.trp-dsg a.trp-pcard .relation-score .ico-star {display: inline-block; width: 14px; height: 14px; margin: 0; background: var(--trp-star) no-repeat center / contain;}
body.trp-dsg a.trp-pcard .relation-score-wrap p {display: inline-flex; align-items: baseline; gap: 4px; margin: 0; font-size: 14px; line-height: 1.3; color: var(--trp-ink);}
body.trp-dsg a.trp-pcard .relation-score-wrap p b {font-family: var(--trp-serif); font-size: 15px; font-weight: 400;}
body.trp-dsg a.trp-pcard .relation-score-wrap p span {font-size: 13px; color: var(--trp-meta);}
body.trp-dsg .trp-new {display: inline-block; padding: 3px 8px; border: 1px solid var(--trp-brand); border-radius: var(--trp-radius); background: transparent; color: var(--trp-brand-ink); font-size: 12px; font-weight: 700; letter-spacing: .12em; line-height: 1.3;}
/* 가격: 회색 박스 → 가는 선 위 'From'(세리프 이탤릭) + 세리프 금액 + PER PERSON */
body.trp-dsg a.trp-pcard .sub-li-price {display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; width: auto; height: auto; margin: 4px 0 0; padding: 12px 0 0; border: 0; border-top: 1px solid var(--trp-line-soft); border-radius: 0;
    background: none; box-shadow: none; color: var(--trp-muted); font-size: 13px;}
body.trp-dsg a.trp-pcard .sub-li-price .trp-from {font-family: var(--trp-serif); font-style: italic; font-size: 15px; color: var(--trp-muted);}
body.trp-dsg a.trp-pcard .sub-li-price span {font-family: var(--trp-serif); font-size: 24px; font-weight: 400; line-height: 1.2; letter-spacing: -.01em; color: var(--trp-ink);}
body.trp-dsg a.trp-pcard .sub-li-price p.per {margin: 0; padding: 0; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--trp-muted); border: 0; background: none; height: auto;}

/* 맞춤투어 · 문의 · 소개 블록 */
body.trp-dsg .sub-main.main2 .custom-tit-wrap {display: flex; align-items: baseline; justify-content: center; flex-wrap: wrap; margin: 30px 0; font-weight: 400;}
body.trp-dsg .sub-main.main2 .custom-tit, body.trp-dsg .sub-main.main2 .custom-tit2 {display: inline-block; width: auto; max-width: none; height: auto; border-radius: 0; padding: 0;}
body.trp-dsg .sub-main-tit-wrap .sub-main-tit, body.trp-dsg .contact-wrap .contact-tit {margin-top: 0;}
body.trp-dsg .sub-main.main2 .custom-tit, body.trp-dsg .sub-main.main2 .custom-tit2,
body.trp-dsg .contact-wrap .contact-tit {font-family: var(--trp-serif); font-weight: 400; letter-spacing: -.03em; color: var(--trp-ink); text-transform: lowercase; background: none;}
body.trp-dsg .sub-main.main2 .custom-tit::first-letter, body.trp-dsg .sub-main.main2 .custom-tit2::first-letter,
body.trp-dsg .contact-wrap .contact-tit::first-letter {text-transform: uppercase;}
body.trp-dsg .sub-main.main2 .custom-tit, body.trp-dsg .sub-main.main2 .custom-tit2 {font-size: 48px; line-height: 1.1;}
/* MVP 강조 단어(<em>) = 크림슨 이탤릭 */
body.trp-dsg .sub-main.main2 .custom-tit2 {margin-left: .25em; font-style: italic; color: var(--trp-brand-ink);}
body.trp-dsg .sub-main.main2 .custom-txt {color: var(--trp-text); font-size: 17px; line-height: 1.65;}
body.trp-dsg .sub-main.main2 .custom-wrap a.custom, body.trp-dsg .contact-wrap .contact-us a, body.trp-dsg .sub-r .about-us a {
    height: 52px; min-height: 52px; border-radius: var(--trp-radius); font-size: 14px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; box-shadow: none; transition: background-color .15s, border-color .15s, color .15s;}
body.trp-dsg .sub-main.main2 .custom-wrap a.custom {background: transparent; color: var(--trp-ink); border: 1px solid var(--trp-ink);}
body.trp-dsg .sub-main.main2 .custom-wrap a.custom:hover {background: var(--trp-ink); color: #FFFFFF;}
/* 문의: 회색 띠(#F7F7F7) → 아이보리 띠 + 위아래 1px 선, 안쪽은 MVP 결정 카드(종이 + 위 3px 크림슨) + 크림슨 단색 버튼 */
body.trp-dsg .sub-main.main3 {background: var(--trp-ivory-soft); border-top: 1px solid var(--trp-line-soft); border-bottom: 1px solid var(--trp-line-soft);}
body.trp-dsg .contact-wrap {height: auto; min-height: 355px; padding: 48px 24px; background: var(--trp-paper); border: 1px solid var(--trp-line); border-top: 3px solid var(--trp-brand); border-radius: var(--trp-radius);}
body.trp-dsg .contact-wrap .contact-tit {display: block; text-align: center; font-size: 40px; line-height: 1.15;}
body.trp-dsg .contact-wrap .contact-txt {color: var(--trp-text); font-size: 16px; line-height: 1.65;}
body.trp-dsg .contact-wrap .contact-us a {background: var(--trp-brand); color: #FFFFFF; border: 1px solid var(--trp-brand);}
body.trp-dsg .contact-wrap .contact-us a:hover {background: var(--trp-ink); border-color: var(--trp-ink);}
/* 소개: 세리프 제목 + 강조 단어 크림슨 이탤릭, 따옴표 크림슨 */
body.trp-dsg .sub-r .r-tit p {font-family: var(--trp-serif); font-weight: 400; letter-spacing: -.03em; color: var(--trp-ink);}
/* 레거시 검정 박스(.r-tit-box: SEOUL · New Era of Tourism !) → MVP 강조 단어(크림슨 이탤릭 세리프, 바탕 없음) */
body.trp-dsg .sub-r .r-tit .r-tit-box, body.trp-dsg .sub-r .r-tit p .r-tit-box {height: auto; font-family: var(--trp-serif); font-weight: 400; font-style: italic; background: none; border-radius: 0; color: var(--trp-brand-ink); padding: 0;}
body.trp-dsg .sub-main.main4 .sub-r .r-tit p::before, body.trp-dsg .sub-main.main4 .sub-r .r-tit-box::after {font-family: var(--trp-serif); font-style: normal; color: var(--trp-brand);}
body.trp-dsg .sub-r .r-txt {color: var(--trp-text); line-height: 1.65;}
body.trp-dsg .sub-r .about-us a {background: transparent; color: var(--trp-ink); border: 1px solid var(--trp-ink);}
body.trp-dsg .sub-r .about-us a:hover {background: var(--trp-ink); color: #FFFFFF;}

/* ---------- 7. 목록 (itemIndex.jsp) ---------- */
/* 페이지 제목: 세리프 디스플레이(문장형 대소문자) — 위 브레드크럼이 아이브로 역할 */
body.trp-dsg .sub-tit-wrap h1.sub-tit {font-size: 56px; line-height: 1.05; text-transform: lowercase;}
body.trp-dsg .sub-tit-wrap h1.sub-tit::first-letter {text-transform: uppercase;}
/* BEST TOUR: 아이콘 → 아이브로, 설명 문장 → 세리프 제목. 회색 판·슬라이드 회색 바탕 제거 */
body.trp-dsg .best-tour-wrap {background-color: var(--trp-ivory-soft); border-top: 1px solid var(--trp-line); border-bottom: 1px solid var(--trp-line);}
body.trp-dsg .best-tour-wrap .ico-best_tour {display: none;}
body.trp-dsg .best-tour-wrap .best-tour-tit-wrap {border-bottom: 1px solid var(--trp-line); align-items: flex-end; padding-bottom: 20px;}
body.trp-dsg .best-tour-wrap .best-tour-tit-wrap .best-tour-wrap_ {margin-left: 0;}
body.trp-dsg .best-tour-wrap_ .bt-tit {margin: 0 0 12px;}
body.trp-dsg .best-tour-wrap_ .bt-txt {padding: 0; font-family: var(--trp-serif); font-size: 40px; line-height: 1.1; font-weight: 400; letter-spacing: -.03em; color: var(--trp-ink);}
body.trp-dsg .best-tour-wrap a.trp-pcard .sub-li-tit {font-size: 22px;}
body.trp-dsg .sub-slide2 ul .swiper-slide {background-color: transparent;}
body.trp-dsg .sub-slide2 a.trp-pcard .sub-li-img {max-width: none;}
body.trp-dsg .sub-daily-tour-wrap .sub-main.daily {margin-top: 80px;}
body.trp-dsg .sub2-swiper-button-prev, body.trp-dsg .sub2-swiper-button-next {min-width: 44px; min-height: 44px; border-radius: var(--trp-radius); background-color: rgba(32,32,30,.82);}
body.trp-dsg .sub2-swiper-button-prev:hover, body.trp-dsg .sub2-swiper-button-next:hover {background-color: var(--trp-brand);}
body.trp-dsg a.paging_href {display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; border-radius: var(--trp-radius);}

/* ---------- 8. 상품 상세 (itemView.jsp) ----------
   2단 레이아웃·Swiper·sticky 패널의 display/position/width 는 레거시 그대로. 색·서체·테두리·모서리만.
   토큰 블록(.trp-dsg {--trp-…})·Duration 알약 숨김·Itinerary 규칙은 회귀 테스트가 인라인 위치를 고정하고 있어 인라인에 남는다(같은 토큰). */
body.trp-dsg #dailyTourView .sub-tit-wrap .sub-tit {font-size: clamp(28px, 3.2vw, 46px);}
/* 사실 정보 줄(MVP fact-strip): 위아래·칸 사이 1px 선, 라벨 12px 대문자, 값 15px */
body.trp-dsg .trp-facts {display: flex; margin: 24px 0 0; padding: 0; border-top: 1px solid var(--trp-line); border-bottom: 1px solid var(--trp-line);}
body.trp-dsg .trp-facts > div {flex: 1 1 0; min-width: 0; padding: 14px 18px 14px 0;}
body.trp-dsg .trp-facts > div + div {padding-left: 18px; border-left: 1px solid var(--trp-line);}
body.trp-dsg .trp-facts dt {margin: 0 0 4px; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--trp-muted);}
body.trp-dsg .trp-facts dd {margin: 0; font-size: 15px; font-weight: 500; line-height: 1.4; color: var(--trp-ink);}
/* 위치 버튼: 직각 잉크 테두리 */
body.trp-dsg .sub-tag-wrap .item-location {min-height: 44px; border: 1px solid var(--trp-ink); border-radius: var(--trp-radius); background: transparent; box-shadow: none; color: var(--trp-ink); font-size: 13px; font-weight: 700; letter-spacing: .14em;}
body.trp-dsg .sub-tag-wrap .item-location:hover {background: var(--trp-ink); color: #FFFFFF;}
body.trp-dsg .sub-tag-wrap .item-location:hover .ico-item-location {filter: invert(1);}
/* 갤러리: 직각, 선택 썸네일 크림슨 테두리, 화살표 직각 */
body.trp-dsg .dtView-slide, body.trp-dsg .dtView-slide img {border-radius: var(--trp-radius);}
body.trp-dsg .dtView-thumbs ul li img {border-radius: var(--trp-radius);}
body.trp-dsg .dtView-thumbs ul .swiper-slide-thumb-active img {border-color: var(--trp-brand);}
body.trp-dsg .dtView-swiper-button-prev, body.trp-dsg .dtView-swiper-button-next {border-radius: var(--trp-radius); background-color: rgba(32,32,30,.72);}
body.trp-dsg .dtView-swiper-button-prev:hover, body.trp-dsg .dtView-swiper-button-next:hover {background-color: var(--trp-brand);}
/* 섹션 제목: 세리프 36/26 + 아래 1px 선 */
body.trp-dsg .info-wrap .info-tit {font-family: var(--trp-serif); font-weight: 400; font-size: 36px; line-height: 1.15; letter-spacing: -.03em; padding-bottom: 18px; border-bottom: 1px solid var(--trp-line); color: var(--trp-ink);}
body.trp-dsg .info-wrap .info-sub-tit {font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--trp-brand-ink);}
body.trp-dsg .info-wrap.wrap2 > ul > li {color: var(--trp-text);}
/* Highlights: 회색 점 → 크림슨 짧은 가로선 */
body.trp-dsg .info-wrap.wrap2 ul .info-highlights::before {width: 14px; height: 2px; border-radius: 0; background-color: var(--trp-brand); transform: none; top: .75em; left: 0;}
/* Includes: 아이콘 이미지 → MVP '+'(크림슨) / '−'(회색) 글자 마커 */
body.trp-dsg .info-wrap.wrap2 ul .info-includes.chkY::before, body.trp-dsg .info-wrap.wrap2 ul .info-includes.chkN::before {background-image: none; width: 24px; height: auto; top: 0;
    font-family: var(--trp-serif); font-size: 22px; font-weight: 400; line-height: 1.2; text-align: center;}
body.trp-dsg .info-wrap.wrap2 ul .info-includes.chkY::before {content: "+"; color: var(--trp-brand);}
body.trp-dsg .info-wrap.wrap2 ul .info-includes.chkN::before {content: "\2212"; color: var(--trp-meta);}
body.trp-dsg .trp-meet-map {border: 1px solid var(--trp-line); border-radius: var(--trp-radius);}
/* 지도 버튼: 레거시 다크 버튼 → 직각 잉크 테두리, hover 잉크 단색 */
body.trp-dsg .info-wrap.wrap2 a.open-map-btn {display: inline-flex; align-items: center; min-height: 44px; padding: 0 20px; border: 1px solid var(--trp-ink); border-radius: var(--trp-radius);
    background-color: transparent; color: var(--trp-ink); font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;}
body.trp-dsg .info-wrap.wrap2 a.open-map-btn:hover {background-color: var(--trp-ink); color: #FFFFFF;}
body.trp-dsg .info-wrap ul.trp-cards > li.trp-card {border: 1px solid var(--trp-line-soft); border-radius: var(--trp-radius); box-shadow: none; background: #FFFFFF;}
body.trp-dsg .trp-card .trp-card-ico {border-radius: var(--trp-radius); background-color: var(--trp-ivory);}
/* Includes: 포함(chkY) 먼저, 불포함(chkN) 뒤로 — 두 묶음 */
body.trp-dsg .info-wrap.wrap2 > ul:has(> li.info-includes) {display: flex; flex-direction: column;}
body.trp-dsg .info-wrap.wrap2 > ul > li.info-includes.chkN {order: 1;}
body.trp-dsg .info-wrap.wrap2 > ul > li.info-includes.chkN {color: var(--trp-muted);}
/* 데이터가 없는 상품: 제목 + 빈 목록뿐인 섹션(Highlights·Includes 0건)은 그리지 않는다.
   (회귀 테스트가 이 두 섹션을 JSTL 가드 밖에 고정 → c:if 대신 :has() 로 접는다. 문구가 있으면 항상 보인다) */
body.trp-dsg .dtView-l .info-wrap.wrap2:has(> .info-tit + ul:last-child):not(:has(> ul > li)) {display: none;}

/* 예약 패널: 흰 결정 카드 + 위 3px 크림슨, 크림슨 단색 버튼(hover 잉크), 세리프 크림슨 번호·합계 */
body.trp-dsg .dtView-calendar {border-radius: var(--trp-radius); box-shadow: none;}
body.trp-dsg button.dtView-calendar {background-color: var(--trp-brand); transition: background-color .15s;}
body.trp-dsg button.dtView-calendar:hover {background-color: var(--trp-ink);}
body.trp-dsg .dtView-calendar .dtView-ca-tit {font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;}
body.trp-dsg .dtView-calendar .dtView-ca-date {font-family: var(--trp-serif); font-size: 22px; font-weight: 400; letter-spacing: -.01em;}
body.trp-dsg .dtView-calendar .dtView-ca-date span {font-family: inherit; font-weight: inherit;}
body.trp-dsg .tour-option-wrap {border: 1px solid var(--trp-line); border-top: 3px solid var(--trp-brand); border-radius: var(--trp-radius); box-shadow: none; background-color: #FFFFFF;}
body.trp-dsg .option-list .option-top p {font-size: 13px; letter-spacing: .16em;}
body.trp-dsg .option-list .option-top p.tour-option {color: var(--trp-brand-ink);}
body.trp-dsg .option-list .option-count {width: auto; min-width: 20px; height: auto; margin-right: 8px; border-radius: 0; background: none; color: var(--trp-brand-ink);
    font-family: var(--trp-serif); font-size: 20px; font-weight: 400; line-height: 1.15; justify-content: flex-start;}
body.trp-dsg .option-list .option-private {color: var(--trp-brand-ink);}
body.trp-dsg .option-list .option-private-txt {color: var(--trp-muted);}
body.trp-dsg .option-list .option-detail .option-price, body.trp-dsg .option-list .option-detail .option-price span {font-family: var(--trp-serif); font-weight: 400;}
body.trp-dsg .option-list ul li {border-bottom-color: var(--trp-line-soft);}
body.trp-dsg .trp-summary {background: var(--trp-ivory-soft); border: 1px solid var(--trp-line-soft); border-radius: var(--trp-radius); box-shadow: inset 3px 0 0 var(--trp-brand);}
body.trp-dsg .option-total .total {font-size: 12px; letter-spacing: .16em; color: var(--trp-muted);}
body.trp-dsg .option-total .total-price, body.trp-dsg .option-total .total-price span {font-family: var(--trp-serif); font-weight: 400; letter-spacing: -.01em; color: var(--trp-ink);}
body.trp-dsg .reserve-btn {height: 52px; border-radius: var(--trp-radius); font-size: 14px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; box-shadow: none; transition: background-color .15s, color .15s;}
body.trp-dsg .reserve-btn.active {background-color: var(--trp-brand); color: #FFFFFF;}
body.trp-dsg .reserve-btn.active:hover {background-color: var(--trp-ink);}
/* 비로그인(로그인 유도) 버튼: 비활성처럼 보이던 아이보리 → 크림슨 테두리(누를 수 있음이 보이게) */
body.trp-dsg .reserve-btn.inactive {background-color: #FFFFFF; color: var(--trp-brand-ink); border: 1px solid var(--trp-brand);}
body.trp-dsg .reserve-btn.inactive:hover {background-color: var(--trp-tint-6);}
/* 비로그인 방문자의 RESERVE(로그인 유도 onclick=fnLoginWall) = 주 버튼 크림슨 단색. '준비 중'(fnMsgModal)만 테두리 */
body.trp-dsg .reserve-btn.inactive[onclick^="fnLoginWall"] {background-color: var(--trp-brand); color: #FFFFFF; border: 1px solid var(--trp-brand);}
body.trp-dsg .reserve-btn.inactive[onclick^="fnLoginWall"]:hover {background-color: var(--trp-ink); border-color: var(--trp-ink);}
body.trp-dsg .trp-trust li {font-size: 12px; line-height: 1.4; color: var(--trp-muted);}
body.trp-dsg .trp-guest-tit {font-size: 12px; font-weight: 700; letter-spacing: .16em; color: var(--trp-brand-ink);}
body.trp-dsg .trp-guest-info textarea {border-color: var(--trp-line); border-radius: var(--trp-radius);}
body.trp-dsg .trp-guest-info textarea:focus {border-color: var(--trp-brand);}
body.trp-dsg .trp-route i {color: var(--trp-meta);}
/* 날짜·시간 선택 모달(/front/item/calModalView.do 응답이 이 페이지에 붙는다): 크림슨 선택 원·버튼, 직각 시간 칸 */
body.trp-dsg .modal-tit h3 {font-family: var(--trp-serif); font-weight: 400; letter-spacing: -.02em; color: var(--trp-ink);}
body.trp-dsg .calendar_nav span {font-family: var(--trp-serif); font-weight: 400;}
body.trp-dsg .ct_day.active::before, body.trp-dsg .ct_today .ct_day.active::before {background: var(--trp-brand);}
body.trp-dsg .ct_today .ct_day::before {background: var(--trp-ink);}
body.trp-dsg .date-list input[type="radio"] + label {border-color: var(--trp-line); border-radius: var(--trp-radius);}
body.trp-dsg .date-list input[type="radio"] + label::before {border-radius: var(--trp-radius);}
body.trp-dsg .date-list input[type="radio"]:checked + label {border-color: var(--trp-brand); background-color: var(--trp-ivory-soft); box-shadow: inset 3px 0 0 var(--trp-brand);}
body.trp-dsg .date-list input[type="radio"]:checked + label::before {background-color: var(--trp-brand);}
body.trp-dsg .modal-sel {border-radius: var(--trp-radius); background-color: var(--trp-brand); font-size: 15px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;}
body.trp-dsg .modal-sel:hover {background-color: var(--trp-ink);}
/* 인라인 로그인 모달(itemView 하단 <style> 의 기본값을 같은 톤으로) */
body.trp-dsg .trp-login-modal {border-top: 3px solid var(--trp-brand); border-radius: var(--trp-radius);}
body.trp-dsg .trp-login-modal .modal-txt__tit {font-family: var(--trp-serif); font-weight: 400; letter-spacing: -.02em; color: var(--trp-ink);}
body.trp-dsg .trp-login-modal .modal-txt__cont {color: var(--trp-muted);}
body.trp-dsg .trp-login-modal .login-btn.btn2 {border: 1px solid var(--trp-line); border-radius: var(--trp-radius); box-shadow: none;}
body.trp-dsg .trp-login-modal .trp-login-or {color: var(--trp-muted);}
body.trp-dsg .trp-login-modal .trp-login-or::before, body.trp-dsg .trp-login-modal .trp-login-or::after {background: var(--trp-line);}
body.trp-dsg .trp-login-modal .sftext .label {color: var(--trp-text);}
body.trp-dsg .trp-login-modal .sftext input {border-color: var(--trp-line); border-radius: var(--trp-radius);}
body.trp-dsg .trp-login-modal .sftext input:focus {border-color: var(--trp-brand);}
body.trp-dsg .trp-login-modal .trp-login-err {color: var(--trp-brand-ink);}
body.trp-dsg .trp-login-modal .modal__btn .btn {height: 52px; line-height: 52px; border-radius: var(--trp-radius); background-color: var(--trp-brand); font-size: 14px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;}
body.trp-dsg .trp-login-modal .modal__btn .btn:hover {background-color: var(--trp-ink);}
body.trp-dsg .trp-login-modal .trp-login-links a {color: var(--trp-text);}
/* Related Trip 카드: 직각 사진, 아이보리 직각 칩 크림슨 글자, 세리프 제목·가격, 크림슨 별 */
body.trp-dsg .relation-li-img, body.trp-dsg .relation-li-img img {border-radius: var(--trp-radius);}
body.trp-dsg .relation-li-img:after {border-radius: 0;}
body.trp-dsg .relation-li-tit {font-family: var(--trp-serif); font-weight: 400; font-size: 21px; letter-spacing: -.02em; color: var(--trp-ink); border-bottom-color: var(--trp-line-soft);}
body.trp-dsg .relation-li-tag .tag {font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; background: var(--trp-ivory); color: var(--trp-brand-ink); border: 0; border-radius: var(--trp-radius); padding: 5px 10px;}
body.trp-dsg .relation-li-price span {font-family: var(--trp-serif); font-weight: 400; font-size: 22px; color: var(--trp-ink);}
body.trp-dsg .relation-slide-wrap .relation-score .ico-star {background-image: var(--trp-star); background-size: 18px 18px; background-position: center;}
body.trp-dsg .relation-swiper-button-prev, body.trp-dsg .relation-swiper-button-next {border-radius: var(--trp-radius); background-color: rgba(32,32,30,.82);}
body.trp-dsg .relation-swiper-button-prev:hover, body.trp-dsg .relation-swiper-button-next:hover {background-color: var(--trp-brand);}

@media screen and (max-width: 1200px) {
    body.trp-dsg .reserve-btn {border-radius: var(--trp-radius);}
    /* 모바일 하단 예약 바: 1단 72px. [옵션] [금액·날짜] [예약] 한 줄. 종이 바탕 + 위 1px 선 + 크림슨 버튼.
       옵션 목록(.option-list ul)은 기존 토글(design.js optionBtn) 그대로 — 바 위로 펼쳐지는 시트(위 3px 크림슨) */
    body.trp-dsg .side-menu .tour-option-wrap {display: flex; align-items: center; gap: 10px; min-height: 72px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px)); border: 0; border-top: 1px solid var(--trp-line); border-radius: 0; background-color: var(--trp-paper); box-shadow: var(--trp-float);}
    body.trp-dsg .side-menu .tour-option-wrap .option-list {flex: 0 0 auto; position: static;}
    body.trp-dsg .side-menu .tour-option-wrap .option-top {display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-width: 56px; min-height: 52px; padding: 4px 6px;
        border: 1px solid var(--trp-line); border-radius: var(--trp-radius); box-shadow: none; background: #FFFFFF;}
    body.trp-dsg .side-menu .tour-option-wrap .option-top .ico-option {margin: 0; width: 20px; height: 20px;}
    body.trp-dsg .side-menu .tour-option-wrap .option-top p.tour-option {font-size: 12px; line-height: 1.2; font-weight: 700; letter-spacing: .06em; color: var(--trp-brand-ink); white-space: nowrap;}
    body.trp-dsg .side-menu .tour-option-wrap .option-top .option-toggle {position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0);}
    body.trp-dsg .side-menu .tour-option-wrap .option-list ul {position: absolute; left: 0; right: 0; bottom: 100%; max-height: 60vh; overflow-y: auto; margin: 0; padding: 4px 16px 8px; background: #FFFFFF;
        border-top: 3px solid var(--trp-brand); border-radius: 0; box-shadow: 0 -10px 24px -16px rgba(32,32,30,.40);}
    body.trp-dsg .side-menu .tour-option-wrap .option-total-wrap {flex: 1 1 auto; min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0; padding: 0; border: 0;}
    body.trp-dsg .side-menu .tour-option-wrap .option-total {flex: 1 1 auto; min-width: 0; width: auto;}
    body.trp-dsg .side-menu .tour-option-wrap .option-total-top {margin: 0; max-width: none; flex-direction: row; justify-content: flex-start;}
    body.trp-dsg .side-menu .tour-option-wrap .option-total .total-price {font-size: 20px; line-height: 1.2;}
    body.trp-dsg .side-menu .tour-option-wrap .option-total-bottom.mo-ver {display: flex; align-items: center; min-height: 44px; margin: -12px 0; padding: 0; font-size: 14px; line-height: 1.3; font-weight: 500; color: var(--trp-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
    body.trp-dsg .side-menu .tour-option-wrap .reserve-btn {flex: 0 0 auto; width: auto; min-width: 120px; max-width: none; height: 52px; padding: 0 18px; font-size: 14px;}
    body.trp-dsg .side-menu .tour-option-wrap .reserve-btn.inactive {background-color: #FFFFFF; color: var(--trp-brand-ink); border: 1px solid var(--trp-brand);}
    body.trp-dsg .side-menu .tour-option-wrap .reserve-btn.inactive[onclick^="fnLoginWall"] {background-color: var(--trp-brand); color: #FFFFFF; border-color: var(--trp-brand);}
    /* 모바일 예약 바: +/− 는 그림 30px 그대로, 누르는 영역만 44px / 상품 페이지 푸터 끝 문구가 고정 바에 가리지 않게 바 높이만큼 여백 */
    body.trp-dsg .side-menu .option-num-wrap .ico {width: 44px; height: 44px; margin: -7px; background-size: 30px 30px;}
    body.trp-dsg:has(.side-menu .tour-option-wrap) footer.trp-ft {padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));}
    /* 바가 본문 끝을 가리지 않도록 */
    body.trp-dsg #dailyTourView {padding-bottom: 72px;}
}
@media screen and (max-width: 768px) {
    /* 레거시 모바일은 제목 블록을 세로·오른쪽 정렬 → 아이브로·제목·더보기를 왼쪽 정렬 한 흐름으로 */
    body.trp-dsg .sub-main .sub-main-tit-wrap {flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 8px 16px;}
    body.trp-dsg .sub-main-tit-wrap .sub-main-tit {width: auto; height: auto; margin-bottom: 0; font-size: 28px;}
    body.trp-dsg .sub-main.main1 {margin-top: 96px;}   /* 헤더 60 + 여백 36 */
    body.trp-dsg a.trp-pcard .sub-li-cont {display: -webkit-box; margin: 2px 0 0; font-size: 14px;}
    body.trp-dsg .sub-main-wrap ul.trp-pcards {grid-template-columns: minmax(0, 1fr); gap: 36px;}
    /* 모바일에서 숨기던 배지·소요시간·태그를 노출 (모바일 display:none 금지) */
    body.trp-dsg a.trp-pcard .sub-li-tag.top, body.trp-dsg a.trp-pcard .trp-pcard-meta {display: flex;}
    body.trp-dsg a.trp-pcard .trp-pcard-meta {display: block;}
    body.trp-dsg a.trp-pcard .sub-li-img {padding-bottom: 75%;}
    body.trp-dsg a.trp-pcard .sub-li-tit {font-size: 20px;}
    body.trp-dsg .sub-main.main2 .custom-tit, body.trp-dsg .sub-main.main2 .custom-tit2 {font-size: 32px;}
    body.trp-dsg .contact-wrap {padding: 36px 16px;}
    body.trp-dsg .contact-wrap .contact-tit {font-size: 28px;}
    body.trp-dsg .sub-main.main2 .custom-wrap a.custom, body.trp-dsg .contact-wrap .contact-us a, body.trp-dsg .sub-r .about-us a {min-height: 52px;}
    body.trp-dsg .sub-tit-wrap h1.sub-tit {font-size: 36px;}
    body.trp-dsg .sub-tit-wrap .sub-cont {font-size: 16px;}
    body.trp-dsg .best-tour-wrap_ .bt-txt {font-size: 26px;}
    body.trp-dsg .info-wrap .info-tit {font-size: 26px; line-height: 1.2;}
    body.trp-dsg .trp-facts {flex-wrap: wrap; margin-top: 16px;}
    body.trp-dsg .trp-facts > div {flex: 1 1 48%; padding: 10px 12px 10px 0;}
    body.trp-dsg .trp-facts > div + div {border-left: 0; padding-left: 0;}
    body.trp-dsg .trp-facts > div:nth-child(odd) {border-right: 1px solid var(--trp-line); padding-right: 12px;}
    body.trp-dsg .trp-facts > div:nth-child(even) {padding-left: 12px;}
    body.trp-dsg .trp-facts > div:nth-child(n+3) {border-top: 1px solid var(--trp-line);}
    body.trp-dsg .trp-facts > div:nth-child(odd):last-child {border-right: 0;}
    body.trp-dsg .side-menu .tour-option-wrap .reserve-btn {min-width: 112px; padding: 0 14px;}
}
@media screen and (max-width: 360px) {
    body.trp-dsg .side-menu .tour-option-wrap {gap: 8px; padding-left: 12px; padding-right: 12px;}
    body.trp-dsg .side-menu .tour-option-wrap .option-top {min-width: 48px;}
    body.trp-dsg .side-menu .tour-option-wrap .reserve-btn {min-width: 96px; padding: 0 10px;}
}
/* 태블릿(560~768): 카드 2열 — 1열 736px 카드는 너무 크고 라이브도 2열 (병합 실측 D1, 2026-10-09) */
@media screen and (min-width: 560px) and (max-width: 768px) {
    body.trp-dsg .sub-main-wrap ul.trp-pcards {grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 20px;}
}