@charset "utf-8";

body{background-color: #96ddf5;}


/* 共通 */
#marion, #hotdog, #barco, #mlbcafe, #foodsp{
	position: relative;
	margin: 0 auto 12% auto;
}

#marion h2, #marion h2 a, #hotdog h2, #hotdog h2 a, #barco h2, #barco h2 a, #mlbcafe h2, #mlbcafe h2 a{
	position: relative;
	margin: 3% auto 0 auto;
	font-size: .18rem;
	font-weight: 900;
	color: #92000d;
	height: auto;
	text-decoration: none;
}
#marion h2 div, #hotdog h2 div, #barco h2 div, #mlbcafe h2 div, a.shopname{
	position: relative;
	font-size: .14rem !important;
	font-weight: 700 !important;
}
#marion h2 span div.tt{display: block;font-size: .18rem !important;font-weight: 900;}

#marion h2 span, #hotdog h2 span, #barco h2 span, #mlbcafe h2 span{
	display:-webkit-box;
	display:-webkit-flex;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}
#marion h2 span::before, #marion h2 span::after,
#hotdog h2 span::before, #hotdog h2 span::after, 
#barco h2 span::before,  #barco h2 span::after, 
#mlbcafe h2 span::before, #mlbcafe h2 span::after{
	content: '';
	display: block;
	width: 1.2em;
	height: 1.2em;
	background-image: url("../img/icon01.png");
	background-size: contain;
	background-repeat: no-repeat;
	flex-grow: 1;
}
#marion h2 span::before, #hotdog h2 span::before, #barco h2 span::before, #mlbcafe h2 span::before{margin-right:1em;background-position: 100% 0;}
#marion h2 span::after, #hotdog h2 span::after, #barco h2 span::after, #mlbcafe h2 span::after{margin-left:1em;background-position: 0 0;}

.attention{position: relative; margin: auto; width: 90%;}

/* タイトル */
.ttl {
	position: relative;
	margin: -30% auto 0 auto; 
	padding: 0;
}
.ttl h2{
	background-image: url("../img/bg_top.png");
	background-position: 50% 100%;
	background-repeat: no-repeat;
	background-size: 100% 60px;
}
.ttl h2 img{padding-bottom: 40px;}

#marion ul, #hotdog ul, #barco ul, #mlbcafe ul, #foodsp ul{
	position: relative;
	margin: 3% auto 0 auto;
	width: 80%;
}
#marion ul li, #hotdog ul li, #barco ul li, #mlbcafe ul li,#foodsp ul li{
	position: relative;
	margin: 12% auto 0 auto;
}
#marion ul li h3, #hotdog ul li h3, #barco ul li h3, #mlbcafe ul li h3{
	position: relative;
	margin: 1% auto 3% auto;
	padding: .5em;
	width: 86%;
	border-bottom: solid 2px #92000d;
	color: #92000d;
	font-weight: 900;
	font-size: .20rem;
	text-align: left;
}
.foodImg{
	position: relative;
	margin: 3% auto;
	width: 90%;
}
p.price{
	position: relative;
	margin: 0 auto;
	width: 90%;
	color: #92000d;
	font-weight: 900;
	font-size: .24rem;
	text-align: right;
}
p.price span{
	font-weight: 700;
	font-size: .14rem;
	padding-left: .5em;
}
p.price span.priceA{
	font-size: .15rem;
	padding-right: .5em;
}
p.txt{
	position: relative;
	margin: 3% auto;
	width: 90%;
	text-align: left;
}

#foodsp p{ position: relative; width: 80%; margin: 5% auto;}

.foodcaution {
	position: relative;
	margin: 0 auto 50% auto;
	padding: 3%;
	width: 80%;
	border: solid 1px #005175;
	text-align: left;
}

/* SPOT MAP */
#spotmap {margin: -40% auto 0 auto;padding: 0 0 10% 0;}
#spotmap .bg{
	position: relative;
	margin: 0;
	padding: 4% 0 40% 0;
	background: -webkit-linear-gradient(bottom, rgba(181,225,229,1) 50%, rgba(112,184,214,1));
	background: -o-linear-gradient(bottom, rgba(181,225,229,1) 50%, rgba(112,184,214,1)) ;
	background: linear-gradient(to bottom, rgba(181,225,229,1) 50%, rgba(112,184,214,1)) ;
}
#spotmap h2{
	background-image: url("../img/bg_game_top.png");
	background-position: 50% 100%;
	background-repeat: no-repeat;
	background-size: 100% 60px;
	padding-top: 15px;
}
#spotmap div.mapImage img{ width: 90%;}

/* ----- pc ----- */
@media screen and (min-width: 641px) {
	
	/* タイトル */
	.ttl {margin: -130px auto 0 auto;  }
	.ttl h2{background-size: 100% 120px;padding-bottom: 40px;}
	.ttl h2 img{padding-top: 40px;}

	/* 共通 */
	#marion, #hotdog, #barco, #mlbcafe, #foodsp{margin: 0 auto 120px auto;}
	#marion h2, #marion h2 a, #hotdog h2, #hotdog h2 a, #barco h2, #barco h2 a, #mlbcafe h2, #mlbcafe h2 a{
		margin: 0 auto;
		padding: 20px 0 0 0;
		font-size: .24rem;
	}
	#marion h2 span div.tt{font-size: .24rem !important;}

	#marion ul, #hotdog ul, #barco ul, #mlbcafe ul{
		position: relative;
		margin: 40px auto 20px auto;
		width: 960px;
	}
	#marion ul li, #hotdog ul li, #barco ul li, #mlbcafe ul li{margin: 0 auto 80px auto;}
	#marion ul li .contBg, #hotdog ul li .contBg, #barco ul li .contBg, #mlbcafe ul li .contBg{
		position: relative;
		width: 960px;
		padding: 20px 0 ;
		display:-webkit-box;
		display:-webkit-flex;
		display:-ms-flexbox;
		display:flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		align-items: flex-start;
		justify-content: center;
	}
	#marion ul li h3, #hotdog ul li h3, #barco ul li h3, #mlbcafe ul li h3{
		margin: 10px auto 20px auto;
		width: 86%;
		font-size: .30rem;
	}
	.foodImg{
		margin: 0 ;
		width: 400px;
	}
	.foodTxt{
		margin: 0 ;
		width: 510px;
	}
	p.price{font-size: .28rem;margin: 0 auto 30px auto;}
	p.price span.priceA{font-size: .18rem;}

	#foodsp ul{
		position: relative;
		margin: 30px auto 0 auto;
		width: 500px;
	}
	#foodsp ul li .contBg{position: relative;width: 500px;padding: 20px 0 ; text-align: center;}
	#foodsp p{ position: relative; width: 80%; margin: 30px auto;}

	.foodcaution {
		margin: 0 auto 120px auto;
		padding: 20px;
		width: 900px;
	}
	
	
	/* SPOT MAP */
	#spotmap {margin: -100px auto 0 auto;padding: 30px 0 50px 0;}
	#spotmap .bg{padding: 30px 0 200px 0;}
	#spotmap h2{background-size: 100% 120px;}
	#spotmap h2 img{padding-top: 30px;}
	#spotmap div.mapImage img{ width: 600px;}
}