@charset "UTF-8";

#wrapper{
	background:url("../../images/paper.jpg") center top ;
}

#cast h1,
#staff h1{
	margin:0 auto 40px auto;
}
#cast{
	padding:60px 0 0 0;
	max-width:1005px;
	margin:0 auto;
}
#cast table{
	min-height:600px;
}
#cast table td{
	width:33.33%;
	vertical-align: top;
	line-height:1em !important;
}

#cast table td img{
	width:100%;
	margin:0;
	line-height:1em;
	border:0;
}
#cast table tr:first-child td:nth-child(2),
#cast table tr:first-child td:nth-child(3){
	height:330px !important;
}

@media screen and (max-width: 980px) and (min-width: 641px) {
	
	#cast h1,
	#staff h1{
		margin:40px auto 40px auto;
	}
	#cast table{
	min-height:400px;
	}
	
	#cast table tr:first-child td:nth-child(2),
	#cast table tr:first-child td:nth-child(3){
	height:30vW !important;
	}
	
	
}
@media screen and (max-width: 640px) {
	#wrapper{
		padding:25% 0 0 0;
	}
	#cast h1,
	#staff h1{
	margin:0 auto 16% auto;
	}
	#cast{
	padding:0px 0 20% 0;
	margin:0 auto;
	}
	#cast table{
		min-height:100vH;
	}
	#cast table td{
	width:90%;
	margin:0 auto;
	max-widht:310px;
	text-align:center;
	vertical-align: top;
	line-height:1em !important;
	float:none;
	display:block;
	}
	#cast table td img{
	width:100%;
	margin:0;
	line-height:1em;
	border:0;
	}
	#cast table tr:first-child td:nth-child(2),
	#cast table tr:first-child td:nth-child(3){
	height:auto !important;
	}
}

#staff{
	padding:60px 0 100px 0;
	max-width:1005px;
	margin:0 auto;
}
#staffContents{
	max-width:950px;
	padding:10px;
	margin:5px auto;
	background:rgba(219,211,199,1.00);
	
	-moz-box-shadow: 1px 2px 5px rgba(0,0,0,0.3);
	-webkit-box-shadow:1px 2px 5px rgba(0,0,0,0.3);
	box-shadow: 1px 2px 5px rgba(0,0,0,0.3);
}
#staffProf{
	width:35%;
	height:100%;
	min-height:450px;
	
	float:left;
	background:#303c3b;
}
#staffTxt{
	width:65%;
	float:left;
	padding:10px 10px 10px 30px;
}
#staffProf img{
	width:100%;
}
#staffTxt h3{
	width:270px;
	margin:30px auto;
}

@media screen and (max-width: 980px) and (min-width: 641px) {
	#staffProf{
	min-height:550px;
	}
}
@media screen and (max-width: 640px){
	#staff{
	padding:10% 0  ;
	max-width:100%;
	margin:0 auto;
	}
	#staffContents{
	max-width:90%;
	padding:10px;
	margin:0 auto 10% auto;
	background:rgba(219,211,199,1.00);
	-moz-box-shadow: 1px 2px 5px rgba(0,0,0,0.3);
	-webkit-box-shadow:1px 2px 5px rgba(0,0,0,0.3);
	box-shadow: 1px 2px 5px rgba(0,0,0,0.3);
	}
	#staffProf{
	width:100%;
	float:none;
	background:#303c3b;
	}
	#staffTxt{
	width:100%;
	float:none;
	padding:12px 12px 20px 12px;
	}
	#staffProf img{
	width:100%;
	}
	#staffTxt h3{
	width:240px;
	margin:30px auto;
	}
}


.modal{
	width:90%;
	height:70vH;
	margin:5px auto;
	background:url(../../images/modal_bg.png) center top no-repeat;
	background-size:100% 100%;
	position:relative;
	padding:30px 50px;
}
.modal h3{
	font-weight:700;
	font-size:32px;
	color:#485756;
}
.modal h3 .yaku{
	font-weight:700;
	font-size:22px;
	color:#c18327;
}
.modal h4{
	font-weight:700;
	font-size:22px;
	margin-bottom:30px;
	color:#485756;
}
.modal h4 .yaku{
	font-weight:700;
	font-size:16px;
	color:#c18327;
}
.modal p{
	letter-spacing:0.5px;
	font-size:15px;
	line-height:1.57em;
}

@media screen and (max-width: 640px){
	.modal{
	width:100%;
	height:100%;
	margin:5px auto;
	background:url(../../images/modal_bg2.png) center top no-repeat;
	background-size:100% 100%;
	position:relative;
	padding:25px 20px;
	}
	.modal h3{
	font-weight:700;
	font-size:22px;
	line-height:22px;
	color:#485756;
	}
	.modal h3 .yaku{
	font-weight:700;
	font-size:13px;
	color:#c18327;
		display:block;
	}
	.modal h4{
	font-weight:700;
	font-size:14px;
	margin-bottom:30px;
	color:#485756;
	}
	.modal h4 .yaku{
	font-weight:700;
	font-size:12px;
	color:#c18327;
	}
	.modal p{
	letter-spacing:0.5px;
	font-size:14px;
	line-height:1.57em;
	height:78%;
	overflow:scroll;
	}
	
}