How to move flexbox items in groups?

Question

css

Here I have this code:

<div class="container">
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
</div>

.container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around;
}

.item {
  border: 1px solid white;
  height: 300px;
  width: 200px;
  margin-bottom: 20px;
}

Is there any way to make the .item elements wrap two at a time instead of one at a time? That is, so that the situation would not arise when there are three divs in the first line, and one in the second?