@charset "UTF-8";
/**
 *
 * page-service.scss
 *
 */
/* ------------------------------------------------------------
 service-page
------------------------------------------------------------ */
.service-page {
	--color-bg: var( --color-brand-cream );
	--color-header-bg: var( --color-white );
	--service-accent: var( --color-service-blue );
	--service-gutter: 4rem ;
}

.service-hero__backdrop {
	position: absolute;
	inset: 0 0 auto;
	background-color: var(--color-service-blue);
	background-image: none;
}

@media screen and (min-width: 1024px) {
	.service-hero__backdrop {
		height: 73.7rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-hero__backdrop {
		height: 69rem ;
	}
}

.service-hero__bubbles {
	position: absolute;
	inset: 0;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.service-hero__bubbles {
		max-width: 150rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-hero__bubbles {
		max-width: 60rem ;
	}
}

.service-hero__bubble {
	position: absolute;
	-webkit-mask: var(--bubble-mask) center/100% 100% no-repeat;
	mask: var(--bubble-mask) center/100% 100% no-repeat;
	transition: opacity var(--transition-reveal), -webkit-transform var(--transition-recruit-transform);
	transition: opacity var(--transition-reveal), transform var(--transition-recruit-transform);
	transition: opacity var(--transition-reveal), transform var(--transition-recruit-transform), -webkit-transform var(--transition-recruit-transform);
	/* 支給aiから取得した写真マスク、配置、トリミング。 */
}

@media (prefers-reduced-motion: reduce) {
	.service-hero__bubble {
		transition: none;
	}
}

.service-hero__bubble img {
	position: absolute;
	max-width: none;
}

.service-hero__bubble[class] img.is-alternate {
	inset: 0;
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
}

.service-hero__bubble.is-leaving {
	opacity: 0;
	-webkit-transform: translateY(-1rem) scale(0.93);
	transform: translateY(-1rem) scale(0.93);
}

@media screen and (min-width: 1024px) {
	.service-hero__bubble.-cut {
		--bubble-mask: url(../img/service/bubble-cut-0.svg);
		top: -18.99375rem ;
		left: 6.666667%;
		width: 38.271172%;
		height: 56.05826rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-hero__bubble.-cut {
		--bubble-mask: url(../img/service/bubble-cut-1.svg);
		top: 1.61707rem ;
		left: -18.017808%;
		width: 67.666133%;
		height: 26.43066rem ;
	}
}

@media screen and (min-width: 1024px) {
	.service-hero__bubble.-cut img {
		top: -0.000000%;
		left: -44.450216%;
		width: 152.946659%;
		height: 104.406399%;
	}
}

@media screen and (max-width: 1023px) {
	.service-hero__bubble.-cut img {
		top: 0.000000%;
		left: -44.450216%;
		width: 152.946659%;
		height: 104.406399%;
	}
}

@media screen and (min-width: 1024px) {
	.service-hero__bubble.-market {
		--bubble-mask: url(../img/service/bubble-market-0.svg);
		top: -10.37751rem ;
		left: 63.524789%;
		width: 41.217090%;
		height: 62.37381rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-hero__bubble.-market {
		--bubble-mask: url(../img/service/bubble-market-1.svg);
		top: 45.84694rem ;
		left: 35.960651%;
		width: 71.540090%;
		height: 28.86976rem ;
	}
}

@media screen and (min-width: 1024px) {
	.service-hero__bubble.-market img {
		top: -2.996713%;
		left: -20.894508%;
		width: 167.327160%;
		height: 110.559601%;
	}
}

@media screen and (max-width: 1023px) {
	.service-hero__bubble.-market img {
		top: -2.996713%;
		left: -20.894508%;
		width: 167.327160%;
		height: 110.559601%;
	}
}

@media screen and (min-width: 1024px) {
	.service-hero__bubble.-label {
		--bubble-mask: url(../img/service/bubble-label-0.svg);
		top: 47.52422rem ;
		left: 11.413096%;
		width: 24.969318%;
		height: 34.09903rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-hero__bubble.-label {
		--bubble-mask: url(../img/service/bubble-label-1.svg);
		top: 11.30187rem ;
		left: 55.536858%;
		width: 51.963883%;
		height: 18.92369rem ;
	}
}

@media screen and (min-width: 1024px) {
	.service-hero__bubble.-label img {
		top: -5.264676%;
		left: -32.806022%;
		width: 158.318339%;
		height: 115.917978%;
	}
}

@media screen and (max-width: 1023px) {
	.service-hero__bubble.-label img {
		top: -5.264676%;
		left: -32.806022%;
		width: 158.318339%;
		height: 115.917978%;
	}
}

@media screen and (min-width: 1024px) {
	.service-hero__bubble.-sashimi {
		--bubble-mask: url(../img/service/bubble-sashimi-0.svg);
		top: 59.65425rem ;
		left: 48.101197%;
		width: 18.071672%;
		height: 21.67536rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-hero__bubble.-sashimi {
		--bubble-mask: url(../img/service/bubble-sashimi-1.svg);
		top: 42.27395rem ;
		left: 3.715213%;
		width: 38.323989%;
		height: 12.25765rem ;
	}
}

@media screen and (min-width: 1024px) {
	.service-hero__bubble.-sashimi img {
		top: -8.042175%;
		left: -24.620662%;
		width: 140.424223%;
		height: 117.065542%;
	}
}

@media screen and (max-width: 1023px) {
	.service-hero__bubble.-sashimi img {
		top: -8.042175%;
		left: -24.620662%;
		width: 140.424223%;
		height: 117.065542%;
	}
}

.service-hero__nav {
	position: absolute;
	top: 57.1rem ;
	left: 74.666667%;
	color: var(--color-service-blue);
}

@media screen and (max-width: 1023px) {
	.service-hero__nav {
		display: none;
	}
}

.service-hero__nav ul {
	display: flex;
	align-items: flex-start;
	gap: 1.4rem ;
	list-style: none;
}

.service-hero__nav a {
	display: flex;
	align-items: center;
	border-radius: 3rem ;
	background-color: var(--color-white);
	background-image: none;
	font-weight: 700;
	font-size: var(--font-size14);
	--line-height: 3.96569;
	padding: 1.8rem 0.9rem ;
	font-family: var(--font-gothic);
	transition: background var(--transition-button), color var(--transition-button);
}

.service-hero__nav a:hover:where(body[data-hover-enabled="true"] *, [data-hover-enabled="true"]), .service-hero__nav a:focus-visible {
	outline: 1px solid currentColor;
	background-color: var(--color-service-blue);
	background-image: none;
	color: var(--color-white);
}

.service-hero__nav .service-text-crop-v {
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
}

/* ------------------------------------------------------------
 service-intro
------------------------------------------------------------ */
.service-intro {
	flex-direction: row-reverse;
	justify-content: space-between;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.service-intro {
		display: flex;
		max-width: 103rem ;
		width: calc(100% - 12rem);
		padding: 15.7rem 1rem 12.8rem 5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-intro {
		display: block;
		width: calc(100% - var( --service-gutter ) * 2);
		padding: 4rem 0 9.6rem ;
	}
}

@media (prefers-reduced-motion: no-preference) {
	.service-intro.is-revealing {
		-webkit-animation: service-intro-in .9s both;
		animation: service-intro-in .9s both;
	}
}

.service-intro__title {
	font-weight: 400;
}

@media screen and (min-width: 1024px) {
	.service-intro__title {
		-webkit-writing-mode: vertical-rl;
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
		font-family: var(--font-gothic2);
		font-size: var(--font-size56);
		--line-height: 1.51786;
		letter-spacing: -0.09657em;
		-webkit-font-feature-settings: 'vpal' 1;
		font-feature-settings: 'vpal' 1;
		white-space: nowrap;
	}
}

@media screen and (max-width: 1023px) {
	.service-intro__title {
		white-space: normal;
		-webkit-writing-mode: horizontal-tb;
		-ms-writing-mode: lr-tb;
		writing-mode: horizontal-tb;
		font-family: var(--font-gothic2);
		padding-top: 0.1px;
		padding-bottom: 0.1px;
		font-size: var(--font-size30);
		-webkit-font-feature-settings: 'palt' 1;
		font-feature-settings: 'palt' 1;
		--line-height: 1.49408;
		letter-spacing: -0.09643em;
		width: calc(100% + .2em);
	}
	.service-intro__title::before, .service-intro__title::after {
		content: '';
		display: block;
		width: 0;
		height: 0;
		font-size: inherit;
	}
	.service-intro__title::before {
		margin-top: var(--font-gothic2-top);
	}
	.service-intro__title::after {
		margin-bottom: var(--font-gothic2-bottom);
	}
}

.service-intro__title .service-text-crop-v > span {
	display: block;
}

.service-intro__copy {
	text-orientation: upright;
	font-weight: 500;
	line-height: calc( var(--line-height) * 1em);
}

@media screen and (min-width: 1024px) {
	.service-intro__copy {
		height: 53.5rem ;
		-webkit-writing-mode: vertical-rl;
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
		font-size: var(--font-size18);
		--line-height: 2.33333;
		-webkit-font-feature-settings: 'vpal' 1;
		font-feature-settings: 'vpal' 1;
	}
}

@media screen and (max-width: 1023px) {
	.service-intro__copy {
		height: auto;
		-webkit-writing-mode: horizontal-tb;
		-ms-writing-mode: lr-tb;
		writing-mode: horizontal-tb;
		font-size: var(--font-size13);
		-webkit-font-feature-settings: 'palt' 1;
		font-feature-settings: 'palt' 1;
		--line-height: 1.76923;
		letter-spacing: 0em;
		margin-top: 4.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-intro__copy p {
		text-indent: 0;
	}
}

@media screen and (min-width: 1024px) {
	.service-intro__copy p + p {
		margin-right: 6.4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-intro__copy p + p {
		margin-right: 0;
		margin-top: 3.3rem ;
	}
}

@media screen and (min-width: 1024px) {
	.service-intro__text {
		display: block;
		text-indent: 1em;
	}
}

/* ------------------------------------------------------------
 service-sections
------------------------------------------------------------ */
.service-sections {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: start;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.service-sections {
		display: grid;
	}
}

@media screen and (max-width: 1023px) {
	.service-sections {
		display: block;
	}
}

/* ------------------------------------------------------------
 service-section
------------------------------------------------------------ */
.service-section {
	position: relative;
	outline: none;
	scroll-margin-top: 0;
	background-color: var(--color-bg);
}

@media screen and (min-width: 1024px) {
	.service-section {
		min-height: 84rem ;
		padding: 15rem 0 ;
	}
}

@media screen and (max-width: 1023px) {
	.service-section {
		background-image: none;
		min-height: 0;
		padding: 0;
	}
}

.service-section.-red {
	--service-accent: var( --color-service-red );
}

.service-section.-gold {
	--service-accent: var( --color-service-gold );
}

@media screen and (min-width: 1024px) {
	.service-section.-support {
		padding: 7.9rem 0 5.3rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-section.-support {
		min-height: 0;
		padding: 0;
	}
}

@media screen and (min-width: 1024px) {
	.service-section.-support .service-section__panel {
		padding-bottom: 9rem ;
	}
}

@media screen and (min-width: 1024px) {
	.service-section.-fleet {
		padding: 11.6rem 0 15rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-section.-fleet {
		min-height: 0;
		padding: 0;
	}
}

@media screen and (min-width: 1024px) {
	.service-section.-processing {
		padding: 13.7rem 0 8.7rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-section.-processing {
		min-height: 0;
		padding: 0;
	}
}

@media screen and (min-width: 1024px) {
	.service-section.-processing .service-section__panel {
		padding-bottom: 8.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-section:last-child .service-section__panel {
		padding-bottom: 12.5rem ;
	}
}

.service-section__panel {
	position: relative;
	background-color: var(--color-white);
	background-image: none;
}

@media screen and (min-width: 1024px) {
	.service-section__panel {
		padding: 9.6rem 5.67rem 10.7rem 14.33rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-section__panel {
		margin-inline: auto;
		padding: 0 var(--service-gutter);
		padding-top: 4rem ;
		padding-bottom: 8rem ;
	}
}

.service-section__label {
	top: 5.4rem ;
	left: 4.6rem ;
	flex-direction: row-reverse;
	color: var(--service-accent);
}

@media screen and (min-width: 1024px) {
	.service-section__label {
		position: absolute;
		display: flex;
		gap: 0.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-section__label {
		position: static;
		display: block;
	}
}

.service-section__number {
	font-weight: 400;
	letter-spacing: 0.06em;
}

@media screen and (min-width: 1024px) {
	.service-section__number {
		-webkit-writing-mode: vertical-rl;
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
		font-family: var(--font-sans-serif);
		font-size: var(--font-size16);
		--line-height: 0.98257;
	}
}

@media screen and (max-width: 1023px) {
	.service-section__number {
		-webkit-writing-mode: horizontal-tb;
		-ms-writing-mode: lr-tb;
		writing-mode: horizontal-tb;
		font-family: var(--font-sans-serif);
		padding-top: 0.1px;
		padding-bottom: 0.1px;
		font-size: var(--font-size16);
		--line-height: 1.625;
	}
	.service-section__number::before, .service-section__number::after {
		content: '';
		display: block;
		width: 0;
		height: 0;
		font-size: inherit;
	}
	.service-section__number::before {
		margin-top: var(--font-sans-serif-top);
	}
	.service-section__number::after {
		margin-bottom: var(--font-sans-serif-bottom);
	}
}

.service-section__name {
	min-width: 1em;
	font-weight: 700;
	letter-spacing: 0.07em;
}

@media screen and (min-width: 1024px) {
	.service-section__name {
		-webkit-writing-mode: vertical-rl;
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
		font-family: var(--font-gothic);
		font-size: var(--font-size32);
		--line-height: 2.68506;
		letter-spacing: 0em;
	}
}

@media screen and (max-width: 1023px) {
	.service-section__name {
		display: block;
		-webkit-writing-mode: horizontal-tb;
		-ms-writing-mode: lr-tb;
		writing-mode: horizontal-tb;
		font-family: var(--font-gothic);
		font-size: var(--font-size27);
		--line-height: 0.96296;
		margin-top: 1.6rem ;
	}
}

@media screen and (min-width: 1024px) {
	.service-section.-fleet .service-section__name {
		--line-height: 2.65625;
		letter-spacing: 0.08em;
	}
}

@media screen and (min-width: 1024px) {
	.service-section.-restaurant .service-section__name {
		letter-spacing: 0.063em;
	}
}

@media screen and (min-width: 1024px) {
	@supports (font: -apple-system-body) {
		.service-section__name .service-text-crop-v {
			font-family: 'M PLUS 1p', sans-serif;
			position: relative;
			left: -.5em;
		}
	}
}

.service-section__headline {
	font-family: var(--font-gothic2);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
	font-weight: 400;
}

.service-section__headline::before, .service-section__headline::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	font-size: inherit;
}

.service-section__headline::before {
	margin-top: var(--font-gothic2-top);
}

.service-section__headline::after {
	margin-bottom: var(--font-gothic2-bottom);
}

@media screen and (min-width: 1024px) {
	.service-section__headline {
		font-size: var(--font-size42);
		--line-height: 1.2619;
		letter-spacing: -0.14449em;
	}
}

@media screen and (max-width: 1023px) {
	.service-section__headline {
		font-size: var(--font-size29);
		--line-height: 1.27586;
		letter-spacing: -0.14449em;
	}
}

@media screen and (min-width: 1024px) {
	.service-section.-fleet .service-section__headline {
		--line-height: 1.33333;
		letter-spacing: -0.09084em;
	}
}

@media screen and (max-width: 1023px) {
	.service-section.-fleet .service-section__headline {
		letter-spacing: -0.08729em;
	}
}

@media screen and (min-width: 1024px) {
	.service-section.-wholesale .service-section__headline {
		--line-height: 1.33333;
		letter-spacing: -0.09335em;
	}
}

@media screen and (max-width: 1023px) {
	.service-section.-wholesale .service-section__headline {
		letter-spacing: -0.0916em;
	}
}

@media screen and (min-width: 1024px) {
	.service-section.-processing .service-section__headline {
		letter-spacing: -0.10178em;
	}
}

@media screen and (max-width: 1023px) {
	.service-section.-processing .service-section__headline {
		letter-spacing: -0.1em;
	}
}

.service-section.-restaurant .service-section__headline {
	letter-spacing: -0.10474em;
}

.service-section__headline .service-text-crop > span {
	display: block;
}

.service-section__headline em {
	color: var(--service-accent);
	font-style: normal;
}

.service-section__description {
	font-weight: 500;
	letter-spacing: 0em;
}

@media screen and (min-width: 1024px) {
	.service-section__description {
		font-size: var(--font-size16);
		--line-height: 2.25;
		margin-top: 4.4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-section__description {
		font-size: var(--font-size13);
		--line-height: 1.76923;
		margin-top: 4.2rem ;
	}
}

.service-section__description p {
	line-height: inherit;
}

.service-section__link {
	--color-line-service-accent: var( --service-accent );
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-radius: 5rem ;
	border: var(--solid-base) var(--color-line-service-accent);
	color: var(--service-accent);
	font-weight: 800;
	letter-spacing: 0em;
	transition: color var(--transition-button), background var(--transition-button);
}

@media screen and (min-width: 1024px) {
	.service-section__link {
		width: 25.8rem ;
		min-height: 6.7rem ;
		font-size: 1.52308rem ;
		--line-height: 4.67945;
		margin-top: 4.8rem ;
		padding: 2rem 3.4rem 2rem 2.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-section__link {
		width: 23.4rem ;
		min-height: 6.1rem ;
		font-size: var(--font-size13);
		--line-height: 4.98404;
		margin-top: 3.7rem ;
		padding: 1.8rem 3.1rem 1.8rem 2.5rem ;
	}
}

.service-section__link:focus-visible {
	outline: 2px solid var(--service-accent);
	outline-offset: 0.5rem ;
	background-color: var(--service-accent);
	background-image: none;
	color: var(--color-white);
}

@media (hover: hover) {
	.service-section__link:hover:where(body[data-hover-enabled="true"] *, [data-hover-enabled="true"]) {
		background-color: var(--service-accent);
		background-image: none;
		color: var(--color-white);
	}
}

.service-section__photo {
	top: 0;
	width: 100%;
	overflow: hidden;
}

@media screen and (min-width: 1024px) {
	.service-section__photo {
		position: absolute;
		left: 100%;
		height: 84rem ;
		border-radius: 2.5rem 0 0 2.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-section__photo {
		position: relative;
		left: auto;
		max-height: 65rem ;
		height: auto;
		aspect-ratio: 25 / 28;
		border-radius: 1.2rem 1.2rem 0 0 ;
	}
}

@media screen and (max-width: 1023px) and (min-width: 561px) {
	.service-section__photo {
		margin-inline: auto;
	}
}

.service-section__photo img {
	position: absolute;
	max-width: none;
}

@media screen and (min-width: 1024px) {
	.service-section__photo.-support img {
		top: -22.159130%;
		left: -7.556507%;
		width: 112.818782%;
		height: 154.744812%;
	}
}

@media screen and (max-width: 1023px) {
	.service-section__photo.-support img {
		top: -22.159130%;
		left: -7.556507%;
		width: 112.818782%;
		height: 154.744812%;
	}
}

@media screen and (min-width: 1024px) {
	.service-section__photo.-fleet img {
		top: -14.305901%;
		left: -70.363479%;
		width: 193.710832%;
		height: 115.292113%;
	}
}

@media screen and (max-width: 1023px) {
	.service-section__photo.-fleet img {
		top: 0.000000%;
		left: -49.168963%;
		width: 168.017418%;
		height: 100.000000%;
	}
}

@media screen and (min-width: 1024px) {
	.service-section__photo.-wholesale img {
		top: -18.933416%;
		left: -66.476605%;
		width: 205.216579%;
		height: 122.140062%;
	}
}

@media screen and (max-width: 1023px) {
	.service-section__photo.-wholesale img {
		top: -7.253154%;
		left: -49.120784%;
		width: 192.390543%;
		height: 114.506308%;
	}
}

@media screen and (min-width: 1024px) {
	.service-section__photo.-processing img {
		top: -24.177575%;
		left: -92.978983%;
		width: 262.054030%;
		height: 155.968371%;
	}
}

@media screen and (max-width: 1023px) {
	.service-section__photo.-processing img {
		top: -12.195585%;
		left: -86.980136%;
		width: 245.675653%;
		height: 146.220348%;
	}
}

@media screen and (min-width: 1024px) {
	.service-section__photo.-restaurant img {
		top: -2.808658%;
		left: -35.840750%;
		width: 177.455487%;
		height: 105.617316%;
	}
}

@media screen and (max-width: 1023px) {
	.service-section__photo.-restaurant img {
		top: 0.000000%;
		left: -33.685266%;
		width: 172.222441%;
		height: 102.502730%;
	}
}

/* ------------------------------------------------------------
 service-sticky
------------------------------------------------------------ */
.service-sticky {
	display: none;
}

/* ------------------------------------------------------------
 service-processing
------------------------------------------------------------ */
.service-processing {
	color: var(--service-accent);
}

@media screen and (min-width: 1024px) {
	.service-processing {
		margin-top: 5.6rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing {
		margin-top: 4.4rem ;
	}
}

@media screen and (min-width: 1024px) {
	.service-processing + .service-processing {
		margin-top: 4.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing + .service-processing {
		margin-top: 3.1rem ;
	}
}

@media screen and (min-width: 1024px) {
	.service-processing.-flow {
		margin-top: 5.4rem ;
	}
}

.service-processing__title {
	font-weight: 700;
}

@media screen and (min-width: 1024px) {
	.service-processing__title {
		font-size: var(--font-size20);
		--line-height: 2.71759;
		margin-left: 2.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing__title {
		font-size: var(--font-size20);
		--line-height: 1.58056;
		margin-left: 0;
	}
}

.service-processing__list {
	background-color: var(--processing-bg);
	background-image: none;
	color: var(--color-white);
}

@media screen and (min-width: 1024px) {
	.service-processing__list {
		--processing-bg: var( --service-accent );
		border-radius: 1.2rem ;
		margin-top: 1.2rem ;
		padding: 2.9rem 3.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing__list {
		--processing-bg: var( --color-service-red-sp );
		border-radius: 0.6rem ;
		margin-top: 1.5rem ;
		padding: 2.2rem 2rem ;
	}
}

.service-processing__item + .service-processing__item {
	border-top: var(--solid-service);
}

@media screen and (min-width: 1024px) {
	.service-processing__item + .service-processing__item {
		padding-top: 2rem ;
		margin-top: 1.6rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing__item + .service-processing__item {
		border-top-width: .5px;
		margin-top: 1.7rem ;
		padding-top: 1.8rem ;
	}
}

.service-processing__item dt {
	font-weight: 700;
}

@media screen and (min-width: 1024px) {
	.service-processing__item dt {
		font-size: var(--font-size18);
		--line-height: 2.11111;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing__item dt {
		font-size: var(--font-size15);
		--line-height: 1.4734;
	}
}

.service-processing__item dd {
	font-weight: 500;
}

@media screen and (min-width: 1024px) {
	.service-processing__item dd {
		font-size: var(--font-size14);
		--line-height: 1.57143;
		margin-top: 1.1rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing__item dd {
		font-size: var(--font-size13);
		--line-height: 1.53846;
		margin-top: 1.2rem ;
	}
}

.service-processing__steps {
	list-style: none;
}

@media screen and (min-width: 1024px) {
	.service-processing__steps {
		margin-top: 2.7rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing__steps {
		margin-top: 2.4rem ;
	}
}

.service-processing__step {
	position: relative;
	display: grid;
	grid-template-columns: var(--step-size) minmax(0, 1fr);
}

@media screen and (min-width: 1024px) {
	.service-processing__step {
		--step-size: 6.4rem ;
		gap: 1.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing__step {
		--step-size: 3.2rem ;
		gap: 1.4rem ;
	}
}

.service-processing__step:not(:last-child)::before {
	--color-line-service-accent: var( --service-accent );
	content: '';
	position: absolute;
	bottom: -4.5rem ;
	border-left: var(--dashed-base) var(--color-line-service-accent);
}

@media screen and (min-width: 1024px) {
	.service-processing__step:not(:last-child)::before {
		top: 6.4rem ;
		left: 3.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing__step:not(:last-child)::before {
		top: 3.2rem ;
		left: 1.6rem ;
	}
}

.service-processing__step h5 {
	font-weight: 700;
}

@media screen and (min-width: 1024px) {
	.service-processing__step h5 {
		font-size: var(--font-size18);
		--line-height: 2.11111;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing__step h5 {
		font-size: var(--font-size15);
		--line-height: 1.4734;
	}
}

.service-processing__step p {
	font-weight: 500;
}

@media screen and (min-width: 1024px) {
	.service-processing__step p {
		font-size: var(--font-size14);
		--line-height: 1.57143;
		margin-top: 1.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing__step p {
		font-size: var(--font-size13);
		--line-height: 1.53846;
		margin-top: 1.2rem ;
	}
}

@media screen and (min-width: 1024px) {
	.service-processing__step + .service-processing__step {
		margin-top: 3.7rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing__step + .service-processing__step {
		margin-top: 2.2rem ;
	}
}

.service-processing__step .service-processing__note {
	white-space: pre-line;
}

@media screen and (min-width: 1024px) {
	.service-processing__step .service-processing__note {
		margin-top: 2.6rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing__step .service-processing__note {
		margin-top: 1rem ;
	}
}

.service-processing__number {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background-color: var(--service-accent);
	background-image: none;
	color: var(--color-white);
	font-family: var(--font-sans-serif);
	font-weight: 400;
	--line-height: 1;
}

@media screen and (min-width: 1024px) {
	.service-processing__number {
		gap: 0.3rem ;
		width: 6.4rem ;
		height: 6.4rem ;
		padding-top: 0.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing__number {
		gap: 0.1rem ;
		width: 3.2rem ;
		height: 3.2rem ;
		padding-top: 0.4rem ;
	}
}

.service-processing__number > span {
	padding-top: 0.1px;
	padding-bottom: 0.1px;
	letter-spacing: 0.06em;
}

.service-processing__number > span::before, .service-processing__number > span::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	font-size: inherit;
}

.service-processing__number > span::before {
	margin-top: var(--font-sans-serif-top);
}

.service-processing__number > span::after {
	margin-bottom: var(--font-sans-serif-bottom);
}

.service-processing__number > span:first-child {
	--line-height: 0.97873;
}

@media screen and (min-width: 1024px) {
	.service-processing__number > span:first-child {
		font-size: 1.38708rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing__number > span:first-child {
		font-size: 0.69354rem ;
	}
}

.service-processing__number > span:last-child {
	--line-height: 0.97872;
}

@media screen and (min-width: 1024px) {
	.service-processing__number > span:last-child {
		font-size: 3.1416rem ;
	}
}

@media screen and (max-width: 1023px) {
	.service-processing__number > span:last-child {
		font-size: 1.5708rem ;
	}
}

@media screen and (min-width: 1024px) {
	.service-processing__step-body {
		padding-top: 1rem ;
	}
}

@media screen and (min-width: 1024px) {
	.js-currentsection.is-currentsection-ready .service-section__photo {
		display: none;
	}
}

@media screen and (min-width: 1024px) {
	.js-currentsection.is-currentsection-ready .service-sticky {
		position: sticky;
		top: 0;
		display: block;
		height: 100vh;
		border-radius: 2.5rem 0 0 2.5rem ;
		overflow: hidden;
	}
}

@media screen and (min-width: 1024px) {
	.service-sticky__photo {
		position: absolute;
		inset: 0 0 auto;
		width: 100%;
		min-height: 100%;
		aspect-ratio: 25 / 28;
		opacity: 0;
		transition: opacity var(--transition-slider);
	}
}

@media (prefers-reduced-motion: reduce) {
	.service-sticky__photo {
		transition: none;
	}
}

.service-sticky__photo img {
	position: absolute;
	max-width: none;
}

@media screen and (min-width: 1024px) {
	.service-sticky__photo.is-current {
		opacity: 1;
	}
}

@media screen and (min-width: 1024px) {
	.service-sticky__photo.-support img {
		top: -22.159130%;
		left: -7.556507%;
		width: 112.818782%;
		height: 154.744812%;
	}
}

@media screen and (max-width: 1023px) {
	.service-sticky__photo.-support img {
		top: -22.159130%;
		left: -7.556507%;
		width: 112.818782%;
		height: 154.744812%;
	}
}

@media screen and (min-width: 1024px) {
	.service-sticky__photo.-fleet img {
		top: -14.305901%;
		left: -70.363479%;
		width: 193.710832%;
		height: 115.292113%;
	}
}

@media screen and (max-width: 1023px) {
	.service-sticky__photo.-fleet img {
		top: 0.000000%;
		left: -49.168963%;
		width: 168.017418%;
		height: 100.000000%;
	}
}

@media screen and (min-width: 1024px) {
	.service-sticky__photo.-wholesale img {
		top: -18.933416%;
		left: -66.476605%;
		width: 205.216579%;
		height: 122.140062%;
	}
}

@media screen and (max-width: 1023px) {
	.service-sticky__photo.-wholesale img {
		top: -7.253154%;
		left: -49.120784%;
		width: 192.390543%;
		height: 114.506308%;
	}
}

@media screen and (min-width: 1024px) {
	.service-sticky__photo.-processing img {
		top: -24.177575%;
		left: -92.978983%;
		width: 262.054030%;
		height: 155.968371%;
	}
}

@media screen and (max-width: 1023px) {
	.service-sticky__photo.-processing img {
		top: -12.195585%;
		left: -86.980136%;
		width: 245.675653%;
		height: 146.220348%;
	}
}

@media screen and (min-width: 1024px) {
	.service-sticky__photo.-restaurant img {
		top: -2.808658%;
		left: -35.840750%;
		width: 177.455487%;
		height: 105.617316%;
	}
}

@media screen and (max-width: 1023px) {
	.service-sticky__photo.-restaurant img {
		top: 0.000000%;
		left: -33.685266%;
		width: 172.222441%;
		height: 102.502730%;
	}
}

@media screen and (max-width: 1023px) {
	.service-section__body {
		margin-top: 5.4rem ;
	}
}

@-webkit-keyframes service-intro-in {
	from {
		opacity: 0;
		-webkit-transform: translateY(2rem);
		transform: translateY(2rem);
	}
	to {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

@keyframes service-intro-in {
	from {
		opacity: 0;
		-webkit-transform: translateY(2rem);
		transform: translateY(2rem);
	}
	to {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}