/* ==================
		弹性布局
 ==================== */
.flex {
	display: flex !important;
	&-sub {
		flex: 1 !important;
	}
	&-twice {
		flex: 2 !important;
	}
	&-treble {
		flex: 3 !important;
	}
	&-column {
		flex-direction: column !important;
	}
	&-row {
		flex-direction: row !important;
	}
	&-column-reverse {
		flex-direction: column-reverse !important;
	}
	&-row-reverse {
		flex-direction: row-reverse !important;
	}
	&-wrap {
		flex-wrap: wrap !important;
	}
	&-center {
		justify-content: center
	}
	&-bar {
		// @include flex-bar;
	}
  &-shrink-0 {
    flex-shrink: 0;
  }
}
// .basis {
// 	@each $class, $value in (xs: 20%, sm: 40%, df: 50%, lg: 60%, xl: 80%) {
// 		&-#{$class} {
// 			flex-basis: $value !important;
// 		}
// 	}
// }
// .align {
// 	@each $class, $value in (start: flex-start, end: flex-end, center: center, stretch: stretch, baseline: baseline) {
// 		&-#{$class} {
// 			align-items: $value !important;
// 		}
// 	}
// }
// .self {
// 	@each $class, $value in (start: flex-start, end: flex-end, center: center, stretch: stretch, baseline: baseline) {
// 		&-#{$class} {
// 			align-self: $value !important;
// 		}
// 	}
// }
// .justify {
// 	@each $class, $value in (start: flex-start, end: flex-end, center: center, between: space-between, around: space-around) {
// 		&-#{$class} {
// 			justify-content: $value !important;
// 		}
// 	}
// }