/*banner*/
.index-banner{ position: relative; width: 100%; /*height: 100vh;*/overflow: hidden;}  
.index-banner .swiper-slide {/*height: 100vh;*/ color: #fff; } 
.index-banner .swiper-slide {position: relative;}
.index-banner .swiper-slide img{width: 100%; display: block;}
.index-banner .swiper-slide a{ position: relative; display: block; width: 100%; height: 100%; }
.index-banner .banner-mask{ position: absolute; inset: 0; background: rgba(0,0,0,0.1); z-index: 1; }
.index-banner .banner-txt{
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 2;
    max-width: 6.6rem;
    transform: translate(-8rem, -50%);
    color: #fff;
}
.index-banner .banner-txt strong{ display: block; font-size: 0.44rem; line-height: 0.58rem; font-weight: 700; }
.index-banner .banner-txt p{ margin: 0.16rem 0 0; max-width: 5.8rem; font-size: 0.2rem; line-height: 0.32rem; color: rgba(255,255,255,0.88); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.index-banner .swiper-pagination-bullet {  width: 22px; height: 22px; opacity: 1; background:url(../image/banner_pag.png) no-repeat center center; } 
.index-banner .swiper-pagination-bullet-active {background:url(../image/banner_pag_acitve.png) no-repeat center center; height: 22px; } 

@media screen and (max-width: 1600px) {
    .index-banner .banner-txt{
        left: 0.3rem;
        transform: translateY(-50%);
    }
}


/* menu */
.index-menu{ width: 100%; height: 2rem; padding: 0.4rem 0;}
.index-menu ul{ display: flex; justify-content: space-around;}
.index-menu ul li{ text-align: center;}
.index-menu ul li .pic{width: 1.36rem; height: 1.36rem; margin-bottom: 0.2rem; border-radius: 1.36rem;}
.index-menu ul li .txt{ font-size: 0.22rem; color: #333; font-weight: bold;}
.index-menu ul li .prokan .pic{background: #f0f0f0 url(../image/menu_prokan.png) no-repeat center center; background-size: 1.36rem auto;}
.index-menu ul li .prokan:hover .pic{background: #1683D8 url(../image/menu_prokan_active.png) no-repeat center center; background-size: 1.36rem auto;}
.index-menu ul li .products .pic{background: #f0f0f0 url(../image/menu_products.png) no-repeat center center; background-size: 1.36rem auto;}
.index-menu ul li .products:hover .pic{background: #1683D8 url(../image/menu_products_active.png) no-repeat center center; background-size: 1.36rem auto;}
.index-menu ul li .quality .pic{background: #f0f0f0 url(../image/menu_quality.png) no-repeat center center; background-size: 1.36rem auto;}
.index-menu ul li .quality:hover .pic{background: #1683D8 url(../image/menu_quality_active.png) no-repeat center center; background-size: 1.36rem auto;}
.index-menu ul li .services .pic{background: #f0f0f0 url(../image/menu_services.png) no-repeat center center; background-size: 1.36rem auto;}
.index-menu ul li .services:hover .pic{background: #1683D8 url(../image/menu_services_active.png) no-repeat center center; background-size: 1.36rem auto;}
/* .product */
.index-content{ width: 100%; padding: 0.5rem 0; }
.index-content .index-tt{ max-width: 100%; text-align: center;}
.index-content .index-tt h3{ line-height: 35px; color: #7d7d7d; font-size: 12px; text-transform: uppercase;}
.index-content .index-tt h4{ color: #333333; font-size: 0.36rem; text-transform: uppercase;}
.index-content .index-tt h4 span{ color: #1683D8;}
.index-more{ width: 100%; text-align: center; }
.index-more .more{ display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 0.5rem; border: 1px solid #1683D8; color: #1683D8; font-size: 0.2rem; text-align: center; }
.index-more .more:hover{ background: #1683D8;color: #fff; }
.index-pros{background: #f6f7f9;}
.index-pros .index-tt{ margin-bottom: 0.65rem;}
.index-pros .index-tt img{ max-width: 2.92rem;}
.index-pros .index-tt h2{margin-bottom:0.16rem;color:#152238;font-size:0.46rem;line-height:0.54rem;font-weight:700;}
.index-pros .index-tt .desc{max-width:7.6rem;margin:0 auto;color:#687287;font-size:0.2rem;line-height:0.24rem;}
.index-pros .box{ width: 100%; margin-bottom: 0.3rem;}
.index-pros .swiper-pros{ position: relative; width: 100%; padding-bottom: 0.65rem;}
.index-pros .swiper-pros .swiper-slide a{ display: block; padding:0.05rem; background: #fff;}
.index-pros .swiper-pros .swiper-slide .pic{ width: 100%; aspect-ratio: 4 / 3; overflow: hidden; text-align: center;}
.index-pros .swiper-pros .swiper-slide .pic img{ width: 100%; height: 100%; object-fit: cover; display: block; transition: all 0.6s;}
.index-pros .swiper-pros .swiper-slide .txt{ width: 100%; padding: 0.14rem 0 0.12rem; text-align: center;}
.index-pros .swiper-pros .swiper-slide .txt h3{ width: 100%; height: 26px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 26px; font-size: 0.24rem; color: #333;}
.index-pros .swiper-pros .swiper-slide .txt p{width: 100%; height: 26px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;line-height: 26px; font-size: 0.18rem; color: #666;}
.index-pros .swiper-pros .swiper-slide a:hover{ background: #1683D8;}
.index-pros .swiper-pros .swiper-slide a:hover .pic img{transform: scale(1.1);}
.index-pros .swiper-pros .swiper-slide a:hover h3{ color: #fff;}
.index-pros .swiper-pros .swiper-slide a:hover p{ color: #fff;}
.index-pros .swiper-pros .swiper-pagination { height: 15px; background: url(../image/pros-line-bg.png) repeat-x left center; bottom: 0px!important;} 
.index-pros .swiper-pros .swiper-pagination-bullet {  width: 15px; height: 15px; background: #dadada;opacity: 1!important; margin: 0 1.6rem!important;} 
.index-pros .swiper-pros .swiper-pagination-bullet-active {background: #1683D8; opacity: 1!important;} 
/* about */
.index-about{ padding: 0.8rem 0; background: #fff;}
.index-about .box{ display: flex; align-items: center; justify-content: space-between; gap: 0.7rem;}
.index-about .txt{ width: 6.55rem;}
.index-about .tt{ display: flex; align-items: flex-start; margin-bottom: 0.24rem;}
.index-about .tt span{ width: 0.08rem; height: 0.42rem; margin-right: 0.16rem; background: #1683D8; border-radius: 0.02rem; flex-shrink: 0;}
.index-about .tt h3{ color: #152238; font-size: 0.46rem; line-height: 0.52rem; font-weight: bold; text-transform: uppercase;}
.index-about .con{ margin-bottom: 0.36rem; line-height: 0.34rem; font-size: 0.2rem; color: #5f6673; text-align: justify;}
.index-about .stats{ display: flex; gap: 0.16rem;}
.index-about .stats li{ flex: 1; min-width: 0;}
.index-about .stats .num{ margin-bottom: 0.08rem; color: #1683D8; font-size: 0.44rem; line-height: 0.54rem; font-weight: bold;}
.index-about .stats .num .numUp{ display: inline-block;}
.index-about .stats p{ color: #3f4b5b; font-size: 0.16rem; line-height: 0.22rem; font-weight: 600;}
.index-about .index-about-more{ margin-top: 0.28rem; text-align: left; }

.index-about .pic{ flex: 1; max-width: 8.25rem;}
.index-about .pic img{ width: 100%; display: block; border-radius: 0.28rem;}
/* news */
.index-news .index-tt{ width: 100%; margin-bottom: 0.65rem;}
.index-news .index-tt .desc{max-width:7.6rem;margin:0 auto;color:#687287;font-size:0.2rem;line-height:0.24rem;}
.index-news ul{ display: flex; justify-content: space-between; width: 100%; margin-bottom: 0.45rem;}
.index-news ul li{ width: 4.9rem; background: #f7f7f7;}
.index-news ul li .pic{ width: 4.9rem; height: 3rem; overflow: hidden;}
.index-news ul li .pic img{ width: 100%;transition: all 0.6s;}
.index-news ul li .pic a:hover img{transform: scale(1.1);}
.index-news ul li .txt{ padding:0.1rem 0.2rem 0.2rem 0.2rem;}
.index-news ul li .txt h3{ width: 100%; height: 30px; overflow: hidden; text-overflow: ellipsis;white-space: nowrap;}
.index-news ul li .txt h3 a{ line-height: 30px; color: #333; font-size: 18px;}
.index-news ul li .txt h3 a:hover{color: #1683D8;}
.index-news ul li .txt .intro{line-height: 20px; color: #999; font-size: 16px;}
.index-news ul li .txt .time{ width: 100%; margin-top: 0.15rem; display: flex; justify-content: space-between;line-height: 30px; color: #999; font-size: 14px;}
.index-news ul li .txt .time .more{ padding-right: 20px; background: url(../image/icon_arrow_r.png) no-repeat right center;}
.index-news ul li .txt .time .more:hover{ background: url(../image/icon_arrow_r_active.png) no-repeat right center;}



/* 首页行业应用 */
.index-solution{
    --solution-brand:#1683D8;
    --solution-brand-deep:#0f2942;
    --solution-text:#152238;
    --solution-muted:#687287;
    --solution-overlay:linear-gradient(to top,rgba(8,14,24,.78) 0%,rgba(8,14,24,.38) 48%,rgba(8,14,24,.06) 100%);
    background:#fff;
}
.index-solution .solution-head{max-width:9rem;margin:0 auto 0.55rem;text-align:center;}
.index-solution .solution-head .eyebrow{margin-bottom:0.08rem;color:var(--solution-brand);font-size:0.2rem;line-height:0.2rem;letter-spacing:0.12rem;font-weight:600;}
.index-solution .solution-head h2{margin-bottom:0.16rem;color:var(--solution-text);font-size:0.46rem;line-height:0.54rem;font-weight:700;}
.index-solution .solution-head .desc{max-width:7.6rem;margin:0 auto;color:var(--solution-muted);font-size:0.2rem;line-height:0.24rem;}
.index-solution .solution-row{display:flex;gap:0.14rem;margin-bottom:0.45rem;align-items:stretch;overflow:hidden;counter-reset: solution;}
.index-solution .solution-card{position:relative;display:block;overflow:hidden;min-width:0;flex:1 1 0;height:clamp(4.8rem, 36vw, 6.2rem);border-radius:0.08rem;background:#0f1724;box-shadow:0 12px 30px rgba(15,23,36,.08);transition:flex-grow 0.6s cubic-bezier(.2,.8,.2,1),transform 0.45s ease,box-shadow 0.45s ease;flex-grow:1;}
.index-solution .solution-card:focus-visible{outline:2px solid var(--solution-brand);outline-offset:3px;}
.index-solution .solution-card::before{counter-increment:solution;content:"0" counter(solution);position:absolute;left:0.26rem;top:0.22rem;z-index:3;color:#fff;font-size:0.13rem;line-height:1;letter-spacing:0.1rem;font-weight:600;opacity:.82;transition:opacity 0.35s ease,transform 0.35s ease;}
.index-solution .solution-row:hover .solution-card{flex-grow:0.72;}
.index-solution .solution-row:hover .solution-card:hover{flex-grow:2.4;transform:translateY(-5px);box-shadow:0 18px 36px rgba(15,23,36,.16);}
.index-solution .solution-card .pic{position:absolute;inset:0;}
.index-solution .solution-card .pic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.7s ease;}
.index-solution .solution-card .shade{position:absolute;inset:0;background:var(--solution-overlay);z-index:1;transition:background 0.45s ease,opacity 0.45s ease;}
.index-solution .solution-card .txt{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:0.34rem 0.28rem 0.28rem;color:#fff;transition:transform 0.45s ease,opacity 0.45s ease;}
.index-solution .solution-card .txt h3{margin-bottom:0.09rem;font-size:0.24rem;line-height:0.32rem;font-weight:700;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.index-solution .solution-card .solution-details{opacity:0;max-height:0;overflow:hidden;transform:translateY(0.18rem);transition:opacity 0.4s ease 0.1s,transform 0.4s ease 0.1s,max-height 0.5s ease 0.1s;}
.index-solution .solution-card .solution-details p{margin:0 0 0.14rem;line-height:0.24rem;font-size:0.2rem;color:rgba(255,255,255,.82);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.index-solution .solution-card .solution-details .more{display:inline-flex;align-items:center;color:var(--solution-brand);font-size:0.13rem;font-weight:600;letter-spacing:0.04rem;}
.index-solution .solution-card .solution-details .more:after{content:'\2192';margin-left:0.08rem;transition:transform 0.3s ease;}
.index-solution .solution-card:hover .pic img{transform:scale(1.03);}
.index-solution .solution-card:hover .shade{background:linear-gradient(to top,rgba(6,12,20,.9) 0%,rgba(6,12,20,.42) 46%,rgba(6,12,20,.08) 100%);}
.index-solution .solution-card:hover::before{opacity:1;transform:translateY(-1px);}
.index-solution .solution-card:hover .txt{transform:translateY(-0.1rem);}
.index-solution .solution-card:hover .solution-details{opacity:1;max-height:1.8rem;transform:translateY(0);}
.index-solution .solution-card:hover .solution-details .more:after{transform:translateX(0.04rem);}
.index-solution .index-more{margin-top:0.05rem;}
@media (prefers-reduced-motion: reduce){
    .index-solution .solution-card,
    .index-solution .solution-card *{transition:none !important;}
}
/* 首页行业应用 end */
@media screen and ( max-width:1024px ){
	.wal, .wal2, .wal3, .w850, .w300{width:100%;}
	.PC-Box,.nav{ display:none;}
	.head .navIco,.head .searchIco{ display:block;}
	.head{ height:1.0rem; position: relative; background: #fff;}
	.head .wal2{ height: 1.0rem; }
	.head:after{ display: none; }
	.head .logo{ left: 0.3rem; top:50%; line-height:0; transform:translateY(-50%);}
	.head .logo img{ width: 2.18rem; }
	.footer-bottom{ padding:0.4rem 0;}
	.footer-bottom .wal2{ width: auto; padding: 0 0.3rem; display: block; }
	.footer-bottom .tel{ margin-bottom: 0.1rem;}
	.footer-bottom .contact .fllow{text-align: left; margin-bottom: 0.15rem; }
	.footer-bottom .contact .copyright{ text-align: left;}
	.footer{ height: auto; padding:0.27rem 0;}
	.footer .ft_l{ float: none;display: flex; justify-content: space-between; padding:0 0.3rem;}
	.footer .ft_l .item{ float: none; width: auto;}
	.footer .ft_l .item dt{ padding: 0; margin: 0;}
	.footer .ft_l .item dt:after{position: absolute; bottom: 0; left: 0; content: ''; width: 0; height: 0;}
	.footer .item dd ,.footer .ft_r{ display:none;}
	
	.index-content .index-tt img{ max-width: 30px;}
    .index-pros .index-tt h2{font-size:0.32rem;line-height:0.4rem;}
    .index-pros .index-tt .desc{font-size:0.13rem;line-height:0.22rem;}

	.index-banner .swiper-pagination-bullet {  width: 18px; height: 18px; opacity: 1; background:url(../image/banner_pag.png) no-repeat center center; background-size: 18px 18px; } 
	.index-banner .swiper-pagination-bullet-active {background:url(../image/banner_pag_acitve.png) no-repeat center center; height: 18px;background-size: 18px 18px; } 	
	.index-banner .banner-txt{ left: 0.35rem; right: 0.35rem; max-width: none; }
	.index-banner .banner-txt strong{ font-size: 0.24rem; line-height: 0.34rem; }
	.index-banner .banner-txt p{ max-width: none; margin-top: 0.1rem; font-size: 0.2rem; line-height: 0.22rem; }

	.index-pros .swiper-pros .swiper-slide .pic{ width: 100%; aspect-ratio: 4 / 3; height: auto; overflow: hidden; text-align: center;}
	.index-pros .swiper-pros .swiper-slide .pic img{ width: 100%; height: 100%; object-fit: cover; display: block; transition: all 0.6s;}

	.index-news .box{padding: 0 0.3rem;}
	.index-news .index-tt .desc{font-size:0.13rem;line-height:0.22rem;}
	.index-news ul{ display: block; }
	.index-news ul li{ width: 100%; margin-bottom: 0.3rem;}
	.index-news ul li .pic{ width: 100%; height: auto;}
    .index-about{ padding: 0.45rem 0;}
    .index-about .box{ display: block; padding: 0 0.3rem;}
    .index-about .txt{ width: 100%; margin-bottom: 0.28rem;}
    .index-about .tt{ margin-bottom: 0.18rem;}
    .index-about .tt h3{ font-size: 0.34rem; line-height: 0.42rem;}
    .index-about .con{ margin-bottom: 0.24rem; line-height: 0.28rem; font-size: 0.13rem;}
    .index-about .stats{ display: flex; flex-wrap: wrap; gap: 0.18rem 0.12rem;}
    .index-about .stats li{ flex: 1 1 calc(33.333% - 0.08rem);}
    .index-about .stats .num{ font-size: 0.3rem; line-height: 0.4rem;}
    .index-about .stats p{ font-size: 0.12rem; line-height: 0.18rem;}
    .index-about .pic{ max-width: none;}
    .index-about .pic img{ border-radius: 0.18rem;}

    .index-news ul li .txt h3{ width: 100%; height: 30px;}
    .index-news ul li .txt h3 a{ line-height: 30px; color: #333; font-size: 16px;}
    .index-solution{padding:0.45rem 0;}
    .index-solution .solution-head{margin-bottom:0.34rem;padding:0 0.3rem;}
    .index-solution .solution-head .eyebrow{font-size:0.12rem;letter-spacing:0.1rem;}
    .index-solution .solution-head h2{font-size:0.32rem;line-height:0.4rem;}
    .index-solution .solution-head .desc{font-size:0.13rem;line-height:0.22rem;}
    .index-solution .solution-row{display:block;padding:0 0.3rem;margin-bottom:0.3rem;counter-reset: solution;}
    .index-solution .solution-card{height:3.05rem;margin-bottom:0.16rem;border-radius:0.12rem;flex:none;}
    .index-solution .solution-row:hover .solution-card,
    .index-solution .solution-row:hover .solution-card:hover{flex:none;transform:none;}
    .index-solution .solution-card::before{left:0.18rem;top:0.16rem;font-size:0.11rem;letter-spacing:0.08rem;}
    .index-solution .solution-card .txt{padding:0.2rem 0.18rem 0.18rem;}
    .index-solution .solution-card .txt h3{font-size:0.18rem;line-height:0.24rem;}
    .index-solution .solution-card .solution-details{opacity:1;max-height:none;transform:none;transition:none;}
    .index-solution .solution-card .solution-details p{font-size:0.12rem;line-height:0.18rem;-webkit-line-clamp:2;margin-bottom:0.08rem;}
    .index-solution .solution-card .solution-details .more{font-size:0.12rem;letter-spacing:0.03rem;}
    .index-solution .solution-card .solution-details .more:after{margin-left:0.06rem;}
}
 


