@charset "utf-8";
/* =========================================================
   CREETE — トップページ デザイン案 (Step1 静的HTML)
   コンセプト：やさしい / 安心安全 / 高齢者・家族向け
   ブランド：フォレストグリーン × ゴールド × 生成りの和
   ========================================================= */

:root{
  --green:        #3f8a45;   /* メイングリーン（ロゴの木）*/
  --green-deep:   #2c6a34;   /* 濃い緑（見出し・締め）*/
  --green-soft:   #e6f1e8;   /* 淡い緑の面 */
  --gold:         #45a7d8;   /* 水色（アクセント：旧サイト継承）*/
  --gold-deep:    #2b7fae;   /* 濃い水色（テキスト用）*/
  --sky-soft:     #e4f1fa;   /* 淡い水色の面 */
  --cream:        #f4f8f7;   /* やわらかい寒色よりの地色 */
  --cream-2:      #e9f1ee;
  --ink:          #303430;   /* 本文の文字 */
  --ink-soft:     #5a615b;
  --line:         #d9e6e0;
  --white:        #ffffff;
  --shadow:       0 10px 34px rgba(64,74,45,.10);
  --shadow-sm:    0 4px 16px rgba(64,74,45,.08);
  --radius:       18px;
  --maxw:         1160px;
  --serif: "Shippori Mincho","Noto Serif JP",'Hiragino Mincho ProN',serif;
  --sans:  "Noto Sans JP",'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--sans);
  color:var(--ink);
  background:var(--cream);
  font-size:18px;          /* 高齢者配慮：本文大きめ */
  line-height:1.95;
  letter-spacing:.02em;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
.wrap{ width:min(92%,var(--maxw)); margin-inline:auto; }

/* ---------- 見出し共通 ---------- */
.sec{ padding:84px 0; }
.sec-head{ text-align:center; margin-bottom:48px; }
.sec-head .en{
  display:block; font-family:var(--serif); color:var(--gold-deep);
  letter-spacing:.28em; font-size:.9rem; font-weight:600; margin-bottom:10px;
}
.sec-head h2{
  font-family:var(--serif); font-weight:700; color:var(--green-deep);
  font-size:clamp(1.7rem,3.4vw,2.5rem); line-height:1.4; margin:0;
}
.sec-head h2 b{ color:var(--gold-deep); }
.sec-head .lead{ margin:18px auto 0; max-width:640px; color:var(--ink-soft); font-size:1.02rem; }

.btn{
  display:inline-flex; align-items:center; gap:.6em; justify-content:center;
  font-family:var(--sans); font-weight:700; font-size:1.02rem; white-space:nowrap;
  padding:16px 34px; border-radius:999px; transition:.25s; cursor:pointer;
  border:2px solid transparent;
}
.btn--green{ background:var(--green); color:#fff; box-shadow:var(--shadow-sm); }
.btn--green:hover{ background:var(--green-deep); transform:translateY(-2px); }
.btn--gold{ background:var(--gold); color:#fff; box-shadow:var(--shadow-sm); }
.btn--gold:hover{ background:var(--gold-deep); color:#fff; transform:translateY(-2px); }
.btn--ghost{ background:#fff; color:var(--green-deep); border-color:var(--green); }
.btn--ghost:hover{ background:var(--green); color:#fff; }
.btn .arw{ font-size:.9em; }

/* =========================================================
   ヘッダー
   ========================================================= */
.header{
  position:sticky; top:0; z-index:60; background:rgba(255,255,255,.92);
  backdrop-filter:blur(8px); border-bottom:1px solid var(--line);
}
.header .wrap{ width:min(96%,1300px); }
.header__in{ display:flex; align-items:center; gap:22px; height:84px; }
.header__logo img{ height:52px; width:auto; }
.gnav{ margin-left:auto; }
.gnav>ul{ display:flex; gap:20px; list-style:none; margin:0; padding:0; }
.gnav>ul>li{ position:relative; }
.gnav>ul>li>a{ font-weight:600; font-size:.94rem; color:var(--ink); position:relative; padding:30px 0; white-space:nowrap; display:inline-flex; align-items:center; gap:4px; }
.gnav>ul>li>a::after{ content:""; position:absolute; left:0; bottom:24px; width:0; height:2px; background:var(--gold); transition:.25s; }
.gnav>ul>li>a:hover{ color:var(--green); }
.gnav>ul>li>a:hover::after{ width:100%; }
.gnav .caret{ font-size:.66em; color:var(--gold-deep); }
/* ドロップダウン */
.gnav .drop{
  position:absolute; left:50%; top:100%; transform:translateX(-50%) translateY(6px);
  min-width:230px; background:#fff; border:1px solid var(--line); border-radius:14px;
  box-shadow:var(--shadow); padding:10px; list-style:none; margin:0;
  opacity:0; visibility:hidden; transition:.22s; z-index:70;
}
.gnav .has-drop:hover .drop,.gnav .has-drop:focus-within .drop{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.gnav .drop li{ position:static; }
.gnav .drop a{ display:block; padding:11px 16px; border-radius:9px; font-size:.9rem; font-weight:600; color:var(--ink); white-space:nowrap; }
.gnav .drop a:hover{ background:var(--green-soft); color:var(--green-deep); }
.header__cta{ display:flex; align-items:center; gap:14px; }
.header__tel{ text-align:right; line-height:1.25; }
.header__tel .num{ font-family:var(--serif); font-weight:700; font-size:1.35rem; color:var(--green-deep); }
.header__tel .lbl{ display:block; font-size:.72rem; color:var(--ink-soft); letter-spacing:.08em; }
.header__cta .btn{ padding:12px 22px; font-size:.92rem; }
.hamb{ display:none; }

/* =========================================================
   ヒーロー
   ========================================================= */
.hero{ position:relative; overflow:hidden; }
.hero__media{ position:relative; min-height:min(78vh,620px); }
.hero__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero__media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(28,52,25,.62) 0%, rgba(28,52,25,.28) 46%, rgba(28,52,25,0) 72%);
}
.hero__copy{ position:absolute; z-index:2; left:0; right:0; top:50%; transform:translateY(-50%); }
.hero__copy .en{ color:#f4e6bf; font-family:var(--serif); letter-spacing:.3em; font-size:.95rem; margin-bottom:18px; }
.hero__copy h1{
  font-family:var(--serif); color:#fff; font-weight:700; margin:0;
  font-size:clamp(1.9rem,5vw,3.5rem); line-height:1.5;
  text-shadow:0 2px 18px rgba(0,0,0,.35);
}
.hero__copy h1 .accent{ color:#b9e4fa; }
.hero__copy p{ color:#f2f4ec; margin:22px 0 0; font-size:1.08rem; max-width:32em; text-shadow:0 1px 10px rgba(0,0,0,.4); }
.hero__copy p b{ color:#b9e4fa; font-size:1.22em; font-weight:700; }

/* ヒーロー下の3リンク */
.hero__links{ position:relative; z-index:3; margin-top:-46px; }
.hero__links ul{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; list-style:none; margin:0; padding:0; }
.hero__links a{
  display:flex; align-items:center; gap:14px; background:#fff; border-radius:14px;
  padding:22px 26px; box-shadow:var(--shadow); font-weight:700; color:var(--green-deep);
  border:1px solid var(--line); transition:.25s;
}
.hero__links a:hover{ transform:translateY(-4px); border-color:var(--green); }
.hero__links .ic{
  flex:0 0 auto; width:44px; height:44px; border-radius:50%; background:var(--green-soft);
  display:grid; place-items:center; color:var(--green); font-size:1.2rem;
}
.hero__links a .arw{ margin-left:auto; color:var(--gold-deep); }

/* =========================================================
   お知らせ
   ========================================================= */
.news{ padding:72px 0; }
.news__grid{ display:grid; grid-template-columns:auto 1fr auto; gap:28px 40px; align-items:start; }
.news__title{ font-family:var(--serif); }
.news__title .en{ color:var(--gold-deep); letter-spacing:.2em; font-size:.85rem; }
.news__title h2{ margin:.2em 0 0; font-size:1.9rem; color:var(--green-deep); }
.news__list{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.news__list li{ border-bottom:1px solid var(--line); }
.news__list a{ display:grid; grid-template-columns:auto auto 1fr; gap:22px; align-items:center; padding:20px 8px; transition:.2s; }
.news__list a:hover{ background:var(--cream-2); }
.news__list time{ font-family:var(--serif); color:var(--green); font-weight:700; }
.news__cat{ font-size:.76rem; font-weight:700; color:#fff; background:var(--green); padding:4px 14px; border-radius:999px; white-space:nowrap; }
.news__more{ align-self:center; }

/* =========================================================
   事業紹介（生前整理応援）
   ========================================================= */
.about{ background:linear-gradient(180deg,var(--cream) 0%,var(--green-soft) 100%); }
.about__grid{ display:grid; grid-template-columns:0.82fr 1.18fr; gap:44px; align-items:center; }
.about__ph img{ border-radius:var(--radius); box-shadow:var(--shadow); width:100%; }
.about__grid .about__box h3{ text-align:left; }
.about__grid .about__box p{ margin-inline:0; text-align:left; max-width:none; }
.about__box{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:56px clamp(24px,5vw,64px); position:relative;
}
.about__box::before,.about__box::after{
  content:""; position:absolute; width:34px; height:34px; border:3px solid var(--green);
}
.about__box::before{ left:20px; top:20px; border-right:0; border-bottom:0; }
.about__box::after{ right:20px; bottom:20px; border-left:0; border-top:0; }
.about__box h3{ text-align:center; font-family:var(--serif); color:var(--green-deep); font-size:clamp(1.5rem,3vw,2.1rem); margin:0 0 24px; }
.about__box p{ max-width:44em; margin-inline:auto; text-align:center; color:var(--ink-soft); }

/* =========================================================
   比較表
   ========================================================= */
.compare{ background:var(--green-soft); }
.compare__img{ background:#fff; padding:16px; border-radius:var(--radius); box-shadow:var(--shadow); overflow-x:auto; }
.compare__img img{ min-width:680px; margin-inline:auto; border-radius:8px; }
.compare__more{ text-align:center; margin-top:28px; }
.compare__more .btn{ font-size:1.05rem; padding:18px 42px; }
.compare__note{ margin:14px 0 0; font-size:.92rem; color:var(--ink-soft); }
@media(max-width:600px){
  .compare__more .btn{ display:block; width:100%; padding:18px 20px; }
}

/* =========================================================
   サービスカード
   ========================================================= */
.services__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
.scard{
  background:#fff; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line);
  box-shadow:var(--shadow-sm); transition:.28s; display:flex; flex-direction:column;
}
.scard:hover{ transform:translateY(-6px); box-shadow:var(--shadow); }
.scard__ph{ aspect-ratio:4/3; overflow:hidden; }
.scard__ph img{ width:100%; height:100%; object-fit:cover; transition:.4s; }
.scard:hover .scard__ph img{ transform:scale(1.06); }
.scard__body{ padding:22px 22px 26px; display:flex; flex-direction:column; flex:1; }
.scard__num{ font-family:var(--serif); color:var(--green); font-size:.85rem; letter-spacing:.15em; }
.scard h3{ font-family:var(--serif); color:var(--green-deep); font-size:1.28rem; margin:.2em 0 .5em; }
.scard p{ font-size:.96rem; color:var(--ink-soft); line-height:1.8; margin:0 0 18px; }
.scard__more{ margin-top:auto; font-weight:700; color:var(--green); display:inline-flex; align-items:center; gap:.4em; }
.scard:hover .scard__more{ color:var(--gold-deep); }

/* =========================================================
   お客様の声（ブログ連動）
   ========================================================= */
.voice{ background:var(--cream); }
.voice__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.vcard{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; box-shadow:var(--shadow-sm); transition:.28s; display:flex; flex-direction:column;
}
.vcard:hover{ transform:translateY(-6px); box-shadow:var(--shadow); }
.vcard__ph{ position:relative; aspect-ratio:16/10; overflow:hidden; }
.vcard__ph img{ width:100%; height:100%; object-fit:cover; transition:.4s; }
.vcard:hover .vcard__ph img{ transform:scale(1.05); }
.vcard__ph .tag{ position:absolute; left:14px; top:14px; background:var(--green); color:#fff; font-size:.74rem; font-weight:700; padding:5px 14px; border-radius:999px; }
.vcard__body{ padding:24px 24px 26px; display:flex; flex-direction:column; flex:1; }
.vcard__body .quote{ font-family:var(--serif); color:var(--green); font-size:1.9rem; line-height:1; margin-bottom:4px; }
.vcard h3{ font-family:var(--serif); color:var(--green-deep); font-size:1.16rem; line-height:1.6; margin:0 0 12px; }
.vcard p{ font-size:.94rem; color:var(--ink-soft); margin:0 0 18px; }
.vcard__meta{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--line); padding-top:14px; }
.vcard__who{ font-size:.86rem; color:var(--ink); font-weight:600; }
.vcard__more{ font-size:.86rem; font-weight:700; color:var(--green); }
.vcard:hover .vcard__more{ color:var(--gold-deep); }
.voice__foot{ text-align:center; margin-top:44px; }

/* =========================================================
   協力企業（司法書士）
   ========================================================= */
.partner{ background:var(--cream); }
.partner__box{
  display:grid; grid-template-columns:1fr 1.15fr; gap:0; background:#fff;
  border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); border:1px solid var(--line);
}
.partner__ph{ position:relative; min-height:340px; }
.partner__ph img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.partner__text{ padding:clamp(30px,4vw,56px); }
.partner__tag{ display:inline-block; font-size:.78rem; font-weight:700; color:#fff; background:var(--green); padding:5px 16px; border-radius:999px; margin-bottom:16px; }
.partner__text h3{ font-family:var(--serif); color:var(--green-deep); font-size:clamp(1.4rem,2.6vw,1.9rem); margin:0 0 20px; }
.partner__text p{ color:var(--ink-soft); font-size:.98rem; }
.partner__text p+p{ margin-top:14px; }
.partner__meta{ margin:22px 0 26px; padding-top:18px; border-top:1px solid var(--line); }
.partner__meta .role{ display:block; font-size:.82rem; color:var(--ink-soft); letter-spacing:.05em; }
.partner__meta .name{ font-family:var(--serif); font-size:1.5rem; color:var(--green-deep); }
.partner__meta .name small{ font-size:.62em; color:var(--ink-soft); margin-left:.6em; font-family:var(--sans); }

/* =========================================================
   代表メッセージ
   ========================================================= */
.message{ background:linear-gradient(180deg,var(--green-soft),var(--cream)); }
.message__box{ display:grid; grid-template-columns:300px 1fr; gap:clamp(30px,5vw,64px); align-items:center; }
.message__ph{ position:relative; }
.message__ph img{ border-radius:var(--radius); box-shadow:var(--shadow); }
.message__ph .badge{
  position:absolute; right:-14px; bottom:-14px; background:var(--green); color:#fff;
  font-family:var(--serif); font-weight:700; padding:12px 20px; border-radius:12px; box-shadow:var(--shadow-sm); font-size:.9rem;
}
.message__body .en{ color:var(--gold-deep); font-family:var(--serif); letter-spacing:.2em; font-size:.85rem; }
.message__body h2{ font-family:var(--serif); color:var(--green-deep); font-size:clamp(1.6rem,3vw,2.2rem); margin:.2em 0 24px; line-height:1.5; }
.message__body p{ color:var(--ink-soft); font-size:1.02rem; }
.message__sign{ margin-top:26px; font-family:var(--serif); }
.message__sign .lbl{ font-size:.82rem; color:var(--ink-soft); }
.message__sign .nm{ font-size:1.5rem; color:var(--green-deep); margin-left:.4em; }

/* =========================================================
   サービスリンク帯
   ========================================================= */
.links{ background:var(--green-deep); color:#fff; padding:64px 0; }
.links h2{ text-align:center; font-family:var(--serif); font-size:1.7rem; margin:0 0 8px; }
.links .en{ display:block; text-align:center; color:#cfe6c6; letter-spacing:.25em; font-size:.82rem; margin-bottom:34px; }
.links__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.links__grid a{ display:flex; align-items:center; gap:12px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16); border-radius:12px; padding:18px 22px; font-weight:600; transition:.22s; }
.links__grid a:hover{ background:var(--gold); color:#fff; border-color:var(--gold); }
.links__grid .dot{ color:#9fd8f0; }
.links__grid a:hover .dot{ color:#fff; }

/* =========================================================
   お問い合わせ / CTA
   ========================================================= */
.contact{ padding:0; }
.contact__in{ background:linear-gradient(135deg,var(--green) 0%,var(--green-deep) 100%); color:#fff; border-radius:0; padding:64px 0; text-align:center; }
.contact h2{ font-family:var(--serif); font-size:clamp(1.6rem,3vw,2.2rem); margin:0 0 10px; }
.contact p{ margin:0 0 30px; font-weight:600; }
.contact__row{ display:flex; gap:20px; justify-content:center; align-items:center; flex-wrap:wrap; }
.contact__tel{ background:#fff; border-radius:14px; padding:16px 30px; box-shadow:var(--shadow-sm); }
.contact__tel .lbl{ font-size:.78rem; color:var(--ink-soft); }
.contact__tel .num{ font-family:var(--serif); font-weight:700; font-size:1.8rem; color:var(--green-deep); line-height:1.1; }
.contact__tel .time{ font-size:.72rem; color:var(--ink-soft); }
.contact .btn--green{ padding:20px 40px; font-size:1.1rem; }

/* =========================================================
   フッター
   ========================================================= */
.footer{ background:#2a2823; color:#d8d3c5; padding:60px 0 30px; }
.footer__top{ display:flex; justify-content:space-between; gap:40px; flex-wrap:wrap; align-items:flex-start; }
.footer__brand img{ height:56px; margin-bottom:18px; filter:brightness(0) invert(1); opacity:.92; }
.footer__brand p{ font-size:.88rem; color:#a8a394; line-height:1.9; max-width:24em; }
.footer__social{ display:flex; gap:12px; margin-top:20px; }
.footer__social a{ width:42px; height:42px; border-radius:11px; overflow:hidden; display:block; transition:.2s; }
.footer__social a:hover{ transform:translateY(-3px); }
.footer__social img{ width:42px; height:42px; object-fit:cover; display:block; }
.footer__nav{ display:flex; gap:60px; flex-wrap:wrap; }
.footer__nav h4{ font-family:var(--serif); color:#fff; font-size:.98rem; margin:0 0 14px; }
.footer__nav ul{ list-style:none; margin:0; padding:0; }
.footer__nav li{ margin-bottom:10px; }
.footer__nav a{ font-size:.9rem; color:#c7c2b4; }
.footer__nav a:hover{ color:var(--gold); }
.footer__copy{ border-top:1px solid #403c34; margin-top:44px; padding-top:22px; text-align:center; font-size:.78rem; color:#8f8a7d; }

/* =========================================================
   選ばれる理由・安心の取組
   ========================================================= */
.reasons{ background:var(--cream); }
.reasons__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.rcard{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:32px 28px; box-shadow:var(--shadow-sm); transition:.25s; }
.rcard:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.rcard__ic{ width:60px; height:60px; border-radius:16px; background:var(--green-soft); color:var(--green); display:grid; place-items:center; font-size:1.7rem; margin-bottom:16px; }
.rcard h3{ font-family:var(--serif); color:var(--green-deep); font-size:1.2rem; margin:0 0 10px; line-height:1.5; }
.rcard p{ font-size:.94rem; color:var(--ink-soft); margin:0; }

/* =========================================================
   ご利用の流れ
   ========================================================= */
.flow{ background:linear-gradient(180deg,var(--green-soft),var(--cream)); }
.flow__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.fstep{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:38px 22px 28px; text-align:center; position:relative; box-shadow:var(--shadow-sm); }
.fstep__no{ position:absolute; top:-20px; left:50%; transform:translateX(-50%); width:46px; height:46px; border-radius:50%; background:var(--green); color:#fff; font-family:var(--serif); font-weight:700; font-size:1.1rem; display:grid; place-items:center; box-shadow:var(--shadow-sm); }
.fstep__ic{ font-size:2rem; margin:4px 0 12px; }
.fstep h3{ font-family:var(--serif); color:var(--green-deep); font-size:1.12rem; margin:0 0 8px; }
.fstep p{ font-size:.9rem; color:var(--ink-soft); margin:0; }
.fstep:not(:last-child)::after{ content:"▶"; position:absolute; right:-16px; top:50%; transform:translateY(-50%); color:var(--gold); font-size:.95rem; z-index:2; }

/* =========================================================
   遠方のご家族へ
   ========================================================= */
.forfamily{ padding:0; }
.forfamily__in{ display:grid; grid-template-columns:1fr 1fr; align-items:stretch; }
.forfamily__ph{ position:relative; min-height:360px; }
.forfamily__ph img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.forfamily__txt{ background:linear-gradient(150deg,var(--green) 0%,var(--gold-deep) 100%); color:#fff; padding:clamp(40px,6vw,76px); display:flex; flex-direction:column; justify-content:center; }
.forfamily__txt .en{ color:#cfe6c6; letter-spacing:.22em; font-family:var(--serif); font-size:.85rem; }
.forfamily__txt h2{ font-family:var(--serif); font-size:clamp(1.5rem,3vw,2.1rem); margin:.3em 0 18px; line-height:1.55; }
.forfamily__txt p{ color:#e8f1e3; font-size:1rem; margin:0 0 28px; }
.forfamily__btns{ display:flex; gap:14px; flex-wrap:wrap; }
.btn--line{ background:#06c755; color:#fff; }
.btn--line:hover{ background:#05a648; color:#fff; transform:translateY(-2px); }

/* =========================================================
   レスポンシブ
   ========================================================= */
@media(max-width:1240px){
  .gnav,.header__tel{ display:none; }
  .hamb{ display:grid; place-items:center; margin-left:auto; width:50px; height:50px; border:0; background:var(--green); color:#fff; border-radius:12px; cursor:pointer; }
  .hamb span{ font-size:1.4rem; }
}
@media(max-width:1080px){
  .services__grid{ grid-template-columns:repeat(2,1fr); }
  .reasons__grid{ grid-template-columns:repeat(3,1fr); }
  .flow__grid{ grid-template-columns:repeat(2,1fr); row-gap:48px; }
  .fstep:not(:last-child)::after{ display:none; }
  .about__grid{ grid-template-columns:1fr; gap:30px; }
  .partner__box{ grid-template-columns:1fr; }
  .partner__ph{ min-height:240px; }
  .links__grid{ grid-template-columns:repeat(2,1fr); }
  .forfamily__in{ grid-template-columns:1fr; }
  .forfamily__ph{ order:-1; min-height:260px; }
}
@media(max-width:820px){
  .voice__grid{ grid-template-columns:1fr; max-width:460px; margin-inline:auto; }
  .reasons__grid{ grid-template-columns:1fr; max-width:520px; margin-inline:auto; }
}
@media(max-width:768px){
  body{ font-size:17px; }
  .sec{ padding:60px 0; }
  .header__in{ height:70px; }
  .header__logo img{ height:42px; }
  .hero__media{ min-height:70vh; }
  .hero__links{ margin-top:24px; }
  .hero__links ul{ grid-template-columns:1fr; gap:12px; }
  .news__grid{ grid-template-columns:1fr; gap:18px; }
  .news__more{ justify-self:start; }
  .news__list a{ grid-template-columns:auto 1fr; }
  .news__cat{ grid-row:1; }
  .message__box{ grid-template-columns:1fr; text-align:center; }
  .message__ph{ max-width:240px; margin:0 auto; }
  .message__sign{ display:inline-block; }
}
@media(max-width:520px){
  .services__grid{ grid-template-columns:1fr; }
  .flow__grid{ grid-template-columns:1fr; row-gap:44px; }
  .links__grid{ grid-template-columns:1fr; }
  .contact__row{ flex-direction:column; }
  .forfamily__btns{ flex-direction:column; }
  .forfamily__btns .btn{ width:100%; }
  .sec-head h2{ font-size:1.5rem; }
}

/* モバイルメニュー（簡易） */
.mnav{ position:fixed; inset:0 0 0 auto; width:min(80%,320px); background:#fff; box-shadow:-10px 0 40px rgba(0,0,0,.2); transform:translateX(100%); transition:.3s; z-index:80; padding:28px 26px; overflow-y:auto; }
.mnav.open{ transform:translateX(0); }
.mnav__close{ background:none; border:0; font-size:1.6rem; float:right; cursor:pointer; color:var(--ink); }
.mnav ul{ list-style:none; margin:14px 0 0; padding:0; clear:both; }
.mnav>ul:first-of-type{ margin-top:40px; }
.mnav li{ border-bottom:1px solid var(--line); }
.mnav a{ display:block; padding:14px 4px; font-weight:600; }
.mnav__label{ margin:24px 0 0; font-family:var(--serif); font-size:.82rem; font-weight:700; color:var(--gold-deep); letter-spacing:.08em; border-bottom:2px solid var(--green-soft); padding-bottom:6px; }
.mnav__cta{ display:flex; flex-direction:column; gap:10px; margin-top:26px; }
.mnav__cta .btn{ width:100%; }
.mnav__tel{ margin-top:22px; text-align:center; }
.mnav__tel .num{ font-family:var(--serif); font-size:1.6rem; color:var(--green-deep); font-weight:700; }
.backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.4); opacity:0; visibility:hidden; transition:.3s; z-index:70; }
.backdrop.open{ opacity:1; visibility:visible; }