/*Flexible Box*/
.flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.inflex {
    display: inline-box !important;
    display: -webkit-inline-box !important;
    display: -webkit-inline-flex !important;
    display: -moz-box !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
}

/*单轴*/
.ai_center {
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
}

.ai_start {
    /*默认*/
    -webkit-align-items: flex-start;
    -moz-align-items: flex-start;
    -ms-align-items: flex-start;
    -o-align-items: flex-start;
    align-items: flex-start;
}

.ai_end {
    -webkit-align-items: flex-end;
    -moz-align-items: flex-end;
    -ms-align-items: flex-end;
    -o-align-items: flex-end;
    align-items: flex-end;
}

.ai_base {
    -webkit-align-items: baseline;
    -moz-align-items: baseline;
    -ms-align-items: baseline;
    -o-align-items: baseline;
    align-items: baseline;
}

.ai_stretch {
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
}

/*左右对齐*/
.jc_center {
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -o-justify-content: center;
    justify-content: center;
}

.jc_between {
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -ms-justify-content: space-between;
    -o-justify-content: space-between;
    justify-content: space-between;
}

.jc_around {
    -webkit-justify-content: space-around;
    -moz-justify-content: space-around;
    -ms-justify-content: space-around;
    -o-justify-content: space-around;
    justify-content: space-around;
}

.jc_end {
    -webkit-justify-content: flex-end;
    -moz-justify-content: flex-end;
    -ms-justify-content: flex-end;
    -o-justify-content: flex-end;
    justify-content: flex-end;
}

/*换行方式*/
.fw_no {
    -webkit-flex-wrap: nowrap;
    -moz-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    -o-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

.fw_wrap {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
}

.fw_reverse {
    -webkit-flex-wrap: wrap-reverse;
    -moz-flex-wrap: wrap-reverse;
    -ms-flex-wrap: wrap-reverse;
    -o-flex-wrap: wrap-reverse;
    flex-wrap: wrap-reverse;
}

/*多轴 上中下对齐方式*/
.ac_center {
    -webkit-align-content: center;
    -moz-align-content: center;
    -ms-align-content: center;
    -o-align-content: center;
    align-content: center;
}

.ac_start {
    -webkit-align-content: flex-start;
    -moz-align-content: flex-start;
    -ms-align-content: flex-start;
    -o-align-content: flex-start;
    align-content: flex-start;
}

.ac_end {
    -webkit-align-content: flex-end;
    -moz-align-content: flex-end;
    -ms-align-content: flex-end;
    -o-align-content: flex-end;
    align-content: flex-end;
}

.ac_between {
    -webkit-align-content: space-between;
    -moz-align-content: space-between;
    -ms-align-content: space-between;
    -o-align-content: space-between;
    align-content: space-between;
}

.ac_around {
    -webkit-align-content: space-around;
    -moz-align-content: space-around;
    -ms-align-content: space-around;
    -o-align-content: space-around;
    align-content: space-around;
}

.ac_stretch {
    -webkit-align-content: stretch;
    -moz-align-content: stretch;
    -ms-align-content: stretch;
    -o-align-content: stretch;
    align-content: stretch;
}

/*主轴的方向*/
.fd_r {
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
}

.fd_rr {
    -webkit-flex-direction: row-reverse;
    -moz-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    -o-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

.fd_c {
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
}

.fd_cr {
    -webkit-flex-direction: column-reverse;
    -moz-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    -o-flex-direction: column-reverse;
    flex-direction: column-reverse;
}

/*项目属性*/
.flex1 {
    -prefix-box-flex: 1;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.as_auto {
    -webkit-align-self: auto;
    -moz-align-self: auto;
    -ms-align-self: auto;
    -o-align-self: auto;
    align-self: auto;
}

.as_center {
    -webkit-align-self: center;
    -moz-align-self: center;
    -ms-align-self: center;
    -o-align-self: center;
    align-self: center;
}

.as_start {
    -webkit-align-self: flex-start;
    -moz-align-self: flex-start;
    -ms-align-self: flex-start;
    -o-align-self: flex-start;
    align-self: flex-start;
}

.as_end {
    -webkit-align-self: flex-end;
    -moz-align-self: flex-end;
    -ms-align-self: flex-end;
    -o-align-self: flex-end;
    align-self: flex-end;
}

.as_base {
    -webkit-align-self: baseline;
    -moz-align-self: baseline;
    -ms-align-self: baseline;
    -o-align-self: baseline;
    align-self: baseline;
}

.as_stretch {
    -webkit-align-self: stretch;
    -moz-align-self: stretch;
    -ms-align-self: stretch;
    -o-align-self: stretch;
    align-self: stretch;
}

/* 是否允许子元素伸缩 */
.flex-item {
    flex-grow: 1;
}

/* 子元素的显示次序 */
.flex-order {
    order: 1;
}