@charset "UTF-8";
/******************************************************************************
*
* デザイントークン（Figmaカンプ 628:8 の登録変数と1:1対応）
* 出典：Figma File 0SOSecKaSkiHBzIHDVcfVe / get_variable_defs（2026-07-02取得）
*
******************************************************************************/
/* ----------------------------------------
  カラー
---------------------------------------- */
/* カンプ内で直接使われている色（Figma変数未登録・実測値） */
/* ----------------------------------------
  フォント
  本文・見出し＝游ゴシック（OS標準・webフォント不使用）
  英字アクセント＝Barlow Semi Condensed（Google Fonts・functions.phpでenqueue）
---------------------------------------- */
/* フォント統一（2026-07-02 Sone確定）：
   日本語＝游ゴシックに全統一／英字＝Poppins（金額のみ Barlow Semi Condensed） */
/* Figmaトークン準拠のサイズ（PC基準・SPは各所で縮小）
   H2: 56 / H3: 36 / H4: 28 / H5: 18 / p: 16 / ボタン: 24 / 英字: 42 */
/* 本文の共通サイズ（2026-07-02 Sone確定：全本文14〜16pxに統一） */
/* 行間・字間（Figmaトークン：lineHeight 1.55 / 1.8・letterSpacing 5%） */
/* ----------------------------------------
  レイアウト
  コンテンツ幅はWF確定仕様（基本1440 / テキスト主体960）
---------------------------------------- */
/* セクション上下余白の共通値（2026-07-03 Sone指示「もう少し開けたい」で拡大）
   SP=64px 〜 PC=116px */
/* ---------------------------------------------------------------
   余白スケール（2026-07-15 Sone指示：余白は共通トークンで統一）
   特殊な余白以外は下記の $space-* / $title-gap を使う。
   従来の個別 clamp() は順次これらへ寄せていく。
--------------------------------------------------------------- */
/* 波形境界の高さ（svgはpreserveAspectRatio=noneのためCSSで明示。
   未指定だとSafariが150pxで描画しSPで波が高くなりすぎる） */
@font-face {
  font-family: "Zen Kaku Gothic New";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/ZenKakuGothicNew-R.woff2") format("woff2"), url("../fonts/ZenKakuGothicNew-R.woff") format("woff");
}
@font-face {
  font-family: "Zen Kaku Gothic New";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/ZenKakuGothicNew-M.woff2") format("woff2"), url("../fonts/ZenKakuGothicNew-M.woff") format("woff");
}
@font-face {
  font-family: "Zen Kaku Gothic New";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/ZenKakuGothicNew-B.woff2") format("woff2"), url("../fonts/ZenKakuGothicNew-B.woff") format("woff");
}
/******************************************************************************
*
* レスポンシブ設定
*
******************************************************************************/
/**
 * 既存互換：mq("md") のように使う
 */
/**
 * min-width系（例：@include mq-up("md")）
 */
/**
 * max-width系（例：@include mq-down("sp")）
 * ※ mapの定義が max-width のキー（xs/sp）を想定
 */
/**
 * 範囲指定（min～max）（例：@include mq-between("md","sp")）
 * - $media_size の値（例: "screen and (min-width: 768px)"）から条件部分 "(min-width: 768px)" を抽出し結合
 */
/******************************************************************************
*
* フォントサイズ + 行間 設定（フルード／VWベース）
*
* 方針：
*   - clamp(min, calc(vw + px), max) で 375px〜1920px の間を線形補間
*   - 各breakpointで固定値ではなく連続的にスケール
*   - min = SP最小値 / max = XXL相当の最大値 / lh = 行間
*
* fluid() 関数：min-px と max-px を渡すと clamp(min, 線形vw+px, max) を返す
*   例：fluid(28, 48) → 28px@375vp 〜 48px@1920vp で連続スケール
*
******************************************************************************/
h1 {
  font-size: clamp(28px, 1.2944983819vw + 23.145631068px, 48px);
  line-height: 150%;
}

h2 {
  font-size: clamp(24px, 1.0355987055vw + 20.1165048544px, 40px);
  line-height: 150%;
}

h3 {
  font-size: clamp(20px, 0.6472491909vw + 17.572815534px, 30px);
  line-height: 150%;
}

h4 {
  font-size: clamp(18px, 0.4530744337vw + 16.3009708738px, 25px);
  line-height: 150%;
}

h5 {
  font-size: clamp(16px, 0.3883495146vw + 14.5436893204px, 22px);
  line-height: 160%;
}

h6 {
  font-size: clamp(15px, 0.1941747573vw + 14.2718446602px, 18px);
  line-height: 160%;
}

p {
  font-size: clamp(14px, 0.1294498382vw + 13.5145631068px, 16px);
  line-height: 220%;
}

/******************************************************************************
*
* 投稿本文テーブル（news / column / single-disease 共通）
*
* 仕様：
*   - フォーマル・罫線しっかり・読みやすさ重視
*   - ヘッダー行：ピンク背景＋白文字（ブランドカラー強調）
*   - データ行：背景白・border-bottom 区切り線のみ
*   - SP：横スクロール（Gutenberg figure.wp-block-table を ScrollHint 化）
*
* 使い方： .c-postBody { @include post-table; } / .p-disease__contents { @include post-table; }
*
******************************************************************************/
/******************************************************************************
*
* 画像の表示切替
*
******************************************************************************/
.sp-only {
  display: none;
}
@media screen and (max-width: 767px) {
  .sp-only {
    display: block;
  }
}

.pc-only {
  display: none;
}
@media screen and (min-width: 1200px) {
  .pc-only {
    display: block;
  }
}

.md-only {
  display: none;
}
@media screen and (min-width: 768px) {
  .md-only {
    display: block;
  }
}

.lg-only {
  display: none;
}
@media screen and (min-width: 992px) {
  .lg-only {
    display: block;
  }
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video, figure {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

html {
  scroll-behavior: smooth;
}

body {
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

body::-webkit-scrollbar {
  display: none;
}

html,
body {
  margin: 0;
  padding: 0;
  -webkit-text-size-adjust: 100%;
}

ol, ul {
  list-style: none;
}

ul, ol, li {
  list-style-type: none;
  padding: 0;
}

dl, dt, dd {
  margin: 0;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/*画像*/
img {
  width: 100%;
  height: auto;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}

/*アンカー*/
a {
  outline: none;
  text-decoration: none;
}

a img {
  outline: none;
  border: 0;
}

:focus {
  outline: 0;
}

/*フォーム*/
input,
textarea {
  display: block;
  width: 100%;
  box-sizing: border-box;
  border-width: 0;
}

::-webkit-input-placeholder {
  color: #999;
}

::-moz-placeholder {
  color: #999;
  opacity: 1;
}

:-ms-input-placeholder {
  color: #999;
}

/*iOS用にスタイルをリセット*/
input[type=submit],
input[type=button] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}

input[type=submit]::-webkit-search-decoration,
input[type=button]::-webkit-search-decoration {
  display: none;
}

input[type=submit]::focus,
input[type=button]::focus {
  outline-offset: -2px;
}

/******************************************************************************
*
* ベーススタイル（要素初期化・共通設定）
*
******************************************************************************/
/* ----------------------------------------
  Root / box-sizing
---------------------------------------- */
html {
  font-size: 16px;
  scroll-behavior: smooth;
  box-sizing: border-box;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

*, *::before, *::after {
  box-sizing: inherit;
}

/* ----------------------------------------
  Body
---------------------------------------- */
body {
  margin: 0;
  position: relative;
  font-size: 16px;
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  background-color: #F6F1E7;
}

/* ----------------------------------------
  見出し
---------------------------------------- */
h1, h2, h3, h4, h5, h6 {
  margin: 0;
  font-weight: 700;
  line-height: 1.55;
  color: #2B2B2B;
}

/* ----------------------------------------
  テキスト・リンク
---------------------------------------- */
p {
  margin: 0;
}

a {
  color: inherit;
  text-decoration: none;
  /* 不透明度を下げるホバーは廃止（2026-07-07 Sone「opacityを下げるホバーはダサい」FB）。
     個別に必要な箇所は色・下線・矢印フロー等で表現する */
}

ul, ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* ----------------------------------------
  画像
---------------------------------------- */
img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

/* ----------------------------------------
  フォーカスリング（アクセシビリティ）
---------------------------------------- */
:focus-visible {
  outline: 2px solid #7E9B7A;
  outline-offset: 2px;
}

/******************************************************************************
*
* コンテナ（コンテンツ幅の中央寄せ）
* WF確定仕様：基本1440px / テキスト主体960px
*
******************************************************************************/
.l-container {
  width: 100%;
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding-inline: 24px;
  /* テキスト主体セクション用の狭幅 */
}
.l-container--sub {
  max-width: calc(960px + 48px);
}

/******************************************************************************
*
* 追従ヘッダー／ハンバーガー／ドロワー
* - ハンバーガー：常時表示（fixed 右上・丸ボタン）
*   閉：グリーン丸＋白線 ／ 開：クリーム丸＋グリーン×（参考画像準拠）
* - 追従ヘッダー（白背景＋ロゴ）：FV通過で出現（.is-visible は script.js が付与）
* - ドロワー：右上（バーガー位置）を起点に円形で画面全体を覆う（clip-path）
*   デザイン＝参考画像準拠：アウトライン角丸ボタン＋破線区切り＋アイコン
*
******************************************************************************/
/* ----------------------------------------
  追従ヘッダー
---------------------------------------- */
.l-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 90;
  display: flex;
  align-items: center;
  height: 76px;
  padding: 0 96px 0 32px;
  background-color: transparent;
  pointer-events: none;
}
.l-header a {
  pointer-events: auto;
}
.l-header {
  transform: translateY(-105%);
  transition: transform 0.35s ease;
}
.l-header.is-visible {
  transform: translateY(0);
}
.l-header__logo {
  display: block;
}
.l-header__logo img {
  display: block;
  width: 140px;
  height: auto;
}
@media screen and (max-width: 767px) {
  .l-header {
    height: 60px;
    padding: 0 72px 0 16px;
  }
  .l-header__logo img {
    width: 110px;
  }
}

/* ----------------------------------------
  ハンバーガーボタン（常時表示・丸型）
---------------------------------------- */
.l-burger {
  position: fixed;
  top: 20px;
  right: 24px;
  z-index: 110;
  width: 60px;
  height: 60px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background-color: #5A7256;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  transition: background-color 0.3s ease;
}
.l-burger__line {
  display: block;
  width: 24px;
  height: 2px;
  border-radius: 2px;
  background-color: #FFFFFF;
  transition: transform 0.3s ease, opacity 0.3s ease, background-color 0.3s ease;
}
.l-burger {
  /* 開：クリーム丸＋×（クリーム地の×はテキストカラー＝緑を白地に載せない・2026-07-07 Sone指示） */
}
.l-burger.is-open {
  background-color: #F8F5F0;
}
.l-burger.is-open .l-burger__line {
  background-color: #2B2B2B;
}
.l-burger.is-open .l-burger__line:nth-child(1) {
  transform: translateY(8px) rotate(45deg);
}
.l-burger.is-open .l-burger__line:nth-child(2) {
  opacity: 0;
}
.l-burger.is-open .l-burger__line:nth-child(3) {
  transform: translateY(-8px) rotate(-45deg);
}
@media screen and (max-width: 767px) {
  .l-burger {
    top: 14px;
    right: 14px;
    width: 52px;
    height: 52px;
  }
}

/* ----------------------------------------
  会員メニュー（l-account）＝ハンバーガーの左・2026-07-14
  人物アイコン（緑丸・バーガーと統一）→クリックでマイページ／会員登録がドロップ
---------------------------------------- */
.l-account {
  position: fixed;
  top: 20px;
  right: 96px;
  z-index: 110;
}
.l-account__btn {
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #5A7256;
  color: #FFFFFF;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.l-account__btn:hover {
  background-color: rgb(78.525, 99.465, 75.035);
}
.l-account__icon {
  display: block;
  width: 26px;
  height: 26px;
}
.l-account {
  /* ドロップダウン＝白カード（下向き）。既定は非表示、.is-open で出現 */
}
.l-account__menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 168px;
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.18);
  border-radius: 14px;
  padding: 6px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s;
}
.l-account__link {
  display: block;
  padding: 12px 16px;
  border-radius: 9px;
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.02em;
  color: #8B6B4E;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color 0.2s ease;
}
.l-account__link + .l-account__link {
  margin-top: 2px;
}
.l-account__link:hover {
  background-color: rgba(139, 107, 78, 0.07);
}
.l-account.is-open .l-account__menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.l-account {
  /* ハンバーガー(ドロワー)を開いた時は反転：白地×緑アイコン（2026-07-14 Sone指示） */
}
body.is-drawer-open .l-account__btn {
  background-color: #FFFFFF;
  color: #5A7256;
}
@media screen and (max-width: 767px) {
  .l-account {
    top: 14px;
    right: 76px;
  }
  .l-account__btn {
    width: 52px;
    height: 52px;
  }
  .l-account__btn img {
    width: 23px;
    height: 23px;
  }
}

/* ----------------------------------------
  ドロワーメニュー
  右上（バーガー中心）を起点に円形で覆う
  PC＝右側パネルのみ（背面はオーバーレイで暗転）／SP＝全画面
---------------------------------------- */
.l-drawer {
  position: fixed;
  inset: 0 0 0 auto;
  width: min(620px, 100vw);
  z-index: 100;
  height: 100dvh;
  overflow-y: auto;
  background-color: #5A7256;
  /* バーガー中心（右から54px・上から50px）を起点に閉じている */
  clip-path: circle(0px at calc(100% - 54px) 50px);
  visibility: hidden;
  transition: clip-path 0.6s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.6s;
}
.l-drawer.is-open {
  /* パネル対角を覆い切る半径（150%でカバー） */
  clip-path: circle(150% at calc(100% - 54px) 50px);
  visibility: visible;
}
.l-drawer__inner {
  max-width: 680px;
  margin-inline: auto;
  padding: 96px clamp(24px, 3vw, 44px) 48px;
}
.l-drawer {
  /* ①主要6項目：2カラムグリッド */
}
.l-drawer__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}
.l-drawer__grid li {
  /* スタッガー表示の初期状態 */
  opacity: 0;
  transform: translateY(10px);
}
.l-drawer.is-open .l-drawer__grid li {
  animation: drawer-rise 0.45s ease both;
}
.l-drawer.is-open .l-drawer__grid li:nth-child(1) {
  animation-delay: 0.29s;
}
.l-drawer.is-open .l-drawer__grid li:nth-child(2) {
  animation-delay: 0.33s;
}
.l-drawer.is-open .l-drawer__grid li:nth-child(3) {
  animation-delay: 0.37s;
}
.l-drawer.is-open .l-drawer__grid li:nth-child(4) {
  animation-delay: 0.41s;
}
.l-drawer.is-open .l-drawer__grid li:nth-child(5) {
  animation-delay: 0.45s;
}
.l-drawer.is-open .l-drawer__grid li:nth-child(6) {
  animation-delay: 0.49s;
}
.l-drawer {
  /* ②ノトイエ日誌カード（最新お知らせ3件・参考画像のTOPICSカード相当） */
}
.l-drawer__diary {
  margin-top: 22px;
  padding: 22px 26px 8px;
  background-color: #F8F5F0;
  border-radius: 14px;
  opacity: 0;
}
.l-drawer.is-open .l-drawer__diary {
  animation: drawer-rise 0.45s ease 0.55s both;
}
.l-drawer__diaryTitle {
  display: block;
  text-align: center;
  font-weight: 700;
  font-size: 17px;
  letter-spacing: 0.12em;
  color: #2B2B2B;
  padding-bottom: 12px;
}
.l-drawer__diaryList li {
  border-top: 1px solid rgba(126, 155, 122, 0.4);
}
.l-drawer__diaryList a {
  display: block;
  padding: 12px 2px 14px;
}
.l-drawer__diaryText {
  display: block;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.6;
  color: #2B2B2B;
}
.l-drawer__diaryDate {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  color: rgba(43, 43, 43, 0.55);
}
.l-drawer {
  /* ③シンプルリンク（下線＋ > のみ） */
}
.l-drawer__simple {
  margin-top: 22px;
}
.l-drawer__simple li {
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  opacity: 0;
}
.l-drawer__simple a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 6px;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.12em;
  color: #FFFFFF;
}
.l-drawer.is-open .l-drawer__simple li {
  animation: drawer-rise 0.45s ease both;
}
.l-drawer.is-open .l-drawer__simple li:nth-child(1) {
  animation-delay: 0.67s;
}
.l-drawer.is-open .l-drawer__simple li:nth-child(2) {
  animation-delay: 0.72s;
}
.l-drawer.is-open .l-drawer__simple li:nth-child(3) {
  animation-delay: 0.77s;
}
.l-drawer.is-open .l-drawer__simple li:nth-child(4) {
  animation-delay: 0.82s;
}
.l-drawer {
  /* ④CTA行：2カラム（アイコン付き） */
}
.l-drawer__cta {
  display: flex;
  gap: 14px;
  margin-top: 22px;
  opacity: 0;
}
.l-drawer__cta .c-drawerBtn {
  flex: 1;
}
.l-drawer.is-open .l-drawer__cta {
  animation: drawer-rise 0.45s ease 0.85s both;
}
@media screen and (max-width: 767px) {
  .l-drawer {
    clip-path: circle(0px at calc(100% - 40px) 40px);
  }
  .l-drawer.is-open {
    clip-path: circle(150% at calc(100% - 40px) 40px);
  }
  .l-drawer__inner {
    padding: 84px 24px 40px;
  }
  .l-drawer__grid {
    gap: 10px;
  }
  .l-drawer__diary {
    padding: 18px 18px 4px;
  }
}

@keyframes drawer-rise {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* ----------------------------------------
  ドロワー項目ボタン（c-drawerBtn）
  参考画像準拠：アウトライン角丸＋ラベル左＋破線区切り＋アイコン右
---------------------------------------- */
.c-drawerBtn {
  display: flex;
  align-items: center;
  height: 64px;
  border: 1.5px solid #FFFFFF;
  border-radius: 14px;
  color: #FFFFFF;
  background-color: transparent;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.c-drawerBtn__label {
  flex: 1;
  padding-left: 26px;
  text-align: left;
  font-weight: 700;
  font-size: 17px;
  letter-spacing: 0.12em;
}
.c-drawerBtn__icon {
  position: relative;
  width: 62px;
  align-self: stretch;
  display: grid;
  place-items: center;
}
.c-drawerBtn__icon img {
  width: 22px;
  height: 22px;
}
.c-drawerBtn__icon {
  /* 白の破線区切り（FVナビボタンと同じ流儀） */
}
.c-drawerBtn__icon::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 34px;
  background: repeating-linear-gradient(to bottom, #FFFFFF 0 2px, transparent 2px 4px);
}
.c-drawerBtn:hover {
  opacity: 1;
  background-color: rgba(255, 255, 255, 0.12);
}
.c-drawerBtn {
  /* 塗りバージョン（ご予約CTA）：クリーム地＋テキストカラー文字（緑を白地に載せない・2026-07-07 Sone指示） */
}
.c-drawerBtn--fill {
  background-color: #F8F5F0;
  color: #2B2B2B;
  border-color: #F8F5F0;
  /* アイコン（白線SVG）はクリーム地で見えないため brightness(0) で黒（テキストカラー相当）に */
}
.c-drawerBtn--fill .c-drawerBtn__icon img {
  filter: brightness(0);
}
.c-drawerBtn--fill .c-drawerBtn__icon::before {
  background: repeating-linear-gradient(to bottom, rgba(43, 43, 43, 0.5) 0 2px, transparent 2px 4px);
}
.c-drawerBtn--fill:hover {
  background-color: rgba(248, 245, 240, 0.88);
}
.c-drawerBtn {
  /* LINEバージョン：ブランド緑地＋白文字（ロゴicon-line.svgはそのまま＝緑地に白マーク）2026-07-15 */
}
.c-drawerBtn--line {
  background-color: #06c755;
  border-color: #06c755;
  color: #FFFFFF;
}
.c-drawerBtn--line:hover {
  background-color: #05b64d;
}
@media screen and (max-width: 767px) {
  .c-drawerBtn {
    height: 58px;
    /* 2カラムで幅が狭いのでラベル・アイコンを圧縮（長いラベルは2行折返し） */
  }
  .c-drawerBtn__label {
    padding-left: 14px;
    font-size: 13px;
    letter-spacing: 0.06em;
    line-height: 1.4;
  }
  .c-drawerBtn__icon {
    width: 42px;
  }
  .c-drawerBtn__icon img {
    width: 18px;
    height: 18px;
  }
}

/* オーバーレイ（PC右パネル時の背面暗転・クリックで閉じる） */
.l-drawer-overlay {
  position: fixed;
  inset: 0;
  z-index: 95;
  background-color: rgba(0, 0, 0, 0.35);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.5s ease;
}
.l-drawer-overlay.is-open {
  opacity: 1;
  pointer-events: auto;
}
.l-drawer-overlay {
  /* SPはドロワーが全画面なので不要 */
}
@media screen and (max-width: 767px) {
  .l-drawer-overlay {
    display: none;
  }
}

/* ドロワー展開中は背面スクロール固定 */
body.is-drawer-open {
  overflow: hidden;
}

/******************************************************************************
*
* フッター（テック担当デザイン 2026-07-03）
* camp+iizuna 流をノトイエトークンで再現。
* 構成：情報アイコンカード3枚 → リンクリスト → ロゴ・施設情報。
* イラスト／アイコン優位・テキスト最小（英語版展開を見据える）。
* ※予約CTAは全ページ共通のフッター上CTA（template-parts/common/footer-cta.php ＝ project/_p-footer-cta.scss）に統一。
*
* 帯構成：ページ背景と連続するクリーム（$color-bg）。
* 罫線・下線は rgba($color-main, 0.4)。余白は $section-pad-y 基準。
* リセットCSS（img{width:100%}）対策で、アイコン画像は実寸をSCSSで明示。
*
******************************************************************************/
.l-footer {
  padding-top: clamp(64px, 6vw, 116px);
  padding-bottom: clamp(32px, 3vw, 48px);
  background-color: #F6F1E7;
}
.l-footer__inner {
  width: 100%;
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding-inline: 24px;
}
.l-footer {
  /* ---- 1段目：情報アイコンカード（3枚横並び・SPも横並びのまま縮小） ---- */
}
.l-footer__info {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(12px, 1.6vw, 28px);
}
.l-footer {
  /* ---- 2段目：その他ページのリンクリスト（PC2列／SP1列） ---- */
}
.l-footer__links {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: clamp(24px, 4vw, 72px);
  margin-top: clamp(40px, 4vw, 72px);
}
@media screen and (max-width: 767px) {
  .l-footer__links {
    grid-template-columns: 1fr;
  }
}
.l-footer {
  /* ---- 最下部：ロゴ・施設情報 ---- */
}
.l-footer__foot {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  margin-top: clamp(40px, 4vw, 72px);
}
.l-footer__logo {
  display: block;
  width: clamp(180px, 16vw, 230px);
}
.l-footer__logo img {
  width: 100%;
  height: auto;
}
.l-footer__name {
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: clamp(14px, 0.85vw, 16px);
  letter-spacing: 0.08em;
  color: #8B6B4E;
}
.l-footer__address {
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-size: clamp(14px, 0.85vw, 16px);
  color: #2B2B2B;
}
.l-footer {
  /* 旅館業営業許可（事実情報・2026-07-03 WF 316:2 反映） */
}
.l-footer__license {
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-size: 12px;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.7);
}
.l-footer__copyright {
  margin-top: 12px;
  font-family: "Poppins", sans-serif;
  letter-spacing: 0.06em;
}
.l-footer__copyright small {
  font-size: 12px;
  color: rgba(43, 43, 43, 0.7);
}

/******************************************************************************
* 1段目カード：情報アイコンカード（c-footerCard）
* ピーチ面（$color-bg2）＋中央に2色線画アイコン＋ラベル
******************************************************************************/
.c-footerCard {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(8px, 1vw, 16px);
  padding: clamp(20px, 2.4vw, 40px) 12px;
  height: 100%;
  background-color: #F5E3CB;
  border-radius: 16px;
  text-align: center;
  transition: transform 0.3s ease;
  /* SP：3枚横並び維持のためカード内左右余白を詰める（ラベル1行化のため） */
}
@media screen and (max-width: 767px) {
  .c-footerCard {
    padding-inline: 6px;
  }
}
.c-footerCard:hover {
  opacity: 1;
  transform: translateY(-4px);
}
.c-footerCard__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  /* リセットのimg{width:100%}を打ち消して実寸固定 */
}
.c-footerCard__icon img {
  width: clamp(36px, 3.4vw, 48px);
  height: auto;
}
.c-footerCard__label {
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: clamp(14px, 0.85vw, 16px);
  letter-spacing: 0.06em;
  line-height: 1.4;
  color: #2B2B2B;
  /* PHP側の<br>（「ノトイエ／について」の改行位置制御）はSPのみ有効。
     PCは1行で収まるため非表示 */
}
.c-footerCard__label br {
  display: none;
}
.c-footerCard__label {
  /* SP：単語途中の折返し防止。縮小＋字間詰めで
     「コテージ案内」「料金」を1行に収める（375px時カード内約90px） */
}
@media screen and (max-width: 767px) {
  .c-footerCard__label {
    font-size: 12px;
    letter-spacing: 0.02em;
  }
  .c-footerCard__label br {
    display: inline;
  }
}

/******************************************************************************
* 2段目：リンク行（c-footerLink）
* 左＝項目名（黒）／右端＝「＞」（c-arrowFlow・ブラウン・hoverでフローアニメ）
* 下ボーダー rgba($color-main,0.4)
******************************************************************************/
.c-footerLink {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: clamp(14px, 1.3vw, 20px) 4px;
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
  color: #8B6B4E;
}
.c-footerLink:hover {
  opacity: 1;
}
.c-footerLink:hover .c-footerLink__label {
  color: #7E9B7A;
}
.c-footerLink__label {
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: clamp(14px, 0.85vw, 16px);
  letter-spacing: 0.06em;
  color: #2B2B2B;
  transition: color 0.3s ease;
}

/******************************************************************************
*
* 追従CTAバー（l-floatBar）template-parts/common/float-bar.php
* 全ページ・画面下部固定。2026-07-14 再設計（Sone参考画像準拠）：
* - アイコン付きで 空室検索／LINE／お問い合わせ の3つを均等横並び。
* - ブラウン地＋白アイコン＋白ラベル（ノトイエのトーン・緑抑制ルール準拠＝ソリッドは緑でなくブラウン）。
* - セグメント間は細い白罫線で区切る。ホバーは押せる要素（全て<a>）＝わずかに明るく。
* - 会員登録・マイページはヘッダーの会員メニュー（l-account）へ移設。
* - 固定バー分、.l-site に下余白（バーがフッターを常時覆わない）。
*
******************************************************************************/
.l-floatBar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  background-color: #8B6B4E;
  padding-bottom: env(safe-area-inset-bottom);
}
.l-floatBar__inner {
  display: flex;
  align-items: stretch;
}
.l-floatBar__item {
  flex: 1 1 0;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: clamp(12px, 1.4vw, 18px) 6px;
  color: #FFFFFF;
  text-decoration: none;
  transition: background-color 0.2s ease;
  /* セグメント区切り＝細い白罫線 */
}
.l-floatBar__item + .l-floatBar__item {
  border-left: 1px solid rgba(255, 255, 255, 0.22);
}
.l-floatBar__item:hover {
  background-color: rgba(255, 255, 255, 0.09);
}
.l-floatBar__item {
  /* LINE＝公式ブランドカラー地（#06C755）。ロゴSVGはそのまま（緑地＋白マーク） */
}
.l-floatBar__item--line {
  background-color: #06c755;
}
.l-floatBar__item--line.l-floatBar__item + .l-floatBar__item--line {
  border-left-color: rgba(255, 255, 255, 0.3);
}
.l-floatBar__item--line + .l-floatBar__item {
  border-left-color: rgba(255, 255, 255, 0.3);
}
.l-floatBar__item--line:hover {
  background-color: #05b64d;
}
@media screen and (max-width: 767px) {
  .l-floatBar__item {
    flex-direction: column;
    gap: 3px;
    padding: 8px 4px;
  }
}
.l-floatBar__icon {
  display: inline-flex;
  flex-shrink: 0;
}
.l-floatBar__icon img {
  width: 24px;
  height: 24px;
  filter: brightness(0) invert(1);
}
.l-floatBar__icon {
  /* LINE公式ロゴ＝元の配色（緑地＋白）のまま。白化フィルタは掛けない */
}
.l-floatBar__icon--line img {
  filter: none;
  width: 26px;
  height: 26px;
}
@media screen and (max-width: 767px) {
  .l-floatBar__icon img {
    width: 21px;
    height: 21px;
  }
  .l-floatBar__icon--line img {
    width: 23px;
    height: 23px;
  }
}
.l-floatBar__label {
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: clamp(13px, 1.05vw, 15px);
  letter-spacing: 0.03em;
  line-height: 1.2;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  .l-floatBar__label {
    font-size: 11px;
    letter-spacing: 0.01em;
  }
}

/* 固定バーの高さ分、サイト下端に余白（フッターが常時隠れないように）＋iOS safe-area加算 */
.l-site {
  padding-bottom: calc(clamp(60px, 6vw, 72px) + env(safe-area-inset-bottom));
}
@media screen and (max-width: 767px) {
  .l-site {
    padding-bottom: calc(58px + env(safe-area-inset-bottom));
  }
}

/******************************************************************************
*
* セクションタイトル（c-sectionTitle）
* カンプ：英字=Poppins Bold 36 ブラウン／日本語=YuGothic Bold 56 テキスト色
* アニメーション本体は animation/_animation.scss（js-textSlideUp / js-fadeInUp）
*
******************************************************************************/
.c-sectionTitle {
  text-align: center;
}
.c-sectionTitle__en {
  display: block;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(26px, 1.9vw, 36px);
  letter-spacing: 0.01em;
  color: #8B6B4E;
}
.c-sectionTitle__jp {
  display: block;
  margin-top: 6px;
  text-wrap: balance;
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: clamp(30px, 2.9vw, 56px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.c-sectionTitle__jpSeg {
  display: inline-block;
}

/******************************************************************************
*
* ボタン（c-button）カンプ 628:199 準拠
* ブラウン角丸105・ラベル左・クリーム丸に「≫」
*
* 矢印アニメ（2026-07-02 Sone指定・第3版）：
*   矢印を2枚重ね、hoverで「1枚目が右へ退場」と同時に「2枚目が左から入場」
*   → 1本の連続した流れに見える（1枚方式だと退場と登場が別々＝2回流れて見えた）
*   hover解除 → 1枚目のbaseアニメ（arrow-in-left）が再適用されて左から登場
*
******************************************************************************/
.c-button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-width: clamp(300px, 22.7vw, 436px);
  height: clamp(74px, 5.6vw, 108px);
  padding: 0 clamp(14px, 0.95vw, 18px) 0 clamp(38px, 3.4vw, 65px);
  background-color: #8B6B4E;
  border-radius: 105px;
}
.c-button__label {
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: clamp(17px, 1.25vw, 24px);
  letter-spacing: 0.05em;
  line-height: 1;
  color: #F6F1E7;
}
.c-button {
  /* アイコン付き＝アイコン＋ラベルを左でグループ化（circleは右） */
}
.c-button__main {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.c-button__icon {
  display: inline-flex;
  flex-shrink: 0;
}
.c-button__icon img {
  width: clamp(22px, 1.8vw, 28px);
  height: auto;
}
.c-button {
  /* LINE＝公式ブランドカラー地＋白ラベル（ロゴはicon-line.svgのまま） */
}
.c-button--line {
  background-color: #06c755;
}
.c-button--line .c-button__label {
  color: #FFFFFF;
}
.c-button--line:hover {
  background-color: #05b64d;
}
.c-button__circle {
  position: relative;
  flex-shrink: 0;
  width: clamp(52px, 3.75vw, 72px);
  aspect-ratio: 1;
  border-radius: 50%;
  background-color: #F6F1E7;
  overflow: hidden;
}
.c-button__circle img {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 62.5%;
  height: 62.5%;
}
.c-button__circle {
  /* 1枚目＝メイン矢印（初回表示・hover解除時に左から入る） */
}
.c-button__circle img:nth-of-type(1) {
  animation: arrow-in-left 0.35s ease both;
}
.c-button__circle {
  /* 2枚目＝ゴースト（左に待機） */
}
.c-button__circle img:nth-of-type(2) {
  transform: translateX(-250%);
}
.c-button {
  /* 小サイズ（カンプ 721:1274＝359x84・丸64・矢印39） */
}
.c-button--small {
  min-width: 0;
  width: fit-content;
  gap: 40px;
  height: clamp(64px, 4.4vw, 84px);
  padding: 0 clamp(10px, 0.63vw, 12px) 0 clamp(24px, 1.7vw, 33px);
}
.c-button--small .c-button__circle {
  width: clamp(46px, 3.4vw, 64px);
}
.c-button:hover {
  opacity: 1;
  /* 同時スライド＝1本の連続した流れに見える */
}
.c-button:hover .c-button__circle img:nth-of-type(1) {
  animation: arrow-out-right 0.65s ease both;
}
.c-button:hover .c-button__circle img:nth-of-type(2) {
  animation: arrow-in-left 0.65s ease both;
}

/* 矢印が左から入ってくる（c-button / c-arrowLink 共用） */
@keyframes arrow-in-left {
  from {
    transform: translateX(-250%);
  }
  to {
    transform: translateX(0);
  }
}
/* 矢印が右へ出ていく（c-button / c-arrowLink 共用） */
@keyframes arrow-out-right {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(250%);
  }
}
/******************************************************************************
*
* テキストリンク（c-arrowLink）カンプ 707:1223 準拠
* 「詳細を見る」＋「≫」＋下線（幅146px）
* 矢印アニメは c-button と同じ（右へ退場→左から登場・arrow-in-left共用）
*
******************************************************************************/
.c-arrowLink {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-width: 146px;
  padding-bottom: 7px;
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
  color: #8B6B4E;
}
.c-arrowLink__label {
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.12em;
  line-height: 1;
}
.c-arrowLink__arrow {
  position: relative;
  width: 23px;
  height: 23px;
  overflow: hidden;
  flex-shrink: 0;
}
.c-arrowLink__arrow img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.c-arrowLink__arrow {
  /* 1枚目＝メイン／2枚目＝ゴースト（c-buttonと同じ2枚重ね方式） */
}
.c-arrowLink__arrow img:nth-of-type(1) {
  animation: arrow-in-left 0.35s ease both;
}
.c-arrowLink__arrow img:nth-of-type(2) {
  transform: translateX(-250%);
}
.c-arrowLink:hover {
  opacity: 1;
}
.c-arrowLink:hover .c-arrowLink__arrow img:nth-of-type(1) {
  animation: arrow-out-right 0.65s ease both;
}
.c-arrowLink:hover .c-arrowLink__arrow img:nth-of-type(2) {
  animation: arrow-in-left 0.65s ease both;
}

/******************************************************************************
*
* CSS描画チェブロン「＞」＋フローアニメ（c-arrowFlow）2026-07-03 Sone指示
* c-button / c-arrowLink の矢印アニメ（2枚重ね：hoverで1枚目が右へ退場・
* 同時に2枚目が左から入場＝1本の連続した流れ）と同じ実装パターンを、
* 画像を使わないCSS描画の「＞」に適用する共通部品。
*
* 使い方： <span class="c-arrowFlow" aria-hidden="true"></span> を <a> 内に置く
* 色＝currentColor（親リンクの color を継承）。
* 使用箇所：フッターリンク行／ドロワーのシンプルリンク／ノトイエ日誌の行
*
******************************************************************************/
.c-arrowFlow {
  position: relative;
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  overflow: hidden;
  /* チェブロン2枚（::before＝メイン／::after＝ゴースト） */
}
.c-arrowFlow::before, .c-arrowFlow::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  margin: -5.5px 0 0 -5.5px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
}
.c-arrowFlow {
  /* 1枚目＝メイン（初回表示・hover解除時に左から入る） */
}
.c-arrowFlow::before {
  animation: chevron-in-left 0.35s ease both;
}
.c-arrowFlow {
  /* 2枚目＝ゴースト（左に待機） */
}
.c-arrowFlow::after {
  transform: translateX(-250%) rotate(45deg);
}

/* hover＝親リンク側（同時スライド＝1本の連続した流れ・c-buttonと同じ0.65s） */
a:hover .c-arrowFlow::before,
button:hover .c-arrowFlow::before {
  animation: chevron-out-right 0.65s ease both;
}
a:hover .c-arrowFlow::after,
button:hover .c-arrowFlow::after {
  animation: chevron-in-left 0.65s ease both;
}

/* c-button の arrow-in-left / arrow-out-right と同じ動き。
   チェブロンは rotate(45deg) を保持する必要があるため専用keyframesにする
   （既存keyframesを使うと回転が消えて正方形が流れてしまう） */
@keyframes chevron-in-left {
  from {
    transform: translateX(-250%) rotate(45deg);
  }
  to {
    transform: translateX(0) rotate(45deg);
  }
}
@keyframes chevron-out-right {
  from {
    transform: translateX(0) rotate(45deg);
  }
  to {
    transform: translateX(250%) rotate(45deg);
  }
}
/******************************************************************************
*
* 共通部品：波形境界の横流れアニメ（c-waveFlow）2026-07-03
*
* 使い方（各セクションの波コンテナ内で同じ波imgを2枚並べる）：
*   <div class="p-xxx__wave" aria-hidden="true">        ← overflow:hidden 必須（各project側）
*     <span class="c-waveFlow">
*       <img src="wave-bg.svg" alt=""><img src="wave-bg.svg" alt="">
*     </span>
*   </div>
*
* 仕組み：
* - トラック（c-waveFlow）幅＝親幅。img2枚を flex(0 0 100%) で横連結し、
*   transform: translateX(-100%)（＝img1枚分）まで動かして無限ループ。
*   background-position ではなく transform（GPU合成・滑らか）。
* - シームレス条件：wave-bg(2).svg のパス両端が座標・接線とも同値であること。
*   現行パスは周期的Catmull-Romスプラインから生成（ノット6点・山3/谷2・
*   シーム(0,56)/(1920,56)・接線傾き-0.01）＝C1連続を構造保証。
*   再生成時は同条件を守ること（両端不一致だと継ぎ目に段差が出る）
* - 速度はゆったり32秒/ループ（「よく見ると動いている」程度）
* - 方向ルール（2026-07-03 Sone指示）：
*     セクション下端の波（features・cottages・voice下・CTA下）＝左流れ（基本）
*     セクション上端の波（voice上・CTA上）＝右流れ（--reverse付与）
* - img の寸法（width:100% / height:$wave-h）は既存の各 p-xxx__wave img 側で明示
*   （Safariの150px事故対策を維持。ここでは flex 挙動のみ定義）
*
******************************************************************************/
.c-waveFlow {
  display: flex;
  will-change: transform;
  animation: waveFlow 32s linear infinite;
}
.c-waveFlow img {
  flex: 0 0 100%;
  /* 端数レンダリング対策（2026-07-03）：
     imgの幅がデバイスピクセルに丸められると、つなぎ目に1px弱の
     隙間/段差が出ることがある → 2枚目を1px左に重ねて潰す。
     ループの整合はkeyframes側の +1px 補正とペア（下記参照） */
}
.c-waveFlow img + img {
  margin-left: -1px;
}
@media (prefers-reduced-motion: reduce) {
  .c-waveFlow {
    animation: none;
  }
}
.c-waveFlow {
  /* 逆方向＝右流れ（セクション上端に付く波用）
     keyframesの両端（0%=1枚目が0..100%／100%=2枚目が0..100%）は
     1px補正込みで「同一の絵」になるため、逆再生でも
     イテレーション境界（折り返しの瞬間）に絵のジャンプは出ない */
}
.c-waveFlow--reverse {
  animation-direction: reverse;
}

@keyframes waveFlow {
  to {
    /* 移動量＝トラック幅(-100%) + 1px（2枚目の-1px重ね分の補正）。
       終端で2枚目がちょうど0..100%に来る＝開始フレームの1枚目と同絵
       → ループの継ぎ目もジャンプ無し */
    transform: translateX(calc(-100% + 1px));
  }
}
/******************************************************************************
*
* 共通部品：フォトスライダー（横流れマーキー・c-photoSlider）2026-07-14
*
* 仕組み（c-waveFlow と同思想）：
* - トラックに同じ画像セットを2回出力（PHP側）。トラック幅＝2セット分。
*   translateX(0 → -50%) で「1セット分」ちょうど流す＝継ぎ目でジャンプ無しの無限ループ。
* - 継ぎ目の整合条件：全 item が同じ幅＋同じ右マージンであること（gap でなく
*   margin-right で間隔を作る。最後の item にも右マージンを付け、-50% が
*   1セット幅ぴったりに一致させる）。
* - 速度は PHP が枚数から算出した --pslider-duration（1枚≒5秒）。
* - reduced-motion 時は自動送りを止め、overflow-x スクロールで手動閲覧可。
*
******************************************************************************/
.c-photoSlider {
  overflow: hidden;
  /* 両端をふわっと消して「まだ続く」感を出す（対応外ブラウザは素通り） */
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.c-photoSlider__track {
  display: flex;
  width: max-content;
  will-change: transform;
  animation: photoSliderFlow var(--pslider-duration, 80s) linear infinite;
}
.c-photoSlider__track--reverse {
  animation-direction: reverse;
}
.c-photoSlider__item {
  flex: 0 0 auto;
  width: clamp(320px, 34vw, 520px);
  margin-right: clamp(16px, 1.6vw, 28px);
  aspect-ratio: 4/3;
  border-radius: 18px;
  overflow: hidden;
  background-color: rgba(126, 155, 122, 0.06);
}
.c-photoSlider__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .c-photoSlider__item {
    width: calc(40vw - 12px);
    margin-right: 12px;
    border-radius: 12px;
  }
}
.c-photoSlider {
  /* 動きを減らす設定：自動送りを止め、指/トラックパッドで手動スクロール */
}
@media (prefers-reduced-motion: reduce) {
  .c-photoSlider {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .c-photoSlider .c-photoSlider__track {
    animation: none;
  }
}

@keyframes photoSliderFlow {
  to {
    /* 2セット出力の「1セット分」＝トラック全幅の半分 */
    transform: translateX(-50%);
  }
}
/******************************************************************************
*
* 下層ページ共通：ページヘッダー（c-pageHeader）2026-07-03
* カンプ無し・テック担当デザイン。今後の下層ページで使い回す。
* - ピーチ帯（$color-bg2）＋タイトル（c-sectionTitleを h1 で流用）＋パンくず
* - 下端は波形境界（クリーム・c-waveFlow＝下端の波は左流れ）
* - 追従ヘッダー（fixed 76px/SP60px）に隠れないよう上パディングで逃がす
*
******************************************************************************/
.c-pageHeader {
  background-color: #F5E3CB;
}
.c-pageHeader__inner {
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding: clamp(100px, 9vw, 150px) 24px clamp(28px, 3vw, 48px);
}
@media screen and (max-width: 767px) {
  .c-pageHeader__inner {
    padding: 84px 16px 24px;
  }
}
.c-pageHeader {
  /* ---------- パンくず ---------- */
}
.c-pageHeader__breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 4px 0;
}
.c-pageHeader__breadcrumb li {
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-size: 12px;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.7);
  /* 区切り「＞」 */
}
.c-pageHeader__breadcrumb li + li::before {
  content: "＞";
  margin-inline: 10px;
  color: rgba(139, 107, 78, 0.6);
}
.c-pageHeader__breadcrumb li a {
  color: #8B6B4E;
  font-weight: 700;
}
.c-pageHeader__breadcrumb li a:hover {
  opacity: 1;
  color: #7E9B7A;
}
.c-pageHeader {
  /* ---------- タイトル（c-sectionTitle流用） ---------- */
}
.c-pageHeader__title {
  margin-top: clamp(14px, 1.4vw, 24px);
}
.c-pageHeader {
  /* ---------- 波形境界（ピーチ→クリーム） ---------- */
}
.c-pageHeader__wave {
  line-height: 0;
  overflow: hidden;
}
.c-pageHeader__wave img {
  display: block;
  width: 100%;
  height: clamp(40px, 5.2vw, 100px);
}
@media screen and (max-width: 767px) {
  .c-pageHeader__wave img {
    height: 30px;
  }
}

/******************************************************************************
*
* 共通部品：足あとトレイル（c-pawTrail）2026-07-03
* TOP features の肉球トレイル（斜め上がり・カンプ実測座標）を共通化。
* 向きルール：SVG素の向き＝爪が左上 → CSS一括 rotate(90deg) で「爪が右上」
* （2026-07-02 Sone指定。装飾の向きは言葉で正解確認してから合わせる）
* 使い方：position:absolute で置くため、親に position:relative ＋
*         ページ側の修飾クラスで left/top/width を指定する
*
******************************************************************************/
.c-pawTrail {
  position: absolute;
  width: clamp(180px, 16vw, 320px);
  aspect-ratio: 375/260;
  pointer-events: none;
  z-index: 1;
}
.c-pawTrail img {
  position: absolute;
  width: 12.8%;
  height: auto;
  transform: rotate(90deg);
  opacity: 0.85;
}
.c-pawTrail {
  /* カンプ実測座標（原点=トレイル左上・375x260基準・features.phpと同値） */
}
.c-pawTrail img:nth-child(1) {
  left: 0%;
  top: 81.5%;
}
.c-pawTrail img:nth-child(2) {
  left: 1.3%;
  top: 54.6%;
}
.c-pawTrail img:nth-child(3) {
  left: 23.5%;
  top: 70%;
}
.c-pawTrail img:nth-child(4) {
  left: 48.5%;
  top: 59.2%;
}
.c-pawTrail img:nth-child(5) {
  left: 26.9%;
  top: 45%;
}
.c-pawTrail img:nth-child(6) {
  left: 65.6%;
  top: 43.5%;
}
.c-pawTrail img:nth-child(7) {
  left: 46.9%;
  top: 29.2%;
}
.c-pawTrail img:nth-child(8) {
  left: 84.5%;
  top: 25.4%;
}
.c-pawTrail img:nth-child(9) {
  left: 69.9%;
  top: 18.5%;
}
.c-pawTrail img:nth-child(10) {
  left: 87.2%;
  top: 0%;
}

/* =============================================================
   c-lightbox — 画像拡大表示（コテージ詳細ギャラリー）2026-07-15
   JS(script.js §10)が body 直下に生成。.is-open で表示。
   ============================================================= */
.c-lightbox {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: clamp(16px, 4vw, 48px);
  background-color: rgba(0, 0, 0, 0.82);
}
.c-lightbox.is-open {
  display: flex;
}
.c-lightbox__stage {
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 92vw;
  max-height: 86vh;
}
.c-lightbox__img {
  width: auto;
  height: auto;
  max-width: 92vw;
  max-height: 86vh;
  object-fit: contain;
  border-radius: 6px;
  box-shadow: 0 12px 44px rgba(0, 0, 0, 0.45);
  cursor: default;
  user-select: none;
  -webkit-user-drag: none;
}
.c-lightbox__close {
  position: absolute;
  top: clamp(10px, 2vw, 24px);
  right: clamp(10px, 2vw, 24px);
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  line-height: 1;
  color: #fff;
  background-color: rgba(255, 255, 255, 0.14);
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.c-lightbox__close:hover {
  background-color: rgba(255, 255, 255, 0.26);
}
.c-lightbox__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: #fff;
  background-color: rgba(255, 255, 255, 0.14);
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.c-lightbox__nav:hover {
  background-color: rgba(255, 255, 255, 0.26);
}
.c-lightbox__nav--prev {
  left: clamp(8px, 2vw, 28px);
}
.c-lightbox__nav--next {
  right: clamp(8px, 2vw, 28px);
}

/******************************************************************************
*
* Utility（!importantなし、安全設計）
*
******************************************************************************/
/* ----------------------------------------
  テキスト
---------------------------------------- */
.u-text-left {
  text-align: left;
}

.u-text-center {
  text-align: center;
}

.u-text-right {
  text-align: right;
}

.u-fw-bold {
  font-weight: 700;
}

.u-fw-medium {
  font-weight: 500;
}

.u-fw-regular {
  font-weight: 400;
}

.u-nowrap {
  white-space: nowrap;
}

.u-break-all {
  word-break: break-all;
}

.u-break-word {
  overflow-wrap: anywhere;
}

/* ----------------------------------------
  レスポンシブ文字スタイル（opt-in）
  - foundation/_mixin.scss の responsive-font-style() を必要箇所だけに適用
  - a / div にグローバル適用しない代替
---------------------------------------- */
.u-rfs-a {
  font-size: clamp(14px, 0.2588996764vw + 13.0291262136px, 18px);
  line-height: 220%;
}

.u-rfs-div {
  font-size: clamp(14px, 0.1294498382vw + 13.5145631068px, 16px);
  line-height: 220%;
}

/* フォントファミリー切替（必要箇所のみ） */
.u-font-main {
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
}

.u-font-en {
  font-family: "Barlow Semi Condensed", "Poppins", sans-serif;
}

/* ----------------------------------------
  表示制御
---------------------------------------- */
.u-hidden {
  display: none;
}

.u-block {
  display: block;
}

.u-inline {
  display: inline;
}

.u-inline-block {
  display: inline-block;
}

.u-flex {
  display: flex;
}

.u-inline-flex {
  display: inline-flex;
}

.u-grid {
  display: grid;
}

/* ----------------------------------------
  Flex補助（必要なときだけ）
---------------------------------------- */
.u-flex-wrap {
  flex-wrap: wrap;
}

.u-flex-nowrap {
  flex-wrap: nowrap;
}

.u-jc-start {
  justify-content: flex-start;
}

.u-jc-center {
  justify-content: center;
}

.u-jc-end {
  justify-content: flex-end;
}

.u-jc-between {
  justify-content: space-between;
}

.u-jc-around {
  justify-content: space-around;
}

.u-jc-evenly {
  justify-content: space-evenly;
}

.u-ai-start {
  align-items: flex-start;
}

.u-ai-center {
  align-items: center;
}

.u-ai-end {
  align-items: flex-end;
}

.u-ai-stretch {
  align-items: stretch;
}

.u-fd-row {
  flex-direction: row;
}

.u-fd-column {
  flex-direction: column;
}

/* ----------------------------------------
  Grid補助（軽量）
---------------------------------------- */
.u-place-center {
  place-items: center;
}

.u-place-start {
  place-items: start;
}

.u-grid-col-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.u-grid-col-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.u-grid-col-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.u-grid-auto {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

/* ----------------------------------------
  Gap（flex/grid共通）
---------------------------------------- */
.u-gap-8 {
  gap: 0.5rem;
}

.u-gap-12 {
  gap: 0.75rem;
}

.u-gap-16 {
  gap: 1rem;
}

.u-gap-24 {
  gap: 1.5rem;
}

.u-gap-32 {
  gap: 2rem;
}

.u-gap-40 {
  gap: 2.5rem;
}

/* ----------------------------------------
  余白（Spacing Scale）
  - 8px刻みベース（0 / 8 / 16 / 24 / 32 / 40 / 48 / 56 / 64）
  - 既存 u-mb-16 等とも整合
---------------------------------------- */
/* margin */
.u-m-0 {
  margin: 0;
}

.u-mt-0 {
  margin-top: 0;
}

.u-mt-8 {
  margin-top: 0.5rem;
}

.u-mt-16 {
  margin-top: 1rem;
}

.u-mt-24 {
  margin-top: 1.5rem;
}

.u-mt-32 {
  margin-top: 2rem;
}

.u-mt-40 {
  margin-top: 2.5rem;
}

.u-mt-48 {
  margin-top: 3rem;
}

.u-mt-56 {
  margin-top: 3.5rem;
}

.u-mt-64 {
  margin-top: 4rem;
}

.u-mb-0 {
  margin-bottom: 0;
}

.u-mb-8 {
  margin-bottom: 0.5rem;
}

.u-mb-16 {
  margin-bottom: 1rem;
}

.u-mb-24 {
  margin-bottom: 1.5rem;
}

.u-mb-32 {
  margin-bottom: 2rem;
}

.u-mb-40 {
  margin-bottom: 2.5rem;
}

.u-mb-48 {
  margin-bottom: 3rem;
}

.u-mb-56 {
  margin-bottom: 3.5rem;
}

.u-mb-64 {
  margin-bottom: 4rem;
}

.u-ml-0 {
  margin-left: 0;
}

.u-ml-8 {
  margin-left: 0.5rem;
}

.u-ml-16 {
  margin-left: 1rem;
}

.u-ml-24 {
  margin-left: 1.5rem;
}

.u-ml-32 {
  margin-left: 2rem;
}

.u-ml-40 {
  margin-left: 2.5rem;
}

.u-mr-0 {
  margin-right: 0;
}

.u-mr-8 {
  margin-right: 0.5rem;
}

.u-mr-16 {
  margin-right: 1rem;
}

.u-mr-24 {
  margin-right: 1.5rem;
}

.u-mr-32 {
  margin-right: 2rem;
}

.u-mr-40 {
  margin-right: 2.5rem;
}

/* margin-inline / margin-block */
.u-mx-auto {
  margin-inline: auto;
}

.u-mx-0 {
  margin-inline: 0;
}

.u-mx-16 {
  margin-inline: 1rem;
}

.u-mx-24 {
  margin-inline: 1.5rem;
}

.u-my-0 {
  margin-block: 0;
}

.u-my-16 {
  margin-block: 1rem;
}

.u-my-24 {
  margin-block: 1.5rem;
}

/* padding */
.u-p-0 {
  padding: 0;
}

.u-pt-0 {
  padding-top: 0;
}

.u-pt-8 {
  padding-top: 0.5rem;
}

.u-pt-16 {
  padding-top: 1rem;
}

.u-pt-24 {
  padding-top: 1.5rem;
}

.u-pt-32 {
  padding-top: 2rem;
}

.u-pt-40 {
  padding-top: 2.5rem;
} /* 既存互換 */
.u-pt-48 {
  padding-top: 3rem;
}

.u-pt-56 {
  padding-top: 3.5rem;
}

.u-pt-64 {
  padding-top: 4rem;
}

.u-pb-0 {
  padding-bottom: 0;
}

.u-pb-8 {
  padding-bottom: 0.5rem;
}

.u-pb-16 {
  padding-bottom: 1rem;
}

.u-pb-24 {
  padding-bottom: 1.5rem;
}

.u-pb-32 {
  padding-bottom: 2rem;
}

.u-pb-40 {
  padding-bottom: 2.5rem;
} /* 既存互換 */
.u-pb-48 {
  padding-bottom: 3rem;
}

.u-pb-56 {
  padding-bottom: 3.5rem;
}

.u-pb-64 {
  padding-bottom: 4rem;
}

.u-px-0 {
  padding-inline: 0;
}

.u-px-16 {
  padding-inline: 1rem;
}

.u-px-24 {
  padding-inline: 1.5rem;
}

.u-px-32 {
  padding-inline: 2rem;
}

.u-py-0 {
  padding-block: 0;
}

.u-py-16 {
  padding-block: 1rem;
}

.u-py-24 {
  padding-block: 1.5rem;
}

.u-py-32 {
  padding-block: 2rem;
}

/* ----------------------------------------
  幅・高さ
---------------------------------------- */
.u-w-100 {
  width: 100%;
}

.u-w-auto {
  width: auto;
}

.u-maxw-100 {
  max-width: 100%;
}

.u-w-fit {
  width: fit-content;
}

.u-w-max {
  width: max-content;
}

.u-h-100 {
  height: 100%;
}

/* ----------------------------------------
  色
---------------------------------------- */
/* notoieのデザイントークンに合わせて調整（keldsen版から変更） */
.u-color-main {
  color: #7E9B7A;
}

.u-color-main-dark {
  color: #8B6B4E;
}

.u-bg-main {
  background-color: #7E9B7A;
}

.u-bg-main-dark {
  background-color: #8B6B4E;
}

.u-bg-base {
  background-color: #F6F1E7;
}

/* ----------------------------------------
  その他
---------------------------------------- */
.u-radius-8 {
  border-radius: 0.5rem;
}

.u-radius-16 {
  border-radius: 1rem;
}

.u-shadow-sm {
  box-shadow: none;
} /* 影は全廃（2026-07-15 Sone指示） */
/* ----------------------------------------
  アクセシビリティ
---------------------------------------- */
.u-visuallyHidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/******************************************************************************
*
* アニメーション共通（サイト全体で再利用）
* camplus.camp のタイトルアニメーションを移植（2026-07-02 Sone指示・丸パクリ）
* 発火＝script.js の IntersectionObserver が .js-action を付与
*
* 使い方：
*   英字1文字ずつスライドアップ： <span class="js-textSlideUp"><span>C</span>...</span>
*   全体ふわっとフェードアップ：   <span class="js-fadeInUp">テキスト</span>
*
******************************************************************************/
/* ふわっとフェードアップ */
.js-fadeInUp {
  display: block;
  transform: translate3d(0, 40px, 0);
  opacity: 0;
  transition: 0.6s cubic-bezier(0.23, 1, 0.32, 1);
}
.js-fadeInUp.js-action {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

/* 英字1文字ずつスライドアップ（オーバーシュート付き） */
.js-textSlideUp {
  line-height: 1;
  height: 1.4em;
  overflow: hidden;
}
.js-textSlideUp span {
  display: inline-block;
  vertical-align: top;
  transform: translate3d(0, 140%, 0);
}
.js-textSlideUp.js-action span {
  animation: textSlideUp 0.9s cubic-bezier(0.23, 1, 0.32, 1) both;
}
.js-textSlideUp {
  /* 文字送りディレイ（camplus準拠：0.05s刻み・最大20文字） */
}
.js-textSlideUp span:nth-child(1) {
  animation-delay: 0.05s;
}
.js-textSlideUp span:nth-child(2) {
  animation-delay: 0.1s;
}
.js-textSlideUp span:nth-child(3) {
  animation-delay: 0.15s;
}
.js-textSlideUp span:nth-child(4) {
  animation-delay: 0.2s;
}
.js-textSlideUp span:nth-child(5) {
  animation-delay: 0.25s;
}
.js-textSlideUp span:nth-child(6) {
  animation-delay: 0.3s;
}
.js-textSlideUp span:nth-child(7) {
  animation-delay: 0.35s;
}
.js-textSlideUp span:nth-child(8) {
  animation-delay: 0.4s;
}
.js-textSlideUp span:nth-child(9) {
  animation-delay: 0.45s;
}
.js-textSlideUp span:nth-child(10) {
  animation-delay: 0.5s;
}
.js-textSlideUp span:nth-child(11) {
  animation-delay: 0.55s;
}
.js-textSlideUp span:nth-child(12) {
  animation-delay: 0.6s;
}
.js-textSlideUp span:nth-child(13) {
  animation-delay: 0.65s;
}
.js-textSlideUp span:nth-child(14) {
  animation-delay: 0.7s;
}
.js-textSlideUp span:nth-child(15) {
  animation-delay: 0.75s;
}
.js-textSlideUp span:nth-child(16) {
  animation-delay: 0.8s;
}
.js-textSlideUp span:nth-child(17) {
  animation-delay: 0.85s;
}
.js-textSlideUp span:nth-child(18) {
  animation-delay: 0.9s;
}
.js-textSlideUp span:nth-child(19) {
  animation-delay: 0.95s;
}
.js-textSlideUp span:nth-child(20) {
  animation-delay: 1s;
}

@keyframes textSlideUp {
  0% {
    transform: translate3d(0, 140%, 0);
  }
  60% {
    transform: translate3d(0, -10%, 0);
  }
  100% {
    transform: translate3d(0, 0%, 0);
  }
}
/******************************************************************************
*
* TOPページ（p-top）
* Figmaカンプ：628:8 準拠
*
******************************************************************************/
.p-top {
  overflow: clip;
}

/* ============================================================
  ヒーロー（FV）
  カンプ実測値（1920px基準）：
  - 左レール 335px（x=32）／写真 1446x876（x=414, y=103, 角丸30）
  - ナビボタン 335x83 角丸10 グリーン／ボタン間 21px
  - 天気バッジ 195x119（写真左上・切り欠き #F8F5F0）
  - キャッチパネル 568x273（写真右下・切り欠き #F8F5F0・左上角丸50）
============================================================ */
.p-hero {
  background-color: #F6F1E7;
  padding: 22px 60px clamp(60px, 6.5vw, 124px) 32px;
}
.p-hero__inner {
  display: flex;
  gap: clamp(24px, 2.4vw, 47px);
  max-width: 2550px;
  margin-inline: auto;
  /* 左レール（ロゴ＋縦ナビ）を写真エリアに対して上下中央揃え（2026-07-03 Sone指示）
     ※SPは縦積み（column）でcross軸が横向きになるためPC系のみ適用 */
}
@media screen and (min-width: 768px) {
  .p-hero__inner {
    align-items: center;
  }
}
.p-hero {
  /* ---------- 左レール（ロゴ＋ナビ） ----------
     画面の「高さ」に合わせて拡大縮小（vh基準・カンプ1080px時の実寸が基準値）
     335px/1080 ≒ 31vh、ボタン83px ≒ 7.7vh、間隔21px ≒ 1.95vh */
}
.p-hero__side {
  flex-shrink: 0;
  width: clamp(250px, 31vh, 460px);
}
.p-hero__logo {
  display: block;
  width: clamp(200px, 25vh, 370px);
  margin: 0 auto clamp(32px, 5.2vh, 78px) 10%;
}
.p-hero__logo img {
  display: block;
}
.p-hero__navList {
  display: flex;
  flex-direction: column;
  gap: clamp(14px, 1.95vh, 29px);
}
.p-hero__navRow {
  display: flex;
  gap: clamp(12px, 1.5vh, 22px);
  margin-top: clamp(14px, 1.95vh, 29px);
}
.p-hero__navRow .c-navBtn {
  flex: 1;
}
.p-hero {
  /* ---------- 写真エリア（スライドショー） ---------- */
}
.p-hero__stage {
  flex: 1;
  min-width: 0;
}
.p-hero__photo {
  position: relative;
  width: 100%;
  border-radius: 30px;
  aspect-ratio: 1446/876;
  max-height: calc(100dvh - 180px);
}
.p-hero {
  /* スライド：フェード切り替え（.is-active は script.js が制御） */
}
.p-hero__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1s ease;
  border-radius: inherit;
  overflow: hidden;
}
.p-hero__slide.is-active {
  opacity: 1;
}
.p-hero__photoImg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  user-select: none;
  -webkit-user-drag: none;
}
.p-hero {
  /* ページネーション（参照サイト風・写真の右下外側） */
}
.p-hero__dots {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 16px;
  padding-right: 8px;
  min-height: 12px;
}
.p-hero__dot {
  width: 12px;
  height: 12px;
  padding: 0;
  border: 1.5px solid #8B6B4E;
  border-radius: 50%;
  background-color: transparent;
  cursor: pointer;
  transition: background-color 0.3s ease;
}
.p-hero__dot.is-active {
  background-color: #8B6B4E;
}
.p-hero {
  /* 左上：天気バッジ（切り欠き風・リアルタイム天気） */
}
.p-hero__badge {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 140px;
  height: 80px;
  background-color: #F6F1E7;
  border-radius: 26px 0 30px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.p-hero__badgeWeather {
  display: flex;
  align-items: center;
  gap: 12px;
}
.p-hero__badgeIcon {
  width: 32px;
  height: 32px;
}
.p-hero {
  /* 気温（動的テキスト。カンプの「5°」SVG相当の見た目） */
}
.p-hero__badgeTemp {
  font-family: "Poppins", sans-serif;
  font-size: 32px;
  line-height: 1;
  color: #FF6F3F;
}
.p-hero__badgePlace {
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  color: #FF6F3F;
  letter-spacing: 0;
  line-height: 1;
}
.p-hero {
  /* 右下：キャッチパネル（切り欠き風） */
}
.p-hero__panel {
  position: absolute;
  right: 0;
  bottom: 0;
  width: min(568px, 45%);
  background-color: #F6F1E7;
  border-radius: 50px 0 26px 0;
  padding: clamp(24px, 2.2vw, 42px) 16px clamp(28px, 2.3vw, 45px) clamp(20px, 1.5vw, 28px);
}
.p-hero__catch {
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: clamp(28px, 2.9vw, 56px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
  white-space: nowrap;
}
.p-hero {
  /* ---------- タブレット以下（暫定：SPカンプ未作成のため仮対応） ---------- */
}
@media screen and (max-width: 767px) {
  .p-hero {
    padding: 16px 16px 64px;
  }
  .p-hero__inner {
    flex-direction: column;
  }
  .p-hero {
    /* 左レールのナビはSPでは出さない（ハンバーガーに集約・2026-07-02 Sone確定）
       ロゴだけ残す（参照サイト準拠：バーガーと反対側にロゴ） */
  }
  .p-hero__side {
    width: 100%;
  }
  .p-hero__nav {
    display: none;
  }
  .p-hero__logo {
    width: 170px;
    margin: 0 0 14px;
  }
  .p-hero__photo {
    border-radius: 20px;
    aspect-ratio: 3/4;
    max-height: none;
  }
  .p-hero {
    /* 天気バッジ＝SPは小さめに（2026-07-15 Sone指示） */
  }
  .p-hero__badge {
    width: 112px;
    height: 62px;
    border-radius: 16px 0 20px 0;
    gap: 2px;
  }
  .p-hero__badge img {
    width: 19px;
    height: auto;
  }
  .p-hero__badgeWeather {
    gap: 7px;
  }
  .p-hero__badgeTemp {
    font-size: 22px;
  }
  .p-hero__badgePlace {
    font-size: 11px;
  }
  .p-hero {
    /* パネル＝右寄せで左に写真をのぞかせる・左上のみ大きめ角丸
       （2026-07-02 Sone提示のFV画像準拠） */
  }
  .p-hero__panel {
    width: 88%;
    border-radius: 40px 0 16px 0;
    padding: 16px 0px 0px 18px;
  }
  .p-hero__catch {
    white-space: normal;
    font-size: 30px;
  }
  .p-hero__dots {
    justify-content: flex-end;
    padding-right: 4px;
  }
}

/* ============================================================
  ナビボタン（c-navBtn）
  大：ラベル中央＋白破線区切り＋アイコン（右端67px）
  小：アイコン上・ラベル下（--small）
============================================================ */
.c-navBtn {
  display: flex;
  align-items: center;
  height: clamp(58px, 7.7vh, 108px);
  background-color: #7E9B7A;
  border-radius: 10px;
  color: #FFFFFF;
}
.c-navBtn__label {
  flex: 1;
  text-align: center;
  font-size: clamp(15px, 1.85vh, 26px);
  font-weight: 700;
  line-height: 1.5;
}
.c-navBtn__icon {
  position: relative;
  width: clamp(48px, 6.2vh, 88px);
  align-self: stretch;
  display: grid;
  place-items: center;
  /* リセットの img{width:100%} 対策：アイコン実寸ベースの上限を明示 */
}
.c-navBtn__icon img {
  width: clamp(17px, 2.25vh, 32px);
  height: clamp(17px, 2.25vh, 32px);
}
.c-navBtn__icon {
  /* 白の破線区切り（カンプ Line 95〜99：dasharray 2 2） */
}
.c-navBtn__icon::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: clamp(38px, 5vh, 70px);
  background: repeating-linear-gradient(to bottom, #FFFFFF 0 2px, transparent 2px 4px);
}
.c-navBtn {
  /* 小ボタン（アクセス／ご予約）：アイコン上・ラベル下 */
}
.c-navBtn--small {
  flex-direction: column;
  justify-content: center;
  gap: 2px;
}
.c-navBtn--small .c-navBtn__label {
  flex: none;
}
.c-navBtn--small .c-navBtn__icon {
  width: auto;
  align-self: auto;
}
.c-navBtn--small .c-navBtn__icon::before {
  content: none;
}

/******************************************************************************
*
* TOP：重要なお知らせ（p-news）template-parts/sections/top/news.php
* ファーストビュー直下・最大3件（該当時のみ出力）。2026-07-08 T-6 → 同日デザイン刷新（Sone FB）。
* - ヒーロー下の死に余白を詰める（負マージンでヒーロー下パディングに少し重ね、締める）。
* - 箱＝白・角丸・柔らかい影で上品に浮かせる。ラベルは英字eyebrow＋日本語＋縦罫線で洗練。
* - 日付＝Poppins・ブラウン。リンクは押せる要素＝ホバー可（減光なし）。緑抑制。
*
******************************************************************************/
.p-news {
  position: relative;
  z-index: 2;
  padding-bottom: clamp(44px, 5vw, 76px);
}
.p-news__inner {
  max-width: 960px;
  margin-inline: auto;
  padding: 0 24px;
  margin-top: clamp(-64px, -4.5vw, -40px);
}
@media screen and (max-width: 767px) {
  .p-news__inner {
    padding: 0 16px;
    margin-top: -24px;
  }
}
.p-news__box {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: clamp(18px, 2vw, 32px);
  padding: clamp(16px, 1.8vw, 22px) clamp(22px, 2.4vw, 34px);
  background-color: #FFFFFF;
  border-radius: 16px;
  border: 1px solid rgba(126, 155, 122, 0.4);
}
@media screen and (max-width: 767px) {
  .p-news__box {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 18px 18px;
  }
}
.p-news {
  /* ラベル＝英字eyebrow＋日本語＋右の縦罫線（洗練・チャンキーな塗りpillをやめる） */
}
.p-news__label {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-right: clamp(18px, 2vw, 30px);
  border-right: 1px solid rgba(126, 155, 122, 0.4);
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  .p-news__label {
    flex-direction: row;
    align-items: baseline;
    gap: 10px;
    padding-right: 0;
    padding-bottom: 12px;
    border-right: 0;
    border-bottom: 1px solid rgba(126, 155, 122, 0.4);
  }
}
.p-news__labelEn {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(11px, 0.85vw, 12px);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #8B6B4E;
}
.p-news__labelJp {
  font-weight: 700;
  font-size: clamp(13px, 1vw, 15px);
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-news__list {
  list-style: none;
  margin: 0;
  padding: 0;
  min-width: 0;
}
.p-news__item {
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
}
.p-news__item:last-child {
  border-bottom: 0;
}
.p-news {
  /* 各行＝日付＋タイトル＋矢印。押せる要素＝ホバー可（減光なし） */
}
.p-news__link {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: clamp(12px, 1.6vw, 22px);
  padding: clamp(9px, 1.1vw, 13px) 4px;
  text-decoration: none;
}
.p-news__link:hover .p-news__title {
  color: #8B6B4E;
}
.p-news__link:hover .c-arrowLink__arrow img:nth-of-type(1) {
  animation: arrow-out-right 0.65s ease both;
}
.p-news__link:hover .c-arrowLink__arrow img:nth-of-type(2) {
  animation: arrow-in-left 0.65s ease both;
}
@media screen and (max-width: 767px) {
  .p-news__link {
    grid-template-columns: auto 1fr;
    gap: 6px 12px;
  }
}
.p-news__date {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(12px, 0.9vw, 13px);
  letter-spacing: 0.04em;
  color: #8B6B4E;
  white-space: nowrap;
}
.p-news__title {
  min-width: 0;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: color 0.2s ease;
}
@media screen and (max-width: 767px) {
  .p-news__title {
    white-space: normal;
  }
}
.p-news {
  /* 矢印＝c-arrowLink__arrow（icon-arrow3.svg 2枚・「詳細を見る」と同じ）。基本スタイルは c-arrowLink 側。SPは非表示 */
}
@media screen and (max-width: 767px) {
  .p-news__arrow {
    display: none;
  }
}

/******************************************************************************
*
* TOP：特徴3コンセプト（p-features）
* Figmaカンプ 628:8 実測（1920px基準）：
* - 写真 960x540（画面半分ブリード・内側角丸30）を左右交互
* - テキスト：見出し36 ブラウン／本文16 黒 lh1.8・写真の縦中央
* - イラスト：①キャンプ道具（右下）②コテージ（左端見切れ）＋肉球トレイル
*             ③点描の山（右下）
* - 底辺は波形境界（camplus.camp 参照）でピーチ帯（$color-bg2）へ繋ぐ
*
******************************************************************************/
.p-features {
  position: relative;
  /* ---------- 行（写真＋テキスト） ---------- */
}
.p-features__row {
  position: relative;
  display: flex;
  align-items: stretch;
}
.p-features__row + .p-features__row {
  margin-top: clamp(48px, 5.5vw, 106px);
}
.p-features {
  /* ---------- 写真（半面ブリード・内側角丸30） ---------- */
}
.p-features__photo {
  position: relative;
  width: 50%;
  aspect-ratio: 960/540;
  overflow: hidden;
}
.p-features__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-features__photo--left {
  border-radius: 0 30px 30px 0;
}
.p-features__photo--right {
  border-radius: 30px 0 0 30px;
}
.p-features {
  /* BBQ写真プレースホルダー（Sone選定待ち） */
}
.p-features__placeholder {
  display: block;
  width: 100%;
  height: 100%;
  background-color: #D9D9D9;
}
.p-features {
  /* ---------- テキスト側 ---------- */
}
.p-features__body {
  position: relative;
  width: 50%;
  display: grid;
  place-items: center;
  padding-inline: clamp(24px, 4vw, 80px);
}
.p-features {
  /* reverse行（②犬）：左端のコテージイラスト分のガターを確保して
     どの画面幅でもテキストと重ならないようにする（カンプ実測：テキスト左272px） */
}
.p-features__row--reverse .p-features__body {
  padding-left: clamp(170px, 14.5vw, 280px);
}
.p-features__text {
  max-width: 640px;
}
.p-features__title {
  font-size: clamp(24px, 1.9vw, 36px);
  font-weight: 700;
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-features__desc {
  margin-top: 17px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #000000;
}
.p-features {
  /* ---------- イラスト（camplus流の散らし・実測位置） ---------- */
}
.p-features__illust {
  position: absolute;
  height: auto;
}
.p-features {
  /* ①キャンプ道具（焚き火・ランタン・チェア）：テキスト右下 */
}
.p-features__illust--camp {
  right: 2.1%;
  bottom: 21px;
  width: clamp(110px, 9.6vw, 184px);
}
.p-features {
  /* ②手描きコテージ：左端に半分見切れ */
}
.p-features__illust--cottage {
  left: -18px;
  bottom: 56px;
  width: clamp(150px, 12.2vw, 235px);
}
.p-features {
  /* ③点描の山：テキスト右下・行の底 */
}
.p-features__illust--hills {
  right: 2%;
  bottom: 0;
  width: clamp(240px, 22vw, 422px);
}
.p-features {
  /* ---------- 肉球トレイル（犬→森へ・実測10個） ---------- */
}
.p-features__paws {
  position: absolute;
  left: 4.8%;
  bottom: clamp(-160px, -8.3vw, -80px);
  z-index: 2;
  width: clamp(220px, 19.5vw, 375px);
  aspect-ratio: 375/260;
  pointer-events: none;
}
.p-features__paws img {
  position: absolute;
  width: 12.8%;
  height: auto;
  transform: rotate(90deg);
}
.p-features__paws {
  /* カンプ実測座標（原点=トレイル左上・375x260基準・%変換）
     回転は各SVG（illust-paw-01〜10）に焼き込み済みのためCSSでは回さない */
}
.p-features__paws img:nth-child(1) {
  left: 0%;
  top: 81.5%;
}
.p-features__paws img:nth-child(2) {
  left: 1.3%;
  top: 54.6%;
}
.p-features__paws img:nth-child(3) {
  left: 23.5%;
  top: 70%;
}
.p-features__paws img:nth-child(4) {
  left: 48.5%;
  top: 59.2%;
}
.p-features__paws img:nth-child(5) {
  left: 26.9%;
  top: 45%;
}
.p-features__paws img:nth-child(6) {
  left: 65.6%;
  top: 43.5%;
}
.p-features__paws img:nth-child(7) {
  left: 46.9%;
  top: 29.2%;
}
.p-features__paws img:nth-child(8) {
  left: 84.5%;
  top: 25.4%;
}
.p-features__paws img:nth-child(9) {
  left: 69.9%;
  top: 18.5%;
}
.p-features__paws img:nth-child(10) {
  left: 87.2%;
  top: 0%;
}
.p-features {
  /* 3つの強みの下：雰囲気の横スライダー（全幅）2026-07-14 */
}
.p-features__slider {
  margin-top: clamp(48px, 6vw, 96px);
}
.p-features {
  /* ---------- 波形境界（次セクションのピーチ帯へ） ---------- */
}
.p-features__wave {
  margin-top: clamp(64px, 6vw, 116px);
  line-height: 0;
  overflow: hidden;
}
.p-features__wave img {
  display: block;
  width: 100%;
  height: clamp(40px, 5.2vw, 100px);
}
@media screen and (max-width: 767px) {
  .p-features__wave img {
    height: 30px;
  }
}
.p-features {
  /* ---------- タブレット以下（暫定：SPカンプ未作成） ---------- */
}
@media screen and (max-width: 767px) {
  .p-features__row {
    flex-direction: column;
  }
  .p-features__row + .p-features__row {
    margin-top: 40px;
  }
  .p-features__row {
    /* 写真→テキストの順に統一（reverse行はDOM上テキストが先のため入替え） */
  }
  .p-features__row--reverse .p-features__body {
    order: 2;
  }
  .p-features__row--reverse .p-features__photo {
    order: 1;
  }
  .p-features__photo {
    width: calc(100% - 16px);
    border-radius: 0 20px 20px 0;
  }
  .p-features__photo--right {
    margin-left: 16px;
    border-radius: 20px 0 0 20px;
  }
  .p-features__body {
    width: 100%;
    padding: 20px 16px 8px;
  }
  .p-features {
    /* PC用の左ガター（コテージイラスト分）をSPでは打ち消す
       ※これが残っていると犬のテキストだけ幅が半分になる */
  }
  .p-features__row--reverse .p-features__body {
    padding: 20px 16px 8px;
  }
  .p-features {
    /* 肉球はテキストと森写真の間に専用の余白を作って収める（写真に被せない） */
  }
  .p-features__row--reverse {
    margin-bottom: 130px;
  }
  .p-features__desc br {
    display: none;
  }
  .p-features__illust--camp {
    position: static;
    display: block;
    margin: 12px 0 0 auto;
    width: 110px;
  }
  .p-features__illust--cottage {
    display: none;
  }
  .p-features__illust--hills {
    position: static;
    display: block;
    margin: 12px 0 0 auto;
    width: 220px;
  }
  .p-features__paws {
    left: auto;
    right: 8%;
    bottom: -126px;
    width: 170px;
  }
}

/******************************************************************************
*
* TOP：5棟のコテージ（p-cottages）
* Figmaカンプ 628:8 実測（1920px基準）：
* - ピーチ帯 628:83（$color-bg2）／コンテンツ幅1440
* - カード 407x466：白・ブラウン50%枠2px・角丸20／写真365x220（プレースホルダー）
* - 8名／98㎡ 16px黒 → 棟名 28pxブラウン → ¥17,000~ Barlow 42px → 詳細を見る
* - CTA：c-button（コテージ一覧を見る）
*
******************************************************************************/
.p-cottages {
  background-color: #F5E3CB;
  padding: clamp(64px, 6vw, 116px) 24px 0;
}
.p-cottages__inner {
  max-width: 1440px;
  margin-inline: auto;
}
.p-cottages {
  /* ---------- カードグリッド（3+2・中央寄せ） ---------- */
}
.p-cottages__grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 36px clamp(40px, 5.7vw, 109px);
  margin-top: clamp(32px, 3vw, 57px);
}
.p-cottages__card {
  width: clamp(300px, 21.2vw, 407px);
  padding: 18px 20px 16px;
  background-color: #FFFFFF;
  border: 2px solid rgba(126, 155, 122, 0.4);
  border-radius: 20px;
  text-align: center;
}
.p-cottages__photo {
  width: 100%;
  aspect-ratio: 365/220;
  border-radius: 12px;
  background-color: #D9D9D9;
  overflow: hidden;
}
.p-cottages__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-cottages__name {
  margin-top: clamp(8px, 1vw, 12px);
  font-weight: 700;
  font-size: clamp(21px, 1.46vw, 28px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-cottages__linkWrap {
  display: flex;
  justify-content: flex-end;
  margin-top: 14px;
  padding-right: 8px;
}
.p-cottages {
  /* ---------- CTA ---------- */
}
.p-cottages__cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(16px, 1.8vw, 28px);
  margin-top: clamp(48px, 5vw, 96px);
}
.p-cottages {
  /* ---------- 波形境界（ピーチ→クリームへ戻る） ---------- */
}
.p-cottages__wave {
  margin-top: clamp(64px, 6vw, 116px);
  /* セクションのinline padding（24px/SP16px）を打ち消して常にビューポート全幅に
     （2026-07-03修正：波が左右で途切れて見えていた） */
  margin-inline: -24px;
  line-height: 0;
  overflow: hidden;
}
.p-cottages__wave img {
  display: block;
  width: 100%;
  height: clamp(40px, 5.2vw, 100px);
}
@media screen and (max-width: 767px) {
  .p-cottages__wave img {
    height: 30px;
  }
}
.p-cottages {
  /* ---------- タブレット以下（暫定：SPカンプ未作成） ---------- */
}
@media screen and (max-width: 767px) {
  .p-cottages {
    padding: 64px 16px 0;
  }
  .p-cottages__wave {
    margin-inline: -16px;
  }
  .p-cottages__grid {
    gap: 20px;
    margin-top: 28px;
  }
  .p-cottages__card {
    width: min(100%, 340px);
  }
  .p-cottages__cta {
    margin-top: 36px;
  }
}

/******************************************************************************
*
* TOP：ペットと泊まる（p-pet）
* Figmaカンプ 628:372 実測（1920px基準）：
* - コンテンツ1440（240〜1680）／左：写真600x400／右：情報680（x1000〜）
* - 見出し56ブラウン左寄せ／リード16 2行／料金表3行（lh3.1・ブラウン罫線274px）
* - 小ボタン「詳しく見る」（c-button--small）
*
******************************************************************************/
.p-pet {
  background-color: #F6F1E7;
  padding: clamp(64px, 6vw, 116px) 24px;
}
.p-pet__inner {
  display: flex;
  align-items: flex-start;
  gap: clamp(40px, 8.3vw, 160px);
  max-width: 1440px;
  margin-inline: auto;
}
.p-pet__photo {
  flex-shrink: 0;
  width: clamp(300px, 31.3vw, 600px);
  aspect-ratio: 600/400;
  border-radius: 20px;
  background-color: #D9D9D9;
  overflow: hidden;
}
.p-pet__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-pet__body {
  flex: 1;
  min-width: 0;
}
.p-pet__title {
  font-weight: 700;
  font-size: clamp(30px, 2.9vw, 56px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-pet__lead {
  margin-top: 20px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #000000;
}
.p-pet {
  /* 料金表（3行・ブラウン罫線・カンプ実測 行高50px=lh3.1） */
}
.p-pet__data {
  margin-top: 20px;
  width: fit-content;
  min-width: 274px;
}
.p-pet__data li {
  padding: 14px 0;
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.4;
  letter-spacing: 0.05em;
  color: #000000;
}
.p-pet__data li:first-child {
  border-top: 0;
}
.p-pet__cta {
  margin-top: clamp(24px, 1.9vw, 36px);
}
.p-pet {
  /* ---------- タブレット以下（暫定：SPカンプ未作成） ---------- */
}
@media screen and (max-width: 767px) {
  .p-pet {
    padding: 64px 16px;
  }
  .p-pet__inner {
    flex-direction: column;
    gap: 20px;
  }
  .p-pet__photo {
    width: 100%;
  }
  .p-pet__data {
    width: 100%;
  }
  .p-pet__cta {
    display: flex;
    justify-content: center;
  }
}

/******************************************************************************
*
* TOP：能登の楽しみ方 周辺スポットマップ（p-notoMap）
* Figmaカンプ 628:201 実測：MAP 1439x864（コンテンツ幅1440）／
* 白カード 452x348 角丸30（マップ左下に重ねる）
* マップUI＝プラチナマップ参考の自作（ピン・カテゴリバー・スポットカード）
*
******************************************************************************/
.p-notoMap {
  background-color: #F6F1E7;
  padding: clamp(64px, 6vw, 116px) 24px;
}
.p-notoMap__inner {
  max-width: 1440px;
  margin-inline: auto;
}
.p-notoMap__stage {
  position: relative;
}
.p-notoMap__map {
  width: 100%;
  aspect-ratio: 16/10;
  max-height: 820px;
  border-radius: 20px;
  z-index: 1;
}
.p-notoMap {
  /* ---------- スポット詳細パネル（ボトムシート式・2026-07-02 Sone指示） ----------
     上部はマップが見える隙間を残し、下からスライドアップで出現 */
}
.p-notoMap__detailWrap {
  position: absolute;
  inset: 0;
  z-index: 1200;
  border-radius: 20px;
  overflow: hidden;
  pointer-events: none;
}
.p-notoMap__detail {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: clamp(48px, 9vh, 96px);
  background-color: #FFFFFF;
  border-radius: 20px 20px 0 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  pointer-events: auto;
  transform: translateY(110%);
  transition: transform 0.45s cubic-bezier(0.23, 1, 0.32, 1);
}
.p-notoMap__detailWrap.is-open .p-notoMap__detail {
  transform: translateY(0);
}
.p-notoMap__detailClose {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 2;
  width: 44px;
  height: 44px;
  background-color: rgba(0, 0, 0, 0.65);
  border: none;
  border-radius: 50%;
  cursor: pointer;
}
.p-notoMap__detailClose span {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 2px;
  background-color: #FFFFFF;
}
.p-notoMap__detailClose span:nth-child(1) {
  transform: translate(-50%, -50%) rotate(45deg);
}
.p-notoMap__detailClose span:nth-child(2) {
  transform: translate(-50%, -50%) rotate(-45deg);
}
.p-notoMap {
  /* ---------- 白カード（カンプ 628:205） ---------- */
}
.p-notoMap__card {
  position: absolute;
  left: 24px;
  bottom: 25px;
  z-index: 1100;
  width: min(452px, 42%);
  padding: 26px 22px 24px;
  background-color: #FFFFFF;
  border-radius: 30px;
}
.p-notoMap__title {
  font-weight: 700;
  font-size: clamp(24px, 1.9vw, 36px);
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-notoMap__lead {
  margin-top: 12px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.09em;
  color: #000000;
}
.p-notoMap__cta {
  margin-top: 16px;
}
.p-notoMap {
  /* ---------- タブレット以下（暫定：SPカンプ未作成） ---------- */
}
@media screen and (max-width: 767px) {
  .p-notoMap {
    padding: 64px 16px;
  }
  .p-notoMap__map {
    aspect-ratio: auto;
    height: 460px;
    border-radius: 16px;
  }
  .p-notoMap {
    /* カードはマップの下に静置 */
  }
  .p-notoMap__card {
    position: static;
    width: 100%;
    margin-top: 14px;
    padding: 20px 16px;
    border-radius: 20px;
    border: 1px solid rgba(126, 155, 122, 0.4);
  }
  .p-notoMap__cta {
    display: flex;
    justify-content: center;
  }
  .p-notoMap {
    /* 詳細パネルはマップ部分のみ（カードは静置なので stage 全体ではなくマップ高さに固定） */
  }
  .p-notoMap__detailWrap {
    inset: 0 0 auto 0;
    height: 420px;
    border-radius: 16px;
  }
  .p-notoMap__detail {
    top: 40px;
    border-radius: 16px 16px 0 0;
  }
}

/* ============================================================
  マップ内UI（Leaflet divIcon / popup 用・グローバル）
============================================================ */
/* ピン（写真 or カテゴリアイコン＋名前ラベル） */
.notoMap-pin {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: none;
  border: none;
}
.notoMap-pin__thumb {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  background-color: #FFFFFF;
  border: 3px solid #FFFFFF;
  border-radius: 14px;
  overflow: hidden;
  /* Leaflet標準CSS（.leaflet-container .leaflet-marker-pane img { width:auto }＝特異性0,2,1）が
     後読みで勝つため、0,3,1 に上げて上書きする */
}
.leaflet-container .notoMap-pin .notoMap-pin__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 11px;
}
.notoMap-pin__thumb .notoMap-pin__catIcon {
  width: 28px;
  height: 28px;
  object-fit: contain;
}
.notoMap-pin__thumb {
  /* 吹き出しのしっぽ */
}
.notoMap-pin__thumb::after {
  content: "";
  position: absolute;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
  width: 10px;
  height: 10px;
  background-color: #FFFFFF;
  z-index: -1;
}
.notoMap-pin__label {
  margin-top: 8px;
  padding: 3px 8px;
  background-color: #FFFFFF;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
  color: #2B2B2B;
  white-space: nowrap;
}
.notoMap-pin {
  /* ノトイエ本体（ロゴピン・横長ロゴに合わせたサイズ） */
}
.notoMap-pin--home .notoMap-pin__thumb {
  width: 92px;
  height: 46px;
  border-color: #7E9B7A;
  border-radius: 10px;
}
.notoMap-pin--home .notoMap-pin__thumb img {
  object-fit: contain;
  padding: 3px;
  background-color: #FFFFFF;
  border-radius: 7px;
}
.notoMap-pin--home .notoMap-pin__label {
  color: #8B6B4E;
}

/* スポット詳細パネルの中身（map.jsが描画・platinumaps参照画像準拠） */
/* ノトイエ本体＝小さな「ノトイエ」タグ（下向きの小三角で位置を指す）2026-07-14
   ドット案は近接クラスタと重なって不自然だったため、一体型のタグに変更。 */
.notoMap-home {
  background: none;
  border: none;
}
.notoMap-home__tag {
  position: relative;
  display: inline-block;
  padding: 3px 9px;
  font-weight: 700;
  font-size: 11px;
  line-height: 1.3;
  letter-spacing: 0.02em;
  color: #FFFFFF;
  background-color: #8B6B4E;
  border: 1.5px solid #FFFFFF;
  border-radius: 6px;
  white-space: nowrap;
  /* 下向きの小三角（位置ポインタ） */
}
.notoMap-home__tag::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid #8B6B4E;
}

/* マーカークラスタ（プラチナマップ風：代表ピン＋右上に件数バッジ）2026-07-14 */
.notoMap-cluster {
  position: relative;
  background: none;
  border: none;
}
.notoMap-cluster__pin {
  position: relative;
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  margin: 0 auto;
  background-color: #7E9B7A;
  border: 3px solid #FFFFFF;
  border-radius: 14px;
}
.leaflet-container .notoMap-cluster .notoMap-cluster__pin img {
  width: 26px;
  height: 26px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}
.notoMap-cluster__pin {
  /* 吹き出しのしっぽ */
}
.notoMap-cluster__pin::after {
  content: "";
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
  width: 10px;
  height: 10px;
  background-color: #7E9B7A;
}
.notoMap-cluster {
  /* 件数バッジ（右上） */
}
.notoMap-cluster__count {
  position: absolute;
  top: -7px;
  right: -5px;
  min-width: 22px;
  height: 22px;
  padding: 0 5px;
  display: grid;
  place-items: center;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 1;
  color: #FFFFFF;
  background-color: #8B6B4E;
  border: 2px solid #FFFFFF;
  border-radius: 999px;
}

.notoMap-detail__photo {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  max-height: min(52vh, 460px);
  background-color: #D9D9D9;
  overflow: hidden;
}
.notoMap-detail__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.notoMap-detail {
  /* 写真クレジット（ほっと石川フォトライブラリ由来のみ・©石川県観光連盟） */
}
.notoMap-detail__credit {
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 3px 8px;
  font-size: 11px;
  line-height: 1.2;
  letter-spacing: 0.02em;
  color: #FFFFFF;
  background-color: rgba(0, 0, 0, 0.5);
  border-top-left-radius: 6px;
}
.notoMap-detail__noPhoto {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
}
.notoMap-detail__noPhoto img {
  width: 56px;
  height: 56px;
  opacity: 0.45;
}
.notoMap-detail__content {
  padding: 22px clamp(18px, 2vw, 32px) 32px;
}
.notoMap-detail__name {
  font-size: clamp(20px, 1.5vw, 28px);
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.notoMap-detail__time {
  margin-top: 4px;
  font-size: 13px;
  color: rgba(43, 43, 43, 0.7);
}
.notoMap-detail {
  /* アクションボタン（参照画像の丸チップ風） */
}
.notoMap-detail__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}
.notoMap-detail__actions a {
  display: inline-flex;
  align-items: center;
  padding: 10px 18px;
  background-color: rgba(126, 155, 122, 0.14);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  color: #8B6B4E;
}
.notoMap-detail__desc {
  margin-top: 16px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  /* 管理画面textareaの改行をそのまま活かす（map.js側はesc済み＝安全）。
     長文は詳細パネル自体の内部スクロール（__detail overflow-y:auto）が受ける */
  white-space: pre-line;
}

/******************************************************************************
*
* TOP：コンシェルジュ（p-concierge）
* Figmaカンプ実測（1920px基準）：
* - バンド＝クリーム（$color-bg）／コンテンツ1440
* - 左：見出し56ブラウン → リード390幅 → 小ボタン
* - 右：スライダー716x537（角なし・バンド下端から26pxはみ出す）
*   丸矢印96px（グリーン・写真の左右48px内側）／白キャプション318x171 r20（右下）
*
******************************************************************************/
.p-concierge {
  background-color: #F6F1E7;
  padding: clamp(64px, 6vw, 116px) 0;
}
.p-concierge__inner {
  display: flex;
  align-items: flex-start;
  gap: clamp(24px, 3vw, 60px);
  max-width: 1440px;
  margin-inline: auto;
  padding-left: 24px;
}
.p-concierge {
  /* ---------- 左：テキスト ---------- */
}
.p-concierge__body {
  flex: 1;
  min-width: 0;
}
.p-concierge__title {
  font-weight: 700;
  font-size: clamp(30px, 2.9vw, 56px);
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-concierge__lead {
  margin-top: 14px;
  max-width: 420px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #000000;
}
.p-concierge__cta {
  margin-top: clamp(24px, 1.9vw, 37px);
}
.p-concierge {
  /* ---------- 右：画像スライダー ---------- */
}
.p-concierge__slider {
  position: relative;
  flex-shrink: 0;
  width: min(716px, 50%);
  margin-bottom: -26px;
  z-index: 2;
}
.p-concierge__track {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.p-concierge__track::-webkit-scrollbar {
  display: none;
}
.p-concierge__slide {
  position: relative;
  flex: 0 0 100%;
  scroll-snap-align: start;
}
.p-concierge__photo {
  width: 100%;
  aspect-ratio: 716/537;
  background-color: #D9D9D9;
}
.p-concierge__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-concierge {
  /* キャプションカード（右下・カンプ 628:219） */
}
.p-concierge__caption {
  position: absolute;
  right: 19px;
  bottom: 18px;
  width: min(318px, 78%);
  padding: 16px 20px 20px;
  background-color: #FFFFFF;
  border-radius: 20px;
}
.p-concierge__capTitle {
  font-weight: 700;
  font-size: clamp(22px, 1.9vw, 36px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-concierge__capText {
  margin-top: 8px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #000000;
}
.p-concierge {
  /* 丸矢印ボタン（グリーン96px・写真の左右48px内側） */
}
.p-concierge__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: clamp(56px, 5vw, 96px);
  aspect-ratio: 1;
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
}
.p-concierge__nav img {
  display: block;
  width: 100%;
  height: 100%;
}
.p-concierge__nav {
  /* 写真の縁から半分はみ出す配置（2026-07-03 Sone指示）＝ボタン幅の半分ぶん外へ */
}
.p-concierge__nav--prev {
  left: calc(clamp(56px, 5vw, 96px) / -2);
}
.p-concierge__nav--prev img {
  transform: scaleX(-1);
}
.p-concierge__nav--next {
  right: calc(clamp(56px, 5vw, 96px) / -2);
}
.p-concierge {
  /* ---------- 小さめPC（768〜1511px）：横余白・ガター確保（2026-07-03 Sone指示）
     1280前後で丸矢印（半分はみ出し）がテキスト列に食い込みギチギチだったため、
     この帯域は左右パディングを両側に取り、カラム間ガターを矢印はみ出し分より広く確保。
     上限1511px＝inner最大1440＋矢印はみ出し36px×2。これ未満だと次矢印が画面右端で切れる ---------- */
}
@media screen and (min-width: 768px) and (max-width: 1511px) {
  .p-concierge__inner {
    gap: clamp(56px, 6vw, 76px);
    padding-inline: clamp(24px, 3vw, 40px);
  }
  .p-concierge__slider {
    width: min(716px, 46%);
  }
}
.p-concierge {
  /* ---------- タブレット以下（暫定：SPカンプ未作成） ---------- */
}
@media screen and (max-width: 767px) {
  .p-concierge {
    padding: 64px 0;
  }
  .p-concierge__inner {
    flex-direction: column;
    gap: 0;
    padding-inline: 16px;
  }
  .p-concierge__body {
    display: contents;
  }
  .p-concierge__slider {
    width: 100%;
    margin-bottom: 0;
    margin-top: 24px;
    order: 2;
  }
  .p-concierge__caption {
    right: 12px;
    bottom: 12px;
    padding: 12px 16px 14px;
  }
  .p-concierge__cta {
    display: flex;
    justify-content: center;
    margin-top: 24px;
    order: 3;
  }
  .p-concierge {
    /* SPは画面端で切れすぎないよう控えめなはみ出しに */
  }
  .p-concierge .p-concierge__nav--prev {
    left: -12px;
  }
  .p-concierge .p-concierge__nav--next {
    right: -12px;
  }
}

/******************************************************************************
*
* TOP：お客様の声（p-voice）カンプ無し・テック担当デザイン
* - ピーチ帯（波形で出入り・5棟セクションと同じ帯リズム）
* - クチコミ3枚＝高さずらし＋微回転の「手貼り掲示板」風（均等グリッド回避）
* - 件数は出さない。タイトル＋★評価は表示（2026-07-14 Sone指示で方針変更）
*
******************************************************************************/
.p-voice__waveTop, .p-voice__waveBottom {
  line-height: 0;
  overflow: hidden;
}
.p-voice__waveTop img, .p-voice__waveBottom img {
  display: block;
  width: 100%;
  height: clamp(40px, 5.2vw, 100px);
}
@media screen and (max-width: 767px) {
  .p-voice__waveTop img, .p-voice__waveBottom img {
    height: 30px;
  }
}
.p-voice {
  /* 上の波はクリーム→ピーチ、下の波はピーチ→クリーム。
     wave-bg.svg（クリーム塗り）はピーチ地の上に置くと"戻り"になる */
}
.p-voice__waveBottom {
  background-color: #F5E3CB;
}
.p-voice__band {
  background-color: #F5E3CB;
  padding: clamp(32px, 3vw, 56px) 24px clamp(64px, 6vw, 108px);
}
.p-voice__inner {
  max-width: 1280px;
  margin-inline: auto;
}
.p-voice {
  /* ---------- クチコミカード（手貼り風） ---------- */
}
.p-voice__list {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: clamp(20px, 3vw, 48px);
  margin-top: clamp(32px, 3vw, 56px);
}
.p-voice__card {
  position: relative;
  width: clamp(260px, 27vw, 360px);
  padding: 44px 28px 20px;
  background-color: #FFFFFF;
  border-radius: 20px;
  /* 揃えすぎない：1枚ごとに高さと角度を少しずらす */
}
.p-voice__card:nth-child(1) {
  transform: rotate(-1.2deg);
}
.p-voice__card:nth-child(2) {
  transform: rotate(0.9deg);
  margin-top: 36px;
}
.p-voice__card:nth-child(3) {
  transform: rotate(-0.5deg);
  margin-top: 14px;
}
.p-voice {
  /* 引用符（グリーンのアクセント） */
}
.p-voice__quote {
  position: absolute;
  top: 2px;
  left: 20px;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 64px;
  line-height: 1;
  color: rgba(126, 155, 122, 0.55);
}
.p-voice {
  /* 評価（★・5点満点） */
}
.p-voice__rating {
  display: flex;
  gap: 2px;
  font-size: 16px;
  line-height: 1;
  color: rgba(43, 43, 43, 0.18);
}
.p-voice__star.is-on {
  color: #f5a623;
}
.p-voice {
  /* クチコミタイトル */
}
.p-voice__title {
  margin-top: 10px;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-voice__text {
  margin-top: 12px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.9;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-voice__meta {
  margin-top: 14px;
  text-align: right;
  font-size: 12px;
  color: rgba(43, 43, 43, 0.55);
}
.p-voice {
  /* ---------- タブレット以下（暫定） ---------- */
}
@media screen and (max-width: 767px) {
  .p-voice__band {
    padding: 32px 16px 64px;
  }
  .p-voice__list {
    flex-direction: column;
    align-items: center;
    gap: 16px;
  }
  .p-voice__card {
    width: min(100%, 360px);
  }
  .p-voice__card:nth-child(2), .p-voice__card:nth-child(3) {
    margin-top: 0;
  }
}

/******************************************************************************
*
* TOP：インタビュー（p-interview）カンプ無し・テック担当デザイン
* - 特徴セクションと同じ「写真半面ブリード」文法（左写真・右テキスト）
* - 見出しを立てず、確定引用（ジョセフさん）を主役に
*
******************************************************************************/
.p-interview {
  display: flex;
  align-items: stretch;
  background-color: #F6F1E7;
  padding: clamp(64px, 6vw, 116px) 0;
}
.p-interview__photo {
  width: 50%;
  aspect-ratio: 960/540;
  background-color: #D9D9D9;
  border-radius: 0 30px 30px 0;
  overflow: hidden;
}
.p-interview__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-interview__body {
  width: 50%;
  display: grid;
  place-items: center;
  padding-inline: clamp(24px, 4vw, 80px);
}
.p-interview__text {
  max-width: 560px;
}
.p-interview__en {
  display: block;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(16px, 1.05vw, 20px);
  letter-spacing: 0.04em;
  color: #7E9B7A;
}
.p-interview__quote {
  margin: 10px 0 0;
}
.p-interview__quote p {
  font-weight: 700;
  font-size: clamp(26px, 2.3vw, 44px);
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-interview__attribution {
  margin-top: 18px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-interview__attribution small {
  font-size: 12px;
  color: rgba(43, 43, 43, 0.55);
}
.p-interview__link {
  margin-top: 22px;
}
.p-interview {
  /* ---------- タブレット以下（暫定） ---------- */
}
@media screen and (max-width: 767px) {
  .p-interview {
    flex-direction: column;
    gap: 20px;
    padding: 64px 0;
  }
  .p-interview__photo {
    width: calc(100% - 16px);
    border-radius: 0 20px 20px 0;
  }
  .p-interview__body {
    width: 100%;
    padding-inline: 16px;
  }
}

/******************************************************************************
*
* TOP：ノトイエ日誌（p-diary）カンプ無し・テック担当デザイン
* - 読みものの入口＝日付＋タイトルの行リスト（カードグリッド回避）
* - 罫線＝統一ルール（メインカラー緑40%）／足あとアクセント
*
******************************************************************************/
.p-diary {
  background-color: #F6F1E7;
  padding: clamp(64px, 6vw, 116px) 24px;
}
.p-diary__inner {
  position: relative;
  max-width: 960px;
  margin-inline: auto;
}
.p-diary__list {
  margin-top: clamp(28px, 2.8vw, 48px);
  border-top: 1px solid rgba(126, 155, 122, 0.4);
}
.p-diary__row {
  display: flex;
  align-items: center;
  gap: clamp(14px, 1.6vw, 28px);
  padding: 20px 6px;
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
}
.p-diary__row--dummy {
  opacity: 0.45;
}
.p-diary__date {
  flex-shrink: 0;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.03em;
  color: #8B6B4E;
}
.p-diary__cat {
  flex-shrink: 0;
  padding: 3px 12px;
  background-color: rgba(126, 155, 122, 0.16);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  color: #8B6B4E;
}
.p-diary__title {
  flex: 1;
  min-width: 0;
  font-size: clamp(14px, 0.85vw, 16px);
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: color 0.3s ease;
}
.p-diary a.p-diary__row:hover {
  opacity: 1;
}
.p-diary a.p-diary__row:hover .p-diary__title {
  color: #8B6B4E;
}
.p-diary {
  /* 「>」矢印＝c-arrowFlow（サイト共通フローアニメ 2026-07-03）。ここでは色だけ指定 */
}
.p-diary__arrow {
  color: #8B6B4E;
}
.p-diary__cta {
  display: flex;
  justify-content: flex-end;
  margin-top: clamp(24px, 2.4vw, 40px);
}
.p-diary {
  /* 足あとアクセント（タイトル右上にさりげなく） */
}
.p-diary__paws {
  position: absolute;
  top: -6px;
  right: 4%;
  display: flex;
  gap: 10px;
}
.p-diary__paws img {
  width: 30px;
  height: 30px;
  opacity: 0.75;
}
.p-diary__paws img:nth-child(2) {
  transform: translateY(-12px);
}
.p-diary__paws img:nth-child(3) {
  transform: translateY(-26px);
}
.p-diary {
  /* ---------- タブレット以下（暫定） ---------- */
}
@media screen and (max-width: 767px) {
  .p-diary {
    padding: 64px 16px;
  }
  .p-diary__row {
    flex-wrap: wrap;
    gap: 8px 12px;
    padding: 16px 2px;
  }
  .p-diary {
    /* SPは日付・カテゴリの行＋タイトルの行に折る */
  }
  .p-diary__title {
    flex: 1 1 100%;
    white-space: normal;
  }
  .p-diary__arrow {
    display: none;
  }
  .p-diary__cta {
    justify-content: center;
  }
  .p-diary__paws {
    right: 0;
  }
  .p-diary__paws img {
    width: 24px;
    height: 24px;
  }
}

/******************************************************************************
*
* TOP：アクセス（p-access）カンプ無し・テック担当デザイン
* - 左＝情報（住所・車での目安・ルート検索）／右＝Googleマップ埋め込み
* - マップセクションと同じ「左情報・右ビジュアル」文法／罫線＝緑40%
*
******************************************************************************/
.p-access {
  background-color: #F6F1E7;
  padding: clamp(64px, 6vw, 116px) 24px clamp(80px, 7.5vw, 144px);
}
.p-access__inner {
  display: flex;
  align-items: flex-start;
  gap: clamp(32px, 4vw, 80px);
  max-width: 1440px;
  margin-inline: auto;
}
.p-access {
  /* ---------- 左：情報 ---------- */
}
.p-access__body {
  flex: 1;
  min-width: 0;
}
.p-access__en {
  display: block;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(16px, 1.05vw, 20px);
  letter-spacing: 0.04em;
  color: #7E9B7A;
}
.p-access__jp {
  display: block;
  margin-top: 4px;
  font-weight: 700;
  font-size: clamp(30px, 2.9vw, 56px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-access__table {
  margin-top: clamp(20px, 2vw, 36px);
  border-top: 1px solid rgba(126, 155, 122, 0.4);
}
.p-access__row {
  display: flex;
  align-items: baseline;
  gap: 20px;
  padding: 14px 4px;
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
}
.p-access__row dt {
  flex-shrink: 0;
  width: clamp(120px, 10vw, 160px);
  font-size: clamp(14px, 0.85vw, 16px);
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-access__row dd {
  margin: 0;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-access__cta {
  margin-top: clamp(22px, 2.2vw, 36px);
}
.p-access {
  /* 点描の山アクセント */
}
.p-access__hills {
  display: block;
  width: clamp(200px, 16vw, 300px);
  height: auto;
  margin: clamp(24px, 2.4vw, 40px) 0 0 auto;
}
.p-access {
  /* ---------- 右：地図 ---------- */
}
.p-access__map {
  flex-shrink: 0;
  width: min(716px, 50%);
  aspect-ratio: 716/480;
  border-radius: 20px;
  overflow: hidden;
  background-color: #D9D9D9;
}
.p-access__map iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}
.p-access {
  /* ---------- タブレット以下（暫定） ---------- */
}
@media screen and (max-width: 767px) {
  .p-access {
    padding: 64px 16px 88px;
  }
  .p-access__inner {
    flex-direction: column;
    gap: 20px;
  }
  .p-access__map {
    width: 100%;
    aspect-ratio: 4/3;
    border-radius: 16px;
  }
  .p-access__cta {
    display: flex;
    justify-content: center;
  }
  .p-access__hills {
    margin-inline: auto;
  }
}

/******************************************************************************
*
* 下層：滞在・コテージ案内（p-cottagesPage）page-cottages.php
* WF確定版（Figma 316:2・2026-07-03）をnotoieのデザイン言語で実装：
* - 帯リズム（同日Sone指示でリード＋特徴を統合＆再配色）：
*   header(ピーチ)→一棟貸切＋特徴4カード統合(クリーム)→5棟のコテージ(ピーチ帯・カードPC3+2)
*   →滞在の流れ(クリーム・白カード3枚)→予約CTA(クリーム地＋角丸ピーチパネル・波なし)→フッター(クリーム)
* - 帯の出入りは波形境界（c-waveFlow・上端=右流れ/下端=左流れ）
* - トークン厳守：カード枠 rgba($color-main,0.4)／本文 $fs-body／余白 $section-pad-y
* ※旧ジグザグ実装（2026-07-03 午前版）はWF確定に伴い削除
*
******************************************************************************/
.p-cottagesPage {
  background-color: #F6F1E7;
  /* ---------- 共通：波形境界（ピーチ帯の出入り・c-waveFlowと同方式） ---------- */
}
.p-cottagesPage__wave {
  line-height: 0;
  overflow: hidden;
}
.p-cottagesPage__wave img {
  display: block;
  width: 100%;
  height: clamp(40px, 5.2vw, 100px);
}
@media screen and (max-width: 767px) {
  .p-cottagesPage__wave img {
    height: 30px;
  }
}
.p-cottagesPage {
  /* 上端：wave-bg.svg（クリーム塗り）を上下反転→クリームが上・ピーチが下 */
}
.p-cottagesPage__wave--top img {
  transform: scaleY(-1);
}
.p-cottagesPage {
  /* ---------- 2+3. 一棟貸切のコテージ＋全棟共通の特徴（統合・クリーム） ----------
     帯リズム（2026-07-03 Sone指示で再配色）：
     header(ピーチ)→統合(クリーム)→5棟(ピーチ)→流れ(クリーム)→泊まる(ピーチ)→フッター(クリーム)
     ・page-header とは色を分離＝page-header自身の下端波（左流れ）で受ける
     ・このセクションは波を持たない（下は5棟の上端波が受ける）
     ・見出し「一棟貸切のコテージ」＋リード → 特徴4カード を近い間隔で縦に連ねる */
}
.p-cottagesPage__introInner {
  position: relative;
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-cottagesPage__introInner {
    padding: 64px 16px;
  }
}
.p-cottagesPage {
  /* 見出し＋リードの下の大きめ写真エリア（2026-07-15 順番入れ替え・幅1200・16:9・角丸20） */
}
.p-cottagesPage__introPhoto {
  max-width: 1200px;
  margin-inline: auto;
  aspect-ratio: 16/9;
  background-color: #D9D9D9;
  border-radius: 20px;
  margin-top: clamp(40px, 4vw, 64px);
  overflow: hidden;
}
.p-cottagesPage__introPhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-cottagesPage {
  /* 見出し＋リードは960幅中央（旧リードの主体幅を継承） */
}
.p-cottagesPage__introHead {
  max-width: 960px;
  margin-inline: auto;
  text-align: center;
}
.p-cottagesPage__leadText {
  margin-top: clamp(20px, 2vw, 32px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  text-align: left;
}
@media screen and (min-width: 768px) {
  .p-cottagesPage__leadText {
    text-align: center;
  }
}
.p-cottagesPage {
  /* 特徴カード＝flexでラップ中央寄せ（WiFi追加で5枚。5枚は1行／狭幅で折返し中央・S-1 2026-07-07） */
}
.p-cottagesPage__featureGrid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(16px, 1.7vw, 24px);
  margin-top: clamp(24px, 2.4vw, 36px);
}
@media screen and (max-width: 767px) {
  .p-cottagesPage__featureGrid {
    gap: 12px;
    margin-top: 24px;
  }
}
.p-cottagesPage__featureCard {
  flex: 1 1 200px;
  max-width: 260px;
  padding: clamp(24px, 2.2vw, 32px);
  background-color: #FFFFFF;
  border-radius: 16px;
}
@media screen and (max-width: 767px) {
  .p-cottagesPage__featureCard {
    flex-basis: 100%;
    max-width: none;
  }
}
.p-cottagesPage {
  /* 特徴カードのスタッガー出現（js-fadeInUpのtransitionに時間差を付与・5枚対応） */
}
.p-cottagesPage__featureGrid li:nth-child(1) {
  transition-delay: 0s;
}
.p-cottagesPage__featureGrid li:nth-child(2) {
  transition-delay: 0.08s;
}
.p-cottagesPage__featureGrid li:nth-child(3) {
  transition-delay: 0.16s;
}
.p-cottagesPage__featureGrid li:nth-child(4) {
  transition-delay: 0.24s;
}
.p-cottagesPage__featureGrid li:nth-child(5) {
  transition-delay: 0.32s;
}
.p-cottagesPage {
  /* 装飾：足あとトレイル（introの右下→次のピーチ帯へ歩いていく・TOP featuresと同パターン） */
}
.p-cottagesPage__paws {
  right: 2.5%;
  bottom: clamp(-72px, -4vw, -40px);
}
.p-cottagesPage__featureIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(52px, 4.5vw, 64px);
  height: clamp(52px, 4.5vw, 64px);
  background-color: rgba(126, 155, 122, 0.14);
  border-radius: 50%;
  /* リセットのimg{width:100%}を打ち消して実寸固定 */
}
.p-cottagesPage__featureIcon img {
  width: clamp(30px, 2.6vw, 38px);
  height: auto;
}
.p-cottagesPage__featureTitle {
  margin-top: 14px;
  font-weight: 700;
  font-size: clamp(16px, 1.1vw, 21px);
  line-height: 1.55;
  letter-spacing: 0.02em;
  color: #8B6B4E;
  text-wrap: balance;
}
.p-cottagesPage__featureText {
  margin-top: 8px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-cottagesPage {
  /* ---------- 4. 5棟のコテージ（ピーチ帯＋上下波・カードPC3+2中央寄せ） ---------- */
}
.p-cottagesPage__units {
  background-color: #F5E3CB;
}
.p-cottagesPage__unitsInner {
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding: clamp(48px, 4.5vw, 80px) 24px;
}
@media screen and (max-width: 767px) {
  .p-cottagesPage__unitsInner {
    padding: 40px 16px;
  }
}
.p-cottagesPage__unitsLead {
  margin-top: clamp(12px, 1.2vw, 20px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  text-align: center;
}
.p-cottagesPage__unitGrid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(24px, 2.5vw, 36px) clamp(20px, 1.7vw, 24px);
  margin-top: clamp(32px, 3vw, 48px);
}
.p-cottagesPage {
  /* 5棟カードのスタッガー出現 */
}
.p-cottagesPage__unitGrid li:nth-child(1) {
  transition-delay: 0s;
}
.p-cottagesPage__unitGrid li:nth-child(2) {
  transition-delay: 0.08s;
}
.p-cottagesPage__unitGrid li:nth-child(3) {
  transition-delay: 0.16s;
}
.p-cottagesPage__unitGrid li:nth-child(4) {
  transition-delay: 0.24s;
}
.p-cottagesPage__unitGrid li:nth-child(5) {
  transition-delay: 0.32s;
}
.p-cottagesPage__unitGrid li:nth-child(6) {
  transition-delay: 0.4s;
}
.p-cottagesPage {
  /* カード外殻＝出現アニメ（js-fadeInUp＋スタッガー）とレイアウトのみ。
     見た目とホバーは内側（__unitCardIn）に分離＝出現のtransition-delayが
     ホバー反応を遅らせないため（transform競合の回避） */
}
.p-cottagesPage__unitCard {
  width: clamp(300px, 31vw, 458px);
}
@media screen and (max-width: 767px) {
  .p-cottagesPage__unitCard {
    width: min(100%, 400px);
  }
}
.p-cottagesPage {
  /* カード本体：白面・緑40%枠・角丸20（TOP 5棟カードと同じ言語）
     ※カード自体はリンクではない（クリック要素は行内の c-arrowLink のみ）ため
       浮き/影/写真ズームのホバーは付けない（クリック誤認防止・2026-07-06 Sone FB） */
}
.p-cottagesPage__unitCardIn {
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: #FFFFFF;
  border: 2px solid rgba(126, 155, 122, 0.4);
  border-radius: 20px;
  overflow: hidden;
}
.p-cottagesPage__unitPhoto {
  width: 100%;
  aspect-ratio: 458/280;
  background-color: #D9D9D9;
  overflow: hidden;
}
.p-cottagesPage__unitPhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}
.p-cottagesPage__unitBody {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex: 1;
  padding: clamp(20px, 2vw, 28px) clamp(20px, 2.2vw, 32px) clamp(18px, 1.8vw, 24px);
}
.p-cottagesPage {
  /* COTTAGE 01（英字ラベル・Poppins・字間広め） */
}
.p-cottagesPage__unitLabel {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.2em;
  color: #7E9B7A;
}
.p-cottagesPage__unitName {
  margin-top: 6px;
  font-weight: 700;
  font-size: clamp(20px, 1.45vw, 24px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-cottagesPage {
  /* スペック行（定員／床面積／DG・横並び） */
}
.p-cottagesPage__unitSpec {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 16px;
  margin-top: 10px;
}
.p-cottagesPage__unitSpec span {
  font-size: 13px;
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-cottagesPage__unitCatch {
  margin-top: 8px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-cottagesPage__unitLink {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  margin-top: auto;
  padding-top: 12px;
}
.p-cottagesPage {
  /* ---------- 4.2 BBQと温泉で過ごす（クリーム・見せ場2カード・BBQ温泉肉付け） ---------- */
}
.p-cottagesPage__enjoyInner {
  max-width: calc(960px + 220px);
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-cottagesPage__enjoyInner {
    padding: 56px 16px;
  }
}
.p-cottagesPage__enjoyLead {
  max-width: 960px;
  margin: clamp(14px, 1.4vw, 22px) auto 0;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-cottagesPage__enjoyLead {
    text-align: left;
  }
}
.p-cottagesPage__enjoyGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(24px, 3vw, 44px);
  margin-top: clamp(32px, 3vw, 52px);
}
@media screen and (max-width: 767px) {
  .p-cottagesPage__enjoyGrid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}
.p-cottagesPage {
  /* 見せ場カード＝大きめ写真＋本文（editorial・カード枠なし。リンクでない＝ホバーなし） */
}
.p-cottagesPage__enjoyPhoto {
  aspect-ratio: 16/10;
  border-radius: 16px;
  background-color: #D9D9D9;
  overflow: hidden;
}
.p-cottagesPage__enjoyPhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-cottagesPage__enjoyBody {
  padding-top: clamp(16px, 1.6vw, 22px);
}
.p-cottagesPage__enjoyTitle {
  font-weight: 700;
  font-size: clamp(18px, 1.6vw, 24px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-cottagesPage__enjoyText {
  margin-top: clamp(8px, 1vw, 12px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-cottagesPage {
  /* ---------- 4.5 設備・アメニティ（クリーム・TOPアンカー先 #amenities・S-2） ---------- */
}
.p-cottagesPage__amenities {
  scroll-margin-top: 90px;
}
.p-cottagesPage__amenitiesInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-cottagesPage__amenitiesInner {
    padding: 56px 16px;
  }
}
.p-cottagesPage {
  /* 円アイコングリッド＝コテージ詳細（p-cottageSingle__amenity）とUI統一・2026-07-14 Sone FB */
}
.p-cottagesPage__amenityList {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(24px, 2.6vw, 40px) clamp(12px, 1.5vw, 24px);
  max-width: 620px;
  margin: clamp(28px, 2.8vw, 44px) auto 0;
}
@media screen and (max-width: 767px) {
  .p-cottagesPage__amenityList {
    grid-template-columns: repeat(3, 1fr);
    max-width: 360px;
    gap: 24px 8px;
    margin-top: 28px;
  }
}
.p-cottagesPage__amenityItem {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.p-cottagesPage__amenityItem:nth-child(1) {
  transition-delay: 0s;
}
.p-cottagesPage__amenityItem:nth-child(2) {
  transition-delay: 0.06s;
}
.p-cottagesPage__amenityItem:nth-child(3) {
  transition-delay: 0.12s;
}
.p-cottagesPage__amenityItem:nth-child(4) {
  transition-delay: 0.18s;
}
.p-cottagesPage__amenityItem:nth-child(5) {
  transition-delay: 0.24s;
}
.p-cottagesPage__amenityItem:nth-child(6) {
  transition-delay: 0.3s;
}
.p-cottagesPage__amenityItem:nth-child(7) {
  transition-delay: 0.36s;
}
.p-cottagesPage__amenityItem:nth-child(8) {
  transition-delay: 0.42s;
}
.p-cottagesPage__amenityItem:nth-child(9) {
  transition-delay: 0.48s;
}
.p-cottagesPage__amenityItem:nth-child(10) {
  transition-delay: 0.54s;
}
.p-cottagesPage__amenityItem:nth-child(11) {
  transition-delay: 0.6s;
}
.p-cottagesPage__amenityItem:nth-child(12) {
  transition-delay: 0.66s;
}
.p-cottagesPage__amenityIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(56px, 5vw, 72px);
  height: clamp(56px, 5vw, 72px);
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 50%;
}
.p-cottagesPage__amenityIcon img {
  width: clamp(28px, 2.5vw, 36px);
  height: auto;
}
.p-cottagesPage__amenityName {
  font-size: clamp(12px, 0.8vw, 14px);
  line-height: 1.5;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  text-align: center;
}
.p-cottagesPage__amenityNote {
  margin-top: clamp(20px, 2vw, 30px);
  font-size: clamp(12px, 0.85vw, 13px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.66);
}
.p-cottagesPage {
  /* ---------- 5. 滞在の流れ（クリーム・白カード3枚。波は隣接ピーチ帯側が持つ） ---------- */
}
.p-cottagesPage__flowInner {
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-cottagesPage__flowInner {
    padding: 64px 16px;
  }
}
.p-cottagesPage__flowGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(16px, 1.7vw, 24px);
  margin-top: clamp(32px, 3vw, 48px);
}
@media screen and (max-width: 767px) {
  .p-cottagesPage__flowGrid {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 28px;
  }
}
.p-cottagesPage__flowCard {
  padding: clamp(24px, 2.5vw, 36px);
  background-color: #FFFFFF;
  border-radius: 16px;
}
.p-cottagesPage {
  /* 滞在の流れ3カードのスタッガー出現 */
}
.p-cottagesPage__flowGrid li:nth-child(1) {
  transition-delay: 0s;
}
.p-cottagesPage__flowGrid li:nth-child(2) {
  transition-delay: 0.08s;
}
.p-cottagesPage__flowGrid li:nth-child(3) {
  transition-delay: 0.16s;
}
.p-cottagesPage {
  /* STEP 01（英字ラベル） */
}
.p-cottagesPage__flowStep {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.2em;
  color: #7E9B7A;
}
.p-cottagesPage {
  /* 15:00／滞在中（大見出し・時刻の数字はBarlow=金額と同じ数字用書体） */
}
.p-cottagesPage__flowBig {
  margin-top: 10px;
  font-family: "Barlow Semi Condensed", "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(26px, 1.7vw, 32px);
  line-height: 1.55;
  letter-spacing: 0.06em;
  color: #8B6B4E;
}
.p-cottagesPage__flowTitle {
  margin-top: 4px;
  font-weight: 700;
  font-size: clamp(16px, 1.05vw, 20px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-cottagesPage__flowText {
  margin-top: 10px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
@media screen and (max-width: 767px) {
  .p-cottagesPage__flowText br {
    display: none;
  }
}

/******************************************************************************
*
* 棟詳細ページ（p-cottageSingle）single-cottage.php
* Figma WF 287:2（1号棟こもれび・2026-07-03）をnotoieのデザイン言語で実装：
* - 帯リズム（波は1ページ3本まで＝Sone確定ルール）：
*   page-header(ピーチ・下端波1) → 魅力/概要(クリーム)
*   → フォトギャラリー(ピーチ帯・上端波2/下端波3)
*   → 設備/愛犬/料金/声/確認(クリーム・白カード＋アクセント)
*   → 予約CTA(クリーム地＋角丸ピーチパネル・波なし) → 他のコテージ(クリーム)
* - トークン厳守：カード枠 rgba($color-main,0.4)／本文 $fs-body／余白 $section-pad-y
* - 未入力フィールドはPHP側で行・カード・セクション単位非表示（SCSSは空対応不要）
*
******************************************************************************/
.p-cottageSingle {
  background-color: #F6F1E7;
  /* ---------- 共通：波形境界（p-cottagesPageと同方式） ---------- */
}
.p-cottageSingle__wave {
  line-height: 0;
  overflow: hidden;
}
.p-cottageSingle__wave img {
  display: block;
  width: 100%;
  height: clamp(40px, 5.2vw, 100px);
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__wave img {
    height: 30px;
  }
}
.p-cottageSingle {
  /* 上端：wave-bg.svg（クリーム塗り）を上下反転→クリームが上・ピーチが下 */
}
.p-cottageSingle__wave--top img {
  transform: scaleY(-1);
}
.p-cottageSingle {
  /* ---------- 2. 魅力（クリーム・画像左＋テキスト右） ---------- */
}
.p-cottageSingle__charm {
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__charm {
    padding: 64px 16px;
  }
}
.p-cottageSingle__charmInner {
  display: grid;
  grid-template-columns: minmax(0, 520px) minmax(0, 1fr);
  gap: clamp(32px, 4vw, 64px);
  align-items: center;
  max-width: 1200px;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__charmInner {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}
.p-cottageSingle__charmPhoto {
  aspect-ratio: 4/3;
  background-color: #D9D9D9;
  border-radius: 20px;
  overflow: hidden;
}
.p-cottageSingle__charmPhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.p-cottageSingle {
  /* — Charm（英字ラベル） */
}
.p-cottageSingle__charmLabel {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(14px, 1vw, 16px);
  letter-spacing: 0.14em;
  color: #7E9B7A;
}
.p-cottageSingle__charmTitle {
  margin-top: 10px;
  font-weight: 700;
  font-size: clamp(24px, 2vw, 36px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-cottageSingle__charmText {
  margin-top: clamp(16px, 1.6vw, 24px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-cottageSingle {
  /* ---------- 3. 概要（クリーム・表＋時刻パネル） ---------- */
}
.p-cottageSingle__overview {
  padding: clamp(48px, 5vw, 88px) 24px clamp(64px, 6vw, 116px);
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__overview {
    padding: 48px 16px 64px;
  }
}
.p-cottageSingle__overviewInner {
  position: relative;
  max-width: 960px;
  margin-inline: auto;
}
.p-cottageSingle {
  /* 各コテージの手描きイラスト＝装飾アクセント（見出し脇・右上に少し傾けて手貼り風）2026-07-14 */
}
.p-cottageSingle__illustDeco {
  position: absolute;
  top: -28px;
  right: 0;
  width: clamp(104px, 12vw, 150px);
  height: auto;
  pointer-events: none;
  z-index: 1;
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__illustDeco {
    display: none;
  }
}
.p-cottageSingle__overviewGrid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: clamp(20px, 2vw, 32px);
  align-items: start;
  margin-top: clamp(32px, 3vw, 48px);
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__overviewGrid {
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 28px;
  }
}
.p-cottageSingle {
  /* 2階キッチン等の注釈（1号棟・6号棟・C-2） */
}
.p-cottageSingle__overviewNote {
  margin-top: clamp(14px, 1.4vw, 20px);
  font-size: clamp(12px, 0.85vw, 13px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-cottageSingle {
  /* 間取り図（原寸クッキリ＝拡大しない。額縁カード＋タップで原寸拡大）2026-07-14 */
}
.p-cottageSingle__floor {
  margin: clamp(28px, 3vw, 44px) auto 0;
  max-width: 640px;
  padding: clamp(16px, 2vw, 28px);
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 16px;
  text-align: center;
}
.p-cottageSingle__floorCap {
  font-weight: 700;
  font-size: clamp(14px, 1vw, 16px);
  letter-spacing: 0.05em;
  color: #8B6B4E;
  margin-bottom: clamp(12px, 1.4vw, 18px);
}
.p-cottageSingle__floorLink {
  display: block;
}
.p-cottageSingle__floorLink img {
  width: 100%;
  height: auto;
  max-width: 100%;
}
.p-cottageSingle__floorNote {
  margin-top: 10px;
  font-size: clamp(11px, 0.8vw, 12px);
  color: rgba(43, 43, 43, 0.6);
}
.p-cottageSingle {
  /* 概要表（罫線＝緑40%・既存トークン） */
}
.p-cottageSingle__overviewTable {
  width: 100%;
  border-collapse: collapse;
}
.p-cottageSingle__overviewTable th,
.p-cottageSingle__overviewTable td {
  padding: clamp(12px, 1.3vw, 18px) clamp(8px, 1vw, 16px);
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-align: left;
  vertical-align: top;
}
.p-cottageSingle__overviewTable th {
  width: 7em;
  font-weight: 700;
  color: #8B6B4E;
  white-space: nowrap;
}
.p-cottageSingle__overviewTable td {
  color: #2B2B2B;
}
.p-cottageSingle {
  /* チェックイン/アウト（白パネル・時刻の数字はBarlow＝金額と同じ数字用書体） */
}
.p-cottageSingle__overviewTime {
  padding: clamp(20px, 2vw, 28px);
  background-color: #FFFFFF;
  border-radius: 16px;
}
.p-cottageSingle__overviewTimeItem {
  text-align: center;
}
.p-cottageSingle__overviewTimeItem + .p-cottageSingle__overviewTimeItem {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(126, 155, 122, 0.4);
}
.p-cottageSingle__overviewTimeItem dt {
  font-size: clamp(14px, 0.85vw, 16px);
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-cottageSingle__overviewTimeItem dd {
  margin-top: 2px;
  font-family: "Barlow Semi Condensed", "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(24px, 1.7vw, 30px);
  letter-spacing: 0.06em;
  color: #8B6B4E;
}
.p-cottageSingle {
  /* ---------- 4. フォトギャラリー（ピーチ帯・上下波） ---------- */
}
.p-cottageSingle__gallery {
  background-color: #F5E3CB;
}
.p-cottageSingle__galleryInner {
  max-width: calc(960px + 48px);
  margin-inline: auto;
  padding: clamp(48px, 4.5vw, 80px) 24px;
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__galleryInner {
    padding: 40px 16px;
  }
}
.p-cottageSingle {
  /* メイン大（アイキャッチ流用・未設定はプレースホルダー面） */
}
.p-cottageSingle__galleryMain {
  aspect-ratio: 16/9;
  margin-top: clamp(32px, 3vw, 48px);
  background-color: #D9D9D9;
  border-radius: 20px;
  overflow: hidden;
}
.p-cottageSingle__galleryMain img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__galleryMain {
    margin-top: 28px;
  }
}
.p-cottageSingle {
  /* サブ6枚グリッド（PC3列・SP2列） */
}
.p-cottageSingle__galleryGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(12px, 1.4vw, 20px);
  margin-top: clamp(12px, 1.4vw, 20px);
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__galleryGrid {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin-top: 10px;
  }
}
.p-cottageSingle__galleryGrid li {
  aspect-ratio: 4/3;
  background-color: #D9D9D9;
  border-radius: 16px;
  overflow: hidden;
}
.p-cottageSingle__galleryGrid li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-cottageSingle__galleryGrid li {
  /* サブ写真のスタッガー出現 */
}
.p-cottageSingle__galleryGrid li:nth-child(1) {
  transition-delay: 0s;
}
.p-cottageSingle__galleryGrid li:nth-child(2) {
  transition-delay: 0.08s;
}
.p-cottageSingle__galleryGrid li:nth-child(3) {
  transition-delay: 0.16s;
}
.p-cottageSingle__galleryGrid li:nth-child(4) {
  transition-delay: 0.24s;
}
.p-cottageSingle__galleryGrid li:nth-child(5) {
  transition-delay: 0.32s;
}
.p-cottageSingle__galleryGrid li:nth-child(6) {
  transition-delay: 0.4s;
}
.p-cottageSingle {
  /* ---------- 5. 設備・アメニティ（クリーム・丸アイコン横並び） ---------- */
}
.p-cottageSingle__amenity {
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__amenity {
    padding: 64px 16px;
  }
}
.p-cottageSingle__amenityInner {
  max-width: calc(1440px + 48px);
  margin-inline: auto;
}
.p-cottageSingle {
  /* 横一列だと横長＋名前が折れるため、中央寄せグリッドに（PC4列・SP3列）2026-07-14 Sone FB */
}
.p-cottageSingle__amenityList {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(24px, 2.6vw, 40px) clamp(12px, 1.5vw, 24px);
  max-width: 620px;
  margin: clamp(32px, 3vw, 48px) auto 0;
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__amenityList {
    grid-template-columns: repeat(3, 1fr);
    max-width: 360px;
    gap: 24px 8px;
    margin-top: 28px;
  }
}
.p-cottageSingle__amenityItem {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  /* アイコンのスタッガー出現（1個ずつ小気味よく） */
}
.p-cottageSingle__amenityItem:nth-child(1) {
  transition-delay: 0s;
}
.p-cottageSingle__amenityItem:nth-child(2) {
  transition-delay: 0.06s;
}
.p-cottageSingle__amenityItem:nth-child(3) {
  transition-delay: 0.12s;
}
.p-cottageSingle__amenityItem:nth-child(4) {
  transition-delay: 0.18s;
}
.p-cottageSingle__amenityItem:nth-child(5) {
  transition-delay: 0.24s;
}
.p-cottageSingle__amenityItem:nth-child(6) {
  transition-delay: 0.3s;
}
.p-cottageSingle__amenityItem:nth-child(7) {
  transition-delay: 0.36s;
}
.p-cottageSingle__amenityItem:nth-child(8) {
  transition-delay: 0.42s;
}
.p-cottageSingle__amenityItem:nth-child(9) {
  transition-delay: 0.48s;
}
.p-cottageSingle__amenityItem:nth-child(10) {
  transition-delay: 0.54s;
}
.p-cottageSingle__amenityItem:nth-child(11) {
  transition-delay: 0.6s;
}
.p-cottageSingle__amenityItem:nth-child(12) {
  transition-delay: 0.66s;
}
.p-cottageSingle {
  /* 丸アイコン（白面・特徴カードのアイコンと同言語） */
}
.p-cottageSingle__amenityIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(56px, 5vw, 72px);
  height: clamp(56px, 5vw, 72px);
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 50%;
  /* リセットのimg{width:100%}を打ち消して実寸固定 */
}
.p-cottageSingle__amenityIcon img {
  width: clamp(28px, 2.5vw, 36px);
  height: auto;
}
.p-cottageSingle__amenityName {
  font-size: clamp(12px, 0.8vw, 14px);
  line-height: 1.5;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  text-align: center;
}
.p-cottageSingle {
  /* ---------- 6. 愛犬とご一緒に（クリーム・リード＋画像＋カード2枚） ---------- */
}
.p-cottageSingle__dog {
  padding: 0 24px clamp(64px, 6vw, 116px);
  overflow-x: clip;
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__dog {
    padding: 0 16px 64px;
  }
}
.p-cottageSingle__dogInner {
  position: relative;
  max-width: 960px;
  margin-inline: auto;
  text-align: center;
}
.p-cottageSingle {
  /* 装飾：足あとトレイル（960幅の外側右・写真脇の余白を歩く。SPは余白が無いため非表示） */
}
.p-cottageSingle__paws {
  top: 30%;
  right: clamp(-200px, -13vw, -60px);
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__paws {
    display: none;
  }
}
.p-cottageSingle__dogLead {
  margin-top: clamp(16px, 1.6vw, 24px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__dogLead {
    text-align: left;
  }
}
.p-cottageSingle__dogPhoto {
  aspect-ratio: 16/9;
  margin-top: clamp(24px, 2.4vw, 40px);
  background-color: #D9D9D9;
  border-radius: 20px;
  overflow: hidden;
}
.p-cottageSingle__dogPhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-cottageSingle__dogCards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(16px, 1.7vw, 24px);
  margin-top: clamp(16px, 1.7vw, 24px);
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__dogCards {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}
.p-cottageSingle__dogCard {
  padding: clamp(24px, 2.4vw, 36px);
  background-color: #FFFFFF;
  border-radius: 16px;
  text-align: center;
  /* カード2枚のスタッガー出現 */
}
.p-cottageSingle__dogCard:nth-child(2) {
  transition-delay: 0.08s;
}
.p-cottageSingle__dogCardTitle {
  font-weight: 700;
  font-size: clamp(16px, 1.1vw, 20px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-cottageSingle {
  /* 約24㎡（大きめ数字・Barlow） */
}
.p-cottageSingle__dogCardBig {
  margin-top: 8px;
  font-family: "Barlow Semi Condensed", "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(26px, 1.9vw, 34px);
  letter-spacing: 0.04em;
  color: #2B2B2B;
}
.p-cottageSingle__dogCardText {
  margin-top: 6px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-cottageSingle {
  /* ペット料金（label／valueの2列・罫線区切り） */
}
.p-cottageSingle__dogFees {
  margin-top: 12px;
  text-align: left;
}
.p-cottageSingle__dogFee {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  padding: 8px 0;
}
.p-cottageSingle__dogFee + .p-cottageSingle__dogFee {
  border-top: 1px solid rgba(126, 155, 122, 0.4);
}
.p-cottageSingle__dogFee dt {
  font-size: clamp(14px, 0.85vw, 16px);
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-cottageSingle__dogFee dd {
  font-weight: 700;
  font-size: clamp(14px, 0.85vw, 16px);
  letter-spacing: 0.05em;
  color: #8B6B4E;
  white-space: nowrap;
}
.p-cottageSingle__dogLink {
  display: flex;
  justify-content: center;
  margin-top: clamp(20px, 2vw, 32px);
}
.p-cottageSingle {
  /* ---------- 7. 宿泊料金（クリーム・料金ページ誘導） ---------- */
}
.p-cottageSingle__price {
  padding: 0 24px clamp(64px, 6vw, 116px);
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__price {
    padding: 0 16px 64px;
  }
}
.p-cottageSingle__priceInner {
  max-width: 960px;
  margin-inline: auto;
  text-align: center;
}
.p-cottageSingle__priceText {
  margin-top: clamp(14px, 1.4vw, 22px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-cottageSingle__priceButton {
  display: flex;
  justify-content: center;
  margin-top: clamp(24px, 2.2vw, 36px);
}
.p-cottageSingle {
  /* ---------- 8. お客様の声（実レビュー転載待ち・空の間は非表示） ---------- */
}
.p-cottageSingle__voice {
  padding: 0 24px clamp(64px, 6vw, 116px);
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__voice {
    padding: 0 16px 64px;
  }
}
.p-cottageSingle__voiceInner {
  max-width: calc(1440px + 48px);
  margin-inline: auto;
}
.p-cottageSingle__voiceGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(16px, 1.7vw, 24px);
  margin-top: clamp(32px, 3vw, 48px);
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__voiceGrid {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 28px;
  }
}
.p-cottageSingle__voiceCard {
  padding: clamp(24px, 2.4vw, 36px);
  background-color: #FFFFFF;
  border-radius: 16px;
}
.p-cottageSingle__voiceCard:nth-child(1) {
  transition-delay: 0s;
}
.p-cottageSingle__voiceCard:nth-child(2) {
  transition-delay: 0.08s;
}
.p-cottageSingle__voiceCard:nth-child(3) {
  transition-delay: 0.16s;
}
.p-cottageSingle__voiceTitle {
  font-weight: 700;
  font-size: clamp(15px, 1vw, 18px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-cottageSingle__voiceText {
  margin-top: 10px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-cottageSingle__voiceMeta {
  margin-top: 10px;
  font-size: 12px;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.7);
}
.p-cottageSingle {
  /* ---------- 9. ご予約前にご確認ください（クリーム・白カード2枚） ---------- */
}
.p-cottageSingle__notice {
  padding: 0 24px clamp(64px, 6vw, 116px);
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__notice {
    padding: 0 16px 64px;
  }
}
.p-cottageSingle__noticeInner {
  max-width: 960px;
  margin-inline: auto;
}
.p-cottageSingle__noticeGrid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(16px, 1.7vw, 24px);
  margin-top: clamp(32px, 3vw, 48px);
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__noticeGrid {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 28px;
  }
}
.p-cottageSingle {
  /* 縦長で空きが多く不自然だったため、タイトル左＋リンク右の横並びコンパクトに（2026-07-14 Sone FB） */
}
.p-cottageSingle__noticeCard {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: clamp(12px, 1.6vw, 24px);
  padding: clamp(18px, 1.8vw, 26px) clamp(22px, 2.4vw, 34px);
  background-color: #FFFFFF;
  border: 2px solid rgba(126, 155, 122, 0.4);
  border-radius: 16px;
}
.p-cottageSingle__noticeCard:nth-child(2) {
  transition-delay: 0.08s;
}
.p-cottageSingle__noticeTitle {
  font-weight: 700;
  font-size: clamp(16px, 1.1vw, 20px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
  text-align: left;
}
.p-cottageSingle__noticeLink {
  flex: none;
  display: flex;
  justify-content: flex-end;
}
.p-cottageSingle {
  /* ---------- 11. 他のコテージも見る（クリーム・カード4枚） ---------- */
}
.p-cottageSingle__others {
  padding: 0 24px clamp(64px, 6vw, 116px);
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__others {
    padding: 0 16px 64px;
  }
}
.p-cottageSingle__othersInner {
  max-width: calc(1440px + 48px);
  margin-inline: auto;
}
.p-cottageSingle__otherGrid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(16px, 1.7vw, 24px);
  margin-top: clamp(32px, 3vw, 48px);
}
@media screen and (max-width: 767px) {
  .p-cottageSingle__otherGrid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-top: 28px;
  }
}
.p-cottageSingle {
  /* カード外殻＝出現アニメ（js-fadeInUp＋スタッガー）のみ。
     見た目とホバーは a に分離＝出現のtransition-delayがホバーを遅らせない */
}
.p-cottageSingle__otherCard {
  /* スタッガー出現 */
}
.p-cottageSingle__otherCard:nth-child(1) {
  transition-delay: 0s;
}
.p-cottageSingle__otherCard:nth-child(2) {
  transition-delay: 0.08s;
}
.p-cottageSingle__otherCard:nth-child(3) {
  transition-delay: 0.16s;
}
.p-cottageSingle__otherCard:nth-child(4) {
  transition-delay: 0.24s;
}
.p-cottageSingle__otherCard a {
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: #FFFFFF;
  border: 2px solid rgba(126, 155, 122, 0.4);
  border-radius: 20px;
  overflow: hidden;
  transition: transform 0.3s ease;
  /* ホバー＝浮き（footerカードと同値）＋写真ズーム */
}
.p-cottageSingle__otherCard a:hover {
  opacity: 1;
  transform: translateY(-4px);
}
.p-cottageSingle__otherCard a:hover .p-cottageSingle__otherPhoto img {
  transform: scale(1.06);
}
.p-cottageSingle__otherPhoto {
  aspect-ratio: 4/3;
  background-color: #D9D9D9;
  overflow: hidden;
}
.p-cottageSingle__otherPhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}
.p-cottageSingle__otherBody {
  padding: clamp(14px, 1.4vw, 20px) clamp(14px, 1.5vw, 22px) clamp(16px, 1.6vw, 22px);
}
.p-cottageSingle__otherName {
  font-weight: 700;
  font-size: clamp(15px, 1.05vw, 19px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-cottageSingle__otherSpec {
  margin-top: 6px;
  font-size: clamp(12px, 0.8vw, 13px);
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}

/******************************************************************************
*
* 下層：料金（p-pricePage）page-price.php
* Figma WF 371:2 確定版を notoie のデザイン言語で実装（カンプ無し・WFが構成/コピー/数値の正本）：
* ※2026-07-07 Sone指示：シーズン区分カードのセクションを撤去（列は A〜E期）／棟タブUIを廃止し各棟テーブルを縦羅列に変更。
* - 帯リズム（波は1ページ3本まで＝Sone確定ルール）：
*   header(ピーチ・下端波1) → §2 リード(クリーム)
*   → §3 宿泊料金表(クリーム・各棟テーブルを縦羅列) → §4 オプション料金(ピーチ帯・上端波2/下端波3)
*   → §5 料金に関するご注意(クリーム) → §6 お支払い・キャンセル(クリーム)
*   → §7 予約CTA(クリーム地＋角丸ピーチパネル・波なし) → フッター(クリーム)
* - ★ホバーは押せる要素だけ（AI_CONTEXT §4.5）：オプションのリンク・支払いカード(<a>)・CTAのみ。
*   注意/支払いカード等はリンクでない＝浮き/影ホバーなし。出現アニメ(js-fadeInUp)は外殻／見た目は内側に分離。
* - ★緑抑制＋緑の集約（HANDOFF §4・2026-07-07）：ソリッド緑は「料金表のヘッダー行の塗り」に集約
*   （テーブルヘッダー緑塗りルール＝FAQ post-table と同方針）。見出し・タブ・価格・小ラベルはブラウン。
*   細い罫線のみ緑40% rgba($color-main,0.4)。
* - ★装飾イラストなし。トークン厳守：本文 $fs-body／余白 $section-pad-y／角丸16-20。
*
******************************************************************************/
.p-pricePage {
  background-color: #F6F1E7;
  /* ---------- 共通：波形境界（ピーチ帯の出入り・concierge/noto と同方式） ---------- */
}
.p-pricePage__wave {
  line-height: 0;
  overflow: hidden;
}
.p-pricePage__wave img {
  display: block;
  width: 100%;
  height: clamp(40px, 5.2vw, 100px);
}
@media screen and (max-width: 767px) {
  .p-pricePage__wave img {
    height: 30px;
  }
}
.p-pricePage {
  /* 上端：wave-bg.svg（クリーム塗り）を上下反転→クリームが上・ピーチが下 */
}
.p-pricePage__wave--top img {
  transform: scaleY(-1);
}
.p-pricePage {
  /* ============================================================
     §2 リード文（クリーム・header下端波で受けるため波なし）
  ============================================================ */
}
.p-pricePage__leadInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-pricePage__leadInner {
    padding: 56px 16px;
  }
}
.p-pricePage__leadText {
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 2;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-pricePage__leadText {
    text-align: left;
  }
}
.p-pricePage {
  /* ============================================================
     §3 宿泊料金表（クリーム・棟タブ＋料金マトリクス）
     ※シーズン区分カードは撤去（2026-07-07 Sone指示）。列は A期〜E期。
     タブ＝button（押せる要素＝ホバー可）。ヘッダー行＝緑塗り（緑の集約）。
  ============================================================ */
}
.p-pricePage__ratesInner {
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding: 0 24px clamp(64px, 6vw, 116px);
}
@media screen and (max-width: 767px) {
  .p-pricePage__ratesInner {
    padding: 0 16px 56px;
  }
}
.p-pricePage {
  /* 各棟ブロックを縦に羅列（棟タブUIは廃止・2026-07-07 PR-2） */
}
.p-pricePage__rateList {
  margin-top: clamp(28px, 2.8vw, 44px);
  display: flex;
  flex-direction: column;
  gap: clamp(32px, 3.4vw, 52px);
}
.p-pricePage {
  /* 外殻＝出現アニメ(js-fadeInUp)のみ（各棟が個別IOターゲット＝縦スクロールで自然に時間差表示） */
}
.p-pricePage__cottageName {
  margin-bottom: clamp(10px, 1.2vw, 16px);
  font-weight: 700;
  font-size: clamp(17px, 1.4vw, 20px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-pricePage {
  /* SPで横スクロール＝ScrollHint（.js-scrollable）でスワイプ誘導 */
}
.p-pricePage__tableScroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 12px;
}
.p-pricePage__table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
  background-color: #FFFFFF;
}
.p-pricePage__table th,
.p-pricePage__table td {
  padding: clamp(14px, 1.4vw, 20px) clamp(10px, 1vw, 16px);
  border: 1px solid rgba(126, 155, 122, 0.4);
  text-align: center;
  font-size: clamp(13px, 0.95vw, 14px);
  letter-spacing: 0.05em;
  white-space: nowrap;
}
.p-pricePage__table thead th {
  background-color: #7E9B7A;
  border-color: #7E9B7A;
  color: #FFFFFF;
  font-weight: 700;
}
.p-pricePage__table tbody td {
  font-family: "Barlow Semi Condensed", "Poppins", sans-serif;
  color: #2B2B2B;
}
.p-pricePage__thPax {
  background-color: rgba(139, 107, 78, 0.07);
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif !important;
  font-weight: 700;
  color: #8B6B4E;
}
thead .p-pricePage__thPax {
  background-color: #7E9B7A;
  color: #FFFFFF;
}
.p-pricePage__rateNotes {
  margin-top: clamp(14px, 1.4vw, 20px);
  font-size: clamp(11px, 0.75vw, 12px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.65);
}
.p-pricePage {
  /* ============================================================
     §5 オプション料金（ピーチ帯・上下波・横長カード縦積み）
  ============================================================ */
}
.p-pricePage__options {
  position: relative;
  background-color: #F5E3CB;
}
.p-pricePage__optionsInner {
  max-width: calc(960px + 120px);
  margin-inline: auto;
  padding: clamp(48px, 4.5vw, 80px) 24px;
}
@media screen and (max-width: 767px) {
  .p-pricePage__optionsInner {
    padding: 40px 16px;
  }
}
.p-pricePage__optionList {
  display: flex;
  flex-direction: column;
  gap: clamp(16px, 1.6vw, 24px);
  margin-top: clamp(32px, 3vw, 52px);
}
.p-pricePage {
  /* 外殻＝出現アニメのみ。枠・背景は内側 __optionCardIn に分離。ホバーなし（カード自体はリンクでない）。 */
}
.p-pricePage__optionCardIn {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: clamp(18px, 2vw, 32px);
  padding: clamp(22px, 2.2vw, 28px) clamp(24px, 2.6vw, 32px);
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 20px;
}
@media screen and (max-width: 767px) {
  .p-pricePage__optionCardIn {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}
.p-pricePage__optionTitle {
  font-weight: 700;
  font-size: clamp(18px, 1.4vw, 20px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-pricePage__optionBody {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.p-pricePage {
  /* 項目＝ラベル（左・固定幅）＋内容（右）。ラベル無し（日帰り）は内容のみ。 */
}
.p-pricePage__optionItem {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 16px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-pricePage__optionLabel {
  flex: 0 0 auto;
  min-width: 148px;
}
@media screen and (max-width: 767px) {
  .p-pricePage__optionLabel {
    min-width: 0;
    font-weight: 700;
  }
}
.p-pricePage__optionNote {
  margin-top: 2px;
  font-size: clamp(11px, 0.75vw, 12px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.6);
}
.p-pricePage {
  /* リンク（→ ペットと泊まる 詳細 等）＝押せる<a>はホバー可・ブラウン太字。
     リンク先未定は静的spanで矢印フローを付けない。 */
}
.p-pricePage__optionLink {
  display: inline-block;
  margin-top: 8px;
  font-weight: 700;
  font-size: clamp(14px, 0.85vw, 16px);
  letter-spacing: 0.05em;
  color: #8B6B4E;
  text-decoration: none;
  transition: opacity 0.2s ease;
}
.p-pricePage a.p-pricePage__optionLink:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}
.p-pricePage__optionLink--static {
  color: rgba(139, 107, 78, 0.7);
  cursor: default;
}
.p-pricePage {
  /* ============================================================
     §6 料金に関するご注意（クリーム・定義リスト・罫線緑40%）
  ============================================================ */
}
.p-pricePage__noticeInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-pricePage__noticeInner {
    padding: 56px 16px;
  }
}
.p-pricePage__noticeList {
  margin-top: clamp(28px, 2.8vw, 44px);
  padding: clamp(24px, 2.6vw, 32px);
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 16px;
}
.p-pricePage__noticeRow {
  display: flex;
  gap: clamp(12px, 1.4vw, 16px);
  padding: 14px 0;
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
}
.p-pricePage__noticeRow:first-child {
  padding-top: 0;
}
.p-pricePage__noticeRow:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}
@media screen and (max-width: 767px) {
  .p-pricePage__noticeRow {
    flex-direction: column;
    gap: 4px;
  }
}
.p-pricePage__noticeLabel {
  flex: 0 0 auto;
  width: 180px;
  font-weight: 700;
  font-size: clamp(14px, 0.85vw, 16px);
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
@media screen and (max-width: 767px) {
  .p-pricePage__noticeLabel {
    width: auto;
  }
}
.p-pricePage__noticeValue {
  flex: 1 1 0;
  min-width: 0;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-pricePage {
  /* ============================================================
     §7 お支払い・キャンセル（クリーム・2カード。カードは<a>＝ホバー可）
  ============================================================ */
}
.p-pricePage__payInner {
  max-width: 960px;
  margin-inline: auto;
  padding: 0 24px clamp(64px, 6vw, 116px);
}
@media screen and (max-width: 767px) {
  .p-pricePage__payInner {
    padding: 0 16px 56px;
  }
}
.p-pricePage__payList {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(16px, 1.7vw, 24px);
  margin-top: clamp(28px, 2.8vw, 44px);
}
@media screen and (max-width: 575px) {
  .p-pricePage__payList {
    grid-template-columns: 1fr;
  }
}
.p-pricePage {
  /* 外殻＝出現アニメのみ。<a>の内側__payCardInにホバー（押せる要素）。 */
}
.p-pricePage__payCardIn {
  display: block;
  height: 100%;
  padding: clamp(24px, 2.4vw, 32px);
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 16px;
  text-decoration: none;
  transition: background-color 0.25s ease, border-color 0.25s ease;
}
.p-pricePage__payCardIn:hover {
  background-color: rgba(139, 107, 78, 0.06);
  border-color: rgba(139, 107, 78, 0.5);
}
.p-pricePage__payTitle {
  font-weight: 700;
  font-size: clamp(18px, 1.5vw, 22px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-pricePage__payText {
  display: block;
  margin-top: 8px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.75);
}

/******************************************************************************
*
* 下層：ペットと泊まる（p-petPage）page-pet.php
* Figma WF 266:2 確定版をnotoieのデザイン言語で実装（カンプ無し・WFが構成/コピーの正本）：
* - 帯リズム（波は1ページ3本まで＝Sone確定ルール）：
*   header(ピーチ・下端波1)→全棟ドッグガーデン(クリーム)→5棟のドッグガーデン(ピーチ帯・上端波2/下端波3)
*   →料金/設備/お願い(クリーム)→あなたに合う棟は?(クリーム・左右分割の交互リズム)
*   →よくある質問(クリーム)→予約CTA(クリーム地＋角丸ピーチパネル・波なし)→フッター(クリーム)
* - 帯の出入りは波形境界（c-waveFlow・上端=右流れ/下端=左流れ）
* - トークン厳守：罫線 rgba($color-main,0.4)／本文 $fs-body／余白 $section-pad-y／角丸は既存値(16/20)
* - ㎡数の数字＝Poppins（金額ではないのでBarlow不可）
*
******************************************************************************/
.p-petPage {
  background-color: #F6F1E7;
  /* ---------- 共通：波形境界（ピーチ帯の出入り・cottages-pageと同方式） ---------- */
}
.p-petPage__wave {
  line-height: 0;
  overflow: hidden;
}
.p-petPage__wave img {
  display: block;
  width: 100%;
  height: clamp(40px, 5.2vw, 100px);
}
@media screen and (max-width: 767px) {
  .p-petPage__wave img {
    height: 30px;
  }
}
.p-petPage {
  /* 上端：wave-bg.svg（クリーム塗り）を上下反転→クリームが上・ピーチが下 */
}
.p-petPage__wave--top img {
  transform: scaleY(-1);
}
.p-petPage {
  /* ============================================================
     §2 全棟ドッグガーデン（クリーム）
     header下端波（左流れ）で受けるため波を持たない
  ============================================================ */
}
.p-petPage__introInner {
  position: relative;
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-petPage__introInner {
    padding: 64px 16px;
  }
}
.p-petPage {
  /* 本文（960幅・中央・「。」直後で改行） */
}
.p-petPage__introText {
  max-width: 960px;
  margin: clamp(20px, 2vw, 32px) auto 0;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
@media screen and (max-width: 767px) {
  .p-petPage__introText {
    text-align: left;
  }
  .p-petPage__introText br {
    display: none;
  }
}
.p-petPage {
  /* 大判写真 960×500（ドッグガーデン全景・2026-07-13 実写真挿入） */
}
.p-petPage__introPhoto {
  max-width: 960px;
  margin: clamp(32px, 3.5vw, 56px) auto 0;
  aspect-ratio: 960/500;
  background-color: #D9D9D9;
  border-radius: 20px;
  overflow: hidden;
}
.p-petPage__introPhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-petPage {
  /* 装飾：足あとトレイル（introの右下→次のピーチ帯へ歩いていく・cottages-pageと同パターン） */
}
.p-petPage__paws {
  right: 3%;
  bottom: clamp(-72px, -4vw, -40px);
}
.p-petPage {
  /* ============================================================
     §3 5棟のドッグガーデン（ピーチ帯＋上下波・カードPC3+2中央寄せ）
  ============================================================ */
}
.p-petPage__gardens {
  background-color: #F5E3CB;
}
.p-petPage__gardensInner {
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding: clamp(48px, 4.5vw, 80px) 24px;
}
@media screen and (max-width: 767px) {
  .p-petPage__gardensInner {
    padding: 40px 16px;
  }
}
.p-petPage__gardenGrid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(24px, 2.5vw, 36px) clamp(20px, 1.7vw, 24px);
  margin-top: clamp(32px, 3vw, 48px);
}
.p-petPage {
  /* 5棟カードのスタッガー出現 */
}
.p-petPage__gardenGrid li:nth-child(1) {
  transition-delay: 0s;
}
.p-petPage__gardenGrid li:nth-child(2) {
  transition-delay: 0.08s;
}
.p-petPage__gardenGrid li:nth-child(3) {
  transition-delay: 0.16s;
}
.p-petPage__gardenGrid li:nth-child(4) {
  transition-delay: 0.24s;
}
.p-petPage__gardenGrid li:nth-child(5) {
  transition-delay: 0.32s;
}
.p-petPage {
  /* カード外殻＝出現アニメ＋レイアウトのみ。見た目/ホバーは内側に分離（cottages-page方式） */
}
.p-petPage__gardenCard {
  width: clamp(300px, 31vw, 458px);
}
@media screen and (max-width: 767px) {
  .p-petPage__gardenCard {
    width: min(100%, 400px);
  }
}
.p-petPage__gardenCardIn {
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: #FFFFFF;
  border: 2px solid rgba(126, 155, 122, 0.4);
  border-radius: 20px;
  overflow: hidden;
  /* リンクでない表示カードのためホバーの浮き/影は付けない（クリック誤認防止・2026-07-06 Sone FB） */
}
.p-petPage {
  /* 写真プレースホルダー240高（WF指定） */
}
.p-petPage__gardenPhoto {
  width: 100%;
  height: 240px;
  background-color: #D9D9D9;
  /* 実写真挿入（2026-07-13）。リセットの img{width:100%} だけでは高さが潰れるため cover を明示 */
}
.p-petPage__gardenPhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media screen and (max-width: 767px) {
  .p-petPage__gardenPhoto {
    height: 200px;
  }
}
.p-petPage__gardenBody {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex: 1;
  padding: clamp(18px, 1.8vw, 24px) clamp(20px, 2.2vw, 28px) clamp(20px, 2vw, 26px);
}
.p-petPage__gardenName {
  font-weight: 700;
  font-size: clamp(18px, 1.25vw, 22px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-petPage {
  /* ㎡数を大きく（数字＝Poppins／金額ではないのでBarlow不可） */
}
.p-petPage__gardenArea {
  display: flex;
  align-items: baseline;
  gap: 2px;
  margin-top: 6px;
  color: #8B6B4E;
}
.p-petPage__gardenAreaNum {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(34px, 3vw, 44px);
  line-height: 1.1;
  letter-spacing: 0.02em;
}
.p-petPage__gardenAreaUnit {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(16px, 1.2vw, 20px);
}
.p-petPage {
  /* 配置ラベル（チップ状・淡いブラウン面＝緑抑制） */
}
.p-petPage__gardenPlace {
  margin-top: 12px;
  padding: 6px 14px;
  background-color: rgba(139, 107, 78, 0.08);
  border-radius: 999px;
  font-size: 13px;
  line-height: 1.5;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-petPage {
  /* ============================================================
     §4 料金・条件（クリーム・料金表3行・罫線=緑40%）
  ============================================================ */
}
.p-petPage__feeInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-petPage__feeInner {
    padding: 64px 16px;
  }
}
.p-petPage__feeList {
  margin-top: clamp(28px, 2.6vw, 44px);
  border-top: 1px solid rgba(126, 155, 122, 0.4);
}
.p-petPage__feeRow {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: clamp(16px, 1.6vw, 22px) 8px;
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
}
.p-petPage__feeRow dt {
  font-weight: 700;
  font-size: clamp(15px, 1vw, 18px);
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-petPage__feeRow dd {
  font-size: clamp(15px, 1vw, 18px);
  letter-spacing: 0.05em;
  color: #2B2B2B;
  text-align: right;
}
.p-petPage__feeNote {
  margin-top: 16px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-petPage {
  /* ============================================================
     §5 設備（クリーム・丸アイコン4つ横並び）
  ============================================================ */
}
.p-petPage__facilityInner {
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding: 0 24px clamp(20px, 3vw, 48px);
}
@media screen and (max-width: 767px) {
  .p-petPage__facilityInner {
    padding: 0 16px 32px;
  }
}
.p-petPage__facilityList {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(24px, 3vw, 48px);
  margin-top: clamp(28px, 2.6vw, 44px);
}
.p-petPage__facilityItem {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: clamp(120px, 16vw, 180px);
}
.p-petPage {
  /* 4アイテムのスタッガー */
}
.p-petPage__facilityList li:nth-child(1) {
  transition-delay: 0s;
}
.p-petPage__facilityList li:nth-child(2) {
  transition-delay: 0.08s;
}
.p-petPage__facilityList li:nth-child(3) {
  transition-delay: 0.16s;
}
.p-petPage__facilityList li:nth-child(4) {
  transition-delay: 0.24s;
}
.p-petPage__facilityIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(72px, 6vw, 92px);
  height: clamp(72px, 6vw, 92px);
  background-color: rgba(139, 107, 78, 0.09);
  border-radius: 50%;
  /* リセットのimg{width:100%}を打ち消して実寸固定 */
}
.p-petPage__facilityIcon img {
  width: clamp(38px, 3.2vw, 46px);
  height: auto;
}
.p-petPage__facilityLabel {
  font-weight: 700;
  font-size: clamp(14px, 0.95vw, 16px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
  text-align: center;
}
.p-petPage {
  /* ============================================================
     §6 お願い・注意事項（クリーム・リスト4行・罫線=緑40%）
  ============================================================ */
}
.p-petPage__mannersInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-petPage__mannersInner {
    padding: 64px 16px;
  }
}
.p-petPage__mannerList {
  margin-top: clamp(28px, 2.6vw, 44px);
  border-top: 1px solid rgba(126, 155, 122, 0.4);
}
.p-petPage__mannerItem {
  position: relative;
  padding: clamp(16px, 1.6vw, 22px) 8px clamp(16px, 1.6vw, 22px) 30px;
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  /* 行頭のドット（緑抑制でブラウンへ） */
}
.p-petPage__mannerItem::before {
  content: "";
  position: absolute;
  left: 8px;
  top: calc(clamp(16px, 1.6vw, 22px) + 0.7em);
  width: 8px;
  height: 8px;
  background-color: #8B6B4E;
  border-radius: 50%;
}
.p-petPage {
  /* ============================================================
     §7 あなたに合う棟は？（クリーム・左右分割の交互リズム＝メイン）
  ============================================================ */
}
.p-petPage__findInner {
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-petPage__findInner {
    padding: 64px 16px;
  }
}
.p-petPage__findHead {
  text-align: center;
}
.p-petPage__findLabel {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(13px, 0.95vw, 16px);
  letter-spacing: 0.1em;
  color: #8B6B4E;
}
.p-petPage__findTitle {
  margin-top: 10px;
  font-weight: 700;
  font-size: clamp(26px, 2.4vw, 40px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-petPage__findLead {
  max-width: 960px;
  margin: clamp(14px, 1.4vw, 22px) auto 0;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
@media screen and (max-width: 767px) {
  .p-petPage__findLead {
    text-align: left;
  }
}
.p-petPage__scenarioList {
  display: flex;
  flex-direction: column;
  gap: clamp(32px, 3.5vw, 56px);
  margin-top: clamp(40px, 4vw, 64px);
}
.p-petPage {
  /* シナリオカード＝左写真520幅＋右テキスト。--reverseで左右反転（同じ形を5連続させない） */
}
.p-petPage__scenario {
  display: grid;
  grid-template-columns: minmax(0, 520px) 1fr;
  align-items: center;
  gap: clamp(24px, 3vw, 56px);
}
@media screen and (max-width: 767px) {
  .p-petPage__scenario {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
@media screen and (min-width: 768px) {
  .p-petPage__scenario--reverse {
    /* 列も入れ替える＝写真を常に520px列に収める（order だけ替えると写真が 1fr 列に入り
       左右で写真幅が変わる不具合になる・2026-07-07 Sone「左右で画像サイズが違う」FB） */
    grid-template-columns: 1fr minmax(0, 520px);
  }
  .p-petPage__scenario--reverse .p-petPage__scenarioPhoto {
    order: 2;
  }
  .p-petPage__scenario--reverse .p-petPage__scenarioBody {
    order: 1;
  }
}
.p-petPage {
  /* 写真プレースホルダー＋大きい番号 */
}
.p-petPage__scenarioPhoto {
  position: relative;
  aspect-ratio: 520/360;
  background-color: #D9D9D9;
  border-radius: 20px;
  overflow: hidden;
  /* シナリオ行はリンクではない（クリック要素は行内の c-arrowLink のみ）ため
     行ホバーでの写真の影は付けない（クリック誤認防止・2026-07-06 Sone FB） */
  /* 実写真挿入（2026-07-13）。imgは番号span（absolute）より前＝重なり順は維持 */
}
.p-petPage__scenarioPhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.p-petPage {
  /* 番号01〜05は大きくPoppins */
}
.p-petPage__scenarioNo {
  position: absolute;
  top: 10px;
  left: 20px;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(56px, 7vw, 104px);
  line-height: 1;
  color: rgba(255, 255, 255, 0.85);
  letter-spacing: 0.02em;
}
.p-petPage__scenarioQ {
  font-weight: 700;
  font-size: clamp(17px, 1.3vw, 24px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
  /* 引用符 “ ” はWF原文に無い記号のため不採用（2026-07-06レビュー確定・素の太字見出し） */
}
.p-petPage__scenarioName {
  margin-top: 12px;
  font-weight: 700;
  font-size: clamp(15px, 1vw, 18px);
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-petPage__scenarioText {
  margin-top: 8px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-petPage__scenarioChips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  margin-top: 16px;
}
.p-petPage__scenarioChips li {
  padding: 6px 14px;
  background-color: rgba(139, 107, 78, 0.08);
  border-radius: 999px;
  font-size: 12.5px;
  line-height: 1.5;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-petPage__scenarioLink {
  margin-top: 20px;
}
.p-petPage {
  /* ============================================================
     §8 よくある質問（クリーム・Q太字＋A本文・罫線=緑40%）
  ============================================================ */
}
.p-petPage__faqInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-petPage__faqInner {
    padding: 64px 16px;
  }
}
.p-petPage__faqInner {
  /* 見出し直下のアコーディオン（共有 p-faqPage__qaList）＝見出しとの標準余白がなく詰まっていたので付与
     余白は共通トークン $title-gap（2026-07-15 Sone指示） */
}
.p-petPage__faqInner .p-faqPage__qaList {
  margin-top: clamp(28px, 2.8vw, 44px);
}
.p-petPage__faqList {
  margin-top: clamp(28px, 2.6vw, 44px);
  border-top: 1px solid rgba(126, 155, 122, 0.4);
}
.p-petPage__faqItem {
  padding: clamp(20px, 2vw, 28px) 4px;
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
}
.p-petPage__faqQ, .p-petPage__faqA {
  display: flex;
  gap: 12px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
}
.p-petPage__faqQ {
  font-weight: 700;
  color: #8B6B4E;
  font-size: clamp(15px, 1vw, 18px);
}
.p-petPage__faqA {
  margin-top: 10px;
  color: #2B2B2B;
}
.p-petPage {
  /* Q / A のバッジ（英字Poppins・丸） */
}
.p-petPage__faqMark {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
}
.p-petPage__faqMark--q {
  background-color: #8B6B4E;
  color: #FFFFFF;
}
.p-petPage__faqMark--a {
  background-color: rgba(139, 107, 78, 0.1);
  color: #8B6B4E;
}
.p-petPage__faqQText {
  padding-top: 3px;
}
.p-petPage__faqAText {
  padding-top: 3px;
}

/******************************************************************************
*
* 下層：能登の楽しみ方（p-notoPage）page-noto.php
* Figma WF 335:2 確定版を notoie のデザイン言語で実装（カンプ無し・WFが構成/コピーの正本）：
* - 帯リズム（波は1ページ3本まで＝Sone確定ルール）：
*   header(ピーチ・下端波1)→§2 リード(クリーム)→§3 スポットマップ(クリーム＝TOPと同じ地色)
*   →§4 1日のモデルコース(クリーム・タブ＋タイムライン)
*   →§5 ノトイエで食を楽しむ(ピーチ帯・上端波2/下端波3・3カード)
*   →§6 予約CTA(クリーム地＋角丸ピーチパネル・波なし)→フッター(クリーム)
* - ★緑抑制ルール（HANDOFF §4 新ルール）を本ページに適用：
*   ソリッド緑アクセント（時刻・タブ下線・凡例ドット・小ラベル）→ ブラウン（$color-main-dark）
*   淡い緑面 → 淡いブラウン rgba($color-main-dark, 0.08〜0.10)／緑は罫線 rgba($color-main,0.4) のみ残す
* - トークン厳守：罫線 rgba($color-main,0.4)／本文 $fs-body／余白 $section-pad-y／角丸は既存値(16/20)
* - 時刻の数字＝Poppins（金額ではないのでBarlow不可）
* - マップDOMは既存 .p-notoMap__* を再利用（本ファイルでは触らない＝_p-noto-map.scss / map.js が担う）
*
******************************************************************************/
.p-notoPage {
  background-color: #F6F1E7;
  /* ---------- 共通：波形境界（ピーチ帯の出入り・pet-pageと同方式） ---------- */
}
.p-notoPage__wave {
  line-height: 0;
  overflow: hidden;
}
.p-notoPage__wave img {
  display: block;
  width: 100%;
  height: clamp(40px, 5.2vw, 100px);
}
@media screen and (max-width: 767px) {
  .p-notoPage__wave img {
    height: 30px;
  }
}
.p-notoPage {
  /* 上端：wave-bg.svg（クリーム塗り）を上下反転→クリームが上・ピーチが下 */
}
.p-notoPage__wave--top img {
  transform: scaleY(-1);
}
.p-notoPage {
  /* ============================================================
     §2 リード（クリーム・中央960）
     header下端波（左流れ）で受けるため波を持たない
  ============================================================ */
}
.p-notoPage__introInner {
  position: relative;
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
  text-align: center;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .p-notoPage__introInner {
    padding: 64px 16px;
  }
}
.p-notoPage {
  /* 本文（960幅・中央・「。」直後で改行） */
}
.p-notoPage__introText {
  position: relative;
  z-index: 1;
  max-width: 960px;
  margin: clamp(20px, 2vw, 32px) auto 0;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
@media screen and (max-width: 767px) {
  .p-notoPage__introText {
    text-align: left;
  }
  .p-notoPage__introText br {
    display: none;
  }
}
.p-notoPage {
  /* ============================================================
     §3 スポットマップ（クリーム＝TOPと同じ地色・既存Leaflet再利用）
  ============================================================ */
}
.p-notoPage__mapInner {
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-notoPage__mapInner {
    padding: 64px 16px;
  }
}
.p-notoPage__mapLead {
  max-width: 960px;
  margin: clamp(14px, 1.4vw, 22px) auto 0;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-notoPage__mapLead {
    text-align: left;
  }
  .p-notoPage__mapLead br {
    display: none;
  }
}
.p-notoPage {
  /* マップ枠（.p-notoMap__stage は既存CSSが位置/高さ/角丸/詳細パネルを担当） */
}
.p-notoPage__mapStage {
  margin-top: clamp(28px, 2.8vw, 48px);
}
.p-notoPage {
  /* 距離凡例（WF 338:8・3項目横並び。ドットはブラウン系＝緑抑制） */
}
.p-notoPage__legend {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(16px, 2vw, 40px);
  margin-top: clamp(20px, 2vw, 32px);
}
.p-notoPage__legendItem {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
}
.p-notoPage__legendDot {
  align-self: center;
  flex: none;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: #8B6B4E;
}
.p-notoPage__legendTime {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(14px, 1vw, 18px);
  letter-spacing: 0.02em;
  color: #8B6B4E;
}
.p-notoPage__legendArea {
  font-size: clamp(12.5px, 0.9vw, 15px);
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-notoPage {
  /* ============================================================
     §4 1日のモデルコース（クリーム・タブ＋タイムライン）
  ============================================================ */
}
.p-notoPage__courseInner {
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-notoPage__courseInner {
    padding: 64px 16px;
  }
}
.p-notoPage__courseLead {
  max-width: 960px;
  margin: clamp(14px, 1.4vw, 22px) auto 0;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-notoPage__courseLead {
    text-align: left;
  }
  .p-notoPage__courseLead br {
    display: none;
  }
}
.p-notoPage {
  /* タブUI（アクティブ下線＝ブラウン・緑不可／罫線＝緑40%共通） */
}
.p-notoPage__tabs {
  display: flex;
  justify-content: center;
  gap: clamp(6px, 2vw, 28px);
  margin-top: clamp(28px, 2.8vw, 48px);
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
}
.p-notoPage__tab {
  position: relative;
  padding: 12px clamp(10px, 1.6vw, 22px);
  background: none;
  border: none;
  cursor: pointer;
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: clamp(15px, 1.15vw, 20px);
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.55);
  transition: color 0.25s ease;
  /* アクティブ下線＝ブラウン（ホバー/アクティブでスケールイン） */
}
.p-notoPage__tab::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 3px;
  background-color: #8B6B4E;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.3s ease;
}
.p-notoPage__tab:hover {
  color: #8B6B4E;
}
.p-notoPage__tab.is-active {
  color: #8B6B4E;
}
.p-notoPage__tab.is-active::after {
  transform: scaleX(1);
}
.p-notoPage__panels {
  margin-top: clamp(32px, 3.2vw, 52px);
}
.p-notoPage__panel {
  display: none;
}
.p-notoPage__panel.is-active {
  display: block;
}
.p-notoPage {
  /* 各タブのリード（タイムライン ol の直前・左揃え・本文色・影なし） */
}
.p-notoPage__panelLead {
  max-width: 900px;
  margin: 0 auto clamp(24px, 2.6vw, 40px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  text-align: left;
}
.p-notoPage {
  /* タイムライン（縦積み・左に縦ライン＋時刻ドット＝ブラウン系／緑抑制） */
}
.p-notoPage__timeline {
  position: relative;
  max-width: 900px;
  margin-inline: auto;
  padding-left: clamp(20px, 2vw, 32px);
  display: flex;
  flex-direction: column;
  gap: clamp(22px, 2.4vw, 36px);
  /* 縦ライン（ブラウンの薄い線） */
}
.p-notoPage__timeline::before {
  content: "";
  position: absolute;
  top: 10px;
  bottom: 10px;
  left: 5px;
  width: 2px;
  background-color: rgba(139, 107, 78, 0.22);
}
.p-notoPage {
  /* 横長カード外殻（li）＝出現アニメ(js-fadeInUp)＋時刻ドットのアンカーのみ。
     枠・背景・ホバーは内側 __stepIn に分離（cottages/pet と同方式）。
     ※出現アニメとホバーtransitionを同一要素に載せると、スタッガー遅延がホバーに
       波及してホバーが遅延し、opacity/transformのtransitionが衝突して出現がカクつく。
       スタッガーは各liが個別IOターゲット＝スクロールで自然に時間差表示されるため、
       人工的な transition-delay は撤去（2026-07-06 Sone「アニメが気持ち悪い」FB対応）。 */
}
.p-notoPage__step {
  position: relative;
  /* 時刻ドット（縦ライン上・ブラウン／緑抑制） */
}
.p-notoPage__step::before {
  content: "";
  position: absolute;
  left: calc(-1 * clamp(20px, 2vw, 32px) + 6px);
  top: 50%;
  transform: translate(-50%, -50%);
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background-color: #8B6B4E;
  box-shadow: 0 0 0 4px #F6F1E7;
  z-index: 1;
}
@media screen and (max-width: 767px) {
  .p-notoPage__step::before {
    top: 26px;
    transform: translate(-50%, 0);
  }
}
.p-notoPage {
  /* 内側＝枠・背景・ホバー（出現アニメとは別要素なので遅延・衝突が起きない） */
}
.p-notoPage__stepIn {
  display: grid;
  grid-template-columns: 320px 1fr;
  align-items: center;
  gap: clamp(18px, 2vw, 28px);
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 20px;
  overflow: hidden;
  /* リンクでない表示カードのためホバーの浮き/影は付けない（クリック誤認防止・2026-07-06 Sone FB） */
}
@media screen and (max-width: 767px) {
  .p-notoPage__stepIn {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
}
.p-notoPage__stepPhoto {
  position: relative; /* クレジット表示（__stepCredit）のアンカー */
  width: 320px;
  height: 200px;
  background-color: #D9D9D9;
  /* 実写真挿入（2026-07-13）。リセットの img{width:100%} だけでは高さが潰れるため cover を明示 */
}
.p-notoPage__stepPhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media screen and (max-width: 767px) {
  .p-notoPage__stepPhoto {
    width: 100%;
    height: 180px;
  }
}
.p-notoPage {
  /* 写真クレジット（石川県観光連盟提供画像・ライセンス遵守）＝写真右下に極小・影なし */
}
.p-notoPage__stepCredit {
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 2px 6px;
  background: rgba(0, 0, 0, 0.45);
  color: #fff;
  font-size: 10px;
  line-height: 1.4;
  letter-spacing: 0.02em;
}
.p-notoPage__stepBody {
  padding: clamp(16px, 1.6vw, 24px) clamp(20px, 2.2vw, 28px) clamp(16px, 1.6vw, 24px) 0;
}
@media screen and (max-width: 767px) {
  .p-notoPage__stepBody {
    padding: 16px 18px 20px;
  }
}
.p-notoPage {
  /* 時刻＝Poppins・ブラウン（緑不可） */
}
.p-notoPage__stepTime {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(22px, 2vw, 30px);
  line-height: 1.1;
  letter-spacing: 0.02em;
  color: #8B6B4E;
}
.p-notoPage__stepTitle {
  margin-top: 6px;
  font-weight: 700;
  font-size: clamp(17px, 1.25vw, 22px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-notoPage__stepText {
  margin-top: 8px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-notoPage {
  /* 愛犬タブ＝中立なプレースホルダ空状態（WF未定義・準備中） */
}
.p-notoPage__empty {
  display: grid;
  place-items: center;
  max-width: 720px;
  margin-inline: auto;
  padding: clamp(48px, 6vw, 88px) 24px;
  border: 1px dashed rgba(126, 155, 122, 0.4);
  border-radius: 20px;
  background-color: rgba(139, 107, 78, 0.03);
}
.p-notoPage__emptyText {
  font-size: clamp(15px, 1.1vw, 18px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.7);
}
.p-notoPage {
  /* ============================================================
     §5 ノトイエで食を楽しむ（ピーチ帯＋上下波・3カード）
  ============================================================ */
}
.p-notoPage__dining {
  position: relative;
  background-color: #F5E3CB;
}
.p-notoPage__diningInner {
  position: relative;
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding: clamp(48px, 4.5vw, 80px) 24px;
}
@media screen and (max-width: 767px) {
  .p-notoPage__diningInner {
    padding: 40px 16px;
  }
}
.p-notoPage__diningLead {
  max-width: 960px;
  margin: clamp(14px, 1.4vw, 22px) auto 0;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-notoPage__diningLead {
    text-align: left;
  }
  .p-notoPage__diningLead br {
    display: none;
  }
}
.p-notoPage__diningGrid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(24px, 2.5vw, 36px) clamp(20px, 1.7vw, 24px);
  margin-top: clamp(32px, 3vw, 48px);
}
.p-notoPage {
  /* 3カードのスタッガー出現 */
}
.p-notoPage__diningGrid li:nth-child(1) {
  transition-delay: 0s;
}
.p-notoPage__diningGrid li:nth-child(2) {
  transition-delay: 0.08s;
}
.p-notoPage__diningGrid li:nth-child(3) {
  transition-delay: 0.16s;
}
.p-notoPage__diningCard {
  width: clamp(300px, 30vw, 400px);
}
@media screen and (max-width: 767px) {
  .p-notoPage__diningCard {
    width: min(100%, 400px);
  }
}
.p-notoPage {
  /* 外殻＝出現アニメ＋レイアウト。リンクでない表示カードのためホバーの浮き/影は付けない（2026-07-06 Sone FB） */
}
.p-notoPage__diningCardIn {
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 20px;
  overflow: hidden;
}
.p-notoPage__diningPhoto {
  width: 100%;
  height: 220px;
  background-color: #D9D9D9;
  /* 実写真挿入（2026-07-13）。リセットの img{width:100%} だけでは高さが潰れるため cover を明示 */
}
.p-notoPage__diningPhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media screen and (max-width: 767px) {
  .p-notoPage__diningPhoto {
    height: 200px;
  }
}
.p-notoPage__diningBody {
  flex: 1;
  padding: clamp(18px, 1.8vw, 24px) clamp(20px, 2.2vw, 28px) clamp(20px, 2vw, 26px);
}
.p-notoPage__diningTitle {
  font-weight: 700;
  font-size: clamp(18px, 1.35vw, 24px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-notoPage__diningText {
  margin-top: 10px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}

/******************************************************************************
*
* 下層：コンシェルジュ（p-conciergePage）page-concierge.php
* Figma WF 357:2 確定版を notoie のデザイン言語で実装（カンプ無し・WFが構成/コピーの正本）：
* - 帯リズム（波は1ページ3本まで＝Sone確定ルール）：
*   header(ピーチ・下端波1)→§2 リード(クリーム)
*   →§3 サービス一覧(ピーチ帯・上端波2/下端波3・横長カード縦積み)
*   →§4 利用シーン(クリーム・アイコンカード横並び)→§5 ご利用方法(クリーム・連絡先＋注意事項)
*   →§6 予約CTA(クリーム地＋角丸ピーチパネル・波なし)→フッター(クリーム)
* - ★ホバーは押せる要素だけ（AI_CONTEXT §4.5・2026-07-06 Sone FB）：
*   サービスカード/利用シーンカードはリンクでない＝浮き/影/ズームのホバーを付けない。
*   出現アニメ(js-fadeInUp)は外殻__*Card／見た目は内側__*CardIn に分離。
*   ホバー可は c-button・電話tel:リンクのみ。
* - ★緑抑制ルール（HANDOFF §4）：ソリッド緑（見出し/価格/アイコン/小ラベル）→ブラウン（$color-main-dark）／
*   淡い緑面 → 淡いブラウン rgba($color-main-dark,0.08〜0.10)／緑は罫線 rgba($color-main,0.4) のみ。
* - ★装飾イラスト（足あと・点描の山等）は入れない（2026-07-06 Sone直近方針）。
* - トークン厳守：罫線 rgba($color-main,0.4)／本文 $fs-body／余白 $section-pad-y／角丸は既存値(16/20)。
*
******************************************************************************/
.p-conciergePage {
  background-color: #F6F1E7;
  /* ---------- 共通：波形境界（ピーチ帯の出入り・noto/pet-pageと同方式） ---------- */
}
.p-conciergePage__wave {
  line-height: 0;
  overflow: hidden;
}
.p-conciergePage__wave img {
  display: block;
  width: 100%;
  height: clamp(40px, 5.2vw, 100px);
}
@media screen and (max-width: 767px) {
  .p-conciergePage__wave img {
    height: 30px;
  }
}
.p-conciergePage {
  /* 上端：wave-bg.svg（クリーム塗り）を上下反転→クリームが上・ピーチが下 */
}
.p-conciergePage__wave--top img {
  transform: scaleY(-1);
}
.p-conciergePage {
  /* ============================================================
     §3 サービス一覧（クリーム・横長カード縦積み・§2リード撤去でヘッダー直下に）
     header下端波（クリーム）で受けるため波を持たない。
     左画像320×200＋右テキスト。★リンクでない＝ホバーの浮き/影は付けない。
  ============================================================ */
}
.p-conciergePage__services {
  position: relative;
  overflow: hidden;
}
.p-conciergePage__servicesInner {
  max-width: calc(960px + 120px);
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-conciergePage__servicesInner {
    padding: 64px 16px;
  }
}
.p-conciergePage__serviceList {
  display: flex;
  flex-direction: column;
  gap: clamp(20px, 2vw, 32px);
  margin-top: clamp(32px, 3vw, 52px);
}
.p-conciergePage {
  /* 各カード＝装飾イラストの基準（liはoverflow:hiddenでないのでカード外にはみ出せる） */
}
.p-conciergePage__serviceCard {
  position: relative;
}
.p-conciergePage {
  /* 手描きイラスト＝装飾（ランダムに散らす）。2026-07-14
     配置は「文字の無いゾーン」だけを使う＝(1)写真側 (2)本文右下の余白。
     レイアウトが幅で変わる（SP:写真上／md〜:写真左）ので3段階で置き分ける。
     slot a/b/c で左右・上下・角度を変えて散らす。 */
}
.p-conciergePage__cardDeco {
  position: absolute;
  width: auto;
  height: clamp(74px, 8.5vw, 116px);
  pointer-events: none;
  z-index: 2;
  /* ── base = SP(〜767px)：写真は上。写真の上に角違いで散らす（本文に被らない・端に寄らない） ── */
}
.p-conciergePage__cardDeco--a {
  top: 10px;
  right: 12px;
  transform: rotate(-6deg);
}
.p-conciergePage__cardDeco--b {
  top: 10px;
  left: 12px;
  transform: rotate(7deg);
}
.p-conciergePage__cardDeco--c {
  top: 10px;
  right: 14px;
  transform: rotate(-4deg);
}
.p-conciergePage__cardDeco {
  /* ── md(768〜1199px)：写真は左カラム。写真の上で縦位置を散らす（本文=右には出さない＝狭幅の折返しに被らせない） ── */
}
@media screen and (min-width: 768px) {
  .p-conciergePage__cardDeco--a {
    top: 16px;
    left: 14px;
    right: auto;
    transform: rotate(-6deg);
  }
  .p-conciergePage__cardDeco--b {
    top: auto;
    bottom: 16px;
    left: 14px;
    right: auto;
    transform: rotate(7deg);
  }
  .p-conciergePage__cardDeco--c {
    top: 50%;
    left: 14px;
    right: auto;
    transform: translateY(-50%) rotate(-4deg);
  }
}
.p-conciergePage__cardDeco {
  /* ── pc(1200px〜)：左右にガターがあるのでカードの外へ寄り添わせて散らす（端には寄せない） ── */
}
@media screen and (min-width: 1200px) {
  .p-conciergePage__cardDeco--a {
    top: auto;
    bottom: 18px;
    left: auto;
    right: -70px;
    transform: rotate(-6deg);
  }
  .p-conciergePage__cardDeco--b {
    top: 50%;
    bottom: auto;
    left: -54px;
    right: auto;
    transform: translateY(-50%) rotate(7deg);
  }
  .p-conciergePage__cardDeco--c {
    top: auto;
    bottom: 22px;
    left: -54px;
    right: auto;
    transform: rotate(-5deg);
  }
}
.p-conciergePage {
  /* 外殻＝出現アニメ(js-fadeInUp)のみ。各liが個別IOターゲット＝スクロールで自然に時間差表示。
     枠・背景・レイアウトは内側 __serviceCardIn に分離（ホバーtransitionと出現の衝突回避）。 */
}
.p-conciergePage__serviceCardIn {
  display: grid;
  grid-template-columns: 320px 1fr;
  align-items: center;
  gap: clamp(18px, 2vw, 32px);
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 20px;
  overflow: hidden;
  /* リンクでない表示カードのためホバーの浮き/影は付けない（クリック誤認防止・2026-07-06 Sone FB） */
}
@media screen and (max-width: 767px) {
  .p-conciergePage__serviceCardIn {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
}
.p-conciergePage__servicePhoto {
  width: 320px;
  height: 200px;
  background-color: #D9D9D9;
  /* 実写真挿入（2026-07-13）。リセットの img{width:100%} だけでは高さが潰れるため cover を明示 */
}
.p-conciergePage__servicePhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media screen and (max-width: 767px) {
  .p-conciergePage__servicePhoto {
    width: 100%;
    height: 190px;
  }
}
.p-conciergePage__serviceBody {
  padding: clamp(18px, 1.8vw, 26px) clamp(22px, 2.4vw, 32px) clamp(18px, 1.8vw, 26px) 0;
}
@media screen and (max-width: 767px) {
  .p-conciergePage__serviceBody {
    padding: 4px 18px 20px;
  }
}
.p-conciergePage {
  /* タイトル＋価格ラベル（横並び・折返し可） */
}
.p-conciergePage__serviceHead {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px clamp(12px, 1.4vw, 20px);
}
.p-conciergePage__serviceTitle {
  font-weight: 700;
  font-size: clamp(18px, 1.4vw, 24px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-conciergePage {
  /* 価格ラベル＝ブラウンで目立たせる（緑抑制・淡いブラウン面のチップ）。
     金額は混在文字列（円/追加樽/号）のため本文フォントのまま＝指示§2で許容。 */
}
.p-conciergePage__servicePrice {
  display: inline-block;
  padding: 4px 12px;
  background-color: rgba(139, 107, 78, 0.1);
  border-radius: 999px;
  font-weight: 700;
  font-size: clamp(13px, 1vw, 15.5px);
  letter-spacing: 0.02em;
  color: #8B6B4E;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  .p-conciergePage__servicePrice {
    white-space: normal;
  }
}
.p-conciergePage__serviceText {
  margin-top: clamp(10px, 1.2vw, 16px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-conciergePage {
  /* 注記（※〜）＝小さめ・薄いテキスト（罫線色ではなく文字トーンで従属を表現） */
}
.p-conciergePage__serviceNote {
  margin-top: 8px;
  font-size: clamp(12px, 0.85vw, 13.5px);
  line-height: 1.7;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.66);
}
.p-conciergePage {
  /* ============================================================
     §4 利用シーン（ピーチ帯＋上下波・アイコンカード4枚横並び）
     §2撤去に伴いピーチ帯を§3から§4へ移動（ヘッダー直下はクリームで受ける）。
     ★リンクでない＝ホバーの浮き/影は付けない。
  ============================================================ */
}
.p-conciergePage__scenes {
  position: relative;
  background-color: #F5E3CB;
}
.p-conciergePage__scenesInner {
  max-width: calc(1440px + 48px);
  margin-inline: auto;
  padding: clamp(48px, 4.5vw, 80px) 24px;
}
@media screen and (max-width: 767px) {
  .p-conciergePage__scenesInner {
    padding: 40px 16px;
  }
}
.p-conciergePage__sceneList {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(18px, 1.8vw, 28px);
  margin-top: clamp(32px, 3vw, 52px);
}
@media screen and (max-width: 991px) {
  .p-conciergePage__sceneList {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 575px) {
  .p-conciergePage__sceneList {
    grid-template-columns: 1fr;
  }
}
.p-conciergePage {
  /* 外殻＝出現アニメのみ。枠・背景は内側 __sceneCardIn に分離。ホバーは付けない。 */
}
.p-conciergePage__sceneCardIn {
  height: 100%;
  padding: clamp(24px, 2.4vw, 34px) clamp(18px, 1.8vw, 26px) clamp(26px, 2.6vw, 34px);
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 20px;
  text-align: center;
}
.p-conciergePage {
  /* アイコン円＝淡いブラウン面（緑抑制。旧ルールの淡い緑円→ブラウンへ） */
}
.p-conciergePage__sceneIcon {
  display: inline-grid;
  place-items: center;
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background-color: rgba(139, 107, 78, 0.09);
}
.p-conciergePage__sceneIcon img {
  display: block;
  width: 40px;
  height: 40px;
}
.p-conciergePage__sceneTitle {
  margin-top: clamp(14px, 1.4vw, 20px);
  font-weight: 700;
  font-size: clamp(16px, 1.2vw, 20px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-conciergePage__sceneText {
  margin-top: 10px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  text-align: left;
}
@media screen and (max-width: 575px) {
  .p-conciergePage__sceneText {
    text-align: center;
  }
}
.p-conciergePage {
  /* ============================================================
     §5 ご利用方法（クリーム・連絡先＋注意事項）
     連絡ボタン/電話リンクは押せる要素＝ホバー可。罫線＝緑40%。
  ============================================================ */
}
.p-conciergePage__howtoInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-conciergePage__howtoInner {
    padding: 64px 16px;
  }
}
.p-conciergePage__howtoLead {
  max-width: 960px;
  margin: clamp(14px, 1.4vw, 22px) auto 0;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
@media screen and (max-width: 767px) {
  .p-conciergePage__howtoLead {
    text-align: left;
  }
  .p-conciergePage__howtoLead br {
    display: none;
  }
}
.p-conciergePage {
  /* 連絡手段（LINEボタン＋電話リンクを横並び・中央） */
}
.p-conciergePage__contact {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(20px, 2.4vw, 40px);
  margin-top: clamp(28px, 2.8vw, 44px);
}
@media screen and (max-width: 767px) {
  .p-conciergePage__contact {
    flex-direction: column;
    gap: 20px;
  }
}
.p-conciergePage {
  /* 電話＝押せる要素（tel:リンク）なのでホバー可。番号は Barlow（純ラテンで正しく描画）・ブラウン。 */
}
.p-conciergePage__tel {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 10px 24px;
  border-radius: 16px;
  text-decoration: none;
  transition: background-color 0.25s ease;
}
.p-conciergePage__tel:hover {
  background-color: rgba(139, 107, 78, 0.07);
}
.p-conciergePage__telCaption {
  font-size: clamp(12px, 0.85vw, 13.5px);
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.66);
}
.p-conciergePage__telNum {
  font-family: "Barlow Semi Condensed", "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(26px, 2.6vw, 38px);
  line-height: 1.1;
  letter-spacing: 0.02em;
  color: #8B6B4E;
}
.p-conciergePage__telHours {
  font-size: clamp(12px, 0.9vw, 14px);
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.66);
}
.p-conciergePage {
  /* 注意事項ボックス（罫線＝緑40%・淡いブラウン地） */
}
.p-conciergePage__notice {
  margin-top: clamp(36px, 3.6vw, 56px);
  padding: clamp(24px, 2.6vw, 36px) clamp(22px, 2.6vw, 40px);
  background-color: rgba(139, 107, 78, 0.05);
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 20px;
  text-align: left;
}
.p-conciergePage__noticeTitle {
  font-weight: 700;
  font-size: clamp(16px, 1.2vw, 20px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-conciergePage__noticeList {
  margin-top: clamp(12px, 1.4vw, 18px);
  display: flex;
  flex-direction: column;
}
.p-conciergePage__noticeItem {
  position: relative;
  padding: 12px 0 12px 20px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  border-top: 1px solid rgba(126, 155, 122, 0.4);
}
.p-conciergePage__noticeItem:first-child {
  border-top: none;
}
.p-conciergePage__noticeItem {
  /* 行頭ドット＝ブラウン（緑抑制） */
}
.p-conciergePage__noticeItem::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 21px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: #8B6B4E;
}

/******************************************************************************
*
* 下層：よくあるご質問（p-faqPage）page-faq.php
* Figma WF 456:2 を notoie のデザイン言語で実装（カンプ無し・WFが構成の正本）：
* - 帯リズム（縦長リストのため波は増やさない＝ヘッダー波1本＋本文クリームで通す・最大3本厳守）：
*   header(ピーチ・下端波1)→§2 カテゴリ目次(クリーム・チップ列)
*   →§3〜§8 カテゴリ別Q&A(クリーム・EN小ラベル＋JP見出し＋Q&Aリスト)
*   →§9 予約CTA(クリーム地＋角丸ピーチパネル・波なし)→フッター(クリーム)
* - ★ホバーは押せる要素だけ（AI_CONTEXT §4.5・2026-07-06 Sone FB）：
*   カテゴリチップ（アンカー<a>）・CTA/LINEボタンのみホバー可。
*   Q&Aカードはリンクでない＝浮き/影/色反転のホバーを付けない。
*   出現アニメ(js-fadeInUp)とホバーは別要素（チップは <li>=js-fadeInUp／<a>=hover）。
* - ★緑抑制ルール（HANDOFF §4）：見出し/EN小ラベル/Q・Aバッジ/チップ → ブラウン（$color-main-dark）／
*   淡い面 → 淡いブラウン rgba($color-main-dark,0.08〜0.10)／緑は罫線 rgba($color-main,0.4) のみ。
* - ★装飾イラストは入れない（2026-07-06 Sone直近方針）。
* - トークン厳守：罫線 rgba($color-main,0.4)／本文 $fs-body／余白 $section-pad-y／角丸は既存値(20)。
* - Q&Aリストの言語は pet §8（p-petPage__faq*）を踏襲＝Q太字＋A本文・Q/A丸バッジ・罫線緑40%。
*
******************************************************************************/
.p-faqPage {
  background-color: #F6F1E7;
  /* アンカースクロールを滑らかに（このページ内リンク限定＝:has で faq のみに適用・全体への副作用回避）。
     スクロールコンテナは html なので html 側で宣言する。 */
  /* ↑実際の宣言はファイル末尾（.p-faqPage の外）に置く（:has の対象が html のため）。 */
  /* ============================================================
     §2 カテゴリ目次（クリーム・「カテゴリから探す」＋6チップ）
     header下端波（クリーム）で受けるため波を持たない。
  ============================================================ */
}
.p-faqPage__indexInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px clamp(40px, 4vw, 64px);
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-faqPage__indexInner {
    padding: 64px 16px 40px;
  }
}
.p-faqPage {
  /* チップ列（横並び・中央・折返し）。各チップ＝アンカーリンク＝押せる要素。 */
}
.p-faqPage__chipList {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(12px, 1.2vw, 18px);
  margin-top: clamp(28px, 2.8vw, 44px);
}
.p-faqPage {
  /* 出現アニメの外殻（js-fadeInUp は display:block／inline-flexで横並びに戻す） */
}
.p-faqPage__chipItem {
  display: inline-flex;
}
.p-faqPage {
  /* チップ本体＝押せる要素（<a>）なのでホバー可（浮き＋淡いブラウン面＋影＝クリックの合図）。
     出現アニメは親 __chipItem が持つ＝js-fadeInUp と hover transition を別要素に分離。 */
}
.p-faqPage__chip {
  display: inline-flex;
  align-items: center;
  padding: 10px clamp(18px, 1.8vw, 26px);
  background-color: rgba(139, 107, 78, 0.08);
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 999px;
  font-weight: 700;
  font-size: clamp(13px, 1vw, 15.5px);
  line-height: 1.5;
  letter-spacing: 0.05em;
  color: #8B6B4E;
  text-decoration: none;
  transition: transform 0.25s ease, background-color 0.25s ease;
}
.p-faqPage__chip:hover {
  transform: translateY(-2px);
  background-color: rgba(139, 107, 78, 0.14);
}
.p-faqPage {
  /* ============================================================
     §3〜§8 カテゴリ別Q&A（クリーム・EN小ラベル＋JP見出し＋Q&Aリスト）
     各セクションが id を持つ＝アンカーの着地点。追従ヘッダー(76px/SP60px)分を
     scroll-margin-top で確保し、EN小ラベルが隠れないようにする。
     ★Q&Aカードはリンクでない＝ホバー無し。
  ============================================================ */
}
.p-faqPage__cat {
  scroll-margin-top: clamp(84px, 8vw, 108px);
}
.p-faqPage__cat + .p-faqPage__cat .p-faqPage__catInner {
  padding-top: 0;
}
.p-faqPage__catInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(40px, 4vw, 64px) 24px;
}
@media screen and (max-width: 767px) {
  .p-faqPage__catInner {
    padding: 40px 16px;
  }
}
.p-faqPage {
  /* カテゴリ見出し＝EN小ラベル（Poppins・ブラウン）＋日本語見出し（pet findHead と同トーン） */
}
.p-faqPage__catHead {
  padding-bottom: clamp(12px, 1.4vw, 20px);
}
.p-faqPage__catEn {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(13px, 0.95vw, 16px);
  letter-spacing: 0.12em;
  color: #8B6B4E;
}
.p-faqPage__catJp {
  margin-top: 6px;
  font-weight: 700;
  font-size: clamp(22px, 2vw, 32px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-faqPage {
  /* Q&Aリスト（pet §8 と同言語＝罫線緑40%区切り。カード自体はリンクでないのでホバー無し） */
}
.p-faqPage__qaList {
  border-top: 1px solid rgba(126, 155, 122, 0.4);
}
.p-faqPage__qaItem {
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
}
.p-faqPage {
  /* 質問＝アコーディオンのトグルボタン（押せる要素＝ホバー可） */
}
.p-faqPage__q {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  padding: clamp(20px, 2vw, 28px) 4px;
  background: none;
  border: none;
  text-align: left;
  cursor: pointer;
  font-weight: 700;
  font-size: clamp(15px, 1vw, 18px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-faqPage__qText {
  flex: 1;
}
.p-faqPage {
  /* ＋／−トグル（閉=＋・開=−。ブラウン＝緑抑制。縦棒を回転させて滑らかに切替） */
}
.p-faqPage__toggle {
  flex: none;
  position: relative;
  width: 20px;
  height: 20px;
  margin-top: 2px;
}
.p-faqPage__toggle::before, .p-faqPage__toggle::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 14px;
  height: 2px;
  border-radius: 2px;
  background-color: #8B6B4E;
  transform: translate(-50%, -50%);
  transition: transform 0.35s cubic-bezier(0.23, 1, 0.32, 1);
}
.p-faqPage__toggle::after {
  transform: translate(-50%, -50%) rotate(90deg);
}
.p-faqPage {
  /* 回答＝高さアニメ（grid-template-rows 0fr→1fr でスムーズ開閉・JSの is-open で切替） */
}
.p-faqPage__aWrap {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}
.p-faqPage__aInner {
  overflow: hidden;
  min-height: 0;
}
.p-faqPage__a {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 0 4px clamp(20px, 2vw, 28px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 0.3s ease 0.08s, transform 0.35s cubic-bezier(0.23, 1, 0.32, 1) 0.08s;
}
.p-faqPage {
  /* 開いた状態＝高さ1fr／回答フェードイン／トグル＋→−（縦棒を横棒に重ねる） */
}
.p-faqPage__qaItem.is-open .p-faqPage__aWrap {
  grid-template-rows: 1fr;
}
.p-faqPage__qaItem.is-open .p-faqPage__a {
  opacity: 1;
  transform: none;
}
.p-faqPage__qaItem.is-open .p-faqPage__toggle::after {
  transform: translate(-50%, -50%) rotate(0deg);
}
@media (prefers-reduced-motion: reduce) {
  .p-faqPage__aWrap, .p-faqPage__a, .p-faqPage__toggle::before, .p-faqPage__toggle::after {
    transition: none;
  }
}
.p-faqPage {
  /* Q / A の丸バッジ（英字Poppins・ブラウン系＝緑抑制） */
}
.p-faqPage__mark {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
}
.p-faqPage__mark--q {
  background-color: #8B6B4E;
  color: #FFFFFF;
}
.p-faqPage__mark--a {
  background-color: rgba(139, 107, 78, 0.1);
  color: #8B6B4E;
}
.p-faqPage__qText {
  padding-top: 3px;
}
.p-faqPage__aText {
  padding-top: 3px;
}
.p-faqPage {
  /* 未確定回答の可視プレースホルダー＝薄いトーン（UI文言・マーケコピーではない）。
     yohei/コピー確定待ちであることが見た目で分かるように、本文より明確に薄くする。 */
}
.p-faqPage__aText--pending {
  color: rgba(43, 43, 43, 0.42);
}

/* アンカースクロールの平滑化＝faq ページ（.p-faqPage を含む文書）に限定。
   スクロールコンテナは html なので html 側で宣言し、:has で他ページへの副作用を避ける。 */
html:has(.p-faqPage) {
  scroll-behavior: smooth;
}

/******************************************************************************
*
* 下層：ノトイエについて（p-aboutPage）page-about.php
* Figma WF 383:2 を notoie のデザイン言語で実装（カンプ無し・WFが構成の正本）：
* - 帯リズム（波は1ページ3本まで＝Sone確定ルール／ピーチ帯は1セクションだけ＝§3オーナー）：
*   header(ピーチ・下端波1)→§2 コンセプト(クリーム・画像＋文・中央960)
*   →§3 オーナー挨拶(ピーチ帯・上端波2/下端波3・左写真＋右本文)
*   →§4 沿革(クリーム・タイムライン)→§5 施設情報(クリーム・定義テーブル)
*   →§6 予約CTA(クリーム地＋角丸ピーチパネル・波なし)→フッター(クリーム)
* - ★ホバーは押せる要素だけ（AI_CONTEXT §4.5・2026-07-07 Sone FB）：
*   アクセス詳細リンク(c-arrowLink)・CTA/LINEボタンのみ。写真/テーブル/沿革行はホバー無し。
*   ★opacityを下げる減光ホバーは一切書かない（全廃）。
* - ★緑抑制ルール（HANDOFF §4）：見出し/EN小ラベル/項目名/沿革の年・ドット → ブラウン（$color-main-dark）／
*   淡い面 → 淡いブラウン rgba($color-main-dark,0.08〜0.10)／固有名詞・本文 → 黒／緑は罫線 rgba($color-main,0.4) のみ。
* - ★装飾イラストは入れない（Sone直近方針）。
* - トークン厳守：罫線 rgba($color-main,0.4)／本文 $fs-body／余白 $section-pad-y／波高 $wave-h／角丸は既存値(20)。
*
******************************************************************************/
.p-aboutPage {
  background-color: #F6F1E7;
  /* ---------- 共通：波形境界（ピーチ帯の出入り・concierge/noto と同方式） ---------- */
}
.p-aboutPage__wave {
  line-height: 0;
  overflow: hidden;
}
.p-aboutPage__wave img {
  display: block;
  width: 100%;
  height: clamp(40px, 5.2vw, 100px);
}
@media screen and (max-width: 767px) {
  .p-aboutPage__wave img {
    height: 30px;
  }
}
.p-aboutPage {
  /* 上端：wave-bg.svg（クリーム塗り）を上下反転→クリームが上・ピーチが下 */
}
.p-aboutPage__wave--top img {
  transform: scaleY(-1);
}
.p-aboutPage {
  /* ============================================================
     §2 コンセプト（クリーム・中央960・画像＋本文）
     header下端波（クリーム）で受けるため波を持たない。写真はリンクでない＝ホバー無し。
  ============================================================ */
}
.p-aboutPage__conceptInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-aboutPage__conceptInner {
    padding: 64px 16px;
  }
}
.p-aboutPage {
  /* コンセプト画像（960×400・Sone選定待ちのプレースホルダー面）。ホバー無し。
     見出し撤去でセクション先頭要素になったため margin-top なし（上余白はセクションpaddingのみ・二重余白解消 2026-07-07 Sone FB） */
}
.p-aboutPage__conceptPhoto {
  aspect-ratio: 960/400;
  border-radius: 20px;
  background-color: #D9D9D9;
  overflow: hidden;
}
.p-aboutPage__conceptPhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .p-aboutPage__conceptPhoto {
    aspect-ratio: 16/10;
    border-radius: 16px;
  }
}
.p-aboutPage__conceptText {
  margin-top: clamp(24px, 2.6vw, 40px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
@media screen and (max-width: 767px) {
  .p-aboutPage__conceptText {
    text-align: left;
  }
  .p-aboutPage__conceptText br {
    display: none;
  }
}
.p-aboutPage {
  /* ============================================================
     §3 オーナーからのご挨拶（ピーチ帯・上下波・左写真＋右本文）
     ★本文・氏名は未確定＝薄色プレースホルダー。写真はリンクでない＝ホバー無し。
  ============================================================ */
}
.p-aboutPage__message {
  position: relative;
  background-color: #F5E3CB;
}
.p-aboutPage__messageInner {
  max-width: calc(960px + 200px);
  margin-inline: auto;
  padding: clamp(48px, 4.5vw, 80px) 24px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-aboutPage__messageInner {
    padding: 40px 16px;
  }
}
.p-aboutPage {
  /* 左写真320×400＋右本文（PC＝2カラム／SP＝縦積み） */
}
.p-aboutPage__messageBody {
  display: grid;
  grid-template-columns: 320px 1fr;
  align-items: center;
  gap: clamp(28px, 3vw, 56px);
  margin-top: clamp(32px, 3vw, 52px);
  text-align: left;
}
@media screen and (max-width: 767px) {
  .p-aboutPage__messageBody {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}
.p-aboutPage {
  /* オーナー写真（320×400・プレースホルダー面）。ホバー無し。 */
}
.p-aboutPage__messagePhoto {
  width: 320px;
  aspect-ratio: 320/400;
  border-radius: 20px;
  background-color: #D9D9D9;
  overflow: hidden;
}
.p-aboutPage__messagePhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .p-aboutPage__messagePhoto {
    width: 100%;
    max-width: 320px;
    margin-inline: auto;
    aspect-ratio: 4/5;
    border-radius: 16px;
  }
}
.p-aboutPage {
  /* 未確定の本文＝薄色の可視プレースホルダー（UI文言・マーケコピーではない）。
     yohei/コピー確定待ちが見た目で分かるよう本文より明確に薄く。 */
}
.p-aboutPage__messagePending {
  font-size: clamp(16px, 1.2vw, 20px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.42);
}
.p-aboutPage {
  /* 署名＝役職（確定・黒）＋氏名（未確定・薄色） */
}
.p-aboutPage__messageSign {
  margin-top: clamp(24px, 2.4vw, 36px);
  padding-top: clamp(16px, 1.6vw, 24px);
  border-top: 1px solid rgba(126, 155, 122, 0.4);
  line-height: 1.55;
}
.p-aboutPage__messageRole {
  display: block;
  font-size: clamp(13px, 0.95vw, 15px);
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.7);
}
.p-aboutPage__messageName {
  display: block;
  margin-top: 4px;
  font-weight: 700;
  font-size: clamp(18px, 1.4vw, 24px);
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-aboutPage__messageName--pending {
  font-weight: 400;
  color: rgba(43, 43, 43, 0.42);
}
.p-aboutPage {
  /* ============================================================
     §3.5 オーナー一家 プロフィール（クリーム・A-1）
     カードはリンクでない＝ホバー無し。緑抑制（役職/名/罫線ブラウン）。
  ============================================================ */
}
.p-aboutPage__familyInner {
  max-width: calc(960px + 120px);
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-aboutPage__familyInner {
    padding: 56px 16px;
  }
}
.p-aboutPage__parents {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(20px, 2.4vw, 36px);
  margin-top: clamp(28px, 2.8vw, 44px);
}
@media screen and (max-width: 767px) {
  .p-aboutPage__parents {
    grid-template-columns: 1fr;
  }
}
.p-aboutPage__parentCard {
  padding: clamp(20px, 2vw, 28px);
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 16px;
}
.p-aboutPage__parentPhoto {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background-color: #D9D9D9;
}
.p-aboutPage__parentRole {
  font-size: clamp(11px, 0.8vw, 12px);
  font-weight: 700;
  letter-spacing: 0.08em;
  color: #8B6B4E;
}
.p-aboutPage__parentName {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 4px 10px;
  margin-top: 2px;
  font-weight: 700;
  font-size: clamp(17px, 1.4vw, 20px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-aboutPage__parentEn {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(11px, 0.85vw, 12px);
  letter-spacing: 0.06em;
  color: rgba(43, 43, 43, 0.55);
}
.p-aboutPage__parentList {
  margin: clamp(12px, 1.2vw, 16px) 0 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.p-aboutPage__parentRow {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 10px;
}
.p-aboutPage__parentRow dt {
  font-size: clamp(11px, 0.8vw, 12px);
  font-weight: 700;
  color: #8B6B4E;
  padding-top: 2px;
}
.p-aboutPage__parentRow dd {
  margin: 0;
  font-size: clamp(12px, 0.85vw, 13.5px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-aboutPage__children {
  list-style: none;
  margin: clamp(20px, 2vw, 28px) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(12px, 1.4vw, 20px);
}
@media screen and (max-width: 767px) {
  .p-aboutPage__children {
    grid-template-columns: 1fr;
  }
}
.p-aboutPage__childCard {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: clamp(14px, 1.6vw, 20px);
  background-color: rgba(139, 107, 78, 0.05);
  border-radius: 12px;
}
.p-aboutPage__childName {
  font-weight: 700;
  font-size: clamp(14px, 1vw, 16px);
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-aboutPage__childNote {
  font-size: clamp(12px, 0.85vw, 13px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.8);
}
.p-aboutPage {
  /* ============================================================
     §4 沿革（クリーム・タイムライン・年＋出来事）
     縦線・ドット＝ブラウン（緑抑制）。行はリンクでない＝ホバー無し。
  ============================================================ */
}
.p-aboutPage__historyInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-aboutPage__historyInner {
    padding: 64px 16px;
  }
}
.p-aboutPage__timeline {
  position: relative;
  max-width: 720px;
  margin: clamp(36px, 3.6vw, 60px) auto 0;
  padding-left: clamp(20px, 2vw, 28px);
  text-align: left;
  /* タイムラインの縦線＝ブラウン（緑抑制）。ドット中心を通す */
}
.p-aboutPage__timeline::before {
  content: "";
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: 4px;
  width: 2px;
  background-color: rgba(139, 107, 78, 0.35);
}
.p-aboutPage__historyItem {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px clamp(16px, 1.8vw, 28px);
  padding: clamp(16px, 1.8vw, 24px) 0;
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
}
.p-aboutPage__historyItem:last-child {
  border-bottom: none;
}
.p-aboutPage {
  /* 行頭ドット＝ブラウン（縦線の上に載せる） */
}
.p-aboutPage__historyDot {
  position: absolute;
  left: calc(-1 * clamp(20px, 2vw, 28px) + 5px - 4px);
  top: clamp(22px, 2.3vw, 30px);
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #8B6B4E;
  box-shadow: 0 0 0 4px #F6F1E7;
}
.p-aboutPage {
  /* 年＝ブラウン太字（緑抑制。混在文字列「2023年」のため本文フォント） */
}
.p-aboutPage__historyYear {
  flex: none;
  min-width: 92px;
  font-weight: 700;
  font-size: clamp(15px, 1.2vw, 19px);
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
@media screen and (max-width: 767px) {
  .p-aboutPage__historyYear {
    min-width: 0;
  }
}
.p-aboutPage__historyYear {
  /* 未確定の年＝薄色プレースホルダー（捏造しない合図） */
}
.p-aboutPage__historyYear--pending {
  font-weight: 400;
  color: rgba(43, 43, 43, 0.42);
}
.p-aboutPage {
  /* 出来事＝黒本文 */
}
.p-aboutPage__historyEvent {
  flex: 1;
  min-width: 200px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
@media screen and (max-width: 575px) {
  .p-aboutPage__historyEvent {
    min-width: 100%;
  }
}
.p-aboutPage {
  /* ============================================================
     §5 施設情報（クリーム・定義テーブル・項目=ブラウン太字／値=黒／罫線=緑40%）
     テーブルはリンクでない＝ホバー無し。アクセス詳細リンクのみ押せる要素（c-arrowLink）。
  ============================================================ */
}
.p-aboutPage__facilityInner {
  max-width: 960px;
  margin-inline: auto;
  padding: 0 24px clamp(64px, 6vw, 116px);
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-aboutPage__facilityInner {
    padding: 0 16px 64px;
  }
}
.p-aboutPage {
  /* 定義テーブル（白地＋緑40%罫線で行区切り＝形の差でリズムを作る） */
}
.p-aboutPage__table {
  max-width: 760px;
  margin: clamp(32px, 3.2vw, 52px) auto 0;
  text-align: left;
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 20px;
  overflow: hidden;
}
.p-aboutPage__row {
  display: grid;
  grid-template-columns: 200px 1fr;
  border-top: 1px solid rgba(126, 155, 122, 0.4);
}
.p-aboutPage__row:first-child {
  border-top: none;
}
@media screen and (max-width: 767px) {
  .p-aboutPage__row {
    grid-template-columns: 1fr;
  }
}
.p-aboutPage {
  /* 項目名＝ブラウン太字（緑抑制）・淡いブラウン面で列を分ける */
}
.p-aboutPage__rowLabel {
  padding: clamp(16px, 1.6vw, 22px) clamp(18px, 1.8vw, 26px);
  background-color: rgba(139, 107, 78, 0.06);
  font-weight: 700;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
@media screen and (max-width: 767px) {
  .p-aboutPage__rowLabel {
    padding: 14px 16px 6px;
    background-color: transparent;
  }
}
.p-aboutPage {
  /* 値＝黒本文 */
}
.p-aboutPage__rowValue {
  padding: clamp(16px, 1.6vw, 22px) clamp(18px, 1.8vw, 26px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
@media screen and (max-width: 767px) {
  .p-aboutPage__rowValue {
    padding: 0 16px 14px;
  }
}
.p-aboutPage {
  /* アクセス詳細リンク（c-arrowLink）＝押せる要素なのでホバー可（矢印フロー）。中央寄せ。 */
}
.p-aboutPage__facilityLink {
  display: flex;
  justify-content: center;
  margin-top: clamp(28px, 2.8vw, 44px);
}

/******************************************************************************
*
* 下層：アクセス（p-accessPage）page-access.php
* Figma WF 379:2 を notoie のデザイン言語で実装（カンプ無し・WFが構成の正本）：
* - 帯リズム（波は1ページ3本まで＝Sone確定／フロー図が主役＝帯は控えめ）：
*   header(ピーチ・下端波1)→§2 所在地・お問い合わせ(クリーム・中央960・定義テーブル)
*   →§3 地図(ピーチ帯・上端波2/下端波3・Googleマップ埋め込み)
*   →§4 アクセス方法(クリーム・★経路フロー図＝PC横/SP縦)
*   →§5 予約CTA(クリーム地＋角丸ピーチパネル・波なし)→フッター(クリーム)
* - ★目玉＝§4 経路フロー図：モバイルファースト＝縦フロー、pc(≥1200px)で横フローに組み替え。
*   3幅（PC/タブレット/SP）とも横スクロールゼロ厳守（フロー図がはみ出さない）。
*   タブレット(820)含む1200px未満は縦フロー＝ボックスを縦積み＝はみ出し原理的にゼロ。
* - ★フロー図に緑は使わない：起点=ブラウン塗り白文字／経由地=白＋ブラウン枠／フロント棟=淡ブラウン＋太枠／
*   区間の線・矢印=ブラウン系。緑40%罫線 rgba($color-main,0.4) は §2テーブルのみ。
* - ★ホバーは押せる要素だけ（CTA/LINEのみ）。テーブル/地図/フローボックスはホバー無し・opacity減光ホバー無し。
* - ★装飾イラストは入れない（Sone直近方針）。
* - トークン厳守：罫線 rgba($color-main,0.4)／本文 $fs-body／余白 $section-pad-y／波高 $wave-h／角丸は既存値(20)。
*
******************************************************************************/
.p-accessPage {
  background-color: #F6F1E7;
  /* ---------- 共通：波形境界（ピーチ帯の出入り・about/concierge と同方式） ---------- */
}
.p-accessPage__wave {
  line-height: 0;
  overflow: hidden;
}
.p-accessPage__wave img {
  display: block;
  width: 100%;
  height: clamp(40px, 5.2vw, 100px);
}
@media screen and (max-width: 767px) {
  .p-accessPage__wave img {
    height: 30px;
  }
}
.p-accessPage {
  /* 上端：wave-bg.svg（クリーム塗り）を上下反転→クリームが上・ピーチが下 */
}
.p-accessPage__wave--top img {
  transform: scaleY(-1);
}
.p-accessPage {
  /* ============================================================
     §2 所在地・お問い合わせ（クリーム・中央960・定義テーブル）
     header下端波（クリーム）で受けるため波を持たない。テーブルはリンクでない＝ホバー無し。
  ============================================================ */
}
.p-accessPage__contactInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-accessPage__contactInner {
    padding: 64px 16px;
  }
}
.p-accessPage {
  /* 定義テーブル（白地＋緑40%罫線で行区切り＝about §5 と同型・形の差でリズム） */
}
.p-accessPage__table {
  max-width: 760px;
  margin: clamp(32px, 3.2vw, 52px) auto 0;
  text-align: left;
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 20px;
  overflow: hidden;
}
.p-accessPage__row {
  display: grid;
  grid-template-columns: 200px 1fr;
  border-top: 1px solid rgba(126, 155, 122, 0.4);
}
.p-accessPage__row:first-child {
  border-top: none;
}
@media screen and (max-width: 767px) {
  .p-accessPage__row {
    grid-template-columns: 1fr;
  }
}
.p-accessPage {
  /* 項目名＝ブラウン太字（緑抑制）・淡いブラウン面で列を分ける */
}
.p-accessPage__rowLabel {
  padding: clamp(16px, 1.6vw, 22px) clamp(18px, 1.8vw, 26px);
  background-color: rgba(139, 107, 78, 0.06);
  font-weight: 700;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
@media screen and (max-width: 767px) {
  .p-accessPage__rowLabel {
    padding: 14px 16px 6px;
    background-color: transparent;
  }
}
.p-accessPage {
  /* 値＝黒本文 */
}
.p-accessPage__rowValue {
  padding: clamp(16px, 1.6vw, 22px) clamp(18px, 1.8vw, 26px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  word-break: break-word;
}
@media screen and (max-width: 767px) {
  .p-accessPage__rowValue {
    padding: 0 16px 14px;
  }
}
.p-accessPage {
  /* LINE友だち追加などの外部リンク（値をリンク化した行） */
}
.p-accessPage__rowLink {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #8B6B4E;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: opacity 0.2s ease;
}
.p-accessPage__rowLink::after {
  content: "↗";
  font-size: 0.85em;
}
.p-accessPage__rowLink:hover {
  opacity: 0.7;
}
.p-accessPage {
  /* ============================================================
     §3 地図（ピーチ帯・上下波・Googleマップ埋め込み）
     地図はリンクでない扱い＝周囲にホバー無し。レスポンシブ＝aspect-ratio で高さ確保。
  ============================================================ */
}
.p-accessPage__map {
  position: relative;
  background-color: #F5E3CB;
}
.p-accessPage__mapInner {
  max-width: 1440px;
  margin-inline: auto;
  padding: clamp(48px, 4.5vw, 80px) 24px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-accessPage__mapInner {
    padding: 40px 16px;
  }
}
.p-accessPage {
  /* 地図フレーム（角丸・レスポンシブ）。SP＝4/3で高さ確保／md以上＝1440:500目安のワイド */
}
.p-accessPage__mapFrame {
  margin-top: clamp(28px, 3vw, 48px);
  aspect-ratio: 4/3;
  border-radius: 20px;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .p-accessPage__mapFrame {
    aspect-ratio: 1440/500;
  }
}
@media screen and (max-width: 767px) {
  .p-accessPage__mapFrame {
    border-radius: 16px;
  }
}
.p-accessPage__mapFrame iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}
.p-accessPage {
  /* ============================================================
     §4 アクセス方法（★メイン＝経路フロー図・クリーム）
     各方法＝小見出し（両脇に短い横罫線）＋（補足文）＋フロー図。
     モバイルファースト＝縦フロー。pc(≥1200)で横フローに組み替え。
  ============================================================ */
}
.p-accessPage__routeInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
  text-align: center;
}
@media screen and (min-width: 1200px) {
  .p-accessPage__routeInner {
    max-width: 1040px;
  }
}
@media screen and (max-width: 767px) {
  .p-accessPage__routeInner {
    padding: 64px 16px;
  }
}
.p-accessPage {
  /* 送迎サービス注記（公共交通機関の方のみ・応相談・AC-1） */
}
.p-accessPage__pickup {
  margin-top: clamp(36px, 3.6vw, 56px);
  padding: clamp(18px, 1.8vw, 24px) clamp(20px, 2vw, 28px);
  background-color: rgba(139, 107, 78, 0.06);
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 12px;
  text-align: left;
}
.p-accessPage__pickupText {
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-accessPage {
  /* 各方法ブロック（お車／電車／飛行機） */
}
.p-accessPage__method {
  margin-top: clamp(44px, 4.4vw, 72px);
}
.p-accessPage__method:first-of-type {
  margin-top: clamp(36px, 3.6vw, 60px);
}
.p-accessPage {
  /* 小見出し（中央寄せ・両脇に短い横罫線＝ブラウン系。緑は使わない） */
}
.p-accessPage__methodHead {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(12px, 1.4vw, 20px);
}
.p-accessPage__methodHead::before, .p-accessPage__methodHead::after {
  content: "";
  flex: 0 0 auto;
  width: clamp(24px, 5vw, 56px);
  height: 1px;
  background-color: rgba(139, 107, 78, 0.4);
}
.p-accessPage__methodTitle {
  font-weight: 700;
  font-size: clamp(17px, 1.4vw, 21px);
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-accessPage {
  /* 補足文（電車/飛行機）＝控えめな本文 */
}
.p-accessPage__methodNote {
  margin-top: clamp(12px, 1.2vw, 18px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.75);
}
.p-accessPage {
  /* 同一方法内の複数フロー（お車＝ルートA/B）の間隔 */
}
.p-accessPage__flows {
  display: flex;
  flex-direction: column;
  gap: clamp(28px, 3vw, 44px);
  margin-top: clamp(24px, 2.6vw, 40px);
}
.p-accessPage {
  /* ---------- フロー図（既定＝縦フロー：SP/タブレット） ---------- */
}
.p-accessPage__flow {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.p-accessPage {
  /* 総所要時間（縦フロー＝先頭に。ブラウン太字・数字はPoppins） */
}
.p-accessPage__flowTotal {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: clamp(12px, 1.4vw, 18px);
}
.p-accessPage__flowTotalLabel {
  font-size: 12px;
  letter-spacing: 0.08em;
  color: rgba(139, 107, 78, 0.75);
}
.p-accessPage__flowTotalTime {
  margin-top: 2px;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(22px, 2vw, 30px);
  line-height: 1.2;
  letter-spacing: 0.02em;
  color: #8B6B4E;
}
.p-accessPage {
  /* トラック（ノード＋区間を交互に）。縦フロー＝縦積み・中央幅を絞る（はみ出しゼロ） */
}
.p-accessPage__flowTrack {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 320px;
}
.p-accessPage {
  /* ノード（ボックス）共通。押せる要素でない＝ホバー無し */
}
.p-accessPage__node {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: clamp(12px, 1.2vw, 15px) clamp(14px, 1.4vw, 18px);
  border-radius: 12px;
  text-align: center;
}
.p-accessPage__nodeLine {
  display: block;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.5;
  letter-spacing: 0.05em;
}
.p-accessPage {
  /* 起点＝ブラウン塗り＋白文字 */
}
.p-accessPage__node--origin {
  background-color: #8B6B4E;
  color: #FFFFFF;
  font-weight: 700;
}
.p-accessPage {
  /* 経由地＝白地＋ブラウン枠1.5px＋黒文字 */
}
.p-accessPage__node--via {
  background-color: #FFFFFF;
  border: 1.5px solid rgba(139, 107, 78, 0.55);
  color: #2B2B2B;
}
.p-accessPage {
  /* フロント棟＝到達点を強調（淡ブラウン地＋ブラウン太枠・ブラウン太字） */
}
.p-accessPage__node--front {
  background-color: rgba(139, 107, 78, 0.1);
  border: 2px solid #8B6B4E;
  color: #8B6B4E;
  font-weight: 700;
}
.p-accessPage {
  /* 区間（道路名/手段＋接続線/矢印＋所要時間）。常に column（名前・線・時間の縦積み）
     ＝縦フローでは接続線が縦、横フローでは接続線が横に切り替わる（&__segConn 側で制御） */
}
.p-accessPage__seg {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  width: 100%;
  padding: clamp(8px, 1vw, 12px) 0;
}
.p-accessPage__segName {
  font-size: clamp(12px, 0.8vw, 14px);
  line-height: 1.4;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-accessPage__segTime {
  font-family: "Poppins", sans-serif;
  font-size: clamp(12px, 0.8vw, 14px);
  line-height: 1.3;
  letter-spacing: 0.02em;
  color: #8B6B4E;
}
.p-accessPage {
  /* 接続線＋矢印（既定＝縦：短い縦線＋▼）。緑は使わない＝ブラウン系 */
}
.p-accessPage__segConn {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.p-accessPage__segConn::before {
  content: "";
  width: 2px;
  height: 16px;
  background-color: rgba(139, 107, 78, 0.55);
}
.p-accessPage__segConn::after {
  content: "▼";
  margin-top: 1px;
  font-size: 11px;
  line-height: 1;
  color: #8B6B4E;
}
.p-accessPage {
  /* ---------- 横フロー（pc ≥1200px）に組み替え ---------- */
}
@media screen and (min-width: 1200px) {
  .p-accessPage__flow {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: clamp(16px, 1.6vw, 28px);
  }
  .p-accessPage {
    /* 総所要時間＝左端・縦線区切り */
  }
  .p-accessPage__flowTotal {
    flex: 0 0 auto;
    margin-bottom: 0;
    padding-right: clamp(16px, 1.6vw, 26px);
    border-right: 1px solid rgba(139, 107, 78, 0.3);
  }
  .p-accessPage {
    /* トラック＝横並び・残り幅を占有（区間の線が伸びる） */
  }
  .p-accessPage__flowTrack {
    flex-direction: row;
    align-items: center;
    flex: 1 1 auto;
    min-width: 0;
    max-width: none;
  }
  .p-accessPage {
    /* ノード＝内容幅・伸びない／潰れは許容（テキストは折返し） */
  }
  .p-accessPage__node {
    flex: 0 1 auto;
    width: auto;
    min-width: 96px;
  }
  .p-accessPage {
    /* 区間＝横方向に伸びて線を作る（名前は線の上・時間は線の下＝column維持） */
  }
  .p-accessPage__seg {
    flex: 1 1 64px;
    min-width: 64px;
    width: auto;
    padding: 0 clamp(6px, 0.6vw, 12px);
  }
  .p-accessPage {
    /* 接続線＝横：フル幅の横線＋▶ */
  }
  .p-accessPage__segConn {
    flex-direction: row;
    width: 100%;
  }
  .p-accessPage__segConn::before {
    width: auto;
    height: 2px;
    flex: 1 1 auto;
  }
  .p-accessPage__segConn::after {
    content: "▶";
    margin-top: 0;
    margin-left: 2px;
    font-size: 10px;
  }
}

/******************************************************************************
*
* 下層：ノトイエ日誌 一覧（p-diaryPage）page-diary.php ＋ 記事カード（c-articleCard）
* WF 380:2 を notoie のデザイン言語で実装（カンプ無し・WFが構成の正本）：
* - 帯リズム：header(ピーチ・下端波1)→§2 フィルタ(クリーム)→§3 グリッド(クリーム)
*   →§4 ページネーション(クリーム)→§5 予約CTA(クリーム地＋角丸ピーチパネル・上パディング0)
*   ＝縦長のためヘッダー波1本＋本文クリームで通す（波は最大3本厳守）。
* - ★ホバー（AI_CONTEXT §4.5・2026-07-07 Sone FB）：
*   記事カード＝全体が<a>＝ホバー可だが opacity 減光は禁止＝写真ズーム＋浮き＋影で表現。
*   フィルタチップ・ページネーションも押せる要素＝ホバー可（塗り/枠/色・減光しない）。
*   出現アニメ(js-fadeInUp)とホバーは別要素（<li>=js-fadeInUp／内側=hover）。
* - ★緑抑制（HANDOFF §4）：現在チップ/現在ページ/カテゴリバッジ＝ブラウン（$color-main-dark）。
*   緑は罫線 rgba($color-main,0.4) のみ。★装飾イラストは入れない（Sone直近方針）。
* - トークン厳守：本文 $fs-body／余白 $section-pad-y／罫線 緑40%／角丸は既存値(20)。
*
* ※ .c-articleCard は一覧§3・記事詳細(single.php)の関連記事§3で共用する部品。
*   使用箇所が両ファイルに跨るが同時にコンパイルされるため定義はここに集約する。
*
******************************************************************************/
.p-diaryPage {
  background-color: #F6F1E7;
  /* ============================================================
     §2 カテゴリーフィルター（クリーム・チップ4つ＝各<a>）
     header下端波（クリーム）で受けるため波を持たない。
  ============================================================ */
}
.p-diaryPage__filterInner {
  max-width: 1440px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px clamp(28px, 3vw, 44px);
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-diaryPage__filterInner {
    padding: 64px 16px 28px;
  }
}
.p-diaryPage {
  /* チップ列（横並び・中央・折返し） */
}
.p-diaryPage__chipList {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(12px, 1.2vw, 18px);
}
.p-diaryPage {
  /* 出現アニメの外殻（js-fadeInUp は display:block／inline-flexで横並びに戻す） */
}
.p-diaryPage__chipItem {
  display: inline-flex;
}
.p-diaryPage {
  /* チップ本体＝押せる要素（<a>）。通常＝ブラウン枠／現在選択＝塗りブラウン。
     ホバーは非現在チップのみ淡ブラウン面＋浮き＋影（減光しない）。 */
}
.p-diaryPage__chip {
  display: inline-flex;
  align-items: center;
  padding: 10px clamp(18px, 1.8vw, 26px);
  background-color: transparent;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 999px;
  font-weight: 700;
  font-size: clamp(13px, 1vw, 15.5px);
  line-height: 1.5;
  letter-spacing: 0.05em;
  color: #8B6B4E;
  text-decoration: none;
  transition: transform 0.25s ease, background-color 0.25s ease, color 0.25s ease;
}
.p-diaryPage__chip:hover {
  transform: translateY(-2px);
  background-color: rgba(139, 107, 78, 0.1);
}
.p-diaryPage__chip {
  /* 現在選択中＝塗りブラウン・白文字（緑抑制）。押しても同ページなので浮きのみ抑える。 */
}
.p-diaryPage__chip.is-current {
  background-color: #8B6B4E;
  border-color: #8B6B4E;
  color: #FFFFFF;
}
.p-diaryPage__chip.is-current:hover {
  transform: none;
  background-color: #8B6B4E;
}
.p-diaryPage {
  /* ============================================================
     §3 記事グリッド（3列／タブレット2列／SP1列）
  ============================================================ */
}
.p-diaryPage__listInner {
  max-width: 1440px;
  margin-inline: auto;
  padding: 0 24px clamp(64px, 6vw, 116px);
}
@media screen and (max-width: 767px) {
  .p-diaryPage__listInner {
    padding: 0 16px 64px;
  }
}
.p-diaryPage__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(22px, 2.2vw, 36px);
  /* タブレット（〜1024px）＝2列 */
}
@media screen and (max-width: 1024px) {
  .p-diaryPage__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
.p-diaryPage__grid {
  /* SP（〜767px）＝1列 */
}
@media screen and (max-width: 767px) {
  .p-diaryPage__grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
.p-diaryPage {
  /* 投稿ゼロ時の中立メッセージ */
}
.p-diaryPage__empty {
  padding: clamp(40px, 5vw, 80px) 0;
  text-align: center;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.6);
}
.p-diaryPage {
  /* ============================================================
     §4 ページネーション（?pg= 方式・< 1 2 3 … N >）
     paginate_links の .page-numbers を丸44pxに整形。押せる要素＝ホバー可（減光しない）。
  ============================================================ */
}
.p-diaryPage__pager {
  margin-top: clamp(40px, 4vw, 64px);
}
.p-diaryPage__pagerList {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(8px, 1vw, 12px);
}
.p-diaryPage__pagerList .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 44px;
  padding: 0 6px;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 50%;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 15px;
  line-height: 1;
  color: #8B6B4E;
  text-decoration: none;
  transition: transform 0.22s ease, background-color 0.22s ease, color 0.22s ease;
}
.p-diaryPage__pagerList {
  /* リンク（現在ページ・…以外）＝ホバーで淡ブラウン面＋浮き（減光しない） */
}
.p-diaryPage__pagerList a.page-numbers:hover {
  transform: translateY(-2px);
  background-color: rgba(139, 107, 78, 0.1);
}
.p-diaryPage__pagerList {
  /* 現在ページ＝塗りブラウン・白文字 */
}
.p-diaryPage__pagerList .page-numbers.current {
  background-color: #8B6B4E;
  border-color: #8B6B4E;
  color: #FFFFFF;
}
.p-diaryPage__pagerList {
  /* … （省略記号）＝枠なし */
}
.p-diaryPage__pagerList .page-numbers.dots {
  border-color: transparent;
  color: rgba(43, 43, 43, 0.5);
}
.p-diaryPage__pagerList {
  /* 前後の < > も同じ丸で統一 */
}
.p-diaryPage__pagerList .prev,
.p-diaryPage__pagerList .next {
  font-size: 16px;
}

/******************************************************************************
* 記事カード（c-articleCard）＝一覧§3・関連記事§3で共用
* カード全体が<a>＝ホバー可（写真ズーム＋浮き＋影・opacity減光は禁止）。
* 出現アニメ(js-fadeInUp)は外殻<li>／ホバーtransitionは内側<a>／写真ズームは__img
* ＝別要素に分離（同一要素に載せると出現がカクつく・HANDOFF §3の既知不具合回避）。
******************************************************************************/
.c-articleCard {
  display: flex;
}
.c-articleCard__link {
  display: flex;
  flex-direction: column;
  width: 100%;
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 20px;
  overflow: hidden;
  text-decoration: none;
  color: #2B2B2B;
  transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
}
.c-articleCard__link:hover {
  transform: translateY(-6px);
}
.c-articleCard__link:hover .c-articleCard__img {
  transform: scale(1.06);
}
.c-articleCard {
  /* アイキャッチ 384×240（8:5）。未設定はプレースホルダー面。 */
}
.c-articleCard__thumb {
  position: relative;
  aspect-ratio: 384/240;
  overflow: hidden;
  background-color: #D9D9D9;
}
.c-articleCard__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
.c-articleCard__placeholder {
  display: block;
  width: 100%;
  height: 100%;
  background-color: #D9D9D9;
}
.c-articleCard__body {
  display: flex;
  flex-direction: column;
  gap: clamp(8px, 0.9vw, 12px);
  flex: 1;
  padding: clamp(16px, 1.5vw, 22px);
}
.c-articleCard__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.c-articleCard {
  /* カテゴリバッジ＝ブラウン小pill（緑抑制） */
}
.c-articleCard__cat {
  display: inline-flex;
  align-items: center;
  padding: 3px 12px;
  background-color: rgba(139, 107, 78, 0.1);
  border-radius: 999px;
  font-weight: 700;
  font-size: 11.5px;
  line-height: 1.5;
  letter-spacing: 0.04em;
  color: #8B6B4E;
}
.c-articleCard {
  /* 日付＝Poppins・グレー */
}
.c-articleCard__date {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 12.5px;
  letter-spacing: 0.06em;
  color: rgba(43, 43, 43, 0.55);
}
.c-articleCard {
  /* タイトル＝2行省略 */
}
.c-articleCard__title {
  font-weight: 700;
  font-size: clamp(15px, 1.1vw, 18px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.c-articleCard {
  /* 抜粋＝3行省略 */
}
.c-articleCard__excerpt {
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.72);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

/******************************************************************************
*
* 下層：ノトイエ日誌 記事詳細（p-diaryPost）single.php
* WF 381:2 を notoie のデザイン言語で実装（カンプ無し・WFが構成の正本）：
* - 帯リズム：header(ピーチ・下端波1)→§2 本文(クリーム・960中央)→§3 関連記事(クリーム)
*   →§4 予約CTA(クリーム地＋角丸ピーチパネル・上パディング0)。波はヘッダー1本のみ。
* - ★the_content()（Gutenberg）に読みやすい prose スタイル（.p-diaryPost__body）：
*   h2/h3 見出し＝ブラウン（緑ソリッド不使用）／本文＝黒 lh1.9／画像＝角丸／リスト・引用整形。
*   リンク＝ブラウン系＋下線／opacity 減光ホバー禁止（太さ変化で押下を示す）。罫線は緑40%可。
* - ★ホバーは押せる要素だけ（関連カード＝写真ズーム/浮き・戻るリンク＝矢印スライド）。
*   本文・見出し・アイキャッチ（非リンク）にホバーを付けない。★装飾イラストなし。
* - トークン厳守：本文 $fs-body／余白 $section-pad-y／罫線 緑40%／角丸は既存値(20)。
* - 記事カード（.c-articleCard）とグリッドは _p-diary-page.scss と共用。
*
******************************************************************************/
.p-diaryPost {
  background-color: #F6F1E7;
  /* ============================================================
     §2 記事本文（クリーム・960中央）。タイトルはヘッダーに出すため本文では省略。
  ============================================================ */
}
.p-diaryPost__inner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-diaryPost__inner {
    padding: 64px 16px;
  }
}
.p-diaryPost {
  /* バッジ＋日付（本文はリンクでない＝ホバー無し） */
}
.p-diaryPost__head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
.p-diaryPost__cat {
  display: inline-flex;
  align-items: center;
  padding: 4px 14px;
  background-color: rgba(139, 107, 78, 0.1);
  border-radius: 999px;
  font-weight: 700;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: 0.04em;
  color: #8B6B4E;
}
.p-diaryPost__date {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 13.5px;
  letter-spacing: 0.06em;
  color: rgba(43, 43, 43, 0.55);
}
.p-diaryPost {
  /* アイキャッチ（960×450相当・角丸・非リンク＝ホバー無し） */
}
.p-diaryPost__thumb {
  margin-top: clamp(20px, 2.2vw, 32px);
  aspect-ratio: 960/450;
  border-radius: 20px;
  overflow: hidden;
  background-color: #D9D9D9;
}
.p-diaryPost__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media screen and (max-width: 767px) {
  .p-diaryPost__thumb {
    border-radius: 16px;
  }
}
.p-diaryPost {
  /* --------------------------------------------------------
     the_content() の prose スタイル（Gutenberg）
     見出し＝ブラウン／本文＝黒 lh1.9／画像角丸／リスト・引用・リンク整形。
  -------------------------------------------------------- */
}
.p-diaryPost__body {
  margin-top: clamp(28px, 3vw, 48px);
  color: #2B2B2B;
  /* 段落 */
}
.p-diaryPost__body p {
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.9;
  letter-spacing: 0.05em;
  margin-top: 1.4em;
}
.p-diaryPost__body p:first-child {
  margin-top: 0;
}
.p-diaryPost__body {
  /* h2＝ブラウン・下罫線緑40%（緑ソリッド不使用）。
     ★Gutenberg のプリセット色クラス（.has-*-color{color:…!important}）が付いた
       見出しでもデザイン言語どおりブラウンに揃える＝より高い詳細度＋!important で上書き。
       （デモの流用投稿は has-pale-pink/vivid-red 等の虹色見出しを持つため必須） */
}
.p-diaryPost__body h2 {
  position: relative;
  margin-top: 2em;
  padding-bottom: 0.55em;
  font-weight: 700;
  font-size: clamp(20px, 1.8vw, 28px);
  line-height: 1.5;
  letter-spacing: 0.05em;
  color: #8B6B4E !important;
  /* 緑は“短い下線アクセント”として効かせる（全幅の細線でのっぺりさせない・2026-07-07 Sone FB） */
}
.p-diaryPost__body h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 2.2em;
  height: 3px;
  border-radius: 2px;
  background: #7E9B7A;
}
.p-diaryPost__body {
  /* h3＝ブラウン（罫線なし・やや小さめ） */
}
.p-diaryPost__body h3 {
  margin-top: 1.8em;
  font-weight: 700;
  font-size: clamp(17px, 1.4vw, 22px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E !important;
}
.p-diaryPost__body h4 {
  margin-top: 1.6em;
  font-weight: 700;
  font-size: clamp(15.5px, 1.15vw, 18px);
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: #2B2B2B !important;
}
.p-diaryPost__body {
  /* リスト＝各項目を下線で区切る（最下行は下線なし）・左余白なしで本文と揃える
     （2026-07-07 Sone指示：リストに下線／左余白いらない）。マーカー・番号＝ブラウン。 */
}
.p-diaryPost__body ul,
.p-diaryPost__body ol {
  margin-top: 1.4em;
  padding-left: 0;
  list-style: none;
  counter-reset: li;
}
.p-diaryPost__body ul li,
.p-diaryPost__body ol li {
  position: relative;
  padding: 0.75em 0 0.75em 1.5em;
  border-bottom: 1px solid rgba(139, 107, 78, 0.16);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.9;
  letter-spacing: 0.05em;
}
.p-diaryPost__body ul li:last-child,
.p-diaryPost__body ol li:last-child {
  border-bottom: 0;
}
.p-diaryPost__body {
  /* 番号なしリスト＝ブラウンの中黒 */
}
.p-diaryPost__body ul li::before {
  content: "";
  position: absolute;
  left: 3px;
  top: 1.42em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #8B6B4E;
}
.p-diaryPost__body {
  /* 番号付きリスト＝ブラウンの番号（Poppins） */
}
.p-diaryPost__body ol li {
  counter-increment: li;
}
.p-diaryPost__body ol li::before {
  content: counter(li);
  position: absolute;
  left: 0;
  top: 0.75em;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 0.95em;
  line-height: 1.9;
  color: #8B6B4E;
}
.p-diaryPost__body {
  /* 画像／figure（reset の img{width:100%} を上書きし自然幅・上限100%） */
}
.p-diaryPost__body img {
  width: auto;
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
}
.p-diaryPost__body figure {
  margin-top: 1.6em;
}
.p-diaryPost__body figure img {
  width: 100%;
}
.p-diaryPost__body figcaption {
  margin-top: 0.7em;
  font-size: 12.5px;
  line-height: 1.7;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.6);
  text-align: center;
}
.p-diaryPost__body {
  /* 引用＝左罫線ブラウン＋淡ブラウン面（緑はアクセント箇所に集約） */
}
.p-diaryPost__body blockquote {
  margin-top: 1.6em;
  padding: clamp(16px, 1.6vw, 24px) clamp(18px, 1.8vw, 28px);
  border-left: 4px solid #8B6B4E;
  background-color: rgba(139, 107, 78, 0.05);
  border-radius: 0 12px 12px 0;
}
.p-diaryPost__body blockquote p {
  margin-top: 0.8em;
  color: rgba(43, 43, 43, 0.85);
}
.p-diaryPost__body blockquote p:first-child {
  margin-top: 0;
}
.p-diaryPost__body {
  /* リンク＝ブラウン＋下線（opacity 減光ホバー禁止＝太さ変化で押下を示す）。
     Gutenberg の .wp-elements-* リンク色プリセットを上書きするため !important。 */
}
.p-diaryPost__body a {
  color: #8B6B4E !important;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  transition: text-decoration-thickness 0.2s ease;
}
.p-diaryPost__body a:hover {
  text-decoration-thickness: 2px;
}
.p-diaryPost__body strong,
.p-diaryPost__body b {
  font-weight: 700;
}
.p-diaryPost__body {
  /* 水平線＝緑40%罫線（サイト共通） */
}
.p-diaryPost__body hr {
  margin: 2em 0;
  border: 0;
  border-top: 1px solid rgba(126, 155, 122, 0.4);
}
.p-diaryPost__body {
  /* テーブル（ケルソン流：ヘッダー行＝緑塗り白文字・横スクロール・最下行罫線なし）。
     緑を“ここぞ”のソリッド面として使い、のっぺりを回避（2026-07-07 Sone指示）。
     Gutenberg の figure.wp-block-table 前提。WP core の td/th{border:1px} を配下セレクタで上書き。 */
}
.p-diaryPost__body .wp-block-table {
  margin: 1.9em 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.p-diaryPost__body .wp-block-table table {
  width: max-content;
  min-width: 100%;
  border-collapse: collapse;
  margin: 0;
  background: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  font-size: clamp(14px, 0.85vw, 16px);
}
@media screen and (max-width: 767px) {
  .p-diaryPost__body .wp-block-table table {
    font-size: 13.5px;
  }
}
.p-diaryPost__body .wp-block-table {
  /* WP core block-library の `thead{border-bottom:3px solid}` `tfoot{border-top:3px solid}`
     ＝currentColor(黒)の太線が緑ヘッダー下に出ていた → 消す（2026-07-15 Sone FB「黒い線が気になる」） */
}
.p-diaryPost__body .wp-block-table thead {
  border-bottom: 0;
}
.p-diaryPost__body .wp-block-table tfoot {
  border-top: 0;
}
.p-diaryPost__body .wp-block-table th,
.p-diaryPost__body .wp-block-table td {
  padding: 14px 18px;
  text-align: left;
  vertical-align: top;
  color: #2B2B2B;
  border: 0;
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
  letter-spacing: 0.05em;
}
@media screen and (max-width: 767px) {
  .p-diaryPost__body .wp-block-table th,
  .p-diaryPost__body .wp-block-table td {
    padding: 11px 13px;
  }
}
.p-diaryPost__body .wp-block-table td {
  font-weight: 400;
}
.p-diaryPost__body .wp-block-table {
  /* ヘッダー行＝緑塗り＋白文字（thead が無い表は先頭行を見出し扱い） */
}
.p-diaryPost__body .wp-block-table thead th,
.p-diaryPost__body .wp-block-table table > tbody:first-child > tr:first-child > *,
.p-diaryPost__body .wp-block-table table > tr:first-child > * {
  background: #7E9B7A;
  color: #FFFFFF;
  font-weight: 700;
  letter-spacing: 0.06em;
  border-bottom: 0;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  .p-diaryPost__body .wp-block-table thead th,
  .p-diaryPost__body .wp-block-table table > tbody:first-child > tr:first-child > *,
  .p-diaryPost__body .wp-block-table table > tr:first-child > * {
    padding: 10px 13px;
  }
}
.p-diaryPost__body .wp-block-table tr:last-child > * {
  border-bottom: 0;
}
.p-diaryPost__body {
  /* SP画像の左右はみ出し防止（横スクロール0のため） */
}
@media screen and (max-width: 767px) {
  .p-diaryPost__body img {
    border-radius: 12px;
  }
}
.p-diaryPost {
  /* ============================================================
     §3 関連記事（クリーム・同カテゴリ最新3件）。カード＝c-articleCard（共用）。
     上は§2本文の下パディングで確保（二重余白防止）＝上パディング0。
  ============================================================ */
}
.p-diaryPost__relatedInner {
  max-width: 1440px;
  margin-inline: auto;
  padding: 0 24px clamp(64px, 6vw, 116px);
}
@media screen and (max-width: 767px) {
  .p-diaryPost__relatedInner {
    padding: 0 16px 64px;
  }
}
.p-diaryPost {
  /* 記事グリッド（3列／タブレット2列／SP1列）＝一覧§3と同仕様 */
}
.p-diaryPost__relatedGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(22px, 2.2vw, 36px);
  margin-top: clamp(32px, 3.2vw, 52px);
}
@media screen and (max-width: 1024px) {
  .p-diaryPost__relatedGrid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 767px) {
  .p-diaryPost__relatedGrid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
.p-diaryPost {
  /* 一覧へ戻る（左向きチェブロン＋下線）＝押せる要素・opacity減光しない */
}
.p-diaryPost__back {
  display: flex;
  justify-content: center;
  margin-top: clamp(32px, 3.2vw, 52px);
}
.p-diaryPost__backLink {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 7px;
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
  color: #8B6B4E;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.12em;
  line-height: 1;
  text-decoration: none;
}
.p-diaryPost__backLink:hover .p-diaryPost__backArrow {
  transform: translateX(-4px);
}
.p-diaryPost {
  /* 左向きチェブロン（CSS描画・currentColor継承） */
}
.p-diaryPost__backArrow {
  position: relative;
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  transition: transform 0.3s ease;
}
.p-diaryPost__backArrow::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  margin: -4px 0 0 -2px;
  border-bottom: 2px solid currentColor;
  border-left: 2px solid currentColor;
  transform: translate(-50%, -50%) rotate(45deg);
}

/******************************************************************************
*
* 下層：お問い合わせ（p-contactPage）page-contact.php
* Figma WF 460:2 確定版を notoie のデザイン言語で実装（カンプ無し・WFが構成/コピーの正本）：
* - フォーム＝フォームメーラー HTML設置型（外部POST）。送信先/keyは site-info.php 定数。
* - 帯リズム（波は1ページ3本まで）：
*   header(ピーチ・下端波1) → §2 リード(クリーム)
*   → §3 お急ぎの方は(ピーチ帯・上端波2/下端波3・LINE/TELカード) → §4 フォーム(クリーム)
*   → §5 予約CTA(クリーム地＋角丸ピーチパネル・波なし) → フッター(クリーム)
* - ★ホバーは押せる要素だけ：お急ぎカード(<a>)・送信ボタン。装飾イラストなし。
* - ★緑抑制：見出し/必須バッジ=ブラウン・罫線緑40%。LINE緑はブランド色として別扱い（サイトのメイン緑ではない）。
*
******************************************************************************/
.p-contactPage {
  background-color: #F6F1E7;
  /* ---------- 共通：波形境界（ピーチ帯の出入り） ---------- */
}
.p-contactPage__wave {
  line-height: 0;
  overflow: hidden;
}
.p-contactPage__wave img {
  display: block;
  width: 100%;
  height: clamp(40px, 5.2vw, 100px);
}
@media screen and (max-width: 767px) {
  .p-contactPage__wave img {
    height: 30px;
  }
}
.p-contactPage__wave--top img {
  transform: scaleY(-1);
}
.p-contactPage {
  /* ============================================================
     §2 リード（クリーム・header下端波で受けるため波なし）
  ============================================================ */
}
.p-contactPage__leadInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-contactPage__leadInner {
    padding: 56px 16px;
  }
}
.p-contactPage__leadText {
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 2;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-contactPage {
  /* ============================================================
     §3 お急ぎの方は（ピーチ帯・上下波・LINE/TELカード。押せる要素＝ホバー可）
  ============================================================ */
}
.p-contactPage__urgent {
  position: relative;
  background-color: #F6F1E7;
}
.p-contactPage__urgentInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(48px, 4.5vw, 80px) 24px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-contactPage__urgentInner {
    padding: 40px 16px;
  }
}
.p-contactPage__urgentCards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(16px, 1.7vw, 24px);
  margin-top: clamp(28px, 2.8vw, 44px);
}
.p-contactPage {
  /* カード共通（98px高・角丸8・中央寄せ・押せる要素なのでホバー可） */
}
.p-contactPage__urgentCard {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 240px;
  min-height: 98px;
  padding: 20px 40px;
  border-radius: 8px;
  text-decoration: none;
  transition: transform 0.2s ease, background-color 0.2s ease;
}
@media screen and (max-width: 767px) {
  .p-contactPage__urgentCard {
    width: 100%;
    min-width: 0;
  }
}
.p-contactPage {
  /* LINE＝ブランド緑（サイトのメイン緑とは別扱い）・白文字＋LINEロゴ横並び（2026-07-15） */
}
.p-contactPage__urgentCard--line {
  background-color: #06c755;
  flex-direction: row;
  gap: 10px;
}
.p-contactPage__urgentCard--line:hover {
  transform: translateY(-2px);
}
.p-contactPage__urgentLineIcon {
  display: inline-flex;
  flex-shrink: 0;
}
.p-contactPage__urgentLineIcon img {
  width: clamp(24px, 2vw, 28px);
  height: auto;
}
.p-contactPage__urgentLineLabel {
  font-weight: 700;
  font-size: clamp(16px, 1.3vw, 18px);
  letter-spacing: 0.05em;
  color: #FFFFFF;
}
.p-contactPage {
  /* 電話＝白カード・ブラウン枠・番号Barlow */
}
.p-contactPage__urgentCard--tel {
  background-color: #FFFFFF;
  border: 1px solid rgba(139, 107, 78, 0.45);
}
.p-contactPage__urgentCard--tel:hover {
  transform: translateY(-2px);
}
.p-contactPage__urgentTelNum {
  font-family: "Barlow Semi Condensed", "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(18px, 1.5vw, 20px);
  letter-spacing: 0.02em;
  color: #8B6B4E;
}
.p-contactPage__urgentTelHours {
  font-size: clamp(11px, 0.8vw, 12px);
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.6);
}
.p-contactPage {
  /* ============================================================
     §4 お問い合わせフォーム（クリーム・フォームメーラー外部POST）
  ============================================================ */
}
.p-contactPage__formInner {
  max-width: 720px;
  margin-inline: auto;
  padding: 0 24px clamp(64px, 6vw, 116px);
}
@media screen and (max-width: 767px) {
  .p-contactPage__formInner {
    padding: 0 16px 56px;
  }
}
.p-contactPage__formBody {
  margin-top: clamp(28px, 2.8vw, 44px);
}
.p-contactPage__formRequireNote {
  font-size: clamp(12px, 0.8vw, 13px);
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.6);
}
.p-contactPage__field {
  margin-top: clamp(20px, 2vw, 28px);
}
.p-contactPage__label {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  font-size: clamp(14px, 0.85vw, 16px);
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-contactPage {
  /* 必須バッジ＝ブラウン塗り（緑抑制・アクセントに集約） */
}
.p-contactPage__req {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  background-color: #8B6B4E;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #FFFFFF;
}
.p-contactPage {
  /* 任意バッジ＝淡いグレー枠 */
}
.p-contactPage__opt {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  border: 1px solid rgba(43, 43, 43, 0.3);
  font-size: 11px;
  letter-spacing: 0.04em;
  color: rgba(43, 43, 43, 0.6);
}
.p-contactPage {
  /* お名前＝姓/名の2カラム（ラベル文字は撤去・プレースホルダで順序提示） */
}
.p-contactPage__nameRow {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 8px;
}
@media screen and (max-width: 575px) {
  .p-contactPage__nameRow {
    grid-template-columns: 1fr;
  }
}
.p-contactPage__nameRow .p-contactPage__input {
  margin-top: 0;
}
.p-contactPage {
  /* 入力欄共通 */
}
.p-contactPage__input {
  display: block;
  width: 100%;
  margin-top: 8px;
  padding: 13px 16px;
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 8px;
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  transition: border-color 0.2s ease;
}
.p-contactPage__input::placeholder {
  color: rgba(43, 43, 43, 0.4);
}
.p-contactPage__input:focus {
  outline: none;
  border-color: #8B6B4E;
}
.p-contactPage__textarea {
  resize: vertical;
  min-height: 140px;
}
.p-contactPage {
  /* プライバシー同意（checkbox required＝送信ゲート） */
}
.p-contactPage__consent {
  margin-top: clamp(20px, 2vw, 28px);
}
.p-contactPage__consentLabel {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  cursor: pointer;
}
.p-contactPage__consentLabel a {
  color: #8B6B4E;
  text-underline-offset: 3px;
}
.p-contactPage__checkbox {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin-top: 2px;
  accent-color: #8B6B4E;
  cursor: pointer;
}
.p-contactPage__submitRow {
  margin-top: clamp(28px, 2.8vw, 40px);
  text-align: center;
}
.p-contactPage {
  /* 送信ボタン＝ブラウン塗り白文字（押せる要素＝ホバー可） */
}
.p-contactPage__submit {
  display: inline-block;
  min-width: 280px;
  padding: 18px 48px;
  background-color: #8B6B4E;
  border: 1px solid #8B6B4E;
  border-radius: 999px;
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: clamp(15px, 1.1vw, 16px);
  letter-spacing: 0.05em;
  color: #FFFFFF;
  cursor: pointer;
  transition: background-color 0.2s ease, transform 0.2s ease;
}
.p-contactPage__submit:hover {
  background-color: #7a5e43;
  transform: translateY(-2px);
}
@media screen and (max-width: 767px) {
  .p-contactPage__submit {
    width: 100%;
    min-width: 0;
  }
}
.p-contactPage__formNotes {
  margin-top: clamp(20px, 2vw, 28px);
  font-size: clamp(11px, 0.8vw, 12px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.6);
  text-align: center;
}
.p-contactPage__formNotes p + p {
  margin-top: 4px;
}
.p-contactPage__notesLink {
  font-weight: 700;
  color: #8B6B4E;
  text-underline-offset: 3px;
}

/******************************************************************************
*
* 下層：初めての方へ（p-firstVisit）page-first-visit.php
* ワイヤーv3＋確定コピー。2026-07-08 レイアウト刷新（Sone「レイアウトが全然良くない」FB）：
* - §1＝縦タイムライン（番号＋つなぎ線で"流れ"を明示・フロント棟STEP強調）＋フロント棟地図を横に統合（2カラム・lg以上）。
* - §2＝2カラム（左テキスト左揃え／右どんたく地図）。地図を「買い出し先」として文脈に紐づけ、全幅の大帯をやめる。
* - 帯リズム：header(ピーチ波1)→§1(クリーム)→§2(ピーチ帯・上端波2/下端波3)→§3(クリーム)。
* - ★ホバーは押せる要素だけ／緑抑制（番号/見出し/強調＝ブラウン・罫線緑40%）／装飾なし。
*
******************************************************************************/
.p-firstVisit {
  background-color: #F6F1E7;
  /* ---------- 共通：波形境界 ---------- */
}
.p-firstVisit__wave {
  line-height: 0;
  overflow: hidden;
}
.p-firstVisit__wave img {
  display: block;
  width: 100%;
  height: clamp(40px, 5.2vw, 100px);
}
@media screen and (max-width: 767px) {
  .p-firstVisit__wave img {
    height: 30px;
  }
}
.p-firstVisit__wave--top img {
  transform: scaleY(-1);
}
.p-firstVisit {
  /* 共通：リード */
}
.p-firstVisit__lead {
  max-width: 960px;
  margin: clamp(14px, 1.4vw, 22px) auto 0;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-firstVisit__lead {
    text-align: left;
  }
}
.p-firstVisit {
  /* 共通：地図（ラベル＋フレーム＋注記） */
}
.p-firstVisit__mapLabel {
  font-weight: 700;
  font-size: clamp(13px, 1vw, 15px);
  letter-spacing: 0.05em;
  color: #8B6B4E;
  margin-bottom: 10px;
}
.p-firstVisit__mapFrame {
  aspect-ratio: 4/3;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(126, 155, 122, 0.4);
}
.p-firstVisit__mapFrame iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}
.p-firstVisit__mapNote {
  margin-top: 12px;
  font-size: clamp(12px, 0.85vw, 13px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.66);
}
.p-firstVisit {
  /* ============================================================
     §1 ご到着からチェックインまで（主役・クリーム）＝タイムライン＋地図
  ============================================================ */
}
.p-firstVisit__arrivalInner {
  max-width: calc(960px + 220px);
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
}
@media screen and (max-width: 767px) {
  .p-firstVisit__arrivalInner {
    padding: 56px 16px;
  }
}
.p-firstVisit__arrivalGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(28px, 3vw, 44px);
  margin-top: clamp(30px, 3vw, 48px);
}
@media screen and (min-width: 992px) {
  .p-firstVisit__arrivalGrid {
    grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
    gap: clamp(36px, 3.4vw, 60px);
    align-items: start;
  }
}
.p-firstVisit {
  /* 縦タイムライン */
}
.p-firstVisit__timeline {
  list-style: none;
  margin: 0;
  padding: 0;
}
.p-firstVisit__tstep {
  position: relative;
  display: grid;
  grid-template-columns: 44px 1fr;
  align-items: start;
  gap: clamp(14px, 1.4vw, 18px);
  padding-bottom: clamp(20px, 2.2vw, 30px);
}
.p-firstVisit__tstep:last-child {
  padding-bottom: 0;
}
.p-firstVisit__tstep {
  /* つなぎ線（ノード列の下・次ノードへ） */
}
.p-firstVisit__tstep:not(:last-child)::before {
  content: "";
  position: absolute;
  left: 21px;
  top: 46px;
  bottom: -2px;
  width: 2px;
  background-color: rgba(139, 107, 78, 0.22);
}
.p-firstVisit__tstep {
  /* フロント棟STEP＝ノード塗り＋本文を淡ブラウンで強調 */
}
.p-firstVisit__tstep.is-key .p-firstVisit__tnode {
  background-color: #8B6B4E;
  border-color: #8B6B4E;
  color: #FFFFFF;
}
.p-firstVisit__tstep.is-key .p-firstVisit__tbody {
  padding: 12px 16px;
  background-color: rgba(139, 107, 78, 0.06);
  border-radius: 12px;
}
.p-firstVisit__tnode {
  position: relative;
  z-index: 1;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background-color: #FFFFFF;
  border: 2px solid rgba(139, 107, 78, 0.4);
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.02em;
  color: #8B6B4E;
}
.p-firstVisit__tbody {
  padding-top: 8px;
  min-width: 0;
}
.p-firstVisit__ttitle {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 10px;
  font-weight: 700;
  font-size: clamp(15px, 1.2vw, 17px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-firstVisit__tbadge {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #FFFFFF;
  background-color: #8B6B4E;
  border-radius: 5px;
  padding: 2px 8px;
}
.p-firstVisit__ttext {
  margin-top: 5px;
  font-size: clamp(13px, 0.9vw, 14px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.8);
}
.p-firstVisit {
  /* 各ステップの写真＝タイトルの上（Sone選定待ち＝空はプレースホルダー面） */
}
.p-firstVisit__tphoto {
  width: 100%;
  aspect-ratio: 16/9;
  margin-bottom: clamp(10px, 1vw, 14px);
  border-radius: 12px;
  overflow: hidden;
  background-color: #D9D9D9;
}
.p-firstVisit__tphoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .p-firstVisit__tphoto {
    border-radius: 10px;
  }
}
.p-firstVisit {
  /* 写真未設定のステップは枠ごと非表示（グレー箱を出さない）2026-07-14 */
}
.p-firstVisit__tphoto--empty {
  display: none;
}
.p-firstVisit {
  /* フロント棟地図（lg以上でタイムライン横・上部に貼り付き） */
}
@media screen and (min-width: 992px) {
  .p-firstVisit__arrivalMap {
    position: sticky;
    top: 96px;
  }
}
.p-firstVisit {
  /* ============================================================
     §2 お食事とお買い物（ピーチ帯・上下波）＝2カラム
  ============================================================ */
}
.p-firstVisit__meals {
  position: relative;
  background-color: #F5E3CB;
}
.p-firstVisit__mealsInner {
  max-width: calc(960px + 220px);
  margin-inline: auto;
  padding: clamp(48px, 4.5vw, 80px) 24px;
}
@media screen and (max-width: 767px) {
  .p-firstVisit__mealsInner {
    padding: 40px 16px;
  }
}
.p-firstVisit__mealsGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(24px, 2.6vw, 40px);
  margin-top: clamp(30px, 3vw, 48px);
}
@media screen and (min-width: 992px) {
  .p-firstVisit__mealsGrid {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
    gap: clamp(36px, 3.4vw, 60px);
    align-items: start;
  }
}
.p-firstVisit__mealsText {
  text-align: left;
}
.p-firstVisit__mealsHead {
  font-weight: 700;
  font-size: clamp(18px, 1.7vw, 23px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-firstVisit__mealsP {
  margin-top: clamp(12px, 1.2vw, 18px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-firstVisit__mealsP--sub {
  margin-top: clamp(16px, 1.6vw, 22px);
  padding-top: clamp(14px, 1.4vw, 18px);
  border-top: 1px solid rgba(126, 155, 122, 0.4);
  font-size: clamp(13px, 0.9vw, 14px);
  color: rgba(43, 43, 43, 0.82);
}
@media screen and (min-width: 992px) {
  .p-firstVisit__mealsMap {
    position: sticky;
    top: 96px;
  }
}
.p-firstVisit {
  /* ============================================================
     §3 お困りのときは（クリーム・連絡先＋関連リンク）
  ============================================================ */
}
.p-firstVisit__contactInner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(64px, 6vw, 116px) 24px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-firstVisit__contactInner {
    padding: 56px 16px;
  }
}
.p-firstVisit__contactBtns {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(20px, 2.4vw, 40px);
  margin-top: clamp(28px, 2.8vw, 44px);
}
@media screen and (max-width: 767px) {
  .p-firstVisit__contactBtns {
    flex-direction: column;
    gap: 20px;
  }
}
.p-firstVisit__tel {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 10px 24px;
  border-radius: 16px;
  text-decoration: none;
  transition: background-color 0.25s ease;
}
.p-firstVisit__tel:hover {
  background-color: rgba(139, 107, 78, 0.07);
}
.p-firstVisit__telCaption {
  font-size: clamp(12px, 0.85vw, 13.5px);
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.66);
}
.p-firstVisit__telNum {
  font-family: "Barlow Semi Condensed", "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(24px, 2.4vw, 34px);
  line-height: 1.1;
  letter-spacing: 0.02em;
  color: #8B6B4E;
}
.p-firstVisit__telHours {
  font-size: clamp(12px, 0.9vw, 14px);
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.66);
}
.p-firstVisit__rel {
  list-style: none;
  margin: clamp(30px, 3vw, 48px) 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}
.p-firstVisit__relLink {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 11px 20px;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 999px;
  background-color: #FFFFFF;
  font-size: clamp(13px, 0.95vw, 14px);
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  text-decoration: none;
  transition: background-color 0.25s ease, border-color 0.25s ease;
}
.p-firstVisit__relLink:hover {
  background-color: rgba(139, 107, 78, 0.06);
  border-color: rgba(139, 107, 78, 0.5);
}
.p-firstVisit__relArrow {
  color: #8B6B4E;
  font-size: 12px;
}

/******************************************************************************
*
* 共通：規約・手順ページ（p-policyPage）2026-07-14
* キャンセル規定（page-cancellation）・予約手順（page-reservation-guide）で共用。
* 既存下層ページの言語（クリーム地・中央本文・緑40%罫線テーブル・予約CTAパネル）。
*
******************************************************************************/
.p-policyPage__body {
  padding: clamp(48px, 5vw, 88px) 24px clamp(64px, 6vw, 116px);
}
@media screen and (max-width: 767px) {
  .p-policyPage__body {
    padding: 48px 16px 64px;
  }
}
.p-policyPage__inner {
  max-width: 960px;
  margin-inline: auto;
}
.p-policyPage__lead {
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
  text-align: center;
}
.p-policyPage {
  /* ---------- テーブル（キャンセル料等・緑40%罫線） ---------- */
}
.p-policyPage__table {
  width: 100%;
  max-width: 640px;
  margin: clamp(28px, 3vw, 44px) auto 0;
  border-collapse: collapse;
}
.p-policyPage__table th,
.p-policyPage__table td {
  padding: clamp(14px, 1.4vw, 20px) clamp(14px, 1.6vw, 24px);
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.5;
  letter-spacing: 0.05em;
  text-align: left;
  vertical-align: middle;
}
.p-policyPage__table thead th {
  font-weight: 700;
  color: #FFFFFF;
  background-color: #8B6B4E;
  border-bottom: none;
}
.p-policyPage__table tbody th {
  font-weight: 700;
  color: #2B2B2B;
  width: 62%;
}
.p-policyPage__table tbody td {
  font-weight: 700;
  color: #8B6B4E;
  white-space: nowrap;
}
.p-policyPage__table tbody tr:last-child th,
.p-policyPage__table tbody tr:last-child td {
  border-bottom: none;
}
.p-policyPage {
  /* ---------- 手順ステップ（予約手順） ---------- */
}
.p-policyPage__steps {
  list-style: none;
  max-width: 720px;
  margin: clamp(32px, 3.4vw, 52px) auto 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(16px, 1.8vw, 24px);
}
.p-policyPage__step {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: clamp(14px, 1.6vw, 22px);
  align-items: start;
  padding: clamp(18px, 1.8vw, 26px) clamp(20px, 2.2vw, 30px);
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.4);
  border-radius: 16px;
}
.p-policyPage__stepNo {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background-color: #8B6B4E;
  color: #FFFFFF;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.02em;
}
.p-policyPage__stepTitle {
  font-weight: 700;
  font-size: clamp(16px, 1.15vw, 19px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-policyPage__stepText {
  margin-top: 6px;
  font-size: clamp(13px, 0.9vw, 14px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.85);
}
.p-policyPage {
  /* ---------- 予約画面スクショ ---------- */
}
.p-policyPage__shot {
  margin: clamp(28px, 3vw, 44px) auto 0;
  max-width: 760px;
  text-align: center;
}
.p-policyPage__shot img {
  width: 100%;
  height: auto;
  border-radius: 12px;
}
.p-policyPage__shot--framed img {
  border: 1px solid rgba(126, 155, 122, 0.4);
}
.p-policyPage__shotCap {
  margin-top: 10px;
  font-size: clamp(11px, 0.8vw, 13px);
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.6);
}
.p-policyPage__cta {
  display: flex;
  justify-content: center;
  margin-top: clamp(28px, 3vw, 44px);
}
.p-policyPage__note {
  margin-top: clamp(20px, 2vw, 30px);
  font-size: clamp(12px, 0.85vw, 13px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.66);
  text-align: center;
}
.p-policyPage {
  /* WP本文（プライバシーポリシー等の長文＝the_content）2026-07-15 */
}
.p-policyPage__prose {
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-policyPage__prose h2 {
  margin-top: clamp(28px, 3vw, 44px);
  margin-bottom: 12px;
  font-size: clamp(18px, 1.5vw, 22px);
  font-weight: 700;
  color: #8B6B4E;
}
.p-policyPage__prose h2:first-child {
  margin-top: 0;
}
.p-policyPage__prose h3 {
  margin-top: clamp(20px, 2vw, 30px);
  margin-bottom: 10px;
  font-size: clamp(16px, 1.2vw, 18px);
  font-weight: 700;
  color: #8B6B4E;
}
.p-policyPage__prose p {
  margin-top: 12px;
}
.p-policyPage__prose ul,
.p-policyPage__prose ol {
  margin-top: 12px;
  padding-left: 1.4em;
}
.p-policyPage__prose li {
  margin-top: 6px;
}
.p-policyPage__prose a {
  color: #7E9B7A;
  text-decoration: underline;
}
.p-policyPage__prose strong {
  font-weight: 700;
}

/******************************************************************************
*
* ゲストインタビュー個別ページ（p-interviewPage）2026-07-15
* TOP interview セクションのリンク先。常連ゲスト・ジョセフさんのインタビュー。
* 既存下層ページの言語（クリーム地・中央本文・予約CTAパネル）に、
* インタビュー用のリード（写真＋導入）とQ&Aブロックを追加。
*
******************************************************************************/
.p-interviewPage {
  /* ---------- §1 リード（写真＋導入文） ---------- */
}
.p-interviewPage__intro {
  padding: clamp(40px, 4.5vw, 80px) 24px clamp(24px, 3vw, 40px);
}
@media screen and (max-width: 767px) {
  .p-interviewPage__intro {
    padding: 36px 16px 24px;
  }
}
.p-interviewPage__introInner {
  max-width: 960px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(24px, 3vw, 48px);
  align-items: center;
}
@media screen and (max-width: 767px) {
  .p-interviewPage__introInner {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
.p-interviewPage__photo {
  margin: 0;
  aspect-ratio: 4/5;
  border-radius: 20px;
  overflow: hidden;
  background-color: #D9D9D9;
}
.p-interviewPage__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media screen and (max-width: 767px) {
  .p-interviewPage__photo {
    aspect-ratio: 4/3;
    border-radius: 16px;
  }
}
.p-interviewPage__label {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(13px, 1vw, 15px);
  letter-spacing: 0.14em;
  color: #7E9B7A;
}
.p-interviewPage__lead {
  margin-top: 16px;
}
.p-interviewPage {
  /* リード見出し＝ブラウン（見出し標準色・2026-07-15 Sone指示） */
}
.p-interviewPage__leadTitle {
  display: block;
  font-weight: 700;
  font-size: clamp(20px, 1.9vw, 30px);
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-interviewPage {
  /* リード説明＝テキスト色 */
}
.p-interviewPage__leadSub {
  display: block;
  margin-top: clamp(12px, 1.4vw, 18px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-interviewPage__attribution {
  margin-top: clamp(28px, 3.4vw, 48px);
  font-size: clamp(14px, 0.85vw, 16px);
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.75);
}
.p-interviewPage {
  /* ---------- §2 Q&A ---------- */
}
.p-interviewPage__body {
  padding: clamp(8px, 1.5vw, 24px) 24px clamp(64px, 6vw, 116px);
}
@media screen and (max-width: 767px) {
  .p-interviewPage__body {
    padding: 8px 16px 64px;
  }
}
.p-interviewPage__inner {
  max-width: 760px;
  margin-inline: auto;
}
.p-interviewPage__qaList {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(28px, 3.4vw, 52px);
}
.p-interviewPage__qa {
  padding-bottom: clamp(28px, 3.4vw, 52px);
  border-bottom: 1px solid rgba(126, 155, 122, 0.4);
}
.p-interviewPage__qa:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.p-interviewPage__q {
  margin: 0;
}
.p-interviewPage__qText {
  font-weight: 700;
  font-size: clamp(17px, 1.4vw, 22px);
  line-height: 1.55;
  letter-spacing: 0.05em;
  color: #8B6B4E;
}
.p-interviewPage {
  /* 回答＝吹き出し（アバター＋バブル）＝インタビュー感 */
}
.p-interviewPage__answer {
  margin-top: 14px;
  display: flex;
  align-items: flex-start;
  gap: 14px;
}
@media screen and (max-width: 767px) {
  .p-interviewPage__answer {
    gap: 10px;
  }
}
.p-interviewPage__avatar {
  flex-shrink: 0;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  overflow: hidden;
  background-color: #D9D9D9;
}
.p-interviewPage__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media screen and (max-width: 767px) {
  .p-interviewPage__avatar {
    width: 46px;
    height: 46px;
  }
}
.p-interviewPage__bubble {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
  background-color: #FFFFFF;
  border: 1px solid rgba(126, 155, 122, 0.18);
  border-radius: 18px;
  padding: clamp(16px, 1.6vw, 22px) clamp(18px, 1.8vw, 26px);
  /* 左向きのしっぽ（枠線つき）＝枠色の三角(::before)＋白い三角(::after) */
}
.p-interviewPage__bubble::before, .p-interviewPage__bubble::after {
  content: "";
  position: absolute;
  top: 20px;
  border-style: solid;
  border-color: transparent;
}
.p-interviewPage__bubble::before {
  left: -10px;
  border-width: 9px 11px 9px 0;
  border-right-color: rgba(126, 155, 122, 0.18);
}
.p-interviewPage__bubble::after {
  left: -9px;
  border-width: 8px 10px 8px 0;
  border-right-color: #FFFFFF;
}
@media screen and (max-width: 767px) {
  .p-interviewPage__bubble {
    border-radius: 16px;
  }
  .p-interviewPage__bubble::before {
    top: 15px;
    border-width: 8px 10px 8px 0;
  }
  .p-interviewPage__bubble::after {
    top: 16px;
    border-width: 7px 9px 7px 0;
  }
}
.p-interviewPage__a {
  margin: 0;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 2;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
@media screen and (max-width: 767px) {
  .p-interviewPage__a {
    line-height: 1.95;
  }
}
.p-interviewPage {
  /* ---------- 締めの語り（編集後記） ---------- */
}
.p-interviewPage__closing {
  margin: clamp(32px, 3.6vw, 56px) auto 0;
  max-width: 620px;
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 2;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.9);
  text-align: center;
}
.p-interviewPage__note {
  margin-top: clamp(20px, 2vw, 30px);
  font-size: clamp(12px, 0.85vw, 13px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: rgba(43, 43, 43, 0.6);
  text-align: center;
}

/******************************************************************************
*
* 共通：予約CTA（p-footerCta）template-parts/common/footer-cta.php
* 2026-07-15 Sone指示：各下層ページの「クリーム地＋角丸ピーチパネル＋2ボタン」型を
* 共通化し、全ページのフッター直上に一体表示。見出し＝ご予約。
* クリーム地なのでフッター（クリーム）と地続き＝一体化。
*
******************************************************************************/
.p-footerCta {
  padding: clamp(48px, 5vw, 88px) 24px clamp(40px, 4vw, 64px);
}
@media screen and (max-width: 767px) {
  .p-footerCta {
    padding: 48px 16px 48px;
  }
}
.p-footerCta__inner {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(40px, 4vw, 72px) clamp(24px, 3vw, 56px);
  background-color: #F5E3CB;
  border-radius: 20px;
  text-align: center;
}
.p-footerCta__text {
  margin-top: clamp(12px, 1.4vw, 18px);
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #2B2B2B;
}
.p-footerCta__buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(12px, 1.6vw, 20px);
  margin-top: clamp(20px, 2.2vw, 32px);
}

/* =============================================================
   p-error404 — 404エラーページ本文（クリーム地）2026-07-15
   ページヘッダー（ピーチ帯＋波）はcommon/page-headerを流用。
   ============================================================= */
.p-error404__body {
  background-color: #F6F1E7;
  padding: clamp(40px, 6vw, 88px) 16px clamp(56px, 7vw, 104px);
}
.p-error404__inner {
  max-width: 960px;
  margin-inline: auto;
  text-align: center;
}
.p-error404__text {
  font-size: clamp(14px, 0.85vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #000000;
}
.p-error404__actions {
  margin-top: clamp(28px, 3vw, 44px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}