// layout
@layout-padding		: 12px;

// flex
.row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;

    &:before,
    &:after {
        display: flex;
    }
    // x轴原点
    &-start {
        justify-content: flex-start;
    }
    // x轴居中
    &-center {
        justify-content: center;
    }
    // x轴反方向
    &-end {
        justify-content: flex-end;
    }
    // x轴平分
    &-between {
        justify-content: space-between;
    }
    // x轴有间隔地平分
    &-around {
        justify-content: space-around;
    }
    // 顶部对齐
    &-top {
        align-items: flex-start;
    }
    // 居中对齐
    &-middle {
        align-items: center;
    }
    // 底部对齐
    &-bottom {
        align-items: flex-end;
    }
}