#index .banner { width: 100%; height: auto; position: relative; -webkit-user-select: none; -moz-user-select: none; } #product .prod-detail .pd-top .right span{ display: block; font-size:16px; color:#666; margin-top:20px; } #product .prod-detail .pd-top .right strong{ display:block; font-weight:normal; margin-top:20px; font-size:20px; color:#666;} #product .prod-detail .pd-top .right strong b{ font-size:26px; color:#f00; font-weight:bold;} .zixx{ margin-top:40px;} .zixx a{ display:block; float:left; width:160px; height:40px; line-height:40px; font-size:16px; color:#fff; text-align:center; background:#f63604;} .zixx i{ display:block; font-style:normal; float:left; margin-left:5px; font-size:16px; color:#666;} #search .search-result .item dl{ border-bottom:1px dashed #ccc; height:70px; line-height:70px;} #search .search-result .item:hover{ background:#f2f2f2;} #search .search-result .item dl dt{ float:left; width:57px;} #search .search-result .item dl dt b{ display:block; font-weight:normal; font-size: 28px; color: #888; line-height: 40px; width: 57px; display: block; text-align: center; background: #f4f4f4;} #search .search-result .item dl dt i{ display:block; font-style:normal;font-size: 12px; color: #888; line-height: 20px; width: 57px; display: block; text-align: center; margin-top: 2px; background: #f4f4f4;} #search .search-result .item dl dd{ float:left; margin-left:5px;} #search .search-result .item dl dd strong{font-size: 16px; color: #222; line-height: 32px; display: block; font-weight:normal;} #search .search-result .item dl dd span{font-size: 13px; color: #666; line-height: 20px; display:block; margin-top:5px;} .tree { padding-top:8px;} .tree ul{ border:none !important; padding:0 !important;} .tree ul li:hover{ background:none !important;} .tree_box { overflow: hidden; } .tree_one, .tree_two { display: none; overflow: hidden; } .tree_box h3 { position: relative; height: 50px; line-height: 50px; padding:0 10px 0 50px; margin:2px 0; background:#f5f5f5;} .tree_box h3 span { background: url(../images/ico_list1.png) center no-repeat; position: absolute; left: 0px; top: 0px; height: 50px; width: 50px; cursor:pointer;} .tree_box h3 a{ font-weight: normal; color:#333;} .tree_box h3 a:hover{ color:#005CA1 !important;} .tree_one h4 { position: relative; height: 39px; line-height: 39px; padding:0 10px 0 18px; border-bottom:1px dashed #ccc;} .tree_one h4 strong{ background: url(../images/ico_list2.png) center no-repeat; position: absolute; left: 0px; top: 0px; height: 39px; width: 20px; cursor:pointer;} .tree_one h4 a{ font-weight: normal; color:#333;} .tree_one h4 a:hover{ color:#005CA1 !important;} .tree_two{} .tree_two li{ line-height:31px; border-bottom:1px dashed #ccc; padding:0 10px 0 50px;} .tree_two li a{ color:#333;} .tree_two li a:hover{ color:#005CA1 !important;} .ny_zblb1 li ul li a.current{color: #015db2; background: url(../images/js_27.png) no-repeat scroll 2px 21px;} .ny_zblb1 li a.cur{color: #015db2; text-decoration: none; padding-left: 15px; background: url(../images/js_28.png) no-repeat scroll 154px 21px;} .clearfix{ margin:0; padding:0; font-size:0; clear:both;} .headertop{width: 100%;height: auto;background: #333; height:45px; line-height:45px;} .headertop .ht{width: 1200px;height: auto;margin: 0 auto;height:45px; line-height:45px;} .headertop .ht p.hl{font-size: 14px;color:#fff;line-height: 40px;float:left;} .headertop .hr{float:right;} .headertop .hr .head_gp_bar{width:200px;height:40px;float:left;overflow:hidden;} .headertop .hr .head_gp_bar ul{ width:auto; height:auto; padding-bottom:16px;} .head_jtlink li{ width:auto; height:auto; margin-left:6px; cursor:pointer;padding: 0 17px; background: url(../images/h-li-bg.jpg) no-repeat scroll left center;} .inside_con{ padding:10px; min-height:400px;} .head_jtlink li a{ padding-left:10px; line-height:40px; font-size:14px; color:#fff;display:block; font-weight:normal;} ..head_jtlink li:hover a{ color:##0068b7;} .headertop .r2{float:right;} .head_jtlink ul.first li{ float:left;} .head_jtlink li{font-size: 12px; float: left; list-style-type: none; margin-right: 10px; white-space: nowrap; line-height: 40px; height: 40px; color: #000000; text-align: center; float: right;} #index .banner .swiper-slide { width: 100%; height: auto; position: relative; } #index .banner .swiper-slide .bg { width: 100%; height: auto; } #index .banner .swiper-slide .bg img { width: 100%; height: auto; } #index .banner .swiper-slide .main { position: absolute; top: 0; left: 13.33%; height: 100%; } #index .banner .swiper-slide .texts { position: absolute; top: 50%; left: 0; transform: translateY(-50%); overflow: hidden; } #index .banner .swiper-slide .texts .text1 { font-size: 62px; color: #fff; line-height: 62px; margin-top: 20px; font-weight: bold; position: relative; overflow: hidden; white-space: nowrap; display: block; float: left; clear: both; } #index .banner .swiper-slide .texts .text1 i { display: block; position: absolute; top: 0; width: 100%; height: 62px; background-color: #fff; animation-timing-function: cubic-bezier(0.69, 0.01, 0.21, 0.99); } #index .banner .swiper-slide .texts .text2 { font-size: 20px; color: #fff; line-height: 20px; margin-top: 20px; font-family: "DINCondensed"; text-transform: uppercase; white-space: nowrap; overflow: hidden; position: relative; font-style: italic; display: block; float: left; clear: both; } #index .banner .swiper-slide .texts .text2 i { display: block; position: absolute; top: 0; width: 100%; height: 20px; background-color: #fff; animation-timing-function: cubic-bezier(0.69, 0.01, 0.21, 0.99); } #index .banner .swiper-pagination-bullet { background-color: #fff; opacity: 1; border-radius: 4px; transition: all 0.3s; } #index .banner .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #f19716; width: 48px; } #index .banner .banner-btn { position: absolute; z-index: 3; color: #fff; top: 50%; cursor: pointer; outline: none; } #index .banner .banner-btn i { display: block; width: 32px; height: 20px; background-size: 32px 9px; background-repeat: no-repeat; float: left; } #index .banner .banner-btn span { display: block; float: left; font-size: 20px; line-height: 20px; } #index .banner .banner-prev { left: 3.6%; } #index .banner .banner-prev i { background-image: url(../images/04.png); background-position: left 4px; } #index .banner .banner-prev span { margin-left: 16px; } #index .banner .banner-next { right: 3.6%; } #index .banner .banner-next i { background-image: url(../images/05.png); background-position: right 4px; } #index .banner .banner-next span { margin-right: 16px; } #index .about { width: 100%; padding: 65px 0 60px; } #index .about .about-main { width: 100%; overflow: hidden; margin-top: 60px; display: flex; align-items: center; } #index .about .about-main .left { width: 50%; height: 540px; background-image: url(../images/07.png); background-position: center center; background-size: cover; } #index .about .about-main .right { width: 50%; max-width: 690px; padding: 0 2.6%; } #index .about .about-main .right .name { font-size: 28px; color: #f19716; } #index .about .about-main .right .desc { font-size: 14px; line-height: 30px; margin-top: 30px; } #index .about .about-main .right .numbers { width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; } #index .about .about-main .right .numbers .item { width: 23%; margin-top: 35px; } #index .about .about-main .right .numbers .item .num { font-size: 64px; line-height: 50px; font-family: "DINCondensed"; color: #0068b7; } #index .about .about-main .right .numbers .item .text { width: 100%; font-size: 14px; color: #999; margin-top: 15px; } #index .about .about-main .right .readmore { margin-top: 50px; } #index .product { width: 100%; padding: 50px 0 80px; background-color: #f7f7f7; } #index .product .swiper { width: 94%; margin: 40px auto 0; position: relative; } #index .product .swiper .swiper-slide { width: 24.4%; border: 1px solid #E6E6E6; position: relative; } #index .product .swiper .swiper-slide .img { width: 100%; background-color: #fff; } #index .product .swiper .swiper-slide .img img { width: 100%; height: auto; } #index .product .swiper .swiper-slide .bot-text { width: 100%; padding: 20px 10px 26px; text-align: center; } #index .product .swiper .swiper-slide .bot-text .name { font-size: 24px; line-height: 24px; font-weight: bold; } #index .product .swiper .swiper-slide .bot-text .desc { font-size: 14px; line-height: 14px; color: #666; margin: 12px auto 0; } #index .product .swiper .swiper-slide .masklayer { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; overflow: hidden; transition: all 0.6s; } #index .product .swiper .swiper-slide .masklayer .texts { width: 100%; height: auto; position: absolute; top: 50%; left: 0; z-index: 4; transform: translateY(-50%); } #index .product .swiper .swiper-slide .masklayer .texts .name { width: 75%; text-align: center; font-size: 24px; color: #fff; margin: 0 auto; position: relative; overflow: hidden; } #index .product .swiper .swiper-slide .masklayer .texts .name p { display: none; animation-duration: 0.5s; } #index .product .swiper .swiper-slide .masklayer .texts .desc { width: 75%; text-align: center; font-size: 14px; line-height: 32px; color: #fff; margin: 30px auto 0; overflow: hidden; } #index .product .swiper .swiper-slide .masklayer .texts .desc p { display: none; animation-duration: 0.5s; animation-delay: 0.2s; } #index .product .swiper .swiper-slide .masklayer .texts .icon { display: block; width: 40px; height: 40px; margin: 60px auto 0; overflow: hidden; } #index .product .swiper .swiper-slide .masklayer .texts .icon img { width: 98%; height: 98%; display: none; animation-duration: 0.5s; animation-delay: 0.4s; } #index .product .swiper .swiper-slide .masklayer i { position: absolute; width: 200%; height: 100%; top: 0; left: -250%; background-color: #0068b7; -moz-transform: skewX(30deg); -o-transform: skewX(30deg); -ms-transform: skewX(30deg); -webkit-transform: skewX(30deg); transform: skewX(30deg); -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -o-transition: all 0.6s ease; transition: all 0.6s ease; } #index .product .swiper .swiper-slide:hover .masklayer .texts .name p { display: block; -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } #index .product .swiper .swiper-slide:hover .masklayer .texts .desc p { display: block; -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } #index .product .swiper .swiper-slide:hover .masklayer .texts .icon img { display: block; -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } #index .product .swiper .swiper-slide:hover .masklayer i { left: -50%; } #index .product .swiper .prod-btn { position: absolute; z-index: 3; color: #fff; top: 50%; cursor: pointer; outline: none; width: 18px; height: 32px; background-size: 18px 32px; background-repeat: no-repeat; } #index .product .swiper .prod-prev { left: -30px; background-image: url(../images/09.png); } #index .product .swiper .prod-next { right: -30px; background-image: url(../images/10.png); } #index .product .readmore { margin: 70px auto 0; } #index .service { width: 100%; position: relative; } #index .service .bg { width: 100%; height: 400px; background-image: url(../images/35.jpg); background-attachment: fixed; background-position: center; position: absolute; top: 0; left: 0; z-index: 1; } #index .service .texts { width: 94%; margin: 0 auto; padding-top: 95px; position: relative; z-index: 2; text-align: center; color: #fff; } #index .service .texts .cn { font-size: 24px; line-height: 24px; text-transform: uppercase; } #index .service .texts .en { font-size: 14px; line-height: 30px; margin-top: 18px; text-transform: uppercase; } #index .service .texts img { margin-top: 30px; } #index .service .swiper { width: 94%; max-width: 1400px; margin: 45px auto 0; background-color: #f19716; padding: 45px 0 55px; position: relative; z-index: 2; } #index .service .swiper .swiper-slide { width: 25%; color: #fff; position: relative; text-align: center; cursor: pointer; } #index .service .swiper .swiper-slide .icon { width: 80px; height: 80px; margin: 0 auto; } #index .service .swiper .swiper-slide .icon img { width: 100%; height: 100%; } #index .service .swiper .swiper-slide .big { width: 80%; margin: 20px auto 0; font-size: 18px; line-height: 18px; } #index .service .swiper .swiper-slide .line { display: block; width: 10px; height: 1px; background-color: #fff; margin: 12px auto 0; } #index .service .swiper .swiper-slide .small { width: 80%; margin: 12px auto 0; font-size: 14px; line-height: 20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } #index .service .swiper .swiper-slide .border { width: 1px; height: 40px; background-color: #f7c67f; display: block; position: absolute; top: 50%; right: 0; margin-top: -25px; } #index .service .swiper .swiper-slide:hover .icon { -webkit-transform: rotate3d(0, 1, 0, 360deg); -moz-transform: rotate3d(0, 1, 0, 360deg); transform: rotate3d(0, 1, 0, 360deg); transition: -webkit-transform 0.8s ease-in-out; transition: -moz-transform 0.8s ease-in-out; transition: transform 0.8s ease-in-out; } #index .service .swiper .service-btn { position: absolute; z-index: 3; color: #fff; top: 50%; cursor: pointer; outline: none; width: 16px; height: 28px; background-size: 16px 28px; background-repeat: no-repeat; } #index .service .swiper .service-prev { left: 30px; background-image: url(../images/18.png); } #index .service .swiper .service-next { right: 30px; background-image: url(../images/19.png); } #index .app { width: 100%; padding: 70px 0 90px; } #index .app .sub-cate { margin-top: 20px; } #index .app .list { width: 100%; margin-top: 50px; overflow: hidden; display: flex; flex-wrap: wrap; } #index .app .item { width: 31.42%; position: relative; margin-bottom: 40px; float: left; margin-left: 2.87%; } #index .app .item .tops { width: 100%; position: relative; } #index .app .item .tops .img { width: 100%; background-color: #fff; } #index .app .item .tops .img img { width: 100%; height: auto; } #index .app .item .tops .masklayer { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; overflow: hidden; transition: all 0.6s; } #index .app .item .tops .masklayer .texts { width: 100%; height: 100%; padding: 40px; position: relative; z-index: 2; } #index .app .item .tops .masklayer .texts .name { width: 100%; font-size: 24px; color: #fff; margin: 0 auto; position: relative; overflow: hidden; } #index .app .item .tops .masklayer .texts .name p { display: none; animation-duration: 0.5s; } #index .app .item .tops .masklayer .texts .desc { width: 100%; font-size: 16px; color: #fff; position: relative; overflow: hidden; margin-top: 10px; } #index .app .item .tops .masklayer .texts .desc p { display: none; animation-duration: 0.5s; } #index .app .item .tops .masklayer .texts .text { width: 100%; font-size: 14px; line-height: 30px; color: #fff; margin: 30px auto 0; overflow: hidden; } #index .app .item .tops .masklayer .texts .text p { display: none; animation-duration: 0.5s; animation-delay: 0.2s; } #index .app .item .tops .masklayer .texts .icon { display: block; width: 32px; height: 9px; position: absolute; left: 40px; bottom: 40px; overflow: hidden; } #index .app .item .tops .masklayer .texts .icon img { width: 100%; height: 100%; display: none; animation-duration: 0.5s; animation-delay: 0.4s; } #index .app .item .tops .masklayer i { position: absolute; width: 200%; height: 100%; top: 0; left: -250%; background-color: #0068b7; -moz-transform: skewX(30deg); -o-transform: skewX(30deg); -ms-transform: skewX(30deg); -webkit-transform: skewX(30deg); transform: skewX(30deg); -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -o-transition: all 0.6s ease; transition: all 0.6s ease; } #index .app .item .bots { width: 100%; padding: 20px 0 0; } #index .app .item .bots .name { font-size: 20px; line-height: 20px; font-weight: bold; } #index .app .item .bots .desc { font-size: 16px; line-height: 16px; color: #666; margin: 12px 0 0; } #index .app .item:nth-child(3n+1) { margin-left: 0; } #index .app .item:hover .tops .masklayer .texts .name p { display: block; -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } #index .app .item:hover .tops .masklayer .texts .desc p { display: block; -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } #index .app .item:hover .tops .masklayer .texts .text p { display: block; -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } #index .app .item:hover .tops .masklayer .texts .icon img { display: block; -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } #index .app .item:hover .tops .masklayer i { left: -50%; } #index .app .readmore { margin: 30px auto 0; } #news { width: 100%; } #news .big-title { width: 100%; padding: 0 3%; text-align: center; margin-top: 70px; } #news .big-title .big { font-size: 34px; line-height: 34px; font-weight: bold; } #news .big-title .small { font-size: 16px; line-height: 16px; color: #666; margin-top: 14px; } #news .news-list { width: 100%; margin-top: 50px; } #news .news-list .item { width: 100%; padding: 40px 0; border-bottom: 1px solid #E6E6E6; } #news .news-list .item a { overflow: hidden; display: flex; } #news .news-list .item a:hover .img img { transform: scale(1.1); } #news .news-list .item a:hover .right .title { color: #0168b7; } #news .news-list .item .img { width: 386px; height: 272px; float: left; overflow: hidden; flex-shrink: 0; flex-grow: 0; } #news .news-list .item .img img { width: 100%; height: 100%; transition: all 0.3s; } #news .news-list .item .right { width: calc(100% - 424px); margin-left: 38px; float: left; position: relative; } #news .news-list .item .right .title { font-size: 20px; line-height: 20px; transition: color 0.3s; margin-top: 15px; } #news .news-list .item .right .date { font-size: 14px; line-height: 14px; color: #999; margin-top: 20px; } #news .news-list .item .right .desc { font-size: 14px; line-height: 30px; color: #666; margin-top: 20px; } #news .news-list .item .right .readmore { position: absolute; left: 0; bottom: 0; } #news .news-detail { margin-top: 70px; } #news .news-detail .tops { width: 100%; background-color: #ebebeb; padding: 25px 30px 30px; text-align: center; } #news .news-detail .tops h1 { font-size: 24px; } #news .news-detail .tops .date { font-size: 14px; line-height: 14px; color: #666; margin-top: 14px; } #news .news-detail .news-content { width: 100%; padding: 50px 100px; font-size: 14px; line-height: 30px; color: #666; } #news .news-detail .news-content img { max-width: 100%; } #news .news-detail .prev-next { width: 100%; display: flex; justify-content: space-between; padding: 30px 0; border-top: 1px solid #E6E6E6; border-bottom: 1px solid #E6E6E6; } #news .news-detail .prev-next a { width: 35%; display: block; transition: all 0.3s; } #news .news-detail .prev-next a:hover { color: #0068b7; } #news .news-detail .prev-next .next { text-align: right; } #news .news-detail .back { width: 170px; height: 50px; border-radius: 25px; border: 1px solid #E6E6E6; display: block; font-size: 18px; color: #999; transition: all 0.3s; text-align: center; line-height: 50px; margin: 50px auto 90px; } #news .news-detail .back:hover { background-color: #0068b7; border-color: #0068b7; color: #fff; } #app .app-list .top-title { font-size: 34px; font-weight: bold; line-height: 34px; margin-top: 70px; } #app .app-list .pages { margin: 50px auto 100px; } #product { width: 100%; } #product .sub-cate { margin-top: 50px; display: none; } #product .product-list .top-title { font-size: 34px; font-weight: bold; line-height: 34px; margin-top: 70px; } #product .product-list .bots { width: 100%; margin-top: 40px; overflow: hidden; } #product .product-list .bots .subs { width: 280px; margin-right: 50px; border: 1px solid #E6E6E6; float: left; } #product .product-list .bots .subs a { display: block; width: 100%; height: 60px; line-height: 60px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; transition: all 0.3s; border-top: 1px solid #E6E6E6; } #product .product-list .bots .subs a:first-child { border-top: none; } #product .product-list .bots .subs a:hover, #product .product-list .bots .subs a.active { background-color: #f19716; color: #fff; } #product .product-list .bots .right-list { float: right; width: calc(100% - 330px); } #product .product-list .bots .right-list .list { width: 100%; overflow: hidden; } #product .product-list .bots .right-list .list .item { width: 30.6%; float: left; margin-left: 2.8%; margin-bottom: 20px; } #product .product-list .bots .right-list .list .item .img { width: 100%; height: auto; overflow: hidden; border: 1px solid #E6E6E6; } #product .product-list .bots .right-list .list .item .img img { width: 100%; height: 300px; object-fit: contain; transition: all 0.3s; } #product .product-list .bots .right-list .list .item .text { width: 100%; height: 24px; margin-top: 20px; line-height: 24px; transition: all 0.3s; overflow: hidden; } #product .product-list .bots .right-list .list .item .text span { display: block; float: left; width: 80%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 18px; } #product .product-list .bots .right-list .list .item .text i { display: block; width: 32px; height: 9px; float: right; margin-top: 7px; background-image: url(../images/65.png); background-repeat: no-repeat; background-position: -48px 0; transition: all 0.3s; } #product .product-list .bots .right-list .list .item:nth-child(3n+1) { margin-left: 0; } #product .product-list .bots .right-list .list .item:hover .img img { transform: scale(1.1); } #product .product-list .bots .right-list .list .item:hover .text { color: #0068b7; } #product .product-list .bots .right-list .list .item:hover .text i { background-position: 0 0; } #product .product-list .bots .right-list .pages { margin: 50px auto 100px; } #product .prod-detail { width: 100%; margin-top: 70px; } #product .prod-detail .pd-top { width: 100%; display: flex; } #product .prod-detail .pd-top .gallery { width: 520px; height: 366px; border: 1px solid #E6E6E6; flex-shrink: 0; overflow: hidden; } #product .prod-detail .pd-top .gallery img { /* width: 100%;*/ margin: 0 auto; display: block; height: 100%; transition: all 0.3s; } #product .prod-detail .pd-top .gallery:hover img { transform: scale(1.1); } #product .prod-detail .pd-top .right { width: auto; padding-left: 60px; } #product .prod-detail .pd-top .right .text1 { font-size: 36px; color: #0068b7; font-weight: bold; } #product .prod-detail .pd-top .right .text2 { font-size: 24px; } #product .prod-detail .pd-top .right .text3 { width: 100%; border-top: 1px solid #E6E6E6; padding-top: 20px; margin-top: 30px; line-height: 30px; color: #666; } #product .prod-detail .pd-top .right .thumb { width: 100%; overflow: hidden; margin-top: 30px; display: flex; overflow: hidden; } #product .prod-detail .pd-top .right .thumb .item { width: 180px; height: 126px; border: 1px solid #E6E6E6; float: left; margin-right: 20px; cursor: pointer; transition: all 0.3s; } #product .prod-detail .pd-top .right .thumb .item img { /* width: 100%;*/ margin: 0 auto; display: block; height: 100%; } #product .prod-detail .pd-top .right .thumb .item.active, #product .prod-detail .pd-top .right .thumb .item:hover { border-color: #0068b7; } #product .prod-detail .pd-top .right .thumb.thumb1 { display: none; } #product .prod-detail .pd-bot { margin-top: 70px; width: 100%; background-color: #fff; } #product .prod-detail .pd-bot .tab { width: 100%; overflow: hidden; } #product .prod-detail .pd-bot .tab .item { display: block; float: left; min-width: 136px; height: 40px; padding: 0 15px; white-space: nowrap; text-align: center; line-height: 40px; background-color: #f5f5f5; border-radius: 4px 4px 0 0; font-size: 18px; transition: all 0.3s; margin-right: 10px; } #product .prod-detail .pd-bot .tab .item:hover, #product .prod-detail .pd-bot .tab .item.active { background-color: #0068b7; color: #fff; } #product .prod-detail .pd-bot .details { width: 100%; border: 1px solid #E6E6E6; padding: 40px; font-size: 16px; line-height: 36px; } #product .prod-detail .pd-bot .details .content { display: none; } #product .prod-detail .pd-bot .details .content img { max-width: 100%; } #product .prod-detail .back { width: 170px; height: 50px; border-radius: 25px; border: 1px solid #E6E6E6; display: block; font-size: 18px; color: #999; transition: all 0.3s; text-align: center; line-height: 50px; margin: 70px auto 0; } #product .prod-detail .back:hover { background-color: #0068b7; border-color: #0068b7; color: #fff; } #product .prod-detail .recom { width: 100%; margin-top: 50px; margin-bottom: 100px; } #product .prod-detail .recom .tops { width: 100%; height: 64px; line-height: 64px; border-bottom: 2px solid #0068b7; font-size: 22px; } #product .prod-detail .recom .swiper { margin-top: 50px; width: 100%; } #product .prod-detail .recom .swiper .swiper-slide { width: 32%; } #product .prod-detail .recom .swiper .swiper-slide .img { width: 100%; height: auto; overflow: hidden; border: 1px solid #E6E6E6; } #product .prod-detail .recom .swiper .swiper-slide .img img { width: 100%; height: auto; transition: all 0.3s; } #product .prod-detail .recom .swiper .swiper-slide .text { width: 100%; height: 24px; margin-top: 20px; line-height: 24px; transition: all 0.3s; overflow: hidden; } #product .prod-detail .recom .swiper .swiper-slide .text span { display: block; float: left; width: 80%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 18px; } #product .prod-detail .recom .swiper .swiper-slide .text i { display: block; width: 32px; height: 9px; float: right; margin-top: 7px; background-image: url(../images/65.png); background-repeat: no-repeat; background-position: -48px 0; transition: all 0.3s; } #product .prod-detail .recom .swiper .swiper-slide:hover .img img { transform: scale(1.1); } #product .prod-detail .recom .swiper .swiper-slide:hover .text { color: #0068b7; } #product .prod-detail .recom .swiper .swiper-slide:hover .text i { background-position: 0 0; } #contact .main-tops { display: flex; justify-content: space-between; margin-top: 70px; margin-bottom: 70px; } #contact .main-tops .item { width: 45.8%; overflow: hidden; } #contact .main-tops .item .b-title { width: auto; height: 38px; line-height: 38px; padding: 0 20px; background-color: #0068b7; color: #fff; text-align: center; font-size: 22px; display: inline-block; } #contact .main-tops .texts .cn { font-size: 24px; color: #f19716; margin-top: 40px; } #contact .main-tops .texts .en { font-size: 16px; color: #999; } #contact .main-tops .texts .line { width: 100%; display: flex; margin-top: 20px; line-height: 21px; font-size: 16px; } #contact .main-tops .texts .line .label { white-space: nowrap; padding-left: 50px; background-position: left top; background-repeat: no-repeat; background-size: 22px 21px; } #contact .main-tops .texts .line .label.icon1 { background-image: url(../images/55.png); } #contact .main-tops .texts .line .label.icon2 { background-image: url(../images/56.png); } #contact .main-tops .texts .line .label.icon3 { background-image: url(../images/57.png); } #contact .main-tops .texts .line .label.icon4 { background-image: url(../images/58.png); } #contact .main-tops .texts .line .label.icon5 { background-image: url(../images/59.png); } #contact .main-tops .texts .line .label.icon6 { background-image: url(../images/60.png); } #contact .main-tops .texts .line .label.icon7 { background-image: url(../images/61.png); } #contact .main-tops .texts .line .label.icon8 { background-image: url(../images/62.png); } #contact .main-tops .form form { margin-top: 40px; } #contact .main-tops .form .line { width: 100%; display: flex; justify-content: space-between; margin-top: 20px; } #contact .main-tops .form .line .input { width: 100%; } #contact .main-tops .form .line .input input { width: 100%; height: 60px; border: 1px solid #E6E6E6; padding: 0 20px; background-color: #fff; border-radius: 0; } #contact .main-tops .form .line .textarea { width: 100%; height: 170px; } #contact .main-tops .form .line .textarea textarea { width: 100%; height: 170px; border: 1px solid #E6E6E6; padding: 16px 20px; resize: none; background-color: #fff; border-radius: 0; } #contact .main-tops .form .line.hasyzm { width: 100%; height: 60px; } #contact .main-tops .form .line.hasyzm .input { width: 36.36%; } #contact .main-tops .form .line.hasyzm .img { width: 22.72%; border: 1px solid #E6E6E6; } #contact .main-tops .form .line.hasyzm .img img { width: 100%; height: 60px; } #contact .main-tops .form .line.hasyzm .button { width: 34.84%; height: 60px; border: none; background-color: #0068b7; font-size: 18px; color: #fff; display: flex; align-items: center; justify-content: center; } #contact .main-tops .form .line.hasyzm .button i { display: inline-block; width: 18px; height: 18px; background-image: url(../images/54.png); background-size: 100% 100%; margin-left: 10px; } #contact .main-map { margin: 70px auto; } #contact .main-map #allmap { width: 100%; height: 400px; } #service .section1 { width: 100%; padding: 70px 0; } #service .section1 .main { display: flex; align-items: center; } #service .section1 .main .left { width: 590px; min-height: 296px; background-image: url(../images/76.png); background-size: contain; background-repeat: no-repeat; background-position: center center; flex-shrink: 0; } #service .section1 .main .left img { display: none; } #service .section1 .main .right { padding-left: 30px; } #service .section1 .main .right .big { font-size: 34px; font-weight: bold; } #service .section1 .main .right .small { font-size: 16px; color: #666; } #service .section1 .main .right .desc { font-size: 14px; line-height: 30px; margin-top: 25px; margin-bottom: 30px; } #service .section1 .main .right .line { width: 100%; display: flex; align-items: center; color: #f19716; margin-top: 10px; } #service .section1 .main .right .line i { display: block; width: 30px; height: 30px; background-size: 100% 100%; margin-right: 12px; flex-shrink: 0; } #service .section1 .main .right .line i.icon1 { background-image: url(../images/77.png); } #service .section1 .main .right .line i.icon2 { background-image: url(../images/78.png); } #service .section1 .main .right .line .text { display: block; font-size: 18px; color: #f19716; white-space: nowrap; } #service .section1 .main .right .line .text.spac { letter-spacing: 9px; } #service .section1 .main .right .line .big { font-size: 28px; font-style: italic; } #service .section2 { width: 100%; padding: 45px 0 55px; background-color: #f6f6f6; } #service .section2 .serv-tops { display: flex; align-items: center; justify-content: space-between; } #service .section2 .serv-tops .right { display: inline-flex; align-items: center; height: 40px; } #service .section2 .serv-tops .right .btn { width: 40px; height: 40px; border: 1px solid #E6E6E6; background-position: center; background-repeat: no-repeat; transition: all 0.3s; background-color: #fff; outline: none; cursor: pointer; } #service .section2 .serv-tops .right .btn:hover { border-color: #0068b7; background-color: #0068b7; } #service .section2 .serv-tops .right .prev { margin-right: 10px; background-image: url(../images/96.png); } #service .section2 .serv-tops .right .prev:hover { background-image: url(../images/98.png); } #service .section2 .serv-tops .right .next { background-image: url(../images/97.png); } #service .section2 .serv-tops .right .next:hover { background-image: url(../images/99.png); } #service .section2 .swiper { width: 100%; margin-top: 40px; } #service .section2 .swiper .swiper-slide { width: 23.85%; } #service .section2 .swiper .swiper-slide .img { width: 100%; height: auto; overflow: hidden; } #service .section2 .swiper .swiper-slide .img img { width: 100%; height: auto; transition: all 0.3s; } #service .section2 .swiper .swiper-slide .bots { width: 100%; position: relative; text-align: center; padding: 15px; } #service .section2 .swiper .swiper-slide .bots img { width: 60px; height: 60px; } #service .section2 .swiper .swiper-slide .bots p { display: block; width: 100%; font-size: 16px; } #service .section2 .swiper .swiper-slide .bots i { display: block; width: 1px; height: 36px; background-color: #dcdcdc; position: absolute; top: 50%; right: -10px; transform: translateY(-50%); } #service .section2 .swiper .swiper-slide:hover .img img { transform: scale(1.1); } #service .section3 { width: 100%; padding: 45px 0 55px; background-color: #fff; } #service .section3 .serv-tops { display: flex; align-items: center; justify-content: space-between; } #service .section3 .serv-tops .right { display: inline-flex; align-items: center; height: 40px; } #service .section3 .serv-tops .right .btn { width: 40px; height: 40px; border: 1px solid #E6E6E6; background-position: center; background-repeat: no-repeat; transition: all 0.3s; background-color: #fff; outline: none; cursor: pointer; } #service .section3 .serv-tops .right .btn:hover { border-color: #0068b7; background-color: #0068b7; } #service .section3 .serv-tops .right .prev { margin-right: 10px; background-image: url(../images/96.png); } #service .section3 .serv-tops .right .prev:hover { background-image: url(../images/98.png); } #service .section3 .serv-tops .right .next { background-image: url(../images/97.png); } #service .section3 .serv-tops .right .next:hover { background-image: url(../images/99.png); } #service .section3 .down-list { width: 100%; margin-top: 40px; overflow: hidden; } #service .section3 .down-list .item { width: 48%; float: left; border-bottom: 1px solid #e6e6e6; height: 50px; line-height: 50px; margin-top: 15px; margin-left: 4%; } #service .section3 .down-list .item span { display: block; float: left; width: calc(100% - 60px); height: 100%; font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #service .section3 .down-list .item i { display: block; width: 24px; height: 24px; background-image: url(../images/90.png); background-size: 100% 100%; transition: all 0.3s; float: right; margin: 13px 0; } #service .section3 .down-list .item:nth-child(2n+1) { margin-left: 0; } #service .section3 .pages { margin: 55px auto 0; } #service .section3 .swiper { width: 100%; margin-top: 40px; } #service .section3 .swiper .swiper-slide { width: 23.85%; } #service .section3 .swiper .swiper-slide .img { width: 100%; height: auto; overflow: hidden; border: 1px solid #E6E6E6; } #service .section3 .swiper .swiper-slide .img img { width: 100%; height: auto; transition: all 0.3s; } #service .section3 .swiper .swiper-slide .bots { width: 100%; height: 52px; border: 1px solid #E6E6E6; margin-top: 10px; padding: 0 20px; background-color: #f6f6f6; display: flex; justify-content: space-between; align-items: center; transition: all 0.3s; } #service .section3 .swiper .swiper-slide .bots p { width: 80%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: all 0.3s; font-size: 16px; } #service .section3 .swiper .swiper-slide .bots i { display: block; width: 24px; height: 24px; background-image: url(../images/90.png); background-size: 100% 100%; transition: all 0.3s; } #service .section3 .swiper .swiper-slide:hover .img img { transform: scale(1.1); } #service .section3 .swiper .swiper-slide:hover .bots { background-color: #0068b7; border-color: #0068b7; } #service .section3 .swiper .swiper-slide:hover .bots p { color: #fff; } #service .section3 .swiper .swiper-slide:hover .bots i { background-image: url(../images/91.png); } #about .section1 { /* background: url(../images/22.png) left center no-repeat;*/ width: 100%; padding: 70px 0 90px; } #about .section1 .main { background-image: url(../images/70.png); background-position: center center; background-repeat: no-repeat; background-size: contain; } #about .section1 .main .name { text-align: center; font-size: 34px; color: #f19716; } #about .section1 .main .desc { width: 100%; text-align: center; margin-top: 20px; line-height: 40px; } #about .section1 .main .slogan-cn { width: 100%; text-align: center; font-size: 24px; margin-top: 15px; } #about .section1 .main .slogan-en { width: 100%; text-align: center; font-size: 14px; line-height: 29px; color: #999; text-transform: uppercase; } #about .section1 .main .numbers { width: 100%; display: flex; justify-content: center; flex-wrap: wrap; } #about .section1 .main .numbers .item { margin-top: 35px; text-align: center; } #about .section1 .main .numbers .item .num { font-size: 64px; line-height: 50px; font-family: "DINCondensed"; color: #0068b7; } #about .section1 .main .numbers .item .text { width: 100%; font-size: 14px; color: #999; margin-top: 15px; } #about .section1 .main .numbers i { display: block; width: 1px; height: 34px; background-color: #eaeaea; flex-shrink: 0; margin: 50px 50px 0; } #about .section1 .main .swiper { width: 100%; margin-top: 60px; position: relative; } #about .section1 .main .swiper .swiper-slide { width: 23.85%; overflow: hidden; } #about .section1 .main .swiper .swiper-slide img { width: 100%; height: auto; transition: all 0.3s; } #about .section1 .main .swiper .swiper-slide:hover img { transform: scale(1.1); } #about .section1 .main .swiper .btn { width: 40px; height: 40px; border: 1px solid #E6E6E6; background-position: center; background-repeat: no-repeat; transition: all 0.3s; background-color: #fff; outline: none; cursor: pointer; position: absolute; top: 50%; margin-top: -20px; z-index: 2; } #about .section1 .main .swiper .btn:hover { border-color: #0068b7; background-color: #0068b7; } #about .section1 .main .swiper .prev { left: -20px; background-image: url(../images/96.png); } #about .section1 .main .swiper .prev:hover { background-image: url(../images/98.png); } #about .section1 .main .swiper .next { right: -20px; background-image: url(../images/97.png); } #about .section1 .main .swiper .next:hover { background-image: url(../images/99.png); } #about .section2 { width: 100%; padding: 70px 0 120px; background-image: url(../images/128.png); background-position: center; } #about .section2 .swiper { width: 100%; margin-top: 70px; position: relative; } #about .section2 .swiper .swiper-slide { width: 23.85%; overflow: hidden; } #about .section2 .swiper .swiper-slide .img { width: 100%; height: auto; overflow: hidden; border: 1px solid #E6E6E6; } #about .section2 .swiper .swiper-slide .img img { width: 100%; transition: all 0.3s; } #about .section2 .swiper .swiper-slide .bots { width: 100%; height: 106px; padding: 10px 18px; border: 1px solid #E6E6E6; background-color: #f6f6f6; margin-top: 10px; display: flex; justify-content: space-between; align-items: center; transition: all 0.3s; } #about .section2 .swiper .swiper-slide .bots .left { width: 100%; padding-right: 10px; } #about .section2 .swiper .swiper-slide .bots .left .big { font-size: 20px; line-height: 24px; } #about .section2 .swiper .swiper-slide .bots .left .small { font-size: 14px; color: #666; margin-top: 10px; transition: all 0.3s; } #about .section2 .swiper .swiper-slide .bots i { display: block; width: 36px; height: 36px; background-size: 100% 100%; flex-shrink: 0; transition: all 0.3s; } #about .section2 .swiper .swiper-slide .bots i.icon1 { background-image: url(../images/110.png); } #about .section2 .swiper .swiper-slide .bots i.icon2 { background-image: url(../images/111.png); } #about .section2 .swiper .swiper-slide .bots i.icon3 { background-image: url(../images/112.png); } #about .section2 .swiper .swiper-slide .bots i.icon4 { background-image: url(../images/113.png); } #about .section2 .swiper .swiper-slide .bots i.icon5 { background-image: url(../images/114.png); } #about .section2 .swiper .swiper-slide .bots i.icon6 { background-image: url(../images/115.png); } #about .section2 .swiper .swiper-slide .bots i.icon7 { background-image: url(../images/116.png); } #about .section2 .swiper .swiper-slide .bots i.icon8 { background-image: url(../images/117.png); } #about .section2 .swiper .swiper-slide .bots i.icon9 { background-image: url(../images/118.png); } #about .section2 .swiper .swiper-slide:hover .img img { transform: scale(1.1); } #about .section2 .swiper .swiper-slide:hover .bots { background-color: #0068b7; border-color: #0068b7; color: #fff; } #about .section2 .swiper .swiper-slide:hover .bots .left .small { color: #fff; } #about .section2 .swiper .swiper-slide:hover .bots i.icon1 { background-image: url(../images/119.png); } #about .section2 .swiper .swiper-slide:hover .bots i.icon2 { background-image: url(../images/120.png); } #about .section2 .swiper .swiper-slide:hover .bots i.icon3 { background-image: url(../images/121.png); } #about .section2 .swiper .swiper-slide:hover .bots i.icon4 { background-image: url(../images/122.png); } #about .section2 .swiper .swiper-slide:hover .bots i.icon5 { background-image: url(../images/123.png); } #about .section2 .swiper .swiper-slide:hover .bots i.icon6 { background-image: url(../images/124.png); } #about .section2 .swiper .swiper-slide:hover .bots i.icon7 { background-image: url(../images/125.png); } #about .section2 .swiper .swiper-slide:hover .bots i.icon8 { background-image: url(../images/126.png); } #about .section2 .swiper .swiper-slide:hover .bots i.icon9 { background-image: url(../images/127.png); } #about .section2 .swiper .btn { width: 40px; height: 40px; border: 1px solid #E6E6E6; background-position: center; background-repeat: no-repeat; transition: all 0.3s; background-color: #fff; outline: none; cursor: pointer; position: absolute; top: 50%; margin-top: -20px; z-index: 2; } #about .section2 .swiper .btn:hover { border-color: #0068b7; background-color: #0068b7; } #about .section2 .swiper .prev { left: -20px; background-image: url(../images/96.png); } #about .section2 .swiper .prev:hover { background-image: url(../images/98.png); } #about .section2 .swiper .next { right: -20px; background-image: url(../images/97.png); } #about .section2 .swiper .next:hover { background-image: url(../images/99.png); } #about .section3 { width: 100%; padding: 70px 0 70px; } #about .section3 .hr { width: 100%; height: 1px; background-color: #ccc; position: absolute; top: 95px; z-index: 1; } #about .section3 .swiper { width: 100%; margin-top: 30px; position: relative; } #about .section3 .swiper .swiper-slide { width: 220px; height: 220px; text-align: center; padding-top: 50px; transition: all 0.3s; cursor: grab; } #about .section3 .swiper .swiper-slide .year { width: 100%; height: 30px; line-height: 30px; font-size: 22px; color: #666; transition: all 0.3s; } #about .section3 .swiper .swiper-slide .dot { width: 10px; height: 10px; border: 2px solid #fff; border-radius: 50%; background-color: #999; transition: all 0.3s; display: block; margin: 10px auto; position: relative; z-index: 2; } #about .section3 .swiper .swiper-slide .col { width: 100%; height: 1px; background-color: transparent; position: absolute; top: 95px; left: 0; z-index: 1; transition: all 0.3s; } #about .section3 .swiper .swiper-slide .line { width: 1px; height: 38px; background-color: #ccc; transition: all 0.3s; display: block; margin: 10px auto; } #about .section3 .swiper .swiper-slide .desc { width: 100%; padding: 0 40px; font-size: 14px; line-height: 30px; height: 60px; } #about .section3 .swiper .swiper-slide:hover, #about .section3 .swiper .swiper-slide.active { background-color: #0068b7; } #about .section3 .swiper .swiper-slide:hover .year, #about .section3 .swiper .swiper-slide.active .year { color: #fff; font-size: 30px; } #about .section3 .swiper .swiper-slide:hover .dot, #about .section3 .swiper .swiper-slide.active .dot { background-color: #0068b7; border-color: #fff; } #about .section3 .swiper .swiper-slide:hover .col, #about .section3 .swiper .swiper-slide.active .col { background-color: #fff; } #about .section3 .swiper .swiper-slide:hover .line, #about .section3 .swiper .swiper-slide.active .line { height: 1px; } #about .section3 .swiper .swiper-slide:hover .desc, #about .section3 .swiper .swiper-slide.active .desc { color: #fff; } #about .section3 .swiper .btn { width: 36px; height: 36px; border-radius: 50%; background-color: #ccc; background-position: center; background-repeat: no-repeat; transition: all 0.3s; outline: none; cursor: pointer; position: absolute; top: 77px; z-index: 2; } #about .section3 .swiper .btn:hover { background-color: #0068b7; } #about .section3 .swiper .prev { left: -20px; background-image: url(../images/98.png); } #about .section3 .swiper .next { right: -20px; background-image: url(../images/99.png); } #about .section4 { width: 100%; padding: 70px 0 70px; background-color: #f3f3f3; } #about .section4 .honor-list { width: 100%; margin-top: 50px; overflow: hidden; } #about .section4 .honor-list .item { width: 23.85%; float: left; } #about .section4 .honor-list .item .img { border: 1px solid #E6E6E6; padding: 10px; } #about .section4 .honor-list .item .img img { width: 100%; } #about .section4 .honor-list .item .label { width: 100%; height: 50px; text-align: center; background-color: #0068b7; color: #fff; font-size: 16px; margin-top: 10px; line-height: 50px; padding: 0 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #about .section4 .honor-list .item:nth-child(1) { margin-left: 0; } #about .section4 .pages { margin: 45px auto 0; } #search .search-box { width: 100%; margin: 40px 0 30px; height: 54px; position: relative; } #search .search-box .main { height: 100%; margin:0 auto; } #search .search-box .left { width: 540px; max-width: 38.57%; height: 100%; display: inline-block; float: left; border: 1px solid #e6e6e6; border-radius: 2px; } #search .search-box .left .select { display: inline-block; float: left; width: 90px; height: 100%; padding: 0 10px 0 0; position: relative; } #search .search-box .left .select > span { display: block; width: 100%; height: 100%; line-height: 54px; font-size: 18px; padding: 0 14px 0 14px; background-image: url("../images/67.png"); background-position: right center; background-repeat: no-repeat; cursor: pointer; } #search .search-box .left .select .sub { width: 100%; position: absolute; top: 55px; left: 0; border: 1px solid #e6e6e6; background-color: #fff; z-index: 99; display: none; } #search .search-box .left .select .sub span { display: block; width: 100%; text-align: center; height: 30px; line-height: 30px; transition: all 0.3s; cursor: pointer; } #search .search-box .left .select .sub span:hover, #search .search-box .left .select .sub span.active { background-color: #0068b7; color: #fff; } #search .search-box .left .input { display: inline-block; float: left; width: calc(100% - 90px); height: 100%; border-left: 1px solid #e6e6e6; } #search .search-box .left .input input { width: 100%; height: 100%; padding: 0 10px; border: none; background-color: #fff; border-radius: 0; font-size: 18px; } #search .search-box .btn { display: inline-block; float: left; } #search .search-box .btn button { width: 117px; height: 54px; background-color: #0068b7; border: none; color: #fff; font-size: 18px; display: flex; align-items: center; justify-content: center; cursor: pointer; } #search .search-box .btn button span { display: inline-block; line-height: 18px; } #search .search-box .btn button i { display: inline-block; width: 24px; height: 24px; background-image: url("../images/68.png"); background-size: 100% 100%; margin-left: 5px; } #search .search-result { width: 100%; } #search .search-result .item { width: 100%; padding: 24px 0; border-bottom: 1px solid #e6e6e6; } #search .search-result .item .title { width: 100%; line-height: 16px; font-size: 16px; display: flex; align-items: center; } #search .search-result .item .title i { display: inline-block; width: 4px; height: 4px; background-color: #0068b7; margin-right: 10px; } #search .search-result .item .title p { display: inline-block; width: calc(100% - 14px); } #search .search-result .item .date { width: 100%; font-size: 14px; line-height: 14px; color: #999; margin-top: 10px; padding-left: 14px; } #search .search-result .pages { margin-top: 50px; } .app-list .list { width: 100%; margin-top: 50px; overflow: hidden; display: flex; flex-wrap: wrap; } .app-list .item { width: 31.42%; position: relative; margin-bottom: 40px; float: left; margin-left: 2.87%; } .app-list .item .tops { width: 100%; position: relative; } .app-list .item .tops .img { width: 100%; background-color: #fff; } .app-list .item .tops .img img { width: 100%; height: auto; } .app-list .item .tops .masklayer { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; overflow: hidden; transition: all 0.6s; } .app-list .item .tops .masklayer .texts { width: 100%; height: 100%; padding: 40px; position: relative; z-index: 2; } .app-list .item .tops .masklayer .texts .name { width: 100%; font-size: 24px; color: #fff; margin: 0 auto; position: relative; overflow: hidden; } .app-list .item .tops .masklayer .texts .name p { display: none; animation-duration: 0.5s; } .app-list .item .tops .masklayer .texts .desc { width: 100%; font-size: 16px; color: #fff; position: relative; overflow: hidden; margin-top: 10px; } .app-list .item .tops .masklayer .texts .desc p { display: none; animation-duration: 0.5s; } .app-list .item .tops .masklayer .texts .text { width: 100%; font-size: 14px; line-height: 30px; color: #fff; margin: 30px auto 0; overflow: hidden; } .app-list .item .tops .masklayer .texts .text p { display: none; animation-duration: 0.5s; animation-delay: 0.2s; } .app-list .item .tops .masklayer .texts .icon { display: block; width: 32px; height: 9px; position: absolute; left: 40px; bottom: 40px; overflow: hidden; } .app-list .item .tops .masklayer .texts .icon img { width: 100%; height: 100%; display: none; animation-duration: 0.5s; animation-delay: 0.4s; } .app-list .item .tops .masklayer i { position: absolute; width: 200%; height: 100%; top: 0; left: -250%; background-color: #0068b7; -moz-transform: skewX(30deg); -o-transform: skewX(30deg); -ms-transform: skewX(30deg); -webkit-transform: skewX(30deg); transform: skewX(30deg); -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -o-transition: all 0.6s ease; transition: all 0.6s ease; } .app-list .item .bots { width: 100%; padding: 20px 0 0; } .app-list .item .bots .name { font-size: 20px; line-height: 20px; font-weight: bold; } .app-list .item .bots .desc { font-size: 16px; line-height: 16px; color: #666; margin: 12px 0 0; } .app-list .item:nth-child(3n+1) { margin-left: 0; } .app-list .item:hover .tops .masklayer .texts .name p { display: block; -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } .app-list .item:hover .tops .masklayer .texts .desc p { display: block; -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } .app-list .item:hover .tops .masklayer .texts .text p { display: block; -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } .app-list .item:hover .tops .masklayer .texts .icon img { display: block; -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } .app-list .item:hover .tops .masklayer i { left: -50%; } @media screen and (max-width: 1440px) { #index .banner .swiper-slide .main { left: 13.33%; } #index .banner .swiper-slide .texts .text1 { font-size: 40px; line-height: 40px; margin-top: 15px; } #index .banner .swiper-slide .texts .text1 i { height: 40px; } #index .banner .swiper-slide .texts .text2 { font-size: 18px; line-height: 18px; margin-top: 15px; } #index .banner .swiper-slide .texts .text2 i { height: 20px; } #index .banner .swiper-pagination-bullet { border-radius: 4px; } #index .banner .swiper-pagination-bullet.swiper-pagination-bullet-active { width: 30px; } #index .banner .banner-btn { top: 50%; } #index .banner .banner-btn i { width: 32px; height: 20px; background-size: 32px 9px; } #index .banner .banner-btn span { font-size: 16px; line-height: 16px; } #index .banner .banner-prev { left: 3%; } #index .banner .banner-prev i { background-position: left 4px; } #index .banner .banner-prev span { margin-left: 16px; } #index .banner .banner-next { right: 3%; } #index .banner .banner-next i { background-position: right 4px; } #index .banner .banner-next span { margin-right: 16px; } #index .product { padding: 50px 0 80px; } #index .product .swiper { width: 94%; margin: 40px auto 0; } #index .product .swiper .swiper-slide { width: 24.4%; } #index .product .swiper .swiper-slide .bot-text { padding: 20px 10px 26px; } #index .product .swiper .swiper-slide .bot-text .name { font-size: 24px; line-height: 24px; } #index .product .swiper .swiper-slide .bot-text .desc { font-size: 14px; line-height: 14px; margin: 12px auto 0; } #index .product .swiper .swiper-slide .masklayer .texts { top: 50%; left: 0; } #index .product .swiper .swiper-slide .masklayer .texts .name { width: 75%; font-size: 24px; } #index .product .swiper .swiper-slide .masklayer .texts .desc { width: 75%; font-size: 14px; line-height: 32px; margin: 30px auto 0; } #index .product .swiper .swiper-slide .masklayer .texts .icon { width: 40px; height: 40px; margin: 40px auto 0; } #index .product .swiper .swiper-slide .masklayer i { position: absolute; width: 200%; height: 100%; top: 0; left: -250%; } #index .product .swiper .swiper-slide:hover .masklayer i { left: -50%; } #index .product .swiper .prod-btn { top: 50%; width: 18px; height: 32px; background-size: 18px 32px; } #index .product .swiper .prod-prev { left: -30px; } #index .product .swiper .prod-next { right: -30px; } #index .product .readmore { margin: 70px auto 0; } } @media screen and (max-width: 1280px) { #index .product { padding: 50px 0 80px; } #index .product .swiper { width: 94%; margin: 40px auto 0; } #index .product .swiper .swiper-slide { width: 24.4%; } #index .product .swiper .swiper-slide .bot-text { padding: 20px 10px 20px; } #index .product .swiper .swiper-slide .bot-text .name { font-size: 20px; line-height: 20px; } #index .product .swiper .swiper-slide .bot-text .desc { font-size: 14px; line-height: 14px; margin: 12px auto 0; } #index .product .swiper .swiper-slide .masklayer .texts { top: 50%; left: 0; } #index .product .swiper .swiper-slide .masklayer .texts .name { width: 75%; font-size: 20px; } #index .product .swiper .swiper-slide .masklayer .texts .desc { width: 75%; font-size: 14px; line-height: 24px; margin: 20px auto 0; } #index .product .swiper .swiper-slide .masklayer .texts .icon { width: 30px; height: 30px; margin: 30px auto 0; } #index .product .swiper .swiper-slide .masklayer i { position: absolute; width: 200%; height: 100%; top: 0; left: -250%; } #index .product .swiper .swiper-slide:hover .masklayer i { left: -50%; } #index .product .swiper .prod-btn { top: 50%; width: 18px; height: 32px; background-size: 18px 32px; } #index .product .swiper .prod-prev { left: -22px; } #index .product .swiper .prod-next { right: -22px; } #index .product .readmore { margin: 50px auto 0; } #index .service .bg { height: 400px; } #index .service .texts { width: 94%; padding-top: 95px; } #index .service .texts .cn { font-size: 24px; line-height: 24px; } #index .service .texts .en { font-size: 14px; line-height: 30px; margin-top: 18px; } #index .service .texts img { margin-top: 30px; } #index .service .swiper { width: 94%; max-width: 1400px; margin: 45px auto 0; padding: 45px 0 55px; } #index .service .swiper .swiper-slide { width: 25%; } #index .service .swiper .swiper-slide .icon { width: 80px; height: 80px; } #index .service .swiper .swiper-slide .big { width: 80%; margin: 20px auto 0; font-size: 18px; line-height: 18px; } #index .service .swiper .swiper-slide .line { width: 10px; height: 1px; margin: 12px auto 0; } #index .service .swiper .swiper-slide .small { width: 80%; margin: 12px auto 0; font-size: 14px; line-height: 20px; } #index .service .swiper .swiper-slide .border { width: 1px; height: 40px; top: 50%; right: 0; margin-top: -25px; } #index .service .swiper .service-btn { top: 50%; width: 16px; height: 28px; background-size: 16px 28px; } #index .service .swiper .service-prev { left: 10px; } #index .service .swiper .service-next { right: 10px; } #index .app { padding: 70px 0 90px; } #index .app .sub-cate { margin-top: 20px; } #index .app .list { margin-top: 50px; } #index .app .item { width: 31.42%; margin-bottom: 40px; margin-left: 2.87%; } #index .app .item .tops .masklayer .texts { padding: 30px; } #index .app .item .tops .masklayer .texts .name { font-size: 20px; } #index .app .item .tops .masklayer .texts .desc { font-size: 16px; margin-top: 10px; } #index .app .item .tops .masklayer .texts .text { font-size: 14px; line-height: 26px; margin: 20px auto 0; } #index .app .item .tops .masklayer .texts .icon { width: 32px; height: 9px; left: 30px; bottom: 30px; } #index .app .item .tops .masklayer i { width: 200%; height: 100%; top: 0; left: -250%; } #index .app .item .bots { padding: 20px 0 0; } #index .app .item .bots .name { font-size: 18px; line-height: 18px; } #index .app .item .bots .desc { font-size: 14px; line-height: 14px; margin: 10px 0 0; } #index .app .item:nth-child(3n+1) { margin-left: 0; } #index .app .readmore { margin: 30px auto 0; } #news .news-detail { margin-top: 60px; } #news .news-detail .tops { padding: 25px 30px 30px; } #news .news-detail .tops h1 { font-size: 24px; } #news .news-detail .tops .date { font-size: 14px; line-height: 14px; margin-top: 14px; } #news .news-detail .news-content { padding: 50px 50px; font-size: 14px; line-height: 30px; } #news .news-detail .prev-next { padding: 30px 0; } #news .news-detail .prev-next a { width: 35%; } #news .news-detail .back { width: 170px; height: 50px; border-radius: 25px; font-size: 18px; line-height: 50px; margin: 50px auto 70px; } #contact .main-tops { margin-top: 60px; margin-bottom: 60px; } #contact .main-tops .item { width: 46%; } #contact .main-tops .item .b-title { height: 32px; line-height: 32px; padding: 0 16px; font-size: 20px; } #contact .main-tops .texts .cn { font-size: 22px; margin-top: 40px; } #contact .main-tops .texts .en { font-size: 14px; } #contact .main-tops .texts .line { margin-top: 14px; line-height: 21px; font-size: 14px; } #contact .main-tops .texts .line .label { padding-left: 30px; } #contact .main-tops .form form { margin-top: 40px; } #contact .main-tops .form .line { margin-top: 20px; } #contact .main-tops .form .line .input input { height: 50px; padding: 0 20px; } #contact .main-tops .form .line .textarea { height: 150px; } #contact .main-tops .form .line .textarea textarea { height: 150px; padding: 16px 20px; } #contact .main-tops .form .line.hasyzm { height: 50px; } #contact .main-tops .form .line.hasyzm .input { width: 36.36%; } #contact .main-tops .form .line.hasyzm .img { width: 22.72%; } #contact .main-tops .form .line.hasyzm .img img { height: 50px; } #contact .main-tops .form .line.hasyzm .button { width: 34.84%; height: 50px; font-size: 16px; } #contact .main-tops .form .line.hasyzm .button i { width: 16px; height: 16px; margin-left: 10px; } #service .section1 { padding: 60px 0; } #service .section1 .main { display: block; } #service .section1 .main .left { width: 100%; min-height: auto; } #service .section1 .main .left img { display: block; width: 100%; } #service .section1 .main .right { padding-left: 0; margin-top: 30px; } #service .section1 .main .right .big { font-size: 34px; } #service .section1 .main .right .small { font-size: 16px; } #service .section1 .main .right .desc { font-size: 14px; line-height: 30px; margin-top: 25px; margin-bottom: 30px; } #service .section1 .main .right .line { width: 100%; margin-top: 10px; } #service .section1 .main .right .line i { width: 30px; height: 30px; margin-right: 12px; } #service .section1 .main .right .line .text { font-size: 18px; } #service .section1 .main .right .line .text.spac { letter-spacing: 9px; } #service .section1 .main .right .line .big { font-size: 28px; } #about .section1 { padding: 60px 0 60px; } #about .section1 .main .name { font-size: 26px; } #about .section1 .main .desc { margin-top: 20px; line-height: 30px; } #about .section1 .main .slogan-cn { font-size: 20px; margin-top: 15px; } #about .section1 .main .slogan-en { font-size: 14px; line-height: 29px; } #about .section1 .main .numbers .item { margin-top: 35px; } #about .section1 .main .numbers .item .num { font-size: 64px; line-height: 50px; } #about .section1 .main .numbers .item .text { font-size: 14px; margin-top: 15px; } #about .section1 .main .numbers i { height: 34px; margin: 50px 30px 0; } #about .section1 .main .swiper { margin-top: 50px; } #about .section1 .main .swiper .swiper-slide { width: 23.85%; } #about .section1 .main .swiper .btn { width: 40px; height: 40px; top: 50%; margin-top: -20px; } #about .section1 .main .swiper .prev { left: -20px; } #about .section1 .main .swiper .next { right: -20px; } #about .section2 { padding: 70px 0 70px; } #about .section2 .swiper { margin-top: 50px; } #about .section2 .swiper .swiper-slide { width: 23.85%; } #about .section2 .swiper .swiper-slide .bots { height: 106px; padding: 10px 18px; margin-top: 10px; } #about .section2 .swiper .swiper-slide .bots .left { padding-right: 10px; } #about .section2 .swiper .swiper-slide .bots .left .big { font-size: 20px; line-height: 24px; } #about .section2 .swiper .swiper-slide .bots .left .small { font-size: 14px; margin-top: 10px; } #about .section2 .swiper .swiper-slide .bots i { width: 36px; height: 36px; } #about .section2 .swiper .btn { width: 40px; height: 40px; margin-top: -20px; } #about .section2 .swiper .prev { left: -20px; } #about .section2 .swiper .next { right: -20px; } #about .section3 { padding: 70px 0 70px; } #about .section3 .hr { top: 95px; } #about .section3 .swiper { margin-top: 30px; } #about .section3 .swiper .swiper-slide { width: 220px; height: 220px; padding-top: 50px; } #about .section3 .swiper .swiper-slide .year { height: 30px; line-height: 30px; font-size: 22px; } #about .section3 .swiper .swiper-slide .dot { width: 10px; height: 10px; margin: 10px auto; } #about .section3 .swiper .swiper-slide .col { top: 95px; } #about .section3 .swiper .swiper-slide .line { height: 38px; margin: 10px auto; } #about .section3 .swiper .swiper-slide .desc { padding: 0 40px; font-size: 14px; line-height: 30px; height: 60px; } #about .section3 .swiper .swiper-slide:hover .year, #about .section3 .swiper .swiper-slide.active .year { font-size: 30px; } #about .section3 .swiper .btn { width: 36px; height: 36px; top: 77px; } #about .section3 .swiper .prev { left: -20px; } #about .section3 .swiper .next { right: -20px; } #product .prod-detail { margin-top: 60px; } #product .prod-detail .pd-top .gallery { width: 460px; height: 324px; } #product .prod-detail .pd-top .right { padding-left: 40px; } #product .prod-detail .pd-top .right .text1 { font-size: 32px; } #product .prod-detail .pd-top .right .text2 { font-size: 24px; } #product .prod-detail .pd-top .right .text3 { padding-top: 20px; margin-top: 20px; line-height: 30px; } #product .prod-detail .pd-top .right .thumb { margin-top: 20px; } #product .prod-detail .pd-top .right .thumb .item { width: 120px; height: 85px; margin-right: 10px; } .app-list .list { margin-top: 50px; } .app-list .item { width: 31.42%; margin-bottom: 40px; margin-left: 2.87%; } .app-list .item .tops .masklayer .texts { padding: 30px; } .app-list .item .tops .masklayer .texts .name { font-size: 20px; } .app-list .item .tops .masklayer .texts .desc { font-size: 16px; margin-top: 10px; } .app-list .item .tops .masklayer .texts .text { font-size: 14px; line-height: 26px; margin: 20px auto 0; } .app-list .item .tops .masklayer .texts .icon { width: 32px; height: 9px; left: 30px; bottom: 30px; } .app-list .item .tops .masklayer i { width: 200%; height: 100%; top: 0; left: -250%; } .app-list .item .bots { padding: 20px 0 0; } .app-list .item .bots .name { font-size: 18px; line-height: 18px; } .app-list .item .bots .desc { font-size: 14px; line-height: 14px; margin: 10px 0 0; } .app-list .item:nth-child(3n+1) { margin-left: 0; } } @media screen and (max-width: 1024px) { #index .banner .swiper-slide .main { left: 13.33%; } #index .banner .swiper-slide .texts .text1 { font-size: 40px; line-height: 40px; margin-top: 15px; } #index .banner .swiper-slide .texts .text1 i { height: 40px; } #index .banner .swiper-slide .texts .text2 { font-size: 18px; line-height: 18px; margin-top: 15px; } #index .banner .swiper-slide .texts .text2 i { height: 20px; } #index .banner .swiper-pagination-bullet { border-radius: 4px; } #index .banner .swiper-pagination-bullet.swiper-pagination-bullet-active { width: 30px; } #index .banner .banner-btn { top: 50%; } #index .banner .banner-btn i { width: 32px; height: 20px; background-size: 32px 9px; } #index .banner .banner-btn span { font-size: 16px; line-height: 16px; } #index .banner .banner-prev { left: 3%; } #index .banner .banner-prev i { background-position: left 4px; } #index .banner .banner-prev span { margin-left: 16px; } #index .banner .banner-next { right: 3%; } #index .banner .banner-next i { background-position: right 4px; } #index .banner .banner-next span { margin-right: 16px; } #index .about { padding: 50px 0 50px; } #index .about .about-main { margin-top: 50px; } #index .about .about-main .left { width: 50%; height: 540px; } #index .about .about-main .right { width: 50%; max-width: 690px; padding: 0 2.6%; } #index .about .about-main .right .name { font-size: 24px; } #index .about .about-main .right .desc { font-size: 14px; line-height: 28px; margin-top: 20px; } #index .about .about-main .right .numbers { width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; } #index .about .about-main .right .numbers .item { width: 48%; margin-top: 25px; } #index .about .about-main .right .numbers .item .num { font-size: 64px; line-height: 50px; font-family: "DINCondensed"; color: #0068b7; } #index .about .about-main .right .numbers .item .text { width: 100%; font-size: 14px; color: #999; margin-top: 10px; } #index .about .about-main .right .readmore { margin-top: 40px; } #index .service .bg { height: 400px; } #index .service .texts { width: 94%; padding-top: 95px; } #index .service .texts .cn { font-size: 24px; line-height: 24px; } #index .service .texts .en { font-size: 14px; line-height: 30px; margin-top: 18px; } #index .service .texts img { margin-top: 30px; } #index .service .swiper { width: 94%; max-width: 1400px; margin: 45px auto 0; padding: 30px 0 30px; } #index .service .swiper .swiper-slide { width: 25%; } #index .service .swiper .swiper-slide .icon { width: 60px; height: 60px; } #index .service .swiper .swiper-slide .big { width: 80%; margin: 20px auto 0; font-size: 16px; line-height: 16px; } #index .service .swiper .swiper-slide .line { width: 10px; height: 1px; margin: 10px auto 0; } #index .service .swiper .swiper-slide .small { width: 80%; margin: 10px auto 0; font-size: 14px; line-height: 20px; } #index .service .swiper .swiper-slide .border { width: 1px; height: 40px; top: 50%; right: 0; margin-top: -25px; } #index .service .swiper .service-btn { top: 50%; width: 16px; height: 28px; background-size: 16px 28px; } #index .service .swiper .service-prev { left: 10px; } #index .service .swiper .service-next { right: 10px; } #index .app { padding: 50px 0 50px; } #index .app .sub-cate { margin-top: 20px; } #index .app .list { margin-top: 50px; } #index .app .item { width: 48%; margin-bottom: 40px; margin-left: 4%; } #index .app .item .tops .masklayer .texts { padding: 30px; } #index .app .item .tops .masklayer .texts .name { font-size: 20px; } #index .app .item .tops .masklayer .texts .desc { font-size: 16px; margin-top: 10px; } #index .app .item .tops .masklayer .texts .text { font-size: 14px; line-height: 26px; margin: 20px auto 0; } #index .app .item .tops .masklayer .texts .icon { width: 32px; height: 9px; left: 30px; bottom: 30px; } #index .app .item .tops .masklayer i { width: 200%; height: 100%; top: 0; left: -250%; } #index .app .item .bots { padding: 20px 0 0; } #index .app .item .bots .name { font-size: 18px; line-height: 18px; } #index .app .item .bots .desc { font-size: 14px; line-height: 14px; margin: 10px 0 0; } #index .app .item:nth-child(3n+1) { margin-left: 4%; } #index .app .item:nth-child(2n+1) { margin-left: 0; } #index .app .readmore { margin: 30px auto 0; } #news .big-title { margin-top: 50px; } #news .big-title .big { font-size: 28px; line-height: 28px; } #news .big-title .small { font-size: 14px; line-height: 14px; margin-top: 10px; } #news .news-list { margin-top: 50px; } #news .news-list .item { padding: 30px 0; } #news .news-list .item .img { width: 280px; height: 197px; } #news .news-list .item .right { width: calc(100% - 310px); margin-left: 30px; } #news .news-list .item .right .title { font-size: 18px; line-height: 18px; margin-top: 8px; } #news .news-list .item .right .date { font-size: 14px; line-height: 14px; margin-top: 14px; } #news .news-list .item .right .desc { font-size: 14px; line-height: 24px; margin-top: 14px; } #news .pages { margin: 50px auto; } #news .news-detail { margin-top: 50px; } #news .news-detail .tops { padding: 20px 20px 20px; } #news .news-detail .tops h1 { font-size: 20px; } #news .news-detail .tops .date { font-size: 14px; line-height: 14px; margin-top: 14px; } #news .news-detail .news-content { padding: 30px 30px; font-size: 14px; line-height: 30px; } #news .news-detail .prev-next { padding: 20px 0; } #news .news-detail .prev-next a { width: 40%; } #news .news-detail .back { width: 120px; height: 40px; border-radius: 20px; font-size: 14px; line-height: 40px; margin: 50px auto 50px; } #app .app-list .top-title { font-size: 26px; line-height: 26px; margin-top: 50px; } #app .app-list .pages { margin: 30px auto 50px; } #product .sub-cate { display: block; } #product .product-list .top-title { font-size: 26px; line-height: 26px; margin-top: 50px; } #product .product-list .bots { margin-top: 40px; } #product .product-list .bots .subs { display: none; } #product .product-list .bots .right-list { width: 100%; } #product .product-list .bots .right-list .list .item { width: 30.6%; margin-left: 2.8%; margin-bottom: 20px; } #product .product-list .bots .right-list .list .item .text { height: 24px; margin-top: 20px; line-height: 24px; } #product .product-list .bots .right-list .list .item .text i { width: 32px; height: 9px; margin-top: 7px; background-position: -48px 0; } #product .product-list .bots .right-list .pages { margin: 30px auto 50px; } #product .prod-detail { margin-top: 50px; } #product .prod-detail .pd-top { display: block; } #product .prod-detail .pd-top .gallery { width: 100%; height: auto; } #product .prod-detail .pd-top .right { width: 100%; padding-left: 0; } #product .prod-detail .pd-top .right .text1 { font-size: 26px; margin-top: 20px; } #product .prod-detail .pd-top .right .text2 { font-size: 20px; } #product .prod-detail .pd-top .right .text3 { padding-top: 10px; margin-top: 10px; line-height: 24px; } #product .prod-detail .pd-top .right .thumb { margin-top: 20px; } #product .prod-detail .pd-top .right .thumb .item { width: 120px; height: 85px; margin-right: 10px; } #product .prod-detail .pd-top .right .thumb.thumb1 { width: 100%; display: flex; justify-content: space-between; margin-top: 20px; } #product .prod-detail .pd-top .right .thumb.thumb1 .item { width: 32%; height: auto; margin-left: 0; margin-right: 0; } #product .prod-detail .pd-top .right .thumb.thumb1 .item img { width: 100%; height: auto; } #product .prod-detail .pd-top .right .thumb.thumb2 { display: none; } #product .prod-detail .pd-bot { margin-top: 50px; } #product .prod-detail .pd-bot .tab .item { min-width: 136px; height: 40px; padding: 0 15px; line-height: 40px; font-size: 16px; margin-right: 10px; } #product .prod-detail .pd-bot .details { padding: 30px; font-size: 14px; line-height: 28px; } #product .prod-detail .back { width: 120px; height: 40px; border-radius: 20px; font-size: 14px; line-height: 40px; margin: 50px auto 50px; } #product .prod-detail .recom { margin-top: 50px; margin-bottom: 60px; } #product .prod-detail .recom .tops { height: 64px; line-height: 64px; font-size: 18px; } #product .prod-detail .recom .swiper { margin-top: 30px; } #product .prod-detail .recom .swiper .swiper-slide { width: 32%; } #product .prod-detail .recom .swiper .swiper-slide .text { height: 24px; margin-top: 20px; line-height: 24px; } #product .prod-detail .recom .swiper .swiper-slide .text i { width: 32px; height: 9px; margin-top: 7px; background-image: url(../images/65.png); background-position: -48px 0; } #about .section1 .main .numbers .item .num { font-size: 64px; line-height: 50px; } #about .section1 .main .numbers .item .text { font-size: 14px; } .app-list .list { margin-top: 50px; } .app-list .item { width: 48%; margin-bottom: 40px; margin-left: 4%; } .app-list .item .tops .masklayer .texts { padding: 30px; } .app-list .item .tops .masklayer .texts .name { font-size: 20px; } .app-list .item .tops .masklayer .texts .desc { font-size: 16px; margin-top: 10px; } .app-list .item .tops .masklayer .texts .text { font-size: 14px; line-height: 26px; margin: 20px auto 0; } .app-list .item .tops .masklayer .texts .icon { width: 32px; height: 9px; left: 30px; bottom: 30px; } .app-list .item .tops .masklayer i { width: 200%; height: 100%; top: 0; left: -250%; } .app-list .item .bots { padding: 20px 0 0; } .app-list .item .bots .name { font-size: 18px; line-height: 18px; } .app-list .item .bots .desc { font-size: 14px; line-height: 14px; margin: 10px 0 0; } .app-list .item:nth-child(3n+1) { margin-left: 4%; } .app-list .item:nth-child(2n+1) { margin-left: 0; } } @media screen and (max-width: 768px) { #index .banner .swiper-slide .main { left: 18%; } #index .banner .swiper-slide .texts .text1 { font-size: 24px; line-height: 24px; margin-top: 10px; } #index .banner .swiper-slide .texts .text1 i { height: 24px; } #index .banner .swiper-slide .texts .text2 { font-size: 14px; line-height: 14px; margin-top: 10px; } #index .banner .swiper-slide .texts .text2 i { height: 14px; } #index .banner .swiper-pagination-bullet { border-radius: 4px; } #index .banner .swiper-pagination-bullet.swiper-pagination-bullet-active { width: 30px; } #index .banner .banner-btn { top: 50%; } #index .banner .banner-btn i { width: 16px; height: 14px; background-size: 16px 4px; } #index .banner .banner-btn span { font-size: 14px; line-height: 14px; } #index .banner .banner-prev { left: 2%; } #index .banner .banner-prev i { background-position: left center; } #index .banner .banner-prev span { margin-left: 10px; } #index .banner .banner-next { right: 2%; } #index .banner .banner-next i { background-position: right center; } #index .banner .banner-next span { margin-right: 10px; } #index .about { padding: 40px 0 40px; } #index .about .about-main { display: block; margin-top: 40px; } #index .about .about-main .left { width: 94%; height: 260px; margin: 0 auto; } #index .about .about-main .right { width: 100%; max-width: none; padding: 30px 2.6% 0; } #index .about .about-main .right .name { font-size: 18px; } #index .about .about-main .right .desc { font-size: 14px; line-height: 28px; margin-top: 10px; } #index .about .about-main .right .numbers .item { width: 48%; margin-top: 15px; } #index .about .about-main .right .numbers .item .num { font-size: 50px; line-height: 40px; } #index .about .about-main .right .numbers .item .text { font-size: 14px; color: #999; margin-top: 10px; } #index .about .about-main .right .readmore { margin-top: 30px; } #index .product { padding: 40px 0 40px; } #index .product .swiper { width: 94%; margin: 40px auto 0; } #index .product .swiper .swiper-slide { width: 49.6%; } #index .product .swiper .swiper-slide .bot-text { padding: 20px 10px 20px; } #index .product .swiper .swiper-slide .bot-text .name { font-size: 20px; line-height: 20px; } #index .product .swiper .swiper-slide .bot-text .desc { font-size: 14px; line-height: 14px; margin: 12px auto 0; } #index .product .swiper .swiper-slide .masklayer .texts { top: 50%; left: 0; } #index .product .swiper .swiper-slide .masklayer .texts .name { width: 75%; font-size: 20px; } #index .product .swiper .swiper-slide .masklayer .texts .desc { width: 75%; font-size: 14px; line-height: 24px; margin: 20px auto 0; } #index .product .swiper .swiper-slide .masklayer .texts .icon { width: 30px; height: 30px; margin: 30px auto 0; } #index .product .swiper .swiper-slide .masklayer i { position: absolute; width: 200%; height: 100%; top: 0; left: -250%; } #index .product .swiper .swiper-slide:hover .masklayer i { left: -50%; } #index .product .swiper .prod-btn { top: 50%; width: 18px; height: 32px; background-size: 18px 32px; } #index .product .swiper .prod-prev { left: -9px; } #index .product .swiper .prod-next { right: -9px; } #index .product .readmore { margin: 30px auto 0; } #index .service .bg { height: 300px; } #index .service .texts { width: 94%; padding-top: 60px; } #index .service .texts .cn { font-size: 18px; line-height: 18px; } #index .service .texts .en { font-size: 12px; line-height: 20px; margin-top: 15px; } #index .service .texts img { margin-top: 20px; width: 18px; } #index .service .swiper { width: 94%; max-width: 1400px; margin: 45px auto 0; padding: 30px 0 30px; } #index .service .swiper .swiper-slide { width: 50%; } #index .service .swiper .swiper-slide .icon { width: 60px; height: 60px; } #index .service .swiper .swiper-slide .big { width: 80%; margin: 20px auto 0; font-size: 16px; line-height: 16px; } #index .service .swiper .swiper-slide .line { width: 10px; height: 1px; margin: 10px auto 0; } #index .service .swiper .swiper-slide .small { width: 80%; margin: 10px auto 0; font-size: 14px; line-height: 20px; } #index .service .swiper .swiper-slide .border { width: 1px; height: 40px; top: 50%; right: 0; margin-top: -25px; } #index .service .swiper .service-btn { top: 50%; width: 16px; height: 28px; background-size: 16px 28px; } #index .service .swiper .service-prev { left: 10px; } #index .service .swiper .service-next { right: 10px; } #index .app { padding: 40px 0 40px; } #index .app .sub-cate { margin-top: 20px; } #index .app .list { margin-top: 40px; } #index .app .item { width: 48%; margin-bottom: 40px; margin-left: 4%; } #index .app .item .tops .masklayer .texts { padding: 20px; } #index .app .item .tops .masklayer .texts .name { font-size: 18px; } #index .app .item .tops .masklayer .texts .desc { font-size: 14px; margin-top: 10px; } #index .app .item .tops .masklayer .texts .text { font-size: 14px; line-height: 24px; margin: 16px auto 0; } #index .app .item .tops .masklayer .texts .icon { width: 32px; height: 9px; left: 20px; bottom: 20px; } #index .app .item .tops .masklayer i { width: 200%; height: 100%; top: 0; left: -250%; } #index .app .item .bots { padding: 20px 0 0; } #index .app .item .bots .name { font-size: 18px; line-height: 18px; } #index .app .item .bots .desc { font-size: 14px; line-height: 14px; margin: 10px 0 0; } #index .app .item:nth-child(3n+1) { margin-left: 4%; } #index .app .item:nth-child(2n+1) { margin-left: 0; } #index .app .readmore { margin: 30px auto 0; } #news .big-title { margin-top: 40px; } #news .big-title .big { font-size: 22px; line-height: 22px; } #news .big-title .small { font-size: 14px; line-height: 14px; margin-top: 10px; } #news .news-list { margin-top: 40px; } #news .news-list .item { padding: 20px 0; } #news .news-list .item .img { width: 200px; height: 141px; } #news .news-list .item .right { width: calc(100% - 220px); margin-left: 20px; } #news .news-list .item .right .title { font-size: 16px; line-height: 16px; margin-top: 0px; } #news .news-list .item .right .date { font-size: 14px; line-height: 14px; margin-top: 8px; } #news .news-list .item .right .desc { font-size: 14px; line-height: 24px; margin-top: 8px; } #news .pages { margin: 40px auto; } #app .app-list .top-title { font-size: 20px; line-height: 20px; margin-top: 40px; } #app .app-list .pages { margin: 20px auto 40px; } #product .sub-cate { margin-top: 40px; } #product .product-list .top-title { font-size: 20px; line-height: 20px; margin-top: 40px; } #product .product-list .bots .right-list .pages { margin: 20px auto 40px; } #product .prod-detail { margin-top: 40px; } #product .prod-detail .pd-bot { margin-top: 40px; } #product .prod-detail .pd-bot .tab .item { min-width: 136px; height: 40px; padding: 0 15px; line-height: 40px; font-size: 16px; margin-right: 10px; } #product .prod-detail .pd-bot .details { padding: 20px; font-size: 14px; line-height: 24px; } #product .prod-detail .back { width: 120px; height: 40px; border-radius: 20px; font-size: 14px; line-height: 40px; margin: 30px auto 30px; } #product .prod-detail .recom { margin-top: 40px; margin-bottom: 40px; } #product .prod-detail .recom .tops { height: 50px; line-height: 50px; font-size: 18px; } #product .prod-detail .recom .swiper { margin-top: 30px; } #product .prod-detail .recom .swiper .swiper-slide { width: 48%; } #product .prod-detail .recom .swiper .swiper-slide .text { height: 24px; margin-top: 20px; line-height: 24px; } #product .prod-detail .recom .swiper .swiper-slide .text i { width: 16px; height: 5px; margin-top: 9px; background-position: -24px 0; background-size: 40px 5px; } #contact .main-tops { margin-top: 40px; margin-bottom: 40px; display: block; } #contact .main-tops .item { width: 100%; margin-top: 50px; } #contact .main-tops .item .b-title { height: 32px; line-height: 32px; padding: 0 16px; font-size: 18px; } #contact .main-tops .texts .cn { font-size: 18px; margin-top: 20px; } #contact .main-tops .texts .en { font-size: 14px; } #contact .main-tops .texts .line { margin-top: 14px; line-height: 21px; font-size: 14px; } #contact .main-tops .texts .line .label { padding-left: 30px; } #contact .main-tops .form form { margin-top: 20px; } #contact .main-tops .form .line { margin-top: 14px; } #contact .main-tops .form .line .input input { height: 50px; padding: 0 14px; } #contact .main-tops .form .line .textarea { height: 150px; } #contact .main-tops .form .line .textarea textarea { height: 150px; padding: 10px 14px; } #contact .main-tops .form .line.hasyzm { height: 50px; } #contact .main-tops .form .line.hasyzm .input { width: 36.36%; } #contact .main-tops .form .line.hasyzm .img { width: 22.72%; } #contact .main-tops .form .line.hasyzm .img img { height: 50px; } #contact .main-tops .form .line.hasyzm .button { width: 34.84%; height: 50px; font-size: 16px; } #contact .main-tops .form .line.hasyzm .button i { width: 16px; height: 16px; margin-left: 10px; } #service .section1 { padding: 40px 0; } #service .section1 .main .right { margin-top: 30px; } #service .section1 .main .right .big { font-size: 24px; } #service .section1 .main .right .small { font-size: 14px; } #service .section1 .main .right .desc { font-size: 14px; line-height: 24px; margin-top: 20px; margin-bottom: 20px; } #service .section1 .main .right .line { margin-top: 10px; } #service .section1 .main .right .line i { width: 26px; height: 26px; margin-right: 10px; } #service .section1 .main .right .line .text { font-size: 16px; } #service .section1 .main .right .line .text.spac { letter-spacing: 8px; } #service .section1 .main .right .line .big { font-size: 20px; } #service .section2 { padding: 40px 0 40px; } #service .section2 .serv-tops .right { height: 40px; } #service .section2 .serv-tops .right .btn { width: 40px; height: 40px; } #service .section2 .serv-tops .right .prev { margin-right: 10px; } #service .section2 .swiper { margin-top: 30px; } #service .section2 .swiper .swiper-slide { width: 49.23%; } #service .section2 .swiper .swiper-slide .bots { padding: 10px; } #service .section2 .swiper .swiper-slide .bots img { width: 40px; height: 40px; } #service .section2 .swiper .swiper-slide .bots p { font-size: 14px; } #service .section2 .swiper .swiper-slide .bots i { height: 20px; right: -5px; } #service .section3 { padding: 40px 0 40px; } #service .section3 .serv-tops .right { height: 40px; } #service .section3 .serv-tops .right .btn { width: 40px; height: 40px; } #service .section3 .serv-tops .right .prev { margin-right: 10px; } #service .section3 .down-list { margin-top: 15px; } #service .section3 .pages { margin: 40px auto 0; } #service .section3 .swiper { margin-top: 30px; } #service .section3 .swiper .swiper-slide { width: 49.23%; } #service .section3 .swiper .swiper-slide .bots { height: 40px; margin-top: 10px; padding: 0 10px; } #service .section3 .swiper .swiper-slide .bots p { width: 80%; font-size: 14px; } #service .section3 .swiper .swiper-slide .bots i { width: 18px; height: 18px; } #about .section1 { padding: 40px 0 40px; } #about .section1 .main .name { font-size: 22px; } #about .section1 .main .desc { margin-top: 14px; line-height: 30px; } #about .section1 .main .slogan-cn { font-size: 18px; margin-top: 14px; } #about .section1 .main .slogan-en { font-size: 14px; line-height: 24px; } #about .section1 .main .numbers .item { width: 40%; margin-top: 35px; } #about .section1 .main .numbers .item .num { font-size: 50px; line-height: 40px; } #about .section1 .main .numbers .item .text { font-size: 14px; margin-top: 10px; } #about .section1 .main .numbers i { height: 34px; margin: 50px 30px 0; } #about .section1 .main .numbers i:nth-of-type(2) { display: none; } #about .section1 .main .swiper { margin-top: 50px; } #about .section1 .main .swiper .swiper-slide { width: 49.23%; } #about .section1 .main .swiper .btn { width: 30px; height: 30px; top: 50%; margin-top: -15px; } #about .section1 .main .swiper .prev { left: -10px; } #about .section1 .main .swiper .next { right: -10px; } #about .section2 { padding: 40px 0 40px; } #about .section2 .swiper { margin-top: 30px; } #about .section2 .swiper .swiper-slide { width: 49.23%; } #about .section2 .swiper .swiper-slide .bots { height: 106px; padding: 10px 10px; margin-top: 10px; } #about .section2 .swiper .swiper-slide .bots .left { padding-right: 10px; } #about .section2 .swiper .swiper-slide .bots .left .big { font-size: 18px; line-height: 22px; } #about .section2 .swiper .swiper-slide .bots .left .small { font-size: 14px; margin-top: 10px; } #about .section2 .swiper .swiper-slide .bots i { width: 36px; height: 36px; } #about .section2 .swiper .btn { width: 30px; height: 30px; top: 50%; margin-top: -15px; } #about .section2 .swiper .prev { left: -10px; } #about .section2 .swiper .next { right: -10px; } #about .section3 { padding: 40px 0 40px; } #about .section3 .hr { top: 95px; } #about .section3 .swiper { margin-top: 30px; } #about .section3 .swiper .swiper-slide { width: 220px; height: 220px; padding-top: 50px; } #about .section3 .swiper .swiper-slide .year { height: 30px; line-height: 30px; font-size: 22px; } #about .section3 .swiper .swiper-slide .dot { width: 10px; height: 10px; margin: 10px auto; } #about .section3 .swiper .swiper-slide .col { top: 95px; } #about .section3 .swiper .swiper-slide .line { height: 38px; margin: 10px auto; } #about .section3 .swiper .swiper-slide .desc { padding: 0 40px; font-size: 14px; line-height: 30px; height: 60px; } #about .section3 .swiper .swiper-slide:hover .year, #about .section3 .swiper .swiper-slide.active .year { font-size: 30px; } #about .section3 .swiper .btn { width: 30px; height: 30px; margin-top: -15px; top: 95px; } #about .section3 .swiper .prev { left: -10px; } #about .section3 .swiper .next { right: -10px; } #about .section4 { padding: 40px 0 40px; } #about .section4 .honor-list { margin-top: 30px; } #about .section4 .honor-list .item { width: 49%; margin-left: 2%; margin-bottom: 30px; } #about .section4 .honor-list .item .img { border: 1px solid #E6E6E6; padding: 10px; } #about .section4 .honor-list .item .img img { width: 100%; } #about .section4 .honor-list .item .label { height: 40px; font-size: 14px; margin-top: 10px; line-height: 40px; } #about .section4 .honor-list .item:nth-child(2n+1) { margin-left: 0; } #about .section4 .pages { margin: 20px auto 0; } .app-list .list { margin-top: 40px; } .app-list .item { width: 48%; margin-bottom: 40px; margin-left: 4%; } .app-list .item .tops .masklayer .texts { padding: 20px; } .app-list .item .tops .masklayer .texts .name { font-size: 18px; } .app-list .item .tops .masklayer .texts .desc { font-size: 14px; margin-top: 10px; } .app-list .item .tops .masklayer .texts .text { font-size: 14px; line-height: 24px; margin: 16px auto 0; } .app-list .item .tops .masklayer .texts .icon { width: 32px; height: 9px; left: 20px; bottom: 20px; } .app-list .item .tops .masklayer i { width: 200%; height: 100%; top: 0; left: -250%; } .app-list .item .bots { padding: 20px 0 0; } .app-list .item .bots .name { font-size: 18px; line-height: 18px; } .app-list .item .bots .desc { font-size: 14px; line-height: 14px; margin: 10px 0 0; } .app-list .item:nth-child(3n+1) { margin-left: 4%; } .app-list .item:nth-child(2n+1) { margin-left: 0; } #search .search-box { margin: 40px 0 30px; height: 40px; } #search .search-box .left { width: calc(100% - 80px); max-width: unset; height: 100%; display: inline-block; float: left; border: 1px solid #e6e6e6; border-radius: 0; } #search .search-box .left .select { display: inline-block; float: left; width: 70px; height: 100%; padding: 0 10px 0 0; position: relative; } #search .search-box .left .select > span { display: block; width: 100%; height: 100%; line-height: 40px; font-size: 14px; padding: 0 14px 0 14px; background-image: url("../images/67.png"); background-position: right center; background-repeat: no-repeat; background-size: 6px 4px; cursor: pointer; } #search .search-box .left .select .sub { width: 100%; position: absolute; top: 41px; left: 0; border: 1px solid #e6e6e6; background-color: #fff; z-index: 99; display: none; } #search .search-box .left .select .sub span { display: block; width: 100%; text-align: center; height: 30px; line-height: 30px; transition: all 0.3s; cursor: pointer; } #search .search-box .left .select .sub span:hover, #search .search-box .left .select .sub span.active { background-color: #0068b7; color: #fff; } #search .search-box .left .input { display: inline-block; float: left; width: calc(100% - 70px); height: 100%; border-left: 1px solid #e6e6e6; } #search .search-box .left .input input { width: 100%; height: 100%; padding: 0 10px; border: none; background-color: #fff; border-radius: 0; font-size: 14px; } #search .search-box .btn { display: inline-block; float: left; } #search .search-box .btn button { width: 80px; height: 40px; background-color: #0068b7; border: none; color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; } #search .search-box .btn button span { display: inline-block; line-height: 14px; } #search .search-box .btn button i { display: inline-block; width: 16px; height: 16px; background-image: url("../images/68.png"); background-size: 100% 100%; margin-left: 5px; } #search .search-result .item { padding: 14px 0; } #search .search-result .item .title { width: 100%; line-height: 14px; font-size: 14px; } #search .search-result .item .title i { width: 4px; height: 4px; margin-right: 10px; } #search .search-result .item .title p { width: calc(100% - 14px); } #search .search-result .item .date { font-size: 12px; line-height: 12px; margin-top: 10px; padding-left: 14px; } #search .search-result .pages { margin-top: 30px; } } @media screen and (max-width: 480px) { #index .banner .swiper-slide .main { left: 14%; } #index .banner .swiper-slide .texts .text1 { font-size: 18px; line-height: 18px; margin-top: 10px; } #index .banner .swiper-slide .texts .text1 i { height: 18px; } #index .banner .swiper-slide .texts .text2 { font-size: 10px; line-height: 10px; margin-top: 10px; } #index .banner .swiper-slide .texts .text2 i { height: 10px; } #index .banner .swiper-pagination-bullet { width: 6px; height: 6px; border-radius: 3px; } #index .banner .swiper-pagination-bullet.swiper-pagination-bullet-active { width: 20px; } #index .banner .banner-btn { top: 50%; } #index .banner .banner-btn i { width: 16px; height: 14px; background-size: 16px 4px; } #index .banner .banner-btn span { font-size: 14px; line-height: 14px; display: none; } #index .banner .banner-prev { left: 2%; } #index .banner .banner-prev i { background-position: left center; } #index .banner .banner-prev span { margin-left: 10px; } #index .banner .banner-next { right: 2%; } #index .banner .banner-next i { background-position: right center; } #index .banner .banner-next span { margin-right: 10px; } #index .about { padding: 30px 0 30px; } #index .about .about-main { display: block; margin-top: 20px; } #index .about .about-main .left { width: 94%; height: 170px; margin: 0 auto; } #index .about .about-main .right { width: 100%; max-width: none; padding: 20px 2.6% 0; } #index .about .about-main .right .name { font-size: 16px; } #index .about .about-main .right .desc { font-size: 14px; line-height: 24px; height: 2.9rem; margin-top: 10px; } #index .about .about-main .right .numbers .item { width: 48%; margin-top: 20px; } #index .about .about-main .right .numbers .item .num { font-size: 50px; line-height: 40px; } #index .about .about-main .right .numbers .item .text { font-size: 14px; color: #999; margin-top: 10px; } #index .about .about-main .right .readmore { margin-top: 20px; } #index .product { padding: 30px 0 30px; } #index .product .swiper { margin: 20px auto 0; } #index .product .swiper .swiper-slide { width: 49.6%; } #index .product .swiper .swiper-slide .bot-text { padding: 16px 10px 16px; } #index .product .swiper .swiper-slide .bot-text .name { font-size: 16px; line-height: 16px; } #index .product .swiper .swiper-slide .bot-text .desc { margin: 6px auto 0; } #index .product .swiper .swiper-slide .masklayer .texts { top: 50%; left: 0; } #index .product .swiper .swiper-slide .masklayer .texts .name { width: 75%; font-size: 16px; } #index .product .swiper .swiper-slide .masklayer .texts .desc { width: 75%; font-size: 14px; line-height: 20px; margin: 15px auto 0; } #index .product .swiper .swiper-slide .masklayer .texts .icon { width: 20px; height: 20px; margin: 15px auto 0; } #index .product .swiper .swiper-slide .masklayer i { position: absolute; width: 200%; height: 100%; top: 0; left: -250%; } #index .service .bg { height: 300px; } #index .service .texts { width: 94%; padding-top: 50px; } #index .service .texts .cn { font-size: 18px; line-height: 18px; } #index .service .texts .en { font-size: 12px; line-height: 20px; margin-top: 15px; } #index .service .texts img { margin-top: 20px; width: 18px; } #index .service .swiper { width: 94%; max-width: 1400px; margin: 27px auto 0; padding: 20px 0 20px; } #index .service .swiper .swiper-slide { width: 50%; } #index .service .swiper .swiper-slide .icon { width: 60px; height: 60px; } #index .service .swiper .swiper-slide .big { width: 80%; margin: 20px auto 0; font-size: 14px; line-height: 14px; } #index .service .swiper .swiper-slide .line { width: 10px; height: 1px; margin: 10px auto 0; } #index .service .swiper .swiper-slide .small { width: 80%; margin: 10px auto 0; font-size: 12px; line-height: 20px; overflow-y: auto; text-overflow: unset; -webkit-line-clamp: 999; height: 50px; } #index .service .swiper .swiper-slide .border { width: 1px; height: 40px; top: 50%; right: 0; margin-top: -25px; } #index .service .swiper .service-btn { top: 50%; width: 12px; height: 21px; background-size: 12px 21px; } #index .service .swiper .service-prev { left: 4px; } #index .service .swiper .service-next { right: 4px; } #index .app { padding: 30px 0 30px; } #index .app .sub-cate { margin-top: 20px; } #index .app .list { margin-top: 30px; } #index .app .item { width: 100%; margin-bottom: 30px; margin-left: 0; } #index .app .item .tops .masklayer .texts { padding: 20px; } #index .app .item .tops .masklayer .texts .name { font-size: 18px; } #index .app .item .tops .masklayer .texts .desc { font-size: 14px; margin-top: 10px; } #index .app .item .tops .masklayer .texts .text { font-size: 14px; line-height: 24px; margin: 30px auto 0; } #index .app .item .tops .masklayer .texts .icon { width: 32px; height: 9px; left: 20px; bottom: 20px; } #index .app .item .tops .masklayer i { width: 200%; height: 100%; top: 0; left: -250%; } #index .app .item .bots { padding: 20px 0 0; } #index .app .item .bots .name { font-size: 18px; line-height: 18px; } #index .app .item .bots .desc { font-size: 14px; line-height: 14px; margin: 10px 0 0; } #index .app .item:nth-child(3n+1) { margin-left: 0; } #index .app .item:nth-child(2n+1) { margin-left: 0; } #index .app .readmore { margin: 10px auto 0; } #news .big-title { margin-top: 30px; } #news .big-title .big { font-size: 20px; line-height: 20px; } #news .big-title .small { font-size: 14px; line-height: 14px; margin-top: 10px; } #news .news-list { margin-top: 0; } #news .news-list .item { padding: 20px 0; } #news .news-list .item a { display: block; } #news .news-list .item .img { width: 100%; height: auto; } #news .news-list .item .img img { height: auto; } #news .news-list .item .right { width: 100%; margin-left: 0; margin-top: 20px; } #news .news-list .item .right .title { font-size: 16px; line-height: 16px; margin-top: 0px; } #news .news-list .item .right .date { font-size: 14px; line-height: 14px; margin-top: 12px; } #news .news-list .item .right .desc { font-size: 14px; line-height: 24px; margin-top: 12px; } #news .news-list .item .right .readmore { position: static; margin-top: 12px; } #news .pages { margin: 30px auto; } #news .news-detail { margin-top: 30px; } #news .news-detail .tops { padding: 14px; } #news .news-detail .tops h1 { font-size: 16px; } #news .news-detail .tops .date { font-size: 12px; line-height: 12px; margin-top: 10px; } #news .news-detail .news-content { padding: 20px 0; font-size: 14px; line-height: 24px; } #news .news-detail .prev-next { padding: 15px 0; display: block; } #news .news-detail .prev-next a { width: 100%; } #news .news-detail .prev-next .next { text-align: left; margin-top: 10px; } #news .news-detail .back { width: 120px; height: 40px; border-radius: 20px; font-size: 14px; line-height: 40px; margin: 30px auto 30px; } #app .app-list .top-title { font-size: 18px; line-height: 18px; margin-top: 30px; } #app .app-list .pages { margin: 10px auto 30px; } #product .sub-cate { margin-top: 30px; } #product .product-list .top-title { font-size: 18px; line-height: 18px; margin-top: 30px; } #product .product-list .bots { margin-top: 30px; } #product .product-list .bots .right-list .list .item { width: 30.6%; margin-left: 2.8%; margin-bottom: 20px; } #product .product-list .bots .right-list .list .item .text { height: 24px; margin-top: 10px; line-height: 24px; } #product .product-list .bots .right-list .list .item .text span { font-size: 14px; } #product .product-list .bots .right-list .list .item .text i { width: 16px; height: 5px; margin-top: 9px; background-position: -24px 0; background-size: 40px 5px; } #product .product-list .bots .right-list .pages { margin: 10px auto 30px; } #product .prod-detail { margin-top: 30px; } #product .prod-detail .pd-top { display: block; } #product .prod-detail .pd-top .gallery { width: 100%; height: auto; } #product .prod-detail .pd-top .right { width: 100%; padding-left: 0; } #product .prod-detail .pd-top .right .text1 { font-size: 20px; margin-top: 20px; } #product .prod-detail .pd-top .right .text2 { font-size: 16px; } #product .prod-detail .pd-top .right .text3 { padding-top: 10px; margin-top: 10px; line-height: 24px; } #product .prod-detail .pd-top .right .thumb { margin-top: 20px; } #product .prod-detail .pd-top .right .thumb .item { width: 120px; height: 85px; margin-right: 10px; } #product .prod-detail .pd-top .right .thumb.thumb1 { width: 100%; display: flex; justify-content: space-between; margin-top: 20px; } #product .prod-detail .pd-top .right .thumb.thumb1 .item { width: 32%; height: auto; margin-left: 0; margin-right: 0; } #product .prod-detail .pd-top .right .thumb.thumb1 .item img { width: 100%; height: auto; } #product .prod-detail .pd-top .right .thumb.thumb2 { display: none; } #product .prod-detail .recom .swiper .swiper-slide .text { height: 24px; margin-top: 10px; line-height: 24px; } #product .prod-detail .recom .swiper .swiper-slide .text span { font-size: 14px; } #product .prod-detail .recom .swiper .swiper-slide .text i { width: 16px; height: 5px; margin-top: 9px; background-position: -24px 0; background-size: 40px 5px; } #service .section1 { padding: 30px 0; } #service .section1 .main .right { margin-top: 20px; } #service .section1 .main .right .big { font-size: 18px; } #service .section1 .main .right .small { font-size: 14px; } #service .section1 .main .right .desc { font-size: 14px; line-height: 24px; margin-top: 20px; margin-bottom: 20px; } #service .section1 .main .right .line { margin-top: 10px; } #service .section1 .main .right .line i { width: 20px; height: 20px; margin-right: 7px; } #service .section1 .main .right .line .text { font-size: 14px; } #service .section1 .main .right .line .text.spac { letter-spacing: 7px; } #service .section1 .main .right .line .big { font-size: 16px; } #service .section2 { padding: 30px 0 30px; } #service .section2 .serv-tops .right { height: 40px; } #service .section2 .serv-tops .right .btn { width: 40px; height: 40px; } #service .section2 .serv-tops .right .prev { margin-right: 10px; } #service .section2 .swiper { margin-top: 30px; } #service .section2 .swiper .swiper-slide { width: 49.23%; } #service .section2 .swiper .swiper-slide .bots { padding: 10px; } #service .section2 .swiper .swiper-slide .bots img { width: 40px; height: 40px; } #service .section2 .swiper .swiper-slide .bots p { font-size: 14px; } #service .section2 .swiper .swiper-slide .bots i { height: 20px; right: -5px; } #service .section3 { padding: 30px 0 30px; } #service .section3 .serv-tops .right { height: 40px; } #service .section3 .serv-tops .right .btn { width: 40px; height: 40px; } #service .section3 .serv-tops .right .prev { margin-right: 10px; } #service .section3 .down-list { width: 100%; margin-top: 15px; overflow: hidden; } #service .section3 .down-list .item { width: 100%; height: 40px; line-height: 40px; margin-top: 15px; margin-left: 0; } #service .section3 .down-list .item span { width: calc(100% - 60px); font-size: 14px; } #service .section3 .down-list .item i { width: 24px; height: 24px; margin: 13px 0; } #service .section3 .down-list .item:nth-child(2n+1) { margin-left: 0; } #service .section3 .pages { margin: 30px auto 0; } #service .section3 .swiper { margin-top: 30px; } #service .section3 .swiper .swiper-slide { width: 49.23%; } #about .section2 { padding: 30px 0 30px; } #about .section2 .swiper { margin-top: 20px; } #about .section2 .swiper .swiper-slide { width: 100%; } #about .section2 .swiper .swiper-slide .bots { height: 106px; padding: 10px 10px; margin-top: 10px; } #about .section2 .swiper .swiper-slide .bots .left { padding-right: 10px; } #about .section2 .swiper .swiper-slide .bots .left .big { font-size: 18px; line-height: 22px; } #about .section2 .swiper .swiper-slide .bots .left .small { font-size: 14px; margin-top: 10px; } #about .section2 .swiper .swiper-slide .bots i { width: 36px; height: 36px; } #about .section3 { padding: 30px 0 30px; } #about .section3 .hr { top: 95px; } #about .section3 .swiper { margin-top: 20px; } #about .section3 .swiper .swiper-slide { width: 220px; height: 220px; padding-top: 50px; } #about .section3 .swiper .swiper-slide .year { height: 30px; line-height: 30px; font-size: 22px; } #about .section3 .swiper .swiper-slide .dot { width: 10px; height: 10px; margin: 10px auto; } #about .section3 .swiper .swiper-slide .col { top: 95px; } #about .section3 .swiper .swiper-slide .line { height: 38px; margin: 10px auto; } #about .section3 .swiper .swiper-slide .desc { padding: 0 40px; font-size: 14px; line-height: 30px; height: 60px; } #about .section3 .swiper .swiper-slide:hover, #about .section3 .swiper .swiper-slide.active, #about .section3 .swiper .swiper-slide.swiper-slide-active { background-color: #0068b7; } #about .section3 .swiper .swiper-slide:hover .year, #about .section3 .swiper .swiper-slide.active .year, #about .section3 .swiper .swiper-slide.swiper-slide-active .year { color: #fff; font-size: 30px; } #about .section3 .swiper .swiper-slide:hover .dot, #about .section3 .swiper .swiper-slide.active .dot, #about .section3 .swiper .swiper-slide.swiper-slide-active .dot { background-color: #0068b7; border-color: #fff; } #about .section3 .swiper .swiper-slide:hover .col, #about .section3 .swiper .swiper-slide.active .col, #about .section3 .swiper .swiper-slide.swiper-slide-active .col { background-color: #fff; } #about .section3 .swiper .swiper-slide:hover .line, #about .section3 .swiper .swiper-slide.active .line, #about .section3 .swiper .swiper-slide.swiper-slide-active .line { height: 38px; } #about .section3 .swiper .swiper-slide:hover .desc, #about .section3 .swiper .swiper-slide.active .desc, #about .section3 .swiper .swiper-slide.swiper-slide-active .desc { color: #fff; } #about .section3 .swiper .btn { width: 30px; height: 30px; margin-top: -15px; top: 95px; } #about .section3 .swiper .prev { left: -10px; } #about .section3 .swiper .next { right: -10px; } .app-list .list { margin-top: 30px; } .app-list .item { width: 100%; margin-bottom: 30px; margin-left: 0; } .app-list .item .tops .masklayer .texts { padding: 20px; } .app-list .item .tops .masklayer .texts .name { font-size: 18px; } .app-list .item .tops .masklayer .texts .desc { font-size: 14px; margin-top: 10px; } .app-list .item .tops .masklayer .texts .text { font-size: 14px; line-height: 24px; margin: 30px auto 0; } .app-list .item .tops .masklayer .texts .icon { width: 32px; height: 9px; left: 20px; bottom: 20px; } .app-list .item .tops .masklayer i { width: 200%; height: 100%; top: 0; left: -250%; } .app-list .item .bots { padding: 20px 0 0; } .app-list .item .bots .name { font-size: 18px; line-height: 18px; } .app-list .item .bots .desc { font-size: 14px; line-height: 14px; margin: 10px 0 0; } .app-list .item:nth-child(3n+1) { margin-left: 0; } .app-list .item:nth-child(2n+1) { margin-left: 0; } }