/*===========================================================================*/
/*  function  */
/*===========================================================================*/
/*===========================================================================*/
/*  mixin  */
/*===========================================================================*/
.news,
.news-detail {
  background-color: #ffead1;
  /*===========================================================================*/
  /*  news_mainvisual  */
  /*===========================================================================*/
}
.news__mainvisual,
.news-detail__mainvisual {
  position: relative;
  z-index: 2;
  background: url(../../images/news/news_mainvisual.jpg) no-repeat center center/cover;
}
.news__mainvisual__title,
.news-detail__mainvisual__title {
  text-align: center;
  padding-top: clamp(100px, 21.3061825319px + 8.7340529931vw, 189px);
  padding-bottom: clamp(100px, 16.8851815505px + 9.2247301276vw, 194px);
  font-size: clamp(30px, 12.3159960746px + 1.9627085378vw, 50px);
  line-height: 1;
  font-weight: 900;
}
.news__mainvisual__title span,
.news-detail__mainvisual__title span {
  display: block;
  color: #ff883a;
  margin-bottom: 28px;
}

.news {
  /*===========================================================================*/
  /*  news_content  */
  /*===========================================================================*/
}
.news__content {
  padding-top: clamp(70px, 43.4739941119px + 2.9440628067vw, 100px);
}
@media (max-width: 900px) {
  .news__content {
    padding-top: clamp(40px, 18.5714285714px + 5.7142857143vw, 70px);
  }
}
.news__content__inner {
  background-color: #fff;
  border-radius: 20px 20px 0 0;
}
.news__content__buttons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(40px, -57.2620215898px + 10.7948969578vw, 150px);
  padding-top: clamp(24px, 18.6947988224px + 0.5888125613vw, 30px);
  padding-bottom: clamp(24px, 18.6947988224px + 0.5888125613vw, 30px);
  padding-left: clamp(16px, 8.9263984298px + 0.7850834151vw, 24px);
  padding-right: clamp(16px, 8.9263984298px + 0.7850834151vw, 24px);
  background-color: #d8e480;
  border-radius: 20px 20px 0 0;
}
@media (max-width: 900px) {
  .news__content__buttons {
    flex-wrap: wrap;
    column-gap: 4%;
    row-gap: 12px;
    padding-top: clamp(16px, 10.2857142857px + 1.5238095238vw, 24px);
    padding-bottom: clamp(16px, 10.2857142857px + 1.5238095238vw, 24px);
  }
}
.news__content__button {
  width: 100%;
  max-width: 250px;
  background-color: #fff;
  padding-top: clamp(8px, 6.2315996075px + 0.1962708538vw, 10px);
  padding-bottom: clamp(9px, 7.2315996075px + 0.1962708538vw, 11px);
  font-size: clamp(16px, 12.4631992149px + 0.3925417076vw, 20px);
  font-weight: 900;
  border: 3px solid #511f20;
  border-radius: 24px;
  text-align: center;
}
@media (max-width: 900px) {
  .news__content__button {
    width: 48%;
    font-size: clamp(14px, 12.2315996075px + 0.1962708538vw, 16px);
  }
}
.news__content__button[aria-selected=true] {
  background-color: #ff883a;
}
.news__content__list {
  padding-top: clamp(60px, 24.6319921492px + 3.9254170756vw, 100px);
  padding-bottom: clamp(52px, 16.6319921492px + 3.9254170756vw, 92px);
  padding-left: clamp(24px, 2.7791952895px + 2.3552502453vw, 48px);
  padding-right: clamp(24px, 2.7791952895px + 2.3552502453vw, 48px);
}
@media (max-width: 900px) {
  .news__content__list {
    padding-top: clamp(24px, -1.7142857143px + 6.8571428571vw, 60px);
    padding-bottom: clamp(18px, -6.2857142857px + 6.4761904762vw, 52px);
    padding-left: clamp(16px, 10.2857142857px + 1.5238095238vw, 24px);
    padding-right: clamp(16px, 10.2857142857px + 1.5238095238vw, 24px);
  }
}
.news__content__list:not([hidden]) {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  row-gap: clamp(60px, 42.3159960746px + 1.9627085378vw, 80px);
  column-gap: 16px;
}
@media (max-width: 900px) {
  .news__content__list:not([hidden]) {
    grid-template-columns: 1fr;
    row-gap: clamp(24px, -1.7142857143px + 6.8571428571vw, 60px);
  }
}
.news__content__item {
  position: relative;
}
.news__content__img {
  margin-bottom: clamp(14px, 3.3895976447px + 1.1776251227vw, 26px);
}
.news__content__img img {
  border-radius: 14px;
}
@media (max-width: 900px) {
  .news__content__img img {
    border-radius: 8px;
  }
}
.news__content__title {
  font-size: clamp(16px, 8.0421982336px + 0.883218842vw, 25px);
  font-weight: 700;
  line-height: 2;
}
@media (max-width: 900px) {
  .news__content__title {
    font-size: clamp(14px, 12.5714285714px + 0.380952381vw, 16px);
  }
}
.news__content__time {
  position: absolute;
  top: 0;
  left: 3%;
  color: #fff;
  background-color: #511f20;
  font-size: clamp(14px, 4.273797841px + 1.0794896958vw, 25px);
  font-weight: bold;
  padding-top: clamp(12px, -9.2208047105px + 2.3552502453vw, 36px);
  padding-bottom: clamp(12px, -9.2208047105px + 2.3552502453vw, 36px);
  padding-left: clamp(8px, -6.1472031403px + 1.5701668302vw, 24px);
  padding-right: clamp(8px, -6.1472031403px + 1.5701668302vw, 24px);
}

.news-detail__content {
  margin-top: clamp(60px, 24.6319921492px + 3.9254170756vw, 100px);
}
@media (max-width: 900px) {
  .news-detail__content {
    margin-top: clamp(40px, 25.7142857143px + 3.8095238095vw, 60px);
  }
}
.news-detail__content__inner {
  padding-top: clamp(40px, 4.6319921492px + 3.9254170756vw, 80px);
  background-color: #fff;
  border-radius: 20px;
}
@media (max-width: 900px) {
  .news-detail__content__inner {
    padding-top: clamp(24px, 12.5714285714px + 3.0476190476vw, 40px);
  }
}
.news-detail__content__flex {
  display: flex;
  align-items: flex-start;
  gap: clamp(30px, -7.1364082434px + 4.1216879293vw, 72px);
  margin-bottom: clamp(40px, -2.441609421px + 4.7105004907vw, 88px);
  padding-left: clamp(40px, 4.6319921492px + 3.9254170756vw, 80px);
  padding-right: clamp(40px, 4.6319921492px + 3.9254170756vw, 80px);
}
@media (max-width: 900px) {
  .news-detail__content__flex {
    flex-direction: column;
    gap: clamp(16px, 10.2857142857px + 1.5238095238vw, 24px);
    margin-bottom: clamp(24px, 12.5714285714px + 3.0476190476vw, 40px);
    padding-left: clamp(16px, -1.1428571429px + 4.5714285714vw, 40px);
    padding-right: clamp(16px, -1.1428571429px + 4.5714285714vw, 40px);
  }
}
.news-detail__content__img {
  flex-shrink: 0;
  width: clamp(400px, 46.3199214917px + 39.2541707556vw, 800px);
}
@media (max-width: 900px) {
  .news-detail__content__img {
    width: 100%;
  }
}
.news-detail__content__img img {
  border-radius: 20px;
}
.news-detail__content__main {
  font-weight: 700;
}
.news-detail__content__main .inner {
  display: flex;
  align-items: center;
  gap: clamp(24px, 9.8527968597px + 1.5701668302vw, 40px);
  margin-bottom: clamp(12px, 1.3895976447px + 1.1776251227vw, 24px);
}
@media (max-width: 900px) {
  .news-detail__content__main .inner {
    gap: clamp(12px, 3.4285714286px + 2.2857142857vw, 24px);
  }
}
.news-detail__content__main time {
  font-size: clamp(16px, 8.0421982336px + 0.883218842vw, 25px);
}
@media (max-width: 900px) {
  .news-detail__content__main time {
    font-size: clamp(14px, 12.5714285714px + 0.380952381vw, 16px);
  }
}
.news-detail__content__main .tag {
  padding: 8px 0;
  background-color: #fff;
  font-size: clamp(12px, 10.2315996075px + 0.1962708538vw, 14px);
  border: 3px solid #511f20;
  border-radius: 24px;
  text-align: center;
  width: clamp(120px, 49.2639842983px + 7.8508341511vw, 200px);
}
@media (max-width: 900px) {
  .news-detail__content__main .tag {
    padding: 2px 0;
  }
}
.news-detail__content__title {
  font-size: clamp(24px, 9.8527968597px + 1.5701668302vw, 40px);
  font-weight: 900;
  margin-bottom: clamp(24px, 9.8527968597px + 1.5701668302vw, 40px);
}
@media (max-width: 900px) {
  .news-detail__content__title {
    font-size: clamp(19px, 15.4285714286px + 0.9523809524vw, 24px);
    margin-bottom: clamp(16px, 10.2857142857px + 1.5238095238vw, 24px);
  }
}
.news-detail__content__text {
  font-size: clamp(14px, 12.2315996075px + 0.1962708538vw, 16px);
  line-height: 2.2;
}
.news-detail__content__button {
  display: flex;
  justify-content: center;
  margin-bottom: clamp(24px, 12.5714285714px + 3.0476190476vw, 40px);
  padding-left: clamp(16px, -1.1428571429px + 4.5714285714vw, 40px);
  padding-right: clamp(16px, -1.1428571429px + 4.5714285714vw, 40px);
}