.flex{
	display: -moz-box;
	/* Firefox */
	display: -ms-flexbox;
	/* IE10 */
	display: -webkit-box;
	/* Safari */
	display: -webkit-flex;
	/* Chrome, WebKit */
	display: box;
	display: flexbox;
	display: flex;
}
.flex1{
	flex:1;
}
.flex_wrap{
	flex-wrap:wrap;
}
/* 左右排列居中 */
.center_center{
	display: -moz-box;
	/* Firefox */
	display: -ms-flexbox;
	/* IE10 */
	display: -webkit-box;
	/* Safari */
	display: -webkit-flex;
	/* Chrome, WebKit */
	display: box;
	display: flexbox;
	display: flex;
    justify-content: center;
    align-items: center;
}
/* 上下排列居中 */
.center_center_column{
	display: -moz-box;
	/* Firefox */
	display: -ms-flexbox;
	/* IE10 */
	display: -webkit-box;
	/* Safari */
	display: -webkit-flex;
	/* Chrome, WebKit */
	display: box;
	display: flexbox;
	display: flex;
	flex-direction: column;
    justify-content: center;
    align-items: center;
}
/* 垂直居中，从头开始布局 */
.center_start{
	display: -moz-box;
	/* Firefox */
	display: -ms-flexbox;
	/* IE10 */
	display: -webkit-box;
	/* Safari */
	display: -webkit-flex;
	/* Chrome, WebKit */
	display: box;
	display: flexbox;
	display: flex;
    justify-content: flex-start;
    align-items: center;
}
/* 垂直居中，从尾开始布局 */
.center_end{
	display: -moz-box;
	/* Firefox */
	display: -ms-flexbox;
	/* IE10 */
	display: -webkit-box;
	/* Safari */
	display: -webkit-flex;
	/* Chrome, WebKit */
	display: box;
	display: flexbox;
	display: flex;
    justify-content: flex-end;
    align-items: center;
}
/* 左右排列两端对齐 */
.space_between{
    display: -moz-box;
	/* Firefox */
	display: -ms-flexbox;
	/* IE10 */
	display: -webkit-box;
	/* Safari */
	display: -webkit-flex;
	/* Chrome, WebKit */
	display: box;
	display: flexbox;
	display: flex;
    justify-content: space-between;
    align-items: center;
}
/* 上下排列两端对齐 */
.space_between_column{
    display: -moz-box;
	/* Firefox */
	display: -ms-flexbox;
	/* IE10 */
	display: -webkit-box;
	/* Safari */
	display: -webkit-flex;
	/* Chrome, WebKit */
	display: box;
	display: flexbox;
	display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}
/* 上下排列两端对齐 */
.space_start_column{
    display: -moz-box;
	/* Firefox */
	display: -ms-flexbox;
	/* IE10 */
	display: -webkit-box;
	/* Safari */
	display: -webkit-flex;
	/* Chrome, WebKit */
	display: box;
	display: flexbox;
	display: flex;
    flex-direction: column;
    justify-content: space-start;
    align-items: center;
}
/* 左右排列自由分配距离 */
.space_around{
    display: -moz-box;
	/* Firefox */
	display: -ms-flexbox;
	/* IE10 */
	display: -webkit-box;
	/* Safari */
	display: -webkit-flex;
	/* Chrome, WebKit */
	display: box;
	display: flexbox;
	display: flex;
    justify-content: space-around;
    align-items: center;
}
/* 上下排列自由分配距离 */
.space_around_column{
    display: -moz-box;
	/* Firefox */
	display: -ms-flexbox;
	/* IE10 */
	display: -webkit-box;
	/* Safari */
	display: -webkit-flex;
	/* Chrome, WebKit */
	display: box;
	display: flexbox;
	display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
}
/* 左右自动分配距离,超出盒子范围换行 */
.space_around_wrap{
    display: -moz-box;
	/* Firefox */
	display: -ms-flexbox;
	/* IE10 */
	display: -webkit-box;
	/* Safari */
	display: -webkit-flex;
	/* Chrome, WebKit */
	display: box;
	display: flexbox;
	display: flex;
    justify-content: space-around;
    align-items: center;
    flex-wrap:wrap;
}

/* 超过一行显示省略号 */
.ellipsis {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

/* 清楚浮动 */
.clearfix::after {
	content: '';
	display: block;
	clear: both;
}
.clearfix {
	zoom: 1;
}

/* 定位上下左右居中 */
.position_center{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}