/* ── OPアニメーション ── */
/* style.css の display:none !important を上書き（高優先度セレクタ） */
body.home .opening-animation {
	display: flex !important;
	position: fixed;
	inset: 0;
	z-index: 9999;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #1e1208;
	opacity: 1;
	transition: opacity 0.9s ease;
	pointer-events: all;
}
body.home .opening-animation.op-fadeout {
	opacity: 0;
	pointer-events: none;
}
body.home .opening-animation.op-done {
	display: none !important;
}
.opening-logo {
	opacity: 0;
	transform: translateY(10px);
	transition: opacity 0.7s ease, transform 0.7s ease;
}
.opening-logo img {
	width: clamp(140px, 22vw, 220px);
	height: auto;
	display: block;
}
.opening-tagline {
	opacity: 0;
	transform: translateY(4px);
	margin-top: 22px;
	font-size: 12px;
	letter-spacing: 0.38em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.28);
	transition: opacity 0.7s ease 0.28s, transform 0.7s ease 0.28s;
}
.opening-animation.op-active .opening-logo {
	opacity: 1;
	transform: translateY(0);
}
.opening-animation.op-active .opening-tagline {
	opacity: 1;
	transform: translateY(0);
}

/* ── MV オーバーレイ 明度調整 ── */
/* style.css の各レイヤーを上書き（specificity を body.home で底上げ） */

/* ビネット（周辺暗化） */
body.home #sec_slide.sec_slide::after {
	background:
		radial-gradient(ellipse at center, transparent 38%, rgba(0,0,0,0.22) 100%),
		linear-gradient(to bottom,
			rgba(0,0,0,0.10) 0%,
			transparent 25%,
			transparent 65%,
			rgba(0,0,0,0.18) 100%
		);
}

/* グラデーション暗幕 */
body.home #sec_slide .mv-gradient {
	background:
		linear-gradient(125deg, rgba(0,10,8,0.16) 0%, rgba(0,0,0,0.04) 40%, transparent 70%),
		linear-gradient(to top, rgba(0,0,0,0.22) 0%, transparent 45%);
}

/* ── MV テキスト影：さわやか調整 ── */

/* 文字背後の黒いぼかし暗幕を大幅に薄く */
body.home .mv-h1::before {
	background: radial-gradient(ellipse at 30% 50%, rgba(0,0,0,0.12) 0%, transparent 72%);
}

/* 1行目ゴシック：黒影→ほぼなし＋薄い緑グロー */
body.home .mv-h1-line1 {
	text-shadow:
		0 2px 4px rgba(0,0,0,0.18),
		0 6px 24px rgba(0,144,125,0.12);
}

/* 2行目アウトライン：黒drop-shadowを薄く */
body.home .mv-h1-line2 {
	filter: drop-shadow(0 2px 10px rgba(0,0,0,0.22));
}

/* 「未来へ」緑アクセント：黒グロー→緑グローに変換 */
body.home .mv-accent {
	text-shadow:
		0 0 2px rgba(0,0,0,0.15),
		0 0 16px rgba(0,144,125,0.65),
		0 0 40px rgba(0,144,125,0.28);
}

/* ── body.home 専用追加トークン ── */
body.home {
	--bg:     #1a1208;
	--bg-2:   #201c14;
	--bg-3:   #2a2418;
	--text:   #e8e0cc;
	--text-2: #8a8680;
	--text-3: #3a3830;
	--pad:    clamp(24px,5vw,80px);
}

/* ── 測量グリッド背景 ── */
.survey-grid {
	position:fixed;inset:0;z-index:0;pointer-events:none;
	background-image:
		linear-gradient(var(--line) 1px, transparent 1px),
		linear-gradient(90deg, var(--line) 1px, transparent 1px);
	background-size:80px 80px;
	mask-image:radial-gradient(ellipse 80% 80% at 50% 50%, black 30%, transparent 100%);
}

/* MVコンテナの基準位置を確定 */
#sec_slide {
	position: relative !important;
	overflow: hidden;
}

/* ── MV ── */
.mv-bg-video {
	position:absolute;inset:0;
	background:linear-gradient(170deg,#0d1a10 0%,#050806 50%,#0a120a 100%);
}
.mv-bg-video .bg-video {
	position:absolute;inset:0;width:100%;height:100%;
	object-fit:cover;opacity:0;transition:opacity 1s ease;
}
.mv-bg-video .bg-video.active { opacity:1; }

/* ── MV コーナー画像（HUDスタイル） ── */
.mv-corner {
	position: absolute;
	z-index: 50; /* 確実に最前面に来るように数値を上げる */
	width: clamp(400px, 50vw, 800px); /* 横幅をさらに広く（底辺を長く） */
	height: clamp(160px, 20vw, 320px); /* 高さを抑える */
	opacity: 0;
	filter: brightness(2) blur(15px); /* 最初は発光してぼけている */
	transition: 
		transform 1.4s cubic-bezier(0.16, 1, 0.3, 1), 
		opacity 1s ease,
		filter 1.2s ease;
	pointer-events: none;
}
.mv-corner img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* 右上：右上から左下へ向かう対角線が底辺 */
.mv-corner-tr {
	top: 0;
	right: 0;
	clip-path: polygon(0 0, 100% 0, 100% 100%);
	transform: translate(60px, -60px) scale(1.2) rotate(2deg);
}

/* 右下：右下から左上へ向かう対角線が底辺 */
.mv-corner-br {
	bottom: 0;
	right: 0;
	clip-path: polygon(100% 0, 100% 100%, 0 100%);
	transform: translate(60px, 60px) scale(1.2) rotate(-2deg);
}

.mv-corner::after,
.mv-corner::before {
	content: '';
	position: absolute;
	/* 1pxの「棒」として定義し、対角線上に配置する */
	width: 110%; /* 対角線は横幅より長いため */
	height: 1px;
	left: 0;
	opacity: 0;
	transform-origin: left center;
}

/* 右上の底辺（左上 0,0 から 右下 100%,100% へのライン） */
.mv-corner-tr::after,
.mv-corner-tr::before {
	top: 0;
	transform: rotate(21.8deg); /* 800:320 の比率に基づく正確な角度 */
}

/* 右下の底辺（左下 0,100% から 右上 100%,0 へのライン） */
.mv-corner-br::after,
.mv-corner-br::before {
	bottom: 0;
	transform: rotate(-21.8deg);
}

/* ── 静的なベースライン ── */
.mv-corner::after {
	z-index: 1;
	background: var(--accent);
	transition: opacity 1.2s ease 1s;
}

/* ── 走る光のエフェクト ── */
.mv-corner::before {
	z-index: 2;
	background: linear-gradient(90deg, transparent, #fff, transparent);
	transition: opacity 1s ease 1.2s;
	/* 光の幅を細く設定 */
	background-size: 200px 100%;
	background-repeat: no-repeat;
}

/* アニメーション発火時 */
.mv-corner.is-active {
	opacity: 1;
	filter: brightness(1) blur(0);
	transform: translate(0, 0) scale(1) rotate(0);
}
.mv-corner.is-active::after {
	opacity: 0.25; /* 下地の線は少し控えめに */
}
.mv-corner.is-active::before {
	opacity: 1;
	animation: cornerSweep 3s infinite cubic-bezier(0.19, 1, 0.22, 1);
}

/* 光が斜辺を滑るアニメーション */
@keyframes cornerSweep {
	0% {
		background-position: -200px 0;
	}
	50% {
		background-position: 120% 0;
	}
	100% {
		background-position: 120% 0;
	}
}

/* 大きな背景数字 */
.mv-bg-year {
	position:absolute;right:-2vw;bottom:-4vh;
	font-family:var(--font-serif);
	font-size:clamp(180px,30vw,420px);
	font-weight:300;
	color:rgba(255,255,255,0.018);
	line-height:1;letter-spacing:-0.04em;
	pointer-events:none;user-select:none;
	z-index:1;
}

/* 縦ライン装飾 */
.mv-vline {
	position:absolute;top:0;bottom:0;
	width:0.5px;background:var(--line-2);z-index:1;
}
.mv-vline:first-of-type { left:var(--pad); }
.mv-vline:last-of-type  { right:var(--pad); }

/* コンテンツエリア: 下に固定 */
.mv-inner {
	position:absolute;
	bottom:0;left:0;right:0;
	z-index:7;
	padding:0 var(--pad) 88px;
}

/* eyebrow は style.css に同名スタイルがあるので color だけ補強 */
.mv-eyebrow {
	color:var(--accent);
	margin-bottom:28px;
}

/* MV 業種タグライン */
.mv-tagline {
	font-size: clamp(13px, 1.4vw, 17px);
	font-weight: 500;
	letter-spacing: 0.18em;
	color: rgba(255, 255, 255, 0.85);
	margin-bottom: 8px;
	border-left: 2px solid var(--accent);
	padding-left: 12px;
	line-height: 1.6;
}

/* SCROLL インジケーター — 水平中央・縦組み */
.mv-scroll {
	position:absolute;
	bottom:28px;
	left:50%;
	transform:translateX(-50%);
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:8px;
	z-index:8;
}
.mv-scroll-text {
	font-size:11px;letter-spacing:0.3em;text-transform:uppercase;
	color:rgba(255,255,255,0.3);
	white-space:nowrap;
}
.mv-scroll-line {
	width:0.5px;height:44px;
	background:linear-gradient(to bottom, var(--accent), transparent);
	animation: scrollDrop 1.8s ease-in-out infinite;
	transform-origin:top;
}
@keyframes scrollDrop {
	0%   { transform:scaleY(0); opacity:1; }
	60%  { transform:scaleY(1); opacity:1; }
	100% { transform:scaleY(1); opacity:0; }
}

/* ── NEWS ── */
#sec_top_news {
	background:var(--bg-2);
	padding:60px 0;
	border-bottom:0.5px solid var(--line-2);
	position:relative;z-index:1;
}
#sec_top_news .inner {
	max-width:var(--container,1400px);margin:0 auto;padding:0 var(--pad);
	display:grid;grid-template-columns:160px 1fr;gap:40px;align-items:start;
}
.news-label {
	font-family:var(--font-serif);
	font-size:clamp(56px,7vw,88px);
	font-weight:300;font-style:italic;
	color:rgba(255,255,255,0.04);line-height:1;
}
.news-more {
	display:inline-flex;align-items:center;gap:8px;margin-top:18px;
	font-size:13px;letter-spacing:0.16em;text-transform:uppercase;
	color:var(--accent);font-weight:700;
}
.news-more::after{content:'→';}

/* ── ABOUT ── */
#sec_top_about {
	background:var(--bg);
	padding:120px 0;position:relative;overflow:hidden;
}
#sec_top_about::before {
	content:'1988';
	position:absolute;top:40px;right:-10px;
	font-family:var(--font-serif);
	font-size:clamp(100px,18vw,260px);
	font-weight:300;
	color:rgba(255,255,255,0.018);
	line-height:1;pointer-events:none;
}
.about-inner {
	max-width:var(--container,1400px);margin:0 auto;padding:0 var(--pad);
	display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;
	position:relative;z-index:1;
}
.about-eyebrow {
	font-size:12px;font-weight:700;letter-spacing:0.24em;text-transform:uppercase;
	color:var(--accent);display:flex;align-items:center;gap:10px;margin-bottom:28px;
}
.about-eyebrow::before{content:'';width:24px;height:0.5px;background:var(--accent);flex-shrink:0;}
.about-h2 { font-family:var(--font-serif);margin-bottom:16px; }
.about-category {
	font-size:11px;letter-spacing:0.18em;
	color:var(--text-2);
	margin-bottom:20px;
	padding-left:2px;
}
.about-h2-l1 {
	display:block;
	font-family:var(--font-serif);
	font-size:clamp(36px,5vw,64px);
	font-weight:300;color:var(--text);
	line-height:1.05;letter-spacing:-0.01em;
}
.about-h2-l2 {
	display:block;
	font-family:var(--font-serif);
	font-size:clamp(36px,5vw,64px);
	font-weight:300;font-style:italic;color:var(--accent);
	line-height:1.05;letter-spacing:-0.01em;
	padding-left:clamp(20px,4vw,48px);
}
.about-desc {
	font-size:15px;color:var(--text-2);line-height:2.2;
	font-weight:300;margin-bottom:36px;
	border-left:0.5px solid var(--text-3);padding-left:16px;
}
.about-btn {
	display:inline-flex;align-items:center;gap:10px;
	font-size:12px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;
	color:var(--accent);border:0.5px solid var(--accent);padding:12px 24px;
	transition:background .2s,color .2s;
}
.about-btn:hover{background:var(--accent);color:#080807;}

.about-right { position:relative; }
.about-img {
	width:100%;height:380px;
	position:relative;overflow:hidden;
}
.about-img .top_about__img {
	width:100%;height:100%;object-fit:cover;
}
.about-img-label {
	position:absolute;bottom:16px;left:16px;
	font-size:11px;letter-spacing:0.18em;text-transform:uppercase;
	color:rgba(255,255,255,0.2);
}
.about-img::before,.about-img::after {
	content:'';position:absolute;
	width:16px;height:16px;
	border-color:var(--gold);border-style:solid;
	opacity:0.5;z-index:1;
}
.about-img::before{top:12px;left:12px;border-width:0.5px 0 0 0.5px;}
.about-img::after{bottom:12px;right:12px;border-width:0 0.5px 0.5px 0;}
.about-caption {
	position:absolute;bottom:-24px;right:0;
	font-family:var(--font-serif);font-size:52px;font-weight:300;font-style:italic;
	color:rgba(255,255,255,0.04);pointer-events:none;white-space:nowrap;
}
.about-note {
	margin-top:16px;font-size:11px;color:rgba(255,255,255,0.25);
	display:flex;align-items:center;gap:6px;
}
.about-note::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--accent);flex-shrink:0;}
.about-stats {
	display:grid;grid-template-columns:1fr 1fr;
	border:0.5px solid var(--line-2);margin-top:28px;
}
.about-stat{padding:18px 16px;text-align:center;border-right:0.5px solid var(--line-2);}
.about-stat:last-child{border-right:none;}
.about-stat-num {
	font-family:var(--font-serif);font-size:44px;font-weight:300;
	color:var(--text);line-height:1;
}
.about-stat-unit{font-size:14px;color:var(--gold);font-weight:700;vertical-align:super;}
.about-stat-label{font-size:13px;color:var(--text-2);margin-top:6px;display:block;letter-spacing:0.06em;text-transform:uppercase;}

/* ── SERVICE ── */
#sec_top_service { background:var(--bg-2);padding:100px 0; }
.svc-inner { max-width:var(--container,1400px);margin:0 auto;padding:0 var(--pad); }
.svc-header {
	display:grid;grid-template-columns:1fr auto;align-items:flex-end;
	margin-bottom:48px;padding-bottom:20px;
	border-bottom:0.5px solid var(--line-2);
}
.svc-eyebrow {
	font-size:12px;font-weight:700;letter-spacing:0.24em;text-transform:uppercase;
	color:var(--accent);display:flex;align-items:center;gap:10px;margin-bottom:12px;
}
.svc-eyebrow::before { content:'';width:20px;height:0.5px;background:var(--accent);flex-shrink:0; }
.svc-h2 {
	font-family:var(--font-serif);
	font-size:clamp(32px,4.5vw,56px);font-weight:300;
	color:var(--text);line-height:1.05;
}
.svc-accent { color:var(--accent); font-family:inherit;font-size:inherit;font-weight:inherit; }
.svc-more {
	font-size:12px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;
	color:var(--text-2);display:flex;align-items:center;gap:6px;transition:color .2s;
}
.svc-more:hover { color:var(--accent); }
.svc-more::after { content:'→'; }

.svc-list { display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line); }
.svc-card {
	background:var(--bg);display:block;text-decoration:none;
	position:relative;overflow:hidden;transition:background .3s;
}
.svc-card:hover { background:#111;cursor:pointer; }
.svc-card-img { height:180px;position:relative;overflow:hidden; }
.svc-card-img-bg {
	position:absolute;inset:0;
	background-size:cover;background-position:center;
	transition:transform .5s ease;
}
.svc-card:hover .svc-card-img-bg { transform:scale(1.06); }
.s-bg-1 { background:linear-gradient(160deg,#0d2218,#040c08); }
.s-bg-2 { background:linear-gradient(140deg,#081a12,#030a07); }
.s-bg-3 { background:linear-gradient(140deg,#0a1a14,#040c09); }
.s-bg-4 { background:linear-gradient(140deg,#0c1c10,#050e08); }
.s-bg-5 { background:linear-gradient(140deg,#081410,#030908); }
.svc-card-num {
	position:absolute;top:12px;left:14px;
	font-family:var(--font-serif);font-size:40px;font-weight:300;
	color:rgba(255,255,255,0.08);line-height:1;
}
.svc-card-hover {
	position:absolute;inset:0;
	background:rgba(4,14,9,0.9);
	display:flex;flex-direction:column;justify-content:flex-end;
	padding:18px 14px;
	opacity:0;transform:translateY(6px);
	transition:opacity .3s,transform .3s;
}
.svc-card:hover .svc-card-hover { opacity:1;transform:translateY(0); }
.svc-hover-en { font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--accent);margin-bottom:5px; }
.svc-hover-title { font-size:16px;font-weight:700;color:#fff;line-height:1.4;margin-bottom:8px; }
.svc-hover-desc { font-size:13px;color:rgba(255,255,255,0.55);line-height:1.8; }
.svc-card-body { padding:14px;border-top:0.5px solid var(--line); }
.svc-card-en { font-size:11px;letter-spacing:0.16em;text-transform:uppercase;color:var(--accent);margin-bottom:5px; }
.svc-card-title { font-size:15px;font-weight:700;color:var(--text);line-height:1.45; }
.svc-card-bar {
	position:absolute;top:0;left:0;width:1.5px;height:100%;
	background:var(--accent);transform:scaleY(0);transform-origin:bottom;
	transition:transform .35s ease;
}
.svc-card:hover .svc-card-bar { transform:scaleY(1); }

/* ── MESSAGE ── */
#sec_top_message {
	background:var(--bg);
	padding:140px 0;text-align:center;
	position:relative;overflow:hidden;
}
#sec_top_message::before,#sec_top_message::after {
	content:'';position:absolute;left:0;right:0;height:0.5px;
	background:linear-gradient(to right,transparent,var(--line-2) 20%,var(--line-2) 80%,transparent);
}
#sec_top_message::before { top:60px; }
#sec_top_message::after  { bottom:60px; }
.msg-inner { max-width:720px;margin:0 auto;padding:0 var(--pad);position:relative;z-index:1; }
.msg-eyebrow {
	font-size:10px;letter-spacing:0.32em;text-transform:uppercase;
	color:rgba(255,255,255,0.2);margin-bottom:36px;
	display:flex;align-items:center;justify-content:center;gap:14px;
}
.msg-eyebrow::before,.msg-eyebrow::after {
	content:'';display:block;width:28px;height:0.5px;background:rgba(255,255,255,0.12);
}
.msg-h2 {
	font-family:var(--font-serif);
	font-size:clamp(30px,5vw,60px);
	font-weight:300;color:var(--text);
	line-height:1.2;margin-bottom:36px;letter-spacing:0.02em;
}
.msg-h2 em { font-family:var(--font-serif);font-style:italic;color:rgba(255,255,255,0.65); }
.msg-body {
	font-size:15px;color:rgba(255,255,255,0.45);
	line-height:2.4;font-weight:300;margin-bottom:56px;
}
.msg-divider {
	width:1px;height:40px;
	background:linear-gradient(to bottom,transparent,var(--gold),transparent);
	margin:0 auto 32px;border:none;
}
.msg-motto-label {
	font-size:12px;letter-spacing:0.24em;text-transform:uppercase;
	color:var(--gold);margin-bottom:10px;opacity:0.7;
}
.msg-motto {
	font-family:var(--font-serif);
	font-size:clamp(40px,6vw,72px);
	font-weight:300;color:rgba(255,255,255,0.85);
	letter-spacing:0.2em;
}
.msg-motto-yomi {
	font-size:14px;letter-spacing:0.1em;
	color:rgba(255,255,255,0.3);margin-top:10px;
}
.msg-motto-desc {
	font-size:15px;color:rgba(255,255,255,0.35);
	line-height:2;margin-top:20px;
}

/* ── RECRUIT ── */
#sec_top_recruit {
	position:relative;min-height:480px;
	background:var(--bg-2);overflow:hidden;
	display:flex;align-items:center;
}
.rec-bg-word {
	position:absolute;right:-2vw;top:50%;transform:translateY(-50%);
	font-family:var(--font-serif);
	font-size:clamp(80px,16vw,220px);
	font-weight:300;
	color:rgba(255,255,255,0.025);
	line-height:1;pointer-events:none;
}
.rec-grid {
	position:absolute;inset:0;
	background-image:
		linear-gradient(var(--line) 1px,transparent 1px),
		linear-gradient(90deg,var(--line) 1px,transparent 1px);
	background-size:60px 60px;
	mask-image:linear-gradient(to right,black 0%,black 50%,transparent 100%);
}
.rec-content { position:relative;z-index:2;padding:80px var(--pad);max-width:640px; }
.rec-eyebrow {
	font-size:12px;font-weight:700;letter-spacing:0.24em;text-transform:uppercase;
	color:var(--accent);display:flex;align-items:center;gap:10px;margin-bottom:20px;
}
.rec-eyebrow::before { content:'';width:20px;height:0.5px;background:var(--accent);flex-shrink:0; }
.rec-h2 {
	font-family:var(--font-serif);
	font-size:clamp(42px,6.5vw,80px);
	font-weight:300;color:#fff;
	line-height:1.0;margin-bottom:24px;letter-spacing:-0.01em;
}
.rec-h2 em { font-family:var(--font-serif);font-style:italic;color:var(--accent); }
.rec-desc {
	font-size:15px;color:rgba(255,255,255,0.4);
	line-height:2.1;font-weight:300;max-width:400px;margin-bottom:28px;
}
.rec-roles { display:flex;flex-wrap:wrap;gap:6px;margin-bottom:32px; }
.rec-role {
	font-size:12px;color:rgba(255,255,255,0.45);
	border:0.5px solid rgba(255,255,255,0.1);padding:5px 12px;
}
.rec-btn {
	display:inline-flex;align-items:center;gap:10px;
	font-size:12px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;
	color:var(--accent);border:0.5px solid var(--accent);padding:13px 28px;
	position:relative;overflow:hidden;transition:color .25s;
}
.rec-btn::before {
	content:'';position:absolute;inset:0;
	background:var(--accent);transform:scaleX(0);transform-origin:left;
	transition:transform .25s ease;z-index:0;
}
.rec-btn:hover::before { transform:scaleX(1); }
.rec-btn:hover { color:#080807; }
.rec-btn span { position:relative;z-index:1; }

/* ── ヘッダー：スクロール時の文字色切り替え ── */
/*
  MV上(#header.home)     → 白文字 ← style.css が担当
  スクロール後(:not.home) → 暗色文字 ← ここで上書き
  transition を先に定義しておくことで "消える→現れる" ではなく
  "フェードしながら切り替わる" 動作になる
*/
body.home .topnav_menu_list__link {
	transition: color 0.35s ease, opacity 0.35s ease;
}
body.home .btn-menu {
	transition: color 0.35s ease;
}
/* スクロール後（白カプセルヘッダー）→ 暗色 */
body.home #header:not(.home) .topnav_menu_list__link {
	color: #1a1a18;
	opacity: 0.82;
}
body.home #header:not(.home) .topnav_menu_list__link:hover {
	color: var(--accent);
	opacity: 1;
}
body.home #header:not(.home) .btn-trigger span {
	background-color: #1a1a18 !important;
}
body.home #header:not(.home) .btn-menu {
	color: #1a1a18 !important;
}

/* ── RECRUIT 画像 ── */
.rec-image {
	flex: 1;
	position: relative;
	align-self: stretch;
	overflow: hidden;
	min-height: 360px;
}
.rec-image img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
	opacity: 0.55;
	transition: opacity 0.4s ease, transform 0.6s ease;
}
#sec_top_recruit:hover .rec-image img {
	opacity: 0.65;
	transform: scale(1.03);
}
/* 左側コンテンツとの境界をなじませるグラデーション */
.rec-image::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, var(--bg-2) 0%, transparent 30%);
	z-index: 1;
	pointer-events: none;
}

/* ── フェードイン ── */
.fade-up { opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease; }
.fade-up.is-visible { opacity:1;transform:translateY(0); }
.fade-up[data-delay="1"] { transition-delay:.1s; }
.fade-up[data-delay="2"] { transition-delay:.2s; }
.fade-up[data-delay="3"] { transition-delay:.3s; }
.fade-up[data-delay="4"] { transition-delay:.4s; }
.fade-up[data-delay="5"] { transition-delay:.5s; }
.fade-up[data-delay="6"] { transition-delay:.6s; }
.fade-up[data-delay="7"] { transition-delay:.7s; }
.fade-up:not(.is-visible) { transition-delay:0s!important; }

/* ============================================================
   RESPONSIVE IMPROVEMENTS 2026 — front-page.php 専用
   ============================================================ */

/* ━━━ [1] MV ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (max-width: 768px) {
	/* 「未来へつなぐ」が nowrap でスマホからはみ出す問題を修正 */
	.mv-h1-line2 {
		white-space: normal;
		padding-left: 10px;
	}
	/* MV 下部コンテンツの bottom padding 縮小 */
	.mv-inner {
		padding-bottom: 60px;
	}
	/* mv-sub グリッド (リード＋ボタン) を縦積みに */
	#sec_slide .mv-sub {
		grid-template-columns: 1fr;
		gap: 20px;
	}
	#sec_slide .mv-btns {
		align-items: flex-start;
	}
	/* MV eyebrow / lead 余白調整 */
	.mv-eyebrow { margin-bottom: 16px; }
	.mv-h1 { margin-bottom: 4px; }
}

/* ━━━ [2] NEWS ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (max-width: 768px) {
	/* 「160px label | 1fr news」→ 縦積みに変更 */
	#sec_top_news .inner {
		grid-template-columns: 1fr;
		gap: 0;
		padding-top:    40px;
		padding-bottom: 40px;
	}
	.news-label  { font-size: 52px; margin-bottom: 8px; }
	.news-more   { margin-top: 8px; }
}

/* ━━━ [3] ABOUT ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (max-width: 900px) {
	/* 「1fr | 1fr」→ 縦積み */
	.about-inner {
		grid-template-columns: 1fr;
		gap: 40px;
	}
	#sec_top_about { padding: 60px 0; }
	/* テキスト側 */
	.about-h2-l2 { padding-left: 14px; }
	.about-desc  { border-left: none; padding-left: 0; }
	/* 画像側 */
	.about-img   { height: 260px; }
	.about-caption { display: none; }
}
@media (max-width: 576px) {
	.about-img { height: 200px; }
}

/* ━━━ [4] SERVICE ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (max-width: 900px) {
	/* ヘッダー行 (タイトル | more リンク) を縦積みに */
	.svc-header {
		grid-template-columns: 1fr;
		gap: 16px;
		margin-bottom: 28px;
	}
	/* カード 5列 → 3列 */
	.svc-list { grid-template-columns: repeat(3, 1fr); }
	.svc-card-img { height: 160px; }
}
@media (max-width: 576px) {
	/* 3列 → 2列 */
	.svc-list { grid-template-columns: repeat(2, 1fr); }
	.svc-card-img { height: 130px; }
}

/* ━━━ [5] MESSAGE ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (max-width: 768px) {
	#sec_top_message { padding: 60px 0; }
	.msg-inner       { padding: 0 20px; }
	.msg-h2          { font-size: clamp(24px, 6vw, 40px); margin-bottom: 24px; }
	.msg-body        { margin-bottom: 40px; }
	.msg-motto       { font-size: clamp(32px, 8vw, 52px); }
	.msg-eyebrow     { margin-bottom: 24px; }
}

/* ━━━ [6] RECRUIT ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (max-width: 900px) {
	/* flex row (rec-content | rec-image) → 縦積み */
	#sec_top_recruit {
		flex-direction: column;
		min-height: 0;
	}
	.rec-content {
		max-width: 100%;
		padding: 60px var(--pad, 24px);
		width: 100%;
	}
	.rec-image {
		width: 100%;
		flex: none;
		min-height: 240px;
		height: 240px;
	}
	/* 背景装飾は邪魔になるので非表示 */
	.rec-bg-word { display: none; }
	.rec-h2      { font-size: clamp(32px, 7vw, 52px); }
	.rec-desc    { max-width: 100%; }
}
@media (max-width: 576px) {
	.rec-content { padding: 48px 20px; }
	.rec-image   { height: 180px; min-height: 180px; }
}

/* ============================================================
   END RESPONSIVE IMPROVEMENTS 2026
   ============================================================ */