@charset "UTF-8";
body, ul, ol, li, dl, dd, p, h1, h2, h3, h4, h5, h6, form, fieldset, .pr, .pc{margin: 0; padding: 0;}
body, input, button, select, textarea{font: 12px/1.5 Tahoma,'Microsoft Yahei','Simsun'; color: #444;}
.header-wrap{position: fixed; top: 0; left: 0; width: 100%; z-index: 5; transition: background 0.2s linear;}
.downapp-header{position: relative;width: 1200px; height: 60px; line-height: 60px; margin: 0 auto;}
.downapp-header .downapp-nav{position: absolute;top: 0;right: 0;font-size: 18px;margin: 20px;}
.downapp-header .downapp-nav a {color:#FFFFFF;text-decoration: none;padding-left: 10px;}
.downapp-header .downapp-nav a:hover{opacity: 0.6;}
.logo-hg163{display: inline-block;margin:20px; transition: background 0.2s linear;}
.wrappage-container .wrappage-cover-wrap{position: relative; background-size: cover; color: #fff; line-height: 1; height: 100vh; overflow: hidden;}
.wrappage-container .wrappage-cover-wrap video, .wrappage-container .wrappage-cover-wrap img{height: 100%; width: 100%; object-fit: cover; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transition: .2s ease-in-out; -webkit-transition: .2s ease-in-out; -moz-transition: .2s ease-in-out; -ms-transition: .2s ease-in-out; -o-transition: .2s ease-in-out;}
.wrappage-container .wrappage-cover-main{position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.4);}
.wrappage-container .wrappage-cover-main .wrappage-cover-center{position: absolute; width: 100%; left: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); margin-top: 10px;}
.wrappage-container .wrappage-cover-detail{text-align: center;}
.wrappage-container .wrappage-cover-detail .slogan{font-size: 48px;text-shadow: 1px 1px 2px rgba(0,0,0,.7);}
.wrappage-container .wrappage-cover-detail .join-num{font-size: 20px; font-weight: 300; padding: 25px 0 0;text-shadow: 1px 1px 2px rgba(0,0,0,.7);}
.incremental-counter{font-style: normal; letter-spacing: 2px; font-family: 'Source Sans Pro',Helvetica,Arial,sans-serif;}
.incremental-counter .num, .incremental-counter .do{display: inline-block;}
.wrappage-container .wrappage-cover-main .btn-wrap{margin-top: 69px; text-align: center;}
.wrappage-container .join-btn{display: inline-block; width: 220px; height: 60px; line-height: 60px; border-radius: 60px; text-align: center; cursor: pointer; font-size: 16px; color: #fff; margin: 0 10px;}
.iphone-btn{background: #000000 url(w-iphone.svg);}
.android-btn{background: #000000 url(w-android.svg);}
.iphone-btn:hover{background: #ffe300 url(b-iphone.svg);transition: 0.4s ease-in background;}
.android-btn:hover{background: #ffe300 url(b-android.svg);transition: 0.4s ease-in background;}
.mr40{margin-left: 40px !important;}
.s-s-code{width: 30px; height: 30px;margin-left:10px; margin-bottom: 15px; background: url(top-s-san.svg) no-repeat; display: inline-block; cursor: pointer;}
.downapp-code{width: 150px; height: 186px;margin-left: -20px; padding: 0; position: absolute; bottom: -14px; background-size: 150px 186px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -webkit-background-size: 150px 186px; -moz-background-size: 150px 186px; -ms-background-size: 150px 186px; display: inline-block; transform: scale(0); opacity: 0; transition: all 0.2s cubic-bezier(0.42, 0, 0, 1.18);}
.downapp-code, .pop-downapp-code{background-repeat: no-repeat; background-position: center;}
.effect-code:hover .downapp-code{/* display: block; */ transform: scale(1); opacity: 1;}
.footer-wrap{position: fixed;bottom: 50px;right: 50px;color: #eee;font-size: 12px;text-decoration: none;}
.footer-wrap a{color: #eee;font-size: 12px;text-decoration: none;text-shadow: 1px 1px 2px rgba(0,0,0,.7);}
.footer-wrap a:hover{text-decoration: none;}