@font-face {
  font-family: "simplifica";
  src: url(../font/SIMPLIFICA-Typeface.ttf);
}
@font-face {
  font-family: "din";
  src: url(../font/DINNextLTPro-Light.otf);
}
.works .works__container {
  display: flex;
  flex-wrap: wrap;
}
.works .works__container .woks__post {
  display: block;
  width: 28%;
  margin-bottom: 8vh;
}
@media screen and (max-width:480px), screen and (max-width:767px) {
  .works .works__container .woks__post {
    width: 48%;
  }
  .works .works__container .woks__post:nth-of-type(2n) {
    margin-left: 4%;
  }
}
.works .works__container .woks__post:not(:nth-of-type(3n)) {
  margin-right: 8%;
}
@media screen and (max-width:480px), screen and (max-width:767px) {
  .works .works__container .woks__post:not(:nth-of-type(3n)) {
    margin-right: 0;
  }
}
.works .works__container .woks__post .worksPost__title {
  font-size: 1.4vw;
  margin-top: 1.8vh;
  line-height: 1.3;
}
@media screen and (max-width:480px), screen and (max-width:767px) {
  .works .works__container .woks__post .worksPost__title {
    font-size: 4vw;
  }
}
.works .worksPost__container {
  display: flex;
}
@media screen and (max-width:480px), screen and (max-width:767px) {
  .works .worksPost__container {
    flex-direction: column;
  }
}
.works .worksPost__container:not(:last-of-type) {
  margin-bottom: 2vh;
}
@media screen and (max-width:480px), screen and (max-width:767px) {
  .works .worksPost__container:not(:last-of-type) {
    margin-bottom: 1.2vh;
  }
}
.works .worksPost__container:last-of-type {
  margin-bottom: 18vh;
}
@media screen and (max-width:480px), screen and (max-width:767px) {
  .works .worksPost__container:last-of-type {
    margin-bottom: 5vh;
  }
}
.works .worksPost__container .worksPost__img {
  display: flex;
  width: 56%;
  margin-right: 4%;
}
@media screen and (max-width:480px), screen and (max-width:767px) {
  .works .worksPost__container .worksPost__img {
    width: 100%;
  }
}
.works .worksPost__container .img__text {
  display: block;
  letter-spacing: 0.1em;
  color: #A57C52;
  font-size: 1.4vw;
}
@media screen and (max-width:480px), screen and (max-width:767px) {
  .works .worksPost__container .img__text {
    display: none;
  }
}
.works .worksPost__container .worksPost__description {
  width: 27%;
  font-size: 1.13vw;
  line-height: 2.2;
  text-align: justify;
  text-justify: inter-ideograph;
}
@media screen and (max-width:480px), screen and (max-width:767px) {
  .works .worksPost__container .worksPost__description {
    width: 100%;
    font-size: 1.8vh;
    font-weight: 500;
    margin-top: 1vh;
  }
}
.works .worksPost__container.--reverse {
  justify-content: flex-end;
}
.works .worksPost__container.--reverse .worksPost__img {
  margin-right: 0;
}
.works .instaButton {
  width: 45%;
  margin: 5vh auto 8vh;
  display: block;
}
@media screen and (max-width:480px), screen and (max-width:767px) {
  .works .instaButton {
    width: 100%;
    margin-top: 2vh;
  }
}

@media screen and (min-width:768px) {
  .worksPost .commonTitle {
    margin-bottom: 4.4vh !important;
  }
}
.worksPost .commonTitle .ja::before {
  top: 26%;
  transform: translateY(0);
}
.worksPost .commonTitle .small {
  font-size: 2vw;
}

.worksPost__main .inner {
  padding-bottom: 18vh;
}
@media screen and (max-width:480px), screen and (max-width:767px) {
  .worksPost__main .inner {
    padding-bottom: 5.4vh;
  }
}
@media screen and (max-width:480px), screen and (max-width:767px) {
  .worksPost__main .linkButton {
    max-width: 85%;
  }
}