:root{
  --ground:#F6F9EF;   /* 地 */
  --ground-2:#EAF3DA; /* 交互の地 */
  --pale:#D9EDBE;     /* 淡い面 */
  --leaf:#A9D46F;     /* 中間の面・飾り */
  --brand:#7DC242;    /* テーマカラー（上の文字は --ink） */
  --highlight:#E4F29A;/* 「足立区初」の札 */
  --deep:#2F6B1A;     /* 差し色（白文字） */
  --ink:#1E2F17;      /* 文字 */
  --muted:#4D5E44;    /* 補助の文字 */
  --white:#FFFFFF;
  --line:rgba(30,47,23,.14);

  --f-body:"Zen Kaku Gothic New","Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;
  --f-min:"Zen Old Mincho","Hiragino Mincho ProN","Yu Mincho",serif;

  --gutter:clamp(16px,4vw,56px);
  --wrap:1240px;
  --top:72px;           /* ヘッダーの高さ（JSで実測して上書き） */
  --shade-90:color-mix(in srgb,var(--ink) 90%,transparent);
  --shade-70:color-mix(in srgb,var(--ink) 70%,transparent);
  --shade-45:color-mix(in srgb,var(--ink) 45%,transparent);
  --shade-25:color-mix(in srgb,var(--ink) 25%,transparent);
  --shade-0:color-mix(in srgb,var(--ink) 0%,transparent);
  --shadow:0 18px 48px color-mix(in srgb,var(--ink) 22%,transparent);
  --shadow-sm:0 6px 20px color-mix(in srgb,var(--ink) 12%,transparent);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.8;letter-spacing:.02em;font-weight:400;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:var(--deep)}
h1,h2,h3,p,ul,ol,dl,dd,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
.nw{white-space:nowrap}
.ib{display:inline-block}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- ヘッダー ---------- */
.head{position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--ground) 94%,transparent);backdrop-filter:saturate(1.2) blur(10px);-webkit-backdrop-filter:saturate(1.2) blur(10px);border-bottom:1px solid var(--line)}
.head-in{display:flex;align-items:center;gap:28px;height:72px;max-width:2400px;margin-inline:auto;padding-inline:var(--gutter)}
.logo{display:flex;align-items:baseline;gap:14px;color:var(--ink);text-decoration:none}
.logo-name{font-family:var(--f-min);font-weight:900;font-size:26px;line-height:1;letter-spacing:.04em;white-space:nowrap}
.logo-role{font-size:14px;font-weight:500;color:var(--muted);white-space:nowrap}
.gnav{margin-left:auto;display:flex;align-items:center;gap:clamp(18px,2vw,34px)}
.gnav a{position:relative;color:var(--ink);text-decoration:none;font-size:16px;font-weight:500;padding:6px 0;white-space:nowrap}
.gnav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--brand);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.gnav a:hover::after{transform:scaleX(1)}
.head-cta{display:inline-flex;align-items:center;gap:8px;background:var(--deep);color:var(--white);text-decoration:none;font-weight:700;font-size:16px;padding:10px 22px;border-radius:999px;white-space:nowrap}
.head-cta svg{width:18px;height:18px}
.menu-btn{display:none;margin-left:auto;align-items:center;gap:8px;font:inherit;font-size:15px;font-weight:700;color:var(--ink);background:var(--white);border:1px solid var(--line);border-radius:999px;padding:7px 16px;cursor:pointer}
.menu-btn span{display:block;width:16px;height:2px;background:var(--ink);box-shadow:0 -5px 0 var(--ink),0 5px 0 var(--ink)}
.menu-btn{flex:none;white-space:nowrap}
@media (max-width:1099px){
  .gnav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:var(--ground);border-bottom:1px solid var(--line);padding:8px var(--gutter) 20px;box-shadow:var(--shadow-sm)}
  .gnav.is-open{display:flex}
  .gnav a{padding:14px 0;border-bottom:1px solid var(--line);font-size:17px}
  .gnav a::after{display:none}
  .menu-btn{display:inline-flex}
  .head-cta{order:3}
}
@media (max-width:719px){
  .head-in{height:64px;gap:12px}
  .logo{flex-direction:column;align-items:flex-start;gap:3px}
  .logo-name{font-size:23px}
  .logo-role{font-size:14px;line-height:1}
  .head-cta{display:none}
}

/* ---------- 最初の画面 ---------- */
.first{position:relative;--overlap:64px}
.stage{
  --k:1.7;    /* 写真の幅を高さの何倍まで広げるか（寄り方） */
  --fx:.56;   /* 顔の中心を置きたい横の位置 */
  --fy:.32;   /* 顔の中心を置きたい縦の位置 */
  position:relative;overflow:hidden;container-type:size;
  height:min(calc(100svh - var(--top)),90vw);min-height:480px;
  max-width:2400px;margin-inline:auto;background:var(--ink)
}
.stage-photo{
  /* 写真は、覆うのに要る幅・寄りたい幅のうち大きいほうを、元の画像の幅（2400px）で頭打ちにする */
  --w:min(2400px,max(100cqw,calc(var(--k) * 100cqh)));
  position:absolute;max-width:none;width:var(--w);height:calc(var(--w) * .75);
  left:clamp(calc(100cqw - var(--w)),calc(var(--fx) * 100cqw - var(--w) * .49),0px);
  top:clamp(calc(100cqh - var(--w) * .75),calc(var(--fy) * 100cqh - var(--w) * .33),0px)
}
.stage-shade{position:absolute;inset:0;pointer-events:none;background:
  linear-gradient(to top,var(--shade-90) 0%,var(--shade-70) 24%,var(--shade-25) 46%,var(--shade-0) 64%)}
.stage-type{
  position:absolute;z-index:1;color:var(--white);
  left:max(var(--gutter),calc((100cqw - 1320px) / 2 + var(--gutter)));right:var(--gutter);
  bottom:calc(var(--overlap) + clamp(22px,4.5cqh,64px))
}
.catch{font-family:var(--f-min);font-weight:700;font-size:clamp(19px,min(2.5cqi,4.6cqh),52px);line-height:1.4;letter-spacing:.06em;white-space:nowrap;text-shadow:0 1px 3px var(--shade-70),0 2px 18px var(--shade-70)}
/* キャッチは2行。2行目は、1行目の線のぶん下げて文字の頭をそろえる */
.catch span{display:block}
.catch span:first-child::before{content:"";display:inline-block;vertical-align:middle;width:1.6em;height:3px;margin:0 .6em .15em 0;background:var(--brand)}
.catch span+span{padding-left:2.2em}
.catch b{font-weight:inherit;color:var(--highlight)}
.name{font-family:var(--f-min);font-weight:900;font-size:clamp(46px,min(8.8cqi,15.5cqh),196px);line-height:1.12;letter-spacing:.03em;white-space:nowrap;margin:.12em 0 .14em -.04em;text-shadow:0 4px 30px var(--shade-45)}
.role{display:flex;flex-wrap:wrap;align-items:center;gap:.3em 1.1em;font-weight:700;text-shadow:0 1px 3px var(--shade-45);font-size:clamp(16px,min(1.55cqi,2.9cqh),30px);line-height:1.4;letter-spacing:.06em}
.role span{white-space:nowrap}
.role .party{font-weight:500;padding-left:1.1em;border-left:1px solid color-mix(in srgb,var(--white) 55%,transparent)}
.stage-cap{position:absolute;z-index:1;right:var(--gutter);bottom:calc(var(--overlap) + 18px);font-size:14px;color:color-mix(in srgb,var(--white) 82%,transparent);letter-spacing:.06em;white-space:nowrap}

/* 入口のカード（写真の下端に重ねる） */
.doors{position:relative;z-index:2;display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:clamp(12px,1.4vw,22px);max-width:1320px;margin:calc(-1 * var(--overlap)) auto 0;padding-inline:var(--gutter)}
.door{position:relative;display:block;height:clamp(150px,13.5vw,236px);overflow:hidden;border-radius:3px;color:var(--white);text-decoration:none;box-shadow:var(--shadow);background:var(--deep)}
.door img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.door::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,var(--shade-90) 0%,var(--shade-45) 42%,var(--shade-0) 78%)}
.door:hover img{transform:scale(1.04)}
.door-text{position:absolute;z-index:1;left:clamp(16px,1.8vw,26px);right:64px;bottom:clamp(14px,1.5vw,22px)}
.door-title{display:block;font-family:var(--f-min);font-weight:700;font-size:clamp(21px,1.75vw,28px);line-height:1.35;letter-spacing:.04em}
.door-sub{display:block;font-size:15px;font-weight:500;line-height:1.5;margin-top:4px;color:color-mix(in srgb,var(--white) 88%,transparent)}
.door-arrow{position:absolute;z-index:1;right:clamp(14px,1.5vw,22px);bottom:clamp(16px,1.6vw,24px);width:38px;height:38px;border-radius:50%;border:1px solid color-mix(in srgb,var(--white) 70%,transparent);display:grid;place-items:center;transition:background .25s}
.door-arrow svg{width:16px;height:16px}
.door:hover .door-arrow{background:var(--brand);border-color:var(--brand);color:var(--ink)}

@media (max-width:719px){
  .first{--overlap:28px}
  .stage{--k:1.58;--fx:.5;--fy:.36;height:min(calc(100svh - var(--top)),165vw);min-height:440px}
  .stage-shade{background:linear-gradient(to top,var(--shade-90) 0%,var(--shade-70) 24%,var(--shade-0) 52%)}
  .stage-type{left:var(--gutter);bottom:calc(var(--overlap) + 18px)}
  .catch{font-size:clamp(15px,4.6cqi,20px);letter-spacing:.04em}
  /* スマホは線と2行目の字下げを外し、狭い画面では文節の切れ目だけで折る */
  .catch span{white-space:normal;word-break:keep-all;overflow-wrap:anywhere}
  .catch span:first-child::before{display:none}
  .catch span+span{padding-left:0}
  .name{font-size:clamp(40px,14.2cqi,64px)}
  .role{font-size:clamp(15px,4.3cqi,18px);gap:.2em .9em}
  .stage-cap{display:none}
  .doors{grid-template-columns:1fr;gap:10px}
  .door{height:132px}
  .door-title{font-size:22px}
}

/* ---------- 見出し ---------- */
.sec{padding-block:clamp(80px,9vw,136px)}
.sec-head{display:grid;grid-template-columns:auto 1fr;align-items:end;gap:12px clamp(24px,4vw,64px);margin-bottom:clamp(40px,5vw,72px)}
.h2{font-family:var(--f-min);font-weight:900;font-size:clamp(40px,5.2vw,76px);line-height:1.15;letter-spacing:.02em;white-space:nowrap}
.sec-lead{font-size:17px;color:var(--muted);line-height:1.8;max-width:38em;padding-bottom:.5em;border-left:3px solid var(--brand);padding-left:18px}
.h2-pre{display:block;font-size:.36em;font-weight:700;letter-spacing:.08em;margin-bottom:.35em;color:var(--deep)}
.h3{font-family:var(--f-min);font-weight:700;font-size:clamp(24px,2.4vw,32px);line-height:1.4;letter-spacing:.03em}
.chip{display:inline-block;font-size:14px;font-weight:700;line-height:1;padding:7px 10px 6px;border-radius:2px;background:var(--pale);color:var(--deep);letter-spacing:.06em;white-space:nowrap}
.chip--first{background:var(--highlight);color:var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:12px 26px;border-radius:999px;background:var(--deep);color:var(--white);font-weight:700;font-size:16px;text-decoration:none;letter-spacing:.04em;transition:transform .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.btn svg{width:18px;height:18px;flex:none}
.btn--line{background:transparent;color:var(--deep);border:1.5px solid var(--deep)}
.more-link{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:16px;color:var(--deep);text-decoration:none;border-bottom:1.5px solid var(--leaf);padding-bottom:2px}
.more-link svg{width:16px;height:16px}
@media (max-width:719px){
  .sec-head{grid-template-columns:1fr}
}

/* ---------- ごあいさつ ---------- */
.greet{padding-top:clamp(96px,11vw,168px)}
.greet-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(36px,6vw,104px);align-items:center}
.greet-photo{position:relative;aspect-ratio:10/11;background:linear-gradient(to bottom,var(--pale),var(--ground-2));border-radius:3px;clip-path:inset(-18% 0 0 0)}
.greet-photo img{position:absolute;bottom:0;left:50%;width:124%;max-width:1389px;height:auto;transform:translateX(-50%)}
.greet-photo::after{content:"";position:absolute;left:0;right:0;bottom:0;height:14%;background:linear-gradient(to top,var(--ground-2),color-mix(in srgb,var(--ground-2) 0%,transparent))}
.greet-label{font-family:var(--f-min);font-weight:700;font-size:20px;letter-spacing:.12em;color:var(--deep);display:flex;align-items:center;gap:14px}
.greet-label::after{content:"";width:56px;height:1px;background:var(--deep)}
.greet-quote{font-family:var(--f-min);font-weight:700;font-size:clamp(25px,2.6vw,38px);line-height:1.7;letter-spacing:.04em;margin:28px 0 30px;text-wrap:pretty;word-break:keep-all;overflow-wrap:anywhere}
.greet-text{max-width:36em;color:var(--ink)}
.greet-text+.greet-text{margin-top:1em}
.sign{margin-top:28px;display:flex;align-items:center;gap:16px;font-size:15px;color:var(--muted)}
.sign b{font-family:var(--f-min);font-weight:900;font-size:28px;color:var(--ink);letter-spacing:.06em}
@media (max-width:719px){
  .greet-grid{grid-template-columns:1fr}
  .greet-photo{width:min(78%,360px);margin-inline:auto}
  .greet-quote{margin:20px 0 22px}
}

/* ---------- 実績 ---------- */
.results{background:var(--ground-2)}
.feat{position:relative}
.feat-photo{position:relative;aspect-ratio:16/8.4;overflow:hidden;border-radius:3px}
.feat-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 34%}
.feat-photo::after{content:"";position:absolute;inset:0;background:
  linear-gradient(to right,var(--shade-90) 0%,var(--shade-70) 30%,var(--shade-0) 64%),
  linear-gradient(to top,var(--shade-45) 0%,var(--shade-0) 40%)}
.feat-type{position:absolute;z-index:1;left:clamp(24px,4.4vw,72px);top:50%;transform:translateY(-50%);color:var(--white)}
.feat-type .chip{background:var(--brand);color:var(--ink)}
.big-num{font-family:var(--f-min);font-weight:900;font-size:clamp(46px,7.4vw,118px);line-height:1;letter-spacing:.01em;margin-top:18px;white-space:nowrap}
.big-num small{font-size:.46em;letter-spacing:.04em;margin-left:.08em}
.feat-title{font-family:var(--f-min);font-weight:700;font-size:clamp(20px,2.2vw,32px);line-height:1.4;margin-top:12px;letter-spacing:.06em}
.feat-body{position:relative;z-index:2;width:min(600px,100%);margin:clamp(-120px,-8vw,-64px) clamp(0px,3vw,48px) 0 auto;background:var(--white);padding:clamp(24px,3vw,40px);border-radius:3px;box-shadow:var(--shadow)}
.feat-body p+p{margin-top:.9em}
.voice{font-family:var(--f-min);font-weight:700;font-size:19px;line-height:1.7;color:var(--deep);border-top:1px solid var(--line);padding-top:18px;margin-top:20px !important}
.voice cite{display:block;font-family:var(--f-body);font-style:normal;font-weight:500;font-size:14px;color:var(--muted);margin-top:6px}
@media (max-width:719px){
  .feat-photo{aspect-ratio:4/5}
  .feat-photo img{object-position:54% 50%}
  .feat-photo::after{background:linear-gradient(to top,var(--shade-90) 0%,var(--shade-70) 36%,var(--shade-0) 70%)}
  .feat-type{top:auto;bottom:72px;transform:none;left:20px;right:20px}
  .feat-body{margin:-48px 12px 0}
}

.pair{display:grid;grid-template-columns:7fr 5fr;gap:clamp(24px,3vw,48px);margin-top:clamp(72px,8vw,120px);align-items:start}
.pair-item figure{position:relative;overflow:hidden;border-radius:3px}
.pair-item img{width:100%;height:100%;object-fit:cover}
.pair-item:first-child figure{aspect-ratio:5/4}
.pair-item:last-child{margin-top:clamp(0px,9vw,140px)}
.pair-item:last-child figure{aspect-ratio:4/5}
.pair-item figure::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,var(--shade-90) 0%,var(--shade-45) 34%,var(--shade-0) 62%)}
.pair-head{position:absolute;z-index:1;left:clamp(18px,2.4vw,32px);right:clamp(18px,2.4vw,32px);bottom:clamp(18px,2.4vw,30px);color:var(--white)}
.pair-head .chip{margin-bottom:12px}
.pair-head h3{font-family:var(--f-min);font-weight:700;font-size:clamp(22px,2.3vw,34px);line-height:1.45;letter-spacing:.03em;text-wrap:balance}
.pair-cap{position:absolute;z-index:1;top:14px;left:14px;font-size:14px;line-height:1.4;padding:5px 10px;border-radius:2px;background:color-mix(in srgb,var(--ground) 90%,transparent);color:var(--ink)}
.pair-item>p{margin-top:18px;max-width:34em}
@media (max-width:719px){
  .pair{grid-template-columns:1fr}
  .pair-item:last-child{margin-top:16px}
  .pair-item:first-child figure,.pair-item:last-child figure{aspect-ratio:4/3}
}

/* ショート動画 */
.shorts{margin-top:clamp(88px,9vw,140px);display:grid;grid-template-columns:minmax(240px,3fr) 9fr;gap:clamp(28px,4vw,64px);align-items:start}
.shorts-head p{margin-top:16px;color:var(--muted)}
.shorts-head .more-link{margin-top:22px}
.shorts-list{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.4vw,20px)}
.short-play{position:relative;display:block;width:100%;aspect-ratio:9/16;padding:0;border:0;border-radius:6px;overflow:hidden;cursor:pointer;background:var(--ink);box-shadow:var(--shadow-sm)}
.short-play img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.short-play:hover img{transform:scale(1.03)}
.short-play .pbtn{position:absolute;left:50%;top:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:color-mix(in srgb,var(--white) 92%,transparent);display:grid;place-items:center;box-shadow:var(--shadow-sm)}
.short-play .pbtn svg{width:20px;height:20px;margin-left:3px;color:var(--deep)}
.short iframe{display:block;width:100%;aspect-ratio:9/16;border:0;border-radius:6px;background:var(--ink)}
.short-cap{font-size:15px;line-height:1.6;margin-top:12px}
.short-cap .chip{margin:0 0 6px;display:table}
.short a.yt{display:inline-block;font-size:14px;margin-top:6px;color:var(--deep);font-weight:700}
@media (max-width:1099px){
  .shorts{grid-template-columns:1fr}
}
@media (max-width:719px){
  .shorts-list{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:46%;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter);scroll-padding-inline:var(--gutter)}
  .short{scroll-snap-align:start}
}

/* ほかにも */
.others{margin-top:clamp(80px,8vw,120px);border-top:1px solid var(--line);padding-top:clamp(40px,5vw,64px);display:grid;grid-template-columns:minmax(200px,3fr) 9fr;gap:clamp(24px,4vw,64px)}
.others-list{display:grid;grid-template-columns:1fr 1fr;gap:28px clamp(24px,3vw,48px)}
.others-list li{position:relative;padding-left:34px;font-size:16px;line-height:1.75}
.others-list li::before{content:"";position:absolute;left:0;top:4px;width:22px;height:22px;border-radius:50%;background:var(--brand)}
.others-list li::after{content:"";position:absolute;left:7px;top:9px;width:8px;height:5px;border-left:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(-45deg)}
.others-list strong{display:block;font-size:18px;font-weight:700;margin-bottom:4px;text-wrap:balance}
.others-list .chip{margin-right:8px;vertical-align:2px}
@media (max-width:899px){
  .others{grid-template-columns:1fr}
  .others-list{grid-template-columns:1fr}
}

/* ---------- 政策 ---------- */
.policy-head{position:relative;margin-bottom:clamp(56px,6vw,96px)}
.policy-quote{font-family:var(--f-min);font-weight:700;font-size:clamp(22px,2.4vw,34px);line-height:1.6;letter-spacing:.04em;max-width:24em;margin-top:22px}
.pillars{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,88px);align-items:start}
.pillars-col{display:grid;gap:clamp(56px,6vw,96px)}
.pillars-col:last-child{margin-top:clamp(0px,11vw,180px)}
.pillar figure{position:relative;overflow:hidden;border-radius:3px;margin-bottom:26px}
.pillar img{width:100%;height:100%;object-fit:cover}
.pillar--a figure{aspect-ratio:3/2}
.pillar--b{background:var(--pale);border-radius:3px;padding:clamp(28px,3.4vw,48px)}
.pillar--b h3{font-size:clamp(24px,2.4vw,34px)}
.pillar--b li::before{background:var(--deep)}
.pillar--c figure{aspect-ratio:4/3}
.pillar--d figure{aspect-ratio:4/5;width:78%;margin-left:auto}
.pillar--d img{object-position:50% 62%}
.pillar-for{font-size:15px;font-weight:700;color:var(--deep);letter-spacing:.08em;display:flex;align-items:center;gap:12px}
.pillar-for::before{content:"";width:28px;height:3px;background:var(--brand)}
.pillar h3{font-family:var(--f-min);font-weight:700;font-size:clamp(22px,2.1vw,30px);line-height:1.55;letter-spacing:.03em;margin:12px 0 20px;text-wrap:pretty;word-break:keep-all;overflow-wrap:anywhere;text-wrap:balance}
.pillar ul{display:grid;gap:8px}
.pillar li{position:relative;padding-left:22px;line-height:1.7;font-size:16px}
.pillar li::before{content:"";position:absolute;left:2px;top:.72em;width:8px;height:8px;border-radius:50%;background:var(--leaf)}
.pillar figcaption{position:absolute;left:12px;bottom:12px;font-size:14px;line-height:1.4;padding:5px 10px;border-radius:2px;background:color-mix(in srgb,var(--ground) 90%,transparent)}
@media (max-width:719px){
  .pillars{grid-template-columns:1fr;gap:56px}
  .pillars-col:last-child{margin-top:0}
  .pillar--d figure{width:100%;aspect-ratio:4/3}
}

/* ---------- プロフィール ---------- */
.profile{background:var(--ground-2)}
.profile-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(36px,6vw,104px);align-items:start}
.profile-photos{position:relative;padding-bottom:clamp(60px,8vw,110px)}
.profile-side{position:sticky;top:100px}
.profile-main{aspect-ratio:3/4;overflow:hidden;border-radius:3px}
.profile-main img{width:100%;height:100%;object-fit:cover;object-position:52% 50%}
.profile-sub{position:absolute;right:clamp(-48px,-3vw,-16px);bottom:0;width:58%;aspect-ratio:9/8;overflow:hidden;border-radius:3px;border:6px solid var(--ground-2);box-shadow:var(--shadow)}
.profile-sub img{width:100%;height:100%;object-fit:cover;object-position:62% 60%}
.profile-sub--tall{width:44%;aspect-ratio:4/5}
.profile-sub--tall img{object-position:50% 50%}
.profile-cap{font-size:14px;color:var(--muted);margin-top:12px;line-height:1.6}
.profile-lead{font-family:var(--f-min);font-weight:700;font-size:clamp(24px,2.6vw,36px);line-height:1.55;letter-spacing:.04em;word-break:keep-all;overflow-wrap:anywhere}
.profile-lead span{display:block}
.profile-intro{margin-top:20px;max-width:36em}
.career{margin-top:36px;border-top:1px solid var(--line)}
.career li{display:grid;grid-template-columns:7.5em 1fr;gap:20px;padding:18px 0;border-bottom:1px solid var(--line);font-size:16px;line-height:1.75}
.career b{font-weight:700;color:var(--deep);font-size:15px;letter-spacing:.06em}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:32px}
.fact{background:var(--white);border-radius:3px;padding:20px 22px}
.fact dt{font-size:14px;font-weight:700;color:var(--deep);letter-spacing:.08em}
.fact dd{margin-top:6px;font-size:16px;line-height:1.7}
.committee{margin-top:24px;font-size:15px;color:var(--muted);line-height:1.8}
@media (max-width:899px){
  .profile-grid{grid-template-columns:1fr}
  .profile-photos{max-width:480px}
  .profile-side{position:static}
  .facts{grid-template-columns:1fr}
}
@media (max-width:719px){
  .career li{grid-template-columns:1fr;gap:2px}
  .profile-sub{right:0}
  .profile-lead{font-size:20px}
}

/* ---------- 活動報告 ---------- */
/* 区政レポート */
.kusei{margin-bottom:clamp(64px,7vw,104px)}
.kusei-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 28px;margin-bottom:clamp(24px,3vw,36px)}
.kusei-head p{color:var(--muted);font-size:16px;line-height:1.7}
.kusei-body{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,3.5vw,56px);align-items:start}
.kusei-latest{display:grid;gap:20px;text-decoration:none;color:var(--ink)}
.kusei-latest img{width:100%;height:auto;border-radius:3px;box-shadow:var(--shadow);transition:transform .25s}
.kusei-latest:hover img{transform:translateY(-4px)}
.kusei-latest-text{display:grid;gap:10px;justify-items:start}
.kusei-latest-text b{font-family:var(--f-min);font-weight:700;font-size:clamp(21px,1.9vw,26px);line-height:1.45}
.kusei-latest-text>span:not(.chip):not(.kusei-pdf){font-size:16px;line-height:1.75;color:var(--muted)}
.kusei-pdf{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:16px;color:var(--deep);border-bottom:1.5px solid var(--leaf);padding-bottom:2px}
.kusei-pdf svg{width:16px;height:16px}
.kusei-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px clamp(14px,1.6vw,24px)}
.kusei-list a{display:block;text-decoration:none;color:var(--ink)}
.kusei-list img{width:100%;height:auto;border-radius:3px;box-shadow:var(--shadow-sm);transition:transform .25s}
.kusei-list a:hover img{transform:translateY(-3px)}
.kusei-list b{display:block;margin-top:12px;font-size:15px;font-weight:700;color:var(--deep);letter-spacing:.04em}
.kusei-list span{display:block;margin-top:2px;font-size:14px;line-height:1.6;color:var(--muted);word-break:keep-all;overflow-wrap:anywhere}
@media (max-width:899px){
  .kusei-body{grid-template-columns:1fr}
  .kusei-latest{grid-template-columns:minmax(0,2fr) minmax(0,3fr);align-items:center}
}
@media (max-width:719px){
  .kusei-latest{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:16px;align-items:start}
  /* スマホは過去の号を横に送って見る */
  .kusei-list{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(-1 * var(--gutter));padding:4px var(--gutter) 12px;scroll-padding-inline:var(--gutter)}
  .kusei-list li{flex:none;width:40%;scroll-snap-align:start}
}
.reports-grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(28px,4vw,64px);align-items:start}
.posts{border-top:1.5px solid var(--ink)}
.post{display:grid;grid-template-columns:7.5em 1fr auto;gap:8px 24px;align-items:baseline;padding:24px 4px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);transition:background .2s}
.post:hover{background:var(--ground-2)}
.post time{font-size:15px;font-weight:700;color:var(--deep);letter-spacing:.04em}
.post h3{font-size:19px;font-weight:700;line-height:1.55}
.post p{grid-column:2;font-size:16px;color:var(--muted);line-height:1.7}
.post .kind{grid-column:3;grid-row:1;font-size:14px;font-weight:700;color:var(--muted);white-space:nowrap}
.xbox{background:var(--deep);color:var(--white);border-radius:3px;padding:clamp(28px,3vw,40px);position:relative;overflow:hidden}
.xbox h3{font-family:var(--f-min);font-weight:700;font-size:clamp(22px,2vw,28px);line-height:1.5}
.xbox p{margin-top:12px;color:color-mix(in srgb,var(--white) 90%,transparent)}
.xbox .btn{margin-top:24px;background:var(--white);color:var(--deep)}
.xbox .sns-row{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:22px}
.xbox .sns-row a{color:var(--white);font-size:15px;font-weight:500;display:inline-flex;align-items:center;gap:8px;text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--white) 40%,transparent)}
.xbox .sns-row svg{width:16px;height:16px}
.strip{margin-top:clamp(56px,6vw,88px)}
.strip-list{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;padding-inline:max(var(--gutter),calc((100vw - var(--wrap)) / 2 + var(--gutter)));scroll-padding-inline:max(var(--gutter),calc((100vw - var(--wrap)) / 2 + var(--gutter)))}
.strip-list li{flex:none;scroll-snap-align:start}
.strip-list img{height:clamp(220px,22vw,300px);width:auto;max-width:none;border-radius:3px}
.strip-list figcaption{font-size:14px;color:var(--muted);margin-top:10px;line-height:1.5;max-width:22em}
@media (max-width:899px){
  .reports-grid{grid-template-columns:1fr}
}
@media (max-width:719px){
  .post{grid-template-columns:1fr auto}
  .post time{grid-column:1}
  .post .kind{grid-column:2}
  .post h3,.post p{grid-column:1 / -1}
}

/* ---------- 応援する ---------- */
.support{background:var(--pale)}
.support-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(36px,6vw,96px);align-items:center}
.support-photo{aspect-ratio:4/5;overflow:hidden;border-radius:3px;box-shadow:var(--shadow)}
.support-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.support .h2{margin-bottom:18px}
.ways{display:grid;gap:14px;margin-top:32px}
.way{display:grid;grid-template-columns:1fr auto;gap:8px 28px;align-items:center;background:var(--white);border-radius:3px;padding:24px 28px}
.way h3{font-family:var(--f-min);font-weight:700;font-size:23px;line-height:1.45}
.way p{grid-column:1;font-size:16px;color:var(--muted);line-height:1.7}
.way .btn,.way .sns-mini{grid-column:2;grid-row:1 / span 2}
.sns-mini{display:flex;gap:8px}
.sns-mini a{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--ground-2);color:var(--ink)}
.sns-mini a:hover{background:var(--brand)}
.sns-mini svg{width:19px;height:19px}
@media (max-width:899px){
  .support-grid{grid-template-columns:1fr}
  .support-photo{max-width:420px}
}
@media (max-width:719px){
  .way{grid-template-columns:1fr;padding:22px 20px}
  .way .btn,.way .sns-mini{grid-column:1;grid-row:auto;justify-self:start;margin-top:8px}
}

/* ---------- お問い合わせ ---------- */
.contact-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(36px,6vw,96px);align-items:start}
.contact-lead{display:flex;align-items:center;gap:20px;margin-top:24px}
.contact-lead img{width:84px;height:84px;border-radius:50%;object-fit:cover;flex:none;border:3px solid var(--white);box-shadow:var(--shadow-sm)}
.contact-lead p{font-family:var(--f-min);font-weight:700;font-size:21px;line-height:1.6}
.contact-box{background:var(--white);border-radius:3px;padding:clamp(24px,3vw,40px);display:grid;gap:26px}
.contact-box dt{font-size:14px;font-weight:700;color:var(--deep);letter-spacing:.08em}
.contact-box dd{margin:6px 0 0;font-size:17px}
.mail{font-family:var(--f-min);font-weight:700;font-size:clamp(21px,2.2vw,30px);color:var(--ink);text-decoration:none;border-bottom:2px solid var(--leaf);word-break:break-all}
.sns-list{display:flex;flex-wrap:wrap;gap:10px}
.sns-list a{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;border:1px solid var(--line);color:var(--ink);text-decoration:none;font-weight:700;font-size:15px}
.sns-list a:hover{background:var(--ground-2)}
.sns-list svg{width:17px;height:17px}
@media (max-width:899px){
  .contact-grid{grid-template-columns:1fr}
}

/* ---------- フッター ---------- */
.foot{background:var(--ink);color:color-mix(in srgb,var(--white) 88%,transparent);padding:64px 0 40px}
.foot-in{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:28px}
.foot-name{font-family:var(--f-min);font-weight:900;font-size:34px;color:var(--white);letter-spacing:.05em;line-height:1.2}
.foot-role{font-size:15px;margin-top:6px}
.foot-nav{display:flex;flex-wrap:wrap;gap:8px 24px}
.foot-nav a{color:color-mix(in srgb,var(--white) 88%,transparent);text-decoration:none;font-size:15px}
.foot-nav a:hover{color:var(--white);text-decoration:underline}
.foot-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;margin-top:44px;padding-top:22px;border-top:1px solid color-mix(in srgb,var(--white) 18%,transparent);font-size:14px}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none !important}
}

/* ---------- 本番で足したもの ---------- */
.foot-bottom a{color:inherit}

/* ---------- 下層のページ（寄付・プライバシーポリシー・ブログ） ---------- */
.doc{padding-block:clamp(48px,6vw,96px) clamp(80px,9vw,136px)}
.doc-wrap{max-width:880px}
.doc-crumb{font-size:15px;margin-bottom:clamp(20px,3vw,32px)}
.doc-crumb a{font-weight:700;text-decoration:none}
.doc-crumb a:hover{text-decoration:underline}
.doc-date{display:block;font-size:15px;color:var(--muted);letter-spacing:.08em;margin-bottom:12px}
.doc-title{font-family:var(--f-min);font-weight:900;font-size:clamp(28px,3.6vw,46px);line-height:1.4;letter-spacing:.02em;margin-bottom:clamp(32px,4vw,56px);padding-bottom:clamp(20px,2.4vw,28px);border-bottom:3px solid var(--brand)}
.doc-body>*+*{margin-top:1.2em}
.doc-body h2{font-family:var(--f-min);font-weight:900;font-size:clamp(22px,2.4vw,30px);line-height:1.45;margin-top:2.4em;padding-left:16px;border-left:4px solid var(--brand)}
.doc-body h2:first-child{margin-top:0}
.doc-body h3{font-size:19px;font-weight:700;line-height:1.6;margin-top:2em}
.doc-body ul{list-style:disc;padding-left:1.5em}
.doc-body ol{list-style:decimal;padding-left:1.7em}
.doc-body li+li{margin-top:.5em}
.doc-body li::marker{color:var(--deep)}
.doc-tags{color:var(--muted)}
.doc-video{position:relative;aspect-ratio:16/9;background:var(--ink);border-radius:6px;overflow:hidden}
.doc-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.doc-box{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:clamp(22px,3.4vw,40px);box-shadow:var(--shadow-sm)}
.doc-body .doc-box-title{font-family:var(--f-min);font-weight:900;font-size:clamp(22px,2.4vw,28px);line-height:1.4;margin:0 0 18px}
.doc-fields{display:grid;gap:0;border-top:1px solid var(--line)}
.doc-fields>div{padding:12px 0;border-bottom:1px solid var(--line)}
.doc-fields dt{font-weight:700}
.doc-fields dd{margin:4px 0 0;font-size:15px;color:var(--muted);line-height:1.7}
.doc-box-note{font-size:15px;color:var(--muted);margin-top:18px}
.doc-box-act{margin-top:22px}
.doc-back{margin-top:clamp(48px,6vw,80px)}
.nf{text-align:center}

/* ---------- フォーム（共通基盤のフォームの受け口が差し込む ks-form-*） ---------- */
.ks-form{display:grid;gap:22px;margin-top:8px}
.ks-form-field{display:grid;gap:8px}
.ks-form-field label{font-weight:700;line-height:1.6}
.ks-form-req,.ks-form-opt{display:inline-block;margin-left:10px;padding:1px 8px;border-radius:4px;font-size:14px;font-weight:700;vertical-align:2px}
.ks-form-req{background:var(--deep);color:#fff}
.ks-form-opt{background:var(--line);color:var(--ink)}
.ks-form input[type=text],.ks-form input[type=email],.ks-form input[type=tel],.ks-form select,.ks-form textarea{width:100%;font:inherit;font-size:16px;color:var(--ink);background:#fff;border:1px solid #b9c4b0;border-radius:8px;padding:12px 14px}
.ks-form textarea{resize:vertical;min-height:140px}
.ks-form input:focus,.ks-form select:focus,.ks-form textarea:focus{outline:3px solid var(--highlight);outline-offset:1px;border-color:var(--deep)}
.doc-body .ks-form-note{font-size:15px;color:var(--muted);line-height:1.7;margin:0}
.ks-form-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ks-form-consent label{display:flex;gap:10px;align-items:center;font-weight:700}
.ks-form-consent input{width:20px;height:20px;accent-color:var(--deep)}
.doc-body .ks-form-status{font-weight:700;color:var(--deep);margin:0}
.doc-body .ks-form-status:empty{display:none}
.doc-body .ks-form-act{margin:0}
.ks-form button[disabled]{opacity:.6;cursor:wait}
.nf .doc-title{border-bottom:0;padding-bottom:0;margin-bottom:16px}
