@charset "UTF-8";

/* movie */
#wrapper {
	color: #393939;
	background: #fff;
}

.logo {
	margin: 0 auto 20px;
	padding: 46px 0;
	text-align: center;
	background: #d6235a;
}
.tophome {
	width: 203px;
	position: absolute;
	top: 20px;
	left: 20px;
}
h1 {
	margin: 0 auto 80px;
	font-size: 0;
	text-align: center;
}
#contents{
	margin: 0 auto;
	padding: 0 40px;
	width: 800px;
	text-align: center;
	position: relative;
	z-index: 1;
}

.block {
	margin: 0 auto 60px;
	padding: 40px 50px 30px;
	width: 700px;
	background: url(../../img/bg_repeat.jpg) top center;
	box-shadow: 8px 6px 18px rgba(0,0,0,0.3);
}
.block .name {
	margin: 0 auto 24px;
	padding: 0 0 28px;
	text-align: center;
	border-bottom: solid 1px #e94587;
}
.btmhome {
	margin: 0 auto 50px;
	width: 203px;
}


@media only screen and (max-width:800px){
	.logo {
		margin: 0 auto 4%;
		padding: 5% 16%;
	}
	.tophome {
		margin: 0 auto 6%;
		width: 40%;
		text-align: center;
		position: static;
	}
	h1 {
		margin: 0 auto 10%;
		width: 92%;
		font-size: 0;
	}
	#contents{
		margin: 0 auto;
		padding: 0 4%;
		width: auto;
		position: relative;
		z-index: 1;
	}

	h2 {
		margin: 0 auto 4%;
		padding: 4% 0;
		font-size: 15px;
	}
	.block {
		margin: 0 auto 8%;
		padding: 5% 5% 4%;
		width: 90%;
		text-align: left;
	}
	.block .name {
		margin: 0 auto 12px;
		padding: 0 0 14px;
	}
	#comment1 .name img {
		max-width: 27%;
	}
	#comment2 .name img {
		max-width: 27%;
	}
	#comment3 .name img {
		max-width: 39%;
	}
	#comment4 .name img {
		max-width: 39%;
	}
	#comment5 .name img {
		max-width: 26%;
	}
	#comment6 .name img {
		max-width: 27%;
	}
	#comment7 .name img {
		max-width: 38%;
	}
	#comment8 .name img {
		max-width: 13%;
	}
	#comment9 .name img {
		max-width: 21%;
	}
	#comment10 .name img {
		max-width: 26%;
	}
	#comment11 .name img {
		max-width: 26%;
	}
	
	.btmhome {
		margin: 0 auto 6%;
		width: 40%;
		text-align: center;
	}
	
}