/* =====头部===== */ #c-placeholder {height: 1rem;} .header {position: absolute; top: 0;width: 100%;z-index: 999; transition: .5s;} .header .container {width: 1720px; max-width: 92%;} .header::after {content: ""; width: 100%; height: 1px; background: transparent; position: absolute; left: 0; bottom: 0;} .headerBox {display: flex; justify-content: space-between; align-items: center; height: 1rem; transition: .5s; min-height: 60px;} .headerLogo img {max-width: 2.5rem; width: 100%;} .headerLogo img:nth-child(2) {display: none;} .headerRe {display: flex; align-items: center;} .headernav {width:44%;} .headernav > ul {display: flex; justify-content: space-between;} .headernav > ul > li {position: relative;} .headernav > ul > li > a {font-size: var(--font17); color: #fff; position: relative; transition: .35s; line-height: 1rem; opacity: .6;} .headernav > ul > li > a::after {content: ""; position: absolute; transition: .5s; width: 0; left: 15%; bottom: -2px; height: 1px; background: #333;} .headernav > ul > li:hover > a ,.headernav > ul > li.on > a { /* color: #37A5D0; */ opacity: 1; /* @supports (-webkit-background-clip: text) or (background-clip: text) { background: linear-gradient(to right, #37A5D0, #6B5BA0);-webkit-background-clip: text;background-clip: text;color: transparent; } */ } .luangage {display: flex; align-items: center; position:relative;padding: .15rem 0; margin: -.15rem 0;} .luangage i {width: 2px; height: .16rem; background: #fff; margin-left: .1rem;} .luangage a {margin-left: .1rem; transition: .35s;} .luangage a:hover { color: #37A5D0; @supports (-webkit-background-clip: text) or (background-clip: text) { background: linear-gradient(to right, #37A5D0, #6B5BA0);-webkit-background-clip: text;background-clip: text;color: transparent; } } .weblinks {box-shadow: 0 0 0.1rem rgb(0, 0, 0,.2);position: absolute;background: #fff;border-radius: 5px;padding: .1rem 40px;left: 50%;top: 100%; text-align: center;transform:translateX(-50%) translateY(35%);opacity: 0;visibility: hidden;transition: .5s; width:max-content;} .weblinks::before {content: "";width: 20px; height: 10px; background: #fff; clip-path: polygon(50% 0%, 0% 100%, 100% 100%);-webkit-clip-path: polygon(50% 0%, 0% 100%, 100% 100%); background: #fff; position: absolute;left: 50%;top: -3%;transform: translate(-50%, -50%);} .weblinks a {justify-content: center; } .weblinks a {margin: 10px 0; display: block;} .weblinks a:hover {color: #ea5506;} .luangage:hover .weblinks {opacity: 1; transform:translateX(-50%) translateY(0%); visibility: visible;} /* 头部下滑导航 */ .header.fh {background: #fff; box-shadow: 0.28px 8px 25px 0px rgba(93,93,93,0.03); } .header.fh .headerLogo img:nth-child(1) {display: none;} .header.fh .headerLogo img:nth-child(2) {display: block;} .header.fh .headernav > ul > li > a {color: #333; opacity: .6;} .header.fh .luangage svg path {fill: #138CC4;} .header.fh .luangage a {color: #333;} .header.fh .luangage i {background: #333;} .header.fh .headernav > ul > li:hover > a , .header.fh .headernav > ul > li.on > a { opacity: 1; /* @supports (-webkit-background-clip: text) or (background-clip: text) { background: linear-gradient(to right, #37A5D0, #6B5BA0);-webkit-background-clip: text;background-clip: text;color: transparent; } */ } .header.fh .headernav > ul > li:hover > a::after , .header.fh .headernav > ul > li.on > a::after {width: 70%;} .header.fh .luangage a:hover { color: #37A5D0; @supports (-webkit-background-clip: text) or (background-clip: text) { background: linear-gradient(to right, #37A5D0, #6B5BA0);-webkit-background-clip: text;background-clip: text;color: transparent; } } .header.fh .mobmenu dl dd {background: #333;} .header.fh .mobmenu h4 {color: #333;} .header.fh2 .headerLogo img:nth-child(1) {display: none;} .header.fh2 .headerLogo img:nth-child(2) {display: block;} .header.fh2 .headernav > ul > li > a {color: #333; opacity: .6;} .header.fh2 .luangage svg path {fill: #138CC4;} .header.fh2 .luangage a {color: #333;} .header.fh2 .luangage i {background: #333;} .header.fh2 .mobmenu dl dd {background: #333;} .header.fh2 .mobmenu h4 {color: #333;} .header.fh2 .heTel i svg path {fill: #333;} .header.fh2 .heTel strong {color: #333;} /* 产品下拉导航 */ .headernav > ul > li:nth-child(2) {position: static;} .proMenuDown {position: absolute;width: 100%;left: 0;line-height: initial;background: #fff;border-top: 1px solid #D5D5D5;display: none;z-index: 8;} .proMenuDown .container {max-width:86%;} .proNavList {display: flex; justify-content: space-between;padding: .5rem 0;} .proNavList .hd {width:15%;} .proNavList {display: flex; align-items: flex-start;} /*.proNavList .hd dd {margin-bottom: 20px;}*/ .proNavList .hd dd .smtit {font-size: var(--font12);color: rgba(0, 0, 0, 0.45); margin-bottom: 10px;} .proNavList .hd dd a {display: flex; align-items: center; padding:7px 15px;transition: all .3s ease; box-sizing: border-box;} .proNavList .hd dd a span {font-size: var(--font14); color: rgba(0,0,0,.85);} .proNavList .hd dd a .imgBox {width: 20px; height: .4rem; display: flex; align-items: center; justify-content: center;} .proNavList .hd dd a .imgBox img {max-width: 100%; object-fit: contain; max-height: 100%;display:none;} .proNavList .hd dd.on a {background-color: hsla(0,0%,59.2%,.1)} .proNavList .bd {width:82%;} .proNavList .bd ul {display: none;} .proNavList .bd ul li {position: relative;} .proNavList .bd ul.on {display: block;} .proNavSwiper {position: static; max-width: 100%;} .proNavSwiper .swiper-slide {height: auto;} .proNavSwiper .swiper-slide a {display: block;background-color: hsla(0,0%,59.2%,.1);padding: .3rem .2rem; text-align: center; height: 100%;} .proNavSwiper .swiper-slide a img {width: 100%; max-height: 2rem; object-fit: contain; transition: .5s;} .proNavSwiper .swiper-slide .imgBox {margin-bottom: .1rem;} .proNavSwiper .swiper-slide h5 {color: #333; font-size: var(--font16);} .proNavSwiper .swiper-slide span {color: #666; font-size: var(--font14);} .proNavSwiper .swiper-slide:hover .imgBox img {transform: scale(1.02);} .proNavSwiper .swjt {right: 0;} .proNavSwiper .swjt.swiper-button-prev {transform: rotate(180deg); right: auto; left: 0;} /* 其他二级导航 */ .menuDownTwo {line-height: initial; padding: .1rem .15rem;width: 100%; min-width: max-content;position: absolute;top: 100%;left: 50%;transform: translate(-50%, 50px);z-index: 10;background: #fff;color: rgba(0,0,0,.65); opacity: 0;pointer-events: none;transition: all 0.4s;box-shadow: 0 .1rem .2rem 0 rgba(0, 0, 0, 0.06);border-top: .03rem solid #138CC4;} .menuDownTwo.on {opacity: 1;pointer-events: auto;transform: translate(-50%, -2px);} .menuDownTwo ul {white-space: nowrap;} .menuDownTwo ul li a {font-size: var(--font14);display: block;padding: .1rem .05rem;border-bottom: 1px solid #dbdbdb;text-align: center; transition: .4s;} .menuDownTwo ul li:last-child a {border: none;} .menuDownTwo ul li a:hover {color: #37A5D0;} /* 开源下拉导航 */ .headernav > ul > li:nth-child(3) {position: static;} .proMenuDown2 .container {max-width: 60%;} .proMenuDown2 dl {display: flex; padding: .5rem 0; justify-content: space-between;} .proMenuDown2 dl a{background-color:#F4F4F4} .proMenuDown2 dl dd {width: 30%;} .proMenuDown2 dl dd .imgBox {background-color: hsla(0,0%,59.2%,.1);padding: .3rem .2rem; } .proMenuDown2 dl dd .imgBox img {width: 100%; max-height: 2rem;object-fit: contain;transition: .5s;} .proMenuDown2 dl dd span {display: block; text-align: center;color: #333;margin-top: .2rem;} .proMenuDown2 dl dd:hover .imgBox img {transform: scale(1.02);} /* 公用css */ /* 滚动条 */ .headerNavScroll {scrollbar-width:thin;scrollbar-color:#138ABD #E5E5E5; overflow-y: auto;} .headerNavScroll::-webkit-scrollbar {width: 3px;} .headerNavScroll::-webkit-scrollbar-thumb {background: #138ABD; border-radius: 5px;} .headerNavScroll::-webkit-scrollbar-track { background: #E5E5E5;} /* 了解更多 */ .more1 {width: 1.42rem;height: 0.55rem;min-width: 125px;min-height: 40px; background: linear-gradient(105deg,#37a5d0 0%, #6b5ba0 100%);border-radius: 28px; color: #ffffff; transition: .5s; position: relative; z-index: 1; overflow: hidden;} .more1 svg {margin-left: .1rem;} .more1::before {content: '';position: absolute;left: 0; top: 0; right: 0; bottom: 0;background: linear-gradient(105deg,#6b5ba0 0%, #37a5d0 100%);opacity: 0; transition: opacity .5s; z-index: -1;} .more1:hover {-webkit-box-shadow: 0 0 0 0.1rem rgba(55, 165, 208,.2); box-shadow: 0 0 0 0.1rem rgba(55, 165, 208,.2);} .more1:hover::before {opacity: 1;} .proMenuDown2 .more a {display: flex; align-items: center;} .proMenuDown2 .more i {max-width: 20px; max-height: 20px;} .proMenuDown2 .more i svg {max-width: 100%; height: 100%;} .proMenuDown2 .more span {margin: 0 .05rem;} .proMenuDown2 .more:hover span {color:#37a5d0} .proMenuDown2 .more:hover i svg path {fill:#37a5d0} /* =====首页===== */ /* banner */ .indexbanner {position: sticky; top: 0; z-index: 0; height: 100vh;} .bannerSwiper {height: 100vh; position: relative; z-index: 4;} .bannerSwiper .con1 {top:53%; z-index:2;} .bannerSwiper .con1 strong {font-size: 0.83rem;color: #ffffff; font-weight: 700; position: relative; display: inline-block;} .bannerSwiper .con1 strong::after {content: ""; width: 0.18rem; height: 0.18rem; position: absolute;left: -5%;top: 15%; background-size: contain;} .bannerSwiper .con1 span {display: block;font-size: 0.41rem;color: #ffffff;} .bannerSwiper .con1 .more {margin-top:.5rem;} .bannerSwiper .imgBox {height: 100%; position:relative;} .bannerSwiper .imgBox img { width: 100%; height: auto; min-height: 100%;transition: 1s linear 2s;transform: scale(1.1,1.1); object-fit: cover;} .bannerSwiper .imgBox video {position:absolute;width:100%;height:100%;left:0;top:0;z-index:1; object-fit:cover;} .bannerSwiper .swiper-slide-active img, .bannerSwiper .swiper-slide-duplicate-active img { transition: 6s linear;transform: scale(1,1);} .bannerSwiper .swiper-pagination {width: 1500px; text-align: left; top: auto;bottom: 0; left: 50%; bottom: 5%; z-index: 13;} .bannerSwiper .swiper-pagination span {margin: 0 .08rem !important; width: .12rem; height: .12rem; min-width: 8px; min-height: 8px; background: url(../images/bannerSwiper-pag-icon1.png); opacity: 1; background-size: contain; border-radius: 0;} .bannerSwiper .swiper-pagination .swiper-pagination-bullet-active {background: url(../images/bannerSwiper-pag-icon2.png); opacity: 1; background-size: contain;} /* 自定义分页器 */ .paginationBox {position: absolute; z-index: 2; right: 0; bottom: .8rem;right: 3%; width: 1.2rem; height: 1.2rem;} .paginationBox svg {width: 100%; height: 100%;} .paginationBox .swiper-num {display: inline-flex; position: absolute; align-items: center; bottom: auto; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: var(--font15);color: rgba(255, 255, 255,.55);} .paginationBox .swiper-num em {margin: 0 .05rem;transform: translateY(.05rem);} .paginationBox .swiper-num span:nth-child(1) {font-size: 0.36rem;color: #ffffff;} .paginationBox .swiper-num span:nth-child(3) {transform: translateY(.05rem);} .paginationBox .fcircle1 circle:nth-child(1) {opacity: .3; } .paginationBox.on .fcircle1 circle:nth-child(2) {animation: svgcircle 10s linear forwards;} .indexBanner .indexXian {position: absolute; left: 50%; top: auto; transform: translateX(-50%); z-index: 1;bottom: .7rem;} @keyframes svgcircle {from {stroke-dasharray: 0 800;}to {stroke-dasharray: 800 800; }} /* 首页内容 */ .indexMain {position: relative; z-index: 1;background: #fff;} .indexOne {height: 100vh; position: sticky; top: 0;} .indexOne .imgBox {height: 100%; position: relative; display: none;} .indexOne .imgBox img {width: 100%; height: 100%; object-fit: cover;} .indexOne .imgBox .wrapLogo {position: absolute; width: 100%; height: 100%; left: 0; top: 0; display: none;} .indexOne .overlay {position: absolute; top: 0;left: 0;right: 0;bottom: 0; z-index: 3; opacity: 1;overflow: hidden; } .indexOne .img_logo {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 3;background-position: center;background-repeat: no-repeat;background-size: cover;} .indexOne .intro_box {position: absolute;left: 0;right: 0;top:56%;text-align: center; z-index: 3; text-align: center;} .indexOne .intro_box .txt {font-size: var(--font20);color: #1484d2;} .indexOne .intro_box .tit {font-size: 0.72rem;color: #1c2025; font-weight: 700;} .indexOne .intro_box .more {display: flex; justify-content: center; margin-top: .3rem;} .indexOne .intro_box.con {display: none;} .indexOne .arrow {bottom: 7%; transform: none;} /* .indexOne {position: absolute; top: 0;left: 0;width: 100%; height: 100%;} */ /* 向下箭头 */ .arrow {position: absolute; bottom: 4%; left: 50%;transform: translate(-50%, -50%); z-index: 3;} .arrow img {display: block; opacity: 0; animation: arrow-animation 2s linear infinite; margin-top: -6px;} .arrow .jt1 {animation-delay: 0s; transform: scale(.25);} .arrow .jt2 {animation-delay: .5s;transform: scale(.5);} .arrow .jt3 {animation-delay: 1s;transform: scale(.75);} .arrow .jt4 {animation-delay: 1.5s;transform: scale(1);} @keyframes arrow-animation {0% {opacity: 0;}33.33% { opacity: 1; }100% { opacity: 0;}} .indexTwo {position: relative;} .indexTwo ul {height: 100%;} .indexTwo ul li {width: 100%; position: sticky; top: 0; height:100%;} .indexTwo ul li .imgBox {position: relative; width: 100%;left: 0; bottom: 0; height:100%;} .indexTwo ul li .imgBox img , .indexTwo ul li .imgBox video {width: 100%; height: 100%; object-fit: cover;} .indexTwo ul li .tle {text-align: center; position: absolute; padding-top: 4%; position: absolute; width: 100%; left: 50%; top: 0; z-index: 3; transform: translate(-50%, 0);} .indexTwo ul li .tle strong {font-size: 0.54rem; color: #ffffff; display: block; font-weight: 700;} .indexTwo ul li .tle span {font-size: var(--font20);color: #f9f9f9; display: block;} .indexTwo ul li:nth-child(1) .bottom {bottom: 15%;} .indexTwo ul li:nth-child(1) .more a {background: none; border: 1px solid rgba(255, 255, 255,.45);} .indexTwo ul li:nth-child(1) .more a:hover {border-color: transparent;} .indexTwo ul li .bottom {position: absolute; left: 50%; z-index: 3; transform: translate(-50%, 0%); bottom: 3%;} .indexTwo ul li .bottom .arrow {position: relative; margin-top: .8rem; display: flex; justify-content: center;} .indexTwo ul li:nth-child(2) .tle strong {color: #333;} .indexTwo ul li:nth-child(2) .tle span {color: #333;} .indexTwo .swiper-slide {height: auto;} .indexTwo .swiper-pagination {display:none;} .indexTwo .swiper-pagination-bullet-active {background: linear-gradient(105deg,#37a5d0 0%, #6b5ba0 100%);} .indexTwo .swjt {flex-wrap: wrap; right: 1%; width: 50px; height: 60px;} .indexTwo .swjt .i1 {width: 30px;height: 30px;opacity: .86; display: block; background: #fff; -webkit-clip-path: polygon(0 0, 30% 0, 100% 100%, 70% 100%); clip-path: polygon(0 0, 30% 0, 100% 100%, 70% 100%); transition: .5s;} .indexTwo .swjt .i2 {transform: rotateX(-180deg); width: 30px;height: 25px; position: relative; left: 20%; opacity: 1; display: block; background: linear-gradient(105deg,#37a5d0 0%, #6b5ba0 100%); -webkit-clip-path: polygon(0 0, 30% 0, 100% 100%, 70% 100%); clip-path: polygon(0 0, 30% 0, 100% 100%, 70% 100%); transition: .5s;} .indexTwo .swjt.swiper-button-prev {transform: rotateY(180deg); left: 1%;} .indexTwo .swjt:hover .i1 {background: linear-gradient(105deg,#37a5d0 0%, #6b5ba0 100%);} .indexTwo .swjt:hover .i2 {left: 0; height: 30px;} @media screen and (min-width: 200px) and (max-width: 767px) { .indexTwo .swjt {display:none;} .indexTwo .swiper-pagination {display:block;} } .indexThree {overflow: hidden; background: #fff; position: relative;} .indexThree .tle {padding: .9rem 0 .6rem 0; text-align: center;} .indexThree .tle strong {font-size: 0.54rem;color: #1c2025; display: block; font-weight: 700;} .indexThree .tle span {color: #666666; font-size: var(--font20); display: block;} .indexThree .tle .more {margin-top: .4rem; display: flex; justify-content: center;} .inThSwiper {width: 76%; overflow: visible;} .inThSwiper .imgBox {overflow: hidden;border-radius: 0.1rem; position: relative;} .inThSwiper .imgBox img {width: 100%; height: 100%; object-fit: cover; transition: 1s;} .inThSwiper .con {position: absolute; z-index: 2; bottom: 0; width: 100%; padding: .6rem .6rem .6rem 1rem; box-sizing: border-box; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;} .inThSwiper .con h5 {font-size: 0.4rem;color: #ffffff; font-weight: 700;} .inThSwiper .con span {font-size: 0.2rem;color: #ffffff; margin-top: .1rem; display: block;} .inThSwiper .con .more a {background: none; border: 1px solid rgba(255, 255, 255,.45);} .inThSwiper .con .more a:hover {border-color: transparent;} .inThSwiper .swiper-slide-active .imgBox img {transform: scale(1.05);} .inThSwiper .imgBox::after {content: ""; position: absolute; width: 100%;top: 0;left: 0;transition: .2s; height: 100%; background-image: linear-gradient(to top , rgba(0 , 0 , 0, .6) 0% , rgba(0, 0, 0, 0.01));} .inThSwiper .links {position: absolute; width: 100%; height: 100%; left: 0; top: 0;} .inThSwiper .swjt {flex-wrap: wrap; right: -8%; width: 50px; height: 60px;} .inThSwiper .swjt .i1 {width: 30px;height: 30px;opacity: .86; display: block; background: #fff; -webkit-clip-path: polygon(0 0, 30% 0, 100% 100%, 70% 100%); clip-path: polygon(0 0, 30% 0, 100% 100%, 70% 100%); transition: .5s;} .inThSwiper .swjt .i2 {transform: rotateX(-180deg); width: 30px;height: 25px; position: relative; left: 20%; opacity: 1; display: block; background: linear-gradient(105deg,#37a5d0 0%, #6b5ba0 100%); -webkit-clip-path: polygon(0 0, 30% 0, 100% 100%, 70% 100%); clip-path: polygon(0 0, 30% 0, 100% 100%, 70% 100%); transition: .5s;} .inThSwiper .swjt:hover .i1 {background: linear-gradient(105deg,#37a5d0 0%, #6b5ba0 100%);} .inThSwiper .swjt:hover .i2 {left: 0; height: 30px;} .inThSwiper .swjt.swiper-button-prev {transform: rotateY(180deg); left: -8%;} .inThSwiper .swiper-pagination {display: none;} .inThSwiper .swiper-pagination .swiper-pagination-bullet-active {background: linear-gradient(105deg,#37a5d0 0%, #6b5ba0 100%);} .indexFour {padding-top: 1rem; background: #fff; position: relative; padding-bottom: 1.5rem;} .indexFour .tle {display: flex; justify-content: space-between; flex-wrap: wrap;align-items: center;} .indexFour .tle h4 {font-size: 0.54rem;color: #1c2025; font-weight: 700;} .indexFour .box {margin-top: .5rem; display: flex; justify-content: space-between;} .indexFour .le {width: 45%; background: #f8f8f8;border-radius: 0.1rem; overflow: hidden;} .infourSwiper .imgBox {overflow: hidden;} .infourSwiper .imgBox img {width: 100%; transition: .5s;} .infourSwiper .con {padding: .4rem; box-sizing: border-box;} .infourSwiper .con h6 {font-size: var(--font22);color: #333333; font-weight: 700;} .infourSwiper .con p {color: #777777; font-size: var(--font15); margin-top: .1rem;} .infourSwiper .con .time {color: #adadad;margin-top: .4rem;} .infourSwiper .swiper-slide:hover .imgBox img {transform: scale(1.05);} .infourSwiper .swiper-slide:hover .con h6 {color: #0A6FB7;} .infourSwiper .swiper-pagination { text-align: right; padding-right: .4rem; bottom: .4rem;} .infourSwiper .swiper-pagination span {margin: 0 .08rem !important; width: .12rem; height: .12rem; min-width: 8px; min-height: 8px; background: url(../images/bannerSwiper-pag-icon1.png); opacity: .5; background-size: contain; border-radius: 0;} .infourSwiper .swiper-pagination .swiper-pagination-bullet-active {background: url(../images/bannerSwiper-pag-icon2.png); opacity: 1; background-size: contain;} .indexFour .re {width: 53.25%;} .indexFour .re li {background: #f8f8f8; border-radius: 0.05rem; overflow: hidden; margin-bottom: .25rem;} .indexFour .re li:last-child {margin-bottom: 0;} .indexFour .re li .recon {display: flex;} .indexFour .re li .imgBox {width: 38%;overflow: hidden;} .indexFour .re li .imgBox img {width: 100%; height: 100%; object-fit: cover; transition: .5s;} .indexFour .re li .info {width: 62%;padding: .35rem .25rem;box-sizing: border-box;} .indexFour .re li .info .time {color: #adadad;} .indexFour .re li .info h6 {color: #333333; font-size: var(--font20); font-weight: 700; margin-top: .1rem;} .indexFour .re li .info p {color: #777777; font-size: var(--font15); margin-top: .05rem;} .indexFour .re li .info .em {color: #5e5e5e; font-size: var(--font15); margin-top: .2rem;} .indexFour .re li:hover .imgBox img {transform: scale(1.05);} .indexFour .re li:hover .info h6 {color: #0A6FB7;} .indexFour .re li:hover .info .em {color: #0A6FB7;} .contactUs {background: url(../images/contactUs-bj.jpg) no-repeat center; background-size: cover; padding: 1rem 0; position: relative;} .contactUs .tle {text-align: center;} .contactUs .tle strong {font-size: 0.54rem;color: #ffffff; font-weight: 700; display: block;} .contactUs .tle span {display: block;color: #ffffff; font-size: var(--font20);opacity: 0.79;} .contactUs .tle .more {display: flex; justify-content: center; margin-top: .3rem;} /* =====底部===== */ .footer {background: #1e2021; position: relative; z-index: 1; padding-top: .6rem;} .foterBox {display: flex; justify-content: space-between;} .foterBox .foterLogo img{width: 170px;} .foterBox .address {margin-top:.3rem;} .foterBox .address .item .icBox {display: flex; align-items: center; justify-content: center; margin-right: .1rem;} .foterBox .address .item {display: flex; align-items: center; font-size: var(--font15);color: #ffffff; margin-top:.1rem;} .foterBox .address .item span {opacity: .7;} .foterBox .address .item span a{color:#fff} .foterBox .links ul {display: grid;grid-template-columns: repeat(7,auto);gap: .15rem;margin-top:.3rem;justify-content: flex-start;} .foterBox .links .wxCode {position: absolute; left: 50%;top: 150%;transform: translate(-50%, 0%); transition: .5s; opacity: 0; visibility: hidden; background: #fff; box-shadow: 0 0 10px rgba(0, 0, 0,.2); padding: .1rem; border-radius: 5px; box-sizing: border-box;} .foterBox .links .wxCode::after {content: "";width: .15rem; height: .1rem; background: #fff;-webkit-clip-path: polygon(50% 0%, 0% 100%, 100% 100%);clip-path: polygon(50% 0%, 0% 100%, 100% 100%); position: absolute; left: 50%; top: -2%; transform: translate(-50%, -50%);} .foterBox .links .wxCode img {max-width: 1rem;} .foterBox .links ul li:hover .wxCode {visibility: visible; opacity: 1; top: 100%; } .foterBox .links ul li {position: relative;} .foterBox .links ul li > a {width: 0.3rem;height: 0.3rem;min-width: 40px;min-height: 40px;background: rgba(255, 255, 255, 0.1);border-radius: 50%;transition: .5s;} .foterBox .links ul li:nth-child(2) a svg {max-width: 70%;} .foterBox .links ul li > a svg {max-width: 50%; margin: auto;} .foterBox .links ul li > a svg path {transition: .5s; fill: #ADADAD;} .foterBox .links ul li:hover > a {background: #0A6FB7;} .foterBox .links ul li:hover > a img {filter: brightness(100); -webkit-filter:brightness(100);} .foterBox .links ul li:hover > a svg path {fill: #fff;} /* 底部导航 */ .foternav {margin-left: .5rem; display: flex;width: 53%; justify-content: space-between; flex-wrap: wrap;} .foternav dl { padding-right: .15rem;} .foternav dl dt {margin-bottom: .25rem;} .foternav dl dt a {color: #ffffff; font-weight: 700; } .foternav dl dd {margin: .05rem 0;} .foternav dl dd a {color: rgba(255, 255, 255,.68); font-size: var(--font15);} .foternav dl dd a:hover {color: #fff;} /*.foternav dl dd ul {margin: .15rem 0;}*/ /*.foternav dl dd ul li {margin: .05rem 0;}*/ .foternav dl dd ul li a {font-size: var(--font14);color: rgba(255, 255, 255,.32);} .foterLinks {margin-top: .8rem; padding-bottom: .2rem; border-bottom: 1px solid rgba(242, 242, 242,.16);} .foterLinks dl {display: flex;} .foterLinks dl dt {margin-top: .05rem;color: #ffffff; font-size: var(--font18); flex-shrink: 0;} .foterLinks dl .ddBox {display: flex; margin-left: .1rem; flex-wrap: wrap;} .foterLinks dl .ddBox dd {margin-top: .05rem; position: relative; padding: 0 .15rem; box-sizing: border-box;} .foterLinks dl .ddBox dd::after {content: ""; width: 1px; height: 60%; top: 15%; position: absolute; right: 0;background: #f2f2f2; opacity: .4;} .foterLinks dl .ddBox dd:last-child::after {display: none;} .foterLinks dl .ddBox dd a {color: #ffffff; opacity: .4;} .foterLinks dl .ddBox dd a:hover {opacity: 1;} .copyright {padding: .3rem 0;} .copyright p {width: 100%; text-align: center;} .copyright p , .copyright p a {color: rgba(188, 188, 188,.53); font-size: var(--font15);} .copyright p a:hover {color: #fff;} /* =========================================================================================内页============================================================================ */ /* 内页banner */ .ny-banner {position: relative;} /* 内页导航栏目 */ .aboutOne {padding: 1rem 0 .5rem; position: relative; overflow: hidden;} .aboutOne .con span {font-size: var(--font28);color: #138CC4; display: block;} .aboutOne .con strong {font-size: 0.6rem; color: #333333; display: block; line-height: 1.25; text-align: center; font-weight: 700;} .aboutOne .bjBox {position: absolute; right: 0; bottom: -60%;z-index: -1;} .nypagenav {margin-top: .8rem;} .nypagenav .box {display: flex; justify-content: space-between; flex-flow: row wrap;} .nypagenav ul {display: flex;margin-top: .1rem;} .nypagenav ul li {margin-right: .7rem; position: relative; display: flex; align-items: center;} .nypagenav ul li a {color: #656565; font-size: var(--font17); margin-left: .1rem; transition: .4s;} /* .nypagenav ul li::before {content: ""; background: url(../images/nypagenav-icon.png) no-repeat center;width: 0.15rem;height: 0.15rem; opacity: 0; visibility: hidden; transition: .4s; background-size: contain;} */ .nypagenav ul li:hover::before , .nypagenav ul li.on::before {opacity: 1; visibility: visible;} .nypagenav ul li:hover a , .nypagenav ul li.on a {color: #138CC4;} /* 面包屑 */ .mbx {margin-top: .1rem;} .mbx a {color: #656565; font-size: var(--font17);} .mbx img {margin-right: 5px;} .mbx a:hover {color: #138CC4;} /* =====关于我们===== */ .about-abnner .container img {/* width:8rem; */} .aboutMain .shuxian {position: absolute; width: 100%;height: 100%;top: 0; z-index: -1;} .aboutMain .shuxian .container {position: relative; height: 100%;} .aboutMain .shuxian .smtit {height: 100%; padding-top: 9%;padding-right: .05rem; box-sizing: border-box; position: relative; writing-mode:vertical-rl; color: #0090ff; font-size: var(--font14); text-transform: uppercase;} .aboutMain .shuxian .smtit::after {content: ""; width: 1px; height: 0; right: 0; background: #FFFFFF;opacity: .5; position: absolute; top: 0; transition: 2.5s;} .aboutMain .shuxian .smtit.on::after {height: 100%; opacity: .15;} .aboutMain .item {position: relative; z-index: 1; overflow: hidden;} .aboutMain .item .box {padding-left: 1rem;} .aboutTle h3 {font-size: 0.52rem;color: #ffffff; position: relative; font-weight: 700;} .aboutTle h3:last-child {display: inline-block; line-height: 1; z-index: 1; margin-top: .1rem;} .aboutTle h3:last-child::after {position: absolute;content: ""; bottom: 0; left: 0; height: 0.1rem; background: #074493; width: 0; z-index: -1; transition: 2s;} .aboutTle.on h3:last-child::after {width: 100%;} .aboutTwo {background: url(../images/aboutTwo-bj.jpg) no-repeat center; background-size: cover; padding: 2rem 0 3rem 0; background-attachment: fixed; position: relative;} .aboutTwo .con .text {padding-top: .4rem; width: 65%;} .aboutTwo .con .text p {color: #ffffff; font-size: var(--font18); margin-top: .3rem;} .aboutThree {background: 50% 0 no-repeat center; background-image: url(../images/aboutThree-bj.jpg); background-size: cover; background-attachment: fixed; padding: 1rem 0 2.1rem 0;} .aboutThree ul {margin-top: .7rem; display: flex; justify-content: space-between; padding-right: 1.2rem;} .aboutThree ul li {margin-top: .3rem; width: 43%;} .aboutThree li .imgBox {overflow: hidden;} .aboutThree li .imgBox img {width: 100%; transition: .8s;} .aboutThree li .smtit {padding:0 .2rem; display: inline-block; color: #ffffff; font-size: var(--font24); margin-top: .3rem; position: relative;} .aboutThree li .smtit::after {content: "";width: var(--font32); height: var(--font32); border-radius: 50%; background: #074493; position: absolute; z-index: -1; opacity: 1; left: 0; transition: .5s;} .aboutThree li .text {color: #ffffff; font-size: var(--font36); margin-top: .25rem;} .aboutThree li .text span {display: block;} .aboutThree li:hover .smtit::after {animation: servicesmoreyq 2s infinite linear;} .aboutThree li:hover .imgBox img {transform: scale(1.1);} @keyframes servicesmoreyq{0% {left: 0;}20% { left: 20%;}40% { left: 40%;} 60% { left: 50%;}80% { left: 20%;}100% { left: 0;}} .aboutThree li.on .imgBox img {transform: scale(1.1);} .aboutThree li.on .smtit::after {opacity: 1; } .aboutThree .henxian {position: absolute; bottom: 1rem; width: 0; height: 1px; background: #fff; opacity: .5; left: 0; transition: 2.5s;} .aboutThree .henxian.on {width: 100%; opacity: .15;} .aboutThree dl {margin-top: .5rem; display: flex; justify-content: space-between;} .aboutThree dl dd {margin-top: .5rem; text-align: center;width: 45%; border:1px solid rgba(255,255,255,20%); border-radius: .15rem; padding:0.61rem .2rem; box-sizing: border-box; text-align: center;} .aboutThree dl dd h4 {font-size: var(--font30); color: #fff; font-weight: 700;} .aboutThree dl dd span {color: #fff;font-size: var(--font18);margin-top:0.2rem } .aboutThree dl dd div{margin-bottom:0.15rem;} /* .aboutFour {background: url(../images/aboutFour-bj.jpg) no-repeat center; background-size: cover; padding: 1rem 0 1rem 0; background-attachment: fixed; position: relative;} */ .aboutFour {padding: 1rem 0 1rem 0;position: relative;} .aboutFour .aboutTle {padding-left: 1rem;} .aboutFour .abtbox2_cont {position: absolute; top: 0;left: 0;width: 100%; height: 100%; z-index: -1; text-align: center;} .aboutFour .abtbox2_cont .img { width: 100%;height: 100%;position: relative;overflow: hidden;} .aboutFour .abtbox2_cont .img img {width: 100%; height: 100%; object-fit: cover;} /* .aboutFour .abtbox2_cont .swiper-slide-active .img img {animation: scalefz1 10s linear infinite;} .aboutFour .abtbox2_cont .swiper-slide-thumb-active .img img {animation: scalefz1 10s linear infinite;} .aboutFour .abtbox2_cont .on .img img {animation: scalefz1 10s linear infinite;} */ /* .aboutFour .abtbox2_cont .swiper-slide-active .img img { transition: 10s linear; transform: scale(1.3); } */ /* .aboutFour .abtbox2_cont .swiper-slide-active img, .aboutFour .abtbox2_cont .swiper-slide-duplicate-active img {transition: 10s linear;transform: scale(1,1);} */ /* @keyframes scalefz1 {0% {transform: scale(1);}100% {transform: scale(1.3);}} */ .abFourSwiper1 {margin-top: .3rem;} .abFourSwiper1 .year {font-size: 3.64rem;color: #ffffff;opacity: 0.12; font-weight: 700; text-align: center;} .aboutFour .swiperBox2 {position: relative;} .aboutFour .swiperBox2::after {content: ""; height: 2px;background: #ffffff; width: 99%; position: absolute; left: 50%; top: 44%; transform: translate(-50%, -50%);} .abFourSwiper2 {max-width: 90%; margin: auto; position: static;} .abFourSwiper2 .swiper-slide {width: auto;} .abFourSwiper2 .swiper-slide .month {color: #ffffff; font-size: var(--font20);} .abFourSwiper2 .swiper-slide i {width: 0.15rem;height: 0.15rem;background: #ffffff; border-radius: 50%; display: block; margin-top: .1rem;} .abFourSwiper2 .swiper-slide span {font-size: var(--font20);color: #ffffff; opacity: .8; transition: .35s; display: block; margin-top: .2rem;} /* .abFourSwiper2 .swiper-slide:hover span {opacity: 1;} .abFourSwiper2 .swiper-slide-active span {opacity: 1;} */ .abFourSwiper2 .swjt2 {top: 44%; right: 0;} .abFourSwiper2 .swjt2.swiper-button-prev {right: auto; left: 0; transform: rotate(180deg);} .abFourSwiper2 .swjt2:hover path {fill: #074493;} .abFourSwiper1 .swjt {width: 0.55rem;height: 0.55rem; position: absolute; top: 35%; right: 0;z-index: 1; display: flex;align-items: center; justify-content: center; cursor: pointer;} .abFourSwiper1 .swjt.abFourSwiper1-next {transform: translateY(120%);} .abFourSwiper1 .swjt svg {position: absolute;left: 0;top: 0;width: 100%;height: 100%;} .abFourSwiper1 .swjt svg circle {stroke-width: 8px;} .abFourSwiper1 .swjt svg circle:nth-child(2) {stroke-width: 12px;} .abFourSwiper1 .swjt svg:nth-child(2) {width: 30%; position: relative;} .abFourSwiper1 .swjt svg:nth-child(2) path {fill: #fff; transition: .35s;} .abFourSwiper1 .swjt.abFourSwiper1-prev {transform: rotate(180deg);} .abFourSwiper1 .swjt:hover svg path {fill: #074493;} .abFourSwiper1 .abFourSwiper1-next.on svg circle:nth-child(2) {animation: svgcircle 10.6s linear infinite;} @keyframes svgcircle {from {stroke-dasharray: 0 800;}to {stroke-dasharray: 800 800;}} .aboutFive {background: #081528; padding:1.5rem 0;} .abfiveSwiper {margin-top: 1rem; } .abfiveSwiper .imgBox {background: #081528;border: 0.04rem solid #ffffff; overflow: hidden;} .abfiveSwiper .imgBox img {width: 100%; max-height: 100%;} .abfiveSwiper .swiper-slide span {display: block; text-align: center; margin-top: .3rem;color: #ffffff; font-size: var(--font18);} /* .abfiveSwiper .swiper-slide:hover .imgBox img {transform: scale(1.05);} */ #proapp-num {position: relative; background: #fff; margin-top: 1.3rem; height: .03rem; border-radius: 0; bottom: .3rem;} #proapp-num .swiper-scrollbar-drag { height: .1rem;border-radius: 0.05rem; background: #074493; position: absolute; left: 0; top: -100%;} #proapp-num .swiper-scrollbar-drag:before,#proapp-num .swiper-scrollbar-drag:after { position: absolute; content: ''; width: .26rem; height: .26rem; background: #074493; border-radius: 50%; right: 0; top: 50%; transform: translateY(-50%);} #proapp-num .swiper-scrollbar-drag:before{z-index: 1;} #proapp-num .swiper-scrollbar-drag:after{z-index: 3; width: .12rem; height: .12rem; background: #fff; right: .065rem;} #proapp-num .swiper-scrollbar-drag:hover {cursor: all-scroll;} .aboutSix {background: url(../images/aboutSix-bj.jpg) no-repeat center; background-size: cover; padding: 2rem 0 3rem 0; background-attachment: fixed; position: relative; display: none;} .aboutSix ul {display: flex; justify-content: space-between; margin-top: 1rem;} .aboutSix ul li {position: relative; max-width: 11%;} .aboutSix ul li svg {width: 100%; height: 100%; overflow: visible;} .aboutSix ul li .icon {top: 0;position: absolute;display: flex;align-items: center;justify-content: center;flex-direction: column;z-index: 22;bottom: 0;left: 0;right: 0;} .aboutSix ul li span {display: inline-block; font-size: .28rem; color: #fff; line-height: 1.2;} .aboutSix ul li.on .progress {animation: circleProgress 3s linear forwards;} /* .aboutSix ul li.on svg {transform: rotate(-290deg)} */ .aboutSix ul li:nth-child(2).on .progress {animation: circleProgress2 3s linear forwards;} .aboutSix ul li:nth-child(3).on .progress {animation: circleProgress2 3s linear forwards;} .aboutSix ul li:nth-child(4).on .progress {animation: circleProgress3 3s linear forwards;} @keyframes circleProgress { to {stroke-dashoffset: 950;}} @keyframes circleProgress2 {to {stroke-dashoffset: 425;}} @keyframes circleProgress3 { to {stroke-dashoffset: 1000;}} .aboutSeven {background: url(../images/aboutSeven-bj.jpg) no-repeat center; background-size: cover; padding: 1rem 0 1rem 0; background-attachment: fixed; position: relative;} .aboutSeven ul {display: flex; margin-top: 1.3rem;} .aboutSeven ul li {position: relative; height:3rem; overflow: hidden; transition: .5s;flex: 1; border: 1px solid rgba(255, 255, 255, 20%); border-radius: 0.15rem;margin:0 0.1rem} .aboutSeven ul li a {position: absolute; width: 100%; height: 100%; left: 0; bottom: 0; z-index: 1;} .aboutSeven ul li.on {flex: 3;} .aboutSeven ul li .tle {position: absolute; width: 100%; height: 100%; padding: .1rem; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; justify-content: center; z-index: 1; transition: .3s;} .aboutSeven ul li .tle::after {content: ""; position: absolute; width: 100%; height: 100%; z-index: -1;} .aboutSeven ul li .tle h4 {font-size: var(--font26);color: #FFFFFF;display: flex;height: 100%;align-items: flex-end; width: 100%; justify-content: center; padding-bottom: .5rem; box-sizing: border-box;} .aboutSeven ul li .tle span {font-size: var(--font26); color: #fff;} .aboutSeven ul li .tle span { width:0.7rem; margin:0.6rem auto 0 auto;display: block;} .aboutSeven ul li .tle span img{width: 100%;} .aboutSeven ul li .imgBox {height: 100%;height: 100%;position: absolute;left: 0; top: 0; width: 100%; z-index: 0;} .aboutSeven ul li .imgBox img {width: 100%;height: 100%; object-fit: cover;filter: grayscale(0.7); display: none;} .aboutSeven ul li .con {padding:.4rem 0 0.6rem 0; padding-left:6%; position: relative;display: flex;flex-direction: column;justify-content: end; z-index: 1; height: 100%;} .aboutSeven ul li .con::after {content: ""; position: absolute; transition: 1s; width: 0; left: 0; bottom: 0; height: 100%; background-image: linear-gradient(to bottom, rgb(0 0 0 / 0%) 30%, #21549b);} .aboutSeven ul li .con .icBox {width: .7rem; height: .7rem; display: flex; align-items: center; justify-content: center; transform: translateY(0.3rem);opacity: 0;transition: .4s;} .aboutSeven ul li .con .icBox img {max-width: 100%;} .aboutSeven ul li .con h5 {color: #FFFFFF;font-size: var(--font26);margin-top: .1rem; opacity: 0;transform: translateY(0.3rem);transition: .4s;} .aboutSeven ul li .con .text {color: #fff; margin-top: .1rem; opacity: 0;transform: translateY(0.3rem);transition: .4s; min-height: 1.3rem;} .aboutSeven ul li .con .text span {display: block;font-size: var(--font16);margin-bottom:0.05rem} .aboutSeven ul li.on .tle {opacity: 0; } .aboutSeven ul li.on .con::after {width: 100%; z-index: -1;} .aboutSeven ul li.on .con .icBox {transform: translateY(0); opacity: 1;transition-delay: .4s;} .aboutSeven ul li.on .con h5 {transform: translateY(0); opacity: 1;transition-delay: .6s;font-weight: 700;margin-bottom:0.05rem} .aboutSeven ul li.on .con .text {transform: translateY(0); opacity: 1;transition-delay: .7s;} .aboutSeven ul li.on .imgBox img{filter: grayscale(0.3);} /* =====市场活动===== */ .paignsBanner {position: relative; } .paignsBanner .bjBox {position: absolute; width: 100%; height: 100%; left: 0; bottom: 0; z-index: -1;} .paignsBanner .bjBox img {width: 100%; height: 100%; object-fit: cover;} .paignsBanner .box {padding: 2rem 0 1rem 0;} .paignsBanner .box h2 {font-size: 0.59rem;color: #ffffff; font-weight: 700;} .paignsBanner .dlInfo {margin-top: .1rem;} .paignsBanner .dlInfo dl {display: flex; flex-wrap: wrap;} .paignsBanner .dlInfo dd {display: flex; align-items: center; margin-right: .6rem; margin-top: .2rem;} .paignsBanner .dlInfo dd.c-code-btn {cursor: pointer;} .paignsBanner .dlInfo dd span {color: #ffffff; font-size: var(--font17); margin-left: .1rem;} .paignsBanner .videoBtn {margin-top: 1rem; display: inline-block;} .paignsBanner .videoBtn a {width: 2.35rem;height: 0.71rem;border: 0.01rem solid #ffffff;border-radius: 0.1rem; color: #ffffff; font-size: var(--font20); transition: .35s;} .paignsBanner .videoBtn a svg {margin-right: .2rem; max-width: .32rem;} .paignsBanner .videoBtn a:hover {background: #138CC4; border-color: #138CC4;} .campaignslist {background: #f9f9f9; padding: 1rem 0;} .campaignslist ul {display: grid; grid-template-columns: repeat(3,1fr); gap: .4rem;} .campaignslist li {background: #ffffff; border-radius: 0.1rem; overflow: hidden; display: none;} .campaignslist li .imgBox {overflow: hidden; position: relative;} .campaignslist li .imgBox img {width: 100%; transition: .5s;} .campaignslist li .imgBox .itag {background: rgba(3, 0, 0,.58); padding: .08rem .18rem; border-radius: 23px; color: #FEFEFE; font-size: var(--font15); position: absolute; z-index: 1; top: .2rem; right: .2rem;} .campaignslist li .con {padding: .35rem .25rem; box-sizing: border-box;} .campaignslist li h5 {color: #333333; font-weight: 400; font-size: var(--font22); display: -webkit-box;overflow: hidden;-webkit-line-clamp: 2;-webkit-box-orient: vertical;} .campaignslist li .time {color: #adadad; margin-top: .25rem;} .campaignslist li:hover .imgBox img {transform: scale(1.05);} .campaignslist li:hover h5 {color: #138CC4;} .campaignslist .more {display: flex; justify-content: center; margin-top: 1rem;} .campaignslist .more a {width: 2.34rem; height: 0.59rem;border-radius: 0.31rem; font-size: var(--font18);color: #555555; transition: .5s;} .campaignslist .more a:hover {background: linear-gradient(105deg,#6b5ba0 0%, #37a5d0 100%); color: #fff; border-color: #fff;} /* 发布会 */ .launchesTle {text-align: center; padding: .8rem 0;} .launchesTle h3 {font-size: 0.52rem; font-weight: 700;color: #333333;} .launchesTle i {display: inline-block;width: 0.54rem; height: 0.05rem; background: #138abd; border-radius: 0.03rem;} .launchesOne {background: #f9f9f9; padding-bottom: .8rem;} .launchesOne .box {background: #ffffff;border-radius: 0.2rem; box-sizing: border-box; padding: .3rem; box-sizing: border-box; display: flex; justify-content: space-between; align-items: center;} .launchesOne .box .videoBox {width: 70%;} .launchesOne .videoBox li video {width: 100%;} .launchesOne .videoBox li iframe {width: 100%; height: 100%; min-height: 5rem;} .launchesOne .videoBox li.on {display: block;} .launchesOne .videolist {width: 24%;} .launchesOne .videolist ul {position: relative; padding-left: .05rem; padding-right: .35rem;} .launchesOne .videolist ul::before {content: ""; width: 1px; border-left: 1px dashed #D4D4D4; position: absolute; left: .08rem; height: 100%;} .launchesOne .videolist li {display: flex; align-items: center;cursor: pointer; } .launchesOne .videolist li i {width: 0.07rem;height: 0.07rem; background: #969696; border-radius: 50%; margin-right: .4rem; position: relative; flex-shrink: 0; z-index: 1;} .launchesOne .videolist li i::before {content: "";position: absolute;width: 100%;height: 100%;background: rgba(19, 138, 189,.2); border-radius: 50%;left: 0; z-index: 0;} .launchesOne .videolist li i::after {content: ""; width: 100%; height: 100%; left: 0; top: 0; transform: scale(2); position: absolute; background: #969696; opacity: .2; border-radius: 50%;} .launchesOne .videolist li .con {display: flex; align-items: center; border-bottom: 1px solid rgba(220, 220, 220,.65);padding: .15rem 0; width: 100%; transition: .5s;} .launchesOne .videolist li .con span {color: #333333; font-size: var(--font18); margin-right: .1rem;} .launchesOne .videolist li .con svg {width: .19rem; transition: .5s;} .launchesOne .videolist li.on i {background: #138abd;} .launchesOne .videolist li.on i::before {animation: shubiao 1s infinite linear .65s;} .launchesOne .videolist li.on i::after {background: #138abd;} .launchesOne .videolist li.on .con {background: #138abd;border-radius: 50px; padding:.1rem .2rem; border: 0; justify-content: space-between;} .launchesOne .videolist li.on .con span {color: #fff;} .launchesOne .videolist li.on .con svg {width: .23rem;} .launchesOne .videolist li.on .con svg path:nth-child(1) {fill: #fff;} .launchesOne .videolist li.on .con svg path:nth-child(2) {fill: #138abd;} .launchesTwo {padding: 1rem 0;} .launchesTwo .box {display: flex; justify-content: space-between;} .launchesTwo .launchesTle {text-align: left; padding: 0;} .launchesTwo .text {margin-top: .5rem; text-align: justify;} .launchesTwo .text p {line-height: 1.8; font-size: var(--font18);color: #666666;} .launchesTwo .le {width: 48%;} .launchesTwo .imgBox {width: 43%; background: #2c4c91; border-radius: 0.2rem; overflow: hidden;} .launchesTwo .imgBox img {width: 100%; height: 100%; object-fit: cover;} .launchesThree {padding-bottom: 1rem;} .launchesThree .swiperBox1 {position: relative;} .launchesThree .swiperBox2 {position: relative;} .launchesThree .container {width: 1720px; max-width: 96%;} .luncheThreeSwiper {width: 87.2%; margin: auto; padding: 1px; box-sizing: border-box;} .luncheThreeSwiper .swiper-slide .box {cursor: pointer; border: 0.01rem solid #cccccc; border-radius: 0.1rem; box-sizing: border-box; overflow: hidden;} .luncheThreeSwiper .swiper-slide .imgBox {overflow: hidden;} .luncheThreeSwiper .swiper-slide .imgBox img {width: 100%; display: block; transition: .5s;} .luncheThreeSwiper .swiper-slide .con {padding: .3rem .1rem; box-sizing: border-box; text-align: center; color: #333333;font-weight: normal; font-weight: 700; font-size: var(--font19);} .luncheThreeSwiper .swiper-slide:hover .imgBox img {transform: scale(1.02);} .launchesThree .swiperBox .swjt {width: 0.67rem; height: 0.67rem;border: 0.01rem solid #cccccc; border-radius: 50%; transition: .5s; left: 0;} .launchesThree .swiperBox .swjt.swiper-button-next {transform: rotate(180deg); left: auto; right: 0;} .launchesThree .swiperBox .swjt:hover {background: #138ABD; border-color: #138ABD;} .launchesThree .swiperBox .swjt:hover path {fill: #fff;} .launchesFour {background: #f9f9f9; padding-bottom: 1rem;} .launchesFour .container {width: 1720px; max-width: 96%;} .launchesFour .swiperBox {position: relative;} .luncheFourSwiper {width: 88%; margin: auto; padding:.15rem; box-sizing: border-box;} .luncheFourSwiper .swiper-slide .box {cursor: pointer; background: #f8f8f8; border: 0.01rem solid #cccccc; border-radius: 0.1rem; overflow: hidden; transition: .5s;} .luncheFourSwiper .swiper-slide .imgBox {position: relative; overflow: hidden;} .luncheFourSwiper .swiper-slide .imgBox img {width: 100%; transition: .5s;} .luncheFourSwiper .swiper-slide .imgBox i { min-width: 40px;min-height: 40px; width: .7rem; height: .7rem; border-radius: .15rem; background: #FFFFFF;position: absolute; left: 50%;top: 50%;transform: translate(-50%,-50%) scale(0); z-index: 1;opacity: 0;transition: all 0.4s; transition-delay: 0.2s;} .luncheFourSwiper .swiper-slide .imgBox i svg {max-width: 50%;} .luncheFourSwiper .swiper-slide .con {padding: .3rem .1rem; box-sizing: border-box; text-align: center; color: #333333;font-weight: normal; font-weight: 700; font-size: var(--font19);} .luncheFourSwiper .swiper-slide:hover .imgBox img {transform: scale(1.02);} .luncheFourSwiper .swiper-slide .imgBox::before {content: ""; width: 100%;height: 100%;background: linear-gradient(110deg,#37a5d0 0%, #6e619a 100%);position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%) scale(0);z-index: 1;opacity: 0;transition: all 0.4s;} .luncheFourSwiper .swiper-slide:hover .imgBox::before { transform: translate(-50%,-50%) scale(1); opacity: 0.8;} .luncheFourSwiper .swiper-slide:hover .imgBox i { transform: translate(-50%,-50%) scale(1);opacity: 1;} .luncheFourSwiper .swiper-slide:hover .box {background: #ffffff; border-color: #fff; box-shadow: 0rem 0 0.1rem rgba(203,203,203,0.39); } .launchesFour .swiperBox .swjt {width: 0.67rem; height: 0.67rem;border: 0.01rem solid #cccccc; border-radius: 50%; transition: .5s; left: 0;} .launchesFour .swiperBox .swjt.swiper-button-next {transform: rotate(180deg); left: auto; right: 0;} .launchesFour .swiperBox .swjt:hover {background: #138ABD; border-color: #138ABD;} .launchesFour .swiperBox .swjt:hover path {fill: #fff;} .luncheFiveSwiper {padding:.1rem 0; max-width: 1920px; margin: auto;} .luncheFiveSwiper .swiper-wrapper {-webkit-transition-timing-function: linear;/*之前是ease-out*/-moz-transition-timing-function: linear;-ms-transition-timing-function: linear;-o-transition-timing-function: linear; transition-timing-function: linear;} .luncheFiveSwiper .swiper-slide {width: auto;} .luncheFiveSwiper .imgBox {box-shadow: 0 0 .1rem rgba(0, 0, 0,.1); border-radius: .1rem; width: 2rem; min-width: 155px; height: .9rem; min-height: 68px; padding: .2rem; box-sizing: border-box; display: flex; align-items: center; justify-content: center;} .luncheFiveSwiper .imgBox img {max-width: 100%;} .luncheFiveSwiper2 {transform:translateX(.3rem);} .launchesSix {padding-bottom: 1.5rem;} .launchesSix .container {width: 1720px; max-width: 96%;} .launchesSix .swiperBox {position: relative;} .luncheSixSwiper {padding: 1px; padding: .1rem; width: 88%; margin: auto; box-sizing: border-box;} .luncheSixSwiper .swiper-slide .box {cursor: pointer; background: #ffffff; box-shadow: 0rem 0 0.1rem rgba(203,203,203,0.17); border-radius: 0.1rem; overflow: hidden; transition: .5s;} .luncheSixSwiper .swiper-slide .imgBox {position: relative; overflow: hidden; max-height: 260px;} .luncheSixSwiper .swiper-slide .imgBox img {width: 100%; transition: .5s; object-fit: cover; height: 100%;} .luncheSixSwiper .swiper-slide .con {padding:.35rem .25rem; box-sizing: border-box;} .luncheSixSwiper .swiper-slide .time {color: #999999;font-family: Arial, Arial-Regular;} .luncheSixSwiper .swiper-slide h5 {color: #333333; font-size: var(--font18); font-weight: 700; margin-top: .2rem; transition: .35s;} .luncheSixSwiper .swiper-slide:hover h5 {color: #138ABD;} .luncheSixSwiper .swiper-slide:hover .imgBox img {transform: scale(1.05);} .launchesSix .swiperBox .swjt {width: 0.67rem; height: 0.67rem;border: 1px solid #cccccc; border-radius: 50%; transition: .5s; left: 0;} .launchesSix .swiperBox .swjt.swiper-button-next {transform: rotate(180deg); left: auto; right: 0;} .launchesSix .swiperBox .swjt:hover {background: #138ABD; border-color: #138ABD;} .launchesSix .swiperBox .swjt:hover path {fill: #fff;} .launchesSeven {background: url(../images/launchesSeven-bj.jpg) no-repeat center; background-size: cover; padding: 1.3rem 0 1.6rem; background-size: cover;} .launchesSeven .box {display: flex; justify-content: space-between;} .launchesSeven .launchesTle {padding: 0; text-align: left;} .launchesSeven .launchesTle h3 {color: #fff;} .launchesSeven .launchesTle span {color: #ffffff; font-size: var(--font18); display: block;} .launchesSeven .le .more {margin-top: .8rem;} .launchesSeven .le .more a {width: 136px;height: 45px; border: 1px solid #ffffff;border-radius: 24px; color: #fff; transition: .5s;} .launchesSeven .le .more a:hover {background: #138ABD; border-color: #138ABD;} .launchesSeven .re {width: 65%;} .launchesSeven form {display: grid; grid-template-columns: repeat(3,1fr); gap: .3rem; row-gap: .5rem; justify-content: space-between;} .launchesSeven form .col1 {position: relative;border-bottom: 1px solid rgba(255, 255, 255,.36);} .launchesSeven form .col2 {display: flex; align-items: center; justify-content: space-between;} .launchesSeven form input {background: none; border: none; color: #fff;width: 100%;outline: none;padding: 0.12rem 0; position: relative; z-index: 1;} .launchesSeven form label {font-weight: 400;color: #fff;position: absolute;top: .12rem; z-index: 0;transition: .5s;left: 0;} .launchesSeven form select { appearance: none; /*< 箭头移除 */ color: #fff; background-color: transparent;border: none;padding: .12rem 1em .12rem 0;margin: 0;width: 100%;font-family: inherit;font-size: inherit;cursor: inherit;line-height: inherit; position: relative; z-index: 1;} .launchesSeven form select::-ms-expand { display: none;/* 箭头移除 */} .launchesSeven form .col2::after {content: "";width: 9px;height: 5px;background: #FFFFFF;clip-path: polygon(100% 0%, 0 0%, 50% 100%);} .launchesSeven form select option { background: #333;} .launchesSeven form .hideInput {position: absolute; background: none; } .launchesSeven form input:focus + label {top: -.15rem; font-size: var(--font14);} .launchesSeven form input.filled + label {top: -.15rem; font-size: var(--font14);} .launchesSeven form select:focus + label {top: -.15rem; font-size: var(--font14);} .launchesSeven form select.filled + label {top: -.15rem; font-size: var(--font14);} .launchesSeven form .col3 {justify-content: flex-end;} .launchesSeven form .col3 input {position: absolute;} .launchesSeven form .subinput { grid-column: 1; position: relative; z-index: 2;} .launchesSeven form .subinput button {width: 2.56rem; height: 0.5rem; min-width: 150px;min-height: 35px; background: linear-gradient(105deg,#6b5ba0 0%, #37a5d0 100%);border-radius: 25px; color: #fff; cursor: pointer;} .launchesSeven form .subinput button:active {background: linear-gradient(105deg,#37a5d0 0%, #6b5ba0 100%);} .launchesSeven form .erro {display: none;position: absolute;left: 50%;top: 150%;transform: translate(-50%, -50%);width: 100%;height: 100%;box-sizing: border-box;border-top: 1px solid red;color: red;font-size: var(--font14);} .launchesSeven form .colcode {grid-column: 1 / 4;} .launchesSeven form .colcode img {position: relative; top:-6px;} .launchesSeven form select {color: #666;} .launchesSeven form .col1.on .erro {display: none;} /* 省市区联动 */ .docs-methods {position: relative;width: 100%;bottom: 0;} .city-picker-input {opacity: 0 !important;top: -9999px;left: -9999px; position: absolute;} .city-picker-span {position: relative;display: block;outline: 0;-webkit-tap-highlight-color: rgba(0, 0, 0, 0); background: none; color: #fff; cursor: pointer;} .city-picker-span > .placeholder {color: #fff;} .city-picker-span > .arrow {position: absolute;top: 50%;right: 8px;width: 10px;margin-top: -3px;height: 5px;background: url(../images/drop-arrow.png) -10px -25px no-repeat;} .city-picker-span.focus, .city-picker-span.open {border-bottom-color: #46A4FF;} .city-picker-span.open > .arrow {background-position: -10px -10px;} .city-picker-span > .title {white-space: nowrap; overflow-x: auto; display: inline-block; max-width: 95%; padding-right: 10px;} .city-picker-span > .title > span {color: #fff;padding: 5px;border-radius: 3px;} .city-picker-span > .title > span:hover {background-color: #f1f8ff;color: #138ABD;} .city-picker-dropdown {position: absolute; width: 315px;left: -9999px;top: -9999px;outline: 0;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);z-index: 999999;display: none;min-width: 300px;margin-bottom: 20px;} .city-select-wrap {box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);} .city-select-tab { border-bottom: 1px solid #ccc; background: #f0f0f0;font-size: 13px;} .city-select-tab > a {display: inline-block;padding: 8px 22px;border-left: 1px solid #ccc;border-bottom: 1px solid transparent;color: #4D4D4D;text-align: center; outline: 0; text-decoration: none; cursor: pointer;font-size: 14px;margin-bottom: -1px;} .city-select-tab > a.active { background: #fff;border-bottom: 1px solid #fff;color: #46A4FF;} .city-select-tab > a:first-child {border-left: none;} .city-select-tab > a:last-child.active {border-right: 1px solid #ccc;} .city-select-content {width: 100%;min-height: 10px;background-color: #fff;padding: 10px 15px;} .city-select {font-size: 13px;} .city-select dl {line-height: 2;clear: both;padding: 3px 0;margin: 0;} .city-select dt {position: absolute;width: 2.5em;font-weight: 500;text-align: right;line-height: 2;} .city-select dd {margin-left: 0;line-height: 2;} .city-select.province dd {margin-left: 3em;} .city-select a {display: inline-block;padding: 0 10px;outline: 0;text-decoration: none;white-space: nowrap;margin-right: 2px;text-decoration: none;color: #333; cursor: pointer;} .city-select a:hover, .city-select a:focus {background-color: #f1f8ff;border-radius: 2px;color: #46A4FF;} .city-select a.active {background-color: #46A4FF;color: #fff;border-radius: 2px;} /* 市场展会 */ .launchesFour2 {background: #fff;} .fairOne {padding-bottom: 1rem; background: #f9f9f9;} .fairOneSwiper .box {display: flex; background: #ffffff;border-radius: 0.2rem; overflow: hidden;} .fairOneSwiper .box .con {padding: 5% 3% 1% 3%; padding-bottom: 1rem; box-sizing: border-box; width: 40%;} .fairOneSwiper .box .con h5 {font-size: 0.36rem;color: #2067af; font-weight: 700;} .fairOneSwiper .box .con .text {color: #666666; font-size: var(--font17);line-height: 1.8; margin-top: .4rem;} .fairOneSwiper .swiper-pagination {padding-left: 3%; box-sizing: border-box; text-align: left;} .fairOneSwiper .swiper-pagination .swiper-pagination-bullet-active {background: linear-gradient(110deg,#37a5d0 0%, #6e619a 100%);} .fairOneSwiper .box .videoBox {width: 60%; position: relative; min-height: 5.5rem; background: #000; cursor: pointer;} .fairOneSwiper .box .videoBox video {width: 100%; height: 100%;} .posterBg {position: absolute; width: 100%; height: 100%; top: 0;} .posterBg::after {content: ""; position: absolute; width: 100%; height: 100%; background: #000; opacity: .5; left: 0; top: 0;} .posterBg i {display: flex; justify-content: center; align-items: center; width: 0.76rem; height: 0.76rem;background: #ffffff; border-radius: 50%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 1;} .posterBg i::after {content: ""; width: 100%; height: 100%; background: #fff; opacity: .3; position: absolute; left: 0; top: 0; border-radius: 50%; z-index: -1; animation: shubiao2 1s infinite linear .65s;} .fairTwo {margin-bottom: .5rem;} .fairTwo .container {width: 1720px; max-width: 96%;} .fairTwo .swiperBox {position: relative;} .fairTwoSwiper {width: 87.2%; margin: auto; box-sizing: border-box;} .fairTwoSwiper .box {background: #fbfbfb; padding:.3rem .2rem;} .fairTwoSwiper .imgBox img {width: 100%;} .fairTwoSwiper .con {text-align: center; color: #666; margin-top: .3rem;} .fairTwo .swiperBox .swjt {width: 0.67rem; height: 0.67rem;border: 1px solid #cccccc; border-radius: 50%; transition: .5s; left: 0;} .fairTwo .swiperBox .swjt.swiper-button-next {transform: rotate(180deg); left: auto; right: 0;} .fairTwo .swiperBox .swjt:hover {background: #138ABD; border-color: #138ABD;} .fairTwo .swiperBox .swjt:hover path {fill: #fff;} .launchesSix2 {background: #f8f8f8;} .launchesSix2 .luncheSixSwiper .con .labelBox {display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between;} .launchesSix2 .luncheSixSwiper .con .labelBox .i {padding:.07rem .2rem; box-sizing: border-box; background: #ededed;border-radius: 17px; font-size: var(--font14);color: #969696;} /* =====联系我们===== */ .contactOne .con span {font-size: var(--font19);} .contactOne .con strong {text-align: left; font-size: .52rem;} .contactOne .nypagenav {margin-top: 0;} .contactOne .nypagenav .box {justify-content: flex-end;} .contactTwo {background: #f9f9f9; } .contactTwo .box {display: flex; justify-content: space-between; padding: .9rem 0; margin-right: 1.5rem;} .contactTwo .box .tle {font-size: var(--font36);color: #333333;font-weight: 700;} .contactTwo .launchesSeven {background: none; padding: 0; width: 70%;} .contactTwo .launchesSeven form {row-gap: .6rem;} .contactTwo .launchesSeven form input {color: #666666;} .contactTwo .launchesSeven form label {color: #666666;} .contactTwo .launchesSeven form .col1 {border-color: #CCCCCC;} .contactTwo .launchesSeven form .erro {display: none; position: absolute;left: 50%; top: 150%;transform: translate(-50%, -50%); width: 100%; height: 100%;box-sizing: border-box; border-top: 1px solid red; color: red; font-size: var(--font14);} .contactTwo .launchesSeven form select {color: #666;} .contactTwo .launchesSeven form select option {background: #fff;} .contactTwo .launchesSeven form .col2::after {background: #555555;} .contactTwo .city-picker-span > .placeholder {color: #666;} .contactTwo .city-picker-span > .title > span {color: #666;} .contactTwo .city-picker-span {color: #666;} .contactTwo .coltext {grid-column: 1 / 4; border-bottom: 1px solid #CCCCCC;} .contactTwo .colcode {grid-column: 1 / 4; border-bottom: 1px solid #CCCCCC; position: relative;} .contactTwo .colcode img {width: 1.04rem; height: 0.4rem; max-height: 100%; position: absolute; right: .1rem;top: 2%; background: #dde6f7;border: 0.01rem solid #cccccc;border-radius: 21px;cursor: pointer;z-index: 1;} .contactThree {background: #f9f9f9; } .contactThree .container {border-top: 1px solid rgba(85, 85, 85,.4);} .contactThree .box {display: flex; justify-content: space-between; padding: 1rem 0;margin-right: 1.5rem;} .contactThree .box .tle {font-size: var(--font36);color: #333333;font-weight: 700;} .contactThree dl {width: 70%;} .contactThree dl dd:first-child {padding-top: .2rem;} .contactThree dl dd:last-child {border: 0;} .contactThree dl dd {padding: .4rem 0; border-bottom: 1px solid #DEDEDE; display: flex; align-items: center;} .contactThree dl dd .smtle {color: #333333; font-size: var(--font24); width: 30%; font-weight: 700;} .contactThree dl dd a:hover {color: #138ABD;} /* =====新闻资讯===== */ .newslist .newsInfo {margin-bottom: .6rem; background: #ffffff;border-radius: 0.15rem; overflow: hidden;} .newsinfoSwiper .infoBox {display: flex; justify-content: space-between;} .newsinfoSwiper .imgBox {width: 50%; overflow: hidden;} .newsinfoSwiper .imgBox img {width: 100%; height: 100%; object-fit: cover; transition: .5s;} .newsinfoSwiper .con {width: 50%; padding: .4rem; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center;} .newsinfoSwiper .con h5 {color: #333333; font-size: var(--font26); font-weight: 700; line-height: 1.3;} .newsinfoSwiper .con .text {margin-top: .4rem;} .newsinfoSwiper .con .text p {color: #555555; line-height: 1.8;} .newsinfoSwiper .con .time {margin-top: .5rem;color: #5297d2; font-family: Arial, Helvetica, sans-serif;} .newsinfoSwiper .infoBox:hover .imgBox img {transform: scale(1.05);} .newsinfoSwiper .infoBox:hover h5 {color: #138ABD;} .newsinfoSwiper .swiper-pagination {text-align: right; padding-right: .4rem;} .newsinfoSwiper .swiper-pagination span {width: 0.12rem;height: 0.12rem;background: #dadada; opacity: 1;} .newsinfoSwiper .swiper-pagination .swiper-pagination-bullet-active {background: #1484d2;} /* 详情 */ .newsDateMain {background: #f9f9f9; padding: .5rem 0 1rem 0;} .newsDateMain .container {width: 1500px;} .newsxq-box {padding: 0.5rem 0; margin-bottom: 0.44rem; display: flex; justify-content: space-between; align-items: flex-start;} .news-left {width: 68%;} .news-left .newsCon {background: #ffffff;border-radius: 10px;box-shadow: 0rem 0rem 0.4rem 0rem rgba(226,225,224,0.42); padding: .4rem; box-sizing: border-box;} .newsxq-title {border-bottom: 0.01rem solid #ddd; padding-bottom: 0.4rem;} .newsxq-title strong {display: block; font-size: 0.4rem; color: #333; font-weight: 700; margin-bottom: 0.1rem;} .newsxq-title span {display: block; font-size: var(--font16); color: #777;} .newsxq-editbox {margin: .3rem 0;} .newsxq-editbox img {max-width: 100%; height:auto !important;} .newsxq-page {display: flex; justify-content: space-between; align-items: center; margin-top: .5rem;} .newsxq-page a {display: flex; align-items: center;} .news-prev,.news-next{transition:0.6s; display: flex; align-items: center; justify-content: center; width: 0.51rem;height: 0.51rem;min-width: 35px;min-height: 35px; border: 0.02rem solid #eeeeee;border-radius: 0.05rem;} .news-prev svg {transform: rotateY(180deg); -webkit-transform: rotateY(180deg);} .newsxq-page em {display: inline-block; font-size: var(--font16); color: #333;} .prev-link em {margin-left: 0.17rem;} .next-link em {margin-right: 0.17rem;} .next-link {flex-direction: row-reverse;} .newsxq-page a:hover .news-prev,.newsxq-page a:hover .news-next {background: #5297d2; border-color: #5297d2; } .newsxq-page a:hover svg path {fill: #fff;} .newsxq-box .news-right {width: 29%;background: #fff; border-radius: 15px;box-shadow: 0rem 0rem 0.3rem 0rem rgba(226,225,224,0.42); padding: .4rem;box-sizing: border-box; position: relative;} .newsxq-box .news-right {position: sticky; top: 1.5rem;} .newsDate .relist li a {display: flex;} .newsDate .relist .reImg {width: 50%;border-radius: 5px; overflow: hidden;} .newsDate .relist .reImg img {width: 100%; height: 100%;object-fit: cover; transition: .35s;} .newsDate .relist .recon {margin-left: .2rem; width: 50%;} .newsDate .relist li {margin-top: .3rem;} .newsDate .relist span {color: #999999; font-size: var(--font14);} .newsDate .relist h6 {color: #333333; font-size: var(--font18);font-weight: 700; transition: .35s;} .newsDate .relist li:hover h6 {color: #5297d2;} .newsDate .relist li:hover .reImg img {transform: scale(1.05);} .newsDate .news-right::after {content: ""; background: #5297d2; width: 65%; position: absolute; left: 50%; bottom: -1%; height: .07rem; border-radius: 4px; transform: translate(-50%, -50%);} /* =====招贤纳士==== */ .carer-banner {height: 100vh; overflow: hidden;position: relative;} .carer-banner .bjBox {position: absolute; width: 100%; height: 100%; left: 0; top: 0;z-index: -1;} .carer-banner .pub_img {position: absolute; width: 100%; height: 100%; background: url(../images/carerOne-bj.jpg) no-repeat center;background-size: cover;background-attachment: fixed;} .carer-banner .tit img {max-width: 100%;height:0.6rem} .carer-banner .container {height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;} .carer-banner .container span {font-size: var(--font33);color: #ffffff; margin-top: .2rem;} .about-abnner .pub_img { background: url(../images/about-banner.jpg) no-repeat center;background-size: cover;background-attachment: fixed;} .wrapBanner {display: none;} /* 向下箭头 */ .banner_mouse {display: block;position: absolute;bottom: .20rem; left: 50%; transform: translateX(-50%); z-index: 2;} .banner_mouse img {max-width: 100%;} .banner_mouse .arrow {width: .20rem;height: .20rem;display: block;border-bottom: .03rem solid #fff;border-right: .03rem solid #fff;transform: rotate(45deg);position: relative;margin: 0 auto;-webkit-animation: arrowAnim 1.2s infinite;animation: arrowAnim 1.2s infinite;} .banner_mouse .arrow.arrow-01 {-webkit-animation-delay: 0.2s; animation-delay: 0.2s;} .banner_mouse .arrow.arrow-02 {margin-top: -0.04rem;-webkit-animation-delay: 0.4s;animation-delay: 0.4s;} @keyframes arrowAnim {0% {opacity: 0;}50% { opacity: 1;}100% { opacity: 0;}} .carerOne {padding: 1rem 0 1.4rem 0;} .carerOne .tle {text-align: center;font-size: 0.52rem;color: #333333; font-weight: 700;} .carerOne ul {display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: .4rem;} .carerOne ul li {width: 23%; margin-top: .3rem; position: relative;z-index: 1; background: #ffffff; border: 1px solid rgba(255,255,255,0.19); border-radius: 5px; box-shadow: 0rem 0rem 0.24rem 0rem rgba(103,103,103,0.16); overflow: hidden;} .carerOne ul li .icBox{height:.5rem} .carerOne ul li .icBox img {max-height: 100%;} .carerOne ul li .bjBox {position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: -1; opacity: 0; visibility: hidden; transition: .3s;} .carerOne ul li .bjBox img {width: 100%; height: 100%; object-fit: cover; transform: scale(1.8); transition: .5s;} .carerOne ul li a { padding: .4rem; box-sizing: border-box;} .carerOne ul li b {color: #333333; font-size: var(--font26);font-weight: 700; margin-top: .12rem; display: block; transition: .5s;} .carerOne ul li .jt {width: 0.36rem;height: 0.36rem;min-width: 25px; min-height: 25px; background: #138abd; border-radius: 50%;} .carerOne ul li .jt svg {margin-right: .05rem;} .carerOne ul li:hover .bjBox {opacity: 1; visibility: visible;} .carerOne ul li:hover .bjBox img {transform: scale(1);} .carerOne ul li:hover .icBox img {filter: brightness(100); -webkit-filter:brightness(100);} .carerOne ul li:hover b {color: #fff;} .carerTwo ul {display: flex; flex-wrap: wrap;} .carerTwo ul li {width: 50%; position: relative; padding: 1.4rem .5rem; box-sizing: border-box; text-align: center; min-height: 6.25rem;} .carerTwo ul li .icBox {height: 1rem;} .carerTwo ul li .icBox img {max-height: 100%; object-fit: contain; transition: .5S;} .carerTwo ul li .bjBox {position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: -1; overflow: hidden;} .carerTwo ul li .bjBox img {width: 100%; height: 100%; object-fit: cover; transition: .5s;} .carerTwo ul li h4 {font-size: 0.42rem;color: #ffffff; margin-top: .3rem; font-weight: 700;} .carerTwo ul li .tle i {display: inline-block;width: 0.33rem; height: 0.05rem; background: #ffffff;border-radius: 0.03rem; margin-top: .2rem;} .carerTwo ul li .text {opacity: 0;visibility: hidden; pointer-events: none; -webkit-transition: all .6s ease; transition: all .6s ease;} .carerTwo ul li .text p {color: #ffffff; line-height: 1.8; width: 65%; margin: auto;} .carerTwo ul li:hover .text {margin-top: .3rem;opacity: 1; visibility: visible;pointer-events: all;} .carerTwo ul li:hover .bjBox img {transform: scale(1.05);} .carerTwo ul li:hover .icBox img {transform: rotateY(180deg);} .carerThree {padding-bottom: 1.5rem;} .carerThree .tle {text-align: center;font-size: 0.52rem;color: #333333; font-weight: 700; padding: .8rem 0;} .carerThree ul {display: grid;grid-template-columns: 27% 16% 27% 27%; gap: .13rem;} .carerThree ul li {height: 360px;border-radius: .1rem; overflow: hidden;} .carerThree ul li img {width: 100%; height: 100%; object-fit: cover; transition: .5s;} .carerThree ul li:nth-child(1) {grid-column: 1 / 3;} .carerThree ul li:nth-child(5) {grid-column: 2 / 4;} .carerThree ul li:hover img {transform: scale(1.05);} /* =====产品详情===== */ .proDateBanner {position: relative;} .proDateBanner .bjBox {position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: -1;} .proDateBanner .box {padding: 3rem 0;} .proDateBanner .box h2 {font-size: 0.74rem;color: #ffffff; font-weight: 700;} .proDateBanner .box .text {font-size: 0.33rem; color: #fff; margin-top: .15rem;} .proDateBanner .box .videoBtn {margin-top: .5rem; display: inline-block;} .proDateBanner .box .videoBtn i {display: flex; justify-content: center; align-items: center; width: 0.76rem; height: 0.76rem;background: #ffffff; border-radius: 50%; position: relative; z-index: 1;} .proDateBanner .box .videoBtn i::after {content: ""; width: 100%; height: 100%; background: #fff; opacity: .3; position: absolute; left: 0; top: 0; border-radius: 50%; z-index: -1; animation: shubiao2 1s infinite linear .65s;} .proDateBanner .box .videoBtn i img {max-width: 20%;} .propollTle {text-align: center; padding: 0.5rem 0;} .propollTle h3 {font-size:0.5rem;color: #ffffff; font-weight: 700;} .propollTle span {color: #ffffff; font-size: var(--font26); display: block;} .prodollOne {position: relative; background: url(../images/prodollOne-bj.jpg) no-repeat center; background-size: cover; padding-bottom: 1.7rem; background-position-x: 100%;} .prodollOne .container {width: 1350px;} .prodollOne ul {display: flex; flex-wrap: wrap; justify-content: center; overflow: hidden; } .prodollOne ul li {text-align: center; width: calc(100% / 3); border-top: 1px solid rgba(168, 168, 168,.36); border-right: 1px solid rgba(168, 168, 168,.36); margin-top: -2px; transform: translateX(2px);} .prodollOne ul li {padding: 0 .2rem .5rem .2rem; box-sizing: border-box; position: relative;} .prodollOne ul li:nth-child(n+4) {padding-top: .5rem; padding-bottom: 0;} .prodollOne li .smtit {color: #ffffff; font-size: var(--font26);} .prodollOne li .disc {display: flex; justify-content: center; font-size: 0.3rem;color: #ffffff; align-items: flex-end; margin-top: .2rem;} .prodollOne li .disc .counter { font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;font-weight: 400; font-size: .66rem; line-height: .66rem; margin-right: .1rem;} .prodollOne li:nth-child(1)::after {content: "";width: .2rem; height: .2rem;position: absolute; left: calc(100% + 0.5px); top: calc(100% - 1.5px); transform: translate(-50%, -50%); background: url(../images/jiahao.png) no-repeat center; background-size: contain;} .prodollOne li:nth-child(2)::after {content: "";width: .2rem; height: .2rem;position: absolute; left: calc(100% + 0.5px); top: calc(100% - 1.5px); transform: translate(-50%, -50%); background: url(../images/jiahao.png) no-repeat center; background-size: contain;} .prodollTwo {background: url(../images/prodollTwo-bj.jpg) no-repeat center; background-size:cover; padding-bottom: .5rem;} .prodollTwo .box {display: flex; justify-content: center;} .prodollTwo .imgBox {display: inline-block; position: relative;} .prodollTwo .imgBox > img {width: 8.03rem; max-width: 100%; } .prodollTwo .imgBox .wrapImg {display: none;} .prodollTwo ul li {position: absolute;left: 0; top: 0;} .prodollTwo ul li img {width: 3.1rem; max-width: 100%;} .prodollTwo ul li i {width: .13rem; height: .13rem; border-radius: 50%; background: #f9ff00; position: absolute; left: 0;top: 100%;transform: translate(-50%, -50%); z-index: 1;} .prodollTwo ul li i::after {cursor: pointer;content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 223%;height: 223%;background:#f9ff00;border-radius: 50%;opacity: 0.6;animation: breath .6s linear .5s infinite alternate; } @keyframes breath { 0% { opacity: 0.6; } 100% { opacity: 0; }} .prodollTwo ul li .con {position: absolute; left: 100%; top: -.15rem; transform: translate(0%, 0); white-space: nowrap;} .prodollTwo ul li .con .smtit {font-size: 0.32rem;color: #4988ff; padding-left: .1rem; border-left: .05rem solid #4988ff; line-height: 1;} .prodollTwo ul li .con .text {color: #ffffff; font-size: .22rem; padding-left: .1rem; margin-top: .1rem;} .prodollTwo ul li .con .text span {display: block;} .prodollTwo ul li .hide {opacity: 0; visibility: hidden; transition: .5s; position: relative; z-index: -1;} .prodollTwo ul li.line i {top: 50%;} .prodollTwo ul li.line .con {top: -0.025rem;} .prodollTwo ul.left li .roteBox {transform: rotateY(180deg);} .prodollTwo ul.left li .con {transform: translate(100%, 0) rotateY(180deg); left: auto; right: -2%;} .prodollTwo ul.left li .con .smtit {display: inline-block;} .prodollTwo ul.left .con .text {position: absolute;} .prodollTwo ul.left li .hide {transform: translateX(30%);} .prodollTwo ul.left li i:hover + .hide {transform: translateX(0); opacity: 1; visibility: visible;} .prodollTwo ul.right li .hide {transform: translateX(30%); z-index: 0;} .prodollTwo ul.right li i:hover + .hide {transform: translateX(0); opacity: 1; visibility: visible;} .prodollTwo ul.left li:nth-child(1) {top: 21.25%; left: 11.25%;} .prodollTwo ul.left li:nth-child(2) {top: 31.9%; left: 11.25%;} .prodollTwo ul.left li:nth-child(3) {top: 48%;left: -5%;} .prodollTwo ul.right li:nth-child(1) {top: -2%;left: 47%;} .prodollTwo ul.right li:nth-child(2) {top: 12%;left: 43%;} .prodollTwo ul.right li:nth-child(3) {top: 27%;left: 43%;} .prodollTwo ul.right li:nth-child(4) {top: 43%;left: 58.8%;} .prodollTwo ul.right li:nth-child(5) {top: 64%;left: 60%;} .prodollThree {background: #242426; padding-bottom: 1.5rem;} .prodollThree .container {width: 1360px;} .prodollThree li {margin-top: .6rem; display: flex; justify-content: space-between; align-items: center;} .prodollThree li .imgBox {border-radius: 0.5rem; overflow: hidden; width: 42%;background: rgba(245, 248, 250,.05); display: flex; align-items: center; justify-content: center;} .prodollThree li .imgBox img {width: 100%; min-height: 3.5rem; object-fit: cover;} .prodollThree li .con {width: 46%;} .prodollThree li h5 {color: #ffffff; font-size: var(--font36); font-weight: 700;} .prodollThree li p {margin-top: .2rem;color: #ffffff; font-size: var(--font17);opacity: .85;} .prodollThree li:nth-child(even) .con {order: -1;} .prodollFour {margin-bottom: 1rem;} .prodollFour .propollTle {padding-bottom: .5rem;} .prodollFour .propollTle h3 {color: #333333; font-size: .52rem;} .prodollFourSwiper {padding:.3rem .2rem;padding-bottom: 1rem; } .prodollFourSwiper .imgBox {box-shadow: 0 0 .1rem rgba(0, 0, 0,.1); border-radius: .1rem; height: .9rem; min-height: 68px; padding: .2rem; box-sizing: border-box; display: flex; align-items: center; justify-content: center;} .prodollFourSwiper .imgBox img {max-width: 100%; object-fit: contain;} .prodollFourSwiper .swiper-pagination .swiper-pagination-bullet-active {background: linear-gradient(110deg,#37a5d0 0%, #6e619a 100%);} .prodollFive {background: url(../images/prodollFive-bj.jpg) no-repeat center; background-size: cover;} /* 商用清洁机器人 */ .clean-banner .box {position: relative;} .clean-banner .imgBox {position: absolute; z-index: -1; left: 106%; top: 62%; transform: translate(-100%, -50%); width: 59%; display: flex; justify-content: center; align-items: center;} .clean-banner .imgBox img {width: 8.5rem; max-width: 100%;} .clean-banner .box h2 {color: #333;} .clean-banner .box .text {color: #333;} .cleanMain .propollTle h3 {color: #333;} .cleanOne {padding:1.2rem 0 .8rem 0;} .cleanOne .propollTle {opacity: 0;} .cleanOne .propollTle h3 {} .cleanOne .propollTle2 { padding: 0; text-align: left;opacity: 1;} .cleanOne .box {display: flex; justify-content: space-between;} .cleanOne .box .imgBox {width: 30%; display: flex; align-items: center; justify-content: center;} .cleanOne .box .imgBox img {max-width: 100%;} .cleanOne .con {width: 64%; position: relative;} .cleanOne .con .text p {color: #666666; font-size: var(--font17); line-height: 1.8;} .cleanOne ul {margin-top: .8rem; display: flex; flex-wrap: wrap; justify-content: space-between;overflow: hidden; } .cleanOne ul li {text-align: center; width: calc(100% / 4); border-top: 1px solid #E7E7E7; border-right: 1px solid #E7E7E7; margin-top: -2px;} .cleanOne ul li {padding: 0 .2rem .5rem .2rem; box-sizing: border-box; position: relative;} .cleanOne ul li .num {color: #2064ca;font-weight: 400;} .cleanOne ul li .num > div {display: inline-block;} .cleanOne ul li .num .counter {font-size: 0.55rem; font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;} .cleanOne ul li .num .fon36 {font-size: .3rem;} .cleanOne ul li .num .fon36 sup {font-size: .2rem;} .cleanOne ul li .disc {font-size: var(--font18);color: #333333;} .cleanOne ul li:nth-child(4) {border-right: 0;} .cleanOne ul li:nth-child(8) {border-right: 0;} .cleanOne ul li:nth-child(n+5) {padding-top: .5rem; padding-bottom: 0;} .cleanOne ul li:nth-child(1)::after {content: "";width: .2rem; height: .2rem;position: absolute;z-index: 2;left: calc(100% + 1px); top: calc(100% - 1px); transform: translate(-50%, -50%); background: url(../images/jiahao.png) no-repeat center; background-size: contain;} .cleanOne ul li:nth-child(2)::after {content: "";width: .2rem; height: .2rem;position: absolute;z-index: 2;left: calc(100% + 1px); top: calc(100% - 1px); transform: translate(-50%, -50%); background: url(../images/jiahao.png) no-repeat center; background-size: contain;} .cleanOne ul li:nth-child(3)::after {content: "";width: .2rem; height: .2rem;position: absolute;z-index: 2;left: calc(100% + 1px);top: calc(100% - 1px); transform: translate(-50%, -50%); background: url(../images/jiahao.png) no-repeat center; background-size: contain;} .cleanTwo {background: url(../images/cleanTwo-bj.jpg) no-repeat center; background-size: cover; padding-bottom: 1rem;} .cleanTwo ul {display: flex; justify-content: space-between;} .cleanTwo ul li {width: 31%; background: #fff; padding: .8rem; padding-left: .5rem; padding-right: .25rem; box-sizing: border-box;border-radius: 0.3rem 0rem 0.3rem 0rem; transition: .5s;} .cleanTwo ul li .icBox img {transition: .5s; max-width: .65rem;} .cleanTwo li h5 {color: #0b0b0b; font-size: var(--font36); font-weight: 700; margin-top: .25rem;} .cleanTwo li dl {margin-top: .4rem;} .cleanTwo li dd {position: relative; margin-top: .1rem;color: #666666; font-size: var(--font17); padding-left: .2rem;} .cleanTwo li dd::before {position: absolute; left: 0; top: 50%; transform: translate(-50%, -50%); content: "";width: 0.07rem;height: 0.07rem;background: #050001; border-radius: 50%;} .cleanTwo li:hover {transform: translateY(-.1rem);} .cleanTwo li:hover .icBox img {transform: rotateY(180deg);} .cleanTwo .propollTle {padding-bottom: .6rem;} .cleanTwoSwiper1 {padding-bottom: 5px;} .cleanTwoSwiper1 .swiper-wrapper {justify-content: center;} .cleanTwoSwiper1 .swiper-slide {width: auto; padding: 0 .5rem; cursor: pointer; box-sizing: border-box; color: #333; font-size: var(--font28); line-height: 1.2; font-weight: 700;} .cleanTwoSwiper1 .swiper-slide.swiper-slide-thumb-active {color: #37A5D0; @supports (-webkit-background-clip: text) or (background-clip: text) { background: linear-gradient(to right, #6e619a, #37A5D0);-webkit-background-clip: text;background-clip: text;color: transparent; } } .cleanTwoSwiper1 .swiper-slide {border-left: 1px solid #95979a;} .cleanTwoSwiper1 .swiper-slide:first-child {border-left: 0;} .cleanTwo .swiperBox {margin-top: 1rem;} .cleanTwoSwiper2 {width: 90%; position: static;} .cleanTwoSwiper2 .swiper-slide {padding: .5rem; text-align: center;} .cleanTwoSwiper2 .swiper-slide .icBox {height:1rem; display: flex; align-items: center; justify-content: center; margin-bottom: 0.3rem;} .cleanTwoSwiper2 .swiper-slide .icBox img {max-width: 50%; max-height: 100%;} .cleanTwoSwiper2 .swiper-slide b {color: #333333; font-weight: 700; font-size: .3rem; display: block; margin-top: .2rem; } .cleanTwoSwiper2 .swiper-slide span {font-size: var(--font18); color: #333;display: block;} .cleanTwo .swiperBox .swjt {flex-wrap: wrap; right: 1%; width: 50px; height: 60px;} .cleanTwo .swiperBox .swjt .i1 {width: 30px;height: 30px;opacity: .86; display: block; background: #b6b6b6; -webkit-clip-path: polygon(0 0, 30% 0, 100% 100%, 70% 100%); clip-path: polygon(0 0, 30% 0, 100% 100%, 70% 100%); transition: .5s;} .cleanTwo .swiperBox .swjt .i2 {transform: rotateX(-180deg); width: 30px;height: 25px; position: relative; left: 20%; opacity: 1; display: block; background: linear-gradient(105deg,#37a5d0 0%, #6b5ba0 100%); -webkit-clip-path: polygon(0 0, 30% 0, 100% 100%, 70% 100%); clip-path: polygon(0 0, 30% 0, 100% 100%, 70% 100%); transition: .5s;} .cleanTwo .swiperBox .swjt:hover .i1 {background: linear-gradient(105deg,#37a5d0 0%, #6b5ba0 100%);} .cleanTwo .swiperBox .swjt:hover .i2 {left: 0; height: 30px;} .cleanTwo .swiperBox .swjt.swiper-button-prev {transform: rotateY(180deg); left: 1%;} .cleanTwo .swiperBox .swiper-pagination {display: none;} .cleanTwo .swiperBox .swiper-pagination .swiper-pagination-bullet-active {background: linear-gradient(105deg,#37a5d0 0%, #6b5ba0 100%);} .cleanThree {background: url(../images/cleanThree-bj.jpg) no-repeat center; background-size: cover; padding-bottom: 1.2rem;} .cleanThree .propollTle {padding-bottom: .4rem;} .cleanThree .propollTle h3 {color: #fff;} .cleanThree .container {width: 1350px; max-width: 80%;} .cleanThree .text {text-align: center; width:88%; margin: auto;color: #ffffff; font-size: var(--font17);} .cleanThree .box {margin-top: 1.4rem; display: flex; justify-content: space-between; position: relative;} .cleanThree .box dl {background: rgba(18, 43, 73,.13);border-radius: 0.1rem; width: 42%; padding: .6rem .5rem; padding-bottom: .4rem; box-sizing: border-box;} .cleanThree .box .imgBox {position: absolute; left: 52%; top: 50%; transform: translate(-50%, -50%);} .cleanThree .box .imgBox img {width: 3.69rem; max-width: 100%;} .cleanThree .left dd {margin-top: .2rem;} .cleanThree .left dd:first-child {margin-top: 0;} .cleanThree .left span {color: #ffffff; font-size: var(--font17); opacity: .78; display: block;} .cleanThree .left b {color: #ffffff; font-weight: 400; font-size:.25rem;} .cleanThree .box .right {padding-left: 10%;} .cleanThree .right dd {display: flex; align-items: center; margin-top: .8rem;} .cleanThree .right dd:first-child {margin-top: 0;} .cleanThree .right .con {margin-left: .2rem;} .cleanThree .right .icBox {max-width: 50px;} .cleanThree .right .icBox img {max-width:100%} .cleanThree .right h5 {font-size: var(--font24); color: #fff; font-weight: 700;} .cleanThree .right span {color: #ffffff;opacity: 0.71;} .cleanFour {margin-bottom: 1rem;} .cleanFive {background: #f5f8fa; padding-bottom: 1rem;} .cleanFive .propollTle {padding-bottom: .4rem;} .cleanFiveSwiper {background: #fff; border-radius: .1rem; box-sizing: border-box;} .cleanFiveSwiper .box {display: flex; } .cleanFiveSwiper .con {width: 50%; padding: 1rem .6rem; box-sizing: border-box;} .cleanFiveSwiper .con h5 {font-size: var(--font30); font-weight: 700;} .cleanFiveSwiper .con .text {color: #666;margin-top: .2rem; line-height: 1.8;} .cleanFiveSwiper .con .more {margin-top: .5rem;} .cleanFiveSwiper .imgBox {width: 50%; overflow: hidden;} .cleanFiveSwiper .imgBox img {height: 5rem; min-height: 100%; object-fit: cover; width: 100%;} .cleanFiveSwiper .swiper-pagination {width: 50%; text-align: right; padding-right: .6rem; bottom: 1rem;} .cleanFiveSwiper .swiper-pagination span {background: #e2e9ed; opacity: 1;} .cleanFiveSwiper .swiper-pagination .swiper-pagination-bullet-active {background: linear-gradient(110deg,#37a5d0 0%, #6e619a 100%);} .launchesMain1{margin:0.6rem auto} /* 解决方案 */ .soul-banner .container span {text-align: center;} .soulMain .tle {text-align: center;font-size: 0.52rem; color: #333333; font-weight: 700;padding:0.7rem 0 .5rem 0;} .soulOne {padding: .5rem 0 1rem 0;} .soulOne ul {display: flex; justify-content: space-between;} .soulOne li {margin-top: .5rem; width: calc(100% / 3); padding:0 .3rem; text-align: center;} .soulOne li strong {display: block; color: #111111; font-size: var(--font26);} .soulOne li span {display: block;color: #666666; margin-top: .1rem;} .soulTwo {background: #f5f5f5; padding-bottom: 0.5rem;} .soulTwo ul {display: flex; justify-content: center;flex-wrap: wrap;} .soulTwo li {width: 34%; text-align: center;} .soulTwo li .imgBox {display: flex; align-items: center; justify-content: center;mix-blend-mode: multiply; height: 4rem;} .soulTwo li .imgBox img {max-width: 100%; max-height: 100%;} .soulTwo li .tit {color: #333; font-size: var(--font24); margin-top:.2rem;} .soulTwo li .text {margin-top: .1rem;} .soulTwo li .text span {color: #939393; display: block;} .soulTwo li:last-child .imgBox {mix-blend-mode:initial;} .soulFour {background: #fff; padding-bottom: .5rem;} .soulFour .imgBox img {max-width: 100%;} @media screen and (min-width: 200px) and (max-width: 1024px) { .soulOne li {padding:0 .1rem; } .soulOne li strong {font-size: var(--font20);} } @media screen and (min-width: 200px) and (max-width: 960px) { .soulTwo li {width: 48%; margin-bottom: .5rem;} } @media screen and (min-width: 200px) and (max-width: 767px) { .carer-banner .container span {font-size: var(--font20);} .soulOne ul {flex-wrap: wrap;} .soulOne li {margin-top: .5rem; width: 100%;} } @media screen and (min-width: 200px) and (max-width: 640px) { /* 解决方案 */ .soulTwo li {width: 42%;} } /*===================24/8/15日更新===========================*/ .fole .links {display:none;} .foternav {margin-left:0;width:45%;} .backTop {display: flex;justify-content: flex-end; transform: translateY(.8rem);} .backTop #backTop {width: 0.5rem;height: 0.5rem; min-width: 40px;min-height: 40px;background: rgba(255, 255, 255, 0.1); border-radius: 50%;transition: .5s;display: flex;align-items: center;justify-content: center; cursor:pointer;} .backTop #backTop svg {max-width:70%;} .backTop #backTop svg path {transition: .5s;} .backTop #backTop:active {background: #0A6FB7;} .backTop #backTop:active svg path {fill: #fff;} @media (any-hover: hover) { .backTop #backTop:hover {background: #0A6FB7;} .backTop #backTop:hover svg path {fill: #fff;} } .heTel {display: flex; align-items: center; margin-right: 0.6rem;} .heTel i {margin-right: .1rem;} .heTel strong {color: #fff; font-size: .24rem; transition: .5s;} .header.fh .heTel i svg path {fill: #333;} .header.fh .heTel strong {color: #333;} /* 底部 */ /*.foternav {width: 45%;margin-left: 0;}*/ .foterBox .fole {max-width: 30%;} .foternav dl:first-child {width:45%;} .foternav dl:first-child .ddbox {display: flex;justify-content: space-between;flex-wrap: wrap; width: 150%;} .foternav dl:first-child .ddbox dd {width:48%;} .foternav dl {width:14%;} .foterUs .tle {color: #ffffff;font-weight: 700;} .foterUs .telBox {display: flex;margin-top: 0;} .foterUs .telBox i {width: .5rem; height: .5rem; border-radius: 50%; border: 1px solid #5a5b5d;} .foterUs .telBox .flexcen {margin-right: .2rem;} .foterUs .telBox .flexcen svg {max-width:60%;} .foterUs .telBox strong {font-size: .24rem; color: #fff;} .foterUs .telBox .time {font-size: var(--font14); color: #fff; opacity: .28;} .foterBox .links ul {margin-top: .4rem;} @media screen and (min-width: 200px) and (max-width: 1200px) { .foterBox {flex-wrap:wrap;} .footer .foternav {width:60%;} .foterUs {margin-top: .5rem;} .foterUs .telBox i {width: .8rem;height: .8rem;} .foterUs .telBox strong {font-size: var(--font30);} .foterBox .links ul li:hover .wxCode {visibility: hidden; opacity:0;top:150%;} .foterUs {width:100%;} } @media screen and (min-width: 200px) and (max-width: 767px) { .foterBox .fole {max-width: 100%;} .heTel {display: none;} .foterBox .foternav dl:first-child {width:100%;} .foterBox .foternav dl:first-child .ddbox {display:none;width:100%;} .foterBox .foternav dl:first-child .ddbox dd {width:100%;} } /*===================24/12/30日更新===========================*/ .soulSix {padding: 3rem 0 2rem;} .soulSix .box {display: flex; justify-content: center;} .soulSix .box .sjxBox {display: inline-block; position: relative;} .soulSix .box .sjxBox > img {width: 100%; max-width: 6rem;} .soulSix .box li {} .soulSix .box li .liBox {position: absolute;} .soulSix .box li .cir {width: 2.15rem; height: 2.15rem; border-radius: 50%; background: #f9f9f9; display: flex; flex-direction: column; align-items: center; justify-content: center;} .soulSix .box li .cir .icBox img {max-width: .7rem;} .soulSix .box li .cir span {font-size: .3rem; margin-top: .2rem; font-weight: 700;} .soulSix .box li .text {position: absolute; white-space: nowrap;} .soulSix .box li .text span {display: block;font-size: var(--font20); color: #666666; margin: .05rem 0;} .soulSix .box li.li1 .liBox {top: -.2rem; left: 50%; transform: translateY(-100%) translateX(-50%); display: flex; align-items: center;} .soulSix .box li.li1 .text {transform: translateX(100%);padding-left: .3rem; right: 0;} .soulSix .box li.li2 .liBox {left: -.1rem; bottom: 0; transform: translateY(50%) translateX(-100%);} .soulSix .box li.li2 .text {text-align: center; transform: translateY(-100%); padding-bottom: .4rem;} .soulSix .box li.li3 .liBox {right: -.1rem; bottom: 0; transform: translateY(50%) translateX(100%);} .soulSeven {background: #f5f5f5; padding-bottom: 1rem;} .soulSeven .box {padding: 0 10%; box-sizing: border-box;} .soulSeven ul {display: flex; justify-content: space-between; flex-wrap: wrap;} .soulSeven li {width: 48%; text-align: center;} .soulSeven li .imgBox {display: flex; align-items: center; justify-content: center;mix-blend-mode: multiply; height: 4.2rem;} .soulSeven li .imgBox img {max-width: 100%; max-height: 100%;} .soulSeven li .tit {color: #333; font-size: var(--font24); margin-top: .1rem;} .soulSeven li .text {margin-top: .1rem;} .soulSeven li .text span {color: #939393; display: block;} .soulThre {padding-bottom: 1rem;} .soulThre .imgBox img {max-width: 100%;} .soulThre .box>ul {display: flex; justify-content: space-between; flex-wrap: wrap;} /* 整个滚动条 */ .soulThre li .tit ul::-webkit-scrollbar {width: 3px; /* 宽度 */height: 3px; /* 高度 */} /* 滚动条轨道 */ .soulThre li .tit ul::-webkit-scrollbar-track { background: #f1f1f1; /* 颜色 */border-radius: 5px; /* 圆角 */} /* 滚动条的滑块 */ .soulThre li .tit ul::-webkit-scrollbar-thumb {background: #3AA1CE; /* 颜色 */border-radius: 10px; /* 圆角 */} /* 滑块hover效果 */ .soulThre li .tit ul::-webkit-scrollbar-thumb:hover {background: #3AA1CE; /* 颜色 */} .soulThre .box>ul>li {width: 48%; text-align: center;display:flex;align-items: center;} .soulThre li .imgBox {display: flex;align-items: center;justify-content: center;} .soulThre li .tit{text-align:left;} .soulThre li .tit h2{font-size:0.36rem;font-weight:600} .soulThre li .imgBox img {max-width: 100%; max-height: 100%;} .soulThre li .tit {color: #333;font-size: var(--font24);margin-left: 5%;} .soulThre li .tit ul{height:250px;overflow-y:auto;margin-top:0.2rem;padding-right:0.2rem} .soulThre li .tit ul li{font-size:16px;color:#666;text-align: left;line-height:35px;} .soulThre li .tit ul li:before{content:'·';font-size:20px;font-weight:bold;} .soulEight {background: url(../images/soulImg/soulEight-bj.jpg) no-repeat center; background-size: cover; padding-bottom: 2rem;} .soulEight .listInfo ul {display: flex; justify-content: space-between;} .soulEight .listInfo li {width: auto; padding: 0 .2rem; text-align: center;} .soulEight .listInfo li:last-child {width: 25%;} .soulEight .listInfo li .icBox {height: .6rem; display: flex; align-items: center; justify-content: center;} .soulEight .listInfo li .icBox img {max-width: 100%;} .soulEight .listInfo li span {display: block; font-size: var(--font15);} .soulEight .listInfo li .tit {font-size: var(--font24); margin-top: .3rem;} .soulEight .listInfo li .text {margin-top: .3rem;} .soulEight .process {background: #fff; margin-top: .8rem; padding: .5rem 1rem; box-sizing: border-box; border-radius: .2rem; overflow: hidden;} .soulEight .process .cessText {font-size: var(--font20); color: #333;} .soulEight .process ul {display: flex; flex-wrap: wrap; justify-content: space-between; position: relative;} .soulEight .process li {margin-top: .8rem;width: 26%;} .soulEight .process li span {display: block; text-align: center; font-size: var(--font18);margin-top: .1rem;} .soulEight .process li .num {font-size: .3rem; width: .68rem; height: .68rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #b1c0cf; color: #fff; flex-shrink: 0;} .soulEight .process li:nth-child(odd) .imgBox {border-radius: 22px;box-shadow: 0px 0px 18.6px 1.4px rgba(161, 161, 161, 0.08); overflow: hidden;} .soulEight .process li:nth-child(odd) .imgBox img {max-width: 100%;} .soulEight .process li:nth-child(even) {display: flex; align-items: center; width: 10%; margin-left: -.8rem;} .soulEight .process li:nth-child(even) img {max-width:80%;} .soulEight .process .ul1 li.li6 .num {transform: rotate(-90deg);} .soulEight .process .ul1 li.li6 {position: absolute; right: -.3rem; top: 85%; transform: rotate(90deg); margin: 0;} .soulEight .process .ul2 {margin-top: 1rem;} .soulEight .process .ul2 li {width: 10%;display: flex; align-items: center;} .soulEight .process .ul2 li .num {order: 1;} .soulEight .process .ul2 li.li6 {margin: 0; position: absolute !important; top: 50%; transform: translateY(-50%) translateX(-25%); padding-bottom: .3rem;} .soulEight .process .ul2 li:nth-child(even) {margin-right: -.8rem; position: relative; margin-top: 0; margin-bottom: .3rem; z-index: 2;} .soulEight .process .ul2 li:nth-child(even) img {transform: rotate(180deg); max-width: 80%;} .soulEight .process .ul2 li:nth-child(odd) {width: 26%; display: block; margin: 0;} .soulEight .process .ul2 li:nth-child(odd) .imgBox {border-radius: 22px;box-shadow: 0px 0px 18.6px 1.4px rgba(161, 161, 161, 0.08); overflow: hidden;} .soulEight .process .ul2 li:nth-child(odd) img {width: 100%; max-width: 100%;} .soulEight .process .ul2 li:nth-child(1) {order: 8;} .soulEight .process .ul2 li:nth-child(2) {order: 7;} .soulEight .process .ul2 li:nth-child(3) {order: 6;} .soulEight .process .ul2 li:nth-child(4) {order: 5;} .soulEight .process .ul2 li:nth-child(5) {order: 4;} .soulEight .process .ul2 li:nth-child(6) {order: 3;} /* 数据服务 */ .daasMain .tle {text-align: center;} .daasMain .tle span {display: block;font-size: .52rem; font-weight: 700; line-height: 1.2;} .daas-banner .tit img {height: .8rem;} .daasOne {padding: 1rem 0 .5rem;} .daasOne ul {display: flex;justify-content: space-between; max-width: 75%; margin: auto; margin-top: 1rem; margin-bottom: .6rem;} .daasOne li {text-align: center;} .daasOne li .icBox {height: .6rem; display: flex; align-items: center; justify-content: center;} .daasOne li .icBox img {max-width: 100%; max-height: 100%;} .daasOne li span {font-size: var(--font30); margin-top: .1rem; display: block;} .daasOne video {max-width: 100%; display: block;} .dassTwo {position: relative; overflow: hidden;} .dassTwo {padding: 2.5rem 0 1.5rem;} .dassTwo .swiperBox {position: relative;} .dassTwo .swiper2 {overflow: visible;} .dassTwo .swiper2 .slide {width: 27%; transform: scale(1);} .dassTwo .swiper2 .slideBox {overflow: hidden; border-radius: .25rem;} .dassTwo .swiper2 .imgBox img {width: 100%; height: 100%; object-fit: cover; min-height: 3.63rem;} .dassTwo .swiper2 .slide.swiper-slide-active {transform: scale(1.5); z-index: 2;} .dassTwo .swjtBox {display: flex; justify-content: center; margin-top: 1.5rem;} .dassTwo .swjt.swiper-button-prev {transform: rotate(180deg);} .dassTwo .swjt {width: .7rem; height: .7rem; border-radius: 50%; background: #dce0e7; position: relative; left: 0; top: 0; margin: 0 .2rem; transition: .5s;} .dassTwo .swjt:hover {background: #074493;} .dassTwo .swjt:hover svg path {fill: #fff;} .dassTwo .swjt svg {max-width: 50%;} @media screen and (min-width: 200px) and (max-width: 767px) { .dassTwo {padding: 1.5rem 0 1.5rem;} .dassTwo .thubBox {width:70%;} .dassTwo .thubBox .imgBox img {min-height: auto;} .dassTwo .swiper2 .imgBox img {min-height: auto;} } .daasThre {background: url(../images/daasImg/daasThre-bj.jpg) no-repeat center; background-size: cover; padding: 1rem 0;} .daasThre .tle {color: #fff;} .daasThre ul {display: flex; justify-content: space-between; margin-top: 1rem;} .daasThre li {padding: 0 .3rem; text-align: center;} .daasThre li .tit {font-size: var(--font24); color: #fff; margin: .2rem 0;} .daasThre li .icBox {height: .6rem; display: flex; align-items: center; justify-content: center;} .daasThre li .icBox img {max-width: 100%; max-height: 100%;} .daasThre li .text span {display: block; color: #fff; margin: .1rem 0;} .daasFour {background: #e3e9f5; padding-top: 1rem; overflow: hidden;} .daasFour .daasBox {display: flex; justify-content: center; margin-top: 2rem;} .daasFour .box {display: inline-block; position: relative;} .daasFour .box .con {width: 5rem; height: 5rem; background: #0a6fb7; border-radius: 50%; transform: translateY(60%) scale(0); display: flex; justify-content: center; transition: 1s; opacity: 0;} .daasFour .box .con span {color: #fff; font-size: var(--font40); padding-top: 1rem; font-weight: 700;} .daasFour .box .cirle5 {width: 150%; height: 150%; border-radius: 50%; position: absolute; left: 50%; top: 50%; transform: translate(-50% , -10%) scale(0); border: 1rem solid #0a6fb7; opacity: 0; transition: 1s;} .daasFour .box .cirle4 {width: 190%; height: 190%; border-radius: 50%; position: absolute; left: 50%; top: 50%; transform: translate(-50% , -20%) scale(0); border: 1.5rem solid #0a6fb7; opacity: 0.059; transition: 1s;} .daasFour .box .cirle3 {width: 230%; height: 230%;border-radius: 50%; position: absolute; position: absolute; left: 50%; top: 50%; transform: translate(-50% , -24%) scale(0); border: 3px dashed #0a6fb7; opacity: 0.2; transition: 1s;} .daasFour .box li {position: absolute; left: 0; top: 0;} .daasFour .box li .icBox {width: 1rem; height: 1rem; background: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; position: relative; z-index: 1;} .daasFour .box li .icBox img {max-width: 50%;} .daasFour .box li .liBox::after {content: ""; position: absolute; top: 50%; left: 50%; width: 120%; height: 120%;transform: translate(-50% , -50%); border-radius: 50%; background: #e9eefa; z-index: 0;} .daasFour .box li .tit {color: #606060; font-size: var(--font24); position: absolute; white-space: nowrap;top: 50%;transform: translate(-100%, -50%); padding-right: .2rem;} .daasFour .box li:nth-child(n+4) .tit {padding-right: 0;transform: translate(100%, -50%); padding-left: .1rem;} .daasFour .box li.li1 {left: -70%; top: 60%;} .daasFour .box li.li2 {left: -45%; top: 20%;} .daasFour .box li.li3 {left: -0%; top: -10%;} .daasFour .box li.li4 {left: 80%; top: -10%;} .daasFour .box li.li5 {left: 125%; top: 20%;} .daasFour .box li.li6 {left: 146%; top: 60%;} .daasFour .box.on .con {transform: translateY(60%) scale(1);opacity: 1;} .daasFour .box.on .cirle5 {transform: translate(-50% , -10%) scale(1);opacity: 0.302;transition-delay: .1s;} .daasFour .box.on .cirle4 {transform: translate(-50% , -20%) scale(1);opacity: 0.059; transition-delay: .3s;} .daasFour .box.on .cirle3 {transform: translate(-50% , -24%) scale(1);opacity: 0.2; transition-delay: .5s;} @media screen and (min-width: 200px) and (max-width: 1440px) { .proNavSwiper .swiper-slide h5 {font-size: var(--font14);} } @media screen and (min-width: 200px) and (max-width: 1200px) { .soulThre .box>ul>li {width: 100%;} .soulEight .listInfo ul {flex-wrap: wrap;} .soulEight .listInfo li {width: 48% !important; margin-top: .3rem; margin-bottom: .3rem;} /* 数据服务 */ .daasFour .box li .tit {font-size: var(--font18);} } @media screen and (min-width: 200px) and (max-width: 1024px) { .daasFour .box .con {width: 4rem; height: 4rem;} /* A2-D */ .proA2DTwo .box {flex-wrap: wrap; align-items: flex-start;} .proA2DTwo .box .dlInfo {margin-top: .5rem;} .proA2DTwo .box .imgBox {flex: none; width: 100%;} } @media screen and (min-width: 200px) and (max-width: 960px) { .daasFour .daasBox {margin-top: 1rem;} .daasFour .box {display: flex; flex-direction: column; align-items: center;} .daasFour .box .con span {font-size: var(--font26);padding-top: .8rem;} .daasFour .box ul {order: -1; display: flex; flex-wrap: wrap;} .daasFour .box li {position: relative; left: 0 !important; top: 0 !important; margin: .2rem 0; width: 48%;} .daasFour .box .cirleBox {position: relative;} .daasFour .box li .tit {position: relative; transform: none; white-space: wrap;} .daasFour .box li:nth-child(n+4) .tit {transform: none;} .daasFour .box li .liBox::after {display: none;} .daasFour .box li .liBox {display: flex; align-items: center;} .daasFour .box li .icBox {order: -1; flex-shrink: 0; margin-right: .2rem;} } @media screen and (min-width: 200px) and (max-width: 767px) { .soulEight .process li {width: 85%;} .soulEight .process li:nth-child(even) img {display: none;} .soulEight .process .ul1 li.li6 {right: -.1rem; position: relative;} .soulEight .process .ul2 li:nth-child(odd) {width: 85%;} .soulEight .process .ul2 li:nth-child(even) {margin-right: 0;} .soulEight .process .ul2 li {margin-top: .5rem !important;} .soulEight .process .ul2 li.li6 {position: relative !important; transform: none; order: 8;} .soulEight .process .ul2 li:nth-child(1) {order: 1;} .soulEight .process .ul2 li:nth-child(2) {order: 2;} /* 数据服务*/ .daasThre ul {flex-wrap: wrap;} .daasThre li {width: 48%;margin-top: .3rem;} } @media screen and (min-width: 200px) and (max-width: 640px) { .soulSix {padding: 1rem 0;} .soulSix .box .sjxBox {text-align: center;} .soulSix .box .sjxBox > img {max-width: 80%; margin: auto; margin-bottom: .5rem;} .soulMain .soulSix .box li {margin-top: .3rem;} .soulMain .soulSix .box li .liBox {position: relative; transform: none ; left: 0 ; top: 0 ;right: 0; display: flex; align-items: center; justify-content: space-between;} .soulMain .soulSix .box li .text {position: relative; transform: none ; white-space: wrap; order: 2;width: 50%;text-align: center;} .soulThre .box>ul>li {flex-wrap: wrap;} .soulThre li .imgBox {width: 60%; margin: auto;} .soulThre li .tit {width: 100%; margin-top: .3rem;} /* 数据服务 */ .daasOne ul {width: 100%; max-width: 100%;} .daasOne li span {margin-top: .2rem; font-size: var(--font20);} .dassTwo .swiper2 .slide {width: 50%;} } /* 搜索页面 */ .search-page .box {margin-top: 1rem;} .search-page form {width: 75%;margin: auto; margin-bottom: 60px; border: 1px solid #333; border-radius: 50px; padding:5px 20px; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; } .search-page form .searchCon {padding: 5px 0; width: 95%; line-height: 35px; outline: none; border: none; box-sizing: border-box; font-size: 16px;} .search-page form .sub {width: 23px; height: 23px; display: block; cursor: pointer; background: url(../images/searchIcon.png) no-repeat center; outline: none; border: none; background-size:100% 100%; filter: brightness(0); -webkit-filter:brightness(0);} .search-page ul {width: 100%;} .search-page li {width: 100%; padding: 30px; margin-top: 20px; box-sizing: border-box; background: #f5f5f5;} .search-page li span {background: #0A6FB7; color: #fff; font-size: 12px; padding: 2px 5px; } .search-page li h3 {font-size: var(--font18); margin: 10px 0; color: #000000; font-weight: 700;} .search-page li p {font-size: var(--font16); color: #666; } .search-page li .le {width: 95%;} .search-page li a {display: flex; align-items: flex-end; justify-content: space-between;} .search-page li img {transition: .5s; margin-right: 20px;} .search-page li:hover img {transform: translateX(20px);} @media screen and (min-width: 200px) and (max-width: 640px){ .search-page form { width: 90%; margin-bottom: 40px; } } /* 分页 */ .fy { padding: 0.5rem 0; display: flex;justify-content: center;align-items: center; flex-wrap: wrap;} .fy a { display: flex; align-items: center; border: 1px solid #E5E5E5; justify-content: center; color: #999; font-size: var(--font16); } .fy a {width: .4rem; height: .4rem; min-width: 35px; min-height: 35px; transition: .4s; margin:5px;} .fy a:hover {color: #fff; background: #0398f8; } .fy .layui-laypage-curr {display: flex; align-items: center; justify-content: center;} .fy .layui-laypage-curr {width: .4rem; height: .4rem; min-width: 35px; min-height: 35px; color: #fff; background: #0398f8; font-size: var(--font16); margin: 0 5px;} .fy a:first-child ,.fy a:last-child {width: auto; text-align: center;padding: 0 .15rem;} .fy a:first-child:hover::before ,.fy a:last-child:hover::before {filter: brightness(100); -webkit-filter:brightness(100);} /*2025.3.6隐藏*/ .indexOne{display: none} .proNavList .bd ul:first-child li .swiper-slide:nth-child(3),.proNavList .bd ul:first-child li .swiper-slide:nth-child(4){opacity: 0.3;} .shop-list dd ul li a{display: block; margin-top: 0.05rem} .foternav {margin-left: 0;width: 40%;} .foternav dl {width: auto;} .proNavList .bd ul:nth-child(3) li .swiper-slide a{padding:0.412rem 0.2rem} .proNavList .bd ul:nth-child(3) li .swiper-slide:first-child a{padding: 0.3rem 0.2rem} /* 2025.3.14 新增加留言下拉项 */ .dropdown {position: relative;} .dropbtn {padding: .12rem 0;color: #666666;} .dropdown-content {display: none;position: absolute;width: 100%;background-color: #fff;min-width: 160px;box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);z-index: 3;max-height: 5rem;overflow-y: auto;} .launchesSeven form .dropdown-content label {position: relative !important;display: block;padding: 7px 10px;text-decoration: none;color: black;top: 0;} .launchesSeven form .dropdown-content label input {position: relative; padding: 0; margin-right: 5px; width: auto;} /* 鼠标悬停在下拉选项上时的样式 */ .dropdown-content label:hover { background-color: #f1f1f1;} /* 显示下拉内容 */ .dropdown .show {display: block;} .prodlolFive {background: url(../images/prodollFive-bj.jpg) no-repeat center;background-size: cover;} .launchesSeven form .colcode .dropbtn {color: #fff;} .launchesSeven form .colcode .dropbtn::placeholder {color: #fff;}