@charset "UTF-8";
/* ==========================================================================
   page-q-a.css ── よくあるご質問
   値は Figma の faq_PC（552:32783）／faq_SP（552:33548）のもの
   ========================================================================== */

.pw-faqsec { padding: 56px 0 80px; background: var(--pw-color-bg); }
.pw-faqsec__inner { width: min(var(--pw-content), 100% - var(--pw-gutter) * 2); margin-inline: auto; }
.pw-faq { display: grid; grid-template-columns: 240px minmax(0, 1fr); column-gap: 72px; align-items: start; }
.pw-faq__nav { position: sticky; top: 116px; }
.pw-faq__group + .pw-faq__group { margin-top: 56px; }
.pw-faq__h2 { padding: 10px 10px 9px; font-size: 26px; font-weight: 500; line-height: 47px; color: var(--pw-color-primary); border-bottom: 1px solid var(--pw-color-primary); }
.pw-faq__items { display: flex; flex-direction: column; gap: 16px; margin-top: 16px; }
.pw-faq__item { background: var(--pw-color-white); border-radius: 10px; }
.pw-faq__q { font-size: 18px; font-weight: 500; line-height: 32px; }
.pw-faq__btn { display: flex; align-items: flex-start; gap: 16px; width: 100%; padding: 16px 48px; text-align: left; color: var(--pw-color-text); cursor: pointer; }
.pw-faq__mark { flex: none; font-family: var(--pw-font-en); font-size: 18px; font-weight: 500; line-height: 32px; color: var(--pw-color-primary); }
.pw-faq__qtext { flex: 1 1 0; min-width: 0; }
.pw-faq__toggle { position: relative; flex: none; width: 18px; height: 18px; margin: 7px 0 0; }
.pw-faq__toggle::before, .pw-faq__toggle::after { content: ""; position: absolute; left: 0; top: 8px; width: 18px; height: 2px; background: var(--pw-color-primary); transition: rotate .3s ease-in-out, opacity .3s ease-in-out; }
.pw-faq__toggle::after { rotate: 90deg; }
.pw-faq__item.is-open .pw-faq__toggle::after { rotate: 0deg; opacity: 0; }
.pw-faq__a { padding: 0 48px 16px; }
.pw-faq__a-inner { display: flex; align-items: flex-start; gap: 16px; padding-top: 16px; border-top: 1px solid var(--pw-color-border); }
.pw-faq__atext { flex: 1 1 0; min-width: 0; font-size: 16px; line-height: 29px; }
.pw-faq__atext > * + * { margin-top: 16px; }
.pw-faq__atext a { color: var(--pw-color-primary); text-decoration: underline; text-underline-offset: .2em; }
.pw-faq__empty { font-size: 16px; line-height: 29px; }
@media (hover: hover) { .pw-faq__btn:hover .pw-faq__qtext { color: var(--pw-color-primary); transition: color .3s ease-in-out; } }

/* ---- タブレット（768〜1024px） ---- */
@media (min-width: 768px) and (max-width: 1024px) {
	.pw-faq { grid-template-columns: 200px minmax(0, 1fr); column-gap: 40px; }
	.pw-faq__btn, .pw-faq__a { padding-inline: 24px; }
}

/* ---- SP（767px 以下） ---- */
@media (max-width: 767px) {
	.pw-faqsec { padding: 0 0 40px; }   /* 最初の画面の下 40 だけ（Figma：パンくずの 40 下に最初の見出し） */
	.pw-faq { display: block; }
	.pw-faq__nav { display: none; }   /* Figma の SP に無い（カテゴリ見出しで区切る） */
	.pw-faq__group + .pw-faq__group { margin-top: 40px; }
	.pw-faq__h2 { padding: 0 0 7px; font-size: 20px; line-height: 36px; }
	.pw-faq__items { gap: 12px; }
	.pw-faq__btn { gap: 12px; padding: 16px; }
	.pw-faq__a { padding: 0 16px 16px; }
	.pw-faq__a-inner { gap: 12px; }
}
