@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');

/* FireFoxFadeブレ防止 */

img { display:block; box-shadow: #000 0 0 0; }

/* ページトップ */

#page-top {
	position: fixed;
	bottom: 0;
	right: 0;
	font-size: 1.4em;
	font-weight:bold;
	z-index:2000;
	transition: all 0.3s;
}

#page-top a {
	background:url("../img/totop.png") left top no-repeat;
	width: 80px;
	height:80px;
	display: block;
	text-indent: -9999px;
	overflow: hidden;
	transition: all 0.3s;
	position:relative;
}

#page-top a:after {
	content: "";
	background:url("../img/totop_ro.png") left top no-repeat;
	width: 80px;
	height:80px;
	display: block;
	position: absolute;
	left:0;
	top:0;
	visibility: hidden;
	opacity: 0;
}

#page-top a:hover:after {
	visibility: inherit;
	opacity: 1;
}

/* 全体・枠作り */

html,body {
	height:100%;
}

html {
	font-size:62.5%;
}

img { display:block; }


body {
	font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Verdana, sans-serif;
	text-align:center;
	min-height: 100vh;
	font-size: 1.0rem;
}

.inv {opacity: 0; transition:0.7s; transform:translate(0,20px); }
.inv2 {opacity: 0; transition:0.7s; transform:translate(0,20px); }
.vie {opacity: 1.0; transform:translate(0);}

#PageWrapper {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	position: relative;
	width:100%;
}

h1 {display:none;}
h2 {display:none;}

#Mainvisual {
	width:100%;
	padding-top:150%;
	background:url("../img/mobile/mainvisual.jpg") center top no-repeat;
	background-size: cover;
	position: relative;
}

.mv {
	display: none;
}

.mv_logo {
	display: none;
}

#js__btn {
	background:url("../img/menu_btn.png") left top no-repeat;
	background-size:cover;
	width:10%;
	padding-top:10%;
	display: block;
	position: fixed;
	left:0;
	top:0;
	z-index:2200;
	transition: all 0.3s;
}

.open #js__btn {
	transform: rotate(90deg);
}

.menu_wrap {
	width:100%;
	position: fixed;
	top:0;
	left:0;
}

.menu_wrap {
	position: fixed;
    display: table;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background:rgba(255,255,255,0.9);
    transition: all .5s;
    visibility: hidden;
    opacity: 0;
	z-index: 2000;
}

.open .menu_wrap {
	visibility: visible;
	opacity: 1;
}

.menu_wrap ul {
	width:100%;
	margin-top:15%;
}

.menu_wrap ul li a {
	font-size:3rem;
	display: block;
	transition: all 0.3s;
	position: relative;
	text-decoration: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 600;
	border-bottom:1px solid #C0C0C0;
	box-sizing: border-box;
	width:100%;
	padding:16px 16px;
	color:#88ccc3;
}

.menu_wrap ul li a span {
	font-size: 50%;
}


#About {
	position: relative;
}

#Menu {
	width:100%;
	position: relative;
	padding:10% 0;
	background:url("../img/bg_white_stp.png") left top repeat;
}

#Novelty {
}

#Goods {
	width:100%;
	position: relative;
	padding:10% 0;
	background:url("../img/bg_white_stg.png") left top repeat;
}

#Event {
}

#Outline {
	width:100%;
	position: relative;
	padding:10% 0;
	background:url("../img/bg_green_stripe.png") left top repeat;
}

footer {
	width:100%;
	position: relative;
	padding:10% 0;
	background-color:#5c4a45;
}

h3 {
	width:75%;
	padding-top:13.5%;
	background-size: contain;
	margin:0 auto 10%;
}

#Head_about {display: none;}
#Head_menu {background:url("../img/head_menu.png") center top no-repeat;background-size: contain;}
#Head_novelty {display: none;}
#Head_goods {background:url("../img/head_goods.png") center top no-repeat;background-size: contain;}
#Head_event {display: none;}
#Head_outline {background:url("../img/head_outline.png") center top no-repeat;background-size: contain;}

.about_wrap {
	
}

.about_txt {
	width:100%;
	padding-top:200%;
	background:url("../img/mobile/about_01a.jpg") center top no-repeat;
	background-size: cover;
	position: relative;
}

a.ab_schedule {
	background:#000;
	width:27%;
	padding-top:6%;
	display: block;
	position: absolute;
	left:31%;
	top:62.4%;
	opacity: 0;
	transition: all 0.3s;
}


a.ab_sns01 {
	background:#000;
	width:15%;
	padding-top:15%;
	display: block;
	position: absolute;
	left:29%;
	top:74%;
	opacity: 0;
	transition: all 0.3s;
}

a.ab_sns02 {
	background:#000;
	width:15%;
	padding-top:15%;
	display: block;
	position: absolute;
	right:29%;
	top:74%;
	opacity: 0;
	transition: all 0.3s;
}

/*メニュー*/

.t01 {
	font-size: 1.8rem;
	color:#595959;
	line-height: 1.8;
	margin-bottom:36px;
}

.t01 a {
	color:#ff1b63;
	text-decoration: none;
	font-weight: bold;
}

.t01 a:hover {
	text-decoration: underline;
}

.menu_set {
	background:url("../img/mobile/set_01.jpg") left top no-repeat;
	width:100%;
	padding-top:200%;
	background-size: cover;
	margin-bottom:10%;
}

.mhead {
	width:75%;
	padding-top:11.67%;
	margin:0 auto 10%;
}

.mhead_01 {	background:url("../img/menu_head01.png") center top no-repeat; background-size: contain;}
.mhead_02 {	background:url("../img/menu_head02.png") center top no-repeat; background-size: contain;}
.mhead_03 {	background:url("../img/menu_head03.png") center top no-repeat; background-size: contain;}
.mhead_04 {	background:url("../img/menu_head04.png") center top no-repeat; background-size: contain;}

.menu_wrap_2c {
	width:92%;
	margin:0 auto 10%;
	display: flex;
	justify-content:space-between;
	flex-wrap: wrap;
	position: relative;
}

.menu_wrap_3c {
	width:92%;
	margin:0 auto 10%;
	display: flex;
	justify-content:space-between;
	flex-wrap: wrap;
	position: relative;
}

.menubox {
	width:46%;
	padding-top:55.75%;
	border-radius: 10px;
	background-color:#fff;
	border:5px solid #e2e2e2;
	margin:0 0 3%;
	overflow: hidden;
	position: relative;
}

.menubox a {
	width:100%;
	padding-top:100%;
	display: block;
	background-color:#fff;
	opacity: 0;
	transition: all 0.3s;
	position: absolute;
	left:0;
	top:0;
}

.menubox a:hover {
	opacity: 0.5;
}

.drink01 {background:url("../img/lineup/drink01.jpg") center top no-repeat; background-size: cover;}
.drink02 {background:url("../img/lineup/drink02.jpg") center top no-repeat; background-size: cover;}
.drink03 {background:url("../img/lineup/drink03.jpg") center top no-repeat; background-size: cover;}
.drink04 {background:url("../img/lineup/drink04.jpg") center top no-repeat; background-size: cover;}
.drink05 {background:url("../img/lineup/drink05.jpg") center top no-repeat; background-size: cover;}
.drink06 {background:url("../img/lineup/drink06.jpg") center top no-repeat; background-size: cover;}

.food01 {background:url("../img/lineup/food01.jpg") center top no-repeat; background-size: cover;}
.food02 {background:url("../img/lineup/food02.jpg") center top no-repeat; background-size: cover;}
.food03 {background:url("../img/lineup/food03.jpg") center top no-repeat; background-size: cover;}
.food04 {background:url("../img/lineup/food04.jpg") center top no-repeat; background-size: cover;}
.food05 {background:url("../img/lineup/food05.jpg") center top no-repeat; background-size: cover;}

.side01 {background:url("../img/lineup/side01.jpg") center top no-repeat; background-size: cover;}
.side02 {background:url("../img/lineup/side02.jpg") center top no-repeat; background-size: cover;}
.side03 {background:url("../img/lineup/side03.jpg") center top no-repeat; background-size: cover;}
.side04 {background:url("../img/lineup/side04.jpg") center top no-repeat; background-size: cover;}
.side05 {background:url("../img/lineup/side05.jpg") center top no-repeat; background-size: cover;}

.dessert01 {background:url("../img/lineup/dessert01.jpg") center top no-repeat; background-size: cover;}
.dessert02 {background:url("../img/lineup/dessert02.jpg") center top no-repeat; background-size: cover;}
.dessert03 {background:url("../img/lineup/dessert03.jpg") center top no-repeat; background-size: cover;}
.dessert04 {background:url("../img/lineup/dessert04.jpg") center top no-repeat; background-size: cover;}

.goods01 {background:url("../img/lineup/goods01.jpg") center top no-repeat; padding-top:62.72%; background-size: cover;}
.goods02 {background:url("../img/lineup/goods02.jpg") center top no-repeat; padding-top:62.72%; background-size: cover;}
.goods03 {background:url("../img/lineup/goods03.jpg") center top no-repeat; padding-top:62.72%; background-size: cover;}
.goods04 {background:url("../img/lineup/goods04.jpg") center top no-repeat; padding-top:62.72%; background-size: cover;}
.goods05 {background:url("../img/lineup/goods05.jpg") center top no-repeat; padding-top:62.72%; background-size: cover;}

/*ノベルティ*/

.novelty01 {
	background:url("../img/mobile/novelty_01.jpg") center top no-repeat;
	width:100%;
	padding-top:200%;
	position: relative;
	background-size: contain;
}

.novelty02 {
	display: none;
}

.novelty03 {
	display: none;
}

.novelty04 {
	display: none;
}

.event01 {
	background:url("../img/mobile/event_01.jpg") center top no-repeat;
	width:100%;
	padding-top:200%;
	position: relative;
	background-size: contain;
}

.event01 a {
	width:50%;
	padding-top:10%;
	display: block;
	position: absolute;
	bottom:22.2%;
	right:25%;
	background-color: #000;
	opacity: 0;
	transition: all 0.3s;
}


.event02 {
}

/*アウトライン*/

.ohead_01 {	background:url("../img/outline_head01.png") center top no-repeat; background-size: contain;}
.ohead_02 {	background:url("../img/outline_head02.png") center top no-repeat; background-size: contain;}
.ohead_03 {	background:url("../img/outline_head03.png") center top no-repeat; background-size: contain;}

.calendar_wrap {
	width:92%;
	margin:0 auto 10%;
	position: relative;
}

.calendar_july {
	background:url("../img/calendar_july1.png") center top no-repeat;
	width:100%;
	padding-top:132.88%;
	background-size: contain;
	margin-bottom:10%;
}

.calendar_august {
	background:url("../img/calendar_august1.png") center top no-repeat;
	width:100%;
	padding-top:132.88%;
	background-size: contain;
}

.outline_map {
	width:92%;
	height:300px;
	margin:0 auto 24px;
	position: relative;
}

.outline_map iframe {
	width:100%;
	height:300px;
}

.attention_txt {
	width:92%;
	margin:0 auto;
	font-size:1.7rem;
	line-height: 1.8;
	text-align: left;
}

.attention_txt p {
	color:#595959;
	margin-bottom:24px;
}

.attention_txt p strong {
	font-weight: bold;
}

/*フッター*/

.foot_logo {
	background:url("../img/footer.jpg") center top no-repeat;
	width:92%;
	padding-top:86.25%;
	margin:0 auto 10%;
	background-size: contain;
	position: relative;
}

a.foot_twit_01 {
	width:16%;
	padding-top:16%;
	display: block;
	position: absolute;
	top:0;
	left:50%;
	margin-left:-29%;
}

a.foot_twit_02 {
	width:16%;
	padding-top:16%;
	display: block;
	position: absolute;
	top:0;
	right:50%;
	margin-right:-29%;
}

.copyright {
	width:92%;
	color:#fff;
	font-size:1.5rem;
	margin:0 auto 5%;
	display: block;
}

.copyright a {
	color:deepskyblue;
	text-decoration: none;
}

#Stop {
	width:100%;
	background-color:#fff;
	box-sizing: border-box;
	padding:30px;
	border-top:3px solid #7B7B7B;
	border-bottom:3px solid #7B7B7B;
	margin:0 auto;
	font-size:1.7rem;
	
}

#Stop p {
	margin-bottom:24px;
	text-align: left;
	line-height: 2;
}

#Stop strong {
	font-weight: bold;
	font-size:2.4rem;
	text-align: center;
	line-height: 1.5;
	margin-bottom:24px;
	display: block;
}

.stop_date {
	width:80%;
	background-color:#ECECEC;
	margin:0 auto 24px;
	box-sizing: border-box;
	padding:20px;
	font-weight: bold;
}

.booth {
	width:90%;
	margin:0 auto 60px;
	background-color:#fff;
	box-shadow:0 0 15px rgba(0,0,0,0.1);
	border-radius: 15px;
	overflow: hidden;
	position: relative;
}

.booth a {
	background:url("../img/booth_btn_mb.png") left top no-repeat;
	display: block;
	width:100%;
	padding-top:40%;
	transition: all 0.3s;
	background-size: cover;
}