@charset "UTF-8";
/* Sassでpxからvwへの変換式を定義して使う */
.pc_vw {
  font-size: 1.6rem;
  /* font-size: 1.111vw; */
}

.sp_vw {
  font-size: 1.6rem;
  /* font-size: 4.267vw; */
}

/* faq */
.faq {
  background-color: #ccf0f6;
}

.faq-wrap {
  width: 85vw;
  margin: 0 auto;
  padding: 2.08333vw 0;
}

.faq-ttl {
  padding: 4.16667vw 0;
  font-size: 3.6rem;
  font-weight: bold;
  line-height: 1.22;
  letter-spacing: 0.125vw;
  color: #149bb4;
}

.faq-inner {
  width: 85vw;
  align-self: stretch;
  flex-grow: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2.08333vw;
  margin: 0 auto;
  padding: 40px 0 0;
  border-top: 2px solid #149bb4;
}

.faq-inner .faq-list {
  position: relative;
  background-color: #fff;
}

.faq-inner .faq-list a {
  position: relative;
  z-index: 2;
  display: block;
  width: 85vw;
  padding: 2.08333vw 2.77778vw;
}

.faq-inner .faq-list a:hover {
  box-shadow: 0 0 1.73611vw 0 rgba(19, 142, 177, 0.2);
}

.faq-inner .faq-list:after {
  position: absolute;
  z-index: 1;
  bottom: 0;
  right: 0;
  display: block;
  content: "";
  width: 3.61111vw;
  height: 3.61111vw;
  background: url(../img/arrow_right.png) no-repeat;
  background-size: cover;
}

.faq-inner .faq-tag {
  flex-grow: 0;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.69444vw;
  padding: 0;
  text-align: left;
}

.faq-inner .faq-tag li {
  display: inline-block;
  padding: 0.34722vw 1.04167vw;
  border-radius: 69.375vw;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.49;
  letter-spacing: 0.05556vw;
}

.faq-inner .faq-tag li.pink {
  border: solid 0.06944vw #eb647f;
  background-color: #fff2f3;
  color: #eb647f;
}

.faq-inner .faq-tag li.cha {
  border: solid 0.06944vw #c7911e;
  background-color: #fff6e4;
  color: #c7911e;
}

.faq-inner .faq-tag li.blue {
  border: solid 0.06944vw #3aaece;
  background-color: #dbf7ff;
  color: #1ea2c7;
}

.faq-inner .faq-txt {
  position: relative;
  margin-top: 1.38889vw;
  padding-left: 3.47222vw;
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.06944vw;
  text-align: left;
}

.faq-inner .faq-txt:before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  content: "";
  width: 2.22222vw;
  height: 2.22222vw;
  background: url(../img/ico_faq.png) no-repeat;
  background-size: cover;
}

@media print, screen and (max-width: 768px) {
  .faq-wrap {
    width: 100%;
    padding: 0;
  }
  .faq-ttl {
    padding: 5.33333vw 4.8vw;
    font-size: 2rem;
    line-height: 1.35;
    letter-spacing: 0.26667vw;
  }
  .faq-inner {
    width: 100%;
    flex-flow: column;
    padding: 0 5.33333vw;
    gap: 5.33333vw 0;
    border-top: none;
  }
  .faq-inner .faq-list a {
    width: 100%;
    padding: 5.33333vw 5.33333vw 7.46667vw;
  }
  .faq-inner .faq-list:after {
    width: 10.66667vw;
    height: 10.66667vw;
  }
  .faq-inner .faq-tag {
    gap: 1.06667vw;
  }
  .faq-inner .faq-tag li {
    padding: 0.53333vw 1.86667vw;
    font-size: 1.2rem;
    line-height: 1.98;
    letter-spacing: 0.16vw;
  }
  .faq-inner .faq-txt {
    margin-top: 4vw;
    padding-left: 6.66667vw;
    font-size: 1.4rem;
    line-height: 1.64;
    letter-spacing: 0.18667vw;
  }
  .faq-inner .faq-txt:before {
    width: 5.6vw;
    height: 5.6vw;
  }
}

.faq .pagenation {
  border-top: none;
}