/* リキッドレイアウト対応 */

:root {
	--inner-value: 1050;
	--inner: 1000px;
	--padding-pc: 25px;
	--padding-sp: 20px;
}

:root {
	--rem: 1rem / 16;
	--em: 1em / 16;
	--vw: 1440 * 100vw;
	--inner-percent: var(--inner-value) * 100%;
}

:root {
	--base-font: "Noto Sans JP", sans-serif;
	--serif-font: "Noto Serif JP", serif;
	--en-font: "Marcellus", serif;
	--mincho-font: "Hiragino Mincho ProN", "Noto Serif JP", serif;
	--fw-regular: 400;
	--fw-medium: 500;
	--fw-bold: 700;
	--leading-trim: calc((1em - 1lh) / 2);
}

:root {
	--white: #fff;
	--black: #000;
	--main: #044F9B;
	--main-light: #1E62B5;
	--main-bright: #3895D0;
	--blue-accent: #3996D1;
	--blue-deep: #1A377F;
	--blue-flow-dark: #244597;
	--blue-flow-mid: #506CB2;
	--blue-flow-light: #90A6DD;
	--blue-about-deep: #1F4992;
	--blue-interview-deep: #042F9B;
	--blue-pagination: #CDDCEB;
	--blue-news-mv-end: #9DBADF;
	--gray-dark-bg: #383C45;
	--bg-feature: #F6F7F9;
	--border-gray: #d9d9d9;
	--border-light: #eee;
	--text-sub: #666;
	--bg-placeholder: #eaeaea;
}

:root {
	--header-height: 74px;
	--header-height-sp: 76px;
}

:root {
	--gradient-main: linear-gradient(180deg, var(--main) 0%, var(--main-light) 100%);
}

:root {
	--z-index-loader: 1000;
	--z-index-header: 100;
	--z-index-drawer: 99;
	--z-index-cta: 90;
}

@property --scrollbar {
	syntax: "<length>";
	initial-value: 0;
	inherits: true;
}

:root:has(:modal[open],
.is-scroll-lock) {
	overflow: hidden;
	scrollbar-gutter: stable;
}

body {
	container-type: inline-size;
	font-family: var(--base-font);
	color: var(--black);
	font-weight: 400;
	line-height: 1.5;
}

html {
	font-size: 16px;
}

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

/* Remove default padding */

ul,
ol {
	padding: 0;
}

/* Remove default margin */

body,
h1,
h2,
h3,
h4,
h5,
p,
ul,
ol,
figure,
blockquote,
dl,
dd {
	margin: 0;
}

/* Set core root defaults */

html {
	scroll-padding-top: 3.75rem;
}

/* Set core body defaults */

body {
	min-height: 100svh;
	display: flex;
	flex-direction: column;
	text-rendering: optimizeLegibility;
	line-height: 1.5;
	line-break: strict;
	overflow-wrap: anywhere; /* 100vw 全幅要素(事業内容の marquee 等)が、 縦スクロールバー幅を含む分だけ横にはみ出して
     横スクロールバーが出るのを抑止 (Firefox/Windows の classic scrollbar で発生)。
     overflow:hidden と違い clip は scroll コンテナを作らないので position:sticky を壊さない。 */
	overflow-x: clip;
}

main {
	flex: 1;
}

/* Remove list styles on ul, ol elements with a class attribute */

ul,
ol {
	list-style: none;
}

/* A elements that don't have a class get default styles */

a:not([class]) {
	-webkit-text-decoration-skip: ink;
	text-decoration-skip-ink: auto;
}

/* Make images easier to work with */

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

/* Inherit fonts for inputs and buttons */

input,
button,
textarea,
select {
	font: inherit;
}

/* picture*/

picture {
	display: block;
	width: 100%;
	height: 100%;
}

/* Blur images when they have no alt attribute */

img:not([alt]) {
	filter: blur(10px);
}

:where(dialog) {
	width: unset;
	max-width: unset;
	height: unset;
	max-height: unset;
	padding: unset;
	color: unset;
	background-color: unset;
	border: unset;
	overflow: unset;
}

:where(dialog:focus-visible) {
	outline: none;
}

/* フォームリセット */

input,
button,
select,
textarea {
	margin: 0;
	padding: 0;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: transparent;
	border: none;
	border-radius: 0;
	font: inherit;
}

textarea {
	resize: vertical;
}

input[type=checkbox],
input[type=radio] {
	display: none;
}

input[type=submit],
input[type=button],
label,
button,
select {
	cursor: pointer;
}

select::-ms-expand {
	display: none;
}

a {
	text-decoration: none;
	color: inherit;
	cursor: pointer;
	transition: opacity 0.3s;
}

a[href^="tel:"] {
	pointer-events: none;
}

.l-footer {
	margin-top: 11.875rem;
}

.l-inner {
	max-width: calc(var(--inner) + var(--padding-pc) * 2);
	margin-inline: auto;
	padding-inline: var(--padding-pc);
	width: 100%;
}

.l-inner--sub {
	max-width: 53.125rem;
	margin-left: calc(max(0px, (100vw - 80rem) / 2) + 19.25rem);
	padding-inline: 25px;
	width: auto;
}

/* ==========================================================================
   l-section  セクション間共通余白
   ========================================================================== */

.l-section {
	padding-block: 7.5rem;
}

.l-section--small {
	padding-block: 3.75rem;
}

.l-section--large {
	padding-block: 10rem;
}

/* 背景色バリエーション (l-* は外側影響系のみ。装飾系はp-へ) */

.l-section--bg-dark {
	background-color: var(--black);
	color: var(--white);
}

.l-section--bg-gradient {
	background: var(--gradient-main);
	color: var(--white);
}

.l-section--bg-gray {
	background-color: var(--bg-feature);
}

/* l-top-recruit  TOP 採用セクションの外側余白
   (l-* は外側影響系のみ。 背景色・装飾は p-top-recruit へ) */

.l-top-recruit {
	margin-block: 1.875rem 7.8125rem;
}

/* ==========================================================================
   c-anchor-nav  追従アンカーナビ (Figma 実値完全一致版)
   - 240px 幅 白背景カード + 1px gray 枠 (rgba(0,0,0,0.2))
   - 各 item: 14px Noto Sans JP Regular 黒、右に 13×7 右向き青矢印
   - item 間に水平区切り線 (最後の item の下は無し)
   ========================================================================== */

.c-anchor-nav {
	position: sticky;
	top: calc(var(--header-height) + 1.25rem);
	z-index: 5;
	width: clamp(11.25rem, 22vw, 15rem);
	padding: 0.875rem 1.25rem;
	background-color: rgb(255, 255, 255);
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 0; /* Figma cornerRadius 0 */ /* スクロール追従中のテキストのサブピクセル再描画 (揺れ) 対策で GPU レイヤーに昇格
     (translate のみ、 sticky は不変) */
	transform: translateZ(0);
	backface-visibility: hidden;
}

.c-anchor-nav__list {
	display: flex;
	flex-direction: column;
}

.c-anchor-nav__list { /* 320px 表示崩れ対策: 極小 SP は 1 列縦並び */
}

.c-anchor-nav__item {
	list-style: none; /* item 間の水平区切り線 (Figma Vector 123-125: 201×1px 黒 opacity 0.2) */
}

.c-anchor-nav__item:not(:last-child) {
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

.c-anchor-nav__link {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0.75rem 0;
	font-family: var(--base-font);
	font-size: max(0.875rem, 10px);
	font-weight: 400;
	line-height: 2;
	color: rgb(0, 0, 0);
	text-decoration: none;
	transition: color 0.5s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s ease;
	word-break: keep-all;
	overflow-wrap: anywhere;
}

.c-anchor-nav__link::after {
	content: "";
	width: 0.4375rem;
	height: 0.8125rem;
	background-image: linear-gradient(90deg, rgb(0, 0, 0) 0%, rgb(30, 98, 181) 73%);
	-webkit-mask: url("../images/common/icon-arrow-down-chevron.svg") no-repeat center/contain;
	mask: url("../images/common/icon-arrow-down-chevron.svg") no-repeat center/contain;
	margin-right: 0.625rem;
	transition: opacity 0.3s ease, translate 0.3s ease;
	flex-shrink: 0;
}

.c-anchor-nav__link.is-current {
	color: var(--main);
}

/* 押出し機用 スクリーン（ストレーナー） のように 2 行になる link 用 modifier。
   2 行タイトルの line-height / letter-spacing を狭める。
   注: mmq が @media を末尾に集約するため、 compound class で詳細度を上げて
       SP メディアクエリ内の .c-anchor-nav__link を上書き可能にする */

.c-anchor-nav__link.c-anchor-nav__link--tight {
	line-height: 1.3;
	letter-spacing: -0.1em;
}

/* ==========================================================================
   c-breadcrumb  パンくず (U-07)
   - 下層MV直下、インナー幅右端
   - Figma: 12px Noto Sans JP Regular, 親=黒・現在=青
   ========================================================================== */

.c-breadcrumb {
	padding-block: 2.2rem;
}

/* MV なしページ (製品詳細 / お知らせ詳細) で使用 */

.c-breadcrumb--no-mv {
	padding-block: 1.6875rem;
}

.c-breadcrumb__list {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 0.5rem;
	flex-wrap: wrap;
}

.c-breadcrumb__item {
	list-style: none;
	display: flex;
	align-items: center;
	gap: 0.6875rem;
	font-size: max(0.75rem, 10px);
	line-height: 1.2;
}

/* 区切り: Figma 17:2071 Vector 141 = 20px×1px の水平線、黒 opacity 0.4 */

.c-breadcrumb__item + .c-breadcrumb__item::before {
	content: "";
	display: inline-block;
	width: 1.25rem;
	height: 1px;
	background-color: rgba(0, 0, 0, 0.4);
	vertical-align: middle;
	flex-shrink: 0;
}

.c-breadcrumb__link {
	position: relative;
	color: rgba(0, 0, 0, 0.4);
	text-decoration: none;
}

.c-breadcrumb__link::after {
	content: "";
	position: absolute;
	inset: -0.75rem -0.5rem;
}

.c-breadcrumb__current {
	color: var(--main);
	font-weight: 400; /* 15 文字超え時は ... で省略 */
	display: inline-block;
	max-width: 10em;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	vertical-align: bottom;
}

/* ==========================================================================
   Breadcrumb NavXT プラグイン用（暫定・後で削除）
   ※ プラグイン設定の「区切り文字」を空にするとテキスト区切りが消えます
   ========================================================================== */

.p-breadcrumb--no-mv {
	padding-block: 1.6875rem;
}

.p-breadcrumb {
	padding-block: 2.2rem;
}

.p-breadcrumb__wrapper {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.5rem;
	font-size: max(0.75rem, 10px);
	line-height: 1.2;
}

.p-breadcrumb__wrapper > span[property=itemListElement] {
	display: flex;
	align-items: center;
	gap: 0.6875rem;
}

.p-breadcrumb__wrapper > span[property=itemListElement] + span[property=itemListElement]::before {
	content: "";
	display: inline-block;
	width: 1.25rem;
	height: 1px;
	background-color: rgba(0, 0, 0, 0.4);
	vertical-align: middle;
	flex-shrink: 0;
}

.p-breadcrumb__wrapper a {
	position: relative;
	color: rgba(0, 0, 0, 0.4);
	text-decoration: none;
}

.p-breadcrumb__wrapper a::after {
	content: "";
	position: absolute;
	inset: -0.75rem -0.5rem;
}

.p-breadcrumb__wrapper > span[property=itemListElement]:last-of-type > span[property=name] {
	color: var(--main);
	font-weight: 400;
	display: inline-block;
	max-width: 13em;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	vertical-align: bottom;
}

/* ==========================================================================
   c-btn  共通CTAボタン
   - U-01 (TOP 会社概要/事業内容/採用情報, service/products/recruit CTA)
   - U-15 PDF / U-19 矢印リンク / U-21 戻るボタン
   - Figma: 17:4915 (Group 60 / 230×60)
   ========================================================================== */

.c-btn {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	min-width: 14.375rem;
	width: auto;
	max-width: 100%;
	height: 3.75rem; /* Figma 17:4965/4957: text at x=29 from left, arrow ends at 15 from right */
	padding-left: 1.8125rem;
	padding-right: 0.9375rem;
	border: 2px solid transparent;
	border-radius: 0.625rem;
	font-family: var(--base-font);
	font-size: max(1.125rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 1;
	text-decoration: none;
	transition: background-color 0.5s cubic-bezier(0.22, 1, 0.36, 1), color 0.5s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

/* GG2 (2026-05-22): .c-btn が .js-fadeup を併用すると utility 側の
   transition: opacity/transform 0.8s で base c-btn の transition が上書きされ
   hover が パキッと になる問題を回避 → 両方の transition を明示マージ */

.c-btn.js-fadeup {
	transition: opacity 0.8s ease-out, transform 0.8s ease-out, background-color 0.5s cubic-bezier(0.22, 1, 0.36, 1), color 0.5s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

/* T06: text-align left + flex: 0 で text が padding-left 直下に配置される
   (center だと flex: 1 と相まって text が中央寄りに見える) */

.c-btn__text {
	flex: 0 0 auto;
	text-align: left;
}

.c-btn__arrow {
	position: relative;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3.25rem;
	height: 1.9375rem;
	border-radius: 0.4375rem;
	transition: background-color 0.5s cubic-bezier(0.22, 1, 0.36, 1), color 0.5s cubic-bezier(0.22, 1, 0.36, 1); /* 矢印アイコン (chevron right, 13x7) */
}

.c-btn__arrow::before {
	content: "";
	display: block;
	width: 0.8125rem;
	height: 0.4375rem;
	background-color: currentColor;
	-webkit-mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	transition: translate 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

/* ========== primary: 青背景・白文字 ==========
   Figma 17:4969/4961 Rectangle 141: arrow box は WHITE fill opacity 0.2
   Figma 17:4970/4962 Union: arrow shape は WHITE fill opacity 1 */

.c-btn--primary {
	background-color: var(--main);
	border-color: var(--main);
	color: var(--white);
}

.c-btn--primary .c-btn__arrow {
	background-color: rgba(255, 255, 255, 0.2); /* Figma: white opacity 20% */
	color: var(--white); /* arrow shape は white */
	transition: background-color 0.5s cubic-bezier(0.22, 1, 0.36, 1), color 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.c-btn--secondary {
	background-color: var(--white);
	border-color: var(--white);
	color: var(--main);
}

.c-btn--secondary .c-btn__arrow {
	background-color: rgba(4, 79, 155, 0.2);
	color: var(--main);
}

/* ========== back: U-21 一覧に戻る（左矢印）
   Figma 仕様: 白 bg + 紺 border + 紺文字 + 左にライトブルー矢印ボックス
   DOM 順: arrow → text (= flex 自然順、 row-reverse 不要) */

.c-btn--back {
	background-color: var(--white);
	border-color: var(--main);
	color: var(--main); /* 矢印が左に来るため base の padding (29/15) を左右反転 */
	padding-left: 0.9375rem;
	padding-right: 1.8125rem;
}

.c-btn--back .c-btn__arrow {
	background-color: rgba(4, 79, 155, 0.2); /* ライトブルー (main alpha 20%) */
	color: var(--main); /* 矢印 shape は紺 */
	transition: background-color 0.5s cubic-bezier(0.22, 1, 0.36, 1), color 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.c-btn--back .c-btn__arrow--left::before {
	rotate: 180deg;
}

.c-btn--pdf {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	width: 3.25rem;
	max-width: 3.25rem;
	height: 1.9375rem;
	padding: 0;
	gap: 0;
	flex-shrink: 0;
	background-color: var(--main);
	border: none;
	border-radius: 0.4375rem;
	color: var(--white);
	font-family: var(--base-font);
	font-size: max(0.875rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 1;
	transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1); /* SP: .c-btn @include mq("md") の min-width: rem(200) / padding-left: rem(24) を上書き
     (PDF ボタンは 52×31 固定、 中央寄せのため padding 0)
     2026-06-03 fix: padding 上書き忘れで text が右にずれていた */
}

/* ========== arrow: 矢印付きテキストリンク（背景無し、U-05/U-19） ========== */

.c-btn--arrow {
	width: auto;
	height: auto;
	padding: 0;
	border: none;
	background: transparent;
	color: var(--black);
	font-family: var(--base-font);
	font-size: max(0.875rem, 10px);
	font-weight: var(--fw-bold);
}

.c-btn--arrow .c-btn__arrow {
	width: 2.5rem;
	height: 1.5rem;
	background-color: var(--main);
	color: var(--white);
}

.c-business-card-list {
	display: flex;
	flex-direction: column;
	padding: 0;
	margin: 0;
	list-style: none;
}

/* リスト各行: padding で上下高さを制御 (Figma 各行 ~88px) */

.c-business-card {
	display: flex;
	align-items: center;
	gap: 2.0625rem; /* Figma: image右端 x=723 → text左端 x=756 = 33px */
	padding: 0.875rem 0; /* Figma 17:5007 Vector 52: 2px white opacity 0.2 (divider) */
	border-bottom: 2px solid rgba(255, 255, 255, 0.2);
	text-decoration: none;
	color: var(--white);
	transition: opacity 0.3s ease;
}

.c-business-card__image {
	width: 5.125rem; /* Figma 17:5042 etc: image box 82×60 */
	height: 3.75rem;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.c-business-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Figma 17:5005 等: 16px Noto Sans JP Regular WHITE */

.c-business-card__title {
	flex: 1;
	font-family: var(--base-font);
	font-size: max(1rem, 10px);
	font-weight: 400;
	color: var(--white);
	line-height: 1.5;
	margin: 0;
	word-break: keep-all;
	overflow-wrap: anywhere;
}

/* arrow box: 52×31 cornerRadius 7 + WHITE fill opacity 0.2 + arrow shape WHITE
   Figma 17:4976 Rectangle 157 layer opacity 0.2 / 17:4977 Union white */

.c-business-card__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3.25rem;
	height: 1.9375rem;
	background-color: rgba(255, 255, 255, 0.2); /* Figma: white opacity 20% */
	border-radius: 0.4375rem;
	flex-shrink: 0;
	transition: background-color 0.3s ease;
}

.c-business-card__arrow::before {
	content: "";
	display: block;
	width: 0.8125rem;
	height: 0.4375rem;
	background-color: var(--white); /* arrow shape は白 (opacity 1) */
	-webkit-mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	transition: translate 0.3s ease;
}

/* desc は使われない (Figma に description 列なし) */

.c-business-card__body,
.c-business-card__desc,
.c-business-card__link-wrap {
	display: contents;
}

/* ==========================================================================
   c-company-access  アクセスカード (Figma company_pc 17:1858 Access)
   - 上下に黒(細)ボーダー、2列grid
   - 各item: 18px Bold 青タイトル + 住所 + TEL/FAX + Google Maps リンク (青+小アイコン+下線)
   ========================================================================== */

.c-company-access {
	display: flex;
	flex-direction: column;
}

.c-company-access > * + * {
	margin-top: 2.5rem;
}

.c-company-access__map {
	position: relative;
	aspect-ratio: 16/9;
	overflow: hidden;
}

.c-company-access__map iframe,
.c-company-access__map > * {
	width: 100%;
	height: 100%;
	border: 0;
}

.c-company-access-list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0 1.5rem;
	border-top: 1px solid rgba(0, 0, 0, 0.2);
}

.c-company-access__item {
	display: flex;
	flex-direction: column;
	padding: 1.5rem 0 2.375rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
	background-color: transparent;
	border-radius: 0;
}

/* SP: 2件目以降の item padding を統一 (17 0 27)。1件目は base のまま */

.c-company-access__item > * + * {
	margin-top: 0.5rem;
}

.c-company-access__name {
	font-family: var(--base-font); /* user 指示 (2026-06-11): name (= 工場・営業部タイトル) 16 → 18 (全項目共通) */
	font-size: max(1.125rem, 10px);
	font-weight: var(--fw-bold);
	color: var(--main);
	margin: 0;
	line-height: 2;
}

.c-company-access__address { /* Figma 17:2009/1997 lineHeight 150% (旧 1.7 → 1.5)
     user 指示 (2026-06-02): SP も 16 統一 (詳細テキスト font 16) */
	font-size: max(1rem, 10px);
	line-height: 1.5;
	color: var(--black);
	margin: 0.375rem 0 0;
}

.c-company-access__tel {
	font-size: max(1rem, 10px);
	color: var(--black);
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0 1.125rem;
}

/* user 指示 (2026-06-04): HTML validation 対応で <a> を <dd> でラップ。
   dl/dd セマンティクスを保つため display: contents は使わず、
   dd 自身を flex 子として正しく扱う (margin リセット + 旧 14px の上余白を dd 側で管理) */

.c-company-access__gmap {
	margin: 0.75rem 0 0;
	padding: 0;
}

.c-company-access__gmap-link {
	display: inline-flex;
	align-items: center;
	width: -moz-fit-content;
	width: fit-content;
	font-size: max(0.875rem, 10px);
	font-weight: 400;
	color: var(--main);
	text-decoration: none;
	border-bottom: 1px solid var(--main);
	padding-bottom: 0.125rem;
}

.c-company-access__gmap-link > * + * {
	margin-left: 0.5625rem;
}

.c-company-history {
	margin: 0;
	padding: 0;
}

.c-company-history__item {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}

.c-company-history__item > * + * {
	margin-left: 3.1875rem;
}

/* SP: 装飾 (縦線 + ドット) を item::before / ::after で item 左 column に配置 */

.c-company-history__term {
	flex: 0 0 7.8125rem;
	font-family: var(--base-font);
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	color: var(--main);
	line-height: 1.4;
	letter-spacing: 0.05em;
	margin: 0;
	padding-left: 1.25rem;
	white-space: nowrap;
}

.c-company-history__desc {
	flex: 1 1 auto;
	position: relative;
	padding-block: 1rem;
	padding-left: 3.5625rem;
	margin: 0;
}

.c-company-history__desc::before {
	content: "";
	position: absolute;
	left: 0.875rem;
	top: 0;
	width: 1px;
	height: 100%;
	background-color: var(--main); /* SP: item::before に装飾を移したため非表示 */
}

/* 第 1 item: 縦線を半分から (上から線が出てこない) */

.c-company-history__item:first-child .c-company-history__desc::before {
	top: 50%;
	height: 50%;
}

/* 最終 item: 縦線を上半分まで */

.c-company-history__item:last-child .c-company-history__desc::before {
	height: 50%;
}

.c-company-history__desc::after {
	content: "";
	position: absolute;
	left: 0.59375rem;
	top: 50%;
	width: 0.625rem;
	height: 0.625rem;
	background-color: var(--main);
	border-radius: 50%;
	transform: translateY(-50%); /* SP: item::after に装飾を移したため非表示 */
}

.c-company-history__text {
	font-size: max(1rem, 10px);
	line-height: 1.7;
	color: var(--black);
	margin: 0;
}

/* アコーディオン (is-collapsed): hidden item を非表示 */

.c-company-history.is-collapsed .c-company-history__item--hidden {
	display: none;
}

/* ==========================================================================
   c-company-info  会社情報テーブル (U-10)
   - 行: ラベル(左) + 内容(右) の <dl> 構造
   - Figma: company 17:1858, dt=14px Bold, dd=14px Regular
   ========================================================================== */

.c-company-info {
	width: 100%;
}

.c-company-info__row {
	display: grid;
	grid-template-columns: 8.875rem 1fr;
	gap: 2.0625rem;
	padding: 1.1875rem 0;
	align-items: center;
	border-bottom: 1px solid var(--border-gray);
}

.c-company-info__label { /* Figma 17:1887/1877/1878 等: 16px Noto Sans JP Bold #044F9B */
	font-size: max(1rem, 10px);
	font-weight: var(--fw-bold);
	color: var(--main);
	margin: 0;
	margin-left: 0.625rem; /* SP: value と左揃え統一 (PC では label に left padding を維持) */
}

.c-company-info__value { /* Figma 17:1888 等: 14px Noto Sans JP Medium #000 */
	font-size: max(0.875rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 2;
	color: var(--black);
	margin: 0;
}

.c-company-info__value--tight { /* user 指示 (2026-06-11): 役員行 (専務/常務 2行) のみ行間を詰める (2 → 1.5) */
	line-height: 1.5;
}

/* ==========================================================================
   c-drawer  SPドロワー (ハンバーガーから開く全画面メニュー)
   ========================================================================== */

/* drawer 開時の body scroll lock は JS 側で body { position: fixed; top: -<scrollY>px } で実装。
   CSS 側は overflow: hidden を追加保険として html / body に当てるだけ
   (height: 100% を当てると document が縮んで scrollTop がリセットされる罠) */

html.is-drawer-open,
html.is-drawer-open body {
	overflow: hidden;
}

/* user 指示 (2026-06-05): drawer フェードイン時、 body の白背景が透けて パッ と見える対策。
   drawer 開いた瞬間に viewport 全体を drawer 同色 (gradient 上端) に切替 → drawer が fade-in で重なる */

html.is-drawer-open {
	background-color: rgb(56, 60, 69);
}

/* drawer open 時、 ヘッダーに drawer 同色の bg を付ける
   (drawer 内 scroll で header 透明領域から透けて見える問題回避)
   暗背景上でテキスト・ロゴ・ハンバーガーは白に強制 */

html.is-drawer-open .c-header,
html.is-drawer-open .c-header.is-scrolled { /* 上→下 グラデ #383C45 → #33363E */
	background-color: rgb(56, 60, 69); /* fallback */
	background-image: linear-gradient(180deg, rgb(56, 60, 69) 0%, rgb(51, 54, 62) 100%);
	box-shadow: none;
	color: var(--white);
}

html.is-drawer-open .c-header a,
html.is-drawer-open .c-header__logo-text {
	color: var(--white);
}

/* ロゴは SVG 画像のため filter で強制白 (元 SVG の色を問わず白にする) */

html.is-drawer-open .c-header__logo img,
html.is-drawer-open .c-header__logo picture {
	filter: brightness(0) invert(1);
}

/* 詳細度で .c-header.is-scrolled .c-header__hamburger-line (黒) に勝つよう compound */

html.is-drawer-open .c-header .c-header__hamburger-line,
html.is-drawer-open .c-header.is-scrolled .c-header__hamburger-line {
	background-color: var(--white);
}

/* drawer 開時のヘッダー下 border (.c-header__inner::after) を白半透明に強制 */

html.is-drawer-open .c-header .c-header__inner::after,
html.is-drawer-open .c-header.is-scrolled .c-header__inner::after {
	background-color: rgba(255, 255, 255, 0.4);
}

.c-drawer {
	display: none;
}

.c-drawer.is-open {
	opacity: 1;
	pointer-events: auto;
}

.c-drawer__close { /* ハンバーガー自身を×化するため非表示 */
	display: none;
}

.c-drawer__inner { /* user 指示: padding 5rem 20px 3rem */
	padding: 5rem 1.25rem 3rem;
	box-sizing: border-box; /* === 重要: min-height は付けない ===
     親 .c-drawer (= scroll container, position:fixed + inset:0) の高さは viewport。
     ここで inner に min-height: 100% を付けると inner が常に viewport ぴったりに引き伸ばされ、
     scrollHeight == clientHeight となり scroll 余地が消える (これが scroll できなかった真因)。
     inner は natural content height のままにして、 content が viewport を超えたら drawer が scroll。 */
}

.c-drawer__nav-list {
	display: flex;
	flex-direction: column; /* user 指示 */
	margin-top: 1.1875rem;
}

.c-drawer__nav-item {
	list-style: none; /* user 指示: アイテム間 border は white 20% 透明 */
	border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.c-drawer__nav-item + .c-drawer__nav-item {
	margin-top: 0.8125rem;
}

.c-drawer__nav-link {
	display: flex;
	justify-content: space-between;
	align-items: center; /* user 指示: 上下 padding 13px でクリック領域確保 */
	padding-block: 0.8125rem; /* user 指示: 右側に 4px の余白 (= ::after 矢印 / ::before 縦棒の右余白) */
	padding-right: 0.25rem;
	font-size: max(1.125rem, 10px);
	font-weight: var(--fw-bold); /* user 指示: テキスト白色 */
	color: var(--white);
	text-decoration: none; /* user 指示: hover で opacity (toggle button = 製品一覧 も対象) */
	transition: opacity 0.3s ease;
}

/* Figma 83:9586 Group 93 → 矢印 (Figma 実値: horizontal 12px / head 4×6.6 / stroke 1)
   user 指示: デザインに合わせて太く → stroke-width 2、 head 角度を Figma 準拠に */

.c-drawer__nav-link::after {
	content: "";
	display: inline-block;
	width: 0.875rem;
	height: 0.5rem; /* user 指示: 白背景グラデ上で矢印も白 */
	background-color: var(--white);
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 8' fill='none'><path d='M1 4L13 4M9 1L13 4L9 7' stroke='black' stroke-width='2' stroke-linejoin='miter' stroke-linecap='square'/></svg>") no-repeat center/contain;
	mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 8' fill='none'><path d='M1 4L13 4M9 1L13 4L9 7' stroke='black' stroke-width='2' stroke-linejoin='miter' stroke-linecap='square'/></svg>") no-repeat center/contain;
	flex-shrink: 0;
	transition: translate 0.3s ease;
}

/* === 製品一覧 (展開可能) === */

.c-drawer__nav-link--toggle {
	background: none;
	border: 0;
	width: 100%; /* user 指示: 上下 padding 13px、 右 4px (= ::before / ::after の右余白) */
	padding: 0.8125rem 0.25rem 0.8125rem 0;
	text-align: left;
	cursor: pointer;
	font: inherit;
	font-size: max(1.125rem, 10px);
	font-weight: var(--fw-bold); /* user 指示: テキスト白色 */
	color: var(--white); /* ::before (縦棒) absolute 配置のため relative */
	position: relative;
}

/* toggle button の右端 ::after = 横棒 (= - 部分、 + のうち横線) — 常時表示 */

.c-drawer__nav-link--toggle::after { /* 既存 → 矢印を上書きしてハイフン (横線) に、 グラデ背景上で白 */
	background-color: var(--white);
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19 2' fill='none'><line x1='0' y1='1' x2='19' y2='1' stroke='black' stroke-width='1.5' stroke-linecap='round'/></svg>") no-repeat center/contain;
	mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19 2' fill='none'><line x1='0' y1='1' x2='19' y2='1' stroke='black' stroke-width='1.5' stroke-linecap='round'/></svg>") no-repeat center/contain;
	width: 1.1875rem;
	height: 0.125rem; /* rotate しない (open 時も - のまま) */
}

/* ::before = 縦棒 (= + の縦線部分) — closed 時表示、 open 時消す
   user 指示: 通常はプラスの見た目、 開いた時マイナスへ */

.c-drawer__nav-link--toggle::before {
	content: "";
	position: absolute; /* user 指示: ::after と x 位置を揃えるため right 4px */
	right: 0.25rem;
	top: 50%;
	translate: 0 -50%;
	width: 1.1875rem;
	height: 0.125rem;
	background-color: var(--white);
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19 2' fill='none'><line x1='0' y1='1' x2='19' y2='1' stroke='black' stroke-width='1.5' stroke-linecap='round'/></svg>") no-repeat center/contain;
	mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19 2' fill='none'><line x1='0' y1='1' x2='19' y2='1' stroke='black' stroke-width='1.5' stroke-linecap='round'/></svg>") no-repeat center/contain; /* 横線を 90 度回して縦棒に */
	rotate: 90deg;
	transition: opacity 0.3s ease;
}

/* open 時 (aria-expanded="true") = 縦棒消す = - のみ残る (マイナス) */

.c-drawer__nav-link--toggle[aria-expanded=true]::before {
	opacity: 0;
}

/* user 指示: 製品一覧 open 時、 title 下に下線 → その下に詳細リスト */

.c-drawer__nav-link--toggle[aria-expanded=true] {
	border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

/* === accordion wrap === user 指示: ふわっと展開 (fade) ===
   closed 時 opacity 0 + height 0 + padding 0 で完全非表示、 open 時 fade-in */

.c-drawer__sub-wrap {
	display: grid;
	grid-template-rows: 0fr;
	overflow: hidden;
	opacity: 0;
	pointer-events: none; /* user 指示: margin-top が transition なしで先に消える違和感を防ぐため
     上下余白を sub-wrap 自身の padding に持たせ、 全 property を同期 transition */
	padding-top: 0;
	padding-bottom: 0;
	transition: grid-template-rows 0.3s ease, opacity 0.3s ease, padding-top 0.3s ease, padding-bottom 0.3s ease;
}

.c-drawer__sub-wrap > * {
	min-height: 0;
}

.c-drawer__nav-item--has-sub:has(.c-drawer__nav-link--toggle[aria-expanded=true]) .c-drawer__sub-wrap {
	grid-template-rows: 1fr;
	opacity: 1;
	pointer-events: auto; /* open 時、 title 下線と sub-list の間に余白 */
	padding-top: 0.75rem;
}

/* sub-list 展開中は li 末尾 border を非表示 (= ワイヤー製品下の線を消す) */

.c-drawer__nav-item--has-sub:has(.c-drawer__nav-link--toggle[aria-expanded=true]) {
	border-bottom: none;
}

/* sub-list は footer の .c-footer__sub-list そのまま (gap 1px で密集) */

.c-drawer__sub-list {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 1px;
	margin: 0;
	padding: 0;
}

/* === sub-* は footer の c-footer__sub-* と完全同一 CSS (user 指示) === */

.c-drawer__sub-item {
	list-style: none;
	position: relative; /* padding は sub-link 側に移動し click 領域を li 全体に拡張 */
}

.c-drawer__sub-item::before {
	content: "";
	position: absolute;
	left: -1.5%;
	top: 1rem; /* user 指示 (2026-06-02): hyphen width 13 */
	width: 0.8125rem;
	height: 0.125rem;
	background-color: var(--main);
}

.c-drawer__sub-link {
	display: block; /* click 領域を li 全体に広げる (元 sub-item の padding をこちらに移動) */
	padding-left: 1rem;
	padding-block: 0.4375rem;
	color: var(--white);
	font-size: max(0.875rem, 10px);
	line-height: 1.4;
	text-decoration: none;
	opacity: 0.6;
	transition: opacity 0.3s ease;
}

.c-drawer__sub-link--tight {
	display: inline-flex;
	flex-direction: column;
	line-height: 1.2;
}

.c-drawer__sub-link-line {
	display: block;
	line-height: 1.2;
}

/* title 下余白は sub-wrap の padding-top に統合済み (= 上方 transition 同期のため margin-top は使わない) */

.c-drawer__contact {
	align-self: center;
	width: 100%;
	max-width: 16.25rem; /* c-btn を継承する */
}

/* 採用情報 + お問い合わせ ボタン: 上下並び (user 指示) */

.c-drawer__actions {
	display: flex;
	flex-direction: column;
	align-items: center; /* user 指示: gap 22px */
	gap: 1.375rem; /* nav-list との上余白 (元 .c-drawer__inner の flex gap 46 を margin で再現) */
	margin-top: 2.875rem;
}

.c-drawer__action { /* user 指示: 各ボタン 231px */
	width: 100%;
	max-width: 14.4375rem; /* user 指示: SP は drawer ボタンのみ min-width 12.5rem / height 54px (= c-btn の base SP 値を override) */
}

/* ==========================================================================
   c-footer  グローバルフッター (Figma 17:1482 / 17:5041)
   - 1280×464 (PC)、黒一枚
   - 上部: ロゴ(左) + Contact CTAタイル(右、写真+青グラデ+大Contact文字+お問い合わせbutton)
   - 中部: サイトマップ 3列 (会社概要 / 製品一覧 / 採用情報)、各列に↗マーク + 184px下線 + 8x2青ドット bullet
   - 下部: 事業内容↗ + プライバシーポリシー(小)
   - 最下部: copyright(中央)
   ========================================================================== */

.c-footer {
	background-color: var(--black);
	color: var(--white);
	padding: 4.6875rem 0 1.875rem;
}

/* l-inner 規約: max-width 1050 (1000 content + 25 padding ×2)
   → 視覚的 padding 25 で content 1000、Figma 139 から始まる content 領域に一致
   (viewport 1280 で content 左端 (1280-1050)/2 + 25 = 140 ≈ Figma 139) */

.c-footer__inner {
	max-width: calc(62.5rem + var(--padding-pc) * 2);
	margin-inline: auto;
	padding-inline: var(--padding-pc);
	position: relative;
}

/* ============ ロゴ (上部単独) ============ */

.c-footer__logo {
	width: 19.3125rem;
	margin-bottom: 3rem;
}

.c-footer__logo-link {
	display: block;
	transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.c-footer__logo img {
	display: block;
	width: 100%;
	height: auto;
}

.c-footer__main {
	display: grid;
	grid-template-columns: 1fr minmax(0, 22.125rem);
	gap: 1.875rem;
	align-items: stretch;
}

.c-footer__contact {
	position: relative;
	display: block;
	width: 100%;
	max-width: 22.125rem;
	height: 12.75rem; /* Figma box 354×204。 旧 height:100% はサイトマップ高に引き伸ばされていた */
	min-height: 12.75rem;
	border-radius: 0.625rem;
	overflow: hidden;
	text-decoration: none;
	color: var(--white);
	isolation: isolate;
	transition: opacity 0.3s ease;
	container-type: inline-size;
	box-shadow: 0 0 1.25rem rgba(0, 0, 0, 0.2);
}

/* 背景: 青グラデ2枚重ね (Figma 実値)
   ① 上レイヤー: 113deg 左上→右下  #1A377F(26,55,127) 0% → #3996D1(57,150,209) 100%  opacity 90%
   ② 下レイヤー: 180deg 上→下      #2B7BC3(43,123,195) 27% → #042F9B(4,47,155) 100%   opacity 93% */

.c-footer__contact-bg {
	position: absolute;
	inset: 0;
	background: linear-gradient(113deg, rgba(26, 55, 127, 0.9) 0%, rgba(57, 150, 209, 0.9) 100%), linear-gradient(180deg, rgba(43, 123, 195, 0.93) 27%, rgba(4, 47, 155, 0.93) 100%);
	z-index: -1;
}

/* Contact 大文字 (Figma 17:1548 実値): w 364 / h 80 / fontSize 100 Marcellus Regular
   card 左外/上外にはみ出す配置、 gradient white(1.0)→white(0.43)、 element opacity 0.8 */

.c-footer__contact-title {
	position: absolute;
	top: -0.7875rem;
	left: -0.25rem; /* Figma: card 左端から 4px 左 */
	width: 102.8248587571%; /* Figma w 364 / card 354 = 102.82% → 右にも約 6px overflow */
	font-family: var(--en-font);
	white-space: nowrap;
	text-align: left; /* Figma 100px、container 縮小時のみ縮小 */
	font-size: clamp(3.5rem, 28cqi, 6.25rem);
	font-weight: 400;
	line-height: 1; /* Figma 実値: 10% white(alpha 0.63) → 86% white(alpha 0.10) 左→右 */
	background: linear-gradient(90deg, rgba(255, 255, 255, 0.63) 10%, rgba(255, 255, 255, 0.1) 86%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	opacity: 0.8;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	pointer-events: none;
}

/* お問い合わせ button (right bottom): テキスト 16px white + arrow box (52x31 white) */

.c-footer__contact-btn {
	position: absolute;
	right: 1rem;
	bottom: 0.875rem;
	display: inline-flex;
	align-items: center;
	gap: 0.6875rem;
}

.c-footer__contact-btn-text {
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	color: var(--white);
}

.c-footer__contact-btn-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3.25rem;
	height: 1.9375rem;
	background-color: rgba(255, 255, 255, 0.2);
	border-radius: 0.4375rem;
}

.c-footer__contact-btn-arrow::before {
	content: "";
	display: block;
	width: 0.8125rem;
	height: 0.4375rem;
	background-color: var(--white);
	-webkit-mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	transition: translate 0.3s ease;
}

/* ============ サイトマップ 3列 (Contact と横並びの左側) ============ */

.c-footer__sitemap {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0 2.5rem;
	margin-top: 0.25rem; /* PC: 3 col (col1 = 会社概要+事業内容、 col3 = 採用情報+お知らせ+プライバシー の縦積み) */
	grid-template-areas: "company products recruit" "service products news" ".       products privacy";
}

.c-footer__col--company {
	grid-area: company;
}

.c-footer__col--service {
	grid-area: service;
}

.c-footer__col--products {
	grid-area: products;
}

.c-footer__col--recruit {
	grid-area: recruit;
}

.c-footer__col--news {
	grid-area: news;
}

.c-footer__col--privacy {
	grid-area: privacy;
}

.c-footer__col {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.c-footer__col-title {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	padding-bottom: 0.625rem;
	margin: 0;
	font-size: max(1rem, 10px);
	font-weight: var(--fw-bold);
	color: var(--white);
	text-decoration: none;
	position: relative;
	min-width: 0; /* SP 2列グリッドではみ出し防止 (旧 rem(184) は375px 2列で超過) */
}

.c-footer__col-title::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 1px;
	background-color: rgba(255, 255, 255, 0.4);
}

.c-footer__col-title--sub {
	margin-top: 0.9375rem;
}

/* お知らせ一覧: PC 上余白 (採用情報列が詰まっているため margin で直接付与) */

.c-footer__col-title--news {
	margin-top: 2.5rem;
}

.c-footer__col-arrow {
	display: inline-block;
	width: 0.8125rem;
	height: 0.4375rem;
	background-color: var(--white);
	-webkit-mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	transition: translate 0.3s ease;
}

.c-footer__sub-list {
	display: flex;
	flex-direction: column;
	gap: 1px;
	margin-top: 0.1875rem;
}

.c-footer__sub-item {
	list-style: none;
	position: relative; /* padding は sub-link 側に移動し click 領域を li 全体に拡張 */
}

.c-footer__sub-item::before {
	content: "";
	position: absolute;
	left: 0.2%;
	top: 0.75rem;
	width: 0.5rem;
	height: 0.125rem;
	background-color: var(--main);
}

.c-footer__sub-link {
	display: block; /* click 領域を li 全体に広げる (元 sub-item の padding をこちらに移動) */
	padding-left: 1rem;
	padding-block: 0.1875rem;
	color: var(--white);
	font-weight: var(--fw-regular);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale; /* max() の下限を生 px にして root font 縮小に追従させない */
	font-size: 0.75rem;
	line-height: 1.4;
	text-decoration: none;
	opacity: 0.6;
	transition: opacity 0.3s ease;
	word-break: keep-all;
	overflow-wrap: anywhere;
}

/* tight modifier — 長い名前「押出し機用スクリーン（ストレーナー）」専用。
   <br> だと line-height が効きにくいので flex column + 個別 line-height */

.c-footer__sub-link--tight {
	display: inline-flex;
	flex-direction: column;
	line-height: 1.2;
}

.c-footer__sub-link-line {
	display: block;
	line-height: 1.2;
}

/* 採用情報列下の「プライバシーポリシー」 (small modifier) */

.c-footer__small-link {
	font-size: max(0.6875rem, 10px);
	color: var(--white);
	text-decoration: none;
	padding-bottom: 0.25rem;
}

.c-footer__small-link--sub {
	margin-top: 2.5rem; /* お知らせ一覧との上余白 */
	display: inline-block;
}

.c-footer__copyright {
	display: block;
	text-align: center;
	font-size: max(0.625rem, 10px);
	color: var(--white);
	letter-spacing: 0.01em;
	opacity: 0.6;
	margin-top: 3.6875rem;
}

.c-header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: var(--z-index-header);
	background-color: transparent;
	transition: background-color 0.4s ease, box-shadow 0.4s ease;
}

.c-header.is-scrolled {
	background-color: var(--white);
	box-shadow: 0 0.125rem 0.75rem rgba(0, 0, 0, 0.08);
}

.c-header.is-scrolled .c-header__nav-link {
	color: var(--black);
}

/* is-scrolled の文字色 / icon は維持しつつ bg だけ透明にする modifier
   (news 一覧で使用、 MV bg 明色の上に重ねる) */

.c-header.is-transparent-bg {
	background-color: transparent;
	box-shadow: none;
}

.c-header.is-recruit {
	box-shadow: none;
}

/* Figma Vector 42 (x=29, y=74, w=1223): header content 内側の border-bottom。
   left:29 right:28 で inner padding と一致 */

.c-header__inner::after {
	content: "";
	position: absolute;
	left: 1.8125rem;
	right: 1.75rem; /* SP 用は下記 @include mq("md") で 20px に揃える */
	bottom: 0;
	height: 1px;
	background-color: rgba(255, 255, 255, 0.4); /* MV 上 = 白半透明 (Figma 通り) */
	transition: background-color 0.4s ease;
	pointer-events: none;
}

.c-header.is-scrolled .c-header__inner::after {
	background-color: rgba(0, 0, 0, 0.2);
}

/* Recruit 内 = やや濃いグレー */

.c-header.is-recruit .c-header__inner::after {
	background-color: rgba(0, 0, 0, 0.2);
}

.c-header__inner {
	position: relative;
	display: flex;
	align-items: center; /* ロゴ左 / nav中央寄り / actions右 */
	gap: 0.25rem;
	height: var(--header-height);
	padding-inline: 1.9375rem 1.75rem;
}

.c-header__logo {
	width: 100%;
	max-width: 16.5rem;
	margin: 0;
	flex-shrink: 0;
	height: var(--header-height);
	display: flex;
	align-items: center;
}

.c-header__logo-link {
	display: flex;
	align-items: center;
	width: 100%;
	height: 100%;
	text-decoration: none;
}

/* picture は flex item として stretch されると 中の img が top に貼り付く問題対策。
   SP のみ flex + align-items: center で img を中央配置 (PC は元の挙動を維持) */

.c-header__logo-link img {
	display: block;
	width: 100%; /* height: inherit で親 (= height 100%) を継承 */
	height: inherit; /* デフォルト: 黒 (MV重ねでない時)。is-scrolled / 非front-page もそのまま黒 */
	filter: brightness(0);
}

.c-header__logo-link img {
	transition: filter 0.4s ease;
}

/* TOPページMV重ね中(初期状態) は SVG を強制的にベタ白にする
   filter: none だと SVG fill="none" 系で黒 fallback されるブラウザがある対策 */

.c-header:not(.is-scrolled) .c-header__logo-link img {
	filter: brightness(0) invert(1);
}

.c-header__nav {
	margin-left: auto;
}

.c-header__nav-list {
	display: flex;
	align-items: stretch;
	height: var(--header-height);
	gap: 0;
}

.c-header__nav-item {
	list-style: none;
	display: flex;
	align-items: stretch;
}

.c-header__nav-link {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	height: 100%;
	padding-block: 0;
	padding-inline: 1rem;
	font-family: var(--base-font);
	font-size: max(1.125rem, 10px);
	font-weight: 400; /* Regular */
	color: var(--black);
	text-decoration: none; /* header bg の transition (0.4s ease) と同期 → scroll 切替時にヘッダー全体が同タイミングで色変化 */
	transition: color 0.4s ease, opacity 0.4s ease;
}

/* current page indicator: Medium */

.c-header__nav-item.is-current .c-header__nav-link {
	font-weight: var(--fw-medium);
}

.c-header__nav-arrow {
	display: inline-block;
	width: 0.9375rem;
	height: 0.4375rem;
	margin-left: 0.4375rem;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 7' fill='none'><path d='M0.5 1 L7.5 6 L14.5 1' stroke='black' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat center/contain;
	mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 7' fill='none'><path d='M0.5 1 L7.5 6 L14.5 1' stroke='black' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat center/contain; /* header bg / nav-link 文字色と完全同期 (0.4s ease)
     → scroll 切替時にヘッダー全体が同タイミングで色変化 */
	transition: transform 0.3s ease, background-color 0.4s ease;
}

/* TOPページMV重ね中のみnavを白に */

.c-header:not(.is-scrolled) .c-header__nav-link {
	color: var(--white);
}

/* nav-arrow は currentColor のみ (nav-link 文字色と同期: MV 上=白 / 超え後=黒)。
   var(--main) にすると「黒く見える」ため不可 */

.c-header__nav-item--dropdown {
	position: relative;
}

.c-header__nav-item--dropdown::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 0;
	width: 15.75rem; /* dropdown 全幅 */
	height: 0.5rem;
	background: transparent;
	visibility: hidden;
	pointer-events: none;
}

.c-header__dropdown {
	position: absolute;
	top: 123%;
	left: 13%;
	transform: none;
	min-width: 15.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
	background-color: var(--white);
	border: 1px solid rgba(0, 0, 0, 0.1); /* 背景と馴染まないようグレー枠 (項目区切り線と同色) */
	border-radius: 0;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 0.3s ease, visibility 0s 0.3s;
	z-index: 1;
}

.c-header__nav-item--dropdown.is-open .c-header__dropdown {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transition: opacity 0.3s ease, visibility 0s 0s;
}

.c-header__nav-item--dropdown.is-open .c-header__nav-arrow {
	transform: rotate(180deg);
}

.c-header__nav-link.c-header__nav-link--toggle {
	background: none;
	border: 0;
	height: 100%;
	padding-block: 0;
	padding-inline: 1rem;
	font: inherit;
	font-size: max(1.125rem, 10px);
	cursor: pointer; /* base .c-header__nav-link の transition を維持 = 他の nav-link と同タイミングで色変化 */
	transition: color 0.4s ease, opacity 0.4s ease;
}

.c-header__dropdown li {
	padding-inline: 1.6875rem;
}

.c-header__dropdown-link {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 0.75rem;
	width: 100%;
	padding-block: 0.90625rem;
	font-family: var(--base-font);
	font-size: max(0.75rem, 10px);
	font-weight: 400;
	color: var(--black);
	text-decoration: none;
	white-space: normal; /* 「押出し機用スクリーン (ストレーナー)」 等の折返し許可 */
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	line-height: 1.5;
	transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
	word-break: keep-all;
	overflow-wrap: anywhere;
}

.c-header__dropdown-link::after {
	content: "";
	display: inline-block;
	width: 0.8125rem;
	height: 0.4375rem;
	background-color: var(--black);
	-webkit-mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	flex-shrink: 0;
	transition: translate 0.3s ease;
}

/* 最後の item の link は border なし */

.c-header__dropdown li:last-child .c-header__dropdown-link {
	border-bottom: none;
}

/* SP: dropdown はドロワー内で別途扱う想定。PC ナビ非表示時は dropdown も非表示 */

/* ============ アクションエリア (採用情報/お問い合わせ) ============ */

.c-header__actions {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

/* 共通ボタンbase: Figma 40px高、cornerRadius 5 */

.c-header__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 2.5rem;
	padding-inline: 1.5rem;
	font-family: var(--base-font);
	font-size: max(1rem, 10px);
	font-weight: 400;
	text-decoration: none;
	border-radius: 0.3125rem;
	border: 1px solid;
	line-height: 1;
	transition: background-color 0.3s ease, color 0.3s ease;
}

/* 採用情報: Figma 120×40, fill #044F9B, stroke #044F9B 1px, text white */

.c-header__btn--recruit {
	width: 7.5rem;
	padding-inline: 0;
	background-color: var(--main);
	border-color: var(--main);
	color: var(--white);
}

/* お問い合わせ: Figma 138×40, fill #fff, stroke #044F9B 1px, text #044F9B */

.c-header__btn--contact {
	width: 8.625rem;
	padding-inline: 0;
	background-color: var(--white);
	border-color: var(--main);
	color: var(--main);
}

/* 採用情報/お問い合わせ ボタンは is-transparent-bg / is-scrolled でも色を変えず
   全ページ共通の通常色で固定 */

/* ハンバーガー (SP) */

.c-header__hamburger {
	display: none; /* PC base 値 (PC では display:none で描画ゼロ、 念のため元値維持) */
	width: 2rem;
	height: 1.5rem;
	position: relative;
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
}

.c-header__hamburger-line {
	position: absolute;
	left: 0;
	width: 100%; /* PC base height (PC では display:none で描画ゼロ、 念のため元値維持) */
	height: 0.125rem;
	background-color: var(--main);
	transition: rotate 0.3s ease, translate 0.3s ease, opacity 0.3s ease, background-color 0.4s ease;
}

/* header is-scrolled (bg 白) 時はハンバーガー線も黒 (= 文字色に合わせる) */

.c-header.is-scrolled .c-header__hamburger-line {
	background-color: var(--black);
}

.c-header__hamburger-line:nth-child(1) {
	top: 0;
}

.c-header__hamburger-line:nth-child(2) {
	top: 50%;
	translate: 0 -50%;
}

.c-header__hamburger-line:nth-child(3) {
	bottom: 0;
}

.is-drawer-open .c-header__hamburger-line:nth-child(1) {
	top: 50%;
	rotate: 25deg;
	translate: 0 -50%;
}

.is-drawer-open .c-header__hamburger-line:nth-child(2) {
	opacity: 0;
}

.is-drawer-open .c-header__hamburger-line:nth-child(3) {
	bottom: auto;
	top: 50%;
	rotate: -25deg;
	translate: 0 -50%;
}

/* ==========================================================================
   c-heading  日本語見出し (U-03 / U-04)
   - large: Noto Serif JP Bold 32-46px (TOP/service/products/recruit のリード見出し)
   - small: Noto Sans JP Regular 16px / line-height 200% (本文・リード文)
   - Figma: 17:5027 (32px), 17:4910 (46px MV), 17:4973 (32px Products)
   ========================================================================== */

.c-heading-large {
	font-family: var(--serif-font);
	font-weight: var(--fw-bold);
	font-size: max(2rem, 10px); /* デフォルト: Figma 17:1706 (一線の精度が、産業の未来を編み上げる。) 実値
     - line-height: 160%
     - letter-spacing: 0
     - palt: なし (シンプル設定)
     → 「材料から製品まで」(Figma 17:5027) は p-top-service 側で letter-spacing/palt override */
	line-height: 1.6;
	letter-spacing: 0;
	color: var(--white); /* 既定 (青背景セクション向け)、ページで上書き */
	margin: 0;
}

/* MV用 (一筋の線から、百年の信頼を編む。 Figma 17:4910 46px / line-height 140% / letter-spacing 10% / center) */

.c-heading-large--mv {
	font-size: max(2.875rem, 10px);
	line-height: 1.4;
	letter-spacing: 0.1em;
	text-align: center;
}

/* 黒テキスト版 (白背景向け、材料から系) */

.c-heading-large--dark {
	color: var(--black);
}

/* 青テキスト版 (recruit セクション「他にはない技術が」など Figma 17:4974, line-height 160%) */

.c-heading-large--main {
	color: var(--main);
	line-height: 1.6;
}

/* ========== c-heading-small (U-04 リード文) ========== */

.c-heading-small {
	font-family: var(--base-font);
	font-weight: 400;
	font-size: max(1rem, 10px);
	line-height: 2;
	letter-spacing: 0;
	color: var(--white); /* 既定、ページで上書き */
	margin: 0;
}

.c-heading-small--dark {
	color: var(--black);
}

/* ==========================================================================
   c-interview-card  社員インタビュー カード (Figma recruit_pc 17:2740)
   - 左: 画像 + 下に青グラデオーバーレイ + 右下に +ボタン (52×31 白bg+青+, モーダル起動)
   - 右: 26px Noto Serif JP Bold #1E62B5 タイトル + 伸線業 (青背景白) + 2012年 新卒入社 (黒)
   ========================================================================== */

.c-interview-card-list {
	display: flex;
	gap: 2.5rem;
	flex-wrap: wrap;
}

/* Swiper 版 (.swiper-slide が各 card)
   - default = non-active: image 245×300 のみ表示
   - .swiper-slide-active 付与: image 324×397 + body 239、 grid layout
   - active と non-active の image 下揃え (non-active padding-top 97)
   - Swiper の slidesPerView: 'auto' で各 slide の width を CSS で決定 */

.c-interview-card {
	width: 15.3125rem;
	height: 24.8125rem;
	background-color: transparent;
	padding-top: 6.0625rem;
	transition: width 0.4s ease, padding-top 0.4s ease, opacity 0.3s ease;
}

.c-interview-card__inner {
	display: block;
}

.c-interview-card__media {
	position: relative;
	width: 15.3125rem;
	height: 18.75rem;
	overflow: hidden;
	transition: width 0.4s ease, height 0.4s ease;
}

/* non-active (= default): body / overlay / +icon 非表示
   __more (button) は non-active でもクリック領域として残す (クリックで active 切替 + modal open) */

.c-interview-card .c-interview-card__media::after {
	display: none;
}

.c-interview-card .c-interview-card__more-icon {
	display: none;
}

.c-interview-card .c-interview-card__body {
	display: none;
}

/* === active card (Swiper の swiper-slide-active で自動付与) ===
   591/1280 = 46.17vw, 324/1280 = 25.31vw, 239/1280 = 18.67vw, 31/1280 = 2.42vw */

.c-interview-card.swiper-slide-active {
	width: 36.9375rem;
	padding-top: 0;
}

.c-interview-card.swiper-slide-active .c-interview-card__inner {
	max-width: 36.9375rem;
	display: grid;
	grid-template-columns: 20.25rem 14.9375rem;
	gap: 1.9375rem;
	align-items: start;
}

.c-interview-card.swiper-slide-active .c-interview-card__media {
	width: 20.25rem;
	height: 24.8125rem;
}

.c-interview-card.swiper-slide-active .c-interview-card__media::after {
	display: block;
}

.c-interview-card.swiper-slide-active .c-interview-card__more-icon {
	display: block;
}

.c-interview-card.swiper-slide-active .c-interview-card__body {
	display: flex;
}

.c-interview-card__image {
	position: absolute;
	inset: 0;
}

.c-interview-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* 下端の青グラデオーバーレイ
   stops: 0%(3996D1 0%) → 47%(3996D1 50%) → 100%(044F9B 100%)
   方向: 上(透明) → 下(濃青) */

.c-interview-card__media::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 42%;
	background: linear-gradient(to bottom, rgba(57, 150, 209, 0) 0%, rgba(57, 150, 209, 0.5) 47%, rgb(4, 79, 155) 100%);
	pointer-events: none;
}

/* クリック領域: __media 全体 (画像エリア全部) を覆う透明ボタン */

.c-interview-card__more {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	padding: 0;
	background-color: transparent;
	border: none;
	cursor: pointer;
	z-index: 2;
}

/* + アイコン box (52×31 透明bg + 白+, cornerRadius 7) - 視覚的な「+ボタン」 */

.c-interview-card__more-icon { /* === + アイコンの調整変数 (ここを変えれば太さ・サイズが変わる) === */
	--plus-size: 0.875rem; /* + 全体の長さ (横棒/縦棒の長さ) */
	--plus-thickness: 0.09375rem; /* 線の太さ (細→太) */
	--plus-color: var(--white); /* 線の色 */ /* ============================================================ */
	position: absolute;
	bottom: 1.3125rem;
	right: 1.1875rem;
	width: 3.25rem;
	height: 1.9375rem;
	background-color: transparent;
	border: 1px solid var(--white);
	border-radius: 0.4375rem;
	transition: background-color 0.3s ease;
	pointer-events: none; /* クリックは親 __more に通す */
	z-index: 2; /* __media::after (青グラデオーバーレイ) より上に描画 */ /* + の横棒 + 縦棒 を疑似要素で描画 */
}

.c-interview-card__more-icon::before,
.c-interview-card__more-icon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	background-color: var(--plus-color);
	transition: background-color 0.3s ease;
}

.c-interview-card__more-icon::before {
	width: var(--plus-size);
	height: var(--plus-thickness);
	translate: -50% -50%;
}

.c-interview-card__more-icon::after {
	width: var(--plus-thickness);
	height: var(--plus-size);
	translate: -50% -50%;
}

/* article 全体 (= __more クリック領域) hover で:
   - card 全体に opacity 0.7 (規約デフォルトのホバーエフェクト)
   - active card は + アイコン box が反転 (白bg + 青+) */

.c-interview-card__body {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	margin-top: 3.75rem;
	transition: opacity 0.4s ease;
}

.c-interview-card__name {
	display: none; /* Figma 実構造では タイトル＝desc文 が前提、人物名は modal 側 */
}

/* タイトル: 26px Noto Serif JP Bold #1E62B5 (薄青)、 italic + palt + letter-spacing -0.05em + white-space nowrap */

.c-interview-card__title {
	font-family: var(--serif-font);
	font-size: max(1.625rem, 10px);
	font-weight: var(--fw-bold);
	font-style: italic;
	font-feature-settings: "palt";
	letter-spacing: -0.05em;
	white-space: nowrap;
	color: var(--main-light);
	margin: 0;
	line-height: 1.5;
}

/* カテゴリタグ: 14px Medium 白 on 青グラデ背景 */

.c-interview-card__category {
	display: inline-block;
	width: -moz-fit-content;
	width: fit-content;
	padding: 0.1875rem 0.5rem;
	font-size: max(0.875rem, 10px);
	font-weight: var(--fw-medium);
	color: var(--white);
	background: linear-gradient(to right, rgb(4, 47, 155), rgb(57, 150, 209));
	border-radius: 0.125rem;
	margin: 1.9375rem 0 0 0.375rem;
}

/* 2012年 新卒入社: 16px Medium black */

.c-interview-card__year {
	font-family: var(--base-font);
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	color: var(--black);
	letter-spacing: -0.02em;
	margin: 0.5625rem 0 0 0.3125rem;
}

/* 詳細 (オプション) */

.c-interview-card__desc {
	display: none;
}

/* ==========================================================================
   c-interview-modal  社員インタビュー モーダル (Figma modal_pc_arai 17:3653)
   - 外側: グレー背景 (クリックで閉じる)
   - 内側: 白bg + 右上から放射状青グラデ (radial: blue→white at 46%)
   - ×ボタン: TOP-RIGHT, 52×31 青背景 #044F9B + 白×, cornerRadius 7
   - 左に画像 + 右にタイトル/カテゴリ/入社年/詳細
   - 下: the_content() h2/h3 = 20px Noto Sans JP Bold 青 + 下に灰線, p本文, img
   ========================================================================== */

.c-interview-modal {
	position: fixed;
	inset: 0;
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2rem 1rem;
	visibility: hidden;
	opacity: 0;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}

.c-interview-modal.is-open {
	visibility: visible;
	opacity: 1;
}

.c-interview-modal__backdrop {
	position: absolute;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.5);
	cursor: pointer;
}

.c-interview-modal__inner {
	position: relative;
	width: 100%;
	max-width: 62.5rem;
	max-height: 90vh;
	max-height: 90svh;
	display: flex;
	flex-direction: column;
	background-color: var(--white); /* Figma 線形 232° 不透明度 40% — 右上 #467EC3 / 左下 #FFFFFF */
	background-image: linear-gradient(232deg, rgba(70, 126, 195, 0.4) 0%, rgba(255, 255, 255, 0.4) 46%); /* Figma ドロップシャドウ (0 0 40 #000 15%) */
	box-shadow: 0 0 2.5rem rgba(0, 0, 0, 0.15);
	padding: 3.6875rem;
}

/* スクロールは中身 (__scroll) だけ。 __inner はパネルとして固定し、
   close ボタンの absolute 配置基準にする (= スクロールしても close が残る) */

.c-interview-modal__scroll {
	flex: 1 1 auto;
	overflow-y: auto;
	min-height: 0;
	-webkit-overflow-scrolling: touch;
}

/* ×ボタン: bg main、 border なし、 cornerRadius 7、 52×31、 × 白 25×1 ±35° */

.c-interview-modal__close {
	position: absolute;
	top: 1.25rem;
	right: 1.25rem;
	width: 3.25rem;
	height: 1.9375rem;
	background-color: var(--main);
	color: transparent;
	border: none;
	border-radius: 0.4375rem;
	cursor: pointer;
	font-size: 0;
	line-height: 1;
	z-index: 2;
	transition: opacity 0.3s ease;
}

/* ×形を擬似要素で白ライン2本 (Figma 値 25 ±55°、 GPU 描画でジャギ軽減) */

.c-interview-modal__close::before,
.c-interview-modal__close::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 1.5625rem;
	height: 1px;
	background-color: var(--white);
	will-change: transform;
	backface-visibility: hidden;
	transform-style: preserve-3d;
}

.c-interview-modal__close::before {
	translate: -50% -50%;
	rotate: 20deg;
}

.c-interview-modal__close::after {
	translate: -50% -50%;
	rotate: -20deg;
}

/* __header: 画像 399 + テキスト の flex 横並び、 左右中央寄せ (max-width 800)、 上揃え */

.c-interview-modal__header {
	display: flex;
	align-items: flex-start;
	gap: 4.375rem;
	margin: 0 auto 2.5rem;
	max-width: 50rem;
}

.c-interview-modal__image {
	flex-shrink: 0;
	width: 24.9375rem;
	height: 29.75rem;
	overflow: hidden;
}

.c-interview-modal__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.c-interview-modal__profile {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	margin-top: 7.25rem;
}

/* __title: 30px serif bold main (#044F9B) + palt + white-space nowrap */

.c-interview-modal__title {
	font-family: var(--serif-font);
	font-size: max(1.875rem, 10px);
	font-weight: var(--fw-bold);
	font-feature-settings: "palt";
	white-space: nowrap;
	color: var(--main);
	margin: 0;
	line-height: 1.5;
}

.c-interview-modal__category {
	display: inline-block;
	width: -moz-fit-content;
	width: fit-content;
	padding: 0.1875rem 0.625rem;
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	color: var(--white);
	background: linear-gradient(to right, rgb(4, 47, 155), rgb(57, 150, 209));
	border-radius: 0.125rem;
	margin: 2.25rem 0 0 0.625rem;
}

.c-interview-modal__name {
	font-family: var(--serif-font);
	font-size: max(1.625rem, 10px);
	font-weight: var(--fw-bold);
	color: var(--main-light);
	margin: 0;
	line-height: 1.5;
}

.c-interview-modal__year {
	font-family: var(--base-font);
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	color: var(--black);
	letter-spacing: -0.03em;
	margin: 0.5rem 0 0 0.625rem;
}

/* 本文 (the_content) — max-width 800 + 左右中央寄せ + margin-top 43 */

.c-interview-modal__body {
	max-width: 50rem;
	margin: 2.6875rem auto 0;
	font-size: max(0.875rem, 10px);
	line-height: 2;
	color: var(--black);
}

/* the_content() 出力
   - h2/h3 共通: 下線、 padding-bottom 6 / margin 43 0 17
   - h2 のみ font-size 大きく (24px) - クライアントが使用する場合の想定
   - 最初の h2/h3 は margin-top なし
   - p: 16px Regular black、 margin 0 */

.c-interview-modal__body h2,
.c-interview-modal__body h3 {
	position: relative;
	padding-bottom: 0.375rem;
	margin: 2.6875rem 0 1.0625rem;
	font-family: var(--base-font);
	font-size: max(1.25rem, 10px);
	font-weight: var(--fw-bold);
	color: var(--main);
	line-height: 1.6;
}

.c-interview-modal__body h2::after,
.c-interview-modal__body h3::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	max-width: 50rem;
	height: 0.1875rem;
	background: linear-gradient(to right, var(--main) 0%, rgba(4, 79, 155, 0.1) 100%);
}

/* h2 のみフォント大きめ (クライアントが見出し階層を使う場合に対応) */

.c-interview-modal__body h2 {
	font-size: max(1.5rem, 10px);
}

/* 最初の h2/h3 は margin-top なし */

.c-interview-modal__body > h2:first-child,
.c-interview-modal__body > h3:first-child {
	margin-top: 0;
}

.c-interview-modal__body p {
	font-family: var(--base-font);
	font-size: max(1rem, 10px);
	font-weight: 400;
	color: var(--black);
	line-height: 1.8;
	margin: 0;
}

.c-interview-modal__body picture,
.c-interview-modal__body figure {
	display: block;
	margin: 1.4375rem 0 0;
}

.c-interview-modal__body img {
	display: block;
	width: 100%;
	height: 18.5rem;
	object-fit: cover;
}

/* ==========================================================================
   c-news-card  newsカード (ヒアリング仕様)
   - 2列grid、各item: 左日時 + タイトル + 矢印
   - 下にグレー下線、最初の投稿の上にも同様の線
   ========================================================================== */

.c-news-card-list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0 3rem;
}

.c-news-card-list__item {
	list-style: none;
	border-bottom: 1px solid var(--border-gray);
	display: flex;
	align-items: stretch;
}

.c-news-card-list__item:nth-child(-n+2) {
	border-top: 1px solid var(--border-gray);
}

.c-news-card {
	display: grid;
	grid-template-columns: 5.9375rem 1fr 3.25rem;
	gap: 1rem;
	align-items: center;
	padding: 2.5rem 0;
	width: 100%;
	text-decoration: none;
	color: var(--black);
	transition: opacity 0.3s ease;
}

.c-news-card__date {
	font-family: var(--base-font);
	font-size: max(1rem, 10px);
	font-weight: 400;
	color: var(--black);
	margin: 0;
}

.c-news-card__title {
	font-size: max(1rem, 10px);
	font-weight: 400;
	line-height: 1.6;
	color: var(--black);
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.c-news-card-list__item.is-hidden {
	display: none;
}

.c-news-card__category {
	display: inline-block;
	padding: 0.125rem 0.5rem;
	font-size: max(0.6875rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 1.4;
	color: var(--main);
	border: 1px solid var(--main);
	border-radius: 0.125rem;
	white-space: nowrap;
}

.c-news-card__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3.25rem;
	height: 1.9375rem;
	background-color: var(--main);
	border-radius: 0.4375rem;
	flex-shrink: 0;
}

.c-news-card__arrow::before {
	content: "";
	display: block;
	width: 0.8125rem;
	height: 0.4375rem;
	background-color: var(--white);
	-webkit-mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	transition: translate 0.3s ease;
}

/* ==========================================================================
   c-page-mv  下層MV (U-06)
   - 青グラデ全面 + 英字大文字 + 日本語
   - Figma: company 17:1858, 130px Marcellus + 20px Noto Sans JP
   ========================================================================== */

.c-page-mv {
	position: relative;
	height: 22.6875rem;
	background-color: var(--main); /* fallback */
	background-image: linear-gradient(270deg, rgba(56, 149, 208, 0.2) 0%, rgba(30, 98, 181, 0.7) 51%, rgb(4, 79, 155) 100%), var(--page-mv-bg-image, none);
	background-size: cover, cover;
	background-position: center, center 100%;
	background-repeat: no-repeat, no-repeat;
	color: var(--white);
	padding-top: var(--header-height);
	overflow: hidden;
}

.c-page-mv__inner {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	height: 100%;
}

.c-page-mv__en {
	font-family: var(--en-font);
	font-size: 8.125rem;
	font-weight: 400;
	line-height: 1.2;
	margin: 2.625rem 0 0; /* "Privacy" "Sky" 等 最後が "y" 系の文字でグリフ右端が cut される対策 */
	padding-right: 0.1em; /* 下層 MV 英字 全ページ共通 -0.04em (per-page override 撤去済) */
	letter-spacing: -0.04em;
	background-image: linear-gradient(90deg, rgb(255, 255, 255) 50%, rgba(255, 255, 255, 0.5) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
	clip-path: inset(0 100% 0 0); /* 初期: 全 hidden (右 100% clip) */
	animation: c-page-mv-en-reveal 1.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.c-page-mv__ja {
	font-family: var(--base-font);
	font-size: max(1.25rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 1;
	margin: 0;
	padding-left: 0.75rem;
	color: var(--white);
}

/* light variant: news / privacy / contact 用 (青→白 グラデ全幅 20% / タイトル青系) */

.c-page-mv--light {
	background-color: transparent;
	background-image: linear-gradient(90deg, rgba(30, 98, 181, 0.2) 0%, rgba(255, 255, 255, 0.2) 100%);
}

.c-page-mv--light .c-page-mv__en { /* "Privacy" "Contact" 等で右端文字が薄くなる対策: end alpha 0.44 → 1 */
	background-image: linear-gradient(90deg, var(--main-light) 55%, rgb(157, 186, 223) 100%);
	margin: 4.3125rem 0 0;
}

.c-page-mv--light .c-page-mv__ja {
	color: var(--main);
}

/* ==========================================================================
   c-pagination  ページネーション (U-20)
   Figma node: 83:8776 (privacy_pc Group 197) 244.18 × 34
   - 全体 244 × 34、 矢印 + 数字 + 数字 + ... + 数字 + 矢印
   - 数字 Noto Sans JP Regular 16px black
   - 現在ページのみ円形 34×34 bg #CDDCEB
   - 矢印 ← → シンプル black、 ボーダーなし
   ========================================================================== */

.c-pagination {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.5625rem;
	margin-top: 3.4375rem;
}

.c-pagination__item {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.125rem;
	height: 2.125rem;
	font-family: var(--base-font);
	font-size: max(1rem, 10px);
	font-weight: 400;
	color: var(--black);
	background-color: transparent;
	border: none;
	border-radius: 50%;
	text-decoration: none;
	transition: background-color 0.3s ease;
}

.c-pagination__item.is-current {
	background-color: var(--blue-pagination);
	color: var(--black);
	pointer-events: none;
}

.c-pagination__item.is-disabled,
.c-pagination__item--disabled {
	color: rgba(0, 0, 0, 0.3);
	pointer-events: none;
	cursor: not-allowed;
}

.c-pagination__item--ellipsis {
	background: none;
	pointer-events: none;
}

.c-pagination__item--prev,
.c-pagination__item--next {
	color: var(--main);
}

.c-pagination__item--prev {
	translate: -0.3125rem 0;
}

.c-pagination__item--next {
	translate: 0.3125rem 0;
}

.c-pagination__item--prev::before,
.c-pagination__item--next::after {
	content: "";
	display: block;
	width: 0.8125rem;
	height: 0.4375rem;
	background-color: currentColor;
	-webkit-mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
}

.c-pagination__item--prev::before {
	rotate: 180deg;
}

/* ==========================================================================
   c-pagenavi  the_posts_pagination() 用ラッパー
   WordPress ネイティブクラス（.page-numbers）を c-pagination デザインに適合
   ========================================================================== */

.c-pagenavi .navigation {
	display: flex;
	justify-content: center;
	margin-top: 3.4375rem;
}

.c-pagenavi .nav-links {
	display: flex;
	align-items: center;
	gap: 0.5625rem;
}

.c-pagenavi .page-numbers {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.125rem;
	height: 2.125rem;
	font-family: var(--base-font);
	font-size: max(1rem, 10px);
	font-weight: 400;
	color: var(--black);
	background-color: transparent;
	border: none;
	border-radius: 50%;
	text-decoration: none;
	transition: background-color 0.3s ease;
}

.c-pagenavi .page-numbers.current {
	background-color: var(--blue-pagination);
	pointer-events: none;
}

.c-pagenavi .page-numbers.dots {
	background: none;
	pointer-events: none;
}

.c-pagenavi .page-numbers.prev,
.c-pagenavi .page-numbers.next {
	color: var(--main);
}

.c-pagenavi .page-numbers.prev::before,
.c-pagenavi .page-numbers.next::after {
	content: "";
	display: block;
	width: 0.8125rem;
	height: 0.4375rem;
	background-color: currentColor;
	-webkit-mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
}

.c-pagenavi .page-numbers.prev::before {
	rotate: 180deg;
}

/* .prev/.next がないときは擬似要素で disabled 矢印を補完 */

.c-pagenavi .nav-links::before,
.c-pagenavi .nav-links::after {
	content: "";
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.125rem;
	height: 2.125rem;
	color: rgba(0, 0, 0, 0.3);
	-webkit-mask: url(../images/common/arrow-right.svg) no-repeat center/0.8125rem 0.4375rem;
	mask: url(../images/common/arrow-right.svg) no-repeat center/0.8125rem 0.4375rem;
	background-color: currentColor;
}

.c-pagenavi .nav-links::before {
	rotate: 180deg;
	translate: -0.3125rem 0;
}

.c-pagenavi .nav-links::after {
	translate: 0.3125rem 0;
}

/* 実際の .prev/.next がある場合は擬似要素を非表示 */

.c-pagenavi .nav-links:has(.prev)::before {
	display: none;
}

.c-pagenavi .nav-links:has(.next)::after {
	display: none;
}

/* ==========================================================================
   c-product-list  製品一覧 (Figma 19:3039 products_pc)
   - 見出し JA のみ 28px Noto Sans JP Medium
   - 2列 grid (gap 52)、 各 item: 97 image + title + 52×31 button
   - 各 item 下に border 1px rgba(0,0,0,0.3)
   ========================================================================== */

.c-product-list {
	display: flex;
	flex-direction: column;
}

.c-product-list > * + * {
	margin-top: 3.25rem;
}

.c-product-list__heading {
	position: relative;
	font-family: var(--base-font);
	font-size: max(1.75rem, 10px);
	font-weight: var(--fw-medium);
	color: var(--black);
	line-height: 1.4;
	margin: 0;
	padding-bottom: 1.625rem;
	width: 100%;
	max-width: 50rem;
}

.c-product-list__heading::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 0.1875rem;
	background: linear-gradient(to right, var(--main) 0%, rgba(4, 79, 155, 0.1) 100%);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.c-product-list__heading.is-active::after {
	transform: scaleX(1);
}

.c-product-list__items {
	display: grid; /* Figma: card 374 + gap 52 + card 374 = 800 */
	grid-template-columns: 1fr 1fr;
	-moz-column-gap: 3.25rem;
	column-gap: 3.25rem;
	row-gap: 0;
	margin-top: 1rem;
}

/* 製品詳細 (MV なし) 用: タイトル下の余白を広めに + 列間を狭く + アイテム名フォントを大きく */

.c-product-list__items--single {
	margin-top: 1.875rem;
	-moz-column-gap: 2.5rem;
	column-gap: 2.5rem;
}

.c-product-list__items--single .c-product-list__title {
	font-size: max(1.25rem, 10px);
}

.c-product-list__items--single .c-product-list__link {
	-moz-column-gap: 2.875rem;
	column-gap: 2.875rem;
}

.c-product-list__item {
	list-style: none; /* Figma: stroke #000 opacity 0.3, 1px */
	border-bottom: 1px solid rgba(0, 0, 0, 0.3); /* SP: グリッドアイテムが min-content で広がらないよう制限 */
	min-width: 0;
}

.c-product-list__link {
	display: grid;
	grid-template-columns: 6.0625rem 1fr;
	-moz-column-gap: 1.5rem;
	column-gap: 1.5rem;
	align-items: center;
	min-height: 8.5625rem;
	padding: 1.25rem 0;
	text-decoration: none;
	color: var(--black);
	transition: opacity 0.3s ease;
}

.c-product-list__item--text-only .c-product-list__link {
	grid-template-columns: 1fr;
}

.c-product-list__image {
	width: 6.0625rem;
	height: 6.0625rem;
	aspect-ratio: 1/1;
	background-color: var(--bg-feature);
	overflow: hidden;
}

.c-product-list__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.c-product-list__body {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.c-product-list__body > * + * {
	margin-left: 1rem;
}

.c-product-list__title {
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	color: var(--black);
	margin: 0;
	line-height: 1.5;
	flex: 1;
}

/* Figma: 52×31 blue button + 13.18×7.38 white chevron (PDF と同サイズ) */

.c-product-list__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3.25rem;
	height: 1.9375rem;
	background-color: var(--main);
	border-radius: 0.4375rem;
	flex-shrink: 0;
}

.c-product-list__arrow::before {
	content: "";
	display: block;
	width: 0.8125rem;
	height: 0.4375rem;
	background-color: var(--white);
	-webkit-mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	transition: translate 0.3s ease;
}

/* ==========================================================================
   c-recruit-about  私たちの仕事 (Figma recruit_pc 17:2740 About)
   - 3つの円 (281×280) が overlap (隣り合う円が 26-30px 重なる)
   - LINEAR gradient #3996D1 → #1F4992 (上から下)
   - タイトル: 26px Noto Serif JP Bold 白
   - 本文: 14px Noto Sans JP Regular 白
   ========================================================================== */

.c-recruit-about__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	max-width: 50rem;
	margin-inline: auto;
}

/* 円同士の overlap (2個目以降を左にずらす)、 viewport 縮小で比率維持 */

.c-recruit-about__circle + .c-recruit-about__circle {
	margin-left: clamp(-1.875rem, -2.3vw, -1.25rem);
}

/* Figma gradient 107° + ドロップシャドウ、 viewport 縮小時に円サイズを clamp で fluid 化 (max 281) */

.c-recruit-about__circle {
	flex-shrink: 0;
	width: clamp(12.5rem, 22vw, 17.5625rem);
	aspect-ratio: 281/280;
	border-radius: 50%;
	background: linear-gradient(107deg, rgba(31, 73, 146, 0.9) 0%, rgba(57, 150, 209, 0.9) 100%);
	box-shadow: 0 0 1.25rem var(--main-light);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 2.5rem 1.875rem;
	color: var(--white);
	position: relative;
}

.c-recruit-about__circle:nth-child(1) {
	z-index: 1;
}

.c-recruit-about__circle:nth-child(2) {
	z-index: 2;
}

.c-recruit-about__circle:nth-child(3) {
	z-index: 3;
}

.c-recruit-about__circle-title {
	font-family: var(--serif-font);
	font-size: clamp(1.125rem, 2vw, 1.625rem);
	font-weight: var(--fw-bold);
	font-style: italic;
	font-feature-settings: "palt" 1, "halt" 1, "chws" 1; /* 「」 括弧詰め組 (PC/SP) */
	color: var(--white);
	line-height: 1.4;
	margin: 0 0 0.875rem;
	white-space: nowrap;
}

.c-recruit-about__circle-text {
	font-family: var(--base-font);
	font-size: clamp(0.6875rem, 1.1vw, 0.875rem);
	line-height: 1.7;
	font-feature-settings: "palt" 1, "halt" 1, "chws" 1; /* 「」 括弧詰め組 (PC/SP) */
	color: var(--white);
	margin: 0;
}

/* ==========================================================================
   c-recruit-benefits  福利厚生・社内制度 (Figma recruit_pc 17:2740)
   - 3列grid、各box: 256×86 白背景、青文字 18px Bold
   - サブタイトル 14px Bold blue (オプション)
   ========================================================================== */

.c-recruit-benefits {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 16rem));
	gap: 1.25rem 1.25rem;
	justify-content: start;
	width: 100%;
}

.c-recruit-benefits__item {
	width: 100%;
	min-height: 5.375rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: 0.125rem;
	padding: 1rem 1.25rem;
	background-color: var(--white);
	border-radius: 0.25rem;
	box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.04);
}

.c-recruit-benefits__title {
	font-size: max(1.125rem, 10px);
	font-weight: var(--fw-bold);
	color: var(--main);
	line-height: 1.4;
	margin: 0;
}

.c-recruit-benefits__sub {
	font-size: max(0.875rem, 10px);
	font-weight: var(--fw-bold);
	color: var(--main);
	line-height: 1.4;
	margin: 0;
}

/* ==========================================================================
   c-recruit-entry-cta  Entry / ご応募はこちら CTA
   - PC (Figma recruit_pc 17:2740): 1280×360 / 中央 800×243 ガラスBOX / Entry 横並び中央
   - 背景: 写真 + 青オーバーレイ (rgb(4,79,155))
   - 中: "Entry" Marcellus 白グラデ + "ご応募はこちら" Medium 白 + 矢印 button

   @figma-trace (SP)
   component: c-recruit-entry-cta (SP)
   file: Frame 376 = 156:8362 (375×... / Entry部 ≈228px, footer y228 開始)
   frames:
     - 156:8368 Rectangle 417 ガラスBOX → 335×147, radius 10, fill rgb(255,255,255) a0.3,
                BACKGROUND_BLUR r6.2, DROP_SHADOW r9.3 rgba(0,0,0,0.15) off0,0, 左右余白20
     - 156:8370 Text "Entry" → 112.31px Marcellus Regular, line-height 80%, letter-spacing 0,
                fill linear white(1.0)→white(0.0), 左上 (box内 x-2,y0)
     - 156:8369 Text "ご応募はこちら" → 16px Noto Sans JP Medium rgb(255,255,255), line-height 200%, 右下
     - 156:8372 Rectangle 157 矢印BOX → 52×31, radius 7, rgb(255,255,255) a0.2 (現状実装と一致)
   verified: 2026-06-11 by figma_execute + figma_capture_screenshot(156:8633)
   verified-by: manual
   ========================================================================== */

.c-recruit-entry-cta {
	position: relative;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 3.6875rem 1.25rem 3.1875rem;
	overflow: hidden;
}

/* ★R6: 写真 (背景レイヤー、z-index 0) → 上に青オーバーレイ (::after) を重ねる
   Figma 17:2925-2928: 写真の上に青グラデを overlay する正しい構造 */

.c-recruit-entry-cta__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	overflow: hidden;
}

.c-recruit-entry-cta__bg img,
.c-recruit-entry-cta__bg picture {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* 青グラデオーバーレイ (写真の上、ガラスボックスの下) */

.c-recruit-entry-cta__bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(4, 79, 155, 0.8);
	z-index: 1;
}

/* 中央のガラスボックス (800×243 白30%透明、 cornerRadius 10)、 Entry+btn を __group で囲み中央配置 */

.c-recruit-entry-cta__inner {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: 50rem;
	min-height: 15.1875rem;
	padding: 2.5rem 3.75rem 2.5rem 2.69375rem; /* Figma 塗り FFFFFF 30% + 角の半径 10 + ドロップシャドウ 0 0 30 #000 15% + 背景ぼかし 20 */
	background-color: rgba(255, 255, 255, 0.3);
	border-radius: 0.625rem;
	box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.15);
	backdrop-filter: blur(1.25rem);
	-webkit-backdrop-filter: blur(1.25rem);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: opacity 0.3s ease;
}

/* Entry + btn group */

.c-recruit-entry-cta__group {
	display: flex;
	align-items: center;
	gap: 2.125rem;
}

.c-recruit-entry-cta__title {
	font-family: var(--en-font);
	font-size: clamp(4rem, 9vw, 7.3125rem);
	font-weight: 400; /* y の descender (下の尻尾) が切れないよう line-height 拡張 */
	line-height: 1.2;
	margin: -1.25rem 0 0 0;
	letter-spacing: 0.02em; /* Figma 線形 0%(#FFF 100%) → 67%(#FFF 43%) */
	background-image: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0.43) 67%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

/* btn を Entry text と同じ flex 行に並べる (横並び) */

.c-recruit-entry-cta__btn {
	display: inline-flex;
	align-items: center;
	gap: 1.125rem;
	margin-top: 0.5rem;
	font-size: max(1.1875rem, 10px);
	font-weight: var(--fw-medium);
	color: var(--white);
	text-decoration: none;
	flex-shrink: 0;
	transition: opacity 0.3s ease;
}

.c-recruit-entry-cta__btn-text {
	white-space: nowrap;
}

.c-recruit-entry-cta__btn-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3.25rem;
	height: 1.9375rem;
	background-color: rgba(255, 255, 255, 0.2);
	border-radius: 0.4375rem;
}

.c-recruit-entry-cta__btn-arrow::before {
	content: "";
	display: block;
	width: 0.8125rem;
	height: 0.4375rem;
	background-color: var(--white);
	-webkit-mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	mask: url(../images/common/arrow-right.svg) no-repeat center/contain; /* hover で矢印 chevron が右にスライド */
	transition: translate 0.3s ease;
}

/* hover 効果:
   - utility/_motion.scss の global a:hover { opacity:0.7 } は c-recruit-entry-cta を除外済
   - 代わりに opacity 0.9 で視認性を保ちつつ控えめな hover フィードバック
   - 矢印スライド (3px) も併用 */

/* ==========================================================================
   c-recruit-environment  働く環境 (Figma recruit_pc 17:2740)
   - 青色のJPタイトル + 詳細テキスト
   - シンプル縦積み構造
   ========================================================================== */

/* アイテム間 border */

.c-recruit-environment {
	display: flex;
	flex-direction: column;
}

.c-recruit-environment__item {
	display: flex;
	flex-direction: column;
	gap: 1.0625rem;
	padding-block: 2.25rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

.c-recruit-environment__item:first-child {
	padding-top: 0;
}

.c-recruit-environment__item:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.c-recruit-environment__title { /* Figma 17:2746/2747/2748: 24px Noto Sans JP Bold #044F9B */
	font-family: var(--base-font);
	font-size: max(1.5rem, 10px);
	font-weight: var(--fw-bold);
	color: var(--main);
	line-height: 1.5;
	margin: 0;
}

/* Figma 16px Noto Sans JP Medium、 line-height 1.6 */

.c-recruit-environment__text {
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 1.6;
	color: var(--black);
	margin: 0;
}

/* ==========================================================================
   c-section-title-en  英字大装飾セクションタイトル (U-02)
   - Figma: Service (17:4923, 280px) / Products (17:4956, 250px) / Recruit (17:4859, 280px)
   - Marcellus Regular 250-280px、line-height 80%
   - 下から上にフェードする縦グラデ (opacity 0.2)
   - fade-up アニメ対象 (js-fadeup)
   ========================================================================== */

.c-section-title-en {
	font-family: var(--en-font);
	font-weight: 400; /* Figma: Service/Recruit 280px (default)、Products 250px は --products modifier */
	font-size: max(17.5rem, 10px); /* Figma: line-height 80% (Marcellus はオーバーフロー clip しない) */
	line-height: 0.8;
	letter-spacing: 0;
	margin: 0;
	opacity: 0.2; /* 縦方向グラデ: 上=不透明、下=透明 */
	background: linear-gradient(to bottom, currentColor 0%, transparent 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: var(--white);
	-webkit-text-fill-color: transparent;
	text-transform: capitalize;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	white-space: nowrap; /* 改行禁止 (Service が "Servic" にならないように) */ /* user 指示 (2026-06-02): padding-top は不要 (title 上端と text 上端の間に余計な gap が出る原因)
     padding-bottom のみ残す = 下端の clip 回避用 */
	padding-block: 0 0.1em;
}

/* Products は 250px (Figma 17:4956) */

.c-section-title-en--products {
	font-size: max(15.625rem, 10px);
}

/* user指示: 斜め体 (italic skew) — Service/Products title 共通 */

.c-section-title-en--italic {
	font-style: italic;
	display: inline-block;
	transform: skewX(-10deg);
}

/* Recruit用 青グラデ (Figma 17:4859: rgba(30,98,181,1) → rgba(4,79,155,0) opacity 0.2) */

.c-section-title-en--blue {
	background: linear-gradient(to bottom, rgb(30, 98, 181) 0%, rgba(4, 79, 155, 0) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

.c-section-title-en--gray {
	background: linear-gradient(to bottom, var(--border-gray) 0%, transparent 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

/* ==========================================================================
   c-section-title-line  英字+日本語+下線グラデアニメ (U-09)
   - Figma: company 17:1858 (Greetings 60px Marcellus + 社長挨拶 16px Noto Sans JP Medium)
   - 下線: Rectangle 364, 800×3, linear-gradient(to right, #044F9B 0%, rgba(4,79,155,0.1) 100%)
   - js-line-anim で is-active 付与時、scaleX 0→1 (origin left) で表示
   ========================================================================== */

.c-section-title-line {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding-bottom: 2.1875rem;
	position: relative;
	margin: 0; /* 線(::after)を 800px 確保するため最低幅を確保 */
	width: 100%;
	max-width: 50rem;
}

.c-section-title-line__en {
	display: block; /* h2 内 span でも block 扱い */
	font-family: var(--en-font);
	font-size: max(3.75rem, 10px);
	font-weight: 400;
	line-height: 1.2; /* descender (g/y/p) 見切れ防止 */ /* Figma stops 0%(#000) → 73%(#1E62B5) → 100%(#1E62B5) */
	background-image: linear-gradient(90deg, rgb(0, 0, 0) 0%, var(--main-light) 73%, var(--main-light) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
	margin: 0;
}

.c-section-title-line__ja {
	display: block;
	font-family: var(--base-font);
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 1.5;
	color: var(--black);
	margin: 0;
	padding-left: 0.3125rem;
}

/* 下線: 800×3 (parent幅で制約)、blue→10%blue グラデ。scaleX 0→1 アニメ */

.c-section-title-line::after {
	content: "";
	position: absolute;
	bottom: 0;
	width: 100%; /* parent (.c-section-title-line) max-width 800px に従う */
	height: 0.1875rem;
	background: linear-gradient(to right, var(--main) 0%, rgba(4, 79, 155, 0.1) 100%);
	transform: scaleX(0);
	transform-origin: left center; /* タイトルグラデと同期。最初ゆっくり→後半加速 (easeInQuart) */
	transition: transform 1.5s cubic-bezier(0.5, 0, 0.75, 0);
}

.c-section-title-line.is-active::after {
	transform: scaleX(1);
}

/* ==========================================================================
   modifier --grad-anim : 「左→右にグラデが流れる」アニメ
   - service / recruit ページのセクションタイトルに適用
   - base 最終状態 (0%#000 → 73%#1E62B5 → 100%#1E62B5) を 200% size に圧縮
   - position 100% → 0% アニメで青が右から左へ流れ、 最終 (visible 0-50%) は base と一致
   - .is-active 付与時 (js-line-anim IntersectionObserver と同タイミング) に発火
   ========================================================================== */

.c-section-title-line--grad-anim .c-section-title-line__en {
	background-image: linear-gradient(to right, rgb(0, 0, 0) 0%, var(--main-light) 36.5%, var(--main-light) 50%, rgb(0, 0, 0) 100%);
	background-size: 200% auto;
	background-repeat: no-repeat;
	background-position: 100% center;
}

.c-section-title-line--grad-anim.is-active .c-section-title-line__en {
	animation: section-title-grad-flow 1.5s cubic-bezier(0.5, 0, 0.75, 0) forwards;
}

/* .c-service-feature は flex column wrapper。 子間 spacing は margin-top (HARD RULE) */

.c-service-feature {
	display: flex;
	flex-direction: column;
}

.c-service-feature > * + * {
	margin-top: 4.1875rem;
}

.c-service-feature__item {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

/* nth-child(even) = Feature 2: text left / 画像 right (zig-zag) */

.c-service-feature__item:nth-child(even) {
	flex-direction: row-reverse;
}

.c-service-feature__image {
	width: 47.4%; /* Figma 379/800 ≈ 47.4 */
	aspect-ratio: 379/290; /* Figma 実値 */
	border-radius: 0.125rem;
	overflow: hidden;
}

.c-service-feature__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.c-service-feature__body {
	display: flex;
	flex-direction: column;
	margin-top: 2.0625rem;
	width: 46.1%;
}

.c-service-feature__item:nth-of-type(2) .c-service-feature__body {
	padding-left: 1.3125rem;
}

.c-service-feature__number {
	font-family: var(--en-font); /* Marcellus */
	font-size: max(0.875rem, 10px);
	font-weight: 400;
	color: var(--main);
	margin: 0;
	line-height: 1;
}

.c-service-feature__title {
	font-family: var(--serif-font);
	font-size: max(1.625rem, 10px);
	font-weight: var(--fw-bold);
	font-style: italic;
	color: var(--main);
	line-height: 1.3;
	margin: 1.5625rem 0 0;
	text-indent: 0.6em;
}

.c-service-feature__item:nth-of-type(1) .c-service-feature__title,
.c-service-feature__item:nth-of-type(2) .c-service-feature__title { /* 「」後 (閉じ括弧) の全角アキを詰める (Feature3 と同じ palt/halt/chws)。 PC・SP 共通 */
	text-indent: 0;
	font-feature-settings: "palt" 1, "halt" 1, "chws" 1;
}

/* Feature 3: text-indent 0.6em が 1 行目のみ適用される問題対策。
   1 行目の右ずれを打ち消して全行左揃え + 「「」 詰め組で 2 行目左ずれ吸収 */

.c-service-feature__item:nth-of-type(3) .c-service-feature__title {
	text-indent: 0;
	font-feature-settings: "palt" 1, "halt" 1, "chws" 1;
}

.c-service-feature__desc {
	font-size: max(1rem, 10px);
	line-height: 2;
	color: var(--black);
	margin: 1.375rem 0 0;
}

/* ==========================================================================
   c-service-flow  生産工程の連携 (Figma service_pc 17:2076 Flow)
   - 各item: 2段構造
     上段: 青グラデ帯 800×61 (left→right: #044F9B → #3996D1)
     - 伸線 26px Noto Serif JP Bold WHITE + しんせん (furigana) 12px Noto Sans JP WHITE 横並び
     - Flow.N 24px Marcellus WHITE 右端
     下段: 左テキスト (理想の太さを引き出す 26px Noto Serif JP Bold #044F9B + body) + 右画像
   ========================================================================== */

.c-service-flow__item {
	border-radius: 0;
	overflow: hidden;
}

.c-service-flow__header {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 3.8125rem;
	padding-block: 0;
	padding-inline: 3.1875rem 2.375rem;
	background: linear-gradient(to right, var(--main) 0%, var(--blue-accent) 100%);
	color: var(--white);
}

.c-service-flow__header::before {
	content: "";
	position: absolute;
	inset: 0;
	background-color: var(--stack-overlay-color, transparent);
	pointer-events: none;
}

.c-service-flow__header { /* child を ::before の上に配置 */
}

.c-service-flow__header > * {
	position: relative;
	z-index: 1;
}

.c-service-flow__item.is-collapsed {
	clip-path: inset(0 0 calc(100% - 0.3125rem) 0);
}

.c-service-flow__heading-group {
	display: flex;
	align-items: baseline;
}

.c-service-flow__heading-group > * + * {
	margin-left: 0.75rem;
}

.c-service-flow__heading {
	font-family: var(--serif-font);
	font-size: max(1.625rem, 10px);
	font-weight: var(--fw-bold);
	font-style: italic;
	color: var(--white);
	margin: 0;
	line-height: 1;
}

.c-service-flow__heading { /* 320px 等極小 SP では heading font 縮小で step との重なり回避 */
}

.c-service-flow__furigana {
	font-family: var(--base-font);
	font-size: max(0.75rem, 10px);
	font-weight: 400;
	color: var(--white);
	margin: 0; /* user 指示 (2026-05-30): heading italic 化で漢字との余白が詰まったため、
     furigana 側で 9px の左余白を明示 (margin: 0 の後に書かないとリセットされる) */
	margin-left: 0.5625rem;
	line-height: 1;
}

.c-service-flow__step {
	font-family: var(--en-font); /* Marcellus */
	font-size: max(1.5rem, 10px);
	font-weight: 400;
	color: var(--white);
	margin: 0;
	letter-spacing: 0.02em;
	white-space: nowrap;
}

.c-service-flow__step { /* 320px 等極小 SP では step font 縮小で heading との重なり回避 */
}

.c-service-flow__body {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	padding: 1.75rem 2.5rem 2rem 2.5rem;
	align-items: flex-start;
	background-color: var(--bg-feature);
}

.c-service-flow__text {
	display: flex;
	flex-direction: column;
	width: 45.417%;
	margin-top: 2rem;
}

.c-service-flow__title {
	font-family: var(--serif-font); /* PC 1280: 26px → 狭くなるに従って徐々に縮小、 最小 14px。
     白space:nowrap で改行禁止、 clamp で gradual shrink */
	font-size: clamp(0.875rem, 2.03vw, 1.625rem);
	font-weight: var(--fw-bold);
	font-style: italic;
	color: var(--main);
	line-height: 1.4;
	letter-spacing: -0.04em;
	margin: 0;
	font-feature-settings: "palt" 1;
	white-space: nowrap;
}

.c-service-flow__desc {
	font-size: max(1rem, 10px);
	line-height: 2;
	letter-spacing: 0;
	color: var(--black);
	margin: 1.0625rem 0 0;
}

.c-service-flow__image {
	width: 49%;
	aspect-ratio: 352/252;
	border-radius: 0.125rem;
	overflow: hidden;
}

.c-service-flow__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ==========================================================================
   p-404  404 Not Found ページ
   - Figma デザインなし (共通サイトデザインに馴染ませた汎用 404)
   - 中央寄せ + 大きな 404 数字 + タイトル + 説明 + トップへ戻るボタン
   - メインカラー: var(--main) #044F9B
   ========================================================================== */

.p-404 {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: calc(100vh - var(--header-height)); /* user 指示 (2026-06-03): PC padding-block 130px 7.5rem */
	padding-block: 8.125rem 7.5rem;
	background-color: var(--white);
}

.p-404__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 1.5rem;
	width: 100%;
}

.p-404__number {
	font-family: var(--en-font);
	font-size: clamp(7.5rem, 18vw, 15rem);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.02em;
	color: transparent;
	background-image: linear-gradient(180deg, var(--main) 0%, var(--main-light) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	margin: 0;
}

.p-404__title {
	font-family: var(--base-font);
	font-size: max(2rem, 10px);
	font-weight: var(--fw-bold);
	line-height: 1.5;
	color: var(--main);
	margin: 0;
}

.p-404__lead {
	font-family: var(--base-font);
	font-size: max(1rem, 10px);
	font-weight: 400;
	line-height: 2;
	color: var(--black);
	margin: 0;
}

.p-404__btn {
	margin-top: 1rem;
}

/* ==========================================================================
   p-company-greetings  社長挨拶セクション
   - 左: 代表者写真 (28.625%) + 役職名 + 氏名
   - 右: 見出し italic (引用) + 本文 (63.625%)
   - body は flex space-between
   ========================================================================== */

.p-company-greetings__body {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	padding-left: 0.625rem;
	margin-top: 3.3125rem;
}

.p-company-greetings__photo {
	display: flex;
	flex-direction: column;
	width: 28.625%;
}

.p-company-greetings__photo > * + * {
	margin-top: 1.9375rem;
}

/* parallax: picture を枠化して img の微動 (scale + translate) を overflow でクリップ。
   transform は layout に影響しないため枠の高さ・周囲の余白は不変。 */

.p-company-greetings__photo picture {
	display: block;
	overflow: hidden;
}

.p-company-greetings__photo img {
	width: 100%;
	height: auto;
	aspect-ratio: 229/310;
	object-fit: cover;
}

.p-company-greetings__caption {
	display: flex;
	flex-direction: column;
}

.p-company-greetings__caption > * + * {
	margin-top: 0.125rem;
}

/* PC: 写真下の caption 表示、 SP: text 末尾 caption 表示 */

.p-company-greetings__caption--sp {
	display: none;
	margin-top: -0.625rem; /* SP: 上の text と近づける */
}

/* Figma 17:1876: 16px Noto Sans JP Regular */

.p-company-greetings__position {
	font-size: max(1rem, 10px);
	font-weight: 400;
	line-height: 2;
	color: var(--black);
	margin: 0;
}

.p-company-greetings__name {
	font-size: max(1.4375rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 2;
	color: var(--black);
	margin: -0.3125rem 0 0;
}

.p-company-greetings__text {
	display: flex;
	flex-direction: column;
	width: 63.625%;
}

.p-company-greetings__text > * + * {
	margin-top: 2.0625rem;
}

.p-company-greetings__heading {
	font-family: var(--serif-font);
	font-size: max(1.625rem, 10px);
	font-weight: var(--fw-bold);
	font-style: italic;
	line-height: 1.5;
	color: var(--main);
	margin: 0;
	font-feature-settings: "palt" 1, "halt" 1, "chws" 1;
}

/* Figma 17:1875: 14px Noto Sans JP Regular, line-height 200% */

.p-company-greetings__message {
	display: flex;
	flex-direction: column;
}

.p-company-greetings__message > * + * {
	margin-top: 1.25rem;
}

.p-company-greetings__paragraph {
	font-size: max(0.875rem, 10px);
	font-weight: 400;
	line-height: 2;
	color: var(--black);
	margin: 0;
}

.p-company {
	position: relative;
}

.p-company__body {
	position: relative;
	padding-block: 2.25rem 0;
}

.p-company__body::after {
	content: "";
	display: block;
	clear: both;
}

.p-company__sidebar {
	float: left;
	position: sticky;
	top: calc(var(--header-height) + 1.25rem);
	width: clamp(11.25rem, 22vw, 15rem);
	margin-top: 0.625rem;
	margin-left: calc(max(0px, (100vw - 80rem) / 2) + 1.8125rem); /* sticky 追従の下端ストッパー: nav 下端を最終セクション (.p-company-access) の
     コンテンツ下端 (区切り線) に合わせて停止。 値 = その section の下余白分。
     (footer 直前の空き余白に nav が突き出るのを防ぐ。 ページ毎に最終 section の下余白に合わせる) */
	margin-bottom: 9rem;
	z-index: 5;
}

.p-company__anchor-nav { /* c-anchor-nav 委譲 */
}

/* ===== Sections base ===== */

.p-company-greetings,
.p-company-history {
	position: relative;
}

.p-company-information {
	position: relative;
	background-color: var(--bg-feature);
	padding-block: 6.25rem 6.8125rem;
}

.p-company-access {
	position: relative;
	background-color: var(--bg-feature);
	padding-block: 5.5625rem 9rem;
}

.p-company-information__list {
	margin-top: 1.0625rem;
}

.p-company-history__body {
	margin-top: 1.5rem;
}

.p-company-access__body {
	margin-top: 2.6875rem;
}

.c-company-access > * + * {
	margin-top: 1.3125rem;
}

/* ===== Greetings (section padding のみ。 内部 element は _p-company-greetings.scss が責務) ===== */

.p-company-greetings {
	padding-block: 0 6.5rem;
}

.p-company-information__badges {
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: flex-end;
	margin-top: 2.0625rem;
	padding: 0 0 1.5625rem;
	gap: 2.3125rem;
	min-width: 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
	list-style: none;
}

.p-company-information__badge {
	display: flex;
	flex-direction: column;
	min-width: 0;
	flex: 0 1 auto;
}

.p-company-information__badge img {
	width: auto;
	max-width: 100%;
	max-height: clamp(9.375rem, 20vw, 14.0625rem);
	height: auto;
	display: block;
}

/* SP: badge 1=302×225, badge 2/3=150×216 中央寄せ */

.p-company-information__badge-label {
	font-size: max(0.875rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 1.5;
	color: var(--black);
	margin-top: 0.3125rem;
	text-align: center;
}

.p-company-history {
	padding-block: 5.75rem 6rem;
}

.p-company-history__body {
	display: flex;
	flex-direction: column;
}

.p-company-history__body > * + * {
	margin-top: 1.5rem;
}

.p-company-history__list-wrap {
	position: relative;
	overflow: hidden;
	transition: max-height 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.p-company-history__list-wrap.is-collapsed {
	max-height: 36.25rem;
}

/* Figma 17:1981 Rectangle 200: white(0)→white(1) 180deg, h=143 */

.p-company-history__fade {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 8.9375rem;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%);
	pointer-events: none;
	transition: opacity 0.3s ease;
}

.p-company-history__list-wrap:not(.is-collapsed) .p-company-history__fade {
	opacity: 0;
}

.p-company-history__toggle {
	align-self: center;
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	width: 14.375rem;
	height: 3.75rem;
	padding: 0 0.9375rem 0 1.25rem;
	background-color: var(--main);
	border: 1px solid var(--main);
	border-radius: 0.625rem;
	color: var(--white);
	font-family: var(--base-font);
	font-size: max(1.125rem, 10px);
	font-weight: 400;
	cursor: pointer;
	transition: background-color 0.3s ease, color 0.3s ease;
}

.p-company-history__toggle-text {
	flex: 0 0 auto;
}

.p-company-history__toggle-icon {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3.25rem;
	height: 1.9375rem;
	background-color: rgba(255, 255, 255, 0.2);
	border-radius: 0.4375rem;
	position: relative;
}

.p-company-history__toggle-icon::before,
.p-company-history__toggle-icon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	background-color: var(--white);
	transition: transform 0.3s ease;
}

.p-company-history__toggle-icon::before {
	width: 0.875rem;
	height: 0.125rem;
	transform: translate(-50%, -50%);
}

.p-company-history__toggle-icon::after {
	width: 0.125rem;
	height: 0.875rem;
	transform: translate(-50%, -50%);
}

.p-company-history__toggle[aria-expanded=true] .p-company-history__toggle-icon::after {
	transform: translate(-50%, -50%) scaleY(0);
}

/* ===== Access 内部 ===== */

.p-company-access__heading {
	font-size: max(1.125rem, 10px);
	font-weight: var(--fw-bold);
	color: var(--main);
	margin: 0;
}

.p-company-access__gmap-icon {
	flex-shrink: 0;
	width: 0.8125rem;
	height: 0.8125rem;
	object-fit: contain;
}

.p-company-access__gmap-text { /* テキスト span */
}

.p-company-access__map {
	width: 100%;
	height: 20.6875rem;
	background-color: var(--bg-placeholder);
	margin-top: 1.125rem;
}

.p-company-access__map-iframe {
	width: 100%;
	height: 100%;
	display: block;
}

.p-company-access__info { /* 上マージンは共通 (.c-company-access > * + *) に頼らず個別指定 */
	margin-top: 1.5rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: nowrap;
	min-width: 0;
}

.p-company-access__info > * + * {
	margin-left: 2.5rem;
}

.p-company-access__info-address {
	flex: 0 1 auto;
	display: flex;
	flex-direction: column;
}

.p-company-access__info-address > * + * {
	margin-top: 0.25rem;
}

.p-company-access__info-address-line {
	font-size: max(1rem, 10px);
	line-height: 1.5;
	letter-spacing: 0;
	color: var(--black);
	margin: 0;
}

.p-company-access__transport {
	flex: 0 1 24.0625rem;
	display: flex;
	flex-direction: column;
	min-width: 0;
	padding: 1.25rem 1.6875rem;
	gap: 0.75rem;
	background-color: var(--white);
	margin-top: 0.25rem;
}

.p-company-access__transport-item {
	display: flex;
	align-items: center;
	font-size: max(0.875rem, 10px);
	line-height: 1.5;
	color: var(--black);
	margin: 0;
}

.p-company-access__transport-item > * + * {
	margin-left: 0.5rem;
}

.p-company-access__transport-icon {
	flex-shrink: 0;
	width: 1.25rem;
	height: 1.125rem;
	object-fit: contain;
}

.p-company-access__transport-text { /* テキスト span */
}

.p-company-access__transport-note {
	font-size: max(0.75rem, 10px);
	margin-left: -0.3125rem;
}

.p-company-access__item--alone {
	grid-column: 1/-1;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	text-align: left;
	border-top: 1px solid rgba(0, 0, 0, 0.2);
	padding: 1.875rem 0;
}

.p-company-access__item--alone > * + * {
	margin-left: 3.5rem;
}

.p-company-access__item--alone .p-company-access__address {
	margin-top: 0;
}

/* 専属外注 (最終 item) 直前 2 item (= PC 2列の最終 pair) の border-bottom を撤去 */

.c-company-access-list > .c-company-access__item:nth-last-child(2),
.c-company-access-list > .c-company-access__item:nth-last-child(3) {
	border-bottom: none;
}

/* SP は1列のため item5 (nth-last-child 3) の下に
   上線を持たない item6 が続き区切り線が消える → SP のみ下線を復活 */

/* ==========================================================================
   p-confirm  お問い合わせ（確認）
   ========================================================================== */

.p-confirm {
	padding-block: var(--header-height) 6.25rem;
}

.p-confirm__title {
	font-size: max(2.625rem, 10px);
	font-weight: var(--fw-bold);
	color: var(--main);
	line-height: 1.8;
	text-align: center;
}

.p-confirm .p-form {
	margin-block-start: 3.4375rem;
}

.p-confirm .p-form__section {
	padding-inline: 6.25rem 6.875rem;
	padding-block: 3.9375rem 4.375rem;
}

.p-confirm .p-form__wrap + .p-form__wrap {
	margin-top: 3.125rem;
}

.p-confirm .p-form__wrap + .p-form__wrap[data-position=top] {
	margin-top: 3.75rem;
}

.p-confirm .p-form__label {
	width: 14.0625rem;
}

.p-confirm .p-form__value {
	font-size: max(0.875rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 2;
}

.p-confirm .p-form__value.p-form__value--large {
	font-size: max(1rem, 10px);
}

.p-confirm__action {
	display: flex;
	justify-content: center;
	gap: 1.875rem;
	margin-block-start: 3.75rem;
}

.p-confirm .c-btn--outline {
	background-color: var(--white);
	border-width: 1px;
	border-color: var(--main);
	color: var(--main);
	flex-direction: row-reverse;
}

.p-confirm .c-btn--outline .c-btn__arrow {
	background-color: rgba(4, 79, 155, 0.2);
	color: var(--main);
}

/* ==========================================================================
   p-contact  お問い合わせ
   ========================================================================== */

.p-contact__body {
	padding-block: 0.9375rem 7.5rem;
}

.p-contact__lead {
	font-size: max(1rem, 10px);
	font-weight: 400;
	line-height: 1.8;
	text-align: center;
}

/* ==========================================================================
   p-form  フォームレイアウト
   ========================================================================== */

.p-form {
	margin-block-start: 3.25rem;
}

.p-form__section {
	background-color: var(--bg-feature);
	max-width: 62.5rem;
	margin-inline: auto;
	padding-block: 3.75rem;
	padding-inline: 6.25rem;
}

.p-form__section + .p-form__section {
	margin-block-start: 1.25rem;
}

.p-form__wrap {
	display: flex;
	align-items: center;
	gap: 2.1875rem;
}

.p-form__wrap[data-position=top] {
	align-items: flex-start;
}

.p-form__wrap + .p-form__wrap {
	margin-block-start: 1.625rem;
}

.p-form__wrap + .p-form__wrap.p-form__wrap--textarea {
	margin-block-start: 2.1875rem;
}

.p-form__wrap + .p-form__wrap.p-form__wrap--checkbox,
.p-form__wrap + .p-form__wrap.p-form__wrap--large {
	margin-block-start: 2.625rem;
}

.p-form__wrap--textarea {
	align-items: flex-start;
}

.p-form__wrap.p-form__wrap--textarea .p-form__label,
.p-form__label.p-form__label--margin {
	margin-block-start: 0.625rem;
}

.p-form__label {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-shrink: 0;
	width: 12.5rem;
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 2;
}

.u-required {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	background-color: #ec292c;
	color: var(--white);
	font-size: max(0.75rem, 10px);
	font-weight: var(--fw-medium);
	padding-inline: 0.375rem;
	padding-block: 0.1875rem 0.25rem;
	margin-top: 0.125rem;
	line-height: 1;
}

.p-form__input {
	flex: 1;
}

.p-form__fields {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.p-form__field-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-right: 1.75rem;
}

.p-form__field-row--interview {
	justify-content: flex-start;
	gap: 1.875rem;
	margin-right: 0;
}

.p-form__field {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.p-form__field--postal,
.p-form__field--prefecture {
	width: auto;
}

.p-form__field--wide {
	width: auto;
}

/* 面接希望日・時間: CF7 テキスト入力本体を非表示にして UI セレクトで代替 */

.wpcf7-form-control-wrap[data-name=recruit-interview-date] input,
.wpcf7-form-control-wrap[data-name=recruit-interview-time] input {
	display: none;
}

/* wrap 自体は非表示（エラーtipはJSで UI セレクト直下に移動） */

.wpcf7-form-control-wrap[data-name=recruit-interview-date],
.wpcf7-form-control-wrap[data-name=recruit-interview-time] {
	display: none;
}

/* UI セレクト直下に移動したエラーメッセージ */

.p-form__field--date .wpcf7-not-valid-tip {
	flex-basis: 100%;
	display: block;
	margin-top: 0.25rem;
	white-space: normal;
}

.p-form__field--postal .p-input,
.p-form__field--prefecture .p-select {
	width: 8.8125rem;
}

.p-form__field--wide .p-input {
	width: 26.5625rem;
}

.p-form__field--date {
	width: auto;
	flex-wrap: wrap;
}

.p-form__field--date .p-select {
	width: 7.5rem;
}

.p-form__field--birth {
	align-items: center;
}

.p-form__birth-fields {
	display: flex;
	align-items: center;
	gap: 1.125rem;
}

.p-form__birth-field {
	display: inline-flex;
	align-items: center;
	gap: 0.3125rem;
}

.p-form__birth-field .p-select--year {
	width: 8rem;
}

.p-form__birth-field .p-select--month,
.p-form__birth-field .p-select--day {
	width: 4.6875rem;
}

.p-form__sub-label {
	flex-shrink: 0;
	width: 6.25rem;
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 2;
}

.p-form__sub-label.p-form__sub-label--auto {
	width: -moz-fit-content;
	width: fit-content;
}

.p-form__field-row--inline .p-form__sub-label {
	width: auto;
}

.p-form__field--birth .p-form__sub-label {
	width: 6.25rem;
}

.p-form__unit {
	flex-shrink: 0;
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 2;
}

.p-form__textarea {
	flex: 1;
}

.p-form__radio {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 0.4375rem;
}

.p-form__checkbox {
	flex: 1;
}

.p-form__checkbox .wpcf7-list-item {
	margin: 0;
}

.p-form__value {
	flex: 1;
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 2;
}

/* --- テキスト入力 --- */

.p-input {
	display: block;
	width: 100%;
	height: 3.5rem;
	background-color: var(--white);
	border: 1px solid rgba(0, 0, 0, 0.2);
	padding-inline: 1.25rem;
	font-family: var(--base-font);
	font-size: max(0.875rem, 10px);
	font-weight: 500;
	line-height: 2;
}

.p-input::-moz-placeholder {
	color: rgba(0, 0, 0, 0.2);
}

.p-input::placeholder {
	color: rgba(0, 0, 0, 0.2);
}

.p-input--year,
.p-select--year {
	width: 8rem;
}

.p-input--month,
.p-input--day,
.p-select--month,
.p-select--day {
	width: 4.6875rem;
}

.p-select {
	display: block;
	width: 100%;
	height: 3.5rem;
	background-color: var(--white);
	background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2211%22%20height%3D%226%22%20viewBox%3D%220%200%2011%206%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M1%201L5.5%205L10%201%22%20stroke%3D%22%23000000%22%20stroke-width%3D%221.4%22%20stroke-linecap%3D%22square%22/%3E%3C/svg%3E");
	background-position: right 0.625rem center;
	background-repeat: no-repeat;
	background-size: 0.6875rem 0.375rem;
	border: 1px solid rgba(0, 0, 0, 0.2);
	padding-inline: 1rem 2.25rem;
	color: var(--black);
	font-family: var(--base-font);
	font-size: max(0.875rem, 10px);
	font-weight: 500;
	line-height: 2;
	-moz-appearance: none;
	appearance: none;
	-webkit-appearance: none;
}

.p-form__field.p-form__field--prefecture .p-select {
	padding-inline: 0.625rem;
}

.p-select.is-empty {
	color: rgba(0, 0, 0, 0.2);
}

.p-select option {
	color: var(--black);
}

.p-select option:first-child {
	color: rgba(0, 0, 0, 0.2);
}

/* --- テキストエリア --- */

.p-textarea {
	display: block;
	width: 100%;
	min-height: 10.3125rem;
	background-color: var(--white);
	border: 1px solid rgba(0, 0, 0, 0.2);
	padding-block: 1rem;
	padding-inline: 1.25rem;
	font-family: var(--base-font);
	font-size: max(0.875rem, 10px);
	font-weight: 400;
	field-sizing: content;
	resize: none;
}

.p-textarea.p-textarea--large {
	min-height: 12.25rem;
}

.p-textarea::-moz-placeholder {
	color: rgba(0, 0, 0, 0.2);
}

.p-textarea::placeholder {
	color: rgba(0, 0, 0, 0.2);
}

.p-form__char-count {
	font-size: max(0.875rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 2;
	color: rgba(0, 0, 0, 0.2);
	margin-block-start: 0.25rem;
}

/* --- ラジオボタン --- */

.p-form__radio-label {
	display: flex;
	align-items: center;
	gap: 1.0625rem;
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 2;
	cursor: pointer;
}

.p-form__radio .wpcf7-form-control {
	display: grid;
	grid-template-columns: repeat(2, max-content);
	gap: 0.4375rem 1.25rem;
}

.p-form__radio .wpcf7-list-item {
	margin: 0;
}

.p-form__radio .wpcf7-list-item label {
	display: flex;
	align-items: center;
	gap: 1.0625rem;
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 2;
	cursor: pointer;
}

input.p-radio,
.p-form__radio input[type=radio] {
	display: inline-block;
	-moz-appearance: none;
	appearance: none;
	-webkit-appearance: none;
	flex-shrink: 0;
	width: 1.4375rem;
	height: 1.4375rem;
	background-color: var(--white);
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 50%;
	cursor: pointer;
}

input.p-radio:checked,
.p-form__radio input[type=radio]:checked {
	background-image: radial-gradient(circle closest-side, var(--main) 46%, transparent 50%);
}

/* --- チェックボックス --- */

.p-form__checkbox-label,
.wpcf7-acceptance label {
	display: flex;
	align-items: center;
	gap: 1.0625rem;
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	cursor: pointer;
}

input.p-checkbox {
	display: inline-block;
	-moz-appearance: none;
	appearance: none;
	-webkit-appearance: none;
	flex-shrink: 0;
	width: 1.4375rem;
	height: 1.4375rem;
	background-color: var(--white);
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 50%;
	cursor: pointer;
}

input.p-checkbox:checked {
	background-image: radial-gradient(circle closest-side, var(--main) 46%, transparent 50%);
}

/* --- 送信ボタン --- */

.p-form__submit {
	display: flex;
	justify-content: center;
	margin-block-start: 4.6875rem;
}

.wpcf7-spinner {
	display: none;
}

/* ==========================================================================
   p-news-single  お知らせ詳細 (Figma 17:7083 privacy_pc)
   - MV / sidebar なし、 シンプル単記事構成
   - WP 標準 single.php で動的化 (HANDOFF 5 箇所)
   ========================================================================== */

.p-news-single {
	padding-block: 4.625rem 5.8125rem;
}

.p-news-single__body {
	margin-top: 0.8125rem;
}

/* news 詳細の本体インナーは 850px に縮小 (記事可読幅) */

.p-news-single__body .l-inner {
	max-width: 53.125rem;
}

.p-news-single__header {
	margin-bottom: 2.5rem;
}

.p-news-single__date {
	display: block;
	font-family: var(--base-font);
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 2;
	color: rgb(0, 0, 0);
	margin: 0;
}

.p-news-single__title {
	font-family: var(--base-font);
	font-size: max(2.375rem, 10px);
	font-weight: var(--fw-bold);
	line-height: 1.8;
	color: var(--main);
	margin: 0;
	padding-bottom: 0.625rem;
	border-bottom: 3px solid transparent;
	border-image: linear-gradient(90deg, var(--main) 0%, rgba(4, 79, 155, 0.1) 100%) 1;
}

.p-news-single__image {
	margin: 0 auto 2.5rem;
	max-width: 37.5rem;
	text-align: center;
}

.p-news-single__image img {
	width: 100%;
	height: auto;
	display: block;
}

.p-news-single__content {
	font-size: max(1rem, 10px);
	line-height: 1.8;
	color: var(--black);
	margin-bottom: 3rem;
}

.p-news-single__content > * + * {
	margin-top: 1rem;
}

.p-news-single__content > * + :is(figure,
.wp-block-image,
.wp-block-gallery) {
	margin-top: 2.5rem;
}

.p-news-single__content > :is(figure,
.wp-block-image,
.wp-block-gallery) + * {
	margin-top: 2.5rem;
}

.p-news-single__content h2 {
	font-size: max(1.5rem, 10px);
	font-weight: var(--fw-bold);
	color: var(--main);
	margin-top: 3.125rem;
	margin-bottom: 1rem;
}

.p-news-single__content h3 {
	font-size: max(1.25rem, 10px);
	font-weight: var(--fw-bold);
	margin-top: 2rem;
	margin-bottom: 0.75rem;
}

.p-news-single__content p:empty {
	min-height: 1em;
}

.p-news-single__content ul,
.p-news-single__content ol {
	padding-left: 1.5rem;
}

.p-news-single__content blockquote {
	padding: 1rem 1.5rem;
	border-left: 4px solid var(--main);
	background-color: var(--bg-feature);
	margin: 1.5rem 0;
}

.p-news-single__content a {
	color: var(--main);
	text-decoration: none;
	transition: opacity 0.3s ease;
}

.p-news-single__actions {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 1.5rem;
	flex-wrap: wrap;
}

/* news 詳細ページの button 横幅は c-btn デフォルト値を上書き */

.p-news-single__actions .c-btn--back {
	width: 14.375rem;
	min-width: 0;
}

.p-news-single__actions .c-btn--primary {
	width: 14.375rem;
	min-width: 0;
}

/* ==========================================================================
   デザイン外（Gutenberg・テーブル・ボタン等の機能スタイル）
   ========================================================================== */

/* Gutenberg core/columns: 782/781px とテーマ768pxのズレ補正 */

/* 見出し追加 */

.p-news-single__content h4 {
	font-size: max(1.125rem, 10px);
	font-weight: var(--fw-bold);
	line-height: 1.6;
	margin-top: 1.5rem;
	margin-bottom: 0.5rem;
}

.p-news-single__content h5 {
	font-size: max(1rem, 10px);
	font-weight: var(--fw-bold);
	line-height: 1.6;
	margin-top: 1.25rem;
	margin-bottom: 0.5rem;
}

/* 画像 */

.p-news-single__content img {
	width: auto;
}

.p-news-single__content figure.aligncenter,
.p-news-single__content img.aligncenter {
	margin-right: auto;
	margin-left: auto;
}

.p-news-single__content figure.alignright,
.p-news-single__content img.alignright {
	margin-left: auto;
}

/* ボタン */

.p-news-single__content .wp-block-button {
	margin-top: 1.5rem;
}

.p-news-single__content .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 14.375rem;
	min-height: 3.75rem;
	padding-inline: 1.8125rem;
	font-family: var(--base-font);
	font-size: max(1.125rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 1.5;
	color: var(--white);
	background-color: var(--main);
	border: 2px solid var(--main);
	border-radius: 0.625rem;
	text-decoration: none;
	transition: background-color 0.5s cubic-bezier(0.22, 1, 0.36, 1), color 0.5s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

/* テーブル */

.p-news-single__content .wp-block-table {
	border: none;
}

.p-news-single__content .wp-block-table table {
	width: 100%;
	border-spacing: 0;
	border-collapse: collapse;
	border: 1px solid var(--border-gray);
}

.p-news-single__content .wp-block-table th,
.p-news-single__content .wp-block-table td {
	padding: 0.625rem;
	border: 1px solid var(--border-gray);
	text-align: center;
}

.p-news-single__content .wp-block-table thead {
	border-bottom: 2px solid var(--border-gray);
}

.p-news-single__content .wp-block-table tr:has(> th) {
	background-color: var(--bg-feature);
}

/* その他 */

.p-news-single__content em {
	font-style: italic;
}

.p-news-single__content ul,
.p-news-single__content ol {
	list-style: revert;
}

/* ==========================================================================
   p-news  お知らせ一覧ページ
   - 下層MV + パンくず + タブ + カードリスト + ページネーション
   - Figma デザインなし (spec-based)
   ========================================================================== */

.l-news {
	padding-bottom: 5rem;
}

.p-news__body {
	margin-top: 1.1875rem;
	padding-bottom: 3.25rem;
}

/* news / privacy / contact MV gradient + title color は
   _c-page-mv.scss の .c-page-mv--light modifier で共通化 */

/* ==========================================================================
   p-privacy  プライバシーポリシー
   ========================================================================== */

.p-privacy__body {
	padding-block: 0.9375rem 8.75rem;
}

.p-privacy__lead {
	font-size: max(1rem, 10px);
	font-weight: 400;
	line-height: 1.8;
}

.p-privacy__section {
	margin-block-start: 3.125rem;
}

.p-privacy__section + .p-privacy__section {
	margin-block-start: 2.5rem;
}

.p-privacy__section-title {
	position: relative;
	font-size: max(1.25rem, 10px);
	font-weight: var(--fw-bold);
	color: var(--main);
	line-height: 1.6;
	padding-block-end: 0.3125rem;
}

.p-privacy__section-title::after {
	content: "";
	display: block;
	position: absolute;
	inset-block-end: 0;
	inset-inline: 0;
	block-size: 0.1875rem;
	background: linear-gradient(to right, var(--main), rgba(4, 79, 155, 0.1));
}

.p-privacy__section-body {
	font-size: max(1rem, 10px);
	font-weight: 400;
	line-height: 1.8;
	margin-block-start: 1.0625rem;
}

.p-privacy__section-item {
	display: flex;
	gap: 0.625rem;
	padding-left: 0.625rem;
}

.p-privacy__section-item::before {
	content: "";
	display: inline-block;
	width: 0.25rem;
	height: 0.25rem;
	background-color: var(--black);
	border-radius: 50%;
	margin-top: 0.875rem;
	flex-shrink: 0;
}

/* ==========================================================================
   p-products-single  製品カテゴリ詳細ページ (金網一覧 / その他 5 カテゴリ)
   - header 直下に breadcrumb + 大タイトル + 2列 grid (c-product-list 流用)
   - MV / sidebar なしのシンプル構成
   ========================================================================== */

.p-products-single {
	padding-block: 4.625rem 6.625rem;
}

.p-products-single__body {
	margin-top: 2rem;
}

.p-products-single__title {
	position: relative;
	font-family: var(--base-font);
	font-size: max(2.625rem, 10px);
	font-weight: var(--fw-bold);
	color: var(--black);
	line-height: 1.4;
	margin: 0;
	padding-bottom: 1.8125rem;
	width: 100%;
}

.p-products-single__title::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 0.1875rem;
	background: linear-gradient(to right, var(--main) 0%, rgba(4, 79, 155, 0.1) 100%);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.p-products-single__title.is-active::after {
	transform: scaleX(1);
}

.p-products {
	position: relative;
}

/* ===== Body: sticky sidebar の親、 float clearfix ===== */

.p-products__body {
	position: relative;
	padding-block: 4.3125rem 0;
}

.p-products__body::after {
	content: "";
	display: block;
	clear: both;
}

/* ===== Sidebar (float + sticky) ===== */

.p-products__sidebar {
	float: left;
	position: sticky;
	top: calc(var(--header-height) + 1.25rem);
	width: clamp(11.25rem, 22vw, 15rem);
	margin-top: 0.625rem;
	margin-left: calc(max(0px, (100vw - 80rem) / 2) + 1.8125rem); /* sticky 追従の下端ストッパー: nav 下端を最終セクション (.p-products__section) の
     コンテンツ下端に合わせて停止 (値 = その section の下余白分)。 footer 直前の空き余白へのはみ出し防止 */
	margin-bottom: 6.25rem;
	z-index: 5;
}

.p-products__anchor-nav { /* c-anchor-nav 委譲 */
}

/* ===== Sections base ===== */

.p-products__section {
	position: relative;
	padding-block: 5.3125rem 6.25rem;
}

/* 第 1 section は padding-top 0 で sidebar と同 y */

.p-products__section:first-of-type {
	padding-block: 0 6.25rem;
}

/* ===== 灰 bg (2番目・4番目… PHP側で付与) ===== */

.p-products__section--gray {
	background-color: var(--bg-feature);
}

/* ==========================================================================
   p-recruit  採用情報ページ
   ========================================================================== */

.p-recruit {
	position: relative;
}

/* recruit MV の英字タイトルのみ letter-spacing 0 (共通 -0.04em を上書き) */

.p-recruit__mv .c-page-mv__en {
	letter-spacing: 0;
}

/* ===== Body: sticky sidebar の親、 float clearfix (company 同等) ===== */

.p-recruit__body {
	position: relative;
	padding-block: 2.25rem 0;
}

.p-recruit__body::after {
	content: "";
	display: block;
	clear: both;
}

/* ===== Sidebar (float + sticky) ===== */

.p-recruit__sidebar {
	float: left;
	position: sticky;
	top: calc(var(--header-height) + 1.25rem);
	width: clamp(11.25rem, 22vw, 15rem);
	margin-top: 0.625rem;
	margin-left: calc(max(0px, (100vw - 80rem) / 2) + 1.8125rem); /* nav 下端は最終 section (.p-recruit-careers) のコンテンツ下端＝body 下端で自然に停止するため
     stopper (margin-bottom) は不要。 body 下に CTA (body外) が入り footer 密着もなし */
	z-index: 5;
}

/* ===== Sections base ===== */

.p-recruit-about {
	position: relative;
	padding-block: 0 6.5625rem;
}

/* SP only: 円 243×243、 overlap 25px、 visual 順を nth-child + order で swap
   (HTML 順 創業-社会-未経験 → SP 表示 社会-創業-未経験) */

.p-recruit-careers {
	position: relative;
	padding-block: 4.5625rem 0;
}

.p-recruit-interview {
	position: relative;
	padding-block: 5.875rem 5.375rem;
	overflow: hidden;
}

/* ===== Environment / Benefits: 全幅 灰 bg ===== */

.p-recruit-environment {
	position: relative;
	background-color: var(--bg-feature);
	padding-block: 5.625rem 0;
}

/* SP only: environment title / item override (c-* は不変) */

.p-recruit-benefits {
	position: relative;
	background-color: var(--bg-feature);
	padding-block: 4.4375rem 6.625rem;
}

/* ===== Section title 後の body 余白 (各セクション個別に設定) ===== */

.p-recruit-about__body {
	margin-top: 2.5rem;
}

/* ===== About 下: 動画 (クリックで再生/一時停止・音あり・ループ) ===== */

.p-recruit-about__movie {
	position: relative;
	margin-top: 4.8125rem;
	width: 100%;
	height: 28rem;
	overflow: hidden;
	cursor: pointer; /* デザインカンプ: 動画上に黒 opacity 0.5 のオーバーレイ。 再生中はフェードアウトして動画をクリアに見せる。 */
}

.p-recruit-about__movie::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: rgba(0, 0, 0, 0.5);
	pointer-events: none;
	transition: opacity 0.3s ease;
}

.p-recruit-about__movie-video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.p-recruit-about__movie-btn {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2; /* オーバーレイ(::before z-index1)より前面 */
	transform: translate(-50%, -50%);
	width: 5.1875rem;
	height: 5.1875rem;
	padding: 0;
	border: none;
	background: none;
	cursor: pointer;
	transition: opacity 0.3s ease;
}

.p-recruit-about__movie-btn img {
	display: block;
	width: 100%;
	height: 100%;
}

/* 停止中のみ: 動画エリアをホバーすると矢印を opacity 0.7 に。
   再生中(is-playing)はホバーしても矢印を出さない (PC のみ・mmq で順序逆転するため :not で制御) */

/* 再生中は再生ボタンとオーバーレイを隠す (もう一度クリックで一時停止 → 再表示) */

.p-recruit-about__movie.is-playing .p-recruit-about__movie-btn {
	opacity: 0;
	pointer-events: none;
}

.p-recruit-about__movie.is-playing::before {
	opacity: 0;
}

.p-recruit-environment__body {
	margin-top: 2.75rem;
}

.p-recruit-interview__body {
	margin-top: 3rem;
}

.p-recruit-benefits__body {
	margin-top: 2.625rem;
}

/* SP only: 1 列 × 5 項目、 item padding 20 */

.p-recruit-careers__body {
	margin-top: 1.3125rem;
}

/* SP only: careers row 1 列 */

/* 仕事内容 dd 内の 4 部署リスト (青ドット + 部署名 青 bold + 説明 黒) */

.p-recruit-careers__dept-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.8125rem;
}

.p-recruit-careers__dept-item {
	display: flex;
	flex-direction: column;
}

.p-recruit-careers__dept-name {
	position: relative;
	font-weight: var(--fw-bold);
	color: var(--main);
	margin: 0;
	padding-left: 1.25rem;
	line-height: 1;
}

.p-recruit-careers__dept-name::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 0.625rem;
	height: 0.625rem;
	border-radius: 50%;
	background-color: var(--main);
}

.p-recruit-careers__dept-desc {
	margin: 0;
	padding-left: 1.25rem;
	color: var(--black);
}

/* ===== Environment 下: 画像 marquee スライダー ===== */

.p-recruit-about__slider {
	margin-top: 6.25rem;
	overflow: hidden;
}

.p-recruit-about__track {
	display: flex;
	width: -moz-max-content;
	width: max-content;
	animation: p-recruit-marquee 30s linear infinite;
}

.p-recruit-about__slide {
	width: 30.625rem;
	height: 22.625rem;
	flex-shrink: 0; /* iOS Safari 対策: track を 1 枚の巨大レイヤーに焼くと max texture 超過でアニメ中に
     画像が白く飛ぶ。 各 slide を個別レイヤーに昇格してテクスチャを小さく保つ */
	transform: translateZ(0);
	backface-visibility: hidden;
}

.p-recruit-about__slide picture {
	display: block;
	width: 100%;
	height: 100%;
}

.p-recruit-about__slide img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
}

/* ===== Interview Carousel =====
   PC 1280+ と SP で同じ計算式 width: calc(100vw - var(--carousel-left-offset)) を使う。
   var の値だけ viewport で切り替え:
   - PC 1280+: l-inner--sub の margin-left + padding-left
   - SP md:    padding-sp のみ
   - 768-1279: 固定 947 + tablet zoom (特殊例外) */

.p-recruit-interview__carousel {
	position: relative;
	--carousel-left-offset: 25px; /* PC default fallback */
	width: calc(100vw - var(--carousel-left-offset));
	height: 24.8125rem;
	overflow: hidden; /* 1280+ */
}

.p-recruit-interview__carousel { /* 768-1279: tablet zoom 用に固定 947 (例外) */
}

.p-recruit-interview__carousel { /* SP */
}

/* PC narrow viewport (768-1279) のみ: sidebar 右 + 30 gap で詰める。 1280+ は Figma 原値 308 維持 */

/* 1024px 未満 (768-1023): 「ずれ」 の本命は (A) root font が fluid で rem 値が縮む
   (B) zoom が dynamic に縮む の 2 つ。 ここで両方を 1024 時点の値で固定する:
   - margin-left: 1024 で計算した値 255px を literal px で固定 (rem やめる)
   - zoom: JS 側で 0.78 (= 1024 時点の値) に固定 (下の global.js updateZoom 参照) */

/* PC: Figma variable slot 設計 (active 591 / non-active 245 / gap 28)
   ベース c-interview-card の variable 幅 (active swiper-slide-active 591, default 245) を活用。
   carousel 幅は viewport 連動なので、 viewport が広いほど peek 枚数が自動で増える。 */

.p-recruit-interview {
	overflow-x: hidden;
}

/* width transition (c-* base 0.4s) を Swiper wrapper speed (0.6s) と揃える。
   揃えないと width が先に終わり、 残り 200ms で wrapper だけ translate が続いて
   active card 切替時に「最後だけパキッと詰める」 感が出る。 */

.p-recruit-interview .c-interview-card {
	transition: width 0.6s ease, padding-top 0.6s ease, opacity 0.3s ease;
}

.p-recruit-interview .c-interview-card__media {
	transition: width 0.6s ease, height 0.6s ease;
}

/* swiper-wrapper の transform に CSS で明示的に transition を強制 (!important)。
   peek (右の画像) が「秒数なしでパキッと固定される」 のは、
   JS で wrapper.style.transform を直接書き換えてる時、
   Swiper 内部の transitionDuration が 0 or 未設定の状態に重なると
   instant 反映されてしまうため。 ここで !important transition を効かせれば、
   wrapper の transform 変更は常に 0.6s ease で animate される → peek もゆっくり動く。 */

.p-recruit-interview .swiper-wrapper {
	transition: transform 0.6s ease !important;
}

/* 非 active card の media に main-light 40% の flat overlay (image 全体に blue tint)。
   ::before で peek 専用に分け、 opacity transition で active 切替時にふわっと fade in/out。
   active の青グラデ (::after) は base のまま温存。 */

.p-recruit-interview .c-interview-card__media::before {
	content: "";
	position: absolute;
	inset: 0;
	background: color-mix(in srgb, var(--main-light) 40%, transparent);
	opacity: 1;
	pointer-events: none;
	transition: opacity 0.6s ease;
	z-index: 1;
}

.p-recruit-interview .c-interview-card.swiper-slide-active .c-interview-card__media::before {
	opacity: 0;
}

/* tablet (768-1279) は zoom で carousel を縮めて余白を出さない */

/* SP: PC と同じ variable slot + literal width/height + padding-top 下端揃え
   PC base の挙動を SP サイズに移植:
   - active card: 308 幅 / padding-top 0 / media 308×377 (= image 上端から下端まで)
   - peek card: 204 幅 / padding-top 126 / media 204×251 (= image を下端に押し下げ)
   - card 高さ 377 統一 → peek image bottom = active image bottom (= y=377)
   - transition: width 0.6s ease, height 0.6s ease, padding-top 0.6s ease (PC と同じ)
   - transform: scale 廃止 (literal で代替) */

.p-recruit-interview__cards {
	position: relative;
	height: 100%;
}

/* PC: デザイン指定の改行を <br>/<br class="pc-only"> で固定し nowrap で自動折返し禁止
   (改行位置はデザイン通りでずらさない)。
   active body 列幅 (rem 239) に最長行 (カード5「『分からない』を武器にして、」345px@26) が
   収まるよう font を maxrem(17) に縮小。 rem は 1050px 以下で root font に連動して vw 化(calc)
   → 列幅と同率で徐々に小さくなり、 どの幅でも収まる。
   SP の改行は共通 <br>、 PC 追加分のみ <br class="pc-only"> (SP は display:none) */

.p-recruit-interview .c-interview-card__title {
	white-space: nowrap;
	font-size: max(1.625rem, 10px);
}

/* scrollbar 657 max + ボタン (controls は __carousel の sibling で l-inner--sub 内に default 配置) */

.p-recruit-interview__controls {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	margin-top: 2.6875rem;
	width: 100%;
	max-width: 50rem;
}

/* progress bar (自前 scrollbar) — max 657px、 drag 20% 固定 + JS で translateX 移動 */

.p-recruit-interview__scrollbar {
	position: relative;
	flex: 1 1 auto;
	max-width: 41.0625rem;
	height: 3px;
	background-color: rgba(0, 0, 0, 0.2);
	border-radius: 1.25rem;
}

.p-recruit-interview__scrollbar-drag {
	position: absolute;
	top: 0;
	left: 0;
	width: 20%; /* 5 分割 */
	height: 100%;
	background-color: var(--black);
	border-radius: 1.25rem;
	transform: translateX(0);
	transform-origin: left center;
	transition: transform 0.4s ease;
}

/* prev/next buttons (52×31 blue rounded) */

.p-recruit-interview__nav {
	display: flex;
	gap: 0.8125rem;
	flex-shrink: 0;
}

.p-recruit-interview__prev,
.p-recruit-interview__next {
	position: static;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3.25rem;
	height: 1.9375rem;
	margin: 0;
	background-color: var(--main);
	border: none;
	border-radius: 0.4375rem;
	color: var(--white);
	cursor: pointer;
	transition: opacity 0.3s ease;
}

.p-recruit-interview__prev::after,
.p-recruit-interview__next::after {
	content: "";
	width: 0.8125rem;
	height: 0.4375rem;
	background-color: var(--white);
	-webkit-mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	mask: url(../images/common/arrow-right.svg) no-repeat center/contain;
	font-size: 0;
	transition: translate 0.3s ease;
}

/* prev は左向きにフリップ */

.p-recruit-interview__prev::after {
	transform: scaleX(-1);
}

/* hover で矢印 icon が左右にスライド */

.p-recruit-interview__prev.is-disabled,
.p-recruit-interview__next.is-disabled {
	opacity: 0.35;
	cursor: default;
	pointer-events: none;
}

/* ===== Entry CTA (body 外、 全幅) ===== */

.p-recruit__cta {
	position: relative;
	margin-top: 6.25rem;
}

/* SP only: entry CTA inner — Frame 376 = 335×147。
   絶対配置方式 (_c-recruit-entry-cta.scss) に合わせ padding 0 / BOX を Figma 実値に */

/* recruit modal body 内画像は元比率維持
   (c-* base が height: rem(296)/148 + object-fit: cover で crop しているのを解除) */

.p-recruit-modal .c-interview-modal__body img {
	height: auto;
	object-fit: initial;
}

/* recruit modal の青グラデ (Figma 実値 radial):
   stops 0% #1E62B5 / 9% #417AC1 / 46% #FFFFFF / 90% #FFFFFF、 全 alpha 40% (Figma 透明度 40%)
   origin: 100% 0% (modal inner の右上コーナー)
   - background-size 100% × 535 で上部 535 のみに表示
   - background-attachment local で modal 内 scroll に追従 → 下に scroll すると grad も上に流れて消える */

.p-recruit-modal .c-interview-modal__inner {
	background-image: radial-gradient(circle at 100% 0%, rgba(30, 98, 181, 0.4) 0%, rgba(65, 122, 193, 0.4) 9%, rgba(255, 255, 255, 0.4) 46%, rgba(255, 255, 255, 0.4) 90%);
	background-size: 100% 33.4375rem;
	background-repeat: no-repeat; /* __inner はパネルとして固定。 スクロールは __scroll が担当 (× ボタンの absolute 基準を維持) */
	overflow: hidden;
}

/* ===== モーダルのカスタムスクロールバー (native は位置/thumb長さを固定できないため自前) =====
   track(全体・黒20%) = .c-interview-modal__scrollbar / thumb(短いバー・黒) = __scrollbar-thumb。
   ▼ 調整箇所:
   - 太さ      : __scrollbar / __scrollbar-thumb の width
   - 左右位置  : __scrollbar の right (× 中央の真下 ≒ right 44px)
   - 上下範囲  : __scrollbar の top / bottom
   - thumb 高さ : __scrollbar-thumb の height (固定。 JS は上下位置のみ)
   native は非表示にする */

.p-recruit-modal .c-interview-modal__scroll {
	scrollbar-width: none; /* native 非表示 (Firefox) */
}

.p-recruit-modal .c-interview-modal__scroll::-webkit-scrollbar {
	display: none; /* native 非表示 (WebKit) */
}

.c-interview-modal__scrollbar {
	position: absolute;
	top: 4rem;
	bottom: 3.75rem;
	right: 2.75rem; /* × ボタン中央の真下 */
	width: 0.25rem;
	background: rgba(0, 0, 0, 0.2); /* track 黒20% */
	border-radius: 0.125rem;
	z-index: 3;
}

.c-interview-modal__scrollbar-thumb {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 7.125rem; /* 固定値。 JS は上下位置のみ制御 */
	background-color: var(--black); /* thumb 黒 */
	border-radius: 2.5rem; /* pill */
	cursor: grab;
	will-change: transform;
}

/* recruit modal title はイタリック体、 長文も折返し (overflow scroll 防止) */

.p-recruit-modal .c-interview-modal__title {
	font-style: italic;
	white-space: normal;
	word-break: break-word;
	overflow-wrap: anywhere;
}

/* SP only: recruit modal page override (c-interview-modal の SP 専用調整) */

.p-service {
	position: relative;
}

/* ===== MV: service 限定で英字 (Service) の字間・グラデを上書き (PC/SP 共通) =====
   他ページ無影響にするため共通 c-page-mv__en は変えない */

.p-service__mv .c-page-mv__en {
	letter-spacing: 0; /* PC */ /* PC: 左→右 43% white(1.0) → 82% white(0.4) */
	background-image: linear-gradient(90deg, rgb(255, 255, 255) 43%, rgba(255, 255, 255, 0.4) 82%);
}

/* ===== Body: sidebar の親、 float clearfix (company 同等) ===== */

.p-service__body {
	position: relative;
	padding-block: 2.25rem 0;
}

.p-service__body::after {
	content: "";
	display: block;
	clear: both;
}

/* ===== Sidebar (float + sticky で水平配置 + 追従、 company 同等) =====
   Figma 17:2200 Group 179 (29, 495) 240×110 */

.p-service__sidebar {
	float: left;
	position: sticky;
	top: calc(var(--header-height) + 1.25rem);
	width: clamp(11.25rem, 22vw, 15rem);
	margin-top: 0.625rem;
	margin-left: calc(max(0px, (100vw - 80rem) / 2) + 1.8125rem); /* sticky 追従の下端ストッパー: nav 下端を最終セクション (.p-service-flow) の
     コンテンツ下端に合わせて停止 (値 = その section の下余白分)。 footer 直前の空き余白へのはみ出し防止 */
	margin-bottom: 5.6875rem;
	z-index: 5;
}

.p-service__anchor-nav { /* c-anchor-nav 委譲 */
}

.p-service-intro {
	position: relative;
	padding-block: 0;
}

.p-service-intro__content {
	margin-top: 0.6875rem;
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	font-feature-settings: "palt" 1;
}

.p-service-intro__heading {
	font-family: var(--serif-font); /* PC 1280: 36px max → viewport が狭くなるに従って徐々に縮小、 最小 18px。
     白space:nowrap で改行禁止。 タブレット 768px で「もう少し大きく」要望
     → 中間 vw を 2.81 → 3.5 に引き上げ、 768px で約 27px (旧 22px) になる */
	font-size: clamp(1.125rem, 3.5vw, 2.25rem);
	font-weight: var(--fw-bold);
	font-style: italic;
	color: var(--main);
	line-height: 1.4;
	margin: 0;
	margin-left: 2.8125rem;
	width: -moz-max-content;
	width: max-content;
	flex-shrink: 0;
	text-indent: 0.3em;
	white-space: nowrap;
}

.p-service-intro__desc {
	font-size: max(1rem, 10px);
	font-weight: 400;
	color: var(--black);
	line-height: 2;
	margin: 0;
	margin-left: 0.6875rem;
}

.p-service-intro__slider {
	margin-top: 7.25rem; /* track のはみ出しをクリップ。 overflow:hidden は BFC を作り、 float かつ position:sticky のサイドバーと
     干渉して Firefox(PC) でスクロール時に document が肥大/余白が出る不具合の原因になる。
     overflow:clip は BFC を作らないので干渉せず、 同じくクリップできる (古い Safari は hidden にフォールバック)。 */
	overflow: hidden;
	overflow: clip; /* 全幅 bleed は width:100vw + 負 margin で実現 (clear は不要)。 */
	width: 100vw; /* 高さは明示する (= slide 高 362px)。 auto のままだと Firefox(PC) でスクロール時に
     slider の高さが勝手に肥大し、 document が伸びてスクロールがズレる/余白が出る不具合になる。 */
	height: 22.625rem;
	margin-left: calc(50% - 50vw);
	position: relative;
}

.p-service-intro__track {
	display: flex;
	width: -moz-max-content;
	width: max-content; /* slider に絶対配置で上端(0)に密着。 通常フローだと track が約8px 下にずれ、
     固定高 + overflow:clip で画像の下が切れるため (display:flex は Firefox の高さ肥大が再発するので不可)。 */
	position: absolute;
	top: 0;
	left: 0;
	animation: p-service-marquee 30s linear infinite;
}

.p-service-intro__slide {
	width: 30.625rem;
	height: 22.625rem;
	flex-shrink: 0; /* iOS Safari 対策: track を 1 枚の巨大レイヤーに焼くと max texture 超過でアニメ中に
     画像が白く飛ぶ。 各 slide を個別レイヤーに昇格してテクスチャを小さく保つ */
	transform: translateZ(0);
	backface-visibility: hidden;
}

.p-service-intro__slide picture {
	display: block;
	width: 100%;
	height: 100%;
}

.p-service-intro__slide img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	border-radius: 0;
}

.p-service-feature {
	position: relative;
	background-color: var(--bg-feature);
	padding-block: 6.875rem 9.125rem;
}

.p-service-feature__list {
	margin-top: 3.1875rem;
}

.p-service-flow {
	position: relative;
	padding-block: 6.875rem 5.6875rem;
}

.p-service-flow__title { /* sticky 固定。 重なり中ずっと表示し続ける (離脱時は service.js が transform で一緒に上げる)。 */
	position: sticky;
	top: calc(var(--header-height) + 1.25rem);
	z-index: 6;
	isolation: isolate;
}

.p-service-flow__cards {
	position: relative;
	margin-top: 3.625rem;
}

.p-service-flow__cards .c-service-flow__item {
	position: sticky;
	top: 17.1875rem;
	min-height: 26.25rem;
	transition: background 0.4s ease;
}

/* 全カード同じ sticky top (段差は JS の transform で出す)。
   → 同じ top なので全カードが同時に剥がれて一緒に上へ抜ける (4枚目だけ先行しない)。
   z-index は手前ほど大きく。 段差・離脱同期・タイトル同期は service.js (transform のみ・fixed 不使用)。 */

.p-service-flow__cards .c-service-flow__item:nth-child(1) {
	z-index: 1;
}

.p-service-flow__cards .c-service-flow__item:nth-child(2) {
	z-index: 2;
}

.p-service-flow__cards .c-service-flow__item:nth-child(3) {
	z-index: 3;
}

.p-service-flow__cards .c-service-flow__item:nth-child(4) {
	z-index: 4;
}

.p-service-flow__cards .c-service-flow__item + .c-service-flow__item {
	margin-top: 1.25rem;
}

/* Flow step total (/4) */

.c-service-flow__step-total {
	font-size: max(0.875rem, 10px);
	margin-left: 0.125rem;
}

/* ==========================================================================
   p-thanks  お問い合わせ（完了）
   ========================================================================== */

.p-thanks {
	padding-block: var(--header-height) 5rem;
}

.p-thanks__title {
	font-size: max(2.625rem, 10px);
	font-weight: var(--fw-bold);
	color: var(--main);
	line-height: 1.8;
	text-align: center;
}

.p-thanks__message {
	background-color: var(--bg-feature);
	max-width: 62.5rem;
	margin-inline: auto;
	margin-block-start: 1.25rem;
	padding-block: 2.5rem;
	padding-inline: 3.75rem;
}

.p-thanks__text {
	font-size: max(1rem, 10px);
	font-weight: var(--fw-medium);
	line-height: 2;
	text-align: center;
}

.p-thanks__action {
	display: flex;
	justify-content: center;
	margin-block-start: 4.0625rem;
}

.p-thanks__action .c-btn {
	padding-inline: 1.25rem 0.9375rem;
}

/* p-top-about: B案で作成した独立 section は撤回 (2026-05-25 user 指示)
   about は MV 内 (_p-top-mv.scss .p-top-mv__about) で sticky + scroll 連動アニメ表示に戻った
   このファイルは glob 読み込み回避のため空維持 (削除時は不要) */

.p-top-mv {
	position: relative;
	width: 100%; /* PC: 400vh に拡張すると MV→Service で「止まる」感が出るため 300vh */
	height: 300vh;
	min-height: 131.25rem; /* sticky 700 + scroll range 1400 */
	color: var(--white);
	isolation: isolate;
}

.p-top-mv__sticky {
	position: sticky;
	top: 0;
	width: 100%;
	height: 100vh;
	min-height: 43.75rem;
	overflow: hidden;
	transform: translate3d(0, 0, 0); /* GPU 加速で sticky 境界の sub-pixel jitter 防止 */
	will-change: transform;
}

.p-top-mv__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background-color: rgb(0, 0, 0); /* 動画読込中の白フラッシュ防止 (poster は使わない) */
}

.p-top-mv__bg-img,
.p-top-mv__bg-video,
.p-top-mv__bg picture {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* スクロール演出 overlay: Figma 17:4909 実値
   0% rgba(57,150,209,0) / 34.5% rgb(30,98,181) / 100% rgb(4,79,155) / opacity 0.9 */

.p-top-mv__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(57, 150, 209, 0) 0%, rgb(30, 98, 181) 34.5%, rgb(4, 79, 155) 100%);
	opacity: 0;
	transform: translateY(100vh);
	pointer-events: none;
}

/* SP: overlay slide-up + fade-in
   ※ time-based(1.4s) のまま scroll 連動を併記すると、対応ブラウザで「時間ベース再生」＋
      「scroll 連動再生」が二重発火しグラデが2回表示される。
   対策: 末尾に animation-duration: auto を追加 (@supports は mmq が落とすため不可)。
     - Chrome 等 (scroll 対応): auto を有効値として解釈 → range にフィット、time-based 再生が消え二重発火解消
     - iOS Safari 等 (非対応): auto を invalid として無視 → shorthand の 1.4s を維持しフォールバック継続 */

/* percent を viewport(sticky) 相対にするため max-width 解除して 100% */

.p-top-mv__inner {
	position: absolute;
	inset: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
}

.p-top-mv__catch {
	position: absolute;
	top: auto;
	bottom: 10.2%;
	left: 10.78%;
	margin: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.625rem;
}

/* SP: catch は FV 表示 → news 出現まで保持 → news と一緒にフェードアウト */

/* catch: 初期 translateY(98) → 42% で上昇(translateY 0) + margin-bottom(--catch-rise) → 72% 保持 → 100% フェードアウト */

/* news: 初期は下に隠れる → 46% で下からスライドアップ+出現 → 72% まで保持 → 100% で消える
   pointer-events: 表示中(46〜72%)のみ auto、非表示時は none で誤クリック防止 */

.p-top-mv__catch-ja {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1.0625rem;
	margin: 0;
	padding: 0;
	list-style: none;
	font-feature-settings: "palt" 1;
}

.p-top-mv__catch-line {
	display: inline-flex;
	align-items: center;
	background-color: var(--white);
	padding-inline: 0 1.4375rem;
	height: 1.19em;
	font-size: clamp(2.25rem, 4.6vw, 3.68125rem);
	overflow: visible;
	transform: scaleX(0);
	transform-origin: left center;
	animation: catch-line-expand 0.8s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.p-top-mv__catch-line--1 {
	animation-delay: 0.2s;
}

.p-top-mv__catch-line--2 {
	animation-delay: 0.7s;
}

.p-top-mv__catch-text {
	font-family: var(--mincho-font);
	font-size: 1em;
	font-weight: 600;
	line-height: 1.5;
	letter-spacing: 0;
	font-feature-settings: "chws" 1, "halt" 1, "palt" 1;
	font-style: italic;
	display: inline-block; /* skew なし: Figma transform identity (italic font-style だけで斜め感) */
	padding-inline: 1.1875rem;
	margin-inline: -1.1875rem;
	padding-top: 0.25rem;
	margin-top: -0.25rem;
	color: transparent;
	-webkit-text-fill-color: transparent;
	background: linear-gradient(to right, rgb(0, 0, 0) 0%, rgb(30, 98, 181) 34%, rgb(0, 0, 0) 100%);
	background-size: 200% auto;
	background-position: 100% center;
	background-repeat: no-repeat;
	-webkit-background-clip: text;
	background-clip: text;
	clip-path: inset(0 100% 0 0);
	animation: catch-text-reveal 0.6s cubic-bezier(0.22, 1, 0.36, 1) 1.05s forwards, catch-grad-flow 1.5s ease-out 2.2s forwards;
}

/* line ごとの stagger: line-1 / line-2 で reveal 開始タイミングをずらす */

.p-top-mv__catch-line--2 .p-top-mv__catch-text {
	animation-delay: 1.55s, 2.7s;
}

/* Figma 17:4896: 28px Marcellus Regular 80% line-height letter-spacing 5% white */

.p-top-mv__catch-en {
	font-family: var(--en-font);
	font-size: max(1.75rem, 10px);
	font-weight: 400;
	line-height: 0.8;
	letter-spacing: 0.05em;
	color: var(--white);
	margin: 1.25rem 0 0;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	clip-path: inset(0 100% 0 0);
	animation: catch-text-reveal 0.6s cubic-bezier(0.22, 1, 0.36, 1) 2.15s forwards;
}

/* about overlay container: 中央配置 (アニメ対象ではない) */

.p-top-mv__about {
	position: absolute; /* top は toppage.js の y アニメ動的計算 (vh*0.62) と同期 — 変更時は JS も合わせる */
	top: 62%;
	bottom: auto;
	left: 50%;
	width: 38.75rem;
	margin-left: -19.375rem;
	transform: translateY(0);
	text-align: center;
	color: var(--white);
	z-index: 3;
	pointer-events: none;
}

.p-top-mv__about-content { /* opacity fade のみで表示制御 (slide なし → 画面外 peek / 見切れ防止) */
	opacity: 0;
}

/* SP: about-content は PC同様 GSAP scrub で reveal (toppage.js)。 CSS scroll-driven は撤去。
   base の opacity:0 を GSAP が fade-in + y スライドする */

.p-top-mv__about-title {
	font-family: var(--serif-font);
	font-size: max(2.875rem, 10px);
	font-weight: 700;
	font-style: italic;
	line-height: 1.4;
	letter-spacing: 0.1em;
	color: var(--white);
	margin: 0;
	text-indent: 0.4em;
	padding-left: 1.75rem;
}

.p-top-mv__about-lead-group {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
	align-items: center;
	margin-top: 2.5rem;
}

.p-top-mv__about-btn {
	margin-top: 4.375rem;
	align-self: center;
	pointer-events: auto;
	position: relative;
	z-index: 1;
}

.p-top-mv__about-btn.c-btn--secondary {
	transition: background-color 0.5s cubic-bezier(0.22, 1, 0.36, 1), color 0.5s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.5s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

/* Figma 17:4912/4913/4914: 16px Noto Sans JP Regular line-height 250% CENTER white */

.p-top-mv__about-lead {
	font-family: var(--base-font);
	font-size: max(1rem, 10px);
	font-weight: 400;
	line-height: 2.5;
	letter-spacing: 0;
	color: var(--white);
	margin: 0;
}

/* お知らせ ticker: Figma 17:4902 botline.y=627.875 → bottom 72px / right 28px / width 344px */

.p-top-mv__news {
	position: absolute;
	top: auto;
	bottom: 10.3%;
	right: 2.19%;
	width: 26.875%;
	z-index: 2;
}

/* SP: news は FV 非表示 → 少しスクロールで出現 → catch と一緒にフェードアウト */

/* Figma 17:4903: お知らせ label 18px Noto Sans JP white (Top border より上) */

.p-top-mv__news-label {
	font-family: var(--base-font);
	font-size: max(1.125rem, 10px);
	font-weight: 400;
	color: var(--white);
	margin: 0 0 0.6875rem; /* label 下 → Top border 間 (Figma 559-548=11) */
	line-height: 1.2;
}

/* ニュースリンク行: Top border 直下 (Figma vector 156 y=559) */

.p-top-mv__news-link {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	padding-block: 1.125rem;
	padding-right: 0.5rem;
	color: var(--white);
	text-decoration: none;
}

.p-top-mv__news-link {
	border-top: 1px solid rgba(255, 255, 255, 0.4);
	border-bottom: 1px solid rgba(255, 255, 255, 0.4);
}

.p-top-mv__news-date {
	font-family: var(--base-font);
	font-size: max(0.875rem, 10px);
	font-weight: 400;
	color: var(--white);
	line-height: 1.2;
	-webkit-font-smoothing: antialiased;
}

.p-top-mv__news-title {
	font-family: var(--base-font);
	font-size: max(0.875rem, 10px);
	font-weight: 400;
	color: var(--white);
	line-height: 1.2;
	text-align: left;
	margin-left: 1.5rem;
	-webkit-font-smoothing: antialiased;
}

.p-top-mv__news-title {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	min-width: 0; /* grid item shrink 許可 */
}

/* 矢印ボタン (Figma 17:5072): 52×31 cornerRadius 7 stroke 1px white outline / arrow 13×7 white (SVG mask) */

.p-top-mv__news-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3.25rem;
	height: 1.9375rem;
	margin-left: 0.3125rem;
	border: 1px solid var(--white);
	border-radius: 0.4375rem;
	background: transparent;
	flex-shrink: 0; /* テキスト → を非表示にして ::before で矢印を描画 */
	font-size: 0;
	color: transparent;
}

.p-top-mv__news-arrow::before {
	content: "";
	display: block;
	width: 0.8125rem;
	height: 0.4375rem;
	background-color: var(--white); /* 矢印形を mask で再現 (右向き) */
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 7'><path d='M0 3.5h11M9 0l3 3.5L9 7' fill='none' stroke='white' stroke-width='1' stroke-linejoin='miter'/></svg>") no-repeat center/contain;
	mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 7'><path d='M0 3.5h11M9 0l3 3.5L9 7' fill='none' stroke='white' stroke-width='1' stroke-linejoin='miter'/></svg>") no-repeat center/contain;
	transition: translate 0.3s ease;
}

.p-top-products {
	position: relative;
	background: transparent; /* gradient は親 .p-top-bg-shared が担当 */
	color: var(--white);
	overflow: hidden;
}

.p-top-products__bg {
	position: relative;
	width: 100%;
	z-index: 0;
	opacity: 1;
	pointer-events: none;
	overflow: hidden;
	background-color: transparent;
	margin-top: 8rem;
}

.p-top-products__bg img {
	width: 100%;
	height: auto;
	display: block;
	object-fit: cover;
}

.p-top-products__inner {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: calc(80rem + var(--padding-pc) * 2);
	margin-inline: auto;
	padding-inline: var(--padding-pc);
	padding-block: 3.75rem 0;
}

/* "Products" 250px title: Figma 17:4956
   user指示: section 基準で top:0 left:0 配置。font-size は rem() で自動縮小 */

.p-top-products .c-section-title-en--products {
	position: absolute;
	top: -0.1875rem;
	left: -1.75rem;
	display: block;
	margin: 0;
	padding: 0;
	text-align: left;
	z-index: 0;
}

.p-top-products__body {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: space-between;
	gap: 2.5rem;
	margin-top: 4.875rem;
	max-width: 62.5rem;
	margin-inline: auto;
}

.p-top-products__text {
	flex: 0 0 auto;
	width: 38.4%;
	min-width: 16.25rem;
	margin-top: 0.875rem;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1.5rem; /* MMM2 (2026-05-25): user 指摘「769px で c-heading-large 不自然改行」
     width 38.4% (= 295px @769px) で text 窮屈 → mq("md") → mq("lg") で 768-1023 も auto 幅に
     user 指示 (2026-06-02): lg (1023 以下) で gap 0 / margin-top 52 */
}

.p-top-products__text .c-heading-large {
	color: var(--white);
	text-align: left;
	font-style: italic;
}

.p-top-products__lead {
	color: var(--white);
	text-align: left;
	margin: 0;
	width: 100%;
	line-height: 1.8; /* Figma 180% */
}

/* button: Figma y=434、heading top=149 から 285px 下
   text container は relative なのでmargin で配置調整 */

.p-top-products__btn {
	margin-top: 3.125rem; /* Figma 434 - (273 + 87 + 24) = 50px */
}

.p-top-products__list {
	flex: 0 0 31.125rem;
	width: 31.125rem;
	max-width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}

.p-top-recruit {
	position: relative;
	background-color: var(--white); /* Figma 17:4858 SOLID white */
	color: var(--black);
	overflow: hidden;
}

.p-top-recruit__inner {
	position: relative;
	width: 100%;
	max-width: calc(80rem + var(--padding-pc) * 2);
	margin-inline: auto;
	padding-inline: var(--padding-pc);
	padding-block: 3.75rem 0;
	min-height: 43.75rem;
}

/* 大Recruit タイトル: Figma (x=177, y=23) → % 化。 section 基準で配置 (固定 px だと縮小時に position ズレ) */

.p-top-recruit .c-section-title-en--blue {
	position: absolute;
	top: 4%;
	left: 13.83%; /* 177/1280 */
	z-index: 0;
	transform: translateX(-6.25rem);
	opacity: 0;
}

.p-top-recruit__body {
	position: relative;
}

.p-top-recruit__text {
	margin: 6.9375rem auto 0;
	width: 100%;
	max-width: 28.125rem;
	min-width: 17.5rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	z-index: 2;
	position: relative;
}

.p-top-recruit__text .c-heading-large--main {
	color: rgb(4, 79, 155); /* Figma 17:4974 #044F9B */
	text-align: center;
	margin: 0;
	font-style: italic;
	text-indent: 0.5em;
}

.p-top-recruit__lead {
	font-family: var(--base-font);
	font-weight: 400;
	font-size: max(1rem, 10px);
	line-height: 2; /* Figma 200% */
	color: var(--black); /* Figma 17:5018 black */
	text-align: center;
	margin: 0;
	margin-top: 1.3125rem;
}

.p-top-recruit__btn.c-btn--primary {
	margin-top: 3.75rem;
}

.p-top-recruit__images {
	display: contents;
}

.p-top-recruit__img {
	position: absolute;
	overflow: hidden;
	z-index: 1;
	display: block;
}

/* img--1 (左端) */

.p-top-recruit__img--1 {
	top: -6%;
	left: calc(-1 * var(--padding-pc));
	width: 16rem;
	height: 19.625rem;
}

/* img--2 (右上) */

.p-top-recruit__img--2 {
	top: -16.1%;
	left: 80.8%;
	width: 8.375rem;
	height: 10.25rem;
}

/* img--3 (右はみ出し): Figma 83:8612 (pc frame 1280) リサイズ実値
   - 表示 174.541×214 (box アスペクト 0.816 ≒ 画像 350:428 → object-fit:cover でも横切れなし)
   - はみ出し量 = 右パディング(--padding-pc) + Figma フレーム超過 61.385px。
     これでコンテンツ最大幅以下では viewport 端で右が clip され、可視は
     174.541 - 61.385 = 113.156 ≈ 64.94% に固定。画面が広がると全体が現れる。 */

.p-top-recruit__img--3 {
	top: 33%;
	right: calc(-1 * (var(--padding-pc) + 3.8365625rem));
	left: auto;
	width: 10.9088125rem;
	height: 13.375rem;
}

/* img--4 (中央左下) */

.p-top-recruit__img--4 {
	top: 58.9%;
	left: 14.83%;
	width: 10rem;
	height: 12.25rem;
}

/* img--5 (中央右下) */

.p-top-recruit__img--5 {
	top: 48%;
	left: 68.9%;
	width: 12.25rem;
	height: 15rem;
}

.p-top-recruit__img img {
	width: 100%;
	height: 100%;
	object-fit: cover; /* 顔・上半身優先 (cover で中央 crop すると胸付近になりすぎるため top 寄せ) */
	object-position: center top;
}

/* Service+Products 共有背景 gradient wrapper (Figma 17:4864 Rectangle 162) */

.p-top-bg-shared {
	background: linear-gradient(180deg, var(--gray-dark-bg) 0%, var(--black) 100%);
	color: var(--white);
}

.p-top-service {
	position: relative;
	background: transparent; /* gradient は親 .p-top-bg-shared が担当 */
	color: var(--white);
	overflow: hidden;
}

.p-top-service__inner {
	position: relative;
	width: 100%; /* vp1280超でも 1280 で頭打ち (vp1280 時点の見た目を据え置き)。
     +padding すると content が vp1330 まで拡大し続け、 %配置の画像が
     固定テキストへ寄って画像↔text 余白が詰まるため padding を足さず固定 */
	max-width: 80rem;
	margin-inline: auto;
	padding-inline: var(--padding-pc);
	padding-block: 5rem 0;
	min-height: 61.5rem;
}

.p-top-service .c-heading-large {
	color: var(--white);
	text-align: left;
	font-style: italic;
	letter-spacing: 0.1em;
	line-height: 1.4; /* palt: プロポーショナル詰め / halt: 半角化 / chws: 約物半角 */
	font-feature-settings: "palt" 1, "halt" 1, "chws" 1; /* text-spacing-trim: 新仕様 (Chrome 117+/Safari 17+) で「」「。」前後を自動詰め
     Figma の -40% 個別調整に最も近い表示が得られる */
	text-spacing-trim: trim-start trim-end;
}

.p-top-service .c-heading-small {
	color: var(--white);
	text-align: left;
}

/* "Service" 大タイトル: Figma 17:4923 (x=403, w=884)。 section 基準 top:0 右端配置 (Products は左端、Service は右端) */

.p-top-service .c-section-title-en {
	position: absolute;
	top: -0.5rem;
	right: 0;
	margin: 0;
	padding: 0;
	text-align: right;
	z-index: 0;
}

.p-top-service__body {
	position: relative;
}

/* text ブロック: natural flow (margin で配置調整)
   Figma heading (x=640, y=188) → margin: 188 0 0 640。 保守時は margin の値だけ動かせば連動 (行間は flex gap) */

.p-top-service__text {
	margin-top: 6.75rem; /* 上限 rem(640) = Figma heading x=640 (設計位置)。 旧 rem(611) だと設計より左で止まり
     左画像 (img1/img3) と余白が詰まるため設計値まで右へ。
     中間幅 (~1268px) は text が枠ギリギリで左画像に密着するため、
     offset を +105px / 幅を 50vw-rem(110) に絞り 右へ寄せ+細くして左余白を確保
     (上限 rem(640)/rem(500) は >1280px では据え置き)。
     min(): 狭幅 (~860px以下) で 事業内容ボタン(rem(230)) が img2(left:82.7%) に重なるのを防ぐ。
     上限を 82.7%-rem(248) で抑えると btn 右端が img2 を常に rem(18) 空ける。
     base を下回るのは狭幅のみ → 1024px/>1280px は不変 (img2 の 82.7% / btn rem(230) 変更時は要追従) */
	margin-left: clamp(24.6875rem, min(42.2vw + 105px, 82.7% - 15.5rem), 40rem);
	width: min(31.25rem, 50vw - 6.875rem);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1.625rem;
	position: relative; /* 重ね順だけ確保 (位置調整は margin 経由) */
	z-index: 2;
}

.p-top-service__lead {
	margin: 0;
	width: 100%;
}

/* btn: Figma 17:4965 y=492、lead 終端 y=422 → 上 margin 70 */

.p-top-service__btn {
	margin-top: 2.75rem; /* gap:rem(26) と合わせて 70px (= 492-422) */
}

.p-top-service__images {
	display: contents;
}

.p-top-service__img {
	position: absolute;
	overflow: hidden;
	z-index: 0;
	display: block;
}

/* PC img--1: Figma frame height 985 基準の % 配置 */

.p-top-service__img--1 {
	top: -14.2%;
	left: 9.2%;
	width: 26.3125rem;
	height: 33rem;
}

.p-top-service__img--2 {
	top: 18.9375rem;
	left: 82.7%;
	width: 10.9375rem;
	height: 13.4375rem;
}

.p-top-service__img--3 {
	top: 22rem;
	left: 26.2%;
	width: 16.375rem;
	height: 20.0625rem;
}

.p-top-service__img--4 {
	top: 36.75rem;
	left: calc(-1 * var(--padding-pc));
	width: 8.6875rem;
	height: 10.6875rem;
}

.p-top-service__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

a {
	transition: opacity 0.3s ease;
}

.js-fadeup {
	opacity: 0;
	translate: 0 2.5rem;
	transition: opacity 0.8s ease-out, translate 0.8s ease-out;
}

.js-fadeup.is-visible {
	opacity: 1;
	translate: 0 0;
}

/* 英字大タイトルは base js-fadeup の 40px スライドを打ち消し、 opacity フェードのみ */

.c-section-title-en.js-fadeup {
	translate: none;
}

.c-section-title-en.js-fadeup.is-visible {
	opacity: 0.2;
}

.pc-only {
	display: block;
}

.sp-only {
	display: none;
}

.u-nowrap {
	display: inline-block;
	white-space: nowrap;
}

@media (any-hover: hover) {

.c-anchor-nav__link:hover {
	opacity: 0.7;
}

.c-anchor-nav__link:hover::after {
	translate: 0 0.1875rem;
}

.c-btn--primary:hover {
	background-color: var(--white);
	color: var(--main);
}

.c-btn--primary:hover .c-btn__arrow {
	background-color: rgba(4, 79, 155, 0.2); /* hover 時は主色20% */
	color: var(--main);
}

.c-btn--primary:hover .c-btn__arrow::before {
	translate: 0.25rem 0;
}

.c-btn--secondary:hover {
	background-color: var(--main);
	color: var(--white);
	border-color: var(--main);
}

.c-btn--secondary:hover .c-btn__arrow {
	background-color: rgba(255, 255, 255, 0.2); /* hover で white 20% */
	color: var(--white);
}

.c-btn--secondary:hover .c-btn__arrow::before {
	translate: 0.125rem 0;
}

.c-btn--back:hover {
	background-color: var(--main);
	color: var(--white);
}

.c-btn--back:hover .c-btn__arrow {
	background-color: rgba(255, 255, 255, 0.2);
	color: var(--white);
}

.c-btn--back:hover .c-btn__arrow--left::before {
	translate: -0.25rem 0;
}

.c-btn--pdf:hover {
	opacity: 0.8;
}

.c-btn--arrow:hover .c-btn__arrow::before {
	translate: 0.25rem 0;
}

.c-business-card:hover {
	opacity: 0.7;
}

.c-business-card:hover .c-business-card__arrow::before {
	translate: 0.125rem 0;
}

.c-company-access__gmap-link:hover {
	opacity: 0.7;
}

.c-drawer__nav-link:hover {
	opacity: 0.7;
}

.c-drawer__nav-link:hover::after {
	translate: 0.1875rem 0;
}

/* user 指示: 製品一覧 toggle は矢印ではなくハイフン (横線) のため hover で translate しない */

.c-drawer__nav-link--toggle:hover::after {
	translate: 0;
}

.c-drawer__sub-link:hover {
	opacity: 1;
}

.c-footer__logo-link:hover {
	opacity: 0.7;
}

.c-footer__contact:hover {
	opacity: 0.85;
}

.c-footer__contact:hover .c-footer__contact-btn-arrow::before {
	translate: 0.1875rem 0;
}

.c-footer__col-title:hover .c-footer__col-arrow {
	translate: 0.1875rem 0;
}

.c-footer__sub-link:hover {
	opacity: 1;
}

.c-header__nav-link:hover {
	color: var(--main);
	opacity: 1;
}

.c-header__nav-item--dropdown:hover::after {
	visibility: visible;
	pointer-events: auto;
}

.c-header__nav-item--dropdown:hover .c-header__dropdown,
.c-header__nav-item--dropdown.is-hover .c-header__dropdown {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transition: opacity 0.3s ease, visibility 0s 0s;
}

.c-header__nav-item--dropdown:hover .c-header__nav-arrow,
.c-header__nav-item--dropdown.is-hover .c-header__nav-arrow {
	transform: rotate(180deg);
}

.c-header__nav-link.c-header__nav-link--toggle:hover {
	opacity: 0.7;
}

.c-header__dropdown-link:hover {
	color: var(--main);
}

.c-header__dropdown-link:hover::after {
	translate: 0.125rem 0;
	background-color: var(--main);
}

.c-header__btn--recruit:hover {
	background-color: var(--white);
	color: var(--main);
	opacity: 1;
}

.c-header__btn--contact:hover {
	background-color: var(--main);
	color: var(--white);
	opacity: 1;
}

.c-interview-card:hover {
	opacity: 0.7;
}

.c-interview-card.swiper-slide-active:hover .c-interview-card__more-icon {
	background-color: var(--white);
	--plus-color: var(--main);
}

.c-interview-modal__close:hover {
	opacity: 0.85;
}

.c-news-card:hover .c-news-card__arrow::before {
	translate: 0.1875rem 0;
}

.c-pagination__item:hover:not(.is-current):not(.is-disabled):not(.c-pagination__item--prev):not(.c-pagination__item--next) {
	background-color: rgba(205, 220, 235, 0.5);
	opacity: 1;
}

.c-pagenavi .page-numbers:hover:not(.current):not(.dots) {
	background-color: rgba(205, 220, 235, 0.5);
	opacity: 1;
}

a.c-product-list__link:hover {
	opacity: 0.7;
}

.c-product-list__link:hover .c-product-list__arrow::before {
	translate: 0.1875rem 0;
}

.c-recruit-entry-cta__btn:hover {
	opacity: 0.85;
}

.c-recruit-entry-cta__inner:hover {
	opacity: 0.9;
}

.c-recruit-entry-cta__inner:hover .c-recruit-entry-cta__btn-arrow::before {
	translate: 0.1875rem 0;
}

.p-company-history__toggle:hover {
	background-color: var(--white);
	color: var(--main);
}

.p-company-history__toggle:hover .p-company-history__toggle-icon {
	background-color: rgba(4, 79, 155, 0.2);
}

.p-company-history__toggle:hover .p-company-history__toggle-icon::before,
.p-company-history__toggle:hover .p-company-history__toggle-icon::after {
	background-color: var(--main);
}

.p-confirm .c-btn--outline:hover {
	background-color: var(--main);
	color: var(--white);
}

.p-confirm .c-btn--outline:hover .c-btn__arrow {
	background-color: rgba(255, 255, 255, 0.2);
	color: var(--white);
}

.p-news-single__content a:hover {
	opacity: 0.7;
}

.p-news-single__content .wp-block-button__link:hover {
	background-color: var(--white);
	color: var(--main);
	opacity: 1 !important;
}

.p-recruit-about__movie:not(.is-playing):hover .p-recruit-about__movie-btn {
	opacity: 0.7;
}

.p-recruit-interview__prev:hover,
.p-recruit-interview__next:hover {
	opacity: 0.8;
}

.p-recruit-interview__next:hover::after {
	translate: 0.1875rem 0;
}

.p-recruit-interview__prev:hover::after {
	translate: -0.1875rem 0;
}

.p-top-mv__about-btn.c-btn--secondary:hover {
	background-color: var(--white);
	color: var(--main);
	border-color: var(--white); /* GSAP scrub が btn に inline opacity:1 を当てるため !important で hover opacity を強制 */
	opacity: 0.85 !important;
}

.p-top-mv__about-btn.c-btn--secondary:hover .c-btn__arrow {
	background-color: rgba(4, 79, 155, 0.2);
	color: var(--main);
}

.p-top-mv__about-btn.c-btn--secondary:hover .c-btn__arrow::before {
	translate: 0.125rem 0;
}

.p-top-mv__news-link:hover {
	opacity: 0.7;
}

.p-top-mv__news-link:hover .p-top-mv__news-arrow::before {
	translate: 0.1875rem 0;
}

a:not([class*=c-btn]):not([class*=js-modal-close]):not([class*=c-header__btn]):not([class*=c-recruit-entry-cta]):hover {
	opacity: 0.7;
}

}

@media (prefers-reduced-motion: reduce) {

.c-page-mv__en {
	animation: none;
	clip-path: inset(0);
}

.c-product-list__heading::after {
	transition-duration: 0.01ms;
	transform: scaleX(1);
}

.c-section-title-line::after {
	transition-duration: 0.01ms;
	transform: scaleX(1);
}

.c-section-title-line--grad-anim .c-section-title-line__en {
	animation: none;
	background-position: 0% center;
}

.p-products-single__title::after {
	transition-duration: 0.01ms;
	transform: scaleX(1);
}

.p-recruit-about__track {
	animation: none;
}

.p-service-intro__track {
	animation: none;
}

*,
*::before,
*::after {
	animation-duration: 0.01ms !important;
	animation-iteration-count: 1 !important;
	transition-duration: 0.01ms !important;
	scroll-behavior: auto !important;
}

}

@media (min-width: 768px) {

html {
	scroll-padding-top: 8.75rem;
}

}

@media screen and (min-width: 768px) {

.p-news-single__content .wp-block-columns {
	flex-wrap: nowrap !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column:not([style*=flex-basis]) {
	flex-basis: 0 !important;
	flex-grow: 1 !important;
}

}

@media screen and (min-width: 768px) and (max-width: 781px) {

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:1%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 1%"] {
	flex-basis: 1% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:2%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 2%"] {
	flex-basis: 2% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:3%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 3%"] {
	flex-basis: 3% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:4%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 4%"] {
	flex-basis: 4% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:5%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 5%"] {
	flex-basis: 5% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:6%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 6%"] {
	flex-basis: 6% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:7%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 7%"] {
	flex-basis: 7% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:8%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 8%"] {
	flex-basis: 8% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:9%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 9%"] {
	flex-basis: 9% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:10%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 10%"] {
	flex-basis: 10% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:11%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 11%"] {
	flex-basis: 11% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:12%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 12%"] {
	flex-basis: 12% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:13%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 13%"] {
	flex-basis: 13% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:14%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 14%"] {
	flex-basis: 14% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:15%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 15%"] {
	flex-basis: 15% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:16%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 16%"] {
	flex-basis: 16% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:17%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 17%"] {
	flex-basis: 17% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:18%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 18%"] {
	flex-basis: 18% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:19%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 19%"] {
	flex-basis: 19% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:20%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 20%"] {
	flex-basis: 20% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:21%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 21%"] {
	flex-basis: 21% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:22%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 22%"] {
	flex-basis: 22% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:23%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 23%"] {
	flex-basis: 23% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:24%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 24%"] {
	flex-basis: 24% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:25%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 25%"] {
	flex-basis: 25% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:26%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 26%"] {
	flex-basis: 26% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:27%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 27%"] {
	flex-basis: 27% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:28%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 28%"] {
	flex-basis: 28% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:29%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 29%"] {
	flex-basis: 29% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:30%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 30%"] {
	flex-basis: 30% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:31%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 31%"] {
	flex-basis: 31% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:32%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 32%"] {
	flex-basis: 32% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:33%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 33%"] {
	flex-basis: 33% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:34%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 34%"] {
	flex-basis: 34% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:35%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 35%"] {
	flex-basis: 35% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:36%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 36%"] {
	flex-basis: 36% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:37%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 37%"] {
	flex-basis: 37% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:38%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 38%"] {
	flex-basis: 38% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:39%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 39%"] {
	flex-basis: 39% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:40%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 40%"] {
	flex-basis: 40% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:41%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 41%"] {
	flex-basis: 41% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:42%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 42%"] {
	flex-basis: 42% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:43%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 43%"] {
	flex-basis: 43% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:44%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 44%"] {
	flex-basis: 44% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:45%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 45%"] {
	flex-basis: 45% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:46%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 46%"] {
	flex-basis: 46% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:47%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 47%"] {
	flex-basis: 47% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:48%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 48%"] {
	flex-basis: 48% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:49%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 49%"] {
	flex-basis: 49% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:50%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 50%"] {
	flex-basis: 50% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:51%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 51%"] {
	flex-basis: 51% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:52%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 52%"] {
	flex-basis: 52% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:53%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 53%"] {
	flex-basis: 53% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:54%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 54%"] {
	flex-basis: 54% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:55%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 55%"] {
	flex-basis: 55% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:56%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 56%"] {
	flex-basis: 56% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:57%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 57%"] {
	flex-basis: 57% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:58%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 58%"] {
	flex-basis: 58% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:59%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 59%"] {
	flex-basis: 59% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:60%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 60%"] {
	flex-basis: 60% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:61%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 61%"] {
	flex-basis: 61% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:62%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 62%"] {
	flex-basis: 62% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:63%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 63%"] {
	flex-basis: 63% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:64%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 64%"] {
	flex-basis: 64% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:65%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 65%"] {
	flex-basis: 65% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:66%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 66%"] {
	flex-basis: 66% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:67%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 67%"] {
	flex-basis: 67% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:68%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 68%"] {
	flex-basis: 68% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:69%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 69%"] {
	flex-basis: 69% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:70%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 70%"] {
	flex-basis: 70% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:71%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 71%"] {
	flex-basis: 71% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:72%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 72%"] {
	flex-basis: 72% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:73%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 73%"] {
	flex-basis: 73% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:74%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 74%"] {
	flex-basis: 74% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:75%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 75%"] {
	flex-basis: 75% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:76%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 76%"] {
	flex-basis: 76% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:77%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 77%"] {
	flex-basis: 77% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:78%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 78%"] {
	flex-basis: 78% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:79%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 79%"] {
	flex-basis: 79% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:80%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 80%"] {
	flex-basis: 80% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:81%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 81%"] {
	flex-basis: 81% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:82%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 82%"] {
	flex-basis: 82% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:83%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 83%"] {
	flex-basis: 83% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:84%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 84%"] {
	flex-basis: 84% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:85%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 85%"] {
	flex-basis: 85% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:86%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 86%"] {
	flex-basis: 86% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:87%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 87%"] {
	flex-basis: 87% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:88%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 88%"] {
	flex-basis: 88% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:89%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 89%"] {
	flex-basis: 89% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:90%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 90%"] {
	flex-basis: 90% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:91%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 91%"] {
	flex-basis: 91% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:92%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 92%"] {
	flex-basis: 92% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:93%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 93%"] {
	flex-basis: 93% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:94%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 94%"] {
	flex-basis: 94% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:95%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 95%"] {
	flex-basis: 95% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:96%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 96%"] {
	flex-basis: 96% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:97%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 97%"] {
	flex-basis: 97% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:98%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 98%"] {
	flex-basis: 98% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:99%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 99%"] {
	flex-basis: 99% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:100%"],
.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis: 100%"] {
	flex-basis: 100% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="33.33"] {
	flex-basis: 33.33% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="66.66"] {
	flex-basis: 66.66% !important;
	flex-grow: 0 !important;
}

.p-news-single__content .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="66.67"] {
	flex-basis: 66.67% !important;
	flex-grow: 0 !important;
}

}

@media (max-width: 1023px) and (min-width: 768px) {

.p-recruit-interview__inner {
	margin-left: 255px;
}

}

@media (max-width: 1279px) and (min-width: 768px) {

.p-recruit-interview__carousel {
	width: 59.1875rem;
}

.p-recruit-interview__inner {
	margin-left: calc(1.8125rem + clamp(11.25rem, 22vw, 15rem) + 1.875rem);
}

.p-recruit-interview__body {
	zoom: var(--recruit-zoom, 0.7);
}

}

@media (min-width: 1280px) {

.p-recruit-interview__carousel {
	--carousel-left-offset: calc(max(0px, (100vw - 80rem) / 2) + 19.25rem + 25px);
}

}

@media (max-width: 1050px) {

html {
	font-size: calc(16 / var(--inner-value) * 100vw);
}

}

@media screen and (max-width: 1023px) {

.p-top-products__text {
	width: auto;
	min-width: 0;
	gap: 0;
	margin-top: 3.25rem;
}

.p-top-products__list {
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
}

}

@media screen and (max-width: 767px) {

:root {
	--vw: 390 * 100vw;
}

html {
	font-size: 16px;
}

.l-inner {
	max-width: 600px;
	padding-inline: var(--padding-sp);
}

.l-inner--sub { /* SP: 中央寄せ */
	max-width: 600px;
	margin-inline: auto;
	padding-inline: var(--padding-sp);
	width: 100%;
}

.l-section {
	padding-block: 3.75rem;
}

.l-section--small {
	padding-block: 2.5rem;
}

.l-section--large {
	padding-block: 5rem;
}

.c-anchor-nav { /* SP: Figma Frame 220 (335×96, GRID 2col×2row) → カード装飾を廃止して
       中身の 2×2 grid だけを残す */
	position: relative;
	top: auto;
	width: 100%;
	max-width: 20.9375rem;
	margin-inline: auto;
	margin-block: 1.5rem;
	padding: 0;
	background-color: transparent;
	border: 0;
}

.c-anchor-nav__list { /* SP: Figma Frame 220 GRID layoutMode (2 columns × 2 rows)
       column gap 22px (Frame 218 x:179 - Frame 217 w:157 = 22)
       row gap 24px (Frame 219 y:60 - Frame 217 h:36 = 24) */
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	-moz-column-gap: 1.375rem;
	column-gap: 1.375rem;
	row-gap: 1.5rem;
	flex-direction: initial;
}

.c-anchor-nav__item { /* SP: 各 item の下に下線 (Figma Vector 123 = 全 item 共通) */
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

.c-anchor-nav__item:not(:last-child) {
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

.c-anchor-nav__item { /* 同じ row の item が 2 行になっても link を縦に伸ばして
       中の text/arrow を上下中央に表示 (grid cell stretch → link が cell に追従) */
	display: flex;
}

.c-anchor-nav__link {
	padding: 0.5rem 0;
	font-size: max(0.875rem, 10px);
	line-height: 1.75;
	flex: 1;
}

.c-anchor-nav__link::after {
	margin-right: 0;
}

.c-breadcrumb {
	padding-block: 1.7rem;
}

.c-breadcrumb__item + .c-breadcrumb__item::before {
	width: 0.875rem;
}

.p-breadcrumb {
	padding-block: 1.7rem;
}

.p-breadcrumb__wrapper > span[property=itemListElement] + span[property=itemListElement]::before {
	width: 0.8125rem;
}

.c-btn {
	min-width: 11.6875rem;
	height: 3.25rem;
	font-size: max(1rem, 10px);
	padding-left: 1.5rem;
}

.c-btn--pdf {
	min-width: 0;
	width: 3.25rem;
	max-width: 3.25rem;
	height: 1.9375rem;
	padding: 0;
	font-size: max(0.875rem, 10px);
}

.c-business-card { /* user 指示 (2026-06-02): SP gap 14 / padding 16 0 */
	gap: 0.875rem;
	padding: 1rem 0;
}

.c-company-access-list {
	grid-template-columns: 1fr;
	margin-top: 1.75rem;
}

.c-company-access__item {
	padding: 1.4375rem 0 1.625rem;
}

.c-company-access__item:not(:first-of-type) {
	padding: 1.0625rem 0 1.6875rem;
}

.c-company-access__name { /* user 指示 (2026-06-11): SP は 16px */
	font-size: max(1rem, 10px);
}

.c-company-access__address { /* user 指示 (2026-06-02): SP margin 10 0 0 */
	margin: 0.625rem 0 0;
}

.c-company-access__gmap {
	margin: 0.625rem 0 0;
}

.c-company-history__item { /* SP: 左 = 装飾 column (24px) + 右 = term (上) + desc (下) の縦並び
       user 指示 (2026-06-02): column-gap 4 */
	display: grid;
	grid-template-columns: 1.5rem 1fr;
	-moz-column-gap: 0.25rem;
	column-gap: 0.25rem;
	align-items: start;
	position: relative;
	padding-block: 0.75rem;
}

.c-company-history__item > * + * {
	margin-left: 0;
}

.c-company-history__item { /* 縦線 */
}

.c-company-history__item::before {
	content: "";
	position: absolute; /* user 指示 (2026-06-02): SP left 3.5 */
	left: 0.21875rem;
	top: 0;
	bottom: 0;
	width: 1px;
	background-color: var(--main);
}

.c-company-history__item { /* ドット (term の中央) */
}

.c-company-history__item::after {
	content: "";
	position: absolute; /* user 指示 (2026-06-02): SP left 0 / w 8 / h 8 */
	left: 0;
	top: 1.4375rem;
	width: 0.5rem;
	height: 0.5rem;
	background-color: var(--main);
	border-radius: 50%;
	transform: translateY(-50%);
}

.c-company-history__item { /* first item: 縦線下半分のみ (dot 起点から下) */
}

.c-company-history__item:first-child::before {
	top: 1.4375rem;
}

.c-company-history__item { /* last item: 縦線上半分のみ (dot 終点までで止める) */
}

.c-company-history__item:last-child::before {
	bottom: auto;
	top: 0;
	height: 1.4375rem;
}

.c-company-history__term { /* SP: grid column 2 / row 1 (= 右 上に term) */
	flex: none;
	grid-column: 2;
	grid-row: 1;
	padding-left: 0;
	font-size: max(1rem, 10px); /* user 指示 (2026-06-02): SP letter-spacing 0 */
	letter-spacing: 0;
}

.c-company-history__desc { /* user 指示 (2026-06-02): SP grid 2/2 / padding-left 0 / padding-block 8 0 */
	grid-column: 2;
	grid-row: 2;
	padding-left: 0;
	padding-block: 0.5rem 0;
}

.c-company-history__desc::before {
	display: none;
}

.c-company-history__desc::after {
	display: none;
}

.c-company-history__text {
	font-size: max(0.875rem, 10px);
}

.c-company-info__row { /* user 指示 (2026-06-02): SP grid 1fr / gap 6 / padding 18.4 0 */
	grid-template-columns: 1fr;
	gap: 0.375rem;
	padding: 1.15rem 0;
}

.c-company-info__label {
	margin-left: 0;
}

.c-company-info__value { /* user 指示 (2026-06-02): SP line-height 1.8 */
	line-height: 1.8;
}

.c-company-info__value--tight { /* user 指示 (2026-06-11): SP も詰める (1.8 → 1.5) */
	line-height: 1.5;
}

.c-drawer {
	display: block;
	position: fixed;
	top: 0;
	left: 0; /* 明示的に width / height を指定 (inset:0 で高さが定まらないブラウザがある問題回避) */
	width: 100%;
	height: 100vh;
	height: 100dvh;
	z-index: var(--z-index-drawer); /* user 指示: ヘッダーも含めて上から下への縦グラデ (0% rgb(56,60,69) → 100% rgb(0,0,0)) */
	background: linear-gradient(180deg, rgb(56, 60, 69) 0%, rgb(0, 0, 0) 100%); /* drawer 自身を scroll container にする */
	overflow-y: auto;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch; /* 非表示は opacity + pointer-events のみで実現 (visibility transition が scroll を阻害する問題回避)
       user 指示 (2026-06-05): ふわっとフェードイン/アウト → 0.5s + cubic-bezier (緩やかな ease-out) */
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.c-drawer__action {
	min-width: 12.5rem;
	height: 3.375rem;
}

.c-footer {
	padding: 3rem 0 3rem;
}

.c-footer__inner {
	padding-inline: var(--padding-sp); /* SP: l-inner 同等に max-width 600 で中央寄せ */
	max-width: 600px;
	margin-inline: auto; /* SP は contact を一番上に並べたいので flex + order で順序制御 */
	display: flex;
	flex-direction: column;
}

.c-footer__logo { /* SP: 狭幅は viewport 追従、最大 309 で頭打ち */
	width: 100%;
	max-width: 19.3125rem;
	margin-top: 0.75rem;
	margin-bottom: 0;
}

.c-footer__main { /* SP は __main を display:contents にして sitemap / contact を __inner 直接子に昇格 (順序制御) */
	display: contents;
}

.c-footer__contact {
	height: 6.875rem; /* SP は 110px (PC 204px と分ける) */
	margin-inline: auto; /* SP: contact をロゴ直下に配置 */
	order: 0;
	min-height: 6.875rem;
	margin-top: 2.5rem;
}

.c-footer__contact-title {
	font-size: max(4.5rem, 10px);
	top: -0.5875rem;
	left: -0.15rem;
}

.c-footer__contact-btn {
	right: 0.5rem;
	bottom: 0.55rem;
}

.c-footer__sitemap {
	grid-template-columns: 1fr 1fr;
	gap: 1.625rem 1.6rem;
	order: 1;
	margin-top: 3.3125rem; /* SP 配置: 会社概要|事業内容 / 製品一覧|採用情報 / プライバシー|お知らせ一覧 */
	grid-template-areas: "company  service" "products recruit" "privacy  news";
}

.c-footer__col-title--sub { /* SP は独立 col に分離されたため上余白不要 */
	margin-top: 0;
}

.c-footer__col-title--news {
	margin-top: 0;
}

.c-footer__sub-list {
	margin-top: 0.625rem;
}

.c-footer__sub-item::before {
	top: 0.75rem;
}

.c-footer__sub-link {
	padding-block: 0.3125rem;
}

.c-footer__small-link--sub {
	margin-top: 1px;
	padding-block: 0.3125rem;
}

.c-footer__copyright {
	order: 2;
	margin-top: 2.25rem;
}

.c-header { /* SP は header 背景色なし (MV 上に重ねる透明 header) */
	background-color: transparent;
}

.c-header__inner::after { /* SP は inner padding 20 と揃える */
	left: 1.25rem;
	right: 1.25rem;
}

.c-header__inner {
	justify-content: space-between;
	height: var(--header-height-sp); /* SP padding-inline 20 (下線も同じ left/right 20) */
	padding-inline: 1.25rem;
}

.c-header__logo { /* SP logo width 220: 320px viewport で overflow しないよう rem (fluid で 320 時 188px に縮む) */
	width: 13.75rem;
	height: var(--header-height-sp);
}

.c-header__logo-link picture {
	display: flex;
	align-items: center;
	width: 100%;
	height: 100%;
}

.c-header__logo-link img { /* SP は padding-top 7px で視覚的微調整 */
	padding-top: 0.4375rem;
}

.c-header__nav {
	display: none;
}

.c-header__dropdown {
	display: none;
}

.c-header__actions {
	display: none;
}

.c-header__hamburger {
	display: block;
	width: 1.7rem;
	height: 1rem;
	top: 0.25rem; /* クリック領域を ::before で外周拡張 (visual は 27x16 のまま透明 click 領域を覆う)。
       注: rem(-20) と書かないと SCSS が単項マイナスを解釈できず compile 不可 */
}

.c-header__hamburger::before {
	content: "";
	position: absolute;
	inset: -1.25rem;
}

.c-header__hamburger-line { /* SP height 1px、 色は白 (header transparent 時) */
	height: 1px;
	background-color: var(--white);
}

.c-header__hamburger-line:nth-child(2) { /* sub-pixel ズレ (top 41.5 = 0.5px) を回避するため top を整数で固定。
       hamburger height 1rem (16px) の中央 8px から line height 1px の半分を引かず、
       直接整数 7px に配置 → top が整数 41 → physical pixel に snap → 白で確実描画 */
	top: 0.4375rem;
	translate: 0;
	background-color: var(--white);
}

.c-heading-large { /* Figma SP TOP 83:9671 (材料から〜) / 83:9694 (一線の精度が〜) / 83:9732 (他にはない技術が〜)
       いずれも 28px Noto Serif JP Bold (line-height 151-160% で誤差程度) */
	font-size: max(1.75rem, 10px);
}

.c-heading-large--mv {
	font-size: max(1.75rem, 10px);
}

.c-heading-small { /* user 指示 (2026-06-02): font-size は HARD RULE で rem() に統一 */
	font-size: max(1rem, 10px);
	line-height: 1.9;
	margin-top: 0;
}

.c-interview-card {
	width: 100%;
	height: auto;
	padding-top: 0;
	transition: none;
}

.c-interview-card__inner {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.25rem;
}

.c-interview-card__media {
	width: 100%;
	max-width: 20.25rem;
	height: auto;
	aspect-ratio: 324/397;
	margin-inline: auto;
	transition: none;
}

.c-interview-card.swiper-slide-active {
	width: 100%;
	padding-top: 0;
}

.c-interview-card.swiper-slide-active .c-interview-card__inner {
	grid-template-columns: 1fr;
	gap: 1.25rem;
}

.c-interview-card.swiper-slide-active .c-interview-card__media {
	width: 100%;
	max-width: 20.25rem;
	height: auto;
	aspect-ratio: 324/397;
}

.c-interview-card__body {
	margin-top: 0;
}

.c-interview-card__title {
	font-size: max(1.25rem, 10px);
}

.c-interview-modal__inner {
	padding: 3rem 1.25rem 1.5rem;
}

.c-interview-modal__header {
	flex-direction: column;
	gap: 1.25rem;
}

.c-interview-modal__image {
	width: 100%;
	max-width: 24.9375rem;
	height: auto;
	aspect-ratio: 399/476;
	margin-inline: auto;
}

.c-interview-modal__profile {
	margin-top: 0;
}

.c-interview-modal__title {
	font-size: max(1.375rem, 10px);
}

.c-interview-modal__name {
	font-size: max(1.25rem, 10px);
}

.c-interview-modal__body h2,
.c-interview-modal__body h3 {
	padding-bottom: 0.375rem;
	margin: 1.75rem 0 0.875rem;
}

.c-interview-modal__body h2 {
	font-size: max(1.25rem, 10px);
}

.c-interview-modal__body h3 {
	font-size: max(1.125rem, 10px);
}

.c-interview-modal__body p {
	font-size: max(0.875rem, 10px);
}

.c-interview-modal__body img {
	height: 9.25rem;
}

.c-news-card-list {
	grid-template-columns: 1fr;
}

.c-news-card-list__item:nth-child(-n+2) {
	border-top: none;
}

.c-news-card-list__item:first-child {
	border-top: 1px solid var(--border-gray);
}

.c-news-card { /* SP: date 上 / title 下 縦並び + 右端に arrow */
	grid-template-columns: 1fr 3.25rem;
	grid-template-rows: auto auto;
	gap: 0.8125rem 0.75rem;
	padding: 1.4375rem 0;
}

.c-news-card__date {
	grid-column: 1;
	grid-row: 1;
}

.c-news-card__title {
	grid-column: 1;
	grid-row: 2;
}

.c-news-card__arrow {
	grid-column: 2;
	grid-row: 1/3;
	align-self: center;
}

.c-page-mv {
	height: 25rem;
	padding-top: var(--header-height-sp); /* user 指示 (2026-06-02): SP は --page-mv-bg-image-sp 指定があればそれを使う、 なければ PC 用 fallback */
	background-image: linear-gradient(270deg, rgba(56, 149, 208, 0.2) 0%, rgba(30, 98, 181, 0.7) 51%, rgb(4, 79, 155) 100%), var(--page-mv-bg-image-sp, var(--page-mv-bg-image, none));
}

.c-page-mv__en { /* SP: 1 行強制 + 320px 表示崩れ回避のため margin/font も rem 化 */
	font-size: max(5rem, 10px);
	white-space: nowrap;
	margin: 10.5625rem 0 0;
}

.c-page-mv__ja {
	font-size: max(1.25rem, 10px);
	margin-top: 0.25rem;
	padding-left: 0.125rem;
}

.c-page-mv--light {
	background-image: linear-gradient(90deg, rgba(30, 98, 181, 0.2) 0%, rgba(255, 255, 255, 0.2) 100%);
	height: 18.75rem;
}

.c-product-list__heading {
	font-size: 1.5rem;
	letter-spacing: 0;
	padding-bottom: 0.9375rem;
}

.c-product-list__items {
	grid-template-columns: 1fr;
	margin-top: 1.375rem;
}

.c-product-list__items--single .c-product-list__title {
	font-size: 1rem;
}

.c-product-list__items--single .c-product-list__link {
	-moz-column-gap: 0.875rem;
	column-gap: 0.875rem;
	grid-template-columns: 3.9625rem 1fr;
	padding: 1.125rem 0;
}

.c-product-list__link {
	grid-template-columns: 3.3625rem 1fr;
	min-height: 6.0625rem;
	padding: 1rem 0;
}

.c-product-list__items--single .c-product-list__item--text-only .c-product-list__link {
	grid-template-columns: 1fr;
}

.c-product-list__image {
	width: 4rem;
	height: 4rem;
}

.c-recruit-about__inner {
	flex-direction: column;
	max-width: 17.5rem;
}

.c-recruit-about__circle + .c-recruit-about__circle {
	margin-left: 0;
	margin-top: -1.25rem;
}

.c-recruit-about__circle {
	width: 17.5rem;
	height: 17.5rem;
	aspect-ratio: initial;
}

.c-recruit-about__circle-title {
	font-size: max(1.375rem, 10px);
}

.c-recruit-about__circle-text {
	font-size: max(0.75rem, 10px);
}

.c-recruit-benefits {
	grid-template-columns: repeat(2, minmax(0, 16rem));
	gap: 0.75rem;
	justify-content: center;
}

.c-recruit-benefits__title {
	font-size: max(1rem, 10px);
}

.c-recruit-entry-cta { /* SP Entry 新デザイン (Frame 376)。 左右余白20 / 上下40 で box 約228px帯 */
	padding: 2.5rem 1.25rem;
}

.c-recruit-entry-cta__inner { /* Frame 376: 335×147 BOX。Contact CTA と同方式「絶対配置 + overflow:hidden + container」で
       Entry がはみ出してもBOX内にクリップし、レイアウトを壊さない。
       高さは固定せず min-height のみ */
	max-width: 20.9375rem;
	min-height: 9.1875rem;
	height: auto;
	padding: 0;
	display: block;
	overflow: hidden;
	container-type: inline-size;
	box-shadow: 0 0 0.58125rem rgba(0, 0, 0, 0.15);
	backdrop-filter: blur(0.3875rem);
	-webkit-backdrop-filter: blur(0.3875rem);
}

.c-recruit-entry-cta__group { /* 絶対配置に切替えるため group 自体はレイアウトから外す
       (title / btn が __inner 基準で絶対配置される) */
	display: contents;
}

.c-recruit-entry-cta__title { /* Frame 376: Entry 左上。font-size はコンテナ(335幅)相対 cqi で BOX 内に収める。
       92px ≈ 335幅の27.46% (= 27.46cqi)、375px 以下は比例縮小。white-space:nowrap で1行 */
	position: absolute;
	top: -1.4375rem;
	left: -0.125rem;
	width: auto;
	max-width: none;
	white-space: nowrap;
	font-size: clamp(3rem, 27.46cqi, 7rem);
	line-height: 1.3;
	margin: 0;
	letter-spacing: 0;
	background-image: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
}

.c-recruit-entry-cta__btn { /* Frame 376: ボタンを BOX 右下に絶対配置 (右9 / 下13 / gap21) */
	position: absolute;
	right: 0.5625rem;
	bottom: 0.8125rem;
	margin: 0;
	gap: 1.3125rem;
	font-size: max(1rem, 10px);
}

.c-recruit-environment__title {
	font-size: max(1.25rem, 10px);
}

.c-section-title-en {
	font-size: 7.8125rem;
}

.c-section-title-en--products { /* user 指示 (2026-06-02): SP Products は 98px (Service/Recruit と独立、 個別値)
       font-size は px 直書きせず maxrem() を使う (root font fluid 連動 + 10px 下限保護) */
	font-size: max(6.125rem, 10px);
}

.c-section-title-en--blue { /* Figma SP 83:9731 Recruit: 124px Marcellus Regular line-height 80% */
	font-size: max(7.75rem, 10px);
}

.c-section-title-line {
	padding-bottom: 1.8125rem;
}

.c-section-title-line__en {
	font-size: max(3rem, 10px);
}

.c-section-title-line__ja {
	font-size: max(1rem, 10px);
}

.c-service-feature > * + * {
	margin-top: 3rem;
}

.c-service-feature__item {
	flex-direction: column;
}

.c-service-feature__item:nth-child(even) {
	flex-direction: column;
	margin-top: 2.875rem;
}

.c-service-feature__image {
	width: 100%;
	aspect-ratio: 335/223;
}

.c-service-feature__body {
	margin-top: 1.375rem;
	width: 100%;
}

.c-service-feature__item:nth-of-type(2) .c-service-feature__body {
	padding-left: 0;
}

.c-service-feature__title {
	font-size: max(1.625rem, 10px);
	margin-top: 0.625rem;
	line-height: 1.45;
}

.c-service-feature__desc {
	font-size: max(1rem, 10px);
	margin-top: 0.8125rem;
	line-height: 1.74;
	letter-spacing: -0.01em;
}

.c-service-flow__header { /* user 指示 (2026-06-03): 極小 SP で「熱処理 (焼鈍)」 + 「Flow.N/4」 が overflow する対策。
       padding 縮小 + step との gap 確保 + 高さ auto (中身で決定) */
	padding: 0 1rem;
	min-height: 3.25rem;
	height: auto;
	gap: 0.5rem;
}

.c-service-flow__heading { /* user 指示 (2026-06-03): SP heading 26
       括弧「( )」 前後の余白詰め + 太く見える問題対策 (smoothing antialiased) */
	font-size: max(1.625rem, 10px);
	font-feature-settings: "palt" 1, "halt" 1, "chws" 1;
	text-spacing-trim: trim-start trim-end;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.c-service-flow__step { /* user 指示 (2026-06-03): SP step 20 / margin-top 12 (letter-spacing は base 維持) */
	font-size: max(1.25rem, 10px);
	margin-top: 0.75rem;
}

.c-service-flow__body { /* user 指示 (2026-06-03): SP padding 27 20 20 (上 27 / 左右 20 / 下 20) */
	flex-direction: column;
	padding: 1.6875rem 1.25rem 1.25rem;
}

.c-service-flow__text {
	width: 100%;
	margin-top: 0;
}

.c-service-flow__title {
	font-size: max(1.25rem, 10px);
	white-space: normal;
}

.c-service-flow__desc { /* user 指示 (2026-06-03): SP desc 14 / margin-top 8 / line-height 1.7 */
	font-size: max(0.875rem, 10px);
	margin-top: 0.5rem;
	line-height: 1.7;
}

.c-service-flow__image { /* user 指示 (2026-06-03): SP height 147 / margin-top 14 */
	width: 100%;
	height: 9.1875rem;
	aspect-ratio: auto;
	margin-top: 0.875rem;
}

.p-404 {
	min-height: calc(100vh - var(--header-height-sp)); /* user 指示 (2026-06-03): SP padding-block 130px 5rem */
	padding-block: 8.125rem 5rem;
}

.p-404__inner {
	gap: 1.25rem;
}

.p-404__title {
	font-size: max(1.375rem, 10px);
}

.p-404__lead {
	font-size: max(0.875rem, 10px);
	line-height: 1.8; /* SP では基本 <br> 非表示。 ただし .p-404__br--sp は SP でも改行を保持
       (user 指示 2026-06-03: 「可能性があります。」で改行) */
}

.p-404__lead br:not(.p-404__br--sp) {
	display: none;
}

.p-404__btn {
	margin-top: 0.5rem;
}

.p-company-greetings__body {
	flex-direction: column;
	padding-left: 0;
	margin-top: 2.5rem;
}

.p-company-greetings__photo {
	width: 100%;
}

.p-company-greetings__photo img { /* SP: 335×223 (greeting-sp.jpg 用) */
	aspect-ratio: 335/223;
}

.p-company-greetings__caption--pc {
	display: none;
}

.p-company-greetings__caption--sp {
	display: flex;
}

.p-company-greetings__name {
	margin: -0.4375rem 0.3125rem 0 0;
}

.p-company-greetings__text {
	width: 100%;
	margin-top: 1.875rem;
}

.p-company-greetings__text > * + * {
	margin-top: 1.25rem;
}

.p-company-greetings__heading {
	font-size: max(1.625rem, 10px);
	line-height: 1.6;
}

.p-company__body {
	padding-block: 0;
}

.p-company__sidebar {
	position: static;
	float: none;
	width: calc(100% - var(--padding-sp) * 2);
	margin-left: var(--padding-sp);
	margin-bottom: 0;
}

.p-company-information {
	padding-block: 3.875rem 5rem;
}

.p-company-access {
	padding-block: 3.75rem 5rem;
}

.p-company-information__list {
	margin-top: 1.5rem;
}

.p-company-history__body {
	margin-top: 1.5rem;
}

.p-company-access__body {
	margin-top: 2.625rem;
}

.p-company-greetings {
	padding-block: 3.1875rem 4.5rem;
}

.p-company-information__badges { /* SP 1 行目 = 本社工場 (302×225) 中央、
       2 行目 = ISO 9001:2015 + SDGs 各 150×216 横並び gap 12、 全体中央寄せ */
	display: grid;
	grid-template-columns: auto auto;
	grid-template-areas: "first first" "second third";
	gap: 1.25rem 0.75rem;
	justify-content: center;
	align-items: start;
	margin-top: 1.5rem;
	padding-bottom: 1.5rem;
}

.p-company-information__badges > .p-company-information__badge:nth-child(1) {
	grid-area: first;
	margin-inline: auto;
}

.p-company-information__badges > .p-company-information__badge:nth-child(2) {
	grid-area: second;
}

.p-company-information__badges > .p-company-information__badge:nth-child(3) {
	grid-area: third;
}

.p-company-information__badge:nth-of-type(1) img {
	width: 18.875rem;
	height: 14.0625rem;
	max-width: 100%;
	max-height: none;
	object-fit: contain;
	margin-inline: auto;
}

.p-company-information__badge:nth-of-type(2) img,
.p-company-information__badge:nth-of-type(3) img {
	width: 9.375rem;
	height: 13.5rem;
	max-height: none;
	object-fit: contain;
	margin-inline: auto;
}

.p-company-information__badge-label {
	font-size: max(0.75rem, 10px);
	margin-top: 0.625rem;
}

.p-company-history {
	padding-block: 3.75rem 5.1875rem;
}

.p-company-history__body {
	margin-top: 2.0625rem;
}

.p-company-history__list-wrap.is-collapsed {
	max-height: 51.875rem;
}

.p-company-history__toggle {
	width: 11.875rem;
	height: 3.25rem;
	margin-top: 1.875rem;
}

.p-company-access__map {
	height: 8.6875rem;
	margin-top: 1rem;
}

.p-company-access__info {
	flex-direction: column;
	margin-top: 1rem;
}

.p-company-access__info > * + * {
	margin-left: 0;
	margin-top: 1.25rem;
}

.p-company-access__transport {
	flex-basis: auto;
	width: auto;
	padding: 0.875rem;
	gap: 0.5rem;
	margin-top: 0.9375rem;
}

.p-company-access__item--alone { /* SP は他の access item と同様に左寄せ (中央にしない) */
	flex-direction: column;
	align-items: flex-start;
	text-align: left;
}

.p-company-access__item--alone > * + * {
	margin-left: 0;
	margin-top: 0.5rem;
}

.p-company-access__item--alone .p-company-access__address {
	margin-top: 0.5rem;
}

.c-company-access-list > .c-company-access__item:nth-last-child(3) {
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

.p-confirm {
	padding-block: var(--header-height) 5rem;
}

.p-confirm__title {
	font-size: max(2rem, 10px);
	margin-block-start: 1.5rem;
}

.p-confirm .p-form {
	margin-block-start: 1.25rem;
}

.p-confirm .p-form__section {
	padding-inline: 1.25rem;
	padding-block: 1.5rem;
}

.p-confirm .p-form__wrap + .p-form__wrap {
	margin-top: 1.5rem;
}

.p-confirm .p-form__wrap + .p-form__wrap[data-position=top] {
	margin-top: 1.5rem;
}

.p-confirm .p-form__wrap {
	gap: 0.25rem;
}

.p-confirm__action {
	flex-direction: column;
	align-items: center;
	margin-block-start: 3rem;
	gap: 0.875rem;
}

.p-contact__body {
	padding-block: 2rem 10.8125rem;
}

.p-contact__lead {
	letter-spacing: -1%;
	text-align: start;
}

.p-form {
	margin-block-start: 2.5rem;
}

.p-form__section {
	padding-block: 1.5rem;
	padding-inline: 1.25rem;
}

.p-form__section + .p-form__section {
	margin-block-start: 1.6875rem;
}

.p-form__wrap {
	flex-direction: column;
	align-items: flex-start;
	gap: 0.5rem;
}

.p-form__wrap + .p-form__wrap {
	margin-block-start: 1.75rem;
}

.p-form__wrap + .p-form__wrap.p-form__wrap--textarea {
	margin-block-start: 1.75rem;
}

.p-form__wrap + .p-form__wrap.p-form__wrap--checkbox,
.p-form__wrap + .p-form__wrap.p-form__wrap--large {
	margin-block-start: 1.75rem;
}

.p-form__wrap.p-form__wrap--textarea .p-form__label,
.p-form__label.p-form__label--margin {
	margin-block-start: 0;
}

.p-form__label {
	width: 100%;
	font-size: max(1.125rem, 10px);
}

.u-required {
	padding-inline: 0.25rem;
}

.p-form__input {
	width: 100%;
}

.p-form__fields {
	width: 100%;
	gap: 0.5rem;
}

.p-form__field-row {
	align-items: flex-start;
	flex-direction: column;
	gap: 0.5rem;
	margin-right: 0;
}

.p-form__field-row--inline {
	flex-direction: row;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.9375rem;
}

.p-form__field--postal,
.p-form__field--prefecture {
	width: 100%;
	flex-direction: column;
	align-items: flex-start;
	gap: 0;
}

.p-form__field--wide {
	width: 100%;
	flex-direction: column;
	align-items: flex-start;
	gap: 0;
}

.wpcf7-form-control-wrap[data-name=recruit-prefecture] {
	width: 100%;
}

.p-form__field--postal .p-input,
.p-form__field--prefecture .p-select {
	width: 100%;
}

.p-form__field--wide .p-input {
	width: 100%;
}

.p-form__field--date {
	width: calc(50% - 0.5rem);
	gap: 0.3125rem;
}

.p-form__field--birth {
	flex-direction: column;
	align-items: flex-start;
	gap: 0;
}

.p-form__birth-fields {
	gap: 0.5rem;
}

.p-form__birth-field {
	gap: 0.25rem;
}

.p-form__birth-field .p-select--year {
	width: 5.625rem;
}

.p-form__birth-field .p-select--month,
.p-form__birth-field .p-select--day {
	width: 4rem;
}

.p-form__sub-label {
	width: auto;
}

.p-form__field--birth .p-form__sub-label {
	width: auto;
}

.p-form__textarea {
	width: 100%;
}

.p-form__radio {
	width: 100%;
}

.p-form__checkbox {
	width: 100%;
}

.p-form__value {
	width: 100%;
	font-size: max(0.875rem, 10px);
}

.p-input {
	height: 2.75rem;
	padding-inline: 0.625rem;
}

.p-input--year,
.p-select--year {
	width: 6.875rem;
}

.p-select {
	height: 2.75rem;
	padding-inline: 0.625rem 1.3125rem;
}

.p-textarea {
	line-height: 2;
	min-height: 8.125rem;
	padding-block: 0.5rem;
	padding-inline: 0.625rem;
}

.p-textarea.p-textarea--large {
	min-height: 8.125rem;
}

.p-form__radio .wpcf7-form-control {
	grid-template-columns: 1fr;
	gap: 0.5rem;
}

.p-form__submit {
	margin-block-start: -2.8125rem;
	transform: translateY(7.3125rem);
}

.p-news-single {
	padding-block: 5.0625rem 5rem;
}

.p-news-single__body {
	margin-top: 0.25rem;
}

.p-news-single__header {
	margin-bottom: 1.75rem;
}

.p-news-single__title {
	font-size: max(1.75rem, 10px);
	padding-bottom: 0.4375rem;
}

.p-news-single__content {
	margin-bottom: 3.5rem;
}

.p-news-single__content > * + :is(figure,
.wp-block-image,
.wp-block-gallery) {
	margin-top: 1.75rem;
}

.p-news-single__content > :is(figure,
.wp-block-image,
.wp-block-gallery) + * {
	margin-top: 1.75rem;
}

.p-news-single__content h2 {
	font-size: max(1.25rem, 10px);
}

.p-news-single__content h3 {
	font-size: max(1.125rem, 10px);
}

.p-news-single__actions {
	gap: 1rem;
}

.p-news-single__actions .c-btn--back {
	width: 12.5625rem;
	min-width: 0;
	padding: 0 1.5rem 0 0.9375rem;
}

.p-news-single__actions .c-btn--primary {
	width: 12.5625rem;
	min-width: 0;
}

.p-news-single__content h4 {
	font-size: max(1rem, 10px);
}

.p-news-single__content .wp-block-button__link {
	min-width: 11.6875rem;
	height: 3.25rem;
	font-size: max(1rem, 10px);
	padding-inline: 1.5rem;
}

.l-news {
	padding-bottom: 5rem;
}

.p-news__body {
	margin-top: 1.75rem;
}

.p-privacy__body {
	padding-block: 2.5rem 5rem;
}

.p-privacy__lead {
	font-size: max(1rem, 10px);
	line-height: 1.7;
	letter-spacing: -1%;
}

.p-privacy__section {
	margin-block-start: 1.5625rem;
}

.p-privacy__section + .p-privacy__section {
	margin-block-start: 1.75rem;
}

.p-privacy__section-title {
	font-size: max(1.125rem, 10px);
	letter-spacing: -2%;
	padding-block-end: 0.625rem;
}

.p-privacy__section-body {
	line-height: 1.7;
}

.p-privacy__section-list {
	margin-top: 0.375rem;
}

.p-privacy__section-item {
	font-size: max(0.875rem, 10px);
	line-height: 2;
	padding-left: 0;
	gap: 0.5rem;
}

.p-products-single { /* user 指示 (2026-06-03): SP padding-block 4.75rem 77 */
	padding-block: 4.75rem 4.8125rem;
}

.p-products-single__body { /* user 指示 (2026-06-03): SP margin-top 38 */
	margin-top: 2.375rem;
}

.p-products-single__title { /* user 指示 (2026-06-03): SP font max(1.75rem, rem(10)) / padding-bottom 19 */
	font-size: 1.75rem;
	padding-bottom: 1.1875rem;
}

.p-products__body { /* user 指示 (2026-06-03): SP padding-block 0 0 */
	padding-block: 0 0;
}

.p-products__sidebar {
	float: none;
	position: relative;
	top: auto;
	width: calc(100% - var(--padding-sp) * 2);
	margin-left: var(--padding-sp);
	margin-right: var(--padding-sp);
	margin-bottom: 0;
}

.p-products__anchor-nav { /* user 指示 (2026-06-03): products ページのみ SP margin-block 13 1.5rem */
	margin-block: 0.8125rem 1.5rem;
}

.p-products__section { /* user 指示 (2026-06-03): SP padding-block 3.75rem 80 */
	padding-block: 3.75rem 5rem;
}

.p-products__section:first-of-type { /* user 指示 (2026-06-03): SP padding-block 48 78 */
	padding-block: 3rem 4.875rem;
}

.p-recruit__body {
	padding-block: 0;
	margin-top: -0.5625rem;
}

.p-recruit__sidebar { /* SP: sticky 解除して通常 flow (company と統一) */
	position: static;
	float: none;
	width: calc(100% - var(--padding-sp) * 2);
	margin-top: 0;
	margin-left: var(--padding-sp);
}

.p-recruit-about {
	padding-block: 2.8125rem 6rem;
}

.p-recruit-about .c-recruit-about__circle {
	width: 15.1875rem;
	height: 15.1875rem;
}

.p-recruit-about .c-recruit-about__circle:nth-child(2) {
	order: 1;
	margin-top: 0;
	z-index: 1;
}

.p-recruit-about .c-recruit-about__circle:nth-child(1) {
	order: 2;
	margin-top: -1.5625rem;
	z-index: 2;
}

.p-recruit-about .c-recruit-about__circle:nth-child(3) {
	order: 3;
	margin-top: -1.5625rem;
	z-index: 3;
	padding-top: 3.75rem;
}

.p-recruit-careers {
	padding-block: 4rem 0;
}

.p-recruit-interview {
	padding-block: 3.9375rem 5rem;
}

.p-recruit-environment {
	padding-block: 4rem 0;
}

.p-recruit-environment .c-recruit-environment__title {
	font-size: max(1.5rem, 10px);
	line-height: 2;
}

.p-recruit-environment .c-recruit-environment__item {
	gap: 0.25rem;
	padding-block: 1.8125rem 1.9375rem;
}

.p-recruit-environment .c-recruit-environment__item:first-child {
	padding-top: 0;
	gap: 0.25rem;
}

.p-recruit-benefits {
	padding-block: 4.25rem 5rem;
}

.p-recruit-about__body {
	margin-top: 3.4375rem;
}

.p-recruit-about__movie {
	margin-top: 2.5rem;
	height: 12.8125rem;
}

.p-recruit-about__movie-btn {
	width: 3.5rem;
	height: 3.5rem;
}

.p-recruit-environment__body {
	margin-top: 2.5rem;
}

.p-recruit-interview__body {
	margin-top: 2.75rem;
}

.p-recruit-benefits__body {
	margin-top: 2.4375rem;
	gap: 0.625rem;
}

.p-recruit-benefits .c-recruit-benefits {
	grid-template-columns: 1fr;
	gap: 0.625rem;
}

.p-recruit-benefits .c-recruit-benefits__item {
	min-height: 0;
	padding: 1.25rem;
}

.p-recruit-careers__body {
	margin-top: 1.3125rem;
}

.p-recruit-careers .c-company-info__row {
	grid-template-columns: 1fr;
	gap: 0.375rem;
	padding: 1.25rem 0;
}

.p-recruit-careers__dept-list {
	gap: 0.25rem;
}

.p-recruit-careers__dept-name {
	margin-top: 0.6875rem;
}

.p-recruit-about__slider {
	margin-top: 2.625rem;
}

.p-recruit-about__slide {
	width: 14.3125rem;
	height: 10.5625rem;
}

.p-recruit-interview__carousel {
	--carousel-left-offset: var(--padding-sp);
	height: auto; /* body absolute 用の余白確保 (controls 固定) */
	padding-bottom: 230px;
}

/* 全 slide を wrapper min-height (= 最大想定 577) に stretch して高さ統一 */

.p-recruit-interview__cards.swiper-wrapper {
	align-items: stretch;
}

.p-recruit-interview .c-interview-card {
	width: 12.75rem;
	height: 23.5625rem; /* peek card 高さ (固定) */
	padding-top: 7.875rem;
}

.p-recruit-interview .c-interview-card.swiper-slide-active {
	width: 19.25rem;
	height: 23.5625rem; /* active も 377 で固定 → wrapper 高さ不変 → bar 固定 */
	padding-top: 0;
	position: relative; /* body absolute の基準 */
}

.p-recruit-interview .c-interview-card__media {
	width: 12.75rem;
	height: 15.6875rem;
	max-width: none;
	aspect-ratio: initial;
	transform: none;
	transition: width 0.6s ease, height 0.6s ease;
	flex-shrink: 0; /* flex stretch 時に image が縮まないよう固定 */
}

.p-recruit-interview .c-interview-card.swiper-slide-active .c-interview-card__media {
	width: 19.25rem;
	height: 23.5625rem;
}

.p-recruit-interview .c-interview-card__inner {
	grid-template-columns: 1fr;
	max-width: 19.25rem;
	gap: 0.9375rem;
}

/* SP: 非 active は body display:none、 active は absolute で card 外に出す
     → card 高さ統一 (image だけ) → wrapper height 固定 → controls 固定
     → padding-bottom 230 で body 表示エリア確保 */

.p-recruit-interview .c-interview-card__body {
	display: none;
}

.p-recruit-interview .c-interview-card.swiper-slide-active .c-interview-card__body {
	display: flex;
	position: absolute;
	top: 100%;
	left: 10px;
	width: 19.25rem;
	margin-left: -10px;
	padding-top: 0.9375rem; /* margin だと外側 = クリック領域外。 padding にして body box 内に含める */
	padding-left: 10px; /* 左 10px もクリック領域に含める (text は元位置を維持) */
	cursor: pointer;
	animation: p-recruit-card-body-fade 0.6s ease both;
}

.p-recruit-interview .c-interview-card .c-interview-card__media::after,
.p-recruit-interview .c-interview-card .c-interview-card__more-icon {
	display: block;
	opacity: 0;
	transition: opacity 0.6s ease;
}

.p-recruit-interview .c-interview-card.swiper-slide-active .c-interview-card__media::after,
.p-recruit-interview .c-interview-card.swiper-slide-active .c-interview-card__more-icon {
	opacity: 1;
}

.p-recruit-interview .c-interview-card__category {
	margin-left: 0;
}

.p-recruit-interview .c-interview-card__year {
	margin: 0.3125rem 0 0 0;
	font-size: max(0.875rem, 10px);
}

.p-recruit-interview .c-interview-card__title { /* SP: 共通 <br> の改行を nowrap で固定 (自動折返し禁止)、375px 以下は root font 連動で縮小 */
	white-space: nowrap;
	font-size: max(1.25rem, 10px);
}

.p-recruit-interview__controls {
	width: 100%;
	margin-top: 1rem;
	gap: 0.625rem;
}

.p-recruit-interview__nav {
	gap: 0.5625rem;
}

.p-recruit__cta {
	margin-top: 3.75rem;
}

.p-recruit__cta .c-recruit-entry-cta__inner {
	padding: 0;
	min-height: 9.1875rem;
	max-width: 20.9375rem;
}

.c-interview-modal__scrollbar {
	right: 1.625rem; /* SP: × (right8 / w40 → center 28) の真下 */
	top: 3.25rem;
}

.p-recruit-modal .c-interview-modal__inner {
	max-width: 335px;
	padding: 3rem 1.25rem 1.5rem;
}

.p-recruit-modal .c-interview-modal__close {
	position: absolute;
	width: 2.5rem;
	height: 1.5rem;
	top: 0.5rem;
	right: 0.5rem;
}

.p-recruit-modal .c-interview-modal__image {
	max-width: 16.4375rem;
	aspect-ratio: 263/306;
	margin-inline: 0 auto;
}

.p-recruit-modal .c-interview-modal__title {
	font-size: max(1.5rem, 10px);
	line-height: 1.6;
}

/* SP は category / year の左 margin を 0 に (デザイン通り左揃え) */

.p-recruit-modal .c-interview-modal__category {
	font-size: max(0.875rem, 10px);
	margin: 0.6875rem 0 0 0;
	padding: 0.1875rem 0.5rem;
}

.p-recruit-modal .c-interview-modal__year {
	margin: 0.25rem 0 0 0;
}

.p-recruit-modal .c-interview-modal__header {
	gap: 0.6875rem;
}

.p-recruit-modal .c-interview-modal__header,
.p-recruit-modal .c-interview-modal__body {
	max-width: 16.4375rem;
	margin-inline: 0 auto;
}

.p-recruit-modal .c-interview-modal__body {
	margin-top: 2rem;
}

.p-service__mv .c-page-mv__en { /* SP: 字間は共通値 -0.04em / グラデ 左→右 50% white(1.0) → 83% white(0.34) */
	letter-spacing: -0.04em;
	background-image: linear-gradient(90deg, rgb(255, 255, 255) 50%, rgba(255, 255, 255, 0.34) 83%);
}

.p-service__body {
	padding-block: 0;
}

.p-service__sidebar { /* SP: float 解除、 通常 block で表示 (PC sticky は維持しない) */
	float: none;
	position: static;
	width: 100%;
	margin: 0 auto;
}

.p-service-intro__content { /* Figma SP: heading 上 / desc 下 の縦並び */
	flex-direction: column;
	margin-top: 4.5rem;
}

.p-service-intro__heading { /* Figma SP 83:9890: 28px Noto Serif JP Bold、 縦並びなので margin-left リセット。
       「織り上げる。」 が改行される問題対策で palt 詰め組 + 軽い負字間 */
	font-size: max(1.75rem, 10px);
	white-space: normal;
	margin-left: 0;
	width: 100%;
	text-indent: 0;
	font-feature-settings: "palt" 1, "halt" 1, "chws" 1;
	letter-spacing: -0.04em;
}

.p-service-intro__desc { /* Figma SP 83:9891: 16px Noto Sans JP Regular */
	font-size: max(1rem, 10px);
	margin-left: 0;
	margin-top: 1.25rem;
	line-height: 1.8;
}

.p-service-intro__slider {
	margin-top: 3.75rem; /* SP は sidebar が float 解除済みで元から全幅 → bleed リセット */
	width: auto;
	height: 10.5625rem; /* SP slide 高に一致 */
	margin-left: 0;
}

.p-service-intro__slide {
	width: 18.75rem;
	height: 10.5625rem;
}

.p-service-feature {
	padding-block: 4rem 6.0625rem;
}

.p-service-feature__list {
	margin-top: 2.5625rem;
}

.p-service-flow {
	padding-block: 2rem 5rem;
}

.p-service-flow__title {
	top: calc(var(--header-height-sp) + 1rem);
}

.p-service-flow__cards {
	margin-top: 1.5rem; /* service.js が最前面カードに掛ける段差 transform: translateY(36px) (= OFFSET 12 × (N-1)3) の
       はみ出し分を相殺し、 セクション下パディングに食い込まないようにする (SP のみ。 SP は root 16px なので rem(36)=36px)。 */
	padding-bottom: 2.25rem;
}

.p-service-flow__cards .c-service-flow__item {
	top: 13.75rem;
	min-height: auto;
}

.p-service-flow__cards .c-service-flow__item + .c-service-flow__item {
	margin-top: 0.625rem;
}

.p-thanks__title {
	font-size: max(2rem, 10px);
	margin-block-start: 1.5rem;
}

.p-thanks__message {
	padding-block: 1.5rem;
	padding-inline: 1.25rem;
	margin-block-start: 1.25rem;
}

.p-thanks__action {
	margin-block-start: 2.5rem;
}

.p-top-mv { /* SP: 「お知らせ表示→テキスト消失→グラデ→about」全体をゆっくり見せるため scroll 量を拡張。
       about は GSAP scrub (section 連動) のため height を伸ばすと reveal 区間が自動で後ろ倒し&長くなる。
       catch/news/overlay は絶対 vh range のため別途延長。 timeline は section 末で完了するため止まり感なし */
	height: 620vh;
}

.p-top-mv__sticky { /* Figma SP MV 高 600 (PC 700) */
	min-height: 37.5rem;
}

.p-top-mv__overlay {
	animation: mvOverlayUp 1.4s ease-in-out forwards;
	animation-timeline: scroll(root); /* news/catch 消失(170vh)後に約20vh 間を空け、 ゆっくり立ち上げる (190→260vh)。
       about 開始(≈260vh)と一致させ「グラデ完了→about」の順序を保つ */
	animation-range: 190vh 260vh;
	animation-duration: auto;
}

.p-top-mv__catch {
	bottom: 8.8rem;
	left: 1.25rem;
	right: 1.25rem;
	gap: 1.0625rem;
	--catch-rise: 9px; /* scroll 後の追加上げ幅 (keyframe で margin-bottom に使用) */
}

.p-top-mv__catch {
	animation: mvCatchHoldFade 0.5s ease-in-out both;
	animation-timeline: scroll(root); /* 初期は news の位置(下)に表示 → 上昇 → 保持 → news と一緒にフェードアウト。
       ゆっくり&スムーズに見せるため range 拡張 + ease-in-out (緩やかな出だし/止まり) */
	animation-range: 5vh 170vh;
}

.p-top-mv__catch-ja {
	gap: 0.625rem;
}

.p-top-mv__catch-line {
	height: auto;
	font-size: 2rem;
	padding-inline: 0;
}

.p-top-mv__catch-text {
	font-size: 1em;
	padding-inline: 0.25rem 0.875rem;
	margin-inline: 0;
	padding-top: 0;
	margin-top: 0;
	line-height: 1.2;
	letter-spacing: 0;
}

.p-top-mv__catch-line--2 .p-top-mv__catch-text {
	padding-inline: 0.25rem 1.375rem;
}

.p-top-mv__catch-en { /* Figma SP 83:9654: 18px Marcellus / 間隔は親 catch の gap で制御 */
	font-size: max(1.125rem, 10px);
	margin-top: 0;
}

.p-top-mv__about { /* SP: PC同様 GSAP scrub で about-content をスライド (toppage.js)。 about は top 62% 起点。
       y-calc (vh - 80 - aboutHeight - vh*0.62) でボタン下端を下端の80px上に着地 */
	top: 62%;
	bottom: auto;
	width: 90%;
	margin-left: 0;
	transform: translateX(-50%);
}

.p-top-mv__about-title {
	font-size: 2.125rem;
	white-space: nowrap;
	text-indent: 0.6em;
	padding-left: 0.625rem;
}

.p-top-mv__about-lead-group { /* SP: タイトル〜リード間の余白 (user 指定 35px) / リード間 gap 20px */
	margin-top: 2.1875rem;
	gap: 1.25rem;
}

.p-top-mv__about-btn { /* SP: lead→btn 余白 (user 指定 48px) */
	margin-top: 3rem;
}

.p-top-mv__about-lead {
	font-size: 1rem;
	line-height: 2.1;
}

.p-top-mv__news {
	bottom: 1.25rem;
	left: 1.25rem;
	right: 1.25rem;
	width: auto; /* SP: FV 非表示 (scroll-driven mvNewsInOut が出現/消去を制御)。
       透明でもクリックできてしまうのを防ぐため非表示時は pointer-events:none */
	opacity: 0;
	pointer-events: none;
}

.p-top-mv__news {
	animation: mvNewsInOut 0.5s ease-in-out forwards;
	animation-timeline: scroll(root); /* catch と同期。 ゆっくり&スムーズに見せるため range 拡張 + ease-in-out */
	animation-range: 5vh 170vh;
}

.p-top-mv__news-label {
	font-size: max(0.875rem, 10px);
	padding-bottom: 0.6875rem;
	margin-bottom: 0;
}

.p-top-mv__news-link {
	padding-block: 0.875rem;
	padding-right: 0;
}

.p-top-mv__news-date {
	font-size: 0.75rem;
}

.p-top-mv__news-title {
	font-size: 0.75rem;
	margin-left: 1.375rem;
}

.p-top-products { /* user 指示 (2026-06-02): SP padding-top 80 / bottom 0 */
	padding-block: 5rem 0;
}

.p-top-products__bg { /* user 指示 (2026-06-02): SP bg margin-top 82 */
	margin-top: 5.125rem; /* user 指示: SP bg height 200, 横幅は section 全幅 */
	height: 12.5rem;
}

.p-top-products__bg img {
	height: 12.5rem;
	object-fit: cover;
}

.p-top-products__inner { /* SP: section padding-top 80 に統合、 inner は padding-block 0
       (btn は natural flow に変更、 padding-bottom は不要) */
	padding: 0 var(--padding-sp);
}

.p-top-products .c-section-title-en--products { /* SP viewport 中央配置: 親 (__inner) の padding-sp 分外側まで張って text-align:center で text を viewport 中央に */
	position: absolute;
	top: 0;
	left: calc(-1 * var(--padding-sp));
	right: calc(-1 * var(--padding-sp));
	width: auto;
	max-width: none;
	margin: 0;
	text-align: center;
	z-index: 0;
}

.p-top-products__body { /* user 指示 (2026-06-02): SP body gap 22 */
	flex-direction: column;
	gap: 1.375rem;
	max-width: none;
	margin-top: 0;
}

.p-top-products__text { /* __text を display: contents にして heading / lead / btn を __body の直接 flex 子に昇格
       (display:contents だと __text 自身に max-width / margin-inline が効かないため
        heading / lead 側で個別に max-width 制御する) */
	display: contents;
}

.p-top-products__text .c-heading-large { /* user 指示 (2026-06-02): SP heading margin-top 52 */
	margin-top: 3.25rem; /* user 指示 (2026-06-04): SP は 335 幅に制限して中央寄せ (service と揃える) */
	width: 100%;
	max-width: 20.9375rem;
	margin-inline: auto;
	text-indent: 0.1em;
}

.p-top-products__lead { /* user 指示 (2026-06-04): SP は 335 幅に制限して中央寄せ (service と揃える) */
	max-width: 20.9375rem;
	margin-inline: auto;
}

.p-top-products__btn { /* user 指示 (2026-06-02): SP btn margin-top 32 (natural flow + flex order) */
	position: static;
	transform: none;
	order: 1;
	margin-top: 2rem;
	align-self: center;
}

.p-top-products__list { /* user 指示 (2026-06-02): SP list margin-top 15 / 中央寄せ */
	margin-top: 0.9375rem;
	margin-inline: auto;
}

.p-top-recruit {
	padding-block: 13.375rem 2.6875rem;
}

.p-top-recruit__inner {
	padding: 0 var(--padding-sp);
}

.p-top-recruit .c-section-title-en--blue { /* SP viewport 中央配置: 親 (__inner) の padding-sp 分外側まで張って text-align:center で text を viewport 中央に。
       PC の transform: translateX(-100rem) は SP では GSAP disable のため戻らない → none で打ち消す */
	position: absolute;
	top: 0;
	left: calc(-1 * var(--padding-sp));
	right: calc(-1 * var(--padding-sp));
	width: auto;
	max-width: none;
	margin: 0;
	text-align: center;
	transform: none;
	opacity: 0.2;
}

.p-top-recruit__body {
	display: flex;
	flex-direction: column;
	gap: 2.5rem;
}

.p-top-recruit__text {
	margin: 4.0625rem 0 0;
	width: auto;
	max-width: none;
	min-width: 0;
}

.p-top-recruit__lead {
	font-size: max(1rem, 10px);
	line-height: 2;
	margin-top: 1.4375rem;
}

.p-top-recruit__btn.c-btn--primary {
	margin-top: 2.875rem;
}

.p-top-recruit__img { /* SP: Figma Frame 83 (83:9709～83:9726) 実値で散在配置 */
	position: absolute;
	width: auto;
	height: auto;
}

.p-top-recruit__img--1 {
	top: -28.3%;
	left: 7.1%;
	right: auto;
	width: 7rem;
	height: 8.5625rem;
}

.p-top-recruit__img--2 {
	top: 101.9%;
	left: -7.5%;
	right: auto;
	width: 5.0625rem;
	height: 6.1875rem;
}

.p-top-recruit__img--3 {
	top: 30.9%;
	left: 90%;
	right: auto;
	width: 4.9375rem;
	height: 6.0625rem;
}

.p-top-recruit__img--4 {
	top: -15.9%;
	left: 70%;
	right: auto;
	width: 4.5rem;
	height: 5.625rem;
}

.p-top-recruit__img--5 {
	top: 108%;
	left: 59.6%;
	right: auto;
	width: 6.75rem;
	height: 8.3125rem;
}

.p-top-service {
	padding-block: 4.5rem 0;
}

.p-top-service__inner {
	padding-inline: var(--padding-sp);
	padding-block: 0; /* SP は min-height 削除 (タイトル下の余計な余白対策。 高さは __images の min-height で確保) */
	min-height: 0;
}

.p-top-service .c-heading-large {
	line-height: 1.46;
}

.p-top-service .c-section-title-en { /* SP viewport 中央配置: 親 (__inner) の padding-sp 分外側まで張って text-align:center で text を viewport 中央に */
	position: absolute;
	top: 0;
	left: calc(-1 * var(--padding-sp));
	right: calc(-1 * var(--padding-sp));
	width: auto;
	max-width: none;
	margin: 0;
	text-align: center;
	z-index: 0;
}

.p-top-service__body {
	display: flex;
	flex-direction: column;
	gap: 0; /* section title 上の余計な余白の真因は body margin-top 65px → 0 にして見出しを section top 直下に */
	margin-top: 0;
}

.p-top-service__text {
	margin-top: 4.125rem;
	margin-inline: auto;
	margin-bottom: 0;
	width: 100%;
	max-width: 20.9375rem;
	min-width: 0;
	gap: 0;
}

.p-top-service__lead {
	margin-top: 1.6875rem;
}

.p-top-service__btn {
	margin-top: 3.1875rem;
	align-self: center;
}

.p-top-service__images { /* SP: container を btn 下端起点の relative wrapper にし、
       aspect-ratio 375:553 を保持。 max-width 500px 中央寄せ */
	display: block;
	position: relative;
	width: 100%;
	max-width: 450px;
	margin-inline: auto;
	aspect-ratio: 375/553;
}

.p-top-service__img--1 { /* SP: Figma 375 × 553 基準で % 化 → container 拡縮に追従 */
	top: 17.1790235081%;
	left: 5.3333333333%;
	right: auto;
	width: 61.6%;
	height: 52.26039783%;
}

.p-top-service__img--2 {
	top: 84.0867992767%;
	left: 10.1333333333%;
	right: auto;
	width: 19.2%;
	height: 15.9132007233%;
}

.p-top-service__img--3 {
	top: 49.3670886076%;
	left: auto;
	right: 5.3333333333%;
	width: 40.8%;
	height: 33.9963833635%;
}

.p-top-service__img--4 {
	top: 9.0415913201%;
	left: auto;
	right: 0;
	width: 19.4666666667%;
	height: 16.0940325497%;
}

.pc-only {
	display: none;
}

.sp-only {
	display: block;
}

}

@media (max-width: 767px) {

a[href^="tel:"] {
	pointer-events: auto;
}

}

@media screen and (max-width: 600px) {

.c-recruit-benefits {
	grid-template-columns: 1fr;
}

}

@media (max-width: 375px) {

html {
	font-size: 4.2666666667vw;
}

}

@media (max-width: 374px) {

.c-anchor-nav__list {
	grid-template-columns: 1fr;
	-moz-column-gap: 0;
	column-gap: 0;
	row-gap: 0.75rem;
}

.c-service-flow__heading {
	font-size: 1.25rem;
}

.c-service-flow__step {
	font-size: 1rem;
}

}

@keyframes c-page-mv-en-reveal {

from {
	clip-path: inset(0 100% 0 0);
}

to {
	clip-path: inset(0 0 0 0);
}

}

@keyframes section-title-grad-flow {

0% {
	background-position: 100% center;
}

50% {
	background-position: 50% center;
}

100% {
	background-position: 0% center;
}

}

@keyframes p-recruit-marquee {

from {
	transform: translateX(0);
}

to {
	transform: translateX(-50%);
}

}

@keyframes p-recruit-card-body-fade {

from {
	opacity: 0;
}

to {
	opacity: 1;
}

}

@keyframes p-service-marquee {

from {
	transform: translateX(0);
}

to {
	transform: translateX(-50%);
}

}

@keyframes mvOverlayUp {

0% {
	opacity: 0;
	transform: translateY(100vh);
}

100% {
	opacity: 0.9;
	transform: translateY(0);
}

}

@keyframes mvCatchHoldFade {

0% {
	opacity: 1;
	transform: translateY(6.125rem);
	margin-bottom: 0;
}

42% {
	opacity: 1;
	transform: translateY(0);
	margin-bottom: var(--catch-rise);
}

72% {
	opacity: 1;
	transform: translateY(0);
	margin-bottom: var(--catch-rise);
}

100% {
	opacity: 0;
	transform: translateY(0);
	margin-bottom: var(--catch-rise);
}

}

@keyframes mvNewsInOut {

0% {
	opacity: 0;
	transform: translateY(3rem);
	pointer-events: none;
}

18% {
	opacity: 0;
	transform: translateY(3rem);
	pointer-events: none;
}

46% {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

72% {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

100% {
	opacity: 0;
	transform: translateY(0);
	pointer-events: none;
}

}

@keyframes catch-line-expand {

0% {
	transform: scaleX(0);
}

100% {
	transform: scaleX(1);
}

}

@keyframes catch-text-reveal {

0% {
	clip-path: inset(0 100% 0 0);
}

100% {
	clip-path: inset(0 0 0 0);
}

}

@keyframes catch-grad-flow {

0% {
	background-position: 100% center;
}

/* 青→黒 (左青、 右黒) */

50% {
	background-position: 50% center;
}

/* 黒→青→黒 (両端黒、 中央青) */

100% {
	background-position: 0% center;
}

/* 黒→青 (左黒、 右青) = Figma 通り */

}