@font-face {
    font-family: 'TGBF';
    src: url('../css/TG-TYPE-Bold.otf');
    font-weight: normal;
}

.banner{
    width: 100vw;
    height: 10.31rem;
    background-image: url("//klm10.kuleiman.com/record/klm/zhy/2/bannerBg.png");
    position: relative;
    overflow: hidden;
}
.bannerTitle{
    font-size: 0.5rem;
    font-family: PingFangSC, PingFang SC;
    font-weight: 600;
    color: #FFFFFF;
    line-height: 0.67rem;
    text-shadow: 0px 0px 0px rgba(33,34,38,0.73);
    -webkit-background-clip: text;
    /*-webkit-text-fill-color: transparent;*/
    text-align: center;
}
.bannerTitle_1{
    padding-top: 1.56rem;
}
.bannerDesc{
    width: 4.92rem;
    font-size: 0.2rem;
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    color: #FFFFFF;
    line-height: 0.33rem;
    text-shadow: 0px 0px 0px rgba(33,34,38,0.64);
    -webkit-background-clip: text;
    /*-webkit-text-fill-color: transparent;*/
    text-align: center;
    margin: 0.2rem auto 0;
}

.banner .btn {
    width: 4.1rem;
    margin:0.42rem auto 0;
}
.banner .btn1{
    width: 1.91rem;
    height: 0.68rem;
    background: linear-gradient(225deg, #32C5FF 0%, #B620E0 51%, #F7B500 100%);
    border-radius: 0.2rem;
    line-height: 0.68rem;
    font-size: 0.2rem;
    font-weight: 500;
    color: #FFFFFF;
}

.banner .btn .icon1 {
    width: 0.32rem;
    height: 0.32rem;
    background: url(//klm10.kuleiman.com/record/klm/zhy/2/playVideo.svg) center center / 100% 100% no-repeat;
    margin-right: 0.14rem;
}
.banner .btn .icon2 {
    width: 0.32rem;
    height: 0.32rem;
    background: url(//klm10.kuleiman.com/record/klm/zhy/2/programme.svg) center center / 100% 100% no-repeat;
    margin-right: 0.14rem;
}
.banner .btn2{
    width: 1.91rem;
    height: 0.68rem;
    border-radius: 0.2rem;
    border: 0.03rem solid #FFFFFF;
    line-height: 0.68rem;
    font-size: 0.2rem;
    font-family: SourceHanSansCN, SourceHanSansCN;
    font-weight: 500;
    color: #fff;
}


.bannerImg{
    width: 6.25rem;
    height: 4.33rem;
    position: absolute;
    top: 4.7rem;
    left: 0;
}
.bannerImg1{
    width: 1.14rem;
    height: 0.6rem;
    position: absolute;
    top: 1.25rem;
    right: 0.33rem;
}
.bannerImg2{
    width: 1.14rem;
    height: 0.6rem;
    position: absolute;
    top: 2.6rem;
    right: 2.43rem;
}

.bannerImg3{
    width: 1.14rem;
    height: 0.6rem;
    position: absolute;
    top: 1.64rem;
    left: 0.44rem;
}
.bannerTip{
    width: 5.2rem;
    display: flex;
    position: absolute;
    bottom: 0.58rem;
    left: 50%;
    transform: translate(-50%,0);
}
.bannerTip div{
    width: 1.3rem;
    height: 0.55rem;
}




/*model1*/
.model1{
    width: 100vw;
    height: 6.58rem;
    overflow: hidden;
}


.commonTitle{
    font-size: 0.35rem;
    font-weight: 600;
    color: #17205F;
    text-align: center;
    position: relative;
    padding-top: 0.53rem;
}


.commonTips{
    width: 0.47rem;
    display: inline-block;
    position: absolute;
    top: 1.05rem;
    left: 50%;
    transform: translate(-50%,0);
}
.commonTips span{
    width: 0.19rem;
    height: 0.06rem;
    background: #00D8FF;
    border-radius: 0.03rem;
    display: inline-block;
    position: absolute;
    top: 0;
}
.commonTips span::before{
    content: '';
    position: absolute;
    width: 0.19rem;
    height: 0.06rem;
    background: #3449DD;
    border-radius: 0.03rem;
    top: 0;
    left: -0.21rem;
}.commonTips span::after{
     content: '';
     position: absolute;
     width: 0.06rem;
     height: 0.06rem;
     background: #FFE700;
     border-radius: 50%;
     top: 0;
     right: -0.08rem;
 }
.commonDesc{
    font-size: 0.2rem;
    font-weight: 400;
    color: #17205F;
    text-align: center;
    margin: 0.23rem auto 0;
    width: 5.15rem;

}




.videoBox{
    width: 5.67rem;
    height: 3.19rem;
    margin: 0.39rem auto 0;
    box-shadow: 0.03rem 0.04rem 0.08rem 0rem rgba(0,0,0,0.04);
    border-radius: 0.07rem;
    border: 0.01rem solid;
    border-image: linear-gradient(179deg, rgba(149, 241, 255, 0.12), rgba(99, 134, 255, 0.33)) 0.01 0.01;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    position: relative;
}

.videoBox video{
    /*width: 100%;*/
    height: 100%;
    border-radius: 0.2144rem;
    border: 0.1009rem solid #FFFFFF;
}



/*model2*/
.model2{
    width: 100vw;
    height: 10.83rem;
    background-image: url("//klm10.kuleiman.com/record/klm/zhy/2/model2Bg.png");
    overflow: hidden;
}

.model2NavBox{
    display: flex;
    width: 5.71rem;
    margin: 0.37rem auto 0;
    justify-content: space-between;
}
.model2NavList{
    width: 1.33rem;
    height: 1.5rem;
    background: #FFFFFF;
    box-shadow: 0rem 0rem 0.13rem 0rem rgba(0,0,0,0.05);
    border-radius: 0.17rem;
    /*display: flex;*/
}

.model2NavIcon{
    width: 0.42rem;
    height: 0.42rem;
    margin-top: 0.25rem;
    margin-left: 0.46rem;
}

.model2NavTitle{
    width: 0.73rem;
    font-size: 0.18rem;
    font-weight: 600;
    color: #17205F;
    line-height: 0.23rem;
    text-align: center;
    margin-left: 0.3rem;
    margin-top: 0.16rem;
}

.active2{
    background: #117DFF;
}
.active2 .model2NavTitle{
    color: #FFFFFF;

}
.model2Content{
    width: 5.3rem;
    height: 3.08rem;
    margin: 0.48rem auto 0;
    position: relative;
}
.model2Content div{
    position: absolute;
}

.model3Desc{
    width: 5.2rem;
    height: 2rem;
    margin: 0.4rem auto 0;
}

.model3DescTitle{
    width: 100%;
    /*height: 0.56rem;*/
    border-bottom: 1px solid #C8CEF4;
    display: flex;
}
.model3DescTitle div:first-child{
    font-size: 0.4rem;
    padding-bottom: 0.18rem;
    font-weight: bold;
    color: #117DFF;
    position: relative;
}
.model3DescTitle div:first-child:after{
    content: '';
    position: absolute;
    width: 0.4rem;
    height: 0.03rem;
    background: #5085FB;
    bottom: -0.025rem;
    left: 0;
}
.model3DescTitle div:nth-child(2){
    font-size: 0.3rem;
    font-weight: 600;
    color: #17205F;
    margin-left: 0.12rem;
    padding-top: 0.06rem;

    margin-right: 0.34rem;
}
.model3DescTitle div:last-child{
    font-size: 0.22rem;
    font-weight: 400;
    color: #17205F;
    padding-top: 0.15rem;
}

.model3DescInfo{
    font-size: 0.22rem;
    font-weight: 400;
    color: #17205F;
    line-height: 0.40rem;
    margin-top: 0.24rem;
}




/*model3*/
.model3{
    width: 100vw;
    height: 8.05rem;
    overflow: hidden;
}

.model3Box{
    margin-top: 0.55rem;
}

.model3NavList{
    width: 1.75rem;
    height: 0.54rem;
    border-radius: 0.3rem;
    border: 0.01rem solid #343D58;
    text-align: center;
    line-height: 0.54rem;
    font-size: 0.22rem;
    font-weight: 400;
    color: #091027;
    margin-right: 0.17rem;
}


.swiper-container-top {
    width: 100%;
    padding-left: 0.27rem;
    height: 0.54rem;
    overflow: hidden;
}

.active3{
    background: linear-gradient(14deg, #64F0E9 0%, #1C30C0 100%, #1C30C0 100%);
    border-radius: 0.3rem;
    color: #fff;
    border: none;
}
.model3Con{
    width: 100%;
    height: 4.83rem;
    overflow: hidden;
    margin: 0.25rem auto 0;
}
.modelInfoList{
    width: 100%;
    height: 4.83rem;
}
.model3Info{
    width: 5.14rem;
    margin-left: 0.65rem;
    padding-top: 0.92rem;
}
.model3Info div:first-child{
    font-size: 0.5rem;
    font-weight: 500;
    color: #FFFFFF;
}
.model3Info div:nth-child(2){
    font-size: 0.3rem;
    font-weight: 500;
    color: #FFFFFF;
    margin-top: 0.11rem;
}
.model3Info div:last-child{
    font-size: 0.22rem;
    font-weight: 400;
    color: #FFFFFF;
    margin-top: 0.28rem;
    line-height: 0.29rem;
}



/*model4*/
.model4{
    width: 100vw;
    overflow: hidden;
    height: 9.7rem;

}
.model4Box{
    margin: 0.55rem auto 0;
}
.modelList{
    width: 2.87rem;
    height: 3.38rem;
    background-image: url("//klm10.kuleiman.com/record/klm/zhy/2/model4_1.png");
}
.modelList div:first-child{
    font-size: 0.28rem;
    /*font-family: PingFangSC, PingFang SC;*/
    font-weight: 600;
    color: #005CFF;
    text-align: center;
    padding-top: 0.6rem;
}

.modelList div:nth-child(2){
    font-size: 0.25rem;
    /*font-family: PingFangSC, PingFang SC;*/
    font-weight: 600;
    color: #17205F;
    text-align: center;
}
.modelList div:last-child{
    width: 2.08rem;
    font-size: 0.22rem;
    font-weight: 400;
    color: #17205F;
    line-height: 0.29rem;
    margin: 0.33rem auto 0;
    text-align: center;
}
.modelListBox{
    display: flex;
    justify-content: space-around;
    margin-bottom: 0.17rem;
}

/*model5*/
.model6{
    width: 100vw;
    overflow: hidden;
    height: 7.7rem;
}
.model6Box{
    margin-top: 0.55rem;
}
.model6NavList{
    width: 1.86rem;
    height: 4.26rem;
    position: relative;
    margin-right: 0.15rem;

}
.model6NavList div{
    font-size: 0.25rem;
    font-family: PingFangSC, PingFang SC;
    font-weight: 500;
    color: #FFFFFF;
    text-align: center;
    position: absolute;
    width: 1rem;
    left: 50%;
    transform: translate(-50%,0);
    bottom: 0.55rem;
}

.swiper-container1 {
    width: 100%;
    padding-left: 0.27rem;
    height: 4.26rem;
    overflow: hidden;
}

.model6NavList div:after{
    content: '';
    position: absolute;
    width: 0.16rem;
    height: 0.1rem;
    background: url("//klm10.kuleiman.com/record/klm/zhy/2/modelTip.png") no-repeat;
    background-size: 100% 100%;
    top: 0;
    right: -0.1rem;
}
.model6Pagination{
    display: flex;
    justify-content: center;
    margin-top: 0.42rem;

}

.swiper-pagination-progressbar {
    width: 1.25rem;
    height: 0.08rem;
    border-radius: 0.04rem;
    background: #E0EBFF;
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{
    background: #005CFF;
    border-radius: 0.04rem;
}

/*model7*/

.model7{
    width: 100vw;
    overflow: hidden;
    height: 11rem;
}
.model7Box{
    margin-top: 0.55rem;
    position: relative;
}


.model7InfoList{
    width: 2.53rem;
    height: 1.84rem;
    background: #F4F8FF;
    border-radius: 0.09rem;
    padding: 0.29rem 0.22rem;
    position: absolute;
}
.model7InfoList div:first-child{
    font-size: 0.28rem;
    font-weight: 600;
    color: #17205F;
    text-align: center;
}
.model7InfoList div:last-child{
    font-size: 0.2rem;
    font-weight: 500;
    color: #17205F;
    text-align: center;
    line-height: 0.32rem;
}

.model7Order1{
    top: 0;
    left: 0.46rem;
}
.model7Order2{
    top: 0;
    right: 0.46rem;
}
.model7Order3{
    top: 2.16rem;
    right: 0.46rem;
}
.model7Order4{
    top: 4.36rem;
    right: 0.46rem;
}
.model7Order5{
    width: 2.79rem;
    top: 6.59rem;
    right: 0.46rem;
    padding: 0.25rem 0.19rem;
}
.model7Order6{

    top: 6.59rem;
    left: 0.46rem;
}

.model7Icon{
    width: 3.68rem;
    height: 3.92rem;
    background-image: url("//klm10.kuleiman.com/record/klm/zhy/2/model7_1.png");
    position: absolute;
    top: 2.16rem;
    left: 0;
}
.pa div:first-child{
    width: 0.13rem;
    height: 0.13rem;
    border-radius: 50%;
}
.pa div:last-child{
    width: 1px;

    margin-left: 0.05rem;
    border: 1px #3449DD dashed;

}
.pa{
    position: absolute;z-index: 99;
}
.pa1{
    top: 1.83rem;
    left: 1.59rem;
}
.pa1 div:first-child{
    background: linear-gradient(221deg, #32E2F7 0%, #7602E3 100%);
}
.pa1 div:last-child{
     height: 0.85rem;

 }

.pa2{
    top: 1.63rem;
    left: 2.95rem;
    transform: rotate(35deg);
}
.pa2 div:first-child{
    background: linear-gradient(225deg, #00A8EB 0%, #20DAE0 100%);
}
.pa2 div:last-child{
     height: 1.5rem;
 }

.pa3{
    top: 3.23rem;
    left: 3.1rem;
    transform: rotate(90deg);
}
.pa3 div:first-child{
    background: linear-gradient(226deg, #1FE3A4 0%, #23A3E8 100%);
}
.pa3 div:last-child{
     height: 0.5rem;
 }
.pa4{
    top: 4.43rem;
    left: 3.1rem;
    transform: rotate(90deg);
}
.pa4 div:first-child{
    background: linear-gradient(317deg, #FF7442 0%, #E2B30B 100%);
}
.pa4 div:last-child{
     height: 0.5rem;
 }

.pa5{
    top: 5.1rem;
    left: 2.7rem;
    transform: rotate(145deg);
}
.pa5 div:first-child{
    background: linear-gradient(180deg, #FC7279 0%, #FFAF98 100%);
}
.pa5 div:last-child{
     height: 1.5rem;
 }
.pa6{
    top: 5.4rem;
    left: 1.59rem;

    transform: rotate(180deg);
}
.pa6 div:first-child{
    background: linear-gradient(312deg, #E1C51F 0%, #0AA6D0 100%);
}
.pa6 div:last-child{
    height: 1.1rem;
 }

/*model8*/

.model8{
    width: 100vw;
    overflow: hidden;
    height: 6.3rem;

}
.model8Box{
    /*width: 5rem;*/
    height: 3.45rem;
    margin: 0.55rem auto 0;
}

.model8List{
    width: 100%;
    height: 3.12rem;
    display: flex;
    justify-content: center;
    position: relative;
}
.model8Pagination{
    width: 100%;
    display: flex;
    justify-content: center;
}
.swiper-pagination-bullet{
    width: 0.5rem;
    height: 0.08rem;
    margin-right: 0.08rem;
    border-radius: 0.04rem;
}
.swiper-pagination-bullet-active {
    background: #005CFF !important;
}

.model8ArrowLeft{
    width: 1.15rem;
    height: 1.15rem;
    position: absolute;
    top: 0.98rem;
    left: 0.2rem;
}
.model8ArrowLeft img,.model8ArrowRight img{
    max-width: 100%;
    height: 100%;
}
.model8ArrowRight{
    width: 1.15rem;
    height: 1.15rem;
    position: absolute;
    top: 0.98rem;
    right: 0.2rem;
}


/*model9*/
.model9{
    width: 100vw;
    overflow: hidden;
    height: 6.5rem;
    background-image: url("//klm10.kuleiman.com/record/klm/zhy/2/model9Bg.png");
}
.model9Box{
    margin: 0.55rem auto 0;
    width: 5.92rem;
    height: 4.25rem;
}

/*model10*/
.model10{
    width: 100vw;
    height: 5.83rem;
    background-image: url("//klm10.kuleiman.com/record/klm/zhy/2/model10Bg.png");
    overflow: hidden;
}
.model10 .model10H{
    width: 100%;
    height: 0.3rem;
}
.model10Box{
    margin: 0.55rem auto 0;
    width: 5.92rem;
    height: 4.25rem;
}


.model10Box{
    width: 5rem;
    margin: 0.63rem auto 0;
}
.model10Box input{
    width: 5rem;
    height: 0.61rem;
    background: #FFFFFF;
    box-shadow: 0rem 0rem 0.06rem 0rem rgba(0,0,0,0.1);
    border-radius: 0.09rem;
    font-size: 0.23rem;
    font-family: SourceHanSansCN, SourceHanSansCN;
    font-weight: 400;
    color: #B0B0B0;
    padding-left: 0.2rem;
}
.model10Box .infoPhone{
    margin-top: 0.28rem;
}
.model10Box .infoBtn{
    width: 2.25rem;
    height: 0.67rem;
    background: linear-gradient(261deg, #53EEEE 0%, #14A3D5 100%);
    border-radius: 0.1rem;
    font-size: 0.26rem;
    font-family: SourceHanSansCN, SourceHanSansCN;
    font-weight: 400;
    color: #FFFFFF;
    text-align: center;
    line-height: 0.67rem;
    margin: 0.28rem auto 0 ;
}
.y_foot{
    padding-bottom: 1rem!important;
}

.playVideoIcon{
    width: 0.75rem;
    height: 0.75rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.playVideoIcon img{
    max-width: 100%;
    max-height: 100%;
}