@charset "UTF-8";
/* =========================================================
   FAQページ（カテゴリごとのブロックを繰り返す）
   ・ブロックの余白：SP 60px 0 / PC 80px 0
   ・奇数ブロックの背景：#EBFBFF
   ・Q/Aのレイアウトは共通の .p-faq__item を流用
   ========================================================= */
.p-faqpage__block {
  padding: 60px 0;
  display: block;
}
@media only screen and (min-width: 992px) {
  .p-faqpage__block {
    padding: 80px 0;
  }
}
.p-faqpage__block:nth-child(odd) {
  background-color: #ebfbff;
}
.p-faqpage__block:nth-child(even) {
  background-color: #f7f7f7;
}

/* キーワード検索 */
.p-faqpage__search {
  width: 100%;
  max-width: 880px;
  margin: 0 auto;
  padding: 40px 15px;
}
@media only screen and (min-width: 992px) {
  .p-faqpage__search {
    padding: 60px 15px;
  }
}

.p-faqpage__search-input {
  width: 100%;
  padding: 16px 20px;
  border: 1px solid #e0e0e0;
  background-color: #f7f7f7;
  color: #333;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 14px;
  line-height: 1.5;
}
@media only screen and (min-width: 992px) {
  .p-faqpage__search-input {
    padding: 20px 24px;
    font-size: 16px;
  }
}
.p-faqpage__search-input::-webkit-input-placeholder {
  color: #999;
}
.p-faqpage__search-input::-moz-placeholder {
  color: #999;
}
.p-faqpage__search-input:-ms-input-placeholder {
  color: #999;
}
.p-faqpage__search-input::-ms-input-placeholder {
  color: #999;
}
.p-faqpage__search-input::placeholder {
  color: #999;
}
.p-faqpage__search-input:focus {
  outline: none;
  border-color: #0e63c4;
}

/* 検索結果なし */
.p-faqpage__noresult {
  padding: 60px 15px;
  text-align: center;
}
@media only screen and (min-width: 992px) {
  .p-faqpage__noresult {
    padding: 80px 15px;
  }
}

/* =========================================================
   アコーディオン（Q行クリックで回答を開閉）
   ========================================================= */
/* Q行（buttonタグ） */
.p-faq__row--q {
  width: 100%;
  cursor: pointer;
  text-align: left;
  background: none;
  padding: 0;
}

/* +/- アイコン（2本のバーの重なりで表現・色は #333333） */
.p-faq__toggle {
  position: relative;
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  margin-left: auto;
}
@media only screen and (min-width: 992px) {
  .p-faq__toggle {
    width: 16px;
    height: 16px;
  }
}

.p-faq__toggle::before,
.p-faq__toggle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 2px;
  background-color: #333333;
  transform: translate(-50%, -50%);
}

/* 縦バー：開いたら横に倒して「-」にする */
.p-faq__toggle::after {
  transform: translate(-50%, -50%) rotate(90deg);
  transition: transform 0.3s ease;
}

.p-faq__item.is-active .p-faq__toggle::after {
  transform: translate(-50%, -50%) rotate(0deg);
}

/* 回答（grid-template-rows の変化で高さをアニメーション） */
.p-faq__answer {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s ease;
  transition: grid-template-rows 0.3s ease, -ms-grid-rows 0.3s ease;
  transition:
    grid-template-rows 0.3s ease,
    -ms-grid-rows 0.3s ease;
  transition:
    grid-template-rows 0.3s ease,
    -ms-grid-rows 0.3s ease;
}

.p-faq__answer-inner {
  overflow: hidden;
}

.p-faq__item.is-active .p-faq__answer {
  grid-template-rows: 1fr;
}