@charset "UTF-8";
/************************
画像バナーでの開閉要素。
.curriculum > .inner > .accordion-item > .accordion-item__trigger
の要素があることが前提。
************************/

.accordion-item.accordion-item--bg-image>.accordion-item__trigger {
    background-image: none;
    background-size: cover;
    background-repeat: no-repeat;
    background-position-y: center;
    aspect-ratio: 20 / 8;
    max-width: 1000px;
  }

  @media screen and (min-width: 600px) {
    .accordion-item.accordion-item--bg-image>.accordion-item__trigger {
      aspect-ratio: 20 / 4;
    }
  }

  .accordion-item.accordion-item--bg-image>.accordion-item__trigger:before {
    background-color: var(--color-base-sub) !important;
    opacity: .3;
  }

  .accordion-item.accordion-item--bg-image>.accordion-item__trigger:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #00000055;
    z-index: 0;
  }

  .accordion-item.accordion-item--bg-image>.accordion-item__trigger h2 {
    color: #ffffff !important;
    font-size: 1.3571428571428572em;
    line-height: 1.6;
  }

  @media screen and (min-width: 600px) {
    .accordion-item.accordion-item--bg-image>.accordion-item__trigger h2 {
      font-size: 1.4285714285714286em;
    }
  }

  @media screen and (min-width: 800px) {
    .accordion-item.accordion-item--bg-image>.accordion-item__trigger h2 {
      font-size: 1.8571428571428572em;
    }
  }

  @media screen and (min-width: 1000px) {
    .accordion-item.accordion-item--bg-image>.accordion-item__trigger h2 {
      font-size: 1.4285714285714286em;
    }
  }

  @media screen and (min-width: 1200px) {
    .accordion-item.accordion-item--bg-image>.accordion-item__trigger h2 {
      font-size: 2em;
    }
  }

  .accordion-item.accordion-item--bg-image .accordion-item__trigger .toggle-icon:before,
  .accordion-item.accordion-item--bg-image .accordion-item__trigger .toggle-icon:after {
    background-color: #ffffff !important;
  }