.about .f2 .f2swiper { width: 100%; height: 55rem; background: url(../images/img11.jpg) center no-repeat; background-size: cover !important; }
.about .f2 .f2swiper .history-swiper { width: 100%; height: 50rem; }
.about .f2 .f2swiper .history-swiper .swiper-slide { text-align: center; font-size: 18px; transition: 300ms; transform: scale(1); color: #f4792b; }
.about .f2 .f2swiper .history-swiper .swiper-slide .year { font-size: 24px; margin-top: 5vw; transition: 300ms; font-weight: bold; }
.about .f2 .f2swiper .history-swiper .swiper-slide .year2 { opacity: 0; transition: 300ms; }
.about .f2 .f2swiper .history-swiper .swiper-slide .text { width: 100vw; opacity: 0; left: -150%; position: absolute; }
.about .f2 .f2swiper .history-swiper .swiper-slide .text .name { font-size: 24px; font-weight: bold; margin-bottom: 1vw; }
.about .f2 .f2swiper .history-swiper .swiper-slide .text .des { font-size: 16px; line-height: 1.7; letter-spacing: 1px; text-align: justify; }
.about .f2 .f2swiper .history-swiper .swiper-slide .text .des img{width:auto; margin-top:10px}
.about .f2 .f2swiper .history-swiper .swiper-slide::after { content: ''; position: absolute; width: 100%; height: 1px; background: #f4792b; left: 0; top: 16.7rem; }
.about .f2 .f2swiper .history-swiper .swiper-slide::before { content: ''; position: absolute; width: 10px; height: 10px; background-color: #f4792b; border-radius: 50%; border: 5px solid #f4792b; margin-top: 8.5vw; margin-left: -0.5vw; }
.about .f2 .f2swiper .history-swiper .swiper-slide-active, .about .f2 .f2swiper .history-swiper .swiper-slide-duplicate-active { transform: scale(1); width: 100%; z-index: 200; position: relative; }
.about .f2 .f2swiper .history-swiper .swiper-slide-active .year, .about .f2 .f2swiper .history-swiper .swiper-slide-duplicate-active .year { opacity: 0; }
.about .f2 .f2swiper .history-swiper .swiper-slide-active .year2, .about .f2 .f2swiper .history-swiper .swiper-slide-duplicate-active .year2 { opacity: 1; font-size: 12rem; margin-top: -3.5vw; font-weight: bold; color: #f4792b; }
.about .f2 .f2swiper .history-swiper .swiper-slide-active .text, .about .f2 .f2swiper .history-swiper .swiper-slide-duplicate-active .text { opacity: 1; text-align: center; }
.about .f2 .f2swiper .history-swiper .swiper-slide-active .text .des, .about .f2 .f2swiper .history-swiper .swiper-slide-duplicate-active .text .des { text-align: center; color: #3f3f3f; }
.about .f2 .f2swiper .history-swiper .swiper-slide-active::after { content: inherit; }
.about .f2 .f2swiper .history-swiper .swiper-slide-active::before { content: inherit; }
 @media (max-width: 1770px) {
.about .f2 .f2swiper .history-swiper .swiper-slide::before { margin-top: 9.2vw; }
}
 @media (max-width: 1660px) {
.about .f2 .f2swiper .history-swiper .swiper-slide::before { margin-top: 9.8vw; }
}
 @media (max-width: 1500px) {
.about .f2 .f2swiper .history-swiper .swiper-slide::before { margin-top: 16.2rem; }
}
 @media (max-width: 1440px) {
.about .f2 .f2swiper .history-swiper .swiper-slide::before { margin-top: 16.2rem; }
}
 @media (max-width: 1366px) {
.about .f2 .f2swiper .history-swiper .swiper-slide::before { margin-top: 16.3rem; }
}
 @media (max-width: 1000px) {
.bannerBox { display: block; margin-bottom: 1rem; }
.bannerBox .img { width: 100%; height: 30vh; position: absolute; background-blend-mode: multiply; }
.bannerBox .textBox { width: 100%; height: 30vh; background: transparent; padding-top: 10vh; position: relative; z-index: 10; font-size: 22px; font-weight: bold; }
.bannerBox .textBox .cn::before { content: inherit; }
.bannerBox .textBox .cn::after { content: inherit; }
.about .f2 .f2swiper .history-swiper .swiper-slide-active .year2, .about .f2 .f2swiper .history-swiper .swiper-slide-duplicate-active .year2 { font-size: 3rem; }
.about .f2 .f2swiper .history-swiper .swiper-slide::after { top: 6rem; }
.about .f2 .f2swiper .history-swiper .swiper-slide::before { margin-top: 5.5rem; }
.about .f2 .f2swiper .history-swiper .swiper-slide .text .name { font-size: 20px; }
.about .f2 .f2swiper .history-swiper .swiper-slide .text .des {font-size: 14px;margin: 0 20px;}
.about .f2 .f2swiper .history-swiper .swiper-slide .text { width: 98vw; left: -125%; }
.about .f2 .f2swiper { height: 35rem; }
.about .f2 .f2swiper .history-swiper { height: 30rem; padding-top: 2rem; }
.about .f2 .f2swiper .history-swiper .swiper-slide .text .des img{width:80%;}
.about .f2 .f2swiper {background-size: 200%;}
}
