@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.pagetitle{
  position: relative;
  }

.pagetitle h2 {
  position: absolute;
  font-size:3em;
  color: rgba(255, 255, 255, 0.7);
  bottom: 20px;
  right:20px;
  }
	#top_con_1,#top_con_2{
		overflow:hidden;
		clear:both;
		padding:2em 0;
		}	
	#top_con_1 article{
		float:right;
		width:70%;
		}
	#top_con_2 article{
		float:left;
		width:70%;
		}
	#top_con_1 .top_con_image{
		width:28%;
		float:left;
		}
	#top_con_2 .top_con_image{
		width:28%;
		float:right;
		}
	.top_con_image img{
		width:100%;
		}


.menu_button li{
  width:22%;
  margin:1%;
  display:inline-block;
	}
.menu_button li a{
  display: flex;
  justify-content: center;
  align-items: center;
  color: #263822;
  text-align: center;
  text-decoration: none;
  height: 100px;
  padding: 10px 10px 10px 70px;
  background-color: #ffffff;
  border: 3px solid #263822;
  border-radius: 10px;
  box-sizing: border-box;
  position: relative;
  transition-duration: 0.3s;
  width:100%;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow: 0 0 6px 0 
      rgba(0, 0, 0, 0.5);
    transition: 0.2s;
}

.menu_button li a::before {
  content: '';
  width: 60px;
  height: 60px;
  position: absolute;
  top: 50%;
  left: 10px;
  margin-top: -30px;
  background-size: contain;
  background-repeat: no-repeat;
}


.menu_button li a span {
	font-size: 16px;
	line-height: 1;
}
.menu_button li a span span{
display: block;
  font-size: 11px;
  }

.menu_button li a:hover {
	transform: translateY(-5px);
	cursor: pointer;
}
.menu_list h4{
	margin-top:1.5em;
	clear:both;
	}
.menu_con{
	clear:both;
	padding:2em;
	padding-right:15%;
	margin:3em 0;
	border:solid 1px #c1a25f;
	border-radius: 10px;
	font-size:0.8em;
	}
	.menu_con p img{
		float:right;
		}
.menu_box{
	width:72%;
	margin:0 0 1em 2em;
	float:left;
	}
.menu_imgbox{
	width:20%;
	float:right;
	margin:0 2em 1em 0;
	text-align:center;
	}
	.menu_imgbox img{
		width:100%;
		}
.menu_name{
	display:inline-block;
	width:78%;
	margin-top:1.5em;
	}
.menu_price{
	display:inline-block;
	width:20%;
	}
	

.menulist_table,.menulist_table td{
	border:none;
}

.menulist_table .menu_explain{
	display:block;
	margin-left:1em;
	font-size:0.8em;
	}
.menulist_table tr{
	border-bottom:1px dotted #ccc;
	
}
	.takeout{
		background: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_ippei.gif") no-repeat 98% 90%;
		}
	.teishoku{
		background: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_teishoku.gif") no-repeat 98% 90%;
		}
	.set{
		background: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_set.gif") no-repeat 98% 90%;
		} 
	.sand{
		background: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_sand.gif") no-repeat 98% 90%;
		}  
	.spa{
		background: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_spa.gif") no-repeat 98% 90%;
		} 
	.stake{
		background: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_stake.gif") no-repeat 98% 90%;
		}
	.full{
		background: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_full.gif") no-repeat 98% 90%;
		}
	.rice{
		background: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_rice.gif") no-repeat 98% 90%;
		}
	.lunch{
		background: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_lunch.gif") no-repeat 98% 90%;
		}
	.tanpin{
		background: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_tanpin.gif") no-repeat 98% 90%;
		}

.footer_banner li a img ,.banner2002 a img{
	border:solid #263822 1px;
}


a.btn_teishoku::before {
  background-image: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_teishoku.gif");
}
a.btn_takeout::before {
  background-image: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_ippei.gif");
}
a.btn_sand::before {
  background-image: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_sand.gif");
}
a.btn_spa::before {
  background-image: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_spa.gif");
}
a.btn_stake::before {
  background-image: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_stake.gif");
}
a.btn_full::before {
  background-image: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_full.gif");
}
a.btn_rice::before {
  background-image: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_rice.gif");
}
a.btn_lunch::before {
  background-image: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_lunch.gif");
}
a.btn_tanpin::before {
  background-image: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_tanpin.gif");
}
a.btn_side::before {
  background-image: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_salad.gif");
}
a.btn_drink::before {
  background-image: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_wine.gif");
}

a.btn_set::before {
  background-image: url("https://grill-ippei-ama.com/wp/wp-content/uploads/2024/08/menu_set.gif");
}

/*bgm */
/*concert*/
.artist_box{
	display:inline-block;
	width:30%;
	margin:3em 1%;
	vertical-align:top;
	}
	.artist_box dl{
		padding:1em;
		}
	.artist_box .artist{
		width:80%;
		text-align:center;
		margin-top:1em;
		}
	.artist_box .artist img{
		width:100%;
		}
	.artist_comment{
		font-size:0.8em;
		}
.artist_box dd{
	margin-left:0px;
}

		
/* フッター４つ並びバナー */
	ul.footer_banner{
		margin:2em 0;
		padding-bottom:2em;
		}	
		.footer_banner li img{
			width:100%;
			}
	.footer_banner li{
		display:inline-block;
		width:22%;
		margin:0.7%;
	
		}	
			
.footer_banner li a img ,.banner2002 a img,.blog_banner a img{
	border:solid #263822 1px;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow: 0 0 6px 0 
      rgba(0, 0, 0, 0.5);
    transition: 0.2s;
}
/* マウスオーバー時 */
.footer_banner li a:hover img,.banner2002 a:hover img,.blog_banner a:hover img{
      box-shadow: 0 4px 7px 0 rgba(0, 0, 0, 0.5);
      transform: translateY(-5px);
      cursor: pointer;
    }
a {
  transition: color .3s;
	}

a:hover {
  	opacity: 0.7;
	transition: .3s;
	}


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
	.menu_button li{
  width:30%;
  margin:1%;
  display:inline-block;
	}
.menu_button li a{
  display: flex;
  justify-content: center;
  align-items: center;
  color: #263822;
  text-align: center;
  text-decoration: none;
  height: 3em;
  padding: 0.5em;
  background-color: #ffffff;
  border: 2px solid #263822;
  border-radius: 5px;
  box-sizing: border-box;
  position: relative;
  transition-duration: 0.3s;
  width:100%;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow: 0 0 6px 0 
      rgba(0, 0, 0, 0.5);
    transition: 0.2s;
}

	
.pagetitle{
  position: relative;
  }

.pagetitle h2 {
  position: absolute;
  font-size:2em;
  color: rgba(255, 255, 255, 0.7);
  bottom: 5px;
  right:5px;
  }

.menu_button li a span {
	font-size: 1em;
	line-height: 1;
}

.menu_button li a{
  display: flex;
  justify-content: center;
  align-items: center;
  color: #263822;
  text-align: center;
  text-decoration: none;
  height: 60px;
  padding: 5px 5px 5px 65px;
  background-color: #ffffff;
  border: 2px solid #263822;
  border-radius: 10px;
  box-sizing: border-box;
  position: relative;
  transition-duration: 0.3s;
  width:100%;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow: 0 0 6px 0 
      rgba(0, 0, 0, 0.5);
    transition: 0.2s;
}
.menu_button li a::before {
  content: '';
  width: 50px;
  height: 50px;
  position: absolute;
  top: 50%;
  left: 10px;
  margin-top: -25px;
  background-size: contain;
  background-repeat: no-repeat;
}
	#top_con_1 article,#top_con_2 article{
		width:100%;
		float:none;
		}
	#top_con_1 .top_con_image,#top_con_2 .top_con_image{
		width:50%;
		float:none;
		text-align:center;
		}	
	
		.footer_banner li{
		width:47%;
		}
	
.artist_box{
	display:inline-block;
	width:100%;
	margin:1em 1%;
	vertical-align:top;
	}
	.artist_box dl{
		padding:1em;
		clear:both;
		line-height:2em;
		}
	.artist_box .artist{
		width:50%;
		text-align:center;
		margin-top:1em;
		}
	.artist_box .artist img{
		width:100%;
		}	
	
	ul.footer_banner {
	padding-left: 0px;
	}

  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
	.menu_button li{
  width:46%;
  margin:1%;
  display:inline-block;
	}
.menu_button li a span {
	font-size: 14px;
	line-height: 1;
}
	
.menu_button li a{
  display: flex;
  justify-content: center;
  align-items: center;
  color: #263822;
  text-align: center;
  text-decoration: none;
  height: 60px;
  padding: 5px 5px 5px 65px;
  background-color: #ffffff;
  border: 2px solid #263822;
  border-radius: 10px;
  box-sizing: border-box;
  position: relative;
  transition-duration: 0.3s;
  width:100%;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow: 0 0 6px 0 
      rgba(0, 0, 0, 0.5);
    transition: 0.2s;
}
.menu_button li a::before {
  content: '';
  width: 50px;
  height: 50px;
  position: absolute;
  top: 50%;
  left: 10px;
  margin-top: -25px;
  background-size: contain;
  background-repeat: no-repeat;
}
	ul.footer_banner {
	padding-left: 0px;
	}
		.footer_banner li{
		width:47%;

}
