html {
  scroll-behavior: smooth; /* スクロール */
}


/* ── リセット & ベース ── */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* ── 変数（必要ならCSS Variables） ── */
:root {
  /* ベースの間隔（余白） */
  --base-spacing: 16px;

  /* セクション内 上下余白 */
  --section-padding-top: 100px;
  --section-padding-bottom: 100px;
}

/* ── ユーティリティ ── */
.text-center { text-align: center; }
.mt-1       { margin-top: var(--base-spacing); }
/* ここに .mb-*, .pt-*, .px-* などを追加 */


/* --------------------------------------------------
   フォント設定
-------------------------------------------------- */
/* 見出し用に Noto Serif JP を、太字で */
h1,
h2,
.section__title {
  font-family: 'Noto Serif JP', serif;
  font-weight: 500;
}

/* 見出し以外は Noto Sans JP を、太字で */
body,
p,
a,
li,
input,
textarea,
button {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
}


/* ── ボタン ── */
.btn {
  display: inline-block;
  padding: .75em 1.5em;
  background: var(--primary-color);
  color: #fff;
  border-radius: 4px;
  cursor: pointer;
  /* ここにホバー時の background-color などを書く */
}

/* ── フォーム要素 ── */
input,
textarea {
  width: 100%;
  padding: var(--base-spacing);
  border: 1px solid #ccc;
  border-radius: 4px;
}

/* 他にカード、モーダル、テーブル等の汎用コンポーネント */


/* --------------------------------------------------
  セクション汎用設定
-------------------------------------------------- */

.section {
  /* セクション全体の上下余白を制御 */
  padding-top: var(--section-padding-top);
  padding-bottom: var(--section-padding-bottom);
}

.section__inner {
  /* 横幅制限と中央寄せのみ */
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
}

/* セクションサブタイトル */
.section__subtitle-wrapper {
  --section-subtitle-color : #6BB9E1;  /* サブタイトル全体の色 */
  /* --section-subtitle-color : #ec8403; */
  
  text-align: center;
}

.section__subtitle {
  --underline-extend: 16px;  /* アンダーラインの左右プラス幅 */

  display: inline-block;
  position: relative;
  margin: 0;
  font-size: 40px;
  font-family: 'Allura', cursive;
  color: var(--section-subtitle-color);
}

/* サブタイトル用アンダーライン */
.section__subtitle::after {
  content: "";
  position: absolute;
  left: calc(var(--underline-extend) * -1);
  width: calc(100% + var(--underline-extend) * 2);
  height: 2px;
  background-color: var(--section-subtitle-color);
  margin-top: 0;
  bottom: 7px;
}


/* セクションタイトル */
.section__title {
  font-size: 40px;
  font-weight: 500;
  text-align: center;
  margin-top: 8px;
  margin-bottom: 60px;
}


/* CTA（Call To Action）*/
.cta-wrapper {
  margin-top: 64px;
  text-align: center;
}

.cta-link img {
  display: inline-block;
  width: 360px;
  height: auto;
}



@media (max-width: 1079px) {
  .section {
    padding: 48px 12px;
  }

  /* innerは幅100%、余白リセット */
  .section__inner {
    max-width: none;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    /* innerには左右パディング不要 */
    padding-left: 0;
    padding-right: 0;
  }

  .section__subtitle {
    --underline-extend: 16px;  /* アンダーラインの左右プラス幅 */
  
    font-size: 32px;
  }

  .section__title {
    font-size: 28px;
    /* margin-top: 8px; */
    margin-bottom: 40px;
  }

  .cta-wrapper {
    margin-top: 64px;
  }
  
  .cta-link img {
    width: 280px;
    /* height: auto; */
  }  
}


@media (max-width: 480px) {
  .section {
    padding: 48px 12px;
  }

  .section__subtitle {
    --underline-extend: 16px;  /* アンダーラインの左右プラス幅 */
  
    font-size: 28px;
  }

  .section__title {
    font-size: 24px;
    /* margin-top: 8px; */
    /* margin-bottom: 60px; */
  }

  .section__title br {
    display: none;
  }

  .cta-wrapper {
    margin-top: 52px;
  }
  
  .cta-link img {
    /* width: 280px; */
    /* height: auto; */
  }  
}


/* --------------------------------------------------
Headerセクション
-------------------------------------------------- */
.site-header {
  --header-height: 72px;

  background-color: #FFFFFF;
  height: var(--header-height);
  width: 100%;
}

.header__inner {
  max-width: 1080px;
  height: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 var(--section-inner-padding, 16px);
}

/* 左列：ロゴ */
.header__left {
  display: flex;
  align-items: center;
  gap: 16px;
}

.header__logo-link,
.header__site-title {
  display: block;
  text-decoration: none;
  color: inherit;
}

.header__logo-image {
  height:  var(--header-height);
  max-height: var(--header-height);
  width: auto;
  display: block;
}

.header__site-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 24px;
}

/* 右列：コンタクト＆プロモ */
.header__right {
  display: flex;
  align-items: center;
  gap: 16px;
  height:  var(--header-height);
}

/* 電話リンクボックス */
.contact-box {
  border-radius: 8px;
  padding: 0 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  text-decoration: none;
  color: #091057;
}

.header__line-a {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 20px;
  text-decoration: none;
  padding: 6px 32px 6px 20px;
  border: 2px solid #06C755;
  border-radius: 4px;
}

.header__line-img {
  display: flex;
  align-items: center;
}
.header__line-img img {
  width: 36px;
  height: auto;
}

.header__line-text {
  line-height: 1.3;
  color: #06C755;
}

.contact-box__line1 {
  display: flex;
  align-items: center;
  justify-content: center;
}

.contact-box__tel {
  margin-left: 8px;
  font-family: 'Noto Serif JP', serif;
  font-weight: 700;
  font-size: 24px;
}

.contact-box__line2 {
  margin-top: 4px;
  font-family: 'Noto Serif JP', serif;
  font-weight: 400;
  font-size: 12px;
  color: #091057;
}

/* プロモ画像リンク */
.promo-link {
  display: block;
}

.promo-image {
  height: 100%;
  max-height: var(--header-height);
  width: auto;
  display: block;
}

@media (max-width: 760px) {
  .header__contact {
    display: none;
  }
}

@media (max-width: 512px) {
  .header__inner {
    max-width: none;
    margin: 0 auto;
    padding: 0 0 0 24px;
  }

  .site-header {
    --header-height: 56px;
    height: var(--header-height);
  }

  .header__logo-image {
    height: auto;
    max-height: var(--header-height);
    max-width: 55%;
  }
}

/*--------------------------------------------------
  Hero セクション
--------------------------------------------------*/

.section--hero {
  min-height: 575px;
  padding-top: 60px;
  padding-bottom: 60px;
  position: relative;
  background: url('../images/backimage-hero.jpg') center/cover no-repeat;
  background-color: transparent;
  overflow: hidden;
}

/* Hero 内部コンテナ（2カラム） */
.hero__inner {
  --hero-column-ratio: 65%;

  display: flex;
  height: 100%;
}

/* ===== テキスト部分 ===== */

.hero__content {
  flex: 1 1 var(--hero-column-ratio);
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: left;
  font-family: 'Noto Serif JP', serif;
  padding: 0 var(--section-inner-padding, 16px);
}


/* 補足テキスト上 */
.hero__subtext {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.6; 
  color: #091057;
  font-family: 'Noto Serif JP', serif;
  /* white-space: pre-wrap; */
}

.hero__divider {
  margin-bottom: 16px;
  max-width: 340px;
}

.hero__divider img {
  width: 100%;
}

/* タイトル */
.hero__title {
  margin-bottom: 28px;
  font-size: 40px;
  font-weight: 700;
  color: #091057;
}

.hero__title--highlight {
  /* color: #ec8403; */
  color: #9575CD;
}

.hero__title--non-highlight {
  display: inline;
  white-space: pre-line;
}

/* サブタイトル */
.hero__lead {
  margin-bottom: 40px;
  font-size: 20px;
  color: #091057;
}

/* 月桂樹部分 */

.hero__gallery {
  display: flex;
  justify-content: flex-start;
  gap: 24px;
}

.hero__gallery-item {
  width: 180px;
}

.hero__gallery-item img {
  width: 100%;
  height: auto;
}

/* ===== フォーム部分 ===== */

.hero__form {
  flex: 1 1 calc(100% - var(--hero-column-ratio));
  display: flex;
  align-items: center;        /* 縦方向中央揃え */
  justify-content: center;    /* 横方向中央揃え */
  padding: 0;
}

/* 内側の白いボックス */
.hero__form-box {
  background-color: #FFFFFF;
  color: #091057;
  border-radius: 8px;
  padding: 20px;
  width: 100%;
  box-sizing: border-box;
}

/* 1段目：フォームタイトル */
.hero__form-title {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 32px;
  margin: 0 0 8px;
  text-align: center;
}

.hero__form-title .isFontChange {
  /* color:  #EC8403; */
  color: #9575CD;
  font-size: 40px;
}

/* 2段目：フォームサブタイトル */
.hero__form-subtitle {
  margin: 0 0 20px;
  padding: 0 0 20px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 20px;
  line-height: 1.6;
  text-align: center;
  color: #000000;
  border-bottom: 2px solid #CCCCCC;
}

.hero__form-subtitle-block {
  padding: 3px 5px;
  display: inline-block;
  background-color:#CDDC39;
  line-height: 1;
}

/* 3段目：フォーム本体 */
.hero__form-shortcode {
  margin-bottom: 16px;
}

/* =====
  Contact Form 7 – PC レイアウト
===== */

.hero__form-shortcode .wpcf7-form p {
  display: block;
  margin-bottom: 16px;    /* 項目間の間隔 */
}

.hero__form-shortcode .wpcf7-form p:last-child {
  margin-bottom: 200px;
}

.hero__form-shortcode .wpcf7-form label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 0 0 8px;
  color: #091057;
}

/* CF7 のラッパー要素を block 化 */
.hero__form-shortcode .wpcf7-form p span.wpcf7-form-control-wrap {
  --form-color-text:  #000000;
  --form-color-background: #F5F5F5;
  --form-color-border: #4682B4;

  flex: 0 0 70%;
  padding: 0;
  display: inline-block;
  width: 100%;
}


/* テキスト／電話／メール／セレクト */
.hero__form-shortcode .wpcf7-form input[type="text"],
.hero__form-shortcode .wpcf7-form input[type="tel"],
.hero__form-shortcode .wpcf7-form input[type="email"],
.hero__form-shortcode .wpcf7-form input[type="number"],
.hero__form-shortcode .wpcf7-form select {
  padding: 0 16px;
  box-sizing: border-box;
  width: 100%;
  height: 52px;
  font-size: 16px;
  font-weight: 500;
  font-family: 'Noto Sans JP', sans-serif;
  color: var(--form-color-text);
  border: 2px solid var(--form-color-border);
  border-radius: 0;
  background-color: var(--form-color-background);
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}


.hero__form-shortcode .wpcf7-form p:has(select[name="dropdown-1"]),
.hero__form-shortcode .wpcf7-form p:has(select[name="dropdown-2"]),
.hero__form-shortcode .wpcf7-form p:has(select[name="dropdown-3"]),
.hero__form-shortcode .wpcf7-form p:has(select[name="prefecture"]) {
  margin-bottom: 8px;
}

.hero__form-shortcode .wpcf7-form p:has(input[name="hotel-rooms"]) {
  margin-bottom: 4px;
}


.hero__form-shortcode .wpcf7-form .label-supplement {
  margin-bottom: 6px;
  padding: 0 12px;
  font-size: 13px;
  font-weight: normal;
  color: #000000;
}
.hero__form-shortcode .wpcf7-form .label-supplement p {
  text-align: left !important;
}


/* ===== 同意ボタン ===== */

/* 1. 完全リセット */
.hero__form-shortcode .wpcf7-form .privacy-agree-label,
.hero__form-shortcode .wpcf7-form .privacy-agree-label * {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
  font: inherit !important;
  color: inherit !important;
  line-height: inherit !important;
}

/* 2. 外側ラベル */
.hero__form-shortcode .wpcf7-form .privacy-agree-label {
  display: block !important;
  font-size: 14px !important;
  padding: 0 12px !important;
}

/* 3. 内側ラベルを relative + 左パディングでインデント設定 */
.hero__form-shortcode .wpcf7-form .privacy-agree-label
  .wpcf7-list-item > label {
  display: block !important;
  position: relative !important;
  padding-left: 24px !important;
  line-height: 1.4 !important;
}

/* 4. チェックボックスを絶対配置で左上に */
.hero__form-shortcode .wpcf7-form .privacy-agree-label
  .wpcf7-list-item > label input[type="checkbox"] {
  position: absolute !important;
  top: 6px !important;
  left: 0 !important;
  margin: 0 !important;
  width: auto !important;
  height: auto !important;
}

/* 5. 文言部分はブロック化＆折り返しOK */
.hero__form-shortcode .wpcf7-form .privacy-agree-label
  .wpcf7-list-item-label {
  display: block !important;
  white-space: normal !important;
  color: #000000 !important;
}



.hero__form-shortcode .wpcf7-form input[type="submit"],
.hero__form-shortcode .wpcf7-form button.wpcf7-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  width: 70%;
  margin: 0 auto;
  padding: 0;
  background-color: #e7aa14;
  color: #ffffff;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 20px;
  border: none;
  border-radius: 120px;
  cursor: pointer;
  box-sizing: border-box;
  text-decoration: none;
}

.hero__form-shortcode .wpcf7-form p:last-child {
  text-align: center;           /* ボタンを囲む<p>を中央揃え */
  margin-bottom: 0;             /* 不要なら余白リセット */
}


/* ホバー時の状態（任意） */
.hero__form-shortcode .wpcf7-form .wpcf7-submit:hover {
  opacity: 0.9;
}

/* ───────────────────────────────────────────────────────
   CF7：送信ボタン周りの装飾をすべて無効化
────────────────────────────────────────────────────── */
.hero__form-shortcode .wpcf7-submit:focus,
.hero__form-shortcode .wpcf7-submit:active {
  outline: none !important;
  box-shadow: none !important;
}

/* CF7 スピナーを非表示 */
.hero__form-shortcode .wpcf7-spinner {
  display: none !important;
}

/* CF7 の送信完了メッセージを非表示 */
.hero__form-shortcode .wpcf7-response-output {
  display: none !important;
}

/* ボタンのテキストフェード／トランジションを無効化 */
.hero__form-shortcode .wpcf7-submit {
  transition: none !important;
}

.hero__form-shortcode .wpcf7-submit:focus,
.hero__form-shortcode .wpcf7-submit:active {
  appearance: none;
  -webkit-appearance: none;
  outline: none !important;
  border-radius: 120px !important;
}


/* 4段目：フォーム補足 */
.hero__form-note {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 13px;
  margin: 0 0 4px;
  padding: 0 12px;
  text-align: left;
  color: #000000;
}

.hero__form-note a {
  color: #0066CC;
  text-decoration: underline;
}



@media (max-width: 1079px) {
  /* Hero 全体の背景をクリアし、縦長に自動調整 */
  .section--hero {
    height: auto;
    padding-top: 60px;
    padding-bottom: 0;
  }

  /* 2カラム → 1カラムに切り替え */
  .hero__inner {
    display: block;
    max-width: 600px;
  }

  .hero__content {
    background-color: transparent;
    padding: 0 16px;
  }

  /* 月桂樹ブロック */
  .hero__gallery {
    display: flex;
    justify-content: center;
    gap: 2px;
  }
  
  /* 月桂樹 */
  .hero__gallery-item {
    width: 32%;
  }
  
  .hero__gallery-item img {
    width: 100%;
    height: auto;
  }

  /* 右列（フォーム）は次ブロックとして表示 */
  .hero__form {
    background: none;
    margin: 0 auto;
    padding: 48px 16px;
    max-width: 480px;
  }

  .hero__form-shortcode .wpcf7-form p {
    margin-bottom: 24px;    /* フォーム項目間の間隔 */
  }
  
  .hero__form-shortcode .wpcf7-form p:last-child {
    margin-bottom: 0;
  }
}

@media (max-width: 480px) {
  .section--hero {
    padding-top: 32px;
    padding-bottom: 0;
  }

  /* ===== テキスト部分 ===== */

  /* 補足テキスト(上) */
  .hero__subtext {
    font-size: 15px;
    /* font-weight: 700; */
    /* line-height: 1.6;  */
  }
  
  .hero__divider {
    margin-bottom: 16px;
    max-width: 320px;
  }

  /* タイトル */
  .hero__title {
    margin-bottom: 20px;
    font-size: 36px;
  }

  /* サブタイトル */
  .hero__lead {
    margin-bottom: 20px;
    font-size: 20px;
  }
}


/*--------------------------------------------------
お悩みセクション
BASE : bullet-B
--------------------------------------------------*/

.section--bulletsB1 {
  position: relative;       /* 疑似要素を相対配置の中に収める */
  background-color: #091057;
  color: #FFFFFF;
  overflow: hidden;         /* はみ出し防止 */
}

/* 背景画像を透過オーバーレイで配置 */
.section--bulletsB1::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: url("../images/backimage-bB1.jpg") center/cover no-repeat;
  opacity: 0.08;             /* お好みの透過度に調整 */
  z-index: 0;
}

/* コンテンツ部分を前面に出す */
.section--bulletsB1 > .section__inner {
  position: relative;
  z-index: 1;
}

/* PC/タブレット：2列レイアウト + 行間スペース */
.section--bulletsB1 .section__boxes {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: var(--base-spacing);
  row-gap: var(--base-spacing);
}


/* 各ボックスのスタイル */
.section--bulletsB1 .section__box {
  display: flex;
  align-items: flex-start;
  /* モバイル用に下余白を入れたい場合は下の @media で margin-bottom を追加 */
}

.section--bulletsB1 .section__box-icon {
  flex-shrink: 0;
  margin-right: 12px;
}

.section--bulletsB1 .section__box-text {
  flex: 1 1 auto;
  margin: 0;
  font-size: 18px;
  line-height: 1.5;
}

/* ボトムテキスト */
.section--bulletsB1 .section__textBottom {
  margin-top: 56px;
  font-size: 18px;
  font-weight: 400;
  text-align: center;
}


@media (max-width: 1079px) {
  .section--bulletsB1 .section__boxes {
    grid-template-columns: 1fr;
  }

  .section--bulletsB1 .section__box {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: var(--base-spacing); /* 各ボックス間の下余白 */
    width: 480px;
  }

  .section--bulletsB1 .section__box:last-child {
    margin-bottom: 0; /* 最後のボックスの余白は不要 */
  }
}


@media (max-width: 480px) {
  .section--bulletsB1 .section__boxes {
    padding: 0 24px;
    row-gap: 16px;
  }

  .section--bulletsB1 .section__box {
    /* margin-left: auto; */
    /* margin-right: auto; */
    margin-bottom: 0;
    width: 100%;
  }

  .section--bulletsB1 .section__box-text {
    font-size: 16px;
  }

  .section--bulletsB1 .section__textBottom {
    margin-top: 32px;
    padding: 0 12px;
    font-size: 14px;
  }

  .section--bulletsB1 .section__textBottom br {
    display: none;
  }

}



/*--------------------------------------------------
比較セクション
BASE : cardsH-A
--------------------------------------------------*/
.section--cardsH-A1 {
  background-color: #FFFFFF;
  color: #091057;
  /* 上下余白は変数で調整 */
}

/* カード */
.section--cardsH-A1 .section__card {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 56px;
  padding: 32px 0;
  background-color: #f5f5f5;
}

/* 偶数番目は画像とテキストを入れ替える */
.section--cardsH-A1 .section__card--reverse {
  flex-direction: row-reverse;
}

/* 画像列（40%） */
.section--cardsH-A1 .section__card-image {
  flex: 0 0 calc((100% - 12px) * 0.35);
  max-width: calc((100% - 12px) * 0.35);
  padding: 0 24px;
}

.section--cardsH-A1 .section__card-image img {
  display: block;   /* 余白や縦方向のずれを防ぐ */
  width: 100%;      /* 親の width:40% に合わせる */
  height: auto;     /* アスペクト比を保ってリサイズ */
}

/* テキスト列（60%）、コンテンツを縦中央に配置 */
.section--cardsH-A1 .section__card-content {
  flex: 0 0 calc((100% - 12px) * 0.65);
  max-width: calc((100% - 12px) * 0.65);
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: left;
  /* 横余白 */
  padding: 0 var(--base-spacing, 24px);
}

/* テキストタイトル */
.section--cardsH-A1 .section__card-title {
  font-size: 32px;
  margin: 0;
}

.section--cardsH-A1 .section__card-title::after {
  content: "";
  display: block;
  width: 100%;
  height: 4px;
  background-color: #091057;
  margin: 28px 0; /* 上下スペース */
}

/* テキスト本文 */
.section--cardsH-A1 .section__card-text {
  margin: 0;
  font-size: 18px;
  font-weight: 400;
  color: #000000;
  line-height: 1.6;
}


@media (max-width: 1079px) {
  .section--cardsH-A1 .section__card-title {
    font-size: 24px;
  }
  .section--cardsH-A1 .section__card-title::after {
    margin: 14px 0;
  }
  .section--cardsH-A1 .section__card-text {
    font-size: 16px;
  }
}

@media (max-width: 480px) {
  .section--cardsH-A1 .section__card {
    display: block;
    margin-bottom: 32px;
    padding: 20px 0 32px;
  }
  
  /* 画像列*/
  .section--cardsH-A1 .section__card-image {
    max-width: 100%;
    margin-bottom: 40px;
    padding: 0 40px 0px;
  }
  
  .section--cardsH-A1 .section__card-image img {
    display: block;
    width: 100%;
    height: auto;
  }
  
  /* テキスト列 */
  .section--cardsH-A1 .section__card-content {
    max-width: 100%;
    display: block;
    padding: 0 24px;
  }

  .section--cardsH-A1 .section__card-title::after {
    height: 2px;
    margin: 28px 0; /* 上下スペース */
  }

  .section--cardsH-A1 .section__card-title {
    font-size: 20px;
  }
  .section--cardsH-A1 .section__card-title::after {
    margin: 14px 0;
  }
  .section--cardsH-A1 .section__card-text {
    font-size: 15px;
  }
}


/*--------------------------------------------------
こんな人におすすめセクション
BASE : bullet-B
--------------------------------------------------*/
.section--bulletsB2 {
  position: relative;       /* 疑似要素を相対配置の中に収める */
  background-color: #091057;
  color: #FFFFFF;
  overflow: hidden;         /* はみ出し防止 */
}

.section--bulletsB2::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: url("../images/backimage-bB2.jpg") center/cover no-repeat;
  opacity: 0.08;             /* お好みの透過度に調整 */
  z-index: 0;
}

/* コンテンツ部分を前面に出す */
.section--bulletsB2 > .section__inner {
  position: relative;
  z-index: 1;
}

/* 以下既存のレイアウトはそのまま */
.section--bulletsB2 .section__boxes {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: var(--base-spacing);
  row-gap: var(--base-spacing);
}


/* 各ボックスのスタイル */
.section--bulletsB2 .section__box {
  margin: 12px 12px;
  padding: 24px;
  border-radius: 2px;
  color: #091057;
  background-color: #FFFFFF;

  display: flex;
  align-items: flex-start;
  gap: calc(var(--base-spacing) * 0.5);
}


/* 箇条書きマークアイコン */
.section--bulletsB2 .section__box-icon {
  flex-shrink: 0;
}

/* 箇条書きテキスト */
.section--bulletsB2 .section__box-text {
  flex: 1 1 auto;
  margin: 0;
  font-size: 18px;
  line-height: 1.5;
}


@media (max-width: 1079px) {
  .section--bulletsB2 .section__boxes {
    grid-template-columns: 1fr;
  }

  .section--bulletsB2 .section__box {
    margin: 6px auto;
    padding: 12px 24px;
    width: 440px;
  
    display: flex;
    align-items: center;
    gap: 20px;
  }

  /* 箇条書きマークアイコン */
  .section--bulletsB2 .section__box-icon {
    /* width: 18px; */
    /* height: 18px; */
  }
  .section--bulletsB2 .section__box-icon img {
    width: 100%;
    height: 100%;
  }


  .section--bulletsB2 .section__box-text {
    margin: 0;
    font-size: 16px;
  }
}


@media (max-width: 480px) {
  .section--bulletsB2 .section__boxes {
    padding: 0 12px;
  }

  .section--bulletsB2 .section__box {
    gap: 8px;
    margin: 0 auto;
    padding: 12px;
    width: 100%;
  }

  /* 箇条書きマークアイコン */
  .section--bulletsB2 .section__box-icon {
    /* width: 18px; */
    /* height: 18px; */
  }

  .section--bulletsB2 .section__box-text {
    font-size: 15px;
  }
}

/* --------------------------------------------------
専門家セクション
BASE : cardsH-A
-------------------------------------------------- */
.section--cardsH-A2 {
  color: #091057;
  background-color: #f5f5f5;
}

/* セクション内コンテナ */
.section--cardsH-A2 .section__inner {
  /* padding: 0 120px; */
}

/* 本文1（テキストエリア相当） */
.section--cardsH-A2 .section__body {
  margin: 0 auto 48px; /* 下に24pxの余白 */
  width: 90%;
  font-size: 18px;
  font-weight: 400;
  color: #000000;
}

/* 本文2（テキストエリア相当） */
.section--cardsH-A2 .section__body--2 {
  margin: 48px auto 0;
  font-weight: 400;
  width: 90%;
}

/* カード群コンテナ（幅80%で中央寄せ） */
.section--cardsH-A2 .section__cards {
  width: 75%;
  margin: 0 auto;
}

/* 各カード（2列、上下に24pxのギャップ） */
.section--cardsH-A2 .section__card {
  display: flex;
  margin-bottom: 24px;
  width: 100%;
  border: 1px solid #091057;
}
.section--cardsH-A2 .section__card:last-child {
  margin-bottom: 0;
}

/* 左列：カードタイトル (20%幅) */
.section--cardsH-A2 .section__card-title {
  flex: 0 0 20%;
  background-color: #091057;
  color: #ffffff;
  padding: 16px;
  font-size: 20px;
  box-sizing: border-box;
  text-align: center;
}

/* 右列：カード本文 (80%幅) */
.section--cardsH-A2 .section__card-body {
  flex: 0 0 80%;
  background-color: #ffffff;
  color: #091057;
  padding: 16px;
  font-size: 20px;
  box-sizing: border-box;
  text-align: left;
}


@media (max-width: 1079px) {
  .section--cardsH-A2 .section__body {
    font-size: 16px;  /* 説明本文 */
  }

  .section--cardsH-A2 .section__card-title {
    font-size: 18px;  /* カードタイトル */
  }

  .section--cardsH-A2 .section__card-body {
    font-size: 18px;  /* カード本文 */
  }
}

@media (max-width: 480px) {
  /* 本文 */
  .section--cardsH-A2 .section__body {
    margin: 0 auto 24px;
    padding: 0 12px;
    width: 100%;
    font-size: 15px;
    line-height: 1.8;
  }

  /* 本文2 */
  .section--cardsH-A2 .section__body--2 {
    margin: 24px auto 0;
    width: 100%;
  }

  /* カード群コンテナ */
  .section--cardsH-A2 .section__cards {
    padding: 0 12px;
    width: 100%;
    /* margin: 0 auto; */
  }

  /* 各カード（2列、上下に24pxのギャップ） */
  .section--cardsH-A2 .section__card {
    --card-left-ratio : 30%; /* カードの左右比率(左) */

    margin-bottom: 16px;
    width: 100%;
  }

  /* 左列：カードタイトル (20%幅) */
  .section--cardsH-A2 .section__card-title {
    flex: 0 0 var(--card-left-ratio);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    font-size: 16px;
  }

  /* 右列：カード本文 (80%幅) */
  .section--cardsH-A2 .section__card-body {
    flex: 0 0 calc(100% - var(--card-left-ratio));
    padding: 8px 12px;
    font-size: 16px;
  }
}


/* --------------------------------------------------
お客様の声セクション
BASE : cardsV-A
-------------------------------------------------- */

.section--cardV-A1 {
  color: #091057;
  background-color: #FFFFFF;
}

/* セクション内コンテナ */
.section--cardV-A1 .section__inner {

}

/* カード群（横並び3枚・中央揃え・カード間余白24px） */
.section--cardV-A1 .section__cards {
  display: flex;
  justify-content: center;
  gap: 28px;
  flex-wrap: wrap;
}

/* 各カード */
.section--cardV-A1 .section__card {
  flex: 0 0 28%;               /* 幅を狭めて約3枚並ぶ (28%×3 + gap×2 ≈100%) */
  background-color: #F8F8F8;
  border-radius: 4px;
  padding: 24px;               /* padding を24pxに */
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;         /* カード間の上下gap */
}

/* カード1段目：写真（正方形・カード幅の50%） */
.section--cardV-A1 .section__card-photo {
  margin: 0 auto 16px;
  height: 120px;
  width: auto;
  /* aspect-ratio: 1 / 1; */
  overflow: hidden;

}
.section--cardV-A1 .section__card-photo img {
  width: 100%;
  height: 100%;
  -webkit-object-fit: contain;
          object-fit: contain;
  display: block;
}

/* カード2段目：タイトル */
.section--cardV-A1 .section__card-title {
  font-size: 28px;
  color: #091057;
  text-align: left;
  margin: 0 0 12px;
}

/* カード3段目：本文 */
.section--cardV-A1 .section__card-content {
  flex-grow: 1;
  margin: 0 0 12px;
  padding-top: 12px;
  min-height: 360px;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
  color: #000000;
  text-align: left;
  border-top: 1px solid #000000;
  overflow-wrap: break-word;
}

/* カード4段目：補足説明（常に下寄せ） */
.section--cardV-A1 .section__card-note {
  font-size: 14px;
  color: #000000;
  text-align: right;
  margin: 0;
  margin-top: auto;            /* 下寄せ */
}

@media (max-width: 1079px) {
  /* カード */
  .section--cardV-A1 .section__card {
    flex: 0 0 66%;
    max-width: 600px;
    /* padding: 24px; */
    /* margin-bottom: 24px; */
  }

  /* カード2段目：タイトル */
  .section--cardV-A1 .section__card-title {
    font-size: 24px;
    /* margin: 0 0 12px; */
  }
  
  /* カード3段目：本文 */
  .section--cardV-A1 .section__card-content {
    /* margin: 0 0 12px; */
    /* padding-top: 12px; */
    min-height: 0;
    /* font-size: 15px; */
    /* line-height: 1.6; */
  }
}

@media (max-width: 480px) {
  /* カード群 */
  .section--cardV-A1 .section__cards {
    padding: 0 24px;
    gap: 20px;
  }

  /* カード */
  .section--cardV-A1 .section__card {
    flex: 0 0 100%;
  }
}


/* --------------------------------------------------
流れセクション
BASE : image-A1
-------------------------------------------------- */
.section--image-A1 {
  position: relative;    /* 疑似要素を相対配置内に */
  background-color: #091057;
  color: #FFFFFF;
  overflow: hidden;      /* 背景画像のはみ出し防止 */
}

.section--image-A1::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: url("../images/backimage-iA1.jpg") center/cover no-repeat;
  opacity: 0.08;          /* 透過度はお好みで調整 */
  z-index: 0;
}

/* コンテンツ部分を前面に出す */
.section--image-A1 > .section__inner {
  position: relative;
  z-index: 1;
}

/* 画像ラッパー */
.section--image-A1 .section__image-wrapper {
  display: flex;
  justify-content: center;
  margin: 0;
}

/* 画像本体 */
.section--image-A1 .section__image {
  display: block;
  width: 100%;
  max-width: 600px;
  height: auto;
}

@media (max-width: 1079px) {
  .section--image-A1 .section__image {
    width: 80%; /* 画像サイズ */
    max-width: 600px;
  }
}

@media (max-width: 480px) {
  .section--image-A1 .section__image-wrapper {
    padding: 0 24px;
  }

  .section--image-A1 .section__image {
    width: 100%; /* 画像サイズ */
  }
}


/* --------------------------------------------------
   Q&A セクション
   BASE : qanda_A1
-------------------------------------------------- */
.section--qanda-A1 {
  color: #091057;
}

.section--qanda-A1 .section__box--qanda {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
}

/* 区切り線：ボックス幅に合わせて中央寄せ */
.section--qanda-A1 .section__separator {
  width: 100%;
  max-width: 800px;
  margin: 40px auto;
  border: none;
  border-top: 2px dotted #ccc;
}

/* 上段：質問 */
.section--qanda-A1 .section__qanda-up {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 18px;
  padding: 12px;
  background-color: #efeff5;
  border-radius: 24px;

}

/* Qアイコン */
.section--qanda-A1 .section__qanda-icon--question {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #091057;
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 18px;
}

/* 質問テキスト */
.section--qanda-A1 .section__qanda-text--question {
  font-size: 18px;
  font-weight: 500;
  color: #091057;
  text-align: left;
  margin: 0;
}

/* 下段：回答 */
.section--qanda-A1 .section__qanda-down {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 18px;
  padding: 20px 12px 0;
}

/* Aアイコン */
.section--qanda-A1 .section__qanda-icon--answer {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #FFFFFF;
  border: 1px solid #091057;
  color: #091057;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 18px;
}

/* 回答テキスト */
.section--qanda-A1 .section__qanda-text--answer {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.8;
  color: #000000;
  text-align: left;
  margin: 0;
}


@media (max-width: 1079px) {
  .section--qanda-A1 .section__qanda-text--question {
    font-size: 16px;
  }

  .section--qanda-A1 .section__qanda-text--answer {
    font-size: 15px;
  }
}


@media (max-width: 480px) {
  /* 区切り線：ボックス幅に合わせて中央寄せ */
  .section--qanda-A1 .section__separator {
    width: 90%;
    margin: 32px auto;
    /* border: none; */
    /* border-top: 2px dotted #ccc; */
  }

  .section--qanda-A1 .section__box--qanda {
    /* margin: 0 auto; */
    padding: 0 18px;
  }

  /* 下段：回答 */
  .section--qanda-A1 .section__qanda-down {
    /* display: grid; */
    align-items: flex-start;
    /* gap: 18px; */
    padding: 20px 0 0 12px;
  }
}


/*--------------------------------------------------
  Footer セクション
--------------------------------------------------*/
.footer {
  background: #f5f5f5;
  padding: var(--base-spacing) 0;
  
}

.footer__inner {
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
  padding: 48px 0;

  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* 左カラム：ロゴ */
.footer__col--logo {
  display: flex;
  align-items: center;
}

/* ロゴ画像／サイトタイトル */
.footer__logo-image,
.footer__site-title {
  max-height: 72px;
  display: block;
}

/* フッターリンク群 */

.footer__col--links {
  width: 60%;
}

.footer__links-top {
  margin-bottom: 18px;
}

/* 上段：3リンクを横並び */
.footer__links-top .footer__link-list {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer__links-top .footer__link-item {
  margin-right: var(--base-spacing);
}

.footer__links-top .footer__link-item:last-child {
  margin-right: 0;
}

.footer__links-top .footer__link-item a {
  text-decoration: none;
  color: inherit;
  font-size: 0.9rem;
  text-align: left;
}

/* 下段：コピーライト */
.footer__links-bottom {
  margin-top: calc(var(--base-spacing) * 0.5);
}

.footer__copyright {
  margin: 0;
  font-size: 0.8rem;
  color: #666;
}

@media (max-width: 1079px) {
  .footer__inner {
    padding: 24px 40px;
  }
}

@media (max-width: 480px) {
  .footer__inner {
    flex-direction: column;
    text-align: center;
  }

  /* ロゴ中央・下に余白 */
  .footer__col--logo {
    justify-content: center;
    margin-bottom: var(--base-spacing);
  }

  /* リンクリストを中央揃え */
  .footer__links-top .footer__link-list {
    justify-content: center;
    flex-wrap: wrap;
  }

  .footer__links-top .footer__link-item {
    margin: 0 0 12px;
  }

  .footer__links-top .footer__link-item:last-child {
    margin: 0 0 0;
  }

  .footer__links-bottom {
    margin-top: 0;
  }
}


/* ------------------------------------
   固定ページ共通
------------------------------------ */

.page .page-content {
  max-width: 800px;
  min-height: 80vh;
  margin: 0 auto;
  padding: 80px 0;
  font-family: 'Noto Serif JP', serif;
  line-height: 1.8;
  color: #000000;
}

.page .page-content h1  {
  font-family: 'Noto Serif JP', serif;
  margin-bottom: 24px;
  text-align: center;
}

.page .page-content h2 {
  font-family: 'Noto Serif JP', serif;
  margin-bottom: 24px;
}

.page .page-content p {
  margin-bottom: 16px;
  font-size: 16px;
}

@media (max-width: 480px) {
  .page .page-content {
    padding: 40px 24px;
  }
  
  .page .page-content h1  {
    font-size: 28px;
  }

  .page .page-content h2  {
    font-size: 20px;
  }

  .page .page-content p {
    margin-bottom: 16px;
    font-size: 15px;
  }
}

/* プライバシーポリシー（スラッグ：privacy） */
.page-content.page-content--privacy h2 {
  margin-top: 52px;
}

/* プライバシーポリシー & 利用規約 固定ページ内のリスト */
.page-content.page-content--privacy ol,
.page-content.page-content--privacy ul,
.page-content.page-content--terms ol,
.page-content.page-content--terms ul {
  list-style-position: outside;
  padding-left: 0;
  margin: 0 0 1em 1.5em;
}

.page-content.page-content--privacy ol li,
.page-content.page-content--privacy ul li,
.page-content.page-content--terms ol li,
.page-content.page-content--terms ul li {
  margin-bottom: 0.5em;
}

/* ネストリストはさらにインデント */
.page-content.page-content--privacy ol ol,
.page-content.page-content--privacy ul ul,
.page-content.page-content--terms ol ol,
.page-content.page-content--terms ul ul {
  list-style-position: outside;
  padding-left: 0;
  margin: 0.5em 0 0.5em 2.5em;
}

/* レベル別マーカー設定 */
.page-content.page-content--privacy ol,
.page-content.page-content--terms ol {
  list-style-type: decimal;
}

.page-content.page-content--privacy ol ul,
.page-content.page-content--terms ol ul {
  list-style-type: lower-roman;
}

.page-content.page-content--privacy ol ul ul,
.page-content.page-content--terms ol ul ul {
  list-style-type: lower-alpha;
}




/* 利用規約（スラッグ：terms） */
.page-content.page-content--terms h2 {
  margin-top: 52px;
}

/* 会社概要（スラッグ：company） */

/* 会社概要ページ：項目タイトル（h3）と内容（p）を2列レイアウトに */
.page-content.page-content--company {
  display: grid;
  grid-template-columns: 30% 70%;
  column-gap: 24px;
  row-gap: 32px;
  max-width: 520px;
  margin: 0 auto;
  font-family: 'Noto Sans JP', sans-serif;
  color: #000000;
}

/* ページタイトル */
.page-content.page-content--company > h1 {
  grid-column: 1 / -1;
  margin-bottom: 32px;
  text-align: center;
}

/* 項目タイトル */
.page-content.page-content--company > h3 {
  grid-column: 1;
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  text-align: left;
}

/* 項目内容 */
.page-content.page-content--company > p {
  grid-column: 2;
  margin: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  text-align: left;
}

@media (max-width: 480px) {
  .page-content.page-content--company {
    --company-padding-x: 24px;
    --company-inner-width: calc(100% - (2 * var(--company-padding-x)));

    padding: 40px var(--company-padding-x);
    display: grid;
    grid-template-columns: 
      calc(var(--company-inner-width) * 0.3) 
      calc(var(--company-inner-width) * 0.7);
    column-gap: 24px;
    row-gap: 32px;
  }

  .page-content.page-content--company h3  {
    font-size: 16px;
  }

  .page-content.page-content--company p  {
    font-size: 16px;
  }
}

/* ------------------------------------
   thanks
------------------------------------ */

.section--thanks {
  text-align: center;
  font-family: 'Noto Serif JP', serif;
  min-height: 70vh;
}

.section--thanks .section__title {
  font-size: 40px;
  font-family: 'Noto Serif JP', serif;
}

.section--thanks .section__lead {
  font-size: 20px;
  font-family: 'Noto Serif JP', serif;
}

.section--thanks .cta-wrapper {
  font-size: 20px;
}

/* ------------------------------------
   404
------------------------------------ */

.section--404 {
  text-align: center;
  padding: 120px 0;
  min-height: 70vh;
}
.section--404 .section__title {
  margin-bottom: 64px;
  line-height: 2;
}
.section--404 .section__lead {
  margin-bottom: 32px;
}

.section--404 .cta-wrapper {
  font-size: 20px;
}

@media (max-width: 480px) {
}