@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.widthCon{width: 7.5rem; margin: 0 auto;}
.widthCon2{width: 8.5rem; margin: 0 auto;}

/*banner样式*/ 
.bannerBg { background: url(/eportal/fileDir/ainao/resource/cms/2024/02/img_pc_site/khfwbanner.png) center no-repeat; background-size: cover; padding: 0.3rem 0; } 
.bannerBg .khalBanner { width: 4.4rem; } 
.bannerBg .khalBanner .modelTitle { font-size: 0.16rem; font-weight: 400; color: #070b2d; letter-spacing: 0.02rem; } 
.bannerBg .khalBanner .modelCon p { font-size: 0.1rem; font-weight: 400; line-height: 0.2rem; color: #9597a0; margin: 0.2rem 0; font-weight: 300; } 
.bannerBg .khalBanner .modelCon .modelBtn { } 
.bannerBg .khalBanner .modelCon .modelBtn a { display: inline-block; padding: 0.06rem 0.3rem; font-size: 0.1rem; border: 2px solid transparent; border-radius: 50px; background-clip: padding-box, border-box; background-origin: padding-box, border-box; background-image: linear-gradient(to right, #dae0f6,#dae0f6), linear-gradient(90deg, #c472aa,#3e89e4); } 
.bannerBg .khalBanner .modelCon .modelBtn a:hover { color: #fff; }

/*公用标签*/
.conTitle { padding-top: 0.4rem; } 
.conTitle p { font-size: 0.2rem; font-weight: 400; display: flex; justify-content: center; letter-spacing: 0.03rem; color: #070b2d; margin-bottom: 0.4rem; }

/*背景色*/
.bgColor { background: #f6f7fb; }


/*部署方式*/
.arrange { padding-bottom: 0.4rem; }
.bsfs ul li {padding: 0.8rem 0rem 0.4rem;margin-right: 0.1rem;border: 2px solid #f2f3f8;border-radius: 10px;box-sizing: border-box;width: 2.427rem;} 
.bsfs ul li .title { font-size: 0.14rem; color: #070b2d; text-align: center; margin-bottom: 0.13rem; font-weight: normal; } 
.bsfs ul li .titleImg { position: absolute; top: -0.2rem; left: 50%; margin-left: -0.5rem; width: 1rem; height: auto; } 
.bsfs ul li p { font-size: 0.1rem; line-height: 0.18rem; color: #9597a0; font-weight: 300; text-align: center; } 
.bsfs ul li p.btn { text-align: center; margin-top: 0.16rem; } 
.bsfs ul li p.btn span { display: inline-block; background: #dfeafc; box-sizing: border-box; border-radius: 10px; color: #0878e0; width: 0.6rem; height: 0.24rem; line-height: 0.24rem; } 
.bsfs ul li:nth-child(3n) { margin-right: 0px; }
.bsfs ul li:hover { background: url(/eportal/uiFramework/commonResource/image/2024022709272154190.jpg) right top no-repeat; background-size: cover; z-index: -1; } 
.bsfs ul li:hover * { color: #fff; }
.bsfs ul li:hover .bgHover { width: 2rem; height: 2rem; position: absolute; bottom: -1rem; left: -1rem; background: url(/eportal/uiFramework/commonResource/image/2024022709500749608.png) right top no-repeat; background-size: contain; z-index: -1; animation: rotation 7s linear infinite; }


/*生命周期*/
.steps { position: relative; margin-bottom: 30px; counter-reset: step; } 
.steps li { list-style-type: none; font-size: 0.1rem; text-align: center; width: 20%; position: relative; float: left; padding: 0 0.2rem; box-sizing: border-box; } 
.steps li:before { position: relative; display: block; content: counter(step); counter-increment: step; width: 0.2rem; height: 0.2rem; background-color: #fff; line-height: 0.2rem; border: 1px solid #88aeea; border-radius: 50%; font-size: 0.1rem; color: #5d90e0; text-align: center; font-weight: normal; margin: 0 auto 0.26rem auto; z-index: 10; } 
.steps li~li:after { content: ''; width: 100%; height: 1px; background-color: #88aeea; position: absolute; left: -50%; top: 15px; z-index: 1; } 
.steps li h2 { font-size: 0.12rem; margin-bottom: 0.12rem; color: #070b2d; font-weight: normal; } 
.steps li p { font-size: 0.1rem; color: #9597a0; line-height: 0.18rem; font-weight: 300; }


/*全面保障*/
.guarantee { padding-bottom: 0.6rem; }
.qmbz {} 
.qmbz ul {} 
.qmbz ul li { width: 2.42rem; margin-right: 0.1rem; background: #fff; border: 2px solid #eff0f6; padding: 0.2rem 0.4rem; box-sizing: border-box; text-align: center; border-radius: 10px; height: 2.2rem; } 
.qmbz ul li:nth-child(3n) { margin-right: 0px; } 
.qmbz ul li img:nth-child(2) { display: none; transition: margin-top 0.5s; } 
.qmbz ul li p { font-size: 0.1rem; color: #9597a0; line-height: 0.18rem; font-weight: 300; } 
.qmbz ul li p.title { font-size: 0.12rem; margin-bottom: 0.12rem; color: #070b2d; font-weight: normal; margin-top: 0.2rem; } 
.qmbz ul li:hover { box-shadow: 0px 6px 20px 0px rgba(121,128,143,0.1); } 
.qmbz ul li:hover img:first-child { display: none; } 
.qmbz ul li:hover img:nth-child(2) { display: inline-block; } 
.qmbz ul li .qmbz_img { position: relative; transition: all 0.8s; height: 0.6rem; margin-top: 0; width: 0.6rem; margin: 0 auto; } 
.qmbz ul li .qmbz_img::after { content: ""; display: inline-block; width: 0rem; position: absolute; bottom: 0.3rem; left: 50%; border-radius: 50%; box-shadow: 0 10px 35px 20px rgba(3,38,255,0.5); transform: translate(0,-50px); transition: all 0.5s; opacity: 0; }
.qmbz ul li .qmbz_img img { width: 100%; transition:all 0.5s; } 
.qmbz ul li:hover .qmbz_img { margin-top: -0.3rem; height: 0.9rem; } 
.qmbz ul li:hover .qmbz_img::after { width: 0.07rem; opacity: 1; transform: none !important; }


@media screen and (max-width:900px){
    /*banner*/
    .bannerBg .khalBanner .modelTitle { font-size: 0.28rem; } 
    .bannerBg .khalBanner .modelCon p { font-size: 0.14rem; line-height: 0.28rem; }
    .bannerBg .khalBanner .modelCon .modelBtn a { font-size: 0.14rem; }
    /*公用标题*/
    .conTitle p { font-size: 0.28rem; } 

    /*交付方式*/
    .bsfs ul li { padding: 0.8rem 0.3rem 0.4rem; } 
    .bsfs ul li p { font-size: 0.18rem; line-height: 0.3rem; } 
    .bsfs ul li p.btn span { display: block; width: 1.2rem; margin: 0 auto; height: 0.4rem; line-height: 0.4rem; margin-bottom: 0.1rem; } 
    .bsfs ul li .title { font-size: 0.22rem; } 
    .bsfs ul li .titleImg { width: 1.2rem; margin-left: -0.6rem; }

    /*生命周期*/
    .steps li:before { width: 0.3rem; height: 0.3rem; line-height: 0.3rem; font-size: 0.16rem; } 
    .steps li~li:after { top: 0.15rem; } 
    .steps li p { font-size: 0.18rem; line-height: 0.3rem; } 
    .steps li h2 { font-size: 0.22rem; } 

    /*全面保障*/
    .qmbz ul li { height: 3.7rem; } 
    .qmbz ul li p { font-size: 0.18rem; line-height: 0.3rem; } 
    .qmbz ul li p.title { font-size: 0.22rem; margin-bottom: 0.2rem; margin-top: 0.3rem; } 
    .qmbz ul li:hover .qmbz_img::after {box-shadow: 0px 5px 20px 12px rgba(3,38,255,0.5);}

}


@media screen and (max-width:600px){
    .bannerBg { padding: 2rem 0 0.6rem; }
    /*banner*/
    .bannerBg .khalBanner { width: 100%; } 
    .bannerBg .khalBanner .modelTitle {font-size: 22px;} 
    .bannerBg .khalBanner .modelCon p {font-size: 14px;line-height: 0.6rem;margin: 1rem 0;} 
    .bannerBg .khalBanner .modelCon .modelBtn a {font-size: 14px;padding: 5px 18px;} 

    /*公用标题*/
    .conTitle { padding-top: 1rem; } 
    .conTitle p {font-size: 20px;margin-bottom: 1rem;} 

    /*部署方式*/
    .bsfs ul li .title {font-size: 18px;margin: 0.4rem 0;line-height: 32px;} 
    .bsfs ul li { width: 100%; margin-bottom: 0.4rem; } 
    .bsfs ul li .titleImg { width: 2rem; margin-left: -1rem; top: -0.8rem; } 
    .bsfs ul li p {font-size: 14px;line-height: 0.5rem;} 
    .bsfs ul li p.btn span { width: 2.6rem; height: 0.7rem; line-height: 0.7rem; margin-bottom: 0.3rem; } 
    .bsfs ul li p.btn span:last-child { margin-bottom: 0px; } 
    .bsfs ul li:hover .bgHover { width: 4rem; height: 4rem; bottom: -2rem; left: -2rem; }
    
    /*生命周期*/
    .steps li { width: 50%;margin-bottom:0.4rem; } 
    .steps li h2 {font-size: 16px;margin: 0.4rem 0;line-height: 26px;} 
    .steps li p {font-size: 14px;line-height: 26px;} 
    .steps li:before {width: 30px;height: 30px;font-size: 16px;line-height: 30px;} 
    .steps li~li:after { top: 15px; } 
    .steps li:nth-child(3):after { display: none; } 
    .steps li:nth-child(5):after { display: none; }

    /*全面保障*/
    .qmbz ul li {width: 100%;margin-bottom: 0.4rem;margin-right: 0px;height: auto;}
    .qmbz ul li p {font-size: 14px;line-height: 26px;} 
    .qmbz ul li p.title {font-size: 16px;margin: 0.4rem 0;line-height: 0.36rem;} 
    .qmbz ul li .qmbz_img { height: 1rem; width: 1rem; } 
    .qmbz ul li:hover .qmbz_img { height: 1.3rem; }


}