flex布局自动换行并解决最后一行两侧对齐

在开发中遇到使用弹性布局需要换行的情况，解决记录，以免忘记

<div class="bankproduce">
      <div class="bankproduce_content"></div>
      <div class="bankproduce_content"></div>
      <div class="bankproduce_content"></div>
       .......
</div>

.bankproduce{
    width: 100%;
    height: 1072px;
    display: flex;
    flex-direction: row;
    //两侧对齐
    justify-content:space-between;
    //自动换行
    flex-wrap: wrap;
    //清除上下行的中间空隙
    align-content: flex-start;
}
.bankproduce_content{
    height: 486px;
    //---
    flex: 0 0 31%;
    margin-right: 15px;
    margin-left: 15px;
    margin-bottom: 40px;
    background: #ff6654;
}
//解决最后一行的问题
.bankproduce:after{
    content: '';
    width: 30%;
    border:1px solid transparent;
  }