Как сделать grid сетку адаптивной?

У меня есть блок создан с помощью grid

который при уменьшении ширины сайта не уменьшается как верхний блок.

CSS код:

.storehouse {
    display: grid;
    grid-template-columns: min-content
    min-content min-content min-content;
    grid-template-rows: min-content
    min-content min-content;
    justify-content: center;
}

.storehouse__photo {
    display: block;
    height: 100%;
    width: 100%;
}

.storehouse__item-1 {
  grid-column: 1 / 1;
  grid-row: 1 / span 2;
  min-width: 560px;
  min-height: 500px;

  position: relative;
}

.storehouse__item-2 {
  grid-column: 1 / span 2;
  grid-row: 3 / 3;
  min-width: 800px;
  min-height: 280px;

  position: relative;
}

.storehouse__item-3 {
  grid-column: 2 / span 3;
  grid-row: 1 / 1;
  min-width: 880px;
  min-height: 280px;

  position: relative;
  background: #5d257c;
}

.storehouse__item-4 {
  grid-column: 2 / 2;
  grid-row: 2 / 2;
  max-width: 140px;
  min-height: 302px;
  max-height: 314px;

  background: #fff;

  position: relative;
}

.storehouse__item-5 {
  grid-column: 3 / 3;
  grid-row: 2 / span 3;
  min-width: 680px;
}

.storehouse__item-6 {
  grid-column: 4 / 4;
  grid-row: 1 / 1;
  min-width: 653px;
  min-height: 280px;

  position: relative;
}

.storehouse__item-7 {
  grid-column: 4 / 4;
  grid-row: 2 / span 3;
  min-width: 680px;
  min-height: 600px;

  position: relative;
}