/* =============================================================
   プラン選択セクション（廉価版ツアー追加）
   style.css の末尾に追記してください
   ============================================================= */

/* ── セクション全体 ── */
.plan-select {
  padding: 60px 0 50px;
  background: #f8f6f2;
  border-top: 1px solid #e8e4de;
  margin-bottom: 60px;
}

.plan-select .inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 20px;
}

.plan-select h2 {
  text-align: center;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: .08em;
  color: #2b2b2b;
  margin: 0 0 10px;
}

.plan-select__lead {
  text-align: center;
  font-size: 14px;
  color: #666;
  line-height: 1.8;
  margin: 0 0 36px;
}

.plan-select__group {
  display: none;
}
.plan-select__group.is-active {
  display: block;
}
/* リードテキスト初期状態（JSが動く前は--multiを表示） */
.plan-select__lead--single {
  display: none;
}

/* JS読み込み前のフォールバック：dep1（東京発）を初期表示 */
.dep1-plan {
  display: block;
}

/* ── カードグリッド ── */
.plan-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  align-items: stretch;
}

/* 静岡発など1プランのみの場合は中央寄せ */
.plan-cards--single {
  grid-template-columns: minmax(0, 420px);
  justify-content: center;
}

/* ── カード共通 ── */
.plan-card {
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border: 1px solid #ddd;
  transition: box-shadow .2s;
}
.plan-card:hover {
  box-shadow: 0 4px 18px rgba(0,0,0,.09);
}

/* ── スタンダードカード ── */
.plan-card--standard .plan-card__head {
  background: #f0ede8;
  border-bottom: 1px solid #ddd;
}

/* ── エコノミーカード（強調） ── */
.plan-card--economy {
  border: 2px solid #c8833a;
}
.plan-card--economy .plan-card__head {
  background: #fdf4e8;
  border-bottom: 1px solid #e8c98a;
}

/* ── カードヘッド ── */
.plan-card__head {
  padding: 16px 18px 14px;
}

/* ── バッジ ── */
.plan-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  padding: 3px 9px;
  border-radius: 3px;
  margin-right: 4px;
  margin-bottom: 8px;
}
.plan-badge--standard {
  background: #e0dbd5;
  color: #5a5450;
}
.plan-badge--economy {
  background: #f5e0be;
  color: #8b5e1a;
}
.plan-badge--new {
  background: #c8833a;
  color: #fff;
}

.plan-card__name {
  font-size: 17px;
  font-weight: 700;
  color: #2b2b2b;
  margin: 0 0 6px;
  letter-spacing: .04em;
}

.plan-card__hotel {
  font-size: 13px;
  color: #555;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.plan-card__hotel i {
  color: #c8833a;
  font-size: 13px;
}
.plan-card__hotel-grade {
  display: inline-block;
  background: #ede9e4;
  color: #7a6e65;
  font-size: 11px;
  padding: 1px 7px;
  border-radius: 2px;
  margin-left: 2px;
}

/* ── カードボディ ── */
.plan-card__body {
  padding: 18px 18px 20px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* 料金 */
.plan-card__price-wrap {
  margin: 0 0 4px;
}
.plan-card__price-wrap dt {
  font-size: 11px;
  color: #888;
  letter-spacing: .06em;
  margin-bottom: 2px;
}
.plan-card__price-wrap dd {
  font-size: 26px;
  font-weight: 700;
  color: #2b2b2b;
  margin: 0;
  line-height: 1.2;
  letter-spacing: -.01em;
}
.plan-card__price-wrap dd .unit {
  font-size: 14px;
  font-weight: 400;
  color: #666;
}

.plan-card__price-note {
  font-size: 11px;
  color: #999;
  margin: 0 0 16px;
}

/* 特徴リスト */
.plan-card__features {
  list-style: none;
  padding: 0;
  margin: 0 0 18px;
  flex: 1;
}
.plan-card__features li {
  font-size: 13px;
  color: #444;
  padding: 5px 0 5px 22px;
  border-bottom: 1px dashed #eee;
  position: relative;
  line-height: 1.5;
}
.plan-card__features li:last-child {
  border-bottom: none;
}

/* ✓ 共通アイコン */
.plan-card__features li.ok::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: #4a9462;
  font-weight: 700;
  font-size: 14px;
}

/* − 差分アイコン（エコノミーのみ） */
.plan-card__features li.diff {
  color: #999;
}
.plan-card__features li.diff::before {
  content: "−";
  position: absolute;
  left: 0;
  color: #bbb;
  font-weight: 700;
  font-size: 16px;
  top: 3px;
}

/* ── 申込ボタン（plan-select セクション内のみ適用） ── */
.plan-select .button004 a {
  display: block;
  width: 100%;
  padding: 14px 20px;
  background: #2b2b2b;
  color: #fff !important;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .1em;
  border-radius: 4px;
  text-decoration: none;
  box-sizing: border-box;
  transition: background .2s;
  position: relative;
  border: none;
}
.plan-select .button004 a::after {
  content: "→";
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 16px;
}
.plan-select .button004 a:hover {
  background: #444;
  opacity: 1;
}

/* エコノミー専用（オレンジ） */
.plan-select .button004--economy a {
  background: #c8833a !important;
  border: none !important;
}
.plan-select .button004--economy a:hover {
  background: #a86a2c !important;
}

/* =============================================================
   レスポンシブ（スマホ：カードを縦並びに）
   ============================================================= */
@media screen and (max-width: 640px) {
  .plan-select {
    padding: 40px 0 36px;
  }
  .plan-cards {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .plan-cards--single {
    grid-template-columns: 1fr;
  }
  .plan-card__price-wrap dd {
    font-size: 22px;
  }
}
