/* TOP/EN ページ用 CSS */
.topsection-hero-block {
	position: relative;
	/* .hero(=.splide) が opacity:0 でフェード中でも
	   この背景色は影響を受けず常に見える（白FOUC緩和・JP/EN共通） */
	background-color: var(--wp--preset--color--corporate);
}

/* ─────────────────────────────────────────
   Splide 初期化前 FOUC 防止（JS非依存の純CSSアニメーションに統一）
   splide.min.css 側の既定FOUC制御（.splide{visibility:hidden} →
   .splide.is-initialized{visibility:visible}）は mount() 完了までJSに
   依存するため、@view-transition 導入後はページ遷移スナップショットが
   「visibility:hidden の空箱」の状態で確定してしまい、後から追いかける
   is-initialized 発火（旧: JS gated の opacity フェード）と二重に
   フェードして見える＝ちらつきの原因になっていた。
   → splide.min.css の visibility 制御をキャンセルし、is-initialized の
   付与タイミングに関係なく document 読み込み直後から一度だけ走る
   @keyframes に置き換える。ビュートランジションのスナップショットにも
   このアニメーションの開始状態(opacity:0)がそのまま使われるため、
   遷移後は続きのフェードとして自然につながる。
───────────────────────────────────────── */
.splide {
	/* splide.min.css の .splide{visibility:hidden} と同じ詳細度(0,1,0)。
	   splide-css → nagata-top-css の順で出力されるためカスケード順だけで上書きできる（!important不要）。 */
	visibility: visible;
	animation: hero-reveal 0.6s ease forwards;
}

@keyframes hero-reveal {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@media (prefers-reduced-motion: reduce) {
	.splide {
		animation: none;
		opacity: 1;
	}
}
.c-button {
	._text {
		position: relative;
		z-index: 2;
		font-size: 1rem;
	}
}
/* ─────────────────────────────────────────
   Splide ラッパー
───────────────────────────────────────── */
.splide {
	position: relative;
	width: 100%;
	max-width: 100vw;
}

/* ─────────────────────────────────────────
   スライド
───────────────────────────────────────── */
.splide__slide {
	position: relative;
	overflow: hidden;

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

	&::after {
		content: '';
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		height: 40%;
		background: linear-gradient(transparent, rgba(0, 0, 0, 0.6));
		pointer-events: none;
	}

	/* ─────────────────────────────────────────
	   キャプション
	───────────────────────────────────────── */
	.slide-caption {
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		color: oklch(100% 0 0 / 0.025);
		transition: color 0.4s linear;
		z-index: 1;

		h2 {
			font-size: clamp(1.875rem, 5vw, 5rem);
			line-height: 1.4;
			margin-block-end: 0.5em;

			@media (600px >=width) {
				margin-block-end: 1em;
			}
		}

		>div {
			width: fit-content;
		}
	}

	&.is-active .slide-caption {
		color: oklch(100% 0 0);
	}

	&.slide--3 {
		.slide-caption {
			padding-inline: 6vw;
			margin-block-end: 6rem;

			img {
				display: block;
				max-width: clamp(9.375rem, 1.5rem + 21vw, 22.5rem);
			}

			h2 {
				margin-block-start: 0.125em;
				font-size: clamp(1.438rem, 0.273rem + 3.11vw, 4rem);
			}
		}
	}

	&.slide--2 {
		.slide-caption {
			color: color-mix(in oklch, var(--wp--preset--color--corporate) 2.5%, transparent);
			display: grid;
			justify-content: end;
			align-items: center;
			height: 100%;
			justify-items: end;

			>div {
				max-width: clamp(18.75em, 8.75rem + 20.83vw, 31.5em);
				margin-inline: auto clamp(2rem, -23.013rem + 33.24vw, 16.875rem);

				h2 {
					margin-block: 0 0.25em;
					font-size:clamp(1.875rem, 0.455rem + 3.79vw, 5rem);
				}

				p {
					font-size: clamp(0.5rem, 0.211rem + 1.23vw, 1rem);

					&.leadCopy {
						font-size: clamp(0.75rem, 0.317rem + 1.85vw, 1.5rem);
						margin-block: 0.5em 1.4em;
						font-weight: 700;
						line-height: 1.6
					}
				}
			}

			@media (600px >=width) {
				padding-block-start: calc(var(--header-container-height) + var(--header-height) * 2);
				align-items: unset;
				margin-inline: auto;
				padding-inline: 1em;
				justify-content: unset;
				justify-items: unset;

				>div {
					width: 13em;
					margin-inline: 2em 0;
				}
			}
		}

		&.is-active .slide-caption {
			color: var(--wp--preset--color--corporate);
		}
	}

	&.slide--1 {
		.slide-caption {
			display: grid;
			height: 100%;
			place-content: center;

			div {
				text-align: center;

				p {
					text-align: center;
					font-size:clamp(0.75em, 0.214rem + 1.43vw, 1.5em);
				}
			}
		}
	}
}

/* ─────────────────────────────────────────
   カスタムプログレスバー
───────────────────────────────────────── */
.splide__track {
	position: relative;
}

.custom-progress {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 10;
	display: flex;
	gap: 10px;
	padding-block-end: clamp(1.25rem, -0.4rem + 4.4vw, 4rem);
	padding-inline: 6vw;
	box-sizing: border-box;
	width: 100%;
	max-width: clamp(14.25rem, 4.432rem + 49.09vw, 41.25rem);
}

.custom-progress__bar {
	flex: 1;
	height: 1px;
	background: #ffffff5c;
	border-radius: 3px;
	overflow: hidden;
	position: relative;
	cursor: pointer;
	transition: height 0.3s ease;
	&::after {
		content: '';
		display: block;
		height: 100%;
		width: var(--bar-width, 0%);
		background: var(--wp--preset--color--base);
	}

	&.is-done::after {
		width: 100%;
		background: #ffffff5c;
	}

	&.is-active {
		height: 1.4px;
	}
}

.hero {
	width: 100%;
	height: 100dvh;
	min-height: 620px;

	.splide__track {
		height: 100% !important;
		/* Splide のインライン height 計算を上書き */
	}

	.splide__list,
	.splide__slide {
		height: 100%;
	}

	picture,
	img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
}

/* ─────────────────────────────────────────
   TOPICS タブ切り替え（CSSのみ / radio + :has()）
───────────────────────────────────────── */
.topics-block {
	background: #fff;
	border-radius: 6px;
	overflow: hidden;
}

/* radio 本体は非表示（display:none でも :checked は効く） */
.topics-tab-radio {
	display: none;
}

/* タブ見出し */
.topics-tab-labels {
	display: grid;
	grid-template-columns: 1fr 1fr;

	label {
		padding: 1.4em 1em;
		text-align: center;
		font-weight: 700;
		letter-spacing: 0.05em;
		cursor: pointer;
		background: #DFE0E5;
		color: #7C848C;
		transition: background 0.2s, color 0.2s;

		&[for="topics-tab-news"] {
			border-top-left-radius: 10px;
		}

		&[for="topics-tab-exhibitions"] {
			border-top-right-radius: 10px;
		}
	}
}

/* 選択中のタブ（カードと同じ白に溶け込ませる） */
.topics-block:has(#topics-tab-news:checked) label[for="topics-tab-news"],
.topics-block:has(#topics-tab-exhibitions:checked) label[for="topics-tab-exhibitions"] {
	color: inherit;
	background: var(--wp--preset--color--white);
}

/* パネル：既定は非表示、選択中のみ表示 */
.topics-block .wp-block-query {
	display: none;
	padding: 1.9em 3em 1.75em;
}

.topics-block:has(#topics-tab-news:checked) .wp-block-query.tab-news {
	background-color: var(--wp--preset--color--white);
}

.topics-block:has(#topics-tab-news:checked) .wp-block-query.tab-news,
.topics-block:has(#topics-tab-exhibitions:checked) .wp-block-query.tab-exhibitions {
	display: block;
	margin-block-start: 0;
	background: var(--wp--preset--color--white);
	border-radius: 0 0 10px 10px;

	li a {
		display: block;
		width: 100%;
		height: 100%;
		color: var(--wp--preset--color--text);
		transition: 0.3s ease;

		&:hover {
			opacity: 0.7;
		}
	}

	ul+p {
		width: fit-content;
		margin-inline: auto 0;
		margin-block-start: 1.5em;
		transition: 0.3s ease;
		line-height: 1.5;
		border-bottom: 1px solid transparent;

		&:hover {
			border-bottom-color: var(--wp--preset--color--text);
		}

		a {
			display: block;
			text-decoration: none;
			color: var(--wp--preset--color--text);

			&::after {
				content: "›";
				padding-inline-start: 0.7em;
			}
		}
	}
}

/* 投稿リスト（日付＋タイトル） */
.topics-block .wp-block-post-template {
	list-style: none;
	padding: 0;
	margin: 0;
}

.topics-block .wp-block-post {
	display: grid;
	grid-template-columns: 7em 1fr;
	gap: 1em 2.5em;
	align-items: baseline;
	padding-block: 1em;
	border-bottom: 1px solid var(--wp--preset--color--cyan-bluish-gray);
	margin: 0;

	.wp-block-post-title {
		font-size: 1rem;
		font-weight: 400;
		margin: 0;
	}
}

@media (max-width: 767px) {
	.topics-block .wp-block-query {
		padding: 1.5em 1.2em 2em;
	}

	.topics-block .wp-block-post {
		grid-template-columns: 1fr;
		gap: 0.3em;
	}
}

/* NEWS block */
.toppage-news-block {
	background-color: var(--wp--preset--color--white);

	:where(p, h2, h3) {
		margin-block: 0;
		font-weight: normal;
		font-size: 1rem;
		line-height: 1;
	}

	>p {
		background-color: var(--wp--preset--color--corporate);
		height: 100%;
		font-size: 14px;
		width: 92px;

		a {
			display: block;
			height: 100%;
			width: 100%;
			align-content: center;
			text-align: center;
			color: var(--wp--preset--color--white);
			text-decoration: none;

			&::after {
				content: '';
				border-bottom: 0.8px solid var(--wp--preset--color--white);
				display: block;
				width: 3em;
				height: 1px;
				margin-block-start: 6px;
				margin-inline: auto;
			}

			&:hover::after {
				animation: line-expand 1s ease-out both;
			}
		}
	}

	ul {
		padding-block: 1em;

		>li {
			display: grid;
			grid-template-columns: auto 1fr;
			align-items: center;
			column-gap: 0.75em;
			width: 100%;
			position: relative;

			a {
				text-decoration: none;
				display: block;
				white-space: nowrap;
				color: var(--wp--preset--color--text);
			}

			h3 {
				min-width: 0;
				overflow: hidden;

				a {
					overflow: hidden;
					text-overflow: ellipsis;
				}
			}

			&::after {
				content: '';
				position: absolute;
				left: 0;
				bottom: 0;
				width: 0%;
				height: 1px;
				background-color: currentColor;
				transition: width 0.3s ease;
			}

			&:hover::after {
				width: 100%;
			}
		}
	}

	/*スマホ*/
	@media(768px >width) {
		padding-block-start: 1em;

		:where(h2, ul) {
			padding-inline: 10px;
		}

		ul {
			padding-block: 0.45em 0.5em;
		}

		.wp-block-paragraph {
			width: 100%;
			padding-block: 1em;
		}
	}

	/*タブレット*/
	@media(768px <=width) {
		display: grid;
		column-gap: 2em;
		align-items: center;
		grid-template-columns: auto 1fr auto;

		>h2 {
			padding-inline: 2em 1em;
		}
	}

	/*デスクトップ*/
	@media(1140px <=width) {
		position: absolute;
		bottom: 0;
		right: 0;
		width: clamp(34.375rem, 17.933rem + 23.08vw, 45.625rem);
	}

}

@keyframes line-expand {
	from {
		width: 0;
	}

	to {
		width: 3em;
	}
}

.grid-container {
	width: 100%;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.35em 0.25em;

	@media(1024px > width) {
		padding: unset;
	}

	@media(1024px <=width) {
		width: clamp(18.75rem, -11.625rem + 63.28vw, 492px);
	}

	h3 {
		font-weight: 500;
		width: 100%;
		/* font-size: clamp(0.75rem, 0.396rem + 0.94vw, 1rem);
				padding-inline-end: 1.25em;
				text-align: right; */
	}
}

.jp-top-page {
	.grid-container {
		width: 100%;
		/* .lb-block {
			figure + div {

				h3,
				p {
					width: fit-content;
					padding-inline-end: 1rem;
					text-align: right;
				}
			}
		} */

	}
}

.en-top-page {
	.grid-container {
		a{pointer-events: none;}
		h3 {
			/* font-weight: 500;
				width: 100%; */
			font-size: clamp(0.75rem, 0.396rem + 0.94vw, 1rem);
			padding-inline-end: 1.25em;
			text-align: right;
		}

		p {
			display: none
		}

	}
}

/*ENGLISH content */
.en-top-page {
	--inner-height-block: clamp(2.813rem, 0.804rem + 5.36vw, 90px);

	p {
		overflow-wrap: normal;
		margin-block-end: 0.5em;
		line-height: 1.5;
		font-feature-settings: "kern" 1, "tnum" 1;
		hyphens: auto;

		@media(768px >=width) {
			overflow-wrap: anywhere;
			word-break: normal;
		}
	}

	h2 {
		margin-block: 0 1em;
		line-height: 1.2;
	}

	h3 {
		margin-block: 0.25em 0.75em;
		line-height: 1.2;
	}

	/* 疑似要素(::before/::after)を使わず、本体テキストに直接シャイン用グラデーションを重ねてアニメーションさせる。
	   .text-highlight[data-en]::before と同じ2層背景（シャイン用+ベース）構成にすることで、
	   global.css の @keyframes text-shine-sweep-before をそのまま流用できる。 */
	.text-highlight.num {
		width: fit-content;
		font-family: "Orbitron", sans-serif;
		font-weight: 500;
		background:
			linear-gradient(115deg, transparent 40%, rgba(255, 255, 255, 0.85) 50%, transparent 60%),
			var(--gradient-1);
		background-size: 200% 100%, 100% 100%;
		background-position: 150% 0%, 0% 0%;
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
		line-height: 1.4;

		&::before {
			line-height: 1;
			width: fit-content;
			font-weight: 500;
			background:
				linear-gradient(115deg, transparent 40%, rgba(255, 255, 255, 0.85) 50%, transparent 60%),
				var(--gradient-1);
			background-size: 200% 100%, 100% 100%;
			background-position: 150% 0%, 0% 0%;
			-webkit-background-clip: text;
			background-clip: text;
			-webkit-text-fill-color: transparent;
		}
	}

	.text-highlight.num.animate-on.event-view {
		animation: text-shine-sweep-before 0.6s ease-out forwards 0.2s;
	}

	/* スライド */
	.splide__slide {
		&.slide--1 {
			.slide-caption {
			align-content: end;
			margin-block-end: 11.5em;
			h2{
			margin-block-end:0.5em;
			}
				p {
					max-width: 700px;
					text-align: center;
					margin-inline: auto;
					font-size: clamp(12px, 0.214rem + 1.43vw, 24px);
					font-weight:600;
				}
			}
		}

		&.slide--2 {
			.slide-caption {
				>div {
					max-width: 620px;
					/* margin-inline: auto clamp(1rem, -23.155rem + 37.74vw, 273px); */
					margin-inline: auto clamp(1rem, -23.155rem + 37.74vw, 10.813rem);

					p {
						max-width: 29.625rem;
						font-size: clamp(0.563rem, 0.063rem + 1.04vw, 16px);
						text-align: left;
						line-height: 1.8;
					}

					p.leadCopy {
						font-size: clamp(12px, 0.214rem + 1.43vw, 1.5rem);
						margin-block: 1.5em;
						font-weight: 700;
						line-height: 1.6;
					}
				}

				h2 {
					line-height: 1.2;
					font-size: clamp(24px, -0.107rem + 4.29vw, 60px);
				}

				@media(600px >=width) {
					max-width: 18em;
					margin-inline: auto;
					justify-content: unset;

					h2 {
						margin-block: 0;
					}
				}
			}
		}

		&.slide--3 {
			.slide-caption {
				margin-block-end: clamp(3rem, 0.143rem + 7.62vw, 7rem);

				h2 {
					line-height: 1.2;
				}

				@media(600px >=width) {
					>div {
						display: grid;
						gap: 1.25em;
					}

					h2 {
						line-height: 1.5;
					}
				}
			}
		}
	}

	/* 1=スライド, 2=introduction-block(色なし), 3=we-do-block(色あり)
	   1番目(hero=.topsection-hero-block)は常時紺背景のため対象外にする 
	>section:not(.topsection-hero-block):nth-of-type(1),
	>section:nth-of-type(3) {
		background-color: var(--wp--preset--color--base);
	} */

	/* 4=Our Strengths を色ありの起点にし、以降は交互（4,6,8=色あり / 5,7,9=色なし）
	>section:nth-of-type(n+4):nth-of-type(2n) {
		background-color: var(--wp--preset--color--base);
	} */
	
	>section:nth-child(odd){
		background-color: var(--wp--preset--color--base);
	}
	>section:not(:nth-of-type(1)) {
		padding-block: var(--inner-height-block);
	}
/* 
	>section:last-of-type {
		padding-block-end: 0;
	} */

	>section:not(.introduction-block, .topsection-hero-block) {
		h2 {
			margin-block-end: 3em;
		}
	}

	>section:not(.topsection-hero-block, .introduction-block, .agents-block) {
		h2 {
			margin-inline: auto;
			text-align: center;
		}
	}

	/* 2column-block */
	.introduction-block {
		img {
			display: block;
			aspect-ratio: 1 / 0.7;
			max-width: 100%;
			height: auto;
			margin-inline: auto;
			object-fit: cover;
		}

		>div {
			display: grid;
			gap: 2em;
			@media(1024px > width) {
				justify-items: center;
			}
			/* justify-items: center; */
			>div {
				max-width: 508px;
			}
			>figure {
				/* aspect-ratio: 1/0.7; */
				max-width: 495px;
				width: fit-content;
				display: block;
			}
			&:nth-child(1) {
						margin-block-start: 2em;
				margin-block-end: var(--inner-element-height);
			}
		}

		p+figure {
			margin-block: clamp(1.8em, 1rem + 1.67vw, 3.5rem);
			object-fit: contain;
			max-width: 920px;
			aspect-ratio: unset;
			margin-inline: auto;

			img {
				aspect-ratio: unset;
				object-fit: contain;

			}
		}
	}

	/* we do */
	section.we-do-block {
		padding-block: 4em;;
		/*padding-block-end: 0;*/
			margin-block-end: 0;
		>h2.text-highlight{
			margin-block-end: 1.8em;
		}
		.page_inner_block {
				margin-inline: auto;
		}
		.c-button {
			margin-block-start:3em;
			&.-navy {
				&.-invert {
					width:21em;
				}
			}
		}
		:where(div.page_inner_block >div:nth-child(1):not(.col3),
			div.backcolor-change div div.innter-block) {
			max-width: 447px;

			@media(1024px >=width) {
				justify-self: center;
			}
		}

		.backcolor-change {
			background-color: var(--wp--preset--color--white);
			padding-block: calc(var(--inner-height-block));

			>div {
				display: grid;
				gap: 2em;
			}
		}

		>div.page_inner_block{
			display: grid;
			justify-content: center;
			align-items: center;
			padding-block: 3.45em 0;
			gap: 2em;
		}
		.page_inner_block.no3-1col{
			justify-content: left;
			>div{
				max-width:unset;
			}
		}

		.grid-container {
			padding: unset;

			h3 {
				font-weight: 500;
				width: 100%;
				width: fit-content;
				font-size: clamp(0.75rem, 0.396rem + 0.94vw, 1rem);
				margin-inline: auto 10px;
				padding-inline-end: 0;
			}

		}

	}

	/* 強み */
	section.keypoint-block {

		>div {
			display: grid;
			justify-content: center;
			gap: 2em;
			grid-template-columns: repeat(auto-fit, minmax(0, 1fr));

			@media(768px > width) {
				grid-template-columns: repeat(auto-fit, minmax(338px, 1fr));
				max-width: 338px;
				margin-inline: auto;
				gap: 2.5em;

				p {
					text-align: center
				}
			}

			figure {
				max-width: 337px;
				aspect-ratio: 1 / 0.712;
			}

			img {
				display: block;
				width: 100%;
				height: auto;
				object-fit: cover;
			}

			p {
				font-weight: 700;
				line-height: 1.6;
				margin-block: 0.5em;
			}
		}
	}

	/* 提供 */
	section.served {
		/* h2 {
			margin-inline: auto;
			margin-block-end: 3em;
		} */

		>div {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			gap: 1.2rem 1rem;
			max-width: 534px;
			margin-inline: auto;

			&>div {
				flex: 0 0 156px;
				display: grid;
				place-content: center;
				color: var(--wp--preset--color--corporate);
				background-color: var(--wp--preset--color--base);
				border-radius: 50%;
				aspect-ratio: 1 / 1;
				gap: 0.5em;

				p {
					text-align: center;
					font-size: 16px;
					font-weight: bold;
					line-height: 1;
				}

				img {
					display: block;
					height: auto;
					object-fit: contain;
					margin-inline: auto;
				}
			}
		}
	}

	/* プロセス */
	section.wp-block-group.manufacture {
		background-color: #d4d7db;
	}

	section.manufacture {
		/* h2 {
			margin-inline: auto;
		} */

		>div {
			display: grid;
			justify-content: center;
			align-items: stretch;
			gap: 1em;

			@media (1024px > width) {
				grid-template-columns: repeat(2, auto);
			}

			@media (1024px <=width) {
				grid-template-columns: repeat(3, auto);
			}

			counter-reset: mfg-num;

			>div {
				@media (1024px > width) {
					max-width: clamp(10.534rem, -18.615rem + 60.73vw, 20.25rem);
					padding-block: 1em;
				}

				@media (1024px <=width) {
					width: clamp(10.534rem, -18.615rem + 60.73vw, 20.25rem);
					place-content: center;
				}

				aspect-ratio: 1 / 0.808;
				background-color: var(--wp--preset--color--white);
				display: grid;
				gap: 1em;
				counter-increment: mfg-num;
			}

			p {
				font-family: "Orbitron", sans-serif;
				font-weight: 700;
				font-size: clamp(0.75rem, 0.036rem + 1.49vw, 22px);
				text-align: center;

				&::before {
					content: counter(mfg-num, decimal-leading-zero) ".";
					display: block;
					background: var(--gradient-1);
					-webkit-background-clip: text;
					background-clip: text;
					-webkit-text-fill-color: transparent;
					/* margin-block-end: 0.15em; */
				}
			}

			figure {
				/* aspect-ratio: 1 / 0.712; */
				display: flex;
				align-items: center;
				justify-content: center;
				height: 100%;
			}

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

				@media (768px > width) {
					max-width: clamp(3.75rem, -0.672rem + 11.79vw, 6.875rem);
				}
			}
		}
	}

	/* .col3 {
		display: grid;
		margin-inline: auto;
		max-width: 260px;
		grid-template-columns: 1fr;
		gap: 0.5em 8px;

		figure {
			position: relative;
		}

		figcaption {
			font-family: "Orbitron", sans-serif;
			font-weight: 700;
			font-size: 1rem;
			line-height: 1.2;
			position: absolute;
			bottom: 0;
			left: 0;
			width: 100%;
			text-align: center;
			color: var(--wp--preset--color--white);
			display: block;
			margin-block-end: 1em;
		}
	} */

	/* efforts */
	.effort-block {
		h3 {
			margin-block-end: 1.225em;
		}

		>div {
			display: grid;
			justify-content: center;
			align-content: center;
			align-items: center;
			justify-items: center;
			gap: 2em 2.5em;

			@media (768px > width) {
				justify-items: center;
			}

			&:nth-of-type(1) {
				margin-block-end: var(--inner-element-height);
			}

			>div {
				max-width: 610px;

				a {
					color: var(--wp--preset--color--sub);

					&:not(.link-underline) {
						transition: 0.3s ease;
					}
				}

				p:has(a) {
					margin-block: clamp(1.25rem, -0.286rem + 4.76vw, 2.25rem) 0;
				}

				p.link-underline {
					color: var(--wp--preset--color--sub);
					margin-block-start: clamp(1em, -0.208rem + 1.89vw, 1rem);
					line-height: 1.2;
					font-weight: 700;
					text-align: left;
				}
			}

			figure {
				max-width: 221px;
				aspect-ratio: 1 / 1.416;
				border: 1px solid #e4e4e4;
			}

			img {
				display: block;
				width: 100%;
				/* max-width: 221px; */
				height: auto;
				object-fit: cover;
			}
		}
	}

	/* 海外拠点 */
	.agents-block {
		h2 {
			margin-block-end: 4.5rem;
		}

		h3 {
			font-size: 1.25rem;
			border-bottom: 1px solid var(--wp--preset--color--corporate);
			padding-block-end: 0.35em;
			margin-block-end: 0.35em;
			line-height: 1.6;
		}

		p {
			overflow-wrap: anywhere;
			word-break: normal;
			text-align: left;
			margin-block-end: 2em;
			line-height: 1.5;
			font-feature-settings: "palt" 1, "tnum" 1;

			&:nth-last-of-type(1) {
				margin-block-end: 0;
			}
		}
	}

	/* ロケーション */
	.location {
		h2 {
			margin-inline: auto;
		}

		address {
			font-style: normal;
			line-height: 1.5;
			overflow-wrap: anywhere;
			word-break: normal;
			margin-block-end: 3em;
		}

		>div {
			display: grid;
			justify-content: center;
			gap: 2em;

			@media(768px < width) {
				grid-template-columns: repeat(2, minmax(0, 1fr));
			}

			@media(768px >=width) {
				grid-template-columns: 1fr;
			}

			justify-items: center;
			align-items: center;

			figure {
				display: block;
				max-width: 340px;
				justify-self: center;
			}

			img {
				display: block;
				width: 100%;
				height: auto;
				object-fit: cover;
			}
		}
	}
}

.col3 {
	display: grid;
	margin-inline: auto;
	max-width: 260px;
	grid-template-columns: 1fr;
	gap: 0.5em 8px;

	figure {
		position: relative;
	}

	figcaption {
		font-family: "Orbitron", sans-serif;
		font-weight: 700;
		font-size: 1rem;
		line-height: 1.2;
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		text-align: center;
		color: var(--wp--preset--color--white);
		display: block;
		margin-block-end: 1em;
	}
}

/* JP content */
.jp-top-page {
	section {
		h2[data-en] {
			line-height: 1.6;
			margin-block-end: 1.2em;

			&::before {
				font-size: clamp(0.75rem, 0.333rem + 1.33vw, 1.25rem);
				margin-block-end: 0.25em;
				width: fit-content;
				display: block;
			}
		}
	}

	section:not(.equipment-business, .company-information-block) {
		h2[data-en] {
			text-align: center;
			width: fit-content;
			margin-inline: auto;
			margin-block-end: 1em;
			line-height: 1.4;

			&::before {
				margin-inline: auto;
			}
		}
	}

	/* our-vision */
	.our-vision {
		padding-block: clamp(4rem, 1.902rem + 5.6vw, 100px) 6em;
		background-image: url(../img/top-block-imgbg.webp);
		background-size: cover;
		background-position: right center;
		background-repeat: no-repeat;

		.inner-our {
			padding-inline: 1em;
			max-width: var(--top__block-width);
			margin-inline: auto;
			display: grid;
			justify-content: center;
			gap: 1em 2em;

			>div:nth-child(3) {
				/* width: 34em; */
				max-width: 100%;

				p {
					margin-block-end: 1.85em;
					line-height: 2;
					font-size:clamp(15px, 0.804rem + 0.36vw, 18px);
				}
			}
		}

		/* image-block-element：回転リング付き円形ダイアグラム（htmltest/circle.html 移植） */
		.image-block-element {
			position: relative;
			width: 100%;
			max-width: clamp(20.75rem, 15.926rem + 20.58vw, 40.625rem);
			aspect-ratio: 1 / 1;

			.circle-rings-svg {
				position: absolute;
				inset: 0;
				width: 100%;
				height: 100%;
				pointer-events: none;
			}

			.wp-block-image {
				position: absolute;
				z-index: 1;
				width: 100%;
				max-width: clamp(10rem, 7.649rem + 10.03vw, 19.688rem);
				margin: 0;

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

				&:nth-of-type(1) {
					top: 0.5%;
					left: 0.5%;
				}

				&:nth-of-type(2) {
					right: 0.2%;
					bottom: 0.2%;
				}
			}
		}
	}

	/* service */
	.service {
		position: relative;
		z-index: 0;
		padding-block: 3.35em 3.7em;

		width: 100%;
		color: var(--wp--preset--color--white);
		background-color: var(--wp--preset--color--corporate);
		text-align: center;
		clip-path: inset(0);
		justify-content: center;
		display: grid;

		&::before {
			content: '';
			position: absolute;
			inset: 0;
			z-index: -1;
			background: url(../img/jp-top-imagebg.webp) no-repeat center/cover;

			/* iOSはbackground-attachment:fixed/position:fixedの挙動が不安定なため、iOS以外だけposition:fixedの疑似要素で固定背景にする（-webkit-touch-callout: noneはiOS判定の定番ハック） */
			@supports not (-webkit-touch-callout: none) {
				position: fixed;
			}
		}

		h2 {
			margin-inline: auto;
		}

		h3 {
			margin-block: 1.125em 0.9em;
			line-height: 1.8;
			font-size:clamp(1.5rem, 0.696rem + 2.14vw, 42px);
		}

		p {
			font-feature-settings: normal;
			font-weight: 400;
			line-height: 1.875;
		}

		.inner-bg-fixed {
			position: relative;
			z-index: 1;
			/* justify-self: center; */
			width: 100%;
			max-width: 51.25em;
			margin-inline: auto;
		}
	}

	/* 産業機器・受託産業 */
	.equipment-business {
		padding-block: 4em 0;

		/* 見出し2つに 01/02 を振る。英字(::before)とは別のグラデーション文字として ::after に表示 */
		counter-reset: eq-num;

		h2[data-en] {
			position: relative;
			counter-increment: eq-num;
			line-height: 1.55;
			margin-block-end: 1.42em;
			&::before {
				margin-inline-start: 2em;
				margin-block-end: 0.15em;
			}

			&::after {
				margin-block-end: 0.15em;
				content: counter(eq-num, decimal-leading-zero) ".";
				position: absolute;
				top: 0;
				left: 0;
				display: block;
				font-family: "Orbitron", sans-serif;
				font-weight: 700;
				font-size: clamp(0.938rem, 0.677rem + 0.83vw, 1.25rem);
				line-height: inherit;
				background: var(--gradient-1);
				-webkit-background-clip: text;
				background-clip: text;
				-webkit-text-fill-color: transparent;
			}
		}

		>div {
			padding-inline: 1em;

			&:nth-child(1) {
				display: grid;
				gap: 2em;
				justify-content: center;
				max-width: var(--top__block-width);
				margin-inline: auto;
				padding-block-end: 3.75em;

				>div:nth-child(1) {
					align-self: center;
					justify-self: center;

					max-width: 28em;
					font-feature-settings: normal;

					p {
						line-height: 1.9;
					}

					a {
						margin-block-start: 3rem;
					}
				}
			}

			.grid-container {
				padding: unset;
				gap: 1px;
				max-width: 782px;

				.lb-block {
					max-width: 390px;
					min-width: 0;

					figure+div {

						h3,
						p {
							width: max-content;
							max-width: 90%;
							margin-inline-start: 69.7%;
							transform: translateX(-50%);
							text-align: center;
							white-space: nowrap;
						}

						h3 {
							font-size: clamp(0.688rem, 0.401rem + 1.22vw, 1.5rem);

							@media(768px >=width) {
								bottom: -4px;
							}
						}

						p {
							font-size: clamp(0.5rem, 0.412rem + 0.38vw, 0.75rem);
							font-family: "Orbitron", sans-serif;
							margin-block-end: 4px;
						}
					}

					/* カスタマイズ・オーダーメイド装置：2行とも長めで右端が詰まるため中心点を左に少し逃がす */
					&:nth-child(3) figure+div h3 {
						transform: translateX(calc(-50% - 0.6em));
					}
				}
			}

			&:nth-child(2) {
				background: #E8EAF1;
				padding-block: 7em;

				>div {
					display: grid;
					gap: 2em;
					justify-content: center;
					max-width: var(--top__block-width);
					margin-inline: auto;

					>div:nth-child(1) {
						max-width: 28em;
						font-feature-settings: normal;
						align-self: center;
						justify-self: center;
						p {
							line-height: 1.9;
						}

						a {
							margin-block-start: 3.6rem;
						}
					}
				}
			}
		}

		.col3 {
			width: 100%;
			max-width: 960px;
			gap: 14px;
			padding-inline: 1em;

			figure {
				position: relative;

				height: 100%;
				width: auto;
				background-color: var(--wp--preset--color--corporate);
				overflow: hidden;

				img {
					display: block;
					width: 100%;
					height: auto;
					object-fit: contain;
					align-content: start;
				}
			}

			figcaption {
				margin-block: 0;
				padding-block: 1.65em;
				display: grid;
				position: absolute;
				bottom: 0;
				width: 100%;
				gap: 10px;
				background-color: var(--wp--preset--color--corporate);
				background-image: url(../img/top-3col-figcaption.webp);
				background-size: cover;
				background-position: center;
				background-repeat: no-repeat;
				justify-content: center;
				justify-items: center;

				h3 {
					line-height: 1;
					margin-block: 0;
					font-size: 1.5rem;
					font-weight: 700;
				}

				p {
					font-size: 0.625rem;
					line-height: 1;
					margin-block: 0.45em 1.2em;
					font-weight: 700;
					color: var(--wp--preset--color--accent);
				}

				.arrow-icon {
					position: relative;
					display: inline-block;
					width: 43px;
					height: 43px;

					img {
						display: block;
						width: 100%;
						height: 100%;
						border-radius: 50%;
						transition: 0.6s ease;
					}

					._iconBorder {
						position: absolute;
						inset: 0;
						width: 100%;
						height: 100%;
						transform: rotate(-90deg);
						pointer-events: none;

						._circle {
							stroke: var(--wp--preset--color--accent);
							stroke-width: 1.5;
							fill: none;
						}
					}
				}
			}

			a {
				display: block;
				width: 100%;
				height: 100%;
				aspect-ratio: 1 / 1.335;
				transition: 0.6s ease;

				p,
				h3,
				img {
					transition: 0.6s ease;
				}

				&:hover {
					figure>img {
						opacity: 0.5;
						filter: blur(0.5px);
						transform: scale(1.01);
					}

					figcaption {
						p {
							filter: blur(1px);
						}
					}
				}
			}
		}
	}

	/*industrial_equipment 等の .support-intro-block（pages-products.css）と見た目を揃える。
   TOPページの本文構造には .page_inner_block の入れ子が無いため、
   グリッド適用先を1階層浅くして流用している */
	.support-intro-block {
		padding-block: 4.35em 4em;
		/* ストライプ位置は .support-intro-block 自身の幅に対する%で指定（1920px基準：750/450/150px → 39.0625/23.4375/7.8125%）。
		   pxの絶対オフセットのままだと1920px以外の幅でコンテンツ側（%中央寄せ）とズレるため、線の太さ(1px)だけpxで残し位置は%化している。 */
		background-image: linear-gradient(90deg,
				transparent calc(50% - 39.0625%),
				#EAE9E9 calc(50% - 39.0625%),
				#EAE9E9 calc(50% - 39.0625% + 1px),
				transparent calc(50% - 39.0625% + 1px),
				transparent calc(50% - 23.4375%),
				#EAE9E9 calc(50% - 23.4375%),
				#EAE9E9 calc(50% - 23.4375% + 1px),
				transparent calc(50% - 23.4375% + 1px),
				transparent calc(50% - 7.8125%),
				#EAE9E9 calc(50% - 7.8125%),
				#EAE9E9 calc(50% - 7.8125% + 1px),
				transparent calc(50% - 7.8125% + 1px),
				transparent calc(50% + 7.8125% - 1px),
				#EAE9E9 calc(50% + 7.8125% - 1px),
				#EAE9E9 calc(50% + 7.8125%),
				transparent calc(50% + 7.8125%),
				transparent calc(50% + 23.4375% - 1px),
				#EAE9E9 calc(50% + 23.4375% - 1px),
				#EAE9E9 calc(50% + 23.4375%),
				transparent calc(50% + 23.4375%),
				transparent calc(50% + 39.0625% - 1px),
				#EAE9E9 calc(50% + 39.0625% - 1px),
				#EAE9E9 calc(50% + 39.0625%),
				transparent calc(50% + 39.0625%));

		@media (width <=600px) {
			background-image: linear-gradient(90deg,
					transparent calc(25vw - 1px),
					#EAE9E9 calc(25vw - 1px),
					#EAE9E9 25vw,
					transparent 25vw,
					transparent 75vw,
					#EAE9E9 75vw,
					#EAE9E9 calc(75vw + 1px),
					transparent calc(75vw + 1px));
		}

		/* h2[data-en] {
			width: fit-content;
			margin-inline: auto;
			margin-block-end:1em;
			line-height: 1.4;
		} */


		.page_inner_block {
			>p {
				text-align: center;
				line-height: 1.875;
			}

			>div {
				margin-block-start: 4em;
				position: relative;
				margin-inline: auto;
				display: grid;
			}

			>.top-contact-block {
				color: var(--wp--preset--color--white);
				background: var(--wp--preset--color--corporate);
				max-width: 732px;
				padding: 1.1em;
				grid-template-columns: minmax(0, 1fr);
				background-image: url(../img/top-contact-blockbg.webp);
				background-repeat: no-repeat;
				background-position: left top;
				background-size: cover;
				gap: 1em;
				margin-block: 3.6em 0.5em;

				h3 {
					font-size: 20px;
					width: fit-content;
					line-height: 1.4;
					margin-inline: auto;
					margin-block-end: 0.5em;

					&::before {
						font-size: 16px;
						width: fit-content;
						margin-inline: auto;
					}
				}

				p {
					text-align: center;
					line-height: 1.4;
					margin-block: 0;
				}

				>div:not(.top-contact-innner) {
					display: grid;
					gap: 1.5em;
					align-content: center
				}

				.top-contact-innner {
					display: grid;
					width: 100%;
					position: relative;
					isolation: isolate;

					/* border-radius: 6px; */
					border-radius: 0.375rem;
					justify-items: center;
					justify-self: end;

					&::before {
						content: "";
						position: absolute;
						inset: 0;
						z-index: -1;
						border-radius: inherit;
						background: #0357c471;
						backdrop-filter: blur(135.72311401367188px);
					}

					>div {
						width: 100%;
						display: grid;
						padding-block: 2.275em 1.5em;
						row-gap: 1.5em;
						align-items: center;
						justify-items: center;




						a.c-button.-navy {
							width: 14em;
							height: 3em;

							span._text {
								font-size: 12px
							}
						}

					}
				}
			}
		}

		/* .phone / .icon-phone / .phone-number / .footer-contact__hour の定義は
		   global.css の「電話番号表示（.phone）」へ移設（2026-07-14）。
		   TOP は旧クラス .top-contact-innner で global.css 側の橋渡しセレクタが効くため、ここには不要。 */
	}

	/* 会社案内 */
	.company-information-block {
		color: var(--wp--preset--color--white);
		background-color: var(--wp--preset--color--comporate);
		background-image: url(../img/top-c-img-bg.webp);
		background-repeat: no-repeat;
		background-position: right center;
		background-size: cover;
		padding-block: 6.25em 2.95em;

		h2[data-en] {
			margin-block-end: 1.7em;
		}

		.grid-container.infromations {
			row-gap: 1em;

			a {
				transition: 0.6s cubic-bezier(.15,.81,.97,.97);
				border: 0.9px solid var(--wp--preset--color--white);
				h3,p,img{transition: 0.6s cubic-bezier(.15,.81,.97,.97) 0.1s;}
				&:hover{
					color:unset;
					img{
						filter: blur(1px) brightness(0.7) contrast(0.9);
					}
					p{
						color:var(--wp--preset--color--accent);
						filter: blur(1px) brightness(0.7);
					}
				}
			}
		}

		h2+div {
			display: grid;
			margin-block: 3em 3.25em;

			.leadcopy {
				font-size: clamp(2rem, 1.286rem + 1.49vw, 2.625rem);
				line-height: 1.4;
				margin-block-end: 0.5em;
			}
		}

		.lb-block {
			max-width: 350px;
			aspect-ratio: 1/ 0.731;

			/* SVG窪み（viewBox 348x17、中心251.619/348≈72.3%）に文字位置を追従させる。
			   固定px幅だとカード幅が可変になるレスポンシブ時に窪みとズレるため、
			   equipment-business の .col3 と同じ比率指定+translateX(-50%)方式に統一 */
			figure+div {

				h3,
				p {
					width: max-content;
					max-width: 90%;
					margin-inline-start: 72.3%;
					transform: translateX(-50%);
				}
			}

			h3 {
				font-size: clamp(0.5rem, 0.324rem + 0.75vw, 1rem);
				margin-block-end: -3px;
			}

			p {
				font-size: clamp(0.5rem, 0.412rem + 0.38vw, 0.75rem);
				margin-block-start: -2px;
				font-family: "Orbitron", sans-serif;
			}
		}
	}

	/*お知らせ*/
	.topics-block {
		padding-block: 4em 3em;
		background-color: var(--wp--preset--color--base);
		h2.text-highlight[data-en] {
			margin-block-end: 1.82em;
		}
	}

	/*採用情報*/
	.top-recruit-banner {
		margin-block: 3.5em 0.5em;
		text-align: center;
		position: relative;
		max-width: 736px;
		width: 100%;
		aspect-ratio: 1 / 0.266;
		margin-inline: auto;
		overflow: hidden;
		background: url('../img/to-image-rec02.webp') center/cover no-repeat;
		display: grid;
		opacity: 0;
		transition: 0.65s cubic-bezier(.15,.81,.97,.97) 0.3s;
		a {
			padding-block:1em 5px;
			display: grid;
			width: 100%;
			height: 100%;
			position: relative;
			z-index: 3;
			color: var(--wp--preset--color--white);
			text-decoration: none;
			justify-items: center;
			align-items: center;
			/* transition: 1s cubic-bezier(.62, .09, .57, 1.06) 0.6s; */

			h2,
			p,
			figure {
				line-height: 1;
				margin: 0;
				transition: 0.5s ease;
			}
			.banner-title{letter-spacing: -1px;}
			.banner-sub{font-weight:600;letter-spacing: 0.125em;font-size:1.125rem;}
figure {margin-block-start:0.25em}
			img {
				border-radius: 50%;
				transition: 0.5s ease;
			}

			&:hover {
				backdrop-filter: blur(5px);

				h2 {
					color: var(--wp--preset--color--corporate);
					text-shadow: 0 0 12px rgba(255, 255, 255, 0.7);
				}

				img {
					background-color: var(--wp--preset--color--corporate);
					box-shadow: 0 0 20px rgba(255, 255, 255, 1);

				}
			}
		}

		h2 {
			align-self: end;
		}

		figure {
			align-self: start
		}

		&.event-view {
			opacity: 1;
			transition: 1s cubic-bezier(.62, .09, .57, 1.06) 0.6s;
			/* transition: 0.5s cubic-bezier(.15,.81,.78,.98) 0.3s; */

			&::before {
				content: '';
				position: absolute;
				left: 0;
				right: 0;
				height: 1px;
				background-image: linear-gradient(90deg, transparent 0, rgba(222, 222, 222, 0.5) 50%, transparent 300%);
				background-position: center;
				background-size: 300% 1px;
				animation: scanDown 2s cubic-bezier(.1, .95, .89, .83) 1.25s infinite;
				top: -2px;
				z-index: 1;
			}
		}

	}

	.pulse-btn {
		position: relative;
		width: 44px;
		height: 44px;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 18px;
		cursor: pointer;
		backdrop-filter: blur(4px);
	}

	.pulse-btn::before,
	.pulse-btn::after {
		content: '';
		position: absolute;
		inset: -5px;
		border-radius: 50%;
		border: 1px solid rgba(79, 195, 247, 0.45);
		animation: pulseRing 2.2s ease-out infinite;
	}

	.pulse-btn::after {
		animation-delay: 1.1s;
	}

}

@keyframes pulseRing {
	0% {
		transform: scale(1);
		opacity: 0.8;
	}

	100% {
		transform: scale(2.4);
		opacity: 0;
	}
}

@keyframes scanDown {
	0% {
		top: -2px;
		opacity: 0;
	}

	5% {
		opacity: 1;
	}

	95% {
		opacity: 1;
	}

	100% {
		top: 100%;
		opacity: 0;
	}
}

.c-button {
	line-height: 1.2;
	height: 3.5em;
}

@media(768px <=width) {
	.col3 {
		max-width: 525px;
		/* margin-inline: unset; */
		grid-template-columns: repeat(3, minmax(clamp(10.625rem, 10.411rem + 0.45vw, 10.813rem), 1fr));
	}

	.jp-top-page {

		.our-vision {
			.inner-our {
				h2 {
					letter-spacing: unset;
				}

				>div:nth-child(3) {
					width: 540px;
				}
			}
		}

		.service {
			padding-inline: 1em;
		}

		.company-information-block {
			.grid-container.infromations {
				display: flex;
				flex-wrap: wrap;
				justify-content: center;
				column-gap: 0.25em;
				row-gap: 2.25em;

				.lb-block {
					flex: 0 1 calc((100% - 2 * 0.25em) / 3);
				}
			}
		}

		.support-intro-block {
			.page_inner_block>.top-contact-block {
				grid-template-columns: auto auto;

				>div:not(.top-contact-innner) {
					display: grid;
				}

				.top-contact-innner {
					display: grid;
					/*
					> div {

					} */
				}
			}

			/* .phone の PC幅 gap 調整も global.css の「電話番号表示（.phone）」側へ移設（2026-07-14） */
		}
	}

}

@media(1024px <=width) {
	.en-top-page {

		/* we do */
		.we-do-block {

			.backcolor-change {
				>div.page_inner_block {
/* 					grid-template-columns: 1fr auto; */

					>div:nth-child(1) {
						grid-column: 2;
						grid-row: 1;
					}

					>div:nth-child(2) {
						grid-column: 1;
						grid-row: 1;
					}
				}
			}

			>div.page_inner_block:not(.no3-1col) {
				/* display: grid; */
				grid-template-columns: 1fr auto;
				justify-content: unset;
				padding-inline-start: 1em;
				padding-block-end: 3em;
			}
		}
/* .page_inner_block.no3-1col{} */
		.effort-block {
			display: grid;

			>div {
				grid-template-columns: 1fr auto;
				justify-content: unset;
			}
		}
	}

	.jp-top-page {
		.our-vision {
			.inner-our {
				grid-template-columns: minmax(49vw, 1fr) minmax(0, 1fr);
				grid-template-rows: auto 1fr;

				>div:nth-child(3) {
					grid-column: 1;
					grid-row: 2;
					/* justify-self: center; */
				}

				p.text-highlight:not([data-en]) {
					line-height: 1;
				}

				h2 {
					margin-block: 1.5em;
					line-height: 1.45;
					/* white-space: nowrap; */
					/* 句読点まわりの間延び対策（デスクトップ幅のみ）。
					   font-feature-settings: "palt" は全体適用済みだがそれだけでは詰めきれないため letter-spacing を併用。
					   + "chws"（文脈依存半角スペーシング）を追加で試験導入。フォント/ブラウザが対応していなければ無視されるだけで害はない。 */
					letter-spacing: -1.25px;
					font-feature-settings: "palt", "chws";
				}
			}

			.our-title {
				grid-column: 1;
				grid-row: 1;
				/* justify-self: center; */
				align-self: end;
			}

			.image-block-element {
				grid-column: 2;
				grid-row: 1 / 3;
				align-self: center;
			}
		}

		.company-information-block {
			h2+div {
				grid-template-columns: repeat(2, minmax(0, 1fr));
			}
		}

		/* 産業機器・受託産業 */
		.equipment-business {
			>div {
				&:nth-child(1) {
					display: grid;
					grid-template-columns: repeat(2, minmax(clamp(15.625rem, -22.518rem + 59.6vw, 768px), 1fr));
				}
				.grid-container {
					.lb-block {
						figure + div {
							h3 {
								font-size: clamp(1.025rem, 0.482rem + 0.85vw, 1.5rem);
							}
						}
					}
				}
				/*
				&:nth-child(2) {
					> div {
						display: grid;
						grid-template-columns: 1fr 0.6fr;

						> div:nth-child(1) {
							grid-column: 2;
							grid-row: 1;
						}

						> div:nth-child(2) {
							grid-column: 1;
							grid-row: 1;
						}
					}
				} */
			}
		}
	}
}

@media(1200px > width) {
	.en-top-page {
		.page_inner_block {
			padding-inline: 1em;
		}
	}
}

@media(1024px <=width) {
	.en-top-page {
		.introduction-block {
			>div {
				grid-template-columns: 1fr auto;
				column-gap: 2.5em;
				justify-items: unset;
			}
		}
	}
}

@media(1200px <=width) {
	/* 産業機器・受託産業 */

	.jp-top-page {
		.equipment-business {
			.col3 {
				padding-inline: unset;
			}

			>div {
				&:nth-child(2) {
					>div {
						display: grid;
						grid-template-columns: 1fr 0.6fr;

						>div:nth-child(1) {
							grid-column: 2;
							grid-row: 1;
						}

						>div:nth-child(2) {
							grid-column: 1;
							grid-row: 1;
						}
					}
				}
			}
		}
	}

}

/* フッター処理用 */
.slug-en {
	.footer-contact {
		& .footer-contact__text {
			overflow-wrap: anywhere;
			word-break: normal;
			margin-block-start: 0;
		}
	}
}

.support-site-link{
	width:fit-content;
	margin-inline:auto;
	/* a{display: block;} */

.c-button {
	&.-navy {
		&.-invert {
			width: 22.5em;
		}
	}
}
}