@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-flex-left {
  @include flex(flex-start);
}
/******水平居右******/
.yg-flex-right {
  @include flex(flex-end);
}

/******垂直居中******/
.yg-col-center {
  @include flex(center, center, column);
}

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