@charset "UTF-8";

/* -------------------------------------
// MV
------------------------------------- */
.page-tag {
	right: 0;
}

@media (min-width: 1730px) {
	.page-tag {
		right: calc((100vw - 1730px) / 2);
	}
}

@media only screen and (max-width: 768px) {
	.page-tag {
		right: 90px;
	}
}

/* -------------------------------------
// 共通
------------------------------------- */
.c-heading__en {
	font-size: clamp(5.5rem, calc(-3rem + 16vw), 13.5rem);
}

.info-section h2.div-heading__title {
	font-size: 2.25rem;
	line-height: 1;
	color: var(--grey);
	margin-block: 0.5rem 4rem;
}

.info-section .section__image {
	margin: 4rem auto;

	img {
		aspect-ratio: 2170 / 1000;
		object-fit: cover;
	}
}

@media only screen and (max-width: 768px) {
	.c-heading__en {
		font-size: clamp(2.125rem, 12.17vw, 6.2rem);
	}

	.info-section h2.div-heading__title {
		font-size: clamp(1.25rem, 3.39vw, 2.25rem);
		margin-block: 0 3rem;
	}

	.section__image {
		margin: 4rem auto 3.75rem;

		img {
			aspect-ratio: 1172 / 720;
		}
	}
}

.info__data {
	margin-bottom: var(--space-section-pc);
}

.info__faq {
	margin-bottom: var(--space-section-pc);
}

.recruit-data {
	margin-bottom: 7.5rem;
}

.recruit-data__item {
	margin-bottom: 3.5rem;
}

.recruit-data__label {
	display: inline-block;
	font-size: 1.25rem;
	line-height: 1;
	color: var(--p_blue);
	margin-bottom: 1rem;
}

.recruit-data__value {
	font-size: 1.25rem;
	line-height: 2.4;
}

@media only screen and (max-width: 768px) {
	.info__data {
		margin-bottom: var(--space-section-sp);
	}

	.info__faq {
		margin-bottom: var(--space-section-sp);
	}

	.recruit-data__item {
		margin-bottom: 2rem;
	}

	.recruit-data__label {
		font-size: 1.25rem;
	}

	.recruit-data__value {
		font-size: clamp(0.8rem, 2.21vw, 1.25rem);
		line-height: 1.7;
	}
}

/* -------------------------------------
// FAQ
------------------------------------- */
.faq__content {
	margin-bottom: 7.5rem;
}

.faq__item {
	border: 2px solid var(--p_blue);

	+ .faq__item {
		margin-top: 2.5rem;
	}
}

.faq__question {
	cursor: pointer;
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 24px;
	padding: 1rem 1.25rem;
	font-size: 1.5rem;
	color: var(--white);
	background: var(--p_blue);

	&::before {
		content: "Q";
		font-family: var(--font-heading);
		font-size: 2.875rem;
		font-weight: 700;
		line-height: 1;
	}

	&::-webkit-details-marker {
		display: none;
	}

	&::after {
		content: "+";
		font-size: 2.875rem;
		line-height: 1;
	}
}

.faq__item[open] > .faq__question::after {
	content: "−";
}

/* ---------------------------------------------------------------
// FAQ 開閉機能の一時停止（常時展開表示）
// 2ヶ月後を目安にアコーディオン開閉を復活させる場合は、
// このブロックをまるごと削除（またはコメントアウト）してください。
// ※ page-information.php 側の <details open> の open 属性も
//    あわせて削除してください。
--------------------------------------------------------------- */
.faq__question {
	pointer-events: none;
	cursor: default;
}

.faq__answer {
	padding: 1rem 1.5rem;
	font-size: 1.25rem;
	line-height: 1.8;
}

@media only screen and (max-width: 768px) {
	.faq__content {
		margin-bottom: 3.5rem;
	}

	.faq__item {
		border: 1px solid var(--p_blue);
	}

	.faq__question {
		gap: 12px;
		padding: 1rem;
		font-size: 1rem;

		&::before {
			font-size: 2rem;
		}

		&::after {
			font-size: 2rem;
		}
	}

	.faq__answer {
		padding: 1rem;
		font-size: clamp(0.8rem, 2.21vw, 1.25rem);
		line-height: 1.7;
	}
}

/* -------------------------------------
// 採用フロー
------------------------------------- */
.info__flow-list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 24px;
	row-gap: 32px;
	align-items: start;
	margin-bottom: 5rem;
}

.info__flow-step {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	text-align: center;

	img {
		max-width: 189px;
		width: 100%;
		height: auto;
	}

	&::after {
		content: "";
		position: absolute;
		top: 50%;
		right: -20px;
		width: 32px;
		height: 32px;
		transform: translateY(-50%);
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 68.2 68.2'%3E%3Cpath d='M0,0V.886H43.339V44.225h.886V0Z' transform='translate(34.1 2.828) rotate(45)' fill='%23DB7D23' stroke='%23DB7D23' stroke-width='4'/%3E%3C/svg%3E");
		background-repeat: no-repeat;
		background-size: contain;
	}

	&:nth-child(3n)::after {
		content: none;
	}
}

.info__flow-title {
	font-size: 1.5rem;
	line-height: 1;

	color: var(--p_blue);
	margin-block: 1rem 0;
}

.info__flow-note {
	display: flex;
	flex-direction: column;
	font-size: clamp(0.8125rem, 0.6875rem + 0.2604vw, 1rem);
	line-height: 1.75;
	text-align: right;
}

@media only screen and (max-width: 1024px) {
	.info__flow-list {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		column-gap: 24px;
		row-gap: 32px;
	}

	.info__flow-step:nth-child(3n)::after {
		content: "";
	}

	.info__flow-step:nth-child(2n)::after {
		content: none;
	}
}

@media only screen and (max-width: 768px) {
	.info__flow-list {
		grid-template-columns: 1fr;
		justify-items: center;
		gap: 64px;
		margin-bottom: 3.5rem;
	}

	.info__flow-step::after {
		top: auto;
		right: auto;
		left: 50%;
		bottom: -40px;
		width: 44px;
		height: 44px;
		transform: translateX(-50%) rotate(90deg);
	}

	.info__flow-step:nth-child(2n)::after {
		content: "";
	}

	.info__flow-step:last-child::after {
		content: none;
	}

	.info__flow-title {
		font-size: clamp(1.125rem, 4vw, 1.875rem);
	}

	.info__flow-note {
		font-size: clamp(0.8125rem, 1.302vw, 1rem);
		text-align: left;
		text-indent: -1em;
		padding-left: 1em;
	}
}