/* 清除内外边距 */ body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */ dl, dt, dd, ul, ol, li, /* list elements 列表元素 */ pre, /* text formatting elements 文本格式元素 */ fieldset, lengend, button, input, textarea, /* form elements 表单元素 */select,option, th, td { /* table elements 表格元素 */ margin: 0; padding: 0; font-family: PingFang SC,Microsoft Yahei,Arial,Hiragino Sans; text-align: justify;font-weight: normal; } /* 设置默认字体 */ body, button, input, select, textarea { /* for ie */ /*font: 12px/1 Tahoma, Helvetica, Arial, "宋体", sans-serif;*/ /* font: 12px/1 "微软雅黑"; *//*Tahoma, Helvetica, Arial, "\5b8b\4f53", sans-serif;*/ /* 用 ascii 字符表示，使得在任何编码下都无问题 */ } 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; } /* 将斜体扶正 */ code, kbd, pre, samp, tt { } /* 统一等宽字体 */ small { font-size: 12px; } /* 小于 12px 的中文很难阅读，让 small 正常化 */ /* 重置列表元素 */ ul, ol { list-style: none; } /* 重置文本格式元素 */ a { text-decoration: none; } a:hover { text-decoration: none; } abbr[title], acronym[title] { /* 注：1.ie6 不支持 abbr; 2.这里用了属性选择符，ie6 下无效果 */ border-bottom: 1px dotted; cursor: help; } q:before, q:after { content: ''; } /* 重置表单元素 */ legend { color: #000; } /* for ie6 */ fieldset, img { border: none; } /* img 搭车：让链接里的 img 无边框 */ /* 注：optgroup 无法扶正 */ button, input, select, textarea { font-size: 100%; /* 使得表单元素在 ie 下能继承字体大小 */ } /* 重置表格元素 */ table { border-collapse: collapse; border-spacing: 0; } /* 重置 hr */ hr { border: none; height: 1px; } :root { --dex:#1c6363; } /* 让非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%; } .web-ie2018{ font-family: Arial,'宋体'; position: fixed;width: 100%;height: 100%;top: 0;left: 0;z-index: 9999999999999;background: #666;zoom:1;} .web-ie2018 dl{ position: absolute;width: 700px;height: auto;top: 50%;margin-top: -200px;left: 50%;margin-left: -350px;background: #fff;} .web-ie2018 dl #img{ display: block;margin: 50px auto;} .web-ie2018 dl h3{ display: block;text-align: center;font-size: 28px;font-weight: normal;letter-spacing: 2px;margin: 0 auto 30px;} .web-ie2018 dl h4{ display: block;text-align: center;font-size: 18px;font-weight: normal;letter-spacing: 2px;margin: 50px auto 50px;} .web-ie2018 dl dd{ margin: 0 auto 50px; display: block;text-align: center; margin-bottom:50px;} .web-ie2018 dl dd a{ display: inline-block;margin: 0 20px;} .web-ie2018 dl dd a img{display: block;margin: 0 auto;text-align: center;width: 50%;} .web-ie2018 dl dd a span{display: block;font-size: 16px; color:#666;} input, button, select, textarea {outline: none;} .clearfix:after{display:block;content:'';clear:both;visibility:hidden} .imgbox {position: relative;overflow: hidden;} .imgbox img { width: 104%; object-fit: cover; transition: 0.3s; display: block; position: relative; left: -2%;} body{} *: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: "Montserrat-Bold"; src: url("../font/Montserrat-Bold.woff2") format("woff2"), url("../font/Montserrat-Bold.woff") format("woff"), url("../font/Montserrat-Bold.ttf") format("truetype"), url("../font/Montserrat-Bold.eot") format("embedded-opentype"), url("../font/Montserrat-Bold.svg") format("svg"); } @font-face { font-family: "Num"; src: url("../font/Num.eot") format("eot"), url("../font/Num.woff") format("woff"), url("../font/Num.ttf") format("truetype"); } /* h5 */ .drawer-nav { display: none; } .drawer-hamburger{display: none;} .i06_h5 {display: none;} .pch{ position: fixed;z-index: 999;width: 100%;top: 0;left: 0;background: #fff; -webkit-box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.15);box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.15);} .pch .logo{ display: block;overflow: hidden;float: left; margin:0; height: 70px; position: relative; z-index: 6; padding: 0; display: -webkit-flex;display: flex;-webkit-justify-content: space-between;justify-content: space-between;align-items: center;-webkit-align-items: center;} .pch .logo img{ display: block; height:46px; margin: 0 auto;width: auto; } .pch .pcnav{ display: block; float: right; position: relative; margin:0 0 0 0; display: -webkit-flex;display: flex;-webkit-justify-content: space-between;justify-content: space-between;align-items: center;-webkit-align-items: center; } .pch .pcnav dd{ display: block; position: relative;margin: 0 30px; } .pch .pcnav dd h3{display: block;overflow: hidden;position: relative;height: 80px;text-align: center; } .pch .pcnav dd h3 a{ display: inline-block;line-height: 80px;color: #444;font-size: 18px; width: 100%; margin: 0 auto;} .pch .pcnav dd:hover h3 a{ color:#00696c;} .pch .pcnav dd h3:after{ content: ""; display: block; width: 0; height: 2px; background: var(--dex); left: 50%; transform: translateX(-50%); bottom: 0; transition: all .3s; position: absolute;} .pch .pcnav dd:hover h3:after{ width:100%;} .pch .pcnav dd.active .accordion-body {display: block;height: auto;animation: tui 0.2s 0.05s linear forwards;} .pch .icenter .right .tools{display: flex;align-items: center;} .pch .icenter .right .tools a {font-size: 19px;color: #999;} .pch .icenter .right .tools a:hover {color: var(--dex);} .pch .icenter .right .tools a:nth-of-type(2) { padding: 0 0 0 14px; position: relative; border-left: 1px solid #999;} .pch .tools .lang img {filter: invert(); width: 23px; margin-right: 8px;} .pch .icenter .right .tools .lang{display: flex;align-items: center;font-size: 16px;} .pch .icenter{display: -webkit-flex;display: flex;-webkit-justify-content: space-between;justify-content: space-between;align-items: center;-webkit-align-items: center; z-index: 3; position: relative;} .pch .right{height: 70px; display: -webkit-flex;display: flex;-webkit-justify-content: space-between;justify-content: space-between;align-items: center;-webkit-align-items: center;} .pch .right .fa-search{ display: block;margin-right: 20px;color: #999;font-size: 18px;} .pch .right dt{ position: relative; height: 100%; display: flex; align-items: center;} .pch .right dt strong{ cursor:pointer; font-size: 16px; color: #666; } .pch .right dt strong .fa-angle-down{} .pch .pcnav dd.active .accordion-body {display: block;height: auto;animation: tui 0.2s 0.05s linear forwards;} @keyframes tui { 100%{ transform: translateY(0px); opacity: 1; } } .accordion-body ul li a:hover {color: var(--dex);} .accordion-body { opacity: 0; transform: translateY(-50px); -webkit-box-sizing: content-box; box-sizing: content-box; position: absolute; left: 0px; top: 100%; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; display: none; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; padding-left: 0; width: 300px; transition: 0.2s; height: 0px; } .pch .menu_hover { transition: 0.2s; background: linear-gradient(180deg, #ffffff 60px, white 0%); display: block !important; width: 100%; height: 0px; z-index: 1; position: absolute; top: 70px; left: 0px; -webkit-animation: a_bg_hover_show 0.1s ease-out both; -webkit-transform-origin: 50% 0%; z-index: 0; -webkit-box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.15);box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.15);} @keyframes a_bg_hover_show { 0% { -webkit-transform: scale(1, 0.5); opacity: 0; } 100% { -webkit-transform: scale(1, 1); opacity: 1; } } .accordion-body > ul > li:first-child { margin-top: 20px; } .accordion-body ul li { margin: 0; padding-right: 16px; line-height: 47px; } .accordion-body ul li a { font-size: 16px; border-bottom: 1px solid transparent; color: #666; display: block; position: relative; text-decoration: none; -webkit-transition: none; transition: none; } .accordion-body > ul > li:last-child { margin-bottom: 20px; } .pch .right dt.active .accordion-body {display: block;height: auto;animation: tui 0.2s 0.05s linear forwards;} .pch:hover .pchb,.pch:hover .pcht{ -webkit-box-shadow: inset 0 -1px 0 0 #e6e6e6; box-shadow: inset 0 -1px 0 0 #e6e6e6;} .more{ display: block; color: #1c6363; border: 2px solid #1c6363; text-align: center; height: 40px; line-height: 40px; width: 120px; font-size: 16px; border-radius: 6px; transition: all .3s;} .more:hover{ color: #fff; background:#1c6363;} .icenter{ display: block;width: 1500px;margin: 0 auto;} .banner{display: block; overflow: hidden; position: relative; width: 100%; height: 100%; background: #fff;} .banner .swiper-container3{ position: relative;height: 100%;width: 100%;} .banner .swiper-slide video,.banner .swiper-slide img{ object-fit: cover; display: block;width: 100%;height: 100%;position: relative; } .banner .swiper-slide img{transition: all 10s;} .banner .swiper-slide:after{ content:""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: #000; opacity: 0.3;} .banner .barn{ position: absolute;bottom:50px;width: 100%;left: 0;z-index: 9;height: 30px; text-align: center;} .banner .barn .swiper-pagination{ position: relative;text-align: center;height: 30px; display: inline-block; vertical-align: text-bottom;width: 880px;} .banner .barn .swiper-pagination span{ width:60px; height:2px; position: relative; margin: 0 10px; display: inline-block; opacity:1;background: #fff; transition: all 1.5s; border-radius: 0;} .banner .barn .swiper-pagination .swiper-pagination-bullet-active{width:160px; background: #00959e; } .banner .barn .fa{position: relative; width: 30px; height: 30px; background: none; color: #fff; font-size: 24px; line-height: 1em; text-align: center; top: 0; right: 0;margin: 0; opacity: 0.5;display: inline-block;} .banner .barn .swiper-button-prev{right: 0;left: auto;} .banner .barn .fa:hover{ opacity: 1;} .banner .swiper-slide .inbannertxt{ position: absolute;top: 50%;left: 50%; transform: translate(-50%, -50%); z-index: 9;} .banner .swiper-slide .inbannertxt h3{display: block;color: #fff;font-size: 76px;font-weight: normal;line-height: 85px; width: 73%;} .banner .swiper-slide .inbannertxt h5{ display: block;color: #fff;font-size: 24px;line-height: 27px;} .banner .swiper-slide .inbannertxt .more{ color: #fff;border: 2px solid #fff;} .banner .swiper-slide .inbannertxt .more:hover{border: 2px solid #00696c; color:#fff; background: #00696c;} .banner .swiper-slide .inbannertxt dd{display: block;overflow: hidden; margin: 0 0 0px 0;} .banner .swiper-slide .inbannertxt dd:nth-of-type(2){margin-bottom: 55px;} .banner .swiper-slide .inbannertxt .tts{ opacity: 1;-webkit-transform: translateY(125%);transform: translateY(125%);-webkit-transition: -webkit-transform .9s ease-out .5s;transition: -webkit-transform .9s ease-out .5s;transition: transform .9s ease-out .5s;transition: transform .9s ease-out .5s,-webkit-transform .9s ease-out .5s;will-change: transform;} .banner .swiper-slide-active .inbannertxt .tts{ -webkit-transform: translateY(0);transform: translateY(0);} .inpro{display: block;overflow: hidden;padding: 150px 0 100px; background: #fff; position: relative;} .inpro .more{ z-index: 6;margin:50px 0 0 0; } .prott{display: block;overflow: hidden; margin-bottom: 50px;position: relative; width: 20%;float: left; } .prott h3{ display: block;color: #333;font-size: 50px;line-height: 1em;font-weight: bold;} .prott font{display: block;width: 50px;height: 4px;background:#00696c;margin: 20px 0;} .prott h4{ display: block;color: #333;font-size: 20px;line-height: 30px;} .prolist{ overflow: hidden; } .toppro{ display: block;overflow: hidden;position: relative;} .toppro a{display: block;overflow: hidden; background:#fafafa; position: relative; width:65%; } .toppro .right{width:35%; position: absolute;top: 0;right: 0;height:75%; } .toppro .right p{width:100%; height: 66.666%;position: relative;overflow: hidden;} .toppro .bottom p{float: right;} .toppro a p{display: block;overflow: hidden;z-index: 3;position: relative; background: #fafafa;width: 75%; float: left;} .toppro a p img{display: block; width: 100%;margin: 0 auto; height: 100%; object-fit: cover; transition: all .6s;} .toppro a dd{display: block;overflow: hidden;padding: 40px 20px 0; z-index: 3; position: relative;} .toppro a dd strong{display: block;color: #666;font-size: 20px;font-weight: normal; } .toppro a dd span{display: block;width: 50px;height: 2px;background: #00696c;margin:10px 0; } .toppro a dd font{display: block;color: #333;font-size:26px;line-height: 1em;font-weight: bold;word-break: break-all; font-family: 'Montserrat-Bold'; text-align: left;} .procc{ display: block;overflow: hidden;float: right;width: 76%;} .toppro a:hover p img{ -webkit-transform:scale(1.1); -moz-transform:scale(1.1); transform:scale(1.1);} .toppro a:after{content: ""; position: absolute; width: 0; transition: all .5s; height: 100%; background: #00696c; bottom: 0; left:75%;} .toppro .bottom:after{left: 0;} .toppro .right:after{left:0;} .toppro a:hover:after{ width:25%; } .toppro .right:hover:after{ width:100%;} .toppro a:hover dd strong,.toppro a:hover dd font{color:#fff;} .toppro a:hover dd span{ background: #fff;} .inabout{display: block;overflow: hidden;padding: 200px 0 100px; border-top: 0 solid #f5f5f5; position: relative;} .inabout .more{ position: relative;z-index: 6;margin: 50px 0 0; float: right;} .inabout .tt{margin-bottom: 50px;} .inabout .tt span{ display: block;color: #333;font-size:20px;line-height: 1em;margin-bottom: 0;} .inabout .tt strong{display: block;width: 50px;height:4px;background:#00696c;margin: 20px 0;} .inabout .tt font{display: block;color: #333;font-size: 50px;line-height: 1.2em; font-weight: bold;} .inabout .tt font i{color: #00696c;font-style: inherit; } .inabout .tt dl{display: block;overflow: hidden;position: relative;margin-top: 50px; width:50%;} .inabout .tt dl video{display: block; width:100%; position: absolute; top: -50%; } .inabout .tt dl img{ display: block; width: 100%; position: relative; z-index: 3; left: 2px;} .inabout .nums{ display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: center; -webkit-align-items: center;} .inabout .nums dl{ position: relative; cursor:pointer;padding:30px 0; } .inabout .nums dl .gif{ position: absolute; z-index: -1; width: auto;height: 90%;left: 50%;transform: translate(-50%, -50%);top: 50%; transition: all .3s; opacity: 0;} .inabout .nums dl:hover .gif{ opacity: 1;} .inabout .nums dl dd{ display: block;text-align: center;} .inabout .nums dl dd span{font-family: 'Num'; font-size:200px; color:#00696c; line-height: 1em;} .inabout .nums dl:nth-child(2n) dd span{color:#89ccb6;} .inabout .nums dl dd font{display: inline-block;vertical-align: top;font-size: 24px;color: #666;margin-left: -10px; } .inabout .nums dl dt{} .inabout .nums dl dt strong{display: block;width: 100px;height: 1px;background: #eee;margin: 20px auto;position: relative;} .inabout .nums dl dt strong:after{ content:""; display: block; width: 30px; background: #00696c; margin: 0 auto; height: 1px; } .inabout .nums dl dt p{display: block;color: #333;font-size: 22px;text-align: center;line-height: 30px;} .inabout .nums dl:hover dd span{background-image: linear-gradient(91deg,#89ccb6 0%,#00696c 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;} .inabout .nums dl:hover dd font,.inabout .nums dl:hover dt p{color:#1c6363; } /* index06 */ .index06 {padding: 150px 0 100px; position: relative; overflow: hidden; background: url(../images/sy_ywbj1.jpg) 100%; background-size: cover;} .index06 .icenter {position: relative;} .index06 .title {position: absolute;top: -20px;left: 0px; z-index: 1;} .index06 .title .com_h3 {color: #fff;margin-bottom: 8px;font-size: 50px;font-weight: bold; } .index06 .title h5{display: block;width: 50px;height: 4px;background: #00696c;margin: 20px 0;} .index06 .title h4{font-size: 20px; width: 66%; color: #fff;} .index06 .num {position: absolute;bottom: 80px;left: 0px;} .index06 .num span {font-size: 20px;margin-bottom: 5px;font-weight: normal;color: #fff;} .index06 .num h4 { font-size: 24px; font-family: 'alibb'; display: flex; align-items: flex-end; margin-bottom: 22px; line-height: 150px;} .index06 .num h4 strong{font-size: 150px;font-weight: bold;margin-right:5px; color: #fff; font-family: 'Num';} .index06 .num h4 i {line-height: 35px;color: #fff;} .index06 .num h5 {font-size: 24px;font-weight: bold;color:#00959e;margin-bottom: 10px;} .index06 .num h6 {font-size: 16px;color: #fff;} .index06 .map { width: 86%; margin-left: 14%; height: 618px; position: relative; z-index: 10; } .index06 .map .ditu {position: absolute;right: 0px;bottom: 0px;} .index06 .map .ditu img {width: 100%; transition: 0s; opacity: 0.4;} .index06 .map .ditu.active img {opacity: 1;} .ditu2 {z-index: 3;} .mapicon{ position: absolute;top: 0;left: 0; opacity: 1;transition: all .3s;z-index: 10;} .mapicon:hover {z-index: 20;opacity: 1!important;} .mapicon:hover .detail{display:flex;} .mapicon .detail { display: none; width: 400px; position: absolute; top: -162px; left: -174px; background-color: rgba(255, 255, 255, 0.85); justify-content: space-between; align-items: center; padding: 15px; border-radius: 6px; } .mapicon .detail .imgbox {width: 155px;} .mapicon .detail .imgbox img { width: 100%; height: 92px;} .mapicon .detail .text {width: 178px;} .mapicon .detail .text h4 { font-size: 18px; color: #cd161d; font-weight: bold; margin-bottom: 6px;} .mapicon .detail .text p {font-size: 14px; line-height: 20px; color: #333333;} .mapicon img{ display: block; width: auto; height: auto;} .mapicon01{top: 44%; left: 80%;} .mapicon .map_cc {width: 23px; } .mapicon02{ top: 39%; left: 80%; z-index: 15;} .mapicon02 .map_cc {animation: jump 1s 0.6s infinite } .mapicon03{top: 14%; left: 74%;} .mapicon03 .map_cc {animation: jump 1.2s infinite } .mapicon04{ top: 36%; left: 81%;} .mapicon04 .map_cc {animation: jump 1.5s infinite } .mapicon05{top: 59%; left: 53%;display: none;} .mapicon05 .map_cc {animation: jump 1.6s infinite } .mapicon06{ top: 29%; left: 18%;display: none;} .mapicon06 .map_cc {animation: jump 1.3s infinite } .mapicon07{ top: 75%; left: 31%;display: none;} .mapicon07 .map_cc {animation: jump 1.1s infinite } .mapicon08{top: 48%; left: 69.5%;} .mapicon08 .map_cc {animation: jump 1.6s infinite } .mapicon09{top: 59%; left: 78%;} .mapicon09 .map_cc {animation: jump 1.6s infinite} .index06 .map .hide {position: absolute; z-index: 4; background-color: transparent; border-radius: 50%;} .index06 .map .hide1 { width: 147px; height: 127px;right: 119px; bottom: 56px; } .index06 .map .hide2 {width: 216px; height: 150px; top: 30%; left: 68%;} .index06 .map .hide3 { width: 405px; height: 113px; top: 11%; left: 65%;} .index06 .map .hide4 { width: 237px; height: 169px; top: 15%; left: 45%;} .index06 .map .hide5 { width: 244px; height: 259px; top: 43%; left: 44%;} .index06 .map .hide6 { width: 358px; height: 296px; top: 7%; left: 4%;} .index06 .map .hide7 { width: 166px; height: 256px; top: 58%; left: 25%;} .index06 .map .hide8 { width: 79px; height: 130px; top: 28%; left: 62.5%;} .index06 .map .hide9 { width: 150px; height: 167px; top: -1%; left: 31%;;} .index06 .map .mapicon08{top: 42%;left: 70%;} .index06 .map .mapicon09{top: 39%;left: 74%;} .index06 .map .mapicon10{top: 46%;left: 75%;} .index06 .map .mapicon11{top: 47.5%;left: 76.5%;} .index06 .map .mapicon12{top: 42%;left: 67%;} .index06 .map .mapicon13{top: 46%;left: 63%;} .index06 .map .mapicon14{top: 78%;left: 86%;} .index06 .map .mapicon15{top: 77%;left: 81%;} .index06 .map .mapicon16{top: 34%;left: 55%;} .index06 .map .mapicon17{top: 32%;left: 50%;} .index06 .map .mapicon18{top: 46%;left: 52%;} .index06 .map .mapicon19{top: 50%;left: 54%;} .index06 .map .mapicon20{top: 56%;left: 52%;} .index06 .map .mapicon21{top: 72%;left: 54%;} .index06 .map .mapicon22{top: 26%;left: 66%;} .index06 .map .mapicon23{top: 19%;left: 35%;} .index06 .map .mapicon24{top: 13%;left: 35%;} .index06 .map .mapicon25{top: 15%;left: 26%;} .index06 .map .mapicon26{top: 31%;left: 26%;} .index06 .map .mapicon27{top: 32%;left: 23%;} .index06 .map .mapicon28{top: 44%;left: 23%;} .index06 .map .mapicon29{top: 21%;left: 19%;} .index06 .map .mapicon30{top: 37%;left: 19%;} .index06 .map .mapicon31{top: 60%;left: 28%;} .index06 .map .mapicon32{top: 70%;left: 31%;} .index06 .map .mapicon.hide_cc{opacity: 0;} .indexnews{display: block;overflow: hidden;padding: 100px 0 200px; border-top: 1px solid #f5f5f5; position: relative;} .indexnews .tt{ display: block;overflow: hidden;margin-bottom: 30px; position: relative;z-index: 6;} .indexnews .tt strong{display: block;color: #333;font-size:50px;line-height: 1em;} .indexnews .tt font{display: block;width: 50px;height:4px;background:#00696c;margin: 20px 0;} .indexnews .tt span{display: block;color: #333;font-size:20px; line-height: 1em;} .indexnews .newslist{ display: flex;display: -webkit-flex;-webkit-flex-wrap: wrap;flex-wrap: wrap; position: relative;z-index: 6;} .indexnews .newslist .left{display: block; float: left; width: calc(55% - 17px);position: relative;} .indexnews .newslist .left a{ display: block;overflow: hidden;position: absolute; height: 100%; width: calc(50% - 15px); background: #fff; border: 1px solid #eee; border-radius:10px; } .indexnews .newslist .left a:nth-child(2n){ right: 0;} .indexnews .newslist .left a dd{display: block;overflow: hidden; padding: 40px; position: absolute;width: calc(100% - 80px);height: calc(50% - 80px);bottom: 0;left: 0;z-index: 3;} .indexnews .newslist .left a p{display: block;overflow: hidden; position: absolute;width: 100%;height: 50%;top: 0;left: 0; z-index: 3; } .indexnews .newslist .left a dd span{display: block;color: #333;font-size: 24px;line-height: 30px; margin-bottom: 30px;} .indexnews .newslist .left a dd font{font-family: 'Montserrat-Bold';color: #999;font-size: 14px;} .indexnews .newslist .left a dd strong{display: block;font-weight: normal;font-size: 12px;color: #00696c;border: 1px solid #eee;text-align: center;width: 80px;line-height: 26px; margin-bottom: 20px; } .indexnews .newslist .left a:nth-child(2n) p{ top: auto;bottom: 0; } .indexnews .newslist .left a:nth-child(2n) dd{ bottom: auto; top: 0;} .indexnews .newslist .left a p .fa{position: absolute; color: #fff; bottom: -5px; z-index: 3; left: 80px; transform: rotate(-90deg); font-size: 20px;} .indexnews .newslist .left a:nth-child(2n) p .fa{ bottom: auto;top: -5px;transform: rotate(90deg);} .indexnews .newslist .right{display: block;width: calc(45% - 15px); float: left; margin-left: 2%;} .indexnews .newslist .right a{ display: block;overflow: hidden;border-bottom: 1px solid #f5f5f5;padding-bottom: 15px;margin-bottom: 15px;position: relative;} .indexnews .newslist .right a p{ display: block;overflow: hidden;float: left;width: 24%; border-radius:4px; position: relative;} .indexnews .newslist .right a p img,.indexnews .newslist .left a p img{ display: block; width:100%; position: relative; height: 100%;transition: all .6s; object-fit: cover; } .indexnews .newslist .right a dd{ display: block;float: right;width: 73%;} .indexnews .newslist .right a dd span{ display: block;color: #333;font-size: 20px;line-height: 26px; transition: all .6s; margin-bottom: 10px;} .indexnews .newslist .right a dd font{font-family: 'Montserrat-Bold';color: #999;font-size: 14px;transition: all .6s; } .indexnews .newslist .right a dd strong{display: block;font-weight: normal;font-size: 12px;color: #00696c;border: 1px solid #eee;text-align: center;width: 80px;line-height: 26px;position: absolute;bottom: 30px;right: 0;transition: all .6s; } .indexnews .newslist .right a:last-child{ margin-bottom:0; } .indexnews .newslist .right a p .fa{position: absolute; color: #fff; right: -5px; z-index: 3; transform: rotate(180deg); font-size: 16px; top: 50%; line-height: 1em; margin-top: -10px;} .indexnews .nwesbg{ position: absolute;top: 0;left: 0;width: auto;height: 80%; transform-origin: center;-webkit-animation-name: up-and-down-o;animation-name: up-and-down-o;-webkit-animation-iteration-count: infinite;animation-iteration-count: infinite;-webkit-animation-timing-function: linear;animation-timing-function: linear;-webkit-animation-duration: 7s;animation-duration: 7s;} .indexnews .nbr{right: 0;left: auto; top: auto; bottom: -25%;} .indexnews .more{ position: relative;z-index: 6;margin: 50px 0 0; float: right;} .indexnews .newslist .right a:hover dd span{color: #00696c;} .indexnews .newslist .right a:after{ content: ""; position: absolute; width: 0; transition: all .5s; height: 1px; background: #00696c; bottom: 0; left: 0; } .indexnews .newslist .right a:hover:after{ width:100%;} .indexnews .newslist .left a:after{ content: ""; position: absolute; width: 0; transition: all .5s; height: 100%; background: #00696c; bottom: 0; left: 0; } .indexnews .newslist .left a:hover:after{ width:100%; } .indexnews .newslist .left a:hover dd span,.indexnews .newslist .left a:hover dd font{color:#fff; } .indexnews .newslist .left a:hover p .fa{color: #00696c;} .indexnews .newslist .left a:hover dd strong{color: #eee;border: 1px solid #eee;} .indexnews .newslist .right a:hover p img,.indexnews .newslist .left a:hover p img{ -webkit-transform:scale(1.1); -moz-transform:scale(1.1); transform:scale(1.1);} @-webkit-keyframes up-and-down-o{0%{transform:translateY(0)}50%{transform:translateY(180px) rotate(0deg)}to{transform:translateY(0)}} @keyframes up-and-down-o{0%{transform:translateY(0)}50%{transform:translateY(180px) rotate(0deg)}to{transform:translateY(0)}} .waves { width: 100%; height: 80px; margin-top: 0; margin-bottom: -8px; left: 0; bottom: 0; width: 100%; z-index: 3; margin-top: -78px; position: relative;} .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(-90px,0,0);}100% { transform: translate3d(85px,0,0);}} .footer{ position: relative;display: block; background:#212121; padding:80px 0;} .footer .f-title{ display: -webkit-flex;display: flex;-webkit-justify-content: space-between;justify-content: space-between; margin: 0 auto 0;} .footer .f-title dl h4{ display: block;overflow: hidden; margin-bottom: 26px;} .footer .f-title dl h4 a{ display: inline-block;color: #fff;font-size:20px; font-weight: bold; } .footer .f-title dl h5{} .footer .f-title dl h5 span{ display: block;overflow: hidden;margin-bottom:26px;} .footer .f-title dl h5 span a{ display: inline-block;color: #fff;font-size: 16px;line-height:20px;} .footer .f-title dl dt{ display: block;margin: 0 0 20px 0;} .footer .f-title dl dt p{ display: block;color: #aaa;font-size: 16px;} .footer .f-title dl dt .c1{font-family: 'Montserrat-Bold';color: #fff;font-size: 28px;line-height: 1em;margin-bottom: 20px;display: block;} .footer .f-title dl dt p .c2{ color: #fff;font-size: 18px;line-height: 1em;margin-bottom: 26px;display: block;font-family: 'Montserrat-Bold';} .footer .f-title dl dt p span{ color: #fff;font-size: 16px;line-height: 1em;margin-bottom: 26px;display: block;} .footer .f-title dl dt p span .ewmimg {display: block;margin-top: 10px;height: 100px;} .ftbottom{ display: block;overflow: hidden;padding: 0;text-align: center; padding:50px 0; background:#191919;} .ftbottom .f-logo{display: block;overflow: hidden;} .ftbottom .f-logo img{ display: block;width: auto;height: 60px;margin: 0 auto;} .ftbottom h4{ float: left; display: block;text-align: center;color: #ccc;font-size: 16px;letter-spacing: 0;margin: 0;} .ftbottom h4 a{display: inline-block; margin:0 0 0 30px; color: #ccc;letter-spacing: 0;font-size: 14px;} .ftbottom h5{display: block;float: right;} .ftbottom h5 a{} .ftbottom h5 a img{width: auto;display: block;height:20px;filter: grayscale(1) brightness(5); -webkit-filter: grayscale(1) brightness(5);} .footer .f-title dl h5 span a:hover,.ftbottom h4 a:hover{ color:#00959e; } /* side_btn */ .side_btn { position: fixed; left: 2.5%; bottom: 55px; display: flex; align-items: center; justify-content: center; width: 100px; height: 100px; display: flex; align-items: center; justify-content: center; z-index: 50;} .side_btn::before {content:''; width:100%; height:100%; position: absolute; left:0; top:0; background:url(/style/images/img_text_side.png) no-repeat; background-size:100%; animation: rotate 10s linear infinite; } .side_btn a { position: relative; width: 88px; height: 88px; display: block; text-align: center; line-height: 88px; } .side_btn a::before {content:''; width:100%; height:100%; position: absolute; left:50%; top:50%; transform: translate(-50%, -50%); border-radius: 50%; background:var(--dex); opacity: 0.25; display:none;} .side_btn a::after {content:''; width:67px; height:67px; position: absolute; left:50%; top:50%; transform: translate(-50%, -50%); border-radius: 50%; background:var(--dex); z-index:9;} .side_btn a img {width:26px; z-index:10; vertical-align: middle; position:Absolute; left:50%; top:50%; margin-top:-11px; margin-left:-13px; } @keyframes rotate { 0% { transform: rotate(0deg) } 100% { transform: rotate(360deg) } } /* biaodan */ .bd-mask{width: 100%;height: 100%;position: fixed;top:0;left: 0;z-index: 9999;background-color: rgba(0,0,0,0.8);display: none;} .bd-mask .tcbox{width: 100%;height: 100%;position: absolute;top: 0;left: 0;background-image: url();display: flex;display: -webkit-flex;justify-content: center;-webkit-justify-content:center;align-items: center;-webkit-align-items:center;} .bd-mask .tcbox .contwarp{width: 47%;height: auto;background-color: #fff;box-sizing: border-box;padding: 60px 60px;position: relative; border-radius: 16px;} .bd-mask .tcbox .contwarp .min:after{content: '';display: block;clear: both;} .bd-mask .tcbox .contwarp h3{font-size: 34px;color: #333;margin-bottom: 10px;text-align: center; margin-bottom: 30px; font-weight: bold;} .bd-mask .tcbox .contwarp form{width: 100%;margin:auto;margin-bottom: auto;box-sizing: border-box;} .bd-mask .tcbox .contwarp form span{display: block;width: 49%;float: left;margin-right: 2%;} .bd-mask .tcbox .contwarp form input,.bd-mask .tcbox .contwarp form select,.bd-mask .tcbox .contwarp form textarea{display: block;width: 100%;background-color: #fff;border:1px solid #ddd;outline: none;border-radius: 5px;margin-bottom: 20px;height: 40px;box-sizing: border-box;padding-left: 10px;font-size: 14px;color: #666;} .bd-mask .tcbox .contwarp form select {padding-left: 6px;color: #666;} .bd-mask .tcbox .contwarp form textarea{height: 120px;resize: none;padding: 10px;} .bd-mask .tcbox .contwarp form span:nth-of-type(2n){margin-right: 0;} .bd-mask .tcbox .contwarp form h3{font-size: 24px;color: #333333;font-weight: bold;text-align: center;margin-bottom: 30px;} .bd-mask .tcbox .contwarp form h3 span{color: #ffc602;} .bd-mask .tcbox .contwarp form span:nth-last-child(1){width: 100%;} .bd-mask .tcbox .contwarp font{font-size: 14px;color: var(--dex);display: block;width: 100%;clear: both;margin-top: 20px;} .bd-mask .tcbox .contwarp form button{ border-radius: 30px; cursor: pointer;display: block;width: 160px;height: 40px;border: 1px solid var(--dex);background-color: var(--dex);color: #fff;font-size: 12px;color: #ffffff;margin: auto;outline: none;transition: all .3s;clear: both;padding: 0;margin-top: 30px;} .bd-mask .tcbox .contwarp form button:after{background-color: #ffffff;border-radius: 0;} .bd-mask .tcbox .contwarp form button:hover{color: var(--dex); background: transparent;} .bd-mask .tcbox .contwarp .close {position: absolute; right: -40px; top: -40px; transition: all .3s; pointer-events: painted; width: auto; cursor: pointer;} .bd-mask .tcbox .contwarp .close:hover{transform: rotate(180deg);} .bd-mask .tcbox .contwarp form input::-webkit-input-placeholder,.bd-mask .tcbox .contwarp form textarea::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #666; } .bd-mask .tcbox .contwarp form input::-moz-placeholder,.bd-mask .tcbox .contwarp form textarea::-moz-placeholder { /* Firefox 19+ */ color: #666; } .bd-mask .tcbox .contwarp form input:-ms-input-placeholder,.bd-mask .tcbox .contwarp form textarea:-ms-input-placeholder { /* IE 10+ */ color: #666; } .bd-mask .tcbox .contwarp form input:-moz-placeholder,.bd-mask .tcbox .contwarp form textarea:-moz-placeholder { /* Firefox 18- */ color: #666; } /* news */ .icenter1 {position: relative;width: 1400px;margin: auto;} .innerbanner {height: auto;} .innerbanner .swiper-slide::after { content: ""; display: inline-block; width: 100%; height: 65%; background: linear-gradient(to top,rgba(0,0,0,0.8),rgba(0,0,0,0)); position: absolute; left: 0; bottom: 0; opacity: 1; top: auto; } .innerbanner .inbannertxt dd:nth-of-type(1) {margin-bottom: 12px;} .innerbanner .inbannertxt dd span {font-size: 18px;font-family: arial;color: rgba(255,255,255,0.7);display: block;} .innerbanner .inbannertxt dd h6 {font-size: 50px;color: #fff;} .innerbanner .swiper-slide .inbannertxt dd:nth-of-type(2) {margin-bottom: 55px;} .innerbanner .swiper-slide .inbannertxt { bottom: -2%; top: auto} .innerbanner .barn { box-sizing: border-box; padding-right: 30px; bottom: 50px; width: 1400px; z-index: 9; height: 30px; text-align: end; left: 50%; transform: translateX(-50%); } .banner .barn .swiper-pagination {width: auto;} /* news*/ .news_nav {display: flex;align-items: center;padding: 80px 0 79px;} .news_nav a:nth-of-type(1) {margin-left: 0px;} .news_nav a { transition: 0.3s; margin: 0 34px; font-size: 24px;color: rgba(54, 54, 54,0.5);position: relative;padding-bottom: 5px;border-bottom: 3px solid transparent;} .news_nav a.active {color: var(--dex);border-color: var(--dex);} .news_nav a:hover {color: var(--dex);border-color: var(--dex);} .news_show {padding-bottom: 50px;position: relative;overflow: hidden;} .news_show a {display: flex;justify-content: space-between;align-items: center;padding: 50px 0;} .news_show a:nth-of-type(2n) {flex-flow: row-reverse;} .news_show a .imgbox {position: relative;overflow: hidden;width: 34%;border-radius: 10px;z-index: 10;} .news_show a .imgbox img{transition: 0.3s;} .news_show a:hover .imgbox img {transform: scale(1.1);} .news_show a .text {width: 58%;} .news_show a .text .date {font-size: 16px;color: #999999;font-family: arial;margin-bottom: 5px;} .news_show a .text h4 {font-size: 34px;color: #333333;margin-bottom: 17px;} .news_show a .text p {font-size: 18px;color: #666666;line-height: 30px;margin-bottom: 47px;} .news_show a .text a {} .news_show a:hover .text h4 {color: var(--dex);} .news_show a:hover .text .more { color: #fff; background: #1c6363; } .page {display: flex;justify-content: center;align-items: center;margin-bottom: 180px;} .page h2{display: none;} .page .pagination .nav-links {display: flex;justify-content: center;align-items: center;} .page a { border-radius: 50%; width: 46px;height: 46px;border: 1px solid transparent;display: flex;align-items: center;justify-content: center;font-size: 20px;color: #464647;margin-right: 18px;} .page a:last-child{margin-right: 0px;} .page span { border-radius: 50%; width: 46px;height: 46px;border: 1px solid #cbcbcb;display: flex;align-items: center;justify-content: center;font-size: 20px;color: #464647;margin-right: 18px;} .page span:hover {color: #fff;background-color: var(--dex);border-color: var(--dex);} .page span {color: #fff;background-color: var(--dex);border-color: var(--dex);} .page a:hover {color: #fff;background-color: var(--dex);border-color: var(--dex);} /* join */ .jn01 { padding: 50px 0 120px; position: relative; overflow: hidden;} .jn01 .ab_h3 {text-align: center;margin-bottom: 38px;} .jn01 dl {display: flex;justify-content: space-between;} .jn01 dl dd { box-sizing: border-box; width: 31.5%; display: flex; justify-content: center; align-items: center; flex-direction: column; padding: 80px 52px; -webkit-box-shadow: 0 5px 20px 0 rgba(0,0,0,0.15); -webkit-box-shadow: 0 5px 20px 0 rgba(0,0,0,0.15); border-radius: 5px;} .jn01 dl dd img { margin-bottom: 30px; display: block; height: 60px;transition: 0.3s;} .jn01 dl dd h4 {font-size: 36px; color: #333333; padding-bottom: 16px; margin-bottom: 17px; border-bottom: 1px solid #c3c3c3; width: 65%; text-align: center;} .jn01 dl dd p {text-align: center; font-size: 20px;color: #666666;line-height: 34px;height: 68px;} .jn01 dl dd:hover img {transform: rotateY(180deg);} .jn01 dl dd:hover h4 {color: var(--dex);} .jn02 {padding-bottom: 150px;position: relative;overflow: hidden;} .jn02 .top {display: flex;justify-content: space-between;} .jn02 .top .le {width: 49%;padding-top: 140px;position: relative;} .jn02 .top .le .imgbox:hover img{transform: scale(1.1);} .jn02 .top .le .imgbox {width: 100%;} .jn02 .top .le .imgbox img {height: 100%;object-fit: cover;} .jn02 .top .le .bg1 { z-index: 1; height: 140px;position: absolute;left: 0px;top: 0px;} .jn02 .top .le .bg1 img,.jn02 .top .le .bg3 img ,.jn02 .top .le .bg2 img {height: 100%;display: block;object-fit: cover;} .jn02 .top .le .bg2 {width: 140px; position: absolute;right: -140px;bottom: 0px;} .jn02 .top .le .bg3 {height: 140px;right: 0px;position: absolute;top: 0px;} .jn02 .top .ri { position: relative; padding-top: 66px;width: 35%;padding-right: 28px;box-sizing: border-box;} .jn02 .top .ri p {font-size: 38px;font-weight: bold;color: #333333;line-height: 50px;margin-bottom:86px ;} .jn02 .top .ri a { position: relative; padding-top: 23px; font-size: 20px;color: var(--dex);} .jn02 .top .ri a::before { content: ""; position: absolute;top: 0px;left: 0px;height: 3px;width: 53px;background-color: var(--dex);} .jn02 dl {display: flex; justify-content: space-between;margin-top: 90px;} .jn02 dl dd { display: flex; position: relative; width: fit-content; align-items: center;} .jn02 dl dd::after { position: absolute; content: ""; height: 100%; width: 1px; background-color: #d0d0d0; left: 143%;} .jn02 dl dd:last-child::after {display: none;} .jn02 dl dd .icon img{width: 90px;display: block;transition: 0.3s;} .jn02 dl dd:hover .icon img {transform: rotateY(180deg);} .jn02 dl dd:nth-of-type(1):after { left: 173%; } .jn02 dl dd:nth-of-type(2):after { left: 159%; } .jn02 dl dd .icon {margin-right: 28px; height: fit-content; width: fit-content;} .jn02 dl dd .text {width: auto;} .jn02 dl dd .text h4 { display: flex; align-items: flex-end;} .jn02 dl dd .text h4 strong {font-family: arial;color: var(--dex);font-size: 70px;} .jn02 dl dd .text h4 span { font-size: 30px; font-weight: bold; color: #666666; line-height: 53px;} .jn02 dl dd .text h5 {font-size: 18px;color: #666666;} .jn03 {padding-bottom: 150px;position: relative;overflow: hidden;} .jn03 .ab_h3 {margin-bottom: 40px;} .jn03 .bot {} .jn03 .bot .seg {position: relative;display: flex;} .jn03 .bot .seg .imgbox {width: 65.7%;} .jn03 .bot .seg .text { width: 41%; background-color: #fff;box-sizing: border-box; padding: 98px 6%; position: absolute;right: 0px;top: 50%;transform: translateY(-50%); -webkit-box-shadow: 0 5px 20px 0 rgba(0,0,0,0.15); -webkit-box-shadow: 0 5px 20px 0 rgba(0,0,0,0.15);} .jn03 .bot .seg .text h4 {font-size: 38px;font-weight: bold;} .jn03 .bot .seg:hover .text h4 {color: var(--dex);} .jn03 .bot .seg .text p {font-size: 18px;color: #666666;margin-top: 20px;line-height: 30px;} .jn03 .bot .seg:nth-of-type(1) {margin-bottom: 75px;} .jn03 .bot .seg:nth-of-type(2) {justify-content: flex-end;} .jn03 .bot .seg:nth-of-type(2) .text {left: 0px;right: auto;} .jn04 {padding-bottom: 146px;position: relative;overflow: hidden;} .jn04 .top {margin-bottom: 40px;} .jn04 .top h4 {color: #666;font-size: 16px;} .jn04 .top h3 {font-size: 38px;font-weight: bold;color: #333333;margin-bottom: 16px;} .jn04 .top p {font-size: 18px;color: #666666;} .jn04 .bot { width: calc(100% - (100% - 1400px)/2 ); position: relative;left:calc((100% - 1400px)/2);} .jn04 .bot .swiper {overflow: hidden;position: relative;} .jn04 .bot .b_so { margin-top: 45px; width: 1400px; display: flex;align-items: center;justify-content: space-between; margin-top: 34px;} .jn04 .bot .b_so .swiper-pagination { position: unset; width: 87%; height: 5px; border-radius: 5px;} .jn04 .bot .b_so .fa { background-color: #e8e8e8; position: unset; width: auto; height: auto; margin: 0px; padding: 0px; width: 60px; height: 60px; font-size: 36px; color: #797979; display: flex; justify-content: center; align-items: center; background-image: none; border-radius: 50%;} .jn04 .bot .b_so .faf {width: 10%;display: flex;justify-content: space-between;align-items: center;} .jn04 .bot .b_so .fa:hover {color: #fff;background-color: var(--dex);} .jn04 .bot .b_so .swiper-pagination-progressbar { background: rgba(0,0,0,.05); } .jn04 .bot .b_so .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: var(--dex);border-radius: 12px;} .jn04 .bot .imgbox:hover img {transform: scale(1.1);} .jn05 {padding-bottom: 180px;position: relative;overflow: hidden;} .jn05 .top {margin-bottom: 140px; display: flex;justify-content: space-between;} .jn05 .top dd { box-sizing: border-box; transition: 0.3s; background-color: #f5f5f5; width: 48.5%;padding: 80px 5%;display: flex;flex-direction: column;justify-content: center;align-items: center;} .jn05 .top dd img { height: 74px; display: block; margin: auto; margin-bottom: 25px;} .jn05 .top dd h4 { font-size: 38px; color: #333333; margin-bottom: 18px; text-align: center; font-weight: bold;} .jn05 .top dd p {text-align: center; font-size: 18px;color: #666666;line-height: 30px;} .jn05 .top dd:hover img { filter: invert(1);} .jn05 .top dd:hover h4 {color: #fff;} .jn05 .top dd:hover p {color: #fff;} .jn05 .top dd:hover {background-color: var(--dex);} .jn05 .mid {position: relative;margin-bottom: 140px;} .jn05 .mid .text { background-color: #ffffff; position: absolute; top: 50%; transform: translateY(-50%); left: 0px; width: 45%; padding: 90px 7%; box-sizing: border-box;} .jn05 .mid .text h4 {font-size: 38px;font-weight: bold;color: #333333;padding-bottom: 20px;margin-bottom: 20px;border-bottom: 1px solid #b7b7b7;} .jn05 .mid .text p {font-size: 18px;color: #666666;line-height: 30px;} .jn05 .mid:hover .text h4 {color: var(--dex);} .jn05 .bot {position: relative;overflow: hidden;} .jn05 .bot .ab_h3{text-align: center;} .jn05 .bot p { width: 68.5%;margin: 25px auto 39px; text-align: center; font-size: 18px;color: #666666;line-height: 30px;} .jn05 .bot .jia {width: fit-content;margin: auto;} .jn05 .bot .jia .box { position: relative; width: 178px;height: 178px;background-color: var(--dex);border-radius: 50%;display: flex;justify-content: center;align-items: center;} .jn05 .bot .jia .box::before { transition: 0.5s; border-radius: 50%; width: 132px;height: 132px;position: absolute;content: "";left: -86px;z-index: -1;background-color: #cce1e2;top: 20px;} .jn05 .bot .jia .box:hover::before { left: 132px;} .jn05 .bot .jia .box::after { transition: 0.5s; border-radius: 50%; width: 132px;height: 132px;position: absolute;content: "";right:-86px;z-index: -1;background-color: #cce1e2;top: 20px;} .jn05 .bot .jia .box:hover::after {right: 132px;} .jn05 .bot .jia .box h4 {display: flex;align-items: center;color: #fff;font-size: 18px;} .jn05 .bot .jia .box h4 span {transition: 0.3s; font-size: 18px;margin-left: 3px;position: relative;left: 0px;} .jn05 .bot .jia .box:hover h4 span {left: 10px;} /* join-list */ .single_banner {position: relative;overflow: hidden;} .single_banner img {width: 100%;object-fit: cover;height: 100%;display: block;} .single_banner::after { content: ""; display: inline-block; width: 100%; height: 65%; background: linear-gradient(to top,rgba(0,0,0,0.8),rgba(0,0,0,0)); position: absolute; left: 0; bottom: 0; opacity: 1; top: auto; } .single_banner .text { z-index: 1; display: flex;align-items: center;justify-content: space-between; position: absolute;left: 50%;transform: translateX(-50%);bottom: 15%;} .single_banner .text .le {} .single_banner .text .le h4 {font-size: 24px; color: #fff; margin-bottom: 8px; display: none;} .single_banner .text .le h5 {font-size: 64px;color: #fff;} .single_banner .text .ri { cursor: pointer; position: relative; width: 115px;height: 115px;border-radius: 50%;display: flex;justify-content: center;align-items: center;} .single_banner .text .ri img { width: 50px; height: auto; position: relative; z-index: 5; filter: grayscale(10) brightness(10);} .single_banner .text .ri::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: inherit; box-shadow: inset 0 0 0 126px #00959E; transition: box-shadow 0.3s, transform 0.3s; } .single_banner .text .ri:hover:after { box-shadow: inset 0 0 0 2px #00959E; transform: scale(1.1); } .single_banner .text .ri:hover img {filter: none;} .single_banner .text .ri:hover:before {width: 100%;height: 100%;background-color:red;} .jl {padding: 140px 0 180px;} .jl dd { padding: 0px 0; margin-bottom: 24px;} .jl dd .top { position: relative; background-color: #fff; box-shadow: 0 0 10px #ddd; padding: 47px 50px; box-sizing: border-box;} .jl dd .top .state { font-size: 59px; color: var(--dex); font-family: arial; right: 65px; position: absolute; top: 50%; cursor: pointer; transform: translateY(-50%);} .jl dd .top h4 {font-size: 30px;color: #333333;font-weight: bold;margin-bottom: 12px;} .jl dd:hover .top h4 {color: var(--dex);} .jl dd .top.active h4 {color: var(--dex);} .jl dd .top.active .state {color: var(--dex);} .jl dd .top .tip {display: flex;align-items: center;} .jl dd .top .tip h5 {display: flex;align-items: center;margin-right: 30px;} .jl dd .top .tip h5 img { height: 18px; margin-right: 5px; width: auto;} .jl dd .top .tip h5 span {font-size: 18px;color: #666666;} .jl dd .top .jian {display: none;} .jl dd .top.active .jian {display:block;} .jl dd .top.active .jia {display: none;} .jl dd .top:hover .state {color: var(--dex);} .jl dd .bot {display: none; padding: 45px 63px;} .jl dd .bot .cc h4 { font-size: 20px; color: #333333; margin-bottom: 17px; font-weight: bold;} .jl dd .bot .cc p{ font-size: 16px; line-height: 36px; color: #666666;} .jl dd .bot .cc {margin-bottom: 30px;} .jl dd .bot .you {font-size: 18px; color: #333333; display: flex; flex-flow: wrap;display: none;} .jl dd .bot span {font-size: 18px;color: var(--dex);font-weight: bold;} /* social */ .social {padding: 50px 0 80px;position: relative;} .social .seg {margin-bottom: 190px;} .social .seg .top{margin-bottom: 115px; position: relative;display: flex;justify-content: space-between;} .social .seg .top .bg { position: absolute; left: -225px; width: 457px; top: 0px;} .social .seg .top .le {font-size: 50px;font-weight: bold;color: #333333;line-height: 60px;position: relative; height: fit-content;} .social .seg .top .le::after { position: absolute; content: ""; width: 50px; height: 3px; background-color: var(--dex); bottom: -20px; left: 0px;} .social .seg .top .ri {width: 66%;} .social .seg .top .ri p {font-size: 18px;color: #666666;line-height: 30px;} .social .seg .top .ri .cc {margin-top: 45px;} .social .seg .top .ri .cc h4 {font-size: 26px;font-weight: bold;color: #333333;margin-bottom: 8px;} .social .seg .bot {overflow: hidden;position: relative;} .social .seg .bot h3 {font-size: 34px;font-weight: bold;color: #333333;margin-bottom: 30px;} .social .seg .bot .swiper .box .imgbox{border-radius: 10px;position: relative;overflow: hidden;z-index: 10;} .social .seg .bot .swiper .box .imgbox img{transition: 0.3s; object-fit: cover; height: 100%; display: block;} .social .seg .bot .swiper .box:hover .imgbox img {transform: scale(1.1);} .social .seg .bot .swiper .box span { font-size: 18px; color: #666666; margin-top: 15px; display: block;} .social .seg .bot .swiper .box:hover span {color: var(--dex);} .social .seg .bot .b_so {display: flex;align-items: center;justify-content: space-between; margin-top: 34px;} .social .seg .bot .b_so .swiper-pagination { position: unset; width: 87%; height: 5px; border-radius: 5px;} .social .seg .bot .b_so .fa { background-color: #e8e8e8; position: unset; width: auto; height: auto; margin: 0px; padding: 0px; width: 60px; height: 60px; font-size: 36px; color: #797979; display: flex; justify-content: center; align-items: center; background-image: none; border-radius: 50%;} .social .seg .bot .b_so .faf {width: 10%;display: flex;justify-content: space-between;align-items: center;} .social .seg .bot .b_so .fa:hover {color: #fff;background-color: var(--dex);} .social .seg .bot .b_so .swiper-pagination-progressbar { background: rgba(0,0,0,.05); } .social .seg .bot .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: var(--dex);border-radius: 12px;} /* vi_box */ .vi_box { top: 0px; left: 0px; display: none; position: fixed;width: 100%;height: 100%;z-index: 999;background-color: rgba(0,0,0,0.8);} .vi_box .box {height: 100%;width: 100%; display: flex;justify-content: center;align-items: center;} .vi_box .box video{ width: 100%;height: 100%; position: relative; object-fit: cover; display: block;} .vi_box .box .video {position: relative;width: 70%; height: 68%;} /* .vi_box .box .video .close {position: absolute; font-size: 50px; right: -34px; top: -51px; color: #0068b6; transition: 0.3s; cursor: pointer;} */ .vi_box .box .video img.close{ cursor: pointer;width: auto;position: absolute;right: -40px;top: -40px;transition: all .3s;pointer-events: painted;} .vi_box .box .video .close:hover {transform: rotate(135deg);} /* about */ .ab_h3 {font-size: 48px;font-weight: bold;color: #333333;line-height: 60px;} .ab01 { padding: 50px 0 120px; position: relative; overflow: hidden;} .ab01 .top {display: flex;justify-content: space-between;align-items: center;} .ab01 .top .le {width: 39%;position: relative;overflow: hidden;padding-bottom: 60px;} .ab01 .top .le .swiper-pagination .swiper-pagination-bullet-active { width: 74px; background: var(--dex); } .ab01 .top .le .swiper-pagination span { width: 42px; height: 2px; position: relative; margin: 0 10px; display: inline-block; opacity: 1; background: rgba(102,102,102,0.2); transition: all 1.5s; border-radius: 0; } .ab01 .top .le .swiper-pagination span:nth-of-type(1) {margin-left: 0px;} .ab01 .top .le .swiper-pagination-bullet { cursor: pointer; } .ab01 .top .le .swiper-container-horizontal>.swiper-pagination-bullets {width: fit-content;bottom: 0px;} .ab01 .top .le .box {} .ab01 .top .le .box h3 {margin-bottom: 40px;} .ab01 .top .le .box p {font-size: 18px;color: #666666;line-height: 30px;} .ab01 .top .ri video{width: 100%; height: 445px; border-radius: 0px; position: relative; object-fit: cover;;} .ab01 .top .ri {position: relative;width: 100%;} .ab01 .top .ri .bo { cursor: pointer; position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%); z-index: 3;} .ab01 .top .ri .bo img {width: 80px;} .ab01 .top .ri {width: 50.5%;position: relative;} .ab01 .top .ri .mask { -webkit-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); position: absolute; top: 50%; left: 50%; z-index: 1; } .ab01 .top .ri .mask:before { position: relative; content: ''; display: block; margin-top: 100%; } .ab01 .top .ri .mask:after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; border-radius: 50%; } .ab01 .top .ri:hover .mask{-webkit-animation:anim-out 1s;animation:anim-out 1s} .ab01 .top .ri:hover .mask:after{-webkit-animation:anim-out-pseudo 1s;animation:anim-out-pseudo 1s} @-webkit-keyframes anim-out{0%{width:0%} 100%{width:100%} } @keyframes anim-out{0%{width:0%} 100%{width:100%} } @-webkit-keyframes anim-out-pseudo{0%{background:rgba(255,255,255,.5)} 100%{background:0 0} } @keyframes anim-out-pseudo{0%{background:rgba(255,255,255,.5)} 100%{background:0 0} } .ab01 dl{display: flex;margin-top: 100px;justify-content: space-between;} .ab01 dl dd {display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; width: 275px; display: flex;} .ab01 dl dd .icon img{width:50px;transition: 0.3s;} .ab01 dl dd:hover .icon img {transform: rotateY(180deg);} .ab01 dl dd h4 { display: flex; align-items: center; margin: 22px 0 16px;} .ab01 dl dd h4 strong { line-height: 86px; font-size: 73px; color: #333333; font-weight: bold; font-family: 'Montserrat-Bold';} .ab01 dl dd:hover h4 strong {color: var(--dex);} .ab01 dl dd h5 {text-align: center;font-size: 18px;color: #666666;} .ab01 dl dd:hover h5 {color: var(--dex);} .ab02 {margin-top: 250px;position: relative;background-color: #212121;} .ab02 .bg {position: absolute;top: -246px;left: 50%;transform: translateX(-50%);z-index: 1;} .ab02 .bg img {width: 100%;object-fit: cover;display: block;} .ab02 .top {overflow: hidden;} .ab02 .top .box {} .ab02 .top .box h4 {font-size: 52px; color: rgba(255,255,255,0.7); margin-bottom: 18px; font-weight: bold; font-family: 'Montserrat-Bold';} .ab02 .top .box p {font-size: 18px;line-height: 32px;color: rgba(255,255,255,0.5);margin-bottom: 44px;} .ab02 .top .swiper-slide-active .box h4 {color: var(--dex);} .ab02 .top .swiper-slide-active .box p {color: rgba(255,255,255,1);} .ab02 .bot .dot {transition: 0.3s; cursor: pointer; position: relative; display: flex;justify-content: center;align-items: center; width: 32px;height: 32px;background-color: rgba(255,255,255,0);border-radius: 50%;} .ab02 .bot .dot::after { width: 100%; height: 100%; background-color: transparent; position: absolute; content: ""; left: 0px; top: 15px;} .ab02 .bot .dot span { width: 13px; height: 13px; background-color: rgba(255,255,255,0.5); border-radius: 50%;} .ab02 .bot .dot .text { font-size: 16px; color: rgba(255,255,255,0.7); position: absolute; top: 42px; left: 50%; transform: translateX(-50%); white-space: nowrap;} .ab02 .bot {position: relative; padding: 0 20px; margin-top: 30px;} .ab02 .bot::before { height: 1px; background-color: rgba(255,255,255,0.3); position: absolute; content: ""; top: 50%; transform: translateY(-50%); left: 0px; width: 100%;} .ab02 .bot .fa { display: flex; justify-content: center; align-items: center; background-image: none; margin: 0px; width: 40px; height: 65px; border-radius: 5px; border: 1px solid #fff; color: #fff; font-size: 30px; top: 50%; transform: translateY(-50%);} .ab02 .bot .fa-angle-left {left: -90px;} .ab02 .bot .fa-angle-right {right: -90px;} .ab02 .bot .swiper { overflow: hidden; padding: 32px 32px; } .about-devlpment__bg{ opacity: .6; position:absolute;top:50%;left:50%;width:87%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)} .about-devlpment__bg::before{content:"";display:block;padding-top:100%} .about-devlpment__bg span{position:absolute;top:0;right:0;bottom:0;left:0;background:no-repeat url(https://www.shfcme.com.cn/style/images/circle.png) center center;background-size:contain;-webkit-transition:transform 1s;transition:transform 1s} .ab02 .top .swiper .imgbox img { -webkit-clip-path:polygon(0 0, 100% 0, 100% 0, 0 0); clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); -webkit-transition: all .5s ease .3s; transition: all .5s ease .3s; } .ab02 .top .swiper .swiper-slide-active img{ clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); -webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%)} .ab02 .bot .swiper-slide-thumb-active .dot {background-color: rgba(255,255,255,0.2);} .ab02f { overflow: hidden; position: relative; padding: 354px 0 130px;} .ab02 .bot .swiper-slide-thumb-active .dot span {background-color: rgba(255,255,255,1);} .ab03 {padding: 120px 0;position: relative;overflow: hidden;} .ab03 .ab_h3 {text-align: center;margin-bottom: 34px;} .ab03 dl {display: flex;height: 728px;justify-content: center;flex-flow: wrap;} .ab03 dl dd {width: calc(100%/3);height: calc(100%);position: relative;} .ab03 dl dd:nth-of-type(2) {display: flex;flex-direction:column;flex-flow: column-reverse;} .ab03 dl dd .top {height: calc(100%/2); width: 100%; position: relative; display: flex; flex-direction: column; justify-content: flex-end;} .ab03 dl dd .imgbox {position: relative;overflow: hidden;width: 100%;height: calc(100%/2);} .ab03 dl dd .imgbox img {transition: 0.3s;object-fit: cover;height: 100%;display: block;} .ab03 dl dd .text {box-sizing: border-box; width: 100%;padding: 50px 34px;background-color: #fafafa;height: 60%;} .ab03 dl dd .text h4 {font-size: 34px;font-weight: bold;color: #00696c;margin-bottom: 15px;} .ab03 dl dd .text p {font-size: 20px;color: #333333;line-height: 30px;} .ab03 dl dd .bg img {width: 100%;height: 100%;display: block;object-fit: cover;} .ab03 dl dd:nth-of-type(1) .bg {height: 40%;position: absolute;top: 0px;left: -284px;width: 561px;} .ab03 dl dd:nth-of-type(3) .bg {height: 40%;position: absolute;top: 0px;left: 0px;width: 100%;} .ab03 dl dd:nth-of-type(2) .bg {height: 40%;position: absolute;bottom: 0px;right: 0px;width: 65%;} .ab03 dl dd:nth-of-type(2) .top { position: relative; display: flex; flex-direction: column; justify-content: flex-start; } .ab03 dl dd:hover .imgbox img {transform: scale(1.1);} .ab04 {padding: 140px 0 180px;position: relative;overflow: hidden;background-color: #f0f0f0;} .ab04 .bg { position: absolute; left: 0px; width: 457px; left: -225px; top: -66px;opacity: 0.5; } .ab04 .bg img{width: 100%;} .ab04 .ab_h3 {text-align: center;} .ab04 p {font-size: 18px; line-height: 30px; color: #666666; margin: 20px 0 40px; text-align: center;} .ab04 dl { display: flex; flex-flow: wrap; z-index: 1; position: relative;} .ab04 dl dd { width: 24%; margin-right: 1.3%; margin-bottom: 28px;} .ab04 dl dd:nth-of-type(4n) {margin-right: 0px;} .ab04 dl dd .imgbox {position: relative; overflow: hidden;} .ab04 dl dd .imgbox img {transition: 0.3s;object-fit: cover;width: 100%;display: block;} .ab04 dl dd:hover .imgbox img{transform: scale(1.1);} .ab04 dl dd span {font-size: 18px; color: #666666; margin-top: 15px; text-align: center; display: block;} .ab04 dl dd:hover span {color: var(--dex);} .ab04 h6 {margin: 60px auto 0px;font-size: 18px;color:#00696c; text-align: center;} /* contact */ .contact {padding: 50px 0 180px;position: relative;overflow: hidden;} .contact .icenter1 {padding: 0 184px; box-sizing: border-box;} .con01 .ab_h3 {margin-bottom: 60px;} .con01 .bot {display: flex;justify-content: space-between;} .con01 .bot .le {width: 55%;} .con01 .bot .le h4 { font-family: arial; font-size: 40px; color: var(--dex); margin-bottom: 10px; font-weight: bold;} .con01 .bot .le h5 {font-size: 18px;color: #666666;padding-bottom: 33px;border-bottom: 1px solid #cfcccc;margin-bottom: 30px;} .con01 .bot .le h6 {font-size: 36px;color: #333333;margin-bottom: 26px;font-weight: bold;} .con01 .bot .le p {font-size: 18px;line-height: 40px;color: #666666;} .con01 .bot .ri { width: 30%; background-color:#f5f5f5; padding: 50px; box-sizing: border-box;} .con01 .bot .ri .imgbox img {width: 83%;left: 0px;margin: auto;} .con01 .bot .ri .text {padding:20px;} .con01 .bot .ri .text h4 { font-size: 18px; color: #666; margin-bottom: 0px; text-align: center; line-height: 25px;} .con01 .bot .ri .text a {text-decoration: underline;color: var(--dex);} .con02 h3 { font-weight: bold; font-size: 36px;color: #333333;margin-bottom: 36px;} .con02 form .sp{margin-bottom: 34px; display: flex;justify-content: space-between;align-items: center;} .con02 form .sp .cc { width: 47.8%; } .con02 form .sp .cc label {font-size: 16px; color: #666666; margin-bottom: 12px; display: block; } .con02 form .sp .cc input { font-size: 14px; background-color: #f5f5f5; width: 100%; border: 0px; padding-left: 21px; height: 60px; outline: none;} .con02 form .sp .cc textarea { font-size: 14px; resize: none;background-color: #f5f5f5; width: 100%;border: 0px;padding-left: 21px; padding-top: 20px; height: 150px;outline: none;resize: none;} .con02 form .sp:last-child {margin-bottom: 12px;} .con02 form .sp.sp4 .cc,.con02 form .sp.sp3 .cc{width: 100%;} .con02 form .sp .cc input::-webkit-input-placeholder,.con02 form .sp .cc textarea::-webkit-input-placeholder { font-size: 14px;color: rgba(153,153,153,0.5);} .con02 form button { box-sizing: content-box; cursor: pointer; margin-top: 65px;background-color: transparent;} .con_map{ position:relative;margin: 110px 0;} .con_map .bg {width: 100%;} .con_map .bg img { width:100%; height:auto;display: block; } .con_map .c{ position: absolute; cursor: pointer; width: 200px; height: auto; left: 50%; top: 43%; z-index: 2; transform: translate(-50%, -50%);} .con_map .c .more {width: 100%;height: 44px;line-height: 40px;box-sizing: border-box;} .con_map .c i{ display: block; background: url(/style/images/lx_tb.png) no-repeat; width: 50px; height: 50px; margin: 0 auto 20px; animation: myanimate 0.5s infinite alternate; -webkit-animation: myanimate 0.5s infinite alternate; background-size: contain; } .con_map .c:hover .more {color: #fff;background-color: var(--dex);} @keyframes myanimate { 0% { transform:translateY(0) scale(1,1);} 100%{transform:translateY(15px) scale(0.9,0.9);} } @-webkit-keyframes myanimate { 0% { transform:translateY(0) scale(1,1);} 100%{transform:translateY(15px) scale(0.9,0.9);} } /* download */ .dow {padding: 50px 0 180px;position: relative;overflow: hidden;} .dow dd {padding: 26px 0;position: relative;overflow: hidden;border-bottom: 1px solid #d0d0d0;} .dow dd:nth-of-type(1) {border-top: 1px solid #d0d0d0;} .dow dd a {display: flex;justify-content: space-between;align-items: center;} .dow dd a .le {position: relative;width: 34%;border-radius: 10px;overflow: hidden;z-index: 10;} .dow dd a:hover .le .imgbox img {transform: scale(1.1);} .dow dd a .imgbox:after { content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: #000; opacity: 0.3; } .dow dd a .le .icon {position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);} .dow dd a .le .icon img {width: 54px;} .dow dd a .ri {width: 61%;} .dow dd a .ri h4 {font-size: 30px;color: #333333;font-weight: bold;margin-bottom: 13px;} .dow dd a .ri h5 {font-size: 18px;font-family: arial;color: #666;margin-bottom: 54px;} .dow dd a:hover .ri h4 {color: var(--dex);} .dow dd a:hover .ri .more {background-color: var(--dex);color: #fff;} /* art_info */ .art_info_banner {position: relative;overflow: hidden;} .art_info_banner img {width: 100%;} .art_info {position: relative; padding: 0 95px; box-sizing: border-box; margin-bottom: -158px; top: -239px;} .art_info .art_box { border-radius: 22px; background-color: #fff; padding: 100px 140px;} .art_info .art_box .top { padding-bottom: 40px; margin-bottom: 40px; border-bottom: 1px solid #e6e6e6; } .art_info .art_box .top h3{font-size: 40px;color: #333333;font-weight: bold;margin-bottom: 20px;} .art_info .art_box .top h4 {display: flex;align-content: center;} .art_info .art_box .top h4 span {font-size: 16px;color: #666666;} .art_info .art_box .top h4 span:nth-of-type(1) {margin-right: 14px;} .art_info .art_box .content p {font-size: 18px;line-height: 30px;color: #666666;} .art_info .art_box .content p b {font-weight: bold;color: #333333;line-height: 45px;} .art_info .art_box .content p img { display: block; width: auto; max-width: 100%; height: auto;margin: auto; } .art_info .art_box .content p video { display: block; width: auto; max-width: 100%; height: auto;margin: auto; } .art_info .art_box ._nav {margin: 50px 0 40px;} .art_info .art_box ._nav a:nth-of-type(1) {border-top: 1px solid #d1d1d1;} .art_info .art_box ._nav a {padding: 20px 0;font-size: 20px;color: #333333;border-bottom: 1px solid #d1d1d1;display: block;} .art_info .art_box ._nav a:hover {color: var(--dex);} .art_info .art_box .more { width: 180px; height: 44px; line-height: 44px; } .art_info .share {position: absolute;right: 0px;top:300px;} .art_info .share a { font-size: 20px; margin-bottom: 9px; width: 48px;height: 48px;border-radius: 50%;display: flex;justify-content: center;align-items: center;color: #fff;} .art_info .share .fa-linkedin {background-color: #007bb6;} .art_info .share .fa-weibo {background-color: #f3260b;} .art_info .share .fa-twitter {background-color: #00aced;} .art_info .share .fa-facebook {background-color: #3b5998;} .art_info .share .fa-weixin {background-color: #4fb348;} .art_info .art_box .wp-video {margin: auto;width: fit-content!important;} .art_info .art_box .wp-video video {width: auto!important; height: auto!important; max-width: 100%!important;} .art {position: relative;overflow: hidden;} .art dl {display: flex; flex-flow: wrap; margin-bottom: 80px;} .art dl dd {border-radius: 8px; width: 31%; margin-right: 3.5%; margin-bottom: 3.5%; overflow: hidden; position: relative;z-index: 10;} .art dl dd:nth-of-type(3n) {margin-right: 0px;} .art dl dd:hover .imgbox img{transform: scale(1.1);} .art dl dd .text { padding: 32px; box-sizing: border-box; border: 1px solid #e3e3e3; border-top: 0px; border-radius: 0 0 8px 8px;} .art dl dd .text h4 {font-size: 14px;color: #666666;margin-bottom: 8px;} .art dl dd .text h5 { font-size: 24px; color: #333333; line-height: 34px; margin-bottom: 35px; height: 68px;} .art dl dd .text .xiang {display: flex;align-items: center;} .art dl dd .text .xiang .cir {margin-right: 30px; width: 27px; height: 27px; border-radius: 50%; border: 2px solid var(--dex); position: relative;} .art dl dd .text .xiang .cir::after { transition: 0.3s; width: 30px; height: 2px; background-color: var(--dex); top: 50%; transform: translateY(-50%); position: absolute; content: ""; left: 12px;} .art dl dd .text .xiang span {font-size: 16px;color: var(--dex);} .art dl dd:hover .text h5 {color: var(--dex);} .art dl dd:hover .text .xiang .cir::after {left: 22px;} /* global */ .glo01 { padding: 0px 0 0px; background-size: cover;position: relative;} .glo01 .icenter1{ position: relative; display: flex; justify-content: space-between; align-items: center; padding: 50px 0px 160px; background-size: cover;} .glo01 .icenter1::after { position: absolute; content: ""; left: 0px; bottom: 10%; width: 100%; height: 60%; background: linear-gradient(to top , rgba(255,255, 255,1),rgba(255, 255, 255,0));} .glo01 .le {width: 30.4%;} .glo01 .le .swiper-slide {display: flex;align-items: center;} .glo01 .le .swiper {padding-top: 30px; margin-top: 30px; border-top: 1px solid #8e8e8e;} .glo01 .le dd {font-size: 20px; color: #666666; cursor: pointer;} .glo01 .le .swiper-slide-thumb-active dd {color: var(--dex);font-size: 26px;} .glo01 .ri {width:42.8%;} .glo01 .ri:hover .imgbox img{transform: scale(1.1);} .glo01 .ri .g {display: block;background-color: #fff;box-shadow: 0 0 10px #ddd;} .glo01 .ri .g .text {padding: 33px 40px;} .glo01 .ri .g .text h4 { font-size: 34px; color: #333333; margin-bottom: 8px;} .glo01 .ri .g .text h5 {font-size: 18px;color: #666666;} .glo01 .ri .g {display: none;} .glo01 .ri .swiper-slide-active .g {animation: fa forwards linear 0.5s;display: block;} .glo01 .ri .swiper {overflow: hidden;padding: 22px;} .glo01 .bg { position: absolute; left: 50%; top: 40%; transform: translate(-50%, -50%); z-index: -1; width: 100%; height: 600px; overflow: hidden; } .glo01 .bg img {width: 100%;height: auto;width: 100%;height: auto;filter: brightness(0.9);animation: ro1 90s infinite linear;padding: 30px;} @keyframes ro1 { to {transform: rotate(1000deg);} } @keyframes fa { 100%{ opacity: 1; } } .glo02 {padding-bottom: 145px;position: relative;overflow: hidden;} .glo02 .icenter1 {display: flex;justify-content: space-between;align-items: center;} .glo02 .icenter1 .imgbox {width: 58.3%;} .glo02 .icenter1 .imgbox img {width: 100%;left: 0px;} .glo02 .icenter1 .text {width: 32.8%;} .glo02 .icenter1 .text p {font-size: 18px;color: #666666;line-height: 30px;margin: 8px 0 55px;} .glo02 .icenter1 .text .after {} .glo02 .icenter1 .text .after .icon {display: flex;align-items: center;} .glo02 .icenter1 .text .after .icon img {width: 39px;margin-right: 10px; animation: bounce-up-data-v-7e3caf58 1.5s linear infinite;} .glo02 .icenter1 .text .after .icon span {font-size: 16px;color: #666666;} .glo02 .icenter1 .text .after h5 {font-family: arial; font-size: 38px; color: #00696c; font-weight: bold; margin-top: 10px; line-height: 60px;} .glo03 {padding-bottom: 150px;position: relative;overflow: hidden;} .glo03 .icenter1 {display: flex;justify-content: space-between;align-items: center;} .glo03 .icenter1 .le {width:23.5%;} .glo03 .icenter1 .le dl {margin-top: 52px;} .glo03 .icenter1 .le dl dd {display: flex;align-items: center;margin-bottom: 40px;} .glo03 .icenter1 .le dl dd:last-child {margin-bottom: 0px;} .glo03 .icenter1 .le dl dd .icon {border: 1px solid var(--dex); width: 100px;height: 100px;border-radius: 50%;display: flex;justify-content: center;align-items: center;} .glo03 .icenter1 .le dl dd .icon img {width: 50px;transition: 0.3s;} .glo03 .icenter1 .le dl dd:hover .icon img {transform: rotateY(180deg);} .glo03 .icenter1 .le dl dd .text {margin-left: 31px;} .glo03 .icenter1 .le dl dd .text h4 {font-size: 30px;font-weight: bold;color: #333333;margin-bottom: 13px;} .glo03 .icenter1 .le dl dd:hover .text h4 {color: var(--dex);} .glo03 .icenter1 .le dl dd .text h5 {font-size: 20px;color: #666666;} .glo03 .icenter1 .ri {width: 54.4%; position: relative;padding-top: 140px;} .glo03 .icenter1 .ri:hover .imgbox img{transform: scale(1.1);} .glo03 .icenter1 .ri .bg1 {position: absolute;right: 0px;top: 0px;z-index: 1; height: 140px;} .glo03 .icenter1 .ri .bg1 img {height: 140px;} .glo03 .icenter1 .ri .bg2 {position: absolute;left: 0px;top: 0px;} .glo03 .icenter1 .ri .bg2 img {height: 140px;} .glo03 .icenter1 .ri .bg3 {position: absolute;bottom: 0px;left: -140px;} .glo03 .icenter1 .ri .bg3 img {width: 140px; height: 100%; display: block;} .glo04 {padding: 130px 0;position: relative;overflow: hidden;background-color: #f5f5f5;} .glo04 .ab_h3 {text-align: center;} .glo04 dl {margin-top: 30px;display: flex;justify-content: space-between;} .glo04 dl dd {width: 32%;position: relative;} .glo04 dl dd:hover .imgbox img {transform: scale(1.1);} .glo04 dl dd .text {background-color: #fff;padding: 35px 40px 54px;} .glo04 dl dd .text h4 {font-size: 30px;color: #333333;margin-bottom: 18px;} .glo04 dl dd:hover .text h4 {color: var(--dex);} .glo04 dl dd .text h5 { height: 57px; font-size: 18px;color: #666666;position: relative;margin-bottom: 56px;} .glo04 dl dd .text h5::after { bottom: -56px; position: absolute; content: ""; width: 44px; height: 3px; background-color: var(--dex); left: 0px;} .glo04 dl dd .text .bg_i {position: absolute;right: 46px;bottom: 52px;} .glo04 dl dd .text .bg_i img {width: 70px;} @keyframes bounce-up-data-v-7e3caf58 { 10% { transform: rotate(20deg); } 20% { transform: rotate(-10deg); } 30% { transform: rotate(5deg); } 40% { transform: rotate(-5deg); } 50%, 100% { transform: rotate(0deg); } } /* pro */ .public-btn2:hover svg path { fill: #00959E; } .public-btn2 svg { transform: rotate(90deg); position: relative; z-index: 5; width: 35px; height: 35px;} .pro_nav {background-color: #f5f5f5;overflow: hidden;position: relative;} .pro_nav a {z-index: 1;} .pro {padding-bottom: 40px;background-color: #f5f5f5;} .pro .seg {margin-bottom: 120px;position: relative;overflow: hidden;} .pro .seg dl {margin-top: 40px;display: flex;flex-flow: wrap;} .pro .seg dl dd { background-color: #fff; width: 31.5%; margin-right: 2.7%; margin-bottom: 2.7%;} .pro .seg dl dd .imgbox img {width: 84%; left: 0px; padding-top: 60px; margin: auto;} .pro .seg dl dd:nth-of-type(3n) {margin-right: 0px;} .pro .seg dl dd:hover .imgbox img {transform: scale(1.1);} .pro .seg dl dd .text { padding: 20px 48px 47px;} .pro .seg dl dd .text h4 { font-size: 32px; color: #333333; text-align: center; word-break: break-all;} .pro .seg dl dd .text h5 {font-size: 16px;color: #999999;text-align: center;} .pro .seg dl dd:hover .text h4 {color: var(--dex);} /* proinfo */ .pro_info_banner { position: relative; overflow: hidden;} .pro_info_banner::after { content: ""; display: inline-block; width: 80%; height: 100%; background: linear-gradient(to left,rgba(0,0,0,0.8),rgba(0,0,0,0)); position: absolute; right: 0; bottom: 0; opacity: 1; top: auto; } .pro_info_banner img {width: 100%; object-fit: cover; height: 100%; display: block; } .pro_info_banner .text .t h4 { font-size: 16px; margin-bottom: 14px; } .pro_info_banner .text .t h3 { font-size: 66px; line-height: 50px; } .pro_info_banner .text .t { margin-bottom: 38px; padding-left: 24px; } .pro_info_banner .text .t::before { width: 3px;} .pro_info_banner .text p { font-size: 15px; line-height: 22px; margin-bottom: 52px; } .pro_info_banner .text { z-index: 2; padding-right: 7%; position: absolute; left: 50%; top: 54%; transform: translate(-50%,-50%); display: flex; justify-content: flex-end;} .pro_info_banner .text .t {margin-bottom: 46px; position: relative;padding-left: 30px;} .pro_info_banner .text .t::before {position: absolute;content: ""; top: 0px;left: 0px; width: 5px;height: 100%;background-color: var(--dex);} .pro_info_banner .text .t h4 {color: #fff; font-size: 24px;color: #fff;margin-bottom: 20px;} .pro_info_banner .text .t h3 { color: #fff; font-size: 70px; font-family: arial; font-weight: bold; line-height: 71px;} .pro_info_banner .text p {color: #fff; font-size: 20px;line-height: 30px;margin-bottom: 66px;} .pro_info_banner .text video {opacity: 0;position: absolute; display: none;} .pro_info_banner .text a {background-color: var(--dex);color: #fff;border-color: var(--dex);display: none;} .pro_info_banner .text a:hover {background-color: transparent;color: var(--dex);} .proinfo01 {padding: 160px 0 130px;position: relative;overflow: hidden;} .proinfo01 .icenter1 {display: flex;justify-content: space-between;align-items: center;} .proinfo01 .icenter1 .ab_h3 {line-height: 60px;} .proinfo01 .icenter1 .le {width: 44%;} .proinfo01 .icenter1 .le p {font-size: 22px;line-height: 34px;color: #666666;margin-top: 44px;} .proinfo01 .icenter1 .ri { box-sizing: border-box; position: relative; width: 45.3%;padding: 0 58px;} .proinfo01 .icenter1 .ri .imgbox img {width: 100%; object-fit: cover; transition: 0.3s; display: block; position: relative; left: 0%;} .proinfo01 .icenter1 .ri .swiper {overflow: hidden;} .proinfo01 .icenter1 .ri .fa { font-size: 30px; background-image: none; width: 40px; height: 87px; background-color: #cccccc; color: #fff; display: flex; justify-content: center; align-items: center;top: 50%;} .proinfo01 .icenter1 .ri .fa:hover {background-color: var(--dex);border-color: var(--dex);color: #fff;} .proinfo01 .icenter1 .ri .fa-angle-left {left: 0px;} .proinfo01 .icenter1 .ri .fa-angle-right {right: 0px;} /* proinfo_add */ .proinfo_add {padding: 0px 0 100px ;position: relative;overflow: hidden;} .proinfo_add dl { flex-flow: wrap; margin-top: 50px;display: flex;} .proinfo_add dl dd { margin-right: 2.54%; width: 6%; margin-bottom: 3%;} .proinfo_add dl dd:nth-of-type(12) {margin-right: 0px;} .proinfo_add dl dd .icon { z-index: 1;overflow: hidden; border-radius: 8px; border:2px solid rgb(34, 164, 171); width: 80px;height: 80px;display: flex;justify-content: center;align-items: center;} .proinfo_add dl dd .icon img {transition: 0.3s; width: 46px;} .proinfo_add dl dd span {color: #333; text-align: center; margin: auto; display: block; margin-top: 8px;} .proinfo_add dl dd:hover span{color: var(--dex);} .proinfo_add dl dd:hover .icon img {transform: rotateY(180deg);} .proinfo02 {background-color: #212121; padding: 246px 0 60px;position: relative;margin-top: 283px;} .proinfo02 .ab_h3 {color: #fff;} .proinfo02 .icenter1 {position: unset;} .proinfo02 .top_bg { position: absolute; top: -283px; display: flex; justify-content: space-between; width: 1400px;} .proinfo02 .top_bg .imgbox {width: 100%;} .proinfo02 .top_bg .imgbox img { width: 100%;left: 0px; height: auto; object-fit: cover;} .proinfo02 .bot {margin-top: 100px;} .proinfo02 .bot dl {flex-flow: wrap; margin-top: 34px;display: flex;} .proinfo02 .bot dl dd {width: 30%; margin-right: 5%; margin-bottom: 60px;} .proinfo02 .bot dl dd:nth-of-type(3n) {margin-right: 0px;} .proinfo02 .bot dl dd .icon {margin-bottom: 31px; width: 87px;height: 87px;border-radius: 5px;border: 2px solid #00959E;display: flex;justify-content: center;align-items: center;} .proinfo02 .bot dl dd .icon img {width: 50px;transition: 0.3s;} .proinfo02 .bot dl dd:hover .icon img {transform: rotateY(180deg);} .proinfo02 .bot dl dd h4 {font-size: 40px;color: #fff;font-weight: bold;margin-bottom: 16px;} .proinfo02 .bot dl dd:hover h4 {color: #00959E;} .proinfo02 .bot dl dd p {font-size: 18px;color: rgba(255,255,255,1);line-height: 34px;} .proinfo03 {margin: 150px 0 150px;position: relative;} .proinfo03 .table {margin-top: 32px;} .proinfo03 .table img {width: 100%;height: auto;display: block;} .proinfo04 { margin-top: 150px; margin-bottom: 210px; position: relative;} .proinfo04 .le {width: 46%;} .proinfo04 .le img {width: 100%;object-fit: cover;display: block;} .proinfo04 .icenter1 { display: flex;justify-content: flex-end; position: absolute;top: 50%;transform: translate(-50%,-50%);left: 50%;} .proinfo04 .icenter1 .bot {overflow: hidden; padding-bottom: 116px; position: relative;margin-top: 32px;} .proinfo04 .icenter1 .bot .imgbox img {width: 100%;left: 0px;} .proinfo04 .icenter1 .bot .imgbox {background-color: rgba(245, 245, 245,1);padding: 36px 0px;} .proinfo04 .icenter1 .textf {width: 43%;} .proinfo04 .icenter1 .box:hover .imgbox img {transform: scale(1.1);} .proinfo04 .icenter1 .box .text { font-size: 18px; color: #333333; line-height: 30px; font-weight: bold; margin-top: 10px;} .proinfo04 .icenter1 .box:hover .text {color: var(--dex);} .proinfo04 .icenter1 .bot .fa { font-size: 30px; background-image: none; width: 48px; height: 48px; border: 1px solid #727272; border-radius: 50%; color: #727272; display: flex; justify-content: center; align-items: center; top: auto; bottom: 0px;} .proinfo04 .icenter1 .bot .fa:hover {background-color: var(--dex);border-color: var(--dex);color: #fff;} .proinfo04 .icenter1 .bot .fa-angle-left {left: 0px;} .proinfo04 .icenter1 .bot .fa-angle-right {right: auto;left: 69px;} .proinfo05 {background: url(/style/images/proinfo05_bg.jpg);background-size: cover;position: relative;overflow: hidden;padding: 120px 0;} .proinfo05 .ab_h3 {text-align: center;} .proinfo05 .swiper {overflow: hidden;} .proinfo05 .bot {position: relative;margin-top: 40px;} .proinfo05 .bot .fa { top: 47%; background-image: none;width: auto;height: auto;color: #9fa5aa;font-size: 60px;} .proinfo05 .bot .fa:hover {color:var(--dex)} .proinfo05 .bot .fa-angle-left {left: -80px;} .proinfo05 .bot .fa-angle-right {right: -80px;} .proinfo05 .bot .box { background-color: #fff; width: 31.5%; margin-right: 2.7%; margin-bottom: 2.7%;} .proinfo05 .bot .box .imgbox {background-color: #fff;} .proinfo05 .bot .box .imgbox img {width: 80%; margin: auto; left: 0px;background-color: #fff;padding-top: 70px;} .proinfo05 .bot .box:hover .imgbox img {transform: scale(1.1);} .proinfo05 .bot .box .text {padding: 20px 15px 39px; background-color: #fff;} .proinfo05 .bot .box .text h4 {font-size: 34px;color: #333333;text-align: center; word-break: break-all;} .proinfo05 .bot .box .text h5 {font-size: 16px; color: #999999; text-align: center; height: 42px; margin-top: 8px;} .proinfo05 .bot .box:hover .text h4 {color: var(--dex);} .proinfo06 {padding: 140px 0 180px;position: relative;overflow: hidden; } .proinfo06 .icenter1 {display: flex;flex-direction: column;justify-content: center;align-items: center;} .proinfo06 .icenter1 p {font-size: 20px; color: #666666; margin: 16px 0 38px;} .proinfo06 .icenter1 .fen {display: flex;align-items: center;margin-bottom: 40px;} .proinfo06 .icenter1 .fen a:nth-of-type(1) {background-color: var(--dex);color: #fff;margin-right: 10px;} .proinfo06 .icenter1 .fen a:nth-of-type(1):hover {background-color: #fff;color: var(--dex);} .proinfo06 .icenter1 .fen a { width: 207px; height: 42px; line-height: 42px;} .proinfo06 .icenter1 .share {display: flex;align-items: center;} .proinfo06 .icenter1 .share span {font-size: 20px;color: #666666;margin-right: 16px;} .proinfo06 .icenter1 .share .cc {display: flex;} .proinfo06 .icenter1 .share .cc a {background-color: #b0b0b0; margin-right: 10px; width: 40px;height: 40px;border-radius: 50%;display: flex;justify-content: center;align-items: center;font-size: 18px;color: #fff;} .proinfo06 .icenter1 .share .cc a:last-child {margin-right: 0px;} .proinfo06 .icenter1 .share .cc a:hover {background-color: var(--dex);} .pc-1260 {display: none;} @media only screen and (max-width:1260px ) { .pc-1260{ display: block;position: fixed;width: 100%;height: 100%;background: #333;top: 0;left: 0;z-index: 999999999999999999;} .pc-1260 p{ transform: translateY(-50%);-webkit-transform: translateY(-50%);position: absolute;color: #fff;top: 50%;left: 0;width: 100%;text-align: center;font-size: 14px;letter-spacing: 2px;} } /* proinfo2_1 */ .proinfo2_1{background-color: rgba(33, 33, 33,1);position: relative;overflow: hidden;padding: 130px 0 80px;} .proinfo2_1 h3 {color: #fff; line-height: 66px; width: 87%;} .proinfo2_1 dl {display: flex;flex-flow: wrap; margin-top: 86px;} .proinfo2_1 dl dd {width: 30%; margin-right: 5%; margin-bottom: 60px;} .proinfo2_1 dl dd:nth-of-type(3n) {margin-right: 0px;} .proinfo2_1 dl dd .icon {margin-bottom: 24px; width: 80px; height: 80px;border-radius: 5px;border: 2px solid #00959E;display: flex;justify-content: center;align-items: center;} .proinfo2_1 dl dd .icon img {width: 50px;transition: 0.3s;} .proinfo2_1 dl dd:hover .icon img {transform: rotateY(180deg);} .proinfo2_1 dl dd h4{font-size: 18px;color: #fff;} .proinfo2_2 { padding: 124px 0 0; position: relative; overflow: hidden;;} .proinfo2_2 .icenter1 {display: flex;justify-content: space-between;align-items: center;} .proinfo2_2 .imgbox {width: 38%;} .proinfo2_2 .text {width: 45%;padding-right: 3%;box-sizing: border-box;} .proinfo2_2 .text p {font-size: 18px;line-height: 30px;margin-top:38px;color: #666;} @media only screen and (max-width:1600px ) { .waves{height: 60px;} .icenter{ width:1200px; } .footer{padding:60px 0;} .ftbottom{padding: 30px 0;} .footer .f-title dl h5 span,.footer .f-title dl h4{ margin-bottom: 20px;} .footer .f-title dl dt p span .ewmimg { display: block; margin-top: 8px; height: 90px; } .indexnews .tt strong,.inabout .tt font,.prott h3,.index06 .title .com_h3{font-size: 34px;} .footer .f-title dl dt .c1,.prott h5,.toppro a dd font,.index06 .num h5{font-size:20px;} .footer .f-title dl h4 a,.indexnews .newslist .left a dd span,.inabout .nums dl dd font,.procc dl a dd font,.banner .swiper-slide .inbannertxt h5,.index06 .num span{font-size:18px;} .footer .f-title dl dt p .c2,.indexnews .newslist .right a dd span,.inabout .nums dl dt p,.inabout .tt span,.ftbottom h4,.footer .f-title dl h5 span a,.footer .f-title dl dt p,.footer .f-title dl dt p span,.indexnews .tt span,.procc dl a dd strong,.pch .right dt strong,.prott h4,.toppro a dd strong,.index06 .title h4{ font-size:16px; } .indexnews .newslist .right a dd font{font-size:12px;} .footer .f-title dl dt .ewm .img .ewmimg{ top: 30px; height:80px;} .more,.prott dd a{width: 100px;height: 30px;line-height: 30px;font-size: 14px;} .indexnews .newslist .left a dd strong,.indexnews .newslist .left a dd font,.indexnews .newslist .right a dd font,.indexnews .newslist .right a dd strong{ zoom: 0.8;} .indexnews .newslist .right a dd span,.inabout .nums dl dt p{ line-height: 20px;} .indexnews .newslist .left a dd span{ line-height: 24px; margin-bottom: 20px;} .indexnews .tt font,.inabout .tt strong,.prott font,.procc dl a dd span,.toppro a dd span,.toppro a dd span,.index06 .title h5{height:2px; margin: 10px 0;} .inabout .nums dl dd span{ font-size: 160px;} .index06 .num h4 strong{font-size: 120px; line-height: 126px;} .pch .logo,.pch .pcnav dd h3{ height:66px;} .pch .pcnav dd h3 a{line-height: 66px; font-size: 16px;} .pch .right { height: 60px;} .pch .logo img{ height: 37px;} .pch .menu_hover {top: 60px;} .pch .icenter .right .tools a { font-size: 16px; } .pch .right .fa-search { margin-right: 14px; } .pch .tools .lang img { width: 18px; margin-right: 6px; } .pch .icenter .right .tools .lang { font-size: 14px; } .accordion-body ul li { line-height: 38px; } .accordion-body ul li a {font-size: 14px;} .banner .swiper-slide .inbannertxt dd{margin: 0 0 0px 0;} .banner .swiper-slide .inbannertxt h3{ line-height: 52px; font-size: 50px;} .banner .barn{ bottom: 30px;} .toppro a dd{ padding: 40px 20px 0;} .procc dl a dd{padding: 20px;} .inabout .more,.indexnews .more,.inpro .more,.inabout .tt dl{ margin-top: 30px;} .prott{ margin-bottom: 30px; } .inpro{ padding: 100px 0;} .inabout{padding: 100px 0 50px;} .indexnews{ padding: 50px 0 100px;} .procc dl a p,.inabout .nums dl{ padding: 20px 0;} .inabout .nums dl dt strong{margin: 10px auto;} .index06 .map { height: 455px;} .index06 .map .hide1 {width: 109px; height: 104px; right: 10%; bottom: 11%; } .index06 .map .hide6 { width: 261px; height: 237px; top: 1%; left: 4%;} .index06 .map .hide9 {width: 164px; height: 112px; top: -12%; left: 26%;} .index06 .map .hide7 { width: 137px; height: 196px; left: 24%; top: 53%;} .index06 .map .hide5 { height: 212px; width: 189px; top: 40%; left: 42%; } .index06 .map .hide5 { height: 175px; width: 189px; top: 41%; left: 44%;} .index06 .map .hide4 { width: 172px; height: 136px; top: 11%; left: 47%;} .index06 .map .hide8 { width: 55px; height: 111px; top: 24%; left: 61.5%; } .index06 .map .hide3 { width: 330px; height: 86px; top: 4%; left: 61%; } .index06 .map .hide2 { width: 171px; height: 131px; top: 25%; left: 68%; } .mapicon img {width: 12px; height: auto; } .mapicon .map_cc { width: 18px; } .mapicon .detail .text h4 { font-size: 16px; margin-bottom: 8px; } .mapicon .detail .text p { font-size: 14px; line-height: 24px; } .index06 .map .mapicon30 { top: 31%; left: 18%; } .index06 .map .mapicon28 { top: 38%; left: 21%; } .index06 .map .mapicon27 { top: 25%; left: 22%; } .index06 .map .mapicon26 { top: 24%; left: 25%; } .index06 .map .mapicon29 { top: 15%; left: 18%; } .index06 .map .mapicon17 { top: 42%; left: 52%; } .index06 .map .mapicon24 { top: 1%; left: 35%; } .index06 .map .mapicon23 { top: 9%; left: 34%; } .index06 .map .mapicon17 { top: 25%; left: 50%; } .index06 .map .mapicon18 { top: 41%; left: 52%; } .index06 .map .mapicon19 { top: 46%; left: 54%; } .index06 .map .mapicon25 { top: 7%; left: 25%; } .index06 .map .mapicon24 { top: 0%; left: 34%; } .index06 .map .mapicon22 { top: 20%; left: 65%; } .index06 .map .mapicon15 { top: 75%; left: 81%; } .index06 .map .mapicon08 { top: 36%; left: 70%; } .index06 .map .mapicon09 { top: 33%; left: 74%; } .index06 .map .mapicon10 { top: 40%; left: 75%; } .index06 .map .mapicon11 { top: 42.5%; left: 76.5%; } .mapicon02 { top: 34%; left: 79%; z-index: 15; } .mapicon01 { top: 38%; left: 79%; } .mapicon04 { top: 30%; left: 80%; } .index06 .map .mapicon14 { top: 76%; left: 86%; } .index06 .num { position: absolute; bottom: 20px; left: 0px; } /* pro */ .icenter1 {width: 1100px;} .single_banner .text .le h4 { font-size: 17px; margin-bottom: 6px; } .single_banner .text .le h5 { font-size: 50px; } .single_banner .text .ri { width: 85px; height: 85px; } .public-btn2 svg { width: 25px; height: 25px; } .single_banner .text .ri img { width: 34px; } .news_nav a { margin: 0 27px; font-size: 18px;} .news_nav { padding: 55px 0 70px; } .ab_h3 { font-size: 36px; line-height: 40px; } .pro .seg dl { margin-top: 30px; } .pro .seg dl dd .text h4 { font-size: 24px; } .pro .seg dl dd .text h5 { font-size: 13px; } .pro .seg { margin-bottom: 90px; } .pro { padding-bottom: 10px; } .pro .seg dl dd .text { padding: 16px 15px 42px; } .pro .seg dl dd .imgbox img { padding-top: 48px; } /* proinfo */ .pro_info_banner .text .t h4 { font-size: 16px; margin-bottom: 16px; } .pro_info_banner .text .t h3 { font-size: 52px; line-height: 51px; } .pro_info_banner .text .t { margin-bottom: 38px; padding-left: 26px; } .pro_info_banner .text p { font-size: 16px; line-height: 24px; margin-bottom: 50px; } .proinfo01 { padding: 130px 0 100px; } .proinfo01 .icenter1 .ab_h3 { line-height: 44px; } .proinfo01 .icenter1 .le p { font-size: 18px; line-height: 28px; margin-top: 34px; } .proinfo01 .icenter1 .ri .fa { font-size: 28px; width: 32px; height: 74px;} .proinfo01 .icenter1 .ri { padding: 0 50px; } .proinfo02 .top_bg { top: -214px; width: 1100px; } .proinfo02 { padding: 215px 0 50px; margin-top: 214px; } .proinfo02 .bot { margin-top: 70px; } .proinfo02 .bot dl dd .icon { margin-bottom: 26px; width: 68px; height: 68px; border-radius: 4px;} .proinfo02 .bot dl dd .icon img { width: 34px;} .proinfo02 .bot dl dd h4 { font-size: 28px; margin-bottom: 12px; } .proinfo02 .bot dl dd p { font-size: 15px; line-height: 28px; } .proinfo02 .bot dl dd { margin-bottom: 52px; } .proinfo03 { margin: 100px 0 100px; } .proinfo03 .table { margin-top: 26px; } .proinfo04 .icenter1 .box .text { font-size: 15px; line-height: 23px; margin-top: 10px; } .proinfo04 .icenter1 .bot { padding-bottom: 100px; margin-top: 28px; } .proinfo04 .icenter1 .bot .fa { font-size: 26px; width: 36px; height: 36px;} .proinfo04 .icenter1 .bot .fa-angle-right { left: 51px; } .proinfo04 { margin-bottom: 160px;margin-top: 100px; } .proinfo05 { padding: 100px 0; } .proinfo05 .bot { margin-top: 30px; } .proinfo05 .bot .box .text h4 { font-size: 24px;} .proinfo05 .bot .box .text h5 { font-size: 13px; height: 35px; } .proinfo05 .bot .box .text { padding: 16px 15px 24px; } .proinfo05 .bot .fa { top: 47%; font-size: 60px; } .proinfo05 .bot .fa-angle-left { left: -60px; } .proinfo05 .bot .fa-angle-right { right: -60px; } .proinfo05 .bot .box .imgbox img { padding-top: 60px; } .proinfo06 { padding: 100px 0 130px; } .proinfo06 .icenter1 p { font-size: 17px; margin: 12px 0 29px; } .proinfo06 .icenter1 .fen a { width: 178px; height: 38px; line-height: 38px; } .proinfo06 .icenter1 .share span { font-size: 16px; margin-right: 13px; } .proinfo06 .icenter1 .share .cc a { margin-right: 8px; width: 34px; height: 34px; border-radius: 50%; font-size: 15px; } /* proinfo_add */ .proinfo_add dl dd .icon { width: 72px; height: 72px;} .proinfo_add dl dd .icon img { width: 38px; } .proinfo_add dl dd span { font-size: 14px; } .proinfo_add dl dd { margin-right: 1.45%; width: 7%; margin-bottom: 3%;} .proinfo_add { padding: 0px 0 70px; } /* .proinfo2_1 */ .proinfo2_1 h3 { line-height: 52px; } .proinfo2_1 { padding: 100px 0 60px; } .proinfo2_1 dl { margin-top: 65px; } .proinfo2_1 dl dd .icon { margin-bottom: 18px; width: 72px; height: 72px;} .proinfo2_1 dl dd .icon img { width: 42px; } .proinfo2_1 dl dd h4 { font-size: 16px; } .proinfo2_1 dl dd { margin-bottom: 52px; } .proinfo2_2 { padding: 100px 0 0; } .proinfo2_2 .text p { font-size: 16px; line-height: 25px; margin-top: 32px; } /* global */ .glo01 .le dl dd { font-size: 18px; margin-bottom: 26px; } .glo01 .le dl { padding-top: 22px; margin-top: 22px; } .glo01 .le dl dd.active { font-size: 23px; } .glo01 .ri .g .text h4 { font-size: 26px; margin-bottom: 6px; } .glo01 .ri .g .text h5 { font-size: 14px; } .glo01 .ri .g .text { padding: 28px 34px; } .glo01 .icenter1 { padding: 0px 0px 125px; } .glo01 .bg { height: 400px; } .glo01 .icenter1::after { bottom: 13%; } .glo01 .bg { top: 48%;} .glo02 .icenter1 .text p { font-size: 15px; line-height: 26px; margin: 8px 0 42px; } .glo02 .icenter1 .text .after .icon img { width: 28px; margin-right: 8px;} .glo02 .icenter1 .text .after .icon span { font-size: 14px; } .glo02 .icenter1 .text .after h5 { font-size: 30px; margin-top: 8px; } .glo02 { padding-bottom: 120px; } .glo03 .icenter1 .le dl dd { margin-bottom: 32px; } .glo03 .icenter1 .le dl dd .text h4 { font-size: 22px; margin-bottom: 8px; } .glo03 .icenter1 .le dl dd .text h5 { font-size: 15px; } .glo03 .icenter1 .le dl dd .icon { width: 80px; height: 80px;} .glo03 .icenter1 .le dl dd .icon img { width: 36px; } .glo03 .icenter1 .le dl dd .text { margin-left: 26px; } .glo03 .icenter1 .ri { padding-top: 110px; } .glo03 .icenter1 .ri .bg1 { height: 110px; } .glo03 .icenter1 .ri .bg1 img { height: 110px; } .glo03 .icenter1 .ri .bg3 { left: -110px; } .glo03 .icenter1 .ri .bg3 img { width: 110px; } .glo03 .icenter1 .ri .bg2 img { height: 110px; } .glo03 { padding-bottom: 120px; } .glo04 { padding: 110px 0; } .glo04 dl dd .text { padding: 32px 32px 46px; } .glo04 dl dd .text h4 { font-size: 22px; margin-bottom: 10px; } .glo04 dl dd .text h5 { height: 43px; font-size: 15px; margin-bottom: 42px; } .glo04 dl dd .text h5::after { bottom: -42px; width: 34px;} .glo04 dl dd .text .bg_i img { width: 42px; } .glo04 dl dd .text .bg_i { right: 33px; bottom: 42px; } /* download */ .dow { padding: 30px 0 150px; } .dow dd a .ri h4 { font-size: 24px; margin-bottom: 8px; } .dow dd a .ri h5 { font-size: 15px; margin-bottom: 42px; } /* contact */ .contact .icenter1 { padding: 0 124px; } .contact { padding: 30px 0 150px; } .con01 .bot .le h4 { font-size: 32px; margin-bottom: 7px; } .con01 .bot .le h5 { font-size: 16px; padding-bottom: 25px; margin-bottom: 25px; } .con01 .bot .le h6 { font-size: 30px; margin-bottom: 18px; } .con01 .bot .le p { font-size: 14px; line-height: 35px; } .con01 .bot .ri .text h4 { font-size: 16px; margin-bottom: 6px; line-height: 22px} .con01 .bot .ri .text a { font-size: 13px; } .con01 .bot .ri .text { padding: 26px 27px; } .con01 { padding-bottom: 115px; } .con02 form .sp .cc input { height: 52px;} .con02 form .sp .cc input::-webkit-input-placeholder,.con02 form .sp .cc textarea::-webkit-input-placeholder { font-size: 12px;} .con02 form .sp .cc label { font-size: 14px; margin-bottom: 10px; } .con02 form .sp { margin-bottom: 26px;} .con02 form button { margin-top: 52px;} .con_map { margin: 95px 0; } .con_map .c i { width: 40px; height: 40px;} .con_map .c { width: 178px; top: 39%; } .con_map .c .more { width: 100%; box-sizing: border-box; height: 34px; line-height: 30px; } .con01 .bot .ri .text { padding: 12px; } .con01 .bot .ri { padding: 44px; } /* art */ .art dl dd .text h5 { font-size: 20px; line-height: 29px; margin-bottom: 26px; height: 59px; } .art dl dd .text h4 { font-size: 12px; margin-bottom: 5px; } .art dl dd .text .xiang span { font-size: 14px; } .art dl dd .text .xiang .cir { margin-right: 32px; width: 24px; height: 24px;} .art dl dd .text .xiang .cir::after { width: 26px;} .art dl { margin-bottom: 60px; } .page { margin-bottom: 150px; } /* artinfo */ .art_info .art_box { border-radius: 18px; padding: 85px 100px; } .art_info .art_box .top h3 { font-size: 32px; margin-bottom: 12px; } .art_info .art_box .top h4 span { font-size: 14px; } .art_info .art_box .top { padding-bottom: 34px; margin-bottom: 34px;} .art_info .art_box .content p { font-size: 16px; line-height: 28px; } .art_info .art_box ._nav { margin: 40px 0 36px; } .art_info .art_box ._nav a { padding: 16px 0; font-size: 17px; } .art_info .art_box .more { width: 146px; height: 38px; line-height: 38px; } .art_info .share a { font-size: 18px; margin-bottom: 8px; width: 40px; height: 40px;} /* about */ .ab01 { padding: 30px 0 100px; } .ab01 .top .le .box p { font-size: 15px; line-height: 28px; } .ab01 .top .le .box h3 { margin-bottom: 34px; } .ab01 .top .le { padding-bottom: 50px; } .ab01 .top .le .swiper-pagination span { width: 32px; height: 2px; margin: 0 6px;} .ab01 .top .le .swiper-pagination .swiper-pagination-bullet-active { width: 62px; } .ab01 .top .ri .bo img { width: 62px; } .ab01 .top .ri video { height: 374px;} .ab01 dl dd .icon img { width: 36px; } .ab01 dl dd h4 strong { line-height: 65px; font-size: 60px; } .ab01 dl dd { width: 237px; } .ab01 dl { margin-top: 80px;} .ab02f { padding: 258px 0 110px; } .ab02 { margin-top: 222px; } .ab02 .bg { top: -220px; } .ab02 .top .box h4 { font-size: 40px; margin-bottom: 10px; } .ab02 .top .box p { font-size: 16px; line-height: 24px; margin-bottom: 32px; } .ab02 .bot .dot .text { font-size: 14px; top: 36px;} .ab02 .bot .fa-angle-left { left: -65px; } .ab02 .bot .fa-angle-right { right: -65px; } .ab02 .bot .fa { width: 34px; height: 56px; font-size: 24px;} .ab02 .bot .swiper { padding: 25px 28px; } .ab02 .bot { padding: 0 18px; margin-top: 40px; } .ab03 { padding: 100px 0; } .ab03 .ab_h3 { margin-bottom: 26px; } .ab03 dl { height: 459px; } .ab03 dl dd .text h4 { font-size: 22px; margin-bottom: 6px; } .ab03 dl dd .text p { font-size: 15px; line-height: 24px; } .ab03 dl dd:nth-of-type(1) .bg { left: -284px; width: 528px; } .ab03 dl dd .text { padding: 25px 31px; } .ab04 { padding: 105px 0 150px; } .ab04 p { font-size: 15px; line-height: 26px; margin: 15px 0 32px; } .ab04 .bg { position: absolute; left: 0px; width: 271px; left: -136px; top: -6px; opacity: 0.5; } .ab04 dl dd span { font-size: 15px; margin-top: 12px; } .ab04 h6 { margin: 34px auto 0px; font-size: 16px; } /* news */ .innerbanner .inbannertxt dd h6 { font-size: 38px; line-height: 40px;} .banner .swiper-slide .inbannertxt dd { margin: 0 0 25px 0; } .banner .swiper-slide .inbannertxt dd:nth-of-type(2) { margin-bottom: 34px; } .banner .barn .swiper-pagination span { width: 45px;} .banner .barn .swiper-pagination .swiper-pagination-bullet-active { width: 110px; } .innerbanner .barn { padding-right: 24px; width: 1100px;} .news_show a { padding: 36px 0; } .news_show a .text h4 { font-size: 27px; margin-bottom: 14px; } .news_show a .text p { font-size: 15px; line-height: 24px; margin-bottom: 41px; } .news_show a .text .date { font-size: 14px; margin-bottom: 3px; } .page span { border-radius: 50%; width: 40px; height: 40px; font-size: 18px; margin-right: 15px; } /* join */ .jn01 { padding: 30px 0 100px;} .jn01 .ab_h3 { margin-bottom: 28px; } .jn01 dl dd img { margin-bottom: 18px; height: 42px;} .jn01 dl dd h4 { font-size: 28px; padding-bottom: 12px; margin-bottom: 14px; width: 65%; } .jn01 dl dd p { font-size: 14px; line-height: 24px; height: 69px; } .jn01 dl dd { padding: 63px 46px; border-radius: 5px; } .jn02 .top .ri p { font-size: 24px; line-height: 33px; margin-bottom: 70px;} .jn02 .top .le .imgbox img { height: 320px; } .jn02 .top .le { padding-top: 90px; } .jn02 .top .le .bg1 { height: 90px; } .jn02 .top .le .bg3 { height: 90px;} .jn02 .top .le .bg2 { width: 90px; right: -90px; } .jn02 .top .ri a { padding-top: 15px; font-size: 17px; } .jn02 .top .ri a::before { width: 49px;} .jn02 dl { margin-top: 60px; } .jn02 { padding-bottom: 120px; } .jn02 dl dd .icon img { width: 65px; } .jn02 dl dd .text h4 strong { font-size: 52px; } .jn02 dl dd .text h4 span { font-size: 26px; line-height: 46px; } .jn02 dl dd .text h5 { font-size: 14px; } .jn03 .ab_h3 { margin-bottom: 32px; } .jn03 .bot .seg .text h4 { font-size: 28px; } .jn03 .bot .seg .text p { font-size: 15px; margin-top: 10px; line-height: 25px; } .jn03 .bot .seg .imgbox img {height: 380px;} .jn03 .bot .seg .text { width: 41%; padding: 56px 5%;} .jn03 .bot .seg:nth-of-type(1) { margin-bottom: 65px; } .jn03 { padding-bottom: 120px; } .jn04 .top h3 { font-size: 32px; margin-bottom: 12px; } .jn04 .bot { width: calc(100% - (100% - 1100px)/2 ); position: relative; left: calc((100% - 1100px)/2); } .jn04 .bot .b_so { width: 1100px; margin-top: 26px; } .jn04 .bot .b_so .swiper-pagination { width: 87%; height: 4px; border-radius: 4px; } .jn04 .bot .b_so .fa { width: 47px; height: 47px; font-size: 30px;} .jn04 { padding-bottom: 110px; } .jn04 .top h4 {color: #666;font-size: 14px;} .jn05 .top dd img { height: 55px; margin-bottom: 20px; } .jn05 .top dd h4 { font-size: 30px; margin-bottom: 12px; } .jn05 .top dd p { font-size: 14px; line-height: 24px; } .jn05 .top dd { padding: 59px 5%;} .jn05 .top { margin-bottom: 110px;} .jn05 .mid .text h4 { font-size: 30px; padding-bottom: 16px; margin-bottom: 16px;} .jn05 .mid .text p { font-size: 14px; line-height: 26px; } .jn05 .mid .text { width: 45%; padding: 60px 5%; } .jn05 .mid { margin-bottom: 110px; } .jn05 .mid .imgbox img {height: 410px;} .jn05 { padding-bottom: 150px; } .jn05 .bot p { margin: 20px auto 36px; font-size: 16px; line-height: 26px; } .jn05 .bot .jia .box { width: 150px; height: 150px;} .jn05 .bot .jia .box h4 { font-size: 15px; } .jn05 .bot .jia .box::after { width: 118px; height: 118px; right: -86px; top: 20px; } .jn05 .bot .jia .box::before { width: 118px; height: 118px;} .jn05 .bot .jia .box:hover::before { left: 118px; } .jn05 .bot .jia .box:hover::after{ right: 118px;} /* join-list */ .jl { padding: 110px 0 150px; } .jl dd .top h4 { font-size: 26px; margin-bottom: 8px; } .jl dd .top .tip h5 span { font-size: 15px; } .jl dd .top .tip h5 { margin-right: 24px; } .jl dd .bot .cc h4 { font-size: 17px; margin-bottom: 12px; } .jl dd .bot .cc p { font-size: 14px; line-height: 32px; } .jl dd .bot .you { font-size: 15px; } .jl dd .bot span { font-size: 15px; } /* social */ .social { padding: 30px 0 40px; } .social .seg .top .le { font-size: 38px; line-height: 50px; } .social .seg .top .le::after { width: 42px;} .social .seg .top .ri p { font-size: 14px; line-height: 26px; } .social .seg .top .ri .cc h4 { font-size: 20px; margin-bottom: 5px; } .social .seg .top .ri .cc { margin-top: 36px; } .social .seg .top { margin-bottom: 92px;} .social .seg .top .bg img{width: 100%;} .social .seg .top .bg { left: -157px; width: 307px; } .social .seg .bot h3 { font-size: 28px; margin-bottom: 24px; } .social .seg .bot .swiper .box span { font-size: 15px; margin-top: 12px; } .social .seg .bot .b_so .swiper-pagination { height: 4px; border-radius: 4px; } .social .seg .bot .b_so .fa { width: 47px; height: 47px; font-size: 30px;} .social .seg { margin-bottom: 140px; } .bd-mask .tcbox .contwarp { padding: 27px;} .bd-mask .tcbox .contwarp h3 { font-size: 28px; margin-bottom: 20px; } .bd-mask .tcbox .contwarp form input, .bd-mask .tcbox .contwarp form select, .bd-mask .tcbox .contwarp form textarea { width: 100%; border-radius: 5px; margin-bottom: 16px; height: 34px; padding-left: 10px; font-size: 12px; } .bd-mask .tcbox .contwarp form textarea { height: 95px; resize: none; padding: 10px; } .bd-mask .tcbox .contwarp .close { right: -34px; top: -34px; width: 25px; } .bd-mask .tcbox .contwarp form button { width: 138px; height: 34px; font-size: 12px; margin-top: 16px; } .bd-mask .tcbox .contwarp form input::-webkit-input-placeholder,.bd-mask .tcbox .contwarp form textarea::-webkit-input-placeholder { /* Chrome/Opera/Safari */ font-size: 12px; } .bd-mask .tcbox .contwarp form input::-moz-placeholder,.bd-mask .tcbox .contwarp form textarea::-moz-placeholder { /* Firefox 19+ */ font-size: 12px; } .bd-mask .tcbox .contwarp form input:-ms-input-placeholder,.bd-mask .tcbox .contwarp form textarea:-ms-input-placeholder { /* IE 10+ */ font-size: 12px; } .bd-mask .tcbox .contwarp form input:-moz-placeholder,.bd-mask .tcbox .contwarp form textarea:-moz-placeholder { /* Firefox 18- */ font-size: 12px; } .bd-mask select::-webkit-input-placeholder {font-size: 12px;} .bd-mask .tcbox .contwarp form select { padding-left: 5px; } .bd-mask input::-webkit-input-placeholder {font-size: 12px;} .side_btn a::after { width: 55px; height: 55px;} .side_btn a img { width: 20px; margin-top: -8px; margin-left: -10px; } .side_btn a { width: 68px; height: 68px;} .side_btn { bottom: 40px; width: 85px; height: 85px;} .proinfo04 .icenter1 .bot .imgbox {padding: 26px 0px;} .glo02 .icenter1 .text .after h5{line-height: 50px;} }