@charset "UTF-8";

@font-face{font-family:"iconfont";src:url('iconfont.woff2?t=1666930356711') format('woff2'),url('iconfont.woff?t=1666930356711') format('woff'),url('iconfont.ttf?t=1666930356711') format('truetype')}
.icon{font-family:"iconfont" !important;font-size:1.1vw;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.iandroid:before{content:"\e602"}
.iapple:before{content:"\e603"}

body,ul,li,h1,h2,h3,h4,h5,h6,p,form,dl,dt,dd{margin:0px;padding:0px;font-weight:normal;font-family: 'PingFangSC-Medium', 'PingFang SC', 'PingFangSC-Regular', 'helvetica neue', tahoma, 'microsoft yahei', arial, 'hiragino sans gb', sans-serif;}
body, html, .box, #shadow { height: 100vh; width: 100vw; }


.logo { margin: 5vh 3vw 0 3vw; width: 13vw; }
.logo:after,.con:before,.con:after, .content:after { clear: both; content: ""; }
.text { width: 30vw; padding: 5vw 10vw; color: #fff; line-height: 1.5;}
.text h3, .text h5, .text p { text-shadow: 1px 1px 3px rgba(0, 0, 0, 1.0);}
.text h3 { font-size: 3rem; font-weight: 700; }
.text h5 { font-size: 1.5rem; }
.text p { margin: 1vh 0; }
.btn { padding: 2vh 0; }
.btn a {text-decoration: none; color: #00acc1; font-size: 2vh; display: none}
.btn span { display: inline-block; background: #fff; color: #333; text-decoration: none; text-align: center; border-radius: 100rem;  font-size: 1vw; line-height: 2.2vw; padding: 0 1vw;}
.text .qr img { width: 30%; border: 1vh solid #fff; border-radius: 2vh; background: #fff;}

.phone { width: 50vw; position: relative;}
.phone img { width: 25vw; padding: 0 12.5vw; }

#shadow { display: none; }

.container{background:linear-gradient(50deg,rgba(84,58,183,1) 0%,rgba(0,172,193,1) 100%); position: relative; height: 90vh;overflow: hidden;}
.content{ width:100%;margin:0;padding:0;}
.waves{position:absolute;width:100%;height:15vh;margin-bottom:-7px;min-height:100px;max-height:150px;bottom: 0;left: 0;}
.parallax > use{animation:move-forever 25s cubic-bezier(0.55,0.5,0.45,0.5) infinite}
.parallax > use:nth-child(1){animation-delay:-2s;animation-duration:7s}
.parallax > use:nth-child(2){animation-delay:-3s;animation-duration:10s}
.parallax > use:nth-child(3){animation-delay:-4s;animation-duration:13s}
.parallax > use:nth-child(4){animation-delay:-5s;animation-duration:20s}
@keyframes move-forever{0%{transform:translate3d(-90px,0,0)}100%{transform:translate3d(85px,0,0)}}

/*手机*/
@media screen and (max-width:600px){

.logo { display: none; }
.container { height: 75vh; }
.text { width: 100vw; text-align: center; padding: 3vh 0;}
.text .btn, .text .qr { display: none; }

.phone { width: 100vw; }
.phone img { width: 50vw; padding: 0 25vw }
.foot { display: none; }
.footer {text-align: center; margin-top: 1vh; color: #999}
.footer span { line-height: 6vh; font-size: 2.5vh; padding: 0 2.5vh; color: #fff; background: #426cbb; margin-bottom: 2vh; display: none; }
.footer span i { font-size: 2.8vh; }
.footer p { font-size: 1.5vh; }

#shadow { position: absolute; top: 0; left: 0; background: rgba(0,0,0, 0.8); z-index: 9998; }
#shadow img { position: absolute; left: 0; width: 100vw; }
#shadow .share1 { top: 0; z-index: 9999; }
}
/*平板*/
@media screen and (min-width:600px) {
.text, .phone { float:left }
.container { overflow: hidden; }
.foot { position: absolute; bottom: 0; width: 100vw; height: 5vh; line-height: 5vh; font-size: 0.8rem; text-align: center; }
.footer { display: none; }
.btn span { box-shadow: 1px 1px 1px #000; color: #485eba; margin-right: 1vw; }
}