
@import "page.css";

#nbanner_contact{height:556px;position:relative;z-index:1;background:#333;}
#nbanner_contact .img{height:100%;background-size:cover;background-repeat:no-repeat;background-position:center;}
#nbanner_contact .text{position:absolute;left:50%;top:calc(50% - 140px);transform:translatex(-50%);}
#nbanner_contact .text .t{font-size:36px;line-height:50px;}
#nbanner_contact .text .tisp{font-size:16px;margin-top:5px;}
#nbanner_contact .text .tel{margin-top:15px;}
#nbanner_contact .text .tel i{border:1px solid #296AFF;color:#296AFF;width:30px;height:30px;text-align:center;line-height:30px;margin-right:10px;border-radius:50%;float:left;}
#nbanner_contact .text .tel span{;}
#nbanner_contact .text .tel span a{color:#296AFF;font-size:28px;font-family:"din";}
#nbanner_contact .text .other{font-size:16px;margin-top:20px;}
#nbanner_contact .text .qq{margin-top:10px;}
#nbanner_contact .text .qq a{display:inline-block;background:#000;color:#fff;padding:8px 28px;margin-right:10px;}
#nbanner_contact .text .qq i{margin-right:8px;}
#nbanner_contact .text .qq a:hover{background:#296AFF;}
#nbanner_contact .text .line{border-bottom:1px #878B99 dashed;height:9px;overflow:hidden;display:block;width:450px;margin-top:10px;}

#contact{width:100%;position:relative;z-index:66;}
#contact .add .item{width:29%;background:#f8f9fc;margin-top:88px; padding:70px 20px 70px 39px;border-right:1px solid #e8edf2;}
#contact .add .item:last-child{border-right:0;}
#contact .add .item h3{font-size:24px;}
#contact .add .item .info{margin-top:20px;}
#contact .add .item:hover{background:url(../images/bg_contact_add.jpg) no-repeat left top;background-size:cover;color:#fff;}
#contact .add .item.curr{background:url(../images/bg_contact_add.jpg) no-repeat left top;background-size:cover;color:#fff;}
#contact .add .item.curr p i{color:#fff;}
#contact .add .item p{line-height:28px;}
#contact .add .item p:nth-child(4){display:none;}
#contact .add .item p i{margin-right:5px;color:#878B99;text-align:left;}
#contact .add .item:hover p i{color:#fff;}
#contact .mapguest{margin-top:80px;background:url(../images/bg_mapguest.jpg);position:relative;}
#contact .mapguest .map{width:100%;padding:0px;height:500px;background:rgba(255,255,255,.95);}
#contact .mapguest .map img{width:100%;height:100%;object-fit:cover;}
#contact .mapguest .guest{width:40%;background:rgba(0,0,0,.8);height:500px;
	/* position:absolute; */
	right:0;top:0;float: right;}
#contact .mapguest .guest h3{background:#296AFF;font-size:24px;color:#fff;padding:20px 0;text-align:center;}
#contact .mapguest .guest .from{padding:30px 100px;}
#contact .mapguest .guest .from .item{margin:30px 0;}
#contact .mapguest .guest .from .item .text{width:100%;border:0;border-bottom:1px solid #666;background:none;line-height:40px;color:#fff;}
#contact .mapguest .guest .from .item .textarea{width:100%;border:0;border-bottom:1px solid #666;background:none;line-height:20px;height:80px;color:#fff;}
#contact .mapguest .guest .from .button{margin-top:20px;}
#contact .mapguest .guest .from .button .btn{margin:0 auto;width:180px;background:#296AFF;color:#fff;border:0;padding:15px 0;cursor:pointer;}
#contact .mapguest .guest .from .button .btn:hover{background:#296AFF;}
#contact .mapguest .guest .from .button .fr{color:#ccc;line-height:22px;}

@media (max-width:1200px){
	#contact .add .item{padding:70px 20px 70px 20px;}
	#contact .mapguest .guest .from{padding:30px 30px;}
}
@media (max-width:800px){
	
	
	#contact .add .item{float:inherit !important;width:100%;padding:30px 20px 30px 70px;border-right:0;border-bottom:1px solid #ddd;}
	#contact .mapguest .guest{width:100%;}
}