// flex布局
.vci-flex {
  display: flex;
}

// 行方向-垂直居中
.vci-flex-rm {
  @extend .vci-flex; /* stylelint-disable-line */

  align-items: center;
}

// 行方向-垂直居中-靠左
.vci-flex-rml {
  @extend .vci-flex-rm; /* stylelint-disable-line */

  justify-content: flex-start;
}

// 行方向-垂直居中-靠右
.vci-flex-rmr {
  @extend .vci-flex-rm; /* stylelint-disable-line */

  justify-content: flex-end;
}

// 行方向-垂直居中-均匀分布
.vci-flex-rmb {
  @extend .vci-flex-rm; /* stylelint-disable-line */

  justify-content: space-between;
}

// 行方向-水平垂直居中
.vci-flex-rcm {
  @extend .vci-flex-rm; /* stylelint-disable-line */

  justify-content: center;
}

// 行方向-水平居中
.vci-flex-rc {
  @extend .vci-flex; /* stylelint-disable-line */

  justify-content: center;
}

// 列方向
.vci-flex-c {
  @extend .vci-flex; /* stylelint-disable-line */

  flex-direction: column;
}

// 列方向-水平居中
.vci-flex-cc {
  @extend .vci-flex-c; /* stylelint-disable-line */

  align-items: center;
}

// 列方向-水平居中-偏上
.vci-flex-cct {
  @extend .vci-flex-cc; /* stylelint-disable-line */

  justify-content: flex-start;
}

// 列方向-垂直居中-偏下
.vci-flex-ccb {
  @extend .vci-flex-cc; /* stylelint-disable-line */

  justify-content: flex-end;
}

// 列方向-垂直居中-均匀分布
.vci-flex-ccbt {
  @extend .vci-flex-cc; /* stylelint-disable-line */

  justify-content: space-between;
}

// 列方向-水平垂直居中
.vci-flex-ccm {
  @extend .vci-flex-cc; /* stylelint-disable-line */

  justify-content: center;
}

// 列方向-垂直居中
.vci-flex-cm {
  @extend .vci-flex-c; /* stylelint-disable-line */

  justify-content: center;
}

.vci-flex-fill {
  flex: 1 1 auto;
}

.vci-flex-0-0 {
  flex: 0 0 auto;
}

.vci-flex-1-0 {
  flex: 1 0 auto;
}