html, body {
    height: 100%;
}

.cover_box {
    width: 100%;
    margin-top: 70px;
}
/*banner*/
.jiansheBanner{
    position: relative;
    height: calc(100vh - 70px);
    overflow: hidden;
}
.jiansheBanner .jiansheBannerWz{
    position: absolute;
    z-index: 1000;
    top: 50%;
    left: 14%;
    margin-top: -116px;
}
.jiansheBanner .swiper-container{
    height: 100%;
}
.jiansheBanner .swiper-slide .jiansheBannerWz >h2{
    font-size: 50px;
    font-weight: bold;
    margin-bottom: 10px;
    color: #fff;
}
.jiansheBanner .swiper-slide .jiansheBannerWz >p{
    font-size: 24px;
    color: #fff;
}

.jiansheBanner .swiper-slide .jiansheBannerWz .btns {
    font-size: 19px;
    width: 220px;
    height: 46px;
    line-height: 44px;
    border: 1px solid #fff;
    border-radius: 50px;
    color: #fff;
    display: block;
    text-align: center;
    margin-top: 40px;

}
.jiansheBanner .swiper-slide{
    overflow: hidden;
}

.jiansheBanner .swiper-pagination .swiper-pagination-bullet{
    display: inline-block;
      width: 10px;
      height: 10px;
      background-color: #fff;
      opacity: .8;
      margin: 0px 1px;
      cursor: pointer;
      border-radius: 5px;
      transition: .3s;
}
.jiansheBanner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{
    width: 22px;
}

#page {
    width: 180px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    text-align: left;
    bottom: 45px;
    box-sizing: border-box;
    text-align: center;
    z-index: 200;
}

#page span {
    display: inline-block;
    width: 22px;
    height: 10px;
    background: url(/static/xxyc/images/icon_07.png) center no-repeat;
    opacity: .8;
    margin: 0px 1px;
    cursor: pointer;
    border-radius: 5px;
    transition: .3s;
}

#page span.swiper-pagination-bullet-active {
    background: url(/static/xxyc/images/icon_09.png) center no-repeat;
}

#button {
    width: 260px;
    height: 30px;
    position: absolute;
    bottom: 35px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 100;
}

#button .swiper-button-prev:after {
    content: "";
    width: 11px;
    height: 19px;
    background: url(/static/xxyc/images/icon_03.png);
    opacity: .8;
}

#button .swiper-button-prev {
    outline: none;
}

#button .swiper-button-next:after {
    content: "";
    width: 11px;
    height: 19px;
    background: url(/static/xxyc/images/icon_05.png);
    opacity: .8;
}

#button .swiper-button-next {
    outline: none;
}

#container {
    width: 1201px;
    margin: 0 auto;
    margin-top: 0px;
    margin-top: 10px;
}

/*.shi {*/
/*    margin-top: 70px;*/
/*}*/

/*.tt {*/
/*    color: #000000;*/
/*    font-size: 30px;*/
/*    text-align: center;*/
/*}*/

/*.tt span {*/
/*    color: #215aff;*/
/*}*/

/*.tt strong {*/
/*    display: block;*/
/*    font-size: 14px;*/
/*    color: #989898;*/
/*    font-weight: 500;*/
/*    text-align: center;*/
/*    padding-top: 5px;*/
/*}*/

/*.shi .content {*/
/*    padding-top: 46px;*/
/*}*/

/*.pai1 {*/
/*    width: 236px;*/
/*    height: 298px;*/
/*    position: relative;*/
/*    float: left;*/
/*    background: url(/static/xxyc/images/1.png) no-repeat center 30px;*/
/*    z-index: 99999;*/
/*    border: 1px solid #e3e3e3*/
/*}*/

/*.pai1 h3 {*/
/*    color: #000000;*/
/*    font-size: 18px;*/
/*    padding-top: 128px;*/
/*    text-align: center;*/
/*    font-weight: normal;*/
/*}*/

/*.pai1 p {*/
/*    text-align: center;*/
/*    padding-top: 46px;*/
/*    text-align: center;*/
/*    font-size: 12px;*/
/*    color: #999999*/
/*}*/

.shang {
    position: absolute;
    top: -1500px;
    width: 238px;
    height: 253px;
    display: block;
    background: url(/static/xxyc/images/t.png) no-repeat;;
}

/*.pai1:hover {*/
/*    background: url(/static/xxyc/images/11.png) no-repeat center 30px #215aff*/
/*}*/

/*.pai1:hover .shang {*/
/*    top: -240px;*/
/*    transition: 0.8s;*/
/*}*/

/*.pai1:hover h3 {*/
/*    color: #fff*/
/*}*/

/*.pai1:hover p {*/
/*    color: #fff*/
/*}*/

.shang h4 {
    height: 71px;
    color: #666;
    font-size: 12px;
    line-height: 30px;
    padding-top: 10px;
    font-weight: 400
}

.shang h4 strong {
    padding: 3px;
    border: 1px solid #aeaeae;
    margin-right: 3px;
    font-weight: 400
}

.shang h4 span {
    display: block;
}

/*.shou {*/
/*    background: url(/static/xxyc/images/2.png) no-repeat center 30px;*/
/*    margin-left: 3px;*/
/*}*/

/*.shou:hover {*/
/*    background: url(/static/xxyc/images/22.png) no-repeat center 30px #215aff;*/
/*}*/

/*.app {*/
/*    background: url(/static/xxyc/images/3.png) no-repeat center 30px;*/
/*    margin-left: 3px;*/
/*}*/

/*.app:hover {*/
/*    background: url(/static/xxyc/images/33.png) no-repeat center 30px #215aff;*/
/*}*/

/*.wei {*/
/*    background: url(/static/xxyc/images/4.png) no-repeat center 30px;*/
/*    margin-left: 3px;*/
/*}*/

/*.wei:hover {*/
/*    background: url(/static/xxyc/images/44.png) no-repeat center 30px #215aff;*/
/*}*/

/*.zui {*/
/*    background: url(/static/xxyc/images/5.png) no-repeat center 30px;*/
/*    float: right;*/
/*}*/

/*.zui:hover {*/
/*    background: url(/static/xxyc/images/55.png) no-repeat center 30px #215aff;*/
/*}*/

.clearboth {
    height: 0px;
    line-height: 0px;
    overflow: hidden;
    clear: both;
    font-size: 0px;
}

a:link {
    color: #666;
}

.more {
    display: block;
    width: 94px;
    height: 31px;
    border: 1px solid #b2b1b2;
    line-height: 31px;
    text-align: center;
    margin: 0 auto;
    margin-top: 0px;
    margin-top: 30px;
}


.index_lr {
    width: 100%;
    height: 450px;
    background: url(/static/xxyc/images/indexlogobg.jpg);
    box-sizing: border-box;
    padding-top: 42px;
    margin-top: 50px;
}

.jiansheThree {
    background: url(/static/xxyc/images/youshibanner.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin-top: -140px;
    height: 670px;
}

.jiansheThree .bounceInRightBox {
    margin-top: 194px;
}

.jiansheThree .bounceInRightBox .bounceInRight {
    width: 50%;
}
.jiansheThree .bounceInRightBox .bounceInRight .bounceInRightCon{
    font-size: 24px;
    color: #FFFFFF;
    margin: 0 0 20px 0;
    font-weight: bold;
    display: flex;
    align-items: center;
    font-family: "Arial", "Microsoft YaHei", "黑体", "宋体", sans-serif;
}
.jiansheThree .bounceInRightBox .bounceInRight .bounceInRightCon span{
    font-size: 0.46rem;
    color: orange;
    font-style: italic;
    margin-right: 14px;
}
.jiansheThree .bounceInRightBox .bounceInRight .bounceInRightCon:nth-child(2){
    margin-left: 70px;
}
.jiansheThree .bounceInRightBox .bounceInRight .bounceInRightCon:nth-child(3){
    margin-left: 140px;
}
.jiansheThree .bounceInRightBox .bounceInRight .bounceInRightCon:nth-child(4){
    margin-left: 210px;
}
.jiansheThree .bounceInRightBox .bounceInRight .bounceInRightCon:nth-child(5){
    margin-left: 280px;
}

.container {
    width: 1230px;
    margin: 0 auto;
}

.lr_l {
    float: left;
}

.lr_r {
    width: 650px;
    float: right;

}

.taocan_titleI {
    font-size: 33px;
    font-weight: bold;
    color: #FFFFFF;
    margin-bottom: 15px;
}

.taocan_titleI-2 {
    font-size: 15px;
    color: #FFFFFF;
    line-height: 27px;
}

.index_lc {
    padding: 0px 0px 60px 0px;
    overflow: hidden;
}

.work2 {
    text-align: center;
    color: #1f1f1f;
    font-size: 30px;
    padding-top: 10px;
    height: 50px;
    font-weight: bold;
    line-height: 40px;
}

.work2 .s1 {
    color: #000000;
    font-size: 30px;
    padding: 0 5px;
}

.work2 .s2 {
    color: #215aff;
}

.work2-des {
    color: #989898;
    font-size: 14px;
    text-align: center;
    margin: 5px auto;
    height: 30px;
    font-weight: 500;
}

.index_center {
    text-align: center;
}

.index_center .ul {
    display: inline-block;
}

.liuchengBox {
    display: flex;
    justify-content: center;
}

.liuchengDiv {
    width: 200px;
    margin-right: 44px;
    color: #454545;
    float: left;
    text-align: center;
    margin-top: 50px;
}

.liucheng-text {
    font-size: 18px;
    color: #000;
    font-weight: bold;
}


/*****企业建站购买部分修改*****/
.website-main-l {
    background-color: #f5f5f5;
    padding: 55px 0;
}

.w-1200 {
    width: calc(78% - 0.3rem);
    margin: 0 auto;
    position: relative;
}


.g-tac {
    text-align: center;
    margin-top: 60px;
}

.jiansheTwo {
    background-image: url("../images/fwbanner1.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding-bottom: 178px;
}

.jiansheTwo .jiansheTwoCon {
    background-image: url("../images/fwbanner.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: 70px 0;
    width: calc(78% - 0.3rem);
}

.jiansheTwoCon .jiansheTwoConUl {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 50px;
}

.g-box {
    width: 1224px;
    height: 100%;
    margin: 0 auto;
}

.g-mt40 {
    margin-top: 40px;
}

.f-oh {
    overflow: hidden;
}


.wmxiao-two li {
    float: left;
    width: 385px;
    height: 144px;
    margin: 10px 11.5px; /*background:#f7f7f9;box-shadow:4px 3px 13px 0 rgba(56,67,135,.11);-webkit-box-shadow:4px 3px 13px 0 rgba(56,67,135,.11);-moz-box-shadow:4px 3px 13px 0 rgba(56,67,135,.11);border-radius:4px*/
}

.wmxiao-two .img {
    margin: 38px 32px 0 28px;
    transition: all ease-in-out 0.4s;

}

.wmxiao-two p.one {
    font-size: 20px;
    color: #313133;
    line-height: 20px;
    margin-top: 35px
}

.wmxiao-two p.two {
    font-size: 14px;
    color: #686868;
    margin-top: 17px
}

.wmxiao-two .img1 {
    background: url("/static/xxyc/images/wz1.png") no-repeat;
    width: 80px;
    height: 70px;
    background-size: contain;
}

.wmxiao-two .img2 {
    background: url("/static/xxyc/images/wz2.png") no-repeat;
    width: 80px;
    height: 70px;
    background-size: contain;
}

.wmxiao-two .img3 {
    background: url("/static/xxyc/images/wz3.png") no-repeat;
    width: 80px;
    height: 70px;
    background-size: contain;
}

.wmxiao-two .img4 {
    background: url("/static/xxyc/images/wz4.png") no-repeat;
    width: 80px;
    height: 70px;
    background-size: contain;
}

.wmxiao-two .img5 {
    background: url("/static/xxyc/images/wz5.png") no-repeat;
    width: 80px;
    height: 70px;
    background-size: contain;
}

.wmxiao-two .img6 {
    background: url("/static/xxyc/images/wz6.png") no-repeat;
    width: 80px;
    height: 70px;
    background-size: contain;
}

.wmxiao-two .img1:hover {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
}

.wmxiao-two .img2:hover {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
}

.wmxiao-two .img3:hover {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
}

.wmxiao-two .img4:hover {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
}

.wmxiao-two .img5:hover {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
}

.wmxiao-two .img6:hover {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
}

.gray62 {
    color: #626262;
}

.l-h24 {
    line-height: 24px;
}

.s-fs24 {
    font-size: 24px;
}

.gray90 {
    color: #909099;
}

.l-h18 {
    line-height: 18px;
}

.g-mt10 {
    margin-top: 10px;
}

.s-fs18 {
    font-size: 18px;
}

.f-fl {
    float: left;
}

.g-tal {
    text-align: left;
}

/*模板展示*/
#templateContainer{
    width: 100%;
    max-width: 100%;
    background-image: url("../images/jmmbbj.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    padding: 0.8rem 0
}
#templateContainer .work2{
    color: #fff;
}
.shangpinBox {
    width: calc(78% - 0.3rem);
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    position: relative;
}


.shangpinBox .gengduoMoban {
    position: absolute;
    bottom: 0px;
    left: 42%;
    display: inline-block;
    width: 184px;
    height: 54px;
    border: 1px solid #2f82ff;
    border-radius: 40px;
    text-align: center;
    line-height: 54px;
    font-size: 16px;
}

.gengduoMoban a {
    color: #2f82ff;
}

@keyframes text-jump {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
    /* 文字下移 */
    100% {
        transform: translateY(0);
    }
}

.shangpinBox .gengduoMoban:hover {
    background-color: #2f82ff;
    animation: text-jump 0.7s ease-in-out infinite; /* 动画持续时间、缓动函数和无限循环 */
}

.shangpinBox .gengduoMoban:hover a {
    color: #fff;
}
.web-footer{
    margin-top: 0!important;
}
/*jiansheOne*/
.jiansheOne {
    width: calc(78% - 0.3rem);
    margin: 64px auto 0;
}

.jiansheOne > h2 {
    font-size: 0.4rem;
    line-height: 48px;
    color: #353030;
    text-align: center;
    font-weight: bold;
}

.jiansheOne > p {
    font-size: 20px;
    line-height: 22px;
    color: rgba(53, 48, 48, 0.7);
    margin-top: 8px;
    text-align: center;
}

.jiansheOneUl {
    margin-top: 40px;
    display: flex;
    justify-content: center;
}

.jiansheOneUl li {
    padding: 78px 33px 60px;
    width: 344px;
    background-image: url("../images/jianzhnone.png");
    background-position: top;
    background-size: 100% 100%;
    margin-right: 4%;
    /*height: 400px;*/
    transition: all .4s;
}
.jiansheOneUl li:last-child{
    margin-right: 0;
}

.jiansheOneUl li:nth-child(2n) {
    background-image: url("../images/jianzhantwo.png");
}

.jiansheOneUl li .jiansheOneUlImg {
    margin-bottom: 78px;
    width: 78px;
    display: flex;
    justify-content: center;
}

.jiansheOneUl li .jiansheOneUlImg img {
    width: 42px;
    transition: all .4s;
}
.jiansheOneUl li .jiansheOneUlImg img:hover{
    transform: scale(1.1);
}
.indexOneUlJt {
    text-align: right;
    margin-top: 10px;
    width: 92%;
}

.indexOneUlJt img {
    width: 30px;
}

.jiansheOneUl li .jiansheOneUlBot .jiansheOneUlBotTit {
    color: #000;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 8px;
}

.jiansheOneUl li .jiansheOneUlBot .jiansheOneUlBotCon {
    color: #000;
    font-size: 16px;
    line-height: 2;
}


/*企业建站选购 */
.jzPricce {
    background-color: #fff;
}

.jzPricce .jzPricceUl {
    display: flex;
    margin-top: 60px;
    justify-content: center;
    flex-wrap: wrap;
}

.jzPricce .jzPricceUl > li {
    margin: 0 .4rem 0 0;
    padding: .3rem;
    background-image: url("../images/price1.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: calc((100% - 2rem) / 4);
}

.jzPricce .jzPricceUl > li:nth-child(2) {
    background-image: url("../images/price2.png");
}

.jzPricce .jzPricceUl > li:nth-child(3) {
    background-image: url("../images/price3.png");
}

.jzPricce .jzPricceUl > li:nth-child(4) {
    background-image: url("../images/price4.png");
}
.jzPricce .jzPricceUl > li .jzPricceUlTopName{
    font-size: 20px;
    color: #fff;
    font-weight: bold;
}
.jzPricce .jzPricceUl > li .jzPricceUlTopJs{
    color: #fff;
    margin-top: 6px;
    font-size: 12px;
    line-height: 20px;
}
.jzPricce .jzPricceUl > li .jzPricceUlTopPrice{
    color: #fff;
    margin: 20px 0 26px;
}
.jzPricce .jzPricceUl > li .jzPricceUlTopPrice p{
    font-weight: bold;
    font-size: 17px;
    letter-spacing: 3px;
    display: block;
    position: relative;
    margin-bottom: 4px;
}
.jzPricce .jzPricceUl > li .jzPricceUlTopPrice p:first-child .jzhdj{
    background-color: #ff1414;
    color: #fff;
    padding: 4px 4px 4px 8px;
    border-radius: 6px;
    font-size: 12px;
    position: relative;
    margin-left: 20px;
    animation: price 2s ease-in-out infinite alternate;
}
@keyframes price {
    0%{
        transform: translateX(0);
    }
    50%{
        transform: translateX(-10px);
    }
    100%{
        transform: translateX(0);
    }
}
.jzPricce .jzPricceUl > li .jzPricceUlTopPrice p .hdPrice{
    font-size: 22px;
    margin-right: 6px;
}
.jzPricce .jzPricceUl > li .jzPricceUlTopPrice p:nth-child(1){
    display: flex;
    align-items: center;
}
.jzPricce .jzPricceUl > li .jzPricceUlTopPrice p .jzhdj::after{
    content: '';
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-right: 12px solid #ff1414;
    position: absolute;
    left: -10px;
    top: 5px;
}
.jzPricce .jzPricceUl > li .jzPricceUlTopDz{
    display: block;
    width: 100%;
    background-image: url("../images/priceone.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    color: #000;
    text-align: center;
    line-height: 56px;
    font-weight: bold;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}
.jzPricce .jzPricceUl > li .jzPricceUlTopDz img{
    width: 26px;
    margin-right: 6px;
    animation: jzPricceUlTopDzImg 2s ease-in-out infinite;;
}
@keyframes jzPricceUlTopDzImg {
    0%{
        transform: scale(1);
    }
    50%{
        transform: scale(1.3);
    }
    100%{
        transform: scale(1);
    }
}

.jzPricce .jzPricceUl > li .jzPricceUlTopDzTs{
    background-image: url("../images/pricetwo.png");
}
.jzPricceUlBot{
    margin-top: 20px;
}
.jzPricceUlBot li {
    margin: 10px 0;
}
.jzPricceUlBot li span{
    display: inline-block;
}
.jzPricceUlBot li span:first-child{
    width: 87px;
}
.jzPricceUlBot li span img{
    width: 14px;
}
.jzPricceUlBot li span:last-child{
    width: calc(100% - 94px);
    text-align: right;
}

.jiansheMoban .shangpinBox{
    width: 100%;
    overflow: hidden;
}
.jiansheMoban .shangpinBox .list{
    width: calc(424px * 10 + 24px * 9);
    animation: right-effect 30s linear infinite;
    display: flex !important;
    margin-top: 64px;
}
.jiansheMoban .shangpinBox .list a{
    display: block;
    width: 424px;
    margin-right: 24px;
    height: 224px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 16px;
    transition: transform 400ms ease-out;
}
.jiansheMoban .shangpinBox .list.listLeft{
    animation: left-effect 30s linear infinite;
}
.jiansheMoban .shangpinBox .list:hover{
    animation-play-state: paused;
}
@keyframes left-effect {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}
@keyframes right-effect {
    0% {
        transform: translateX(-50%);
    }
    100% {
        transform: translateX(0);
    }
}