.parent {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: repeat(4, 1fr);
  grid-column-gap: 18px;
  grid-row-gap: 18px;
  max-height: 461px;
}
.contenedor-imagen img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.div1 { grid-area: 1 / 1 / 5 / 4; }
.div2 { grid-area: 1 / 4 / 3 / 5; }
.div3 { grid-area: 1 / 5 / 3 / 6; }
.div4 { grid-area: 3 / 4 / 5 / 6; }

@media screen and (max-width: 800px) {
  .parent {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(12, 1fr);
    grid-column-gap: 18px;
    grid-row-gap: 18px;
    max-height: 100vh;;
  }

  .div1 { grid-area: 1 / 1 / 5 / 2; }
  .div2 { grid-area: 1 / 2 / 5 / 3; }
  .div3 { grid-area: 5 / 1 / 9 / 3; }
  .div4 { grid-area: 9 / 1 / 13 / 3; }
  }
}