.view_more {
    width: 10rem;
    height: 2.5rem;
    line-height: 2.5rem;
    text-align: center;
    background: var(--comcolor);
    color:#fff;
}
.view_more a{
    color:#fff;
}



.index_banner {
    width:100%;
    height:100vh;
    position: relative;
    overflow: hidden;
}

.index_banner .swiper-slide img {
    width:100%;
    height:100vh;
}

.index_banner .mouse {
    position: absolute;
    left:15%;
    bottom: calc(10% + 1.25rem);
    z-index: 999;
    display: flex;
    align-items: center;
    color:#fff;
}
.index_banner .mouse .mouseOf {
    height: 28px;
    position: relative;
    width: 28px;
    display: block;
    margin-right: 0.5rem;
}
.index_banner .mouse .mouseOf svg {
    width:100%;
    height:100%;
    display: block;
}
.index_banner .mouse .mouseOf:after {
    -webkit-animation: scroll-down 1.5s ease-in-out infinite;
    animation: scroll-down 1.5s ease-in-out infinite;
    background-color: #fff;
    border-radius: 2px;
    content: "";
    height: 7px;
    left: 50%;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 2px
}
@keyframes scroll-down {
    0% {
        opacity: 0;
        top: 2px
    }
    30%,70% {
        opacity: 1
    }
    to {
        opacity: 0;
        top: calc(100% - 9px)
    }
}


@media  screen and (max-width: 1000px){
    .index_banner,.index_banner .swiper-slide img  {
        height:auto;
        display: block;
    }
}









.index_products {width: 100%;padding:5rem 0;background: #595959;overflow: hidden;}
.index_products .cont {height:100%; display: flex; justify-content: space-between;align-items: center; }
.index_products .box1 {width:30%;}
.index_products .title .name { font-size: 3.5rem;font-weight: 800;color:#fff;}
.index_products .title .line {
    width: 100%;
    height: 3px;
    position: relative;
    margin: 0.6rem 0;
    background: #d5d4d4;
}
.index_products .title .line::before {
    content: '';
    width: 30%;
    height: 3px;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    background: var(--comcolor);
}

.index_products .category {
    margin-top: 3rem;
}
.index_products .category a {
    border: 1px solid #fff;
    display: block;
    margin-bottom: 0.5rem;
    padding: 1rem;
    color:#9f9f9f;
}
.index_products .category a.cur {
    border: 1px solid var(--comcolor);
    color:var(--comcolor);
}

.index_products .box2 {width:65%;overflow: hidden;}
.index_products .box2 h3 { font-size: 2.5rem;margin-bottom: 1rem; text-align: center;color:var(--subcolor);}
.index_products .box2 .intro { font-size: 1.2rem;line-height:2rem; color:var(--subcolor);}
.index_products .box2 .view_more {
    margin: 2rem auto;
}


@media  screen and (max-width: 1000px){
    .index_products  {
        height:auto;
        padding:3rem 0;
    }
    .index_products .cont { display: block;}
    .index_products .box1 {width:100%;}
    .index_products .title .name { font-size: 2.5rem;}
    .index_products .category a {
        padding: 0.5rem 1rem;
    }
    .index_products .box2 {width:100%;overflow: hidden;margin-top: 2rem;}
}





.index_technology {width: 100%; height:100vh;position: relative;overflow: hidden;}
.index_technology .list { position: absolute;bottom:5%; left:50%;transform: translateX(-50%);display: flex;z-index: 9;}
.index_technology .list .item {width:25%;padding:1rem;background: #e7e7e7;}
.index_technology .list .item.cur { background: var(--comcolor); }
.index_technology .list .tit {font-size: 1rem;}
.index_technology .list .item.cur .tit { color: #fff; }
.index_technology .list .line{position: relative;height: 2px;width: 100%;margin: 1rem 0;background: #cbcbcb;}
.index_technology .list .line::before {content: '';width: 0;height: 2px;position: absolute;left: 0;top: 0;z-index: 11;transition:all .4s ease;background: #fff;}
.index_technology .list .item.cur .line::before {width: 30%;}

.index_technology .technology_swiper {height:100vh;}
.index_technology .swiper-slide img {width: 100%;height:100%;object-fit: cover;}
.index_technology .swiper-slide .text { position: absolute;top:30%;left:50%;transform: translateX(-50%);}

.index_technology .swiper-slide .text h3 { font-size:3rem;font-weight: 800;margin-bottom: 1rem;color:#fff;}
.index_technology .swiper-slide .text .intro { font-size: 1.6rem;line-height:3rem; color:#fff;}
.index_technology .swiper-slide .text .view_more {
    margin: 2rem 0;
}

@media  screen and (max-width: 1000px){
    .index_technology .technology_swiper {height:100%;}
    .index_technology .list { flex-wrap: wrap;}
    .index_technology .swiper-slide .text { top:10%;}
    .index_technology .swiper-slide .text h3 { font-size:2rem;}
    .index_technology .swiper-slide .text .intro { font-size: 1rem;line-height:2rem;}
}

@media  screen and (max-width: 765px){
    .index_technology {height:85vh;}
    .index_technology .list .item { width: 50%;}
}




.index_about { width: 100%;padding:5rem 0;position: relative; background-size: cover;overflow: hidden;}
.index_about .box1 {margin-bottom: 5rem;}
.index_about .box1 .name { font-size: 3.5rem;font-weight: 800;color:var(--comcolor); }
.index_about .box1 .line {
    width: 20rem;
    height: 3px;
    position: relative;
    margin: 1rem 0;
    background: #d5d4d4;
}
.index_about .box1 .line::before {
    content: '';
    width: 30%;
    height: 3px;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    background: var(--comcolor);
}
.index_about .box1 .intro {
    background: #21212194;
    padding: 0.6rem;
    margin-bottom: 2rem;
    color:#fff;
}

.index_about .box2 {display: flex;z-index: 9;}
.index_about .box2 li {width:25%;padding:2rem 1rem;background: #e7e7e7;display: flex;align-items: center;justify-content: space-between;}
.index_about .box2 li:not(:first-child) {border-left: 1px solid #ccc;}
.index_about .box2 li:hover { background: var(--comcolor); }
.index_about .box2 li h5 {width:50%;font-size: 1.2rem;}
.index_about .box2 li strong {font-size: 2.5rem;}
.index_about .box2 li span{display: inline-block;vertical-align: top;}
.index_about .box2 li:hover h5,
.index_about .box2 li:hover strong,
.index_about .box2 li:hover span
{color:#fff;}


@media  screen and (max-width: 1000px){
    .index_about { padding:2rem 0;height:auto;}
    .index_about .box1 .name { font-size: 2.5rem;}
    .index_about .box2 {
        flex-wrap: wrap;
    }
    .index_about .box2 li { width: 50%;margin-bottom: 0.5rem;}
}





.index_news { width: 100%;padding:5rem 0;position: relative; background:url('/static/images/index_news.jpg');background-size: cover;overflow: hidden;}
.index_news .cont {height:100%;display: flex;flex-direction: column;justify-content: center;}
.index_news .box { display: flex;justify-content: space-between;align-items: flex-end;margin-bottom: 2rem;}

.index_news .title .name { font-size: 3.5rem;font-weight: 800;color:#fff;}
.index_news .title .line {
    width: 100%;
    height: 3px;
    position: relative;
    margin: 0.6rem 0;
    background: #d5d4d4;
}
.index_news .title .line::before {
    content: '';
    width: 30%;
    height: 3px;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    background: var(--comcolor);
}

.index_news .list { display: flex;justify-content: space-between; }
.index_news .list .item { width: 40%;background:#fff;padding:2rem;}
.index_news .list .item h3 { margin-bottom: 2rem;}
.index_news .list .item .date { color:#898989;margin-bottom: 2rem;}


@media  screen and (max-width: 1000px){
    .index_news  { padding:2rem 0;}
    .index_news .title .name { font-size: 2.5rem;}
    .index_news .list { display: block; }
    .index_news .list .item {width: 100%;margin-bottom: 1rem;}

}