@charset "utf-8";
/* ======================
works
========================= */
.works {
  padding: clamp(50px, 17.45vw, 134px) 0 97px;
}
.works .content__head {
  margin-bottom: clamp(50px, 14.84vw, 114px);
}
.works .sec-heading {
  margin-bottom: 1.4em;
}
.works .content__head-txt {
  padding-left: 1.25em;
}
.works__list {
  display: flex;
  flex-wrap: wrap;
  gap: 70px 6.4%;
}
.works__item {
  width: calc(87.2% / 3);
}
.works__item a {
  font-size: max(14px, 0.97vw);
  line-height: 1.64;
  color: #fff;
}
.works__item .imgbk {
  margin-bottom: 15px;
  border-radius: 15px;
  aspect-ratio: 309 / 230;
  overflow: hidden;
}
.works__item .imgbk img {
  transition: transform 0.3s ease;
}
.works__item .imgbk img {
  transform: scale(1.1);
}
.works__item .works-date {
  font-size: max(14px, 0.97vw);
  line-height: 1.643;
  margin-bottom: 5px;
}
.works__item .works-ttl {
  font-size: max(16px, 1.11vw);
  line-height: 1.438;
  margin-bottom: 13px;
}
.works__item .equipment {
  font-size: max(15px, 1.04vw);
  line-height: 1;
  letter-spacing: 0.12em;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.works__item .equipment .equipment__item {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 8.667em;
  height: 2.3em;
  background: #fff;
  border: 1px solid #004896;
  border-radius: 5px;
}
@media screen and (max-width: 1170px) {
  .works__list {
    gap: 70px calc((100% - 924px) / 2);
  }
  .works__item {
    width: 308px;
  }
}
@media screen and (max-width: 1080px) {
  .works__list {
    gap: 70px 2%;
  }
  .works__item {
    width: 32%;
  }
}

@media screen and (max-width: 768px) {
  .works__list {
    justify-content: space-between;
    gap: max(40px, 9.11vw) 0;
    max-width: 642px;
    margin: 0 auto;
  }
  .works__item {
    width: 48%;
    max-width: 308px;
  }
  .works__item .works-ttl {
    font-size: clamp(13px, 4vw, 16px);
  }
  .works__item .equipment {
    font-size: clamp(13px, 3.73vw, 15px);
  }
}
@media screen and (max-width: 480px) {
  .works__list {
    flex-direction: column;
    align-items: center;
  }
  .works__item {
    width: 100%;
    max-width: 308px;
  }
}