@charset "UTF-8";
/* body#faq + main.archive-faq。子は .faq-panel__*（ブロック専用のため .faq-panel を挟まず指定）。セクション枠のみ .faq-panel。 */

/* ===== Pages / faq ===== */
@media (min-width: 768px) {
  #faq .archive-faq .faq-panel {
    max-width: 1920px;
    margin-inline: auto;
    background-color: #f3f1ef;
  }
  #faq .archive-faq .faq-panel__inner {
    padding-top: 50px;
    padding-bottom: 250px;
  }
  #faq .archive-faq .faq-panel__content {
    width: min(95%, 1440px);
    margin-inline: auto;
    padding-top: clamp(
      46px,
      12.67px + 4.34vw,
      96px
    ); /* 768px〜1920pxの間で可変 */
    padding-bottom: clamp(
      46px,
      23.33px + 2.951vw,
      80px
    ); /* 768px〜1920pxの間で可変 */
    padding-inline: clamp(
      20px,
      -20px + 5.208vw,
      80px
    ); /* 768px〜1920pxの間で可変 */
    background-color: #fff;
  }
  #faq .archive-faq .faq-panel__title-img {
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 82px;
  }
  #faq .archive-faq .faq-panel__title-img img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
  }
  #faq .archive-faq .faq-panel__title-en {
    text-align: center;
  }
  #faq .archive-faq .faq-panel__title {
    margin-top: 18px;
    font-size: 22px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.05em;
    color: #222;
    text-align: center;
  }
  #faq .archive-faq .faq-panel__lead {
    margin-top: 24px;
    font-size: clamp(
      14px,
      12.67px + 0.174vw,
      16px
    ); /* 768px〜1920pxの間で可変 */
    font-weight: 400;
    line-height: 2;
    letter-spacing: 0.05em;
    color: #222;
    text-align: center;
  }
  #faq .archive-faq .faq-panel__list {
    width: min(100%, 1100px);
    margin-inline: auto;
    margin-top: 40px;
  }
  #faq .archive-faq .faq-panel__list-item + .faq-panel__list-item {
    margin-top: clamp(
      10px,
      3.33px + 0.868vw,
      20px
    ); /* 768px〜1920pxの間で可変 */
  }
  #faq .archive-faq .faq-panel__question {
    margin: 0;
    padding: 0;
    display: block;
    width: 100%;
  }
  #faq .archive-faq .faq-panel__question-btn {
    appearance: none;
    -webkit-appearance: none;
    margin: 0;
    border: none;
    font: inherit;
    color: inherit;
    cursor: pointer;
    box-sizing: border-box;
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
    padding-block: clamp(
      10px,
      4.67px + 0.694vw,
      18px
    ); /* 768px〜1920pxの間で可変 */
    padding-left: 20px;
    padding-right: 70px;
    background-color: #f2eee9;
    text-align: left;
  }
  #faq .archive-faq .faq-panel__question-btn::before,
  #faq .archive-faq .faq-panel__question-btn::after {
    content: "";
    position: absolute;
    top: clamp(22px, 14px + 1.042vw, 34px);
    right: 26px;
    width: 12px;
    height: 2px;
    background-color: #222;
  }
  #faq .archive-faq .faq-panel__question-btn::before {
    transform: translateY(0);
  }
  #faq .archive-faq .faq-panel__question-btn::after {
    transform: translateY(0) rotate(-90deg);
    opacity: 1;
    transition:
      transform 0.35s ease,
      opacity 0.35s ease;
  }
  #faq
    .archive-faq
    .faq-panel__list-item.is-open
    .faq-panel__question-btn::after {
    transform: translateY(0) rotate(0deg);
    opacity: 0;
  }
  #faq .archive-faq .faq-panel__question-icon,
  #faq .archive-faq .faq-panel__answer-icon {
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 18px;
    flex-shrink: 0;
    margin-top: 0.3em;
  }
  #faq .archive-faq .faq-panel__question-icon img,
  #faq .archive-faq .faq-panel__answer-icon img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
  }
  #faq .archive-faq .faq-panel__question-text {
    font-size: clamp(
      14px,
      12.67px + 0.174vw,
      16px
    ); /* 768px〜1920pxの間で可変 */
    font-weight: 400;
    line-height: 2;
    letter-spacing: 0.05em;
    text-align: left;
    color: #222;
  }
  #faq .archive-faq .faq-panel__answer {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.35s ease;
  }
  #faq .archive-faq .faq-panel__answer-inner {
    overflow: hidden;
    min-height: 0;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 20px;
    padding-inline: 20px;
    opacity: 0;
    transition:
      padding 0.35s ease,
      opacity 0.2s ease;
  }
  #faq .archive-faq .faq-panel__answer-text {
    font-size: clamp(
      12px,
      10.67px + 0.174vw,
      14px
    ); /* 768px〜1920pxの間で可変 */
    font-weight: 400;
    line-height: 1.714285;
    letter-spacing: 0.05em;
    text-align: left;
    color: #222;
  }
  #faq .archive-faq .faq-panel__list-item.is-open .faq-panel__answer {
    grid-template-rows: 1fr;
  }
  #faq .archive-faq .faq-panel__list-item.is-open .faq-panel__answer-inner {
    padding-top: 14px;
    padding-bottom: 20px;
    opacity: 1;
  }
}

/* ======================================
      【SP】  faq
========================================= */
@media (max-width: 767px) {
  #faq .archive-faq .faq-panel {
    background-color: #f3f1ef;
  }
  #faq .archive-faq .faq-panel__inner {
    padding-top: 9.66vw;
    padding-bottom: 57.97vw;
    padding-inline: 2.9vw;
  }
  #faq .archive-faq .faq-panel__content {
    padding-top: 12.56vw;
    padding-bottom: 9.66vw;
    padding-inline: 6.04vw;
    background-color: #fff;
  }
  #faq .archive-faq .faq-panel__title-en {
    text-align: center;
  }
  #faq .archive-faq .faq-panel__title-img {
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 65px;
  }
  #faq .archive-faq .faq-panel__title-img img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
  }
  #faq .archive-faq .faq-panel__title {
    margin-top: 3.86vw;
    font-size: 3.86vw;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.05em;
    color: #222;
    text-align: center;
  }
  #faq .archive-faq .faq-panel__lead {
    margin-top: 7.25vw;
    font-size: 3.38vw;
    font-weight: 400;
    line-height: 2.142857;
    letter-spacing: 0.05em;
    color: #222;
  }
  #faq .archive-faq .faq-panel__list {
    margin-top: 10.63vw;
  }
  #faq .archive-faq .faq-panel__list-item + .faq-panel__list-item {
    margin-top: 4.83vw;
  }
  #faq .archive-faq .faq-panel__question {
    margin: 0;
    padding: 0;
    display: block;
    width: 100%;
  }
  #faq .archive-faq .faq-panel__question-btn {
    appearance: none;
    -webkit-appearance: none;
    margin: 0;
    border: none;
    font: inherit;
    color: inherit;
    cursor: pointer;
    box-sizing: border-box;
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 2.42vw;
    width: 100%;
    padding-block: 4.11vw;
    padding-left: 3.86vw;
    padding-right: 10.14vw;
    background-color: #f2eee9;
    text-align: left;
  }
  #faq .archive-faq .faq-panel__question-btn::before,
  #faq .archive-faq .faq-panel__question-btn::after {
    content: "";
    position: absolute;
    top: 7.25vw;
    right: 4.35vw;
    width: 2.9vw;
    height: 0.48vw;
    background-color: #222;
  }
  #faq .archive-faq .faq-panel__question-btn::before {
    transform: translateY(0);
  }
  #faq .archive-faq .faq-panel__question-btn::after {
    transform: translateY(0) rotate(-90deg);
    opacity: 1;
    transition:
      transform 0.35s ease,
      opacity 0.35s ease;
  }
  #faq
    .archive-faq
    .faq-panel__list-item.is-open
    .faq-panel__question-btn::after {
    transform: translateY(0) rotate(0deg);
    opacity: 0;
  }
  #faq .archive-faq .faq-panel__question-icon,
  #faq .archive-faq .faq-panel__answer-icon {
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 2.9vw;
    flex-shrink: 0;
    margin-top: 0.3em;
  }
  #faq .archive-faq .faq-panel__question-icon img,
  #faq .archive-faq .faq-panel__answer-icon img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
  }
  #faq .archive-faq .faq-panel__question-text {
    font-size: 3.86vw;
    font-weight: 400;
    line-height: 1.625;
    letter-spacing: 0.05em;
    text-align: left;
    color: #222;
  }
  #faq .archive-faq .faq-panel__answer {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.35s ease;
  }
  #faq .archive-faq .faq-panel__answer-inner {
    overflow: hidden;
    min-height: 0;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 2.42vw;
    padding-inline: 3.86vw;
    opacity: 0;
    transition:
      padding 0.35s ease,
      opacity 0.2s ease;
  }
  #faq .archive-faq .faq-panel__answer-text {
    font-size: 3.38vw;
    font-weight: 400;
    line-height: 1.714285;
    letter-spacing: 0.05em;
    text-align: left;
    color: #222;
  }
  #faq .archive-faq .faq-panel__list-item.is-open .faq-panel__answer {
    grid-template-rows: 1fr;
  }
  #faq .archive-faq .faq-panel__list-item.is-open .faq-panel__answer-inner {
    padding-block: 4.83vw;
    opacity: 1;
  }
}