
.join_box1 li{width: 360px;height: 300px;margin-top: 80px;border: 1px solid #eee;padding: 90px 30px 20px 30px;position: relative; float: left;margin-right: 60px;transition: all 0.6s;}
.join_box1 li:nth-child(3n){margin-right: 0;}

.join_box1 li .icon{width: 122px;height: 122px;background: url(../images/join_icon1.png) no-repeat 0 0/100% 100%;color: #fff;line-height: 122px;font-size:50px;position: absolute;left: 119px;top: -64px;z-index: 1;transition: all 0.6s;}
.join_box1 li:first-child .icon{background-image: url(../images/join_icon2.png);}
.join_box1 li:nth-child(2) .icon{background-image: url(../images/join_icon2.png);}
.join_box1 li:last-child .icon{background-image: url(../images/join_icon3.png);}
.join_box1 li .tit{font-size: 20px;line-height: 30px;margin-bottom: 30px; font-weight: bold;}
.join_box1 li .text{font-size: 15px;line-height: 30px;}

.join_box1 li:hover .icon{animation: flipInX 1.5s;}
.join_box1 li:hover{box-shadow: 0 10px 30px -14px rgba(0, 0, 0, 0.4);border-color:#215BA5 ;}

.join_xg1 li{width: 375px;height: 420px;margin-top: 10px;padding: 50px 30px 20px 30px;position: relative; float: left;margin-right: 37px;background: url(../images/join_icon6.png) no-repeat 0 0/100% 100%;transition: all 0.6s;}
.join_xg1 li:nth-child(3n){margin-right: 0;}
.join_xg1 li:nth-child(1){background: url(../images/join_icon6.png) no-repeat 0 0/100% 100%;}
.join_xg1 li:nth-child(2){background: url(../images/join_icon7.png) no-repeat 0 0/100% 100%;}
.join_xg1 li:nth-child(3){background: url(../images/join_icon8.png) no-repeat 0 0/100% 100%;}
.join_xg1 li .icon{width: 100px;height: 100px;border-radius: 50%;color: #fff;line-height: 100px;font-size:52px;margin: 0 auto 30px auto;background: rgba(255,255,255,0.3);}
.join_xg1 li .tit{font-size: 24px;line-height: 30px;margin-bottom: 30px; font-weight: bold;}
.join_xg1 li .text{font-size: 15px;line-height: 30px;    text-align: justify;text-align-last: center;}
.join_xg1 li:hover{transform: translateY(-10px);box-shadow: 0 3px 15px rgba(0,0,0,0.4);}

.join_box2{background: url(../images/join_img1.png) no-repeat 0 0/100% 100%;padding:80px 0 80px 0;}
.join_box2 .tit{line-height: 66px;font-size: 36px;}
.join_box2 .text{font-size: 50px;line-height: 60px;font-family: "Impact"; color: rgba(255,255,255,0.5);margin-top: 35px;letter-spacing: 3px;text-transform: uppercase;}

.join_box3 .cont .img{max-width: 100%; display: block;margin:70px auto 50px auto;}
.join_box3 .cont .btn{width: 420px;height: 64px;border-radius: 40px;border: 5px solid #d7ecff;background: #215ba5; color: #fff;font-size: 18px;line-height: 54px;margin: 0 auto;box-shadow: 0 3px 10px rgba(153,153,153,0.5);transition: all 0.6s;}
.join_box3 .cont .btn:hover{transform: scale(1.05);box-shadow: 0 3px 10px rgba(153,153,153,0.5);}

.join_box4 .imgs .tt{width: 380px;height: 230px;overflow: hidden;float: left;margin:0 30px 30px 0;box-shadow: 0 3px 13px rgba(153,153,153,0.5);}
.join_box4 .imgs .tt:nth-child(3n){margin-right: 0;}
.join_box4 .imgs .tt img{width: 100%;height: 100%; display: block;transition: all 0.6s;}
.join_box4 .imgs .tt:hover img{transform: scale(1.1);}


.join_box5 .cont li{border: 1px solid #eee;height: 110px;border-radius: 5px;position: relative; margin-bottom: 25px; cursor: pointer;transition: all 0.3s;}
.join_box5 .cont li a{padding: 20px 140px; display: block;}
.join_box5 .cont li .tit{font-size: 20px;line-height: 30px;margin-bottom: 10px;font-weight: normal;}
.join_box5 .cont li .time{font-size: 15px;color: #999;} 
.join_box5 .cont li::before{content: '';width: 63px;height: 70px;background: url(../images/join_icon4.png) no-repeat 0 0/100% 100%;position: absolute;left:50PX;top: 50%;transform: translateY(-50%);z-index: 1;}
.join_box5 .cont li::after{content: '\e60f';font-size: 30px;color: #999;position: absolute;right:50PX;top: 50%;transform: translateY(-50%);z-index: 1;transition: all 0.6s;}
.join_box5 .cont li:hover{background: #215ba5;border-color: #215ba5;box-shadow: 0 5px 15px rgba(0,37,85,0.2); transform: scale(1.02);}
.join_box5 .cont li:hover .tit,.join_box5 li:hover .time{color: #fff;}
.join_box5 .cont li:hover::after{color: #fff;transform:translateY(-50%) rotate(45deg);}

.join_box5 .cont li:hover::before{background-image: url(../images/join_icon5.png);}

/* 联络我们 */
.contactus-box1 .item{width:31%;height: 270px;padding: 35px 15px;margin-right:3.5%;float: left;transition: all 0.6s;background: #215BA5;box-shadow: 0 5px 10px rgba(36,105,192,0.4);color: #fff;}
.contactus-box1 .item:nth-child(1){background: url(../images/contactus-img2.png) no-repeat 0 0/100% 100%;}
.contactus-box1 .item:nth-child(2){background: url(../images/contactus-img3.png) no-repeat 0 0/100% 100%;}
.contactus-box1 .item:nth-child(3){background: url(../images/contactus-img4.png) no-repeat 0 0/100% 100%;}
.contactus-box1 .item:nth-child(3n){margin-right: 0;}
.contactus-box1 .item .box{width: 100%;height: 100%;border: 1px solid #0076a0;padding: 40px 20px 20px 20px;}
.contactus-box1 .item .icon{width: 80px;height: 80px;border-radius: 50%;font-size:46px;line-height: 80px;margin-bottom:20px; display: block;margin: 0 auto;background-color: rgba(255,255,255,0.4); color: #fff;transition: all 0.6s;}
.contactus-box1 .item .tit{line-height: 24px;font-size: 18px;margin: 30px auto 15px auto; font-weight: normal;}
.contactus-box1 .item .text{font-size: 15px;line-height: 24px;}
.contactus-box1 .item:hover{margin-top: -8px;box-shadow: 0 10px 28px rgba(36,105,192,0.6);}
.contactus-box1 .item:hover .icon{transform: rotate(360deg);}

.contactus-box2 .cont .left{width: 500px;height: 365px;background: #215ba5;box-shadow: 2px 3px 8px rgba(0,0,0,0.15);}
.contactus-box2 .cont .left .pic{width: 100%;height: 100%; overflow: hidden;position: relative;top:20px;left: 20px;}
.contactus-box2 .cont .left .pic img{width: 100%;height: 100%; display: block;transition: all 0.6s;}
.contactus-box2 .cont .left .pic:hover img{transform: scale(1.1);}
.contactus-box2 .cont .right{width: 580px;box-shadow: 0px 2px 18px rgb(210 210 210 / 8%);padding:40px 50px;}
.contactus-box2 .right .tt{margin-bottom: 15px;}
.contactus-box2 .right .tit{line-height: 30px;font-size: 15px;padding-bottom: 5px;}
.contactus-box2 .right .input{width: 100%;height: 40px;padding:5px 10px;line-height:30px;font-size: 15px; display: block;border: 1px solid #eee;}
.contactus-box2 .right textarea{width: 100%;height:100px;padding:5px 10px;line-height:34px;font-size: 16px; display: block;border: 1px solid #eee;}


.mapbox{border: 10px solid #fff;box-shadow: 0 2px 5px rgba(0,0,0,0.08);}
.mapbox .box {width: 100%;height: auto;overflow: hidden;}
.mapbox .box img{width: 100%; display: block;}





