.banner .banner .swiper-button-next { right: 10%; } .banner .swiper-button-prev { left: 10%; } .banner { height: 25vw; width: 100%; overflow: hidden; } .banner .swiper-slide a { background-size: cover; } .banner .swiper-slide a { display: block; background-size: cover; width: 100%; height: 25vw; } .banner .swiper-slide a img { height: 100%; } .banner .swiper-pagination-bullet { width: 15px; height: 15px; border-radius: 15px; opacity: 1; background-color: transparent; border: 1px solid #fff; } .banner .swiper-pagination-bullet.swiper-pagination-bullet-active { opacity: 1; background-color: #fff; } .banner .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 7px; } .banner .swiper-container-horizontal > .swiper-pagination-bullets { bottom: 24px; } .banner .swiper-slide { overflow: hidden; } .content-body { background: url(../images/bg.jpg) no-repeat center center; padding: 60px 0 80px 0; width: 100%; } .content-body .top { align-items: flex-start; } .content-body .top .pic-scroll { position: relative; width: 700px; } .news-item .swiper-pagination-bullet, .content-body .top .pic-scroll .swiper-pagination-bullet { width: 11px; height: 11px; opacity: 1; background: rgba(255, 255, 255, 0.6); } .news-item .swiper-pagination-bullet-active, .content-body .top .pic-scroll .swiper-pagination-bullet-active { background: #0164aa; } .news-item .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .content-body .top .pic-scroll .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 2px; } .news-item .swiper-pagination, .content-body .top .pic-scroll .swiper-pagination { text-align: right; right: 5px; } .news-item .swiper-container-horizontal > .swiper-pagination-bullets, .content-body .top .pic-scroll .swiper-container-horizontal > .swiper-pagination-bullets { bottom: 12px; box-sizing: border-box; padding-right: 10px; } .content-body .top .pic-scroll img, .content-body .top .pic-scroll a { display: block; width: 700px; height: 380px; overflow: hidden; } .news-item .swiper-slide img, .news-item .swiper-slide a { display: block; width: 100%; height: 280px; overflow: hidden; } .content-body .news-item .swiper-slide p, .content-body .top .pic-scroll p { position: absolute; left: 0; color: #fff; font-size: 16px; letter-spacing: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; padding: 0; bottom: 0; text-indent: 10px; background: rgba(0, 0, 0, 0.5); line-height: 45px; box-sizing: border-box; text-align: left; padding-right: 100px; box-sizing: border-box; } .news-item .swiper-button-next, .news-item .swiper-button-prev, .content-body .top .pic-scroll .swiper-button-next, .content-body .top .pic-scroll .swiper-button-prev { background: none; top: 50%; width: auto; } .news-item .swiper-button-next::after, .news-item .swiper-button-prev::after, .content-body .top .pic-scroll .swiper-button-next::after, .content-body .top .pic-scroll .swiper-button-prev::after { font-size: 25px; color: #fff; text-shadow: 0px 0px 5px #000; } .content-body .top-right { width: 655px; } .item-title { padding-left: 25px; background: url(../images/icon2.jpg) no-repeat top left; border-bottom: 1px solid #aeaeae; } .item-title .title-text a { font-size: 24px; color: #333; display: block; margin-right: 25px; padding-bottom: 20px; position: relative; margin-top: -4px; } .item-title .title-text a.active { font-weight: bold; } .item-title .title-text a:hover:after, .item-title .title-text a.active::after { content: ""; width: 100%; height: 4px; background-color: #d7111a; display: block; position: absolute; bottom: -2px; } .top .item-title .more{ font-size: 18px; font-weight: normal; transition: all .2s; } .top .item-title .more:hover,.item-title .more:hover{ color: #d7111a; } .item-title .more { color: #999; font-size: 24px; font-weight: bold; transition: all .2s; } .top-right .list-items { margin-top: 30px; display: none; } .top-right .list-items.active { display: block; } .top-right .list-items .item { margin: 17px 0; } .top-right .list-items .item p, .top-right .list-items .item a { font-size: 16px; color: #333; } .top-right .list-items .item p { color: #666; } .top-right .list-items .item a:hover { color: #d92129; } .item-title.title2 { border: none; } .item-title.title2 .title-text { align-items: flex-end; } /* .item-title.title2 .title-text{ } */ .item-title.title2 .ch { font-size: 24px; color: #333; font-weight: bold; margin-right: 10px; } .item-title.title2 .en { font-size: 14px; color: #666; } .content-body .bottom, .content-body .center { margin-top: 60px; align-items: flex-start; } .bottom .news-item, .center .news-item { width: 468px; } .bottom .news-item .swiper-container, .center .news-item .swiper-container{ margin-top: 20px; } .bottom .news-item ul, .center .news-item ul{ margin-top: 30px; } .bottom .news-item li, .center .news-item li { margin: 20px 0; } .bottom .news-item li a, .center .news-item li a{ position: relative; display: block; box-sizing: border-box; padding-left: 15px; color: #333; font-size: 16px; width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .bottom .news-item li a:hover, .center .news-item li a:hover{ color: #d7111a; } .bottom .news-item li a::before, .center .news-item li a::before{ content: ''; width: 5px; height: 5px; border-radius: 5px; background-color: #333; position: absolute; display: block; left: 0; top: 50%; transform: translateY(-50%); } .center-right { padding-top: 47px; } .center-right img{ width: 399px; height: 210px; } .bottom .news-item.part5{ width: 399px; } .item-title.title3{ border-bottom: 1px solid #aeaeae; padding-bottom: 20px; } /*in*/ .in-banner{ width: 100%; overflow: hidden; display: flex; justify-content: center; } .sigle { margin-bottom: 70px; } .sigle.flex-row { align-items: flex-start; } .menu p.title { padding-bottom: 15px; font-size: 20px; border-bottom: 1px solid #e5e5e5; margin-bottom: 20px; font-weight: bold; } .menu ul li a { width: 240px; padding: 0 10px; height: 50px; box-sizing: border-box; background: #f1f1f1; border-radius: 4px; font-size: 16px; color: #333; margin-top: 15px; } .menu ul li a .iconfont { color: #999; font-size: 12px; } .menu ul li a:hover .iconfont, .menu ul li.active .iconfont { color: #fff; } .menu ul li a:hover, .menu ul li a.active { background: #0164aa; color: #fff; } .menu ul li a.active span { color: #fff; } .single-content .news-oper { width: 1100px; } .contnet.flex-row { flex-direction: column; justify-content: flex-start; } .contnet .title { width: 100%; border-bottom: 1px solid #e5e5e5; line-height: 50px; } .contnet .title img{ vertical-align: middle; margin-right: 5px; } .contnet .title p { font-size: 22px; font-weight: bold; letter-spacing: 1px; } .contnet .title p::after{ content: ""; display: block; width: 90px; height: 3px; background: #d7111a; } .contnet .title div .iconfont { font-size: 18px; color: #0164aa; margin-right: 10px; font-weight: bold; } .contnet h3 { text-align: center; margin-top: 20px; margin-bottom: 30px; } .contnet>img { text-align: center; max-width: 100%; height: 450px; } .contnet .title div a{ color: #999; } .news-contnet { color: #333; line-height: 2; width: 878px; overflow: hidden; } .page a { display: block; border: 1px solid #ddd; margin-left: 3px; padding: 7px 13px; color: #333; } .page a.active, .page a:hover { background: #0164aa; border: 1px solid #0164aa; color: #fff; } .contnet .news-list { width: 100%; margin-bottom: 50px; margin-top: 10px; } .news-list li { padding: 20px 0; border-bottom: 1px dotted #e5e5e5; } .news-list li img { width: 194px; height: 132px; overflow: hidden; } .news-item-content { width: 638px; padding-left: 20px; } .news-item-content .news-title { font-weight: bold; font-size: 17px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .news-item-content .news-content { margin-top: 15px; color: #666; line-height: 26px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .news-list .flex-row { align-items: flex-start; } .news-item-content .news-more { display: block; margin-top: 14px; color: #0164aa; } .news-item-content .news-more span { font-size: 14px; font-weight: bold; } .in-news-list{ margin-top: 20px; } .in-news-list li { line-height: 50px; background: url(../images/tb.jpg) no-repeat left center; text-indent: 15px; border-bottom: 1px dotted #e5e5e5; } .in-news-list li span { float: right; color: #999; } .in-news-list li a { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; transition: all .2s; } .in-news-list li a:hover{ color: #d7111a; } .in-news-con { margin-bottom: 50px; } .about-txt { margin-top: 20px; text-align: justify; line-height: 30px; } .new-single-title { text-align: center; font-size: 22px; font-weight: bold; margin-top: 30px; } .news-single-time { text-align: center; color: #999; margin-top: 10px; } .news-oper { border-top: 1px solid #efefef; margin-top: 50px; padding-top: 20px; } .art-page-item { margin-bottom: 10px; } .art-page-item a:hover { font-weight: bold; } .return a { display: block; border: 1px solid #0164aa; color: #0164aa; border-radius: 50px; padding: 7px 20px; font-size: 16px; } .return a:hover { background: #0164aa; color: #fff; } .art-page-item a { color: #999; } .sigle .page.flex-row{ margin-top: 50px; } .page.flex-row{ justify-content: center; margin-top: 50px; margin-bottom: 70px; } .in-pic.product-container .pros{ margin-top: 20px; } .in-pic.product-container{ padding-bottom: 0; } .pic-content.contnet{ width: 1200px; padding-left: 0; border-left: none; } .links { margin-bottom: 20px; } .link-title { width: 100px; font-weight: bold; font-size: 18px; } .link-item { width: 1200px; } .link-item a { display: inline-block; padding-right: 5px; margin-bottom: 5px; margin-right: 5px; color: #666; } .link-item a:last-child { background: none; } .links .flex-row{ align-items: flex-start; } .in-subnav-con.flex-row{ justify-content: center; flex-wrap: wrap; margin-top: 30px; } .in-subnav-con a{ border: 1px solid #ddd; color: #666; padding: 12px 80px; margin: 0 7px 0 7px; font-size: 18px; transition: all .2s; letter-spacing: 1px; } .in-subnav-con a.active,.in-subnav-con a:hover{ background: #0164aa; color: #fff; border: 1px solid #0164aa; font-weight: bold; } .pros .item{ width: 433px; margin-right: 50px; margin-top: 30px; } .pros .item p{ text-align: center; margin-top: 5px; } .pros .item img{ width: 433px; height: 260px; } .pros .item:nth-child(3n){ margin-right: 0; } .pros.flex-row{ flex-wrap: wrap; }