/*----------------------------------
 projectDetail
-----------------------------------*/
.worksDetailTop {
  width: 100%;
  padding-top: min(150px,15.6255vw); }
  .worksDetailTop .mainImage {
    position: relative;
    display: block;
    width: 100%;
    height: auto; }
    .worksDetailTop .mainImage::before {
      content: '';
      display: block;
      width: 100%;
      padding-top: 42.53333%; }
    .worksDetailTop .mainImage img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 0; }
  @media (max-width: 1024px) {
    .worksDetailTop .projectTtlWrap {
      width: 90%;
      margin: 0 auto; } }
  .worksDetailTop .workTtl {
    font-size: clamp(25.2px, 3.75vw, 36px);
    font-weight: 700;
    line-height: 1.6;
    margin-top: min(60px,6.2505vw); }
    @media (max-width: 480px) {
      .worksDetailTop .workTtl {
        font-size: 22px; } }
  .worksDetailTop .pjTtl {
    font-size: clamp(16.8px, 2.5005vw, 24px);
    font-weight: 700;
    margin-top: min(50px,5.208vw); }
  .worksDetailTop .otherDetail {
    margin-top: 30px; }
    .worksDetailTop .otherDetail dl {
      display: flex;
      flex-wrap: wrap;
      align-items: center; }
      .worksDetailTop .otherDetail dl + dl {
        margin-top: 6px; }
      .worksDetailTop .otherDetail dl dt {
        width: 6em;
        font-family: neue-haas-grotesk-display;
        font-weight: 600;
        letter-spacing: 0.1rem; }
      .worksDetailTop .otherDetail dl dd {
        width: calc(100% - 6em);
        padding-bottom: 5px; }
        .worksDetailTop .otherDetail dl dd a {
          margin-right: 20px; }

.worksDetailContents {
  margin: min(70px,7.2915vw) auto min(150px,15.6255vw); }
  .worksDetailContents > div {
    margin-top: min(75px,7.812vw); }
  .worksDetailContents .pictWrap {
    border-radius: 4px;
    overflow: hidden; }
    .worksDetailContents .pictWrap figure {
      position: relative;
      display: block;
      height: auto; }
      .worksDetailContents .pictWrap figure::before {
        content: '';
        display: block;
        width: 100%;
        padding-top: 62.5%; }
      .worksDetailContents .pictWrap figure img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 0; }
    .worksDetailContents .pictWrap.oneSheet figure {
      width: 100%; }
    .worksDetailContents .pictWrap.twoSheet figure {
      width: 50%; }
  .worksDetailContents .detailTxt {
    max-width: 900px;
    margin: min(75px,7.812vw) auto 0;
    position: relative; }
    .worksDetailContents .detailTxt::after {
      content: '';
      position: absolute;
      top: 0;
      left: -1.5em;
      display: block;
      width: 1px;
      height: 100%;
      background: #212121; }
      @media (max-width: 480px) {
        .worksDetailContents .detailTxt::after {
          display: none; } }
    .worksDetailContents .detailTxt dl + dl {
      margin-top: min(70px,7.2915vw); }
    .worksDetailContents .detailTxt dl dt {
      font-size: clamp(18.2px, 2.709vw, 26px);
      font-weight: 700;
      margin-bottom: min(30px,3.1245vw); }
    .worksDetailContents .detailTxt dl dd p {
      line-height: 1.8; }
    .worksDetailContents .detailTxt dl dd p + p {
      margin-top: 1.5em; }
  .worksDetailContents .member dl {
    display: flex; }