/* =====头部===== */ body {} #c-placeholder {height: .92rem; min-height: 80px;} .header {position: fixed; top: 0; z-index: 9999; left: 0; width: 100%;border-bottom: 1px solid rgba(255, 255, 255,0.2); transition:background-color .5s;} .header .headBox {height: .92rem; min-height: 80px; padding-left: 2%; padding-right: 7%; box-sizing: border-box; display: flex; justify-content: space-between;} .headlogo {display: flex; align-items: center; height: 100%;} .headlogo img {max-width: 3rem;} .headlogo .logo1 {display: block;} .headlogo .logo2 {display: none;} /* 导航 */ nav {width: 51%;} nav > ul {display: flex; height: 100%; justify-content: space-between;} nav > ul > li {height: 100%;} nav > ul > li > a::after {content: ""; position: absolute; bottom: -2px; left: 50%; width: 0; height: 3px;background: #005bac; transition: .5s;z-index: 2;} nav > ul > li > a {display: flex; align-items: center; color: #ffffff; font-weight: 700; height: 100%;position: relative;} nav > ul > li > a > i.layui-icon {font-size: 12px; margin-left: 5px;} nav > ul > li:hover > a::after , nav > ul > li.on > a::after {width: 100%; left: 0%;} nav > ul > li:hover > a , nav > ul > li.on > a {color: #005bac !important;} /* 下拉导航 */ .navSlideDown {position: absolute; width: 100%; left: 0;background: #f5f9fa;top: 100%; box-sizing: border-box; opacity: 0; visibility: hidden; transition: opacity 0.4s; pointer-events: none; box-shadow: 0 2px 5px rgba(0, 0, 0,.05);} .navSlideDown.on {opacity: 1; visibility: visible;pointer-events: auto;} .navSlideDown .box {display: flex; justify-content: space-between; align-items: flex-start; position: relative; padding-right: .7rem;} .navSlideDown .close {position: absolute; cursor: pointer; right: 0; width: .4rem; top: .2rem;} .navSlideDown .close svg {max-width: 100%;} /* 其他二级栏目下拉 */ .navSlideDown2 {display: none; top: 100%;left: 50%; transform: translate(-50%, -0%);position: absolute; background: #fff;width: max-content; padding: .1rem .2rem;} .navSlideDown2 ul li {border-bottom: 1px solid #E9EAEB; text-align: center;} .navSlideDown2 ul li:last-child {border: 0;} .navSlideDown2 ul li a {display: block; padding: .1rem 0; transition: .5s; font-size: var(--font14);} .navSlideDown2 ul li:hover a {color: #005bac;} /* 产品下拉导航 */ .proSlideDown {display: flex; width: 100%;} .proSlideDown .hd {width: 22%; padding-top: .2rem; padding-bottom: .4rem;} .proSlideDown .hd ul li { margin-top: .3rem; position: relative; overflow: hidden;} .proSlideDown .hd ul li::before {content: ""; position: absolute; left: -50%; top: -50%; width: .2rem; height: .2rem; -webkit-clip-path: polygon(0 0, 0% 100%, 100% 0);clip-path: polygon(0 0, 0% 100%, 100% 0); background: #005bac; transition: .5s;} .proSlideDown .hd ul li::after {content: ""; position: absolute; background: url(../images/proSlideDown-jt.png) no-repeat right; background-size: contain; width: 6px; height: 12px; right: .2rem; top: 50%; transform: translateY(-50%); transition: .5s;} .proSlideDown .hd ul li a {display: block; padding: .11rem .2rem; padding-right: .3rem; transition: .5s; font-size: var(--font18);} .proSlideDown .hd ul li.on a {background: #E9EAEB; color: #444444;} .proSlideDown .hd ul li.on::before {left: 0; top: 0;} .proSlideDown .hd .list {border-top: 1px solid rgba(174, 174, 174,.26); margin-top: .5rem; padding:0 .2rem;} .proSlideDown .hd .list dd {margin-top: .3rem;} .proSlideDown .hd .list dd a {display: flex; justify-content: space-between;} .proSlideDown .hd .list dd a:hover {color: #005bac;} .proSlideDown .hd .list dd a:hover svg path {fill: #005bac;} .proSlideDown .bd {flex: none; width: 78%; } .proSlideDown .bd .inBox {display: flex; height: 100%;} .proSlideDown .bd .inHd {background: #e9eaeb; width: 25%; padding-top: .3rem;} .proSlideDown .bd .inHd ul {height: 70%; overflow-y: auto;} .proSlideDown .bd .inHd ul li {transition: .5s; position: relative; overflow: hidden;} .proSlideDown .bd .inHd ul li a {display: block; padding: .12rem .3rem; box-sizing: border-box;color: #8a8a8a;} .proSlideDown .bd .inHd ul li::before {content: ""; position: absolute; left: -50%; top: -50%; width: .25rem; height: .25rem; -webkit-clip-path: polygon(0 0, 0% 100%, 100% 0);clip-path: polygon(0 0, 0% 100%, 100% 0); background: #005bac; transition: .5s;} .proSlideDown .bd .inHd ul li::after {content: ""; position: absolute; background: url(../images/proSlideDown-jt.png) no-repeat right; background-size: contain; width: 6px; height: 12px; right: .2rem; top: 50%; transform: translateY(-50%); transition: .5s;} .proSlideDown .bd .inHd ul li.on {background: #ffffff;} .proSlideDown .bd .inHd ul li.on::before {left: 0; top: 0;} .proSlideDown .bd .inHd .inHdlist {margin-top: .3rem; padding: 0 .3rem; padding-top: .3rem; border-top: 1px solid rgba(174, 174, 174,.26);} .proSlideDown .bd .inHd .inHdlist dd a {display: flex; align-items: center; justify-content: space-between; color: #8A8A8A;} .proSlideDown .bd .inHd .inHdlist dd a:hover {color: #005bac;} .proSlideDown .bd .inHd .inHdlist dd a:hover svg path {fill: #005bac;} .proSlideDown .bd .inBd {flex: none; width: 75%; padding: 0 8%; padding-top: .5rem; padding-right: 0;} /* .proSlideDown .bd .inBd ul {height: 70%; overflow-y: auto;} */ .proSlideDown .bd .inBd ul li {} .proSlideDown .bd .inBd ul li .inBdBox {display: flex; justify-content: space-between; align-items: flex-start; } .proSlideDown .bd .inBd .inBdBox .inBdLe {width: 50%;} .proSlideDown .bd .inBd .inBdBox .imgBox {width: 45%;display: flex; align-items: center; justify-content: center; padding: .3rem; mix-blend-mode: multiply; transition-delay: 0s;} .proSlideDown .bd .inBd .inBdBox .imgBox img {max-width: 100%; } .proSlideDown .bd .inBd .tle {display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; padding-right: .6rem; padding-bottom: .25rem; border-bottom: 1px solid rgba(137, 137, 137,.25);} .proSlideDown .bd .inBd .tle span {font-size: 0.26rem;font-weight: 400;color: #444444; line-height: 1;} .proSlideDown .bd .inBd .tle a {color: #005bac; font-size: var(--font15); flex-shrink: 0;} .proSlideDown .bd .inBd dl {padding-top: .2rem;} .proSlideDown .bd .inBd dl dd {margin-top: .2rem;} .proSlideDown .bd .inBd dl dd a {font-size: var(--font15);color: #444444; font-family: Arial, Arial-Regular;} .proSlideDown .bd .inBd dl dd a:hover {color: #005bac;} /* 产品下拉推荐 */ .proSlideDownInfo {width: 25%;background: #ffffff; padding: .3rem; box-sizing: border-box; margin-top: .4rem; position: relative; display: none;} .proSlideDownInfo .swiper {position: static;} .proSlideDownInfo .swiper-slide .imgBox {display: flex; justify-content: center; align-items: center;} .proSlideDownInfo .swiper-slide .imgBox img {max-width: 100%;} .proSlideDownInfo .swiper-slide span {display: block; text-align: center; margin-top: .5rem; font-size: var(--font18); color: #333;} .proSlideDownInfo .swiper-pagination {bottom: .05rem;} .proSlideDownInfo .swiper-pagination .swiper-pagination-bullet-active {background: #005bac;} /* 头部右侧 */ .headBox .re {display: flex;} .headBox .re svg {max-width: .4rem;} /* 语言 */ .helange {margin: 0 .36rem; position: relative;} .layui-nav {background: none; padding: 0; height: 100%} .layui-nav .layui-nav-item {height: 100%; display: flex; align-items: center;} .layui-nav .layui-nav-child dd a {padding: 0 .4rem;} .layui-nav .layui-nav-child dd a:hover {background: #0075C2; color: #fff;} /* 搜索按钮 */ .heSearch {margin-right: .3rem;} .heSearch i {width: 0.47rem;height: 0.47rem;background: #ffffff;border-radius: 50%;} .heSearch svg {max-width: 50% !important;} /* 搜索下拉 */ .hadbox-sec4 {position: absolute;left: 0;top: 100%;width: 100%;display: none; box-sizing: border-box;} .hadbox-sec4 {background-color: #fff;padding: .5rem; border-top: 1px solid #eee; box-shadow: 0 2px 2px rgba(0, 0, 0,.1);} .hadbox-sec4 .close {position: absolute; right: 1.5%; top: 5%; cursor: pointer; max-width: .3rem;} .hadbox-sec4 .close svg {max-width: 100%;} .hadbox-sec4 .f_tit {color: #222222;margin-bottom: 0.24rem;font-size: var(--font30);} .hadbox-sec4 .form {display: flex; align-items: center; justify-content: space-between; padding-bottom: 20px; border-bottom: 1px solid #dddddd;} .hadbox-sec4 .form .icBox { display: flex; width: 0.3rem; overflow: hidden;} .hadbox-sec4 .form .icBox svg {width: 100%;} .hadbox-sec4 .form .int {width: calc(100% - 3.1rem);padding: 0.16rem 0.24rem; color: #333333; flex: 1;} .hadbox-sec4 .form .f_sub {width: 1.6rem; height: 0.56rem; min-height: 45px; background: #0075C2;border-radius: 5px;font-size: var(--font24);color: #ffffff;cursor: pointer;} @media screen and (min-width: 200px) and (max-width: 767px) { .hadbox-sec4 {padding: .6rem .3rem;} .hadbox-sec4 .form {padding-bottom: .2rem;} .hadbox-sec4 .f_tit {font-size: var(--font20);} } /* 购物车 */ .headCart i {position: relative;font-style: normal;} .headCart .num {width: 15px; height: 15px; position: absolute; top: -20%; right: -20%; border-radius: 50%; background: #ff0000; color: #fff; font-size: 10px;} /* 登录 */ .healogin {margin-left: .36rem;} /* 头部下滑样式 */ /* .header.c-head-move {-webkit-transform: translateY(-100%);transform: translateY(-100%);} */ .header.c-style2 {background: #fff !important;border-color: #eee;} .header.c-style2 .headBox {} .header.c-style2 .headlogo .logo2 {display: block;} .header.c-style2 .headlogo .logo1 {display: none;} .header.c-style2 .helange svg path {fill: #393939;} .header.c-style2 .heSearch i {background: #005bac;} .header.c-style2 .heSearch span {color: #333;} .header.c-style2 .heSearch svg path {fill: #fff;} .header.c-style2 .headCart svg path {fill: #005BAC;} .header.c-style2 .healogin svg path {fill: #393939;} .header.c-style2 .helange span{color: #333} .header.c-style2 nav > ul > li {border-color: #eee;} .header.c-style2 nav > ul > li > a {color: #333;} .header.c-style2 nav > ul > li > a i path {fill: #333;} .header.c-style2 nav > ul > li.on > a {color: #01008C;} .header.c-style2 .mobmenu dl dd {background: #333;} .header.c-style2 .mobmenu h4 {color: #333;} /* ==================公用css====================== */ /* 滚动条 */ .headerNavScroll::-webkit-scrollbar {width: 3px; scrollbar-width:thin;scrollbar-color:#01008C #DDDDDD;} /*定义滑块 内阴影*/ .headerNavScroll::-webkit-scrollbar-thumb {background: #01008C; border-radius: 5px;} /*定义滚动条轨道 内阴影*/ .headerNavScroll::-webkit-scrollbar-track {background: #E5E5E5;} /* ===============公用css end!!!!===================*/ .more1 {display: inline-flex;background: #0560AF;border-radius: 50px; padding: .16rem .35rem; transition: .5s; color: #fff;} .more1 span {margin-right: .2rem;} .more1 i {transform: rotate(180deg); font-size: var(--font15);} .more1:active {box-shadow: 0 0 .1rem #0075c2;} .more2 {background: none;border: 1px solid rgba(255, 255, 255,.5);} .more2:active {background: #0560AF; border-color: #0560AF;} @media (any-hover: hover) { .more1:hover {box-shadow: 0 0 .1rem #0560AF;} .more2:hover {background: #0560AF; border-color: #0560AF;} } /* ======首页======= */ /* banner */ .indexBanner {position: relative; } .indexBanner .swiper {height: 100%;} .indexBanner {} .indexBanner .swiper-slide {overflow: hidden;} .indexBanner .imgBox {position: relative; height: 100%;} .indexBanner .imgBox img {width: 100%; height: 100%; object-fit: cover; /* transition: 1s linear 2s;transform: scale(1.1,1.1); */} /* .indexBanner .swiper-slide-active .imgBox img, .indexBanner .swiper-slide-duplicate-active .imgBox img {transition: 6s linear; transform: scale(1,1);} */ .indexBanner .box .p1 strong {display: block; line-height: 1.2;} .indexBanner .box .p2 {margin-top: .2rem; display: block;} .indexBanner .pagtion {left: auto; right: 1%; top: 50%; bottom: auto; width: auto;} .indexBanner .pagtion span {display: block;background: #ffffff; background: #fff; opacity: 1; margin: .1rem !important;} .indexBanner .pagtion .swiper-pagination-bullet-active {background: #0560af;} /* 自定义分页器 */ .pagtion2 {position: absolute; z-index: 2;bottom: .8rem; left: 0; width: 100%;} .pagtion2 .box {display: flex; justify-content: space-between; align-items: flex-end;} .pagtion2 .svgBox {width: .6rem; height: .6rem; position: relative; left: -0.5rem;} .pagtion2 .fcircle {width: 100%; height: 100%; overflow: visible;transform: rotate(-90deg);} .pagtion2 .cirle1 {opacity: .5;} .pagtion2 .cirle2 {stroke-dasharray:189; stroke-dashoffset:189;} .pagtion2.on .cirle2 { animation: dashTooffset 5s linear forwards;} .pagtion2 .swiper-num {color: #fff; font-style: italic; margin: 0 .3rem;} .pagtion2 .swiper-num span {color: #ffffff;} .pagtion2 .swiper-num .total , .pagtion2 .swiper-num em {color: #878787;} .pagtion2 .button {position: relative; display: flex; align-items: center; } .pagtion2 .button .swjt {left: 0; position: relative; transform: none; top: 0; width: auto; height: auto; margin: 0;color: #fff;} @keyframes dashTooffset {0% {stroke-dashoffset: 189;}100% {stroke-dashoffset: 0;}} .indexOne {background: url(../images/indexOne-bj.jpg) no-repeat center; background-size: cover; padding: 1rem 0;} .indexOne .hd {display: flex; justify-content: space-between;align-items: center;} .indexOne .hd ul {display: flex;} .indexOne .hd li {margin-left: .3rem;} .indexOne .hd li a {display: flex; justify-content: space-between; border: 1px solid #c7c7c7;border-radius: 30px; padding: .18rem .2rem; font-size: var(--font18); color: #585858; transition: .5s;} .indexOne .hd li .icBox {display: inline-block;} .indexOne .hd li .cn {margin-right: 1.4rem;} .indexOne .hd li .icBox img {filter: brightness(0); -webkit-filter:brightness(0);opacity: .3;} .indexOne .hd li.on a {background: #0560af; border-color: #0560af; color: #fff;} .indexOne .hd li.on .icBox img {filter: none; -webkit-filter:none;opacity: 1;} .indexOne .bd {margin-top: .5rem;} .indexOne .outBox .inBox {display: flex; justify-content: space-between; align-items: flex-start;} .indexOne .bd .inHd {background: #ffffff;border-radius: 0.1rem; flex: 1; margin-right: 5%; padding: .2rem; box-sizing: border-box;} .indexOne .bd .inBd {width: 78%;} .indexOne .bd .inHd .tit {font-weight: 700; font-size: var(--font24); padding-bottom: .1rem; border-bottom: 1px solid rgba(212, 212, 212,.5);} .indexOne .bd .inHd li {margin-top: .2rem;} .indexOne .bd .inHd li a {display: flex; justify-content: space-between; align-items: center; color: #555555;} .indexOne .bd .inHd li a i {font-weight: normal !important; font-size: 12px;} .indexOne .bd .inHd li.on a {color: #0560AF; font-weight: 700;} .indexOne .bd .inBd .liBox {display: flex; align-items: center; justify-content: space-between;} .indexOne .bd .inBd .liBox .con {width: 40%;} .indexOne .bd .inBd .liBox .imgBox {mix-blend-mode: multiply; width: 49%;} .indexOne .bd .inBd .liBox .imgBox img {max-width: 100%;} .indexOne .bd .inBd li .tit1 {font-size: var(--font40);font-weight: 700;} .indexOne .bd .inBd li .text {margin-top: .2rem;} .indexOne .bd .inBd li .text p {color: #666666; } .indexOne .bd .inBd li dl {display: flex; justify-content: space-between; margin-top: .1rem;} .indexOne .bd .inBd li dd {margin-top: .3rem;color: #949494;} .indexOne .bd .inBd li dd .icBox {width: 0.5rem;height: 0.5rem;border: 1px solid #d2d7e0;border-radius: 0.1rem; display: flex; align-items: center; justify-content: center;} .indexOne .bd .inBd li dd span {display: block; margin-top: .1rem;} .indexOne .bd .inBd li .more1 {margin-top: .6rem;} .indexTwo {padding: 1.5rem 0; background: url(../images/indexTwo-bj.jpg) no-repeat center; background-size: cover; overflow: hidden; background-attachment: fixed;} .indexTwo .box {display: flex; justify-content: space-between; flex-wrap: wrap;} .indexTwo .con {width: 42%;} .indexTwo .con .text {margin-top: .5rem;} .indexTwo .con .text p {color: #fff; margin-top: .3rem;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical ;} .indexTwo .con .more {margin-top: .7rem;} .indexTwo .list {position: relative;} .indexTwo .list::before {content: ""; position: absolute; height: 200%; top: -50%; opacity: 0.15;background: #ffffff; left: 0; width: 1px;} .indexTwo .list .num {display: flex; align-items: flex-end; line-height: 1;} .indexTwo .list li {margin-top: 1rem; position: relative; padding-left: .5rem;} .indexTwo .list li::before {content: ""; background: #ffffff; width:0.04rem; min-width: 2px; height: 0; left: -1px; top: 0; position: absolute; transition: .5s;} .indexTwo .list li:first-child {margin-top: 0;} .indexTwo .list li:hover::before {height: 100%; } .indexThre {padding: 1rem 0;} .indexThre .box {display: flex; justify-content: space-between; margin-top: .8rem;} .indexThre .news {width: 35%;box-shadow: 0rem 0rem 0.22rem 0rem rgba(3,0,0,0.03); padding: .45rem .4rem;} .indexThre .show {width: 63%; display: flex; justify-content: space-between;} .indexThre .show .item {width: 48%;box-shadow: 0rem 0rem 0.22rem 0rem rgba(3,0,0,0.03); } .indexThre .news .tit .h4 {position: relative;} .indexThre .news .tit .h4::before {content: ''; position: absolute; width: 50%; bottom: 0;height: 2px;background: #004e94;} .indexThre .news .tit .more a {text-decoration: underline;} .indexThre .news .tit .more a:hover {font-weight: 700; text-decoration: none;} .indexThre .news ul {margin-top: .4rem;} .indexThre .news li {padding: .18rem 0;} .indexThre .news li .p1 {position: relative;} .indexThre .news li .p1::after {content: ''; position: absolute; left: 0; width: 0; height: 1px; background: #004E94; bottom: 0; transition: .5s;} .indexThre .news li:hover .p1 p {color: #004E94;} .indexThre .news li:hover .p1::after {width: 100%;} .indexThre .item .imgBox {overflow: hidden;} .indexThre .item .imgBox img {width: 100%; transition: .5s;} .indexThre .item .con {padding: .4rem .3rem;} .indexThre .item .con .h5 {position: relative; border-bottom: 2px solid #004E94; display: inline-block;} .indexThre .item .con .p1 {margin-top: .3rem;} .indexThre .item .con .time {margin-top: .5rem;} .indexThre .item:hover .imgBox img {transform: scale(1.05);} .indexThre .item:hover .p1 p {color: #0560AF;} .indexFour {background: url(../images/indexFour-bj.jpg) no-repeat center; background-size: cover; padding: .7rem 0;} .indexFour .box {align-items: flex-start;} .indexFour .le {width: 32%;} .indexFour .re {width: 50%;} .indexFour .le .more {margin-top: 1.6rem;} .indexFour .re ul {display: grid; grid-template-columns: repeat(2,1fr);gap: .4rem;} .indexFour .re li {text-align: center;background: rgba(255, 255, 255,.4);border-radius: 0.1rem; padding: .6rem .1rem; transition: .5s;} .indexFour .re li .icBox {height: .5rem;} .indexFour .re li .icBox img {max-height: 100%;} .indexFour .re li:hover {background: #fff; box-shadow: 0 0 .1rem #eee;} /* =====底部===== */ .footer {background: #005BAC;} .foterlogo img {max-width: 3rem;} .footer .box {padding: .8rem 0 1.3rem; display: flex; justify-content: space-between;} .foterUs {margin-top: .5rem;} .foterUs dl {display: flex; margin-top: .2rem;} .foterUs dl dd {margin-right: .1rem;} .foterUs dl dd a {display: flex; align-items: center; justify-content: center; width: 0.48rem; height: 0.48rem; min-height: 36px; min-width: 36px; background: rgba(249, 249, 249,.1); border-radius: 50%; transition: .5s;} .foterUs dl dd svg {max-width: 50%;} .foterUs dl dd:hover a {background: #fff;} .foterUs dl dd a:hover svg path {fill: #005BAC;} .foterTel {margin-top: .7rem;} .foternav {display: flex;width: 66%; justify-content: space-between; flex-wrap: wrap; position: relative;} .foternav dl {margin-right: .8rem;} .foternav dt {margin-bottom: .2rem; } .foternav dt a {color: #ffffff;font-size: var(--font18);font-weight: 700;} .foternav dd {margin: .1rem 0;} .foternav dd a {font-size: var(--font15);opacity: 0.62;color: #ffffff;} .foternav dd a:hover {opacity: 1;} .foternav dl.zn {position: absolute; left: 43%;top: 50%;} .copyRight {padding: .3rem 0;} .copyRight p ,.copyRight p a {color: #fff; font-size: var(--font15);} .c{*zoom:1;} .c:after{content: ""; display: block; height: 0; clear: both;} .txt-c{text-align: center;} .txt-l{text-align: left;} .txt-r{text-align: right;} .col-white{color: #fff;} .line1{overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;} .line2{overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;} .line3{overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;} .line4{overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;} .flex{display: flex;} .flex-sbc{display: flex; justify-content: space-between; align-items: center;} .flex-c{display: flex; align-items: center;} .flex-cc{display: flex; align-items: center; justify-content: center;} .flex-ccc{display: flex; align-items: center; justify-content: center; flex-direction: column;} .flex-dcsb{display: flex; flex-direction: column; justify-content: space-between;} .flex-sb{display: flex; justify-content: space-between;} .flex-sbw{display: flex;justify-content: space-between; flex-wrap: wrap;} .flex-cw{display: flex; align-items: center; flex-wrap: wrap;} .flex-dc{display: flex; flex-direction: column;} .flex-w{display: flex; flex-wrap: wrap;} .flex-sbcw{display: flex;justify-content: space-between; align-items: center; flex-wrap: wrap;} /* 产品专区列表页 */ .pro-right-title {margin-bottom: 0.37rem;} .pro-right-title strong{font-weight: bold;display: block;/* line-height: 0.35rem; */font-family: "Microsoft YaHei";} .pro-right-title span{color: rgba(255, 255, 255, 0.63);} .proclass-btn{width: 90%;} .proclass-btn ul li{height: 48px;border-radius: 0.05rem; padding: 0 0.26rem; position: relative;} .proclass-btn ul li::after{opacity: 0; position: absolute;content: ''; background: url(../images/proclass-arrow.png) no-repeat center bottom; width: 0.11rem; height: 0.1rem; bottom: 0; transition: 0.6s;} .proclass-btn ul li span{transition: translateY 0.6s;} .proclass-btn ul li.on,.proclass-btn ul li:hover{background: #ffffff;} .proclass-btn ul li.on span,.proclass-btn ul li:hover span{color: #333333;} .proclass-btn ul li.on::after,.proclass-btn ul li:hover::after{bottom: 0.08rem; opacity: 1;} .proclass-btn ul li.on span,.proclass-btn ul li:hover span {transform: translateY(-0.1rem);} .proclass-bd{padding: 0.14rem 0 0;} .product-menu li{padding: 0.12rem 12%;} .product-menu li{border-bottom: 0.01rem solid rgba(228,228,228,1);} .product-menu li .menu-li a{font-size: var(--font15); color: #333;} .product-menu li .menu-li.on a,.product-menu li:hover .menu-li a{color: #003f82; font-weight: bold;} .product-menu li .s-menu{display: none; margin-top: 0.11rem; width: 100%;} .product-menu li .s-menu.on { display: block;} .product-menu li .s-menu a{display: block; font-size: var(--font15); color: #888; line-height: 0.3rem; } .product-menu li .s-menu a:hover,.product-menu li .s-menu a.on{color: #003f82; } .product-menu2 li { padding: 0.12rem 0;} .product-menu2 li .menu-li .class-logo{width: 26%; display: flex; align-items: center; justify-content: center;} .product-menu2 li .menu-li .class-logo img{display: block; max-width: 100%;} .product-menu2 li .menu-li em{width: 74%;} .product-menu2 li .s-menu{padding: 0 0 0 26%;} .product-menu2 li .s-menu a{line-height: 0.35rem;} .product-menu2 li .menu-li.on em{color: #003f82; font-weight: bold;} .product-menu2 li .s-menu .class-pic{padding: 0.1rem 0;} .product-menu2 li .s-menu .class-pic img{display: block; max-width: 100%; margin-right: 7%;} .mod-open .w1600{max-width: 92%;} .mod-open .w1400{max-width: 94%;} .pro-banner{background: url(../images/product-banner.jpg) no-repeat left center; background-size: cover; padding:0.5rem 0 0.5rem;} .position a{ color: #fff; margin: 0 0.1rem;} .pro-box .info{width: 52%;} .pro-box .info strong{font-family: "Microsoft YaHei"; margin: 0.22rem 0; display: block;font-size:0.38rem;} .pro-box .info h3{margin-bottom: 0.62rem; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;} .pro-box .pic{width: 34.78%;} .pro-box .pic img{display: block; max-width: 100%;} .pro-more a{width: 187px;height: 44px;background: #ffffff;border: 0.01rem solid #ffffff;border-radius: 0.03rem;} .pro-more span{font-weight: 700;color: #0d5fae; transition: 0.6s; margin-right: 0.32rem;} .pro-more a:hover span{margin-right: 0.4rem;} .search-box{border-bottom: 0.01rem solid #E9E9E9; padding: 0.28rem 0 0.2rem;} .pro-search{width: 334px;height:50px;background: #ffffff;border: 0.01rem solid #e5e5e5;border-radius: 26px; padding-left: 0.33rem; box-sizing: border-box; margin-right: 0.33rem;} .pro-search img{margin-right: 0.1rem;} .pro-search input{outline: none; border: none; font-family: "Microsoft YaHei";font-weight: 700;text-align: left;color: #b2b2b2;font-size: var(--font15); } .pro-search input::placeholder{color: #b2b2b2;} .hot-pro{font-family: "Microsoft YaHei"} .hot-pro ul{margin-left: 0.08rem;} .hot-pro ul em,.hot-pro ul li a{color: #838383;font-size: var(--font15); } .hot-pro ul li a:hover{color: #004c9a;} .pro-class{padding: 0.3rem 0 0.4rem;} .pro-class ul li{height: 0.43rem; display: flex; align-items: center; justify-content: center; transition: background 0.6s,border-radius 0.6s; margin-right: 0.16rem;} .pro-class ul li a{ display: block; font-size: var(--font15); color: #888; padding:0 0.2rem; } .pro-class ul li:hover {background: #004c9a;border-radius: 0.22rem; } .pro-class ul li:hover a,.pro-class ul li.on a{color: #fff;} .product-list {margin-bottom: 1rem;} .product-list ul li{width: auto; background: #ffffff;border-radius: 0.1rem; padding: 0 2% 0.45rem; text-align: center; margin-bottom: 0.37rem;} .product-list ul li .pic{overflow: hidden;padding: 0.36rem 0 0.24rem;min-height: 3.2rem; max-height: 3.2rem;display: flex;justify-content: center;align-items: center;} .product-list ul li .pic img{display: block; margin: 0 auto; max-width: 100%; -webkit-transition: opacity 1s, -webkit-transform 1s; transition: opacity 1s, transform 1s; -webkit-backface-visibility: hidden;backface-visibility: hidden;opacity: 1;} .product-list ul li:hover .pic img{-webkit-transform: scale3d(1.1,1.1,1);transform: scale3d(1.1,1.1,1);-webkit-transition: opacity 1s, -webkit-transform 1s;transition: opacity 1s, transform 1s;-webkit-backface-visibility: hidden;backface-visibility: hidden;} .product-list ul li strong{ font-size: var(--font18); color: #333;} .product-list ul li .more1{margin-top: 0.51rem; padding: 0.13rem 0.17rem;} /* 产品专区详情页 */ .pro-more2{margin-right: 0.19rem;} .pro-more2 a{background: transparent;} .pro-more2 span{color: #fff;} .pro-box .propic-list{overflow: hidden; position: relative; width: 42%;} .propic-list ul li .propic{display: flex; align-items: center; justify-content: center;} #propic-num{display: none;} #propic-prev,#propic-next{width: 0.44rem;height: 0.44rem; background: url(../images/propic-arrow.png) no-repeat center rgba(255,255,255,0.22); border-radius: 50%;} #propic-prev{left: 0;} #propic-next{right: 0; transform: rotateY(180deg); -webkit-transform: rotateY(180deg);} .proxq-btn{padding: 0.36rem 0 0.8rem;} .proxq-btn ul li{margin-right: 0.14rem;} .proxq-btn ul li:last-child{margin-right: 0;} .proxq-btn ul li a{transition: 0.6s; display: block; border: 1px solid #454545;border-radius: 0.26rem; color: #333; text-align: center; padding: 0.13rem .29rem; font-size: var(--font16);} .proxq-btn ul li:hover a{background: #005bac; color: #fff; border-color: #005bac ;} .parameter{margin-bottom: 0.6rem;} .parameter-title strong{display: block; color: #333333; font-weight: bold; margin-bottom: 0.25rem;} .specifications-table{width: 100%; border-collapse: collapse; font-weight: bold;} .specifications-table tr.first td{background: #d9e1e8;} .specifications-table tr td{font-size: var(--font18); color: #333; border: 0.01rem solid #d6d6d6; text-align: center; width: calc(100% / 7); height: .74rem;} .specifications-table tr td{cursor: pointer;} .specifications-table tr td.blue{color: #005bac;} .specifications-table tr td em.blue {color: #005bac;} .specifications-table tr td .content {display: none;} .specifications-table tr td a{height: 31px;background: #005bac;border-radius: 15px; display: inline-block; padding: 0 42px 0 16px; position: relative; display: inline-flex; align-items: center; color: #fff;} .specifications-table tr td b{color: #ffffff;font-size: var(--font12); text-transform: uppercase; } .specifications-table tr td span{width: 35px;height: 35px;background: #c6c6c6; display: inline-block; border-radius: 50%; position: absolute; right:-.02rem; top: -.02rem; display: flex; align-items: center; justify-content: center;} .prodetails-top{padding: .38rem 0;} .prodetails-top strong{color: #005bac; display: block;} .prodetails-top ul li{margin-left: .15rem; } .prodetails-top ul li:first-child{margin-left: 0;} .prodetails-top ul li a{border: 0.01rem solid #005bac;border-radius: 0.26rem; padding: .11rem .39rem; transition: 0.6s;} .prodetails-top ul li em{color: #005bac; font-weight: bold; margin-left: .15rem; transition: 0.6s;} .prodetails-top ul li:hover a{background: #005bac; } .prodetails-top ul li:hover em{color: #fff;} .prodetails-top ul li:hover img{-webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1);} .pro-consult{background: #fff; padding: 5% 4% 3.3%; margin-bottom: 1.31rem; box-sizing: border-box;} .consult-form{padding: 0 3%; box-sizing: border-box;} .consult-form input,.consult-form select,.consult-form textarea{box-sizing: border-box; border: none; outline: none; border-bottom: 0.01rem solid #CCCCCC; height: 0.46rem; color: #666666; font-size: var(--font16);} .consult-form input{width: 31.3%;} .consult-form ul{margin-bottom: .45rem;} .consult-form select,.consult-form .layui-form-select{width: 65.6%; border-bottom: 0.01rem solid #CCCCCC;} .consult-form select{border-bottom: none;} .consult-form .layui-form-select .layui-input{border-bottom: none; width: 100%;} .consult-form textarea{resize:none} .consult-form .layui-btn{background: #004e9a;border-radius: 0.25rem; height: 0.5rem; line-height: 0.5rem; font-size: var(--font16); color: #fff; width: 2.55rem;} /* 服务与支持-产品目录 */ .service-banner{background: url(../images/service-banner.jpg) no-repeat center; background-size: cover; box-sizing: border-box; padding: 0.16rem 0 0.81rem;} .service-banner .position{margin-bottom: .89rem;} .service-box{} .service-box .info{width: 27.5%;} .service-box .info h2{font-weight: 700; line-height: .48rem; margin-bottom: .51rem;} .service-search{height: 0.55rem;background: #ffffff;border: 0.01rem solid #d7d7d7;border-radius: 0.29rem; box-sizing: border-box; padding: 0 0.05rem;} .service-search img{margin-left: 0.2rem;} .service-search .input-text{color: #a9a9a9; font-size: var(--font15); margin-left: 0.12rem;} .service-search .input-submit{width: 1.03rem;height: 0.45rem;background: #005bac;border-radius: 0.23rem; color: #fff; font-size: var(--font16); } .service-box .text{width: 45%; border-left: 0.01rem solid rgba(198,198,198,0.2); box-sizing: border-box; padding: .24rem 0 .13rem 5%;} .service-box .text h3{ } .service-more{margin-top: 0.33rem;} .service-more b{margin-right: .16rem; transition: 0.6s;} .service-more a:hover b{margin-right: .25rem;} .service-main{background: url(../images/service-bg.jpg) no-repeat center top; align-items: flex-start;} .service-left{width: 86%;} .left-box{padding: 1.22rem 4.4% 5% 15%; box-sizing: border-box;} .service-list ul li{background: #ffffff;border: 0.01rem solid #dddddd;border-radius: 0.1rem; width: 48.8%; padding: 0.36rem 3%; margin-bottom: .21rem;} .service-list ul li a{ align-items: stretch;} .service-list ul li strong{color: #333333; margin-bottom: .1rem;} .service-list ul li span{color: #777777;} .service-list ul li .text{width: 60%;} .service-list ul li .down-icon{height: 44px;background: #f7f7f7;border-radius: 22px; padding: 0 16px; transition: 0.6s;} .service-list ul li .down-icon em{color: #777777; margin-left: .1rem;} .service-list ul li a:hover .down-icon{background: #005bac;} .service-list ul li a:hover .down-icon em{color: #fff;} .service-list ul li a:hover .down-icon img{-webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1);} .service-right{width: 14%; background: #efeff5; box-sizing: border-box; padding:0.87rem 0 2.3rem 0.22rem; height: 100vh } .service-class{position: sticky; top: 1.2rem;} .service-class ul li{margin-bottom: 0.15rem;} .service-class ul li a{position: relative;width: auto;border-radius: 0.28rem;font-size: var(--font17);color: #333;line-height: 0.56rem;display: block;transition: 0.6s;padding-left: .21rem;box-sizing: border-box;} .service-class ul li a::after{position: absolute;content: '';width:0;height: 0.04rem;background: #fcfcff;left: 0.1rem;top: 50%;transform: translateY(-50%);transition: 0.6s;} .service-class ul li:hover a,.service-class ul li.on a{background: #005bac; color: #fff; text-indent: .16rem;} .service-class ul li:hover a::after,.service-class ul li.on a::after{width: 0.15rem;} .catalog{padding-top: .32rem; border-top: 0.01rem solid #D7D7D7;} .catalog-table{width: 100%!important; border-collapse: collapse; text-align: center;} .catalog-table tr{border-bottom: 0.01rem solid #D7D7D7;} .catalog-table tr.first{background: #b7cada; border-bottom: none;} .catalog-table tr th,.catalog-table tr td{color: #454545;} .catalog-table tr th{height: .6rem; font-weight: bold;} .catalog-table tr td{height: .64rem;} .service-banner2{background: url(../images/service-banner2.jpg) no-repeat center; background-size: cover;} .case-bg{background: url(../images/case-bg.jpg) no-repeat center top #f7f7f7; background-size: cover; padding: 0.2rem 0 1.14rem;} .case-bg .position {margin-bottom: .85rem;} .case-bg .position span{color: #005bac;} .case-bg .position a{color: #888;} .case-bg .position a:hover{color: #333;} .case-bg .service-box .info { width: 60%;} .case-class ul li{margin-right: .1rem;} .case-class ul li:last-child{margin-right: 0;} .case-class ul li a {display: block; line-height: 0.5rem;border: 0.01rem solid #454545;border-radius: 0.26rem; padding: 0 .3rem; transition: 0.6s;} .case-class ul li:hover a{background: #005bac; border-color: #005bac; color: #fff;} .case-bg .service-more b{color: #005bac;} .case-bg .service-box{padding-bottom: .58rem; border-bottom: 0.01rem solid #D7D7D7; margin-bottom: .42rem;} .case-bg .service-box .text{border-left: 0.01rem solid #C6C6C6; width: 39%; padding: .24rem 0 .13rem 3%;} .case-list ul::after{content: ''; width: 31.25%;} .case-list ul li{width: 31.25%; margin-bottom: .47rem;} .case-list ul li .pic{overflow: hidden;} .case-list ul li .pic img{display: block; width: 100%; -webkit-transition: opacity 1s, -webkit-transform 1s; transition: opacity 1s, transform 1s; -webkit-backface-visibility: hidden;backface-visibility: hidden;opacity: 1;} .case-list ul li:hover .pic img{-webkit-transform: scale3d(1.1,1.1,1);transform: scale3d(1.1,1.1,1);-webkit-transition: opacity 1s, -webkit-transform 1s;transition: opacity 1s, transform 1s;-webkit-backface-visibility: hidden;backface-visibility: hidden;} .case-list ul li .info{background: #fff; padding: .4rem 6% .3rem; box-sizing: border-box;} .case-list ul li .info em{ color: #333; margin-bottom: .22rem;} .case-list ul li .info p{color: #666666; margin-bottom: .46rem;} .case-list ul li .info span{display: block; color: #666666; } .case-list ul li .info img{margin-left: 0.08rem; transition: 0.6s;} .case-list ul li:hover .info img{margin-left: 0.15rem;} .case-list ul li:hover .info em{color: #005bac;} .faq-banner{background: url(../images/faq-banner.jpg) no-repeat center; background-size: cover; padding: .15rem 0 .77rem;} .faq-banner .position {margin-bottom: .8rem;} .faq-banner .service-box .info{text-align: center; width: 36.3%;} .faq-list{border-top:0.01rem solid #E2E2E2;} .faq-list ul li{width: 100%; border-bottom:0.01rem solid #E2E2E2; padding: .22rem 0;} .faq-list ul li a{} .faq-list ul li em{color: #333; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; width: 90%;} .faq-list ul li img{transition: 0.6s;} .faq-list ul li:hover em{color: #005bac;} .faq-list ul li:hover img{transform: rotate(45deg);} /* 下载 */ .down-banner{background: url(../images/down-banner.jpg) no-repeat center; background-size: cover; height: 4.5rem; display: flex;} .down-banner .banner-text h2{margin-bottom: .12rem;} .down-class {margin: .36rem 0 .39rem;} .down-class ul li{margin-right: .2rem;} .down-class ul li:last-child{margin-right: 0;} .down-class ul li a{transition: 0.6s; display: block; color: #333333; text-align: center;line-height: 48px;border: 0.01rem solid #454545;border-radius: 1.26rem; padding: 0 .39rem;} .down-class ul li:hover a,.down-class ul li.on a{background: #005bac; color: #fff; font-weight: bold; border-color: #005bac;} .download{align-items: flex-start; background: #f7f7f7;} .download-left{width: 29.32%;padding:1.18rem 0 0 12%;background: url(../images/down-bg.jpg) no-repeat center top; height: 100vh; background-size: cover; box-sizing: border-box; overflow: hidden;position: sticky; top: 0rem; } .download-left strong{display: block;margin-bottom: .67rem;} .download-class .ctitle1{position: relative; padding-bottom: 2.75rem;} .download-class .ctitle1::after{position: absolute;content: '';width: 1px;height: 100%;background: rgba(255,255,255,0.2);left: 2.5%;top: 0.1rem;} .download-class .ctitle1 li{padding-bottom: .55rem;} .download-class .ctitle1 li a{display: flex;align-items: center;position: relative;font-size: var(--font18);color: #fff;position: relative;} .download-class .ctitle1 li i {opacity: 0;display: inline-block;width: 0.09rem;height: 0.09rem;background: #ffffff;border-radius: 50%;position: relative;z-index: 1;margin-right: 5%;margin-left: .05rem;} .download-class .ctitle1 li i::after {opacity: 0; content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 0.22rem;height: 0.22rem; animation: shubiao 1s infinite linear .65s; background: rgba(255,255,255,0.23); border-radius: 50%; z-index: 0;} @keyframes shubiao {0% { -webkit-transform: translate(-50%, -50%) scale(1); } 33% { -webkit-transform: translate(-50%, -50%) scale(1.2); } 66% { -webkit-transform: translate(-50%, -50%) scale(1.3); } 100% { -webkit-transform: translate(-50%, -50%) scale(1); }} .download-class .ctitle1 li:hover a,.download-class .ctitle1 li.on a{font-weight: bold;/* color: #0072B8; */} .download-class .ctitle1 li:hover i,.download-class .ctitle1 li.on i{opacity: 1;} .download-class .ctitle1 li:hover i::after,.download-class .ctitle1 li.on i::after{opacity: 1;} .download-right{ width: 70.68%; background: #f7f7f7; box-sizing: border-box; padding: 1rem 0 0 4%; } .download-list {width: 81%;} .download-list ul li{border-bottom: 0.01rem solid #DDDDDD; width: 46%; padding-bottom: .3rem; margin-bottom: .49rem;} .download-list ul li strong{color: #333;width: 88%;} .download-list ul li b{white-space: nowrap;text-overflow: ellipsis;overflow: hidden;width: 90%;} .download-list ul li strong>img{margin-right: 0.14rem;} .download-list ul li:hover b{color: #005bac;} /* 使用指南 */ .guide{padding: 0.12rem 0;} .guide .position span{color: #005bac;} .guide .position a{color: #888;} .guide .position a:hover{color: #333;} .guide-banner{background: url(../images/guide-banner.jpg) no-repeat center; background-size: cover; height: 3.01rem; display: flex; } .fileCen .box {display: flex; width: 100%;display: flex;flex-wrap: wrap; position: relative; align-items: flex-start;} .fileCen .le {width: 18%; padding: .7rem; padding-right: .1rem;box-sizing: border-box; height: calc(100vh - 0px);background: rgb(232, 234, 239); position: sticky;left: 0px; top: 0.9rem; z-index: 2;color: black;} .fileCen .re {width: calc(100% - 18%); display: flex; justify-content: space-between; align-items: flex-start; min-height: calc(100vh - 1px); padding:.5rem 0 .5rem 0.69rem; box-sizing: border-box;flex: 1 1 0%;} .fileCen .le .tit h2 {color: #282828; font-size: var(--font30); font-weight: 700; margin-left: .12rem;} .navbox {margin-top: .5rem;} .f_navbox > ul > li {margin: .3rem 0;} .f_navbox > ul > li .menu-li {display: flex; align-items: center;} .f_navbox > ul > li .menu-li i {width: 16px; height: 16px; display: flex; align-items: center; justify-content: center; margin-right: .12rem; cursor: pointer;transition: .5s;} .f_navbox > ul > li .menu-li i svg {max-width: 100%;} .f_navbox > ul > li .menu-li a {font-size: var(--font18); font-weight: 700;color: #282828;} .f_navbox2 {display: none;} .f_navbox2 > ul {position: relative;} .f_navbox2 > ul::before {content: ""; height: 100%; width: 1px; background: #cbced7; position: absolute; left: 8px; top: 0;} .f_navbox2 > ul > li {margin: .25rem 0;} .f_navbox2 > ul > li .menu-li {display: flex; align-items: center;} .f_navbox2 > ul > li .menu-li i {width: 7px; margin-left: 5.2px; height: 7px; background: #c7cad4; border-radius: 50%; margin-right: .12rem; position: relative; z-index: 2;} .f_navbox2 > ul > li .menu-li a {color: #666666; font-size: var(--font17);} .f_navbox3 {margin-left: calc(.12rem + 12px);} .f_navbox3 li {margin: .05rem 0;} .f_navbox3 li a {font-size: var(--font15); color: #666666;} .f_navbox .menu-li a:hover {color: #333;} .f_navbox > ul > li.on .f_navbox2 {display: block;} /*.f_navbox > ul > li .menu-li.on i {transform: rotate(90deg);}*/ .f_navbox2 > ul > li .menu-li:hover i,.f_navbox2 > ul > li .menu-li.on i {background: #005bac;} .f_navbox2 > ul > li .menu-li.on a {font-weight: 700; color: #333;} .f_navbox3 > ul > li.on a,.f_navbox3 > ul > li:hover a {color: #005bac;} .f_navbox > ul > li.on .menu-li a,.f_navbox > ul > li:hover .menu-li a {color: #005bac;} .fileCon {width: 76%;} .fileCon .mbx {display: flex; align-items: center; flex-wrap:wrap;} .fileCon .mbx a {display: inline-flex; align-items: center; margin: 0 .1rem;} .fileCon .tle {margin: 0 0 0.5rem; padding-bottom: .2rem; border-bottom: 1px solid #c7c7c7;} .fileCon .tle h3 {color: #333333; font-weight: 700; font-size: var(--font40);} .fileCon .tle .time {color: #777777;} .fileCon .boxCon {word-break: break-all;} .fileCon .boxCon .item img {max-width:100%;} .pagenav {position: sticky;left: 0px; top: 0px; z-index: 2;height: calc(100dvh - 1px); width: 20%; padding-top: 2.2rem; box-sizing: border-box;} .pagenav .tit {color: #333333; font-size: var(--font22); font-weight: 700;} .pagenav .list {overflow-y: auto; max-height:5rem; padding-right: .2rem;margin-right: .2rem;} .pagenav ul {position: relative; margin-top: .35rem;} .pagenav ul::before {content: ""; height: 100%; width: 1px; background: #cbced7; position: absolute; left: 8px; top: 0;} .pagenav ul li {margin: .2rem 0;} .pagenav ul li a {display: flex; align-items: center; color: #666666; font-size: var(--font15);} .pagenav ul li i {width: 7px; margin-left: 5px; height: 7px; background: #c7cad4; border-radius: 50%; margin-right: .12rem; position: relative; z-index: 2;} .pagenav ul li:hover a {color: #005bac;} .pagenav ul li.on a {color: #005bac;} .pagenav ul li.on i {background: #005bac;} .pagenav ul li.active a {color: #005bac;} .pagenav ul li.active i {background: #005bac;} .mobfilemenu {display: none; margin-left: 10px;} .mobfilemenu dl {transform: rotateY(180deg);width: 30px; margin-right: 10px; cursor: pointer;} .mobfilemenu dl dd {width: 20px;height: 2px;background: #333;} .mobfilemenu dl dd:nth-child(2) {margin: 6px 0;} .mobfilemenu h4 {font-size: var(--font20);} .mobfileBox .top {} .mobfileBox .top .logo img {max-width: .4rem;} .mobfileBox .top .mobfileclose {width: 30px;height: 30px;position: relative; cursor: pointer;} .mobfileBox .top .mobfileclose:before, .mobfileBox .top .mobfileclose:after{content: "";position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);background: #333;border-radius: 1px;} .mobfileBox .top .mobfileclose:before{width: 20px;height: 2px;transform: translate(-50%,-50%) rotate(45deg);} .mobfileBox .top .mobfileclose:after{width: 2px;height: 20px;transform: translate(-50%,-50%) rotate(225deg);} .mobfileBox .top h2 {margin-left: .1rem;} .mobfilemask {position: fixed;left: 0; bottom: 0; z-index: 99;width: 100%;height: 100vh;background: rgba(7,16,26,0.8);transition: all 0.5s;visibility: hidden;opacity: 0;transition-delay: 0.2s;} .mobfilemask.active{opacity: 1;visibility: visible;} .mobfileBox {padding: .3rem 4%; width: 60%;height: calc(100vh - 81px);position: fixed;z-index: 100; bottom: 0;left: -50%;overflow-y: auto;opacity: 0;transition: all 0.3s; background: #fff; visibility: hidden;} .mobfileBox.active{transition-delay: 0.3s;opacity: 1;left: 0; visibility: visible;} @media screen and (min-width: 200px) and (max-width: 1200px) { .fileCen .le {width: 100%; height: auto; padding: .3rem;} .fileCen .le .navbox {display: none;} .fileCen .le .tit {display: none;} .fileCen .re {width: 100%;} .pagenav {display: none;} .mobfilemenu {display: flex;} } @media screen and (min-width: 200px) and (max-width: 767px) { .fileCon .mbx {display: none;} .mobfilemenu {margin-left: 0;} .mobfileBox {width: 100%;} .fileCon {padding: .5rem 4%; min-height: initial;} .fileCen .le {top: 60px;} } .filepage-editor img{max-width: 100%!important;} .filepage-editor li{LIST-STYLE-TYPE: auto!important; margin-left: 0.5rem!important;} .filepage-editor table{border-collapse: collapse; width: 100%!important;} /* 内页新闻列表页 */ .news-banner{background: url(../images/news-banner.jpg) no-repeat center; background-size: cover; height: 4.5rem; display: flex;} .nynews{margin-bottom: 1rem;} .news-class{margin: 0; padding: 0.37rem 0 0.44rem; border-bottom: 0.01rem solid #E2E2E2; margin-bottom: 0.52rem;} .news-list ul::after{content: ''; width: 30%;} .news-list ul li{background: #f9f9f9;border-radius: 0.1rem; width: 30%; margin-bottom: .52rem;} .news-list ul li .pic{overflow: hidden; border-top-left-radius: 0.1rem; border-top-right-radius: 0.1rem; height: 2.36rem;} .news-list ul li .pic img{display: block; width: 100%; height: 100%;object-fit: cover; -webkit-transition: opacity 1s, -webkit-transform 1s; transition: opacity 1s, transform 1s; -webkit-backface-visibility: hidden;backface-visibility: hidden;opacity: 1;} .news-list ul li:hover .pic img{-webkit-transform: scale3d(1.1,1.1,1);transform: scale3d(1.1,1.1,1);-webkit-transition: opacity 1s, -webkit-transform 1s;transition: opacity 1s, transform 1s;-webkit-backface-visibility: hidden;backface-visibility: hidden;} .news-list ul li .info{padding: .24rem 7% .35rem;} .news-list ul li .info h3{color: #333333; margin-bottom: .14rem;} .news-list ul li .info h4{color: #7f8c94; margin-bottom: .26rem;} /* 关于我们 */ .about-banner{background: url(../images/about-banner.jpg) no-repeat center top; background-size: cover; height: 5.03rem; display: flex;} .about-banner .banner-text{transform: translateY(0.5rem);} .about-banner .banner-text h2{font-weight: bold; margin-bottom: 1.4rem;} .about-class ul li{margin-right: .11rem;} .about-class ul li:last-child{margin-right: 0;} .about-class ul li a{display: block; line-height: 0.48rem;border: 0.01rem solid #ffffff;border-radius: 0.26rem; color: #fff; padding: 0 .3rem; transition: 0.6s;} .about-class ul li:hover a{background: #ffffff; color: #1662a9; font-weight: bold;} .about{padding: .84rem 0 .88rem;} .about-title strong{color: #333333;} .about .about-title{margin-bottom: .34rem;} .about .info{width: 79%; margin: 0 auto .44rem;} .about .info p{color: #555555; } .about-more a{width: 0.6rem;height: 0.6rem;border: 0.01rem solid #dddddd; border-radius: 50%; margin: 0 auto;} .about-more img{transition: 0.6s; width: 0.18rem;} .about-more a:hover img{transform: rotate(-45deg);} .culture{background: url(../images/culture-bg.jpg) no-repeat center; background-size: cover; background-attachment: fixed; padding: .86rem 0 1.08rem;} .culture .about-title{margin-bottom: .84rem;} .culture .about-title strong{color: #fff; display: block;} .about-title i{display: block; width: 0.6rem;height: 0.04rem;background: #ffffff; margin: 0.12rem auto 0;} .culture-list{} .culture-list ul li{width: 30%; height: 3rem;background: #ffffff;border-radius: 0.1rem; } .culture-list ul li img{display: block; margin: 0.37rem auto 0.2rem;} .culture-list ul li b,.culture-list ul li strong{display: block; font-weight: 700;} .culture-list ul li b{color: #005bac; margin-bottom: 0.06rem;} .culture-list ul li strong{color: #333333;} .develop{padding: .77rem 0 .57rem;} .develop .about-title{margin-bottom: .45rem;} .develop .about-title i{background: #005bac;} .develop-btn{position: relative; width: 89%;} .develop-btn ul li{text-align: center;} .develop-btn ul li em{ position: relative; color: #000; line-height: .4rem;} .develop-btn ul li em::after{content: "";position: absolute;left: 0;bottom: 0;width: 0;height: 2px;background-color: #0560af;transition: all 0.5s;} .develop-btn ul li:hover em,.develop-btn ul li.swiper-slide-thumb-active em{color: #0560af;} .develop-btn ul li:hover em::after,.develop-btn ul li.swiper-slide-thumb-active em::after{width: 100%;} .bold{font-weight: bold;} .develop-top{position: relative; margin-bottom: .64rem;} #btn-prev,#btn-next{position: absolute; top: 50%; transform: translateY(-50%); width: .7rem; height: .7rem; box-shadow: 0px 7px 25px 5px rgba(178, 178, 178, 0.15); border-radius: 50%; z-index: 5; cursor: pointer; background: url(../images/develop-arrow.png) no-repeat center; margin-top: 0; } #btn-prev{left: 0;} #btn-next{right: 0; background: url(../images/develop-arrow2.png) no-repeat center;} #btn-prev:hover{background: url(../images/develop-arrow3.png) no-repeat center;} #btn-next:hover{background: url(../images/develop-arrow4.png) no-repeat center;} .develop-list{background: url(../images/develop-bg.jpg) no-repeat center top;} .develop-list ul li .info{width: 53%;} .develop-list ul li .info h3{color: #005bac; margin-bottom: .3rem;} .develop-list ul li .info h4{} .develop-list ul li .pic{width: 47%; border-radius: .2rem; overflow: hidden;} .develop-list ul li .pic img{display: block; width: 100%; -webkit-transition: opacity 1s, -webkit-transform 1s; transition: opacity 1s, transform 1s; -webkit-backface-visibility: hidden;backface-visibility: hidden;opacity: 1;} .develop-list ul li:hover .pic img{-webkit-transform: scale3d(1.1,1.1,1);transform: scale3d(1.1,1.1,1);-webkit-transition: opacity 1s, -webkit-transform 1s;transition: opacity 1s, transform 1s;-webkit-backface-visibility: hidden;backface-visibility: hidden;} #about,#culture,#develop{position: relative; top: -.5rem;} /* 联系我们 */ .contact-bg{background: url(../images/contact-bg.jpg) no-repeat center top; padding: .17rem 0 0;} .contact-bg .position {margin-bottom: .85rem;} .contact-bg .position span{color: #005bac;} .contact-bg .position a{color: #888;} .contact-bg .position a:hover{color: #333;} .contact{margin-bottom: 1.07rem;} .contact .contact-title{margin-bottom: .61rem;} .contact-left{width: 16%;} .contact-left ul li{margin-bottom: .27rem;} .contact-left ul li a{display: block; line-height: 0.6rem;color: #333; transition: 0.6s; text-indent: .4rem; position: relative; z-index: 5;} .contact-left ul li a::after{position: absolute; content: ''; left: 0; width: 0; height: 100%; background: #005bac; transition: 0.6s; z-index: -1; border-radius: 0.3rem; } .contact-left ul li:hover a{ color: #fff; font-weight: bold;} .contact-left ul li:hover a::after{ width: 100%;} .contact-right{width: 81.52%;} .contact-right ul li{border-radius: 0.2rem; height: 2.97rem; margin-bottom: .35rem;} .contact-right ul li .pic{width: 47%; height: 100%; border-top-left-radius: 0.2rem; border-bottom-left-radius: 0.2rem; position: relative;} .contact-right ul li .pic b{position: absolute; content: ''; left: 0; bottom: 0; padding: 0 26px;line-height: 0.61rem;background: #0560af;font-weight: bold; text-align: center; border-bottom-left-radius: 0.2rem; border-top-right-radius: 0.15rem;} .contact-right ul li .info{width: 53%; box-sizing: border-box; background: #f9f9f9; border-top-right-radius: 0.2rem; border-bottom-right-radius: 0.2rem; padding-left: 3.5%;} .contact-right ul li .info p{align-items: flex-start; margin-bottom: .32rem;} .contact-right ul li .info p:last-child{margin-bottom: 0;} .contact-right ul li .info img{margin-right: .07rem;} .contact-right ul li .info span{color: #686868; display: block;} #address1,#address2,#address3,#address4{position: relative; top: -1.5rem;} .provider{background: #f8f8f8; padding: .81rem 0 .83rem;} .provider .contact-title{margin-bottom: .68rem;} .provider-list ul li{width: 26.25%;height: 215px;background: #ffffff;border-radius: 0.2rem;margin: 0 2.7%;display: flex;justify-content: center;align-items: center;} .provider-list ul li img{margin: 0 auto .23rem;display: block;} .provider-list ul li em{color: #666; display: block;} .provider-list ul li strong{color: #333;} .provider-list ul li:hover strong{text-decoration: underline;} .message-bg{background: url(../images/meaasge-bg.jpg) no-repeat center; padding: 1.05rem 0 1.03rem; background-size: cover; } .message-bg {} .message-bg .contact-title{margin-bottom: .61rem;} .contact-title em{display: block;} .message-box{background: #fff; background: #ffffff;border-radius: 0.2rem; width: 71.45%; margin: 0 auto; padding: .35rem 0 .44rem;} .message-form{width: 85%; margin: 0 auto;} .message-form ul{margin-bottom: .37rem;} .message-form ul li{border-bottom: 0.01rem solid #CCCCCC;width: 48%;line-height: .53rem;height: .53rem;overflow: hidden;} .message-form input,.message-form textarea{outline: none;border: none;width: 63%;box-sizing: border-box;padding: 0; min-height: auto;} .message-form ul li em{display: inline-block;color: #888888;margin-right: 0.1rem;} .message-form ul li i{color: #ba0703; font-style: inherit; margin-left: .06rem; font-weight: bold} .message-form ul.item{margin: .7rem 0 .37rem;} .message-form ul.item li{width: 100%;} .message-form textarea{resize: none;line-height: .53rem;height: .53rem; width: 87%;} .message-form .layui-btn{display: block; width: 155px;height: 54px; line-height: 54px; background: #0560af;border-radius: 4.27rem; margin: 0 auto; font-size: var(--font18); margin:0 auto} /* 登录 */ .bg{background: url(../images/bg.jpg) no-repeat center; height: 100vh; position: relative; background-size: cover;} .top-box{padding: 0 5%; box-sizing: border-box;} .bg-top {padding-top: 1.5vh;} .ver{line-height: 47px;background: #ffffff;border-radius: 1.24rem;width: 134px; justify-content: center;} .ver span{color: #888888; margin: 0 .07rem;} .bg-bottom{position: absolute; bottom: 0.25rem; width: 100%; padding: 0 5%; box-sizing: border-box;} .bg-bottom p{color: #888;} .bg-bottom a{color: #888;} .bg-bottom a:hover{color: #0560af;} .login{} .login-box{background: #ffffff;border-radius: 0.2rem; width: 5.1rem; padding: 0.43rem 2.8% 0.64rem; box-sizing: border-box; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);} .login-box strong{display: block; text-align: center; margin-bottom: .38rem;} .login-form input{border-radius: 0.32rem;height: .61rem; line-height: .61rem; padding: 0 15.7%!important; box-sizing: border-box;} .login-form .layui-form-item{ box-sizing: border-box; margin-bottom: .31rem;} .login-form .layui-input-prefix{width: .63rem; padding: 0!important;} .login-form button{width: 100%;height: 0.61rem; line-height: 0.61rem;background: #004384;border-radius: 0.31rem;font-size: var(--font18); } .login-box a{display: block; color: #666; text-decoration: underline; text-align: center;} .register-form .layui-form-item{margin-bottom: .23rem;} .register-form .code-item{position: relative;} .register-form .code{position: absolute; right: 0.09rem; top: 50%; transform: translateY(-50%); border-radius: 0.21rem;} .news-bg{background: #f9f9f9; padding-bottom: 0.44rem; } .newsxq-box { display: flex; justify-content: space-between; align-items: flex-start;} .news-left {width: 68%;} .news-left .newsCon {background: #ffffff;border-radius: .1rem;box-shadow: 0rem 0rem 0.4rem 0rem rgba(226,225,224,0.42); padding: .4rem; box-sizing: border-box;} .newsxq-title {border-bottom: 1px solid #ddd; padding-bottom: 0.4rem;} .newsxq-title strong {display: block; font-size: 0.34rem; color: #333;font-weight: 700;} .newsxq-title span {display: block;margin-top: .1rem; color: #777;} .newsxq-editbox {margin: .3rem 0;} .newsxq-editbox img {display: block; max-width: 100%; height: auto !important; margin: 0 auto} .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: #0560af; border-color: #0560af; } .newsxq-page a:hover svg path {fill: #fff;} .newsxq-box .news-right {width: 29%;background: #fff; border-radius: .15rem;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;} .newsxq-box .news-right h2 {font-size: var(--font26); font-weight: 700;} .newsDate .relist li a {display: flex; justify-content: space-between;} .newsDate .relist .reImg {width: 35%;border-radius: 5px; overflow: hidden; min-height: .9rem;} .newsDate .relist .reImg img {width: 100%; height: 100%;object-fit: cover; transition: .35s;} .newsDate .relist .recon {width: 58%;} .newsDate .relist li {margin-top: .3rem;} .newsDate .relist span {color: #999999; font-size: var(--font14);} .newsDate .relist h6 {color: #333333; font-size: var(--font17); transition: .35s; margin-top: .05rem;} .newsDate .relist li:hover h6 {color: #0560af;} .newsDate .relist li:hover .reImg img {transform: scale(1.05);} .newsDate .news-right::after {content: ""; background: #0560af; width: 65%; position: absolute; left: 50%; bottom: -1.5%; height: .07rem; border-radius: 4px; transform: translate(-50%, -50%);} /* 加入购物车 */ .shop-bg{background: url(../images/shop-bg.jpg) no-repeat center top #f7f7f7; padding: .6rem 0 1.28rem;} #app{} .shoppingBar h2{color: #333; font-weight: bold; margin-bottom: .32rem;} .shop-table{width: 100%; border-collapse: collapse; border: 0.01rem solid #cccccc; text-align: center;} .shop-table tr{border-bottom: 0.01rem solid #cccccc; } .shop-table tr th{font-weight: bold; } .shop-table tr th:first-child{padding-left: 1.8%;text-align: left; } .shop-table .shop-title{} .shop-table .shop-title th{color: #4b4b4b; background: #dae2e9; height: 50px;} .shop-table .small-pic{width: 6.5%;} .shop-table .small-pic img{display: block; max-width: 100%;} .shop-table tr th em{font-weight: normal;} .shop-table tr th p{color: #005bac; font-family: Arial;font-weight: 700;} .shop-table tr th.money{color: #4b4b4b;} .shop-table tr.commodity th{height: .79rem;} .shop-table tr th.content{text-align: left;} .shop-table tr .txt-l{width: 23%; padding-left: 5%;} .shop-table button{width: 0.35rem;height: 0.35rem;background: #005bac;border-radius: 0.05rem; display: inline-flex; align-items: center; justify-content: center;} .shop-table span.count{width: 0.89rem;line-height: 0.35rem;background: #ffffff;border-radius: 0.05rem; margin: 0 0.07rem;} .shoppingBar-footer { display: flex; justify-content: flex-end; margin-top: .65rem;} .shoppingBar-footer .buy{align-items: end;} .shoppingBar-footer .buy span{color: #005bac; font-weight: bold;} .shoppingBar-footer .buy em{color: #333;} .shoppingBar-footer button{width: 135px;line-height: 49px;background: #005bac;border-radius: 1.25rem; text-align: center; margin-left: .29rem;} .shop-table tr th.checkbox input{width: 0.18rem;height: 0.18rem;background: #ffffff;border: 0.01rem solid #cccccc;border-radius: 0.02rem; margin-right: .13rem;} .shop-table tr th h3{color: #4b4b4b; font-size: var(--font15); font-weight: bold; } .indexOne .bd .inBd li dd .icBox { width: 50px; height: 50px;} .parameter-editor table tr td p{text-indent: 0!important;} .parameter-editor table tr td{padding-left: 2%!important;} .prodetails-editor img{max-width: 100%!important; height: auto!important;} #parameter,#specifications,#consult{position: relative; top: -1rem} /* 2025.4.16首页新增地图 */ .indexFive{padding: .32rem 0 .42rem;} /* .map-box{min-height: 7.72rem;} */ .map-box .info{width: 28.75%;} .map-box .info h4{margin: .24rem 0 2.16rem;} .map-btn ul li{cursor: pointer; width: auto!important;} .map-btn ul li em{color: #bfbebe;} .map-btn ul li .icon{width: .12rem; height: .12rem; border-radius: 50%; background: #bfbebe; min-width: 6px; min-height: 6px; margin-right: .13rem; transition: 0.6s;} .map-btn ul li.swiper-slide-thumb-active .icon{-webkit-box-shadow: 0 0 0 0.06rem rgba(0, 91, 172,.1); box-shadow: 0 0 0 0.06rem rgba(0, 91, 172,.1); background: #005bac;} .map-btn ul li.swiper-slide-thumb-active em{color:#005bac} .map-list{flex:0.95; overflow: hidden;} .map-list ul li{height: auto!important;} .map-list ul li .pic{display: flex; justify-content: center; align-items: center; height: 100%;} .map-list ul li .pic img{display: block; max-width: 100%;} .indexMain #c-placeholder{display: none} .search-page li span{margin-top: 0.3rem;display: inline-block;} /* 2025.5.7搜索框架调整 */ @media screen and (min-width: 200px) and (max-width: 767px) { .hadbox-sec4 { padding: .6rem 0; } } .hadbox-sec4 .form .layui-col {margin-right: .2rem; width: 10%; min-width: 100px;} .hadbox-sec4 .form .layui-col .layui-form-select input {background: #f6f6f6; border-radius: 100px; height: .5rem; min-height: 45px; text-align: center;} .hadbox-sec4 .form .layui-col .layui-form-select dl {top: 100%;} /* 搜索页面 */ .searchlist .form .layui-col {margin-right: .2rem; width: 20%; min-width: 100px;} .searchlist .form .layui-col .layui-form-select input {background: #f6f6f6; border-radius: 100px; height: .5rem; min-height: 45px; text-align: center;} .searchlist .form .layui-col .layui-form-select dl {top: 100%;} /*2025.6.27*/ .proSlideDown .bd .inBd dl {grid-template-columns: repeat(2, 1fr);gap: 0 .01rem;display: grid;} /* 2025.7.22 增加使用指南列表页*/ .guide-list ul li{border-bottom: 1px solid #c7c7c7; } .guide-list ul li a{padding: .1rem 2%;} .guide-list ul li em{color: #333; position: relative; padding-left: .15rem; width: 80%;} .guide-list ul li em::after{position: absolute; content: ''; width: .06rem; height:.06rem; min-width: 4px; min-height: 4px; background: #333; border-radius: 50%; left: 0; top: 50%; transform: translateY(-50%);} .guide-list ul li:hover em{color:#005bac} .product-list ul{display: grid; grid-template-columns: repeat(4, 1fr); gap: .36rem .5rem;} /*2025.11.29*/ .parameter-editor img{display: block; max-width: 100%!important; height: auto!important;} /*2025.12.22*/ .develop{display: none;