Remove space between rows in flex container

Question

A have this HTML code:

.d1 {
  margin: 3rem auto;
  background: #c3c3c0;
  width: 400px;
  height: 600px;
  display: flex;
  flex-wrap: wrap;
}

.d2 {
  background: #838e85;
  width: 70px;
  height: 70px;
  margin: 1rem;
}

<div class="d1">
  <div class="d2">1</div>
  <div class="d2">2</div>
  <div class="d2">3</div>
  <div class="d2">4</div>
  <div class="d2">5</div>
  <div class="d2">6</div>
  <div class="d2">7</div>
  <div class="d2">8</div>
</div>

and it looks like this:

But I need div.d2 to be aligned to top without vertical space between rows.

Is it possible? And if yes, How to deal with this?