@charset "utf-8";

.sub_sec-news {
}

/*---------------------------------
    sub_sec-news
----------------------------------*/
.news_inner {
}
.news_container {
  /* margin-bottom: 5rem; */
}

/*-------------------------------------
        responsive
-------------------------------------*/
/*-------------tab-----------------------*/
@media screen and (max-width: 960px) and (min-width: 600px) {
}
/*-------------SP-----------------------*/
@media screen and (max-width: 599px) {
}

/*---------------------------------
    詳細ページ
----------------------------------*/

.works-detail_wrap {
  width: 100%;
  padding: 3rem 5rem 5rem 5rem;
  background: #fff;
  border-radius: 2rem;
}
.detail_inner {
  width: 100%;
  margin-bottom: 6rem;
}
.detail_date {
  width: 100%;
  font-size: 2rem;
  font-weight: 500;
  line-height: 1;
  margin-block: 0.8em 0.2em;
  text-align: right;
}
.news_ttl {
  margin-bottom: 0.8em;
  padding-left: 0.5em;
  font-size: 3rem;
  font-weight: 500;
  line-height: 1.4;
  position: relative;
}
.news_ttl::after {
  width: 0.2em;
  height: 100%;
  background: var(--color_orange);
  position: absolute;
  left: 0;
  bottom: 0;
  display: block;
  content: "";
}

.detail_img_list {
  margin-bottom: 3rem;
  display: flex;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 2.5rem;
}
.detail_img_item {
  width: calc((100% - 2.5rem) / 2);
}

/*-------------------------------------
        responsive
-------------------------------------*/
/*-------------tab-----------------------*/
@media screen and (max-width: 960px) and (min-width: 600px) {
  .sec_w-detail .inner_width {
    width: 100%;
    max-width: unset;
  }
}
/*-------------SP-----------------------*/
@media screen and (max-width: 599px) {
  .works-detail_wrap {
    padding-inline: 4rem;
  }
  .detail_inner {
    margin-bottom: 6rem;
  }
  .detail_date {
    font-size: clamp(16px, 3.2rem, 32px);
  }
  .news_ttl {
    font-size: clamp(18px, 3.8rem, 38px);
  }
  .detail_img_list {
    margin-bottom: 5rem;
    gap: 2.5rem;
  }
  .detail_img_item {
    width: 100%;
  }
}
/* 20250108 */
picture.max-h {
  display: flex;
  aspect-ratio: 4 / 3;
  gap: 15px;
}
@media screen and (max-width: 599px) {
  picture.max-h {
    display: flex;
    aspect-ratio: 4 / 3;
    gap: 15px;
    flex-direction: column;
  }
}