/*
Theme Name: suzuki-naoya
Theme URI: https://example.com/suzuki-naoya
Author: suzuki-naoya
*/

/* ==========================================================================
   0. Design Tokens
   ========================================================================== */
:root{
  --c-accent:      #00A0FA; /* メインブルー（CTA・強調） */
  --c-accent-deep: #0064B4; /* ディープブルー（左パネル・見出し帯） */
  --c-ink:         #3C3C3C; /* 本文テキスト */
  --c-ink-dim:     #767676;
  --c-bg:          #ffffff;
  --c-card:        #EAF5FC; /* カード薄ブルー背景 */
  --c-card-line:   rgba(0,100,180,.14);
  --c-line:        rgba(60,60,60,.14);
  --c-white:       #ffffff;
  --c-highlight:   #FFF06B; /* マーカー蛍光色 */

  /* フォント：本来は UDShinGoPr6N（モリサワ有償）を指定。
     有償フォント契約が整うまでは BIZ UDPGothic（モリサワ製・無償のUDゴシック、
     Google Fonts配信）で組んでいる。UDShinGoPr6Nと同じくモリサワの
     ユニバーサルデザインフォントのため、無料範囲では最も雰囲気が近い代替。
     契約後は下記2行のフォント名を差し替えるだけでOK。 */
  --f-head: "BIZ UDPGothic", "Noto Sans JP", sans-serif;
  --f-body: "BIZ UDPGothic", "Noto Sans JP", sans-serif;
  --f-num:  "Jost", "Noto Sans JP", sans-serif;

  --header-h: 35px;
  --split-w-left: 70%;
  --split-sidebar-w: 30%;
  --split-pad-t: clamp(64px, 3.84vw, 94px);
  --split-pad-x: clamp(30px, 1.8vw, 44px);
  --split-pad-b: clamp(40px, 2.4vw, 59px);
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ==========================================================================
   1. Reset & Base
   ========================================================================== */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--c-bg); color:var(--c-ink);
  font-family:var(--f-body); font-size:17px; line-height:1.9;
  -webkit-font-smoothing:antialiased; overflow-x:hidden; font-weight:500; text-align: justify;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
button{ font-family:inherit; cursor:pointer; background:none; border:none; }
h1,h2,h3,h4,p,figure{ margin:0; }
.container{ width:100%; max-width:640px; margin-inline:auto; padding-inline:35px;}
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}
:focus-visible{ outline:2px solid var(--c-accent-deep); outline-offset:3px; }

.reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-visible{ opacity:1; transform:translateY(0); }

.marker{ background-image:linear-gradient(transparent 62%, var(--c-highlight) 62%);}

/* ==========================================================================
   2. Type helpers
   ========================================================================== */
.block-head{ margin-bottom:30px; }
.block-head h2{
  font-family:var(--f-head); -webkit-text-stroke: 0.7px;
  font-size:clamp(1.6rem,5vw,1rem); line-height:1.6; letter-spacing:.1em;
  color:var(--c-accent-deep)!important;
}
.block-head p{ margin-top:.9em; color:var(--c-ink-dim); font-size:.9rem; }
.block-head--ink h2{ color:var(--c-ink); }

.banner-head{
  display:flex; align-items:center; gap:15px; background:var(--c-accent-deep); color:#fff;
  padding:10px 0px; margin: 0 -35px 30px -69px;
}
.banner-head::before{ content:""; width:25px; height:16px; background:var(--c-accent); flex:none; }
.banner-head h2{ font-family:var(--f-head); -webkit-text-stroke: 0.7px; }

/* セクション共通：左カラム＝縦ラベル／右カラム＝本文・画像 */
.side-wrap{ display:flex; width:100%; margin-top:-56px; box-sizing:border-box; }
.side-label{
  width:50px; flex-shrink:0;
  display:flex; flex-direction:column; align-items:center;
  box-sizing:border-box;
  margin-left: -30px;
  margin-right: 14px;
}
.side-label-line{ display:block; width:1px; height:85px; background:var(--c-accent); flex-shrink:0; }
.side-label-text{
  writing-mode:vertical-rl; text-orientation:upright; display:block; margin-top:8px;
  font-size:25px; line-height:1; color:var(--c-ink);
  -webkit-text-stroke: 0.8px;
}
.side-content{ flex:1; min-width:0; padding-top:30px; box-sizing:border-box; padding-left: var(--side-pad-l);}

/* ==========================================================================
   3. 固定ヘッダー（SPのみ表示：ハンバーガーのみ／PCは非表示）
   ========================================================================== */
.site-header{
  position:fixed; inset-inline:0; z-index:200; height:var(--header-h);
  display:flex; align-items:center; justify-content:flex-end; padding-inline:16px;
  pointer-events:none;
}
.menu-toggle{
  pointer-events:auto; width:46px; height:36px;
  display:flex; align-items:center; justify-content:center; padding-top: 10px;
}
.menu-toggle img{ width:100%; height:100%; object-fit:contain; transition:opacity .2s; }
.menu-toggle.is-open img{ opacity:0; }

@media (min-width:1024px){
  .site-header{ display:none; }
}

/* ==========================================================================
   4. オフキャンバスメニュー（SP専用）
   ========================================================================== */
.nav-overlay{
  position:fixed; inset:0; z-index:300; display:flex;
  transform:translateX(100%); transition:transform .5s var(--ease);
}
.nav-overlay.is-open{ transform:translateX(0); }
.nav-overlay__visual{
  width:38%; background:var(--c-accent);
  padding:50px 20px 0;
}
.nav-overlay__visual .tagline{ margin-top:80px; width:80%; max-width:170px; }
.nav-overlay__visual .photo{
  margin-top:40px; margin-inline:-20px;
  overflow:hidden; display:block;
}
.nav-overlay__body{ width:62%; background:var(--c-card); padding:100px 26px 30px; overflow-y:auto; position:relative; }
.nav-overlay__close{
  position:absolute; top:16px; right:16px; width:60px; height:60px;
  display:flex; align-items:center; justify-content:center;
}
.nav-overlay__close img{ width:100%; height:100%; object-fit:contain; }
.nav-overlay__list li + li{ margin-top:20px; }
.nav-overlay__list a{ font-family:var(--f-head); font-size:1rem; color:var(--c-ink); display:flex; align-items:center; gap:8px; -webkit-text-stroke: 0.8px; }
.nav-overlay__list a::before{ content:""; width:10px; height:2px; background:var(--c-accent); }
.nav-overlay__divider{ margin:26px 0; border:none; border-top:1px solid #00A0FA; }
.nav-overlay__privacy{ margin-top:26px; font-size:14px; color:var(--c-accent-deep); display:block; }
.eyebrow{ font-size:1rem; color:var(--c-ink-dim); }
.split__nav-box .eyebrow{ color:#fff; display:block; margin-bottom:14px; font-size:clamp(16px, 0.9vw, 19px);}

/* ==========================================================================
   5. SNSアイコン
   ========================================================================== */
.sns-list{ display:flex; gap:20px; flex-wrap:wrap; }
.sns-list a{
  width:35px; height:35px; border-radius:20px; display:block; overflow:hidden;}
.sns-list img{ width:100%; height:100%; display:block; object-fit:cover; }

/* ==========================================================================
   6. Split layout（左固定パネル／右スクロール：PCのみ）
   ========================================================================== */
.split{ position:relative; }
.split__visual{ display:none; }

@media (min-width:1024px){
	.split{ display:flex; align-items:flex-start; }
	.split__visual{
		display:flex; position:sticky; top:0; width:var(--split-w-left); height:100vh; flex:none; overflow:hidden;
	}
	.split__content{ width:calc(100% - var(--split-w-left)); }
}

/* --- サイドバー：名前・タグライン・Contentsナビ（色付き背景・写真の上に重ねる） --- */
.split__sidebar{
	position:absolute; inset:0 auto 0 0; width:var(--split-sidebar-w); z-index:2;
	background:color-mix(in srgb, var(--c-accent-deep) 30%, transparent);
	padding:var(--split-pad-t) var(--split-pad-x) var(--split-pad-b); box-sizing:border-box;
	display:flex; flex-direction:column; color:#fff;
	container-type: inline-size;
}
.split__hero-copy{ position:relative; opacity:1; transition:opacity .6s var(--ease); }
.split__hero-copy.is-hero-hidden{ opacity:0; pointer-events:none; }
.split__hero-copy .reader{ margin: calc(-1 * var(--split-pad-t)) calc(-1 * var(--split-pad-x)) 0; width:calc(100% + 2 * var(--split-pad-x)); max-width:none; }
.split__hero-copy .name{ width:100%; }
.split__hero-copy .tagline{ width:100%; }

.split__nav-box{ position:relative; margin-top:auto; padding:0; width:auto; max-width:none; background:none; -webkit-text-stroke: 0.7px; 
	 font-size:clamp(16px, 7cqw, 30px);
}
.split__nav-box ul li + li{  display:flex; flex-direction:column; gap:16px; }
.split__nav-box a{ font-family:var(--f-head); color:#fff; display:flex; align-items:center; gap:8px; }
.split__nav-box a::before{ content:""; width:10px; height:2px; background:#fff; opacity:.8; }
.split__nav-box a:hover, .split__nav-box a.is-active{ opacity:1; }
.split__nav-box .split__nav-label{
	display:block;
	font-family:var(--f-head); letter-spacing:.05em;
}



/* --- 写真エリア：自動スライドショー（全幅） --- */
.split__photo{ position:absolute; inset:0; overflow:hidden; }
.split__images{ position:absolute; inset:0; }
.split__image{ position:absolute; inset:0; opacity:0; transition:opacity 1.4s var(--ease); background-size:cover; background-position:center; }
.split__image.is-active{ opacity:1; }
.split__scrim{ position:absolute; inset:0; }

.split__sns{ position:absolute; right:24px; bottom:24px; z-index:2; }

.btn-contact{ display:inline-flex; width:100%; max-width:160px; }
.btn-contact img{ width:100%; display:block; }



/* ==========================================================================
   7. Back to top（丸い上向き矢印ボタン）
   ========================================================================== */
.back-to-top{
  width:38px; height:38px; border-radius:50%; border:1px solid var(--c-accent);
  color:var(--c-accent); display:flex; align-items:center; justify-content:center; background:#fff;
}

/* ==========================================================================
   8. Hero（右カラム相当：合成済み1枚画像）
   ========================================================================== */
.s-hero{ position:relative; overflow:hidden; line-height:0; padding-top:var(--header-h); background:#F8FCFF; }
.s-hero__main{ width:100%; display:block; }
@media (min-width:1024px){ .s-hero{ padding-top:30px; background-color: #F8FCFF;} }

/* ==========================================================================
   9. 共通セクションブロック
   ========================================================================== */
.s-block{ padding:56px 0; }
.s-block:first-of-type{ border-top:none; }

/* ---- ごあいさつ ---- */
.greeting-photo{
  margin:24px 0px 24px -35px;
}
.greeting-photo img{ width:100%; height:100%; object-fit:cover; }
.greeting-text p + p{ margin-top:1.3em; }
.greeting-more{ position:relative; }
.greeting-more__extra{ margin-top:1.3em; max-height:0; overflow:hidden; transition:max-height .5s var(--ease); }
.greeting-more.is-expanded .greeting-more__extra{ max-height:2000px; }
.greeting-more__fade{
  position:absolute; left:0; right:0; bottom:0; height:70px;
  background:linear-gradient(transparent, var(--c-bg));
}
.greeting-more.is-expanded .greeting-more__fade{ display:none; }
.greeting-toggle{
  margin-top:18px; display:inline-flex; align-items:center; gap:6px;
  color:var(--c-accent); font-weight:700; font-size:.85rem;
}
.greeting-sign { width: 80px; height: auto; display: block; margin-left: auto; margin-top: 25px;}
/* ---- プロフィール（経歴タイムライン） ---- */
#profile.s-block{ background:var(--c-card); }

/* プロフィール名前＋基本情報 */
.profile-name{ display:flex; align-items:baseline; gap:5px; margin-bottom:20px; flex-wrap:wrap; }
.profile-name h2{
  margin:0; font-size:28px; line-height:1.2; letter-spacing:5px; color:var(--c-ink);
  white-space:nowrap;
  -webkit-text-stroke: 1px
}
.profile-name .name-blue{ color:var(--c-accent-deep); }
.profile-name .profile-kana{ font-size:15px; line-height:1; letter-spacing:1px; color:var(--c-accent); white-space:nowrap; font-weight: 700; }
.profile-text{ font-size:17px; line-height:1.8; color:var(--c-ink); }
.profile-text p{ position:relative; margin:0 0 12px; padding-left:22px; }
.profile-mark{ position:absolute; left:0; top:10px; width:14px; height:3px; background:var(--c-accent); }

.timeline-stage p{ color:var(--c-ink); }
.timeline-stage p + p{ margin-top:1.1em; }
.timeline-stage--card{ background:#fff; border:0.5px solid var(--c-accent); padding:20px; }
.timeline-photos{ display:grid; grid-template-columns:repeat(2,1fr); margin: 18px -35px 18px -69px; }
.timeline-photos figure{ overflow:hidden; }
.timeline-photos figure img{
  width:100%; aspect-ratio:4/3; object-fit:cover; display:block;
  background:linear-gradient(160deg,#cfe9fb,#8fc7ec);
}
.timeline-photos figcaption{
  margin-top:5px; font-size:16px; font-weight:700; color:#00A0FA; text-align: center;
}
.timeline-photos.single figcaption {
  margin-top:5px; font-size:16px; font-weight:700; color:#00A0FA; text-align: left;;
}
.timeline-photos.single{ grid-template-columns:1fr; max-width:280px; margin-inline:0; width:80%; gap:15px; }
.timeline-photos.single figcaption{ padding:0; }

/* ---- 政策・ビジョン ---- */
.stance-portrait{ margin: -15px -35px 15px 0px; }
.stance-portrait img{ width:100%; height:100%; object-fit:cover; }
.stance-card__text{ font-size:17px; color:var(--c-ink); margin-bottom:30px; }
.pillars{ display:flex; flex-direction:column; gap:70px; margin-top:70px; margin-left: -35px;}
.pillar{ position:relative; }
.pillar__head .icon { position: relative; flex-shrink: 0; height: 80px; width: auto; 
  margin-top: -85px; margin-right: 10px; z-index: 1; filter: drop-shadow(0 3px 6px rgba(0, 0, 0, .18));
}
.pillar:nth-child(1) .pillar__head{ background:#C87D1C; }
.pillar:nth-child(2) .pillar__head{ background:#788E42; }
.pillar:nth-child(3) .pillar__head{ background:#D4837C; }

.pillar__body{ padding:22px 18px; }
.pillar__body li:last-child{ padding-bottom:0; }
.pillar__body li:not(:first-child)::before{
	content:""; position:absolute; top:0; left:25%; width:50%; height:1.5px;
}

.pillar:nth-child(1) .pillar__body{ background:#FBF6E0; }
.pillar:nth-child(1) .pillar__body li::before{ background:rgba(200,125,28,.5); }
.pillar:nth-child(2) .pillar__body{ background:#F8F8DF; }
.pillar:nth-child(2) .pillar__body li::before{ background:rgba(120,142,66,.5); }
.pillar:nth-child(3) .pillar__body{ background:#F4EDF2; }
.pillar:nth-child(3) .pillar__body li::before{ background:rgba(212,131,124,.5); }

.pillar__body li { font-size: 17px; padding: 8px 0; position: relative;}
.pillar__body li:last-child::after { display: none;}
.pillar__body li:first-child{ border-top:none; padding-top:0; }
.pillar__body li:last-child{ padding-bottom:0; }

.change-list{ margin-bottom:40px; display:flex; flex-direction:column; gap:18px; margin-left: -35px; }
.change-item{ display:flex; gap:10px; align-items:center; background:var(--c-card); padding:10px; }
.change-badge{ flex:none; width:90px; height:auto; }
.change-item p{ font-size:17px; -webkit-text-stroke: 0.7px; color:var(--c-accent-deep); line-height:1.4; }

/* ---- 活動報告 ---- */
.report-list{ display:grid; background-color: #fff }
.report-card{ display:flex; flex-direction:column; padding:16px; }
.report-card__thumb{ width:100%; height:160px; flex:none; background:linear-gradient(160deg,#cfe9fb,#8fc7ec); overflow:hidden; }
.report-card__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.report-card__date{ font-family:var(--f-num); color:var(--c-ink-dim); }
.report-card__title{ font-family:var(--f-head); font-weight:700; font-size:17px; margin-top:4px; line-height:1.6; color:var(--c-accent-deep); }
.report-card__excerpt{ font-size:16px }
.report-more{
  margin: 28px auto; display: flex; align-items: center; justify-content: center; width: 180px; 
  border: 1px solid var(--c-accent); color: var(--c-accent); padding: 10px; border-radius: 999px; font-weight: 700; font-size: .88rem; 
}

/* ---- 活動報告一覧（アーカイブ） ---- */
#reports.s-block{ background:var(--c-card); }
#reports-archive.s-block,
#page-contact-body.s-block,
#page-privacy-body.s-block{
	background:var(--c-card);
}
.report-list--archive{ grid-template-columns:1fr; }
.report-list--archive .report-card{ flex-direction:column; }
.pagination{ display:flex; justify-content:center; gap:8px; margin-top:36px; }
.pagination a, .pagination span{
  width:36px; height:36px; display:flex; align-items:center; justify-content:center;
  border-radius:50%; font-family:var(--f-num); font-size:.85rem; color:var(--c-ink);
}
.pagination .current{ background:var(--c-accent); color:#fff; }

/* ---- 活動報告 単体記事 ---- */
.report-single__thumb{
  aspect-ratio:16/9; background:linear-gradient(160deg,#cfe9fb,#8fc7ec); margin-bottom:24px; overflow:hidden;
}
.report-single__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.report-single__meta{ font-family:var(--f-num); font-size:.75rem; color:var(--c-accent-deep); }
.report-single h1{ font-family:var(--f-head); font-weight:900; font-size:1.4rem; margin-top:8px; line-height:1.6; }
.report-body{ margin-top:24px; }
.report-body > * + *{ margin-top:1.2em; }

/* ---- 後援会 ---- */
.support-box-t { font-size:17px; margin-top: -20px;}
.support-box p{ font-size:17px;}
.support-actions{margin-top:10px; }
.btn-outline{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  border:1px solid var(--c-accent); color:var(--c-accent); padding:5px 25px; border-radius:999px; font-weight:700; font-size:.86rem;
}
.leaflet-preview{ display:block; margin:20px 0 10px;}
.leaflet-preview img{ width:100%; display:block; }
.leaflet-link{ display:block; text-align:center; font-size:15px; color:#00A0FA; text-decoration:underline; line-height:1.8; }
.support-terms{ margin-top:22px; }
.support-terms h4{ font-size:17px; color:var(--c-ink); }
/* ---- ボランティア募集 ---- */
.volunteer-box{ overflow:hidden; }
.volunteer-box h2{
	font-family:var(--f-head); -webkit-text-stroke: 0.7px; font-size:clamp(1.4rem,5vw,1rem);
	color:var(--c-accent-deep); margin-bottom:16px;
}
.volunteer-box__illust{ float:right; width:45%; max-width:200px; }
.volunteer-box__illust img{ width:100%; display:block; }
.volunteer-box p{ font-size:17px; color:var(--c-ink); }
.volunteer-box p + p{ margin-top:1em; }
.volunteer-box ul{ margin:0 0 0 5px; }
.volunteer-box ul li{ font-size:17px; color:var(--c-ink); line-height:1.9; }

.btn-volunteer{ display:inline-flex; width:100%; max-width:220px; margin-top:15px; clear:both; }
.btn-volunteer img{ width:100%; display:block; }

.support-divider{ margin:36px 0; border:none; border-top:1px dashed var(--c-accent); margin-right: -20px; }

/* ---- LINE公式アカウント ---- */
.line-box h2{
	font-family: var(--f-head);
    -webkit-text-stroke: 0.7px;
    font-size: clamp(1.5rem, 5vw, 1rem);
    line-height: 1.6;
    letter-spacing: .1em;
    color: var(--c-accent-deep);
}
.line-box__bubble{
	position:relative; background:#fff; border:1px solid #06C755; border-radius:22px;
	padding:15px 20px; margin-bottom:34px;
	display:flex; align-items:center; gap:5px; margin-top: 15px;
}
.line-box__bubble p{
	flex:1; margin:0; line-height:1.6; color:#06C755; -webkit-text-stroke: 0.7px;letter-spacing: 0.085em;
}
.line-box__bubble-icon{
	flex:none; width:45px;
}
.line-box__bubble-icon img{ width:100%; display:block; }
.line-box__bubble::before,
.line-box__bubble::after{
	content:""; position:absolute; width:0; height:0; border-style:solid;
}
.line-box__bubble::before{
	left:32px; bottom:-25px;
	border-width:25px 10px 0;
	border-color:#06C755 transparent transparent;
}
.line-box__bubble::after{
	left:32px; bottom:-23px;
	border-width:26px 10px 0;
	border-color:#fff transparent transparent;
}

.btn-line{ display:inline-flex; width:100%; max-width:130px; }
.btn-line img{ width:100%; display:block; }


/* ==========================================================================
   10. フッター
   ========================================================================== */
.site-footer{ background:var(--c-card); padding:40px 0 40px; }
@media (min-width:1024px){ .site-footer{ padding-bottom:40px; } }
.site-footer .office-label{ font-family:var(--f-head); -webkit-text-stroke: 0.7px;
 font-size:16px; color:#00A0FA; }
.site-footer .office-name{ font-family:var(--f-head); -webkit-text-stroke: 1px; font-size:1.1rem; margin-top:4px; color:#0064B4; }
.site-footer .office-address{ margin-top:5px; font-size:17px; line-height:1.4; }
.site-footer .map-frame{ margin-top:20px; width: calc(100% + 70px); aspect-ratio:16/11; border:none; margin-inline: -35px; }
.site-footer .sns-list{ margin-top:22px; margin-right: 70px; }
.site-footer .footer-bottom{ margin-top:30px; padding-top:18px; }
.site-footer .footer-bottom a{ color:var(--c-accent-deep); }
.site-footer .footer-bottom .copyright{ display:block; margin-top:10px; color:#00A0FA; font-size:10px; }

.line-float{
	position:fixed; right:0; bottom:80px; z-index:160;
	display:flex; flex-direction:column; align-items:center;
}
.line-float.is-hidden{ display:none; }
.line-float__close{
	color: #fff;
    font-size: 40px;
    line-height: 1;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .4);
    font-family: Helvetica Neue;
    font-weight: 100;
	transform: translateX(5px);
}
.line-float__box{
	width:65px; background:#06C755; border-radius:20px 0px 0px 20px;
	padding:16px 0px 0px;
	display:flex; flex-direction:column; align-items:center;
}
.line-float__text{
	color:#fff; font-size:1.05rem; line-height:1.3;
	font-family:var(--f-head);
	-webkit-text-stroke: 1px;
	writing-mode: vertical-rl;
    text-orientation: upright;
    letter-spacing: 0.15em;
}
.line-float__icon{
	width:44px; height:44px; border-radius:10px; display:block;
}

/* ==========================================================================
   11. 下層ページ共通（page-hero / entry-content）
   ========================================================================== */
/* 下層ページ（お問い合わせ／プライバシーポリシー／活動報告一覧・詳細）
   共通：右カラム全体をうす色背景に統一する */
.split__content--sub{ background:var(--c-card); }

.page-hero-photo{ aspect-ratio:16/9; overflow:hidden; }
.page-hero-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.page-hero{ padding:calc(var(--header-h) + 34px) 0 8px; }
.page-hero-photo + .page-hero{ padding-top:28px; }
@media (min-width:1024px){
	.page-hero{ padding-top:56px; }
	.page-hero-photo + .page-hero{ padding-top:32px; }
}
.page-hero h1{ font-family:var(--f-head); font-weight:900; font-size:clamp(1.5rem,6vw,1rem); color:var(--c-accent-deep); }
.breadcrumb{ font-size:15px; color:var(--c-ink-dim); }
.breadcrumb a{ color:var(--c-accent-deep); }

.entry-content{ margin-top:6px; }
.entry-content > * + *{ margin-top:1.2em; }
.entry-content h2{ font-family:var(--f-head); font-weight:900; font-size:1.2rem; }
.entry-content h3{ font-family:var(--f-head); font-weight:700; font-size:1.05rem; }

/* 背景白＋padding:15px の汎用クラス（下層ページの各所で使い回す） */
.box-white{ background:#fff; padding:15px; }

.back-top-link{ margin-top:40px; text-align:center; }

/* ==========================================================================
   12. お問い合わせフォーム
   ========================================================================== */
.contact-intro{ color:var(--c-ink); }
.form-row{ margin-top:24px; }
.form-row label{ display:flex; align-items:center; gap:4px; font-weight:700; color:var(--c-accent-deep); margin-bottom:10px; }
.form-row label .req{ color:#E4544B; font-size:1em; font-weight:700; }
.form-row input, .form-row select, .form-row textarea{
  width:100%; padding:13px 14px; border:1px solid var(--c-card-line); background:#fff;
  font-family:var(--f-body); font-size:.92rem; color:var(--c-ink); border-radius:4px;
}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus{ border-color:var(--c-accent); }
.form-row textarea{ min-height:150px; resize:vertical; }
.form-check{ display:flex; gap:8px; font-size:16px; }
.form-check input{ margin-top:4px; }
.form-hp{ display:none; }
.support-contact{ margin:30px 0; border:none; border-top:0.5px dashed var(--c-accent);  }
.contact-terms{ font-size:15px; line-height:1.8;}
.contact-terms p{ margin:0; }
.contact-terms p + p{ margin-top:14px; }
.contact-terms b{ display:block; color:var(--c-ink); }
.contact-terms ul{ list-style:disc; padding-left:1.3em; }

/* サーバー側（PHP）で該当メッセージのみを条件出力するため、
   静的版と異なり display:none / .is-visible のJS制御は行わない。 */
.form-notice{ margin-top:28px; padding:16px 18px; font-size:.88rem; text-align:center; }
.form-notice--success{ background:#fff; border:1px solid #357033; }
.form-notice--error{ background:#fff; border:1px solid #E4A79C; }

.btn-submit{
  width:100%; background:var(--c-accent); color:#fff; padding:16px;
  -webkit-text-stroke: 1px; font-size:1rem; letter-spacing: 0.1em;
}
.btn-submit:disabled{ background:#BFE3FB; }

@media (min-width:900px){
  .contact-layout{ max-width:640px; }
}

.profile-title {
  display: flex;
  align-items: center; 
  gap: 8px; 
  margin-left:  calc((var(--side-pad-l) + var(--container-pad-x)) * -1);
  margin-right: calc(var(--container-pad-x) * -1);
}

.profile-title-mark {
  display: inline-block;
  width:14px; 
  height:3px; 
  background:var(--c-accent);
  flex: none;
}

.footer-bottom {
    display: flex;
    flex-direction: column;
}

.footer-copy {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.footer-copy .back-to-top {
    margin-left: auto;
}

.pillar__head { position: relative; display: flex; align-items: flex-end;   padding: 5px 0px 0px;        color: #fff;
  font-family: var(--f-head); -webkit-text-stroke: 0.8px; font-size: 20px; overflow: visible;         justify-content: flex-start;
}

/* 動画セクション */

/* サイト全体の横余白を管理するコンテナ */
.youtube-container {
  max-width: 1200px;   /* PCで広がりすぎない */
  margin: 50px auto 0; /* 上50px 中央寄せ */
  padding: 0 20px;     /* 左右の安全余白 */
  box-sizing: border-box;
}

/* 動画の比率だけを管理する役 */
.youtube-wrap {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 */
}

/* 中身のYouTube */
.youtube-wrap iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}


/* ============================
   通常表示エリア
============================ */
.video-container {
  max-width: 1200px;
  margin: 50px auto;
  padding: 0 20px;
  box-sizing: border-box;
}

.video-thumb {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  cursor: pointer;
}

.video-thumb iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  pointer-events: none;
}

/* ============================
   モーダル背景
============================ */
.video-modal {
  display: none;               /* ← 初期は必ず非表示 */
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.7);
  z-index: 9999;

  align-items: center;
  justify-content: center;
}

.video-modal.is-active {
  display: flex;
}

/* ============================
   モーダル中身
============================ */
.video-modal-inner {
  position: relative;
  width: 95%;
  max-width: 1200px;
}

.video-modal-wrap {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}

.video-modal-wrap iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* 閉じるボタン */
.video-close {
  position: absolute;
  top: -40px;
  right: 0;
  color: #fff;
  font-size: 32px;
  font-weight: bold;
  cursor: pointer;
  line-height: 1;
}

/* スマホ微調整 */
@media (max-width: 768px) {
  .video-container {
    margin-top: 30px;
  }

  .video-close {
    top: -30px;
    font-size: 28px;
  }
}