@charset "utf-8";

@font-face {
	font-family: "LINE Seed JP";
	font-style: normal;
	font-weight: 700;
	src: url("fonts/LINESeedJP_OTF_Bd.woff2") format("woff2"),
		url("fonts/LINESeedJP_OTF_Bd.woff") format("woff");
	font-display: swap;
}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,p,blockquote,th,td,main,figure{margin:0;padding:0}table{font-size:100%;font-family:inherit}fieldset,img{border:0}img,svg,video{vertical-align:middle}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%}q:before,q:after{content:''}abbr,acronym{border:0}select,input,textarea{font-size:100%}header,footer,nav,main,section,article,figure,aside,picture{display:block}.clearfix:after,.row:after{content:"";display:table;clear:both}._fl{float:left}._fr{float:right}@media screen and (min-width: 744px),print{._pc_fl{float:left}._pc_fr{float:right}}@media screen and (max-width: 743px){._sp_fl{float:left}._sp_fr{float:right}}._tal{text-align:left!important}._tac{text-align:center!important}._tar{text-align:right!important}@media screen and (min-width: 744px),print{._pc_tal{text-align:left!important}._pc_tac{text-align:center!important}._pc_tar{text-align:right!important}}@media screen and (max-width: 743px){._sp_tal{text-align:left!important}._sp_tac{text-align:center!important}._sp_tar{text-align:right!important}}


/* 変数
====================================================================== */
:root {
	--color-theme: #2b4b9f;
	--color-base: #313131;
	--color-black: #000;
	--color-white: #fff;
	--color-blue: #2c90de;
	--color-green: #43d5bc;
	--color-yellow: #fff56e;
	--bg-base: #fff;
	--bg-gray: #ebf0f1;
	--bg-gray2: #f9f9f9;
	--border: #707070;
	--base-width: 120rem;
	--base-width-s: 92rem;
	--base-width-l: 140rem;
	--pc-min-window: 1500;
	--sp-base-padding: 2rem;
	--font-family-jp: 'Noto Sans JP', sans-serif;
	--font-family-en: 'Akshar', var(--font-family-jp);
	--font-family-title: 'LINE Seed JP', var(--font-family-jp);
	--font-weight-reg: 400;
	--font-weight-medium: 500;
	--font-weight-semi: 600;
	--font-weight-bold: 700;
	--font-weight: var(--font-weight-reg);
	--transition-duration: .3s;
	--transition: var(--transition-duration) ease-in-out;
	--header-height: 8rem;
	--capsule-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500"><path d="M51.474,199.991L199.991,51.474c68.631-68.631,179.905-68.632,248.536,0h0c68.631,68.631,68.631,179.905,0,248.536l-148.517,148.517c-68.631,68.631-179.905,68.632-248.536,0h0c-68.631-68.631-68.631-179.905,0-248.536Z" fill="white"/></svg>');
	@media screen and (max-width: 743px) {
		--header-height: 4rem;
	}
}

/* ========================================================
	template.css => テンプレート用CSS
======================================================== */
html {
	font-size: 62.5%;
	scroll-behavior: smooth;
	@media screen and (min-width: 744px), print {
		/* font-size: min(calc(10px - (1440px - 100vw) * (10 / 1440)), 10px); */
		font-size: min(calc(10px - ((var(--pc-min-window) * 1px) - 100vw) * (10 / var(--pc-min-window))), 10px);
	}
	@media screen and (max-width: 743px) {
		font-size: calc((10 / 375) * 100vw);
	}
}
html.no-scroll-behavior {
	scroll-behavior: auto;
}
body {
	background-color: var(--bg-base);
	font-size: 1.8rem;
	line-height: 2;
	color: var(--color-base);
	word-wrap: break-word;
	overflow-wrap: break-word;

	font-family: var(--font-family-jp);
	font-weight: var(--font-weight);
	font-feature-settings: "palt";
	-webkit-font-smoothing: antialiased;
	font-style: normal;
	-webkit-text-size-adjust: none;
	text-size-adjust: none;
}
* {
	letter-spacing: .05em;
}
@media screen and (max-width: 743px) {
	body {
		font-size: 1.6rem;
		line-height: calc(28 / 16);
	}
}

*,
*::before,
*::after {
	box-sizing: border-box;
}
:where(address,caption,cite,code,dfn,em,th,var) {
	font-style: normal;
	font-weight: var(--font-weight);
}
:where(h1,h2,h3,h4,h5,h6) {
	font-weight: var(--font-weight-bold);
}
:where(img) {
	max-width: 100%;
	height: auto;
	image-rendering: -webkit-optimize-contrast;
	image-rendering: crisp-edges;
}
:where(iframe) {
	max-width: 100%;
	vertical-align: middle;
}
:where(sup) {
	vertical-align: super;
	font-size: 60%;
}
:where(table) {
	border-collapse: collapse;
	border-spacing: 0;
	line-height: inherit;
}
:where(a[href], a[data-modal]) {
	--a-color: var(--color-base);
	color: var(--a-color);
	text-decoration-line: underline;
	text-decoration-style: solid;
	text-decoration-thickness: 1px;
	text-decoration-color: var(--a-color);
	text-underline-offset: .3em;
	outline: none;
	cursor: pointer;
}
:where(a[href]._a_reverse,._a_reverse a[href]) {
	text-decoration-color: color-mix(in srgb, var(--a-color) 0%, transparent);
}
@media (hover) {
	:where(a,button,._basic_trs,._hl),
	:where(a,button,._basic_trs,._hl)::before,
	:where(a,button,._basic_trs,._hl)::after {
		transition: color var(--transition), background var(--transition), border var(--transition), opacity var(--transition), text-decoration-color .2s ease-in-out;
	}
	:where(a svg, button svg) {
		transition: fill var(--transition);
	}
	:where(a[href]:hover, a[data-modal]:hover) {
		text-decoration-color: color-mix(in srgb, var(--a-color) 0%, transparent);
	}
	:where(a[href]._a_reverse, a[data-modal]._a_reverse, ._a_reverse a[href], ._a_reverse a[data-modal]):hover {
		text-decoration-color: var(--a-color);
	}
	:where(a[href]._a_reverse.-hvw),
	:where(._a_reverse.-hvw a[href]) {
		text-decoration-color: rgba(255,255,255,0);
	}
	:where(a[href]._a_reverse.-hvw):hover,
	:where(._a_reverse.-hvw a[href]):hover {
		text-decoration-color: #fff;
	}
	:where(a[href]._a_reverse.-hvbk),
	:where(._a_reverse.-hvbk a[href]) {
		text-decoration-color: color-mix(in srgb, var(--a-color) 0%, transparent);
	}
	:where(a[href]._a_reverse.-hvbk):hover,
	:where(._a_reverse.-hvbk a[href]):hover {
		text-decoration-color: var(--a-color);
	}
	:where(a[href] ._a_reverse) {
		text-decoration-line: underline;
		text-decoration-style: solid;
		text-decoration-thickness: 1px;
		text-decoration-color: color-mix(in srgb, var(--a-color) 0%, transparent);
		text-underline-offset: .3em;
	}
	:where(a[href] ._a_reverse) {
		transition: text-decoration-color .2s ease-in-out;
	}
	:where(a[href]:hover ._a_reverse) {
		text-decoration-color: var(--a-color);
	}
	:where(a[href] ._hl) {
		text-decoration-line: underline;
		text-decoration-style: solid;
		text-decoration-thickness: 1px;
		text-decoration-color: color-mix(in srgb, var(--a-color) 0%, transparent);
		text-underline-offset: .3em;
	}
	:where(a[href]:hover ._hl) {
		text-decoration-color: var(--a-color);
	}
	:where(a[href] ._hl.-hvw) {
		text-decoration-color: rgba(255,255,255,0);
	}
	:where(a[href]:hover ._hl.-hvw) {
		text-decoration-color: #fff;
	}
}

:where(label) {
	cursor: pointer;
}
:where(input, select, textarea, button) {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	max-width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	border-radius: 0;
	vertical-align: middle;
	font-family: inherit;
	font-weight: inherit;
	font-feature-settings: inherit;
	outline: none;
	font-size: 100%;
}
::placeholder {
	color: #ccc;
}
:where(button) {
	cursor: pointer;
}

.hidden {
	display: none;
}
.slick-slider * {
	outline: none;
}

#top {
	display: block;
}

/* pc / sp
====================================================================== */
@media screen and (min-width: 744px), print {
	._sp {
		display: none !important;
	}
	._pc_break {
		position: relative;
		display: block;
		height: 0;
		overflow: hidden;
	}
	._pc_hidden {
		position: relative;
		overflow: hidden;
		display: block;
		height: 0;
	}
}
@media screen and (max-width: 743px) {
	._pc {
		display: none !important;
	}
	._sp_break {
		position: relative;
		display: block;
		height: 0;
		overflow: hidden;
	}
}

/* color
====================================================================== */
._c_base {
	color: var(--color-base) !important;
}
._c_black {
	color: var(--color-black) !important;
}
._bg_gray {
	background-color: var(--bg-gray);
}
._bg_dark {
	background-color: var(--color-base);
	color: #fff;
}

/* font
====================================================================== */
._ff_en {
	font-family: var(--font-family-en);
	font-weight: 700;
	font-style: normal;
}
._ff_title {
	font-family: var(--font-family-title);
	font-weight: 700;
	font-style: normal;
}
._fwn {
	font-weight: var(--font-weight);
}
._fwr {
	font-weight: var(--font-weight-reg);
}
._fwm {
	font-weight: var(--font-weight-medium);
}
._fwb {
	font-weight: var(--font-weight-bold);
}
._wsnw {
	white-space: nowrap;
}
@media screen and (min-width: 744px), print {
	._pc_wsnw {
		white-space: nowrap;
	}
}
@media screen and (max-width: 743px) {
	._sp_wsnw {
		white-space: nowrap;
	}
}

/* display
====================================================================== */
._db {
	display: block;
}
._dib {
	display: inline-block;
}
._dfcc {
	display: flex !important;
	justify-content: center;
	align-items: center;
}
@media screen and (min-width: 744px), print {
	._pc_dib {
		display: inline-block;
	}
	._pc_dfcc {
		display: flex !important;
		justify-content: center;
		align-items: center;
	}
}
@media screen and (max-width: 743px) {
	._sp_dib {
		display: inline-block;
	}
	._sp_dfcc {
		display: flex !important;
		justify-content: center;
		align-items: center;
	}
}

/* object-fit
====================================================================== */
img._of {
	width: 100%;
	height: 100%;
	object-fit: cover;
	&.-abs {
		position: absolute;
		top: 0;
		left: 0;
	}
	&.-bg {
		pointer-events: none;
		user-select: none;
		z-index: -1;
	}
	&.-top {
		object-position: 50% 0;
	}
	&.-bottom {
		object-position: 50% 100%;
	}
	&.-contain {
		object-fit: contain;
	}
	@media screen and (min-width: 744px), print {
		&.-pc_none {
			object-fit: none;
		}
		&.-pc_top {
			object-position: 50% 0;
		}
		&.-pc_bottom {
			object-position: 50% 100%;
		}
	}
	@media screen and (max-width: 743px) {
		&.-sp_top {
			object-position: 50% 0;
		}
		&.-sp_bottom {
			object-position: 50% 100%;
		}
	}
}
@media screen and (min-width: 744px), print {
	img._pc_of {
		width: 100%;
		height: 100%;
		object-fit: cover;
		&.-abs {
			position: absolute;
			top: 0;
			left: 0;
		}
		&.-bg {
			pointer-events: none;
			user-select: none;
			z-index: -1;
		}
		&.-top {
			object-position: 50% 0;
		}
		&.-none {
			object-fit: none;
		}
	}
}
@media screen and (max-width: 743px) {
	img._sp_of {
		width: 100%;
		height: 100%;
		object-fit: cover;
		&.-abs {
			position: absolute;
			top: 0;
			left: 0;
		}
		&.-bg {
			pointer-events: none;
			user-select: none;
			z-index: -1;
		}
		&.-top {
			object-position: 50% 0;
		}
	}
}

/* hover
====================================================================== */
@media (hover) {
	a[href] ._hv_op {
		transition: opacity var(--transition);
	}
	a:is([href], [data-modal])._hv_op:hover,
	a[href]:hover ._hv_op,
	button._hv_op:hover,
	._hv_op a[href]:hover {
		opacity: 0.7;
	}
	a[href]._hv_op.-a50:hover,
	a[href]:hover ._hv_op.-a50,
	._hv_op.-a50 a[href]:hover {
		opacity: 0.5;
	}
	a[href]._hv_op.-a20:hover,
	a[href]:hover ._hv_op.-a20,
	._hv_op.-a20 a[href]:hover {
		opacity: 0.8;
	}
	a[href]._hv_op.-a10:hover,
	a[href]:hover ._hv_op.-a10,
	._hv_op.-a10 a[href]:hover {
		opacity: 0.9;
	}
}

._hv_zoom {
	position: relative;
	display: block;
	overflow: hidden;
	& > * {
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		background-repeat: no-repeat;
		background-position: 50%;
		background-size: cover;
	}
	&.-static > * {
		position: relative;
	}
}
@media (hover) {
	a[href]._hv_zoom > *,
	a[href] ._hv_zoom > * {
		transition: transform 0.5s, opacity .3s;
	}
	a[href]:hover ._hv_zoom.-s > * {
		transform: scale(1.03);
	}
	a[href]:hover ._hv_zoom.-l > * {
		transform: scale(1.1);
	}
	a[href]:hover._hv_zoom > *,
	a[href]:hover ._hv_zoom > * {
		transform: scale(1.05);
	}
}


/* _target
====================================================================== */
._target,
:where(#container [id]:not(style):not(script):not(.index_main *)) {
	display: block;
	scroll-margin-top: var(--header-height);
	@media screen and (max-width: 743px) {
		scroll-margin-top: calc(var(--header-height) + 3rem);
	}
}
:where(#container [id]._scroll-margin-top0, #header) {
	scroll-margin-top: 0 !important;
}
:where(#container [id]._scroll-margin-top-fit) {
	scroll-margin-top: var(--header-height);
}

/* w
====================================================================== */
._w {
	position: relative;
	@media screen and (min-width: 744px), print {
		width: var(--base-width);
		margin-inline: auto;
		&.-s {
			width: var(--base-width-s);
		}
		&.-l {
			width: var(--base-width-l);
		}
	}
}

/* spパディング
====================================================================== */
@media screen and (max-width: 743px) {
	._sp_pd {
		padding-inline: var(--sp-base-padding) !important;
	}
	._sp_mg {
		margin-inline: var(--sp-base-padding) !important;
	}
	._sp_full {
		margin-inline: calc(var(--sp-base-padding) * -1) !important;
	}
	._sp_full_l {
		margin-left: calc(var(--sp-base-padding) * -1) !important;
	}
	._sp_full_r {
		margin-right: calc(var(--sp-base-padding) * -1) !important;
	}
	._sp_pd-l {
		padding-inline: 3rem !important;
	}
}

/* header
====================================================================== */
#header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 900;
	@media print {
		position: absolute;
	}
	.nav_btn {
		display: flex;
		background-color: #000;
		border-radius: 0 0 0 3rem;
		.toggle_nav {
			position: relative;
			display: block;
			cursor: pointer;
			width: 11rem;
			height: 100%;
			z-index: 900;
			&::before,
			span::before,
			span::after {
				content: "";
				position: absolute;
				width: 3.4rem;
				height: .4rem;
				left: calc(50% - 1.7rem);
				top: calc(50% - .2rem);
				background-color: #fff;
				border-radius: .2rem;
				pointer-events: none;
				transition: transform var(--transition), opacity var(--transition);
				z-index: 2;
			}
			span::before {
				transform: translateY(-1.1rem);
			}
			span::after {
				transform: translateY(1.1rem);
			}
		}
		.entry {
			position: relative;
			&::before {
				content: "";
				position: absolute;
				top: 1.2rem;
				bottom: 1.2rem;
				right: 0;
				border-right: 2px solid #fff;
				pointer-events: none;
			}
			a {
				position: relative;
				display: flex;
				align-items: center;
				gap: 1.5rem;
				height: 100%;
				padding: 0 7rem 0 3rem;
				color: #fff;
				text-decoration: none;
				font-size: 1.6rem;
				font-weight: var(--font-weight-bold);
				.en {
					font-size: 3.2rem;
				}
				&::before {
					content: "";
					position: absolute;
					top: calc(50%- 1.2rem);
					right: 3rem;
					width: 2.4rem;
					height: 2.4rem;
					background-color: #fff;
					border-radius: 100%;
				}
				&::after {
					content: "";
					position: absolute;
					top: 50%;
					right: calc(3rem + .8rem);
					width: .8rem;
					height: .8rem;
					border-top: .3rem solid #000;
					border-right: .3rem solid #000;
					transform-origin: 100% 0;
					transform: rotate(45deg);
				}
			}
		}
	}
	&.-open .nav_btn .toggle_nav::before {
		opacity: 0;
	}
	&.-open .nav_btn .toggle_nav span::before {
		transform: translate(0) rotate(-45deg);
	}
	&.-open .nav_btn .toggle_nav span::after {
		transform: translate(0) rotate(45deg);
	}
	@media screen and (min-width: 744px), print {
		.logo {
			position: absolute;
			left: 0;
			top: 0;
			width: 25%;
			a {
				display: flex;
				justify-content: center;
				align-items: center;
				gap: 2rem;
				height: 8rem;
				background-color: #fff;
				border-radius: 0 0 3rem 0;
				color: var(--color-black);
				text-decoration: none;
				font-size: 2.2rem;
				line-height: 1;
				box-shadow: 0 .3rem .6rem rgba(0,0,0,.16);
				img {
					width: 8rem;
				}
			}
		}
		.nav_btn {
			position: absolute;
			right: 0;
			top: 0;
			height: 8rem;
		}
	}
	@media screen and (max-width: 743px) {
		position: sticky;
		background-color: #fff;
		display: flex;
		justify-content: space-between;
		height: 4rem;
		.logo {
			a {
				display: flex;
				align-items: center;
				gap: 1rem;
				height: 100%;
				padding-inline: 1rem;
				color: var(--color-black);
				text-decoration: none;
				font-size: 1.3rem;
				line-height: 1;
				img {
					width: 4.4rem;
				}
			}
		}

		.nav_btn {
			border-radius: 0 0 0 1rem;
			.toggle_nav {
				width: 4rem;
				&::before,
				span::before,
				span::after {
					width: 1.6rem;
					height: .2rem;
					left: calc(50% - .8rem);
					top: calc(50% - .1rem);
					border-radius: .1rem;
				}
				span::before {
					transform: translateY(-.6rem);
				}
				span::after {
					transform: translateY(.6rem);
				}
			}
			.entry {
				&::before {
					top: .5rem;
					bottom: .5rem;
					border-right-width: 1px;
				}
				a {
					gap: .5rem;
					padding: 0 3rem 0 1.2rem;
					font-size: 1rem;
					.en {
						font-size: 1.3rem;
					}
					&::before {
						top: calc(50% - .6rem);
						right: 1.2rem;
						width: 1.2rem;
						height: 1.2rem;
					}
					&::after {
						right: calc(1.2rem + .4rem);
						width: .4rem;
						height: .4rem;
						border-top-width: .1rem;
						border-right-width: .1rem;
					}
				}
			}
		}
	}

	nav {
		position: fixed;
		top: 0;
		right: 0;
		width: 74rem;
		height: 100%;
		background-color: var(--color-black);
		line-height: 1.5;
		transition: transform .3s ease-in-out;
		transform: translateX(105%);
		z-index: 800;
		@media screen and (max-width: 743px) {
			width: 100%;
		}
		.-open & {
			transform: translateX(0);
		}
		.nav_wrap {
			overflow-y: auto;
			overscroll-behavior-y: contain;
			height: 100%;
			padding: 12rem 6rem 10rem;
			@media screen and (max-width: 743px) {
				padding: 6rem var(--sp-base-padding) 6rem;
			}
		}
		.simplebar-track {
			top: 10rem !important;
			bottom: 5rem;
			right: .5rem;
		}
		.simplebar-scrollbar.simplebar-visible:before {
			opacity: 0.2;
		}
		.simplebar-scrollbar:before {
			background-color: #fff;
		}
		.gnav {
			a {
				position: relative;
				display: block;
				padding: 1.8rem;
				color: #fff;
				font-weight: var(--font-weight-bold);
				font-size: 2.4rem;
				text-decoration: none;
				@media screen and (max-width: 743px) {
					padding: 1.2rem 1rem;
					font-size: 1.3rem;
				}
				&[href]:not([target])::after {
					content: "";
					position: absolute;
					top: 50%;
					right: 1.6rem;
					width: 1rem;
					height: 1rem;
					border-top: 2px solid #fff;
					border-right: 2px solid #fff;
					transform-origin: 100% 0;
					transform: rotate(45deg);
					@media screen and (max-width: 743px) {
						right: 1.2rem;
						width: 0.9rem;
						height: 0.9rem;
					}
				}
				&[target]::after {
					content: "";
					position: absolute;
					top: calc(50% - .7rem);
					right: 1.4rem;
					width: 1.5rem;
					height: 1.3rem;
					background: url(../img/ico-blank.svg) no-repeat 50%;
					background-size: 100%;
					filter: brightness(0) invert(1);
					@media screen and (max-width: 743px) {
						right: 1rem;
					}
				}
				@media (hover) {
					& > span {
						display: block;
						transition: opacity var(--transition);
					}
					&:hover > span {
						opacity: 0.7;
					}
				}
			}
			& > li > a {
				border-bottom: .3rem solid #fff;
				@media screen and (max-width: 743px) {
					border-bottom-width: 0.2rem;
				}
				&[href] {
					margin-bottom: 2rem;
					@media screen and (max-width: 743px) {
						margin-bottom: 1rem;
					}
				}
				&.acc_title {
					cursor: pointer;
					.btn_arrow {
						--bg_hv: var(--bg);
						--color_hv: var(--color);
						right: 0;
						transform: rotate(90deg);
						transition: transform var(--transition);
						@media screen and (max-width: 743px) {
							--width: 2.4rem;
							right: 0.3rem;
						}
						&::after {
							@media screen and (max-width: 743px) {
								right: 0.8rem;
								width: 0.8rem;
								height: 0.8rem;
							}
						}
					}
					&.-open .btn_arrow {
						transform: rotate(270deg);
					}
				}
			}
			.acc_contents {
				margin-left: 4rem;
				@media screen and (max-width: 743px) {
					margin-left: 2rem;
				}
				ul {
					padding-bottom: 2rem;
					@media screen and (max-width: 743px) {
						padding-bottom: 1rem;
					}
					li {
						border-bottom: 2px solid #fff;
					}
				}
			}
		}
		.enav {
			margin-top: 4rem;
			@media screen and (max-width: 743px) {
				margin-top: 4rem;
			}
			a {
				position: relative;
				height: 14rem;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				border: 2px solid #fff;
				border-radius: 7rem;
				text-decoration: none;
				color: #fff;
				font-size: 2.8rem;
				line-height: 1.8;
				font-weight: var(--font-weight-bold);
				box-shadow: var(--box-shadow);
				@media screen and (max-width: 743px) {
					height: 7.7rem;
					font-size: 1.8rem;
					line-height: 1.5;
				}
				.en {
					font-size: 5rem;
					line-height: 1;
					@media screen and (max-width: 743px) {
						font-size: 3.2rem;
					}
				}
				.btn_arrow {
					right: 4rem;
				}
				@media (hover) {
					&:hover {
						background-color: #fff;
						color: var(--color-red);
					}
				}
			}
		}
	}

}
.-page-index #header {
	@media screen and (min-width: 744px), print {
		.entry {
			display: none;
		}
	}
}

/* footer
====================================================================== */
#footer {
	margin-top: 12rem;
	@media screen and (max-width: 743px) {
		margin-top: 6.4rem;
	}
	.footer_entry {
		position: relative;
		height: 64rem;
		margin-bottom: 8rem;
		padding-inline: calc((100% - 140rem) / 2);
		padding-top: 15rem;
		color: #fff;
		z-index: 1;
		&::after {
			content: "";
			position: absolute;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
			background: linear-gradient(to bottom, var(--color-blue) 0%, var(--color-green) 100%);
			opacity: 0.5;
			z-index: -1;
		}
		.bg {
			position: absolute;
			top: 0;
			right: 0;
			bottom: 0;
			left: calc(50% - 67rem);
			z-index: -1;
			&::after {
				content: "";
				position: absolute;
				top: 0;
				left: 0;
				bottom: 0;
				width: 35rem;
				background: linear-gradient(to left, rgba(255, 255, 255, 0) 0%, #fff 100%);

			}
		}
		.copy {
			position: relative;
			width: fit-content;
			font-size: 5rem;
			line-height: 1.2;
			font-weight: var(--font-weight-bold);
			&::before {
				content: "";
				position: absolute;
				right: calc(100% - 2rem);
				top: -11rem;
				width: 21rem;
				height: 1.2rem;
				border-radius: 0.6rem;
				background-color: #fff;
				transform-origin: 100%;
				transform: rotate(-45deg);
			}
			&::after {
				content: "";
				position: absolute;
				right: -2rem;
				top: -7rem;
				width: 2.8rem;
				height: 2.8rem;
				border-radius: 100%;
				background-color: #FFF56E;
			}
			span {
				font-size: 6.1rem;
				letter-spacing: 0.08em;
			}
		}
		.copy_en {
			margin-bottom: 5rem;
			font-size: 3.2rem;
		}
		.btn {
			display: flex;
			gap: 2rem;
			& + .btn {
				margin-top: 2rem;
			}
			li {
				width: 40rem;
			}
		}
		@media screen and (max-width: 743px) {
			height: auto;
			margin-bottom: 4rem;
			padding-inline: var(--sp-base-padding);
			padding-top: 5rem;
			padding-bottom: 27.5rem;
			&::after {
				opacity: 0.6;
			}
			.bg {
				top: auto;
				left: 0;
				height: 35rem;
				&::after {
					content: none;
				}
			}
			.copy {
				margin-inline: auto;
				font-size: 3.3rem;
				&::before {
					right: calc(100% - 1rem);
					top: -4rem;
					width: 13.7rem;
					height: 1rem;
				}
				&::after {
					right: -1rem;
					top: calc(100% + 2rem);
					width: 1.8rem;
					height: 1.8rem;
				}
				span {
					font-size: 4rem;
				}
			}
			.copy_en {
				margin-top: 0.5rem;
				margin-bottom: 2rem;
				font-size: 2.1rem;
				text-align: center;
			}
			.btn {
				flex-direction: column;
				li {
					width: auto;
				}
			}
		}
	}
	.logo {
		display: flex;
		justify-content: center;
		margin-bottom: 4rem;
		a {
			display: block;
			text-decoration: none;
			text-align: center;
			img {
				width: 11rem;
			}
			.name {
				display: block;
				margin-top: 2rem;
				font-size: 3.6rem;
				line-height: 1;
			}
		}
		@media screen and (max-width: 743px) {
			margin-bottom: 3rem;
			a {
				img {
					width: 6.4rem;
				}
				.name {
					margin-top: 1.5rem;
					font-size: 2.2rem;
				}
			}
		}
	}
	nav {
		display: flex;
		justify-content: center;
		gap: clamp(4rem, calc((100vw - 1500px) * .2 + 4rem), 6rem);
		dt {
			margin-bottom: 2.5rem;
			font-weight: var(--font-weight-bold);
			font-size: 2rem;
			line-height: 1.5;
			color: var(--color-theme);
			a {
				position: relative;
				--a-color: var(--color-theme);
				display: inline-block;
				padding-right: 3.6rem;
				&::after {
					content: "";
					position: absolute;
					right: 0;
					top: calc(50% - 2.4rem / 2);
					width: 2.4rem;
					height: 2.4rem;
					background: var(--color-theme) url(../img/ico-arrow-white.svg) no-repeat 50%;
					background-size: 1.6rem;
					border-radius: 100%;
				}
				@media (hover) {
					&:hover::after {
						opacity: 0.7;
					}
				}
			}
		}
		dd {
			display: flex;
			gap: 2.5rem;
			font-size: 1.6rem;
			line-height: 1.5;
			font-weight: var(--font-weight-medium);
			li + li {
				margin-top: 1.5rem;
			}
			a {
				position: relative;
				display: inline-block;
				--a-color: var(--color-black);
				&[target] {
					padding-right: 2.5rem;
					&::after {
						content: "";
						position: absolute;
						right: 0;
						top: calc(50% - .6rem);
						width: 1.5rem;
						height: 1.3rem;
						background: url(../img/ico-blank.svg) no-repeat 50%;
						background-size: 100%;
					}
				}
			}
			.s {
				font-size: 1.4rem;
				li + li {
					margin-top: 1rem;
				}
			}
		}
		@media screen and (max-width: 743px) {
			display: none;
		}
	}
	.h_nav {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 4rem;
		margin-top: 5rem;
		font-weight: var(--font-weight-bold);
		font-size: 1.8rem;
		line-height: 1.5;
		a:not(.sns a) {
			--a-color: var(--color-black);
			position: relative;
			letter-spacing: 0.1em;
			&[target] {
				padding-right: 2.5rem;
				&::after {
					content: "";
					position: absolute;
					right: 0;
					top: calc(50% - .6rem);
					width: 1.5rem;
					height: 1.3rem;
					background: url(../img/ico-blank.svg) no-repeat 50%;
					background-size: 100%;
				}
			}
		}
		.sns a {
			display: block;
			width: 4.8rem;
		}
		@media screen and (max-width: 743px) {
			display: block;
			margin-inline: var(--sp-base-padding);
			margin-top: 0;
			font-size: 1.6rem;
			border-top: 1px solid #E6E6E6;
			a:not(.sns a) {
				display: flex;
				align-items: center;
				height: 6rem;
				padding-left: 1rem;
				border-bottom: 1px solid #E6E6E6;
				&[target] {
					padding-right: 0;
					&::after {
						right: 1rem;
					}
				}
			}
			.sns a {
				margin-top: 1.6rem;
				margin-inline: auto;
			}
		}
	}
	small {
		display: flex;
		justify-content: center;
		align-items: center;
		height: 8rem;
		margin-top: 3rem;
		background-color: var(--color-black);
		color: #fff;
		font-size: 1.2rem;
		font-weight: var(--font-weight-bold);
		@media screen and (max-width: 743px) {
			margin-top: 1.6rem;
		}
	}
}


/* ===================================================================================================================

	パーツ

============================================================================= */

/* accordion
====================================================================== */
.acc_contents {
	height: 0;
	overflow: hidden;
	transition: height .3s ease-in-out;
}

/* btn_arrow
====================================================================== */
.btn_arrow {
	--width: 3.8rem;
	--bg: #fff;
	--color: var(--color-black);
	--bg_hv: var(--color);
	--color_hv: var(--bg);
	position: absolute;
	right: 6rem;
	top: calc(50% - var(--width) / 2);
	width: var(--width);
	height: var(--width);
	background-color: var(--bg);
	border-radius: 100%;
	color: var(--color);
	transition: background var(--transition), color var(--transition);
	@media screen and (max-width: 743px) {
		--width: 3rem;
		right: 2rem;
	}
	&::after {
		content: "";
		position: absolute;
		top: 50%;
		right: 1.4rem;
		width: 1rem;
		height: 1rem;
		border-top: 2px solid;
		border-right: 2px solid;
		transform-origin: 100% 0;
		transform: rotate(45deg);
		transition: none;
		@media screen and (max-width: 743px) {
			right: 1rem;
			width: 0.9rem;
			height: 0.9rem;
		}
	}
	@media (hover) {
		a:hover & {
			background-color: var(--bg_hv);
			color: var(--color_hv);
		}
	}
}

/* breadcrumbs
====================================================================== */
.breadcrumbs {
	padding-block: 3rem;
	font-size: 1.6rem;
	font-weight: 700;
	line-height: 1.5;
	ol {
		display: flex;
		justify-content: end;
		gap: 1.2rem;
		li:not(:last-child) {
			position: relative;
			margin-right: 2.2rem;
			@media screen and (max-width: 743px) {
				margin-right: 1.2rem;
			}
			&::after {
				content: "";
				position: absolute;
				top: 50%;
				right: -2.2rem;
				width: 1rem;
				height: 1rem;
				margin-top: 0.1rem;
				border-right: 3px solid;
				border-top: 3px solid;
				transform-origin: 100% 0;
				transform: rotate(45deg);
				@media screen and (max-width: 743px) {
					right: -1.3rem;
					width: 0.6rem;
					height: 0.6rem;
				}
			}
		}
	}
	@media screen and (max-width: 743px) {
		display: none;
	}
}

/* capsule_iamge
====================================================================== */
.capsule_iamge {
	mask-image: var(--capsule-mask);
	-webkit-mask-image: var(--capsule-mask);
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-size: contain;
	-webkit-mask-size: contain;
	mask-position: center;
	-webkit-mask-position: center;
	aspect-ratio: 1;
}

/* page_title
====================================================================== */
.page_title {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 50rem;
	text-align: center;
	@media screen and (max-width: 743px) {
		height: 13rem;
	}
	&::before {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(to bottom, var(--color-blue) 0%, var(--color-green) 100%);
		border-radius: 0 0 4rem 4rem;
		opacity: 0.8;
		@media screen and (max-width: 743px) {
			border-radius: 0 0 2rem 2rem;
		}
	}
	@media screen and (min-width: 744px), print {
		&::after {
			content: "";
			position: absolute;
			inset: 0;
			background: url(../img/page_title_point1.png) no-repeat 50% 0, url(../img/page_title_point2.png) no-repeat 50% 100%;
			background-size: 200rem;
			z-index: 2;
		}
	}
	h1 {
		position: relative;
		padding-bottom: 3rem;
		font-size: 4.8rem;
		line-height: 1.2;
		color: #fff;
		z-index: 3;
		&::before {
			content: "";
			display: block;
			width: 1.4rem;
			height: 3.2rem;
			margin-inline: auto;
			margin-bottom: 3rem;
			background: #fff;
			border-radius: 10rem;
			transform: rotate(45deg);
		}
		@media screen and (max-width: 743px) {
			padding-bottom: 1rem;
			font-size: 2.4rem;
			&::before {
				width: .84rem;
				height: 1.94rem;
				margin-bottom: 1.5rem;
			}
		}
	}
	img {
		border-radius: 0 0 4rem 4rem;
		@media screen and (max-width: 743px) {
			border-radius: 0 0 2rem 2rem;
		}
	}
	&.-entry {
		height: 60rem;
		.circle {
			position: absolute;
			top: 39rem;
			right: 0;
			left: 0;
			margin-inline: auto;
			padding-top: 7rem;
			width: 50rem;
			height: 50rem;
			background-color: #fff;
			border-radius: 100%;
			z-index: 3;
		}
		h1 {
			padding-bottom: 1rem;
			font-size: 3.2rem;
			color: var(--color-black);
			&::before {
				width: 1.3rem;
				height: 4.4rem;
				margin-bottom: 3rem;
				background: linear-gradient(135deg, var(--color-blue) 20%, var(--color-green) 70%);
			}
		}
		.en {
			font-size: 12rem;
			line-height: 1;
			background: linear-gradient(to bottom, var(--color-blue) 0%, var(--color-green) 100%);
			-webkit-background-clip: text;
			background-clip: text;
			color: transparent;
		}
		@media screen and (max-width: 743px) {
			height: 15rem;
			.circle {
				top: 9.5rem;
				padding-top: 2rem;
				width: 25rem;
				height: 25rem;
			}
			h1 {
				padding-bottom: 0.5rem;
				font-size: 1.4rem;
				&::before {
					width: .9rem;
					height: 3rem;
					margin-bottom: 1rem;
				}
			}
			.en {
				font-size: 6rem;
			}
		}
	}
}

/* title
====================================================================== */
.gradient_title {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 8rem;
	margin-bottom: 6rem;
	padding: 1.6rem 5rem;
	background: linear-gradient(to right, var(--color-green) 10%, var(--color-blue) 90%);
	border-radius: 10rem;
	color: #fff;
	font-size: 3.2rem;
	line-height: 1.5;
	font-weight: var(--font-weight-bold);
	text-align: center;
	letter-spacing: 0.08em;
	@media screen and (max-width: 743px) {
		min-height: 0;
		margin-bottom: 3rem;
		padding: 1rem 1.5rem;
		font-size: 2rem;
		border-radius: 2rem;
	}
}

.parent_title {
	width: fit-content;
	padding: 1rem 3rem;
	background-color: var(--color-theme);
	border-radius: 10rem;
	color: #fff;
	font-size: 2.4rem;
	line-height: 1.3;
	font-weight: var(--font-weight-bold);
	@media screen and (max-width: 743px) {
		padding: 0.7rem 1.5rem;
		font-size: 1.3rem;
	}
}

.en_title {
	position: relative;
	font-size: 3rem;
	line-height: 1.5;
	color: var(--color-black);
	.en {
		position: relative;
		margin-bottom: 1.6rem;
		font-size: 6rem;
		color: var(--color-theme);
		line-height: 1;
	}
	h2 {
		a {
			position: relative;
			display: inline-block;
			padding-right: 3.6rem;
			&::after {
				content: "";
				position: absolute;
				right: 0;
				top: calc(50% - 2.4rem / 2);
				width: 2.4rem;
				height: 2.4rem;
				background: var(--color-theme) url(../img/ico-arrow-white.svg) no-repeat 50%;
				background-size: 1.6rem;
				border-radius: 100%;
			}
			@media (hover) {
				&:hover::after {
					opacity: 0.7;
				}
			}
		}
	}
	.summary {
		font-size: 1.8rem;
		line-height: 2;
		font-weight: var(--font-weight-medium);
		&.-mt {
			margin-top: 3rem;
		}
	}
	@media screen and (min-width: 744px), print {
		padding-left: 15rem;
		.en {
			&::before {
				content: "";
				position: absolute;
				top: calc(50% - .2rem);
				left: -15rem;
				width: 6rem;
				height: 0.4rem;
				border-radius: 0.2rem;
				background-color: var(--color-theme);
			}
		}
		&:has(.-horizon) {
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			.en {
				width: 100%;
			}
			h2 {
				margin-right: 4rem;
			}
		}
	}
	@media screen and (max-width: 743px) {
		font-size: 2.4rem;
		text-align: center;
		.en {
			margin-bottom: 3rem;
			font-size: 4.2rem;
			&::before {
				content: "";
				display: block;
				margin: 0 auto 4rem;
				width: 0.4rem;
				height: 3rem;
				border-radius: 0.2rem;
				background-color: var(--color-theme);
			}
		}
		.summary {
			margin-top: 1rem;
			&.-mt {
				margin-top: 1.5rem;
			}
		}
	}
}

.point_title {
	margin-bottom: 8rem;
	font-size: 3.6rem;
	line-height: 1.5;
	text-align: center;
	color: var(--color-theme);
	letter-spacing: .15em;
	&::before {
		content: "";
		display: block;
		width: 1.3rem;
		height: 4.4rem;
		margin-inline: auto;
		margin-bottom: 1rem;
		background: linear-gradient(135deg, var(--color-blue) 20%, var(--color-green) 70%);
		border-radius: 10rem;
		transform: rotate(45deg);
	}
	@media screen and (max-width: 743px) {
		margin-bottom: 3rem;
		font-size: 2.2rem;
		&::before {
			width: .9rem;
			height: 3rem;
		}
	}
}

/* page_bg
====================================================================== */
.page_bg {
	position: relative;
	&::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		@media screen and (min-width: 744px), print {
			max-height: 380rem;
			background: url(../img/page_bg_top.png) no-repeat 50% 0, url(../img/page_bg.png) repeat-y 50% 47rem;
			background-size: 220rem, 362rem;
		}
		@media screen and (max-width: 743px) {
			background: url(../img/page_bg_sp.png) no-repeat 50% 0;
			background-size: 100%;
		}
	}
}

/* box_btn
====================================================================== */
.box_btn {
	position: relative;
	display: flex;
	align-items: center;
	max-width: 100%;
	width: 46rem;
	height: 6.5rem;
	padding-inline: 4rem 8rem;
	background-color: #fff;
	border-radius: 3.25rem;
	color: var(--color-base);
	text-decoration: none;
	font-size: 1.6rem;
	font-weight: var(--font-weight-bold);
	line-height: 1.5;
	box-shadow: 0 .3rem .6rem rgba(0,0,0,.1);
	&:not([target])::after {
		content: "";
		position: absolute;
		top: calc(50% - 1.6rem / 2);
		right: 3.8rem;
		width: 1.6rem;
		height: 1.6rem;
		background: url(../img/ico-arrow.svg) no-repeat 50%;
		background-size: 100%;
		filter: brightness(0);
	}
	&[target]::after {
		content: "";
		position: absolute;
		top: calc(50% - .7rem);
		right: 3.8rem;
		width: 1.5rem;
		height: 1.3rem;
		background: url(../img/ico-blank.svg) no-repeat 50%;
		background-size: 100%;
	}
	@media (hover) {
		&::after {
			transition: filter var(--transition);
		}
		&:hover {
			background-color: var(--color-theme);
			color: #fff;
			&::after {
				filter: brightness(0) invert(1);
			}
		}
	}
	&.-center {
		margin-inline: auto;
	}
	@media screen and (max-width: 743px) {
		justify-content: center;
		width: 100%;
		height: 5.4rem;
		padding-inline: 5rem;
		font-size: 1.7rem;
		&::after {
			right: 2rem !important;
		}
		&.-sp_left {
			justify-content: start;
			padding-inline: 2rem;
			font-size: 1.5rem;
		}
	}
}
.en_box_btn {
	position: relative;
	display: flex;
	align-items: center;
	max-width: 100%;
	width: 46rem;
	height: 10.6rem;
	background-color: var(--color-theme);
	border: .3rem solid var(--color-theme);
	border-radius: 5.3rem;
	color: #fff;
	text-decoration: none;
	font-size: 2.6rem;
	font-weight: var(--font-weight-bold);
	line-height: 1.2;
	box-shadow: 0 .3rem .6rem rgba(0,0,0,.1);
	&::after {
		content: "";
		position: absolute;
		top: calc(50% - 3.8rem / 2);
		right: calc(4rem - .3rem);
		width: 3.8rem;
		height: 3.8rem;
		background: #fff url(../img/ico-arrow.svg) no-repeat 50%;
		background-size: 1.6rem;
		border-radius: 100%;
	}
	.en {
		width: 50%;
		padding-left: 1rem;
		text-align: center;
		font-size: 3.8rem;
	}
	.ja {
		padding-bottom: 0.4rem;
	}
	@media (hover) {
		&:hover {
			background-color: #fff;
			color: var(--color-theme);
		}
	}
	&.-center {
		margin-inline: auto;
	}
	&.-s {
		width: 41rem;
		height: 8.4rem;
		padding-right: 2rem;
		justify-content: center;
		&::after {
			right: calc(2rem - .3rem);
		}
	}
	@media screen and (max-width: 743px) {
		width: 100%;
		height: 8rem;
		font-size: 2rem;
		&::after {
			right: 2rem;
		}
		.en {
			width: calc(50% + .5rem);
			padding-left: 3.5rem;
			font-size: 3.2rem;
			text-align-last: left;
		}
		.ja {
			padding-bottom: 0.2rem;
		}
		&.-s {
			width: 100%;
			height: 6rem;
			padding-inline: 2rem;
			font-size: 1.6rem;
			justify-content: start;
			&::after {
				right: 1.2rem;
			}
		}
	}
}

/* acc
====================================================================== */
._acc {
	overflow: hidden;
	height: 0;
	transition: height var(--transition);
}

/* staff_list
====================================================================== */
.staff_list {
	position: relative;
	height: 48rem;
	padding-bottom: 5.4rem;
	box-sizing: content-box;
	a {
		position: relative;
		display: block;
		height: 48rem;
		--a-color: #fff;
		font-weight: var(--font-weight-bold);
		font-size: 1.9rem;
		line-height: 1.5;
		text-decoration: none;
		.ph {
			position: absolute;
			left: 0;
			bottom: 0;
			width: 35.4rem;
		}
		.num {
			position: absolute;
			left: 20rem;
			top: 6rem;
			font-size: 5.9rem;
			line-height: 1;
		}
		.name {
			position: absolute;
			left: 20rem;
			top: 12rem;
			white-space: nowrap;
			span {
				display: block;
			}
		}
		@media (hover) {
			.num {
				transition: color var(--transition);
			}
			&:hover {
				.num {
					color: var(--color-yellow);
				}
			}
		}
	}
	.pagination {
		position: absolute;
		bottom: 0;
		right: 10rem;
		display: flex;
		align-items: center;
		gap: 3rem;
		height: 8rem;
		padding: 0 2rem;
		border-radius: 4rem;
		background-color: #fff;
		box-shadow: 0 .3rem .6rem rgba(0,0,0,.16);
		z-index: 2;
		.arrow {
			position: relative;
			flex-shrink: 0;
			width: 5.6rem;
			height: 5.6rem;
			border-radius: 100%;
			background-color: #2c90dd;
			cursor: pointer;
			&::after {
				content: "";
				position: absolute;
				top: 50%;
				right: 2rem;
				width: 1.4rem;
				height: 1.4rem;
				border-top: .4rem solid #fff;
				border-right: .4rem solid #fff;
				transform-origin: 100% 0;
				transform: rotate(45deg);
			}
			&.-l {
				transform: scaleX(-1);
			}
			@media (hover) {
				transition: opacity var(--transition);
				&:hover {
					opacity: 0.7;
				}
			}
		}
		.dots {
			display: flex;
			gap: 1.5rem;
			.swiper-pagination-bullet {
				margin: 0;
				width: 1.6rem;
				height: 1.6rem;
				background: #ebf0f0;
				transition: background .1s;
				opacity: 1;
			}
			.swiper-pagination-bullet-active {
				background: #2c90dd;
			}
		}
	}
	@media screen and (min-width: 744px), print {
		.swiper-container {
			padding-right: 17.2rem;
			background: url(../img/staff_list_bg.svg) no-repeat 50%;
			background-size: 100%;
			-webkit-mask-image: url(../img/staff_list_mask.svg);
			mask-image: url(../img/staff_list_mask.svg);
			-webkit-mask-size: cover;
			mask-size: cover;
		}
	}
	@media screen and (max-width: 743px) {
		height: 37.8rem;
		padding-bottom: 7.6rem;
		._sp_pd & {
			margin-inline: calc(var(--sp-base-padding) * -1);
		}
		&::before {
			content: "";
			position: absolute;
			right: 0;
			left: 0;
			top: -12rem;
			height: 60rem;
			background: url(../img/staff_list_bg_sp.png) no-repeat 50%;
			background-size: 100%;
			z-index: -1;
		}
		.swiper-container {
			margin-left: 8.4rem;
			background: url(../img/staff_list_bg.svg) no-repeat 0;
			background-size: auto 100%;
			-webkit-mask-image: url(../img/staff_list_mask.svg);
			mask-image: url(../img/staff_list_mask.svg);
			-webkit-mask-size: auto 100%;
			mask-size: auto 100%;
		}
		.staff_list_item {
			width: 24rem;
		}
		a {
			height: 37.8rem;
			font-size: 1.4rem;
			.ph {
				width: 27.7rem;
			}
			.num {
				left: 15.8rem;
				top: 3.5rem;
				font-size: 5.9rem;
			}
			.name {
				left: 15.8rem;
				top: 9.6rem;
			}
		}
		.pagination {
			right: 0;
			left: 0;
			width: fit-content;
			margin-inline: auto;
			gap: 2rem;
			height: 5.6rem;
			padding: 0 1rem;
			.arrow {
				width: 3.8rem;
				height: 3.8rem;
				&::after {
					right: 1.3rem;
					width: 1.2rem;
					height: 1.2rem;
				}
			}
			.dots {
				flex-wrap: wrap;
				max-width: calc(1.2rem * 8 + 1rem * (8 - 1));
				gap: 1rem;
				.swiper-pagination-bullet {
					width: 1.2rem;
					height: 1.2rem;
				}
			}
		}
	}
}

/* main_box
====================================================================== */
.main_box {
	position: relative;
	margin-bottom: 12rem;
	z-index: 5;
	@media screen and (min-width: 744px), print {
		margin-top: 8rem;
		padding: 8rem 2rem 2rem;
		background: #fff;
		border-radius: 4rem;
		box-shadow: 0 .3rem 1rem rgba(0,0,0,0.16);
		&.-entry {
			margin-top: 15rem;
			margin-bottom: 8rem;
		}
	}
	@media screen and (max-width: 743px) {
		margin-bottom: 4rem;
		padding-top: 4rem;
		&.-entry {
			padding-top: 13rem;
		}
	}
	.gradient_title {
		@media screen and (min-width: 744px), print {
			position: absolute;
			right: 0;
			left: 0;
			top: -4rem;
			width: 81.2rem;
			margin-inline: auto;
		}
	}
	.lead {
		text-align: center;
		font-weight: var(--font-weight-bold);
		font-size: 2.8rem;
		line-height: calc(46 / 28);
		@media screen and (max-width: 743px) {
			font-size: 2rem;
			line-height: calc(34 / 20);
		}
		& + dl {
			margin-top: 7rem;
			@media screen and (max-width: 743px) {
				margin-top: 5rem;
			}
		}
		& + ol {
			margin-top: 5rem;
			@media screen and (max-width: 743px) {
				margin-top: 3rem;
			}
		}
	}
	dl {
		position: relative;
		dt {
			position: absolute;
			right: 0;
			left: 0;
			top: -3.3rem;
			display: flex;
			justify-content: center;
			align-items: center;
			text-align: center;
			width: 66.6rem;
			height: 6.6rem;
			margin-inline: auto;
			background-color: #fff;
			border: .3rem solid #ebefef;
			border-radius: 3.3rem;
			font-size: 2.8rem;
			line-height: 1.5;
			font-weight: var(--font-weight-bold);
			z-index: 2;
			@media screen and (max-width: 743px) {
				top: -2.3rem;
				width: 25.6rem;
				height: 4.6rem;
				font-size: 1.8rem;
			}
		}
	}
	ol {
		padding: 4rem 9rem;
		background-color: var(--bg-gray2);
		border-radius: 3rem;
		@media screen and (min-width: 744px), print {
			display: flex;
			flex-wrap: wrap;
			gap: 5rem 3rem;
		}
		@media screen and (max-width: 743px) {
			position: relative;
			background: #fff;
			padding: 5rem 4rem 5rem;
			border-radius: 2rem;
			box-shadow: 0 .3rem 1rem rgba(0,0,0,0.16);
			z-index: 1;
			&::before {
				content: "";
				position: absolute;
				inset: 2rem;
				background-color: var(--bg-gray2);
				border-radius: 2rem;
				z-index: -1;
			}
		}
		li {
			position: relative;
			padding-left: 7.8rem;
			font-size: 2rem;
			line-height: 2;
			font-weight: var(--font-weight-bold);
			z-index: 1;
			@media screen and (min-width: 744px), print {
				display: flex;
				align-items: center;
				min-height: 2lh;
				width: calc((100% - 3rem) / 2);
			}
			@media screen and (max-width: 743px) {
				padding-left: 6rem;
				font-size: 1.8rem;
				line-height: calc(28 / 18);
				&:not(:last-child) {
					margin-bottom: 2rem;
				}
			}
			.num {
				position: absolute;
				top: 1rem;
				left: 2rem;
				z-index: -1;
				&::before {
					content: "";
					position: absolute;
					top: 3rem;
					left: -2rem;
					width: 10.4rem;
					height: 7rem;
					background-color: #ebf0f0;
					border-radius: 10rem;
					transform: rotate(-45deg);
					z-index: -1;
				}
				img {
					width: 4.4rem;
				}
				@media screen and (max-width: 743px) {
					top: 0;
					left: 1.5rem;
					&::before {
						top: 1.5rem;
						left: -1.5rem;
						width: 6rem;
						height: 4rem;
					}
					img {
						width: 2.6rem;
					}
				}
			}
		}
	}
	dl ol {
		@media screen and (min-width: 744px), print {
			padding-block: 8rem;
		}
		@media screen and (max-width: 743px) {
			padding-top: 6rem;
			&::before {
				top: 3.4rem;
			}
		}
	}
}

/* paragraph
====================================================================== */
.paragraph > * + * {
	margin-top: 1lh;
}
.paragraph.-m > * + * {
	margin-top: .7lh;
}


/* ul / ol
====================================================================== */
.dot_li > li {
	position: relative;
	padding-left: 1em;
}
.dot_li > li::before {
	content: "・";
	position: absolute;
	top: 0;
	left: 0;
}

.circle_li > li {
	position: relative;
	padding-left: 1.1em;
}
.circle_li > li::before {
	content: "";
	position: absolute;
	top: calc(.5lh - .5rem);
	left: 0;
	width: 1rem;
	height: 1rem;
	background-color: var(--color-theme);
	border-radius: 100%;
}

.parentheses_li > li {
	position: relative;
	padding-left: 2.8em;
}
.parentheses_li > li > span:first-child {
	position: absolute;
	top: 0;
	left: 0;
}

.parentheses_li_h > li {
	position: relative;
	padding-left: 1.6em;
}
.parentheses_li_h > li > span:first-child {
	position: absolute;
	top: 0;
	left: 0;
}
.parentheses_li_hh > li {
	position: relative;
	padding-left: 2.2em;
}
.parentheses_li_hh > li > span:first-child {
	position: absolute;
	top: 0;
	left: 0;
}

.point_li > li {
	position: relative;
	padding-left: 1.2em;
}
.point_li > li > span:first-child {
	position: absolute;
	top: 0;
	left: 0;
}

.square_li > li {
	position: relative;
	padding-left: 0.8em;
}
.square_li > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .8em;
	width: 5px;
	height: 5px;
	background-color: #14143c;
}
@media screen and (max-width: 743px) {
	.square_li > li::before {
		top: 0.6em;
	}
}

.num_li {
	margin-left: 1.8em;
	list-style: decimal;
}
.alphabet_li {
	margin-left: 1.8em;
	list-style: lower-latin;
}

.mt_li > li + li {
	margin-top: .8lh;
}
.mt_li_s > li + li {
	margin-top: .5lh;
}
@media screen and (max-width: 743px) {
	.sp_mt_li > li + li {
		margin-top: 0.8em;
	}
}

.inline_li > li {
	display: inline-block;
	margin-right: 0.3em;
}

@media screen and (min-width: 744px), print {
	.column_li {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.column_li > li {
		width: 48%;
	}
	.column_li > li:nth-child(n + 3) {
		margin-top: 0.25em;
	}
}
@media screen and (max-width: 743px) {
	.column_li > li + li {
		margin-top: 0.25em;
	}
}

.dl_table {
	display: table;
}
.dl_table > * {
	display: table-row;
}
.dl_table > * > * {
	display: table-cell;
}
.dl_table dt {
	white-space: nowrap;
}
.dl_table.-dt_pr dt {
	padding-right: 1em;
}


/* ============================================================================

	トップ

============================================================================= */
:root{
  --mask-left: calc(50vw - 32rem);
  --mask-left_sp: calc(50vw - 16rem);
  --mask-bottom: 39.6rem;
  --mask-size: 300rem;
  --video-size: calc(50vw + 16rem);
  --video-size_sp: calc(50vw + 13rem);
  --video-height_sp: calc(44lvh);
}

.index_main {
	position: relative;
	height: calc(300vh + 150vh + 100vh);
	@media screen and (max-width: 743px) {
		height: calc(200vh + 150vh + 100vh);
		height: auto;
	}
	clip-path: inset(0);
	z-index: 1;
	.pin {
		position: absolute;
		left: 0;
		top: 0;
		height: 300vh;
		@media screen and (max-width: 743px) {
			height: 200vh;
		}
	}
	.pin2 {
		height: 200vh;
		@media screen and (max-width: 743px) {
			height: 50lvh;
		}
	}

	#stage {
		position: fixed;
		position: sticky;
		overflow: hidden;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		height: 100vh;
		/* max-height: 100vw; */
		display: block;
		@media screen and (max-width: 743px) {
			top: var(--header-height);
			height: calc(100lvh - var(--header-height));
		}
	}
	#kvVideo {
		position: absolute;
		top: 0;
		right: 0;
		height: 100%;
		width: var(--video-size);
		opacity: 1;
		object-fit: cover;
		@media screen and (max-width: 743px) {
			width: var(--video-size_sp);
			height: var(--video-height_sp);
		}
	}
	#capShape {
		width: var(--mask-size);
		height: calc(var(--mask-size) * (800 / 3000));
		transform-origin: 0% 0%;
		transform-box: fill-box;
		transform: scale(calc(304 / 300)) translate(var(--mask-left), calc(100vh - (var(--mask-size) * (800 / 3000)) + var(--mask-bottom) - 9vh)) rotate(-45deg);
		@media screen and (max-width: 743px) {
			transform: scale(calc(280 / 800)) translate(var(--mask-left_sp), calc((50svh - 10rem - 11rem) * (800 / 280))) rotate(-45deg);
		}
	}
	.kv_title {
		position: fixed;
		inset: 0;
		width: 130rem;
		/* max-height: 100vw; */
		margin-inline: auto;
		display: flex;
		flex-direction: column;
		justify-content: center;
		filter: brightness(1) invert(0);
		z-index: 3;
		pointer-events: none;
		transform: translateY(-4rem);
		img {
			width: 42rem;
		}
		.en {
			margin-top: 4rem;
			font-size: 4.1rem;
			color: var(--color-black);
		}
		@media screen and (max-width: 743px) {
			top: calc(4rem + 6rem);
			width: 25rem;
			transform: translateY(0);
			.en {
				margin-top: 1.5rem;
				font-size: 2.4rem;
				white-space: nowrap;
			}
		}
	}
	.kv_lead {
		position: fixed;
		inset: 0;
		width: 130rem;
		/* max-height: 100vw; */
		margin-inline: auto;
		display: flex;
		flex-direction: column;
		justify-content: center;
		color: #fff;
		padding-top: 42rem;
		padding-left: 10rem;
		font-size: 2rem;
		font-weight: var(--font-weight-bold);
		line-height: 2.4;
		z-index: 3;
		opacity: 0;
		transform: translateY(6rem);
		pointer-events: none;
		@media screen and (max-width: 743px) {
			width: 100%;
			padding: calc(50svh - 8rem) 0 0;
			font-size: 1.8rem;
			line-height: calc(46 / 18);
			text-align: center;
		}
	}

	.philosophy_wrap {
		position: relative;
		margin-top: 100vh;
		height: 150vh;
		/* max-height: 150vw; */
		@media screen and (max-width: 743px) {
			margin-top: 200vh;
			height: auto;
			background: #fff;
			padding: 4rem 0;
		}
	}
	.philosophy {
		position: relative;
		position: sticky;
		top: 0;
		height: 100vh;
		/* max-height: 100vw; */
		display: flex;
		align-items: center;
		color: #fff;
		z-index: 5;
		.philosophy_txt {
			position: relative;
			width: 70%;
			text-align: center;
			font-size: 3rem;
			line-height: 2;
			font-weight: var(--font-weight-medium);
			.philosophy_title {
				margin-bottom: 3rem;
				img {
					width: 33rem;
				}
			}
		}
		.point1 {
			position: absolute;
			left: 40%;
			top: 22rem;
			width: 3rem;
			height: 3rem;
			background: #FFF56E;
			border-radius: 10rem;
			opacity: 0;
		}
		.point2 {
			position: absolute;
			left: 30%;
			top: 10rem;
			width: 20rem;
			height: 1.2rem;
			background: #fff;
			border-radius: 10rem;
			transform: rotate(-45deg);
			opacity: 0;
		}
		.point3 {
			position: absolute;
			right: 0;
			bottom: 13rem;
			width: 36.5rem;
			height: 4rem;
			background: linear-gradient(135deg, var(--color-green) 20%, var(--color-blue) 70%);
			border-radius: 10rem;
			transform: rotate(-45deg);
		}
		@media screen and (max-width: 743px) {
			position: relative;
			height: auto;
			justify-content: center;
			padding: 5rem 0 30rem;
			background: url(../img/index/philosophy_bg_sp.jpg) no-repeat 50%;
			background-size: cover;
			border-radius: 4rem;
			text-align: center;
			z-index: 5;
			.philosophy_txt {
				position: relative;
				width: auto;
				text-align: center;
				font-size: 1.8rem;
				line-height: calc(40 / 18);
				.philosophy_title {
					margin-bottom: 3rem;
					img {
						width: 24rem;
					}
				}
			}
			.point1 {
				left: auto;
				right: 3rem;
				top: 2.7rem;
				width: 1.6rem;
				height: 1.6rem;
				opacity: 1;
			}
			.point2 {
				left: -12rem;
				top: 32rem;
				opacity: 1;
			}
			.point3 {
				display: none;
			}
		}
	}

	.bg {
		overflow: hidden;
		position: fixed;
		inset: 0;
		/* max-height: 100vw; */
		z-index: -1;
		div {
			position: absolute;
			top: calc(50% - 160rem / 2);
			left: calc(50% - 200rem / 2);
			width: 200rem;
			height: 160rem;
			background: url(../img/index/main_bg.png) no-repeat 50%;
			background-size: 100%;
			@media screen and (max-width: 743px) {
				top: calc(50% - 75rem / 2);
				left: 0;
				right: 0;
				width: 100%;
				height: 75rem;
				background-image: url(../img/index/main_bg_sp.png);
			}
		}
	}

	.main_capsule {
		position: fixed;
		right: calc(50% + 25rem);
		/* top: min(calc(50% + 15rem), calc(50vw + 15rem)); */
		top: calc(50% + 15rem);
		width: 29rem;
		z-index: -1;
		@media screen and (max-width: 743px) {
			width: 28rem;
			right: calc(50% - 4rem);
			top: calc(50% + 16rem);
		}
	}
	&.bg-hide {
		.bg,
		.main_capsule {
			display: none;
		}
	}

	.main_entry_btn {
		position: fixed;
		right: 5rem;
		bottom: 5rem;
		z-index: 10;
		transition: opacity .6s linear;
		transform-origin: 100% 100%;
		transform: scale(.8);
		@media screen and (max-width: 743px) {
			right: 1rem;
			bottom: 2rem;
			transform: scale(.4);
		}
		a {
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;
			width: 25rem;
			height: 25rem;
			padding-bottom: 3rem;
			background-color: var(--color-black);
			border-radius: 100%;
			color: #fff;
			text-decoration: none;
			font-weight: var(--font-weight-bold);
			font-size: 2.4rem;
			line-height: 1.5;
			.en {
				font-size: 4.2rem;
				line-height: 1.3;
			}
			.btn_arrow {
				--bg_hv: var(--bg);
				--color_hv: var(--color);
				right: 0;
				left: 0;
				top: auto;
				bottom: 3.8rem;
				margin-inline: auto;
				transform: rotate(90deg);
				transition: transform var(--transition);
				@media screen and (max-width: 743px) {
					--width: 2.4rem;
					right: 0.3rem;
				}
				&::after {
					@media screen and (max-width: 743px) {
						right: 0.8rem;
						width: 0.8rem;
						height: 0.8rem;
					}
				}
			}
		}
	}
	&.bg-hide {
		.main_entry_btn {
			opacity: 0;
			pointer-events: none;
		}
	}
}

.index_contents {
	position: relative;
	@media screen and (min-width: 744px), print {
		margin-top: 10rem;
		padding: 5rem calc((100% - var(--base-width-l)) / 2) 15rem;
		background: url(../img/index/contents_bg.png) no-repeat 50% 0;
		background-size: 368rem;
	}
	@media screen and (max-width: 743px) {
		padding-bottom: 7rem;
	}
}

.index_business {
	position: relative;
	margin-bottom: 25.5rem;
	@media screen and (max-width: 743px) {
		margin-bottom: 5rem;
		padding-bottom: 50rem;
		padding-inline: var(--sp-base-padding);
		background: url(../img/index/business_bg_sp.png) no-repeat 50% 100%;
		background-size: 100%;
	}
	.btns {
		display: flex;
		flex-direction: column;
		gap: 2rem;
		margin-top: 4rem;
		@media screen and (min-width: 744px), print {
			margin-left: 15rem;
		}
		@media screen and (max-width: 743px) {
			margin-top: 3rem;
		}
	}
	.capsule_iamge.-capsule1 {
		position: absolute;
		top: 10rem;
		left: calc(50% + 7.6rem);
		width: 58.2rem;
		@media screen and (max-width: 743px) {
			top: auto;
			bottom: 12.2rem;
			left: 0;
			right: 0;
			width: 33rem;
			margin-inline: auto;
		}
	}
	.capsule_iamge.-capsule2 {
		position: absolute;
		top: calc(10rem + 43.8rem);
		left: min(calc(50% + 7.6rem + 47.2rem), calc(50% + 50vw - 21.4rem - 20px));
		width: 21.4rem;
		@media screen and (max-width: 743px) {
			top: auto;
			bottom: 0;
			left: calc(50% + 1rem);
			width: 16rem;
		}
	}
}

.index_job {
	position: relative;
	margin-bottom: 15rem;
	@media screen and (min-width: 744px), print {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: end;
	}
	@media screen and (max-width: 743px) {
		display: flex;
		flex-direction: column;
		margin-bottom: 0;
		padding-bottom: 14rem;
		padding-inline: var(--sp-base-padding);
		background: url(../img/index/job_bg_sp.png) no-repeat 50% 100%;
		background-size: 100%;
	}
	.head_img {
		margin-bottom: 9rem;
		width: 100%;
		img {
			border-radius: 3rem;
		}
		@media screen and (max-width: 743px) {
			order: 3;
			margin-top: 4rem;
			margin-bottom: 0;
			img {
				border-radius: 2rem;
			}
		}
	}
	.btns {
		display: flex;
		flex-direction: column;
		gap: 2rem;
		@media screen and (min-width: 744px), print {
			margin-right: 5rem;
		}
		@media screen and (max-width: 743px) {
			margin-top: 3rem;
		}
	}
}

.index_voice {
	position: relative;
	.bnr {
		display: flex;
		flex-direction: column;
		gap: 3rem;
		margin-top: 4rem;
		@media screen and (max-width: 743px) {
			margin-top: 6rem;
			padding-inline: var(--sp-base-padding);
			gap: 2rem;
		}
		a {
			overflow: hidden;
			display: block;
			background-color: #fff;
			border-radius: 3rem;
			text-decoration: none;
			color: var(--color-black);
			box-shadow: 0 .3rem .6rem rgba(0,0,0,.16);
			.title {
				position: relative;
				display: flex;
				align-items: center;
				padding-left: 4rem;
				font-weight: var(--font-weight-bold);
				font-size: 2.1rem;
				&::after {
					content: "";
					position: absolute;
					top: calc(50% - 1.6rem / 2);
					right: 3.8rem;
					width: 1.6rem;
					height: 1.6rem;
					background: url(../img/ico-arrow.svg) no-repeat 50%;
					background-size: 100%;
					filter: brightness(0);
				}
			}
			@media screen and (min-width: 744px), print {
				display: flex;
				flex-direction: row-reverse;
				width: 80rem;
				.title {
					flex-grow: 1;
				}
				.img {
					width: 40.2rem;
				}
			}
			@media screen and (max-width: 743px) {
				.title {
					height: 7.5rem;
				}
			}
		}
	}
}

.index_workstyle {
	position: relative;
	color: #fff;
	@media screen and (min-width: 744px), print {
		height: 80rem;
		padding: 10rem calc((100% - var(--base-width-l)) / 4) 0;
	}
	@media screen and (max-width: 743px) {
		padding: 4rem var(--sp-base-padding) 27rem;
	}
	.en_title {
		margin-bottom: 2rem;
		color: #fff;
		.en {
			&::before {
				background-color: #fff;
			}
			img {
				width: 42rem;
				@media screen and (max-width: 743px) {
					width: 23rem;
				}
			}
		}
		h2 {
			a {
				--a-color: #fff;
				&::after {
					background: #fff url(../img/ico-arrow.svg) no-repeat 50%;
				}
			}
		}
	}
	.btns {
		display: flex;
		flex-direction: column;
		gap: 2rem;
		margin-top: 4rem;
		@media screen and (min-width: 744px), print {
			margin-left: 15rem;
		}
		@media screen and (max-width: 743px) {
			margin-top: 3rem;
		}
	}
	.bg {
		overflow: hidden;
		position: absolute;
		inset: 0;
		z-index: -1;
		&::after {
			content: "";
			position: absolute;
			inset: 0;
			background: linear-gradient(to bottom, var(--color-blue) 0%, var(--color-green) 100%);
			opacity: 0.5;
			z-index: 2;
		}
		@media screen and (min-width: 744px), print {
			right: calc(90 / 1800 * 100%);
			border-radius: 0 40rem 40rem 0;
			background-color: #EDE8E1;
			text-align: right;
			img {
				width: 138.4rem;
			}
			&::before {
				content: "";
				position: absolute;
				top: 0;
				bottom: 0;
				left: calc(100% - 138.4rem);
				width: 40rem;
				background: linear-gradient(to left, rgba(237, 232, 225, 0) 0%, #ede8e1 100%);
				z-index: 2;
			}
		}
		@media screen and (max-width: 743px) {
			border-radius: 4rem;
			img {
				position: absolute;
				left: 0;
				bottom: 0;
				width: 100%;
			}
			&::before {
				content: "";
				position: absolute;
				right: 0;
				left: 0;
				bottom: calc(29rem - 8.5rem);
				height: 8.5rem;
				background: linear-gradient(to top, rgba(255,255,255,0) 0%, #fff 100%);
				z-index: 2;
			}
		}
	}
}

.index_message {
	position: relative;
	overflow: hidden;
	margin-top: 14rem;
	margin-bottom: 15rem;
	background: var(--bg-gray) url(../img/index/message_bg.png) no-repeat 50% 0;
	background-size: 250rem;
	padding: 14rem calc((100% - var(--base-width-l)) / 2) 15rem;
	border-radius: 10rem;
	font-weight: var(--font-weight-medium);
	z-index: 3;
	@media screen and (max-width: 743px) {
		margin-top: 4rem;
		margin-bottom: 4rem;
		background-image: url(../img/index/message_bg_sp.png);
		background-size: 100%;
		padding: 4rem var(--sp-base-padding) 2.5rem;
		border-radius: 4rem;
	}
	.en_title {
		margin-bottom: 2rem;
		.en {
			color: var(--color-black);
			&::before {
				background-color: var(--color-black);
			}
		}
	}
	.txt {
		@media screen and (min-width: 744px), print {
			padding-left: 15rem;
			padding-right: 58rem;
		}
	}
	.lead {
		margin-bottom: 2rem;
		font-size: 3.6rem;
		line-height: 2;
		font-weight: var(--font-weight-bold);
		@media screen and (max-width: 743px) {
			margin-bottom: 3rem;
			font-size: 2.7rem;
			text-align: center;
		}
	}
	.name {
		text-align: right;
		margin-top: 1rem;
		@media screen and (max-width: 743px) {
			margin-top: 1lh;
		}
	}
	.ph {
		@media screen and (min-width: 744px), print {
			position: absolute;
			width: 41rem;
			top: 14rem;
			left: calc(50% + 19rem);
		}
		@media screen and (max-width: 743px) {
			width: 30rem;
			margin-inline: auto;
			margin-bottom: 3rem;
		}
		img {
			border-radius: 20.5rem;
		}
	}

	.campany {
		margin-top: 8rem;
		background-color: #fff;
		border-radius: 3rem;
		h2 {
			margin-bottom: 2rem;
			font-size: 3rem;
			line-height: 1.5;
		}
		.more {
			margin-top: 4rem;
		}
		.campany_ph {
			img {
				border-radius: 3rem;
			}
		}
		@media screen and (min-width: 744px), print {
			padding: 6rem;
			display: flex;
			align-items: center;
			.campany_main {
				padding-left: 5rem;
			}
			.campany_ph {
				width: 64rem;
				margin-left: auto;
			}
		}
		@media screen and (max-width: 743px) {
			margin-top: 4rem;
			padding: 4rem 2rem 2rem;
			border-radius: 2rem;
			box-shadow: 0 .3rem .6rem rgba(0,0,0,.16);
			text-align: center;
			font-size: 1.8rem;
			line-height: 2;
			h2 {
				margin-bottom: 2rem;
				font-size: 2.4rem;
			}
			.more {
				margin-top: 2rem;
			}
			.campany_main {
				margin-bottom: 2.5rem;
			}
			.campany_ph {
				img {
					border-radius: 2rem;
				}
			}
		}
	}
}


/* ============================================================================

	仕事を知る

============================================================================= */
.business_contents {
	@media screen and (min-width: 744px), print {
		margin-bottom: 18rem;
	}
}
.business_section {
	&:not(:last-child) {
		margin-bottom: 8rem;
		@media screen and (max-width: 743px) {
			margin-bottom: 4rem;
		}
	}
	.contents {
		font-size: 1.6rem;
		line-height: calc(40 / 16);
		.ph img {
			border-radius: 4rem;
		}
		.lead {
			margin-bottom: 2rem;
			font-size: 2.6rem;
			line-height: calc(48 / 26);
			font-weight: var(--font-weight-bold);
		}
		.link {
			margin-top: 6rem;
			li:not(:last-child) {
				margin-bottom: 2rem;
			}
		}
		@media screen and (min-width: 744px), print {
			display: flex;
			gap: 1rem;
			background: linear-gradient(to bottom, var(--bg-gray2) 0%, #fff 100%);
			border-radius: 4rem;
			.ph {
				flex-shrink: 0;
				width: 54rem;
			}
			.txt {
				flex-grow: 1;
				padding: 5rem;
			}
		}
		@media screen and (max-width: 743px) {
			line-height: 2;
			.ph img {
				border-radius: 2rem;
			}
			.lead {
				margin-bottom: 0;
				padding: 2rem;
				font-size: 2rem;
				line-height: 1.5;
			}
			.summary {
				position: relative;
				padding: 0 2rem 2rem;
				&::before {
					content: "";
					position: absolute;
					right: 0;
					left: 0;
					bottom: 0;
					height: 11.6rem;
					background: linear-gradient(to top, var(--bg-gray2) 0%, #fff 100%);
					border-radius: 2rem;
					z-index: -1;
				}
			}
			.link {
				margin-top: 3rem;
			}
		}
	}
	@media screen and (min-width: 744px), print {
		&:nth-child(2n + 1) {
			.contents {
				flex-direction: row-reverse;
			}
		}
	}
}


/* ============================================================================

	職種を知る

============================================================================= */
.job_main {
	position: relative;
	margin-bottom: 12rem;
	padding: 6rem 0;
	background: linear-gradient(to bottom, var(--color-blue) 0%, var(--color-green) 100%);
	border-radius: 4rem;
	text-align: center;
	font-size: 2.8rem;
	line-height: 1.5;
	font-weight: var(--font-weight-bold);
	z-index: 1;
	&::before {
		content: "";
		position: absolute;
		inset: .8rem;
		background-color: #fff;
		border-radius: 3.4rem;
		z-index: -1;
	}
	p {
		letter-spacing: 0.1em;
	}
	.lead {
		margin-bottom: 2rem;
		font-size: 6rem;
		line-height: 1.2;
		background: linear-gradient(to left, var(--color-blue) 0%, var(--color-green) 100%);
		-webkit-background-clip: text;
		background-clip: text;
		color: transparent;
	}
	@media screen and (max-width: 743px) {
		margin-bottom: 4rem;
		padding: 3rem 0;
		border-radius: 2rem;
		font-size: 2rem;
		line-height: 1.7;
		&::before {
			inset: .4rem;
			border-radius: 1.6rem;
		}
		.lead {
			margin-bottom: 1.5rem;
			font-size: 3.2rem;
		}
	}
}
.page_bg:has(.job_main) {
	@media screen and (max-width: 743px) {
		padding-top: 4rem;
	}
}

.job_contents {
	padding-bottom: 10rem;
	@media screen and (max-width: 743px) {
		padding-bottom: 5rem;
	}
}
.job_section {
	&:not(:last-child) {
		margin-bottom: 18rem;
		@media screen and (max-width: 743px) {
			margin-bottom: 5rem;
		}
	}
	.main {
		margin-bottom: 11rem;
		font-size: 1.6rem;
		line-height: calc(40 / 16);
		.ph img {
			border-radius: 4rem;
		}
		.lead {
			margin-bottom: 2rem;
			font-size: 2.6rem;
			line-height: calc(48 / 26);
			font-weight: var(--font-weight-bold);
		}
		@media screen and (min-width: 744px), print {
			display: flex;
			flex-direction: row-reverse;
			gap: 1rem;
			background: linear-gradient(to bottom, var(--bg-gray2) 0%, #fff 100%);
			border-radius: 4rem;
			.ph {
				flex-shrink: 0;
				width: 54rem;
			}
			.txt {
				flex-grow: 1;
				padding: 5rem;
			}
		}
		@media screen and (max-width: 743px) {
			margin-bottom: 5rem;
			line-height: 2;
			.ph img {
				border-radius: 2rem;
			}
			.lead {
				margin-bottom: 0;
				padding: 2rem;
				font-size: 2rem;
				line-height: 1.5;
			}
			.summary {
				position: relative;
				padding: 0 2rem 2rem;
				&::before {
					content: "";
					position: absolute;
					right: 0;
					left: 0;
					bottom: 0;
					height: 11.6rem;
					background: linear-gradient(to top, var(--bg-gray2) 0%, #fff 100%);
					border-radius: 2rem;
					z-index: -1;
				}
			}
		}
	}
	.business {
		position: relative;
		border-radius: 4rem;
		padding: 8rem 0 4rem;
		box-shadow: 0 .3rem 1rem rgba(0,0,0,.16);
		@media screen and (min-width: 744px), print {
			width: 85rem;
			margin-inline: auto;
		}
		@media screen and (max-width: 743px) {
			display: flex;
			justify-content: center;
			border-radius: 2rem;
			padding: 5rem 0 3rem;
			&::before {
				content: "";
				position: absolute;
				top: 3.4rem;
				right: 2rem;
				left: 2rem;
				bottom: 2rem;
				background-color: var(--bg-gray2);
				border-radius: 2rem;
				z-index: -1;
			}
		}
		h3 {
			position: absolute;
			right: 0;
			left: 0;
			top: -3rem;
			display: flex;
			justify-content: center;
			align-items: center;
			width: 51rem;
			height: 6rem;
			margin-inline: auto;
			background-color: #ebf0f0;
			border-radius: 3rem;
			font-size: 2.4rem;
			line-height: 1.5;
			@media screen and (max-width: 743px) {
				top: calc(-4.5rem / 2);
				width: 25.5rem;
				height: 4.5rem;
				font-size: 1.8rem;
			}
		}
		ol {
			font-size: 2rem;
			line-height: 1.5;
			font-weight: var(--font-weight-bold);
			@media screen and (min-width: 744px), print {
				display: flex;
				justify-content: center;
				text-align: center;
			}
			@media screen and (max-width: 743px) {
				font-size: 1.8rem;
				line-height: calc(28 / 18);
			}
			li {
				position: relative;
				@media screen and (min-width: 744px), print {
					display: flex;
					justify-content: center;
					align-items: center;
					width: 18rem;
					height: 14rem;
					&::before {
						content: "";
						position: absolute;
						inset: 0;
						margin: auto;
						width: 10rem;
						height: 15.8rem;
						background-color: #F5F5F5;
						border-radius: 10rem;
						transform: rotate(45deg);
						z-index: -1;
					}
				}
				@media screen and (max-width: 743px) {
					height: 7.5rem;
					padding-left: 6rem;
					.txt {
						display: flex;
						align-items: center;
						min-height: 4rem;
					}
				}
				.num {
					position: absolute;
					@media screen and (min-width: 744px), print {
						top: -1.2rem;
						right: 0;
						left: 0;
						margin-inline: auto;
						width: 3rem;
					}
					@media screen and (max-width: 743px) {
						left: 0;
						top: 0;
						width: 2.4rem;
						&::before {
							content: "";
							position: absolute;
							left: -0.8rem;
							top: .6rem;
							width: 4rem;
							height: 6rem;
							background-color: #ebf0f0;
							border-radius: 10rem;
							transform: rotate(45deg);
							z-index: -1;
						}
					}
				}
			}
		}
	}
	.staff {
		margin-top: 8rem;
		@media screen and (min-width: 744px), print {
			margin-inline: -10rem;
		}
		h3 {
			margin-bottom: 5rem;
			text-align: center;
			font-size: 2.6rem;
			line-height: 1.5;
			@media screen and (max-width: 743px) {
				margin-bottom: 0;
				font-size: 1.8rem;
				line-height: 2;
			}
		}
	}
}

/* ============================================================================

	社員を知る Voice

============================================================================= */
.interview_page {
	padding-top: 16rem;
	@media screen and (max-width: 743px) {
		padding-top: 2rem;
	}
}
.interview_header {
	position: relative;
	@media screen and (min-width: 744px), print {
		height: 73.4rem;
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding-inline: calc((100% - var(--base-width)) / 2);
		&::before {
			content: "";
			position: absolute;
			top: -16rem;
			left: 0;
			right: 0;
			height: 130rem;
			background: url(../img/interview_bg_main.png) no-repeat 50% 0;
			background-size: auto 100%;
			z-index: -1;
		}
		.main_ph {
			position: absolute;
			right: 0;
			top: 0;
			bottom: 0;
			width: calc(50% + 29.4rem);
			overflow: hidden;
			border-radius: 73.4rem 0 0 73.4rem;
			z-index: -1;
			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}
		}
	}
	@media screen and (max-width: 743px) {
		padding-inline: var(--sp-base-padding);
		&::before {
			content: "";
			position: absolute;
			left: 0;
			right: 0;
			bottom: -5rem;
			height: 24rem;
			background: url(../img/interview_bg_main_sp.png) no-repeat 50%;
			background-size: 100%;
			z-index: -1;
		}
		.main_ph {
			position: relative;
			height: 32rem;
			margin-right: calc(var(--sp-base-padding) * -1);
			margin-bottom: 2.5rem;
			img {
				width: 100%;
				height: 100%;
				border-radius: 16rem 0 0 16rem;
				object-fit: cover;
			}
			&::after {
				content: "";
				position: absolute;
				right: 0;
				bottom: -6rem;
				width: 6.2rem;
				height: 10rem;
				background: url(../img/interview_bg_main_sp2.png) no-repeat 50%;
				background-size: 100%;
				z-index: 2;
			}
		}
	}
	.number {
		position: relative;
		margin-top: 5rem;
		margin-bottom: 3rem;
		font-size: 7rem;
		line-height: 1.1;
		color: var(--color-theme);
		letter-spacing: 0.1em;
		@media screen and (max-width: 743px) {
			width: fit-content;
			margin-top: 0;
			margin-bottom: -3rem;
			padding: 1rem 1.5rem 0.6rem 0;
			background-color: #fff;
			border-bottom-right-radius: 2rem;
			font-size: 3rem;
			z-index: 2;
		}
	}
	h1 {
		font-size: 5.6rem;
		line-height: calc(84 / 56);
		color: var(--color-black);
		@media screen and (max-width: 743px) {
			font-size: 2.4rem;
			line-height: calc(36 / 24);
		}
	}
	.info {
		width: fit-content;
		display: flex;
		margin-top: 5rem;
		padding: 0.6rem 2rem 0.8rem;
		background-color: #8a8a8a;
		border-radius: 10rem;
		color: #fff;
		font-weight: 700;
		font-size: 1.6rem;
		line-height: 1.5;
		li + li::before {
			content: "｜";
		}
		@media screen and (max-width: 743px) {
			margin-top: 2rem;
			font-size: 1.2rem;
		}
	}
}
.interview_contents {
	position: relative;
	padding: 9rem calc((100% - var(--base-width)) / 2);
	line-height: calc(50 / 18);
	@media screen and (min-width: 744px), print {
		&::before {
			content: "";
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: -10rem;
			background: url(../img/interview_bg.png) repeat-y 50% 0;
			background-size: 260rem;
			z-index: -1;
		}
	}
	@media screen and (max-width: 743px) {
		padding: 5rem var(--sp-base-padding);
		font-size: 1.8rem;
		line-height: 2;
	}

	.interview {
		&:not(:last-child) {
			margin-bottom: 8rem;
			@media screen and (max-width: 743px) {
				margin-bottom: 4rem;
			}
		}
		h2 {
			position: relative;
			margin-bottom: 4rem;
			padding-left: 5rem;
			font-weight: var(--font-weight-bold);
			font-size: 3.2rem;
			line-height: calc(55 / 32);
			@media screen and (max-width: 743px) {
				margin-bottom: 2rem;
				padding-left: 4.4rem;
				font-size: 2rem;
				line-height: 1.5;
			}
			&:not(:first-child):not(.ph + h2) {
				margin-top: 6rem;
				@media screen and (max-width: 743px) {
					margin-top: 4rem;
				}
			}
			&::before {
				content: "";
				position: absolute;
				left: 1rem;
				top: 0.5lh;
				width: 1.4rem;
				height: 3.2rem;
				background: linear-gradient(135deg, var(--color-blue) 20%, var(--color-green) 70%);
				border-radius: 10rem;
				transform: translateY(-50%) rotate(45deg);
			}
		}
		.ph {
			img {
				border-radius: 4rem;
			}
		}
		@media screen and (min-width: 744px), print {
			display: flow-root;
			.ph {
				width: 48rem;
				&.-wide {
					width: 54rem;
				}
			}
			&.-ph-right {
				.ph {
					float: right;
					margin-right: -9rem;
					& ~ * {
						margin-right: 48rem;
					}
					&.-wide ~ * {
						margin-right: 54rem;
					}
				}
			}
			&.-ph-left {
				.ph {
					float: left;
					margin-left: -9rem;
					& ~ * {
						margin-left: 48rem;
					}
					&.-wide ~ * {
						margin-left: 54rem;
					}
				}
			}
		}
		@media screen and (max-width: 743px) {
			.ph {
				margin-bottom: 4rem;
			}
		}
	}
	.message {
		max-width: 114rem;
		margin-inline: auto;
		margin-top: 8rem;
		@media screen and (max-width: 743px) {
			margin-top: 4rem;
		}
		.ph {
			margin-bottom: 4rem;
			img {
				border-radius: 4rem;
			}
			@media screen and (max-width: 743px) {
				margin-bottom: 2rem;
				img {
					border-radius: 2rem;
				}
			}
		}
	}
}

.interview_schedule {
	position: relative;
	overflow: hidden;
	margin-bottom: 13rem;
	background: var(--bg-gray) url(../img/interview_schedule_bg.png) no-repeat 50% 0;
	background-size: 200rem;
	padding: 10rem calc((100% - var(--base-width-l)) / 2);
	border-radius: 10rem;
	z-index: 3;
	@media screen and (min-width: 744px), print {
		min-height: 93rem;
	}
	@media screen and (max-width: 743px) {
		margin-bottom: 4rem;
		background-image: url(../img/interview_schedule_bg_sp.png), url(../img/interview_schedule_bg_sp2.png);
		background-repeat: no-repeat;
		background-position: 0 0, 0 100%;
		background-size: 100%;
		padding: 4rem var(--sp-base-padding) 2.5rem;
		border-radius: 4rem;
	}
	.en_title {
		.en {
			color: var(--color-black);
			&::before {
				background-color: var(--color-black);
			}
		}
	}
	.schedule {
		position: relative;
		margin-top: 3rem;
		font-size: 1.6rem;
		line-height: calc(36 / 16);
		@media screen and (min-width: 744px), print {
			width: 55rem;
			margin-left: 15rem;
		}
		@media screen and (max-width: 743px) {
		}
		li {
			position: relative;
			padding-left: 23rem;
			@media screen and (max-width: 743px) {
				padding-left: 16rem;
			}
			&::before {
				content: "";
				position: absolute;
				top: calc(.5lh - 1.1rem);
				left: 0;
				width: 2.2rem;
				height: 2.2rem;
				background-color: var(--color-black);
				border-radius: 100%;
			}
			&:not(:last-child) {
				padding-bottom: 2rem;
				&::after {
					content: "";
					position: absolute;
					top: 1rem;
					left: calc(2.2rem / 2 - .1rem);
					bottom: -1rem;
					border-left: 2px solid var(--color-black);
				}
			}
			.time {
				position: absolute;
				left: 3.8rem;
				font-size: 2.4rem;
				font-weight: var(--font-weight-bold);
				line-height: 1.4;
				@media screen and (max-width: 743px) {
					font-size: 2rem;
					line-height: 1.8;
				}
			}
		}
	}
	.ph {
		--width: 54rem;
		position: relative;
		width: var(--width);
		z-index: 2;
		img {
			width: 100%;
			border-radius: 0 0 calc(var(--width) / 2) calc(var(--width) / 2);

		}
		&::before {
			content: "";
			position: absolute;
			left: 0;
			bottom: 0;
			width: 100%;
			height: 67.4rem;
			background: linear-gradient(135deg, var(--color-blue) 20%, var(--color-green) 70%);
			border-radius: calc(var(--width) / 2);
			transform: translate(9%, 3%) rotate(45deg);
			z-index: -1;
		}
		@media screen and (min-width: 744px), print {
			position: absolute;
			top: 8rem;
			left: calc(50% + 6.8rem);
		}
		@media screen and (max-width: 743px) {
			--width: 27rem;
			margin: 2rem auto 0;
			left: -2rem;
			&::before {
				height: calc(67.4rem / 2);
			}
		}
	}
}
.voice_other {
	margin-top: 6rem;
	@media screen and (max-width: 743px) {
		margin-top: 0;
	}
}
.crosstalk_bnr {
	margin-top: 6rem;
	ul {
		display: flex;
		gap: 6rem;
		@media screen and (min-width: 744px), print {
			width: 112rem;
			margin-inline: auto;
			li {
				width: 100%;
			}
		}
		@media screen and (max-width: 743px) {
			flex-direction: column;
			gap: 2rem;
		}
		a {
			display: block;
			overflow: hidden;
			border-radius: 3rem;
			text-decoration: none;
			color: var(--color-black);
			box-shadow: 0 .3rem .6rem rgba(0,0,0,.16);
			.title {
				position: relative;
				display: flex;
				align-items: center;
				height: 13rem;
				padding-left: 4rem;
				font-weight: var(--font-weight-bold);
				font-size: 2.1rem;
				&::after {
					content: "";
					position: absolute;
					top: calc(50% - 1.6rem / 2);
					right: 3.8rem;
					width: 1.6rem;
					height: 1.6rem;
					background: url(../img/ico-arrow.svg) no-repeat 50%;
					background-size: 100%;
					filter: brightness(0);
				}
				@media screen and (max-width: 743px) {
					height: 7.5rem;
				}
			}
		}
	}
}

/* ============================================================================

	社員を知る 座談会

============================================================================= */
.crosstalk_page {
	padding-top: 16rem;
	@media screen and (max-width: 743px) {
		padding-top: 0;
	}
}
.crosstalk_header {
	position: relative;
	font-size: 2.4rem;
	line-height: 1.5;
	font-weight: var(--font-weight-medium);
	color: #8a8a8a;
	@media screen and (min-width: 744px), print {
		height: 59rem;
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding-inline: calc((100% - var(--base-width-l)) / 2);
		&::before {
			content: "";
			position: absolute;
			top: -16rem;
			left: 0;
			right: 0;
			height: 126rem;
			background: url(../img/crosstalk_bg_main.png) no-repeat 50% 0;
			background-size: auto 100%;
			z-index: -1;
		}
		.main_ph {
			position: absolute;
			right: 0;
			top: 0;
			bottom: 0;
			width: calc(50% + 7rem);
			overflow: hidden;
			border-radius: 4rem 0 0 4rem;
			z-index: -1;
			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}
		}
	}
	@media screen and (max-width: 743px) {
		padding-inline: var(--sp-base-padding);
		font-size: 1.6rem;
		line-height: calc(28 / 16);
		&::before {
			content: "";
			position: absolute;
			left: 0;
			right: 0;
			top: 22rem;
			height: 63rem;
			background: url(../img/crosstalk_bg_main_sp.png) no-repeat 50%;
			background-size: 100%;
			z-index: -1;
		}
		.main_ph {
			position: relative;
			height: 27rem;
			margin-inline: calc(var(--sp-base-padding) * -1);
			margin-bottom: -2.5rem;
			z-index: -1;
			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				border-radius: 0 0 50% 50% / 0 0 8rem 8rem;
			}
		}
	}
	.title {
		margin-block: 1rem 3rem;
		font-size: 3.6rem;
		font-weight: var(--font-weight-bold);
		color: var(--color-theme);
		@media screen and (max-width: 743px) {
			margin-bottom: 2rem;
			font-size: 2.4rem;
		}
	}
	h1 {
		font-size: 5.6rem;
		line-height: calc(84 / 56);
		color: var(--color-black);
		@media screen and (max-width: 743px) {
			font-size: 2.4rem;
			line-height: calc(36 / 24);
		}
		& + p {
			margin-top: 2rem;
		}
	}
}
.crosstalk_contents {
	position: relative;
	padding: 9rem calc((100% - 114rem) / 2);
	line-height: calc(50 / 18);
	@media screen and (min-width: 744px), print {
		&::before {
			content: "";
			position: absolute;
			top: 41rem;
			left: 0;
			right: 0;
			bottom: 0;
			background: url(../img/crosstalk_bg.png) repeat-y 50% 0;
			background-size: 304rem;
			z-index: -1;
		}
	}
	@media screen and (max-width: 743px) {
		padding: 5rem var(--sp-base-padding);
		font-size: 1.8rem;
		line-height: 2;
	}

	.member {
		margin-bottom: 15rem;
		font-size: 1.8rem;
		font-weight: var(--font-weight-medium);
		line-height: 1.4;
		text-align: center;
		h2 {
			margin-bottom: 5rem;
			text-align: center;
			color: var(--color-black);
			font-size: 4rem;
			line-height: 1.3;
		}
		img {
			width: 17.5rem;
			height: 17.5rem;
			border-radius: 100%;
			object-fit: cover;
		}
		.name {
			display: block;
			font-size: 2.8rem;
		}
		@media screen and (min-width: 744px), print {
			.list {
				display: flex;
				justify-content: center;
				gap: 4rem;
				li {
					width: 24rem;
				}
				.person {
					display: block;
					margin-top: 2rem;
				}
			}
		}
		@media screen and (max-width: 743px) {
			margin-bottom: 7.5rem;
			font-size: 1.6rem;
			h2 {
				margin-bottom: 2rem;
				font-size: 3rem;
			}
			.list {
				padding-left: 2rem;
				li {
					display: flex;
					justify-content: center;
					align-items: center;
					margin-bottom: 3rem;
				}
				img {
					width: 10rem;
					height: 10rem;
				}
				.person {
					width: 14rem;
				}
			}
		}
	}
	.crosstalk {
		margin-bottom: 8rem;
		font-size: 1.8rem;
		line-height: calc(50 / 18);
		@media screen and (max-width: 743px) {
			line-height: 2;
		}
		.gradient_title::before {
			content: "";
			display: inline-block;
			width: 4.2rem;
			height: 3.6rem;
			vertical-align: -.5rem;
			margin-right: 1rem;
			background: url(../img/ico-q.svg) no-repeat 50%;
			background-size: 100%;
		}
		@media screen and (max-width: 743px) {
			.gradient_title {
				position: relative;
				padding-block: 2.2rem 1.5rem;
				font-size: 1.8rem;
				&::before {
					position: absolute;
					top: -2.2rem;
					left: calc(50% - 2.2rem + 1.4rem);
					width: 2.4rem;
					height: 4.4rem;
					margin: 0;
				}
				&::after {
					content: "";
					position: absolute;
					top: -2.2rem;
					left: calc(50% - 2.2rem);
					width: 4.4rem;
					height: 4.4rem;;
					background: linear-gradient(to right, var(--color-green) -500%, var(--color-blue) 500%);
					border-radius: 100%;
					z-index: -1;
				}
			}
		}
		.ph {
			img {
				border-radius: 4rem;
				@media screen and (max-width: 743px) {
					border-radius: 2rem;
				}
			}
		}
		.comment {
			margin-top: 6rem;
			@media screen and (max-width: 743px) {
				margin-top: 3rem;
			}
			.person {
				width: 17.5rem;
				text-align: center;
				font-size: 2.6rem;
				img {
					width: 17.5rem;
					height: 17.5rem;
					border-radius: 100%;
					object-fit: cover;
					transition: filter .5s;
					will-change: filter;
				}
				@media screen and (max-width: 743px) {
					width: auto;
					display: flex;
					justify-content: center;
					align-items: center;
					gap: 2rem;
					margin-bottom: 3rem;
					img {
						width: 10rem;
						height: 10rem;
					}
				}
			}
			.box {
				position: relative;
				padding: 3.5rem 5rem;
				background-color: #fff;
				border-radius: 4rem;
				filter: drop-shadow(0 0 .6rem rgba(0,0,0,.16));
				transition: filter .5s;
				will-change: filter;
				&::before {
					content: "";
					position: absolute;
					top: 8rem;
					left: -4rem;
					width: 6.8rem;
					height: 5rem;
					background: url(../img/point-fukidashi.svg) no-repeat 50%;
					background-size: 100%;
					z-index: -1;
				}
				@media screen and (max-width: 743px) {
					padding: 3rem 2rem;
					border-radius: 2rem;
					&::before {
						top: -2rem;
						left: calc(50% + 2rem);
						transform: scaleX(-1) rotate(105deg);
					}
				}
			}
			@media screen and (min-width: 744px), print {
				display: flex;
				align-items: start;
				gap: 7rem;
				.person {
					flex-shrink: 0;
				}
				.box {
					min-height: 17.5rem;
					display: flex;
					align-items: center;
					flex-grow: 1;
				}
			}
			&.is-active {
				.person img {
					filter: drop-shadow(0 0 1rem var(--color-theme));
				}
				.box {
					filter: drop-shadow(0 0 1rem var(--color-theme));
				}
			}
		}
	}
	.other_crosstalk {
		padding: 6rem;
		border-radius: 3rem;
		box-shadow: 0 .3rem .6rem rgba(0,0,0,.16);
		@media screen and (min-width: 744px), print {
			display: flex;
			align-items: center;
			margin-top: 4rem;
			margin-inline: calc((114rem - 140rem) / 2);
			.ph {
				width: 64rem;
				flex-shrink: 0;
				margin-left: auto;
				img {
					border-radius: 3rem;
				}
			}
		}
		@media screen and (max-width: 743px) {
			padding: 4rem 2rem 2rem;
			.ph {
				img {
					border-radius: 2rem;
				}
			}
		}
		h2 {
			font-size: 3rem;
			line-height: 1.5;
			margin-bottom: 2rem;
			@media screen and (max-width: 743px) {
				font-size: 2.4rem;
				text-align: center;
			}
		}
		dl {
			font-weight: var(--font-weight-medium);
			font-size: 1.6rem;
			dt {
				font-size: 2.4rem;
				margin-bottom: 1rem;
				@media screen and (max-width: 743px) {
					font-size: 1.8rem;
					text-align: center;
				}
			}
		}
		.more {
			margin-top: 4rem;
			@media screen and (max-width: 743px) {
				margin-top: 2rem;
				margin-bottom: 3rem;
			}
		}
	}
}


/* ============================================================================

	働き方を知る

============================================================================= */
.workstyle_lead {
	padding-block: 4rem 18rem;
	text-align: center;
	font-weight: var(--font-weight-bold);
	font-size: 3.8rem;
	line-height: 2;
	strong {
		position: relative;
		display: inline-block;
		margin-inline: .2em .1em;
		padding-bottom: 1rem;
		line-height: 1.2;
		background: linear-gradient(to right, var(--color-blue) 0%, var(--color-green) 100%);
		-webkit-background-clip: text;
		background-clip: text;
		color: transparent;
		font-size: 140%;
		letter-spacing: 0.08em;
		font-weight: 600;
		&::after {
			content: "";
			position: absolute;
			right: 0;
			bottom: 0;
			left: 0;
			height: 0.6rem;
			border-radius: 0.3rem;
			background: linear-gradient(to right, var(--color-blue) 0%, var(--color-green) 100%);
		}
	}
	@media screen and (max-width: 743px) {
		padding-block: 4rem;
		font-weight: var(--font-weight-bold);
		font-size: 2rem;
		line-height: 1.7;
		strong {
			margin-block: .5rem .7rem;
			padding-bottom: 0.8rem;
			font-size: 110%;
			&::after {
				height: 0.3rem;
			}
		}
		span {
			font-size: 1.5rem;
		}
	}
}
.workstyle_section {
	position: relative;
	padding: 28rem 5rem 7rem;
	border-radius: 4rem;
	background: linear-gradient(to bottom, var(--bg-gray2) 0%, #fff 100%);
	border: .4rem solid var(--bg-gray);
	@media screen and (max-width: 743px) {
		padding: 3rem 2rem 4rem;
		margin-top: 18.3rem;
	}
	&:not(:last-child) {
		margin-bottom: 17rem;
		@media screen and (max-width: 743px) {
			margin-bottom: 23rem;
		}
	}
	h2 {
		position: absolute;
		top: -6.6rem;
		left: 6.6rem;
		display: flex;
		justify-content: center;
		align-items: center;
		text-align: center;
		width: 28.4rem;
		aspect-ratio: 1;
		background: linear-gradient(to bottom, var(--color-blue) 0%, var(--color-green) 100%);
		border-radius: 100%;
		color: #fff;
		font-size: 3.2rem;
		line-height: calc(55 / 32);
		@media screen and (max-width: 743px) {
			left: 0;
			right: 0;
			top: -18.3rem;
			width: 15.4rem;
			margin-inline: auto;
			font-size: 1.7rem;
			line-height: calc(29 / 17);
		}
	}
	section {
		font-size: 1.6rem;
		line-height: calc(40 / 16);
		@media screen and (max-width: 743px) {
			&:not(:last-child) {
				margin-bottom: 3rem;
			}
		}
		h3 {
			margin-bottom: 2rem;
			text-align: center;
			font-size: 2.6rem;
			line-height: 1.5;
			@media screen and (max-width: 743px) {
				font-size: 2.2rem;
			}
		}
		.img {
			position: relative;
			width: 27.2rem;
			margin-inline: auto;
			margin-block: 3rem 2rem;
			z-index: 1;
			.shadow {
				position: absolute;
				inset: 0;
				background: linear-gradient(to bottom, var(--color-blue) 0%, var(--color-green) 100%);
				transform: translate(1rem, 1rem);
				z-index: -1;
			}
		}
	}
	@media screen and (min-width: 744px), print {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		gap: 10rem 0;
		background-repeat: no-repeat;
		background-position: 50% 0;
		background-size: 120rem;
		&:nth-child(1) {
			background-image: url(../img/workstyle/bg01.png);
		}
		&:nth-child(2) {
			background-image: url(../img/workstyle/bg02.png);
		}
		section {
			width: 32rem;
			&:nth-child(3n) {
				transform: translateY(-10rem);
			}
			&:nth-child(3n + 1) {
				transform: translateY(-20rem);
			}
		}
	}
	@media screen and (max-width: 743px) {
		background-repeat: repeat-y;
		background-position: 50% 0;
		background-size: 33.5rem;
		&:nth-child(1) {
			background-image: url(../img/workstyle/bg01_sp.png);
		}
		&:nth-child(2) {
			background-image: url(../img/workstyle/bg02_sp.png);
		}
	}
}



/* ============================================================================

	エントリー

============================================================================= */
.entry_contents {
	padding-bottom: 5rem;
}
.entry_section {
	&:not(:last-child) {
		margin-bottom: 8rem;
		@media screen and (max-width: 743px) {
			margin-bottom: 5rem;
		}
	}
	@media screen and (min-width: 744px), print {
		padding-inline: 3rem;
	}
	& > section {
		margin-top: 6rem;
		@media screen and (max-width: 743px) {
			margin-top: 3rem;
		}
	}
	.process {
		ol {
			display: flex;
			flex-direction: column;
			gap: 4rem;
			@media screen and (max-width: 743px) {
				gap: 2rem;
			}
			li {
				position: relative;
				display: flex;
				align-items: center;
				justify-content: center;
				min-height: 8rem;
				border: .4rem solid #ebf0f0;
				border-radius: 10rem;
				font-size: 3.2rem;
				line-height: 1.5;
				font-weight: var(--font-weight-bold);
				color: var(--color-theme);
				&:last-child {
					background-color: #ebf0f0;
				}
				.num {
					position: absolute;
					top: 0;
					bottom: 0;
					left: 3rem;
					display: flex;
					align-items: center;
					font-size: 4.6rem;
					padding-top: 0.4rem;
				}
				.gray {
					color: #8A8A8A;
				}
				@media screen and (max-width: 743px) {
					align-items: start;
					flex-direction: column;
					padding: 1.5rem 0 1.5rem 7rem;
					border-width: .2rem;
					font-size: 1.8rem;
					line-height: calc(24 / 18);
					.num {
						left: 2rem;
						font-size: 2.6rem;
						padding-top: 0.2rem;
					}
				}
			}
		}
	}
	.recruitment {
		.box {
			position: relative;
			padding: 6.4rem;
			background-color: #fff;
			text-align: center;
			font-size: 2rem;
			line-height: 2;
			font-weight: var(--font-weight-bold);
			z-index: 1;
			@media screen and (min-width: 744px), print {
				border-radius: 4rem;
				border: .4rem solid #ebf0f0;
			}
			@media screen and (max-width: 743px) {
				padding: 4rem;
				border-radius: 2rem;
				box-shadow: 0 .3rem .6rem rgba(0,0,0,.16);
				text-align: left;
				font-size: 1.8rem;
				line-height: calc(28 / 18);
				font-weight: var(--font-weight-medium);
			}
			&::before {
				content: "";
				position: absolute;
				inset: 2.6rem 3rem;
				background-color: var(--bg-gray2);
				border-radius: 3rem;
				z-index: -1;
				@media screen and (max-width: 743px) {
					inset: 2rem;
					border-radius: 2rem;
				}
			}
			.mynavi {
				margin-top: 3rem;
				@media screen and (max-width: 743px) {
					margin-top: 2rem;
				}
				a {
					height: 9.6rem;
					margin-inline: auto;
					display: flex;
					justify-content: center;
					align-items: center;
					background-color: #fff;
					border: 2px solid #00aaef;
					width: 32rem;
					img {
						width: 28rem;
					}
					@media screen and (max-width: 743px) {
						width: auto;
						height: 8rem;
						img {
							width: 23rem;
						}
					}
				}
			}
			.jobs {
				overflow: hidden;
				position: relative;
				margin: 3rem auto 0;
				border: .3rem solid var(--color-green);
				border-radius: 10rem;
				line-height: 1.6;
				dt {
					position: relative;
					color: #fff;
				}
				@media screen and (min-width: 744px), print {
					display: flex;
					width: 66.8rem;
					dt {
						flex-shrink: 0;
						display: flex;
						justify-content: center;
						align-items: center;
						width: 15rem;
						min-height: 6rem;
						&::before {
							content: "";
							position: absolute;
							right: 0;
							top: 0;
							bottom: 0;
							left: -10rem;
							background-color: var(--color-green);
							transform: skewX(-20deg);
							z-index: -1;
						}
					}
					dd {
						flex-grow: 1;
						display: flex;
						justify-content: center;
						align-items: center;
						padding: 1rem 6rem 1rem 3rem;
					}
				}
				@media screen and (max-width: 743px) {
					margin-top: 2rem;
					border-radius: 2rem;
					font-weight: var(--font-weight-bold);
					text-align: center;
					font-size: 2rem;
					dt {
						padding: 1rem;
						background-color: var(--color-green);
					}
					dd {
						padding: 1rem;
					}
				}
			}
			.notes {
				margin-top: 1rem;
				font-size: 1.6rem;
				@media screen and (max-width: 743px) {
					padding-left: 1em;
					text-indent: -1em;
				}
			}
			.contact {
				margin-top: 3rem;
				@media screen and (max-width: 743px) {
					margin-top: 2rem;
				}
			}
		}
	}
}