@keyframes bounces { 0%, 15%, 47%, 73%, 89%, 100% { animation-timing-function: ease-out; transform: translate3d(0, 0, 0); } 30%, 32% { animation-timing-function: ease-in; transform: translate3d(0, -10px, 0); } 60% { animation-timing-function: ease-in; transform: translate3d(0, -8px, 0); } 82% { animation-timing-function: ease-in; transform: translate3d(0, -4px, 0); } 94% { animation-timing-function: ease-in; transform: translate3d(0, -2px, 0); } } .slide-box { position: fixed; top: 50%; right: 0; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); } .slide-box #menu li { width: 6px; height: 6px; background-color: #fff; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; margin-bottom: 1.8rem; } .slide-box #menu li:last-child { display: none; } .slide-box #menu li a { display: block; width: 100%; height: 100%; position: relative; } .slide-box #menu li a:before { content: ''; width: 14px; height: 14px; border-radius: 50%; border: 1px solid #d81f28; position: absolute; left: -4px; top: -4px; opacity: 0; } .slide-box #menu li.active { width: 8px; height: 8px; background-color: #d81f28; } .slide-box #menu li.active a:before { opacity: 1; } .slide-box .line { width: 2px; height: 3rem; background: #fff; position: relative; left: 2px; } .slide-box .text { width: 3.2rem; position: relative; left: -2.5rem; white-space: nowrap; } .slide-box .text span { color: #fff; font-size: 1.2rem; } .slide-box .text span.xian { margin: 0 2px; position: relative; top: -2px; } .slide-box .text span.num { font-size: 1.6rem; } .slide-box .text span.all { font-size: 1rem; } .slide-box.black #menu li { background: #d10004; } .slide-box.black .line { background: #d10004; } .slide-box.black .text span.num { color: #d10004; } .slide-box.black .text span.xian { color: #d10004; } .slide-box.black .text span.all { color: #d10004; } .fp-tableCell { vertical-align: top; } .section01 { overflow: hidden; } .section01 .banner { width: 100%; height: 100%; position: relative; background: #000; } .section01 .banner .swiper-container { height: 100%; } .section01 .banner video { position: absolute; width: 100%; left: 0; top: 0; z-index: 2; height: 100% !important; object-fit: cover; } .section01 .banner .mobile { display: none; } .section01 .banner .swiper-button-prev { width: 3rem; height: 3rem; background: #d10004; left: 12%; margin-top: 0; top: auto; bottom: 8%; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section01 .banner .swiper-button-prev:before { content: '\e601'; font-family: iconfont; font-size: 1.2rem; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .section01 .banner .swiper-button-prev:hover { background: #ff6a21; } .section01 .banner .swiper-button-next { width: 3rem; height: 3rem; background: #d10004; right: auto; left: 16%; margin-top: 0; top: auto; bottom: 8%; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section01 .banner .swiper-button-next:before { content: '\e683'; font-family: iconfont; font-size: 1.2rem; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .section01 .banner .swiper-button-next:hover { background: #ff6a21; } .section01 .banner .swiper-pagination { width: 100%; position: relative; bottom: 9%; display: none; } .section01 .banner .swiper-pagination .swiper-pagination-bullet { width: 2rem; height: 7px; background: #dbdbdb; border-radius: 0; opacity: 1; margin: 0 0.5rem; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section01 .banner .swiper-pagination .swiper-pagination-bullet-active { background: #d10004; } .section01 .banner .mouse { position: absolute; width: 4.4rem; bottom: 0; left: 50%; margin-left: -0.75rem; z-index: 10; cursor: pointer; } .section01 .banner .mouse img { width: 100%; animation-name: bounces; animation-iteration-count: infinite; animation-duration: 3s; animation-fill-mode: both; } .section02 { overflow: hidden; } .section02 .con { position: absolute; top: 52%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .section02 .con .title h2 { font-size: 2.4rem; font-weight: bold; color: #d10004; position: relative; display: inline-block; } .section02 .con .title h2:after { content: ''; width: 2rem; height: 2.3rem; background: url(../img/sign.png) no-repeat; background-size: cover; position: absolute; top: 0.8rem; right: -3rem; } .section02 .con .title h3 { font-family: Dinot; font-size: 1.5rem; color: #b3bcc2; } .section02 .con .news-wrapper { position: absolute; right: 0; top: 8%; } .section02 .con .news-wrapper ul li { float: left; cursor: pointer; width: 6.5rem; height: 2.5rem; background: #fff; text-align: center; line-height: 2.5rem; font-size: 0.9rem; color: #555; margin-left: 1.2rem; box-shadow: 0px 0px 51px 0px rgba(200, 200, 200, 0.53); transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .news-wrapper ul li a { display: block; color: #555; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .news-wrapper ul li:hover { background: #d10004; } .section02 .con .news-wrapper ul li:hover a { color: #fff; } .section02 .con .news-wrapper ul li.active { background: #d10004; } .section02 .con .news-wrapper ul li.active a { color: #fff; } .section02 .con .con-list { margin-top: 5%; position: relative; } .section02 .con .con-list .more { width: 6.5rem; height: 2.5rem; background: #d10004; position: absolute; right: 0; z-index: 10; bottom: -1.5rem; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .more a { display: block; width: 100%; height: 100%; text-align: center; line-height: 2.5rem; color: #fff; font-size: 0.9rem; } .section02 .con .con-list .more:hover { background: #ff6a21; } .section02 .con .con-list .box1 { position: relative; } .section02 .con .con-list .box1 .box-con .left { float: left; width: 48.9%; position: relative; } .section02 .con .con-list .box1 .box-con .left a { display: block; } .section02 .con .con-list .box1 .box-con .left a .tu { height: 0; padding-bottom: 65%; overflow: hidden; } .section02 .con .con-list .box1 .box-con .left a .tu img { width: 100%; } .section02 .con .con-list .box1 .box-con .left a .text { position: absolute; width: 100%; background: rgba(0, 0, 0, 0.7); left: 0; bottom: 0; padding: 1.2rem; } .section02 .con .con-list .box1 .box-con .left a .text h3 span { font-size: 0.7rem; color: #e2d1c0; } .section02 .con .con-list .box1 .box-con .left a .text h3 span.xian { margin: 0 0.4rem; } .section02 .con .con-list .box1 .box-con .left a .text h2 { font-size: 1.2rem; font-weight: bold; color: #fff; -webkit-line-clamp: 1; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 1.5em; margin-top: 0.4rem; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box1 .box-con .left:hover a .tu img { transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); } .section02 .con .con-list .box1 .box-con .left:hover a .text h2 { color: #d10004; } .section02 .con .con-list .box1 .box-con .right { float: right; width: 48.9%; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li { float: left; width: 47.6%; position: relative; overflow: hidden; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child { width: 100%; box-shadow: 0px 10px 10px -10px rgba(214, 214, 214, 0.5); } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a { display: block; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .tu { display: none; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .text { background: #fff; padding: 1.2rem 1.5rem; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .text .txt h3 { font-size: 0.8rem; color: #999; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .text .txt h3 .time_t { display: inline-block; color: #d8222b; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .text .txt h3 .time_t .date { font-size: 1.2rem; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .text .txt h3 .time_t .xian { margin: 0 0.4rem; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .text .txt h3 .xian { margin: 0 0.4rem; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .text .txt h3 .time_b { display: none; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .text .txt h2 { font-size: 1.2rem; font-weight: bold; color: #212121; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 3em; margin: 0.5rem 0 0.6rem; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .text .txt > p { font-size: 0.7rem; color: #656565; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 3em; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .mask { position: absolute; width: 100%; height: 100%; left: 0; top: 100%; background: url(../img/n_bg.jpg) no-repeat right bottom; background-size: cover; opacity: 0; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .mask .center { position: absolute; width: 90%; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .mask .center h2 { font-size: 1rem; font-weight: bold; color: #fff; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 3em; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .mask .center p { font-size: 0.7rem; color: #fff; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 3em; margin: 0.6rem 0 1.2rem; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .mask .center h3 { font-size: 0.7rem; color: #fff; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .mask .center h3 .xian { margin: 0 0.4rem; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child:hover a .mask { top: 0; opacity: 1; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(2) { margin-right: 4.8%; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) { margin-top: 1.1rem; position: relative; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a { display: block; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .tu { height: 0; padding-bottom: 64%; overflow: hidden; position: relative; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .tu:before { content: ''; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); position: absolute; left: 0; top: 0; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .tu img { width: 100%; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .text { padding: 0 0.8rem 0.8rem 0.8rem; position: absolute; width: 100%; bottom: 0; left: 0; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .text .txt h3 { font-size: 0.7rem; color: #fff; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .text .txt h3 .time_t { display: none; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .text .txt h3 .xian { margin: 0 0.4rem; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .text .txt h3 .time_b { display: inline-block; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .text .txt h3 .time_b span { font-size: 0.7rem; color: #fff; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .text .txt h2 { font-size: 1rem; font-weight: bold; color: #fff; -webkit-line-clamp: 1; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 1.5em; margin-top: 0.2rem; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .text .txt > p { display: none; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .mask { position: absolute; width: 100%; height: 100%; left: 0; top: 100%; background: url(../img/n_bg.jpg) no-repeat center center; background-size: cover; opacity: 0; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .mask .center { position: absolute; width: 90%; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .mask .center h2 { font-size: 1rem; font-weight: bold; color: #fff; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 3em; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .mask .center p { font-size: 0.7rem; color: #fff; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 3em; margin: 0.6rem 0 1.2rem; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .mask .center h3 { font-size: 0.7rem; color: #fff; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .mask .center h3 .xian { margin: 0 0.4rem; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2):hover a .mask { top: 0; opacity: 1; } .section02 .con .con-list .box1 .swiper-button-next { width: 3rem; height: 3rem; background: none; margin-top: 0; top: 34%; right: -6rem; line-height: 3rem; text-align: center; } .section02 .con .con-list .box1 .swiper-button-next:before { content: '\e683'; font-family: iconfont; width: 100%; font-size: 3rem; position: absolute; left: 0; top: 0; color: #bbb; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box1 .swiper-button-next:hover:before { color: #d10004; } .section02 .con .con-list .box1 .swiper-button-prev { width: 3rem; height: 3rem; background: none; margin-top: 0; top: 34%; left: -6rem; line-height: 3rem; text-align: center; } .section02 .con .con-list .box1 .swiper-button-prev:before { content: '\e601'; font-family: iconfont; width: 100%; font-size: 3rem; position: absolute; left: 0; top: 0; color: #bbb; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box1 .swiper-button-prev:hover:before { color: #d10004; } .section02 .con .con-list .box1 .swiper-pagination { width: 100%; position: relative; z-index: 2; margin-top: 1.5rem; } .section02 .con .con-list .box1 .swiper-pagination .swiper-pagination-bullet { width: 2rem; height: 7px; background: #dbdbdb; border-radius: 0; opacity: 1; margin: 0 0.5rem; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box1 .swiper-pagination .swiper-pagination-bullet-active { background: #d10004; } .section02 .con .con-list .box2 { position: relative; } .section02 .con .con-list .box2 .box-con .left { float: left; width: 35%; } .section02 .con .con-list .box2 .box-con .left a { display: block; } .section02 .con .con-list .box2 .box-con .left a .tu { height: 0; padding-bottom: 59%; overflow: hidden; border-bottom: 3px solid #d10004; } .section02 .con .con-list .box2 .box-con .left a .tu img { width: 100%; } .section02 .con .con-list .box2 .box-con .left a h2 { padding-right: 1rem; font-size: 1.2rem; font-weight: bold; color: #000; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 3em; margin: 0.8rem 0 1rem; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box2 .box-con .left a h3 { font-size: 0.7rem; color: #999; } .section02 .con .con-list .box2 .box-con .left:hover a .tu img { transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); } .section02 .con .con-list .box2 .box-con .left:hover a h2 { color: #d10004; } .section02 .con .con-list .box2 .box-con .right { float: right; width: 61%; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li { float: left; width: 48%; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:not(:nth-child(even)) { margin-right: 4%; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li .tu img { width: 100%; object-fit: cover; object-position: center; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(-n+2) .tu { display: none; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(-n+2) .text .txt h2 { position: relative; font-size: 1.2rem; font-weight: bold; color: #333; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 3em; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(-n+2) .text .txt p { margin: 1.2rem 0 1rem; font-size: 0.7rem; color: #666; -webkit-line-clamp: 3; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 4.5em; line-height: 1.6; height: 4.8em; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(-n+2) .text .txt h3 { font-size: 0.7rem; color: #999; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(-n+2):hover .text h2 { color: #d10004; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(n+3) { margin-top: 8%; position: relative; border: 1px solid #e8e6e4; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(n+3) .tu { float: left; width: 43.9%; height: 0; padding-bottom: 26.8%; overflow: hidden; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(n+3) .tu img { width: 100%; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(n+3) .text { float: right; width: 56.1%; position: absolute; height: 100%; right: 0; top: 0; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(n+3) .text .txt { position: absolute; width: 86%; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(n+3) .text .txt h2 { font-size: 0.8rem; color: #666; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 3em; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(n+3) .text .txt p { display: none; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(n+3) .text .txt h3 { font-size: 0.7rem; color: #999; margin-top: 1rem; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(n+3):hover .text h2 { color: #d10004; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:hover .tu img { transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); } .section02 .con .con-list .box2 .swiper-button-next { width: 3rem; height: 3rem; background: none; margin-top: 0; top: 30%; right: -6rem; line-height: 3rem; text-align: center; } .section02 .con .con-list .box2 .swiper-button-next:before { content: '\e683'; font-family: iconfont; width: 100%; font-size: 3rem; position: absolute; left: 0; top: 0; color: #bbb; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box2 .swiper-button-next:hover:before { color: #d10004; } .section02 .con .con-list .box2 .swiper-button-prev { width: 3rem; height: 3rem; background: none; margin-top: 0; top: 30%; left: -6rem; line-height: 3rem; text-align: center; } .section02 .con .con-list .box2 .swiper-button-prev:before { content: '\e601'; font-family: iconfont; width: 100%; font-size: 3rem; position: absolute; left: 0; top: 0; color: #bbb; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box2 .swiper-button-prev:hover:before { color: #d10004; } .section02 .con .con-list .box2 .swiper-pagination { width: 100%; position: relative; z-index: 2; margin-top: 1.5rem; } .section02 .con .con-list .box2 .swiper-pagination .swiper-pagination-bullet { width: 2rem; height: 7px; background: #dbdbdb; border-radius: 0; opacity: 1; margin: 0 0.5rem; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box2 .swiper-pagination .swiper-pagination-bullet-active { background: #d10004; } .section02 .con .con-list .box3 { position: relative; } .section02 .con .con-list .box3 .box-con .left { float: left; width: 23%; } .section02 .con .con-list .box3 .box-con .left .swiper-slide { height: 0; padding-bottom: 149%; overflow: hidden; } .section02 .con .con-list .box3 .box-con .left .swiper-slide a { display: block; } .section02 .con .con-list .box3 .box-con .left .swiper-slide a img { width: 100%; } .section02 .con .con-list .box3 .box-con .left .swiper-slide:hover a img { transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); } .section02 .con .con-list .box3 .box-con .left .swiper-pagination { bottom: 1.5rem; text-align: right; right: 1.5rem; left: auto; } .section02 .con .con-list .box3 .box-con .left .swiper-pagination .swiper-pagination-bullet { width: 1.2rem; height: 4px; background: #dbdbdb; border-radius: 0; opacity: 1; margin: 0 0.2rem; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box3 .box-con .left .swiper-pagination .swiper-pagination-bullet-active { background: #d10004; } .section02 .con .con-list .box3 .box-con .right { float: right; width: 74%; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li { float: left; width: 48.4%; background: rgba(255, 255, 255, 0.8); padding: 1.6rem; position: relative; box-shadow: 0px 10px 10px -10px rgba(214, 214, 214, 0.5); } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li:before { content: ''; width: 0; height: 2px; background: #d81f28; position: absolute; left: 0; bottom: 0; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li:not(:nth-child(even)) { margin-right: 3.2%; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li:nth-child(n+3) { margin-top: 1.6rem; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li a { display: block; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li a .text h2 { font-size: 1rem; font-weight: bold; color: #333; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 3em; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li a .text p { font-size: 0.7rem; color: #777; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 3em; margin: 0.8rem 0 1.4rem; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li a .text h3 { font-size: 0.7rem; color: #777; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li a .text h3 span:nth-child(2) { margin: 0 0.4rem; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li a .text h3 span:last-child { color: #d10004; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li a .more { position: absolute; right: 2.8rem; bottom: 1.6rem; width: 2rem; height: 2rem; border-radius: 50%; background: #d81f28; opacity: 0; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li a .more span { position: absolute; font-size: 1rem; color: #fff; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li:hover:before { width: 100%; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li:hover a .text h2 { color: #d81f28; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li:hover a .more { right: 1.8rem; opacity: 1; } .section02 .con .con-list .box3 .swiper-button-next { width: 3rem; height: 3rem; background: none; margin-top: 0; top: 30%; right: -6rem; line-height: 3rem; text-align: center; } .section02 .con .con-list .box3 .swiper-button-next:before { content: '\e683'; font-family: iconfont; width: 100%; font-size: 3rem; position: absolute; left: 0; top: 0; color: #bbb; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box3 .swiper-button-next:hover:before { color: #d10004; } .section02 .con .con-list .box3 .swiper-button-prev { width: 3rem; height: 3rem; background: none; margin-top: 0; top: 30%; left: -6rem; line-height: 3rem; text-align: center; } .section02 .con .con-list .box3 .swiper-button-prev:before { content: '\e601'; font-family: iconfont; width: 100%; font-size: 3rem; position: absolute; left: 0; top: 0; color: #bbb; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box3 .swiper-button-prev:hover:before { color: #d10004; } .section02 .con .con-list .box3 > .swiper-pagination { width: 100%; position: relative; margin-top: 1.5rem; z-index: 2; } .section02 .con .con-list .box3 > .swiper-pagination .swiper-pagination-bullet { width: 2rem; height: 7px; background: #dbdbdb; border-radius: 0; opacity: 1; margin: 0 0.5rem; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section02 .con .con-list .box3 > .swiper-pagination .swiper-pagination-bullet-active { background: #d10004; } .section03 { overflow: hidden; position: relative; } .section03 .filter { position: absolute; z-index: 1; width: 100%; height: 100%; left: 0; top: 0; overflow: hidden; background-repeat: no-repeat; background-size: cover; transform: scale(1.01); -webkit-transform: scale(1.01); -moz-transform: scale(1.01); -ms-transform: scale(1.01); } .section03 .filter img { width: 100%; object-fit: cover; object-position: center; } .section03 .filter:before { content: ''; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); position: absolute; top: 0; left: 0; } .section03 .gray { position: absolute; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3); top: 0; left: 0; z-index: 2; } .section03 .con { position: absolute; top: 52%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); z-index: 3; } .section03 .con .title h2 { font-size: 2.4rem; font-weight: bold; color: #fff; position: relative; display: inline-block; } .section03 .con .title h2:after { content: ''; width: 2rem; height: 2.3rem; background: url(../img/sign.png) no-repeat; background-size: cover; position: absolute; top: 0.8rem; right: -3rem; } .section03 .con .title h3 { font-family: Dinot; font-size: 1.5rem; color: #bbb; } .section03 .con .company-wrapper { width: 100%; margin-top: 2%; } .section03 .con .company-wrapper ul { display: flex; justify-content: center; } .section03 .con .company-wrapper ul li { width: 6.5rem; height: 2.5rem; position: relative; } .section03 .con .company-wrapper ul li a { display: block; text-align: center; font-size: 0.9rem; color: #fff; line-height: 2.5rem; } .section03 .con .company-wrapper ul li:before { content: ''; width: 100%; height: 100%; background: #fff; opacity: 0.3; position: absolute; left: 0; top: 0; z-index: -1; } .section03 .con .company-wrapper ul li:not(:last-child) { margin-right: 0.8rem; } .section03 .con .company-wrapper ul li:hover:before { background-image: linear-gradient(0deg, #810000 0%, #ad1014 35%, #d81f28 100%); box-shadow: 0px 20px 20px 0px rgba(143, 0, 0, 0.35); opacity: 0.8; } .section03 .con .company-wrapper ul li.active:before { background-image: linear-gradient(0deg, #810000 0%, #ad1014 35%, #d81f28 100%); box-shadow: 0px 20px 20px 0px rgba(143, 0, 0, 0.35); opacity: 0.8; } .section03 .con .company-box { margin-top: 5%; } .section03 .con .company-box .box .left { float: left; width: 41.2%; position: relative; } .section03 .con .company-box .box .left .swiper-slide h2 { font-size: 2rem; font-weight: bold; color: #fff; -webkit-line-clamp: 1; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 1.5em; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section03 .con .company-box .box .left .swiper-slide p { font-size: 0.9rem; color: #fff; opacity: 0.9; -webkit-line-clamp: 3; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 4.5em; margin: 6% 0 4%; } .section03 .con .company-box .box .left .swiper-slide h3 { position: relative; left: 0; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section03 .con .company-box .box .left .swiper-slide h3 span { color: #fff; font-size: 1.2rem; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section03 .con .company-box .box .left .swiper-slide:hover h2 { color: #d10004; } .section03 .con .company-box .box .left .swiper-slide:hover h3 { left: 0.5rem; } .section03 .con .company-box .box .left .swiper-slide:hover h3 span { color: #d10004; } .section03 .con .company-box .box .left .swiper-button-next { display: inline-block; width: 3rem; height: 3rem; border-radius: 50%; background: rgba(0, 0, 0, 0.3); margin-top: 13%; margin-left: 1.2rem; position: relative; top: 0; right: 0; line-height: 3rem; text-align: center; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section03 .con .company-box .box .left .swiper-button-next:before { content: '\e683'; font-family: iconfont; width: 100%; font-size: 1rem; position: absolute; left: 0; top: 0; color: #fff; } .section03 .con .company-box .box .left .swiper-button-next:hover { background: #d10004; } .section03 .con .company-box .box .left .swiper-button-prev { display: inline-block; width: 3rem; height: 3rem; border-radius: 50%; background: rgba(0, 0, 0, 0.3); margin-top: 13%; position: relative; top: 0; left: 0; line-height: 3rem; text-align: center; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section03 .con .company-box .box .left .swiper-button-prev:before { content: '\e601'; font-family: iconfont; width: 100%; font-size: 1rem; position: absolute; left: 0; top: 0; color: #fff; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section03 .con .company-box .box .left .swiper-button-prev:hover { background: #d10004; } .section03 .con .company-box .box .left .box-text { position: absolute; bottom: 1.5rem; right: 0; } .section03 .con .company-box .box .left .box-text span { color: rgba(255, 255, 255, 0.5); font-size: 1.2rem; } .section03 .con .company-box .box .left .box-text span.xian { margin: 0 6px; position: relative; top: -0.5rem; } .section03 .con .company-box .box .left .box-text span.box-num { font-size: 1.1rem; font-family: Dinot_bold; color: #d10004; position: relative; top: -1rem; left: 3px; } .section03 .con .company-box .box .left .box-text span.box-all { font-size: 1.1rem; font-family: Dinot_bold; color: rgba(255, 255, 255, 0.4); position: relative; left: -3px; } .section03 .con .company-box .box .right { float: right; width: 53%; height: 0; padding-bottom: 29%; overflow: hidden; position: relative; top: -2rem; } .section03 .con .company-box .box .right img { width: 100%; } .section03 .con .company-box .box .right .video-btn { width: 3rem; height: 3rem; border-radius: 50%; background: #d10004; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); cursor: pointer; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section03 .con .company-box .box .right .video-btn span { font-size: 1.2rem; color: #fff; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .section03 .con .company-box .box .right .video-btn:hover { background: #ff6a21; } .section04 { overflow: hidden; position: relative; } .section04 .con { position: absolute; top: 52%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .section04 .con .title h2 { font-size: 2.4rem; font-weight: bold; color: #d10004; position: relative; display: inline-block; } .section04 .con .title h2:after { content: ''; width: 2rem; height: 2.3rem; background: url(../img/sign.png) no-repeat; background-size: cover; position: absolute; top: 0.8rem; right: -3rem; } .section04 .con .title h3 { font-family: Dinot; font-size: 1.5rem; color: #d6b683; } .section04 .con .more { position: absolute; width: 6.5rem; height: 2.5rem; background: #d10004; right: 0; top: 2.5rem; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section04 .con .more a { display: block; font-size: 0.9rem; color: #fff; text-align: center; line-height: 2.5rem; } .section04 .con .more:hover { background: #ff6a21; } .section04 .con .con-bottom { margin-top: 3%; } .section04 .con .con-bottom .swiper-container { padding-bottom: 8rem; padding-top: 5rem; } .section04 .con .con-bottom .swiper-wrapper .swiper-slide { z-index: 1; } .section04 .con .con-bottom .swiper-wrapper .swiper-slide a { display: block; position: relative; } .section04 .con .con-bottom .swiper-wrapper .swiper-slide a:before { content: ''; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3); position: absolute; top: 0; left: 0; opacity: 1; } .section04 .con .con-bottom .swiper-wrapper .swiper-slide a img { width: 100%; } .section04 .con .con-bottom .swiper-wrapper .swiper-slide-active { z-index: 4 !important; } .section04 .con .con-bottom .swiper-wrapper .swiper-slide-active a { box-shadow: 20px 20px 30px 0px rgba(0, 0, 0, 0.2); position: absolute; width: 40rem; overflow: hidden; top: -5rem; left: 50%; margin-left: -20rem; } .section04 .con .con-bottom .swiper-wrapper .swiper-slide-active a:before { opacity: 0; } .section04 .con .con-bottom .swiper-wrapper .swiper-slide-active:hover a img { transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); } .section04 .con .con-bottom .swiper-pagination { bottom: 0; } .section04 .con .con-bottom .swiper-pagination .swiper-pagination-bullet { width: 2rem; height: 7px; background: #dbdbdb; border-radius: 0; opacity: 1; margin: 0 0.5rem; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section04 .con .con-bottom .swiper-pagination .swiper-pagination-bullet-active { background: #d10004; } .section04 .con .con-bottom .swiper-button-prev { width: 3rem; height: 3rem; background: none; left: -5rem; margin-top: 0; top: 50%; } .section04 .con .con-bottom .swiper-button-prev:before { content: '\e601'; font-family: iconfont; font-size: 3rem; color: #acacac; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section04 .con .con-bottom .swiper-button-prev:hover:before { color: #d10004; } .section04 .con .con-bottom .swiper-button-next { width: 3rem; height: 3rem; background: none; right: -5rem; margin-top: 0; top: 50%; } .section04 .con .con-bottom .swiper-button-next:before { content: '\e683'; font-family: iconfont; font-size: 3rem; color: #acacac; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section04 .con .con-bottom .swiper-button-next:hover:before { color: #d10004; } .section05 { overflow: hidden; } .section05 .con { position: absolute; top: 52%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .section05 .con .title h2 { font-size: 2.4rem; font-weight: bold; color: #fff; position: relative; display: inline-block; } .section05 .con .title h2:after { content: ''; width: 2rem; height: 2.3rem; background: url(../img/sign.png) no-repeat; background-size: cover; position: absolute; top: 0.8rem; right: -3rem; } .section05 .con .title h3 { font-family: Dinot; font-size: 1.5rem; color: #bbb; opacity: 0.4; } .section05 .con .con-list { margin-top: 4%; } .section05 .con .con-list ul li { float: left; width: 13.8%; height: 28rem; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section05 .con .con-list ul li:not(:last-child) { margin-right: 2.9%; } .section05 .con .con-list ul li a { display: block; } .section05 .con .con-list ul li .top { height: 19rem; position: relative; } .section05 .con .con-list ul li .top h2 { font-size: 2.4rem; color: #fff; text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.27); display: inline-block; position: absolute; top: 3.2rem; left: 2.4rem; opacity: 0; } .section05 .con .con-list ul li .top h2:before { content: ''; width: 100%; height: 3px; background: #d10004; position: absolute; bottom: -0.8rem; left: 0; } .section05 .con .con-list ul li .top p { width: 88%; position: absolute; bottom: 1.8rem; left: 1.4rem; font-size: 0.8rem; color: #fff; opacity: 0; } .section05 .con .con-list ul li .top .more { width: 2.5rem; height: 2.5rem; border-radius: 50%; line-height: 2.5rem; text-align: center; position: absolute; top: 2.5rem; right: 3.5rem; background: #d10004; opacity: 0; } .section05 .con .con-list ul li .top .more span { font-size: 1.2rem; color: #fff; } .section05 .con .con-list ul li .top:before { content: ''; width: 100%; height: 100%; background: url(../img/n_bg.png) no-repeat left bottom; position: absolute; left: 0; bottom: 0; opacity: 0; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .section05 .con .con-list ul li .bottom { height: 9rem; background: rgba(0, 0, 0, 0.3); position: relative; } .section05 .con .con-list ul li .bottom h2 { width: 66px; font-size: 1.4rem; color: #fff; position: absolute; top: 1.2rem; left: 1.2rem; } .section05 .con .con-list ul li .bottom h3 { font-size: 0.8rem; color: rgba(255, 255, 255, 0.6); position: absolute; left: 1.2rem; bottom: 1.2rem; } .section05 .con .con-list ul li.active { width: 66.6%; } .section05 .con .con-list ul li.active .top { height: 28rem; } .section05 .con .con-list ul li.active .top h2 { top: 2.2rem; opacity: 1; transition: all 0.5s ease 0.5s; -webkit-transition: all 0.5s ease 0.5s; -moz-transition: all 0.5s ease 0.5s; -ms-transition: all 0.5s ease 0.5s; } .section05 .con .con-list ul li.active .top p { left: 2.4rem; opacity: 1; transition: all 0.5s ease 0.8s; -webkit-transition: all 0.5s ease 0.8s; -moz-transition: all 0.5s ease 0.8s; -ms-transition: all 0.5s ease 0.8s; } .section05 .con .con-list ul li.active .top .more { right: 2.5rem; opacity: 1; transition: all 0.5s ease 1.1s; -webkit-transition: all 0.5s ease 1.1s; -moz-transition: all 0.5s ease 1.1s; -ms-transition: all 0.5s ease 1.1s; } .section05 .con .con-list ul li.active .top:before { opacity: 1; } .section05 .con .con-list ul li.active .bottom { display: none; } @media screen and (max-width: 1440px) { .section01 .banner .swiper-button-next { left: 16.5%; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .text { padding: 1.1rem 1.5rem; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .text .txt h2 { font-size: 1.1rem; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .text .txt p { font-size: 13px; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(-n+2) .text .txt p { font-size: 13px; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(n+3) .text .txt h2 { font-size: 14px; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li { padding: 1.4rem; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li a .text p { font-size: 13px; margin: 0.8rem 0 1.1rem; } .section05 .con .con-list ul li { height: 27rem; } .section05 .con .con-list ul li .top { height: 19rem; } .section05 .con .con-list ul li .top p { font-size: 14px; } .section05 .con .con-list ul li .bottom { height: 8rem; } .section05 .con .con-list ul li.active .top { height: 27rem; } } @media screen and (max-width: 1366px) { .slide-box .text { width: 2.2rem; left: -2.5rem; margin-top: 1rem; } .slide-box .text span.num { font-size: 22px; } .slide-box .text span.xian { margin: 0 2px; } .slide-box .text span.all { font-size: 14px; } .slide-box .line { height: 2rem; } .section02 .con { top: 53%; } .section02 .con .title h2 { font-size: 2rem; } .section02 .con .title h3 { font-size: 1.2rem; } .section02 .con .news-wrapper ul li { font-size: 14px; } .section02 .con .con-list { margin-top: 4%; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .text .txt h2 { font-size: 16px; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) { margin-top: 1rem; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li { padding: 1.2rem; } .section03 .con { top: 53%; } .section03 .con .title h2 { font-size: 2rem; } .section03 .con .title h3 { font-size: 1.2rem; } .section03 .con .company-wrapper ul li a { font-size: 14px; } .section03 .con .company-box .box .left .swiper-slide h2 { font-size: 1.6rem; } .section03 .con .company-box .box .left .swiper-slide p { font-size: 16px; } .section04 .con .title h2 { font-size: 2rem; } .section04 .con .title h3 { font-size: 1.2rem; } .section04 .con .con-top { top: 53%; } .section04 .con .con-top .title h2 { font-size: 2rem; } .section04 .con .con-top .title h3 { font-size: 1.2rem; } .section04 .con .con-top .news-wrapper ul li { font-size: 14px; } .section04 .con .more a { font-size: 14px; } .section05 .con .title h2 { font-size: 2rem; } .section05 .con .title h3 { font-size: 1.2rem; } .section05 .con .con-list { margin-top: 3%; } .section05 .con .con-list ul li { height: 26rem; } .section05 .con .con-list ul li .top { height: 19rem; } .section05 .con .con-list ul li .top h2 { font-size: 1.8rem; } .section05 .con .con-list ul li .top p { font-size: 14px; } .section05 .con .con-list ul li .bottom { height: 7rem; } .section05 .con .con-list ul li .bottom h2 { font-size: 1.2rem; width: 50px; top: 12px; left: 12px; } .section05 .con .con-list ul li .bottom h3 { font-size: 14px; left: 12px; bottom: 12px; } .section05 .con .con-list ul li.active .top { height: 26rem; } } @media screen and (max-width: 1200px) { .section02 .con .news-wrapper { right: 60px; } .section04 .con .con-bottom .swiper-button-next { right: 0; } .section04 .con .con-bottom .swiper-button-prev { left: 0; } .section04 .con .more { right: 60px; } } @media screen and (max-width: 1024px) { .slide-box { display: none; } .section01 { height: 530px; margin-top: 70px; } .section01 .banner .swiper-pagination { display: block; } .section01 .banner .swiper-button-next { display: none; } .section01 .banner .swiper-button-prev { display: none; } .section01 .banner .mouse { display: none; } .section02 { padding-bottom: 50px; } .section02 .con { position: relative; top: 0; left: 0; transform: translate(0%, 0%); -webkit-transform: translate(0%, 0%); -moz-transform: translate(0%, 0%); -ms-transform: translate(0%, 0%); } .section02 .con .title { padding-top: 30px; } .section02 .con .title h2:after { width: 22px; height: 25px; top: 10px; right: -30px; } .section02 .con .news-wrapper { top: 46px; right: 60px; } .section02 .con .con-list { margin-top: 30px; } .section02 .con .con-list .box1 .box-con .left a .text h3 span { font-size: 12px; } .section02 .con .con-list .box1 .box-con .left a .text h2 { font-size: 16px; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .text { padding: 17px 20px; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:first-child a .text .txt h2 { -webkit-line-clamp: 1; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 1.5em; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .text .txt h3 { font-size: 12px; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li:nth-child(n+2) a .text .txt h2 { font-size: 14px; } .section02 .con .con-list .box1 .box-con .right .swiper-slide ul li a .mask { display: none !important; } .section02 .con .con-list .box1 .swiper-button-prev { display: none; } .section02 .con .con-list .box1 .swiper-button-next { display: none; } .section02 .con .con-list .box2 .box-con .left a h2 { font-size: 16px; } .section02 .con .con-list .box2 .box-con .left a h3 { font-size: 12px; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(-n+2) .text .txt h2 { font-size: 16px; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(-n+2) .text .txt h2 h3 { font-size: 12px; } .section02 .con .con-list .box2 .box-con .right .swiper-slide ul li:nth-child(n+3) .text .txt h3 { font-size: 12px; margin-top: 4px; } .section02 .con .con-list .box2 .swiper-button-prev { display: none; } .section02 .con .con-list .box2 .swiper-button-next { display: none; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li { padding: 18px; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li a .text h2 { font-size: 16px; -webkit-line-clamp: 1; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 1.5em; } .section02 .con .con-list .box3 .box-con .right .swiper-slide ul li a .text h3 { font-size: 12px; } .section02 .con .con-list .box3 .swiper-button-prev { display: none; } .section02 .con .con-list .box3 .swiper-button-next { display: none; } .section03 .con { padding-bottom: 50px; position: relative; top: 0; left: 0; transform: translate(0%, 0%); -webkit-transform: translate(0%, 0%); -moz-transform: translate(0%, 0%); -ms-transform: translate(0%, 0%); } .section03 .con .title { padding-top: 30px; } .section03 .con .title h2:after { width: 22px; height: 25px; top: 10px; right: -30px; } .section03 .con .company-wrapper { bottom: 40px; } .section03 .con .company-box .box .left .swiper-slide h2 { font-size: 22px; } .section03 .con .company-box .box .left .swiper-slide p { font-size: 14px; } .section03 .con .company-box .box .left .box-text span.box-num { font-size: 16px; } .section03 .con .company-box .box .left .box-text span.box-all { font-size: 16px; } .section03 .con .company-box .box .right { top: -2rem; } .section03 .con .company-box .box .right .video-btn span { left: 52%; } .section04 { padding-bottom: 40px; } .section04 .con { position: relative; top: 0; left: 0; transform: translate(0%, 0%); -webkit-transform: translate(0%, 0%); -moz-transform: translate(0%, 0%); -ms-transform: translate(0%, 0%); } .section04 .con .title { padding-top: 30px; } .section04 .con .title h2:after { width: 22px; height: 25px; top: 10px; right: -30px; } .section04 .con .con-bottom .swiper-container { padding-bottom: 140px; } .section04 .con .con-bottom .swiper-button-prev { display: none; } .section04 .con .con-bottom .swiper-button-next { display: none; } .section04 .con .more { top: 36px; } .section05 { padding-bottom: 50px; } .section05 .con { position: relative; top: 0; left: 0; transform: translate(0%, 0%); -webkit-transform: translate(0%, 0%); -moz-transform: translate(0%, 0%); -ms-transform: translate(0%, 0%); } .section05 .con .title { padding-top: 30px; } .section05 .con .title h2:after { width: 22px; height: 25px; top: 10px; right: -30px; } .section05 .con .con-list ul li { width: 32%; height: 284px !important; } .section05 .con .con-list ul li .top { height: 204px !important; } .section05 .con .con-list ul li .top h2 { display: none !important; } .section05 .con .con-list ul li .top p { display: none !important; } .section05 .con .con-list ul li .top .more { width: 44px; height: 44px; line-height: 44px; top: 50%; left: 50%; opacity: 1 !important; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .section05 .con .con-list ul li .top .more span { font-size: 16px; } .section05 .con .con-list ul li .bottom { height: 80px !important; } .section05 .con .con-list ul li .bottom h2 { width: 100%; font-size: 16px; } .section05 .con .con-list ul li:not(:last-child) { margin-right: 2%; } .section05 .con .con-list ul li.active { width: 32%; } .section05 .con .con-list ul li.active .bottom { display: block; } } @media screen and (max-width: 768px) { .section01 { height: 210px; } .section01 .banner .swiper-pagination { bottom: 30px; } .section01 .banner .swiper-pagination .swiper-pagination-bullet { width: 20px; height: 4px; margin: 0 4px; } .section02 { padding-bottom: 10px; } .section02 .con .title h2 { font-size: 18px; } .section02 .con .title h2:after { width: 15px; height: 17px; top: 5px; right: -24px; } .section02 .con .title h3 { font-size: 14px; } .section02 .con .news-wrapper { position: relative; top: 0; right: 0; margin-top: 20px; } .section02 .con .news-wrapper ul { display: flex; justify-content: center; } .section02 .con .news-wrapper ul li { margin-left: 0; width: 90px; height: 40px; line-height: 40px; } .section02 .con .news-wrapper ul li:not(:last-child) { margin-right: 10px; } .section02 .con .con-list { margin-top: 20px; } .section02 .con .con-list .more { position: relative; bottom: 0; width: 120px; height: 40px; margin: 20px auto 0; } .section02 .con .con-list .more a { line-height: 40px; font-size: 14px; } .section02 .con .con-list .box1 .box-con .left { width: 100%; } .section02 .con .con-list .box1 .box-con .right { width: 100%; display: none; } .section02 .con .con-list .box2 .box-con .left { width: 100%; } .section02 .con .con-list .box2 .box-con .left a h2 { margin: 10px 0 12px; } .section02 .con .con-list .box2 .box-con .right { display: none; } .section02 .con .con-list .box3 .box-con .left { width: 100%; } .section02 .con .con-list .box3 .box-con .left .swiper-pagination .swiper-pagination-bullet { width: 20px; height: 4px; margin: 0 4px; } .section02 .con .con-list .box3 .box-con .right { display: none; } .section03 .con { padding-bottom: 30px; } .section03 .con .title h2 { font-size: 18px; } .section03 .con .title h2:after { width: 15px; height: 17px; top: 5px; right: -24px; } .section03 .con .title h3 { font-size: 14px; } .section03 .con .company-wrapper { position: relative; bottom: 0; margin-top: 10px; } .section03 .con .company-wrapper ul { flex-wrap: wrap; } .section03 .con .company-wrapper ul li { width: 48.5%; margin-top: 10px; } .section03 .con .company-wrapper ul li:not(:last-child) { margin-right: 0; } .section03 .con .company-wrapper ul li:not(:nth-child(even)) { margin-right: 3%; } .section03 .con .company-box .box .left { width: 100%; margin-top: 20px; } .section03 .con .company-box .box .left .swiper-slide h2 { font-size: 16px; color: #fff !important; } .section03 .con .company-box .box .left .swiper-slide h3 { font-size: 16px; } .section03 .con .company-box .box .left .swiper-button-prev { width: 44px; height: 44px; line-height: 44px; margin-top: 20px; } .section03 .con .company-box .box .left .swiper-button-prev:before { font-size: 16px; } .section03 .con .company-box .box .left .swiper-button-next { width: 44px; height: 44px; line-height: 44px; margin-top: 20px; margin-left: 10px; } .section03 .con .company-box .box .left .swiper-button-next:before { font-size: 16px; } .section03 .con .company-box .box .left .box-text { bottom: 10px; } .section03 .con .company-box .box .right { width: 100%; padding-bottom: 50%; top: 0; } .section04 { padding-bottom: 30px; } .section04 .con .title h2 { font-size: 18px; } .section04 .con .title h2:after { width: 15px; height: 17px; top: 5px; right: -24px; } .section04 .con .title h3 { font-size: 14px; } .section04 .con .more { right: 20px; width: 110px; height: 42px; line-height: 42px; } .section04 .con .con-bottom { margin-top: 20px; } .section04 .con .con-bottom .swiper-container { padding-bottom: 30px; padding-top: 0; } .section04 .con .con-bottom .swiper-wrapper .swiper-slide-active a { width: 100%; top: 0; left: 0; position: relative; margin-left: 0; box-shadow: none; } .section04 .con .con-bottom .swiper-pagination .swiper-pagination-bullet { width: 20px; height: 4px; margin: 0 4px; } .section04 .con .con-bottom .swiper-button-prev { display: none; } .section04 .con .con-bottom .swiper-button-next { display: none; } .section05 { padding-bottom: 30px; } .section05 .con .title h2 { font-size: 18px; } .section05 .con .title h2:after { width: 15px; height: 17px; top: 5px; right: -24px; } .section05 .con .title h3 { font-size: 14px; } .section05 .con .con-list { margin-top: 0; } .section05 .con .con-list ul li { width: 100% !important; margin-right: 0 !important; margin-top: 20px; height: 284px !important; } .section05 .con .con-list ul li .top { height: 204px !important; } .section05 .con .con-list ul li .bottom { height: 80px !important; } } /*# sourceMappingURL=index.css.map */