* { padding: 0; margin: 0; } body, html { -webkit-touch-callout: none; color: #222; font-family: Arial, Helvetica, sans-serif; font-size: 14px; line-height: 1.5; outline: 0; /* position:relative */ } ul { list-style: none; } a { color: #333; } .btn-round { border-radius: 30px !important; } .btn { padding: .375rem 1rem; } .rounded-circle { border-radius: 50% !important; } .lug-bt { padding: 0px 0px; height: 36px; background: none; border: none; font-size: 18px; } .nav-link.active::after { border-bottom: 1px solid #fff; } .block-title-home { margin: 0px 0 30px; display: flex; justify-content: space-between; border-bottom: 1px solid #ddd; align-items: center; } .block-title-home h2 { font-size: 22px; border-bottom: 2px solid #da251c; padding: 0 0 20px; margin: 0; font-weight: bold; } .block-title-home a { color: #da251c; } .mySwiper .swiper-wrapper { flex-direction: column; } .title01 { font-size: 30px; font-weight: bold; color: #50a5da; padding: 10px; margin: 40px 0 30px; border-bottom: 2px solid #ddd; background: url(../img/bg-title01.jpg) left bottom 10px no-repeat; } .home-title h2::after { content: ''; width: 60px; height: 4px; background: #da251c; position: absolute; left: 50%; bottom: -8px; transform: translate(-50%, -50%); } .home-title span { font-size: 16px; color: #ddd; text-transform: uppercase; display: block; padding: 5px 0 0; } .btn-gray { width: 200px; height: 50px; line-height: 50px; color: #fff; font-size: 16px; margin: 60px auto 80px; display: block; background: #656f77; text-align: center; } .myTab { border-bottom: 2px solid #ddd; align-items: center; margin-top: 36px; padding: 0 0 0 20px; } .myTab a { padding: 15px 0px; font-size: 24px; color: #333; display: inline-block; } .myTab a.active { color: #50a5da; font-weight: bold; border-bottom: 3px solid #50a5da; position: relative; } .myTab a.active::after { content: ""; width: 0px; height: 0px; border-bottom: 8px solid #50a5da; border-left: 8px solid transparent; border-right: 8px solid transparent; position: absolute; bottom: 0; left: 43%; } .myTab li { margin-right: 30px; } .myTabContent { padding: 0 0 0 20px; } .myTabContent .more{ text-align: right; font-size: 14px; color: #4397f5; display: block; margin: 5px 0 0; } .graceTab { justify-content: center; position: absolute; left: 50%; top: 5%; transform: translate(-50%, -5%); z-index: 7; border: none; } .graceTab li { margin-right: 1rem; } .graceTab a { padding: 1rem 2rem; font-size: 1.7rem; color: #333; display: inline-block; text-decoration: none; position: relative; } .graceTab a span { color: #333; z-index: 4; position: relative; } .graceTab a.active span { color: #fff; font-weight: bold; position: relative; } .graceTab a.active::before { content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #50a5da; z-index: 3; transform: skewX(-20deg); z-index: 3; } .graceTab a::before { content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #fff; z-index: 3; transform: skewX(-20deg); z-index: 3; } .parallelogram { width: 200px; height: 100px; background-color: #ccc; transform: skewX(-20deg); position: relative; } .parallelogram::before { content: ""; position: absolute; top: 0; left: -50px; width: 50px; height: 100%; background-color: #ccc; transform: skewX(20deg); } .grace-block { position: relative; z-index: 6; } .grace-block .swiper-slide .text-box { background: rgba(80, 165, 218, .8); color: #fff; padding: 3rem; position: absolute; top: 20%; left: 25%; width: 50%; text-align: left; } .grace-block .swiper-slide .text-box h4 { text-align: center; font-size: 1.8rem; margin-bottom: 3rem; } .grace-block .swiper-button-prev { left: 10%; } .grace-block .swiper-button-next { right: 10%; } .grace-block .swiper-button-prev:after, .grace-block .swiper-button-next:after { font-size: 0; } .grace-block .swiper-slide { text-align: center; font-size: 18px; background: #fff; display: flex; justify-content: center; align-items: center; } .grace-block .swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; } /* .grace-block .mySwiper01, .grace-block .mySwiper02, .grace-block .mySwiper03{ height: 950px; } */ .grace-block .swiper { width: 100%; margin-left: auto; height: 950px; margin-right: auto; } .grace-block .swiper-slide { background-size: cover; background-position: center; } .tab-content-grace { position: relative; z-index: 5; } .grace-block .mini-img { width: 70%; height: 19%; box-sizing: border-box; padding: 10px 0; position: absolute; bottom: 3rem; left: 15%; right: 15%; } .mini-img .swiper-slide { width: 25%; height: 100%; border: 3px solid rgba(255, 255, 255, 0.3); position: relative; z-index: 8; } .mini-img .swiper-slide::before { content: ""; width: 100%; height: 100%; background: rgba(0, 0, 0, .4); display: block; left: 0; position: absolute; top: 0; } .mini-img .swiper-slide-active { border-color: #fff; } .mini-img .swiper-slide-thumb-active::before { width: 0; } .mini-img .swiper-slide-thumb-active { opacity: 1; } .mini-img .swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; } /* bottom banner */ .index-banner2 { width: 100%; position: relative; overflow: hidden; margin: 60px 0 0; } .index-banner2 .imgs { display: block; background: #0150d3; overflow: hidden; padding-bottom: 33%; position: relative; } .index-banner2 .img-box { bottom: 0; left: 0; position: absolute; right: 0; top: 0; height: 100%; } .index-banner2 img { object-fit: cover; transition: all .3s; width: 100%; } .index-banner2 .swiper-pagination { color: #fff; right: 10%; left: auto; width: 137px; top: 10%; z-index: 1; font-size: 16px; } .index-banner2 .swiper-pagination-current { font-size: 24px; } .index-banner2 .text-box { background: rgba(0, 0, 0, .35); height: 100%; width: 50%; z-index: 4; color: #FFF; padding: 70px 70px 0 15vw; position: absolute; left: 0; top: 0; } .index-banner2 .text-box h3 { color: #ddd; font-size: 36px; } .index-banner2 .text-box p { color: #ddd; font-size: 16px; margin: 40px 0; } .index-banner2 .swiper-button-next, .index-banner2 .swiper-button-prev { top: 80%; color: #fff; background: none; z-index: 99; } .index-banner2 .swiper-button-prev { left: 340px; } .index-banner2 .swiper-button-next { right: 320px; } .childlist3{ width:100%; height:60px; } .childlist3 p{ padding:5px 10px; float: left; margin-left:20px; font-size: 18px; } .childlist3 .on{ border-bottom: 1px solid #007bff; } .index-banner2 .swiper-button-next:after, .index-banner2 .swiper-button-prev:after { font-size: 0px; } .index-banner2 .swiper-button-next i, .index-banner2 .swiper-button-prev i { font-size: 45px; background: #262629; color: #49494b; border: 1px solid #999; border-radius: 50%; padding: 0 10px; } .index-banner2 .swiper-button-prev, .index-banner2 .swiper-rtl .swiper-button-next { right: auto; } .index-banner2 .text-box button { min-width: 130px; } .hot-news { padding: 28px 0; display: flex; border-bottom: 1px dashed #e6e6e6; } .hot-news:hover { text-decoration: none; box-shadow: 3px 3px 3px #ddd; color: #50a5da; } #myTabContent a:hover, .hot-news:hover a, .tab-content>.active a { text-decoration: none; } .hot-news:hover h3, .hot-news:hover p { color: #50a5da; } .hot-news .date { color: #50a5da; font-size: 14px; text-align: center; padding: 12px 15px; white-space: nowrap; background: #eee; margin-right: 20px; } .hot-news .date b { font-size: 30px; display: block; color: #50a5da; line-height: 1; } .hot-news h3 { font-size: 22px; font-weight: bold; overflow: hidden; color: #222; } .hot-news p { margin: 10px 0 0; color: #666; } .party-work { padding: 60px 0; } .party-work .hot-block { background: #f8f8f8; padding: 20px; display: flex; } .party-work .hot-block .date { border-right: 1px solid #ddd; color: #da251c; font-size: 16px; text-align: center; padding-right: 20px; white-space: nowrap; } .party-work .hot-block a { font-size: 16px; line-height: 30px; padding-left: 20px; box-orient: vertical; line-clamp: 2; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; color: #333; font-weight: bold; } .news-list li { display: flex; justify-content: space-between; font-size: 16px; padding: 9px 0 10px 2rem; background: url(../img/icon-li.png) left center no-repeat; list-style-type: none; } .news-list li a { color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .news-list li span { color: #999; white-space: nowrap; } .product-center { padding: 60px 0; } .product-block { width: 296px; background: #eee; text-align: center; } .product-block p { padding: 10px 0; margin: 0; } .product-block a { color: #333; } .product-block .img-block { overflow: hidden; height: 193px; } .product-block .img-block img { height: 100%; object-fit: cover; transition: all .3s; width: 100%; } .product-block:hover img { transform: scale(1.1); } .m-tab-f01 { position: absolute; bottom: 110px; left: 20%; right: 20%; z-index: 1; } .m-tab-f01 .line { height: 65px; /* background: url("../img/index/m6-bg01.png") center 0 no-repeat; background-size: contain; */ border-bottom: 1px solid #999; } .m-tab-f01 .con { position: absolute; top: 0; left: 0; right: 0; z-index: 2; } .m-tab-f01 .wp { display: -webkit-flex; display: flex; justify-content: space-between; max-width: 800px; margin: auto; } .m-tab-f01 .item { display: block; flex: 0; } .m-tab-f01 .item.s5 { transform: translateX(6px); -webkit-transform: translateX(6px); -moz-transform: translateX(6px); -ms-transform: translateX(6px); -o-transform: translateX(6px); } .m-tab-f01 .item.s6 { transform: translateX(-21px); -webkit-transform: translateX(-21px); -moz-transform: translateX(-21px); -ms-transform: translateX(-21px); -o-transform: translateX(-21px); } .m-tab-f01 .pic { width: 110px; height: 110px; margin: 0 auto 20px; position: relative; border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; } .m-tab-f01 .pic:after { content: ""; display: block; border: 5px solid rgba(255, 255, 255, .20); width: 100%; height: 100%; box-sizing: content-box; 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%); -o-transform: translate(-50%, -50%); border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; z-index: 2; } .m-tab-f01 .pic .img { width: 110px; height: 110px; display: -webkit-flex; display: flex; justify-content: center; align-items: center; border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; overflow: hidden; background: #fff url("../images/index/m6-icon-bg1.png") center center no-repeat; background-size: cover; transition: all .3s; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; z-index: 3; flex-direction: column; } .m-tab-f01 .pic img { width: 46px; display: block; object-fit: contain; } .m-tab-f01 .pic .hover { display: none; } .m-tab-f01 .on .pic .img { /* background: linear-gradient(-59deg, #0CAEF6, #066CDE) !important; */ background: linear-gradient(-59deg, #f6220c, #de2a06) !important; } .m-tab-f01 .on .pic .normal { display: none; } .m-tab-f01 .on .pic .hover { display: block; } .m-tab-f01 .item.on h3 { color: #fff; } .m-tab-f01 h3 { font-size: 16px; font-weight: 400; color: #333; text-align: center; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 10px; } .m-tab-f01 .item .pic:before { content: ""; display: none; width: 100%; height: 100%; border-radius: 50%; position: absolute; left: 0; top: 0; z-index: -1; opacity: 0; filter: alpha(opacity=0); -webkit-animation: prop 1.2s linear infinite; -o-animation: prop 1.2s linear infinite; animation: prop 1.2s linear infinite; } .m-tab-f01 .item.on .pic:before { display: block; } .swiper-tab .txt { position: absolute; left: 0; top: 0; right: auto; color: #fff; z-index: 2; width: 50%; background: rgba(0, 0, 0, .35); bottom: 0; } .swiper-tab .inner { padding: 70px 70px 70px 300px; } .swiper-tab .txt h3 { margin-bottom: 40px; font-size: 36px; font-weight: bold; color: #ddd; } .swiper-tab .txt .desc { margin-bottom: 40px; font-size: 16px; color: #ddd; line-height: 1.8; display: -webkit-box; -webkit-line-clamp: 7; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; } .swiper-tab .g-pagination { position: absolute; right: 10%; top: 16%; color: #fff; font-size: 16px; width: 100px; } .swiper-tab .g-pagination .prev { font-size: 24px; } .bg-blue { background: #0150d3; } .bg-yellow { background: #ff9000; } .picMarquee-left { height: 230px; overflow: hidden; } .fl { float: left; } .picMarquee-left ul li { flex: 1; width: 23%; margin-left: 1%; } .picMarquee-left ul li .box:hover a .text { color: #DA251C; text-decoration: underline; } .picMarquee-left ul li:last-child { margin-right: 0; } .picMarquee-left ul li .box .img { position: relative; padding-bottom: 65.2%; overflow: hidden; } .picMarquee-left ul li .box .img img { position: absolute; width: 100%; height: 100%; top: 0; left: 0; } .picMarquee-left ul li .box .img:hover img { transform: scale(1.1); transition: all .3s; } .picMarquee-left ul li .box .text { color: #333333; font-size: 16px; background-color: #eee; line-height: 2.5rem; height: 2.5rem; text-align: center; box-sizing: border-box; padding: 0 10px; } .txtov { overflow: hidden; text-overflow: ellipsis; white-space: nowrap } .tempWrap { width: 100% !important; margin: 0; padding: 0; } .mySwiper.swiper-container-vertical { touch-action: pan-x; height: 50px; overflow: hidden; } .mySwiper .swiper-slide { line-height: 50px; } .mySwiper .swiper-slide a { font-size: 16px; color: #666; padding: 10px 0; } .news-img-block { max-width: 780px; position: relative; overflow: hidden; } .news-img-block .imgs { display: block; overflow: hidden; padding-bottom: 68%; } .news-img-block .img-box { bottom: 0; left: 0; position: absolute; right: 0; top: 0; } .news-img-block img { height: 100%; object-fit: cover; transition: all .3s; width: 100%; } .news-img-block .swiper-pagination { color: #fff; left: auto; right: 0; bottom: 0px; z-index: 1; padding: 14px 0; width: 200px; } .news-img-block .swiper-pagination .swiper-pagination-bullet { width: 16px; height: 16px; background: #fff; margin: 0 4px; opacity: 1; } .news-img-block .swiper-pagination .swiper-pagination-bullet-active { background: #50a5da; width: 30px; border-radius: 10px; } .swiper-pagination-current { font-size: 20px; } .news-img-block .text-box { background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1)); right: 0; left: 0; bottom: 0; font-size: 1.5rem; padding: 2rem 2.5rem; min-height: 6.4rem; color: #FFF; position: absolute; font-weight: bold; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .news-img-block .swiper-button-next, .news-img-block .swiper-button-prev { top: auto; color: #fff; height: auto; width: auto; bottom: 20px; } .news-img-block .swiper-button-next:after, .news-img-block .swiper-button-prev:after { font-size: 0px; } .news-img-block .swiper-button-next i, .news-img-block .swiper-button-prev i { font-size: 35px; } .news-img-block .swiper-button-prev, .news-img-block .swiper-rtl .swiper-button-next { left: auto; right: 100px; } /* //单行溢出省略: */ .title-over { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; } /* 多行溢出省略: */ .p-over { box-orient: vertical; line-clamp: 2; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; } .bg-gray { background: #f8f8f8; padding: 60px 0; } .back-top { align-items: center; background: #333; border: 2px solid #fff; bottom: 2vw; color: #fff; cursor: pointer; display: flex; flex-direction: column; font-size: .9375vw; height: 50px; justify-content: center; opacity: 0; padding: 5px; position: fixed; right: 10px; text-align: center; transform: scale(.8) translate(90px, 90px); transition: all .3s; visibility: hidden; width: 50px; z-index: -1; } .back-top:hover { background: #000; color: #fff; } .back-top-show { opacity: 1; transform: scale(1) translate(0); visibility: visible; z-index: 2 } .back-top-show:hover { text-decoration: none; } .back-foot { background: #0150d3; color: #fff; position: fixed; right: 0; top: 45%; writing-mode: vertical-lr; padding: 15px 7px; font-size: 16px; border-radius: 20px 0 0 20px; z-index: 888; } .back-foot a { color: #fff; } .back-foot:hover { background: #5488df; color: #fff; text-decoration: none; } .index-banner { width: 100%; position: relative; overflow: hidden; } .index-banner .swiper-slide { background: rgba(0, 0, 0, .6) } .index-banner .imgs { display: block; position: relative; padding-bottom: 36.5%; } .index-banner .img-box { bottom: 0; left: 0; position: absolute; right: 0; top: 0; height: 100%; } .index-banner img { height: 100%; object-fit: cover; transition: all .3s; width: 100%; } .index-banner .swiper-pagination { color: #fff; bottom: 6%; z-index: 1; left: 0; width: 100%; display: flex; align-items: center; text-align: center; justify-content: center; top: auto; } .index-banner .swiper-pagination-bullet { width: 20px; height: 20px; border-radius: 10px; opacity: .3; margin: 0 5px; border: 1px solid #fff; } .index-banner .swiper-pagination-bullet-active { background: #fff; opacity: 1; width: 50px; } .index-banner .swiper-button-next, .index-banner .swiper-button-prev { top: 80%; color: #fff; background: none; } .index-banner .swiper-button-prev { left: 300px; } .index-banner .swiper-button-next { left: 320px; } .index-banner .swiper-button-next:after, .index-banner .swiper-button-prev:after { font-size: 0px; } .index-banner .swiper-button-next i, .index-banner .swiper-button-prev i { font-size: 35px; } .index-banner .swiper-button-prev, .index-banner .swiper-rtl .swiper-button-next { right: auto; left: 230px; } #banner-index .banner-left { background-color: #0150d3; } #banner-index .carousel-inner { display: flex; } #banner-index .banner-index-block { position: absolute; width: 100%; height: 100%; overflow: hidden; } .index-banner .carousel-item { display: block; overflow: hidden; padding-bottom: 33%; flex-shrink: 0; } .index-banner .img-block { bottom: 0; left: 0; position: absolute; right: 0; top: 0; } .index-banner .img-block img { height: 100%; object-fit: cover; transition: all .3s; width: 100%; } .index-banner .carousel-control-prev, #banner-index .carousel-control-next { bottom: 20%; height: 50px; top: auto; z-index: 5; } .index-banner .carousel-indicators { left: 3%; right: initial; bottom: 18.5%; margin-left: 12%; } .index-banner .carousel-indicators li { background: none; text-indent: 0; font-size: 16px; color: #fff; text-align: center; width: 32px; } .index-banner .carousel-control-prev { left: 5%; opacity: 1; } .index-banner .carousel-control-next { left: 13%; opacity: 1; } .index-banner .carousel-control-prev-icon { background: none; } .index-banner .carousel-control-next-icon { background: none; } .index-banner .carousel-control-prev-icon i, .index-banner .carousel-control-next-icon i { font-size: 3rem; } .news-list { margin: 20px 0 0; padding: 0; } .title-innerPage a { padding: 0; font-size: 16px; } .title-innerPage .breadcrumb { margin: 0; background: #fff; font-size: 16px; } .title-innerPage .breadcrumb a { color: #666; } .title-innerPage .breadcrumb li.active a { color: #0150d3; } .page-content { min-height: 600px; padding: 30px; } .wrap-ltit { position: relative; border-bottom: 1px solid #ddd; text-align: left; padding-left: 15px; font-size: 18px; line-height: 46px; background: #242326; color: #fff; } .wrap-lul .wrap-lli a { position: relative; display: block; padding-top: 5px; line-height: 42px; border-bottom: 1px solid #ddd; padding: 0 15px; display: flex; align-items: center; justify-content: space-between; } .wrap-lul .wrap-lli a img { filter: grayscale(0%) brightness(50%) } .wrap-lul .wrap-llion a { background-color: #da251c; color: #fff; } .wrap-lul .wrap-llion a img { filter: grayscale(100%) brightness(300%) } .wrap-lul { background: #efefef; } .wrap-rtxtl { float: left; font-size: 18px; line-height: 58px; padding-left: 10px; } .wrap-rtxtr {} .wrap-rtxtr a.on { color: #da251c; } .bg { background: #f4fbff; } .wrap-li { border-bottom: 1px dashed #dadada; } .wrap-li a { display: flex; align-items: center; padding: 20px; justify-content: space-between; } .wrap-li a:hover { box-shadow: #cfdfec 0px 5px 10px; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; background: #fff; } .wrap-li .date { text-align: center; color: #50a5da; margin-right: 20px; padding: 0 15px; background: #eee; } .wrap-li:hover .date .t, .wrap-li:hover .text .t { color: #50a5da; } .wrap-li .date .t { font-size: 30px; margin: 10px 0 0; font-weight: bold; } .wrap-li .text .t { color: #222; font-size: 20px; margin: 10px 0; font-weight: bold; } .wrap-li .date .t2 { font-size: 16px; } .wrap-li .text { flex: 1; width: 0; } .wrap-li .text .t2 { color: #666; font-size: 14px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .news-h1 { font-size: 30px; line-height: 40px; font-weight: 400; text-align: center; padding-bottom: 28px; padding-top: 28px; } .news-pub { min-height: 30px; background: #f1f1f1; text-align: center; color: #666; line-height: 30px; padding: 5px; margin-bottom: 20px; } .news-pub span { padding: 0 10px; } .news-txt img { max-width: 100%; margin: auto; display: block; } .news-text-block img { max-width: 100%; margin: auto; display: block; } .news-text-block p { font-size: 18px; text-indent: 20px; line-height: 1.8; margin: 20px 0; color: #333; } .pic-block { margin: 0 0 30px; background: #fff; border-bottom: 2px solid #50a5da; } .pic-block:hover { box-shadow: 4px 4px 4px #ccc; } .pic-block .img-block { display: block; height: 280px; overflow: hidden; } .pic-block .img-block img { width: 100%; max-width: 100%; height: 400px; object-fit: cover; transition: all .5s ease-in-out; } .pic-block .img-block:hover img { transform: scale(1.05); transition: all .4s; } .pic-block p { background: #eee; padding: 10px 0; margin: 0; font-size: 18px; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .pic-block a:hover { text-decoration: none; color: #50a5da; } .page { text-align: center; line-height: 2.5rem; margin-top: 1.875rem; margin-bottom: 1.25rem; } .page a { display: inline-block; margin: 0 2px; padding: 0 15px; background: #eee; color: #50a5da; vertical-align: top; font-size: 14px; } .page a.on { background-color: #50a5da; color: #FFFFFF; } .page-fenye { margin-top: 3rem; font-size: 1.2rem; color: #666; } .page-fenye .pagination { align-items: center; } .page-fenye .form-control { width: 70px; margin-left: 1rem; } .bt-more { font-size: 16px; } .sub li { height: 3.125rem; line-height: 3.125rem; } .sub li a { color: #4c4c4c; font-size: 16px; display: block; padding: 0 1.25rem; } .sub li.on a { border-bottom: 2px solid #50a5da; } .m-0 { margin: 0; } .topic-block { position: relative; z-index: 8; margin-top: 60px; } .topic-title { margin-right: 20px; } .topic-block .swiper-button-next, .topic-block .swiper-button-prev { background: #eee; width: 260px; height: 160px; top: 20px; } .topic-block .swiper-button-next { border-radius: 10px 0 0 10px; justify-content: left; padding-left: 2rem; } .topic-block .swiper-button-prev { border-radius: 0 10px 10px 0; justify-content: right; padding-right: 2rem; } .topic-block .swiper-button-prev:after, .topic-block .swiper-button-next:after { color: #ccc; font-weight: bold; } .flex-center { display: flex; align-items: center; justify-content: space-between; } .code-block { display: flex; justify-content: center; align-items: center; } .code-block p { margin: 0 20px 0 0; } .footer { background: #50a5da; color: #fff; padding: 2.5rem 10px 2.5rem; font-size: 1.2rem; line-height: 2; } .grace-title { text-align: center; font-size: 1.7rem; font-weight: bold; margin: 4rem 0 2.5rem; background: url(../img/bg-title-grace.png) center no-repeat; padding: 15px 10px 0px; } .page-banner { background: url(../img/page-banner01.jpg) center top no-repeat; background-size: cover; height: 300px; padding-top: 7rem; } .page-banner .page-banner-txt { color: #fff; position: relative; } .page-banner .page-banner-txt h2 { font-size: 36px; font-weight: bold; } .page-banner .page-banner-txt::after { position: absolute; content: ''; width: 50px; height: 4px; background: #50a5da; bottom: -10px; left: 0; } .page_nav { background: url(../img/bg-page-nav.png) center top no-repeat; margin-top: -47px; padding-top: 25px; } .page_nav ul { display: flex; } .page_nav ul li { background: #eee; margin-right: 10px; } .page_nav ul li.active { background: #50a5da; } .page_nav ul li.active a { color: #fff; } .page_nav ul li a { display: block; padding: 10px 2rem; font-size: 18px; color: #50a5da; position: relative; } .page_nav ul li:hover { background: #50a5da; } .page_nav ul li:hover a { color: #fff; text-decoration: none; } .page_nav ul li:nth-child(1) a::after { content: ""; width: 0px; height: 0px; border-bottom: 47px solid #eee; border-left: 0px solid transparent; border-right: 10px solid transparent; position: absolute; top: 0; left: 0; } .page_nav ul li a::before { content: ""; width: 0px; height: 0px; border-top: 50px solid #fff; border-left: 10px solid transparent; border-right: 0px solid transparent; position: absolute; top: 0; right: -1px; } .page_nav ul li:nth-child(1) a:hover::after { content: ""; width: 0px; height: 0px; border-bottom: 47px solid #50a5da; border-left: 0px solid transparent; border-right: 10px solid transparent; position: absolute; top: 0; left: 0; } .page_nav ul li a:after { content: ""; width: 0px; height: 0px; border-bottom: 50px solid #fff; border-left: 0px solid transparent; border-right: 10px solid transparent; position: absolute; top: 0; left: -1px; } .page-title { color: #50a5da; padding: 10px; margin: 40px 0 30px; border-bottom: 2px solid #ddd; background: url(../img/bg-title01.jpg) left bottom 10px no-repeat; display: flex; align-items: center; justify-content: space-between; } .page-title h2 { font-size: 30px; font-weight: bold; } .page-breadcrumb a { padding: 0 5px; } .index-notice { background: #fafafa; padding: 10px 0; border-bottom: 1px solid #eee; display: flex; align-items: center; justify-content: space-between; } .index-notice .swiper-container { height: 40px; overflow: hidden; } .index-notice .swiper-container a { align-items: center; color: #333; display: flex; height: 40px; justify-content: center; } .index-notice a p { max-width: 70%; margin: 0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; font-size: 16px; } .index-notice .data { margin-right: 30px } .flex-center { display: flex; align-items: center; justify-content: space-between; } .notice-title { color: #50a5da; font-size: 18px; white-space: nowrap; } .notice-title img { margin-right: 8px; max-height: 30px; } @media (min-width: 1900px) { .container { max-width: 1360px; } .index-nav { justify-content: flex-end !important; } } @media(min-width: 1200px) and (max-width: 1440px) { .index-banner2 .swiper-button-next, .index-banner2 .swiper-button-prev { top: 74%; } .index-banner2 .swiper-button-prev { left: 240px; } .index-banner2 .swiper-button-next { right: 220px; } .index-banner2 .text-box { padding: 70px 70px 0 70px; } .m-tab-f01 .wp { max-width: 700px; } #banner-index .carousel-control-prev, #banner-index .carousel-control-next { bottom: 10%; } #banner-index .carousel-indicators { bottom: 8%; left: 0; margin-left: 11%; } .container { max-width: 1360px; } #banner-index .carousel-caption { left: 22%; width: 420px; } #banner-index .carousel-control-prev { left: 2%; } #banner-index .carousel-control-next { left: 10%; } .back-foot { top: 40%; } } /*@media (max-width: 1920px) {*/ /* .container {*/ /* max-width: 1360px;*/ /* }*/ /*}*/ @media(min-width: 1440px){ .container { max-width: 1360px; } } @media (max-width: 1440px) { .topic-block .swiper-button-next, .topic-block .swiper-button-prev { width: 40px; padding: 1rem; } } @media(max-width:1024px) { /*.notice-title{*/ /* display: none;*/ /*}*/ .graceTab a { font-size: 1rem; padding: 10px ; } .graceTab { /*left: 20%;*/ /*top: 4%;*/ /*transform: translate(-8%, -5%);*/ width: 100%; } .myTab { padding: 0; } .page-banner { padding-top: 7rem; } .grace-block .mySwiper01, .grace-block .mySwiper02, .grace-block .mySwiper03 { height: 300px; } .grace-block .mini-img { height: 27%; bottom: 0rem; } .page a { padding: 0 10px; } .mini-img .swiper-slide { height: 66%; } .footer .flex-center { flex-direction: column; text-align: center; } .grace-block .swiper-slide .text-box { top: 22%; left: 10%; width: 80%; padding: 20px; } .grace-block .swiper-slide .text-box h4 { font-size: 18px; margin-bottom: 10px; } .grace-block .swiper-slide .text-box p { box-orient: vertical; line-clamp: 2; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; font-size: 16px; } .grace-block .swiper-button-prev { left: 10px; } .grace-block .swiper-button-next { right: 10px; } .news-img-block .text-box { font-size: 1rem; padding: 2rem 1rem 3rem; } .title01 { margin: 20px 0 10px; } .block-title-home { margin: 20px 0; } .title { padding: 10px 0; margin-bottom: 10px; } .title h2 { font-size: 20px; } .news-detail .news-link { padding: 1rem; } .news-detail h3 { font-size: 1.5rem; } .news-detail .content img { margin: 1rem auto; } .history-note { margin-left: 1.2rem; font-size: 1rem; } .topic-block .swiper-button-prev:after, .topic-block .swiper-button-next:after { color: #666; font-weight: normal; font-size: 2rem; } .page-breadcrumb { display: none; } } @media (max-width: 768px) { .search{ min-width: 350px; } .index-notice .flex-center{ flex-direction: column; } .page-title { margin: 20px 0 10px; } .wrap-li a { padding: 15px 0; } .page_nav ul { flex-wrap: wrap; } .page_nav ul li { flex-basis: 30%; margin-top: 5px; } .page_nav ul li a { padding: 10px; text-align: center; } .topic-block .swiper-button-next { right: 0; bottom: -44px; height: 40px; top: auto; width: 50%; border-radius: 0%; } .topic-block .swiper-button-prev { left: 0; right: 0; bottom: -44px; height: 40px; top: auto; width: 50%; border-radius: 0%; } .m-tab-f01 .item { margin: 0 5px; } .m-tab-f01 .pic { width: 90px; height: 90px; } .m-tab-f01 .pic .img { width: 90px; height: 90px; } .m-tab-f01 h3 { font-size: 14px; } .m-tab-f01 { left: 3%; } .wrap-rtxtr { margin: 10px 0; } .sub li a { padding: 0 7px; } .index_link-block { flex-direction: column; justify-content: flex-start; align-items: flex-start; padding: 10px 10px; } .index_link { padding: 0; } .index-banner2 .text-box { padding: 10px; } .index-banner2 .text-box h3 { font-size: 28px; margin: 20px 0 0; } .index-banner2 .text-box p { margin: 20px 0; box-orient: vertical; line-clamp: 2; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; } .index-banner2 .swiper-button-next i, .index-banner2 .swiper-button-prev i { font-size: 30px; padding: 0 8px; } .index-banner2 .swiper-button-prev { left: 40px; } .index-banner2 .swiper-button-next { right: 40px; } .myTabContent { padding: 0; } .index-banner2 .imgs { padding-bottom: 120%; } .index-banner2 img { width: auto; } .hot-news h3 { white-space: inherit; } .wrap-li .date { width: 75px; padding: 0; margin-right: 10px; } .home-news { padding: 0; } .party-work { padding: 0px; } .bg-gray { padding: 20px 0; } .party-work ul { margin: 0 0 10px; } .code-block { width: auto !important; margin: 10px; } .index-banner { margin-top: 60px; } .page-banner img { max-width: 100%; object-fit: cover; height: 150px; } .page-content { padding: 10px; } .news-img-block { max-width: 100%; } .index-banner .imgs { padding-bottom: 50%; } .news-block { padding: 0; margin: 20px 0 0; } .myTab a { font-size: 20px; } .index-banner2 { margin: 20px 0 0; } .product-block { margin: 10px auto; width: auto; } .title-innerPage { display: block; } #banner-index .carousel-indicators { display: none; } #banner-index .carousel-caption { left: 1rem; } #banner-index .carousel-caption .line { display: none; } #banner-index .carousel-caption { width: 150px; top: 0; } #banner-index .carousel-caption h3 { font-size: 14px; line-height: 1.2; } #banner-index .carousel-caption button { display: none; } .news-h1 { font-size: 20px; padding: 10px 0; line-height: 1.4; font-weight: bold; } .picMarquee-left { height: 100px; } .product-center { padding: 20px 0; } } @-webkit-keyframes prop { from { box-shadow: 0 0 0 0 rgba(255, 255, 255, .8); opacity: 1; filter: alpha(opacity=10); } to { box-shadow: 0 0 0 25px rgba(255, 255, 255, .8); opacity: 0; filter: alpha(opacity=0); } } @-o-keyframes prop { from { box-shadow: 0 0 0 0 rgba(255, 255, 255, .8); opacity: 1; filter: alpha(opacity=10); } to { box-shadow: 0 0 0 25px rgba(255, 255, 255, .8); opacity: 0; filter: alpha(opacity=0); } } @-moz-keyframes prop { from { box-shadow: 0 0 0 0 rgba(255, 255, 255, .8); opacity: 1; filter: alpha(opacity=10); } to { box-shadow: 0 0 0 25px rgba(255, 255, 255, .8); opacity: 0; filter: alpha(opacity=0); } } @-ms-keyframes prop { from { box-shadow: 0 0 0 0 rgba(255, 255, 255, .4); opacity: 1; filter: alpha(opacity=10); } to { box-shadow: 0 0 0 25px rgba(255, 255, 255, .4); opacity: 0; filter: alpha(opacity=0); } } @keyframes prop { from { box-shadow: 0 0 0 0 rgba(255, 255, 255, .4); opacity: 1; filter: alpha(opacity=10); } to { box-shadow: 0 0 0 25px rgba(255, 255, 255, .4); opacity: 0; filter: alpha(opacity=0); } } .copyright a{ color:#fff !important; }