/* ============================================================
   和心〜なごみ〜 デザインページ用CSS（テンプレート page-nagomi.php で読み込み）
   ・全セレクタを .ngm 配下に限定し、Cocoon の通常ページには影響させない
   ・Cocoon と衝突するクラス（header/footer/btn/wrap/nav/info/form/cta）は ngm- 接頭辞
   ・元ファイル: nagomi-redesign/assets/style.css（こちらが原本。直すときは原本を直して再生成）
   ============================================================ */
body.ngm-page{margin:0;background:var(--kinari);}
.ngm{display:block;}
.admin-bar .ngm .ngm-header{top:32px;}
@media (max-width:782px){.admin-bar .ngm .ngm-header{top:46px;}}

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&family=Noto+Serif+JP:wght@600;700&display=swap');
/* ============================================================
   和心〜なごみ〜  リデザイン案 A：和モダン・上質
   ============================================================ */

/* --- 1. デザイントークン ------------------------------------ */
:root{
  --kinari:      #f7eee0;   /* 生成り：ベース背景（温かみを足した生成り） */
  --kinari-deep: #eee1ca;   /* 生成り濃：セクション交互 */
  --washi:       #fffaf1;   /* 和紙白：カード面 */
  --sumi:        #211a13;   /* 墨：見出し（対 生成り 14.6:1／茶を含ませて背景と馴染ませる） */
  --sumi-body:   #3f362b;   /* 墨淡：本文（同 9.9:1） */
  --sumi-mute:   #64594a;   /* 補足文（同 5.9:1） */
  --ai:          #1a3549;   /* 藍：主色（わずかに温かい藍） */
  --ai-deep:     #12262f;   /* 深藍 */
  --ai-pale:     #e8eef0;   /* 藍のごく淡い面 */
  --kincha:      #b0854a;   /* 金茶：罫・装飾のみ（文字には使わない） */
  --kincha-text: #7a5522;   /* 金茶（文字用／同 5.2:1） */
  --kincha-pale: #dcc7a4;
  --shu:         #ab4326;   /* 朱：CTA・強調 */
  --shu-deep:    #8d3319;

  --serif: "Noto Serif JP","Hiragino Mincho ProN","ヒラギノ明朝 ProN W6","Yu Mincho","YuMincho",serif;
  --sans:  "Noto Sans JP","Hiragino Sans","ヒラギノ角ゴシック","Hiragino Kaku Gothic ProN","Yu Gothic","YuGothic","Meiryo",sans-serif;

  --wrap: 1120px;
  --r: 4px;
  --shadow: 0 2px 4px rgba(36,31,28,.04), 0 12px 32px -12px rgba(36,31,28,.14);
}

/* --- 2. リセット・基本 -------------------------------------- */
.ngm *,.ngm *::before,.ngm *::after{box-sizing:border-box;}
/* 画面外に待機させたスマホメニューが横スクロールを生まないよう、横方向のはみ出しは切る
   （clip は hidden と違い position:sticky を壊さない） */
html,body{overflow-x:clip;}
html{scroll-behavior:auto;} /* ページ内リンクは nagomi.js がゆっくり→加速で動かす */
.ngm{
  margin:0; background:var(--kinari); color:var(--sumi-body);
  font-family:var(--sans);
  font-size:clamp(15.5px,1.05vw + 12px,17.5px);
  line-height:2.0;
  letter-spacing:.04em;
  font-weight:500;
  font-feature-settings:"palt" 1;
  -webkit-font-smoothing:antialiased;
  text-underline-offset:.25em;
}
.ngm img{max-width:100%;height:auto;display:block;}
.ngm a{color:var(--ai);text-decoration-color:var(--kincha-pale);text-decoration-thickness:1px;}
.ngm a:hover{color:var(--shu);}
.ngm h1,.ngm h2,.ngm h3,.ngm h4{font-family:var(--serif);color:var(--sumi);font-weight:700;line-height:1.55;letter-spacing:.06em;margin:0;}
.ngm p{margin:0 0 1.2em;}
.ngm ul{margin:0;padding:0;list-style:none;}

.ngm .ngm-wrap{width:min(100% - 2.6rem, var(--wrap));margin-inline:auto;}
.ngm .ngm-wrap--narrow{width:min(100% - 2.6rem, 860px);margin-inline:auto;}

.ngm section{padding:clamp(3.6rem,7vw,6.4rem) 0;}
.ngm .band-kinari-deep{background:var(--kinari-deep);}
.ngm .band-washi{background:var(--washi);}

/* 和柄（青海波）のごく薄い地紋 */
.ngm .seigaiha{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='56' height='28'><g fill='none' stroke='%23b08d57' stroke-width='1' opacity='.07'><path d='M0 28a14 14 0 0 1 28 0a14 14 0 0 1 28 0'/><path d='M0 28a21 21 0 0 1 28 0a21 21 0 0 1 28 0'/></g></svg>");
  background-size:40px 20px;
}

/* --- 3. 見出し部品 ------------------------------------------ */
.ngm .eyebrow{
  font-family:var(--sans);font-size:.76rem;letter-spacing:.28em;
  color:var(--kincha-text);font-weight:700;margin:0 0 .9rem;text-transform:uppercase;
}
.ngm .sec-title{
  font-size:clamp(1.55rem,3.1vw,2.3rem);margin-bottom:.55em;
}
.ngm .sec-title::after{
  content:"";display:block;width:2.6rem;height:1px;background:var(--kincha);
  margin-top:.85rem;
}
.ngm .sec-title--center{text-align:center;}
.ngm .sec-title--center::after{margin-inline:auto;}
.ngm .sec-lead{max-width:42em;color:var(--sumi-body);}
.ngm .center{text-align:center;}

/* --- 4. ボタン ---------------------------------------------- */
.ngm .ngm-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55em;
  padding:1.05em 2.1em;border-radius:var(--r);
  font-family:var(--sans);font-size:1rem;font-weight:700;letter-spacing:.09em;
  line-height:1.4;text-decoration:none;border:1px solid transparent;white-space:nowrap;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ngm .ngm-btn:hover{transform:translateY(-2px);}
.ngm .ngm-btn--primary{background:var(--shu);color:#fff;box-shadow:0 8px 20px -8px rgba(176,71,47,.6);}
.ngm .ngm-btn--primary:hover{background:var(--shu-deep);color:#fff;}
.ngm .ngm-btn--tel{background:var(--ai);color:#fff;box-shadow:0 8px 20px -8px rgba(27,59,86,.55);}
.ngm .ngm-btn--tel:hover{background:var(--ai-deep);color:#fff;}
.ngm .ngm-btn--ghost{background:transparent;color:var(--ai);border-color:var(--kincha-text);}
.ngm .ngm-btn--ghost:hover{background:var(--ai);color:#fff;border-color:var(--ai);}
.ngm .ngm-btn__sub{display:block;font-size:.7rem;font-weight:500;letter-spacing:.14em;opacity:.85;}

/* --- 5. ヘッダー -------------------------------------------- */
.ngm .topbar{
  background:var(--ai-deep);color:#e8e1d5;font-size:.78rem;letter-spacing:.1em;
  padding:.45rem 0;
}
.ngm .topbar .ngm-wrap{display:flex;justify-content:space-between;align-items:center;gap:1rem;}
.ngm .topbar a{color:#e8e1d5;text-decoration:none;}
.ngm .topbar__addr{opacity:.8;}

.ngm .ngm-header{
  position:sticky;top:0;z-index:60;background:rgba(247,238,224,.96);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--kincha-pale);
}
.ngm .ngm-header__inner{display:flex;align-items:center;gap:1.5rem;padding:.85rem 0;}
/* 店名は2段のロゴ組みにして、屋号そのものを大きく見せる */
.ngm .brand{display:flex;flex-direction:column;gap:.2rem;text-decoration:none;flex:0 0 auto;}
.ngm .brand__mark{
  font-family:var(--serif);font-size:clamp(1.6rem,2.4vw,2.15rem);color:var(--ai);
  letter-spacing:.12em;font-weight:600;white-space:nowrap;line-height:1.2;
}
.ngm .brand__sub{
  font-size:clamp(.68rem,.9vw,.78rem);letter-spacing:.2em;color:var(--sumi-mute);
  white-space:nowrap;
}
.ngm .brand__sub em{font-style:normal;color:var(--kincha-text);font-weight:700;}
.ngm .ngm-nav{margin-left:auto;display:flex;align-items:center;gap:clamp(.9rem,1.5vw,1.55rem);}
.ngm .ngm-nav a{
  font-size:.88rem;font-weight:600;letter-spacing:.09em;color:var(--sumi-body);text-decoration:none;
  position:relative;padding-bottom:.2rem;white-space:nowrap;
}
.ngm .ngm-nav a::after{
  content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;
  background:var(--kincha);transition:right .25s ease;
}
.ngm .ngm-nav a:hover{color:var(--ai);}
.ngm .ngm-nav a:hover::after{right:0;}
.ngm .ngm-header .ngm-btn{padding:.75em 1.4em;font-size:.85rem;}
.ngm .ngm-nav-toggle,.ngm .ngm-nav-toggle-label{display:none;}

/* --- 6. ヒーロー -------------------------------------------- */
.ngm .hero{position:relative;overflow:hidden;padding:clamp(3rem,6vw,5.5rem) 0 clamp(3.4rem,7vw,6rem);}
.ngm .hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;}
.ngm .hero__badge{
  display:inline-block;border:1px solid var(--kincha);color:var(--kincha-text);
  font-size:.74rem;letter-spacing:.16em;padding:.42em 1.05em;border-radius:999px;
  margin-bottom:1.5rem;background:rgba(255,253,249,.7);
}
.ngm .hero__badge small{color:var(--sumi-mute);letter-spacing:.06em;}
.ngm .hero h1{
  font-size:clamp(1.85rem,4vw,2.8rem);line-height:1.5;letter-spacing:.05em;
  margin-bottom:1.1rem;
}
/* 3行目「ご家族の方へ」は一段小さくして、呼びかけとして読ませる */
.ngm .hero h1 .accent{
  display:inline-block;font-size:.7em;margin-top:.45em;letter-spacing:.08em;
  background:linear-gradient(transparent 68%, var(--kincha-pale) 68%);
}
.ngm .hero__lead{font-size:1.02rem;max-width:26em;margin-bottom:2rem;}
.ngm .hero__name{
  font-family:var(--serif);font-size:1.02rem;letter-spacing:.12em;color:var(--ai);
  margin-bottom:.4rem;
}
.ngm .hero__cta{display:flex;flex-wrap:wrap;gap:.9rem;margin-bottom:1.5rem;}
.ngm .hero__note{font-size:.85rem;color:var(--sumi-mute);letter-spacing:.06em;margin:0;}
.ngm .hero__badge em{
  font-style:normal;font-family:var(--serif);font-size:1.35em;font-weight:600;
  color:var(--ai);letter-spacing:.02em;margin:0 .12em;
}
/* 開業年からの歩みを、最初の画面のうちに伝える */
.ngm .hero__since{
  border-left:3px solid var(--kincha);padding-left:1.15rem;margin:0 0 1.9rem;
  font-size:.93rem;line-height:1.9;
}
.ngm .hero__since b{
  display:block;font-family:var(--serif);font-weight:600;font-size:1.1rem;
  color:var(--ai);line-height:1.7;margin-bottom:.35rem;
}
.ngm .hero__since small{display:block;margin-top:.5rem;font-size:.74rem;color:var(--sumi-mute);line-height:1.75;}

/* 実績帯 */
.ngm .record{
  background:var(--washi);border-top:1px solid var(--kincha-pale);
  border-bottom:1px solid var(--kincha-pale);padding:clamp(2.2rem,4vw,3rem) 0;
}
.ngm .record__grid{display:grid;grid-template-columns:repeat(3,1fr);}
.ngm .record__item{padding:0 clamp(1rem,2.6vw,2.4rem);border-left:1px solid var(--kincha-pale);text-align:center;}
.ngm .record__item:first-child{border-left:0;}
.ngm .record__label{
  font-size:.72rem;letter-spacing:.26em;color:var(--kincha-text);font-weight:700;
  margin:0 0 .8rem;
}
.ngm .record__value{
  font-family:var(--serif);font-size:clamp(1.7rem,3.4vw,2.45rem);color:var(--ai-deep);
  line-height:1.35;letter-spacing:.04em;margin:0;
}
.ngm .record__value small{font-size:.46em;letter-spacing:.1em;margin-left:.15em;}
.ngm .record__value .hatsu{color:var(--shu);font-size:.78em;margin-left:.18em;}
.ngm .record__note{font-size:.78rem;color:var(--sumi-mute);line-height:1.8;margin:.75rem 0 0;}

/* 額装：和紙色のマット＋細い罫で写真を受ける（ズレた二重枠はやめて素直に） */
.ngm .frame{
  background:var(--washi);padding:.9rem;border:1px solid var(--kincha-pale);
  box-shadow:var(--shadow);
}
.ngm .frame img{width:100%;}
.ngm .frame figcaption{
  margin:1.1rem .3rem .2rem;font-family:var(--serif);
  font-size:.92rem;color:var(--sumi-body);line-height:1.9;
}

/* --- 7. お悩み ---------------------------------------------- */
.ngm .nayami__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,4vw,3.5rem);align-items:start;}
.ngm .checklist{display:grid;gap:.7rem;margin:0 0 1.8rem;}
.ngm .checklist li{
  background:var(--washi);border:1px solid var(--kincha-pale);border-left:3px solid var(--kincha);
  padding:1em 1.3em;font-size:.98rem;line-height:1.8;
  display:flex;gap:.8em;align-items:flex-start;
}
.ngm .checklist li::before{
  content:"✓";color:var(--shu);font-weight:700;flex:0 0 auto;line-height:1.8;
}
.ngm .nayami__close{
  font-family:var(--serif);font-size:1.12rem;color:var(--sumi);
  border-top:1px solid var(--kincha-pale);padding-top:1.5rem;margin:0;
}
.ngm .nayami__photo{position:sticky;top:6.5rem;}
@media (max-width:980px){.ngm .nayami__photo{position:static;}}

/* --- 8. 自費リハビリとは ------------------------------------ */
.ngm .compare{
  width:100%;border-collapse:collapse;margin:2.2rem 0 1.2rem;
  font-size:.95rem;background:var(--washi);box-shadow:var(--shadow);
}
.ngm .compare th,.ngm .compare td{padding:1.05em 1.2em;text-align:left;vertical-align:top;border-bottom:1px solid var(--kincha-pale);}
.ngm .compare thead th{
  font-family:var(--sans);font-size:.82rem;letter-spacing:.14em;font-weight:700;
  background:var(--ai-pale);color:var(--ai-deep);border-bottom:1px solid var(--kincha-pale);
}
.ngm .compare thead th:last-child{background:var(--ai);color:#fff;}
.ngm .compare tbody th{
  font-family:var(--sans);font-weight:700;font-size:.88rem;color:var(--sumi);
  width:6.5em;line-height:1.5;
}
.ngm .compare td:last-child{color:var(--ai-deep);font-weight:600;background:rgba(234,240,244,.4);}
.ngm .tbl-scroll{overflow-x:auto;}
.ngm .what__quote{
  font-family:var(--serif);font-size:clamp(1.15rem,2.4vw,1.5rem);color:var(--ai);
  text-align:center;margin:3rem 0 0;line-height:1.9;
}
.ngm .what__photo{margin:2.8rem auto 0;max-width:760px;}

/* --- 9. 選ばれる理由 ---------------------------------------- */
.ngm .reasons{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:1.6rem;margin-top:2.8rem;}
.ngm .reason{
  background:var(--washi);border:1px solid var(--kincha-pale);padding:2rem 1.7rem;
  position:relative;box-shadow:var(--shadow);
}
.ngm .reason__no{
  font-family:var(--serif);font-size:.8rem;letter-spacing:.2em;color:var(--kincha-text);
  display:block;margin-bottom:.9rem;
}
/* ご家族からの質問 → 答え、の順で読ませる */
.ngm .reason__q{
  font-size:.92rem;color:var(--sumi-mute);margin:0 0 .5rem;line-height:1.7;
  padding-left:1.1em;position:relative;
}
.ngm .reason__q::before{content:"Q.";position:absolute;left:0;color:var(--kincha-text);font-weight:700;font-family:var(--serif);}
.ngm .reason h3{font-size:1.14rem;margin-bottom:.7rem;line-height:1.65;}
.ngm .reason p{font-size:.92rem;line-height:1.9;margin:0;color:var(--sumi-body);}
.ngm .reason__img{margin:-2rem -1.7rem 1.4rem;}
.ngm .reason__img img{width:100%;aspect-ratio:16/9;object-fit:cover;}
.ngm .quals{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1.1rem;}
.ngm .quals li{
  font-size:.76rem;letter-spacing:.06em;border:1px solid var(--kincha-pale);
  background:var(--kinari);color:var(--sumi-body);padding:.35em .8em;border-radius:999px;
}

/* --- 10. 事例 ------------------------------------------------ */
.ngm .cases{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:1.6rem;margin-top:2.8rem;}
.ngm .case{
  background:var(--washi);border:1px solid var(--kincha-pale);text-decoration:none;
  display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease;
  box-shadow:0 1px 2px rgba(36,31,28,.04);
}
.ngm .case:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.ngm .case__img{overflow:hidden;background:var(--kinari-deep);}
.ngm .case__img img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .5s ease;}
.ngm .case:hover .case__img img{transform:scale(1.04);}
.ngm .case__body{padding:1.3rem 1.4rem 1.5rem;display:flex;flex-direction:column;gap:.7rem;flex:1;}
.ngm .case__text{
  font-family:var(--serif);font-size:1.02rem;line-height:1.8;color:var(--sumi);margin:0;flex:1;
}
.ngm .case__more{
  font-size:.76rem;letter-spacing:.14em;color:var(--kincha-text);font-weight:700;
}
.ngm .disclaimer{
  margin-top:2.4rem;font-size:.85rem;color:var(--sumi-mute);line-height:1.9;
  border-top:1px solid var(--kincha-pale);padding-top:1.4rem;
}

/* --- 11. 料金 ------------------------------------------------ */
.ngm .price-cards{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem;margin-top:2.8rem;}
.ngm .price{background:var(--washi);border:1px solid var(--kincha-pale);box-shadow:var(--shadow);}
.ngm .price__head{
  background:var(--ai);color:#fff;padding:1.1rem 1.6rem;font-family:var(--serif);
  font-size:1.15rem;letter-spacing:.14em;
}
.ngm .price__head span{font-family:var(--sans);font-size:.74rem;letter-spacing:.12em;opacity:.8;display:block;margin-top:.2rem;}
.ngm .price__body{padding:1.7rem 1.6rem;}
.ngm .price__row{
  display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  padding:.95rem 0;border-bottom:1px dashed var(--kincha-pale);
}
.ngm .price__row:last-of-type{border-bottom:0;}
.ngm .price__label{font-size:.93rem;color:var(--sumi-body);}
.ngm .price__label b{display:block;font-family:var(--serif);font-size:1.02rem;color:var(--sumi);font-weight:600;}
.ngm .price__yen{font-family:var(--serif);font-size:1.55rem;color:var(--ai-deep);white-space:nowrap;letter-spacing:.02em;}
.ngm .price__yen small{font-size:.62rem;letter-spacing:.08em;color:var(--sumi-mute);margin-left:.3em;font-family:var(--sans);}
.ngm .price__first{background:var(--ai-pale);margin:-1.7rem -1.6rem 1.2rem;padding:1.4rem 1.6rem;border-bottom:1px solid var(--kincha-pale);}
.ngm .price__first .price__row{border:0;padding:0;}
.ngm .price__first .price__yen{color:var(--shu);font-size:1.85rem;}
.ngm .price__tag{
  display:inline-block;background:var(--shu);color:#fff;font-size:.68rem;font-weight:700;
  letter-spacing:.14em;padding:.28em .8em;border-radius:2px;margin-bottom:.6rem;
}
.ngm .price__addon{font-size:.85rem;color:var(--shu);margin-top:1rem;}
.ngm .notes{margin-top:2.2rem;display:grid;gap:.55rem;font-size:.88rem;color:var(--sumi-mute);line-height:1.85;}
.ngm .notes li{padding-left:1.15em;position:relative;}
.ngm .notes li::before{content:"※";position:absolute;left:0;color:var(--kincha-text);}
.ngm .price__pitch{
  font-family:var(--serif);font-size:1.08rem;color:var(--sumi);text-align:center;
  margin:2.6rem auto 0;max-width:34em;line-height:1.95;
}

/* --- 12. 初回の流れ ------------------------------------------ */
.ngm .flow{margin-top:2.8rem;display:grid;gap:0;counter-reset:step;}
.ngm .flow li{
  display:grid;grid-template-columns:5.5rem 1fr;gap:1.6rem;align-items:start;
  padding:1.7rem 0;border-bottom:1px solid var(--kincha-pale);position:relative;
}
.ngm .flow li:first-child{border-top:1px solid var(--kincha-pale);}
.ngm .flow__no{
  font-family:var(--serif);font-size:2rem;color:var(--kincha-text);line-height:1;
  letter-spacing:.04em;
}
.ngm .flow h3{font-size:1.14rem;margin-bottom:.45rem;}
.ngm .flow p{font-size:.94rem;margin:0;color:var(--sumi-body);}

/* --- 13. 担当者 ---------------------------------------------- */
.ngm .profile{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,5vw,4rem);align-items:center;}
.ngm .profile__quote{
  font-family:var(--serif);font-size:clamp(1.15rem,2.5vw,1.55rem);color:var(--ai);
  line-height:1.85;margin:0 0 1.6rem;position:relative;padding-left:1.4rem;
  border-left:3px solid var(--kincha);
}
.ngm .profile__quote cite{display:block;font-style:normal;font-family:var(--sans);font-size:.8rem;letter-spacing:.1em;color:var(--sumi-mute);margin:0 0 .6rem;}
.ngm .profile__name{font-family:var(--serif);font-size:1.2rem;letter-spacing:.1em;margin-bottom:1.2rem;}
.ngm .profile__name small{display:block;font-family:var(--sans);font-size:.74rem;letter-spacing:.16em;color:var(--kincha-text);margin-bottom:.3rem;}

/* --- 14. 医療・介護従事者の方へ ------------------------------ */
.ngm .pro{background:var(--tint-ai);color:var(--sumi);border-top:1px solid rgba(29,63,80,.12);border-bottom:1px solid rgba(29,63,80,.12);}
.ngm .pro h2,.ngm .pro h3{color:var(--sumi);}
.ngm .pro .sec-title::after{background:var(--kincha);}
.ngm .pro .eyebrow{color:var(--kincha-text);}
.ngm .pro__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,4vw,3.5rem);align-items:center;}
.ngm .pro p{color:var(--sumi-body);}
.ngm .pro__list{display:grid;gap:.7rem;margin:1.6rem 0 2rem;}
.ngm .pro__list li{padding-left:1.4em;position:relative;font-size:.95rem;color:var(--sumi-body);}
.ngm .pro__list li::before{content:"—";position:absolute;left:0;color:var(--kincha);}
/* 横長すぎる写真は帯にならないよう、比率を決めて中央を切り出す */
.ngm .pro__photo img{aspect-ratio:5/4;object-fit:cover;object-position:50% 45%;}
.ngm .pro__photo figcaption{color:var(--sumi-body);}
.ngm .pro__btns{display:flex;flex-direction:column;align-items:flex-start;gap:.7rem;}
/* 支援員・相談員様へ：イラストと訪問写真を同じ大きさ（3:2）で横並び */
.ngm .pro__pics{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;align-self:center;}
.ngm .pro__pics .frame{margin:0;}
.ngm .pro__pics img{aspect-ratio:3/2;object-fit:cover;width:100%;display:block;}
.ngm .pro__pics .pro__pics-day{object-position:50% 48%;}
.ngm .pro .ngm-btn--ghost{background:var(--washi);}

/* --- 15. アクセス -------------------------------------------- */
.ngm .access__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,4vw,3.5rem);align-items:start;}
.ngm .ngm-info{border-top:1px solid var(--kincha-pale);}
.ngm .ngm-info div{
  display:grid;grid-template-columns:6.5rem 1fr;gap:1.2rem;
  padding:1.15rem 0;border-bottom:1px solid var(--kincha-pale);font-size:.95rem;
}
.ngm .ngm-info dt{font-family:var(--sans);font-weight:700;font-size:.82rem;letter-spacing:.14em;color:var(--kincha-text);padding-top:.25em;}
.ngm .ngm-info dd{margin:0;line-height:1.85;}
.ngm .ngm-info dd b{font-family:var(--serif);font-size:1.35rem;letter-spacing:.04em;color:var(--ai-deep);}
.ngm .map-slot{
  aspect-ratio:16/10;border:1px dashed var(--kincha);background:var(--kinari-deep);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;
  color:var(--kincha-text);font-size:.86rem;letter-spacing:.14em;text-align:center;padding:1rem;
}
.ngm .map-slot small{color:var(--sumi-mute);letter-spacing:.06em;font-size:.8rem;}
.ngm .todo{
  display:inline-block;border:1px dashed var(--shu);color:var(--shu);
  font-size:.74rem;letter-spacing:.1em;padding:.2em .7em;border-radius:2px;
}

/* --- 16. 最終CTA ---------------------------------------------- */
.ngm .ngm-cta{background:var(--kinari-deep);text-align:center;}
.ngm .ngm-cta h2{font-size:clamp(1.5rem,3.2vw,2.15rem);margin-bottom:1rem;}
.ngm .ngm-cta p{max-width:34em;margin-inline:auto;}
.ngm .ngm-cta__buttons{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-top:2.2rem;}
.ngm .ngm-cta__tel{
  font-family:var(--serif);font-size:clamp(1.9rem,4.5vw,2.7rem);color:var(--ai-deep);
  letter-spacing:.06em;text-decoration:none;display:inline-block;margin-top:.4rem;
}
.ngm .ngm-cta__tel:hover{color:var(--shu);}

/* --- 17. フッター -------------------------------------------- */
.ngm .ngm-footer{background:var(--ai-deep);color:rgba(232,225,213,.75);padding:3.6rem 0 6.5rem;font-size:.86rem;}
.ngm .ngm-footer__grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:2.5rem;}
.ngm .ngm-footer h3{color:#fff;font-size:1.25rem;letter-spacing:.14em;margin-bottom:.6rem;}
.ngm .ngm-footer h4{color:var(--kincha-pale);font-family:var(--sans);font-size:.76rem;letter-spacing:.18em;margin-bottom:1rem;}
.ngm .ngm-footer a{color:rgba(232,225,213,.75);text-decoration:none;}
.ngm .ngm-footer a:hover{color:#fff;}
.ngm .ngm-footer ul{display:grid;gap:.6rem;}
.ngm .ngm-footer__note{
  margin-top:3rem;padding-top:1.6rem;border-top:1px solid rgba(232,225,213,.15);
  font-size:.78rem;line-height:1.9;opacity:.7;
}
.ngm .ngm-footer__copy{margin-top:1.4rem;font-size:.76rem;letter-spacing:.08em;opacity:.55;}

/* --- 18. スマホ固定CTA ---------------------------------------- */
.ngm .mobile-cta{display:none;}

/* --- 19. レスポンシブ ----------------------------------------- */
@media (max-width:980px){
  .ngm .hero__grid,.ngm .nayami__grid,.ngm .access__grid,.ngm .profile,.ngm .pro__grid{grid-template-columns:1fr;}
  .ngm .price-cards{grid-template-columns:1fr;}
  .ngm .hero__grid{gap:2.8rem;}
  .ngm .frame::before{inset:10px -10px -10px 10px;}
  .ngm .profile{gap:2rem;}
  .ngm .profile__photo{max-width:340px;}
}
@media (max-width:820px){
  .ngm .topbar__addr{display:none;}
  .ngm .ngm-header .ngm-btn{display:none;}
  /* backdrop-filter があると header が position:fixed の基準になり、
     メニューが header の高さに閉じ込められて途中で切れる → スマホでは外す */
  .ngm .ngm-header{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--kinari);}
  .ngm .ngm-nav{
    position:fixed;inset:0 0 0 auto;width:min(78vw,320px);background:var(--washi);
    flex-direction:column;align-items:flex-start;gap:0;padding:9rem 2rem 2rem;
    transform:translateX(100%);transition:transform .3s ease;
    box-shadow:-8px 0 40px rgba(36,31,28,.18);overflow-y:auto;
  }
  .ngm .ngm-nav a{width:100%;padding:1.1rem 0;border-bottom:1px solid var(--kincha-pale);font-size:.95rem;}
  .ngm .ngm-nav a::after{display:none;}
  .ngm .ngm-nav-toggle:checked ~ .ngm-nav{transform:translateX(0);}
  .ngm .ngm-nav-toggle-label{
    display:block;margin-left:auto;width:2.6rem;height:2.6rem;position:relative;
    cursor:pointer;z-index:70;
  }
  .ngm .ngm-nav-toggle-label span,.ngm .ngm-nav-toggle-label span::before,.ngm .ngm-nav-toggle-label span::after{
    content:"";position:absolute;left:.45rem;width:1.7rem;height:1.5px;background:var(--ai);
    transition:transform .3s ease,opacity .2s ease;
  }
  .ngm .ngm-nav-toggle-label span{top:1.28rem;}
  .ngm .ngm-nav-toggle-label span::before{top:-.5rem;left:0;}
  .ngm .ngm-nav-toggle-label span::after{top:.5rem;left:0;}
  .ngm .ngm-nav-toggle:checked ~ .ngm-nav-toggle-label span{background:transparent;}
  .ngm .ngm-nav-toggle:checked ~ .ngm-nav-toggle-label span::before{transform:translateY(.5rem) rotate(45deg);}
  .ngm .ngm-nav-toggle:checked ~ .ngm-nav-toggle-label span::after{transform:translateY(-.5rem) rotate(-45deg);}

  .ngm .record__grid{grid-template-columns:1fr;gap:1.8rem;}
  .ngm .record__item{border-left:0;border-top:1px solid var(--kincha-pale);padding:1.8rem 0 0;}
  .ngm .record__item:first-child{border-top:0;padding-top:0;}
  .ngm .flow li{grid-template-columns:3.4rem 1fr;gap:1rem;}
  .ngm .flow__no{font-size:1.5rem;}
  .ngm .ngm-footer__grid{grid-template-columns:1fr;gap:2rem;}
  .ngm .ngm-footer{padding-bottom:7rem;}

  .ngm .mobile-cta{
    display:grid;grid-template-columns:1fr 1fr;gap:1px;
    position:fixed;left:0;right:0;bottom:0;z-index:80;background:var(--kincha-pale);
    box-shadow:0 -4px 20px rgba(36,31,28,.15);
  }
  .ngm .mobile-cta a{
    display:flex;align-items:center;justify-content:center;gap:.4em;
    padding:1.05em .5em;font-size:.92rem;font-weight:700;letter-spacing:.08em;
    text-decoration:none;color:#fff;
  }
  .ngm .mobile-cta .tel{background:var(--ai);}
  .ngm .mobile-cta .ngm-form{background:var(--shu);}
}
@media (max-width:560px){
  .ngm .hero__cta .ngm-btn{width:100%;}
  .ngm .ngm-cta__buttons .ngm-btn{width:100%;}
  .ngm .brand__mark{font-size:1.42rem;}
  .ngm .brand__sub{font-size:.62rem;letter-spacing:.14em;}
  .ngm .reason__img{margin:-2rem -1.7rem 1.2rem;}
}

/* ============================================================
   20. 下層ページ用
   ============================================================ */

/* ページ見出し帯 */
.ngm .page-head{
  background:var(--kinari-deep);border-bottom:1px solid var(--kincha-pale);
  padding:clamp(2.6rem,5vw,4rem) 0 clamp(2.2rem,4vw,3rem);
}
.ngm .page-head h1{font-size:clamp(1.7rem,3.6vw,2.6rem);line-height:1.5;margin:0;}
.ngm .page-head h1::after{
  content:"";display:block;width:2.6rem;height:1px;background:var(--kincha);margin-top:1rem;
}
.ngm .page-head__lead{margin:1.5rem 0 0;max-width:44em;color:var(--sumi-body);}

/* パンくず */
.ngm .crumbs{font-size:.78rem;letter-spacing:.08em;color:var(--sumi-mute);margin:0 0 1.1rem;}
.ngm .crumbs a{color:var(--sumi-mute);text-decoration:none;}
.ngm .crumbs a:hover{color:var(--ai);}
.ngm .crumbs span{margin:0 .5em;color:var(--kincha);}

/* 記事本文 */
.ngm .prose{max-width:44em;}
.ngm .prose > h2{
  font-size:clamp(1.3rem,2.6vw,1.75rem);margin:3.2rem 0 1.2rem;
  padding-bottom:.7rem;border-bottom:1px solid var(--kincha-pale);
}
.ngm .prose > h2:first-child{margin-top:0;}
.ngm .prose > h3{font-size:1.15rem;margin:2.4rem 0 .9rem;padding-left:.8rem;border-left:3px solid var(--kincha);}
.ngm .prose p{margin:0 0 1.4em;}
.ngm .prose ul.bullets{margin:0 0 1.6em;display:grid;gap:.55rem;}
.ngm .prose ul.bullets li{padding-left:1.3em;position:relative;}
.ngm .prose ul.bullets li::before{
  content:"";position:absolute;left:.2em;top:.85em;width:.42em;height:.42em;
  background:var(--kincha);border-radius:50%;
}
.ngm .prose strong{font-weight:700;background:linear-gradient(transparent 66%, var(--kincha-pale) 66%);}
.ngm .prose figure{margin:2.2rem 0;}

/* 引用・ご感想 */
.ngm .voice{
  background:var(--washi);border:1px solid var(--kincha-pale);border-left:3px solid var(--kincha);
  padding:1.6rem 1.8rem;margin:2rem 0;font-size:.96rem;line-height:1.95;
}
.ngm .voice__who{
  display:block;font-family:var(--sans);font-size:.74rem;letter-spacing:.16em;
  color:var(--kincha-text);font-weight:700;margin-bottom:.8rem;
}
.ngm .voice p:last-child{margin-bottom:0;}

/* 会話（吹き出し） */
.ngm .talk{display:grid;gap:1.1rem;margin:2rem 0;}
.ngm .talk__row{display:flex;gap:.9rem;align-items:flex-start;}
.ngm .talk__row.is-me{flex-direction:row-reverse;}
.ngm .talk__who{
  flex:0 0 3.4rem;text-align:center;font-size:.68rem;letter-spacing:.06em;
  color:var(--sumi-mute);line-height:1.5;
}
.ngm .talk__who i{
  display:flex;align-items:center;justify-content:center;width:3.4rem;height:3.4rem;
  border-radius:50%;background:var(--kinari-deep);border:1px solid var(--kincha-pale);
  font-style:normal;font-size:1.3rem;margin-bottom:.3rem;
}
.ngm .talk__row.is-me .talk__who i{background:var(--ai-pale);border-color:#c8d5dd;}
.ngm .talk__bubble{
  position:relative;background:var(--washi);border:1px solid var(--kincha-pale);
  border-radius:10px;padding:1rem 1.3rem;font-size:.95rem;line-height:1.9;max-width:34em;
}
.ngm .talk__row.is-me .talk__bubble{background:var(--ai-pale);border-color:#c8d5dd;}

/* 手順 */
.ngm .steps{display:grid;gap:0;margin:2rem 0;counter-reset:s;}
.ngm .steps li{
  display:grid;grid-template-columns:3.2rem 1fr;gap:1.2rem;align-items:start;
  padding:1.3rem 0;border-bottom:1px solid var(--kincha-pale);
}
.ngm .steps li:first-child{border-top:1px solid var(--kincha-pale);}
.ngm .steps li::before{
  counter-increment:s;content:counter(s,decimal-leading-zero);
  font-family:var(--serif);font-size:1.4rem;color:var(--kincha-text);line-height:1.5;
}
.ngm .steps b{display:block;font-family:var(--serif);font-size:1.05rem;color:var(--sumi);margin-bottom:.2rem;}
.ngm .steps span{font-size:.93rem;}

/* 関連ページ */
.ngm .related{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.2rem;margin-top:2.4rem;}
.ngm .related a{
  background:var(--washi);border:1px solid var(--kincha-pale);padding:1.4rem 1.5rem;
  text-decoration:none;display:block;transition:transform .2s ease,box-shadow .2s ease;
}
.ngm .related a:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.ngm .related b{display:block;font-family:var(--serif);font-size:1.08rem;color:var(--sumi);margin-bottom:.4rem;}
.ngm .related span{font-size:.85rem;color:var(--sumi-mute);line-height:1.8;}
.ngm .related em{
  display:block;font-style:normal;font-size:.74rem;letter-spacing:.14em;
  color:var(--kincha-text);font-weight:700;margin-top:.7rem;
}

/* 2カラム（本文＋サイド） */
.ngm .page-grid{display:grid;grid-template-columns:1fr 300px;gap:clamp(2rem,4vw,3.5rem);align-items:start;}
.ngm .side{position:sticky;top:7.5rem;display:grid;gap:1.2rem;}
.ngm .side__card{background:var(--washi);border:1px solid var(--kincha-pale);padding:1.5rem;}
.ngm .side__card h4{font-family:var(--serif);font-size:1.05rem;margin:0 0 .8rem;}
.ngm .side__card p{font-size:.86rem;line-height:1.85;margin:0 0 1rem;color:var(--sumi-body);}
.ngm .side__tel{
  display:block;font-family:var(--serif);font-size:1.5rem;color:var(--ai-deep);
  text-decoration:none;letter-spacing:.03em;margin-bottom:.2rem;
}
.ngm .side__card .ngm-btn{width:100%;padding:.9em 1rem;font-size:.9rem;}

@media (max-width:980px){
  .ngm .page-grid{grid-template-columns:1fr;}
  .ngm .side{position:static;}
}

/* 現在地のナビ */
.ngm .ngm-nav a.is-active{color:var(--ai);font-weight:700;}
.ngm .ngm-nav a.is-active::after{right:0;}

/* お問い合わせページ */
.ngm .contact-tel{
  text-align:center;background:var(--washi);border:1px solid var(--kincha-pale);
  padding:clamp(2.2rem,4vw,3.2rem) 1.5rem;box-shadow:var(--shadow);
}
.ngm .contact-tel .sec-title{margin-bottom:1.2rem;}
.ngm .contact-tel p{margin:0 0 .4em;}

.ngm form.ngm-form{display:grid;gap:1.4rem;margin:2rem 0 2.6rem;}
.ngm form.ngm-form label{display:grid;gap:.55rem;}
.ngm form.ngm-form label > span{
  font-size:.86rem;font-weight:700;letter-spacing:.1em;color:var(--sumi);
  display:flex;align-items:center;gap:.6em;
}
.ngm form.ngm-form label i{
  font-style:normal;font-size:.68rem;letter-spacing:.1em;background:var(--shu);color:#fff;
  padding:.16em .55em;border-radius:2px;font-weight:700;
}
.ngm form.ngm-form input,.ngm form.ngm-form select,.ngm form.ngm-form textarea{
  font-family:var(--sans);font-size:1rem;color:var(--sumi-body);line-height:1.7;
  background:var(--washi);border:1px solid var(--kincha-pale);border-radius:var(--r);
  padding:.85em 1em;width:100%;
}
.ngm form.ngm-form input:focus,.ngm form.ngm-form select:focus,.ngm form.ngm-form textarea:focus{
  outline:2px solid var(--ai);outline-offset:1px;border-color:var(--ai);
}
.ngm form.ngm-form textarea{resize:vertical;}
.ngm form.ngm-form button{justify-self:start;cursor:pointer;font-family:var(--sans);}


/* ============================================================
   21. 現代風のアレンジ（2026-09 追加）
   ============================================================ */

/* ヒーロー：写真を数秒ごとに切り替える（1枚目は常時表示、2〜4枚目が上に重なる） */
.ngm .hero__slides{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--kinari-deep);}
.ngm .hero__slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.ngm .hero__slides img + img{opacity:0;animation:ngmFade 20s ease-in-out infinite;}
.ngm .hero__slides img:nth-child(2){animation-delay:5s;}
.ngm .hero__slides img:nth-child(3){animation-delay:10s;}
.ngm .hero__slides img:nth-child(4){animation-delay:15s;}
@keyframes ngmFade{0%{opacity:0}5%{opacity:1}25%{opacity:1}30%{opacity:0}100%{opacity:0}}
.ngm .hero__caps{position:relative;min-height:4.4em;}
@media (max-width:820px){.ngm .hero__caps{min-height:6em;}}
/* 説明文は写真と違い重なると読めなくなるので、表示時間が重ならないよう
   「消えきってから次が出る」タイミングにする（1枚目も同じ周期で回す） */
.ngm .hero__caps span{position:absolute;inset:0;opacity:0;animation:ngmCap 20s linear infinite;}
.ngm .hero__caps span:nth-child(1){animation-delay:0s;}
.ngm .hero__caps span:nth-child(2){animation-delay:5s;}
.ngm .hero__caps span:nth-child(3){animation-delay:10s;}
.ngm .hero__caps span:nth-child(4){animation-delay:15s;}
@keyframes ngmCap{0%{opacity:0}3%{opacity:1}22%{opacity:1}25%{opacity:0}100%{opacity:0}}

/* ヒーロー：キーワードを含む小見出し（検索対策。見た目は控えめ） */
.ngm .hero__kicker{
  font-family:var(--sans);font-size:.82rem;font-weight:700;letter-spacing:.2em;
  color:var(--ai);margin:0 0 .9rem;
}

/* 姫路城の透かし（ヒーロー右下・最終CTA） */
.ngm .hero,.ngm .ngm-cta{position:relative;}
.ngm .hero::after,.ngm .ngm-cta::after{
  content:"";position:absolute;right:-2vw;bottom:-1vw;width:min(38vw,420px);aspect-ratio:240/170;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 170' fill='%231a3549'><path d='M16 170 L46 122 H194 L224 170 Z'/><path d='M40 122 L48 104 H192 L200 122 Z'/><path d='M28 104 Q120 90 212 104 L202 109 L38 109 Z'/><path d='M58 92 L64 76 H176 L182 92 Z'/><path d='M48 76 Q120 64 192 76 L184 81 L56 81 Z'/><path d='M76 64 L82 50 H158 L164 64 Z'/><path d='M68 50 Q120 40 172 50 L164 55 L76 55 Z'/><path d='M92 40 L97 28 H143 L148 40 Z'/><path d='M84 28 Q120 18 156 28 L148 33 L92 33 Z'/><path d='M110 16 Q120 4 130 16 Z'/></svg>") no-repeat center/contain;opacity:.06;pointer-events:none;
}
.ngm .ngm-cta::after{opacity:.05;}
.ngm .hero > .ngm-wrap,.ngm .hero > .ngm-wrap,.ngm .ngm-cta > .ngm-wrap,.ngm .ngm-cta > .ngm-wrap,.ngm .ngm-cta > .ngm-wrap--narrow,.ngm .ngm-cta > .ngm-wrap--narrow{position:relative;z-index:1;}

/* スクロールに合わせて表示 */
.ngm .reveal{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s ease;}
.ngm .reveal.is-in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){
  .ngm .reveal{opacity:1;transform:none;transition:none;}
  .ngm .hero__slides img + img{animation:none;}
  .ngm .hero__caps span{animation:none;}
  .ngm .hero__caps span:first-child{opacity:1;}
}

/* スマホだけで効く改行。文の途中で切れるのを防ぐ */
.ngm .sp{display:none;}
/* 文節で折り返す（BudouX）。ライブラリが無くても最低限、単語の途中で切らない */
.ngm h1,.ngm h2,.ngm h3{line-break:strict;}
.ngm budoux-ja{display:inline;}

/* 対応エリア */
.ngm .area__grid{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem;margin-top:2.4rem;}
.ngm .area__col{background:var(--washi);border:1px solid var(--kincha-pale);padding:1.8rem 1.7rem;box-shadow:var(--shadow);}
.ngm .area__col h3{font-size:1.15rem;margin-bottom:.6rem;}
.ngm .area__col p{font-size:.95rem;margin-bottom:1rem;}
.ngm .area__tags{display:flex;flex-wrap:wrap;gap:.45rem;margin:0 0 1rem;}
.ngm .area__tags li{font-size:.82rem;font-weight:600;border:1px solid var(--kincha-pale);background:var(--kinari);padding:.3em .8em;border-radius:999px;}
.ngm .area__note{font-size:.82rem;color:var(--sumi-mute);margin:0;}

@media (max-width:980px){
  /* スマホ・タブレットでは、写真（どんな人が運営しているか）を見出しより先に */
  .ngm .hero__grid > figure{order:-1;}
  .ngm .hero{padding-top:1.6rem;}
  .ngm .hero::after{width:52vw;right:-6vw;bottom:-2vw;opacity:.05;}
  .ngm .area__grid{grid-template-columns:1fr;}
}
@media (max-width:820px){
  .ngm .sp{display:inline;}
}


/* ============================================================
   22. ブラッシュアップ（角丸・タイル目次・FAQ・お知らせ）
   ============================================================ */
:root{
  --r-card:14px;
  --tint-ai:#e6edf2; --tint-kincha:#f2e7d3; --tint-shu:#f6e3db; --tint-matcha:#e8ecdf;
}
/* 角丸で現代的に（ボタンは丸型） */
.ngm .ngm-btn{border-radius:999px;padding:1.05em 2.3em;}
.ngm .ngm-header .ngm-btn{padding:.8em 1.5em;}
.ngm .reason,.ngm .case,.ngm .price,.ngm .area__col,.ngm .related a,.ngm .side__card,.ngm .voice,.ngm .contact-tel,.ngm .compare,.ngm .map-slot,.ngm .checklist li{border-radius:var(--r-card);}
.ngm .checklist li{border-left-width:1px;padding-left:1.2em;}
.ngm .checklist li::before{content:"";width:.55em;height:.55em;border-radius:50%;background:var(--shu);margin-top:.75em;}
.ngm .case{overflow:hidden;}
.ngm .price{overflow:hidden;}
.ngm .frame{border-radius:16px;padding:.7rem;}
.ngm .frame img,.ngm .hero__slides{border-radius:10px;}
.ngm .record{border-radius:0;}
.ngm .compare{overflow:hidden;}
.ngm .compare thead th:last-child{background:var(--ai);}
.ngm .eyebrow{display:flex;align-items:center;gap:.6rem;}
.ngm .eyebrow::before{content:"";width:1.5rem;height:1px;background:var(--kincha);flex:0 0 auto;}
.ngm .sec-title{font-size:clamp(1.65rem,3.3vw,2.45rem);letter-spacing:.03em;}
.ngm .sec-title::after{display:none;}
.ngm .sec-lead{margin-top:.4rem;}
/* ヒーロー写真はマットを外して大きく・角丸・柔らかい影 */
.ngm .hero .frame{background:transparent;border:0;box-shadow:none;padding:0;}
.ngm .hero__slides{border-radius:22px;box-shadow:0 30px 60px -30px rgba(36,31,28,.35);}
.ngm .hero .frame figcaption{margin:1.2rem .2rem 0;padding-left:1rem;border-left:2px solid var(--kincha);}
/* 説明文は絶対配置なので padding が効かない → 縦線から 1rem 離す */
.ngm .hero .frame figcaption span{left:1rem;}
/* ヘッダー：スクロール時に影 */
.ngm .ngm-header{transition:box-shadow .25s ease;}
.ngm .ngm-header.is-scrolled{box-shadow:0 8px 30px -18px rgba(36,31,28,.35);}

/* 目次タイル */
.ngm .toc-tiles{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;margin-top:2.2rem;}
/* 担当者紹介：資格証2枚を横並び、人物写真は本文幅の中で少し小さめ */
.ngm .certs{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.6rem 0 2.4rem;}
.ngm .certs .frame{margin:0;}
.ngm .profile-photo{max-width:560px;margin:1rem 0 1.4rem;}
.ngm .tile{
  display:flex;flex-direction:column;gap:.35rem;min-height:9.5rem;padding:1.3rem 1.3rem 1.1rem;
  border-radius:var(--r-card);text-decoration:none;color:var(--sumi);position:relative;
  border:1px solid rgba(36,31,28,.06);transition:transform .2s ease,box-shadow .2s ease;
}
.ngm .tile:hover{transform:translateY(-4px);box-shadow:var(--shadow);color:var(--sumi);}
.ngm .tile__no{font-family:var(--serif);font-size:.78rem;letter-spacing:.2em;color:var(--kincha-text);}
.ngm .tile b{font-family:var(--serif);font-size:1.12rem;font-weight:700;line-height:1.5;}
.ngm .tile span{font-size:.84rem;color:var(--sumi-body);line-height:1.7;}
.ngm .tile::after{content:"→";position:absolute;right:1.1rem;bottom:.9rem;font-weight:700;color:var(--ai);transition:transform .2s ease;}
.ngm .tile:hover::after{transform:translateX(4px);}
.ngm .tile--ai{background:var(--tint-ai);}
.ngm .tile--kincha{background:var(--tint-kincha);}
.ngm .tile--shu{background:var(--tint-shu);}
.ngm .tile--matcha{background:var(--tint-matcha);}
.ngm .tile--washi{background:var(--washi);}

/* よくあるご質問（details） */
.ngm .faq{display:grid;gap:.8rem;margin-top:2.2rem;}
.ngm .faq details{background:var(--washi);border:1px solid var(--kincha-pale);border-radius:var(--r-card);overflow:hidden;}
.ngm .faq summary{
  list-style:none;cursor:pointer;display:flex;gap:.9rem;align-items:flex-start;
  padding:1.1rem 3.2rem 1.1rem 1.3rem;font-family:var(--serif);font-weight:700;font-size:1.05rem;
  line-height:1.7;position:relative;color:var(--sumi);
}
.ngm .faq summary::-webkit-details-marker{display:none;}
.ngm .faq summary::before{content:"Q";flex:0 0 auto;font-family:var(--serif);color:var(--kincha-text);font-size:1.1rem;}
.ngm .faq summary::after{
  content:"";position:absolute;right:1.2rem;top:1.35rem;width:.75rem;height:.75rem;
  border-right:2px solid var(--ai);border-bottom:2px solid var(--ai);transform:rotate(45deg);transition:transform .25s ease;
}
.ngm .faq details[open] summary::after{transform:rotate(-135deg);top:1.7rem;}
.ngm .faq .faq__a{padding:0 1.3rem 1.3rem 3.2rem;font-size:.96rem;position:relative;}
.ngm .faq .faq__a::before{content:"A";position:absolute;left:1.3rem;top:-.1rem;font-family:var(--serif);color:var(--shu);font-size:1.1rem;font-weight:700;}
.ngm .faq .faq__a p{margin:0 0 .6em;}

/* お知らせ・最近の記事（テンプレートがフッター上に出す） */
.ngm .news{background:var(--kinari-deep);padding:clamp(2.6rem,5vw,4rem) 0;}
.ngm .news__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.6rem;}
.ngm .news a{
  display:block;background:var(--washi);border:1px solid var(--kincha-pale);border-radius:var(--r-card);
  padding:1.2rem 1.3rem;text-decoration:none;color:var(--sumi);transition:transform .2s ease,box-shadow .2s ease;
}
.ngm .news a:hover{transform:translateY(-3px);box-shadow:var(--shadow);color:var(--sumi);}
.ngm .news time{display:block;font-size:.76rem;letter-spacing:.12em;color:var(--kincha-text);font-weight:700;margin-bottom:.4rem;}
.ngm .news b{font-family:var(--serif);font-weight:700;font-size:1.02rem;line-height:1.6;}
.ngm .news__more{margin-top:1.4rem;font-size:.9rem;}

@media (max-width:980px){
  .ngm .toc-tiles{grid-template-columns:repeat(2,1fr);}
  .ngm .certs{grid-template-columns:1fr;}
  .ngm .news__grid{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .ngm .toc-tiles{gap:.6rem;}
  /* スマホ：文字が収まる高さに詰め、矢印は「タッチ →」で右下に */
  .ngm .tile{min-height:0;padding:.75rem .85rem .6rem;gap:.1rem;}
  .ngm .tile b{font-size:.98rem;line-height:1.4;}
  .ngm .tile span{display:none;}
  .ngm .tile::after{content:"タッチ →";position:static;display:block;text-align:right;font-size:.72rem;letter-spacing:.06em;margin-top:.15rem;}
  /* 比較表：左列を狭く、見出しは2段 */
  .ngm .compare th,.ngm .compare td{padding:.75em .6em;font-size:.86rem;line-height:1.6;}
  .ngm .compare tbody th{width:4.3em;font-size:.8rem;padding-left:.7em;}
  .ngm .compare thead th{font-size:.76rem;line-height:1.45;letter-spacing:.06em;}
}

/* Googleマップ */
.ngm .map-embed iframe{display:block;width:100%;height:320px;border:0;border-radius:14px;box-shadow:var(--shadow);}

/* 右下に浮かぶ「メニュー」ボタン（スクロールが止まると表示） */
.ngm .to-menu{
  position:fixed;right:1rem;bottom:1.4rem;z-index:70;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.1rem;
  width:3.9rem;height:3.9rem;border-radius:50%;border:0;cursor:pointer;
  background:var(--ai);color:#fff;font-family:var(--sans);font-weight:700;font-size:.66rem;letter-spacing:.08em;
  box-shadow:0 10px 24px -10px rgba(18,38,47,.6);
  opacity:0;transform:translateY(12px) scale(.9);pointer-events:none;
  transition:opacity .35s ease,transform .35s ease;
}
.ngm .to-menu__icon{font-size:1.15rem;line-height:1;}
.ngm .to-menu.is-show{opacity:1;transform:none;pointer-events:auto;}
.ngm .to-menu:hover{background:var(--ai-deep);}
.ngm section[id]{scroll-margin-top:5.5rem;}
@media (max-width:820px){
  .ngm .to-menu{bottom:calc(60px + 1rem);right:.8rem;}
}
@media (prefers-reduced-motion:reduce){ .ngm .to-menu{transition:none;} }
