/* FAQ アコーディオン
   SWELL の wp:loos/faq ブロック出力（dl.swell-block-faq）に対応
   ロゴテイストに合わせた上品なデザイン */

.swell-block-faq {
	display: flex;
	flex-direction: column;
	gap: var(--sp-2);
	margin: 0;
}
.swell-block-faq__item {
	background: var(--c-bg-card);
	border: 1px solid var(--c-border);
	border-radius: var(--r-md);
	overflow: hidden;
	transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}
.swell-block-faq__item:hover {
	border-color: var(--c-primary-light);
}
.swell-block-faq__item.is-open {
	border-color: var(--c-primary);
	box-shadow: var(--shadow-sm);
}

/* 質問（クリック可能） */
.swell-block-faq__item .faq_q {
	position: relative;
	display: flex;
	align-items: center;
	gap: var(--sp-3);
	padding: var(--sp-4) var(--sp-6) var(--sp-4) var(--sp-5);
	cursor: pointer;
	font-weight: var(--fw-bold);
	font-size: var(--fs-base);
	color: var(--c-fg);
	line-height: 1.5;
	user-select: none;
	-webkit-user-select: none;
	transition: color var(--dur-fast) var(--ease);
}
.swell-block-faq__item .faq_q::before {
	content: "Q";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px; height: 28px;
	flex: 0 0 auto;
	background: var(--c-primary);
	color: #fff;
	font-family: var(--font-display);
	font-weight: var(--fw-bold);
	border-radius: var(--r-sm);
	font-size: var(--fs-sm);
	letter-spacing: 0;
}
/* +/- アイコン */
.swell-block-faq__item .faq_q::after {
	content: "";
	position: absolute;
	right: var(--sp-5);
	top: 50%;
	width: 14px;
	height: 14px;
	transform: translateY(-50%);
	background-image:
		linear-gradient(var(--c-primary), var(--c-primary)),
		linear-gradient(var(--c-primary), var(--c-primary));
	background-size: 14px 1.5px, 1.5px 14px;
	background-position: center, center;
	background-repeat: no-repeat;
	transition: transform var(--dur-base) var(--ease);
}
.swell-block-faq__item.is-open .faq_q::after {
	transform: translateY(-50%) rotate(45deg);
}
.swell-block-faq__item:hover .faq_q { color: var(--c-primary-dark); }

/* 回答 */
.swell-block-faq__item .faq_a {
	margin: 0;
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows var(--dur-base) var(--ease);
	color: var(--c-fg);
	background: var(--c-bg);
}
.swell-block-faq__item.is-open .faq_a {
	grid-template-rows: 1fr;
}
.swell-block-faq__item .faq_a > * {
	overflow: hidden;
}
.swell-block-faq__item.is-open .faq_a > * {
	padding: var(--sp-4) var(--sp-5) var(--sp-5) calc(var(--sp-5) + 28px + var(--sp-3));
	border-top: 1px solid var(--c-border);
}
.swell-block-faq__item .faq_a p {
	line-height: 1.85;
	margin: 0;
	color: var(--c-fg);
}
.swell-block-faq__item .faq_a strong {
	font-weight: var(--fw-bold);
	color: var(--c-fg);
}

/* SP */
@media (max-width: 600px) {
	.swell-block-faq__item .faq_q {
		padding: var(--sp-3) var(--sp-5) var(--sp-3) var(--sp-4);
		font-size: var(--fs-sm);
	}
	.swell-block-faq__item .faq_q::before {
		width: 24px; height: 24px;
		font-size: var(--fs-xs);
	}
	.swell-block-faq__item .faq_q::after {
		right: var(--sp-3);
	}
	.swell-block-faq__item.is-open .faq_a > * {
		padding: var(--sp-3) var(--sp-4) var(--sp-4) calc(var(--sp-4) + 24px + var(--sp-2));
	}
}

/* SWELL の独自セパレーター・見出しを軽く調整（残ってる場合） */
.is-style-section_ttl {
	font-size: var(--fs-2xl);
	margin-block-end: var(--sp-3);
	padding-block-end: var(--sp-2);
	border-bottom: 2px solid var(--c-primary);
}
.is-style-section_ttl .swl-fz { font-size: 1em; }

.has-swl-main-color { color: var(--c-primary) !important; }
.has-swl-main-background-color { background-color: var(--c-primary) !important; }