@charset "UTF-8";
/*
  faq-accordion.css
  クリックで開閉する FAQ アコーディオン（汎用）。
  HTML 側のクラス: .faq-accordion > .faq-accordion-item > .faq-accordion-trigger + .faq-accordion-answer
  開閉アニメーションは faq-accordion.js が担当。
*/
.faq-accordion-answer {
  display: none;
  overflow: hidden;
}

/* 既定で開いた状態にしたい項目は、HTML 側で
     .faq-accordion-item に is-open
     .faq-accordion-trigger に aria-expanded="true"
   を直書きする（JS の初期化を待たずに開いて見える＝チラつかない）。

   JS は開くとき answer に inline の display:block を、閉じるとき
   inline を空文字に戻す。閉じた時点で is-open も外れるので、
   このルールは効かなくなり display:none へ戻る。よって直書きと
   クリック操作は競合しない。 */
.faq-accordion-item.is-open .faq-accordion-answer { display: block; }
.faq-accordion-trigger { cursor: pointer; list-style: none; user-select: none; }
.faq-accordion-trigger:hover { opacity: 0.85; }
.faq-accordion-trigger .faq-accordion-icon {
  display: inline-block;
  margin-left: auto;
  width: 0; height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 8px solid currentColor;
  transition: transform 0.25s ease;
}
.faq-accordion-item.is-open .faq-accordion-trigger .faq-accordion-icon { transform: rotate(180deg); }
.faq-accordion-trigger .faq-accordion-icon { flex-shrink: 0; }