/*index-index*/
.i-mm{ display: none; }
.index-swiper .swiper-slide{ height: 100vh!important; }
.index-swiper .wrap{ position: relative; top: 50%; 
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%); }


.banner-index{ position: relative; z-index:9; padding-top: 72px; color: #fff; background: url("../images/index1-bg.webp") no-repeat center/cover; overflow: hidden;}
.banner-index .wrap{ padding: 150px 0 120px; text-align: center; z-index: 99;}
.i-bt{ position: relative; z-index: 9; font-size: 80px; }

.banner-index ul{ margin: 50px 0 60px; display: inline-block;}
.banner-index ul li{ width: 340px; height: 340px; padding-top: 60px; background: transparent;}
.banner-index ul li + li{ margin-left: -18px; }
.banner-index li i{ background-image: url("../images/index-yuan1.png");}
.banner-index .li2 i, .banner-index .li4 i{ background-image: url("../images/index-yuan2.png");}
.banner-index li span{ font-size: 108px;}
.banner-index li p{ font-size: 34px;}
.banner-index li b{ display: block; margin: 15px 0 10px; font-size: 52px;}
.banner-index .zixun{ display: block; width: 16em; line-height: 2.5em; margin: 0 auto; font-size: 32px; color: #fff; background: #000; border-radius: 0 0 20px; position: relative; z-index: 9;}
.banner-index .zixun i{ display: inline-block; margin-right: 0.4em; font-size: 1.5625em; vertical-align: middle; position: relative; top: -0.08em;}
.banner-index .zixun:hover{ background: #c8000a;}
.banner-index iframe,.banner-index video{ position: absolute; left: 50%; top: 50%; width: 140%; height: 140%; transform: translate(-50%,-50%); }

.i-animate{
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -ms-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
}
.banner-index li::before{
    -webkit-transition: all 2s ease;
    -moz-transition: all 2s ease;
    -ms-transition: all 2s ease;
    -o-transition: all 2s ease;
    transition: all 2s ease;
}
.banner-index .i-bt{ 
    opacity: 0;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}
.banner-index.swiper-slide-active .i-bt{ 
    opacity: 1;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0)
}
.banner-index.swiper-slide-active .li1::before,
.banner-index.swiper-slide-active .li3::before{
    -webkit-transform: rotate(-360deg);
    -moz-transform: rotate(-360deg);
    -ms-transform: rotate(-360deg);
    -o-transform: rotate(-360deg);
    transform: rotate(-360deg);
}
.banner-index.swiper-slide-active .li2::before,
.banner-index.swiper-slide-active .li4::before{
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
}

/*.banner-index li::before{display: none;}
.banner-index li i{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url("../images/index-yuan1.png") no-repeat center/contain; }*/

.index-case{ background: #000; overflow: hidden;}
.i-c-cont{ position: relative; top: 50%; 
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%); }
.i-case-item{ position: relative; width: 170%; left: 0; top: 0; height: 30vh; }
.i-case-item img{ width: auto; max-width: 500%; height: 100%; }
.i-case-item .pic2,.i-case-txt{ display: none;}
.i-case-item.item2,
.i-case-item.item4{ left: -25%;}
.i-case-item + .i-case-item{ margin-top: 1.817%;}
.i-case-item h2{ position: absolute; left: 14.46%; top: 50%; width: 27.68%; color: #fff; line-height: 1; margin-top: -40px; text-align: center; }
.i-case-item ul{ position: absolute; top: 0; width: 27.68%; left: 28.85%; height: 100%;}
.i-case-item li{ float: left; width: 48.052%; height: 100%; background: #fff; padding: 80px 30px 0; font-size: 20px; line-height: 1.7; border-radius: 0 0 30px;}
.i-case-item li + li{ margin-left: 3.896%;}
.i-case-item li .box{ position: relative;}
.i-case-item li .box::before{ position: absolute; content: ''; left: 0; top: -10px; width: 36px; height: 4px; background: #c8000a;}

.index-case.swiper-slide-active .item1,
.index-case.swiper-slide-active .item3{ 
    -webkit-transform: translateX(-12%);
    -moz-transform: translateX(-12%);
    -ms-transform: translateX(-12%);
    -o-transform: translateX(-12%);
    transform: translateX(-12%);
}
.index-case.swiper-slide-active .item2,
.index-case.swiper-slide-active .item4{ 
    -webkit-transform: translateX(10%);
    -moz-transform: translateX(10%);
    -ms-transform: translateX(10%);
    -o-transform: translateX(10%);
    transform: translateX(10%);
}
.banner-index.swiper-slide-active .i-bt{ 
    opacity: 1;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0)
}


.index-youshi{ position: relative; z-index: 9; padding: 180px 0 220px; color: #fff; background: url("../images/index3-bg.webp") no-repeat center/cover;}
.index-youshi h2{ margin-bottom: 100px; text-align: center;}
.index-youshi li{ position: relative; float: left; width: 20%;  border: 2px solid #515151; border-radius: 15px; overflow: hidden;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;}
.index-youshi li + li{ margin-left: -2px;}
.index-youshi .pic{}
.index-youshi .pic img{ display: block;}
.index-youshi .txt{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 40px 30px; }
.index-youshi .txt::before,
.index-youshi .txt h3::before{ content: ''; position: absolute; left: 0; top: 0; }
.index-youshi .txt::before{ display: none; width: 100%; height: 100%; background: rgba(106,117,132,.75); /*background: linear-gradient(45deg, rgba(0,0,0,.36) 15%, rgba(0,0,0,.0)); */}
.index-youshi .txt h3{ position: relative; padding-top: 1em; font-size: 36px; line-height: 1.25; margin-bottom: 1.7em;}
.index-youshi .txt h3::before{ width: 32px; height: 5px; background: #fff;}
.index-youshi .txt p{ position: relative; top: 30px; opacity: 0; font-size: 20px; line-height: 2;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;}
.index-youshi li:hover{ border-color: #fff; z-index: 2; box-shadow: 0 0 10px rgba(255, 255, 255, .8); }
.index-youshi li:hover .txt::before{ display: block;}


.index-foot{ background: #e5e5e5; padding-top: 20vh; }
.index-foot .wrap{ top: auto; 
    -webkit-transform: translateY(-0%);
    -moz-transform: translateY(-0%);
    -ms-transform: translateY(-0%);
    -o-transform: translateY(-0%);
    transform: translateY(-0%);}
.index-foot .swt{ display: none;}


@media (max-width: 1759px){
    /*index-index*/
    .i-bt{ font-size: 70px;}
    .banner-index ul li{ width: 270px; height: 270px; padding-top: 50px;}
    .banner-index li span{ font-size: 84px;}
    .banner-index li p{ font-size: 26px;}
    .banner-index li b{ font-size: 46px;}

    .i-case-item{ height: 28vh; }
    .i-case-item li{ padding-top: 70px;}

    .index-youshi .txt h3{ font-size: 32px;}
}
@media (max-width: 1559px){
    /*index-index*/
    .banner-index .wrap{ padding: 100px 0;}
    .i-bt{ font-size: 60px;}
    .banner-index ul li{ width: 250px; height: 250px; }
    .banner-index li span{ font-size: 76px;}
    .banner-index li p{ font-size: 24px;}
    .banner-index li b{ font-size: 40px; margin: 15px 0 5px;}

    /*.i-case-item{ height: 26vh; }*/
    .i-case-item li{ padding-top: 50px;}
    .index-case.swiper-slide-active .item2, .index-case.swiper-slide-active .item4{
        -webkit-transform: translateX(5.5%);
        -moz-transform: translateX(5.5%);
        -ms-transform: translateX(5.5%);
        -o-transform: translateX(5.5%);
        transform: translateX(5.5%);
    }

    .index-youshi{ padding: 140px 0 180px;}
    .index-youshi h2{ margin-bottom: 80px;}
    .index-youshi .txt{ padding: 40px 20px;}
    .index-youshi .txt h3{ font-size: 30px;}
}
@media (max-width: 1359px){
    /*index-index*/
    .banner-index .wrap{ padding: 90px 0;}
    .i-bt{ font-size: 50px;}
    .banner-index ul li{ width: 210px; height: 210px; padding-top: 35px; }
    .banner-index li span{ font-size: 70px;}
    .banner-index li p{ font-size: 22px;}
    .banner-index li b{ font-size: 32px; margin: 15px 0 5px;}

    .i-case-item{ height: 25vh;}
    .index-case.swiper-slide-active .item2, .index-case.swiper-slide-active .item4{
        -webkit-transform: translateX(3%);
        -moz-transform: translateX(3%);
        -ms-transform: translateX(3%);
        -o-transform: translateX(3%);
        transform: translateX(3%);
    }
    .i-case-item li{ padding: 30px 20px;}

    .index-youshi{ padding: 100px 0 140px;}
    .index-youshi h2{ margin-bottom: 60px;}
    .index-youshi .pic img{ height: 400px;}
    .index-youshi .txt{ padding: 40px 15px;}
    .index-youshi .txt h3{ font-size: 24px; margin-bottom: 30px; padding-top: 0.6em;}
    .index-youshi .txt p{ font-size: 17px;}
}


@media (max-width: 1159px){
   /*首页*/
   .i-mm{ display: block; }
   .index-header,.index-swiper{ display: none; }
   .i-m-banner img{ width: 100%; }
   .i-m-banner .swiper-pagination{ bottom: 0.3704rem!important; }
   .i-m-banner .swiper-pagination-bullet{ width: 0.3704rem; height: 2px; background: #fff; opacity: 1; margin: 0 0.1852rem!important;}
   .i-m-banner .swiper-pagination-bullet-active{ background: #c8000a;}

   .index-pro1{ margin-top: 1rem; background: url("../images/index-m-pro1-bg.jpg") repeat left top;}
   .index-pro1 ul{ padding: 0.43rem 0 0.272rem;}
   .index-pro1 li{ float: left; width: 24.203%;}
   .index-pro1 li + li{ margin-left: 1.0626%;}
   .index-pro1 img{ width: 100%; }
   .index-pro1 li p{ font-size: 0.321rem; margin-top: 0.2716rem; color: #fff; text-align: center;}

   .index-pro2{ padding-top: 1.1358rem;}
   .i-m-tit{ margin-bottom: 0.4815rem; font-size: 0.6173rem; text-align: center; color: #444; }
   .index-pro2 .swiper-container{ border-radius: 0.2469rem; overflow: hidden;}
   .index-pro2 .swiper-slide a{ position: relative; display: block; }
   .index-pro2 .swiper-slide img{ width: 100%; }
   .index-pro2 .swiper-slide p{ position: absolute; bottom: 0; left: 0; width: 100%; font-size: 0.3704rem; line-height: 2.3; padding: 0 0.3704rem; color: #fff; background: rgba(0,0,0,.8);}
   .index-pro2 .swiper-slide p i{ display: inline-block; font-size: 0.284rem; margin-left: 0.1rem;}
   .index-pro2 .swiper-pagination{ bottom: 1.33rem!important;}

   .index-other{ padding-top: 1.23457rem;}
   .index-other ul{ margin: 0 -0.2137rem;}
   .index-other li{ float: left; width: 50%; padding: 0 0.2137rem;}
   .index-other li a{ display: block; position: relative;}
   .index-other img{ width: 100%; }
   .index-other li .txt{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding-top: 1.321rem; text-align: center;}
   .index-other li h2{ position: relative; padding-bottom: 0.12346rem; font-size: 0.49383rem; color: #313131;}
   .index-other li h2::before{ content: ''; position: absolute; left: 50%; bottom: 0; width: 0.49383rem; height: 0.0371rem; background: #c8000a;  margin-left: -0.246915rem;}
   .index-other li p{ font-size: 0.24691rem; line-height: 1.3; margin-top: 0.246rem;}
   .index-other li + li p{ line-height: 2.6;}

   .index-pro3{ padding: 1.23457rem 0;}
   .index-pro3 li + li{ margin-top: 0.49383rem;}
   .index-pro3 li a{ display: block; position: relative; border-radius: 0.2469rem; overflow: hidden;}
   .index-pro3 img{ width: 100%; }
   .index-pro3 li .txt{ position: absolute; bottom: 0.4814rem; left: 0; width: 100%; padding: 0 0.54321rem; color: #fff;
       text-shadow: 0px 0px 0.1605rem rgba(0, 0, 0, 0.99);}
   .index-pro3 li h3{ font-size: 0.6173rem;}
   .index-pro3 li p{ font-size: 0.3704rem; font-weight: bold; margin-top: 0.1852rem;}
}