@charset "utf-8";
/* CSS Document */

/* banner 开始 */
.index-swiper { width: 100%; height: auto; position: relative; }
.index-banner-swiper .swiper-slide img { width: 100%; }
.index-banner-swiper .swiper-slide-active img { animation: srmgani 4000ms 1 ease forwards; }
@keyframes srmgani {
    0% { transform: scale(1.05); }
    100% { transform: scale(1.0); }
}
.banner-page { position: absolute; left: 8%; bottom: 9%; z-index: 11; }
.banner-pagination { position: absolute; left: auto; top: auto; bottom: 10%; right: 8%; z-index: 8; }
.banner-pagination span { width: 8rem; height: .4rem; display: inline-block; vertical-align: middle; margin: auto 1rem; border-radius: 1rem; overflow: hidden; cursor: pointer; position: relative; outline: none; }
.banner-pagination span::before, .banner-pagination span::after { content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: #FFFFFF; transition: all .4s ease-in; opacity: .5; }
.banner-pagination span::before { z-index: 11; opacity: 1; width: 0; }
.banner-pagination span.swiper-pagination-bullet { opacity: .5; background: #FFFFFF; }
.banner-pagination span.swiper-pagination-bullet-active { opacity: 1; background: #999999; }
.banner-pagination span.swiper-pagination-bullet-active::before { animation: bannerp 4000ms ease forwards; }
@keyframes bannerp {
    0% { width: 0; }
    100% { width: 100%; }
}
.jiantou-prev, .jiantou-next { width: 6rem; height: 6rem; display: inline-block; vertical-align: middle; margin: 0 1rem; cursor: pointer; position: relative; outline: none; }
.jiantou-prev::after, .jiantou-next::after { content: ''; width: 1.6rem; height: 1.3rem; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: url(/img/r1.svg) center no-repeat; background-size: 100%; z-index: 11; }
.jiantou-prev::before, .jiantou-next::before { content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; border: 2px solid #FFFFFF; box-sizing: border-box; transform: skew(-8deg); }
.jiantou-prev::after { transform: translate(-50%, -50%) rotate(180deg); }
.jiantou-prev:hover::before, .jiantou-next:hover::before { background: #007CC2; border: 2px solid #007CC2; }
/* banner 结束 */