@charset "UTF-8";
/* ==========================================================
   伊藤まもる 公式サイト
   紺 × 白 を基調に、差し色はオレンジ（名刺・宣材写真と統一）
   ========================================================== */

:root {
  --orange: #ea5504;       /* 参政党カラー（メイン） */
  --orange-deep: #c94400;  /* 後援会セクションなど、濃い面 */
  --orange-pale: #ffe3cf;  /* オレンジ地の上の小さな文字 */
  --orange-light: #fde6d8; /* マーカー */
  --brown: #3a2418;        /* 見出し・本文の濃色（ロゴの黒に合わせた焦げ茶） */
  --ink: #2b211b;
  --gray: #fbf6f2;
  --line: #eadfd6;
  --font-ja: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "游ゴシック体", Meiryo, sans-serif;
  --font-en: "Hind", var(--font-ja);
  --header-h: 72px;
}

/* 最初の画面専用：Noto Sans JP Black を使う文字だけに絞ったサブセット（7.5KB）。
   文字を変えたら Google Fonts の text= で作り直すこと */
@font-face {
  font-family: "HeroJP";
  font-weight: 900;
  font-display: block;
  src: url("../fonts/notosansjp-900-hero.woff2?v=3") format("woff2");
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--header-h); }
body {
  margin: 0;
  background: #fff;
  color: var(--ink);
  font-family: var(--font-ja);
  font-size: 16px;
  line-height: 1.9;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "palt";
  letter-spacing: .08em; /* サイト全体の字間。最初の画面の名前まわりは個別に 0 にして幅を揃えている */
}
img { max-width: 100%; height: auto; vertical-align: bottom; }
a { color: inherit; }
h1, h2, h3, p, dl, dd, ul, ol { margin: 0; padding: 0; }
ul, ol { list-style: none; }
.inner { width: min(1100px, 100% - 40px); margin-inline: auto; }
.sp { display: none; }

/* ---------- header ---------- */
.header {
  position: fixed; inset: 0 0 auto 0; z-index: 50;
  height: var(--header-h);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 28px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 1px 0 var(--line);
}
.header_logo { display: flex; align-items: center; gap: 14px; text-decoration: none; color: var(--brown); }
.header_logo img { height: 34px; width: auto; }
.header_logo b { font-size: 24px; font-weight: 900; letter-spacing: .08em; }
.header_logo small { font-size: 12px; font-weight: 700; color: var(--orange); }
.gnav { display: flex; align-items: center; gap: 30px; }
.gnav a { text-decoration: none; font-weight: 700; font-size: 14px; color: var(--brown); }
.gnav a span { display: block; font-family: var(--font-en); font-size: 11px; letter-spacing: .12em; color: var(--orange); line-height: 1; }
.gnav a:hover { opacity: .7; }
.gnav .gnav_btn {
  padding: 12px 22px; border-radius: 999px;
  background: var(--orange); color: #fff;
}
.menuBtn { display: none; }
.header > nav { margin-left: auto; } /* メニューとSNSアイコンを右側にまとめる */
.header_sns { display: flex; align-items: center; gap: 4px; margin-left: 18px; }
.header_sns a { display: grid; place-items: center; width: 38px; height: 38px; color: var(--orange); transition: opacity .2s; }
.header_sns svg { width: 24px; height: 24px; }
.header_sns a:hover { opacity: .65; }
.header_logo b, .gnav a { white-space: nowrap; }
/* 中くらいの幅（タブレット横〜小さめのPC）はヘッダーに入りきらないので、肩書きを隠して間隔を詰める */
@media (min-width: 901px) and (max-width: 1200px) {
  .header { padding: 0 20px; }
  .header_logo small { display: none; }
  .gnav { gap: 18px; }
  .gnav .gnav_btn { padding: 10px 16px; }
  .header_sns { margin-left: 8px; }
}

/* ---------- main visual ---------- */
.mainV {
  position: relative; overflow: hidden;
  padding-top: var(--header-h);
  background: #fff;
}
.mainV_panel { /* 右側にオレンジの斜めパネル */
  position: absolute; inset: 0;
  background: var(--orange);
  clip-path: polygon(64% 0, 100% 0, 100% 100%, 46% 100%);
}
.mainV_inner {
  position: static; /* 写真は .mainV（画面幅）を基準に置く */
  width: min(1240px, 100% - 40px); margin-inline: auto;
  height: 840px; /* 高さは固定（写真は最小幅でも 878px あるので下端まで必ず届く） */
  display: grid; grid-template-columns: 55% 45%; grid-template-rows: 100%; align-items: center;
}
.mainV_text {
  /* --w：肩書き・伊藤・まもる・キャッチの共通の横幅。各行の文字サイズはここから割り出す */
  --w: clamp(300px, 29vw, 500px);
  position: relative; z-index: 1;
  font-family: "HeroJP", var(--font-ja);
  width: var(--w); margin-left: 6%; padding-bottom: 40px;
  font-feature-settings: normal; /* palt だと約物が詰まって幅がずれる */
}
.mainV_party {
  display: flex; align-items: center; justify-content: space-between;
  font-weight: 900; color: var(--brown); font-size: calc(var(--w) / 22); letter-spacing: 0; white-space: nowrap;
}
.mainV_party img { height: calc(var(--w) * .1); width: auto; }
.mainV_trim { margin-right: -.65em; } /* 行末の「）」の余白を詰めて、文字の右端を名前の右端に揃える */
.mainV_name {
  width: var(--w);
  margin-top: calc(var(--w) * .04);
  color: var(--orange); font-weight: 900; line-height: 1; letter-spacing: 0; white-space: nowrap;
}
.mainV_nameRow { display: block; }
/* せり上がり用のマスク。字形の下端が行の外に少し出るので上下に余白を持たせて相殺 */
.mask { display: block; overflow: hidden; padding: .06em 0 .08em; margin: -.06em 0 -.08em; }
.mask > span { display: block; }
/* 文字サイズは HeroJP の実測インク幅（100pxあたり）から逆算：
   伊藤 198.3 / まもる 273.7（左の余白 15.3）/ キャッチ 1618.0（2026-10-20 文言変更後）。
   text-indent で左の余白を消し、見た目の幅を --w にぴったり合わせる */
.mainV_nameRow--ito { font-size: calc(var(--w) / 1.983); text-indent: -.008em; }
.mainV_nameRow--mamoru {
  /* 字間 -.06em ×2か所ぶんインク幅が縮む（2.737 → 2.617）ので、その分サイズを上げる */
  font-size: calc(var(--w) / 2.617); letter-spacing: -.06em; text-indent: -.153em;
  padding-top: calc(var(--w) * .0047);
}
/* 区切り線：「伊藤」の下端と「まもる」の上端（インク）のちょうど中間 */
.mainV_rule { display: block; height: calc(var(--w) * .014); margin-top: calc(var(--w) * .068); background: var(--orange); transform-origin: left center; }
.mainV_catch {
  margin-top: calc(var(--w) * .08);
  color: var(--brown); font-weight: 900; font-size: calc(var(--w) / 16.18); text-indent: -.014em; /* 「地域をまもる！ ～安心な暮らしを～」の実測インク幅 16.18em */
  line-height: 1.4; letter-spacing: 0; white-space: nowrap;
}
.mainV_catch span { color: var(--orange); }
.mainV_photo { /* 頭から胸元までを大きく。下端は画面で切る */
  position: absolute; left: 50%; top: calc(var(--header-h) + 5%);
  width: 40vw; min-width: 480px; max-width: 780px;
}
.mainV_photo img { display: block; width: 100%; height: auto; }
.mainV_scroll {
  position: absolute; left: 20px; bottom: 18px;
  color: var(--brown); font-family: var(--font-en); font-size: 12px; letter-spacing: .2em;
  text-decoration: none; text-align: center;
}
.mainV_scroll::after {
  content: ""; display: block; width: 1px; height: 36px; margin: 6px auto 0;
  background: var(--brown); animation: scroll 2s infinite;
}
@keyframes scroll { 0% { transform: scaleY(0); transform-origin: top; } 50% { transform: scaleY(1); transform-origin: top; } 51% { transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; } }

/* ---------- section common ---------- */
.sec { padding: 110px 0; }
.sec_title { text-align: center; margin-bottom: 56px; }
.sec_title > span {
  display: block; font-family: var(--font-en); font-weight: 700;
  font-size: 15px; letter-spacing: .3em; color: var(--orange);
}
.profile .sec_title > span, .support .sec_title > span { color: var(--orange-pale); }
.sec_title h2 { font-size: clamp(26px, 3vw, 36px); font-weight: 900; color: var(--brown); letter-spacing: .06em; line-height: 1.5; }
.sec_title h2 em { font-style: normal; color: var(--orange); }
.mark { background: linear-gradient(transparent 62%, var(--orange-light) 62%); font-weight: 700; }
.accent { color: var(--orange); font-weight: 700; }

/* ---------- greeting ---------- */
.greeting_body { max-width: 780px; margin-inline: auto; }
.greeting_body p + p { margin-top: 1.4em; }
.greeting_lead {
  font-size: clamp(20px, 2.2vw, 26px); font-weight: 900; color: var(--brown);
  line-height: 1.7; text-align: center; margin-bottom: 40px !important;
}
.greeting_sign { margin-top: 40px !important; text-align: right; font-weight: 700; color: var(--brown); }
.greeting_sign span, .greeting_sign b { white-space: nowrap; }
.greeting_sign b { font-size: 26px; margin-left: .4em; letter-spacing: .1em; }

/* ---------- profile ---------- */
.profile { background: var(--orange); color: #fff; }
.profile .sec_title h2 { color: #fff; }
.profile_wrap { display: grid; grid-template-columns: 1fr 1.25fr; gap: 64px; align-items: start; }
.profile_card { background: #fff; color: var(--ink); padding: 0 40px 40px; margin-top: 9.6px; } /* 上端＝右の「1976」の文字の上端。写真は上の余白へはみ出す */
/* 写真は胸から上。頭はカードの上枠から少しはみ出させる */
.profile_head { display: flex; align-items: flex-end; gap: 4%; container-type: inline-size; }
.profile_photo { width: 48%; flex-shrink: 0; margin-top: -70px; }
.profile_photo img { display: block; width: 100%; height: auto; filter: drop-shadow(0 -1px 5px rgba(58,36,24,.16)); }
.profile_head + .profile_data { margin-top: 0; } /* 写真の下端＝表の上罫線 */
.profile_head .profile_name { padding-bottom: 6px; white-space: nowrap; font-size: 7.4cqi; letter-spacing: .04em; } /* カード幅に合わせて1行に収める */
.profile_head .profile_name small { font-size: max(11px, .4em); }
.profile_name { font-size: 34px; font-weight: 900; color: var(--brown); letter-spacing: .1em; line-height: 1.3; }
.profile_name small { display: block; font-size: 13px; letter-spacing: .2em; color: var(--orange); }
.profile_name rt { font-size: max(11px, .4em); font-weight: 900; letter-spacing: .2em; color: var(--orange); ruby-align: center; padding-bottom: .2em; } /* 「伊藤」の真上に中央揃え */
.profile_data { margin-top: 24px; display: grid; grid-template-columns: 5.5em 1fr; border-top: 1px solid var(--line); }
.profile_data dt, .profile_data dd { padding: 12px 0; border-bottom: 1px solid var(--line); }
.profile_data dt { font-weight: 700; color: var(--brown); }
.history { position: relative; }
.history li { position: relative; display: grid; grid-template-columns: 6em 1fr; padding: 0 0 22px 28px; }
.history li::before {
  content: ""; position: absolute; left: 0; top: .7em;
  width: 11px; height: 11px; border-radius: 50%; background: #fff;
}
.history li::after {
  content: ""; position: absolute; left: 5px; top: 1.3em; bottom: -.2em;
  width: 1px; background: rgba(255,255,255,.5);
}
.history li:last-child::after { display: none; }
.history time { font-family: var(--font-en); font-weight: 700; font-size: 18px; color: #fff; }
.history li.is-now span { font-weight: 700; }

/* ---------- policy ---------- */
.policy { background: var(--gray); }
.policy_list { display: grid; gap: 40px; }
.policy_item {
  display: grid; grid-template-columns: 210px 1fr;
  background: #fff; box-shadow: 0 2px 0 var(--line);
}
.policy_head {
  background: var(--orange); color: #fff;
  display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 30px 16px;
}
.policy_num { font-family: var(--font-en); font-size: 15px; letter-spacing: .2em; color: var(--orange-pale); }
.policy_num b { display: block; font-size: 64px; line-height: 1; letter-spacing: 0; color: #fff; }
.policy_body { padding: 40px 44px; }
.policy_body h3 { font-size: clamp(22px, 2.4vw, 28px); font-weight: 900; color: var(--brown); line-height: 1.5; margin-bottom: 18px; }
.policy_body h3 em { font-style: normal; color: var(--orange); }
.policy_points { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 8px; }
.policy_points li {
  font-size: 14px; font-weight: 700; padding: 4px 14px;
  border: 1px solid var(--orange); color: var(--orange); border-radius: 999px;
}

/* ---------- report ---------- */
.report_list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.report_item a { display: block; text-decoration: none; }
.report_thumb { aspect-ratio: 3 / 2; background: var(--gray); overflow: hidden; }
.report_thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.report_item a:hover .report_thumb img { transform: scale(1.05); }
.report_meta { margin-top: 14px; display: flex; gap: 10px; align-items: center; font-size: 13px; }
.report_meta time { font-family: var(--font-en); font-weight: 700; color: var(--brown); }
.report_meta span { background: var(--orange); color: #fff; padding: 0 10px; font-size: 12px; }
.report_item h3 { margin-top: 6px; font-size: 16px; font-weight: 700; line-height: 1.6; }
.report_noimg { width: 100%; height: 100%; display: grid; place-items: center; color: #b9c0cf; font-family: var(--font-en); letter-spacing: .2em; }
.btnMore { margin-top: 48px; text-align: center; }
.btn {
  display: inline-block; min-width: 260px; padding: 16px 40px;
  border: 2px solid var(--brown); color: var(--brown); text-decoration: none;
  font-weight: 700; text-align: center; transition: .3s;
}
.btn:hover { background: var(--brown); color: #fff; }

/* ---------- support (後援会) ---------- */
.support { background: var(--orange); color: #fff; }
.support .sec_title h2 { color: #fff; }
.support_wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.support_lead { font-size: clamp(20px, 2.2vw, 26px); font-weight: 900; line-height: 1.7; }
.support_text { margin-top: 18px; opacity: .9; }
.support_join { display: flex; align-items: center; gap: 28px; background: rgba(0,0,0,.12); padding: 32px; }
.support_qr { width: 130px; flex-shrink: 0; }
.btnJoin {
  display: block; padding: 18px 24px; border-radius: 999px;
  background: #fff; color: var(--orange); text-decoration: none; text-align: center;
  font-weight: 900; font-size: 18px; letter-spacing: .05em; transition: .3s;
}
.btnJoin:hover { filter: brightness(1.1); }
.support_contact { margin-top: 56px; padding-top: 40px; border-top: 1px solid rgba(255,255,255,.35); display: flex; justify-content: center; gap: 56px; flex-wrap: wrap; }
.support_contact dt { font-size: 13px; opacity: .85; }
.support_contact dd { font-family: var(--font-en); font-size: 26px; font-weight: 700; letter-spacing: .05em; }
.support_contact dd a { text-decoration: none; }

/* ---------- contact ---------- */
.contact { background: var(--gray); }
.contact_lead { max-width: 760px; margin: -24px auto 40px; text-align: center; }
.contactForm { max-width: 760px; margin-inline: auto; background: #fff; padding: 48px 56px; }
.contactForm_list { display: grid; grid-template-columns: 13em 1fr; gap: 20px 24px; align-items: center; }
.contactForm_list dt { font-weight: 700; color: var(--brown); display: flex; align-items: center; gap: 10px; }
.contactForm_list dt em { font-style: normal; font-size: 11px; font-weight: 700; padding: 1px 8px; background: var(--orange); color: #fff; letter-spacing: .1em; }
.contactForm_list dt:has(+ dd textarea) { align-self: start; padding-top: 12px; }
.contactForm input[type="text"], .contactForm input[type="email"], .contactForm input[type="tel"], .contactForm select, .contactForm textarea {
  width: 100%; padding: 12px 14px; border: 1px solid var(--line); border-radius: 4px; background: #fffdfb;
  font: inherit; color: var(--ink); letter-spacing: .04em;
}
.contactForm textarea { resize: vertical; min-height: 160px; }
.contactForm input:focus, .contactForm select:focus, .contactForm textarea:focus { outline: 2px solid var(--orange); outline-offset: 1px; border-color: transparent; }
.contactForm_hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.contactForm_agree { margin-top: 28px; font-size: 14px; }
.contactForm_agree label { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; }
.contactForm_agree input { margin-top: .45em; accent-color: var(--orange); width: 18px; height: 18px; flex-shrink: 0; }
.contactForm_msg { margin-top: 20px; white-space: pre-line; font-weight: 700; text-align: center; }
.contactForm_msg:empty { display: none; }
.contactForm_msg.is-error { color: #c62828; }
.contactForm_msg.is-ok { color: var(--orange); }
.contactForm_submit { margin-top: 28px; text-align: center; }
.contactForm_submit .btnJoin { display: inline-block; min-width: 280px; border: 0; cursor: pointer; background: var(--orange); color: #fff; font-family: inherit; }
.contactForm_submit .btnJoin:disabled { opacity: .6; cursor: default; }

/* ---------- footer ---------- */
.footer { background: var(--orange); border-top: 1px solid rgba(255,255,255,.35); color: #fff; text-align: center; padding: 28px 20px; font-size: 13px; }
.support_sns { margin-top: 32px; display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; }
.snsBtn {
  display: inline-flex; align-items: center; gap: 10px; padding: 12px 26px; border-radius: 999px;
  border: 2px solid #fff; color: #fff; text-decoration: none; font-family: var(--font-en); font-weight: 700; font-size: 16px; letter-spacing: .06em; transition: .2s;
}
.snsBtn svg { width: 22px; height: 22px; }
.snsBtn:hover { background: #fff; color: var(--orange); }
.footer_sns { display: flex; justify-content: center; gap: 20px; margin-bottom: 14px; }
.footer_snsLink { display: grid; place-items: center; width: 40px; height: 40px; color: #fff; transition: opacity .2s; }
.footer_snsLink svg { width: 24px; height: 24px; }
.footer_snsLink:hover { opacity: .7; }

/* ---------- animation (GSAP: cmn/js/anim.js) ---------- */
.intro { display: none; }
.is-anim .intro {
  position: fixed; inset: 0; z-index: 100;
  display: grid; place-items: center;
  background: #fff; font-family: "HeroJP", var(--font-ja); letter-spacing: 0; font-feature-settings: normal;
}
/* --f：中央の正方形の枠の一辺。名前の文字サイズは最初の画面と同じ比率で枠の幅にぴったり合わせる */
.intro_stage { --f: min(26vw, 34vh, 320px); position: relative; width: var(--f); height: var(--f); }
.intro_frame { position: absolute; inset: 0; z-index: 2; overflow: hidden; background: var(--orange-light); }
.intro_photos li { position: absolute; inset: 0; visibility: hidden; }
.intro_photos li.is-on { visibility: visible; }
.intro_photos img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; }
.intro_ph { display: grid; place-items: center; color: #fff; font-family: var(--font-ja); font-size: 13px; font-weight: 700; letter-spacing: .15em; }
.intro_ph--a { background: #c94400; }
.intro_ph--b { background: #8a5a3c; }
.intro_ph--c { background: #3a2418; }
/* 色付きマークを白抜きで表示。中央寄せは translate を使わない
   （GSAP が読み込み前の高さ0の状態で translate を数値に固定し、下にずれることがあった） */
.intro_mark { position: absolute; inset: 0; margin: auto; width: 38%; height: auto; aspect-ratio: 689 / 675; opacity: .92; pointer-events: none; filter: brightness(0) invert(1); }
/* 名前は枠の「裏」に置き、そこから上下へせり出す */
.intro_name { position: absolute; left: 0; width: 100%; z-index: 1; color: var(--orange); font-weight: 900; line-height: 1; white-space: nowrap; }
.intro_name span { display: block; }
.intro_name--top { bottom: calc(100% + .06em); /* 字形の下端が行の外へ .037em はみ出すので、枠に隠れないよう少し上げる */ font-size: calc(var(--f) / 1.983); text-indent: -.008em; }
.intro_name--bottom { top: calc(100% - .1em); font-size: calc(var(--f) / 2.617); letter-spacing: -.06em; text-indent: -.153em; }
.is-intro-done .intro { display: none; }
@media (max-width: 900px) {
  .intro_stage { --f: min(58vw, 30vh); }
}
.is-anim .mainV_panel, .is-anim .mainV_party, .is-anim .mainV_catch, .is-anim .mainV_photo { visibility: hidden; }
.is-anim .mainV .mask > span { transform: translateY(110%); }
.is-anim .mainV_rule { transform: scaleX(0); }
.ch { display: inline; }

/* ---------- fade ---------- */
.js-fade { opacity: 0; translate: 0 24px; transition: opacity .8s, translate .8s; }
.js-fade.is-show { opacity: 1; translate: 0 0; }

/* ==========================================================
   SP
   ========================================================== */
@media (max-width: 900px) {
  :root { --header-h: 60px; }
  body { font-size: 15px; }
  .sp { display: inline; }
  .pc { display: none; }
  .header { padding: 0 16px; justify-content: flex-start; }
  .header_logo b { font-size: 18px; }
  .header_logo img { height: 26px; }
  .header_logo small { display: none; }
  /* スマホ：ロゴ ｜（右寄せ）SNSアイコン → ハンバーガー */
  .header_sns { order: 1; margin-left: auto; gap: 0; }
  .header_sns a { width: 36px; height: 44px; }
  .header_sns svg { width: 22px; height: 22px; }
  .menuBtn {
    order: 2;
    display: block; position: relative; width: 44px; height: 44px; margin-left: 8px;
    border: 0; background: var(--orange); cursor: pointer;
  }
  .menuBtn span, .menuBtn::before, .menuBtn::after {
    content: ""; position: absolute; left: 12px; width: 20px; height: 2px; background: #fff; transition: .3s;
  }
  .menuBtn::before { top: 15px; } .menuBtn span { top: 21px; } .menuBtn::after { top: 27px; }
  .is-menuOpen .menuBtn::before { top: 21px; rotate: 45deg; }
  .is-menuOpen .menuBtn span { opacity: 0; }
  .is-menuOpen .menuBtn::after { top: 21px; rotate: -45deg; }
  .gnav {
    position: fixed; inset: var(--header-h) 0 auto 0;
    flex-direction: column; gap: 0; padding: 12px 20px 28px;
    background: #fff; box-shadow: 0 10px 20px rgba(0,0,0,.08);
    visibility: hidden; opacity: 0; transition: .3s;
  }
  .is-menuOpen .gnav { visibility: visible; opacity: 1; }
  .gnav li { width: 100%; border-bottom: 1px solid var(--line); }
  .gnav li:last-child { border: 0; padding-top: 20px; }
  .gnav a { display: block; padding: 14px 0; font-size: 16px; }
  .gnav .gnav_btn { text-align: center; }

  .mainV_panel { clip-path: polygon(100% 64%, 100% 100%, 0 100%, 0 90%); }
  .mainV_inner { grid-template-columns: 1fr; grid-template-rows: auto; height: auto; }
  .mainV_text { --w: min((100vw - 40px) * .67, 270px); margin: 0 auto; padding: 28px 0 0; } /* 名前ブロックは画面幅の約2/3。下の顔写真が最初の画面に入るように */
  /* スマホは胸から上だけを使う（写真の上から約55%） */
  .mainV_photo { position: relative; left: auto; top: auto; min-width: 0; height: auto; width: min(92%, 480px); margin: 24px auto 0; aspect-ratio: 1 / 1; overflow: hidden; }
  .mainV_photo img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
  .mainV_scroll { display: none; }

  .sec { padding: 72px 0; }
  .sec_title { margin-bottom: 36px; }
  .greeting_lead { text-align: left; font-size: min(17px, (100vw - 40px) / 19.5); }

  .greeting_sign span { display: block; font-size: 13px; }
  .greeting_sign b { display: block; margin: 2px 0 0; }
  .profile_wrap { grid-template-columns: 1fr; gap: 40px; }
  .profile_card { padding: 0 22px 28px; }
  .profile_card { margin-top: 60px; }
  .profile_photo { margin-top: -60px; }
  .history li { grid-template-columns: 4.6em 1fr; }
  .history time { font-size: 16px; }
  .policy_item { grid-template-columns: 1fr; }
  .policy_head { flex-direction: row; gap: 12px; padding: 14px; }
  .policy_num b { display: inline; font-size: 36px; margin-left: 6px; }
  .policy_body { padding: 26px 22px; }
  .report_list { grid-template-columns: 1fr; gap: 28px; }
  .support_wrap { grid-template-columns: 1fr; gap: 32px; }
  .support_join { flex-direction: column; padding: 24px; gap: 18px; }
  .support_qr { display: none; }
  .btnJoin { width: 100%; }
  .support_contact { gap: 24px; justify-content: flex-start; }
  .support_contact dd { font-size: 22px; }
  .contactForm { padding: 28px 20px; }
  .contactForm_list { grid-template-columns: 1fr; gap: 8px; }
  .contactForm_list dd { margin-bottom: 12px; }
  .contactForm_list dt:has(+ dd textarea) { padding-top: 0; }
  .contact_lead { text-align: left; margin-top: -12px; }
  .contactForm_submit .btnJoin { width: 100%; min-width: 0; }
}

/* ==========================================================
   下層ページ（活動報告 一覧・詳細）
   ========================================================== */
.pageHead { padding: calc(var(--header-h) + 56px) 0 56px; background: var(--orange); color: #fff; text-align: center; }
.pageHead_en { font-family: var(--font-en); font-weight: 700; font-size: 15px; letter-spacing: .3em; color: var(--orange-pale); }
.pageHead_title { font-size: clamp(28px, 3.2vw, 40px); font-weight: 900; line-height: 1.4; }
.breadcrumb { padding: 16px 0; font-size: 13px; }
.breadcrumb ol { display: flex; flex-wrap: wrap; gap: 0 .6em; }
.breadcrumb li + li::before { content: "›"; margin-right: .6em; color: #b9a99c; }
.breadcrumb a { color: var(--brown); }
.breadcrumb [aria-current] { color: #8a776a; }
.reportArchive { padding-top: 48px; }

.catNav { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 48px; }
.catNav a {
  display: block; padding: 8px 22px; border-radius: 999px;
  border: 1px solid var(--orange); color: var(--orange); text-decoration: none; font-weight: 700; font-size: 14px; transition: .2s;
}
.catNav a:hover, .catNav a[aria-current] { background: var(--orange); color: #fff; }

.pager { margin-top: 64px; display: flex; justify-content: center; align-items: center; gap: 8px; font-family: var(--font-en); font-weight: 700; }
.pager a, .pager span {
  min-width: 44px; height: 44px; padding: 0 12px; display: grid; place-items: center;
  border: 1px solid var(--line); color: var(--brown); text-decoration: none;
}
.pager a:hover { border-color: var(--orange); color: var(--orange); }
.pager .is-current { background: var(--orange); border-color: var(--orange); color: #fff; }

.post { padding-top: 40px; }
.post_inner { width: min(800px, 100% - 40px); margin-inline: auto; }
.post_head { padding-bottom: 24px; border-bottom: 2px solid var(--orange); }
.post_head .report_meta { margin: 0 0 10px; }
.post_title { font-size: clamp(22px, 2.6vw, 30px); font-weight: 900; color: var(--brown); line-height: 1.6; }
.post_eyecatch { margin-top: 32px; aspect-ratio: 16 / 9; background: var(--gray); }
.post_body { margin-top: 40px; }
.post_body > * + * { margin-top: 1.6em; }
.post_body h2 {
  margin-top: 2.6em; padding: .5em .8em; border-left: 6px solid var(--orange); background: var(--gray);
  font-size: clamp(19px, 2vw, 23px); font-weight: 900; color: var(--brown); line-height: 1.5;
}
.post_body h3 { margin-top: 2em; padding-bottom: .4em; border-bottom: 1px solid var(--line); font-size: 18px; font-weight: 900; color: var(--orange); line-height: 1.5; }
.post_body ul { padding-left: 0; }
.post_body ul li { position: relative; padding-left: 1.3em; }
.post_body ul li + li { margin-top: .4em; }
.post_body ul li::before { content: ""; position: absolute; left: .2em; top: .78em; width: .45em; height: .45em; border-radius: 50%; background: var(--orange); }
.post_body figure { margin: 2em 0 0; }
.post_body figure img { display: block; width: 100%; height: auto; }
.post_noimg { width: 100%; aspect-ratio: 3 / 2; }
.post_body figcaption { margin-top: .6em; font-size: 13px; color: #8a776a; text-align: center; }
.post_body blockquote { margin: 2em 0 0; padding: 1.2em 1.4em; background: var(--orange-light); border-radius: 4px; font-weight: 700; }
.post_body a { color: var(--orange); }
.postNav { margin-top: 64px; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.postNav a { display: block; padding: 18px 20px; border: 1px solid var(--line); text-decoration: none; font-size: 14px; line-height: 1.6; transition: .2s; }
.postNav a span { display: block; font-size: 12px; font-weight: 700; color: var(--orange); }
.postNav a[href]:hover { border-color: var(--orange); }
.postNav .postNav_next { text-align: right; }
.postNav .is-disabled { color: #b9a99c; }
.postNav .is-disabled span { color: #b9a99c; }

@media (max-width: 900px) {
  .pageHead { padding: calc(var(--header-h) + 36px) 0 36px; }
  .catNav { justify-content: flex-start; gap: 8px; margin-bottom: 32px; }
  .catNav a { padding: 6px 16px; font-size: 13px; }
  .pager { margin-top: 44px; }
  .postNav { grid-template-columns: 1fr; }
  .postNav .postNav_next { text-align: left; }
}

/* 活動報告：1件も投稿がない間は、トップの欄とメニューの項目を出さない */
#report:not(:has(.report_item)) { display: none; }
body:not(:has(#report .report_item)) .gnav li:has(> a[href="#report"]) { display: none; }
/* 活動報告を出さない間は、政策とお問い合わせの背景が続かないよう、お問い合わせの地と枠の色を入れ替える */
#report:not(:has(.report_item)) + .contact { background: #fff; }
#report:not(:has(.report_item)) + .contact .contactForm { background: var(--gray); }
#report:not(:has(.report_item)) + .contact .contactForm :is(input[type="text"], input[type="email"], input[type="tel"], select, textarea) { background: #fff; }

/* ---------- WordPress（活動報告） ---------- */
.post_eyecatch { overflow: hidden; }
.post_eyecatch img { display: block; width: 100%; height: 100%; object-fit: cover; }
.report_thumb img { display: block; }
.report_empty { text-align: center; padding: 40px 0; color: #8a776a; }
.pager .pager_prev, .pager .pager_next { padding: 0 16px; }
.pager .dots { border: 0; }
.post_body .wp-block-image, .post_body figure { margin-inline: 0; }
.post_body .aligncenter { margin-inline: auto; text-align: center; }
.post_body .alignleft { float: left; margin: .3em 1.5em 1em 0; }
.post_body .alignright { float: right; margin: .3em 0 1em 1.5em; }
.post_body::after { content: ""; display: block; clear: both; }
.post_body ol { padding-left: 1.6em; list-style: decimal; }
.post_body .wp-block-embed iframe, .post_body iframe { max-width: 100%; }
.post_body .wp-block-gallery { display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width: 900px) {
  .post_body .alignleft, .post_body .alignright { float: none; margin: 1em 0; }
}