@font-face {
    font-family: iconfont;
    src: url(../fonts/iconfont.eot);
    src: url(../fonts/iconfont.eot) format('embedded-opentype'),url(../fonts/iconfont.woff) format('woff'),url(../fonts/iconfont.ttf) format('truetype'),url(../fonts/iconfont.svg#iconfont) format('svg')
}

.arrow,[class*=e_icon],[class*=icon-from-user]:after,[class*=iconfont],[class*=in_icon],[class*=link_icon],[class~=e_icon],[class~=icon-from-user]:after,[class~=iconfont],[class~=in_icon] {
    font-family: iconfont!important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}
.iconfont {display:inline;color:inherit;height:100%;color:inherit;font-size:inherit;font-family:inherit;font-weight:inherit;text-decoration:none;font-weight:400;text-decoration:none;font-size:inherit;font-family:"Microsoft Yahei";font-weight:400;text-decoration:none}




#banners {width:100%;height:auto;min-width:300px; padding:0;margin:0;}
#banners .subpage_ad {height:360px;margin-top:0px;position:relative;overflow:hidden;}
#banners .subpage_ad .bgimg {background:no-repeat center/cover; position:absolute;top:0px;bottom:0px;left:0px;right:0px;}
#banners .subpage_ad .mobitem {display:none;}
#banners .subpage_ad .capitalize {text-transform:capitalize;}
#banners .subpage_ad .text {position:absolute;width:80%;color:#fff;text-align:left;top:60%;left:50%;line-height:1.6;transform:translate(-50%,-50%);z-index:4;}
#banners .subpage_ad .text .ad-tit {font-size:28px;font-weight:normal;line-height:1.6;}
#banners .subpage_ad .text .ad-line {height:2px;width:3%;background:#fff;margin:0.8% 0% 0.8% 0%;}
#banners .subpage_ad .text .ad-sum {font-size:38px;font-weight:bold;line-height:1.6;}
@media only screen and (max-width:1200px) and (min-width:1025px) {
#banners .subpage_ad {height:450px;}
#banners .subpage_ad .text .ad-tit {font-size:30px;}
#banners .subpage_ad .text .ad-sum {font-size:16px;}
}
@media only screen and (max-width:1024px) and (min-width:769px) {
#banners .subpage_ad {height:400px;margin-top:70px;}
#banners .subpage_ad .text .ad-tit {font-size:30px;}
#banners .subpage_ad .text .ad-sum {font-size:16px;}
}
@media only screen and (max-width:768px) {
#banners .subpage_ad {height:30vh;margin-top:60px;}
#banners .subpage_ad .pcitem {display:none !important;}
#banners .subpage_ad .mobitem {display:block;}
#banners .subpage_ad .text {top:49%;}
#banners .subpage_ad .text .ad-tit {font-size:20px;font-weight:normal;}
#banners .subpage_ad .text .ad-sum {font-size:16px;}
}


#child {width:100%;height:auto;max-height:none;min-height:0px; background-color:#eef2f5;}
#child .wrap{width:100%;max-width:1600px;margin:0 auto;}
#child .wrap .w_grid{width:100%;max-width:none;min-width:0px; height:auto;max-height:none;min-height:0px;margin:0 auto;  display:flex;}
#child .wrap .w_grid > div:nth-child(2n+1) {width:69.6366%;}
#child .wrap .w_grid > div:nth-child(2n+0) {width:29.363399999999995%;margin-left:1%;}
@media only screen and (max-width:768px) {
#child .wrap .w_grid > div:nth-child(2) {display:none;}
#child .wrap .w_grid > div:nth-child(2n+1) {width:100%;}
}

#child_nav .NavList_a1 ul {text-align:left;display:block;font-size:0px;}
#child_nav .NavList_a1 li {position:static;display:inline-block;color:#fff;width:auto;vertical-align:top;}
#child_nav .NavList_a1 a {position:relative;font-size:15px;height:80px;line-height:80px;padding:0px 30px;color:#333;display:block;transition:0.3s ease 0s;}
#child_nav .NavList_a1 a:before {position:absolute;content:'';left:50%;bottom:0px;width:0%;height:3px;background-color:none;transition:all .3s;}
#child_nav .NavList_a1 a:hover {color:#3888c4;}
#child_nav .NavList_a1 a:hover:before {width:80%;left:10%;background-color:#3888c4;}
#child_nav .NavList_a1 a.on {color:#3888c4;}
#child_nav .NavList_a1 a.on:before {width:80%;left:10%;background-color:#3888c4;}

#child_nav .NavList_a1 a.more:after {content:"";position:absolute;width:1px;height:15px;display:block;background:#ccc;top:50%;margin-top:-7px;right:0px;}
@media screen and (max-width:1400px) {
#child_nav .NavList_a1 a {padding:0px 30px;}
}
@media screen and (max-width:1200px) {
#child_nav .NavList_a1 a {padding:0px 30px;font-size:14px;}
}
@media screen and (max-width:1024px) {
#child_nav .NavList_a1 {border-bottom:1px solid #ddd;}
#child_nav .NavList_a1 a {padding:0px 30px;font-size:14px;}
}
@media screen and (max-width:768px) {
#child_nav .NavList_a1 {border-bottom:1px solid #ddd;}
#child_nav .NavList_a1 ul {text-align:left;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;font-size:0;}
#child_nav .NavList_a1 a {padding:0px 20px;font-size:14px;height:62px;line-height:62px;}
#child_nav .NavList_a1 a:hover {color:#3888c4;}
#child_nav .NavList_a1 a:active {color:#3888c4;}
}


#child_path {text-align:right;margin:30px 0px; position: relative;}
#child_path > div{display:inline-block; line-height:1;}
#child_path .weizhi {font-size:14px;color:#555; display:inline-block; padding-left:25px; position: relative;}
#child_path .weizhi .iconfont {width:20px;height:22px; position: absolute; top:-2px; left:0}
#child_path .weizhi .iconfont:before {content:'\e630';color:#3888c4;font-size:20px;}
#child_path a{color:#555}
#child_path a:hover {color:#3888c4;cursor:pointer;display:inline-block;}
#child_path .p_breadcrumbFirst {font-size:14px;color:#65beba; display:inline-block;vertical-align:middle;position:relative;}



#about {width:100%;height:auto;min-height:192px; margin:3rem 0 4rem 0;}
@media only screen and (max-width:1024px) and (min-width:769px) {
#about  {margin:1rem 0 3rem 0;}
}
@media only screen and (max-width:768px) {
#about  {margin:1rem 0 2rem 0;}
}

#about  .about_detail {width:94%;max-width:1600px;height:auto;min-height:192px; margin:0 auto;  padding:0;overflow:hidden;}
#about  .about_detail .p_header {font-size:36px;margin:20px 0;text-align:center;padding-bottom:20px;  border-bottom:1px solid #eee;}


@media only screen and (min-width:769px) {
#about  .about_detail .p_content {margin:20px 0;overflow:hidden; line-height:2.8; font-size:18px;}
}
@media only screen and (max-width:768px) {
#about  .about_detail .p_header {font-size:24px;}
#about  .about_detail .p_content {margin-bottom:0;overflow:hidden; font-size: 14px; line-height:2;}
}

.a_content{text-indent: 2em;}

.page-position {
    padding: 0px 0 30px;
    font-size: 14px;
    color: #666666;
}

.page-position a {
    color: #666666;
}

.page-position a:hover {
    color: #3888c4;
}

.list {
    background: url(../images/home.png) no-repeat 20px 50% #f1f1f1;
    line-height: 48px;
    padding-left: 33px;
    font-size: 14px;
    border-radius: 6px;
}

.list a {
    line-height: 45px;
    color: #666666;
    font-size: 14px;
}





.mainbox{
	background-color: rgba(255, 255, 255, 1);
	padding:48px 0px 72px;
}
.wrap{
	width: 94%;
    max-width: 1600px;
    min-width: 0px;
    height: auto;
    max-height: none;
    margin-top: 0px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
}
.wrap.flex{
    align-items: flex-start;
}

/* 手机站 左侧导航弹出特效 */
.bfmob-left-close-btn {
    display: none;
}

.ny_list .bfpg-left-title i{display: none;}
.ny_list .bfpg-left-box{border-top-left-radius: 5px;border-top-right-radius: 5px;}

.ny_list .bfpg-left-title{border-top-left-radius: 5px;border-top-right-radius: 5px; no-repeat center top;background-size: 100% 100%;}
.ny_list .bfpg-left-title span:before{display:none;}
.ny_list .bfpg-left-title span{ width: 65px;font-weight:200;
    height: 25px;border-radius: 11px;background: rgba(255, 255, 255, .2);text-align: center;padding: 2px 10px;font-style: italic;}
.ny_list .bfpg-left-title{padding: 14px 20px; position: relative;}
.bfpg-left-con2 .bfpg-left-nav > li{border:none; border-radius: 8px;margin-top: 10px;background:#eee;}    
.bfpg-left-con2 .first-nav-btn{display:block;}
.bfpg-left-con2 .bfpg-left-nav > li:hover > a, .bfpg-left-nav > li.clicked > a {
    color: #fff;}
.bfpg-left-con2 .bfpg-left-nav > li:hover .first-nav-btn, .bfpg-left-nav > li.clicked .first-nav-btn {
    color: #fff;}
.bfpg-left-con2 .bfpg-left-nav > li.clicked{background:#3888c4;}
.bfpg-left-con2 .bfpg-left-nav > li:hover{background:#3888c4;}


@media (min-width: 990px) {
    .page-wrap-left {
        float: left;
        width: 24%;
        position: sticky;
        top:92px;
    }
}

.bfpg-left-box {
    margin-bottom: 20px;
}

.bfpg-left-title {
    background: #3888c4;
    padding: 10px 20px;
    position: relative;
}

.bfpg-left-title h3 {
    font-size: 20px;
    color: #ffffff;
    line-height: 30px;
    font-weight: bold;
    position: relative;
    z-index: 9;
}

.bfpg-left-title i {
    position: absolute;
    left: -5px;
    top: -9px;
    font-style: normal;
    font-size: 67px;
    font-weight: bold;
    opacity: .1;
    color: #fff;
    line-height: 1;
    z-index: 1;
    text-transform: uppercase;
}

.bfpg-left-title span {
    font-weight: normal;
    font-size: 16px;
    color: #fff;
    opacity: .6;
    margin-left: 10px;
    text-transform: capitalize;
}

.bfpg-left-title span:before {
    content: "/";
    padding-right: 5px;
}

/* 内页左侧导航栏样式 */
.bfpg-left-nav {
    margin: 0 -1px;
}

.bfpg-left-nav > li {
    position: relative;
    border-bottom: 1px solid #eeeeee;
}

.bfpg-left-nav > li:last-child {
    border-bottom: none;
}

.bfpg-left-nav > li > a {
    display: block;
    font-size: 17px;
    line-height: 22px;
    color: #444444;
    padding: 15px 25px;
}

.bfpg-left-nav > li .first-nav-btn {
    position: absolute;
    z-index: 99;
    width: 30px;
    height: 30px;
    text-align: center;
    top: 10px;
    right: 20px;
    cursor: pointer;
    background: url(../images/icon-pro.png)  90% 50% no-repeat;
}

.bfpg-left-nav > li .first-nav-btn.clicked {
    background: url(../images/icon-proh.png)  90% 50% no-repeat;
    transform: rotate(0deg); /* 旋转45度 */
}

.bfpg-left-nav > li:hover > a, .bfpg-left-nav > li.clicked > a {
    color: #fff;
}

.bfpg-left-nav > li:hover .first-nav-btn, .bfpg-left-nav > li.clicked .first-nav-btn {
    color: #a40000;
}

.bfpg-left-nav .bfpg-left-subnav {
    display: none;
    padding: 0 10px;
    background:#eee;
}

.bfpg-left-nav .bfpg-left-subnav > li {
    border-top: 1px solid #ccc;
}
.bfpg-left-nav .bfpg-left-subnav > li:nth-child(1){
    border-top:0px;
}

.bfpg-left-nav .bfpg-left-subnav > li > a {
    padding: 8px;
    display: block;
    line-height: 32px;
    color: #444;
    font-size: 14px;
    padding-left: 24px;
}

.bfpg-left-nav .bfpg-left-subnav > li > a:hover {
    color: #3888c4;
}

.bfpg-left-nav .bfpg-left-subnav > li.clicked > a {
    color: #3888c4;
}

.bfpg-left-nav .bfpg-left-threenav > li > a {
    padding: 5px 10px;
    display: block;
    font-size: 14px;
    line-height: 24px;
    color: #999999;
}

.bfpg-left-nav .bfpg-left-threenav > li > a:before {
    content: '\2014   ';
}

.bfpg-left-nav .bfpg-left-threenav > li > a:hover {
    color: #a40000;
}

.bfpg-left-nav .bfpg-left-threenav > li.clicked > a {
    color: #a40000;
}

@media (max-width: 990px) {
    .bfpg-left-nav .bfpg-left-threenav {
        display: block;
    }
}




.protype {
    margin-top: 0px;
    display: flex;
    flex-wrap: wrap;
    margin-bottom:24px;
}

.protype a {
    display: block;
    color: #000;
    border: 1px solid #ccc;
    padding: 12px 16px;
    margin-right: 12px;
    margin-bottom: 12px;
    border-radius: 6px;
    font-size: 16px;
    position: relative;
    overflow: hidden;
    z-index: 2;
}

.protype a::before {
    content: "";
    display: block;
    width: 16em;
    height: 8em;
    border-radius: 50%;
    position: absolute;
    left: -1.5em;
    top: -2.75em;
    z-index: -1;
    transform: scale(0);
    transform-origin: center;
    background-color: #000000;
    opacity: 0;
    transition: 0.5s ease;
}

.protype a:hover::before {
    transform: scale(1);
    opacity: 0.2;
}

.protype a:hover {
    background: #3888c4;
    color: #fff;
    border: 1px solid #3888c4;
}



.protype a.act::before {
    transform: scale(1);
    opacity: 0.2;
}

.protype a.act {
    background: #3888c4;
    color: #fff;
    border: 1px solid #3888c4;
}


.pro_index{
    width:72%; float:right;
}

.pro_index ul {
    margin-top: 0px;
}

.pro_index ul li {
    float: left;
    width: 32%;
    margin-bottom: 30px;
    position: relative;
    transition: .3s ease-in-out;
    margin-right: 2%;
    border:1px solid #eee;
}
.pro_index ul li:nth-child(3n){
    margin-right:0px;
}

.pro_index ul li a {}

.pro_index ul li a .pro_img {
    width: 80%;
    height: 0px;
    padding-bottom:80%;
    line-height: 100%;
    text-align: center;
    margin: 20px 10%;
     vertical-align: middle; /* 垂直居中 */
     position: relative;
     overflow: hidden;
}

.pro_index ul li a .pro_img img {
    max-width: 100%;
    vertical-align: middle;
    display: inline-block;
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%) scale(1); /* 关键：向上移动自身高度的一半 */
    transition: .5s ease-in-out;
}

.pro_index ul li a .pro_text {
    text-align: center;
    width: 100%;
    color: #333;
    font-size: 16px;
    padding: 10px 0;
    line-height: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.pro_index ul li:hover {
    transform: translateY(-10px);
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    -o-transform: translateY(-10px);
    box-shadow: 0 0 8px 1px rgba(0, 0, 0, 0.1);
    transition: .3s ease-in-out; 
}
.pro_index ul li:hover .pro_img img{
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%)  scale(1.1); 
    background: no-repeat center;
    background-size: 100% auto;
    transition: .75s ease-in-out;
}
.pro_index ul li:hover a .pro_text {
     transition: .75s ease-in-out;
    background-color: #3888c4;
    color: #fff;
}

.prodetailbox {
    padding: 32px;
    background-color: #fff;
    border-radius: 12px;
    box-shadow: 0 0 8px 5px rgba(0, 0, 0, 0.1);
    margin: 0px -15px 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.prodetailboxcon {
    width: 50%;
}

.prodetailboxcon h2 {
    font-size: 32px;
    line-height: 1.2;
    color: #333333;
    font-weight: 400;
    margin-bottom: 25px;
}

.prodetailboxcon .typename {
    border: 1px solid #e5e5e5;
    line-height: 2.8;
    padding: 6px 25px;
    color: #666666;
    border-radius: 40px;
    font-size: 14px;
}

.prodetailboxcon .line {
    background-color: #cdcdcd;
    height: 1px;
    position: relative;
    margin-top: 25px;
}

.prodetailboxcon .line::after {
    width: 10%;
    position: absolute;
    left: 0;
    top: -1px;
    height: 3px;
    background-color: #3888c4;
    display: block;
    content: '';
}

.prodetailboxcon .desc {
    font-size: 16px;
    line-height: 2;
    color: #888;
    margin-top: 25px;
}

.light {
    position: absolute;
    left: -100%;
    top: 0;
    width: 100%;
    height: 100%;
    transform: skewx(-25deg);
    z-index: 2;
    background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
}

.light-tri:hover .light {
    left: 100%;
    transition: 1s;
}

.light-tri:hover {
    box-shadow: 0 0 10px rgba(43, 23, 110, .5);
}

.prodetailboxcon .protel {
    font-size: 22px;
    border-radius: 40px;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    -ms-border-radius: 40px;
    -o-border-radius: 40px;
    white-space: nowrap;
    transition: all .36s;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #3888c4;
    color: #fff;
    width: inherit;
    height: 60px;
    margin: 25px 0px;
}

.prodetailboxcon .tishi {
    font-size: 14px;
    color: #aaa;
}

.prodetailboxcon .iconfont {
    width: 30px;
    height: 30px;
    margin-right: 15px;
    background: url(../images/icon-protel.png) no-repeat;
    background-size: 100%;
}


.proimg {
    width: 46%;
    border: 1px solid #f2f2f2;
    overflow: hidden;
}

.proimg img {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    display: block;
}

.proinfo {
    margin: 0 -15px;
    display: flex;
    justify-content: space-between;
}

.proinfo .proinfoleft {
    width: 72%;
}

.proinfo .proinforight {
    width: 26%;
    background-color: #fff;
}

.proinfotit {
    padding: 32px;
    border-bottom: 1px solid #e5e5e5;
    background-color: #fff;
}

.proinfotit .tit {
    border-left: 6px solid #3888c4;
    padding-left: 25px;
    font-size: 24px;

}

.proinfocontent {
    padding: 32px;
    line-height: 2.4;
    font-size: 16px;
    background-color: #fff;
}

.proinfocontent table{border-top:1px solid #ddd; border-left:1px solid #ddd;margin:12px 0px; min-width:240px; max-width:100%!important;}
.proinfocontent table th{ color:#666; font-size:14px; padding:5px 10px; text-align:center; border-right:1px solid #ddd; border-bottom:1px solid #ddd; height:24px; line-height:24px;}
.proinfocontent table td{ color:#666; font-size:14px; padding:5px 10px; text-align:center; border-right:1px solid #ddd; border-bottom:1px solid #ddd; height:24px; line-height:24px;}
.proinfocontent table p{margin-left: 0px!important;}
.proinfocontent img{max-width:100%!important;}

.proinfoleft h3 {
    margin-bottom: 1em !important;
    margin-top: 1em !important;
    font-size: 22px !important;
    padding-top: 0 !important;
    color: var(--red);
    position: relative;
    border: none;
    padding: 0 0 0 1em;
    font-weight: bold !important;
    line-height: 1.2;
}

.proinfoleft h3:nth-of-type(1) {
    margin-top: 0 !important;
}

.proinfoleft h3:before {
    position: absolute;
    content: '';
    width: 5px;
    background: var(--red);
    top: 8%;
    left: 2px;
    bottom: 12%;
    border-radius: 5px;
    box-shadow: 1px 1px 3px -1px var(--red);
    outline: 0 !important;
    box-sizing: border-box;
}

.proinfoleft h4 {
    font-size: 18px !important;
    margin-bottom: 0.5em;
    color: #16b597;
    position: relative;
    border: none;
    padding: .1em 0 .5em 0 !important;
}

.proInfoLeft h4:before {
    position: absolute;
    content: '';
    width: 40px;
    height: 4px;
    background: #16b597;
    top: auto;
    left: 0;
    transition: .4s;
    bottom: 10%;
    border-radius: 5px;
    box-shadow: 1px 1px 3px -1px #16b597;
    outline: 0 !important;
    box-sizing: border-box;
}

.font14 {
    font-size: 14px;
    color: #666;
}

.font20 {
    font-size: 20px;
    color: #333;
    padding-top: 6px;
}

.propage {
    margin-top: 30px;
    background-color: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.propage a {
    width: 50%;
    padding: 16px 32px;
    transition: all .36s;
    border-right: 1px solid #e5e5e5;
}

.propage a:last-child {
    border-right: none;
}

.propage a:hover {
    background: #3888c4;
    color: #fff;
    transform: scale(1.05);
    z-index: 5;
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
}

.propage a:hover .font14 {
    color: rgba(255, 255, 255, .38);
}

.propage a:hover .font20 {
    color: rgba(255, 255, 255, 1);
}


.prorelated {
    padding-top: 20px;
}

.prorelated ul {
    display: inline-block;
    width: 100%;
}

.prorelated ul li {
    width: 23.5%;
    float: left;
    position: relative;
    margin-bottom: 2%;
    margin-right: 2%;
    background-color: #fff;
    border: #ddd solid 0px;
    transition: all ease 0.36s;
    overflow: hidden;
}

.prorelated ul li:nth-child(4n) {
    margin-right: 0;
}

.prorelated ul li h3 {
    text-align: center;
    font-size: 18px;
    color: #3888c4;
    line-height: 36px;
    font-weight: 700;
    padding-left: 0%;
    margin-top: 0%;
    background-size: 26px 26px;
    display: inline-block;
    padding-right: 0px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    background-position-x: 300px;
}

.prorelated ul li a {
    background: #fff;
    display: block;
    width: 100%;
    display: flex;
    flex-direction: column-reverse;
    padding-bottom: 5px;
}

.prorelated ul li p {
    font-size: 22px;
    color: #999;
    line-height: 22px;
    padding-left: 10%;
    padding-top: 16px;
}

.prorelated ul li img {
    display: block;
    padding-top: 0px;
    border-radius: 0px;
    width: 100%;
}

.prorelated ul li:hover {
    transform: translateY(-5px);
    transition: all ease 0.36s;
    box-shadow: 0 4px 15px rgba(180, 180, 180, 0.6);
}



.workshop{ padding: 4% 0 0; }
.workshop .auto{overflow: hidden;}
.workshop ul{ margin: 0 -1%;}
.workshop ul li{float: left; width: 23%;margin: 0 1% 20px 1%;text-align: center;}
.workshop ul li .pic{display: block; padding:0 10%; position: relative;border: 1px solid #eee; background:#fff;    height: 0px;
    padding-bottom: 70%;
    overflow: hidden;}
.workshop ul li img{max-width:100%; max-height: 100%; display:block;position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;}
.workshop ul li h4{overflow:  hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow:  ellipsis; margin:10px 0 0; font-weight: normal; font-size: 14px;}

.honor{ padding: 0% 0 0; }
.honor .auto{overflow: hidden;}
/*.honor ul{ display:flex;justify-content:center;flex-wrap: wrap; max-width:990px; margin:0 auto; gap:10px;}
.honor ul li:nth-child(1){margin-left:10px;}
.honor ul li{ text-align: center; margin-bottom:20px;}
.honor ul li{
    width:240px;
  }*/

.honor ul{
    max-width:1000px;
    margin: 0 auto;
    text-align: center;
    padding: 0;
    list-style: none;
    display: grid;
    /* 第一行3列，第二行4列，列宽均为240px，列间距10px */
    grid-template-columns: repeat(3, 240px); /* 第一行3列 */
    grid-template-rows: auto auto; /* 两行 */
    gap: 20px;
    justify-content: center; /* 整体居中 */
}

.honor ul li.honor-item1,.honor ul li.honor-item2,.honor ul li.honor-item3{margin-left:50%;}

  /* 从第4个li开始，放到第二行，并设置第二行为4列 */
.honor ul li:nth-child(n + 4) {
    grid-row: 2; /* 第二行 */
  }
  /* 单独指定第二行的列分布（4列，每列240px） */
.honor ul li.honor-item4 { grid-column: 1; }
.honor ul li.honor-item5 { grid-column: 2; }
.honor ul li.honor-item6 { grid-column: 3; }
.honor ul li.honor-item7 { grid-column: 4; width:240px}

.honor ul li {
    width:100%;
    box-sizing: border-box;
    text-align: center;
    margin-bottom: 10px;
  }

.honor ul li.honor-item {
box-sizing: border-box;
padding: 15px;
border: 1px solid #eee;
text-align: center;
}


.honor ul li .pic{display: block; padding:0 10%; position: relative;border: 1px solid #666; background:#fff;    height: 0px;
    padding-bottom: 141%;
    overflow: hidden;}
.honor ul li img{max-width:100%; max-height: 100%; display:block;position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;     transition: .75s ease-in-out;}
.honor ul li .pictit{overflow:  hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow:  ellipsis; margin:6px 0 0; font-weight: normal; font-size: 16px; color:#666; line-height:42px; width:auto; }
.honor ul li .pictit a{color:#fff; padding:6px 24px; background: #3888c4; border-radius:30px; transition: .75s ease-in-out;}
.honor ul li:hover .pic{border:1px solid #3888c4;     box-shadow: 0 0 8px 1px rgba(56, 136, 196, 0.5);}
.honor ul li:hover .pic img{    transform: translate(-50%,-50%) scale(1.1);     transition: .75s ease-in-out;}
.honor ul li:hover .pictit a{
    color:#fff;
    padding:6px 36px
}




.newslist{ padding-top:2%; min-height: 400px; padding:72px 0px;}
.newslist h3{ margin:0; font-size:18px;}
.newslist p{ line-height:26px; overflow:hidden; color:#999; height:52px; margin:2% 0 0 0;}

.newslist ol{ background-color:#fafafa; margin-bottom:2%; position:relative; padding-left:36.25%;}
.newslist ol .Ispic{ width:36.25%; position:absolute; left:0; top:0; height:100%;}
.newslist ol .Ispic img{ display:none;}
.newslist ol div{ padding:5% 10% 3% 5%;}
.newslist ol h3 a{ color:#3888c4;}
.newslist ol h3 a:hover{ color:#0490d9; }
.newslist ol time{ display:block; padding:3% 0;}
.newslist ol p{ margin:0 0 3% 0; height:78px;}
.newslist ol span{ display:inline-block; width:130px; line-height:40px; text-align:center;  background:#3888c4; font-size:12px; transition: 0.3s ease; }
.newslist ol span:hover{ width: 160px; background:#0490d9; }
.newslist ol span a{  color:#fff; }

.newslist li{ overflow:hidden; padding-left:160px; padding-right:58px; position:relative; margin-bottom:2%; background-color:#fff;}
.newslist li div{border-left:1px solid #eee; padding:2% 3%;}
.newslist li time{ position:absolute; left:0; top:0; width:160px; height:100%;}
.newslist li time span{ position:absolute; width:100%; text-align:center; top:50%;-ms-transform:translateY(-50%);-webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); transform:translateY(-50%); color:#b2b2b2; font-size:16px;}
.newslist li time i{ font-style:normal; font-size:50px; color:#999; display:block; font-family:"Courier New", Courier, monospace; line-height:40px;}
.newslist li time i:after{ display:block; content:''; margin:5px auto; height:1px; width:50%; max-width:66px; background:#dfdfdf;}

.newslist li:hover{ background-color:#3888c4; }
.newslist li:hover *{  color:#fff; }

@media(max-width:1000px){
.newslist li{padding-left:100px;padding-right:30px;}
.newslist li:after{width:30px; background-size:35% auto;}
.newslist li time{width:100px;}
.newslist li time span{font-size:14px;}
.newslist li time i{font-size:40px;line-height:30px;}


.honor ul{display: flex; width:100%; flex-wrap: wrap;justify-content: space-between;}
.honor ul li{width:25%;}
.honor ul li.honor-item1, .honor ul li.honor-item2, .honor ul li.honor-item3{margin-left: 0px;}
}
@media(max-width:768px){
.newslist h3{ font-size:16px;}
}
@media(max-width:640px){
.newslist ol{ padding-left:0;}
.newslist ol .Ispic{ width:auto; position:relative; height:auto; display:block; padding-bottom:60%;}
.newslist ol div{ padding:3%;}

.honor ul li{width:24%;}
.honor ul li.honor-item7{width:24%;}
}
@media(max-width:480px){
.newslist li{padding-left:80px;padding-right:0;}
.newslist li:after{ display:none;}
.newslist li time{width:80px;}
.newslist li time span{font-size:12px;}
.newslist li time i{font-size:30px;}
.newslist h3{ font-size:14px;}
.newslist p{ font-size:12px; line-height:20px; overflow:hidden; height:40px;}
.newslist ol p{ height:60px;}
.honor ul li{width:47%;}
.honor ul li.honor-item7{width:47%;}
}

.content{ background:#f7f7f7;}
.news_info{ padding: 3% 0; }
.news_info .title{ text-align:center; padding-bottom:0px; background:none;}
.news_info .title h1{ margin:0; padding-bottom:15px; font-size:24px; font-weight:normal;}
.news_info .title p{ margin:0; border-bottom:1px dashed #d2d2d2; padding-bottom:20px;}
.news_info .title p span{ margin:0 36px; color:#999;  font-size:12px;}
.news_info .info{ text-align:justify; text-justify:inter-ideograph; padding-top:20px;}
.news_info .info img{ margin:15px auto; display: block; }
.news_info .info p{ font-size:14px; color:#666; line-height:30px; margin:12px 0; text-indent:2em;}

.news_info .btn{ text-align: center; }
.news_info .goback{ background:#1b699f; padding:8px 18px; color:#fff; border-radius:6px; display: inline-block; margin: 20px 0;}
.news_info .goback:hover{background:#00b3dc; }

.news_info .info_back{ padding:2% 0 20px 0;}
.news_info .info_back dl{ margin: 10px 0;}
.news_info .info_back a{ color:#999; font-size:14px;}
.news_info .info_back a:hover{color:#1b699f;}


.pagecontact .p,.pagecontact .h2,{}
.pagecontact{padding: 8% 0}
.pagecontact .text{margin-bottom: 30px}
.pagecontact .text .title{font-size: 30px;color: #e4e4e4;font-weight: normal;margin-bottom: 20px; margin-top: 0; padding:0px; text-align: left}
.pagecontact .text p{font-size: 16px;color:#333;line-height: 42px; margin: 0; padding: 0;}
.pagecontact .text .title span{font-weight: 700;}
.pagecontact .text h3.ctit{margin-bottom: 24px; color:#3888c4; font-size:24px;}
.pagecontact .text .p{font-size: 16px;color:#333;line-height: 42px; margin: 0; padding: 0;}
.pagecontact .map{width: 100%;  background: #fff;
    padding: 1%;
    border-radius: 20px 0;}
.pagecontact .map #map{height: 100%;}
.pagecontact .map img{max-width:100%}


.t-center{text-align: center; max-width:960px; margin:0 auto;}

.serlist{
    margin-top:80px;
    }
.serlist li{
    float:left;
    width:33.3%;
    }
.serlist li a{
    display:block;
    width:90%;
    height:320px;
    text-align:center;
    border:2px solid #eee;
    border-radius:5px;
    margin:auto;
    padding-top:60px;
    background-color:#fff;
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center center;
    position:relative;
    overflow:hidden;
    }
.serlist li span{
    display: inline-block;
    width:40%;
    max-width:110px;
    position:relative;
    z-index:3;
    }
.serlist li span img{
    width:100%;
    height:auto;
    }
.serlist li h3{
    font-weight:normal;
    font-size:20px;
    margin-top:15px;
    height:24px;
    position:relative;
    z-index:3;
    }
.serlist li p{
    color:#999;
    font-size:14px;
    margin-top:10px;
    position:relative;
    z-index:3;
    }
.serlist li i{
    display:block;
    width:100%;
    height:100%;
    background-color:#fff;
    opacity:.9;
    transition:all ease-in .3s;
    position:absolute;
    left:0;
    top:0;
    z-index:1;
    }
.serlist .ser1 a{
    background-image:url(../images/service2.jpg);
    }
.serlist .ser2 a{
    background-image:url(../images/service4.jpg);
    }
.serlist .ser3 a{
    background-image:url(../images/service3.jpg);
    }
.serlist li a:hover i{
    opacity:.5;
    }
.serlist li a:hover p{
    color:#0081CC;
    }


@media screen and (min-width: 768px) {
    .pagecontact .text{float: left;width: 45%;}
    .pagecontact .map{float: right;width: 50%;height: 320px;}
}

@media screen and (min-width: 1024px) {
    .pagecontact .auto{background: url(../images/righinfo001749-bg.jpg) no-repeat center;}
    .pagecontact .map{float: right;width: 50%;height: 320px;}
    .pagecontact .text .title{font-size: 52px;}
}

@media screen and (min-width: 1200px) {
    .pagecontact{padding: 70px 0 70px}
    .pagecontact .text .title{margin-bottom: 55px}
    .pagecontact .map{ width: 65%;height: 430px;}
    .pagecontact .text{width: 35%;}
}



@media only screen and (max-width:768px) {
    .mainbox{padding:32px 0px;}
    .pro_index{width:100%;}
    .pro_index ul li{width:49%;}
    .pro_index ul li:nth-child(3n){margin-right:2%}
    .pro_index ul li:nth-child(2n){margin-right:0%}
    .prodetailbox{margin:0px 0px 12px;    flex-wrap: wrap;}
    .prodetailboxcon,.proimg{width:100%;}
    .proimg{margin-top:12px;}
    .proinfo{margin:0px;    flex-wrap: wrap;}
    .proinfo .proinfoleft{width:100%;}
    .proinfo .proinforight{width:100%;}

    .workshop ul li{width:48%; margin-bottom:10px;}

    .serlist li{
        float:none;
        width:100%;
        margin-bottom:20px;
        }


        .bfmob-menu-click{display:none}
}



.pagination {margin-top: 30px; margin-bottom:36px;   display: flex;
    flex-wrap: nowrap;
    justify-content: center;}
.page {
    width:100%;
  display:contents;
  font: 16px/28px '微软雅黑', sans-serif;
  *display:inline;
  :1;
  *zoom:1;}
.page a,.page strong{
  background:#FFF;
  border:1px solid #CCC;
  color:#333;
  float:left;
  font: 16px/24px  '微软雅黑', sans-serif;
  margin-right:5px;
  min-width:15px;
  padding:4px 12px;
  border-radius:4px;
  text-align:center;
  vertical-align:middle;
  white-space:nowrap;
  _width:15px;}
.page strong{background:#007dc4; color:#fff; }
.page a:hover,.page .active a {
  border:1px solid #007dc4;
  color:#007dc4;
  text-decoration:none;}