body{
		margin:0;
	}
	ul,li{
		list-style-type: none;
	}
	#downloadcenter{
		width:100%;
		overflow: hidden;
		height: 100vh;
	}
	#downloadcenter ul.nav{
		box-sizing: border-box;
		height: 50px;
		line-height: 45px;
		margin:0 auto;
		padding:0 200px;
		border-bottom: 1px solid #e8e7e7;
		z-index: 5;
		position: fixed;
		top:0;
		left:0;
		width:100%;
		background-color: #fff;
		box-shadow: 1px 1px 4px #f6f6f6;
	}
	#downloadcenter li.item{
		text-align: center;
		display:inline-block;
		width:150px;
		cursor: pointer;
	}
	#downloadcenter li.item.active{
		color:#08a489;
		border-bottom: 4px solid #06bb9c;
	}
	#downloadcenter #return i{
		width:22px;
		height: 18px;
		display: inline-block;
		background:url('../images/downloadcenter/home.png') no-repeat center;
		vertical-align: middle;
		margin-top:-3px;
		margin-right: 8px;
	}
	#downloadcenter #return:hover{
		color:#08a489;
	}
	#downloadcenter #return:hover i{
		background:url('../images/downloadcenter/home-h.png') no-repeat center;
	}
	#downloadcenter #return a{
		text-decoration: none;
		color:inherit;
	}
	#downloadcenter #return i:active{
		background:url('../images/downloadcenter/home-h.png') no-repeat center;
	}
	#downloadcenter .container{
		overflow: visible;
		position: relative;
		width:100%;
		margin-top:50px;
	}
	#downloadcenter .container .detail{
		width:100%;
		margin-top:50px;
		height: calc(100vh - 50px);
	}
	#downloadcenter .container .patrol .detail{
		height: 100vh;
		margin-top: -50px;
	}
	#downloadcenter .container .detail.one{
		background-color: #EDFBFE;
	}
	#downloadcenter .container .service .detail.two:first-child{
		background-color: #f6f6f6;
	}
	#downloadcenter .container .detail.three{
		background-color: #F6F6F6;
	}

	#downloadcenter .detail .text-introduce{
		display:inline-block;
		width:48%;
		text-align: left;
		margin-top:16%;
		padding-left:8%;
		padding-right: 20px;
		box-sizing: border-box;
	}
	#downloadcenter .detail.two .text-introduce{
		padding-left:3%;
	}
	#downloadcenter .detail .text-introduce h2{
		font-size:30px;
		font-weight: normal;
		margin:0 auto 4%;
		color:#333;
	}
	
	#downloadcenter .detail .text-introduce h2>b{
		font-size:36px;
		font-weight: 500;
	}
	#downloadcenter .text-introduce p.edition{
		margin: 0 auto 4%;
		color:#595959;
		font-size: 16px;
	}
	#downloadcenter .text-introduce p.content{
	    width: 100%;
		font-size: 16px;
		margin: auto;
		line-height: 30px;
	}
	#downloadcenter .text-introduce p.btn a{
		display:block;
		width:230px;
		height:70px;
		line-height: 70px;
		box-sizing: border-box;
		border:1px solid #919f9f;
		color:#919f9f;
		border-radius: 80px;
		margin:6% auto 0;
		font-size: 26px;
		cursor: pointer;
		text-decoration:none;
		text-align: center;
	}
	#downloadcenter .text-introduce p.btn a:hover{
		background-color: #06bb9c;
		color:#fff;
		border:1px solid #06bb9c;
		text-decoration:none;
	}

	#downloadcenter .detail .pic-introduce{
		display: inline-block;
		width:52%;
		height: 100%;
		position: relative;
		box-sizing: border-box;
	}
	#downloadcenter .detail.one .pic-introduce .pic1{
		position: absolute;
		left:0;
		top:34%;
		width: 70%;
	}
	#downloadcenter .detail.one .pic-introduce .pic2{
		position: absolute;
		left:8%;
		top:15%;
		width: 67%;
	}
	#downloadcenter .detail.one .pic-introduce .pic3{
		position: absolute;
		left:39%;
		top:45%;
		width: 42%;
	}
	#downloadcenter .detail.two .text-introduce{
		margin-top: 6%;
		line-height: 22px;
		width:50%;
	}
	#downloadcenter .service .detail.two .text-introduce{
		margin-top:12%;
	}
	#downloadcenter .detail .text-introduce .qcode_iclass,#downloadcenter .detail .text-introduce .qcode_patrol{
		display: inline-block;
		margin-top:4%;
		position: absolute;
    	left: 0;
	}
	#downloadcenter .detail .text-introduce .qcode_patrol+.btn-group{
		margin-top:4%;
	}
	#downloadcenter .detail.two .text-introduce h2{
		margin:0 auto 4%;
		text-align: left;
		color:#333;
	}
	#downloadcenter .detail.two .text-introduce p.edition{
		text-align: left;
		margin-bottom:0;
		color:#595959;
	}
	#downloadcenter .detail.two .text-introduce p.content{
		width:83%;
		text-align: left;
		margin:0;
		margin-top: 10px;
	}
	
	#downloadcenter .detail ul{
		list-style-type: none;
		text-align: left;
		padding:0;
		margin-top:2%;
		margin-bottom: 0;
		font-size: 14px;
		color:#595959;
	}
	#downloadcenter .detail.two .appload{
		position: relative;
    	text-align: left;
    	height: 230px;
	}
	
	#downloadcenter .detail.two .btn-group{
	    display: inline-block;
	    vertical-align: middle;
	    position: absolute;
		left: 34%;
	    width: 280px;
	    text-align: center;
	}
	 #downloadcenter .btn-group i{
		display: inline-block;
		width:50px;
		height: 56px;
		vertical-align: middle;
		margin-bottom: 5px;
		margin-right: 20px;
	}
	#downloadcenter .detail.two .btn-group .load-ios.btn i{
		background:url('../images/downloadcenter/ios.png') no-repeat center;
	}
	#downloadcenter .detail.two .btn-group .load-ios.btn:hover i{
		background:url('../images/downloadcenter/ios-h.png') no-repeat center;
	}
	 #downloadcenter .btn-group .load-andr.btn  i{
		background:url('../images/downloadcenter/andr.png') no-repeat center;
	}
	 #downloadcenter .btn-group .load-andr.btn:hover i{
		background:url('../images/downloadcenter/andr-h.png') no-repeat center;
	}
	#downloadcenter .detail.two .text-introduce p.btn{
		/*margin: 0 0 40px;*/
		width:280px;
	}
	#downloadcenter .detail.two .text-introduce p.btn a{
		width:210px;
	}
	#downloadcenter .detail.two .pic-introduce{
		position: relative;
		padding-top:88px;
		padding-left: 200px;
		width:50%;
		height:100%;
	}
	#downloadcenter .detail.two .pic-introduce img{
		position: absolute;
		left: 20%;
    	top: 13%;
	}
	#downloadcenter .detail.two .pic-introduce .pic4{
		left: 30%;
    	top: 23%;
    	width:38%;
	}
	#downloadcenter .detail.two .pic-introduce .pic3{
		left: 40%;
    	top: 28%;
    	width:41.5%;
	}
	#downloadcenter .detail.two .pic-introduce .pic2{
		left: 31%;
    	top: 32%;
    	width:41.5%;
	}
	#downloadcenter .detail.two .pic-introduce .pic1{
		left: 21%;
    	top: 36.5%;
    	width:56.6%;
	}
	#downloadcenter .service .detail.two .pic-introduce .pic4{
		left: 25%;
    	top: 32%;
    	width: 25%;
	}
	#downloadcenter .service .detail.two .pic-introduce .pic3{
		left: 60%;
    	top: 15%;
    	width: 25%;
	}
	#downloadcenter .service .detail.two .pic-introduce .pic2{
		left: 67%;
    	top: 42%;
    	width: 25%;
	}
	#downloadcenter .service .detail.two .pic-introduce .pic1{
		left: 21%;
    	top: 7%;
    	width: 80%;
	}
	@media screen and (min-device-aspect-ratio:4/3){ 
		#downloadcenter .patrol .detail.two .pic-introduce .pic4{
			left: 47%;
			top: 45.5%;
			width: 26%;
		}
	
		#downloadcenter .patrol .detail.two .pic-introduce .pic3{
			left: 30%;
			top: 20%;
			width: 49%;
	
		}
		#downloadcenter .patrol .detail.two .pic-introduce .pic2{
			left: 28%;
			top: 19.5%;
			width: 63%;
		}
		#downloadcenter .patrol .detail.two .pic-introduce .pic1{
			left: 30%;
			top: 36.5%;
		
		}
	}
	@media screen and (min-device-aspect-ratio:16/10){ 
		#downloadcenter .patrol .detail.two .pic-introduce .pic4{
			left: 47%;
			top: 46.5%;
			width: 26%;
		}
	
		#downloadcenter .patrol .detail.two .pic-introduce .pic3{
			left: 30%;
			top: 18%;
			width: 49%;
	
		}
		#downloadcenter .patrol .detail.two .pic-introduce .pic2{
			left: 28%;
			top: 17.5%;
			width: 63%;
		}
		#downloadcenter .patrol .detail.two .pic-introduce .pic1{
			left: 30%;
			top: 36.5%;
		
		}
	}
@media screen and (min-device-aspect-ratio:16/9){ 
	#downloadcenter .patrol .detail.two .pic-introduce .pic4{
		left: 47%;
		top: 47.5%;
		width: 26%;
	}

	#downloadcenter .patrol .detail.two .pic-introduce .pic3{
		left: 30%;
		top: 15%;
		width: 49%;
	}
	#downloadcenter .patrol .detail.two .pic-introduce .pic2{
		left: 28%;
		top: 14.5%;
		width: 63%;
	}
	#downloadcenter .patrol .detail.two .pic-introduce .pic1{
		left: 30%;
		top: 36.5%;
	
	}
}


	#downloadcenter .detail.three .appload{
		position: relative;
		height: 220px;
		text-align: center;
    	width: 78%;
    	margin: 0 auto;
	}
	#downloadcenter .detail.three .appload .btn-group{
		position: absolute;
		top:55%;
		left:260px;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
	}
	#downloadcenter .detail.three .pic-introduce img{
		position: absolute;
	}
	#downloadcenter .detail.three .pic-introduce img.pic1{
		left: 18%;
    	top: 24.5%;
    	width: 64%;
	}
	#downloadcenter .detail.three .pic-introduce img.pic1.wk{
		left: 11%;
    	top: 51.5%;
    	width: 67%;
	}
	#downloadcenter .detail.three .pic-introduce img.pic2{
		left: 19%;
    	top: 9%;
    	width: 64%;
	}
	#downloadcenter .detail.three .pic-introduce img.pic2.wk{
		left: 8%;
    	top: 13.8%;
    	width: 77%;
	}
	#downloadcenter .detail.three .pic-introduce img.pic3{
		left: 43%;
    	top: 49.2%;
    	width: 16%;
	}
	#downloadcenter .detail.three .pic-introduce img.pic3.wk{
		left: 24.9%;
    	top: 49.5%;
    	width: 35.8%;
	}
	#downloadcenter .detail.three .pic-introduce img.pic4.wk{
		top: 42%;
    	left: 19%;
    	width: 49%;
	}
	#downloadcenter .detail.three .pic-introduce img.pic5.wk{
		top: 33%;
	    left: 13%;
	    width: 64%;
	}
	#downloadcenter .hide{
		display: none;
	}
	#downloadcenter .fr{
		float: right;
	}
	#downloadcenter .fl{
		float: left;
	}
	#downloadcenter aside{
		position: fixed;
		top:50%;
		right:20px;
		-webkit-transform:translateY(-50%) ;
		transform:translateY(-50%) ;
	}
	#downloadcenter aside a{
		display: block;
		width:130px;
		height:40px;
		line-height: 40px;
		box-sizing: border-box;
		background-color: #c6d0d2;
		border-radius: 80px;
		font-size: 16px;
		text-align: center;
		margin-bottom: 28px;
		text-decoration: none;
		color: #778183; 
		cursor: pointer;
	}
	#downloadcenter aside a.active,aside a:hover{
		background-color:#3adebc ;
		color: #fff;
	}
	/*动画延迟效果*/
	#downloadcenter .delay5{
		animation-delay:0.5s;
		-webkit-animation-delay:0.5s;
	}
	#downloadcenter .delay6{
		animation-delay:0.6s;
		-webkit-animation-delay:0.6s;
	}
	#downloadcenter .delay8{
		animation-delay:0.8s;
		-webkit-animation-delay:0.8s;
	}
	#downloadcenter .delay10{
		animation-delay:1s;
		-webkit-animation-delay:1s;
	}
	#downloadcenter .delay12{
		animation-delay:1.2s;
		-webkit-animation-delay:1.2s;
	}
/* 第三方应用 */
#downloadcenter .container .anotherApp{
	width: 100%;
	padding:0 100px;
	margin-top: calc(50px + 30px);
	box-sizing: border-box;
}
#downloadcenter .container .anotherApp .container-app{
	width: 100%;
	height: 160px;
	box-sizing: border-box;
	background:#ecf1ff;
	border-radius: 10px;
}
#downloadcenter .container .anotherApp .container-app .logo{
	display: inline-block;
	width: 120px;
	height: 120px;
	margin-left: 40px;
	margin-top: 20px;
}
#downloadcenter .container .anotherApp .container-app .logo img{
	max-width: 100%;
	max-height: 100%;
	vertical-align: middle;
}
#downloadcenter .anotherApp .container-app .discribe{
	display: inline-block;
	height: 100%;
	vertical-align: middle;
		margin-left: 60px;
}
#downloadcenter .anotherApp .container-app .discribe .app-name{
	font-size: 36px;
	color:#333;
	display: inline-block;
	margin-bottom: 24px;
}
#downloadcenter .anotherApp .container-app .discribe .discribe-text{
	font-size: 18px;
	color:#333;
}
#downloadcenter .anotherApp .container-app .load-btn{
	float: right;
	margin-right: 60px;
	width:230px;
	height: 70px;
	border-radius: 50px;
	border:1px solid #333;
	color: #333;
	font-size: 26px;
	text-align: center;
	line-height: 70px;
	margin-top: 45px;
	cursor: pointer;
}
@media screen and (min-device-aspect-ratio:3/4){
	#downloadcenter .container .anotherApp{
		padding:0 60px;
	}
	#downloadcenter .container .anotherApp .container-app .logo{
		margin-left: 20px;
	}
	#downloadcenter .anotherApp .container-app .load-btn{
		width:180px;
		height: 70px;
		margin-right: 20px;
	}
	#downloadcenter .anotherApp .container-app .discribe{
		margin-left: 40px;
	}
}
@media screen and (min-device-aspect-ratio:16/9){
	#downloadcenter .container .anotherApp{
		padding:0 100px;
	}
	#downloadcenter .container .anotherApp .container-app .logo{
		margin-left: 40px;
	}
	#downloadcenter .anotherApp .container-app .load-btn{
		width:230px;
		height: 70px;
		margin-right: 60px;
	}
	#downloadcenter .anotherApp .container-app .discribe{
		margin-left: 60px;
	}
}
@media screen and (max-width:800px){
	#downloadcenter ul.nav{
		padding:0 80px;
	}
	#downloadcenter .container .anotherApp{
		padding:0 20px;
	}
	#downloadcenter .container .anotherApp .container-app .logo{
		width: 80px;
		height: 80px;
		margin-top: 40px;
	}
	#downloadcenter .anotherApp .container-app .discribe{
		margin-left: 20px;
	}
	#downloadcenter .anotherApp .container-app .discribe .app-name{
		font-size: 26px;
	}
	#downloadcenter .anotherApp .container-app .discribe .discribe-text{
		font-size: 16px;
	}
}
/* 验证码弹窗 */
.captcha-dialog {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 99;
	display: none;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	transition: opacity 0.2s;
	opacity: 0;
}
.captcha-dialog-show {
	opacity: 1;
}
.captcha-dialog-body {
	width: 280px;
	/* height: 240px; */
	background-color: #FFFFFF;
	border-radius: 2px;
	text-align: center;
	box-sizing: border-box;
}
.captcha-dialog-title {
	width: 100%;
	padding: 20px 20px 10px;
	line-height: 24px;
    font-size: 18px;
    color: #303133;
	box-sizing: border-box;
}
.captcha-dialog-captcha {
	padding-left: 25px;
	padding-right: 25px;
	padding-top: 10px;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 12px;
	box-sizing: border-box;
}
.captcha-dialog-captcha .change-one {
	color: #409EFF;
    cursor: pointer;
    font-size: 16px;
	user-select: none;
}
.captcha-dialog-captcha .change-one:hover {
	color: #66b1ff;
}
.captcha-dialog-body .captcha-input {
	width: 100%;
	font-size: 14px;
	margin-bottom: 12px;
	box-sizing: border-box;
	padding: 0 25px;
}
.captcha-dialog-body .captcha-input .captcha-input-inner {
    background-color: #FFF;
    background-image: none;
    border-radius: 4px;
    border: 1px solid #DCDFE6;
    box-sizing: border-box;
    color: #606266;
    display: inline-block;
    font-size: inherit;
    height: 36px;
    line-height: 36px;
    outline: 0;
    padding: 0 15px;
    transition: border-color .2s cubic-bezier(.645,.045,.355,1);
    width: 100%;
}
.captcha-dialog-body .captcha-input .captcha-input-inner::placeholder {
	color: #A8ABB2;
}
.captcha-dialog-body .captcha-input .captcha-input-inner:hover {
	border-color: #C0C4CC;
}
.captcha-dialog-body .captcha-input .captcha-input-inner:focus {
	border-color: #409EFF;
}
.captcha-dialog-footer {
	padding-top: 10px;
	padding-bottom: 20px;
	width: 100%;
	display: flex;
	justify-content: center;
	box-sizing: border-box;
}
.captcha-dialog-footer .captcha-btn {
	user-select: none;
	cursor: pointer;
	display: inline-block;
    line-height: 1;
    white-space: nowrap;
    background: #FFF;
    border: 1px solid #DCDFE6;
    color: #606266;
    text-align: center;
    box-sizing: border-box;
    outline: 0;
    margin: 0;
    transition: .1s;
    font-weight: 500;
    padding: 10px 20px;
    font-size: 14px;
    border-radius: 4px;
}
.captcha-dialog-footer .captcha-cancel:hover {
	color: #409EFF;
    border-color: #c6e2ff;
    background-color: #ecf5ff;
}
.captcha-dialog-footer .captcha-sure {
	color: #FFF;
    background-color: #409EFF;
    border-color: #409EFF;
	margin-left: 20px;
}
.captcha-dialog-footer .captcha-sure:hover {
	background: #66b1ff;
    border-color: #66b1ff;
}