@charset "utf-8";

.header-nav ul .item:nth-child(2) a::before {
    width: 100%;
}

/* 智能云建站 */
.index_center{padding-top:80px;}

/*颠覆传统建站方式*/
.Cloudmode_main{height: 648px;}
.Cloudmode_main_tit{text-align: center; padding-top: 80px;padding-bottom: 50px;}
.Cloudmode_list{overflow: hidden;background:#f5f5f5;}
.Cloudmode_list_div{max-width: 1180px;margin: 0 auto;background:#ffffff;overflow: hidden;padding:0 10px; width: 92%; display: flex;justify-content: space-around;flex-wrap: wrap;}

.Cloudmode_pic{width:23.3%;position: relative;}
.Cloudmode_pic span{width: 100%;height:306px;display: block;overflow: hidden;}
.Cloudmode_em{ position: absolute;z-index: 2;width: 100%;height: 306px;top: 0;background: rgba(0, 0, 0, 0.7);}
.Cloudmode_yuanmax{ position: absolute;top: 50%;left: 50%; z-index: 3; transform: translate(-50%,-50%);}
.Cloudmode_yuan{ width: 140px;height: 140px;background: rgba(57, 177, 235, 0.9);border-radius: 50%;overflow: hidden;}
.Cloudmode_yuanico{width: 36px;height: 36px;margin: 0 auto;margin-top: 30px;}
.Cloudmode_yuantext{color: #ffffff;font-size: 16px;line-height: 1.5;text-align: center;display: block;margin-top: 15px;font-weight: normal;}
.Clyuan_cur1{background:rgba(96, 185, 88, 0.8);}
.Clyuan_cur2{background:rgba(255, 128, 92, 0.8);}
.Clyuan_cur3{background:rgba(136, 63, 182, 0.8);}

.Cloudmode_yuanmax1{width: 100%;height:306px;position: absolute;top: 0;left: 0;right: 0;z-index: 4;background: rgba(57, 177, 235, 0.8);display: none;padding: 0 20px;box-sizing: border-box;}
.Cloudmode_yuanmax2{background:rgba(96, 185, 88, 0.9);}
.Cloudmode_yuanmax3{background:rgba(255, 128, 92, 0.9);}
.Cloudmode_yuanmax4{background:rgba(136, 63, 182, 0.9);}
.Cloudmode_pic .box{
    width: 100%;
    height: 100%;
}
.Cloudmode_Top_tit{
    height: 79px;
    border-bottom: 1px solid rgba(235, 228, 228, 0.6);
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: center;
}
.Cloudmode_Top_con1{
    width: 100%;
    height: calc(100% - 109px);
    position: relative;
}
.Cloudmode_tit_img{width: 30px;height: 30px;overflow: hidden;margin-right: 10px;}
.Cloudmode_tit_img img{width:100%;}
.Cloudmode_tit_text{font-size: 20px;color: #ffffff;overflow: hidden; font-weight: normal;}
.Cloudmode_Top_con1::after{
    content: "";
    display: block;
    position: relative;
    width: 38px;
    height: 131px;
    background: url(../img/PK_img1.png) no-repeat center/cover;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 8px;
}
.Cloudmode_Top_con2{
    width: 100%;
    height: calc(100% - 109px);
    position: relative;
}
.Cloudmode_Top_con2::after{
    content: "";
    display: block;
    position: relative;
    width: 38px;
    height: 131px;
    background: url(../img/PK_img2.png) no-repeat center/cover;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 8px;
}
.Cloudmode_Top_con3{
    width: 100%;
    height: calc(100% - 109px);
    position: relative;
}
.Cloudmode_Top_con3::after{
    content: "";
    display: block;
    position: relative;
    width: 38px;
    height: 131px;
    background: url(../img/PK_img3.png) no-repeat center/cover;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 8px;
}
.Cloudmode_Top_con4{
    width: 100%;
    height: calc(100% - 109px);
    position: relative;
}
.Cloudmode_Top_con4::after{
    content: "";
    display: block;
    position: relative;
    width: 38px;
    height: 131px;
    background: url(../img/PK_img4.png) no-repeat center/cover;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 8px;
}
.Cloudmode_Top_con_text1,.Cloudmode_Top_con_text2{
    display: flex;
    justify-content: space-between;
}
.Cloudmode_Top_con_text2{    
    position: absolute;
    bottom: 50px;
    width: 100%;
}
.Cur_text1eml,.Cur_text1fontl{float: left;font-size: 14px;display: block; }
.Cur_text1eml,.Cur_text1emr{color: #fffc00; font-weight: normal;}
.Cur_text1fontl,.Cur_text1fontr{color: #ffffff;}
.Cur_text1emr,.Cur_text1fontr{overflow: hidden;font-size: 14px;;display: block;}

/*百种行业，千套模板，随您挑选*/
.Cloud_Hundred{background: url(../img/Cloud_banner1.jpg);}
.Hundred_main{ display: flex;
    align-items: center;
    justify-content: space-between;flex-wrap: wrap;}

.Hundred_titmax{font-size: 24px;color: #ffffff;margin-bottom: 10px;}
.Hundred_titmin{font-size: 14px;line-height: 28px;color: #ffffff;display: block; font-weight: normal;}
.Hundred_butotn{width: 145px;height: 45px;background: #ffd200;border-radius: 3px;overflow: hidden;display: block;text-align: center;font-size:16px;line-height: 28px;color: #ffffff;line-height: 45px;margin-top: 40px;}
.Hundred_right{max-width:525px;width: 50%;}
.Hundred_right img{
    display: block;
    width: 100%;
}
/*灵活排版，风格随心DIY*/
.Cloud_DIY{ background: #ffffff;}
.DIY_mian{display: flex; align-items: center;justify-content: space-between; padding: 90px 0; box-sizing: border-box;flex-wrap: wrap;}
.DIY_left{max-width: 477px;width: 55%;}
.DIY_left img{width: 100%;}
.DIY_right{ float: right;}
.DIY_titmax{font-size: 24px;color: #333333;text-align: right;margin-bottom: 38px;}
.DIY_titmin{font-size: 14px;color: #777777;text-align: right;display: block;margin-bottom: 5px; font-weight: normal;}

/*六站合一、一步到位*/
.Cloud_Six{ background: #f5f5f5;}
.Six_mian{display: flex; align-items: center; justify-content: space-between;padding: 90px 0; box-sizing: border-box;flex-wrap: wrap;}
.Six_left{float: left; }
.Six_right{   
     max-width: 400px;
    width: 50%;}
.Six_right img{width: 100%;}
.Six_titmax{font-size: 24px;color: #333333;margin-bottom: 38px;}
.Six_titmin{font-size: 14px;line-height: 22px;color: #777777;display: block;margin-bottom: 5px; font-weight: normal;}

/*应用插件功能强大*/
.Cloud_Plugin{ background: #ffffff;}
.Plugin_main{display: flex; align-items: center;justify-content: space-between; padding: 90px 0; box-sizing: border-box;flex-wrap: wrap;}
.Plugin_left{    
    max-width: 546px;
    width: 55%;}
.Plugin_left img{width: 100%;}
.Plugin_titmax{font-size: 24px;color: #333333;text-align: right;margin-bottom: 38px;}
.Plugin_titmin{font-size: 14px;color: #777777;text-align: right;display: block;margin-bottom: 5px; font-weight: normal;}


/*专业SEO优化*/
.Cloud_SEO{ background: #f5f5f5;}
.SEO_mian{display: flex; align-items: center;justify-content: space-between; padding: 90px 0; box-sizing: border-box;flex-wrap: wrap;}

.SEO_titmax{font-size: 24px;color: #333333;margin-bottom: 38px;}
.SEO_titmin{font-size: 14px;line-height: 22px;color: #777777;display: block;margin-bottom: 5px; font-weight: normal;}
.SEO_right{max-width: 525px; width: 50%;}
.SEO_right img{width: 100%;}


/* 高端品牌官网 */
.web-wrap{
    width: 100%;
}
.web-hline{
    width: 30px;
    height: 1px;
    background: #999999;
    margin: 35px 0px;
    display: block;
}
.web-title {
    font-size: 36px;
    line-height: 1.76;
    color: #000000;
}
.web-subtitle{
    width: 100%;
    font-size: 14px;
    line-height: 22px;
    margin-top: 15px;
}
.web-leftbox{
    width:40%;
}
.web-text{
    width:100%;
    font-size: 14px;
    color: #9B9B9B;
    line-height: 30px;
}
.web-img{
    max-width: 55%;
    min-height: 500px;
}
.web-btn{
    width: 126px;
    height: 42px;
    line-height: 42px;
    border: 1px solid #999999;
    margin-top: 60px;
    font-size: 14px;
    color: #999999;
    text-align: center;
	cursor:pointer;
}
.web-btn:hover{
    background: #007ABD;
    color: #fff;
    border: 1px solid #007ABD;
}
.web-plan{
    width: 100%;
    background: url(../img/web-bg1.jpg) no-repeat center center;
}
.web-plan-title{
    font-size: 36px;
    text-align: center;
    font-weight: 200;
    line-height: 1.76;
}
.web-plan-title2{
    font-size: 16px;
    margin-top: 20px;
    text-align: center;
}
.web-plan .web-plan-title ,.web-plan .web-plan-title2{
    color: #fff;
}
.web-plan-box{
    color: #fff;
    width: 18%;
    margin-top: 60px;
    text-align: center;
}
.web-plan-icon{
    width: 80px;
    height: 80px;
    display: inline-block;
    margin-bottom: 20px;
}
.web-plan-text1{
    width: 100%;
    font-size: 18px;
    color: #FFFFFF;
}
.web-plan-text2{
    width: 100%;
    font-size: 14px;
    color: #FFFFFF;
    margin-top: 20px;
    line-height: 25px;
}
.web-plan-arrow{
    width: 9.33%;
    margin-top: 163px;
}
.web-design-wrap{
    width: 100%;
}
.web-plan-nax{
    width: 100%;
    display: flex;
}
.web-plan-lists{
    width: 100%;
}
.web-plan-titlebox{
    line-height:45px;
    text-align: center;
    color: #646464;
    cursor: pointer;
    width: 20%;
    position: relative;
}
.web-design-title{
    width:80%;
    display: inline-block;
    line-height:45px;
    background: #007ABD;
    color: #fff;
  
}
.web-design-sline{
    display: block;
    width: 2px;
    height:30px;
    background: #999999;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
.web-plan-titlebox:last-child .web-design-sline{
    display: none;
}
.web-design-box{
    width: 100%;
    overflow: hidden;
}
.web-design-imgbox{
    width: 50%;
    position: relative;
    text-align: center;
    z-index: -1;
    float: left;
}
.web-design-imgbox img{
    max-width: 90%;
    max-height: 380px;
    display: inline-block;
}
.web-design-tbox{
    width: 50%;
    margin-top: 40px;
    float: left;
}
.web-design-title3{
    width: 100%;
    font-size: 36px;
    color: #000;
    text-align: left;
    font-weight: 200;
}
.web-design-title4{
    width:100%;
    font-size: 14px;
    color: #000;
    line-height: 30px;
    margin-top: 10px;
}
.web-design-text{
    width:100%;
    font-size: 14px;
    color: #999999;
    line-height: 30px;
    margin-top: 30px;
}
.outlets-select{
    width: 230px;
    padding: 0px 20px;
    height: 35px;
    line-height: 35px;
    position: relative;
    border:1px solid #C3C3C3;
    background-color: #fff;
    color: #333;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    display: none;
    margin-bottom: 40px;
    margin-left: 30%;
}
.select-img{
    margin-top: 12px;
    transform:rotate(90deg);
    -ms-transform:rotate(90deg);     /* IE 9 */
    -moz-transform:rotate(90deg);    /* Firefox */
    -webkit-transform:rotate(90deg); /* Safari 和 Chrome */
    -o-transform:rotate(90deg);
}
.select-box{
    width: 90%;
    position: absolute;
    top:35px;
    left: -1px;
    background: #fff;
    border:1px solid #C3C3C3;
    z-index: 2;
    padding: 0px 5%;
    display: none;
}
.select-box-text{
    width: 100%;
    line-height: 35px;
    float: left;
    cursor: pointer;
    font-weight: 400;
}
.web-data-wrap{
    width: 100%;
    padding: 75px 0px;
    background: #0080C1;
}
.web-data-box{
    width: 20%;
    text-align: center;
}
.web-data-text3{
    width: 100%;
    display: inline-block;
    font-size: 14px;
    color: #FFFFFF;
}
.web-data-text1{
    display: inline-block;
    font-size: 34px;
    color: #FFFFFF;
    border-bottom: 3px solid #fff;
    padding-bottom: 10px;
    margin-top: 5px;
}
.web-data-text2{
     width: 100%;
    display: inline-block;
    font-size: 14px;
    color: #FFFFFF;
    margin-top: 20px;
    line-height: 20px;
}
.web-img-wrap{
    width: 100%;
}
.web-img-box1{
    background: #1A1A1A;
}
.web-img-img1{
    width: 50%;
    position: relative;
}
.web-img-img2{
    width: 25%;
    position: relative;
}
.web-img-img1 img,.web-img-img2 img{
    width: 100%;
    display: block;
}
.web-img-text1{
    text-align: right;
    position: absolute;
    top: 55px;
    right: 50px;
    font-size: 14px;
    line-height: 20px;
    color: #fff;
}
.web-img-text2{
    position: absolute;
    bottom: 0px;
    left: 0px;
    font-size: 14px;
    color: #fff;
    width: 100%;
    padding: 7% 0px;
    line-height: 20px;
    background: #0080C1;
    text-align: center;
}
.web-img-text3{
    width:80%;
    position: absolute;
    top: 55px;
    left: 50px;
    font-size: 14px;
    line-height: 20px;
    color: #fff;
}
.optimize-box{
    width: 20.7%;
    text-align: center;
    font-size: 18px;
    margin-top: 50px;
    padding: 40px 2%;
    border-right: 1px solid #ECECEC;
}
.optimize-box:last-child{border-right: none;}
.optimize-img{
    width: 70px;
    height: 70px;
    display: inline-block;
}
.optimize-title{
    width: 100%;
    float: left;
    text-align: center;
    color: #333;
    margin-top: 30px;
}
.optimize-text{
    width: 100%;
    float: left;
    text-align: center;
    margin-top: 15px;
    font-size: 14px;
    color: #999999;
}
.optimize-btn{
    width: 180px;
    height: 53px;
    display: block;
    background: url(../img/seo-icon12.png) no-repeat center center rgba(255,255,255,0);
    background-size: 100% 100%;
    color: #fff;
    font-size: 20px;
    border:none;
    outline: none;
    margin: 90px auto 0;
}
.optimize-btn:hover{
    background: #fff;
    color: #52B7F9;
    border:1px solid #52B7F9;
    border-radius: 30px;
    -moz-border-radius: 30px;
    -webkit-border-radius: 30px;
}
.opt-content-btn{
    display: inline-block;
    width: 143px;
    height: 36px;
    background: #51B7F9;
    border-radius: 16px;
    -moz-border-radius: 16px;
    -webkit-border-radius: 16px;
    color: #fff;
    font-size: 14px;
    line-height: 36px;
    margin-top: 20px;
	text-align:center;
	cursor:pointer;
}
.opt-content-btn:hover{
    background: #fff;
    color: #52B7F9;
    border:1px solid #52B7F9;
}

.more-box{
    width:96%;
    height: 98px;
    float: left;
    border:1px solid #D2D2D2;
    line-height: 98px;
    color: #1E1E1E;
    padding: 0px 2%;
    margin-top: 30px;
    font-weight: 400;
    font-style: normal;
}
.more-box:hover{
    background: #1283C7;
    color: #fff;
    border:1px solid #1283C7;
}


/* app商城开始 */
.app .page01 .lists {
    padding: 0 12.25%;
    box-sizing: border-box;
}

.app .page01 .list {
    flex-direction: column;
}
.app .page01 .list .icon{
    max-width: 50px;
}
.app .page01 .desc {
    margin-top: 30px;
}

.app .page02 {
    background: url(../img/app_bg02.png) no-repeat center/cover;
}

.app .page02 .conInner {
    padding: 0 6.92%;
    box-sizing: border-box;
}

.app .page02 .item {
    width: 164px;
    height: 50px;
    border-radius: 25px;
    background: rgba(0, 0, 0, .3);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 40px;
    transition: all .4s;
}

.app .page02 .item:last-child {
    margin-right: 0;
}

.app .page02 .item.active {
    background: #017ABF;
}

.app .page02 .list {
    display: none;
}

.app .page02 .list.active {
    display: block;
}

.app .page02 .con {
    background: rgba(82, 92, 106, .6);
    padding: 30px 25px 30px;
    box-sizing: border-box;
    height:155px;
    display: flex;
    align-items: center;
}

.app .page02 .box {
    justify-content: space-between;
}

.app .page02 .box-content {
    flex-direction: column;
}

.app .page02 .desc {
    margin-top: 5px;
}

.app .page03 .lists {
    padding: 0 7.5%;
    box-sizing: border-box;
}
.app .page03 .img{
    max-width: 464px;
    width: 50%;
}
.app .page03 .item {
    margin: 18px 0;
}

.app .page03 .item::before {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border: 1px solid #576478;
    border-radius: 50%;
    margin-right: 10px;
}

.app .page04 {
    position: relative;
    margin-top: -45px;
    padding-top: 220px;
    box-sizing: border-box;
    background: url(../img/app-bg04.png) no-repeat center/cover;
}

.app .page04 .lists {
    padding: 0 2.8%;
    box-sizing: border-box;
}

.app .page04 .list {
    background: #FFFFFF;
    box-shadow: 0px 7px 6px 0px rgba(1, 15, 23, 0.1000);
    border-radius: 6px;
    margin-bottom: 70px;
    padding: 30px 20px;
    box-sizing: border-box;
    width: 28%;
    flex-direction: column;
}

.app .page04 .text {
    padding-top: 20px;
    box-sizing: border-box;
}

.app .page04 .tit {
    margin: 7px 0 7px;
}

.app .page04 .con {
    height: 48px;
}

.app .page02 .item:hover {
    background: #017ABF;
}


/* 系统平台开发 */
.develop .page01 .swiper-container {
    cursor: auto !important;
}

.develop .page01 .img {
    width: 47.7%;
}

.develop .page01 .texts {
    width: 49.3%;
    margin-right: 30px;
    position: relative;
    margin-top: -50px;
}

.develop .page01 .text {
    margin-bottom: 26px;
}

.develop .page01 .text:last-child {
    margin-bottom: 0;
}

.develop .page01 .desc {
    margin-top: 16px;
}

.develop .page01 .text p {
    margin-bottom: 10px;
}

.develop .page01 .text p:last-child {
    margin-bottom: 0;
}

.develop .page01 .swiper-pagination-bullet {
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    font-size: 12px;
    color: #fff;
    opacity: 1;
    background: #576478;
}

.develop .page01 .swiper-pagination-bullet-active {
    background: #1a79eb;
}

.develop .page02 {
    padding-top: 380px;
    box-sizing: border-box;
    background: url(../img/develop_bg02.png) no-repeat center/cover;
    position: relative;
    margin-top: -275px;
}

.develop .page02 .list {
    width: 30%;
    margin-right: 5%;
    background: #FFFFFF;
    border-radius: 6px;
    margin-bottom: 100px;
    padding: 0 25px;
    box-sizing: border-box;
    height: 200px;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    position: relative;
    transition: all .4s;
    z-index: 0;
}

.develop .page02 .list:nth-child(3n) {
    margin-right: 0;
}

.develop .page02 .icon {
    width: 100px;
    transition: all .4s;
    position: absolute;
    left: 20px;
    top: -50px;
    z-index: 3;
}

.develop .page02 .icon img {
    transition: all .4s;
}

.develop .page02 .h-img {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
}

.develop .page02 .tit {
    transition: all .4s;
}

.develop .page02 .desc {
    margin-top: 14px;
    /* min-height: 144px; */
    transition: all .4s;
}

.develop .page03 {
    height: 571px;
    background: url(../img/develop_bg03.png) no-repeat center/cover;
    display: flex;
    align-items: center;
}

.develop .page02 .list:hover {
    background: #729DF8;
}

.develop .page02 .list:hover .h-img {
    opacity: 1;
}

.develop .page02 .list:hover .p-img {
    opacity: 0;
}

.develop .page02 .list:hover .tit {
    color: #fff;
}

.develop .page02 .list:hover .desc {
    color: #fff;
}


/* 微信小程序开始 */
.applet .page01 .lists {
    position: relative;
}

.applet .page01 .list {
    position: absolute;
    padding: 12px 17px;
    box-sizing: border-box;
    display: inline-block;
    background: #f5f6f8;
    border-radius: 8px;
}

.applet .page01 .list_one {
    left: 24%;
    top: 16px;
    max-width: 210px;
}

.applet .page01 .list_two {
    right: 25%;
    top: 16px;
    max-width: 260px;
}

.applet .page01 .list_three {
    left: 14.5%;
    top: 55%;
    max-width: 260px;
}

.applet .page01 .list_four {
    right: 11.4%;
    top: 27%;
    max-width: 260px;
}

.applet .page02 .list {
    width: 23.23%;
    height: 268px;
    border: 1px solid #E5E5E5;
    padding: 0 30px;
    box-sizing: border-box;
    margin-right: 2.36%;
    margin-bottom: 18px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.applet .page02 .list:nth-child(4n){
    margin-right: 0;
}
.applet .page02 .tit {
    margin: 15px 0 10px;
}
.applet .page02 .con {
    height: 72px;
}
.applet .page03 .lists {
    padding: 0 12.3%;
    box-sizing: border-box;
}

.applet .page03 .list {
    width: 23.2%;
    margin-right: 2.4%;
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 20px;
    box-sizing: border-box;
    background: #fff;
    justify-content: center;
}

.applet .page03 .list:nth-child(4n) {
    margin-right: 0;
}

.applet .page03 .list .icon {
    width: 46px;
}

.applet .page03 .list .texts {
    width: calc(100% - 46px);
    padding-left: 10px;
    box-sizing: border-box;
}

.applet .page03 .list .desc {
    margin-top: 5px;
}

.applet .page04 .lists {
    overflow: hidden;
}



.redevelop .page01 .list{
    width: 32%;
    height: 281px;
    border: 1px solid #E5E5E5;
    margin-right: 2%;
    margin-bottom: 2%;
    padding: 0 30px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    transition: all .4s;
}
.redevelop .page01 .list_text {
    height: 90px;
    margin-top: 15px;
    transition: all .4s;
}
.redevelop .page01 .list:nth-child(3n){
    margin-right: 0;
}
.redevelop .page01 .list_title{
    display: flex;
    align-items: center;
}
.redevelop .page01 .title_tit {
    width: calc(100% - 70px);
    transition: all .4s;
}
.redevelop .page01 .title_icon{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
}
.redevelop .page01 .title_icon img{
    transition: all .4s;
}
.redevelop .page01 .title_icon .h_img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    opacity: 0;
}
.redevelop .page02 .list{
    width: 23.5%;
    margin-right: 2%;
    margin-bottom: 2%;
    box-shadow: 0px 5px 7px 0px rgba(181,181,181,0.15);
    transition: all .4s;
}
.redevelop .page02 .list:nth-child(4n){
    margin-right: 0px;
}
.redevelop .page02 .texts{
    padding: 34px 20px;
    box-sizing: border-box;
    text-align: center;
}
.redevelop .page02 .texts_text {
    margin-top: 9px;
    line-height: 1.875;
    height: 52px;
}

.redevelop .case-content{
    width: 23.5%;
    margin-right: 2%;
	margin-bottom: 2%;
}
.redevelop .case-content:nth-child(4n){
    margin-right: 0px;
}
.redevelop .case-imgbox{
    width: 100%;
    position: relative;
	overflow:hidden;
	cursor:pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.redevelop .case-img{
    max-width: 100%;
    max-height: 100%;
	transition:all .4s;
	
}
.redevelop .case-borde{
    width: 100%;
    height: 100%;
    position: absolute;
    background: none;
    z-index: 3;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background: rgba(0,0,0,.6);
	opacity:0;
	color:#ffffff;
	transition:all .4s;
}
.redevelop .case-borde .title{
   color:#ffffff;
   margin:10px 0;
}
.redevelop .case-borde span{
  display: inline-block;
    width: 60px;
    height: 1px;
    background-color: #f2f2f2;
    left: 50%;
    transition: all 0.6s ease 0s;
}
.redevelop .case-imgbox:hover span {
    width: 6px;
    margin-left: -3px;
    opacity: 0.6;
    filter: alpha(opacity=60);
}
.redevelop .case-imgbox:hover img {
    transform: scale(1.05, 1.05);
    transition: transform 0.6s ease 0s;
}

.redevelop .case-imgbox:hover .case-borde{
    opacity:1;
}

.redevelop .case-titbox{
    background: #F7F7F7;
    padding: 5% 3%;
    width: 100%;
    position: relative;
    box-sizing: border-box;
    display: flex;
    align-items: center
}
.redevelop .case-borde-texts{
    width: calc(100% - 25px);
    padding-right: 15px;
    box-sizing: border-box;
}
.redevelop .case-titbox .add-icon{
    display: flex;
    align-items: center;
    width: 25px;
} 
.redevelop .case-titbox .add-icon img{
    width: 100%;
    display: block;
}
.redevelop .case-text{
    font-size: 16px;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis; 
    display: -webkit-box; 
    -webkit-box-orient: vertical; 
    -webkit-line-clamp: 1;
    font-weight: 300;
}
.redevelop .case-text2{
    width: 100%;
    margin-top: 10px;
    font-size: 12px;
    color: #A0A0A0;
    overflow: hidden;
    text-overflow: ellipsis; 
    display: -webkit-box; 
    -webkit-box-orient: vertical; 
    -webkit-line-clamp: 1;
}
.redevelop .case-content:hover .case-text {color: #007DBF;}
/* PC客户端或大屏幕设备: 小于1360px */
@media only screen and (max-width: 1600px) {
    .web-hline{margin: 15px 0px;}
    .web-btn{margin-top: 20px;}

    .applet .page01 .list_four {
        right: 9.5%;
        top: 27%;
        max-width: 260px;
    }
    .applet .page01 .list_three{
        left: 12.5%;
    }
    .applet .page01 .list_two{
        right: 24%;
    }
    .applet .page01 .list_one{
        left: 23%;
    }
}
@media only screen and (max-width: 960px) {
    .redevelop .case-content{width: 49%; margin-right: 2%;}
    .redevelop .case-content:nth-child(2n){margin-right: 0px;}
}
/* 手机等小屏幕手持设备 */
@media only screen and (max-width: 750px) {
    .redevelop .case-content{width: 100%;margin-right: 0px !important;}
}

@media only screen and (min-width: 960px) {
    .redevelop .page01 .list:hover{
        background: #017ABF;
    }
    .redevelop .page01 .list:hover .title_icon .h_img{
        opacity: 1;
    }
    .redevelop .page01 .list:hover .title_icon .p_img{
        opacity: 0;
    }
    .redevelop .page01 .list:hover .title_tit {
        color: #fff;
    }
    .redevelop .page01 .list:hover .list_text  {
        color: #fff;
    }
    .redevelop .page02 .list:hover{
        transform: translateY(-10px);
    }
}
@media only screen and (max-width: 1480px) {
    .applet .page01 .list_one {
        left: 21%;
    }
    .applet .page01 .list_three {
        left: 9.6%;
    }
    .applet .page01 .list_two {
        right: 21.5%;
    }
    .applet .page01 .list_four {
        right: 6%;
    }
}
@media only screen and (max-width: 1400px) {
    .applet .page01 .list_one {
        left: 19%;
    }
    .applet .page01 .list_three {
        left: 7%;
    }
    .applet .page01 .list_four {
        right: 3.5%;
    }
    .applet .page01 .list_two {
        right: 19.5%;
    }
}
@media only screen and (max-width: 1366px) {
    .redevelop .page01 .title_icon{
        width: 40px;
    }
    .redevelop .page01 .title_tit{
        width: calc(100% - 40px);
        padding-right: 10px;
        box-sizing: border-box;
    }
    .applet .page01 .list_four {
        right: 2.5%;
    }
}
@media only screen and (max-width: 1280px) {
    .applet .page01 .list_one {
        left: 16.25%;
    }
    .applet .page01 .list_two {
        right: 17%;
    }
    .applet .page01 .list_four {
        right: 1%;
        top: 43%;
    }
    .applet .page01 .list_three {
        top: 39%;
    }
}
@media only screen and (max-width: 1200px) {
    .app .page01 .list .icon{
         max-width: 60px;
    }
    .app .page04 .list{
        margin-bottom: 60px;
    }
    .app .page04{
        padding-top: 185px;
    }
    .develop .page01 .texts{
        margin-right: 0;
    }
    .applet .page03 .lists {
        padding: 0 6%;
    }
}
@media only screen and (max-width: 1140px) {
    .redevelop .page01 .title_icon {
        width: 30px;
    }
    .redevelop .page01 .title_tit {
        width: calc(100% - 30px);
    }
}
@media only screen and (max-width: 1100px) {
    .redevelop .page01 .title_icon {
        display: none;
    }
    .redevelop .page01 .title_tit{
        width: 100%;
        padding-right: 0;
    }
    
}
@media only screen and (max-width: 1024px) {
    .web-design-tbox{
        margin-top: 0;
    }
    .web-design-title3{
        font-size: 24px;
    }
    .optimize-btn{
        margin-top: 60px;
    }
    .DIY_mian{
        padding: 60px 0;
    }
    .Six_mian{
        padding: 60px 0;
    }
    .Plugin_main{
        padding: 60px 0;
    }
    .SEO_mian{
        padding: 60px 0;
    }
    .redevelop .page01 .list{
        padding: 0 20px;
    }
    .app .page04 .list{
        width: 31%;
    }
    .app .page01 .lists {
        padding: 0 7.25%;
    }
    .app .page01 .list .icon {
        max-width: 50px;
    }
    .app .page02 .conInner {
        padding: 0;
    }
    .develop .page02 .list{
        height: 328px;
    }
    .develop .page03{
        height: 456px;
    }
    .applet .page03 .lists {
        padding: 0;
    }
    .applet .page01 .list_one {
        left: 11%;
    }
    .applet .page01 .list_two {
        right: 12%;
    }
    .applet .page01 .list_four {
        max-width: 210px;
    }
    .applet .page01 .list_three {
        max-width: 218px;
    }
    .applet .page02 .list{
        padding: 0 20px;
    }
}
@media only screen and (max-width: 960px) {
    .Cloudmode_yuan{
        width: 120px;
        height: 120px;
    }
    .web-plan-title{
        font-size: 30px;
    }
    .Cloudmode_main_tit{
        font-size: 22px;
    }
    .Hundred_titmax{
        font-size: 22px;
    }
    .DIY_titmax{
        font-size: 22px;
    }
    .Six_titmax{
        font-size: 22px;
    }
    .Plugin_titmax{
        font-size: 22px;
    }
    .SEO_titmax{
        font-size: 22px;
    }
    .redevelop .page02 .list{
        width: 48%;
        margin-right: 4%;
        margin-bottom: 15px;
    }
    .redevelop .page02 .list .img{
        display: flex;
        justify-content: center;
    }
    .redevelop .page02 .list:nth-child(4n){
        margin-right: 2%;
    }
    .redevelop .page02 .list:nth-child(2n){
        margin-right: 0;
    }
    .app .page04 .lists {
        padding: 0;
    }
    .app .page02 .item {
        width: 128px;
        height: 44px;
    }
    .app .page03 .lists{
        padding: 0;
    }
    .app .page02 .box-content {
        flex-direction: column;
        width: 25%;
        margin-bottom: 20px;
    }
    .app .page01 .lists {
        padding: 0 3.25%;
    }
    .develop .page02 .list{
        width: 32%;
        margin-right: 2%;
        margin-bottom: 80px;
    }
    .develop .page03 {
        height: 378px;
    }
    .applet .page01 .lists img{
        display: none;
    }
    .applet .page01 .list {
        position: initial;
        max-width: 48%;
        padding: 20px 20px;
        box-sizing: border-box;
        width: 48%;
        margin-right: 4%;
        margin-bottom: 15px;
    }
    .applet .page01 .list:nth-child(2n-1){
        margin-right: 0;
    }
}
@media only screen and (max-width: 768px) {
    .optimize-btn {
        margin-top: 25px;
        height: 42px;
        width: 156px;
        font-size: 16px;
    }
    .web-img{
        max-width: 100%;
        min-height: auto;
        margin-top: 25px;
    }
    .web-leftbox{
        width: 100%;
    }
    .web-design-title3{
        display: none;
    }
    .web-design-title4{
        display: none;
    }
    .web-design-text{
        margin-top: 10px;
    }
    .web-design-title{
        width: 100%;
        line-height: 38px;
    }
    .web-design-imgbox{
        width: 100%;
    }
    .web-design-tbox{
        margin-top: 20px;
        width: 100%;
    }
    .web-design-sline{
        display: none;
    }

    .web-plan-title{
        font-size: 20px;
    }
    .web-plan-title2{
        margin-top: 0;
        font-size: 14px;
    }
    .web-plan-nax{
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        margin: 10px 0 20px;
    }
    .web-plan-lists{
        width: 100%;
        margin-top: 0;
    }
    .web-plan-box{
        width: 47%;
        margin-right: 6%;
        margin-top: 25px;
    }
    .web-plan-box:nth-child(4n-1){
        margin-right: 0;
    }
    .web-plan-arrow{
        display: none;
    }
    .web-plan{
        background: url(../img/web-bg1.jpg) no-repeat center/cover;
    }
    .web-plan-icon {
        width: 55px;
        height: 55px;
        margin-bottom: 15px;
    }
    .web-plan-text2{
        margin-top: 10px;
        font-size: 12px;
    }
    .web-plan-titlebox{
        width: 32%;
        margin: 2% 2% 0 0;
        line-height: 38px;
    }
    .web-plan-titlebox:nth-child(3n){
        margin-right: 0;
    }

    .web-img-img1{
        width: 100%;
    }
    .web-img-text1 {
        text-align: center;
        position: absolute;
        top: initial;
        right: 0;
        width: 100%;
        font-size: 14px;
        line-height: 20px;
        color: #fff;
        bottom: 0;
        padding: 10px 4%;
        box-sizing: border-box;
        background: #0080C1;
    }
    .web-img-text2{
        padding: 20px 0;
    }

    .web-data-text1{
        font-size: 26px;
    }
    .web-data-wrap{
        padding: 25px 0px;
        display: none;
    }
    .web-data-box{
        width: 33.33%;
        margin-bottom: 20px;
    }
    .web-data-box:nth-last-child(1),.web-data-box:nth-last-child(2){
        margin-bottom: 0;
    }
    .web-img-wrap{
        display: none;
    }
    .web-title {
        font-size: 24px;
    }

    .web-subtitle{
        margin-top: 0;
    }
    .web-hline{
        display: block;
        margin: 20px 0;
    }

    .applet .page01 .content_box .content_box_tit {
        font-size: 14px !important;
        text-align: left !important;
    }


    .optimize-box{
        box-sizing: border-box;
        width: 50%;
        padding: 10px 2%;
        margin-top: 20px;
    }
    .optimize-title{
        margin-top: 10px;
    }
    .optimize-text{
        margin-top: 5px;
        font-size: 12px;
    }
    .optimize-img {
        width: 54px;
        height: 54px;
    }
    .opt-content-btn{
        margin: 20px auto 0;
        display: block;
    }

    .DIY_mian {
        padding: 30px 0;
        flex-direction: column-reverse;
        align-items: flex-start;
    }
    .Six_titmax{
        margin-bottom: 15px;
        font-size: 18px;
    }
    .Six_mian {
        padding: 30px 0;
    }
    .Six_right{
        margin-top: 25px;
        width: 100%;
        max-width: 100%;
    }
    .Plugin_main {
        padding: 30px 0;
        flex-direction: column-reverse;
        align-items: flex-start;
    }
    .Plugin_left{
        margin-top: 25px;
        width: 100%;
        max-width: 100%;
    }
    .DIY_left {
        max-width: 100%;
        width: 100%;
    }
    .Hundred_right {
        max-width: 100%;
        width: 100%;
    }
    .SEO_mian {
        padding: 30px 0;
    }
    .SEO_left{
        width: 100%;
    }
    .SEO_right{
        margin-top: 25px;
        width: 100%;
        max-width: 100%;
    }
    .DIY_titmax{
        text-align: left;
        margin-bottom: 15px;
    }
    .DIY_titmin{
        text-align: left;
    }
    .Plugin_titmax{
        text-align: left;
        margin-bottom: 15px;
        font-size: 18px;
    }
    .Plugin_titmin{
        text-align: left;
    }
    .Hundred_main{
        flex-direction: column-reverse;
        padding: 30px 0;
    }
    .Hundred_left{
        width: 100%;
        margin-top: 20px;
    }
    .Hundred_butotn{
        margin-top: 25px;
        font-size: 15px;
    }
    .Cloudmode_main_tit{
        padding-top: 30px;
        padding-bottom: 20px;
        font-size: 18px;
    }
    .Cloudmode_pic{
        width: 48%;
        margin-right: 4%;
        margin-bottom: 20px;
    }
    .Cloudmode_pic:nth-child(2n){
        margin-right: 0;
    }
    .Cloudmode_pic:nth-last-child(1),.Cloudmode_pic:nth-last-child(2){
        margin-bottom: 0;
    }
    .Cloudmode_yuan{
        width: 105px;
        height: 105px;
    }
    .Cloudmode_yuantext{
        margin-top: 8px;
        font-size: 15px;
    }
    .Cloudmode_yuanico{
        width: 30px;
        height: 30px;
        margin-top: 25px;
    }
    .Cloudmode_yuanico img{
        width: 100%;
    }
    .SEO_titmax{
        margin-bottom: 15px;
    }
    .Hundred_titmax{
        font-size: 18px;
    }
    .DIY_titmax{
        font-size: 18px;
    }
    .SEO_titmax{
        font-size: 18px;
    }
    .redevelop .page01 .list {
        width: 100%;
        margin-right: 0;
        margin-bottom: 15px;
        height: 198px;
    }
    .redevelop .page02 .texts {
        padding: 25px 15px;
    }
    .redevelop .page02{
        padding-top: 15px;
    }
    .redevelop .page03{
        padding-top: 15px;
    }
    .app .page04 .list {
        width: 100%;
        margin-bottom: 15px;
        padding: 20px 15px;
    }
    .app .page04 {
        padding-top: 190px;
        margin-top: -110px;
    }
    .app .page03 .img {
        max-width: 100%;
        width: 100%;
    }
    .app .page01 .list{
        width: 48%;
        margin-bottom: 25px;
    }
    .app .page01 .desc {
        margin-top: 15px;
    }
    .app .page01 .list .icon {
        max-width: 34px;
    }
    .app .page01 .lists{
        padding: 0;
    }
    .app .page01 .list:last-child{
        margin-bottom: 0;
    }
    .app .page02 .con {
        padding: 20px 20px;
        min-height: 155px;
        height: auto;
    }
    .app .page02 .box-content{
        width: 50%;
    }
    .app .page02 .desc {
        margin-top: 10px;
    }
    .app .page02{
        padding-bottom: 10px;
    }
    .app .page02 .item{
        margin-right: 4%;
        width: 48%;
        height: 38px;
        margin-bottom: 10px;
    }
    .app .page02 .item:nth-child(2n){
        margin-right: 0;
    }
    .app .page02 .lists{
        margin-top: 15px;
    }
    .develop .page01 .img {
        width: 100%;
    }
    .develop .page01 .texts {
        margin-right: 0;
        width: 100%;
        margin-top: 0px;
    }
    .develop .page02 .list {
        width: 100%;
        margin-right: 0;
        margin-bottom: 60px;
        height: 226px;
    }
    .develop .page03 {
        height: auto;
        padding: 40px 0;
    }
    .develop .page02 .icon {
        width: 60px;
        left: 20px;
        top: -30px;
    }
    .develop .page03 .page-tit{
        font-size: 16px;
        line-height: 1.875;
    }
    .develop .page02 .lists{
        margin-top: 50px;
    }
    .develop .page02 .tit{
        padding-top: 50px;
    }
    .develop .page02 .list:last-child{
        margin-bottom: 20px;
    }
    .develop .page02{
        padding-top: 540px;
        margin-top: -470px;
    }
    .develop .page01 .swiper-container{
        /* padding-bottom: 60px; */
        position: initial;
    }
    .develop .page01 .lists{
        position: relative;
        padding-bottom: 40px;
    }
    .develop .page01 .desc{
        line-height: 1.875;
    }
    .optimize-box{
        font-size: 16px;
    }
    .web-plan-text1{
        font-size: 16px;
    }
    .applet .page01 .list{
        width: 100%;
        margin-right: 0;
        max-width: 100%;
        line-height: 1.875;
    }
    .applet .page01 .list:last-child{
        margin-bottom: 0;
    }
    .applet .page02 .list {
        padding: 0 20px;
        width: 100%;
        height: 218px;
    }
    .applet .page02 .list:last-child{
        margin-bottom: 0;
    }
    .applet .page02 .con{
        height: auto;
    }
    .applet .page03 .list {
        width: 100%;
        margin-right: 0;
        margin-bottom: 15px;
    }
    .applet .page03 .list:last-child{
        margin-bottom: 0;
    }
    .applet .page03 .list .texts{
        padding-left: 20px;
    }

    .app .page02 {
        padding: 30px 0;
    }
    .app .page02 .box {
        display: none;
    }
    .Cloudmode_pic span{
        display: flex;
        align-items: center;
    }
}