@charset "utf-8"; @import 'basics/animate.min.css'; @import 'https://at.alicdn.com/t/c/font_960019_n9rp31md5h.css'; @font-face { font-family: Montserrat; src: url(../fonts/Montserrat-Bold.ttf); font-weight: normal; } @font-face { font-family: DIN; src: url(../fonts/DIN-Bold.otf); font-weight: normal; } @font-face { font-family: syht; src: url(../fonts/Source_Han_Sans_SC_Regular.otf); font-weight: normal; } .z_m_box { padding: 0 setvw(108); } * { padding: 0; margin: 0; box-sizing: border-box; outline: none; } *, :before, :after { box-sizing: border-box; } .clearfix:after { content: ""; display: block; clear: both; } body { font-family: 'syht',"Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif; font-size: 14px; color: #333; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); width: 100%; overflow-x: hidden; } html { width: 100%; } .lenis.lenis-smooth { scroll-behavior: auto; } html.lenis { height: auto; } body { min-height: 100vh; } img { max-width: 100%; } ul, dl, li, dt, dd, em { font-style: normal; list-style: none; } h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; } pre { font-family: 'syht',"Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif; white-space: pre-wrap; word-wrap: break-word; } a { text-decoration: none; transition: ease 0.65s; color: #333; outline: none; } input[type=text], input[type=password], input[type=search], input[type=number], textarea, select { font-size: inherit; outline: none; font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif; border-radius: 0; border: none; background: none; transition: ease 0.45s; outline: none; } select::-ms-expand { display: none; } select:focus { outline: none; } input::-webkit-input-placeholder { color: #7B7B7B; } input:-moz-placeholder { color: #7B7B7B; } input::-moz-placeholder { color: #7B7B7B; } input:-ms-input-placeholder { color: #7B7B7B; } .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; } .z-container { width: 1400px; height: auto; clear: both; margin: 0 auto; } .fl, .flwarp { float: left; } .fr, .frwarp { float: right; } .textleft { text-align: left; } .textcenter { text-align: center; } .textright { text-align: right; } .img { display: block; width: 100%; } .ml { margin-left: auto; } .imgbox { overflow: hidden; } .beforecon, .z_zp_section .z_zp_list li::before, .z_zl_section .zlnav li::before, .z_js_swiper .imgbox::before, .z_case_list li .imgbox::before, .z_year_swiper .btn::before, .z_year_swiper .swiper-slide-active span::before, .z_year_swiper li span::before, .z_about_process .z_year_warp::before, .z_about_wh .frcon li::before, .z_about_warp .frcon::after, .z_about_warp .frcon::before, .z_other_banner .bg::before, .swiper_btn .btn::before, .z_index_about .z_ser_swiper li::before, .z_more::before, .z_banner .btmwarp .pages::before, .z_banner .btmwarp .btnwarp .btn::before, .z_header .z_header_nav li > a::before { content: ""; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: -1; } /* 设置滚动条整体部分的样式 */ ::-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; } ::-webkit-scrollbar-track-piece { background: #eeeeee; } ::-webkit-scrollbar-thumb:vertical { background-color: #F1882F; } /* swiper */ .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-fade .swiper-slide { pointer-events: none; -webkit-transition-property: opacity; -o-transition-property: opacity; transition-property: opacity; } .swiper-fade .swiper-slide-active, .swiper-fade .swiper-slide-active { pointer-events: auto; z-index: 3; } .swiper-fade .swiper-slide { opacity: 0 !important; } .swiper-fade .swiper-slide-active { opacity: 1 !important; } .swiper-container-vertical > .swiper-wrapper { flex-direction: column; } .swiper-vertical > .swiper-wrapper { flex-direction: column; } .swiper-grid-column > .swiper-wrapper { flex-wrap: wrap; flex-direction: column; } .swiper-pointer-events { touch-action: pan-y; } .swiper-grid > .swiper-wrapper { flex-wrap: wrap; } .imgbg { width: 100%; height: 100%; transition: ease 1s; background-position: center; background-repeat: no-repeat; background-size: cover; } .imgbgs { width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; } .lazy { background-size: cover; background-repeat: no-repeat; width: 100%; height: 100%; background-position: bottom center; position: absolute; z-index: -1; left: 0; top: 0; background-attachment: fixed; } #zCode { display: block; left: 50%; top: 50%; margin-left: -110px; margin-top: -122.5px; position: fixed; background: #fff; height: 245px; width: 220px; z-index: 3000; border-radius: 5px; border: 6px solid #7f7f7f; box-sizing: border-box; } #zCode > h2 { color: #666; background: #f2f2f2; height: 24px; line-height: 24px; border-bottom: 1px solid #e8e8e8; font-size: 14px; padding: 0 10px; box-sizing: border-box; } #zCode > h2 > i { cursor: pointer; float: right; width: 24px; height: 24px; text-align: center; } #zCode > .ewm { width: 100%; height: 208px; padding: 20px; box-sizing: border-box; } #zCode > .ewm canvas { width: 100%; height: 100%; top: auto; left: auto; position: relative; } /* 视频弹框 */ .z_video_pop { width: 100%; height: 100%; background: #000; position: fixed; left: 0; top: 0; z-index: 999 !important; } .z_video_pop .warp { display: flex; align-items: center; justify-content: center; width: 100%; height: 100vh; } .z_video_pop .warp .close_btn { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; color: #fff; position: absolute; right: 0; top: 0; z-index: 100; cursor: pointer; } .z_video_pop .warp .close_btn .iconfont { font-size: 18px; } .z_video_pop .warp #videopop { width: 100%; max-height: 100%; } .z_menu_btn { align-items: center; overflow: hidden; justify-content: center; cursor: pointer; z-index: 11; margin-left: auto; display: none; } .z_menu_btn span { display: block; transition: ease 0.6s; width: 24px; height: 2px; background: #F1882F; mix-blend-mode: difference; } .z_menu_btn span:nth-child(2) { width: 20px; } .z_menu_btn .line2 { margin: 4px 0; } .z_menu_btn .line1, .z_menu_btn .line2 { margin-left: auto; } .z_menu_btn.on .line1 { transform: translateY(6px) rotate(45deg); width: 24px; } .z_menu_btn.on .line2 { opacity: 0; } .z_menu_btn.on .line3 { transform: translateY(-6px) rotate(-45deg); width: 24px; } .z_menu_btn:hover span { width: 24px; } @media screen and (max-width: 980px) { .z_menu_btn { display: block; } } @keyframes rotation { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); } } .z_section { padding: 4.6875vw 8.3333333333vw; } .z_flex_warp { display: flex; overflow: hidden; } @media screen and (max-width: 980px) { .z_m_box { display: block !important; padding: 40px 12px !important; } .z_section { padding: 35px 12px !important; } .z_flex_warp { display: block; } } .z_header_warp { position: relative; } .z_header { position: fixed; left: 0; top: 0; width: 100%; display: flex; align-items: center; justify-content: center; padding: 0 5.5208333333vw 0 4.9479166667vw; height: 5.2083333333vw; justify-content: space-between; z-index: 9; border-bottom: 1px solid rgba(255, 255, 255, 0.14); transition: background 1s; } @media screen and (max-width: 980px) { .z_header { height: 50px; } } .z_header.on2 { background: #fff; } .z_header.on, .z_header.on2 { border-bottom-color: rgba(51, 51, 51, 0.14); } .z_header.on .z_logo .img2, .z_header.on2 .z_logo .img2 { opacity: 1; } .z_header.on .z_logo .img1, .z_header.on2 .z_logo .img1 { opacity: 0; } .z_header.on .z_header_nav li > a, .z_header.on2 .z_header_nav li > a { color: #333; } .z_header.on .z_lang dt, .z_header.on2 .z_lang dt { border-color: #333; color: #333; } .z_header.on .z_lang dt .ico, .z_header.on2 .z_lang dt .ico { filter: invert(100%); } .z_header.on .z_right::before, .z_header.on2 .z_right::before { background: #333; } .z_header .z_logo { display: block; height: 2.0833333333vw; position: relative; } @media screen and (max-width: 980px) { .z_header .z_logo { height: 28px; } } .z_header .z_logo img { display: block; height: 100%; transition: ease 1s; } .z_header .z_logo img.img2 { position: absolute; left: 0; top: 0; opacity: 0; } .z_header .z_header_mask { display: flex; align-items: center; margin-left: auto; } .z_header .z_header_nav { width: 100%; } .z_header .z_header_nav li { display: inline-block; margin-right:4vw; position: relative; } .z_header .z_header_nav li:hover .downnav{opacity:1; visibility:visible;} .En .z_header .z_header_nav li,.En .z_header .z_header_nav li:first-child{min-width:inherit;} .En .z_header .z_header_nav li{padding:0 30px; padding:0 clamp(15px,1.5625vw,30px); margin:0} .En .z_header .z_header_nav .downnav a{line-height:110%; margin-bottom:15px;} .z_header .z_header_nav li.active > a::before, .z_header .z_header_nav li:hover > a::before { width: 100%; left: 0; } .z_header .z_header_nav li > a { display: inline-block; color: #fff; font-weight: bold; font-size: 0.8333333333vw; line-height: 5.2083333333vw; position: relative; padding: 0 5px; } @media screen and (max-width: 1680px) { .z_header .z_header_nav li > a { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } .En .z_header .z_header_nav li{padding:0 10px;} .z_header .z_right::before{display:none !important;} } @media screen and (max-width: 980px) { .z_header .z_header_nav li > a { font-size: 14px; } } @media screen and (max-width: 980px) { .z_header .z_header_nav li > a { line-height: 40px; } } .z_header .z_header_nav li > a::before { height: 3px; background: #F1882F; width: 0; transition: ease 1s; left: 50%; } .z_header .z_header_nav li:hover .downwarp { transition: ease 0.8s; opacity: 1; visibility: visible; transform: translateX(-50%) !important; } .z_header .z_header_nav .downnav { position: absolute; left: 50%; top: 100%; padding: 1vw 0; opacity: 0; visibility: hidden; transform:translateX(-50%); min-width:6vw; text-align:center; background:rgba(255,255,255,.9); } .z_header .z_header_nav .downnav.on { opacity: 1; visibility: visible; transition: ease 1s; } .z_header .z_header_nav .downnav a { display: block; line-height: 30px; margin-bottom: 10px; color: #333333; padding: 0 20px; white-space:nowrap; } .z_header .z_header_nav .downnav a:hover { color: #008FD6; } .z_header .z_right { padding-left: 2.0833333333vw; position: relative; } .z_header .z_right::before { content: ""; display: block; width: 1px; height: 15px; background: #FFFFFF; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .z_header .z_lang { position: relative; cursor: pointer; color: #fff; } .z_header .z_lang .ico { display: block; margin-right: 10px; } .z_header .z_lang dt { white-space: nowrap; min-width: 104px; padding: 0 5px; height: 34px; border-radius: 20px; border: 1px solid #fff; display: flex; align-items: center; justify-content: center; position: relative; z-index: 2; transition: ease 0.4s; } .z_header .z_lang dd { position: absolute; left: 0; top: 0; padding: 40px 0 6px; right: 0; background: #F1882F; border-radius: 20px 20px 10px 10px; text-align: center; transition: ease 1s; transform: translateY(10px); opacity: 0; visibility: hidden; box-sizing: border-box; width: 100%; } .z_header .z_lang dd a { display: block; color: #fff; line-height: 30px; } .z_header .z_lang:hover dt,.z_header .z_lang.on dt { background: #008FD6; border-color: #008FD6; color: #fff; } .z_header .z_lang:hover dt .ico,.z_header .z_lang.on dt .ico { filter: invert(0); } .z_header .z_lang:hover dd { display: block; transform: translateY(0%); opacity: 1; visibility: visible; } @media screen and (max-width: 980px) { .z_header { background: #fff; padding: 0 10px; } .z_header .z_header_mask { position: fixed; right: 0%; top: 50px; height: calc(100vh - 50px); background: #fff; width: 100%; overflow-y: auto; transition: transform 0.7s; display: block; transform: translateX(100%); } .z_header .z_header_mask.on { transform: translateX(0%); } .z_header .z_header_nav { position: relative; top: 0; left: 0; transform: translate(0, 0); padding: 10px; } .z_header .z_header_nav li { display: block; margin: 0; text-align: left; border-bottom: 1px solid #ddd; padding: 5px 0; } .z_header .z_header_nav li > a::before, .z_header .z_header_nav li > a.active { display: none; } .z_header .z_header_nav li .downnav { position: relative; opacity: 1; left: auto; transform: translate(0, 0); visibility: visible; width: 100%; min-height: auto; background: none; padding: 0; } .z_header .z_header_nav li .downnav::before, .z_header .z_header_nav li .downnav::after { display: none; } .z_header .z_header_nav li .downnav a { display: inline-block; margin-right: 10px; margin-bottom: 0; font-size: 12px; } .z_header .z_right { padding: 0; margin-left: auto; } .z_header .z_right::before { display: none; } .z_header .z_lang { font-size: 14px; } } .z_menu_mask { position: fixed; left: 0; top: 0; width: 100%; background: rgba(255, 255, 255, 0.9); z-index: 8; transition: ease 0.6s; opacity: 0; height: 5.2083333333vw; } .z_menu_mask.on { opacity: 1; } .z_banner { width: 100%; height: 100vh; overflow: hidden; position: fixed; left: 0; top: 0; z-index: -1; } .z_banner li { position: relative; pointer-events: none; overflow: hidden; } .z_banner li.active .imgbg, .z_banner li.swiper-slide-active .imgbg { transform: scale(1, 1); } .z_banner li.active .z_text, .z_banner li.swiper-slide-active .z_text { transform: translateY(-50%); opacity: 1; } .z_banner li .imgbg { transform: scale(1.1, 1.1); transition: transform 3s; } .z_banner li .z_text { position: absolute; left: 0; width: 100%; text-align: center; color: #fff; opacity: 0; z-index: 2; transition: all 2s; transition-delay: 1s; top: 50%; } .z_banner li .z_text .warp { margin: 0 auto; width: 40vw; } @media screen and (max-width: 980px) { .z_banner li .z_text .warp { width: 80%; } } .z_banner li .z_text .h3 { font-size: 2.6041666667vw; line-height: 3.6458333333vw; font-weight: bold; text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.4); color:#fff; } @media screen and (max-width: 980px) { .z_banner li .z_text .h3 { font-size: 18px; } } @media screen and (max-width: 980px) { .z_banner li .z_text .h3 { line-height: 24px; } } .z_banner li .btn { display: inline-block; min-width: 7.0833333333vw; padding: 0 1.3020833333vw; height: 44px; height: 2.2916666667vw; line-height: 2.1875vw; border: 1px solid #FFFFFF; border-radius: 1.1458333333vw; color: #fff; margin-top: 2.0833333333vw; } @media screen and (max-width: 980px) { .z_banner li .btn { height: 32px; } } @media screen and (max-width: 980px) { .z_banner li .btn { line-height: 30px; } } @media screen and (max-width: 980px) { .z_banner li .btn { margin-top: 20px; } } .z_banner li .btn:hover { background: #F1882F; border-color: #F1882F; } .z_banner li .btn .ico { vertical-align: middle; margin-right: 5px; } .z_banner .btmwarp { position: absolute; left: 0; bottom: 0; width: 100%; z-index: 2; } .z_banner .btmwarp .topflex { padding: 0 8.3333333333vw; display: flex; align-items: flex-end; justify-content: space-between; } .z_banner .btmwarp .btnwarp { display: flex; align-items: center; } .z_banner .btmwarp .btnwarp .btn { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 50%; color: #fff; cursor: pointer; outline: none; margin-right: 1.0416666667vw; position: relative; } @media screen and (max-width: 980px) { .z_banner .btmwarp .btnwarp .btn { width: 30px; height: 30px; } } .z_banner .btmwarp .btnwarp .btn .iconfont { font-size: 12px; } .z_banner .btmwarp .btnwarp .btn::before { border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #F1882F; transition: transform 0.8s; transform: translate(-50%, -50%) scale(0, 0); } .z_banner .btmwarp .btnwarp .btn:hover { border-color: #F1882F; } .z_banner .btmwarp .btnwarp .btn:hover::before { transform: translate(-50%, -50%) scale(1, 1); } .z_banner .btmwarp .pages { width: 11.0416666667vw; height: 11.0416666667vw; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: bold; position: relative; margin-bottom: -3px; } @media screen and (max-width: 980px) { .z_banner .btmwarp .pages { width: 80px; height: 80px; } } .z_banner .btmwarp .pages .swiper-pagination-current { font-size: 24px; } @media screen and (max-width: 980px) { .z_banner .btmwarp .pages .swiper-pagination-current { font-size: 18px; } } .z_banner .btmwarp .pages span:before { content: "0"; } .z_banner .btmwarp .pages::before { position: absolute; background: url(../img/cir2.png) no-repeat center; background-size: 100% auto; } .z_banner .btmwarp .pages.on::before { animation: cir 1.6s forwards linear; } .z_banner .btmwarp .hdbar { height: 5.7291666667vw; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(255, 255, 255, 0.5); color: #fff; position: relative; } .z_banner .btmwarp .hdbar::before { content: ""; display: block; height: 1.9791666667vw; width: 1px; background: #fff; position: absolute; left: 50%; transform: translateX(-50%); bottom: 0; } .z_banner .btmwarp .hdbar::after { content: ""; display: block; width: 7px; height: 7px; background: #FFFFFF; border-radius: 50%; position: absolute; left: 50%; transform: translateX(-50%); bottom: 1.5625vw; } @media screen and (max-width: 980px) { .z_banner { height: 70vw; margin-top: 50px; position: relative; } .z_banner li .btn { border-radius: 16px; padding: 0 10px; } .z_banner .btmwarp { display: none; padding-bottom: 10px; } .z_banner .btmwarp .topflex { justify-content: center; } .z_banner .btmwarp .topflex .btn { margin: 0 10px; } .z_banner .btmwarp .hdbar { display: none; } .z_banner .btmwarp .pages { display: none; } } .z_index_tit .loading span { display: inline-block; width: 6px; height: 6px; margin-right: 3px; border-radius: 50%; background: #008FD6; animation: load 1.5s ease infinite; } .z_index_tit .loading span:nth-child(1) { animation-delay: 0.1s; } .z_index_tit .loading span::nth-child(2) { animation-delay: 0.3s; } .z_index_tit .loading span::nth-child(3) { animation-delay: 0.6s; } @keyframes load { 0% { opacity: 1; transform: scale(1, 1); } 100% { opacity: 0.5; transform: scale(0.5, 0.5); } } .z_index_tit .h3 { font-size: 1.5625vw; font-weight: bold; color: #1A1A1A; } @media screen and (max-width: 980px) { .z_index_tit .h3 { font-size: 22px; } } .z_index_tit .h3 em { color: #008FD6; } .z_desc { font-size: 0.8333333333vw; color: #333333; line-height: 1.4583333333vw; } @media screen and (max-width: 1680px) { .z_desc { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_desc { font-size: 14px; } } @media screen and (max-width: 1680px) { .z_desc { line-height: 1.6916666667vw; } } @media screen and (max-width: 980px) { .z_desc { line-height: 24px; } } .z_more { display: inline-block; height: 50px; height: 2.6041666667vw; line-height: 2.6041666667vw; background: #F1882F; border-radius: 1.3020833333vw; color: #fff; text-align: center; padding: 0 1.25vw; position: relative; z-index: 1; overflow: hidden; } @media screen and (max-width: 980px) { .z_more { height: 32px; } } @media screen and (max-width: 980px) { .z_more { line-height: 32px; } } .z_more::before { background: #008FD6; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 50px; height: 50px; border-radius: 50%; transition: transform 1.5s; transform: translate(-50%, 50%) scale(0, 0); } .z_more:hover::before { transform: translate(-50%, 0%) scale(4, 4); } .z_more .arr { display: inline-block; vertical-align: middle; margin-left: 0.5208333333vw; } @media screen and (max-width: 980px) { .z_more { border-radius: 16px !important; padding: 0 10px; } } @keyframes cir { 0% { transform: rotate(0); } 100% { transform: rotate(360deg); } } .z_index_about { position: relative; overflow: hidden; margin-top: 100vh; } .z_index_about .circle { width: 31.6666666667vw; height: 31.6666666667vw; position: absolute; left: 9.8958333333vw; top: 3.6458333333vw; z-index: 1; background: url(../img/cir.png) no-repeat center; background-size: 100% auto; animation: cir 8s infinite linear; } @media screen and (max-width: 980px) { .z_index_about .circle { width: 100%; height: 100%; } } .z_index_about .z_flex_warp { justify-content: space-between; } .z_index_about .z_index_tit { margin-bottom: 1.1458333333vw; } @media screen and (max-width: 980px) { .z_index_about .z_index_tit { margin-bottom: 10px; } } .z_index_about .flcon .ico { display: block; height: 2.8125vw; } @media screen and (max-width: 980px) { .z_index_about .flcon .ico { height: 22px; } } .z_index_about .frcon { width: 35.3125vw; } @media screen and (max-width: 980px) { .z_index_about .frcon { width: 100%; } } .z_index_about .frcon .z_more { margin-top: 2.6041666667vw; } @media screen and (max-width: 980px) { .z_index_about .frcon .z_more { margin-top: 10px; } } .z_index_about .servicewarp { margin-top: 4.1666666667vw; } @media screen and (max-width: 980px) { .z_index_about .servicewarp { margin-top: 40px; } } .z_index_about .z_ser_swiper { margin-top: 4.6875vw; } @media screen and (max-width: 980px) { .z_index_about .z_ser_swiper { margin-top: 40px; } } .z_index_about .z_ser_swiper li { width: 26.4583333333vw; height: 13.0208333333vw; background: #fff; box-shadow: 0px 4px 10px 0px rgba(0, 143, 214, 0.14); padding: 1.1458333333vw; padding-bottom: 0; position: relative; z-index: 1; margin-right: 4.6875vw; } @media screen and (max-width: 980px) { .z_index_about .z_ser_swiper li { width: 100%; height: auto; } } @media screen and (max-width: 980px) { .z_index_about .z_ser_swiper li { margin-right: 10px; } } .z_index_about .z_ser_swiper li:last-child { margin-right: 0; } .z_index_about .z_ser_swiper li::before { background: linear-gradient(131deg, #008FD6, #65C9FF); position: absolute; clip-path: circle(150% at 100% 0px); transition: clip-path 1s, -webkit-clip-path 1s; opacity: 0; } .z_index_about .z_ser_swiper li .ico { height: 1.4583333333vw; overflow: hidden; } @media screen and (max-width: 980px) { .z_index_about .z_ser_swiper li .ico { height: 18px; } } .z_index_about .z_ser_swiper li .ico img { display: block; height: 100%; } .z_index_about .z_ser_swiper li:hover::before { clip-path: circle(150% at 100% 0px); opacity: 1; } .z_index_about .z_ser_swiper li:hover .ico img { filter: drop-shadow(0px 1.4583333333vw #fff); transform: translateY(-1.4583333333vw); } @media screen and (max-width: 980px) { .z_index_about .z_ser_swiper li:hover .ico img { filter: drop-shadow(0px 18px #fff); transform: translateY(-18px); } } .z_index_about .z_ser_swiper li:hover .tit, .z_index_about .z_ser_swiper li:hover .more { color: #fff; } .z_index_about .z_ser_swiper li:hover .imgbg { transform: scale(1.1, 1.1); } .z_index_about .z_ser_swiper li a { display: flex; } .z_index_about .z_ser_swiper li .imgbox { width: 16.25vw; height: 12.3958333333vw; transform: translateY(-2.9166666667vw); transition: transform 1s; margin-right: 1.5625vw; flex-shrink: 0; } @media screen and (max-width: 980px) { .z_index_about .z_ser_swiper li .imgbox { width: 50%; height: 34vw; } } @media screen and (max-width: 980px) { .z_index_about .z_ser_swiper li .imgbox { margin-right: 15px; } } .z_index_about .z_ser_swiper li .infobox { position: relative; } .z_index_about .z_ser_swiper li .tit { font-size: 0.9375vw; font-weight: bold; color: #333333; margin: 0.78125vw 0; } @media screen and (max-width: 1680px) { .z_index_about .z_ser_swiper li .tit { font-size: 1.134375vw; } } @media screen and (max-width: 980px) { .z_index_about .z_ser_swiper li .tit { font-size: 14px; } } .z_index_about .z_ser_swiper li .line { display: block; width: 1.9791666667vw; height: 2px; background: #F1882F; } @media screen and (max-width: 980px) { .z_index_about .z_ser_swiper li .line { width: 18px; } } .z_index_about .z_ser_swiper li .more { position: absolute; left: 0; bottom: 2.9166666667vw; color: #333333; opacity: 0.6; white-space: nowrap; } .z_index_about .z_ser_swiper li .more .iconfont { font-size: 16px; margin-right: 4px; vertical-align: -1px; } .z_index_about .z_ser_swiper .z_flex_warp { display: flex; align-items: center; justify-content: space-between; } .z_index_about .z_ser_swiper .swiper_bar { margin-top: 2.0833333333vw; display: flex; align-items: center; } @media screen and (max-width: 980px) { .z_index_about .z_ser_swiper .swiper_bar { margin-top: 20px; } } .z_index_about .z_ser_swiper .swiper_bar .swiper_num { font-size: 18px; font-family: DIN; font-weight: bold; color: #008FD6; flex-shrink: 0; } @media screen and (max-width: 980px) { .z_index_about .z_ser_swiper .swiper_bar .swiper_num { font-size: 16px; } } .z_index_about .z_ser_swiper .swiper_bar .swiper_num em.index { font-size: 1.875vw; } @media screen and (max-width: 980px) { .z_index_about .z_ser_swiper .swiper_bar .swiper_num em.index { font-size: 24px; } } .z_index_about .z_ser_swiper .swiper_bar .swiper_dot { width: 13.75vw; height: 4px; background: #CCC7C7; border-radius: 2px; position: relative; margin-left: 1.4583333333vw; position: relative; } @media screen and (max-width: 980px) { .z_index_about .z_ser_swiper .swiper_bar .swiper_dot { width: 100%; } } .z_index_about .z_ser_swiper .swiper_bar .swiper_dot .swiper-pagination-progressbar-fill { transform-origin: left top; position: absolute; left: 0; width: 100%; height: 100%; background: #008FD6; } .z_index_about .z_ser_swiper .swiper_btn { margin-left: auto; } .z_index_about .z_ser_swiper .swiper_btn .btn { width: 3.125vw; height: 3.125vw; } @media screen and (max-width: 980px) { .z_index_about .z_ser_swiper .swiper_btn .btn { width: 40px; height: 40px; } } @media screen and (max-width: 980px) { .z_index_about { margin-top: 0; } .z_index_about .circle, .z_index_about .swiper_btn { display: none; } .z_index_about .z_flex_warp { display: block; } .z_index_about .aboutwarp .frcon { margin-top: 30px; } .z_index_about .aboutwarp .frcon .z_desc { margin-bottom: 10px; } .z_index_about .z_ser_swiper li { padding: 12px; padding-bottom: 0; } .z_index_about .z_ser_swiper li .imgbox { transform: translateY(-24px); } .z_index_about .z_ser_swiper li .tit { margin: 10px 0; } .z_index_about .z_ser_swiper li .more { bottom: 24px; font-size: 12px; } } .z_index_map { padding-right: 5.2083333333vw; position: relative; z-index: 1; } .z_index_map .flcon { width: 25.8333333333vw; } @media screen and (max-width: 980px) { .z_index_map .flcon { width: 100%; } } .z_index_map .flcon .z_desc { margin: 3.6458333333vw 0; margin-top: 5.2083333333vw; } @media screen and (max-width: 980px) { .z_index_map .flcon .z_desc { margin-top: 40px; } } .z_index_map .flcon .slgtext { white-space: nowrap; font-size: 3.9583333333vw; line-height: 4.1666666667vw; font-family: DIN; font-weight: bold; color: rgba(145, 145, 145, 0); opacity: 0.5; -webkit-text-stroke: 1px #008FD5; text-stroke: 1px #008FD5; text-transform: uppercase; margin-bottom: 4.6875vw; margin-bottom: 4.6875vw; } @media screen and (max-width: 980px) { .z_index_map .flcon .slgtext { font-size: 30px; } } @media screen and (max-width: 980px) { .z_index_map .flcon .slgtext { line-height: 34px; } } @media screen and (max-width: 980px) { .z_index_map .flcon .slgtext { margin-bottom: 40px; } } .z_index_map .z_about_num ul{ display: flex; } .z_index_map .z_about_num li { float: left; padding: 0 2.6041666667vw; } .z_index_map .z_about_num li:first-child { padding-left: 0; border-right: 1px solid rgba(51, 51, 51, 0.2); } .z_index_map .z_about_num li h3 { display: flex; align-items: flex-start; margin-bottom: 4px; } .z_index_map .z_about_num li h3 .timer { font-size: 2.6041666667vw; line-height: 3.125vw; font-family: DIN; font-weight: bold; color: #F1882F; margin-right: 5px; } @media screen and (max-width: 980px) { .z_index_map .z_about_num li h3 .timer { font-size: 30px; } } @media screen and (max-width: 980px) { .z_index_map .z_about_num li h3 .timer { line-height: 34px; } } .z_index_map .frcon { width: 56.1458333333vw; margin-left: auto; margin-top: 1.5625vw; } @media screen and (max-width: 980px) { .z_index_map .frcon { width: 100%; } } .z_index_map .dot { width: 6.25vw; height: 6.25vw; position: absolute; border-radius: 50%; background: rgba(0, 143, 214, 0.09); z-index: -1; animation: dot 8s linear infinite; transform-origin: 30% 30px; } @media screen and (max-width: 980px) { .z_index_map .dot { width: 40px; height: 40px; } } .z_index_map .dot:nth-child(even) { animation: dot2 8s linear infinite; } .z_index_map .dot.dot1 { right: 17.1875vw; top: 4.1666666667vw; } .z_index_map .dot.dot2 { right: 5.2083333333vw; top: 80%; width: 3.6458333333vw; height: 3.6458333333vw; } @media screen and (max-width: 980px) { .z_index_map .dot.dot2 { width: 20px; height: 0px; } } .z_index_map .dot.dot3 { right: 5.2083333333vw; top: 5.2083333333vw; width: 3.125vw; height: 3.125vw; } @media screen and (max-width: 980px) { .z_index_map .dot.dot3 { width: 20px; height: 0px; } } .z_index_map .dot.dot4 { right: 40%; top: 70%; width: 4.6875vw; height: 4.6875vw; } @media screen and (max-width: 980px) { .z_index_map .dot.dot4 { width: 20px; height: 0px; } } .z_index_map .dot.dot5 { right: 50%; top: 60%; width: 2.0833333333vw; height: 2.0833333333vw; } @media screen and (max-width: 980px) { .z_index_map .dot.dot5 { width: 20px; height: 0px; } } .z_index_map .dot.dot6 { right: 30%; top: 70%; width: 5.2083333333vw; height: 5.2083333333vw; } @media screen and (max-width: 980px) { .z_index_map .dot.dot6 { width: 20px; height: 0px; } } @keyframes dot { to { transform: rotate(1turn) scale(0.8, 0.8); } } @keyframes dot2 { to { transform: rotate(-1turn) scale(1.1, 1.1); } } @media screen and (max-width: 980px) { .z_index_map .flcon .z_desc { margin: 25px 0; } .z_index_map .frcon { margin-top: 50px; } .z_index_map .z_about_num li { width: 50%; } } .z_index_case { overflow: hidden; } .z_index_case .headbar { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 3.6458333333vw; } @media screen and (max-width: 980px) { .z_index_case .headbar { margin-bottom: 35px; } } .z_index_case .z_readmore { padding: 10px 0; display: flex; align-items: center; border-bottom: 1px solid #333333; } .z_index_case .z_readmore img { margin-left: 5px; } .z_index_case .z_readmore:hover { background: #008FD6; color: #fff; padding: 10px; border-bottom: 1px solid #008FD6; } .z_index_case .z_readmore:hover img { filter: invert(100%); } .z_index_case .z_case_nav a { display: inline-block; padding: 0 2.0833333333vw; border-left: 1px solid rgba(51, 51, 51, 0.1); text-align: center; color: #333333; font-size: 0.9375vw; } @media screen and (max-width: 1680px) { .z_index_case .z_case_nav a { font-size: 1.134375vw; } } @media screen and (max-width: 980px) { .z_index_case .z_case_nav a { font-size: 14px; } } .z_index_case .z_case_nav a:first-child { padding-left: 0; border-left: none; } .z_index_case .z_case_nav a .ico { height: 32px; overflow: hidden; margin-bottom: 8px; } @media screen and (max-width: 980px) { .z_index_case .z_case_nav a .ico { height: 24px; } } .z_index_case .z_case_nav a .ico img { display: block; margin: 0 auto; transition: ease 0.5s; } .z_index_case .z_case_nav a.active { color: #005CA1; } .z_index_case .z_case_nav a.active .ico img { transform: translateY(-32px); } .z_index_case .z_case_con { margin-top: 3.125vw; } @media screen and (max-width: 980px) { .z_index_case .z_case_con { margin-top: 20px; } } .z_index_case .z_case_swiper { overflow: hidden; display: none; } .z_index_case .z_case_swiper.active { display: block; } .z_index_case .z_case_swiper li { border-radius: 12px; overflow: hidden; } .z_index_case .z_case_swiper li .imgbox { height: 13.0208333333vw; overflow: hidden; border-radius: 12px 12px 0 0; } @media screen and (max-width: 980px) { .z_index_case .z_case_swiper li .imgbox { height: 50vw; } } .z_index_case .z_case_swiper li .titbox { height: 4.0625vw; line-height: 4.0625vw; background: #fff; transition: ease 1s; text-align: center; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; font-size: 1.1458333333vw; padding: 0 1.9791666667vw; } @media screen and (max-width: 980px) { .z_index_case .z_case_swiper li .titbox { height: 50px; } } @media screen and (max-width: 980px) { .z_index_case .z_case_swiper li .titbox { line-height: 50px; } } @media screen and (max-width: 980px) { .z_index_case .z_case_swiper li .titbox { font-size: 16px; } } .z_index_case .z_case_swiper li:hover .imgbg { transform: scale(1.1, 1.1); } .z_index_case .z_case_swiper li:hover .titbox { background: #008FD6; color: #fff; } .z_index_case .z_case_swiper .swiper_bar { margin-top: 3.125vw; } @media screen and (max-width: 980px) { .z_index_case .z_case_swiper .swiper_bar { margin-top: 20px; } } .z_index_case .z_case_swiper .swiper_dot { width: 100%; height: 2px; background: rgba(51, 51, 51, 0.2); position: relative; margin-bottom: 10px; } .z_index_case .z_case_swiper .swiper_dot .swiper-pagination-progressbar-fill { transform-origin: left top; position: absolute; left: 0; width: 100%; height: 100%; background: #F1882F; } @media screen and (max-width: 980px) { .z_index_case .z_case_nav { white-space: nowrap; overflow-x: auto; padding-bottom: 10px; } .z_index_case .z_case_nav a { padding: 0 15px; } .z_index_case .z_case_nav a .ico img { width: 30px; } .z_index_case .z_case_nav a.active { color: #005CA1; } .z_index_case .z_case_nav a.active .ico img { transform: translateY(-24px); } } .z_index_news { padding-top: 3.6458333333vw; padding-bottom: 3.6458333333vw; } .z_index_news .headbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 3.125vw; } @media screen and (max-width: 980px) { .z_index_news .headbar { margin-bottom: 30px; } } .z_index_news .z_news_swiper { width: 56.5%; overflow: hidden; } @media screen and (max-width: 980px) { .z_index_news .z_news_swiper { width: 100%; } } .z_index_news .z_news_swiper li { padding: 0 6px 6px 6px; background: #fff; } .z_index_news .z_news_swiper li a { display: block; box-shadow: 0px 3px 6px 0px rgba(0, 47, 110, 0.1); width: 100%; height: 100%; } .z_index_news .z_news_swiper li:hover .imgbg { transform: scale(1.1, 1.1); } .z_index_news .z_news_swiper li:hover .infobox { background: #008FD6; color: #fff; } .z_index_news .z_news_swiper li:hover .infobox .desc { color: #fff; } .z_index_news .z_news_swiper li:hover .more { border-color: rgba(255, 255, 255, 0.54); } .z_index_news .z_news_swiper .imgbox { height: 12.65625vw; } @media screen and (max-width: 980px) { .z_index_news .z_news_swiper .imgbox { height: 50vw; } } .z_index_news .z_news_swiper .infobox { padding: 15px 10px; padding-bottom: 0; transition: ease 1s; } .z_index_news .z_news_swiper .infobox .tit { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; font-size: 1.1458333333vw; } @media screen and (max-width: 980px) { .z_index_news .z_news_swiper .infobox .tit { font-size: 16px; } } .z_index_news .z_news_swiper .infobox .desc { color: #666666; line-height: 24px; height: 48px; margin: 10px 0; transition: ease 1s; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; margin-bottom: 2.0833333333vw; } @media screen and (max-width: 980px) { .z_index_news .z_news_swiper .infobox .desc { margin-bottom: 20px; } } .z_index_news .z_news_swiper .infobox .more { display: flex; align-items: center; justify-content: space-between; border-top: 1px solid rgba(51, 51, 51, 0.2); height: 3.125vw; } @media screen and (max-width: 980px) { .z_index_news .z_news_swiper .infobox .more { height: 50px; } } .z_index_news .z_index_video { width: 40%; margin-left: auto; padding-bottom: 6px; cursor: pointer; } @media screen and (max-width: 980px) { .z_index_news .z_index_video { width: 100%; } } .z_index_news .z_index_video .imgbox { height: 17.1875vw; position: relative; } @media screen and (max-width: 980px) { .z_index_news .z_index_video .imgbox { height: 50vw; } } .z_index_news .z_index_video .imgbox .playico { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .z_index_news .z_index_video .imgbox .playico img { display: block; width: 2.8645833333vw; } @media screen and (max-width: 980px) { .z_index_news .z_index_video .imgbox .playico img { width: 40px; } } .z_index_news .z_index_video .infobox { padding: 10px 20px; height: calc(100% - 17.1875vw); display: flex; align-items: center; justify-content: center; justify-content: flex-start; background: #008FD6; color: #fff; font-size: 1.1458333333vw; line-height: 1.7708333333vw; } @media screen and (max-width: 980px) { .z_index_news .z_index_video .infobox { font-size: 16px; } } @media screen and (max-width: 980px) { .z_index_news .z_index_video .infobox { line-height: 28px; } } .z_index_news .z_index_video .infobox .desc { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } @media screen and (max-width: 980px) { .z_index_news .z_news_swiper { margin-bottom: 30px; } } .swiper_btn { display: flex; align-items: center; position: relative; z-index: 1; } .swiper_btn .btn { outline: none; cursor: pointer; position: relative; width: 3.9583333333vw; height: 3.9583333333vw; border: 1px solid rgba(51, 51, 51, 0.6); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-left: 1.5625vw; transition: ease 1s; color: #fff; } @media screen and (max-width: 980px) { .swiper_btn .btn { width: 40px; height: 40px; } } .swiper_btn .btn .iconfont { font-size: 16px; } .swiper_btn .btn::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transform: translate(-50%, -50%) scale(0.4, 0.4); transition: transform 1s; border-radius: 50%; background: #008FD6; } .swiper_btn .btn.disabled { color: #333; } .swiper_btn .btn.disabled::before { transform: translate(-50%, -50%) scale(0, 0); } .swiper_btn .btn:hover { border-color: #008FD6; color: #fff; } .swiper_btn .btn:hover::before { transform: translate(-50%, -50%) scale(0.9, 0.9); } @media screen and (max-width: 980px) { .swiper_btn .btn::before { transform: translate(-50%, -50%) scale(1, 1) !important; } .swiper_btn .btn { border-color: #008FD6 !important; color: #fff !important; } } .z_hz_swiper { height: 18.2291666667vw; overflow: hidden; margin-top: 3.125vw; padding-bottom: 10px; } @media screen and (max-width: 980px) { .z_hz_swiper { height: 220px; } } @media screen and (max-width: 980px) { .z_hz_swiper { margin-top: 30px; } } .z_hz_swiper li { height: calc((100% - 40px) / 3); position: relative; background: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.1); padding: 1.5625vw; } .z_hz_swiper li a { display: block; } .z_hz_swiper li img { transition: ease 1s; max-height: 100%; display: block; } .z_hz_swiper li:hover img { transform: scale(1.1, 1.1); } .z_hz_dot { display: flex; align-items: center; justify-content: center; margin-top: 3.125vw; } @media screen and (max-width: 980px) { .z_hz_dot { margin-top: 30px; } } .z_hz_dot span { display: block; width: 8px; height: 8px; background: #B9B9B9; border-radius: 50%; transition: ease 1s; cursor: pointer; outline: none; margin: 0 5px; } .z_hz_dot span.on { background: #008FD6; } @media screen and (max-width: 980px) { .z_hz_dot .z_news_swiper { margin-bottom: 30px; } .z_hz_dot .z_news_swiper li { height: calc((100% - 20px) / 3); } } .z_footer { padding-top: 0; padding-bottom: 0; } .z_footer .topwarp { display: flex; align-items: center; justify-content: space-between; padding: 3.125vw 0; } .z_footer .flcon li > a { font-weight: bold; } .z_footer .logo img { display: block; height: 2.6041666667vw; } @media screen and (max-width: 980px) { .z_footer .logo img { height: 30px; } } .z_footer .z_search { display: flex; align-items: center; } .z_footer .z_search .text { width: 22.3958333333vw; height: 3.0208333333vw; background: #F4F4F4; padding: 0 20px; } @media screen and (max-width: 980px) { .z_footer .z_search .text { width: 100%; height: 40px; } } .z_footer .z_search .sou { display: flex; align-items: center; justify-content: center; min-width: 7.03125vw; padding: 0 20px; height: 3.0208333333vw; background: #333333; color: #fff; font-size: 0.8333333333vw; flex-shrink: 0; } @media screen and (max-width: 980px) { .z_footer .z_search .sou { height: 40px; } } @media screen and (max-width: 1680px) { .z_footer .z_search .sou { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_footer .z_search .sou { font-size: 14px; } } .z_footer .z_search .sou:hover { background: #F1882F; } .z_footer .z_flex_warp { border-top: 1px solid rgba(51, 51, 51, 0.2); border-bottom: 1px solid rgba(51, 51, 51, 0.2); } .z_footer .flcon { width: 62%; border-right: 1px solid rgba(51, 51, 51, 0.2); padding-top: 3.90625vw; } @media screen and (max-width: 980px) { .z_footer .flcon { width: 100%; } } .z_footer .flcon ul { display: flex; } .z_footer .flcon ul li { flex: 1; } .z_footer .flcon a { display: block; font-size: 0.8333333333vw; font-weight: 400; opacity: 0.9; } @media screen and (max-width: 1680px) { .z_footer .flcon a { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_footer .flcon a { font-size: 14px; } } .z_footer .flcon a:hover { color: #008FD6; opacity: 1; } .z_footer .flcon .downnav { margin-top: 1.3020833333vw; } @media screen and (max-width: 980px) { .z_footer .flcon .downnav { margin-top: 10px; } } .z_footer .flcon .downnav a { font-size: 14px; font-weight: 400; line-height: 30px; opacity: 0.6; } .z_footer .frcon { width: 38%; padding: 3.90625vw; padding-bottom: 1.5625vw; padding-right: 0; } @media screen and (max-width: 980px) { .z_footer .frcon { width: 100%; } } .z_footer .z_dz_nav a { display: inline-block; font-size: 0.8333333333vw; font-weight: bold; opacity: 0.4; margin-right: 3.6458333333vw; margin-right: 2.0vw; } @media screen and (max-width: 1680px) { .z_footer .z_dz_nav a { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_footer .z_dz_nav a { font-size: 14px; } } @media screen and (max-width: 980px) { .z_footer .z_dz_nav a { margin-right: 20px; } } .z_footer .z_dz_nav a.active { opacity: 1; text-decoration: underline; } .z_footer .z_dz_con { margin-top: 1.3020833333vw; font-size: 14px; font-weight: 400; color: rgba(51, 51, 51, 0.6); line-height: 30px; } @media screen and (max-width: 980px) { .z_footer .z_dz_con { margin-top: 20px; } } .z_footer .z_dz_con .itembox { display: none; } .z_footer .z_dz_con .itembox.active { display: block; } .z_footer .z_dz_con .tel { font-size: 1.1979166667vw; font-family: DIN; font-weight: bold; } @media screen and (max-width: 980px) { .z_footer .z_dz_con .tel { font-size: 18px; } } .z_footer .codeli { margin-top: 3.90625vw; } @media screen and (max-width: 980px) { .z_footer .codeli { margin-top: 20px; } } .z_footer .codeli li { display: flex; align-items: flex-end; } .z_footer .codeli li .img { display: block; height: 5.7291666667vw; margin-right: 10px; width: auto; } @media screen and (max-width: 980px) { .z_footer .codeli li .img { height: 80px; } } .z_footer .btmwarp { display: flex; justify-content: space-between; padding: 2.0833333333vw 0; color: rgba(51, 51, 51, 0.6); line-height: 24px; } .z_footer .btmwarp a { color: rgba(51, 51, 51, 0.6); } .z_footer .btmwarp a:hover { color: #F1882F; } @media screen and (max-width: 980px) { .z_footer { padding: 0 12px !important; } .z_footer .topwarp { padding: 20px 0; } .z_footer .z_search { width: 100%; } .z_footer .logo { display: none; } .z_footer .flcon { display: none; } .z_footer .z_dz_con { line-height: 24px; } .z_footer .frcon { padding: 20px 0; } .z_footer .btmwarp { display: block; text-align: center; } } .z_other_banner { width: 100%; position: relative; overflow: hidden; height: 30.7291666667vw; } @media screen and (max-width: 980px) { .z_other_banner { height: 50vw; } } .z_other_banner .bg { display: block; width: 100%; animation: zoom 3s linear forwards; position: relative; } .z_other_banner .bg::before { position: absolute; left: 0; top: 0%; background: rgba(51, 51, 51, 0.2); } .z_other_banner .z_text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); top: calc(50% + 1.0416666667vw); color: #fff; z-index: 1; text-align: center; font-size: 1.875vw; line-height: 2.6041666667vw; font-weight: bold; } @media screen and (max-width: 980px) { .z_other_banner .z_text { font-size: 16px; } } @media screen and (max-width: 980px) { .z_other_banner .z_text { line-height: 28px; } } .z_other_banner .z_text .h3 { animation: fadeInUp 1s linear forwards; } @keyframes zoom { 0% { transform: scale(1.2, 1.2); } 100% { transform: scale(1, 1); } } @media screen and (max-width: 980px) { .z_other_banner { margin-top: 50px; } .z_other_banner .z_text { width: 100%; } } .z_about_warp { padding: 4.6875vw 8.3333333333vw 0 8.3333333333vw; } .z_about_warp .flcon, .z_about_warp .frcon { width: 50%; padding-bottom: 8.3333333333vw; position: relative; } @media screen and (max-width: 980px) { .z_about_warp .flcon, .z_about_warp .frcon { width: 100%; } } .z_about_warp .flcon { border-right: 1px solid rgba(0, 143, 214, 0.2); } .z_about_warp .flcon .entit { font-size: 7.8125vw; font-family: DIN; font-weight: bold; color: #008FD6; text-align: center; background: linear-gradient(0deg, #0079D6 0%, #14BFEA 99.6337890625%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin-bottom: 8.3333333333vw; } @media screen and (max-width: 980px) { .z_about_warp .flcon .entit { font-size: 50px; } } @media screen and (max-width: 980px) { .z_about_warp .flcon .entit { margin-bottom: 50px; } } .z_about_warp .flcon ul { display: flex; } .z_about_warp .flcon li { flex: 1; display: flex; align-items: flex-end; justify-content: center; } .z_about_warp .flcon li .info { color: #008FD6; font-size: 1.25vw; font-family: DIN; font-weight: bold; display: flex; align-items: flex-end; min-width: 5.2083333333vw; flex-shrink: 0; text-align: center; margin-left: 1vw; } @media screen and (max-width: 980px) { .z_about_warp .flcon li .info { font-size: 14px; } } .z_about_warp .flcon li .timer { font-size: 3.125vw; line-height: 2.8645833333vw; } @media screen and (max-width: 980px) { .z_about_warp .flcon li .timer { font-size: 30px; } } @media screen and (max-width: 980px) { .z_about_warp .flcon li .timer { line-height: 30px; } } .z_about_warp .frcon { padding-left: 4.6875vw; display: flex; flex-flow: column; justify-content: space-between; } .z_about_warp .frcon::before { width: 8px; height: 8px; background: #008FD6; border-radius: 50%; position: absolute; left: 0; top: 0; margin-left: -4px; z-index: 1; } .z_about_warp .frcon::after { width: 1px; height: 0%; transition: ease 5s; position: absolute; left: 0; top: 0; z-index: 1; background: #008FD6; margin-left: -1px; animation-delay: 0.5s; } .z_about_warp .frcon.animated::after { height: 100%; } .z_about_warp .frcon .z_desc { font-size: 0.8333333333vw; font-weight: 400; color: #666666; line-height: 1.5625vw; margin-top: 2.6041666667vw; } @media screen and (max-width: 1680px) { .z_about_warp .frcon .z_desc { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_about_warp .frcon .z_desc { font-size: 14px; } } @media screen and (max-width: 1680px) { .z_about_warp .frcon .z_desc { line-height: 1.8125vw; } } @media screen and (max-width: 980px) { .z_about_warp .frcon .z_desc { line-height: 24px; } } @media screen and (max-width: 980px) { .z_about_warp .frcon .z_desc { margin-top: 20px; } } @media screen and (max-width: 980px) { .z_about_warp { padding: 35px 12px; } .z_about_warp .flcon { border: none; } .z_about_warp .frcon { padding: 0; } .z_about_warp .frcon::before, .z_about_warp .frcon::after { display: none; } } .z_about_wh .flcon, .z_about_wh .frcon { width: 50%; height: 41.6666666667vw; position: relative; display: flex; align-items: center; justify-content: center; } @media screen and (max-width: 980px) { .z_about_wh .flcon, .z_about_wh .frcon { width: 100%; } } @media screen and (max-width: 980px) { .z_about_wh .flcon, .z_about_wh .frcon { height: auto; } } .z_about_wh .flcon .z_index_tit { position: absolute; left: 8.3333333333vw; top: 5.2083333333vw; } .z_about_wh .z_white_box { width: 24.21875vw; height: 24.21875vw; border-radius: 50%; overflow: hidden; border: 14px solid rgba(255, 255, 255, 0.37); } @media screen and (max-width: 980px) { .z_about_wh .z_white_box { width: 80vw; height: 80vw; } } .z_about_wh .z_wh_swiper { width: 100%; height: 100%; border-radius: 50%; overflow: hidden; background: #fff; } .z_about_wh .z_wh_swiper li { display: flex; align-items: center; justify-content: center; padding: 3.6458333333vw; text-align: center; } .z_about_wh .z_wh_swiper li h3 { font-size: 1.3541666667vw; } @media screen and (max-width: 980px) { .z_about_wh .z_wh_swiper li h3 { font-size: 14px; } } .z_about_wh .z_wh_swiper li .line { width: 36px; height: 5px; background: #F39800; margin: 0 auto; margin-top: 1.0416666667vw; margin-bottom: 2.0833333333vw; } @media screen and (max-width: 980px) { .z_about_wh .z_wh_swiper li .line { margin-top: 10px; } } @media screen and (max-width: 980px) { .z_about_wh .z_wh_swiper li .line { margin-bottom: 20px; } } .z_about_wh .z_wh_swiper li .desc { max-height: 9.375vw; overflow-y: auto; font-size: 0.8333333333vw; line-height: 1.4583333333vw; } @media screen and (max-width: 1680px) { .z_about_wh .z_wh_swiper li .desc { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_about_wh .z_wh_swiper li .desc { font-size: 14px; } } @media screen and (max-width: 1680px) { .z_about_wh .z_wh_swiper li .desc { line-height: 1.6916666667vw; } } @media screen and (max-width: 980px) { .z_about_wh .z_wh_swiper li .desc { line-height: 24px; } } .z_about_wh .frcon { justify-content: flex-start; } .z_about_wh .frcon li { background: rgba(255, 255, 255, 0.08); width: 38.2291666667vw; height: 6.7708333333vw; border-bottom: 1px solid rgba(255, 255, 255, 0.1); padding: 0 2.34375vw; display: flex; align-items: center; cursor: pointer; color: #fff; font-size: 1.25vw; position: relative; z-index: 1; } @media screen and (max-width: 980px) { .z_about_wh .frcon li { width: 100%; height: 60px; } } @media screen and (max-width: 980px) { .z_about_wh .frcon li { font-size: 16px; } } .z_about_wh .frcon li:last-child { border-bottom: none; } .z_about_wh .frcon li .num { font-size: 2.6041666667vw; font-family: Montserrat; font-weight: bold; color: #FFFFFF; opacity: 0.32; margin-right: 2.34375vw; transition: color 1s; } @media screen and (max-width: 980px) { .z_about_wh .frcon li .num { font-size: 16px; } } @media screen and (max-width: 980px) { .z_about_wh .frcon li .num { margin-right: 10px; } } .z_about_wh .frcon li::before { width: calc(100% + 3.4375vw); background: url(../img/bg6.png) no-repeat center; background-size: cover; z-index: -1; border-radius: 6px 0px 0px 6px; left: -3.4375vw; clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); transform: translateX(3.4375vw); } .z_about_wh .frcon li.active { color: #333; } .z_about_wh .frcon li.active .num { background: linear-gradient(0deg, #F39800 80%, #f8d79f 20%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .z_about_wh .frcon li.active::before { transform: translateX(0); clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 100%); } @media screen and (max-width: 980px) { .z_about_wh .flcon { padding: 35px 12px; padding-top: 70px; } .z_about_wh .flcon .z_index_tit { left: 12px; top: 20px; margin-bottom: 30px; } .z_about_wh .z_wh_swiper li .desc { max-height: 36vw; } .z_about_wh .frcon { height: auto; } .z_about_wh .frcon ul { width: 100%; } .z_about_wh .frcon ul li:before { width: 100%; transform: translateX(0); left: 0; } } .z_about_process .z_year_warp { width: 100%; position: relative; } .z_about_process .z_year_warp::before { width: 200vw; height: 1px; background: #d5d5d5; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1; } @media screen and (max-width: 980px) { .z_about_process .z_year_warp::before { width: 100%; } } .z_year_swiper { margin-top: 3.125vw; height: 10.4166666667vw; width: 100%; margin: 0 auto; position: relative; overflow: hidden; margin-bottom: 4.1666666667vw; } @media screen and (max-width: 980px) { .z_year_swiper { margin-top: 30px; } } @media screen and (max-width: 980px) { .z_year_swiper { height: 80px; } } @media screen and (max-width: 980px) { .z_year_swiper { margin-bottom: 30px; } } .z_year_swiper li { display: flex; align-items: center; justify-content: center; width: auto; } .z_year_swiper li span { display: block; font-family: DIN; padding-top: 3.125vw; position: relative; color: #B3B3B3; font-size: 0.8333333333vw; } @media screen and (max-width: 1680px) { .z_year_swiper li span { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_year_swiper li span { font-size: 14px; } } .z_year_swiper li span::before { width: 10px; height: 10px; background: #008FD6; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0.4; } .z_year_swiper .swiper-slide-active { justify-content: center !important; text-align: center; } .z_year_swiper .swiper-slide-active span { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 6.7708333333vw; margin-top: -0.3645833333vw; padding-top: 0; font-weight: bold; color: #008FD6; background: linear-gradient(0deg, #0079D6 23.4375%, #14BFEA 99.6337890625%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; padding-left: 1.0416666667vw; z-index: 2; } @media screen and (max-width: 980px) { .z_year_swiper .swiper-slide-active span { font-size: 40px; } } .z_year_swiper .swiper-slide-active span::before { width: 10px; height: 10px; background: #008FD6; border-radius: 50%; position: absolute; top: 50%; transform: translateY(-50%); margin-top: 0.3645833333vw; left: 0; } .z_year_swiper .swiper-slide-prev { justify-content: flex-start !important; } .z_year_swiper .swiper-slide-next { justify-content: flex-end !important; } .z_year_swiper .btn { outline: none; cursor: pointer; position: relative; width: 3.9583333333vw; height: 3.9583333333vw; border: 1px solid rgba(51, 51, 51, 0.6); border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: ease 1s; position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; color: #fff; } @media screen and (max-width: 980px) { .z_year_swiper .btn { width: 40px; height: 40px; } } .z_year_swiper .btn .iconfont { font-size: 18px; } .z_year_swiper .btn::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transform: translate(-50%, -50%) scale(0.5, 0.5); transition: transform 1s; border-radius: 50%; background: #008FD6; } .z_year_swiper .btn:hover { border-color: #008FD6; color: #fff; } .z_year_swiper .btn:hover::before { transform: translate(-50%, -50%) scale(0.9, 0.9); } .z_year_swiper .btn.prev { left: 0; } .z_year_swiper .btn.next { right: 0; } @media screen and (max-width: 980px) { .z_year_swiper li { opacity: 0; } .z_year_swiper li.swiper-slide-active { opacity: 1; } .z_year_swiper li.swiper-slide-active span { padding-left: 10px; } } .z_year_con { overflow: hidden; } .z_year_con li { display: flex; align-items: center; } .z_year_con .imgbox { width: 39.7916666667vw; height: 21.5625vw; } @media screen and (max-width: 980px) { .z_year_con .imgbox { width: 100%; height: 50vw; } } .z_year_con .infobox { width: 31.25vw; max-height: 21.5625vw; overflow-y: auto; font-size: 0.9375vw; margin-left: 5.7291666667vw; line-height: 30px; } @media screen and (max-width: 980px) { .z_year_con .infobox { width: 100%; } } @media screen and (max-width: 1680px) { .z_year_con .infobox { font-size: 1.134375vw; } } @media screen and (max-width: 980px) { .z_year_con .infobox { font-size: 14px; } } @media screen and (max-width: 980px) { .z_year_con li { display: block; } .z_year_con li .infobox { max-height: none; margin-top: 20px; line-height: 24px; margin-left: 0; } } .z_about_honor { background: linear-gradient(-5deg, rgba(0, 170, 255, 0.1), rgba(233, 239, 242, 0.1)); padding: 1.5625vw 0; padding-bottom: 5.2083333333vw; position: relative; border-top: 10px solid #F1882F; overflow: hidden; } .z_about_honor .z_index_tit { position: absolute; left: 0; top: 0%; top: 4.6875vw; left: 8.3333333333vw; } @media screen and (max-width: 980px) { .z_about_honor { padding: 35px 12px; } .z_about_honor .z_index_tit { position: relative; left: auto; top: auto; } } .z_honor_warp { display: none; width: 62.5vw; height: 39.5833333333vw; position: relative; background: url(../img/cir3.png) no-repeat center; background-size: auto 100%; margin: 0 auto; } .z_honor_warp.active { display: block; } @media screen and (max-width: 980px) { .z_honor_warp { width: 100%; height: 100vw; } } .z_honor_warp .swiper_btn .btn { margin: 0; position: absolute; bottom: 1.5625vw; z-index: 2; color: #fff; } .z_honor_warp .swiper_btn .btn.prev { left: 0; } .z_honor_warp .swiper_btn .btn.next { right: 0; } .z_honor_warp .swiper_btn .btn::before { transform: translate(-50%, -50%) scale(0.5, 0.5); } .z_about_process { overflow: hidden; } .z_honor_big { height: 100%; overflow: hidden; } .z_honor_big li { display: flex; align-items: center; justify-content: center; position: relative; } .z_honor_big li .imgbox { height: 19.2708333333vw; } @media screen and (max-width: 980px) { .z_honor_big li .imgbox { height: 54vw; } } .z_honor_big li img { display: block; max-height: 100%; } .z_honor_big li .infobox { position: absolute; top: 50%; transform: translateY(-50%); left: 0; } .z_honor_big li .infobox .line { width: 52px; height: 5px; background: #008FD6; } .z_honor_big li .infobox .tit { margin-top: 10px; font-size: 1.1458333333vw; font-weight: bold; } @media screen and (max-width: 980px) { .z_honor_big li .infobox .tit { font-size: 14px; } } .z_honor_small { position: absolute; bottom: -2.0833333333vw; width: 80%; left: 10%; overflow: hidden; } .z_honor_small li { cursor: pointer; text-align: center; } .z_honor_small .imgbox { height: 8.3333333333vw; display: flex; align-items: center; justify-content: center; margin-bottom: 8px; } @media screen and (max-width: 980px) { .z_honor_small .imgbox { height: 80px; } } .z_honor_small .imgbox img { display: block; max-width: 100%; max-height: 100%; transition: border 1s; border: 2px solid transparent; } .z_honor_small h3 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; height: 20px; line-height: 20px; } .z_honor_small .swiper-slide-thumb-active .imgbox img { border-color: #008FD6; } .z_honor_nav { position: absolute; top: 50%; transform: translateY(-50%); left: 8.3333333333vw; width: 5.2083333333vw; border-radius: 50px; background: linear-gradient(to bottom, #689edc, #9ed2fa); padding: 10px; } @media screen and (max-width: 980px) { .z_honor_nav { width: 50px; } } .z_honor_nav li { display: flex; align-items: center; justify-content: center; min-height: 6.25vw; padding: 12px 0; color: #fff; border-radius: 2.0833333333vw; font-size: 0.8333333333vw; transition: ease 1s; cursor: pointer; } @media screen and (max-width: 1680px) { .z_honor_nav li { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_honor_nav li { font-size: 14px; } } .z_honor_nav li.active { background: #fff; color: #008FD6; } .z_service_page { padding-top: 3.125vw; padding-bottom: 3.125vw; } .z_service_page .z_index_tit { margin-bottom: 2.6041666667vw; } @media screen and (max-width: 980px) { .z_service_page .z_index_tit { margin-bottom: 30px; } } .z_service_page li { width: 100%; position: relative; overflow: hidden; margin-bottom: 2.0833333333vw; } @media screen and (max-width: 980px) { .z_service_page li { margin-bottom: 20px; } } .z_service_page li .imgbox { height: 29.6875vw; position: relative; } @media screen and (max-width: 980px) { .z_service_page li .imgbox { height: 50vw; } } .z_service_page li.animated .imgbox::before { transform: translateX(-100%); opacity: 0; } .z_service_page li .infobox { position: absolute; left: 0; top: 0%; color: #fff; padding: 3.125vw; max-width: 34.8958333333vw; z-index: 1; } .z_service_page li:hover .imgbg { transform: scale(1.1, 1.1); } .z_service_page .ico { height: 28px; height: 28px; overflow: hidden; } @media screen and (max-width: 980px) { .z_service_page .ico { height: 22px; } } .z_service_page .ico img { display: block; height: 100%; filter: drop-shadow(0px 28px #fff); transform: translateY(-28px); } @media screen and (max-width: 980px) { .z_service_page .ico img { filter: drop-shadow(0px 22px #fff); transform: translateY(-22px); } } .z_service_page .tit { font-size: 1.0416666667vw; font-weight: bold; margin: 1.0416666667vw 0; } @media screen and (max-width: 980px) { .z_service_page .tit { font-size: 16px; } } .z_service_page .line { width: 37px; height: 4px; background: #F1882F; margin-bottom: 1.0416666667vw; } @media screen and (max-width: 980px) { .z_service_page .line { margin-bottom: 15px; } } .z_service_page .desc { line-height: 26px; max-height: 15.625vw; overflow-y: auto; } @media screen and (max-width: 980px) { .z_service_page li .infobox { position: relative; color: #333; max-width: none; width: 100%; padding: 0; margin-top: 20px; } .z_service_page li .desc { max-height: none; line-height: 24px; } .z_service_page li .line { width: 20px; height: 2px; margin: 20px 0; } .z_service_page li .ico { margin-bottom: 10px; } .z_service_page li .ico img { transform: translateY(0) !important; } } .z_case_page { padding-top: 3.125vw; padding-bottom: 3.125vw; } .z_case_page .z_load_more { margin-top: 2.0833333333vw; } @media screen and (max-width: 980px) { .z_case_page .z_load_more { margin-top: 20px; } } .z_case_list ul { margin-left: -0.7%; } .z_case_list li { width: 32.6%; margin-left: 0.7%; overflow: hidden; position: relative; margin-bottom: 0.5208333333vw; margin-bottom: 0.5208333333vw; } @media screen and (max-width: 980px) { .z_case_list li { width: 100%; } } @media screen and (max-width: 980px) { .z_case_list li { margin-bottom: 10px; } } .z_case_list li:hover .more { transform: translate(-50%, -50%) scale(1, 1); } .z_case_list li:hover .imgbg { transform: scale(1.1, 1.1); } .z_case_list li .tit { position: absolute; left: 0; bottom: 0%; width: 100%; padding: 0 20px; bottom: 20px; color: #fff; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; z-index: 1; font-size: 0.8333333333vw; } @media screen and (max-width: 1680px) { .z_case_list li .tit { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_case_list li .tit { font-size: 14px; } } .z_case_list li .imgbox { height: 16.3541666667vw; position: relative; } @media screen and (max-width: 980px) { .z_case_list li .imgbox { height: 54vw; } } .z_case_list li .imgbox::before { position: absolute; left: 0; top: 0%; background: url(../img/ask.png) no-repeat bottom center; background-size: 100% auto; z-index: 1; } .z_case_list .more { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 5.3125vw; height: 5.3125vw; background: #008FD6; color: #fff; display: flex; align-items: center; justify-content: center; border-radius: 50%; text-transform: uppercase; font-size: 0.9375vw; transition: transform 1s; transform: translate(-50%, -50%) scale(0, 0); } @media screen and (max-width: 980px) { .z_case_list .more { width: 50px; height: 50px; } } @media screen and (max-width: 1680px) { .z_case_list .more { font-size: 1.134375vw; } } @media screen and (max-width: 980px) { .z_case_list .more { font-size: 14px; } } .z_case_class { margin-top: 20px; margin-bottom: 2.6041666667vw; } @media screen and (max-width: 980px) { .z_case_class { margin-bottom: 30px; } } .z_case_class dl { border-bottom: 1px solid #DEDEDE; padding: 1.0416666667vw 0; display: flex; align-items: flex-start; line-height: 30px; padding-bottom: 0; } .z_case_class .tit { min-width: 100px; flex-shrink: 0; display: flex; align-items: center; } .z_case_class .tit .iconfont { transform: scale(0.6, 0.6); display: inline-block; margin-left: 10px; } .z_case_class a { display: inline-block; height: 30px; border-radius: 15px; padding: 0 16px; color: #888888; margin-bottom: 1.0416666667vw; vertical-align: top; } .z_case_class a:hover, .z_case_class a.active { background: #008FD6; color: #fff; } @media screen and (max-width: 980px) { .z_case_class dl { padding: 10px 0; padding-bottom: 0; display: block; } .z_case_class dl:nth-child(2) .tit { display: none; } .z_case_class dl .tit { margin-bottom: 20px; } .z_case_class a { padding: 0 8px; margin-bottom: 8px; } } .z_load_more { text-align: center; font-size: 0.8333333333vw; } @media screen and (max-width: 1680px) { .z_load_more { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_load_more { font-size: 14px; } } .z_load_more .ico { display: block; margin: 0 auto; animation: cir 2s linear infinite; margin-top: 10px; } .z_case_head { padding: 5.2083333333vw 8.3333333333vw; margin-top: 3.125vw; padding-bottom: 4.6875vw; } @media screen and (max-width: 980px) { .z_case_head { margin-top: 50px; } } .z_case_head .xqbar { display: flex; align-items: center; justify-content: center; justify-content: space-between; margin-bottom: 2.6041666667vw; } @media screen and (max-width: 980px) { .z_case_head .xqbar { margin-bottom: 30px; } } .z_case_head .z_back { display: flex; align-items: center; justify-content: center; min-width: 7.5vw; padding: 0 14px; height: 2.1875vw; border: 1px solid #000000; box-sizing: border-box; border-radius: 1.09375vw; font-size: 0.8333333333vw; color: #666666; } @media screen and (max-width: 980px) { .z_case_head .z_back { height: 35px; } } @media screen and (max-width: 1680px) { .z_case_head .z_back { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_case_head .z_back { font-size: 14px; } } .z_case_head .z_back .iconfont { font-size: 12px; margin-left: 10px; } .z_case_head .z_back:hover { background: #008FD6; color: #fff; border-color: #008FD6; } .z_case_head .topbtmbar { display: flex; align-items: center; justify-content: center; } .z_case_head .topbtmbar a { display: flex; align-items: center; justify-content: center; font-size: 0.8333333333vw; color: #666666; text-transform: uppercase; margin-left: 3.125vw; } @media screen and (max-width: 1680px) { .z_case_head .topbtmbar a { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_case_head .topbtmbar a { font-size: 14px; } } .z_case_head .topbtmbar a:hover { color: #008FD6; } .z_case_head .topbtmbar a:hover .iconfont { color: #008FD6; } .z_case_head .topbtmbar .iconfont { margin-right: 10px; color: #333; } @media screen and (max-width: 980px) { .z_case_head { padding: 35px 12px; } .z_case_head .z_back { border-radius: 16px; } } .z_casexq_swiper { overflow: hidden; width: 40.1041666667vw; } @media screen and (max-width: 980px) { .z_casexq_swiper { width: 100%; } } .z_casexq_swiper .imgbox { height: 23.9583333333vw; } @media screen and (max-width: 980px) { .z_casexq_swiper .imgbox { height: 54vw; } } .z_cases_btn { position: relative; display: block; margin-left: auto; } .z_cases_btn .btn { margin: 0; color: #fff; position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; } .z_cases_btn .btn.prev { left: -5.9375vw; } .z_cases_btn .btn.next { right: -5.9375vw; } .z_cases_btn .btn::before { transform: translate(-50%, -50%) scale(0.4, 0.4); } @media screen and (max-width: 980px) { .z_cases_btn .btn.prev { left: 0; } .z_cases_btn .btn.next { right: 0; } .z_cases_btn .btn::before { transform: translate(-50%, -50%) scale(1, 1); } } .z_case_info { width: 27.0833333333vw; margin-top: 1.5625vw; justify-content: space-between; } @media screen and (max-width: 980px) { .z_case_info { width: 100%; } } @media screen and (max-width: 980px) { .z_case_info { margin-top: 30px; } } .z_case_info .flcon { margin-bottom: 3.125vw; } @media screen and (max-width: 980px) { .z_case_info .flcon { margin-bottom: 30px; } } .z_case_info .hy { font-size: 1.25vw; margin-bottom: 0.5208333333vw; } @media screen and (max-width: 980px) { .z_case_info .hy { font-size: 16px; } } @media screen and (max-width: 980px) { .z_case_info .hy { margin-bottom: 0px; } } .z_case_info .tit { font-size: 24px; font-size: 1.25vw; line-height: 1.6666666667vw; } @media screen and (max-width: 980px) { .z_case_info .tit { font-size: 16px; } } @media screen and (max-width: 980px) { .z_case_info .tit { line-height: 24px; } } .z_case_info .time { font-size: 0.9375vw; font-family: DIN; font-weight: 500; color: #979797; margin-top: 0.5208333333vw; } @media screen and (max-width: 1680px) { .z_case_info .time { font-size: 1.134375vw; } } @media screen and (max-width: 980px) { .z_case_info .time { font-size: 16px; } } @media screen and (max-width: 980px) { .z_case_info .time { margin-top: 10px; } } .z_case_info .frcon { font-size: 0.8333333333vw; font-weight: 400; color: #666666; line-height: 1.875vw; } @media screen and (max-width: 1680px) { .z_case_info .frcon { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_case_info .frcon { font-size: 14px; } } @media screen and (max-width: 980px) { .z_case_info .frcon { line-height: 24px; } } .z_xg_warp { background: #F2F2F2; padding-top: 0; } .z_xg_warp .xgtit { font-size: 1.25vw; padding: 2.6041666667vw 0; font-weight: bold; } @media screen and (max-width: 980px) { .z_xg_warp .xgtit { font-size: 18px; } } .z_js_class { padding-top: 3.125vw; padding-bottom: 2.0833333333vw; } .z_js_warp { position: relative; } .z_js_warp .wowbox { position: absolute; top: 50%; transform: translateY(-50%); left: 0; z-index: 1; } @media screen and (max-width: 980px) { .z_js_warp .wowbox { position: relative; left: auto; top: auto; transform: translate(0); margin-top: 30px; } } .z_js_swiper { width: 31.0416666667vw; overflow: hidden; } @media screen and (max-width: 980px) { .z_js_swiper { width: 100%; } } .z_js_swiper li { position: relative; } .z_js_swiper .imgbox { height: 21.1979166667vw; position: relative; position: relative; } @media screen and (max-width: 980px) { .z_js_swiper .imgbox { height: 60vw; } } .z_js_swiper .imgbox::before { position: absolute; left: 0; top: 0%; background: url(../img/ask.png) no-repeat bottom center; background-size: 100% auto; z-index: 1; } .z_js_swiper .infobox { position: absolute; left: 0; bottom: 0%; z-index: 1; padding: 1.8229166667vw; box-sizing: border-box; color: #fff; } .z_js_swiper .infobox .tit { font-size: 1.25vw; margin-bottom: 0.4166666667vw; } @media screen and (max-width: 980px) { .z_js_swiper .infobox .tit { font-size: 16px; } } @media screen and (max-width: 980px) { .z_js_swiper .infobox .tit { margin-bottom: 10px; } } .z_js_swiper .infobox .desc { line-height: 24px; } .z_js_nav { width: 57.2916666667vw; padding: 4.1666666667vw 1.0416666667vw; padding-left: 11vw; min-height: 25.5208333333vw; margin-left: auto; display: flex; align-items: flex-start; } .z_js_nav .item{ flex: 1; line-height: 24px; } .z_js_nav .item .tit{ color: #fff; font-weight: bold; font-size: 16px; } @media screen and (max-width: 980px) { .z_js_nav { width: 100%; display: block; } } .z_js_nav li { cursor: pointer; padding-right: 20px; color: #fff; margin-top: 1.0416666667vw; } @media screen and (max-width: 980px) { .z_js_nav li { width: 100%; } } @media screen and (max-width: 980px) { .z_js_nav li { margin-bottom: 10px; } } .z_js_nav li.active { color: #F1882F; } @media screen and (max-width: 980px) { .z_js_nav { padding: 15px 12px; } } .z_zl_section .z_index_tit { margin-bottom: 1.5625vw; } @media screen and (max-width: 980px) { .z_zl_section .z_index_tit { margin-bottom: 20px; } } .z_zl_section .z_desc { width: 29.5833333333vw; font-size: 1.0416666667vw; font-weight: bold; line-height: 1.875vw; } @media screen and (max-width: 980px) { .z_zl_section .z_desc { width: 100%; } } @media screen and (max-width: 980px) { .z_zl_section .z_desc { font-size: 16px; } } @media screen and (max-width: 980px) { .z_zl_section .z_desc { line-height: 24px; } } .z_zl_section .zlnav { margin-left: auto; width: 45.8333333333vw; text-align: left; } @media screen and (max-width: 980px) { .z_zl_section .zlnav { width: 100%; } } .z_zl_section .zlnav li { width: 18.75vw; margin-left: 4.1666666667vw; float: left; line-height: 30px; padding-left: 15px; position: relative; cursor: pointer; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } @media screen and (max-width: 980px) { .z_zl_section .zlnav li { width: 100%; } } @media screen and (max-width: 980px) { .z_zl_section .zlnav li { margin-left: 0; } } .z_zl_section .zlnav li:hover { color: #F1882F; } .z_zl_section .zlnav li::before { position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 6px; height: 6px; background: #008FD6; border-radius: 50%; z-index: 1; } @media screen and (max-width: 980px) { .z_zl_section .z_desc { margin-bottom: 20px; } } .z_zl_swiper { overflow: hidden; margin-top: 4.6875vw; padding: 10px; } @media screen and (max-width: 980px) { .z_zl_swiper { margin-top: 30px; } } .z_zl_swiper li { display: flex; align-items: center; justify-content: center; height: 18.75vw; } @media screen and (max-width: 980px) { .z_zl_swiper li { height: 50vw; } } .z_zl_swiper li img { max-width: 100%; max-height: 100%; box-shadow: 0px 3px 9px 0px rgba(31, 67, 98, 0.17); } .z_headbox { padding: 2.5vw 8.3333333333vw; } .z_headbox .z_sub_nav { margin-top: 2.0833333333vw; } @media screen and (max-width: 980px) { .z_headbox .z_sub_nav { margin-top: 30px; } } .z_headbox .z_sub_nav a { display: inline-block; min-width: 8.8541666667vw; padding: 0 15px; text-align: center; height: 2.6041666667vw; line-height: 2.6041666667vw; border: 1px solid #333333; border-radius: 1.3541666667vw; font-size: 0.8333333333vw; margin-right: 1.3020833333vw; } @media screen and (max-width: 980px) { .z_headbox .z_sub_nav a { height: 35px; } } @media screen and (max-width: 980px) { .z_headbox .z_sub_nav a { line-height: 35px; } } @media screen and (max-width: 1680px) { .z_headbox .z_sub_nav a { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_headbox .z_sub_nav a { font-size: 14px; } } @media screen and (max-width: 980px) { .z_headbox .z_sub_nav a { margin-right: 20px; } } .z_headbox .z_sub_nav a:hover, .z_headbox .z_sub_nav a.active { background: #008FD6; color: #fff; border-color: #008FD6; } @media screen and (max-width: 980px) { .z_headbox { padding: 30px 12px; } .z_headbox .z_sub_nav a { border-radius: 18px; } } .z_contact_warp { background: #EEF3F7; border-bottom: 8px solid #008FD6; } .z_contact_warp .flcon, .z_contact_warp .frcon { width: 50%; } @media screen and (max-width: 980px) { .z_contact_warp .flcon, .z_contact_warp .frcon { width: 100%; } } .z_contact_warp .flcon { padding: 5.2083333333vw 20px 5.2083333333vw 8.3333333333vw; } .z_contact_warp .flcon .z_dz_navs a { display: inline-block; font-size: 0.8333333333vw; font-weight: bold; opacity: 0.4; margin-right: 2vw; } @media screen and (max-width: 1680px) { .z_contact_warp .flcon .z_dz_navs a { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_contact_warp .flcon .z_dz_navs a { font-size: 14px; } } @media screen and (max-width: 980px) { .z_contact_warp .flcon .z_dz_navs a { margin-right: 20px; } } .z_contact_warp .flcon .z_dz_navs a.active { opacity: 1; color: #1A1A1A; text-decoration: underline; } .z_contact_warp .flcon .z_dz_cons { margin-top: 3.125vw; font-size: 14px; font-weight: 400; line-height: 36px; color: #1A1A1A; } @media screen and (max-width: 980px) { .z_contact_warp .flcon .z_dz_cons { margin-top: 20px; } } .z_contact_warp .flcon .z_dz_cons .itembox { display: none; } .z_contact_warp .flcon .z_dz_cons .itembox.active { display: block; } .z_contact_warp .flcon .z_dz_cons .tit { font-size: 0.9375vw; font-weight: bold; } @media screen and (max-width: 1680px) { .z_contact_warp .flcon .z_dz_cons .tit { font-size: 1.134375vw; } } @media screen and (max-width: 980px) { .z_contact_warp .flcon .z_dz_cons .tit { font-size: 16px; } } .z_contact_warp .flcon .z_dz_cons .tel { font-size: 1.1979166667vw; font-family: DIN; font-weight: bold; } @media screen and (max-width: 980px) { .z_contact_warp .flcon .z_dz_cons .tel { font-size: 18px; } } .z_contact_warp .flcon .codeli { margin-top: 3.90625vw; } @media screen and (max-width: 980px) { .z_contact_warp .flcon .codeli { margin-top: 20px; } } .z_contact_warp .flcon .codeli li { float: left; margin-right: 0.5208333333vw; } @media screen and (max-width: 980px) { .z_contact_warp .flcon .codeli li { margin-right: 10px; } } .z_contact_warp .flcon .codeli li .img { display: block; height: 5.7291666667vw; margin: 0 auto; margin-right: 10px; width: auto; margin-bottom: 10px; } @media screen and (max-width: 980px) { .z_contact_warp .flcon .codeli li .img { height: 80px; } } .z_contact_warp .frcon { height: 100%; } @media screen and (max-width: 980px) { .z_contact_warp .flcon { padding: 30px 12px; } .z_contact_warp .flcon .z_dz_cons { line-height: 30px; } .z_contact_warp .frcon { height: 70vw; } } .z_contact_ts { padding-top: 3.125vw; } .z_contact_ts .titbar { font-size: 1.4583333333vw; font-weight: 400; color: #1A1A1A; font-weight: bold; margin-bottom: 3.6458333333vw; } @media screen and (max-width: 980px) { .z_contact_ts .titbar { font-size: 16px; } } @media screen and (max-width: 980px) { .z_contact_ts .titbar { margin-bottom: 30px; } } .z_contact_ts .flcon, .z_contact_ts .frcon { width: 50%; } @media screen and (max-width: 980px) { .z_contact_ts .flcon, .z_contact_ts .frcon { width: 100%; } } .z_contact_ts .flcon { padding-right: 3.125vw; } .z_contact_ts .flcon .desc { line-height: 1.875vw; margin-bottom: 2.6041666667vw; color: #666666; } @media screen and (max-width: 980px) { .z_contact_ts .flcon .desc { line-height: 24px; } } @media screen and (max-width: 980px) { .z_contact_ts .flcon .desc { margin-bottom: 30px; } } .z_contact_ts .flcon .lx { font-weight: bold; line-height: 1.5625vw; } @media screen and (max-width: 1680px) { .z_contact_ts .flcon .lx { line-height: 1.8125vw; } } @media screen and (max-width: 980px) { .z_contact_ts .flcon .lx { line-height: 24px; } } .z_contact_ts .frcon { padding-left: 3.125vw; } .z_contact_ts .frcon li { background: #fff; border-radius: 4px; overflow: hidden; margin-bottom: 1.25vw; padding: 0 1.5625vw; display: flex; align-items: center; } @media screen and (max-width: 980px) { .z_contact_ts .frcon li { margin-bottom: 10px; } } .z_contact_ts .frcon li label { flex-shrink: 0; display: block; } .z_contact_ts .frcon li .z_sel { height: 46px; direction: rtl; appearance: none; padding: 0 1.5625vw; background: url(../img/arr4.png) no-repeat right center; width: 70%; margin-left: auto; } @media screen and (max-width: 980px) { .z_contact_ts .frcon li .z_sel { height: 40px; } } .z_contact_ts .frcon li .text { height: 46px; width: 100%; text-align: right; } @media screen and (max-width: 980px) { .z_contact_ts .frcon li .text { height: 40px; } } .z_contact_ts .frcon li .ts { flex-shrink: 0; color: #008FD6; } .z_contact_ts .frcon li.con { display: block; padding: 0.78125vw 1.5625vw; } .z_contact_ts .frcon li.con .texta { width: 100%; min-height: 3.125vw; margin-top: 0.78125vw; } .z_contact_ts .frcon .btnwarp { display: flex; justify-content: space-between; } .z_contact_ts .frcon .btnwarp .btn { width: 49%; height: 46px; background: #008FD6; border-radius: 4px; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; cursor: pointer; font-size: 16px; color: #fff; } @media screen and (max-width: 980px) { .z_contact_ts .frcon .btnwarp .btn { height: 40px; } } .z_contact_ts .frcon .btnwarp .btn:last-child { background: #F1882F; } .z_contact_ts .frcon .btnwarp .btn .up { position: absolute; left: 0; top: 0%; width: 100%; height: 100%; opacity: 0; cursor: pointer; } @media screen and (max-width: 980px) { .z_contact_ts { background-position: right center; } .z_contact_ts .flcon, .z_contact_ts .frcon { padding: 0; } .z_contact_ts .frcon { margin-top: 30px; } .z_contact_ts .frcon li { padding: 0 12px; } .z_contact_ts .frcon li .z_sel { padding: 0 20px; } .z_contact_ts .frcon li .ts { display: none; } .z_contact_ts .frcon li.con { padding: 12px; } .z_contact_ts .frcon li.con .texta { min-height: 60px; margin-top: 10px; } } .z_zp_section { padding-top: 2.0833333333vw; padding-bottom: 1.5625vw; } .z_zp_section .topwarp { justify-content: space-between; align-items: flex-start; margin-bottom: 1.5625vw; } @media screen and (max-width: 980px) { .z_zp_section .topwarp { margin-bottom: 30px; } } .z_zp_section .topwarp .tit { font-size: 1.4583333333vw; color: #1A1A1A; font-weight: bold; margin-bottom: 15px; } @media screen and (max-width: 980px) { .z_zp_section .topwarp .tit { font-size: 18px; } } .z_zp_section .topwarp .desc { font-size: 0.8333333333vw; color: #666666; } @media screen and (max-width: 1680px) { .z_zp_section .topwarp .desc { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_zp_section .topwarp .desc { font-size: 14px; } } .z_zp_section .topwarp .more { padding: 0 20px; height: 2.6041666667vw; background: linear-gradient(155deg, #008FD6, #A5C8FC); border-radius: 1.3020833333vw; color: #fff; display: flex; align-items: center; justify-content: center; } @media screen and (max-width: 980px) { .z_zp_section .topwarp .more { height: 40px; } } .z_zp_section .topwarp .more .ico { margin-left: 10px; } .z_zp_section .z_zp_list ul { margin-left: -2.8%; } .z_zp_section .z_zp_list li { width: 30.5%; margin-left: 2.8%; background: #fff; padding: 0 2.6041666667vw; position: relative; z-index: 1; margin-bottom: 2.6041666667vw; } @media screen and (max-width: 980px) { .z_zp_section .z_zp_list li { width: 100%; } } @media screen and (max-width: 980px) { .z_zp_section .z_zp_list li { margin-bottom: 15px; } } .z_zp_section .z_zp_list li::before { position: absolute; left: 0; top: 0%; background: linear-gradient(155deg, #008FD6, #A5C8FC); opacity: 0; transition: ease 0.5s; } .z_zp_section .z_zp_list li:hover::before { opacity: 1; } .z_zp_section .z_zp_list li:hover .tit, .z_zp_section .z_zp_list li:hover .desc, .z_zp_section .z_zp_list li:hover .bar { color: #fff; } .z_zp_section .z_zp_list .infobox { padding: 1.3020833333vw 0; } .z_zp_section .z_zp_list .infobox .tit { font-size: 1.1458333333vw; font-weight: bold; color: #1A1A1A; margin-bottom: 1.0416666667vw; transition: color 0.5s; } @media screen and (max-width: 980px) { .z_zp_section .z_zp_list .infobox .tit { font-size: 16px; } } @media screen and (max-width: 980px) { .z_zp_section .z_zp_list .infobox .tit { margin-bottom: 10px; } } .z_zp_section .z_zp_list .infobox .desc { color: #9a9a9a; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; height: 48px; line-height: 24px; transition: color 0.5s; } .z_zp_section .z_zp_list .bar { display: flex; align-items: center; justify-content: space-between; height: 3.125vw; border-top: 1px solid #eaeaea; } @media screen and (max-width: 980px) { .z_zp_section .z_zp_list .bar { height: 40px; } } @media screen and (max-width: 980px) { .z_zp_section .topwarp .more { margin-top: 30px; border-radius: 30px; } .z_zp_section .z_zp_list li { padding: 0 12px; box-shadow: 0px 3px 9px 0px rgba(31, 67, 98, 0.17); } .z_zp_section .z_zp_list li .infobox { padding: 15px 0; } } .z_news_page { background: #F5F6F7; } .z_news_lists { padding: 1.5625vw 8.3333333333vw; padding-bottom: 2.6041666667vw; overflow: hidden; } .z_news_lists ul { border-bottom: 1px solid #e1e2e3; margin-bottom: 2.0833333333vw; } @media screen and (max-width: 980px) { .z_news_lists ul { margin-bottom: 0; } } .z_news_lists li { width: 32.3%; margin-right: 1.5%; float: left; margin-bottom: 2.0833333333vw; background: #fff; } @media screen and (max-width: 980px) { .z_news_lists li { width: 100%; } } .z_news_lists li:nth-child(3n) { margin-right: 0; } @media screen and (max-width: 980px) { .z_news_lists li { margin-bottom: 12px; } } .z_news_lists li:hover .imgbg { transform: scale(1.05, 1.05); } .z_news_lists li:hover .tit { color: #008FD6 !important; } .z_news_lists li .imgbox { height: 15.625vw; } @media screen and (max-width: 980px) { .z_news_lists li .imgbox { height: 50vw; } } .z_news_lists li .infobox { padding: 1.3020833333vw; padding-bottom: 2.0833333333vw; } .z_news_lists li .infobox .tit { color: #1A1A1A; margin-bottom: 4.1666666667vw; } @media screen and (max-width: 980px) { .z_news_lists li .infobox .tit { margin-bottom: 20px; } } .z_news_lists li .infobox .bar { color: #008FD6; } .z_news_lists li .infobox .bar .iconfont { display: inline-block; margin-right: 10px; } .z_news_lists li .tit { font-size: 1.1458333333vw; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } @media screen and (max-width: 980px) { .z_news_lists li .tit { font-size: 16px; } } .z_news_lists .two, .z_news_lists .frist { width: 49.25%; } @media screen and (max-width: 980px) { .z_news_lists .two, .z_news_lists .frist { width: 100%; } } .z_news_lists .two .infobox, .z_news_lists .frist .infobox { padding-bottom: 3.125vw; } .z_news_lists .two .imgbox, .z_news_lists .frist .imgbox { height: 20.8333333333vw; } @media screen and (max-width: 980px) { .z_news_lists .two .imgbox, .z_news_lists .frist .imgbox { height: 50vw; } } .z_news_lists .two { margin-right: 0; } @media screen and (max-width: 980px) { .z_news_lists { padding: 30px 12px; } .z_news_lists ul { border: none; } .z_news_lists li .infobox { padding: 15px 12px; } .z_news_lists .frist .infobox { padding: 15px 12px; } } .z_xq_pages { align-items: flex-start; padding: 4.1666666667vw 0; justify-content: center; position: relative; } .z_xq_pages .flcon { display: flex; align-items: center; justify-content: center; width: 20%; position: absolute; left: 0; top:4.16vw ; } @media screen and (max-width: 980px) { .z_xq_pages .flcon { width: 100%; } } .z_xq_pages .flcon .back { display: flex; align-items: center; justify-content: center; width: 2.6875vw; height: 2.6875vw; background: #FFFFFF; box-shadow: 0px 0px 20px 0px rgba(0, 102, 153, 0.1); border-radius: 50%; color: #008FD6; } @media screen and (max-width: 980px) { .z_xq_pages .flcon .back { width: 50px; height: 50px; } } .z_xq_pages .flcon .back .iconfont { font-size: 14px; } .z_xq_pages .flcon .back:hover { background: #008FD6; color: #fff; } .z_xq_pages .frcon { width: 60%; } @media screen and (max-width: 980px) { .z_xq_pages .frcon { width: 100%; } } .z_xq_pages .frcon .titbar { font-size: 1.6666666667vw; text-align: center; } @media screen and (max-width: 980px) { .z_xq_pages .frcon .titbar { font-size: 18px; } } .z_xq_pages .frcon .csbar { padding: 1.5625vw 0; margin-top: 1.5625vw; border-top: 1px solid #e3e4e6; justify-content: space-between; color: #888888; } @media screen and (max-width: 980px) { .z_xq_pages .frcon .csbar { margin-top: 20px; } } .z_xq_pages .frcon .csbar a { color: #C6C6C8; display: inline-block; margin-left: 20px; cursor: pointer; } .z_xq_pages .frcon .csbar a:hover { color: #F1882F; } .z_xq_pages .frcon .content { color: #555555; line-height: 34px; font-size: 0.8333333333vw; } @media screen and (max-width: 1680px) { .z_xq_pages .frcon .content { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_xq_pages .frcon .content { font-size: 14px; } } .z_xq_pages .frcon .content img { max-width: 100% !important; height: auto !important; } .z_xq_pages .frcon .z_topbt_bar { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid #e3e4e6; padding-top: 2.6041666667vw; margin-top: 2.6041666667vw; } @media screen and (max-width: 980px) { .z_xq_pages .frcon .z_topbt_bar { margin-top: 30px; } } .z_xq_pages .frcon .z_topbt_bar a { font-family: DIN; font-size: 16px; } @media screen and (max-width: 980px) { .z_xq_pages .frcon .z_topbt_bar a { font-size: 14px; } } .z_xq_pages .frcon .z_topbt_bar a:hover { color: #008FD6; } .z_xq_pages .frcon .z_topbt_bar .iconfont { color: #008FD6; } @media screen and (max-width: 980px) { .z_xq_pages { padding-top: 0; } .z_xq_pages .flcon { display: none; } .z_xq_pages .frcon { padding: 30px 12px; } .z_xq_pages .frcon .titbar { text-align: center; } .z_xq_pages .frcon .csbar { text-align: center; padding: 20px 0; } .z_xq_pages .frcon .csbar .z_share { margin-top: 10px; } .z_xq_pages .frcon .content { line-height: 24px; font-size: 14px; } .z_xq_pages .frcon .z_topbt_bar { padding-top: 15px; } .z_xq_pages .frcon .z_topbt_bar .iconfont { display: inline-block; font-size: 14px; } } .z_xg_news ul { border: none; margin-bottom: 0; } .z_xg_news li { background: none; margin-bottom: 0; } .z_xg_news li .infobox { padding-bottom: 0; } @media screen and (max-width: 980px) { .z_xg_news .xgtit { margin-bottom: 20px; } .z_xg_news li { margin-bottom: 20px; } } .z_zb_list { padding: 0vw 8.3333333333vw 2.6041666667vw 8.3333333333vw; } .z_zb_list li { width: 31.3%; margin-right: 2%; margin-bottom: 1.5625vw; float: left; transition: ease 0.8s; background: #fff; padding: 1.5625vw; } @media screen and (max-width: 980px) { .z_zb_list li { width: 100%; } } @media screen and (max-width: 980px) { .z_zb_list li { margin-right: 0; } } @media screen and (max-width: 980px) { .z_zb_list li { margin-bottom: 15px; } } .z_zb_list li::nth-child(3n) { margin-right: 0; } .z_zb_list li .tit { color: #1E1E1E; font-size: 1.1458333333vw; margin-bottom: 1.3020833333vw; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } @media screen and (max-width: 980px) { .z_zb_list li .tit { font-size: 16px; } } @media screen and (max-width: 980px) { .z_zb_list li .tit { margin-bottom: 15px; } } .z_zb_list li .desc { color: #808080; line-height: 26px; height: 78px; height: 78px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; margin-bottom: 2.6041666667vw; } @media screen and (max-width: 980px) { .z_zb_list li .desc { height: auto; } } @media screen and (max-width: 980px) { .z_zb_list li .desc { margin-bottom: 15px; } } .z_zb_list li .bar { display: flex; align-items: center; justify-content: space-between; font-family: DIN; font-weight: 500; color: #BFBFBF; } .z_zb_list li .btn { width: 35px; height: 35px; border: 1px solid #B5B5B5; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #5F5F5F; transition: ease 0.8s; } .z_zb_list li .btn .iconfont { display: inline-block; transform: rotate(-45deg); transition: ease 0.8s; } .z_zb_list li:hover { box-shadow: 0px 3px 9px 1px rgba(0, 143, 214, 0.1); } .z_zb_list li:hover .tit { color: #008FD6; } .z_zb_list li:hover .btn { background: #008FD6; border-color: #008FD6; } .z_zb_list li:hover .btn .iconfont { transform: rotate(0); color: #fff; } @media screen and (max-width: 980px) { .z_zb_list { padding: 0 12px 30px 12px; } .z_zb_list li { padding: 20px 12px; } } .z_zbxq_page .titbar { color: #008FD6; } .z_zbxq_page .content { background: rgba(0, 143, 214, 0.04); border: 1px solid #c6e3f3; color: #555555; padding: 20px; } @media screen and (max-width: 980px) { .z_zbxq_page .content { padding: 20px 12px; } } .z_about_ys { display: flex; border-radius: 10px; overflow: hidden; margin-top: 3.125vw; } @media screen and (max-width: 980px) { .z_about_ys { margin-top: 30px; } } .z_about_ys li { height: 34.375vw; flex: 1; transition: ease 0.5s; position: relative; } @media screen and (max-width: 980px) { .z_about_ys li { height: 60vw; } } .z_about_ys li.on { flex: 2.8; } .z_about_ys li.on .infobox { opacity: 1; } .z_about_ys .infobox { position: absolute; left: 0; bottom: 0%; width: 100%; padding: 1.5625vw 3.125vw; color: #fff; opacity: 0; transition: ease 0.5s; } .z_about_ys .tit { font-size: 1.5625vw; } @media screen and (max-width: 980px) { .z_about_ys .tit { font-size: 16px; } } .z_about_ys .desc { font-size: 0.8333333333vw; margin-top: 10px; } @media screen and (max-width: 1680px) { .z_about_ys .desc { font-size: 1.0083333333vw; font-size: 1.0666666667vw; } } @media screen and (max-width: 980px) { .z_about_ys .desc { font-size: 14px; } } .z_fenzhi_page{ padding: 5vw 8vw; display: flex; align-items: flex-start; border-bottom: 1px solid #f0f0f0; } .z_fenzhi_page .z_index_tit{flex-shrink: 0;} .z_fenzhi_page .frcon{ margin-left: auto; width: 90%; } .z_fz_part1{ background: #f8f8f8; padding: 1.6vw 3vw; } .z_fz_part1 ul{ display: flex; justify-content: space-between; } .z_fenzhi_page li .tit{ font-size: 1.25vw; margin-bottom: 1.2vw; } .z_fenzhi_page li .desc{ color: #666; line-height: 28px; padding-right: 10px; } .z_fenzhi_page .z_headbox{ padding: 1.5vw 3vw; } .z_fz_part2 li{ width: 45%; float: left; padding: 1.5vw 3vw; border-bottom: 1px solid #f0f0f0; } .z_fz_part2 li:nth-child(1),.z_fz_part2 li:nth-child(2){ border-top: 1px solid #f0f0f0; } .z_fz_part2 li:nth-child(even){ float: right; margin-left: auto; } .z_fz_part2 li .tit{ margin-bottom: 0.6vw; } .z_fenzhi_page .z_load_more{ margin-top: 3vw; } .z_fz_part2 ul{ display: flex; display: -webkit-flex; flex-direction: row; -webkit-flex-direction: row; flex-wrap: wrap; -webkit-flex-wrap: wrap; } @media screen and (max-width: 980px) { .z_fenzhi_page{ display: block; padding: 30px 12px; } .z_fenzhi_page .frcon{ width: 100%; } .z_fz_part1 ul,.z_fz_part2 ul{ display: block; margin-top: 20px; } .z_fz_part1 { margin-top: 30px; padding: 20px 12px; } .z_fz_part1 li{ margin-bottom: 20px; } .z_fenzhi_page li .tit{ font-size: 18px; margin-bottom:14px; } .z_fenzhi_page li .desc{ line-height: 24px; padding-right: 0px; } .z_fenzhi_page .z_headbox{ padding: 30px 0; } .z_fz_part2 li{ width: 100%; padding: 20px 0; } .z_fz_part2 li:nth-child(2){ border-top: none; } }