.back {
  display: flex;
  justify-content: center;
  gap: 0 calc(20 / var(--pc));
  align-items: center;
}
.back .arrow {
  transform: scale(-1, 1);
  margin-left: 0;
}

@media (max-width: 768px) {
  .back {
    gap: 0 calc(8 / var(--sp));
  }
}
section.works-detail-header {
  overflow: hidden;
}
section.works-detail-header img.mainimage {
  animation: zoom 1s ease-in-out forwards;
}
section.works-detail-header img.logo {
  width: auto;
  height: calc(60 / var(--pc));
  position: absolute;
  bottom: calc(81 / var(--pc));
  left: 50%;
  transform: translateX(-50%);
}
section.works-data {
  width: calc(1360 / var(--pc));
  margin: calc(70 / var(--pc)) auto calc(80 / var(--pc));
  display: flex;
  gap: 0 calc(75 / var(--pc));
}
section.works-data .works-data-left {
  width: calc(630 / var(--pc));
}
section.works-data .works-data-left h1 {
  font-size: calc(45 / var(--pc));
  letter-spacing: 0.02em;
  font-weight: 500;
}
section.works-data .works-data-left .category {
  margin-top: calc(20 / var(--pc));
  font-size: calc(12 / var(--pc));
  font-weight: 500;
  line-height: 140%;
  letter-spacing: 0.04em;
  color: #8F8F8F;
}
section.works-data .works-data-left .overview {
  margin-top: calc(40 / var(--pc));
  font-size: calc(15 / var(--pc));
  font-weight: 300;
  line-height: 160%;
  letter-spacing: 0.02em;
}
section.works-data .works-data-left .url {
  margin-top: calc(40 / var(--pc));
  font-size: calc(15 / var(--pc));
  font-weight: 500;
  letter-spacing: 0.04em;
}
section.works-data .works-data-left .url span {
  margin: 0 calc(5 / var(--pc));
}
section.works-data .works-data-right {
  width: calc(655 / var(--pc));
}
section.works-data .works-data-right dl dt {
  font-size: calc(14 / var(--pc));
  font-weight: 600;
  line-height: 150%;
  letter-spacing: 0.04em;
  border-bottom: 1px solid #000;
}
section.works-data .works-data-right dl dd {
  font-size: calc(15 / var(--pc));
  font-weight: 500;
  line-height: calc(22 / var(--pc));
  letter-spacing: 0.02em;
  margin-top: calc(10 / var(--pc));
}
section.works-data .works-data-right dl dd + dt {
  margin-top: calc(25 / var(--pc));
}
section.works-data .works-data-right dl dd .service {
  font-size: calc(12 / var(--pc));
  font-weight: 500;
  line-height: 150%;
  letter-spacing: calc(0.48 / var(--pc));
  color: #8F8F8F;
}
section.works-data .works-data-right dl dd ul {
  margin-top: calc(5 / var(--pc));
  display: flex;
  flex-wrap: wrap;
  gap: calc(5 / var(--pc)) 0;
}
section.works-data .works-data-right dl dd ul + .service {
  margin-top: calc(10 / var(--pc));
}
section.works-data .works-data-right dl dd ul li {
  font-size: calc(15 / var(--pc));
  font-weight: 500;
  line-height: calc(22 / var(--pc));
  letter-spacing: 0.02em;
}
section.works-data .works-data-right dl dd ul li:not(:last-child)::after {
  display: inline-block;
  content: "";
  width: 1px;
  height: calc(16 / var(--pc));
  border-left: 1px solid #BBB;
  margin: 0 calc(15 / var(--pc));
}
section.type-a, section.type-b, section.type-d, section.type-f, section.type-e, section.type-g {
  margin: 0 auto calc(140 / var(--pc));
  width: calc(1360 / var(--pc));
}
section.type-b {
  display: flex;
  gap: 0 calc(30 / var(--pc));
}
section.type-b img {
  width: calc(433 / var(--pc));
}
section.type-c {
  width: 100%;
  margin-bottom: calc(140 / var(--pc));
}
section.type-d, section.type-f {
  display: flex;
}
section.type-d .movie, section.type-f .movie {
  width: 50%;
  background: #F2F6F7;
  padding: calc(123 / var(--pc)) calc(180 / var(--pc));
}
section.type-d .movie img, section.type-f .movie img {
  width: 100%;
}
section.type-d img, section.type-f img {
  width: 50%;
}
section.type-e {
  display: flex;
  gap: 0 calc(30 / var(--pc));
}
section.type-e img:nth-of-type(1) {
  width: calc(900 / var(--pc));
}
section.type-e img:nth-of-type(2) {
  width: calc(430 / var(--pc));
}
section.type-g {
  display: flex;
  flex-wrap: wrap;
  gap: calc(50 / var(--pc));
}
section.type-g img:nth-of-type(1), section.type-g img:nth-of-type(2) {
  width: calc(655 / var(--pc));
}
section.type-g img:nth-of-type(3), section.type-g img:nth-of-type(4), section.type-g img:nth-of-type(5) {
  width: calc(420 / var(--pc));
}
section.related {
  margin-top: calc(160 / var(--pc));
  padding-left: calc(120 / var(--pc));
}
section.related h2 {
  font-size: calc(16 / var(--pc));
  font-weight: 500;
  line-height: 150%;
  letter-spacing: 0.04em;
}
section.related .related-splide {
  margin-top: calc(30 / var(--pc));
}
section.related .related-splide .splide__track {
  overflow: auto !important;
  scroll-snap-type: none;
  -ms-overflow-style: none; /* IE/Edge */
  scrollbar-width: none; /* Firefox */
}
section.related .related-splide .splide__track::-webkit-scrollbar {
  display: none;
}
section.related .related-splide .splide__track .splide__list {
  gap: 0 calc(10 / var(--pc));
}
section.related .related-splide .splide__track .splide__list .splide__slide {
  width: calc(391 / var(--pc));
}
section.related .related-splide .splide__track .splide__list .splide__slide .works-img {
  position: relative;
  height: calc(587 / var(--pc));
}
section.related .related-splide .splide__track .splide__list .splide__slide .works-img img:nth-of-type(1) {
  object-fit: cover;
  height: 100%;
}
section.related .related-splide .splide__track .splide__list .splide__slide .works-img img:nth-of-type(2) {
  width: auto;
  height: calc(37 / var(--pc));
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
section.related .related-splide .splide__track .splide__list .splide__slide dl {
  font-family: "neue-haas-grotesk-display", sans-serif;
  margin-top: calc(15 / var(--pc));
}
section.related .related-splide .splide__track .splide__list .splide__slide dl dt {
  font-size: calc(20 / var(--pc));
  line-height: 100%;
  letter-spacing: 0.02em;
}
section.related .related-splide .splide__track .splide__list .splide__slide dl dd {
  font-size: calc(12 / var(--pc));
  line-height: calc(22.2 / var(--pc));
  letter-spacing: 0.04em;
  color: #767676;
}
@media (max-width: 768px) {
  section.works-detail-header img.logo {
    height: calc(35 / var(--sp));
    bottom: calc(31 / var(--sp));
  }
  section.works-data {
    width: calc(335 / var(--sp));
    margin: calc(40 / var(--sp)) auto calc(70 / var(--sp));
    flex-direction: column;
    gap: calc(39 / var(--sp)) 0;
  }
  section.works-data .works-data-left {
    width: 100%;
  }
  section.works-data .works-data-left h1 {
    font-size: calc(26 / var(--sp));
  }
  section.works-data .works-data-left .category {
    margin-top: calc(20 / var(--sp));
    font-size: calc(12 / var(--sp));
  }
  section.works-data .works-data-left .overview {
    margin-top: calc(20 / var(--sp));
    font-size: calc(13 / var(--sp));
    line-height: 170%;
  }
  section.works-data .works-data-left .url {
    margin-top: calc(20 / var(--sp));
    font-size: calc(13 / var(--sp));
  }
  section.works-data .works-data-left .url span {
    margin: 0 calc(5 / var(--sp));
  }
  section.works-data .works-data-right {
    width: 100%;
  }
  section.works-data .works-data-right dl dt {
    font-size: calc(14 / var(--sp));
    line-height: 100%;
    letter-spacing: 0.02em;
  }
  section.works-data .works-data-right dl dd {
    font-size: calc(13 / var(--sp));
    font-weight: 300;
    line-height: 150%;
    margin-top: calc(10 / var(--sp));
  }
  section.works-data .works-data-right dl dd + dt {
    margin-top: calc(30 / var(--sp));
  }
  section.works-data .works-data-right dl dd .service {
    font-size: calc(12 / var(--sp));
    letter-spacing: 0.04em;
  }
  section.works-data .works-data-right dl dd ul {
    margin-top: calc(3 / var(--sp));
    flex-wrap: wrap;
    gap: calc(5 / var(--sp)) 0;
  }
  section.works-data .works-data-right dl dd ul + .service {
    margin-top: calc(15 / var(--sp));
  }
  section.works-data .works-data-right dl dd ul li {
    font-size: calc(13 / var(--sp));
    font-weight: 300;
    line-height: 150%;
    letter-spacing: 0;
  }
  section.works-data .works-data-right dl dd ul li:not(:last-child)::after {
    height: calc(12 / var(--sp));
    margin: 0 calc(10 / var(--sp));
  }
  section.type-a, section.type-b, section.type-d, section.type-f, section.type-e, section.type-g {
    margin: 0 auto calc(40 / var(--sp));
    width: calc(335 / var(--sp));
  }
  section.type-b {
    gap: 0 calc(8.6 / var(--sp));
  }
  section.type-b img {
    width: calc(106 / var(--sp));
  }
  section.type-c {
    width: 100%;
    margin-bottom: calc(40 / var(--sp));
  }
  section.type-d .movie, section.type-f .movie {
    padding: calc(30 / var(--sp)) calc(44 / var(--sp));
  }
  section.type-e {
    gap: 0 calc(7 / var(--sp));
  }
  section.type-e img:nth-of-type(1) {
    width: calc(222 / var(--sp));
  }
  section.type-e img:nth-of-type(2) {
    width: calc(106 / var(--sp));
  }
  section.type-g {
    gap: calc(12 / var(--sp)) calc(13 / var(--sp));
  }
  section.type-g img:nth-of-type(1), section.type-g img:nth-of-type(2) {
    width: calc(161 / var(--sp));
  }
  section.type-g img:nth-of-type(3), section.type-g img:nth-of-type(4), section.type-g img:nth-of-type(5) {
    width: calc(103 / var(--sp));
  }
  section.related {
    margin-top: calc(80 / var(--sp));
    padding-left: calc(20 / var(--sp));
  }
  section.related h2 {
    font-size: calc(14 / var(--sp));
    letter-spacing: 0.02em;
  }
  section.related .related-splide {
    margin-top: calc(15 / var(--sp));
  }
  section.related .related-splide .splide__track .splide__list {
    gap: 0 calc(10 / var(--sp));
  }
  section.related .related-splide .splide__track .splide__list .splide__slide {
    width: calc(157 / var(--sp));
  }
  section.related .related-splide .splide__track .splide__list .splide__slide .works-img {
    height: calc(235 / var(--sp));
  }
  section.related .related-splide .splide__track .splide__list .splide__slide .works-img img:nth-of-type(2) {
    height: calc(15 / var(--sp));
  }
  section.related .related-splide .splide__track .splide__list .splide__slide dl {
    margin-top: calc(10 / var(--sp));
  }
  section.related .related-splide .splide__track .splide__list .splide__slide dl dt {
    font-size: calc(12 / var(--sp));
  }
  section.related .related-splide .splide__track .splide__list .splide__slide dl dd {
    font-size: calc(10 / var(--sp));
    line-height: 140%;
  }
}/*# sourceMappingURL=works-detail.css.map */