*{
	padding: 0;
	margin: 0;
}
@media (max-width: 600px){

}
#exit{
	display: none;
	cursor: pointer;
}

.cha{
	width: 60px;
	height: 60px;
	margin: auto;
	position: absolute; 
	z-index: 1000;
	right: 20px;
	top: 0px;
 
}
.cha::before,
.cha::after{
  content: "";
  position: absolute;  /*方便进行定位*/
  height: 60px;
  width: 1.5px;
  top: 2px;
  right: 29px; 
  background: #FFFFFF;
}
.cha::before{
  transform: rotate(45deg);  /*进行旋转*/
}
.cha::after{
  transform: rotate(-45deg);
}

.right{
	width: 80px;
	height: 140px;
	margin: auto;
	position: absolute; 
	z-index: 1000;
	right: 0px;
	top: 40%;
	display: none;
	 
 
}
.right:hover{
	background: rgba(0,0,0,0.4);	
}
.right:after {
    content: " ";
    display: inline-block;
    height: 30px;
    width: 30px;
    border-width: 2px 2px 0 0;
    border-color: #FFFFFF;
    border-style: solid;
    -webkit-transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
    transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
    position: absolute;
    padding:0;
    margin-top: 55px;
    margin-left: 20px;
}

.left{
	width: 80px;
	height: 140px;
	margin: auto;
	position: absolute; 
	z-index: 1000;
	left: 0px;
	top: 40%;
	display: none;
	 
 
}
.left:hover{
	background: rgba(0,0,0,0.4);	
}
.left:after {
    content: " ";d
    display: inline-block;
    height: 30px;
    width: 30px;
    border-width: 2px 2px 0 0;
    border-color: #FFFFFF;
    border-style: solid;
    -webkit-transform: matrix(-0.71, -0.71, 0.71, -0.71, 0, 0);
    transform: matrix(=0.71, -0.71, 0.71, -0.71, 0, 0);
    position: absolute;
    margin-top: 55px;
    margin-left: 27px;        
}



.top{
	width: 100%;
	position: relative;
 
}
.center{
	width: 100%;
	position: relative;
 
}
.kong{
	width: 500px;
	position: relative;
 
}
.banbenfenlei{
	width: 500px;
	position: relative;
	margin-left: 3.5%;
	margin-top: 38px;
	margin-bottom: 36px;
	font-size:32px;
	font-family:Microsoft YaHei;
	font-weight:bold;
	color:rgba(51,51,51,1);
 
}

.banbenshow{
	position: relative;
	text-align: center;
 
}
.banbenshow span{
	display: block;
	width: 90%;
	height: 40px;
	border: 1px solid #E5E5E5;
	border-radius: 5px;
	margin-left: 5%;
	cursor: pointer;
	font-size:14px;
	font-family:Microsoft YaHei;
	font-weight:400;
	color:rgba(102,102,102,1);
	line-height: 40px;

}
.banbenshow span:hover{
	border: 1px solid #3D6BE5;
	color:#3D6BE5;
}
.banbenhide{
	position: relative;
	display: none;
	text-align: center;
}
.banbenhide span{
	display: block;
	width: 90%;
	height: 40px;
	border: 1px solid #E5E5E5;
	border-radius: 5px;
	margin-left: 5%;
	cursor: pointer;
	line-height: 40px;
	font-size:14px;
	font-family:Microsoft YaHei;
	font-weight:400;
	color:rgba(102,102,102,1);

}
.banbenhide span:hover{
	border: 1px solid #3D6BE5;
	color:#3D6BE5;

}
.fenlei{
	width: 500px;
	position: relative;
	margin-left: 3.5%;
	margin-top: 68px;
	margin-bottom: 36px;
	font-size:32px;
	font-family:Microsoft YaHei;
	font-weight:bold;
	color:rgba(51,51,51,1);
 
}
.tougao{
	width: 46%;
	height: 230px;
	position: relative;
	margin-left: 3.5%;
	float: left;
	background-color: #F4F9F7;
}
.tougao-tu{
	float: left;
	width: 60px;
    margin: 55px 0px auto 5%;
}
.tougao-font{
	float: left;
	width: 70%;
	height: 100%;	
}
.tougao-font h2{
	font-size:24px;
	font-family:Microsoft YaHei;
	font-weight:bold;
	color:rgba(51,51,51,1);
	margin-top: 50px;
}
.tougao-font h4{
	margin-top: 10px;
	    font-size: 14px;
    line-height: 22px;
    text-align: justify;
	font-weight:400;
	color:rgba(130,130,130,1);
}

.shengm{
	width: 47.2%;
	height: 230px;
	position: relative;
	padding-left: 1.1%;
	float: left;
	background-color: #F4F9F7;
	margin-bottom: 50px;
}
.shengm-tu{
	float: left;
	    width: 60px;
    margin: 53px 0px auto 5%;
}
.shengm-font{
	float: left;
	width: 70%;
	height: 100%;	
}
.shengm h2{
	font-size:24px;
	font-family:Microsoft YaHei;
	font-weight:bold;
	color:rgba(51,51,51,1);
	margin-top: 50px;
}
.shengm h4{
	margin-top: 10px;
	    font-size: 14px;
    line-height: 22px;
    text-align: justify;
	font-weight:400;
	color:rgba(130,130,130,1);
}
.down{
	width: 100%;
	position: relative;
 
}
/*-------------------------------------------------------------------------------------*/
.box-1{
	position:relative; 
	z-index:90;
	width: 100%;
	height:	730px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	float: left;
 
}
.box-top{
	position: absolute;
	z-index: 100;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.7));
	text-align: center;
	transition:0.5s;
 
}
.box-top:hover{
	background-image:none;
}
.box-top-lable{
 position: relative;
 z-index: 101; 
 width: 750px;
 height: 182px;
 margin: 0 auto;
 margin-top: 203px;
 text-align: center;
  background-image: url(https://www.ubuntukylin.com/public/images/wallpaper/boxfont-en.png);
}
/*.box-top-lable h2{
 font-size: 55px; text-shadow:2px 2px 2px #888;
 color: #fff;
 cursor: default;
}
.box-top-lable h3{
 font-size: 34px;text-shadow:2px 2px 2px #888;
 color: #fff;
 cursor: default; 
}*/
.box-top-bt{ 
 position: relative;
 z-index: 101;
 margin: 0 auto;
 margin-top: 34px;
 width: 305px;
 height: 84px;
 cursor: pointer;
 object-fit: cover;
 background-image: url(https://www.ubuntukylin.com/public/images/wallpaper/bt-en.png);
}
.box-top-bt:hover{
 background-image: url(https://www.ubuntukylin.com/public/images/wallpaper/bthover-en.png);
}
/*-------------------------------------------------------------------------------------*/
#ky1cont{
	position: absolute;
	z-index: 93;
	width: 100%;
	height: 100%;
	margin:0 auto;
 
}
.ky1imm {
	width: 100%;
	height: 100%;
 
}
.ky1imm a{
	position: absolute;
	width: 100%;
	height: 100%;
	margin:0 auto;
	display: block;
}
.ky1imm img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/*-------------------------------------------------------------------------------------*/
.photo{
	position: absolute;
	bottom: 0px;
	width: 100%;
	background: rgba(0,0,0,0.5);
	height: 100px;
	display: none;
}

.msg{
	padding: 0 20%;
	/*width: 60%;*/
	height: 60px;
	margin-top: 25px;
	display: none;
 
}
.msg-font{
	width: 60%;
	height: 60px;
	float: left;
margin-top: -20px ;

}
.msg-font h2{
	font-size: 18px ;
	color: #fff;
}
.msg-font h4{
	font-size: 12px;
	color: #fff;
}
.msg-download{
	height: 44px;
	width: 120px;
	background-color: #006EAD;
	text-align: center;
	line-height: 44px;
	float: right;
	cursor: pointer;
	border-radius: 6px;
 
}
.msg-download h2{
	font-size: 16px;
	color: #fff;
margin-top: 11px;
}

.download{
	width: 135px;
	height: 135px;
	background: #006EAD;
	text-align: center;
	float: left;
	margin-left: 10%;
	margin-top: 5px;
	cursor: pointer;
	display: none;
	border-radius: 6px;
	 
 
}
.download img{
	width: 32px;
	height: 32px;
	margin: 0 auto;
	margin-top: 32px;
	cursor: pointer;
}
.download span{
	color: #fff;
	font-size: 16px;
	line-height: 22px;
	display: block;
	margin-top: 10px;
	cursor: pointer;
}
/*-------------------------------------------------------------------------------------*/
.ky1btn{
	width: 70%;
	height: 135px;
	float: left;
	margin-left: 20px;
	display: none;
 
}
.ky1btn ul {
	overflow-x: hidden;
	white-space:nowrap;
	width: auto;
}
.ky1btn ul li{
	width: 216px;
	height: 135px;
	list-style: none;
	display: inline-block;
	margin: 0 5px;
	text-align: center;
	color: rgba(204,204,204,0.00001);
	line-height: 12px;
	cursor: pointer;
	object-fit: cover;
	background-size: 100% 100%; 
    background-repeat: no-repeat;
}
.ky1btn ul li.ky1on{
	border: 2px solid #006EAD;
	color: rgba(0,110,173,0.00001);
	border-radius: 4px;;
}


/*---------------------------------------------------------------------------------------------------*/

.box-mid{
	position: absolute;
	z-index: 100;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.7));
	text-align: center;
	transition:0.5s;
}
.box-mid:hover{
	background-image: none;
}
.box-mid-lable{
	position: relative;
	z-index: 101;
	height: 55px;
	margin: 0 auto;
	margin-top: 170px;
	text-align: center;
 
}
.box-mid-lable h2{
/*	text-shadow:2px 2px 2px #888;*/
	cursor: default;
	font-size:22px;
	font-family:Microsoft YaHei;
	font-weight:normal;
	color:rgba(255,255,255,1);

}
.box-mid-lable h3{
	font-size: 33px;
	color: #fff;	
	cursor: default;
}
/*.box-mid-bt{	
	position: relative;
	z-index: 101;
	margin: 0 auto;
	margin-top: 34px;
	width: 136px;
	height: 31px;
	border-radius: 10px;
	background-color: #fff;
	padding: 0 auto;
	cursor:	pointer;
	text-align: center;
	font-size: 16px;
	font-weight:400;
	color: #010101;
	margin: 30px auto;
	line-height: 29px;
	transition: 0.5s;
 
}*/
/*.box-mid-bt:hover{
	background-color: #3D6BE5;
	color: #FFFFFF;
}*/

/*------------------------------------------------------------------------------------------------------------*/
.cont{
	position: absolute;
	z-index: 93;
	width: 100%;
	height: 100%;
	margin:0 auto;
 
}
.imm {
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.imm a{
	position: absolute;
	width: 100%;
	height: 100%;
	margin:0 auto;
}
.imm a img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.btn{
	width: 70%;
	height: 135px;
	float: left;
	margin-left: 20px;
	display: none;
	 
 
}
.btn ul {
	overflow-x: hidden;
	white-space:nowrap;
	width: auto;
	 
}
.btn ul li{
	width: 216px;
	height: 135px;
	list-style: none;
	display: inline-block;
	margin: 0 5px;
	text-align: center;
	color: rgba(204,204,204,0.00001);
	line-height: 12px;
	cursor: pointer;
	object-fit: cover;
	background-size: 100% 100%; 
    background-repeat: no-repeat;
	 
}
.btn ul li.on{
	border: 2px solid #006EAD;
	color: rgba(0,110,173,0.00001);
	border-radius: 6px;
}

#kyfont-2{
	margin-top: 300px;
}
#kyfont-3{
	margin-top: 300px;
}

.box-2{
	position:relative; 
	z-index:90;
	width: 46%;
	height:	420px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 3.5%;
	float: left;
	 
 
}
.box-3{
	position:relative; 
	z-index:90;
	width: 46%;
	height:	420px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 1.1%;
	float: left;
	 
 
}

.box-4{
	position:relative; 
	z-index:90;
	width: 14.6%;
	height:	220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 3.5%;
	float: left;
	 
 
}

.box-5{
	position:relative; 
	z-index:90;
	width: 14.6%;
	height: 220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 1.1%;
	float: left;
	 
 
}

.box-6{
	position:relative; 
	z-index:90;
	width: 14.6%;
	height: 220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 1.1%;
	float: left;
	 
 
}

.box-7{
	position:relative; 
	z-index:90;
	width: 14.6%;
	height: 220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 1.1%;
	float: left;
	 
 
}

.box-8{
	position:relative; 
	z-index:90;
	width: 14.6%;
	height: 220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 1.1%;
	float: left;
	 
 
}

.box-9{
	position:relative; 
	z-index:90;
	width: 14.6%;
	height: 220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 1.1%;
	float: left;
	 
 
}

.box-10{
	position:relative; 
	z-index:90;
	width: 14.6%;
	height: 220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 3.5%;
	float: left;
	 
 
}


.box-11{
	position:relative; 
	z-index:90;
	width: 14.6%;
	height: 220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 1.1%;
	float: left;
	 
 
}

.box-12{
	position:relative; 
	z-index:90;
	width: 14.6%;
	height: 220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 1.1%;
	float: left;
	 
 
}

.box-13{
	position:relative; 
	z-index:90;
	width: 14.6%;
	height: 220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 1.1%;
	float: left;
 
}

.box-14{
	position:relative; 
	z-index:90;
	width: 14.6%;
	height: 220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 1.1%;
	float: left;
 
}

.box-15{
	position:relative; 
	z-index:90;
	width: 14.6%;
	height: 220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 1.1%;
	float: left;
 
}


.box-16{
	position:relative; 
	z-index:90;
	width: 22.5%;
	height: 220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 3.5%;
	float: left;
}

.box-17{
	position:relative; 
	z-index:90;
	width: 22.5%;
	height: 220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 1.1%;
	float: left;
 
}

.box-18{
	position:relative; 
	z-index:90;
	width: 22.5%;
	height: 220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 1.1%;
	float: left;
 
}

.box-19{
	position:relative; 
	z-index:90;
	width: 22.5%;
	height: 220px;
	background-color: #87CEEB;
	margin-bottom: 20px;
	margin-left: 1.1%;
	float: left;
}


@media (max-width: 1150px){

	.box-mid-lable{
		margin-top: 150px;
	}
	.box-4{
		position:relative; 
		z-index:90;
		width: 30.27%;
		height:	220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 3.5%;
		float: left;
		 
	 
	}

	.box-5{
		position:relative; 
		z-index:90;
		width: 30.27%;
		height: 220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 1.1%;
		float: left;
		 
	 
	}

	.box-6{
		position:relative; 
		z-index:90;
		width: 30.27%;
		height: 220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 1.1%;
		float: left;
		 
	 
	}

	.box-7{
		position:relative; 
		z-index:90;
		width: 30.27%;
		height: 220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 3.5%;
		float: left;
		 
	 
	}

	.box-8{
		position:relative; 
		z-index:90;
		width: 30.27%;
		height: 220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 1.1%;
		float: left;
		 
	 
	}

	.box-9{
		position:relative; 
		z-index:90;
		width: 30.27%;
		height: 220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 1.1%;
		float: left;
		 
	 
	}

	.box-10{
		position:relative; 
		z-index:90;
		width: 30.27%;
		height: 220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 3.5%;
		float: left;
		 
	 
	}


	.box-11{
		position:relative; 
		z-index:90;
		width: 30.27%;
		height: 220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 1.1%;
		float: left;
		 
	 
	}

	.box-12{
		position:relative; 
		z-index:90;
		width: 30.27%;
		height: 220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 1.1%;
		float: left;
		 
	 
	}

	.box-13{
		position:relative; 
		z-index:90;
		width: 30.27%;
		height: 220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 3.5%;
		float: left;
	 
	}

	.box-14{
		position:relative; 
		z-index:90;
		width: 30.27%;
		height: 220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 1.1%;
		float: left;
	 
	}

	.box-15{
		position:relative; 
		z-index:90;
		width: 30.27%;
		height: 220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 1.1%;
		float: left;
	 
	}
}
@media (max-width: 1115px){
	.tougao{
	width: 46%;
	height: 330px;
	position: relative;
	margin-left: 3.5%;
	float: left;
	background-color: #F4F9F7;
	}
	.tougao-tu{
		float: left;
		width: 60px;
    margin: 55px 0px auto 5%;
	}
	.tougao-font{
		float: left;
		width: 90%;
		height: 0;
		margin-left: 5%;	
	}
	.tougao-font h2{
		font-size:24px;
		font-family:Microsoft YaHei;
		font-weight:bold;
		color:rgba(51,51,51,1);
		margin-top: 0px;
	}
	.tougao-font h4{
		margin-top: 10px;
		    font-size: 14px;
    line-height: 22px;
    text-align: justify;
		font-weight:400;
		color:rgba(130,130,130,1);
	}

	.shengm{
		width: 47.2%;
		height: 330px;
		position: relative;
		padding-left: 1.1%;
		float: left;
		background-color: #F4F9F7;
	}
	.shengm-tu{
		float: left;
	    width: 60px;
    margin: 53px 0px auto 5%;
	}
	.shengm-font{
		float: left;
		width: 90%;
		height: 0;
		margin-left: 5%;	
	}
	.shengm h2{
		font-size:24px;
		font-family:Microsoft YaHei;
		font-weight:bold;
		color:rgba(51,51,51,1);
		margin-top: 0px;
	}
	.shengm h4{
		margin-top: 10px;
		    font-size: 14px;
    line-height: 22px;
    text-align: justify;
		font-weight:400;
		color:rgba(130,130,130,1);
	}
}

@media (max-width: 600px){
	.tougao{
		width: 46%;
		height: 480px;
		position: relative;
		margin-left: 3.5%;
		float: left;
		background-color: #F4F9F7;
	}
	.tougao-tu{
		float: left;
		width: 60px;
    margin: 55px 0px auto 5%;
	}
	.tougao-font{
		float: left;
		margin-left: 5%;
		width: 70%;
		height: 0;
	}
	.tougao-font h2{
		font-size:24px;
		font-family:Microsoft YaHei;
		font-weight:bold;
		color:rgba(51,51,51,1);
		margin-top: 0;
	}
	.tougao-font h4{
		margin-top: 10px;
		    font-size: 14px;
    line-height: 22px;
    text-align: justify;
		font-weight:400;
		color:rgba(130,130,130,1);
	}
	.shengm{
		width: 49.5%;
		height: 430px;
		position: relative;
		padding-left: 3.5%;
		float: left;
		background-color: #F4F9F7;
	}
	.shengm-tu{
		float: left;
		    width: 60px;
    margin: 53px 0px auto 5%;
	}
	.shengm-font{
		float: left;
		margin-left: 5%;
		width: 70%;
		height: 0;
	}
	.shengm-font h2{
		font-size:24px;
		font-family:Microsoft YaHei;
		font-weight:bold;
		color:rgba(51,51,51,1);
		margin-top: 0;
	}
	.shengm-font h4{
		margin-top: 10px;
		font-size:14px;
		line-height: 22px;
		
		font-weight:400;
		color:rgba(130,130,130,1);
	}
	.box-16{
		position:relative; 
		z-index:90;
		width: 45.95%;
		height: 220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 3.5%;
		float: left;
	}

	.box-17{
		position:relative; 
		z-index:90;
		width: 45.95%;
		height: 220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 1.1%;
		float: left;
	 
	}

	.box-18{
		position:relative; 
		z-index:90;
		width: 45.95%;
		height: 220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 3.5%;
		float: left;
	 
	}

	.box-19{
		position:relative; 
		z-index:90;
		width: 45.95%;
		height: 220px;
		background-color: #87CEEB;
		margin-bottom: 20px;
		margin-left: 1.1%;
		float: left;
	}
}