﻿


.join_banner{ padding:0 10%; display:flex; background:url(../images/join_banner.jpg) no-repeat center; height:32.23rem; position:relative;}
.join_banner .banner-text{ top:50%; position:absolute;top:50%; line-height:2;  -webkit-transform: translate(0,-50%);transform: translate(0,-50%);}
.join_banner .banner-text h2{ color:#000; font-size:2.3rem;}
.join_banner .banner-text p{ font-size:1.1rem; line-height:1.7; color:#000;}
.join_banner .banner-text .shenqing{ height:3rem; line-height:3rem; text-align:center; margin-top:4rem; border:1px solid #000; display:block; width:9rem; border-radius:0.5rem; font-size:1.2rem; display:block;}


.join-xiangmu{ padding:3% 10%;}
.join-xiangmu-list{ display:flex; padding:2% 0;}
.join-xiangmu-list li{ flex:1; font-size:1rem; box-shadow:0.1rem 0.1rem 0.5rem rgba(0,0,0,0.1); padding:0.5rem 2rem 2rem 2rem; text-align:center; margin-right:3%; }
.join-xiangmu-list li:last-child{ margin-right:0;}
.join-xiangmu-list li img{  display:block; width:7rem; margin:0 auto; }
.join-xiangmu-list li h2{ font-size:1.3rem; color:#0063ff;margin:1rem auto; }
.join-xiangmu-list li p{ font-size:0.83rem; text-align:left; line-height:1.8; color:#555;}

.join-hexin{ background:url(../images/join_chanpin.jpg) no-repeat top left #f7f7f7; padding:3% 10%;}



.join-hexin-list{ display: flex; flex-wrap: wrap; justify-content: space-around; list-style: none; padding-inline-start: 0; margin-top:3.5%;}
.join-hexin-list li{  margin-right:3.1%; width:13%; border-radius:2rem; overflow:hidden; position:relative; cursor:pointer; transition:all 0.2s ease-in;}
.join-hexin-list li .img img{ display:block; height:23.23rem; }
.join-hexin-list li .text-bg{ position:absolute; bottom:0; text-align:center; height:100%; width:100%;  background:rgba(0,0,0,0.6);}
.join-hexin-list li .text1{padding:2.2rem 0; position:absolute; bottom:0; width:100%;transition: bottom linear .3s;}
.join-hexin-list li .text1 img{ display:block; height:1.6rem; margin:1rem auto;}
.join-hexin-list li .text1 h2{ font-size:0.8rem; font-weight:bold; color:#fff;}
.join-hexin-list li .text1 p{ display:none; font-size:1rem; color:#fff; line-height:1.5;}

.join-hexin-list li:last-child{ margin-right:0;}

.join-hexin-list li .text{ padding:1.8rem 2rem; text-align:left; position:absolute; bottom:0; width:29.63rem; display:block; left:-29.63rem;transition: all ease .3s;}
.join-hexin-list li .text h2{ font-size:1.3rem; margin-bottom:0.5rem; color:#fff; font-weight:bold; display:block;}
.join-hexin-list li .text p{ font-size:1rem; color:#fff; line-height:1.5;}
.join-hexin-list li.active{ width:35.6%;}
.join-hexin-list li.active .text1{ bottom:-100%;}
.join-hexin-list li.active .text{left:0; background:rgba(0,0,0,0.4)}

.join-hexin-list li.active .text-bg{  background:rgba(0,0,0,0);}

.join-hexin-mobile-list{ display:none !important;}

/*********************************************************/
.join-zhengce{ background:url(../images/join_zc.jpg) no-repeat top right #293042; padding:3% 10%;}
.join-zhengce-list{ display:flex; margin:4% auto 2% auto;}
.join-zhengce-list .owl-item{ padding:0 2rem;}
.join-zhengce-list li{ flex:1; background:#1f2638;   padding-bottom:2rem; border-radius:1.2rem; border-radius:1rem; overflow:hidden; text-align:center; }
.join-zhengce-list li img{ display:block; max-width:100%;}
.join-zhengce-list li h2{ font-size:1.5rem; font-weight:bold; color:#fff; margin-top:1.5rem;}
.join-zhengce-list li p{ padding:1.1rem 1.5rem; line-height:1.8; font-size:0.9rem; text-align:left; color:#fff;}
.join-zhengce-list .owl-item:last-child{ margin-right:0;}
.join-zhengce .indextitle h2{ color:#fff;}




/************/
.join-hezuo{ background:#fff; padding:3% 10%;}
.join-hezuo-list{ margin:3% auto;display: flex; flex-wrap: wrap; justify-content: space-around; list-style: none; padding-inline-start: 0;}
.join-hezuo-list li{ width:23%; background:#fafafa; margin-bottom:2.6%; border-radius:1rem; overflow:hidden; margin-right:2.666%; position:relative;}
.join-hezuo-list li img{ display:block; width:5.46rem;}
.join-hezuo-list li h2{ display:none;}
.join-hezuo-list li p{ font-size:0.9rem; padding-right:0.7rem; position:absolute; top:50%; left:6.5rem; line-height:1.7;  -webkit-transform: translate(0,-50%);transform: translate(0,-50%);}
.join-hezuo-list li:nth-child(4n){ margin-right:0;}
.join-hezuo-list li span{ display:none;}

/************/
.join-contact{ padding:3% 10%; background:#f7f7f7;}
.join-contact .join-contact-left{ width:40%; line-height:2; float:left;}
.join-contact .join-contact-left h2{ font-size:1.2rem; font-weight:bold; color:#000;}
.join-contact .join-contact-left p{ font-size:1rem; color:#999; border-bottom:1px solid #ddd; margin-bottom:1rem; padding-bottom:1rem;}
.join-contact .join-contact-left h3{ font-size:1.2rem;}
.join-contact .join-contact-right{ width:25%; float:right;}
.join-contact .join-contact-right li{margin-bottom:1rem;}
.join-contact .join-contact-right li input{ width:100%; height:2rem; box-sizing:border-box; line-height:2rem; border:1px solid #ddd; font-size:0.8rem; padding:0.5rem 0.7rem;}
.join-contact .join-contact-right li .layui-anim-upbit{ font-size:0.8rem;}
.join-contact .join-contact-right li .layui-form-item{ display:flex;}
.join-contact .join-contact-right li .layui-form-item .layui-inline{ flex:1; margin:0 0.5rem 0 0; }
.join-contact .join-contact-right li .layui-form-item .layui-inline:last-child{ margin-right:0;}
.join-contact .join-contact-right li .tijiao{ background:#293042; color:#fff; width:100%; padding:0.6rem; height:auto; border:0; border-radius:0.2rem; font-size:0.8rem;}


@media (max-width:640px){
	.join_banner{ padding:0 3%; height:14rem; background-size:auto 100%; position:relative;overflow:hidden;background:url(../images/join_banner_m.jpg) no-repeat center;}
.join_banner .banner-text{ padding:1.2rem 0;  position:inherit;}
.join_banner .banner-text h2{ color:#000; font-size:1.8rem;}
.join_banner .banner-text p{ font-size:1rem; line-height:1.7; color:#000;}
.join_banner .banner-text .shenqing{ height:3rem; line-height:3rem; text-align:center; margin-top:2rem; border:1px solid #000; display:block; width:8rem; border-radius:0.5rem; font-size:1.1rem; display:block;}


.join-xiangmu{ padding:3% 1.5%;overflow:hidden;}
.join-xiangmu-list{ display:block; padding:2% 0;}
.join-xiangmu-list li{ width:47%; float:left; margin:1.5%; font-size:1rem; box-shadow:0.1rem 0.1rem 0.5rem rgba(0,0,0,0.1); padding:2%; }
.join-xiangmu-list li:last-child{ margin-right:0;}
.join-xiangmu-list li img{  display:block; width:7rem; margin:0 auto; }
.join-xiangmu-list li h2{ font-size:1.2rem; color:#0063ff;margin:1rem auto; }
.join-xiangmu-list li p{ font-size:1rem; text-align:left; line-height:1.8; color:#555;}

.join-hexin{ background:url(../images/join_chanpin.jpg) no-repeat top left #f7f7f7; padding:3%;overflow:hidden;}



.join-hexin-list{ display:none;}



.join-hexin-mobile-list{ margin-top:3.5%; display:block !important;}
.join-hexin-mobile-list li{ overflow:hidden; border-radius:1rem; position:relative; }

.join-hexin-mobile-list .owl-item{ }
.join-hexin-mobile-list .owl-item .img img{ display:block; height:auto; width:100%; }
.join-hexin-mobile-list .owl-item .text-bg{ position:absolute; bottom:0; text-align:center; height:100%; width:100%;  background:rgba(0,0,0,0);}
.join-hexin-mobile-list .owl-item .text1{ display:none;}

.join-hexin-mobile-list .owl-item .text{ padding:1.8rem 2rem; text-align:left; position:absolute; bottom:0; width:100%;background:rgba(0,0,0,0.1); display:block; left:0;transition: all ease .3s;}
.join-hexin-mobile-list .owl-item .text h2{ font-size:1.3rem; margin-bottom:0.5rem; color:#fff; font-weight:bold; display:block;}
.join-hexin-mobile-list .owl-item .text p{ font-size:1rem; color:#fff; line-height:1.5;}

.join-hexin-mobile-list .owl-page span{ background:#0063ff !important; }


/*********************************************************/
.join-zhengce{ background:url(../images/join_zc.jpg) no-repeat top right #293042; padding:3%; overflow:hidden;}
.join-zhengce-list{ display:flex; margin:4% auto 2% auto;}
.join-zhengce-list .owl-item{ padding:0 0.5rem;}
.join-zhengce-list li{  background:#1f2638; margin-right:2%;  padding-bottom:2rem; border-radius:1.2rem; border-radius:1rem; overflow:hidden; text-align:center; }
.join-zhengce-list li img{ display:block; max-width:100%;}
.join-zhengce-list li h2{ font-size:1.4rem; font-weight:bold; color:#fff; margin-top:1.5rem;}
.join-zhengce-list li p{ padding:1rem; line-height:1.8; font-size:1rem; text-align:left; color:#fff;}
.join-zhengce-list li:last-child{ margin-right:0;}
.join-zhengce .indextitle h2{ color:#fff;}




/************/
.join-hezuo{ background:#fff; padding:3% 1.5%;overflow:hidden;}
.join-hezuo-list{ margin:3% auto;display: flex; flex-wrap: wrap; justify-content: space-around; list-style: none; padding-inline-start: 0;}
.join-hezuo-list li{ width:47%; background:#fafafa; border-radius:1rem; overflow:hidden; margin:1.5%; position:relative;}
.join-hezuo-list li img{ display:block; width:5.46rem;}
.join-hezuo-list li h2{ display:none;}
.join-hezuo-list li p{ font-size:1rem; padding-right:0.7rem; position:absolute; top:50%; left:6rem; line-height:1.4;  -webkit-transform: translate(0,-50%);transform: translate(0,-50%);}
.join-hezuo-list li:nth-child(4n){ margin-right:0;}
.join-hezuo-list li span{ display:none;}

/************/
.join-contact{ padding:3%; background:#f7f7f7;}
.join-contact .join-contact-left{ width:100%; line-height:2; float:none;}
.join-contact .join-contact-left h2{ font-size:1.2rem; font-weight:bold; color:#000;}
.join-contact .join-contact-left p{ font-size:1rem; color:#999; border-bottom:1px solid #ddd; margin-bottom:1rem; padding-bottom:1rem;}
.join-contact .join-contact-left h3{ font-size:1.2rem;}
.join-contact .join-contact-right{ width:100%; float:none;}
.join-contact .join-contact-right li{margin-bottom:1rem;}
.join-contact .join-contact-right li input{ width:100%; height:3rem; box-sizing:border-box; line-height:3rem; border:1px solid #ddd; font-size:0.8rem; padding:0.5rem 0.7rem;}
.join-contact .join-contact-right li .layui-anim-upbit{ font-size:0.8rem;}
.join-contact .join-contact-right li .layui-form-item{ display:flex;}
.join-contact .join-contact-right li .layui-form-item .layui-inline{ flex:1; margin:0 0.5rem 0 0; }
.join-contact .join-contact-right li .layui-form-item .layui-inline:last-child{ margin-right:0;}
.join-contact .join-contact-right li .tijiao{ background:#293042; color:#fff; width:100%; padding:1rem; height:auto; border:0; border-radius:0.2rem; font-size:0.8rem;}

}