#navIndex { position: sticky; }
.bannerBox { position: relative; }
.bannerBox .topbanner { width: 100%; }
.bannerBox .titleBox { width: 70vw; margin: auto; position: absolute; left: 50%; transform: translate(-50%, 0); bottom: 4.5vw; }
.bannerBox .titleBox .t { font-size: 3.3vw; color: #fff; line-height: 4vw; }
.bannerBox .titleBox .line { display: inline-block; width: 8vw; height: 0.4vw; background-color: #fff; margin-top: 4vw; transform: skewX(-30deg); }

/*  */
.mainBox { background-color: #ECECF4; }
.mainBox .navBox { display: flex; align-items: center; justify-content: center; border-bottom: solid 1px #D8D8D8; padding-bottom: 1vw; }
.mainBox .navBox .item { font-size: 1.4vw; color: #040D14; margin: 0 7vw; position: relative; cursor: pointer; }
.mainBox .navBox .active::after { content: ''; position: absolute; width: 30px; height: 4px; background: #005CE6; bottom: -1.2vw; left: 50%; transform: translate(-50%, 0); }
.mainBox .content { width: 80vw; margin: auto; padding: 4vw 0; }
.mainBox .content .listBoxAll { display: flex; flex-wrap: wrap; }
.mainBox .content .listBoxAll .list { flex: 0 0 33.3333%; cursor: pointer; position: relative; margin-bottom: 1vw; border-bottom: 1px solid rgb(68 68 82 / 7%); }
.mainBox .content .listBoxAll .list .listBox { padding: 1.5vw; }
.mainBox .content .listBoxAll .list:nth-child(3n) { margin-right: 0; }
.mainBox .content .listBoxAll .list .imgBox { height: 14vw; overflow: hidden; background-size: cover; background-repeat: no-repeat; background-position: center; }
.mainBox .content .listBoxAll .list .imgBox .img { width: 100%; }
.mainBox .content .listBoxAll .list .name { color: #040D14; font-size: 1vw; line-height: 1.4vw; margin: 1vw 0; height: 3.5vw; display: -webkit-box; -webkit-box-orient: vertical; font-weight: normal; -webkit-line-clamp: 2; text-overflow: ellipsis; overflow: hidden; font-weight: 700; }
.mainBox .content .listBoxAll .list .dsc { color: #444452; font-size: .9vw; display: -webkit-box; -webkit-box-orient: vertical; font-weight: normal; -webkit-line-clamp: 2; text-overflow: ellipsis; overflow: hidden; }
.mainBox .content .listBoxAll .list .time { display: flex; align-items: center; color: #444452; font-size: 1vw; margin-top: 1.5vw; }
.mainBox .content .listBoxAll .list .time .icon { width: 14px; height: 14px; margin-right: 10px; }
.mainBox .content .listBoxAll .list:hover { background-color: #fff; }
.mainBox .content .listBoxAll .list:hover::after { content: ''; position: absolute; width: 60px; height: 6px; background: #005CE6; bottom: 0; left: 50%; transform: translate(-50%, 0); }
.mainBox .content .listBoxAll .list:hover .name { color: #005CE6; }
.tiaoBox { display: flex; align-items: center; margin-left: 1vw; }
.tiaoBox .t { font-size: 1vw; color: #15152F; }
.tiaoBox .input { margin: 0 10px; width: 2vw; height: 2vw; text-align: center; line-height: 2vw; border: 1px solid rgba(229, 229, 229, 1); border-radius: 4px; background-color: transparent; }
.tiaoBox .gong { margin-left: 1vw; }
@media screen and (max-width:1024px) {
  .bannerBox { padding-top: 0; }
  .bannerBox .titleBox { bottom: unset; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); }
  .bannerBox .titleBox .t { font-size: .36rem; line-height: 1.6; font-weight: 700; }
  .bannerBox .titleBox .l { width: 1.5vw; height: 2px; background: #005CE6; margin: auto; }
  .bannerBox .swiperBox { padding: .3rem 0; }
  .bannerBox .swiperBox .swiper-slide { display: block; }
  .bannerBox .swiperBox .swiper-slide .info { margin-left: 0; padding: 0 .3rem .3rem .3rem; }
  .bannerBox .swiperBox .swiper-slide .info .name { font-size: .34rem; line-height: .52rem; margin-top: .3rem; height: 1.04rem; }
  .bannerBox .swiperBox .swiper-slide .imgBox { flex: 1; padding: .3rem; height: 3.6rem; }
  .bannerBox .swiperBox .swiper-slide .info .time { font-size: .24rem; margin: .24rem 0 .4rem 0; }
  .bannerBox .swiperBox .swiper-slide .info .btn { font-size: .26rem; width: 2.1rem; height: .64rem; line-height: .64rem; }
  .mainBox .navBox .item { margin: 0 .7rem; font-size: .32rem; padding-bottom: .2rem; font-weight: 700; }
  .mainBox .content .listBoxAll { display: block; }
  .mainBox .content { padding: 0 .32rem; width: auto; }
  .mainBox .content .listBoxAll .list .listBox { padding: 0; }
  .mainBox .content .listBoxAll .list .name { font-size: .34rem; line-height: .52rem; margin-top: .3rem; height: auto; margin-bottom: 0; font-weight: 700; }
  .mainBox .content .listBoxAll .list .dsc { font-size: .3rem; line-height: .52rem; height: auto; margin: .14rem 0 .32rem 0; }
  .mainBox .content .listBoxAll .list .time { margin-top: 0; font-size: .24rem; }
  .mainBox .content .listBoxAll .list .time .icon { width: .24rem; height: .24rem; margin-right: .1rem; }
  .mainBox .content .listBoxAll .list { flex: 1; border-bottom: none; margin-bottom: .7rem; }
  .bannerBox .content .titleBox .l { width: .3rem; height: 2px; background: #005CE6; margin: auto; }
  .bannerBox .swiperBox .swiper-pagination { left: 50%; transform: translate(-50%, 0); }
  .bannerBox .swiperBox .swiper-pagination .swiper-pagination-bullet-active { width: .3rem; height: .06rem; }
  .bannerBox .swiperBox .swiper-pagination .swiper-pagination-bullet { width: .1rem; height: .06rem; }
  .bannerBox .swiperBox .swiper-container { padding-bottom: .3rem; }
  .mainBox { padding: .8rem 0; }
  .mainBox .content .listBoxAll .list .imgBox { height: auto; }
  .mainBox .content .listBoxAll .list:hover { background-color: unset; }
}