@charset "UTF-8";

/* =========================
   Visual Works
========================= */
.visualworks {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px 160px;
}

/* =========================
   各作品
========================= */
.visual-item {
  margin-bottom: 220px;

  /* フェード初期状態 */
  opacity: 0.35
  ;
  transform: translateY(40px);
  transition:
    opacity 1.6s ease,
    transform 1.6s ease;
}

/* 表示時 */
.visual-item.show {
  opacity: 1;
  transform: translateY(0);
}

.visual-item:nth-last-child(2) {
  margin-bottom: 120px;
}


/* =========================
   画像
========================= */
.visual-image {
  display: block;
  width: 100%;
  max-height: 92dvh;
  margin: 0 auto;
  object-fit: contain;
}

/* =========================
   キャプション
========================= */
.visual-caption {
  margin-top: 18px;
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  color: #444;
  text-align: left;
}

/* =========================
   スマホ
========================= */
@media (max-width: 768px) {

  .visualworks {
    padding: 0 18px 120px;
  }

  .visual-intro {
    padding-top: 32px;
    margin-bottom: 72px;
  }

  .visual-item {
    margin-bottom: 120px;
  }

  .visual-image {
    max-height: none;
  }

  .visual-caption {
    margin-top: 14px;
    font-size: 0.7rem;
  }

  .visual-back {
    text-align: center;
  }

}