.h3_info span{ font-size: 22px;    padding-bottom: 25px; display: block;}
.spark_s6{height: 700px; overflow:hidden; position:relative}
.common_title{ color:#fff}
.mask_list{display: block; position: absolute; top: 0; left: 0;width: 100%; height: 100%; z-index: 9;}
.video_cover_list{display: block; position: absolute; top: 0; left: 0;width: 100%; height: 100%;  z-index: 8;}
.video_list{width: 100%; height: 100%;}
.spark_s6 .mask_list .mask_item{    height: 100%;width: 24.8%;float: left; position: relative; cursor: pointer; border-right:1px solid rgba(51,51,51,0)}
.spark_s6 .mask_list .mask_item .mask{    position: absolute;top: 0; left: 0;  width: 100%; height: 100%; background: rgba(0,0,0,0); z-index: 2;transition: all .5s ease-in-out;}
.spark_s6 .mask_list .mask_item .text, .spark_s6 .mask_list .mask_item .top_text{width: 100%; -webkit-transition: all .3s ease-in-out;   -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;
position: absolute; z-index: 3;}
.spark_s6 .mask_list .mask_item .top_text {bottom: 13%;text-transform: uppercase;left: 15%; -webkit-transition: all .3s ease-in-out;   -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
.top_text .title{ font-size:22px; color:#fff;}
.spark_s6 .mask_list .mask_item .text{    top: 50%;left: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%);
text-align: center; opacity: 1;}
.icon{    display: inline-block; vertical-align: baseline;}
.spark_s6 .mask_list .mask_item .text .icon {  margin-bottom: 20px;}
.svg_s1_icon1_dims{    width: 63px; height: 63px;}
.svg_s1_icon1{ background:red}
.common_title{    margin-bottom: 38px;}
.spark_s6 .mask_list .mask_item .bottom_text{text-align: left; color: #fff;position: absolute;  width:70%;  padding: 0 15%; display: none; z-index: 3;top: 5%;font-size: 18px;line-height: 30px;}
.spark_s6 .mask_list .mask_item .bottom_text .title { font-size:40px;}
.spark_s6 .mask_list .mask_item .bottom_text p { font-size:14px;}

.bann_infobox{ position:absolute; left:0; top:0; color:#fff; text-align:center; width:100%; height:100%; background:url(../images/s2_jg20.png) repeat;}
.font_box{ width:780px; margin:0 auto;padding-top:6%; opacity:0}
.font_box h2{ font-size:40px;}
.font_box p{ font-size:16px; padding-top:20px; line-height:28px }
.video_item.active .font_box{animation: wx_font 1.5s ease forwards;-webkit-animation: wx_font 1.5s ease forwards;  -ms-animation: wx_font 1.5s ease forwards;-moz-animation: wx_font 1.5s ease forwards;}


@keyframes wx_font{
  0%{  transform: translate(0,0); opacity:0; }
  100%{  transform: translate(0px,30px); opacity:1;}
  }
  
@-webkit-keyframes wx_font{
  0%{  transform: translate(0,0); opacity:0; }
  100%{  transform: translate(0px,30px); opacity:1;}
  }
  @-ms-keyframes wx_font{
  0%{  transform: translate(0,0); opacity:0; }
  100%{  transform: translate(0px,30px); opacity:1;}
  }
  @-moz-keyframes wx_font{
  0%{  transform: translate(0,0); opacity:0; }
  100%{  transform: translate(0px,30px); opacity:1;}
  }




.bottom_text .title{    font-size: 24px; margin-bottom: 20px;  color: #fff;  text-align: left;}

.spark_s6 .mask_list .mask_item.active .bottom_text{ animation:fadeInUp .5s ease; display:block}

.spark_s6 .mask_list:hover .mask_item .text{ opacity:0 }
.spark_s6 .mask_list:hover .top_text{ opacity:0.5 }

.spark_s6 .mask_list:hover .mask_item{ border-right:1px solid rgba(112,116,115,.7)}

.spark_s6 .mask_list:hover .mask_item .mask{background: rgba(0,0,0,.4); }

@keyframes fadeInUp{
	    0%{opacity:0;
		-webkit-transform:translate3d(0,100%,0);
		-moz-transform:translate3d(0,100%,0);
		-ms-transform:translate3d(0,100%,0);
		-o-transform:translate3d(0,100%,0);
		transform:translate3d(0,100%,0)}
        to{opacity:1;-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none}
}
@-moz-keyframes fadeInUp{
	0%{opacity:0;
	-webkit-transform:translate3d(0,100%,0);
	-moz-transform:translate3d(0,100%,0);
	-ms-transform:translate3d(0,100%,0);
	-o-transform:translate3d(0,100%,0);
	transform:translate3d(0,100%,0)}
	to{opacity:1;-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none}
}
@-webkit-keyframes fadeInUp{
	0%{opacity:0;
	-webkit-transform:translate3d(0,100%,0);
	-moz-transform:translate3d(0,100%,0);
	-ms-transform:translate3d(0,100%,0);
	-o-transform:translate3d(0,100%,0);
	transform:translate3d(0,100%,0)}
to{opacity:1;-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none}
}
@-o-keyframes fadeInUp{
	0%{opacity:0;
	-webkit-transform:translate3d(0,100%,0);
	-moz-transform:translate3d(0,100%,0);
	-ms-transform:translate3d(0,100%,0);
	-o-transform:translate3d(0,100%,0);
	transform:translate3d(0,100%,0)}
to{opacity:1;-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none}
}
.spark_s6 .video_cover_list .video_cover_item{width: 25%; height:100%; float: left; position: relative;}
.section_bg{width: 100%; height: 100%;  background-position: center center; background-repeat: no-repeat;   background-size: cover;}
.video_item{    width: 100%;  height: 100%; position: absolute; top: 0; left: 0;  opacity: 0;}
.video_bg{    position: relative; height: 100%;overflow: hidden;}
.spark_s6 .tit_box{ opacity:1; z-index:99}
.spark_s6:hover .san_det_cont { opacity:0}

.spark_s6  .san_det_cont h3{ color:#fff; padding-top:17%}
.spark_s6  .san_det_cont .h3_info{ color:#fff;    padding-top: 10px;}





.spark_s1{height:1320px; background:url(../images/s2_jg01.jpg) no-repeat center top; background-size:cover }
.spark_s2{height:1029px; background:url(../images/s2_jg02.jpg) no-repeat center top; background-size:cover }
.spark_s3{ background:#00a0e9;}
.spark_s4{ background:url(../images/s2_jg03.jpg) no-repeat center top; height:1040px; background-size: cover; }
.spark_s5{ background:url(../images/s2_jg04.jpg) no-repeat center top; height: 1040px; background-size: cover; }
.spark_s6{ height:924px;}
.spark_s7{ }

.spark_s1 .h3_info{ padding-top:8px}
.spark_s1 .san_det_cont h3{padding-top: 7%;}

.spark_s2  .tit_box{ width:449px; margin-left:4%;    padding-top: 19%;}
.spark_s2  .san_det_cont h3{ text-align:left}
.spark_s2  .h3_info{ text-align:left}


.spark_s4  .tit_box{ width:367px; margin-left:4%;    padding-top:12%;}
.spark_s4  .san_det_cont h3{ text-align:left}
.spark_s4  .h3_info{ text-align:left}

.spark_s5  .tit_box{ width:260px; margin-left:80%;    padding-top:20%;}
.spark_s5  .san_det_cont h3{ text-align:left; color:#fff;}
.spark_s5  .h3_info{ text-align:left; color:#fff;}

.spark_s5 .h3_info span,.spark_s4 .h3_info span{padding-bottom: 6px;padding-top: 6px; font-size:22px}
.spark_s5 .h3_info,.spark_s4 .h3_info{padding-top: 50px;}
.spark_s5 .h3_info p,.spark_s5 .h3_info span,.font_box h2,.font_box p{ color:#fff;}

.spark_s7  .san_det_cont h3{padding-top: 7%;}
.spark_s5 .h3_info p, .spark_s4 .h3_info p{line-height: 27px; padding-bottom:25px; font-size:12PX;}








.s2_item{ width:1350px; height: auto; overflow: hidden; margin:0 auto; padding:94px 0}
.s2_item ul li{ float:left; width:20%; background:url(../images/s2_jg19.gif) right 10px no-repeat; opacity:0; filter:alpha(opacity=0)}
.s2_item ul li:last-child{ background:none}
.s2_item ul li div{ padding:0 63px;}
.s2_item ul li span{ color:#fff; font-size:22px; margin-bottom:15px; display:block}
.s2_item ul li p{ color:#fff; font-size:12px; line-height:20px;text-align:justify; text-justify:inter-ideograph}


.spark7_itme{ width:1350px; height: auto; overflow: hidden; margin:0 auto;    padding: 90px 0; }
.spark7_itme ul { width:110%}
.spark7_itme ul li{ float:left; width:27.6%; margin-right:4%; text-align:center; margin-bottom:20px}
.spark7_itme ul li p{ font-size:20px; line-height:50px;}
.spark7_itme ul li span{ display:block}


.s2_item.active ul li.li01{    animation: s2_item 1s ease forwards;
    -webkit-animation: s2_item 1s ease forwards;
    -ms-animation: s2_item 1s ease forwards;
    -moz-animation: s2_item 1s ease forwards;}
@keyframes	s2_item{
  0%{ transform:translate(200px,0px);  opacity: 0;}
  
  100%{ transform:translate(0px,0px); opacity:1}
}

@-webkit-keyframes	s2_item{
  0%{ -webkit-transform:translate(200px,0px);  opacity: 0;}
  
  100%{ -webkit-transform:translate(0px,0px); opacity:1}
}

@-ms-keyframes	s2_item{
  0%{ -ms-transform:translate(200px,0px);  opacity: 0;}
  
  100%{ -ms-transform:translate(0px,0px); opacity:1}
}

@-moz-keyframes	s2_item{
  0%{ -moz-transform:translate(200px,0px);  opacity: 0;}
  
  100%{ -moz-transform:translate(0px,0px); opacity:1}
}	


.s2_item.active ul li.li02 { animation:s2_item02 1.5s ease forwards;
-webkit-animation:s2_item02 1.5s ease forwards;
-ms-animation:s2_item02 1.5s ease forwards;
-moz-animation:s2_item02 1.5s ease forwards; }
@keyframes	s2_item02{
  0%{ transform:translate(200px,0px); opacity: 0;}
  
  100%{ transform:translate(0px,0px); opacity:1}
}

@-webkit-keyframes	s2_item02{
  0%{ -webkit-transform:translate(200px,0px); opacity: 0;}
  
  100%{ -webkit-transform:translate(0px,0px); opacity:1}
}
@-ms-keyframes	s2_item02{
  0%{ -ms-transform:translate(200px,0px); opacity: 0;}
  
  100%{ -ms-transform:translate(0px,0px); opacity:1}
}
@-moz-keyframes	s2_item02{
  0%{ -moz-transform:translate(200px,0px); opacity: 0;}
  
  100%{ -moz-transform:translate(0px,0px); opacity:1}
}
	
	


.s2_item.active ul li.li03 { animation:s2_item03 2s ease forwards;
-webkit-animation:s2_item03 2s ease forwards;
-ms-animation:s2_item03 2s ease forwards;
-moz-animation:s2_item03 2s ease forwards; }

@keyframes	s2_item03{
  0%{ transform:translate(200px,0px); opacity: 0;}
  
  100%{ transform:translate(0px,0px); opacity:1}
}

@-webkit-keyframes	s2_item03{
  0%{ -webkit-transform:translate(200px,0px); opacity: 0;}
  
  100%{ -webkit-transform:translate(0px,0px); opacity:1}
}
@-ms-keyframes	s2_item03{
  0%{ -ms-transform:translate(200px,0px); opacity: 0;}
  
  100%{ -ms-transform:translate(0px,0px); opacity:1}
}
@-moz-keyframes	s2_item03{
  0%{ -moz-transform:translate(200px,0px); opacity: 0;}
  
  100%{ -moz-transform:translate(0px,0px); opacity:1}
}

	
	
	
.s2_item.active ul li.li04 { animation:s2_item04 2.5s ease forwards;
-webkit-animation:s2_item04  2.5s ease forwards;
-ms-animation:s2_item04  2.5s ease forwards;
-moz-animation:s2_item04  2.5s ease forwards; }


@keyframes	s2_item04{
  0%{ transform:translate(200px,0px); opacity: 0;}
  
  100%{ transform:translate(0px,0px); opacity:1}
}


@-webkit-keyframes	s2_item04{
  0%{ -webkit-transform:translate(200px,0px); opacity: 0;}
  
  100%{ -webkit-transform:translate(0px,0px); opacity:1}
}
@-ms-keyframes	s2_item04{
  0%{ -ms-transform:translate(200px,0px); opacity: 0;}
  
  100%{ -ms-transform:translate(0px,0px); opacity:1}
}
@-moz-keyframes	s2_item04{
  0%{ -moz-transform:translate(200px,0px); opacity: 0;}
  
  100%{ -moz-transform:translate(0px,0px); opacity:1}
}
	
	
	
	
.s2_item.active ul li.li05 { animation:s2_item05 3s ease forwards;
-webkit-animation:s2_item05  3s ease forwards;
-ms-animation:s2_item05  3s ease forwards;
-moz-animation:s2_item05  3s ease forwards; }


@keyframes	s2_item05{
  0%{ transform:translate(200px,0px); opacity: 0;}
  
  100%{ transform:translate(0px,0px); opacity:1}
}


@-webkit-keyframes	s2_item05{
  0%{ -webkit-transform:translate(200px,0px); opacity: 0;}
  
  100%{ -webkit-transform:translate(0px,0px); opacity:1}
}
@-ms-keyframes	s2_item05{
  0%{ -ms-transform:translate(200px,0px); opacity: 0;}
  
  100%{ -ms-transform:translate(0px,0px); opacity:1}
}
@-moz-keyframes	s2_item05{
  0%{ -moz-transform:translate(200px,0px); opacity: 0;}
  
  100%{ -moz-transform:translate(0px,0px); opacity:1}
}
.video_bg img{ height:100%;width:100%}
.spark_s6  .san_det_cont .h3_info span{ color:#fff;}
.top_text .title{ text-align:left}
.spark_s1 img{ padding-bottom:6px}	
.spark_s1 .h3_info{    padding-top: 12px;}
.spark_s1 .san_det_cont h3{padding-top:12%;}	

.spark_s1 .san_det_cont h3{    line-height: 12px;}
.spark_s1 img {width: 320px;}	
.h3_info p,.h3_info{ font-size:16px}
.app_spark_s6_01,.app_spark_s6_02,.app_spark_s6_03,.app_spark_s6_04{ display:none}
.spark_s7  .h3_info{ padding-top:0}
.app_camera-h301,.app_camera-h302,.app_camera-h303,.app_camera-h304,.app_camera-h305,.app_camera-h306{ display:none}
	
@media only screen and (max-width:1920px){	
.spark_s1{ height:1000px}
.spark_s2 { height: 686px;}	
.spark_s4 { height: 694px;}	
.spark_s5 { height: 694px;}	
.spark_s5  .tit_box{    margin-left: 75%;  padding-top: 8%;}
.spark_s4  .tit_box{    padding-top: 5%;}
.spark_s2  .tit_box{padding-top: 12%;}
.spark_s1 .san_det_cont h3 { padding-top: 5%;}
.spark_s6{ height:692px}
.video_bg img{ height:100%; width:auto}



}	
	
	
@media only screen and (max-width:1440px){	
.spark_s1 .san_det_cont h3 {  padding-top: 3%;}
.spark_s4  .tit_box{    padding-top: 5%;}
.spark_s5  .tit_box{    padding-top: 9%;}
.spark_s6{ height:600px}






}
	
	
	
		
@media only screen and (max-width:1366px){	
.spark7_itme{ width:90%; }
.s2_item { width:90%; padding:68px 0;}
.s2_item ul li div {  padding: 0 50px;}
.spark_s4 .tit_box {  width: 345px}
.spark_s5  .tit_box{    margin-left: 74%;}
.spark_s5  .tit_box{    padding-top: 11%;}


}
	
	
			
@media only screen and (max-width:1024px){	
.s2_item ul li div{padding: 0 25px;}
.spark_s4 .tit_box{padding-top: 3%;}
.spark_s5 .tit_box{padding-top:8%;}
.s2_item{padding: 85px 0;}
.s2_item ul li div{    padding: 0 26px;}
.san_det_cont h3{ font-size:38px}
.spark_s5 .h3_info span, .spark_s4 .h3_info span{ font-size:25x;}
.spark_s5 .h3_info p, .spark_s4 .h3_info p{ font-size:16px}
.spark_s2  .tit_box{padding-top: 17%;    margin-left: 55%;}
.spark_s2  .h3_info{  width:100%}
.spark_s2 .tit_box { width: 377px;}




}

		
	
@media only screen and (max-width:768px){	
.app_spark_s6_01,.app_spark_s6_02,.app_spark_s6_03,.app_spark_s6_04{ display:block}
.app_spark_s1{ height:1150px; background:url(../images/s2_jg21.jpg) no-repeat center top;background-size: cover;}
.spark_s1 .san_det_cont h3{    padding-top: 20%;}
.tit_box{    width: 68%;}
.spark_s1  .h3_info span{    padding-bottom: 30px;}
.app_spark_s2{ height:865px; background:url(../images/s2_jg22.jpg) no-repeat center top;background-size: cover;}
.spark_s2  .tit_box{width: 68%; margin:0 auto;    padding-top: 5%;}
.spark_s2  .tit_box h3{ text-align:center}
.spark_s2  .h3_info{text-align:center}
.s2_item ul li{ width:100%; float:none; background:none; margin-bottom:40px}
.s2_item{ padding:80px 0 }
.s2_item ul li div{ width:100%; height:auto; overflow:hidden}
.s2_item ul li div span{ display:inline-block; width:27%; float:left; }
.s2_item ul li div p{ display:inline-block; float:right; width:63%;    line-height: 28px;}
.app_spark_s4{ height:1150px; background:url(../images/s2_jg23.jpg) no-repeat center top;background-size: cover;}
.spark_s4 .tit_box{width: 68%; margin:0 auto;}
.spark_s4  .san_det_cont h3{ text-align:center}
.spark_s4  .h3_info{ text-align:center}
.app_spark_s5{ height:1150px; background:url(../images/s2_jg24.jpg) no-repeat center top;background-size: cover;}
.spark_s5  .tit_box{width: 68%; margin:0 auto;}
.spark_s5  .san_det_cont h3{ text-align:center}
.spark_s5  .h3_info{ text-align:center}
.mask_list,.video_cover_list,.video_list{ display:none}
.app_spark_s6{ height:530px; background:url(../images/s2_jg25.jpg) no-repeat center top;background-size: cover;}
.spark_s6  .san_det_cont h3{ padding-top:29%}
.app_spark_s6_01{ height:770px;background:url(../images/s2_jg26.jpg) no-repeat center top;background-size: cover; }
.app_spark_s6_01 h3{ color:#fff; padding-top:13%;}
.app_spark_s6_01 .h3_info{ color:#fff;}
.app_spark_s6_02{ height:770px;background:url(../images/s2_jg27.jpg) no-repeat center top;background-size: cover; }
.app_spark_s6_02 h3{ color:#fff;padding-top: 13%;}
.app_spark_s6_02 .h3_info{ color:#fff;}
.app_spark_s6_03{ height:815px;background:url(../images/s2_jg28.jpg) no-repeat center top;background-size: cover; }
.app_spark_s6_03 h3{ color:#fff;padding-top: 13%;}
.app_spark_s6_03 .h3_info{ color:#fff;}
.app_spark_s6_04{ height:865px;background:url(../images/s2_jg29.jpg) no-repeat center top;background-size: cover; }
.app_spark_s6_04 h3{ color:#fff;padding-top: 13%;}
.app_spark_s6_04 .h3_info{ color:#fff;}
.spark7_itme ul li{ width:43.4%}
.s2_item ul li div{ padding-left:0}
.spark_s4 .tit_box{ padding-top:30px}
.s2_item ul li:last-child{ margin-bottom:0}
.h3_info{    padding-top: 20px; }
.spark_s7  .san_det_cont h3{ padding-top:30px}
.spark_s6  .san_det_cont .h3_info{    padding-top: 0;}
.s2_item{ width:75%}
 .h3_info{ width:100%}






}	
	
	
	
	
	
	
@media only screen and (max-width:500px){
.app_spark_s1{ height:620px;}
.h3_info span{ font-size:18px}	
.h3_info{font-size:13px; line-height:22px}			
.app_spark_s2{ height:466px;}	
.san_det_cont h3{ font-size:26px;line-height: 46px}
.s2_item ul li div span{ font-size:13px;}	
.s2_item ul li div p{ font-size:10px; line-height:20px;width:65%;}	
.s2_item ul li{ margin-bottom:15px}
.s2_item{ padding:40px 0}
.spark_s5 .h3_info span, .spark_s4 .h3_info span{ font-size:16px;}	
.spark_s5 .h3_info p, .spark_s4 .h3_info p{ font-size:10px;line-height: 16px;}
.app_spark_s4{ height:620px;}
.spark_s5 .h3_info, .spark_s4 .h3_info{padding-top:10px;}
.app_spark_s5{ height:620px}
.app_spark_s6{ height:285px}
.spark_s6  .san_det_cont h3{padding-top:14%;}
.app_spark_s6_01{ height:415px}
.app_spark_s6_02{ height:415px}
.app_spark_s6_03{ height:440px}
.app_spark_s6_04{ height:465px}
.tit_box,.spark_s2  .tit_box{width: 90%;}
.spark7_itme{padding: 60px 0;}
.spark_s7 .h3_info{padding-top: 0px;}
.spark7_itme ul li p{font-size: 16px;}	
.spark_s5 .tit_box{padding-top: 8%;}
.spark_s5 .h3_info span, .spark_s4 .h3_info span{padding-bottom: 0;}
.spark_s5 .h3_info, .spark_s4 .h3_info{padding-bottom: 0;}
.spark_s4  .san_det_cont h3,.spark_s5  .san_det_cont h3{ padding-top:0}
.spark_s2  .tit_box{    padding-top: 0%;}
.spark_s5  .tit_box{ width:92%}
.h3_info p,.h3_info{ font-size:13px}
.spark_s1  .h3_info span{padding-bottom: 20px;}
.spark_s2 .san_det_cont h3{    padding-top: 4%;}
.s2_item{    width: 85%;}
.s2_item ul li div span{    width: 29%;}
.spark7_itme ul { width: 80%; margin: 0 auto;}
.spark7_itme ul li{ width:100%; float:none}
.tit_box{ width:80%}
.spark_s1 .san_det_cont h3{    padding-top: 3%;}
.spark_s5 .h3_info p, .spark_s4 .h3_info p{    padding-bottom: 12px;}
.spark_s4 .tit_box{    padding-top: 2px;}
.h3_info { padding-top: 5px;}
.app_spark_s6_01 h3,.app_spark_s6_02 h3,.app_spark_s6_03 h3,.app_spark_s6_04 h3{ padding-top:0}
.spark_s7 .san_det_cont h3 { padding-top: 0px;}







}
	
@media only screen and (max-width:400px){	




}