@charset "utf-8";

/* banner */
.banner {
    width: 100%;
    position: relative;
}

.idxbanner {
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

.idxbanner video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.top {
    width: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 2;
}

.tophead {
    width: 100%;
    height: 100px;
}

.logo a img {
    height: 50px;
    /* height: 60px; */
    transition: all 0s;
    filter: grayscale(1000%) brightness(1000%);
}

.nav {
    height: 100%;
}

.nav ul {
    height: 100%;
}

.nav ul li {
    margin: 0px 20px;
    height: 100%;
    cursor: pointer;
    position: relative;
}

.navline {
    position: absolute;
    width: 1px;
    height: 3px;
    background-color: rgb(0, 113, 255);
    left: 49%;
    top: 49%;
    transition: all .3s;
    opacity: 0;
}

.nav>ul>li>a {
    font-size: 18px;
    color: #ffffff;
    line-height: 100px;
    display: block;
    font-weight: 600;
}

.nav>ul>li:hover>a {
    color: rgb(0, 113, 255);
}

.nav ul li:hover .navline {
    top: 0px;
    left: 0px;
    opacity: 1;
    width: 100%;
}

.nav ul li.lang a {
    color: rgba(255, 255, 255, 0.5);
}

.nav ul li.lang a.active,
.nav ul li.lang a:hover {
    color: #ffffff;
    text-decoration: underline;
    text-underline-offset: 6px;
    text-decoration-thickness: 2px;
}

.lang span {
    font-size: 20px;
    color: #ffffff;
    font-weight: 500;
    margin: 0px 10px;
}

.navxl {
    position: absolute;
    top: 99px;
    left: 0px;
    width: 250px;
    box-shadow: rgba(17, 23, 21, 0.2) 2px 2px 9px 2px;
    background-color: rgb(255, 255, 255);
    transition: all 0s;
    display: none;
}

.navxl dd {
    border-top: 1px solid rgb(217, 217, 217);
}

.navxl dd:first-child {
    border-top: 0px;
}

.navxl dd a {
    color: rgb(64, 69, 73);
    font-size: 16px;
    padding: 20px;
    display: block;
}

.navxl dd a:hover {
    background-color: rgb(217, 217, 217);
}

.bannertext {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
}

.bannertext .con1600 {
    height: 100%;
}

.bannertextbox {
    width: 50%;
    height: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}

.bannertextbox h3 {
    color: rgb(255, 255, 255);
    font-size: 18px;
    margin-bottom: 20px;
}

.bannertextbox h2 {
    color: rgb(255, 255, 255);
    font-size: 60px;
    line-height: 1.4;
}

.bannerico {
    position: absolute;
    bottom: 70px;
    width: 100%;
}

.bannericobox {
    width: 186px;
    height: 186px;
    float: right;
    position: relative;
}

.bannericoimg img {
    /* transform: perspective(600px) translate3d(0px, 0px, 0px) rotate(281.8deg); */
    animation: mymove 10s infinite linear;
}

.bannericojt {
    position: absolute;
    width: 70%;
    height: 70%;
    background-color: rgb(0, 113, 255);
    border-radius: 50%;
    top: 15%;
    left: 15%;
}
.bannericojt a {
    width: 100%;
    height: 100%;
    justify-content: center;
}
.bannericojt img {
    width: 18px;
}

/* idxtech */
.idxtech {
    width: 100%;
    height: auto;
    padding: 100px 0px;
}

.idxtechsort {
    text-align: center;
}

.idxtechsort h3 {
    font-size: 24px;
    font-weight: bold;
    color: rgb(0, 113, 255);
    margin-bottom: 30px;
}

.idxtechsort h4 {
    color: rgb(20, 20, 20);
    font-size: 46px;
    font-weight: bold;
    line-height: 1.4;
}

.idxtechlist {
    margin-top: 80px;
}

.idxtechlist ul li {
    width: 24%;
    height: 440px;
    border-radius: 28px;
    overflow: hidden;
    position: relative;
}

.idxtechlistimg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.idxtechlisttext {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
}

.idxtechlisttext h3 {
    color: rgb(255, 255, 255);
    font-size: 24px;
    font-weight: bold;
    padding: 0px 50px;
    height: 100px;
}

.idxtechlicon {
    position: absolute;
    top: 40px;
    right: -100px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    justify-content: center;
    transition: all .3s;
    background-color: rgb(0, 113, 255);
}

.idxtechlicon img {
    width: 15px;
}

.idxtechlist ul li:hover .idxtechlicon {
    right: 50px;
}

.gdwords span {
    color: rgb(247, 247, 250);
    font-size: 120px;
    font-weight: bold;
    text-transform: uppercase;
}

.idxgdwords .swiper-wrapper {
    transition-timing-function: linear;
}

.idxgdwords .swiper-slide {
    width: auto;
}

.fixednav {
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 9;
    box-shadow: 0px 0px 5px rgba(17, 23, 21, 0.2);
    background-color: #ffffff;
}

.fixednav .logo a img {
    filter: unset;
}

.fixednav .nav>ul>li>a,
.fixednav .lang span {
    color: rgb(64, 69, 73);
}
.fixednav .nav>ul>li.lang a {
     color: rgba(64, 69, 73,.7);
}
.fixednav .nav ul li.lang a.active,
.fixednav .nav ul li.lang a:hover {
    color: rgb(20, 20, 20);
}

.idxvision {
    width: 100%;
    padding: 100px 0px;
    height: auto;
    background: url(../images/home-bg-1.jpg) no-repeat center center;
    background-size: cover;
}

.idxvisionsort {
    text-align: center;
}

.idxvisionsort h3 {
    color: rgb(255, 255, 255);
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 20px;
}

.idxvisionsort h4 {
    color: rgb(255, 255, 255);
    font-weight: bold;
    font-size: 46px;
    line-height: 1.6;
}

.idxvisionlist {
    width: 100%;
    margin-top: 60px;
    padding: 50px;
    background-color: rgba(0, 0, 0, 0);
    background-image: linear-gradient(rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0.25) 100%);
}

.idxvisionlist ul li {
    width: 33%;
    text-align: center;
    border-left: 1px solid rgba(255, 255, 255, 0.2);
    height: auto;
}

.idxvisionlistimg {
    margin-bottom: 20px;
}

.idxvisionlistimg img {
    height: 70px;
}

.idxvisionlistdesc h4 {
    font-size: 22px;
    font-weight: bold;
    color: rgb(255, 255, 255);
    margin-bottom: 10px;
}

.idxvisionlistdesc p {
    color: rgb(217, 217, 217);
    font-size: 20px;
    line-height: 1.4;
}

.idxvisionlist ul li:first-child {
    border-left: 0px;
}

.idxcustomer {
    padding: 100px 0px 150px;
    width: 100%;
}

.idxcustomlist {
    margin-top: 60px;
}

.idxcustomlist ul li {
    width: 20%;
    height: 100px;
    text-align: center;
    margin-bottom: 20px;
    /* background-color: #f7f7f7;
    border-radius: 50%; */
}

.idxcustomlist ul li img {
    height: 100%;
    width: 100%;
    object-fit: contain;
}

.idxcontnews {
    width: 100%;
}

.idxconewsl {
    width: 50%;
    height: 465px;
    padding: 100px 50px;
    background: url(../images/home-contact.jpg) no-repeat center center;
    background-size: cover;
}

.idxconewsr {
    background-image: url(../images/home-news.jpg);
}

.idxconewsltext {
    width: 100%;
    height: 100%;
}

.idxconewsltext h4 {
    color: rgb(255, 255, 255);
    font-size: 20px;
    font-weight: bold;
    line-height: 1.6;
    margin-bottom: 30px;
}

.idxconewsltext h5 {
    color: rgb(255, 255, 255);
    font-size: 36px;
    font-weight: bold;
    line-height: 1.8;
}

.idxconewslbtn {
    margin-top: 30px;
    width: 200px;
    height: 60px;
    justify-content: center;
    border-radius: 60px;
    border: 1px solid rgba(255, 255, 255, 0.5);
}

.idxconewslbtn p {
    position: relative;
    width: 80px;
}

.idxconewslbtn p span {
    color: rgb(255, 255, 255);
    font-size: 18px;
    display: block;
    transition: all .3s;
}

.idxconewslbtn p span.hover2 {
    opacity: 0;
    position: absolute;
    pointer-events: none;
    transform: translateY(0%);
}

.idxconewslbtn img {
    width: 15px;
    margin-left: 20px;
    transition: all 0s;
    filter: grayscale(1000%) brightness(1000%);
}

.idxconewslbtn:hover {
    background-color: rgb(0, 113, 255);
    border-color: rgb(0, 113, 255);
}

.idxconewslbtn:hover p span.hover1 {
    opacity: 0;
    transform: translateY(-100%);
}

.idxconewslbtn:hover p span.hover2 {
    opacity: 1;
    transform: translateY(-100%);
}

.idxconewsr .idxconewslbtn:hover {
    background-color: #ffffff;
}

.idxconewsr .idxconewslbtn:hover p span {
    color: rgb(0, 113, 255);
}

.idxconewsr .idxconewslbtn:hover img {
    filter: unset;
}

.footer {
    width: 100%;
    padding: 80px 0px 60px;
    background-color: rgb(25, 25, 25);
}

.footerbox,
.footerboxl {
    align-items: flex-start;
}

.footerboxl a img {
    height: 58px;
    filter: brightness(150%) grayscale(150%);
}

.footerboxm {
    margin-left: 70px;
}

.footerboxm p {
    color: rgba(185, 185, 185, 0.7);
    font-size: 16px;
    line-height: 1.8;
}

.footerboxm p span {
    color: rgb(255, 255, 255);
    font-size: 16px;
    margin-left: 20px;
}

.footerboxm p span.footspan {
    margin-left: 0px;
}

.footerboxr a {
    color: rgb(185, 185, 185);
    font-size: 16px;
    line-height: 1.8;
    margin-right: 30px;
    padding: 20px 40px;
    transition: all .3s;
    border-radius: 30px;
    border: 1px solid rgb(64, 69, 73);
}

.footerboxr a:hover {
    color: rgb(255, 255, 255);
    background-color: rgb(64, 69, 73);
}

.backtop {
    width: 50px;
    height: 35px;
    background-color: rgb(51, 51, 51);
    border-radius: 6px 6px 0px 0px;
    position: fixed;
    bottom: 0px;
    right: 50px;
    z-index: 99;
    display: none;
}

.backtopbox {
    width: 100%;
    height: 100%;
    justify-content: center;
}

.backtop img {
    max-width: 70%;
    height: 60%;
    object-fit: contain;
    filter: grayscale(15000%) brightness(15000%);
}

.backtop:hover {
    background-color: #0352b8;
}

.neibanner {
    height: 500px;
}

.neibanner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.neibannertext {
    padding-top: 200px;
}

.neibannertext p {
    font-size: 16px;
    color: rgb(255, 255, 255);
}

/* ceo */

.ceopage {
    width: 100%;
    height: auto;
}

.ceopagetop {
    padding: 130px 0px 80px;
}

.ceopagetop h2 {
    color: rgb(20, 20, 20);
    font-size: 46px;
    font-weight: bold;
}

.ceopagetop img {
    width: 100%;
    margin-top: 50px;
    border-radius: 30px;
}

.ceopagebox {
    padding: 50px 0px 100px;
    align-items: flex-start;
}

.ceopageboxl {
    width: 43%;
}

.ceopageboxl h3 {
    color: rgb(3, 82, 184);
    font-weight: bold;
    font-size: 36px;
    margin-bottom: 20px;
}

.ceopageboxl h4 {
    color: rgb(20, 20, 20);
    font-size: 30px;
    font-weight: bold;
    line-height: 1.8;
}

.ceopageboxl p {
    color: rgb(64, 69, 73);
    font-size: 20px;
    line-height: 1.8;
}

.ceopageboxl p strong {
    color: rgb(64, 69, 73);
    font-size: 20px;
    line-height: 1.6;
}

.mainbox {
    width: 100%;
    margin: 14px auto;
    position: relative;
    align-items: flex-start;
}

.hcleft {
    width: 40%;
    float: left;
    padding-top: 200px;
}

.hcleftbox h2 {
    color: rgb(20, 20, 20);
    font-size: 46px;
    font-weight: bold;
    margin-bottom: 30px;
}

.hcleftbox p {
    color: rgb(64, 69, 73);
    font-size: 20px;
    line-height: 1.8;
}

.hcright {
    width: 50%;
    padding: 200px 0px 80px;
    float: right;
}

.hcright ul li {
    margin-bottom: 80px;
}
.hcright ul li:last-child {
    margin-bottom: 0px;
}
.hcright ul li img {
    width: 100%;
    border-radius:30px ;
}
.hcright ul li h3 {
    color: rgb(20, 20, 20);
    font-weight: bold;
    font-size: 36px;
    margin:50px 0px 20px;
}
.hcright ul li p {
    color: rgb(64, 69, 73);
    font-size: 20px;
    margin-bottom: 15px;
    padding-left: 20px;
    background: url(../images/fangkuai.png) no-repeat left ;
    background-size: 8px;
    background-position-y: 10px;
}

.jointop {
    width: 100%;
    background-color: #ffffff;
    padding: 130px 0px 100px;
}

.jointopdesc {
    width: 100%;
    margin-bottom: 50px;
}

.jointopdesc h2 {
    color: rgb(20, 20, 20);
    font-size: 46px;
    font-weight: bold;
    margin-bottom: 30px;
}

.jointopdesc p {
    color: rgb(64, 69, 73);
    font-size: 20px;
    line-height: 1.6;
}

.joinuslist ul {
    margin-bottom: 20px;
}

.joinuslist ul li {
    width: 24%;
    height: 352px;
    border: 1px solid rgb(206, 211, 224);
    border-radius: 10px;
    padding: 30px 40px;
}


.joinuslist ul li img {
    height: 70px;
}

.joinuslist ul li h3 {
    color: rgb(20, 20, 20);
    font-size: 24px;
    font-weight: bold;
    margin: 20px 0px 15px;
}

.joinuslist ul li p {
    color: rgb(64, 69, 73);
    font-size: 18px;
    line-height: 1.6;
}

.joinuslist ul.joinuslist2 li {
    width: 32.5%;
}

.joincret {
   background-color:  rgb(247, 247, 250);
   padding: 100px 0px;
}

.jcname h2 {
    color: rgb(20, 20, 20);
    font-size: 46px;
    font-weight: bold;
    margin-bottom:50px;
}

.jclist ul li {
    float: left;
    width: 17%;
    margin-right: 2.9%;
    margin-bottom: 30px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid rgb(217, 217, 217);
}
.jclistimg {
    width: 100%;
    height: 355px;
    /* background-color: #f0f0f0; */
}
.jclistimg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.jclisttext {
   text-align: center;
    height: 60px;
    background-color: rgb(230, 229, 229);
    justify-content: center;
}
.jclisttext h3 {
    color: rgb(64, 69, 73);
    font-size: 20px;
    font-weight: bold;
    line-height: 2;
}

.jclist ul li:nth-child(5n) {
    margin-right: 0px;
}


.historymain {
    padding-bottom: 150px;
}
.historyname {
    padding-top: 130px;
}
.historyname h2 {
    color: rgb(20, 20, 20);
    font-size: 46px;
    font-weight: bold;
    margin-bottom: 30px;
}
.historyname p {
    color: rgb(64, 69, 73);
    font-size: 20px;
    line-height: 1.6;
}

.historybox {
    width: 100%;
    align-items: flex-start;
}
.hisleft {
    width: 32%;
    justify-content: flex-start;
    padding-top: 130px;
}
.hisleft h3 {
    color: rgb(3, 82, 184);
    font-size: 36px;
    font-weight: bold;
}
.hislline {
    width: 130px;
    height: 1px;
    margin-left: 30px;
    background-color:  rgb(3, 82, 184);
}

.hisright {
    width: 65%;
    padding-top: 125px;
}
.hisrighttop {
    align-items: flex-start;
    justify-content: flex-start;
}
.hisrighttop h3 {
    color: rgb(20, 20, 20);
    font-size: 36px;
    font-weight: bold;
    line-height: 1.6;
    margin-right: 100px;
}
.hisrighttop h4 {
    color: rgb(20, 20, 20);
    font-size: 36px;
    line-height: 1.6;
}

.hisrightmid {
    width: 100%;
    border-radius: 20px;
    overflow: hidden;
    margin: 30px 0px;
}
.hisrightmid img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hisrightbot p {
    color: rgb(64, 69, 73);
    font-size: 20px;
    line-height: 1.8;
    padding-left: 20px;
    margin: 12px 0px;
    background: url(../images/fangkuai.png) no-repeat left ;
    background-size: 8px;
    background-position-y: 14px;
}



.equiptop {
    padding: 130px 0px;
}

.sheibeiname h2 {
    color: rgb(20, 20, 20);
    font-size: 46px;
    font-weight: bold;
    margin-bottom: 30px;
}
.sheibeiname p {
    color: rgb(64, 69, 73);
    font-size: 20px;
}
.shebeilist ul li {
    width: 100%;
    margin-top: 120px;
}
.shebeilistimg {
    float: left;
    width: 45%;
    border-radius: 30px;
    overflow: hidden;
}
.shebeilistimg img {
    width: 100%;
    object-fit: cover;
}
.shebeilistimg img:hover {
    transform: scale(1.1);
}
.shebeilistdesc {
    width: 45%;
    float: right;
}
.shebeilidesctop {
    padding-bottom: 40px;
    border-bottom: 1px solid rgb(217, 217, 217);
}
.shebeilidesctop img {
    height: 90px;
}
.shebeilidesctop h3 {
    color: rgb(20, 20, 20);
    font-size: 36px;
    font-weight: bold;
    margin: 50px 0px 15px;
}
.shebeilidesctop h4 {
 color: rgb(20, 20, 20);
 font-size: 24px;
 line-height: 1.6;   
}

.shebeilidescbot {
    padding-top:50px;
}
.shebeilidescbot h4 {
    color: rgb(20, 20, 20);
    font-size: 24px;
    margin-bottom: 15px;
}
.shebeilidescbotbox {
    width: 100%;
}
.sblidescbotboxl {
    width: 100%;
    align-items: flex-start;
}
.sblidescbotboxl p {
    width: 48%;
    padding-left: 20px;
    color: rgb(64, 69, 73);
    line-height: 1.6;
    font-size: 20px;
    background: url(../images/fangkuai.png) no-repeat left ;
    background-size: 8px;
    background-position-y: 14px;
    margin: 12px 0px;
}
.shebeilist ul li:nth-child(2n) .shebeilistimg {
    float: right;
}
.shebeilist ul li:nth-child(2n) .shebeilistdesc {
    float: left;
}

.gsover {
    background-color: rgb(247, 247, 250);
    padding: 130px 0px;
}

.gsoverlist ul li {
    width: 32%;
    float: left;
    height:295px ;
    border-radius:10px ;
    overflow: hidden;
    margin-right: 1%;
    margin-bottom: 15px;
}
.gsoverlist ul li img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.gsoverlist ul li:nth-child(3n) {
    margin-right: 0px;
}
.gsoverlist ul li:hover img {
    transform: scale(1.1);
}

.mapdw {
    margin: 50px 0px;
} 
.maptext p {
    color: rgb(64, 69, 73);
    font-size: 18px;
    border-bottom: 1px solid rgb(217, 217, 217);
    padding: 15px 0px;
}
.maptext strong {
    color: rgb(20, 20, 20);
    font-size: 20px;
    margin-right: 20px;
}

.prosort ul li {
    width: 100%;
    margin-top: 180px;
}

.prosortimg {
    width: 100%;
    height: 450px;
    border-radius: 30px;
    overflow: hidden;
    position: relative;
}
.prosortimg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.prosortimg img:hover {
    transform: scale(1.1);
}
.prosortimgonbg {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: rgb(59, 59, 59);
}

.prosorttext {
    align-items: flex-start;
    margin-top: 50px;
}
.prosorttextl {
    width: 40%;
}
.prosorttextl h4 {
    color: rgb(3, 82, 184);
    font-weight: bold;
    font-size: 20px;
}
.prosorttextl h3 {
    color: rgb(20, 20, 20);
    font-size: 46px;
    font-weight: bold;
    margin: 25px 0px;
}
.prosorttextl p {
    color: rgb(64, 69, 73);
    font-size: 20px;
    line-height: 1.8;
}

.prosorttextl a {
    width: 220px;
    height: 60px;
    background-color: rgb(0, 113, 255);
    justify-content: center;
    border-radius: 30px;
    margin-top: 30px;
    transition: all 0.5s;
}
.prosorttextl a span {
    font-size: 16px;
    color: rgb(255, 255, 255);
}
.prosorttextl a img {
    width: 13px;
    margin-left: 30px;
    filter: grayscale(1500%) brightness(1500%);
}
.prosorttextl a:hover {
    background-color: rgb(10, 95, 199);
}
.prosorttextr {
    width: 45%;
}
.prosorttextr h3 {
    color: rgb(20, 20, 20);
    font-weight: bold;
    font-size: 24px;
    padding-bottom: 15px;
    border-bottom: 2px solid rgb(20, 20, 20);
}
.prosorttextr dl dd {
    color: rgb(20, 20, 20);
    font-size: 16px;
    padding: 15px 0px;
    border-bottom: 1px solid rgb(217, 217, 217);
}

.prolist {
    margin-top: 100px;
}

.prolist ul li {
    float: left;
    width: 32%;
    height: 565px;
    margin-right: 2%;
    margin-bottom:100px;
    position: relative;
}
.prolist ul li:nth-child(3n) {
    margin-right: 0px;
}
.prolist ul li a {
    width: 100%;
    height: 100%;
}
.prolistbox {
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    border: 1px solid rgb(217, 217, 217);
    border-radius: 20px;
    position: absolute;
    left: 0px;
    top: 0px;
    transition: all .3s;
    z-index: 4;
}
.prolistimg {
    width: 100%;
    height: 70%;
    justify-content: center;
}
.prolistimg img {
    width: 90%;
    height: 90%;
    object-fit: contain;
}

.prolistline {
    width: 50%;
    height: 1px ;
    margin: 0px auto 30px;
    background-color: rgb(217, 217, 217);
}

.prolisttext {
    width: 100%;
    height: 30%;
    text-align: center;
}
.prolisttext h3 {
    color: rgb(64, 69, 73);
    font-size: 20px;
    margin: 10px 0px
}
.prolisttext h4 {
    color: rgb(3, 82, 184);
    font-size: 32px;
    font-weight: bold;
}

.prolistmore {
    position: absolute;
    bottom: 0px;
    left: 10%;
    width: 80%;
    text-align: center;
    border-radius: 10px;
    height: 60px;
    background: rgb(10, 95, 199) ;
    transition: all .3s;
    z-index: 2;
}
.prolistmore p {
    color: rgb(255, 255, 255);
    font-size: 18px;
    line-height: 60px;
}
.prolistmore:hover {
    background:rgb(3, 82, 184);
}
.prolist ul li:hover .prolistbox {
   width: 94%;
   left: 3%;
   border-color: #0352b8;
   margin: -60px auto 0px;
}

.productpos {
    width: 100%;
    height: 100px;
    border-bottom: 2px solid rgb(20, 20, 20);
}
.productposl {
    background: url(../images/posico.png) no-repeat left center;
    padding-left: 30px;
    background-size: 23px;
}
.productposl p {
    color: rgb(20, 20, 20);   
    font-size: 30px;
}

.probacksort {
    width: 145px;
    height: 48px;
    border: 1px solid rgba(20, 20, 20, 0.5);
    border-radius: 5px;
    justify-content: center;
}
.probacksort span {
    font-size: 14px;
    color: rgb(20, 20, 20);
}
.probacksort img {
    height: 13px;
    transition: all 0s;
    margin-left: 25px;
}
.probacksort:hover {
    background-color: rgb(20, 20, 20);
    border-color: rgb(20, 20, 20);
}
.probacksort:hover span {
    color: rgb(255, 255, 255);
}
.probacksort:hover img {
    filter: grayscale(10000%) brightness(10000%);
}


.propagetop {
    align-items: flex-start;
    padding-top: 80px;
}
.propagetopl {
    width: 45%;
    position: relative;
    z-index: 2;
}
.prodetail_swiper {
    width: 80%;
    margin: 0 auto;
}
.propagetopl .swiper-slide {
    border: 1px solid rgb(217, 217, 217);
    border-radius: 15px;
}
.proswiperpics img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
.propagetopl .swiper-button-next:after, .propagetopl .swiper-button-prev:after {
    color: rgb(64, 69, 73);
    font-size: 24px;
    font-weight: bolder;
}
.prodetail_pagination  {
    width: 100%;
    height: 50px;
    padding-top: 30px;
}
.prodetail_pagination .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    margin: 0px 4px;
}

.propagetopr {
    width: 50%;
}

.prodetailtop h4 {
    color: rgb(185, 185, 185);
    font-size: 20px;
    font-weight: bold;
}
.prodetailtop h3 {
    color: rgb(20, 20, 20);
    font-size: 46px;
    font-weight: bold;
    margin: 20px 0px;
}

.prodetailtop h5 {
    color: rgb(64, 69, 73);
    font-size: 20px;
    line-height: 1.6;
}

.prodetailmid {
    border-bottom: 1px solid rgb(217, 217, 217);
    justify-content: flex-start;
    padding: 50px 0px 40px;
}

.prodetailmid a {
    width: 195px;
    height: 50px ;
    justify-content: center;
    margin-right: 20px;
    border-radius: 25px;
    border: 1px solid rgb(10, 95, 199);
}
.prodetailmid a span {
    color:  rgb(3, 82, 184);
    font-size: 16px;
    display: block;
}
.prodetailmid a img {
    width: 14px;
    margin-left: 40px;
    transition: all 0s;
}
.prodetailmid a:hover {
    background-color: rgb(10, 95, 199);
}
.prodetailmid a:nth-child(2) {
    background-color: rgb(10, 95, 199);
    width: 165px;
}
.prodetailmid a:hover span,.prodetailmid a:nth-child(2) span {
    color: rgb(255, 255, 255);
}
.prodetailmid a:hover img{
    filter: grayscale(10000%) brightness(10000%);
}

.prodetailmid a:nth-child(2) img {
    width: 20px;
    margin-left: 30px;
    filter: grayscale(10000%) brightness(10000%);
}

.prodetailbot ul li {
    width: 100%;
    height: auto;
    cursor: pointer;
    padding: 30px 0px;
    border-bottom: 1px solid rgb(217, 217, 217);
}

.prodetailbtitle h3 {
    font-size: 24px;
    font-weight: bold;
    color: rgb(20, 20, 20);
}
.prodetailbtitle span {
   color: rgb(20, 20, 20);
   font-weight: bold;
   font-size: 30px;
}
.prodetailbtext {
    padding-top: 20px;
    display: none;
}
.prodetailbtext p {
    color: rgb(64, 69, 73);
    font-size: 18px;
    line-height: 1.8;
}

.tjpros {
    background-color:rgb(247, 247, 250) ;
    padding: 100px 0px;
}
.tjprostit h3 {
    color: rgb(20, 20, 20);
    font-size: 46px;
    font-weight: bold;
    text-align: center;
}
.tjproslist {
    margin-top: 50px;
}
.tjproslist ul  {
    align-items: flex-start;
}
.tjproslist ul li {
    width: 24%;
    height: auto;
}

.tjproslimg {
    width: 100%;
    height:280px ;
    border-radius: 10px;
    overflow: hidden;
}
.tjproslimg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.tjprosltext {
    padding: 15px 0px;
    width: 100%;
    border-bottom: 2px solid rgb(20, 20, 20);
}
.tjprosltext h4 {
    color: rgb(20, 20, 20);
    font-size: 20px;
    font-weight: bold;
    text-align: center;
}
.tjproslimg img:hover {
    transform: scale(1.1);
}

.aboutuspage {
    padding: 0px 0px 470px;
    position: relative;
}
.aboutusimg {
    width: 100%;
    position: absolute;
    bottom: -150px;
    left: 0px;
    border-radius: 50px;
    overflow: hidden;
}
.aboutusimg img {
    width: 100%;
    object-fit: cover;
}


.aboutlist {
    background-color:rgb(247, 247, 250);
    padding: 200px 0px 130px;
}

.aboutlistsbox li {
    width: 32%;
    height: auto;
    border-radius: 10px;
    border: 1px solid rgb(217, 217, 217);
    padding: 70px 30px ;
    background-color: #ffffff;
    flex-direction: column;
    justify-content: flex-start;
}

.aboutlistsbox li img {
    height:110px ;
}
.about-printer-effect {
    margin: 50px 0px 0px;
}
.aboutlistsbox li .text-inner span {
    font-size: 30px;
    font-weight: bold;
    letter-spacing: -4px;
}
.aboutlistsbox li h3 {
    color: rgb(20, 20, 20);
    font-size: 24px;
    line-height: 1.8;
    font-weight: bold;
    margin: 20px 0px;
}
.aboutlistsbox li p {
    color:  rgb(64, 69, 73);
    font-size: 20px;
    text-align: center;
    line-height: 1.8;
}

.newslist {
    margin: 50px 0px;
}
.newslist ul li {
    float: left;
    width: 32%;
    margin-right: 2%;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 20px;
    background-color: #f7f7fa;
}
.newslist ul li:nth-child(3n) {
    margin-right: 0px;
}
.newslistdesc {
    width: 100%;
    height: 270px;
    padding: 30px ;
}
.newslistimg {
    width: 100%;
    height: 200px;
    overflow: hidden;
}
.newslistimg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.newslist ul li:hover .newslistimg img {
    transform: scale(1.1);
}
.newslistdesc {
    flex-direction: column;
    justify-content: space-between;
    align-self: flex-start;
}
.newslisttop {
    width: 100%;
}
.newslisttop button {
    background-color: rgba(255, 255, 255,1);
    border: 1px solid rgb(217, 217, 217);
    width: 100px;
    height: 40px;
    border-radius: 20px;
    transition: all 0.5s;
    color: rgb(64, 69, 73);
    font-size: 16px;
    text-align: center;
    line-height: 40px;
}
.newslist ul li:hover .newslisttop button {
    background-color: rgb(10, 95, 199);
    border: 1px solid rgb(10, 95, 199);
    color: #ffffff;
}
.newslisttop h3 {
    color: rgb(20, 20, 20);
    font-size: 24px;
    line-height: 1.8;
    font-weight: bold;
    margin: 20px 0px;
}
.newslistdesc p {
    color:  rgb(64, 69, 73);
    font-size: 18px;
    line-height: 1.8;
    width: 100%;
}

.newsdetail {
    width: 100%;
}
.newsdetailtop {
    width: 100%;
    text-align: center;
}
.newsdetailtext {
    display: block;
    width: 100%;
    padding: 50px ;
}
.newsdetailtext img {
    margin: 5px 0px;
}
.prodetailbot  .newsdetailtext li {
    margin: 0px;
    padding: 0px;
    border: 0px;
    cursor: auto;
}
.newsdetailtop h5 {
    color: rgb(185, 185, 185);
}

.newsnextprev {
    padding: 50px ;
}
.newsprev,.newsnext {
    width: 45%;
}
.newsprev a,.newsnext a  {
    display: block;
    width: 100%;
    height: 50px;
    border-radius: 26px;
    border: 1px solid rgb(217, 217, 217);
    padding: 0px 25px;
    transition: all .3s;
}
.newsprev a span,.newsnext a span {
    font-size: 16px;
    line-height: 50px;
    color:rgba(20, 20, 20,1);
}
.newsprev a:hover ,.newsnext a:hover{
    background-color: rgb(20, 20, 20);
    border: 1px solid rgb(20, 20, 20);
}
.newsprev a:hover span ,.newsnext a:hover span {
    color: #ffffff;
}
.newsnext {
    text-align: right;
}


.pagesbar {
    width: 100%;
}
.pagesbar ul {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pagesbar ul li.active a {
   background-color: #0352b8;
   color: #ffffff;
}
.jumpto {
    display: none;
}

.contactmess form {
    width: 100%;
    align-items: flex-start;
}
.formwban {
    width: 49%;
    height: 60px;
    border: 1px solid rgb(219, 219, 219);
    border-radius: 6px;
    margin-bottom: 20px;
    padding: 0px 15px;
}


.custom-select {
  position: relative;
    padding: 0px;
    border: 0px;
}
 
.custom-select select {
  -webkit-appearance: none; /* 移除默认样式 */
  -moz-appearance: none;
  appearance: none;
  padding: 10px; /* 根据需要调整内边距 */
  width: 100%;
  border: 1px solid #ccc; /* 边框样式 */
  border-radius: 5px; /* 圆角 */
  font-size: 16px; /* 字体大小 */
}
 
.custom-select::after {
  content: ""; /* 使用伪元素生成内容 */
  position: absolute;
  top: 50%;
  right: 10px; /* 箭头位置 */
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 5px solid transparent; /* 左边透明 */
  border-right: 5px solid transparent; /* 右边透明 */
  border-top: 8px solid rgb(154, 154, 154); /* 上边为箭头颜色 */
  pointer-events: none; /* 防止点击穿透 */
}
.formselect {
    font-size: 16px;
    font-weight: normal;
    width: 100%;
    border: 1px solid rgb(219, 219, 219);
    height: 100%;
    padding: 0px 15px; border-radius: 6px;
   	color: #b3b3b3;
}
.selectjt {
    position: absolute;
    right: 2px;
    top: 5%;
    width: 50px;
    height: 90%;
    background-color: #ffffff;
    z-index: 9;
}
.selectjt img {
    width: 50%;
    filter: brightness(800%) grayscale(800%);
}

textarea.formwban {
    width: 100%;
    height: 154px;
    padding: 15px;
}
.formxyi {
    margin: 20px 0px;
    width: 100%;
}
.formxyi label {
    color: rgb(64, 69, 73);
    font-size: 16px;
    font-weight: normal;
}
.formxyi label a {
    color: rgb(0, 0, 0);
    font-size: 16px;
    font-weight: bold;
    text-decoration: underline;
    margin-left: 80px;
}

.formbtn {
   width: 230px;
   height: 60px;
   border-radius: 30px;
    background-color: rgb(10, 95, 199);
   transition: all .3s;
   margin-top: 20px;
   border: 0px;
   justify-content: center;
}
.formbtn p {
    font-size: 16px;
   color: #ffffff;
}
.formbtn img {
    height: 15px;
    margin-left: 30px;
    filter: grayscale(10000%) brightness(10000%);
}
.formbtn:hover {
    background-color: rgb(15, 79, 157);
    color: #ffffff;
}

.policytc {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 999;
    display: none;
}
.policytcbox {
    width: 50vw;
    height: 90vh;
    background-color: #ffffff;
    overflow-y: scroll;
    margin: 7vh auto 0px;
}
.policytcboxtop {
    width: 100%;
    height: 75px ;
    padding: 15px;
}
.policytcboxtop h3 {
    font-size: 36px;
    color:  rgb(20, 20, 20);
    font-weight: bold;
}
.policytcboxtop img {
    height: 15px;
    cursor: pointer;
    filter: brightness(330%) grayscale(330%);
}

.policytcboxbot {
    border-top: 1px solid rgb(20, 20, 20);
    border-bottom: 1px solid rgb(20, 20, 20);
    padding: 30px 15px;
}
.policytcboxbot p {
    font-size: 16px;
    color: rgb(64, 69, 73);
    line-height: 1.8;
}

.policytcboxbtn {
    margin: 30px 0px;
    float: right;
}
.policytcboxbtn button {
    background-color:  rgb(3, 82, 184);
    width: 115px;
    height: 60px;
    border-radius: 30px;
    color: #ffffff;
    text-align: center;
    font-size: 16px;
    color: #ffffff;
    border: 0px;
}

.propagetop .swiper-button-next:after {
    content: '>';
}
.propagetop .swiper-button-prev:after {
    content: '<';
}