@charset "UTF-8";
/*
index
-----------------------------------------------------*/
/*
i-functions
-----------------------------------------------------*/
/*
i-setting
-----------------------------------------------------*/
/*
i-mixin
-----------------------------------------------------*/
/* ------------------------- 使い方 ----------------------------------------------------------

    @include sizing(width, wide, 365px, sp, 276px);
    ==> width: clamp(276px, 7.46vw + 248px, 365px);
    （ビューポートがwide(1568px)のとき365px, sp(375px)のとき276pxになる自動補完値を上限下限をつけて設定）

    @include sizing(width, wide, 365px, sp, 276px, noClamp);
    ==> width: calc(7.46vw + 248px);
    （ビューポートがwide(1568px)のとき365px, sp(375px)のとき276pxになる自動補完値を設定）

    @include sizingRem(font-size, wide, 14px, sp, 12px);
    ==> font-size: clamp(0.75rem, 0.17vw + 0.70625rem, 0.875rem;
    （ビューポートがwide(1568px)のとき14px, sp(375px)のとき12pxになる自動補完値をremに変換して設定）
　　
    ※使いたいsassファイル上で@useしてください。
    ※scssファイル上での読みやすさ重視のため、mixinの引数に単位[px]が必要な仕様にしてあります。

// ---------------------------------------------------------------------------------------- */
/*
faq
-----------------------------------------------------*/
.p-faq-faqList h2 {
  cursor: pointer;
  position: relative;
  background: -webkit-gradient(linear, left top, right top, from(#77AEE4), to(#4E83D5));
  background: linear-gradient(0.25turn, #77AEE4, #4E83D5);
  border-radius: 0.75rem;
  color: #fff;
  font-weight: 600;
  padding-top: clamp(16px, 0.61vw + 14.1px, 24px);
  padding-bottom: clamp(15px, 0.53vw + 13.4px, 22px);
  padding-left: clamp(18px, 0.46vw + 16.5px, 24px);
  padding-right: clamp(64px, 1.98vw + 57.7px, 90px);
  font-size: clamp(20px, 0.61vw + 18.1px, 28px);
  -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
          box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.p-faq-faqList h2 i {
  -webkit-transition: 0.4s;
  transition: 0.4s;
  width: clamp(32px, 1.37vw + 27.7px, 50px);
  height: auto;
  aspect-ratio: 1/1;
  display: block;
  position: absolute;
  right: 20px;
  top: 50%;
  -webkit-transform: translate(0%, -50%);
          transform: translate(0%, -50%);
  border: 1px solid #fff;
  border-radius: 50%;
}
.p-faq-faqList h2:after {
  -webkit-transition: 0.4s;
  transition: 0.4s;
  content: "";
  display: block;
  display: inline-block;
  width: clamp(12px, 0.61vw + 10.1px, 20px);
  height: auto;
  aspect-ratio: 1/1;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  position: absolute;
  top: 45%;
  right: clamp(30px, 0.31vw + 28.9px, 34px);
  -webkit-transform: translate(0%, -50%) rotate(135deg);
          transform: translate(0%, -50%) rotate(135deg);
}
.p-faq-faqList h2.-open:after {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.p-faq-faqList dl {
  display: none;
}
.p-faq-faqList dl div {
  border-bottom: 1px solid #C0C0C0;
  padding-top: clamp(16px, 0.61vw + 14.1px, 24px);
  padding-bottom: clamp(15px, 0.53vw + 13.4px, 22px);
}
.p-faq-faqList dl div dt {
  position: relative;
  font-size: clamp(16px, 0.31vw + 14.9px, 20px);
  color: #080087;
  font-weight: 600;
  margin-bottom: 1rem;
}
.p-faq-faqList dl div dd {
  position: relative;
  font-size: clamp(16px, 0.31vw + 14.9px, 20px);
  padding: 0 0 0 1rem;
}
.p-faq-faqList + .p-faq-faqList {
  margin-top: clamp(32px, 0.61vw + 30.1px, 40px);
}
/*# sourceMappingURL=faq.css.map */