/* 清除内外边距 */ body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, fieldset,button, input, textarea, select,option,th, td { margin: 0; padding: 0; font-family: PingFang SC,Microsoft Yahei,Arial,Hiragino Sans; text-align: justify; font-weight: normal;font-display:swap; } h1 { font-size: 18px; /* 18px / 12px = 1.5 */ } h2 { font-size: 16px; } h3 { font-size: 14px; } h4, h5, h6 { font-size: 100%; } address, cite, dfn, em, var { font-style: normal; } /* 将斜体扶正 */ small { font-size: 12px; } /* 小于 12px 的中文很难阅读，让 small 正常化 */ ul, ol { list-style: none; } a { text-decoration: none; } a:hover { text-decoration: none; } abbr[title], acronym[title] { border-bottom: 1px dotted; cursor: help; } q:before, q:after { content: ''; } legend { color: #000; } /* for ie6 */ fieldset, img { border: none; } /* img 搭车：让链接里的 img 无边框 */ button, input, select, textarea { font-size: 100%; } table { border-collapse: collapse; border-spacing: 0; } hr { border: none; height: 1px; } /* 让非ie浏览器默认也显示垂直滚动条，防止因滚动条引起的闪烁 */ html { overflow-y: scroll; } audio, canvas, progress, video {display: inline-block;vertical-align: baseline;} video::-internal-media-controls-download-button {display:none;} video::-webkit-media-controls-enclosure {overflow:hidden;} video::-webkit-media-controls-panel {width: calc(100% + 30px); } html,body{ height:100%; background: #000; } input, button, select, textarea {outline: none;} .clearfix:after{display:block;content:'';clear:both;visibility:hidden} *:focus{outline:none;} /* swiper css */ .swiper-container{margin:0 auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-container-no-flexbox .swiper-slide{float:left}.swiper-container-vertical>.swiper-wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.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-android .swiper-slide,.swiper-wrapper{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.swiper-container-multirow>.swiper-wrapper{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.swiper-container-free-mode>.swiper-wrapper{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto}.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-slide-invisible-blank{visibility:hidden}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;-webkit-transition-property:height,-webkit-transform;transition-property:height,-webkit-transform;-o-transition-property:transform,height;transition-property:transform,height;transition-property:transform,height,-webkit-transform}.swiper-container-3d{-webkit-perspective:1200px;perspective:1200px}.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper{-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:-webkit-gradient(linear,right top,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-right{background-image:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-top{background-image:-webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-wp8-horizontal,.swiper-container-wp8-horizontal>.swiper-wrapper{-ms-touch-action:pan-y;touch-action:pan-y}.swiper-container-wp8-vertical,.swiper-container-wp8-vertical>.swiper-wrapper{-ms-touch-action:pan-x;touch-action:pan-x} .swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:27px;height:44px;margin-top:-30px;z-index:10;cursor:pointer;background-size:27px 44px;background-position:center;background-repeat:no-repeat}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");left:10px;right:auto}.swiper-button-next,.swiper-container-rtl .swiper-button-prev{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");right:10px;left:auto}.swiper-button-prev.swiper-button-white,.swiper-container-rtl .swiper-button-next.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")}.swiper-button-next.swiper-button-white,.swiper-container-rtl .swiper-button-prev.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")}.swiper-button-prev.swiper-button-black,.swiper-container-rtl .swiper-button-next.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")}.swiper-button-next.swiper-button-black,.swiper-container-rtl .swiper-button-prev.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")}.swiper-button-lock{display:none}.swiper-pagination{position:absolute;text-align:center;-webkit-transition:.3s opacity;-o-transition:.3s opacity;transition:.3s opacity;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;-webkit-box-shadow:none;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet-active{opacity:1;background:#007aff}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);width:8px}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;-webkit-transition:.2s top,.2s -webkit-transform;transition:.2s top,.2s -webkit-transform;-o-transition:.2s transform,.2s top;transition:.2s transform,.2s top;transition:.2s transform,.2s top,.2s -webkit-transform}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);white-space:nowrap}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:.2s left,.2s -webkit-transform;transition:.2s left,.2s -webkit-transform;-o-transition:.2s transform,.2s left;transition:.2s transform,.2s left;transition:.2s transform,.2s left,.2s -webkit-transform}.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:.2s right,.2s -webkit-transform;transition:.2s right,.2s -webkit-transform;-o-transition:.2s transform,.2s right;transition:.2s transform,.2s right;transition:.2s transform,.2s right,.2s -webkit-transform}.swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#007aff;position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;-ms-transform-origin:left top;transform-origin:left top}.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{-webkit-transform-origin:right top;-ms-transform-origin:right top;transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progressbar,.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-container-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}.swiper-pagination-white .swiper-pagination-bullet-active{background:#fff}.swiper-pagination-progressbar.swiper-pagination-white{background:rgba(255,255,255,.25)}.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill{background:#fff}.swiper-pagination-black .swiper-pagination-bullet-active{background:#000}.swiper-pagination-progressbar.swiper-pagination-black{background:rgba(0,0,0,.25)}.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill{background:#000}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain}.swiper-slide-zoomed{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;-webkit-transform-origin:50%;-ms-transform-origin:50%;transform-origin:50%;-webkit-animation:swiper-preloader-spin 1s steps(12,end) infinite;animation:swiper-preloader-spin 1s steps(12,end) infinite}.swiper-lazy-preloader:after{display:block;content:'';width:100%;height:100%;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");background-position:50%;background-size:100%;background-repeat:no-repeat}.swiper-lazy-preloader-white:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}@-webkit-keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-container-fade.swiper-container-free-mode .swiper-slide{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;-webkit-transition-property:opacity;-o-transition-property:opacity;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube{overflow:visible}.swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube.swiper-container-rtl .swiper-slide{-webkit-transform-origin:100% 0;-ms-transform-origin:100% 0;transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0;width:100%;height:100%;background:#000;opacity:.6;-webkit-filter:blur(50px);filter:blur(50px);z-index:0}.swiper-container-flip{overflow:visible}.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-coverflow .swiper-wrapper{-ms-perspective:1200px} @font-face { font-family:AlibabaPuHuiTi-3-45-Light; src: url(../font/AlibabaPuHuiTi-3-45-Light.ttf) format("opentype"); } @font-face { font-family:AlibabaPuHuiTi-3-45-Light; src: url(../font/AlibabaPuHuiTi-3-45-Light.woff) format("woff2"); } @font-face { font-family: "Num"; src: url("../font/Num.eot") format("eot"), url("../font/Num.woff") format("woff"), url("../font/Num.ttf") format("truetype"); } .taict{ display: block;overflow: hidden;margin: 50px 0;} .more,.wpcf7submit,.morlink{ display: block; overflow: hidden; width: 200px; height: 50px; line-height: 50px; text-align: center; /* background: #1c2840; */ border-radius: 2em; color: #fff; margin: 0 auto; font-size: 16px; background-image: linear-gradient(67deg, #0068ff, #00b5a2);} .more:hover,.wpcf7submit:hover,.morlink:hover{opacity: 0.5;} .icenter{ width: 1500px;margin: 0 auto;display: block;} .pcheader{position: fixed;width: 100%; z-index: 999999; height:90px;transition: all .3s;} .pcheader .ic{ display: block; width: 96%; margin: 0 auto; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: center; -webkit-align-items: center; position: relative;height: 100%;} .pcheader .ic .left{display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: center; -webkit-align-items: center; height: 100%; } .pcheader .ic .left .logo{display: block;margin-right: 36px;overflow: hidden;width: 70px;} .pcheader .ic .left .logo font{ background-image:linear-gradient(67deg, #0068ff,#00b5a2); width:70px; height:70px; border-radius:50%; display:flex; align-items:center; justify-content:center;transition:all .3s; } .pcheader .ic .left .logo img{filter: none; display: block; height:50px;transition:all .3s; } .pcheader .ic .left .logo span{display: block; width: 60px; height: 60px; background-image: linear-gradient(67deg, #0068ff, #00b5a2); text-align: center; line-height: 60px; color: #fff; font-family: Arial; font-size: 1.8rem; border-radius: 50%; transition: all .3s; } .pcheader .ic .left .pcnav{display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: center; -webkit-align-items: center;height: 100%;} .pcheader .ic .left .pcnav dd{margin: 0 36px;position: relative;height: 100%; display: flex; flex-wrap: nowrap; align-content: center; justify-content: center; align-items: center;} .pcheader .ic .left .pcnav dd a{ color: #fff; font-size: 20px; height:24px; display: block; overflow: hidden; line-height: 24px; } .pcheader .ic .left .pcnav dd a .fa{display: block; color: #fff; position: absolute; top: 50%; right: 0; transform: translate(0%, -50%); font-size: 16px;} .pcheader .ic .left .pcnav .na a:nth-child(1){padding-right: 15px;} .pcheader .ic .left .pcnav dd h4{transition: all 0.3s;background:rgba(33, 34, 36, 0.95); position: absolute;opacity:0; visibility: hidden; padding:5px 30px; left: -30px;top:90px; width: 140px; border-radius: 0 0 10px 10px;} .pcheader .ic .left .pcnav dd:hover h4{visibility: visible;opacity: 1;} .pcheader .ic .left .pcnav dd h4 a{ font-size: 16px; height: auto; line-height: 36px; margin: 10px 0;} .pcheader .ic .left .pcnav dd h4 a:hover,.pcheader .ic .left .pcnav dd:hover a .fa{-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;background-image:linear-gradient(to right,#178cde,#00ffe4 50%,#178cde);font-style: inherit;} .pcheader .ic .right{display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: center; -webkit-align-items: center;} .pcheader .ic .right .ra{display:block;width:140px;height:40px;background-image:linear-gradient(67deg, #0068ff,#00b5a2);color:#fff;text-align:center;font-size:16px;line-height:40px; border-radius:2rem;} .div2_1 .pcheader{height: 70px;} .div2_1 .pcheader,.pcheader:hover{background-color: rgba(0, 0, 0, 0.8);} .pcheader .ic .left .pcnav dd a span{display: block; transition: all 0.3s;} .pcheader .ic .left .pcnav dd a span:nth-child(2n){-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde);} .pcheader .ic .left .pcnav dd a:hover span,.pcheader .ic .left .pcnav .na:hover a span{transform: translateY(-100%);} .div2_1 .pcheader .ic .left .logo span{ width: 46px; height: 46px; line-height: 46px; font-size: 1.3rem; } .div2_1 .pcheader .ic .left .logo font{ width: 56px; height: 56px; } .div2_1 .pcheader .ic .left .logo font img{height:22px;} .div2_1 .pcheader .ic .left .pcnav dd h4{top:70px;} .div2_1 .pcheader .ic .left .pcnav dd h4 a{ height: auto; line-height: 36px;} #csbm { position: fixed; width: 4px; height: 4px; border-radius: 50%; background-color: #00cc82; z-index: 99999999999999; pointer-events: none; } #csbm .ccde{position:absolute;top:-18px;left:-18px;width:40px;height:40px;border:1px solid #9c9c9c;border-radius:50%;opacity:.2;box-sizing:border-box;z-index:99;-webkit-transition:all .6s;transition:all .6s; } #csbm .cchov{position:absolute;top:-38px;left:-38px;width:80px;height:80px;background-color:#bbb;border-radius:50%;opacity:.12;z-index:98;box-sizing:border-box;transform:scale(0, 0); -webkit-transform:scale(0, 0); -webkit-transition:all 0.6s; transition:all 0.6s; } #csbm.mactive .ccde { transform: scale(0, 0); -webkit-transform: scale(0, 0); } #csbm.mactive .cchov { transform: scale(1, 1); -webkit-transform: scale(1, 1); } .banner{position: relative;width: 100%;overflow: hidden;display: block;height: 100%;} .banner video{width: 100%;overflow: hidden;display: block; position: relative;z-index: 2; height: 100%; object-fit: cover;} .banner .mbarbg{background-image: url('../picture/bannervideobg.jpg');position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: cover; z-index: 1; background-repeat: no-repeat; /* 不重复 */ background-position: center; /* 居中显示 */} .banner .bgicon{position:absolute;opacity:0.2;width:100%;top:0;left:0;height:100%;background-color:#000;z-index: 3;} .text-box { width: 900px;height:200px;font-size:4rem;font-weight:bold;text-transform:uppercase;position:relative;overflow:hidden;clip-path: url(#svgTextPath); color:white;background:linear-gradient(67deg, #005aff,#00ff89); } .dot { display: inline-block; border-radius: 50%; position: absolute; left: 0; top: 0; opacity: 0.9; } .dot:nth-child(1) { width: 100px; height: 100px; background: rgb(30, 207, 148); z-index: 8; transform: translateX(-175px) translateY(-175px); } .dot:nth-child(2) { width: 200px; height: 200px; background: rgb(28, 204, 195); z-index: 7; transform: translateX(-250px) translateY(-250px); } .dot:nth-child(3) { width: 400px; height: 400px; background: rgb(18, 155, 247); z-index: 6; transform: translateX(-350px) translateY(-350px); } .banner text { font-size: 6rem; text-transform: uppercase; } .pagebgtest{ display: flex; justify-content: center; align-items: center; width: 100%; overflow: hidden; height: 200px;} .banner .txt{position: absolute;z-index: 9; width: 100%; top: 50%; left: 0; text-align: center; transform: translate(0%, -50%);} .banner .txt h3{display: inline-block; font-size: 80px; line-height: 1.2em; margin-bottom: 30px; background: linear-gradient(to right, #178cde 15%, #00ffe4 30%, #178cde 55%, #00ffe4 80%, #178cde 95%); background-size: 200% auto; color: #000; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: shine 5s linear infinite;} .banner .txt h4{ display: block; color: #fff; text-align: center; font-size:2rem; line-height: 1.2em; margin: 20px 0 40px;} .banner .txt .taict{ margin: 0;} .banner .bannermore{ position: absolute; width: auto; z-index: 9; bottom: 20px; transform: translate(-50%, 0%); left: 50%; cursor:pointer; transition: all .3s;} .banner .bannermore .a1{-webkit-animation-name: spin; animation-name: spin; -webkit-animation-duration: 4s; animation-duration: 4s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear; display: block; height: 100px;} .banner .bannermore strong{ position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); width: 50px; height: 50px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; } .banner .bannermore strong span{ position: relative;display: block; background: #fff; width: 18px; height: 28px; border-radius: 2rem; opacity: 0.8;} .banner .bannermore strong span:after{position:absolute;content:"";width:4px;height:9px;background:#aaa;border-radius:4rem;left:50%;top:50%;transform:translate(-50%, -50%);animation: 1.5s linear 0.5s infinite hua; } @keyframes hua { from { top:5px; } to { top: 20px; } } @keyframes spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg) } to { -webkit-transform: rotate(1turn); transform: rotate(1turn) } } .banner .bannermore:hover{opacity: 0.8;} .incompany {display: block; overflow: hidden; padding:150px 0 30px; position: relative;} .incompany dt{ display: block; overflow: hidden; margin-bottom: 30px;} .incompany dt strong{ display: block; text-align: center; color: #fff; font-size: 60px; line-height: 1.2em; font-weight: normal;} .incompany dt strong i{-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde);font-style: inherit;} .incompany dt span{ color: #fff; font-size: 30px; text-align: center; display: block; line-height: 1.2em; margin: 30px 0;} .incompany dt font{ color: #fff; font-size: 40px; text-align: center; display: block; line-height: 1.2em;} .incompany .num{ display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: center; -webkit-align-items: center;overflow: hidden;margin-bottom: 50px;} .incompany .num dd p span{-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-size: 120px; display: inline-block;font-family: num; vertical-align: top; line-height: 1.2em; ;} .incompany .num dd p font{ color: #fff; display: inline-block; vertical-align: top; line-height: 1.2em; margin: 20px 0 0 10px; font-size: 16px;} .incompany .num dd strong{ line-height: 1; display: block; color: #fff; font-size: 18px; } .incompany .svg{animation: spin-reverse2 16s infinite linear; opacity: 0.7; display: block; position: absolute; bottom 0; left: 0;height: 100%; } .inlogo{ display: block; overflow: hidden; padding-bottom: 100px; } .inlogo .la{ overflow: visible;white-space: nowrap; height: 100px; margin-bottom: 20px;position: relative;} .inlogo .la dl{ -webkit-animation: kf-client-wall-1 50s linear 0s infinite forwards; -moz-animation: kf-client-wall-1 50s linear 0s infinite forwards; -ms-animation: kf-client-wall-1 50s linear 0s infinite forwards; -o-animation: kf-client-wall-1 50s linear 0s infinite forwards; animation: kf-client-wall-1 50s linear 0s infinite forwards; position: absolute; top:0; left:0; height: 100%;} .inlogo .la dl dd{ position: relative; height: 100%; margin: 0 5px; overflow: hidden; border-radius: 6px; display: inline-block;} .inlogo .la dl dd img{ display: block;width: auto;height: 100%;} @keyframes kf-client-wall-1 { 0% { -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } 100% { -webkit-transform: translate(-33.333%, 0); -moz-transform: translate(-33.333%, 0); -ms-transform: translate(-33.333%, 0); -o-transform: translate(-33.333%, 0); transform: translate(-33.333%, 0); } } .inlogo .gd2 dl{ -webkit-animation: kf-client-wall-2 50s linear 0s infinite forwards; -moz-animation: kf-client-wall-2 50s linear 0s infinite forwards; -ms-animation: kf-client-wall-2 50s linear 0s infinite forwards; -o-animation: kf-client-wall-2 50s linear 0s infinite forwards; animation: kf-client-wall-2 50s linear 0s infinite forwards; position: absolute; top:0; left:0; height: 100%;} @keyframes kf-client-wall-2 { 0% { -webkit-transform: translate(-33.333%, 0); -moz-transform: translate(-33.333%, 0); -ms-transform: translate(-33.333%, 0); -o-transform: translate(-33.333%, 0); transform: translate(-33.333%, 0); } 100% { -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } } .container666{position: relative; width: 10em; height: 5em; font-size: 50px; overflow: hidden; margin: 0 auto 50px; zoom: 0.45;} .wave { border-width: 0.1em;border-style: solid; position: absolute;-webkit-animation: wave 1500ms infinite alternate;animation: wave 1500ms infinite alternate; -webkit-transform: rotate(-44.5deg);transform: rotate(-44.5deg);} .wave:nth-child(1) {width: 9.5125em;height: 9.5125em;bottom: -4.75625em;left: 0.24375em;-webkit-animation-delay: 75ms;animation-delay: 75ms;border-color: transparent transparent #1abc9c #1abc9c; border-radius: 9.5125em;} .wave:nth-child(2) {width: 9.025em;height: 9.025em;bottom: -4.5125em;left: 0.4875em;-webkit-animation-delay: 150ms;animation-delay: 150ms;border-color: transparent transparent rgba(26, 188, 156, 0.90476) rgba(26, 188, 156, 0.90476); border-radius: 9.025em;} .wave:nth-child(3) {width: 8.5375em;height: 8.5375em;bottom: -4.26875em;left: 0.73125em; -webkit-animation-delay: 225ms;animation-delay: 225ms;border-color: transparent transparent rgba(26, 188, 156, 0.85714) rgba(26, 188, 156, 0.85714);border-radius: 8.5375em;} .wave:nth-child(4) {width: 8.05em; height: 8.05em; bottom: -4.025em; left: 0.975em; -webkit-animation-delay: 300ms;animation-delay: 300ms; border-color: transparent transparent rgba(26, 188, 156, 0.80952) rgba(26, 188, 156, 0.80952);border-radius: 8.05em;} .wave:nth-child(5) {width: 7.5625em; height: 7.5625em;bottom: -3.78125em; left: 1.21875em;-webkit-animation-delay: 375ms;animation-delay: 375ms;border-color: transparent transparent rgba(26, 188, 156, 0.7619) rgba(26, 188, 156, 0.7619); border-radius: 7.5625em;} .wave:nth-child(6) {width: 7.075em; height: 7.075em;bottom: -3.5375em;left: 1.4625em; -webkit-animation-delay: 450ms;animation-delay: 450ms;border-color: transparent transparent rgba(26, 188, 156, 0.71429) rgba(26, 188, 156, 0.71429); border-radius: 7.075em;} .wave:nth-child(7) {width: 6.5875em;height: 6.5875em;bottom: -3.29375em;left: 1.70625em; -webkit-animation-delay: 525ms;animation-delay: 525ms;border-color: transparent transparent rgba(26, 188, 156, 0.66667) rgba(26, 188, 156, 0.66667); border-radius: 6.5875em;} .wave:nth-child(8) {width: 6.1em; height: 6.1em; bottom: -3.05em; left: 1.95em; -webkit-animation-delay: 600ms;animation-delay: 600ms; border-color: transparent transparent rgba(26, 188, 156, 0.61905) rgba(26, 188, 156, 0.61905); border-radius: 6.1em;} .wave:nth-child(9) {width: 5.6125em; height: 5.6125em;bottom: -2.80625em;left: 2.19375em;-webkit-animation-delay: 675ms;animation-delay: 675ms;border-color: transparent transparent rgba(26, 188, 156, 0.57143) rgba(26, 188, 156, 0.57143); border-radius: 5.6125em;} .wave:nth-child(10) {width: 5.125em; height: 5.125em;bottom: -2.5625em;left: 2.4375em; -webkit-animation-delay: 750ms;animation-delay: 750ms; border-color: transparent transparent rgba(26, 188, 156, 0.52381) rgba(26, 188, 156, 0.52381); border-radius: 5.125em;} .wave:nth-child(11) {width: 4.6375em; height: 4.6375em;bottom: -2.31875em;left: 2.68125em;-webkit-animation-delay: 825ms;animation-delay: 825ms;border-color: transparent transparent rgba(26, 188, 156, 0.47619) rgba(26, 188, 156, 0.47619); border-radius: 4.6375em;} .wave:nth-child(12){width: 4.15em;height: 4.15em;bottom: -2.075em;left: 2.925em; -webkit-animation-delay: 900ms;animation-delay: 900ms; border-color: transparent transparent rgba(26, 188, 156, 0.42857) rgba(26, 188, 156, 0.42857); border-radius: 4.15em;} .wave:nth-child(13){width: 3.6625em;height: 3.6625em;bottom: -1.83125em;left: 3.16875em;-webkit-animation-delay: 975ms;animation-delay: 975ms;border-color: transparent transparent rgba(26, 188, 156, 0.38095) rgba(26, 188, 156, 0.38095); border-radius: 3.6625em;} .wave:nth-child(14){width: 3.175em;height: 3.175em;bottom: -1.5875em; left: 3.4125em;-webkit-animation-delay: 1050ms;animation-delay: 1050ms; border-color: transparent transparent rgba(26, 188, 156, 0.33333) rgba(26, 188, 156, 0.33333); border-radius: 3.175em;} .wave:nth-child(15){width: 2.6875em;height: 2.6875em;bottom: -1.34375em;left: 3.65625em;-webkit-animation-delay: 1125ms;animation-delay: 1125ms;border-color: transparent transparent rgba(26, 188, 156, 0.28571) rgba(26, 188, 156, 0.28571); border-radius: 2.6875em;} .wave:nth-child(16){width: 2.2em; height: 2.2em; bottom: -1.1em; left: 3.9em; -webkit-animation-delay: 1200ms;animation-delay: 1200ms; border-color: transparent transparent rgba(26, 188, 156, 0.2381) rgba(26, 188, 156, 0.2381); border-radius: 2.2em;} .wave:nth-child(17){width: 1.7125em;height: 1.7125em;bottom: -0.85625em;left: 4.14375em;-webkit-animation-delay: 1275ms;animation-delay: 1275ms;border-color: transparent transparent rgba(26, 188, 156, 0.19048) rgba(26, 188, 156, 0.19048); border-radius: 1.7125em;} .wave:nth-child(18){width: 1.225em;height: 1.225em;bottom: -0.6125em;left: 4.3875em;-webkit-animation-delay: 1350ms;animation-delay: 1350ms; border-color: transparent transparent rgba(26, 188, 156, 0.14286) rgba(26, 188, 156, 0.14286); border-radius: 1.225em;} .wave:nth-child(19){width: 0.7375em; height:0.7375em; bottom:-0.36875em; left:4.63125em; -webkit-animation-delay: 1425ms; animation-delay:1425ms; border-color: transparent transparent rgba(26, 188, 156, 0.09524) rgba(26, 188, 156, 0.09524);border-radius: 0.7375em;} .wave:nth-child(20){width: 0.25em;height: 0.25em;bottom: -0.125em;left: 4.875em;-webkit-animation-delay: 1500ms; animation-delay: 1500ms;border-color: transparent transparent rgba(26, 188, 156, 0.04762) rgba(26, 188, 156, 0.04762);border-radius: 0.25em;} @-webkit-keyframes wave { to { -webkit-transform: rotate(135deg); transform: rotate(135deg); }} @keyframes wave { to { -webkit-transform: rotate(135deg); transform: rotate(135deg); }} .incaase{ display: block; overflow: hidden; padding: 60px 0 0;} .incaase .text{ display: block; overflow: hidden; margin-bottom:20px;} .incaase .text strong{ display: block; text-align: center; color: #fff; font-size: 60px; line-height: 1.2em; font-weight: normal;} .incaase .text strong i{-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde);font-style: inherit;} .incaase .text span{ color: #fff; font-size: 30px; text-align: center; display: block; line-height: 1.2em; margin: 30px 0;} .iclist{ display: block; overflow: hidden; position: relative; width:99%; margin: 0 auto; padding-bottom:80px; } .iclist a{ display: block; overflow: hidden; float: left; width:33%; margin:0 0.5% 0.5% 0; position: relative;border-radius: 1.5rem;} .iclist a:nth-child(3n){margin-right:0; top:40px; } .iclist a:nth-child(2),.iclist a:nth-child(5),.iclist a:nth-child(8),.iclist a:nth-child(11),.iclist a:nth-child(14),.iclist a:nth-child(17),.iclist a:nth-child(20),.iclist a:nth-child(23),.iclist a:nth-child(26){ top: 80px;} .iclist a p{display: block; overflow: hidden; border-radius: 1.5rem;} .iclist a p img{display: block; width: 100%;transition: all .6s;opacity: 0.6;} .iclist a:hover p img{ opacity: 0.3;} .iclist a dd{ position: absolute;width: calc(100% - 40px);bottom: 0; left: 0; padding:10px 20px; border-radius: 0 0 1.25rem 1.25rem;} .iclist a dd strong{ display: inline-block; font-size: 40px; margin-right: 10px; font-weight: normal; color:#fff;} .iclist a dd span{display: inline-block; font-size: 12px; color: #fff; border: 1px solid #ddd; border-radius: 2em; padding: 5px 10px; zoom: 0.9; margin: 0 5px; } .iclist a:hover dd{ -webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0);} /*.iclist a::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,0.2); content: ''; -webkit-transition: -webkit-transform 0.6s; transition: transform 0.6s; -webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0); transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0); z-index: 9; }*/ .iclist a:hover::before { -webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0); transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0); } .btext { position: absolute; left: 0; top: 50%; transform: translateY(-50%); z-index: 10; } .btext .bname { display: block; line-height: 1; color: #fff; font-size: 18px; opacity: 0; visibility: hidden; position: relative; transition: all .65s; top: 100px;} .btext .bname h3{display: block; font-size: 80px; line-height: 1.2em; margin-bottom: 30px; background: linear-gradient(to right, #178cde 15%, #00ffe4 30%, #178cde 55%, #00ffe4 80%, #178cde 95%); background-size: 200% auto; color: #000; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: shine 5s linear infinite; } @keyframes shine { to { background-position: 200% center; } } .btext .bname h4{color: #fff; font-size: 30px; display: block; line-height: 1.2em; margin: 30px 0;} .btext .bname .more{margin:20px 0;} .btext.articleShow .bname{ opacity: 1; visibility: visible; top:0;} .btext.articleShow .bmore { transition-delay: 0.8s !important; } .bname .bgselogo{display: block; width: 190px; height: 190px; background: #666; border-radius: 50%; position: relative;overflow: hidden; margin:100px auto 0;} .bname .bgselogo img{display: block; width: auto; height: 30%; margin: 35% auto; filter: none; filter: grayscale(1) brightness(30); position: relative; z-index: 3;} .bname .bgselogo span{ background-image:linear-gradient(30deg, #651b93,#0068ff, #00b5a2);position: absolute; width: 100%; height: 100%; top: 0; left: 0; border-radius: 50%; -webkit-animation-name: spin; animation-name: spin; -webkit-animation-duration: 8s; animation-duration: 8s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear; } .bname .ttb{position: absolute; top: -120%; width: 100%; text-align: center;} .bname .ttb strong{ background: linear-gradient(to right, #178cde 15%, #00ffe4 30%, #178cde 55%, #00ffe4 80%, #178cde 95%); background-size: 200% auto; color: #000; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: shine 5s linear infinite;display: inline-block; text-align: center; font-size: 60px; font-weight: normal; line-height: 1.2em;} .bname .ttb span{ display: block; text-align: center; color: #fff; font-weight: normal; font-size: 24px; line-height: 1.2em; margin: 30px 0;} .programme { position: relative; z-index: 3; height: 200vh; } .programme-wrap {position: -webkit-sticky; position: sticky; left: 0; top: 0; width: 100%; height: 100vh; } .programme-bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-position: center; background-size: cover; z-index: 10; } .programme-bg.show .bimg { opacity: 1; visibility: visible; } .programme-bg .bimg { width: 100%; height: 100%; object-fit: cover; opacity: 0; visibility: hidden; transition: 4s; } .programme-text iframe{border: 0; width: 100%; position: absolute; top: 50%; left: 0%;opacity: 0.3;} .programme-text { width: 100%; z-index: 11; } .programme-mask { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 12; overflow: hidden; } .programme-mask-bg { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%;opacity:0; height: auto; background-size: 100% auto; } .programme-mask-bg .logolist{ position: relative; height: 500px;top: 80px; } .programme-mask-bg .logolist a{display: block; overflow: hidden; width: 70px; height: 70px; border-radius: 10px;} .programme-mask-bg .logolist a img{ display: block; height: 60%;margin: 20% auto 0; filter: none; filter: grayscale(1) brightness(30);} .programme-mask-bg .logolist a:nth-child(1){background: #222; position: absolute; left: 0; top: 30%; width: 90px;height: 90px;} .programme-mask-bg .logolist a:nth-child(2){background: #ff8200; position: absolute; left: 20%; top: 10%; } .programme-mask-bg .logolist a:nth-child(3){background: #00c250; position: absolute; left: 12%; top: 39%; width: 90px;height: 90px;} .programme-mask-bg .logolist a:nth-child(4){background: #d81e06; position: absolute; left: 8%; top: 70%; } .programme-mask-bg .logolist a:nth-child(5){background: #056de8; position: absolute; left: 30%; top: 27%; } .programme-mask-bg .logolist a:nth-child(6){background: #eb3661; position: absolute; left: 23%; top: 62%; } .programme-mask-bg .logolist a:nth-child(7){background: #ff6a00; position: absolute; left: 66%; top: 27%; width: 90px;height: 90px;} .programme-mask-bg .logolist a:nth-child(8){background: #0052d9; position: absolute; left: 68%; top: 62%; } .programme-mask-bg .logolist a:nth-child(9){background: #f90; position: absolute; left: 76%; top: 10%; } .programme-mask-bg .logolist a:nth-child(10){background: #00c250; position: absolute; left: 81%; top: 39%; } .programme-mask-bg .logolist a:nth-child(11){background: #06f; position: absolute; left: 79%; top: 70%; width: 90px;height: 90px;} .programme-mask-bg .logolist a:nth-child(12){background: #c7000b; position: absolute; left: 97%; top: 30%; } @keyframes xb1 { 25% { transform: translate(7%, -7%); } 50% { transform: translate(14%, 0%); } 75% { transform: translate(7%, 7%); } 100% { transform: translate(0%, 0%); } } @-webkit-keyframes xb1 { 0% { transform:translate(0%, 0%); } 25% { transform:translate(7%, -7%); } 50% { transform: translate(14%, 0%); } 75% { transform: translate(7%, 7%); } 100% { transform: translate(0%, 0%); } } .customers { position: relative; background:#000; } .customers-text { position: absolute; left: 0; top: 0; z-index: 2; width: 100%; height: 100vh; text-align: left; } .customers-bg { position: -webkit-sticky;position: sticky; left: 0; top: 0; width: 100%; height: 100vh; overflow: hidden; text-align: center; } .customers-bg img { display: block; position: absolute; left: 0; right: 0; top: 110px; bottom: 0; margin: auto; width: 100%; height: auto; transform-origin: left center; } .customers-down { position: relative; height: 150vh; } .customers-scoll {position: -webkit-sticky; position: sticky; left: 0; top: 0; height: 100vh; } .customers-data { position: absolute; right: 9.375%; top: 50%; display: flex; flex-flow: wrap; transform: translateY(-50%); width: 600px; z-index: 4; } .customers-data .tt{display: block;overflow: hidden;margin: 20px 0;} .customers-data .tt strong{ -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit; font-size: 60px; font-weight: normal;} .customers-data .tt span{display: block; color: #fff; font-size: 24px;} .customers-dit { position: absolute; left: 0; top: 5%; width: 54.4%; height: 90%; z-index: 4; opacity: 0; visibility: hidden; transition: 0.88s; } .customers-dit.show { opacity: 1; visibility: visible; } .customers-dit-item { position: absolute; margin-left: -15px; margin-top: -15px; width: 30px; height: 30px; border-radius: 50%; z-index: 10; } .customers-dit-item.dit-item1 { left: 30.5%; top: 25.1%; } .customers-dit-item.dit-item2 { left: 52.6%; top: 23.16%; } .customers-dit-item.dit-item3 { left: 18.18%; top: 51.42%; } .customers-dit-item.dit-item4 { left: 33.49%; top: 41.42%; } .customers-dit-item.dit-item5 { left: 39.6%; top: 34.69%; } .customers-dit-item.dit-item6 { left: 42.67%; top: 36.22%; } .customers-dit-item.dit-item7 { left: 42%; top: 46%; } .customers-dit-item.dit-item8 { left: 42.27%; top: 63.38%; } .customers-dit-item.dit-item9 { left: 56.07%; top: 44.89%; } .customers-dit-item.dit-item10 { left: 61.24%; top: 33.16%; } .customers-dit-item.dit-item11 { left: 69.85%; top: 43.16%; } .customers-dit-item.dit-item12 { left: 82.87%; top: 51.53%; } .customers-dit-item:nth-child(2n+2):before { animation-delay: 0.25s; } .customers-dit-item:nth-child(3n+3):before { animation-delay: 0.5s; } .customers-dit-item:before { position: absolute; left: 0; top: 0; content: ""; width: 100%; height: 100%; border: 1px solid #00c6ff; border-radius: 50%; box-sizing: border-box; animation: pulse 3s infinite; } .customers-dit-item:after { position: absolute; left: 50%; top: 50%; margin-left: -3px; margin-top: -3px; content: ""; width: 6px; height: 6px; background: #00c6ff; border-radius: 50%; } @keyframes pulse { 0% { opacity: 1; transform: scale(0); } 40% { opacity: 1; transform: scale(0); } 70% { opacity: 1; } 100% { opacity: 0; transform: scale(1); } } @keyframes bg { 100%{ background-position: -340px; } } @keyframes bg2 { 100%{ background-position: -370px; } } .inserver{ position: relative; display: block; overflow: hidden; padding:60px 0 0 ; background: #000; z-index: 99;} .inserver .icenter{ display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: center; -webkit-align-items: center; } .inserver dl{display: block;overflow: hidden;width:22%;position: relative; margin-top: 50px; } .inserver dl dd{ display: block; border: 1px solid #333;border-radius: 2rem;overflow: hidden; } .inserver dl:nth-child(2n){position: relative;top:-80px;} .inserver dl dd strong{ display: block; text-align:left; color: #fff; font-size: 1.8rem;position: absolute;bottom: -130px;left: 60px;font-weight: normal; width: calc(100% - 100px); z-index: 3; transition: all .3s;} .inserver dl dd strong span{ display: inline;text-align: left;position: relative; font-size: 36px;color: #fff;} .inserver dl dd strong span:after{ content: ""; display: block; width: 50px; height: 2px; background-image: linear-gradient(67deg, #0068ff,#00b5a2); margin-top: 20px; } .inserver dl dd:hover strong span{-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit;} .inserver dl dd strong p{ display: block;font-size: 18px;margin: 30px 0;opacity: 0; transition: all .3s; font-weight: normal;} .inserver dl dd:hover strong p{opacity:1;} .inserver dl dd img{ display: block; width: 100%;transition: all .3s;} .inserver dl dd:hover img{ -webkit-transform:scale(1.1); -moz-transform:scale(1.1); transform:scale(1.1);} .inserver dl dd:hover strong{bottom: 20px;} .inserver .text{ display: block; overflow: hidden; margin-bottom: 50px;} .inserver .text strong{ display: block; text-align: center; color: #fff; font-size: 60px; line-height: 1.2em; font-weight: normal;} .inserver .text strong i{-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde);font-style: inherit;} .inserver .text span{ color: #fff; font-size: 30px; text-align: center; display: block; line-height: 1.2em; margin: 30px 0;} @keyframes newIcon{ 0% { transform: translateY(-50px); } 50% { transform: translateY(0px); } 100% { transform: translateY(-50px); } } @keyframes newClip{ 0%{ clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%); } 50%{ clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%); } 100%{ clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%); } } .homenews{ background: #000; display: block; overflow: hidden; padding: 0px 0; position: relative; min-height: 500px; } .homenews h3{ display: block; color: #fff; font-size: 36px; line-height: 1.2em; margin-bottom: 30px;} .homenews .innewsta{display: block;overflow: hidden; margin-bottom: 30px;} .homenews .innewsta a{cursor:pointer;display: block; float: left; color: #fff; background:#14223e;padding: 10px 40px; border-radius: 2em; margin-right: 20px; font-size: 16px;} .homenews .innewsta a:hover,.homenews .innewsta .active{ background-image: linear-gradient(67deg, #0068ff, #00b5a2);} .homenews .innewicon{opacity: 0.3;position: absolute; top: 150px; right: 0; height:35%; width: auto; filter: grayscale(1) brightness(5); -webkit-filter: grayscale(1) brightness(5);animation: xb1 6s linear infinite;-webkit-animation: xb1 6s linear infinite;;} @keyframes xb1 { 0% { } 25% { transform: translate(7%,-7%); } 50% { transform: translate(14%,0%); } 75% { transform: translate(7%,7%); } 100% { transform: translate(0%,0%); } } @-webkit-keyframes xb1 { 0% { transform: translate(0%,0%); } 25% { transform: translate(7%,-7%); } 50% { transform: translate(14%,0%); } 75% { transform: translate(7%,7%); } 100% { transform: translate(0%,0%); } } .homenews .innewslist .inxwbb{position: relative;} .homenews .innewslist .inxwbb .swiper-slide{overflow: hidden;border-radius: 1rem 1rem 0 0;} .homenews .innewslist .inxwbb .swiper-slide img{ display: block;width: 100%;height: auto;} .homenews .innewslist .inxwbb .swiper-slide p{ background: rgba(10, 31, 58, 0.5);padding: 30px;display: block;overflow: hidden; border-radius: 0 0 1rem 1rem;} .homenews .innewslist .inxwbb .swiper-slide p strong{ display: block; font-size: 20px; color: #fff; line-height: 26px; font-weight: normal; } .homenews .innewslist .inxwbb .swiper-slide:hover p strong{ -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit;} .homenews .innewslist .inxwbb .swiper-slide p font{ display: inline-block; color: #fff; font-size: 14px; border: 1px solid #fff; padding: 2px 20px; border-radius: 2em; margin: 20px 0; opacity: 0.5;} .homenews .innewslist .inxwbb .swiper-slide p span{ display: block; color: #fff; font-size: 16px; opacity: 0.8;} .swipercontainerhomxw{display: block;overflow: hidden;} .homenews .innewslist .inxwbb .spt{position:absolute;background: rgb(20 61 112);color: #fff;width:40px;height:40px;text-align:center;line-height:40px;top:50%;left:-20px;z-index:9;font-size:24px;border-radius:50%; cursor:pointer;} .homenews .innewslist .inxwbb .fa-angle-right{ left: auto;right: -20px;} .waves { width: 100%; height: 60px; margin-bottom: -8px; left: 0; bottom: 0; width: 100%; z-index: 3; position: relative;background-image: linear-gradient(67deg, #0068ff, #00b5a2);} .parallax > use {animation: move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite;} .parallax > use:nth-child(1) {animation-delay: -2s;animation-duration: 7s;} .parallax > use:nth-child(2) {animation-delay: -3s;animation-duration: 10s;} .parallax > use:nth-child(3) {animation-delay: -4s;animation-duration: 13s;} .parallax > use:nth-child(4) {animation-delay: -5s;animation-duration: 20s;} @keyframes move-forever {0% {transform: translate3d(-80px,0,0);}100% { transform: translate3d(60px,0,0);}} .footerform{padding:2px 0;border-radius: 0;position: relative;display: block;overflow: hidden;background-image: linear-gradient(100deg, #651b93,#0068ff, #00b5a2); } .footer{ width: 100%;background: #000;padding:60px 0 60px; position: relative; z-index: 3;} .footer .fttop{display: block;overflow: hidden;margin-bottom: 10px;display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: top; -webkit-align-items: top;} .footer .fttop .left{display: block;overflow: hidden;} .footer .fttop .left span{ color:#8c99a6; line-height: 1.2em;margin: 0 0 20px 0;font-size: 24px; display: block;-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit; font-weight: bold; } .footer .fttop .left dl{ display:block;overflow: hidden;} .footer .fttop .left dl dd{display: block;float: left;overflow: hidden;margin-right: 20px;} .footer .fttop .left dl dd:last-child{margin-right:0;} .footer .fttop .left dl dd img{ display: block;height: 140px; border-radius: 4px;} .footer .fttop .left dl dd p{ color: #bcbfc8;font-size: 12px;display: block;text-align: center;margin-top: 5px; } .footer .fttop .cent{ display: block; overflow: hidden;} .footer .fttop .cent font{ color: #8c99a6; line-height: 1.2em; margin: 0 0 24px 0; font-size: 24px; display: block;-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit; font-weight: bold;} .footer .fttop .cent dd{ display: block;overflow: hidden;} .footer .fttop .cent dd span{display: block;overflow: hidden; margin-bottom:26px;} .footer .fttop .cent dd span a{color: #eee;font-size: 18px;line-height: 1.2em; font-weight: normal;} .footer .fttop .cent dd span a:hover{ -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit;} .footer .fttop .right{display: block;overflow: hidden;} .footer .fttop .right dd{ display: block;overflow: hidden;margin-bottom: 20px;} .footer .fttop .right dd span{color: #8c99a6; line-height: 1.2em; margin: 0 0 6px 0; font-size: 14px; display: block;} .footer .fttop .right dd a{color: #eee;font-size: 26px;line-height: 1.2em;} .footer .fttop .right .a0 a{ } .footer .fttop .right .a1 a{ font-size: 18px; } .footer .fttop .right .a2 a{font-size: 16px;} .footer .fttop .right .a1 span{font-size: 14px;} .footer .fttop .right dd p{display: block;overflow: hidden;margin-bottom: 20px;} .footer .fttop .right dd p span{font-size: 13px; } .footer .fttop .right dd p font{ display: block;color:#bcbfc8;font-size: 12px; margin-bottom: 5px;} .footer .fttop .right dd .a3 font{color: #eee;} .footer .fttop .right i{-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit; font-weight: bold; font-size: 24px; margin-bottom: 20px; display: block;} .footer .ftcenter{border-top: 1px solid hsla(0,0%,100%,.12);border-bottom: 1px solid hsla(0,0%,100%,.12);display: block;overflow: hidden;padding:10px 0; margin-bottom: 40px;} .footer .ftcenter dl{display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: top; -webkit-align-items: top; width: 90%; margin: 0 auto;} .footer .ftcenter dd{ display: block;overflow: hidden;opacity: 0.6;} .footer .ftcenter dd img{display: block;width: auto;height: 22px; margin: 0 auto;} .footer .ftcenter dd span{ width: 88px; margin:6px auto 0; line-height: 16px; text-align: center; color: #bcbfc8; font-size: 12px; display: block;zoom: 0.9;} .footer .ftbottom{ display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: center; -webkit-align-items: center;} .footer .ftbottom p{ color: #bcbfc8;font-size: 13px;} .footer .ftbottom dd{color: #bcbfc8;font-size: 13px;} .footer .ftbottom dt{} .footer .ftbottom dt a img{height: 16px;} .footer .ftbottom dt a{ margin-left: 20px;} .footer .ftbottom a{color: #bcbfc8;font-size: 13px; } .footer .ftbottom a:hover{ color:#fff; } .footer .ftlinks{display: block;overflow: hidden;margin-top: 30px;} .footer .ftlinks span{ display: block;float: left;color: #bcbfc8;margin-right: 10px;font-size: 12px;opacity: 0.5;} .footer .ftlinks p{display: block;float: left; line-height: 1.2em; background: #000;border-radius: 10px;} .footer .ftlinks p a{color: #bcbfc8;font-size: 12px;opacity: 0.2; margin-right: 8px;} .bannerpage{display: flex; overflow: hidden; height: 100%;} .bannerpage .icenter{ display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: center; -webkit-align-items: center;} .bannerpage .left{ position: relative;z-index: 9;width: 50%;} .bannerpage .left h3{ display: block; color: #fff; font-size:80px; line-height: 80px; background: linear-gradient(to right, #178cde 15%, #00ffe4 30%, #178cde 55%, #00ffe4 80%, #178cde 95%);background-size: 200% auto; color: #000; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: shine 5s linear infinite;} .bannerpage .left h4{ display: block; color: #fff; font-size: 36px; line-height: 36px; margin: 30px 0;} .bannerpage .left h5{ display: block; color: #fff; font-size:20px; margin: 0 0 30px 0;} .bannerpage .left .more{ margin: 30px 0 0;} .bannerpage .right{ width:70%; transform-style: preserve-3d; transform: rotateX(50deg) rotateY(2deg) rotateZ(30deg); position: absolute; top: -70%; left: 45%;} .bannerpage .right p{display: block; float: left; width: 49%; overflow: hidden; position: relative; border-radius:1rem;margin-bottom: 20px;} .bannerpage .right p:nth-child(2n){float: right; margin-left: 1%;top:80px; } .bannerpage .right p img{display: block; width: 100%; margin: 0 auto; border-radius: 1rem;} .bannerpage .lfex{ overflow: hidden;position: absolute; width: 100%; height: 100%; top: 0; left: 0; display: flex; } .bannerpage .rightyd{transform-style: preserve-3d; transform: rotateX(50deg) rotateY(2deg) rotateZ(30deg); width: 60%; left: 50%; top: -40%;} .bannerpage .rightyd p{ width: 32%;margin-right: 2%;} .bannerpage .rightyd p:nth-child(2n){margin-right: 2%; top: 0; margin-left:0;} .bannerpage .rightyd p:nth-child(3n){margin-right:0;} .bannerpage .rightmui{top: -33%; left: 50%; width: 50%; transform-style: preserve-3d; transform: rotateX(40deg) rotateY(-2deg) rotateZ(30deg);} .bannerpage .rightmui p{ border-radius: 10px; } .bannerpage .rightmui p img{ border-radius: 10px;} .bannerpage .rightvideo{ top: -39%; left: 50%; width: 50%; transform-style: preserve-3d; transform: rotateX(40deg) rotateY(6deg) rotateZ(30deg);} .pagenews .innewicon { opacity: 0.3; position: absolute; top: 150px; right: 0; height: 35%; width: auto; filter: grayscale(1) brightness(5); -webkit-filter: grayscale(1) brightness(5); animation: xb1 6s linear infinite; -webkit-animation: xb1 6s linear infinite; ;} .pagenews{ display: block; overflow: hidden; position: relative; padding: 100px 0;background: url(../image/bg3.svg); background-size: cover;} .pagenews h3{ display: block; color: #fff; font-size: 36px; line-height: 1.2em; margin-bottom: 30px;} .pagenews dl{overflow: hidden;margin-bottom:30px;display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between;align-items:top;-webkit-align-items:top;position: relative;z-index: 9;} .pagenews dl a{ display: block; overflow: hidden; width: 23.5%;} .pagenews dl a p{display: block; overflow: hidden;border-radius: 1rem 1rem 0 0;} .pagenews dl a p img{display: block; width: 100%; height: auto;transition: all .3s;} .pagenews dl a dd{ background: rgba(10, 31, 58, 0.5); padding: 30px; display: block; overflow: hidden; border-radius: 0 0 1rem 1rem; } .pagenews dl a dd strong{ display: block; font-size: 20px; color: #fff; line-height: 26px; font-weight: normal;} .pagenews dl a dd font{ display: inline-block; color: #fff; font-size: 12px; border: 1px solid #fff; padding: 2px 20px; border-radius: 2em; margin: 20px 0; opacity: 0.5;} .pagenews dl a dd span{ display: block; color: #fff; font-size: 14px; opacity: 0.8;} .pagenews dl a:hover p img{ -webkit-transform:scale(1.1); -moz-transform:scale(1.1); transform:scale(1.1);} .pagenews dl a:hover dd strong{-webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; background-image:linear-gradient(to right, #178cde, #00ffe4 50%, #178cde);font-style: inherit;} .pagebg{background: #000; position: relative; z-index: 3;} .techicon{display: block; overflow: hidden; padding: 100px 0; position: relative;} .techicon h3{ display: block; color: #fff; font-size: 60px; line-height: 60px; background: linear-gradient(to right, #178cde 15%, #00ffe4 30%, #178cde 55%, #00ffe4 80%, #178cde 95%); background-size: 200% auto; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: shine 5s linear infinite;text-align: center;} .techicon h6{ color: #fff; font-size: 30px; text-align: center; width: 50%; margin: 30px auto; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit;} .techicon .icenter{ margin-top: 50px; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: top; -webkit-align-items: top; } .techicon .icenter dd{display: block; overflow: hidden; width: 23.5%; position: relative;} .techicon .icenter dd h4{ display: block;color: #fff;font-size: 28px;margin-bottom: 30px;border-bottom: 1px solid #444;padding-bottom: 10px;} .techicon .icenter dd h5{display: block; overflow: hidden;} .techicon .icenter dd h5 strong{ display: block; overflow: hidden; margin-bottom: 20px;} .techicon .icenter dd h5 strong font{ position: relative;background-image: linear-gradient(67deg, #0068ff,#00b5a2); position: relative; float: left; width: 60px; height: 60px; border-radius: 50%; display: flex;} .techicon .icenter dd h5 strong font:after{ content: ""; position: absolute; width: 56px; height: 56px; background: #000; border-radius: 50%; top: 2px; left: 2px;} .techicon .icenter dd h5 strong font img{ filter: none; filter: grayscale(1) brightness(30); display: block; height: 60%; margin: 20%; position: relative; z-index: 3;} .techicon .icenter dd h5 strong span{ font-weight: normal;display: block; color: #fff; font-size: 20px; float: left; line-height: 30px; margin: 10px 0 0 10px; } .webcase{display: block; overflow: hidden; padding: 100px 0; position: relative;text-align: center;background: url(../image/bannerbg25602.png);background-size: cover;} .webcase h3{-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;background-image:linear-gradient(to right,#178cde,#00ffe4 50%,#178cde);font-style:inherit;font-size:60px; text-align:center; display: inline-block;line-height: 1;} .webcase h4{display: block; font-size: 30px; color: #fff; text-align: center; margin: 30px 0;} .webcase .clt{ display: block;overflow: hidden;margin-top: 50px;} .toright{ width: calc(420px * 9 + 9 * 24px); animation: right-effect 40s linear infinite; } .toleft{ width: calc(420px * 9 + 9 * 24px); animation: left-effect 40s linear infinite; margin-top: 1.5rem;} .resourcerow { will-change: transform; display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important;} .resourcerow a{ border-radius: 1rem;width:28rem;height: 16rem; overflow: hidden; margin: 0 16px; text-align: center; background-color: #e7e8ea; will-change: transform; transition: transform .4s ease-out;} .resourcerow a img{ display: block;width: 100%;height: 100%;} .clt .resourcerow:hover { animation-play-state: paused; } @keyframes left-effect { 0% { transform: translateX(0) } 100% { transform: translateX(-50%) } } @keyframes right-effect { 0% { transform: translateX(-50%) } 100% { transform: translateX(0) } } .line{ background-image: linear-gradient(67deg, #0068ff,#00b5a2); display: block; width: 100%; height: 4px;} .flow{display: block; overflow: hidden; padding: 150px 0 100px; position: relative;} .flow h3{ display: block; text-align: center; color: #fff; font-size: 60px; line-height:1em;} .flow h3 span{ -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit;} .flow h4{ margin: 30px 0; margin-bottom: 50px; color: #fff; font-size: 30px; text-align: center;} .flow .tta{display: block; overflow: hidden; margin-bottom:50px;} .flow .tta a{cursor: pointer; display: block; float: left; color: #fff; background: #14223e; padding: 5px 30px; border-radius: 2em; margin-right: 20px; font-size: 14px;} .flow .tta .active{background-image: linear-gradient(67deg, #0068ff, #00b5a2);} .flow .bba{} .flow .bba dl{ overflow: hidden; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: top; -webkit-align-items: top;} .flow .bba dl dd{} .flow .bba dl dd p{} .flow .bba dl dd p i{ padding-left: 50px; display: block; overflow: hidden; color: #fff;text-align:center;font-style: initial;} .flow .bba dl dd p span{display:block;width:36px;height:36px;background-image:linear-gradient(67deg,#0068ff,#00b5a2);border-radius:50%;line-height:36px;font-size:14px;margin:0 auto;position: relative;z-index: 1;} .flow .bba dl dd p span:after{ content: ""; position: absolute; width: 34px; height: 34px; background: #000; top: 1px; left: 1px; border-radius: 50%; z-index: -1;} .flow .bba dl dd p font{display: block; color: #fff; font-size: 30px; margin: 30px 0; position: relative; padding-left: 50px;} .flow .bba dl dd p font:after{content: "";display:block; width: 46px; height:1px; background-image: linear-gradient(67deg, #0068ff, #00b5a2); position: absolute; top: 50%; left: 0; transform: translate(0%, -50%); } .flow .bba dl dd .t{ color: #fff; font-size: 18px; opacity: 0.8; padding-left: 50px; margin-bottom: 30px;} .flow .bba dl dd .b{ display: block; overflow: hidden; padding-left: 50px;} .flow .bba dl dd .b strong{ display: block; color: #fff; font-weight: normal; margin: 12px 0; padding-left: 15px; position: relative;} .flow .bba dl dd .b strong:after{ content: "";background-image:linear-gradient(67deg, #0068ff, #00b5a2);position:absolute;width:6px;height:6px; border-radius: 50%; top: 50%; left: 0; transform: translate(0%, -50%);} .flow .bba dl dd .s{ color: #fff; padding-left: 50px; margin-top: 30px;} .wstip{display: block; overflow: hidden; padding: 150px 0 0; position: relative;} .wstip h3{ display: block; text-align: center; color: #fff; font-size: 60px; line-height:1em; margin-bottom: 50px; } .wstip h3 span{ -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit;} .wstip dl{ overflow: hidden; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: top; -webkit-align-items: top;} .wstip dl dd{ cursor:pointer; display: block; overflow: hidden; width: calc(23% - 80px); padding:50px 40px; position: relative;border-radius: 10px;transition: all .6s;} .wstip dl dd strong{ display: block; color: #fff; font-size: 20px; font-weight: normal;} .wstip dl dd p{ display: block;overflow: hidden;margin: 100px 0;} .wstip dl dd p span{ display: block; color: #fff; font-size: 50px; line-height: 1.2em; margin-bottom: 20px;} .wstip dl dd p font{ display: block;color: #fff;font-size: 18px;} .wstip dl dd i{ color: #fff; font-style: inherit; font-size: 12px; width: 36px; height: 36px; display: block; text-align: center; line-height: 36px; border: 1px solid #000; border-radius: 50%;} .wstip dl dd:nth-child(1){border: 1px solid #146ef5;} .wstip dl dd:nth-child(2){border: 1px solid #ff6b00;} .wstip dl dd:nth-child(3){border: 1px solid #ed52cb;} .wstip dl dd:nth-child(4){border: 1px solid #00d722;} .wstip dl dd:nth-child(1):hover{background:#146ef5;} .wstip dl dd:nth-child(2):hover{background:#ff6b00;} .wstip dl dd:nth-child(3):hover{background:#ed52cb;} .wstip dl dd:nth-child(4):hover{background:#00d722;} .wstip dl dd:hover i{ color: #000; border: 1px solid #000; } .wstip dl dd:hover strong,.wstip dl dd:hover span,.wstip dl dd:hover font{color:#000;} .option2323{position: absolute; top: -50px; left: -50px; height: 35%; width: auto; animation: xb1 6s linear infinite; -webkit-animation: xb1 6s linear infinite;} .webcenterpic{ position: relative; height: 100%; } .webcenterpic .lf{color:#fff; font-size:2rem; width: 45%;position: -webkit-sticky; position: sticky;top: 50%;transform: translate(0%, -50%);float: left; padding-top: 100px;} .webcenterpic .lf h3{display: inline-block; text-align: left; font-size: 60px; line-height:1em; margin: 30px 0; background: linear-gradient(to right, #178cde 15%, #00ffe4 30%, #178cde 55%, #00ffe4 80%, #178cde 95%); background-size: 200% auto; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: shine 5s linear infinite; } .webcenterpic .lf h4{ display: block;color: #fff;font-size:30px; ;} .webcenterpic .lf dl{ display: block; overflow: hidden; margin-top: 30px; position: relative;z-index: 3;} .webcenterpic .lf dl a{position:relative;display:inline-block;float:left;margin:0 20px 20px 0;background-image:linear-gradient(67deg, #0068ff,#00b5a2);border-radius:2rem;overflow:hidden;padding:10px 20px 10px 20px;} .webcenterpic .lf dl a img{ display: block; width: auto; height:26px; float: left; filter: none; filter: grayscale(1) brightness(30);margin-right: 10px;} .webcenterpic .lf dl a font{ display: block; font-size: 16px; vertical-align: top; float: left; line-height:26px; color: #fff; font-weight: normal;} .webcenterpic .lf dl a:hover{opacity: 0.5;} .webcenterpic .lf .lgiocn{ position: absolute; top: -10%; left: -50%; height: auto; width: auto; animation: xb1 6s linear infinite; -webkit-animation: xb1 6s linear infinite;} .webcenterpic .rh{ display: block; width:45%; margin: 0 0 0 55%; position: relative; } .webcenterpic .rh dd{width: 100%;overflow: hidden;margin: 10px 0;} .webcenterpic .rh img{ display: block;width: auto;max-width: 100%; border-radius: 6px;} .webcenterpic .rh dd:nth-child(2n){ overflow: hidden;margin-left: 100px;} .webcenterpic2 .icenter .rh{overflow: hidden;} .webcenterpic2 .icenter .rh dl{ display: block;float: left;width: 48%;} .webcenterpic2 .icenter .rh dl:nth-child(2n){ float: right;float: right; margin-top: 100px;} .webcenterpic2 .icenter .rh dl dd:nth-child(2n){margin-left:0; } .webcenterpic2 .icenter .rh dl dd{margin-bottom:30px; } .ws2tip{} .ws2tip .icenter h3{ margin-bottom: 30px; } .ws2tip .icenter h4{ display: block; color: #fff; text-align: center; margin-bottom: 50px; font-size: 30px;} .ws2tip .icenter dl{ padding: 100px 0;} .ws2tip .icenter dl dd{padding: 0; border: 0; width: 22%; background: none !important;} .ws2tip .icenter dl dd img{ display: block; border-radius: 10px; width: 100%;} .ws2tip .icenter dl dd:nth-child(2n){ position: relative;top: -100px;} .wstip3{ padding-bottom:200px; } .pagecase{padding:0; } .bannermore { position: absolute; width: auto; z-index: 9; bottom: 20px; transform: translate(-50%, 0%); left: 50%; cursor: pointer; transition: all .3s; } .bannermore .a1{ -webkit-animation-name: spin; animation-name: spin; -webkit-animation-duration: 4s; animation-duration: 4s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear; display: block; height: 100px; } .bannermore strong{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 50px; height: 50px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; } .bannermore strong span { position: relative; display: block; background: #fff; width: 18px; height: 28px; border-radius: 2rem; opacity: 0.8; } .bannermore strong span:after {position:absolute;content: "";width:4px;height:9px;background:#aaa;border-radius:4rem;left:50%;top:50%;transform:translate(-50%, -50%);animation:1.5s linear 0.5s infinite hua; } .bannermore:hover { opacity: 0.8; } .bannercase .lfex{ position: absolute; width: 100%; height: 100%; top: 0; left: 0;} @keyframes spin{ to{transform: rotate(1turn);} } @keyframes spin2{ to{transform: rotate(-1turn);} } @keyframes spin-reverse{ from{ transform:rotate(1turn); } } @keyframes spin-reverse2{ from{ transform:rotate(-1turn); } } @keyframes anim{ 0% { -webkit-transform: rotate(0) translate(1%, 0) rotate(0); transform: rotate(0) translate(1%, 0) rotate(0); } 50% { -webkit-transform: rotate(180deg) translate(1%, .3%) rotate(-180deg); transform: rotate(180deg) translate(1%, .3%) rotate(-180deg); } 100% { -webkit-transform: rotate(360deg) translate(1%, 0) rotate(-360deg); transform: rotate(360deg) translate(1%, 0) rotate(-360deg); } } @-webkit-keyframes anim{ 0% { -webkit-transform: rotate(0) translate(1%, 0) rotate(0); transform: rotate(0) translate(1%, 0) rotate(0); } 50% { -webkit-transform: rotate(180deg) translate(1%, .3%) rotate(-180deg); transform: rotate(180deg) translate(1%, .3%) rotate(-180deg); } 100% { -webkit-transform: rotate(360deg) translate(1%, 0) rotate(-360deg); transform: rotate(360deg) translate(1%, 0) rotate(-360deg); } } @-ms-keyframes anim{ 0% { -webkit-transform: rotate(0) translate(1%, 0) rotate(0); transform: rotate(0) translate(1%, 0) rotate(0); } 50% { -webkit-transform: rotate(180deg) translate(1%, .3%) rotate(-180deg); transform: rotate(180deg) translate(1%, .3%) rotate(-180deg); } 100% { -webkit-transform: rotate(360deg) translate(1%, 0) rotate(-360deg); transform: rotate(360deg) translate(1%, 0) rotate(-360deg); } } @keyframes anim2{ 0% { -webkit-transform: rotate(0) translate(1%, 0) rotate(0); transform: rotate(0) translate(1%, 0) rotate(0); } 50% { -webkit-transform: rotate(-180deg) translate(1%, .3%) rotate(180deg); transform: rotate(-180deg) translate(1%, .3%) rotate(180deg); } 100% { -webkit-transform: rotate(-360deg) translate(1%, 0) rotate(360deg); transform: rotate(-360deg) translate(1%, 0) rotate(360deg); } } @-webkit-keyframes anim2{ 0% { -webkit-transform: rotate(0) translate(1%, 0) rotate(0); transform: rotate(0) translate(1%, 0) rotate(0); } 50% { -webkit-transform: rotate(-180deg) translate(1%, 1%) rotate(180deg); transform: rotate(-180deg) translate(1%, 1%) rotate(180deg); } 100% { -webkit-transform: rotate(-360deg) translate(1%, 0) rotate(360deg); transform: rotate(-360deg) translate(1%, 0) rotate(360deg); } } .bubbles-bg{ position: relative; height: 100%; visibility: inherit; opacity: 1; } .bubbles-bg .bubble{ position: absolute; } .bubbles-bg .bubble .circle{ border-radius: 100%; position: absolute; left: 0; top: 0; width:100%; height: 100%; } .bubbles-bg .bubble1{ width:6%; padding-top: 6%; left: 26.875%; top: -6.67%; } .bubbles-bg .bubble1 .circle{ border:1px solid #fff; } .bubbles-bg .bubble2{ width:12px; padding-top: 12px; left: 13.54%; top: 18%; } .bubbles-bg .bubble2 .circle{ background-color: #777; } .bubbles-bg .bubble3{ width:36px; padding-top: 36px; left: 8.854%; top: 30.55%; } .bubbles-bg .bubble3 .circle{background-image: linear-gradient(67deg, #0068ff,#00b5a2);opacity: 0.3;} .bubbles-bg .bubble4{ width:56.875%; padding-top: 56.875%; left: -28.6458%; top: 51.85%; } .bubbles-bg .bubble4 .circle{ background-image: linear-gradient(67deg, #0068ff, #00b5a2);opacity: 0.3;} .bubbles-bg .bubble5{ width:54px; padding-top: 54px; left: 26.3%; top: 70.83%; } .bubbles-bg .bubble5 .circle{background-color: rgba(255, 0, 0, 1);opacity: .1;} .bubbles-bg .bubble6{ width:56.875%; padding-top: 56.875%; left: 73.4375%; top: -52.77%; } .bubbles-bg .bubble6 .circle{ background-image: linear-gradient(67deg, #0068ff,#00b5a2); opacity: 0.3; } .bubbles-bg .bubble7{ width:2rem; padding-top: 2rem; left: 60.9375%; top: 18.5%; } .bubbles-bg .bubble7 .circle{ background-color: #444; } .bubbles-bg .bubble8{ width:1.35rem; padding-top: 1.35rem; left: 95.83%; top: 70.83%; } .bubbles-bg .bubble8 .circle{ border:1px solid #fff; } .bubbles-bg .bubble9{ width:16px; padding-top: 16px; left: 76.5625%; top: 96.296%; } .bubbles-bg .bubble9 .circle{ background-color: #fff; } .bubbles-bg .bubble10{ width:56.875%; padding-top: 56.875%; left: 71.354%; top:87%; } .bubbles-bg .bubble10 .circle{ background-image: linear-gradient(67deg, #0068ff,#00b5a2);opacity: 0.3;} .bubbles-bg .bubble{ animation:spin 8s infinite linear; transform-origin: 50% 45%; } .bubbles-bg .bubble:nth-child(2n){ animation:spin2 8s infinite linear; } .bubbles-bg .bubble .circle{ animation:spin-reverse 8s infinite linear; } .bubbles-bg .bubble:nth-child(2n) .circle{ animation:spin-reverse2 8s infinite linear; } .bubbles-bg .sm-bubble{ transform-origin: 30% 30px; } .bannercase{position:relative;height:100%;width:100%; display: block;overflow: hidden; display: flex; align-content: center; justify-content: center; align-items: center; } .bannercase .icenter{ position: absolute; z-index: 3; top: 50%; left: 50%; transform: translate(-50%, -50%); } .bannercase .icenter p{display: block; color: #fff; font-size: 40px; margin-bottom: 30px; line-height: 1; -webkit-background-clip: text;background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit;} .bannercase .icenter h3{ display: block; color: #fff; font-size:80px;line-height: 1;margin-bottom: 30px; } .bannercase .icenter h3 span{ background: linear-gradient(to right, #178cde 15%, #00ffe4 30%, #178cde 55%, #00ffe4 80%, #178cde 95%); background-size: 200% auto; color: #000; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: shine 5s linear infinite;} .bannercase .icenter h4{display: block; color: #fff; font-size: 26px; } .bannercase .icenter .taict{margin-bottom:0; } .bannercase .icenter .more{margin:0; } .bannercase .rh{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 1; } .pctt{display: block; overflow: hidden; position: relative; padding: 100px 0 50px; text-align: center;} .pctt h3{line-height: 1;-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit; font-size: 60px; text-align: center; display: inline-block;} .pctt h4{ display: block; color: #fff; text-align: center; font-size: 26px; width:700px; margin: 0 auto; line-height: 36px; margin-top: 30px; } .pcaa{ display: block; overflow: hidden; text-align: center; margin-bottom: 100px;} .pcaa a{ cursor: pointer; display: inline-block; color: #fff; background: #14223e; padding: 10px 40px; border-radius: 2em; margin-right: 20px; font-size: 16px;} .pcaa .active,.pcaa a:hover{ background-image: linear-gradient(67deg, #0068ff, #00b5a2);} .casebgbt{display: block;overflow: hidden;position: relative; height: auto; padding: 100px 0;} .casebgbt dl{ position: relative; width: 100%; height: 100%; top: 0; left: 0; display: flex; flex-wrap: nowrap; align-content: center; justify-content: center; align-items: center;} .casebgbt dl .svg{ animation: spin-reverse2 16s infinite linear; opacity: 0.7; display: block; position: absolute; top: 0; left: 0; width: auto; } .casebgbt dl .txt{ text-align: center; position: relative; z-index: 3; width:70%;} .casebgbt dl .txt h3{ background: linear-gradient(to right, #178cde 15%, #00ffe4 30%, #178cde 55%, #00ffe4 80%, #178cde 95%); background-size: 200% auto; color: #000; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: shine 5s linear infinite; display: inline-block; font-size: 36px; line-height: 1.2em; margin-bottom: 30px;} .casebgbt dl .txt h4{margin-bottom: 30px;-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit; font-size: 60px; line-height: 1.1em; text-align: justify; text-align-last: center;} .casebgbt dl .txt .taict{ margin-bottom:0; } .abbanner{position: relative; height: 100%; width: 100%; display: block; overflow: hidden; display: flex; align-content: center; justify-content: center; align-items: center;} .abbanner .lfex{ position: absolute;width:100%;height:100%; top: 0; left: 0; display: flex; flex-wrap: nowrap; align-content: center; justify-content: center; align-items: center;} .abbanner .lfex:after{ content: ""; background: #000; width: 100%; height: 100%; display: block; opacity: 0.7; position: absolute;top: 0;left: 0;} .abbanner .lfex .txt{position: relative; z-index:3;} .abbanner .lfex h3 span{ display: block; color: #fff; font-size:30px; text-align: justify; width:70%; } .abbanner .lfex h3 strong{line-height: 1;background: linear-gradient(to right, #178cde 15%, #00ffe4 30%, #178cde 55%, #00ffe4 80%, #178cde 95%); background-size: 200% auto; color: #000; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: shine 5s linear infinite; font-size:60px; font-weight:normal; margin-bottom: 30px; display: inline-block;} .abbanner .lfex .absvg{position:absolute;top:150px;right:150px;height:330px;width:auto;animation:xb1 6s linear infinite;-webkit-animation:xb1 6s linear infinite;z-index:2;opacity:0.5;} .abpenum{ background: none; padding: 0; margin-top: 50px;} .abpenum .num dd strong,.abpenum .num dd p font{-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;background-image:linear-gradient(to right,#178cde,#00ffe4 50%,#178cde); font-style:inherit;font-size: 20px;} .wzbg { color: #fff; background: rgba(0, 0, 0, .8); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);padding: 100px 0; } .wzbg h3{ -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); display: inline-block; font-size: 60px; line-height: 1; margin-bottom: 30px;} .wzbg h4{display: block; color: #fff; font-size:30px; width: 70%; } .wzbg .absvg{ position: relative; margin-bottom: 50px; left: -200px; height: 60px; width: auto; animation: xb1 6s linear infinite; -webkit-animation: xb1 6s linear infinite; z-index: 2; opacity: 0.8; display: block;} .gloo { position: absolute; z-index: -1; width: 100%; height: 100vh;top: 0; } .htcoo {position:relative;top:0;left:0;bottom:0;z-index:-1;width:100%;height:100%;padding-top: 0; perspective: 1000px; display: flex; justify-content: center; align-items:center; } .nmnoo { display: flex; flex-wrap: wrap; justify-content: center; align-content: center; transform: rotate(-5deg) scale(1.2); } .aaawrap { display: flex; will-change: transform; margin: 0.5% 0; justify-content: space-around; } .akt { width: 19%; padding: 0; display: block; overflow: hidden; border-radius: 1rem; border: 2px solid #000; } .akt img{ display: block; width:100%; } .abgl{ position: relative; height: 100vh; display: block; overflow: hidden; z-index: 3; background: #000;padding-bottom: 50px; } .aaawrapsj{display: none;} .aaawrapsj .akt{width:32%;} .ablogo{ position: relative; display: block; padding:150px 0 100px;background: url(../image/bg7.svg); background-size: cover; } .ablogo .absvg{ position: absolute; right:100px; top:150px; height: 60px; width: auto; animation: xb1 6s linear infinite; -webkit-animation: xb1 6s linear infinite; z-index: 2; opacity: 0.5; display: block;} .ablogo h3,.history h3{-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); display: inline-block; font-size: 60px; line-height: 1; margin-bottom: 30px;} .ablogo h4,.history h4{display: block; color: #fff; font-size:30px; margin-bottom: 100px; } .ablogo dl{display: block; overflow: hidden;} .ablogo dl dd{ display: block; float: left; width: 11.625%; border-radius: 6px; overflow: hidden; margin: 0 1% 1% 0;} .ablogo dl dd:nth-child(8n){ margin-right:0;} .ablogo dl dd img{display: block;width: 100%;} .history{position: relative; display: block; padding:100px 0 100px;background: url(../image/bg3.svg);background-size: cover; } .hlist{ color:#fff; position: relative;display: block;width: 100%;overflow: hidden; padding-bottom: 100p } .index-milepost-swiper{ padding-top: 80px;} .hlist .index-milepost-swiper .swiper-slide{ opacity: 0.2;text-align: center;cursor:pointer; } .hlist .index-milepost-swiper .swiper-slide:nth-child(2n){ top: -80px; padding-bottom: 80px; } .hlist .index-milepost-swiper .swiper-slide-active{ opacity:1; } .hlist .index-milepost-swiper .swiper-slide .data{ display: inline-block;overflow: hidden;} .hlist .index-milepost-swiper .swiper-slide .data .b1{text-align: right;display: block;color: #fff;font-size:50px;line-height: 1.2em;font-family: num;} .hlist .index-milepost-swiper .swiper-slide .data .b2{font-weight:100;text-align:right;display:block;color:#fff;font-size:120px;font-family: num;line-height: 1;} .hlist .index-milepost-swiper .swiper-slide-active .b1,.hlist .index-milepost-swiper .swiper-slide-active .b2{ -webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde);} .index-milepost-text-swiper{width: 1000px;margin: 0 auto 50px;} .index-milepost-text-swiper .t2{display: block;width:100%;text-align: center;margin: 0 auto;position: relative;} .index-milepost-text-swiper .t2 p{text-align: center;display: inline-block;font-size: 40px;background: linear-gradient(to right, #178cde 15%, #00ffe4 30%, #178cde 55%, #00ffe4 80%, #178cde 95%);background-size: 200% auto;color: #000;background-clip: text;text-fill-color: transparent;-webkit-background-clip: text;-webkit-text-fill-color: transparent;animation: shine 5s linear infinite;} .index-milepost-text-swiper .t2 span{background-image: linear-gradient(67deg, #0068ff,#00b5a2); display: block; width: 120px; border-radius: 2rem; margin: 0 auto 20px; line-height: 40px; font-size: 18px; position: relative; overflow: hidden;} .index-milepost-text-swiper .t2 span:after{ content: ""; position: absolute; width: calc(100% - 4px); height: calc(100% - 4px); background: #000; top:2px; left:2px; border-radius: 2rem; z-index: 1; } .index-milepost-text-swiper .t2 span i{position: relative; z-index: 3; font-style: inherit;font-family: num; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-size: 20px;} .hlist .index-milepost-text-swiper .swiper-slide{overflow: hidden;} .hlist .index-milepost-text-swiper .swiper-slide .t2{opacity: 0; } .hlist .index-milepost-text-swiper .swiper-slide-active .t2{ opacity: 1;transition: all 2s; } .hlist .tpa{width: 50px; height: 50px; background-image: linear-gradient(67deg, #0068ff,#00b5a2); border-radius: 50%; position: absolute; top: 0; right: 50px; cursor: pointer; text-align: center; line-height: 50px; z-index: 9;} .hlist .milepostbuttonprev{ right:130px; } .hlist .swiper-button-disabled{ opacity: 0.5; cursor: inherit;} .history .absvg{position:absolute;left:0;top:0;height:330px;width:auto;animation:xb1 6s linear infinite;-webkit-animation:xb1 6s linear infinite;z-index:2;opacity:0.5;display:block;} .screen-reader-text{display: none;} .fy{display: block; overflow: hidden; text-align: center; padding: 100px 0; position: relative;} .nav-links{display: block;overflow: hidden; text-align: center;} .fy span,.fy a{display: inline-block; width: 40px; height: 40px; color: #fff; background: #111; text-align: center; line-height: 40px; border-radius: 50%; margin: 0 10px;} .fy a:hover,.fy span{ background-image: linear-gradient(67deg, #0068ff,#00b5a2);} .se_rotate__D80so{display: block; height: 100%; width: 100%; max-width: 1000px; margin: 0 auto; animation: se_rotate__D80so 15s linear infinite; position: absolute;top: 0;left: 0;} @keyframes se_rotate__D80so { 0% { transform: rotate(0deg) } 50% { transform: rotate(180deg) translateX(-5vw) } to { transform: rotate(1turn) } } .se_rotate__D80so .se_bloom__2m3PW{position: absolute; height: 800px; width: 800px; transform: translate(-14%,-5%) scale(1.4);} .se_bloom__2m3PW:first-child { top: 10%; left: 10%; background-image: radial-gradient(#37315f,rgba(55,49,95,0) 65%); } .se_bloom__2m3PW:nth-child(2) { top: 40%; left: 50%; background-image: radial-gradient(#5a1b38,rgba(90,27,56,0) 65%); } .se_bloom__2m3PW:nth-child(3) { top: 0; left: 40%; background-image: radial-gradient(#280d44,rgba(40,13,68,0) 65%); } .se_bloom__2m3PW:nth-child(4) { top: 40%; left: 20%; background-image: radial-gradient(#280d44,rgba(40,13,68,0) 65%); } .bannercontact .icenter p{font-size:50px; } .bannercontact #canvas{position: absolute; z-index: 1; right: -40%; opacity: 0.5;} .bannercontact .icenter h4 font{ color: #fff; font-size: 50px; font-weight: normal; } .ccform{display: block; padding: 100px 0; overflow: hidden; position: relative;} .ccform h3{ display: block; overflow: hidden; margin-bottom:50px; } .ccform h3 strong,.callme h3{ background: linear-gradient(to right, #178cde 15%, #00ffe4 30%, #178cde 55%, #00ffe4 80%, #178cde 95%); background-size: 200% auto; color: #000; background-clip: text; text-fill-color: transparent; -webkit-background-clip:text;-webkit-text-fill-color:transparent;animation: shine 5s linear infinite;display: inline-block; line-height: 1; font-size: 60px; margin-bottom: 30px; font-weight: normal;} .ccform h3 font,.callme h4{ display: block; color: #fff; font-size: 26px; font-weight: normal;} .ccform .aa{ display: block;overflow: hidden;position: relative;} .ccform .aa .ct{ margin-bottom: 30px;display: block; overflow: hidden; position: relative; float: left; width: 49%; margin-right:0%; } .ccform .aa .ct:nth-child(2n){ margin-right:0; float: right; } .ccform .aa .txt,.ccform .bb .txt{display: block; color: #fff; font-size: 18px; line-height: 1.2em; margin-bottom: 10px; font-weight: normal;} .ccform .aa input{ display: block; border: 0; height: 50px; width: 100%; border-radius: 4px; text-indent: 20px; font-size: 18px; color: #0068ff; background-color:rgba(225, 225, 225, 0.9);} .ccform .wpcf7submit{ border: 0;cursor:pointer; margin-top: 30px; } .ccform .bb .ct{width: 100%;} .ccform .bb .ct textarea{display:block;width:calc(100% - 40px); border:0; border-radius:4px; padding:20px; line-height:36px; height:120px; font-size:18px; color: #0068ff; background-color:rgba(225, 225, 225, 0.9);} .ccform:after { content: ""; background: #000; width: 100%; height: 100%; display: block; opacity: 0.2; position: absolute; top: 0; left: 0; } .ccform .icenter{ position: relative; z-index: 3;width: 50%;} .ccform:before{ content: ""; border-radius: 100%; position: absolute; right: -100px; top: -150px; width: 800px; height: 800px; background-image: linear-gradient(67deg, #0068ff,#00b5a2); opacity: 0.3; /* animation: spin-reverse2 8s infinite linear; */ animation: spin2 8s infinite linear; transform-origin: 50% 45%;} .callme{display: block; padding: 100px 0; overflow: hidden; position: relative;} .callme .swipercontainer03{color: #fff; width: 98%; display: block; overflow: hidden; margin: 100px auto; position: relative; } .callme .swipercontainer03 .swiper-slide{opacity: 0.3;cursor:pointer;} .callme .swipercontainer03 .swiper-slide:after{ content: ""; position: absolute; width: 0; height: 2px; background: #ccc; border-radius: 2rem; top: 0; left: 0;} .callme .swipercontainer03 .swiper-slide-active:after{ width: 100%; background-image: linear-gradient(67deg, #0068ff,#00b5a2);transition: all 2s;} .callme .swipercontainer03 .swiper-slide-active{opacity:1;} .callme .swipercontainer03 .swiper-slide-active:after{ width: 100%; background-image: linear-gradient(67deg, #0068ff,#00b5a2);} .callme .swipercontainer03 .txt{display: block; overflow: hidden; padding:80px 50px; position: relative;opacity: 0.5;background: rgba(0, 0, 0, .1); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);text-align: center;} .callme .swipercontainer03 .txt strong{ text-align: center; display: inline-block; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit; font-size: 60px; line-height: 1; font-weight: normal; margin-bottom: 30px;} .callme .swipercontainer03 .txt span{display: block; width: 120px; background-image: linear-gradient(67deg, #0068ff,#00b5a2); text-align: center; border-radius: 2rem; overflow: hidden; position: relative; font-size: 16px; line-height: 30px; margin: 0 auto 50px;} .callme .swipercontainer03 .txt span:after{content: ""; position: absolute; width: calc(100% - 2px); height: calc(100% - 2px); top: 1px; left: 1px; background:#051620; border-radius: 2rem;} .callme .swipercontainer03 .txt span i{-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); position: relative; z-index: 2; font-style: inherit;opacity: 0.8;} .callme .swipercontainer03 .txt .desc{display: block;overflow: hidden;} .callme .swipercontainer03 .txt .desc p{display: block;font-size: 20px;margin-bottom: 10px; text-align: center;} .callme .swipercontainer03 .txt .desc p a{color: #fff;} .callme .swipercontainer03 .swiper-slide-active .txt{ opacity: 1;transition: all 1s; } .callme .icenter{position: relative;} .callme .icenter .fa{width: 50px; height: 50px; background-image: linear-gradient(67deg, #0068ff,#00b5a2); border-radius: 50%; position: absolute; top: 0; right: 50px; cursor: pointer; text-align: center; line-height: 50px; color: #fff;z-index: 9;} .callme .icenter .swiperslideprev{ right: 120px;} .callme .swiper-button-disabled{ opacity: 0.5;cursor: inherit;} .screen-reader-response{display: none;} .ccform span{ position: relative;} .ccform span span{position: absolute; top: 0; right: 10px; line-height: 40px; color: #f00; font-size: 14px;} .wpcf7-response-output,.wpcf7-validation-errors{display: block; text-align: center; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit; font-size: 20px; margin-top: 20px;} .newsbanner .lfex:after{opacity: 0;} .newsbanner .lfex h3 strong{font-size:80px;} .newsbanner .lfex h3 span{ width:100%;} .newsbanner .lfex .more{ margin: 0; } .newsbanner .lfex svg{position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 1;opacity: 0.3;} .pnaa{ padding:100px 0; margin-bottom: 0;} .newslist{display: block;overflow: hidden;min-height: 800px;} .newslist .icenter{ display: flex; display: -webkit-flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .newslist a{display: block; overflow: hidden; float: left; width: 23.5%; margin: 0 2% 40px 0; border-radius: 1rem;} .newslist a:nth-child(4n){margin-right:0; } .newslist a i{ display: block;overflow: hidden;} .newslist a i img{display: block;width: 100%;transition: all .3s;} .newslist a:hover i img{ -webkit-transform:scale(1.1); -moz-transform:scale(1.1); transform:scale(1.1);} .newslist a p{ display: block; overflow: hidden; background:rgba(10, 31, 58, 0.5); padding: 30px; border-radius: 0 0 1rem 1rem;} .newslist a p strong{ display: block;color: #fff;font-size: 20px;color:#fff;font-weight: normal; } .newslist a p font{ display: inline-block; color: #fff; font-size: 14px; border: 1px solid #fff; padding: 2px 20px; border-radius: 2em; margin: 20px 0; opacity: 0.5;} .newslist a p .fa,.pagenews dl a dd .fa,.homenews .innewslist .inxwbb .swiper-slide p .fa{ border: 0;float: right;font-size: 12px; padding: 0;line-height: 26px;} .newslist a p .fa:before,.pagenews dl a dd .fa:before,.homenews .innewslist .inxwbb .swiper-slide p .fa:before{margin-right:5px; } .newslist a p span{ display: block;color: #ccc;font-size: 14px;} .newslist a:hover p strong{-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit;} .teamlist{display: block;overflow: hidden;min-height: 800px;} .teamlist .icenter{ display: flex; display: -webkit-flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .teamlist a{display: block; overflow: hidden; float: left; width: 23.5%; margin: 0 2% 40px 0; border-radius: 1rem;} .teamlist a:nth-child(4n){margin-right:0; } .teamlist a i{ display: block;overflow: hidden;} .teamlist a i img{display: block;width: 100%;transition: all .3s;} .teamlist a:hover i img{ -webkit-transform:scale(1.1); -moz-transform:scale(1.1); transform:scale(1.1);} .teamlist a p{ display: block; overflow: hidden; background:rgba(10, 31, 58, 0.5); padding: 30px; border-radius: 0 0 1rem 1rem;} .teamlist a p strong{ display: block;color: #fff;font-size: 20px;color:#fff;font-weight: normal; } .teamlist a p font{ display: inline-block; color: #fff; font-size: 14px; border: 1px solid #fff; padding: 2px 20px; border-radius: 2em; margin: 20px 0; opacity: 0.5;} .teamlist a p .fa { border: 0;float: right;font-size: 12px; padding: 0;line-height: 26px;} .teamlist a p .fa:before{margin-right:5px; } .teamlist a p span{ display: block;color: #ccc;font-size: 14px;} .teamlist a:hover p strong{-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit;} .npb{ display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between;align-items:top;-webkit-align-items:top;margin-bottom:100px;border-top:1px solid #063e76;padding-top: 30px;} .npb .np{ display: block; overflow: hidden;} .npb .np span{ display: inline-block; color: #fff; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit; font-size: 18px;} .npb .np p{display: block; color: #fff; font-size: 20px; margin: 10px 0 0 0; max-width: 300px;} .npb .bl{ display: block; width: 70px; height: 70px; text-align: center; line-height: 70px; border: 1px solid #155474; border-radius: 50%; color: #0c77af; font-size: 16px;} .npb .bl:hover{color: #fff; border: 1px solid #fff; } .npb .np:hover p{-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit;} .newsshow{display: block; overflow: hidden;} .newsshow .tt{ padding:200px 0 100px; display: block; background: url(../image/aboutbg2.jpg) fixed; background-size: cover;} .newsshow .tt h3{ display: block; color: #fff; font-size: 60px; margin-bottom: 30px;} .newsshow .tt h4{display: block; } .newsshow .tt h4 font{ line-height: 42px;display: block; float: left; color: #fff; font-size: 18px; margin-right: 50px;} .newsshow .tt h5{ display: block;overflow: hidden;width: 100%;} .newsshow .tt h5 i{display: block; float: left; border: 1px solid #fff; color: #fff; font-style: inherit; font-size: 12px; border-radius: 2rem; padding: 2px 10px; margin-right: 10px; zoom: 0.9; opacity: 0.7;} .newsshow .tt span{display: inline-block; color: #fff; font-size: 18px; margin-bottom: 20px;} .newsshow .tt .share{} .newsshow .tt .share span{display: block;float: left; margin-right: 10px; line-height: 42px;} .newsshow .tt .share .social-share{ display: block;float: left;} .newsshow .tt .share .social-share a{display: block; position: relative; float: left; width:40px; height: 40px; border: 1px solid #fff; border-radius: 50%; margin-right: 10px; } .newsshow .tt .share .social-share a .wechat-qrcode{position: absolute;background:rgba(33, 34, 36, 0.95); padding:20px;border-radius:1em; width:160px;visibility: hidden; opacity: 0;transition: all 0.3s;left:-50px; } .newsshow .tt .share .social-share a:hover .wechat-qrcode{ visibility: visible; opacity: 1;} .newsshow .tt .share .social-share a .wechat-qrcode h4{display: block; color: #fff; font-size: 14px; text-align: center;} .newsshow .tt .share .social-share a .wechat-qrcode .qrcode img{margin: 10px auto; padding: 2px; background: #fff;} .newsshow .tt .share .social-share a .wechat-qrcode .help p{display: block; font-size: 12px; color: #fff; zoom: 0.8; text-align: center;} .newsshow .tt .share .social-share a .svgimg{ display: block; width: auto; height: 50%; margin: 25% auto; filter: none; filter: grayscale(1) brightness(30);} .newsshow .st{ display: block; overflow: hidden; margin: 20px auto 0; min-height: 500px; } .newsshow .st span,.newsshow .st font,.newsshow .st strong,.newsshow .st p,.newsshow .st dl,.newsshow .st dd,.newsshow .st dt{text-align: justify; color: #fff; font-size: 18px; margin: 0 0 5px 0;line-height: 30px;} .newsshow .st h1{color:white;font-size:40px;} .newsshow .st h2{color:white;font-size:30px;} .newsshow .st h3{color:white;font-size:18px;} .newsshow .st img{width: auto; max-width: 100%; height: auto; margin: 10px 0;border-radius: 10px;} .newsshow .st a{ color:#fff; } .newsshow .st pre{display: block; overflow: hidden; background: #03062d; border-radius: 10px; padding: 20px; color:#a6a9d1; border: 0; overflow-x: auto;} .newsshow .st pre code{} .bgng{ background-image:linear-gradient(67deg, #00094c,#045a51); display: block; overflow: hidden;} .bannercase .lgiocn{ position: absolute; top: 50%; left: -100px; height: auto; width: auto; animation: xb1 6s linear infinite; -webkit-animation: xb1 6s linear infinite; z-index: 1; margin-top: -300px;} .bannercaseshow .icenter{ z-index: 9;} .bannercaseshow .icenter p{ display: block; overflow: hidden; background-clip: inherit; background: none; } .bannercaseshow .icenter p .more{display: block; float: left; margin-right: 10px; height:36px;line-height: 36px;width: 120px; -webkit-text-fill-color: aliceblue; font-size: 14px; } .bannercaseshow .icenter p .more:last-child{margin-right:0;} .bannercaseshow .icenter h4{ margin-bottom: 50px;font-size: 28px;-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right,#178cde,#00ffe4 50%,#178cde); font-style: inherit;} .bannercaseshow .icenter h3,.bannercaseshow .icenter h4,.bannercaseshow .icenter p{ width: 33%;} .bannercaseshow .imgrh{position: absolute; width: 62%; top: 50%; right: 0; transform: translate(0%, -50%); border-radius: 1rem;} .caseshowbottom{width: 1500px;padding: 100px 0;} .caseshowbottom h3{line-height:1;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;background-image:linear-gradient(to right,#178cde,#00ffe4 50%,#178cde);font-style:inherit;font-size:40px;display:inline-block;margin:0 0 30px 0;} .caseshowbottom dl{ display: block;overflow: hidden;} .caseshowbottom dl a{display: block; overflow: hidden; float: left; width:32%; margin: 0 2% 0 0; position: relative; border-radius: 1.5rem; top: 0 !important;} .caseshowbottom dl a dd{padding: 40px 15px; width: calc(100% - 30px); -webkit-transform: translate3d(0,101%,0);transform: translate3d(0,101%,0);} .caseshowbottom dl a dd strong{ font-size: 36px; line-height: 1; } .caseshowbottom .more{width: 200px; float: none; margin: 0 auto; border-radius: 2em;} .caseshowbottom dl a dd .fa-eye{ display: inline-block;color: #fff;float: right;margin-top: 20px;font-size: 14px;} .sbtl{display: block; overflow: hidden; margin: 100px auto 0; border-bottom: 1px solid #00327c;padding-bottom: 100px; position: relative; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: center; -webkit-align-items: center;} .sbtl strong{display: block; font-size:40px; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right,#178cde,#00ffe4 50%,#178cde); font-style: inherit;} .sbtl .fa{display: block; border: 1px solid #14bdac; width:40px; text-align: center; line-height:40px; border-radius: 50%; color:#14bdac; font-size: 18px; ;} .sbtl span{display: block; font-size: 24px; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right,#178cde,#00ffe4 50%,#178cde); font-style: inherit;} .sbtl .fa:hover{ background-image: linear-gradient(67deg, #0068ff,#00b5a2); color: #fff;} .sbtl .fa-eye,.sbtl .fa-eye:hover{ font-size: 18px; border: 0;background: none;width: auto;border-radius: 0;-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right,#178cde,#00ffe4 50%,#178cde); font-style: inherit;} .sbtl .fa-eye:before,.caseshowbottom dl a dd .fa-eye:before{ margin-right:5px; } .sbtl dd{display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: center; -webkit-align-items: center;} .sbtl dd a{ margin: 0 5px;} .iclist a dd .fa-eye{display: inline-block;color: #fff;float: right;font-size: 14px;} .iclist a dd .fa-eye:before{margin-right:5px;} .casepageshow{display: block; overflow: hidden; padding:100px 0 0;} .casepageshow .designpic video,.casepageshow .designpic img{display: block; width: auto; height: auto; max-width: 100%; margin: 30px auto;} .casepageshow .designpic img{border-radius: 10px;} .wp-video{width: auto !important;} .casepageshow .txt{ display: block;overflow: hidden;margin-bottom: 100px;} .casepageshow .txt h3{background: linear-gradient(to right, #178cde 15%, #00ffe4 30%, #178cde 55%, #00ffe4 80%, #178cde 95%); background-size: 200% auto; color: #000; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: shine 5s linear infinite; float: left; font-size:40px; width: 32%;} .casepageshow .txt h4{font-size: 26px; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right,#178cde,#00ffe4 50%,#178cde); font-style: inherit; float: right; width: 62%;} figure{margin:0; padding:0;} .webfff{position: fixed; z-index:99999; width:900px; height: auto; top: 50%; left: 50%; margin: -250px 0 0 -450px;background: url(../image/license-background.jpg);background-size: cover;border-radius: 1rem; transform: scale(0); transition: transform .6s; display: flex;align-content: center;justify-content: center;} .fkc{ transform: scale(1);} .webfff .webcolsed{position: absolute; width: 36px; height: 36px;cursor:pointer; background-image: linear-gradient(67deg, #0068ff,#00b5a2); text-align: center; line-height: 36px; color: #fff; border-radius: 50%; right:10px; top:10px; font-size: 14px;} .webfff .webcolsed:hover{ opacity: 0.5;} .webfff .ict{ padding: 50px;width: calc(100% - 100px); overflow: hidden;display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: center; -webkit-align-items: center;} .webfff .ict .df{display: block; overflow: hidden; float: left; width: 40%;} .webfff .ict .df dd{display: block; overflow: hidden; margin-bottom:18px;} .webfff .ict .df dd span{display: block; color: #333; font-size: 18px; margin-bottom: 10px;} .webfff .ict .df dd p{display: block; overflow: hidden;} .webfff .ict .df dd p strong{display: block; float: left;margin-right: 10px;} .webfff .ict .df dd p strong img{display: block; height: 120px; border: 1px solid #eee; border-radius: 1rem; margin: 0 auto 10px;} .webfff .ict .df dd p strong font{display: block; text-align: center; font-size: 14px; line-height: 1.2em; color: #333;font-weight: normal; } .webfff .ict .df dd .a1{display: block; overflow: hidden; margin: 20px 0 0 0;} .webfff .ict .df dd .a1 span{display: block; font-size: 14px; line-height: 1.2em; margin-bottom: 5px;} .webfff .ict .df dd .a1 font{display: block; line-height: 1.2em; font-size: 18px; color: #333;} .webfff .ict .df dd:last-child{margin-bottom:0;} .webfff .ict .dr{display: block; float: right; width: 55%;} .webfff .ict .dr h3{display: block; color: #000; font-size:30px; line-height: 36px;} .webfff .ict .dr h4{display: block; overflow: hidden;margin:60px 0;} .webfff .ict .dr h4 span{display: block; color: #333; font-size: 22px; line-height: 1.2em;margin-bottom: 10px;} .webfff .ict .dr h4 font{ font-size:40px;line-height: 1.2em; color: #000; } .webfff .ict .dr h5{display: block; overflow: hidden; } .webfff .ict .dr h5 a{display: block; float: left; margin: 0 15px 0 0; width: 110px; height: 36px; line-height: 36px; font-size: 14px;} .webfff .ict .dr h5 a:last-child{margin-right:0;} @media only screen and (max-width:1600px ) { .icenter,.pcheader .ic{ width:90%; } .footer .ftcenter dd img{height:18px;} .footer .fttop .center dl dd span a,.footer .fttop .center dl font{font-size:14px;} .footer .ftbottom p,.footer .ftbottom a,.footer .ftbottom dd{ font-size:12px; } .footer .ftcenter dd span{ margin: 2px auto 0;zoom: 0.8;} .footer .fttop .center dl{ margin: 0 70px 0 0;} .footer .fttop .center dl dd span{ margin-bottom:12px; } .footer .fttop .right dd p:last-child{display: none;} .footerform h3{font-size:24px; } .footer .fttop .right .a1 a{font-size:16px;} .footer .fttop .left span{font-size:18px; margin-bottom:10px;} .footer .fttop .cent font,.footer .fttop .right i{font-size:18px; } .footer .fttop .cent dd span{ margin-bottom: 20px;} .footer .fttop .cent dd span a{ font-size: 16px;} .footer .fttop .right dd{margin-bottom: 16px;} .footer .ftcenter{ padding: 6px 0; margin-bottom: 20px;} .footer{ padding: 40px 0 30px;} .footerform form input{height: 40px;font-size: 14px; text-indent: 20px;} .footerform form button{height: 36px; width: 120px;font-size: 14px;} .footerform form{ width: 400px;} .waves{height:40px;} .footer .fttop .right dd span,.footer .fttop .right .a1 span{font-size:12px;} .footer .fttop .center dl font{margin-bottom:18px; } .footer .fttop .right dd a{font-size:24px;} .footer .fttop .right .a1 span{margin-bottom:4px;} .callme,.ccform,.pagenews,.history{ padding: 80px 0;} .callme .swipercontainer03{margin:30px auto 0;} .callme .swipercontainer03 .txt{ padding:40px 30px;} .callme .swipercontainer03 .txt span{margin: 0 auto 20px; width: 100px;line-height: 24px;} .callme .swipercontainer03 .txt .desc p{ font-size: 14px;margin-bottom: 6px;} .callme .swipercontainer03 .txt strong{ margin-bottom: 20px;font-size: 36px;} .callme .swipercontainer03 .swiper-slide:after{ height:1px;} .callme .swipercontainer03 .txt span i{ font-size: 12px;} .callme .icenter .fa,.hlist .tpa{line-height: 36px; width: 36px;height: 36px;} .callme .icenter .swiperslideprev,.hlist .milepostbuttonprev{right: 110px;} .ccform h3 font, .callme h4{ font-size: 16px;} .ccform h3 strong, .callme h3{ font-size: 36px;margin-bottom: 10px;} .ccform span span{ line-height: 36px; font-size: 12px;} .wpcf7-response-output, .wpcf7-validation-errors{ font-size: 14px;margin-top: 16px;} .ccform .wpcf7submit{width: 120px; height: 36px; line-height: 36px; font-size: 14px; margin-top: 20px;} .ccform .aa .txt, .ccform .bb .txt{font-size: 12px; margin-bottom: 5px;} .ccform .aa input{ height: 36px;line-height: 36px;font-size: 14px;} .ccform .aa .ct{ margin-bottom: 20px;} .ccform .bb .ct textarea{height:70px;font-size: 14px;} .ccform h3{margin-bottom: 30px;} .bannermore .a1{height: 60px;} .bannermore strong{ width: 40px; height: 40px;} .bannermore strong span{ width: 14px;height: 24px;} .more, .wpcf7submit, .morlink{width: 120px;height: 36px;line-height: 36px; font-size: 14px;} .bannercase .icenter h3{ font-size: 40px;margin-bottom: 20px;} .bannercontact .icenter p{font-size: 24px;} .bannercase .icenter h4{font-size: 16px;line-height: 26px;margin-bottom: 30px;} .bannercontact .icenter h4 font{font-size: 30px; display: block;line-height: 1.2em;} .pcheader{height:70px; } .pcheader .ic .left .logo font{ width: 52px;height: 52px;} .pcheader .ic .left .logo img{height: 50px} .div2_1 .pcheader{ height: 60px;} .div2_1 .pcheader .ic .left .logo font{ width: 48px; height: 48px;} .div2_1 .pcheader .ic .left .logo font img{height: 20px;} .pcheader .ic .left .pcnav dd a{ font-size: 16px;} .pcheader .ic .left .pcnav dd{margin: 0 26px;} .pcheader .ic .right .ra{ width: 120px;height: 36px; font-size: 14px;line-height: 36px;} .pcheader .ic .left .pcnav dd h4{top:70px; width: 100px;} .div2_1 .pcheader .ic .left .pcnav dd h4{top:60px;} .pcheader .ic .left .pcnav dd h4 a{line-height: 30px;font-size: 14px;margin:5px 0;} .pagenews h3{font-size:26px;} .pagenews dl a dd strong{font-size:16px; } .pagenews dl a dd font{margin: 15px 0; zoom: 0.9;padding: 2px 12px;} .pagenews dl a dd span{font-size:12px;} .index-milepost-text-swiper .t2 p{font-size:24px;} .index-milepost-text-swiper .t2 span{line-height: 30px;} .index-milepost-text-swiper .t2 span i{font-size: 14px;} .index-milepost-text-swiper .t2 span:after{width: calc(100% - 2px);height: calc(100% - 2px); top: 1px; left: 1px;} .hlist .index-milepost-swiper .swiper-slide .data .b1{ font-size: 30px;} .hlist .index-milepost-swiper .swiper-slide .data .b2{font-size: 80px;} .hlist .index-milepost-swiper .swiper-slide:nth-child(2n){ top: -50px; padding-bottom: 50px;} .index-milepost-text-swiper{ margin: 0 auto 20px;} .ablogo h3, .history h3{ font-size: 36px; margin-bottom: 10px;} .ablogo h4, .history h4{margin-bottom:30px;font-size: 16px;} .history .absvg{ top: 100px;height: 150px;} .pagenews .innewicon{ top: 60px; height: 25%;} .pagenews dl a dd{padding: 20px;} .ablogo{padding: 100px 0 60px;} .ablogo .absvg{ right: 50px;top: 100px;height: 30px;} .taict{margin: 30px 0;} .wzbg h3{ font-size: 36px;margin-bottom: 10px;} .wzbg h4{ font-size: 16px; width: 50%;line-height: 30px; } .wzbg{ padding: 60px 0;} .wzbg .absvg{height: 30px; left: -50px; margin-bottom: 30px;} .nmnoo{ transform: rotate(-5deg) scale(1.05);} .abgl{ padding-bottom:0;} .abbanner .lfex .absvg{ top: 100px;right: 50px;height: 150px} .abbanner .lfex h3 span{font-size:18px;line-height: 30px;} .abbanner .lfex h3 strong{font-size: 36px;margin-bottom: 20px;} .abpenum .num dd strong, .abpenum .num dd p font{font-size: 16px;} .incompany .num dd p span{ font-size: 70px;} .newslist a p font{ zoom: 0.7;} .newslist a p span{font-size:12px;} .newslist a p strong{ font-size: 16px;} .teamlist a p font{ zoom: 0.7;} .teamlist a p span{font-size:12px;} .teamlist a p strong{ font-size: 16px;} .fy{ padding: 60px 0;} .pnaa{ padding: 60px 0;} .pcaa a{ padding: 6px 30px; margin-right: 15px; font-size: 14px;} .newsshow .tt h3{ margin-bottom: 20px;font-size: 36px;} .newsshow .tt span{font-size: 14px; margin-bottom: 10px;} .newsshow .tt h4 font{ line-height: 30px; font-size: 14px; margin-right: 30px;} .newsshow .tt .share .social-share a{ width: 30px; height: 30px;} .newsshow .tt .share span{line-height: 30px;} .newsshow .tt .share .social-share a .wechat-qrcode h4{font-size:12px;} .newsshow .tt .share .social-share a .wechat-qrcode{left: -20px;width: 120px;padding: 10px;} .newsshow .tt .share .social-share a .wechat-qrcode .help p{zoom:0.7;} .newsshow .tt{padding: 150px 0 60px;} .line{height: 2px;} .newsshow .st span, .newsshow .st font, .newsshow .st strong, .newsshow .st p, .newsshow .st dl, .newsshow .st dd, .newsshow .st dt{ font-size: 16px;margin: 0 0 16px 0;line-height: 26px;} .newsshow .st{min-height: 300px;margin: 20px auto 0;} .npb .bl{line-height:50px;width:50px; height:50px;font-size: 12px;} .npb .np p{font-size:16px;} .npb .np span{font-size:14px;} .bannercase .icenter p{font-size: 24px; margin-bottom: 20px;} .pctt h4{font-size: 18px; width: 500px; margin: 0 auto; line-height: 30px; margin-top: 20px;} .pctt h3{font-size:40px; } .pctt{ padding: 60px 0 30px;} .iclist a dd strong{font-size: 26px;} .iclist a dd span{padding: 5px 8px;zoom: 0.8;margin: 0 3px;} .iclist a dd .fa-eye{ font-size: 12px;} .iclist a dd{ padding: 10px 20px;} .casebgbt dl .txt h3{ font-size: 20px;} .casebgbt dl .txt h4{ font-size: 36px;} .bannercaseshow .icenter p .more{height: 30px; line-height: 30px; width: 100px; font-size: 12px;} .bannercase .lgiocn{ height: 60%;top: 60%;} .casepageshow .txt h3{ font-size: 40px;} .casepageshow .txt h4{font-size: 20px; line-height: 30px;} .casepageshow{padding: 60px 0 0;} .sbtl strong,.caseshowbottom h3{font-size: 36px;font-weight: normal;} .sbtl span,.sbtl .fa-eye, .sbtl .fa-eye:hover{font-size: 16px;} .sbtl{margin: 60px auto 0; padding-bottom: 60px;} .caseshowbottom dl a dd strong{font-size: 26px;} .caseshowbottom dl a dd{padding: 30px 15px;} .caseshowbottom dl a dd .fa-eye{ margin-top: 10px;font-size: 12px;} .caseshowbottom .more{ width: 120px;} .caseshowbottom,.casebgbt{padding: 60px 0;} .casepageshow .designpic video, .casepageshow .designpic img{ max-width: 90%;} .banner text{font-size: 4rem;} .pagebgtest{height:180px;} .banner .txt h4{line-height: 1.2em;} .banner .txt h3{font-size: 60px; margin-bottom: 10px;} .incompany dt strong{ font-size: 40px;} .incompany dt span{ margin: 20px 0;font-size: 20px;} .incompany dt font{font-size:30px;} .incompany{padding: 100px 0 10px;} .inlogo .la{height: 80px; margin-bottom: 15px;} .incompany .num{ margin-bottom: 20px;} .container666{zoom: 0.28;} .incompany .num dd strong,.incompany .num dd p font{font-size:16px;} .incaase .text strong,.inserver .text strong{font-size: 40px;} .incaase .text span,.inserver .text span{font-size: 20px; margin: 20px 0;} .bname .ttb strong{font-size: 40px;} .bname .ttb span{font-size: 18px; margin: 20px 0;} .programme-mask-bg .logolist a{} .inserver dl dd p span{ font-size: 1rem; line-height: 1rem;} .inserver dl dd strong{ width: calc(100% - 60px);left: 30px; font-size: 1.2rem;} .inserver dl dd strong span{ font-size: 30px;} .inserver dl dd strong span:after{margin-top: 10px;} .inserver dl dd strong p{ font-size: 16px;margin: 20px 0;} .inserver dl dd:hover strong{bottom:30px;} .btext .bname h3{font-size:50px; } .btext .bname h4{font-size: 20px;margin: 20px 0;} .customers-data .tt span{ font-size: 16px;} .customers-data .tt strong{font-size: 40px;} .customers-data{right: 5%; width: 36%;} .homenews .innewslist .inxwbb .swiper-slide p strong{ font-size: 16px;} .homenews .innewslist .inxwbb .swiper-slide p font{zoom: 0.7;} .homenews .innewslist .inxwbb .swiper-slide p span{ font-size: 12px;} .homenews .innewslist .inxwbb .swiper-slide p{padding: 20px;} .homenews .innewsta a{padding: 5px 20px; font-size: 12px;} .btext.articleShow .bname{ width: 90%;} .incaase{ padding: 60px 0 60px;} .incaase .text{margin-bottom:30px; } .inlogo{padding-bottom: 60px;} .bannerpage .left h3{ font-size: 50px; line-height: 50px;} .bannerpage .left h4{ font-size: 28px;line-height: 28px;margin: 20px 0;} .bannerpage .left h5{ font-size: 16px;margin: 0 0 20px 0;} .wstip h3{ font-size: 40px;margin-bottom: 30px;} .wstip dl dd p span{ font-size: 36px;} .wstip dl dd p{ margin: 50px 0;} .wstip dl dd p font,.wstip dl dd strong{font-size:14px;} .wstip dl dd{ width: calc(23% - 60px); padding: 40px 30px;} .wstip{ padding: 100px 0 0;} .techicon h6{ font-size: 20px; margin: 20px auto 0;} .techicon h3{font-size: 40px;line-height: 40px;} .techicon .icenter dd h5 strong font{ width: 36px; height: 36px; zoom: 0.8;} .techicon .icenter dd h5 strong font:after{width: 34px;top: 1px;left: 1px;height: 34px;} .techicon .icenter dd h5 strong span{ font-size: 12px;line-height: 30px;margin: 0 0 0 10px;} .techicon .icenter dd h5 strong{ margin-bottom: 10px; } .techicon .icenter dd h4{ font-size: 18px; margin-bottom: 18px;padding-bottom: 6px;} .techicon .icenter dd{width: 16%;} .webcenterpic .lf .lgiocn{ height: 400px; left: -25%;} .webcenterpic .lf h4{font-size: 16px;} .webcenterpic .lf h3{font-size: 40px;margin: 20px 0;} .webcenterpic .lf dl a{margin: 0 12px 12px 0;padding: 6px 12px;} .webcenterpic .lf dl a img{ height: 18px;margin-right: 4px;} .webcenterpic .lf dl a font{font-size: 12px;line-height: 20px;} .webcenterpic .rh{ right: 100px;} .flow h4{margin: 20px 0;font-size: 20px;} .flow h3{font-size: 40px;} .flow .tta a{font-size: 12px;padding: 5px 20px;} .flow .tta{ margin-bottom:30px;} .flow .bba dl dd .b strong{font-size: 12px; margin: 10px 0; padding-left: 10px;} .flow .bba dl dd .b strong:after{ width: 4px; height: 4px;} .flow .bba dl dd .t{font-size: 14px;padding-left: 30px;margin-bottom: 20px;} .flow .bba dl dd .s{ margin-top: 20px;font-size: 12px;padding-left: 30px;} .flow .bba dl dd p font{font-size: 16px;margin: 20px 0; padding-left: 30px;} .flow .bba dl dd p span{font-size: 12px;line-height: 30px;width: 30px;height: 30px;zoom: 0.8;} .flow .bba dl dd p span:after{ width: 28px;height: 28px;} .flow .bba dl dd p i,.flow .bba dl dd .b{padding-left: 30px} .flow .bba dl dd p font:after{} .flow .bba dl dd p font:after{ width:26px;} .webcase h3{ font-size: 40px;} .webcase h4{font-size: 20px;margin: 20px 0;} .webcase{ padding: 60px 0;} .toright,.toleft{width: calc(290px * 8 + 7 * 24px);} .resourcerow a{height:auto; margin: 0 8px;} .flow{ padding: 100px 0 60px;} .wstip dl dd i{ zoom: 0.8;} .webfff{width: 700px;margin-left: -350px;margin-top: -180px;} .webfff .ict{ padding: 30px; width: calc(100% - 60px);} .webfff .ict .dr h4{ margin: 40px 0;} .webfff .ict .dr h3{ font-size: 24px;line-height: 30px;} .webfff .ict .dr h4 span{ font-size: 18px;} .webfff .ict .dr h4 font{ font-size: 36px;} .webfff .ict .dr h5 a{height: 30px; line-height: 30px; font-size: 12px; width: 100px;margin-right: 10px;} .webfff .ict .df dd p strong img{margin: 0 auto 5px;height: 100px;} .webfff .ict .df dd p strong font{font-size: 12px;} .webfff .ict .df dd .a1{ margin: 15px 0 0 0;} .webfff .ict .df dd span{font-size: 16px;} } .drawer-toggle,.drawer-hamburger,.drawer-nav{display: none;} @media only screen and (max-width: 800px){ .webfff,.fkc{ display: none !important;} .drawer--right .drawer-hamburger, .drawer--right.drawer-open .drawer-nav, .drawer--right.drawer-open .drawer-navbar .drawer-hamburger{right:20px; background-color:none; } .drawer-toggle,.drawer-hamburger{display: block; width:30px; height: 30px; padding: 0; margin: 0;} .drawer-hamburger-icon, .drawer-hamburger-icon:after, .drawer-hamburger-icon:before{color:#fff; background: #fff; } .drawer-hamburger-icon{} .drawer-hamburger-icon:after{} .drawer-hamburger-icon:before{} .drawer--right.drawer-open .drawer-nav{right:0; background: rgba(0, 0, 0, 0.9);} .drawer-menu{ width:80%; margin:100px auto; } .drawer-menu li{ border-bottom: 1px solid #343434;padding: 5px;overflow: hidden; display: block; margin-bottom: 20px;} .drawer-menu li>a{color: #fff; font-size: 20px;display: block;} .mnli .sj{display: inline-block; width: 0; height: 0; margin-left: 4px; -webkit-transition: -webkit-transform .5s ease,opacity .5s ease; transition: transform .5s ease,opacity .5s ease; -webkit-transform: rotate(0); transform: rotate(0); vertical-align: middle; border-top: 4px solid; border-right: 4px solid transparent; border-left: 4px solid transparent; color: inherit;} .drawer-menu li .mlist{padding: 10px; overflow: hidden; display: none;} .drawer-menu li .mlist a{display: block; font-size: 14px; background: rgba(0, 0, 0, 0.9); border-radius: 2rem; margin: 5px 0; padding: 10px 20px;} .abbannert{padding-top: 100px;} .aaawrap{display: none;} .aaawrapsj{display: flex;} .drawer-toggle,.drawer-hamburger,.drawer-nav{display: block;} .banner .mbarbg{display: block; background-image: url('../picture/mbarbg1.jpg');} .akt{ border-radius: 10px; } .newsshow .tt h4 font{font-size: 12px;margin-right: 10px;} .newsshow .tt{padding: 100px 0 60px;} .icenter, .pcheader .ic,.ccform .icenter,.casebgbt dl .txt,.pctt h4,.techicon h6{width: 94%;} .footer .ftlinks,.footer .ftcenter,.footer .ftbottom dt a,.ccform:before,.pagenews .innewicon,.programme,.customers,.homenews .innewicon,.pcheader .ic .left .pcnav,.pcheader .ic .right,#csbm{ display: none;} .footer .fttop,.footer .ftbottom,.pagenews dl,.sbtl,.sbtl dd,.inserver .icenter,.incompany .num,.wstip dl,.techicon .icenter{ display: block;} .footer .fttop .cent,.footer .fttop .left{float: left; width: 33.33%; margin-bottom: 50px;} .footer .fttop .right,.bannerpage .left{ width: 100%;float: none;} .footer .fttop .left dl dd img{ height: 90px;} .footer .fttop .left dl dd{ margin: 0 0 20px 0; float: none; display: inline-block;} .bannerpage .left h3{font-size:40px;} .pctt h3,.casebgbt dl .txt h4,.caseshowbottom h3,.inserver .text strong,.inserver dl dd strong span,.incaase .text strong,.incompany dt strong,.wstip h3,.wstip dl dd p span,.techicon h3,.webcase h3,.flow h3,.webcenterpic .lf h3,.homenews h3{font-size:30px;} .incompany dt strong{font-size:34px;} .bannercase .icenter p,.incompany dt font,.bannerpage .left h4,.ws2tip .icenter h4{font-size:20px;} .pctt h4,.incaase .text span, .inserver .text span,.incompany dt span,.webcase h4,.flow h4{font-size:16px;} .inserver dl dd strong p,.incompany .num dd strong, .incompany .num dd p font,.techicon h6{font-size:14px;} .npb .np span{font-size:12px;} .pcaa a{padding: 6px 20px; margin-right: 6px; font-size: 12px;} .fy{ padding: 30px 0;} .fy span, .fy a{width: 32px; margin: 0 10px; line-height: 32px; height: 32px;} .newsshow .tt h3{ font-size: 26px; line-height: 31px; text-align: left; margin: 30px 0; } .npb .np p{max-width: 120px; font-size: 12px;margin-top: 0px;} .npb .bl{line-height: 40px; width: 40px; height: 40px; font-size: 12px;} .pagenews dl a,.newslist a{width: 100%;margin-bottom:20px;} .teamlist a{width: 48%;margin-bottom:20px;} .pagenews dl a dd,.newslist a p,.teamlist a p{background: rgba(10, 31, 58, 0.9);} .ablogo dl dd{margin:0 1% 1% 0; width:24.25%;} .ablogo dl dd:nth-child(4n){margin-right:0;} .wzbg h4{width:100%;line-height: 24px;} .wzbg{padding: 40px 0;} .iclist a,.iclist a:nth-child(3n),.caseshowbottom dl a{float: none; width: 94%; margin: 0 auto 20px; position: relative; border-radius: 1rem; top: 0 !important;} .pcaa{ margin-bottom:50px;} .pagecase{padding: 0px 0 60px;} .iclist{width: 100%;padding-bottom: 30px;} .casepageshow .txt{margin-bottom: 50px;} .casepageshow .txt h3{display: block; float: none; width: 100%; font-size: 30px;} .casepageshow .txt h4{float: none; width: 100%; font-size: 16px; margin-top: 0; line-height: 26px;} .casepageshow .designpic video, .casepageshow .designpic img{max-width: 100%;} .caseshowbottom{width: 94%;} .sbtl strong{ font-size: 30px;margin-bottom:10px;} .sbtl .fa{ float: left; margin-right: 16px; width: 26px; height: 26px; line-height: 26px; font-size: 12px;} .sbtl span{ float: left; margin-right: 16px; font-size: 14px; line-height: 26px; } .sbtl .fa-eye{width: auto;margin-right:0; } .sbtl dd{ margin-right: 16px; float: left;} .sbtl dd .fa{margin-right:0; } .sbtl{margin: 30px auto 0; padding-bottom: 30px;} .bannercase .lgiocn{height: 30%; left: -12%;} .bannercaseshow .icenter{} .bannercaseshow .icenter h3, .bannercaseshow .icenter h4, .bannercaseshow .icenter p{ width:100%;} .bannercase .icenter p{ margin-bottom: 50px;} .bannercaseshow .imgrh{position: relative; top: auto; width: 100%; right: auto; transform: initial; border-radius: 10px;} .homenews .innewsta a{padding: 5px 12px; margin-right: 12px;} .inserver dl{ width: 100%; top: 0 !important; margin: 0 auto 30px;} .inserver dl dd strong{ left: 30px; width: calc(100% - 60px);bottom:-50px; } .incompany .num dd,.incompany .num dd p{text-align: center;} .incompany .num dd{margin-bottom:20px;} .container666{ zoom: 0.2;} .banner .txt h3{ font-size: 40px; margin-bottom: 0px;} .banner .txt h4{ font-size: 20px; margin: 20px auto 30px;} .index-milepost-text-swiper{ width:100% !important; } .index-milepost-text-swiper .t2 span{ width: 80px;} .index-milepost-text-swiper .t2 span i{ font-size: 18px;} .hlist{overflow: inherit;} .index-milepost-text-swiper,.index-milepost-swiper{overflow: hidden;} .hlist .tpa{top: -100px;} .abbanner .lfex .absvg,.wzbg .absvg,.ablogo .absvg,.history .absvg{ display: none;} .abgl{ height: 70vh;} .abpenum{padding: 30px 0;margin-top: 0;} .abbanner .lfex h3 span{width: 100%; font-size: 16px; line-height: 24px;} .abpenum .num dd p span{font-size: 60px;} .abbanner .lfex h3 strong{ margin-top: 40px;} .nmnoo{transform: rotate(0deg) scale(1.05);} .history{ padding-bottom: 0;} .wstip dl dd p span{font-size:28px;} .option2323{height: 26%;} .wstip dl dd{float: left; width: calc(49% - 42px); margin: 0 2% 2% 0;padding: 30px 20px;} .wstip dl dd:nth-child(2n){ margin-right:0; } .wstip dl dd p{ margin: 20px 0;} .techicon .icenter{display: flex; display: -webkit-flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; overflow: hidden;} .techicon .icenter dd{ float: left;width: 50%;} .webcenterpic{ overflow: hidden;} .webcenterpic .lf{position: relative; width: 100%; transform: inherit; padding-top: 50px;} .webcenterpic .rh{right: auto;width: 100%;margin: 50px 0 0 0;overflow: hidden;} .webcenterpic .rh dd,.webcenterpic .rh dd:nth-child(2n){width: 80%; margin: 30px auto;} .flow .tta a{margin-right: 10px; padding: 5px 10px;} .flow .bba dl{ width: 800px;} .flow .bba{overflow-x: auto; padding-bottom: 20px;} .toright, .toleft{ width: calc(180px * 8 + 7 * 24px);} .webcenterpic .lf .lgiocn{ height: 200px;} .bannerpage .right{top: 12%; width: 80%; transform: rotateX(30deg) rotateY(2deg) rotateZ(15deg);} .ws2tip .icenter dl dd:last-child{display: none;} .ws2tip .icenter dl dd{ width:32%;} .ws2tip dl dd:nth-child(2n){margin-right:2%;} .ws2tip dl dd:nth-child(3n){margin-right:0;} .webcenterpic2 .rhyd dd, .webcenterpic2 .rh dd:nth-child(2n){width:100%;margin:30px 0; } .webcenterpic2 .icenter .rh dl:nth-child(2n){margin-top:50px; } .bannermore .a1,.banner .bannermore .a1{ height:60px;} .inlogo .la dl{animation-duration: inherit !important;} .inlogo .gd2{ left: -100px;} } @media only screen and (max-width: 400px) { .banner .mbarbg { background-image: url('../picture/mbarbg2.jpg'); } } .max1440 { margin: 0px auto; max-width: 1600px; width: 100%; padding: 0 30px; } .index5 { padding-top: 10px; } /** swiper01_box ====================================================================================*/ .swiper01_box { width: 100%; position: relative; margin: 10px auto 0px auto; padding: 30px 0px 40px 0px; } /** 点 ============*/ .swiper01_box .swiper-container { padding: 0px 0px 0px 0px; height: auto; } .swiper01_box .swiper-pagination { width: 100%; text-align: center; left: 0px; bottom: 0px; } .swiper01_box .swiper-pagination-bullet { background: #999; opacity: 0.8; width: 10px; height: 10px; border-radius: 5px; margin: 0px 5px; transition: all 0.5s ease-out; } .swiper01_box .swiper-pagination-bullet-active { background: #003e8b; width: 30px; opacity: 1; } /** 左右按钮 ============*/ .swiper01_box .swiper-button-prev { left: -40px; opacity: 1; top: 45%; } .swiper01_box .swiper-button-next { right: -40px; opacity: 1; top: 45%; } .swiper01_box .swiper-button-prev { width: 50px; height: 50px; text-align: center; background-color: none; background-image: url(../image/swiper_left02.png); background-repeat: no-repeat; background-position: center center; background-size: 20px; } .swiper01_box .swiper-button-next { width: 50px; height: 50px; text-align: center; background-color: none; background-image: url(../image/swiper_right02.png); background-repeat: no-repeat; background-position: center center; background-size: 20px; } .swiper01_box .swiper-button-prev.swiper-button-disabled { opacity: 0.5; background-color: none; background-image: url(../image/swiper_left01.png); } .swiper01_box .swiper-button-next.swiper-button-disabled { opacity: 0.5; background-color: none; background-image: url(../image/swiper_right01.png); } .swiper01_box .swiper-button-prev.hide { opacity: 0; } .swiper01_box .swiper-button-next.hide { opacity: 0; } .swiper01_box .swiper-button-next, .swiper-button-prev { transition: opacity 0.5s; } @media screen and (max-width: 1366px) { /** 左右按钮 ============*/ .swiper01_box .swiper-button-prev { left: 0px; opacity: 1; top: 45%; } .swiper01_box .swiper-button-next { right: 0px; opacity: 1; top: 45%; } } @media screen and (max-width: 1023px) { .index5 { padding-top: 30px; padding-bottom: 30px; } .swiper01_box { width: 100%; position: relative; margin: 0px auto 0px auto; padding: 20px 0px 30px 0px; } .swiper01_box .swiper-pagination { width: 100%; text-align: center; } /** 点 ============*/ .swiper01_box .swiper-container { padding: 0px 0px 0px 0px; height: auto; } .swiper01_box .swiper-pagination { width: 100%; text-align: center; left: 0px; bottom: 0px; } .swiper01_box .swiper-pagination-bullet { background: #999; opacity: 0.8; width: 8px; height: 8px; border-radius: 5px; margin: 0px 2px; transition: all 0.5s ease-out; } .swiper01_box .swiper-pagination-bullet-active { background: #003e8b; width: 20px; opacity: 1; } .swiper01_box .swiper-button-prev { left: 0px; opacity: 1; top: 45% } .swiper01_box .swiper-button-next { right: 0px; opacity: 1; top: 45% } .swiper01_box .swiper-button-prev { width: 30px; height: 30px; background-size: 20px; } .swiper01_box .swiper-button-next { width: 30px; height: 30px; background-size: 20px; } } .sw_item01 { position: relative; } .sw_item01 .imgzoom { padding-bottom: 150%; width: 100%; position: relative; overflow: hidden; } .sw_item01 .imgzoom img { width: 100%; height: 100%; object-fit: cover; position: absolute; transition: all .5s cubic-bezier(.5, 0, .2, 1) 0s; } .sw_item01:hover .imgzoom img { -webkit-transform: scale(1.10); -moz-transform: scale(1.10); -ms-transform: scale(1.10); -o-transform: scale(1.10); transform: scale(1.10); } .sw_item01 .txt { padding: 20px 10px; width: 100%; transition: all 0.5s ease-out; } .sw_item01 .txt .p1 { text-align: center; font-size: 18px; font-weight: bold; color: #fff; height: 20px; line-height: 20px; overflow: hidden; margin-bottom: 15px; } .sw_item01 .txt .p1 span { font-size: 18px; padding-right: 5px; } .sw_item01 .txt .more { text-align: center; } /*关于我们*/ .about_video { width: 90%; } .col-md-6 { width: 50%; float: left; } .js_about_right { text-align: center; } .about_content { line-height: 30px; color: #ababab; margin-top: 20px; } .about_h3 { -webkit-background-clip:text; background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(to right, #178cde, #00ffe4 50%, #178cde); font-style: inherit; font-size: 45px; font-weight: bold; margin: 0px; } .about_p { font-size: 16px; color: #9c9a9a; padding-bottom: 20px; border-bottom: 1px solid #989797; } /*关于我们*/ @media screen and (max-width: 1023px) { .sw_item01 { position: relative; } .sw_item01 .imgzoom { padding-bottom: 150%; width: 100%; position: relative; overflow: hidden; } .sw_item01 .imgzoom img { width: 100%; height: 100%; object-fit: cover; position: absolute; transition: all .5s cubic-bezier(.5, 0, .2, 1) 0s; } .sw_item01:hover .imgzoom img { -webkit-transform: scale(1.10); -moz-transform: scale(1.10); -ms-transform: scale(1.10); -o-transform: scale(1.10); transform: scale(1.10); } .sw_item01 .txt { padding: 10px 10px; width: 100%; transition: all 0.5s ease-out; } .sw_item01 .txt .p1 { font-size: 16px; color: #fff; height: 20px; line-height: 20px; overflow: hidden; margin-bottom: 10px; } .sw_item01 .txt .p1 span { font-weight: bold; font-size: 14px; } .sw_item01 .txt .p2 { font-size: 14px; color: #666; height: 36px; line-height: 18px; overflow: hidden; margin-bottom: 10px; } .sw_item01 .txt .p2 span { font-weight: bold; font-size: 14px; color: #333; } .sw_item01 .txt .more { text-align: center; } } @media (max-width: 1024px) { .max1440 { padding: 0 10px; overflow: hidden; } } @media (max-width: 1280px) { .max1440 { padding: 0 20px; } } @media (max-width: 767px) { .max1440 { padding: 0px; } .col-md-6 { width: 100%; } .about_video { width: 100%; } } /* index5 */