@charset "UTF-8";

/* =====================
  MV
===================== */
.mv {
  background-image: url("/assets/img/news/bg_2x.png");
}

.mv::after {
  background-image: url("/assets/img/news/mv_2x.png");
}

/* =====================
  お知らせ一覧
===================== */
.article[data-id='1'] {
  padding-top: 15vw;
  padding-bottom: 16vw;
}

.news-wrap {
  margin-top: 9vw;
}

/*アコーディオン全体*/

.accordion-area section {
  border-bottom: 1px solid #ccc;
}

.accordion-area section:first-child {
  border-top: 1px solid #ccc;
}

/* ==== アコーディオンタイトル ==== */
/*日付とタグ*/
.date-wrap {
  display: flex;
  align-items: center;
  gap: 5.3vw;
}

.date-wrap .date {
  font-size: 3.466666666666667vw;
  color: #898c94;
}

.date-wrap .tag {
  width: 15.533333vw;
  height: 4.666666666666667vw;
  font-size: 3.2vw;
  line-height: 1;
  color: #002a87;
  padding: 0.8vw;
  border: solid 1px #002a87;
}

.title-wrap .news-title {
  margin-top: 4vw;
}

/*アイコンの＋と×*/
.title-wrap {
  position: relative;
  cursor: pointer;
  padding-block: 40px;
  padding-inline: 2.1333333333333333vw 14vw;
}

.title-wrap::after {
  content: '';
  display: block;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url("/assets/img/common/arrow_b_2x.png");
  width: 3.2vw;
  height: 3.2vw;
  position: absolute;
  top: 50%;
  right: 2.1333333333333333vw;
  transition: all .5s ease;
  transform: translateY(-50%) rotate(90deg);
}

/*　closeというクラスがついたら形状変化　*/
.title-wrap.close {
  padding-block: 6.666666666666667vw 3.4vw;
}

.title-wrap.close::after {
  transform: translateY(-50%) rotate(-90deg);
}

/*アコーディオンで現れるエリア*/
.box {
  display: none;
  /*はじめは非表示*/
  padding-inline: 2.1333333333333333vw;
  padding-bottom: 3.7333333333333334vw;
}