.main__inner {
  max-width: 1240px;
  margin: 0 auto 100px;
  padding: 0 15px;
}

.faq {
  .faq__title {
    font-size: 36px;
    font-weight: 700;
    line-height: 34px;
    letter-spacing: 4%;
    margin-top: 46px;color: #0E3571;
  }

  .faq__inner {
    margin-top: 60px;
    display: flex;
    flex-direction: column;
    gap: 20px;
  }

  .faq_item {
    background-color: #f2f4f7;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    padding: 20px 52px 20px 46px;
    position: relative;
    transition: all 0.3s ease;
    cursor: pointer;

    &::after {
      content: "";
      background: url("data:image/svg+xml,%3Csvg%20width%3D%2214%22%20height%3D%228%22%20viewBox%3D%220%200%2014%208%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M13%201L7%207L1%201%22%20stroke%3D%22%23081B39%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E") no-repeat center / contain;
      height: 6px;
      position: absolute;
      right: 20px;
      top: 29px;
      width: 12px;
    }

    &.is_open {
      transition: all 0.3s ease;transform: scaleY(1);
      &::after {
        transform: scaleY(-1);
        transition: all 0.3s ease;
      }
      .faq_item__content {
        grid-template-rows: 1fr;

        p {
          margin-top: 23px;
          opacity: 1;
        }
      }
    }
  }

  .faq_item__title,
  .faq_item__content p {
    color: #081b39;
    font-size: 16px;
    font-weight: 500;
    position: relative;
    line-height: 1.5;
  }

  .faq_item__title {
    &::before {
      content: "Q";color: #081B39;font-weight: bold;font-size: 20px;
      
      display: inline-block;
      height: 32px;
      left: -20px;
      top: -3px;
      position: absolute;
    }
  }

  .faq_item__content {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s ease;
  }

  .faq_item__content > * {
    min-height: 0;
    overflow: hidden;
    margin-left: -19px;
    padding-left: 19px;
  }

  .faq_item__content p {
    margin-top: 0;
    opacity: 0;
    transition: all 0.3s ease;
  }

  .faq_item__content-inner > :first-child {
    position: relative;

    &::before {
      content: "A";color: #E80033;font-weight: bold;font-size: 20px;
      display: inline-block;
      height: 32px;
      left: -19px;
      position: absolute;
      top: -3px;
    }
  }
}


.search-open,/* モバイル版 : 絞り込むボタン(表示) */
.search-close,/* モバイル版 : 絞り込むボタン(クローズ) */
.sticky-buttons {
  /* モバイル版 : リセットや検索数、クローズボタンラッパー */
  display: none;
}

/* cta */
.contact-cta__inner {
  max-width: 1200px;
  margin: 0 auto;
  justify-content: space-between;

  .contact-cta__main {
    margin: 0;
    width: auto;

    .contact-cta_contact::before {
      background-image: url(../images/ico_mail_navy.png);
    }

    .contact-cta_catalog::before {
      background-image: url(../images/ico_book_navy.png);
    }
  }

  .contact-cta__main-text {
    color: #fff;
  }
}

@media (max-width: 767px) {
  .faq .faq__inner {
    /*gap: 12px;*/margin-top: 50px;
  }
  .faq .faq_item{padding: 20px 52px 20px 42px;}

  .faq {
    & .faq_item {
        &.is_open {
            & .faq_item__content {
                p {margin-top: 20px;}}}}}

  .contact-cta__inner {
    flex-direction: column;
    gap: 80px;

    .contact-cta__main {
      width: 100%;

      .contact-cta__link {
        justify-content: center;
      }
    }

    .contact-cta__link {
      width: 100%;

      .contact-cta__link-text {
        padding: 0;
      }
    }

    .contact-cta__main-text {
      margin-bottom: 0;
    }
  }

}


@media (max-width: 767px) {
.faq {
  .faq__title {
    font-size: 25px;
  }
    .faq_item__title {
        font-size: 14px;

    }
}
}

/* リンク */
.faq_item a:not(.wp-block-buttons a) {
  color: #003991;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: opacity 0.4s;

  &:hover {
    opacity: .6;
  }
}
/* 外部リンクアイコン */
a[target="_blank"]::after {
  content: "";
  width: 0.9375em;
  aspect-ratio: 15.187/15.037;
  display: inline-block;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="15.187" height="15.037" viewBox="0 0 15.187 15.037"><g id="link" transform="translate(-931.891 16.033)"><path id="パス_152" data-name="パス 152" d="M2696.319,348.091h-4.844l.036,9.858h9.718v-4.183" transform="translate(-1759.082 -359.444)" fill="none" stroke="%23124897" stroke-width="1"/><g id="flowKitConnector" transform="translate(931.104 -6.624) rotate(-45)"><path id="line" d="M0,0H9.539" transform="translate(3.029 4.557)" fill="none" stroke="%23124897" stroke-width="1"/><path id="rightEdge" d="M0,0,3.593,3.764,0,7.528" transform="translate(9.556 0.879)" fill="none" stroke="%23124897" stroke-width="1"/></g></g></svg>');
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

/* 本文内ボタン（topic.css のボタンスタイルをFAQ用に適用） */
.faq_item__content {
  .wp-block-buttons {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
    margin-bottom: 20px;

    .wp-block-button {
      font-size: 1.6rem;
      min-width: 350px;

      .wp-element-button {
        background-color: #003991;
        border: 1px solid #003991;
        transition: 0.4s;
        width: 100%;font-size:16px;padding: 19px;
        text-decoration: none;/* faq.css の a 指定を打ち消す */

        &:hover {
          background-color: #fff;
          color: #003991;
          opacity: 1;
        }
        &[target="_blank"]::after {
          content: none;
        }
      }

      /* 白抜きボタン */
      &.is-style-outline--1 {
        .wp-element-button {
          background-color: #fff;
          color: #003991;
          transition: 0.4s;

          &:hover {
            background-color: #003991;
            color: #fff;
          }
        }
      }

      /* ダウンロードボタン */
      &.is-style-btn-pdf-download,
      &.is-style-btn-doc-download {
        width: 100%;
        .wp-element-button {
          display: flex;
          align-items: center;
          gap: 9px;
          justify-content: flex-start;
          width: 100%;
          color: #e80033;
          background-color: #fff;
          border: 2px solid #e80033;
          border-radius: 8px;
          line-height: 1.688;
          padding: 15px 16px 15px 20px;
          transition:
            background-color 0.4s,
            color 0.4s;
          min-width: auto;
          &:hover {
            background-color: #e80033;
            color: #fff;
          }
        }

        /* アイコン部分 */
        .wp-block-button__link {
          &::after {
            content: "";
            display: inline-block;
            min-width: 15px;
            min-height: 15px;
            background: url(../images/product/ico_triangle_red.png) no-repeat
              center center / contain;
            margin: 0 0 0 auto;
            transition: background-image 0.4s;
          }
          &:hover::after {
            background: url(../images/product/ico_triangle_wht.png) no-repeat
              center center / contain;
          }
        }
        .wp-element-button {
          font-weight: 700;
          &::before {
            content: "";
            display: inline-block;
            min-width: 22px;
            min-height: 22px;
            transition: background-image 0.4s;
          }
        }
      }

      /* ダウンロードアイコンの出し分け */
      &.is-style-btn-pdf-download .wp-element-button {
        &::before {
          background: url(../images/product/ico_pdf_red.png) no-repeat center
            center / contain;
        }
        &:hover::before {
          background: url(../images/product/ico_pdf_wht.png) no-repeat center
            center / contain;
        }
      }
      &.is-style-btn-doc-download .wp-element-button {
        &::before {
          background: url(../images/product/ico_pdf_red.png) no-repeat center
            center / contain;
        }
        &:hover::before {
          background: url(../images/product/ico_pdf_wht.png) no-repeat center
            center / contain;
        }
      }
    }
  }
}

/* スマホ用 ボタン */
@media (max-width: 767px) {
  .faq_item__content {
    .wp-block-buttons {
      .wp-block-button {
        min-width: unset;
        width: 100%;

        .wp-block-button__link {
          font-size: 1.4rem;
          height: 60px;
        }

        a {
          align-items: center;
          display: flex;
          justify-content: center;
        }
      }

      .wp-element-button {
        font-size: 1.4rem;
      }
    }
  }
}