main {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  justify-items: center;
  align-items: center;
  margin-inline: auto;
  width: clamp(698px, 90dvw + 1.2rem, 1072px);
  gap: clamp(1.88em, 5.6dvw - 0.8rem, 3.3em);
  padding: 0 0.3em 1em 0;
  margin-top: clamp(5.3em, 11.2dvw + 0.1rem, 8.1em);
}

img {
  display: block;
  max-width: 100%;
  border: 1px solid #000;
}

@media (max-width: 720px) {
  main {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    width: min(90dvw + 1.2rem, 592px);
    gap: min(3dvw + 0.12rem, 1.4em);
    padding: 0 0 1em 0;
    margin-top: min(23dvw + 0.76rem, 9.8em);
  }
}