@charset "UTF-8";
/* CSS Document */

img {
	width: 100%;
	vertical-align: bottom;  /*縦方向の揃え位置指定*/
	}
	
.all-wrap {
	background-image: url("../img/bg.jpg");
	background-repeat: repeat;
	background-size: contain;
	background-position: 0 0;
	-webkit-animation: bgroop 50s linear infinite;
	animation: bgroop 50s linear infinite;
}

.contents {
	max-width: 640px;
	margin: auto;
}

.mb2e {margin-bottom: 2em;}


/*コンテンツ*/

.fv {position: relative;}

.btn01 {
	width:90%;
	position: absolute;
	bottom: 5.2%;
	right: 0;
	left: 0;
	margin: auto;
	animation: mocchiri 2.5s infinite;
}

.movie {
	background-color: #000000;
}

.game-system {position: relative;}

.btn02 {
	width:90%;
	position: absolute;
	bottom: 3.6%;
	right: 0;
	left: 0;
	margin: auto;
	animation: mocchiri 2.5s infinite;
}

.character {position: relative;}

.btn03 {
	width:90%;
	position: absolute;
	bottom: 1.45%;
	right: 0;
	left: 0;
	margin: auto;
	animation: mocchiri 2.5s infinite;
}

.kaname,.hiyori,.runa,.ayame,.jun {position: relative;}

.voice-btn {
	width:30%;
	position: absolute;
	top: 38%;
	left: 3%;
}

/*アニメーション*/

@keyframes mocchiri {
	0% {
		transform: scale(1, 0.8);
	}
	20% {
		transform: scale(0.8, 1.1);
	}
	95% {
		transform: scale(1, 1);
	}
	100% {
		transform: scale(1, 0.8);
	}
}

@-webkit-keyframes bgroop {
    from {
        background-position: 0  0;
    }
    to {
        background-position: 1920px 1080px;
    }
}
@keyframes bgroop {
    from {
        background-position: 0 0;
    }
    to {
        background-position: 1920px 1080px;
    }
}