.banner { margin-bottom: 30px; height:420px; overflow:hidden; } .banner .pagination-pc .swiper-pagination-bullet { background-color: rgba(255, 255, 255, 0.7); opacity: 1; width: 0.18rem; height: 0.18rem; margin: 0 9px !important; } .banner .swiper-pagination-bullet { background-color: rgba(255, 255, 255, 0.7); opacity: 1; } .banner .pagination-pc .swiper-pagination-bullet-active, .banner .swiper-pagination-bullet-active { background-color: rgba(6, 41, 127, 0.7); } .bannerInfo { /* background-color: rgba(27, 27, 27, 0.5);*/ height: 1.4rem; position: absolute; top: 35%; width: 100%; display: flex; align-items: center; } .banner .pagination-pc { height: 0.16rem; bottom: 0.3rem !important; padding-right: 15px; display: flex; justify-content: flex-end; width: 100%; padding-right: 24px; } .banner h2 { letter-spacing:15px; opacity:0.95; text-align:left; color: #ffffff; text-shadow:1px 1px 1px #06297F; font-size: 0.9rem; margin-bottom: 15px; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; } .banner p { letter-spacing:3px; text-align:left; color: #ffffff; opacity:0.95; text-shadow:1px 1px 1px #06297F; font-size: 0.35rem; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; } .bannerInfo-m { background-color: rgba(27, 27, 27, 0.7); height: 50px; position: absolute; bottom: 0; width: 100%; } .bannerInfo-m div { height: 100%; } .bannerInfo-m .info-text { display: flex; flex-direction: column; justify-content: center; } .bannerInfo-m h2 { margin-bottom: 0; } .swiper2 h3 { font-size: 0.18rem; color: #ffffff; } .hot-news-title { height: 30px; display: flex; align-items: center; background-color: rgba(0, 0, 0, 0.6); position: absolute; bottom: 0; left: 0; width: 100%; padding: 0 10px; } .hot-news .swiper-slide { max-width: 100% !important; } .hot-news .swiper-pagination-bullet { background-color: rgba(255, 255, 255, 0.7); opacity: 1; width: 0.08rem; height: 0.08rem; margin: 0 6px !important; } .hot-news .swiper-pagination-bullet { background-color: rgba(255, 255, 255, 0.7); opacity: 1; } .hot-news .swiper-pagination-bullet-active, .hot-news .swiper-pagination-bullet-active { background-color: rgba(6, 41, 127, 0.7); } .hot-news .swiper-pagination { height: 30px; bottom: 0 !important; display: flex; align-items: center; padding-right: 9px; display: flex; justify-content: flex-end; font-size:20px; } .hot-news .swiper-slide .img-responsive{ width:585px; height:350px;} @media (max-width: 768px) { .hot-news .swiper-slide .img-responsive{ width:100%; height:auto;} } .news { background-color: #ffffff; padding: 15px 20px; } .news-header, .videos-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #898989; padding-bottom: 8px; } .news-header h4, .videos-header h4 { font-size: 0.25rem; color: #595959; display: flex; align-items: center; position: relative; } .news-header h4::after, .videos-header h4::after { content: ""; position: absolute; bottom: -11px; width: 100%; height: 3px; background-color: #06297f; } .news-header h4 img, .videos-header h4 img { margin-right: 10px; width: 0.2rem; } .news-header .more, .videos-header .more { color: #8c8c8c; font-size: 0.14rem; } .news > ul { margin: 0; } .news > ul li { display: flex; align-items: center; margin: 17px 0; } .news > ul li:last-child { margin-bottom: 0; } .news > ul li a { width: 100%; display: flex; justify-content: space-between; align-items: center; } .news > ul li a > span:first-child { color: #8c8c8c; font-size: 0.22rem; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; width: 65%; } .news > ul li a > span:last-child { color: #8c8c8c; font-size: 0.14rem; } .news-header > div { display: flex; } .news-header > div ul { margin: 0; display: flex; align-items: center; } .news-header > div ul li { margin-left: 20px; } .news-header > div ul li a { color: #8c8c8c; font-size: 0.2rem; } .main { margin-bottom: 0.3rem; } .inline .news > ul li { display: flex; align-items: center; margin: 12px 0; } #certify .swiper-container { width: 100%; height: 100%; } #certify .swiper-slide { text-align: center; font-size: 18px; background: #fff; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; transition: 300ms; transform: scale(2); opacity: 0.5; } #certify .swiper-slide-active, #certify .swiper-slide-duplicate-active { transform: scale(2.5); opacity: 1; z-index: 1; } #certify .swiper-button-prev { width: 0.22rem; height: 0.22rem; background: url(../images/6.png) no-repeat; background-size: 100%; margin: 0; left: 2px; } #certify .swiper-button-next { width: 0.22rem; height: 0.22rem; background: url(../images/7.png) no-repeat; background-size: 100%; margin: 0; right: 2px; } #certify { width: 90%; margin: 0 auto; height: 65%; } .videos { background-color: #ffffff; box-sizing: content-box; position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .videosWrapper { position: relative; } .videos-header { padding: 15px 20px 8px; margin-bottom: 20px; } @media (max-width: 768px) { .xsBt { margin-bottom: 20px; } .news-header, .news-header h4, .videos-header h4 { font-size: 0.8rem; } .videos-header a{ font-size:0.75rem;} .news > ul li a > span:first-child { font-size:0.8rem; } .news > ul li a > span:nth-child(2) { font-size:0.7rem; } .news-header .more { color: #8c8c8c; font-size: 0.75rem; } .hot-news-title { font-size:0.7rem;} .hot-news-title h3{ font-size:0.7rem;} } #slideBanner{ height:420px;} #slideBanner .swiper1{ height:400px; position:relative;} #slideBanner .pageNav{ width:100%; height:100%; position:absolute; top:0; left:0;} #slideBanner .swiper-slide{ margin:0 auto;} #slideBanner .swiper-slide .bannerInfo{ text-align:center;} #slideBanner .swiper-pagination{ margin-top:370px; margin-left:47%;} #slideBanner .swiper-pagination span{ margin:0 5px; background:#ffffff; opacity:0.8;} #slideBanner .swiper-pagination span.swiper-pagination-bullet-active{ background:#06297F; opacity:1;} #slideBanner .swiper-button-prev{ top:180px; left:50px; width:100px; height:100px; background:url(images/j2.png) no-repeat; z-index:9999;} #slideBanner .swiper-button-next{ top:180px; right:50px; display:block; width:100px; height:100px; background:url(images/j1.png) no-repeat; z-index:9999;} @media (max-width: 768px) { #slideBanner{ height:120px;} #slideBanner .swiper1{ height:100px; position:relative;} #slideBanner .swiper-pagination{ margin-top:75px; margin-left:37%;} #slideBanner .swiper-button-prev{ top:60px; left:10px; width:50px; text-align:right;} #slideBanner .swiper-button-prev img{ height:30px;} #slideBanner .swiper-button-next{ top:60px; right:10px; width:50px;} #slideBanner .swiper-button-next img{ height:30px;} }