.main_box{ clear:both;width:100%; margin:0 auto;}




/*联系我们*/
.sale_box_bg{ background: url(../images/gc_contact_tit.jpg) no-repeat; width:100%; height:171px; margin-top:-5px;}
.sale_box_bg h2{ color:#fff; text-align:center; font-size:30px; padding-top:45px ; font-weight:normal;line-height:35px;}
.sale_box_bg h3{color:#fff; text-align:center; font-size:18px; line-height:35px; margin-top:10px;font-weight:normal; padding-bottom:10px;}


.sale_box_pro{ background: url(../images/sale_mm.jpg) no-repeat  center top #fff; width:100%; height:950px;	background-size: cover; margin-top:-50px; z-index:-1; position:relative; }








.sale_box{  clear:both; width:100%; margin:0 auto; margin-top:0px; position:relative; z-index:99; max-width:1200px; }



#main {
 position: absolute;
  top: 0;
  left:0;
  width: 100%;
  height: 100%;
  z-index: 1000;

}
#sub1 {
  display: block;
  position: relative;
  left: 50%;
  top: 50%;
  width: 100px;
  height: 100px;
  margin: -80px 0 0 -50px;
  border-radius: 50%;
  border: 5px solid transparent;
  border-top-color: #F0642F;
  border-right-color: #F0642F;
  animation:dongHua 2s linear infinite;
}
#sub1::after {
  content: '';
  width: 85%;
  height: 85%;
  background: linear-gradient(45deg,rgba(255,255,1) 0%,1) 40%,0.7) 60%,0) 100%);
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(-5%,-5%);
}

#sub2 {
  display: block;
  position: relative;
  left: 50%;
  top: 50%;
  width: 100px;
  height: 100px;
  margin: -80px 0 0 -50px;
  border-radius: 50%;
  border: 5px solid transparent;
  border-top-color: #0AABD9;
  border-right-color: #0AABD9;
  animation:dongHua 2s linear infinite;
}
#sub2::after {
  content: '';
  width: 85%;
  height: 85%;
  background: linear-gradient(45deg,rgba(255,255,1) 0%,1) 40%,0.7) 60%,0) 100%);
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(-5%,-5%);
}


#sub3 {
  display: block;
  position: relative;
  left: 50%;
  top: 50%;
  width: 100px;
  height: 100px;
  margin: -80px 0 0 -50px;
  border-radius: 50%;
  border: 5px solid transparent;
  border-top-color: #069641;
  border-right-color: #069641;
  animation:dongHua 2s linear infinite;
}
#sub3::after {
  content: '';
  width: 85%;
  height: 85%;
  background: linear-gradient(45deg,rgba(255,255,1) 0%,1) 40%,0.7) 60%,0) 100%);
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(-5%,-5%);
}



@keyframes dongHua {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}




/*办事处*/
.fl { float: left;}
.fr {float: right;}
.bg_pic{ position:relative; width:100%; background:url(../images/map_chanpye.png) no-repeat center top; height:781px; clear:both; padding-top:50px;}
.fanwen{ width:1000px; position:relative; margin:0 auto;}
.bottom_r {  width: 100%; clear:both; z-index:9999;}



.hunan { position: absolute; top: 400px; right: 400px  }
.hunan i { display: block; width: 40px; height: 40px; background: url(../images/icons.png) no-repeat 0 0;animation:gogogo 2s;
-moz-animation:gogogo 2s  infinite linear; /* Firefox */
-webkit-animation:gogogo 2s  infinite linear; /* Safari and Chrome */
-o-animation:gogogo 2s  infinite linear; /* Opera */}



.yuenan { position: absolute; top: 500px; right:450px  }
.yuenan i { display: block; width: 40px; height: 40px; background: url(../images/icons.png) no-repeat 0 0;animation:gogogo 2s;
-moz-animation:gogogo 2s  infinite linear; /* Firefox */
-webkit-animation:gogogo 2s  infinite linear; /* Safari and Chrome */
-o-animation:gogogo 2s  infinite linear; /* Opera */}



.gz { position: absolute; top: 480px; right: 300px  }
.gz i { display: block; width: 40px; height: 40px; background: url(../images/icons.png) no-repeat 0 0;animation:gogogo 2s;
-moz-animation:gogogo 2s  infinite linear; /* Firefox */
-webkit-animation:gogogo 2s  infinite linear; /* Safari and Chrome */
-o-animation:gogogo 2s  infinite linear; /* Opera */}
.clearfix {*zoom: 1;}

.gz i:hover { background-position-y: 0; }
.gz:hover { z-index: 1; }
.shenzhen { position: absolute;  top: 460px; right: 320px }
.bottom_r .shenzhen i{ display: block;width: 40px; height: 40px;  background: url(../images/icons.png) no-repeat 0 0; animation:gogogo 2s;
-moz-animation:gogogo 2s  infinite linear; /* Firefox */
-webkit-animation:gogogo 2s  infinite linear; /* Safari and Chrome */
-o-animation:gogogo 2s  infinite linear; /* Opera */}
.bottom_r .shenzhen i:hover{ background-position-y: 0; }
.bottom_r .shenzhen:hover{ z-index: 1; }

.bottom_r .address .address_con p img{ display: inline-block; margin-bottom:10px;}
.bottom_r .address { position: absolute; border-radius: 5px; border: 1px solid #C20A14; width: 400px; right: -30px; top: -120px; visibility: hidden; }
.bottom_r .address .address_con { height: 220px; width: 318px; background: #fff; box-sizing: border-box; padding-top: 10px; text-align:left;  padding-left: 10px; padding-right: 10px; }
.bottom_r .address .address_con h5 { margin-bottom: 5px; line-height: 1; font-size: 15px; line-height:40px; color: #595757; font-weight: bold;  }
.bottom_r .address .address_con p { line-height: 25px; float:left; letter-spacing:normal; }
.bottom_r .address .address_title { height: 220px; width: 80px; background:#C20A14; font-size: 26px; color: #fff; line-height: 50px; padding-top:60px; text-align: center; }
.bottom_r .address .address_title a{ font-size:30px; color:#fff;}
.bottom_r .gz .address { right:-30px; top:-120px;}

@keyframes zoomInRightMap { 0% { opacity: 0; transform: translateX(-30px); }
100% { opacity: 1; transform: translateX(0px); } }
.zoomInRightMap { animation: zoomInRightMap 1s; visibility: visible !important; }

@keyframes gogogo {
0% {
 margin-top:0px;
}
50% {
 margin-top:10px;
}
100% {
 margin-top:0px;
}
}
 @-webkit-keyframes gogogo {
0% {
 margin-top:0px;
}
50% {
 margin-top:10px;
}
100% {
 margin-top:0px;
}
}
 @-o-keyframes myfirst {
0% {
 margin-top:0px;
}
50% {
 margin-top:10px;
}
100% {
 margin-top:0px;
}
}






.bantu_box{ width:100%;  height:711px;}
.bantu_box h4{ text-transform:uppercase; font-size:36px; line-height:45px; color:#F2692D; font-family:"Times New Roman", Times, serif; position:absolute; left:0px; top:10%;}
.bantu_box h3{  font-size:20px; color:#333;position:absolute; left:0px; top:26%;}

.bantu_box_left{ position:absolute; left:0; top:45%; width:200px;}
.bantu_box_left ul li{ width:80%; font-size:16px; color:#333; padding:0 10%; line-height:46px; margin:5px 0;}
.bantu_box_left ul li.active{ border:1px solid #F2692D; border-radius:10px; position:relative; background:#fff;}
.bantu_box_left ul li.active:after{ position:absolute; content:""; width:15px; height:15px; right:10px; top:18px; background:url(../images/ditu_jiantou.png) no-repeat;}



.bantu_box_right{ display:none; position:absolute; right:4%; top:45%; width:300px; background:rgba(255,255,255,.1); height:300px;overflow-y:auto; border:1px solid #05af76; border-radius:10px; padding:20px 0; z-index:6;}
.bantu_box_right ul li{ width:90%; font-size:15px; color:#333; padding:0 5%; line-height:35px;}
.bantu_box_right ul li.active{ color:#00ffa5;}


.bantu_box_show{ width:300px; height:200px; background: rgba(255,255,255,.7);border-radius:10px; position:relative;}
.bantu_box_show h2{ font-size:16px; text-align:left; line-height:40px; color:#000; font-weight:700; padding-left:20px;}
.bantu_box_show p{ font-size:15px;}
.bantu_box_show img{ max-width:100%; margin:0 auto;}
.bantu_box_show .bantu_more{ position:absolute; font-size:24px;right:15px; top:0;}
.bantu_box_show .bantu_more a{ color:#12e89d; }

.weizhi{ position:absolute; z-index:6; display:none;}

.m_bantu_box{ display:none;}

@media screen and (max-width:1023px){
.bantu_box h4{  font-size:30px; line-height:40px; color:#00a2d6;  position:absolute; left:0px; top:2%;}
.bantu_box h3{  font-size:18px; color:#333;position:absolute; left:0px; top:17%;}
.bantu_box_left{  left:25%; top:5%; width:75%;}
.bantu_box_left ul li{ width:15.8%; float:left; font-size:15px; color:#333; padding:0 1%; line-height:40px; margin:0 1%;}'
.bantu_box_left ul li.active:after{ top:12px;}

.bantu_box_right{right:1%; top:45%;}

}

@media screen and (max-width:860px){
.bantu_box{ display:none;}

.m_bantu_box{ display:block; background:url(../images/bantu_bg.jpg) no-repeat center top; height: auto!important;background-size:cover;}
.m_ditu_pic{ width:100%;text-align:center; position:relative; z-index:2;}
.m_ditu_pic img{ max-width:100%; margin:30px auto; } 


}


/*.ditu_weizhi{position:absolute; left: auto; text-align:center; width:100%; margin-top:5%;}
*/
.ditu_weizhi{ position:relative; width:100%; max-width:838px; text-align:center; margin:0 auto; height:100%;}
.ditu_weizhi img{ position:absolute; top:10%;left:0px; } 





.case_map{ float:none;width:100%; height:850px;}



@media screen and (max-width:1270px){
.case_map{height: auto;}
.sale_box_pro{height: auto;	background-size: cover; margin-top:-50px; z-index:-1; position:relative; }

}



/*底部圆圈发光*/
 .map-imgwrapper {
	display:inline-block;
    *display:inline;
    *zoom:1;
	position:relative;
	vertical-align:top
}
 .map-imgwrapper img{ max-width:1266px;}
 
 

 
 
 .map-imgwrapper .point-area {
	position:absolute;
	width:150px;
	height:150px;
	visibility:visible;
	opacity:1
}
 .map-imgwrapper .point-area .dot10,  .map-imgwrapper .point-area .dot20,  .map-imgwrapper .point-area .dot40 {
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	right:0;
	bottom:0;
	left:0;
	border-radius:50%
}

 .map-imgwrapper .point3 {
	top:240px;
	left:175px
}
 .map-imgwrapper .point3 .dot10:after {
	animation:ripple 4s ease-out 2.7s infinite
}
 .map-imgwrapper .point3 .dot10:after,  .map-imgwrapper .point3 .dot20:after {
	content:"";
	display:block;
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	border-radius:50%;
	border:2px solid #fff;
	opacity:0
}
 .map-imgwrapper .point3 .dot20:after {
	animation:ripple 2s ease-out 3.6s infinite
}
 .map-imgwrapper .point3 .dot40:after {
	content:"";
	display:block;
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	border-radius:50%;
	border:2px solid #fff;
	opacity:0;
	animation:ripple 2s ease-out 1.5s infinite
}




.map-imgwrapper .point2 {
	top:185px;
	left:665px
}
 .map-imgwrapper .point2 .dot10:after {
	animation:ripple 4s ease-out 2.7s infinite
}
 .map-imgwrapper .point2 .dot10:after,  .map-imgwrapper .point3 .dot20:after {
	content:"";
	display:block;
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	border-radius:50%;
	border:2px solid #fff;
	opacity:0
}
 .map-imgwrapper .point2 .dot20:after {
	animation:ripple 2s ease-out 3.6s infinite
}
 .map-imgwrapper .point2 .dot40:after {
	content:"";
	display:block;
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	border-radius:50%;
	border:2px solid #fff;
	opacity:0;
	animation:ripple 2s ease-out 1.5s infinite
}



.map-imgwrapper .point1 {
	top:275px;
	right:235px
}
 .map-imgwrapper .point1 .dot10:after {
	animation:ripple 4s ease-out 2.7s infinite
}
 .map-imgwrapper .point1 .dot10:after,  .map-imgwrapper .point3 .dot20:after {
	content:"";
	display:block;
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	border-radius:50%;
	border:2px solid #fff;
	opacity:0
}
 .map-imgwrapper .point1 .dot20:after {
	animation:ripple 2s ease-out 3.6s infinite
}
 .map-imgwrapper .point1 .dot40:after {
	content:"";
	display:block;
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	border-radius:50%;
	border:2px solid #fff;
	opacity:0;
	animation:ripple 2s ease-out 1.5s infinite
}





 .map-imgwrapper .point0 .dot10:after {
	animation:ripple 4s ease-out 2.7s infinite
}
 .map-imgwrapper .point0 .dot10:after,  .map-imgwrapper .point0 .dot20:after {
	content:"";
	display:block;
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	border-radius:50%;
	border:2px solid #fff;
	opacity:0
}
 .map-imgwrapper .point0 .dot20:after {
	animation:ripple 2s ease-out 3.6s infinite
}
 .map-imgwrapper .point0 .dot40:after {
	content:"";
	display:block;
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	border-radius:50%;
	border:2px solid #fff;
	opacity:0;
	animation:ripple 2s ease-out 1.5s infinite
}


 @media screen and (max-width:1270px){
 

 
 
 .map-imgwrapper img{ max-width:1100px;}
 .map-imgwrapper .point3 {
	top:200px;
	left:145px
}

.map-imgwrapper .point2 {
	top:150px;
	left:570px
}

.map-imgwrapper .point1 {
	top:225px;
	right:195px
}

#sub {
  width: 80px;
  height: 80px;
  margin: -65px 0 0 -40px;

}


}

 @media screen and (max-width:1100px){
 .map-imgwrapper img{ max-width:1025px;}
 .map-imgwrapper .point3 {
	top:180px;
	left:130px
}

.map-imgwrapper .point2 {
	top:135px;
	left:525px
}

.map-imgwrapper .point1 {
	top:210px;
	right:175px
}

}

 




 .map-img {
	width:100%;
}


@keyframes ripple {
0% {
opacity:0;
transform:scale(.1)
}
5% {
opacity:1
}
to {
	opacity:0;
	transform:scale(1)
}

/*animate*/

@keyframes rightOpacityShow{
0%{ transform: translateX(-80px);opacity:0;}
80%{ transform: translateX(20px);}
100%{ transform:translateX(0); opacity:1;}
}
@-moz-keyframes rotateYOpacityAn{
0%{ -moz-transform: translateX(-80px);opacity:0;}
80%{ -moz-transform: translateX(20px);}
100%{ -moz-transform:translateX(0); opacity:1;}
}
@-webkit-keyframes rotateYOpacityAn {
0%{ -webkit-transform: translateX(-80px);opacity:0;}
80%{ -webkit-transform: translateX(20px);}
100%{ -webkit-transform:translateX(0); opacity:1;}
}
@-o-keyframes rotateYOpacityAn{
0%{ -o-transform: translateX(-80px);opacity:0;}
80%{ -o-transform: translateX(20px);}
100%{ -o-transform:translateX(0); opacity:1;}
}