/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~/
/  mixin                                                     */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
@media screen and (max-width: 1024px) {
  .mv__img {
    width: 100%;
    aspect-ratio: 9/12;
  }
}
.mv__img picture,
.mv__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.info li,
.wedding li {
  position: relative;
  aspect-ratio: 16/6;
}
@media screen and (max-width: 1200px) {
  .info li,
  .wedding li {
    aspect-ratio: 16/8;
  }
}
@media screen and (max-width: 1024px) {
  .info li,
  .wedding li {
    aspect-ratio: 16/7;
  }
}
.info figure,
.wedding figure {
  aspect-ratio: 16/6;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: -1;
}
@media screen and (max-width: 1200px) {
  .info figure,
  .wedding figure {
    aspect-ratio: 16/8;
  }
}
@media screen and (max-width: 1024px) {
  .info figure,
  .wedding figure {
    aspect-ratio: 16/7;
  }
}
.info figure picture,
.wedding figure picture {
  width: 100%;
  height: 100%;
}
.info figure img,
.wedding figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.6);
}

@media screen and (max-width: 1024px) {
  .wedding li {
    aspect-ratio: 16/9;
  }
}
@media screen and (max-width: 1024px) {
  .wedding figure {
    aspect-ratio: 16/9;
  }
}/*# sourceMappingURL=top.css.map */