* { margin: 0; padding: 0;}
.clear{clear: both;}
#bannerresearch {
    width: 100%;
    height: 100%;
    background:rgba(64,64,64,1);
    position:absolute; left:0; top:0
    border-top: 1px solid #e6e6e6;
	z-index:0
}
.og-grid {
	list-style: none;
	margin: 0 auto;
	width: 100%;
	padding-top:0 !important;
	text-align:center;
}

.og-grid li {
text-align:left;
	display: inline-block;
	margin:10px 10px;
	vertical-align: top;
    width: 23% !important;
	float:none !important;
	position:relative;
	transition:left 1s,right 1s;
	
}
.dnone{display:none;}
.k1{ right:1900px; }
.k2{ right:1300px;}
.k3{ left:1300px;}
.k4{ left:1900px;}
.k5{ right:1900px; }
.k6{ right:1300px;}
.k7{ left:1300px;}
.k8{ left:1900px;}
.page4.active .k1{right:0;transition-delay:0.3s}
.page4.active .k2{right:0}
.page4.active .k3{left:0}
.page4.active .k4{left:0;transition-delay:0.3s}

.page4.active .k5{right:0;transition-delay:0.3s}
.page4.active .k6{right:0}
.page4.active .k7{left:0}
.page4.active .k8{left:0;transition-delay:0.3s}

.og-grid li  a{
	border: none;
	outline: none;
	display: block;
	position: relative;
    width: 100%;

	
}
.og-grid li  a img {
	border: none;
	outline: none;
	display: block;
	position: relative;
    width: 100%;   
	 transition: transform 1s;	
}
.og-grid li a:hover{
	border: none;
	outline: none;
	display: block;
	position: relative;
    width: 100%;
   

}

.og-grid li a:hover img {
	border: none;
	outline: none;
	display: block;
	position: relative;
    width: 100%;
  
	-webkit-transform:scale(1.2,1.2); transform:scale(1.2,1.2);
	transition-delay: 0s;
}

.gridpic { width: 100%; position:relative;overflow:hidden;}
.gridtit { padding-left:40px; text-align:left; line-height:40px;}

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





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



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

figure.effect-bubba figcaption::before {
	-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 h3 {
	position:absolute;
	top:0px;
	left:0px;
	padding-top: 40%;
	padding-left:40px;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0,40px,0);
	transform: translate3d(0,40px,0);
	color:#fff;
	z-index:1;
	font-weight:inherit;
	font-family:Arial, Helvetica, sans-serif;
/*	text-shadow: -1px -1px 1px #999,2px 2px 2px #333,2px 2px 2px #333;*/
text-shadow:black 0 3px 3px;
}
figure.effect-bubba:hover h3 {

	text-shadow: none;
}

figure.effect-bubba p {
	position:absolute;
	top:12%;
	left:0px;
	padding: 10px 40px;
	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,30px,0);
	transform: translate3d(0,30px,0);
	color:#fff;
	z-index:1;
	text-align:left;
	font-weight:100
}

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 2000px rgba(130,130,130,0.5);
}

figure.effect-bubba:hover h3,
figure.effect-bubba:hover p {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	text-align:left;
	
}
.service1{position:relative;overflow:hidden;height:465px;}
.service1 .text{position:absolute;left:60%;top:50px;width:40%;opacity:0;transform:translateX(100px);-webkit-transform:translateX(100px);transition:all 1s ease-out 0s;-webkit-transition:all 1s ease-out 0s;}
.service1.show .text{transform:translateX(0);-webkit-transform:translateX(0);opacity:1;}
.service1 .pic{position:absolute;left:0%;top:50%;opacity:0;max-width:55%;transform:translate(-100px,-50%);-webkit-transform:translate(-100px,-50%);transition:all 1s ease-out 0s;-webkit-transition:all 1s ease-out 0s;}
.service1.show .pic{transform:translate(0,-50%);-webkit-transform:translate(0,-50%);opacity:1;}
.webset .text:before{content:"";height:4px;width:90px;background:#1965cf;display: block;}
.webset .text h1{font-size:30px;color: #474747;margin-top:20px;}
.webset .text h2{font-size:20px;color: #474747;font-family:Arial;margin-top:10px;margin-bottom:30px;}
.webset .text h3{font-size:18px;color: #474747;margin-top:15px;}
.webset .text p{font-size:18px;color: #474747;margin-top:10px;}
.webset .text .list{margin-bottom:10px;display: flex;justify-content: space-between;flex-wrap: wrap}
.webset .text .list h3{width:300px;display: block;margin:0 0 15px 0;width: 50%;font-size: 16px;color: #666;font-weight: normal}
.webset .text .link{color: #474747;margin-top:35px;}
.webset .text .link a{margin:0 15px;cursor: pointer;color: #1965cf;}
.webset .text .link a:hover{color:#005E76;;}
.webset .text .link a:first-child{margin-left:0;}
.btn_zx{width: 180px;height: 58px;line-height: 58px;display: inline-block;overflow: hidden;text-align: center;background-color: #ff8a00;color: #fff;font-size: 16px;margin-top: 20px;}
@media screen and (max-width:1200px){
    .og-grid li{width: 33% !important;margin: 0px 0 10px 0}
    figure.effect-bubba h3{position: relative;padding: 0;font-size: 16px;color: #333;transform: translate(0,0);text-shadow: none;line-height: 40px;display: block;text-align: center;height: 40px;overflow: hidden}
    figure.effect-bubba p{position: relative;display: none;}
    figure.effect-bubba figcaption::before, figure.effect-bubba figcaption::after{display: none}
    figure.effect-bubba h3{font-size: 14px}
	.webset .text h2{margin-bottom: 10px}
}
@media screen and (max-width:836px){
    .og-grid li{width: 49% !important;}
}