/* =====================================================================
   公益財団法人 tetote教育財団 — コーポレートサイト
   白基調・大きな余白・上品なタイポグラフィ / 水色をアクセントに
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Jost:wght@400..800&family=Montserrat:wght@400..900&family=Noto+Sans+JP:wght@400..900&display=swap');

/* 数字だけ Jost で表示（unicode-range で数字と数値記号のみ差し替え） */
@font-face{
  font-family:'JostNum';
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:local('Jost'), url('https://fonts.gstatic.com/s/jost/v20/92zatBhPNqw73oTd4jQmfxI.woff2') format('woff2');
  unicode-range:U+0030-0039, U+002C-002E, U+002F, U+003A, U+00A5;
}

:root{
  /* 水色アクセント */
  --sky:#0099e3;
  --sky-strong:#0079be;    /* 白背景でのテキスト用 */
  --sky-deep:#005c90;
  --sky-light:#66c2ee;
  --sky-pale:#e6f4fc;
  --sky-mist:#f2fafe;
  --sky-wash:#d2ebfa;
  --accent:#3fd0c4;        /* ティール */

  --ink:#182430;           /* 主要テキスト（ほぼ黒） */
  --ink-2:#3a4a58;
  --muted:#7c8a96;
  --line:#e7edf1;
  --paper:#ffffff;

  --grad:linear-gradient(120deg,#1fa9ec,#0079c2);
  --grad-soft:linear-gradient(120deg,#7fd2f5,#2fa3e8);

  --maxw:1180px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --shadow-sm:0 6px 22px rgba(20,90,130,.07);
  --shadow:0 22px 60px rgba(16,90,135,.13);
  --shadow-lg:0 40px 90px rgba(12,80,125,.18);
  --radius:22px;
  --radius-lg:32px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:88px; overflow-x:clip}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:'JostNum','Montserrat','Noto Sans JP',"Hiragino Kaku Gothic ProN","Hiragino Sans",-apple-system,BlinkMacSystemFont,Roboto,sans-serif;
  font-size:16px; line-height:1.9; letter-spacing:.02em;
  -webkit-font-smoothing:antialiased; overflow-x:clip; max-width:100%;
}
h1,h2,h3,h4{margin:0; line-height:1.32; letter-spacing:.02em; font-weight:800}
p{margin:0}
a{color:inherit; text-decoration:none}
img,svg{display:block; max-width:100%}
:focus-visible{outline:2.5px solid var(--sky); outline-offset:4px; border-radius:6px}
section[id]{scroll-margin-top:96px}
.wrap{width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:clamp(20px,5vw,48px)}

/* 縦書き風の欧文ラベル・共通見出し部品 */
.kicker{
  display:inline-flex; align-items:center; gap:10px;
  font-size:12px; font-weight:700; letter-spacing:.28em; color:var(--sky-strong);
  text-transform:uppercase;
}
.kicker::before{content:""; width:26px; height:1.5px; background:var(--sky)}
.lead{color:var(--ink-2); font-size:clamp(1rem,1.7vw,1.12rem); line-height:2}

/* ボタン */
.btn{
  display:inline-flex; align-items:center; gap:10px; justify-content:center;
  font-weight:700; font-size:15px; font-family:inherit; cursor:pointer;
  padding:15px 30px; border-radius:999px; border:1.5px solid transparent; line-height:1;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), background .3s, color .3s, border-color .3s;
  white-space:nowrap;
}
.btn svg{width:17px; height:17px; transition:transform .3s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn--fill{background:var(--ink); color:#fff}
.btn--fill:hover{transform:translateY(-3px); box-shadow:0 16px 34px rgba(24,36,48,.28)}
.btn--sky{background:var(--grad); color:#fff; box-shadow:0 14px 30px rgba(0,121,194,.32)}
.btn--sky:hover{transform:translateY(-3px); box-shadow:0 20px 40px rgba(0,121,194,.42)}
.btn--line{background:transparent; color:var(--ink); border-color:var(--line)}
.btn--line:hover{border-color:var(--ink); transform:translateY(-3px)}
.btn--ghost{background:rgba(255,255,255,.14); color:#fff; border-color:rgba(255,255,255,.55); backdrop-filter:blur(4px)}
.btn--ghost:hover{background:rgba(255,255,255,.24); transform:translateY(-3px)}

/* テキストリンク（矢印付き） */
.tlink{display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:14.5px; color:var(--sky-strong)}
.tlink svg{width:16px; height:16px; transition:transform .3s var(--ease)}
.tlink:hover svg{transform:translateX(5px)}

/* セクション共通 */
.section{padding:clamp(80px,13vw,168px) 0}
.section--pale{background:var(--sky-mist)}
.section-head{max-width:760px; margin-bottom:clamp(40px,6vw,72px)}
.section-head.center{margin-inline:auto; text-align:center}
.section-title{font-size:clamp(1.9rem,4.6vw,3.1rem); font-weight:800; letter-spacing:.03em; margin-top:22px}
.section-title .thin{font-weight:400; color:var(--muted)}
.section-title em{font-style:normal; color:var(--sky-strong)}
.section-lead{margin-top:24px; color:var(--ink-2); font-size:clamp(1rem,1.7vw,1.1rem); line-height:2.05}

/* =====================================================================
   スクロール進捗バー
   ===================================================================== */
.progress{position:fixed; top:0; left:0; height:2px; width:100%; z-index:60;
  transform-origin:0 50%; transform:scaleX(0); background:var(--grad)}
@supports (animation-timeline: scroll()){
  .progress{animation:pg linear both; animation-timeline:scroll(root)}
}
@keyframes pg{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* =====================================================================
   ヘッダー
   ===================================================================== */
.hdr{position:fixed; inset:0 0 auto 0; z-index:50; transition:background .35s, box-shadow .35s, backdrop-filter .35s}
.hdr__inner{display:flex; align-items:center; justify-content:space-between; height:76px}
.hdr.is-stuck{background:rgba(255,255,255,.85); backdrop-filter:saturate(180%) blur(16px); box-shadow:0 1px 0 var(--line)}
.brand{display:flex; align-items:center; gap:11px; color:var(--ink)}
.brand__logo{height:32px; width:auto; display:block; flex:none}
.brand__name{display:flex; flex-direction:column; justify-content:center; line-height:1.18}
.brand__pre{font-size:10px; font-weight:800; letter-spacing:.16em; color:var(--sky-strong)}
.brand__main{font-weight:900; font-size:17px; letter-spacing:.05em; color:var(--ink); margin:1px 0}
.brand__en{font-size:8.5px; font-weight:600; letter-spacing:.1em; color:var(--muted); white-space:nowrap}
.nav{display:flex; align-items:center; gap:4px}
.nav a{padding:10px 14px; border-radius:999px; font-size:13.5px; font-weight:700; color:var(--ink-2); white-space:nowrap; transition:background .2s,color .2s}
.nav a:hover{background:var(--sky-pale); color:var(--sky-strong)}
.nav a[aria-current="page"]{color:var(--sky-strong); background:var(--sky-pale)}
.hdr__cta{margin-left:10px}
.nav-toggle{display:none; width:46px; height:46px; border:0; background:transparent; cursor:pointer; color:var(--ink)}
.nav-toggle svg{width:26px; height:26px; margin-inline:auto}

/* =====================================================================
   ヒーロー
   ===================================================================== */
.hero{--wave-h:clamp(50px,7vw,96px); position:relative; overflow:hidden; isolation:isolate; display:flex; align-items:center;
  min-height:calc(min(760px,94vh) + var(--wave-h)); padding:clamp(120px,15vw,150px) 0 calc(clamp(70px,10vw,110px) + var(--wave-h));
  background:linear-gradient(180deg,#ffffff 0%,#ffffff 42%,#e6f4fc 100%)}

/* ヒーロー下端の波（画像を波の内側まで表示） */
.hero__wave{position:absolute; left:0; right:0; bottom:-1px; height:var(--wave-h); z-index:2; line-height:0; pointer-events:none}
.hero__wave svg{width:100%; height:100%; display:block}

/* 右側フルブリード画像（PC） */
.hero__media{position:absolute; top:0; right:0; bottom:0; width:46vw; z-index:0}
.hero__media img{width:100%; height:100%; object-fit:cover; display:block; animation:heroImg 1.3s var(--ease) both}
@keyframes heroImg{from{opacity:0; transform:scale(1.05)}to{opacity:1; transform:none}}
/* 左端を白へなじませるフェード（PC） */
.hero__media::before{content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(95deg,#e6f4fc 0%, rgba(234,246,252,.5) 13%, transparent 40%)}
.hero__media::after{content:""; position:absolute; inset:0; z-index:1; pointer-events:none; display:none}

.hero .wrap{position:relative; z-index:2}
.hero__copy{max-width:min(540px,50%)}
.hero h1{font-size:clamp(2.5rem,6.2vw,4.6rem); font-weight:900; line-height:1.28; letter-spacing:.02em; color:var(--ink)}
.hero h1 .accent{color:var(--sky-strong); position:relative}
.hero h1 .brush{position:relative; white-space:nowrap}
.hero h1 .brush svg{position:absolute; left:-2%; right:-2%; bottom:-.14em; width:104%; height:.3em; z-index:-1}
.hero__sub{margin-top:28px; max-width:26em; color:var(--ink-2); font-size:clamp(1rem,1.9vw,1.15rem); line-height:2.1}
.hero__actions{display:flex; flex-wrap:wrap; gap:14px; margin-top:clamp(48px,6.5vw,72px)}
.hero__meta{margin-top:24px; font-size:12.5px; color:var(--muted); display:flex; align-items:center; gap:8px}
.hero__meta svg{width:15px; height:15px; color:var(--sky-strong)}

/* フローティングバッジ（画像の上） */
.hero__badge{position:absolute; left:-28px; bottom:34px; z-index:3; background:#fff; border-radius:18px; padding:12px 16px;
  box-shadow:var(--shadow); display:flex; align-items:center; gap:11px; animation:heroCard 1s var(--ease) .6s both}
@keyframes heroCard{from{opacity:0; transform:translateY(16px)}to{opacity:1; transform:none}}
.hero__badge .hi{width:38px; height:38px; border-radius:11px; background:var(--grad); display:grid; place-items:center; flex:none}
.hero__badge .hi img{width:24px; height:auto; display:block}
.hero__badge b{display:block; font-size:14px; font-weight:800; line-height:1.3; color:var(--ink)}
.hero__badge span{display:block; font-size:11.5px; color:var(--muted); font-weight:700}
.dash{stroke-dasharray:var(--len); stroke-dashoffset:var(--len); animation:draw 2.4s var(--ease) .3s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.pop{opacity:0; transform-box:fill-box; transform-origin:center; animation:pop .7s var(--ease) 1.7s forwards}
@keyframes pop{0%{opacity:0; transform:scale(.4)}70%{transform:scale(1.12)}100%{opacity:1; transform:scale(1)}}
.floaty{animation:floaty 5s ease-in-out infinite}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

.hero__scroll{position:absolute; left:50%; bottom:calc(var(--wave-h) + 22px); z-index:3; translate:-50% 0; display:flex; flex-direction:column; align-items:center; gap:8px; font-family:'Jost',sans-serif; font-size:11px; letter-spacing:.25em; font-weight:600; color:var(--muted)}
.hero__scroll i{width:1.5px; height:44px; background:linear-gradient(var(--sky),transparent); position:relative; overflow:hidden}
.hero__scroll i::after{content:""; position:absolute; top:-44px; left:0; width:100%; height:44px; background:var(--sky); animation:scrolldot 1.8s var(--ease) infinite}
@keyframes scrolldot{to{transform:translateY(88px)}}

/* =====================================================================
   SVGディバイダー
   ===================================================================== */
.divider{display:block; width:100%; height:clamp(48px,7vw,96px); line-height:0; margin-top:-1px; margin-bottom:-1px}
.divider svg{width:100%; height:100%; display:block}
.divider--flip svg{transform:scaleX(-1)}

/* =====================================================================
   ミッション（理念）
   ===================================================================== */
.mission{text-align:center}
.mission__quote{font-size:clamp(1.5rem,4.3vw,2.7rem); font-weight:800; line-height:1.85; letter-spacing:.04em; color:var(--ink); max-width:20em; margin-inline:auto}
.mission__quote b{color:var(--sky-strong)}
.mission__mark{height:52px; width:auto; margin:0 auto 30px; display:block}
.mission__sub{margin-top:34px; color:var(--muted); font-size:14px; letter-spacing:.18em; font-weight:700}

/* 数字ではない、事実ベースの3柱バンド */
.pillars{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2.5vw,28px); margin-top:clamp(48px,6vw,72px)}
.pillar{text-align:center; padding:8px}
.pillar__no{font-size:13px; font-weight:800; letter-spacing:.2em; color:var(--sky)}
.pillar b{display:block; font-size:clamp(1.05rem,2vw,1.3rem); font-weight:800; margin-top:10px}
.pillar span{display:block; margin-top:8px; font-size:13.5px; color:var(--muted)}

/* =====================================================================
   3Dカルーセル（活動）
   ===================================================================== */
.carousel-sec{position:relative; overflow:hidden; clip-path:inset(0)}
.stage3d{position:relative; height:520px; perspective:1600px; margin-top:8px; touch-action:pan-y}
.stage3d__inner{position:absolute; inset:0; margin:auto; width:340px; height:460px; left:0; right:0;
  transform-style:preserve-3d}
.acard{
  position:absolute; inset:0; width:340px; height:460px; background:#fff; color:var(--ink);
  border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:var(--shadow); display:flex; flex-direction:column; will-change:transform;
  transition:transform .8s var(--ease), opacity .6s var(--ease), box-shadow .4s;
}
.acard__media{height:210px; position:relative; display:grid; place-items:center; overflow:hidden}
.acard__media svg.illus{width:120px; height:120px; position:relative; z-index:1}
.acard__media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease)}
.acard:hover .acard__media img{transform:scale(1.05)}
.acard__media::after{content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(9,52,84,.42) 0%, rgba(9,52,84,0) 45%)}
.acard__no{z-index:2}
.acard__no{position:absolute; top:18px; left:20px; font-size:12px; font-weight:800; letter-spacing:.2em; color:#fff; z-index:1; opacity:.9}
.acard__body{padding:26px 26px 28px; display:flex; flex-direction:column; flex:1}
.acard h3{font-size:1.35rem; font-weight:800; letter-spacing:.03em}
.acard p{margin-top:14px; font-size:14px; color:var(--ink-2); line-height:1.95; flex:1}
.acard .tlink{margin-top:18px}
.acard[aria-hidden="true"]{pointer-events:none}
.acard.is-front{box-shadow:var(--shadow-lg)}

.carousel-ctrl{display:flex; align-items:center; justify-content:center; gap:20px; margin-top:44px}
.cbtn{width:54px; height:54px; border-radius:50%; border:1.5px solid var(--line); background:#fff; color:var(--ink);
  cursor:pointer; display:grid; place-items:center; transition:border-color .25s, transform .25s, background .25s}
.cbtn:hover{border-color:var(--sky); background:var(--sky-pale); transform:scale(1.06)}
.cbtn svg{width:22px; height:22px}
.cdots{display:flex; gap:10px}
.cdot{width:9px; height:9px; border-radius:50%; border:0; padding:0; cursor:pointer; background:var(--line); transition:width .3s, background .3s}
.cdot.on{width:28px; border-radius:999px; background:var(--sky)}
.carousel-hint{text-align:center; margin-top:18px; font-size:12.5px; color:var(--muted)}

/* =====================================================================
   価値観キーワード marquee
   ===================================================================== */
.marquee{overflow:hidden; padding:6px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee__track{display:flex; align-items:center; gap:38px; width:max-content; animation:marquee 32s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}
.marquee__item{font-size:clamp(1.4rem,3.4vw,2.3rem); font-weight:900; letter-spacing:.04em; color:var(--ink); white-space:nowrap; display:flex; align-items:center; gap:38px}
.marquee__item::after{content:""; flex:none; width:34px; height:28px; background:url(/logo.svg) center/contain no-repeat}
.marquee__item.o{color:transparent; -webkit-text-stroke:1.4px var(--sky-light)}

/* =====================================================================
   寄付
   ===================================================================== */
.donate{position:relative; overflow:hidden; isolation:isolate; color:#fff}
.donate__bg{position:absolute; inset:0; z-index:-2; background:#0077be}
.donate__dots{display:none}
.donate__grid{display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,72px); align-items:center}
.donate .kicker{color:#fff}
.donate .kicker::before{background:rgba(255,255,255,.7)}
.donate h2{font-size:clamp(1.8rem,4.4vw,2.9rem); font-weight:800; letter-spacing:.03em; margin-top:20px}
.donate__lead{margin-top:22px; font-size:clamp(1rem,1.8vw,1.12rem); line-height:2.05; color:rgba(255,255,255,.94)}
.donate__actions{margin-top:34px; display:flex; flex-wrap:wrap; gap:14px}
.taxcard{background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.24); border-radius:var(--radius-lg);
  padding:clamp(26px,3vw,36px); backdrop-filter:blur(10px)}
.taxcard h3{font-size:1.15rem; font-weight:800; letter-spacing:.04em; display:flex; align-items:center; gap:10px}
.taxcard h3 svg{width:22px; height:22px}
.taxlist{list-style:none; margin:20px 0 0; padding:0; display:flex; flex-direction:column; gap:16px}
.taxlist li{display:flex; gap:14px; font-size:14px; line-height:1.85; color:rgba(255,255,255,.92)}
.taxlist .ti{flex:none; width:30px; height:30px; border-radius:9px; background:rgba(255,255,255,.16); display:grid; place-items:center}
.taxlist .ti svg{width:17px; height:17px}
.taxlist b{color:#fff; font-weight:800}
.taxcard__note{margin-top:20px; font-size:12px; color:rgba(255,255,255,.72); line-height:1.7}
/* スマホでは税制優遇カードを非表示 */
@media (max-width:760px){ .taxcard{display:none} }

/* =====================================================================
   お知らせ
   ===================================================================== */
.news{display:flex; flex-direction:column}
.news__row{display:grid; grid-template-columns:150px 120px 1fr auto; gap:20px; align-items:center;
  padding:24px 8px; border-top:1px solid var(--line); transition:background .25s, padding-inline .25s}
.news__row:last-child{border-bottom:1px solid var(--line)}
.news__row:hover{background:var(--sky-mist)}
.news__date{font-size:13.5px; font-weight:700; color:var(--muted); font-variant-numeric:tabular-nums; letter-spacing:.06em}
.news__cat{justify-self:start; font-size:11.5px; font-weight:800; color:var(--sky-strong); background:var(--sky-pale); padding:5px 13px; border-radius:999px; white-space:nowrap}
.news__ttl{font-size:15.5px; font-weight:700; color:var(--ink)}
.news__row .arw{width:34px; height:34px; border-radius:50%; border:1px solid var(--line); display:grid; place-items:center; color:var(--sky-strong); transition:background .25s, transform .25s}
.news__row:hover .arw{background:var(--sky); color:#fff; transform:translateX(3px)}
.news__row .arw svg{width:16px; height:16px}

/* =====================================================================
   法人概要
   ===================================================================== */
.about-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(36px,5vw,72px); align-items:start}
.profile{width:100%; border-collapse:collapse}
.profile th,.profile td{text-align:left; padding:20px 4px; border-bottom:1px solid var(--line); vertical-align:top; font-size:14.5px; line-height:1.85}
.profile th{width:34%; font-weight:800; color:var(--sky-strong); letter-spacing:.05em}
.profile td{color:var(--ink-2)}
.about__card{background:var(--sky-mist); border:1px solid var(--line); border-radius:var(--radius-lg); padding:clamp(28px,3.5vw,44px)}
.about__card h3{font-size:1.2rem; font-weight:800; letter-spacing:.04em}
.about__card p{margin-top:16px; color:var(--ink-2); font-size:14.5px; line-height:2}
.about__stat{display:flex; gap:26px; margin-top:30px; flex-wrap:wrap}
.about__stat div b{display:block; font-size:clamp(1.7rem,4vw,2.4rem); font-weight:900; color:var(--sky-strong); line-height:1; font-variant-numeric:tabular-nums}
.about__stat div span{font-size:12.5px; color:var(--muted); font-weight:700}

/* =====================================================================
   お問い合わせ CTA
   ===================================================================== */
.contact{text-align:center}
.contact h2{font-size:clamp(1.9rem,4.6vw,3rem); font-weight:800; letter-spacing:.03em}
.contact__lead{margin-top:22px; color:var(--ink-2); font-size:clamp(1rem,1.7vw,1.1rem)}
.contact__ways{display:flex; flex-wrap:wrap; justify-content:center; gap:16px}
.contact__way{display:flex; align-items:center; gap:14px; background:#fff; border:1px solid var(--line); border-radius:16px; padding:18px 24px; box-shadow:var(--shadow-sm)}
.contact__way .ci{width:44px; height:44px; border-radius:12px; background:var(--sky-pale); color:var(--sky-strong); display:grid; place-items:center; flex:none}
.contact__way .ci svg{width:22px; height:22px}
.contact__way .cv{text-align:left}
.contact__way .cv small{display:block; font-size:11.5px; color:var(--muted); font-weight:700; letter-spacing:.08em}
.contact__way .cv b{font-size:17px; font-weight:800; letter-spacing:.04em}
.contact__hours{margin-top:26px; font-size:13px; color:var(--muted)}

/* =====================================================================
   フッター
   ===================================================================== */
.foot{background:#0d2634; color:rgba(255,255,255,.78); padding:clamp(60px,8vw,90px) 0 34px}
.foot__top{display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:40px; padding-bottom:44px; border-bottom:1px solid rgba(255,255,255,.12)}
.foot .brand__main{color:#fff}
.foot .brand__pre{color:var(--sky-light)}
.foot .brand__en{color:rgba(255,255,255,.5)}
.foot__about{margin-top:20px; font-size:13.5px; line-height:1.95; max-width:32em; color:rgba(255,255,255,.7)}
.foot__addr{margin-top:20px; font-size:12.5px; line-height:1.9; color:rgba(255,255,255,.6)}
.foot__col h4{font-size:12px; font-weight:800; color:#fff; letter-spacing:.14em; margin-bottom:16px}
.foot__col a{display:block; font-size:13.5px; padding:6px 0; color:rgba(255,255,255,.72); transition:color .2s}
.foot__col a:hover{color:var(--sky-light)}
.foot__bottom{display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; padding-top:26px; font-size:12px; color:rgba(255,255,255,.5)}

/* =====================================================================
   スクロールリビール
   ===================================================================== */
.reveal{opacity:0; transform:translateY(26px); transition:opacity .9s var(--ease), transform .9s var(--ease)}
.reveal.in{opacity:1; transform:none}
.reveal.d1{transition-delay:.1s}.reveal.d2{transition-delay:.2s}.reveal.d3{transition-delay:.3s}.reveal.d4{transition-delay:.4s}

/* =====================================================================
   レスポンシブ
   ===================================================================== */
@media (max-width:960px){
  /* スマホ：画像を画面いっぱい（全幅）に、テキストは下 */
  .hero{display:block; min-height:0; padding:0 0 calc(clamp(30px,6vw,44px) + var(--wave-h))}
  .hero__media{position:relative; width:100%; height:min(64vh,540px)}
  .hero__media::before{background:linear-gradient(0deg,#e6f4fc 0%, rgba(234,246,252,0) 26%)}
  .hero__media::after{display:block; top:0; left:0; right:0; bottom:auto; height:130px;
    background:linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,0))}
  .hero .wrap{padding-top:clamp(26px,6vw,40px)}
  .hero__copy{max-width:none; text-align:center; margin-inline:auto}
  /* 末尾の句読点（、。）による左寄り錯視を補正して視覚的中央に */
  .hero h1{padding-left:.6em; text-indent:.02em}
  .hero__actions,.hero__meta{justify-content:center}
  .hero__sub{margin-inline:auto}
  .hero__badge{left:16px; bottom:16px}
  .hero__scroll{display:none}
  .donate__grid{grid-template-columns:1fr}
  .about-grid{grid-template-columns:1fr}
  .foot__top{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .nav{position:fixed; inset:76px 14px auto 14px; flex-direction:column; align-items:stretch; gap:4px;
    background:#fff; border-radius:20px; box-shadow:var(--shadow-lg); padding:14px; z-index:55;
    opacity:0; transform:translateY(-12px); pointer-events:none; transition:opacity .28s, transform .28s}
  .nav.open{opacity:1; transform:none; pointer-events:auto}
  .nav a{padding:13px 16px}
  .hdr__cta{display:none}
  .nav-toggle{display:block}
  .pillars{grid-template-columns:1fr; gap:24px}
  .news__row{grid-template-columns:auto 1fr auto; gap:12px 14px}
  .news__date{grid-column:1}
  .news__cat{grid-column:2; justify-self:end}
  .news__ttl{grid-column:1 / -1}
  .news__row .arw{display:none}
  .foot__top{grid-template-columns:1fr}
}
@media (max-width:520px){
  .stage3d{height:480px}
  .contact__ways{flex-direction:column; align-items:center}
  .contact__way{width:100%; max-width:330px; justify-content:flex-start}
}

/* =====================================================================
   サブページ共通
   ===================================================================== */
.page-hero{position:relative; overflow:hidden; isolation:isolate; padding:clamp(108px,13vw,144px) 0 clamp(26px,3.4vw,40px)}
.page-hero__bg{position:absolute; inset:0; z-index:-2; background:linear-gradient(180deg,#e8f5fd,#ffffff)}
.page-hero__dots{position:absolute; inset:0; z-index:-1; opacity:.6;
  background-image:radial-gradient(circle, rgba(0,153,227,.15) 1.3px, transparent 1.3px); background-size:30px 30px;
  -webkit-mask-image:linear-gradient(180deg,#000,transparent); mask-image:linear-gradient(180deg,#000,transparent)}
.page-hero__orb{position:absolute; right:-8vw; top:-10vw; width:42vw; height:42vw; z-index:-1; border-radius:50%;
  background:radial-gradient(circle,#bfeafa,transparent 66%); filter:blur(50px); opacity:.6}
.crumbs{font-size:12.5px; color:var(--muted); display:flex; flex-wrap:wrap; gap:8px; align-items:center; line-height:1.5; margin-bottom:22px}
.crumbs a{color:var(--sky-strong); font-weight:700}
.crumbs a:hover{text-decoration:underline}
.crumbs .sep{opacity:.5}
.page-hero__title{font-size:clamp(2rem,5.4vw,3.4rem); font-weight:900; margin-top:14px; letter-spacing:.03em}
.page-hero__title em{font-style:normal; color:var(--sky-strong)}
.page-hero__lead{margin-top:20px; max-width:46em; color:var(--ink-2); font-size:clamp(1rem,1.7vw,1.12rem); line-height:2.05}

/* ページヘッダー直後のブロックは上余白を詰める */
.page-hero + .block{padding-top:clamp(20px,2.6vw,34px)}

.block{padding:clamp(56px,8vw,104px) 0}
.block--pale{background:var(--sky-mist)}
.block__head{max-width:720px; margin-bottom:clamp(30px,4vw,48px)}
.block__head.center{margin-inline:auto; text-align:center}
.h2{font-size:clamp(1.6rem,3.8vw,2.4rem); font-weight:800; letter-spacing:.03em; margin-top:14px}
.h2 em{font-style:normal; color:var(--sky-strong)}
.block__lead{margin-top:18px; color:var(--ink-2); font-size:clamp(.98rem,1.6vw,1.06rem); line-height:2}
.prose{max-width:46em}
.prose p{margin-top:1.15em; color:var(--ink-2); line-height:2.05}
.prose p:first-child{margin-top:0}
.prose strong{color:var(--sky-strong); font-weight:800}

/* テキスト＋写真 2カラム */
.split{display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,68px); align-items:center}
.split__media{position:relative; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow); aspect-ratio:4/3}
.split__media img{width:100%; height:100%; object-fit:cover; display:block}
.split__media--tag::after{content:attr(data-tag); position:absolute; left:16px; bottom:16px; z-index:2;
  font-size:12px; font-weight:800; color:#fff; background:rgba(9,52,84,.55); backdrop-filter:blur(4px); padding:7px 14px; border-radius:999px}
@media (max-width:820px){ .split{grid-template-columns:1fr; gap:30px} .split--rev .split__media{order:-1} }

/* 特長カード */
.fcards{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2.4vw,24px)}
.fcards--2{grid-template-columns:repeat(2,1fr)}
.fcard{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:30px; box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease)}
.fcard:hover{transform:translateY(-5px); box-shadow:var(--shadow)}
.fcard__ico{width:52px; height:52px; border-radius:14px; background:var(--grad); color:#fff; display:grid; place-items:center;
  margin-bottom:16px; box-shadow:0 8px 18px rgba(0,121,194,.3)}
.fcard__ico svg{width:28px; height:28px}
.fcard h3{font-size:1.12rem; font-weight:800}
.fcard p{margin-top:10px; font-size:14px; color:var(--ink-2); line-height:1.9}

/* 手順フロー */
.flow{display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(18px,3vw,30px); counter-reset:s}
.flow__item{position:relative; padding-top:6px}
.flow__item::before{counter-increment:s; content:counter(s,decimal-leading-zero); font-size:13px; font-weight:900; letter-spacing:.14em; color:var(--sky)}
.flow__item::after{content:""; position:absolute; top:24px; right:-15px; width:30px; height:2px; background:var(--sky-light)}
.flow__item:last-child::after{display:none}
.flow__item h3{margin-top:12px; font-size:1.05rem; font-weight:800}
.flow__item p{margin-top:8px; font-size:13.5px; color:var(--ink-2); line-height:1.85}

/* 情報リスト（定義） */
.deflist{width:100%; border-collapse:collapse}
.deflist th,.deflist td{text-align:left; padding:20px 4px; border-bottom:1px solid var(--line); vertical-align:top; font-size:14.5px; line-height:1.9}
.deflist th{width:30%; font-weight:800; color:var(--sky-strong); letter-spacing:.04em}
.deflist td{color:var(--ink-2)}

/* FAQ */
.faq{max-width:820px; display:flex; flex-direction:column; gap:12px}
.faq details{background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden}
.faq summary{list-style:none; cursor:pointer; padding:20px 24px; font-weight:800; font-size:15px; display:flex; gap:14px; align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"Q"; flex:none; width:26px; height:26px; border-radius:8px; background:var(--sky-pale); color:var(--sky-strong); font-weight:900; display:grid; place-items:center; font-size:13px}
.faq summary span{flex:1}
.faq summary::after{content:""; flex:none; width:11px; height:11px; border-right:2.4px solid var(--sky-strong); border-bottom:2.4px solid var(--sky-strong); transform:rotate(45deg); transition:transform .3s; margin-top:-4px}
.faq details[open] summary::after{transform:rotate(-135deg); margin-top:2px}
.faq__a{padding:0 24px 22px 64px; color:var(--ink-2); font-size:14.5px; line-height:1.95}

/* 振込先カード */
.bank{display:grid; grid-template-columns:1fr 1fr; gap:20px}
.bankcard{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:28px; box-shadow:var(--shadow-sm)}
.bankcard .tag{font-size:11.5px; font-weight:800; color:var(--sky-strong); background:var(--sky-pale); padding:5px 12px; border-radius:999px; display:inline-block}
.bankcard h3{margin-top:14px; font-size:1.05rem; font-weight:800}
.bankcard dl{margin:16px 0 0; display:grid; grid-template-columns:auto 1fr; gap:10px 18px; font-size:14.5px}
.bankcard dt{color:var(--muted); font-weight:700}
.bankcard dd{margin:0; font-weight:800; font-variant-numeric:tabular-nums}

/* 注記ボックス */
.callout{background:var(--sky-mist); border:1px solid var(--line); border-left:4px solid var(--sky); border-radius:12px; padding:22px 24px; font-size:14px; color:var(--ink-2); line-height:1.95}
.callout b{color:var(--sky-strong)}

/* お知らせ記事 */
.article__meta{display:flex; gap:12px; align-items:center; flex-wrap:wrap}
.article__date{font-size:13.5px; font-weight:700; color:var(--muted); font-variant-numeric:tabular-nums; letter-spacing:.05em}
.article__cat{font-size:11.5px; font-weight:800; color:var(--sky-strong); background:var(--sky-pale); padding:5px 13px; border-radius:999px}
.article{max-width:760px}
.article__cover{width:100%; height:auto; border-radius:var(--radius-lg); margin:0 0 34px; box-shadow:var(--shadow)}
.article p{margin-top:1.25em; line-height:2.05; color:var(--ink-2)}
.article p:first-child{margin-top:0}
.article a{color:var(--sky-strong); font-weight:700; text-decoration:underline; word-break:break-all}
.dlsec{max-width:760px; margin-top:clamp(40px,6vw,60px); padding-top:clamp(30px,4vw,40px); border-top:1px solid var(--line)}
.dlsec__title{display:flex; align-items:center; gap:10px; font-size:1.2rem; font-weight:800; margin-bottom:20px; color:var(--ink)}
.dlsec__title svg{width:22px; height:22px; color:var(--sky-strong)}

/* 税制優遇の詳細 */
.tax{display:grid; gap:clamp(18px,2.5vw,26px)}
.tax__block{background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:clamp(24px,4vw,40px); box-shadow:var(--shadow-sm)}
.tax__block h3{font-size:clamp(1.1rem,2.2vw,1.3rem); font-weight:800; color:var(--ink); display:flex; align-items:center; gap:13px}
.tax__block h3 .ti{width:42px; height:42px; border-radius:12px; background:var(--sky-pale); color:var(--sky-strong); display:grid; place-items:center; flex:none}
.tax__block h3 .ti svg{width:22px; height:22px}
.tax__item{margin-top:22px; padding-top:22px; border-top:1px solid var(--line)}
.tax__item:first-of-type{border-top:0; padding-top:0}
.tax__item h4{font-size:1.02rem; font-weight:800; color:var(--sky-strong)}
.tax__sub{font-size:13px; font-weight:800; color:var(--slate); margin-top:16px; letter-spacing:.03em}
.tax__formula{margin-top:8px; background:var(--sky-mist); border:1px solid var(--sky-wash); border-left:4px solid var(--sky); border-radius:12px; padding:16px 18px; font-size:14.5px; line-height:2; color:var(--ink); font-weight:700}
.tax__note{font-size:12.5px; color:var(--muted); margin-top:8px}
.tax__p{margin-top:10px; font-size:14px; color:var(--ink-2); line-height:1.9}
.tax__links{display:flex; flex-direction:column; gap:12px}
.tax__link{display:flex; align-items:center; gap:12px; font-size:14.5px; font-weight:700; color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px 20px; box-shadow:var(--shadow-sm); transition:border-color .2s, transform .2s, box-shadow .2s}
.tax__link:hover{border-color:var(--sky); transform:translateY(-2px); box-shadow:var(--shadow)}
.tax__link>svg:first-child{width:20px; height:20px; flex:none; color:var(--sky-strong)}
.tax__link span{flex:1; line-height:1.6}
.tax__link .ex{width:16px; height:16px; flex:none; color:var(--sky-strong)}

/* 資料ダウンロード（定款・役員名簿・PDF） */
.doclist{display:grid; gap:12px; max-width:640px}
.doc{display:flex; align-items:center; gap:14px; background:#fff; border:1px solid var(--line); border-radius:14px; padding:15px 18px; box-shadow:var(--shadow-sm); transition:border-color .2s, transform .2s, box-shadow .2s}
.doc:hover{border-color:var(--sky); transform:translateY(-2px); box-shadow:var(--shadow)}
.doc__ico{width:44px; height:44px; border-radius:11px; background:var(--sky-pale); color:var(--sky-strong); display:grid; place-items:center; flex:none; position:relative}
.doc__ico svg{width:22px; height:22px}
.doc__ico::after{content:"PDF"; position:absolute; bottom:-6px; right:-7px; font-size:8px; font-weight:900; color:#fff; background:#e0526b; padding:2px 5px; border-radius:5px}
.doc--word .doc__ico::after{content:"Word"; background:#2b579a}
.doc__body{flex:1; min-width:0}
.doc__body b{display:block; font-size:14.5px; font-weight:800; color:var(--ink); line-height:1.5}
.doc__body small{font-size:12px; color:var(--muted)}
.doc__dl{flex:none; display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:800; color:#fff; background:var(--grad); padding:10px 16px; border-radius:10px; white-space:nowrap; box-shadow:0 6px 14px rgba(0,121,194,.3)}
.doc__dl svg{width:15px; height:15px}
@media(max-width:560px){ .doc{flex-wrap:wrap} .doc__body{flex:1 1 55%} .doc__dl{width:100%; justify-content:center; margin-top:4px} }

/* 情報公開（定款・役員・公表） */
.disc{margin-top:clamp(36px,5vw,56px)}
.disc:first-of-type{margin-top:clamp(6px,2vw,18px)}
.disc__h{font-size:clamp(1.1rem,2.4vw,1.35rem); font-weight:800; color:var(--ink); padding-bottom:14px; border-bottom:2px solid var(--sky-wash); margin-bottom:18px}
.disc__p{color:var(--ink-2); font-size:14.5px; line-height:1.95; margin-bottom:18px; max-width:46em}
.notice{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:clamp(22px,3vw,32px); box-shadow:var(--shadow-sm); max-width:760px}
.notice__date{font-size:13px; color:var(--muted); font-weight:700; margin-bottom:16px; line-height:1.7}
.notice p{color:var(--ink-2); font-size:14.5px; line-height:1.95}
.notice__contact{margin-top:20px; padding-top:18px; border-top:1px solid var(--line); font-size:13.5px; color:var(--slate); font-weight:700}

/* リスト（募集要項など） */
.rlist{list-style:none; padding:0; margin:0; display:grid; gap:12px; max-width:52em}
.rlist li{position:relative; padding-left:28px; font-size:14.5px; line-height:1.9; color:var(--ink-2)}
.rlist li::before{content:""; position:absolute; left:3px; top:11px; width:8px; height:8px; border-radius:50%; background:var(--sky)}
.rlist--num{counter-reset:r}
.rlist--num li{padding-left:40px}
.rlist--num li::before{content:counter(r); counter-increment:r; width:26px; height:26px; border-radius:50%; background:var(--sky-pale); color:var(--sky-strong); font-size:12.5px; font-weight:800; display:grid; place-items:center; top:1px; left:0}

/* 告知バンド（募集終了など） */
.notice-band{display:flex; align-items:center; gap:14px; flex-wrap:wrap; background:var(--sky-mist); border:1px solid var(--sky-wash); border-left:4px solid var(--sky); border-radius:12px; padding:16px 20px; font-size:14.5px; font-weight:700; color:var(--ink); line-height:1.8}
.notice-band__tag{flex:none; font-size:12px; font-weight:800; color:#fff; background:var(--sky-strong); padding:5px 12px; border-radius:999px}

/* 税制優遇の見出しはPCで1行に収める */
.tax-head{max-width:none}
@media (min-width:821px){ .tax-head .h2{white-space:nowrap} }

/* カテゴリ絞り込みチップ */
.cat-chips{display:flex; flex-wrap:wrap; gap:9px; margin-bottom:clamp(22px,3vw,32px)}
.cchip{font-family:inherit; cursor:pointer; font-size:13.5px; font-weight:800; color:var(--slate); background:#fff; border:1.5px solid var(--line); border-radius:999px; padding:9px 18px; transition:border-color .2s, background .2s, color .2s}
.cchip:hover{border-color:var(--sky); color:var(--sky-strong)}
.cchip.on{background:var(--grad); color:#fff; border-color:transparent}

/* ページネーション */
.pager{display:flex; align-items:center; justify-content:center; gap:8px; margin-top:clamp(30px,4vw,44px); flex-wrap:wrap}
.pager:empty{display:none}
.pager button{font-family:inherit; cursor:pointer; border:1px solid var(--line); background:#fff; color:var(--slate); border-radius:10px; min-width:42px; height:42px; display:inline-grid; place-items:center; font-size:14px; font-weight:800; transition:border-color .2s, background .2s, color .2s}
.pager button:hover:not(:disabled){border-color:var(--sky); color:var(--sky-strong); background:var(--sky-pale)}
.pager button:disabled{opacity:.4; cursor:default}
.pager__num.on{background:var(--grad); color:#fff; border-color:transparent}
.pager__btn svg{width:18px; height:18px}

/* フォーム */
.form{max-width:660px; display:grid; gap:22px}
.field{display:grid; gap:8px}
.field label{font-size:13.5px; font-weight:800}
.field label .req{color:#e0526b; font-size:11px; margin-left:6px; font-weight:800}
.field input,.field textarea,.field select{font-family:inherit; font-size:15px; padding:14px 16px; border:1.5px solid var(--line); border-radius:12px; background:#fff; color:var(--ink); transition:border-color .2s, box-shadow .2s; width:100%}
.field input:focus,.field textarea:focus,.field select:focus{outline:none; border-color:var(--sky); box-shadow:0 0 0 4px rgba(0,153,227,.16)}
.field textarea{min-height:150px; resize:vertical}
.form__note{font-size:12.5px; color:var(--muted); line-height:1.8}

/* CTAバンド（プレフッター） */
.ctaband{position:relative; overflow:hidden; isolation:isolate; color:#fff; text-align:center; padding:clamp(64px,9vw,112px) 0}
.ctaband__bg{position:absolute; inset:0; z-index:-2; background:#0077be}
.ctaband__dots{display:none}
.ctaband h2{font-size:clamp(1.8rem,4.4vw,2.8rem); font-weight:800; letter-spacing:.03em}
.ctaband p{margin-top:18px; color:rgba(255,255,255,.92); font-size:clamp(1rem,1.7vw,1.1rem)}
.ctaband .actions{margin-top:34px; display:flex; gap:14px; justify-content:center; flex-wrap:wrap}

@media (max-width:900px){
  .fcards,.fcards--2{grid-template-columns:1fr 1fr}
  .flow{grid-template-columns:1fr 1fr}
  .flow__item::after{display:none}
  .bank{grid-template-columns:1fr}
}
@media (max-width:560px){
  .fcards,.fcards--2{grid-template-columns:1fr}
  .flow{grid-template-columns:1fr}
  .deflist th{width:38%}
}

/* =====================================================================
   アクセシブルモーション
   ===================================================================== */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important}
  .reveal{opacity:1; transform:none}
  .dash{stroke-dashoffset:0}
  .pop{opacity:1; transform:none}
  .acard{transition:none}
}