@charset "utf-8";
/* ==========================================================================
   恩と健幸 江古田 ～予防医学型デイサービス～  site.css
   ONGROUP加盟店構築バイブル v2.8.0 準拠 / 2026-08-27
   ========================================================================== */

:root{
  --bg:#FDFCF7;
  --green:#6FAE3E;
  --deep:#3E7A33;
  --red:#E05A6B;
  --brown:#6B4A36;
  --pale:#F1F7E8;
  --ink:#332F29;
  --ink-soft:#5C574E;
  --line:#E3E8D6;
  --radius:16px;
  --shadow:0 4px 16px rgba(62,122,51,.08);
  --shadow-hover:0 12px 28px rgba(111,174,62,.24);
  --container:1120px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  font-size:17px;
  line-height:1.9;
  font-weight:400;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--deep);text-decoration:underline;text-underline-offset:.2em}
a:hover{color:var(--green)}
:focus-visible{outline:3px solid var(--green);outline-offset:2px}

h1,h2,h3,h4{
  font-family:"Zen Maru Gothic","Noto Sans JP",sans-serif;
  font-weight:700;
  line-height:1.5;
  margin:0;
  color:var(--deep);
}
p{margin:0}

.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:20px}
.narrow{max-width:820px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}

/* ---------- ヘッダー ---------- */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(253,252,247,.94);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-block:10px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}
.brand__logo{width:52px;height:52px;border-radius:50%;flex-shrink:0}
.brand__text{display:flex;flex-direction:column;justify-content:center;min-width:0}
.brand__name{font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:19px;color:var(--deep);line-height:1.25}
.brand__sub{font-family:"Noto Sans JP",sans-serif;font-size:11px;font-weight:500;color:var(--ink-soft);letter-spacing:.02em;line-height:1.4}
.header-actions{display:flex;align-items:center;gap:10px;flex-shrink:0;order:3;margin-left:auto}
.main-nav{order:2}

.nav-toggle{
  display:inline-flex;flex-direction:column;justify-content:center;gap:5px;
  width:48px;height:48px;padding:0 11px;
  background:#fff;border:1px solid var(--line);border-radius:12px;cursor:pointer;
}
.nav-toggle span{display:block;height:2px;background:var(--deep);border-radius:2px;transition:transform .2s}
.main-nav{display:none}
.main-nav.is-open{display:block;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
.main-nav ul{display:grid;gap:2px;list-style:none;margin:0;padding:12px 20px 20px}
.main-nav a{
  display:block;padding:14px 8px;font-size:16px;font-weight:500;color:var(--ink);
  text-decoration:none;border-bottom:1px dashed var(--line);
}
.main-nav a:hover,.main-nav a[aria-current="page"]{color:var(--deep)}
.header-tel{
  display:inline-block;flex-shrink:0;min-width:max-content;
  font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:16px;
  color:var(--red);text-decoration:none;
}
.header-tel:hover{color:#c9455a}

@media (min-width:600px){
  .header-tel{font-size:18px}
}
@media (min-width:1000px){
  .nav-toggle{display:none}
  .main-nav{display:block}
  .main-nav ul{display:flex;align-items:center;gap:20px;padding:0}
  .main-nav a{border:0;padding:6px 0;font-size:16px}
  .main-nav a[aria-current="page"]{box-shadow:inset 0 -2px 0 var(--green)}
}

/* ---------- ボタン ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:56px;padding:14px 28px;border-radius:999px;
  font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:17px;
  text-decoration:none;border:2px solid transparent;cursor:pointer;
  transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease;
}
.btn--primary{background:var(--green);color:#fff;box-shadow:0 6px 18px rgba(111,174,62,.28)}
.btn--primary:hover{background:#63a034;color:#fff;transform:translateY(-3px);box-shadow:0 12px 26px rgba(111,174,62,.36)}
.btn--red{background:var(--red);color:#fff;box-shadow:0 6px 18px rgba(224,90,107,.26)}
.btn--red:hover{background:#d34c5e;color:#fff;transform:translateY(-3px);box-shadow:0 12px 26px rgba(224,90,107,.34)}
.btn--ghost{background:#fff;color:var(--deep);border-color:var(--green)}
.btn--ghost:hover{background:var(--pale);color:var(--deep);transform:translateY(-3px);box-shadow:var(--shadow-hover)}
.btn-row{display:flex;flex-wrap:wrap;gap:14px}
.btn-row--center{justify-content:center}

/* ---------- セクション ---------- */
.section{padding-block:56px}
.section--pale{background:var(--pale)}
.section--white{background:#fff}
@media (min-width:768px){.section{padding-block:80px}}

.sec-head{display:grid;gap:10px;justify-items:center;text-align:center;margin-bottom:32px}
.sec-head .en{font-size:13px;font-weight:600;letter-spacing:.14em;color:var(--green);font-family:"Noto Sans JP",sans-serif}
.sec-title{font-size:clamp(23px,5vw,32px)}
.sec-lead{max-width:720px;color:var(--ink-soft);font-size:16px}
.page-title{font-size:clamp(25px,4.6vw,38px)}

/* 水彩調の若葉あしらい（軽量CSS装飾） */
.leaf-rule{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 auto}
.leaf-rule::before,.leaf-rule::after{content:"";width:clamp(48px,14vw,120px);height:1px;background:linear-gradient(90deg,transparent,var(--green))}
.leaf-rule::after{background:linear-gradient(90deg,var(--green),transparent)}
.leaf{width:14px;height:14px;border-radius:0 70% 0 70%;background:linear-gradient(135deg,#A6D06F,var(--green));opacity:.9}
.leaf:nth-child(2){width:10px;height:10px;background:linear-gradient(135deg,#C9E3A3,#8CC257);transform:rotate(-20deg)}
.leaf:nth-child(3){width:8px;height:8px;border-radius:50%;background:#F3F0C6}

/* ---------- カード ---------- */
.grid{display:grid;gap:20px}
.grid--2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.grid--3{grid-template-columns:repeat(auto-fit,minmax(272px,1fr))}
.grid--4{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:26px 24px;box-shadow:var(--shadow);
  transition:transform .25s ease,box-shadow .25s ease;
}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover)}
.card h3{font-size:19px;margin-bottom:10px}
.card p{color:var(--ink-soft);font-size:16px}
.card__badge{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;margin-bottom:14px;
  background:var(--pale);color:var(--deep);
  font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:19px;
}
.card--num .card__badge{background:var(--green);color:#fff}
.card__icon{font-size:0;line-height:0;margin-bottom:14px}
.icon-dot{display:inline-block;width:52px;height:52px;border-radius:18px 26px 18px 26px;background:linear-gradient(140deg,#CFE7AB,var(--green))}
.icon-dot--red{background:linear-gradient(140deg,#F7C6CD,var(--red))}
.icon-dot--brown{background:linear-gradient(140deg,#DCC7B8,var(--brown))}

/* ---------- チェックリスト ---------- */
.check{list-style:none;margin:0;padding:0;display:grid;gap:14px}
@media (min-width:700px){.check--2{grid-template-columns:1fr 1fr;gap:14px 28px}}
.check li{position:relative;padding-left:38px;font-size:17px}
.check li::before{
  content:"";position:absolute;left:0;top:.35em;width:24px;height:24px;border-radius:50%;
  background:var(--green);
}
.check li::after{
  content:"";position:absolute;left:7px;top:.72em;width:10px;height:5px;
  border-left:2.5px solid #fff;border-bottom:2.5px solid #fff;transform:rotate(-45deg);
}

/* ---------- 理念メッセージ ---------- */
.creed{
  text-align:center;display:grid;gap:18px;justify-items:center;
}
.creed p{
  font-family:"Zen Maru Gothic",sans-serif;font-weight:700;
  font-size:clamp(20px,4.6vw,30px);line-height:1.8;color:var(--deep);
}

/* ---------- タイムライン ---------- */
.timeline{list-style:none;margin:0;padding:0;display:grid;gap:0}
.timeline li{position:relative;padding:0 0 26px 34px;border-left:2px solid #D9E7C4}
.timeline li:last-child{border-left-color:transparent;padding-bottom:0}
.timeline li::before{
  content:"";position:absolute;left:-9px;top:6px;width:16px;height:16px;border-radius:50%;
  background:#fff;border:3px solid var(--green);
}
.timeline .time{display:block;font-family:"Zen Maru Gothic",sans-serif;font-weight:700;color:var(--green);font-size:16px}
.timeline h3{font-size:18px;margin-bottom:4px}
.timeline p{color:var(--ink-soft);font-size:16px}

/* ---------- ステップ ---------- */
.steps{list-style:none;margin:0;padding:0;display:grid;gap:18px;counter-reset:step}
.steps>li{
  position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:24px 24px 24px 78px;box-shadow:var(--shadow);
  transition:transform .25s ease,box-shadow .25s ease;
}
.steps>li:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover)}
.steps>li::before{
  counter-increment:step;content:counter(step);
  position:absolute;left:22px;top:24px;width:42px;height:42px;border-radius:50%;
  background:var(--green);color:#fff;display:grid;place-items:center;
  font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:19px;
}
.steps h3{font-size:19px;margin-bottom:6px}
.steps p{color:var(--ink-soft);font-size:16px}

/* ---------- 連携図 ---------- */
.network{display:grid;gap:14px;justify-items:center;text-align:center}
.network__row{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;align-items:center;width:100%}
.node{
  background:#fff;border:2px dashed #BFD79A;border-radius:999px;
  padding:14px 22px;font-family:"Zen Maru Gothic",sans-serif;font-weight:700;
  color:var(--deep);font-size:16px;min-width:180px;
}
.node small{display:block;font-family:"Noto Sans JP",sans-serif;font-weight:400;font-size:13px;color:var(--ink-soft)}
.node--center{
  background:linear-gradient(140deg,#FBE3E6,#F7CDD3);border:0;color:#B23E50;
  padding:22px 30px;font-size:19px;
}
.network__link{width:2px;height:20px;background:#CFE0B0}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:14px}
.faq details{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);overflow:hidden;
}
.faq summary{
  display:flex;gap:12px;align-items:flex-start;cursor:pointer;list-style:none;
  padding:20px 22px;font-family:"Zen Maru Gothic",sans-serif;font-weight:700;
  font-size:17px;color:var(--deep);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"Q";flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:var(--pale);color:var(--green);display:grid;place-items:center;font-size:15px}
.faq details[open] summary{background:var(--pale)}
.faq .answer{display:flex;gap:12px;padding:18px 22px 24px;color:var(--ink-soft);font-size:16px;border-top:1px dashed var(--line)}
.faq .answer::before{content:"A";flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:#FBE9EC;color:var(--red);display:grid;place-items:center;font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:15px}

/* ---------- テーブル ---------- */
.table{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.table th,.table td{padding:16px 18px;text-align:left;border-bottom:1px solid var(--line);font-size:16px;vertical-align:top}
.table th{background:var(--pale);color:var(--deep);width:38%;font-weight:700}
.table tr:last-child th,.table tr:last-child td{border-bottom:0}

/* ---------- 画像プレースホルダ ---------- */
.ph{
  display:grid;place-items:center;text-align:center;
  background:
    repeating-linear-gradient(135deg,#EDF2E2 0 10px,#F6F9EF 10px 20px);
  border:1px dashed #C6D6AB;border-radius:var(--radius);
  color:#7C8B68;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;
  padding:20px;aspect-ratio:4/3;
}
.ph--portrait{aspect-ratio:3/4}
.ph--wide{aspect-ratio:16/9}

/* ---------- お問い合わせフォーム ---------- */
.form{display:grid;gap:22px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px 22px;box-shadow:var(--shadow)}
@media (min-width:768px){.form{padding:36px}}
.field{display:grid;gap:8px}
.field>label{font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:16px;color:var(--deep)}
.req{color:var(--red);font-size:14px;margin-left:6px}
.field input,.field select,.field textarea{
  width:100%;min-height:52px;padding:13px 14px;font-size:16px;font-family:inherit;color:var(--ink);
  background:#FEFEFB;border:1.5px solid #D8DECB;border-radius:12px;
}
.field textarea{min-height:150px;line-height:1.8}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--green);outline:2px solid rgba(111,174,62,.2)}
.form-note{background:var(--pale);border-radius:12px;padding:16px 18px;font-size:16px;display:grid;gap:4px;color:var(--brown)}
.form-status{font-size:16px;font-weight:700;color:var(--deep)}
.thanks{background:var(--pale);border:1px solid #CFE0B0;border-radius:var(--radius);padding:28px 24px;display:grid;gap:10px}
.thanks h2{font-size:22px}

/* ---------- ヒーロー ---------- */
.hero{
  background:
    radial-gradient(120% 80% at 85% 0%,#FFFFFF 0%,rgba(255,255,255,0) 60%),
    linear-gradient(180deg,#F1F7E8 0%,#FDFCF7 100%);
  padding-block:36px 52px;
}
.hero__inner{display:grid;gap:26px;justify-items:center;text-align:center}
.hero__logo{width:min(240px,62vw);height:auto}
.hero__tag{
  display:inline-block;background:#fff;border:1px solid #CFE0B0;border-radius:999px;
  padding:7px 18px;font-size:14px;font-weight:700;color:var(--deep);
}
.hero h1{font-size:clamp(27px,4.4vw,46px);line-height:1.45}
.hero h1 em{font-style:normal;color:var(--green);position:relative}
.hero__sub{font-size:clamp(16px,3.6vw,20px);color:var(--brown);font-weight:500}
@media (min-width:1060px){
  .hero{padding-block:56px 84px}
  .hero__inner{grid-template-columns:1.15fr .85fr;justify-items:start;text-align:left;align-items:center;gap:40px}
  .hero__logo{width:100%;max-width:340px;justify-self:center}
  .hero__body{display:grid;gap:22px;justify-items:start}
}

/* ---------- CTA帯 ---------- */
.cta{background:linear-gradient(180deg,#F1F7E8,#E7F1D8);padding-block:56px}
.cta__inner{display:grid;gap:18px;justify-items:center;text-align:center}
.cta h2{font-size:clamp(22px,5vw,30px)}
.cta p{color:var(--brown);font-size:17px}
.tel-big{
  display:inline-flex;align-items:center;gap:10px;
  font-family:"Zen Maru Gothic",sans-serif;font-weight:700;
  font-size:clamp(26px,6vw,36px);color:var(--red);text-decoration:none;
}
.tel-big:hover{color:#c9455a}
.tel-note{font-size:14px;color:var(--ink-soft)}

/* ---------- フッター ---------- */
.site-footer{background:var(--deep);color:#EEF4E4;padding-block:40px 24px;margin-top:0}
.site-footer a{color:#EEF4E4}
.site-footer a:hover{color:#CFE7AB}
.footer-main{max-width:1080px;margin-inline:auto;display:flex;flex-wrap:wrap;align-items:flex-start;gap:36px 64px;padding-bottom:32px}
.footer-main>*{flex:1 1 300px}
.footer-office .name{font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:21px;color:#fff;line-height:1.4}
.footer-sub{font-size:14px;color:#CFE7AB;margin-top:2px}
.footer-info{font-size:15px;display:grid;gap:6px;margin-top:16px;line-height:1.9}
.footer-nav h2{font-size:15px;color:#CFE7AB;font-family:"Noto Sans JP",sans-serif;margin-bottom:10px;letter-spacing:.06em;font-weight:500}
.footer-nav ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:2px 28px;font-size:15px;line-height:2}
.footer-nav a{text-decoration:none}
.footer-nav a:hover{text-decoration:underline;text-underline-offset:.2em}

.footer-ongroup{
  max-width:1080px;margin-inline:auto;
  border-top:1px solid rgba(255,255,255,.25);
  padding-block:32px;display:grid;gap:6px;justify-items:center;text-align:center;
}
.footer-brand{
  font-family:"Noto Sans JP",sans-serif;font-weight:500;font-size:16px;
  letter-spacing:.08em;color:#fff;text-decoration:none;transition:color .2s ease;
}
.footer-brand:hover{color:#CFE7AB}
.footer-ongroup__tagline{font-size:12px;color:rgba(255,255,255,.7)}
.copyright{border-top:1px solid rgba(255,255,255,.2);padding-top:20px;font-size:12px;color:rgba(255,255,255,.6);text-align:center}
@media (max-width:600px){
  .footer-main{gap:32px;padding-bottom:32px}
}

/* ---------- 補助 ---------- */
.tbc{
  display:inline-block;background:#FBE9EC;color:#B23E50;border-radius:6px;
  padding:1px 8px;font-size:13px;font-weight:700;margin-inline:4px;
}
.lead{font-size:clamp(17px,3.6vw,20px);color:var(--brown);font-weight:500}
.prose{display:grid;gap:20px}
.prose p{font-size:17px;line-height:2}
.sign{text-align:right;font-family:"Zen Maru Gothic",sans-serif;font-weight:700;color:var(--brown);font-size:17px}
.breadcrumb{font-size:13px;color:var(--ink-soft);padding-block:14px}
.breadcrumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.breadcrumb a{color:var(--ink-soft)}
.page-head{background:var(--pale);padding-block:34px 40px}
.page-head .inner{display:grid;gap:14px;justify-items:center;text-align:center}
.map-frame{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);line-height:0}
.map-frame iframe{width:100%;height:340px;border:0}
.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .card:hover,.btn:hover,.steps>li:hover{transform:none}
}

/* ---------- 麻の葉文様（asanoha）舞い落ち演出 ---------- */
.asanoha-field{
  position:fixed;inset:0;overflow:hidden;
  pointer-events:none;
  z-index:2;
}
.asanoha-piece{
  position:absolute;top:-60px;
  will-change:transform;
  pointer-events:none;
  animation-name:asanoha-fall;
  animation-timing-function:linear;
  animation-iteration-count:1;
}
.asanoha-piece svg{display:block;width:100%;height:100%}
@keyframes asanoha-fall{
  from{transform:translate3d(0,0,0) rotate(0deg)}
  to{transform:translate3d(var(--drift,20px),108vh,0) rotate(var(--spin,220deg))}
}
.site-header{z-index:50}
main{position:relative;z-index:1}
.site-footer{position:relative;z-index:3}

/* 静的アクセント（透過5〜8%・1ページ2箇所まで） */
.asanoha-bg{position:relative;isolation:isolate}
.asanoha-bg::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  opacity:.07;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='42' viewBox='0 0 48 42'%3E%3Cg fill='none' stroke='%233E7A33' stroke-width='1'%3E%3Cpolygon points='24,3 42,13.5 42,34.5 24,45 6,34.5 6,13.5'/%3E%3Cpath d='M24 24 L24 3 M24 24 L42 13.5 M24 24 L42 34.5 M24 24 L24 45 M24 24 L6 34.5 M24 24 L6 13.5 M24 24 L33 8.25 M24 24 L42 24 M24 24 L33 39.75 M24 24 L15 39.75 M24 24 L6 24 M24 24 L15 8.25'/%3E%3C/g%3E%3C/svg%3E");
  background-size:96px 84px;
}
@media (prefers-reduced-motion:reduce){
  .asanoha-field{display:none}
}

/* ==========================================================================
   ONGROUP標準CSS確定版 ／ 全文改行強制・最終版（絶対最下部）
   ========================================================================== */
*{
  word-break:normal !important;
  overflow-wrap:anywhere !important;
  line-break:auto !important;
  white-space:normal !important;
}
/* === ヘッダー折り返し例外（最終版ブロックの直後・削除禁止） === */
.header-tel,
.brand__name,
.brand__sub,
.main-nav a,
.footer-brand {
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
}