body{
    padding-top: 1.1rem;
}
main {
    padding-top: 1.1rem;
}
header{
    position: fixed;
    top: 0;
}

.swiper-container{
    width: 100%;

    position: relative;

}


.swiper-slide .play{
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -0.5rem;
    margin-top: -0.3rem;
    width: 1rem;
    height:1rem;
    cursor: pointer;
    z-index: 100;
}
.swiper-slide .play img{
    width: 1rem;
    height:1rem;
    display: block;
}

.video-wapper1{
    height: 100%;
}

video{
    display: block;
    object-fit: fill;
    /* width: 100%;
    height: 100%; */
}

.swiper-container-bottom{
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 1.8rem;
    background-color: rgba(0, 0, 0, 0.8);
}
.swiper-container-bottom ul {
    overflow: hidden;
    width: 100%;
    padding: 0 1.26rem;
    padding-top: .33rem;
    box-sizing: border-box;
}
.swiper-container-bottom li{
    float: left;
    width: 25%;
    box-sizing: border-box;
    color: #cfcfcf;
    font-size: .14rem;
    position: relative;
    padding-left: .23rem;
}

.swiper-container-bottom li::after{
    position: absolute;
    width: .03rem;
    height: .4rem;
    left: 0;
    top: 0;
    background-color: #ffffff;
    content: '';
}
.swiper-container-bottom li .title{
    font-size: .2rem;
    color: #ffffff;
    margin-bottom: .28rem;
}

.swiper-container-bottom li .content{
    width: 3rem;

}

.module-wapper{
    padding-bottom: 1rem;
    width: 100%;
}

.module-container{
    width: 12.5rem;
    margin: 0 auto;
}
.module-container .module-container-title{
    padding-top: .75rem;
    height: 1rem;
    font-size:.42rem;
    color: #707070;
    text-align: center;
    margin-bottom: .3rem;
    position: relative;
}
/* .module-container .module-container-title::after{
    content:'';
    position: absolute;
    width: .7rem;
    height: .04rem;
    background-color: #df0024;
    left: 50%;
    margin-left: -0.35rem;
    top: 1.5rem;
} */
.module-content{
    overflow: hidden;

}
.module-content .left{
    float: left;
    width: 4.5rem;

}
.module-content ul{
    width: 4.5rem;
    overflow: hidden;
}
.module-content li{
    background-color: #333;
    cursor: pointer;
    color: #ccc;
    padding: .35rem 0;
    float: left;
    width: 1.5rem;
    height: 1.5rem;
    text-align: center;
    border: .01rem solid #e4e4e4;
    border-left-color:transparent ;
    border-top-color:transparent ;
    box-sizing: border-box;
}
.module-content li:hover{
    background-color: #df0024;
    color: #fff;
}
.module-content .active{
    background-color: #df0024;
    color: #fff;
}
.module-content li img{
    display: block;
    margin: 0 auto;
    width: .5rem;
    margin-bottom: .1rem;
}
#right{
    float: left;
    width: 7.9rem;
    height: 6rem;
    background: #fff;
    box-sizing: border-box;
    padding: .1rem .4rem;
    /* text-align: left; */
}
.module-content .content-chunk .title{
    text-align: left;
    padding-left: .1rem;
    font-size: .2rem;
    margin: .25rem 0 .1rem;
    border-left: .03rem solid #df0024;
}
.module-content .content-chunk .content{
    text-align: left;
    font-size: .16rem;
    line-height: .26rem;
    color: #666;
}
.module-content .content-chunk img{
    width: .18rem;
    height: .18rem;
    vertical-align: middle;
    margin-right: .05rem;
}
.module-content .content-chunk .content{
    overflow: hidden;
}
.module-content .content-chunk .module{
    width: 2rem;
    height: .5rem;
    box-sizing: border-box;
    border: .01rem solid #e4e4e4;
    line-height: .3rem;
    padding: .1rem;
    text-align: left;
    color: #666;
    font-size: .18rem;
    margin-right: .2rem;
    margin-top: .1rem;
    float: left;
}



 .detail .module-bottom ,.module-wapper .module-bottom{
    display: block;
    width: 2.47rem;
    height: .4rem;
    background-color: #df0024;
    border: .01rem solid #df0024;
    text-align: center;
    margin: 0 auto;
    line-height: .4rem;
    /* font-family: MicrosoftYaHei; */
    font-size: .16rem;
    margin-top: .27rem;
    cursor: pointer;
    color: #fff;
    transition: all 0.3s linear;
}
.detail .module-bottom{
    margin-top: .5rem;
}
.detail .module-bottom:hover ,.module-wapper .module-bottom:hover{
    background-color: #ffeded;
    color: #df0024;
    transition: all 0.3s linear;
    border: .01rem solid #df0024;
}
.middle-introduction{
    padding-top: 1.63rem;
    background-color: #fff;
    font-size: .18rem;
    text-align: center;
}
.middle-introduction .title{
    font-size: .42rem;
    color: #707070;
    margin-bottom: .32rem;
}
.middle-introduction .system{
   height: .31rem;
    margin: 0 auto;
    width: 13.5rem;
    margin-top: .92rem;
    margin-bottom: .4rem;
}

.middle-introduction .system li{
    float: left;
    width: .5rem;
    margin:0 2rem ;
    text-align: center;
    font-size: .24rem;
    color: #df0024;
    position: relative;
    cursor: pointer;
}
.middle-introduction .system .first::after{
    position: absolute;
    content: '';
    width: .36rem;
    height: .36rem;
    border-radius: 50%;
    bottom: -0.6rem;
    left: 50%;
    margin-left: -0.18rem;
    background-color: #e7e7e7;
}
.middle-introduction .system li::after{
    position: absolute;
    content: '';
    width: .36rem;
    height: .36rem;
    border-radius: 50%;
    bottom: -0.6rem;
    left: 50%;
    margin-left: -0.18rem;
}
.middle-introduction .system li:hover::after{
    background-color: #e7e7e7;
}

.middle-introduction .bottom{
    /* padding-bottom: .5rem; */
    height: 4.75rem;
	background-color: #e7e7e7;
}
.middle-introduction .bottom ul{
    overflow: hidden;
    width: 14.4rem;
    margin: 0 auto;

}
.middle-introduction .bottom li{
    float: left;
    width: 2.39rem;
    margin: 0 .6rem;
    margin-top: .85rem;
    text-align: left;
    line-height: .24rem;
}
.middle-introduction .bottom .title{
    font-size: .2rem;
    margin-bottom: .24rem;
	color: #2d2e32;
}
.middle-introduction .bottom{
    font-size: .14rem;

	color: #616161;
}

/* 解决方案  */

.programme-wapper{
    background-image: url('https://shijiaoke.oss-cn-beijing.aliyuncs.com/Yunan/module_service_solution20200611.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
    height: 8.1rem;
}

.programme-container{
    height: 100%;
    background:rgba(223, 0, 36, 0.7);
    color: #fff;
    font-size: .56rem;

	font-stretch: normal;
    padding-top: 1.77rem;
    padding-left: 2.3rem;
    box-sizing: border-box;
	letter-spacing: 0rem;
	color: #ffffff;
}

.programme-container .detail{
    font-size: .2rem;
    margin-top: 1.06rem;
	color: #ffffff;
}
.detail-title .logo-wapper{
    width: 3rem;
    margin: 0 auto;
    display: block;
}
.programme-container .detail .detail-content{
    color: #333;
}
.solution-btn{
    display: block;
    width: 2.7rem;
	height: .47rem;
    border: solid .01rem #ffffff;
    color: #fff;
    font-size: .2rem;
    text-align: center;
    line-height: .47rem;
    color: #ffffff;
    margin-top: .53rem;
}

.programme-introduction{
    background-color: #fff;
    text-align: center;
    font-size: .18rem;
    width: 11.6rem;
    margin: 0 auto;
    color: #707070;
    overflow: hidden;
    padding-bottom: .96rem;
}
.programme-introduction .title{
    font-size: .42rem;
	/* font-weight: bold; */
    color: #707070;
    margin-top: 1.63rem;
    margin-bottom: .3rem;

}
.programme-introduction .detail{
    text-align: left;
    margin-top: .85rem;
}
.programme-introduction .detail-image{
    float: left;
}
.programme-introduction .detail span{
    font-size: .16rem;
    color: #707070;
    float: left;
    width: 5.48rem;
    margin-left: 1rem;
    line-height: .32rem;

}

.advantage-show ul{
    overflow: hidden;
}
.advantage-show ul li{
    width: 50%;
    float: left;
    height: 4.05rem;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;

}
.advantage-image-wapper{
    background-color: rgba(0,0,0,0.7);
    width: 100%;
    height: 100%;
    padding-top: .8rem;
    box-sizing: border-box;
	font-size: .32rem;
    padding-left: .56rem;
	color: #ffffff;
}

.advantage-show .right{
    text-align: right;
    padding-right: .56rem;
}

.core{

    background-color: #ffffff;
    text-align: center;
    padding-top: 1.63rem;

	font-size: .18rem;

	color: #707070;
}
.core .title{
    /* font-family: MicrosoftYaHei; */
	font-size: .42rem;
	/* font-weight: bold; */
    margin-bottom: .32rem;
	color: #707070;
}

.core ul{
    overflow: hidden;
    width: 11.4rem;
    margin: 0 auto;
    margin-top: .7rem;
}
.core ul li{
    float: left;
    width: 3.5rem;
    margin: 0 .15rem;
    border: .01rem solid #707070;
    box-sizing: border-box;
    padding: .5rem;
    text-align: left;
    font-size: .16rem;
    line-height: .28rem;
    height: 5rem;
    box-sizing: border-box;
}
.core ul li img{
    display: block;
    width: 2.57rem;
    margin: 0 auto;
}
.core ul li .title{
    font-size: .3rem;
    color: #000;
    text-align: center;
}