.title {  font-size: 38px;  color: #616161;  font-style: italic;  font-weight: 800;}
.timeline {  
    width: 100%;  
    /* background-color: #fff;  
    box-shadow: 0 5px 25px 5px rgba(0, 0, 0, 0.2); */
}
.timeline .swiper-container2 {  height: 800px;  width: 100%;  position: relative;}
.timeline .swiper-wrapper2 {  transition: 2s cubic-bezier(0.68, -0.4, 0.27, 1.34) 0.2s;}
.timeline .swiper-slide2 {  position: relative;  color: #fff;  overflow: hidden;  background-size: cover;  
    background-repeat: no-repeat;  background-position: center center;}
.timeline .swiper-slide2::after {  
    content: "";  position: absolute;  z-index: 1;  right: -115%;  bottom: -10%;  width: 100%;  height: 100%; 
      border-radius: 100%;
    }
.timeline .swiper-slide-content {  
    position: absolute;  text-align: center;  width: 80%;   right: 50%;  top: 13%;  -webkit-transform: translate(50%, 0);          
    transform: translate(50%, 0);  font-size: 12px;  z-index: 2;
}.timeline .swiper-slide2 .timeline-year {  
    display: block;  font-style: italic;  font-size: 42px;  margin-bottom: 50px;  font-weight: bold;
    -webkit-transform: translate3d(20px, 0, 0);          transform: translate3d(20px, 0, 0);  
    color: #fff;  font-weight: 300;  opacity: 0;  transition: .2s ease .4s;}
    .timeline .swiper-slide2 .timeline-title {  
        font-weight: 800;  font-size: 34px;  margin: 0 0 30px;  opacity: 0;  -webkit-transform: translate3d(20px, 0, 0);          
        transform: translate3d(20px, 0, 0);  transition: .2s ease .5s;
    }
    .timeline .swiper-slide2 .timeline-text {  
        line-height: 1.5;  opacity: 0;  -webkit-transform: translate3d(20px, 0, 0);          
        transform: translate3d(20px, 0, 0);  transition: .2s ease .6s;}
        .timeline .swiper-slide-active .timeline-year {  opacity: 1;  -webkit-transform: translate3d(0, 0, 0);  font-weight: bold;        
            transform: translate3d(0, 0, 0);  transition: .4s ease 1.6s;
}.timeline .swiper-slide-active .timeline-title {  
    opacity: 1;  -webkit-transform: translate3d(0, 0, 0);          
    transform: translate3d(0, 0, 0);  transition: .4s ease 1.7s;
}
.timeline .swiper-slide-active .timeline-text {  
    opacity: 1;  -webkit-transform: translate3d(0, 0, 0);          
    transform: translate3d(0, 0, 0);  transition: .4s ease 1.8s;
}.timeline .swiper-pagination {  
    right: 13.5% !important;  height: 100%;  
    display: flex;  flex-direction: column;  justify-content: center;  
    font-style: italic;  font-weight: 300;  font-size: 18px;  z-index: 1;
}.timeline .swiper-pagination::before {  
    content: "";  position: absolute;  left: -30px;  top: 0;  height: 100%;  
    width: 1px;  
}.timeline .swiper-pagination-bullet {  
    width: auto;  height: auto;  text-align: center;  
    opacity: 1;  background: transparent;  color: #fff;  
    margin: 15px 0 !important;  position: relative;
}.timeline .swiper-pagination-bullet::before {  
    content: "";  position: absolute;  top: 8px;  
    left: -32.5px;  width: 6px;  height: 6px;  border-radius: 100%;  
    background-color: #fff;  -webkit-transform: scale(0);          
    transform: scale(0);  transition: .2s;}
    .timeline .swiper-pagination-bullet-active {  
        color: #fff;
    }.timeline .swiper-pagination-bullet-active::before {  
        -webkit-transform: scale(1);          transform: scale(1);
    }.timeline .swiper-button-next,.timeline .swiper-button-prev {  
        background-size: 20px 20px;  top: 15%;  width: 20px;  height: 20px;  margin-top: 0;  z-index: 2;  transition: .2s;
    }.timeline .swiper-button-prev {  
        left: 8%;  
        /* background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%230d9447'%2F%3E%3C%2Fsvg%3E"); */
    }
.timeline .swiper-button-prev:hover {  
    -webkit-transform: translateX(-3px);          transform: translateX(-3px);}
.timeline .swiper-button-next {  right: 8%;  
    /* background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%230d9447'%2F%3E%3C%2Fsvg%3E"); */
}
.timeline .swiper-button-next:hover { 
     -webkit-transform: translateX(3px);          transform: translateX(3px);
    }
    @media screen and (min-width: 768px) {  
        .timeline .swiper-slide2::after {    
            right: -30%;    bottom: -8%;    width: 240px;    height: 50%;  
        }  
            .timeline .swiper-slide-content {    
                right: 30%;    top: 50%;    -webkit-transform: translateY(-50%);            
                transform: translateY(-50%);        font-size: 11px;    text-align: right;  }  
.timeline .swiper-slide2 .timeline-year {    margin-bottom: 0;    font-size: 32px;  font-weight: bold;}  
.timeline .swiper-slide2 .timeline-title {    
    color: #fff;;
    font-size: 46px;    margin: 0; 
 }  
    .timeline .swiper-pagination {    display: flex;  }  
    .timeline .swiper-button-prev {    top: 15%;    left: auto;    right: 15%;    -webkit-transform: rotate(90deg) translate(0, 10px);            
        transform: rotate(90deg) translate(0, 10px);  }  
        .timeline .swiper-button-prev:hover {    -webkit-transform: rotate(90deg) translate(-3px, 10px);            
            transform: rotate(90deg) translate(-3px, 10px);  }  
            .timeline .swiper-button-next {    top: auto;    bottom: 15%;    right: 15%;    -webkit-transform: rotate(90deg) translate(0, 10px);            transform: rotate(90deg) translate(0, 10px);  }  .timeline .swiper-button-next:hover {    -webkit-transform: rotate(90deg) translate(3px, 10px);            transform: rotate(90deg) translate(3px, 10px);  }}@media screen and (min-width: 1024px) {  
    .timeline .swiper-slide2::after {   
         right: -20%;    bottom: -12%;    width: 240px;    height: 50%;      
        }  .timeline .swiper-slide-content {    right: 25%;  }}


/* 平板设备 */
@media screen and (min-width: 768px) and (max-width: 1024px) {  
    .timeline .swiper-pagination {    
        /* display: flex;   */
        right: 11.2% !important; /* 调整位置 */
        font-size: 16px; /* 稍微减小字体 */
        width: 100px;
    }
    
    .timeline .swiper-pagination-bullet {
        margin: 10px 0 !important; /* 减小间距 */
    }
}

/* 桌面设备 */
@media screen and (min-width: 1090px) {  
    .timeline .swiper-pagination {    
        display: flex;  
        right: 13.5% !important; /* 保持原来的位置 */
        font-size: 18px;
    }
}

/* 小屏幕移动设备 - 横向显示分页器 */