/*
rev. 2026-05-27
copyright © 2026
*/
@layer reset, base, general, component, main-base, main, helper;
@layer reset {
	/*! kiso.css v1.2.3 | MIT License | https://github.com/tak-dcxi/kiso.css */
	*,
	:after,
	:before {
		box-sizing: border-box;
	}
	:where(:root) {
		font-family: sans-serif;
		line-height: 1.5;
		text-spacing-trim: trim-start;
		text-autospace: normal;
		line-break: strict;
		overflow-wrap: anywhere;
		-webkit-text-size-adjust: 100%;
		text-size-adjust: 100%;
		scrollbar-gutter: stable;
		-webkit-tap-highlight-color: transparent;
	}
	:where(body) {
		min-block-size: 100dvb;
		margin: unset;
	}
	:where(:is(h1, h2, h3, h4, h5, h6):lang(en)) {
		text-wrap: pretty;
	}
	:where(h1) {
		margin-block: 0.67em;
		font-size: 2em;
	}
	:where(h2, h3, h4, h5, h6) {
		margin-block: unset;
	}
	:where(search) {
		display: block;
	}
	:where(p, blockquote, figure, pre, address, ul, ol, dl, menu) {
		margin-block: unset;
	}
	:where(blockquote, figure) {
		margin-inline: unset;
	}
	:where(p:lang(en)) {
		text-wrap: pretty;
	}
	:where(address:lang(ja)) {
		font-style: unset;
	}
	:where(ul, ol, menu) {
		padding-inline-start: unset;
		list-style-type: '';
	}
	:where(dt) {
		font-weight: bolder;
	}
	:where(dd) {
		margin-inline-start: unset;
	}
	:where(pre) {
		text-spacing-trim: space-all;
		text-autospace: no-autospace;
	}
	:where(em:lang(ja)) {
		font-weight: bolder;
	}
	:where(:is(i, cite, em, dfn, var):lang(ja)) {
		font-style: unset;
	}
	:where(:is(u, s, del, ins)) {
		text-decoration-inset: auto;
	}
	:where(code, kbd, samp) {
		font-family:
			ui-monospace,
			SFMono-Regular,
			Menlo,
			Monaco,
			Consolas,
			Liberation Mono,
			Courier New,
			monospace;
		font-feature-settings: normal;
		font-variation-settings: normal;
		font-size: unset;
		font-variant-ligatures: none;
	}
	:where(abbr[title]) {
		text-decoration-line: underline;
		text-decoration-style: dotted;
		text-decoration-inset: auto;
		cursor: help;
	}
	:where(time) {
		text-autospace: no-autospace;
	}
	@media (forced-colors: active) {
		:where(mark) {
			background-color: Highlight;
			color: HighlightText;
		}
	}
	@media print {
		:where(mark) {
			border-width: 1px;
			border-style: dotted;
		}
	}
	:where(a:any-link) {
		color: unset;
		text-decoration-line: unset;
		text-decoration-thickness: from-font;
		text-decoration-inset: auto;
	}
	:where(img, svg, picture, video, canvas, model, audio, iframe, embed, object) {
		block-size: auto;
		max-inline-size: 100%;
		vertical-align: bottom;
	}
	:where(iframe) {
		border: unset;
	}
	:where(table) {
		border-collapse: collapse;
	}
	:where(caption, th) {
		text-align: unset;
	}
	:where(caption) {
		text-wrap: pretty;
	}
	::file-selector-button,
	:where(button, input, select, textarea) {
		border: 1px solid;
		border-color: unset;
		border-radius: unset;
		color: unset;
		font: unset;
		letter-spacing: unset;
		text-align: unset;
	}
	:where(input:is([type='radio' i], [type='checkbox' i])) {
		margin: unset;
	}
	:where(input[type='file' i]) {
		border: unset;
	}
	:where(input[type='search' i]) {
		-webkit-appearance: textfield;
	}
	@supports (-webkit-touch-callout: none) {
		:where(input[type='search' i]) {
			background-color: Canvas;
		}
	}
	:where(
		input:is([type='tel' i], [type='url' i], [type='email' i], [type='number' i]):not(
				:placeholder-shown
			)
	) {
		direction: ltr;
	}
	:where(textarea) {
		margin-block: unset;
		resize: block;
	}
	:where(
		input:not([type='button' i], [type='submit' i], [type='reset' i]),
		textarea,
		[contenteditable]
	) {
		text-autospace: no-autospace;
	}
	::file-selector-button,
	:where(button, input:is([type='button' i], [type='submit' i], [type='reset' i])) {
		background-color: unset;
	}
	::file-selector-button,
	:where(
		button,
		input:is([type='button' i], [type='submit' i], [type='reset' i]),
		[role='tab' i],
		[role='button' i],
		[role='option' i]
	) {
		touch-action: manipulation;
	}
	:where(:enabled)::file-selector-button,
	:where(
		button:enabled,
		label[for],
		select:enabled,
		input:is(
				[type='button' i],
				[type='submit' i],
				[type='reset' i],
				[type='radio' i],
				[type='checkbox' i]
			):enabled,
		[role='tab' i],
		[role='button' i],
		[role='option' i]
	) {
		cursor: pointer;
	}
	:where(fieldset) {
		min-inline-size: 0;
		margin-inline: unset;
		padding: unset;
		border: unset;
	}
	:where(legend) {
		padding-inline: unset;
	}
	:where(progress) {
		vertical-align: unset;
	}
	::placeholder {
		opacity: unset;
	}
	:where(summary) {
		list-style-type: '';
		cursor: pointer;
	}
	:where(summary)::-webkit-details-marker {
		display: none;
	}
	:where(dialog, [popover]) {
		overscroll-behavior-block: contain;
		padding: unset;
		border: unset;
	}
	:where(dialog:not([open], [popover]), [popover]:not(:popover-open)) {
		display: none !important;
	}
	:where(dialog) {
		max-inline-size: unset;
		max-block-size: unset;
	}
	:where(dialog)::backdrop {
		background-color: oklch(0 0 0deg/30%);
	}
	:where([popover]) {
		margin: unset;
	}
	:where(:focus-visible) {
		outline-offset: 3px;
	}
	[tabindex='-1']:focus {
		outline: none !important;
	}
	:where(:disabled, [aria-disabled='true' i]) {
		cursor: default;
	}
	[hidden]:not([hidden='until-found' i]) {
		display: none !important;
	}
}
@layer base {
	:root {
		--color-must-lightest: #fff;
		--color-must-darkest: #000;
		--color-tone-primary: #0051a4;
		--color-tone-secondary: #e60012;
		--color-tone-tertiary: #cadaff;
		--color-text-base-font-primary: #000;
		--color-text-base-font-gray: #4f4f4f;
		--color-text-link-text-link: #0051a4;
		--color-text-link-text-link-hover: #ce3e00;
		--color-current-text: #4f4f4f;
		--color-current-bg: #563e3e;
		--color-semantics-error: #dd1b1b;
		--color-semantics-bg-error: #ffe0e0;
		--color-bg-base-primary: #fff;
		--color-bg-base-secondary: #cadaff;
		--color-bg-base-bg-light-blue: #e6eeff;
		--color-bg-bgb-bgb-opt--bg-gray: #f6f6f6;
		--color-bg-base-bg-blue: #d8f1fb;
		--color-bg-base-bg-pink: #fddde4;
		--color-bg-link-normal: #fff;
		--color-bg-link-normal-hover: #0051a4;
		--color-bg-link-emphasis: #000;
		--color-bg-link-emphasis-hover: #7a7a7a;
		--color-bg-link-emphasis-red-hover: #a1121d;
		--color-bg-link-back: #ebebeb;
		--color-bg-link-back-hover: #9c9c9c;
		--color-bg-link-blue: #0051a480;
		--color-bg-link-blue-hover: #002d5c;
		--color-bg-link-blue-transparent_hover: #0051a4e6;
		--color-border-gray-1: #9fa5a9;
		--color-border-gray-2: #d5d5d5;
		--color-shadow-gray-1: #00000029;
		--color-shadow-gray-2: #00000029;
		--color-home-gradation-gray: linear-gradient(180deg, #0000, #0000007a 55%);
		--color-home-gradation-blue: linear-gradient(200deg, #5f82df -23.46%, #0051a4 38.54%);
		--color-home-gradation-blue-02: #0051a4cc;
		--color-home-gradation-blue-03: #0051a480;
		--color-home-gradation-blue-04: #0051a4e6;
		--color-home-shadow-gray: #0051a414;
		--color-home-crosstalk-background: #053c8f;
		--color-sub-local-nav-link-background: #0051a4b8;
		--color-sub-local-nav-background-01: #7b7b7b;
		--color-sub-local-nav-background-02: #f6f6f6;
		--color-infographics-background: #f3f7ff;
		--color-infographics-banner-background: #fffffff2;
		--color-infographics-banner-shadow: #00000014;
		--lightest-color: var(--color-must-lightest);
		--darkest-color: var(--color-must-darkest);
		--base-font-color: var(--color-text-base-font-primary);
		--base-font-gray-color: var(--color-text-base-font-gray);
		--border-color: var(--color-must-darkest);
		--tone-primary-color: var(--color-tone-primary);
		--tone-secondary-color: var(--color-tone-secondary);
		--tone-tertiary-color: var(--color-tone-tertiary);
		--color-parts-base-color: #6f6f6f;
		--color-parts-name-color: var(--color-tone-primary);
		--color-parts-class-color: #9bc70b;
		--color-parts-element-color: #b53021;
		--noise-texture-image-10: url(/recruit/img/common/bg-texture-noise-10.webp);
		--noise-texture-image-5: url(/recruit/img/common/bg-texture-noise-5.webp);
		--noise-texture-image-2: url(/recruit/img/common/bg-texture-noise-2.webp);
		--base-scale-none: 0;
		--base-scale-xxs: 2px;
		--base-scale-xs: 4px;
		--base-scale-s: 8px;
		--base-scale-m: 16px;
		--base-scale-l: 24px;
		--base-scale-xl: 32px;
		--base-scale-2xl: 40px;
		--base-scale-3xl: 48px;
		--base-scale-4xl: 56px;
		--base-scale-5xl: 64px;
		--base-scale-6xl: 72px;
		--base-scale-7xl: 80px;
		--font-family-jp: 'Noto Sans JP', sans-serif;
		--font-family-en: 'Ubuntu', sans-serif;
		--font-weight-jp-regular: 400;
		--font-weight-jp-medium: 500;
		--font-weight-jp-bold: 700;
		--font-weight-en-medium: 500;
		--font-weight-en-bold: 700;
		--font-size-various-small: 0.875rem;
		--font-size-various-base: 1rem;
		--font-size-various-large: 1.125rem;
		--font-size-various-font-20: 1.25rem;
		--font-size-various-font-22: 1.375rem;
		--font-size-various-font-24: 1.5rem;
		--font-size-various-font-26: 1.625rem;
		--font-size-various-font-28: 1.75rem;
		--font-size-various-font-30: 1.875rem;
		--font-size-various-font-40: 2.5rem;
		--font-size-button-normal: 1rem;
		--font-size-button-small: 0.875rem;
		--font-size-title-h1: 2.5rem;
		--font-size-title-h2: 2rem;
		--font-size-title-h3: 1.75rem;
		--font-size-title-h4: 1.25rem;
		--font-size-title-h5: 1.125rem;
		--font-size-title-h6: 1.125rem;
		--base-font-size: var(--font-size-various-base);
		--base-line-height: 1.7;
		--view-size-page-frame: 1440px;
		--view-size-content-main: 1200px;
		--view-size-bge-content: 1080px;
		--content-margin-content-padding: 60px;
		--content-margin-content-mt: 56px;
		--content-margin-content-mb: 96px;
		--column-gap-none: 0;
		--column-gap-2col: 40px;
		--column-gap-3col: 32px;
		--column-gap-4col: 32px;
		--column-gap-5col: 24px;
		--radius-radius-none: 0;
		--radius-radius-small: 4px;
		--radius-radius-normal: 8px;
		--radius-radius-large: 10px;
		--radius-radius-max: 9999px;
		--z-index-stack-behind: -1;
		--z-index-stack-front: 1;
		--bgb-opt-bgb-opt--mb-none: 0;
		--bgb-opt-bgb-opt--mb-small: 24px;
		--bgb-opt-bgb-opt--mb-default: 64px;
		--bgb-opt-bgb-opt--mb-large: 80px;
	}
	@media (width < 768px) {
		:root {
			--view-size-page-frame: 375px;
			--view-size-content-main: 343px;
			--view-size-bge-content: 343px;
			--column-gap-2col: 24px;
			--column-gap-3col: 24px;
			--column-gap-4col: 24px;
			--column-gap-5col: 24px;
			--font-size-various-small: 0.75rem;
			--font-size-various-base: 0.875rem;
			--font-size-various-large: 1rem;
			--font-size-various-font-20: 1.125rem;
			--font-size-various-font-22: 1.25rem;
			--font-size-various-font-24: 1.375rem;
			--font-size-various-font-26: 1.5rem;
			--font-size-various-font-28: 1.625rem;
			--font-size-various-font-30: 1.75rem;
			--font-size-various-font-40: 2.375rem;
			--content-margin-content-padding: 16px;
			--content-margin-content-mt: 24px;
			--content-margin-content-mb: 80px;
			--bgb-opt-bgb-opt--mb-none: 0;
			--bgb-opt-bgb-opt--mb-small: 16px;
			--bgb-opt-bgb-opt--mb-default: 56px;
			--bgb-opt-bgb-opt--mb-large: 72px;
			--font-size-title-h1: 1.75rem;
			--font-size-title-h2: 1.5rem;
			--font-size-title-h3: 1.375rem;
			--font-size-title-h4: 1.25rem;
			--font-size-title-h5: 1.125rem;
			--font-size-title-h6: 1rem;
		}
	}
}
@layer general {
	* {
		scroll-behavior: auto;
		@media (prefers-reduced-motion: no-preference) {
			scroll-behavior: smooth;
		}
		&,
		&:after,
		&:before {
			box-sizing: border-box;
			min-inline-size: 0;
		}
		[id] {
			scroll-margin-top: 6rem;
		}
	}
}
@layer general {
	body {
		padding: 0;
		margin: 0;
		font-family: var(--font-family-jp);
		font-size: var(--font-size-various-base);
		line-height: var(--base-line-height);
		color: var(--color-text-base-font-primary);
	}
	button {
		border-radius: 0;
	}
	img {
		min-inline-size: 0;
		min-block-size: 0;
	}
}
@layer general {
}
@layer general {
}
@layer general {
	@property --stack-top {
		syntax: '<integer>';
		inherits: false;
		initial-value: calc(infinity);
	}
	@property --stack-header {
		syntax: '<integer>';
		inherits: false;
		initial-value: 20;
	}
	@property --stack-footer {
		syntax: '<integer>';
		inherits: false;
		initial-value: 20;
	}
	@property --stack-anchor {
		syntax: '<integer>';
		inherits: false;
		initial-value: 10;
	}
	@property --stack-local-nav {
		syntax: '<integer>';
		inherits: false;
		initial-value: 10;
	}
}
@layer general {
}
@layer general {
	@keyframes splide-loading {
		0% {
			transform: rotate(0);
		}
		to {
			transform: rotate(1turn);
		}
	}
	.splide__track--draggable {
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		user-select: none;
	}
	.splide__track--fade > .splide__list > .splide__slide {
		margin: 0 !important;
		opacity: 0;
		z-index: 0;
	}
	.splide__track--fade > .splide__list > .splide__slide.is-active {
		opacity: 1;
		z-index: 1;
	}
	.splide--rtl {
		direction: rtl;
	}
	.splide__track--ttb > .splide__list {
		display: block;
	}
	.splide__container {
		box-sizing: border-box;
		position: relative;
	}
	.splide__list {
		backface-visibility: hidden;
		display: flex;
		height: 100%;
		margin: 0 !important;
		padding: 0 !important;
	}
	.splide.is-initialized:not(.is-active) .splide__list {
		display: block;
	}
	.splide__pagination {
		align-items: center;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		margin: 0;
		pointer-events: none;
	}
	.splide__pagination li {
		display: inline-block;
		line-height: 1;
		list-style-type: none;
		margin: 0;
		pointer-events: auto;
	}
	.splide:not(.is-overflow) .splide__pagination {
		display: none;
	}
	.splide__progress__bar {
		width: 0;
	}
	.splide {
		position: relative;
		visibility: hidden;
	}
	.splide.is-initialized,
	.splide.is-rendered {
		visibility: visible;
	}
	.splide__slide {
		backface-visibility: hidden;
		box-sizing: border-box;
		flex-shrink: 0;
		list-style-type: none !important;
		margin: 0;
		position: relative;
	}
	.splide__slide img {
		vertical-align: bottom;
	}
	.splide__spinner {
		animation: splide-loading 1s linear infinite;
		border: 2px solid #999;
		border-left-color: #0000;
		border-radius: 50%;
		bottom: 0;
		contain: strict;
		display: inline-block;
		height: 20px;
		left: 0;
		margin: auto;
		position: absolute;
		right: 0;
		top: 0;
		width: 20px;
	}
	.splide__sr {
		clip: rect(0 0 0 0);
		border: 0;
		height: 1px;
		margin: -1px;
		overflow: hidden;
		padding: 0;
		position: absolute;
		width: 1px;
	}
	.splide__toggle.is-active .splide__toggle__play,
	.splide__toggle__pause {
		display: none;
	}
	.splide__toggle.is-active .splide__toggle__pause {
		display: inline;
	}
	.splide__track {
		overflow: hidden;
		position: relative;
		z-index: 0;
	}
}
@layer component {
	.c-page-home,
	.c-page-home__base {
		inline-size: 100%;
		block-size: 100%;
	}
	.c-page-home__base {
		display: grid;
		grid-template: 'header' auto 'main' 1fr 'nav-sitemap' auto 'footer' auto/1fr;
	}
	.c-page-home__header {
		position: sticky;
		inset-block-start: 0;
		z-index: var(--stack-header);
		grid-area: header;
	}
	.c-page-home__main {
		grid-area: main;
		> * {
			margin-inline: auto;
		}
	}
	.c-page-home__nav-sitemap {
		grid-area: nav-sitemap;
	}
	.c-page-home__footer {
		grid-area: footer;
	}
	.c-page-home__people {
		position: relative;
		padding-block-end: 12.5rem;
		isolation: isolate;
		@media (width < 768px) {
			padding-block-end: var(--base-scale-7xl);
		}
		&:after {
			position: absolute;
			inset-block-end: 24px;
			inset-inline-end: 0;
			inline-size: 175px;
			block-size: 244px;
			content: '';
			background-image: url(/recruit/img/home/bg-home-people-desktop.svg);
			background-repeat: no-repeat;
			background-position: 50%;
			background-size: contain;
			@media (width < 768px) {
				inset-block-end: -44px;
				inset-inline-end: 11px;
				inline-size: 76px;
				block-size: 95px;
				background-image: url(/recruit/img/home/bg-home-people-mobile.svg);
			}
		}
	}
	.c-page-home__people-heading {
		hgroup {
			display: flex;
			column-gap: var(--base-scale-l);
			align-items: center;
			justify-content: center;
			margin-block-end: var(--base-scale-2xl);
			@media (width < 768px) {
				flex-direction: column;
				margin-block-end: var(--base-scale-2xl);
			}
		}
		h2 {
			font-size: 3rem;
			font-style: normal;
			font-weight: 700;
			line-height: 1.7;
			color: var(--color-tone-primary);
			letter-spacing: 0.24rem;
			@media (width < 768px) {
				font-size: 2rem;
			}
		}
		p {
			padding-block-start: 0.25rem;
			font-family: var(--font-family-en);
			font-size: var(--font-size-various-font-30);
			font-style: normal;
			font-weight: 500;
			line-height: 1.5;
			@media (width < 768px) {
				padding-block-start: 0;
				font-size: var(--font-size-various-font-26);
			}
		}
	}
}
@layer component {
	.c-home-hero__wrap {
		position: relative;
		block-size: auto;
		aspect-ratio: 1440/920;
		margin-block: -76px 0;
		container-type: inline-size;
		overflow-x: clip;
		@media (width < 1400px) {
			margin-block: 0 0;
		}
		@media (width < 768px) {
			aspect-ratio: 375/578;
			margin-block: 0 0;
		}
	}
	.c-home-hero__heading {
		position: absolute;
		inset-block-start: 11.11111cqi;
		inset-inline-start: 3.81944cqi;
		z-index: var(--z-index-stack-front);
		transform: matrix(0.8912, -0.12, 0, 1, 0, 0);
		@media (width < 768px) {
			inset-block-start: 13.33333cqi;
			transform: matrix(0.99, -0.16, 0, 1.1, 0, 0);
		}
		img {
			display: block;
			inline-size: fit-content;
			block-size: 9.375cqi;
			@media (width < 768px) {
				block-size: auto;
			}
		}
	}
	.c-home-hero__heading-row {
		--c-home-hero-heading-marker-cut: 1.04167cqi;
		--c-home-hero-heading-marker-progress: 0;
		position: relative;
		display: block;
		inline-size: fit-content;
		@media (width < 768px) {
			&:first-child {
				position: relative;
				inset-block-start: 0.8cqi;
				inset-inline-start: -0.26667cqi;
				inline-size: 95.73333cqi;
				&:before {
					inline-size: calc(100% + 4.8cqi);
				}
			}
			&:nth-child(2) {
				position: relative;
				inset-block-start: 0;
				inset-inline-start: 1.86667cqi;
				inline-size: 58.93333cqi;
				&:before {
					inset-block: auto 0.29333cqi;
					inline-size: calc(100% + 6.93333cqi);
				}
			}
			&:nth-child(3) {
				position: relative;
				inset-block-start: 0.53333cqi;
				inset-inline-start: 34.4cqi;
				inline-size: 51.73333cqi;
				&:before {
					inline-size: calc(100% + 39.2cqi);
				}
			}
			&:nth-child(4) {
				display: none;
			}
		}
		&:before {
			--color-white: #fff;
			position: absolute;
			inset-block: 0;
			inset-inline-end: 0;
			z-index: var(--z-index-stack-front);
			inline-size: calc(100% + 7.98611cqi);
			block-size: 90%;
			margin: auto;
			pointer-events: none;
			content: '';
			background-color: var(--color-white);
			clip-path: polygon(
				clamp(
						var(--c-home-hero-heading-marker-cut),
						calc((max(var(--c-home-hero-heading-marker-progress) * 2 - 1, 0)) * 100%),
						100%
					)
					0,
				clamp(
						var(--c-home-hero-heading-marker-cut),
						calc((min(var(--c-home-hero-heading-marker-progress) * 2, 1)) * 100%),
						100%
					)
					0,
				clamp(
						0%,
						calc(
							(min(var(--c-home-hero-heading-marker-progress) * 2, 1)) * 100% -
								var(--c-home-hero-heading-marker-cut)
						),
						calc(100% - var(--c-home-hero-heading-marker-cut))
					)
					100%,
				clamp(
						0%,
						calc(
							(max(var(--c-home-hero-heading-marker-progress) * 2 - 1, 0)) * 100% -
								var(--c-home-hero-heading-marker-cut)
						),
						calc(100% - var(--c-home-hero-heading-marker-cut))
					)
					100%
			);
			transform-origin: left center;
			will-change: clip-path;
		}
	}
	.c-home-hero__heading-hidden {
		position: absolute;
		inline-size: 1px;
		block-size: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		white-space: nowrap;
		border: 0;
		clip-path: inset(50%);
	}
	.c-home-hero__group {
		position: relative;
		inline-size: 100%;
		block-size: 100%;
	}
	.c-home-hero__slides {
		position: absolute;
		inset-block-end: 0;
		inset-inline-start: 28.47222cqi;
		z-index: var(--z-index-stack-base);
		inline-size: 71.66667cqi;
		aspect-ratio: 1030/1079;
		overflow: hidden;
		isolation: isolate;
		filter: drop-shadow(0 5.1839px 31.1038px rgba(0, 0, 0, 0.08));
		mask-image: url(/recruit/img/home/pict-hero-slide-mask-desktop.svg);
		mask-repeat: no-repeat;
		mask-position: center;
		mask-size: 100% 100%;
		@media (width < 768px) {
			inset-block-end: -2.13333cqi;
			inset-inline-start: 0;
			inline-size: 100%;
			block-size: auto;
			aspect-ratio: 938/1002;
			mask-image: url(/recruit/img/home/pict-hero-slide-mask-mobile.svg);
		}
		img {
			display: block;
			inline-size: 100%;
			block-size: 100%;
			object-fit: cover;
		}
	}
	.c-home-hero__slide {
		position: absolute;
		inset: 0;
		z-index: var(--z-index-stack-base);
		overflow: hidden;
		opacity: 0;
		will-change: opacity;
		img {
			transform-origin: center center;
			will-change: transform;
		}
	}
	.c-home-hero__slides-cover {
		--z-index-slides-cover: 3;
		position: absolute;
		inset: 0;
		z-index: var(--z-index-slides-cover);
		display: block;
		pointer-events: none;
		background-color: var(--color-tone-primary);
		transform-origin: left center;
		scale: 0 1;
		will-change: transform, opacity;
		@media (width < 768px) {
			mask-size: 100% 100%;
		}
	}
	.c-home-hero__bg {
		--z-index-stack-back: -1;
		position: absolute;
		inset-block-end: -4.09722cqi;
		inset-inline-start: -40.06944cqi;
		z-index: var(--z-index-stack-back);
		display: block;
		inline-size: 92.56944cqi;
		aspect-ratio: 1333/1109;
		@media (width < 768px) {
			inset-block: -28.53333cqi auto;
			inset-inline-start: -22.93333cqi;
			inline-size: 150.66667cqi;
		}
	}
	.c-home-hero__decoration-01 {
		position: absolute;
		inset-block-start: 8.33333cqi;
		inset-inline-start: 2.77778cqi;
		inline-size: 5.41667cqi;
		@media (width < 768px) {
			inset-block-start: 8cqi;
			inset-inline-start: 2.4cqi;
			inline-size: 17.6cqi;
		}
		svg {
			display: block;
			inline-size: 100%;
			block-size: auto;
		}
	}
	.c-home-hero__decoration-01-desktop {
		display: block;
		@media (width < 768px) {
			display: none;
		}
		svg {
			display: block;
			inline-size: 100%;
			block-size: auto;
			overflow: visible;
		}
	}
	.c-home-hero__decoration-01-mobile {
		display: none;
		@media (width < 768px) {
			display: block;
		}
	}
	.c-home-hero__decoration-02 {
		position: absolute;
		inset-block-end: 0;
		inset-inline-end: 7.22222cqi;
		inline-size: 8.05556cqi;
		@media (width < 768px) {
			inset-block-start: 125.06667cqi;
			inset-inline-start: 78.13333cqi;
			inline-size: 18.4cqi;
		}
		svg {
			display: block;
			inline-size: 100%;
			block-size: auto;
			overflow: visible;
		}
	}
	.c-home-hero__toggle {
		--c-home-hero-toggle-surface: #fff;
		--c-home-hero-toggle-icon: var(--color-tone-primary);
		position: absolute;
		inset-block-start: 55.55556cqi;
		inset-inline-end: 2.77778cqi;
		display: grid;
		place-items: center;
		inline-size: 32px;
		block-size: 32px;
		padding: 0;
		cursor: pointer;
		background: none;
		border: none;
		@media (width < 768px) {
			inset-block-start: 152cqi;
			inset-inline-end: 4.26667cqi;
		}
		@media (any-hover: hover) {
			&:not(:disabled):hover {
				--c-home-hero-toggle-surface: var(--color-tone-primary);
				--c-home-hero-toggle-icon: #fff;
			}
		}
		&:focus-visible {
			--c-home-hero-toggle-surface: var(--color-tone-primary);
			--c-home-hero-toggle-icon: #fff;
		}
		&:disabled {
			cursor: default;
		}
	}
	.c-home-hero__toggle-pause,
	.c-home-hero__toggle-play {
		display: block;
		inline-size: 100%;
		block-size: 100%;
		svg {
			display: block;
			inline-size: 100%;
			block-size: 100%;
		}
	}
}
@layer component {
	.c-home-message__wrap {
		padding-block-start: 4.5rem;
		@media (width < 768px) {
			padding-block-start: 4.0625rem;
		}
	}
	.c-home-message__columns {
		display: flex;
		column-gap: 2.5rem;
		align-items: center;
		justify-content: space-between;
		max-inline-size: 70.125rem;
		padding-inline: 2.5rem;
		margin-inline: auto;
		@media (width < 768px) {
			flex-direction: column;
			row-gap: var(--base-scale-l);
			align-items: start;
			justify-content: start;
			padding-inline: 1rem;
		}
	}
	.c-home-message__title {
		--c-home-message-title-gradient: linear-gradient(
			109.09deg,
			#0051a4 -27.73%,
			#705892 66.87%,
			#df5f7f 119.11%
		);
		flex-shrink: 0;
		font-family: var(--font-family-en);
		font-size: 10rem;
		font-style: normal;
		font-weight: 500;
		font-feature-settings: normal;
		line-height: 1;
		color: var(--color-tone-primary);
		letter-spacing: 0;
		white-space: nowrap;
		background: var(--c-home-message-title-gradient);
		background-clip: text;
		writing-mode: vertical-rl;
		-webkit-text-fill-color: #0000;
		@media (width < 768px) {
			font-size: 2.375rem;
			font-style: normal;
			font-weight: 500;
			line-height: 100%;
			white-space: normal;
			writing-mode: initial;
		}
	}
	.c-home-message__title.c-home-message__title-observe {
		opacity: 0;
		translate: 0 2.5rem;
		transition:
			opacity 0.36s cubic-bezier(0.22, 1, 0.36, 1),
			translate 0.56s cubic-bezier(0.22, 1, 0.36, 1);
	}
	.c-home-message__title.c-home-message__title-visible {
		opacity: 1;
		translate: 0 0;
	}
	@media (prefers-reduced-motion: reduce) {
		.c-home-message__title.c-home-message__title-observe {
			opacity: 1;
			translate: 0 0;
			transition: none;
		}
	}
	.c-home-message__content {
		--c-home-message-marker-highlight-color: #0051a4;
		position: relative;
		display: flex;
		flex: 0 1 auto;
		flex-direction: column;
		inline-size: 100%;
		max-inline-size: 682px;
		font-family: var(--font-family-jp);
		font-size: var(--font-size-various-font-22);
		font-style: normal;
		font-weight: var(--font-weight-jp-bold);
		line-height: 3.2;
		color: var(--color-text-base-font-primary);
		@media (width < 768px) {
			inline-size: 100%;
			font-size: 1rem;
			font-weight: 500;
			line-height: 2.8;
		}
		&.c-home-message__content-mobile {
			display: none;
			@media (width < 768px) {
				display: block;
			}
		}
		&.c-home-message__content-desktop {
			@media (width < 768px) {
				display: none;
			}
		}
	}
	.c-home-message__measure {
		display: block;
		visibility: hidden;
		inline-size: 100%;
		max-block-size: 0;
		white-space: normal;
		pointer-events: none;
	}
	.c-home-message__marker {
		position: relative;
		display: block;
		inline-size: fit-content;
		max-inline-size: 100%;
		margin: 0;
	}
	.c-home-message__marker:before {
		position: absolute;
		inset-block: 0.1em 0;
		inset-inline-start: -1em;
		z-index: var(--z-index-stack-front);
		inline-size: calc(100% + 2em);
		block-size: 1.18em;
		margin: auto;
		pointer-events: none;
		content: '';
		background-color: var(--c-home-message-marker-highlight-color);
		clip-path: url('data:image/svg+xml;utf8,%3Csvg xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="p" clipPathUnits="objectBoundingBox"%3E%3Cpolygon points="15 0, 15 0, 0 1, 0 1"/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E#p');
		clip-path: polygon(15px 0, 15px 0, 0 100%, 0 100%);
		transform-origin: left center;
		will-change: transform;
	}
	.c-home-message__marker-text {
		--color-white: #fff;
		position: relative;
		display: inline-block;
		color: var(--color-white);
		white-space: nowrap;
		transition: color 0s linear 0.4s;
		will-change: clip-path;
	}
	.c-home-message__marker.c-home-message__marker-visible:before {
		animation-name: marker-draw, marker-exit;
		animation-duration: 0.4s, 0.65s;
		animation-timing-function:
			cubic-bezier(0.83, 0, 0.17, 1), cubic-bezier(0.87, 0, 0.13, 1);
		animation-delay: 0s, 0.4s;
		animation-fill-mode: forwards, forwards;
	}
	.c-home-message__marker.c-home-message__marker-visible .c-home-message__marker-text {
		color: var(--color-text-base-font-primary);
	}
	.c-home-message__marker.c-home-message__marker-visible.c-home-message__marker-skip-animation
		.c-home-message__marker-text,
	.c-home-message__marker.c-home-message__marker-visible.c-home-message__marker-skip-animation:before {
		animation: none;
	}
	@keyframes marker-draw {
		0% {
			clip-path: url('data:image/svg+xml;utf8,%3Csvg xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="p" clipPathUnits="objectBoundingBox"%3E%3Cpolygon points="15 0, 15 0, 0 1, 0 1"/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E#p');
			clip-path: polygon(15px 0, 15px 0, 0 100%, 0 100%);
		}
		to {
			clip-path: url('data:image/svg+xml;utf8,%3Csvg xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="p" clipPathUnits="objectBoundingBox"%3E%3Cpolygon points="15 0, 1 0, NaN - 15) 1, 0 1"/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E#p');
			clip-path: polygon(15px 0, 100% 0, calc(100% - 15px) 100%, 0 100%);
		}
	}
	@keyframes marker-exit {
		0% {
			clip-path: url('data:image/svg+xml;utf8,%3Csvg xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="p" clipPathUnits="objectBoundingBox"%3E%3Cpolygon points="15 0, 1 0, NaN - 15) 1, 0 1"/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E#p');
			clip-path: polygon(15px 0, 100% 0, calc(100% - 15px) 100%, 0 100%);
		}
		to {
			clip-path: url('data:image/svg+xml;utf8,%3Csvg xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="p" clipPathUnits="objectBoundingBox"%3E%3Cpolygon points="1 0, 1 0, NaN - 15) 1, NaN - 15) 1"/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E#p');
			clip-path: polygon(100% 0, 100% 0, calc(100% - 15px) 100%, calc(100% - 15px) 100%);
		}
	}
	@media (prefers-reduced-motion: reduce) {
		.c-home-message__marker:before {
			display: none;
		}
		.c-home-message__marker-text {
			clip-path: none;
		}
		.c-home-message__marker.c-home-message__marker-visible .c-home-message__marker-text,
		.c-home-message__marker.c-home-message__marker-visible:before {
			animation: none;
		}
		.c-home-message__marker.c-home-message__marker-visible.c-home-message__marker-skip-animation:before {
			display: none;
		}
		.c-home-message__marker.c-home-message__marker-visible.c-home-message__marker-skip-animation
			.c-home-message__marker-text {
			clip-path: none;
		}
	}
	.c-home-message__spacer {
		position: relative;
		margin-block-start: 10.4375rem;
		@media (width < 768px) {
			margin-block-start: 4rem;
		}
	}
	.c-home-message__decoration-02 {
		position: absolute;
		inset-block-start: -8.25rem;
		inset-inline-start: 2.5rem;
		z-index: var(--z-index-stack-front);
		inline-size: 6.5625rem;
		@media (width < 768px) {
			inset-block-start: -3.0625rem;
			inset-inline-start: 0.9375rem;
			inline-size: 3rem;
			rotate: 180deg;
		}
	}
}
@layer component {
	.c-home-company__wrap {
		max-inline-size: calc(80rem + var(--content-margin-content-padding) * 2);
		padding-inline: var(--content-margin-content-padding);
		margin-block: 12.5rem;
		margin-inline: auto;
		@media (width < 768px) {
			margin-block: var(--base-scale-7xl);
		}
	}
	.c-home-company__content {
		display: grid;
		grid-template-areas: 'title btn' 'text text';
		grid-template-columns: 1fr auto;
		row-gap: var(--base-scale-2xl);
		align-items: center;
		margin-block-end: var(--base-scale-7xl);
		@media (width < 768px) {
			grid-template-areas: 'title' 'text' 'btn';
			grid-template-columns: 1fr;
			margin-block-end: var(--base-scale-5xl);
		}
	}
	.c-home-company__title {
		grid-area: title;
	}
	.c-home-company__title-main {
		font-size: 3rem;
		font-style: normal;
		font-weight: 700;
		line-height: 1.7;
		color: var(--color-tone-primary);
		letter-spacing: 0.24rem;
		@media (width < 768px) {
			font-size: 2rem;
		}
	}
	.c-home-company__title-sub {
		font-family: var(--font-family-en);
		font-size: var(--font-size-various-font-30);
		font-style: normal;
		font-weight: 500;
		line-height: 1.5;
		@media (width < 768px) {
			font-size: var(--font-size-various-font-28);
		}
	}
	.c-home-company__btn a {
		position: relative;
		display: flex;
		grid-area: btn;
		align-items: center;
		justify-content: center;
		inline-size: 17.5rem;
		min-block-size: 4rem;
		padding-block: var(--base-scale-s);
		padding-inline: 2.75rem;
		font-size: var(--font-size-button-normal);
		font-weight: 700;
		line-height: 1.5;
		color: var(--color-must-lightest);
		cursor: pointer;
		background-color: var(--color-bg-link-emphasis);
		transition:
			background-color 0.3s ease-out,
			color 0.3s ease-out;
		@media (width < 768px) {
			inline-size: 100%;
			min-inline-size: revert;
			margin-inline: auto;
		}
		@media (any-hover: hover) {
			&:hover {
				color: var(--color-must-lightest);
				background-color: var(--color-bg-link-emphasis-hover);
			}
		}
		&:after {
			position: absolute;
			inset-inline-end: 1rem;
			display: inline-block;
			inline-size: 1.5rem;
			block-size: 1.5rem;
			content: '';
			background: url(/recruit/img/common/icon-link-arrow-right-02.svg) no-repeat 50% /
				contain;
		}
	}
	.c-home-company__text {
		grid-area: text;
		font-weight: 500;
		line-height: 1.7;
	}
	.c-home-company__infographics {
		display: flex;
		border: 1px solid var(--color-border-gray-1);
		@media (width < 1200px) {
			flex-direction: column;
		}
		@media (any-hover: hover) {
			&:hover {
				[class='c-home-company__infographics-image'],
				[class='c-home-company__infographics-textarea'] {
					background-color: var(--color-bg-base-bg-light-blue);
				}
			}
		}
	}
	.c-home-company__infographics-textarea {
		padding-block: var(--base-scale-3xl);
		padding-inline: var(--base-scale-2xl);
		line-height: 1.7;
		transition: background-color 0.3s ease-out;
		@media (width < 768px) {
			padding-block: var(--base-scale-xl);
			padding-inline: var(--base-scale-l);
		}
	}
	.c-home-company__infographics-title {
		display: flex;
		margin-block-end: var(--base-scale-l);
		font-size: var(--font-size-title-h3);
	}
	.c-home-company__infographics-title:before {
		display: inline-block;
		inline-size: 32px;
		block-size: 32px;
		margin-block-start: 0.3em;
		margin-inline-end: var(--base-scale-m);
		content: '';
		background: url(/recruit/img/common/icon-arrow-bg-primary-right-01.svg) no-repeat
			50% / contain;
		@media (width < 768px) {
			margin-block-start: 0.15em;
		}
	}
	.c-home-company__infographics-text {
		font-size: var(--font-size-various-base);
	}
	.c-home-company__infographics-image {
		flex-shrink: 0;
		inline-size: 45.54688%;
		transition: background-color 0.3s ease-out;
		@media (1200px <= width < 1400px) {
			inline-size: 52.48826%;
		}
		@media (width < 1200px) {
			inline-size: 100%;
		}
		img {
			inline-size: 100%;
			block-size: auto;
		}
	}
}
@layer component {
	.c-home-business__wrap {
		max-inline-size: calc(80rem + var(--content-margin-content-padding) * 2);
		padding-inline: var(--content-margin-content-padding);
		margin-block-end: 12.5rem;
		margin-inline: auto;
		@media (width < 768px) {
			margin-block-end: var(--base-scale-7xl);
		}
	}
	.c-home-business__title {
		display: flex;
		column-gap: var(--base-scale-l);
		align-items: center;
		margin-block-end: 2.9375rem;
		@media (width < 768px) {
			flex-direction: column;
			align-items: flex-start;
			margin-block-end: var(--base-scale-2xl);
		}
	}
	.c-home-business__title-main {
		font-size: 3rem;
		font-style: normal;
		font-weight: 700;
		line-height: 1.7;
		color: var(--color-tone-primary);
		letter-spacing: 0.24rem;
		@media (width < 768px) {
			font-size: 2rem;
		}
	}
	.c-home-business__title-sub {
		padding-block-start: 0.25rem;
		font-family: var(--font-family-en);
		font-size: var(--font-size-various-font-30);
		font-style: normal;
		font-weight: 500;
		line-height: 1.5;
		@media (width < 768px) {
			padding-block-start: 0;
			font-size: var(--font-size-various-font-26);
		}
	}
	.c-home-business__card {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: var(--base-scale-m);
		@media (width < 992px) {
			grid-template-columns: 1fr;
		}
	}
	.c-home-business__card-item {
		position: relative;
		@media (any-hover: hover) {
			&:hover {
				[class='c-home-business__card-item-image'] {
					img {
						@media (prefers-reduced-motion: no-preference) {
							scale: 1.1;
						}
					}
				}
				[class='c-home-business__card-item-title'] {
					background-color: var(--color-bg-link-blue-transparent_hover);
				}
			}
		}
	}
	.c-home-business__card-item-image {
		overflow: hidden;
	}
	.c-home-business__card-item-image img {
		inline-size: 100%;
		block-size: auto;
		aspect-ratio: 416/470;
		object-fit: cover;
		@media (prefers-reduced-motion: no-preference) {
			transition: scale 0.3s ease-out;
		}
		@media (width < 992px) {
			aspect-ratio: 343/240;
		}
	}
	.c-home-business__card-item-title {
		position: absolute;
		inset-block-end: 0;
		inset-inline: 0;
		padding-block: var(--base-scale-xl);
		padding-inline: calc(var(--base-scale-l) + var(--base-scale-m) + 24px)
			var(--base-scale-m);
		font-size: var(--font-size-title-h3);
		font-weight: 700;
		line-height: 1.7;
		color: var(--color-must-lightest);
		background-color: var(--color-bg-link-blue);
		backdrop-filter: blur(8px);
		transition: background-color 0.3s ease-out;
		@media (width < 992px) {
			padding-block: var(--base-scale-m);
			padding-inline: calc(var(--base-scale-l) + 34px) var(--base-scale-m);
		}
		&:before {
			position: absolute;
			inset-block: 0;
			inset-inline-start: var(--base-scale-l);
			display: inline-block;
			inline-size: 24px;
			block-size: 24px;
			margin-block: auto;
			content: '';
			background: url(/recruit/img/common/icon-arrow-bg-primary-right-01.svg) no-repeat
				50% / contain;
		}
	}
}
@layer component {
	.c-home-environment__wrap {
		position: relative;
		max-inline-size: 85rem;
		margin-block-end: 12.5rem;
		margin-inline: auto;
		@media (width < 768px) {
			margin-block-end: var(--base-scale-7xl);
		}
	}
	.c-home-environment__wrap:before {
		position: absolute;
		inset-block-start: 13rem;
		inset-inline-start: 1rem;
		inline-size: 200px;
		block-size: auto;
		aspect-ratio: 200/272;
		content: '';
		background: url(/recruit/img/home/pict-decoration-01.svg) no-repeat 50% / cover;
		translate: 0 -100%;
		@media (width < 992px) {
			display: none;
		}
	}
	.c-home-environment__title {
		display: flex;
		column-gap: var(--base-scale-l);
		align-items: center;
		justify-content: center;
		margin-block-end: var(--base-scale-7xl);
		@media (width < 992px) {
			flex-direction: column;
			margin-block-end: var(--base-scale-2xl);
		}
	}
	.c-home-environment__title-main {
		font-size: 3rem;
		font-style: normal;
		font-weight: 700;
		line-height: 1.7;
		color: var(--color-tone-primary);
		letter-spacing: 0.24rem;
		@media (width < 768px) {
			font-size: 2rem;
		}
	}
	.c-home-environment__title-sub {
		padding-block-start: 0.25rem;
		font-family: var(--font-family-en);
		font-size: var(--font-size-various-font-30);
		font-style: normal;
		font-weight: 500;
		line-height: 1.5;
		@media (width < 768px) {
			padding-block-start: 0;
			font-size: var(--font-size-various-font-26);
		}
	}
	.c-home-environment__content {
		padding-block: 7.5rem;
		padding-inline: 2.5rem;
		background:
			var(--noise-texture-image-2) repeat 600px 600px,
			var(--color-bg-bgb-bgb-opt--bg-gray);
		@media (width < 768px) {
			padding-block: var(--base-scale-2xl);
			padding-inline: var(--base-scale-m);
		}
	}
	.c-home-environment__content-head {
		display: grid;
		grid-template-columns: 1fr auto;
		gap: var(--base-scale-2xl);
		align-items: center;
		margin-block-end: var(--base-scale-5xl);
		container-type: inline-size;
		overflow: hidden;
		@media (width < 768px) {
			grid-template-columns: 1fr;
			margin-block-end: var(--base-scale-2xl);
		}
	}
	.c-home-environment__content-textarea {
		padding-inline-start: 50px;
		@media (width < 768px) {
			padding-inline-start: 0;
		}
	}
	.c-home-environment__content-title {
		position: relative;
		padding-block: 2.5rem;
		font-size: var(--font-size-title-h3);
		font-weight: 700;
		line-height: 1.7;
		isolation: isolate;
		@media (width < 768px) {
			padding-block: 10px;
			padding-inline-start: 2rem;
			margin-block-end: var(--base-scale-m);
		}
	}
	.c-home-environment__content-title span {
		position: relative;
		z-index: var(--z-index-stack-front);
	}
	.c-home-environment__content-title:before {
		position: absolute;
		inset-block: 0;
		inset-inline-start: -2.5rem;
		z-index: var(--z-index-stack-behind);
		display: flex;
		align-self: center;
		font-family: var(--font-family-en);
		font-size: 10cqi;
		font-weight: 700;
		line-height: 1;
		color: var(--color-must-lightest);
		white-space: nowrap;
		content: 'CHALLENGE';
		@media (width < 768px) {
			inset-inline-start: -0.5rem;
			font-size: 3.5rem;
		}
	}
	.c-home-environment__content-title:after {
		position: absolute;
		inset-block: 0;
		inset-inline-start: -3.125rem;
		display: inline-block;
		inline-size: 3rem;
		block-size: 2.3125rem;
		margin-block: auto;
		content: '';
		background: url(/recruit/img/common/icon-text-maker-red.svg) no-repeat 50% / contain;
		@media (width < 768px) {
			inset-inline-start: 0;
			inline-size: 1.5rem;
		}
	}
	.c-home-environment__content-text {
		font-weight: 500;
		line-height: 1.7;
	}
	.c-home-environment__content-btn {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		inline-size: 17.5rem;
		block-size: fit-content;
		min-block-size: 4rem;
		padding-block: var(--base-scale-s);
		padding-inline: 2.75rem;
		margin-inline-end: 2.5rem;
		font-size: var(--font-size-button-normal);
		font-weight: 700;
		line-height: 1.5;
		color: var(--color-must-lightest);
		text-align: center;
		background-color: var(--color-bg-link-emphasis);
		transition:
			background-color 0.3s ease-out,
			color 0.3s ease-out;
		@media (width < 768px) {
			inline-size: 100%;
			min-inline-size: revert;
			margin-inline: auto;
		}
		@media (any-hover: hover) {
			&:hover {
				color: var(--color-must-lightest);
				background-color: var(--color-bg-link-emphasis-hover);
			}
		}
		&:after {
			position: absolute;
			inset-inline-end: 1rem;
			display: inline-block;
			inline-size: 1.5rem;
			block-size: 1.5rem;
			content: '';
			background-image: url(/recruit/img/common/icon-link-arrow-right-02.svg);
			background-repeat: no-repeat;
			background-position: 50%;
			background-size: contain;
		}
	}
	.c-home-environment__content-card {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: var(--column-gap-3col);
		margin-block-end: var(--base-scale-7xl);
		margin-inline: 2.5rem;
		@media (width < 992px) {
			grid-template-columns: 1fr;
			margin-block-end: var(--base-scale-xl);
			margin-inline: 0;
		}
	}
	.c-home-environment__content-card-item {
		position: relative;
		display: grid;
		padding-block: var(--base-scale-2xl);
		padding-inline: var(--base-scale-m);
		background-color: var(--color-must-lightest);
		border: 1px solid #0000;
		transition:
			background-color 0.3s ease-out,
			border-color 0.3s ease-out;
		@media (any-hover: hover) {
			&:hover {
				background-color: var(--color-bg-base-bg-light-blue);
				border-color: var(--color-tone-primary);
			}
		}
	}
	.c-home-environment__content-card-item:not(
		:has(.c-home-environment__content-card-item-image-big)
	) {
		row-gap: var(--base-scale-l);
		@media (width < 992px) {
			row-gap: var(--base-scale-m);
		}
	}
	.c-home-environment__content-card-item:after {
		position: absolute;
		inset-block-end: 1rem;
		inset-inline-end: 1rem;
		display: inline-block;
		inline-size: 24px;
		block-size: 24px;
		content: '';
		background: url(/recruit/img/common/icon-arrow-bg-primary-right-01.svg) no-repeat
			50% / contain;
	}
	.c-home-environment__content-card-item-title {
		font-size: var(--font-size-various-font-22);
		font-weight: 700;
		line-height: 1.7;
		color: var(--color-tone-primary);
		text-align: center;
	}
	.c-home-environment__content-card-item-image {
		text-align: center;
		img {
			inline-size: 100%;
			block-size: auto;
			max-block-size: 146px;
		}
	}
	.c-home-environment__content-card-item:has(
			.c-home-environment__content-card-item-image-big
		)
		.c-home-environment__content-card-item-image
		img {
		max-block-size: 170px;
	}
	.c-home-environment__content-other {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		column-gap: 5rem;
		margin-inline: 2.5rem;
		@media (width < 992px) {
			grid-template-columns: 1fr;
			row-gap: var(--base-scale-xl);
			margin-inline: 0;
		}
	}
	.c-home-environment__content-other-item {
		container-type: inline-size;
		isolation: isolate;
	}
	.c-home-environment__content-other-item-title {
		position: relative;
		padding-block: var(--base-scale-l);
		font-size: var(--font-size-title-h3);
		font-weight: 700;
		line-height: 1.7;
		isolation: isolate;
		@media (width < 768px) {
			padding-block: 8px;
			padding-inline-start: 2rem;
			margin-block-end: var(--base-scale-s);
		}
	}
	.c-home-environment__content-other-item-title span {
		position: relative;
		z-index: var(--z-index-stack-front);
		padding-inline-start: 42px;
		@media (width < 768px) {
			padding-inline-start: 0;
		}
	}
	.c-home-environment__content-other-item-title:before {
		position: absolute;
		inset-block: 0;
		inset-inline-start: 0;
		z-index: var(--z-index-stack-behind);
		display: flex;
		align-self: center;
		font-family: var(--font-family-en);
		font-size: 11.42857cqi;
		font-weight: 700;
		line-height: 1;
		color: var(--color-must-lightest);
		white-space: nowrap;
		content: 'CHALLENGE';
		@media (width < 768px) {
			inset-inline-start: -0.5rem;
			font-size: 3.5rem;
		}
	}
	.c-home-environment__content-other-item:first-of-type
		.c-home-environment__content-other-item-title:before {
		content: 'WORKSTYLE';
	}
	.c-home-environment__content-other-item:nth-of-type(2)
		.c-home-environment__content-other-item-title:before {
		content: 'OUR OFFICE';
	}
	.c-home-environment__content-other-item-title:after {
		position: absolute;
		inset-block: 0;
		inset-inline-start: -0.5rem;
		display: inline-block;
		inline-size: 3rem;
		block-size: 2.3125rem;
		margin-block: auto;
		content: '';
		background: url(/recruit/img/common/icon-text-maker-red.svg) no-repeat 50% / contain;
		@media (width < 768px) {
			inset-inline-start: 0;
			inline-size: 1.5rem;
		}
	}
	.c-home-environment__content-other-item-link {
		position: relative;
		z-index: var(--z-index-stack-front);
		display: grid;
		align-items: center;
		aspect-ratio: 592/160;
		overflow: hidden;
		@media (any-hover: hover) {
			&:hover {
				span {
					background-color: var(--color-bg-link-blue-transparent_hover);
				}
				&:after {
					@media (prefers-reduced-motion: no-preference) {
						scale: 1.1;
					}
				}
			}
		}
		&:after {
			position: absolute;
			z-index: var(--z-index-stack-behind);
			inline-size: 100%;
			block-size: 100%;
			content: '';
			@media (prefers-reduced-motion: no-preference) {
				transition: scale 0.3s ease-out;
			}
		}
	}
	.c-home-environment__content-other-item:first-of-type
		.c-home-environment__content-other-item-link:after {
		background: url(/recruit/img/home/bg-environment-benefits.jpg) no-repeat 50% / cover;
	}
	.c-home-environment__content-other-item:nth-of-type(2)
		.c-home-environment__content-other-item-link:after {
		background: url(/recruit/img/home/bg-environment-ouroffice.jpg) no-repeat 50% / cover;
	}
	.c-home-environment__content-other-item-link span {
		display: flex;
		gap: var(--base-scale-m);
		align-items: center;
		block-size: 100%;
		padding-inline: var(--base-scale-l) var(--base-scale-m);
		font-size: var(--font-size-title-h3);
		font-weight: 700;
		line-height: 1.7;
		color: var(--color-must-lightest);
		background-color: var(--color-bg-link-blue);
		backdrop-filter: blur(8px);
		transition: background-color 0.3s ease-out;
	}
	.c-home-environment__content-other-item-link span:before {
		inset-inline-start: var(--base-scale-l);
		display: block;
		inline-size: 24px;
		block-size: 24px;
		margin-block: auto;
		content: '';
		background: url(/recruit/img/common/icon-arrow-bg-primary-right-01.svg) no-repeat
			50% / contain;
	}
}
@layer component {
	.c-home-people {
		--c-home-people-content-width: 1360px;
		--c-home-people-gutter: var(--base-scale-2xl);
		position: relative;
		display: grid;
		grid-template-columns: [full-start] minmax(
				var(--c-home-people-gutter),
				1fr
			) [content-start] minmax(
				0,
				var(--c-home-people-content-width)
			) [content-end] minmax(var(--c-home-people-gutter), 1fr) [full-end];
		@media (width < 768px) {
			--c-home-people-gutter: var(--base-scale-m);
			overflow: hidden;
		}
		& > * {
			grid-column: content;
		}
	}
	.c-home-people__body {
		position: relative;
		display: grid;
		grid-template-columns: subgrid;
		grid-column: full;
		row-gap: var(--base-scale-2xl);
		padding-block: var(--base-scale-7xl);
		@media (width < 768px) {
			row-gap: var(--base-scale-5xl);
			padding-block: var(--base-scale-5xl);
		}
		> * {
			grid-column: content;
		}
		&:before {
			position: absolute;
			inset-inline: 0;
			z-index: var(--z-index-stack-behind);
			inline-size: min(calc(100% - var(--base-scale-2xl) * 2), 1360px);
			block-size: 100%;
			margin-inline: auto;
			content: '';
			background-image: var(--noise-texture-image-10), var(--color-home-gradation-blue);
			background-repeat: repeat, no-repeat;
			background-position: 50%, 50%;
			background-size:
				600px 600px,
				cover;
			@media (width < 768px) {
				inline-size: calc(100% - var(--base-scale-m) * 2);
			}
		}
	}
	.c-home-people__crosstalk {
		display: grid;
		grid-template-columns: subgrid;
		grid-column: full;
		> .c-home-people__heading,
		> .c-home-people__link {
			grid-column: content;
		}
		> .c-home-people__crosstalk-contents {
			grid-column: full;
			@media (width < 768px) {
				grid-column: content;
			}
		}
		.c-home-people__heading {
			justify-content: end;
		}
		.c-home-people__heading-bg {
			text-align: end;
		}
	}
	.c-home-people__heading {
		position: relative;
		display: flex;
		padding-block: 37px;
		overflow: visible;
		@media (width < 768px) {
			padding-block: 11px;
			padding-inline: var(--base-scale-m) 0;
			margin-block-end: var(--base-scale-l);
		}
		h2 {
			position: relative;
			display: inline-block;
			padding-inline-start: 46px;
			font-size: 2rem;
			font-weight: 700;
			line-height: 1.7;
			color: var(--color-must-lightest);
			letter-spacing: 0.32rem;
			@media (width < 768px) {
				padding-inline-start: 37px;
				font-size: var(--font-size-various-font-26);
				letter-spacing: 0.24rem;
			}
			&:before {
				position: absolute;
				inset-block: 0;
				inset-inline-start: 0;
				display: inline-block;
				inline-size: 3rem;
				block-size: 2.3125rem;
				margin-block: auto;
				content: '';
				background: url(/recruit/img/common/icon-text-maker-red.svg) no-repeat 50% /
					contain;
				@media (width < 768px) {
					inset-inline-start: 0;
					inline-size: 1.5rem;
				}
			}
		}
	}
	.c-home-people__heading-bg {
		position: absolute;
		inset-block: 0;
		block-size: fit-content;
		margin-block: auto;
		font-family: var(--font-family-en);
		font-size: 8rem;
		font-weight: 700;
		line-height: 1;
		color: var(--color-must-lightest);
		white-space: nowrap;
		opacity: 0.2;
		@media (width < 768px) {
			inset-inline: 0;
			inline-size: 100%;
			margin-inline: auto;
			font-size: 4rem;
		}
	}
	.c-home-people__link {
		padding-block-start: var(--base-scale-5xl);
		@media (width < 768px) {
			padding-block-start: var(--base-scale-l);
		}
		a {
			position: relative;
			display: flex;
			align-items: center;
			justify-content: center;
			inline-size: 17.5rem;
			max-inline-size: min(100%, 25rem);
			block-size: auto;
			min-block-size: 4rem;
			padding-block: var(--base-scale-s);
			padding-inline: 2.75rem;
			margin-inline: auto;
			font-size: var(--font-size-button-normal);
			font-weight: 700;
			line-height: 1.5;
			color: var(--color-must-lightest);
			text-align: center;
			background-color: var(--color-bg-link-emphasis);
			transition: background-color 0.3s ease-out;
			@media (any-hover: hover) {
				&:hover {
					color: var(--color-must-lightest);
					background-color: var(--color-bg-link-emphasis-hover);
				}
			}
			&:after {
				position: absolute;
				inset-inline-end: 1rem;
				display: inline-block;
				inline-size: 1.5rem;
				block-size: 1.5rem;
				content: '';
				background-image: url(/recruit/img/common/icon-link-arrow-right-02.svg);
				background-repeat: no-repeat;
				background-position: 50%;
				background-size: contain;
			}
		}
	}
}
@layer component {
	.c-home-interview {
		@media (width < 768px) {
			padding-inline: var(--base-scale-m);
		}
	}
	.c-home-interview__carousel-item {
		display: block;
		a {
			position: relative;
			display: grid;
			grid-template-areas: 'content image';
			grid-template-columns: 1fr min(759px, 52.70833%);
			align-items: center;
			inline-size: 100%;
			@media (width < 768px) {
				grid-template-areas: 'image' 'content';
				grid-template-rows: auto 1fr;
				grid-template-columns: 1fr;
				align-items: start;
				block-size: 100%;
			}
			@media (any-hover: hover) {
				&:hover {
					@media (prefers-reduced-motion: no-preference) {
						.c-home-interview__carousel-image img {
							scale: 1.05;
						}
					}
					.c-home-interview__carousel-content-title {
						h3 {
							color: var(--color-tone-primary);
						}
					}
				}
			}
		}
	}
	.c-home-interview__carousel-item > a:focus-visible {
		outline: none;
	}
	.c-home-interview__carousel-item > a:focus-visible:after {
		position: absolute;
		inset: 0;
		z-index: var(--z-index-stack-front);
		pointer-events: none;
		content: '';
		border: 1px solid var(--color-tone-primary);
		box-shadow: inset 0 0 0 2px var(--color-must-lightest);
	}
	.c-home-interview__carousel-image {
		grid-area: image;
		overflow: hidden;
		box-shadow: 0 4px 24px 0 var(--color-home-shadow-gray);
	}
	@media (prefers-reduced-motion: no-preference) {
		@keyframes c-home-interview-image-slide-in {
			0% {
				opacity: 0;
				translate: 900px 0;
			}
			to {
				opacity: 1;
				translate: 0 0;
			}
		}
		@keyframes c-home-interview-content-slide-in {
			0% {
				opacity: 0;
				translate: 80px 0;
			}
			to {
				opacity: 1;
				translate: 0 0;
			}
		}
		.c-home-interview__carousel-item.splide__slide {
			position: relative;
			z-index: var(--z-index-stack-behind);
			.c-home-interview__carousel-image img {
				transition: scale 0.3s ease-out;
				@media (768px <= width) {
					opacity: 0;
				}
			}
			.c-home-interview__carousel-content-inner {
				transition:
					translate 0.5s ease-out,
					opacity 0.6s cubic-bezier(0.22, 1, 0.36, 1);
				@media (768px <= width) {
					opacity: 0;
					translate: -40px 0;
				}
			}
		}
		.c-home-interview__carousel-item.splide__slide.is-active {
			z-index: var(--z-index-stack-front);
			.c-home-interview__carousel-image img {
				@media (768px <= width) {
					animation: c-home-interview-image-slide-in 1s cubic-bezier(0.22, 1, 0.36, 1)
						forwards;
				}
			}
			.c-home-interview__carousel-content-inner {
				@media (768px <= width) {
					animation: c-home-interview-content-slide-in 1s cubic-bezier(0.22, 1, 0.36, 1)
						forwards;
				}
			}
		}
	}
	.splide.c-home-interview__splide:not(.is-overflow) .splide__pagination {
		display: flex;
	}
	.c-home-interview__carousel-content {
		position: relative;
		display: grid;
		grid-area: content;
		row-gap: var(--base-scale-m);
		block-size: fit-content;
		padding-block: var(--base-scale-5xl);
		padding-inline: var(--base-scale-xl);
		background-color: var(--color-must-lightest);
		transition: background-color 0.3s ease-out;
		@media (768px <= width) {
			margin-inline-start: var(--c-home-people-gutter);
		}
		@media (width < 768px) {
			display: flex;
			flex-direction: column;
			align-items: start;
			block-size: 100%;
			padding-block: var(--base-scale-l);
			padding-inline: var(--base-scale-m);
		}
		&:after {
			position: absolute;
			inset-block-end: 0;
			inset-inline-end: 0;
			inline-size: 32px;
			block-size: 32px;
			content: '';
			background-color: var(--color-tone-secondary);
			clip-path: url('data:image/svg+xml;utf8,%3Csvg xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="p" clipPathUnits="objectBoundingBox"%3E%3Cpolygon points="0 1, 1 1, 1 0"/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E#p');
			clip-path: polygon(0 100%, 100% 100%, 100% 0);
		}
	}
	.c-home-interview__carousel-content-inner {
		display: grid;
		row-gap: var(--base-scale-m);
		@media (prefers-reduced-motion: no-preference) {
			transition:
				opacity 0.3s ease-in-out,
				translate 0.3s ease-in-out;
		}
	}
	.c-home-interview__carousel-content-title {
		h3 {
			font-size: var(--font-size-various-font-24);
			font-weight: 700;
			line-height: 1.7;
			color: var(--color-text-base-font-primary);
			transition: color 0.3s ease-out;
			@media (width < 768px) {
				font-size: var(--font-size-title-h3);
			}
			> span {
				display: block;
			}
		}
	}
	.c-home-interview__carousel-content-name {
		span {
			font-size: var(--font-size-various-large);
			font-weight: 500;
			line-height: 1.7;
			color: var(--color-text-base-font-gray);
		}
	}
	.c-home-interview__carousel-content-tag {
		span {
			display: inline-block;
			inline-size: fit-content;
			padding-block: var(--base-scale-xs);
			padding-inline: var(--base-scale-l);
			font-size: var(--font-size-various-base);
			font-weight: 700;
			line-height: 1.7;
			color: var(--color-tone-primary);
			border: 2px solid var(--color-tone-primary);
		}
	}
	.c-home-interview__carousel-content-department {
		span {
			font-family: var(--font-family-jp);
			font-size: var(--font-size-various-font-22);
			font-weight: 500;
			line-height: 1.7;
			color: var(--color-text-base-font-primary);
		}
	}
	.c-home-interview__carousel-content-infomation {
		display: grid;
		row-gap: var(--base-scale-xs);
	}
	.c-home-interview__controls {
		display: grid;
		grid-template-areas: 'prev pagination toggle next';
		grid-template-columns: 2rem fit-content(100%) 1.5rem 2rem;
		column-gap: var(--base-scale-l);
		place-items: center;
		justify-content: center;
		padding-block-start: var(--base-scale-l);
		padding-inline: var(--base-scale-2xl);
		@media (768px <= width) {
			padding-block-start: var(--base-scale-2xl);
			padding-inline: revert;
			margin-inline: auto;
		}
		@media (width < 768px) {
			padding-block-start: var(--base-scale-l);
			padding-inline: 13.5px;
		}
		:where(button) {
			border: none;
		}
	}
	.c-home-interview__pagination {
		grid-area: pagination;
		gap: var(--base-scale-m);
		justify-content: start;
	}
	.c-home-interview__pagination-page {
		display: block;
		inline-size: 0.75rem;
		block-size: 0.75rem;
		padding-inline: 0;
		background-color: var(--color-must-lightest);
		border: 2px solid var(--color-must-lightest);
		border-radius: 999em;
		transition: background-color 0.25s ease;
		@media (any-hover: hover) {
			&:hover {
				background-color: initial;
			}
		}
		&.is-active {
			background-color: initial;
		}
	}
	.c-home-interview__toggle {
		display: grid;
		grid-area: toggle;
		place-items: center;
		padding-inline: 0;
	}
	.c-home-interview__toggle-pause,
	.c-home-interview__toggle-play {
		position: relative;
		inline-size: 100%;
		max-inline-size: 1.5rem;
		aspect-ratio: 1/1;
		&:after {
			position: absolute;
			inset: 0;
			z-index: var(--z-index-stack-front);
			display: block;
			inline-size: 100%;
			block-size: 100%;
			content: '';
			background-repeat: no-repeat;
			background-position: 50%;
			background-size: contain;
			opacity: 0;
			transition: opacity 0.25s ease;
		}
	}
	.c-home-interview__toggle-pause {
		@media (any-hover: hover) {
			&:hover {
				&:after {
					opacity: 1;
				}
				img {
					opacity: 0;
				}
			}
		}
		&:after {
			background-image: url(/recruit/img/common/icon-carousel-pause-hover.svg);
		}
	}
	.c-home-interview__toggle-play {
		@media (any-hover: hover) {
			&:hover {
				&:after {
					opacity: 1;
				}
				img {
					opacity: 0;
				}
			}
		}
		&:after {
			background-image: url(/recruit/img/common/icon-carousel-play-hover.svg);
		}
	}
	.c-home-interview__toggle-pause img,
	.c-home-interview__toggle-play img {
		display: block;
		inline-size: 100%;
		block-size: auto;
		transition: opacity 0.25s ease;
	}
	.c-home-interview__arrow-next,
	.c-home-interview__arrow-prev {
		max-inline-size: 2rem;
		padding-inline: 0;
		img {
			@media (prefers-reduced-motion: no-preference) {
				transition:
					background-image 0.25s ease,
					translate 0.25s ease;
			}
		}
	}
	.c-home-interview__arrow-prev {
		position: relative;
		grid-area: prev;
		@media (prefers-reduced-motion: no-preference) {
			@media (any-hover: hover) {
				&:hover {
					img {
						translate: -8px 0;
					}
				}
			}
		}
	}
	.c-home-interview__arrow-next {
		position: relative;
		grid-area: next;
		@media (prefers-reduced-motion: no-preference) {
			@media (any-hover: hover) {
				&:hover {
					img {
						translate: 8px 0;
					}
				}
			}
		}
	}
}
@layer component {
	.c-home-crosstalk {
		@media (width < 1140px) {
			padding-inline: var(--content-margin-content-padding);
		}
		@media (width < 768px) {
			padding-inline: var(--base-scale-m);
		}
	}
	.splide.c-home-crosstalk__splide:not(.is-overflow) .splide__pagination {
		display: flex;
	}
	.c-home-crosstalk__carousel-item {
		position: relative;
		display: grid;
		overflow: hidden;
		isolation: isolate;
		a {
			position: relative;
			display: block;
			@media (width < 1140px) {
				display: grid;
				grid-template-rows: auto 1fr;
				align-items: start;
			}
		}
	}
	.c-home-crosstalk__carousel-item.splide__slide > a:focus-visible {
		outline: none;
	}
	.c-home-crosstalk__carousel-item.splide__slide > a:focus-visible:after {
		position: absolute;
		inset: 0;
		z-index: var(--z-index-stack-front);
		pointer-events: none;
		content: '';
		border: 1px solid var(--color-tone-primary);
		box-shadow: inset 0 0 0 2px var(--color-must-lightest);
	}
	.c-home-crosstalk__carousel-image {
		overflow: hidden;
		img {
			display: block;
			inline-size: 100%;
			block-size: auto;
			aspect-ratio: 16/9;
			@media (prefers-reduced-motion: no-preference) {
				transition: scale 0.3s ease-out;
			}
			@media (1140px <= width) {
				scale: 0.75;
				will-change: scale;
			}
		}
	}
	.c-home-crosstalk__carousel-item.splide__slide.is-active {
		@media (prefers-reduced-motion: no-preference) {
			@keyframes c-home-crosstalk-content-fade-in {
				0% {
					opacity: 0;
				}
				to {
					opacity: 1;
				}
			}
			.c-home-crosstalk__carousel-content {
				transition:
					background-color 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.45s,
					opacity 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.45s;
				@media (1140px <= width) {
					animation-name: c-home-crosstalk-content-fade-in;
					animation-duration: 0.6s;
					animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
					animation-delay: 3s;
					animation-iteration-count: 1;
					animation-fill-mode: none;
				}
			}
		}
		.c-home-crosstalk__carousel-content {
			@media (1140px <= width) {
				opacity: 1;
			}
		}
		img {
			@media (1140px <= width) {
				scale: 1;
			}
		}
		a {
			@media (any-hover: hover) {
				&:hover {
					.c-home-crosstalk__carousel-content {
						background-color: var(--color-home-gradation-blue-04);
					}
					.c-home-crosstalk__carousel-image img {
						@media (prefers-reduced-motion: no-preference) {
							scale: 1.1;
						}
					}
				}
			}
		}
	}
	.c-home-crosstalk__carousel-content {
		position: absolute;
		inset-block-end: 0;
		inset-inline: -2px;
		z-index: var(--z-index-stack-front);
		display: flex;
		flex-direction: column;
		row-gap: var(--base-scale-s);
		align-items: start;
		inline-size: calc(100% + 4px);
		padding-block: var(--base-scale-xl);
		padding-inline: var(--base-scale-xl);
		margin-inline: auto;
		color: var(--color-must-lightest);
		background-color: var(--color-home-gradation-blue-02);
		backdrop-filter: blur(8px);
		@media (1140px <= width) {
			opacity: 0;
		}
		@media (prefers-reduced-motion: no-preference) {
			transition:
				background-color 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0s,
				opacity 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0s;
		}
		@media (width < 1140px) {
			position: revert;
			inset-block-end: revert;
			inset-inline: revert;
			inline-size: 100%;
			block-size: 100%;
			padding-block: var(--base-scale-l) var(--base-scale-2xl);
			padding-inline: var(--base-scale-m);
			background-color: var(--color-home-crosstalk-background);
		}
		&:after {
			position: absolute;
			inset-block-end: 0;
			inset-inline-end: 0;
			inline-size: 32px;
			block-size: 32px;
			content: '';
			background-color: var(--color-tone-secondary);
			clip-path: url('data:image/svg+xml;utf8,%3Csvg xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="p" clipPathUnits="objectBoundingBox"%3E%3Cpolygon points="0 1, 1 1, 1 0"/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E#p');
			clip-path: polygon(0 100%, 100% 100%, 100% 0);
		}
	}
	.c-home-crosstalk__carousel-content-subtitle {
		font-size: var(--font-size-various-small);
		line-height: 1.7;
	}
	.c-home-crosstalk__carousel-content-title {
		h3 {
			font-size: var(--font-size-title-h3);
			font-weight: 700;
			line-height: 1.7;
		}
	}
	.c-home-crosstalk__controls {
		display: grid;
		grid-template-areas: 'prev pagination toggle next';
		grid-template-columns: 2rem fit-content(100%) 1.5rem 2rem;
		column-gap: var(--base-scale-l);
		place-items: center;
		justify-content: center;
		padding-block-start: var(--base-scale-l);
		padding-inline: var(--base-scale-2xl);
		@media (1140px <= width) {
			padding-block-start: var(--base-scale-2xl);
			padding-inline: revert;
			margin-inline: auto;
		}
		@media (width < 1140px) {
			padding-block-start: var(--base-scale-l);
			padding-inline: 13.5px;
		}
		:where(button) {
			border: none;
		}
	}
	.c-home-crosstalk__pagination {
		grid-area: pagination;
		gap: var(--base-scale-m);
		justify-content: start;
	}
	.c-home-crosstalk__pagination-page {
		display: block;
		inline-size: 0.75rem;
		block-size: 0.75rem;
		padding-inline: 0;
		background-color: var(--color-must-lightest);
		border: 2px solid var(--color-must-lightest);
		border-radius: 999em;
		transition: background-color 0.25s ease;
		@media (any-hover: hover) {
			&:hover {
				background-color: initial;
			}
		}
		&.is-active {
			background-color: initial;
		}
	}
	.c-home-crosstalk__toggle {
		display: grid;
		grid-area: toggle;
		place-items: center;
		padding-inline: 0;
	}
	.c-home-crosstalk__toggle-pause,
	.c-home-crosstalk__toggle-play {
		position: relative;
		inline-size: 100%;
		max-inline-size: 1.5rem;
		aspect-ratio: 1/1;
		&:after {
			position: absolute;
			inset: 0;
			z-index: var(--z-index-stack-front);
			display: block;
			inline-size: 100%;
			block-size: 100%;
			content: '';
			background-repeat: no-repeat;
			background-position: 50%;
			background-size: contain;
			opacity: 0;
			transition: opacity 0.25s ease;
		}
	}
	.c-home-crosstalk__toggle-pause {
		@media (any-hover: hover) {
			&:hover {
				&:after {
					opacity: 1;
				}
				img {
					opacity: 0;
				}
			}
		}
		&:after {
			background-image: url(/recruit/img/common/icon-carousel-pause-hover.svg);
		}
	}
	.c-home-crosstalk__toggle-play {
		@media (any-hover: hover) {
			&:hover {
				&:after {
					opacity: 1;
				}
				img {
					opacity: 0;
				}
			}
		}
		&:after {
			background-image: url(/recruit/img/common/icon-carousel-play-hover.svg);
		}
	}
	.c-home-crosstalk__toggle-pause img,
	.c-home-crosstalk__toggle-play img {
		display: block;
		inline-size: 100%;
		block-size: auto;
		transition: opacity 0.25s ease;
	}
	.c-home-crosstalk__arrow-next,
	.c-home-crosstalk__arrow-prev {
		max-inline-size: 2rem;
		padding-inline: 0;
		img {
			@media (prefers-reduced-motion: no-preference) {
				transition:
					background-image 0.25s ease,
					translate 0.25s ease;
			}
		}
	}
	.c-home-crosstalk__arrow-prev {
		position: relative;
		grid-area: prev;
		@media (prefers-reduced-motion: no-preference) {
			@media (any-hover: hover) {
				&:hover {
					img {
						translate: -8px 0;
					}
				}
			}
		}
	}
	.c-home-crosstalk__arrow-next {
		position: relative;
		grid-area: next;
		@media (prefers-reduced-motion: no-preference) {
			@media (any-hover: hover) {
				&:hover {
					img {
						translate: 8px 0;
					}
				}
			}
		}
	}
}
@layer component {
	.c-page-sub {
		--c-page-sub-wide-layout-width: 1200px;
		--c-page-sub-content-width: 1080px;
		--c-page-sub-gutter: var(--content-margin-content-padding);
		inline-size: 100%;
		block-size: 100%;
		@media (width < 768px) {
			--c-page-sub-content-width: 1080px;
		}
	}
	.c-page-sub__base {
		display: grid;
		grid-template: 'header' auto 'main' 1fr 'footer' auto/1fr;
		inline-size: 100%;
		block-size: 100%;
	}
	.c-page-sub__header {
		position: sticky;
		inset-block-start: 0;
		z-index: var(--stack-header);
		grid-area: header;
	}
	.c-page-sub__main {
		position: relative;
		grid-area: main;
	}
	.c-page-sub__footer {
		grid-area: footer;
	}
	.c-page-sub__title-page {
		max-inline-size: 1440px;
		padding-block: var(--base-scale-5xl) var(--bgb-opt-bgb-opt--mb-large);
		padding-inline: var(--content-margin-content-padding);
		margin-inline: auto;
		@media (width < 768px) {
			padding-block: var(--base-scale-2xl);
			padding-inline: var(--c-page-sub-gutter);
		}
	}
	.c-page-sub__title-page-container {
		max-inline-size: 1440px;
		padding-block: var(--base-scale-5xl) var(--base-scale-7xl);
		padding-inline: 120px;
		margin-inline: auto;
		@media (width < 768px) {
			padding-block: var(--base-scale-2xl);
			padding-inline: var(--c-page-sub-gutter);
		}
	}
	.c-page-sub__title-page-crosstalk {
		padding-block: var(--base-scale-5xl) var(--bgb-opt-bgb-opt--mb-large);
	}
	.c-page-sub__title-page-interview {
		padding-block: var(--base-scale-5xl) var(--base-scale-7xl);
		padding-inline: 60px 0;
		@media (width < 768px) {
			padding-block: var(--base-scale-2xl) var(--base-scale-5xl);
			padding-block-end: var(--base-scale-5xl);
			padding-inline: 0;
		}
	}
	.c-page-sub__title-page-interview-container {
		max-inline-size: 1440px;
		margin-inline: auto;
	}
	.c-page-sub__title-page-bg {
		position: relative;
		padding-block-end: var(--bgb-opt-bgb-opt--mb-large);
		isolation: isolate;
	}
	.c-page-sub__title-page-bg-image {
		--c-title-page-bg-image-desktop: url(/recruit/img/common/bg-title-page-about-company-desktop.webp);
		--c-title-page-bg-image-mobile: url(/recruit/img/common/bg-title-page-about-company-mobile.webp);
		position: relative;
		isolation: isolate;
		&:before {
			position: absolute;
			inset: 0;
			z-index: var(--z-index-stack-behind);
			content: '';
			background-image: var(--c-title-page-bg-image-desktop);
			background-repeat: no-repeat;
			background-position: 50%;
			background-size: cover;
			@media (width < 768px) {
				background-image: var(--c-title-page-bg-image-mobile);
			}
		}
		&:after {
			position: absolute;
			inset: 0;
			z-index: var(--z-index-stack-behind);
			content: '';
			background-color: var(--color-home-gradation-blue-03);
			background-image: var(--noise-texture-image-5);
			background-repeat: repeat;
			background-position: 50%;
			background-size: 100px 100px;
			backdrop-filter: blur(8px);
		}
	}
	.c-page-sub__title-page-bg-container {
		max-inline-size: 1440px;
		padding-block: 133px;
		padding-inline: var(--content-margin-content-padding);
		margin-inline: auto;
		@media (width <= 1024px) {
			padding-block: 113px;
		}
		@media (width < 768px) {
			padding-block: var(--base-scale-7xl) 120px;
			padding-inline: var(--base-scale-2xl);
		}
	}
	.c-page-sub__title-page-bg-description {
		position: relative;
		z-index: var(--z-index-stack-front);
		inline-size: 100%;
		padding-inline: var(--base-scale-m);
		margin-block-start: -40px;
		@media (width < 768px) {
			margin-block-start: -60px;
		}
		p {
			font-size: var(--font-size-various-large);
			font-weight: 500;
			line-height: 2;
			> span {
				display: block;
			}
		}
	}
	.c-page-sub__title-page-bg-description-catchphrase {
		padding-block-end: var(--bgb-opt-bgb-opt--mb-small);
		font-size: var(--font-size-various-font-24);
		font-weight: 700;
		line-height: 1.7;
		color: var(--color-tone-primary);
		letter-spacing: 0.03rem;
		> span {
			display: inline;
			font-size: var(--font-size-various-font-30);
			font-weight: 700;
			line-height: 1.5;
			color: var(--color-tone-primary);
			letter-spacing: 0.0375rem;
			background-image: linear-gradient(
				120deg,
				#0000 10px,
				var(--color-bg-base-bg-light-blue) 10px,
				var(--color-bg-base-bg-light-blue) calc(100% - 10px),
				#0000 calc(100% - 10px)
			);
			background-repeat: no-repeat;
			background-position: 0 100%;
			background-size: 100% 1rem;
			-webkit-box-decoration-break: clone;
			box-decoration-break: clone;
			@media (width < 768px) {
				font-size: 1.625rem;
				background-size: 100% 0.75rem;
			}
		}
	}
	.c-page-sub__title-page-bg-description-catchphrase-break {
		@media (width < 768px) {
			display: none;
		}
	}
	.c-page-sub__title-page-bg-description-container {
		max-inline-size: var(--view-size-bge-content);
		padding-block: var(--base-scale-xl);
		padding-inline: var(--base-scale-xl);
		margin-inline: auto;
		background-color: var(--color-must-lightest);
		box-shadow: 0 0 48px 0 var(--color-shadow-gray-2);
		@media (width < 768px) {
			grid-column: content;
			max-inline-size: none;
		}
	}
	.c-page-sub__nav-breadcrumb {
		max-inline-size: calc(
			var(--c-page-sub-wide-layout-width) + var(--c-page-sub-gutter) * 2
		);
		padding-block: var(--base-scale-l);
		padding-inline: var(--c-page-sub-gutter);
		margin-inline: auto;
		@media (width < 768px) {
			padding-block: var(--base-scale-m);
		}
	}
	.c-page-sub__content-main {
		padding-block-end: var(--content-margin-content-mb);
		margin-inline: auto;
	}
	.c-page-sub__nav-local {
		--stack-local-nav: 10;
		position: relative;
		z-index: var(--stack-local-nav);
		padding-block-start: var(--base-scale-7xl);
		@media (width < 768px) {
			padding-block-start: var(--bgb-opt-bgb-opt--mb-large);
		}
	}
	.c-page-sub__content-anchor {
		--stack-anchor: 10;
		position: fixed;
		inset-block-end: 20px;
		inset-inline-end: 20px;
		z-index: var(--stack-anchor);
	}
}
@layer component {
	.c-header__body {
		display: flex;
		gap: 2rem;
		align-items: center;
		justify-content: space-between;
		padding-inline: var(--base-scale-2xl) var(--base-scale-m);
		background-color: var(--color-must-lightest);
		box-shadow: 0 4px 36px 0 var(--color-shadow-gray-1);
		backdrop-filter: blur(5px);
		@media (width < 1400px) {
			padding-block: var(--base-scale-s);
			padding-inline: var(--base-scale-m);
		}
	}
	.c-header__title {
		@media (width < 1400px) {
			inline-size: 57.72595%;
		}
		h1 {
			margin: 0;
			a {
				display: flex;
			}
		}
	}
	.c-header__info {
		display: flex;
		column-gap: var(--base-scale-xl);
		align-items: center;
		font-weight: 700;
		a[target='_blank'] {
			display: flex;
			gap: var(--base-scale-s);
			align-items: center;
			&:after {
				display: inline-block;
				inline-size: 1rem;
				block-size: 1rem;
				content: '';
				background-image: url(/recruit/img/common/icon-link-blank-white.svg);
				background-repeat: no-repeat;
				background-position: 50%;
				background-size: contain;
				@media (width < 1400px) {
					background-image: url(/recruit/img/common/icon-link-blank.svg);
				}
			}
		}
	}
	.c-header__links-pc {
		display: flex;
		column-gap: var(--base-scale-l);
		align-items: center;
		@media (width < 1400px) {
			display: none;
		}
		> li {
			position: relative;
			display: block;
			flex: 0 1 auto;
			padding-block: var(--base-scale-l);
			@media (any-hover: hover) {
				&:hover:after {
					scale: 1 1;
				}
			}
			> a {
				display: block;
				font-size: var(--font-size-various-base);
				line-height: 1.7;
				color: inherit;
				text-decoration: none;
			}
			&:after {
				position: absolute;
				inset-block-end: 0;
				inset-inline-start: 0;
				inline-size: 100%;
				block-size: 2px;
				content: '';
				background-color: var(--color-tone-primary);
				transform-origin: left top;
				scale: 0 1;
				@media (prefers-reduced-motion: no-preference) {
					transition: scale 0.3s;
				}
			}
		}
	}
	.c-header__cta-links-pc {
		display: grid;
		grid-template-columns: repeat(2, auto);
		column-gap: var(--base-scale-s);
		line-height: 1.5;
		box-shadow: 0 4px 36px 0 var(--color-shadow-gray-1);
		@media (width < 1400px) {
			display: none;
		}
	}
	.c-header__cta-links-event-pc {
		padding-block: 0.75rem;
		padding-inline: var(--base-scale-m);
		color: var(--color-must-lightest);
		background-color: var(--color-tone-primary);
		transition: background-color 0.3s ease-out;
		@media (any-hover: hover) {
			&:hover {
				background-color: var(--color-bg-link-blue-hover);
			}
		}
	}
	.c-header__cta-links-entry-pc {
		anchor-name: --entry-button;
		position: relative;
		display: flex;
		column-gap: var(--base-scale-xs);
		align-items: center;
		justify-content: center;
		padding-block: 0.75rem;
		padding-inline: var(--base-scale-m);
		color: var(--color-must-lightest);
		text-align: center;
		background-color: var(--color-tone-secondary);
		border: none;
		transition: background-color 0.3s ease-out;
		@media (any-hover: hover) {
			&:hover {
				background-color: var(--color-bg-link-emphasis-red-hover);
			}
		}
	}
	.c-header__cta-links-entry-pc:after {
		inline-size: 16px;
		block-size: 16px;
		content: '';
		background-image: url(/recruit/img/common/icon-arrow-down-white.svg);
		@media (prefers-reduced-motion: no-preference) {
			transition: rotate 0.3s;
		}
	}
	.c-header:has(.c-header__popover:popover-open) {
		.c-header__cta-links-entry-pc:after {
			rotate: 180deg;
		}
	}
	.c-header__popover {
		position-anchor: --entry-button;
		position: fixed;
		inset: auto;
		display: flex;
		flex-direction: column;
		gap: var(--base-scale-m);
		align-items: flex-start;
		justify-self: end;
		inline-size: 10.25rem;
		padding: var(--base-scale-l);
		padding-inline-end: 1.25rem;
		margin: 0;
		margin-block-start: 0.5em;
		font-weight: 500;
		line-height: 1.5;
		color: var(--color-must-lightest);
		background-color: var(--color-tone-secondary);
		border: none;
		position-area: bottom span-left;
		a {
			inline-size: fit-content;
			border-block-end: 1px solid #0000;
			@media (any-hover: hover) {
				&:hover {
					span {
						border-block-end-color: var(--color-must-lightest);
					}
				}
			}
			span {
				display: inline;
				border-block-end: 1px solid #0000;
				transition: border-block-end-color 0.3s ease-out;
			}
		}
	}
	.c-header__hamburger-close,
	.c-header__hamburger-open {
		padding: 0;
		margin-block: 0.8rem 0.3rem;
		margin-inline: 0.6rem;
		border: none;
		@media (1400px <= width) {
			display: none;
		}
	}
	.c-header__hamburger-close {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.c-header__hamburger-icon {
		display: block;
		inline-size: 40px;
		block-size: 4px;
		margin-block-end: 8px;
		background-color: var(--color-tone-primary);
		&:last-child {
			margin-block-end: 6px;
		}
	}
	.c-header:has(.c-header__links-dialog[open]) .c-header__hamburger-icon:first-child {
		rotate: 45deg;
		translate: 0 0.75rem;
	}
	.c-header:has(.c-header__links-dialog[open]) .c-header__hamburger-icon:nth-child(2) {
		opacity: 0;
	}
	.c-header:has(.c-header__links-dialog[open]) .c-header__hamburger-icon:nth-child(3) {
		rotate: -45deg;
		translate: 0 -0.75rem;
	}
	.c-header__hamburger-text {
		display: block;
		font-family: var(--font-family-en);
		font-size: var(--font-size-various-small);
		font-style: normal;
		font-weight: 500;
		line-height: 1.5;
		color: var(--color-text-base-font-primary);
		@media (width < 768px) {
			font-size: var(--font-size-various-base);
		}
	}
	.c-header__links-dialog {
		position: fixed;
		inset: 0;
		inline-size: 100%;
		block-size: 100%;
		padding: 0;
		margin: 0;
		border: none;
		@media (1400px <= width) {
			display: none;
		}
	}
	.c-header__links-dialog[open] {
		overflow-y: auto;
		overscroll-behavior: contain;
	}
	.c-header__links-dialog[open] :is(.c-header__links-sp, .c-header__cta-inner-sp) {
		opacity: 1;
		transition:
			display allow-discrete 0.3s,
			opacity 0.3s;
		@starting-style {
			opacity: 0;
		}
	}
	.c-header__links-dialog::backdrop {
		background-color: var(--color-must-lightest);
	}
	@media (width < 1400px) {
		:where(html:has(.c-header__links-dialog[open])) {
			overflow: hidden;
			overscroll-behavior: none;
		}
	}
	.c-header__sp-head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding-block: var(--base-scale-s);
		padding-inline: var(--base-scale-m);
		background-color: var(--color-must-lightest);
	}
	.c-header__links-sp {
		padding: 1.5rem;
		@media (1400px <= width) {
			display: none;
		}
		a {
			position: relative;
			display: block;
			padding-block: var(--base-scale-l);
			padding-inline: var(--base-scale-xs) var(--base-scale-m);
			font-size: var(--font-size-various-font-20);
			text-decoration: underline;
			text-decoration-thickness: 1px;
			text-decoration-color: #0000;
			text-underline-offset: 2px;
			border-block-end: 1px dashed var(--color-border-gray-2);
			transition:
				text-decoration-color 0.3s ease-out,
				color 0.3s ease-out;
			@media (any-hover: hover) {
				&:hover {
					color: var(--color-tone-primary);
					text-decoration-color: var(--color-tone-primary);
				}
			}
			&:after {
				position: absolute;
				inset-block: 0;
				inset-inline-end: var(--base-scale-m);
				inline-size: var(--base-scale-m);
				block-size: var(--base-scale-m);
				margin-block: auto;
				content: '';
				background-image: url(/recruit/img/common/icon-arrow-primary.svg);
				background-repeat: no-repeat;
				background-position: 50%;
				background-size: contain;
			}
		}
	}
	.c-header__cta-inner-sp {
		padding-inline: var(--base-scale-m);
		text-align: center;
	}
	.c-header__cta-links-sp {
		display: grid;
		grid-template-columns: 1fr;
		gap: var(--base-scale-m);
		margin-block-end: var(--base-scale-l);
		@media (1400px <= width) {
			display: none;
		}
		a {
			inline-size: 100%;
		}
	}
	.c-header__cta-links-event-sp {
		justify-content: center;
		padding-block: 0.875rem 0.8125rem;
		color: var(--color-must-lightest);
		background-color: var(--color-tone-primary);
		transition: background-color 0.3s ease-out;
		@media (any-hover: hover) {
			&:hover {
				background-color: var(--color-bg-link-blue-hover);
			}
		}
		&:after {
			background-image: url(/recruit/img/common/icon-link-blank-white.svg) !important;
		}
	}
	.c-header__cta-links-entry-sp {
		inline-size: 100%;
		color: var(--color-must-lightest);
	}
	.c-header__cta-summary {
		position: relative;
		padding-block: 0.875rem 0.8125rem;
		background-color: var(--color-tone-secondary);
		transition: background-color 0.3s ease-out;
		@media (any-hover: hover) {
			&:hover {
				background-color: var(--color-bg-link-emphasis-red-hover);
			}
		}
	}
	.c-header__cta-summary:before {
		inset-block: 0;
		inset-inline-end: 1rem;
		inline-size: 0.875rem;
		block-size: 2px;
	}
	.c-header__cta-summary:after,
	.c-header__cta-summary:before {
		position: absolute;
		display: inline-block;
		margin-block: auto;
		content: '';
		background-color: var(--color-must-lightest);
		border-radius: var(--radius-radius-max);
	}
	.c-header__cta-summary:after {
		inset-block: 0;
		inset-inline-end: 1.375rem;
		inline-size: 2px;
		block-size: 0.875rem;
	}
	.c-header__cta-links-entry-sp[open] > .c-header__cta-summary:after {
		display: none;
	}
	.c-header__cta-links-entry-sp::details-content {
		display: grid;
		grid-template-rows: 0fr;
		content-visibility: unset;
		@media (prefers-reduced-motion: no-preference) {
			transition: grid-template-rows 0.3s ease-out;
		}
	}
	.c-header__cta-links-entry-sp:not([open])::details-content {
		grid-template-rows: 0fr;
	}
	.c-header__cta-links-entry-sp[open]::details-content {
		grid-template-rows: 1fr;
	}
	.c-header__cta-summary-item {
		min-block-size: 0;
		overflow: hidden;
		background-color: var(--color-must-lightest);
		border-block-end: 1px solid var(--color-tone-secondary);
		border-inline: 1px solid var(--color-tone-secondary);
		@media (prefers-reduced-motion: no-preference) {
			transition: border-color 0.3s ease-out;
		}
		@media (any-hover: hover) {
			.c-header__cta-links-entry-sp:not([open]):hover & {
				border-color: var(--color-bg-link-emphasis-red-hover);
			}
		}
	}
	.c-header__cta-summary-inner {
		display: grid;
		grid-template-columns: 1fr;
		gap: var(--base-scale-m);
		min-block-size: 0;
		padding-block: var(--base-scale-l);
		padding-inline: var(--base-scale-m);
		font-weight: 500;
		color: var(--color-text-base-font-primary);
		text-align: start;
	}
	.c-header__cta-summary-inner a {
		inline-size: fit-content;
		border-block-end: 1px solid #0000;
		transition:
			color 0.3s ease-out,
			border-block-end-color 0.3s ease-out;
		@media (any-hover: hover) {
			&:hover {
				color: var(--color-tone-primary);
				border-block-end-color: var(--color-tone-primary);
			}
		}
	}
}
@layer component {
	.c-footer {
		background-color: var(--color-must-darkest);
	}
	.c-footer__entry {
		background-color: var(--color-must-lightest);
	}
	.c-footer__entry-inner {
		display: grid;
		@media (1400px <= width) {
			grid-template-rows: auto auto 1fr;
			grid-template-columns: 1fr 1fr;
		}
		@media (width < 1400px) {
			grid-template-columns: 1fr;
		}
	}
	.c-footer__entry-item {
		--recruit-link-color: var(--color-tone-primary);
		--recruit-link-background-color: var(--color-must-lightest);
		--recruit-link-background-color-hover: var(--color-tone-primary);
		position: relative;
		display: grid;
		color: var(--color-must-lightest);
		isolation: isolate;
		@media (1400px <= width) {
			grid-template-rows: subgrid;
			grid-row: span 3;
			padding-block: var(--base-scale-3xl);
			padding-inline: var(--base-scale-7xl);
		}
		@media (width < 1400px) {
			padding-block: var(--base-scale-2xl);
			padding-inline: var(--base-scale-m);
		}
	}
	.c-footer__entry-item-image {
		position: absolute;
		inset: 0;
		z-index: var(--z-index-stack-behind);
		inline-size: 100%;
		block-size: 100%;
		overflow: hidden;
		img {
			display: block;
			inline-size: 100%;
			block-size: 100%;
			object-fit: cover;
			object-position: center;
		}
	}
	.c-footer__entry-item-contents {
		position: relative;
		z-index: var(--z-index-stack-front);
		display: grid;
		justify-items: center;
		@media (1400px <= width) {
			grid-template-rows: subgrid;
			grid-row: span 3;
		}
	}
	.c-footer__entry-item-heading-ja {
		font-weight: 700;
		line-height: 1.7;
		@media (1400px <= width) {
			font-size: var(--font-size-various-font-26);
		}
		@media (width < 1400px) {
			font-size: var(--font-size-various-font-22);
		}
	}
	.c-footer__entry-item-heading-en {
		margin-block-start: var(--base-scale-xs);
		font-family: var(--font-family-en);
		font-weight: 700;
		line-height: 1.1;
		text-transform: uppercase;
		@media (1400px <= width) {
			font-size: var(--font-size-various-font-20);
		}
		@media (width < 1400px) {
			font-size: var(--font-size-various-base);
		}
	}
	.c-footer__entry-link {
		--recruit-link-min-inline-size: min(100%, 280px);
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		min-inline-size: var(--recruit-link-min-inline-size);
		max-inline-size: 480px;
		min-block-size: 64px;
		padding-block: var(--base-scale-s);
		padding-inline: calc(var(--base-scale-m) + 1.5rem);
		font-size: var(--font-size-button-normal);
		font-weight: 700;
		line-height: 1.5;
		color: var(--recruit-link-color);
		background-color: var(--recruit-link-background-color);
		transition:
			color 0.3s ease-out,
			background-color 0.3s ease-out;
		@media (1400px <= width) {
			margin-block-start: var(--base-scale-2xl);
		}
		@media (width < 1400px) {
			margin-block-start: var(--base-scale-l);
		}
		@media (any-hover: hover) {
			&:hover {
				color: var(--lightest-color);
				background-color: var(--recruit-link-background-color-hover);
				&[target='_blank'] {
					&:after {
						background-image: url(/recruit/img/common/icon-link-blank-white.svg);
					}
				}
			}
		}
		&:after {
			position: absolute;
			inset-inline-end: 1rem;
			display: block;
			inline-size: 1.5rem;
			block-size: 1.5rem;
			content: '';
			background-repeat: no-repeat;
			background-position: 50%;
			background-size: contain;
			transition: background-image 0.3s ease-out;
		}
		&:not([target='_blank']) {
			&:after {
				background-image: url(/recruit/img/common/icon-link-arrow-right-02.svg);
			}
		}
		&[target='_blank'] {
			&:after {
				background-image: url(/recruit/img/common/icon-link-blank-blue.svg);
			}
		}
		span {
			justify-self: center;
		}
	}
	.c-footer__body {
		--c-footer-content-width: 1440px;
		--c-footer-gutter: var(--base-scale-7xl);
		display: grid;
		grid-template-columns: [full-start] minmax(
				var(--c-footer-gutter),
				1fr
			) [content-start] minmax(0, var(--c-footer-content-width)) [content-end] minmax(
				var(--c-footer-gutter),
				1fr
			) [full-end];
		margin-block: 0;
		margin-inline: auto;
		@media (width < 1400px) {
			--c-footer-gutter: var(--content-margin-content-padding);
		}
		& > * {
			grid-column: content;
		}
	}
	.c-footer__contents {
		display: grid;
		color: var(--color-must-lightest);
		@media (width < 1400px) {
			padding-block: var(--base-scale-5xl) var(--base-scale-3xl);
		}
		@media (1400px <= width) {
			grid-template-rows: auto auto auto;
			grid-template-columns: auto 1fr 1fr 1fr 1fr 1fr;
			padding-block: var(--base-scale-5xl) var(--base-scale-3xl);
		}
	}
	.c-footer__bottom {
		display: grid;
		background-color: var(--color-must-lightest);
		border-image-source: linear-gradient(
			var(--color-must-lightest),
			var(--color-must-lightest)
		);
		border-image-slice: 0 fill;
		border-image-outset: 0 100lvh;
		@media (width < 1400px) {
			grid-template-rows: auto auto auto;
			row-gap: var(--base-scale-m);
			padding-block: var(--base-scale-l);
		}
		@media (1400px <= width) {
			grid-template-rows: auto auto;
			grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
			row-gap: var(--base-scale-m);
			padding-block: var(--base-scale-l);
		}
	}
	.c-footer__logo {
		@media (width < 1400px) {
			margin-inline: auto;
		}
		@media (1400px <= width) {
			grid-row: 1/2;
			grid-column: 1/2;
		}
	}
	.c-footer__logo img {
		display: block;
		inline-size: 100%;
		block-size: auto;
		@media (width < 1400px) {
			max-inline-size: 225px;
		}
		@media (1400px <= width) {
			max-inline-size: 233px;
		}
	}
	.c-footer__cta-desktop {
		display: flex;
		flex-flow: row nowrap;
		grid-row: 1/2;
		grid-column: 2/7;
		column-gap: var(--base-scale-m);
		justify-content: flex-end;
		padding-inline-start: var(--base-scale-l);
		font-size: var(--font-size-various-small);
		font-weight: 500;
		line-height: 1.5;
		@media (width < 1400px) {
			display: none;
		}
	}
	.c-footer__cta-desktop-entry-summary,
	.c-footer__cta-desktop-mypage {
		display: grid;
		place-content: center;
		inline-size: fit-content;
		padding-block: 12px;
		padding-inline: var(--base-scale-l);
		font-family: var(--font-family-en);
		font-size: var(--font-size-various-base);
		font-weight: 700;
		line-height: 1.5;
		color: var(--color-must-lightest);
		span {
			display: block;
			inline-size: fit-content;
			margin-inline: auto;
		}
	}
	.c-footer__cta-desktop-entry {
		display: flex;
		flex-flow: row nowrap;
	}
	.c-footer__cta-desktop-entry-summary {
		position: relative;
		background-color: var(--color-tone-secondary);
	}
	.c-footer__cta-desktop-entry-content {
		display: flex;
		flex-direction: row;
		column-gap: var(--base-scale-l);
		padding-block: 0.84rem calc(0.84rem - 1px);
		padding-inline: var(--base-scale-xl);
		color: var(--color-must-darkest);
		background-color: var(--color-must-lightest);
	}
	.c-footer__cta-desktop-entry-link {
		display: flex;
		align-items: center;
		border-block-end: 1px solid #0000;
		transition:
			color 0.3s ease-out,
			border-block-end-color 0.3s ease-out;
		@media (any-hover: hover) {
			&:hover {
				color: var(--color-tone-primary);
				border-block-end-color: var(--color-tone-primary);
			}
		}
		&[target='_blank'] {
			column-gap: 0.25rem;
			&:after {
				display: block;
				inline-size: 1rem;
				block-size: 1rem;
				content: '';
				background-image: url(/recruit/img/common/icon-link-blank.svg);
				background-repeat: no-repeat;
				background-position: 50%;
				background-size: 0.75rem 0.56rem;
			}
		}
	}
	.c-footer__cta-desktop-mypage {
		background-color: var(--color-tone-primary);
		transition: background-color 0.3s ease-out;
		@media (any-hover: hover) {
			&:hover {
				background-color: var(--color-bg-link-blue-hover);
			}
		}
	}
	.c-footer__cta-mobile {
		display: flex;
		flex-flow: column wrap;
		row-gap: 1rem;
		padding-block-start: var(--base-scale-xl);
		font-size: var(--font-size-various-small);
		font-weight: 500;
		line-height: 1.5;
		@media (1400px <= width) {
			display: none;
		}
	}
	.c-footer__cta-mobile-entry-summary,
	.c-footer__cta-mobile-mypage {
		display: grid;
		place-content: center;
		padding-block: 0.88rem 0.81rem;
		padding-inline: 1.5rem;
		font-family: var(--font-family-en);
		font-size: var(--font-size-various-base);
		font-weight: 700;
		line-height: 1.5;
		color: var(--color-must-lightest);
		span {
			display: block;
			inline-size: fit-content;
			margin-inline: auto;
		}
	}
	.c-footer__cta-mobile-entry {
		display: flex;
		flex-flow: column wrap;
		&::details-content {
			display: grid;
			grid-template-rows: 0fr;
			content-visibility: unset;
			@media (prefers-reduced-motion: no-preference) {
				transition: grid-template-rows 0.3s ease-out;
			}
		}
		&:not([open])::details-content {
			grid-template-rows: 0fr;
		}
		&[open]::details-content {
			grid-template-rows: 1fr;
		}
		&[open] .c-footer__cta-mobile-entry-summary:after {
			background-image: url(/recruit/img/common/icon-accordion-close.svg);
			background-size: 0.81rem 0.125rem;
		}
	}
	.c-footer__cta-mobile-entry-summary {
		position: relative;
		cursor: pointer;
		background-color: var(--color-tone-secondary);
		transition: background-color 0.3s ease-out;
		@media (any-hover: hover) {
			&:hover {
				background-color: var(--color-bg-link-emphasis-red-hover);
			}
		}
		&:after {
			position: absolute;
			inset-block: 0;
			inset-inline-end: 1rem;
			display: block;
			inline-size: 1rem;
			block-size: 1rem;
			margin-block: auto;
			content: '';
			background-image: url(/recruit/img/common/icon-accordion-open.svg);
			background-repeat: no-repeat;
			background-position: 50%;
			background-size: 0.88rem 0.88rem;
		}
	}
	.c-footer__cta-mobile-entry-container {
		min-block-size: 0;
		overflow: hidden;
	}
	.c-footer__cta-mobile-entry-content {
		display: flex;
		flex-direction: column;
		row-gap: 1rem;
		padding-block: 1.5rem;
		padding-inline: 1rem;
		color: var(--color-must-darkest);
		background-color: var(--color-must-lightest);
	}
	.c-footer__cta-mobile-entry-link {
		display: flex;
		align-items: center;
		inline-size: fit-content;
		border-block-end: 1px solid #0000;
		transition:
			color 0.3s ease-out,
			border-block-end-color 0.3s ease-out;
		@media (any-hover: hover) {
			&:hover {
				color: var(--color-tone-primary);
				border-block-end-color: var(--color-tone-primary);
			}
		}
		&[target='_blank'] {
			column-gap: 0.25rem;
			&:after {
				display: block;
				inline-size: 1rem;
				block-size: 1rem;
				content: '';
				background-image: url(/recruit/img/common/icon-link-blank.svg);
				background-repeat: no-repeat;
				background-position: 50%;
				background-size: 0.75rem 0.56rem;
			}
		}
	}
	.c-footer__cta-mobile-mypage {
		background-color: var(--color-tone-primary);
		transition: background-color 0.3s ease-out;
		@media (any-hover: hover) {
			&:hover {
				background-color: var(--color-bg-link-blue-hover);
			}
		}
	}
	.c-footer__sitemap {
		padding-block: var(--base-scale-7xl) 0;
		@media (1400px <= width) {
			grid-row: 2/3;
			grid-column: 1/-1;
		}
	}
	.c-footer__links {
		padding-block-start: var(--base-scale-3xl);
		@media (1400px <= width) {
			grid-row: 3/4;
			grid-column: 1/-1;
		}
	}
	.c-footer__links-list {
		display: flex;
		gap: 1rem;
		align-items: center;
		font-size: var(--font-size-various-small);
		line-height: 1.5;
		@media (width < 1400px) {
			flex-wrap: wrap;
			justify-content: center;
		}
	}
	.c-footer__links-item {
		display: flex;
		align-items: center;
		&:not(:last-child) {
			&:after {
				display: inline-block;
				inline-size: 1px;
				block-size: 1.31rem;
				margin-inline-start: 1rem;
				color: currentcolor;
				content: '';
				background-color: currentcolor;
				@media (width < 1400px) {
					block-size: 1.13rem;
				}
			}
		}
	}
	.c-footer__links-link {
		display: block;
		border-block-end: 1px solid #0000;
		transition:
			font-weight 0.3s ease-out,
			border-block-end-color 0.3s ease-out;
		@media (any-hover: hover) {
			&:hover {
				font-weight: 700;
				border-block-end-color: var(--color-must-lightest);
			}
		}
	}
	.c-footer__bottom-links {
		display: grid;
		align-items: center;
		@media (width < 1400px) {
			grid-row: 1/2;
			grid-column: 1/-1;
		}
		@media (1400px <= width) {
			grid-row: 1/2;
			grid-column: 1/5;
		}
	}
	.c-footer__bottom-links-list {
		display: flex;
		gap: var(--base-scale-s) var(--base-scale-2xl);
		font-size: var(--font-size-various-small);
		line-height: 1.5;
		@media (width < 1400px) {
			flex-flow: column wrap;
		}
		@media (1400px <= width) {
			align-items: center;
		}
	}
	.c-footer__bottom-links-item {
		display: block;
	}
	.c-footer__bottom-links-link {
		display: inline-flex;
		border-block-end: 1px solid #0000;
		transition:
			font-weight 0.3s ease-out,
			border-block-end-color 0.3s ease-out;
		@media (any-hover: hover) {
			&:hover {
				color: var(--color-tone-primary);
				border-block-end-color: var(--color-tone-primary);
			}
		}
		&[target='_blank'] {
			column-gap: 0.25rem;
			&:after {
				display: block;
				align-self: center;
				inline-size: 1rem;
				block-size: 1rem;
				content: '';
				background-image: url(/recruit/img/common/icon-link-blank.svg);
				background-repeat: no-repeat;
				background-position: 50% 55%;
				background-size: 0.75rem 0.56rem;
			}
		}
		&[href^='mailto:'] {
			column-gap: 0.25rem;
			&:after {
				display: block;
				align-self: center;
				inline-size: 1rem;
				block-size: 1rem;
				content: '';
				background-image: url(/recruit/img/common/icon-link-mail.svg);
				background-repeat: no-repeat;
				background-position: 50% 55%;
				background-size: 0.88rem 0.84rem;
				@media (width < 1400px) {
					background-position: 50% 65%;
				}
			}
		}
		span {
			> span {
				display: inline-block;
				margin-inline-start: 0.5rem;
			}
		}
	}
	.c-footer__social-links {
		@media (width < 1400px) {
			grid-row: 3/4;
			grid-column: 1/-1;
		}
		@media (1400px <= width) {
			grid-row: 1/-1;
			grid-column: 5/6;
		}
	}
	.c-footer__social-links-inner {
		display: flex;
		align-items: center;
		justify-content: start;
		@media (1400px <= width) {
			justify-content: flex-end;
		}
	}
	.c-footer__social-links-item {
		display: grid;
		place-content: center;
		inline-size: 100%;
		max-inline-size: 2.89rem;
		aspect-ratio: 1/1;
		padding-block: 0.37rem;
		padding-inline: 0.37rem;
	}
	.c-footer__social-links-link {
		display: block;
	}
	.c-footer__social-links-icon {
		display: block;
		inline-size: 100%;
		block-size: auto;
		img {
			display: block;
			inline-size: 100%;
			block-size: auto;
			object-fit: contain;
		}
	}
	.c-footer__copyright {
		font-family: var(--font-family-en);
		font-size: var(--font-size-various-small);
		font-weight: 500;
		line-height: 1;
		color: var(--color-text-base-font-gray);
		@media (width < 1400px) {
			grid-row: 2/3;
			grid-column: 1/-1;
		}
		@media (1400px <= width) {
			grid-row: 2/3;
			grid-column: 1/5;
		}
	}
}
@layer component {
	.c-nav-sitemap {
		padding-block: 0;
		padding-inline: 0;
	}
	.c-nav-sitemap__body {
		display: grid;
		@media (width < 768px) {
			grid-template-columns: 1fr;
			row-gap: var(--base-scale-m);
		}
		@media (768px <= width) {
			grid-template-columns: repeat(3, 1fr);
			column-gap: var(--base-scale-4xl);
			align-items: start;
		}
	}
	.c-nav-sitemap__column {
		display: flex;
		flex-direction: column;
		@media (768px <= width) {
			column-gap: var(--base-scale-l);
		}
	}
	.c-nav-sitemap__list {
		display: grid;
	}
	.c-nav-sitemap__list-item {
		display: block;
		&:not(:first-child) {
			padding-block-start: var(--base-scale-m);
		}
	}
	.c-nav-sitemap__list-link {
		position: relative;
		display: grid;
		grid-template-columns: 1fr auto;
		padding-block: var(--base-scale-s);
		padding-inline: var(--base-scale-xs);
		font-size: var(--font-size-various-base);
		font-weight: 700;
		line-height: 1.5;
		@media (any-hover: hover) {
			&:hover {
				&:before {
					background-color: var(--color-must-lightest);
					scale: 1 2;
				}
			}
		}
		&[target='_blank'] {
			&:after {
				background-image: url(/recruit/img/common/icon-link-blank-white.svg);
				background-size: contain;
			}
		}
		&:before {
			position: absolute;
			inset-block-end: 0;
			inset-inline: 0;
			inline-size: 100%;
			block-size: 1px;
			content: '';
			background-color: var(--color-border-gray-1);
			transform-origin: bottom;
			transition:
				background-color 0.3s ease-out,
				scale 0.3s ease-out;
		}
		&:after {
			display: block;
			inline-size: 1rem;
			block-size: 1rem;
			content: '';
			background-image: url(/recruit/img/common/icon-link-arrow-right-01.svg);
			background-repeat: no-repeat;
			background-position: 50%;
			background-size: 0.38rem 0.69rem;
		}
	}
	.c-nav-sitemap__sublist {
		display: grid;
		row-gap: var(--base-scale-s);
		padding-block: var(--base-scale-m) 0;
		padding-inline: 0;
		margin: 0;
		@media (width < 768px) {
			grid-template-columns: 1fr 1fr;
		}
	}
	.c-nav-sitemap__sublist-item {
		display: grid;
		grid-template-columns: 1.5rem 1fr;
		align-items: start;
		padding: 0;
		margin: 0;
		margin-block: 0;
		margin-inline: 0;
		&:before {
			display: block;
			place-self: start center;
			inline-size: 0.5rem;
			block-size: 0.5rem;
			margin-block-start: 0.4rem;
			content: '';
			background-color: var(--color-tone-secondary);
			border-radius: 50%;
		}
	}
	.c-nav-sitemap__sublist-link {
		align-self: start;
		font-size: var(--font-size-various-small);
		line-height: 1.5;
		text-decoration: underline;
		text-decoration-thickness: 1px;
		text-decoration-color: #0000;
		text-underline-offset: 4px;
		transition: text-decoration-color 0.3s ease-out;
		@media (prefers-reduced-motion: no-preference) {
			transition: font-weight 0.3s ease-out;
		}
		@media (any-hover: hover) {
			&:hover {
				text-decoration-color: var(--color-must-lightest);
				@media (prefers-reduced-motion: no-preference) {
					font-weight: 700;
				}
			}
		}
		&[target='_blank'] {
			display: inline-flex;
			gap: var(--base-scale-s);
			align-items: center;
			&:after {
				display: inline-block;
				inline-size: 1rem;
				block-size: 1rem;
				content: '';
				background-image: url(/recruit/img/common/icon-link-blank-white.svg);
				background-repeat: no-repeat;
				background-position: 50%;
				background-size: contain;
			}
		}
	}
}
@layer component {
	.c-nav-local {
		max-inline-size: calc(
			var(--c-page-sub-content-width) + var(--content-margin-content-padding) * 2
		);
		padding-inline: var(--content-margin-content-padding);
		margin-inline: auto;
	}
	.c-nav-local__list {
		--c-nav-local-columns: 2;
		display: grid;
		grid-template-columns: repeat(var(--c-nav-local-columns), 1fr);
		grid-auto-rows: minmax(7.5rem, auto);
		gap: var(--base-scale-s);
		padding-block: var(--base-scale-2xl);
		padding-inline: var(--base-scale-2xl);
		margin: 0;
		background:
			var(--noise-texture-image-2) repeat 600px 600px,
			var(--color-sub-local-nav-background-02);
		@media (width < 768px) {
			grid-template-columns: 1fr;
			gap: var(--base-scale-m);
			padding-block: var(--base-scale-l);
			padding-inline: var(--base-scale-m);
		}
	}
	.c-nav-local__item {
		display: grid;
	}
	.c-nav-local__link {
		position: relative;
		display: grid;
		overflow: hidden;
		color: var(--color-must-lightest);
		text-decoration: none;
		isolation: isolate;
		@media (any-hover: hover) {
			&:hover {
				.c-nav-local__bg-image img {
					@media (prefers-reduced-motion: no-preference) {
						scale: 1.1;
					}
				}
				.c-nav-local__link-title {
					background-color: var(--color-bg-link-blue-transparent_hover);
				}
			}
		}
	}
	.c-nav-local__bg-image {
		position: absolute;
		inset: 0;
		z-index: var(--z-index-stack-behind);
		inline-size: 100%;
		block-size: 100%;
		overflow: hidden;
		img {
			display: block;
			inline-size: 100%;
			block-size: 100%;
			object-fit: cover;
			object-position: center;
			@media (prefers-reduced-motion: no-preference) {
				transition: scale 0.3s ease-out;
			}
		}
	}
	.c-nav-local__link-title {
		z-index: var(--z-index-stack-front);
		display: flex;
		align-items: center;
		justify-content: start;
		padding-block: var(--base-scale-l);
		padding-inline: var(--base-scale-l) var(--base-scale-m);
		font-size: var(--font-size-various-font-22);
		font-weight: var(--font-weight-jp-bold);
		line-height: 1.7;
		background-color: var(--color-sub-local-nav-link-background);
		backdrop-filter: blur(8px);
		transition: background-color 0.3s ease-out;
		span {
			display: flex;
			column-gap: var(--base-scale-m);
			align-items: center;
			&:before {
				display: block;
				flex-shrink: 0;
				inline-size: 1.375rem;
				block-size: 1.375rem;
				content: '';
				background-image: url(/recruit/img/common/icon-arrow-bg-primary-right-01.svg);
				background-repeat: no-repeat;
				background-position: 50%;
				background-size: contain;
			}
		}
	}
}
@layer component {
	.c-nav-breadcrumb {
		ol {
			display: flex;
			flex-wrap: wrap;
			column-gap: var(--base-scale-s);
			justify-content: flex-start;
			padding: 0;
			margin: 0;
			> li {
				list-style: none;
				&:last-child a {
					:after {
						display: none;
					}
				}
			}
		}
		a,
		div {
			display: inline-block;
			font-size: var(--font-size-various-small);
			line-height: 1.5;
			color: var(--color-current-text);
			@media (width < 768px) {
				font-size: var(--font-size-various-base);
			}
		}
		a {
			color: var(--color-text-link-text-link);
			text-decoration: underline;
			text-underline-offset: 4px;
		}
	}
	.c-nav-breadcrumb__item {
		display: inline-block;
		padding: 0;
		margin: 0;
		&:not(:last-child) {
			&:after {
				display: inline-block;
				inline-size: 1rem;
				block-size: 1rem;
				vertical-align: middle;
				content: '';
				background-image: url(/recruit/img/common/icon-arrow-bg-white-right-01.svg);
				background-repeat: no-repeat;
				background-position: 50%;
				background-size: 0.875rem 0.875rem;
			}
		}
	}
	.c-nav-breadcrumb__item[data-breadcrumb='current'] {
		a {
			text-decoration: none;
		}
	}
}
@layer component {
	.c-title-page {
		max-inline-size: 1200px;
		margin-inline: auto;
	}
	.c-title-page__container {
		display: grid;
		row-gap: 1rem;
	}
	.c-title-page__title {
		margin-block: 0;
		font-size: var(--font-size-title-h1);
		font-weight: var(--font-weight-jp-bold);
		line-height: 1.3;
		color: var(--color-text-base-font-primary);
		letter-spacing: 0.1rem;
		@media (width < 768px) {
			letter-spacing: 0.07rem;
		}
	}
	.c-title-page__subtitle {
		display: flex;
		column-gap: var(--base-scale-s);
		margin-block: 0;
		font-family: var(--font-family-en);
		font-size: var(--font-size-various-font-20);
		font-weight: var(--font-weight-en-bold);
		line-height: 1.3;
		color: var(--color-tone-primary);
		text-transform: uppercase;
		&:before {
			display: block;
			inline-size: 0.3125rem;
			block-size: 0.3125rem;
			content: '';
			background-color: var(--color-tone-secondary);
			border-radius: 999em;
		}
	}
}
@layer component {
	.c-title-page-bg {
		position: relative;
		max-inline-size: 1200px;
		margin-inline: auto;
		isolation: isolate;
	}
	.c-title-page-bg__container {
		display: grid;
		row-gap: 1rem;
	}
	.c-title-page-bg__title {
		margin-block: 0;
		font-size: var(--font-size-title-h1);
		font-weight: var(--font-weight-jp-bold);
		line-height: 1.3;
		color: var(--color-must-lightest);
		letter-spacing: 0.1rem;
		@media (width < 768px) {
			letter-spacing: 0.07rem;
		}
	}
	.c-title-page-bg__subtitle {
		display: flex;
		column-gap: var(--base-scale-s);
		margin-block: 0;
		font-family: var(--font-family-en);
		font-size: var(--font-size-various-font-20);
		font-weight: var(--font-weight-en-bold);
		line-height: 1.3;
		color: var(--color-must-lightest);
		text-transform: uppercase;
		&:before {
			display: block;
			inline-size: 0.3125rem;
			block-size: 0.3125rem;
			content: '';
			background-color: var(--color-tone-secondary);
			border-radius: 999em;
		}
	}
}
@layer component {
	.c-title-page-interview {
		position: relative;
		display: grid;
		grid-template-columns: 1fr min(47.22222%, 680px);
		column-gap: var(--base-scale-4xl);
		align-items: center;
		max-inline-size: 1320px;
		margin-inline-start: auto;
		isolation: isolate;
		@media (width < 768px) {
			grid-template-areas: 'kicker' 'subtitle' 'image' 'title' 'profile';
			grid-template-columns: 1fr;
		}
	}
	.c-title-page-interview__container,
	.c-title-page-interview__title-container {
		@media (width < 768px) {
			display: contents;
		}
	}
	.c-title-page-interview__title {
		margin-block: var(--base-scale-xl) 0;
		font-size: var(--font-size-title-h2);
		font-weight: 700;
		line-height: 1.6;
		color: var(--color-tone-primary);
		@media (width < 768px) {
			grid-area: title;
			padding-inline: var(--base-scale-m);
			margin-block-start: var(--base-scale-l);
		}
		> span {
			display: block;
		}
	}
	.c-title-page-interview__subtitle {
		margin-block: var(--base-scale-m) 0;
		font-size: var(--font-size-various-font-22);
		font-weight: 700;
		line-height: 1.3;
		color: var(--color-text-base-font-primary);
		letter-spacing: 0.055rem;
		@media (width < 768px) {
			grid-area: subtitle;
			padding-inline: var(--base-scale-m);
			margin-block-start: var(--base-scale-m);
		}
	}
	.c-title-page-interview__kicker {
		display: flex;
		column-gap: var(--base-scale-s);
		margin-block: 0;
		font-family: var(--font-family-en);
		font-size: var(--font-size-various-font-20);
		font-weight: var(--font-weight-en-bold);
		line-height: 1.3;
		color: var(--color-tone-primary);
		text-transform: uppercase;
		@media (width < 768px) {
			grid-area: kicker;
			padding-inline: var(--base-scale-m);
		}
		&:before {
			display: block;
			inline-size: 0.3125rem;
			block-size: 0.3125rem;
			content: '';
			background-color: var(--color-tone-secondary);
			border-radius: 999em;
		}
	}
	.c-title-page-interview__profile {
		margin-block-start: var(--base-scale-xl);
		@media (width < 768px) {
			grid-area: profile;
			padding-inline: var(--base-scale-m);
			margin-block-start: var(--base-scale-l);
		}
	}
	.c-title-page-interview__profile-name {
		display: flex;
		column-gap: 1rem;
		align-items: center;
	}
	.c-title-page-interview__profile-name-ja {
		font-size: var(--font-size-various-font-20);
		font-weight: 500;
		line-height: 1.5;
		color: var(--color-text-base-font-primary);
	}
	.c-title-page-interview__profile-name-en {
		font-family: var(--font-family-en);
		font-size: var(--font-size-various-small);
		font-weight: 400;
		line-height: 1.3;
		color: var(--color-tone-primary);
		letter-spacing: 0.0175rem;
	}
	.c-title-page-interview__profile-tags {
		display: flex;
		column-gap: 0.5rem;
		margin-block-start: var(--base-scale-s);
	}
	.c-title-page-interview__profile-tag {
		display: inline-block;
		padding-block: var(--base-scale-xs);
		padding-inline: var(--base-scale-s);
		font-size: 0.875rem;
		font-weight: 700;
		line-height: 1.5;
		color: var(--color-tone-primary);
		background: var(--color-bg-base-bg-light-blue);
	}
	.c-title-page-interview__profile-description {
		display: grid;
		row-gap: var(--base-scale-xs);
		margin-block-start: var(--base-scale-m);
		span {
			display: block;
			font-size: var(--font-size-various-small);
			font-weight: 500;
			line-height: 1.4;
			color: var(--color-text-base-font-primary);
		}
	}
	.c-title-page-interview__image {
		@media (width < 768px) {
			grid-area: image;
			margin-block-start: var(--base-scale-2xl);
		}
		img {
			display: block;
			inline-size: 100%;
			block-size: auto;
			aspect-ratio: 4/3;
		}
	}
}
@layer component {
	.c-title-page-crosstalk__title-container {
		position: relative;
		display: grid;
		row-gap: var(--base-scale-xl);
		max-inline-size: calc(1200px + var(--content-margin-content-padding) * 2);
		padding-block-end: var(--base-scale-2xl);
		padding-inline: var(--content-margin-content-padding);
		margin-inline: auto;
		isolation: isolate;
		@media (width < 768px) {
			padding-inline: var(--c-page-sub-gutter);
		}
	}
	.c-title-page-crosstalk__title {
		margin-block: 0;
		font-size: 2.25rem;
		font-weight: var(--font-weight-jp-bold);
		line-height: 1.6;
		color: var(--color-tone-primary);
		@media (width < 768px) {
			font-size: var(--font-size-various-font-26);
		}
		> span {
			display: block;
		}
	}
	.c-title-page-crosstalk__subtitle {
		display: flex;
		column-gap: var(--base-scale-s);
		margin-block: 0;
		font-family: var(--font-family-en);
		font-size: var(--font-size-various-font-20);
		font-weight: var(--font-weight-en-bold);
		line-height: 1.3;
		color: var(--color-tone-primary);
		text-transform: uppercase;
		&:before {
			display: block;
			inline-size: 0.3125rem;
			block-size: 0.3125rem;
			content: '';
			background-color: var(--color-tone-secondary);
			border-radius: 999em;
		}
	}
	.c-title-page-crosstalk__subtitle-black {
		margin-inline-start: var(--base-scale-m);
		color: var(--color-text-base-font-primary);
	}
	.c-title-page-crosstalk__image {
		position: relative;
		z-index: var(--z-index-stack-behind);
		aspect-ratio: 1440/600;
		margin-block-end: -40px;
		@media (width < 768px) {
			margin-block-end: var(--bgb-opt-bgb-opt--mb-default);
		}
		&:after {
			position: absolute;
			inset-block-start: -103px;
			inset-inline-end: 17px;
			inline-size: 112px;
			block-size: 144px;
			content: '';
			background-image: url(/recruit/img/common/obj-title-page-crosstalk-desktop.svg);
			background-repeat: no-repeat;
			background-position: 50%;
			background-size: contain;
			@media (768px <= width < 1000px) {
				inset-block-start: -45px;
				inset-inline-end: 10px;
				inline-size: 52px;
				block-size: 58px;
			}
			@media (width < 768px) {
				inset-block-start: -43px;
				inset-inline-end: 9px;
				inline-size: 51px;
				block-size: 52px;
				background-image: url(/recruit/img/common/obj-title-page-crosstalk-mobile.svg);
			}
		}
	}
	.c-title-page-crosstalk__image img {
		inline-size: 100%;
		block-size: 100%;
		object-fit: cover;
	}
	.c-title-page-crosstalk__members-container {
		position: relative;
		z-index: var(--z-index-stack-front);
		padding-inline: var(--content-margin-content-padding);
	}
	.c-title-page-crosstalk__members-list {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(344px, 1fr));
		gap: var(--base-scale-l);
		max-inline-size: 1080px;
		margin-inline: auto;
		@media (width < 768px) {
			grid-template-columns: 1fr;
		}
	}
	.c-title-page-crosstalk__members-item {
		display: grid;
		grid-template: 'image profile' auto 'description description' auto/auto 1fr;
		column-gap: var(--base-scale-l);
		align-content: start;
		padding: var(--base-scale-l);
		font-size: var(--font-size-various-small);
		background-color: var(--color-bg-bgb-bgb-opt--bg-gray);
	}
	.c-title-page-crosstalk__members-item-image {
		grid-area: image;
		inline-size: 100px;
		block-size: 115px;
		overflow: hidden;
	}
	.c-title-page-crosstalk__members-item-profile {
		display: grid;
		grid-area: profile;
		align-content: start;
	}
	.c-title-page-crosstalk__members-item-image img {
		inline-size: 100%;
		block-size: 100%;
		object-fit: cover;
	}
	.c-title-page-crosstalk__members-item-tag {
		inline-size: fit-content;
		block-size: fit-content;
		padding-block: var(--base-scale-xs);
		padding-inline: var(--base-scale-s);
		margin-block-end: var(--base-scale-s);
		font-weight: 700;
		line-height: 1.5;
		color: var(--color-tone-primary);
		background-color: var(--color-must-lightest);
	}
	.c-title-page-crosstalk__members-item-department,
	.c-title-page-crosstalk__members-item-joined-year {
		padding-block-end: var(--base-scale-xs);
		line-height: 1.4;
	}
	.c-title-page-crosstalk__members-item-facultyanddepartment {
		line-height: 1.4;
	}
	.c-title-page-crosstalk__members-item-name {
		display: flex;
		flex-direction: column;
		row-gap: var(--base-scale-xxs);
		block-size: fit-content;
		padding-block-start: var(--base-scale-s);
		font-size: var(--font-size-various-font-20);
		font-weight: 500;
		line-height: 1.5;
		letter-spacing: 0.0175rem;
	}
	.c-title-page-crosstalk__members-item-description {
		grid-area: description;
		padding-block-start: var(--base-scale-m);
		line-height: 1.5;
	}
}
@layer main-base {
	.c-content-main {
		--c-content-main-content-width: 1080px;
		--c-content-main-wide-layout-width: 1200px;
		--c-content-main-gutter: var(--content-margin-content-padding);
		display: grid;
		grid-template-columns: [full-start] minmax(
				var(--c-content-main-gutter),
				1fr
			) [content-start] minmax(
				0,
				var(--c-content-main-content-width)
			) [content-end] minmax(var(--c-content-main-gutter), 1fr) [full-end];
		@media (width < 768px) {
			--c-content-main-content-width: 1080px;
		}
		> * {
			grid-column: content;
			text-underline-offset: 4px;
		}
		section {
			&:last-child {
				margin-block-end: 0 !important;
			}
			> * {
				&:has(+ .code-block) {
					margin-block-end: 1em;
				}
				&:last-child {
					margin-block-end: 0 !important;
				}
			}
			:where(h2, h3, h4, h5, h6, p) {
				&:last-child {
					margin-block-end: 0;
				}
			}
			:where(ul, ol, table, blockquote) {
				&:has(+ .code-block) {
					margin-block-end: 1em;
				}
			}
			&.bg-wide,
			&.bg-wide-blue {
				grid-column: full;
			}
			&.bg-wide-blue {
				padding-block: var(--base-scale-7xl);
				overflow: clip;
				background-image: var(--noise-texture-image-10), var(--color-home-gradation-blue);
				background-repeat: repeat, no-repeat;
				background-position: 50%, 50%;
				background-size:
					600px 600px,
					cover;
			}
			&.bg-wide-members-carousel {
				grid-column: full;
				padding-block-end: var(--base-scale-7xl);
			}
			&.bg-wide-sp-only {
				@media (width < 768px) {
					grid-column: full;
				}
			}
		}
		:where(picture) {
			display: block;
		}
		:where(img) {
			display: block;
			inline-size: 100%;
			block-size: auto;
		}
		:where(figcaption) {
			font-size: var(--font-size-various-small);
			font-weight: 500;
			line-height: 1.5;
		}
		:where(h3, h4) {
			margin-block-end: 1.5rem;
		}
		:where(h5, h6) {
			margin-block-end: 1rem;
		}
		:where(h2, h3, h4, h5, h6) {
			line-height: 1.5;
		}
		:where(h2) {
			margin-block-end: 2rem;
			font-size: var(--font-size-title-h2);
			color: var(--color-tone-primary);
		}
		:where(h3) {
			padding-inline-start: var(--base-scale-m);
			font-size: var(--font-size-title-h3);
			border-inline-start: 8px solid var(--color-tone-primary);
		}
		:where(h4) {
			padding-block-end: var(--base-scale-m);
			padding-inline: var(--base-scale-s);
			font-size: var(--font-size-title-h4);
			border-block-end: 2px solid var(--color-border-gray-1);
		}
		:where(h5) {
			display: flex;
			gap: var(--base-scale-s);
			align-items: flex-start;
			font-size: var(--font-size-title-h5);
			color: var(--color-tone-primary);
			&:before {
				flex-shrink: 0;
				inline-size: 1.3125rem;
				block-size: 1.5rem;
				margin-block-start: var(--base-scale-xxs);
				content: '';
				background-image: url(/recruit/img/common/icon-text-maker.svg);
				background-repeat: no-repeat;
				background-position: 50%;
				background-size: contain;
			}
		}
		:where(h6) {
			display: flex;
			gap: var(--base-scale-m);
			align-items: start;
			font-size: var(--font-size-title-h6);
			&:before {
				flex-shrink: 0;
				inline-size: 1rem;
				block-size: 0.125rem;
				margin-block-start: 0.8rem;
				content: '';
				background-color: var(--color-tone-secondary);
				background-repeat: no-repeat;
				background-position: 50%;
				background-size: contain;
			}
		}
		:where(p) {
			font-size: var(--font-size-various-base);
			font-weight: var(--font-weight-jp-regular);
			line-height: 1.7;
			color: var(--color-text-base-font-primary);
		}
		:where(a) {
			font-weight: var(--font-weight-jp-medium);
			color: var(--color-tone-primary);
			text-decoration: underline;
			@media (any-hover: hover) {
				&:hover {
					color: var(--color-text-link-text-link-hover);
					text-decoration: none;
				}
			}
			&:not([href$='.pdf']):after {
				display: inline-block;
				margin-inline: 0.25rem;
				content: '';
				background-repeat: no-repeat;
				background-position: 50%;
				background-size: contain;
			}
			&:not([target='_blank'], [href$='.pdf']):after {
				inline-size: 1rem;
				block-size: 1rem;
				margin-block-end: 0.2rem;
				vertical-align: middle;
				background-image: url(/recruit/img/common/icon-arrow-primary.svg);
			}
			&[target='_blank']:not([href$='.pdf']):after {
				inline-size: 1.5rem;
				block-size: 1.5rem;
				vertical-align: sub;
				background-image: url(/recruit/img/common/icon-link-blank-blue.svg);
				@media (width < 768px) {
					margin-block-end: 0.15rem;
					vertical-align: middle;
				}
			}
			&[href$='.pdf']:after {
				display: inline-block;
				inline-size: fit-content;
				padding-block: 0.19rem;
				margin-inline: 0.25rem;
				font-family: var(--font-family-en);
				font-size: 0.75rem;
				line-height: 1;
				vertical-align: middle;
				color: var(--color-must-lightest);
				content: '.pdf';
				background-color: var(--color-must-darkest);
				background-image: none;
				border: 1px solid var(--color-must-darkest);
			}
		}
		:where(strong) {
			font-weight: var(--font-weight-jp-bold);
		}
		:where(blockquote) {
			position: relative;
			padding-block: var(--base-scale-2xl);
			padding-inline: var(--base-scale-2xl);
			font-size: var(--font-size-various-base);
			font-weight: var(--font-weight-jp-regular);
			line-height: 1.7;
			color: var(--color-text-base-font-gray);
			background-color: var(--color-bg-bgb-bgb-opt--bg-gray);
			@media (width < 768px) {
				padding-block: var(--base-scale-l);
				padding-inline: var(--base-scale-l);
			}
			&:after,
			&:before {
				position: absolute;
				display: block;
				inline-size: 2rem;
				block-size: 2rem;
				content: '';
				background-image: url(/recruit/img/common/obj-blockquote.svg);
				background-repeat: no-repeat;
				background-position: 50%;
				background-size: contain;
				@media (width < 768px) {
					inline-size: 1.5rem;
					block-size: 1.5rem;
				}
			}
			&:before {
				inset-block-start: 10px;
				inset-inline-start: 10px;
				@media (width < 768px) {
					inset-block-start: 4px;
					inset-inline-start: 4px;
				}
			}
			&:after {
				inset-block-end: 10px;
				inset-inline-end: 10px;
				@media (width < 768px) {
					inset-block-end: 4px;
					inset-inline-end: 4px;
				}
			}
		}
		:where(ul, ol) {
			margin-block-end: 0;
			list-style-position: inside;
		}
		:where(ul) > li {
			position: relative;
			padding-inline-start: calc(var(--base-scale-xs) + 1.5rem);
			margin-block-end: var(--base-scale-s);
			&:before {
				position: absolute;
				inset-block-start: 0.5625rem;
				inset-inline-start: 0.5rem;
				inline-size: 0.5rem;
				block-size: 0.5rem;
				content: '';
				background-color: var(--color-tone-secondary);
				border-radius: var(--radius-radius-max);
				@media (width < 768px) {
					inset-block-start: 0.4375rem;
				}
			}
		}
		:where(ul, ol) > li > ol > li,
		:where(ul, ol) > li > ul > li {
			margin-block-start: var(--base-scale-s);
		}
		:where(ul, ol) > li > ul > li:before {
			background-color: var(--color-border-gray-1);
		}
		:where(ul, ol) > li > :where(ul, ol) > li > ul > li:before {
			inset-block-start: 0.6875rem;
			inline-size: 10px;
			block-size: 4px;
			border-radius: 0;
		}
		:where(ol) {
			counter-reset: listnum;
		}
		:where(ol) > li {
			position: relative;
			padding-inline-start: calc(var(--base-scale-xs) + 1.5rem);
			margin-block-end: var(--base-scale-m);
			@media (width < 768px) {
				padding-inline-start: calc(var(--base-scale-xs) + 1rem);
				margin-block-end: var(--base-scale-s);
			}
			&:before {
				position: absolute;
				inset-block-start: 0;
				inset-inline-start: 0;
				padding-block: 6px;
				padding-inline: var(--base-scale-xxs);
				font-size: var(--font-size-various-small);
				font-weight: 500;
				line-height: 1;
				color: var(--color-tone-secondary);
				content: counter(listnum, decimal) '.';
				counter-increment: listnum;
			}
		}
		:where(ul, ol) > li > ol > li:before {
			color: var(--color-text-base-font-gray);
		}
		:where(table) {
			inline-size: 100%;
			border-collapse: collapse;
			caption {
				padding-block-end: var(--base-scale-s);
				font-size: var(--font-size-various-small);
				font-weight: 700;
				line-height: 1.5;
			}
		}
		:where(th, td) {
			padding: 1rem;
			padding-block: var(--base-scale-l);
			padding-inline: var(--base-scale-m);
			font-size: var(--font-size-various-base);
			line-height: 1.7;
			border: 1px solid var(--color-border-gray-1);
			@media (width < 768px) {
				padding-block: var(--base-scale-m);
			}
		}
		:where(th) {
			font-weight: 700;
			color: var(--color-must-lightest);
			background-color: var(--color-tone-primary);
		}
		:where(td) {
			background-color: var(--color-must-lightest);
		}
		.code-block {
			position: relative;
			&:not(:last-child) {
				margin-block-end: 0.5rem;
				&:not(:has(+ .elements-note)) {
					margin-block-end: 3rem;
				}
			}
			+ .elements-note {
				margin-block-end: 3rem;
			}
		}
		button.copy-btn {
			position: absolute;
			inset-block-start: 8px;
			inset-inline-end: 8px;
			padding-block: 4px;
			padding-inline: 8px;
			font-size: 0.8rem;
			color: var(--color-must-lightest);
			cursor: pointer;
			background-color: var(--color-must-darkest);
		}
		pre {
			padding: 1rem;
			overflow: auto;
			background: var(--color-must-lightest);
			border: 1px solid var(--color-border-gray-1);
			code {
				> span {
					color: var(--color-parts-base-color);
					span.element {
						color: var(--color-parts-element-color);
					}
					span.class {
						color: var(--color-parts-class-color);
					}
					span.name {
						color: var(--color-parts-name-color);
					}
					> span:not([class]) {
						color: var(--color-must-darkest);
					}
				}
			}
		}
		.elements-note {
			padding: 1em;
			margin-block-end: 0.5rem;
			overflow: auto;
			background: var(--color-bg-link-back);
		}
		&:has(.bg-wide-members-index) {
			position: relative;
			isolation: isolate;
		}
		.bg-wide-members-index {
			position: absolute;
			inset-block: 420px -145px;
			inset-inline: 0;
			z-index: var(--z-index-stack-behind);
			grid-column: full;
			content: '';
			background-image: var(--noise-texture-image-10), var(--color-home-gradation-blue);
			background-repeat: repeat, no-repeat;
			background-position: 50%, 50%;
			background-size:
				600px 600px,
				cover;
			@media (width < 768px) {
				inset-block: 580px max(-210px, -56svw);
			}
		}
	}
}
@layer main {
	.c-heading__02-white {
		color: var(--color-must-lightest);
	}
	.c-heading__03,
	.c-heading__04,
	.c-heading__05,
	.c-heading__06,
	.c-heading__table {
		all: unset;
		display: block;
		font-weight: 700;
		line-height: 1.5;
		&:last-child {
			margin-block-end: 0;
		}
	}
	.c-heading__03 {
		padding-inline: var(--base-scale-m) 0;
		border-block-end: none;
		border-inline-start: 8px solid var(--color-tone-primary);
	}
	.c-heading__03,
	.c-heading__03-bg {
		margin-block-end: 1.5rem;
		font-size: var(--font-size-title-h3);
	}
	.c-heading__03-bg {
		padding-block: var(--base-scale-s);
		padding-inline: var(--base-scale-m);
		color: var(--color-must-lightest);
		background-color: var(--color-tone-primary);
	}
	.c-heading__04 {
		padding-block-end: var(--base-scale-m);
		padding-inline: var(--base-scale-s);
		margin-block-end: 1.5rem;
		font-size: var(--font-size-title-h4);
		border-block-end: 2px solid var(--color-border-gray-1);
		border-inline-start: none;
	}
	.c-heading__05 {
		display: flex;
		gap: var(--base-scale-s);
		align-items: flex-start;
		padding: 0;
		margin-block-end: 1rem;
		font-size: var(--font-size-title-h5);
		color: var(--color-tone-primary);
		border: none;
		&:before {
			flex-shrink: 0;
			inline-size: 1.3125rem;
			block-size: 1.5rem;
			margin-block-start: var(--base-scale-xxs);
			content: '';
			background-image: url(/recruit/img/common/icon-text-maker.svg);
			background-repeat: no-repeat;
			background-position: 50%;
			background-size: contain;
		}
	}
	.c-heading__06 {
		display: flex;
		gap: var(--base-scale-m);
		align-items: start;
		padding: 0;
		margin-block-end: 1rem;
		font-size: var(--font-size-title-h6);
		border: none;
		&:before {
			flex-shrink: 0;
			inline-size: 1rem;
			block-size: 0.125rem;
			margin-block-start: 0.8rem;
			content: '';
			background-color: var(--color-tone-secondary);
			background-repeat: no-repeat;
			background-position: 50%;
			background-size: contain;
		}
	}
	.c-heading__table {
		margin-block-end: 1rem;
		font-size: var(--font-size-title-h4);
		font-weight: 700;
		line-height: 1.5;
		color: var(--color-text-base-font-primary);
	}
}
@layer main {
	.c-table__sm-block caption,
	.c-table__sm-block tbody,
	.c-table__sm-block td,
	.c-table__sm-block tfoot,
	.c-table__sm-block th,
	.c-table__sm-block thead,
	.c-table__sm-block tr {
		@media (width < 768px) {
			display: block;
		}
	}
	.c-table__sm-block td,
	.c-table__sm-block th {
		@media (width < 768px) {
			inline-size: 100%;
			margin-block-start: -1px;
		}
	}
	.c-table__sm-scroll {
		@media (width < 768px) {
			overflow-x: scroll;
		}
	}
	.c-table__sm-scroll:before {
		@media (width < 768px) {
			position: sticky;
			inset-inline-start: 0;
			display: inline-block;
			margin-block-end: 1rem;
			font-size: var(--font-size-various-small);
			line-height: 1.7;
			color: var(--color-text-base-font-gray);
			white-space: normal;
			content: '※左右にスクロールしてご覧ください';
		}
	}
	.c-table__sm-scroll table {
		@media (width < 768px) {
			inline-size: 800px;
			margin-block-end: 0.75rem;
		}
	}
	.c-table__opt-th-10 th {
		@media (768px <= width) {
			inline-size: 10%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-th-15 th:first-child {
		@media (768px <= width) {
			inline-size: 15%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-th-20 th:first-child {
		@media (768px <= width) {
			inline-size: 20%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-th-25 th:first-child {
		@media (768px <= width) {
			inline-size: 25%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-th-30 th:first-child {
		@media (768px <= width) {
			inline-size: 30%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-th-35 th:first-child {
		@media (768px <= width) {
			inline-size: 35%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-th-40 th:first-child {
		@media (768px <= width) {
			inline-size: 40%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-th-50 th:first-child {
		@media (768px <= width) {
			inline-size: 50%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-th-60 th:first-child {
		@media (768px <= width) {
			inline-size: 60%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-th-70 th:first-child {
		@media (768px <= width) {
			inline-size: 70%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-th-80 th:first-child {
		@media (768px <= width) {
			inline-size: 80%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-th-90 th:first-child {
		@media (768px <= width) {
			inline-size: 90%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-td-10 td:first-child {
		@media (768px <= width) {
			inline-size: 10%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-td-15 td:first-child {
		@media (768px <= width) {
			inline-size: 15%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-td-20 td:first-child {
		@media (768px <= width) {
			inline-size: 20%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-td-25 td:first-child {
		@media (768px <= width) {
			inline-size: 25%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-td-30 td:first-child {
		@media (768px <= width) {
			inline-size: 30%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-td-35 td:first-child {
		@media (768px <= width) {
			inline-size: 35%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-td-40 td:first-child {
		@media (768px <= width) {
			inline-size: 40%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-td-50 td:first-child {
		@media (768px <= width) {
			inline-size: 50%;
			min-inline-size: auto;
		}
		@media (width < 768px) {
			inline-size: 50%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-td-60 td:first-child {
		@media (768px <= width) {
			inline-size: 60%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-td-70 td:first-child {
		@media (768px <= width) {
			inline-size: 70%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-td-80 td:first-child {
		@media (768px <= width) {
			inline-size: 80%;
			min-inline-size: auto;
		}
	}
	.c-table__opt-td-90 td:first-child {
		@media (768px <= width) {
			inline-size: 90%;
			min-inline-size: auto;
		}
	}
	.c-table__image-box {
		display: flex;
		gap: var(--base-scale-s);
		align-items: center;
		@media (width < 768px) {
			flex-direction: column;
			align-items: flex-start;
		}
	}
	.c-table__image-box-item:has(img) {
		inline-size: 100%;
		max-inline-size: var(--c-table__image-box-item-img);
		block-size: auto;
		img {
			inline-size: 100%;
			block-size: auto;
		}
	}
}
@layer main {
	.c-box__bg-blue-01 {
		padding: var(--base-scale-2xl);
		background-color: var(--color-bg-base-secondary);
		@media (width < 768px) {
			padding: var(--base-scale-l);
		}
	}
	.c-box__bg-blue-02 {
		padding: var(--base-scale-2xl);
		background-color: var(--color-bg-base-bg-light-blue);
		@media (width < 768px) {
			padding: var(--base-scale-l);
		}
	}
	.c-box__bg-gray {
		padding: var(--base-scale-2xl);
		background-color: var(--color-bg-bgb-bgb-opt--bg-gray);
		@media (width < 768px) {
			padding: var(--base-scale-l);
		}
	}
	.c-box__bg-gray:has([class='c-button-group']) {
		background-image: var(--noise-texture-image-5);
		background-repeat: repeat, no-repeat;
		background-position: 50%, 50%;
		background-size:
			600px 600px,
			cover;
		@media (width < 768px) {
			padding-inline: var(--base-scale-m);
		}
	}
	.c-box__border-thin {
		padding: var(--base-scale-2xl);
		border: 1px solid var(--color-border-gray-1);
		@media (width < 768px) {
			padding: var(--base-scale-l);
		}
	}
	.c-box__border-bold {
		padding: var(--base-scale-2xl);
		border: 4px solid var(--color-border-gray-1);
		@media (width < 768px) {
			padding: var(--base-scale-l);
		}
	}
	.c-box__image-w10 {
		@media (768px <= width) {
			inline-size: 10%;
			margin-inline: auto;
		}
	}
	.c-box__image-w20 {
		@media (768px <= width) {
			inline-size: 20%;
			margin-inline: auto;
		}
	}
	.c-box__image-w30 {
		@media (768px <= width) {
			inline-size: 30%;
			margin-inline: auto;
		}
	}
	.c-box__image-w40 {
		@media (768px <= width) {
			inline-size: 40%;
			margin-inline: auto;
		}
	}
	.c-box__image-w50 {
		@media (768px <= width) {
			inline-size: 50%;
			margin-inline: auto;
		}
	}
	.c-box__image-w50-sp {
		@media (width < 768px) {
			inline-size: 50%;
			margin-inline: auto;
		}
	}
	.c-box__image-w60 {
		@media (768px <= width) {
			inline-size: 60%;
			margin-inline: auto;
		}
	}
	.c-box__image-w70 {
		@media (768px <= width) {
			inline-size: 70%;
			margin-inline: auto;
		}
	}
	.c-box__image-w80 {
		@media (768px <= width) {
			inline-size: 80%;
			margin-inline: auto;
		}
	}
	.c-box__image-w90 {
		@media (768px <= width) {
			inline-size: 90%;
			margin-inline: auto;
		}
	}
	.c-box__image-w100 {
		inline-size: 100%;
	}
	.c-box__wide {
		max-inline-size: 1440px;
		margin-inline: auto;
	}
	.c-box__philosophy {
		padding: var(--base-scale-2xl);
		border: 1px solid var(--color-border-gray-1);
		@media (width < 768px) {
			padding: var(--base-scale-l);
		}
	}
	.c-box__philosophy-content {
		display: grid;
		gap: var(--base-scale-2xl);
		@media (width < 768px) {
			gap: var(--base-scale-l);
		}
	}
	.c-box__philosophy-head {
		display: flex;
		gap: var(--base-scale-l);
		align-items: center;
		justify-content: center;
		@media (width < 768px) {
			gap: var(--base-scale-m);
		}
		> span {
			display: flex;
			flex-shrink: 0;
			align-items: center;
			align-self: stretch;
			justify-content: center;
			padding-block: var(--base-scale-xs);
			padding-inline: var(--base-scale-s);
			font-family: var(--font-family-en);
			font-size: var(--font-size-various-font-22);
			font-weight: 700;
			line-height: 1.7;
			color: var(--color-must-lightest);
			text-align: center;
			background-color: var(--color-current-text);
			@media (width < 768px) {
				font-size: var(--font-size-various-font-20);
			}
		}
	}
	.c-box__philosophy-heading {
		font-size: var(--font-size-various-font-26);
		font-weight: 700;
		line-height: 1.7;
		color: var(--color-text-base-font-primary);
		@media (width < 768px) {
			font-size: var(--font-size-various-font-22);
		}
		> span {
			display: block;
			margin-block-start: var(--base-scale-xs);
			font-size: var(--font-size-various-base);
			font-weight: 400;
			line-height: 1.7;
		}
	}
	.c-box__about-company {
		display: grid;
		row-gap: 160px;
		max-inline-size: 1440px;
		padding-inline: var(--base-scale-7xl);
		margin-inline: auto;
		@media (width < 768px) {
			row-gap: var(--base-scale-4xl);
			padding-inline: 0;
		}
	}
	.c-box__about-company-container {
		display: grid;
		gap: var(--base-scale-4xl);
		align-items: center;
		@media (width < 768px) {
			display: grid;
			grid-template-areas: 'heading' 'catchphrase' 'image' 'link';
			grid-template-columns: 1fr;
			gap: 0;
		}
		&:first-child {
			@media (768px <= width) {
				grid-template-columns: 1fr minmax(0, 1fr);
			}
		}
		&:last-child {
			@media (768px <= width) {
				grid-template-columns: minmax(0, 1fr) 1fr;
			}
		}
	}
	.c-box__about-company-image {
		max-inline-size: 640px;
		@media (width < 768px) {
			grid-area: image;
			padding-inline: var(--base-scale-m);
		}
	}
	.c-box__about-company-column {
		@media (width < 768px) {
			display: contents;
		}
	}
	.c-box__about-company-heading,
	.c-box__about-company-heading-right {
		position: relative;
		display: flex;
		padding-block: 37px;
		margin-block-end: var(--base-scale-l);
		overflow: visible;
		@media (width < 768px) {
			grid-area: heading;
			padding-block: 11px;
			padding-inline: var(--base-scale-l);
			margin-block-end: var(--base-scale-m);
		}
		h2 {
			position: relative;
			display: inline-block;
			padding-inline-start: 46px;
			margin-inline: var(--c-home-people-gutter);
			font-size: 2rem;
			font-weight: 700;
			line-height: 1.7;
			color: var(--color-must-lightest);
			letter-spacing: 0.32rem;
			@media (width < 768px) {
				padding-inline-start: 37px;
				margin-inline: 0 var(--base-scale-s);
				letter-spacing: 0.24rem;
			}
			&:before {
				position: absolute;
				inset-block: 0;
				inset-inline-start: 0;
				display: inline-block;
				inline-size: 3rem;
				block-size: 2.3125rem;
				margin-block: auto;
				content: '';
				background: url(/recruit/img/common/icon-text-maker-red.svg) no-repeat 50% /
					contain;
				@media (width < 768px) {
					inset-inline-start: 0;
					inline-size: 1.5rem;
				}
			}
		}
	}
	.c-box__about-company-heading-right {
		@media (width < 768px) {
			justify-content: flex-end;
		}
	}
	.c-box__about-company-heading-bg {
		position: absolute;
		inset-block: 0;
		margin-block: auto;
		font-family: var(--font-family-en);
		font-size: 8rem;
		font-weight: 700;
		line-height: 1;
		color: var(--color-must-lightest);
		white-space: nowrap;
		opacity: 0.2;
		@media (width < 768px) {
			font-size: 4.5rem;
		}
	}
	.c-box__about-company-catchphrase {
		margin-block-end: var(--base-scale-2xl);
		font-size: var(--font-size-various-font-28);
		font-weight: 700;
		line-height: 1.8;
		color: var(--color-must-lightest);
		@media (width < 768px) {
			grid-area: catchphrase;
			padding-inline: var(--base-scale-l);
			font-size: var(--font-size-various-font-24);
		}
	}
	.c-box__about-company-link {
		@media (width < 768px) {
			grid-area: link;
			padding-inline: var(--base-scale-l);
			margin-block-start: var(--base-scale-2xl);
		}
	}
}
@layer main {
	.c-column {
		display: flex;
		@media (width < 768px) {
			flex-direction: column;
		}
	}
	.c-column:has(> :nth-child(2)) {
		--c-column-gap: var(--column-gap-2col);
	}
	.c-column:has(> :nth-child(3)) {
		--c-column-gap: var(--column-gap-3col);
	}
	.c-column:has(> :nth-child(4)) {
		--c-column-gap: var(--column-gap-4col);
	}
	.c-column:has(> :nth-child(5)) {
		--c-column-gap: var(--column-gap-5col);
	}
	.c-column:has(> :nth-child(2)),
	.c-column:has(> :nth-child(3)),
	.c-column:has(> :nth-child(4)),
	.c-column:has(> :nth-child(5)) {
		gap: var(--c-column-gap);
	}
	.c-column__jc-start {
		@media (768px <= width) {
			justify-content: start;
		}
	}
	.c-column__jc-center {
		@media (768px <= width) {
			justify-content: center;
		}
	}
	.c-column__jc-end {
		@media (768px <= width) {
			justify-content: end;
		}
	}
	.c-column.c-column__ref-cols-3 {
		--c-column-ref-cols: 3;
		--c-column-gap: var(--column-gap-3col);
	}
	.c-column.c-column__ref-cols-4 {
		--c-column-ref-cols: 4;
		--c-column-gap: var(--column-gap-4col);
	}
	.c-column.c-column__ref-cols-5 {
		--c-column-ref-cols: 5;
		--c-column-gap: var(--column-gap-5col);
	}
	.c-column.c-column__ref-cols-3 > .c-column__item,
	.c-column.c-column__ref-cols-4 > .c-column__item,
	.c-column.c-column__ref-cols-5 > .c-column__item {
		@media (768px <= width) {
			flex: 0 0 auto;
			inline-size: calc(
				(100% - (var(--c-column-ref-cols) - 1) * var(--c-column-gap)) /
					var(--c-column-ref-cols)
			);
			min-inline-size: 0;
		}
	}
	.c-column.c-column__ref-cols-3
		> .c-column__item:not([class*='c-column__item-ref-sm-w']),
	.c-column.c-column__ref-cols-4
		> .c-column__item:not([class*='c-column__item-ref-sm-w']),
	.c-column.c-column__ref-cols-5
		> .c-column__item:not([class*='c-column__item-ref-sm-w']) {
		@media (width < 768px) {
			flex: 1 1 100%;
			inline-size: 100%;
		}
	}
	.c-column__item {
		flex: 1 1 0;
		@media (width < 768px) {
			flex: 1 1 100%;
		}
	}
	.c-column__item:has(.safety-ig-block) {
		@media (768px <= width) {
			flex: 0 1 320px;
		}
	}
	.c-column__item > [class^='c-box__border'] {
		block-size: 100%;
	}
	.c-column__item-w1 {
		inline-size: calc((100% - var(--c-column-gap)) / 12 * 1);
		@media (width < 768px) {
			inline-size: 100%;
		}
	}
	.c-column__item-w2 {
		inline-size: calc((100% - var(--c-column-gap)) / 12 * 2);
		@media (width < 768px) {
			inline-size: 100%;
		}
	}
	.c-column__item-w3 {
		inline-size: calc((100% - var(--c-column-gap)) / 12 * 3);
		@media (width < 768px) {
			inline-size: 100%;
		}
	}
	.c-column__item-w4 {
		inline-size: calc((100% - var(--c-column-gap)) / 12 * 4);
		@media (width < 768px) {
			inline-size: 100%;
		}
	}
	.c-column__item-w5 {
		inline-size: calc((100% - var(--c-column-gap)) / 12 * 5);
		@media (width < 768px) {
			inline-size: 100%;
		}
	}
	.c-column__item-w6 {
		inline-size: calc((100% - var(--c-column-gap)) / 12 * 6);
		@media (width < 768px) {
			inline-size: 100%;
		}
	}
	.c-column__item-w7 {
		inline-size: calc((100% - var(--c-column-gap)) / 12 * 7);
		@media (width < 768px) {
			inline-size: 100%;
		}
	}
	.c-column__item-w8 {
		inline-size: calc((100% - var(--c-column-gap)) / 12 * 8);
		@media (width < 768px) {
			inline-size: 100%;
		}
	}
	.c-column__item-w9 {
		inline-size: calc((100% - var(--c-column-gap)) / 12 * 9);
		@media (width < 768px) {
			inline-size: 100%;
		}
	}
	.c-column__item-w10 {
		inline-size: calc((100% - var(--c-column-gap)) / 12 * 10);
		@media (width < 768px) {
			inline-size: 100%;
		}
	}
	.c-column__item-w11 {
		inline-size: calc((100% - var(--c-column-gap)) / 12 * 11);
		@media (width < 768px) {
			inline-size: 100%;
		}
	}
	.c-column__item-w12 {
		inline-size: calc((100% - var(--c-column-gap)) / 12 * 12);
		@media (width < 768px) {
			inline-size: 100%;
		}
	}
	.c-column:has(> [class*='c-column__item-sm-w']) {
		@media (width < 768px) {
			flex-flow: row wrap;
		}
	}
	.c-column__item[class*='c-column__item-sm-w'] {
		@media (width < 768px) {
			min-inline-size: 0;
		}
	}
	.c-column__item-sm-w6 {
		@media (width < 768px) {
			flex: 0 1 calc((100% - var(--c-column-gap)) / 12 * 6);
		}
	}
	.c-column.c-column__ref-cols-3:has(> [class*='c-column__item-ref-sm-w']),
	.c-column.c-column__ref-cols-4:has(> [class*='c-column__item-ref-sm-w']),
	.c-column.c-column__ref-cols-5:has(> [class*='c-column__item-ref-sm-w']) {
		@media (width < 768px) {
			flex-flow: row wrap;
		}
	}
	.c-column__item[class*='c-column__item-ref-sm-w'] {
		@media (width < 768px) {
			min-inline-size: 0;
		}
	}
	.c-column__item-ref-sm-w6 {
		@media (width < 768px) {
			flex: 0 1 calc((100% - var(--c-column-gap)) / 12 * 6);
		}
	}
	.c-column__item-text {
		padding-block-start: var(--base-scale-m);
	}
	.c-column:has(.c-column__item-btn) {
		align-items: center;
		justify-content: center;
	}
	.c-column__item-btn {
		inline-size: 100%;
		@media (width < 768px) {
			max-inline-size: 17.5rem;
		}
	}
}
@layer main {
	.c-button__link,
	.c-button__link-back,
	.c-button__link-em,
	.c-button__link-em-red {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		inline-size: fit-content;
		min-inline-size: min(100%, 17.5rem);
		max-inline-size: 25rem;
		block-size: auto;
		min-block-size: 4rem;
		padding-block: var(--base-scale-s);
		padding-inline: var(--base-scale-m);
		margin-inline: auto;
		font-size: var(--font-size-button-normal);
		font-weight: 700;
		line-height: 1.5;
		text-align: center;
		text-decoration: none;
		transition:
			background-color 0.3s ease-out,
			color 0.3s ease-out;
	}
	[class*='c-column__item-btn'] .c-button__link,
	[class*='c-column__item-btn'] .c-button__link-back,
	[class*='c-column__item-btn'] .c-button__link-em,
	[class*='c-column__item-btn'] .c-button__link-em-red {
		inline-size: 100%;
		@media (768px <= width) {
			min-inline-size: revert;
			max-inline-size: revert;
		}
	}
	.c-button__link {
		padding-inline: 2.75rem;
		color: var(--color-text-link-text-link);
		background-color: var(--color-bg-link-normal);
		border: 2px solid var(--color-tone-primary);
		@media (any-hover: hover) {
			&:hover {
				color: var(--color-must-lightest);
				background-color: var(--color-bg-link-normal-hover);
				&:after {
					background-image: url(/recruit/img/common/icon-link-arrow-right-02.svg);
				}
			}
			&[target='_blank']:hover:after {
				background-image: url(/recruit/img/common/icon-link-blank-white-02.svg);
			}
			&[href$='.pdf']:hover:after {
				color: var(--color-tone-secondary);
				background-color: var(--color-must-lightest);
				background-image: none;
				border: 1px solid var(--color-must-lightest);
			}
		}
		&:after {
			position: absolute;
			inset-block: 0;
			inset-inline-end: 1rem;
			display: inline-block;
			inline-size: 1.5rem;
			block-size: 1.5rem;
			margin-block: auto;
			content: '';
			background-image: url(/recruit/img/common/icon-arrow-primary-02.svg);
			background-repeat: no-repeat;
			background-position: 50%;
			background-size: contain;
			transition: background-image 0.3s ease-out;
		}
		&[target='_blank']:after {
			background-image: url(/recruit/img/common/icon-link-blank.svg);
			background-size: 1.1875rem auto;
		}
		&[href$='.pdf']:after {
			inline-size: auto;
			min-inline-size: 1.4375rem;
			block-size: fit-content;
			padding-block: 0.1563rem;
			padding-inline: 0.125rem;
			font-family: var(--font-family-en);
			font-size: 0.75rem;
			font-weight: 500;
			line-height: 1rem;
			color: var(--color-must-lightest);
			text-align: center;
			content: 'pdf';
			background-color: var(--color-tone-secondary);
			background-image: none;
			border: 1px solid var(--color-tone-secondary);
			transition:
				color 0.3s ease-out,
				background-color 0.3s ease-out,
				border 0.3s ease-out;
		}
	}
	.c-button__link-back {
		padding-inline: 2.25rem;
		color: var(--color-must-darkest);
		background-color: var(--color-bg-link-back);
		border: 2px solid var(--color-border-gray-1);
		@media (any-hover: hover) {
			&:hover {
				color: var(--color-must-lightest);
				background-color: var(--color-bg-link-back-hover);
				&:before {
					background-image: url(/recruit/img/common/icon-arrow-left-white.svg);
				}
			}
		}
		&:before {
			position: absolute;
			inset-inline-start: 1rem;
			display: inline-block;
			inline-size: 1rem;
			block-size: 1rem;
			content: '';
			background-image: url(/recruit/img/common/icon-arrow-left-black.svg);
			background-repeat: no-repeat;
			background-position: 50%;
			background-size: contain;
			transition: background-image 0.3s ease-out;
		}
		&:after {
			all: revert;
		}
	}
	.c-button__link-em,
	.c-button__link-em-red {
		padding-inline: 2.75rem;
		color: var(--color-must-lightest);
		background-color: var(--color-bg-link-emphasis);
		@media (any-hover: hover) {
			&:hover {
				color: var(--color-must-lightest);
				background-color: var(--color-bg-link-emphasis-hover);
			}
		}
		&:after {
			position: absolute;
			inset-inline-end: 1rem;
			display: inline-block;
			inline-size: 1.5rem;
			block-size: 1.5rem;
			content: '';
			background-image: url(/recruit/img/common/icon-link-arrow-right-02.svg);
			background-repeat: no-repeat;
			background-position: 50%;
			background-size: contain;
		}
	}
	.c-button__link-em-red {
		background-color: var(--color-tone-secondary);
		@media (any-hover: hover) {
			&:hover {
				background-color: var(--color-bg-link-emphasis-red-hover);
			}
		}
	}
}
@layer main {
	.c-button-group__heading {
		position: relative;
		text-align: center;
		isolation: isolate;
		h2 {
			position: relative;
			z-index: var(--z-index-stack-front);
			display: flex;
			align-items: center;
			justify-content: center;
			margin-block: 0;
			margin-block-end: var(--base-scale-2xl);
			font-size: var(--font-size-title-h2);
			font-weight: 700;
			line-height: 1.7;
			color: var(--color-must-darkest);
			@media (width < 768px) {
				margin-block-end: var(--base-scale-l);
			}
		}
	}
	.c-button-group__heading h2:before {
		display: inline-block;
		inline-size: 2.5rem;
		block-size: 2.3125rem;
		content: '';
		background-image: url(/recruit/img/common/icon-text-maker-red.svg);
		background-repeat: no-repeat;
		background-position: 50%;
		background-size: contain;
	}
	.c-button-group__heading-bg {
		position: absolute;
		inset-block: 0;
		inset-inline: 0;
		block-size: fit-content;
		margin-block: auto;
		font-family: var(--font-family-en);
		font-size: 6.875rem;
		font-weight: 500;
		line-height: 1;
		opacity: 0.05;
		@media (width < 768px) {
			font-size: min(80px, 22.93333svw);
		}
	}
	.c-button-group__link {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--base-scale-m);
		@media (width < 768px) {
			grid-template-columns: 1fr;
		}
	}
	.c-button-group__item {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		min-block-size: 4rem;
		padding-inline: 2.5rem;
		font-size: var(--font-size-various-large,);
		font-weight: 700;
		line-height: 1.5;
		color: var(--color-must-lightest);
		text-decoration: none;
		background-color: var(--color-tone-secondary);
		transition: background-color 0.3s ease-out;
	}
	.c-button-group__item:hover {
		background-color: var(--color-bg-link-emphasis-red-hover);
	}
	.c-button-group__item:after {
		position: absolute;
		inset-inline-end: var(--base-scale-m);
		inline-size: 1.5rem;
		block-size: 1.5rem;
		margin: 0;
		content: '';
		background-image: url(/recruit/img/common/icon-link-arrow-right-02.svg);
		background-repeat: no-repeat;
		background-position: 50%;
		background-size: contain;
	}
	.c-button-group__item[target='_blank']:after {
		background-image: url(/recruit/img/common/icon-link-blank-white.svg);
	}
}
@layer main {
	.c-list__ol-note {
		display: grid;
		li {
			position: relative;
			list-style: none;
		}
		ol,
		ul {
			margin-block: 0;
		}
		> li {
			padding-inline-start: 1rem;
			font-size: var(--font-size-various-small);
			line-height: 1.7;
			color: var(--color-text-base-font-gray);
			&:has(+ li) {
				margin-block-end: 0.5rem;
			}
			&:before {
				position: absolute;
				inset-block-start: 0;
				inset-inline-start: 0;
				display: flex;
				align-items: center;
				min-inline-size: var(--font-size-various-small);
				min-block-size: 1.4rem;
				padding-block: 0;
				padding-inline: 0;
				font-size: inherit;
				font-weight: inherit;
				color: inherit;
				content: '※';
			}
		}
	}
}
@layer main {
	.c-banner-numbers {
		position: relative;
		isolation: isolate;
	}
	.c-banner-numbers__container {
		display: grid;
		grid-template-rows: auto;
		grid-template-columns: minmax(0, 1fr);
	}
	.c-banner-numbers__bg {
		position: relative;
		z-index: var(--z-index-stack-behind);
		display: block;
		grid-row: 1;
		grid-column: 1;
		inline-size: 100%;
		img {
			display: block;
			inline-size: 100%;
			block-size: 100%;
			min-block-size: 31.25rem;
			object-fit: cover;
			object-position: center;
			@media (width < 768px) {
				object-position: left center;
			}
		}
	}
	.c-banner-numbers__content {
		z-index: var(--z-index-stack-front);
		display: grid;
		grid-row: 1;
		grid-column: 1;
		place-self: center;
		background-color: var(--color-infographics-banner-background);
		box-shadow: 0 0 48px 0 var(--color-infographics-banner-shadow);
		@media (768px <= width) {
			row-gap: var(--base-scale-3xl);
			max-inline-size: 32.5rem;
			block-size: fit-content;
			min-block-size: 18.875rem;
			max-block-size: 31.25rem;
			padding-block: 56px;
			padding-inline: 120px;
		}
		@media (width < 768px) {
			row-gap: var(--base-scale-l);
			max-inline-size: 328px;
			block-size: fit-content;
			padding-block: var(--base-scale-4xl);
			padding-inline: var(--base-scale-l);
		}
		:last-child {
			margin-block-end: 0;
		}
	}
	.c-banner-numbers__content-heading {
		display: flex;
		flex-direction: column;
		row-gap: 4px;
		place-items: center;
		span {
			font-family: var(--font-family-en);
			font-size: var(--font-size-various-font-20);
			line-height: 1;
			color: var(--color-tone-primary);
			letter-spacing: 0.05rem;
		}
		h2,
		span {
			font-weight: 700;
			text-align: center;
		}
		h2 {
			display: block;
			font-size: var(--font-size-title-h2);
			line-height: 1.7;
			color: var(--color-must-darkest);
		}
	}
}
@layer main {
	.c-link__list-anchor-3col {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 15px;
		@media (width < 768px) {
			grid-template-columns: 1fr;
		}
	}
	.c-link__list-anchor-item {
		display: grid;
		padding-block: 0;
		padding-inline: 0;
		margin-block: 0;
		margin-inline: 0;
		background-color: var(--color-must-lightest);
		&:before {
			all: revert;
		}
		a {
			display: grid;
			grid-template-columns: 1fr auto;
			column-gap: var(--base-scale-s);
			align-items: center;
			padding-block: var(--base-scale-m);
			padding-inline: var(--base-scale-m);
			font-size: var(--font-size-various-base);
			font-weight: 500;
			line-height: 1.7;
			color: var(--color-text-base-font-primary);
			text-decoration: none;
			transition:
				color 0.3s ease-out,
				background-color 0.3s ease-out;
			@media (any-hover: hover) {
				&:hover {
					color: var(--color-must-lightest);
					background-color: var(--color-tone-primary);
				}
			}
			&:after {
				display: block;
				inline-size: 1.5rem;
				block-size: 1.5rem;
				margin-inline: 0;
				content: '';
				background-image: url(/recruit/img/common/icon-anchor-dropdown.svg);
				background-repeat: no-repeat;
				background-position: 50%;
				background-size: contain;
			}
		}
	}
	.c-link__image {
		display: block;
		text-decoration: none;
		@media (prefers-reduced-motion: no-preference) {
			@media (any-hover: hover) {
				&:hover {
					img {
						scale: 1.1;
					}
				}
			}
		}
		caption,
		figcaption {
			color: var(--color-text-base-font-primary);
		}
		figure > div,
		picture {
			overflow: hidden;
		}
		img {
			transition: scale 0.3s ease-out;
		}
		&:after {
			all: revert;
		}
	}
}
@layer main {
	.c-index {
		--c-index-columns: 2;
		display: grid;
		grid-template-columns: repeat(var(--c-index-columns), 1fr);
		gap: var(--base-scale-2xl);
		@media (width < 768px) {
			grid-template-columns: 1fr;
		}
	}
	.c-index__no-image {
		--c-index-columns: 2;
		display: grid;
		grid-template-columns: repeat(var(--c-index-columns), 1fr);
		gap: var(--base-scale-2xl);
		@media (width < 768px) {
			grid-template-columns: 1fr;
			row-gap: var(--base-scale-l);
		}
	}
	.c-index__item {
		> a,
		> div {
			display: grid;
			row-gap: var(--base-scale-m);
			text-decoration: none;
			&:after {
				all: revert;
			}
			&:not(:has(.c-index__item-image)) {
				padding-block: var(--base-scale-l);
				padding-inline: var(--base-scale-l);
				border: 1px solid var(--color-border-gray-1);
			}
			&[target='_blank'] {
				.c-index__item-title {
					padding-inline-end: 1.5rem;
					&:after {
						position: absolute;
						inset-inline-end: 0;
						display: block;
						flex-shrink: 0;
						align-self: center;
						inline-size: 1.5rem;
						block-size: 1.5rem;
						content: '';
						background-image: url(/recruit/img/common/icon-link-blank-blue.svg);
						background-repeat: no-repeat;
						background-position: 50%;
						background-size: contain;
					}
				}
			}
		}
		> a {
			@media (any-hover: hover) {
				&:hover {
					@media (prefers-reduced-motion: no-preference) {
						.c-index__item-image img {
							scale: 1.1;
						}
					}
					.c-index__item-title {
						color: var(--color-tone-primary);
					}
				}
			}
			.c-index__item-title {
				&:before {
					display: block;
					flex-shrink: 0;
					inline-size: 1.5rem;
					block-size: 1.75rem;
					content: '';
					background-image: url(/recruit/img/common/icon-arrow-bg-primary-right-01.svg);
					background-repeat: no-repeat;
					background-position: 50%;
					background-size: 1.38rem 100%;
				}
			}
		}
		&:not(:has(a)) {
			.c-index__item-text {
				gap: var(--base-scale-s);
			}
		}
	}
	.c-index__item-image {
		overflow: hidden;
		img {
			@media (prefers-reduced-motion: no-preference) {
				transition: scale 0.3s ease-out;
			}
		}
	}
	.c-index__item-text {
		display: grid;
		row-gap: 1rem;
	}
	.c-index__item-title {
		position: relative;
		display: flex;
		column-gap: 0.5rem;
		font-size: var(--font-size-various-font-20);
		font-weight: 700;
		line-height: 1.4;
		transition: color 0.3s ease-out;
	}
	.c-index__item-description {
		font-size: var(--font-size-various-base);
		font-weight: 400;
		line-height: 1.7;
		li:not([href='']) {
			color: var(--color-text-base-font-primary);
		}
	}
	.c-index__interview {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: var(--base-scale-2xl) var(--column-gap-3col);
		@media (width <= 1024px) {
			grid-template-columns: repeat(2, 1fr);
		}
		@media (width < 768px) {
			grid-template-columns: 1fr;
		}
	}
	.c-index__interview-item {
		position: relative;
		display: grid;
		grid-template-rows: subgrid;
		grid-row: span 3;
		row-gap: 0;
		text-decoration: none;
		isolation: isolate;
		@media (any-hover: hover) {
			&:hover {
				[class='c-index__interview-item-image'] {
					img {
						@media (prefers-reduced-motion: no-preference) {
							scale: 1.1;
						}
					}
				}
				[class='c-index__interview-item-textarea']:after {
					background-color: var(--color-bg-link-emphasis-red-hover);
				}
				[class='c-index__interview-item-title'] {
					color: var(--color-tone-primary);
				}
			}
		}
		&:after {
			display: none;
		}
	}
	.c-index__interview-item-category {
		position: absolute;
		inset-block-start: 0;
		inset-inline-start: 0;
		z-index: var(--z-index-stack-front);
		padding-block: var(--base-scale-xs);
		padding-inline: var(--base-scale-s);
		font-size: var(--font-size-various-base);
		font-weight: 700;
		line-height: 1.7;
		color: var(--color-tone-primary);
		background-color: var(--color-must-lightest);
	}
	.c-index__interview-item-image {
		position: relative;
		aspect-ratio: 339/316;
		overflow: hidden;
	}
	.c-index__interview-item-image img {
		inline-size: 100%;
		block-size: 100%;
		object-fit: cover;
		transition: scale 0.3s ease-out;
	}
	.c-index__interview-item-image-textarea {
		position: absolute;
		inset-block-end: 0;
		inline-size: 100%;
		padding-block: var(--base-scale-2xl) var(--base-scale-m);
		padding-inline: var(--base-scale-m);
		background: var(--color-home-gradation-gray);
	}
	.c-index__interview-item-group {
		margin-block-end: var(--base-scale-s);
		font-size: var(--font-size-various-font-20);
		font-weight: 700;
		line-height: 1.5;
		color: var(--color-must-lightest);
	}
	.c-index__interview-item-faculty {
		font-size: var(--font-size-various-small);
	}
	.c-index__interview-item-faculty,
	.c-index__interview-item-name {
		font-weight: 500;
		line-height: 1.7;
		color: var(--color-must-lightest);
	}
	.c-index__interview-item-name {
		font-size: var(--font-size-various-base);
	}
	.c-index__interview-item-textarea {
		position: relative;
		display: grid;
		grid-template-rows: subgrid;
		grid-row: span 2;
		padding-block: var(--base-scale-m) var(--base-scale-3xl);
		padding-inline: var(--base-scale-l);
		background-color: var(--color-must-lightest);
		&:after {
			position: absolute;
			inset-block-end: 0;
			inset-inline-end: 0;
			inline-size: 32px;
			block-size: 32px;
			margin-inline: 0;
			content: '';
			background-color: var(--color-tone-secondary);
			background-image: none;
			clip-path: url('data:image/svg+xml;utf8,%3Csvg xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="p" clipPathUnits="objectBoundingBox"%3E%3Cpolygon points="1 0, 0 1, 1 1"/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E#p');
			clip-path: polygon(100% 0, 0 100%, 100% 100%);
			transition: background-color 0.3s ease-out;
		}
	}
	.c-index__interview-item-title {
		padding: 0;
		margin-block-end: var(--base-scale-m);
		font-size: var(--font-size-various-font-22);
		font-weight: 700;
		line-height: 1.6;
		color: var(--color-text-base-font-primary);
		letter-spacing: 0.0275rem;
		border: none;
		transition: color 0.3s ease-out;
	}
	.c-index__interview-item-department {
		display: flex;
		flex-wrap: wrap;
		gap: var(--base-scale-s);
		align-content: start;
	}
	.c-index__interview-item-department-item {
		inline-size: fit-content;
		padding-block: var(--base-scale-xs);
		padding-inline: var(--base-scale-s);
		font-size: var(--font-size-various-small);
		font-weight: 700;
		line-height: 1.5;
		color: var(--color-tone-primary);
		background-color: var(--color-bg-base-bg-light-blue);
		&:before {
			margin-inline-end: var(--base-scale-xs);
			content: '#';
		}
	}
	.c-index__crosstalk {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--base-scale-3xl) var(--base-scale-2xl);
		@media (width < 768px) {
			grid-template-columns: 1fr;
			row-gap: var(--base-scale-xl);
		}
	}
	.c-index__crosstalk-item {
		position: relative;
		display: flex;
		flex-direction: column;
		text-decoration: none;
		isolation: isolate;
		@media (any-hover: hover) {
			&:hover {
				[class='c-index__crosstalk-item-image'] {
					img {
						@media (prefers-reduced-motion: no-preference) {
							scale: 1.1;
						}
					}
				}
				[class='c-index__crosstalk-item-textarea']:after {
					background-color: var(--color-bg-link-emphasis-red-hover);
				}
				[class='c-index__crosstalk-item-text-main'] {
					color: var(--color-tone-primary);
				}
			}
		}
		&:after {
			display: none;
		}
	}
	.c-index__crosstalk-item-title {
		position: absolute;
		inset-block-start: 0;
		inset-inline-start: 0;
		z-index: var(--z-index-stack-front);
		padding-block: var(--base-scale-xs);
		padding-inline: var(--base-scale-s);
		font-size: var(--font-size-various-base);
		font-weight: 700;
		line-height: 1.5;
		color: var(--color-tone-primary);
		background-color: var(--color-must-lightest);
	}
	.c-index__crosstalk-item-image {
		position: relative;
		overflow: hidden;
	}
	.c-index__crosstalk-item-image img {
		aspect-ratio: 338/190;
		transition: scale 0.3s ease-out;
	}
	.c-index__crosstalk-item-textarea {
		position: relative;
		flex-grow: 1;
		padding-block: var(--base-scale-l) var(--base-scale-3xl);
		padding-inline: var(--base-scale-2xl);
		background-color: var(--color-must-lightest);
		@media (width < 768px) {
			padding-block: var(--base-scale-m) var(--base-scale-xl);
			padding-inline: var(--base-scale-m);
		}
		&:after {
			position: absolute;
			inset-block-end: 0;
			inset-inline-end: 0;
			inline-size: 32px;
			block-size: 32px;
			margin-inline: 0;
			content: '';
			background-color: var(--color-tone-secondary);
			background-image: none;
			clip-path: url('data:image/svg+xml;utf8,%3Csvg xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="p" clipPathUnits="objectBoundingBox"%3E%3Cpolygon points="1 0, 0 1, 1 1"/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E#p');
			clip-path: polygon(100% 0, 0 100%, 100% 100%);
			transition: background-color 0.3s ease-out;
		}
	}
	.c-index__crosstalk-item-text-main {
		padding: 0;
		margin-block-end: var(--base-scale-m);
		font-size: var(--font-size-various-font-22);
		font-weight: 700;
		line-height: 1.6;
		color: var(--color-text-base-font-primary);
		letter-spacing: 0.0275rem;
		border: none;
		transition: color 0.3s ease-out;
	}
	.c-index__crosstalk-item-text-sub {
		font-size: var(--font-size-various-base);
		line-height: 1.7;
	}
}
@layer main {
	.c-carousel__controls {
		display: grid;
		grid-template-areas: 'prev pagination next';
		grid-template-columns: 2rem fit-content(100%) 2rem;
		column-gap: var(--base-scale-l);
		place-items: center;
		justify-content: center;
		padding-block-start: var(--base-scale-l);
		margin-inline: auto;
		@media (width < 768px) {
			grid-template-columns: 1rem fit-content(100%) 1rem;
			gap: var(--base-scale-m);
		}
		:where(button) {
			border: none;
		}
	}
	.c-carousel__item {
		padding-inline: 0;
		margin-block: 0;
		&:before {
			all: unset;
		}
		img {
			display: block;
			inline-size: 100%;
			block-size: auto;
		}
	}
	.c-carousel__pagination {
		grid-area: pagination;
		gap: var(--base-scale-m);
		@media (width < 768px) {
			gap: var(--base-scale-s);
		}
		> li {
			padding: 0;
			margin: 0;
			&:before {
				all: unset;
			}
		}
	}
	.c-carousel__pagination-page {
		display: block;
		inline-size: 0.75rem;
		block-size: 0.75rem;
		padding-inline: 0;
		background-color: var(--color-border-gray-1);
		border: none;
		border-radius: 999em;
		transition: background-color 0.25s ease;
		@media (any-hover: hover) {
			&:hover {
				background-color: var(--color-tone-primary);
			}
		}
		@media (width < 768px) {
			inline-size: 0.5rem;
			block-size: 0.5rem;
		}
		&.is-active {
			background-color: var(--color-tone-primary);
		}
	}
	.c-carousel__arrow-next,
	.c-carousel__arrow-prev {
		max-inline-size: 2rem;
		padding-inline: 0;
		@media (width < 768px) {
			max-inline-size: 1rem;
		}
		img {
			@media (prefers-reduced-motion: no-preference) {
				transition:
					background-image 0.25s ease,
					translate 0.25s ease;
			}
		}
	}
	.c-carousel__arrow-prev {
		position: relative;
		grid-area: prev;
		@media (prefers-reduced-motion: no-preference) {
			@media (any-hover: hover) {
				&:hover {
					img {
						translate: -8px 0;
					}
				}
			}
		}
	}
	.c-carousel__arrow-next {
		position: relative;
		grid-area: next;
		@media (prefers-reduced-motion: no-preference) {
			@media (any-hover: hover) {
				&:hover {
					img {
						translate: 8px 0;
					}
				}
			}
		}
	}
}
@layer main {
	.c-accordion details {
		border-block-start: 1px solid var(--color-border-gray-1);
		&:last-child {
			border-block-end: 1px solid var(--color-border-gray-1);
		}
		&::details-content {
			display: grid;
			grid-template-rows: 0fr;
			content-visibility: unset;
			overflow: hidden;
			@media (prefers-reduced-motion: no-preference) {
				transition: grid-template-rows 0.3s ease-out;
			}
		}
		&:not([open])::details-content {
			grid-template-rows: 0fr;
		}
		&[open]::details-content {
			grid-template-rows: 1fr;
		}
	}
	.c-accordion__q {
		position: relative;
		display: flex;
		column-gap: var(--base-scale-m);
		padding-block: var(--base-scale-l);
		padding-inline: var(--base-scale-l)
			calc(var(--base-scale-m) + 20px + var(--base-scale-l));
		font-weight: 700;
		transition: background-color 0.3s ease-out;
		@media (width < 768px) {
			padding-block: calc(var(--base-scale-l));
			padding-inline: var(--base-scale-m)
				calc(var(--base-scale-s) + 13px + var(--base-scale-m));
		}
		@media (any-hover: hover) {
			&:hover {
				background-color: var(--color-bg-base-bg-light-blue);
			}
		}
		[open] &:before {
			rotate: -180deg;
		}
		&:before {
			rotate: -90deg;
			transition: rotate 0.3s ease-out;
		}
		&:after,
		&:before {
			position: absolute;
			inset-block: 0;
			inset-inline-end: var(--base-scale-l);
			inline-size: 20px;
			block-size: 2px;
			margin-block: auto;
			content: '';
			background-color: var(--color-tone-primary);
			@media (width < 768px) {
				inset-inline-end: var(--base-scale-m);
				inline-size: 13px;
			}
		}
	}
	.c-accordion__q > span {
		flex-shrink: 0;
		font-family: var(--font-family-en);
		font-size: var(--font-size-various-font-26);
		font-weight: 700;
		line-height: 1;
		color: var(--color-tone-primary);
		text-align: center;
	}
	.c-accordion__box {
		min-block-size: 0;
		padding-block: var(--base-scale-l);
		padding-inline: var(--base-scale-l) var(--base-scale-5xl);
		overflow: hidden;
		background-color: var(--color-bg-bgb-bgb-opt--bg-gray);
		transition: padding-block 0.3s ease-out;
		@media (width < 768px) {
			padding-inline: var(--base-scale-m) var(--base-scale-2xl);
		}
	}
	.c-accordion details:not([open]) .c-accordion__box {
		padding-block: 0;
	}
	.c-accordion__box-item {
		display: flex;
		column-gap: var(--base-scale-m);
	}
	.c-accordion__box-item > span {
		flex-shrink: 0;
		font-family: var(--font-family-en);
		font-size: var(--font-size-various-font-26);
		font-weight: 700;
		line-height: 1;
		color: var(--color-tone-secondary);
		text-align: center;
	}
	.c-accordion__box-item a:not([target='_blank']):after {
		display: none;
	}
	.c-flow {
		display: grid;
	}
}
@layer main {
	.c-flow__list {
		display: grid;
		row-gap: var(--base-scale-l);
		counter-reset: flow-step;
		@media (width < 768px) {
			row-gap: var(--base-scale-m);
		}
	}
	.c-flow__item {
		all: revert;
		position: relative;
		display: grid;
		padding-block-end: 23px;
		@media (width < 768px) {
			padding-block-end: 17px;
		}
		&:before {
			all: revert;
		}
		&:not(:last-child) {
			&:after {
				position: absolute;
				inset-block-end: 0;
				inset-inline: 0;
				display: block;
				inline-size: 46px;
				block-size: 23px;
				margin-inline: auto;
				content: '';
				background-color: var(--color-tone-tertiary);
				clip-path: url('data:image/svg+xml;utf8,%3Csvg xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="p" clipPathUnits="objectBoundingBox"%3E%3Cpolygon points="0 0, 1 0, 0.5 1"/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E#p');
				clip-path: polygon(0 0, 100% 0, 50% 100%);
				@media (width < 768px) {
					inline-size: 36px;
					block-size: 17px;
				}
			}
		}
	}
	.c-flow__item-container {
		padding: var(--base-scale-2xl);
		border: 1px solid var(--color-border-gray-1);
		@media (width < 768px) {
			padding: var(--base-scale-l);
		}
	}
	.c-flow__item-content {
		> :not(:last-child) {
			margin-block-end: var(--base-scale-l);
		}
	}
	.c-flow__item-title {
		span {
			display: grid;
			grid-template-columns: auto 1fr;
			column-gap: 1.5rem;
			align-items: center;
			font-size: var(--font-size-various-font-24);
			font-weight: 700;
			line-height: 1.5;
			@media (width < 768px) {
				column-gap: 1rem;
				font-size: var(--font-size-various-font-22);
			}
			&:before {
				display: flex;
				align-items: center;
				align-self: start;
				justify-content: center;
				inline-size: fit-content;
				min-inline-size: 2.625rem;
				aspect-ratio: 1/1;
				font-family: var(--font-family-en);
				font-size: var(--font-size-title-h3);
				font-weight: 700;
				line-height: 1;
				color: var(--color-must-lightest);
				content: counter(flow-step);
				counter-increment: flow-step;
				background-color: var(--color-tone-primary);
				@media (width < 768px) {
					min-inline-size: 2.125rem;
					font-size: var(--font-size-title-h3);
				}
			}
		}
	}
	.c-flow__entry-link {
		display: grid;
		grid-template-columns: 1fr 1.5rem;
		place-items: center;
		max-inline-size: 33.75rem;
		padding-block: var(--base-scale-l);
		padding-inline: var(--base-scale-m);
		margin-inline: auto;
		font-size: var(--font-size-various-font-20);
		font-weight: 700;
		line-height: 1.7;
		color: var(--color-must-lightest);
		text-decoration: none;
		background-color: var(--color-tone-secondary);
		transition: background-color 0.3s ease-out;
		@media (width < 768px) {
			padding-block: var(--base-scale-m);
			font-size: var(--font-size-various-large);
			line-height: 1.5;
		}
		@media (any-hover: hover) {
			&:hover {
				background-color: var(--color-bg-link-emphasis-red-hover);
			}
		}
		&:not([target='_blank']) {
			&:after {
				all: revert;
			}
		}
		&[target='_blank'] {
			&:after {
				background-image: url(/recruit/img/common/icon-link-blank-white.svg);
			}
		}
	}
	.c-flow__entry-link-container {
		display: grid;
		grid-template-columns: auto 1fr;
		column-gap: var(--base-scale-m);
		place-items: center;
		padding-inline-start: 1.5rem;
		@media (width < 768px) {
			grid-template-columns: 1fr;
			row-gap: var(--base-scale-s);
		}
	}
	.c-flow__entry-link-image {
		max-inline-size: 100px;
		@media (width < 768px) {
			max-inline-size: 80px;
		}
		img {
			display: block;
			inline-size: 100%;
			block-size: auto;
		}
	}
}
@layer main {
	.c-interview__profile {
		position: relative;
		display: grid;
		padding: var(--base-scale-2xl);
		overflow: hidden;
		background-color: var(--color-bg-base-bg-light-blue);
		isolation: isolate;
		@media (width < 768px) {
			grid-template-columns: 1fr;
			padding-block: var(--base-scale-2xl);
			padding-inline: var(--base-scale-m);
		}
		&:before {
			position: absolute;
			inset-block-start: 0;
			inset-inline-start: 0;
			z-index: var(--z-index-stack-behind);
			font-family: var(--font-family-en);
			font-size: 6.875rem;
			font-weight: 500;
			line-height: 1.1;
			color: var(--color-must-darkest);
			text-transform: uppercase;
			content: 'Career';
			mix-blend-mode: overlay;
			opacity: 0.5;
			@media (width < 768px) {
				padding-inline-start: var(--base-scale-m);
				font-size: 5.0625rem;
				line-height: 1.4;
			}
		}
	}
	.c-interview__profile-heading {
		display: flex;
		gap: var(--base-scale-s);
		align-items: flex-start;
		font-size: var(--font-size-various-font-26);
		font-weight: 700;
		line-height: 1.5;
		color: var(--color-tone-primary);
		&:before {
			flex-shrink: 0;
			inline-size: 1.3125rem;
			block-size: 1.5rem;
			margin-block-start: 0.47rem;
			content: '';
			background-image: url(/recruit/img/common/icon-text-maker.svg);
			background-repeat: no-repeat;
			background-position: 50%;
			background-size: contain;
		}
	}
	.c-interview__profile-column {
		position: relative;
		z-index: var(--z-index-stack-front);
	}
	.c-crosstalk__dialogue {
		display: grid;
		grid-template-columns: max-content 1fr;
		gap: 1.5rem;
	}
	.c-crosstalk__dialogue-item {
		display: grid;
		grid-template-columns: subgrid;
		grid-column: 1/-1;
		gap: 1.5rem;
	}
	.c-crosstalk__dialogue-avatar-container {
		display: grid;
		grid-template-rows: auto auto;
		align-content: start;
		align-self: start;
		justify-items: center;
	}
}
@layer main {
	.c-crosstalk__dialogue-avatar {
		img {
			max-inline-size: 40px;
		}
	}
	.c-crosstalk__dialogue-name {
		font-weight: 700;
	}
	.c-crosstalk__dialogue-footnote {
		display: block;
		padding-block-start: 1.5rem;
	}
}
@layer main {
	.c-carousel-interview {
		padding-block: 27px var(--base-scale-3xl);
		margin-block-start: var(--content-margin-content-mb);
		background-color: var(--color-bg-bgb-bgb-opt--bg-gray);
		@media (width < 768px) {
			margin-block-start: var(--bgb-opt-bgb-opt--mb-large);
		}
	}
	.c-carousel-interview__carousel-link {
		position: relative;
		display: grid;
		text-decoration: none;
		isolation: isolate;
		@media (any-hover: hover) {
			&:hover {
				.c-carousel-interview__carousel-image {
					img {
						@media (prefers-reduced-motion: no-preference) {
							scale: 1.1;
						}
					}
				}
				.c-carousel-interview__carousel-textarea:after {
					background-color: var(--color-bg-link-emphasis-red-hover);
				}
				.c-carousel-interview__carousel-title {
					color: var(--color-tone-primary);
				}
			}
		}
	}
	.c-carousel-interview__heading {
		position: relative;
		display: flex;
		max-inline-size: 1080px;
		margin-block-end: 11px;
		margin-inline: auto;
		overflow: hidden;
		@media (width < 768px) {
			margin-block-end: var(--base-scale-3xl);
			margin-inline: var(--base-scale-m);
		}
		h2 {
			position: relative;
			display: inline-block;
			padding-block: 2.31rem;
			padding-inline-start: 46px;
			margin-inline: var(--c-home-people-gutter);
			font-size: 2rem;
			font-weight: 700;
			line-height: 1.7;
			color: var(--color-must-darkest);
			@media (width < 768px) {
				padding-block: 0;
				padding-inline-start: 37px;
				font-size: var(--font-size-various-font-26);
			}
			&:before {
				position: absolute;
				inset-block: 0;
				inset-inline-start: 0;
				display: inline-block;
				inline-size: 3rem;
				block-size: 2.3125rem;
				margin-block: auto;
				content: '';
				background: url(/recruit/img/common/icon-text-maker-red.svg) no-repeat 50% /
					contain;
				@media (width < 768px) {
					inset-inline-start: 0;
					inline-size: 1.5rem;
				}
			}
		}
	}
	.c-carousel-interview__heading-bg {
		position: absolute;
		inset-block: 0;
		inset-inline-start: 0;
		display: block;
		block-size: fit-content;
		margin-block: auto;
		font-family: var(--font-family-en);
		font-size: 8rem;
		font-weight: 700;
		line-height: 1;
		color: var(--color-must-lightest);
		white-space: nowrap;
		@media (width < 768px) {
			font-size: 3.8125rem;
		}
	}
	.c-carousel-interview__carousel-item {
		position: relative;
		display: flex;
		padding-block: 0;
		padding-inline: 0;
		margin-block: 0;
		margin-inline: 0;
		text-decoration: none;
		isolation: isolate;
		&:before {
			display: none;
		}
		a {
			position: relative;
			display: flex;
			flex-direction: column;
			text-decoration: none;
			&:after {
				display: none;
			}
		}
	}
	.c-carousel-interview__carousel-category {
		position: absolute;
		inset-block-start: 0;
		inset-inline-start: -1px;
		z-index: var(--z-index-stack-front);
		padding-block: var(--base-scale-xs);
		padding-inline: var(--base-scale-s);
		font-size: var(--font-size-various-base);
		font-weight: 700;
		line-height: 1.7;
		color: var(--color-tone-primary);
		background-color: var(--color-must-lightest);
	}
	.c-carousel-interview__carousel-image {
		position: relative;
		z-index: var(--z-index-stack-behind);
		aspect-ratio: 339/316;
		overflow: hidden;
		img {
			inline-size: 100%;
			block-size: 100%;
			object-fit: cover;
			transform: translateZ(0);
			backface-visibility: hidden;
			transition: scale 0.3s ease-out;
			will-change: scale;
		}
	}
	.c-carousel-interview__carousel-image-textarea {
		position: absolute;
		inset-block-end: 0;
		inline-size: 100%;
		padding-block: var(--base-scale-2xl) var(--base-scale-m);
		padding-inline: var(--base-scale-m);
		background: var(--color-home-gradation-gray);
	}
	.c-carousel-interview__carousel-group {
		margin-block-end: var(--base-scale-s);
		font-size: var(--font-size-various-font-20);
		font-weight: 700;
		line-height: 1.5;
		color: var(--color-must-lightest);
	}
	.c-carousel-interview__carousel-faculty {
		font-size: var(--font-size-various-small);
		font-weight: 500;
		line-height: 1.7;
		color: var(--color-must-lightest);
	}
	.c-carousel-interview__carousel-name {
		font-size: var(--font-size-various-base);
		font-weight: 500;
		line-height: 1.7;
		color: var(--color-must-lightest);
	}
	.c-carousel-interview__carousel-textarea {
		position: relative;
		flex-grow: 1;
		padding-block: var(--base-scale-m) var(--base-scale-3xl);
		padding-inline: var(--base-scale-l);
		background-color: var(--color-must-lightest);
		&:after {
			position: absolute;
			inset-block-end: 0;
			inset-inline-end: 0;
			z-index: var(--z-index-stack-front);
			inline-size: 32px;
			block-size: 32px;
			margin-inline: 0;
			content: '';
			background-color: var(--color-tone-secondary);
			background-image: none;
			clip-path: url('data:image/svg+xml;utf8,%3Csvg xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="p" clipPathUnits="objectBoundingBox"%3E%3Cpolygon points="1 0, 0 1, 1 1"/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E#p');
			clip-path: polygon(100% 0, 0 100%, 100% 100%);
			transition: background-color 0.3s ease-out;
		}
	}
	.c-carousel-interview__carousel-title {
		padding: 0;
		margin-block-end: var(--base-scale-m);
		font-size: var(--font-size-various-font-22);
		font-weight: 700;
		line-height: 1.6;
		color: var(--color-text-base-font-primary);
		letter-spacing: 0.0275rem;
		border: none;
		transition: color 0.3s ease-out;
	}
	.c-carousel-interview__carousel-department {
		display: flex;
		flex-wrap: wrap;
		gap: var(--base-scale-s);
	}
	.c-carousel-interview__carousel-department-item {
		inline-size: fit-content;
		padding-block: var(--base-scale-xs);
		padding-inline: var(--base-scale-s);
		font-size: var(--font-size-various-small);
		font-weight: 700;
		line-height: 1.5;
		color: var(--color-tone-primary);
		background-color: var(--color-bg-base-bg-light-blue);
		&:before {
			margin-inline-end: var(--base-scale-xs);
			content: '#';
		}
	}
	.c-carousel-interview__controls {
		display: grid;
		grid-template-areas: 'prev pagination next';
		grid-template-columns: 2rem fit-content(100%) 2rem;
		column-gap: var(--base-scale-l);
		place-items: center;
		justify-content: center;
		padding-block-start: var(--base-scale-l);
		padding-inline: var(--base-scale-2xl);
		@media (768px <= width) {
			padding-block-start: var(--base-scale-2xl);
			padding-inline: revert;
			margin-inline: auto;
		}
		@media (width < 768px) {
			padding-block-start: var(--base-scale-l);
			padding-inline: 13.5px;
		}
		:where(button) {
			border: none;
		}
	}
	.c-carousel-interview__pagination {
		grid-area: pagination;
		gap: var(--base-scale-m);
		justify-content: start;
		li {
			padding: 0;
			margin: 0;
			&:before {
				all: revert;
			}
		}
	}
	.c-carousel-interview__pagination-page {
		display: block;
		inline-size: 0.75rem;
		block-size: 0.75rem;
		padding-inline: 0;
		background-color: var(--color-border-gray-1);
		border-radius: 999em;
		transition: background-color 0.25s ease;
		@media (any-hover: hover) {
			&:hover {
				background-color: var(--color-tone-primary);
			}
		}
		&.is-active {
			background-color: var(--color-tone-primary);
		}
	}
	.c-carousel-interview__arrow-next,
	.c-carousel-interview__arrow-prev {
		max-inline-size: 2rem;
		padding-inline: 0;
		img {
			@media (prefers-reduced-motion: no-preference) {
				transition:
					background-image 0.25s ease,
					translate 0.25s ease;
			}
		}
	}
	.c-carousel-interview__arrow-prev {
		position: relative;
		grid-area: prev;
		@media (prefers-reduced-motion: no-preference) {
			@media (any-hover: hover) {
				&:hover {
					img {
						translate: -8px 0;
					}
				}
			}
		}
	}
	.c-carousel-interview__arrow-next {
		position: relative;
		grid-area: next;
		@media (prefers-reduced-motion: no-preference) {
			@media (any-hover: hover) {
				&:hover {
					img {
						translate: 8px 0;
					}
				}
			}
		}
	}
}
@layer main {
	.c-carousel-crosstalk {
		padding-block: 27px var(--base-scale-3xl);
		margin-block-start: var(--content-margin-content-mb);
		background-color: var(--color-bg-bgb-bgb-opt--bg-gray);
		@media (width < 768px) {
			margin-block-start: var(--bgb-opt-bgb-opt--mb-large);
		}
	}
	.c-carousel-crosstalk__carousel-link {
		position: relative;
		display: grid;
		text-decoration: none;
		isolation: isolate;
		@media (any-hover: hover) {
			&:hover {
				.c-carousel-crosstalk__carousel-image {
					img {
						@media (prefers-reduced-motion: no-preference) {
							scale: 1.1;
						}
					}
				}
				.c-carousel-crosstalk__carousel-textarea:after {
					background-color: var(--color-bg-link-emphasis-red-hover);
				}
				.c-carousel-crosstalk__carousel-text-main {
					color: var(--color-tone-primary);
				}
			}
		}
	}
	.c-carousel-crosstalk__heading {
		position: relative;
		display: flex;
		max-inline-size: 1080px;
		margin-block-end: 11px;
		margin-inline: auto;
		overflow: hidden;
		@media (width < 768px) {
			margin-block-end: var(--base-scale-3xl);
			margin-inline: var(--base-scale-m);
		}
		h2 {
			position: relative;
			display: inline-block;
			padding-block: 2.31rem;
			padding-inline-start: 46px;
			margin-inline: var(--c-home-people-gutter);
			font-size: 2rem;
			font-weight: 700;
			line-height: 1.7;
			color: var(--color-must-darkest);
			@media (width < 768px) {
				padding-block: 0;
				padding-inline-start: 37px;
				font-size: var(--font-size-various-font-26);
			}
			&:before {
				position: absolute;
				inset-block: 0;
				inset-inline-start: 0;
				display: inline-block;
				inline-size: 3rem;
				block-size: 2.3125rem;
				margin-block: auto;
				content: '';
				background: url(/recruit/img/common/icon-text-maker-red.svg) no-repeat 50% /
					contain;
				@media (width < 768px) {
					inset-inline-start: 0;
					inline-size: 1.5rem;
				}
			}
		}
	}
	.c-carousel-crosstalk__heading-bg {
		position: absolute;
		inset-block: 0;
		inset-inline-start: 0;
		display: block;
		block-size: fit-content;
		margin-block: auto;
		font-family: var(--font-family-en);
		font-size: 8rem;
		font-weight: 700;
		line-height: 1;
		color: var(--color-must-lightest);
		white-space: nowrap;
		@media (width < 768px) {
			font-size: 3.8125rem;
		}
	}
	.c-carousel-crosstalk__carousel-item {
		position: relative;
		display: flex;
		padding-block: 0;
		padding-inline: 0;
		margin-block: 0;
		margin-inline: 0;
		text-decoration: none;
		isolation: isolate;
		&:before {
			display: none;
		}
		a {
			position: relative;
			display: flex;
			flex-direction: column;
			text-decoration: none;
			&:after {
				display: none;
			}
		}
	}
	.c-carousel-crosstalk__carousel-title {
		position: absolute;
		inset-block-start: 0;
		inset-inline-start: -1px;
		z-index: var(--z-index-stack-front);
		padding-block: var(--base-scale-xs);
		padding-inline: var(--base-scale-s);
		font-size: var(--font-size-various-small);
		font-weight: 700;
		line-height: 1.5;
		color: var(--color-tone-primary);
		background-color: var(--color-must-lightest);
	}
	.c-carousel-crosstalk__carousel-image {
		position: relative;
		z-index: var(--z-index-stack-behind);
		overflow: hidden;
		img {
			inline-size: 100%;
			block-size: 100%;
			aspect-ratio: 338/190;
			transform: translateZ(0);
			backface-visibility: hidden;
			transition: scale 0.3s ease-out;
			will-change: scale;
		}
	}
	.c-carousel-crosstalk__carousel-textarea {
		position: relative;
		flex-grow: 1;
		padding-block: var(--base-scale-l) var(--base-scale-3xl);
		padding-inline: var(--base-scale-2xl);
		background-color: var(--color-must-lightest);
		@media (width < 768px) {
			padding-block: var(--base-scale-m) var(--base-scale-xl);
			padding-inline: var(--base-scale-m);
		}
		&:after {
			position: absolute;
			inset-block-end: 0;
			inset-inline-end: 0;
			z-index: var(--z-index-stack-front);
			inline-size: 32px;
			block-size: 32px;
			margin-inline: 0;
			content: '';
			background-color: var(--color-tone-secondary);
			background-image: none;
			clip-path: url('data:image/svg+xml;utf8,%3Csvg xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="p" clipPathUnits="objectBoundingBox"%3E%3Cpolygon points="1 0, 0 1, 1 1"/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E#p');
			clip-path: polygon(100% 0, 0 100%, 100% 100%);
			transition: background-color 0.3s ease-out;
		}
	}
	.c-carousel-crosstalk__carousel-text-main {
		padding: 0;
		margin-block-end: var(--base-scale-m);
		font-size: var(--font-size-various-font-22);
		font-weight: 700;
		line-height: 1.6;
		color: var(--color-text-base-font-primary);
		letter-spacing: 0.0275rem;
		border: none;
		transition: color 0.3s ease-out;
	}
	.c-carousel-crosstalk__carousel-text-sub {
		font-size: var(--font-size-various-base);
		line-height: 1.7;
	}
	.c-carousel-crosstalk__controls {
		display: grid;
		grid-template-areas: 'prev pagination next';
		grid-template-columns: 2rem fit-content(100%) 2rem;
		column-gap: var(--base-scale-l);
		place-items: center;
		justify-content: center;
		padding-block-start: var(--base-scale-l);
		padding-inline: var(--base-scale-2xl);
		@media (768px <= width) {
			padding-block-start: var(--base-scale-2xl);
			padding-inline: revert;
			margin-inline: auto;
		}
		@media (width < 768px) {
			padding-block-start: var(--base-scale-l);
			padding-inline: 13.5px;
		}
		:where(button) {
			border: none;
		}
	}
	.c-carousel-crosstalk__pagination {
		grid-area: pagination;
		gap: var(--base-scale-m);
		justify-content: start;
		li {
			padding: 0;
			margin: 0;
			&:before {
				all: revert;
			}
		}
	}
	.c-carousel-crosstalk__pagination-page {
		display: block;
		inline-size: 0.75rem;
		block-size: 0.75rem;
		padding-inline: 0;
		background-color: var(--color-border-gray-1);
		border-radius: 999em;
		transition: background-color 0.25s ease;
		@media (any-hover: hover) {
			&:hover {
				background-color: var(--color-tone-primary);
			}
		}
		&.is-active {
			background-color: var(--color-tone-primary);
		}
	}
	.c-carousel-crosstalk__arrow-next,
	.c-carousel-crosstalk__arrow-prev {
		max-inline-size: 2rem;
		padding-inline: 0;
		img {
			@media (prefers-reduced-motion: no-preference) {
				transition:
					background-image 0.25s ease,
					translate 0.25s ease;
			}
		}
	}
	.c-carousel-crosstalk__arrow-prev {
		position: relative;
		grid-area: prev;
		@media (prefers-reduced-motion: no-preference) {
			@media (any-hover: hover) {
				&:hover {
					img {
						translate: -8px 0;
					}
				}
			}
		}
	}
	.c-carousel-crosstalk__arrow-next {
		position: relative;
		grid-area: next;
		@media (prefers-reduced-motion: no-preference) {
			@media (any-hover: hover) {
				&:hover {
					img {
						translate: 8px 0;
					}
				}
			}
		}
	}
}
@layer main {
	.c-column-heading {
		--c-column-heading-columns: 3;
		display: grid;
		grid-template-rows: max-content max-content;
		grid-template-columns: repeat(var(--c-column-heading-columns), 1fr);
		gap: var(--column-gap-3col);
		@container (--c-column-heading-columns: 2) {
			gap: var(--column-gap-2col);
		}
		@container (--c-column-heading-columns: 3) {
			gap: var(--column-gap-3col);
		}
		@media (width < 768px) {
			grid-template-columns: 1fr;
		}
	}
	.c-column-heading__item {
		display: grid;
		grid-template-rows: subgrid;
		grid-row: span 2;
		row-gap: var(--base-scale-m);
		padding-block: var(--base-scale-l);
		padding-inline: var(--base-scale-m);
		background-color: var(--color-bg-bgb-bgb-opt--bg-gray);
	}
	.c-column-heading__item-heading {
		display: grid;
		align-items: center;
		padding-block-end: var(--base-scale-s);
		font-size: var(--font-size-various-font-22);
		font-weight: 700;
		line-height: 1.7;
		color: var(--color-text-base-font-primary);
		text-align: center;
		border-block-end: 1px solid var(--color-border-gray-1);
	}
	.c-column-heading__item-text {
		font-size: var(--font-size-various-base);
		font-weight: 400;
		line-height: 1.7;
		color: var(--color-text-base-font-primary);
	}
}
@layer main {
	.c-infographics {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: var(--base-scale-2xl);
		@media (width < 1200px) {
			grid-template-columns: repeat(2, 1fr);
		}
		@media (width < 768px) {
			grid-template-columns: 1fr;
		}
	}
	.c-infographics__item {
		display: grid;
		grid-template-rows: auto 1fr;
		min-block-size: 22.625rem;
		background-color: var(--color-infographics-background);
		opacity: 1;
		translate: 0 0;
		@media (prefers-reduced-motion: reduce) {
			opacity: 1;
			translate: 0 0;
		}
		&.c-infographics__item-revealed {
			opacity: 1;
			translate: 0 0;
		}
		&[data-id='gender_ratio'],
		&[data-id='recruitment_ratio'] {
			.c-infographics__item-stats {
				gap: 1rem;
			}
			.c-infographics__item-data-label {
				font-size: 1rem;
			}
			.c-infographics__item-data-value {
				font-size: 4rem;
			}
			.c-infographics__item-data-small {
				font-size: var(--font-size-various-font-40);
			}
			.c-infographics__item-data-01,
			.c-infographics__item-data-02 {
				display: grid;
				grid-template-areas: 'label' 'value';
				grid-template-rows: auto auto;
				place-content: normal;
				place-items: center;
				text-align: center;
			}
		}
		&[data-id='gender_ratio'] {
			.c-infographics__item-data-01 {
				.c-infographics__item-data-small,
				.c-infographics__item-data-value {
					color: var(--color-tone-primary);
				}
			}
		}
		&[data-id='job_ratio'] {
			.c-infographics__item-data-container {
				display: grid;
				grid-template-columns: repeat(3, 1fr);
				gap: var(--base-scale-s);
				min-block-size: 6.25rem;
			}
			.c-infographics__item-data-label,
			.c-infographics__item-data-prefix {
				font-size: 0.875rem;
			}
			.c-infographics__item-data-value {
				margin-inline: 0.13rem;
				font-size: var(--font-size-various-font-28);
			}
			.c-infographics__item-data-small,
			.c-infographics__item-data-unit {
				font-size: var(--font-size-various-font-20);
				line-height: 1;
			}
			.c-infographics__item-data-unit {
				color: var(--color-tone-secondary);
			}
			.c-infographics__item-data-01,
			.c-infographics__item-data-02,
			.c-infographics__item-data-03 {
				display: flex;
				flex-direction: column;
				gap: var(--base-scale-s);
				align-items: center;
				justify-content: center;
				padding-block: var(--base-scale-s);
				text-align: center;
				background-color: var(--color-must-lightest);
			}
		}
		&[data-id='commute_time'] {
			.c-infographics__item-data-01 {
				flex-direction: column;
			}
			.c-infographics__item-data-label {
				font-size: var(--font-size-various-base);
				font-weight: 500;
				line-height: 1.7;
				color: var(--color-text-base-font-primary);
				text-align: center;
			}
			.c-infographics__item-image {
				margin-block-start: var(--base-scale-m);
			}
		}
	}
	.c-infographics.c-infographics-reveal-ready {
		@media (prefers-reduced-motion: no-preference) {
			.c-infographics__item {
				opacity: 0;
				translate: 0 1rem;
				transition:
					opacity 0.65s ease-out,
					translate 0.65s ease-out;
				transition-delay: calc(var(--delay-index-3, 0) * 0.12s);
				@media (width < 1200px) {
					transition-delay: calc(var(--delay-index-2, 0) * 0.12s);
				}
				@media (width < 768px) {
					transition-delay: 0s;
				}
			}
			.c-infographics__item.c-infographics__item-revealed {
				opacity: 1;
				translate: 0 0;
			}
		}
	}
	.c-infographics__item-title {
		display: grid;
		place-items: center;
		padding-block: var(--base-scale-s);
		padding-inline: var(--base-scale-l);
		font-size: var(--font-size-various-font-20);
		font-weight: 700;
		line-height: 1.4;
		color: var(--color-must-lightest);
		text-align: center;
		background-color: var(--color-tone-primary);
	}
	.c-infographics__item-body {
		display: grid;
		align-self: center;
		padding-block: var(--base-scale-l);
		padding-inline: var(--base-scale-l);
	}
	.c-infographics__item-icon {
		max-inline-size: 200px;
		margin-block-start: var(--base-scale-m);
		margin-inline: auto;
		img {
			inline-size: 100%;
			block-size: auto;
		}
	}
	.c-infographics__item-image {
		inline-size: 100%;
		margin-inline: auto;
		img {
			inline-size: 100%;
			block-size: auto;
		}
	}
	.c-infographics__item-stats {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	.c-infographics__item-data-container {
		display: flex;
		justify-content: center;
		margin-block-end: var(--base-scale-m);
	}
	.c-infographics__item-data-group {
		letter-spacing: -0.06em;
		.c-infographics__item-data-label,
		.c-infographics__item-data-prefix,
		.c-infographics__item-data-value {
			display: inline;
		}
	}
	.c-infographics__item-data-01,
	.c-infographics__item-data-02,
	.c-infographics__item-data-03 {
		display: flex;
		justify-content: center;
	}
	.c-infographics__item-data-label,
	.c-infographics__item-data-unit {
		align-self: center;
		font-size: var(--font-size-various-font-24);
		font-weight: 700;
		color: var(--color-must-darkest);
	}
	.c-infographics__item-data-label {
		grid-area: label;
		align-self: center;
		line-height: 1;
	}
	.c-infographics__item-data-prefix {
		align-self: center;
		font-size: var(--font-size-various-font-24);
		font-weight: 700;
		line-height: 1;
		color: var(--color-must-darkest);
	}
	.c-infographics__item-data-value {
		grid-area: value;
		margin-inline: 0.15rem;
		font-size: 4.625rem;
	}
	.c-infographics__item-data-small,
	.c-infographics__item-data-value {
		align-self: center;
		font-family: var(--font-family-en);
		font-weight: 700;
		line-height: 1;
		color: var(--color-tone-secondary);
	}
	.c-infographics__item-data-small {
		font-size: var(--font-size-various-font-40);
	}
	.c-infographics__item-data-unit {
		grid-area: unit;
		align-self: center;
		font-family: var(--font-family-en);
		line-height: 1.5;
	}
	.c-infographics__item-description {
		font-size: var(--font-size-various-base);
		font-weight: 500;
		line-height: 1.7;
		color: var(--color-text-base-font-primary);
		text-align: center;
		&:has(+ .c-infographics__item-note-01) {
			margin-block-end: var(--base-scale-xs);
		}
	}
	.c-infographics__item-note-01,
	.c-infographics__item-note-02 {
		display: flex;
		justify-content: center;
		font-size: var(--font-size-various-small);
		font-weight: 400;
		line-height: 1.7;
		color: var(--color-text-base-font-gray);
		> span {
			display: block;
			inline-size: fit-content;
			text-indent: 1.25em hanging each-line;
			&:before {
				margin-inline-end: 0.25rem;
				content: '※';
			}
		}
	}
	.c-infographics__item-link {
		margin-block-start: var(--base-scale-m);
		a {
			display: flex;
			align-items: center;
			justify-content: center;
			padding-block: var(--base-scale-s);
			padding-inline: var(--base-scale-m);
			font-size: var(--font-size-button-normal);
			font-weight: 700;
			line-height: 1.5;
			text-decoration: none;
			background: var(--color-bg-link-normal);
			border: 2px solid var(--color-tone-primary);
			transition:
				color 0.3s ease-out,
				background 0.3s ease-out;
			@media (any-hover: hover) {
				&:hover {
					color: var(--color-must-lightest);
					background: var(--color-bg-link-normal-hover);
				}
			}
			&:after {
				all: revert;
			}
		}
	}
}
@layer main {
	.c-image__border {
		border: 1px solid var(--color-border-gray-1);
	}
	img.c-image__custom-inline-size {
		--max-inline-size-image-desktop: 100%;
		--max-inline-size-image-mobile: 100%;
		max-inline-size: var(--max-inline-size-image-desktop);
		margin-inline: auto;
		@media (width < 768px) {
			max-inline-size: var(--max-inline-size-image-mobile);
		}
	}
}
@layer helper {
	.c-mb__none {
		margin: 0;
	}
	.c-mb__small {
		margin-block-end: var(--bgb-opt-bgb-opt--mb-small);
	}
	.c-mb__default {
		margin-block-end: var(--bgb-opt-bgb-opt--mb-default);
	}
	.c-mb__large {
		margin-block-end: var(--bgb-opt-bgb-opt--mb-large);
	}
	.c-mb__0 {
		margin-block-end: 0;
	}
	.c-mb__5 {
		margin-block-end: 5px;
	}
	.c-mb__10 {
		margin-block-end: 10px;
	}
	.c-mb__20 {
		margin-block-end: 20px;
	}
	.c-mb__30 {
		margin-block-end: 30px;
	}
	.c-mb__40 {
		margin-block-end: 40px;
	}
	.c-mb__50 {
		margin-block-end: 50px;
	}
	.c-mb__60 {
		margin-block-end: 60px;
	}
	.c-mb__70 {
		margin-block-end: 70px;
	}
	.c-mb__80 {
		margin-block-end: 80px;
	}
	.c-mb__90 {
		margin-block-end: 90px;
	}
	.c-mb__100 {
		margin-block-end: 100px;
	}
	.c-mt__0 {
		margin-block-start: 0;
	}
	.c-mt__5 {
		margin-block-start: 5px;
	}
	.c-mt__10 {
		margin-block-start: 10px;
	}
	.c-mt__20 {
		margin-block-start: 20px;
	}
	.c-mt__30 {
		margin-block-start: 30px;
	}
	.c-mt__40 {
		margin-block-start: 40px;
	}
	.c-mt__50 {
		margin-block-start: 50px;
	}
	.c-mt__60 {
		margin-block-start: 60px;
	}
	.c-mt__70 {
		margin-block-start: 70px;
	}
	.c-mt__80 {
		margin-block-start: 80px;
	}
	.c-mt__90 {
		margin-block-start: 90px;
	}
	.c-mt__100 {
		margin-block-start: 100px;
	}
	.c-mr__0 {
		margin-inline-end: 0;
	}
	.c-mr__5 {
		margin-inline-end: 5px;
	}
	.c-mr__10 {
		margin-inline-end: 10px;
	}
	.c-mr__20 {
		margin-inline-end: 20px;
	}
	.c-mr__30 {
		margin-inline-end: 30px;
	}
	.c-mr__40 {
		margin-inline-end: 40px;
	}
	.c-mr__50 {
		margin-inline-end: 50px;
	}
	.c-mr__60 {
		margin-inline-end: 60px;
	}
	.c-mr__70 {
		margin-inline-end: 70px;
	}
	.c-mr__80 {
		margin-inline-end: 80px;
	}
	.c-mr__90 {
		margin-inline-end: 90px;
	}
	.c-mr__100 {
		margin-inline-end: 100px;
	}
	.c-ml__0 {
		margin-inline-start: 0;
	}
	.c-ml__5 {
		margin-inline-start: 5px;
	}
	.c-ml__10 {
		margin-inline-start: 10px;
	}
	.c-ml__20 {
		margin-inline-start: 20px;
	}
	.c-ml__30 {
		margin-inline-start: 30px;
	}
	.c-ml__40 {
		margin-inline-start: 40px;
	}
	.c-ml__50 {
		margin-inline-start: 50px;
	}
	.c-ml__60 {
		margin-inline-start: 60px;
	}
	.c-ml__70 {
		margin-inline-start: 70px;
	}
	.c-ml__80 {
		margin-inline-start: 80px;
	}
	.c-ml__90 {
		margin-inline-start: 90px;
	}
	.c-ml__100 {
		margin-inline-start: 100px;
	}
	.c-my__0 {
		margin-block: 0;
	}
	.c-my__5 {
		margin-block: 5px;
	}
	.c-my__10 {
		margin-block: 10px;
	}
	.c-my__20 {
		margin-block: 20px;
	}
	.c-my__30 {
		margin-block: 30px;
	}
	.c-my__40 {
		margin-block: 40px;
	}
	.c-my__50 {
		margin-block: 50px;
	}
	.c-my__60 {
		margin-block: 60px;
	}
	.c-my__70 {
		margin-block: 70px;
	}
	.c-my__80 {
		margin-block: 80px;
	}
	.c-my__90 {
		margin-block: 90px;
	}
	.c-my__100 {
		margin-block: 100px;
	}
	.c-mx__0 {
		margin-inline: 0;
	}
	.c-mx__5 {
		margin-inline: 5px;
	}
	.c-mx__10 {
		margin-inline: 10px;
	}
	.c-mx__20 {
		margin-inline: 20px;
	}
	.c-mx__30 {
		margin-inline: 30px;
	}
	.c-mx__40 {
		margin-inline: 40px;
	}
	.c-mx__50 {
		margin-inline: 50px;
	}
	.c-mx__60 {
		margin-inline: 60px;
	}
	.c-mx__70 {
		margin-inline: 70px;
	}
	.c-mx__80 {
		margin-inline: 80px;
	}
	.c-mx__90 {
		margin-inline: 90px;
	}
	.c-mx__100 {
		margin-inline: 100px;
	}
	.c-m__0 {
		margin-block: 0;
		margin-inline: 0;
	}
	.c-m__5 {
		margin-block: 5px;
		margin-inline: 5px;
	}
	.c-m__10 {
		margin-block: 10px;
		margin-inline: 10px;
	}
	.c-m__20 {
		margin-block: 20px;
		margin-inline: 20px;
	}
	.c-m__30 {
		margin-block: 30px;
		margin-inline: 30px;
	}
	.c-m__40 {
		margin-block: 40px;
		margin-inline: 40px;
	}
	.c-m__50 {
		margin-block: 50px;
		margin-inline: 50px;
	}
	.c-m__60 {
		margin-block: 60px;
		margin-inline: 60px;
	}
	.c-m__70 {
		margin-block: 70px;
		margin-inline: 70px;
	}
	.c-m__80 {
		margin-block: 80px;
		margin-inline: 80px;
	}
	.c-m__90 {
		margin-block: 90px;
		margin-inline: 90px;
	}
	.c-m__100 {
		margin-block: 100px;
		margin-inline: 100px;
	}
	.c-pb__0 {
		padding-block-end: 0;
	}
	.c-pb__5 {
		padding-block-end: 5px;
	}
	.c-pb__10 {
		padding-block-end: 10px;
	}
	.c-pb__20 {
		padding-block-end: 20px;
	}
	.c-pb__30 {
		padding-block-end: 30px;
	}
	.c-pb__40 {
		padding-block-end: 40px;
	}
	.c-pb__50 {
		padding-block-end: 50px;
	}
	.c-pb__60 {
		padding-block-end: 60px;
	}
	.c-pb__70 {
		padding-block-end: 70px;
	}
	.c-pb__80 {
		padding-block-end: 80px;
	}
	.c-pb__90 {
		padding-block-end: 90px;
	}
	.c-pb__100 {
		padding-block-end: 100px;
	}
	.c-pt__0 {
		padding-block-start: 0;
	}
	.c-pt__5 {
		padding-block-start: 5px;
	}
	.c-pt__10 {
		padding-block-start: 10px;
	}
	.c-pt__20 {
		padding-block-start: 20px;
	}
	.c-pt__30 {
		padding-block-start: 30px;
	}
	.c-pt__40 {
		padding-block-start: 40px;
	}
	.c-pt__50 {
		padding-block-start: 50px;
	}
	.c-pt__60 {
		padding-block-start: 60px;
	}
	.c-pt__70 {
		padding-block-start: 70px;
	}
	.c-pt__80 {
		padding-block-start: 80px;
	}
	.c-pt__90 {
		padding-block-start: 90px;
	}
	.c-pt__100 {
		padding-block-start: 100px;
	}
	.c-pr__0 {
		padding-inline-end: 0;
	}
	.c-pr__5 {
		padding-inline-end: 5px;
	}
	.c-pr__10 {
		padding-inline-end: 10px;
	}
	.c-pr__20 {
		padding-inline-end: 20px;
	}
	.c-pr__30 {
		padding-inline-end: 30px;
	}
	.c-pr__40 {
		padding-inline-end: 40px;
	}
	.c-pr__50 {
		padding-inline-end: 50px;
	}
	.c-pr__60 {
		padding-inline-end: 60px;
	}
	.c-pr__70 {
		padding-inline-end: 70px;
	}
	.c-pr__80 {
		padding-inline-end: 80px;
	}
	.c-pr__90 {
		padding-inline-end: 90px;
	}
	.c-pr__100 {
		padding-inline-end: 100px;
	}
	.c-pl__0 {
		padding-inline-start: 0;
	}
	.c-pl__5 {
		padding-inline-start: 5px;
	}
	.c-pl__10 {
		padding-inline-start: 10px;
	}
	.c-pl__20 {
		padding-inline-start: 20px;
	}
	.c-pl__30 {
		padding-inline-start: 30px;
	}
	.c-pl__40 {
		padding-inline-start: 40px;
	}
	.c-pl__50 {
		padding-inline-start: 50px;
	}
	.c-pl__60 {
		padding-inline-start: 60px;
	}
	.c-pl__70 {
		padding-inline-start: 70px;
	}
	.c-pl__80 {
		padding-inline-start: 80px;
	}
	.c-pl__90 {
		padding-inline-start: 90px;
	}
	.c-pl__100 {
		padding-inline-start: 100px;
	}
	.c-py__0 {
		padding-block: 0;
	}
	.c-py__5 {
		padding-block: 5px;
	}
	.c-py__10 {
		padding-block: 10px;
	}
	.c-py__20 {
		padding-block: 20px;
	}
	.c-py__30 {
		padding-block: 30px;
	}
	.c-py__40 {
		padding-block: 40px;
	}
	.c-py__50 {
		padding-block: 50px;
	}
	.c-py__60 {
		padding-block: 60px;
	}
	.c-py__70 {
		padding-block: 70px;
	}
	.c-py__80 {
		padding-block: 80px;
	}
	.c-py__90 {
		padding-block: 90px;
	}
	.c-py__100 {
		padding-block: 100px;
	}
	.c-px__0 {
		padding-inline: 0;
	}
	.c-px__5 {
		padding-inline: 5px;
	}
	.c-px__10 {
		padding-inline: 10px;
	}
	.c-px__20 {
		padding-inline: 20px;
	}
	.c-px__30 {
		padding-inline: 30px;
	}
	.c-px__40 {
		padding-inline: 40px;
	}
	.c-px__50 {
		padding-inline: 50px;
	}
	.c-px__60 {
		padding-inline: 60px;
	}
	.c-px__70 {
		padding-inline: 70px;
	}
	.c-px__80 {
		padding-inline: 80px;
	}
	.c-px__90 {
		padding-inline: 90px;
	}
	.c-px__100 {
		padding-inline: 100px;
	}
	.c-p__0 {
		padding-block: 0;
		padding-inline: 0;
	}
	.c-p__5 {
		padding-block: 5px;
		padding-inline: 5px;
	}
	.c-p__10 {
		padding-block: 10px;
		padding-inline: 10px;
	}
	.c-p__20 {
		padding-block: 20px;
		padding-inline: 20px;
	}
	.c-p__30 {
		padding-block: 30px;
		padding-inline: 30px;
	}
	.c-p__40 {
		padding-block: 40px;
		padding-inline: 40px;
	}
	.c-p__50 {
		padding-block: 50px;
		padding-inline: 50px;
	}
	.c-p__60 {
		padding-block: 60px;
		padding-inline: 60px;
	}
	.c-p__70 {
		padding-block: 70px;
		padding-inline: 70px;
	}
	.c-p__80 {
		padding-block: 80px;
		padding-inline: 80px;
	}
	.c-p__90 {
		padding-block: 90px;
		padding-inline: 90px;
	}
	.c-p__100 {
		padding-block: 100px;
		padding-inline: 100px;
	}
	.c-button-align__center {
		margin-inline: auto;
	}
}
@layer helper {
}
@layer helper {
}
@layer helper {
}
@layer helper {
}
@layer helper {
}
@layer helper {
}
@layer helper {
}
@layer helper {
}
@layer helper {
}
@layer helper {
}
@layer helper {
}
@layer helper {
}
@layer helper {
}
@layer helper {
	.c-button-align__right {
		margin-inline-start: auto;
		margin-inline-end: revert;
		@media (width < 768px) {
			margin-inline: auto;
		}
	}
	.c-button-align__left {
		margin-inline-start: revert;
		margin-inline-end: auto;
		@media (width < 768px) {
			margin-inline: auto;
		}
	}
}
@layer helper {
	.c-text__bold {
		font-weight: var(--font-weight-jp-bold);
	}
	.c-text__medium {
		font-weight: var(--font-weight-jp-medium);
	}
	.c-text__align-center {
		text-align: center;
	}
	.c-text__align-right {
		text-align: end;
	}
	.c-text__align-left {
		text-align: start;
	}
	.c-text__color-darkest {
		color: var(--color-text-base-font-primary);
	}
	.c-text__color-blue {
		color: var(--color-tone-primary);
	}
	.c-text__color-red {
		color: var(--color-tone-secondary);
	}
	.c-text__color-gray {
		color: var(--color-text-base-font-gray);
	}
	.c-text__copy {
		margin-block-end: 2rem;
		> div,
		> p,
		> span {
			display: inline;
			font-size: 2.25rem;
			font-weight: 700;
			line-height: 1.5;
			color: var(--color-tone-primary);
			letter-spacing: 0.045rem;
			background-image: linear-gradient(
				120deg,
				#0000 10px,
				var(--color-bg-base-bg-light-blue) 10px,
				var(--color-bg-base-bg-light-blue) calc(100% - 10px),
				#0000 calc(100% - 10px)
			);
			background-repeat: no-repeat;
			background-position: 0 100%;
			background-size: 100% 1rem;
			-webkit-box-decoration-break: clone;
			box-decoration-break: clone;
			@media (width < 768px) {
				font-size: 1.625rem;
				background-size: 100% 0.75rem;
			}
		}
	}
	.c-text__copy-medium {
		margin-block-end: 2rem;
		> div,
		> p,
		> span {
			display: inline;
			font-size: 1.875rem;
			font-weight: 700;
			line-height: 1.5;
			color: var(--color-tone-primary);
			letter-spacing: 0.045rem;
			background-image: linear-gradient(
				120deg,
				#0000 10px,
				var(--color-bg-base-bg-light-blue) 10px,
				var(--color-bg-base-bg-light-blue) calc(100% - 10px),
				#0000 calc(100% - 10px)
			);
			background-repeat: no-repeat;
			background-position: 0 100%;
			background-size: 100% 1rem;
			-webkit-box-decoration-break: clone;
			box-decoration-break: clone;
			@media (width < 768px) {
				font-size: 1.375rem;
				background-size: 100% 0.75rem;
			}
		}
	}
	.c-text__copy-break {
		@media (width < 768px) {
			display: none;
		}
	}
	.c-text__message {
		> p {
			font-size: var(--font-size-various-font-24);
			font-weight: 700;
			line-height: 1.7;
			color: var(--color-text-base-font-primary);
			letter-spacing: 0.03rem;
			@media (width < 768px) {
				letter-spacing: 0.0275rem;
			}
		}
	}
	.c-text__break-mobile {
		@media (width < 768px) {
			display: block;
		}
	}
}