@mixin flex($justify: center, $align: center, $direction: row, $wrap: no-wrap) {
  display: flex;
  justify-content: $justify;
  align-items: $align;
  flex-direction: $direction;
  flex-wrap: $wrap;
}

/******水平居中******/
.yg-flex-center {
  @include flex;
}
/******垂直居中******/
.yg-col-center {
  @include flex(center, center, column);
}
/******水平左对齐******/
.yg-col-left {
  @include flex(flex-start);
}
/******水平右对齐******/
.yg-col-right {
  @include flex(flex-end);
}

// 主轴等比间距
.yg-flex-between {
  @include flex(space-between, center, row);
}