@charset "UTF-8";
/* --------------------------------------------------
	トップページ
-------------------------------------------------- */

/* --------------------------------------------------
	.intro
-------------------------------------------------- */
.intro {
	padding: 20.3125% 0 18.125%;
	background-image: url("../img/intro_bg1.png"), url("../img/intro_bg2.png");
	background-position: right top, left bottom;
	background-repeat: no-repeat;
	background-size: 35.3125% auto, 26.5625% auto;
}
.intro h1 {
	margin: 0 0 48px 48px;
	width: 78.75%;
}
.intro p {
	font-size: 28px;
	text-align: center;
}
@media screen and (max-width: 640px) {
	.intro h1 { margin: 0 0 7.5vw 7.5vw; }
	.intro p { font-size: 4.375vw; }
}

/* --------------------------------------------------
	.map
-------------------------------------------------- */
.map { padding: 0 0 18.125%; }
.map .map-canvas {
	margin: 0 0 48px;
	width: 640px;
	height: 400px;
}
.map .map-canvas iframe {
	width: 100%;
	height: 100%;
}
.map h2 {
	margin-bottom: 16px;
	font-size: 32px;
	line-height: 1;
	text-align: center;
}
.map p {
	font-weight: bold;
	text-align: center;
	letter-spacing: 0;
}
@media screen and (max-width: 640px) {
	.map .map-canvas {
		margin: 0 0 7.5vw;
		width: 100vw;
		height: 62.5vw;
	}
	.map h2 {
		margin-bottom: 2.5vw;
		font-size: 5vw;
	}
}

/* --------------------------------------------------
	.story
-------------------------------------------------- */
.story {
	padding: 18.4375% 0 67.1875%;
	background: #3A3A3A url("../img/story_bg.jpg") no-repeat left bottom;
	background-size: 100% auto;
}
.story h2 {
	margin: 0 auto 58px;
	width: 28.125%;
}
.story p {
	margin: 0 auto;
	width: 84.375%;
	line-height: 1.85;
	color: #fff;
}
@media screen and (max-width: 640px) {
	.story h2 { margin-bottom: 9.0625vw; }
}

/* --------------------------------------------------
	.facebook
-------------------------------------------------- */
.facebook {
	padding: 15.625% 0;
	background: #CCE2CC;
}
.facebook h2 {
	margin: 0 auto 56px;
	width: 47.1875%;
}
.facebook p {
	margin-bottom: 25px;
	font-size: 36px;
	line-height: 1.4;
	text-align: center;
}
.facebook .facebook-base {
	margin: 0 auto;
	width: 500px;
}
.facebook .facebook-base iframe {
	width: 100%;
	height: 100%;
}
@media screen and (max-width: 640px) {
	.facebook h2 { margin-bottom: 8.75vw; }
	.facebook p {
		margin-bottom: 3.9063vw;
		font-size: 5.625vw;
	}
	.facebook .facebook-base { width: 78.125vw; }
}

/* --------------------------------------------------
	.concept
-------------------------------------------------- */
.concept {
	padding: 18.75% 0 9.0625%;
	background-image: url("../img/concept_bg1.png"), url("../img/concept_bg2.png");
	background-position: right top, left 64px;
	background-repeat: no-repeat;
	background-size: 25.7813% auto, 21.875% auto;
}
.concept h2 {
	margin: 0 auto 54px;
	width: 40.625%;
}
.concept h3 {
	margin-bottom: 26px;
	font-size: 38px;
	font-weight: normal;
	line-height: 1;
	text-align: center;
}
.concept .subBox + .subBox { margin-top: 54px; }
.concept .subBox .pic { margin-bottom: 26px; }
.concept .subBox h4 {
	margin: 0 7.8125% 16px;
	font-size: 32px;
	font-weight: normal;
	line-height: 1;
	color: #5E603E;
}
.concept .subBox p { margin: 0 7.8125%; }
@media screen and (max-width: 640px) {
	.concept { background-position: right top, left 10vw; }
	.concept h2 { margin-bottom: 8.4375vw; }
	.concept h3 {
		margin-bottom: 4.0625vw;
		font-size: 5.9375vw;
	}
	.concept .subBox + .subBox { margin-top: 8.4375vw; }
	.concept .subBox .pic { margin-bottom: 4.0625vw; }
	.concept .subBox h4 {
		margin-bottom: 2.5vw;
		font-size: 5vw;
	}
}

/* --------------------------------------------------
	.supporter
-------------------------------------------------- */
.supporter {
	position: relative;
	margin: 0 0 214px;
	padding: 0 0 17.1875%;
	background: #D6EAD6;
}
.supporter .pic { margin-bottom: 112px; }
.supporter h2 {
	margin-bottom: 40px;
	font-size: 38px;
	font-weight: normal;
	line-height: 1.36;
	color: #5E603E;
	text-align: center;
}
.supporter p {
	margin: 0 auto;
	width: 84.375%;
	font-size: 28px;
	line-height: 1.85;
	text-align: center;
}
.supporter p a {
	font-weight: bold;
	color: #AA4949;
}
.supporter .illust {
	position: absolute;
	right: 11.5625%;
	bottom: -146px;
	width: 40%;
}
@media screen and (max-width: 640px) {
	.supporter { margin-bottom: 33.4375vw; }
	.supporter .pic { margin-bottom: 17.5vw; }
	.supporter h2 {
		margin-bottom: 6.25vw;
		font-size: 5.9375vw;
	}
	.supporter p { font-size: 4.375vw; }
	.supporter .illust { bottom: -22.8125vw; }
}

/* --------------------------------------------------
	.overlay
-------------------------------------------------- */
.overlay {
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 100;
	width: 100%;
	height: 100%;
	background: rgba(65,65,68,0.8);
}

/* --------------------------------------------------
	#privacypolicy
-------------------------------------------------- */
#privacypolicy {
	display: none;
	position: absolute;
	left: 50%;
	top: 50px;
	z-index: 101;
	transform: translate(-50%,0);
	padding-bottom: 50px;
}
#privacypolicy article {
	width: 560px;
	background: #FFF;
}
#privacypolicy .btn-close {
	position: absolute;
	right: 0;
	top: 0;
	width: 50px;
	height: 50px;
	background: url("../img/btn_close.png") no-repeat;
	background-size: contain;
	cursor: pointer;
	text-indent: -9999px;
	transition: 0.2s linear;
}
#privacypolicy .btn-close:hover { opacity: 0.7; }
#privacypolicy section {
	margin: 0 auto;
	padding: 14.2858% 0 17.1429%;
	width: 82.1429%;
}
#privacypolicy h2 {
	margin-bottom: 30px;
	font-size: 38px;
	font-weight: normal;
	color: #558E55;
	line-height: 1;
}
#privacypolicy p {
	margin-bottom: 60px;
	font-size: 30px;
	line-height: 1.75;
}
#privacypolicy dt,
#privacypolicy dd {
	font-family: "新ゴ R", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#privacypolicy dt {
	margin-bottom: 20px;
	padding: 6px 14px;
	background: #9DC19D;
	font-weight: bold;
	line-height: 1;
	color: #fff;
}
#privacypolicy dd + dt { margin-top: 46px; }
@media screen and (max-width: 640px) {
	#privacypolicy article { width: 87.5vw; }
	#privacypolicy .btn-close {
		width: 7.8125vw;
		height: 7.8125vw;
	}
	#privacypolicy h2 {
		margin-bottom: 4.6875vw;
		font-size: 5.9375vw;
	}
	#privacypolicy p {
		margin-bottom: 9.375vw;
		font-size: 4.6875vw;
	}
	#privacypolicy dt {
		margin-bottom: 3.125vw;
		padding: 0.9375vw 2.1875vw;
	}
	#privacypolicy dd + dt { margin-top: 7.1875vw; }
}