:root {
  /* Colors */
	--keycol-bg:#faf7ef;
	--keycol-purple:#542f7d;
	--keycol-green:#357d4d;
	--keycol-lightgreen:#e1ff05;
	--keycol-navy:#131a67;
	--keycol-red:#f31e27;
	--keycol-ume:#b46883;
	--keycol-take:#92904a;
	--keycol-matu:#6d8e77;
  /* Fonts */
  /* Effects */
	
}



/* 基礎css */

body{
background: var(--keycol-bg);
font-size:12px;
background-image: url(/image/bg_sp.webp);
background-repeat: repeat;
}

h2{
	font-size:24px;
	font-weight: bold;
	text-align: center;
}
h2 img{
	height:16px;
	width:auto;
}



/* キャンペーン情報 */
#canpain{
	width:750px;
	height: auto;
	margin:0 auto;
	padding: 20px 120px;
	text-align:center;

}
#canpain img{
	width:100%;
	height:auto;
}




/* おしながき */
#menu{
	width:750px;
	margin:0px auto;
	padding:20px 20px 40px;
	text-align: center;
}
.menu_wrap{

}
#menu img{
	width:65%;
	height:auto;
  margin: 10px auto 20px;
}
#menu h2 img{
	margin: 10px 0 10px;
	height: 90px;
	width: auto;
}




/* こだわり */
#kodawari{
	width:750px;
	margin:0 auto;
	padding:20px 10% 40px;
}
#kodawari h2 img{
	margin: 10px 0 10px;
	height: 90px;
	width: auto;
}
#kodawari h3{
	margin:10px 0;
	padding:10px;
	background-color: var(--keycol-navy);
	color:#fff;
	font-size:20px;
	font-weight: bold;
	text-align: center;
	border-radius: 30px;
}
#kodawari p{
	padding:5px;
	font-size: 16px;
	line-height:1.6;
}
#kodawari img{
	width:100%;
	height:auto;
}



/* おしらせ */
#news{
	width:750px;
	margin: 0px auto;
	padding:10px 20px 60px;
}
#news h2{
	margin:10px 0;
	padding:5px;
}

#news h2 img{
	margin: 10px 0 10px;
	height: 90px;
	width: auto;
}
#news p{
  width: 80%;
  margin: 0 auto;
	padding: 10px 5px;
	font-size: 16px;
	line-height:1.4;
	border-bottom: 1px solid #b3b2b2;
}
#news p:nth-last-of-type(1){
	border-top: 1px solid #b3b2b2;
}
#news p .date{
	display: block;
	font-size:14px;
}



/* 店舗情報 */
#shopinfo{
	width:750px;
  margin: 0px auto;
	padding: 20px 5% 40px;
	position: relative;
}

#shopinfo h2{
	margin:10px 0
}
#shopinfo h2 img{
	margin: 10px 0 10px;
	height: 90px;
	width: auto;
}
#shopinfo table{
	border-collapse :collapse;
	width:90%;
	margin: 10px auto;
}
#shopinfo tr{
	border-bottom:1px solid #9f9a9a;
}
#shopinfo th,#shopinfo td{
	padding:5px 10px;
	font-size:16px;
	line-height:1.4;
}
#shopinfo th{
	width:120px;
}


.fa-square-instagram{
	width:16px;
	height:16px;
	margin-right:2px;
	background: #d6249f;
	background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.fa-line{
	width:16px;
	height:16px;	
	margin-right:2px;
	background: #FFF;
	color:#339b24;;
}


.map-wrap{
	margin:10px 0 0 0;
	width:100%;
	padding:32px;
}

.map-wrap iframe{
	width:100%;
	height:450px;
}

/*駐車場案内*/
#parking{
	width:750px;
  margin: 0px auto;
	padding: 20px 5% 40px;
	position: relative;
}
#parking h2{
	margin:10px 0;
	padding:5px;
}

#parking h2 img{
	margin: 10px 0 10px;
	height: 90px;
	width: auto;
	max-width: 740px;
}
#parking .parking{
	width: 340px;
	margin: 10px auto;
	background: #fff;
}
#parking .parking img{
	width:100%;
	height:auto;
	border:3px solid #333;
	position: relative;
}

/*フォトギャラリー*/
#gallery{
	width:750px;
  margin: 0px auto;
	padding: 20px 5% 40px;
	position: relative;
}
#gallery h2{
	margin:10px 0;
	padding:5px;
}
#gallery h2 img{
	margin: 10px 0 10px;
	height: 90px;
	width: auto;
	max-width: 740px;
}
.img-grid{
	width:100%;
	margin: 20px 0px;
	padding: 10px;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: repeat(2, 1fr);
	gap: 0px;
}
.img-grid img{
	width:100%;
	max-width: 210px;
	height:auto;
}



/* 予約 */
#reserve{
	width:750px;
  margin: 0px auto;
	position: relative;
	margin-top: 0px;
	padding: 20px 70px 40px;
	color:#000;
  text-align: center;
}
#reserve h2{
	margin:10px 0;
	padding:5px;
}

#reserve h2 img{
	margin: 10px 0 10px;
	height: 90px;
	width: auto;
	max-width: 740px;
}


.bt{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;	
	width:280px;
	height:72px;
	margin: 0 auto;
	border-radius: 10px;
	font-size:20px;
	text-align: center;
	font-weight: bold;
}
.bt-tel, .bt-takeeats{
	margin: 0px auto 0px;
	background-color: var(--keycol-red);
	color:#fff;	
	font-size:26px;
	line-height: 1.2;
	font-weight: bold;
}

.bt-gurunavi{
  flex-direction: row;
	background-color: var(--keycol-red);
	color:#fff;
	margin: 0px auto 20px;
}
.bt-takeeats span,.bt-tel span,.bt-gurunavi span{
	font-size:1.4rem;
	font-weight:bold;
	margin:0 5px;
}

.telwrap{
	display: flex;
  align-items: center;
  gap: 5px;
  font-size:18px;
	font-weight: bold;
	color:#fff;	
}
.sub{
	margin: 5px 0 20px 0;
	font-size:16px;
}
.tel{
	font-weight: bold;
	font-size:16px;
}

.timetable{
	margin-top:5px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	font-size: 16px;
}