@charset "UTF-8";

.faq-common-primary {
  margin: 0;
  padding: 0;
  color: #403121;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  list-style: none;
}

.faq-common-primary .faq-item {
  border-radius: 0.1rem;
  background-color: #fff;
}

.faq-common-primary .faq-item.is-active .item-question::after {
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.faq-common-primary .item-question,
.faq-common-primary .item-answer {
  position: relative;
}

.faq-common-primary .item-question {
  cursor: pointer;
}

.faq-common-primary .item-question::before,
.faq-common-primary .item-question::after {
  content: "";
  display: block;
  position: absolute;
  width: 0.2rem;
  height: 0.03rem;
  transition: color 0.3s ease, transform 0.3s ease;
  background-color: #808080;
}

.faq-common-primary .item-question::after {
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}

.faq-common-primary .item-answer {
  display: none;
}

.faq-common-primary .question-wrapper,
.faq-common-primary .answer-wrapper {
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.faq-common-primary .answer-wrapper {
  background: url(../img/faq/background_pattern_01.png) top left/auto 0.02rem repeat-x;
}

.faq-common-primary .question-icon,
.faq-common-primary .answer-icon {
  display: block;
  position: relative;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  background: top left/contain no-repeat;
}

.faq-common-primary .question-icon {
  background-image: url(../img/faq/icon_accordion_01.svg);
}

.faq-common-primary .answer-icon {
  background-image: url(../img/faq/icon_accordion_02.svg);
}

.faq-common-primary .question-content,
.faq-common-primary .answer-content {
  position: relative;
  margin: 0;
}

/* -------------------------------
* ▼ SP表示
* -------------------------------- */
@media only screen and (max-width: 767.98px) {
  .faq-common-primary {
    padding: 0 0.09rem;
  }

  .faq-common-primary .faq-item:not(:last-child) {
    margin-bottom: 0.15rem;
  }

  .faq-common-primary .item-question {
    padding: 0.075rem 0.09rem;
  }

  .faq-common-primary .item-question::before,
  .faq-common-primary .item-question::after {
    top: calc(50% - 0.015rem);
    right: 0.11rem;
  }

  .faq-common-primary .item-answer {
    top: 0.01rem;
    padding: 0 0.09rem;
  }

  .faq-common-primary .question-wrapper {
    padding-right: 0.3rem;
  }

  .faq-common-primary .answer-wrapper {
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 0.13rem 0;
  }

  .faq-common-primary .question-icon,
  .faq-common-primary .answer-icon {
    width: 0.22rem;
    height: 0.22rem;
    margin-right: 0.01rem;
  }

  .faq-common-primary .question-icon {
    margin: 0.03rem 0.06rem 0.03rem 0;
  }

  .faq-common-primary .answer-icon {
    margin-bottom: 0.01rem;
  }

  html.is-macos .faq-common-primary .question-content,
  html.is-ios .faq-common-primary .question-content,
  html.is-macos .faq-common-primary .answer-content,
  html.is-ios .faq-common-primary .answer-content {
    letter-spacing: 0;
  }
}

/* -------------------------------
* ▼ PC表示
* -------------------------------- */
@media print, (min-width: 768px) {
  .faq-common-primary .faq-item:not(:last-child) {
    margin-bottom: 19px;
  }

  .faq-common-primary .item-question {
    padding: 25px 30px;
    font-size: 0.18rem;
    line-height: 1.5555555556;
  }

  .faq-common-primary .item-question::before,
  .faq-common-primary .item-question::after {
    top: 37px;
    right: 29px;
  }

  .faq-common-primary .item-answer {
    top: -2px;
    padding: 0 30px;
  }

  .faq-common-primary .question-wrapper {
    padding-right: 40px;
  }

  .faq-common-primary .answer-wrapper {
    padding: 19px 0 23px;
  }

  .faq-common-primary .question-icon,
  .faq-common-primary .answer-icon {
    width: 28px;
    height: 28px;
    margin-right: 14px;
  }

  .faq-common-primary .question-content,
  .faq-common-primary .answer-content {
    top: 1px;
  }
}