.download{text-align:center; position:relative; overflow:hidden;}
.download>article{position:relative; z-index:8;}
.download:before,
.download:after{position:absolute; top:0; right:0; bottom:0; left:0; content:''; background:url('../box/bg.jpg') center; background-size:cover;}
.download:before{ animation:bg 4s ease-in-out infinite; z-index:6;}
@media(min-width:1200px){
.download{padding:50px 0;}
}
@media(max-width:1199px){
.download{padding:30px 0;}
}
@media(max-width:767px){
.download{padding:15px 0;}
}
.download h2{font-size:48px; font-weight:400; margin-bottom:8px; font-weight:bold;}
.download p.txt{font-size:22px; margin-bottom:48px;}
.download h3{display:block; margin-bottom:38px;}
.download h3>a{background:#3763dd; color:#fff; display:inline-block; padding:10px 40px; border-radius:54px; line-height:1.75; font-size:18px;}
.download h3>a:before{padding-right:4px; position:relative; left:-4px;}
.download h3>a:hover{background:#5691f5;}
@keyframes bg {
    0%, 100% {transform:scale(1); opacity:1;}
    90% {transform:scale(1.1);}
    98% {opacity:0;}
}
 
.download p.line{margin:0 0 18px 0; color:red;}
.download p.vip{margin:0 0 38px 0; font-size:18px;}

.download aside{max-width:528px; background:#f3f7ff; line-height:2; padding:18px; margin:0 auto 28px auto; border-radius:8px;}
.download h4{}
.download h4 a{display:inline-block; font-size:14px; background:#e8e8e8; padding:2px 8px; border-radius:3px; margin-right:5px;
box-shadow:0 0 3px rgba(0,0,0,.08); transition:.3s; color:#fff;
background:-webkit-gradient(linear, left top, right bottom, color-stop(0%,#eae066), color-stop(100%,#9a8917));
background:-moz-linear-gradient(to right bottom, #eae066 0%, #9a8917 100%);
background:-webkit-linear-gradient(to right bottom, #eae066 0%, #9a8917 100%);
background:-o-linear-gradient(to right bottom, #eae066 0% #9a8917 100%);
background:-ms-linear-gradient(to right bottom, #eae066 0%, #9a8917 100%);
background:linear-gradient(to right bottom, #eae066 0%, #9a8917 100%);}
.download h4 a:hover{
box-shadow:0 0 3px rgba(0,0,0,.08);
background:-webkit-gradient(linear, right bottom, left top, color-stop(0%,#eae066), color-stop(100%,#9a8917));
background:-moz-linear-gradient(to left top, #eae066 0%, #9a8917 100%);
background:-webkit-linear-gradient(to left top, #eae066 0%, #9a8917 100%);
background:-o-linear-gradient(to left top, #eae066 0% #9a8917 100%);
background:-ms-linear-gradient(to left top, #eae066 0%, #9a8917 100%);
background:linear-gradient(to left top, #eae066 0%, #9a8917 100%);}
.download h4 a + a{
background:-webkit-gradient(linear, left top, right bottom, color-stop(0%,#e8a8a8), color-stop(100%,#a22a2a));
background:-moz-linear-gradient(to right bottom, #e8a8a8 0%, #a22a2a 100%);
background:-webkit-linear-gradient(to right bottom, #e8a8a8 0%, #a22a2a 100%);
background:-o-linear-gradient(to right bottom, #e8a8a8 0% #a22a2a 100%);
background:-ms-linear-gradient(to right bottom, #e8a8a8 0%, #a22a2a 100%);
background:linear-gradient(to right bottom, #e8a8a8 0%, #a22a2a 100%);}
.download h4 a + a:hover{
box-shadow:0 0 3px rgba(0,0,0,.08);
background:-webkit-gradient(linear, right bottom, left top, color-stop(0%,#e8a8a8), color-stop(100%,#a22a2a));
background:-moz-linear-gradient(to left top, #e8a8a8 0%, #a22a2a 100%);
background:-webkit-linear-gradient(to left top, #e8a8a8 0%, #a22a2a 100%);
background:-o-linear-gradient(to left top, #e8a8a8 0% #a22a2a 100%);
background:-ms-linear-gradient(to left top, #e8a8a8 0%, #a22a2a 100%);
background:linear-gradient(to left top, #e8a8a8 0%, #a22a2a 100%);}
.download h4 a i{margin-right:2px;}
@media(max-width:767px){
.download h2{font-size:26px;}
.download p.txt{font-size:16px; margin-bottom:18px;}
.download h3 a{padding:8px 28px; font-size:18px;}
.download p.line{margin:0 0 8px 0;}
.download p.vip{margin:0 0 18px 0; font-size:16px;}

.download h3 a{line-height:38px; padding:0 14px 0 22px; border-radius:4px;}
.download h3 a:before,
.download h3 a:after,
.download h3 a i:after,
.download h3 a i{width:24px; height:24px; line-height:24px; font-size:14px; margin-left:4px;}
.download h3 a b{font-size:16px; line-height:38px;}
.download h3 a:before{width:10px; height:10px; left:4px; bottom:4px;}
.download h3 a:after{width:6px; height:6px; left:8px; top:4px;}
.download h3 a i:after{top:-2px; right:-2px; width:8px; height:8px;}
.download h3 a:last-child{margin-left:12px;}
}





.update{background:#f7f8fa url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASAQMAAABsABwUAAAABlBMVEUAAADd3uHogCXTAAAAAXRSTlMAQObYZgAAAA9JREFUCNdjOMDAAMQUAwBnyAGBGdiqIAAAAABJRU5ErkJggg==');
padding:50px 0;}
.update>article{width:1400px;}
.uptime{width:260px; float:left; position:sticky; top:90px; overflow:auto; max-height:calc(100vh - 110px);}
.uptime h3{}
.uptime h3 i{font-size:24px; color:#3763dd; width:40px;}
.uptime>ul{display:block; padding-left:10px;}
.uptime>ul>li{border-left:2px solid #3763dd; position:relative; padding:20px 0 20px 30px; height:130px; cursor:pointer;}
.uptime>ul>li>i{position:absolute; top:35px; left:0; font-size:18px; color:#e22; width:20px; height:20px; line-height:20px; border-radius:50%; background:#fff; margin:-10px 0 0 -10px;}
.uplist{margin-left:280px;}
.uplist>ul{display:block;}
.uplist>ul>li{background:#fff; margin-top:20px; padding:5px 20px; border-radius:12px;}
.uplist>ul>li>h3{border-bottom:1px solid #e2e5fa; padding:12px 0;}
.uplist>ul>li>h3>a{float:right; font-size:14px; border:1px solid #bacaf8; color:#3763dd; margin-left:12px; border-radius:50px; padding:0 10px; line-height:30px;}
.uplist>ul>li>h3>a:before{margin-right:4px;}
.uplist>ul>li>h3>a:hover{background:#3763dd; border-color:#3763dd; color:#fff;}
.uplist>ul>li>h3>span{color:#888;}
.uplist>ul>li>aside{overflow:hidden; line-height:2; font-size:14px; margin:20px 0; transition:.3s;}
.uplist>ul>li.on>aside{height:200px !important; }
.uplist>ul>li>a{display:block; border-top:1px solid #e2e5fa; text-align:center; font-size:14px; cursor:pointer; padding:12px 0;}
.uplist>ul>li>a>i{transition:.3s;}
.uplist>ul>li:not(.on)>a{color:#3763dd;}
.uplist>ul>li:not(.on)>a>i{transform:rotate(180deg);}
@media(max-width:1200px){
.update{padding:30px 0;}
.uptime{width:auto; float:none; position:relative; top:0; max-height:none;}
.uptime>ul{display:none;}
.uplist{margin-left:0;}
}
@media(max-width:767px){
.uplist>ul>li>h3{font-size:16px; padding:8px 0;}
.uplist>ul>li>h3>a{display:none;}
.uplist>ul>li{margin-top:10px; padding:5px 10px; border-radius:6px;}
.uplist>ul>li>a{padding:8px 0;}
}