.mj-faq {
  background-color: rgb(var(--color-background));
}

.mj-faq__wrap {
  max-width: 850px;
}

.mj-faq__item {
  padding-block: 24px;
  border-block-start: 1px solid rgb(var(--color-entry-line));
}

.mj-faq__item:last-child {
  border-block-end: 1px solid rgb(var(--color-entry-line));
}

/* ＋／− の記号はCSSだけで描く（アイコンフォント・SVGは使わない） */
/* summary は display:list-item が既定。flex にして「＋」を右端へ寄せる */
.mj-faq__q {
  display: flex;
  align-items: baseline;
  gap: 20px;
  font-size: 17px;
  line-height: 1.8;
  list-style: none;
  cursor: pointer;
  color: rgb(var(--color-text));
}

.mj-faq__q::-webkit-details-marker {
  display: none;
}

.mj-faq__q::before {
  content: "Q";
  flex-shrink: 0;
  font-family: var(--mj-font-figure);
  font-size: 19px;
  color: rgb(var(--color-light-text));
}

/* 質問文を伸ばして、記号を右端に追いやる */
.mj-faq__q > * {
  flex: 1;
}

.mj-faq__q::after {
  content: "＋";
  margin-inline-start: auto;
  flex-shrink: 0;
  color: rgb(var(--color-light-text));
}

.mj-faq__item[open] .mj-faq__q::after {
  content: "−";
}

.mj-faq__a {
  margin-block-start: 18px;
  margin-inline-start: 42px;
  font-size: 16px;
}

.mj-faq__a > :last-child {
  margin-block-end: 0;
}

.mj-faq__related {
  margin-block-start: 14px;
}

.mj-faq__more {
  margin-block-start: 30px;
  margin-block-end: 0;
}

@media (max-width: 760px) {
  .mj-faq__q { font-size: 16px; }
  .mj-faq__q { gap: 12px; }
  .mj-faq__a { margin-inline-start: 0; }
}

/* 設定欄で入れた改行をそのまま反映する */
.mj-faq .mj-head__title {
  white-space: pre-line;
}

/* ============================================================
   カテゴリ絞り込み
   参照 .filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:32px}
        .filters button{background:transparent;border:1px solid #a4c5d7;color:var(--ink);
                        padding:9px 17px;min-height:46px;font-size:15px;border-radius:25px}
        .filters button[aria-pressed=true]{background:var(--violet);color:white}
   ============================================================ */
.mj-faq__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-block-end: 32px;
}

.mj-faq__filters button {
  background: transparent;
  border: 1px solid #a4c5d7;
  color: var(--mj-ink);
  padding: 9px 17px;
  min-height: 46px;
  font-size: 15px;
  border-radius: 25px;
  cursor: pointer;
  font-family: inherit;
}

.mj-faq__filters button[aria-pressed="true"] {
  background: var(--mj-brand);
  border-color: var(--mj-brand);
  color: #fff;
}

.mj-faq__empty {
  padding-block: 30px;
  color: var(--mj-muted);
}

.mj-faq [hidden] {
  display: none !important;
}
