@charset "utf-8";
img{border:0;display: block;}
p{margin:0}
*{margin:0;padding:0}
body{
	font-size:16px;
	font-family:"微软雅黑"; 
	line-height:34px;
	/****
	background-position:center;
	background-color: #f3f4f6;
	background-image:url(images/bg.png);
	background-repeat:repeat;
	background-position:center bottom
	*****/
}

.bga{background-color: #cdeaff;background-image: url(images/bg.png);background-repeat: repeat;}
.bgb{background-color: #f3f4f7;background-image: url(images/bg.png);background-repeat: repeat;}



.w100{
	idth:100%;
	margin:0 auto;
	min-width: 1300px;}
ul,li{list-style:none}

.fl{float:left}
.fr{float:right}
.cb{clear:both}
.tac{text-align:center}

.bg{background-image:url(images/banner.png);background-repeat:no-repeat;background-position:center;height:900px;z-index:-1;}
/***
.dh a{font-size:19px;color:#333;line-height:82px;padding:0 20px; text-decoration:none;display:inline-block;}
.dh a:hover, a.an{background: linear-gradient(to bottom, #ffffff, rgba(255,255,255,0.1));}
***/
.ab{position:absolute;z-index:100;width:90%;margin:0 auto;left:0;right:0}

.w1300{
	width: 1300px;
	margin: 0 auto;
}

.nav {
  
    width: 1300px;
	margin:0 auto;
    left:0;right:0;
    z-index: 99;
      position: fixed;
  top: 0;
text-align: center;

}

.nav ul {
	width: 1300px;
	margin: 0 auto;
	font-size: 28px;
    line-height: 56px;
    display: flex;
  justify-content: space-between; /* 主轴两端对齐 */

}


.nav li {
	 width: 15%; /* 每个li占容器16%宽度 */
  flex: 0 0 calc(15% - 10px); /* 考虑间隙的精确计算,减去的10px为li之间的默认间隙 */
  box-sizing: border-box;
	
	line-height: 40px;
	text-align: center;

	color:#fff;
	text-decoration:none;
	display: inline-block;
	font-size:24px;

	border-radius: 10px;
	margin-top: 10px;

	cursor: pointer;
opacity: 0;
animation: fadeIn 0.5s forwards;
visibility: hidden;


}

.nav li a{
	text-decoration: none;
	color: #fff;
	display: block;
	width: 100%;
	 background-image: -moz-linear-gradient( 0deg, rgb(65,198,253) 1%, rgb(0,112,196) 100%);
  background-image: -webkit-linear-gradient( 0deg, rgb(65,198,253) 1%, rgb(0,112,196) 100%);
  background-image: -ms-linear-gradient( 0deg, rgb(65,198,253) 1%, rgb(0,112,196) 100%);
  border-radius: 20px;
  line-height: 50px;

}


/* 定义按钮逐个显示的动画 */
@keyframes fadeIn {
  to {
    visibility: visible;
    opacity: 1;
  }
}

/* 为每个按钮设置不同的延迟时间 */
.nav li:nth-child(1) { animation-delay: 0.2s; }
.nav li:nth-child(2) { animation-delay: 0.4s; }
.nav li:nth-child(3) { animation-delay: 0.6s; }
.nav li:nth-child(4) { animation-delay: 0.8s; }
.nav li:nth-child(5) { animation-delay: 1.0s; }
.nav li:nth-child(6) { animation-delay: 1.2s; }




.nav li a:hover,.nav li a.an{
	
	 background-image: -moz-linear-gradient( 0deg, rgb(245,209,31) 1%, rgb(238,131,21) 100%);
  background-image: -webkit-linear-gradient( 0deg, rgb(245,209,31) 1%, rgb(238,131,21) 100%);
  background-image: -ms-linear-gradient( 0deg, rgb(245,209,31) 1%, rgb(238,131,21) 100%);
 
}


.margin-top40{
	margin-top: 40px;
}

/********web************/
.webs,.webs2,.webs3{
	width: 100%;
	margin: 0 auto;
	display: flex;
  justify-content: space-between;
}
.webs a,.webs2 a,.webs3 a{
	text-decoration: none;
	display: inline-block;
	margin-top: 50px;

}


/* 图片链接样式 图片宽度计算1*/
.webs a,{
  flex: 0 0 400px; /* 固定宽度计算：(1300px - 间距) / 3 */
  height: auto;
  text-align: center;
}

.webs a img, .webs2 a img , .webs3 a img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.3s ease;
}


.webs a:hover img, .webs2 a:hover img , .webs3 a:hover img{
  transform: scale(1.2); /* 放大两倍 */
}

/********app************/
/* 图片链接样式 图片宽度计算2*/
.webs2 a {
  flex: 0 0 0 0 250px; /* 固定宽度计算：(1300px - 间距) / 4 */
  height: auto;
  text-align: center;
}


/********webs +app************/
/* 图片链接样式 图片宽度计算3*/
.webs3 a {
  flex: 0 630px; /* 固定宽度计算：(1300px - 间距) / 2 */
  height: auto;
  text-align: center;
}