.home .banner { width: 100%; position: relative; }
.home .banner img { width: 100%; display: block; object-fit: cover; }
.home .banner .text { position: absolute; left: 0; bottom: 0; width: 100%; color: white; text-align: center; }
.home .banner .text .p1 { font-size: 40px; }
.home .banner .text .p2 { font-weight: lighter; font-size: 20px; margin: 40px 0 15px 0; }
.home .banner .text .line { width: 1px; height: 240px; background: rgba(242, 242, 242, 0.2); margin: 0 auto; position: relative; overflow: hidden; }
.home .banner .text .line::before { content: ""; display: block; width: 1px; height: 25px; background: #F2F2F2; position: absolute; left: 0; top: 0; animation: down 4s infinite linear; }
@keyframes down {
 from {
 top: 0;
}
 to {
 top: 100%;
}
}
.home .main { width: 80%; margin: 80px auto 0 auto; background: url("../images/hbg.png") no-repeat; background-size: cover; }
.home .main .title { color: #111010; font-size: 34px; font-weight: bolder; border-bottom: 1px solid rgba(38, 51, 70, 0.2); padding-bottom: 30px; }
.home .main .years { width: 100%; margin: 40px 0; display: flex; flex-wrap: wrap; }
.home .main .years .item { width: 125px; background: #E1E1E1; text-align: center; line-height: 47px; color: #333333; font-size: 18px; margin: 0 10px 10px 10px; cursor: pointer; transition: all 600ms; }
.home .main .years .item:hover { background: #1C6FBA; color: white; }
.home .main .years .active { background: #1C6FBA; color: white; }
.home .main .info1 { margin-top: 80px; }
.home .main .info1 .time { color: #1C6FBA; font-size: 24px; }
.home .main .info1 .des { color: #151515; font-size: 20px; line-height: 2; margin-top: 10px; }
.home .main .info2 { margin: 60px 0; position: relative; }
.home .main .info2::before { content: ""; display: block; position: absolute; left: 0; top: 28%; height: 1px; width: 100%; background: #0C4AB0; }
.home .main .info2 .swiper-container { width: 100%; }
.home .main .info2 .swiper-container .swiper-wrapper .swiper-slide { text-align: center; padding: 10px 0; cursor: pointer; }
.home .main .info2 .swiper-container .swiper-wrapper .swiper-slide .circle { width: 9px; height: 9px; background: #1C6FBA; border-radius: 50%; margin: 0 auto; border: 2px solid #1C6FBA; transition: all 600ms; }
.home .main .info2 .swiper-container .swiper-wrapper .swiper-slide p { color: #666666; margin-top: 10px; transition: all 600ms; }
.home .main .info2 .swiper-container .swiper-wrapper .swiper-slide-active .circle { transform: scale(1.2); background: white; }
.home .main .info2 .swiper-container .swiper-wrapper .swiper-slide-active p { color: #1C6FBA; transform: scale(1.3); }
.home .main .pic img { max-width: 100%; object-fit: contain; }

@media screen and (max-width: 1200px) {
.home .banner img { height: 320px; }
.home .banner .text .p1 { font-size: 24px; }
.home .banner .text .p2 { margin: 15px 0; }
.home .banner .text .line { height: 100px; }
.home .main { width: 90%; padding: 0 5%; margin: 40px auto; }
.home .main .title { font-size: 22px; padding-bottom: 15px; }
.home .main .years { margin: 20px 0; flex-wrap: wrap; }
.home .main .info1 { margin-top: 20px; }
.home .main .info1 .des { line-height: 1.85; }
.home .main .info2 { margin: 30px 0; }
}

/*# sourceMappingURL=history.css.map */