@charset "UTF-8";

:root {
  --font-family-CN: 'Times New Roman', 'STSong', 'SimSun', serif !important;
  --font-family: "Noto Sans Japanese", sans-serif !important;
}
/*--------------------------
 common
----------------------------*/
.c-head {
  font-size: calc(19 / 375 * 100vw);
  font-weight: 500;
  text-align: center;
  font-family: var(--font-family-CN);
  line-height: 1.6;
}
@media all and (min-width: 767px) {
  .c-head {
    font-size: 26px;
    color: #1e1e1e;
  }
}
.c-head2 {
  font-weight: 500;
  font-size: calc(18 / 375 * 100vw);
  font-family: var(--font-family-CN);
  letter-spacing: 0.06em;
  line-height: 1.7;
  text-align: center;
  color: #1e1e1e;
  padding-bottom: 7px;
  border-bottom: 1px solid #333;
}
.c-head2 span {
  font-size: 80%;
}
@media all and (min-width: 767px) {
  .c-head2 {
    font-size: 20px;
  }
}
.c-txt {
  margin: 3vw 0;
  font-size: calc(14 / 375 * 100vw);
  letter-spacing: 0.04em;
  line-height: 1.7;
}
@media all and (min-width: 767px) {
  .c-txt {
    margin: 10px 0;
    font-size: calc(14 / 750 * 100vw);
  }
}
@media all and (min-width: 960px) {
  .c-txt {
    font-size: 15px;
  }
}
.item-detail-story__img {
  margin: 8vw 0;
}
@media all and (min-width: 767px) {
  .item-detail-story__img {
    margin: 80px 0;
  }
}
/*--------------------------
 design
----------------------------*/
.design-img {
  width: 95vw;
  margin-inline: calc(50% - 50vw);
  margin-top: 11vw;
  margin-bottom: 5vw;
}
.design-details {
  display: flex;
  flex-wrap: wrap;
  gap: 13vw;
}
.design-details li h3 {
  font-weight: 500;
  font-family: var(--font-family-CN);
  font-size: calc(18 / 375 * 100vw);
  letter-spacing: 0.04em;
}
.design-details li h3 span {
  padding-right: 2vw;
  font-family: var(--font-family);
  font-size: 7vw;
  vertical-align: top;
  color: #eb6168;
}
.design-details .c-txt br {
  display: none;
}
@media all and (min-width: 767px) {
  .design-img {
    max-width: 750px;
    margin: 50px auto 30px;
  }
  .design-details {
    flex-wrap: nowrap;
    justify-content: space-between;
    gap: 20px;
  }
  .design-details li {
    width: calc(100% / 3);
  }
  .design-details li h3 {
    font-size: calc(18 / 750 * 100vw);
    letter-spacing: 0.04em;
  }
  .design-details li h3 span {
    font-size: 24px;
    padding-right: 8px;
  }
}
@media all and (min-width: 960px) {
  .design-details li h3 {
    font-size: 18px;
  }
}
@media all and (min-width: 1280px) {
  .design-details .c-txt br {
    display: block;
  }
}
/*--------------------------
 structure
----------------------------*/
.structure-box {
  display: flex;
  flex-wrap: wrap;
}
.structure-box figure {
  margin: 0 0 8vw;
}
.structure-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6vw;
}
@media all and (min-width: 767px) {
  .structure-box {
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
  }
  .structure-box figure {
    width: 48%;
    margin: 0;
  }
  .structure-box p {
    width: 48%;
  }
  .structure-images {
    margin-top: 40px;
    display: flex;
    gap: 20px;
  }
  .structure-list {
    justify-content: space-between;
    gap: 60px 0;
  }
  .structure-list li {
    width: 48%;
  }
  .structure-list li .c-txt {
    text-align: center;
  }
}