@charset "utf-8";
#news {
  padding-bottom: 214px;
}

#news .subpage-header .subpage-header__bg {
  background-image: var(--bg-contact-mv);
}

#news .news__title .section-title__text-en {
  display: block;
  font-family: var(--font-tsukimi);
  font-size: 14px;
  letter-spacing: 0.12em;
  font-weight: 500;
  color: var(--color-orange);
  padding-top: 20px;
}

#news .news__title .section-title__text-ja {
  display: block;
  font-size: 30px;
  font-weight: 700;
  letter-spacing: 0.15em;
  color: var(--color-gray-medium);
  padding-top: 32px;
}

#news .news__list .news__title {
  padding-top: 48px;
  padding-bottom: 48px;
}

#news .news__list .news__post {
  width: 700px;
  margin: 0 auto;
}

#news .news__list .news__post .news__post-link {
  display: flex;
  flex-direction: row;
  gap: 32px;
  align-items: center;
  padding-top: 24px;
  padding-bottom: 24px;
  border-bottom: 0.5px solid var(--color-purple-light);
}

#news .news__list .news__post .news__post-link .news__post-date {
  font-family: var(--font-ibmplex);
  font-size: 12px;
  letter-spacing: 0.2em;
  font-weight: 600;
  text-align: left;
}

#news .news__list .news__post .news__post-title {
  font-family: var(--font-ibmplex);
  font-size: 12px;
  letter-spacing: 0.2em;
  font-weight: 600;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 100%;
}

/* ページネーション */
.news__pagination {
  display: flex;
  justify-content: center;
  list-style: none;
  gap: 30px;
  margin-top: 64px;
  font-family: var(--font-tsukimi);
  font-weight: 500;
  font-size: 14px;
}

.news__pagination .news__pagination-list {
  cursor: pointer;
}

.news__pagination .news__pagination-list:hover {
  color: var(--color-orange);
}

/* 背景画像 */
#news .news__bg-right,
#news .news__bg-left {
  position: absolute;
  background-repeat: no-repeat;
  background-position: left top;
  background-size: contain;
  z-index: -1;
}

#news .news__bg-right {
  background-image: var(--bg-wave-small);
  width: 207px;
  height: 240px;
  top: 20%;
  right: -160px;
}

#news .news__bg-left {
  background-image: var(--bg-wave-medium);
  width: 420px;
  height: 307px;
  left: -372px;
  top: 30%;
}

@media screen and (max-width: 960px) {
  #news .news__title .section-title__text-ja {
    font-size: 24px;
  }

  #news .news__list .news__post {
    width: 100%;
  }
  /*===========max-width:960px============*/
}

@media screen and (max-width: 768px) {
  #news .news__title .section-title__text-ja {
    padding-top: 24px;
    font-size: 18px;
  }
  /*===========max-width:768px============*/
}

@media screen and (max-width: 600px) {
  #news {
    padding-bottom: 80px;
  }

  #news .news__list .news__post .news__post-link {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding-bottom: 16px;
  }

  #news .news__bg-right {
    background-image: var(--bg-wave-small);
    width: 153px;
    height: 120px;
    top: 25%;
    right: -96px;
  }

  #news .news__bg-left {
    background-image: var(--bg-wave-medium);
    width: 210px;
    height: 153px;
    left: -186px;
    top: 40%;
  }

  /*===========max-width:600px============*/
}

/* シングルページ */

#news__post-s .subpage-header::before {
  top: -900px;
  z-index: -1;
}

.news__post-s-title {
  font-size: 22px;
  font-weight: 500;
  padding-bottom: 16px;
  line-height: 1.8;
}

.news__post-s-date {
  font-size: 14px;
  font-family: var(--font-tsukimi);
}
.news__post-s-content {
  padding-top: 64px;
  font-size: 14px;
}

@media screen and (max-width: 1400px) {
  #news__post-s .subpage-header::before {
    top: -600px;
  }
  /*===========max-width:1400px============*/
}

@media screen and (max-width: 960px) {
  #news__post-s .subpage-header::before {
    top: -280px;
  }
  /*===========max-width:960px============*/
}

@media (max-width: 600px) {
  .news__post-s-container {
    margin-top: 160px;
    padding-bottom: 200px;
  }
  #news__post-s .subpage-header::before {
    top: -200px;
  }

  .news__post-s-content {
    padding-top: 40px;
  }

  .news__post-s-title {
    font-size: 16px;
  }
  /*===========max-width:600px============*/
}
