
main .top-banner{padding: 150px 0 0;background:#007dd9 url("images/banner-bg.jpg");}
main .top-banner .lft{width: 37%}
main .top-banner h1{font-size: 42px;line-height: 1.2em;margin:0 0 20px 0;transition: all 1s linear;transform: translateY(60px);}
main .top-banner.active h1{transform: translateY(0px);}
main .top-banner .tip{font-size: 18px;max-width: 1000px;margin: 20px auto 60px;transition: all 1s linear;transform: translateY(40px);line-height: 26px;letter-spacing: 0;}
main .top-banner.active .tip{transform: translateY(0px);}
main .top-banner .button-group{font-size: 0;margin-bottom: 10px;}
main .top-banner .switch-group{margin: 0 0 82px 12px}
main .top-banner .download-btn{background: #FFF;color: #3f4e59;font-size: 22px;display: inline-block;margin: 10px;margin-left:0;padding:0 25px;font-weight: 700;height: 64px;vertical-align: middle;box-shadow: 0 5px 15px 0 rgba(0,0,0,0.10);border-radius: 41.5px;}
main .top-banner .download-btn:hover{background: #f2f2f2;box-shadow: 2px 4px 12px rgba(0,0,0,0.1);}
main .top-banner .download-btn svg{display: inline-block;vertical-align: middle;height: 64px;position: relative;margin-right:5px}
main .top-banner .download-btn .txt{display: inline-block;vertical-align: middle;text-transform: uppercase;font-size: 22px;letter-spacing: 0;line-height: 26px;}
main .top-banner .buy-btn{background:  #F64F4F;color: #FFF;display: inline-block;margin: 10px;padding:0 40px;font-weight: 700;font-size: 22px;height: 64px;vertical-align: middle;box-shadow: 0 5px 15px 0 rgba(0,0,0,0.10);border-radius: 41.5px;}
main .top-banner .buy-btn:hover{background: #f75b5b;box-shadow: 2px 4px 12px rgba(0,0,0,0.1);}
main .top-banner .buy-btn .pri{font-size: 16px;font-weight: 300;display: block;padding-top: 3px;}
main .top-banner .buy-btn svg{display: inline-block;height: 64px;vertical-align: middle;margin-right:5px}
main .top-banner .buy-btn .con{display: inline-block;vertical-align: middle;text-transform: uppercase}
main .top-banner .hidden{display: none}
main .top-banner .rgt{background: url("../images/banner-img.svg") center no-repeat;width: 65%}
main .top-banner .rgt p{position: relative;text-align: center;top: 43%;font-size: 20px;line-height: 24px;text-shadow: 0 2px 4px rgba(0,0,0,0.05);}
main .top-banner .pwd{font-size: 20px;position: absolute;top: 33%;left: 60%;width: 25ch;white-space: nowrap;overflow: hidden;border-right: solid 1px #ffffff;animation: typing 4s steps(30) infinite,cursor 4s infinite step-end;}
main .top-banner .box{animation: font 4s  ease-in  infinite ;}
@keyframes typing {
    0% { width: 0; }
    50%{opacity: 1}
    100%{opacity: 1}
}
@keyframes cursor {
    50% {
        border-color: transparent;
    }
}
@keyframes font {
    0%{opacity: 0}
    50%{ opacity: 0}
    53%{opacity: 1}
    56%{opacity: 0}
    59%{opacity: 1}
    61%{opacity: 0}
    63%{opacity: 1}
    66%{opacity: 1}
    69%{opacity: 1}
    71%{opacity: 1}
    73%{opacity: 1}
}
main .tips-cont{background: #2D346E;color: #FFF;padding: 30px 0;font-size: 0;}
main .tips-cont .star{padding-top: 10px}
main .tips-cont .container{max-width: 1000px;}
main .tips-cont .logo{width: 8%;display: inline-block;vertical-align: middle;}
main .tips-cont p{width: 80%;display: inline-block;vertical-align: middle;font-size: 16px;padding-left: 2%;color: #D5D6E2;line-height: 22px;}
main .tips-cont .swiper-pagination{bottom:-30px;left: 50%;z-index: 1;transform: translateX(-50%);}
main .tips-cont .swiper-pagination .swiper-pagination-bullet{background: #fff;margin: 0 5px;vertical-align: middle;transition: all linear 0.2s;}
main .tips-cont .swiper-pagination .swiper-pagination-bullet-active{width: 12px;height: 12px;}
main .tips-cont .swiper-button-next,.swiper-button-prev{background: none;display: flex;align-items: center}

main .step-reset{padding: 75px 0 25px;}
main .step-reset .qs{position: relative;bottom: 20px;right: -170px;display: inline-block;width: 21px;height: 21px;background: #007DD9;border-radius: 50%;color:#ffffff;font-weight: 400}
main .step-reset .qs-show{transition: opacity .25s linear;opacity:0;visibility:hidden;min-width: 520px;height:204px;background-color: #007DD9;color: #fff;top:47px;text-align: left;border-radius: 6px;padding: 40px 40px;font-size:13px;position: absolute;z-index: 1;left: -246px;}
main .step-reset .qs-show::before{content:'';position:absolute;height:20px;width:20px;border:10px solid transparent;border-top-color:#007DD9;top:-20px;left:248px;transform:rotate(180deg);}
main .step-reset .qs:hover{background: #F64F4F;cursor: pointer;}
main .step-reset .qs:hover .qs-show{visibility: visible;opacity: 1!important;}
main .step-reset .qs-show .qs-show-div2{padding-top: 20px;}
main .step-reset .qs-show .qs-show-div2 span{padding-top: 6px}
main .step-reset .qs-show .svg{padding-right: 20px;line-height: 55px}
main .step-reset .qs-show .svg:nth-child(2){padding-top: 30px}
main .step-reset .title{font-size: 36px;margin-bottom: 60px;line-height: 1.2em;font-weight: 200;}
main .step-reset .cell{display: inline-block;width: 33.3333%;font-size: 16px;vertical-align: top;padding: 0 6%;color: #666666;position: relative}
main .step-reset .cell:not(:last-child)::after{content: '';width: 22px;height: 15px;background-color: #3D3D3D;position: absolute;right: 24px;top: 20%;transform: translate(200%,50%);opacity: 0.2}
main .step-reset .cell:not(:last-child)::before{content: '';width: 0;height: 0;border-style: solid;border-width: 15px 0 15px 20px;opacity: 0.2;border-color: transparent transparent transparent #3D3D3D;position: absolute;right: 20px;top: 20%;transform: translate(300%,0);}
main .step-reset .cell p{margin-top: 25px;}

main .all-users{padding: 100px 0;}
main .all-users .title{font-size: 36px;line-height: 1.2em;margin: 0 auto 20px;max-width: 1000px;font-weight: 200;}
main .all-users .tip{padding: 0 0 5px;color:#3D3D3D;line-height: 20px;}
main .all-users .txt-blue{color: #007DD9}
main .all-users .sub{font-size: 22px;font-weight: 700;margin-bottom: 30px;}
main .all-users .cell .tit{font-weight: bold;}
main .all-users .cell:first-child{margin-top: 80px}
main .all-users .cell{line-height: 22px;margin-top: 180px;position: relative}
main .all-users .cell p:not(:last-child){margin-bottom: 30px}
main .all-users .cell:not(:first-child):before{background: url("images/border.png") no-repeat;content: '';width: 100%;height: 50px;position: absolute;top: -80px;}
main .all-users img{width: 370px}
main .all-users .lft{text-align: center;padding-right: 70px}
main .all-users .txt{width: 505px;margin: auto 0;}
main .all-users .cell .top{padding-top:60px;}

main .all-pc{padding: 100px 0;}
main .all-pc .title{font-size: 36px;line-height: 1.2em;;font-weight: 200;max-width: 900px;margin: 0 auto 50px;}
main .all-pc .cell{width: 33.3333%;display: inline-block;font-size: 16px;vertical-align: top;padding: 0 6%;}
main .all-pc .cell .ico{min-height: 87px;}
main .all-pc .sub{font-size: 22px;font-weight: 700;margin: 20px 0;}
main .all-pc p{color: #707070;margin-bottom: 10px;line-height: 22px}
main .all-pc .more-btn{margin-top: 50px;padding: 10px 40px;}

main .best-form{padding: 100px 0;}
main .best-form .title{font-size: 36px;line-height: 1.2em;;font-weight: 200;max-width: 900px;margin: 0 auto 50px;}
main .best-form .cell{box-shadow: 3px 5px 15px 0 rgba(0,0,0,0.15);border-radius: 4px;width: 280px;height: 100%;position: relative}
main .best-form .cell .tip{position: absolute;top: 0;right: 15px;}
main .best-form .cell .tip .txt{transform: rotate(90deg);color: #ffffff;top: 17px;right:0;position: absolute;font-size: 15px;font-weight: 700;line-height: 20px}
main .best-form .cell .tip svg{position: absolute;right: 0}
main .best-form .cell .labels { position: absolute; top: 9px; right: -9px; background-color: #F64F4F; color: #fff; font-size: 14px; width: 80px; line-height: 32px; text-align: center; transform: rotate(45deg);font-weight: 700;}
main .best-form .cell .labels .tail { position: absolute; top: 0; border-top: 32px solid transparent }
main .best-form .cell .labels .tail:before { content: ""; position: absolute; border-top: 10px solid #B13939; border-left: 10px solid transparent; border-right: 10px solid transparent; }
main .best-form .cell .labels .tail-start { left: -31px; border-right: 32px solid #F64F4F }
main .best-form .cell .labels .tail-end { right: -39px; border-left: 40px solid #F64F4F }
main .best-form .cell .labels .tail-end:before { right: 0; }
main .best-form .cell:not(:first-child){margin-left: 25px}
main .best-form .cell .sub{font-size: 22px;line-height: 26px;font-weight: 600}
main .best-form .cell .top{height: 156px;background: #F1F9FF;border-radius: 4px 4px 50% 50%;text-align: center}
main .best-form .cell .top:after{border-bottom: 10px solid red;}
main .best-form .row .cell:nth-child(2) .top{background: #007DD9;color: #FFFFFF}
main .best-form ul{padding: 30px;text-align: center}
main .best-form li{text-align: left;max-width: 380px;margin: 0 auto 10px;position: relative;padding-left: 21px;font-size: 14px;color: #666666;letter-spacing: 0;line-height: 20px;}
main .best-form li:after{background: url(images/ok.svg) no-repeat;content: '';width: 16px;height: 13px;position: absolute;left: 0;top: 5px;}
main .best-form .price {font-size: 32px;font-weight: 700;margin-bottom: 10px;line-height: 32px;padding: 20px 0}
main .best-form .red-btn,main .best-form .blue-btn-border{width: 124px}
main .best-form .row{margin-left: 25px;}
main .best-form .row-1, .row{height: 100%}

main .review-cont{padding: 100px 0 166px;background:url("images/banner-bg-2.jpg");}
main .review-cont .title{font-size: 36px;line-height: 1.2em;;font-weight: 200;margin: 0 auto 25px;color: #3D3D3D}
main .review-cont .tip{max-width: 800px;margin: 0 auto;opacity: 0.9;line-height: 22px;margin-bottom: 75px}
main .review-cont .more-btn{margin-top: 50px;padding: 10px 40px;font-weight: 700;position: absolute;bottom: -100px}

main .review-cont .cell {
    min-width: 560px;
    height: 236px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 8px 30px #ddd;
    display: inline-block;
    font-size: 16px;
    vertical-align: top;
    background: #fff;
    padding: 30px 3%;
    transition: all ease .2s;
    min-height: 230px;
    padding: 50px;
    position: relative;
    z-index: 1;
}
main .review-cont .cell:nth-child(1){
    transform: scale(0.6);
    left: 16%;
}
main .review-cont .cell:nth-child(3){
    transform: scale(0.6);
    right: 16%;
    z-index: 0;
}

main .review-cont .cell .name .sub{
    color: #3D3D3D;
    letter-spacing: 0;
    line-height: 26px;
    font-weight: 700;
}
main .review-cont .cell .star{
    padding:10px 0 30px;
}
main .review-cont .cell .userimg{
    position: absolute;
    width: 80px;height: 80px;
    top: -40px;
    left: 43%;
}

main .why-choose{padding:0 0 100px 0;}
main .why-choose .title{font-size: 22px;line-height: 26px;font-weight: 200;margin: 0 auto 25px;color: #3D3D3D;font-weight: 700}
main .why-choose .tip{opacity: 0.9;color: #3D3D3D;line-height: 22px;max-width: 800px;margin: 0 auto 50px}
main .why-choose .cell{width: 22%;display: inline-block;font-size: 16px;vertical-align: top;}
main .why-choose .pro{background: #F64F4F;border-radius: 2px;color: #ffffff;font-size: 18px;line-height: 20px;text-align: center;padding: 1px 9px;font-weight: 500;margin-left: 10px}
main .why-choose .sub{margin: 20px 0 10px;font-weight: 700;}
main .why-choose p{color: #707070;}

#ad-banner{position: fixed;bottom: 0;right: 0;width: 600px;height: 400px;z-index: 1;background: url("images/ad-banner.jpg");box-shadow: 0 5px 15px 0 rgba(0,0,0,1);padding: 40px;color: #ffffff;animation:fadeInUp 1s .2s ease both;}
#ad-banner .forgot{width: 200px;height: 54px;background: #ffffff;border-radius: 4px;line-height: 54px;font-size: 42px;text-align: center;color: #F64F4F;font-weight: 600;margin-bottom: 10px}
#ad-banner .txt{font-size: 32px;line-height: 40px;font-weight: 600}
#ad-banner .txt2{font-size: 22px;line-height: 30px;text-shadow: 0 2px 4px rgba(0,0,0,0.10);margin-top: 10px}
#ad-banner .price{font-size: 32px;font-weight: 600;margin-top: 30px}
#ad-banner .only{font-size: 18px;}
#ad-banner .button{margin: 50px 0 20px;}
#ad-banner .button2 a{text-decoration:underline;}
#ad-banner .close-btn{position: absolute;top: 30px;transform:translateY(-50%);right: 5px;font-size: 35px;color: #FFF;width: 40px;height: 40px;line-height: 35px;text-align: center;background: #000000;border-radius: 50%;}
@keyframes fadeInUp{
    0%{opacity:0;
        -webkit-transform:translateY(20px)}
    100%{opacity:1;
        -webkit-transform:translateY(0)}
}

@media (max-width: 1500px){
    main .top-banner .pic-group{display: none;}
    main .top-banner .pc-pic{display: block;}
    main .lg-column{flex-direction: column;}
    main .lg-width{width: 100% !important;}
    main .top-banner .pwd,main .top-banner .box{display: none}
    main .top-banner .tip{margin: 20px 0 60px}
    main .top-banner .lft{text-align: center;margin: 0 auto}
    main .top-banner .tip{margin: 20px auto 60px}
    main .top-banner .switch-group{justify-content: center}

}
@media (max-width: 1320px) {
    /*main .best-form .cell .labels .tail-start,main .best-form .cell .labels .tail-end{display: none}*/
    main .best-form .cell{width: 40% !important;}
    main .best-form .row{margin-left: 0;margin-top: 30px;height: 730px;}
    main .best-form .row-1{height: 550px;}
    main .md-column{flex-direction: column;}
}
@media (max-width: 1200px){
    main .best-form .pc{display: none;}
    main .best-form .mb{display: block;}
    main .review-cont .cell:not(:nth-child(2)){display: none}
    main .review-cont .cell:nth-child(2){width: 50%;margin: auto}
}
@media (max-width: 1450px){
    main .step-reset .qs{position: unset}
    main .step-reset .qs-show{left: -42px;top: 188px;}
    main .step-reset .qs-show::before{display: none}
}
@media (max-width: 960px){
    main .top-banner h1{font-size: calc(24px + 2vw);}
    main .step-reset .title,main .all-users .title,main .two-options .title,main .all-pc .title,main .best-form .title,main .review-cont .title,main .why-choose .title{font-size: calc(18px + 1.8vw);}
    main .all-users .cell{width: 100%;}
    main .all-users .cell.lft{margin-bottom: 30px;}
    main .tips-cont p{width: 80%}
    #ad-banner,main .best-form .blue-btn-border{display: none!important;}
}

@media (max-width: 769px){
    main .tips-cont .logo{width: 100%;text-align: center;margin-bottom: 20px;}
    main .top-banner .tip,main .all-users .sub,main .two-options .sub,main .all-pc .sub{font-size: calc(16px + 0.5vw);}
    main .step-reset .cell,main .two-options .cell,main .all-pc .cell,main .review-cont .cell,main .why-choose .cell{width: 100%;}
    main .step-reset .cell:not(:first-child),main .all-pc .cell:not(:first-child),main .review-cont .cell:not(:first-child),main .why-choose .cell:not(:first-child),footer .cont .cell:not(:first-child),main .all-users .txt,main .all-users .lft:not(:first-child){margin-top: 30px;}
    main .two-options .cell.lft{margin-bottom: 40px;}
    main .top-banner .download-btn,main .step-reset .cell::before,main .step-reset .cell::after,main .best-form .blue-btn-border{display: none;}
    main .sm-column{flex-direction: column;}
    main .sm-width{width: 100% !important;}
    main .sm-width-txt{width: 80% !important;margin: auto}
    main .all-users .lft{padding-right: 0}

    main .best-form .cell:not(:first-child){margin-left: 0;margin: 30px auto 0;}
    main .step-reset .steps .c{margin-top: 0}
    main .all-users .cell .top{padding-top: 0}
    main .best-form .cell{width: 80% !important;margin: 0 auto}
    main .step-reset .qs-show{left: 0px;min-width: 0;}
    main .all-users .cell{margin-top: 80px;}
    main .review-cont .cell:nth-child(2){min-width: 0;height: 100%}
    main .all-users .cell:not(:first-child):before{display: none}
    main .step-reset{padding: 75px 0 75px}
    main .best-form .row-1,main .best-form .row{height: 0%}
    main .all-users .txt{margin:30px auto 0}
}
@media (max-width: 360px){
    main .all-users .cell.lft svg{max-width: 280px;}
    main .best-form .cell{width: 100%!important;}
    main .best-form .cell .labels{display: none}
    main .step-reset .qs-show{height: 260px}
}