@charset "UTF-8";
/*よくある質問*/
.ttl_wrap {
  background: url(../images/faq/faq_top_p.jpg) no-repeat center center/cover;
}

.faq_wrap {
  width: 800px;
  margin: 110px auto 0;
}

.faq_wrap .accordionlist:not(:nth-of-type(1)) {
  margin-top: 45px;
}

.accordionlist dt {
  cursor: pointer;
  padding: 20px 60px 20px 55px;
  background: #818E87;
  color: #fff;
  position: relative;
}

.accordionlist dt:after {
  position: absolute;
  width: 20px;
  content: "";
  height: 1px;
  background: #fff;
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  right: 20px;
  top: 50%;
  transition: .3s all;
}

.accordionlist dt span {
  position: absolute;
  left: 24px;
  top: 20px;
}

.accordionlist dt:before {
  position: absolute;
  content: "";
  top: 0;
  width: 20px;
  background: #fff;
  height: 1px;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  top: 50%;
  right: 20px;
  transition: .3s all;
}

.accordionlist dt.active:before {
  display: none;
}

.accordionlist dt.active:after {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
}

.accordionlist dd {
  display: none;
  padding: 30px 25px 0 25px;
  margin-bottom: 45px;
}

@media (max-width: 999px) and (min-width: 641px) {
  .faq_wrap {
    width: 80vw;
    margin: 11vw auto 0;
  }
  .faq_wrap .accordionlist:not(:nth-of-type(1)) {
    margin-top: 4.5vw;
  }
  .accordionlist dt {
    cursor: pointer;
    padding: 2vw 6vw 2vw 5.5vw;
  }
  .accordionlist dt:after {
    width: 2vw;
    right: 2vw;
  }
  .accordionlist dt span {
    left: 2.4vw;
    top: 2vw;
  }
  .accordionlist dt:before {
    width: 2vw;
    right: 2vw;
  }
  .accordionlist dd {
    padding: 3vw 2.5vw 0 4.5vw;
    margin-bottom: 4.5vw;
  }
}

@media (max-width: 640px) {
  .ttl_wrap {
    background: url(../images/faq/faq_top_s.jpg) no-repeat center center/cover;
  }
  .faq_wrap {
    width: 78.12vw;
    margin: 9vw auto 0;
  }
  .faq_wrap .accordionlist:not(:nth-of-type(1)) {
    margin-top: 7.8vw;
  }
  .accordionlist dt {
    padding: 2.2vw 10vw 2.2vw 10vw;
    line-height: 1.6em;
  }
  .accordionlist dt:after {
    position: absolute;
    width: 3.42vw;
    content: "";
    right: 2.8vw;
    top: 50%;
  }
  .accordionlist dt span {
    position: absolute;
    left: 3.9vw;
    top: 2.2vw;
  }
  .accordionlist dt:before {
    width: 3.42vw;
    right: 2.8vw;
  }
  .accordionlist dd {
    padding: 8vw 3vw 0 3vw;
    margin-bottom: 7.8vw;
  }
}