@charset "utf-8";

body { text-align: center; }

h2 {
	margin-bottom: 1rem;
	font-size: 3.2rem;
	color: rgba(101, 60, 0, 1);
}
h2.cornertitleH2 {
	background: rgba(101, 60, 0, 1);
	color: rgba(255, 255, 255, 1);
	padding: 1rem;
	text-align: center;
	margin-bottom: 2rem;
	border-radius: 2rem;
	font-size: 2rem;
	line-height: 100%;
}
.shopDl > dt, 
h4 {
	font-size: 2.2rem;
	font-weight: bold;
	color: rgba(101, 60, 0, 1);
	border-bottom: 2px solid rgba(101, 60, 0, 1);
	padding-bottom: 1rem;
	margin-bottom: 1.5rem;
}
h5 {
	font-size: 1.6rem;
	font-weight: bold;
	color: rgba(101, 60, 0, 1);
	margin-bottom: 1rem;
}
h5.cornertitleH5 {	
	background:rgba(201, 165, 60, 1);
	color: rgba(255, 255, 255, 1);
	padding: 1rem;
	text-align: center;
	border-radius: 1.7rem;
	font-size: 1.4rem;
	line-height: 100%;
}

#headerBox {
	background: url(../img/common/bg.jpg) no-repeat 50% 50%;
	background-size: cover;
	padding: 2rem 0;
	margin-bottom: 4rem;
}
	#headerBox h1 { margin: 2rem 0; }
	#headerBox h3 {
	/*
		margin-bottom: 0.25rem;
		mix-blend-mode: multiply;
	*/
		background: rgba(101, 60, 0, 0.9);
		padding: 1.5rem;
	}
	#headerBox .subH3 {
		margin-bottom: 4rem;
		background: rgba(173, 117, 52, 0.9);
		padding: 1rem;
		line-height: 100%;
	}
	#headerBox .headcaption {
		text-align: right;
		width: 90%;
		display: block;
		font-weight: bold;
	}
	#headerBox p {
		margin: 2rem 0;
	}
	#headerBox small {
		font-size: 1.2rem;
		font-weight: bold;
		color: rgba(101, 60, 0, 1);
		text-shadow: 0 0 1px rgba(255, 255, 255, 1);
		display: block;
		line-height: 1.5;
		padding-top: 0.5em;
	}
		#headerBox img {
			width: 95%;
			max-width: 900px;
			margin: 0 auto;
		}
		#headerBox h3 img {
			width: 90%;
			max-width: 800px;
		}
		#headerBox h3 img.wide {
			width: 100%;
		/*	max-width: 1280px;*/
			max-width: 860px;
		}
		#headerBox h3 span.cap {
			margin-top: 1em;
			font-size: 1rem;
			color: #FFF;
			display: block;
			line-height: 1;
		}
#wrapperBox {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
	#wrapperBox > nav {
		width: 27%;
		text-align: left;
	}
	#wrapperBox > article {
		width: 70%;
		text-align: left;
	}

	#mainMenuBox li { margin-bottom: 0.5rem; }

		#mainMenuBox li a {
			display: block;
			text-decoration: none;
		}
		#mainMenuBox li.access::before, 
		#mainMenuBox li.beer::before, 
		#mainMenuBox li.home a {
			background: rgba(173, 117, 52, 1);
			color: rgba(255, 255, 255, 1);
			padding: 1rem 0;
			font-weight: bold;
			text-align: center;
			border-radius: 5px;
		}
		#mainMenuBox li.home a:hover {
			background: rgba(184, 28, 34, 1);
		}
		#mainMenuBox li.access::before, 
		#mainMenuBox li.beer::before {
			background: rgba(101, 60, 0, 1);
			display: block;
			margin: 1.5rem 0 1rem 0;
		}
		#mainMenuBox li.access::before { content: 'ACCESS'; }
		#mainMenuBox li.beer::before { content: 'MENU'; }
		#mainMenuBox li.covid19 a {
			margin-top: 2rem;
			background: rgba(184, 28, 34, 1);
			color: rgba(255, 255, 255, 1);
			padding: 1rem 0;
			font-weight: bold;
			text-align: center;
			border-radius: 5px;
		}
		#mainMenuBox li.covid19 a:hover { background: rgba(51, 51, 51, 1); }
		#mainMenuBox li.qrpayment h4 {
			border-top: 2px solid rgba(101, 60, 0, 1);
			text-align: center;
			font-size: 1.6rem;
			background: rgba(101, 60, 0, 0.1);
			padding: 0.25em 0;
		}

#footerBox {
	background: rgba(101, 60, 0, 1);
	color: rgba(255, 255, 255, 1);
	padding: 2rem 0 1rem 0;
	margin-top: 8rem;
}
	#footerBox h1 { font-size: 1.4rem; }
	#footerBox small { font-size: 1rem; }

.cautionBox {
	background: rgba(184, 28, 34, 0.1);
	padding: 2rem;
}
	.cautionBox h3 {
		margin-bottom: 1rem;
		color: rgba(184, 28, 34, 1);
	}

.cautionBox2 {
	margin-bottom: 4rem;
	color: rgba(184, 28, 34, 1);
	font-weight: bold;
}


/* [contents] =================================== */
/* home */
#homeNavi01 {
	margin-bottom: 2rem;
}
#homeNavi02 li {
	margin-bottom: 1rem;
}
	#homeNavi01 li a, 
	#homeNavi02 li a {
		text-decoration: none;
		display: block;
		background-size: cover;
		text-align: center;
		border-radius: 5px;
		padding: 2rem 0;
		line-height: 100%;
	}
	#homeNavi01 li a img, 
	#homeNavi02 li a img { height: 3rem; }
	#homeNavi01 li.beer a { background-image: url(../img/common/bg_01a.jpg); }
	#homeNavi01 li.food a { background-image: url(../img/common/bg_02a.jpg); }
	#homeNavi01 li.bottle a { background-image: url(../img/common/bg_03a.jpg); }
	#homeNavi02 li.beer a { background-image: url(../img/common/bg_01b.jpg); }
	#homeNavi02 li.food a { background-image: url(../img/common/bg_02b.jpg); }
	#homeNavi02 li.bottle a { background-image: url(../img/common/bg_03b.jpg); }
	#homeNavi01 li a:hover, 
	#homeNavi02 li a:hover { opacity: 0.5; }

	.shopBtnP a {
		background: rgba(202, 163, 0, 1);
		color: rgba(255, 255, 255, 1);
		padding: 2rem;
		display: block;
		text-align: center;
		border-radius: 3.5rem;
		line-height: 125%;
		text-decoration: none;
	}
		.shopBtnP a:hover { background: rgba(184, 28, 34, 1); }
#homeNewsBox .newsBox { flex: 1; }
	#homeNewsBox .newsBox h3 {
		background:rgba(201, 165, 60, 1);
		color: rgba(255, 255, 255, 1);
		padding: 1rem;
		text-align: center;
		margin-bottom: 1rem;
		border-radius: 1.7rem;
		font-size: 1.4rem;
		line-height: 100%;
	}
	#homeNewsBox .newsBox dl {
		padding: 1rem;
		border-bottom: 1px dotted rgba(173, 117, 52, 1);
		margin-bottom: 1rem;
		display: flex;
		flex-wrap: nowrap;
		justify-content: space-between;
	}
		#homeNewsBox .newsBox dl dt {
			font-size: 1.2rem;
			width: 6em;
			font-weight: bold;
			color: rgba(101, 60, 0, 1);
		}
		#homeNewsBox .newsBox dl dd { flex: 1; }
#homeNewsBox .facebookBox { width: 250px; }

	#covid19Box { margin-top: 3rem; }
		#covid19Box .covid19Btn {
			background:rgba(184, 28, 34, 1);
			display: block;
			text-align: center;
			text-decoration: none;
			color: rgba(255, 255, 255, 1);
			font-weight: bold;
			padding: 2rem 0;
			border-radius: 5px;
		}
			#covid19Box .covid19Btn:hover { background: rgba(51, 51, 51, 1); }
			#homeNewsBox .newsBox #covid19Box dl {
				padding: 0;
				border-bottom: none;
			}
				#homeNewsBox .newsBox #covid19Box dl dt {
					border: 1px solid rgba(101, 60, 0, 1);
					text-align: center;
				}
				#homeNewsBox .newsBox #covid19Box dl.colorRed dt {
					color: rgba(184, 28, 34, 1);
					border-color: rgba(184, 28, 34, 1);
				}
				#homeNewsBox .newsBox #covid19Box dl dd {
					padding-left: 1rem;
					color: rgba(101, 60, 0, 1);
				}
				#homeNewsBox .newsBox #covid19Box dl.colorRed dd {
					color: rgba(184, 28, 34, 1);
					font-weight: bold;
				}
			#applicationBox {
				border-top: 1px solid rgba(101, 60, 0, 1);
				padding: 1rem 0;
				border-bottom: 1px solid rgba(101, 60, 0, 1);
				color: rgba(101, 60, 0, 1);
			}
				#homeNewsBox .newsBox #covid19Box #applicationBox dl dd { font-weight: bold; }
			#applicationdlBox {
				text-align: center;
				margin-bottom: 2rem;
			}
				#applicationdlBox .fixImg { max-width: 400px; }


/* beer */
.beerDl { margin-bottom: 2rem; }
	.beerDl dt {
		font-weight: bold;
		color: rgba(101, 60, 0, 1);
		margin-bottom: 1rem;
	}
.flex_logo {
	display: flex;
	flex-wrap: nowrap;
	justify-content: left;
}
	.flex_logo .flex_logo_image { width: 25%; margin-right: 2em; }
		.flex_logo .flex_logo_image .cautionUl { margin-top: 1em; }
	.flex_logo ul.beerUl { flex: 1; }
.beerUl { margin-bottom: 2rem; }
	.beerUl li {
		padding-bottom: 0.5rem;
		border-bottom: 1px dotted rgba(101, 60, 0, 1);
		margin-bottom: 1rem;
		line-height: 145%;
	}
		.beerUl li .beerDetailBox span { padding-right: 2rem; }

#beerBody .scheduleBox .topThTable td.venue {
	font-size: 1.2rem;
	background: rgba(101, 60, 0, 0.1);
	padding: 0.5em calc((1.6 / 1.2) * 1em);
}
#beerBody .scheduleBox .topThTable td {
	vertical-align: top;
}
	#beerBody .scheduleBox .topThTable td .style {
		font-size: 1.2rem;
		margin-left: 1em;
	}
	#beerBody .scheduleBox .topThTable td .style + .brand {
		margin-left: 1em;
	}
	#beerBody .scheduleBox .topThTable td .brand {
		font-size: 1.2rem;
		display: inline-block;
	}
	#beerBody .scheduleBox .topThTable.noschedule td strong { display: block; }
	#beerBody .scheduleBox .topThTable.noschedule td .style { margin-left: 0; }
	#beerBody .scheduleBox .topThTable td:has(.award) .brand { display: block; margin-left: 0; }
		#beerBody .scheduleBox .topThTable td .brand::before { content: '＜'; }
		#beerBody .scheduleBox .topThTable td .brand::after { content: '＞'; }
	#beerBody .scheduleBox .topThTable td .award {
		font-size: 1.2rem;
		display: block;
		margin-top: 0.5em;
		padding-left: 0.5em;
		border-left: 1px solid rgba(51, 51, 51, .5);
		line-height: 1.2;
	}
	#beerBody .scheduleBox .topThTable td .award::before {
		font-size: 1.2rem;
		content:'受賞';
		display: block;
		margin: 0 0 0.25em 0;
	}

/* food */
.foodDl { margin-bottom: 2rem; }
	.foodDl dt img { margin-bottom: 0.5rem; }
	.foodDl dd { line-height: 125%; }
		#noimageMenuUl li .textBox, 
		.foodDl dd .textBox {
			float: left;
			display: inline-block;
		}
		#noimageMenuUl li .priceBox, 
		.foodDl dd .priceBox {
			float: right;
			display: inline-block;
		}
			.foodDl dd .priceBox .priceDetail dl {
				display: flex;
				flex-wrap: nowrap;
				justify-content: space-between;
			}
				.foodDl dd .priceBox .priceDetail dd {
					width: auto;
					padding-left: 1rem;
				}
#noimageMenuUl li {
	padding-bottom: 0.5rem;
	border-bottom: 1px dotted rgba(51, 51, 51, 1);
	margin-bottom: 1rem;
}
	#noimageMenuUl li .priceDetail dl {
		display: flex;
		justify-content: space-between;
	}
	#noimageMenuUl li .priceDetail dt, 
	#noimageMenuUl li .priceDetail dd {
		display: inline-block;
		padding-left: 0.5em;
	}

/* bottle */
.bottleDl {
	margin-bottom: 2rem;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
}
.bottleDl:not(:last-child) {
	padding-bottom: 1rem;
	border-bottom: 1px dotted rgba(51, 51, 51, 1);
}
	.bottleDl dt {
		width: 186px;
		order: 2;
	}
	.bottleDl dd {
		flex: 1;
		order: 1;
		padding-right: 2em;
	}


/* info */
.PriceDl { margin-bottom: 2rem; }
	.PriceDl dt {
		font-weight: bold;
		color: rgba(255, 255, 255, 1);
		background: rgba(101, 60, 0, 1);
		padding: 1rem 2rem;
		border-radius: 5px 5px 0 0;
	}
	.PriceDl dd{
		border: 1px solid rgba(101, 60, 0, 1);
		padding: 1rem 2rem;
		border-radius: 0 0 5px 5px;
	}
		.PriceDl dd .largerText {
			font-size: 3.2rem;
			font-weight: bold;
			padding: 0 0.5rem;
			color: rgba(184, 28, 34, 1);
		}


/* shop */
.shopDl { margin-bottom: 4rem; }
	.shopDl > dt > span { padding-left: 1rem; }
	.shopDl .detailBox dl, 
	.shopDl > dd {
		display: flex;
		flex-wrap: nowrap;
		justify-content: space-between;
	}
	.shopDl .detailBox .address { margin-bottom: 1rem; }
	.shopDl .detailBox dl { margin-bottom: 0.5rem; }
	.shopDl > dd .logoBox { width: 140px; }
		.shopDl > dd .logoBox img { max-width: 130px; }
	.shopDl .detailBox dl dt {
		width: 6em;
		font-size: 1.2rem;
		border: 1px solid rgba(201, 165, 60, 1);
		text-align: center;
		border-radius: 5px;
		color: rgba(201, 165, 60, 1);
	}
	.shopDl .detailBox dl dd, 
	.shopDl > dd .detailBox { flex: 1; }
	.shopDl .detailBox dl dd { padding-left: 1rem; }

/* parkmap */
.parkmapP { text-align: center; /* padding: 0 5%; */ }



/* [sp] ============================================ */
@media only screen and (max-width: 768px) {
	#wrapperBox > nav {
		display: none;
	}
	#headerBox.initBox, 
	.bottleDl dt,
	.bottleDl dd,
	.shopDl > dd .logoBox, 
	.shopDl > dd .detailBox, 
	#homeNewsBox .newsBox, 
	#homeNewsBox .facebookBox,
	#wrapperBox > article {
		width: 100%;
	}

	#headerBox { padding-top: 4rem; }
		#headerBox img { max-width: 100%; }
		#headerBox h3, 
		#headerBox h1 {
			padding-right: 5vw;
			padding-left: 5vw;
		}
		#headerBox small {
			display: block;
			margin: 1.5em 5vw 0 5vw;
			line-height: 125%;
		}

	/* [contents] =================================== */
	/* home */
	#homeNavi01 li { margin-bottom: 1em; }
	#homeNewsBox .newsBox { padding-right: 0; margin-bottom: 2rem; }
	#homeNewsBox .facebookBox iframe { margin-left: calc((100% - 250px) / 2); }

	/* food */
	.bottleDl, 
	.foodDl {
		padding-bottom: 2rem;
		border-bottom: 1px dotted rgba(101, 60, 0, 1);
		margin-bottom: 4rem;
	}
		.bottleDl dt, 
		.foodDl dt { text-align: center; }
			.bottleDl dt img.fixImg, 
			.foodDl dt img.fixImg { max-width: 186px; margin-bottom: 2rem; }
	
	/* beer */
	.scheduleBox .spTable tbody td { position: relative; }
	.scheduleBox .spTable tbody tr th+td, 
	.scheduleBox .spTable tbody tr td:first-child, 
	.scheduleBox .spTable tbody tr td { padding-top: 0.5em; padding-bottom: 0.5em; }
	.scheduleBox .spTable tbody td::before {
		position: absolute;
		background: rgba(101, 60, 0, 1);
		color:rgba(255, 255, 255, 1);
		padding: 0 0.5em;
		position: absolute;
		top: 0;
		left: 0;
	}
	.scheduleBox .spTable.noschedule tbody td { border-bottom-style: solid; }
	.flex_logo {
		flex-wrap: wrap;
	}
		.flex_logo .flex_logo_image, 
		.flex_logo ul.beerUl { width: 100%; flex: auto; }
		.flex_logo .flex_logo_image { margin: 0 0 1em 0; text-align: center; }
			.flex_logo .flex_logo_image img { max-width: 200px; }

	/* bottle */
	.bottleDl dt { order: 1; }
	.bottleDl dd { order: 2; padding-right: 0; }


	/* shop */
	.bottleDl, 
	.shopDl > dd {
		flex-wrap: wrap;
	}
	.shopDl > dd .detailBox {
		flex: auto;
	}
	.shopDl > dd .logoBox { text-align: center; }

	/* parkmap */
	.parkmapP { padding: 0; }
}