/* =========================================================
   SDD Frame – Main stylesheet
   SOCIAL DESIGNERS FOR D.

   ブランドカラーパレット
   - Deep Purple (主)  : #2E2A4F  ディープパープル（ロゴ本体）
   - Lime Green       : #8FC73E  ライムグリーン（新芽・S）
   - Sun Yellow       : #F4C40F  サンイエロー（アクセント三角）
   - Magenta Pink     : #E5184A  マゼンタピンク（D. アクセント）
   - Charcoal Black   : #0E0E14  チャコールブラック（ロゴ背景）
   ========================================================= */

:root{
	--color-primary:#2E2A4F;        /* ディープパープル：見出し、CTA、リンク */
	--color-primary-dark:#1F1C38;
	--color-primary-soft:#4B477A;
	--color-accent-green:#8FC73E;   /* ライムグリーン：S、ロゴ、強調アンダーライン */
	--color-accent-green-dark:#74A82C;
	--color-accent-yellow:#F4C40F;  /* サンイエロー：見出しラインのアクセント */
	--color-accent-pink:#E5184A;    /* マゼンタピンク：寄付CTA・重要バッジ */
	--color-accent-pink-dark:#B5113A;
	--color-accent-blue:#2E7FD1;    /* ブルー：研修・講師事業 */
	--color-accent-blue-dark:#1F5FA5;
	--color-bg:#FAFAFB;
	--color-bg-alt:#F2F1F6;
	--color-bg-dark:#0E0E14;        /* チャコールブラック */
	--color-text:#1A1825;
	--color-text-on-dark:#F8F7FA;
	--color-muted:#6F6C85;
	--color-border:#E5E3EE;
	--radius:6px;
	--shadow-sm:0 1px 2px rgba(46,42,79,.08);
	--shadow-md:0 8px 24px rgba(46,42,79,.12);
	--shadow-lg:0 14px 40px rgba(46,42,79,.18);
	--container:1100px;
	--font-jp:"Noto Sans JP",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
	--font-en:"Montserrat","Noto Sans JP",sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden}
body{
	margin:0;font-family:var(--font-jp);color:var(--color-text);
	background:var(--color-bg);line-height:1.7;-webkit-font-smoothing:antialiased;
	overflow-x:hidden; /* 横スクロール防止 */
}
img{max-width:100%;height:auto;display:block}
/* WordPress Twemoji絵文字は元のサイズ・インライン表示を維持 */
img.emoji{width:auto!important;height:1.2em!important;max-width:none!important;
	display:inline!important;vertical-align:-.15em!important;border-radius:0!important;margin:0!important}
a{color:inherit;text-decoration:none;transition:opacity .2s,color .2s}
a:hover{opacity:.85}
button{font-family:inherit;cursor:pointer}

::selection{background:var(--color-accent-yellow);color:var(--color-primary)}

.screen-reader-text{
	border:0;clip:rect(1px,1px,1px,1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);
	height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important;
}
.skip-link{position:absolute;top:-40px;left:8px;background:var(--color-primary);color:#fff;padding:8px 12px;z-index:1000}
.skip-link:focus{top:8px}

/* ---------------- HEADER ---------------- */
.site-header{
	position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--color-border);
	box-shadow:0 1px 0 rgba(0,0,0,.02);
}
.site-header__inner{
	max-width:var(--container);margin:0 auto;padding:14px 20px;
	display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.site-branding .custom-logo-link img{max-height:48px;width:auto}
.site-logo__text{
	font-family:var(--font-en);font-weight:800;font-size:20px;color:var(--color-primary);letter-spacing:.04em;
}
.primary-nav{display:none}
/* デスクトップの横並び時は折り返しを禁止（幅が足りなければハンバーガーに切替）。
   モバイルのオーバーレイ表示時は後段で flex-direction:column に上書きされる。 */
.primary-menu{list-style:none;margin:0;padding:0;display:flex;gap:16px;align-items:center;flex-wrap:nowrap;justify-content:center}
.primary-menu a{
	font-weight:600;font-size:13px;color:var(--color-primary);position:relative;padding:4px 2px;
	white-space:nowrap;
}
.primary-menu a::after{
	content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--color-accent-green);
	transform:scaleX(0);transform-origin:left;transition:transform .3s;
}
.primary-menu a:hover{opacity:1;color:var(--color-primary)}
.primary-menu a:hover::after{transform:scaleX(1)}

.nav-toggle{
	background:transparent;border:0;padding:10px;display:flex;flex-direction:column;gap:5px;
}
.nav-toggle__bar{
	width:26px;height:2px;background:var(--color-primary);border-radius:2px;transition:transform .3s,opacity .3s;
}
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* モバイル：オーバーレイメニュー */
.primary-nav.is-open{
	display:block;position:fixed;inset:64px 0 0 0;background:#fff;z-index:40;padding:24px 20px;overflow:auto;
}
.primary-nav.is-open .primary-menu{flex-direction:column;align-items:flex-start;gap:18px}
.primary-nav.is-open .primary-menu a{font-size:18px}

/* ---- デスクトップ：横並びナビ ----
   メニュー項目が 9 つあるため、
   ・≥1080px ：コンパクトな横並び（font 12px / gap 12px）で 1 行に収める
   ・≥1280px ：快適サイズ（font 13px / gap 18px）に拡張
   ・<1080px ：ハンバーガーのまま（無理に横並びにせず、見た目のバランスを保つ）
   これにより中間サイズで 1 項目だけ折り返して中央に孤立する事象を回避する。 */
@media (min-width:1080px){
	.nav-toggle{display:none}
	.primary-nav{display:block!important;position:static;padding:0;background:transparent}
	.site-header__inner{justify-content:center;gap:20px;flex-wrap:nowrap}
	.primary-menu{gap:12px}
	.primary-menu a{font-size:12px;letter-spacing:.01em}
}
@media (min-width:1280px){
	.site-header__inner{gap:36px}
	.primary-menu{gap:18px}
	.primary-menu a{font-size:13px;letter-spacing:0}
}

/* ---------------- HERO ---------------- */
.hero{
	position:relative;min-height:560px;
	background:#2a2a2a center/cover no-repeat;
	color:#fff;display:flex;align-items:center;
	width:100%; /* WordPress の max-width 制限を受けないよう明示 */
}
.hero__overlay{
	position:absolute;inset:0;
	background:linear-gradient(180deg,rgba(0,0,0,.25) 0%,rgba(40,40,40,.55) 60%,rgba(90,90,90,.75) 100%);
}
.hero__inner{
	position:relative;max-width:var(--container);margin:0 auto;padding:80px 20px;width:100%;
}
.hero__title{
	font-size:clamp(26px,4vw,44px);font-weight:800;line-height:1.45;margin:0;letter-spacing:.02em;
	text-shadow:0 2px 14px rgba(0,0,0,.35);
}

/* ---------------- IMPACTS ---------------- */
.impacts{background:var(--color-primary);color:#fff;padding:0;position:relative;overflow:hidden}
.impacts::before{
	content:"";position:absolute;left:0;right:0;top:0;height:4px;
	background:linear-gradient(90deg,
		var(--color-accent-green) 0 25%,
		var(--color-accent-yellow) 25% 50%,
		var(--color-accent-pink)   50% 75%,
		var(--color-primary-soft)  75% 100%
	);
}
.impacts__inner{
	max-width:var(--container);margin:0 auto;padding:0 20px;
	display:flex;align-items:stretch;flex-wrap:wrap;gap:0;
}
.impacts__tagline{
	flex:0 0 100%;padding:18px 0;font-weight:700;font-size:14px;letter-spacing:.02em;
	border-bottom:1px solid rgba(255,255,255,.18);
}
.impacts__list{
	list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;width:100%;
}
.impacts__item{
	padding:22px 8px;text-align:center;border-top:1px solid rgba(255,255,255,.18);
}
.impacts__label{font-size:13px;opacity:.92}
.impacts__value{
	font-family:var(--font-en);font-weight:800;font-size:34px;line-height:1;margin-top:6px;
	color:var(--color-accent-green);letter-spacing:.02em;
}
.impacts__note{font-size:11px;opacity:.85;margin-top:4px}

@media (min-width:760px){
	.impacts__tagline{flex:0 0 auto;border-bottom:0;padding:30px 24px 30px 0}
	.impacts__list{grid-template-columns:repeat(3,1fr)}
	.impacts__item{border-top:0;border-left:1px solid rgba(255,255,255,.18);padding:28px 16px}
}

/* ---------------- SECTIONS ---------------- */
.section{padding:72px 0}
.section--pickup,.section--activities{background:var(--color-bg-alt)}
.section--cta{padding:48px 0 96px;background:var(--color-bg)}
.section__inner{max-width:var(--container);margin:0 auto;padding:0 20px}

/* 各セクションのアクセントカラーを CSS 変数で一元管理
   → タイトル左ボーダー と 「一覧を見る」のアンダーライン が自動連動 */
.section{--section-accent:var(--color-accent-green)}
.section--pickup    {--section-accent:var(--color-accent-yellow)}
.section--journal   {--section-accent:var(--color-accent-pink)}
.section--events    {--section-accent:var(--color-accent-yellow)}
.section--news      {--section-accent:var(--color-primary-soft)}
.section--activities{--section-accent:var(--color-accent-green)}

.section__title{
	font-family:var(--font-jp);font-weight:800;font-size:clamp(20px,2.4vw,28px);
	margin:0 0 28px;letter-spacing:.04em;color:var(--color-primary);
	border-left:5px solid var(--section-accent);padding-left:14px;line-height:1.3;
}
.section__title--en{font-family:var(--font-en);letter-spacing:.18em}

.section__heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:24px;flex-wrap:wrap}
.section__heading .section__title{margin-bottom:0}
.section__more{
	font-size:13px;color:var(--color-primary);font-weight:700;white-space:nowrap;
	border-bottom:2px solid var(--section-accent);padding-bottom:2px;
}
.section__more:hover{color:var(--color-primary-dark);opacity:1}

/* ---------------- CARD GRID ---------------- */
.card-grid{display:grid;gap:22px}
.card-grid--3{grid-template-columns:repeat(1,1fr)}
.card-grid--2{grid-template-columns:repeat(1,1fr)}
@media (min-width:700px){
	.card-grid--3{grid-template-columns:repeat(3,1fr)}
	.card-grid--2{grid-template-columns:repeat(2,1fr)}
}
.card-grid__empty{
	grid-column:1/-1;padding:40px;text-align:center;background:#fff;
	border-radius:var(--radius);color:var(--color-muted);border:1px dashed var(--color-border);
}

/* 新デザイン：ふんわりシャドウ＋角丸大・サムネイル内側余白・右上フロートバッジ */
.card{
	display:flex;flex-direction:column;background:#fff;border-radius:16px;
	box-shadow:0 2px 6px rgba(46,42,79,.06),0 14px 32px rgba(46,42,79,.06);
	border:0;padding:14px;color:inherit;position:relative;
	transition:transform .25s ease,box-shadow .25s ease;
}
.card:hover{
	transform:translateY(-4px);
	box-shadow:0 4px 10px rgba(46,42,79,.08),0 20px 44px rgba(46,42,79,.12);
	opacity:1;
}

.card-thumb{
	width:100%;aspect-ratio:16/10;border-radius:12px;overflow:hidden;
	background:var(--color-bg-alt) center/cover no-repeat;position:relative;
}
.card-thumb--placeholder{
	background:linear-gradient(135deg,var(--color-bg-alt) 0%,#E8E6F0 100%);
}
.card-thumb--placeholder::after{
	content:"";position:absolute;left:50%;top:50%;width:40px;height:40px;
	transform:translate(-50%,-50%);border-radius:50%;
	background:radial-gradient(circle at 30% 30%,var(--color-accent-green) 0%,var(--color-accent-green-dark) 70%);
	opacity:.35;
}

.card__body{
	padding:16px 6px 6px;
	display:flex;flex-direction:column;gap:10px;flex:1;
}
.card__title{
	font-size:15px;font-weight:700;line-height:1.65;margin:0;color:var(--color-primary);
}
.card__excerpt{font-size:13px;color:var(--color-muted);margin:0;line-height:1.7}
.card__date{
	font-size:12px;color:var(--color-muted);font-family:var(--font-en);
	letter-spacing:.06em;margin-top:auto;
}

/* フロートバッジ（画像右上に重ねる） */
.card__badge{
	position:absolute;top:22px;right:22px;z-index:2;
	background:var(--color-primary);color:#fff;font-size:11px;font-weight:700;
	padding:6px 12px;border-radius:4px;letter-spacing:.04em;
	box-shadow:0 2px 6px rgba(0,0,0,.14);text-transform:none;
	align-self:auto;margin-top:0;
}
.section--journal .card__badge{background:var(--color-accent-pink)}
.section--events  .card__badge{background:var(--color-accent-yellow);color:var(--color-primary)}
.section--news    .card__badge{background:var(--color-primary)}
.section--pickup  .card__badge{background:var(--color-accent-green-dark)}

.card--placeholder{min-height:260px}
.card--placeholder .card-thumb{min-height:160px}
.card--placeholder .card__body{justify-content:center}

/* ---------------- ACTIVITIES ----------------
   バナー型カード：左にサムネイル／中央にタイトル＋説明／右端に矢印
   ・角は大きめに丸く、白背景 + やわらかい影
   ・色分け（red/green/blue）はタイトル文字色のみで表現し、
     左縦ボーダーは使わない（添付デザインに合わせる）
   ---------------------------------------------- */
.activity-card{
	display:flex;align-items:center;gap:18px;padding:14px 18px 14px 14px;background:#fff;
	border:1px solid var(--color-border);border-radius:18px;
	box-shadow:0 4px 14px rgba(46,42,79,.06);
	transition:transform .2s,box-shadow .2s,border-color .2s;color:inherit;
	position:relative;min-height:120px;
}
.activity-card:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(46,42,79,.12);opacity:1;border-color:transparent}

/* サムネイル（左） */
.activity-card__thumb{
	flex:0 0 140px;width:140px;height:104px;border-radius:12px;overflow:hidden;background:var(--color-bg-alt);
	display:flex;align-items:center;justify-content:center;
}
.activity-card__thumb img{
	width:100%;height:100%;object-fit:cover;display:block;
}
.activity-card__thumb-placeholder{
	display:block;width:100%;height:100%;
	background:linear-gradient(135deg,var(--color-bg-alt) 0%,#e9e7f1 100%);
}

/* テキスト部 */
.activity-card__body{flex:1;min-width:0}
.activity-card__title{
	margin:0 0 6px;color:var(--color-primary);font-size:17px;font-weight:800;letter-spacing:.02em;line-height:1.45;
}
.activity-card__subtitle{
	margin:0;font-size:13px;color:var(--color-muted);line-height:1.75;
	display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}

/* 矢印（右端） */
.activity-card__arrow{
	flex:0 0 auto;font-size:26px;color:var(--color-primary);font-weight:700;line-height:1;
	padding-left:6px;transition:transform .2s,color .2s;
}
.activity-card:hover .activity-card__arrow{transform:translateX(4px)}

/* 色バリエーション：タイトル文字色と hover 時矢印色のみ差し替え */
.activity-card--red   .activity-card__title{color:var(--color-accent-pink)}
.activity-card--red:hover .activity-card__arrow{color:var(--color-accent-pink-dark)}

.activity-card--green .activity-card__title{color:var(--color-accent-green-dark)}
.activity-card--green:hover .activity-card__arrow{color:var(--color-accent-green-dark)}

.activity-card--blue  .activity-card__title{color:var(--color-accent-blue-dark)}
.activity-card--blue:hover .activity-card__arrow{color:var(--color-accent-blue-dark)}

/* モバイル：サムネ小さめ */
@media (max-width:559px){
	.activity-card{gap:12px;padding:12px 12px 12px 10px;min-height:0}
	.activity-card__thumb{flex:0 0 96px;width:96px;height:80px;border-radius:10px}
	.activity-card__title{font-size:15px}
	.activity-card__subtitle{font-size:12px;-webkit-line-clamp:2}
	.activity-card__arrow{font-size:22px}
}

/* ---------------- CTA ---------------- */
.cta-stack{display:flex;flex-direction:column;gap:18px;max-width:720px;margin:0 auto}
.cta-button{
	display:flex;align-items:center;justify-content:space-between;gap:16px;
	padding:26px 30px;color:#fff;border-radius:var(--radius);
	box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s,filter .2s;
	position:relative;overflow:hidden;
}
.cta-button::before{
	content:"";position:absolute;inset:0;background:rgba(255,255,255,.06);opacity:0;transition:opacity .2s;
}
.cta-button:hover{opacity:1;transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.cta-button:hover::before{opacity:1}
.cta-button--volunteer{background:linear-gradient(135deg,var(--color-accent-green) 0%,var(--color-accent-green-dark) 100%)}
.cta-button--donation {background:linear-gradient(135deg,var(--color-accent-pink) 0%,var(--color-accent-pink-dark) 100%)}
.cta-button__main{font-family:var(--font-en);font-weight:800;font-size:26px;letter-spacing:.1em;position:relative}
.cta-button__sub{flex:1;text-align:right;font-size:13px;opacity:.95;position:relative}
.cta-button__arrow{font-size:24px;font-weight:700;position:relative}

/* ---------------- SPONSORS ----------------
   メインページ下部のスポンサー・協賛ロゴ一覧
   画像は 640×400 を想定（max-width で縮小表示）
   ---------------------------------------------- */
.section--sponsors{
	background:var(--color-bg-alt);
	padding:72px 0;
}
.sponsors-header{text-align:center;margin-bottom:36px}
.sponsors-header__en{
	font-family:var(--font-en);font-weight:700;font-size:12px;letter-spacing:.22em;
	color:var(--color-accent-green-dark);margin:0 0 8px;text-transform:uppercase;
}
.sponsors-header__title{
	margin:0;font-size:clamp(18px,2.3vw,24px);font-weight:800;letter-spacing:.04em;
	color:var(--color-primary);
}
.sponsors-grid{
	list-style:none;margin:0 auto;padding:0;
	display:grid;grid-template-columns:1fr;gap:20px;
	max-width:1080px;
}
.sponsors-grid__item{margin:0;padding:0}
.sponsors-grid__link{
	display:flex;align-items:center;justify-content:center;
	background:#fff;border-radius:12px;
	border:1px solid var(--color-border);
	box-shadow:0 2px 10px rgba(46,42,79,.04);
	padding:20px;aspect-ratio:640 / 400;
	transition:transform .2s,box-shadow .2s;
	color:inherit;
}
a.sponsors-grid__link:hover{
	transform:translateY(-3px);box-shadow:0 8px 24px rgba(46,42,79,.12);opacity:1;
}
.sponsors-grid__link img{
	max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;
}
@media (min-width:600px){
	.sponsors-grid{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:900px){
	.sponsors-grid{grid-template-columns:repeat(3,1fr)}
}

/* ---------------- FOOTER ---------------- */
.site-footer{
	background:var(--color-bg-dark);color:var(--color-text-on-dark);
	border-top:4px solid var(--color-accent-green);padding:36px 20px 28px;text-align:center;
}
.site-footer__social{margin-bottom:20px}
.social-list{list-style:none;margin:0;padding:0;display:flex;justify-content:center;gap:20px;flex-wrap:wrap}
.social-list__link{
	font-size:13px;color:rgba(255,255,255,.85);font-weight:600;letter-spacing:.04em;
	padding:4px 2px;border-bottom:1px solid transparent;transition:border-color .2s,color .2s;
}
.social-list__link:hover{color:var(--color-accent-green);border-bottom-color:var(--color-accent-green);opacity:1}
.social-list__link--note:hover{color:var(--color-accent-pink);border-bottom-color:var(--color-accent-pink)}

.site-footer__menu .footer-menu,
.site-footer__sub .sub-menu-footer{
	list-style:none;margin:14px 0;padding:0;display:flex;justify-content:center;gap:14px 22px;
	flex-wrap:wrap;font-size:13px;
}
.site-footer__menu .footer-menu a{color:rgba(255,255,255,.95)}
.site-footer__menu .footer-menu a:hover{color:var(--color-accent-green);opacity:1}
.site-footer__sub .sub-menu-footer{color:rgba(255,255,255,.6);font-size:12px}
.site-footer__sub .sub-menu-footer a:hover{color:var(--color-accent-yellow);opacity:1}

.site-footer__widgets{
	display:grid;grid-template-columns:1fr;gap:24px;max-width:var(--container);
	margin:24px auto;text-align:left;color:rgba(255,255,255,.85);
}
@media (min-width:700px){.site-footer__widgets{grid-template-columns:1fr 1fr}}

.site-footer__copy{
	color:rgba(255,255,255,.5);font-size:11px;margin-top:24px;
	font-family:var(--font-en);letter-spacing:.08em;
}

/* ---------------- POST / ARCHIVE ---------------- */
/* ⚠️ WordPress は <body> に `single` / `page` クラスを自動付与するため、
   この 2 つのセレクタを含めると body 全体が 1100px に縮小されてしまい、
   固定ヘッダーや全幅ヒーローのレイアウトが崩れる。
   よって .container--post-list のみを対象とする。 */
.container--post-list{
	max-width:var(--container);margin:0 auto;padding:60px 20px;
}
.archive-header{margin-bottom:32px;text-align:center}
.archive-title{
	font-size:clamp(22px,3vw,30px);font-weight:800;color:var(--color-primary);
	display:inline-block;border-bottom:3px solid var(--color-accent-green);padding-bottom:8px;
}
.post-list{display:grid;gap:20px}
.post-list__link{
	display:flex;gap:20px;background:#fff;padding:20px;border-radius:var(--radius);
	border:1px solid var(--color-border);box-shadow:var(--shadow-sm);color:inherit;
	border-left:4px solid var(--color-accent-green);
}
.post-list__link:hover{opacity:1;box-shadow:var(--shadow-md)}
.post-list__thumb{flex:0 0 160px}
.post-list__title{margin:0 0 6px;font-size:16px;color:var(--color-primary)}
.post-list__date{font-size:12px;color:var(--color-muted)}
.post-list__excerpt{font-size:14px;color:var(--color-text);margin-top:6px}

.single__header{margin-bottom:30px;text-align:center}
.single__title{font-size:clamp(22px,3vw,32px);font-weight:800;margin:0 0 10px;color:var(--color-primary)}
.single__meta{color:var(--color-muted);font-size:13px}
.single__thumb{margin-top:20px}
.single__content{line-height:1.9;font-size:16px}
.single__content h2{
	font-size:22px;border-left:5px solid var(--color-accent-green);padding-left:12px;
	margin-top:36px;color:var(--color-primary);
}
.single__content h3{font-size:18px;margin-top:28px;color:var(--color-primary)}
.single__content p{margin:1em 0}
.single__content a{color:var(--color-primary);border-bottom:1px solid var(--color-accent-green)}
.single__content a:hover{color:var(--color-accent-green-dark);opacity:1}
.single__footer{margin-top:40px;border-top:1px solid var(--color-border);padding-top:20px}

/* ---------------- PAGINATION ---------------- */
.pagination,.nav-links{display:flex;justify-content:center;gap:6px;margin:40px 0;flex-wrap:wrap}
.pagination a,.pagination span,.nav-links a,.nav-links span{
	padding:8px 14px;border:1px solid var(--color-border);border-radius:var(--radius);
	font-size:14px;color:var(--color-primary);background:#fff;
}
.pagination a:hover{background:var(--color-bg-alt)}
.pagination .current,.nav-links .current{
	background:var(--color-primary);color:#fff;border-color:var(--color-primary);
}

/* ---------------- WIDGETS ---------------- */
.widget{margin-bottom:28px}
.widget-title{
	font-size:15px;font-weight:700;border-left:4px solid var(--color-accent-green);
	padding-left:10px;margin-bottom:14px;color:var(--color-primary);
}

/* ---------------- SEARCH ---------------- */
.search-form{display:flex;gap:8px}
.search-field{
	flex:1;padding:11px 14px;border:1px solid var(--color-border);border-radius:var(--radius);
	background:#fff;color:var(--color-text);
}
.search-field:focus{outline:2px solid var(--color-accent-green);outline-offset:1px}
.search-submit{
	padding:11px 22px;background:var(--color-primary);color:#fff;border:0;
	border-radius:var(--radius);font-weight:700;letter-spacing:.04em;
}
.search-submit:hover{background:var(--color-primary-dark)}

/* ---------------- UTIL ---------------- */
@media (prefers-reduced-motion: reduce){
	*{transition:none!important;animation:none!important}
}

/* ---------------- コンテンツ内ボタン (.sdd-btn) ---------------- */
/* 活動内容ページの本文中で使用するリンクボタン共通スタイル */
.sdd-btn{
	display:inline-block!important;
	padding:11px 22px!important;
	border-radius:6px!important;
	font-weight:700!important;
	font-size:14px!important;
	line-height:1.4!important;
	letter-spacing:.04em;
	text-decoration:none!important;
	border:none!important;
	border-bottom:none!important;
	white-space:nowrap;
	width:auto!important;
	vertical-align:middle;
	transition:opacity .2s,transform .2s;
	margin-right:10px;
	margin-bottom:8px;
}
.sdd-btn:hover{opacity:.88!important;transform:translateY(-2px);color:inherit!important}
.sdd-btn--instagram{
	background:linear-gradient(135deg,#833AB4 0%,#E1306C 50%,#F77737 100%)!important;
	color:#fff!important;
	box-shadow:0 3px 12px rgba(225,48,108,.30);
}
.sdd-btn--line{
	background:#06C755!important;
	color:#fff!important;
	box-shadow:0 3px 12px rgba(6,199,85,.30);
}
.sdd-btn--primary{
	background:#8FC73E!important;
	color:#2E2A4F!important;
	box-shadow:0 3px 12px rgba(143,199,62,.35);
}

/* ================================================================
   活動内容 / イベント投稿 共通レイアウト（single-activity / single-event）
   ================================================================ */

/* ----
   WordPress が <main> に max-width を付加しても
   全幅セクションを画面端まで広げるためのオーバーライド
---- */
#content,
.site-main{
	max-width:100% !important;
	width:100% !important;
	padding-left:0 !important;
	padding-right:0 !important;
}

/* ----------------------------------------------------------------
   全幅ブレイクアウト：親の max-width を突き破って画面端まで広げる
   「calc(50% - 50vw)」トリック
   ・親が 1100px 中央寄せ → margin-left = 550-765 = -215px → 左端に揃う
   ・親が 100vw 全幅     → margin-left = 765-765 = 0px    → 変化なし
   どちらでも正しく動作する
   ---------------------------------------------------------------- */
.sdd-hero,
.sdd-cta-bar,
.sdd-related{
	width:100vw !important;
	max-width:100vw !important;
	margin-left:calc(50% - 50vw) !important;
	margin-right:calc(50% - 50vw) !important;
}

/* ---- ヒーローバナー ---- */
.sdd-hero{
	position:relative;min-height:300px;
	background:var(--color-primary) center/cover no-repeat;
	display:flex;align-items:flex-end;overflow:hidden;
}
.sdd-hero__bg{
	position:absolute;inset:0;background-size:cover;background-position:center;
}
.sdd-hero__overlay{
	position:absolute;inset:0;
	background:linear-gradient(180deg,rgba(46,42,79,.30) 0%,rgba(46,42,79,.78) 100%);
	z-index:1;
}
.sdd-hero__inner{
	position:relative;z-index:2;
	max-width:var(--container);width:100%;margin:0 auto;
	padding:48px 20px 40px;color:#fff;
}
.sdd-hero__label{
	font-family:var(--font-en);font-size:11px;font-weight:700;letter-spacing:.20em;
	text-transform:uppercase;color:var(--color-accent-green);margin:0 0 10px;
}
.sdd-hero__title{
	font-size:clamp(22px,3.5vw,40px);font-weight:800;margin:0;line-height:1.35;
	letter-spacing:.03em;text-shadow:0 2px 14px rgba(0,0,0,.32);
}

/* ---- 寄付CTAバー ---- */
.sdd-cta-bar{background:var(--color-accent-pink);width:100%}
.sdd-cta-bar__inner{
	max-width:var(--container);margin:0 auto;padding:0 20px;
	display:flex;justify-content:flex-end;
}
.sdd-cta-bar__button{
	display:inline-flex;align-items:center;gap:8px;
	background:rgba(0,0,0,.16);color:#fff;
	font-weight:700;font-size:15px;letter-spacing:.06em;
	padding:14px 28px;transition:background .2s;
}
.sdd-cta-bar__button:hover{background:rgba(0,0,0,.28);opacity:1}

/* ================================================================
   Gutenberg レイアウト制約の上書き
   WordPress 6.x が自動生成する is-layout-constrained の幅制限を解除
   ================================================================ */
.sdd-article__content,
.sdd-article__content .is-layout-constrained,
.sdd-article__content .is-layout-flow,
.sdd-article__content .wp-block-post-content {
	--wp--style--global--content-size: 100% !important;
	--wp--style--global--wide-size: 100% !important;
}
.sdd-article__content .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.sdd-article__content .is-layout-flow > :not(.alignleft):not(.alignright) {
	max-width: 100% !important;
}
/* entry-content 系クラスへの制約も解除 */
.sdd-article__content .entry-content,
.sdd-article__content .wp-block-post-content {
	max-width: 100% !important;
}

/* ---- メインコンテンツラッパー ---- */
.sdd-wrap{max-width:var(--container);margin:0 auto;padding:56px 20px 0}

/* ---- 記事 ---- */
.sdd-article{margin-bottom:64px}

.sdd-article__meta{
	display:flex;align-items:center;gap:12px;
	font-size:13px;color:var(--color-muted);margin-bottom:20px;
	font-family:var(--font-en);letter-spacing:.04em;
}
.sdd-article__cat{
	background:var(--color-accent-yellow);color:var(--color-primary);
	font-size:11px;font-weight:700;padding:4px 10px;border-radius:4px;
	letter-spacing:.04em;
}
.sdd-article__thumb{margin-bottom:32px;border-radius:var(--radius);overflow:hidden}
.sdd-article__thumb img{width:100%;height:auto;display:block}

.sdd-article__content{line-height:1.9;font-size:16px;overflow:hidden}
.sdd-article__content h2{
	font-size:22px;border-left:5px solid var(--color-accent-green);padding-left:12px;
	margin-top:40px;color:var(--color-primary);
}
.sdd-article__content h3{
	font-size:18px;margin-top:28px;color:var(--color-primary);
	border-bottom:2px solid var(--color-border);padding-bottom:6px;
}
.sdd-article__content p{margin:1em 0}
.sdd-article__content a{
	color:var(--color-primary);border-bottom:1px solid var(--color-accent-green);
}
.sdd-article__content a:hover{color:var(--color-accent-green-dark);opacity:1}
/* 記事内の写真（絵文字は除く）：コンテナ幅いっぱいに表示 */
.sdd-article__content img:not(.emoji),
.sdd-article__content figure img:not(.emoji),
.sdd-article__content .wp-block-image img:not(.emoji){
	width:100% !important;
	height:auto !important;
	display:block !important;
	max-width:100% !important;
}
/* 画像ブロックのコンテナも全幅に */
.sdd-article__content .wp-block-image,
.sdd-article__content figure{
	width:100% !important;
	max-width:100% !important;
	margin-left:0 !important;
	margin-right:0 !important;
}
.sdd-article__content img:not(.emoji){border-radius:var(--radius);margin:16px 0}
.sdd-article__content figure{margin:24px 0}
.sdd-article__content figcaption{
	font-size:13px;color:var(--color-muted);text-align:center;margin-top:6px;
}
.sdd-article__content ul,.sdd-article__content ol{padding-left:1.5em;margin:1em 0}
.sdd-article__content li{margin-bottom:.4em}

/* ---- シェアボタン ---- */
.sdd-share{
	margin-top:48px;padding-top:28px;
	border-top:1px solid var(--color-border);
}
.sdd-share__label{
	font-size:13px;font-weight:700;color:var(--color-muted);
	margin:0 0 12px;letter-spacing:.04em;
}
.sdd-share__buttons{display:flex;gap:10px;flex-wrap:wrap}
.sdd-share__btn{
	display:inline-flex;align-items:center;gap:6px;
	padding:9px 18px;border-radius:4px;font-size:13px;font-weight:700;
	letter-spacing:.04em;transition:opacity .2s,transform .2s;color:#fff;
}
.sdd-share__btn:hover{opacity:.88;transform:translateY(-2px)}
.sdd-share__btn--twitter {background:#000}
.sdd-share__btn--facebook{background:#1877F2}
.sdd-share__btn--line    {background:#06C755}

/* ---- 関連記事セクション ---- */
.sdd-related{
	background:var(--color-bg-alt);
	padding:64px 20px;
}
.sdd-related__inner{
	max-width:var(--container);margin:0 auto;
}
.sdd-related__title{
	font-family:var(--font-jp);font-weight:800;font-size:clamp(20px,2.4vw,28px);
	margin:0 0 32px;letter-spacing:.04em;color:var(--color-primary);
	border-left:5px solid var(--color-accent-green);padding-left:14px;
}

@media (min-width:700px){
	.sdd-hero{min-height:360px}
	.sdd-wrap{padding-top:72px}
}

/* ================================================================
   ヒーローオーバーレイ型ヘッダー
   body.has-hero-overlay（single-activity / single-event）のみ適用
   ================================================================ */

/* ① ヘッダーを fixed + 暗幕グラデーションに（白文字が常に読めるよう）
   left:0 / right:0 / top:0 を明示することで、万一祖先要素が縮小されても
   ヘッダー自身は常にビューポートの左端から右端まで張り付く。 */
.has-hero-overlay .site-header{
	position:fixed;top:0;left:0;right:0;width:100%;
	background:linear-gradient(180deg,rgba(0,0,0,.52) 0%,rgba(0,0,0,0) 100%);
	border-bottom:none;box-shadow:none;
	transition:background .35s ease,box-shadow .35s ease,border-color .35s ease;
}

/* ① ロゴ・メニューを白に */
.has-hero-overlay .site-logo__text{color:#fff}
.has-hero-overlay .site-branding .custom-logo-link img{filter:brightness(0) invert(1)}
.has-hero-overlay .primary-menu a{color:rgba(255,255,255,.92)}
.has-hero-overlay .primary-menu a::after{background:rgba(255,255,255,.70)}
.has-hero-overlay .nav-toggle__bar{background:#fff}

/* ② スクロール後（JS が is-solid を付与）→ 白ヘッダーに戻す */
.has-hero-overlay.is-solid .site-header{
	background:#fff;
	border-bottom:1px solid var(--color-border);
	box-shadow:0 1px 0 rgba(0,0,0,.02);
}
.has-hero-overlay.is-solid .site-logo__text{color:var(--color-primary)}
.has-hero-overlay.is-solid .site-branding .custom-logo-link img{filter:none}
.has-hero-overlay.is-solid .primary-menu a{color:var(--color-primary)}
.has-hero-overlay.is-solid .primary-menu a::after{background:var(--color-accent-green)}
.has-hero-overlay.is-solid .nav-toggle__bar{background:var(--color-primary)}

/* ③ fixed ヘッダー分だけヒーロー inner を押し下げてタイトルが隠れないようにする */
.has-hero-overlay .sdd-hero{min-height:480px}
.has-hero-overlay .sdd-hero__inner{padding-top:120px}

/* ④ WordPress 管理バーとの共存 */
.admin-bar.has-hero-overlay .site-header{top:32px}
@media screen and (max-width:782px){
	.admin-bar.has-hero-overlay .site-header{top:46px}
}

/* ⑤ デスクトップでさらに高めに */
@media (min-width:700px){
	.has-hero-overlay .sdd-hero{min-height:520px}
	.has-hero-overlay .sdd-hero__inner{padding-top:140px}
}

/* ⑥ モバイルメニューを開いているときは常に白背景（視認性確保） */
.has-hero-overlay .site-header:has(.primary-nav.is-open){
	background:#fff!important;border-bottom:1px solid var(--color-border)!important;
}
.has-hero-overlay .site-header:has(.primary-nav.is-open) .primary-menu a{color:var(--color-primary)}
.has-hero-overlay .site-header:has(.primary-nav.is-open) .site-logo__text{color:var(--color-primary)}
.has-hero-overlay .site-header:has(.primary-nav.is-open) .nav-toggle__bar{background:var(--color-primary)}

/* ==========================================================
   団体紹介（About SDD）ページ専用スタイル
   ==========================================================
   リファレンスデザイン準拠:
   - ダークヒーロー + 白背景本文
   - 最大幅 720px センター寄せ、装飾は最小限
   - Montserrat（英字見出し）+ Noto Sans JP（本文）
   ========================================================== */

.page-template-about-sdd{background:#fff}

.about-sdd{
	color:#1f2024;
	font-family:"Noto Sans JP","Hiragino Sans","Yu Gothic",sans-serif;
	line-height:1.9;
	letter-spacing:.02em;
	background:#fff;
}

/* 団体紹介ページはデフォルトの page.php の .sdd-hero / .sdd-cta-bar を
   出さない（テンプレートが切り替わっているので不要） */

/* ABOUT US ヒーロー --------------------------------- */
.about-hero{
	background:#1f2024;
	color:#fff;
	padding:200px 24px 140px;
	text-align:center;
	position:relative;
}
.about-hero__inner{
	max-width:960px;
	margin:0 auto;
}
.about-hero__eyebrow{
	font-family:"Montserrat","Noto Sans JP",sans-serif;
	font-size:clamp(40px, 7vw, 72px);
	font-weight:700;
	letter-spacing:.22em;
	line-height:1.1;
	margin:0 0 24px;
	text-indent:.22em;
}
.about-hero__subtitle{
	font-size:clamp(16px, 2vw, 18px);
	font-weight:500;
	letter-spacing:.3em;
	line-height:1.6;
	margin:0 0 40px;
	opacity:.9;
	text-indent:.3em;
}
.about-hero__org{
	font-family:"Montserrat","Noto Sans JP",sans-serif;
	font-size:12px;
	letter-spacing:.26em;
	opacity:.55;
	margin:0;
	text-indent:.26em;
}
.about-hero__sep{
	display:inline-block;
	margin:0 .6em;
	opacity:.6;
}

/* 共通セクション --------------------------------- */
.about-section{
	padding:110px 24px;
	background:transparent;
	border:0;
}
.about-section__inner{
	max-width:720px;
	margin:0 auto;
	text-align:center;
}
.about-section__inner--wide{
	max-width:1080px;
}
.about-section__eyebrow{
	font-family:"Montserrat","Noto Sans JP",sans-serif;
	font-size:clamp(26px, 3.6vw, 36px);
	font-weight:700;
	letter-spacing:.24em;
	margin:0 0 16px;
	text-indent:.24em;
	color:#1f2024;
	line-height:1.3;
}
.about-section__subtitle{
	font-size:13px;
	font-weight:500;
	letter-spacing:.24em;
	color:#8a8a8a;
	margin:0 0 48px;
	text-indent:.24em;
}
.about-section__lead{
	font-size:clamp(20px, 2.6vw, 26px);
	font-weight:700;
	line-height:2.0;
	letter-spacing:.1em;
	margin:0;
	color:#1f2024;
}
.about-section__body{
	font-size:15px;
	line-height:2.05;
	color:#333;
	margin:0;
	text-align:center;
	letter-spacing:.04em;
}
.about-section__prose{
	text-align:left;
	font-size:15px;
	line-height:2.05;
	color:#333;
	letter-spacing:.02em;
}
.about-section__prose p{margin:0 0 1.4em}
.about-section__prose p:last-child{margin-bottom:0}
.about-section__prose strong{
	font-weight:700;
	color:#1f2024;
}

/* VALUE 3カラム --------------------------------- */
.about-values{
	display:grid;
	grid-template-columns:1fr;
	gap:48px;
	margin-top:8px;
	text-align:center;
}
@media (min-width:820px){
	.about-values{
		grid-template-columns:repeat(3, 1fr);
		gap:56px;
	}
}
.about-value{padding:0 8px}
.about-value__title{
	font-size:17px;
	font-weight:700;
	letter-spacing:.1em;
	margin:0 0 18px;
	line-height:1.6;
	color:#1f2024;
}
.about-value__body{
	font-size:14px;
	line-height:2.0;
	color:#444;
	margin:0;
	text-align:left;
}
@media (min-width:820px){
	.about-value__body{text-align:center}
}

/* 代表理事プロフィール --------------------------------- */
.about-rep{margin-top:8px}
.about-rep__photo{
	margin:0 auto 28px;
	width:200px;
	height:200px;
	border-radius:50%;
	overflow:hidden;
	background:#f3f3f3;
}
.about-rep__photo img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}
.about-rep__name{
	font-size:20px;
	font-weight:700;
	letter-spacing:.1em;
	color:#1f2024;
	margin:0 0 32px;
}
.about-rep__bio{
	text-align:left;
	font-size:15px;
	line-height:2.05;
	color:#333;
	max-width:640px;
	margin:0 auto;
	letter-spacing:.02em;
}
.about-rep__bio p{margin:0 0 1.4em}
.about-rep__bio p:last-child{margin-bottom:0}

/* ロゴ紹介 --------------------------------- */
.about-logos{
	display:grid;
	grid-template-columns:1fr;
	gap:56px 40px;
	margin-top:8px;
}
@media (min-width:760px){
	.about-logos{grid-template-columns:repeat(3, 1fr);gap:40px 32px}
}
.logo-card{
	text-align:center;
	padding:0 4px;
}
.logo-card__image{
	width:180px;
	height:180px;
	margin:0 auto 20px;
	display:flex;
	align-items:center;
	justify-content:center;
	background:#fff;
}
.logo-card__image img{
	max-width:100%;
	max-height:100%;
	width:auto;
	height:auto;
	object-fit:contain;
	display:block;
}
.logo-card__label{
	font-family:"Montserrat","Noto Sans JP",sans-serif;
	font-size:11px;
	letter-spacing:.26em;
	color:#9a9a9a;
	margin:0 0 6px;
	text-indent:.26em;
}
.logo-card__name{
	font-size:17px;
	font-weight:700;
	letter-spacing:.08em;
	color:#1f2024;
	margin:0 0 12px;
	line-height:1.5;
}
.logo-card__concept{
	font-size:13.5px;
	font-weight:500;
	color:#1f2024;
	margin:0 0 12px;
	line-height:1.7;
	letter-spacing:.04em;
}
.logo-card__desc{
	font-size:13px;
	line-height:1.95;
	color:#555;
	margin:0;
	text-align:left;
	letter-spacing:.02em;
}

/* スタッフ紹介 --------------------------------- */
.about-staff{
	display:grid;
	grid-template-columns:1fr;
	gap:48px 32px;
	margin-top:8px;
}
@media (min-width:640px){
	.about-staff{grid-template-columns:repeat(2, 1fr);gap:56px 40px}
}
@media (min-width:960px){
	.about-staff{grid-template-columns:repeat(3, 1fr)}
}
.staff-card{
	text-align:center;
	padding:0 4px;
}
.staff-card__photo{
	margin:0 auto 20px;
	width:180px;
	height:180px;
	border-radius:50%;
	overflow:hidden;
	background:#f3f3f3;
	position:relative;
}
.staff-card__photo img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}
.staff-card__photo-placeholder{
	position:absolute;inset:0;
	background:linear-gradient(135deg,#f0f0f0 0%,#e0e0e0 100%);
}
.staff-card__name{
	font-size:16px;
	font-weight:700;
	letter-spacing:.08em;
	color:#1f2024;
	margin:0 0 14px;
	line-height:1.5;
}
.staff-card__comment{
	font-size:13.5px;
	line-height:1.9;
	color:#555;
	margin:0;
	text-align:left;
	letter-spacing:.02em;
}

/* 追加コンテンツ（本文がある場合） */
.about-section--extra{
	padding-top:0;
	padding-bottom:120px;
}

/* モバイル調整 */
@media (max-width:680px){
	.about-hero{padding:140px 20px 96px}
	.about-section{padding:80px 20px}
	.about-section__subtitle{margin-bottom:32px}
	.about-rep__photo{width:170px;height:170px}
	.staff-card__photo{width:160px;height:160px}
	.about-rep__name{margin-bottom:24px}
}

/* 念のため余計な枠線/背景が残らないようにリセット */
.about-sdd .about-section + .about-section{border-top:0}

/* 団体紹介ページ適用時は page.php 由来の .sdd-hero / .sdd-cta-bar を
   表示しないためのフォールバック（テンプレートが違うページでも about-sdd
   クラスが付与されるので安全に隠す） */
.page-template-about-sdd > .sdd-hero,
.page-template-about-sdd > .sdd-cta-bar,
.page-template-about-sdd .sdd-wrap{display:none}

/* ==========================================================
   お問い合わせページ（page-contact.php）専用スタイル
   ========================================================== */

.page-template-contact{background:#fff}

/* CONTACT ヒーロー（グレーグラデ） --------------------------------- */
.contact-hero{
	background:linear-gradient(180deg,#e9e9ec 0%,#c9c9cf 100%);
	color:#fff;
	padding:180px 24px 120px;
	position:relative;
}
.contact-hero__inner{
	max-width:1100px;
	margin:0 auto;
	padding-left:clamp(4px, 4vw, 48px);
}
.contact-hero__title{
	font-family:"Montserrat","Noto Sans JP",sans-serif;
	font-size:clamp(48px, 8vw, 96px);
	font-weight:700;
	letter-spacing:.1em;
	line-height:1.1;
	margin:0 0 18px;
	color:#fff;
}
.contact-hero__subtitle{
	font-size:clamp(14px, 1.6vw, 17px);
	font-weight:500;
	letter-spacing:.18em;
	margin:0;
	color:#fff;
	text-indent:.18em;
}

/* フォームカード --------------------------------- */
.contact-section{
	padding:80px 20px 120px;
	background:#fff;
}
.contact-section__inner{
	max-width:920px;
	margin:0 auto;
}
.contact-card{
	background:#fff;
	padding:clamp(32px, 6vw, 88px) clamp(24px, 5vw, 80px);
	box-shadow:0 1px 4px rgba(0,0,0,.04), 0 20px 48px rgba(0,0,0,.06);
	border-radius:4px;
	margin-top:-140px;
	position:relative;
}

/* 導入テキスト --------------------------------- */
.contact-intro{
	text-align:center;
	margin:0 0 48px;
}
.contact-intro__lead{
	font-size:clamp(18px, 2.4vw, 22px);
	font-weight:700;
	line-height:1.7;
	letter-spacing:.04em;
	margin:0 0 24px;
	color:#1f2024;
}
.contact-intro__note{
	font-size:13.5px;
	line-height:1.95;
	color:#555;
	margin:0;
	letter-spacing:.02em;
}
.contact-intro__content{
	margin-top:16px;
	font-size:13.5px;
	color:#444;
	line-height:1.9;
}
.contact-intro__content a{color:var(--color-primary);text-decoration:underline}

/* アラート（送信結果） --------------------------------- */
.contact-alert{
	padding:18px 22px;
	border-radius:4px;
	margin:0 0 32px;
	border:1px solid transparent;
}
.contact-alert__title{
	margin:0 0 6px;
	font-weight:700;
	font-size:15px;
	line-height:1.5;
}
.contact-alert__body{
	margin:0;
	font-size:13.5px;
	line-height:1.85;
}
.contact-alert--success{
	background:#eef9ef;
	border-color:#b3e0b7;
	color:#1f5a27;
}
.contact-alert--error{
	background:#fdeeee;
	border-color:#f3bcbc;
	color:#8a1f1f;
}

/* フォーム本体 --------------------------------- */
.contact-form{
	margin:0;
	padding:0;
}
.contact-form__honeypot{
	position:absolute;
	left:-9999px;
	top:-9999px;
	width:1px;height:1px;overflow:hidden;
}
.contact-form__row{margin:0 0 26px}
.contact-form__row--agree{text-align:center;margin:32px 0 28px}
.contact-form__row--submit{text-align:center;margin:0}
.contact-form__label{
	display:block;
	font-size:14px;
	font-weight:700;
	letter-spacing:.04em;
	margin:0 0 10px;
	color:#1f2024;
}
.contact-form__required{
	color:#e5184a;
	font-weight:700;
	margin-left:4px;
}
.contact-form__input,
.contact-form__textarea{
	display:block;
	width:100%;
	padding:14px 16px;
	font-size:15px;
	line-height:1.6;
	font-family:inherit;
	color:#1f2024;
	background:#fff;
	border:1px solid #d8d8dd;
	border-radius:4px;
	transition:border-color .15s, box-shadow .15s;
}
.contact-form__input:focus,
.contact-form__textarea:focus{
	outline:none;
	border-color:#1f2024;
	box-shadow:0 0 0 3px rgba(31,32,36,.08);
}
.contact-form__input.is-error,
.contact-form__textarea.is-error{
	border-color:#e5184a;
	background:#fff8f8;
}
.contact-form__input::placeholder,
.contact-form__textarea::placeholder{color:#b5b5bd}
.contact-form__textarea{resize:vertical;min-height:180px}

.contact-form__agree{
	display:inline-flex;
	align-items:flex-start;
	gap:10px;
	cursor:pointer;
	font-size:14px;
	color:#333;
	line-height:1.6;
	user-select:none;
}
.contact-form__agree input[type="checkbox"]{
	margin-top:3px;
	width:16px;height:16px;
	accent-color:#1f2024;
	cursor:pointer;
	flex-shrink:0;
}
.contact-form__agree a{color:var(--color-primary);text-decoration:underline}

.contact-form__submit{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	min-width:260px;
	padding:16px 36px;
	font-size:15px;
	font-weight:700;
	letter-spacing:.08em;
	color:#fff;
	background:#1f2024;
	border:0;
	border-radius:999px;
	cursor:pointer;
	transition:background .15s, transform .1s, box-shadow .15s;
	box-shadow:0 2px 8px rgba(0,0,0,.15);
	font-family:inherit;
}
.contact-form__submit:hover{background:#0e0e14;box-shadow:0 4px 14px rgba(0,0,0,.22)}
.contact-form__submit:active{transform:translateY(1px)}
.contact-form__submit span{font-size:18px;line-height:1;margin-top:-1px}

/* モバイル調整 */
@media (max-width:680px){
	.contact-hero{padding:140px 20px 96px}
	.contact-hero__inner{padding-left:4px}
	.contact-section{padding:60px 16px 96px}
	.contact-card{margin-top:-100px;padding:28px 20px}
	.contact-intro{margin-bottom:32px}
	.contact-form__submit{min-width:0;width:100%}
}

/* 団体紹介ページと同じく、コンタクトページでは page.php 由来の
   sdd-hero / sdd-cta-bar を出さない（template_include で置換されるので
   通常は到達しないが、フォールバックとして非表示にしておく） */
.page-template-contact > .sdd-hero,
.page-template-contact > .sdd-cta-bar{display:none}


/* =============================================================
   活動内容ページ「講師 / 協力いただいている企業・団体」セクション
   - 記事直下に配置されるカード
   - タイトルは template 側で動的に生成
   - 各カード: 画像（左）+ 本文（右）の横並び
   ============================================================= */

.activity-credit {
	margin: clamp(40px, 6vw, 64px) 0 clamp(28px, 4vw, 40px);
	padding: clamp(28px, 4vw, 44px) clamp(20px, 3vw, 38px);
	background: #f5f5f7;
	border: 1px solid #e3e3e8;
	border-radius: 16px;
}
.activity-credit__head {
	text-align: center;
	border-bottom: 1px solid #d8d8de;
	padding-bottom: clamp(14px, 2vw, 20px);
	margin-bottom: clamp(24px, 3vw, 36px);
}
.activity-credit__title {
	font-size: clamp(18px, 2.4vw, 22px);
	font-weight: 700;
	color: #222;
	letter-spacing: .06em;
	margin: 0;
}
.activity-credit__list {
	display: flex;
	flex-direction: column;
	gap: clamp(18px, 2.5vw, 26px);
}
.activity-credit__list + .activity-credit__list {
	margin-top: clamp(20px, 3vw, 28px);
	padding-top: clamp(20px, 3vw, 28px);
	border-top: 1px dashed #d8d8de;
}

/* 共通カード: 画像 left / 本文 right の横並び */
.credit-card {
	display: grid;
	grid-template-columns: 140px 1fr;
	gap: clamp(16px, 2.5vw, 24px);
	align-items: start;
	background: #ffffff;
	border: 1px solid #e6e6ec;
	border-radius: 12px;
	padding: clamp(14px, 2vw, 20px);
}
.credit-card__media {
	width: 140px;
	border-radius: 14px;
	overflow: hidden;
	background: #d6d3e3;
	display: flex;
	align-items: center;
	justify-content: center;
}
/* 講師: 角丸正方形 */
.credit-card__media--lecturer {
	aspect-ratio: 1 / 1;
}
/* 企業・団体: 角丸長方形（高さは講師と同じくらい、横長） */
.credit-card__media--partner {
	aspect-ratio: 16 / 11;
	background: #ffffff;
	border: 1px solid #e6e6ec;
}
.credit-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.credit-card__media--partner img {
	object-fit: contain;
	max-width: 86%;
	max-height: 86%;
	width: auto;
	height: auto;
	margin: auto;
}
.credit-card__placeholder {
	color: #ffffff;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .02em;
	opacity: .85;
	padding: 8px 12px;
	text-align: center;
	line-height: 1.4;
}
.credit-card__media--partner .credit-card__placeholder {
	color: #888;
	opacity: .8;
}
.credit-card__body {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.credit-card__name {
	font-size: 16px;
	font-weight: 700;
	color: #222;
	margin: 0;
	letter-spacing: .02em;
	line-height: 1.4;
}
.credit-card__comment {
	font-size: 13.5px;
	color: #4a4a4a;
	line-height: 1.75;
	margin: 0;
}

/* SNS / 公式サイトボタン */
.credit-card__links {
	list-style: none;
	margin: 4px 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.credit-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	color: #fff;
	text-decoration: none;
	letter-spacing: .02em;
	transition: opacity .15s ease, transform .15s ease;
}
.credit-link:hover {
	opacity: .88;
	transform: translateY(-1px);
}
.credit-link__icon {
	font-size: 14px;
	line-height: 1;
}
.credit-link--web {
	background: #2f6fd1;
}
.credit-link--x {
	background: #111111;
}
.credit-link--ig {
	background: linear-gradient(135deg, #f58529 0%, #dd2a7b 50%, #8134af 100%);
}

@media (max-width: 540px) {
	.credit-card {
		grid-template-columns: 100px 1fr;
		gap: 14px;
		padding: 12px;
	}
	.credit-card__media {
		width: 100px;
		border-radius: 10px;
	}
	.credit-card__name {
		font-size: 15px;
	}
	.credit-card__comment {
		font-size: 12.5px;
		line-height: 1.7;
	}
	.credit-link {
		font-size: 11px;
		padding: 5px 10px;
	}
}
