.contanir{
	width: 500px;
	height: 300px;
	position: relative;
	background-image: url(0002.jpg);

	
}

.mask{
	width: 350px;
	height: 130px;
	position: absolute;
	
	background-image: url(0001.jpg);
	background-size: 800px 400px;
	
	-webkit-shape-image-threshold: 0.1;
	-webkit-mask-image: url(hosi.png);

	-webkit-animation-name: ani-hosi;
	-webkit-animation-duration: 2.2s;
	-webkit-animation-delay: 0s;
	-webkit-animation-direction: normal;
	-webkit-animation-iteration-count: infinite;
	-webkit-transform: translate3d(160px, 40px, 0px);
}


@-webkit-keyframes ani-hosi {
	0%{
		background-position: 0px 0px;
		-webkit-transform: translate3d(0px, 0px, 0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
	}
	50%{
		background-position: 200px 200px;
		-webkit-transform: translate3d(100px, 100px, 0px) rotateX(0deg) rotateY(0deg) rotateZ(90deg);
	}

	100%{
		background-position: 0px 0px;
		-webkit-transform: translate3d(0px, 0px, 0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
	}
}