.menu {
    width: 1200px;
    height: 60px;
    position: fixed;
    top: 0;
    z-index: 500;
    margin: 0 auto;
    left: 0;
    right: 0;
}

.menu .menu-logo {
    width: 180px;
    height: 45px;
    display: inline-block;
    margin-top: 20px;
    background: url(https://www.dahepiao.com/images/appdownload/logo.png) no-repeat;
    background-size: 180px 45px;
}

.menu .menu-info {
    width: 220px;
    height: 50px;
    float: right;
    margin-top: 20px;
    background: url(/images/appdownload/downphone.png) no-repeat;
    background-size: 100%
}

.w_1200 {
    width: 1100px;
    margin: 0 auto;
}

.simg1 {
    margin-top: 15%;
    width: 42%;
}

html, body {
    height: 100%
}

* {
    padding: 0;
    margin: 0;
    outline: none;
}

.swiper-container {
    width: 100%;
    height: 100%
}

.swiper-slide {
    width: 100%;
    height: 100%;
    background-size: 100%;
}

.swiper-slide1 {
    background: linear-gradient(to bottom right, #F4A524, #FD8723);
    position: relative;
}

.swiper-slide2 {
    background: #5ba3eb
}

.swiper-slide4 {
    background: #6ebe56
}

.swiper-slide3 {
    background: #de4f50
}

.swiper-slide5 {
    background: #4fc1de
}

.bg {
    position: absolute;
    z-index: -1;
}

.bglefttop {
    width: 200px;
    height: 300px;
    left: 0px;
    top: 70px;
    background: url('/images/appdownload/lefttop.png') no-repeat;
    background-size: 100% 100%;
}

.bgleftbottom {
    width: 200px;
    height: 200px;
    left: 13%;
    bottom: 5%;
    background: url('/images/appdownload/leftbottom.png') no-repeat;
    background-size: 100% 100%;
}

.bgrightbottom {
    width: 150px;
    height: 150px;
    right: 0px;
    bottom: 0px;
    background: url('/images/appdownload/rightbottom.png') no-repeat;
    background-size: 100% 100%;
}

.bgcenter {
    width: 200px;
    height: 150px;
    left: 50%;
    bottom: -30px;
    background: url('/images/appdownload/center.png') no-repeat;
    background-size: 100% 100%;
}

.bgrighttop {
    width: 100px;
    height: 300px;
    right: 0px;
    top: 50px;
    background: url('/images/appdownload/righttop.png') no-repeat;
    background-size: 100% 100%;
}


.centerRight {
    width: 50%;
    float: right;
    margin-top: 15%;
}

.centerRight .p {
    font-size: 30px;
    color: #fff;
}

.centerRtop {
    margin: 30px 0;
    font-size: 14px;
    color: #fff;
}

.centerRcenter h2 {
    font-weight: 500;
    margin-bottom: 20px;
    font-size: 38px;
    color: #fff;
}

.centerRcenter .text {
    margin-top: 22px;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 2px;
    color: #fff;
}

/* 右下二维码 */
.centerRfooter {
    width: 100%;
    margin-top: 60px;
    display: flex;
    justify-content: space-between;
}

.centerRfooter .erweima {
    margin-top: 5px;
}

.centerRfooter .erweima img {
    width: 170px;
    background: #fff;
    padding: 10px;
    border-radius: 5px;
}

.centerRfooter .erweima p {
    font-size: 15px;
    color: #fff;
    margin-top: 5px;
    text-align: center;
}

.centerRfooter .last {
    width: 55%;
}

.last > div {
    width: 100%;
}

.last > div > img {
    width: 100%;
}

.centerRfooter .last a {
    margin-top: 12px;
    display: block;
    cursor: pointer;
}

.AppStore, .Android {
    position: relative;
}

.box1, .box2 {
    width: 180px;
    height: 180px;
    background: #fff url(/images/appdownload/appDown.jpg) center no-repeat;
    position: absolute;
    top: -30%;
    right: -70%;
    display: none;
    background-size: 160px 160px;
    border-radius: 5px;
}

.box1::before, .box2::before {
    content: "";
    position: absolute;
    left: -15px;
    top: 40px;
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-right: 15px solid #fff
}

.AppStore:hover .box1, .Android:hover .box2 {
    display: block;
}

.swiper-container-vertical > .swiper-pagination-bullets {
    position: fixed;
}

.swiper-pagination-bullet {
    width: 6px;
    height: 6px;
    background: #fff;
    opacity: .4;
}

.swiper-pagination-bullet-active {
    opacity: 1;
}

.simgbox {
    width: 28%;
    display: inline-block;
    margin-top: 12%;
    margin-left: 3.2%;
    position: relative;
    margin-bottom: 3%;
}

.simg2 {
    width: 100%
}

.slide2Text {
    text-align: center;
    font-size: 26px;
    color: #fff;
    margin-top: 30px;
}

.simgbox span {
    display: block;
    text-align: center;
    color: #fff;
    font-size: 18px;
}

/* 第三屏 */
.slide3L {
    width: 55%;
    display: inline-block;
    margin-top: 20%;
    position: relative;
}

.slide3L h2 {
    font-size: 44px;
    margin-bottom: 20px;
    color: #fff;
    font-weight: 100;
}

.slide3L p {
    font-size: 18px;
    color: #fff;
    letter-spacing: 1px;
    line-height: 32px;
}

.simg3 {
    width: 170px;
    height: 170px;
    border-radius: 50%;
    display: inline-block;
    color: #fff;
    font-size: 30px;
    text-align: center;
    position: absolute;
}

.simg3 span {
    width: 80px;
    display: inline-block;
    margin-top: 45px
}

.simg31 {
    background: #f5a026;
    top: 260px;
    left: 10px;
}

.simg32 {
    background: #de4f50;
    top: 360px;
    left: 250px;
}

.simg33 {
    background: #4fc1de;
    top: 220px;
    left: 500px;
}

.simg3::after {
    content: "";
    position: absolute;
    width: 55px;
    height: 55px;
    border-radius: 50%
}

.simg31::after {
    background: rgb(245, 160, 38, .5);
    bottom: -10px;
    right: 0
}

.simg32::after {
    background: rgb(222, 79, 80, .5);
    bottom: 60px;
    right: -30px
}

.simg33::after {
    background: rgb(79, 193, 222, .5);
    bottom: 90px;
    left: -30px
}

.slide3R {
    width: 34%;
    margin-top: 12%;
    float: right
}

.slide4L {
    width: 32%;
    margin-top: 12%;
    position: relative;
    display: inline-block;
}

.slide4L img {
    width: 100%;
}

.slide4L .c {
    border-radius: 50%;
    text-align: center;
    color: #fff;
    font-size: 26px;
    position: relative;
}

.slide4L .c1 {
    width: 140px;
    height: 140px;
    line-height: 140px;
    position: absolute;
    background: rgba(249, 181, 0, .8);
    left: -30px;
    top: 100px
}

.slide4L .c2 {
    width: 100px;
    height: 100px;
    line-height: 100px;
    position: absolute;
    background: rgba(68, 188, 173, .8);
    right: -20px;
    top: 180px
}

.slide4L .c3 {
    width: 80px;
    height: 80px;
    line-height: 80px;
    position: absolute;
    background: rgba(252, 131, 106, .8);
    left: 0;
    bottom: 120px
}

.slide4L .c4 {
    width: 100px;
    height: 100px;
    line-height: 100px;
    position: absolute;
    background: rgba(29, 211, 46, .6);
    right: -30px;
    bottom: 160px
}

.slide4L .c::after {
    content: "";
    position: absolute;
    border-radius: 50%
}

.c1::after {
    width: 55px;
    height: 55px;
    background: rgb(245, 160, 38, .3);
    bottom: -10px;
    left: 0
}

.c2::after {
    width: 30px;
    height: 30px;
    background: rgb(245, 160, 38, .3);
    bottom: -10px;
    right: 0
}

.c4::after {
    width: 20px;
    height: 20px;
    background: rgb(79, 193, 222, .3);
    bottom: 10px;
    right: -10px
}

.slide4R {
    width: 58%;
    float: right;
    margin-top: 20%;
}

.slide4R h2 {
    font-size: 44px;
    color: #fff;
    font-weight: 100;
    margin-bottom: 15px;
}

.slide4R p {
    font-size: 18px;
    color: #fff;
}

.slide4R img {
    margin-top: 120px;
}


.simg51 {
    width: 95%
}

.simg52 {
    width: 100%
}

.simg53 {
    width: 95%
}

.slide5Text {
    text-align: center;
    font-size: 20px;
    color: #fff;
    margin: 10px auto
}

.stext5 {
    position: absolute;
}

.stext51 {
    left: -75px;
    top: 75px;
}

.stext52 {
    left: -16px;
    top: 30px;
}

.stext53 {
    right: -55px;
    bottom: 120px;
}