/* ==================
         进度条
 ==================== */

 .cu-progress {
	overflow: hidden;
	height: 14px;
	background-color: #ebeef5;
	display: inline-flex;
	align-items: center;
	width: 100%;
}

.cu-progress+div,
.cu-progress+span {
	line-height: 1;
}

.cu-progress.xs {
	height: 5x;
}

.cu-progress.sm {
	height: 10px;
}

.cu-progress div {
	width: 0;
	height: 100%;
	align-items: center;
	display: flex;
	justify-items: flex-end;
	justify-content: space-around;
	font-size: 10px;
	color: #ffffff;
	transition: width 0.6s ease;
}

.cu-progress span {
	align-items: center;
	display: flex;
	font-size: 10px;
	color: #333333;
	text-indent: 5px;
}

.cu-progress.text-progress {
	padding-right: 30px;
}

.cu-progress.striped div {
	background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
	background-size: 36px 36px;
}

.cu-progress.active div {
	animation: progress-stripes 2s linear infinite;
}

@keyframes progress-stripes {
	from {
		background-position: 36px 0;
	}

	to {
		background-position: 0 0;
	}
}
