/* 代码整理：xm_科技  */
*{padding:0;margin:0;}
body{
	position:relative;
	background:#0cc;
	overflow:hidden;
}
.land{
	height:100px;
	width:100%;
	position:absolute;
	top:270px;
	background:#afa;
}
.land_01{
	width:0;
	height:0;
	border-left:300px solid transparent;
	border-bottom:120px solid #afa;
	position:absolute;
	left:0px;
	top:-120px;
}
.land_01:after{
	content:"";
	width:0;
	height:0;
	border-right:150px solid transparent;
	border-bottom:120px solid #afa;
	position:absolute;
}
.land_02{
	width:0;
	height:0;
	border-left:300px solid transparent;
	border-bottom:100px solid #afa;
	position:absolute;
	left:150px;
	top:-100px;
}
.land_02:after{
	content:"";
	width:0;
	height:0;
	border-right:350px solid transparent;
	border-bottom:100px solid #afa;
	position:absolute;
	left:0px;
}
.land_03{
	width:0;
	height:0;
	border-left:200px solid transparent;
	border-bottom:20px solid #afa;
	position:absolute;
	left:700px;
	top:-20px;
}
.land_03:after{
	content:"";
	width:0;
	height:0;
	border-right:150px solid transparent;
	border-bottom:20px solid #afa;
	position:absolute;
	left:0px;
}
.land_04{
	width:0;
	height:0;
	border-left:200px solid transparent;
	border-bottom:50px solid #afa;
	position:absolute;
	left:1000px;
	top:-50px;
}
.land_04:after{
	content:"";
	width:0;
	height:0;
	border-right:150px solid transparent;
	border-bottom:50px solid #afa;
	position:absolute;
	left:0px;
}
.ship{
	position:absolute;
	width:400px;
	height:370px;
	top:100px;
	left:0%;
	animation:boat 20s infinite;
	-webkit-animation:boat 20s infinite;
}
.ship_01{
	width:0;
	height:0;
	border-left:150px solid transparent;
	border-bottom:300px solid #ff5d89;
	position:absolute;
	left:140px;
}
.ship_01:before{
	content:"";
	width:0px;
	height:0px;
	border-left:80px solid transparent;
	border-bottom:180px solid #FF5D89;
	position:absolute;
	left:-275px;
	top:120px;
}
.ship_02{
	width:250px;
	height:40px;
	background:#ff5d89;
	position:absolute;
	top:300px;
	left:100px;
}
.ship_02:before,.ship_02:after{
	content:"";
	width:0;
	height:0;
	border-top:40px solid #ff5d89;
	position:absolute;
	
}
.ship_02:before{border-left:40px solid transparent;left:-40px;}
.ship_02:after{border-right:40px solid transparent;right:-40px;}
.ship_03{
	width:0;
	height:0;
	border-right:90px solid transparent;
	border-bottom:280px solid #ff5d89;
	position:absolute;
	left:300px;
	top:20px
}
.ship_03:before{
	content:"";
	width:0px;
	height:0px;
	border-right:90px solid transparent;
	border-bottom:25px solid #0cc;
	position:absolute;
	top:255px;
}
@keyframes boat{
	0%{left:0%;}
	100%{left:90%;}
}
@-webkit-keyframes boat{
	0%{left:0%;}
	100%{left:90%;}
}