/* ============================================================
   overrides.css — 横断調整層（必ず最後に読み込む）
   タブレット中間幅 / 流体スケール / 1440px超え(案A) / 各所の改訂・
   アニメーション / 重なり順など、複数セクションにまたがる上書き。
   ※ ここは元 style.css の後半をそのまま保存したもの。順序に意味がある
   ============================================================ */

/* ============================================================
   タブレット（768〜1279px）: カンプ外の中間幅で固定幅要素が
   はみ出さないよう可変化する（デザイン意図は1440版を縮めた形）
   ============================================================ */
@media (min-width: 768px) and (max-width: 1439px) {
	/* EN装飾は幅に応じて縮小 */
	.about__en, .service__en, .flow__en, .works__en, .top-news__en, .mv__en,
	.message__en, .strength__en, .fields__en, .company__en, .access__en,
	.works-filter__en, .works-overview__en, .works-gallery__en, .works-point__en, .notfound-mv__en { font-size: clamp(96px, 12.5vw, 180px); }
	.cta-card__en { font-size: clamp(64px, 8.3vw, 120px); }

	/* ヘッダー */
	.header { padding-left: 20px; }
	.header-logo-link__name { font-size: 22px; }
	.header-logo-link__catch { font-size: 12px; }
	.header__stack { padding-right: 20px; }
	.header-tel__number { font-size: 24px; }
	.header-nav { gap: 16px; }
	.header-nav-link { font-size: 16px; }
	.header-contact-btn { width: 120px; }

	/* TOP */
	.fv { padding: 16px 20px 32px; }
	.fv__copy { right: 24px; top: 40px; }
	.fv__copy-l { font-size: clamp(32px, 3.75vw, 54px); }
	.fv__copy-s { font-size: clamp(20px, 2.2vw, 32px); }
	.fv__copy-lead { font-size: clamp(22px, 2.2vw, 32px); }
	.fv__en { font-size: clamp(36px, 4.4vw, 64px); top: auto; bottom: 16px; }
	.about { padding: 64px 40px 80px; }
	.about__en { width: auto; }
	.about__contents { flex-wrap: wrap; gap: 40px; padding: 0; }
	.about__text-group { width: 100%; padding-top: 0; }
	.service__inner { padding: 100px 40px; }
	.service__contents { --service-pad: 0px; padding: 0; }
	.service__main { flex-wrap: wrap; gap: 40px; }
	.service-card-m { width: 100%; }
	.service-card-s { width: 100%; }
	.flow__inner { padding: 100px 40px; gap: 40px; }
	.flow-steps { width: 55%; padding-right: 0; }
	.works__wrap { padding: 80px 40px; }
	.works__contents { gap: 24px; }
	.works__cards { flex: 1; min-width: 0; width: auto; gap: 16px; }
	.work-card { width: calc((100% - 32px) / 3); min-width: 0; }
	.top-news__title-group { left: 40px; }
	.top-news__wrap { width: 72%; padding: 32px 40px 48px 32px; }
	.cta-group { padding: 48px 24px; }
	.cta-card--form { width: 60%; }
	.cta-card__inner--right { padding: 40px; }

	/* 下層共通 */
	.mv { padding: 160px 40px 20px; }
	.mv__img { width: 50%; }
	.news-archive__contents { flex-wrap: wrap; gap: 32px; padding: 0 0 0 40px; }
	.news-archive__wrap { width: 100%; padding: 48px 40px; }
	.news-archive__notice-wrap { padding: 48px 40px 0; }
	.news-single, .contact, .privacy, .contact-complete { padding-left: 40px; padding-right: 40px; }
	.mv--single { padding: 20px 40px; }
	.contact-tel { padding: 0 24px 80px; }
	.contact-form { padding: 48px; }

	/* ABOUT */
	.message { padding: 64px 40px 0; }
	.message__photo { width: 62%; margin-inline: auto; }
	.message-body { padding: 80px 40px; }
	.message-body__text { width: 60%; padding-left: 0; }
	.strength__wrap { width: auto; gap: 48px; padding: 48px 40px 80px; }
	.strength__slides { width: 100%; }
	.fields__inner { padding: 64px 40px; }
	.sub-cta { padding: 48px 40px; }
	.sub-cta__card { min-width: 0; }
	.sub-cta__cards { gap: 24px; }
	.company__title { padding: 0 40px; }
	.company__wrap { padding-left: 0; }
	.company__table { width: 76%; padding: 48px 60px 48px 40px; }
	.access { padding-left: 40px; }
	.access__map { width: 45%; }

	/* WORKS */
	.works-archive { padding: 0 40px 80px; }
	.works-filter__en { margin-right: -40px; }
	.works-archive__grid .work-card { width: auto; }
	.works-mv { padding-left: 40px; }
	.works-mv__photo { width: 55%; height: auto; aspect-ratio: 960 / 500; }
	.breadcrumb--works, .works-overview, .works-gallery, .works-point { padding-left: 40px; padding-right: 40px; }
	.works-related { padding: 64px 40px 0; }
	.works-related__cards .work-card { width: calc((100% - 48px) / 3); min-width: 240px; }
	.works-back { padding: 40px 40px 80px; }
}

/* 小型タブレット（768〜899px）: PCヘッダーが収まらないためSPヘッダー+drawerを使う */
@media (min-width: 768px) and (max-width: 899px) {
	.header { height: 72px; padding-left: 16px; }
	:root { --header-h: 72px; }
	.header__right { display: none; }
	.drawer-toggle {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 6px;
		width: 72px;
		height: 72px;
		padding: 10px;
		border: 0;
		border-radius: 0 0 0 10px;
		background: var(--color-navy);
		cursor: pointer;
	}
	.drawer-toggle__lines { display: flex; flex-direction: column; gap: 8px; width: 30px; }
	.drawer-toggle__lines span { display: block; height: 2px; background: #fff; }
	.drawer-toggle__label { font-family: var(--font-en); font-weight: 600; font-size: 12px; line-height: 1; color: #fff; }
	.drawer-toggle:focus-visible { outline: 2px solid var(--color-yellow-dusty); outline-offset: 2px; }
}

/* ============================================================
   流体スケール（リキッド）レイヤー
   min=SPカンプ(375)値 / preferred=PC値÷1440×100vw / max=PCカンプ値
   → 1440pxと375pxではカンプとピクセル一致、その間は連続変化
   ============================================================ */
:root {
	/* EN装飾 */
	--fs-en-hero: clamp(60px, 12.5vw, 180px);    /* EN/180 ⇄ EN/SP/60 */
	--fs-en-card: clamp(60px, 8.333vw, 120px);   /* EN/120 */
	--fs-en-num: clamp(22px, 2.083vw, 30px);     /* EN/30 */
	/* 見出し */
	--fs-h-xl: clamp(24px, 2.222vw, 32px);
	--fs-h-l: clamp(20px, 1.944vw, 28px);
	--fs-h-m: clamp(18px, 1.667vw, 24px);
	--fs-title-v: clamp(40px, 4.444vw, 64px);    /* 縦書き大見出し */
	/* 本文 */
	--fs-body-xl: clamp(16px, 1.667vw, 24px);
	--fs-body-l: clamp(16px, 1.389vw, 20px);
	--fs-body-xl: clamp(18px, 1.667vw, 24px); /* Figma Body/XL(24px) 用 */
	--fs-body-m: clamp(15px, 1.25vw, 18px);
	/* 余白 */
	--sp-section: clamp(64px, 9.722vw, 140px);   /* 140px系セクション上下 */
	--sp-block: clamp(48px, 6.944vw, 100px);     /* 100px系 */
	--sp-side: clamp(16px, 5.556vw, 80px);       /* 左右余白80px系 */
	--sp-side-wide: clamp(16px, 9.722vw, 140px); /* 左右余白140px系 */
}

@media (min-width: 768px) {
	/* --- EN装飾を流体化（全セクション共通） --- */
	.about__en, .service__en, .flow__en, .top-news__en, .mv__en,
	.message__en, .strength__en, .fields__en, .company__en, .access__en,
	.works-filter__en, .works-overview__en, .works-gallery__en, .works-point__en,
	.notfound-mv__en { font-size: var(--fs-en-hero); }
	.works__en { font-size: var(--fs-en-hero); }
	.cta-card__en { font-size: var(--fs-en-card); }

	/* --- 見出し・本文の主要どころを流体化 --- */
	.mv__ja, .flow__heading, .top-news__heading, .works-filter__ja,
	.works-overview__ja, .works-gallery__ja, .works-point__ja,
	.company__ja, .access__ja, .fields__ja, .cta-card__ja { font-size: var(--fs-h-xl); }
	.news-single__title, .works-mv__title, .contact-complete__title,
	.message-topic__title, .strength__caption, .service-area__title,
	.news-category__title, .works-filter__label { font-size: var(--fs-h-l); }
	.flow-step__title, .contact-form__section { font-size: var(--fs-h-m); }
	.about__title-item, .about__title-x, .service__title, .strength__title { font-size: var(--fs-title-v); }
	.about__text p, .strength__text { font-size: var(--fs-body-l); }
	.cta-card__text { font-size: var(--fs-body-xl); }
	.contact__intro { font-size: var(--fs-body-l); }

	/* --- 主要セクションの余白を流体化 --- */
	.service__inner, .flow__inner { padding-top: var(--sp-section); padding-bottom: var(--sp-section); }
	.top-news { padding-top: var(--sp-section); padding-bottom: var(--sp-section); }
	.strength { padding-top: var(--sp-section); padding-bottom: var(--sp-section); }
	.news-archive { padding-top: var(--sp-section); padding-bottom: var(--sp-block); }


}

@media (min-width: 768px) and (max-width: 999px) {
	.notfound { height: auto; min-height: 464px; padding-right: 40px; padding-left: 40px; }
}

/* ============================================================
   1440px超え: 背景は全幅・内容幅は制限・FV英字は画面幅に比例
   ============================================================ */
@media (min-width: 1440px) {
	/* FV: 写真を左右余白ぶんまで拡大（高さは緩やかに上限） */
	.fv { padding-left: 35px; padding-right: 35px; }
	.fv__en { font-size: 4.444444vw; }
	.fv .fv__bg { max-width: none; aspect-ratio: auto; height: clamp(628px, 43.6vw, 760px); }

	/* 下層MV写真: 右半分を占有 */
	.mv__img { width: max(720px, 50%); }
	.mv--single__photo { max-width: 1280px; margin: 0 auto; width: 100%; }

	/* 右端アンカーの白パネル: 左端を「1440中央揃えのコンテンツ左端」に固定 */
	.top-news__wrap { width: auto; margin-left: calc(50% - 290px); }
	.top-news__title-group { left: calc(50% - 640px); }
	.strength__wrap { margin-left: 80px; width: calc(100% - 80px); height: 813px; padding-left: calc(50vw - 640px); }
	/* Figmaは180px行を縦97%に変形した174.65px枠でAuto Layout計算するため、
	   CSSの変形前行高との差5.35pxも重なり量へ含める */
	.strength__en { margin-bottom: calc(-26px - 5.35px); }
	.strength__left { flex: 0 0 160px; width: 160px; min-width: 0; height: 633px; }
	.strength__title-group { width: 160px; }
	.strength__label, .strength__title {
		flex: 0 0 70px;
		width: 70px;
		box-sizing: border-box;
		writing-mode: horizontal-tb;
		font-feature-settings: normal;
		word-break: break-all;
		text-align: center;
	}
	.strength__slides { flex: 0 0 820px; height: 633px; box-sizing: border-box; }
	.news-archive__contents { padding-left: calc(50% - 580px); }
	.news-archive__notice-wrap { padding-left: calc(50% - 580px); padding-right: calc(50% - 580px); }

	/* CTAカード帯: 画面いっぱいに */
	.cta-group__row, .cta-card--recruit { max-width: none; }
	.cta-card--form { width: auto; flex: 1; }
	.cta-card--tel { flex: 0 0 508px; }

	/* コンテンツ系は中央上限 */
	.contact__contents, .privacy__contents { max-width: 1160px; }
	.news-single__contents { max-width: 1160px; margin-left: auto; margin-right: auto; }
	.works-archive { padding-left: calc(50% - 640px); padding-right: calc(50% - 640px); }
	.service__contents { max-width: 1280px; }
	.flow__inner { max-width: 1440px; }
	.about__contents { max-width: 1280px; margin: 0 auto; }
	.company__wrap { padding-left: 0; }
	.company__table { width: calc(50% + 370px); padding-left: calc(50% - 580px); }
	/* 広幅でもFIELDS・協力会社・ACCESSの内容幅は基準カンプ内に収める */
	.fields__inner { max-width: 1440px; margin-inline: auto; }
	.sub-cta__panel { max-width: 1280px; margin-inline: auto; }
	.access { padding-left: calc(50% - 640px); padding-right: calc(50% - 720px); max-width: none; }
	.access__map { width: calc(100% - 578px); }
	.breadcrumb--works { padding-left: 80px; }
	.works-gallery, .works-point { padding-left: calc(50% - 640px); padding-right: calc(50% - 640px); }
	/* OVERVIEWは白パネルを右端に接したまま伸ばすため右paddingなし */
	.works-overview { padding-left: calc(50% - 640px); padding-right: 0; }
	.works-related { padding-left: calc(50% - 640px); padding-right: calc(50% - 640px); }
	.works-back { padding-right: calc(50% - 640px); }
}

/* ============================================================
   施工実績一覧 改訂（修正後カンプ 498:2774）
   ============================================================ */
@media (min-width: 1280px) {
}
.works-archive__grid .work-card { width: auto; }
.work-card__img { height: auto; aspect-ratio: 336 / 213; }
.work-card__tags:empty { display: none; }
.work-card__tags .work-card__tag { position: static; }
.work-card__tag--outline { background: #fff; color: var(--color-navy); border: 1px solid var(--color-navy); padding: 6px 11px; }
.works-archive__count {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}
.works-pager { display: flex; justify-content: center; gap: 8px; margin-top: 40px; }
.works-pager .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	height: 44px;
	border: 0;
	border-radius: 50%;
	background: var(--color-bg-white);
	color: var(--color-navy);
	font-family: var(--font-en);
	font-weight: 600;
	font-size: 16px;
	cursor: pointer;
}
.works-pager .page-numbers.current { background: var(--color-navy); color: #fff; }
.works-pager .page-numbers:focus-visible { outline: 2px solid var(--color-navy); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) {
	.works-pager .page-numbers { transition: opacity 0.3s ease; }
	.works-pager .page-numbers:hover { opacity: 0.6; }
}
.works-archive__divider { max-width: 1280px; margin: 80px auto 0; border: 0; border-top: 1px solid var(--color-gray-400); }
@media (max-width: 767px) {
	.works-archive__divider { margin-top: 48px; }
}

/* ============================================================
   施工実績詳細 改訂（works-top 960×500 / OVERVIEW右寄せ / GALLERY白帯）
   ============================================================ */
.works-mv { min-height: 500px; padding-top: 50px; }
.works-gallery { background: var(--color-bg-gray); }
.works-gallery__grid { max-width: 1280px; margin-left: auto; margin-right: auto; }
.works-gallery__item img { aspect-ratio: 394 / 270; }
@media (max-width: 767px) {
	.works-mv { min-height: 0; }
	.works-mv__photo { width: calc(100% - 49px); height: 280px; align-self: flex-end; }
	.works-overview__table { padding: 8px 16px; }
}

/* ============================================================
   ABOUT FIELDS 改訂（白ピルグリッド / CTA→施工実績）
   ============================================================ */


/* TOP NEWS: 新統合カンプ515は旧仕様(1054)に回帰 */
.top-news__notice { padding: 24px 24px 40px; gap: 23px; }

/* ============================================================
   施工実績カード 新形状（515:22301 WORKS(共通)）
   画像h200(ノッチなし) → タグ2種 → 会社名/罫線/キャプション → CTA-small
   ============================================================ */
.work-card {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 24px;
	padding: 12px 12px 24px;
	border-radius: 10px;
	background: var(--color-bg-white);
	overflow: hidden;
	width: auto;
}
.work-card__main { display: flex; flex-direction: column; gap: 13px; }
.work-card__media { position: relative; display: block; overflow: hidden; border-radius: 10px; }
.work-card__img { width: 100%; height: 200px; aspect-ratio: auto; object-fit: cover; transition: transform 0.4s ease; }
.work-card__tags { position: static; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; max-width: none; background: none; padding: 0; border-radius: 0; }
.work-card__tags::before, .work-card__tags::after { content: none; }
.work-card__tag { position: static; }
.work-card__text { display: flex; flex-direction: column; gap: 10px; padding: 0 8px; transition: opacity 0.25s ease; }
.work-card__title { font-size: 20px; line-height: 1.6; font-weight: 500; letter-spacing: 2px; color: var(--color-font-black); }
.work-card__desc { font-size: 16px; line-height: 1.6; color: var(--color-font-black); }
.work-card__cta { display: flex; justify-content: flex-end; }
/* TOPのWORKSセクションも同カードのためグリッド寸法のみ差し替え（PCのみ。SPは縦積み全幅） */
@media (min-width: 768px) {
	.works__cards .work-card { width: calc((100% - 40px) / 3); }
}

/* ============================================================
   流体スケール（リキッド）レイヤー
   min=SPカンプ(375)値 / preferred=PC値÷1440×100vw / max=PCカンプ値
   → 1440pxと375pxではカンプとピクセル一致、その間は連続変化
   ============================================================ */
:root {
	/* EN装飾 */
	--fs-en-hero: clamp(60px, 12.5vw, 180px);    /* EN/180 ⇄ EN/SP/60 */
	--fs-en-card: clamp(60px, 8.333vw, 120px);   /* EN/120 */
	--fs-en-num: clamp(22px, 2.083vw, 30px);     /* EN/30 */
	/* 見出し */
	--fs-h-xl: clamp(24px, 2.222vw, 32px);
	--fs-h-l: clamp(20px, 1.944vw, 28px);
	--fs-h-m: clamp(18px, 1.667vw, 24px);
	--fs-title-v: clamp(40px, 4.444vw, 64px);    /* 縦書き大見出し */
	/* 本文 */
	--fs-body-xl: clamp(16px, 1.667vw, 24px);
	--fs-body-l: clamp(16px, 1.389vw, 20px);
	--fs-body-xl: clamp(18px, 1.667vw, 24px); /* Figma Body/XL(24px) 用 */
	--fs-body-m: clamp(15px, 1.25vw, 18px);
	/* 余白 */
	--sp-section: clamp(64px, 9.722vw, 140px);   /* 140px系セクション上下 */
	--sp-block: clamp(48px, 6.944vw, 100px);     /* 100px系 */
	--sp-side: clamp(16px, 5.556vw, 80px);       /* 左右余白80px系 */
	--sp-side-wide: clamp(16px, 9.722vw, 140px); /* 左右余白140px系 */
}



@media (min-width: 768px) and (max-width: 999px) {
	.notfound { height: auto; min-height: 464px; padding-right: 40px; padding-left: 40px; }
}

/* ============================================================
   ABOUT FIELDS 改訂（白ピルグリッド / CTA→施工実績）
   ============================================================ */


/* TOP NEWS: 新統合カンプ515は旧仕様(1054)に回帰 */
.top-news__notice { padding: 24px 24px 40px; gap: 23px; }

/* ============================================================
   カードの切り欠きをCSSで動的生成（タグ幅に自動追従）
   画像側の焼き込みノッチに依存しない
   ============================================================ */
.work-card__media { border-radius: 10px; }
/* 凹み角（プレート右・プレート下） */

/* ============================================================
   固定px position/size の撲滅パス（768px以上）
   値はすべて「1440カンプ時に従来と同一」になる%・aspect-ratio
   ============================================================ */
@media (min-width: 768px) {
	/* FV: コピー・英字を写真基準の%に */
	.fv__bg { height: auto; aspect-ratio: 1370 / 628; max-height: 760px; }
	.fv__copy { right: 3.28%; top: 11.15%; }   /* = 45px / 70px @1370x628 */
	.fv__en { left: 2.12%; bottom: 1.9%; }     /* = 29px / 12px */

	/* WORKS(TOP): タイトル帯を比率化・英字は左下%アンカー */
	.works__title-bg { height: auto; aspect-ratio: 12 / 5; }
	.works__en { left: 6.94%; top: auto; bottom: 1.8%; }

	/* 下層MV: 帯とアイキャッチを比率化 */
	.mv { height: auto; min-height: clamp(480px, 41.67vw, 640px); }
	.mv__img { height: auto; aspect-ratio: 16 / 9; }
	.mv--single__photo { height: auto; aspect-ratio: 1280 / 520; }
	.notfound-mv { height: auto; aspect-ratio: 2 / 1; max-height: 820px; }

	/* CTAカード帯: 高さを流動化（1440時=538px） */
	.cta-card { height: auto; min-height: clamp(420px, 31.94vw, 620px); }
	/* 1440超はFigma実測%クロップが破綻するためcoverに切替 */
	@media (min-width: 1441px) {
		}
	.cta-group__row { height: auto; }

	/* ABOUT: メッセージ写真・STRENGTH画像を比率化 */
	.message__photo {
		width: min(820px, 56.94vw);
		height: auto;
		aspect-ratio: 820 / 460;
		margin-inline: auto;
	}
	.strength__media img { height: auto; aspect-ratio: 820 / 403; }

	/* 施工実績詳細: 写真を比率化 */
}

/* ============================================================
   ABOUT MESSAGE アニメーション（Figma アニメーション詳細の仕様）
   背景画像を固定し、テキストがその上をスクロールする控えめな表現
   ============================================================ */
.message-body { padding: 0; }
.message-body__sticky {
	position: sticky;
	top: 0;
	height: 100vh;
	height: 100dvh;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	margin-bottom: -100vh; /* 後続コンテンツを背景の上に重ねる */
	margin-bottom: -100dvh;
	background: var(--color-bg-gray);
}
.message-body__visual {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.message-body__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.message-body::before { content: none; }
.message-body__visual::after {
	content: '';
	position: absolute;
	inset: 0;
  background: linear-gradient(0deg, rgba(26, 27, 26, 0.60) 0%, rgba(26, 27, 26, 0.60) 100%), url(../img/common/mv-contact.jpg) lightgray 50% / cover no-repeat;
}
.message-body__inner { position: relative; padding: 100px 80px; }

/* 導入写真から全画面の固定背景へ、スクロール量に同期して連続的に拡大する */
.message-body.is-motion-enabled .message-body__inner {
	padding-top: 62svh;
	padding-bottom: 18svh;
	z-index: 60;
	opacity: var(--message-copy-opacity, 0);
}
.message-body.is-motion-enabled .message-body__visual { opacity: 0; }
.message-body.is-motion-enabled.is-motion-expanded .message-body__visual { opacity: 1; }
.message-body__transition {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 50;
	overflow: hidden;
	pointer-events: none;
	background: var(--color-bg-gray);
	transform-origin: top left;
}
.message-body__transition img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 50%;
}
.message-body__transition::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, rgba(26, 27, 26, 0.60) 0%, rgba(26, 27, 26, 0.60) 100%), url(../img/common/mv-contact.jpg) lightgray 50% / cover no-repeat;
	opacity: var(--message-overlay-opacity, 0);
}
.message-body.is-motion-transitioning .message-body__transition {
	display: block;
	will-change: transform, width, height, border-radius;
}
.message__photo.is-motion-source-hidden img { visibility: hidden; }

/* トピックはスクロールで順に現れる（JS初期化時に .js-anim を付与した時のみ隠す） */
.js-anim .message-topic {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.8s ease, transform 0.8s ease;
}
.js-anim .message-topic.is-inview { opacity: 1; transform: none; }
@media print {
	/* 閲覧中のモーション状態に左右されず、印刷・PDFでは全内容を静止表示する */
	.js-anim .message-topic {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
	.message-body.is-motion-enabled .message-body__inner {
		padding: 100px 80px !important;
		opacity: 1 !important;
	}
	.message-body__sticky {
		position: absolute !important;
		inset: 0;
		height: 100% !important;
		margin-bottom: 0 !important;
	}
	.message-body__visual { opacity: 1 !important; }
	.message-body__transition { display: none !important; }
	.message__photo.is-motion-source-hidden img { visibility: visible !important; }
}
@media (prefers-reduced-motion: reduce) {
	.js-anim .message-topic { opacity: 1; transform: none; transition: none; }
	.message-body__sticky {
		position: absolute;
		inset: 0;
		height: 100%;
		margin-bottom: 0;
	}
}
@media (max-width: 767px) {
	.message-body__inner { padding: 48px 16px; }
	.message-body.is-motion-enabled .message-body__inner {
		padding-top: 62svh;
		padding-bottom: 18svh;
	}
}


/* ============================================================
   STRENGTH: スクロール連動のピン留め切替
   「安心×信頼」を固定し、スクロールで強み詳細が1つずつ入れ替わる
   （デザイナー意図 / Figma 425:25449・アニメイメージ 425:25450）
   ピン中は白パネル全体（ドット含む）がビューポート内に収まること
   ============================================================ */
.strength--pinned .strength__pin {
	position: sticky;
	top: var(--header-h);
	background: var(--color-gray-200);
	isolation: isolate;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
/* 完成カンプの寸法を保ち、収まらない画面高ではJS側でピンを解除する */
.strength--pinned .strength__wrap {
	max-height: none;
}
.strength--pinned .strength__slides { display: grid; min-height: 0; }
.strength--pinned .strength__slide {
	display: flex;
	grid-area: 1 / 1;   /* 全スライドを同セルに重ね、高さは最長基準で固定 */
	min-height: 0;
	opacity: 0;
	transition: opacity 0.45s ease;
	pointer-events: none;
}
.strength--pinned .strength__slide.is-active { opacity: 1; pointer-events: auto; }
.strength--pinned .strength__media { flex: none; min-height: 0; overflow: hidden; border-radius: 20px; }
.strength--pinned .strength__media img { width: 100%; height: auto; aspect-ratio: 820 / 403; object-fit: cover; }
.strength--pinned .strength__text { font-size: var(--fs-body-l); }
.strength--pinned .strength__left { justify-content: space-between; }
@media (prefers-reduced-motion: reduce) {
	.strength--pinned .strength__slide { transition: none; }
}

@media (max-width: 767px) and (max-height: 700px) {
	/* iPhone SE相当の短い画面でも白パネル下端を欠けさせない */
	.strength--pinned .strength__en { margin-bottom: -28px; }
	.strength--pinned .strength__wrap { padding-top: 8px; padding-bottom: 8px; }
}

/* 詳細works-top: 日付/最寄駅（515:22471） */
.works-mv__meta { display: flex; flex-direction: column; gap: 4px; }
.works-mv__station { display: flex; align-items: center; gap: 6px; font-size: 12px; line-height: 1; font-weight: 500; color: var(--color-gray-600); }
.works-mv__tags { flex-direction: column; align-items: flex-start; }
.works-mv__tag + .works-mv__tag { margin-top: 0; }

/* 戻る系CTAの幅（Figma実寸） */
.contact-complete__back .btn, .privacy__back .btn, .notfound__back .btn,
.works-back .btn, .flow__title-group > .btn { min-width: 367px; }
.news-single__back .btn { min-width: 327px; }
.works__wrap .btn:not(.btn--small) { min-width: 367px; }
@media (max-width: 767px) {
	.contact-complete__back .btn, .privacy__back .btn, .notfound__back .btn,
	.works-back .btn, .news-single__back .btn, .works__wrap .btn:not(.btn--small),
	.flow__title-group > .btn { min-width: 0; }
}

/* CTA-group PC: お問い合わせフォームボタンはFigma 387px */
@media (min-width: 768px) {
	.cta-card--form .btn { min-width: 387px; }
}

.contact-form__field-error { margin-top: 6px; font-size: 14px; color: #C43C3C; }

/* TOP NEWS: 一覧ボタンはPC=タイトル側 / SP=白枠内（カンプ 515:24848） */
.top-news__wrap-btn { display: none; }
@media (max-width: 767px) {
	.top-news__title-group > .btn { display: none; }
	.top-news__wrap-btn { display: flex; justify-content: flex-end; }
	.top-news__wrap-btn .btn { width: 287px; min-width: 0; }
}

/* works詳細 SP: ギャラリーはカンプ 343×270・間隔32px（515:28177） */
@media (max-width: 767px) {
	.works-gallery__grid { gap: 32px; }
	.works-gallery__item img { aspect-ratio: 343 / 270; }
}

/* ============================================================
   EN装飾と見出しの重なり順
   __en は transform(scaleY) がスタッキングコンテキストを作るため、
   静的なままの見出しより前に描画されてしまう。
   デザイン意図（Figma Title/M: 見出しがENの手前）に合わせ、
   ENと重なる見出し側を前面に出す。
   ============================================================ */
.mv__ja, .company__ja, .access__ja, .fields__ja, .cta-card__ja,
.flow__heading, .top-news__heading, .works-filter__ja,
.works-overview__ja, .works-gallery__ja, .works-point__ja,
.message__ja, .strength__ja, .notfound-mv__ja, .works__label,
.news-single__title { position: relative; z-index: 1; }

/* STRENGTHキャプション: PCは元の行割り・SPは読点区切り2行（515:29460） */
.strength__captions--sp { display: none; }
@media (max-width: 767px) {
	.strength__captions--pc { display: none; }
	.strength__captions--sp { display: flex; }
	.strength__caption { white-space: nowrap; }
	.strength__slide:nth-child(3) .strength__captions--sp .strength__caption { font-size: 20px; }
}

/* 追従ヘッダー分のアンカー余白 */
section[id], [id^="works"], [id^="news"] { scroll-margin-top: var(--header-h); }

/* タブレット(768-1199): 狭いTELカードで文字が溢れないよう流体化 */
@media (min-width: 768px) and (max-width: 1199px) {
	.cta-card__tel { gap: clamp(12px, 2vw, 29px); }
	.cta-card__tel-label { font-size: clamp(13px, 1.8vw, 18px); }
	.cta-card__tel-hours { font-size: clamp(20px, 3vw, 30px); }
	.cta-card--tel .cta-card__inner { padding: clamp(24px, 3.5vw, 45px) clamp(20px, 3vw, 40px); }
	.about__title-item, .about__title-x, .strength__title, .strength__label { width: auto; }
}

/* ==== SP: TELカードのpaddingをカンプ実測（16px）に ==== */
@media (max-width: 767px) {
	.cta-card--tel .cta-card__inner { padding: 24px 16px; }
}

/* ==== タブレット調整: WORKSカード2列・NEWS左カラム被り解消 ==== */
@media (min-width: 768px) and (max-width: 1023px) {
	.works__cards { flex-wrap: wrap; }
	.works__cards .work-card { width: calc((100% - 16px) / 2); }
}
@media (min-width: 768px) and (max-width: 1099px) {
	.news-link { height: auto; }
	.news-link__content { flex-wrap: wrap; row-gap: 10px; }
	.news-link__title { width: 100%; max-width: none; white-space: normal; }
	.top-news__title-group { left: 40px; gap: 48px; }
	.top-news__en { font-size: 120px; margin-bottom: -36px; }
	.top-news__wrap { width: min(1010px, calc(100% - 360px)); padding: 32px 40px 64px 40px; }
}


/* ==== RECRUIT背景: 縮尺固定(カンプ1440の倍率)で、狭い幅では中央から切れていく ==== */
@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
	/* 縮尺固定のtranslateを保ったままズーム（hoverのscaleがtranslateを上書きして飛ぶのを防ぐ） */
	.cta-card--recruit:hover .cta-card__photo { transform: translate(-50%, -50%) scale(1.03); }
}
@media (min-width: 768px) {
	.cta-card--recruit .cta-card__photo {
		width: max(1370px, 100%);
		height: auto;
		aspect-ratio: 2200 / 739;
		inset: 50% auto auto 50%;
		transform: translate(-50%, -50%);
		max-width: none;
		min-height: 0;
		object-fit: cover;
	}
}

/* ==== TOP WORKS: 広幅ではラベルとカードの距離(72px)を保ち、外側の余白だけが伸びる ==== */
@media (min-width: 1441px) {
	.works__contents { max-width: 1280px; margin-left: auto; margin-right: auto; width: 100%; }
}

/* ============================================================
   施工実績 ページャ切替アニメーション（main.js の .is-paging と対）
   旧ページが沈みながら消え、高さが滑らかに変わり、新ページが下からふわっと現れる
   ============================================================ */
.works-archive__grid,
.works-simple__grid {
	transition: height 0.3s ease, opacity 0.2s ease, transform 0.2s ease;
}
.works-archive__grid.is-paging,
.works-simple__grid.is-paging {
	opacity: 0;
	transform: translateY(8px);
}
@media (prefers-reduced-motion: reduce) {
	.works-archive__grid,
	.works-simple__grid { transition: none; }
}

/* ============================================================
   施工詳細 関連事例: カードが1件でも潰れないようにする
   （.works-related__cards は flex アイテムで、1件だとコンテンツ幅に
     縮み、カード幅 1/3 との循環で極端に細くなるため残り幅を常に確保）
   ============================================================ */
.works-related__cards { flex: 1; min-width: 0; }

/* ============================================================
   works系 SPセクションタイトル共通化（Title(sp)=515:28189）
   Figmaテキストスタイル EN/SP/80（Figtree 80px/700/lh1/ls-2px）と
   Heading/Medium（Zen Kaku 24px/500/lh1.6/ls2px）に統一。
   配置(align/margin)や色は各セクション個別のまま
   ============================================================ */
@media (max-width: 767px) {
	.works-filter__en,  .works-gallery__en, .works-point__en {
		font-size: 80px;
		font-weight: 700;
		line-height: 1;
		letter-spacing: -2px;
		margin-bottom: -40px;
	}
  .works-overview__en {
    font-size: 70px;
    font-weight: 700;
		line-height: 1;
		letter-spacing: -2px;
		margin-bottom: -40px;
  }
	.works-filter__ja, .works-overview__ja, .works-gallery__ja, .works-point__ja {
		font-size: 24px;
		font-weight: 500;
		letter-spacing: 2px;
		line-height: 1.6;
		padding: 10px 16px;
	}
}

/* ============================================================
   施工詳細 OVERVIEW SP/タブレット（カンプ515:28139 / OVERVIEW=515:28163）
   1023px以下はSP寄せ: 白パネル全幅(右端まで)・左角丸30・行は縦積み。
   1024px以上はPCスタイル(右端接続パネル)に切替（2026-09-04 ユーザー方針）。
   ENサイズはユーザー調整値の70pxに合わせる
   ============================================================ */
@media (max-width: 1023px) {
	.works-overview { padding: 64px 0; }
	.works-overview__title { padding: 0 16px; }
	.works-overview__en { font-size: 70px; font-weight: 700; line-height: 1; letter-spacing: -2px; margin-bottom: -40px; align-self: flex-start; margin-right: 0; }
	.works-overview__ja { font-size: 24px; font-weight: 500; letter-spacing: 2px; line-height: 1.6; padding: 10px 16px; margin-bottom: 16px; }
	.works-overview__table {
		width: 100%;
		margin: 0;
		border-radius: 30px 0 0 30px;
		padding: 32px 20px 48px;
	}
	.works-overview__row { flex-direction: column; gap: 4px; padding: 8px 8px 9px; border-bottom: 1px solid var(--color-gray-200); }
	.works-overview__row:last-child { border-bottom: 0; }
	.works-overview__row dt { width: auto; font-size: 18px; font-weight: 500; letter-spacing: 2px; color: var(--color-font-black); line-height: 1.6; }
}

/* 1024〜1439px: PCスタイルのまま白パネルを右端に接続（中間幅層のpadding-right 40pxを打ち消す） */
@media (min-width: 1024px) and (max-width: 1439px) {
	.works-overview { padding-right: 0; }
}

/* ============================================================
   TOP/ABOUT タブレット(768〜1023px) SP寄せ層（SP層から機械抽出）
   対象: about / service / flow / message / strength / fields / access
   （fv・works帯・top-news・company・sub-cta・cta-groupは820pxで成立
     しているため従来のタブレット層のまま。1024px以上もPC縮小を維持）
   2026-09-05 ユーザー方針: 768-1023はSP寄り、1024からPCスタイル
   ============================================================ */
@media (min-width: 768px) and (max-width: 1023px) {
	/* --- from top.css --- */
	.about { padding: 40px 16px 64px; }
	.about__en { position: absolute; left: 4px; top: 412.34px; width: auto; margin: 0; font-size: 80px; font-weight: 700; letter-spacing: -2px; text-align: left; transform: scaleY(0.97); transform-origin: left top; }
	.about__contents { flex-direction: column; gap: 80px; padding: 0; }
	.about__title-group { gap: 46px; width: 100%; padding: 0 16px; align-items: center; justify-content: center; }
	.about__label { display: flex; align-items: center; justify-content: center; width: 70px; padding: 10px 20px; font-size: 32px; writing-mode: horizontal-tb; word-break: break-word; }
	.about__title { gap: 6px; padding-top: 20px; }
	.about__title-item { width: 46.445px; font-size: 46px; line-height: 1.2; writing-mode: horizontal-tb; word-break: break-word; }
	.about__title-item:first-child { line-height: 0; }
	.about__title-item:first-child > span { line-height: 1.2; }
	.about__title-item:first-child > .about__title-item-tight { line-height: 1; }
	.about__title-x { height: 246.825px; align-self: flex-start; justify-content: center; font-size: 42.464px; line-height: 1.6; }
	.about__text-group { width: 100%; padding-top: 0; gap: 50px; align-items: flex-end; }
	.about__text p { font-size: 20px; line-height: 2; }
	.about__text-group .btn { width: 287px; min-width: 0; }
	.service::before { border-radius: 20px 20px 0 0; }
	.service__inner { padding: 64px 16px; }
	.service__contents, .service__main { display: contents; }
	.service__title-group { order: 1; justify-content: space-between; align-self: stretch; width: 100%; margin-bottom: -16px; padding: 0 32px 0 16px; gap: 0; }
	.service__en { order: 2; align-self: stretch; margin-bottom: -16px; font-size: 80px; font-weight: 700; letter-spacing: -2px; }
	.service-card-m { order: 3; margin-bottom: 32px; }
	.service__cards { order: 4; margin-bottom: 32px; }
	.service-area { order: 5; }
	.service-card-m { width: 100%; }
	.service-card-m picture, .service-card-s picture { display: block; width: 100%; height: auto; }
	.service-card-m__img, .service-card-s__img { width: 100%; height: auto; }
	.service-card-m__title { font-size: 18px; gap: 8px; }
	.service-card-m__title img { width: 12px; height: 12px; }
	.service-card-m__label { z-index: 2; top: calc(100% - 54px); bottom: auto; width: min(63.3%, calc(100% - 40px)); padding: 0 0 10px; }
	.service__label { order: 1; }
	.service__lead { order: 2; }
	.service__title { order: 3; }
	.service__lead { padding-top: 40px; }
	.service__title { width: 55px; font-size: 46px; }
	.service-area { padding: 32.667px 16.667px; }
	.service-area__title { font-size: 20px; letter-spacing: 2px; }
	.service-area__item { font-size: 16px; }
	.service-area__note { font-size: 16px; }
	.service__cards { grid-template-columns: minmax(0, 1fr); row-gap: 32px; }
	.flow::before { border-radius: 20px 20px 0 0; }
	.flow__inner { flex-direction: column; gap: 32px; padding: 64px 16px; }
	.flow__title-group { display: contents; }
	.flow__title { order: 1; }
	.flow-steps { order: 2; }
	.flow__title-group > .btn { order: 3; width: 100%; max-width: 400px; min-width: 0; margin-left: auto; margin-right: auto; }
	.flow__en { margin-bottom: -40px; font-size: 80px; font-weight: 700; }
	.flow__heading { padding: 10px 16px; font-size: 24px; }
	.flow-steps { width: 100%; padding: 0; gap: 40px; }
	.flow-steps::before { left: 8px; top: 8.5px; height: calc(100% - 17px); border-left: 1px solid var(--color-yellow-dusty); }
	.flow-step__head { gap: 8px; }
	.flow-step__dot { margin-right: 0; }
	.flow-step__title { margin-left: 2px; font-size: 20px; letter-spacing: 2px; }
	.flow-step__num { font-size: 30px; }
	.flow-step__desc { padding-left: 24px; font-size: 16px; }
	/* --- from page-about.css --- */
	.fields__lines--pc { display: none; }
	.fields__lines--sp { display: flex; flex-direction: column; gap: 0; margin-top: 0; }
	.fields__row-sp { padding: 16px 8px; border-bottom: 1px solid var(--color-bg-white); font-size: 24px; line-height: 1.6; font-weight: 500; letter-spacing: 2px; color: #fff; white-space: nowrap; }
	.message { padding: 64px 0; background: var(--color-gray-200); }
	.message__en { font-size: 60px; margin-bottom: 0; padding-left: 16px; text-align: left; }
	.message__intro { padding-bottom: 0; }
	.message__photo { width: calc(100% - 15px); height: 202px; margin: 0 auto; }
	.message__intro .message__title-group { display: none; }
	.message__title-group--body { position: static; display: flex; flex-direction: row-reverse; order: -1; margin: 0 0 48px; padding-left: 16px; justify-content: center; align-items: flex-start; gap: 47px; flex-wrap: nowrap; }
	.message__title-group--body .message__title { display: flex; gap: 12px; align-items: flex-start; }
	.message__title-group--body .message__title-line { font-size: 46px; line-height: 1.20; letter-spacing: 0.24em; padding: 8px 15px; border-radius: 6px; }
	.message__title-group--body .message__title-line:first-child { margin-top: 20px; }
	.message__title-group--body .message__label { font-size: 24px; line-height: 1.18; letter-spacing: 0.25em; padding: 8px 13px; border-radius: 6px; align-self: flex-start; }
	.message__title-line { font-size: 28px; padding: 12px 10px; }
	.message__label { font-size: 16px; padding: 8px 10px; }
	/* .message-body のpaddingは演出ブロックの { padding: 0 } が正（SP実効値と同じ）。
	   SP層の死にルール(48px 16px)を誤コピーして写真の全画面化が16pxズレていたため削除 */
	.message-body__inner { display: flex; flex-direction: column; }
	.message-body__text { width: 100%; padding: 0; gap: 32px; }
	.message-topic__title { font-size: 20px; letter-spacing: 1px; }
	.message-topic p { font-size: 14px; }
	.strength { padding: 64px 0; }
	.strength__en { font-size: 60px; padding: 0 16px; margin-bottom: -8px; }
	.strength__pin { display: flex; flex-direction: column; }
	.strength__title-group-sp { display: flex; order: 1; gap: 24px; padding: 0 16px 0 32px; margin-bottom: 24px; }
	.strength__en { order: 2; margin-bottom: -8px; z-index: 1; position: relative; }
	.strength__wrap { order: 3; flex-direction: column; gap: 32px; width: auto; margin-left: 0; border-radius: 30px 0 0 30px; padding: 32px 20px 48px; } /* SPの左角丸化(ユーザー編集)に追従 */
	.strength__left { display: none; }
	.strength__left { flex-direction: row; justify-content: space-between; align-items: flex-start; }
	.strength__title { font-size: 46px; }
	.strength__label { font-size: 32px; padding: 10px 20px; }
	.strength__dots { display: none; }
	.strength__slides { display: flex; flex-direction: column; gap: 32px; width: 100%; padding-top: 0; }
	.strength__slide { display: flex; }
	.strength__num { font-size: 30px; }
	.strength__media img { height: 280px; }
	.strength__captions { left: 16px; bottom: 16px; gap: 6px; }
	.strength__caption { letter-spacing: 0; }
	.strength__caption { font-size: 24px; letter-spacing: 0; padding: 0 4px; }
	.strength__text { font-size: 18px; line-height: 1.6; }
	.fields__inner { padding: 64px 16px; display: flex; flex-direction: column; gap: 32px; }
	.fields__en { font-size: 60px; margin-bottom: -10px; }
	.fields__ja { font-size: 22px; padding-left: 4px; }
	.fields__cta { margin-top: 0; max-width: none; }
	.fields__cta .btn { width: 100%; max-width: 400px; min-width: 0; margin-left: auto; margin-right: auto; }
	.access { flex-direction: column; padding: 64px 0 32px; gap: 24px; }
	.access__title-group { padding: 0 16px; }
	.access__en { font-size: 80px; margin-bottom: -40px; }
	.access__ja { font-size: 24px; padding: 10px 16px; }
	.access__text { margin-top: 32px; padding-left: 0; }
	.access__map { width: 100%; margin: 0; }
	.access__map iframe { height: 240px; border-radius: 0; }
	/* --- from overrides.css --- */
	.message-body__inner { padding: 48px 16px; }
	.message-body.is-motion-enabled .message-body__inner { padding-top: 62svh; padding-bottom: 18svh; }
	.strength--pinned .strength__wrap { padding-top: 8px; padding-bottom: 8px; }
	.flow__title-group > .btn { min-width: 0; }
	.strength__captions--pc { display: none; }
	.strength__captions--sp { display: flex; }
	.strength__caption { white-space: nowrap; }
	.strength__slide:nth-child(3) .strength__captions--sp .strength__caption { font-size: 20px; }

	/* --- 調整(2026-09-05): SERVICE小カードは768〜1023でも2列が収まる。
	       テキストはビューポート可変（768-1199タブレット層と同じ定義を復活） --- */
	.service__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; row-gap: 40px; }
	.service-card-s__label { width: min(66%, calc(100% - 40px)); }
	.service-card-s__title { font-size: clamp(14px, 2vw, 18px); }
	.service-card-s__desc, .service-card-m__desc { font-size: clamp(11px, 1.5vw, 14px); }

	/* --- 調整(2026-09-05): タイトル群の中央寄せ（左寄せの違和感解消・PC⇔SP切替も自然に） --- */
	.message__title-group--body { align-self: center; padding-left: 0; }
	.strength__en--pc { display: none; }
	.strength__en--sp { display: block; margin-top: 15px; padding-right: 0; text-align: right; } /* ENはタイトル群の下・右下(SPと同じFigma実測) */
	/* SUB-CTA: 768px付近でカード幅がボタンのmin-width(340px)を下回りはみ出すのを防ぐ */
	.sub-cta__card .btn { max-width: 100%; min-width: 0; }
	/* FLOW: ステップリストは読みやすい幅に絞って中央寄せ（2026-09-05 ユーザー要望） */
	.flow-steps { max-width: 640px; margin-left: auto; margin-right: auto; }

	/* --- 調整(2026-09-05): SUB-CTAはPC用余白(80/64px)が残りカード幅246pxまで潰れて
	       ボタンの円が圧縮されていた。2列を維持しつつ余白を詰めてカード幅を確保 --- */
	.sub-cta { padding: 48px 40px 64px; }
	.sub-cta__panel { padding: 32px 24px 40px; }
	.sub-cta__card { padding: 20px 20px 24px; }
	.sub-cta__cards { gap: 24px; }
	/* ボタンの黄円・矢印はflex圧縮させない（この幅帯の保険） */
	.btn__circle { flex-shrink: 0; }
}

/* ============================================================
   CTAカードのボタン: タブレット帯(768-1023)でカード幅より広い固定幅
   (387px)のままはみ出していたためカード内に収める
   ============================================================ */
@media (min-width: 768px) and (max-width: 1023px) {
	/* gap 62pxは最低保証として働き、幅が縮むと黄円がラベルに押されてピル外へ
	   溢れる。8pxに下げると余裕がある時はspace-betweenで従来配置のまま、
	   狭い時は円が右端(矢印と同位置)に収まる */
	.cta-card .btn { max-width: 100%; min-width: 0; gap: 8px; }
}

/* ============================================================
   お知らせ一覧 タブレット(768〜1023px)SP寄せ
   カテゴリを左サイドから上配置(全幅・ピル折返し)にし、記事リストを
   全幅に。タイトルはSPと同じ2行省略（2026-09-05 ユーザー要望）
   ============================================================ */
@media (min-width: 768px) and (max-width: 1023px) {
	.news-archive { padding: 64px 0 80px; }
	.news-archive__contents { flex-direction: column; gap: 32px; padding: 0 0 0 16px; }
	.news-category { width: 100%; padding-right: 16px; }
	.news-category__title { font-size: 20px; }
	.news-category__list { gap: 12px; }
	.news-category__item { min-width: 0; padding: 8px 16px; font-size: 14px; letter-spacing: 1px; }
	.news-archive__wrap { width: auto; align-self: stretch; margin-right: 16px; border-radius: 16px; padding: 8px 16px 32px; }
	.news-archive__notice-wrap { padding: 32px 16px 0; }
	.news-archive .news-link__date { width: auto; }
	.news-archive .news-link__title { width: auto; flex: 1; min-width: 0; max-width: none; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
}

/* ============================================================
   ページネーション共通仕様（カンプ515:25012）
   番号円の背景は BG/Gray #F8F8F9（白ではない）・矢印は番号群から32px
   離す。works(.works-pager)とnews(.pagination)の両系統に適用
   ============================================================ */
.pagination .page-numbers,
.works-pager .page-numbers { background: var(--color-bg-gray); }
.pagination .page-numbers.current,
.works-pager .page-numbers.current { background: var(--color-navy); }
.pagination .page-numbers.dots { background: transparent; min-width: 0; padding: 0 4px; }
.pagination .next, .works-pager .works-pager__arrow:last-child { margin-left: 24px; } /* gap8+24=32px */
.pagination .prev, .works-pager .works-pager__arrow:first-child { margin-right: 24px; }

/* ============================================================
   下層MV(アイキャッチ帯): 1441px以上でも左右80pxを保って画面幅に追従
   （1280固定だと広幅で左右余白だけが増えていくため）
   ============================================================ */
@media (min-width: 1441px) {
	.mv--single__photo { max-width: none; } /* 親の左右padding(80px)が余白を担う */
}

/* ============================================================
   下層MV(mv--single): タブレット帯は高さ固定をやめ写真直下にパンくず
   （写真はaspect-ratioで縮むのに高さ480px固定+space-betweenのままで
     間隔が最大147pxまで間延びしていた）
   ============================================================ */
@media (min-width: 768px) and (max-width: 1023px) {
	.mv--single { height: auto; min-height: 0; justify-content: flex-start; gap: 16px; }
	/* 記事本体もPC用余白(上80/左右140)が広すぎるためタブレット向けに調整 */
	.news-single { padding: 48px 40px 64px; }
}

/* ============================================================
   EN2行の下層MV(.mv--en2 = privacy等): SPは写真を72px下げて
   POLICY・和文との文字被りを軽くする(写真下端408pxは維持)
   ============================================================ */
@media (max-width: 767px) {
	.mv--en2 .mv__img { top: 200px; height: 208px; }
}

/* ============================================================
   404 MV: 広幅とタブレットの調整（2026-09-05 ユーザー指摘）
   ============================================================ */
/* 1441px以上: aspect-ratio 2:1 + max-height 820px の組合せで幅が
   1640pxに制限され左寄せになるため、max-heightを外し全幅で比例拡大 */
@media (min-width: 1441px) {
	.notfound-mv { max-height: none; }
}
/* 768-1023px: ENのtop(50%+99.72px)はPCの720px高前提で写真の下へ
   はみ出すため、写真下端からの距離基準(下パディング+20px)に変更 */
@media (min-width: 768px) and (max-width: 1023px) {
	.notfound-mv__en { top: auto; bottom: calc(clamp(32px, 5vw, 72px) + 20px); }
}

/* ============================================================
   ページネーションSP: 9要素(← 1 … 4 5 6 … 9 →)でも375pxに収める
   (44px円+gap8+矢印マージン24のPC仕様では404pxとなりはみ出すため)
   ============================================================ */
@media (max-width: 767px) {
	.pagination .nav-links, .works-pager { gap: 4px; }
	.pagination .page-numbers, .works-pager .page-numbers { min-width: 36px; height: 36px; padding: 0 8px; font-size: 14px; }
	.pagination .page-numbers.dots, .works-pager__dots { min-width: 0; padding: 0 2px; }
	.pagination .next, .works-pager .works-pager__arrow:last-child { margin-left: 8px; }
	.pagination .prev, .works-pager .works-pager__arrow:first-child { margin-right: 8px; }
}

/* ACCESS: 地図の四隅を角丸に統一 */
.access__map iframe { border-radius: 20px; }