.site-main--faq {
	position: relative;
	display: flow-root;
	min-width: 1200px;
	min-height: 2002px;
	background: linear-gradient(180deg, #fff 0 12px, #ecefff 12px 210px, #fff 210px);
	color: #000;
}

.faq-page__breadcrumb {
	background: #f5f5f5;
	font-weight: 500;
}

.faq-page__breadcrumb a { text-decoration: none; }
.faq-page__breadcrumb a:hover { text-decoration: underline; }

.faq-page__header {
	display: flex;
	width: 1200px;
	height: 56px;
	margin: 42px auto 0;
	align-items: center;
	gap: 32px;
}

.faq-page__header h1 {
	margin: 0;
	background: var(--gradient-brand);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	font-size: 40px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 2px;
}

.faq-page__header span { font-size: 20px; font-weight: 400; line-height: 1.8; }

.faq-page__groups {
	width: 1200px;
	padding: 163px 32px 86px;
	margin: 0 auto;
}

.faq-group + .faq-group { margin-top: 73px; }
.faq-group h2 { margin: 0 0 48px; font-size: 32px; line-height: 1.4; letter-spacing: 1.6px; }
.faq-group__items { display: flex; flex-direction: column; }

.faq-item { border-bottom: 1px solid #d6d6d6; }
.faq-item:last-child { border-bottom: 0; }

.faq-item__question {
	display: grid;
	width: 100%;
	min-height: 73px;
	padding: 0;
	grid-template-columns: 40px 1fr 28px;
	align-items: center;
	column-gap: 26px;
	border: 0;
	background: transparent;
	color: #000;
	text-align: left;
	cursor: pointer;
}

.faq-item__question[aria-disabled="true"] { cursor: default; }

.faq-item__letter {
	background: var(--gradient-brand);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	font-family: Afacad, var(--font-family-ja);
	font-size: 53px;
	font-weight: 700;
	line-height: 1;
}

.faq-item__text { font-size: 20px; font-weight: 700; line-height: 1.4; letter-spacing: 1px; }
.faq-item__toggle { position: relative; display: block; width: 28px; height: 28px; transition: transform .2s ease; }
.faq-item__toggle::before, .faq-item__toggle::after { position: absolute; top: 50%; left: 50%; width: 28px; height: 3px; background: #00c792; content: ""; transform: translate(-50%, -50%); }
.faq-item__toggle::after { width: 3px; height: 28px; }
.faq-item.is-open .faq-item__toggle { transform: rotate(45deg); }

.faq-item__answer {
	padding: 19px 86px 20px;
	margin: -1px -20px 0;
	border-radius: 10px;
	background: #f5f5f5;
}

.faq-item__answer p {
	margin: 0;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.7;
	letter-spacing: 1px;
}

.faq-item.is-open { padding-bottom: 20px; }

@media (max-width: 767px) {
	.site-main--faq { min-width: 0; min-height: 0; }
	.faq-page__breadcrumb, .faq-page__header, .faq-page__groups { width: calc(100% - 32px); }
	.faq-page__groups { padding: 96px 0 72px; }
	.faq-page__header { gap: 20px; }
	.faq-page__header h1 { font-size: 32px; }
	.faq-group h2 { font-size: 26px; }
	.faq-item__question { grid-template-columns: 32px 1fr 24px; column-gap: 14px; }
	.faq-item__letter { font-size: 42px; }
	.faq-item__text, .faq-item__answer p { font-size: 16px; }
	.faq-item__toggle { width: 24px; height: 24px; }
	.faq-item__answer { padding: 18px 20px; margin-inline: 0; }
}
