.main-container {
  padding: 4rem 4rem 0;
  display: grid;
  grid-template-columns: repeat(3, auto);
  grid-auto-rows: auto auto;
  grid-gap: 10px;
  grid-auto-flow: dense;
}
.main-container .container-grid .item {
  width: 100%;
  height: 100%;
  position: relative;
}
.main-container .container-grid .item .image {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.main-container .container-grid .item .image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: all 0.8s ease;
}
.main-container .container-grid .item .image img:hover {
  transform: scale(1.5);
}
.main-container .container-grid .w-sp-2 {
  grid-column: span 2;
}
.main-container .container-grid .w-sp-3 {
  grid-column: span 3;
}
.main-container .container-grid .w-sp-4 {
  grid-column: span 4;
}
.main-container .container-grid .h-sp-2 {
  grid-row: span 2;
}
.main-container .container-grid .h-sp-3 {
  grid-row: span 3;
}
.main-container .container-grid .h-sp-4 {
  grid-row: span 4;
}

@media (max-width: 850px) {
  .main-container {
    padding: 4rem 2rem 0;
    grid-template-columns: 1fr;
  }
  .main-container .w-sp-2, .main-container .w-sp-3, .main-container .w-sp-4 {
    grid-column: span 1;
  }
  .main-container .h-sp-2, .main-container .h-sp-3, .main-container .h-sp-4 {
    grid-row: span 1;
  }
}/*# sourceMappingURL=photos.css.map */