@charset "utf-8";
/* CSS Document */
.banner{width:100%;height:350px;background:url(../images/banner_bg.jpg) no-repeat top center;}
.banner-txt{background-color:rgba(33,38,150, 0.70);color:#FFF; height:100%;display:flex;align-items:center;justify-content:center;}
.banner-title{font-size:42px;font-weight:bolder;}
.banner-title p{font-size:20px;padding-top:30px;font-weight:500;}
.banner2{width:100%;height:200px;background:url(../images/banner_bg.jpg) no-repeat top center;}

.about-txt{text-align:left;}
.about-txt p{text-align:left;}

.block-nav{padding-bottom:70px;}
.block-nav ul{display:flex;}
.block-nav li{width:calc(31% - 2px);float:left;margin-left:2.33333%;box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.1); padding:20px;border:1px solid #F9F9F9; border-radius:10px;transition: box-shadow 0.3s ease;}
.block-nav li:first-child{margin-left:0;}
.block-nav li:hover{box-shadow: 0 4px 8px rgba(0,0,0,0.2);}
.block-nav li:hover .block-nav-icon{background-color:#fee9e9;}
.block-nav li h3{font-size:18px;}
.block-nav li p{color:#777;}
.block-nav-tit{font-weight:bolder;line-height:30px; padding-top:30px;padding-bottom:10px;}
.block-nav-icon{background-color:#f7f6ff;width:60px;height:60px;border-radius:18px;overflow:hidden; display:flex;justify-content: center; /* 水平居中 */align-items: center; transition: box-shadow 0.7s ease; }
.block-nav-icon img{height:36px;width:36px;}

.block-nav2{padding-bottom:70px;}
.block-nav2 ul{display:flex;}
.block-nav2 li{width:calc(23% - 2px);float:left;margin-left:2.666666%;box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.1); padding:20px;border:1px solid #F9F9F9; border-radius:10px;transition: box-shadow 0.3s ease;}
.block-nav2 li:first-child{margin-left:0;}
.block-nav2 li:hover{box-shadow: 0 4px 8px rgba(0,0,0,0.2);}
.block-nav2 li:hover .block-nav-icon{background-color:#fee9e9;}
.block-nav2 li h3{font-size:18px;}
.block-nav2 li p{color:#777;}

.product-category{float:left;width:calc(20% - 2px); text-align:left;border:1px solid #E9E9E9;border-radius:5px;}
.product-category-title{background-color:#E9E9E9;height:38px;line-height:38px;color:#333; font-weight:bolder;padding-left:20px;}
.product-category ul{margin:20px;}
.product-category li{padding:2px 15px;margin-top:15px;border-radius:15px; cursor:pointer;}
.product-category li:hover{background-color:#E9E9E9;}
.cur-pc{border:2px solid #E9E9E9;font-weight:bolder;color:#e7432e;}

.product-main{width:77%;float:right;text-align:left;}
.product-main h2{font-size:24px;font-weight:bolder;}
.product-main ul{display:flex;flex-wrap: wrap;margin-top:30px;}
.product-main li{width:calc(31% - 2px);border:1px solid #E9E9E9;border-radius:5px;float:left;margin-left:3.5%;margin-bottom:20px;}
.product-main li:nth-child(3n+1){margin-left:0;}
.product-main li h3{font-size:16px;font-weight:bolder;margin-top:15px;line-height:20px;padding:0 15px;}
.product-main li p{color:#999;font-size:13px;padding:5px 15px 15px 15px;}
.product-main li span{float:right;}
.pro-img{width:100%;height:180px;overflow:hidden;}
.pro-img img{width:100%;}

.pro-top{text-align:left;margin-top:30px;}
.pro-top h1{font-size:36px;font-weight:bolder;margin-bottom:20px;}
.pro-top ul{margin-top:20px;}
.pro-top li{width:calc(20% - 40px);float:left;background-color:#f7f6ff;border-radius:10px;overflow:hidden;margin-right:2%;padding:15px 20px;color:#777;}
.pro-top li span{color:#333;font-weight:bolder;}
.pro-top li:nth-child(3){background-color:#FFF;padding:0 0;margin-top:30px;border-radius:4px;}
.pro-bimg{width:45%;float:left;margin-right:3%;}
.pro-bimg img{max-width:100%;background-color:#333;box-shadow: 2px 6px 6px rgba(0, 0, 0, 0.2);border-radius:20px;overflow:hidden;}
.pro-main{text-align:left;}
.pro-main-title{height:40px;line-height:40px;border-bottom:1px solid #E9E9E9;}
.pro-main-title li{width:12%;float:left;font-size:22px;line-height:40px;text-align:center;color:#333;}
.pm-cur{border-bottom:1px solid #D9D9D9;}
.pro-con{font-size:16px;margin-top:50px; transition:all 1.2s;margin-bottom:50px;}
.pro-con h2{font-size:24px; font-weight:bolder;margin-top:25px;margin-bottom:15px;}
.pro-con p{color:#666;}
.pro-mt{cursor:pointer;}
.pro-con-no{display:none;}
.pro-con-yes{display:block;}

.service-nav{padding-bottom:40px;}
.service-nav ul{display:flex;flex-wrap:wrap;}
.service-nav li{width:calc(31% - 2px);float:left;margin-left:2.33333%;box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.1); border-radius:10px;transition: box-shadow 0.3s ease;margin-bottom:35px;overflow:hidden;}
.service-nav li:nth-child(3n+1){margin-left:0;}
.service-nav li:hover{box-shadow: 0 4px 8px rgba(0,0,0,0.2);}
.service-nav li:hover .service-nav-icon{background-color:#fee9e9;}
.service-nav li p{color:#777;}
.service-nav-img{width:100%;border-radius:10px 10px 0 0;overflow:hidden;height:200px;}
.service-nav-img img{width:100%;}
.service-nav-tit{font-weight:bolder;line-height:30px; padding-bottom:10px;font-size:24px;font-weight:bolder;display:flex;align-items: center;}
.service-nav-icon{background-color:#f7f6ff;width:60px;height:60px;border-radius:18px;overflow:hidden; display:flex;justify-content: center; /* 水平居中 */align-items: center; transition: box-shadow 0.7s ease;margin-right:15px;}
.service-nav-icon img{height:36px;width:36px;}
.service-nav-tab{display:flex;padding-top:15px;}
.service-nav-tab span{background-color:#eef4ff;font-size:12px;color:#555;margin-right:10px;border-radius:12px;overflow:hidden;padding:0 10px;line-height:24px;}
.service-bor-blue{border-top:3px solid #0c89e9;}
.service-bor-red{border-top:3px solid #f05f5f;}

.service-seo{background-color:#f8f9fc;padding:20px 0 40px 0;}
.service-seo ul{display:flex; flex-wrap:wrap;}
.service-seo li{width:23%;margin-left:2.66666%;float:left;}
.service-seo li:nth-child(4n+1){margin-left:0;}
.service-seo-title{font-size:21px;font-weight:bolder;color:#333;margin-bottom:15px;}
.service-seo-icon{background-color:#f7f6ff;width:60px;height:60px;border-radius:18px;overflow:hidden; display:flex;justify-content: center; /* 水平居中 */align-items: center; transition: box-shadow 0.7s ease;margin:10px auto; transition:all 2s;}
.service-seo li:hover .service-seo-icon{background-color:#fee9e9;}
.service-seo li p{color:#555;}
.service-hots{background-color:#f8f9fc;border-radius:10px;padding:30px;}
.service-hots h2{font-size:30px;color:#333;font-weight:bolder;}
.service-hots ul{display:flex;flex-wrap:wrap;}
.service-hots li{float:left;width:31%;margin-left:3.5%;margin-top:60px;display:flex;flex-direction:column;}
.service-hots li h3{font-size:18px;font-weight:bolder;margin-bottom:10px;margin-top:10px;}
.service-hots li p{color:#777;}
.service-hots li:nth-child(3n+1){margin-left:0;}
.service-hots li i{border:1px solid #E6E6E6;width:60px;height:60px;border-radius:50%; display: flex;margin: 0 auto; transition:all 1.2s;
    justify-content: center; /* 水平居中 */
    align-items: center; /* 垂直居中 */}
.service-hots li:hover i{border:1px solid #F63;}


        /* 时间线容器样式 */
        .timeline-container {
            position: relative;
            max-width: 1000px;
            margin: 0 auto;
            padding: 40px 0;
        }
        
        /* 中间竖线样式 */
        .timeline-line {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 50%;
            width: 4px;
            background-color: #dee2e6;
            transform: translateX(-50%);
        }
        
        /* 时间点样式 - 小尺寸正圆 */
        .timeline-dot {
            position: absolute;
            left: 50%;
            width: 12px;
            height: 12px;
            /* 确保宽高相等，并且没有边框或内边距影响形状 */
            padding: 0;
            margin: 0;
            border: none;
            border-radius: 50%;
            transform: translateX(-50%);
            z-index: 1;
            transition: all 0.3s ease;
            box-sizing: border-box; /* 确保尺寸计算方式一致 */
        }
        
        .timeline-dot:hover {
            transform: translateX(-50%) scale(1.5);
            box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.1);
        }
        
        /* 内容项样式 */
        .timeline-item {
            margin-bottom: 40px;
            position: relative;
            opacity: 0;
            transform: translateY(20px);
            transition: all 0.5s ease;
        }
        
        .timeline-item.visible {
            opacity: 1;
            transform: translateY(0);
        }
        
        .timeline-content {
            padding: 20px;border:1px solid #EFEFEF;text-align:left;
            background-color: #fff;
            border-radius: 8px;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
            transition: transform 0.3s ease;
        }
		.timeline-content h3{font-size:20px;font-weight:bolder;padding-top:3px;}
        
        .timeline-content:hover {
            transform: translateY(-5px);
        }
        
        /* 编号样式 */
        .step-number {
            display: inline-block;
            width: 24px;
            height: 24px;
            line-height: 24px;
            text-align: center;
            background-color: #0d6efd;
            color: white;
            border-radius: 50%;
            margin-right:5px;
            font-size: 14px;
        }
        
        /* 响应式调整 */
        @media (max-width: 768px) {
            .timeline-line {
                left: 30px;
            }
            
            .timeline-dot {
                left: 30px;
            }
            
            .timeline-item > div {
                width: 100% !important;
                padding-left: 60px !important;
                padding-right: 0 !important;
            }
        }
		
@media(max-width:640px){
	.banner{height:180px;}
	.banner-title{font-size:30px;}
	.banner-title p{font-size:16px;pading:20px 50px;}
	.block-nav2 ul{flex-wrap:wrap;}
	.block-nav2 li{width:calc(48% - 2px);margin-left:4%;margin-bottom:20px;}
	.block-nav2 li:nth-child(2n+1){margin-left:0;}
	.product-category{width:calc(35% - 2px); }
	.product-main{width:62%;}
	.product-main li{width:calc(48% - 2px);margin-left:4%;}
	.product-main li:nth-child(3n+1){margin-left:auto;}
	.product-main li:nth-child(2n+1){margin-left:0;}
	.pro-img{height:80px;}
	.product-main li p{display:none;}
	.product-main li h3{margin-top:10px;line-height:20px;padding:0 15px;margin-bottom:10px;}
	
	.product-category ul{margin:10px;}
	.product-category li{padding:2px 5px;margin-top:10px; white-space:nowrap;overflow:hidden;}
	
	.service-nav li{width:calc(48% - 2px); margin-left:4%;}
	.service-nav li:nth-child(3n+1){margin-left:auto;}
	.service-nav li:nth-child(2n+1){margin-left:0;}
	.service-nav-icon{display:none;}
	.service-nav-tab{display:none;}
	.service-nav li{width:calc(96% - 2px);float:none;margin-left:0;}
	.block-nav ul{flex-wrap:wrap;}
	.block-nav li{width:calc(95% - 2px);margin-left:2%;margin-bottom:20px;}
	.block-nav li:first-child{margin-left:2%;}
	
	.pro-bimg{width:94%;float:left;margin-right:3%;margin-left:3%;}
	.pro-top li{width:calc(33% - 10px);}
	.pro-main-title li{width:33%;}
	.service-hots{padding:20px 15px;}
	.service-hots li{width:48%;margin-left:4%;}
	.service-hots li:nth-child(3n+1){margin-left:auto;}
	.service-hots li:nth-child(2n+1){margin-left:0;}
	.timeline-container {max-width:100%;}
	.timeline-dot{display:none;}
	.timeline-line{display:none;}
	 .timeline-item {left:-30px;}
}