﻿.zbanner{width: 100%;}
.zbanner img{width: 100%;}
.position{display: flex;justify-content: space-between;margin-top:50px}
.position .location{line-height: 48px;font-size: 12px;color: #666666;}
.position .location a:last-child{color: #202389;}
.position ul{display: flex;}
.position ul li{margin-left: 15px;}
.position ul li a{color: #777777;font-size: 14px;display: block;width: 100%;height: 100%;padding: 0 20px;border: 1px solid #eeeeee;border-radius: 30px;line-height: 48px;box-sizing: border-box;}
.position ul li:hover a,.position ul li.active a{background: #202389;color: #fff;}
.mainBox{margin-top: 60px;}

.caseBox ul{display:flex;/* justify-content:space-between; */flex-wrap: wrap;}
.caseBox ul li{width:384px;height:257px;overflow:hidden;position:relative;margin-bottom: 23px;margin-right: 24px;}
.caseBox ul li:nth-child(3n){margin-right:0}
.caseBox ul li img{width:100%}
.caseBox ul li .mb{position:absolute;width:100%;height:100%;background:rgba(51,51,51,0.55);top:100%;left:0;transition:all .5s ease-in-out}
.caseBox ul li .mb span{height:40px;display:block;margin-top:77px;background:url(../img/jia.png) center center no-repeat}
.caseBox ul li .mb p{line-height:52px;text-align:center;font-size:24px;color:#fff}
.caseBox ul li:hover .mb{top:0}

#pages{margin: 30px 0 100px;text-align: center;font-size: 0;}
#pages a{display: inline-block;width: 36px;height: 36px;border: 1px solid #f2f2f2;box-sizing: border-box;font-size: 14px;color: #aaaaaa;line-height: 36px;vertical-align: middle;margin: 0 8px;}
#pages a.prev{background: url(../img/pageBtn.png) left top no-repeat;}
#pages a.next{background: url(../img/pageBtn.png) right top no-repeat;}
#pages a.currentpage,#pages a:hover{background-color: #efefef;border: 1px solid #e8e8e8;}

.newsBox ul{margin-bottom: 100px;}
.newsBox ul li a{display:flex;justify-content:space-between;padding-bottom: 30px;margin-bottom: 30px;border-bottom: 1px solid #f0f0f0;}
.newsBox ul li .Img{width:200px;height:133px;overflow:hidden;}
.newsBox ul li .Img img{transition: all .35s ease-in-out;}
.newsBox ul li .Text{width: 818px;}
.newsBox ul li .Text p{line-height: 50px;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;font-size: 14px;color: #666666}
.newsBox ul li .Text .summary{line-height: 30px;margin-top: 5px;font-size: 14px;color: #999999;height: 60px;overflow: hidden;}
.newsBox ul li .time{width: 125px;text-align: right;font-size: 24px;color: #999999;line-height: 72px;}
.newsBox ul li:hover .Text p,.newsBox ul li:hover .time{color: #202389;}
.newsBox ul li:hover img{transform: scale(1.2);}

.newsInfo{padding:0 0 100px;margin-top:30px}
.newsInfo>p{font-size:20px;padding:10px 0;line-height: 30px;text-align:center;}
.newsInfo>.time{text-align:center;font-size:12px;color:#999}
.newsInfo .info{border-top:1px solid #eee;margin-top:20px;color:#666;font-size: 14px;line-height:30px;padding: 15px 0;}

.aboutBox{margin-top: 85px;}
.aboutBox p.title{line-height: 50px;font-size: 36px;color: #333333;text-align: center;margin-bottom: 45px;}
.aboutBox .summary{font-size: 14px;color: #333;text-align: center;margin-bottom: 45px;display: none;}
.aboutBox .info{color: #333333;font-size: 14px;line-height: 24px;}
.honorBox{margin-top: 90px;}
.honorBox .infoBox{background: #e8e8e8;margin:45px 0 110px;}
.honorBox .infoBox ul{padding:30px 0 35px;}
.honorBox .infoBox ul li{width: 100%;height: 300px;margin-bottom: 17px;position: relative;}
.honorBox .infoBox ul li .Img{width: 281px;height: 300px;overflow: hidden;position: absolute;}
.honorBox .infoBox ul li .Img img{width: 100%;}
.honorBox .infoBox ul li .Img p{position: absolute;font-size: 48px;color: #ffffff;top: calc(50% - 24px);width: 100%;text-align: center;left: 0;}
.honorBox .infoBox ul li .Img p span{font-size: 18px;}
.honorBox .infoBox ul li .Text{width: 930px;height: 270px;background: #fff;position: absolute;right: 0;top: calc(50% - 135px);padding:15px 20px 15px 40px;box-sizing: border-box;box-shadow: 0 1px 10px 1px rgba(0,0,0,.1);}
.honorBox .infoBox ul li .Text dl{overflow-y: scroll;height: 200px;overflow-x:hidden;}
.honorBox .infoBox ul li .Text dl::-webkit-scrollbar{width:6px;height:100%;}
.honorBox .infoBox ul li .Text dl::-webkit-scrollbar-thumb{background:#e8e8e8;border-radius: 30px;width:100%}
.honorBox .infoBox ul li .Text dl::-webkit-scrollbar-button{display: none;}
.honorBox .infoBox ul li .Text dl dd{line-height: 50px;display: flex;justify-content: space-between;}
.honorBox .infoBox ul li .Text dl dd span{font-size: 20px;color: #333333;}
.honorBox .infoBox ul li .Text dl dd p{font-size: 14px;color: #333;width: 804px;}
.honorBox .infoBox ul li:nth-child(2n) .Img{right: 0;}
.honorBox .infoBox ul li:nth-child(2n) .Text{left: 0;}

.contactBox{padding-bottom:100px;margin-top:30px;display:flex;justify-content:space-between;position:relative;}
.contactBox #maps{width:50%;height:400px}
.map{width:100%;height:100%;font-size: 12px;line-height:1.5}
.map .BMap_bubble_title{font-size:16px;margin-bottom:5px}
.contactBox .info{width:45%;font-size:16px;color:#333;line-height:30px;padding:10px 0}
.contactBox .mapImg img{width:100%;}
.contactBox .mapInfo {
    position: absolute;
    left: 215px;
    top: 147px;
}

.contactBox .mapInfo img {
    position: absolute;
    left: 50%;
    top: -20px;
    max-width: 35px;
    transform: translateX(-50%);
}

.contactBox #footer-logo-canvas1 {
    width: 40px;
    height: 40px;
}

/* letter */
.letterBox{padding:0 50px 50px;box-sizing: border-box;}
.letterHead{text-align:center}
.letterHead p{font-size:26px;line-height:50px}
.letterHead span{font-family:Arial, 宋体;white-space:normal;background-color:#FFFFFF;color:#666;font-size:14px}
.letterBox form{width: 1100px;margin:0 auto;display:flex;flex-wrap:wrap;margin-top: 25px;}
.letterBox form p{width: 48%;margin-right: 4%;}
.letterBox form p:nth-child(7),.letterBox form p:nth-child(8),.letterBox form p:nth-child(10){width:100%}
.letterBox form p:nth-child(9){line-height:40px;font-size:12px;padding-left: 98px;box-sizing:border-box;}
.letterBox form p:nth-child(10){text-align:center}
.letterBox form p:nth-child(2n){margin-right:0}
.letterBox form p input[type="text"]{border:1px solid #e5e5e5;background: #f7f7f7;width: 350px;height: 43px;margin: 25px 0px 0px 18px;box-sizing: border-box;padding: 0 6px;}
.letterBox form p span{width: 90px;float: left;font-size: 14px;color: #231815;margin-top: 37px;text-align:right;letter-spacing: 0.6px;}
.letterBox form p span i{color:red;margin-right:5px;font-style: normal;}
.letterBox form p textarea {resize: none;height: 217px;width: calc(100% - 134px);border: 1px solid #e5e5e5;padding: 10px 5px;font-family: "微软雅黑";margin: 26px 0 0 18px;background: #f7f7f7;box-sizing: border-box;}
.letterBox form p input[type="submit"] {width: 137px;height: 41px;line-height: 41px;background: #202389;color: #06336c;cursor: pointer;text-align: center;margin: 25px 0;border:0;color:#fff;font-size:16px;}
.letterBox form p:nth-child(8) span{letter-spacing: 4px;}
.letterBox form p:nth-child(8) input[type="text"]{width: 766px;width: 200px;}
.letterBox form p:nth-child(8) img{width: 100px;margin: 0 15px;}

.main .searchBox{margin-top:30px;}
.searchBox ul li{line-height:50px;border-bottom:1px solid #eee}
.searchBox ul li a{display:flex;justify-content:space-between}
.searchBox ul li p{width:calc(100% - 120px);text-overflow:ellipsis;overflow:hidden;white-space:nowrap}
.searchBox ul li .time{font-size:14px}
.searchBox ul li:hover a{color:#202389}
@media screen and (max-width:880px){
    .zbanner{margin-top:15vw;height:40vw;position: relative;overflow: hidden;}
    .zbanner img{height:100%;width:auto;max-width: unset;transform: translate(-50%, -50%);position: absolute;top: 50%;left: 50%;}

    .position{margin-top:5vw;padding: 0 4vw;box-sizing: border-box;display: block;}
    .position .location{line-height:30px}
    .position ul{margin:4vw 0 8vw;justify-content: center;display: none;}
    .position ul li{margin-left:0;margin-right:2vw}
    .position ul li a{line-height: 24px;font-size: 12px;padding: 0 3vw;}

    .mainBox{padding:0 4vw;box-sizing:border-box;margin-top: 3vw;min-height: 50vw;padding-bottom: 9vw;}
    .searchBox ul li{line-height:30px}
    .searchBox ul li .time{font-size:12px}


    #pages{margin: 8vw 0 10vw;}
    #pages a{width:30px;height:30px;line-height:30px;font-size: 12px;margin: 0 6px;background-size: auto 100%!important;}

    .aboutBox{margin-top:5vw;margin-bottom: 15vw;}
    .aboutBox p.title{line-height:30px;font-size:20px}
    .aboutBox .summary{font-size:12px;margin-bottom:6vw}
    .aboutBox .info{line-height:20px;font-size:12px;padding:0 4vw;box-sizing: border-box;}
    .honorBox .infoBox{margin-top:6vw;padding: 4vw;margin-bottom: 9vw;}
    .honorBox .infoBox ul{padding:4vw 0 0}
    .honorBox .infoBox ul li{height: auto;margin-bottom: 6vw;}
    .honorBox .infoBox ul li .Img{position:relative;width:100%;height: 20vw;}
    .honorBox .infoBox ul li .Img p{font-size:30px}
    .honorBox .infoBox ul li .Text{width:100%;height:60vw;padding: 4vw 4vw 4vw 6vw;position: static;}
    .honorBox .infoBox ul li .Text dl{height:50vw}
    .honorBox .infoBox ul li .Text dl::-webkit-scrollbar{width:3px;height:100%;}
/*     .honorBox .infoBox ul li .Text dl::-webkit-scrollbar-thumb{background:#e8e8e8;width:3px}
    .honorBox .infoBox ul li .Text dl::-webkit-scrollbar-button{display: none;} */
    .honorBox .infoBox ul li .Text dl dd{line-height:24px}
    .honorBox .infoBox ul li .Text dl dd span{width:40px;font-size:14px}
    .honorBox .infoBox ul li .Text dl dd p{width:calc(100% - 45px);font-size:12px}

    .newsBox ul{margin-bottom:10vw}
    .newsBox ul li{position:relative}
    .newsBox ul li a{padding-bottom:5vw;margin-bottom:5vw}
    .newsBox ul li .Img{width:36vw;height: auto;}
    .newsBox ul li .Text{width:50vw}
    .newsBox ul li .Text p{line-height:30px;width: calc(100% - 40px);}
    .newsBox ul li .Text .summary{line-height:20px;font-size: 12px;margin-top: 0;}
    .newsBox ul li .time{position:absolute;top: 0;right:0;width: auto;font-size: 12px;line-height: 30px;}

    .newsInfo>p{font-size: 16px;line-height: 20px;}
    .newsInfo .info{line-height:20px;font-size:12px;padding: 3vw 0;}

    .caseBox ul li{width:48%;height: auto;margin-bottom: 4vw;margin-right: 4%;}
    .caseBox ul li:nth-child(3n){margin-right: 4%;}
    .caseBox ul li:nth-child(2n){margin-right:0}
    .caseBox ul li .mb{top:0}
    .caseBox ul li .mb span{margin-top: 7vw;height: 30px;background-size: auto 100%;}
    .caseBox ul li .mb p{line-height:40px;font-size:14px}

    .contactBox{display:block}
    .contactBox #maps{width:100%;height: 70vw;}
    .contactBox .info{width:100%;font-size: 14px;line-height: 30px;}
     .contactBox .mapInfo{left: 34vw;top: 20vw;}

    .letterHead p{font-size: 20px;line-height: 40px;}
    .letterHead span{font-size: 12px;line-height: 1.5;}
    .letterBox{padding:4vw}
    .letterBox form{width:100%;margin-top:4vw;display: block;}
    .letterBox form p{width:100%;margin-right: 0;}
    .letterBox form p span{margin-top: 3vw;line-height: 30px;}
    .letterBox form p input[type="text"]{margin-top:3vw;width:calc(100% - 110px);margin-left: 3vw;height: 30px;}
    .letterBox form p textarea{margin-top:3vw;width:calc(100% - 110px);margin-left: 3vw;height:25vw}
    .letterBox form p:nth-child(8) input[type="text"]{width:calc(70vw - 110px)}
    .letterBox form p:nth-child(8) img{margin:0 1vw;width:20vw}
    .letterBox form p input[type="submit"]{width:30vw;height:30px;line-height:30px;font-size:14px}
    .letterBox form p:nth-child(9){padding-left: 98px;box-sizing:border-box;margin: 0;}

}