@charset "utf-8";
.top-banner{position:relative;width:100%;background:#282923;z-index:1}
.top-banner img{width:100%;}
.main-content{position:relative;padding-top:100px;}

.contact-box .contact-title h1,.join-box .join-title h2,.contact-info li i{background: url(../images/contact_bg.png) 0 0 no-repeat;}

.contact-box{margin-bottom:50px;}
.contact-box .contact-title{height:60px;margin-bottom:100px;}
.contact-box .contact-title h1{height:60px;line-height: 600px;overflow: hidden;background-position:center 0;}
.contact-info{float:left;width:620px;position: relative;}
.contact-info li{position:relative;height:40px;line-height:40px;margin-bottom:10px;padding-left:50px;font-size:16px;color:#666;overflow:hidden;}
.contact-info li i{position: absolute;display:block;height:40px;width:40px;top:0;left:0;}
.contact-info li.c-add i{background-position: 0 -120px;}
.contact-info li.c-email i{background-position: 0 -160px;}
.contact-info li.c-mobile i{background-position: 0 -200px;}
.contact-info li.c-phone i{background-position: 0 -240px;}
.contact-info li.c-fax i{background-position: 0 -280px;}
.contact-info li.c-qq i{background-position: 0 -320px;}
.contact-info li.c-qq a{font-size: 16px;    color: #a73d46;  font-weight: 600;}
.contact-info .qrcode{position: absolute;right:20px;bottom:0;}
.contact-map{float:right;width:620px;height:290px;position: relative;background:#EEE;}

.join-section{background: url(../images/bg_contact_join.jpg) center bottom no-repeat;}
.join-box{padding:80px 0;}
.join-box .join-title{height:60px;margin-bottom:100px;}
.join-box .join-title h2{height:60px;line-height: 600px;overflow: hidden;background-position:center -60px;}
.join-box p{height:50px;font-size:20px;text-align: center;color:#333;}
.join-now{height:80px;line-height:80px;padding:50px 0;text-align:center;background: rgba(196,39,51,.7);}
.join-now a{display:inline-block;border:1px solid #333;height:78px;line-height:78px;color:#FFF;font-size:20px;padding:0 30px;border-radius: 10px;-webkit-transition:all .2s ease-in-out;;-moz-transition:all .2s ease-in-out;;-o-transition:all .2s ease-in-out;;transition:all .2s ease-in-out;}
.join-now a:hover{border-color:#FFF;color:#333;}
.c-qq span{display: none}

@media screen and (max-width:1280px){
	.contact-info{float:none;width:auto;margin:0 30px 50px;}
	.contact-map{float:none;width:auto;margin:0;height:350px;}
	.top-banner {
		margin-top: 50px;
	}
}
@media screen and (max-width:780px){
	.c-qq span{display: initial}
	.c-qq a{
		display: none;
	}
}
@media screen and (max-width:660px){
	.contact-info li{height:auto;}
	.qrcode img{width: 100px;height: 110px;}
	.contact-box .contact-title {
		margin-bottom: 30px;
	}
	.main-content {
		padding-top: 30px;
	}
	.join-box .join-title {
		margin-bottom: 30px;
	}
	.join-box {
		padding: 30px 0;
	}
}
@media screen and (max-width:375px){
	.contact-info li{height:auto;width: 273px;}
	.qrcode img{width: 100px;height: 110px;position: relative;  left: 40px;  }
}
@media screen and (max-width:320px){
	.contact-info li{height:auto;width: 228px}
	.qrcode img{    width: 70px;
		height: 80px;
		position: relative;
		left: 49px;}
}