*{
font-family: "Noto Sans SC"; font-weight: 400;
}
.home {
  width: 100%;
  height: 100%;
  min-width: 1340px;
  max-width: 1920px;
  overflow: hidden;
}

.home .card-group {
  position: relative;
  top: -120px;
  z-index: 2000;
  text-align: center;
  height: 420px;
  width: 1080px;
  margin: 0 auto;
  overflow: hidden;
  padding: 0 15px;
  font-size: 0;
}
.home .card-group .card-group-item {
  width: 250px;
  height: 390px;
  margin-left: 15px;
  float: left;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: box-shadow .3s;
}
.home .card-group .card-group-item:first-child {
  margin-left: 0;
}
.home .card-group .card-group-item:hover .bg-img-before {
  display:none;
}
.home .card-group .card-group-item .item-box .bg-img-hover{
  opacity:0;
}
.home .card-group .card-group-item:hover {
  #box-shadow: 0 2px 12px 0 rgb(0 0 0 / 50%);
}
.home .card-group .card-group-item:hover .item-box {
  top: 6;
}
.home .card-group .card-group-item:hover .btn-box {
  transform: translatey(0);
}
.home .card-group .card-group-item:hover .shadow {
  opacity: 0;
  filter: alpha(opacity=0); /*IE下*/
  -moz-opacity: 0; /* 老版Mozilla */
  -khtml-opacity: 0; /* 老版Safari */
}
.home .card-group .card-group-item:hover .logo {
  opacity: 1;
  filter: alpha(opacity=100); /*IE下*/
  -moz-opacity: 1; /* 老版Mozilla */
  -khtml-opacity: 1; /* 老版Safari */
}


.home .card-group .card-group-item:hover .bg-img-hover {
  opacity: 1;
  filter: alpha(opacity=100); /*IE下*/
  -moz-opacity: 1; /* 老版Mozilla */
  -khtml-opacity: 1; /* 老版Safari */
}
.home .card-group .card-group-item .item-box {
  width: 250px;
  height: 350px;
  position: absolute;
  top: 40px;
  left: 0;
  transition: top .4s;
  z-index: 2;
}
.home .card-group .card-group-item .bg-img {
  width: 100%;
  height: 100%;
}
.home .card-group .card-group-item .shadow {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-image: linear-gradient(transparent, rgba(0,0,0,.4));
  transition: opacity .3s;
}
.home .card-group .card-group-item .text {
  width: 100%;
  position: absolute;
  bottom: 24px;
  left: 0;
  color: #fff;
  text-align: center;
}
.home .card-group .card-group-item .shadow .text .title {
  font-size: 28px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home .card-group .card-group-item .shadow .text .sub-title {
  font-size: 18px;
  opacity: 0.8;
  /* 兼容性写法 */
  zoom: 1;
  filter: alpha(opacity=80); /*IE下*/
  -moz-opacity: 0.8; /* 老版Mozilla */
  -khtml-opacity: 0.8; /* 老版Safari */
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 0 10px;
}
.home .card-group .card-group-item .logo {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  text-align: center;
  opacity: 0;
  filter: alpha(opacity=0); /*IE下*/
  -moz-opacity: 0; /* 老版Mozilla */
  -khtml-opacity: 0; /* 老版Safari */
  transition: opacity .3s;
}
.home .card-group .card-group-item .logo img {
  max-width: 100%;
  display: inline-block;
}
.home .card-group .card-group-item .btn-box {
  width: 100%;
  height: 100px;
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #209cf4;
  transform: translatey(40px);
  transition: transform .3s;
}
.home .card-group .card-group-item .btn-box .btn {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  text-align: center;
  font-size: 18px;
  color: #fff;
  background-color: #209cf4;
  line-height: 40px;
}

/* hero */

.home .hero {
  position: relative;
  width: 100%;
  overflow: hidden;
  height: 440px;
  margin: 0 auto;
  width: 1200px;
  margin-top: -60px;
}
.home .hero .hero-left {
  float: left;
  width: 460px;
  margin-top: 100px;
  margin-left: 100px;
}
.home .hero .hero-left .title {
  font-size: 48px;
  color: #209cf4;
  font-weight: 700;
}
.home .hero .hero-left .sub-title {
  margin-top: 24px;
  font-size: 20px;
  color: #2f3236;
}
.home .hero .hero-left .recruit {
  font-size: 22px;
  margin-top: 70px;
  overflow: hidden;
}
.home .hero .hero-left .recruit-left {
  color: #209cf4;
  float: left;
  /* cursor: pointer; */
}
.home .hero .hero-left .recruit-right {
  color: #209cf4;
  float: right;
  /* cursor: pointer; */
}
.home .hero .hero-right {
  float: right;
  width: 500px;
  height: 100%;
  overflow: hidden;
}
.home .hero .hero-right .hero-img {
  width: 100%;
  height: auto;
}
.his{
display: flex;
flex-wrap: wrap;
align-items: center;
-ms-flex-pack: justify;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-moz-box-pack: justify;
justify-content: space-between;
width: 1000px;
margin: 30px auto;
margin-top:80px;
padding-bottom: 24px;
	}
.channel-box{
display: flex;
flex-wrap: wrap;
align-items: center;
-ms-flex-pack: justify;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-moz-box-pack: justify;
justify-content: space-between;
width: 880px;
margin: 20px auto;
margin-left:26%;
padding-bottom: 24px;
}
.litb{
display: -ms-flexbox;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: flex;
-ms-flex-align: center;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
align-items: center;
-ms-flex-pack: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
justify-content: center;
-ms-flex-direction: column;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-moz-box-orient: vertical;
-moz-box-direction: normal;
flex-direction: column;
margin-bottom: 35px;
width: 144px;
height: 144px;
background: #fff;
border-radius: 4px;
/* -webkit-box-shadow: 0 2px 20px 0 rgb(203 204 204 / 26%); */
/* box-shadow: 0 2px 20px 0 rgb(203 204 204 / 26%); */
}
.lit-channel{
display: -ms-flexbox;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: flex;
-ms-flex-align: center;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
align-items: center;
-ms-flex-pack: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
justify-content: center;
-ms-flex-direction: column;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-moz-box-orient: vertical;
-moz-box-direction: normal;
flex-direction: column;
width: 280px;
height: 160px;
background: white;
border-radius: 4px;
//-webkit-box-shadow: 0 2px 20px 0 rgb(203 204 204 / 26%);
//box-shadow: 0 2px 20px 0 rgb(203 204 204 / 26%);
}
 .li-box{
	width:100%;
	height:100%;
  }
  .i10{
  	background-image: url("../img/10.png");
 	 background-repeat: no-repeat;
  }
 .i300{
  	background-image: url("../img/300.png");
 	 background-repeat: no-repeat;
  }
 .i500{
  	background-image: url("../img/500.png");
 	 background-repeat: no-repeat;
  }
 .i1000{
  	background-image: url("../img/1000.png");
 	 background-repeat: no-repeat;
  }
.pic-after{
	display:none;
	padding-top:20px;
	color:#eee;
}
.pic-before div{
  font-size:24px;
  margin-top:5px;
}
.lit-channel:hover  .pic-before{
	display:none;
}
.lit-channel:hover  .pic-after{
	display:block;
filter: alpha(opacity=100); /*IE下*/
  -moz-opacity: 1; /* 老版Mozilla */
  -khtml-opacity: 1; /* 老版Safari */
}
.channel-af{
width:100%;
height:100%;
background-image: url("../img/channel-af.png");
}
.sdk-af{
width:100%;
height:100%;
background-image: url("../img/sdk-af.png");
}
.faxing-af{
width:100%;
height:100%;
background-image: url("../img/faxing-af.png");
}
.title{
   font-size:30px;
   margin-top:5px;
   margin-bottom:15px;
}
.sm{
   font-size:18px;
}
.left1{
position:absolute;
top:-380px;
width:219px;
height:526px;
background-image: url("../img/zs-right.png");
}
.right1{
position:absolute;
right:0px;
bottom:0px;
width:193px;
height:419px;
float:right;
background-image: url("../img/zs-left.png");
}

.lunbo{
 width: 100%;
}
.content{
 width: 1920px;
 height: 850px;
 margin: 0px auto;
 position: relative;
}
#item{
 width: 100%;
 height: 100%;

}
.item{
 position: absolute;
 left:0px;
 opacity: 0;
 transition: all 1s;

}
.item.active{
 opacity:1;
}
img{
 width: 100%;
}

#circle{
 height: 20px;
 display: flex;
 position: absolute;
 bottom: 55px;
 right: 125px;
}
.circle{
 width: 10px;
 height: 10px;
 border-radius: 10px;
 border: 2px solid white;
 background: rgba(0,0,0,0.4);
 cursor: pointer;
 margin: 5px;
}
.white{
 background-color: #FFFFFF;
}
a:visited{
 color:#444;
}
.start{
    top:70%;
    left:50%;
    /* margin-top:-52px; */
    margin-left:-52px;
    position: absolute;
    width:75px;
    height:75px;
  	background-image: url("../img/start.png");
    z-index: 2000;
    cursor:pointer;
}

.video-play {
  width: 960px;
  height: 400px;
  left: 50%;
  top: 50%;
  margin: -240px 0 0 -512px;
  z-index: 9999;
}
.video-play {
  background-color: #000;
  position: fixed;
}
.video-play .video-close {
  background: url(https://static.web.sdo.com/shengqugames/html/img/close.png) center no-repeat #e4004f;
  width: 60px;
  height: 60px;
  position: absolute;
  right: -60px;
  top: 0;
  cursor: pointer;
}
.cover{
  background: #000;
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  display: none;
  z-index: 2002;
  filter: alpha(opacity=60);
  opacity: 0.9 !important;
}
