/******************* xiaofeng **************/










/* page3  */
.section .bgbg { position: absolute; left: 0; top: 0; width: 110%; height: 110%;}
.section .bgbg img { display: block; width: 110%; height: 110%;}
.bg31 { position: absolute; top: -454px; width: 100%; height: 200px; transition: all 1s; text-align:center;}
.active .bg31 { top:80px; transition-delay: 0.3s;}
.bg31 img { width:704px; height:130px;}

.alleft {width:50px; height:50px;   border-radius: 50%; border:1px solid #999999; background:url(../images/lft1.png) no-repeat center; margin:0 5px;}
.alleft:hover {width:50px; height:50px;   border-radius: 50%; border:1px solid #999999; background:url(../images/lft1.png) no-repeat center #fff; margin:0 5px;}
.alright {width:50px; height:50px;   border-radius: 50%; border:1px solid #999999; background:url(../images/lft2.png) no-repeat center; margin:0 5px;}
.alright:hover {width:50px; height:50px;   border-radius: 50%; border:1px solid #999999; background:url(../images/lft2.png) no-repeat center #fff; margin:0 5px;}
.almore { position:relative;}
.almore a{ display:block; width:50px; height:50px;   border-radius: 50%; border:1px solid #999999;  background:url(../images/lft3.png) no-repeat center; position: absolute; left:50%; margin-left:70px; top:-60px; }
.almore a:hover{ display:block; width:50px; height:50px;   border-radius: 50%; border:1px solid #999999;  background:url(../images/lft3.png) no-repeat center #fff; position: absolute; left:50%; margin-left:70px; top:-60px; }


.casesbt { position:absolute; left:4%; width:345px; height:51px;  top:115px; background:url(../images/cases.png) no-repeat; background-size:80% 80%;}
.biaoqian { font-size:16px;  right:4%; margin-right:60px; line-height:50px; text-align:right;   position: absolute; z-index:9; }


/* 鍦嗙悆 */
.fenlei {position: absolute; display:block; width:350px; height:350px; background:rgba(0, 0, 0, .2); -moz-border-radius:50%;	-webkit-border-radius:50%;	border-radius:50%;	left:50%;	bottom:-400px; -moz-transition:.4s;-o-transition:.4s;-webkit-transition:.4s;transition:.4s;	border:none;	margin-left:-400px; transition: all 1s;}
.active .fenlei {bottom:20px; transition-delay: 0.3s;}
.fenlei.anim {width:260px;	height:260px;	left:50%;	bottom:20px;	margin-left:-355px;	margin-bottom:45px;-moz-transition:.4s;-o-transition:.4s;-webkit-transition:.4s;transition:.4s;}
.fenlei a{  width:260px; height:260px; position:absolute; left:0px; top:0px;  text-align:center; background-color:#23ac38; -moz-border-radius:50%;	-webkit-border-radius:50%;	border-radius:50%;left:50%; margin-left:-130px; top:50%; margin-top:-130px; }


.fenlei1 {	position: absolute;	display:block;	width:350px;	height:350px;	background:rgba(0, 0, 0, .2);	-moz-border-radius:50%;	-webkit-border-radius:50%;	border-radius:50%;	left:50%;	bottom:-400px;	-moz-transition:.4s;	-o-transition:.4s;	-webkit-transition:.4s;	transition:.4s;	border:none;	margin-left:50px; transition: all 1s;}
.active .fenlei1 {bottom:20px; transition-delay: 0.3s;}
.fenlei1.anim {	width:260px;	height:260px;	left:50%;	bottom:20px;	margin-left:95px;	margin-bottom:45px;	-moz-transition:.4s;	-o-transition:.4s;	-webkit-transition:.4s;	transition:.4s;}
.fenlei1 a{  width:260px; height:260px; position:absolute; left:0px; top:0px;  text-align:center; background-color:#23ac38; -moz-border-radius:50%;	-webkit-border-radius:50%;	border-radius:50%; left:50%; margin-left:-130px; top:50%; margin-top:-130px; }

.owl-demo .tishi{ display:none;}
.owl-demo:hover .tishi{ display:block; text-align:center; width:100%;}

.fenlei a,.fenlei1 a { cursor:pointer;}
.fenlei1 a p{
display:block;
font-size:40px;
 color:#FFFFFF;
padding-top:70px;
padding-bottom:30px;
}

.fenlei1:hover a p,.fenlei1:hover a span{
			-webkit-animation-name: shake-base;
			animation-name: shake-base;
            -webkit-animation-duration: 0.75s;
			animation-duration: 0.75s;
            -webkit-animation-timing-function: linear;
			animation-timing-function: linear;
            -webkit-animation-iteration-count: 1;
			animation-iteration-count: 1;
}
.fenlei a p{
display:block;
font-size:40px;
color:#FFFFFF;
padding-top:70px;
padding-bottom:30px;
}

.fenlei:hover a p,.fenlei:hover a span{
			-webkit-animation-name: shake-base;
			animation-name: shake-base;
            -webkit-animation-duration: 0.75s;
			animation-duration: 0.75s;
            -webkit-animation-timing-function: linear;
			animation-timing-function: linear;
            -webkit-animation-iteration-count: 1;
			animation-iteration-count: 1;
}

.x {  position:absolute; z-index:5; top:80px; right:4%; background:url(../images/x.png) no-repeat; width:44px; height:44px;}
.gd{  position:absolute; z-index:5; top:80px; right:4%; margin-right:50px;  background:url(../images/gd.png) no-repeat; width:44px; height:44px;}
.gw{ position:absolute; z-index:5; top:80px; right:4%; margin-right:100px;  background:url(../images/gw.png) no-repeat; width:44px; height:44px;}
.pt{ position:absolute; z-index:5; top:80px; right:4%; margin-right:100px;  background:url(../images/pt.png) no-repeat; width:44px; height:44px;}
.x:hover { background:url(../images/xb.png) no-repeat; width:44px; height:44px;}
.gd:hover{ background:url(../images/gdb.png) no-repeat; width:44px; height:44px;}
.gw:hover{ background:url(../images/gwb.png) no-repeat; width:44px; height:44px;}
.pt:hover{ background:url(../images/ptb.png) no-repeat; width:44px; height:44px;}
.gd a,.gw a,.pt a{ width:44px; height:44px; display: block;}


.fadeInUp { position:absolute; top:300px; width:100%; opacity:0; transition: all 1.5s;}
.active .fadeInUp {top:120px; opacity: 1; transition-delay: 0.7s;}

.og-grid {
	list-style: none;
	margin: 0 auto;
	text-align: center;
	width: 100%;
}






.og-grid li {
	display: inline-block;
	margin:8px;
	vertical-align: top;
	height: 232px;
    width: 350px;
	
}

.og-grid li  a{
	border: none;
	outline: none;
	display: block;
	position: relative;
    width: 100%;
	 transition: all 0.5s;
	
}
.og-grid li  a img {
	border: none;
	outline: none;
	display: block;
	position: relative;
    width: 350px;
    height: 212px;
	transition: all 0.5s;
	
}
.og-grid li a:hover{
	border: none;
	outline: none;
	display: block;
	position: relative;
    width: 100%;
    height: 212px;

}

.og-grid li a:hover img {
	border: none;
	outline: none;
	display: block;
	position: relative;
    width: 350px;
    height: 212px;
	-webkit-transform:scale(1.1, 1.1); transform:scale(1.1,1.1);
	transition-delay: 0s;
}

.gridpic {height: 212px; width: 350px; position:relative;overflow:hidden;}


.gridtit { padding-left:30px; text-align:left; line-height:40px;}

/*---------------*/
/***** Bubba *****/
/*---------------*/

figure.effect-bubba {
	background:#000;

}

figure.effect-bubba img {
	opacity: 1;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
}

figure.effect-bubba:hover img {
	opacity: 0.4;
}

figure.effect-bubba figcaption::before,
figure.effect-bubba figcaption::after {
	position: absolute;
	top: 20px;
	right: 20px;
	bottom: 20px;
	left: 20px;
	content: '';
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}

figure.effect-bubba figcaption::before {
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	-webkit-transform: scale(0,1);
	transform: scale(0,1);
}

figure.effect-bubba figcaption::after {
	border-right: 1px solid #fff;
	border-left: 1px solid #fff;
	-webkit-transform: scale(1,0);
	transform: scale(1,0);
}

figure.effect-bubba h2 {
	position:absolute;
	top:0px;
	left:0px;
	padding-top: 30%;
	padding-left:30px;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0,40px,0);
	transform: translate3d(0,40px,0);
	color:#FFFFFF;
	font-weight:inherit;
	font-family:inherit;
	text-shadow:black 0 3px 3px;
}
figure.effect-bubba:hover h2 {

	text-shadow:none;
}


figure.effect-bubba p {
	position:absolute;
	top:65%;
	left:0px;
	padding: 10px 30px;
	opacity: 0;
	font-size:14px;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(0,20px,0);
	transform: translate3d(0,20px,0);
	color:#FFFFFF;
	text-align:left;
	line-height:16px;
}

figure.effect-bubba:hover figcaption::before,
figure.effect-bubba:hover figcaption::after {
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1);
	box-shadow: 0 0 0 20px rgba(255,255,255,0.2);
}

figure.effect-bubba:hover h2,
figure.effect-bubba:hover p {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	
}

.ckgd { font-size:36px; width:50px; height:50px; float:right; text-align:center; line-height:50px; margin-right:4%; position:relative;  z-index:66; }
.ckgd a{ display:block;  font-size:36px; width:50px; height:50px;   border-radius: 50%; background:#393a3c; color:#FFFFFF;}
.ckgd a:hover{ display:block;  font-size:36px; width:50px; height:50px;   border-radius: 50%; background:#23ac38; color:#FFFFFF;}


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

.og-grid li {
	display: inline-block;
	width:320px;
	margin:10px;
	vertical-align: top;
	text-align:center;
	height: 213px;
    
}

.og-grid li a{
	border: none;
	outline: none;
	display: block;
	position: relative;
  	max-width: 320px;
    height: 193px;
	margin:0 auto;
	transition: all 0.5s;
}
.og-grid li a img {
	border: none;
	outline: none;
	display: block;
	position: relative;
  	max-width: 320px;
    height: 193px;
	margin:0 auto;
	transition: all 0.5s;
}
.og-grid li a:hover img {
	border: none;
	outline: none;
	display: block;
	position: relative;
    width: 100%;
    height: 193px;
	-webkit-transform:scale(1.1, 1.1); transform:scale(1.1,1.1);
	transition-delay: 0s;
}

.gridpic {height: 193px; width: 320px; position:relative;overflow:hidden;}

}

#owl-demo11 .owl-controls.clickable,#owl-demo11 .owl-controls { margin-top:0px;}


/* page3 end */