/* ツアーの一覧（/self-tours・/model-courses・/courses、指示書 05）。parts.css の後に読む。
   セルフツアーのカードは3ページとも同じ形（PC 3列で写真が上、タブレットは横並び、スマホは小さな写真と文の横並び）。
   プライベートツアーは蒼の面に、写真と文を 1.414 : 1 で交互に並べる（TOP のプライベートツアーの帯と同じ扱い） */

.tour-list.silver main {
  --tl-band-soft: color-mix(in srgb, var(--ds-band-text) 78%, transparent);
  --tl-band-line: color-mix(in srgb, var(--ds-band-text) 28%, transparent);
}

/* ---------- セルフツアーの要点3つ（一覧の上） ---------- */
.tour-list.silver main > .explainer--casual { margin: var(--s-4) auto 0; padding: 0; border: 0; border-radius: 0; background: none; }
.tour-list.silver main > .explainer--casual > h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.tour-list.silver main > .explainer--casual ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-0) var(--s-4); margin: 0; padding: 0; list-style: none; }
.tour-list.silver main > .explainer--casual li { display: grid; align-content: start; gap: var(--s-n4); }
.tour-list.silver main > .explainer--casual strong { font-size: var(--s-0); line-height: var(--lh-head); }
.tour-list.silver main > .explainer--casual span { font-size: var(--s-n1); line-height: var(--lh-body); color: var(--ds-muted); }

/* ---------- セルフツアーのカード ---------- */
.tour-list.silver main .tour-group .card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-4) var(--s-1); margin: 0; }
.tour-list.silver main .tour-group .card--tour { min-width: 0; }
.tour-list.silver main .card--tour .card__ref { padding-top: var(--s-n2); margin-top: var(--s-n2); border-top: 1px solid var(--ds-rule); }
@media (min-width: 1024px) {
  /* 名前の行数がちがっても、要点・金額・ボタンの高さを3枚でそろえる */
  .tour-list.silver main .tour-group .card--tour { display: grid; grid-row: span 5; grid-template-rows: subgrid; grid-template-columns: minmax(0, 1fr); row-gap: 0; }
  .tour-list.silver main .tour-group .card--tour .card__link { display: contents; }
  .tour-list.silver main .tour-group .card--tour > *, .tour-list.silver main .tour-group .card--tour .card__link > * { grid-column: 1; grid-row: auto; }
  .tour-list.silver main .tour-group .card--tour .media { margin: 0 0 var(--s-0); }
  .tour-list.silver main .tour-group .card--tour .card__title { margin: 0 0 var(--s-n4); font-size: var(--s-1); }
  .tour-list.silver main .tour-group .card--tour .card__act { align-self: stretch; margin-top: auto; padding-top: var(--s-1); }
}
@media (max-width: 1023px) {
  .tour-list.silver main .tour-group .card-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 559px) {
  .tour-list.silver main .tour-group .card-grid { gap: var(--s-1); }
  .tour-list.silver main .tour-group .card--tour { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.414fr); grid-template-rows: auto auto 1fr; gap: 0 var(--s-n2); padding-bottom: var(--s-1); border-bottom: 1px solid var(--ds-rule); }
  .tour-list.silver main .tour-group .card--tour .card__link { display: contents; }
  .tour-list.silver main .tour-group .card--tour .media { grid-column: 1; grid-row: 1 / span 3; margin: 0; }
  .tour-list.silver main .tour-group .card--tour .card__title { margin: 0 0 var(--s-n4); }
  .tour-list.silver main .tour-group .card--tour .card__ref { padding-top: 0; margin-top: var(--s-n4); border-top: 0; }
  .tour-list.silver main .tour-group .card--tour .card__act { grid-column: 1 / -1; padding-top: var(--s-0); }
}

/* ---------- 1泊2日：1日目・泊まる・2日目を1本の流れに ---------- */
.tour-list.silver main .overnight-plan { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; column-gap: var(--s-4); margin-top: var(--s-6); }
.tour-list.silver main .section__title + .overnight-plan { margin-top: 0; }
.tour-list.silver main .overnight-plan > .overnight__title { grid-column: 1; margin: 0; font-size: var(--ds-h3); }
.tour-list.silver main .overnight-plan > p { grid-column: 2; grid-row: 1; margin: 0; }
.tour-list.silver main .overnight { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .707fr) minmax(0, 1fr); gap: 0; margin: var(--s-1) 0 0; padding: 0; list-style: none; }
.tour-list.silver main .overnight > li { position: relative; min-width: 0; padding: var(--s-1) var(--s-0) 0; border: 0; border-top: 1px solid var(--ds-sumi); border-radius: 0; background: none; }
.tour-list.silver main .overnight > li:first-child { padding-left: 0; }
.tour-list.silver main .overnight > li:last-child { padding-right: 0; }
.tour-list.silver main .overnight > li::before { content: ""; position: absolute; top: -5px; left: 0; width: 9px; height: 9px; box-sizing: border-box; border: 1px solid var(--ds-sumi); border-radius: 50%; background: var(--ds-sumi); }
.tour-list.silver main .overnight > li:not(:first-child)::before { left: var(--s-0); }
.tour-list.silver main .overnight > .overnight__night::before { background: var(--semantic-color-surface-default); }
.tour-list.silver main .overnight__no { margin: 0 0 var(--s-n2); font-size: var(--s-n1); font-weight: 700; line-height: var(--lh-head); letter-spacing: .04em; }
.tour-list.silver main .overnight__day > a { display: block; color: inherit; text-decoration: none; }
.tour-list.silver main .overnight__day .media { aspect-ratio: 1.414 / 1; margin: 0 0 var(--s-n2); }
.tour-list.silver main .overnight__day h3 { margin: 0; font-size: var(--s-0); line-height: var(--lh-head); letter-spacing: .04em; }
.tour-list.silver main .overnight__day > a:hover h3 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em; }
.tour-list.silver main .overnight__day > a:focus-visible { outline: none; }
.tour-list.silver main .overnight__day > a:focus-visible h3 { outline: 2px solid var(--semantic-color-focus-default); outline-offset: 2px; }
.tour-list.silver main .overnight__meta { margin: var(--s-n4) 0 0; font-size: var(--s-n1); color: var(--ds-muted); }
.tour-list.silver main .overnight__inns { display: grid; gap: var(--s-n2); margin: 0 0 var(--s-0); padding: 0; list-style: none; }
.tour-list.silver main .overnight__inns a { color: var(--ds-sumi); font-weight: 700; text-decoration-thickness: 1px; text-underline-offset: .25em; }
.tour-list.silver main .overnight__area { display: block; font-size: var(--s-n2); color: var(--ds-muted); }
.tour-list.silver main .overnight__night > p { margin: 0; }
.tour-list.silver main .section--overnight > .note { margin: var(--s-1) 0 0; }
@media (max-width: 1023px) {
  .tour-list.silver main .overnight-plan { grid-template-columns: minmax(0, 1fr); margin-top: var(--s-6); }
  .tour-list.silver main .overnight-plan > p { grid-column: 1; grid-row: 3; margin-top: var(--s-n2); }
  .tour-list.silver main .overnight-plan > p .btn { width: 100%; }
  .tour-list.silver main .overnight { grid-template-columns: minmax(0, 1fr); margin-top: var(--s-0); }
  .tour-list.silver main .overnight > li, .tour-list.silver main .overnight > li:first-child, .tour-list.silver main .overnight > li:last-child { padding: 0 0 var(--s-1) var(--s-1); border-top: 0; border-left: 1px solid var(--ds-sumi); }
  .tour-list.silver main .overnight > li:last-child { padding-bottom: 0; border-left-color: transparent; }
  .tour-list.silver main .overnight > li::before, .tour-list.silver main .overnight > li:not(:first-child)::before { top: 0; left: -5px; }
  .tour-list.silver main .overnight__no { margin-top: -4px; }
  .tour-list.silver main .overnight__day { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.414fr); grid-template-rows: auto auto 1fr; column-gap: var(--s-n2); }
  .tour-list.silver main .overnight__day > .overnight__no { grid-column: 1 / -1; }
  .tour-list.silver main .overnight__day > a { display: contents; }
  .tour-list.silver main .overnight__day .media { grid-column: 1; grid-row: 2 / span 2; margin: 0; }
  .tour-list.silver main .overnight__day h3, .tour-list.silver main .overnight__meta { grid-column: 2; }
}

/* ---------- 写真の区切り ---------- */
.tour-list.silver main > .tour-list__image { aspect-ratio: 21 / 9; margin: var(--ds-sec) auto 0; }
@media (max-width: 767px) { .tour-list.silver main > .tour-list__image { aspect-ratio: 1.414 / 1; } }

/* ---------- プライベートツアー：蒼の面に、写真と文を 1.414 : 1 で交互に ---------- */
.tour-list.silver main .course-stage { margin: var(--s-4) auto 0; padding: var(--s-6); border-radius: 4px; background: var(--ds-band); color: var(--ds-band-text); }
.tour-list.silver main .course-stage > .card { margin: 0; padding: 0; border: 0; border-radius: 0; background: none; color: inherit; box-shadow: none; }
.tour-list.silver main .course-stage > .card + .card { margin-top: var(--s-6); padding-top: var(--s-6); border-top: 1px solid var(--tl-band-line); }
.tour-list.silver main .course-stage .card__link { display: grid; grid-template-columns: minmax(0, 1.414fr) minmax(0, 1fr); grid-template-rows: 1fr repeat(4, auto) 1fr; column-gap: var(--s-4); color: inherit; text-decoration: none; }
.tour-list.silver main .course-stage .card:nth-child(even) .card__link { grid-template-columns: minmax(0, 1fr) minmax(0, 1.414fr); }
.tour-list.silver main .course-stage .media { grid-column: 1; grid-row: 1 / -1; aspect-ratio: 1.414 / 1; margin: 0; }
.tour-list.silver main .course-stage .card__link > :not(.media) { grid-column: 2; }
.tour-list.silver main .course-stage .card:nth-child(even) .media { grid-column: 2; }
.tour-list.silver main .course-stage .card:nth-child(even) .card__link > :not(.media) { grid-column: 1; }
.tour-list.silver main .course-stage .card__title { grid-row: 2; margin: 0; padding: 0; border: 0; font-size: var(--ds-h2); line-height: var(--lh-head); letter-spacing: .04em; color: inherit; text-decoration: none; }
.tour-list.silver main .course-stage .card__link:hover .card__title { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
.tour-list.silver main .course-stage .card__link:focus-visible { outline: none; }
.tour-list.silver main .course-stage .card__link:focus-visible .card__title { outline: 2px solid var(--ds-band-text); outline-offset: 4px; }
.tour-list.silver main .course-stage .card__price { grid-row: 3; margin: var(--s-0) 0 0; font-size: var(--s-2); font-weight: 700; line-height: var(--lh-head); }
.tour-list.silver main .course-stage .card__price .price { font-size: inherit; color: inherit; }
.tour-list.silver main .course-stage .card__price .price__note { display: inline; font-size: var(--s-n1); font-weight: 400; color: var(--tl-band-soft); }
.tour-list.silver main .course-stage .card__incl { grid-row: 4; margin: var(--s-n2) 0 0; padding: 0; border: 0; font-size: var(--s-0); line-height: var(--lh-body); color: inherit; }
.tour-list.silver main .course-stage .card__facts { grid-row: 5; display: grid; gap: var(--s-n4); margin: var(--s-1) 0 0; padding: var(--s-0) 0 0; border: 0; border-top: 1px solid var(--tl-band-line); }
.tour-list.silver main .course-stage .card__facts > div { display: grid; grid-template-columns: 7em minmax(0, 1fr); column-gap: var(--s-0); align-items: baseline; padding: 0; border: 0; }
.tour-list.silver main .course-stage .card__facts dt { font-weight: 400; color: var(--tl-band-soft); }
.tour-list.silver main .course-stage .card__facts .tag--unknown { color: var(--tl-band-soft); }
.tour-list.silver main .course-stage .card__facts dd { margin: 0; color: var(--ds-band-text); font-size: var(--s-0); line-height: var(--lh-body); }
@media (max-width: 899px) {
  .tour-list.silver main .course-stage { padding: var(--s-4) var(--s-0); }
  .tour-list.silver main .course-stage .card__link, .tour-list.silver main .course-stage .card:nth-child(even) .card__link { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
  .tour-list.silver main .course-stage .media, .tour-list.silver main .course-stage .card__link > :not(.media), .tour-list.silver main .course-stage .card:nth-child(even) .media, .tour-list.silver main .course-stage .card:nth-child(even) .card__link > :not(.media) { grid-column: 1; grid-row: auto; }
  .tour-list.silver main .course-stage .media { margin-bottom: var(--s-1); }
  .tour-list.silver main .course-stage > .card + .card { margin-top: var(--s-4); padding-top: var(--s-4); }
}
@media (max-width: 767px) {
  .tour-list.silver main .course-stage { width: 100%; border-radius: 0; padding-inline: var(--gutter, 16px); }
}

/* ---------- 「プライベートツアーとは」：本文 18px の要点の並び ---------- */
.tour-list.silver main > .explainer--premium { margin: var(--ds-sec) auto 0; padding: 0; border: 0; border-radius: 0; background: none; color: var(--ds-sumi); }
.tour-list.silver main > .explainer--premium > h2 { margin: 0 0 var(--s-4); padding: var(--s-0) 0 0; border-top: 1px solid var(--ds-sumi); font-size: var(--ds-h2); line-height: var(--lh-head); letter-spacing: .04em; }
.tour-list.silver main > .explainer--premium ul { display: block; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--ds-rule); }
.tour-list.silver main > .explainer--premium li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.414fr); column-gap: var(--s-4); padding: var(--s-1) 0; border-bottom: 1px solid var(--ds-rule); }
.tour-list.silver main > .explainer--premium strong { font-size: var(--s-0); line-height: var(--lh-body); }
.tour-list.silver main > .explainer--premium span { font-size: var(--s-0); line-height: var(--lh-body); color: var(--ds-sumi); }
.tour-list.silver main > .explainer--premium a { color: var(--ds-sumi); text-decoration-thickness: 1px; text-underline-offset: .25em; }
@media (max-width: 767px) {
  .tour-list.silver main > .explainer--premium li { grid-template-columns: minmax(0, 1fr); row-gap: var(--s-n4); padding: var(--s-0) 0; }
}

/* ---------- モデルコースのタブ（TOP の「旅の選び方」と同じ見た目）。タブの線が頭の区切りを兼ねる ---------- */
.tour-list.silver main .page-banner:has(+ .mc) .page-banner__text { padding-bottom: 0; border-bottom: 0; }
.tour-list.silver main .mc__tabs { max-width: none; margin: var(--s-4) 0 var(--s-1); }
.tour-list.silver main .mc .trip-tabs__btn { flex: 0 1 auto; min-width: 12em; min-height: 48px; padding: 0 var(--s-1); font-size: var(--s-0); color: var(--ds-muted); }
.tour-list.silver main .mc .trip-tabs__btn:hover { color: var(--ds-sumi); }
.tour-list.silver main .mc .trip-tabs__btn[aria-selected="true"] { color: var(--ds-sumi); border-bottom-color: var(--ds-sumi); }
.tour-list.silver main .mc__note { max-width: 40em; margin: 0; font-size: var(--s-0); line-height: var(--lh-body); color: var(--ds-muted); }
.tour-list.silver main .mc__note + .tour-group { margin-top: var(--s-6); }
.tour-list.silver main .mc__panel--private .course-stage { margin-top: var(--s-1); }
@media (max-width: 767px) {
  .tour-list.silver main .mc .trip-tabs__btn { flex: 1; min-width: 0; padding: 0; font-size: var(--s-n1); }
  .tour-list.silver main .mc__note + .tour-group { margin-top: var(--s-4); }
}

/* ---------- ページの最後の送り（3ページ同じ形） ---------- */
.tour-list.silver main .tour-next { margin: var(--ds-sec) auto 0; }
.tour-list.silver main .mc__panel .tour-next { width: auto; margin-top: var(--s-6); }
.tour-list.silver main .tour-next .links { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18em), 1fr)); column-gap: var(--s-4); border-top: 1px solid var(--ds-sumi); }
.tour-list.silver main .tour-next .links > li { display: flex; }
.tour-list.silver main .tour-next .links a { flex: 1; min-height: 72px; }
.tour-list.silver main .tour-next .links small { margin-bottom: 2px; }

@media (max-width: 767px) {
  .tour-list.silver main > .explainer--casual ul { grid-template-columns: minmax(0, 1fr); }
}