img {
    border: none;
    vertical-align: top
}

dd,dl,dt,h1,h2,h3,h4,li,ol,ul {
    margin: 0
}

li,ol,ul {
    padding: 0;
    list-style: none
}

a,button {
    color: #000;
    text-decoration: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none
}

a,button,div,label,span {
    -webkit-tap-highlight-color: transparent
}

body,input,textarea {
    font-size: .13rem;
    font-family: "PingFang SC","Hiragino Sans GB","Microsoft YaHei",Helvetica,Arial,"Heiti SC",sans-serif;
    -webkit-font-smoothing: antialiased
}

input,textarea {
    outline: 0;
    color: #8c8fa4;
    -webkit-box-sizing: border-box
}

html {
    height: 100%
}

body,html {
    margin: 0 auto;
    width: 100%;
    height: 100%;
    background: #f5f5f5;
    color: #8c8fa4;
    min-height: 100%
}

body {
    font-size: 14px;
    line-height: 18px;
    color: #333
}

.main-continar {
    height: 100%
}

.wrap {
    height: 100%
}

p {
    margin: 0
}

h1,h2,h3,h4,h5,h6,strong {
    font-weight: 700
}

#__vconsole .vc-item-content span:nth-of-type(1),#__vconsole .vc-item-content span:nth-of-type(2) {
    color: #03a9f4
}

#body,#root-container,#root-wrap {
    min-height: 100%;
    height: 100%
}

.observer-render {
    width: 100%;
    height: 100%;
    text-align: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center
}

.observer-render img {
    width: .45rem
}

body,html {
    background-color: #fff;
    height: auto
}

#container {
    padding-top: .45rem;
    box-sizing: border-box;
    width: 100%;
    overflow: hidden
}

.header-box .header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: .45rem;
    z-index: 100;
    text-align: center;
    box-shadow: 0 0 .16rem 0 rgba(42,146,222,.1);
    background: #fff
}

.header-box .header .logo {
    display: inline-block;
    width: auto;
    height: .23rem;
    padding: .11rem 0
}

.header-box .header .menu-icon {
    position: absolute;
    left: .15rem;
    top: 0;
    height: .45rem;
    width: .19rem
}

.header-box .header .menu-icon .more {
    display: inline-block;
    height: .16rem;
    margin: .15rem 0 .14rem 0
}

.header-box .header .menu-icon .close {
    display: none;
    height: .15rem;
    margin: .15rem 0
}

.header-box .header .menu-icon.spread .more {
    display: none
}

.header-box .header .menu-icon.spread .close {
    display: inline-block
}

.header-box .menu-box {
    display: block;
    position: fixed;
    top: .45rem;
    left: 0;
    margin-top: -1px;
    width: 1.67rem;
    padding: 0 .3rem .4rem .3rem;
    box-sizing: border-box;
    text-align: left;
    background: #fff;
    box-shadow: 0 0 .16rem 0 rgba(42,146,222,.1);
    z-index: 99;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: -webkit-transform ease .5s;
    transition: -webkit-transform ease .5s;
    transition: transform ease .5s;
    transition: transform ease .5s,-webkit-transform ease .5s
}

.header-box .menu-box.hide {
    -webkit-transform: translateY(-110%);
    transform: translateY(-110%)
}

.header-box .menu-box .menu-item {
    position: relative;
    height: .19rem;
    line-height: .19rem;
    padding: .17rem 0 .2rem;
    color: #4d4d4d;
    font-size: .16rem;
    border-bottom: 1px solid #c4c4c4
}

.header-box .menu-box .menu-item.checked:after {
    content: "";
    position: absolute;
    top: .17rem;
    right: .01rem;
    width: .18rem;
    height: .19rem;
    background: url(images/selected.png) no-repeat center center/contain
}

.home1 .home-title {
    padding: .73rem 0 .53rem 0;
    text-align: center
}

.home1 .home-title img {
    display: inline-block;
    width: 2.14rem;
    height: .78rem
}

.home1 .home-imgs {
    height: 4rem;
    width: 100%;
    position: relative;
    overflow: hidden
}

.home1 .home-imgs .platform {
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    width: 100%;
    z-index: 1
}

.home1 .home-imgs .group {
    position: absolute;
    top: 0;
    right: .12rem;
    display: block;
    width: 3.22rem;
    z-index: 2;
    opacity: 0;
    -webkit-transition: opacity 1s linear;
    transition: opacity 1s linear
}

.home1 .home-imgs .phone {
    position: absolute;
    bottom: .37rem;
    right: 1.42rem;
    display: block;
    width: .95rem;
    height: 2.75rem;
    z-index: 3;
    opacity: 0;
    -webkit-transform: translate(.25rem,-.15rem);
    transform: translate(.25rem,-.15rem);
    -webkit-transition: opacity .5s linear .5s,-webkit-transform .5s ease .5s;
    transition: opacity .5s linear .5s,-webkit-transform .5s ease .5s;
    transition: transform .5s ease .5s,opacity .5s linear .5s;
    transition: transform .5s ease .5s,opacity .5s linear .5s,-webkit-transform .5s ease .5s
}

.home1 .home-imgs .block1 {
    position: absolute;
    bottom: 1.24rem;
    right: 1.75rem;
    display: block;
    width: .56rem;
    height: .75rem;
    z-index: 4;
    opacity: 0;
    -webkit-transition: opacity .5s linear 1s;
    transition: opacity .5s linear 1s
}

.home1 .home-imgs .block2 {
    position: absolute;
    bottom: 1.87rem;
    right: 1.75rem;
    display: block;
    width: .77rem;
    height: .91rem;
    z-index: 5;
    -webkit-transform: scale(0,0);
    transform: scale(0,0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transition: -webkit-transform .5s ease 1s;
    transition: -webkit-transform .5s ease 1s;
    transition: transform .5s ease 1s;
    transition: transform .5s ease 1s,-webkit-transform .5s ease 1s
}

.home1 .home-imgs .block3 {
    position: absolute;
    bottom: .48rem;
    right: 1.11rem;
    display: block;
    width: 1.18rem;
    height: 1.21rem;
    z-index: 6;
    -webkit-transform: translateY(-3.6rem);
    transform: translateY(-3.6rem);
    -webkit-transition: -webkit-transform 1s ease 1s;
    transition: -webkit-transform 1s ease 1s;
    transition: transform 1s ease 1s;
    transition: transform 1s ease 1s,-webkit-transform 1s ease 1s
}

.home1 .home-imgs.show .group {
    opacity: 1
}

.home1 .home-imgs.show .phone {
    opacity: 1;
    -webkit-transform: translate(0,0);
    transform: translate(0,0)
}

.home1 .home-imgs.show .block1 {
    opacity: 1
}

.home1 .home-imgs.show .block2 {
    -webkit-transform: scale(1,1);
    transform: scale(1,1)
}

.home1 .home-imgs.show .block3 {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.home2 {
    padding: .55rem 0 .5rem
}

.home2 .home-title {
    text-align: center;
    color: #2d94de;
    line-height: .25rem;
    font-size: .25rem;
    font-weight: 700
}

.home2 .home-desc {
    text-align: center;
    color: #999;
    line-height: .15rem;
    font-size: .15rem;
    padding: .27rem 0 .43rem 0
}

.home2 .home-content {
    padding: 0 .11rem;
    font-size: 0
}

.home2 .home-content .home-content-block {
    display: inline-block;
    vertical-align: top;
    width: 50%;
    height: 2.08rem;
    padding: .05rem;
    box-sizing: border-box
}

.home2 .home-content .home-content-block img {
    display: block;
    width: 100%;
    box-shadow: 0 0 .12rem 0 rgba(42,146,222,.16);
    opacity: 0;
    -webkit-transition: opacity ease 1s;
    transition: opacity ease 1s
}

.home2 .home-content .home-content-block img.show {
    opacity: 1
}

.home3 {
    padding: .55rem 0 .28rem 0;
    background: #1585da;
    background: -webkit-linear-gradient(left,#50a9e4,#1585da);
    background: linear-gradient(to right,#50a9e4,#1585da)
}

.home3 .home-title {
    color: #fff;
    font-size: .25rem;
    line-height: .25rem;
    font-weight: 700;
    text-align: center
}

.home3 .home-desc {
    padding: .15rem 0 .2rem 0;
    color: #fff;
    font-size: .15rem;
    line-height: .15rem;
    text-align: center
}

.home3 .home-swiper .swiper-slide {
    padding: .67rem .1rem .26rem .1rem;
    box-sizing: border-box
}

.home3 .home-swiper .swiper-slide .content-box {
    position: relative;
    height: 4.08rem;
    background: #fff;
    border-radius: .1rem
}

.home3 .home-swiper .swiper-slide .content-box .qrcode-box {
    position: absolute;
    top: .6rem;
    right: .29rem;
    width: .97rem
}

.home3 .home-swiper .swiper-slide .content-box .qrcode-box .qrcode {
    width: .77rem;
    height: .77rem;
    padding: .04rem;
    margin: 0 .1rem;
    box-sizing: border-box;
    background: url(images/code_border.png) no-repeat center center/100% 100%
}

.home3 .home-swiper .swiper-slide .content-box .qrcode-box .qrcode img {
    display: block;
    width: 100%;
    height: 100%
}

.home3 .home-swiper .swiper-slide .content-box .qrcode-box .desc {
    line-height: .31rem;
    height: .31rem;
    text-align: center;
    color: #2d94de;
    font-size: .11rem
}

.home3 .home-swiper .swiper-slide .content-box .infos {
    padding-top: 2.35rem
}

.home3 .home-swiper .swiper-slide .content-box .infos .title {
    position: relative;
    padding: .2rem 0 .13rem 0;
    color: #2d94de;
    font-size: .15rem;
    font-weight: 700;
    text-align: center
}

.home3 .home-swiper .swiper-slide .content-box .infos .title:after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    display: block;
    width: .26rem;
    height: .03rem;
    background: #d3edfc;
    border-radius: .01rem
}

.home3 .home-swiper .swiper-slide .content-box .infos .sub-title {
    padding: .12rem .09rem;
    color: #2d94de;
    font-size: .12rem;
    text-align: center;
    line-height: .16rem;
    height: .32rem
}

.home3 .home-swiper .swiper-slide .content-box .infos .info-list {
    padding-left: .46rem
}

.home3 .home-swiper .swiper-slide .content-box .infos .info-list .info-item {
    line-height: .16rem;
    color: #2d94de;
    font-size: 0
}

.home3 .home-swiper .swiper-slide .content-box .infos .info-list .info-item .center,.home3 .home-swiper .swiper-slide .content-box .infos .info-list .info-item .left,.home3 .home-swiper .swiper-slide .content-box .infos .info-list .info-item .right {
    font-size: .12rem;
    display: inline-block;
    width: auto;
    vertical-align: top
}

.home3 .home-swiper .swiper-slide .content-box .infos .info-list .info-item .left {
    width: .48rem;
    text-align: justify;
    text-align-last: justify
}

.home3 .home-swiper .swiper-slide .content-box .infos .info-list .info-item .right {
    color: #999
}

.home3 .home-swiper .swiper-slide .content-box .phone {
    position: absolute;
    top: -.67rem;
    left: 1.01rem;
    width: 1.54rem;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition: -webkit-transform ease .8s .2s;
    transition: -webkit-transform ease .8s .2s;
    transition: transform ease .8s .2s;
    transition: transform ease .8s .2s,-webkit-transform ease .8s .2s;
    border-radius: .16rem;
    box-shadow: 0 0 .32rem 0 rgba(42,146,222,.13)
}

.home3 .home-swiper .swiper-slide .content-box.has-qrcode .phone {
    left: .38rem
}

.home3 .home-swiper .swiper-pagination-bullets {
    bottom: 0
}

.home3 .home-swiper .swiper-pagination-bullets .swiper-pagination-bullet {
    width: .05rem;
    height: .05rem;
    background-color: rgba(255,255,255,.6)
}

.home3 .home-swiper .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: .07rem;
    height: .07rem;
    background-color: #fff
}

.home3 .home-swiper.show .swiper-slide.swiper-slide-active .content-box .phone {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.home4 {
    padding: .55rem 0;
    overflow: hidden
}

.home4 .home-title {
    color: #2d94de;
    font-size: .25rem;
    font-weight: 700;
    text-align: center;
    line-height: .25rem
}

.home4 .home-desc {
    text-align: center;
    color: #999;
    line-height: .15rem;
    font-size: .15rem;
    padding: .15rem 0 0 0
}

.home4 .home-swiper {
    opacity: 0;
    -webkit-transition: opacity ease 1s;
    transition: opacity ease 1s
}

.home4 .home-swiper.show {
    opacity: 1
}

.home4 .home-swiper .swiper-slide {
    width: 2.39rem;
    padding: .29rem .24rem 0 .24rem
}

.home4 .home-swiper .swiper-slide img {
    display: block;
    width: 2.39rem;
    box-shadow: 0 0 .32rem 0 rgba(42,146,222,.13)
}

.home4 .home-swiper .swiper-slide p {
    padding-top: .18rem;
    color: #2d94de;
    font-size: .15rem;
    font-weight: 700;
    text-align: center
}

#qaq {
    padding: 1.1rem .25rem .55rem .29rem;
    background: #f7fcff url(images/qaq.png) no-repeat right top/1.96rem 1.43rem
}

#qaq .qaq-title {
    position: relative;
    height: .36rem;
    line-height: .36rem;
    color: #4d4d4d;
    font-size: .18rem;
    font-weight: 700
}

#qaq .qaq-title:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    display: block;
    width: .23rem;
    height: .02rem;
    background: #2d94de
}

#qaq .qaq-list {
    width: 100%;
    overflow: hidden
}

#qaq .qaq-list .qaq-item {
    padding-top: .3rem;
    padding-left: .14rem;
    -webkit-transition: -webkit-transform ease 1s;
    transition: -webkit-transform ease 1s;
    transition: transform ease 1s;
    transition: transform ease 1s,-webkit-transform ease 1s
}

#qaq .qaq-list .qaq-item:nth-child(odd) {
    -webkit-transform: translateX(-110%);
    transform: translateX(-110%)
}

#qaq .qaq-list .qaq-item:nth-child(even) {
    -webkit-transform: translateX(110%);
    transform: translateX(110%)
}

#qaq .qaq-list .qaq-item .qustion {
    position: relative;
    color: #4d4d4d;
    font-size: .15rem;
    font-weight: 700
}

#qaq .qaq-list .qaq-item .qustion:after {
    content: "";
    position: absolute;
    left: -.13rem;
    top: .06rem;
    display: block;
    width: .05rem;
    height: .05rem;
    border: 1px solid #2d94de;
    box-sizing: border-box;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

#qaq .qaq-list .qaq-item .answer {
    padding-top: .09rem;
    color: #4d4d4d;
    font-size: .11rem
}

#qaq .qaq-list.show .qaq-item {
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

#contact .content {
    position: relative;
    width: 100%;
    height: 5.68rem;
    overflow: hidden
}

#contact .content img {
    display: block;
    width: 100%
}

#contact .content .mask {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.3)
}

#contact .content .info-box {
    position: absolute;
    bottom: 2.13rem;
    left: 50%;
    margin-left: -1.58rem;
    width: 3.16rem;
    -webkit-transform: translateY(-3.7rem);
    transform: translateY(-3.7rem);
    -webkit-transition: -webkit-transform ease 1s;
    transition: -webkit-transform ease 1s;
    transition: transform ease 1s;
    transition: transform ease 1s,-webkit-transform ease 1s
}

#contact .content .info-box .contact-infos {
    background: #fff;
    border-radius: .1rem;
    overflow: hidden;
    box-shadow: 0 0 .16rem 0 rgba(10,45,70,.31)
}

#contact .content .info-box .contact-infos .info-title {
    padding: .11rem 0 .09rem 0;
    background: #188be2;
    background: -webkit-linear-gradient(left,#50a9e4,#188be2);
    background: linear-gradient(to right,#50a9e4,#188be2);
    text-align: center;
    color: #fff
}

#contact .content .info-box .contact-infos .info-title h2 {
    font-size: .22rem;
    font-weight: 700;
    line-height: .31rem
}

#contact .content .info-box .contact-infos .info-title p {
    font-size: .14rem;
    line-height: .24rem
}

#contact .content .info-box .contact-infos .info-list {
    padding: .1rem 0
}

#contact .content .info-box .contact-infos .info-list .info-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    padding-left: .33rem;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center
}

#contact .content .info-box .contact-infos .info-list .info-item .img-box {
    width: .17rem;
    padding-right: .2rem
}

#contact .content .info-box .contact-infos .info-list .info-item .img-box img {
    display: block;
    margin: 0 auto
}

#contact .content .info-box .contact-infos .info-list .info-item .img-box .contact-phone {
    width: .14rem
}

#contact .content .info-box .contact-infos .info-list .info-item .img-box .contact-mail {
    width: .17rem
}

#contact .content .info-box .contact-infos .info-list .info-item .img-box .contact_addr {
    width: .12rem
}

#contact .content .info-box .contact-infos .info-list .info-item span {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    flex: 1;
    display: block;
    line-height: .18rem;
    font-size: .14rem;
    color: #666;
    padding: .08rem 0
}

#contact .content .info-box .contact-infos .info-list .info-item span a {
    font-size: .14rem;
    color: #666
}

#contact .content .info-box .arrow-box {
    position: absolute;
    left: 50%;
    margin-left: -.15rem;
    bottom: -.14rem;
    padding: .05rem;
    clip: rect(.15rem .3rem .3rem 0)
}

#contact .content .info-box .arrow-box .arrow {
    width: .2rem;
    height: .2rem;
    background: #fff;
    border-bottom-right-radius: .05rem;
    box-shadow: 0 0 .13rem 0 rgba(10,45,70,.31);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: center center;
    transform-origin: center center
}

#contact .content.show .info-box {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

#contact .company-info {
    padding: .05rem 0 .07rem;
    text-align: center;
    color: #1c1c1c
}

#contact .company-info .name {
    font-size: .14rem;
    line-height: .24rem
}

#contact .company-info .info {
    font-size: .1rem;
    line-height: .18rem
}

#contact .company-info .info span+span {
    padding-left: .09rem
}
