@charset "UTF-8";
/**
 *
 * page-recruit.scss
 *
 */
/* ------------------------------------------------------------
 recruit-page
------------------------------------------------------------ */
.recruit-page {
	--color-bg: var( --color-brand-cream );
	--color-header-bg: var( --color-white );
	--recruit-card-gap: 4rem ;
}

@media screen and (min-width: 1024px) {
	.recruit-page {
		--recruit-inner: 130rem ;
		--recruit-gutter: 10rem ;
		--recruit-card-padding: 2.6rem ;
		--recruit-row-padding: 2.7rem ;
		--recruit-label-width: 10.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-page {
		--recruit-inner: 64rem ;
		--recruit-gutter: 4rem ;
		--recruit-gutter: 10vw;
		--recruit-card-padding: 1rem ;
		--recruit-row-padding: 1.2rem ;
		--recruit-label-width: 6.15rem ;
	}
}

/* 写真の枠とトリミングは支給aiのPC／SPそれぞれの座標を使用する。 */
.recruit-hero__photos {
	position: absolute;
	inset: 0;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photos {
		max-width: 192rem ;
	}
}

.recruit-hero__photo {
	position: absolute;
	overflow: hidden;
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photo {
		border-radius: 1.6rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-hero__photo {
		border-radius: 0.8rem ;
	}
}

.recruit-hero__photo img {
	position: absolute;
	max-width: none;
	height: auto;
}

@media (prefers-reduced-motion: no-preference) {
	.recruit-hero__photo.is-waiting {
		opacity: 0;
	}
}

@media (prefers-reduced-motion: no-preference) {
	.recruit-hero__photo.is-revealing {
		--recruit-photo-offset-y: 1.2rem ;
		-webkit-animation: recruit-photo-in .85s both;
		animation: recruit-photo-in .85s both;
		-webkit-animation-delay: var(--recruit-delay, 0ms);
		animation-delay: var(--recruit-delay, 0ms);
	}
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photo.-fish {
		top: 3.37071rem ;
		left: -5.176073%;
		width: 26.666667%;
		height: 46rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-hero__photo.-fish {
		top: -4.7729rem ;
		left: -7.548425%;
		width: 50.000000%;
		height: 23rem ;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photo.-fish img {
		top: -6.008108%;
		left: -69.962945%;
		width: 197.212887%;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-hero__photo.-fish img {
		top: -6.008105%;
		left: -69.962937%;
		width: 197.212887%;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photo.-boxes {
		top: 15.38485rem ;
		left: 32.252040%;
		width: 11.733333%;
		height: 14.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-hero__photo.-boxes {
		top: 22.56763rem ;
		left: 14.287575%;
		width: 22.000000%;
		height: 7.1rem ;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photo.-boxes img {
		top: -13.461683%;
		left: -16.455036%;
		width: 142.281844%;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-hero__photo.-boxes img {
		top: -13.461713%;
		left: -16.454999%;
		width: 142.281844%;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photo.-team {
		top: 3.29922rem ;
		left: 52.537953%;
		width: 20.800000%;
		height: 25rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-hero__photo.-team {
		top: 15.94609rem ;
		left: 53.254762%;
		width: 39.000000%;
		height: 12.5rem ;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photo.-team img {
		top: -69.779926%;
		left: -97.810660%;
		width: 310.082775%;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-hero__photo.-team img {
		top: -69.779933%;
		left: -97.810653%;
		width: 310.082775%;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photo.-product {
		top: 19.96989rem ;
		left: 75.527033%;
		width: 28.000000%;
		height: 32rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-hero__photo.-product {
		top: -0.02381rem ;
		left: 57.500000%;
		width: 42.500000%;
		height: 13rem ;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photo.-product img {
		top: -42.123275%;
		left: -64.630106%;
		width: 221.661579%;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-hero__photo.-product img {
		top: -41.785838%;
		left: -64.630102%;
		width: 221.661579%;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photo.-dish {
		top: 55.30409rem ;
		left: 5.042600%;
		width: 15.333333%;
		height: 18rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-hero__photo.-dish {
		top: 38.46012rem ;
		left: 71.250000%;
		width: 28.750000%;
		height: 9rem ;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photo.-dish img {
		top: -5.709894%;
		left: -39.137684%;
		width: 145.946147%;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-hero__photo.-dish img {
		top: -5.709877%;
		left: -39.137665%;
		width: 145.946147%;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photo.-people {
		top: 49.51906rem ;
		left: 27.718700%;
		width: 27.200000%;
		height: 57rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-hero__photo.-people {
		top: 44.28123rem ;
		left: -5.295363%;
		width: 56.250000%;
		height: 31.2rem ;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photo.-people img {
		top: -20.282949%;
		left: -6.201597%;
		width: 108.122233%;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-hero__photo.-people img {
		top: -20.339112%;
		left: -5.828111%;
		width: 107.403713%;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photo.-work {
		top: 54.75121rem ;
		left: 66.010093%;
		width: 14.666667%;
		height: 30rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-hero__photo.-work {
		top: 50.16642rem ;
		left: 59.004762%;
		width: 27.500000%;
		height: 15rem ;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-hero__photo.-work img {
		top: -5.459849%;
		left: -107.621411%;
		width: 221.062327%;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-hero__photo.-work img {
		top: -5.459833%;
		left: -107.621411%;
		width: 221.062327%;
	}
}

/* ------------------------------------------------------------
 recruit-flow
------------------------------------------------------------ */
.recruit-flow {
	width: calc(100% - var( --recruit-gutter ) * 2);
	margin-right: auto;
	margin-left: auto;
}

@media screen and (min-width: 1024px) {
	.recruit-flow {
		max-width: var(--recruit-inner);
		padding-top: 14.9rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-flow {
		padding-top: 6.6rem ;
	}
}

/* ------------------------------------------------------------
 recruit-jobs
------------------------------------------------------------ */
.recruit-jobs {
	width: calc(100% - var( --recruit-gutter ) * 2);
	margin-right: auto;
	margin-left: auto;
	display: grid;
	-webkit-column-gap: var(--recruit-card-gap);
	-moz-column-gap: var(--recruit-card-gap);
	column-gap: var(--recruit-card-gap);
}

@media screen and (min-width: 1024px) {
	.recruit-jobs {
		max-width: var(--recruit-inner);
		grid-template-columns: repeat(2, minmax(0, 1fr));
		row-gap: 7.7rem ;
		margin-top: 13.9rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-jobs {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 5.9rem ;
		margin-top: 3.7rem ;
	}
}

.recruit-flow__en {
	font-family: var(--font-sans-serif);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
	font-weight: 400;
	--line-height: 1;
	letter-spacing: 0.06em;
}

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

.recruit-flow__en::before {
	margin-top: var(--font-sans-serif-top);
}

.recruit-flow__en::after {
	margin-bottom: var(--font-sans-serif-bottom);
}

@media screen and (min-width: 1024px) {
	.recruit-flow__en {
		font-size: var(--font-size18);
	}
}

@media screen and (max-width: 1023px) {
	.recruit-flow__en {
		font-size: 1.0888rem ;
	}
}

.recruit-flow__title {
	font-family: var(--font-gothic2);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
	font-weight: 400;
	--line-height: 1;
	letter-spacing: -0.075em;
}

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

.recruit-flow__title::before {
	margin-top: var(--font-gothic2-top);
}

.recruit-flow__title::after {
	margin-bottom: var(--font-gothic2-bottom);
}

@media screen and (min-width: 1024px) {
	.recruit-flow__title {
		font-size: var(--font-size42);
		margin-top: 2.6rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-flow__title {
		font-size: var(--font-size20);
		margin-top: 0.9rem ;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-flow__scroll {
		margin-top: 4.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-flow__scroll {
		margin-top: 2.1rem ;
		margin-right: calc(var( --recruit-gutter ) * -1);
	}
}

/* ------------------------------------------------------------
 recruit-job
------------------------------------------------------------ */
.recruit-job {
	position: relative;
	min-width: 0;
	background-color: var(--color-white);
	background-image: none;
	padding-right: var(--recruit-card-padding);
	padding-left: var(--recruit-card-padding);
}

@media screen and (min-width: 1024px) {
	.recruit-job {
		min-height: 64.9rem ;
		border-radius: 1.6rem ;
		padding-top: 4.8rem ;
		padding-bottom: 7.3rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-job {
		border-radius: 0.8rem ;
		padding-top: 3rem ;
		padding-bottom: 4.3rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-job {
		min-height: 0;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-job:nth-child(-n+2) {
		min-height: 72rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-job:nth-child(-n+2) {
		min-height: 0;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-job.-crew {
		min-height: 44.3rem ;
	}
}

.recruit-job.-crew .recruit-job__hours {
	display: block;
	margin-left: 0;
}

@media screen and (max-width: 1023px) {
	.recruit-job.-crew .recruit-job__duties li:last-child {
		letter-spacing: -0.09em;
		margin-right: -0.7rem ;
	}
}

@media (prefers-reduced-motion: no-preference) {
	.recruit-job.is-revealing {
		--recruit-card-offset-y: 2rem ;
		-webkit-animation: recruit-card-in .7s both;
		animation: recruit-card-in .7s both;
	}
}

.recruit-job__title {
	color: var(--color-recruit-blue);
	font-weight: 400;
	letter-spacing: -0.03em;
	font-family: var(--font-gothic2);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
}

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

.recruit-job__title::before {
	margin-top: var(--font-gothic2-top);
}

.recruit-job__title::after {
	margin-bottom: var(--font-gothic2-bottom);
}

@media screen and (min-width: 1024px) {
	.recruit-job__title {
		font-size: var(--font-size38);
		--line-height: 1.21053;
		padding-left: 0.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-job__title {
		font-size: var(--font-size24);
		--line-height: 1.25;
		padding-left: 0.7rem ;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-job__title small {
		font-size: inherit;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-job__title small {
		font-size: var(--font-size17);
	}
}

.recruit-job__details {
	font-family: var(--font-gothic);
	font-weight: 500;
	letter-spacing: -0.025em;
}

@media screen and (min-width: 1024px) {
	.recruit-job__details {
		font-size: var(--font-size18);
		--line-height: 1.66667;
		margin-top: 6.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-job__details {
		font-size: var(--font-size12);
		--line-height: 1.5;
		margin-top: 3.1rem ;
	}
}

.recruit-job__row {
	display: grid;
	grid-template-columns: var(--recruit-label-width) minmax(0, 1fr);
	border-bottom: var(--solid-recruit);
	padding-top: var(--recruit-row-padding);
	padding-bottom: var(--recruit-row-padding);
}

@media screen and (min-width: 1024px) {
	.recruit-job__row {
		padding-right: 0.4rem ;
		padding-left: 0.4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-job__row {
		border-bottom-width: .5px;
		padding-right: 0.7rem ;
		padding-left: 0.7rem ;
	}
}

.recruit-job__row:first-child {
	padding-top: 0;
}

@media screen and (min-width: 1024px) {
	.recruit-job__row dt {
		font-weight: 700;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-job__row dt {
		font-weight: 500;
	}
}

.recruit-job__row dd {
	min-width: 0;
	overflow-wrap: anywhere;
}

@media screen and (min-width: 1024px) {
	.recruit-job__hours {
		display: inline;
	}
}

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

@media screen and (min-width: 1024px) {
	.recruit-job__hours + .recruit-job__hours {
		margin-left: 1.4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-job__hours + .recruit-job__hours {
		margin-left: 0;
	}
}

@media screen and (min-width: 1024px) {
	.recruit-job__hours-note {
		margin-left: 1.8rem ;
		font-size: 1.6rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-job__hours-note {
		display: block;
		margin-top: 0.4rem ;
		font-size: 1.1rem ;
	}
}

.recruit-job__notes {
	letter-spacing: -0.08em;
}

@media screen and (min-width: 1024px) {
	.recruit-job__notes {
		font-size: 1.35rem ;
		--line-height: 1.62963;
		margin-top: 1.7rem ;
		margin-right: -1.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-job__notes {
		font-size: var(--font-size10);
		--line-height: 1.6;
		margin-top: 0.8rem ;
		margin-right: -0.7rem ;
	}
}

.recruit-job__duties {
	list-style: none;
}

@media screen and (min-width: 1024px) {
	.recruit-job__duties {
		margin-top: 2.4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-job__duties {
		margin-top: 0.7rem ;
	}
}

.recruit-job__duties li {
	position: relative;
	padding-left: .6em;
}

.recruit-job__duties li::before {
	content: '・';
	position: absolute;
	top: -.04em;
	left: 0;
}

@media screen and (min-width: 1024px) {
	.recruit-job__duties li + li {
		margin-top: 2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-job__duties li + li {
		margin-top: 0.7rem ;
	}
}

.recruit-job__entry {
	position: absolute;
	left: 50%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-radius: 6rem ;
	border: var(--solid-recruit-blue);
	background-color: var(--color-recruit-blue);
	background-image: none;
	color: var(--color-white);
	font-weight: 800;
	--line-height: 1;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	transition: color var(--transition-button), background-color var(--transition-button);
}

@media screen and (min-width: 1024px) {
	.recruit-job__entry {
		bottom: -3rem ;
		width: 20.1rem ;
		height: 6rem ;
		font-size: var(--font-size16);
		padding: 0 2.1rem 0 3.3rem ;
	}
}

@media screen and (max-width: 1023px) {
	.recruit-job__entry {
		bottom: -2.5rem ;
		width: 16.7rem ;
		height: 5rem ;
		font-size: var(--font-size13);
		padding: 0 1.8rem 0 2.7rem ;
	}
}

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

.recruit-job__entry:focus-visible {
	background-color: var(--color-white);
	background-image: none;
	color: var(--color-recruit-blue);
	outline: 2px solid currentColor;
	outline-offset: 0.4rem ;
}

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

@-webkit-keyframes recruit-photo-in {
	from {
		opacity: 0;
		-webkit-transform: translateY(var(--recruit-photo-offset-y));
		transform: translateY(var(--recruit-photo-offset-y));
	}
	to {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

@keyframes recruit-photo-in {
	from {
		opacity: 0;
		-webkit-transform: translateY(var(--recruit-photo-offset-y));
		transform: translateY(var(--recruit-photo-offset-y));
	}
	to {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

@-webkit-keyframes recruit-card-in {
	from {
		opacity: 0;
		-webkit-transform: translateY(var(--recruit-card-offset-y));
		transform: translateY(var(--recruit-card-offset-y));
	}
	to {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

@keyframes recruit-card-in {
	from {
		opacity: 0;
		-webkit-transform: translateY(var(--recruit-card-offset-y));
		transform: translateY(var(--recruit-card-offset-y));
	}
	to {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

/* Illustratorの写真枠と配置画像から算出したトリミング。 */
