/* 妙高赤倉ハウス株式会社 会社サイト（旧HP刷新・試作 v18）2026-10-04
   構成＝積水ハウス「誇れる賃貸経営」LP に倣う（築田さん指定）。色はモス緑＋白＋淡グレー、積水の金色を小見出しに。書体はしっぽり明朝。
   ブレイクポイント：PC ≥1024px ／ タブレット 601〜1023px ／ スマホ ≤600px */
:root{
  --moss:#2c4c39; --moss-deep:#1f3728; --moss-ink:#18291f; --moss-soft:#e6ece8; --moss-line:#b9c6bd;
  --gold:#a38c5c; --gold-soft:#c9b78f;
  --bg:#ffffff; --bg-sub:#f1f2f0; --line:#dcdcd8; --ink:#1b211d; --ink-2:#3b413d; --weak:#6f746f;
  --serif:"Shippori Mincho","Hiragino Mincho ProN","Yu Mincho",serif;
  --sans:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",system-ui,sans-serif;
  --latin:'Jost',"Helvetica Neue",Arial,sans-serif;
  --gutter:clamp(16px,4.5vw,64px);
  --ease:cubic-bezier(.22,.61,.36,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:500 15.5px/2 var(--serif);letter-spacing:.04em;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;-webkit-tap-highlight-color:transparent}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.6;margin:0;letter-spacing:.06em}
p,dl,dd,ol,ul,figure{margin:0}
ol,ul{padding:0}
.note{font-size:12.5px;color:var(--weak);line-height:1.9}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.preview-bar{background:#8a6d1f;color:#fff;text-align:center;font:400 11.5px/1.6 var(--sans);padding:3px 12px;letter-spacing:.06em}
.in{max-width:1080px;margin:0 auto;padding-inline:var(--gutter)}
.js .rv{opacity:0;transform:translateY(18px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .rv.is-in{opacity:1;transform:none}

/* 上の帯：ロゴ＋宿泊予約・言語（積水LPと同じく、ナビは置かずメインビジュアルの3つの入口に任せる） */
.top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px var(--gutter)}
.brand{display:grid;gap:6px;text-decoration:none}
.brand-word{font:300 14px/1 var(--latin);letter-spacing:.34em;white-space:nowrap}
.brand-name{font:600 11.5px/1 var(--serif);letter-spacing:.16em}
.top-r{display:flex;align-items:center;gap:24px;font:400 12px/1.6 var(--sans);color:var(--weak)}
.top-r>a{text-underline-offset:4px}
.top-r>a:hover{color:var(--moss)}
.lang{display:flex;gap:14px}
.lang a{text-decoration:none}
.lang .is-off{opacity:.45;cursor:default}
.lang a.is-on{color:var(--moss);font-weight:500}
@media (max-width:760px){.top{padding-block:10px}.top-r .lang{display:none}.top-r{font-size:11px}.brand-word{font-size:12px;letter-spacing:.24em}}
@media (max-width:600px){.pc-only{display:none}}

/* ① メインビジュアル */
.mv{--tabs-h:84px;position:relative;height:calc(100svh - var(--mv-top,90px));min-height:520px;overflow:hidden;background:#0e1611;color:#fff}
.mv-slides{position:absolute;inset:0}
.mv-slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.02);transition:opacity 1.8s var(--ease),transform 9s linear}
.mv-slides img.is-active{opacity:1;transform:scale(1.07)}
.mv-slides::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,16,12,.55) 0%,rgba(10,16,12,0) 34%),linear-gradient(90deg,rgba(10,16,12,.25) 0%,rgba(10,16,12,0) 50%)}
/* 白帯のキャッチ（積水：1行ずつ白い帯に濃い文字） */
.mv-copy{position:absolute;z-index:2;left:var(--gutter);top:clamp(32px,7vh,72px);right:var(--gutter)}
.mv-catch{display:grid;justify-items:start;gap:clamp(8px,1vw,12px)}
.mv-catch span{display:inline-block;background:#fff;color:var(--moss-ink);font-size:clamp(20px,2.5vw,36px);font-weight:700;line-height:1.35;letter-spacing:.08em;padding:.28em .55em .3em}
.js .mv-catch span{animation:band .9s var(--ease) both}
.js .mv-catch span:nth-child(2){animation-delay:.12s}.js .mv-catch span:nth-child(3){animation-delay:.24s}
@keyframes band{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
/* 左下：ブランドの一言（積水：誇れる、賃貸経営。Sha Maison） */
.mv-mark{position:absolute;z-index:2;left:var(--gutter);bottom:calc(var(--tabs-h,84px) + clamp(20px,3.4vh,36px));display:grid;gap:8px;text-shadow:0 1px 14px rgba(8,14,10,.45)}
.mv-mark-jp{font-size:clamp(18px,1.7vw,24px);font-weight:600;letter-spacing:.16em}
.mv-mark-en{font:300 clamp(18px,2vw,28px)/1 var(--latin);letter-spacing:.26em}
/* SCROLL：右下、入口の帯の真上に。文字の下から線が帯へ流れ落ちる（10/4 位置を調整） */
.mv-scroll{position:absolute;z-index:3;right:var(--gutter);bottom:var(--tabs-h);writing-mode:vertical-rl;font:400 10.5px/1 var(--latin);letter-spacing:.32em;color:#fff;padding-bottom:84px;text-shadow:0 1px 8px rgba(8,14,10,.5)}
.mv-scroll::before{content:"";position:absolute;left:50%;bottom:0;width:1px;height:72px;background:rgba(255,255,255,.28)}
.mv-scroll::after{content:"";position:absolute;left:50%;bottom:0;width:1px;height:72px;background:#fff;animation:drop 2.4s var(--ease) infinite}
@keyframes drop{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
/* 下端の3つの入口（積水：ノウハウを知る／実例を見る／プロに相談する） */
.mv-tabs{position:absolute;z-index:3;left:0;right:0;bottom:0;height:var(--tabs-h);display:grid;grid-template-columns:repeat(3,1fr);background:rgba(110,118,112,.62);backdrop-filter:blur(4px)}
.mv-tabs a{display:grid;place-items:center;align-content:center;gap:6px;color:#fff;text-decoration:none;font-size:clamp(13px,1.2vw,16px);font-weight:600;letter-spacing:.14em;position:relative;transition:background .25s}
.mv-tabs a+a::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:1px;background:rgba(255,255,255,.45)}
.mv-tabs a::after{content:"";width:7px;height:7px;border-right:1px solid #fff;border-bottom:1px solid #fff;transform:rotate(45deg)}
.mv-tabs a:hover{background:rgba(255,255,255,.12)}
@media (max-width:760px){
  .mv{min-height:480px}
  .mv{--tabs-h:68px}
  .mv-tabs a{font-size:12px;letter-spacing:.06em;gap:4px}
  .mv-catch span{font-size:clamp(15px,4.3vw,20px);letter-spacing:.02em;padding:.3em .5em}
  .mv-scroll{display:none}
    .mv-mark{bottom:calc(68px + 60px)}
}

/* ② 大きな段：小見出し（金色）＋縦の細線＋中央の大見出し */
.blk{padding-top:clamp(72px,9vw,120px)}
.blk--sub{background:var(--bg-sub);padding-bottom:clamp(72px,9vw,120px)}
.blk-hd{text-align:center;display:grid;justify-items:center;gap:0;margin-bottom:clamp(40px,5vw,64px)}
.blk-label{font-size:14px;color:var(--gold);letter-spacing:.2em;font-weight:600}
.blk-label::after{content:"";display:block;width:1px;height:40px;background:var(--gold-soft);margin:14px auto 22px}
.blk-title{font-size:clamp(22px,2.6vw,34px);line-height:1.65;letter-spacing:.1em;font-weight:700}
@media (max-width:600px){.blk-title{font-size:clamp(19px,5.4vw,23px);letter-spacing:.05em}.blk-title br{display:none}}

/* ③ 三者の図 */
.tri{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:center;margin-bottom:clamp(56px,7vw,96px)}
.tri-txt{display:grid;gap:14px;font-size:15px;line-height:2.1}
.tri-txt strong{color:var(--moss);font-weight:700;background:linear-gradient(transparent 62%,rgba(163,140,92,.22) 62%)}
.tri-fig{position:relative;width:min(100%,380px);aspect-ratio:1/0.92;justify-self:center}
.tri-fig::before{content:"";position:absolute;left:50%;top:50%;width:42%;aspect-ratio:1;border:1px solid var(--gold-soft);border-radius:50%;transform:translate(-50%,-44%)}
.tri-c{position:absolute;display:grid;place-items:center;width:40%;aspect-ratio:1;border-radius:50%;background:#fff;border:1px solid var(--moss-line);color:var(--moss);font-size:clamp(15px,1.6vw,19px);font-weight:700;letter-spacing:.12em;box-shadow:0 8px 24px rgba(31,55,40,.07)}
.tri-c--1{left:30%;top:0}
.tri-c--2{left:2%;bottom:0}
.tri-c--3{right:2%;bottom:0;font-size:clamp(14px,1.45vw,17px);letter-spacing:.04em}
@media (max-width:760px){.tri{grid-template-columns:1fr}.tri-fig{width:min(86%,320px)}}

/* ④ 写真と番号つき要点：左右交互（積水：写真を画面の端まで、文字側は淡い地） */
.pts{display:grid;gap:0}
.pt{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;background:var(--bg-sub)}
.pt:nth-child(even){background:#fff}
.pt:nth-child(even) .pt-ph{order:2}
.pt-ph{min-height:clamp(280px,32vw,440px)}
.pt-ph img{width:100%;height:100%;object-fit:cover}
.pt-body{display:grid;align-content:center;gap:22px;padding:clamp(32px,5vw,72px) clamp(24px,6vw,96px)}
.pt-body h3{font-size:clamp(20px,2vw,28px);line-height:1.6;letter-spacing:.08em;font-weight:700;word-break:keep-all;overflow-wrap:anywhere}
.mk{background:linear-gradient(transparent 64%,rgba(163,140,92,.28) 64%)}
.pt-body ol{list-style:none;display:grid;gap:10px;counter-reset:n}
.pt-body li{counter-increment:n;display:grid;grid-template-columns:2.1em 1fr;font-size:15px;line-height:1.85}
.pt-body li::before{content:counter(n) ".";font:400 17px/1.6 var(--latin);color:var(--gold)}
@media (max-width:760px){.pt{grid-template-columns:1fr}.pt:nth-child(even) .pt-ph{order:0}.pt-ph{min-height:0;aspect-ratio:1.618/1}.pt-body{padding:28px var(--gutter) 40px}.pt-body h3 br{display:none}}

/* 管理業務・料金（実務情報は明るい地で静かに） */
.sub{padding-top:clamp(64px,8vw,104px)}
.sub-title{font-size:clamp(19px,1.8vw,23px);letter-spacing:.1em;padding-bottom:14px;margin-bottom:clamp(24px,3vw,36px);border-bottom:1px solid var(--ink);font-weight:700}
.works{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,24px);align-items:stretch}
.wg{background:var(--bg-sub);padding:clamp(22px,2.4vw,32px)}
.wg-hd{font-size:17px;color:var(--moss);padding-bottom:14px;border-bottom:1px solid var(--moss)}
.wg dl>div{padding:16px 0;border-bottom:1px solid var(--line)}
.wg dl>div:last-child{border-bottom:0;padding-bottom:0}
.wg dt{font-size:15px;font-weight:600;line-height:1.6;margin-bottom:4px;padding-left:15px;position:relative}
.wg dt::before{content:"";position:absolute;left:0;top:.7em;width:6px;height:6px;background:var(--gold)}
.wg dd{font-size:13px;color:var(--ink-2);line-height:1.9;padding-left:15px}
@media (max-width:900px){.works{grid-template-columns:1fr}}
.tbl{width:100%;border-collapse:collapse;font-size:14.5px}
.tbl th,.tbl td{padding:15px 4px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;line-height:1.85}
.tbl th{width:48%;font-weight:500;padding-right:24px}
.tbl td{font-variant-numeric:tabular-nums}
.tbl small{color:var(--weak);font-size:12.5px}
#price .note{margin-top:18px}
@media (max-width:600px){
  .tbl,.tbl tbody,.tbl tr{display:block}
  .tbl tr{padding:12px 0;border-bottom:1px solid var(--line)}
  .tbl th,.tbl td{display:block;width:auto;border:0;padding:0}
  .tbl th{font-size:12.5px;color:var(--weak);margin-bottom:2px}
}

/* ⑤ 暗い帯（積水：無料ガイドで詳しく見る） */
.dark{background:var(--moss-ink);color:#fff;padding-block:clamp(56px,7vw,88px);margin-top:clamp(72px,9vw,120px)}
.dark-title{text-align:center;font-size:clamp(20px,2.3vw,30px);letter-spacing:.1em;font-weight:700;margin-bottom:clamp(28px,3.6vw,44px)}
.dark-title em{font-style:normal;color:var(--gold-soft);font-size:1.25em;margin-inline:.1em}
.dark-box{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);padding:clamp(24px,3.6vw,48px)}
.dark-side{display:grid;gap:18px;justify-items:start}
.dark-side p{font-size:14.5px;line-height:2}
.dark .note{color:rgba(255,255,255,.65)}
@media (max-width:860px){.dark-box{grid-template-columns:1fr}.dark-side .pill{width:100%}}
/* 収益モデル（暗い地版） */
.pl{display:grid;gap:22px}
.pl-cap{font-size:14px;color:rgba(255,255,255,.8);padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.2)}
.pl-main{display:flex;align-items:baseline;gap:6px 16px;flex-wrap:wrap}
.pl-lbl{font-size:14px;letter-spacing:.2em;color:var(--gold-soft)}
.pl-big{font:700 clamp(38px,5vw,60px)/1 var(--serif);letter-spacing:.02em;font-variant-numeric:tabular-nums}
.pl-per{font-size:14px;color:rgba(255,255,255,.7)}
.pl-bar{display:flex;height:6px;background:rgba(255,255,255,.15)}
.pl-seg{display:block;width:var(--w);transform-origin:left}
.pl-seg--exp{background:rgba(255,255,255,.35)}.pl-seg--pro{background:var(--gold-soft)}
.js .pl .pl-seg{transform:scaleX(0);transition:transform 1.1s var(--ease)}
.js .pl .pl-seg--pro{transition-delay:.35s}
.js .pl.is-in .pl-seg{transform:none}
.pl-rows{display:grid}
.pl-rows>div{display:flex;justify-content:space-between;align-items:baseline;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.14);font-variant-numeric:tabular-nums}
.pl-rows dt{display:flex;align-items:center;gap:10px;font-size:14px}
.pl-rows dd{font-size:16px}
.pl-rows small{font:400 12px var(--latin);color:rgba(255,255,255,.6);margin-left:12px;display:inline-block;width:3em;text-align:right}
.pl-rows .is-pro dd{color:var(--gold-soft);font-weight:700}
.sw{display:inline-block;width:10px;height:10px}
.sw--exp{background:rgba(255,255,255,.35)}.sw--pro{background:var(--gold-soft)}
.pl-fees{display:grid;gap:1px;width:100%;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.14)}
.pl-fees>div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;background:var(--moss-ink);padding:12px 16px}
.pl-fees dt{font-size:12.5px;color:rgba(255,255,255,.72)}
.pl-fees dd{font-size:15px;font-weight:700;white-space:nowrap}
@media (max-width:420px){.pl-fees>div{flex-direction:column;gap:2px}}

/* 丸いボタン（積水：濃い地に白文字の角丸） */
.pill{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-width:min(100%,340px);min-height:60px;padding:14px 36px;border-radius:999px;background:var(--moss-ink);color:#fff;text-decoration:none;font-size:15px;font-weight:600;letter-spacing:.1em;transition:background .25s,transform .25s var(--ease)}
.pill::after{content:"";width:7px;height:7px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);margin-left:auto}
.pill:hover{background:var(--moss)}
.pill--inv{background:#fff;color:var(--moss-ink)}
.pill--inv:hover{background:var(--moss-soft)}

/* ⑥ 運営施設のスライド（積水：全幅写真＋右下の白い説明＋点） */
.ex{position:relative;overflow:hidden}
.ex-track{position:relative;aspect-ratio:16/7;min-height:340px}
.ex-item{position:absolute;inset:0;opacity:0;transition:opacity 1.1s var(--ease)}
.ex-item.is-active{opacity:1}
.ex-item img{width:100%;height:100%;object-fit:cover}
.ex-item figcaption{position:absolute;left:clamp(16px,6vw,96px);bottom:clamp(40px,5vw,64px);display:grid;justify-items:start;gap:8px}
.ex-item figcaption b{background:#fff;color:var(--moss-ink);font-size:clamp(15px,1.6vw,21px);font-weight:700;letter-spacing:.08em;padding:.4em .8em}
.ex-item figcaption span{background:var(--moss-ink);color:#fff;font:400 13px/1 var(--latin);letter-spacing:.16em;padding:.7em 1em}
.ex-nav{position:absolute;top:50%;width:48px;height:48px;margin-top:-24px;border:0;border-radius:50%;background:rgba(255,255,255,.85);cursor:pointer;z-index:2}
.ex-nav::after{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;border-top:1.5px solid var(--moss-ink);border-right:1.5px solid var(--moss-ink)}
.ex-nav--prev{left:clamp(10px,2vw,24px)}.ex-nav--prev::after{transform:translate(-30%,-50%) rotate(-135deg)}
.ex-nav--next{right:clamp(10px,2vw,24px)}.ex-nav--next::after{transform:translate(-70%,-50%) rotate(45deg)}
.ex-dots{position:absolute;left:0;right:0;bottom:16px;display:flex;justify-content:center;gap:10px;z-index:2}
.ex-dots button{width:8px;height:8px;border-radius:50%;border:0;padding:0;background:rgba(255,255,255,.55);cursor:pointer}
.ex-dots button[aria-current="true"]{background:#fff}
@media (max-width:760px){.ex-track{aspect-ratio:4/3;min-height:0}.ex-item figcaption{right:12px;left:12px;bottom:40px}.ex-nav{width:40px;height:40px;margin-top:-20px}}
/* 暗い帯の中の施設一覧 */
.dark-box--fac{grid-template-columns:1fr;gap:clamp(28px,3.4vw,44px)}
.dark-box--fac .dark-side{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:20px 40px;width:100%;padding-top:clamp(24px,3vw,36px);border-top:1px solid rgba(255,255,255,.14)}
@media (max-width:760px){.dark-box--fac .dark-side{grid-template-columns:1fr}}
.fac-grid{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,36px) clamp(16px,2vw,28px)}
.fac-grid li{display:grid;gap:2px;align-content:start}
.fac-grid img,.fac-grid .ph-none{aspect-ratio:1.618/1;width:100%;object-fit:cover;object-position:50% 50%;margin-bottom:12px}
.fac-grid b{font:400 clamp(15px,1.4vw,18px)/1.4 var(--latin);letter-spacing:.06em}
.fac-grid span{font-size:13px;color:rgba(255,255,255,.68);line-height:1.7;margin-top:2px}
.ph-none{display:grid;place-items:center;text-align:center;background:rgba(255,255,255,.08);font:300 13px/1.8 var(--latin)!important;letter-spacing:.24em;color:var(--gold-soft)!important}
@media (max-width:860px){.dark-box--fac{grid-template-columns:1fr}}
@media (max-width:520px){.fac-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ⑦ 相談する（積水：グレーの枠＋金色の見出し帯＋丸ボタン） */
.cs{display:grid;gap:0}
.cs-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:clamp(20px,3vw,40px);align-items:start;background:var(--bg-sub);padding:clamp(20px,3vw,40px)}
.cs-ph img{width:100%;aspect-ratio:4/3;object-fit:cover}
.cs-body{display:grid;gap:14px}
.cs-tag{background:var(--gold);color:#fff;font-size:15px;font-weight:700;letter-spacing:.12em;padding:.5em 1em}
.cs-body h3{font-size:clamp(19px,1.9vw,25px);line-height:1.6;letter-spacing:.06em;font-weight:700}
.cs-body p{font-size:14px;line-height:2;color:var(--ink-2)}
.cs-sub{font-size:13px!important;color:var(--weak)!important;margin-top:4px}
.cs-flow{list-style:none;display:flex;flex-wrap:wrap;gap:6px 0;counter-reset:f;font-size:13px;line-height:1.7}
.cs-flow li{counter-increment:f;display:inline-flex;align-items:center}
.cs-flow li::before{content:counter(f);display:inline-grid;place-items:center;width:1.7em;height:1.7em;border-radius:50%;background:#fff;border:1px solid var(--gold-soft);color:var(--gold);font:400 11px/1 var(--latin);margin-right:6px}
.cs-flow li:not(:last-child)::after{content:"／";color:var(--line);margin-inline:6px}
.cs-act{text-align:center;padding:clamp(24px,3vw,32px) 0 clamp(40px,5vw,64px);border-bottom:1px solid var(--line);margin-bottom:clamp(40px,5vw,64px)}
.cs-act:last-of-type{border-bottom:0;margin-bottom:0}
.cs-note{text-align:center;padding-bottom:clamp(72px,9vw,120px)}
@media (max-width:760px){.cs-card{grid-template-columns:1fr}.cs-body h3 br{display:none}.cs-act .pill{width:100%}}

/* 会社を知る */
.msg{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(28px,5vw,80px);align-items:start}
.msg-photo{display:grid;gap:12px;max-width:340px}
.msg-photo img{aspect-ratio:1/1;width:100%;object-fit:cover}
.msg-photo figcaption{font-size:16px;font-weight:600;letter-spacing:.14em;display:grid;gap:2px}
.msg-photo small{font:400 12px var(--sans);color:var(--weak);letter-spacing:.1em}
.msg-body{display:grid;gap:16px}
.msg-title{font-size:19px;letter-spacing:.12em;color:var(--moss);font-weight:700}
.msg-body p{font-size:14.5px;line-height:2.1}
@media (max-width:760px){.msg{grid-template-columns:1fr}.msg-photo{max-width:none;grid-template-columns:120px 1fr;align-items:end;gap:16px}}
.co{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(24px,3vw,48px);align-items:start;margin-top:clamp(48px,6vw,80px)}
.tbl--co{border-top:1px solid var(--ink)}
.tbl--co th{width:7em;color:var(--weak);font-weight:400}
.co-map{position:relative;aspect-ratio:4/3;background:var(--moss-soft);border:1px solid var(--line)}
.co-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@media (max-width:860px){.co{grid-template-columns:1fr}}

/* ⑧ 最後の誘い */
.last{position:relative;display:grid;place-items:center;min-height:clamp(340px,40vw,480px);overflow:hidden;color:#fff;text-align:center}
.last>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.last::after{content:"";position:absolute;inset:0;background:rgba(14,22,17,.5)}
.last-in{position:relative;z-index:1;display:grid;gap:28px;justify-items:center;padding:48px var(--gutter)}
.last-txt{font-size:clamp(21px,2.5vw,32px);font-weight:700;line-height:1.7;letter-spacing:.1em}
@media (max-width:600px){.last .pill{width:100%}}

/* フッター */
.ft{background:#2b2f2c;color:rgba(255,255,255,.75);text-align:center;padding-bottom:calc(24px + env(safe-area-inset-bottom,0px))}
.ft a{text-decoration:none}
.ft-top{display:block;padding:14px;font:400 11px/1 var(--latin);letter-spacing:.24em;color:#fff;background:#3a3f3b}
.ft-top::before{content:"";display:block;width:7px;height:7px;border-left:1px solid #fff;border-top:1px solid #fff;transform:rotate(45deg);margin:0 auto 8px}
.ft-in{max-width:1080px;margin:0 auto;padding:40px var(--gutter) 0;display:grid;gap:20px;justify-items:center}
.ft-brand{display:grid;gap:10px;font:300 16px/1 var(--latin);letter-spacing:.3em;color:#fff}
.ft-brand small{font:400 12px/1.8 var(--sans);letter-spacing:.06em;color:rgba(255,255,255,.65)}
.ft-links{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 28px;font:400 12px/1.8 var(--sans)}
.ft-links a:hover{color:#fff;text-decoration:underline}
.ft-copy{font:400 10.5px/1.6 var(--latin);letter-spacing:.08em;opacity:.55}
@media (max-width:1023px){.ft{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}}

/* ⑨ 右下に追従するバナー（積水：カタログ請求・相談する）。PC は写真つきカード2枚、スマホは画面下の帯 */
.fb{position:fixed;right:16px;bottom:16px;z-index:60;display:grid;gap:10px;width:250px;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .4s var(--ease),transform .4s var(--ease),visibility 0s .4s}
.fb.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .4s var(--ease),transform .4s var(--ease)}
.fb-item{position:relative;box-shadow:0 6px 22px rgba(15,25,19,.22)}
.fb-item[hidden]{display:none}
.fb-item a{display:grid;grid-template-columns:80px 1fr;align-items:center;background:var(--moss);color:#fff;text-decoration:none;min-height:80px;transition:background .25s}
.fb-item:last-child a{background:var(--moss-ink)}
.fb-item a:hover{background:var(--moss-deep)}
.fb-item img{width:80px;height:100%;object-fit:cover}
.fb-item span{display:grid;gap:2px;padding:10px 26px 10px 14px;font-size:17px;font-weight:700;letter-spacing:.1em;line-height:1.3;position:relative}
.fb-item span::after{content:"";position:absolute;right:12px;top:50%;width:6px;height:6px;border-top:1px solid #fff;border-right:1px solid #fff;transform:translateY(-50%) rotate(45deg)}
.fb-item small{font-size:11px;font-weight:500;letter-spacing:.04em;opacity:.85;white-space:nowrap}
.fb-x{position:absolute;right:-7px;top:-7px;width:22px;height:22px;border-radius:50%;border:0;background:#8a8f8b;cursor:pointer;padding:0}
.fb-x::before,.fb-x::after{content:"";position:absolute;left:6px;right:6px;top:50%;height:1.5px;background:#fff;transform:rotate(45deg)}
.fb-x::after{transform:rotate(-45deg)}
@media (max-width:1023px){
  .fb{left:0;right:0;bottom:0;width:auto;grid-template-columns:1fr 1fr;gap:0;padding-bottom:env(safe-area-inset-bottom,0px);background:var(--moss-ink)}
  .fb-item{box-shadow:none}
  .fb-item a{grid-template-columns:1fr;min-height:60px;text-align:center}
  .fb-item img,.fb-x{display:none}
  .fb-item span{padding:8px 10px;font-size:14px;justify-items:center}
  .fb-item span::after{display:none}
  .fb-item:first-child a{border-right:1px solid rgba(255,255,255,.2)}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .rv{opacity:1!important;transform:none!important}
  .js .pl .pl-seg{transform:none!important}
  .mv-slides img{transform:none}
}


/* メインビジュアルは妙高山の写真1枚（10/4 築田さん指示：建物を写さず、妙高が分かり、管理会社として安心感のある写真。スライドなし）。
   空の部分に白帯のキャッチを置けるよう、写真の上端を基準に切り取る */
.mv-slides--one img{opacity:1;transform:none;transition:none;object-position:50% 0}
.mv-slides--one::after{background:linear-gradient(0deg,rgba(10,16,12,.6) 0%,rgba(10,16,12,.18) 30%,rgba(10,16,12,0) 50%)}
@media (max-width:760px){.mv-slides--one img{object-position:50% 0}.mv-slides--one::after{background:linear-gradient(0deg,rgba(10,16,12,.65) 0%,rgba(10,16,12,.2) 36%,rgba(10,16,12,0) 55%)}}


/* メインビジュアルのキャッチ（10/4 富裕層のオーナー候補向けに刷新）：白帯をやめ、妙高山の空に白い明朝を中央に大きく。
   参考の方向＝高級別荘地・不動産の広告（写真が主役、文字は少なく、字間と余白でゆとりを出す） */
.mv-copy--lux{left:0;right:0;top:clamp(36px,6.5vh,80px);padding-inline:var(--gutter);display:grid;justify-items:center;text-align:center;gap:clamp(18px,2.4vh,28px);color:#fff;text-shadow:0 1px 18px rgba(8,20,30,.35),0 0 2px rgba(8,20,30,.25)}
.mv-h1{display:grid;justify-items:center;gap:clamp(14px,2vh,22px)}
.mv-label{font:500 clamp(11.5px,.95vw,13px)/1.6 var(--sans);letter-spacing:.3em;opacity:.92}
.mv-main{font-size:clamp(30px,4.4vw,64px);font-weight:600;line-height:1.45;letter-spacing:.2em;padding-left:.2em}
.mv-sub{font-size:clamp(13.5px,1.1vw,16px);font-weight:500;line-height:1.95;letter-spacing:.12em}
.mv-sub::before{content:"";display:block;width:1px;height:clamp(20px,2.6vh,32px);background:rgba(255,255,255,.75);margin:0 auto clamp(10px,1.4vh,16px)}
.nb{display:inline-block}
.js .mv-copy--lux>*{animation:rise 1.2s var(--ease) both}
.js .mv-copy--lux .mv-sub{animation-delay:.35s}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.mv-slides--one::after{background:linear-gradient(180deg,rgba(12,28,44,.38) 0%,rgba(12,28,44,.12) 34%,rgba(12,28,44,0) 50%),linear-gradient(0deg,rgba(10,16,12,.55) 0%,rgba(10,16,12,0) 30%)}
@media (max-width:760px){
  /* スマホ：縦長だと山が上に来るので、見出しは空に、説明文は下の田園（暗くした部分）に分けて置く */
  .mv-copy--lux{top:clamp(36px,6vh,56px);bottom:calc(var(--tabs-h) + 22px);align-content:space-between}
  .mv-sub::before{display:none}
  .mv-sub .nb{display:block}
  .mv-sub br{display:none}
  .mv-main{font-size:clamp(25px,7.4vw,32px);letter-spacing:.12em;line-height:1.6}
  .mv-main .nb{display:block}
  .mv-label{letter-spacing:.14em}
  .mv-sub{font-size:13px;letter-spacing:.06em;line-height:2}
  .mv-slides--one::after{background:linear-gradient(180deg,rgba(12,28,44,.45) 0%,rgba(12,28,44,.15) 40%,rgba(12,28,44,0) 55%),linear-gradient(0deg,rgba(10,16,12,.78) 0%,rgba(10,16,12,.5) 22%,rgba(10,16,12,0) 42%)}
}
html:lang(en) .mv-main{letter-spacing:.02em;font-weight:500;font-size:clamp(32px,4.4vw,62px);line-height:1.2}
html:lang(en) .mv-sub{letter-spacing:.02em;font-size:clamp(15px,1.25vw,18px);line-height:1.7}
html:lang(en) .mv-label{letter-spacing:.18em;text-transform:uppercase;font-size:11.5px}
@media (max-width:760px){html:lang(en) .mv-main{font-size:clamp(26px,7.6vw,34px)}html:lang(en) .mv-sub{font-size:14.5px;line-height:1.6}html:lang(en) .mv-sub .nb{display:inline}}


/* ===== メインビジュアル左下：会社の事実（10/4 案2で確定）===== */
/* 左下（入口の帯の上・暗くした田園の上）に置く */
.mv-foot{position:absolute;z-index:3;left:var(--gutter);right:calc(var(--gutter) + 40px);bottom:calc(var(--tabs-h) + clamp(18px,3vh,30px));display:flex;align-items:flex-end;gap:16px clamp(28px,3vw,48px);flex-wrap:wrap;color:#fff;text-shadow:0 1px 10px rgba(8,14,10,.55)}
/* 会社の事実を一行で（本社・資格・実績。いずれも会社情報にある変わらない事実） */
.mv-facts{list-style:none;margin:0;padding:0;display:flex}
.mv-facts li{display:grid;gap:5px;padding:0 clamp(16px,2vw,28px);font-size:clamp(13px,1vw,15px);font-weight:600;letter-spacing:.1em;border-left:1px solid rgba(255,255,255,.35)}
.mv-facts li:first-child{padding-left:0;border-left:0}
.mv-facts small{font:400 10.5px/1 var(--sans);letter-spacing:.24em;opacity:.8}
@media (min-width:761px){.mv-slides--one::after{background:linear-gradient(180deg,rgba(12,28,44,.38) 0%,rgba(12,28,44,.12) 34%,rgba(12,28,44,0) 50%),linear-gradient(0deg,rgba(10,16,12,.72) 0%,rgba(10,16,12,.35) 22%,rgba(10,16,12,0) 40%)}}
@media (max-width:760px){
  /* スマホ：事実は入口の帯のすぐ上に小さく3列。説明文はその上 */
  .mv-foot{left:var(--gutter);right:var(--gutter);bottom:calc(var(--tabs-h) + 14px)}
  .mv-facts{width:100%;justify-content:space-between}
  .mv-facts li{flex:1;padding:0 10px;font-size:11.5px;letter-spacing:.02em;line-height:1.5;text-align:center}
  .mv-facts li:first-child{padding-left:0}
  .mv-facts small{font-size:9.5px;letter-spacing:.12em}
  .mv-copy--lux{bottom:calc(var(--tabs-h) + 82px)}
}


/* ===== スマホ「選ばれる理由」：ずらしの配置 ===== */
.pt-body h3{text-wrap:balance}
@media (max-width:760px){
  .cs-body h3,.blk-title{text-wrap:balance}
  /* 写真を左右交互に寄せ、白いカードを写真に重ねる（10/4 案Cで確定） */
  .pts{background:var(--bg-sub);padding:12px 0 24px}
  .pts .pt,.pts .pt:nth-child(even){background:transparent;display:block;padding:28px 0 8px}
  .pts .pt-ph{width:86%;aspect-ratio:4/3}
  .pts .pt:nth-child(even) .pt-ph{margin-left:auto}
  .pts .pt-body{position:relative;width:86%;margin:-56px 0 0 auto;background:#fff;padding:22px 20px 24px;box-shadow:0 10px 30px rgba(20,35,26,.10);gap:12px}
  .pts .pt:nth-child(even) .pt-body{margin:-56px auto 0 0}
  .pt-body h3{font-size:19px}
  .pt-body h3 br{display:none}
}

/* ===== 管理業務の開閉・「続きを読む」（スマホ・タブレットは閉じる。PCは常に全部表示）===== */
.wg>summary{list-style:none;cursor:default;display:block}
.wg>summary::-webkit-details-marker{display:none}
.wg>summary::marker{content:""}
.more-btn{display:none}
@media (max-width:1023px){
  .wg>summary{cursor:pointer;display:flex;justify-content:space-between;align-items:center}
  .wg>summary::after{content:"";width:9px;height:9px;border-right:1.5px solid var(--moss);border-bottom:1.5px solid var(--moss);transform:rotate(45deg) translateY(-3px);transition:transform .3s var(--ease);flex:none;margin-left:12px}
  .wg[open]>summary::after{transform:rotate(-135deg) translateY(-3px)}
  .wg:not([open])>summary{border-bottom:0;padding-bottom:0}
  .wg{padding:18px 18px}
  .works{gap:10px}
  .more-box.is-collapsed .tbl tr:nth-child(n+7){display:none}
  .more-box.is-collapsed>p:nth-of-type(n+3){display:none}
  .more-box.is-collapsed .tbl{-webkit-mask-image:linear-gradient(#000 70%,transparent);mask-image:linear-gradient(#000 70%,transparent)}
  .more-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;margin-top:14px;min-height:48px;background:#fff;border:1px solid var(--moss-line);color:var(--moss);font:600 14px/1 var(--serif);letter-spacing:.1em;cursor:pointer}
  .more-btn::after{content:"";width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px)}
  .more-box:not(.is-collapsed) .more-btn::after{transform:rotate(-135deg) translateY(-2px)}
  .msg-body .more-btn{margin-top:4px}
}

/* ===== スマホ：スクロールを短く（余白・写真の高さを詰める）===== */
@media (max-width:760px){
  .blk{padding-top:56px}
  .blk--sub{padding-bottom:56px}
  .blk-hd{margin-bottom:28px}
  .blk-label::after{height:24px;margin:10px auto 14px}
  .tri{gap:20px;margin-bottom:40px}
  .tri-txt{font-size:14px;line-height:2}
  .tri-fig{width:min(70%,240px)}
  .tri-c{font-size:13px;letter-spacing:.06em}
  .tri-c--3{font-size:12.5px}
  .pt-ph{aspect-ratio:2/1}
  .pt-body{gap:14px;padding:22px var(--gutter) 30px}
  .pt-body h3{font-size:19px}
  .pt-body li{font-size:14px;line-height:1.75}
  .sub{padding-top:44px}
  .sub-title{margin-bottom:18px}
  .dark{margin-top:56px;padding-block:44px}
  .dark-title{margin-bottom:22px}
  .dark-box{padding:20px 16px;gap:22px}
  .pl{gap:16px}
  .ex-track{aspect-ratio:3/2}
  .fac-grid{gap:18px 12px}
  .fac-grid b{font-size:14px}
  .fac-grid span{font-size:11.5px}
  .cs-card{padding:16px;gap:16px}
  .cs-ph img{aspect-ratio:2/1}
  .cs-body{gap:10px}
  .cs-tag{font-size:13.5px}
  .cs-body h3{font-size:18px}
  .cs-body p{font-size:13.5px;line-height:1.9}
  .cs-act{padding:18px 0 32px;margin-bottom:32px}
  .cs-note{padding-bottom:56px}
  .msg{gap:20px}
  .msg-photo{grid-template-columns:96px 1fr}
  .msg-body p{font-size:14px;line-height:2}
  .co{margin-top:32px;gap:20px}
  .co-map{aspect-ratio:16/10}
  .last{min-height:300px}
  .last-in{gap:20px;padding-block:36px}
}

/* ===== タブレット（761〜1023px）===== */
@media (min-width:761px) and (max-width:1023px){
  .pt-body{padding:32px 36px}
  .pt-body h3{font-size:21px}
  .pt-body li{font-size:14px}
  .tri{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
  .cs-card{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr)}
  .fac-grid b{font-size:15px}
  .mv-catch span{font-size:clamp(20px,3vw,28px)}
}

/* ===== 英語版（en/）・中国語版（ch/）：構成は日本語版と同じ。書体と字間だけ変える ===== */
/* 英語：EB Garamond（明朝と同じく筆の抑揚がある欧文セリフ）。横組みの欧文なので字間は詰める */
html:lang(en){--serif:"EB Garamond","Times New Roman",serif;--sans:"Noto Sans",system-ui,sans-serif}
html:lang(en) body{font:400 17px/1.7 var(--serif);letter-spacing:.005em}
html:lang(en) h1,html:lang(en) h2,html:lang(en) h3,html:lang(en) h4{letter-spacing:.005em;font-weight:600}
html:lang(en) .mv-catch span{letter-spacing:.01em;font-weight:600;font-size:clamp(20px,2.4vw,34px)}
html:lang(en) .mv-mark-jp{letter-spacing:.02em;font-style:italic;font-weight:500}
html:lang(en) .mv-tabs a{letter-spacing:.04em;font-size:clamp(14px,1.3vw,17px)}
html:lang(en) .blk-label{letter-spacing:.14em;text-transform:uppercase;font:500 13px/1.6 var(--sans)}
html:lang(en) .blk-title{letter-spacing:0;line-height:1.3;font-size:clamp(25px,2.9vw,40px);font-weight:500}
html:lang(en) .pt-body h3{letter-spacing:0;line-height:1.3;font-size:clamp(23px,2.2vw,31px);font-weight:500}
html:lang(en) .pt-body li,html:lang(en) .tri-txt,html:lang(en) .msg-body p,html:lang(en) .cs-body p{font-size:17px;line-height:1.7}
html:lang(en) .wg dt{font-size:17px;line-height:1.35}
html:lang(en) .wg dd,html:lang(en) .tbl{font-size:15.5px;line-height:1.6}
html:lang(en) .sub-title,html:lang(en) .wg-hd,html:lang(en) .msg-title{letter-spacing:.01em}
html:lang(en) .dark-title{letter-spacing:0;font-weight:500;font-size:clamp(23px,2.5vw,33px)}
html:lang(en) .cs-tag{letter-spacing:.04em}
html:lang(en) .cs-body h3{letter-spacing:0;line-height:1.3;font-weight:500;font-size:clamp(21px,2.1vw,28px)}
html:lang(en) .pill{letter-spacing:.03em;font-size:16.5px;font-weight:500}
html:lang(en) .last-txt{letter-spacing:0;line-height:1.35;font-weight:500;font-size:clamp(25px,2.8vw,38px)}
html:lang(en) .tri-c{letter-spacing:.02em;font-size:clamp(16px,1.7vw,20px)!important}
html:lang(en) .ex-item figcaption b{letter-spacing:.01em;font-style:italic;font-weight:500}
html:lang(en) .fb-item span{letter-spacing:.02em}
html:lang(en) .pl-big{font-weight:500}
@media (max-width:760px){html:lang(en) .mv-catch span{font-size:clamp(16px,4.6vw,21px)}html:lang(en) .mv-tabs a{font-size:13px;letter-spacing:0;text-align:center;line-height:1.25}}

/* 中国語（簡体字）：思源宋体（Noto Serif SC） */
html:lang(zh-Hans){--serif:"Noto Serif SC","Songti SC","STSong",serif;--sans:"Noto Sans SC","PingFang SC",system-ui,sans-serif}
html:lang(zh-Hans) body{letter-spacing:.03em}
html:lang(zh-Hans) .blk-title,html:lang(zh-Hans) .mv-catch span{letter-spacing:.05em}

/* ===== スマホの文字サイズをページ全体で一段階小さく（10/4 築田さん「写真のタイトルなどがスマホで大きすぎる・全体を通して」）=====
   英語・中国語の指定より後ろ・同じ強さで書き、3言語とも同じ大きさにそろえる */
@media (max-width:760px){
  html .ex-item figcaption{bottom:34px;gap:6px}
  html .ex-item figcaption b{font-size:14px;letter-spacing:.06em;padding:.38em .7em;font-weight:600}
  html .ex-item figcaption span{font-size:10.5px;padding:.6em .85em;letter-spacing:.12em}
  html .blk-title{font-size:18px;line-height:1.65;letter-spacing:.05em}
  html .blk-label{font-size:12.5px}
  html .dark-title{font-size:17px;letter-spacing:.04em;line-height:1.6}
  html .dark-title em{font-size:1.15em}
  html .sub-title{font-size:17px}
  html .pt-body h3,html .pts .pt-body h3{font-size:17px;line-height:1.6}
  html .pt-body li{font-size:13.5px}
  html .cs-body h3{font-size:17px;line-height:1.6}
  html .cs-tag{font-size:12.5px}
  html .wg-hd{font-size:15.5px}
  html .wg dt{font-size:14px}
  html .last-txt{font-size:18px;line-height:1.75}
  html .pl-big{font-size:34px}
  html .pl-rows dd{font-size:15px}
  html .msg-title{font-size:16px}
  html .pill{font-size:14px;min-height:52px;padding:12px 28px}
  html .tri-txt{font-size:13.5px}
  html .fac-grid b{font-size:13px}
  html .mv-tabs a{font-size:12px}
}
@media (max-width:760px){
  html:lang(en) .blk-title{font-size:21px;line-height:1.3;letter-spacing:0}
  html:lang(en) .dark-title{font-size:19px;letter-spacing:0}
  html:lang(en) .pt-body h3,html:lang(en) .pts .pt-body h3,html:lang(en) .cs-body h3{font-size:19px;line-height:1.3}
  html:lang(en) .last-txt{font-size:21px;line-height:1.35}
  html:lang(en) .ex-item figcaption b{font-size:15px;letter-spacing:0}
  html:lang(en) .pt-body li,html:lang(en) .tri-txt,html:lang(en) .cs-body p,html:lang(en) .msg-body p{font-size:15px;line-height:1.6}
  html:lang(en) .pill{font-size:15px}
}
@media (min-width:761px){.sp-br{display:none}}
@media (max-width:760px){html .cs-body h3 br{display:inline}}

/* スマホの大見出し：意味の区切り（、と<wbr>）でだけ改行する（10/4 総点検） */
@media (max-width:760px){html .blk-title br{display:inline}html .blk-title{word-break:keep-all;overflow-wrap:anywhere}}

/* ===== 10/4 ヒアリング反映：三者の図（作り直し）・月次報告書の見本・対応エリア・よくある質問・オーナー専用フォーム ===== */
/* 三者の図：細い金の線で3つの輪を重ね、中心に社名。各輪に「何を守るか」を一言 */
.tri-fig{position:relative;width:min(100%,400px);aspect-ratio:360/340;justify-self:center;margin:0}
.tri-fig svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.tri-rings circle{fill:rgba(44,76,57,.045);stroke:var(--gold);stroke-width:1;vector-effect:non-scaling-stroke}
.tri-dots circle{fill:var(--gold)}
.tri-node{position:absolute;display:grid;justify-items:center;gap:4px;text-align:center;transform:translate(-50%,-50%);color:var(--moss)}
.tri-node b{font-size:clamp(16px,1.6vw,19px);font-weight:700;letter-spacing:.14em}
.tri-node small{font:400 11.5px/1.5 var(--serif);color:var(--weak);letter-spacing:.06em;white-space:nowrap}
.tri-node--1{left:50%;top:22%}
.tri-node--2{left:27%;top:72%}
.tri-node--3{left:73%;top:72%}
.tri-core{position:absolute;left:50%;top:56%;transform:translate(-50%,-50%);font-size:11px;line-height:1.5;letter-spacing:.14em;color:var(--gold);text-align:center;font-weight:600;background:#fff;padding:6px 8px;border:1px solid var(--gold-soft)}
.js .tri-rings circle{stroke-dasharray:610;stroke-dashoffset:610;transition:stroke-dashoffset 1.6s var(--ease)}
.js .tri-fig.is-in .tri-rings circle{stroke-dashoffset:0}
.js .tri-fig.is-in .tri-rings circle:nth-child(2){transition-delay:.2s}.js .tri-fig.is-in .tri-rings circle:nth-child(3){transition-delay:.4s}
@media (max-width:760px){.tri-fig{width:min(88%,300px)}.tri-node small{font-size:10px;letter-spacing:0}.tri-node b{font-size:15px}}

/* 下書き（山内さん確認用）：点線の枠と札。?draft=0 で非表示、決まったら data-draft を外す or 消す */
.draft{position:relative;outline:1.5px dashed var(--gold-soft);outline-offset:14px}
.draft::before{content:"下書き：山内さん確認用（載せるか判断）";position:absolute;top:0;right:0;font:500 11px/1 var(--sans);background:#8a6d1f;color:#fff;padding:5px 9px;letter-spacing:.04em;z-index:2}
.drafts-off [data-draft]{display:none!important}
.tbc{display:inline-block;margin-left:8px;font:500 10.5px/1 var(--sans);color:#8a6d1f;border:1px solid #c9a95a;padding:3px 6px;vertical-align:2px}

/* 月次報告書の見本 */
.rp{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center}
.rp-doc{background:#fff;border:1px solid var(--line);box-shadow:0 18px 40px rgba(20,35,26,.08);padding:clamp(22px,3vw,36px);display:grid;gap:18px;transform:rotate(-.6deg)}
.rp-hd{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-bottom:12px;border-bottom:2px solid var(--moss)}
.rp-hd span{font-size:18px;font-weight:700;letter-spacing:.14em;color:var(--moss)}
.rp-hd small{font:400 11.5px var(--sans);color:var(--weak)}
.rp-kpi{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.rp-kpi>div{background:var(--bg-sub);padding:12px 14px;display:grid;gap:4px}
.rp-kpi dt{font-size:11.5px;color:var(--weak)}
.rp-kpi dd{font:600 18px/1.2 var(--latin);color:var(--moss-deep);letter-spacing:.06em}
.rp-kpi dd small{font:400 11px var(--sans);color:var(--weak)}
.rp-list{list-style:none;display:grid;gap:6px;font-size:13.5px}
.rp-list li{padding-left:16px;position:relative}
.rp-list li::before{content:"";position:absolute;left:0;top:.75em;width:7px;height:1px;background:var(--gold)}
.rp-note{font-size:15px;line-height:2.1}
@media (max-width:760px){.rp{grid-template-columns:1fr}.rp-doc{transform:none}.rp-note{font-size:13.5px}.rp-kpi dd{font-size:15px}}

/* 対応エリア */
.area{padding-top:clamp(56px,7vw,88px)}
.area-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:14px}
.area-list>div{background:#fff;padding:18px 20px;display:grid;gap:6px}
.area-list dt{font-size:16px;font-weight:700;color:var(--moss);letter-spacing:.08em}
.area-list dd{font-size:14px;line-height:1.9;color:var(--ink-2)}
@media (max-width:760px){.area-list{grid-template-columns:1fr}}

/* よくある質問 */
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-of-type{border-top:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;padding:18px 4px;font-size:15.5px;font-weight:600;line-height:1.6}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"Q";font:400 18px/1 var(--latin);color:var(--gold);flex:none}
.faq summary::after{content:"";margin-left:auto;flex:none;width:8px;height:8px;border-right:1.5px solid var(--moss);border-bottom:1.5px solid var(--moss);transform:rotate(45deg) translateY(-2px);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(-135deg) translateY(-2px)}
.faq details p{padding:0 4px 20px 32px;font-size:14.5px;line-height:2;color:var(--ink-2)}
@media (max-width:760px){.faq summary{font-size:14.5px;padding:15px 2px}.faq details p{font-size:13.5px;padding-left:28px}}

/* オーナー専用フォーム */
.of{scroll-margin-top:24px}
.of-lead{font-size:15px;line-height:2;margin-bottom:24px}
.of-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 24px;background:var(--bg-sub);padding:clamp(22px,3.4vw,44px)}
.of-row{display:grid;gap:8px}
.of-row--full,.of-agree,.of-msg,.of-act{grid-column:1/-1}
.of-lbl{font-size:13.5px;font-weight:600;letter-spacing:.06em;display:flex;align-items:center;gap:8px}
.of-lbl em,.of-lbl i{font:500 10.5px/1 var(--sans);font-style:normal;padding:3px 6px;letter-spacing:.04em}
.of-lbl em{background:var(--moss);color:#fff}
.of-lbl i{border:1px solid var(--line);color:var(--weak);background:#fff}
.of-form input[type=text],.of-form input[type=email],.of-form input[type=tel],.of-form select,.of-form textarea{width:100%;font:400 16px/1.6 var(--sans);color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:0;padding:12px 14px;min-height:48px;transition:border-color .2s}
.of-form textarea{resize:vertical;min-height:150px}
.of-form :is(input,select,textarea):focus{outline:none;border-color:var(--moss);box-shadow:0 0 0 3px rgba(44,76,57,.12)}
.of-form [aria-invalid=true]{border-color:#b4533a!important}
.of-chips{display:flex;flex-wrap:wrap;gap:8px}
.of-chips label{cursor:pointer}
.of-chips input{position:absolute;opacity:0;pointer-events:none}
.of-chips span{display:inline-block;padding:10px 16px;border:1px solid var(--moss-line);background:#fff;font-size:14px;letter-spacing:.04em;transition:background .2s,color .2s,border-color .2s}
.of-chips input:checked+span{background:var(--moss);border-color:var(--moss);color:#fff}
.of-chips input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.of-agree{display:flex;align-items:center;gap:10px;font-size:14px}
.of-agree input{width:20px;height:20px;accent-color:var(--moss)}
.of-agree a{color:var(--moss);text-underline-offset:4px}
.of-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.of-msg{font-size:14px;line-height:1.9;min-height:0}
.of-msg.is-err{color:#b4533a}
.of-msg.is-ok{color:var(--moss);background:#fff;border:1px solid var(--moss-line);padding:16px 18px}
.of-act{text-align:center}
.of-act .pill{border:0;cursor:pointer;font-family:var(--serif)}
.of-act .pill[disabled]{opacity:.6;cursor:wait}
.of-note{margin-top:14px}
@media (max-width:760px){.of-form{grid-template-columns:1fr;gap:16px;padding:20px 16px}.of-chips span{font-size:13px;padding:9px 12px}.of-act .pill{width:100%}.of-lead{font-size:14px}}

/* 会社欄の採用カード */
.cs--recruit{margin-top:clamp(48px,6vw,80px)}
.cs--recruit .cs-card{background:#fff}
.cs--recruit .cs-act{border-bottom:0;margin-bottom:0;padding-bottom:0}

/* ===== 10/4 背景のリズムを整理（つぎはぎをなくす）=====
   管理代行を知る＝白（収益モデルは暗い帯）／運営施設を見る＝白（施設一覧＋対応エリアは暗い帯）
   相談する＝欄全体を淡いグレー（カード・質問・フォームは白い面）／会社を知る＝白（採用は写真なしの帯で締める） */
.blk--end{padding-bottom:clamp(72px,9vw,120px)}
#consult .cs-card{background:#fff}
#consult .cs-act{border-bottom-color:rgba(0,0,0,.08)}
#consult .faq{background:#fff;padding:clamp(24px,3vw,40px);margin-top:clamp(56px,7vw,88px)}
#consult .faq.draft{outline-offset:8px}
#consult .sub{padding-top:0}

/* 対応エリア（施設一覧の暗い帯の中） */
.dark .area{margin-top:clamp(28px,3.4vw,40px);padding-top:clamp(24px,3vw,32px);border-top:1px solid rgba(255,255,255,.14);display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px 40px;align-items:start}
.dark .area-hd{font-size:15px;font-weight:700;letter-spacing:.12em;color:var(--gold-soft);padding-top:2px;white-space:nowrap}
.dark .area-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 32px;background:none;border:0;margin:0}
.dark .area-list>div{background:none;padding:0;display:grid;gap:4px}
.dark .area-list dt{font-size:14.5px;color:#fff;font-weight:600;letter-spacing:.08em}
.dark .area-list dd{font-size:13px;color:rgba(255,255,255,.7);line-height:1.8}
.dark .area-note{grid-column:2;font-size:12.5px;color:rgba(255,255,255,.6)}
@media (max-width:760px){.dark .area{grid-template-columns:1fr}.dark .area-list{grid-template-columns:1fr}.dark .area-note{grid-column:1}}

/* オーナー専用フォーム：左＝ご相談の流れ／右＝4つのまとまり */
.of{margin-top:clamp(56px,7vw,88px)}
.of-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:clamp(28px,4vw,64px);align-items:start}
.of-side{display:grid;gap:18px;position:sticky;top:24px}
.of-title{font-size:clamp(20px,1.9vw,25px);font-weight:700;letter-spacing:.1em;padding-bottom:14px;border-bottom:1px solid var(--ink)}
.of-lead{font-size:14.5px;line-height:2;margin:0}
.of-steps{list-style:none;display:grid;gap:0;counter-reset:st;border-left:1px solid var(--gold-soft);margin-left:12px}
.of-steps li{counter-increment:st;position:relative;padding:0 0 18px 26px;display:grid;gap:2px}
.of-steps li:last-child{padding-bottom:0}
.of-steps li::before{content:counter(st);position:absolute;left:-12px;top:0;width:24px;height:24px;border-radius:50%;background:#fff;border:1px solid var(--gold);color:var(--gold);display:grid;place-items:center;font:400 12px/1 var(--latin)}
.of-steps b{font-size:15px;letter-spacing:.06em}
.of-steps span{font-size:13px;color:var(--weak);line-height:1.8}
.of-form{display:grid;grid-template-columns:1fr;gap:0;background:#fff;padding:clamp(22px,3vw,40px);box-shadow:0 1px 0 rgba(0,0,0,.04)}
.of-group{border:0;margin:0;padding:0 0 24px;margin-bottom:24px;border-bottom:1px solid var(--line);min-width:0}
.of-legend{padding:0;margin-bottom:14px;font-size:15px;font-weight:700;letter-spacing:.08em;color:var(--moss);display:flex;align-items:center;gap:10px}
.of-legend em{font:500 10.5px/1 var(--sans);font-style:normal;padding:3px 6px;background:var(--moss);color:#fff}
.of-legend small{font:400 11.5px var(--sans);color:var(--weak);letter-spacing:.04em}
.of-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 20px}
.of-row{display:grid;gap:6px}
.of-lbl{font-size:13px;font-weight:600}
.of-form textarea{min-height:160px}
.of-agree,.of-msg,.of-act{grid-column:auto}
.of-agree{margin-top:4px}
.of-act{margin-top:18px}
@media (max-width:1023px){.of-wrap{grid-template-columns:1fr}.of-side{position:static}}
@media (max-width:760px){.of-grid{grid-template-columns:1fr;gap:14px}.of-form{padding:20px 16px}.of-group{padding-bottom:20px;margin-bottom:20px}.of-steps span{font-size:12.5px}}

/* 採用：写真をやめ、細い罫線で挟んだ文字の帯＋丸ボタン（会社を知るの締め） */
.rc{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px 56px;align-items:center;margin-top:clamp(56px,7vw,88px);padding:clamp(28px,3.4vw,40px) 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.rc-body{display:grid;gap:10px}
.rc-tag{font-size:13px;font-weight:600;color:var(--gold);letter-spacing:.16em}
.rc-title{font-size:clamp(19px,1.9vw,24px);font-weight:700;letter-spacing:.08em;line-height:1.6}
.rc-body>p:last-child{font-size:14px;color:var(--ink-2);line-height:2;max-width:40em}
@media (max-width:760px){.rc{grid-template-columns:1fr}.rc .pill{width:100%}html .rc-title{font-size:17px}}

/* ===== 10/4 三者の図をすっきり（点・中心の枠・塗りをやめ、輪の線だけ）＋描くタイミングを調整 ===== */
.tri-rings circle{fill:none;stroke-width:1.2}
.tri-core{background:none;border:0;padding:0;font-size:11.5px;letter-spacing:.2em}
.js [data-tri] .tri-rings circle{stroke-dasharray:610;stroke-dashoffset:610;transition:stroke-dashoffset 1.4s cubic-bezier(.45,.05,.25,1)}
.js [data-tri].is-in .tri-rings circle{stroke-dashoffset:0}
.js [data-tri].is-in .tri-rings circle:nth-child(2){transition-delay:.45s}
.js [data-tri].is-in .tri-rings circle:nth-child(3){transition-delay:.9s}
.js [data-tri] .tri-node,.js [data-tri] .tri-core{opacity:0;transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js [data-tri] .tri-node{transform:translate(-50%,-40%)}
.js [data-tri].is-in .tri-node{opacity:1;transform:translate(-50%,-50%)}
.js [data-tri].is-in .tri-node--1{transition-delay:1.3s}
.js [data-tri].is-in .tri-node--2{transition-delay:1.55s}
.js [data-tri].is-in .tri-node--3{transition-delay:1.8s}
.js [data-tri].is-in .tri-core{opacity:1;transition-delay:2.2s}
@media (prefers-reduced-motion:reduce){.js [data-tri] .tri-rings circle{stroke-dashoffset:0}.js [data-tri] .tri-node,.js [data-tri] .tri-core{opacity:1}}

/* ===== 10/4 よくあるご質問：フォームと同じ「左に見出し／右に中身」 ===== */
#consult .faq{margin-top:0;background:#fff;padding:clamp(8px,1.4vw,16px) clamp(20px,2.6vw,36px)}
#consult .faq-wrap{margin-top:clamp(64px,8vw,104px)}
#consult .faq-wrap.draft{outline-offset:12px}
.faq details:first-of-type{border-top:0}
.faq details:last-of-type{border-bottom:0}

/* ===== 10/4 相談フォーム：種類はプルダウン、ご連絡先・物件は縦一列。PCは「項目名｜記入欄」の行で横幅をそろえる ===== */
.of-rows{display:grid;gap:14px}
.of-row{grid-template-columns:9.5em minmax(0,1fr);align-items:center;gap:16px}
.of-row .of-lbl{display:flex;align-items:center;gap:8px;white-space:nowrap}
.of-group .of-row>select,.of-group .of-row>input{max-width:none}
@media (max-width:760px){.of-row{grid-template-columns:1fr;gap:6px}}
#consult .faq-wrap.draft::before{top:-38px;right:-12px}

/* ===== 10/4 17:30 調整 ===== */
/* 三者の図：中心の社名は枠なしの文字だけ */
.tri-core{background:none!important;border:0!important;padding:0!important;box-shadow:none!important}
/* 月次報告書：傾けない */
.rp-doc{transform:none!important}
/* 運営施設のスライド：スマホでは出さない（施設一覧の暗い帯で十分） */
@media (max-width:760px){.ex{display:none}}
/* 右下のバナー：背景を60%の不透明度＋後ろをぼかす */
.fb-item a{background:rgba(44,76,57,.66);-webkit-backdrop-filter:blur(10px) saturate(1.1);backdrop-filter:blur(10px) saturate(1.1)}
.fb-item:last-child a{background:rgba(24,41,31,.68)}
.fb-item a:hover{background:rgba(31,55,40,.78)}
.fb-item span{text-shadow:0 1px 6px rgba(8,14,10,.35)}
@media (max-width:1023px){.fb{background:rgba(24,41,31,.68);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.fb-item a,.fb-item:last-child a{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}}
/* フォーム：入力文字・例文も明朝にそろえ、例文は薄く */
.of-form input[type=text],.of-form input[type=email],.of-form input[type=tel],.of-form select,.of-form textarea{font-family:var(--serif);font-size:15.5px;font-weight:500;letter-spacing:.04em}
.of-form ::placeholder{font-family:var(--serif);color:#b4b8b4;opacity:1}
.of-form select:has(option[value=""]:checked){color:#b4b8b4}
.of-form select option{color:var(--ink)}
@media (max-width:760px){.of-form input[type=text],.of-form input[type=email],.of-form input[type=tel],.of-form select,.of-form textarea{font-size:16px}}
/* 「Myoko House」の注意書き：読める範囲でいちばん小さく */
.note--tiny,.tbl small.note--tiny{font-size:10.5px!important;line-height:1.7;letter-spacing:.02em;color:var(--weak)}

/* ===== 選ばれる理由：大きな写真に白いカードを重ねる（スマホのずらしと同じ考え方をPC・タブレットにも）===== */
.pt-tag{display:flex;align-items:center;gap:12px;font-size:12.5px;font-weight:600;letter-spacing:.22em;color:var(--gold)}
.pt-tag::before{content:"";width:28px;height:1px;background:var(--gold)}
.pt-body ol{counter-reset:none;gap:0}
.pt-body li{display:block;position:relative;padding:12px 0 12px 20px;border-top:1px solid var(--line);line-height:1.8}
.pt-body li:last-child{border-bottom:1px solid var(--line)}
.pt-body li::before{content:"";position:absolute;left:0;top:1.45em;width:8px;height:1px;background:var(--gold)}
@media (min-width:761px){
  .pts{background:var(--bg-sub);padding:clamp(64px,8vw,112px) 0;gap:clamp(64px,8vw,112px)}
  .pts .pt,.pts .pt:nth-child(even){background:none;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));max-width:1200px;width:100%;margin:0 auto;padding:0 var(--gutter);align-items:center}
  .pts .pt-ph{grid-column:1/9;grid-row:1;min-height:0;aspect-ratio:3/2;order:0}
  .pts .pt-body{grid-column:7/13;grid-row:1;position:relative;z-index:1;background:#fff;padding:clamp(28px,3.2vw,52px);box-shadow:0 22px 50px rgba(20,35,26,.10);gap:16px}
  .pts .pt:nth-child(even) .pt-ph{grid-column:5/13;order:0}
  .pts .pt:nth-child(even) .pt-body{grid-column:1/7}
  .pts .pt-body h3{font-size:clamp(20px,1.9vw,26px)}
  .pts .pt-body li{font-size:14.5px}
}
@media (min-width:761px) and (max-width:1023px){
  .pts .pt-ph{grid-column:1/10}.pts .pt-body{grid-column:6/13}
  .pts .pt:nth-child(even) .pt-ph{grid-column:4/13}.pts .pt:nth-child(even) .pt-body{grid-column:1/8}
}
@media (max-width:760px){.pt-tag{font-size:11.5px;letter-spacing:.16em}.pt-tag::before{width:20px}.pts .pt-body{gap:10px}.pt-body li{font-size:13.5px;padding:10px 0 10px 18px}}

/* 理由の見出し：意味の区切り（<wbr>）でだけ改行 */
.pt-body h3{word-break:keep-all;overflow-wrap:anywhere}

/* ===== 10/4 文章の改行を整える（築田さん指示）=====
   公開用に書き出すとき tools/phrase.py が日本語・中国語の文節の切れ目に <wbr> を入れ、<html class="phrased"> を付ける。
   そのページでは <wbr> と句読点の位置でだけ改行する（熟語の途中で切らない）。1行に収まる文は1行のまま */
html.phrased body{word-break:keep-all;overflow-wrap:anywhere;line-break:strict}
h1,h2,h3,h4,.blk-title,.dark-title,.last-txt,.mv-main,.rc-title,.of-title,.sub-title,.tri-node b,.ex-item figcaption b,.faq summary{text-wrap:balance}
p,li,dd,td,.note{text-wrap:pretty}
/* フォームの「選択してください」は通常の文字の濃さ */
.of-form select:has(option[value=""]:checked){color:var(--ink)}

@media (min-width:1024px){.pts .pt-body h3{font-size:clamp(20px,1.7vw,24px)}}

/* ===== 10/4 収益モデルの帯に月次報告書の見本を並べる：上段＝収益モデル｜見本、下段＝内訳・注意書き・ボタン ===== */
.dark-box--model{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:clamp(28px,4vw,56px)}
.dark-box--model .dark-side--row{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:16px 40px;align-items:center;padding-top:clamp(22px,3vw,32px);border-top:1px solid rgba(255,255,255,.14)}
.dark-box--model .dark-side--row .pl-fees{grid-row:1/3;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.dark-box--model .dark-side--row .pl-fees>div{flex-direction:column;align-items:flex-start;gap:6px}
.dark-box--model .dark-side--row .pill{justify-self:start}
.rp--dark{display:grid;gap:14px;grid-template-columns:1fr}
.rp--dark .rp-cap{font-size:14px;letter-spacing:.2em;color:var(--gold-soft);display:flex;align-items:center;gap:12px}
.rp--dark .rp-cap::before{content:"";width:28px;height:1px;background:var(--gold-soft)}
.rp--dark .rp-doc{color:var(--ink);box-shadow:0 18px 44px rgba(0,0,0,.35)}
.rp--dark .rp-note{font-size:13px;line-height:1.9;color:rgba(255,255,255,.72)}
.rp--dark.draft{outline-color:rgba(201,183,143,.7);outline-offset:10px}
@media (max-width:1023px){.dark-box--model{grid-template-columns:1fr}.dark-box--model .dark-side--row{grid-template-columns:1fr}.dark-box--model .dark-side--row .pl-fees{grid-row:auto}}
@media (max-width:760px){.dark-box--model .dark-side--row .pl-fees{grid-template-columns:1fr}.dark-box--model .dark-side--row .pl-fees>div{flex-direction:row;justify-content:space-between;align-items:baseline}.dark-box--model .dark-side--row .pill{justify-self:stretch}.rp--dark .rp-doc{padding:18px 16px}}
.rp--dark.draft::before{top:-36px;right:-10px}

/* スマホ（〜760px）：月次報告書の見本・よくあるご質問は折りたたみ、見たい人が開く（10/6 築田さん指示）。PC・タブレットは常に表示 */
.fold-btn{all:unset;display:inline;font:inherit;color:inherit;letter-spacing:inherit}
.rp--dark h3.rp-cap{font-weight:400;margin:0}
@media (max-width:760px){
  .fold-btn{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;box-sizing:border-box;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .fold-btn::after{content:"";flex:none;width:9px;height:9px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-3px);transition:transform .3s var(--ease)}
  .fold-btn[aria-expanded="true"]::after{transform:rotate(-135deg) translateY(-3px)}
  .fold-btn:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
  [data-fold]:not(.is-open) .rp-doc,[data-fold]:not(.is-open) .rp-note,
  [data-fold]:not(.is-open) .of-lead,[data-fold]:not(.is-open) .faq{display:none}
  /* 月次報告書：暗い帯の中で、細い枠の帯を押すと開く */
  .rp--dark .rp-cap::before{display:none}
  .rp--dark .rp-cap .fold-btn{padding:16px 18px;border:1px solid rgba(201,183,143,.45)}
  /* よくあるご質問：白い帯を押すと開く（管理業務の折りたたみと同じ見た目） */
  #faq .of-title{margin:0;padding:0;border:0}
  #faq .of-title .fold-btn{background:#fff;padding:18px;color:var(--moss)}
  #faq.is-open .of-lead{margin-top:14px}
}

/* メインビジュアル：四季の妙高山（10/10 妙高市観光協会の写真）。ゆっくり重ねて切り替え、表示中はわずかに寄っていく */
.mv-slides--season img{opacity:0;transform:scale(1.0);transition:opacity 2.2s var(--ease),transform 10s linear;object-position:50% 40%}
.mv-slides--season img.is-active{opacity:1;transform:scale(1.06)}
@media (max-width:760px){.mv-slides--season img{object-position:var(--px,50%) 50%}}
@media (prefers-reduced-motion:reduce){.mv-slides--season img,.mv-slides--season img.is-active{transform:none;transition:opacity .01s}}
.mv-season{margin-left:auto;display:grid;justify-items:end;gap:8px}
.mv-season ol{list-style:none;margin:0;padding:0;display:flex;gap:18px;font:400 10.5px/1 var(--latin);letter-spacing:.24em}
.mv-season li{opacity:.5;padding-top:9px;position:relative;transition:opacity .8s var(--ease)}
.mv-season li::before{content:"";position:absolute;left:0;right:.24em;top:0;height:1px;background:rgba(255,255,255,.35)}
.mv-season li.is-on{opacity:1}
.mv-season li.is-on::after{content:"";position:absolute;left:0;top:0;height:1px;width:0;background:#fff;animation:mvSeason 8s linear forwards}
@keyframes mvSeason{to{width:calc(100% - .24em)}}
.mv-season small{font-size:9.5px;letter-spacing:.12em;opacity:.75}
@media (prefers-reduced-motion:reduce){.mv-season li.is-on::after{animation:none;width:calc(100% - .24em)}}
@media (max-width:760px){
  .mv-season{order:-1;width:100%;grid-template-columns:1fr auto;align-items:end;margin:0 0 4px}
  .mv-season ol{gap:12px;font-size:9px;letter-spacing:.18em}
  .mv-season small{font-size:8.5px;grid-column:1;grid-row:1;justify-self:start}
}
/* 四季の写真では山を見せるため、文字は左下にまとめる（PC・タブレット）。スマホは下にまとめる */
.mv-slides--season::after{background:linear-gradient(0deg,rgba(8,14,10,.78) 0%,rgba(8,14,10,.45) 28%,rgba(8,14,10,0) 58%),linear-gradient(90deg,rgba(8,14,10,.35) 0%,rgba(8,14,10,0) 55%),linear-gradient(180deg,rgba(8,14,10,.25) 0%,rgba(8,14,10,0) 18%)}
@media (min-width:761px){
  .mv:has(.mv-slides--season) .mv-copy--lux{top:auto;bottom:calc(var(--tabs-h) + clamp(96px,13vh,132px));justify-items:start;text-align:left;gap:clamp(14px,2vh,22px)}
  .mv:has(.mv-slides--season) .mv-h1{justify-items:start;gap:clamp(10px,1.6vh,16px)}
  .mv:has(.mv-slides--season) .mv-main{padding-left:0;letter-spacing:.14em}
  .mv:has(.mv-slides--season) .mv-sub::before{width:40px;height:1px;margin:0 0 clamp(12px,1.6vh,18px)}
}
@media (max-width:760px){
  .mv:has(.mv-slides--season) .mv-copy--lux{top:auto;bottom:calc(var(--tabs-h) + 92px);align-content:end;justify-items:start;text-align:left;gap:14px}
  .mv:has(.mv-slides--season) .mv-h1{justify-items:start;gap:10px}
  .mv:has(.mv-slides--season) .mv-main{padding-left:0}
}
/* 春（菜の花）は明るいので少しだけ落として白文字を読みやすく */
.mv-slides--season img[src*="mv-spring"]{filter:brightness(.86) saturate(.95)}

/* ===== v19（10/23）：会社トップ／管理委託／不動産の3ページに分ける ===== */
/* ヘッダーのページ切り替え（PC・タブレット） */
.top-nav{display:flex;gap:clamp(16px,2vw,28px);font:500 13px/1.6 var(--serif);letter-spacing:.12em}
.top-nav a{color:var(--ink);text-decoration:none;padding:4px 0;border-bottom:1px solid transparent}
.top-nav a:hover,.top-nav a[aria-current="page"]{color:var(--moss);border-bottom-color:var(--moss)}
@media (max-width:1023px){.top-nav{display:none}}

/* 入口：管理委託／不動産（最初にお客様を分ける） */
.doors{padding-bottom:clamp(72px,9vw,120px)}
.door-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2.4vw,32px)}
.door{display:grid;grid-template-rows:auto 1fr;background:var(--bg-sub);color:var(--ink);text-decoration:none;transition:background .3s var(--ease)}
.door:hover{background:var(--moss-soft)}
.door-ph{position:relative;display:block;aspect-ratio:16/9;overflow:hidden}
.door-ph img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.door:hover .door-ph img{transform:scale(1.04)}
.door-body{display:grid;align-content:start;gap:12px;padding:clamp(22px,2.6vw,36px)}
.door-tag{font-size:13px;color:var(--gold);letter-spacing:.2em;font-weight:600}
.door-title{font-size:clamp(21px,2vw,27px);letter-spacing:.1em;line-height:1.5}
.door-txt{font-size:14.5px;line-height:1.95;color:var(--ink-2)}
.door-go{margin-top:8px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:16px;border-top:1px solid var(--line);font-size:14.5px;font-weight:600;color:var(--moss);letter-spacing:.08em}
.door-go::after{content:"";width:7px;height:7px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);flex:none}
.door--soon .door-ph img{filter:grayscale(.55) brightness(.9)}
.door-badge{position:absolute;left:14px;top:14px;background:rgba(24,41,31,.82);color:#fff;font-size:12px;letter-spacing:.2em;padding:6px 12px}
.door--soon .door-go{color:var(--weak)}
@media (max-width:760px){.door-grid{grid-template-columns:1fr}.door-body{gap:8px}.door-txt{font-size:13.5px}}

/* 管理委託ページのメインビジュアル（会社トップより低く。文字は空の部分＝上に置く） */
.mv--page{height:min(calc(100svh - var(--mv-top,90px)),760px)}
@media (max-width:760px){.mv--page{height:calc(86svh - var(--mv-top,90px))}}

/* 管理委託ページの対応エリア（白地） */
#consult .area{padding-top:0;margin-bottom:clamp(48px,6vw,72px)}
#consult .area-list>div{background:#fff}
#consult .area-note{font-size:13px;color:var(--weak)}

/* 不動産（準備中） */
.soon{min-height:calc(100svh - var(--mv-top,90px) - 160px);display:grid;align-items:center;text-align:center;padding-block:clamp(72px,12vw,140px);background:var(--bg-sub)}
.soon .blk-label::after{margin-inline:auto}
.soon-title{font-size:clamp(24px,3vw,36px);letter-spacing:.12em;line-height:1.6;margin-bottom:24px}
.soon-txt{font-size:15px;line-height:2;color:var(--ink-2);margin-bottom:40px}
.soon-act{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.pill--ghost{background:transparent;color:var(--moss-ink);box-shadow:inset 0 0 0 1px var(--moss-ink)}
.pill--ghost:hover{background:#fff}
@media (max-width:760px){.soon-title br,.soon-txt br{display:none}.soon-act .pill{width:100%}}
/* 下書き（月次報告書の見本）を隠したとき：収益モデルを1列で横いっぱいに（本番・?draft=0） */
.drafts-off .dark-box--model{grid-template-columns:minmax(0,1fr)}