@charset "utf-8";
/* CSS Document */

header{
	width:100%;
	height:60px;
	background-color:#1DD0ED;
	line-height:40px;
	font-size:30px;
	color:#106EDD;
	padding:0 16px;
	box-sizing:border-box;
	position:fixed;
	top:0;
	z-index:999;
	}
	
	
.logo{ width:200PX;
       float:left;
       line-height:60px;
	   font-size:36px;
	   letter-spacing:3px;
	   text-align:center;
	   font-weight:bold;
	   font-style: italic;}

.logo1{ width:200px;
        float:left;
		font-size:24px;
		color:#008000;
		font-style: italic;
		line-height:65px;}
		
.logo2{ width:60px;
        float:left;
		margin-right:16px;
		color:#008000;
		font-style: italic;
		line-height:65px;}

nav{
	width:300px;
	background-color:#289DF3;
	position:fixed;
	top:0;
	right:0;
	bottom:0;
	padding:16px;
	box-sizing:border-box;
	z-index:9999;
	box-shadow:-1px 0 8px rgba(0,0,0,0.3);
	display:none;
	}
	
	
nav li{
	width:100%;
	height:30px;
	line-height:30px;
	font-size:18px;
	margin-bottom:16px;
	}	
	
nav li a{color:#FFFFFF;}


.x{
	width:30px;
	height:30px;
	position:absolute;
	right:8px;
	top:8px;
	cursor:pointer;
	background-image:url(../img/letter-x.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:20px;
	z-index:10000;		
	}



.open{
	width:40px;
	height:60px;
	cursor:pointer;
	background-image:url(../img/menu.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:46px;
	float:right;
	}
	
	
	
	
article{ 
max-width:900px; 
margin:40px auto;
}


.style01{ 
width:100%; 
min-height:300px;
background-color:#FFF;
}

.banner{ 
width:100%; 
min-height:40px;
background-color:#007FFF;
}

.banner ul{ overflow:hidden}
	
.banner li{
	width:25%;
	height:40px;
	float:left;
	line-height:40px;
	text-align:center;
	font-size:18px;
	font-weight:bold;
	letter-spacing:2px;
	color:#000;
	}
	
.banner li:hover{ background-color:#00F}

/*02*/
.style02{ 
width:100%; 
min-height:300px;
background-color:#B1B1B1;
}

.style02 ul{ overflow:hidden}
	
.style02 li{
	width:50%;
	height:300px;
	float:left;
	}
	
.style02 h1{ font-size:24px; font-weight:bold; letter-spacing:3px; text-align:center; margin-bottom:12px; color:#D40000; }
.style02 p{ font-size:16px; letter-spacing:3px; margin-bottom:12px; line-height:30px;}



.style02 li:nth-child(1){ background-color:#FFF;}
.style02 li:nth-child(2){ background-color:#FFF; padding:32px}	



/*03*/
.style03{ 
width:100%; 
min-height:300px;
background-color:#B1B1B1;
}

.style03 ul{ overflow:hidden}
	
.style03 li{
	width:33.3%;
	height:300px;
	float:left;
	}

.style03 li:nth-child(1){ background-color:#C48485;}
.style03 li:nth-child(2){ background-color:#55A8FF;}
.style03 li:nth-child(3){ background-color:#000000;}


/*04*/
.style04{ 
width:100%; 
min-height:300px;
background-color:#B1B1B1;
}

.style04 ul{ overflow:hidden}
	
.style04 li{
	width:25%;
	height:480px;
	float:left;
	border:1px solid #000;
	box-sizing: border-box;
	}
	
.style04 h2{ font-size:18px; font-weight:bold; letter-spacing:3px; text-align:center; margin-bottom:8px; color:#D40000;margin-top:4px}
.style04 h3{ font-size:18px; font-weight:bold; letter-spacing:3px; text-align:center; margin-bottom:8px; color:#D40000;margin-top:5px}
.style04 h4{ font-size:18px; font-weight:bold; letter-spacing:3px; text-align:center; margin-bottom:8px; color:#D40000;margin-top:4px}
.style04 h5{ font-size:18px; font-weight:bold; letter-spacing:3px; text-align:center; margin-bottom:8px; color:#D40000;margin-top:4px}
.style04 p{ font-size:16px;  letter-spacing:1px; margin-bottom:12px; line-height:20px;  padding:3px}

.style04 li:nth-child(1){ background-color:#FFF; padding:3px; background-image:url(../img/bodybg.jpg); background-repeat:no-repeat; background-position:center}
.style04 li:nth-child(2){ background-color:#FFF; padding:3px;background-image:url(../img/bodybg.jpg); background-repeat:no-repeat; background-position:center}
.style04 li:nth-child(3){ background-color:#FFF; padding:3px;background-image:url(../img/bodybg.jpg); background-repeat:no-repeat; background-position:center}
.style04 li:nth-child(4){ background-color:#FFF; padding:3px; background-image:url(../img/bodybg.jpg); background-repeat:no-repeat; background-position:center}



/*05*/
.style05{ 
width:100%; 
min-height:300px;
background-color:#B1B1B1;
}

.style05 ul{ overflow:hidden}
	
.style05 li{
	width:33.3%;
	height:300px;
	float:left;
	}
	
.style05 h6{ font-size:22px; font-weight:bold; letter-spacing:3px; text-align:center; margin-bottom:18px; color:#D40000;margin-top:14px}

.style05 p{ font-size:16px;  letter-spacing:1px; margin-bottom:12px; line-height:20px;  padding:3px; font-weight:bold;}

.style05 li:nth-child(1){ background-color:#C48485; }
.style05 li:nth-child(2){ background-color:#55A8FF; }
.style05 li:nth-child(3){ background-color:#000000;}
.style05 li:nth-child(4){ background-color:#dddddd;}
.style05 li:nth-child(5){ background-color:#001DFF;}


footer{ width:100%; height:40px; background-color:#000000; color:#FFF; text-align:center; line-height:40px;}

.footer p{ color:#FFF}