/* トップページ 3-03（2026-09-05）  配色：さし色はロゴ緑のみ。緑ベタの上は白の短い太字だけ。ヒーローは薄グレー地＋画像枠 */
.sec{padding:56px 0 0}
.sec-h{display:flex;align-items:baseline;gap:12px;margin-bottom:16px}
.sec-h h2{font-size:1.5rem;padding-left:14px;border-left:6px solid var(--c-green)}
.sec-h .more{margin-left:auto;font-weight:700;text-decoration:none;white-space:nowrap;min-height:44px;display:inline-flex;align-items:center}
.eyebrow{display:block;font-size:.8rem;font-weight:700;letter-spacing:.08em;color:var(--c-green-text)}
@media (max-width:640px){ .sec{padding-top:40px} .sec-h h2{font-size:1.25rem} }

/* ヒーロー */
.hero{background:var(--c-tint);border-bottom:1px solid var(--c-line);padding-bottom:0}
.hero .grid{display:grid;grid-template-columns:1.05fr 1fr;gap:32px;align-items:center;padding-top:32px}
.hero h1{font-size:2.5rem;margin:16px 0 4px}
.hero h1 span{display:inline-block}  /* 語句の途中で折り返さない */
.hero h1 mark{background:transparent;color:var(--c-green-text)}
.hero .tagline{font-size:1.3rem;font-weight:700;margin:6px 0 0;color:var(--c-ink)}  /* 見出しの下のひとこと（2026-09-12） */
.hero .lead{font-size:1.05rem;margin:20px 0 0;max-width:34em}
.hero .pic{margin:0;position:relative;border-radius:24px;overflow:hidden;background:var(--c-paper);aspect-ratio:4/3}
.hero .pic img{width:100%;height:100%;object-fit:cover}
/* 背景動画（2026-09-05 むぎこ：sora.mp4）。ポスター画像を先に出し、読み込み完了後に動画へ。音なし・ループ・自動再生 */
.hero .pic video.bgv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s;pointer-events:none}
.hero .pic video.bgv.on{opacity:1}
.hero .pic img.poster{position:relative}
.hero .pic video.bgv.on+img.poster{opacity:0}
/* キャラがふわふわ浮く（2026-09-05 むぎこ案：sl_03.jpg の地球の上に logo.png）。動きを減らす設定の人には止める
   2026-09-05 むぎこ：キャラを少し小さく（38%→31%）、後ろに薄い白の光（むぎこ指定のグラデーション）、小さな mugita が3体ゆっくり漂う */
.hero .pic.chara .glow{position:absolute;left:50%;top:50%;width:62%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.55) 0%,rgba(255,255,255,.22) 38%,rgba(255,255,255,0) 70%);pointer-events:none;z-index:1}
.hero .pic.chara img.float{position:absolute;left:50%;top:50%;width:31%;height:auto;transform:translate(-50%,-50%);filter:drop-shadow(0 12px 16px rgba(40,80,120,.28));animation:hero-float 5s ease-in-out infinite;object-fit:contain;z-index:2}
@keyframes hero-float{0%,100%{transform:translate(-50%,-50%) rotate(-3deg)}50%{transform:translate(-50%,-62%) rotate(3deg)}}
.hero .pic.chara img.drift{position:absolute;left:0;top:0;width:18%;height:auto;object-fit:contain;filter:drop-shadow(0 8px 10px rgba(0,0,0,.3));z-index:0;pointer-events:none;animation:roam 28s ease-in-out infinite}
/* むぎた1体が枠の中をぐるぐる（左上→右上→右下→中央→左下→…）。位置は枠の幅・高さに対する％（translate の％は自分のサイズ基準なので left/top で動かす） */
@keyframes roam{
  0%  {left:6%;top:8%;transform:rotate(-10deg)}
  14% {left:40%;top:4%;transform:rotate(8deg)}
  28% {left:76%;top:14%;transform:rotate(-6deg)}
  42% {left:70%;top:58%;transform:rotate(12deg)}
  56% {left:38%;top:70%;transform:rotate(-8deg)}
  70% {left:8%;top:52%;transform:rotate(6deg)}
  84% {left:22%;top:24%;transform:rotate(-12deg)}
  100%{left:6%;top:8%;transform:rotate(-10deg)}
}
@media (prefers-reduced-motion:reduce){ .hero .pic.chara img.float,.hero .pic.chara img.drift{animation:none} }
.hero .pic figcaption{position:absolute;left:12px;bottom:12px;background:var(--c-paper);color:var(--c-ink);font-size:.75rem;padding:4px 10px;border-radius:var(--r-pill)}
@media (max-width:899px){
  .hero .grid{grid-template-columns:1fr;padding-top:16px;gap:16px}
  .hero .pic{order:-1;aspect-ratio:16/10}
  .hero h1{font-size:1.75rem;margin:12px 0 4px}
  .hero .tagline{font-size:1.1rem}
  .hero .lead{font-size:1rem}
}

/* みかたファインダー（ヒーローの下にせり出す） */
.finder{background:var(--c-paper);border:2px solid var(--c-line);border-radius:20px;padding:20px;margin:24px 0 -64px;position:relative;z-index:2;box-shadow:0 6px 24px rgba(0,0,0,.08)}
.finder-t{margin:0 0 12px;font-weight:700;font-size:1.05rem}
.finder .row{display:flex;flex-wrap:wrap;gap:12px;align-items:end}
.finder .row>div{flex:1 1 170px;min-width:0}
/* 「こまっていること・特性」は選択肢の文字が長いので広めに（むぎこ 2026-09-10 の並べ替えのあとも幅を保つ） */
.finder .row>div.wide{flex:1.4 1 240px}
.finder label{display:block;font-size:.85rem;font-weight:700;color:var(--c-muted);margin-bottom:4px}
.finder select{width:100%;min-height:48px;border:2px solid var(--c-line);border-radius:var(--r-m);padding:0 12px;background:var(--c-paper);color:var(--c-ink)}
.finder select:focus-visible{border-color:var(--c-green)}
.finder .kw{margin:0 0 12px}
.finder .kw input{width:100%;min-height:48px;border:2px solid var(--c-line);border-radius:var(--r-pill);padding:0 18px;font-size:1rem;background:var(--c-paper);color:var(--c-ink);box-sizing:border-box}
.finder .kw input:focus-visible{border-color:var(--c-green);outline:none}
.finder .acts{margin-top:14px;display:flex;justify-content:center;gap:10px}
.finder .acts .btn{min-width:160px}
/* 参加のしかた（さがす画面と同じ。2026-09-11 ホームも種類つきで統一） */
.finder .care{margin-top:14px;border-top:1px solid var(--c-line);padding-top:10px}
.finder .care summary{cursor:pointer;font-weight:700;min-height:40px;display:flex;align-items:center;gap:4px;color:var(--c-green-text)}
.finder .cks{display:grid;grid-template-columns:repeat(3,1fr);gap:4px 12px;padding:8px 0 4px}
.finder .ck{display:flex;align-items:center;gap:8px;min-height:36px;font-size:.92rem;cursor:pointer;font-weight:400;color:var(--c-ink);margin:0}
.finder .ck input{width:20px;height:20px;accent-color:var(--c-green);flex:none;margin:0}
.finder .hint{font-size:.9rem;color:var(--c-muted);margin:12px 0 0;text-align:center}
.finder .hint a{font-weight:700}
.after-hero{padding-top:64px}
@media (max-width:899px){
  .finder .row>div,.finder .row>div.wide{flex:1 1 calc(50% - 6px)}
  .finder{padding:16px;margin-bottom:-48px}
  .after-hero{padding-top:48px}
}
@media (max-width:899px){ .finder .cks{grid-template-columns:1fr 1fr} }
@media (max-width:480px){ .finder .row>div,.finder .row>div.wide{flex:1 1 100%} .finder .cks{grid-template-columns:1fr} .finder .acts{flex-direction:column-reverse} .finder .acts .btn{width:100%} .finder .hint{text-align:left} }

/* 目的からえらぶ */
.entry{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:12px}   /* 入口の数に合わせる（2026-09-11 イベントを外して3つ） */
.entry a{text-decoration:none;color:var(--c-ink);background:var(--c-paper);border:2px solid var(--c-line);border-radius:var(--r-l);padding:16px;display:flex;flex-direction:column;gap:4px}
.entry a:hover{border-color:var(--c-green)}
.entry .ic{width:44px;height:44px;border-radius:var(--r-m);background:var(--c-tint);display:grid;place-items:center;color:var(--c-green-text);margin-bottom:6px}
.entry .ic svg{width:26px;height:26px}
.entry b{font-size:1.05rem}
.entry small{color:var(--c-muted);font-size:.85rem;line-height:1.5}
@media (max-width:899px){ .entry{grid-template-columns:1fr 1fr} .entry a:last-child:nth-child(odd){grid-column:1/-1} }

/* バナー枠A・協賛ロゴ枠（枠線はグレーの点線。ピンクはモック上の印だった） */
/* バナー枠A：上下にほかのセクションより広めの余白（むぎこ 2026-09-06）。見出しがない分、詰まって見えるため */
.banner-sec{padding:72px 0 16px}
@media (max-width:640px){ .banner-sec{padding:48px 0 8px} }
.banners{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:1040px;margin:0 auto}
.banner{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;aspect-ratio:3.2/1;border:2px dashed var(--c-line);border-radius:var(--r-m);background:var(--c-paper);color:var(--c-muted);text-decoration:none;font-size:.85rem;line-height:1.4;overflow:hidden}
.banner.has-img{border:1px solid #232623;background:#fff}
.banner.has-img:hover img,.banner.has-img:focus-visible img{opacity:.85}
.banner img{width:100%;height:100%;object-fit:cover;display:block}
.banner b{color:var(--c-green-text)}
.banner small{font-size:.75rem}
@media (max-width:640px){ .banners{grid-template-columns:1fr;gap:12px;max-width:360px} }
.sponsors{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.sponsors .logo{flex:0 0 calc((100% - 12px*5)/6);max-width:160px}
.sponsors .logo{aspect-ratio:4/3;border:1px solid transparent;border-radius:var(--r-m);background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:10px;overflow:hidden;text-decoration:none;color:var(--c-muted);font-size:.85rem;font-weight:700}
.sponsors .logo img{width:100%;height:100%;object-fit:contain;display:block}
.sponsors a.logo:hover,.sponsors a.logo:focus-visible{border-color:var(--c-green)}
.sponsors .logo.empty{border:2px dashed var(--c-line)}
.sponsors .logo small{font-weight:400;font-size:.7rem}
@media (max-width:640px){ .sponsors{gap:8px} .sponsors .logo{flex-basis:calc((100% - 8px*2)/3);max-width:none;padding:6px} }

/* テーマ */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip.sm{min-height:28px;font-size:.75rem;padding:0 10px}

/* 最近確認できた団体 */
.ocards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ocard{display:flex;flex-direction:column;background:var(--c-paper);border:2px solid var(--c-line);border-radius:var(--r-l);overflow:hidden;text-decoration:none;color:var(--c-ink)}
.ocard:hover{border-color:var(--c-green)}
.ocard .ph{display:grid;place-items:center;aspect-ratio:16/9;background:var(--c-tint);position:relative}
.ocard .ph .ini{font-size:2.6rem;font-weight:700;color:var(--c-green-text);opacity:.55}
.ocard .kind{position:absolute;left:12px;top:12px;background:var(--c-green);color:#fff;font-size:.75rem;font-weight:700;padding:2px 10px;border-radius:var(--r-pill)}
.ocard .body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px;flex:1}
.ocard .area{font-size:.8rem;color:var(--c-muted)}
.ocard h3{font-size:1.1rem}
.ocard .catch{font-size:.9rem;margin:0}
.ocard .verified{margin-top:auto;font-size:.75rem;color:var(--c-muted);display:flex;align-items:center;gap:6px}
.ocard .verified i{width:8px;height:8px;border-radius:50%;background:var(--c-green);display:inline-block}
@media (max-width:899px){ .ocards{grid-template-columns:1fr 1fr} }
.ocard .kind2{display:none}
@media (max-width:640px){
  .ocards{grid-template-columns:1fr;gap:12px}
  /* スマホは C案：上段＝正方形サムネ＋地域・名前、下段＝ひとこと・タグ・確認日をカード幅いっぱいに（2026-09-05 むぎこ選択） */
  .ocard{display:grid;grid-template-columns:92px 1fr;grid-template-rows:auto auto auto auto auto;column-gap:12px;row-gap:6px;align-items:center;padding:12px}
  .ocard .ph{grid-row:1/3;grid-column:1;width:92px;aspect-ratio:1;border-radius:var(--r-m)}
  .ocard .ph .ini{font-size:1.8rem}
  .ocard .ph .kind{display:none}
  .ocard .kind2{display:inline-block;background:var(--c-green);color:#fff;font-size:.7rem;font-weight:700;padding:0 8px;border-radius:var(--r-pill);margin-right:6px;vertical-align:1px}
  .ocard .body{display:contents}
  .ocard .area{grid-row:1;grid-column:2;align-self:end}
  .ocard h3{grid-row:2;grid-column:2;align-self:start;font-size:1rem}
  .ocard .catch{grid-row:3;grid-column:1/-1;margin:4px 0 0;font-size:.85rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .ocard .chips{grid-row:4;grid-column:1/-1;gap:6px}
  .ocard .verified{grid-row:5;grid-column:1/-1;margin:0}
}

/* よむ */
.posts{display:grid;grid-template-columns:1.3fr 1fr;gap:16px}
.feature{display:flex;flex-direction:column;background:var(--c-paper);border:2px solid var(--c-line);border-radius:var(--r-l);overflow:hidden;text-decoration:none;color:var(--c-ink)}
.feature:hover,.post:hover{border-color:var(--c-green)}
.feature .th{display:block;aspect-ratio:16/9;background:var(--c-tint);overflow:hidden}
.feature .th img,.post .th img{width:100%;height:100%;object-fit:cover}
.feature .body{display:block;padding:14px 16px 16px}
.feature h3{font-size:1.2rem;margin:2px 0 6px}
.feature p{margin:0;font-size:.9rem;color:var(--c-muted)}
.post-col{display:grid;grid-template-rows:repeat(3,1fr);gap:12px}  /* 左の大カードと同じ高さに3等分 */
.post{display:grid;grid-template-columns:104px 1fr;gap:14px;min-height:0;background:var(--c-paper);border:2px solid var(--c-line);border-radius:var(--r-l);padding:12px;text-decoration:none;color:var(--c-ink);align-items:center}
.post .th{display:block;aspect-ratio:1;border-radius:var(--r-s);background:var(--c-tint);overflow:hidden}
.post h3{font-size:1rem;margin:2px 0}
.post small{color:var(--c-muted);font-size:.8rem}
/* 定番の記事（縦のリスト。むぎこ 2026-09-11「横スクロールは好きじゃない」） */
.picks{margin-top:18px;background:var(--c-paper);border:2px solid var(--c-line);border-radius:var(--r-l);padding:14px 16px}
.picks h3{font-size:1rem;margin:0 0 8px}
.picks-list{list-style:none;margin:0;padding:0;display:grid;gap:4px;counter-reset:pick}
.picks-list li{counter-increment:pick}
.picks-list a{display:grid;grid-template-columns:28px 96px 1fr;align-items:center;gap:10px;min-height:var(--tap);padding:4px 6px;border-radius:var(--r-s);text-decoration:none;color:var(--c-ink)}
.picks-list a::before{content:counter(pick);font-weight:700;color:var(--c-green);font-size:1.1rem;text-align:center}
.picks-list a:hover{background:var(--c-tint)}
.picks-list .th{display:block;aspect-ratio:16/9;border-radius:6px;overflow:hidden;background:var(--c-tint)}
.picks-list .th img{width:100%;height:100%;object-fit:cover;display:block}
.picks-list .tx{display:block;min-width:0}
.picks-list .eyebrow{display:block;font-size:.72rem;color:var(--c-muted);margin:0}
.picks-list .ttl{display:block;font-weight:700;font-size:.95rem;line-height:1.4}
@media (min-width:900px){ .picks-list{grid-template-columns:1fr 1fr;column-gap:24px} }
@media (max-width:899px){ .posts{grid-template-columns:1fr} .post-col{grid-template-rows:none} }

/* これからのイベント */
.events{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.ev{display:grid;grid-template-columns:56px 1fr;gap:12px;background:var(--c-paper);border:2px solid var(--c-line);border-radius:var(--r-l);padding:14px 16px;text-decoration:none;color:var(--c-ink);align-items:start}
.ev:hover{border-color:var(--c-green)}
.ev .date{display:block}
.ev h3{font-size:1rem}
.ev small{color:var(--c-muted);font-size:.8rem}
.note-sample{font-size:.8rem;color:var(--c-muted);margin:8px 0 0}
@media (max-width:899px){ .events{grid-template-columns:1fr} }

/* 応援バンド：本文は緑地に置かない → 薄グレー地・見出しは緑文字、ボタンだけ緑ベタ */
.band{background:var(--c-tint);border-top:1px solid var(--c-line);margin-top:56px}
.support{padding:48px 0 56px}
.support-row{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}
.sponsors-sec{margin-top:36px}
.sponsors-sec .sec-h{margin-bottom:12px}
.sponsors-sec h3{font-size:1rem;font-weight:700;margin:0;color:var(--c-muted)}
.sponsors-sec .more{font-size:.9rem}
@media (max-width:640px){ .band{margin-top:40px} .support{padding:36px 0 44px} .sponsors-sec{margin-top:28px} }
@media (max-width:640px){ .sponsors-sec .sec-h{flex-wrap:wrap;gap:0 8px;margin-bottom:8px} .sponsors-sec h3{flex-basis:100%;white-space:nowrap} .sponsors-sec .sec-h .more{margin-left:auto;min-height:36px} }
.support h2{font-size:1.5rem;color:var(--c-green-text)}
.support p{margin:6px 0 0;max-width:36em}
.support .acts{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:899px){ .support-row{grid-template-columns:1fr} }

.ev .date{background:var(--c-tint);color:var(--c-green-text)}
/* トップのお知らせ（2026-09-06）：日付・種類・タイトルの行。サイドの .side-news と同じ型で、PC は1行に */
.news-sec .sec-h{margin-bottom:6px}
.top-news{list-style:none;margin:0;padding:0;border-top:1px solid var(--c-line)}
.top-news li{border-bottom:1px solid var(--c-line)}
.top-news a{display:flex;align-items:baseline;gap:12px;padding:12px 4px;text-decoration:none;color:var(--c-ink);min-height:48px}
.top-news time{flex:none;font-size:.85rem;color:var(--c-muted);min-width:7.5em}
.top-news .cat{flex:none;background:var(--c-tint);color:var(--c-green-text);font-size:.75rem;font-weight:700;border-radius:var(--r-s);padding:2px 8px}
.top-news b{font-weight:700;line-height:1.5}
.top-news a:hover b{text-decoration:underline;text-underline-offset:3px}
@media (max-width:640px){ .top-news a{flex-wrap:wrap;gap:6px 10px} .top-news time{min-width:0} .top-news b{flex-basis:100%;font-size:.95rem} }

/* 拠点カードの「◯◯ の拠点」（むぎこ 2026-09-10「拠点の方が重要ですので」） */
.ocard .body .parent{display:block;margin:2px 0 0;font-size:.8rem;color:var(--c-muted)}

/* ホームの数字3つに枠（むぎこ 2026-09-12）。/about/ の横並び（.inline）には付けない */
.counts-sec .cstat{border:2px solid #A6DCA2}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .counts-sec .cstat{border-color:var(--c-line)}}
:root[data-theme="dark"] .counts-sec .cstat{border-color:var(--c-line)}
/* 見出しの下の文（ホームの団体カードの上など。2026-09-12 に style から移した） */
.sec-lead{margin:-4px 0 16px;color:var(--c-muted);font-size:.9rem;line-height:1.8}
