article,aside,dialog,footer,header,section,footer,nav,figure,menu,main{display:block} *,:before,:after{box-sizing:border-box;} blockquote,body,button,dd,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,hr,input,legend,li,ol,p,pre,td,textarea,th,ul{margin:0;padding:0} img{border:0; width:auto; max-width:100%;} ul,dl,li,dt,dd{list-style:none;} body,html{min-height:100%;} body{ font-size:14px; color:#333333;-webkit-tap-highlight-color:rgba(255,255,255,0); width: 100%; overflow-x:hidden; background:#ffffff;} pre{ white-space:pre-wrap;word-wrap: break-word;font-family: inherit;} a{font-size:16px;text-decoration:none;transition:ease .65s; color:#333333; outline:none;} .clearfix:after{content:""; display:block; clear:both;} h1,h2,h3,h4,h5,h6{font-size:100%; font-weight:normal;} input[type="text"],input[type="password"],input[type="search"],textarea,select{outline: none;-webkit-appearance: none;border-radius: 0; font-size:14px; display:block; width:100%; border:none; background:none; transition:ease .45s;} input[type="radio"]{display:inline-block; width:20px; height:20px; position:relative; top:0px; margin-right:5px; cursor:pointer;} input[type="checkbox"]{display:inline-block; width:20px; height:20px; position:relative; top:0px; margin-right:5px; cursor:pointer;} input::-webkit-input-placeholder {color: #888888;} input:-moz-placeholder {銆€color: #888888;} input::-moz-placeholder {color: #888888;} input:-ms-input-placeholder {color: #888888;} textarea{resize:none; overflow:hidden;} textarea::-webkit-input-placeholder {color: #888888;} textarea:-moz-placeholder {銆€color: #888888;} textarea::-moz-placeholder {color: #888888;} textarea:-ms-input-placeholder {color: #888888;} select::-ms-expand { display: none; } i,em{font-style:normal;} .fl,.fl_warp{float:left;} .fr,.fr_warp{float:right;} .z-container {width:1440px;height:auto;clear: both;margin: 0 auto;} .z-container2 {width: 1200px;height:auto;clear: both;margin: 0 auto;} .z-container3 {width:87.5%;height:auto;clear: both;margin: 0 auto;} .z-row {width: 100%;height: auto;clear: both;margin: 0 auto;} .ellipsis{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;} .ellipsis2{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;text-overflow:ellipsis;} .ellipsis3{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;text-overflow:ellipsis;} .ellipsis4{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 4;overflow: hidden;text-overflow:ellipsis;} .ellipsis5{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 5;overflow: hidden;text-overflow:ellipsis;} .ellipsis6{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 6;overflow: hidden;text-overflow:ellipsis;} .imgbg{ width: 100%; height: 100%; transition: ease 1s; background-position: center; background-repeat: no-repeat; background-size: cover;} .z_flex{ display: flex; align-items: center;} .z_flex_ul{display:flex;display:-webkit-flex;flex-direction:row; -webkit-flex-direction:row;flex-wrap:wrap; -webkit-flex-wrap:wrap;} .clear{ clear: both;} *:before, *:after { z-index: -1; } .z_public_bg{ width: 100%; height: 100%; position: fixed; left: 0; top: 0; background: url(../images/bgs.png) no-repeat center; background-size: cover; background-attachment: fixed; pointer-events: none;} .flwarp{ float: left;} .frwarp{ float: right;} .imgbg{ width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; transition: ease 1s;} /*鍒嗕韩*/ #bsWXBox{box-sizing:initial;} #bsBox{box-sizing:initial;} /*娴忚鍣ㄦ粴鍔ㄦ潯*/ ::-webkit-scrollbar{width:5px;height:5px;} ::-webkit-scrollbar-button:vertical{display:none} ::-webkit-scrollbar-track:vertical{background-color:black} ::-webkit-scrollbar-track-piece{background:#E3E3E3} ::-webkit-scrollbar-thumb:vertical{background-color:#555;border-radius:30px} ::-webkit-scrollbar-thumb:vertical:hover{background-color:#3B3B3B} ::-webkit-scrollbar-corner:vertical{background-color:#535353} ::-webkit-scrollbar-resizer:vertical{background-color:#FF6E00} .swiper-slide { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 100%; height: 100%; position: relative; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; -o-transition-property: transform; transition-property: transform; transition-property: transform,-webkit-transform} .swiper-container-android .swiper-slide, .swiper-wrapper { -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; -o-transition-property: transform; transition-property: transform; transition-property: transform,-webkit-transform; -webkit-box-sizing: content-box; box-sizing: content-box; } .swiper-container { margin: 0 auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; } .swiper-container-fade .swiper-slide{ pointer-events: none; -webkit-transition-property: opacity; -o-transition-property: opacity; transition-property: opacity} .swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active{pointer-events:auto; z-index: 3;} .swiper-container-fade .swiper-slide{opacity:0!important;} .swiper-container-fade .swiper-slide-active{opacity:1!important;} .swiper-container-vertical>.swiper-wrapper { flex-direction: column; } .video_pop{display: block; width: 100%; height: 100%; background: #000; position: fixed; left: 0; top: 0; z-index: 999!important; display: flex; justify-content: center; align-items: center; display: none;} .close_btn{width: 40px; height: 40px; position: absolute; right: 0; top: 0; background: url(../images/close.png) no-repeat center; z-index: 100; cursor: pointer;} #video{width:100%; max-height: 100%;} .video_pop .warp{ display: flex; align-items: center; justify-content: center; width: 100%; height: 100vh;} .z_banner{ height: 100vh; position: relative; width: 100%; position: fixed; left: 0; top: 0; } .z_banner .bd,.z_banner .bd li,.z_banner .bd li .img,.z_banner .bd li .show{width:100%; overflow: hidden; height:100%; position:relative;} .z_banner .bd li .img{ background-position: bottom center; background-repeat:no-repeat; background-size:cover;} .z_banner .bd li .show{transform:scale(1.1); transition:ease 2s;} .z_banner .bd li.swiper-slide-active .show,.zs_banner .bd li.swiper-slide-duplicate-active .show{transform:scale(1); opacity:1;} .z_swiper_hd li{ display: inline-block;margin:0 5px; width: 10px; height: 10px; border-radius: 50%; background: #fff;} .z_banner_hd{ width: 100%; padding: 0 5%; box-sizing: border-box; position: absolute; left: 0; bottom: 50px; z-index: 2;} .z_banner_hd li{ margin-right: 10px;} .z_swiper_hd li.on{ background: #0072bc; } .z_banner_text{ position: absolute; left: 0; top:50%; padding: 0 7.55208vw; color: #fff; box-sizing: border-box; z-index: 2; width: 100%; transform: translateY(-50%); } .z_banner_text img{ display: block; margin: 0 auto;} .z_banner .bd li.swiper-slide-active .z_banner_text .h3,.z_banner .bd li.swiper-slide-duplicate-active .z_banner_text .h3{transform: translateX(0%); opacity:1; transition-delay:.5s;} .z_banner .bd li.swiper-slide-active .z_banner_text .h4,.z_banner .bd li.swiper-slide-duplicate-active .z_banner_text .h4{transform: translateX(0%); opacity:1; transition-delay:.8s;} .z_banner_text .h3{font-size: 2.86458vw;font-weight:bold;line-height: 3.43750vw;transition: ease 1s;transform: translateX(200px); opacity: 0;} .z_banner_text .h4{font-size: 2.29166vw;font-family: Raleway;font-weight: bold;line-height: 2.29166vw; margin: 20px 0; margin-bottom: 40px;transition: ease 1s;transform: translateX(400px); opacity: 0;} .z_more_btn{ display: inline-block;min-width: 144px; overflow: hidden; position: relative; padding: 0 20px; box-sizing: border-box; color: #fff;height: 44px; z-index: 1; line-height: 44px; background: #0079d5;} .z_more_btn .iconfont{ font-size: 12px; float: right} .z_more_btn::before{ content: ""; display: block; width: 100%; height: 100%; position: absolute; transform: translate(100%); transition: ease 1s; left: 0; top: 0;background: #b28850;} .z_more_btn:hover::before{ transform: translateX(-100%);} .z_header{ width: 100%; transition: ease 1s; transition: ease .6s; position: fixed; left: 0; top: 0; height: 85px; line-height: 85px; border-bottom: 1px solid rgba(255,255,255,.2); box-sizing: border-box; z-index: 10;} .z_header::before{ content:""; display: block; width: 100%; height: 0; position: absolute; left: 0; top: 0; transition: ease 1s; background: #fff;} .z_logo{ display: block; position: relative; height: 54px; float: left; margin-top: 15px; margin-left: 115px;} .z_logo img{ display: block;height: 100%; transition: ease 1s;} .z_logo .logo2{ position: absolute; left: 0; top: 0; opacity: 0; } .z_header_fr{ float: right;} .z_header_nav{ float: left;} .z_header_nav li{ display: inline-block; text-align:center; } .z_header_nav li a{ color: #fff; display: block; font-size: 18px;} .z_header_nav li:hover a{ font-weight: bold;} .z_header_sou{ float: left; display: flex; align-items: center; } .z_header_sou .sou{ display: block;flex-shrink: 0; cursor: pointer; font-size: 20px; font-weight: bold; width: 85px; height: 85px; border-left: 1px solid rgba(255,255,255,.2); text-align: center; line-height: 85px; color: #fff;} .z_header_sou .input_text{ color: #fff; height: 85px; width: 0; transition: ease .6s; } .z_header_sou .input_text::-webkit-input-placeholder {color: rgba(255,255,255,.5);} .z_header_sou .input_text::-moz-input-placeholder {color: rgba(255,255,255,.5);} .z_header_sou .input_text::-ms-input-placeholder {color: rgba(255,255,255,.5);} .z_header_sou:hover .input_text{ width: 0vw;} .z_header.on .logo2{ opacity: 1;} .z_header.on .logo1{ opacity: 0;} .z_header.on{ border-bottom-color: #e5e5e5; background: #fff;} /* .z_header.on::before{ height: 100%;} */ .z_header.on .z_header_nav a{ color: #1F1F1F;} .z_header.on .z_header_sou .iconfont{ color: #333; border-color: #e5e5e5;} .z_header.on .z_header_sou .input_text{ color: #333; } .z_header.on .z_header_sou .input_text::-webkit-input-placeholder {color: #999;} .z_header.on .z_header_sou .input_text::-moz-input-placeholder {color:#999;} .z_header.on .z_header_sou .input_text::-ms-input-placeholder {color:#999;} .z_header.on .z_menu_btn::before{width: 100%; height: 100%; left: 0; top: 0; border-radius: 0; } .z_menu_btn{ width: 85px; overflow: hidden; position: relative;z-index: 1; height: 85px;display: flex; align-items: center; justify-content: center; cursor: pointer; border-left: 1px solid rgba(255,255,255,.2); } .z_menu_btn::before{ content: ""; display: block; width: 0; height: 0; position: absolute; top: 50%; left: 50%; border-radius: 50%;background: #0079d5; transition: ease .4s;} .z_menu_btn span{ display: block; transition: ease .6s; width: 19px; height:2px; background: #fff;} .z_menu_btn .line2{ margin:3px 0;} .z_menu_btn.on .line1{ transform:translateY(5px) rotate(45deg);} .z_menu_btn.on .line3{ transform:translateY(-5px) rotate(-45deg);} .z_menu_btn.on .line2{ opacity: 0;} .z_menu_mask{ width: 100%; background: #fff;transition:ease 1s; transform:translateY(-500px); visibility: hidden; padding-top: 30px; padding-bottom: 30px; box-sizing: border-box; position:fixed; left: 0; top: 85px; z-index: 8; height: 300px;padding-right: 170px;} .z_menu_mask ul{ float: right;} .z_menu_mask ul li{display: inline-block; width: 140px; vertical-align: top;} .z_menu_mask li a{ display: block; line-height: 36px; color: #8D8D8D;overflow: hidden;text-overflow: ellipsis;white-space: nowrap; width: 90%;} .z_menu_mask li a:hover{ font-weight: bold;} .z_menu_mask ul li h3{ display: none} .Nav .z_menu_mask{transform:translateY(0); visibility:visible; opacity: 1;} .z_banner_bar{ width: 100%; position: absolute; left: 0; bottom: 50px; text-align: center; color: #fff; z-index: 2;} .z_banner_bar .sb{ display: inline-block;width: 18px;height: 31px; background: url(../images/sb.png) no-repeat center; margin: 0 20px; background-size: 100% 100%;} .z_banner_bar .bar{ display: flex; align-items: center; justify-content: center; margin-bottom: 10px;} .z_banner_bar .iconfont{ cursor: pointer;} .z_about_num{ width: 50%; float: left; height: 50vw; background: #0079d5;} .z_about_num li{ width: 50%; height: 25vw; float: left; display: flex; align-items: center; justify-content: center; color: #fff; text-align: center;} .z_about_num li h3{font-size: 4.16666vw; line-height: 4.16666vw; font-family: DBOzoneX;} .z_index_page{ margin-top: 100vh; position: relative; z-index: 2; background: #fff;} .z_about_num li:nth-child(2){ color: #252525;} .z_about_num li .h4{ margin: 1.5vw 0;} .z_about_num li em{ display: inline-block;width: 26px;height: 3px;background: #FFFFFF;} .z_about_num li:nth-child(2) em{ background: #252525;} .z_index_video{ width: 50%; height: 50vw; float: right; display: flex; align-items: center; justify-content: center; position: relative;} .z_index_video::before{ content: ""; display: block; z-index: 2; transition-delay: 1s; pointer-events: none; width: 100%; height: 100%; background: #4169E1; transition: ease 2s; position: absolute; left: 0; top: 0;} .z_index_video.animated::before{ opacity: 0;} .z_index_video .warp{ width: 67%; margin: 0 auto; text-align: center; color: #fff;} .z_index_video .tit{font-size: 2.5vw; line-height: 2.5vw; font-weight: bold;color: #FFFFFF;} .z_index_video .desc{font-size: 16px;font-weight: 400;line-height: 30px;} .z_index_video .line{ display: block; width: 26px;height: 3px;background: #FFFFFF; margin: 30px auto;} .z_index_video .icon{ display: inline-block; width: 14px; height: 14px; background: url(../images/play.png) no-repeat center; background-size: 100% 100%; vertical-align: middle; margin-right: 10px;} .z_index_product{ width: 100%; height: 59.11458vw; position: relative; z-index: 2; background-attachment: fixed; overflow: hidden;} .z_product_bg{ width:100%; height: 100%; overflow: hidden; position: absolute; left: 0; top: 0; z-index: -1; transform: scale(1.1,1.1); transition: ease 3s;} .z_index_product.animated .z_product_bg{ transform: scale(1,1);} .z_product_bg .imgbg{ width: 100%; height: 100%; opacity: 0; position: absolute; left: 0; top: 0; transform: scale(1.1,1.1); background-attachment: fixed;} .z_product_bg .imgbg.active{ transform: scale(1,1); opacity: 1;} .z_product_con{ color: #fff; position: absolute; left: 6.66666vw; top: 16.66666vw;} .z_product_con .z_index_tit{ color: #fff;} .z_index_tit .en{font-size:2.6vw; text-transform: uppercase; font-family: Raleway;font-weight: bold;line-height:2.6vw;} .z_product_con .z_index_tit .line{ display: block; width: 7.8125vw;height: 2px;background: #FFFFFF; margin: 20px 0;} .z_index_tit h3{font-size:1.5625vw;font-weight: bold;} .z_product_con .z_more_btn{ margin-top: 20px;} .z_product_class{ width: 50vw; position: absolute; bottom: 0;right: 0;} .z_product_class li{ width: 16.66vw; float: left; height: 16.66vw; z-index: 1; background: #0079d5; transition: ease 1s; position: relative;} .z_product_class li::before{ content: ""; display: block; opacity: 0; width: 0%; height: 0%; transition: ease .8s; position: absolute; left: 0; top: 0; border-left: 2px solid #fff; border-top: 2px solid #fff; box-sizing: border-box;} .z_product_class li::after{ content: ""; display: block; opacity: 0; width: 0%; height:0%; transition: ease .8s; position: absolute; right: 0; bottom: 0; border-right: 2px solid #fff; border-bottom: 2px solid #fff; box-sizing: border-box;} .z_product_class li.active::before,.z_product_class li.active::after{ width: 100%; height: 100%; opacity: 1;} .z_product_class li.active{background: rgba(0, 0, 0, 0.3)!important;} .z_product_class li a{ display: block; width: 100%; height: 100%; padding:1.5vw 2.3vw; box-sizing: border-box; color: #fff;} .z_product_class li .cn{font-size: 18px;font-weight: bold; margin-bottom: 20px; line-height:60px; display: inline-block; border-bottom: 2px solid #fff;} .z_product_class li .en{font-size: 20px;font-family: Raleway;font-weight: bold;line-height: 24px;} .z_product_class li .add{ display: block; width: 18px; height: 18px; background: url(../images/add.png) no-repeat center; background-size: 100% 100%; position: absolute; left: 2.3vw; bottom: 2.3vw;} .z_product_class li:nth-child(1){ margin-right: 33.32vw; background: rgba(191,181,85,1);} .z_product_class li:nth-child(3){ background:#32b16c ;} .z_product_class li:nth-child(2){ margin-left: 16.66vw;} .z_product_class li:nth-child(4){ width: 33.32vw; background: #b28850;} .z_product_class li:nth-child(5){ background: url(../images/pic1.jpg) no-repeat center; background-size: cover;} .z_index_news{ background: url(../images/bg2.png) repeat #f0f0f0; position: relative;} .z_news_flwarp{ width: 25%; float: left; position: absolute; left: 0; top: 0; height: 100%; display: flex; justify-content: center;} .z_news_frwarp{ width: 75%; float: right; } .z_news_flwarp .warp{height: 100%; padding: 5.8vw 1vw; box-sizing: border-box; position: relative;} .z_news_flwarp .z_news_nav{ position: absolute; left: 0; bottom: 5.8vw;} .z_news_nav a{ display: block;width: 158px; margin-bottom: 20px; height: 44px;border: 1px solid #7D7D7D; line-height: 42px; padding: 0 20px; box-sizing: border-box;} .z_news_nav a .iconfont{ float: right; color: #0079d5;} .z_news_nav a.active,.z_news_nav a:hover{ background: #0079d5; color: #fff; border-color:#0079d5 ;} .z_news_nav a:hover .iconfont,.z_news_nav a.active .iconfont{ color: #fff;} .z_news_frwarp li{ width: 33.3%; float: left; border-left: 1px solid #DCDCDC; transition: ease .5s;} .z_news_frwarp li a{ display: block; width: 100%; height: 100%; padding: 5.5vw 2.08333vw; box-sizing: border-box;} .z_news_frwarp li:last-child{border-right: 1px solid #DCDCDC;} .z_news_frwarp li .day{font-size:5.3125vw;font-family: DBOzoneX;color: #323232;line-height: 85px; margin-left: -10px; margin-bottom: 3.6vw;} .z_news_frwarp li .time{font-size: 16px;font-family: Arial;font-weight: bold;color: #727272;} .z_news_frwarp li .tit{font-size: 20px;font-weight: 500;color: #2A2A2A;line-height: 28px; height: 56px; margin: 15px 0;} .z_news_frwarp li .imgbox{ height: 13.02083vw; width: 100%; overflow: hidden; position: relative;} .z_news_frwarp li .imgbox::before{ content: ""; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: #0079d5; z-index: 1; transition: ease 1s; transition-delay: .5s;} .z_news_frwarp li.animated .imgbox::before{ transform: translateX(100%);} .z_news_frwarp li:hover .imgbg{ transform: scale(1.1,1.1);} .z_news_frwarp li .desc{font-size: 15px;font-weight: 400;color: #6A6A6A;line-height: 30px; height: 60px; margin: 2vw 0;} .z_news_frwarp li .more{ color:#0079d5 ;} .z_news_frwarp li .more .iconfont{ margin-left: 10px;} .z_news_frwarp li:hover .day,.z_news_frwarp li:hover .tit{color:#0079d5 ;} .z_news_frwarp li:hover { background: #fff;} .z_news_child{ display: none; overflow: hidden;} .z_news_child.active{ display: block;} .z_index_btmwrp{ padding: 0 8.33333vw; padding-top: 60px; box-sizing: border-box;} .z_hz_tit .en{font-size: 24px;font-family: Raleway;font-weight: bold;color: #323232;} .z_hz_tit h3{font-size: 20px;font-weight: bold;color: #626262;} .z_hz_swiper{ width: 100%; overflow: hidden;} .z_hz_swiper li{height: 150px; overflow: hidden } .z_hz_swiper li a{ display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;} .z_hz_swiper li img{ display: block; max-width: 100%; max-height: 100%; transition: ease 1s;} .z_hz_swiper li:hover img{ transform: scale(1.1,1.1);} .z_index_link{ border-top: 1px solid #E5E5E5; padding: 30px 0; display: flex; align-items: flex-start;} .z_index_link .tit{ flex-shrink: 0; font-weight: bold;} .z_index_link .boxa a{ display: inline-block; padding: 0 15px; margin-bottom: 5px; height: 15px;line-height: 15px; color:#848484 ; border-right: 2px solid #848484;} .z_index_link .boxa a:last-child{ border-right: 0;} .z_index_link .boxa a:hover{ color: #0072BC;} .z_footer{ width: 100%; background: #313131; position: relative; z-index: 1;padding: 0 8.33333vw; box-sizing: border-box; } .z_footer_top{ padding: 30px 0;display: flex; align-items: center;} .z_foot_nav{ float: left;} .z_foot_nav .downnav{ display: none;} .z_foot_nav a{ color: rgba(255,255,255,.5); display: block; overflow: hidden;text-overflow: ellipsis;white-space: nowrap;} .z_foot_nav a:hover{ color: #fff;} .z_foot_nav li{ display: inline-block; vertical-align: top; margin-right: 1.25vw; width: 8vw;} .z_foot_nav li h3 a{ color: #fff;} .z_foot_contact{ float: right; margin-left: auto;} .z_foot_addre{ float: left; text-align: right;} .z_foot_addre .kfbtn{ display: inline-block;width: 115px;height: 38px; line-height: 38px; text-align: center; color: #fff;background: #0079d5;} .z_foot_addre .kfbtn .iconfont{ display: inline-block;margin-right: 8px;} .z_foot_addre .tit{ color: rgba(255,255,255,.3); line-height: 40px; display: block;} .z_foot_addre .tel{font-size: 36px;font-family: DBOzoneX;font-weight: 500;color: #FFFFFF;line-height: 36px;} .z_foot_code{ float: right; text-align: center; margin-left: 20px;} .z_foot_code .img{ width: 100px; height: 100px;} .z_foot_code img{ display: block; width: 100%; height: 100%;} .z_foot_code h3{font-size: 14px;font-weight: 400;color: #666666; margin-top: 10px;} .z_footer_btm{ padding: 40px 0;color: #838383; border-top: 1px solid rgba(255,255,255,.1);} .z_footer_btm a{ color:#838383 ;} .z_other_banner{ width: 100%; height: 33.59375vw; position: relative; overflow: hidden; position: fixed; left: 0; top: 0;} .z_other_banner .imgbg{animation: zoombig 3s linear forwards;} .z_other_banner .text{ width: 100%; position: absolute; left: 0; bottom: 4.6875vw; color: #fff; padding: 0 8.33333vw; box-sizing: border-box; z-index: 1; transition: ease 1s; } @keyframes zoombig { 0%{transform: scale(1.2,1.2);} 100%{transform: scale(1,1);} } .z_other_banner .text .en{font-size: 2.86458vw;font-family: 'Raleway'; display: inline-block; font-weight: bold; line-height:3.125vw;text-transform: uppercase; transition: ease 1s;background-position 1.5s ease; background: linear-gradient(to right, #fff, #fff 50%, #0079d5 50%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 200% 100%; background-position: 100%; text-decoration: none; overflow: hidden; opacity: 0; transition-delay: .3s;} .z_other_banner .text h3{font-size: 1.30208vw;display: inline-block;font-weight: bold;color: #FFFFFF;text-transform: uppercase; transition: ease 1s;background-position 1.5s ease; background: linear-gradient(to right, #fff, #fff 50%, #0079d5 50%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 200% 100%; background-position: 100%; text-decoration: none; overflow: hidden; opacity: 0; transition-delay: .3s;} .z_other_banner .text .line{ width: 0px;height: 2px;background: #FFFFFF; display: block; margin: 15px 0; transition: ease 2s;} .z_other_banner .text.animated .en,.z_other_banner .text.animated h3{opacity: 1; transform: translateX(0); background-position: 0 100%;} .z_other_banner .text.animated .line{ width: 150px;} .z_other_pgae{ margin-top:33.59375vw ; background: #fff; position: relative; z-index: 2; width: 100%;} .z_page_nav{ width: 100%;height: 70px; overflow: hidden; background: #0079d5;line-height: 70px; padding: 0 8.33333vw; box-sizing: border-box;} .z_page_nav a{ color: #fff; font-size: 16px; padding: 0 20px;} .z_page_nav li{ float: left; margin-right: 1.125vw; position: relative;} .z_page_nav li::before{ content: ""; z-index: 1; display: block; width: 0%; height: 2px; background: #fff; transition: ease 1s; position: absolute; left: 50%; top: 0px;} /* .z_page_nav li:hover::before,.z_page_nav li.cur::before{ width: 100%; left: 0;} */ .z_page_nav li:hover a,.z_page_nav li.cur a{ font-weight: bold;} .z_page_nav li:hover,.z_page_nav li.cur{ background: #c02329;} .z_about_pages{ float: left; width: 100%;} .z_about_pages .flwarps,.z_about_pages .frwarps{ width: 50%; float: left; position: relative;} .z_about_pages .flwarps{padding: 5.2vw 8.33333vw;box-sizing: border-box;padding-right: 5vw;} .z_about_pages .z_about_con{ } .z_about_pages .z_about_tit{font-size:1.82291vw;font-weight: bold;color: #0079d5;} .z_about_pages .line{width: 26px;height: 3px;background: #0079d5; display: block; margin: 15px 0;} .z_about_pages .desc{font-size: 16px;font-weight: 400;color: #666666;line-height: 1.875vw; height: 22vw; overflow-y: auto;} .z_about_num2{ float: left; width: 23.75%;} .z_about_num2 li{ width:100%; display: flex; align-items: center; justify-content: center; color: #fff; text-align: center; height: 12.5vw; z-index: 1; position: relative;} .z_about_num2 li::before{ content: ""; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0;} .z_about_num2 li:nth-child(1)::before{ background: #32b16c;} .z_about_num2 li:nth-child(2)::before{ background: #0079d5;} .z_about_num2 li:nth-child(3)::before{ background: #c09a67;} .z_about_num2 li .timer{font-size: 3.125vw;font-family: DBOzoneX;font-weight: 500;color: #FFFFFF; margin-bottom: 10px;} .z_about_video{ width: 76.25%; position: absolute; right: 0; top: 0; height: 100%;} .z_about_video .z_play{ position: absolute; left: 50%; cursor: pointer; top: 50%; transform: translate(-50%,-50%); text-align: center; color: #fff;} .z_about_video .z_play .icon{ display: block; width: 50px; height: 50px; background: url(../images/play2.png) no-repeat center; background-size: 100% 100%;margin: 0 auto; margin-bottom: 10px; } .z_hxyx_about{ background-position: bottom center; padding: 7.8125vw 0; text-align: center;} .z_hxyx_about .conwarp{ width:80%; margin: 0 auto;transform: translateY(80px); color: #e1e1e1; transition: transform 1.2s, background-position 1.2s ease; background: linear-gradient(to right, #797979, #797979 50%, #e1e1e1 50%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 200% 100%; background-position: 100%; text-decoration: none; overflow: hidden; opacity: 0; transition-delay: .3s;} .z_hxyx_about.animated .conwarp,.z_hxyx_about.animated .tit{opacity: 1; transform: translateX(0); background-position: 0 100%;} .z_hxyx_about .tit{font-size:2.08333vw;font-weight: bold;color: #0079d5; color: #e1e1e1; transition: transform 1.2s, background-position 1.2s ease; background: linear-gradient(to right, #0079d5, #0079d5, 50%, #333 50%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 200% 100%; background-position: 100%; text-decoration: none; overflow: hidden; opacity: 0; transition-delay: .3s;} .z_about_line{ width: 26px;height: 3px;background: #0079d5; margin: 30px auto;} .z_hxyx_about .desc{font-size: 14px;font-weight: 400;color: #797979;line-height: 30px;} .z_hxys_system{ width: 100%; padding: 6.77083vw 8.33333vw; box-sizing: border-box; padding-bottom: 40px;} .z_index_tit3 .line{ display: block;width: 176px;height: 2px;background: #7D7D7D; margin: 15px 0;} .z_index_tit3 h3{font-size: 1.5625vw;font-weight: bold;color: #8C8C8C;} .z_hxys_system .z_index_tit3{ margin-bottom:4.6875vw ;} .z_system_list ul{ display: flex;} .z_system_list ul li{ flex: 1; padding: 0 3.6vw; box-sizing: border-box; border-right: 1px solid #e6e7e8; padding-bottom: 2vw;} .z_system_list ul li:last-child{ border: none;} .z_system_list ul li:first-child{ padding-left: 0;} .z_system_list ul li h3{font-size: 24px;font-weight: bold;color: #353434; margin-bottom: 14px;} .z_system_list ul li .icon{ margin-bottom:2vw;} .z_system_list ul li .desc{font-size: 16px;font-weight: 400;color: #777777;line-height: 24px;} .z_system_list ul li:hover img{ transform: rotate(360deg);} .z_system_list ul li img{ display: block; transition: ease 1s; height: 100%;} .z_system_case .flwarp{ width: 25%; float: left; height: 41.66666vw; background: #0079d5; padding:7.8125vw 0 0 5.72916vw; box-sizing: border-box; color: #fff;} .z_system_case .flwarp .z_index_tit3 h3{ color: #fff;} .z_case_swiper{} .z_system_case .z_case_swiper{ width: 75%; float: right; height: 41.66666vw; overflow: hidden; position: relative;} .z_system_case .z_case_swiper::before{ content: ""; display: block; z-index: 3; width: 100%; height: 100%; background: #0079d5; position: absolute; left: 0; top: 0; transition-delay: .5s; transition: ease 1.5s;} .z_system_case.animated .z_case_swiper::before{ width: 0;} .z_case_swiper .imgbox{ width: 55%; float: left;height: 41.66666vw; overflow: hidden; position: relative; .swiper-container{ } /* transform: rotate(15deg) scale(0.6); opacity: 0; animation: slide-ani-active 1.5s ease 0s 1 alternate; animation-fill-mode: forwards */ } .z_case_swiper .imgbox .imgbg{} /* .z_case_swiper .swiper-slide-active .imgbox .imgbg { transform: scale(1.8); opacity: 0; animation: slide-ani-active-slide 1.5s ease 0s 1 alternate; animation-fill-mode: forwards } .z_case_swiper .swiper-slide-active.prev .imgbox { transform: scale(0.5); opacity: 0; animation: slide-ani-active 1.5s ease 0s 1 alternate !important; animation-fill-mode: forwards !important } .z_case_swiper .swiper-slide-active.prev .imgbox .imgbg { transform: scale(1.8); opacity: 0; animation: slide-ani-active-slide 1.5s ease 0s 1 alternate !important; animation-fill-mode: forwards !important } */ .z_case_swiper .conbox{ width: 45%; float: right;} .z_case_swiper .conbox .imgbg{ width: 100%; height: 19.79166vw;} .z_case_swiper .infobox{ width: 100%; padding: 5vw 3.64583vw; box-sizing: border-box;} .z_case_swiper .infobox h3{font-size: 25px;font-weight: bold;color: #1C1C1C;line-height: 36px; border-bottom: 1px solid #dcdcdc; padding-bottom: 15px; margin-bottom: 15px;} .z_case_swiper .infobox .desc{font-size: 14px;font-weight: 400;color: #5C5C5C;line-height: 30px; height: 90px; margin-bottom: 1.5vw;} .z_case_swiper .infobox .more{ color: #0079d5;} .z_case_swiper .infobox .iconfont{ margin-left: 10px;} .z_case_swiper a{ display: block;} @keyframes slide-ani-active { 0% { transform: scale(0.6); opacity: 0 } 100% { transform: rotate(0) scale(1); opacity: 1 } } @keyframes slide-ani-active-slide { 0% { transform: scale(1.8); opacity: 0 } 100% { transform: rotate(0) scale(1); opacity: 1 } } .z_case_btn{ margin-top: 3vw;} .z_case_btn .iconfont{ display: inline-block; cursor: pointer; transition: ease 1s; outline: none; width: 39px;height: 39px; margin-right: 26px; background: #FDFEFF;border-radius: 50%; line-height: 39px; text-align: center; color: #7B7B7B;} .z_case_btn .iconfont:hover{ background: #32b16c; color: #fff;} .z_advantage{ width: 100%; padding: 5.2vw 8.33333vw;box-sizing: border-box;} .z_advantage .z_index_tit3{ text-align: center; margin-bottom: 4vw;} .z_advantage .z_index_tit3 .line{ margin: 10px auto; width: 56px;} .z_adv_list ul{ margin-left: -2.5%;} .z_adv_list li{ width: 22.5%; float: left; display: flex; align-items: center; margin-left: 2.5%; height: 18.75vw; padding: 3vw;box-sizing: border-box; color: #fff; position: relative; z-index: 1;} .z_adv_list li::before{ content: ""; display: block; width: 100%; height: 100%; background: rgba(0,0,0,.5); position: absolute; left: 0; top: 0;} .z_adv_list li:nth-child(1){ background-color: #b28750;} .z_adv_list li:nth-child(2){background-color: #434343;} .z_adv_list li:nth-child(3){ background-color: #546fb4;} .z_adv_list li:nth-child(4){ background-color: #32b16c;} .z_adv_list li h3{font-size: 1.5625vw;font-weight: 500;color: #FFFFFF; margin: 10px 0;} .z_adv_list li .desc{font-size: 16px;font-weight: 400;color: #FFFFFF;line-height:1.5625vw;} .z_adv_list li .icon{ height: 3.54166vw;} .z_adv_list li img{ display: block; height: 100%;} .z_gongneng{ padding: 5.2vw 8.33333vw;box-sizing: border-box; } .z_gongneng .conwarp{ position: relative;display: flex;align-items: center; position: relative; padding-right: 50px;} .z_gongneng .conwarp::before{ content: ""; display: block; width: 100%; height: 1px; background: #d2d2d2; position: absolute; left: 0; top: 50%; transform: translateY(-50%); z-index: 1;} .z_gongneng_swiper{ flex: 1;} .z_gongneng .tit{font-size: 1.82291vw;font-family: 'Raleway';font-weight: bold;color: #353434;line-height: 36px; text-transform: uppercase; margin-bottom: 90px;} .z_gongneng .tit em{ color: #0079d5;} .z_gongneng .tit2{ font-size: 1.5625vw; color: #7C7C7C;} .z_gongneng .flwarp{ flex-shrink: 0; margin-right: 5vw;} .z_gongneng_swiper{ height: 260px; overflow: hidden;} .z_gongneng_swiper li{ position: relative;} .z_gongneng_swiper li::before{ content: ""; display: block; width: 20px;height: 20px;background: #0079d5;border: 3px solid #FFFFFF;box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.05);border-radius: 50%; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);} .z_gongneng_swiper li:nth-child(even)::before{background: #009944;} .z_gongneng_swiper li .con{ width: 91px;height: 83px;position: absolute; left: 50%; transform: translateX(-50%);background: #FFFFFF; color: #0079d5; font-size: 20px; text-align: center; display: flex; align-items: center; justify-content: center; padding: 0 20px; box-sizing: border-box; border: 2px solid #0079d5;box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05);border-radius: 24px;} .z_gongneng_swiper li:nth-child(even) .con{ bottom: 0; } .z_gongneng_swiper li:nth-child(odd) .con{ top: 0;} .z_gongneng_swiper li:nth-child(4n-1) .con{background: #0079d5; color: #fff;} .z_gongneng_swiper li:nth-child(4n-2) .con{background: #009944;border: 2px solid #009944; color: #fff;} .z_gongneng_swiper li:nth-child(4n) .con{ background: #FFFFFF; border: 2px solid #009944; color: #009944;} .z_gongneng .conwarp .next{width: 77px;height: 77px;background: #B28750;border: 3px solid #FFFFFF;box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.05);border-radius: 50%; display: block; position: absolute; right: -40px; font-size: 24px; font-weight: bold; color: #fff; top: 50%; transform: translateY(-50%); z-index: 2; cursor: pointer; outline: none; text-align: center; line-height: 71px;} .z_gongneng .conwarp .next::before{content: "";display: block;width: 87px;height:87px;border-radius: 50%;background: rgba(178,135,80,.5);position: absolute;animation: circle-opacity 2s infinite;left: 50%;top: 50%;transform: translate(-50%,-50%) scale(0,0);} @keyframes circle-opacity{ from { opacity: 1; transform:translate(-50%,-50%) scale(1); } to { opacity: 0; transform:translate(-50%,-50%) scale(1.5); } } .z_team_pages{ padding: 8.33333vw; padding-bottom: 5.2vw; box-sizing: border-box; padding-top: 0;} .z_other_tit{ text-align: center;} .z_other_tit h3{font-size: 2.6vw;font-family: 'Raleway';font-weight: bold;color: #393838; text-transform: uppercase;} .z_other_tit h4{font-size: 1.30208vw;font-weight: bold;color: #7B7B7B;} .z_team_pages .z_other_tit{ padding: 3.64583vw 0;} .z_team_list ul{ margin-left: -2.7%;} .z_team_list li{ width: 17.3%; float: left; margin-left: 2.7%; height: 21.04166vw; margin-bottom: 2.91666vw; position: relative; overflow: hidden;z-index: 1;} .z_team_list li::before{content: ""; width: 100%; height: 100%; background: url(../images/titbg.png) no-repeat bottom center; background-size: 100% auto; position: absolute; left: 0; bottom: 0; pointer-events: none; z-index: 1; } .z_team_list li .infobox{ position: absolute; z-index: 2; transition: ease 1s; transform: translateY(69%); bottom: 0; top: 0; width: 100%; height: 100%; color: #fff; padding:1.5vw; box-sizing: border-box;} .z_team_list li .name{ text-align: center;} .z_team_list li .name h3{font-size: 18px;} .z_team_list li .line{ display: block;width: 42%; margin: 10px auto; transition: ease .6s; height: 1px; background: #FFFFFF; opacity: 0.5; transition: ease .6s;} .z_team_list li .desc{ margin-top: 20px; padding-top: 15px; transition: ease .6s; opacity: 0; font-size: 14px; line-height: 30px; position: relative; border-top: 1px solid rgba(255,255,255,.5); color: #fff;} .z_team_list li:hover .infobox{ transform: translateY(0); background: rgba(178,136,80,.9);} .z_team_list li:hover .imgbg{ transform: scale(1.1,1.1);animation: overturn 3s;-moz-animation: overturn 3s;-webkit-animation: overturn 3s;-o-animation: overturn 3s;} .z_team_list li:hover .desc{ opacity: 1;} .z_team_list li:hover .line{ width: 0; margin: 0 auto;} @keyframes overturn { 0% {transform: rotateY(0deg);} 50% {transform: rotateY(180deg);} 100% {transform: rotateY(0deg);} } .z_contact_map{ width: 100%; height: 500px;} .z_contact_warp{ padding: 0 8.33333vw; box-sizing: border-box;} .z_contact_info{ padding: 4.6875vw 0; border-bottom: 1px solid #dcdcdc;} .z_contact_info ul{ display: flex; justify-content: space-between;} .z_contact_info li{ float: left; padding-left: 70px; width: 20%; color: #474747; } .z_contact_info li.tel{ background: url(../images/c1.png) no-repeat left top;} .z_contact_info li.dz{ background: url(../images/c2.png) no-repeat left top;} .z_contact_info li.yx{ background: url(../images/c3.png) no-repeat left top;} .z_contact_info li.tel h3,.z_contact_info li.yx h3{font-size: 20px;font-family: Bahnschrift;font-weight: 400;color: #0079d5;} .z_contact_info li.dz h3{font-size: 16px;font-weight: 400;color: #0D3DB8;line-height: 24px;} .z_contact_code{ padding-bottom: 5vw;} .z_contact_code .tit{font-size: 25px;font-weight: bold;color: #101010; margin: 40px 0;} .z_contact_code li{ float: left; margin-right: 4.6875vw; text-align: center;} .z_contact_code li img{ display: block; width: 105px; height: 105px;} .z_contact_code li h3{ font-size: 16px; color: #656565; margin-top: 10px;} .rebox { cursor: pointer; position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 1000; -webkit-filter: none !important; background: rgb(0, 0, 0); /* IE Fallback (Solid Colour) */ background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAIElEQVQ4T2NkYGDYDMRkA8ZRAxhGw4BhNAyA+WAYpAMAIFgLQfO9BoEAAAAASUVORK5CYII=); background: rgba(0, 0, 0, 0.8); } .rebox *{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; padding: 0; margin: 0; } .rebox-contents { position: absolute; top: 5%; left: 5%; text-align: center; width: 90%; height: 90%; display: flex; justify-content: center;align-items: center; } .rebox-contents .rebox-content { border-radius: 1px; max-width: 100%; max-height: 100%; } .rebox-loading { width: 31px; height: 31px; margin: -16px 0 0 -16px; position: absolute; top: 48%; left: 50%; } .rebox-caption { display: none; position: absolute; left: 0; bottom: 0; width: 100%; text-align: center; z-index: 1000; background: #000; background: rgba(0,0,0,0.7); } .rebox-caption p { margin: 0 auto; max-width: 70%; display: inline-block; *display: inline; *zoom: 1; padding: 10px; color: #fff; font-size: 12px; line-height: 18px; } .rebox-button { position: absolute; z-index: 9999; min-width: 40px; height: 40px; line-height: 40px; background: rgb(0, 0, 0); text-decoration: none; font-size: 24px; color: #fff; text-align: center; vertical-align: middle; -webkit-border-radius: 32px; -moz-border-radius: 32px; -ms-border-radius: 32px; border-radius: 32px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .rebox-button:hover, .rebox-button:focus { opacity: 1; background: #BF2E2E;} .rebox-close { right: 10px; top: 10px; font-size: 30px; } .rebox-next { right: 10px; top: 48%; } .rebox-prev { left: 10px; top: 48%; } .rebox-loading { left: 50%; top: 48%; -webkit-animation-name: spin; -webkit-animation-duration: 2000ms; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; -moz-animation-name: spin; -moz-animation-duration: 2000ms; -moz-animation-iteration-count: infinite; -moz-animation-timing-function: linear; -ms-animation-name: spin; -ms-animation-duration: 2000ms; -ms-animation-iteration-count: infinite; -ms-animation-timing-function: linear; animation-name: spin; animation-duration: 2000ms; animation-iteration-count: infinite; animation-timing-function: linear; } .z_honor_page{ background-position: bottom center;padding: 5.72916vw 0vw; box-sizing: border-box; background-attachment: fixed;} .z_honor_page .z_other_tit .en,.z_honor_page .z_other_tit h4{ color: #fff;} .z_honor_page .z_other_tit{ margin-bottom:4.6875vw ;} .z_honor_list{ width: 1280px; margin: 0 auto;} .z_honor_list ul{ margin-left: -1.8%;} .z_honor_list li{ width: 23.2%; margin-left: 1.8%; background: #fff; height: 320px; transition: ease .6s; float: left; margin-bottom: 40px; border: 5px solid #fff; box-sizing: border-box; padding: 10px; box-sizing: border-box;} .z_honor_list li a{ display: block; width: 100%; height: 100%; box-sizing: border-box; position: relative; } .z_honor_list li .infobox{ right: 0; bottom: 0; padding: 15px; margin-top: 3vw; box-sizing: border-box; } .z_honor_list li .time{ font-size: 16px; font-weight: bold; margin-bottom: 10px;} .z_honor_list li .desc{ font-size:18px; line-height: 30px;font-weight: bold;} .z_honor_list li:hover{ box-shadow: 0 0 20px rgba(255,255,255,.5);} .z_project_page{ padding: 3.64583vw 8.33333vw; box-sizing: border-box; background: #f5f5f5;} .z_project_page li{ margin-bottom: 3.64583vw;} .z_project_page li a{ display: block; width: 100%;} .z_project_page li .imgbox,.z_project_page li .infobox{ width: 50%; float: left; height: 26.04166vw; overflow: hidden; position: relative;} .z_project_page li:hover .imgbg{ transform: scale(1.1,1.1) ;} .z_project_page li .imgbox::before{ content: ""; display: block; position: absolute; top: 0; left: 0; background-color:#0079d5; width: 100%; height: 100%; transform: translateX(0%); transition: all 0.5s cubic-bezier(0.5, 0, 0, 1); z-index: 1; } @-webkit-keyframes trigger1Anime { 0% {background-color: #0079d5;} 100% {background-color: rgba(0, 0, 0, 1);} } @keyframes trigger1Anime { 0% {background-color: rgba(0,145,179,1);} 100% {background-color: #0079d5;} } .z_project_page li.animated .imgbox::before{ -webkit-animation: trigger1Anime .5s cubic-bezier(0.5, 0, 0, 1);transition-delay: 0.5s; transform: translateX(100%); animation: trigger1Anime .5s cubic-bezier(0.5, 0, 0, 1);} .z_project_page li .infobox{ background: #fff; padding: 3.125vw; box-sizing: border-box; position: relative;} .z_project_page li .infobox::before{ z-index: 1; content: ""; display: block; width: 0%; height: 3px; background: #0079d5; position: absolute; left: 0; bottom: 0; transition: ease 1s;} .z_project_page li h3{font-size: 1.45833vw;font-weight: bold;color: #1C1C1C; margin-bottom: 10px; transition: ease .5s;} .z_project_page li .titbox{ border-bottom: 1px solid #DCDCDC; padding: 1.5vw 0; padding-top: 1vw;} .z_project_page li span,.z_detail_head .slg span{ display: inline-block; margin-right: 1.5vw;font-size: 16px;font-family: Arial;font-weight: 400;color: #5C5C5C; padding-left: 25px;} .z_project_page li .jie,.z_detail_head .slg .jie{ background: url(../images/p1.png) no-repeat left center; color: #0079d5;} .z_project_page li .yan,.z_detail_head .slg .yan{ background: url(../images/p2.png) no-repeat left center;} .z_project_page li .time,.z_detail_head .slg .time{ background: url(../images/p3.png) no-repeat left center;} .z_project_page li .desc{ margin-top: 15px;color: #5C5C5C;line-height: 30px;} .z_project_page li .more{ position: absolute; left: 3.125vw; bottom: 3.125vw; color: #0079d5;} .z_project_page li .more .iconfont{ font-size: 12px;} .z_project_page li:hover .infobox::before{ width: 100%;} .z_pages_bar{ text-align: center;} .z_pages_bar a{ display: inline-block; border-radius: 5px; height: 34px; line-height: 32px; border: 1px solid #c4c4c4; text-align: center; color: #c4c4c4; min-width: 68px; text-align: center; margin: 0 20px; text-transform: uppercase;} .z_pages_bar .btn{ min-width: 116px;} .z_pages_bar a:hover,.z_pages_bar a.active{ background: #2f5bb3; color: #fff; border-color: #2F5BB3;} .z_pages_bar a .iconfont{ font-size: 14px;} .z_project_page li:hover h3{ color: #0079d5;} .z_news_head{background: url(../images/bg9.jpg) no-repeat center; background-size: cover; padding: 4.16vw 0;} .z_hotnews_swiper{ } .z_hotnews_swiper li{box-shadow: 0px 10px 41px 0px rgba(0, 0, 0, 0.1);} .z_hotnews_swiper li .imgbox,.z_hotnews_swiper li .infobox{ width: 50%; height: 480px; float: left; overflow: hidden;} .z_hotnews_swiper li .infobox{ background: #fff; padding:5% 6.5%;} .z_hotnews_swiper li .day{font-size: 72px; margin-right: 15px; font-family: DIN;font-weight: bold;color: #0079d5; float: left; line-height: 52px; padding-bottom: 24px; border-bottom: 2px solid #0079d5;} .z_hotnews_swiper li .timebox span{ display: block; } .z_hotnews_swiper li .timebox{ display: flex; align-items: center;color: #ccc; font-size: 18px; font-weight: bold; margin-bottom: 40px;} .z_hotnews_swiper li h3{font-size: 25px;font-weight: bold;color: #303030;} .z_hotnews_swiper li .desc{font-size: 16px;font-weight: 400;color: #868686;line-height: 30px; height: 60px; margin: 20px 0;} .z_hotnews_swiper li .more{ color: #0079d5;} .z_hotnews_swiper li .iconfont{ font-size: 12px;} .z_hotnews_swiper li:hover h3{ color: #0079d5;} .z_hotnews_swiper li:hover .imgbg{ transform: scale(1.1,1.1);} .z_hot_btn{ text-align: right; margin-top: 25px;} .z_hot_btn span{ display: inline-block; transition: ease .5s; outline: none; width: 54px;height: 54px;background: #CCCCCC; text-align: center; line-height: 54px; color: #fff; margin-left: 10px; cursor: pointer;} .z_hot_btn span:hover{ background: #0079d5;} .z_news_list li{ border-bottom: 1px solid #DCDCDC; position: relative;} .z_news_list li::before{ content: ""; transition: ease 1s; display: block; width: 0; position: absolute; left: 0; height: 2px; background:#0079d5; position: absolute ; left: 50%; bottom: -1px; z-index: 1;} .z_news_list li a{ display: block; padding: 90px 0; position: relative; padding-right: 200px; box-sizing: border-box;} .z_news_list li h3{font-size: 28px;font-weight: bold;color: #303030; margin-bottom: 20px;} .z_news_list li h4{font-size: 16px;font-weight: 400;color: #767676;} .z_news_list li .timebox{ position: absolute; right: 0; top: 50%; transform: translateY(-50%); text-align: center; color: #CCCCCC;} .z_news_list li .timebox em{ display: block;font-size: 55px;font-family: DIN;font-weight: 500;color: #0079d5;} .z_news_list li:hover h3{ color: #0079d5;} .z_news_list li:hover::before{ width: 100%; left: 0;} .z_news_list .z_pages_bar{ padding: 4vw 0;} .z_gjia_page{ background: url(../images/bg7.jpg) no-repeat center; background-size: cover; padding: 6.25vw 8.33333vw; box-sizing: border-box; } .z_gjia_con{ margin-top: 3vw;} .z_gjia_con img{ max-width: 100%; display: block; margin: 0 auto; height: auto;} .z_detail_page{ background: #f5f5f5; padding: 0 8.33333vw; box-sizing: border-box;} .z_detail_page .z-container{ background: #fff; width: 100%; padding: 0 7.29166vw;padding-top: 10px; padding-bottom: 5.2vw; box-sizing: border-box;} .z_detail_head{ padding: 2.6vw 0; border-bottom: 1px solid #DCDCDC;} .z_detail_head h3{font-size: 1.82291vw;font-weight: bold;color: #1C1C1C; margin-bottom: 15px;} .z_detail_head .slg{ display: flex; align-items: center;} .z_detail_head .z_share{ margin-left: auto;} .z_share a{ display: inline-block; width: auto!important; height: auto!important; background: none!important; padding: 0!important; font-size: 20px!important; margin-left: 30px!important;} .z_detail_con{ padding: 40px 0;color: #5C5C5C;line-height: 36px; font-size: 16px;} .z_topbtm_bar{ width: 100%;height: 67px; color: #8B8B8B; background: #F9F9F9; line-height: 67px; padding: 0 30px; display: flex; justify-content: space-between; align-items: center;} .z_topbtm_bar .back{ display: block; width: 50px; height: 50px; background: url(../images/back.png) no-repeat center;} .z_topbtm_bar .iconfont{ margin: 0 10px;} .z_topbtm_bar a:hover{ color: #0079d5; font-weight: bold;} .z_img_hd{ position: absolute; left: 0; bottom: 20px; width: 100%; text-align: center; z-index: 2;} .z_img_hd li{ display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #fff; margin: 0 5px;} .z_img_hd li.on{ background: #0072BC;} .z_honor_list li a .slg{ display: flex; align-items: center; width: 100%;} .z_honor_list li .year{ margin-left: auto; font-size: 25px; font-family: "DIN"; color: #d8dedd;} .z_honor_list li .icon{ width: 47px; height: 59px; display: block; background: url(../images/zhonor.png); background-size: cover;} @media screen and (max-width:1440px){ .z_team_list li .infobox{ transform: translateY(62%);} .z_team_list li .desc{ line-height: 24px; font-size: 13px;} .z_contact_info li{ width: 25%;} .z-container{ width: 80%;} .z_hotnews_swiper li .imgbox, .z_hotnews_swiper li .infobox{ height: 400px;} .z_news_list li a{padding: 50px 0;} .z_news_list li h3{ font-size: 22px;} } @media screen and (max-width:1366px){ .z_product_class li .en{ font-size: 18px;} .z_product_class li .cn{ font-size: 16px;} .z_news_frwarp li .tit{ font-size: 18px;} .z_about_pages .desc{ font-size: 14px;} .z_about_pages .z_about_con{ width: 100%;} .z_system_list ul li{ padding: 0 1.5vw;} .z_system_list ul li h3{ font-size: 20px;} .z_system_list ul li .desc{ font-size: 14px;} .z_case_swiper .infobox{ padding-top: 3vw; padding-bottom: 3vw;} .z_case_swiper .infobox h3{ font-size: 20px;} .z_adv_list li .desc{ font-size: 14px;} .z_adv_list li{ padding: 2vw;} } @media screen and (max-width:1330px){ .z_header_nav li{margin-right:20px; } .z_menu_mask ul li{ width: 120px;} } @media screen and (max-width:1600px){ .z_header_nav li{margin-right:40px; } } @media screen and (max-width:980px){ .z_header{ height: 50px; line-height: 50px; background: #fff; border-bottom: none;} .z_header::before{ height: 100%;} .z_header .z_logo .logo2{ opacity: 1;} .z_menu_btn{ background: #0079d5;} .z_logo{ margin-left: 10px; margin-top: 5px;} .z_logo img{ display: block; height: 40px;} .z_header_nav{ display: none;} .z_header_sou{ display: none;} .z_menu_btn{ width: 50px; line-height: 50px; height: 50px;} .z_banner{ height: 50vw; margin-top: 50px; position: relative;} .z_banner_text .h3{ font-size: 16px;line-height: 18px;} .z_banner_text .h4{ display: none;} .z_more_btn{ height: 30px; line-height: 30px; min-width: 100px; padding: 0 10px; font-size: 12px;} .z_banner_text .z_more_btn{ margin-top: 10px;} .z_menu_mask{ width: 100%; display: flex; align-items: center; justify-content: center; text-align: center; height: calc(100vh - 50px); top: 50px; transform: translateY(100%); transition: ease .7s; padding: 10px; box-sizing: border-box; background: #0079d5;} .z_menu_mask ul li{ display: block; width: 100%; margin-bottom: 30px; } .z_menu_mask ul{ width: 100%; float: none;} body.Nav .z_menu_mask{ transform: translateY(0%);} .z_menu_mask ul li h3{ display: block; font-size: 15px; font-weight: bold; margin-bottom: 10px; color: #fff;} .z_menu_mask ul li a{ display: inline-block; margin: 0 5px; line-height: 24px; color: #fff;opacity: .8; width: auto;} .z_banner_bar{ display: none;} .z_index_page{ margin-top: 0;} .z_about_num{ width: 100%; height: 100vw;} .z_about_num li{ height: 50vw;} .z_index_video{ width: 100%; } .z_about_num li .h4{ font-size: 12px;} .z_about_num li h3{ font-size: 20px;} .z_index_video{ padding: 20px 0; height: auto;} .z_index_video .tit{ font-size: 18px; line-height: normal;} .z_index_video .line{ margin: 10px auto;} .z_index_video .desc{ font-size: 14px; line-height: 20px;} .z_index_video .warp{ width: 90%;} .z_about_num li .h4{ margin: 10px 0;} .z_about_num li em,.z_index_video .line{ width: 20px; height: 2px;} .z_index_product{ height: auto; padding: 20px 0; padding-bottom: 0;} .z_product_con{ position: relative;left: auto; top: auto; text-align: center; margin-bottom: 20px;} .z_product_class{ position: relative; bottom: auto; right: auto; width: 100%;} .z_index_tit .en{ font-size: 20px; line-height: 18px;} .z_product_con .z_index_tit .line{ margin: 10px auto;} .z_index_tit h3{ font-size: 16px; } .z_product_class li{ width: 33.3%; height: 33.3vw;} .z_product_class li a{padding: 10px; } .z_product_class li:nth-child(1){ margin-right:0;} .z_product_class li:nth-child(2){ margin-left: 0; margin-right: 33.3%;} .z_product_class li:nth-child(4){ width: 33.3%;} .z_product_class li .cn{ line-height: 30px; font-size: 14px; margin-bottom: 5px; border-bottom-width: 1px;} .z_product_class li .en{ font-size: 12px; line-height: 18px;} .z_product_class li .add{ left: 10px; bottom: 10px; width: 8px; height: 8px;} .z_news_flwarp{ width: 100%; position: relative; margin-bottom: 20px;} .z_index_news{ padding: 20px 0;} .z_news_flwarp .warp{ width: 100%; display: flex; align-items: center; padding: 0 10px;} .z_news_flwarp .z_news_nav{ position: relative;left: auto; bottom: auto; margin-left: auto;} .z_news_nav a{ display: inline-block; width: auto; height: 35px; line-height: 33px; padding: 0 10px; margin-bottom: 0;} .z_news_nav a .iconfont{font-size: 12px;} .z_news_frwarp{ width: 100%;} .z_news_frwarp li{ width: 100%; padding:0; border: none; border-bottom: 1px solid #DCDCDC;} .z_news_frwarp li .day{ font-size:20px; line-height: normal; margin-left: 0; margin-bottom: 5px;} .z_news_frwarp li .tit{ font-size: 14px; max-height: 48px; height: auto; line-height: 24px; margin: 10px 0;} .z_news_frwarp li .imgbox{ height:50vw;} .z_news_frwarp li .desc{ line-height: 20px; font-size: 13px; height: auto;} .z_news_frwarp li .more{ display: none;} .z_news_frwarp li a{ padding: 15px;} .z_news_frwarp li:first-child{border-top: 1px solid #DCDCDC;} .z_index_btmwrp{ padding: 0 10px; padding-top: 20px;} .z_hz_tit{ text-align: center;} .z_hz_tit .en{ font-size: 20px;} .z_hz_tit h3{ font-size: 16px;} .z_hz_swiper li{ height: 100px;} .z_index_link { display: block; padding: 15px 0;} .z_index_link .tit{ display: block; margin-bottom: 10px;} .z_footer{ padding: 0 10px;} .z_foot_nav{ display: none;} .z_foot_addre .tel{ font-size: 20px; line-height: 18px;} .z_foot_addre .tit{ line-height: 30px;} .z_foot_contact{ width: 100%; display: flex;align-items: center; justify-content: center;} .z_footer_top{ padding: 15px 0;} .z_footer_btm{ font-size: 12px; text-align: center; padding: 10px 0;} .z_footer_btm a{ font-size: 12px;} .z_foot_code .img{ width: 80px; height: 80px; margin: 0 auto;} .z_foot_code h3{ font-size: 12px; line-height: 24px;} .z_foot_addre .kfbtn{ height: 35px; line-height: 35px;} .z_other_banner{ margin-top: 50px; height:50vw; position: relative;} .z_other_pgae{ margin-top: 0;} .z_other_banner .text .en,.z_other_banner .text h3{ opacity: 1; font-size: 18px; display: block; line-height: 24px;transform: translateX(0); background-position: 0 100%;} .z_other_banner .text{ padding: 0 20px;} .z_other_banner .text .line{ display: none; } .z_other_banner .text h3{ font-size: 16px;} .z_other_banner .text{ display: block;} .z_page_nav{ padding: 0 10px; height: 40px; line-height: 40px; overflow: hidden;} .z_page_nav li a{ font-size: 14px; padding: 0 15px;} .z_page_nav li::before{ height: 1px;} .z_about_pages .flwarps, .z_about_pages .frwarps{ width: 100%; height: auto;} .z_about_pages .flwarps{ padding: 15px;} .z_about_pages .z_about_tit{ font-size: 18px; text-align: center;} .z_about_pages .desc{ font-size: 14px; line-height: 24px;} .z_about_pages .line{ margin: 10px auto;} .z_about_num2{ width: 100%;} .z_about_num2 li{ width: 33.3%; float: left; height: auto; padding: 10px 0; font-size: 12px;} .z_about_num2 li .timer{ font-size: 20px;} .z_about_video{ position: relative; width: 100%; height: 60vw; right: auto; top: auto; margin-top: 90px;} .z_hxyx_about .conwarp,.z_hxyx_about .tit{ width: 100%;opacity: 1;transform: translateX(0);background-position: 0 100%;} .z_hxyx_about{ padding: 20px 10px; box-sizing: border-box;} .z_hxyx_about .tit{ font-size: 18px; margin-bottom: 10px;} .z_about_line{ margin: 10px auto; display: none;} .z_hxyx_about .desc{ line-height: 24px;} .z_system_list ul{ display: block;} .z_system_list ul li{ width: 100%; border: none; text-align: center; padding: 0 10px; margin-bottom: 20px;} .z_system_list ul li .icon{ height: 40px; margin: 0 auto;} .z_system_list ul li img{ margin: 0 auto;} .z_system_list ul li h3{ margin: 5px 0 ; font-size: 16px;} .z_index_tit3 .line{ display: none;} .z_hxys_system .z_index_tit3{ text-align: center;} .z_system_case .flwarp{ width: 100%; display: flex; align-items: center; padding: 15px; height: auto; } .z_case_btn{ margin-left: auto; margin-top: 0;} .z_case_btn .iconfont{ margin-right: 0; margin-left: 10px; width: 30px; height: 30px; line-height: 30px;} .z_case_swiper .imgbox{ width: 100%; height: 60vw; } .z_system_case .z_case_swiper{ width: 100%; height: auto;} .z_case_swiper .conbox{ width: 100%;} .z_case_swiper .conbox .imgbg{ height: 50vw;display: none;} .z_case_swiper .infobox{ padding: 15px;} .z_case_swiper .infobox h3{ font-size: 16px; line-height: normal; padding-bottom: 10px; margin-bottom: 10px;} .z_advantage{ padding: 20px 10px;} .z_adv_list ul{ margin-left: 0;} .z_adv_list li{ width: 50%; height: auto; margin-left: 0; padding: 15px;} .z_adv_list li .desc{ line-height: 24px; font-size: 13px;} .z_adv_list li .icon{ height: 30px;} .z_adv_list li h3{ font-size: 16px;} .z_gongneng .conwarp{ display: block;} .z_gongneng .flwarp{ width: 100%; display: flex; align-items: center; margin: 0; margin-bottom: 20px;} .z_gongneng .conwarp{ padding-right: 40px;} .z_gongneng .conwarp::before{ display: none;} .z_gongneng .tit{ font-size: 16px; line-height: 20px; margin-bottom: 0;} .z_gongneng{ padding: 20px 10px;} .z_gongneng .tit2{ margin-left: auto; font-size: 16px;} .z_gongneng_swiper{ width: 100%; position: relative;height:160px;} .z_gongneng_swiper::before{ content: ""; display: block; width: 100%; height: 1px; background: #d2d2d2; position: absolute; left: 0; top: 50%; transform: translateY(-50%);z-index: 1;} .z_gongneng_swiper li .con{ width: 60px; height: 60px; font-size: 14px; padding: 0 10px; border-radius: 10px;} .z_gongneng_swiper li::before{ width: 15px; height: 15px;} .z_gongneng .conwarp .next{ width: 40px; height: 40px; line-height: 34px; font-size: 14px; right: 0; top: auto; bottom: 40px;} .z_gongneng .conwarp .next::before{ width: 40px; height: 40px;} .z_other_tit h3{ font-size: 18px;} .z_team_pages{ padding: 0 10px;} .z_team_list ul{ margin-left: -2%;} .z_team_list li{ width: 48%; margin-left: 2%; height: 65vw; margin-bottom: 8px;} .z_team_list li .desc{ margin-top: 8px; padding-top: 8px; } .z_contact_map{ height: 250px;} .z_contact_info ul{ display: block;} .z_contact_info li{ width: 100%;} .z_contact_warp{ padding: 10px;} .z_contact_info li{ margin-bottom: 15px;} .z_contact_info li.dz h3{font-size: 14px;} .z_contact_info li:last-child{ margin-bottom: 0;} .z_contact_code .tit{ font-size: 16px; margin: 15px 0;} .z_contact_code li{ margin-right: 10px;} .z_contact_code li h3{ margin-top: 5px; font-size: 14px;} .z_contact_code li img{ width: 80px; height: 80px;} .z_honor_list{ width: 94%;} .z_honor_list ul{ margin-left: -2%;} .z_honor_list li{ width: 48%; margin-left: 2%;} .z_honor_list li{ border-width: 2px; padding: 5px; margin-bottom: 8px; height: 230px;} .z_honor_list li .desc{ font-size: 14px;} .z_honor_list li .time{ font-size: 14px;} .z_project_page{ padding: 20px 10px;} .z_project_page li .imgbox, .z_project_page li .infobox{ height: auto; width: 100%;} .z_project_page li .imgbox{ height: 50vw;} .z_project_page li .imgbox::before{ display: none;} .z_project_page li h3{ font-size: 15px;} .z_project_page li span{ font-size: 13px;} .z_project_page li .infobox{ padding: 15px;} .z_project_page li .titbox{ padding: 0; padding-bottom: 10px; margin-bottom: 10px;} .z_project_page li .desc{ line-height: 24px; margin: 0; font-size: 13px;} .z_project_page li{ margin-bottom: 10px;} .z_pages_bar a{ margin: 0 2px; height: 30px; line-height: 26px; min-width: auto!important; padding: 0 10px; font-size: 12px;} .z_other_tit h4{ font-size: 18px;} .z_honor_list li a{ padding: 10px;} .z_honor_list li .infobox{ padding: 10px;} .z_news_head{ padding: 20px 0;} .z-container{ width: 94%;} .z_hotnews_swiper li .imgbox, .z_hotnews_swiper li .infobox{ width: 100%; height: auto;} .z_hotnews_swiper li .imgbox{ height: 50vw;} .z_hotnews_swiper li .infobox{ padding: 10px;} .z_hotnews_swiper li .timebox{ font-size: 14px; margin-bottom: 10px;} .z_hotnews_swiper li .day{ font-size: 36px; padding-bottom:5px; line-height: normal;} .z_hotnews_swiper li .mon{ line-height: 20px;} .z_hotnews_swiper li h3{ font-size: 15px;} .z_hotnews_swiper li .desc{ font-size: 13px; line-height: 24px; height: 48px; margin: 10px 0;} .z_hot_btn{ text-align: center;} .z_hot_btn span{ width: 35px; height: 35px; line-height: 35px; margin: 0 5px;} .z_news_list li a{ padding: 15px 0;} .z_news_list li h3{ font-size: 15px; margin-bottom: 6px;} .z_news_list li h4{ font-size: 13px;} .z_news_list li .timebox{ position: relative; transform: translateY(0); font-size: 12px; margin-top: 10px; text-align: left;} .z_news_list li .timebox em{ font-size: 18px;} .z_pages_bar a .iconfont{ font-size: 12px;} .z_hot_btn{ margin-top: 20px;} .z_gjia_page{ padding: 20px 10px;} .z_detail_page{ padding: 0 10px;} .z_detail_page .z-container{ padding: 10px;} .z_detail_head h3{font-size: 16px; margin-bottom: 10px;} .z_detail_head .slg{ display: block;} .z_detail_head .slg span{font-size: 12px;} .z_detail_head{ padding-bottom: 15px;} .z_share{ display: none;} .z_detail_con{ padding: 15px 0; line-height: 24px; font-size: 14px;} .z_topbtm_bar{ height: 40px; padding: 0 ; line-height: 40px;} .z_topbtm_bar .back{ width: 40px; height: 40px;} .z_topbtm_bar .iconfont{ margin: 0 5px; font-size: 12px;} .z_news_frwarp li .imgbox::before,.z_index_video::before{ display: none;} .z_product_bg .imgbg{ background-attachment: inherit;} .z_index_link .boxa a{ font-size: 12px; border-right-width: 1px;} .z_system_case .z_case_swiper::before{ display: none;} .z_img_hd{ bottom: 10px;} .z_honor_list li .icon{ width: 30px; height: 40px; background-size:100% auto ; background-repeat: no-repeat;} .z_honor_list li .year{ font-size: 16px;} .z_honor_list li .desc{ line-height: 24px;} } .jsclass_list{ position: relative;} .jsclass_list li{ width: 25%; float: left; transition: ease 1s; height: 760px; overflow: hidden; position: relative;} .jsclass_list li.on{ width: 50%;} .jsclass_list li a{ display: block; width: 100%; height: 100%;} .jsclass_list .infobox{ transition: ease 1s; height: 470px; display: table; position: absolute; left: 50%; top:50%; transform: translate(-50%,-50%); color: #fff; text-align: center; } .jsclass_list .infobox .table_cell{ display: table-cell; vertical-align: middle;} .jsclass_list .desc{ width: 240px; line-height: 30px; margin: 0 auto;} .jsclass_list li h3{font-size: 18px; font-weight: bold; margin-bottom: 20px;} .jsclass_list li .icon{ margin-bottom: 50px;} .jsclass_list li .line{ display: block; width: 24px; transition: ease 1s; height:1px; background: #fff; margin: 40px auto;} .jsclass_list li .index_more{ opacity: 0;} .jsclass_list li.on .infobox{ background: rgba(9, 106, 201, 0.9); width: 46%;} .jsclass_list li.on .line{ width: 66%;} .jsclass_list li.on .index_more{ opacity: 1;} .jsclass_list li:last-child{ position: absolute;right: 0; top: 0;} .imgauto { width: 100%; height: 100%; transition: ease 1s; background-repeat: no-repeat; background-size: cover; background-position: center center; }