@charset "utf-8";
/*=================================
フッターレイアウト
===================================*/
/* フッター */
footer {width: 100%;
	color:#000;
	font-family:'M PLUS 1p', sans-serif;
}
footer p{
	font-family: "Klee One", cursive;
	font-weight: bold;
}
footer img{
	height: auto;
	border: none;
}

/* フッターロゴ */
h2 {text-align: center}	
	
h2 img{
	height:auto;
	}

h2 a{
border: none;
transition:all 0.3s;}
	
h2 a:hover	{opacity: 0.3}
/* フッター店名 */
footer h4{
	font-size: 24px;
	letter-spacing: 0.15em;
	text-align: left;
	font-family: "Klee One", cursive;
	font-weight: 600;
	font-style: normal;	
	margin-bottom: 15px
}
footer h4 span{
	font-size: 18px;
}

footer a.tel{
	
	line-height:30px;
	letter-spacing: 0.15em;
	text-decoration: none;
	color:#0040FF;
	transition:all 0.3s;
}
footer a.tel:hover {color:#FFFF00;}

footer a.pri{
	color:#0040FF;

	line-height:30px;
	letter-spacing: 0.05em;
	text-decoration: none;
	transition:all 0.3s;
}
footer a.pri:hover {color:#FFFF00;}

/* 支払いボタン */
.pay{
margin-bottom: 15px;
margin-left: auto;
margin-right: auto;

}
.pay ul{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content:center ;
}
.pay li {
list-style-type: none;
margin-left: auto;
margin-right: auto;
text-align: center;
margin-bottom: 5px
}

.pay li img{
margin-left: auto;
margin-right: auto
}
	  

/* コピーライト */
.copy p{
	font-size: 11px;
	color:#265CFF;
	text-align:center;
	letter-spacing: 0.2em;
	}

/* ########### 427px 以下 ########### */
@media (max-width:427px){
	
/*フッター予約ボタンsp*/
.contact-sp{
width: 100%;
height: 50px;
background: #265CFF;
margin-left: auto;
margin-right: auto;
display: flex;
position: fixed;
bottom: 0; /*下に固定*/
z-index: 10;
}
.contact-sp ul {
margin: auto;
width: 95%;
}
.contact-sp ul {
position:relative;/*絶対値指定の親要素に必要*/
display:flex;/*要素を横並びに*/
justify-content:space-between;/*横並びにした要素を両端に配置*/
}
.contact-sp ul:before {
content:"";/*疑似要素の中身を指定*/
position:absolute;/*絶対位置指定*/
left:50%;/*横位置の指定*/
top:0;/*縦位置の指定*/
bottom:0;
background:#fff;/*線の色指定*/
width:1px;/*線の幅指定*/
height:100%;/*線の高さ指定*/

}
.contact-sp li{
list-style:none;
text-align: center;
margin-left: auto;
margin-right: auto;
padding-right: 5px
}
    
.contact-sp p{
color: #fff;
font-size: 12px;
letter-spacing: 0em;
padding-top: 0px;
margin-top: 0px;
text-align: center;
font-family: "Klee One", cursive;
font-weight: 400;
font-style: normal;
}

.contact-sp a{
color: #fff;
font-size: 16px;
display: block;
text-decoration: none;
letter-spacing: 0em;
margin-bottom: 0px;
font-family: "Klee One", cursive;
font-weight: 500;
font-style: normal;
transition:all 0.3s;
}
.contact-sp a:hover {
color:#FFFF00
}

/* 支払いボタン */
.pay{
width: 95%;}

.pay li {
width: 60px;
}
.pay li img{
width: 75%;
}
}
/* ########### 427px 以下 ########### */
@media (max-width:427px){
/* フッター下部空き */
footer {
padding-bottom: 60px;
}
/* フッターロゴ */
h2 img{
max-width:140px;
height:auto;
margin-bottom: 30px}	
}
/* ########### 768px 以下 ########### */
@media (max-width:768px){

/*フッター予約ボタンpc*/
.contact{
display: none
}

/* お店情報をたてに並べる設定 */
.box-f1	{
	width: 100%;
}
.box-f2	{	
	width:100%}

.box-f {display:block;
width: 90%;
margin-left: auto;
margin-right: auto;
margin-bottom:50px;

}
footer p{
	font-size: 15px;
	line-height:32px;
	letter-spacing: 0em;
	text-align: left
}

}
/* ########### 428pxから768pxまで ########### */
@media screen and (min-width: 428px) and (max-width: 768px) {
/* フッター下部空き */
footer {
padding-bottom: 70px;
}
/*フッター予約ボタンsp*/
.contact-sp{
width: 100%;
height: 55px;
background-color: #265CFF;
margin-left: auto;
margin-right: auto;
display: flex;
position: fixed;
bottom: 0; /*下に固定*/
z-index: 10;
}
.contact-sp ul {
margin: auto;
width: 95%;
}
.contact-sp ul {
position:relative;/*絶対値指定の親要素に必要*/
display:flex;/*要素を横並びに*/
justify-content:space-between;/*横並びにした要素を両端に配置*/
}
.contact-sp ul:before {
content:"";/*疑似要素の中身を指定*/
position:absolute;/*絶対位置指定*/
left:50%;/*横位置の指定*/
top:0;/*縦位置の指定*/
bottom:0;
background:#fff;/*線の色指定*/
width:1px;/*線の幅指定*/
height:100%;/*線の高さ指定*/

}
.contact-sp li{
list-style:none;
text-align: center;
margin-left: auto;
margin-right: auto;
}
    
.contact-sp p{
color: #fff;
font-size: 13px;
letter-spacing: 0.1em;
padding-top: 0px;
margin-top: 0px;
text-align: center;
font-family: "Klee One", cursive;
font-weight: 400;
font-style: normal;
}

.contact-sp a{
color: #fff;
font-size: 17px;
display: block;
text-decoration: none;
letter-spacing: 0.1em;
margin-bottom: 2px;
font-family: "Klee One", cursive;
font-weight: 500;
font-style: normal;
transition:all 0.3s;
}
.contact-sp a:hover {
color:#FFFF00
}
/* フッターロゴ */
h2 img{
max-width:140px;
height:auto;
margin-bottom: 30px}
	
/* 支払いボタン */
.pay{
width: 90%;}

.pay li {
width: 60px;
}
.pay li img{
width: 75%;
}
}
/* ########### 769px 以上 ########### */
@media (min-width:769px){
/* フッター下部空き */
footer {
padding-bottom: 15px;
}
/*フッター予約ボタンsp*/
.contact-sp{
display: none
}
/*フッター予約ボタン*/
.contact{
	width: 95%;
	height: 135px;
	border: 1px solid #265CFF;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 50px;
	padding-top: 15px;
	padding-bottom: 0px;
}
.contact ul {position:relative;/*絶対値指定の親要素に必要*/
display:flex;/*要素を横並びに*/
justify-content:space-between;/*横並びにした要素を両端に配置*/
}
.contact ul:before {
content:"";/*疑似要素の中身を指定*/
position:absolute;/*絶対位置指定*/
left:50%;/*横位置の指定*/
top:20%;/*縦位置の指定*/	
background:#265CFF;/*線の色指定*/
width:1px;/*線の幅指定*/
height:60%;/*線の高さ指定*/

}
.contact li{
padding:0px;/*余白指定*/
list-style:none;/*リストスタイルを非表示に*/
text-align: center;
margin-left: auto;
margin-right: auto;
}
    
.contact p{
color: #265CFF;
font-size: 17px;
letter-spacing: 0.1em;
padding-top: 0px;
margin-top: 0px;
text-align: center;
font-family: "Klee One", cursive;
font-weight: 400;
font-style: normal;
}

.contact a{
color: #265CFF;
font-size: 19px;
display: block;
text-decoration: none;
letter-spacing: 0.25em;
margin-top: 10px;
margin-bottom: 10px;
font-family: "Klee One", cursive;
font-weight: 600;
font-style: normal;
transition:all 0.3s;
}
.contact a:hover {
color:#FFFF00
}
.contact span {
font-size: 13px;
color: #265CFF;
letter-spacing: 0.10em;
}
/*==================================================
コチラ
===================================*/

.rese_btn {
  display: inline-block;
  width: 125px;
  text-align: center;
  text-decoration: none;
  color: #265CFF;
font-family: "Klee One", cursive;
font-weight: 600;
font-style: normal;
}
.rese_btn a {
  display: inline-block;
  width: 125px;
  text-align: center;
  text-decoration: none;
  color: #265CFF;
  position: relative;
  font-size: 20px;
}

.rese_btn a:hover {
 opacity: 0.7;
color:#FFFF00;
}
.rese_btn a:hover::before {
right: -5px;
opacity: 0.7;
color:#FFFF00;
}
/* お店情報を横に2つ並べる設定 */
.box-f1	{
	width: 25%;
	margin-right:15px;
}
.box-f2	{	
	width: 75%}

.box-f {display: flex;
width: 100%;
margin-left: auto;
margin-right: auto;
margin-bottom:50px;
}
/* フッターロゴ */
h2 img{
	max-width:120px;
	height:auto;
	}
footer p{
	font-size: 15px;
	line-height:30px;
	letter-spacing: 0.08em;
	text-align: left
}
/* 支払いボタン */
.pay{
width: 100%;}
.pay li {
width: 53px;
}
.pay li img{
width:72%;
}
}