/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
  洋食二段重ページ専用CSS【サイトのトンマナ版】（index01.php 用）
  既存の two-tiered-box.css（去年テイスト版）は残したまま、別ファイルとして作成。
  すべて .p-tbox01 配下にスコープ。共通CSSは変更しない。
  フォントはサイト共通の Shippori Mincho / EB Garamond を使用（追加読込なし）。
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

.p-tbox01 {
  --tbox01-gold: #a98963;
  --tbox01-gold-light: #cfb48d;
  --tbox01-line: rgba(169, 137, 99, 0.55);
  --tbox01-font-en: "EB Garamond", serif;
  margin-inline: auto;
  max-width: 100%;
}

/* ---------- 写真＋重ねテキスト ---------- */
.p-tbox01__hero {
  container-type: inline-size;
  margin: 0;
  overflow: hidden;
  position: relative;
}

.p-tbox01__hero img {
  display: block;
  height: auto;
  width: 100%;
}

.p-tbox01__caption {
  background: linear-gradient(to bottom, rgba(17, 17, 17, 0.88) 0%, rgba(17, 17, 17, 0.62) 55%, rgba(17, 17, 17, 0) 100%);
  color: #fff;
  left: 0;
  padding: 3.4cqw 4cqw 9cqw;
  position: absolute;
  right: 0;
  text-align: center;
  top: 0;
}

.p-tbox01__caption p {
  margin: 0;
}

.p-tbox01__label {
  color: var(--tbox01-gold-light);
  font-size: clamp(11px, 2.5cqw, 22px);
  letter-spacing: 0.3em;
  line-height: 1.5;
  padding-left: 0.3em;
}

.p-tbox01__label .en {
  font-family: var(--tbox01-font-en);
  font-size: 0.92em;
  margin-right: 1.2em;
  text-transform: uppercase;
}

.p-tbox01__name {
  font-size: clamp(26px, 6.4cqw, 64px);
  font-weight: 500;
  letter-spacing: 0.22em;
  line-height: 1.25;
  margin-top: 1cqw !important;
  padding-left: 0.22em;
}

.p-tbox01__name.is-en {
  font-family: var(--tbox01-font-en);
  letter-spacing: 0.12em;
  padding-left: 0.12em;
  text-transform: uppercase;
}

.p-tbox01__date {
  font-size: clamp(11px, 2.3cqw, 20px);
  letter-spacing: 0.12em;
  line-height: 1.6;
  margin-top: 1.6cqw !important;
}

.p-tbox01__date::before {
  background-color: var(--tbox01-gold);
  content: "";
  display: block;
  height: 1px;
  margin: 0 auto 1.4cqw;
  width: 9cqw;
}

.p-tbox01__nowrap {
  display: inline-block;
}

/* ---------- 詳細（ゴールドの細罫の枠） ---------- */
.p-tbox01__detail {
  border: 1px solid var(--tbox01-line);
  margin-top: 4rem;
  padding: 5.2rem 3rem 4.6rem;
  position: relative;
  text-align: center;
}

.p-tbox01__detail::before {
  border: 1px solid rgba(169, 137, 99, 0.25);
  content: "";
  inset: 0.7rem;
  pointer-events: none;
  position: absolute;
}

.p-tbox01__lead {
  font-size: 2.2rem;
  letter-spacing: 0.08em;
  line-height: 1.9;
  margin: 0;
}

.p-tbox01__sub {
  color: #e9e9ed;
  font-size: 1.7rem;
  letter-spacing: 0.08em;
  line-height: 1.9;
  margin: 0.6rem 0 0;
}

.p-tbox01__price {
  align-items: baseline;
  border-bottom: 1px solid var(--tbox01-line);
  border-top: 1px solid var(--tbox01-line);
  color: var(--tbox01-gold);
  display: flex;
  flex-wrap: wrap;
  gap: 0 1.2rem;
  justify-content: center;
  margin: 3.4rem auto 0;
  max-width: 46rem;
  padding: 2rem 1rem 2.2rem;
}

.p-tbox01__price-unit {
  font-size: 1.8rem;
  letter-spacing: 0.12em;
  margin-right: 1rem;
}

.p-tbox01__price-tax {
  font-size: 1.6rem;
  letter-spacing: 0.1em;
}

.p-tbox01__price-num {
  font-family: var(--tbox01-font-en);
  font-size: 5.6rem;
  letter-spacing: 0.04em;
  line-height: 1;
}

.p-tbox01__price-yen {
  font-size: 2.4rem;
}

.p-tbox01__note {
  font-size: 1.5rem;
  letter-spacing: 0.08em;
  line-height: 2;
  margin: 3rem 0 0;
}

.p-tbox01__note span {
  display: inline-block;
}

/* ---------- スマホ ---------- */
@media screen and (max-width: 767px) {
  .p-tbox01__caption {
    padding: 3cqw 3cqw 8cqw;
  }

  .p-tbox01__label {
    letter-spacing: 0.2em;
  }

  .p-tbox01__label .en {
    display: block;
    margin: 0 0 0.2em;
  }

  .p-tbox01__date::before {
    margin-bottom: 1.8cqw;
  }

  .p-tbox01__detail {
    margin-top: 2.4rem;
    padding: 4rem 1.6rem 3.6rem;
  }

  .p-tbox01__lead {
    font-size: 1.8rem;
  }

  .p-tbox01__sub {
    font-size: 1.5rem;
  }

  .p-tbox01__price {
    flex-wrap: nowrap;
    gap: 0 0.6rem;
    margin-top: 2.6rem;
    padding-left: 0;
    padding-right: 0;
  }

  .p-tbox01__price-unit {
    font-size: 1.5rem;
    margin-right: 0.4rem;
    white-space: nowrap;
  }

  .p-tbox01__price-tax {
    font-size: 1.4rem;
    white-space: nowrap;
  }

  .p-tbox01__price-num {
    font-size: 3.8rem;
    white-space: nowrap;
  }

  .p-tbox01__price-yen {
    font-size: 2rem;
    white-space: nowrap;
  }

  .p-tbox01__note {
    font-size: 1.35rem;
    margin-top: 2.4rem;
  }
}

/* ---------- 英語版（index01.php / en）の調整 ---------- */
.p-tbox01--en .p-tbox01__label {
  letter-spacing: 0.24em;
}

.p-tbox01--en .p-tbox01__date,
.p-tbox01--en .p-tbox01__lead,
.p-tbox01--en .p-tbox01__sub,
.p-tbox01--en .p-tbox01__note,
.p-tbox01--en .p-tbox01__price-unit,
.p-tbox01--en .p-tbox01__price-tax {
  letter-spacing: 0.02em;
}

@media screen and (max-width: 767px) {
  .p-tbox01--en .p-tbox01__date {
    font-size: 3.1cqw;
  }

  .p-tbox01--en .p-tbox01__lead {
    font-size: 1.7rem;
  }

  .p-tbox01--en .p-tbox01__price {
    flex-wrap: wrap;
    row-gap: 0.6rem;
  }

  .p-tbox01--en .p-tbox01__price-unit {
    flex-basis: 100%;
    margin-right: 0;
    text-align: center;
  }
}
