@charset "UTF-8";

/* =============================================================================

Accommodation Terms & House Rules (EN / 函館)

・hakodate/english は 1rem≒100px のスケーリング設計（common.css の html{font-size}）。
  本ファイルも同設計に合わせ rem を小数で指定する。
・見出しはサイトの英字見出しと同じ "Noto Serif Display"、本文は html 既定（サイト共通）。
・デスクトップ基準 + @media (max-width:640px) で SP 上書き。

============================================================================= */

.en-provision {
  background: #fff;
  color: #464237;
}

/* 見出しブロック */
.en-provision-kv {
  text-align: center;
  padding: 2.0rem 0.3rem 0.5rem;
}
.en-provision-kv-hotel {
  font-family: "Noto Serif Display", serif;
  font-size: 0.16rem;
  letter-spacing: 0.03rem;
  color: var(--theme-gold, #a58f5f);
}
.en-provision-kv-title {
  margin-top: 0.18rem;
  font-family: "Noto Serif Display", serif;
  font-weight: 500;
  font-size: 0.42rem;
  line-height: 1.3;
  letter-spacing: 0.03rem;
}

/* 本文ラッパー */
.en-provision-body {
  padding: 0.2rem 0.3rem 1.0rem;
}
.en-provision-inner {
  max-width: 9.6rem;
  margin: 0 auto;
}

/* セクション大見出し（Accommodation Terms / House Rules） */
.en-provision-inner .provision-title {
  display: block;
  scroll-margin-top: 1.4rem;
  margin-bottom: 0.3rem;
  padding-bottom: 0.15rem;
  border-bottom: 1px solid #d8d2c6;
  color: var(--theme-gold, #a58f5f);
  font-family: "Noto Serif Display", serif;
  font-weight: 500;
  font-size: 0.28rem;
  line-height: 1.4;
  letter-spacing: 0.02rem;
}
.en-provision-inner .provision-title:not(:first-child) {
  margin-top: 0.8rem;
}

/* Article 見出し・小見出し */
.en-provision-inner h2 {
  margin-bottom: 0.1rem;
  color: var(--theme-gold, #a58f5f);
  font-family: "Noto Serif Display", serif;
  font-weight: 500;
  font-size: 0.2rem;
  line-height: 1.5;
}
.en-provision-inner h2:not(:first-child) {
  margin-top: 0.4rem;
}
.en-provision-inner h2 > span {
  margin-right: 0.08rem;
}

/* 本文 */
.en-provision-inner p {
  font-size: 0.16rem;
  line-height: 1.9;
}
.en-provision-inner p + p {
  margin-top: 0.12rem;
}

/* 連番項目（2. …）：番号列を固定し折り返しを揃える */
.en-provision-inner .provision-item {
  display: grid;
  grid-template-columns: 0.4rem 1fr;
  grid-auto-flow: column;
}

/* (a)(b)(c) のサブ項目 */
.en-provision-inner .provision-subwrap {
  display: block;
}
.en-provision-inner .provision-subitem {
  display: grid;
  grid-template-columns: 0.42rem 1fr;
  grid-auto-flow: column;
  padding-left: 0.2rem;
}

/* (1)(2)… のリスト */
.en-provision-inner ul {
  margin-top: 0.16rem;
  margin-bottom: 0.16rem;
  padding-left: 0.1rem;
  font-size: 0.16rem;
}
.en-provision-inner ul > li {
  display: grid;
  grid-template-columns: 0.4rem 1fr;
  grid-auto-flow: column;
  line-height: 1.7;
}
.en-provision-inner ul > li + li {
  margin-top: 0.08rem;
}

/* リンク */
.en-provision-inner a {
  color: var(--theme-gold, #a58f5f);
  text-decoration: underline;
  text-underline-offset: 0.02rem;
  word-break: break-all;
}

/* 別表見出し：本文と同じ見た目 */
.en-provision-inner .provision-table-heading {
  color: inherit;
  font-family: inherit;
  font-size: 0.16rem;
  line-height: 1.7;
}

/* 別表画像 */
.en-provision-inner .provision-table {
  margin-top: 0.2rem;
  margin-bottom: 0.12rem;
}
.en-provision-inner .provision-table img {
  max-width: 100%;
  height: auto;
}
.en-provision-inner .provision-note {
  font-size: 0.13rem;
  line-height: 1.7;
}
.en-provision-inner .provision-note + .provision-note {
  margin-top: 0.04rem;
}


/* ============================== SP ============================== */
@media screen and (max-width: 640px) {
  .en-provision-kv {
    padding: 0.6rem 0.3rem 0.4rem;
  }
  .en-provision-kv-hotel {
    font-size: 0.18rem;
  }
  .en-provision-kv-title {
    font-size: 0.28rem;
    letter-spacing: 0.02rem;
  }
  .en-provision-body {
    padding: 0.2rem 0.3rem 0.8rem;
  }
  .en-provision-inner .provision-title {
    scroll-margin-top: 0;
    font-size: 0.24rem;
  }
  .en-provision-inner .provision-title:not(:first-child) {
    margin-top: 0.6rem;
  }
  .en-provision-inner h2 {
    font-size: 0.18rem;
  }
  .en-provision-inner p {
    font-size: 0.15rem;
  }
  .en-provision-inner ul {
    font-size: 0.15rem;
  }
  .en-provision-inner .provision-item {
    grid-template-columns: 0.38rem 1fr;
  }
  .en-provision-inner .provision-subitem {
    grid-template-columns: 0.4rem 1fr;
  }
  .en-provision-inner .provision-table-heading {
    font-size: 0.15rem;
  }
  .en-provision-inner .provision-note {
    font-size: 0.14rem;
  }
}