@import url("https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900&display=swap");
ul,li{list-style:none;margin:0;padding:0}
body{margin:0;padding:0;overflow-x: hidden;font-family: "Poppins", sans-serif;}
div,img,h3,h4,p,dd,dl,em{margin: 0; padding: 0; border: 0;}
h1{letter-spacing:0px;margin:0;padding:0}
h2{letter-spacing:0px;font-size:16px;color:#000;background:inherit;margin:0 0 5px;padding:0}
p{margin:0 auto}
a{text-decoration:none;}

.fuwuall{background-color: #fbfbfb;width:100%;}
.fuwu{padding: 260px 10% 0px 10%;width: 80%;}
#ticker{height:auto; padding: 0.6em 0; margin: 0 0 0em 0; border-top:0px solid #efefef; border-bottom:0px solid #efefef; position: absolute;z-index: 99;
    top: 20vw;
    left: 11%;}
#ticker h2{margin-bottom: 0.8em;font-size: 3.5vw;color: #fff;font-weight:bold;}

.banner {position: relative;
            width: 100%;
            height:100%;
            display: flex;
            justify-content: center;
            align-items: center;
            margin:-7vw 0 0 0;
            transition: transform 0.3s ease-out;}
.banner dd{color: #fff;font-size: 1.1vw;font-weight:bold;position: absolute;z-index: 99;
    top: 26vw;
    left: 11%;}
        
.gdkd {position: relative;
            width: 100%;
            height:100%;
            display: flex;
            justify-content: center;
            align-items: center;
            margin: 0px 0;
            transition: transform 0.3s ease-out;}
.gdkd h2{color: #fff;font-size: .9vw;font-weight:normal;position: absolute;z-index: 99;line-height: 1.8vw;width: 38%;
    top: 15vw;
    left: 11%;}
.gdkd dd{color: #fff;font-size: 2.5vw;font-weight:bold;position: absolute;z-index: 99;
    top: 10vw;
    left: 11%;}
.gdkd ul{position: absolute;z-index: 99;line-height: 1.8vw;top: 25vw;left: 11%;}
.gdkd ul li{float:left;margin-right: 5vw;border-top:3px solid #ffffff8f;}
.gdkd ul li img{width: 6vw;margin-top: 1vw;}
.gdkd ul li dt{font-size: 0.8vw;color: #fff;}
        
.scaling-image {position: relative;
            width: 100%;
            height:40vw;
            object-fit: cover;
            border-radius:0px;
            transition: transform 0.3s ease-out;}

.aboutall{background:url(../images/abbg.png) no-repeat top center;}
.about{width:88%;margin:5vw auto 0vw auto;padding: 5%; }
.about h3{font-size: 2.5vw;color:#222;text-align: center;margin-bottom: 1.5vw;}
.about p{font-size: .9vw;color:#666;width: 65%;
    margin-bottom: 1vw;
    line-height: 1.8vw;
	text-align: justify;}

/*数字*/
.digital{width:88%;height: auto;padding:0 0px;color: #fff;margin:0vw auto 0 auto;z-index:99;}
.mainll{width: 100%;height: auto;margin:0 auto;font-size: 0;}
.mumping_mun li{width:22.75%;display: inline-block;margin:6vw 3% 8vw 0;text-align: center;border-radius: 15px;padding: 3vw 0;}
.mumping_mun li:nth-child(4){margin-right:0px;}
.mun_top{margin: 0px auto;
    width:9vw;}
.mumping_mun{width: 100%;list-style: none;}
.mumping_mun dd{font-size: 0.9vw;width: 100%;display: block;clear: both;color: #222;text-align: center;font-weight:normal;}
.mumping_mun p{font-size: 14px;width: 100%;display: block;clear: both;color: #666;text-align: center;}
.mumping_mun h2{font-size: 3vw;font-weight:bold;margin-bottom: 10px;color:#333;font-family: "Poppins", sans-serif;    float: left;}
.mumping_mun img{padding:0px 0px 20px 0px;width:56px;}
.mumping_mun span {position: relative;
    top: 0.8vw;
    color: #000;
    font-size: 1vw;
    font-weight: normal;
}

.tabs-container {
            display: flex;
            gap: 0px;
            height: 650px;
            margin-top: 20px;}       
        .tab {
            border-radius: 0px;
            padding:25px 6vw;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
            cursor: pointer;
            flex: 1;
            display: flex;
            flex-direction: column;
            justify-content: center;
            position: relative;
            overflow: hidden;
            min-width: 0;
            background-size: cover;
            background-position: center;
        }
        
        .tab::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0, 0, 0, 0.2);
            transition: all 0.4s ease;
            z-index: 1;
        }
        
        .tab.active {
            flex: 2;
        }
        
        .tab.active::before {
            background: rgba(0, 0, 0, 0.2);
        }
        
        .tabs-container:hover .tab.active:not(:hover) {
            flex: 1;
        }
        
        .tabs-container:hover .tab.active:not(:hover)::before {
            background: rgba(0, 0, 0, 0.4);
        }
        
        .tab:hover {
            flex: 2;
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
        }
        
        .tab:hover::before {
            background: rgba(0, 0, 0, 0.2);
        }
        
        .tab-content {
            position: relative;
            z-index: 2;
        }
        
        .tab-icon {
            font-size: 1.4vw;
            margin-bottom: 15px;
            color: #fff;
            transition: transform 0.3s ease;}
        
        .tab:hover .tab-icon {
            transform: scale(1.1);}
        
        .tab-title {font-family: wei;
            font-size:2vw;
            font-weight: 600;
            margin:3vw 0 3vw 0;
            color: #fff;
            transition: margin-bottom 0.4s ease;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            text-shadow: 1px 1px 3px rgba(0,0,0,0.5);
        }
        
        .tab-desc {
            color: #ecf0f1;
            line-height:2;
            opacity: 0;
            max-height: 0;
            overflow: hidden;
            transition: all 0.4s ease;
            text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
            font-size: 1vw;background: #ffffff47;width: 25vw;
    text-align: center;border-radius: 20px;
    margin: 0;}
        
        .tab.active .tab-desc {
            opacity: 1;
            max-height: 150px;
        }
        
        .tabs-container:hover .tab.active:not(:hover) .tab-desc {
            opacity: 0;
            max-height: 0;
        }
        
        .tab:hover .tab-desc {
            opacity: 1;
            max-height: 150px;
        }
        
        .tab:hover .tab-title {
            margin-bottom: 15px;
        }
        
        /* 响应式调整 */
        @media (max-width: 900px) {
            .tabs-container {
                flex-wrap: wrap;
                height: auto;
            }
            
            .tab {
                flex: 1 0 calc(50% - 15px);
                min-height: 200px;
            }
            
            .tab.active {
                flex: 2 0 calc(100% - 15px);
            }
            
            .tabs-container:hover .tab.active:not(:hover) {
                flex: 1 0 calc(50% - 15px);
            }
            
            .tab:hover {
                flex: 2 0 calc(100% - 15px);
            }
        }
        
        @media (max-width: 600px) {
            .tab {
                flex: 1 0 100%;
            }
            
            .tab.active {
                flex: 2 0 100%;
            }
            
            .tabs-container:hover .tab.active:not(:hover) {
                flex: 1 0 100%;
            }
            
            .tab:hover {
                flex: 2 0 100%;
            }
            
            h1 {
                font-size: 2rem;
            }
            
            .tab-title {
                font-size: 1.5rem;
            }
            
            .tab-icon {
                font-size: 2.5rem;
            }
}
/*发展*/
.fazhan{width:88%;margin:0vw auto;overflow: hidden;padding:9% 6% 2% 6%;}
.fazhan h3{background: url(../images/history.png) no-repeat;font-size: 2.5vw;color: #222;padding: 1.5vw 2vw;background-size: 40%;}
.body-box{width:100%;margin:3vw auto 0 auto;}

.anniu{padding: 0 2vw;box-shadow: 0 0.12rem 0.36rem 0 rgba(91, 117, 127, .15);
    width: 4vw;
    border-radius: 35px;
    background: #fff;
    overflow: hidden;
    height: 3vw;
    position: relative;
    top: 6vw;}

.timer-shaft-box{width:100%;padding:0px 0px;box-sizing: border-box;}
.timer-shaft{position:relative;width:100%;height:180px;overflow: hidden;}
.timer-left{position: absolute;
    top: 50%;
    left: 1vw;
    z-index: 99;
    width: 1.95vw;
    height: 1.98vw;
    margin-top: -1vw;
    background: url(../images/fz_left.png) no-repeat;
    background-size: cover;
    cursor: pointer;}
.timer-right{position:absolute;top:50%;left:5.2vw;z-index:99;width: 1.95vw;
    height: 1.98vw;
    margin-top: -1vw;background: url(../images/fz_right.png) no-repeat;background-size: cover;cursor:pointer;}
.timer-scale{position:absolute;top:0;left:0;height:80px;padding-left: 0px;font-size: 0;white-space: nowrap;}
.timer-scale-cont{display:inline-block;height:100%;line-height:3vw;}
.time-circle{display:inline-block;vertical-align:middle;width:2.95vw;height:2.98vw;line-height: 2.98vw;text-align: center;font-size:0.8vw;color:#666;border-radius: 50%;background:#fff;transition: all .3s;cursor:pointer;font-family: "Poppins", sans-serif;box-shadow: 3px 3px 15px 0px #efefef;}
.timer-scale-cont.hov .time-circle{width:3.2vw;height:3.2vw;line-height:3.2vw;font-size:0.8vw;background:#dfe8ed;color:#222;font-weight: bold;}
.line-scale{display:inline-block;vertical-align:middle;width:8vw;height:1vw;margin:0 0.1vw;background: url(../images/fazhan.png) no-repeat;background-size: cover;}

.timer-shaft-content{width:95%;margin-top:3vw;overflow: hidden;padding: 5% 3%;background: #fff;border-radius: 30px;box-shadow: 3px 3px 15px 0px #efefef;}
.shaft-detail-cont{display: none;width:100%;}
.shaft-detail-cont img{width:3vw;margin-bottom:2vw;}
.timer-year{padding-left:0px;font-weight:bold;color:#333;font-size:0;}
.icon-year{display: inline-block;vertical-align:middle;width:33px;height:40px;}
.timer-year span{display: inline-block;vertical-align:middle;margin-left:0px;font-size:2vw;color: #222;font-family: "Poppins", sans-serif;}
.month-detail-box{position:relative;width:100%;min-height:93px;padding-top:10px;font-size:0;box-sizing: border-box;white-space: normal;}
.month-detail-box:before{content: '';position:absolute;top:0;left:29.5px;height:100%;border-right:0px dashed #fff;}
.month-detail-box .month-title{position:absolute;font-size:1.3vw;font-weight: bold;color:#fff;line-height: 2.3vw;}
.month-detail-box .month-title:before{content: '';position:absolute;top:50%;left:30px;width:13px;height:13px;margin-top:-6.5px;background: url(../images/icon_circle.png) no-repeat;background-size: cover;}
.incident-record{display:inline-block;padding-left:0px;line-height:2;font-size:1vw;color:#666;}
.incident-record a{font-size:14px;color:#1d69a3;}

/*荣誉资质*/
.zizhi{width:88%;margin:8vw auto;}
.zizhi h3{font-size: 2.5vw;
    color: #222;
    text-align: center;
    margin-bottom: 2.5vw;}
.zizhi ul{width:100%;overflow: hidden;}
.zizhi ul li{width: 7%;
    float: left;
    margin-right: 1%;
    border-radius: 20px;
    background: #efefef;
    padding: 1%;}
.zizhi ul li:nth-child(2n){background: #dfe8ed;}
.zizhi ul li img{width:100%;border-radius: 10px;}
.zizhi p{font-size: 0.9vw;color:#666;width: 24%;
    margin: 2vw 0 0 0;line-height: 1.5vw;text-align: justify;}

.changjing{width:94%;margin:8vw 0% 8vw 6%;overflow: hidden;}
.changjing h3{font-size: 2.5vw;color:#222;    z-index: 999;
    position: relative;}
.changjing h3 span{color: #666; right: 10%;line-height: 1.8vw;
    position: relative;
    font-size: 1.1vw;
    float: right;
    font-weight: normal;}
.marqueeleft{width:100%;overflow:hidden;margin:25vw auto 0 auto;}
.marqueeleft ul{float:left;padding: 10px;}
.marqueeleft li{float:left;margin:0 15px;display:inline;width:400px;overflow:hidden;border: 0px solid #ddd;box-shadow: 3px 3px 15px 0px #efefef;padding: 15px;border-radius: 20px;}
.marqueeleft li .pic{display:block;border:#ccc 0px solid;width:400px;padding:2px;overflow:hidden;}
.marqueeleft li .txt{text-align:center;height:23px;line-height:23px;}
.marqueeleft li img{width:100%;border-bottom:0px solid #d1d0d0;border-radius: 20px;}
.ztu{width: 50%;margin-top: -19vw;margin-bottom:8vw;z-index: 99;
    position: relative;margin-left:4%;}
.ztu h4{position: absolute;font-family: "Poppins", sans-serif;line-height: 3vw; font-weight: 750;
    left: 9vw;
    top: 16vw;
    color: #fff;
    font-size: 3vw;
    z-index: 999;}
.ztu img{width:10vw;border-radius: 20px;position: absolute;left: 3vw;
    top: 10vw;
    z-index: 99;
  height: 10vw; /* 篏���札�号����荀�莪��翫ぇ絨� */
  border-radius: 50%; /* 篏水�倶��筝阪��綵� */
  margin: 50px; /* 羞糸��筝�篋�紊�莨壕�篁ヤ梢茹�絲� */
  animation: spin 2s linear infinite; /* 綺������� */}
@keyframes spin {
  from {
    transform: rotate(0deg); /* 綣�紮���莉���茹�綺� */
  }
  to {
    transform: rotate(360deg); /* 膸�����莉���茹�綺� */
  }
}
/* ========== 移动端样式适配 (不改变原有电脑端代码) ========== */
@media only screen and (max-width: 768px) {
  /* 全局重置与容器 */
 
  .fuwuall,
  .aboutall,
  .digital,
  .zizhi,
  .fazhan,
  .changjing,
  .jch_footall {
   
  }
  img {
    max-width: 100%;
    height: auto;
  }

  .banner {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: -14vw 0 0 0;
    transition: transform 0.3s ease-out;
}

  /* ---------- Banner 区域 ---------- */
  .banner {
    position: relative;
    height: auto;
  }
  .banner img {
    width: 100%;
    height: auto;
    object-fit: cover;
  }
  .banner dd {
    font-size: 4vw;
    top: 15vw;
    left: 5%;
  }
  /* 移除隐藏的ticker影响 */
  #ticker {
    top: 12vw;
    left: 5%;
  }
  #ticker h2 {
    font-size: 5vw;
  }

  /* ---------- About 介绍部分 ---------- */
  .about {
    width: 90%;
    padding: 8% 5%;
    margin: 2vw auto;
  }
  .about h3 {
    font-size:5vw;
    margin-bottom: 5vw;
  }
  .about p {
    width: 100%;
    font-size: 3.5vw;
    line-height: 5vw;
    margin-bottom: 4vw;
  }

  /* ---------- 数字统计模块 (两列布局) ---------- */
  .digital {
    width: 90%;
    margin: 0 auto;
  }
  .mumping_mun {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .mumping_mun li {
    width: 48%;
    margin: 0 0 4vw 0 !important;
    padding: 6vw 0;
    box-sizing: border-box;
  }
  .mun_top {
    width: auto;
    display: flex;
    align-items: baseline;
    justify-content: center;
  }
  .mumping_mun h2 {
    font-size: 8vw;
  }
  .mumping_mun span {
    font-size: 4vw;
    top: 0;
  }
  .mumping_mun dd {
    font-size: 3.5vw;
  }
  .mumping_mun p {
    font-size: 3vw;
  }
  .mumping_mun img {
    width: 40px;
    padding-bottom: 10px;
  }

  /* ---------- 企业文化卡片 (tabs) 移动端优化 ---------- */
  .tabs-container {
    flex-direction: column;
    height: auto;
    gap: 15px;
    margin-top: 20px;
    padding: 0 5%;
  }
  .tab {
    width: 100%;
    min-height: 180px;
    padding: 20px;
    background-size: cover;
  }
  .tab.active,
  .tab:hover {
    flex: 1;
  }
  .tab-title {
    font-size:5vw;
    white-space: normal;
    margin: 2vw 0;
  }
  .tab-desc {
	   font-size:3.5vw;
       width:96%;
        line-height: 2.5;
        background: #ffffff47;
        margin-top: 8vw;
  }
  .tab.active .tab-desc,
  .tab:hover .tab-desc {
    max-height: 200px;
    opacity: 1;
  }

  /* ---------- 荣誉资质 ---------- */
  .zizhi {
    width: 90%;
    margin: 10vw auto;
  }
  .zizhi h3 {
    font-size:5vw;
    margin-bottom: 6vw;
  }
  .zizhi ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .zizhi ul li {
    width:43%;
    margin-right: 0;
    margin-bottom: 3%;
    padding: 2%;
  }
  .zizhi p {
    width: 100%;
    font-size: 3.5vw;
    line-height: 5vw;
    margin-top: 5vw;
    text-align: left;
  }

  /* ---------- 集团子公司 (gdkd) ---------- */
  .gdkd {
    position: relative;
    margin: 5vw 0;
    overflow: hidden;
  }
  .gdkd dd {
    font-size: 5vw;
    top: 5vw;
    left: 5%;
  }
  .gdkd h2 {
    font-size: 3.2vw;
    line-height: 5vw;
    top: 16vw;
    left: 5%;
    width: 90%;
  }
  .gdkd ul {
    position: relative;
    top: auto;
    left: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin:-37vw 0 10vw;
    gap: 15px;
  }
  .gdkd ul li {
    width: 40%;
    margin: 0;
    text-align: center;
	display: none;
  }
  .gdkd ul li img {
    width: 50px;
    margin-top: 0;
  }
  .gdkd ul li dt {
    font-size: 3vw;
  }
  .scaling-image {
    height: auto;
    transform: scale(1) !important;
    width: 100%;
    margin-top:0px;
  }

  /* ---------- 发展历程 ---------- */
  .fazhan {
    width: 90%;
    padding: 8% 5%;
  }
  .fazhan h3 {
    font-size: 6vw;
        background-size: 69%;
        padding: 2vw 0;
  }
  .timer-shaft {
    height: auto;
    overflow-x: auto;
    white-space: nowrap;
    padding-bottom: 10px;
  }
  .timer-scale {
    position: relative;
    white-space: nowrap;
    padding-left: 15px;
  }
  .timer-scale-cont {
   display: inline-block;
        position: relative;
        bottom: 17vw;
        left: -3vw;
  }
  .time-circle {
    width: 11.2vw !important;
    height:11.2vw !important;
    line-height:11.2vw !important;
    font-size:3.5vw !important;
    background: #fff;
    color: #222;
    font-weight: bold;
  }
  .timer-scale-cont.hov .time-circle {
    background: #dfe8ed;
    color: #222;
    font-weight: bold;
}
  .line-scale {
    width:14vw;
  }
  .timer-shaft-content {
    padding:2%;
    margin-top:4vw;
  }
  .timer-year span {
    font-size: 5vw;
  }
  .month-detail-box .incident-record {
    font-size: 3.5vw;
    line-height: 5vw;
  }
  .anniu {
    margin-bottom:9vw;
        width: 30%;
        height: 12vw;
        top:23vw;
        left: 0vw;
        position: relative;
  }
  .timer-left {
        width: 6vw;
        height: 6vw;
        background-size: contain;
        left:6vw;
        top: 4vw;
  }
   .timer-right {
	   width: 6vw;
        height:6vw;
        background-size: contain;
        left:19vw;
        top: 4vw;
   }
   .shaft-detail-cont img {
    margin-top: 3vw;
    width: 8vw;
    margin-bottom: 2vw;}
	.shaft-detail-cont {
    display: none;
    width: 90%;
    margin: 0 4%;
}
  /* ---------- 集团场景滚动区域 ---------- */
  .changjing {
    width: 90%;
    margin: 10vw auto;
  }
  .changjing h3 {
    font-size:5vw;
    margin-bottom: 0px;
  }
  .changjing h3 span {
    font-size: 3.5vw;
    float: none;
    display: block;
    margin-top:6vw;
    line-height: 5vw;
    right: auto;
  }
  .ztu {
    width: 100%;
    margin: 0 0 10vw 0;
    position: relative;
    text-align: center;
	bottom: 38vw;
  }
  .ztu img {
    width: 80px;
    height: 80px;
    position: relative;
    left: auto;
    top: auto;
    margin: 0 auto;
    display: inline-block;
  }
  .ztu h4 {
    font-size: 5vw;
    left: auto;
    top: auto;
    position: static;
    text-align: center;
    margin-top: 10px;
    color: #222;
  }
  .marqueeleft ul {
    float: left;
    padding:0px;
}
  .marqueeleft li {
    width: 260px;
    margin: 0 10px;
  }
  .marqueeleft li .pic {
    width: 100%;
  }
  .marqueeleft li img {
    width: 100%;
    height: auto;
  }
  .marqueeleft {
    width: 100%;
    overflow: hidden;
    margin:-18vw auto 0 auto;
}

  
}

