@charset "utf-8";
/* ==========================================
採用情報：ページ基本
========================================== */

.p-recruit {
	background: var(--white);
}

/* ==========================================
採用情報：コンテンツ幅・上下余白
========================================== */

.p-recruit__intro,
.p-recruit__appeal,
.p-recruit__work,
.p-recruit__jobs,
.p-recruit__entry {
	--content-width: 1220px;
	--content-gutter: 4.8rem;
	--content-padding: 0rem;
	--section-space-top: 12rem;
	--section-space-bottom: 12rem;
}

.p-recruit__intro,
.p-recruit__heading,
.p-recruit__work-intro {
	text-align: center;
}

/* ==========================================
採用情報：導入見出し・本文
========================================== */

.p-recruit__intro-text {
	margin-top: 3.4rem;
}

/* ==========================================
採用情報：ページ内リンク
========================================== */

.p-recruit__buttons {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 5rem;
	margin-top: 5.8rem;
}

/* ==========================================
採用情報：当社で働く魅力・背景
========================================== */

.p-recruit__appeal {
	position: relative;
	--section-space-top: 5rem;
	--section-space-bottom: 14rem;
	--recruit-edge-height: clamp(36px, 3.38542cqw, 65px);
	--recruit-wave-offset: clamp(16px, 1.9792vw, 38px);
	isolation: isolate;
	container-type: inline-size;
}

/* ==========================================
採用情報：上下の波
上部は疑似要素の波線のみ、下部は背景専用の透過マスク。
下部は高さ36～65pxを確保し、波全体を表示して途中の切り取りを防ぐ。
========================================== */

.p-recruit__appeal::before {
	position: absolute;
	z-index: 1;
	top: calc(var(--recruit-wave-offset) * -1);
	right: 0;
	left: 0;
	aspect-ratio: 1920.239 / 63.226;
	background: var(--secondary03);
	mask: url("/wp-content/uploads/deco-section-wave.svg") center / 100% 100% no-repeat;
	pointer-events: none;
	content: "";
}

.p-recruit__appeal::after {
	position: absolute;
	z-index: -1;
	inset: 0;
	background: var(--recruit-appeal-image, url("/wp-content/uploads/recruit-our-appeal-mask.jpg")) center / cover no-repeat;
	opacity: 0.6;
	mask-image: linear-gradient(#000 0 0), url("/wp-content/uploads/deco-section-wave-fill.svg");
	mask-repeat: no-repeat, no-repeat;
	mask-position: top center, bottom center;
	mask-size: 100% calc(100% - var(--recruit-edge-height) + 1px), 100% var(--recruit-edge-height);
	mask-mode: alpha, alpha;
	mask-composite: add;
	pointer-events: none;
	content: "";
}

/* ==========================================
採用情報：セクション見出し
========================================== */

.p-recruit__heading h2 {
	margin-top: 0.8rem;
}

.p-recruit__appeal .p-recruit__heading .en-title120 {
	opacity: 0.55;
}

.p-recruit__appeal .p-recruit__heading h2 {
	margin-top: -1rem;
}

/* ==========================================
採用情報：魅力一覧
========================================== */

.p-recruit__appeal-list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 13rem;
	margin-top: 6rem;
}

.p-recruit__appeal-image {
	width: 24rem;
	max-width: 100%;
	margin-inline: auto;
}

.p-recruit__appeal-image img {
	display: block;
	width: 100%;
}

.p-recruit__appeal-title {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 8.8rem;
	margin-top: 3rem;
	padding-bottom: 1rem;
	border-bottom: 0.1rem solid currentColor;
	font-weight: 500;
	line-height: 1.5;
	text-align: center;
}

.p-recruit__appeal-text {
	margin-top: 2rem;
	line-height: 2;
}

/* ==========================================
採用情報：業務内容
========================================== */

.p-recruit__work-intro {
	margin-top: 4rem;
}

.p-recruit__projects {
	margin-top: 10rem;
}

.p-recruit__project {
	display: grid;
	grid-template-columns: minmax(0, 45rem) minmax(0, 1fr);
	align-items: center;
	gap: 3rem 7rem;
	padding-block: 4rem;
}

.p-recruit__project + .p-recruit__project {
	border-top: 0.1rem solid var(--ui-border-color);
}

.p-recruit__project-heading {
	grid-column: 1 / -1;
	display: flex;
	align-items: baseline;
	gap: 1.6rem;
}

.p-recruit__number {
	font-family: var(--font-family01);
	font-weight: 400;
	font-size: 2.4rem;
	letter-spacing: 0.1em;
}

.p-recruit__number span {
    font-size: 143.55%;
}

.p-recruit__project-name {
	font-weight: 500;
}

.p-recruit__project-image img {
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

.p-recruit__project-body {
	min-width: 0;
}

.p-recruit__project-catch {
	font-size: 3.2rem;
	font-weight: 600;
	line-height: 1.5;
}

.p-recruit__project-text {
	margin-top: 3rem;
	line-height: 2;
}

.p-recruit__project:nth-child(even) {
	grid-template-columns: minmax(0, 1fr) minmax(0, 45rem);
}

.p-recruit__project:nth-child(even) .p-recruit__project-heading {
	justify-content: flex-end;
}

.p-recruit__project:nth-child(even) .p-recruit__project-image {
	grid-column: 2;
	grid-row: 2;
}

.p-recruit__project:nth-child(even) .p-recruit__project-body {
	grid-column: 1;
	grid-row: 2;
}

/* ==========================================
採用情報：募集要項
========================================== */

.p-recruit__jobs {
	background: #EAF9FD;
}

.p-recruit__job {
	--job-title-color: var(--primary02);
	margin-top: 9rem;
	scroll-margin-top: 4rem;
}

.p-recruit__job--secondary {
	--job-title-color: var(--secondary03);
}

.p-recruit__job-title {
	margin-bottom: 1.4rem;
	color: var(--job-title-color);
	font-weight: 500;
}

.p-recruit__job-table th,
.p-recruit__job-table td {
	line-height: 1.5em;
}

.btn01.btn01-down {
    justify-content: center;
    padding: 1.8rem 5rem;
}

/* テキスト */
.btn01-down .btn01-text {
    text-align: center;
}


.btn01.btn01-down::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 3rem;
    width: 1.3rem;
    height: 1.7rem;
    background: url(../../../../uploads/white-arrow-down.png) center / contain no-repeat;
    border-radius: 0;
    transform: translateY(-50%);
    transition: transform .3s ease;
    z-index: 2;
}

.btn01.btn01-down::after {
    content: none;
}

.btn01.btn01-down:hover::before {
	right: 3rem;
	transform: translateY(calc(-50% + 4px));
}

/* ==========================================
採用情報：エントリーフォーム
========================================== */

.p-recruit__entry-panel {
	padding: 8rem 11rem;
	border: 0.1rem solid var(--base-font-color);
	border-radius: 2.2rem 0 0 0;
}

.p-recruit__form {
	margin-top: 4rem;
	font-weight: 400;
}

.p-recruit__form-note {
	margin-bottom: 2rem;
}

.p-recruit__form-row {
	display: grid;
	grid-template-columns: minmax(0, 22rem) minmax(0, 1fr);
	gap: 2rem;
	padding-block: 2rem;
	border-bottom: 0.1rem solid var(--ui-border-color);
}

.p-recruit__form-label,
.p-recruit__form-value {
	min-width: 0;
	margin: 0;
	line-height: 1.5em;
}

.p-recruit__form-label {
	padding-top: 0.6rem;
}

/* ==========================================
採用情報：入力欄
========================================== */

.p-recruit__input,
.p-recruit__textarea {
	width: 100%;
	min-width: 0;
	padding: 0.6rem 1.2rem;
	border: 0;
	box-shadow: inset 0 2px 4px rgb(0 0 0 / 10%);
	background: #F2F2F2;
	font: inherit;
	line-height: 1.5em;
}

.p-recruit__input:focus-visible,
.p-recruit__textarea:focus-visible {
	outline: 0.2rem solid var(--secondary03);
}

.p-recruit__textarea {
	min-height: 20rem;
	resize: vertical;
}

.p-recruit__textarea--short {
	min-height: 16rem;
}

/* ==========================================
採用情報：ラジオボタン・チェックボックス
========================================== */

.p-recruit__choices {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem 3rem;
}

.p-recruit__form input[type="radio"],
.p-recruit__form input[type="checkbox"] {
	appearance: none;
	flex: 0 0 1.8rem;
	width: 1.8rem;
	height: 1.8rem;
	margin: 0;
	border: 0.2rem solid #B8DDE3;
	background-color: var(--white);
	box-shadow: none;
	cursor: pointer;
}

.p-recruit__form input[type="radio"] {
	border-radius: 50%;
}

.p-recruit__form input[type="radio"]:checked {
	background: radial-gradient(circle, var(--secondary03) 0 45%, transparent 48%);
}

.p-recruit__form input[type="checkbox"] {
	border-radius: 0;
}

.p-recruit__form input[type="checkbox"]:checked {
	border-color: var(--secondary03);
	background-color: var(--secondary03);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m4 10 4 4 8-8' fill='none' stroke='white' stroke-width='2.5'/%3E%3C/svg%3E");
	background-size: contain;
}

.p-recruit__form input[type="radio"]:focus-visible,
.p-recruit__form input[type="checkbox"]:focus-visible {
	outline: 0.2rem solid var(--secondary02);
	outline-offset: 0.3rem;
}

/* ==========================================
採用情報：生年月日・住所・添付ファイル
========================================== */

.p-recruit__birth,
.p-recruit__postal {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.8rem;
}

.p-recruit__birth .wpcf7-form-control-wrap {
	width: clamp(7rem, 8vw, 8rem);
}

.p-recruit__birth .wpcf7-form-control-wrap:has(#entry-birth-year) {
	width: clamp(10rem, 12vw, 12rem);
}

.p-recruit__postal .wpcf7-form-control-wrap {
	width: 9rem;
}

.p-recruit__postal-help {
	margin-block: 1rem;
}

.p-recruit__building {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-top: 2rem;
}

.p-recruit__building p {
	flex-shrink: 0;
}

.p-recruit__building .wpcf7-form-control-wrap {
	flex: 1;
	min-width: 0;
}

#autozip {
    display: none !important;
}

.p-recruit__files {
	display: grid;
	gap: 0.8rem;
}

.p-recruit__file {
	width: 100%;
	max-width: 100%;
	font: inherit;
}

/* ==========================================
採用情報：プライバシーポリシー
========================================== */

.p-recruit__privacy {
	box-sizing: border-box;
	height: 20rem;
	overflow-y: auto;
	padding: 1.2rem;
	margin-bottom: 1.5rem;
	background: #F2F2F2;
	scrollbar-color: var(--secondary03) #EEE;
	scrollbar-width: thin;
}

.p-recruit__privacy-item {
	display: grid;
	grid-template-columns: fit-content(50%) minmax(0, 1fr);
	align-items: start;
	column-gap: 0.25em;
	margin: 0.75em 0 0 1em;
}

.p-recruit__privacy-item--nested {
	margin-top: 0.4em;
	margin-left: 3.5em;
}

.p-recruit__privacy-marker,
.p-recruit__privacy-item-text {
	margin: 0;
	line-height: inherit;
}

.p-recruit__privacy-marker {
	overflow-wrap: anywhere;
}

.p-recruit__privacy-item-text {
	min-width: 0;
	overflow-wrap: anywhere;
}

.p-recruit__privacy-section {
	margin-top: 2rem;
}

.p-recruit__privacy-title {
	margin-bottom: 1rem;
	padding-bottom: 0.6rem;
	border-bottom: 0.1rem solid var(--ui-border-color);
	font-weight: 600;
}

.p-recruit__privacy-text {
	margin: 0 0 0 1em;
	line-height: 1.5em;
}

.p-recruit__privacy > .p-recruit__privacy-text {
	margin-left: 0;
}

.p-recruit__privacy-text + .p-recruit__privacy-text {
	margin-top: 1em;
}

/* ==========================================
採用情報：Contact Form 7
プラグインが出力する要素はフォーム内に限定して指定。
========================================== */

.p-recruit__form .wpcf7-list-item {
	margin: 0;
}

.p-recruit__form .wpcf7-list-item label {
	display: flex;
	align-items: center;
	gap: 0.8rem;
}

.p-recruit__form .wpcf7-not-valid-tip {
	margin-top: 0.6rem;
	font-size: 1.4rem;
}

/* ==========================================
採用情報：送信ボタン
========================================== */

.p-recruit__form-submit {
	position: relative;
	isolation: isolate;
	width: 28rem;
	max-width: 100%;
	margin: 5rem auto 0;
	border-radius: 10rem;
	background: var(--gradation-primary, linear-gradient(68deg, #F89D89 0%, #FEB269 40%, #F89D89 100%));
	text-align: center;
}

.p-recruit__form-submit::before {
	position: absolute;
	z-index: 0;
	inset: 0;
	border-radius: inherit;
	background: var(--gradation-primary-hover, linear-gradient(68deg, #E9775D 0%, #FEB269 40%, #E9775D 100%));
	opacity: 0;
	transition: opacity 0.6s ease;
	pointer-events: none;
	content: "";
}

.p-recruit__form-submit:hover::before,
.p-recruit__form-submit:focus-within::before {
	opacity: 1;
}

.p-recruit__form-submit .p-recruit__submit,
.p-recruit__form-submit .p-recruit__submit:hover,
.p-recruit__form-submit .p-recruit__submit:focus {
	position: relative;
	z-index: 1;
	appearance: none;
	display: block;
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 1.6rem 3rem;
	border: 0;
	border-radius: inherit;
	background: transparent !important;
	color: var(--white);
	font: inherit;
	font-size: 2rem;
	cursor: pointer;
}

.p-recruit__form-submit:has(.p-recruit__submit:disabled) {
	opacity: 0.5;
}

.p-recruit__submit:disabled {
	cursor: default;
}

.p-recruit__form-submit .wpcf7-spinner {
	position: absolute;
	z-index: 2;
	top: 50%;
	right: 1rem;
	margin: 0;
	transform: translateY(-50%);
}

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

/* ==========================================
採用情報：レスポンシブ（1024px以下）
========================================== */

@media screen and (width <= 1024px) {
	.p-recruit__intro,
	.p-recruit__appeal,
	.p-recruit__work,
	.p-recruit__jobs,
	.p-recruit__entry {
		--section-space-top: 8rem;
		--section-space-bottom: 8rem;
	}

	.p-recruit__appeal-list {
		gap: 4rem;
	}

	.p-recruit__project,
	.p-recruit__project:nth-child(even) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 4rem;
	}

	.p-recruit__project-catch {
		font-size: 2.6rem;
	}


	.p-recruit__entry-panel {
		padding: 6rem 4rem;
	}

	.p-recruit__form-row {
		grid-template-columns: minmax(0, 18rem) minmax(0, 1fr);
	}
}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

/* ==========================================
採用情報：レスポンシブ（768px以下）
========================================== */

@media screen and (width <= 768px) {
	.p-recruit__appeal-list {
		grid-template-columns: minmax(0, 1fr);
		gap: 5rem;
		max-width: 45rem;
		margin-inline: auto;
	}

	.p-recruit__appeal-title {
		min-height: 0;
		padding-bottom: 2rem;
	}

	.p-recruit__work-intro br,
	.p-recruit__intro-text br {
		display: none;
	}

	.p-recruit__project,
	.p-recruit__project:nth-child(even) {
		grid-template-columns: minmax(0, 1fr);
		gap: 2.4rem;
	}

	.p-recruit__project:nth-child(even) .p-recruit__project-image,
	.p-recruit__project:nth-child(even) .p-recruit__project-body {
		grid-column: auto;
		grid-row: auto;
	}

	.p-recruit__project:nth-child(even) .p-recruit__project-heading {
		justify-content: flex-start;
	}

	.p-recruit__project-catch {
		font-size: 2.2rem;
	}

	.p-recruit__form-row {
		grid-template-columns: minmax(0, 1fr);
		gap: 1rem;
	}

	.p-recruit__building {
		flex-direction: column;
		align-items: stretch;
	}
}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

/* ==========================================
採用情報：レスポンシブ（576px以下）
========================================== */

@media screen and (width <= 576px) {
	.p-recruit__intro,
	.p-recruit__appeal,
	.p-recruit__work,
	.p-recruit__jobs,
	.p-recruit__entry {
		--content-gutter: 3.2rem;
		--section-space-top: 6rem;
		--section-space-bottom: 6rem;
	}

	.p-recruit__lead {
		letter-spacing: 0.05em;
	}

	.p-recruit__heading .en-title120 {
		font-size: 4.8rem;
	}

	.p-recruit__heading .en-title60 {
		font-size: 3.4rem;
	}

	.p-recruit__buttons {
		gap: 2rem;
		margin-top: 4rem;
	}

	.p-recruit__projects {
		margin-top: 5rem;
	}

	.p-recruit__project-name {
		font-size: 2.6rem;
	}

	.p-recruit__number {
		font-size: 1.8rem;
	}

	.p-recruit__job {
		margin-top: 5rem;
	}

	.p-recruit__entry-panel {
		padding: 4rem 2rem;
	}

	.p-recruit__form-row {
		padding-block: 1.6rem;
	}
}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

/* ==========================================
採用情報：レスポンシブ（414px以下）
========================================== */

@media screen and (width <= 414px) {

	.p-recruit__project-catch {
        font-size: 2rem;
    }

}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

.p-recruit__sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}