.heading {
  max-width: 100%;
  overflow: hidden visible;
  text-align: center;
}
.heading-ja {
  color: #349639;
  transform-origin: center;
  scale: 1.3 1;
  width: fit-content;
  margin-inline: auto;
}
.heading-en {
  font-family: var(--fontEnW);
}
.heading-sub {
  margin-inline: auto;
  border-radius: 100vmax 0 100vmax 100vmax;
  border: 2px solid #349639;
  color: #349639;
  line-height: 1;
  text-align: center;
}

@media screen and (min-width:751px) {
  main {
    padding-top: 183px;
    padding-bottom: 100px;
  }
  .heading-ja {
    font-size: 60px;
  }
  .heading-en {
    margin-top: 7px;
    font-size: 19px;
  }
  .heading-sub {
    margin-top: 22px;
    padding-block: 29px;
    width: 658px;
    font-size: 28px;
    letter-spacing: 0.01em;
  }
}
@media screen and (max-width:750px) {
  main {
    padding-top: 27.2vw;
    padding-bottom: 26vw;
  }
  .heading-ja {
    font-size: 5.867vw;
  }
  .heading-en {
    margin-top: 2vw;
    font-size: 2.667vw;
  }
  .heading-sub {
    margin-top: 4vw;
    padding-block: 3.6vw;
    width: 64vw;
    font-size: 3.733vw;
  }
}

.content-wrap {
  box-sizing: content-box;
  margin-inline: auto;
}
article {
  position: relative;
}
article a {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}

article .kininaru-wap {
  position: absolute;
  z-index: 1;
  aspect-ratio: 1 / 1;
}

article .txt_info-wrap {
  border-top: 1px solid #d2d2d2;
  width: 100%;
  color: #349639;
}
article .SA-wrap {
  position: absolute;
  border-radius: 100vmax 100vmax 100vmax 0;
  background-color: #349639;
  color: #fff;
  box-sizing: border-box;
}
article .SA_wood_ttl,
article .SA_carbon_ttl {
  color: #000;
  line-height: 1;
}
/* article .SA_wood_icon,
article .SA_carbon_icon {
  vertical-align: text-bottom;
} */
/* article .SA_wood_vol,
article .SA_carbon_vol {
  white-space: nowrap;
} */

article .SA_wood_vol strong,
article .SA_carbon_vol strong {
  font-weight: normal;
  /* font-family: var(--fontEnW); */
}
sub {
  font-size: .6em;
}
article .img-container {
  position: relative;
}
article .img-wrap {
  background-color: #f7f5ef;
  aspect-ratio: 1 / 0.669;
  box-sizing: content-box;
  border: 2px solid #000;
}
article .img-wrap img {
  margin-inline: auto;
  width: auto;
  height: calc(100% + 1px);
  object-fit: cover;
  object-position: center;
}
article .img-container .wood_tag {
  position: absolute;
  z-index: 1;
  bottom: 0px;
  left: 0px;
}

article .txt-wrap h4 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media screen and (min-width:751px) {
  .content-wrap {
    margin-top: 147px;
    padding-inline: 20px;
    max-width: 1200px;
  }
  .content-container {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(auto-fit, 576px);
    grid-template-rows: auto;
    justify-content: space-evenly;
    align-items: start;
    column-gap: 4%;
    row-gap: 77px;
  }
  article {
    aspect-ratio: 1 / 0.83446;
    position: relative;
    overflow-wrap: anywhere;
    word-break: normal;
    /* line-break: strict; */
  }

  article .kininaru-wap {
    width: 125px;
    top: -13px;
    right: -13px;
  }
  article .img-wrap {
    overflow: hidden;
    border-radius: 100vmax 100vmax 100vmax 0;
  }
  article .img-container .wood_tag.mokushitsu {width: 64px;}
  article .img-container .wood_tag.mokuzou {width: 64px;}
  article .img-container .wood_tag.zoushitsu {width: 104px;}
  article .txt-wrap {
    margin-top: 18px;
    width: 59.375%;
  }
  article .txt-wrap h4 {
    font-size: 20px;
    line-height: 1.6;
  }
  article .txt_info-wrap {
    margin-top: 9px;
    padding-top: 8px;
  }
  article .txt_info-wrap ul li {
    font-size: 13px;
    line-height: 1.846;
  }
  article .SA-wrap {
    /* top: 230px; */
    bottom: 52px;
    right: 8px;
    padding: 37px 25px 34px 35px;
    width: min(188px, 32.638%);
  }
  article .SA-wrap:has(.SA_carbon-wrap) .SA_wood-wrap {
    margin-top: 12px;
  }
  article .SA_wood_ttl {
    display: flex;
    align-items: center;
    font-size: 11px;
    letter-spacing: 0.05em;
  }
  article .SA_wood_vol {
    margin-top: 8px;
    line-height: 1;
  }
  article .SA_wood_vol small {
    margin-right: 0.2em;
    font-size: 10px;
  }
  article .SA_wood_vol strong{
    font-size: 26px;
  }
  article .SA_wood_vol .unit {
    margin-left: 3px;
    font-size: 12px;
  }
  article .SA_wood_icon {
    display: inline-block;
    margin-right: 3px;
    width: 8px;
  }

  article .SA_carbon-wrap:nth-child(2) {
    margin-top: 10px;
    padding-top: 14px;
    border-top: 1px solid #fff;
  }
  article .SA_carbon_ttl {
    margin-left: -2px;
    display: flex;
    align-items: center;
    font-size: 11px;
    letter-spacing: 0.05em;
  }
  article .SA_carbon_vol {
    margin-top: 7px;
    line-height: 1;
  }
  article .SA_carbon_vol small {
    margin-right: 0.2em;
    font-size: 10px;
  }
  article .SA_carbon_vol strong{
    font-size: 26px;
  }
  article .SA_carbon_vol .unit {
    margin-left: 5px;
    font-size: 12px;
  }
  
  article .SA_carbon_icon {
    display: inline-block;
    margin-right: 2px;
    width: 11px;
  }
}
@media screen and (max-width:750px) {
  .content-wrap {
    margin-top: 16.667vw;
    margin-inline: auto;
    width: 84%;
  }
  .content-container {
    display: contents;
  }
  article {
    /* aspect-ratio: 1 / 1; */
    position: relative;
    overflow-wrap: anywhere;
    word-break: normal;
    /* line-break: strict; */
  }
  article .kininaru-wap {
    width: 17.994vw;
    top: -1.466vw;
    right: -0.4vw;
  }
  article + article {
    margin-top: 12vw;
  }
  article .img-wrap {
    overflow: hidden;
    border-radius: 100vmax 100vmax 100vmax 0;
  }
  article .img-container .wood_tag {
    bottom: -9.6vw;
  }
  /* 片方ある場合 */
  article:has(.SA_wood-wrap) .wood_tag,
  article:has(.SA_carbon-wrap) .wood_tag {
    bottom: -9.6vw;
  }
  /* 両方ある場合 */
  article:has(.SA_wood-wrap):has(.SA_carbon-wrap) .wood_tag {
    bottom: -14.933vw;
  }
  /* どちらもない場合 */
  article .img-container:not(:has(+ .SA-wrap)) .wood_tag {
    bottom: -10.131vw;
  }

  article .img-container .wood_tag.mokushitsu {width: 11.133vw;}
  article .img-container .wood_tag.mokuzou {width: 11.133vw;}
  article .img-container .wood_tag.zoushitsu {width: 18.599vw;}
  article .txt-wrap {
    /* margin-top: 7.733vw; */
    margin-top: 11.466vw;
  }
  /* 片方ある場合 */
  article .SA-wrap:has(.SA_wood-wrap) + .txt-wrap,
  article .SA-wrap:has(.SA_carbon-wrap) + .txt-wrap {
    margin-top: 2.133vw;
  }
  /* 両方ある場合 */
  article .SA-wrap:has(.SA_wood-wrap):has(.SA_carbon-wrap) + .txt-wrap {
    margin-top: 7.466vw;
  }
  /* どちらもない場合 */
  .SA-wrap:not(:has(.SA_wood-wrap)):not(:has(.SA_carbon-wrap)) + .txt-wrap {
    margin-top: 11.466vw;
  }
  article .txt-wrap h4 {
    font-size: 3.734vw;
    line-height: 1.428;
  }
  article .txt_info-wrap {
    margin-top: 0.267vw;
    padding-top: 2.133vw;
  }
  article .txt_info-wrap ul li {
    font-size: 3.467vw;
    line-height: 1.56;
  }

  article .SA-wrap {
    margin-top: -11.333vw;
    margin-left: auto;
    position: relative;
    padding: 5.333vw 6.4vw 4.533vw 6.933vw;
    border-radius: 100vmax 100vmax 0 100vmax;
    width: 41.44vw;
    display: flex;
    align-items: start;
    justify-content: center;
  }
  article .SA-wrap:has(.SA_wood-wrap):has(.SA_carbon-wrap) {
    width: 75vw;
  }
  article .SA_wood_ttl {
    display: flex;
    align-items: center;
    font-size: 2.933vw;
    letter-spacing: 0.05em;
  }
  article .SA_wood_vol {
    margin-top: 1.6vw;
    line-height: 1;
    white-space: nowrap;
  }
  article .SA_wood_vol small {
    margin-right: 0.2em;
    font-size: 2.667vw;
  }
  article .SA_wood_vol strong{
    font-size: 5.867vw;
    letter-spacing: 0.01em;
  }
  article .SA_wood_vol .unit {
    margin-left: 1.333vw;
    font-size: 3.2vw;
  }
  article .SA_wood_icon {
    display: inline-block;
    margin-right: 1.333vw;
    width: 2.106vw;
  }

  /* article .SA_carbon-wrap {
    margin-left: 4.267vw;
    padding-left: 4.667vw;
    border-left: 1px solid #fff;
  } */
   article .SA_carbon-wrap:nth-child(2)  {
    margin-left: 4.267vw;
    padding-left: 4.667vw;
    border-left: 1px solid #fff;
  }
  
  article .SA_carbon_ttl {
    margin-left: 0;
    display: flex;
    align-items: center;
    font-size: 2.933vw;
    letter-spacing: 0.05em;
  }
  article .SA_carbon_vol {
    margin-top: 1.6vw;
    line-height: 1;
    white-space: nowrap;
  }
  article .SA_carbon_vol small {
    margin-right: 0.2em;
    font-size: 2.667vw;
  }
  article .SA_carbon_vol strong{
    font-size: 5.867vw;
  }
  article .SA_carbon_vol .unit {
    margin-left: 1.333vw;
    font-size: 3.2vw;
    letter-spacing: 0.03em;
  }
  article .SA_carbon_icon {
    display: inline-block;
    margin-right: 0.933vw;
    width: 2.742vw;
  }
}

.works-nav-wrap {
  display: block;
}
.works-nav-inner {
  position: relative;
  margin-inline: auto;
  width: fit-content;
  display: flex;
  justify-content: center;
  align-items: center;
}
.works-nav-prev {
  position: absolute;
  left: 0;
}
.works-nav-next {
  position: absolute;
  right: 0;
}
.works-nav-prev,
.works-nav-next {
  display: block;
  border-top: 1px solid #349639;
  height: auto;
  aspect-ratio: 1 / 1;
  transform-origin: center;
}
.works-nav_nombre {
  margin-inline: auto;
}
.works-nav_nombre a.current {
  color: #349639;
}
.works-nav-prev {
  border-left: 1px solid #349639;
  rotate: -45deg;
}
.works-nav-next {
  border-right: 1px solid #349639;
  rotate: 45deg;
}
@media screen and (min-width:751px) {
  .works-nav-wrap {
    margin-top: 125px;
  }
  .works-nav-prev,
  .works-nav-next {
    width: 22px;
  }
  .works-nav_nombre {
    padding-inline: 60px;
  }
  .works-nav_nombre a {
    font-size: 18px;
  }
  .works-nav_nombre > * + * {
    margin-left: 15px;
  }
}
@media screen and (max-width:750px) {
  .works-nav-wrap {
    margin-top: 14.4vw;
  }
  .works-nav_nombre {
    padding-inline: 14.4vw;
  }
  .works-nav-prev,
  .works-nav-next {
    width: 5.093vw;
  }
  .works-nav_nombre a {
    font-size: 3.733vw;
  }
  .works-nav_nombre > * + * {
    margin-left: 4vw;
  }
}