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

body{
	margin: 0;
	padding: 0;
	color: #ffffff;
	font-family: 'しっぽり明朝', serif;
}

.body{
	padding-top: 35px;
}

.back{
	background-image: url("image/back000.png");
	width: 375px;
	height: 5035px;
	background-size: contain;
	background-repeat: no-repeat;
}
.name{
	padding-left: 114px;
	padding-top: 69px;
}

.name p{
	color: #FFFFFF;
	font-style: italic;
	font-variant: normal;
	font-size: small;
	text-shadow: 4px 4px 4px #FFFFFF;
	margin-bottom: -19px;
	text-indent: -12px;
}

.name h1{
	font-size: xx-large;
	color: #F6F6F6;
	font-style: italic;
	text-indent: 56px;
	text-shadow: 4px 4px 9px #FFFFFF;
	opacity: 1;
}

.name h2{
	margin-top: 75px;
	font-weight: 800;
	font-variant: normal;
	font-style: italic;
	font-family: "Comic Sans MS", cursive;
	text-shadow: 3px 2px 4px #000000;
	text-indent: -313px;
}


h1{
	font-size: large;
	
}

h2{
	font-size: large;
}

h4{
	font-size: xx-large;
	margin-bottom: -10px;
	text-shadow: 5px 5px 11px #FFF6D0;
}

p{
	font-size: small;
}

div{
	text-align: center;
}

.image002{
	width: 270px;
	margin-top: 11px;
	margin-bottom: 12px;
}

.image003{
	width: 270px;
	margin-right: 87px;
	margin-bottom: -20px;
	margin-top: -45px;
}

.image004{
	width: 270px;
	margin-left: 63px;
	margin-bottom: -19px;
}




.star001{
	width: 80px;
	margin-top: -10px;
	margin-bottom: -10px;
}

.star002{
	width: 80px;
	margin-top: -10px;
	margin-bottom: -10px;
}

.review_star{
	width: 100px;
}

.content1{
}

.content2{
	margin-bottom: 62px;
	margin-top: 43px;
}

.content3{
	margin-top: 100px;
}

.content4{
	margin-top: 96px;
	padding-top: 0px;
}

.review{
}

.review1{
	margin-top: 45px;
}

.review2{
	margin-top: 30px;		
}

.flex{
	display: flex;
	justify-content: space-around;
	align-items: center;
	margin-left: 54px;
	margin-right: 53px;
}

.frame{
	width: 330px;
}

.moon_box{
	margin-top: 30px;
	margin-bottom: 30px;
}

.motion{
	width: 200px;
	margin-bottom: -7px;
}

.image{
	width: 250px;	
}


.girl{
	width: 130px;
	
}

.moon{
	opacity: 1;
    transform: translateY(-16px);
}

.moon{
	width: 150px;
	transition: opacity 1.5s, transform 1s;
}
 

.ireko02{
	position: absolute;
	top: auto;
	margin-top: -206px;
}

.review1{
	position: absolute;
	margin-top: 11px;
	margin-left: 21px;
}

.ireko04{
	position: absolute;
	top: auto;
	margin-left: 0px;
	margin-top: -206px;
}

.review2{
	position: absolute;
	margin-top: 269px;
	margin-left: 22px;
}

.flex p{
	font-size: x-small;
	text-indent: 18px;
}

.button00{
	margin-top: 589px;
}

.button{
	display: block;
	width: 300px;
	color: #FFFFFF;
	padding-top: 10px;
	margin: auto;
	text-decoration: none;
	text-align: center;
	border: 1px #FFFFFF solid;
	padding-bottom: 10px;
	padding-right: 0px;
}


.tower{
	width: 375px;
	margin-top: 87px;
}

.animation{
	opacity: 0;
    -webkit-transform: translate3d(0, 50%, 0); 
    transform: translate3d(0, 50%, 0);
    -webkit-transition: all 1s ease; 
    transition: all 1s ease;
}
 
.animation.active{
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0); 
    transform: translate3d(0, 0, 0);
}