@charset "UTF-8";
/* --------------------
ブレークポイントを指定
-------------------- */
/* --------------------
mixin
-------------------- */
/* ========================================
.accordion
======================================== */
.accordion {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.accordion__item {
  overflow: hidden;
}

.accordion__item-title {
  width: 90%;
}
@media screen and (min-width: 1001px) {
  .accordion__item-title br {
    display: none;
  }
}

.accordion__trigger {
  background: #BC3033;
  color: #fff;
  font-weight: bold;
  padding: 15px 20px;
  box-sizing: border-box;
  border: none;
  width: 100%;
  text-align: left;
  font-size: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.2s ease;
  line-height: 1.4;
}

.accordion__trigger:hover {
  background: #c73235;
}

.accordion__content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.accordion__content-inner {
  padding: 40px 0 20px;
}
.accordion__icon2 {
  width: 8px;
  height: 8px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);
  transition: transform 0.3s ease;
  margin-top: -4px;
}

.accordion__trigger--open .accordion__icon2 {
  transform: rotate(225deg);
  margin-top: 0;
}

/* ========================================
.archive-video
======================================== */
.archive-video__iframe-wrap {
  width: 100%;
  aspect-ratio: 16/9;
}

.archive-video__iframe-wrap iframe {
  width: 100%;
  height: 100%;
}

.archive-video__caption {
  margin-top: 5px;
}
.accordion__item .archive-video__caption {
  font-size: 11px;
}
@media screen and (min-width: 1001px) {
  .accordion__item .archive-video__caption {
    font-size: 15px;
  }
}

.archive-video__list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20px;
}
@media screen and (min-width: 1001px) {
  .archive-video__list {
    gap: 20px 40px;
  }
}

@media screen and (min-width: 1001px) {
  .archive-video__item {
    width: calc((100% - 40px) / 2);
  }
}

.archive-video__list--4column .archive-video__item {
  width: calc((100% - 20px) / 2);
}
@media screen and (min-width: 1001px) {
  .archive-video__list--4column .archive-video__item {
    width: calc((100% - 120px) / 4);
  }
}

/* ========================================
.lang_change-list
======================================== */
.lang_change-list {
  margin-top: 40px;
}/*# sourceMappingURL=archive.css.map */