@charset "utf-8";
*{ margin:0; padding:0;}
html {height: 100%;}
body { font:12px/1.5 Arial; color:#000; background:#EDEDED;font-family:microsoft yahei;}
ul,li{ list-style:none;}
a{ color:#666; text-decoration:none;}
a:hover{ text-decoration:none; color:#000;}
img{border:0 none;}

main{height:100%;overflow:hidden;overflow-y:auto;}

h1{text-align:center;font-size:30px;padding:40px 0;color:#000;}
h1 a{color:#f00;display:inline-block;margin-left:20px;}

#waterfall{width:1500px; margin:0 auto 30px auto;overflow:hidden;}
.cell{padding:0px;width:250px;float:left;height:216px}
.cell img{width:100%;height:auto;}
.cell a{display:block;background:#fff;box-shadow:3px 3px 5px #eee;border-radius:5px;height:200px;margin:8px;cursor:pointer;line-height:20px;transition:all .3s;position:relative;}
.cell h3{font-size:17px;color:#000;padding:15px 15px 10px 15px;margin:0;}
.cell p{color:#444;font-size:14px;padding:0 15px 8px 15px;line-height:20px;text-align:left;}
.cell a:hover{background-color:#f5f5f5;margin-top:0px;}
.cell a:hover h3{color:#f00}
.cell .tui{display:block;width:24px;height:24px;background:url(imgs/tui1.png) no-repeat center;background-size:24px 24px;
	border-radius:50%;position:absolute;right:10px;bottom:10px;}
.cell .tui1{background-image:url(imgs/tui1.png);}
.cell .tui2{background-image:url(imgs/tui2.png);}
.cell .tui3{background-image:url(imgs/tui3.png);}

#waterfall2{display:none;}

.wpitem{width:250px;}


.tptags{position: absolute;z-index: 1000;transition: all .3s;}
.tptags .con{background-color: rgba(0, 0, 0, .8);border-radius: 3px;padding:10px;color:#fff;font-size:12px;line-height: 20px;}
.tptags .jte{text-align: center;overflow: hidden;}
.tptags .jte i{display: block;margin:0 auto;width:0;height:0;border-left:solid 5px transparent;border-right:solid 5px transparent;border-top:solid 5px rgba(0, 0, 0, .8);}


body {
	background-image: url(bg.jpg);
	background-size: cover;
	background-position: 50% 0;
	height: 100%;overflow-x:hidden;
}

@media (max-width:1500px){
	#waterfall{width:100%;}
	#waterbox{padding:0 5px;}
	.cell{width:16.66%;height:212px;}
	.cell a{margin:6px;}
}
@media (max-width:1440px){
	.cell{width:20%;height:220px;}
	.cell a{height:208px;}	
}
@media (max-width:1024px){
	.cell{width:25%;height:210px;}
	.cell a{height:198px;}
}
@media (max-width:768px){
	.cell{width:33.33%;height:200px;}
	.cell a{height:188px;}	
	.cell h3{font-size:16px;padding:10px;}	
	.cell p{padding:0 10px;font-size:13px;}
	
}
@media (max-width:426px){
	h1{padding:25px 0;}
	.cell{width:50%;height:185px;}	
	.cell a{margin:5px;height:170px;}
	.cell p{font-size:12px;line-height:18px;}
	.cell h3{font-size:14px;padding-bottom:6px;}
	
}
@media (max-width:320px){
	
}


