:root {
	/* カラー */
	--color-bg-page: #ffffff;
	--color-hero-overlay: #7ac52e;
	--color-hero-overlay-strong: rgba(139, 195, 74, 0.9);
	--color-brand-main: #76bd75;
	--color-text-main: #222222;
	--color-text-hero: #ffffff;
	--color-header-bg: #ffffff;
	--color-header-bg-translucent: rgba(255, 255, 255, 0.94);
	--color-header-border: rgba(255, 255, 255, 0.6);
	--color-header-border-compact: rgba(0, 0, 0, 0.06);
	--color-nav-hover: #7ac52e;

	/* フォント */
	--font-family-base:
		'Noto Sans JP', system-ui, -apple-system, BlinkMacSystemFont, '游ゴシック体', 'Yu Gothic',
		'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;
	--font-size-base: 16px;
	--font-size-nav: 15px;
	--font-size-hero-copy: 40px;
	--line-height-base: 1.7;
	--line-height-hero-copy: 1.8;
	--letter-spacing-normal: 0.04em;
	--letter-spacing-wide: 0.12em;

	/* レイアウト・余白 */
	--layout-max-width: 1000px;
	--page-side-padding: 20px;
	--header-side-padding: 50px;
	--space-xs: 4px;
	--space-sm: 8px;
	--space-md: 15px;
	--space-lg: 20px;
	--space-xl: 40px;
	--space-xxl: 64px;

	/* ヘッダー関連 */
	--header-height-desktop: 80px;
	--header-height-desktop-compact: 64px;
	--header-height-mobile: 64px;
	--header-radius: 30px;
	--header-top-offset-desktop: 0px;
	--header-top-offset-mobile: 0px;
	--header-blur: 16px;

	/* トランジション・アニメーション */
	--transition-fast: 150ms ease-out;
	--transition-normal: 220ms cubic-bezier(0.25, 0.1, 0.25, 1);
	--transition-slow: 380ms cubic-bezier(0.19, 1, 0.22, 1);

	/* Z-index */
	--z-header: 100;
	--z-header-overlay: 90;
	--z-hero-overlay: -1;
}

/* ユーティリティ：表示切り替え */
.sp-only {
	display: none;
}
@media (max-width: 767px) {
	.sp-only {
		display: inline;
	}
}

/* ベース */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body.pa-body {
	margin: 0;
	padding: 0;
	background-color: var(--color-bg-page);
	color: var(--color-text-main);
	font-family: var(--font-family-base);
	font-size: var(--font-size-base);
	line-height: var(--line-height-base);
	letter-spacing: var(--letter-spacing-normal);
}

.pa-body--no-scroll {
	overflow: hidden;
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

.pa-main {
	min-height: 100vh;
}

/* ===== マーキー：右→左 1行スライダー ===== */

.pa-marquee {
	overflow: hidden;
}

/* はみ出しを隠してアニメーション基点を作る */
.pa-marquee__row {
	overflow: hidden;
	line-height: 0;
}

/* トラック：オリジナル＋複製セットを横並びにする */
/* width: max-content が必須 → translateX の基準がビューポート幅にならないよう固定 */
.pa-marquee__track {
	display: flex;
	width: max-content;
	will-change: transform;
	animation: pa-marquee-scroll 80s linear infinite;
	/* JSがセット幅をセットしてから再生するため初期はpause */
	animation-play-state: paused;
}

/* セット：padding-rightでセット末尾の間隔を揃えシームレスループを実現 */
.pa-marquee__set {
	display: flex;
	flex-shrink: 0;
	gap: 6px;
	padding-right: 6px;
}

.pa-marquee__set img {
	width: 310px;
	height: 215px;
	object-fit: cover;
	display: block;
	flex-shrink: 0;
}

/* JSがセット実測幅を --marquee-set-width にセット。フォールバックは 50% */
@keyframes pa-marquee-scroll {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(calc(-1 * var(--marquee-set-width, 50%)));
	}
}

/* モーション軽減設定を尊重 */
@media (prefers-reduced-motion: reduce) {
	.pa-marquee__track {
		animation-play-state: paused !important;
	}
}

/* モバイル */
@media (max-width: 767px) {
	.pa-marquee__set {
		gap: 4px;
		padding-right: 4px;
	}

	.pa-marquee__set img {
		width: 220px;
		height: 153px;
	}
}

/* ヘッダー */

.pa-header {
	position: fixed;
	top: var(--header-top-offset-desktop);
	left: 0;
	right: 0;
	z-index: var(--z-header);
	padding-inline: var(--header-side-padding);
	padding-top: var(--space-md);
}

.pa-header__inner {
	height: var(--header-height-desktop);
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-inline: var(--space-lg);
	border-radius: var(--header-radius);
	background-color: var(--color-header-bg-translucent);
	border: 1px solid var(--color-header-border);
	box-shadow: 0 18px 60px rgba(0, 0, 0, 0.22);
	backdrop-filter: blur(var(--header-blur));
	transition:
		height var(--transition-normal),
		background-color var(--transition-normal),
		box-shadow var(--transition-normal),
		border-color var(--transition-normal),
		padding-inline var(--transition-normal);
}

/* ヒーロー上に重なっているとき */

.pa-header--on-hero .pa-header__inner {
	background-color: var(--color-header-bg-translucent);
	color: var(--color-text-main);
}

.pa-header--on-hero .pa-header__nav-link {
	color: var(--color-text-main);
}

/* ヒーローを抜けた後のコンパクト＋すりガラスヘッダー */

.pa-header--compact .pa-header__inner {
	height: var(--header-height-desktop-compact);
	background-color: rgba(255, 255, 255, 0.72);
	-webkit-backdrop-filter: blur(20px) saturate(180%);
	backdrop-filter: blur(20px) saturate(180%);
	border-color: rgba(255, 255, 255, 0.4);
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

/* 最上部に戻ったとき（ソリッド白・ブラーなし） */

.pa-header--at-top .pa-header__inner {
	background-color: var(--color-header-bg);
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	border-color: var(--color-header-border-compact);
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
}

/* ブランド */

.pa-header__brand {
	display: inline-flex;
	align-items: center;
	gap: var(--space-sm);
	text-decoration: none;
	color: inherit;
}

.pa-header__logo {
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	color: #ffffff;
}

.pa-header__logo-image {
	object-fit: contain;
	margin: 0 auto;
	max-height: 36px;
}

/* ナビ（PC） */

.pa-header__nav {
	display: flex;
	align-items: center;
}

.pa-header__nav-list {
	display: flex;
	align-items: center;
	gap: var(--space-lg);
	margin: 0;
	padding: 0;
	list-style: none;
}

.pa-header__nav-item {
	position: relative;
}

.pa-header__nav-link {
	position: relative;
	display: inline-flex;
	align-items: center;
	padding-block: 4px;
	font-size: var(--font-size-nav);
	font-weight: 500;
	color: inherit;
	text-decoration: none;
	letter-spacing: var(--letter-spacing-wide);
	transition:
		color var(--transition-fast),
		letter-spacing var(--transition-fast);
}

.pa-header__nav-link::after {
	content: '';
	position: absolute;
	left: 50%;
	bottom: -6px;
	width: 100%;
	height: 2px;
	transform: translateX(-50%) scaleX(0);
	transform-origin: center;
	background: linear-gradient(to right, var(--color-brand-main), #ffffff);
	transition: transform var(--transition-normal);
}

.pa-header__nav-link:hover {
	color: var(--color-nav-hover);
	letter-spacing: 0.16em;
}

.pa-header__nav-link:hover::after {
	transform: translateX(-50%) scaleX(1);
}

/* モバイル用トグルボタン */

.pa-header__toggle {
	display: none;
	position: relative;
	width: 32px;
	height: 24px;
	padding: 0;
	border: none;
	background: none;
	cursor: pointer;
}

.pa-header__toggle-bar {
	position: absolute;
	left: 0;
	right: 0;
	height: 2px;
	background-color: var(--color-brand-main);
	border-radius: 999px;
	transition:
		transform var(--transition-normal),
		top var(--transition-normal),
		bottom var(--transition-normal),
		opacity var(--transition-fast);
}

.pa-header__toggle-bar:first-child {
	top: 5px;
}

.pa-header__toggle-bar:last-child {
	bottom: 5px;
}

/* メニューオープン時のハンバーガー変形 */

.pa-header--menu-open .pa-header__toggle-bar:first-child {
	top: 50%;
	transform: translateY(-50%) rotate(45deg);
}

.pa-header--menu-open .pa-header__toggle-bar:last-child {
	bottom: 50%;
	transform: translateY(50%) rotate(-45deg);
}

/* モバイルオーバーレイナビ */

.pa-header__nav--overlay {
	display: none;
	position: fixed;
	inset: 0;
	z-index: var(--z-header-overlay);
	align-items: stretch;
	justify-content: flex-end;
}

.pa-header__nav--overlay-inner {
	position: relative;
	width: 100%;
	max-width: var(--layout-max-width);
	padding-inline: var(--page-side-padding);
	padding-top: 96px;
}

.pa-header__nav--overlay .pa-header__nav-list {
	flex-direction: column;
	align-items: flex-start;
	gap: 0;
}

.pa-header__nav--overlay .pa-header__nav-link {
	width: 100%;
	padding: 14px 4px;
	font-size: 16px;
	color: var(--color-text-main);
	text-align: left;
	text-shadow: none;
}

.pa-header__nav--overlay .pa-header__nav-link::after {
	left: 0;
	bottom: 0;
	transform: scaleX(0);
	transform-origin: left;
}

/* オーバーレイオープン時（is-openクラスで直接制御） */

.pa-header__nav--overlay.is-open {
	display: flex;
}

/* ─── ヒーローセクション ─── */

.hero {
	position: relative;
	min-height: 90vh;
	/* 動画フェードアウト時の差し色ベース */
	background-color: #778692;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-text-hero);
	overflow: hidden;
	margin-top: calc(-1 * (var(--header-height-desktop) + var(--space-md)));
	padding-top: calc(var(--header-height-desktop) + var(--space-md));
}

/* 左側を薄くするグラデーションオーバーレイ（背景の青に同系色） */
.hero::before {
	content: '';
	position: absolute;
	inset: 0;
	/* 動画(z:0)より上、テキスト(z:2)より下 */
	z-index: 1;
	background: linear-gradient(
		105deg,
		rgba(0, 80, 160, 0.42) 0%,
		rgba(0, 80, 160, 0.18) 55%,
		rgba(0, 80, 160, 0.04) 100%
	);
	pointer-events: none;
}

/* 動画背景：全面カバー
 * z-index: 0 にして hero の background-color（暗色）より前面に出す
 * （旧: var(--z-hero-overlay) = -1 は background-color に隠れるため廃止） */
.hero__video {
	position: absolute;
	inset: 0;
	z-index: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* 下端を基準に表示し、下側が見切れないようにする */
	object-position: center bottom;
	/* ぼかしフェード：blur と opacity を同時にアニメーション */
	filter: blur(0px);
	transition:
		opacity 0.5s ease,
		filter 0.5s ease;
}

/* テキストエリア：グラデーションオーバーレイより前面 */
.hero__inner {
	position: relative;
	z-index: 2;
	max-width: var(--layout-max-width);
	margin-inline: auto;
	padding-inline: var(--page-side-padding);
}

.hero__copy {
	margin: 0;
	font-size: var(--font-size-hero-copy);
	line-height: var(--line-height-hero-copy);
	letter-spacing: var(--letter-spacing-wide);
	font-weight: 100;
}

/* キーワード強調 */
.hero__copy b {
	font-weight: 900;
}

/* 各行：霧の中から文字が浮かび上がる（アンニュイ演出） */
.hero__copy-line {
	display: block;
	/* animation-fill-mode: both で遅延中は初期状態（opacity:0）を維持 */
	animation: heroLineFade 4s cubic-bezier(0.4, 0, 0.2, 1) both;
}

/* 各行の時間差：行間にたっぷり間を取ることで詩的な余韻を生む */
.hero__copy-line:nth-child(1) {
	animation-delay: 0.6s;
}
.hero__copy-line:nth-child(2) {
	animation-delay: 2.2s;
}

/* ─── ヒーローアニメーション keyframes ─── */

/*
 * アンニュイ演出：文字が霧の中からゆっくり呼吸するように浮かび上がる
 * GPU合成のみで完結する opacity / filter / transform だけを使い
 * letter-spacing のようなレイアウト再計算を伴うプロパティは使わない
 */
@keyframes heroLineFade {
	0% {
		opacity: 0;
		filter: blur(8px);
		transform: translateY(8px);
	}
	60% {
		filter: blur(1px);
	}
	100% {
		opacity: 1;
		filter: blur(0px);
		transform: translateY(0px);
	}
}

/* アクセシビリティ：動きを減らす設定を尊重 */
@media (prefers-reduced-motion: reduce) {
	.hero__video {
		transition: none;
	}

	.hero__copy-line {
		animation: none;
		opacity: 1;
		letter-spacing: var(--letter-spacing-wide);
		filter: none;
	}
}

/* セクションダミー */

/* .section 自体は padding-inline を持たない → 背景色・背景画像がブラウザ幅100%になる */
.section__inner {
	max-width: var(--layout-max-width);
	margin: 0 auto;
	padding-inline: var(--page-side-padding);
	padding-block: var(--space-xxl);
}

/* 汎用テキストポイント */

.text-point {
	text-align: center;
	line-height: 2.5;
	margin: 50px 0 0;
	font-weight: 300;
}

/* ─── コンセプトセクション ─── */

.section--concept {
	position: relative;
	background-color: var(--color-brand-main);
	color: #ffffff;
}

/* section__inner の上下余白を上書き */
.section--concept .section__inner {
	position: relative;
	z-index: 1; /* ::after 擬似要素より前面 */
	padding-top: 80px;
	padding-bottom: 0; /* 画像をセクション下端まで届かせる */
	display: flex;
	flex-direction: column;
	gap: 52px;
}

/*
 * セクション下端に白い擬似要素を重ねて背景を二分割に見せる
 * height = 画像高さ（aspect-ratio 4/3 × flex 3等分）の半分
 *        ≒ clamp(32px, 12.5vw - 9px, 115px)
 * モバイル（gap:10px）〜デスクトップ（gap:20px, max 1000px）を一式でカバー
 */
.section--concept::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: clamp(32px, calc(12.5vw - 9px), 115px);
	background-color: var(--color-bg-page);
	z-index: 0;
}

/* テキストブロック：スクロールリビール初期状態 */
.concept__text[data-reveal] {
	opacity: 0;
	transform: translateY(28px);
	transition:
		opacity 900ms cubic-bezier(0.19, 1, 0.22, 1) 150ms,
		transform 900ms cubic-bezier(0.19, 1, 0.22, 1) 150ms;
}

.concept__text[data-reveal].is-visible {
	opacity: 1;
	transform: translateY(0);
}

/* 見出し */
.concept__heading {
	margin: 0 0 40px;
	font-size: 36px;
	font-weight: 100;
	line-height: 1.7;
	letter-spacing: 0.08em;
	text-align: center;
}

.concept__heading b {
	font-weight: 900;
}

.concept__heading span {
	display: block;
}

/* 本文 */
.concept__desc {
	margin: 0;
	font-size: 18px;
	font-weight: 300;
	line-height: 2.6;
	text-align: center;
	letter-spacing: 0.04em;
}

/* 写真グループ：各写真を左から時間差でフェードイン */
.concept__photos[data-reveal] .concept__photo {
	opacity: 0;
	transform: translateY(28px);
	transition:
		opacity 700ms cubic-bezier(0.19, 1, 0.22, 1),
		transform 700ms cubic-bezier(0.19, 1, 0.22, 1);
}

/* is-visible 付与後：左から順に時間差ディレイ */
.concept__photos[data-reveal].is-visible .concept__photo:nth-child(1) {
	transition-delay: 100ms;
}
.concept__photos[data-reveal].is-visible .concept__photo:nth-child(2) {
	transition-delay: 280ms;
}
.concept__photos[data-reveal].is-visible .concept__photo:nth-child(3) {
	transition-delay: 460ms;
}

.concept__photos[data-reveal].is-visible .concept__photo {
	opacity: 1;
	transform: translateY(0);
}

/* 3枚横並びグリッド */
.concept__photos {
	display: flex;
	gap: 20px;
	width: 100%;
}

.concept__photo {
	flex: 1;
	margin: 0;
	min-width: 0;
}

.concept__photo img {
	width: 100%;
	height: auto;
	border-radius: 15px;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

/* ─── コンセプト モバイル（767px以下） ─── */

@media (max-width: 767px) {
	.section--concept .section__inner {
		padding-top: 52px;
		padding-bottom: 0;
		gap: 36px;
	}

	.concept__heading {
		/* 最長行8文字 × (1em + letter-spacing 0.08em) が折り返さない最大サイズを逆算 */
		font-size: clamp(22px, calc((100vw - 40px) / 8.64), 36px);
		margin-bottom: 24px;
	}

	.concept__desc {
		font-size: 17px;
		line-height: 2.2;
	}

	/* 3枚横並び維持・隙間を縮小 */
	.concept__photos {
		gap: 10px;
	}
}

/* デバイス別表示制御 */

.notpc {
	display: none;
}

/* レスポンシブ */

@media (max-width: 767px) {
	.pa-header {
		top: var(--header-top-offset-mobile);
		/* モバイルはPC用の50px余白を上書きして20pxに戻す */
		padding-inline: var(--page-side-padding);
		padding-top: var(--space-sm);
	}

	.pa-header__inner {
		height: var(--header-height-mobile);
		padding-inline: var(--space-md);
		border-radius: 12px;
	}

	.pa-header--compact .pa-header__inner {
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
	}

	/* ブランド：min-width: 0 でflexが内容サイズ以下に縮めるよう設定 */
	.pa-header__brand {
		min-width: 0;
		overflow: hidden;
		margin-right: var(--space-md);
	}

	.pa-header__nav {
		display: none;
	}

	/* トグル：縮小させない */
	.pa-header__toggle {
		display: inline-block;
		flex-shrink: 0;
	}

	/* モバイルオーバーレイナビ：右から左へ広がるパネル */

	.pa-header__nav--overlay {
		display: flex;
		opacity: 0;
		pointer-events: none;
		/* ブランド色の薄いオーバーレイ */
		background: rgba(139, 195, 74, 0);
		backdrop-filter: blur(0);
		transition:
			opacity var(--transition-normal),
			background var(--transition-normal),
			backdrop-filter var(--transition-normal);
	}

	.pa-header__nav--overlay-inner {
		height: 100%;
		max-width: 300px;
		min-width: 240px;
		margin: 0;
		padding-inline: 24px;
		/* ヘッダー高さ + padding-top + 余裕分 */
		padding-top: calc(var(--header-height-mobile) + var(--space-sm) + var(--space-lg));
		padding-bottom: 40px;
		/* 白地フロストガラス */
		background: rgba(255, 255, 255, 0.97);
		border-left: 1px solid rgba(139, 195, 74, 0.18);
		border-radius: 28px 0 0 28px;
		box-shadow:
			-8px 0 40px rgba(139, 195, 74, 0.14),
			0 24px 60px rgba(0, 0, 0, 0.18);
		transform: translateX(100%);
		transition: transform var(--transition-slow);
		overflow-y: auto;
	}

	.pa-header__nav--overlay .pa-header__nav-list {
		width: 100%;
		gap: 0;
	}

	.pa-header__nav--overlay .pa-header__nav-item {
		width: 100%;
		/* 各項目の区切り線 */
		border-bottom: 1px solid rgba(139, 195, 74, 0.1);
	}

	.pa-header__nav--overlay .pa-header__nav-item:first-child {
		border-top: 1px solid rgba(139, 195, 74, 0.1);
	}

	.pa-header__nav--overlay .pa-header__nav-link {
		position: relative;
		display: flex;
		align-items: center;
		gap: 14px;
		padding: 18px 8px 18px 4px;
		font-size: 15px;
		font-weight: 500;
		letter-spacing: 0.14em;
		color: var(--color-text-main);
		text-align: left;
		text-shadow: none;
		border-radius: 0;
		background: none;
		overflow: hidden;
		transition:
			color var(--transition-fast),
			background var(--transition-fast);
	}

	/* 左端の縦ライン */
	.pa-header__nav--overlay .pa-header__nav-link::before {
		content: '';
		flex-shrink: 0;
		width: 3px;
		height: 22px;
		border-radius: 999px;
		background: linear-gradient(to bottom, var(--color-brand-main), rgba(139, 195, 74, 0.3));
	}

	/* ホバー時の背景グロー */
	.pa-header__nav--overlay .pa-header__nav-link::after {
		content: '';
		position: absolute;
		inset: 0;
		background: linear-gradient(90deg, rgba(139, 195, 74, 0.08), transparent);
		transform: scaleX(0);
		transform-origin: left;
		transition: transform var(--transition-normal);
	}

	.pa-header__nav--overlay .pa-header__nav-link:hover {
		color: var(--color-brand-main);
	}

	.pa-header__nav--overlay .pa-header__nav-link:hover::after {
		transform: scaleX(1);
	}

	/* 現在ページのモバイルナビリンク */
	.pa-header__nav--overlay .pa-header__nav-link[aria-current='page'] {
		color: var(--color-brand-main);
		font-weight: 700;
		/* 左端バーを背景ごとハイライト */
		background: linear-gradient(90deg, rgba(139, 195, 74, 0.12) 0%, transparent 80%);
	}

	/* 左端の縦バーを太く・より鮮明に */
	.pa-header__nav--overlay .pa-header__nav-link[aria-current='page']::before {
		width: 4px;
		height: 28px;
		background: var(--color-brand-main);
		box-shadow: 0 0 8px rgba(139, 195, 74, 0.5);
	}

	.pa-header__nav--overlay.is-open {
		opacity: 1;
		pointer-events: auto;
		/* ブランドグリーンの薄いオーバーレイ */
		background: rgba(139, 195, 74, 0.22);
		backdrop-filter: blur(12px);
	}

	.pa-header__nav--overlay.is-open .pa-header__nav--overlay-inner {
		transform: translateX(0);
	}

	.hero {
		min-height: 90vh;
		align-items: center;
		margin-top: calc(-1 * (var(--header-height-mobile) + var(--space-sm)));
		padding-top: calc(var(--header-height-mobile) + var(--space-sm));
	}

	.hero__copy {
		/* 最長行8文字 × (1em + letter-spacing 0.12em) が折り返さない最大サイズを逆算 */
		font-size: clamp(26px, calc((100vw - 40px) / 9.2), 40px);
		line-height: 1.7;
		text-align: center;
	}

	.hero__scroll {
		bottom: 20px;
	}

	.text-point {
		margin: 32px 0 0;
		line-height: 2;
	}

	.hero__copy-line:nth-child(2) {
		margin-top: var(--space-sm);
	}

	/* スマホではnotspを非表示・notpcを表示 */

	.notsp {
		display: none;
	}

	.notpc {
		display: inline;
	}

	/* セクション内インナーの上下余白をスマホ用に縮小 */
	.section__inner {
		padding-block: var(--space-xl);
	}
}

/* ─── ご挨拶セクション ─── */

.section--greeting {
	margin-block: 80px;
	background-color: var(--color-brand-main);
	color: #ffffff;
}

/* タイトルの文字色・両脇ラインを白に上書き */
.section--greeting .section__title {
	color: #ffffff;

	&::before,
	&::after {
		background: #ffffff;
	}
}

/* テキスト＋人物画像 横並びレイアウト */
.greeting__body {
	display: flex;
	align-items: flex-end;
	gap: 60px;
	margin-bottom: 35px;
}

/* テキストブロック：スクロールリビール初期状態 */
.greeting__text[data-reveal] {
	opacity: 0;
	transform: translateY(28px);
	transition:
		opacity 900ms cubic-bezier(0.19, 1, 0.22, 1) 150ms,
		transform 900ms cubic-bezier(0.19, 1, 0.22, 1) 150ms;
}

.greeting__text[data-reveal].is-visible {
	opacity: 1;
	transform: translateY(0);
}

.greeting__text {
	flex: 1;
	min-width: 0;
}

.greeting__desc {
	margin: 0 0 48px;
	font-size: 16px;
	font-weight: 400;
	line-height: 2.4;
	letter-spacing: 0.04em;
}

.greeting__name {
	margin: 0;
}

.greeting__position {
	display: block;
	font-size: 20px;
	font-weight: 700;
	letter-spacing: 0.06em;
	margin-bottom: -9px;
}

.greeting__ceo {
	display: block;
	font-size: 30px;
	font-weight: 700;
	letter-spacing: 0.12em;
}

/* 人物画像：テキストより200ms遅れてフェードイン（ベース150ms + 差分200ms = 350ms） */
.greeting__figure[data-reveal] {
	opacity: 0;
	transform: translateY(28px);
	transition:
		opacity 900ms cubic-bezier(0.19, 1, 0.22, 1) 350ms,
		transform 900ms cubic-bezier(0.19, 1, 0.22, 1) 350ms;
}

.greeting__figure[data-reveal].is-visible {
	opacity: 1;
	transform: translateY(0);
}

.greeting__figure {
	flex-shrink: 0;
	width: 300px;
	margin: 0;
}

.greeting__figure img {
	width: 100%;
	height: auto;
	display: block;
}

/* ─── ご挨拶 モバイル（767px以下） ─── */

@media (max-width: 767px) {
	.greeting__body {
		flex-direction: column;
		align-items: center;
		gap: 40px;
	}

	.greeting__desc {
		font-size: 15px;
		line-height: 2.2;
		margin-bottom: 36px;
	}

	.greeting__ceo {
		font-size: 24px;
	}

	.greeting__figure {
		width: 65%;
		max-width: 240px;
	}
}

/* ─── 新着情報セクション ─── */

.section--news .section__inner {
	max-width: 800px;
}

/* ─── 新着情報リスト ─── */

.news-list {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
}

.news-list__item {
	display: flex;
	align-items: center;
	gap: 24px;
	padding: 14px 0;

	/* 1・2行目の下にボーダー（最終行は非表示） */
	border-bottom: 1px solid #87ceeb;

	&:last-child {
		border-bottom: none;
	}
}

.news-list__date {
	flex-shrink: 0;
	width: 100px;
	color: var(--color-text-main);
	letter-spacing: 0.04em;
}

.news-list__title {
	color: var(--color-text-main);
	text-decoration: none;
}

@media (max-width: 767px) {
	/* スマホ：日付とタイトルを縦並びに */
	.news-list__item {
		flex-direction: column;
		align-items: flex-start;
		gap: 4px;
	}
}

@media (min-width: 768px) and (max-width: 1023px) {
	.hero__copy {
		font-size: 34px;
	}
}

@media (min-width: 1024px) {
	.hero__copy {
		font-size: 60px;
	}
}

/* ─── セクション共通タイトル（両脇緑ライン） ─── */

.section__title {
	display: flex;
	align-items: center;
	gap: 20px;
	font-size: 45px;
	font-weight: 700;
	letter-spacing: var(--letter-spacing-wide);
	color: var(--color-brand-main);

	&::before,
	&::after {
		content: '';
		flex: 1;
		height: 2px;
		background: var(--color-brand-main);
	}
}

/* スクロールリビール */
.section__title[data-reveal] {
	opacity: 0;
	transform: translateY(24px);
	transition:
		opacity 700ms cubic-bezier(0.19, 1, 0.22, 1) 150ms,
		transform 700ms cubic-bezier(0.19, 1, 0.22, 1) 150ms;
}

.section__title[data-reveal].is-visible {
	opacity: 1;
	transform: translateY(0);
}

/* ─── 会社案内セクション ─── */

.section--company {
	background: #ffffff;
}

/* テーブル全体 */
.company-table {
	max-width: 500px;
	margin: 0 auto;
	font-size: 18px;
}

/* 各行：横並び（ボーダーなし） */
.company-table__row {
	display: flex;
	align-items: baseline;
	gap: 40px;
	padding-block: 20px;
}

/* ラベル列：固定幅・太字 */
.company-table__term {
	flex-shrink: 0;
	width: 4em;
	font-weight: 700;
	color: var(--color-text-main);
}

/* 値列 */
.company-table__desc {
	margin: 0;
	color: var(--color-text-main);
	display: flex;
	align-items: center;
	gap: 6px;
	flex-wrap: wrap;
}

/* マップピンリンク */
.company-table__maplink {
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
	transition: opacity 0.2s;

	&:hover {
		opacity: 0.7;
	}

	& img {
		display: block;
		width: 20px;
		height: 20px;
	}
}

/* スクロールリビール */
.company-table[data-reveal] {
	opacity: 0;
	transform: translateY(30px);
	transition:
		opacity 700ms cubic-bezier(0.19, 1, 0.22, 1) 150ms,
		transform 700ms cubic-bezier(0.19, 1, 0.22, 1) 150ms;
}

.company-table[data-reveal].is-visible {
	opacity: 1;
	transform: translateY(0);
}

/* ─── 採用情報セクション ─── */

.section--recruit {
	background: #ffffff;
}

/* 上下余白を縮小（バナーのみの表示） */
.section--recruit .section__inner {
	padding-block: var(--space-xl);
}

/* スクロールリビール */
.section--recruit picture[data-reveal] {
	display: block;
	overflow: hidden;
	border-radius: 8px;
	opacity: 0;
	transform: translateY(28px);
	transition:
		opacity 700ms cubic-bezier(0.19, 1, 0.22, 1) 150ms,
		transform 700ms cubic-bezier(0.19, 1, 0.22, 1) 150ms;

	& img {
		width: 100%;
		height: auto;
	}
}

.section--recruit picture[data-reveal].is-visible {
	opacity: 1;
	transform: translateY(0);
}

/* バナーリンク本体 */
.recruit-banner {
	display: block;
	overflow: hidden;
	border-radius: 8px;
	position: relative;

	/* 画像はコンテナ幅に追従 */
	& img {
		width: 100%;
		height: auto;
		display: block;
	}

	/* 光沢エフェクト：斜めの白グラデーションが横断する */
	&::before {
		content: '';
		position: absolute;
		inset: 0;
		background: linear-gradient(
			110deg,
			transparent 20%,
			rgba(255, 255, 255, 0.55) 50%,
			transparent 80%
		);
		transform: translateX(-130%) skewX(-15deg);
		transition: transform 0.65s cubic-bezier(0.19, 1, 0.22, 1);
		z-index: 1;
		pointer-events: none;
	}

	&:hover::before {
		transform: translateX(200%) skewX(-15deg);
	}

	/* フォーカス時のアウトライン（アクセシビリティ） */
	&:focus-visible {
		outline: 3px solid var(--color-brand-main);
		outline-offset: 3px;
	}
}

@media (max-width: 767px) {
	.section--recruit .section__inner {
		padding-inline: 0;
	}

	.recruit-banner {
		border-radius: 0;
	}
}

/* ─── 事業内容セクション ─── */

.section--services {
	background: var(--color-bg-page);
}

/* カテゴリ間の区切り余白 */
.services__item {
	margin-bottom: 80px;

	&:last-child {
		margin-bottom: 0;
	}
}

/* スクロールリビール：初期状態 */
.services__item[data-reveal] {
	opacity: 0;
	transform: translateY(30px);
	transition:
		opacity 700ms cubic-bezier(0.19, 1, 0.22, 1) 150ms,
		transform 700ms cubic-bezier(0.19, 1, 0.22, 1) 150ms;
}

.services__item[data-reveal].is-visible {
	opacity: 1;
	transform: translateY(0);
}

/* カテゴリヘッダー（番号画像・緑見出し・説明文） */
.services__item-header {
	text-align: center;
	margin-bottom: 50px;
}

/* 番号画像（01 / 02）：センタリング */
.services__item-num {
	margin: 0 0 18px;
	text-align: center;

	img {
		display: block;
		margin: 0 auto;
		height: 46px;
		width: auto;
	}
}

/* 緑の見出し */
.services__item-lead {
	margin: 0 0 14px;
	color: var(--color-brand-main);
	font-size: 27px;
	font-weight: 700;
	letter-spacing: 0.04em;
}

/* 黒の説明文 */
.services__item-desc {
	margin: 0;
	font-size: 15px;
	line-height: 2;
	color: var(--color-text-main);
}

/* サブ項目リスト */
.services__sub-list {
	display: flex;
	flex-direction: column;
	gap: 40px;
}

/* 各サブ項目：画像左・テキスト右 */
.services__sub-item {
	display: grid;
	grid-template-columns: 55% 1fr;
	gap: 40px;
	/* テキスト側を画像と同じ高さに伸ばす */
	align-items: stretch;
}

/* 画像 */
.services__sub-photo {
	margin: 0;

	img {
		width: 100%;
		height: auto;
		display: block;
	}
}

/* サブアイテム：スクロールリビール */
.services__sub-item[data-reveal] {
	opacity: 0;
	transform: translateY(24px);
	transition:
		opacity 600ms cubic-bezier(0.19, 1, 0.22, 1) 0ms,
		transform 600ms cubic-bezier(0.19, 1, 0.22, 1) 0ms;
}

.services__sub-item[data-reveal].is-visible {
	opacity: 1;
	transform: translateY(0);
}

/* 画像：アイテム表示後にさらにディレイをかけてフェードイン */
.services__sub-item[data-reveal] .services__sub-photo {
	opacity: 0;
	transform: translateY(16px);
	transition:
		opacity 600ms cubic-bezier(0.19, 1, 0.22, 1) 350ms,
		transform 600ms cubic-bezier(0.19, 1, 0.22, 1) 350ms;
}

.services__sub-item[data-reveal].is-visible .services__sub-photo {
	opacity: 1;
	transform: translateY(0);
}

/* テキスト（上下に緑ライン・コンテンツを縦中央配置） */
.services__sub-text {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 14px 0;
	border-top: 2px solid var(--color-brand-main);
	border-bottom: 2px solid var(--color-brand-main);
	font-size: 15px;
	line-height: 1.9;
	color: var(--color-text-main);

	p {
		margin: 0;
	}
}

/* ─── 建設業の許可を受けた事業ブロック ─── */

/* スクロールリビール */
.services__license[data-reveal] {
	opacity: 0;
	transform: translateY(24px);
	transition:
		opacity 700ms cubic-bezier(0.19, 1, 0.22, 1) 150ms,
		transform 700ms cubic-bezier(0.19, 1, 0.22, 1) 150ms;
}

.services__license[data-reveal].is-visible {
	opacity: 1;
	transform: translateY(0);
}

.services__license {
	margin-top: 70px;
	text-align: center;
}

/* 緑の見出し */
.services__license-title {
	margin: 0 0 20px;
	color: var(--color-brand-main);
	font-size: 27px;
	font-weight: 700;
	letter-spacing: 0.06em;
}

/* 許可事業リスト行 */
.services__license-list {
	margin: 0;
	font-size: 15px;
	line-height: 2.4;
	color: var(--color-text-main);
	/* 〇 が単独で行末に来ないよう、CJK文字間の改行を禁止 */
	word-break: keep-all;
}

@media (max-width: 767px) {
	.services__license {
		margin-top: 50px;
	}

	.services__license-title {
		font-size: 19px;
	}

	.services__license-list {
		font-size: 14px;
		line-height: 2.2;
	}
}

/* 施工箇所ラベル行（【施工箇所】＋リスト） */
.services__sub-facility {
	margin-top: 8px;

	span {
		display: block;
		font-weight: 700;
	}
}

/* ─── リンクボタン（汎用：.pa-linkbtn） ─── */

.pa-linkbtn {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 14px;
	padding: 11px 18px 11px 26px;
	border: 1px solid rgba(255, 255, 255, 0.75);
	border-radius: 999px;
	background-color: rgba(255, 255, 255, 0.2);
	color: #ffffff;
	text-decoration: none;
	font-size: 14px;
	letter-spacing: 0.14em;
	overflow: hidden;
	margin-top: 6px;
	transition:
		color var(--transition-normal),
		border-color var(--transition-normal);
}

/* ホバー白フィル（左からスライドイン） */
.pa-linkbtn::before {
	content: '';
	position: absolute;
	inset: 0;
	background: #ffffff;
	border-radius: inherit;
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 360ms cubic-bezier(0.19, 1, 0.22, 1);
}

.pa-linkbtn:hover {
	color: var(--color-brand-main);
	border-color: #ffffff;
}

.pa-linkbtn:hover::before {
	transform: scaleX(1);
}

/* テキスト：z-indexで白フィルの上に重ねる */
.pa-linkbtn__text {
	position: relative;
	z-index: 1;
}

/* 丸付き矢印アイコン */
.pa-linkbtn__icon {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border: 1px solid rgba(255, 255, 255, 0.75);
	border-radius: 50%;
	flex-shrink: 0;
	transition:
		border-color var(--transition-normal),
		transform var(--transition-normal),
		background-color var(--transition-normal);
}

/* CSS矢印（→）：border-topとborder-rightで山形を作り45deg回転 */
.pa-linkbtn__icon::before {
	content: '';
	width: 7px;
	height: 7px;
	border-top: 1.5px solid currentColor;
	border-right: 1.5px solid currentColor;
	transform: rotate(45deg) translate(-1px, 1px);
}

.pa-linkbtn:hover .pa-linkbtn__icon {
	border-color: var(--color-brand-main);
	background-color: rgba(139, 195, 74, 0.1);
	transform: translateX(4px);
}

/* ─── バナーセクション共通 レスポンシブ ─── */

@media (max-width: 767px) {
	/* セクションタイトル SP */
	.section__title {
		font-size: 30px;
		gap: 14px;
		margin-bottom: 40px;
	}

	/* 会社案内 SP */
	.company-table {
		font-size: 16px;
	}

	.company-table__row {
		flex-direction: column;
		gap: 6px;
		padding-block: 16px;
	}

	.company-table__term {
		width: auto;
	}

	/* 事業内容 SP */
	.services__item {
		margin-bottom: 60px;
	}

	.services__item-lead {
		font-size: 19px;
	}

	/* SP：画像とテキストを縦並びに */
	.services__sub-item {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	/* スマホはホバー不要のため常に白フィル状態で表示 */
	.pa-linkbtn {
		color: var(--color-brand-main);
		border-color: #ffffff;
	}

	.pa-linkbtn::before {
		transform: scaleX(1);
	}

	.pa-linkbtn__icon {
		border-color: var(--color-brand-main);
	}
}

/* ─── フッター ─── */

/* ─── フッター ─── */

.pa-footer {
	color: #ffffff;
	text-align: center;
}

/* Google Map */
.pa-footer__map {
	width: 100%;
	height: 400px;
	overflow: hidden;
	line-height: 0;

	& iframe {
		width: 100%;
		height: 100%;
	}
}

/* グリーン背景ブロック */
.pa-footer__green {
	background-color: var(--color-brand-main);
}

/* コンテンツラッパー */
.pa-footer__inner {
	max-width: var(--layout-max-width);
	margin: 0 auto;
	padding-inline: var(--page-side-padding);
	padding-block: 52px 32px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 32px;
}

/* ロゴ */
.pa-footer__brand {
	display: block;
	line-height: 0;
}

.pa-footer__logo {
	width: 200px;
	height: auto;
}

/* フッターナビ */
.pa-footer__nav-list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 4px 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pa-footer__nav-item {
	display: flex;
	align-items: center;
}

.pa-footer__nav-link {
	color: #ffffff;
	text-decoration: none;
	font-size: 14px;
	letter-spacing: 0.12em;
	transition: opacity var(--transition-fast);

	&:hover {
		opacity: 0.7;
	}
}

/* コピーライト */
.pa-footer__copyright {
	margin: 0;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #ffffff;
}

/* ─── スクロールリビール（フッター） ─── */

.pa-footer__brand[data-reveal],
.pa-footer__nav[data-reveal] {
	opacity: 0;
	transform: translateY(20px);
	transition:
		opacity 700ms cubic-bezier(0.19, 1, 0.22, 1) 150ms,
		transform 700ms cubic-bezier(0.19, 1, 0.22, 1) 150ms;
}

/* ナビはブランドより150ms遅れて表示（ベース150ms + 差分150ms = 300ms） */
.pa-footer__nav[data-reveal] {
	transition-delay: 300ms;
}

.pa-footer__brand[data-reveal].is-visible,
.pa-footer__nav[data-reveal].is-visible {
	opacity: 1;
	transform: translateY(0);
}

/* ─── フッター レスポンシブ ─── */

@media (max-width: 767px) {
	.pa-footer__map {
		height: 250px;
	}

	.pa-footer__inner {
		gap: 24px;
		padding-block: 40px 24px;
	}

	.pa-footer__logo {
		width: 160px;
	}

	.pa-footer__nav-link {
		font-size: 13px;
	}

	.pa-footer__copyright {
		font-size: 10px;
	}
}

/* ─── 現在ページのナビリンク（aria-current） ─── */

.pa-header__nav-link[aria-current='page'] {
	color: var(--color-brand-main);

	&::after {
		transform: translateX(-50%) scaleX(1);
	}
}

/* ─── ページヒーロー（サブページ共通） ─── */

.page-hero {
	position: relative;
	height: 630px;
	display: flex;
	align-items: center;
	overflow: hidden;
	margin-top: calc(-1 * (var(--header-height-desktop) + var(--space-md)));
	padding-top: calc(var(--header-height-desktop) + var(--space-md));
}

/* アニメーション背景（各ページで背景画像を切り替え） */
.page-hero__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	animation: pageBgKenBurns 14s ease-in-out infinite alternate;
	will-change: transform;
}

.page-hero__bg--contact {
	background-image: url('images/contact-pagetitle-bg.webp');

	@media (max-width: 767px) {
		background-image: url('images/contact-pagetitle-bgsp.webp');
	}
}

@keyframes pageBgKenBurns {
	from {
		transform: scale(1) translate(0, 0);
	}
	to {
		transform: scale(1.08) translate(-2%, 1%);
	}
}

/* コンテンツエリア（最前面） */
.page-hero__inner {
	position: relative;
	z-index: 2;
	max-width: var(--layout-max-width);
	width: 100%;
	margin-inline: auto;
	padding-inline: var(--page-side-padding);
	display: flex;
	justify-content: center;
}

/* タイトル画像＋サブテキストのまとめラッパー */
.page-hero__title {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
}

/* ページタイトル画像 */
.page-hero__title-img {
	margin: 0;

	img {
		height: 110px;
		width: auto;
	}
}

.contact-content {
	padding-block: 72px 100px;
	background-color: var(--color-bg-page);
}

/* タイトル・リード：他セクションと同じ最大幅 */
.contact-content__header {
	max-width: var(--layout-max-width);
	margin-inline: auto;
	padding-inline: var(--page-side-padding);
	margin-bottom: 48px;
}

/* セクションタイトル下の説明文 */
.contact-content__lead {
	margin-top: 32px;
	font-size: 16px;
	line-height: 2;
	text-align: center;
	color: var(--color-text-main);
	letter-spacing: 0.04em;
}

/* フォームエリア：最大幅700px */
.contact-content__inner {
	max-width: 700px;
	width: 100%;
	margin-inline: auto;
	padding-inline: 20px;
}

/* ============================================================
   お問合せフォーム共通
============================================================ */

/* フォーム区切りセクション */
.contact-form__sec {
	margin-bottom: 0;
}

/* ── 必須バッジ ── */
.contact-form__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	padding: 5px 12px;
	background-color: var(--color-brand-main);
	color: #ffffff;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.06em;
	border-radius: 0;
	line-height: 1;
}

/* ============================================================
   Section 1：フォーム入力
============================================================ */

/* 各行 */
.contact-form__row {
	display: flex;
	align-items: center;
	gap: 16px;
	padding-block: 22px;

	/* テキストエリア行は上寄せ */
	&.contact-form__row--textarea {
		align-items: flex-start;
	}
}

/* ラベル列（固定幅・右寄せ） */
.contact-form__label-cell {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;
	gap: 8px;
	width: 172px;
	flex-shrink: 0;
}

/* ラベルテキスト */
.contact-form__label-text {
	font-size: 17px;
	font-weight: 400;
	color: var(--color-text-main);
	letter-spacing: 0.04em;
	line-height: 1.5;
	cursor: default;
}

label.contact-form__label-text {
	cursor: pointer;
}

/* 入力列 */
.contact-form__field-cell {
	flex: 1;
	min-width: 0;
}

/* テキスト入力・メール・電話 */
.contact-form__input {
	width: 100%;
	height: 56px;
	padding-inline: 18px;
	background-color: #f0f1f2;
	border: 2px solid transparent;
	border-radius: 8px;
	font-family: var(--font-family-base);
	font-size: 17px;
	color: var(--color-text-main);
	transition:
		border-color var(--transition-fast),
		background-color var(--transition-fast);
	appearance: none;
	-webkit-appearance: none;

	&::placeholder {
		color: #aaaaaa;
	}

	&:focus {
		outline: none;
		border-color: var(--color-brand-main);
		background-color: #ffffff;
	}
}

/* テキストエリア */
.contact-form__textarea {
	width: 100%;
	min-height: 180px;
	padding: 16px 18px;
	background-color: #f0f1f2;
	border: 2px solid transparent;
	border-radius: 8px;
	font-family: var(--font-family-base);
	font-size: 17px;
	color: var(--color-text-main);
	line-height: 1.7;
	resize: vertical;
	transition:
		border-color var(--transition-fast),
		background-color var(--transition-fast);
	appearance: none;
	-webkit-appearance: none;

	&::placeholder {
		color: #aaaaaa;
	}

	&:focus {
		outline: none;
		border-color: var(--color-brand-main);
		background-color: #ffffff;
	}
}

/* ラジオボタングループ */
.contact-form__radio-group {
	display: flex;
	align-items: center;
	gap: 28px;
}

/* ラジオアイテム（ラベル全体） */
.contact-form__radio-item {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 17px;
	color: var(--color-text-main);
	letter-spacing: 0.04em;
	cursor: pointer;
	user-select: none;
}

/* ネイティブ input を非表示 */
.contact-form__radio-input {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

/* カスタムラジオボタン */
.contact-form__radio-mark {
	display: block;
	width: 22px;
	height: 22px;
	border: 2px solid #bbbbbb;
	border-radius: 50%;
	background-color: #ffffff;
	flex-shrink: 0;
	transition: border-color var(--transition-fast);
	position: relative;

	&::after {
		content: '';
		display: block;
		width: 12px;
		height: 12px;
		border-radius: 50%;
		background-color: #1a4fa0;
		position: absolute;
		top: 50%;
		left: 50%;
		translate: -50% -50%;
		opacity: 0;
		transition: opacity var(--transition-fast);
	}
}

/* 選択済みスタイル */
.contact-form__radio-input:checked + .contact-form__radio-mark {
	border-color: #1a4fa0;

	&::after {
		opacity: 1;
	}
}

/* フォーカスリング */
.contact-form__radio-input:focus-visible + .contact-form__radio-mark {
	outline: 2px solid var(--color-brand-main);
	outline-offset: 2px;
}

/* ============================================================
   Section 2：送信
============================================================ */

.contact-form__sec--submit {
	margin-top: 30px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
}

/* プライバシーポリシーリンク */
.contact-form__privacy-link-text {
	font-size: 13px;
	text-align: center;
}

.contact-form__privacy-link {
	color: var(--color-brand-main);
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: opacity var(--transition-fast);

	&:hover {
		opacity: 0.75;
	}
}

/* 送信ボタン外枠 */
.contact-form__submit-wrap {
	display: flex;
	justify-content: center;
}

/* 送信ボタン */
.contact-form__submit {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 240px;
	padding-block: 22px;
	background: linear-gradient(to right, #93c354, #0fa934);
	color: #ffffff;
	font-family: var(--font-family-base);
	font-size: 20px;
	font-weight: 600;
	letter-spacing: 0.12em;
	border: none;
	border-radius: 6px;
	cursor: pointer;
	overflow: hidden;
	position: relative;
	transition: opacity var(--transition-fast);

	/* 光沢エフェクト：斜めの白グラデーションが横断する */
	&::before {
		content: '';
		position: absolute;
		inset: 0;
		background: linear-gradient(
			110deg,
			transparent 20%,
			rgba(255, 255, 255, 0.45) 50%,
			transparent 80%
		);
		transform: translateX(-130%) skewX(-15deg);
		transition: transform 0.65s cubic-bezier(0.19, 1, 0.22, 1);
		pointer-events: none;
	}

	&:hover::before {
		transform: translateX(200%) skewX(-15deg);
	}

	&:active {
		opacity: 0.85;
	}
}

/* ============================================================
   お問合せ SP（767px以下）
============================================================ */

@media (max-width: 767px) {
	.contact-content {
		padding-block: 48px 72px;
	}

	/* 各行を縦積みに */
	.contact-form__row {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
		padding-block: 18px;

		&.contact-form__row--textarea {
			align-items: flex-start;
		}
	}

	/* ラベル列：幅解除・SP では左寄せに戻す */
	.contact-form__label-cell {
		width: auto;
		flex-direction: row;
		align-items: center;
		justify-content: flex-start;
	}

	/* 入力列：縦積み時に全幅 */
	.contact-form__field-cell {
		width: 100%;
	}

	.contact-form__label-text {
		font-size: 15px;
	}

	.contact-form__input {
		height: 52px;
		font-size: 16px;
	}

	.contact-form__textarea {
		font-size: 16px;
		min-height: 160px;
	}

	.contact-form__submit {
		font-size: 17px;
		padding-block: 20px;
	}
}

/* ニュースページ：サンプルリンクボタン */
.news-sample-link {
	padding: 12px 40px 0;
	background-color: #f5f8fb;
	text-align: center;
	margin: 0 auto;
}

.news-sample-link__btn {
	display: inline-block;
	padding: 6px 16px;
	font-size: 12px;
	font-weight: 600;
	color: #fff;
	background-color: var(--color-brand-main);
	border-radius: 4px;
	text-decoration: none;
	transition: opacity 0.2s ease;

	&:hover {
		opacity: 0.75;
	}
}

/* ─── ページャー ─── */
.pager {
	text-align: center;
	padding: 32px 10px 10px;
	clear: both;

	/* ページボタン共通 */
	& a {
		display: inline-block;
		border: 1px solid var(--color-brand-main);
		border-radius: 5px;
		color: var(--color-text-main);
		font-size: 13px;
		padding: 6px 12px 5px;
		text-decoration: none;
		margin: 0 3px;
		transition:
			background-color var(--transition-fast),
			color var(--transition-fast);

		/* 現在ページ */
		&.current {
			background-color: var(--color-brand-main);
			border-color: var(--color-brand-main);
			color: #fff;
		}

		/* ホバー（currentも含む） */
		&:hover {
			background-color: var(--color-brand-main);
			color: #fff;
		}
	}
}

/* 省略記号（…） */
.overPagerPattern {
	padding: 0 2px;
	font-size: 13px;
	color: var(--color-text-main);
}
