:root {
    --max: 1440px;
    --max1200:1200px;
    --size14: 14px;
    --size16: 16px;
    --size18: 18px;
    --size20: 20px;
    --size22: 22px;
    --size24: 24px;
    --size26: 26px;
    --size28: 28px;
    --size30: 30px;
    --size32: 32px;
    --size36: 36px;
    --size40: 40px;
    --size42: 42px;
    --size46: 46px;
    --size48: 48px;
    --size50: 50px;
    --size56: 56px;
    --size60: 60px;
    --size74:74px;

    --top20: 20px;
    --top30: 30px;
    --top40: 40px;
    --top50: 50px;
    --top60: 60px;
    --top70: 70px;
    --top80: 80px;
    --top90: 90px;
    --top100: 100px;
    --top120: 120px;
    --top150: 150px;
    --top180: 180px;
    --top200: 200px;
    --top240:240px;
}
@font-face {
    font-family: "siyuanheiti";
    src: url("../fonts/siyuanheiti.otf") format("truetype");
}

.go {
    width: 50px;
    height: 50px;
    display: none;
    transition: all 0.5s;
    z-index: 99;
}

.container {
    cursor: pointer;
    display: flex;
    transition: all 0.5s;
}

svg {
    transition: transform 500ms cubic-bezier(0.4, 0, 0.2, 1);
}

.active svg {
    transform: rotate(90deg);
}

path {
    transition: transform 500ms cubic-bezier(0.4, 0, 0.2, 1), stroke-dasharray 500ms cubic-bezier(0.4, 0, 0.2, 1), stroke-dashoffset 500ms cubic-bezier(0.4, 0, 0.2, 1);
}

path:nth-child(1) {
    transform-origin: 36% 40%;
}

path:nth-child(2) {
    stroke-dasharray: 29 299;
}

path:nth-child(3) {
    transform-origin: 35% 63%;
}

path:nth-child(4) {
    stroke-dasharray: 29 299;
}

path:nth-child(5) {
    transform-origin: 61% 52%;
}

path:nth-child(6) {
    transform-origin: 62% 52%;
}

.active path:nth-child(1) {
    transform: translateX(9px) translateY(1px) rotate(45deg);
}

.active path:nth-child(2) {
    stroke-dasharray: 225 299;
    stroke-dashoffset: -72px;
}

.active path:nth-child(3) {
    transform: translateX(9px) translateY(1px) rotate(-45deg);
}

.active path:nth-child(4) {
    stroke-dasharray: 225 299;
    stroke-dashoffset: -72px;
}

.active path:nth-child(5) {
    transform: translateX(9px) translateY(1px) rotate(-45deg);
}

.active path:nth-child(6) {
    transform: translateX(9px) translateY(1px) rotate(45deg);
}

.header{
    padding: var(--top20) 0;
    display: flex;
    align-items: center;
    justify-content: center;
    
}
.header_max{
    width: var(--max1200);
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    position: relative;
}
.mnav{
    position: absolute;
    background-color: rgba(255, 255, 255, 1);
    z-index: 999;
    width: 100%;
    height: calc(100vh - 70px);
    left: 0;
    top: 70px;
    display: none;
}
.mnav ul{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.mnav ul li {
    font-size: var(--size48);
    padding: var(--top30) ;
}
.mnav ul li:frist-child{
    margin-top: var(--top30) ;
}
.logo{
    height: 55px;
    display: flex;
    flex-direction: row;
    align-items: center;
}
.logo img{
    height: 100%;
}
.nav ul{
    display: flex;
    flex-direction: row;
}
.nav ul li{
    margin: 0 var(--size18);
    font-size: var(--size16);
    line-height: var(--size20);
    color: rgba(112,112,112,1);
    font-weight: bold;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.nav_ce{
    position: relative;
}
.nav_ce:after{
    content: "";
    position: absolute;
    width: 50%;
    height: 1px;
    bottom: -7.5px;
    left: 50%;
    transform:translateX(-50%);
    background-color: rgba(22, 125, 189, 1);
}
.nav_ce a{
    color:rgba(22, 125, 189, 1);
}

.banner{
    width: 100%;
    position: relative;
}
.banner img{
    width: 100%;
    clip-path:polygon(0% 100%, 0% 0%, 62.5% 0%, 0% 235%);
}
.banner_bjmc{
    position: absolute;
    left: 0;
    top: 0;
    z-index: 997;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,0.7);
    
}
.banner_bt{
    background-repeat: no-repeat;
    background-position-x: right;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 998;
    width: 100%;
    height: 100%;
    background-size: 64% 100%;
    clip-path: polygon(100% -138%, 38% 100%, 65% 100%, 100% 100%);
}
.banner_content{
    position: absolute;
    width: var(--max1200);
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 999;
}
.banner_hint{
    font-size: var(--size42);
    font-weight: bold;
}
.banner_title{
    width: 45%;
    height: var(--top90);
    background-color: rgba(62, 167, 233, 1);
    padding: var(--top20);
    display: flex;
    align-items: center;
     
    font-size: var(--size46);
    margin-top: var(--size22);
    color: rgba(255,255,255,1);
}
.banner_jieshao{
    margin-top: var(--size22);
    
    color: rgba(20, 123, 188, 1);
    font-size: var(--size32);
}
.banner_entitle{
    font-size: var(--size18);
    font-weight: bold;
}
.max{
    width: 100%;
    position: relative;
}
.gongsi{
    width: var(--max1200);
    margin: 0 auto;
    padding-top: var(--top150);
    padding-bottom: var(--top80);
}
.gongsi_title{
    
    font-size: var(--size48);
    line-height: var(--size60);
    width: max-content;
    color:rgba(20, 123, 188, 1);
    position: relative;
}
.gongsi_title::after{
    content: "";
    position: absolute;
    left: 0;
    bottom: -20px;
    width: 20%;
    height: 1px;
    background-color:rgba(20, 123, 188, 1) ;
     
}

.gongsi_hint{
    margin-top: var(--top30);
    
    color: rgba(20, 123, 188, 0.8);
    font-size: var(--size28);
    line-height: var(--size36);
}
.gongsi_content{
    margin-top: var(--top30);
    font-size: var(--size18);
    line-height: var(--size24);
    
    color: rgba(102,102,102,1);
    max-width: 70%;
}
.gongsi_btn{
    border: 1px solid rgba(20, 123, 188, 1);
    margin-top: var(--top60);
    width: 15%;
    height: var(--top60);
}
.gongsi_btn a{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-size: var(--size24);
    line-height: var(--size30);
    
    color: rgba(20, 123, 188, 1);
}
.gongsi_list{
    margin-top: var(--size46);
    width: 60%;
}
.gongsi_list ul{
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: space-between;
    align-items: flex-start;
}
.gongsi_list ul li{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.gs_list_up{
    color: rgba(20, 123, 188, 1);
    font-size: var(--size56);
    line-height: var(--size74);
    flex-wrap: 700;
}
.gs_list_up span{
    font-size: var(--size24);
    color: rgba(20, 123, 188, 1);
}
.gs_list_title{
    margin-top: var(--top30);
    color: rgba(153,153,153,1);
    font-size: var(--size18);
    line-height: var(--size24);
    
}
.gs_list_entitle{
    color: rgba(153,153,153,1);
    font-size: var(--size16);
    line-height: var(--size20);
}
.gongsi img{
    position: absolute;
    right: 0;
    bottom: var(--top80);
    z-index: -1;
    transform: rotateY(180deg);
}
.chanpin{
    margin: 0 auto;
    width: var(--max1200);
    display: flex;
    flex-direction: column;
    align-items: center;
}
.chanpin_title{
    font-size: var(--size48);
    line-height: var(--size60);
    
    color: rgba(22, 125, 189, 1);
}
.chanpin_hint{
    font-size: var(--size28);
    line-height: var(--size36);
    margin-top: var(--top20);
    color: rgba(22, 125, 189, 0.8);
}
.chanpin_list{
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: var(--top30);
    margin-top: var(--top30);
}
.chanpin_box{
    padding: var(--top70) var(--top40);
    background-color: rgba(247, 247, 248, 1);
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    height: 100%;
}
.chapin_list_r{
    margin-left: var(--size16);
    display: flex;
    flex-direction: column;
}
.chanpin_list_title{
    color: rgba(51,51,51,1);
    font-size: var(--size24);
    line-height: var(--size30);
    
}
.chanpin_list_hint{
    color: rgba(153,153,153,1);
    margin-top: var(--top20);
    font-size: var(--size24);
    line-height: var(--size30);
    
}
.New{
    margin: var(--top70) auto 0;
    width: var(--max1200);
    display: flex;
    flex-direction: column;
    align-items: center;
}
.New_title{
    font-size: var(--size48);
    line-height: var(--size60);
    color: rgba(22,125,189,1);
    position: relative;
}
.New_title::after{
    content: "";
    position: absolute;
    left: 50%;
    bottom: -10px;
    transform: translateX(-50%);
    width: 20%;
    height: 3px;
    background-color: rgba(22,125,189,1);
}
.New_hint{
    margin-top: var(--size24);
    font-size: var(--size28);
    line-height: var(--size36);
    color: rgba(22,125,189,0.5);
}
.New_List{
    margin-top: var(--top60);
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 15px;
}
.New_List_box{
    padding: var(--top20);
    display: flex;
    flex-direction: column;
    border: solid 1px rgba(228,228,228,1);
}
.New_List_img{
    width: 100%;
    
}
.New_List_img img{
    width: 100%;
}
.New_List_title{
    font-size: var(--size18);
    line-height: var(--size24);
    margin-top: var(--top20);
    color: rgba(112,112,112,1);
}
.New_List_time{
    font-size: var(--size16);
    line-height: var(--size20);
    margin-top: 10px;
    color: rgba(153,153,153,1);
}
.New_List_hint{
    margin-top: 10px;
    font-size: var(--size16);
    line-height: var(--size18);
    color: rgba(153,153,153,1);
    overflow: hidden;
     display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}
.Mess,.Lian{
    margin: 10px auto var(--top90);
    width: var(--max1200);
    display: flex;
    flex-direction: column;
    align-items: center;
}
.Message{
    margin: var(--top100) auto 0;
    width: var(--max1200);
    display: flex;
    flex-direction: column;
    align-items: center;
}
.Message_box{
    margin-top: var(--top50);
    width: 100%;
    padding: var(--top40) var(--top30);
    border: solid 1px rgba(22,125,189,1);
    border-radius: 28px;
}
.Message_box form{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.Message_duan{
    width: 45%;
    display: flex;
    flex-direction: column;
    margin-bottom: var(--top50);
}
.Message_duan p{
    font-size: var(--size16);
    line-height: var(--size20);
    color: rgba(51,51,51,1);
    
}
.Message_duan input{
    width: 100%;
    background-color: rgba(248,248,248,1);
    padding: var(--size22);
    margin-top: var(--size16);
    color: rgba(153,153,153,1);
}
.Message_chang{
    width: 100%;
}
.Message_chang p{
    font-size: var(--size16);
    line-height: var(--size20);
    color: rgba(51,51,51,1);
}
.Message_chang textarea{
    width: 100%;
    height: 130px;
    background-color: rgba(248,248,248,1);
     padding: var(--size22);
    margin-top: var(--size16);
    color: rgba(153,153,153,1);
    border: 0;
}
.submit{
    margin: var(--top40) auto 0;
    width: 25%;
    height: 64px;
    background-color: rgba(22,125,189,1);
    color: rgba(255,255,255,1);
    font-size: var(--size20);
    line-height: var(--size24);
}
.Lianxi{
    margin: var(--top100) auto 0;
    width: var(--max1200);
    display: flex;
    flex-direction: column;
    align-items: center;
}
.Lianxi_list{
    width: 100%;
    margin-top: var(--top50);
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: var(--top30);
    
}
.Lianxi_list_box{
    padding: var(--top30);
    background-color: rgba(248,248,248,1);
    display: flex;
    flex-direction: column;
    align-items: flex-start;

}
.Lianxi_list_l{
    width: 100%;
    height: var(--size60);
    display: flex;
    align-items: center;
}
.Lianxi_list_l img{
    width: 100%;
    max-width: 40px;
    height: 100%;
    max-height: 40px;
}
.Lianxi_list_r{
    margin-left: var(--top20);
}
.Lianxi_title{
    color: rgba(112,112,112,1);
    font-size: var(--size16);
    line-height: var(--size20);
}
.Lianxi_hint{
    color: rgba(112,112,112,1);
    font-size: var(--size16);
    line-height: var(--size20);
    margin-top: 10px;
}
.map{
    width: 100%;
    margin-top: var(--top30);
    padding-bottom: 15px;
}
.map img{
    width: 100%;
}
.footer{
    background-color: rgba(248,248,248,1);
    padding: var(--top60) 0 var(--top30);
    display: flex;
    flex-direction: column;
    align-items: center;
}
.footer1{
    background-color: rgba(255,255,255,1);
    padding: var(--top60) 0 var(--top30);
    display: flex;
    flex-direction: column;
    align-items: center;
}
.footer_nav{
    width: var(--max1200);
    display: flex;
    align-items: center;
    justify-content: center
}
.footer_nav ul{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center
}
.footer_nav ul li{
    padding: 0 var(--size36);
    border-left: solid 1px rgba(153,153,153,1);
    border-right: solid 1px rgba(153,153,153,1);
    font-size: var(--size18);
    display: flex;
    flex-direction: column;
    align-items: center;
}
.beian{
    margin-top: var(--top40);
    font-size: var(--size16);
    color: rgba(153,153,153,1);
}
.banner_page{
    width: 100%;
    max-height: 700px;
    overflow: hidden;
    position: relative;
}
.banner_page img{
    width: 100%;
}
.banner_page_text{
    width: var(--max1200);
    position: absolute;
    left: 50%;
    bottom: var(--top80);
    transform: translateX(-50%);
}
.banner_page_text p{
    color: rgba(255,255,255,1);
    font-size: var(--size56);
}
.banner_page_text p:last-child{
    font-size: var(--size36);
    margin-top: var(--top20);
}
.mianbaoxie{
    width: var(--max1200);
    padding: var(--top40) 0;
    margin: 0 auto;
    color: rgba(112,112,112);
    font-size: var(--size20);
}
.news{
    width: var(--max1200);
    margin: var(--top50) auto 0;
    padding-bottom: var(--top100);
}
.news_list{
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 15px
}
.news_box{
    padding: var(--top20);
    border: solid 1px rgba(228,228,228,1);
    display: flex;
    flex-direction: column;
    position: relative;
}
.news_img{
    width: 100%;
}
.news_img img{
    width: 100%;
}
.news_title{
    width: 100%;
    font-size: var(--size18);
    line-height: var(--size24);
    color: rgba(112,112,112,1);
    margin-top: 15px;
}
.news_time{
    font-size: var(--size16);
    line-height: var(--size22);
    color: rgba(112,112,112,1);
    margin-top: 10px;
}
.news_box>a>img{
    position: absolute;
    right: var(--top20);
    bottom: var(--top20);
    width: 30px;
    height: 30px;
}
.news_more{
    padding: 15px var(--top60);
    color: rgba(22,125,189,1);
    font-size: var(--size24);
    line-height: var(--size30);
    border: solid 1px rgba(22,125,189,1);
    margin: var(--top70) auto 0;
    width: max-content;
}
.news_show{
    width: var(--max1200);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.news_show_title{
    font-size: var(--size30);
    color: rgba(61,61,61,1);
    font-weight: bold;
    
}
.news_show_hint{
    margin-top: var(--top20);
    display: flex;
    flex-direction: row;
    align-items: center;
    font-size: var(--size16);
    
}
.news_show_hint p{
    color: rgba(61,61,61,1);
    margin: 0 15px ;
}
.news_show_content{
    width: 100%;
}
.news_show_content *{
    max-width: 100%;
}
.up-down{
    width: var(--max1200);
    margin: var(--top100) auto;
    display: flex;
        justify-content: space-between;
    align-items: flex-start;
   
}
.up-down *{
     font-size: var(--size16);
    color: rgba(61,61,61,1);
}
.cp{
    width: 100%;
    height: max-content;
    background-color: rgba(248,248,248,1);
}
.product_show{
    width: var(--max1200);
    margin: 10px auto;
    padding:var(--top30);
    background-color: rgba(255,255,255,1);
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
}
.product_show_l{
    width: 25%;
}
.mySwipercpb .swiper-slide{
     display: flex;
        align-items: center;
    justify-content: center;
}
.mySwipercpm .swiper-slide{
        display: flex;
        align-items: center;
    justify-content: center;
    padding: 6px 17px;
    border: 1px solid rgba(212,210,210,1);
}
.mySwipercpm .swiper-wrapper{
        justify-content: space-between;
}
.mySwipercpm .swiper-slide img{
    width: 40px;
    height: 58px;
}
.product_show_r{
    width: 70%;
    display: flex;
    flex-direction: column;
}
.product_show_title{
    font-size: var(--size24);
    
    position: relative;
}
.product_show_title p{
    color: rgba(51,51,51,1);
}
.product_show_entitle{
    font-size: var(--size20);
}
.product_show_title::after{
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    left: 0;
    bottom: -25px;
    background-color: rgba(112,112,112,1);
}
.product_show_content{
    width: 100%;
    margin-top: var(--top70);
    padding: 0 5px;
}
.product_show_content img{
    max-width: 100%;
    max-height: 100%;
}
.product_show_content_img{
    position: fixed;
      z-index: 9999;
      top: 50%;
      left: 50%;
      transform: translate(-50%,-50%);
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.8);

}
.nextpc{
    width: var(--max1200);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    padding: var(--top60) 0;
}
.nextpc>div{
    margin-bottom: var(--top20);
    font-size: var(--size20);
    color: rgba(112,112,112,1);
}
.product_body{
    width: var(--max1200);
    margin: 10px auto 0;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding-bottom: var(--top90);
    justify-content: space-between;
}
.product_nav{
    width: 25%;
    
}
.product_nav_ul{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    height: auto;
    
}
.p_n_ul{
    width: 100%;
    padding: var(--top30) var(--size16);
    background-color: rgba(247,247,248,1);
    display: flex;
    flex-direction: row;
    align-items: center;
    position: relative;
    margin: 1.5px 0;
}
.p_n_ul>img{
    width: var(--size40);
}
.p_n_ul>p{
    font-size: var(--size24);
    margin-left: var(--size24);
    line-height: var(--size30);
}
.p_n_ul .open{
    position: absolute;
    top: 50%;
    right: var(--size56);
    transform: translateY(-50%);
    width: var(--size28);
}
.product_nav_li{
    display: none;
    width: 100%;
    
}

.p_n_li{
     width: 100%;
    padding: var(--top30) var(--size16);
    display: flex;
    flex-direction: row;
    align-items: center;
    position: relative;
   
}
.p_n_li>img{
    width: 7px;
    margin-left: 15px;
}
.p_n_li>div{
    font-size: var(--size20);
    margin-left: var(--size40);
    line-height: var(--top24);
}
.p_n_li .open{
    position: absolute;
    top: 50%;
    right: var(--size30);
    transform: translateY(-50%);
    width: var(--size28);
}
.p_n_li:hover>div p{
    color: rgba(22,125,189,1);
}
.product_jiemian{
    width: 70%;
}
.product_all{
    width: 100%;
    display: none;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 11px;
}
.product_all_show{
    display: grid !important;
}
 .blue>div>p{
    color: rgba(22,125,189,1);
}

.product_box{
    width: 200px;
    /*height: 70px;*/
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: rgba(250,250,250,1);
    font-size: var(--size20);
    line-height: var(--size26);
    color: rgba(51,51,51,1);
    padding: 5px 10px;
}
.product_box a{
    width: 100%;
    text-align: center;
}
.entitle{
     font-size: var(--size18);
    line-height: var(--size20);
    color: rgba(51,51,51,0.7);
}
.product_box:hover{
     background-color: rgba(22,125,189,1);
     color: rgba(255,255,255,1);
}
.product_box:hover .entitle{
    color: rgba(255,255,255,0.7);
}

.Lianxi_address{
    margin-top: var(--top50);
    margin-bottom: var(--top50);
    width: 100%;
    display: flex;
    padding: 30px;
    font-size: var(--size26);
    line-height: var(--size32);
    color: rgba(112, 112, 112, 1);
        background-color: rgba(248, 248, 248, 1);
}
.Lianxi_address_title{
    font-size: var(--size24);
}
.Lianxi_address p{
    color: rgba(112,112,112,1);
}