#progress_bar {
	position: fixed;
	top: 43px;
	left: 0;
	width: .1%;
	height: 4px;
	background-color: #e22c48;
	z-index: 999999999;
	box-shadow: 2px 0px 5px #d85656;
	transition: all .3s ease-in;
	opacity: 0;
}

#running-mask{
    position: fixed;
    width:100vw;
    height: 100vh;
    top:0;
    left:0;
    z-index: 999999;
    background-color: rgba(228, 228, 228, 0.3);
	transition: all .3s;
	opacity: 0;
}
.now_dataloading1 {
	position: relative;
	border-radius: 1px;
	box-shadow: 0 0 20px 1px #78c1ff;
	overflow: hidden;
	min-width: 130px;
	height: 75px;
	padding: 20px;
	margin-top: -20vh;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	transition: all .3s;
    opacity: 0;
}
.now_dataloading1::before {
	content: '';
	position: absolute;
	z-index: -2;
	width: 200%;
	height: 300%;
	background-color: rgba(57, 153, 83, .2);
	background-repeat: no-repeat;
	background-size: 50% 50%, 50% 50%;
	background-position: 0 0, 100% 0, 100% 100%, 0 100%;
	background-image: linear-gradient(rgba(57, 153, 83, .9), rgba(57, 153, 83, .2)), linear-gradient(rgba(251, 179, 0, .2), rgba(251, 179, 0, 1)), linear-gradient(rgba(255, 31, 14, .5), rgba(255, 31, 14, .9)), linear-gradient(rgba(55, 122, 245, .9), rgba(55, 122, 245, .2));
	animation: rotate 5s linear infinite;
}
.now_dataloading1::after {
	content: '';
	position: absolute;
	z-index: -1;
	width: calc(100% - 12px);
	height: calc(100% - 12px);
	background: var(--primary-background);
	border-radius: 1px;
}
.now_dataloading1.active {
	height: 50px;
}
@keyframes rotate {
	100% {
		transform: rotate(1turn);
	}
}