/* =========================================================
   Faq（よくあるご質問）
   Figma node 113:31339。筆記体見出し＋サブ＋アコーディオン（ネイティブ <details>/<summary>・JS不使用）。
   各項目：質問＋右に＋アイコン（開くと −）＋区切り線。
   ※ 細部余白は後でまとめて調整。まず構造優先。モバイルは後回し。
   ========================================================= */

.faq {
	width: 100%;
	background: var(--bg-white); /* 白背景（Figmaフレームfill未指定→白と判断） */
	padding: 70px 0 72px;
}

/* .faq__inner の幅は共通クラス .l-narrow（740px） */

/* --- 見出し --- */
.faq__header {
	text-align: center;
	margin-bottom: 40px;
}
.faq__title {
	margin: 0;
	font-family: var(--font-script);
	font-weight: 400;
	font-size: 80px;
	line-height: 1;
	color: var(--color-script-ink); /* #231f20 */
}
.faq__sub {
	margin: 6px 0 0;
	font-family: var(--font-gothic);
	font-weight: 600;
	font-size: 16px;
	line-height: 30px;
	color: var(--color-subhead); /* #a3937c */
}

/* =========================================================
   アコーディオン（繰り返し）
   ========================================================= */
.faq-item {
	border-bottom: 1px solid var(--color-frame); /* 区切り線。※Figma画像線のため近似色 */
}

/* 質問行（summary）＝クリック領域。デフォルトの三角マーカーを消す */
.faq-item__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 48px;
	padding: 12px 0;
	cursor: pointer;
	list-style: none; /* Firefox等のマーカー除去 */
	font-family: var(--font-gothic);
	font-weight: 300;
	font-size: 15px;
	letter-spacing: 0.75px;
	color: var(--color-text); /* 本文色ルール：背景が白＝#CDC3B6でないため --color-text(#524635) */
}
.faq-item__q::-webkit-details-marker { display: none; } /* Safari/Chromeのマーカー除去 */

/* ＋ / − アイコン（CSSのみで開閉切り替え）
   記号は文字コード依存の文字化けを避けるため Unicodeエスケープで指定：
   \FF0B = ＋（全角プラス U+FF0B）／ \2212 = −（マイナス記号 U+2212）。 */
.faq-item__q::after {
	content: "\FF0B";
	flex: 0 0 auto;
	margin-left: 16px;
	font-size: 24px;
	line-height: 1;
	color: var(--color-text);
	transition: color 0.2s ease;
}
.faq-item[open] .faq-item__q::after {
	content: "\2212";
}

.faq-item__q-text {
	flex: 1 1 auto;
	min-width: 0;
}

/* 回答（開いたとき表示） */
.faq-item__a {
	padding: 4px 0 20px;
}
.faq-item__a p {
	margin: 0;
	font-family: var(--font-gothic);
	font-weight: 300;
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: 0.4px;
	color: var(--color-text);
}

/* =========================================================
   スマホ（≤599px）：セクション余白・筆記体タイトル・サブ詰め。タブレット/PC不変。
   ========================================================= */
@media (max-width: 599px) {
	.faq { padding: 60px 0; }
	.faq__title { font-size: 60px; }
	.faq__sub { margin-top: 0; }
}