如何用flex布局输出5点骰子？

这12346都没问题了，但这个5点骰子我是没搞懂了，中间那个点怎么搞都下不来……

```html
<div class="box">
  <div class="row">
    <span class="item"></span>
    <span class="item"></span>
  </div>
  <div class="row">
    <span class="item"></span>
  </div>
  <div class="row">
     <span class="item"></span>
     <span class="item"></span>
  </div>
</div>

```css
.box {
  display: flex;
  flex-wrap: wrap;
}

.row{
  flex-basis: 100%;
  display:flex;
  justify-content: space-between;
}
.item{
    width:10px;
    height:10px;
    background: #f00;
}
.row:nth-child(2){
  justify-content: center;
}

flex可以单独控制指定元素的状态