/* ================================================================
   런트립 메인 — 하나투어 골격 / 밝은 여행 톤
   전부 .rt-main 안으로 스코프. 검정 배경 쓰지 않는다.
   ================================================================ */
.rt-main {
  --rt-sky:  #f4f4f4;
  --rt-peach:#f4f4f4;
  --rt-lilac:#f4f4f4;
  --rt-mint: #f4f4f4;
  --rt-soft: #f4f4f4;
  --rt-warm: #f4f4f4;
  --rt-ink:  #000000;
  --rt-ink2: #333333;
  --rt-mute: #333333;
  --rt-line: #000000;
  --rt-brand:#000000;
  --rt-brand-d:#333333;
  --rt-accent:#000000;
  color: var(--rt-ink);
  background:#ffffff;
}

/* 화면 끝까지 — 테마 박스를 벗어난다 (런트립 안에서만)
   실제 폭은 JS 가 documentElement.clientWidth 로 정확히 맞춘다(세로 스크롤바 폭 제외).
   아래는 JS 가 못 돌 때의 대비값. */
.rt-full {
  width: calc(100vw - var(--rt-sb, 0px));
  max-width: none;
  margin-left: calc(50% - 50vw + var(--rt-sb, 0px) / 2);
  margin-right: calc(50% - 50vw + var(--rt-sb, 0px) / 2);
  overflow-x: clip;
}
/* 🔑 하나투어 규칙 — 콘텐츠 축은 «1200px 중앙정렬» 하나뿐이다.
   하나투어 실측 : 뷰포트 1506 에서 「전체메뉴」 글자 left = 153 = (1506−1200)/2.
   runin.kr 상단 메뉴(ul)도 width 1200 중앙정렬이라 left 가 똑같이 153 이다.
   그래서 이 한 줄이면 GNB·히어로·카드·상세가 전부 상단 메뉴와 세로선이 맞는다.
   배경 띠만 화면 끝까지 나가고, «글자와 카드는 반드시 이 축 위에» 놓인다. */
.rt-inner {
  width: 1200px;
  max-width: calc(100% - 40px);
  margin: 0 auto;
  padding: 0;
}

/* ---------------- ① GNB ---------------- */
.rt-gnb {
  border-top: 1px solid var(--rt-line);
  border-bottom: 1px solid var(--rt-line);
  background:#ffffff; position: relative; z-index: 5;
}
.rt-gnb__in { display: flex; align-items: stretch; gap: 16px; height: 60px; }
/* 「전체 대회」 글자가 상단 사이트 메뉴 첫 글자와 정확히 같은 세로선에서 시작하도록
   왼쪽 안쪽 여백을 0 으로 둔다. 하나투어의 「전체메뉴」도 컨테이너 왼쪽 끝에 붙어 있다. */
.rt-gnb__all {
  display: inline-flex; align-items: center; gap: 9px; flex: 0 0 auto;
  padding: 0 20px 0 0; margin-right: 8px; border: 0; cursor: pointer;
  background: none; color: var(--rt-ink); font-size: 14px; font-weight: 800;
  border-radius: 0; border-right: 1px solid var(--rt-line);
}
.rt-gnb__all:hover { color: var(--rt-brand); }
.rt-gnb__bars { display: grid; gap: 3px; }
.rt-gnb__bars i { display: block; width: 16px; height: 2px; background: currentColor; border-radius:0; }
.rt-gnb__list {
  display: flex; align-items: stretch; gap: 2px; list-style: none; margin: 0; padding: 0;
  flex: 1 1 auto; overflow-x: auto; scrollbar-width: none;
}
.rt-gnb__list::-webkit-scrollbar { display: none; }
/* 상단 사이트 메뉴가 14px 다. 그보다 커 보이면 아래위가 따로 논다 — 같은 14px 로 맞춘다. */
.rt-gnb__i {
  height: 100%; padding: 0 14px; border: 0; background: none; cursor: pointer;
  font-size: 14px; font-weight: 600; color: var(--rt-ink2); white-space: nowrap;
  border-bottom: 3px solid transparent;
}
.rt-gnb__list > li:first-child .rt-gnb__i { padding-left: 0; }
.rt-gnb__i:hover { color: var(--rt-brand); }
.rt-gnb__i.is-on { color: var(--rt-brand-d); border-bottom-color: var(--rt-brand); font-weight: 800; }
.rt-gnb__i b { font-size: 12px; font-weight: 700; color: var(--rt-accent); margin-left: 3px; }
.rt-gnb__right { display: flex; align-items: center; gap: 18px; flex: 0 0 auto; }
.rt-gnb__right a { font-size: 13.5px; color: var(--rt-mute); }
.rt-gnb__right a:hover { color: var(--rt-brand); }

.rt-mega {
  position: absolute; left: 0; right: 0; top: 100%; background:#ffffff;
  border-bottom: 1px solid var(--rt-line); box-shadow:none;
  padding: 26px 0 30px;
}
.rt-mega__in { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }
.rt-mega__col h3 { font-size: 14.5px; font-weight: 800; margin: 0 0 10px; padding-bottom: 8px; border-bottom: 2px solid var(--rt-ink); }
.rt-mega__col h3 span { color: var(--rt-accent); font-size: 12px; margin-left: 4px; }
.rt-mega__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.rt-mega__col a { font-size: 13px; color: var(--rt-ink2); }
.rt-mega__col a:hover { color: var(--rt-brand); text-decoration: underline; }

/* ---------------- ② 히어로 (밝은 파스텔 띠) ---------------- */
.rt-hero2 {
  background:
    radial-gradient(1100px 460px at 12% 8%, #fff4ea 0%, rgba(255,244,234,0) 62%),
    radial-gradient(1000px 520px at 88% 92%, #e6f2ff 0%, rgba(230,242,255,0) 60%),
    linear-gradient(115deg, #fff6f0 0%, #f4f1ff 46%, #e9f4ff 100%);
  padding: 34px 0 42px;
}
/* 1200 축 안 : 검색패널 360 + 간격 24 + 슬라이더 816 (≈16:9) */
.rt-hero2__in { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 24px; align-items: stretch; }

/* 검색 패널 */
.rt-panel {
  background:#ffffff; border-radius:0; padding: 26px 24px 22px;
  box-shadow:none; display: flex; flex-direction: column;
}
.rt-panel__hi { margin: 0; font-size: 15px; color: var(--rt-mute); }
.rt-panel__q { margin: 2px 0 18px; font-size: 23px; font-weight: 800; letter-spacing: -.03em; line-height: 1.3; }
.rt-panel__tabs { display: flex; gap: 18px; border-bottom: 1px solid var(--rt-line); margin-bottom: 18px; }
.rt-panel__tab {
  border: 0; background: none; cursor: pointer; padding: 0 0 10px; font-size: 15px;
  font-weight: 600; color: var(--rt-mute); border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.rt-panel__tab.is-on { color: var(--rt-ink); font-weight: 800; border-bottom-color: var(--rt-ink); }
.rt-panel__body { display: grid; gap: 9px; }
.rt-field {
  display: flex; align-items: center; gap: 10px; height: 52px; padding: 0 14px;
  border: 1px solid var(--rt-line); border-radius:0; background:#f4f4f4;
}
.rt-field:focus-within { border-color: var(--rt-brand); background:#ffffff; }
.rt-field__ico { font-size: 15px; opacity: .75; }
.rt-field input, .rt-field select {
  flex: 1; border: 0; background: none; font-size: 14.5px; color: var(--rt-ink);
  height: 100%; outline: none; min-width: 0;
}
.rt-panel__only { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--rt-ink2); margin: 4px 0 2px; }
/* 런닝인사이드 브랜드 청색. 주황은 D-데이·강조 숫자에만 남긴다. */
.rt-panel__go {
  height: 54px; border: 0; border-radius:0; cursor: pointer; font-size: 16px; font-weight: 800;
  background: var(--rt-brand); color:#ffffff; letter-spacing: -.01em;
  box-shadow:none;
}
.rt-panel__go:hover { background: var(--rt-brand-d); }
.rt-panel__reset { border: 0; background: none; cursor: pointer; font-size: 13px; color: var(--rt-mute); text-decoration: underline; padding: 4px; }
.rt-panel__tally { margin: 14px 0 0; font-size: 12.5px; color: var(--rt-mute); }
.rt-panel__tally strong { color: var(--rt-ink); font-weight: 800; }

/* 대형 슬라이더 */
.rt-slider { position: relative; border-radius:0; overflow: hidden; min-height: 460px; background:#f4f4f4; box-shadow:none; }
.rt-slider__track { position: absolute; inset: 0; }
.rt-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .45s ease; display: block; }
.rt-slide.is-on { opacity: 1; }
.rt-slide img { width: 100%; height: 100%; object-fit: cover; }

/* 500px 원본밖에 없는 대회 : 늘리면 뿌옇다.
   뒤에 흐린 확대본을 깔고 원본은 세로에 맞춰 가운데 둔다. */
.rt-slide__bg {
  position: absolute; inset: -40px;
  background-size: cover; background-position: center;
  filter: blur(30px) saturate(1.15) brightness(.92);
  transform: scale(1.12);
}
.rt-slide--sm img {
  position: relative; width: auto; max-width: 100%;
  margin: 0 auto; object-fit: contain;
  box-shadow:none;
}
.rt-slide__scrim {
  position: absolute; inset: 0;background:linear-gradient(90deg,rgba(0,0,0,.86) 0%,rgba(0,0,0,.70) 50%,rgba(0,0,0,.30) 85%),linear-gradient(0deg,rgba(0,0,0,.80) 0%,rgba(0,0,0,.60) 55%,rgba(0,0,0,.15) 80%,rgba(0,0,0,0) 95%);
}
.rt-slide__cap { position: absolute; left: 44px; bottom: 46px; right: 44px; color:#ffffff; display: block; }
.rt-slide__tag {
  display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 700;
  background: rgba(255,255,255,.2); border:1px solid #ffffff;
  padding: 6px 12px; border-radius:0; margin-bottom: 14px; backdrop-filter: blur(4px);
}
.rt-slide__tag em { font-style: normal; color:#ffffff; font-variant-numeric: tabular-nums; }
.rt-slide__name {
  display: block; font-size: 34px; font-weight: 800; line-height: 1.22; letter-spacing: -.03em;
  margin-bottom: 8px; text-shadow:none;
}
.rt-slide__sub { display: block; font-size: 15.5px; color:#ffffff; margin-bottom: 14px; }
.rt-slide__price .rt-price { color:#ffffff; font-size: 28px; }
.rt-slide__price .rt-price--none { color:#ffffff; }
.rt-slider__ui {
  position: absolute; right: 22px; bottom: 22px; display: flex; align-items: center; gap: 6px;
  background: rgba(255,255,255,.92); border-radius:0; padding: 6px 8px 6px 14px;
  box-shadow:none;
}
.rt-slider__no { font-size: 13px; color: var(--rt-ink2); font-variant-numeric: tabular-nums; margin-right: 4px; }
.rt-slider__no b { color: var(--rt-ink); font-weight: 800; }
.rt-slider__btn {
  width: 30px; height: 30px; border: 0; border-radius:0; background:#f4f4f4; cursor: pointer;
  font-size: 14px; line-height: 1; color: var(--rt-ink2);
}
.rt-slider__btn:hover { background: var(--rt-brand); color:#ffffff; }

/* ---------------- ③ 섹션 띠 ---------------- */
.rt-band { padding: 54px 0; background:#ffffff; }
.rt-band--soft { background: var(--rt-soft); }
.rt-band--hi   { background:linear-gradient(180deg, #ffffff 0%, #f4f4f4 100%); }
.rt-band--warm { background: var(--rt-warm); border-top: 1px solid var(--rt-line); }
.rt-bhead { margin-bottom: 24px; }
.rt-bhead--row { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.rt-btit { font-size: 27px; font-weight: 800; letter-spacing: -.03em; margin: 0 0 6px; }
.rt-btit span { color: var(--rt-accent); }
.rt-bsub { font-size: 14.5px; color: var(--rt-mute); margin: 0; }
.rt-tools { display: flex; align-items: center; gap: 12px; }
.rt-count { font-size: 14px; color: var(--rt-mute); font-variant-numeric: tabular-nums; }
.rt-tools select {
  height: 42px; border: 1px solid var(--rt-line); border-radius:0; padding: 0 12px;
  font-size: 14px; background:#ffffff; color: var(--rt-ink);
}

/* ---------------- 캘린더 ---------------- */
.rt-cal { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 8px; }
.rt-cal__m {
  flex: 0 0 112px; height: 148px; border: 1px solid var(--rt-line); border-radius:0;
  background:#ffffff; cursor: pointer; display: flex; flex-direction: column;
  align-items: center; justify-content: flex-end; padding: 12px 8px 10px; gap: 7px;
  color: var(--rt-ink2); transition: border-color .15s, background .15s, transform .15s;
}
.rt-cal__m:hover { border-color: var(--rt-brand); transform: translateY(-2px); }
.rt-cal__m.is-on { border-color: var(--rt-brand); background:#f4f4f4; color: var(--rt-brand-d); }
.rt-cal__m.is-dead { opacity: .5; cursor: not-allowed; }
.rt-cal__lab { font-size: 14px; font-weight: 800; }

/* 막대를 입체로 — 원기둥처럼 : 좌우 명암 + 윗면 하이라이트 + 바닥 그림자 */
.rt-cal__bar {
  position: relative; width: 34px; min-height: 6px;
  border-radius:0;
  background:
    linear-gradient(90deg,
      rgba(0,0,0,.16) 0%, rgba(255,255,255,.42) 22%,
      rgba(255,255,255,.10) 52%, rgba(0,0,0,.20) 100%),
    linear-gradient(180deg, #8fc4ff 0%, #3d92ff 38%, #0b6cf0 78%, #0a5ccc 100%);
  box-shadow:none;
}
/* 윗면 타원 — 원기둥 뚜껑 */
.rt-cal__bar::before {
  content: ''; position: absolute; left: 1px; right: 1px; top: -3px; height: 7px;
  border-radius:0;
  background:linear-gradient(180deg, #f4f4f4 0%, #f4f4f4 100%);
  box-shadow:none;
}
/* 바닥 접지 그림자 */
.rt-cal__bar::after {
  content: ''; position: absolute; left: -5px; right: -5px; bottom: -6px; height: 7px;
  border-radius:0; background: rgba(16,32,64,.16); filter: blur(3px);
}
.rt-cal__m.is-dead .rt-cal__bar {
  background:
    linear-gradient(90deg, rgba(0,0,0,.12) 0%, rgba(255,255,255,.45) 22%,
      rgba(255,255,255,.10) 52%, rgba(0,0,0,.14) 100%),
    linear-gradient(180deg, #dfe4ea 0%, #c2c9d3 60%, #aeb6c2 100%);
  box-shadow:none;
}
.rt-cal__m.is-dead .rt-cal__bar::before { background:linear-gradient(180deg,#f4f4f4 0%, #f4f4f4 100%); }
.rt-cal__m.is-on .rt-cal__bar {
  background:
    linear-gradient(90deg, rgba(0,0,0,.16) 0%, rgba(255,255,255,.45) 22%,
      rgba(255,255,255,.10) 52%, rgba(0,0,0,.20) 100%),
    linear-gradient(180deg, #ffbf9a 0%, #ff8a52 40%, #ff5c2e 80%, #e8471a 100%);
  box-shadow:none;
}
.rt-cal__m.is-on .rt-cal__bar::before { background:linear-gradient(180deg,#f4f4f4 0%, #f4f4f4 100%); }
.rt-cal__n { font-size: 12px; color: var(--rt-mute); font-variant-numeric: tabular-nums; }

/* ---------------- 카드 ---------------- */
.rt-grid { display: grid; gap: 26px; }
.rt-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.rt-rail {
  display: grid; grid-auto-flow: column; grid-auto-columns: 300px; gap: 20px;
  overflow-x: auto; padding-bottom: 10px; scroll-snap-type: x proximity;
}
.rt-rail .rt-card { scroll-snap-align: start; }

.rt-card[hidden] { display: none !important; }
.rt-card {
  display: flex; flex-direction: column; background:#ffffff; border-radius:0;
  overflow: hidden; transition: transform .2s, box-shadow .2s;
}
.rt-card:hover { transform: translateY(-4px); box-shadow:none; }
.rt-card--closed .rt-card__thumb img { filter: grayscale(100%); opacity: .68; }
.rt-card__thumb {
  position: relative; display: block; aspect-ratio: 4 / 3; border-radius:0;
  overflow: hidden; background:#f4f4f4;
}
.rt-card__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s; }
.rt-card:hover .rt-card__thumb img { transform: scale(1.05); }
.rt-card__thumb .rt-badge {
  position: absolute; left: 12px; top: 12px; margin: 0;
  background: rgba(255,255,255,.95); border: 0; padding: 7px 11px; font-size: 12px;
  box-shadow:none;
}
.rt-card__body { display: flex; flex-direction: column; flex: 1; padding: 14px 4px 4px; gap: 6px; }
.rt-card__meta { display: flex; gap: 9px; font-size: 12.5px; color: var(--rt-mute); }
.rt-card__country { font-weight: 800; color: var(--rt-brand-d); }
.rt-card__date { font-variant-numeric: tabular-nums; }
.rt-card__name { font-size: 17px; font-weight: 700; line-height: 1.42; letter-spacing: -.02em; }
.rt-card__sub { font-size: 13.5px; color: var(--rt-ink2); line-height: 1.5; }
.rt-card__events { font-size: 12.5px; color: var(--rt-mute); }
.rt-card__foot { margin-top: auto; padding-top: 12px; display: flex; align-items: baseline; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.rt-card__foot .rt-price { font-size: 22px; }
.rt-card__foot .rt-price--none { font-size: 15px; }
.rt-card__seller { font-size: 11px; color: var(--rt-mute); }
.rt-card--sm .rt-card__name { font-size: 15px; }
.rt-card--sm .rt-card__sub { display: none; }

.rt-empty { text-align: center; padding: 56px 20px; color: var(--rt-mute); font-size: 15px; }
.rt-link { background: none; border: 0; color: var(--rt-brand); font: inherit; cursor: pointer; text-decoration: underline; }

/* ---------------- 지역 ---------------- */
.rt-areas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.rt-area {
  position: relative; border: 0; padding: 0; cursor: pointer; border-radius:0;
  overflow: hidden; height: 210px; display: block; text-align: left; background:#f4f4f4;
  transition: transform .2s, box-shadow .2s;
}
.rt-area:hover { transform: translateY(-4px); box-shadow:none; }
.rt-area__img { position: absolute; inset: 0; }
.rt-area__img img { width: 100%; height: 100%; object-fit: cover; }
.rt-area__ov { position: absolute; inset: 0;background:linear-gradient(0deg,rgba(0,0,0,.90) 0%,rgba(0,0,0,.86) 50%,rgba(0,0,0,.30) 72%,rgba(0,0,0,0) 92%); }
.rt-area__txt { position: absolute; left: 20px; right: 20px; bottom: 18px; color:#ffffff; display: block; }
.rt-area__txt strong { display: block; font-size: 18px; font-weight: 800; margin-bottom: 6px; letter-spacing: -.02em; }
.rt-area__txt span { font-size: 13px; color:#ffffff; }
.rt-area__txt b { color:#333333; }
.rt-area__txt b.is-zero { color:#333333; }

/* ---------------- 하단 ---------------- */
.rt-foot2 { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 40px; align-items: start; }
.rt-foot2 h2 { font-size: 20px; font-weight: 800; margin: 0 0 12px; }
.rt-foot2 p { font-size: 14px; color: var(--rt-ink2); line-height: 1.8; margin: 0 0 10px; }
.rt-foot2__note { font-size: 13px !important; color: var(--rt-mute) !important; }

/* ---------------- 반응형 ---------------- */
/* 축이 1200 고정이므로 1240 아래부터 폭이 줄기 시작한다. 그때부터 열을 줄인다. */
@media (max-width: 1080px) {
  .rt-grid--4 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rt-areas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1100px) {
  .rt-hero2__in { grid-template-columns: 1fr; }
  .rt-slider { min-height: 380px; }
  .rt-mega__in { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rt-foot2 { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 820px) {
  .rt-inner { padding: 0 16px; }
  .rt-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
  .rt-band { padding: 38px 0; }
  .rt-btit { font-size: 22px; }
  .rt-slide__name { font-size: 24px; }
  .rt-slide__cap { left: 22px; right: 22px; bottom: 30px; }
  .rt-slider { min-height: 320px; }
  .rt-gnb__in { gap: 10px; }
  .rt-gnb__right { display: none; }
  .rt-area { height: 168px; }
  .rt-rail { grid-auto-columns: 240px; }
}
@media (max-width: 560px) {
  .rt-grid--4 { grid-template-columns: 1fr; }
  .rt-areas { grid-template-columns: 1fr; }
  .rt-panel { padding: 20px 18px 18px; }
  .rt-panel__q { font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .rt-slide, .rt-card, .rt-area, .rt-cal__m { transition: none !important; }
  .rt-card:hover .rt-card__thumb img { transform: none; }
}