@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap&text=TELFAXel.0123456789');
@import url('https://fonts.googleapis.com/css2?family=Public+Sans:wght@700&display=swap&text=0123456789');
:root {
	--base-font-size: calc(14 / 16 * 1rem);
	--text-color: #000000;
	--white: #ffffff;
	--black: #000000;
	--blue-dark: #284893;
	--blue-light: #e6f0ff;
	--gold: #ffd700;
	--gold-light: #ffeba4;
	--gray-light: #f2f2f2;
	--red: #c1272d;
	--border-gray: 1px solid #cacaca;
	--border-thin: 1px;
	--border-medium: 2px;
	--nav-inline-margin: 8vw;
	--base-inline-margin: 4vw;
	--block-margin-40: calc(25 / 14 * var(--base-font-size));
	--block-margin-50: calc(25 / 14 * var(--base-font-size));
	--block-margin-60: calc(30 / 14 * var(--base-font-size));
	--block-margin-70: calc(40 / 14 * var(--base-font-size));
	--block-margin-80: calc(50 / 14 * var(--base-font-size));
	--block-margin-90: calc(55 / 14 * var(--base-font-size));
	--block-margin-100: calc(60 / 14 * var(--base-font-size));
	--global-header-height: min(calc(50 / 375 * 100vw), calc(70 / 16 * 1rem));
	--gnav-top-border-width: 0px;
	--clip-triangle-right: polygon(0 0, 100% 50%, 0 100%);
	scroll-padding-block-start: var(--global-header-height);
}
@media (768px <=width), print {
	:root {
		--base-font-size: calc(16 / 16 * 1rem);
	}
}
@media (1200px <=width), print {
	:root {
		--base-font-size: calc(16 / 16 * 1rem);
		--gnav-top-border-width: 3px;
		--global-header-height: calc(200 / 16 * 1rem * 12 / 16);
		--border-thin: 2px;
		--border-medium: 3px;
		--base-inline-margin: max(calc(calc(100% - 1200px) / 2), 4vw);
		--block-margin-40: calc(40 / 18 * var(--base-font-size));
		--block-margin-50: calc(50 / 18 * var(--base-font-size));
		--block-margin-60: calc(60 / 18 * var(--base-font-size));
		--block-margin-70: calc(70 / 18 * var(--base-font-size));
		--block-margin-80: calc(80 / 18 * var(--base-font-size));
		--block-margin-90: calc(90 / 18 * var(--base-font-size));
		--block-margin-100: calc(100 / 18 * var(--base-font-size));
	}
}
@media (1400px <=width), print {
	:root {
		--base-font-size: calc(18 / 16 * 1rem);
		--gnav-top-border-width: 4px;
		--base-inline-margin: calc((100% - 1200px) / 2);
		--global-header-height: calc(200 / 16 * 1rem * 14 / 16);
	}
}
@media (1600px <=width), print {
	:root {
		--global-header-height: calc(200 / 16 * 1rem);
	}
}
/* ============================== */
/*  BASE */
/* ============================== */
body {
	font-size: var(--base-font-size);
	line-height: 1.75;
	color: var(--text-color);
	line-break: normal;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 400;
}
::-moz-selection {
	background-color: #b3d4fc;
	color: #000000;
	text-shadow: none;
}
::selection {
	background-color: #b3d4fc;
	color: #000000;
	text-shadow: none;
}
h1, h2, h3, h4, h5, h6, dt {
	font-feature-settings: 'palt';
	font-weight: 600;
}
a {
	text-decoration: underline;
}
@media(any-hover:hover) {
	a, button {
		transition: color 200ms ease-out, background-color 200ms ease-out, opacity 200ms ease-out;
	}
}
img {
	inline-size: 100%;
}
:focus:not(:focus-visible) {
	outline: 0;
}
iframe {
	inline-size: 100%;
	block-size: auto;
}
summary::-webkit-details-marker {
	display: none;
}
[type="text"], [type="email"], [type="search"], [type="tel"], [type="url"], [type="password"], textarea {
	border: var(--border-gray);
	padding: 0.65em 0.75em;
	transition: 150ms;
	inline-size: 100%;
	font-size: max(var(--base-font-size), 16px);
}
[type="text"]:focus, [type="email"]:focus, [type="search"]:focus, [type="tel"]:focus, [type="url"]:focus, [type="password"]:focus, textarea:focus {
	outline: none;
	background-color: var(--blue-light);
}
textarea {
	field-sizing: content;
	@supports (field-sizing: content) {
		resize: none;
	}
}
/* ============================== */
/*  LAYOUT,UTILITY */
/* ============================== */
#page {
	inline-size: 100%;
}
@media (width < 768px) {
	.only-lg {
		display: none;
	}
}
@media (768px <=width), print {
	.only-sm {
		display: none;
	}
}
#go-pagetop {
	display: contents;
	& a {
		position: fixed;
		z-index: 90;
		text-indent: -9999px;
		overflow: hidden;
		inline-size: min(calc(50 / 375 * 100vw), calc(60 / 16 * 1rem));
		aspect-ratio: 1;
		transition: 300ms ease;
		inset-inline-end: calc(var(--base-inline-margin) / 2);
		inset-block-end: calc(var(--base-inline-margin) / 2);
		background-color: rgba(40, 72, 147, .6);
		display: none;
		@media (1200px <=width), print {
			inline-size: calc(60 / 18 * 1em);
			inset-inline-end: calc(40 / 18 * 1em);
			inset-block-end: calc(40 / 18 * 1em);
		}
	}
	& a::before {
		content: "";
		inline-size: 25%;
		aspect-ratio: 1;
		position: absolute;
		inset-inline-start: 37.5%;
		inset-block-start: 41%;
		display: block;
		border-block-start: 2px solid var(--white);
		border-inline-end: 2px solid var(--white);
		transform: rotate(-45deg);
	}
	@media(any-hover:hover) {
		& a:hover {
			background-color: rgba(40, 72, 147, 1);
		}
	}
}
.visually-hidden {
	clip: rect(0 0 0 0) !important;
	clip-path: inset(50%) !important;
	inline-size: 1px !important;
	block-size: 1px !important;
	overflow: hidden !important;
	position: absolute !important;
	white-space: nowrap !important;
}
/* ============================== */
/*  GLOBAL-HEADER */
/* ============================== */
.global-header {
	font-size: calc(14 / 16 * 1rem);
	position: fixed;
	z-index: 120;
	inline-size: 100%;
	inset-block-start: 0;
	inset-inline-start: 0;
	block-size: var(--global-header-height);
	background-color: var(--gray-light);
	display: grid;
	grid-template-columns: 1fr var(--global-header-height) var(--global-header-height);
	grid-template-rows: var(--global-header-height);
	gap: 1px;
	grid-template-areas:
		"id toggle";
	& + * {
		margin-block-start: var(--global-header-height);
	}
	& .header-nav {
		display: none;
	}
	& .contact-nav {
		display: none;
	}
}
@media (1200px <=width), print {
	.global-header {
		font-size: calc(12 / 16 * 1rem);
		display: grid;
		grid-template-columns: auto 1fr calc(100% / 9);
		grid-template-rows: calc(50% - var(--gnav-top-border-width) / 2) calc(50% + var(--gnav-top-border-width) / 2);
		grid-template-areas:
			"id tel-fax mail"
			"gnav gnav gnav";
		gap: 0;
		& .site-id {
			grid-area: id;
			align-self: center;
		}
		& .menu-toggle {
			display: none;
		}
		& .header-nav {
			display: contents !important;
		}
		& .global-nav {
			grid-area: gnav;
		}
		& .contact-nav {
			display: contents;
			font-size: 1em;
		}
	}
}
@media (1400px <=width), print {
	.global-header {
		& .contact-nav {
			font-size: min(14px, calc(7.3333333px + 0.33333333vw));
		}
	}
}
.site-id {
	padding-inline-start: 4vw;
	font-size: min(calc(23.5 / 710 * 100vw), 23.5px);
	line-height: 1.25;
	display: flex;
	align-items: center;
	& p {
		font-size: clamp(11px, calc(13 / 710 * 100vw), 13px);
		margin-block-start: 0.25em;
		font-feature-settings: "palt";
	}
	& a {
		text-decoration: none;
	}
}
@media (width < 360px) {
	.site-id {
		& p {
			display: none;
		}
	}
}
@media (1200px <=width), print {
	.site-id {
		inline-size: auto;
		padding-inline-start: calc(30 / 16 * 1rem);
		font-size: min(calc(26px + 16 * ((100vw - 1200px) / 800)), 42px);
		& p {
			font-size: min(calc(13px + 8 * ((100vw - 1200px) / 800)), 21px);
		}
	}
}
#menu-toggle {
	grid-area: toggle;
	--_bar-shift: min(calc(7 / 375 * 100vw), 9.8px);
	--_bar-width: 2px;
	block-size: var(--global-header-height);
	aspect-ratio: 1;
	position: fixed;
	z-index: 140;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	inset-block-start: 0;
	inset-inline-end: 0;
	background-color: var(--blue-dark);
	transition: border-color 200ms;
	&.is-clicked {
		border-color: var(--blue-dark);
	}
	& .menu-icon {
		display: block;
		inline-size: 44%;
		block-size: var(--_bar-width);
		position: absolute;
		transform-origin: center;
		transition: background-color 200ms;
		background-color: var(--white);
		position: relative;
		inset-block-start: -10%;
		&::before, &::after {
			content: '';
			inline-size: 100%;
			block-size: 100%;
			position: absolute;
			transition: rotate 200ms, inset-block-start 200ms 100ms;
			inset-inline-start: 0;
			transform-origin: center;
			background-color: var(--white);
		}
		&::before {
			inset-block-start: calc(var(--_bar-shift) * -1);
		}
		&::after {
			inset-block-start: var(--_bar-shift);
		}
		&:is(.is-clicked *) {
			background-color: transparent;
		}
		&:is(.is-clicked *)::before, &:is(.is-clicked *)::after {
			transition: rotate 200ms 100ms, inset-block-start 200ms;
			inset-block-start: 0;
		}
		&:is(.is-clicked *)::before {
			rotate: 45deg;
		}
		&:is(.is-clicked *)::after {
			rotate: -45deg;
		}
	}
	& .toggle-label {
		font-size: min(calc(9 / 375 * 100vw), calc(9 * 1.4 / 16 * 1rem));
		font-weight: 400;
		text-transform: uppercase;
		position: absolute;
		inset-block-end: 5%;
		inset-inline-start: 0;
		text-align: center;
		inline-size: 100%;
		color: var(--white);
	}
}
@media (1200px <=width), print {
	#menu-toggle {
		display: none;
	}
}
.header-contact-button {
	inline-size: var(--global-header-height);
	aspect-ratio: 1;
	& a {
		display: block;
		inline-size: 100%;
		block-size: 100%;
		background: var(--blue-dark) url("../images/ico_mail-w.svg") no-repeat center;
		background-size: 50%;
	}
}
@media (1200px <=width), print {
	.header-contact-button {
		display: none;
	}
}
@media (width < 1200px) {
	#header-nav {
		position: fixed;
		inset-block-start: var(--global-header-height);
		inset-inline-start: 0;
		inline-size: 100vw;
		block-size: calc(100vh - var(--global-header-height));
		block-size: calc(100dvb - var(--global-header-height));
		background-color: var(--white);
		overflow-y: scroll;
		overflow-x: hidden;
		& > *:last-child {
			padding-block-end: 120px;
		}
	}
}
.primary-menu li.home {
	text-transform: uppercase;
}
@media (width < 1200px) {
	.primary-menu {
		font-size: calc(15 / 16 * 1rem);
		& > li {
			& > a {
				font-feature-settings: "palt";
				display: block;
				padding: 0.75em var(--nav-inline-margin);
				background-color: var(--blue-dark);
				color: var(--white);
				text-decoration: none;
				border-block-end: 1px solid var(--white);
			}
			& > a > br {
				display: none;
			}
		}
	}
}
@media (1200px <=width), print {
	.primary-menu {
		font-size: calc(14 / 16 * 1rem);
		display: flex;
		block-size: 100%;
		line-height: calc(20 / 16);
		border-block-start: var(--gnav-top-border-width) solid var(--white);
		background-color: var(--white);
		gap: 1px;
		& > li {
			inline-size: calc(1 / 9 * 100%);
			text-align: center;
			position: relative;
			& > a {
				inline-size: 100%;
				block-size: 100%;
				display: flex;
				font-feature-settings: "palt";
				align-items: center;
				justify-content: center;
				text-decoration: none;
				color: var(--white);
				background-color: var(--blue-dark);
				padding: 0.25em;
				@media(any-hover: hover) {
					&:hover {
						color: var(--blue-dark);
						background-color: var(--gold);
					}
				}
			}
			&.home {
				display: none;
			}
		}
		& #js-focus-trap {
			display: none;
		}
	}
}
@media (1400px <=width), print {
	.primary-menu {
		font-size: 1rem;
	}
}
.contact-nav {
	font-weight: 600;
	padding: calc(25 / 14 * 1em) var(--nav-inline-margin);
	& a {
		text-decoration: none;
	}
}
@media (1200px <=width), print {
	.contact-nav {
		display: flex;
		justify-content: flex-end;
		margin-inline-start: auto;
		padding: 0;
		& #js-focus-trap {
			display: none;
		}
	}
}
.contact-nav .tel-fax {
	& .tel, & .fax {
		font-family: "Oswald", sans-serif;
		font-weight: 600;
	}
	& .tel {
		align-self: end;
		font-size: calc(29 / 14 * 1em);
		line-height: 1.3;
	}
	& .fax {
		align-self: start;
		font-size: calc(18 / 14 * 1em);
		line-height: 1.5;
	}
}
@media (768px <=width), print {
	.contact-nav .tel-fax {
		& dl {
			display: contents;
		}
		display: grid;
		grid-template-columns: auto auto 1fr;
		grid-template-areas: "label tel note"
		"label fax note";
		align-items: center;
		& .heading {
			grid-area: label;
		}
		& .tel {
			grid-area: tel;
		}
		& .fax {
			grid-area: fax;
		}
		& .note {
			grid-area: note;
		}
	}
}
@media (1200px <=width), print {
	.contact-nav .tel-fax {
		grid-area: tel-fax;
		margin-inline-start: auto;
	}
}
.contact-nav .tel-fax .heading {
	--_height: 1.75em;
	--_width: 14em;
	--_bg-color: var(--gold);
	--_border: solid #333;
	--_border-width: 1px;
	font-size: 1em;
	line-height: 1.25;
	font-feature-settings: "palt";
	letter-spacing: 0.025em;
	margin-block-end: 0.5em;
	justify-content: center;
	filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, .3));
	inline-size: var(--_width);
	block-size: var(--_height);
	display: flex;
	align-items: center;
	background-color: var(--_bg-color);
	position: relative;
	z-index: 1;
	&::after {
		content: "";
		inline-size: calc(var(--_height) / 2 * sqrt(2));
		aspect-ratio: 1;
		display: block;
		position: absolute;
		inset-block-start: 50%;
		inset-inline-end: 0;
		translate: 50% -50%;
		rotate: 45deg;
		border-inline-end: var(--_border);
		border-inline-end-width: calc(var(--_border-width) * 0.9);
		border-block-start: var(--_border);
		border-block-start-width: calc(var(--_border-width) * 0.9);
		background-color: var(--_bg-color);
		z-index: -2;
	}
	&::before {
		content: "";
		display: block;
		inline-size: 100%;
		block-size: 100%;
		position: absolute;
		inset-block-start: 0;
		inset-inline-start: 0;
		border: var(--_border);
		border-width: var(--_border-width);
		border-inline-end: 0;
		z-index: -1;
	}
	& br {
		display: none;
	}
}
@media (768px <=width), print {
	.contact-nav .tel-fax .heading {
		--_height: calc(54 / 14 * 1em);
		--_width: auto;
		justify-content: flex-start;
		padding-inline-start: 1em;
		margin-block-end: 0;
		margin-inline-end: calc(var(--_height) / 2 + 1em);
	}
}
@media (1200px <=width <=1400px) {
	.contact-nav .tel-fax .heading br {
		display: block;
	}
}
.contact-nav .tel-fax .note {
	font-size: calc(13 / 14 * 1em);
	display: flex;
	flex-direction: column;
	line-height: calc(18 / 14);
	gap: 0.75em;
	margin-block-start: 1em;
	&::before {
		content: "";
		inline-size: 4em;
		block-size: 1px;
		background-color: var(--text-color);
		display: block;
		opacity: 0.7;
	}
}
@media (768px <=width), print {
	.contact-nav .tel-fax .note {
		align-items: center;
		flex-direction: row;
		gap: 0.75em;
		align-content: center;
		margin: 0 0 0 1.25em;
		&::before {
			inline-size: 1px;
			block-size: 3lh;
		}
	}
}
@media (1200px <=width), print {
	.contact-nav .tel-fax .note {
		font-size: 1em;
		padding-inline-end: 1.25em;
	}
}
.contact-nav .mail {
	font-size: 1em;
	margin-block-start: 1.5em;
	font-feature-settings: "palt";
	letter-spacing: 0.025em;
	& a {
		display: flex;
		background-color: var(--gold);
		align-items: center;
		justify-content: center;
		line-height: calc(18 / 14);
		padding: 0.75em 0.5em;
		gap: 0.75em;
		block-size: 100%;
		color: var(--blue-dark);
		& br:first-child {
			display: none;
		}
		&::before {
			content: "";
			inline-size: 1.75em;
			background: url("../images/ico_calc.svg") no-repeat center;
			aspect-ratio: 38/52;
		}
		@media(any-hover: hover) {
			&:hover {
				background-color: color-mix(in srgb, var(--gold), black 10%);
			}
		}
	}
}
@media (768px <=width), print {
	.contact-nav .mail {
		& a::before {
			inline-size: 2.71428571em;
		}
	}
}
@media (1200px <=width), print {
	.contact-nav .mail {
		margin-block-start: 0;
	}
}
@media (1200px <=width <=1400px) {
	.contact-nav .mail a br:first-child {
		display: block;
	}
}
.js-invalid {
	color: inherit;
	text-decoration: none !important;
	cursor: default;
}
/* ============================== */
/*  CONTACT-BAR */
/* ============================== */
.contact-bar {
	padding: 0 var(--base-inline-margin) var(--block-margin-100);
	margin: var(--block-margin-100) auto 0;
	max-width: 460px;
	&.contact-bar--compact {
		padding: 0 0 var(--block-margin-50);
		margin-block-start: 0;
	}
	& .inner {
		border: 3px solid var(--blue-dark);
	}
	& .inner > * + * {
		border-block-start: 1px solid var(--blue-dark);
	}
	&:is(.top-page *) {
		padding-block: calc(45 / 18 * 1em);
		margin-block: 0;
	}
	& .heading {
		font-size: calc(21 / 18 * 1em);
		line-height: 1.5;
		background-color: var(--blue-dark);
		color: var(--white);
		padding: 0.75em 0.5em;
		text-align: center;
		display: flex;
		justify-content: center;
		align-items: center;
		& b {
			display: inline;
			display: contents;
			color: #ffda3b;
			font-weight: inherit;
		}
	}
}
@media (768px <=width), print {
	.contact-bar {
		max-width: none;
		& .inner {
			border-width: 4px;
			display: flex;
		}
		& .inner > * {
			inline-size: 50%;
		}
		& .inner > * + * {
			border-block-start: none;
			border-inline-start: 1px solid var(--blue-dark);
		}
	}
}
.contact-bar .tel {
	font-size: min(9.2vw, 36px);
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	flex-direction: column;
	padding: 0.35em 0.25em;
	line-height: 1.1;
	& p.tel-num {
		font-family: "Oswald", sans-serif;
		font-weight: 600;
		letter-spacing: 0.07em;
		color: var(--blue-dark);
		border-block-end: 0.08em solid;
		a {
			color: inherit;
			text-decoration: none;
		}
		& span {
			letter-spacing: 0;
			padding-inline-end: 0.07em;
		}
	}
	& p.note {
		font-size: min(3.5vw, 13px);
		font-weight: 600;
		margin-block-start: 0.5em;
	}
}
@media (1200px <=width), print {
	.contact-bar .tel {
		font-size: calc(52 / 16 * 1rem);
		& p.note {
			font-size: calc(19 / 16 * 1rem);
		}
	}
}
.contact-bar .mail {
	& a {
		font-size: min(4.7vw, 17px);
		font-feature-settings: "palt";
		line-height: 1.25;
		font-weight: 600;
		background-color: var(--gold-light);
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		block-size: 100%;
		padding: 1.25em 0.5em;
		color: var(--blue-dark);
		text-decoration: none;
		&::before {
			content: "";
			inline-size: calc(74 / 24 * 1em);
			aspect-ratio: 74 / 58;
			margin-inline-end: 1em;
			background: url("../images/ico_mail.svg") no-repeat center;
		}
		@media(any-hover: hover) {
			&:hover {
				background-color: color-mix(in srgb, var(--gold-light), black 10%);
				background-color: var(--gold);
			}
		}
	}
}
@media (1200px <=width), print {
	.contact-bar .mail {
		& a {
			font-size: calc(24 / 16 * 1rem);
			&::before {
				margin-inline-end: 1.25em;
			}
		}
	}
}
.contact-bar.contact-bar--compact {
	padding: 0 0 var(--block-margin-50);
	margin: 0 auto 0;
	& .inner > * + * {
		border: none;
	}
}
.contact-bar.contact-bar--compact .heading {
	font-size: min(4.2666666vw, 17px);
	line-height: 1.5;
	padding: 0.5em 0.5em;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
}
@media (1200px <=width), print {
	.contact-bar.contact-bar--compact .heading {
		font-size: calc(21 / 18 * 1em);
		& br {
			display: none;
		}
	}
}
@media (1200px <=width), print {
	.contact-bar.contact-bar--compact .tel {
		font-size: calc(39 / 16 * 1rem);
		& p.note {
			font-size: calc(14.25 / 16 * 1rem);
		}
	}
}
/* ============================== */
/*  FOOTER */
/* ============================== */
.footer-main {
	background-color: var(--gray-light);
	padding: calc(33 / 16 * 1rem) var(--base-inline-margin) calc(33 / 16 * 1rem);
	display: grid;
	grid-template-columns: 1fr;
	grid-template-areas:
		"flink"
		"sitename"
		"address";
	& .site-name {
		grid-area: sitename;
	}
	& .footer-info {
		grid-area: address;
	}
	& .footer-link {
		grid-area: flink;
	}
}
@media (1200px <=width), print {
	.footer-main {
		grid-template-columns: auto 1fr;
		grid-template-areas:
			"sitename flink"
			"address flink";
		& .footer-link {
			display: grid;
			align-content: start;
			justify-content: end;
		}
	}
}
.page-list li.home {
	text-transform: uppercase;
}
.footer-link .page-list {
	font-size: calc(14 / 16 * 1rem);
	font-feature-settings: "palt";
	letter-spacing: 0.05em;
	max-width: 46em;
	line-height: 1.5;
	display: flex;
	flex-direction: column;
	gap: 1.4em;
	& li {
		position: relative;
		padding-inline-start: 0.75em;
	}
	& li:before {
		content: "";
		inline-size: 0.4em;
		aspect-ratio: 1 / 1.4;
		clip-path: var(--clip-triangle-right);
		background-color: currentColor;
		position: absolute;
		inset-block-start: 0.52em;
		inset-inline-start: 0;
		transition: right 200ms;
	}
	& a {
		text-decoration: none;
		@media(any-hover: hover) {
			&:hover {
				text-decoration: underline;
			}
		}
	}
}
@media (640px <=width), print {
	.footer-link .page-list {
		display: grid;
		grid-template-columns: auto auto auto;
		grid-auto-rows: auto;
		grid-template-areas:
			"a1 a2 a7"
			"a1 a3 a8"
			"a1 a4 a9"
			"a1 a5 a10"
			"a1 a6 a11";
		gap: 1.4em 3em;
		& li {
			&:first-child {
				grid-area: a1;
			}
			&:nth-child(2) {
				grid-area: a2;
			}
			&:nth-child(3) {
				grid-area: a3;
			}
			&:nth-child(4) {
				grid-area: a4;
			}
			&:nth-child(5) {
				grid-area: a5;
			}
			&:nth-child(6) {
				grid-area: a6;
			}
			&:nth-child(7) {
				grid-area: a7;
			}
			&:nth-child(8) {
				grid-area: a8;
			}
			&:nth-child(9) {
				grid-area: a9;
			}
			&:nth-child(10) {
				grid-area: a10;
			}
			&:nth-child(11) {
				grid-area: a11;
			}
		}
	}
}
@media (640px <=width), print {
	.footer-link .page-list {}
}
.footer-site-name {
	line-height: 1;
	margin-block-start: calc(45 / 18 * 1em);
	margin-block-end: calc(35 / 18 * 1em);
	& h1 {
		font-size: min(4.266666666vw, 21px);
	}
	& p {
		font-size: min(3.2vw, 14px);
		margin-block-start: 0.6em;
	}
	& a {
		text-decoration: none;
		color: inherit;
	}
}
@media (1200px <=width), print {
	.footer-site-name {
		margin-block-start: 0;
	}
}
.footer-info address {
	font-size: min(3.73333332vw, 14px);
	line-height: calc(18 / 14);
	margin-block-start: auto;
	display: flex;
	flex-direction: column;
	gap: calc(12 / 14 * 1em);
	& .company {
		display: grid;
		inline-size: 100%;
		max-width: 290px;
		grid-template-columns: calc(256 / 376 * 100%) calc(98 / 376 * 100%);
		gap: calc(22 / 376 * 100%);
		align-items: center;
	}
}
@media (768px <=width), print {
	.footer-info address .company {
		max-width: 376px;
	}
}
footer .copyright {
	text-align: center;
	font-size: max(calc(12 / 18 * 1em), 10px);
	background-color: var(--blue-dark);
	line-height: 1.25;
	padding: 1.45833333em var(--base-inline-margin);
	color: var(--white);
}
/* ============================== */
/*  REPEATABLE */
/* ============================== */
.main-section {
	padding: calc(var(--block-margin-100) * 0.95) var(--base-inline-margin) 0;
	margin-block-end: var(--block-margin-100);
}
.sub-section {
	margin-block-start: var(--block-margin-100);
	&:is(.section-lead-copy + *) {
		margin-block-start: var(--block-margin-40);
	}
}
.section-heading {
	font-size: min(calc(19px + 17 * ((100vw - 360px) / 1040)), 36px);
	line-height: 1.25;
	color: var(--blue-dark);
	text-align: center;
	inline-size: fit-content;
	padding: calc(calc(38 - 19 * 1.25) / 2 / 19 * 1em) 1.75em;
	border: var(--border-thin) solid;
	border-radius: calc(infinity * 1px);
	margin: 0 auto 1.75em;
	&:has(+ .section-lead-copy), &:has(+ .sub-title) {
		margin-block-end: var(--block-margin-40);
	}
	&:is(section.product-detail *) {
		font-size: calc(18 / 14 * 1em);
	}
}
@media (1200px <=width), print {
	.section-heading {
		font-size: calc(36 / 18 * 1em);
		padding: calc(calc(98 - 36 * 1.25) / 2 / 36 * 1em) 2.25em;
		margin-block-end: calc(70 / 36 * 1em);
		&:is(section.product-detail *) {
			font-size: calc(36 / 14 * 1em);
		}
	}
}
.section-heading--reason {
	margin-block-end: 1.25em;
	border: none;
	padding: 0;
	line-height: 1.15;
	& span {
		display: block;
		position: relative;
		&::after {
			content: "";
			display: block;
			position: absolute;
			inset-block-start: 1.15em;
			inset-inline-start: 50%;
			translate: -50% 0;
			inline-size: calc(500 / 36 * 1em);
			block-size: calc(87 / 36 * 1em);
			border: var(--border-thin) solid;
			border-radius: calc(infinity * 1px);
		}
	}
	& b {
		font-size: calc(151 / 36 * 1em);
		font-family: "Public Sans", sans-serif;
		font-weight: 700;
		vertical-align: middle;
		position: relative;
		inset-block-start: -.02em;
		letter-spacing: 0.07em;
		padding-inline-end: 0.07em;
	}
}
.section-lead-copy {
	font-size: 1em;
	margin-block: var(--block-margin-50);
}
.section-lead-copy.large {
	font-size: calc(16 / 14 * 1em);
	line-height: 1.5;
	font-weight: 600;
	margin-block: var(--block-margin-50) 0;
}
@media (768px <=width), print {
	.section-lead-copy.large {
		font-size: calc(21 / 18 * 1em);
	}
}
@media (1200px <=width), print {
	.section-lead-copy.large {
		font-size: calc(32 / 18 * 1em);
	}
}
.sub-heading {
	font-size: calc(18 / 14 * 1em);
	line-height: 1.25;
	font-weight: 600;
	padding: 0.41666667em 1em;
	color: var(--white);
	background-color: var(--blue-dark);
	margin-block-end: var(--block-margin-40);
}
@media (768px <=width), print {
	.sub-heading {
		font-size: calc(21 / 15 * 1em);
	}
}
@media (1200px <=width), print {
	.sub-heading {
		font-size: calc(36 / 18 * 1em);
	}
}
.sub-title {
	font-size: calc(18 / 14 * 1em);
	line-height: 1.25;
	font-weight: 600;
	padding: 0.41666667em 1em;
	color: var(--blue-dark);
	margin-block-end: var(--block-margin-40);
	text-align: center;
}
@media (768px <=width), print {
	.sub-title {
		font-size: calc(21 / 15 * 1em);
	}
}
@media (1200px <=width), print {
	.sub-title {
		font-size: calc(36 / 18 * 1em);
	}
}
/* ============================== */
/*  TOPPAGE */
/* ============================== */
.hero {
	& #hero-slider {
		aspect-ratio: 663 / 1000;
	}
	& .slick-track, & .slick-list {
		block-size: 100%;
		& img, & picture {
			object-fit: cover;
			inline-size: 100%;
			block-size: 100%;
		}
	}
	& .slick-dotted.slick-slider {
		margin-block-end: 0;
	}
	& .slick-dots {
		inset-block-end: 1.5vw;
	}
	& .slick-dots li button::before {
		font-size: 11px;
		color: var(--white);
	}
	& .slick-dots li.slick-active button:before {
		color: var(--white);
		opacity: 0.75;
	}
}
@media (768px <=width), print {
	.hero {
		& #hero-slider {
			aspect-ratio: auto;
		}
		& .slick-track {
			block-size: auto;
			& img, & picture {
				object-fit: fill;
				block-size: auto;
			}
		}
		& .slick-dots {
			inset-block-end: 0.6vw;
		}
	}
}
.slick-dots {
	position: absolute;
	inset-block-end: -25px;
	list-style: none;
	display: block;
	text-align: center;
	padding: 0;
	margin: 0;
	inline-size: 100%;
}
.slick-dots li {
	position: relative;
	display: inline-block;
	block-size: 20px;
	inline-size: 20px;
	margin: 0 5px;
	padding: 0;
	cursor: pointer;
}
.slick-dots li button {
	border: 0;
	background: transparent;
	display: block;
	block-size: 20px;
	inline-size: 20px;
	outline: none;
	line-height: 0px;
	font-size: 0px;
	color: transparent;
	padding: 5px;
	cursor: pointer;
}
.slick-dots li button:hover, .slick-dots li button:focus {
	outline: none;
}
.slick-dots li button:hover:before, .slick-dots li button:focus:before {
	opacity: 1;
}
.slick-dots li button:before {
	position: absolute;
	inset-block-start: 0;
	inset-inline-start: 0;
	content: "•";
	inline-size: 20px;
	block-size: 20px;
	font-family: "slick";
	font-size: 6px;
	line-height: 20px;
	text-align: center;
	color: black;
	opacity: 0.25;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before {
	color: black;
	opacity: 0.75;
}
.top-page .chapter-section {
	padding-inline: var(--base-inline-margin);
}
.top-introduction {
	font-size: 1em;
	background: var(--gold) url("../images/bg_logo.svg") no-repeat top 2.5em center;
	background-size: 80%;
	line-height: 1.75;
	padding: 3.5em var(--base-inline-margin) 3em;
	margin: 0;
	& .top-introduction-title {
		font-size: min(calc(21px + 27 * ((100vw - 360px) / 1040)), 48px);
		line-height: 1.25;
		text-align: center;
		margin-block-end: 0.65em;
	}
	& .top-introduction-copy {
		text-align: justify;
		margin: 0 auto;
		font-feature-settings: "palt";
		letter-spacing: 0.05em;
	}
}
@media (768px <=width), print {
	.top-introduction {
		background-position: top 19% center;
		padding: 4.5em var(--base-inline-margin) 3em;
	}
}
@media (1200px <=width), print {
	.top-introduction {
		background-size: 1000px;
		& .top-introduction-title {
			font-size: calc(48 / 18 * 1em);
		}
	}
}
section.top-solution {
	margin-block-start: 0;
	padding-block-start: 75px;
}
@media (1200px <=width), print {
	section.top-solution {
		padding-inline: 0;
	}
}
.section-heading--top-solution {
	font-size: calc(24 / 14 * 1em);
	line-height: 1.25;
	text-align: center;
	margin-block-end: 0.83333333em;
	& b {
		color: var(--blue-dark);
		font-weight: inherit;
	}
}
@media (1200px <=width), print {
	.section-heading--top-solution {
		font-size: calc(48 / 18 * 1em);
	}
}
.top-solution-list {
	font-size: 1em;
	line-height: 1.75;
	display: flex;
	flex-direction: column;
	gap: calc(28 / 18 * 1em);
	& .top-solution-listitem {
		--_text-inline-padding: 4vw;
		background-color: var(--gray-light);
		display: grid;
		grid-template-columns: 1fr;
		grid-auto-rows: auto;
		grid-template-areas:
			"heading"
			"image"
			"body";
		& h3 {
			grid-area: heading;
			font-size: calc(20 / 14 * 1em);
			line-height: 1.25;
			padding: 0.55em var(--_text-inline-padding);
			background-color: var(--blue-dark);
			color: var(--gold);
		}
		& .image {
			grid-area: image;
			flex: 0 0 auto;
			& img {
				border: 10px solid var(--blue-dark);
				border-block-start: none;
			}
		}
		& .body-text {
			padding: 0.75em var(--_text-inline-padding) 1.25em;
			font-weight: 400;
			text-align: justify;
		}
	}
}
@media (768px <=width), print {
	.top-solution-list {
		& .top-solution-listitem {
			--_text-inline-padding: calc(24 / 15 * 1em);
			display: grid;
			align-content: start;
			grid-template-rows: auto 1fr;
			&:nth-child(odd) {
				grid-template-columns: 45% 55%;
				grid-template-areas:
					"image heading"
					"image body";
			}
			&:nth-child(even) {
				grid-template-columns: 55% 45%;
				grid-template-areas:
					"heading image"
					"body image";
			}
			& h3 {
				font-size: calc(22 / 15 * 1em);
				padding-inline-start: calc(var(--_text-inline-padding) * 15 / 22);
			}
			& .image {
				& img {
					border: calc(15 / 15 * 1em) solid var(--blue-dark);
				}
			}
		}
	}
}
@media (1200px <=width), print {
	.top-solution-list {
		& .top-solution-listitem {
			--_text-inline-padding: calc(48 / 18 * 1em);
			&:nth-child(odd) {
				grid-template-columns: calc(500 / 1350 * 100%) calc(850 / 1350 * 100%);
				margin-right: 30px;
				margin-left: -20px;
			}
			&:nth-child(even) {
				grid-template-columns: calc(850 / 1350 * 100%) calc(500 / 1350 * 100%);
				margin-left: 30px;
				margin-right: -20px;
			}
			& h3 {
				font-size: calc(38 / 18 * 1em);
				padding-inline-start: calc(var(--_text-inline-padding) * 18 / 38);
			}
			& .image {
				& img {
					border-width: calc(25 / 18 * 1em);
				}
			}
		}
	}
}
@media (1400px <=width), print {
	.top-solution-list {
		& .top-solution-listitem {
			max-width: 1350px;
			&:nth-child(odd) {
				margin-left: calc(calc(100vw - 1200px) / 2 * -0.5);
				margin-right: 0;
			}
			&:nth-child(even) {
				margin-right: calc(calc(100vw - 1200px) / 2 * -0.5);
				margin-left: 0;
			}
		}
	}
}
.top-solution-listitem .show-detail {
	margin-block-start: 1.75em;
	& a {
		color: var(--blue-dark);
		&::before {
			content: "⇒";
			letter-spacing: 0.25em;
		}
	}
}
.top-reason {
	margin-block: var(--block-margin-70) 0;
	background-color: var(--blue-light);
	padding: var(--block-margin-50) var(--base-inline-margin) var(--block-margin-70);
}
.section-heading--top-reason {
	font-size: calc(24 / 18 * 1em);
	line-height: 1.25;
	margin: 0 0 0.25em;
	text-align: center;
	color: var(--blue-dark);
	& b {
		font-size: calc(100 / 24 * 1em);
		font-family: "Public Sans", sans-serif;
		font-weight: 700;
		vertical-align: middle;
		position: relative;
		inset-block-start: -.02em;
		letter-spacing: 0.07em;
		padding-inline-end: 0.07em;
	}
}
@media (768px <=width), print {
	.section-heading--top-reason {
		font-size: calc(38 / 18 * 1em);
	}
}
.top-reason-list {
	font-size: 1em;
	--_item-gap: calc(20 / 18 * 1em);
	& li {
		font-weight: 600;
		text-align: justify;
		margin: 0 0 var(--_item-gap) 0;
		line-height: 1.6;
		background-color: var(--white);
	}
	& br {
		display: none;
	}
	& .num {
		content: counter(cnt);
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 200%;
		line-height: 1;
		font-family: "Oswald", sans-serif;
		font-weight: 400;
		min-width: 2.22222222em;
		block-size: 2.22222222em;
		background-color: var(--blue-dark);
		color: var(--white);
		margin-inline-end: 0.5em;
	}
	& a {
		display: flex;
		align-items: center;
		text-decoration: none;
		padding-inline-end: 1em;
		@media(any-hover: hover) {
			&:hover {
				background-color: var(--gold-light);
			}
		}
	}
}
@media (768px <=width), print {
	.top-reason-list {
		column-count: 2;
		column-gap: var(--_item-gap);
		& li {
			break-inside: avoid;
		}
	}
}
@media (1200px <=width), print {
	.top-reason-list {
		& li br {
			display: block;
		}
	}
}
.top-reason .show-detail {
	font-size: min(calc(15px + 9 * ((100vw - 360px) / 1040)), 24px);
	text-align: center;
	margin-block-start: calc(var(--block-margin-70) * 65 / 70);
	font-weight: 600;
	font-feature-settings: "pkna";
	& a {
		line-height: 1.5;
		padding: 0.5em 3.25em 0.5em 2.25em;
		border: 4px solid var(--blue-dark);
		background-color: var(--gold-light);
		color: var(--blue-dark);
		text-decoration: none;
		position: relative;
		display: block;
		width: fit-content;
		margin-inline: auto;
		&::after {
			content: "";
			inline-size: 0.6em;
			aspect-ratio: 1 / 1.4;
			clip-path: var(--clip-triangle-right);
			background-color: currentColor;
			position: absolute;
			inset-block-start: 50%;
			inset-inline-end: 2.5em;
			translate: 0 -50%;
			transition: right 200ms;
		}
		@media(any-hover: hover) {
			&:hover {
				background-color: var(--gold);
				&::after {
					inset-inline-end: 2.25em;
				}
			}
		}
	}
}
@media (768px <=width), print {
	.top-reason .show-detail {
		font-size: calc(24 / 18 * 1em);
	}
}
/* ============================== */
/*  安心・安全に海外調達が可能な11の理由 */
/* ============================== */
.reason-nav-list {
	font-size: calc(21 / 18 * 1em);
	line-height: 1.33333333;
	text-align: center;
	font-feature-settings: "palt";
	font-weight: 600;
	display: grid;
	grid-template-columns: 1fr;
	grid-auto-rows: auto;
	gap: calc(20 / 21 * 1em);
	margin-block-end: var(--block-margin-70);
	& > li {
		& a {
			background-color: #e6e6e6;
			color: var(--blue-dark);
			padding: 0.5em 1em;
			display: flex;
			position: relative;
			justify-content: center;
			align-items: center;
			min-height: calc(90 / 21 * 1em);
			text-decoration: none;
			& .num {
				font-size: 0.9em;
				min-width: calc(1 / 0.7 * 1em);
				block-size: calc(1 / 0.7 * 1em);
				line-height: calc(1 / 0.7 * 1em);
				background-color: var(--blue-dark);
				color: #e6e6e6;
				position: absolute;
				inset-block-start: 0;
				inset-inline-start: 0;
				letter-spacing: -0.07em;
				padding: 0 0.1em;
			}
			@media(any-hover:hover) {
				&:hover {
					background-color: var(--blue-light);
					background-color: #c3dcf3;
					& .num {
						color: #c3dcf3;
					}
				}
			}
		}
	}
}
@media (768px <=width), print {
	.reason-nav-list {
		grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr));
		& > li a {
			min-height: calc(150 / 21 * 1em);
			& .num {
				font-size: 0.7em;
			}
		}
	}
}
.reason-item {
	margin-block-start: var(--block-margin-70);
	padding-block-start: calc(20 / 14 * 1em);
	& .body-copy {
		text-align: justify;
	}
}
@media (768px <=width), print {
	.reason-item {
		margin-block-start: var(--block-margin-70);
		padding-block-start: calc(30 / 18 * 1em);
	}
}
.section-heading--reason-item {
	font-size: min(calc(17px + 25 * ((100vw - 360px) / 1040)), 42px);
	min-height: calc(120 / 42 * 1em);
	line-height: calc(57 / 42);
	font-weight: 600;
	position: relative;
	padding-block: calc(calc(120 - 57 * 2) / 42 * 1em);
	padding-inline-start: 2em;
	display: flex;
	align-items: center;
	border-block-end: var(--border-thin) solid var(--blue-dark);
	margin-block-end: 0.5em;
	& .num {
		inline-size: calc(60 / 42 * 1em);
		font-family: "Oswald", sans-serif;
		font-weight: 400;
		block-size: 100%;
		text-align: center;
		background-color: var(--blue-dark);
		color: var(--white);
		position: absolute;
		inset-block-start: 0;
		inset-inline-start: 0;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	& br {
		display: none;
	}
}
@media (768px <=width), print {
	.section-heading--reason-item {
		& br {
			display: block;
		}
	}
}
@media (1200px <=width), print {
	.section-heading--reason-item {
		font-size: calc(42 / 18 * 1em);
		& br {
			display: block;
		}
	}
}
.reason-image-group {
	display: flex;
	margin-block-start: var(--block-margin-60);
	justify-content: space-between;
	gap: calc(40 / 1200 * 100%);
	&.bg {
		background: #e6e6e6;
		padding: 4vw;
		justify-content: center;
	}
	& .image.frame img {
		border: 1px solid #b3b3b3;
	}
	& .photo-caption {
		font-size: 0.8em;
		line-height: 1.25;
		margin-block-start: 0.5em;
		text-align: center;
	}
}
@media (768px <=width), print {
	.reason-image-group {
		&.bg {
			padding: calc(50 / 18 * 1em);
		}
		& .photo-caption {
			font-size: 1em;
		}
	}
}
#reason1 .reason-image-group {
	& .image:first-child {
		inline-size: calc(800 / 1200 * 100%);
	}
	& .image:nth-child(2) {
		inline-size: calc(360 / 1200 * 100%);
	}
}
#reason2 .reason-image-group {
	gap: calc(150 / 1100 * 100%);
	& .image:first-child {
		inline-size: calc(359 / 1100 * 100%);
	}
	& .image:nth-child(2) {
		inline-size: calc(359 / 1100 * 100%);
	}
}
#reason5 .reason-image-group {
	gap: calc(50 / 1100 * 100%);
	& .image:first-child {
		inline-size: calc(633 / 1100 * 100%);
	}
	& .image:nth-child(2) {
		inline-size: calc(317 / 1100 * 100%);
	}
}
#reason6 .reason-image-group {
	gap: calc(10 / 1136 * 100%);
	padding-inline: calc(32 / 1200 * 100%);
	& .image {
		inline-size: calc(372 / 1136 * 100%);
	}
}
/* ============================== */
/*  装置部品一式調達サービス */
/* ============================== */
.problem-list, .solution-list {
	& dt {
		font-size: calc(18 / 14 * 1em);
		line-height: calc(58 / 48);
		display: flex;
		align-items: center;
		color: var(--blue-dark);
		margin-block-end: 0.35em;
		padding-block-start: 0.2em;
		padding-block-end: calc(10 / 48 * 1em);
		border-block-end: 2px solid var(--blue-dark);
		&::before {
			content: "";
			display: block;
			background-repeat: no-repeat;
			background-position: center;
			background-size: 100%;
			margin-inline-end: 0.25em;
			margin-block-start: -0.2em;
		}
		&:not(:first-child) {
			margin-block-start: var(--block-margin-50);
		}
	}
	& dd {
		font-size: 1em;
		text-align: justify;
	}
}
.problem-list {
	background: url("../images/arr_problem-s.svg") no-repeat left calc(10 / 1200 * 100%) center;
	background-size: auto 100%;
	padding-inline-start: calc(50px + 2.54452926vw);
	& dt::before {
		background-image: url("../images/ill_serv1.png");
		aspect-ratio: 230 / 285;
		inline-size: calc(115 / 48 * 1em);
	}
}
.solution-list {
	& dt {
		font-size: calc(22 / 14 * 1em);
	}
	& dt::before {
		background-image: url("../images/ill_serv2.png");
		aspect-ratio: 408 / 371;
		inline-size: calc(204 / 60 * 1em);
	}
	& dd {
		font-size: calc(15 / 14 * 1em);
	}
}
@media (768px <=width), print {
	.problem-list, .solution-list {
		& dt {
			font-size: calc(28 / 15 * 1em);
		}
	}
	.problem-list {
		background: url("../images/arr_problem.svg") no-repeat left calc(56 / 1200 * 100%) center;
		background-size: auto 100%;
		padding-inline-start: calc(246 / 1200 * 100%);
	}
	.solution-list {
		& dt {
			font-size: calc(36 / 15 * 1em);
		}
		& dd {
			font-size: calc(16.5 / 15 * 1em);
		}
	}
}
@media (1200px <=width), print {
	.problem-list, .solution-list {
		& dt {
			font-size: calc(48 / 18 * 1em);
		}
		& dd {
			font-size: calc(21 / 18 * 1em);
		}
	}
	.problem-list {
		background: url("../images/arr_problem.svg") no-repeat left calc(56 / 1200 * 100%) center;
		background-size: auto 100%;
		padding-inline-start: calc(246 / 1200 * 100%);
	}
	.solution-list {
		& dt {
			font-size: calc(60 / 18 * 1em);
		}
		& dd {
			font-size: calc(21 / 18 * 1em);
		}
	}
}
.section-foot-text {
	font-size: calc(16 / 14 * 1em);
	line-height: calc(48 / 36);
	text-align: center;
	color: var(--blue-dark);
	border: 3px solid;
	background: #f3e196;
	font-weight: 600;
	padding: 1.38888889em 1em;
	margin-block-start: var(--block-margin-50);
}
@media (1200px <=width), print {
	.section-foot-text {
		font-size: 2em;
	}
}
.body-copy--large {
	font-size: calc(16 / 14 * 1em);
	margin-block: 0 1em;
}
@media (1200px <=width), print {
	.body-copy--large {
		font-size: 2em;
	}
}
.service-list {
	font-size: 1em;
	line-height: 1.25;
	text-align: center;
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-auto-rows: auto;
	gap: 1em;
	& > li {
		border: 1px solid var(--blue-dark);
		padding: calc(19 / 21 * 1em) 1em calc(26 / 21 * 1em);
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: calc(12 / 21 * 1em);
	}
	& .icon {
		inline-size: calc(110 / 21 * 1em);
		display: block;
	}
	& .label {
		display: block;
	}
}
@media (768px <=width), print {
	.service-list {
		grid-template-columns: 1fr 1fr 1fr;
	}
}
@media (1200px <=width), print {
	.service-list {
		font-size: calc(21 / 18 * 1em);
		gap: calc(40 / 21 * 1em);
	}
}
/* ============================== */
/*  加工事例 */
/* ============================== */
.category-nav {
	--_bg-color: #a0a0a0;
	font-size: calc(15 / 14 * 1em);
	line-height: 1.25;
	margin-block-end: var(--block-margin-70);
	& menu {
		display: flex;
		flex-wrap: wrap;
		color: var(--white);
		gap: var(--border-thin);
		& li {
			inline-size: 100%;
		}
		& li a {
			color: inherit;
			font-weight: 600;
			text-decoration: none;
			padding: 0.58928571em 1.5em;
			background-color: var(--_bg-color);
			display: block;
			&.selected {
				background-color: var(--blue-dark);
			}
			@media(any-hover: hover) {
				&:not(.selected):hover {
					background-color: color-mix(in srgb, var(--_bg-color), black 30%);
				}
			}
		}
	}
}
@media (576px <=width), print {
	.category-nav {
		& menu li {
			inline-size: calc(calc(100% - var(--border-thin) * 1) / 2);
		}
	}
}
@media (768px <=width), print {
	.category-nav {
		& menu li {
			inline-size: calc(calc(100% - var(--border-thin) * 2) / 3);
		}
	}
}
@media (1200px <=width), print {
	.category-nav {
		font-size: calc(28 / 18 * 1em);
	}
}
.category-heading {
	font-size: calc(19 / 18 * 1em);
	line-height: 1.25;
	padding: 0.19736842em 1.25em 0.39473684em;
	color: var(--white);
	background-color: var(--blue-dark);
	margin-block-end: var(--block-margin-60);
}
.product-list {
	font-size: calc(14 / 16 * 1rem);
	line-height: 1.5;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(275px, 100%), 1fr));
	grid-auto-rows: auto;
	gap: var(--block-margin-50) calc(33 / 1200 * 100%);
	& li a {
		color: inherit;
		text-decoration: none;
		@media(any-hover: hover) {
			&:hover {
				opacity: 0.7;
			}
		}
	}
}
.product-name {
	padding: 0.39285714em 1em;
	border: var(--border-gray);
	&:has(+ .spec-table) {
		border-block-end: none;
	}
}
.spec-table {
	inline-size: 100%;
	& td, & th {
		border: var(--border-gray);
		padding: 0.39285714em 0.5em;
	}
	& th {
		padding-inline: 1em;
		background-color: var(--gold-light);
		inline-size: calc(5em + 1px);
		font-weight: 400;
		text-align: justify;
		text-align-last: justify;
	}
}
/* ============================== */
/*  加工事例-詳細 */
/* ============================== */
section.product-detail .sub-heading {
	border-block-end: 2px solid #cacaca;
	background-color: transparent;
	padding: 0.2em 0;
	margin-block-end: var(--block-margin-70);
	color: inherit;
}
.product-info {
	display: flex;
	flex-direction: column;
	gap: var(--block-margin-40);
}
@media (768px <=width), print {
	.product-info {
		flex-direction: row;
		justify-content: space-between;
		gap: calc(40 / 1200 * 100%);
		& .product-image {
			inline-size: calc(580 / 1200 * 100%);
		}
		& .product-data {
			inline-size: calc(580 / 1200 * 100%);
		}
	}
}
.main-image {
	position: relative; /*2で追加する*/
	& img {
		position: absolute;
		inset-block-start: 0px;
		inset-inline-start: 0px;
		inline-size: 100%;
	}
	& img:first-child {
		position: static;
	}
}
.thumbnail-list {
	margin-block-start: var(--block-margin-40);
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-auto-rows: auto;
	gap: 10px;
	@media(any-hover: hover) {
		& a:hover {
			opacity: 0.7;
		}
	}
}
.product-data {
	font-size: calc(17 / 18 * 1em);
	line-height: 1.5;
	& dl > div {
		border-block-start: var(--border-gray);
		display: flex;
		&:last-child {
			border-block-end: var(--border-gray);
		}
	}
	& dt, & dd {
		padding: 1.27941176em 0;
	}
	& dt {
		inline-size: 8em;
		padding-inline-end: 1em;
		flex: 0 0 auto;
		color: var(--blue-dark);
	}
}
.button-bar--close {
	text-align: center;
	margin-block-start: var(--block-margin-100);
	& button {
		font-size: min(calc(15px + 1.4vw), 36px);
		font-weight: 600;
		color: var(--white);
		background-color: var(--blue-dark);
		text-align: center;
		inline-size: calc(320 / 36 * 1em);
		block-size: calc(70 / 36 * 1em);
		display: flex;
		align-items: center;
		justify-content: center;
		text-transform: uppercase;
		position: relative;
		margin: 0 auto;
		padding-inline-end: 1.75em;
		&::before, &::after {
			content: "";
			block-size: 0.18em;
			inline-size: 0.75em;
			background-color: var(--white);
			display: block;
			position: absolute;
			inset-block-start: calc(calc(100% - 0.18em) / 2);
			inset-inline-end: 2em;
			rotate: 45deg;
		}
		&::after {
			rotate: -45deg;
		}
		@media(any-hover: hover) {
			&:hover {
				transition: 150ms;
				background-color: color-mix(in srgb, var(--blue-dark), black 20%);
			}
		}
	}
}
.product-item-footer .copyright {
	color: var(--blue-dark);
	background-color: transparent;
}
/* ============================== */
/*  一覧表 */
/* ============================== */
.table-scroll {
	inline-size: 100%;
	overflow-x: scroll;
	& > *:not(.scroll-hint-icon-wrap) {
		min-width: 640px;
	}
}
@media (768px <=width), print {
	.table-scroll {
		overflow: visible;
	}
	& > *:not(.scroll-hint-icon-wrap) {
		min-width: none;
	}
}
.support-table {
	font-size: min(1em, 16px);
	line-height: 1.5;
	inline-size: 100%;
	& thead th {
		font-size: calc(16 / 14 * 1em);
		line-height: 1.25;
		background-color: #333333;
		color: var(--white);
		padding: 1em 0.5em;
		font-weight: 600;
		text-align: center;
		vertical-align: middle;
		border: none;
		& + th {
			border-inline-start: 1px solid var(--white);
		}
	}
	& tbody tr:has(.caution) {
		background-color: #e6e6e6;
	}
	& tbody td {
		border: var(--border-gray);
		padding: 0.625em 1em;
		vertical-align: middle;
	}
	& .caution {
		color: var(--red);
	}
}
@media (768px <=width), print {
	.support-table {
		--_thead-height: calc(calc(1.25em + 1.4em * 2) * 16 / 15);
		& thead th {
			font-size: calc(16 / 15 * 1em);
			padding: 1.4em 0.5em;
		}
	}
}
@media (1200px <=width), print {
	.support-table {
		--_thead-height: calc(calc(1.25em + 1.6em * 2) * 21 / 16);
		& thead th {
			background-color: #333333;
			font-size: calc(21 / 16 * 1em);
			padding: 1.6em 0.5em;
		}
	}
}
.support-table.availability {
	& thead th:first-child {
		inline-size: calc(100 - 6em);
	}
	& thead th:nth-child(2) {
		inline-size: 6em;
	}
	& tbody td:nth-child(2) {
		text-align: center;
		padding-inline: 0.5em;
	}
}
@media (768px <=width), print {
	.support-table.availability {
		& thead th:first-child {
			inline-size: calc(100 - 9em);
		}
		& thead th:nth-child(2) {
			inline-size: 9em;
		}
	}
}
.support-table.equipment {
	& thead {
		th:first-child {
			inline-size: calc(440 / calc(440 + 160 + 290 + 310) * 100%);
		}
		th:nth-child(2) {
			inline-size: calc(160 / calc(440 + 160 + 290 + 310) * 100%);
		}
		th:nth-child(3) {
			inline-size: calc(290 / calc(440 + 160 + 290 + 310) * 100%);
			text-align: center;
		}
		th:nth-child(4) {
			inline-size: calc(310 / calc(440 + 160 + 290 + 310) * 100%);
		}
	}
	& tbody td.num {
		padding-inline: 0.75em;
	}
	& tbody td.type {
		inline-size: calc(390 / calc(440 + 160 + 290 + 310) * 100%);
	}
	& tbody td.maker {
		text-align: center;
		padding-inline: 0.5em;
		min-width: calc(7em + 1px);
	}
}
.table-wrapper.column, .table-wrapper.row {
	display: flex;
	flex-direction: column;
	gap: var(--block-margin-90);
}
@media (768px <=width), print {
	.table-wrapper.row {
		flex-direction: row;
		align-items: flex-start;
		gap: 0;
		& > table {
			inline-size: 50%;
			position: relative;
		}
		& > table + table {
			inline-size: calc(50% + 1px);
			margin-inline-start: -1px;
			&::before {
				content: "";
				display: block;
				border-inline-start: 3px solid #fff;
				block-size: var(--_thead-height);
				position: absolute;
				inset-block-start: 0;
				inset-inline-start: -1px;
			}
		}
	}
}
/* ============================== */
/*  よくある質問 */
/* ============================== */
summary::-webkit-details-marker {
	display: none;
}
.faq-list {
	--_inline-margin: calc(15 / 16 * 1rem);
	font-size: 1em;
	& .js-details:not(:first-child) {
		margin-block-start: calc(10 / 14 * 1em);
	}
	& .faq-q {
		font-size: calc(15 / 14 * 1em);
		line-height: 1.5;
		font-weight: 600;
		text-align: justify;
		display: block;
		position: relative;
		background-color: #e6f0ff;
		padding: 0.75em 3em 0.75em calc(var(--_inline-margin) + 2em);
		text-indent: -2em;
		& .icon-q {
			inline-size: 2em;
			display: inline-block;
			text-indent: 0;
		}
		& .icon {
			&::before, &::after {
				content: "";
				display: block;
				position: absolute;
				inline-size: 0.9em;
				block-size: 2px;
				inset-block-start: calc(50% - 1px);
				inset-inline-end: 1em;
				background-color: var(--text-color);
				transition: 200ms;
			}
			&::after {
				rotate: 90deg;
			}
			&:is(.is-open *)::after {
				rotate: 0deg;
			}
		}
		@media(any-hover: hover) {
			&:hover {
				transition: 150ms;
				background-color: color-mix(in srgb, var(--blue-light), var(--blue-dark) 10%);
			}
		}
	}
	& .faq-a {
		padding: 1.25em var(--_inline-margin) 1.25em calc(var(--_inline-margin) + 2em);
		text-align: justify;
		& p:has(.icon-a) {
			text-indent: -2em;
		}
		& .icon-a {
			inline-size: 2em;
			display: inline-block;
			text-indent: 0;
		}
		& dl {
			margin-block: 0.875em;
		}
		& dt {
			font-weight: inherit;
			margin-block-start: 0.875em;
		}
		& a {
			color: var(--blue-dark);
		}
	}
}
@media (1200px <=width), print {
	.faq-list {
		--_inline-margin: calc(25 / 16 * 1rem);
		& .js-details:not(:first-child) {
			margin-block-start: calc(25 / 18 * 1em);
		}
		& .faq-q {
			font-size: calc(24 / 18 * 1em);
			line-height: 1.5;
			padding-block: 1.33333333em;
		}
		& .faq-a {
			line-height: 1.5;
			& dl {
				display: flex;
				flex-wrap: wrap;
			}
			& dt {
				inline-size: 6.5em;
				margin-block-start: 0;
			}
			& dd {
				inline-size: calc(100% - 6.5em);
			}
		}
	}
}
.photo-list {
	display: flex;
	flex-wrap: wrap;
	gap: calc(20 / 14 * 1em) calc(10 / 14 * 1em);
	& li {
		inline-size: calc(calc(100% - calc(10 / 14 * 1em)) / 2);
	}
}
@media (768px <=width), print {
	.photo-list {
		display: flex;
		flex-wrap: wrap;
		gap: calc(30 / 18 * 1em) calc(15 / 18 * 1em);
		& li {
			inline-size: calc(calc(100% - calc(15 / 18 * 1em) * 2) / 3);
		}
	}
}
.gallery-heading {
	font-size: min(calc(19px + 23 * ((100vw - 360px) / 1040)), 42px);
	line-height: 1.25;
	border-block-end: 2px solid var(--blue-dark);
	margin-block-end: calc(37 / 42 * 1em);
	padding-block-end: 0.15em;
}
section.gallery .section-body > .sub-section:first-child {
	margin-block-start: var(--block-margin-50);
}
/* ============================== */
/*  お問い合わせ */
/* ============================== */
.entry-form-list {
	font-size: 1em;
	line-height: 1.5;
	border-block-start: var(--border-gray);
	& > div {
		border: var(--border-gray);
		border-block-start: none;
		& > dt {
			padding: 0.75em 3em 0.75em 3em;
			font-weight: inherit;
			text-align: center;
			background-color: #f2f2f2;
			border-block-end: var(--border-gray);
			position: relative;
			& .required, & .optional {
				font-size: max(0.66666667em, 10px);
				position: absolute;
				inset-inline-start: calc(1 / 0.66666667 * 1em);
				inset-block-start: 50%;
				translate: 0 -50%;
				display: flex;
				background-color: #9aa6c0;
				color: var(--white);
				line-height: 1;
				inline-size: 3em;
				block-size: max(1.5em, 15px);
				justify-content: center;
				align-items: center;
			}
			& .required {
				background-color: #c1272d;
			}
		}
		& > dd {
			padding: 1.25em 1em;
			&.no-padding {
				padding: 0;
			}
		}
	}
}
@media (768px <=width), print {
	.entry-form-list {
		font-size: 1em;
		line-height: 1.5;
		border-block-start: var(--border-gray);
		& > div {
			display: flex;
			& > dt {
				padding: 2em 1em 2em 3em;
				inline-size: 14em;
				flex: 0 0 auto;
				border-block-end: none;
				border-inline-end: var(--border-gray);
				& .required, & .optional {
					inset-inline-start: 1em;
					inset-block-start: 3.41666667em;
					translate: 0 0;
				}
			}
			& > dd {
				flex: 1 1 auto;
				padding: 2em 1em;
			}
		}
	}
}
@media (1200px <=width), print {
	.entry-form-list {
		& div > dt {
			inline-size: 17em;
		}
	}
}
.no-padding [type="text"], .no-padding [type="email"], .no-padding [type="search"], .no-padding [type="tel"], .no-padding [type="url"], .no-padding [type="password"], .no-padding textarea {
	border: none;
	inline-size: 100%;
	line-height: 1.5;
	padding: 1em 1em;
}
@media (768px <=width), print {
	.no-padding [type="text"], .no-padding [type="email"], .no-padding [type="search"], .no-padding [type="tel"], .no-padding [type="url"], .no-padding [type="password"], .no-padding textarea {
		padding: 2em 1em;
	}
}
[type="text"]:focus, [type="email"]:focus, [type="search"]:focus, [type="tel"]:focus, [type="url"]:focus, [type="password"]:focus, textarea:focus {
	outline: none;
	background-color: var(--blue-light);
}
textarea {
	field-sizing: content;
	@supports (field-sizing: content) {
		resize: none;
	}
}
@media (width < 768px) {
	.entry-form-list dd {
		&:has(> textarea:only-child) {
			padding: 0;
		}
		& textarea {
			border: none;
		}
	}
}
.radio-list {
	display: flex;
	gap: 1.25em;
	> .radio-label {
		display: flex;
		gap: 0.25em;
		align-items: center;
	}
}
.entry-form-list p.notice {
	font-size: max(calc(14 / 18 * 1em), 12px);
	margin-block-end: 1em;
}
.entry-form-list .address .label-text {
	display: block;
	line-height: 1.5;
	margin-block: 1em 0.5em;
	&:is(.address > label: first-child>*) {
		margin-block-start: 0;
	}
}
.entry-form-list #zip-code {
	inline-size: calc(8em + 1.5em + 2px);
}
.form-footnote {
	font-size: calc(16 / 18 * 1em);
	margin-block-start: 1.25em;
}
.button-bar {
	margin-block-start: var(--block-margin-60);
	text-align: center;
	& .submit-note {
		font-size: calc(16 / 18 * 1em);
		font-weight: 600;
		line-height: calc(20 / 16);
		margin-block-end: 1em;
	}
	& button {
		font-size: min(calc(15px + 0.71111111vw), 26px);
		font-weight: 600;
		color: var(--white);
		inline-size: min(calc(427 / 26 * 1em), 100%);
		padding-inline-end: 1em;
		margin-inline: auto;
		background-color: #333;
		block-size: calc(80 / 26 * 1em);
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
		&::after {
			content: "";
			inline-size: 0.4em;
			aspect-ratio: 1 / 1.4;
			clip-path: var(--clip-triangle-right);
			background-color: currentColor;
			position: absolute;
			inset-block-start: 50%;
			inset-inline-end: 2.5em;
			translate: 0 -50%;
			transition: right 200ms;
		}
		&:hover {
			background-color: var(--blue-dark);
			transition: 200ms;
		}
	}
}
/* ============================== */
/*  プライバシーポリシー */
/* ============================== */
section.privacy p.body-copy {
	text-align: justify;
	& + p.body-copy {
		margin-top: 0.5lh;
	}
}
@media (1400px <=width), print {
	section.privacy p.body-copy {
		font-size: calc(17.9 / 18 * 1em);
	}
}
section.privacy .sub-section {
	margin-block-start: var(--block-margin-40);
}
.sub-heading--privacy {
	font-size: calc(18 / 14 * 1em);
	line-height: 1.25;
	font-weight: 600;
	padding: 1.125em 1em;
	color: var(--blue-dark);
	background-color: #e1e6f0;
	margin-block-end: 1em;
	border: 1px solid;
}
@media (768px <=width), print {
	.sub-heading--privacy {
		font-size: calc(21 / 15 * 1em);
	}
}
@media (1200px <=width), print {
	.sub-heading--privacy {
		font-size: calc(28 / 18 * 1em);
	}
}
section.privacy .sub-section h3 {
	font-size: calc(18 / 14 * 1em);
	line-height: 1.25;
	font-weight: 600;
	padding-block-end: 0.25em;
	color: var(--blue-dark);
	margin-block-start: 1.9em;
	margin-block-end: 0.5em;
	border-bottom: 1px solid;
}
@media (768px <=width), print {
	section.privacy .sub-section h3 {
		font-size: calc(21 / 15 * 1em);
	}
}
@media (1200px <=width), print {
	section.privacy .sub-section h3 {
		font-size: calc(28 / 18 * 1em);
	}
}
section.privacy .sub-section h4 {
	font-size: calc(15 / 14 * 1em);
	line-height: 1.25;
	font-weight: 600;
	color: var(--blue-dark);
	margin-block-start: 1.5em;
	margin-block-end: 0.45em;
}
@media (768px <=width), print {
	section.privacy .sub-section h4 {
		font-size: calc(18 / 15 * 1em);
	}
}
@media (1200px <=width), print {
	section.privacy .sub-section h4 {
		font-size: calc(21 / 18 * 1em);
	}
}
.privacy-table {
	font-size: calc(13 / 16 * 1rem);
	background-color: var(--gray-light);
	margin-block-start: var(--block-margin-40);
	& td, & th {
		border: 1px solid #999999;
		padding: 0.5em;
		font-weight: 400;
		vertical-align: middle;
		text-align: justify;
	}
	& tr > *:first-child {
		width: 2em;
		text-align: center;
	}
	& tr > *:nth-child(2) {
		width: calc(49% - 2em);
	}
	& tr > *:nth-child(3) {
		width: 51%;
	}
	& .header-row th {
		font-size: calc(16 / 14 * 1em);
		font-weight: 600;
		line-height: 1.25;
		text-align: center;
		padding: 0.9em 0.5em;
	}
}
@media (768px <=width), print {
	.privacy-table {
		font-size: calc(14 / 16 * 1rem);
		& td, & th {
			padding: 1.25em;
		}
		& tr > *:first-child {
			width: 5em;
		}
		& tr > *:nth-child(2) {
			width: calc(49% - 5em);
		}
		& tr > *:nth-child(3) {
			width: 51%;
		}
		& .header-row th {
			font-size: calc(21 / 14 * 1em);
		}
	}
}
@media (1200px <=width), print {
	.privacy-table {
		& .header-row th {
			font-size: calc(24 / 14 * 1em);
		}
	}
}
.privacy-table .enumeration li {
	line-height: calc(18 / 14);
	padding: 0.5em 0;
}
section.privacy .date {
	text-align: right;
}
/* ============================== */
/*  PRINT */
/* ============================== */
@media print {
	:root {
		font-size: 16px;
	}
	.site-id h1 {
		font-size: 34px;
	}
	#menu-toggle, #go-pagetop {
		display: none !important;
	}
	#global-header {
		position: relative;
		& + * {
			margin-top: 0;
		}
	}
	.slick-track, .slick-slide {
		inline-size: 100% !important;
		block-size: auto !important;
	}
	.slick-initialized .slick-slide {
		display: none !important;
	}
	.slick-initialized .slick-slide:first-child {
		display: block !important;
		inset-inline-start: 0 !important;
		opacity: 1 !important;
	}
}
/* ============================== */
/*  MAILFORM */
/* ============================== */
.c-disp {
	width: 90vw;
	margin: 0 auto;
}
.c-ttl {
	font-size: 1.5em;
	font-weight: bold;
	margin-bottom: 1em;
}
.c-desc {
	margin-bottom: 2em;
}
.err-ms {
	color: #cc2728;
	line-height: 2;
	margin-bottom: 2em;
}
.confT {
	width: 100%;
	margin: 0 auto 10vw;
}
.confT th {
	padding: 3vw;
	text-align: left;
	border-bottom: 1px solid #ccc;
}
.confT td {
	padding: 3vw;
	text-align: left;
	border-bottom: 1px solid #ccc;
}
.form-btn {
	display: flex;
	justify-content: center;
}
.form-btn li {
	margin: 0 2vw;
}
input[type="submit"] {
	padding: 4vw 8vw;
	background: #284893;
	color: #fff;
	text-align: center;
	font-weight: bold;
	border: none;
	font-size: 4vw;
	line-height: 7vw;
}
input[type="button"].backbtn {
	padding: 4vw;
	background: #ccc;
	color: #333;
	text-align: center;
	font-weight: bold;
	border: none;
	font-size: 4vw;
	line-height: 7vw;
}
@media screen and (min-width:768px) {
	.c-disp {
		width: 800px;
		margin: 0 auto;
	}
	.c-ttl {
		font-size: 1.5em;
		font-weight: bold;
		margin-bottom: 1em;
	}
	.c-desc {
		margin-bottom: 2em;
	}
	.err-ms {
		color: #cc2728;
		line-height: 2;
		margin-bottom: 2em;
	}
	.confT {
		width: 100%;
		margin: 0 auto 50px;
	}
	.confT th {
		padding: 15px;
		text-align: left;
		border-bottom: 1px solid #ccc;
	}
	.confT td {
		padding: 15px;
		text-align: left;
		border-bottom: 1px solid #ccc;
	}
	.form-btn {
		display: flex;
		justify-content: center;
	}
	.form-btn li {
		margin: 0 10px;
	}
	input[type="submit"] {
		padding: 20px 40px;
		background: #284893;
		color: #fff;
		text-align: center;
		font-weight: bold;
		border: none;
		transition: all .2s;
		font-size: 20px;
		line-height: 35px;
	}
	input[type="submit"]:hover {
		background: #ffd700;
		color: #333;
	}
	input[type="button"].backbtn {
		padding: 20px 20px;
		background: #ccc;
		color: #333;
		text-align: center;
		font-weight: bold;
		border: none;
		transition: all .2s;
		font-size: 20px;
		line-height: 35px;
	}
	input[type="button"].backbtn:hover {
		background: #666;
		color: #fff;
	}