
:root{--green:#285842;--deep:#193f31;--sage:#eaf1eb;--sage2:#f1f6f2;--beige:#f8f6f1;--ink:#24312b;--muted:#5f6e65;--line:#e4e9e4;--gold:#b68757;--amber:#c98a2e;--amber-soft:#fff2d7;--ojo:#7a4fb3;--ojo-soft:#f3eefa}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;color:var(--ink);background:#fff;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;line-height:1.85;font-size:16px}
a{color:var(--green)}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{text-wrap:balance}
.nb{display:inline-block}
.shell{max-width:1200px;margin:0 auto;padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}
.eyebrow{color:#488169;letter-spacing:.13em;font-size:12px;font-weight:800}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:8px;padding:14px 24px;font-size:15px;font-weight:700;border:1px solid var(--green);background:var(--green);color:#fff;text-decoration:none;transition:.2s}
.btn:hover{background:var(--deep);transform:translateY(-1px)}
.btn.outline{background:#fff;color:var(--green)}
.btn.outline:hover{background:#f0f5f0}
.btn.ojo{background:var(--ojo);border-color:var(--ojo)}
/* ヘッダー */
.hd{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.hd .shell{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--deep);white-space:nowrap}
.brand svg{width:34px;height:34px;flex:none}
.brand b{font-size:22px;font-weight:800;letter-spacing:-.03em;display:block;line-height:1.2}
.brand small{display:block;font-size:10px;letter-spacing:.14em;color:#668477;line-height:1.3}
.links{display:flex;align-items:center;gap:22px;font-size:13px;font-weight:700}
.links a{color:var(--ink);text-decoration:none;white-space:nowrap}
.links a:hover{color:#408569}
.links .btn{color:#fff;padding:11px 18px}
.links .login{color:var(--muted);font-weight:500}
@media (max-width:1020px){.links .pc{display:none}}
@media (max-width:520px){.brand small{display:none}.brand b{font-size:19px}.links{gap:12px}.links .btn{padding:9px 14px}}
/* ヒーロー */
.hero{background:linear-gradient(110deg,#f5f8f3 0%,#f7f5f1 100%);overflow:hidden}
.hero-grid{min-height:620px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:40px;padding-top:40px;padding-bottom:40px}
.hero h1{font-size:clamp(34px,4.3vw,58px);letter-spacing:-.05em;line-height:1.42;margin:18px 0 22px;color:var(--deep);font-weight:800}
.hero h1 em{font-style:normal;color:#6f927c}
.hero .lead{color:#4f6157;font-size:17px;max-width:560px}
.hero .lead p{margin:0}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0 24px}
.chips{display:flex;gap:9px;flex-wrap:wrap;margin:0;padding:0;list-style:none}
.chips li{font-size:13px;background:#fff;border:1px solid #d8e4da;border-radius:25px;padding:6px 14px;color:#3f6a51;font-weight:700}
.hero-art{position:relative;height:540px}
.hero-art>img{width:100%;height:100%;object-fit:cover;object-position:38% center;border-radius:185px 185px 16px 16px}
.callout{position:absolute;bottom:40px;left:-30px;background:#fff;box-shadow:0 16px 45px rgba(24,59,46,.16);border-radius:15px;padding:16px 22px;min-width:250px;display:flex;gap:12px;align-items:center}
.callout strong{display:block;font-size:15px}
.callout small{color:#738076;font-size:12px}
.status{width:38px;height:38px;background:#e3f2e7;display:grid;place-items:center;border-radius:50%;flex:none}
.status svg{width:20px;height:20px;fill:none;stroke:#30804d;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:900px){.hero-grid{grid-template-columns:1fr;gap:10px;padding-top:36px}.hero-art{height:420px;max-width:640px;width:100%;margin:auto}}
@media (max-width:600px){.hero h1{font-size:34px}.hero .lead{font-size:15px}.hero-art{height:320px}.hero-art>img{border-radius:120px 120px 12px 12px}.callout{left:8px;bottom:14px;padding:10px 14px;min-width:0}}
/* 欄 */
.section{padding:96px 0}
.section.alt{background:var(--beige)}
.section.sage{background:var(--sage2)}
.section.deep{background:var(--deep);color:#fff}
.intro{text-align:center;max-width:820px;margin:0 auto 44px}
.intro h2{font-size:clamp(27px,3.2vw,40px);color:var(--deep);line-height:1.45;letter-spacing:-.04em;margin:12px 0;font-weight:800}
.intro p{color:var(--muted);font-size:15px;margin:0}
.section.deep .intro h2{color:#fff}
.section.deep .intro p{color:#c9dccf}
.section.deep .eyebrow{color:#9fd0b2}
@media (max-width:600px){.section{padding:68px 0}}
/* 2つの入口 */
.persona{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.persona-card{border:1px solid var(--line);background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 8px 35px rgba(40,67,53,.05);display:flex;flex-direction:column}
.persona-photo{height:250px;overflow:hidden;background:#e6eee6}
.persona-photo img{width:100%;height:100%;object-fit:cover}
.persona-body{padding:28px 32px 32px;display:flex;flex-direction:column;flex:1}
.tag{display:inline-block;font-size:11px;letter-spacing:.08em;font-weight:800;color:#579173}
.persona h3{font-size:24px;color:var(--deep);margin:8px 0 12px;line-height:1.5}
.persona p{color:var(--muted);margin:0 0 16px}
.bullets{padding:0;list-style:none;margin:0 0 22px}
.bullets li{padding:5px 0 5px 28px;font-size:15px;position:relative}
.bullets li::before{content:"";position:absolute;left:4px;top:13px;width:12px;height:7px;border-left:2.5px solid #4d9671;border-bottom:2.5px solid #4d9671;transform:rotate(-45deg)}
.textlink{font-weight:800;color:var(--green);font-size:15px;text-decoration:none;margin-top:auto}
@media (max-width:760px){.persona{grid-template-columns:1fr}.persona-body{padding:24px}}
/* 一人暮らし（メイン） */
.pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.pillar{background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px 26px}
.pillar .ic{width:54px;height:54px;border-radius:16px;background:var(--sage);display:grid;place-items:center;margin-bottom:14px}
.pillar .ic svg{width:28px;height:28px;fill:none;stroke:var(--green);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.pillar h3{font-size:20px;color:var(--deep);margin:0 0 8px}
.pillar p{margin:0;color:var(--muted);font-size:15px}
.pillar .how{margin-top:12px;font-size:13px;background:var(--sage2);border-radius:10px;padding:10px 12px;color:#3f5c4b}
@media (max-width:900px){.pillars{grid-template-columns:1fr}}
.kit{margin-top:48px;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:36px;align-items:center}
.kit h3{font-size:26px;color:var(--deep);margin:8px 0 10px;line-height:1.5}
.kit p{color:var(--muted);margin:0}
.kit p.kit-net{margin-top:10px;padding:10px 14px;background:var(--sage);border-radius:10px;color:var(--ink);font-size:.95em}
.kit p.kit-net b{color:var(--deep)}
.kit-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.kit-item{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.kit-item .ph{aspect-ratio:4/3;background:var(--sage);display:grid;place-items:center;overflow:hidden}
.kit-item .ph img{width:100%;height:100%;object-fit:cover}
.kit-item .ph svg{width:64px;height:64px;fill:none;stroke:var(--green);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.kit-item div.t{padding:12px 14px}
.kit-item b{display:block;color:var(--deep)}
.kit-item small{color:var(--muted);font-size:13px;line-height:1.6;display:block}
@media (max-width:900px){.kit{grid-template-columns:1fr}}
@media (max-width:600px){.kit-items{grid-template-columns:1fr}.kit-item{display:grid;grid-template-columns:120px 1fr;align-items:center}.kit-item .ph{aspect-ratio:auto;height:100%;min-height:96px}.kit-item .ph svg{width:44px;height:44px}}
/* 知らせ方の流れ */
.flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:8px;counter-reset:s}
.step{padding:24px 20px;background:#fff;border-radius:14px;border:1px solid #e3eae4;position:relative}
.step b{font-size:12px;color:#83a68f;letter-spacing:.1em}
.step .ic{width:46px;height:46px;border-radius:50%;background:var(--sage);display:grid;place-items:center;margin:12px 0 10px}
.step .ic svg{width:24px;height:24px;fill:none;stroke:var(--green);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.step h3{font-size:17px;color:var(--deep);margin:0 0 6px}
.step p{font-size:14px;color:#62705f;margin:0}
.step.alert{border-color:#f0d39c;background:#fffaf0}
.step.alert .ic{background:var(--amber-soft)}
.step.alert .ic svg{stroke:var(--amber)}
.step:not(:last-child)::after{content:"";position:absolute;right:-12px;top:50%;width:10px;height:10px;border-top:2px solid #9fbba9;border-right:2px solid #9fbba9;transform:translateY(-50%) rotate(45deg)}
.small-note{font-size:12px;color:#748177;text-align:center;margin:18px 0 0}
@media (max-width:900px){.flow{grid-template-columns:1fr 1fr}.step:nth-child(2)::after{display:none}}
@media (max-width:520px){.flow{grid-template-columns:1fr}.step::after{display:none}}
/* 家・会社 */
.places{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.place{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;display:flex;flex-direction:column}
.place .ph{height:220px;overflow:hidden}
.place .ph img{width:100%;height:100%;object-fit:cover}
.place .body{padding:26px 30px 28px}
.place h3{font-size:23px;color:var(--deep);margin:6px 0 4px}
.place .who{color:#4d8a69;font-weight:700;font-size:15px;margin:0 0 14px}
.place .row{display:grid;grid-template-columns:30px 1fr;gap:10px;padding:12px 0;border-top:1px dashed var(--line)}
.place .row svg{width:24px;height:24px;fill:none;stroke:var(--green);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;margin-top:3px}
.place .row b{display:block;color:var(--deep)}
.place .row p{margin:2px 0 0;font-size:15px;color:var(--muted)}
.more-places .place .pic{height:180px;overflow:hidden}
.more-places .place .pic img{display:block;width:100%;height:100%;object-fit:cover}
.more-places .place .body{padding:22px 26px 24px}
.more-places .place h3{font-size:20px;margin:6px 0 10px}
.more-places .place .ex{display:block;margin:0 0 14px}
.more-places .place .ex li{font-size:15px;background:none;border:0;border-radius:0;padding:5px 0 5px 22px;position:relative;color:var(--muted)}
.more-places .place .ex li::before{content:"";position:absolute;left:4px;top:13px;width:8px;height:8px;border-radius:50%;background:var(--green)}
.place .ex{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;padding:0;list-style:none}
.place .ex li{font-size:12px;background:var(--sage2);border:1px solid #d8e4da;border-radius:20px;padding:3px 10px;color:#3f6a51}
@media (max-width:760px){.places{grid-template-columns:1fr}.place .body{padding:22px}}
/* できること */
.features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.feature{border:1px solid var(--line);border-radius:15px;padding:28px 26px;background:#fff}
.feature .ic{width:50px;height:50px;border-radius:14px;background:var(--sage);display:grid;place-items:center}
.feature .ic svg{width:26px;height:26px;fill:none;stroke:var(--green);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.feature h3{font-size:18px;color:var(--deep);margin:14px 0 6px}
.feature p{font-size:15px;color:var(--muted);margin:0}
@media (max-width:900px){.features{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.features{grid-template-columns:1fr}}
/* 管理画面 */
.dashboard-grid{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:64px}
.dashboard-grid h2{font-size:clamp(27px,3vw,36px);line-height:1.5;color:var(--deep);letter-spacing:-.04em;margin:10px 0}
.dashboard-grid>div>p{color:var(--muted)}
.dashboard{border:1px solid #dbe6dc;border-radius:15px;overflow:hidden;box-shadow:0 20px 60px rgba(40,75,50,.13);background:#fff}
.dash-top{padding:18px 22px;background:#315d48;color:#fff;display:flex;justify-content:space-between;align-items:center}
.dash-top strong{font-size:16px}
.dash-top small{font-size:12px;opacity:.85}
.dash-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:16px;background:#f7faf7}
.dash-summary div{border-radius:10px;background:#fff;padding:12px;text-align:center}
.dash-summary strong{display:block;font-size:24px;color:var(--green)}
.dash-summary small{font-size:11px;color:#66756a}
.dash-actions{display:flex;gap:8px;padding:10px 16px}
.filter{border:1px solid #d5e3d7;border-radius:6px;background:#fff;padding:5px 14px;font-size:12px;font:inherit;font-size:12px;cursor:pointer}
.filter.active{background:var(--green);color:#fff;border-color:var(--green)}
.unit{padding:12px 22px;border-top:1px solid #eff2ef;display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:14px}
.unit small{display:block;color:#7b887d;font-size:12px}
.pill{border-radius:25px;font-size:11px;background:#e8f3e9;color:#32764a;padding:5px 11px;white-space:nowrap}
.pill.warning{color:#9a6a1c;background:#fff2d7}
.notice{font-size:12px;color:#7f8a81;padding:10px 22px;background:#fafafa}
@media (max-width:900px){.dashboard-grid{grid-template-columns:1fr;gap:28px}}
@media (max-width:520px){.unit{padding:11px 14px}.dash-summary{padding:10px}}
/* 管理会社さまへ */
.mgr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.mgr .s{background:#fff;border:1px solid var(--line);border-radius:16px;padding:24px}
.mgr .s b{font-size:12px;color:#83a68f;letter-spacing:.1em}
.mgr .s h3{font-size:18px;color:var(--deep);margin:6px 0 6px}
.mgr .s p{margin:0;font-size:15px;color:var(--muted)}
@media (max-width:900px){.mgr{grid-template-columns:1fr}}
.ojo-box{margin-top:28px;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:30px;align-items:center;background:var(--ojo-soft);border-radius:20px;padding:32px}
.ojo-box h3{font-size:24px;margin:6px 0 10px;color:#3f2a5c}
.ojo-box p{margin:0 0 16px;color:#5d5170}
.ojo-box .eyebrow{color:var(--ojo)}
.ojo-box img{border-radius:16px;width:100%;max-height:300px;object-fit:cover}
@media (max-width:760px){.ojo-box{grid-template-columns:1fr;padding:22px}}
/* はじめ方 */
.mini-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.mini-step{border-left:3px solid #8da995;padding:4px 0 4px 20px}
.mini-step strong{display:block;color:var(--deep);font-size:17px}
.mini-step p{font-size:14px;color:var(--muted);margin:4px 0 0}
@media (max-width:760px){.mini-steps{grid-template-columns:1fr}}
/* よくある質問 */
.qa{max-width:820px;margin:auto}
.qa details{padding:18px 6px;border-bottom:1px solid var(--line)}
.qa summary{font-weight:700;cursor:pointer;color:var(--deep)}
.qa p{color:var(--muted);font-size:15px;margin:10px 0 0}
/* お知らせ */
.news-row{display:grid;grid-template-columns:minmax(0,.4fr) minmax(0,1fr);gap:40px;align-items:start}
.news-row h2{font-size:clamp(26px,3vw,34px);color:var(--deep);margin:8px 0}
.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:110px 1fr;gap:16px;padding:18px 4px;color:var(--ink);text-decoration:none}
.news-list a:hover b{color:var(--green)}
.news-list time{color:var(--muted);font-size:14px}
.news-list .none{padding:18px 4px;color:var(--muted)}
.news-list li:not(.none) ~ .none{display:none}
@media (max-width:760px){.news-row{grid-template-columns:1fr;gap:16px}.news-list a{grid-template-columns:1fr;gap:2px}}
/* お問い合わせ */
.contact{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:48px;align-items:start}
.contact h2{font-size:clamp(27px,3vw,36px);margin:10px 0 16px;line-height:1.5}
.contact .side p{color:#d5e3d9}
.contact .mail{font-size:18px;color:#fff;user-select:all;font-weight:700}
.contact .btn.outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.formbox{background:#fff;color:var(--ink);border-radius:18px;padding:30px}
.formbox .inq-form button[type=submit]{background:var(--green);border-color:var(--green)}
.formbox .inq-form button[type=submit]:hover{background:var(--deep)}
@media (max-width:900px){.contact{grid-template-columns:1fr}.formbox{padding:22px 18px}}
/* 下のページ */
.page{padding:60px 0 96px;background:var(--beige)}
.page h1{font-size:clamp(26px,3.4vw,36px);margin:0 0 26px;color:var(--deep)}
.page .body{max-width:780px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:32px}
.page .body h2{font-size:20px;margin:26px 0 8px;color:var(--deep)}
.page .body h2:first-child{margin-top:0}
.page .meta{color:var(--muted)}
.pager{display:flex;justify-content:space-between;gap:16px;max-width:780px;margin-top:24px;font-size:15px}
.crumb{font-size:13px;color:var(--muted);margin-bottom:12px}
.crumb a{color:var(--muted)}
/* フッター */
.ft{background:#f5f7f3;border-top:1px solid var(--line);padding:44px 0 calc(36px + env(safe-area-inset-bottom,0px));color:#5f7066;font-size:14px}
.ft .shell{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px}
.ft nav{display:flex;flex-wrap:wrap;gap:8px 20px;align-content:start;max-width:620px}
.ft nav a{color:var(--ink);text-decoration:none}
.ft .copy{grid-column:1/-1;border-top:1px solid var(--line);padding-top:18px;font-size:13px}
@media (max-width:760px){.ft .shell{grid-template-columns:1fr}}

/* 動きで見る */
.demo{background:linear-gradient(180deg,#fff, var(--sage2))}
.demo-tabs{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0 0 26px}
.demo-tabs button{font:inherit;font-size:14px;font-weight:700;border:1px solid #cfdfd3;background:#fff;color:var(--green);border-radius:999px;padding:9px 18px;cursor:pointer}
.demo-tabs button[aria-selected=true]{background:var(--green);border-color:var(--green);color:#fff}
.demo-stage{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr) 270px;gap:22px;align-items:start;background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px;box-shadow:0 18px 50px rgba(40,75,50,.08)}
.tl{list-style:none;margin:0;padding:0;display:grid;gap:6px;counter-reset:t}
.tl li button{width:100%;text-align:left;font:inherit;display:grid;grid-template-columns:66px 1fr;gap:10px;align-items:start;background:transparent;border:1px solid transparent;border-radius:12px;padding:10px 10px;cursor:pointer;color:var(--ink)}
.tl li button:hover{background:var(--sage2)}
.tl time{font-weight:800;color:#7c9886;font-size:14px;padding-top:1px}
.tl b{display:block;font-size:15px;line-height:1.45}
.tl small{display:none;color:var(--muted);font-size:13px;line-height:1.6;margin-top:4px}
.tl li.on button{background:var(--sage);border-color:#cfe0d4}
.tl li.on time{color:var(--green)}
.tl li.on small{display:block}
.tl li.on.alert button{background:#fff6e6;border-color:#f0d39c}
.tl li.on.alert time{color:var(--amber)}
.tl li.done time{color:var(--green)}
.roomwrap{position:relative}
.roomwrap .place{position:absolute;left:14px;top:12px;font-size:12px;font-weight:800;color:#6f927c;letter-spacing:.06em;background:#fff;border-radius:999px;padding:2px 10px;border:1px solid var(--line)}
.room{width:100%;height:auto;display:block}
.room .floor{fill:#f6f8f4;stroke:#dfe8e0;stroke-width:2}
.room .wall{fill:none;stroke:#9db8a6;stroke-width:6;stroke-linecap:round}
.room .wall.thin{stroke-width:4;opacity:.6}
.room .doorline{stroke:#e0a85a;stroke-width:4;stroke-dasharray:6 6}
.room .hubg rect{fill:#285842}
.room .hubg text,.room .dev text{font-size:13px;font-weight:700;fill:#5f6e65;text-anchor:middle;font-family:inherit}
.room .dev{transition:opacity .3s}
.room .dev.off{display:none}
.room .dev .base{fill:#fff;stroke:#c9d9cd;stroke-width:2;transition:fill .3s,stroke .3s}
.room .dev .halo{fill:#4d9671;opacity:0;transform-box:fill-box;transform-origin:center}
.room .dev .ic{fill:none;stroke:#285842;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.room .dev.lit .base{fill:#285842;stroke:#285842}
.room .dev.lit .ic{stroke:#fff}
.room .dev.lit .halo{animation:halo 1.6s ease-out infinite}
.room.alert .dev.lit .base{fill:#c98a2e;stroke:#c98a2e}
.room.alert .dev.lit .halo{fill:#c98a2e}
@keyframes halo{0%{opacity:.45;transform:scale(.8)}100%{opacity:0;transform:scale(1.7)}}
.ctrl{display:flex;gap:8px;align-items:center;justify-content:center;margin-top:8px}
.ctrl button{font:inherit;font-size:13px;border:1px solid #cfdfd3;background:#fff;border-radius:8px;padding:6px 12px;cursor:pointer;color:var(--green);font-weight:700}
.ctrl .bar{flex:1;max-width:180px;height:4px;border-radius:2px;background:#e3ebe5;overflow:hidden}
.ctrl .bar i{display:block;height:100%;width:0;background:var(--green);transition:width .4s}
/* スマホの画面（見本） */
.ph{justify-self:center;width:100%;max-width:260px;border-radius:34px;background:#1f2a25;padding:10px;box-shadow:0 22px 50px rgba(20,40,30,.25)}
.ph .sc{border-radius:26px;background:#f4f6f3;min-height:430px;overflow:hidden;display:flex;flex-direction:column;font-size:13px;line-height:1.5}
.ph .top{background:#285842;color:#fff;padding:14px 16px 12px}
.ph .top small{display:block;opacity:.8;font-size:11px}
.ph .top b{font-size:15px}
.ph .stat{margin:12px;border-radius:14px;padding:14px;background:#fff;border:1px solid #dfe8e0;display:flex;align-items:center;gap:10px;font-weight:800;font-size:15px}
.ph .stat i{width:12px;height:12px;border-radius:50%;background:#3fae6a;flex:none;box-shadow:0 0 0 4px rgba(63,174,106,.18)}
.ph .stat.wait i{background:#9db8a6;box-shadow:0 0 0 4px rgba(157,184,166,.2)}
.ph .stat.out i{background:#4a7bd0;box-shadow:0 0 0 4px rgba(74,123,208,.18)}
.ph .stat.warn{background:#fff6e6;border-color:#f0d39c;color:#8a5a12}
.ph .stat.warn i{background:#d9822b;box-shadow:0 0 0 4px rgba(217,130,43,.22)}
.ph .nt{margin:0 12px 8px;background:#fff;border-radius:12px;padding:9px 12px;border:1px solid #e6ece7;animation:pop .35s ease}
.ph .nt time{display:block;font-size:11px;color:#7c8a80;font-weight:700}
.ph .lbl{margin:4px 14px 6px;font-size:11px;color:#7c8a80;font-weight:700}
.ph .call{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px 16px;background:linear-gradient(180deg,#2c5f48,#173b2c);color:#fff;text-align:center}
.ph .call.urgent{background:linear-gradient(180deg,#9a5a14,#5a3207)}
.ph .call .who{font-size:11px;opacity:.8}
.ph .call .av{width:68px;height:68px;border-radius:50%;background:rgba(255,255,255,.15);display:grid;place-items:center;animation:ring 1.2s ease-in-out infinite}
.ph .call .av svg{width:34px;height:34px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ph .call b{font-size:15px}
.ph .call p{margin:0;font-size:12px;opacity:.92;background:rgba(255,255,255,.1);border-radius:10px;padding:8px 10px}
.ph .call .bts{display:flex;gap:26px;margin-top:6px}
.ph .call .bts span{width:44px;height:44px;border-radius:50%;background:#d9473b;display:block}
.ph .call .bts span+span{background:#3fae6a}
.ph .cap{font-size:11px;color:#7c8a80;text-align:center;padding:8px}
@keyframes pop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes ring{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@media (prefers-reduced-motion:reduce){.room .dev.lit .halo,.ph .nt,.ph .call .av{animation:none}}
@media (max-width:1000px){.demo-stage{grid-template-columns:minmax(0,1fr) 250px}.tl{grid-column:1/-1;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.tl small{display:none!important}}
@media (max-width:640px){.demo-stage{grid-template-columns:1fr;padding:14px}.tl{grid-template-columns:1fr;gap:2px}.tl li button{padding:7px 8px}.tl b{font-size:14px}.ph{max-width:240px}.ph .sc{min-height:330px}}
.demo-now{display:none}
@media (max-width:1000px){.demo-now{display:block;grid-column:1/-1;background:var(--sage2);border-radius:12px;padding:10px 14px;font-size:14px}.demo-now b{color:var(--deep)}}

/* 実際の画面 */
.shots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.shots figure{margin:0;display:flex;flex-direction:column;gap:14px}
.phf{border-radius:30px;background:#1f2a25;padding:8px;box-shadow:0 18px 40px rgba(20,40,30,.18)}
.phf img{border-radius:23px;width:100%;height:auto}
.shots figcaption{font-size:14px;color:var(--muted);line-height:1.7}
.shots figcaption b{display:block;color:var(--deep);font-size:17px;margin-bottom:2px}
@media (max-width:1000px){.shots{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.shots{grid-template-columns:1fr 1fr;gap:14px}.phf{border-radius:22px;padding:5px}.phf img{border-radius:18px}.shots figcaption{font-size:12px}.shots figcaption b{font-size:15px}}
.opshots{position:relative}
.brw{margin:0;border-radius:12px;overflow:hidden;background:#fff;border:1px solid #dbe6dc;box-shadow:0 20px 60px rgba(40,75,50,.15)}
.brw .bar{height:26px;background:#eef2ee;display:flex;align-items:center;gap:6px;padding:0 12px}
.brw .bar i{width:9px;height:9px;border-radius:50%;background:#cbd6cd}
.brw img{width:100%;height:auto}
.brw.sub{width:62%;margin:-28% 0 0 auto;position:relative;box-shadow:0 24px 60px rgba(20,40,30,.28)}
.opshots .cap{font-size:13px;color:var(--muted);margin:12px 0 0}
@media (max-width:600px){.brw.sub{width:80%;margin-top:-18%}}

/* 季節（2026-10-29 remohelp.jp のように）：季節の写真をトップの背景にうすくぼかして敷く（season.js の still）。左は白っぽく、右へいくほど写真が見える */
.hero{position:relative}
.hero .season-still{filter:blur(1px) saturate(1.08);opacity:0;background-size:auto 100%!important;background-position:right center!important;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%);mask-image:linear-gradient(90deg,transparent 0,#000 30%)}
@media (max-width:900px){.hero .season-still{background-size:150% auto!important;background-position:center bottom!important;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 45%);mask-image:linear-gradient(180deg,transparent 0,#000 45%)}}
.hero .season-still.on{opacity:.9}
.hero.season-on::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(247,248,244,.96) 0%,rgba(247,248,244,.9) 34%,rgba(247,248,244,.55) 62%,rgba(247,248,244,.3) 100%)}
.hero .hero-grid{position:relative;z-index:1}
@media (max-width:900px){.hero.season-on::after{background:linear-gradient(180deg,rgba(247,248,244,.95) 0%,rgba(247,248,244,.9) 55%,rgba(247,248,244,.45) 100%)}}
/* 今月の見守りのひとこと：見出しの上の札（「10月」の印つき） */
.season-tip{display:flex;align-items:flex-start;gap:10px;margin:14px 0 0;max-width:600px;background:rgba(255,255,255,.88);border:1px solid #d8e4da;
  border-radius:16px;padding:8px 14px 8px 8px;font-size:14px;color:#3d5246;line-height:1.7;box-shadow:0 6px 20px rgba(40,67,53,.06)}
.season-tip .mon{flex:none;background:var(--green);color:#fff;border-radius:999px;padding:2px 11px;font-size:13px;font-weight:800;line-height:1.7}
.season-tip .mon:empty{display:none}
@media (max-width:600px){.season-tip{font-size:13px}}

/* 一人暮らしの見守り：写真・図・動き（single_figs.py） */
.sg-story{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:36px;align-items:center;margin-bottom:40px}
.sg-photo{position:relative;margin:0;border-radius:22px;overflow:hidden;box-shadow:0 22px 50px rgba(40,75,50,.15)}
.sg-photo img{width:100%;aspect-ratio:4/3;object-fit:cover}
.sg-photo figcaption{position:absolute;left:16px;bottom:16px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:rgba(255,255,255,.94);border-radius:12px;padding:10px 14px;font-weight:700;color:var(--deep);font-size:15px;box-shadow:0 10px 26px rgba(20,40,30,.15)}
.sg-photo figcaption small{font-weight:500;color:var(--muted);font-size:12px}
.sg-photo .dot{width:11px;height:11px;border-radius:50%;background:#3fae6a;box-shadow:0 0 0 0 rgba(63,174,106,.5);animation:sgPing 2.2s infinite}
@keyframes sgPing{0%{box-shadow:0 0 0 0 rgba(63,174,106,.5)}100%{box-shadow:0 0 0 10px rgba(63,174,106,0)}}
.sg-points{display:grid;gap:14px}
.sg-pt{display:grid;grid-template-columns:52px 1fr;gap:14px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px 20px}
.sg-pt .ic{width:52px;height:52px;border-radius:15px;background:var(--sage);display:grid;place-items:center}
.sg-pt .ic svg{width:27px;height:27px;fill:none;stroke:var(--green);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.sg-pt h3{margin:2px 0 4px;font-size:18px;color:var(--deep)}
.sg-pt p{margin:0;font-size:14.5px;color:var(--muted)}
@media (max-width:900px){.sg-story{grid-template-columns:1fr;gap:22px}}
/* 図の枠 */
.sg-fig{background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px 26px 28px;margin-bottom:22px}
.sg-fh{margin-bottom:20px}
.sg-fh .no{display:inline-block;font-size:12px;font-weight:800;color:#fff;background:var(--green);border-radius:999px;padding:1px 10px;letter-spacing:.06em}
.sg-fh h3{display:inline;margin:0 0 0 8px;font-size:20px;color:var(--deep)}
.sg-fh p{margin:6px 0 0;font-size:14px;color:var(--muted)}
.sf-ic{width:58px;height:58px;border-radius:50%;background:var(--sage);display:grid;place-items:center;margin:0 auto 10px;transition:background .4s,box-shadow .4s}
.sf-ic svg{width:28px;height:28px;fill:none;stroke:var(--green);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transition:stroke .4s}
/* 図1：しくみ */
.sysflow{display:flex;align-items:flex-start;gap:0}
.sf-node{flex:1 1 0;min-width:0;text-align:center;padding:4px 6px}
.sf-node b{display:block;font-size:15px;color:var(--deep);line-height:1.45}
.sf-node small{display:block;font-size:12.5px;color:var(--muted);line-height:1.6;margin-top:4px}
.sf-node.warn .sf-ic{background:var(--amber-soft)}
.sf-node.warn .sf-ic svg{stroke:var(--amber)}
.sf-link{flex:0 0 46px;height:4px;margin-top:27px;border-radius:2px;background:#dfe9e1;position:relative;overflow:hidden}
.sf-link i{position:absolute;inset:0;background:repeating-linear-gradient(90deg,var(--green) 0 10px,transparent 10px 20px);opacity:0}
.sf-link.warn i{background:repeating-linear-gradient(90deg,var(--amber) 0 10px,transparent 10px 20px)}
.play .sf-link i{opacity:1;animation:sfFlow .9s linear infinite}
@keyframes sfFlow{from{background-position:0 0}to{background-position:20px 0}}
/* 順に光る（10秒でひとめぐり） */
.play .sf-node .sf-ic{animation:sfLit 10s infinite}
.play .sf-node.n1 .sf-ic{animation-delay:0s}
.play .sf-node.n2 .sf-ic{animation-delay:1.6s}
.play .sf-node.n3 .sf-ic{animation-delay:3.2s}
.play .sf-node.n4 .sf-ic{animation-delay:4.8s}
.play .sf-node.n5 .sf-ic{animation:sfLitWarn 10s infinite 6.4s}
@keyframes sfLit{0%,22%{background:var(--sage);box-shadow:none}4%,16%{background:var(--green);box-shadow:0 0 0 8px rgba(40,88,66,.15)}}
@keyframes sfLitWarn{0%,30%{background:var(--amber-soft);box-shadow:none}4%,24%{background:var(--amber);box-shadow:0 0 0 9px rgba(201,138,46,.2)}}
.play .sf-node:not(.warn) .sf-ic svg{animation:sfIc 10s infinite}
.play .sf-node.n1 .sf-ic svg{animation-delay:0s}.play .sf-node.n2 .sf-ic svg{animation-delay:1.6s}
.play .sf-node.n3 .sf-ic svg{animation-delay:3.2s}.play .sf-node.n4 .sf-ic svg{animation-delay:4.8s}
.play .sf-node.n5 .sf-ic svg{animation:sfIc 10s infinite 6.4s}
@keyframes sfIc{0%,22%{stroke:currentColor}4%,16%{stroke:#fff}}
.sf-node .sf-ic svg{color:var(--green)}.sf-node.warn .sf-ic svg{color:var(--amber)}
@media (max-width:900px){
  .sysflow{flex-direction:column;align-items:stretch}
  .sf-node{display:grid;grid-template-columns:58px 1fr;column-gap:14px;text-align:left;align-items:center;padding:0}
  .sf-node .sf-ic{grid-row:span 2;margin:0}
  .sf-node small{margin-top:0}
  .sf-link{flex:0 0 26px;width:4px;height:26px;margin:4px 0 4px 27px}
  .sf-link i{background:repeating-linear-gradient(180deg,var(--green) 0 8px,transparent 8px 16px)}
  .sf-link.warn i{background:repeating-linear-gradient(180deg,var(--amber) 0 8px,transparent 8px 16px)}
  @keyframes sfFlow{from{background-position:0 0}to{background-position:0 16px}}
}
/* 図2・図3を横にならべる */
.sg-two{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:22px}
.sg-two .sg-fig{margin-bottom:22px}
@media (max-width:900px){.sg-two{grid-template-columns:1fr;gap:0}}
/* 図2：在宅・外出 */
.inout{display:grid;grid-template-columns:auto auto 1fr;gap:16px;align-items:center}
.io-start,.io-mid{text-align:center;font-size:14px;color:var(--deep)}
.io-start b,.io-mid b{display:block;line-height:1.45}
.io-mid small{display:block;color:var(--muted);font-size:12px}
.io-mid .clock{display:block;width:44px;height:44px;margin:0 auto 8px;border-radius:50%;border:3px solid #9fbba9;position:relative}
.io-mid .clock::before,.io-mid .clock::after{content:"";position:absolute;left:50%;bottom:50%;width:3px;border-radius:2px;background:var(--green);transform-origin:50% 100%;margin-left:-1.5px}
.io-mid .clock::before{height:15px}
.io-mid .clock::after{height:11px;transform:rotate(90deg)}
.play .io-mid .clock::before{animation:clk 4s linear infinite}
@keyframes clk{to{transform:rotate(360deg)}}
.io-ways{display:grid;gap:12px}
.io-way{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:10px;border:2px solid var(--line);border-radius:14px;padding:12px 14px;transition:border-color .5s,background .5s,opacity .5s}
.io-q{font-size:13.5px;color:var(--muted)}
.io-q b{color:var(--deep)}
.io-a{font-size:15px;font-weight:700;color:var(--deep);display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.io-a small{flex-basis:100%;font-weight:500;color:var(--muted);font-size:12px}
.pill-s{border-radius:999px;padding:1px 10px;font-size:13px;color:#fff}
.io-way.home .pill-s{background:#3fae6a}
.io-way.out .pill-s{background:#4a7bd0}
.play .io-way.home{animation:ioHome 8s infinite}
.play .io-way.out{animation:ioOut 8s infinite}
@keyframes ioHome{0%,45%{border-color:#3fae6a;background:#f0f9f3;opacity:1}55%,100%{border-color:var(--line);background:#fff;opacity:.55}}
@keyframes ioOut{0%,45%{border-color:var(--line);background:#fff;opacity:.55}55%,100%{border-color:#4a7bd0;background:#f1f5fd;opacity:1}}
@media (max-width:600px){.inout{grid-template-columns:1fr 1fr}.io-ways{grid-column:1/-1}.io-way{grid-template-columns:1fr}}
/* 図3：メーター */
.meter{position:relative;width:min(220px,70%);margin:0 auto}
.meter svg{display:block;width:100%;transform:rotate(-90deg)}
.meter circle{fill:none;stroke-width:10}
.meter .track{stroke:#e3ebe5}
.meter .bar{stroke:var(--green);stroke-linecap:round;stroke-dasharray:314.16;stroke-dashoffset:0;transition:stroke .4s}
.play .meter .bar{animation:meter 8s linear infinite}
@keyframes meter{0%{stroke-dashoffset:314.16}75%,100%{stroke-dashoffset:0}}
.full .meter .bar{stroke:var(--amber)}
.m-in{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.m-in b{font-size:40px;color:var(--deep);line-height:1}
.m-in b small{font-size:14px;margin-left:2px}
.m-s{font-size:12px;color:var(--muted);margin-top:6px}
.full .m-in b{color:var(--amber)}
.m-cap{margin:16px 0 0;font-size:14px;color:var(--muted);text-align:center}
.m-cap b{color:var(--deep)}
.full .m-cap b{color:var(--amber)}
@media (prefers-reduced-motion:reduce){.sg-photo .dot{animation:none}}

/* トップへもどるボタン（右下の丸） */
.totop{position:fixed;right:max(18px,env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:40;width:52px;height:52px;border-radius:50%;
  display:grid;place-items:center;background:var(--green);color:#fff;box-shadow:0 10px 28px rgba(25,63,49,.3);opacity:0;visibility:hidden;transform:translateY(12px);
  transition:opacity .3s,transform .3s,visibility 0s .3s,background .2s}
.totop.on{opacity:1;visibility:visible;transform:none;transition:opacity .3s,transform .3s,visibility 0s,background .2s}
.totop:hover{background:var(--deep)}
.totop:focus-visible{outline:3px solid #9fd0b2;outline-offset:3px}
.totop svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:600px){.totop{width:46px;height:46px}}

/* ── スマホ対策（2026-10-29）：メニュー・文字の大きさ・押しやすさ ── */
.menu-btn{display:none;align-items:center;gap:6px;border:1px solid #cfdfd3;background:#fff;border-radius:10px;padding:8px 11px;font:inherit;font-size:13px;font-weight:700;color:var(--deep);cursor:pointer;min-height:44px}
.menu-btn .bars{display:grid;gap:4px;width:18px}
.menu-btn .bars i{display:block;height:2px;border-radius:1px;background:var(--deep);transition:transform .25s,opacity .25s}
.menu-open .menu-btn .bars i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-open .menu-btn .bars i:nth-child(2){opacity:0}
.menu-open .menu-btn .bars i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.sp-menu{border-top:1px solid var(--line);background:#fff;box-shadow:0 18px 30px rgba(20,40,30,.12);max-height:calc(100vh - 70px);overflow:auto}
.sp-menu .shell{display:grid;padding-top:8px;padding-bottom:16px}
.sp-menu a{display:block;padding:14px 4px;border-bottom:1px solid var(--line);color:var(--deep);text-decoration:none;font-weight:700;font-size:17px}
.sp-menu a.cta{margin-top:14px;border:0;border-radius:10px;background:var(--green);color:#fff;text-align:center}
.sp-menu a.sub{border:0;text-align:center;color:var(--muted);font-weight:500;font-size:15px}
@media (max-width:1020px){.menu-btn{display:inline-flex}}
@media (min-width:1021px){.sp-menu{display:none!important}}
@media (max-width:600px){
  .links .login{display:none}
  .links .btn{padding:9px 13px;font-size:14px}
  .menu-btn .lb{display:none}
  .hd .shell{min-height:64px}
  body{font-size:16.5px;line-height:1.85}
  /* 本文 */
  .hero .lead{font-size:16.5px}
  .intro p,.sg-fh p{font-size:15.5px}
  .feature p,.place .row p,.pillar p,.sg-pt p,.persona p,.qa p,.mgr .s p,.mini-step p,.flow p,.step p,.bullets li,
  .dashboard-grid>div>p,.contact .side p,.ojo-box p,.m-cap,.page .body{font-size:16px}
  /* 小さい文字も 13.5px 以上に */
  .sf-node small,.kit-item small,.io-a small,.io-q,.m-s,.shots figcaption,.place .ex li,.small-note,.opshots .cap,
  .tag,.eyebrow,.callout small,.chips li,.season-tip,.tl small,.demo-now,.news-list time,.ft,.ft .copy{font-size:13.5px}
  .sf-node b,.kit-item b,.io-a,.tl b{font-size:16px}
  .sf-node small{line-height:1.7}
  .shots figcaption b{font-size:16px}
  .ph .sc{font-size:14px}.ph .nt time,.ph .lbl,.ph .cap,.ph .call .who{font-size:12.5px}.ph .call p{font-size:13.5px}
  .pill-s,.sg-fh .no{font-size:13px}
  .faq summary,.qa summary{font-size:16.5px;line-height:1.6}
  .qa details{padding:16px 2px}
  /* 押しやすく */
  .hero-actions{display:grid;grid-template-columns:1fr;gap:10px}
  .hero-actions .btn{min-height:54px;font-size:16px}
  .btn{min-height:50px}
  .demo-tabs button{font-size:15px;padding:11px 16px}
  .ctrl button{min-height:44px;min-width:44px;font-size:14px}
  .ft nav{gap:4px 0}
  .ft nav a{display:inline-block;padding:9px 16px 9px 0;font-size:15px}
  .news-list a{padding:16px 4px}
  .sg-photo figcaption{font-size:14px}
  .sg-photo figcaption small{font-size:13px}
}
.sp-menu .shell{justify-content:stretch;align-items:stretch;min-height:0}
@media (max-width:600px){.io-mid small,.inq-hint,.roomwrap .place,.mgr .s b,.ph .top small{font-size:13.5px}.inq-tag{font-size:12px}}

/* ── 読みやすさ（2026-10-29 ユーザー「スマホで文字が小さい、年寄りは見えない」）──
   スマホでは、ページ全体（文字・ボタン・図）を1割大きく。「文字 大」でさらに大きく（パソコンでも効く） */
@media (max-width:600px){main,.ft{zoom:1.1}}
html.fs-big main,html.fs-big .ft{zoom:1.18}
@media (max-width:600px){html.fs-big main,html.fs-big .ft{zoom:1.3}}
.fs-btn{display:inline-flex;align-items:center;gap:3px;border:1px solid #cfdfd3;background:#fff;border-radius:10px;padding:6px 10px;font:inherit;font-size:12px;font-weight:700;color:var(--deep);cursor:pointer;min-height:44px;white-space:nowrap}
.fs-btn b{font-size:17px;line-height:1}
.fs-btn[aria-pressed=true]{background:var(--green);border-color:var(--green);color:#fff}
@media (max-width:600px){.fs-btn{padding:6px 8px}.links{gap:8px}.brand b{font-size:17px}.brand svg{width:30px;height:30px}.links .btn{padding:8px 11px}}
@media (max-width:600px){.links .btn{display:none}.hd .shell{gap:8px}.brand{min-width:0}.brand span{min-width:0}}
@media (max-width:600px){html.fs-big .hero h1{font-size:27px}html.fs-big .intro h2,html.fs-big .news-row h2,html.fs-big .contact h2,html.fs-big .dashboard-grid h2{font-size:22px}}
.contact .side{min-width:0}.contact .mail{overflow-wrap:anywhere}

/* 運営会社（2026-10-30） */
.about-box{max-width:820px;margin:0 auto;background:#fff;border:1px solid #dbe6dc;border-radius:16px;padding:8px 28px 24px;box-shadow:0 10px 30px rgba(40,67,53,.06)}
.about-tb{width:100%;border-collapse:collapse;font-size:16px;line-height:1.8}
.about-tb th,.about-tb td{padding:14px 6px;border-bottom:1px solid #e3ebe4;text-align:left;vertical-align:top}
.about-tb th{width:8em;color:var(--deep);font-weight:700;white-space:nowrap}
.about-tb a{color:var(--green);font-weight:700;white-space:nowrap}
.about-link{margin:20px 0 0;text-align:center}
.contact .tel{font-size:24px;color:#fff;font-weight:800;text-decoration:none;letter-spacing:.02em}
.contact .side small{color:#c9dccf;font-size:13px}
.ft a{color:inherit}
@media (max-width:600px){.about-box{padding:4px 16px 18px}.about-tb th,.about-tb td{display:block;width:auto;padding:4px 0}.about-tb th{padding-top:14px;border-bottom:0}.about-tb td{padding-bottom:12px}}

/* 導入例（2026-10-30） */
.case-box{max-width:820px;margin:0 auto;background:#fff;border:1px solid #dbe6dc;border-left:6px solid var(--green);border-radius:16px;padding:24px 28px;box-shadow:0 10px 30px rgba(40,67,53,.06)}
.case-tag{display:inline-block;background:#eaf3ec;color:var(--green);font-weight:800;font-size:14px;border-radius:999px;padding:4px 14px}
.case-box h3{margin:12px 0 8px;font-size:22px;color:var(--deep)}
.case-box p{margin:0;font-size:16px;line-height:1.9}
.case-box .case-note{margin-top:8px;font-size:13px;color:var(--muted)}
@media (max-width:600px){.case-box{padding:18px 16px}.case-box h3{font-size:19px}}

/* くわしいページ（2026-10-30） */
.sub-head{background:linear-gradient(180deg,var(--sage2),#fff);padding:34px 0 64px}
.sub-crumb{font-size:13px;color:var(--muted);margin-bottom:22px}
.sub-crumb a{color:var(--green)}
.sub-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:40px;align-items:center}
.sub-head h1{font-size:clamp(28px,4vw,44px);line-height:1.4;margin:8px 0 16px;color:var(--deep)}
.sub-lead{font-size:17px;line-height:1.95;color:#3d5246;margin:0}
.sub-tags{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:18px 0 0}
.sub-tags li{background:#fff;border:1px solid #d8e4da;border-radius:999px;padding:4px 14px;font-size:14px;font-weight:700;color:var(--green)}
.sub-act{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 0}
.sub-photo{margin:0;border-radius:22px;overflow:hidden;box-shadow:0 20px 50px rgba(40,75,50,.15)}
.sub-photo img{width:100%;height:auto;display:block}
.sub-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.sub-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px 24px;box-shadow:0 10px 30px rgba(40,67,53,.05)}
.sub-card .ic{width:48px;height:48px;border-radius:14px;background:var(--sage);display:grid;place-items:center;color:var(--green)}
.sub-card .ic svg{width:26px;height:26px;fill:none;stroke:var(--green);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.sub-card h3{font-size:19px;margin:14px 0 8px;color:var(--deep)}
.sub-card p{margin:0;font-size:15px;line-height:1.85;color:#4a5a50}
.sub-cta .intro{margin-bottom:24px}
.sub-cta-btns{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;align-items:center;margin:0}
.sub-cta-btns .btn{background:#fff;color:var(--deep);border-color:#fff}
.sub-cta .tel{color:#fff;font-size:22px;font-weight:800;text-decoration:none}
.sub-cta-note{text-align:center;color:#c9dccf;font-size:13px;margin:10px 0 0}
.sub-next{padding:48px 0}
.sub-next-t{text-align:center;font-weight:800;color:var(--deep);margin:0 0 14px}
.sub-next-l{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:0}
.more-cta{text-align:center;margin:34px 0 0}
.ichiban{display:flex;gap:16px;align-items:flex-start;max-width:860px;margin:26px auto 0;background:var(--sage2);border:1px solid #d8e4da;border-radius:16px;padding:20px 24px}
.ichiban .ic{flex:none;width:44px;height:44px;border-radius:50%;background:var(--green);display:grid;place-items:center}
.ichiban .ic svg{width:24px;height:24px;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.ichiban b{font-size:18px;color:var(--deep)}
.ichiban p{margin:6px 0 0;font-size:15px;line-height:1.85;color:#4a5a50}
.who{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.who figure{margin:0;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 10px 30px rgba(40,67,53,.06)}
.who img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;display:block}
.who figcaption{padding:16px 20px 20px;font-size:15px;line-height:1.8;color:#4a5a50}
.who figcaption b{display:block;font-size:18px;color:var(--deep);margin-bottom:4px}
@media (max-width:900px){.who{grid-template-columns:1fr}}
.uses{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.use{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 22px}
.use .thumb{flex:none;width:96px;height:96px;border-radius:14px;overflow:hidden}
.use .thumb img{width:100%;height:100%;object-fit:cover;display:block}
.use .ic{flex:none;width:46px;height:46px;border-radius:13px;background:var(--sage);display:grid;place-items:center}
.use .ic svg{width:25px;height:25px;fill:none;stroke:var(--green);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.use h3{font-size:18px;margin:0 0 6px;color:var(--deep)}
.use p{margin:0;font-size:15px;line-height:1.8;color:#4a5a50}
.use .dv{display:inline-block;margin-top:8px;font-size:12px;font-weight:700;color:var(--green);background:var(--sage2);border:1px solid #d8e4da;border-radius:999px;padding:2px 10px}
.sub-cards.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.soon{max-width:820px;margin:0 auto;border:2px dashed #cfdccf;border-radius:16px;padding:22px 26px;background:#fbfcfa}
.soon b{color:var(--deep);font-size:17px}
.soon p{margin:6px 0 10px;font-size:15px;color:#4a5a50}
.soon ul{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;font-size:15px;color:#4a5a50;line-height:1.6}
.soon li{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #e3ebe4;border-radius:12px;padding:8px 12px;min-height:60px}
.soon li img{flex:none;width:56px;height:56px;border-radius:10px;object-fit:cover;filter:grayscale(.35)}
@media (max-width:1000px){.sub-cards.four{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.uses{grid-template-columns:1fr}.soon ul{grid-template-columns:1fr}.use .thumb{width:80px;height:80px}}
.place .more{margin:14px 0 0}
@media (max-width:900px){.sub-grid{grid-template-columns:1fr;gap:26px}.sub-cards{grid-template-columns:1fr}}
@media (max-width:600px){.sub-head{padding:22px 0 48px}.sub-lead{font-size:16px}.sub-act .btn,.sub-next-l .btn{flex:1 1 100%}}
.page .in{max-width:1200px;margin:0 auto;padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}
