@import url(./common/_variable.css);

/* gallary */
/* ============================================ */

.area__gallery {
  padding: 5.208vw 0;
  @media (width < 896px) {
    padding: 40px 0;
  }
  img {
    cursor: pointer;
  }
}

.shot_h {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  img {
    object-fit: cover;
    width: 100%;
    height: 100%;
  }
}

.block__img01 {
  padding: 0 18.75vw;
}
.block__img01--inner {
}

.block__img02 {
  padding: 8.333vw 10.416vw 0;
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 4.2vw;
}
.block__img02--inner02 {
  margin-top: 8.333vw;
}

.block__img03 {
  padding: 8.333vw 0 0 37.5vw;
}

.block__img04 {
  padding: 8.333vw 37.5vw 0 0;
}

.block__img05 {
  padding: 8.333vw 10.416vw 0;
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 4.2vw;
}


/* Action */
/* ============================================ */

.ef_blur,.ef_blur_d01,.ef_blur_d02 {
  opacity: 0;
  filter: blur(20px);
  filter: brightness(10);
  transform: translateY(40px);
  transition: all 2s ease-out;
  position: relative;
}
.add_blur {
  opacity: 1;
  filter: blur(0px);
  filter: brightness(1);
  transform: translateY(0px);
  transition: all 2s ease-out;
  transform:translate3d(0,0,0);
}