@charset "UTF-8";
.project-gallery { margin-bottom: 50px; }
.project-gallery__stage { position: relative; overflow: hidden; background: var(--color-pale); touch-action: pan-y; }
.project-gallery__image { width: 100%; aspect-ratio: 1.95; object-fit: cover; object-position: center 75%; }
.project-gallery__arrow { position: absolute; top: 50%; display: grid; width: 44px; height: 44px; padding: 12px; place-items: center; transform: translateY(-50%); border: 1px solid var(--color-line); border-radius: 50%; background: #fff; }
.project-gallery__arrow--previous { left: 12px; }
.project-gallery__arrow--next { right: 12px; }
.project-gallery__arrow img { width: 100%; height: 100%; object-fit: contain; }
.project-gallery__arrow--previous img { transform: rotate(180deg); }
.project-gallery__count { position: absolute; right: 12px; bottom: 12px; padding: 5px 12px; background: #0c2445b3; color: #fff; font-size: 13px; }
.project-gallery__thumbs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.project-gallery__thumb { width: 100%; padding: 2px; border: 2px solid transparent; background: transparent; }
.project-gallery__thumb[aria-current] { border-color: var(--color-blue); }
.project-gallery__thumb img { width: 100%; aspect-ratio: 1.6; object-fit: cover; object-position: center 70%; }
.project-data { margin-top: 55px; }
.project-data__table { width: 100%; border-collapse: collapse; border: 1px solid var(--color-line); color: var(--color-ink); font-size: 14px; line-height: 1.9; }
.project-data__table th, .project-data__table td { padding: 15px 18px; border-bottom: 1px solid var(--color-line); text-align: left; overflow-wrap: anywhere; }
.project-data__table th { width: 32%; background: var(--color-pale); font-weight: 700; }
.project-copy { margin-top: 55px; }
.project-copy__section { padding-block: 28px; border-bottom: 1px solid var(--color-line); }
.project-copy__section:last-child { border-bottom: 0; }
.project-copy__section h3 { margin-bottom: 14px; color: var(--color-ink); font-size: 21px; line-height: 1.7; letter-spacing: .04em; }
.project-copy__section p { font-size: 16px; line-height: 2; }
@media (min-width: 768px) {
  .project-gallery__arrow { width: 50px; height: 50px; padding: 14px; }
  .project-gallery__arrow--previous { left: 18px; }
  .project-gallery__arrow--next { right: 18px; }
  .project-gallery__thumbs { gap: 16px; }
  .project-data__table { font-size: 20px; }
  .project-data__table th, .project-data__table td { padding: 12px 30px; }
  .project-data__table th { width: 25%; }
  .project-copy__section { padding-block: 32px; }
  .project-copy__section p { font-size: 20px; }
  .project-copy__section h3 { font-size: 25px; }
}
@media (max-width: 599px) {
  .project-gallery__image { aspect-ratio: 1.35; }
}