@charset "utf-8";
/* PC ================================================== */
@media all and (min-width:960px){
#tofuro {
	width: 100%;
	height: auto;
	padding: 220px 0px 0px;
	background-color: #FAF9F2;
}
	.tofuro--inner {
		width: 100%;
		margin: auto auto;
		padding-bottom: 40px;
	}
		.tofuro-main {
			width: 90%;
			margin: auto auto 55px;
		}
			.tofuro-txt {
				width: 620px;
				height: auto;
				margin: auto auto -115px;
				position: relative;
				z-index: 2;
				transition-delay: 0.8s !important;
				-webkit-transition-delay: 0.8s !important;
			}
				.tofuro-txt img {
					width: 100%;
					height: auto;
					margin: auto auto 40px;
				}
				.tofuro-txt p {
					width: 100%;
					font-size: 16px;
					text-align: center;
					line-height: 2.0;
				}
			.tofuro-image {
				width: 100%;
				max-width: 1500px;
				height: auto;
				margin: auto auto;
			}
				.tofuro-image img {
					width: 100%;
					height: auto;
				}
.content--area {
	width: 100%;

}
	.content-inner {
		width: 100%;
		max-width:1000px;
		margin: 0 auto;
		display: grid;
		grid-template-columns: 1fr 1fr;
		column-gap: 60px;
	}
		.content {
			width:468px;
		}
			.content img {
				width: 100%;
			}
			.ttl {
				font-size: 20px;
				color:#7B5700;
				line-height: 1.5;
				margin: 10px auto;
			}
			.txt {
				font-size: 14px;
				color: #4E3B30;
			}
			.place {
				font-size: 20px;
				margin: 10px auto 40px;
			}
			.place span {
				display: inline-block;
				padding:0 3px;
				font-size: 42px;
			}
.seasons {
	width: 100%;
	margin: 0 auto 150px;
}
	.seasons-ttl {
		font-size: 24px;
		text-align: center;
		margin: 20px auto;
	}
		.seasons-img-area {
			width: 100%;
			max-width: 1000px;
			margin: 0 auto;

		}
		.roopslider {
			display: flex;
			justify-content: center;
		}
		.roopslider li img {
			width: 325px;
			height: auto;
		}
		.roopslider li:not(:first-child) {
			margin-left: 9px;
		}
.hr {
	display: block;
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	color: #D6D4C3;
}
.tofuro-bi-top {
	width: 100%;
	max-width: 1000px;
	margin: 40px auto;
	display: flex;
	justify-content:space-between;
	align-items: center;
}
	.tofuro-bi-ttl {
		font-size: 32px;
		color:#7B5700;
	}
	.tofuro-bi-top img {
		width:146px;
		height: 146px;
	}
	.tofuro-bi-content {
		width: 100%;
		max-width: 1000px;
		margin: 40px auto 60px;
	}
	.po-re {
		position: relative;
	}
	.alt-txt {
		display: inline-block;
		padding: 5px 12px;
		font-size: 14px;
		color: #fff;
		position: absolute;
		bottom: 0;
		right: 0;
		text-shadow: 1px 1px 3px #000;
	}
	.desc {
		position: absolute;
		top: 30px;
		right: -245px;
		color:#4E3B30;
		font-size: 14px;
		text-decoration: underline;
	}
		.image-content {
			display: flex;
			align-items: baseline;
		}
			.main-image {
				width: 620px;
			}
			.sub-images {
				margin-left: 9px;
			}
				.sub-image {
					width: 370px;
				}
				.mb {
					margin-bottom: 9px;
				}
		.content-ttl {
			font-size: 20px;
			color:#7B5700;
			margin: 10px auto;
		}
		.content-txt {
			font-size: 14px;
		}

}


/* Tablet ================================================== */
@media all and (min-width:560px) and (max-width:959px){
	.header-logo {
		background-color: #fff;
	}
	#tofuro {
		width: 100%;
		height: auto;
		padding: 100px 0px 0px;
		background-color: #FAF9F2;
	}
		.tofuro--inner {
			width: 100%;
			margin: 20px auto auto;
			overflow: hidden;
		}
			.tofuro-main {
				width: 90%;
				margin: auto auto 55px;
			}
				.tofuro-txt {
					width: 100%;
					height: auto;
					margin: auto auto 20px;
					position: relative;
					z-index: 2;
				}
					.tofuro-txt img {
						width: 100%;
						height: auto;
						margin: auto auto 20px;
					}
					.tofuro-txt p {
						width: 100%;
						font-size: 12px;
						text-align: center;
						line-height: 2.0;
						letter-spacing: 0.075em;
					}
				.tofuro-image {
					width: 100%;
					height: auto;
					margin: auto auto;
					opacity: 0;
					transform: translate(0, 10px);
					-webkit-transform: translate(0, 10px);
					transition: 1.4s;
					-webkit-transition: 1.4s;
				}
				.tofuro-image.is-show {
					transform: translate(0, 0);
					-webkit-transform: translate(0, 0);
					opacity: 1;
				}
					.tofuro-image img {
						width: 100%;
						height: auto;
					}
	.content--area {
		width: 100%;
	}
		.content-inner {
			width: 100%;
			margin: 0 auto;
			display: grid;
			grid-template-columns: 1fr;
			column-gap: 60px;
		}
			.content {
				width:100%;
				margin: 0 0 20px;
			}
				.content img {
					width: 100%;
				}
				.ttl {
					font-size: 18px;
					color:#7B5700;
					line-height: 1.5;
					margin: 10px auto;
				}
				.txt {
					font-size: 14px;
					color: #4E3B30;
				}
				.place {
					font-size: 18px;
					margin: 10px auto 30px;
				}
				.place span {
					display: inline-block;
					padding:0 3px;
					font-size: 31px;
				}
	.seasons {
		width: 100%;
		margin: 0 auto 150px;
	}
		.seasons-ttl {
			font-size: 20px;
			text-align: center;
			margin: 20px auto;
		}
		/* ループスライダー */
			.seasons-img-area {
				width: 100%;
				height: 230px;
				/* display: flex; */
				/* justify-content: center; */
				/* overflow: hidden; */
			}
			.roopslider {
				width: auto;
				/* display: flex; */
				margin:0;
				padding:0;
			}
			.roopslider img {
				display: inline-block;
				width: 325px;
				margin-right: 5px;
			}
	.hr {
		width: 100%;
		margin: 0 auto;
		color: #D6D4C3;
	}
	.tofuro-bi-top {
		width: 100%;
		margin: 80px auto 40px;
		display: flex;
		flex-direction: column-reverse;
		justify-content:space-between;
		/* align-items: center; */
	}
		.tofuro-bi-ttl {
			font-size: 18px;
			color:#7B5700;
		}
		.tofuro-bi-top img {
			width:131px;
			height: auto;
			margin: 0 0 0 auto;
		}
		.tofuro-bi-content {
			width: 100%;
			max-width: 1000px;
			margin: 40px auto;
		}
			.po-re {
				position: relative;
			}
			.alt-txt {
				display: inline-block;
				padding: 5px 12px;
				font-size: 14px;
				color: #fff;
				position: absolute;
				bottom: 0;
				right: 0;
				text-shadow: 1px 1px 3px #000;
			}
			.name-s {
				width: 80%;
			}
			.desc {
				position: absolute;
				top: -14px;
				right: 0px;
				color:#4E3B30;
				font-size: 10px;
				text-decoration: underline;
			}
				.main-image {
					width: 100%;
				}
				.sub-images {
					max-width: 100%;
					display: flex;
					justify-content: space-between;
					margin: 10px auto 0;
				}
					.sub-image-div {
						width: 49%;
					}
					.sub-image {
						width: 100%;
					}
					.sub-images img:first-child {
						/* margin-bottom: 9px; */
					}
			.content-ttl {
				font-size: 18px;
				color:#7B5700;
				margin: 10px auto;
			}
			.content-txt {
				font-size: 14px;
			}
}

/* SP ================================================== */
@media all and (max-width:559px){
.header-logo {
	background-color: #fff;
}
#tofuro {
	width: 100%;
	height: auto;
	padding: 100px 0px 0px;
	background-color: #FAF9F2;
}
	.tofuro--inner {
		width: 100%;
		margin: 20px auto auto;
		overflow: hidden;
	}
		.tofuro-main {
			width: 90%;
			margin: auto auto 55px;
		}
			.tofuro-txt {
				width: 100%;
				height: auto;
				margin: auto auto 20px;
				position: relative;
				z-index: 2;
			}
				.tofuro-txt img {
					width: 100%;
					height: auto;
					margin: auto auto 20px;
				}
				.tofuro-txt p {
					width: 100%;
					font-size: 12px;
					text-align: center;
					line-height: 2.0;
					letter-spacing: 0.075em;
				}
			.tofuro-image {
				width: 100%;
				height: auto;
				margin: auto auto;
				opacity: 0;
				transform: translate(0, 10px);
				-webkit-transform: translate(0, 10px);
				transition: 1.4s;
				-webkit-transition: 1.4s;
			}
			.tofuro-image.is-show {
				transform: translate(0, 0);
				-webkit-transform: translate(0, 0);
				opacity: 1;
			}
				.tofuro-image img {
					width: 100%;
					height: auto;
					margin: 0 0 60px;
				}
.content--area {
	width: 100%;
}
	.content-inner {
		width: 100%;
		margin: 0 auto;
		display: grid;
		grid-template-columns: 1fr;
		column-gap: 60px;
	}
		.content {
			width:100%;
			margin: 0 0 20px;
		}
			.content img {
				width: 100%;
			}
			.ttl {
				font-size: 18px;
				color:#7B5700;
				line-height: 1.5;
				margin: 10px auto 6px;
			}
			.txt {
				font-size: 14px;
				color: #4E3B30;
				line-height: 1.6em;
			}
			.place {
				font-size: 18px;
				margin: 0px auto 30px;
			}
			.place span {
				display: inline-block;
				padding:0 3px;
				font-size: 31px;
			}
.seasons {
	width: 100%;
	margin: 0 auto 130px;
}
	.seasons-ttl {
		font-size: 20px;
		text-align: center;
		margin: 20px auto;
	}
	/* ループスライダー */
		.seasons-img-area {
			width: 100%;
			height: 230px;
			/* display: flex; */
			/* justify-content: center; */
			/* overflow: hidden; */
		}
		.roopslider {
			width: auto;
			/* display: flex; */
			margin:0;
			padding:0;
		}
		.roopslider img {
			display: inline-block;
			width: 325px;
			margin-right: 5px;
		}
.hr {
	width: 100%;
	margin: 0 auto;
	color: #D6D4C3;
}
.tofuro-bi-top {
	width: 100%;
	margin: 80px auto 40px;
	display: flex;
	flex-direction: column-reverse;
	justify-content:space-between;
	/* align-items: center; */
}
	.tofuro-bi-ttl {
		font-size: 18px;
		color:#7B5700;
	}
	.tofuro-bi-top img {
		width:131px;
		height: auto;
		margin: 0 0 0 auto;
	}
	.tofuro-bi-content {
		width: 100%;
		max-width: 1000px;
		margin: 60px auto;
	}
		.po-re {
			position: relative;
		}
		.alt-txt {
			display: inline-block;
			padding: 5px 12px;
			font-size: 10px;
			color: #fff;
			position: absolute;
			bottom: 0;
			right: 0;
			text-shadow: 1px 1px 3px #000;
		}
		.name-s {
			width: 80%;
		}
		.desc {
			position: absolute;
			top: -14px;
			right: 0px;
			color:#4E3B30;
			font-size: 10px;
			text-decoration: underline;
		}
			.main-image {
				width: 100%;
			}
			.sub-images {
				max-width: 100%;
				display: flex;
				justify-content: space-between;
				margin: 10px auto 0;
			}
				.sub-image-div {
					width: 49%;
				}
				.sub-image {
					width: 100%;
				}
				.sub-images img:first-child {
					/* margin-bottom: 9px; */
				}
		.content-ttl {
			font-size: 17px;
			color:#7B5700;
			margin: 10px auto 6px;
		}
		.content-txt {
			font-size: 14px;
		}
}