::-webkit-scrollbar {display: none}
html body{
	height:100vh;
}
/*
 * Copyright (c) 2012-2013 Thibaut Courouble
 */
.progress {
	height:2.5%;
	background:#3d4d6e;
	border-left:1px solid transparent;
	border-right:1px solid transparent;
	border-radius:10px;
	position: absolute;
	width: 80%;
	bottom: 6%;
	left: 50%;
	transform: translateX(-50%);
	align-items: center;
	align-content: center;
	/*overflow: hidden;*/
}
.progress > span {
	align-items: center;
	align-content: center;
	position:relative;
	float:left;
	margin:1 -1px;
	min-width:30px;
	height:94%;
	line-height:94%;
	text-align:right;
	background:#cccccc;
	/* border:1px solid; */ 
	border-color:#bfbfbf #b3b3b3 #9e9e9e;
	border-radius:10px;
	background-image:-webkit-linear-gradient(top,#f0f0f0 0%,#dbdbdb 70%,#cccccc 100%);
	background-image:-moz-linear-gradient(top,#f0f0f0 0%,#dbdbdb 70%,#cccccc 100%);
	background-image:-o-linear-gradient(top,#f0f0f0 0%,#dbdbdb 70%,#cccccc 100%);
	background-image:linear-gradient(to bottom,#f0f0f0 0%,#dbdbdb 70%,#cccccc 100%);
	-webkit-box-shadow:inset 0 1px rgba(255,255,255,0.3),0 1px 2px rgba(0,0,0,0.2);
	box-shadow:inset 0 1px rgba(255,255,255,0.3),0 1px 2px rgba(0,0,0,0.2);
}
#proNum {
	font-size:16px;
	font-weight:bold;
	line-height: 20px;
	height: 7px;
	color:white;
	text-shadow:0 1px rgba(255,255,255,0.4);
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: calc(10% - 22px);
}
.progress > span:before {
	content:'';
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	z-index:1;
	height:18px;
	/* background:url("../loading/loading_3.png") 0 0 repeat-x; */
	border-radius:10px;
}
.loadGuang {
	position: absolute;
    right: 0;
    height: 400%;
    transform: translate(40%, -52%);
    top: 50%;
}
.progress .orange {
	max-width: 100%;
	background:#f3c345;
	border-color:#f0ad24 #eba310 #c5880d;
	background-image:-webkit-linear-gradient(to right,#f3c345,#fce77e);
	background-image:-moz-linear-gradient(to right,#f3c345,#fce77e);
	background-image:-o-linear-gradient(to right,#f3c345,#fce77e);
	background-image:linear-gradient(to right,#f3c345,#fce77e);
}
.pcSplash .imgblock {
	width: 100%;
	height: 100%;
  }

  .mobilesplash {
	position: absolute;
	overflow: hidden;
	background: url(./loading/bg.png);
	background-size: cover;
	-webkit-background-size: cover;
	-o-background-size: cover;
	background-position: center center;
	transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	/* IE 9 */
	-moz-transform: rotate(90deg);
	/* Firefox */
	-webkit-transform: rotate(90deg);
	/* Safari 和 Chrome */
	-o-transform: rotate(90deg);
  }

  .pcSplash {
	background: url(./loading/bg.png);
	background-size: cover;
	-webkit-background-size: cover;
	-o-background-size: cover;
	background-position: center center;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
  }

  .mobilesplash .imgblock {
	width: 100vh;
	height: 100vw;
  }

  .spinebox {
    width: 100vw;
    height: 100vh;
    /* border: 1px solid #ff0000; */
    position: absolute;
    top: 50%;
    left: 50%;
	transform: translate(-50%, -50%);
  }

  .spinebox2 {
    width: 100vw;
    height: 100vh;
    /* border: 1px solid #ff0000; */
    position: absolute;
    top: 50%;
    left: 50%;
	transform: translate(-50%, -50%);
  }
  
  @media screen and (max-width: 768px) {
	.spinebox2 {
		width: 100vw;
		height: 100vw;
	}
	/* .spine-player-canvas {
		display: block;
		width: 100%!important;
		height: 50%!important;
		position: absolute;
		top: 50%;
		left: 0;
		transform: translateY(-50%);
	} */
  }
  
  .mobilesplash[data-cls="screen-line"] {
	background-size: 100%;
	-webkit-background-size: 100%;
	-o-background-size: 100%;
	left: 0!important;
	top: 0!important;
	width: 100vw!important;
	height: 100vh!important;
	transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	/* IE 9 */
	-moz-transform: rotate(0deg);
	/* Firefox */
	-webkit-transform: rotate(0deg);
	/* Safari 和 Chrome */
	-o-transform: rotate(0deg);
  }

  .mobilesplash[data-cls="screen-line"] .spinebox2 {height: 100vh}