.faq {
  position: relative;
}

.faq:not(:first-child) {
  padding-top: 30px;
}

.faq:last-of-type {
  margin-bottom: 40px;
}

.faq__question button {
  position: relative;
  padding: 13px 0 13px 40px;
  border: none;
  text-align: left;
  background: transparent;
  font: 700 1.6rem dnp-shuei-gothic-gin-std, sans-serif;
  line-height: 1.625;
  letter-spacing: 0.1em;
  width: 100%;
}

.faq__question button:before {
  content: "Q";
  width: 30px;
  height: 30px;
  border-radius: 50%;
  font-size: 1.3rem;
  font-family: europa, dnp-shuei-gothic-gin-std, sans-serif;
  font-weight: 400;
  background: #DEDEE5;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: absolute;
  top: 12px;
  left: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.faq__question--iwai button:before {
  background: #CEA888;
  color: #FFFFFF;
  padding-left: 3px;
  padding-bottom: 2px;
}

.faq__question--bene button:before {
  background: #EEE4D1;
  color: #606060;
}

.faq__answer {
  display: none;
  line-height: 2;
  letter-spacing: 0.08em;
  padding-left: 40px;
  margin: 1em 0;
}

.faq__answer p:not(:last-child),
.faq__answer ul:not(:last-child),
.faq__answer ol:not(:last-child) {
  margin-bottom: 1em;
}

.faq__trg {
  border: none;
  background: transparent;
  padding: 8px 0;
  position: relative;
  width: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  overflow: hidden;
  display: block;
  text-align: center;
  cursor: pointer;
  outline: none;
  -webkit-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s;
}

.faq__trg:focus {
  opacity: 0.6;
}

.faq__trg:before,
.faq__trg:after {
  content: "";
  display: block;
  width: calc(50% - 16px);
  height: 1px;
  background: #959595;
  position: absolute;
  top: 50%;
}

.faq__trg:before {
  left: 0;
}

.faq__trg:after {
  right: 0;
}

.faq__trg img {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.is-accordion-opend .faq__trg img {
  -webkit-transform: rotate(0);
  -ms-transform: rotate(0);
  transform: rotate(0);
}

@media screen and (min-width: 721px) {
  .faq:not(:first-child) {
    /* pc */
    padding-top: 28px;
  }

  .faq:last-of-type {
    /* pc */
    margin-bottom: 60px;
  }

  .faq__question button {
    /* pc */
    font-size: 2.0rem;
    padding: 20px 0 11px 65px;
  }

  .faq__question button:before {
    /* pc */
    font-size: 1.7rem;
    width: 36px;
    height: 36px;
    top: 20px;
  }

  .faq__answer {
    /* pc */
    padding-left: 65px;
    font-size: 1.5rem;
    line-height: 2.13;
    padding-bottom: 10px;
  }

  .faq__trg {
    /* pc */
    padding: 0 0;
  }

  .faq.is-hover .faq__trg {
    -webkit-transform: translateY(4px);
    -ms-transform: translateY(4px);
    transform: translateY(4px);
  }

  .faq.is-hover.is-accordion-opend .faq__trg {
    -webkit-transform: translateY(-4px);
    -ms-transform: translateY(-4px);
    transform: translateY(-4px);
  }
}
