﻿@charset "utf-8"; /* CSS Document */
body {
    max-width: 750px;
    background: #ffffff;
}

.swiper-pagination-bullet {
    opacity: 1;
}

.no-animate {
    opacity: 0;
}

@-webkit-keyframes fadeInDown2 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-50%,0);
        transform: translate3d(0,-50%,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInDown2 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-50%,0);
        transform: translate3d(0,-50%,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInDown2 {
    -webkit-animation-name: fadeInDown2;
    animation-name: fadeInDown2
}

@-webkit-keyframes fadeInLeftDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%,0,0);
        transform: translate3d(-50%,0,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInLeftDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%,0,0);
        transform: translate3d(-50%,0,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInLeftDown {
    -webkit-animation-name: fadeInLeftDown;
    animation-name: fadeInLeftDown
}

@-webkit-keyframes fadeInUp2 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,20px,0);
        transform: translate3d(0,20px,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInUp2 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,20px,0);
        transform: translate3d(0,20px,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInUp2 {
    -webkit-animation-name: fadeInUp2;
    animation-name: fadeInUp2
}

@-webkit-keyframes fadeOutUp2 {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0,-20px,0);
        transform: translate3d(0,-20px,0)
    }
}

@keyframes fadeOutUp2 {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0,-20px,0);
        transform: translate3d(0,-20px,0)
    }
}

.fadeOutUp2 {
    -webkit-animation-name: fadeOutUp2;
    animation-name: fadeOutUp2
}

@-webkit-keyframes fadeInLeft2 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-60px,0,0);
        transform: translate3d(-60px,0,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInLeft2 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-60px,0,0);
        transform: translate3d(-60px,0,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInLeft2 {
    -webkit-animation-name: fadeInLeft2;
    animation-name: fadeInLeft2
}

@-webkit-keyframes fadeInRight2 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(60px,0,0);
        transform: translate3d(60px,0,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInRight2 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(60px,0,0);
        transform: translate3d(60px,0,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInRight2 {
    -webkit-animation-name: fadeInRight2;
    animation-name: fadeInRight2
}

@-webkit-keyframes fadeOutRight2 {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(60px,0,0);
        transform: translate3d(60px,0,0)
    }
}

@keyframes fadeOutRight2 {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(60px,0,0);
        transform: translate3d(60px,0,0)
    }
}

.fadeOutRight2 {
    -webkit-animation-name: fadeOutRight2;
    animation-name: fadeOutRight2
}

@-webkit-keyframes fadeInLeft3 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0%,0,0);
        transform: translate3d(0%,0,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInLeft3 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0%,0,0);
        transform: translate3d(0%,0,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInLeft3 {
    -webkit-animation-name: fadeInLeft3;
    animation-name: fadeInLeft3
}

@-webkit-keyframes fadeInRight3 {
    0% {
        opacity: 1;
        -webkit-transform: translate3d(100%,0,0);
        transform: translate3d(100%,0,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInRight3 {
    0% {
        opacity: 1;
        -webkit-transform: translate3d(100%,0,0);
        transform: translate3d(100%,0,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInRight3 {
    -webkit-animation-name: fadeInRight3;
    animation-name: fadeInRight3
}

@-webkit-keyframes fadeInDown3 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-60px,0);
        transform: translate3d(0,-60px,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInDown3 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-60px,0);
        transform: translate3d(0,-60px,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInDown3 {
    -webkit-animation-name: fadeInDown3;
    animation-name: fadeInDown3
}

@-webkit-keyframes fadeInHeight {
    0% {
        opacity: 0;
        transform: scale(0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInHeight {
    0% {
        opacity: 0;
        transform: scale(0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInHeight {
    -webkit-animation-name: fadeInHeight;
    animation-name: fadeInHeight
}

@-webkit-keyframes fadeInUp3 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,30%,0);
        transform: translate3d(0,30%,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInUp3 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,30%,0);
        transform: translate3d(0,30%,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInUp3 {
    -webkit-animation-name: fadeInUp3;
    animation-name: fadeInUp3
}

@-webkit-keyframes fadeInwidth2 {
    0% {
        opacity: 0;
        width: 0%;
    }

    100% {
        opacity: 1;
        width: 100%;
    }
}

@keyframes fadeInwidth2 {
    0% {
        opacity: 0;
        width: 0%;
    }

    100% {
        opacity: 1;
        width: 100%;
    }
}

.fadeInwidth2 {
    -webkit-animation-name: fadeInwidth2;
    animation-name: fadeInwidth2
}

@-webkit-keyframes flip_x {
    0% {
        -webkit-transform: perspective(4000px) rotate3d(0,1,0,-360deg);
        transform: perspective(4000px) rotate3d(0,1,0,-360deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    40% {
        -webkit-transform: perspective(4000px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);
        transform: perspective(4000px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    50% {
        -webkit-transform: perspective(4000px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);
        transform: perspective(4000px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    80% {
        -webkit-transform: perspective(4000px) scale3d(.95,.95,.95);
        transform: perspective(4000px) scale3d(.95,.95,.95);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    100% {
        -webkit-transform: perspective(4000px);
        transform: perspective(4000px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
}

@keyframes flip_x {
    0% {
        -webkit-transform: perspective(4000px) rotate3d(0,1,0,-360deg);
        transform: perspective(4000px) rotate3d(0,1,0,-360deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    40% {
        -webkit-transform: perspective(4000px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);
        transform: perspective(4000px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    50% {
        -webkit-transform: perspective(4000px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);
        transform: perspective(4000px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    80% {
        -webkit-transform: perspective(4000px) scale3d(.95,.95,.95);
        transform: perspective(4000px) scale3d(.95,.95,.95);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    100% {
        -webkit-transform: perspective(4000px);
        transform: perspective(4000px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
}

@-webkit-keyframes slideOutDown_s {
    0% {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        opacity: 1;
    }

    50% {
        visibility: hidden;
        -webkit-transform: translate3d(0,20px,0);
        transform: translate3d(0,20px);
        opacity: 0;
    }

    100% {
        visibility: hidden;
        -webkit-transform: translate3d(0,0px,0);
        transform: translate3d(0,0px);
        opacity: 1;
    }
}

@keyframes slideOutDown_s {
    0% {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        opacity: 1;
    }

    50% {
        visibility: hidden;
        -webkit-transform: translate3d(0,20px,0);
        transform: translate3d(0,20px,0);
        opacity: 0;
    }

    100% {
        visibility: hidden;
        -webkit-transform: translate3d(0,0px,0);
        transform: translate3d(0,0px,0);
        opacity: 1;
    }
}

.animated.fadeOutRight2 {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.animated.fadeInRight2 {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.animated.fadeInRight3 {
    -webkit-animation-duration: 0.3s;
    animation-duration: 0.3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

@keyframes flips {
    0% {
        -webkit-transform: perspective(4000px) rotate3d(0,1,0,-180deg);
    }

    100% {
        -webkit-transform: perspective(4000px) rotate3d(0,1,0,0deg);
    }
}

@keyframes flipright {
    0% {
        -webkit-transform: perspective(4000px) rotate3d(0,1,0,180deg);
    }

    100% {
        -webkit-transform: perspective(4000px) rotate3d(0,1,0,0deg);
    }
}


.s_h_footer {
    padding-top: 0.1rem !important;
}



.foot {
    background: url(/asset/images/foots_02.jpg) no-repeat center;
    height: 1.2rem;
    background-size: 100% 100%;
    margin-top: -1px;
}

.foot ul {
    display: grid;
    grid-template-columns: repeat(5,1fr);
}

.foot li {
    height: 1.2rem;
}

.foot li a {
    display: block;
    height: 100%;
}

.foot{/* width:93.75%; */background: #000;/* height:.94rem; */background-size:100% 100%;margin:0 auto;}
.foot li a{display:block;height:100%;background: url(/asset/images/t1.png) no-repeat center top .28rem;background-size: .29rem auto;}
.foot li a::after{content:"首页";display:block;text-align:center;padding-top: .4rem;color:#fff;font-size:.2rem;}
.foot li:nth-child(2) a{background-image:url(/asset/images/t2.png);}
.foot li:nth-child(2) a::after{content:"服务";}
.foot li:nth-child(3) a{background-image:url(/asset/images/t3.png);}
.foot li:nth-child(3) a::after{content:"案例";}
.foot li:nth-child(4) a{background-image:url(/asset/images/t4.png);}
.foot li:nth-child(4) a::after{content:"地址";}
.foot li:nth-child(5) a{background-image:url(/asset/images/t5.png);}
.foot li:nth-child(5) a::after{content:"联系";}

.s_h_jiejue{width:100%;overflow:hidden;}








.main_w{padding:0 .4rem;}


.s_ban{width:100%;overflow:hidden;background:url(../images/home-sj.jpg) no-repeat center;height:3.9rem;background-size:cover;}
.s_ban a{display:block;width:1.86rem;height:0.6rem;background:url(../images/q1.png) no-repeat center;background-size:100%;margin-top: 2.95rem;margin-left: 1.87rem;line-height:0.6rem;text-align:center;font-size:0.3rem;color:#fff;transition: 0.3s ease background,0.3s ease color;}
.s_ban a:hover{background-image:url(/asset/images/q2.png);color:#fff;}
.cdsa{width:100%;overflow:hidden;background:#eaf2ff;}
.titles{padding-top:0.56rem;overflow:hidden;text-align:center;padding-bottom:0.7rem;}
.titles font{color:#3a3a3a;font-size:0.36rem;text-align: center;display:inline-block;padding-left:0.6rem;padding-right:0.6rem;position:relative;line-height:1;font-weight:bold;}
.titles font::before{position:absolute;right:0px;top:0px;background:url(../images/k2.png) no-repeat left center;width:0.32rem;height:0.36rem;content:"";display:block;background-size:cover;}
.titles font::after{position:absolute;left:0px;top:0px;background:url(../images/k3.png) no-repeat left center;width:0.35rem;height:0.35rem;content:"";display:block;background-size:cover;}

.xtjs_quan{display:grid;grid-template-columns: auto ;overflow:hidden;padding-bottom:.35rem;line-height:0.35rem;font-size:0.24rem;gap:0.3rem;line-height:1.6;}
.xtjs_left ul li{position:relative;padding-left:0.25rem;}
.xtjs_left ul li::after{position:absolute;left:0.07rem;top:calc(50% - 0.04rem);content:"";display:block;width:0.08rem;height:0.08rem;background:#ff9000;border-radius:50%;}
.xtjs_quan .jiac{color:#246ada;font-weight:bold;}


.xyon{width:100%;overflow:hidden;}
.xyon .jbie{width:100%;text-align:center;padding-bottom:.6rem;}
.xyon .jbie ul{display:grid;grid-template-columns: repeat(3,1fr);gap:0.3rem .4rem;}
.xyon .jbie li{position:relative;top:0rem;left:0rem;transition: 0.3s ease top;cursor: pointer;}
.xyon .jbie li img{width:.9rem;}
.xyon .jbie li:hover{top:-0.2rem;}
.xyon .jbie li font{display:block;font-size:0.22rem;padding-top:0.15rem;padding-bottom:0.1rem;}
.xyon .jbie li p{color:#3a3a3a;font-size:0.18rem;line-height:1.71;}


.wtis{width:100%;overflow:hidden;background:url(../images/k4.jpg) no-repeat center;background-size:cover;padding-bottom:.79rem;}
.wtis .title{width:100%;text-align:center;color:#ffffff;font-size:0.36rem;padding-top:0.8rem;font-weight:bold;}
.wtis .nrtit{width:100%;overflow:hidden;text-align:center;font-size:0.2rem;color:#ffffff;padding-top:0.1rem;}
.wtis .list{width:100%;overflow:hidden;padding-top:0.9rem;}
.wtis .list ul{display:flex;grid-template-columns: repeat(2,1fr);gap:.3rem;flex-wrap: wrap;justify-content: center;}
.wtis .list li{overflow:hidden;width:2.5rem;height:3.25rem;background:url(../images/k4.png) no-repeat;background-size:100%;position:relative;top:0rem;left:0rem;transition: 0.3s ease top;cursor: pointer;}
.wtis .list li img{width:1.26rem;}
.wtis .list li:hover{top:-0.2rem;}
.wtis .list li div{text-align:center;padding-top:0.25rem;}
.wtis .list li font{font-size:0.22rem;text-align:center;display:block;color:#262626;font-weight:bold;}
.wtis .list li p{padding:0 0.19rem;line-height:1.9;padding-top:0.12rem;font-size:.18rem;}
.wtis .list li:nth-child(3) p{padding:0 0.12rem;padding-top:0.12rem;}

.qidai{width:100%;overflow:hidden;background:url(../images/k5.jpg) no-repeat center;height:2.64rem;text-align:center;display:flex;align-items: center;}
.qidai .di{font-size:0.36rem;color:#3a3a3a;font-weight:bold;}
.qidai .di2{text-align:center;padding-top:0.3rem;}
.qidai .di2 a{font-size:0.3rem;display:inline-block;width:2.31rem;height:0.67rem;background:url(/asset/images/c1.png) no-repeat center;color:#fafafa;line-height:0.67rem;background-size: auto .67rem;}