/* 製品・設備一覧系ページ専用 CSS
   対象：industrial_equipment / custom_business / custom_built / tape_reel / visual_inspection
   （pages-common.css から 2026-07-03 分離。読み込み条件は functions.php $product_pages 配列を参照）
   分割前バックアップ：git tag before-pages-css-split-20260703 / assets/../nagata-theme-backups/pages.css.bak-20260703 */
/* 外観検査装置 受託製品事業 */
:where(.custom-page, .industrial-page) {
	background-repeat: no-repeat;
	background-position: right top;
	background-size: cover;
	padding-block-end: 2em;

	h2:nth-of-type(1) {
		text-align: center;
		margin-block-end: 1.25em;
		line-height: 1.75;
	}
}

:where(.industrial-business-block, .custom-business-block) {
	--inner-height-block: clamp(2.813rem, -0.044rem + 5.95vw, 5.313rem);

	>section {
		padding-block: var(--inner-height-block);
	}
}
:where(.industrial-business-block) {
	>section {
		&:nth-child(even) {
			background-color: var(--wp--preset--color--base);
		}
	}
}
:where(.custom-business-block) {
	>section:nth-of-type(1) {
		padding-block-start: 1em;
	}
	>section{
				&:nth-child(odd) {
			background-color: var(--wp--preset--color--base);
		}
	}
}

.slug-industrial_equipment {
	.link-underline {
		color: var(--wp--preset--color--sub);
	}
}
/* 外観検査装置 */
.visual-i-sys-page{
	padding-block-start:1.75em;
}
/*産業機器事業*/
/* 外観検査装置 */
.industrial-page {
	background-image: url(../img/equip-b-img01bg.webp);
	padding-block-end: 2.95em;

	p {
		max-width: 50em;
		margin-inline: auto;
	}

	img {
		display: block;
		width: 100%;
		height: auto;
		object-fit: cover;
		max-width: 906px;
		margin-inline: auto;
		margin-block-start: clamp(1.563em, 0.268rem + 3.45vw, 3.375em);
	}
}

.industrial-business-block {

	>section {
		padding-block: var(--inner-height-block);

		&:nth-of-type(1) {
			padding-block-start: unset;
			>div {
				display: block;
			}
		}

		>div {
			display: flex;
			align-items: center;
			gap: 1.5em;
			justify-content: space-between;

			>div:nth-child(1) {
				max-width: 422px;

				a {
					color: var(--wp--preset--color--sub);
					text-decoration: none;
					display: block;
					width: fit-content;
					margin-block-start: 2.25em;
					font-weight: 600;
				}
			}

			>div:nth-child(2) {
				max-width: 35.75rem;
				gap: 0.75em;

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

				figcaption {
					font-size: clamp(0.469rem, 0.268rem + 0.54vw, 12px)
				}

				figure:not(figcaption) {
					img {
						aspect-ratio: 1/1.13;
						max-width: 288px;
					}
				}


			}
		}
		&.Tapefeeder_block{
			>div:not(.feeder_inspection-block) >div:nth-child(2) {
				gap:5px 4px;

				figure:has(figcaption) {
					display: block;
					position: relative;

					img {
						max-width: 190px;
						aspect-ratio: 1/1.016;
						position: relative;
					}
					figcaption {
						position: absolute;
						bottom: 0;
						left: 0;
						width: 100%;
						line-height: 1.4;
						display: block;
						text-align: center;
						padding-block-end: 0.3em;
					}
				}
		}
	}
	}

/* 	>section:nth-last-of-type(1):not(.support-intro-block) {
		padding-block-end: 0;
	} */

	h3.text-highlight[data-en] {
		text-align: start;
		width: 100%;
		line-height: 1.6;
		margin-block-end: 1.85em;

		&::before {
			font-size: clamp(0.938rem, 0.58rem + 0.74vw, 1.25rem);
		}
	}

	.feeder_inspection-block {
		background-color: var(--wp--preset--color--corporate);
		margin-block: 3.75em 0;
		max-width: 960px;
		margin-inline: auto;
		color: var(--wp--preset--color--white);
		padding: 2em clamp(1.2em, 0.286em + 1.9vw, 2rem);

		p {
			font-feature-settings: normal;
		}

		.accent-point-block {
			line-height: 2.4;
			margin-block-end: 1em;
		}

		>div:nth-child(1) {
			max-width: 335px;
		}

		>div:nth-child(2) {
			/* max-width: 415px; */
			display: grid;
			grid-template-columns: repeat(2, minmax(0, 1fr));

			img {
				display: block;
				width: 100%;
				height: auto;
				aspect-ratio: 1/0.665;
				object-fit: contain;
				border: 1px solid var(--wp--preset--color--white);
			}
		}
	}

	.builtEquipment {
		.page_inner_block {
			>div:nth-child(1) {
				max-width: 100%;

				a[href$=".pdf" i] {
					display: inline-block;
					background-position: left center, right center, left bottom;
				}
			}
		}
	}

	/* 縦線ブロック（汎用・サポート案内用） */
	/*section.support-intro-block {
		background-image: repeating-linear-gradient(90deg,
				#EAE9E9 0,
				#EAE9E9 1px,
				transparent 1px,
				transparent 400px);
	}*/

	>section.support-intro-block {
		padding-block-start:4.35em;
		background-image: linear-gradient(90deg,
				transparent calc(50% - 1090px),
				#EAE9E9 calc(50% - 1090px),
				#EAE9E9 calc(50% - 1089px),
				transparent calc(50% - 1089px),
				transparent calc(50% - 654px),
				#EAE9E9 calc(50% - 654px),
				#EAE9E9 calc(50% - 653px),
				transparent calc(50% - 653px),
				transparent calc(50% - 218px),
				#EAE9E9 calc(50% - 218px),
				#EAE9E9 calc(50% - 217px),
				transparent calc(50% - 217px),
				transparent calc(50% + 217px),
				#EAE9E9 calc(50% + 217px),
				#EAE9E9 calc(50% + 218px),
				transparent calc(50% + 218px),
				transparent calc(50% + 653px),
				#EAE9E9 calc(50% + 653px),
				#EAE9E9 calc(50% + 654px),
				transparent calc(50% + 654px),
				transparent calc(50% + 1089px),
				#EAE9E9 calc(50% + 1089px),
				#EAE9E9 calc(50% + 1090px),
				transparent calc(50% + 1090px));

		@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 {
			text-align: center;
			/* margin-block-end: 1em; */
			margin-block-end: 0.85em;
			background-image: url(../img/svg/heart.svg);
			background-repeat: no-repeat;
			background-position: center top;
			padding-block-start: 1.75em;
		}

		>div {
			display: block;
			grid-template-columns: 1fr;
			max-width: 47.5em;
			margin-inline: auto;

			>div {
				margin-block-start: 3em;
				position: relative;
				margin-inline: auto;
				display: grid;
				grid-template-columns: repeat(2, minmax(0, 1fr));
				max-width: 45em;
				column-gap: 1.4em;

				a {
					display: block;
					background-color: var(--wp--preset--color--corporate);
					color: var(--wp--preset--color--white);
					text-decoration: none;
					transition: 0.3s ease;

					&:hover {
						img {
							opacity: 0.5;
						}

						p::before {
							left: 110%;
							transition: left 0.5s ease;
						}
					}

					p {
						position: relative;
						overflow: hidden;
						display: flex;
						justify-content: space-between;
						padding-inline: 0.5em;
						line-height: 1;
						margin: 0;
						padding-block: 0.75em;
						border: 1px solid transparent;
						border-top: 1px solid var(--wp--preset--color--accent);
						transition: 0.3s ease;

						&::before {
							content: "";
							position: absolute;
							top: 0;
							left: -60%;
							width: 50%;
							height: 1px;
							background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.9), transparent);
						}

						&::after {
							content: "";
							display: inline-block;
							width: 10px;
							height: 14px;
							background-color: currentColor;
							-webkit-mask-image: url("data:image/svg+xml,<svg width='10' height='14' viewBox='0 0 10 14' xmlns='http://www.w3.org/2000/svg'><path d='M9.56836 6.72925L1.49316 13.4587L-0.000976562 11.6667L5.92285 6.72925L-0.000976562 1.79272L1.49316 -0.000244141L9.56836 6.72925Z' fill='black'/></svg>");
							mask-image: url("data:image/svg+xml,<svg width='10' height='14' viewBox='0 0 10 14' xmlns='http://www.w3.org/2000/svg'><path d='M9.56836 6.72925L1.49316 13.4587L-0.000976562 11.6667L5.92285 6.72925L-0.000976562 1.79272L1.49316 -0.000244141L9.56836 6.72925Z' fill='black'/></svg>");
							mask-repeat: no-repeat;
							mask-size: contain;
							vertical-align: middle;
							transition: 0.3s ease;
						}

					}

					img {
						display: block;
						width: 100%;
						height: auto;
						max-width: 21.876rem;
						aspect-ratio: 340 / 218;
						object-fit: cover;
						transition: 0.3s ease;
					}
				}
			}
			p{line-height:2;}

			@media (1024px <=width) {}
		}
	}
}

@media(768px >=width) {
	.industrial-business-block {
		>section {
			padding-inline: 1em;

			>div,
			.feeder_inspection-block {
				max-width: 500px;
			}

			>div {
				display: grid;
				/* max-width: 500px; */
				margin-inline: auto;

				>div:nth-child(1) {
					max-width: unset;
				}

				>div:nth-child(2) {
					max-width: unset;
					gap: 0.5em;

					img {
						max-width: unset;
					}
				}
			}
		}

		/* section:nth-child(even) {
			background-color: var(--wp--preset--color--base);
		} */

		>section:nth-last-of-type(1):not(.support-intro-block) {
			padding-block-end: 0;
		}

		h3.text-highlight[data-en] {
			text-align: start;
			width: 100%;

			&::before {
				font-size: clamp(0.938rem, 0.714rem + 0.6vw, 1.25rem);
			}
		}

		.feeder_inspection-block {
			justify-content: center;
		}

		section.support-intro-block {
			>div {
				>div {
					grid-template-columns: minmax(340px, 1fr);
					justify-items: center;
				}
			}
		}
	}

}

/* 受託製品事業  */
.custom-page {
	background-image: url(../img/custom-page-img01bg.webp);

	>div {
		display: grid;
		gap: 1.5em;
		@media(1024px > width) {
			justify-items: center;
		}
		@media(1024px <=width) {
			grid-template-columns: 1fr auto;
			align-items: center
		}
		
		>div {
			max-width: 35.5em;

			p {
				font-feature-settings: normal;
				margin-block-end: 2.25em;
				line-height: 1.95;
			}
		}

		img {
			display: block;
			width: clamp(21.438rem, 17.866rem + 9.52vw, 26.438rem);
			/* @media(1024px <= width) {
			padding-block-start: 1.5em;
			} */
		}
	}
}

.custom-business-block {
	h2.text-highlight[data-en] {
		margin-inline: auto;
		text-align: center;
	}

	ul {
		padding-inline-start: 1.5em;
	}

	.custom-work-block {
		figure {
			display: block;
			position: relative;
		}

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

		.page_inner_block {
			display: grid;
			gap: 2em;

			>div:nth-child(1) {

				h3 {
					margin-block-end: 1.75em;
					font-size: clamp(2rem, 1.779rem + 0.59vw, 2.25rem);

					&::before {
						line-height: 1.2;
						font-size: clamp(2rem, 1.779rem + 0.59vw, 2.25rem);
					}
				}
			}

			>div:nth-child(2) {
				display: grid;
				gap: 1.35em;
				justify-content: center;

				p {
					position: absolute;
					width: 100%;
					bottom: 0;
					left: 0;
					background-image: var(--gradient-3);
					color: var(--wp--preset--color--white);
					font-size: 0.7em;
					height: 3.5em;
					align-content: center;
					padding-inline: 1em;
					text-align: center;
					line-height: 1.2;
					text-shadow: 0 1px 1px #37373799;
					;

					&.text-long {
						text-align: start;
						letter-spacing: -0.05em;
					}
				}

				>div {
					gap: 1em;

					>div {
						position: relative;
						aspect-ratio: 1 / 1.249;
						max-width: clamp(6.25rem, 4.591rem + 8.3vw, 174px);
						height: auto;
						width: auto;
					}

					&:nth-child(2) {
						width: fit-content;
						margin-inline: auto;
					}
				}
			}
		}

	}

	h3:has(.headline-decration) {
		margin-block-end: 1.5em;
	}
	h3:has(.headline-decration)[data-en]::before {
		padding-block-end: 0.45em;
	}
	h4.decration {
		border-bottom: 1px solid var(--wp--preset--color--corporate);
		padding-block-end: 0.25em;
		margin-block: 2em 1em;
		font-size:1.25em;
	}

	.inner-grid {
		justify-content: center;
		grid-template-columns: repeat(3, minmax(clamp(150px, -8.09rem + 37.04vw, 19.688rem), 1fr));
		padding: 2em 3.25em;
		text-align: center;

		p {
			width: fit-content;
			margin-inline: auto;
		}

		>div {
			padding-block: 1.5rem 1rem;
			width: 100%;
			height: 100%
		}

		@media(768px > width) {
			grid-template-columns: repeat(2, minmax(153px, 1fr));
			padding-inline: 1em;
			font-size: 10px;

			>div {
				padding: 15px
			}
		}

		>div {
			background-color: var(--wp--preset--color--white);
		}

		background-color: var(--wp--preset--color--base);

	}
/* 受託内容 */
	.Designcontract_block {

		h3 + p:not(.num-badge-list__item) {
			font-size: 1em;
		}
		p:not(.num-badge-list__item) {
			font-size: clamp(0.5rem, 1.04vw, 15px);
		}

		.num-badge-list__item {
			font-size: clamp(0.75rem, 0.321rem + 0.89vw, 18px);
			font-weight: 700;
		}

		.inner-grid>div {
			display: grid;
			gap: 1rem;
			box-shadow: 0 4px 4px 0 rgba(116, 116, 116, 0.25);
		}
	}

	.Assembly_contract_block {
		.page_inner_block {
			>div {
				display: grid;
				grid-template-columns: 1fr auto;
				column-gap: 1em;
				margin-block-end: 1em;

				h4 {
					grid-column: 1/3;
					grid-row: 1;
					font-size: clamp(18px, 0.982rem + 0.3vw, 20px);
					margin-block: 1.75em 1.5em;
				}
				>div{
					max-width: 31.5em;
				}

				figure {
					grid-column: 2;
					grid-row: 2;
					max-width: 365px;

					img {
						display: block;
						width: 100%;
						height: auto;
						object-fit: cover;
						aspect-ratio: 1 / 0.605;
					}
				}
			}
		}

		div.in_cidental-work {
			background-color: var(--wp--preset--color--white);
			max-width: 852px;
			margin-inline: auto;
			padding-inline: 2em;
			margin-block-start: 2.5em;
			box-shadow: 0 4px 4px 0 rgba(116, 116, 116, 0.25);

			h4 {
				color: var(--wp--preset--color--white);
				background-color: var(--wp--preset--color--corporate);
				margin-block: 1em;
				text-align: center;
				padding-block: 0.25em;
			}

			.ngt-bold {
				font-size: clamp(18px, 0.982rem + 0.3vw, 20px);
			}

			>div {
				display: grid;
				grid-template-columns: repeat(4, minmax(0, 1fr));
				gap: 2em 2.5em;
				margin-block: 0.125em 1.9em;
				max-width: 100%;

				>div {
					grid-column: span 2;
					grid-template-columns: subgrid;
					display: grid;
					grid-template-rows: auto;
					gap: 1.5em;

					figure {
						grid-column: 1;
						grid-row: 1;
					}

					>div {
						grid-column: 2;
						grid-row: 1;
					}

				}
			}
		}
	}

	.AssemblyComponents_block {
		>div>div:has(img) {
			display: flex;
			max-width: 832px;
			margin-inline: auto;
			gap: 2em 3em;
			margin-block-start: 4em;
		}

		figure {
			display: block;
			width: fit-content;
		}

		img {
			display: block;
			width: 100%;
			max-width: 385px;
			aspect-ratio: 1 / 0.702;
			height: 100%;
			object-fit: cover;
		}
	}

	/*flow*/
	.custom-flow-block {
		/* background-color: #D4D7DB; */
		.page_inner_block {
			display: grid;
			grid-template-columns: auto 1fr;
			gap: 1.95em 79px;
			max-width: 64.6875rem;

			>div {
				display: grid;
				grid-column: span 2;
				grid-template-columns: subgrid;
				background-color: var(--wp--preset--color--white);
				box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
				padding-block: 1.75em;
				padding-inline: 2em;
				align-items: center;

				h3 {
					grid-column: 1;
					grid-row: 1/3;
					font-size: clamp(24px, 1.071rem + 0.89vw, 30px);
					text-align: center;
					padding-inline: 0.5em;
					border-top: 1px solid var(--wp--preset--color--corporate);
					border-bottom: 1px solid var(--wp--preset--color--corporate);
					padding-block: 0.375em;
				}

				>p {
					color: var(--wp--preset--color--sub);
					font-weight: 700;
					font-size: 20px;
					margin: 0;
				}

				>p,
				>div {
					grid-column: 2;
					align-self: start;

					p {
						margin: 0;
						font-feature-settings: normal;
					}
				}

			}
		}
	}

	.custom-equipment-block {
		h2[data-en] {
			margin-block-end: 0.85em;
		}
		h2+p {
			text-align: center;

			& + .page_inner_block {
				max-width: 850px;
				margin-block: 2.125em;

				>div{
					gap:1em 12px;
				}
			}
		}
	}
}

.custom-inner__block {
	/* background-color: yellowgreen; */
}

@media(768px > width) {
	.custom-business-block {
		.AssemblyComponents_block {
			>div>div:has(img) {
				gap: 1em;
				flex-direction: column;
			}
		}

		.Assembly_contract_block {
			.page_inner_block {
				>div {
					grid-template-columns: 1fr;
					column-gap: unset;
					max-width: 800px;
					margin-inline: auto;

					h4 {
						grid-column: unset;
						grid-row: unset;

						&+div {
							margin-block-end: 1.5em;
						}
					}

					figure {
						grid-column: unset;
						grid-row: unset;
						max-width: unset;
						width: fit-content;
						margin-inline: auto;
					}
				}

				.in_cidental-work {
					>div {
						grid-template-columns: repeat(2, 1fr);
					}
				}
			}
		}

		.custom-flow-block {
			.page_inner_block {
				grid-template-columns: 1fr;

				>div {
					grid-column: unset;
					grid-template-columns: unset;
					justify-items: center;
					gap: 1rem;

					/*display: block;*/
					h3 {
						grid-column: unset;
						grid-row: unset;
						width: 137px;
					}

					>p {
						text-align: center;
					}

					>p,
					>div {
						grid-column: unset;
						align-self: unset;
					}
				}

			}
		}

		.custom-work-block {
			.page_inner_block {
				padding-inline: 1em;
			}
		}
	}

}

@media(1024px > width) {
	.custom-business-block {
		.custom-work-block {
			.page_inner_block {
				max-width: 580px;
				margin-inline: auto;
			}
		}
	}
}

@media(1024px <=width) {
	.custom-business-block {
		.custom-work-block {
			.page_inner_block {
				display: grid;
				grid-template-columns: 1fr auto;
				align-items: center;

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

				>div:nth-child(2) {
					gap: 2em;
					max-width: 580px;
					grid-column: 1;
					grid-row: 1;
				}
			}
		}
	}
}

/* その他の製品H2 */
.check-other-devices_block {
	--inner-element-heigh: 92px;

	h2 {
		text-align: center;
		margin-block-end: 1.25em;
	}

	padding-block: var(--inner-element-height);
	background-color: var(--wp--preset--color--base);
}

/* 製品一覧用ブロック　*/
.product-list_block {
	:where(h3, .list-title) {
		font-size: 18px
	}

	h2 {
		font-size: 20px;
		background-image: var(--gradient-2);
		color: var(--wp--preset--color--white);
		padding-inline-start: 1.5em;
		margin-block-end: 1.5em;
		position: relative;
		line-height:3;

		&::before {
			content: "";
			position: absolute;
			width: 4px;
			inset: 8px 0 8px 10px;
			background-color: var(--wp--preset--color--white);
		}
		&[id]:not(:nth-of-type(1)) {
			margin-block-start: 3.125em;
		}
	}

	h3,
	h3:first-child {
		border-bottom: 2px solid var(--wp--preset--color--corporate);
		margin-block: 0.85em 1.325em;
	}

	img {
		max-width: clamp(21.75rem, 17.196rem + 12.14vw, 28.125rem);
		width: 100%;
		height: auto;
		aspect-ratio: 1 / 0.856;
		object-fit: cover;
	}

	>div {
		margin-block: 1em 2em;
		align-items: center;
		display: grid;
		grid-template-columns: 1fr;
		gap: 1.5em;
	}

	figure {
		align-self: start;

		img {
			border: 1px solid #ccc
		}
	}

	.icn-list {
		font-weight: 700;
		line-height: 1;
		background-image: url(../img/svg/icn-productitem.svg);
		background-repeat: no-repeat;
		background-position: left center;
		background-size: contain;
		padding-inline-start: 1.5em;
		margin-block-end: 0.5em;
	}

	ul {
		padding-inline-start: 1.5em;
		margin-block: 0.25em 1.35em;
	}

	.table-layout-block {
		font-size: 15px;

		table {
			border: 1px solid #d7d7d7;
			border-bottom: none;
			margin-block-start: 0.45em;
		}

		tr {
			display: grid;
			grid-template-columns: 0.4fr 1fr;
			border-bottom: 1px solid #d7d7d7;
		}

		td {
			border: none;
			display: block;

			&:nth-child(1) {
				text-align: center;
				background-color: #F3F4F8;
				border-right: 1px solid #d7d7d7;
			}

			&:nth-child(2) {
				border: none;
			}

		}
	}

}

@media(1024px > width) {
	.product-list_block {
		img {
			max-width: 100%;
		}

		>div {
			grid-template-columns: 1fr;
			max-width: 500px;
			margin-inline: auto;
		}

		.table-layout-block {
			table {
				border: none;
			}

			tr {
				display: grid;
				grid-template-columns: 1fr;
				border-bottom: none;
			}

			td {
				border: none;
				display: block;

				&:nth-child(1) {
					border: 1px solid #d7d7d7;
				}
			}
		}
	}
}

@media(1024px <=width) {
	.product-list_block {
		>div {
			grid-template-columns: auto 1fr;
			gap: 2em clamp(2em, 0.036rem + 5.24vw, 4.75em);
		}

	}
}

.boxoutline-point {
	a {
		color: var(--wp--preset--color--corporate);
	}
}

/*テーピングマシン*/
.boxoutline-point.category-nav {
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));

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

	padding-block: 2em 4.14em;
	padding-inline: 0;

	li {
		a {
			padding: 0.35em 0.25em;
			font-size: clamp(10px, 0.268rem + 0.95vw, 18px);
		}

		&::before {
			background-color: #eaebf0;
		}

		&.short-text {
			letter-spacing: -1px;
		}
	}

}

/*カスタマイズ・オーダーメイド*/
.slug-custom_built {
	.boxoutline-point.category-nav {
		grid-template-columns: repeat(4, 200px);

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

		/*
		li {
			a {
				padding: 0.75em 0.25em;
				font-size: clamp(10px, 0.268rem + 0.95vw, 18px);
			}

			&::before {
				background-color: #eaebf0;
			}

			&.short-text {
				letter-spacing: -1px;
			}
		}*/

	}
}