@charset "UTF-8";
/*-----------------------------------------------------------*/
/*---------------------------about-------------------------*/
/*-----------------------------------------------------------*/

section{
	width:100%;
	max-width:1100px;
	margin:0 auto;
}
#welcome{
	background:url("../images/about/dartsimg.png") no-repeat right top ;
	height:753px;
}
#welcome .l_contents{
	padding-top:7em;
	padding-left:2em;
	box-sizing:border-box;
}
img.subtitle{
	width:100%;
}
#foodcomment{
	background:url("../images/about/img01.jpg") no-repeat right top;
	height:498px;

}
#foodcomment .l_contents{
	padding-top:4em;
	padding-left:2em;
	box-sizing:border-box;
}
#drinkcomment{
	background:url("../images/about/drinkimg.png") no-repeat left top;
	height:644px;
}
#drinkcomment .r_contents{
	padding-top:7em;
	padding-right:2em;
	box-sizing:border-box;
}
#coursecomment{
	background:url("../images/about/img02.jpg") no-repeat right top;
	height:500px;
}
#coursecomment .c_contents{
	padding-top:5em;
	box-sizing:border-box;
}
#playcomment{
	background:url("../images/about/img03.jpg") no-repeat right top;
	height:500px;
}
#playcomment .c_contents{
	padding-top:7em;
	box-sizing:border-box;
	color:red;
}
#playcomment .c_contents h3,#playcomment .c_contents p{
	//padding-bottom:1em;
	text-shadow:1px 1px 5px rgba(0,0,0,0.8);
}
/* ************************レスポンシブスタイル****************** */
@media screen and (max-width:680px){
	#welcome{
		background:url("../images/about/dartsimg.png") no-repeat center top;
		background-size:70%;
		height:auto;
		padding-bottom:3em;
		padding-top:3em;
	}
	#welcome .l_contents{
		padding-top:0;
		padding-left:0;
		box-sizing:border-box;
		width:100%;
		margin:0 auto;
	}
	#welcome img.subtitle{
		width:90%;
		text-align:center;
	}
	#welcome .subcomment{
		background:rgba(255,255,255,0.2);
		padding:2em 0;
		box-sizing:border-box;
		width:80%;
		margin:0 auto;
		text-shadow:0.1em 0.1em 0 rgba(0,0,0,0.8);
	}
	#foodcomment{
		background:url("../images/about/img01.jpg") no-repeat center top;
		background-size:cover;
		height:auto;
		padding-bottom:3em;
		padding-top:3em;

	}
	#foodcomment .l_contents{
		padding-top:0;
		padding-left:0;
		box-sizing:border-box;
		width:100%;
		margin:0 auto;
	}
	#foodcomment .subtitle{
		//width:90%;
		text-align:center;
	}
	#foodcomment .subcomment{
		background:rgba(255,255,255,0.2);
		padding:2em 0;
		box-sizing:border-box;
		width:80%;
		margin:0 auto;
	}
	#drinkcomment{
		background:url("../images/about/drinkimg.png") no-repeat center top;
		background-size:cover;
		height:auto;
		padding-bottom:3em;
		padding-top:3em;

	}
	#drinkcomment .r_contents{
		padding-top:0;
		padding-left:0;
		box-sizing:border-box;
		width:100%;
		margin:0 auto;
	}
	#drinkcomment .subtitle{
		//width:90%;
		text-align:center;
	}
	#drinkcomment .subcomment{
		background:rgba(0,0,0,0.5);
		padding:2em 0;
		box-sizing:border-box;
		width:80%;
		margin:0 auto;
		text-shadow:0.1em 0.1em 0 rgba(0,0,0,0.8);
	}
	#coursecomment{
		background:url("../images/about/img02.jpg") no-repeat center top;
		background-size:cover;
		height:auto;
		padding-bottom:3em;
		padding-top:3em;

	}
	#coursecomment .c_contents{
		padding-top:0;
		padding-left:0;
		box-sizing:border-box;
		width:100%;
		margin:0 auto;
	}
	#coursecomment .subtitle{
		//width:90%;
		text-align:center;
	}
	#coursecomment .subcomment{
		background:rgba(255,255,255,0.5);
		padding:2em 0;
		box-sizing:border-box;
		width:80%;
		margin:0 auto;
	}
	#playcomment{
		background:url("../images/about/img03.jpg") no-repeat center top;
		background-size:cover;
		height:auto;
		padding-bottom:3em;
		padding-top:3em;

	}
	#playcomment .c_contents{
		padding-top:0;
		padding-left:0;
		box-sizing:border-box;
		width:100%;
		margin:0 auto;
	}
	#playcomment .subtitle{
		//width:90%;
		text-align:center;
	}
	#playcomment .subcomment{
		background:rgba(0,0,0,0.5);
	    padding: 2em 0;
	    box-sizing: border-box;
	    width: 80%;
	    margin: 0 auto;
	}
	#playcomment .c_contents p{
		padding-bottom:2em;
	}
}