@charset "utf-8";
/* CSS Document */
/* 人物CSS特效 */


@-webkit-keyframes 'fadeIn' {
0%{
	right:-250px;
	opacity: 1;
	background:url(../images/mons001b.png);
	float:right;
}
20%	{opacity: 0.5;}
100%{opacity: 1;}
}

.anim01 {
	-webkit-animation-name: 'fadeIn';
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-iteration-count: 1;

	position:absolute;
	top:35px;
	right:-165px;
	/*right:-135px;*/
	width:218px;
	height:282px;
	background:url(../images/mons001.png);
	z-index:1;
}

@-webkit-keyframes 'fadeIn02' {
0%{
	right:-250px;
	opacity: 1;
	background:url(../images/mons002b.png);
	float:right;
}
20%	{opacity: 0.7;}
100%{opacity: 5;}
}

.anim02 {
	-webkit-animation-name: 'fadeIn02';
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-iteration-count: 1;
	
	position:absolute;
	top:170px;
	right:-230px;
	/*right:-190px;*/
	width:240px;
	height:214px;
	background:url(../images/mons002.png);
	z-index:2;
}

@-webkit-keyframes 'fadeIn03' {
0%{
	right:-200px;
	opacity: 1;
	background:url(../images/mons003b.png);
}
20%	{opacity: 0.9;}
100%{opacity: 1;}
}

.anim03 {
	-webkit-animation-name: 'fadeIn03';
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-iteration-count: 1;

	position:absolute;
	top:230px;
	right:-240px;
	/*right:-150px;*/
	width:368px;
	height:351px;
	background:url(../images/mons003.png);
	float:right;
	z-index:3;
}



@-webkit-keyframes 'fadeIn04' {
0%{
	right:600px;
	opacity: 1;
	background:url(../images/mons004b.png);
	float:left;
}
20%	{opacity: 0.9;}
100%{opacity: 1;}
}

.anim04 {
	-webkit-animation-name: 'fadeIn04';
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-iteration-count: 1;

	position:absolute;
	top:295px;
	/*top:310px;*/
	right:720px;
	/*right:460px;*/
	width:297px;
	height:273px;
	background:url(../images/mons004.png);
	z-index:4;
}

@-webkit-keyframes 'fadeIn05' {
0%{
	right:600px;
	opacity: 1;
	background:url(../images/mons005b.png);
	float:left;
}
20%	{opacity: 0.9;}
100%{opacity: 1;}
}

.anim05 {
	-webkit-animation-name: 'fadeIn05';
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-iteration-count: 1;

	position:absolute;
	top:570px;
	right:930px;
	width:330px;
	height:286px;
	background:url(../images/mons005.png);
	z-index:5;
}