@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
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/


@import url('https://fonts.googleapis.com/css2?family=Zen+Old+Mincho:wght@400;700&display=swap');
*{
	font-family: 'Zen Old Mincho', serif;
}
@font-face {
	font-family: "aoyagireisyosimo";
	src: url('https://egao-kushi.com/wp-includes/fonts/aoyagireisyosimo_ttf_2_01.woff2') format('woff2'),
	url('https://egao-kushi.com/wp-includes/fonts/aoyagireisyosimo_ttf_2_01.woff') format('woff'),
	url('https://egao-kushi.com/wp-includes/fonts/aoyagireisyosimo_ttf_2_01.ttff') format('truetype');
}


/************************************
** ページをフェードイン表示する
************************************/
.body {
	animation: fadein 2s forwards; /*アニメーション指定*/
	font-family: dnp-shuei-gothic-gin-std, sans-serif;
    font-style: normal;
	font-weight: 400;
}

@keyframes fadein {
	0% {opacity: 0} /*アニメーション開始時*/
	100% {opacity: 1} /*アニメーション終了時*/
}
/* クラス単位でのフェードイン設定 */
.fade-in {
    opacity: 0; 
    transition: all 1.5s;
    transform: translate(0,30px);
}
.scrollin{
    opacity: 1 !important;
    transform: translate(0, 0) !important;
}

/* クラス単位での下から遅れてフェードイン設定 */
.fade-in-slide {
    opacity: 0; 
    transition: all 3.0s;
    transform: translate(0,100px);
}
.side-scrollin{
    opacity: 1 !important;
    transform: translate(0, 0) !important;
}

/* クラス単位での右横からフェードイン設定 */
.fade-in-rightslide {
    opacity: 0; 
    transition: all 1.5s;
    transform: translate(100px,0);
}
.rightside-scrollin{
    opacity: 1 !important;
    transform: translate(0, 0) !important;
}

/* クラス単位での左横からフェードイン設定 */
.fade-in-leftslide {
    opacity: 0; 
    transition: all 1.5s;
	transform: translate(-100px,0);
}
.leftslide-scrollin{
    opacity: 1 !important;
    transform: translate(0, 0) !important;
}
/************************************
** ページをフェードイン表示する(ここまで)
************************************/

#lp_ls_img{
	display: none;
}



/************************************
** 全体装飾(ここから)
************************************/

/* トップのパディング設定 */
main#main.main{
	/* padding: 36px 29px;*/
}

/* トップのマージン設定 */
.entry-content {
    margin-top: 0;
    /* margin-bottom: 3em;*/
}

/* 更新日付の非表示 */
/*
div.date-tags{
	display: none;
}
*/

/* 日付の表示 */
/*
.display-none {
    display: block;
}
div.eye-catch-wrap.display-none{
	display: none;
}
*/
div.new-entry-card-date.widget-entry-card-date.display-none{
	display: block;
}


/* LINEボタン装飾 */
a.line-button img{
	height: 45px;
}
/************************************
** 全体装飾(ここまで)
************************************/



/************************************
** ヘッダー(ここから)
************************************/
/* ハンバーガーメニュー */
.header_inner{
	z-index: 999;
	position: fixed;
	top: 2.8%;
	right: 3%;
}
.drawer_btn {
  position: relative;
  width: 3rem;
  height: 3rem;
  background-color: transparent;
  border: none;
  cursor: pointer;
  z-index: 999;
}

.drawer_btn > span {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2rem;
  height: 2px;
  background-color: black;
  transform: translateX(-50%);
}

.drawer_btn > span:nth-of-type(1) {
  transform: translate(-50%, calc(-50% - 0.5rem));
}

.drawer_btn > span:nth-of-type(2) {
  transform: translate(-50%, -50%);
}

.drawer_btn > span:nth-of-type(3) {
  transform: translate(-50%, calc(-50% + 0.5rem));
}

.drawer_btn.js-active > span:nth-of-type(1) {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.drawer_btn.js-active > span:nth-of-type(2) {
  opacity: 0;
}

.drawer_btn.js-active > span:nth-of-type(3) {
  transform: translate(-50%, -50%) rotate(45deg);
}

.drawer_line{
	transition: all 0.3s;
}

.drawer_nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.5);
  opacity: 0;
  visibility: hidden;
  transition: transform 0.3s ease;
}
.drawer_nav.js-active {
  opacity: 1;
  visibility: visible;
}
.drawer_nav.js-active .drawer_nav_inner {
  transform: translateX(0);
}


.drawer_nav_inner {
  width: 30%;
  height: 100%;
  background-color: #f49d1e;
  opacity: 0.8;
  padding: 4rem 1.5rem 1rem;
  margin-left: auto;
  transform: translateX(100%);
  transition: transform 0.3s ease;
}



.drawer_nav_list,
.drawer_nav_panel {
  list-style: none;
  padding: 0;
}

.drawer_nav_link,
.drawer_nav_sub-link {
  display: block;
  color: black;
  text-decoration: none;
  padding: 1rem;
  border-bottom: solid 1px lightgray;
  position: relative;
}

.accordion-toggle {
  position: absolute;
  top: 50%;
  right: 10px;
  background: transparent;
  border: none;
  width: 2rem;
  height: 2rem;
  transform: translateY(-50%);
  cursor: pointer;
}

.accordion-toggle::before {
  content: "▶";
  display: block;
  text-align: center;
}

.drawer_nav_link.active + .accordion-toggle::before {
  content: "▼";
}

.drawer_nav_panel {
  display: none;
}


/* 画面トップに更新日付がでるため非表示対応 2025/4/18 */
div.date-tags{
	display: none;
}

/************************************
** ヘッダー(ここまで)
************************************/

/************************************
** フッター(ここから)
************************************/

aside#custom_html-5.widget_text.widget.widget-footer-mobile.widget_custom_html{
	text-align: center;
}

.footer_instagram_wrap{
  display: flex;
}
.footer_instagram_message{
	width: 70%;
	text-align: center;
}

.footer_instagram_image{
	width: 30%;
	height: auto;
}

h3.widget-footer-center-title.footer-title.widget-title{
  font-size: 1rem;
}
.line-button{
	margin-top: 2%;
}

/* フロートボタン */
.go-to-top-button {
	color: #fff;
    background-color: #f49d1e;
    border-radius: 50%;
}



/* モバイルスライドインメニュー */
ul.mobile-footer-menu-buttons.mobile-menu-buttons, div#sidebar-menu-content.sidebar-menu-content.menu-content{
	background-color: #f49d1e;
	opacity: 0.8;
}


/************************************
** フッター(ここまで)
************************************/




/************************************
** トップページ(ここから)
************************************/

/***** 非表示設定(ここから) ****/
/* サイドバーの削除 
div#sidebar.sidebar.nwa.cf{
	display: none;
}*/
/***** 非表示設定(ここまで) ****/


/*********** ファーストビュースライダー(ここから) ***********/
/* レスポンシブ対応版を非表示 */
.fview_main-contents-respo{
	display: none;
}

.fview_main-contents{
	margin-bottom: 5%;
}
.fview_main-contents-wrap{
  position: relative;
  display: block;
  width: 100vw;
  width: 100%;
	/*max-width: 1690px;*/
  height: auto;
  text-align: center;
  margin: 0 auto;
}
.fview_main-contents_slideshow {
  width: 100%;
  height: auto;
	pointer-events: none;
}
.fview_main-contents_slideshow img {
	width: 100%;
	height: auto;
	max-height: 700px;
	object-fit: cover;
}
@keyframes zoomUp {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.15); 
  }
}
.add-animation {
  animation: zoomUp 10s linear 0s normal both;
}

/* slickのprevとnextの調整 */
.slick-prev,
.slick-next
{
    z-index: 100;
	background-color: #FDD000;
	border-radius: 10px;
}
.slick-prev:before,
.slick-next:before
{
    color: #5AB655;
}

ul.slickdots{
	z-index: 200;
	background-color: #333;
}


/* ファーストビュー内の文字 */
.fview_main-contents_message-one{
  position: absolute;
  top: 15%;
  right: 10%;
  color: #fff;
  font-size: 42px;
  font-weight: bold;
}
.fview_main-contents_message-one{
  animation: fadein_normalone 5s forwards;
}
@keyframes fadein_normalone {
  0%  {
      opacity: 0; 
      transition: all 1.5s;
      transform: translate(0,-30px);
  }
  100%  {
      opacity: 1;
      transform: translate(0, 0);
  }
}

.fview_main-contents_message-two{
  position: absolute;
  top: 15%;
  left: 20%;
  color: #fff;
  font-size: 42px;
  font-weight: bold;
}
.fview_main-contents_message-two{
  animation: fadein_normaltwo 5s forwards;
}
@keyframes fadein_normaltwo {
  0%  {
      opacity: 0; 
      transition: all 1.5s;
      transform: translate(0,-30px);
  }
  30%  {
      opacity: 0; 
      transition: all 1.5s;
      transform: translate(0,-30px);
  }
  100%  {
      opacity: 1;
      transform: translate(0, 0);
  }
}

.fview_main-contents_message-three{
  position: absolute;
  top: 15%;
  left: 10%;
  color: #fff;
  font-size: 42px;
  font-weight: bold;
}

.fview_main-contents_message-three::first-letter{
	color: #f49d1e;
	font-size: 4rem;
}
.fview_main-contents_message-three{
  animation: fadein_normalthree 5s forwards;
}
@keyframes fadein_normalthree {
  0%  {
      opacity: 0; 
      transition: all 1.5s;
      transform: translate(0,-30px);
  }
  60%  {
      opacity: 0; 
      transition: all 1.5s;
      transform: translate(0,-30px);
  }
  100%  {
      opacity: 1;
      transform: translate(0, 0);
  }
}

.fview_main-contents_message p{
	writing-mode: vertical-rl;
	font-family: 'aoyagireisyosimo';
	text-shadow: 0px 0px 5px #444444;
}


/*********** ファーストビュースライダー(ここまで) ***********/


/************** top_center-gray(ここから) **************/
.top_center-gray{
	padding-bottom: 3%;
}
.top_center-gray, .top_notice-title, .top_greeting-title{
	background-color: #eeeeee;
}
/* お知らせ欄 */
div.new-entry-cards.widget-entry-cards.no-icon.cf.border-partition{
	width: 80%;
	margin: 0 auto;
}
.top_notice-title{
	text-align: center;
}

/* 営業日カレンダー */
.top_calendar_wrap{
	width: 80%;
	margin: 0 auto;
}
.top_calendar{
	display: block;
	margin: 0 auto;
}
.top_calendar-caution{
	max-width: 800px;
	margin: 0 auto;
	font-size:  0.8rem;
}

/* カラムのmax値設定 */
.top_concept-column, .top_greeting-column{
	max-width: 1500px;
	margin: 0 auto;	
}

/* コンセプト */
.top_concept-title{
	width: 100%;
	text-align: center;
}
.top_concept-title::first-letter{
	color: #f49d1e;
	font-size: 2rem;
}
.top_concept-column{
	width: 90%;
}
.is-layout-flex > :is(*, div){
	margin: 0 auto;
}

.top_concept-column_right-wrap {
	margin: 0 auto;
}

.top_concept-column_right_back {
}

.top_concept-column_right_front {
	object-fit: cover;
	max-width: 90%;
	margin: 0 auto;
}
.top_concept-column_right_front img{
	box-shadow: -10px 10px #f49d1e
}

/* 店主あいさつ */
.top_greeting-title{
	width: 100%;
	text-align: center;	
}
.top_greeting-column{
	width: 90%;
}

.top_greeting-column_left-wrap {
	margin: 0 auto;
}

.top_greeting-column_left_back {
}

.top_greeting-column_left_front {
	max-width: 90%;
	object-fit: cover;
	margin: 0 auto;
}
.top_greeting-column_left_front img{
	box-shadow: 10px 10px #f49d1e;
}


/************** top_center-gray(ここまで) **************/


/************** 店内のご案内(ここから) **************/
.top_shop-guid-title{
	text-align: center;
	background-color: #fff !important;
}
/* 画像ファイルのサイズ調整 */
.top_shop-guid_pic-roll{
	margin-bottom: 5%;
}
.top_shop-guid_pic-roll img{
	height: 95%;
	width: auto;
  max-width: 300px;
}

/* ul要素の全体を横並びにして、横スクロールバーを非表示にする */
.top_shop-guid_pic-roll_wrapper{
  display: flex;
  align-items: center;
  height: 200;
  width: 100%;
  overflow: hidden;
}

/* Ul要素を横並びにし、アニメーションを付ける*/
.top_shop-guid_pic-roll ul {
  list-style: none;
}
.top_shop-guid_pic-roll ul  li{
  height: 250px;
}
.top_shop-guid_pic-roll .top_shop-guid_pic-roll_slideshow{
  display: flex;
  animation: loop-slide 50s infinite linear 1s both;
}
ul.top_shop-guid_pic-roll_slideshow{
	padding-left: 0;
}
@keyframes loop-slide {
  from {
    transform: translateX(0); /* 開始地点の指定なし＝動かしていない状態 */
  }
  to {
    transform: translateX(-100%); /* 親要素（.wrapperの幅100％分左方向に移動させる状態 */
  }
}

/* hover時にアニメーションを停止し、浮き上がらせる */
.slide-paused:hover .top_shop-guid_pic-roll_slideshow {
  animation-play-state: paused;
}
.content-hover{
  transition: all 0.2s;
}
.content-hover:hover {
	/*
  transform: translateY(-20px);
  border-radius: 0 10%;
  box-shadow: 0 3px 10px 0 #333;
  opacity: 0.8;
  cursor: pointer;
	*/
}
/************** 店内のご案内(ここまで) **************/


/************** 店舗情報(ここから) **************/
.top_shop-guid-title{
	text-align: center;
	background-color: #eeeeee;
}

.top_shop-info_table tr {
    background-color: var(--cocoon-xxx-thin-color);
}

.top_shop-info_table{
	table-layout: auto;
	width: 100%;
}


/************** 店舗情報(ここまで) **************/



/************** インスタグラム(ここから) **************/
div.sbi_feedtheme_header_text h3{
	border: none;
	color: #333;
}
p.sbi_bio{
	color: #333;
}
#sb_instagram{
	max-width: 1500px;
	width: 90%;
	margin: 0 auto;	
}
/************** インスタグラム(ここまで) **************/

/************************************
** トップページ(ここまで)
************************************/








/************************************
** メニューページ(ここから)
************************************/
/***** ヘッダータイトル *****/
.menu-toptitle{
	line-height: 300px;
	text-align: center;
	font-size: 48px;
	letter-spacing: 0.5rem;
    color: #fefefe;
	text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
	font-family: 'aoyagireisyosimo';
	width: 100%;
	background-image: url('https://egao-kushi.com/wp-content/uploads/2025/04/food_top.webp');
	background-size: cover;
	background-repeat: no-repeat;
}
p.menu-toptitle{
	margin-bottom: 0;
}

/* 各コンテンツのフォント調整 */
.menu_contents-title{
	color: #fefefe;
	text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
	font-family: 'aoyagireisyosimo';
}

/* 画像サイズの統一 */
	img.wp-image-403, img.wp-image-308, img.wp-image-314, img.wp-image-407, img.wp-image-408, img.wp-image-452, img.wp-image-405, img.wp-image-404{
		margin: 0 auto;
		max-width: 600px;
		width: 100%;
		height: auto;
	}

/* 各フレックスのMAX値設定 */
.menu_flex-box, .modal-open_wrap{
	max-width: 1500px;
	margin: 0 auto;
}



/***** トップメッセージ(ここから) *****/
.menu_top-wrap{
  position: relative;
  height: 100vh;
  width: 90%;
  margin: 0 auto;
  background-color: #fefefefe;
  margin-top: 5%;
  margin-bottom: 5%;
  background-image: url("https://egao-kushi.com/wp-content/uploads/2025/04/IMG_3837-scaled.webp");
  background-repeat: no-repeat;
  background-size: cover;
  background-color:rgba(255,255,255,0.8);
  background-blend-mode:lighten;
}

.menu_top-txt{
  position: absolute;
  top: 10%;
  left: 10%;
  z-index: 1;
}
.menu_top-txt_line{
  font-size: 2.4rem;
  text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
  letter-spacing: 0.2rem;
  text-decoration: underline #ff0000;
  -webkit-text-decoration: underline #ff0000;
  text-underline-offset: 8px;
}
table.menu_top-txt_line{
	margin-bottom: 1rem;
}
.menu_top-txt_box{
  width: 70%;
}
.menu_char{
  font-size: 3.6rem;
  color: #f49d1e;
}
.menu_char_small{
  font-size: 2rem;
}

.menu_top-pic{
  position: absolute;
  top: 15%;
  left: 50%;
  z-index: 0;
}
.menu_top-pic img{
  width: 60%;
  height: auto;
  box-shadow: 10px 10px #f49d1e;
}
/***** トップメッセージ(ここまで) *****/


/***** モーダルメニュー(ここから) *****/
/* モーダルを開くボタン */
.modal-open_wrap{
  display: flex;
  justify-content: space-evenly;
  width: 70%;
  margin: 0 auto;
}
.modal-open{
  width: auto;
  min-width: 30%;
  height: 60px;
  color: #fff;
  background: #000;
  border: none;
  cursor: pointer;
}


/* クラスが追加された時の指定 */
.menu_pop1.is-active, .menu_pop2.is-active, .menu_pop3.is-active{
  opacity: 1;
  visibility: visible;
}


/* モーダルを閉じるボタンの指定 */
.modal-close{
  width: 30%;
  text-align: center;
  background: #000;
  cursor: pointer;
  margin: 0 auto;
}
.modal-close p{
	color: #ffffff;
	padding: 3% 0;
}


/****** モーダル本体 ******/
.menu_title{
	font-size: 1.6rem;
	font-weight: bold;	
}

/* 食べ物メニュー */
.menu_pop1{
  width: 100%;
  height: 100vh;
  background: rgba(0,0,0,0.47);
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  z-index: 97;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
}

.menu_foods_wrap{
  overflow: auto;
  position: fixed;
  width: 90%;
  height: 80vh;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  background: #D2BBA7;
  z-index: 100;
}
.menu_foods p{
  text-align: center;
}

/* メニューボックス */
.menu_foods_box{
  width: 45%;
  margin: 0 auto;
}
.menu_foods_box_title{
  text-align: center;
}
.menu_foods_box table{
	width: 100%;
	border-spacing: 0;
}
.menu-price{
  text-align: right;
}
.menu-table_line td{
  border-bottom: solid 0.5px #000000 !important;
}

/* 飲み物メニュー */
.menu_pop2{
  width: 100%;
  height: 100vh;
  background: rgba(0,0,0,0.47);
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  z-index: 97;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
}

.menu_drink_wrap{
  overflow: auto;
  position: fixed;
  width: 90%;
  height: 80vh;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  background: #D2BBA7;
  z-index: 100;
}
.menu_drink p{
  text-align: center;
}

/* メニューボックス */
.menu_drink_box{
  width: 45%;
  margin: 0 auto;
}
.menu_drink_box_title{
  text-align: center;
}
.menu_drink_box table{
  width: 100%;
  border-spacing: 0;
}
.menu-price{
  text-align: right;
}
.menu-table_line td{
  border-bottom: solid 0.5px #000000 !important;
}

/* マージン */
.menu_foods_wrap, .menu_drink_wrap{
	padding-top: 5%;
}
div.menu_foods_box_title p, div.menu_drink_box_title p{
  margin-bottom: 1rem;
}


/* テイクアウトメニュー */
/* 基本は飲み物メニューを流用 */
.menu_pop3{
  width: 100%;
  height: 100vh;
  background: rgba(0,0,0,0.47);
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  z-index: 97;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
}

.menu_tk{
  width: 45%;
  margin: 0 auto;
}
p.menu_tk_title{
	margin-bottom: 1rem;
}



/***** モーダルメニュー(ここまで) *****/
.menu_contact-wrap{
	
}
p.menu_contact-txt, p.menu_modalbottn-txt{
	width: 80%;
	text-align: center;
	margin: 0 auto;
}

/************************************
** メニューページ(ここまで)
************************************/





/************************************
** 予約ページ(ここから)
************************************/

/*** pcとスマホで電話番号表示を切り替え ***/
.reserve_btn--tel-pc{
	display: block;
}

a.reserve_btn.reserve_btn--tel{
	display: none;
}

/*** サブタイトルのマージン調整 ***/
.reservation_subtitle{
	margin-bottom: 1rem !important;
}

/*** ボタン装飾 ***/
p.reserve_btn-message{
	margin-bottom: 0 !important;
	font-size: 0.9rem;
}

/* Web予約ボタンのみ(TELはレスポンスのみ)*/
.reserve_btn,
a.reserve_btn,
button.reserve_btn {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #FF9D14;
  border-radius: 0.5rem;
}

.reserve_btn-wrap-pc-sp {
  max-width: 435px;
  margin: 0 auto 20px;
}

a.reserve_btn-pc-sp {
  line-height: 1.4;
  width: 49.5%;
  padding: 1.25rem 0;
  color: #ffff;
}

a.reserve_btn--contact {
  display: block;
  padding: 1.5rem 0;
  color: #fff;
  background: #FF9D14;
  -webkit-box-shadow: 0 5px 0 #ff4b14;
  box-shadow: 0 5px 0 #ff4b14;
}

a.reserve_btn--contact i {
  font-size: 2rem;
}

a.reserve_btn--contact i.fa-position-left {
  font-size: 2.6rem;
  left: 2rem;
}

a.reserve_btn--contact :hover {
  color: #fff;
}

.fa-position-left {
  position: absolute;
  top: calc(50% - 0.5em);
  left: 1rem;
}

.fa-position-right {
  position: absolute;
  top: calc(50% - 0.5em);
  right: 1rem;
}



/************************************
** 予約ページ(ここまで)
************************************/


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




/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
	aside#custom_html-7.widget_text.widget.widget-footer-center.widget_custom_html{
		text-align: center;
	}
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	
	
	 .header-container-in.hlt-top-menu {
        flex-direction: row;
    }
	
	/* ハンバーガーメニューのフォントサイズ */
	ul.drawer_nav_list{
		font-size: 0.9rem;
	}
		
	aside#custom_html-6.widget_text.widget.widget-footer-mobile.widget_custom_html{
		text-align: center;
	}
	
	/* テイクアウトメニュー */
	.menu_tk{
 	  width: 90%;
   }
}

/*782px以下*/
@media screen and (max-width: 782px){
  /*必要ならばここにコードを書く*/
	
	/* ハンバーガーメニュー */
	.header_inner{
		top: 4.5%;
		right: 3%;
	}
	.drawer_nav_inner {
		width: 60%;	
	}
	
	/* スペーサーの削除 */
	.menu_kushispacer{
		display: none;
	}
	
	
	/*********** top_center-gray(ここから) ***********/
	.top_center-gray {
		padding-top: 3%;
		padding-bottom: 10%;
		padding-left: 3%;
		padding-right: 3%;
	}
	
	/**** コンセプト ****/
	.top_concept-column{
	}
	.top_concept-column_right-wrap{
	}
	.top_concept-column_right_front{

	}
	.top_concept-column_right_back{
	}
	
	/**** 店主ごあいさつ ****/
	/* カラムの順番入れ替え */
	.top_greeting-column{
		flex-direction: column-reverse;
	}
	/* ボックスサイズ調整 */
	.top_greeting-column_left-wrap{
		padding: 0;
	}
	div.top_greeting-column_left_front{
		height: 150px;
		width: 250px;
		position: static;
	    background-size: cover;
	}
	.top_greeting-column_left_back{
		top: 20%;
        left: 3%;
		height: 150px;
		width: 250px;		
	}
	
	
	.top_shop-guid-title{
		margin-bottom: 1rem !important;
	}
	.top_shop-guid_message{
		width: 80%;
		margin: 0 auto;
	}
	/*********** top_center-gray(ここまで) ***********/
	
	
	.top_shop-info_table{
		margin: 0 auto;
	}
	img.wp-image-187{
		margin: 0 auto;
	}

	

	/*********** メニューページ(ここから) ***********/
	/* スマホの上下調整 */
	.menu_column_right-pic{
		flex-direction: column-reverse;
	}
	

	/* テキストエリアの調整 */
	p.menu_column_txt{
		width: 70%;
	}
	.menu_column_txt{
		margin: 0 auto;
	}
	
	/* 串魚とやまいものセンターリングのためにwith調整 */
	div.wp-block-columns.menu_column_right-pic.is-layout-flex.wp-container-core-columns-is-layout-2.wp-block-columns-is-layout-flex,div.wp-block-columns.menu_column_right-pic.is-layout-flex.wp-container-core-columns-is-layout-5.wp-block-columns-is-layout-flex{
		width: 100%;
		/* margin-bottom: 0 !important;*/
	}
	figure.wp-block-image.size-full{
		margin: 0 auto;
		width: 100%;
	}
	
	/* 全画像のサイズ調整 */
	img.wp-image-403, img.wp-image-308, img.wp-image-314, img.wp-image-407, img.wp-image-408, img.wp-image-452, img.wp-image-405, img.wp-image-404{
		margin: 0 auto;
		width: 300px;
		height: 225px;
	}
	
	/*** モーダルの幅調整 ***/
	.menu_foods_box, .menu_drink_box {
		width: 70%;
	}
	
	/* 電話連絡先の強制マージン */
	p.menu_contact-txt, p.menu_modalbottn-txt{
		text-align: left;
		margin: 0 auto !important; 
	}
	
	
	/*********** メニューページ(ここまで) ***********/
	
	
}

	

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
	/********** 全体装飾(ここから) ************/
	main#main.main{
		padding-top: 0;
	}
	/********** 全体装飾(ここまで) ************/

	
	/********** ヘッダー(ここから) ************/
	.logo-menu-button img {
		margin-left: 0;
	}
	a.site-name.site-name-text-link{
		margin-left: 0 !important;
	}
	
	/********** ヘッダー(ここまで) ************/
	
	
	
	
	
	/********** フッター(ここから) ************/
	h3{
		font-size: 1rem !important;
    }
	/********** フッター(ここまで) ************/
	
	
	
	
	/*********** ファーストビュースライダー(ここから) ***********/	
	/* ファーストビュー切り替え */
    .fview_main-contents{
		display: none;
    }
    .fview_main-contents-respo{
		display: block;
    }
	.fview_main-contents_message-one{
		top: 10%;
		right: 10%;
		font-size: 32px;
	}
    .fview_main-contents_message-two{
		top: 10%;
		left: 25%;
		font-size: 32px;
	}
    .fview_main-contents_message-three{
		top: 10%;
		left: 0;
		font-size: 32px;
	}
	/*********** ファーストビュースライダー(ここまで) ***********/

	
	/*********** top_center-gray(ここから) ***********/
	.top_center-gray {
		padding-top: 3%;
		padding-bottom: 10%;
		padding-left: 3%;
		padding-right: 3%;
	}
	
	/**** コンセプト ****/
	/*
	.top_concept-column{
		
	}
	.top_concept-column_right-wrap{
		padding-top: 0;
		padding-bottom: 50%;
	}
	.top_concept-column_right_front{
		position: static;
		height: 150px;
		width: 250px;
	}
	.top_concept-column_right_back{
		top: 18%;
        left: 12%;
		height: 150px;
		width: 250px;
	}*/
	
	/**** 店主ごあいさつ ****/
	/* カラムの順番入れ替え */
	.top_greeting-column{
		flex-direction: column-reverse;
	}
	/* ボックスサイズ調整 */
	.top_greeting-column_left-wrap{
		padding: 0;
	}
	div.top_greeting-column_left_front{
		height: 150px;
		width: 250px;
		position: static;
	    background-size: cover;
	}
	.top_greeting-column_left_back{
		top: 20%;
        left: 3%;
		height: 150px;
		width: 250px;		
	}
	
	
	.top_shop-guid-title{
		margin-bottom: 1rem !important;
	}
	.top_shop-guid_message{
		width: 80%;
		margin: 0 auto;
	}
	/*********** top_center-gray(ここまで) ***********/	


    /************************************
    ** メニューページ(ここから)
    ************************************/
	.menu_top-wrap{
	  height: 80vh;
	  width: 90%;
	  margin-top: 3%;
	  margin-bottom: 3%;
	}
	.menu_top-txt{
	  top: 5%;
	  left: 10%;
	}
	.menu_top-txt_line{
	  font-size: 1.4rem;
	  letter-spacing: 0.1rem;
	  width: 100%;
	}
	.menu_top-txt_box{
	  width: 90%;
	  font-size: 1.2rem;
	  text-shadow: 2px 3px 3px rgba(254, 254, 254, 0.8);
	}
	.menu_char{
	  font-size: 2.0rem;
	  color: #f49d1e;
	}
	.menu_char_small{
	  font-size: 0.8rem;
	}

	.menu_top-pic{
	  top: 15%;
	  left: 50%;
	}
	.menu_top-pic img{
	  width: 100%;
	  height: auto;
	}

    /************************************
    ** メニューページ(ここから)
    ************************************/

	
    /************************************
    ** 予約ページ(ここから)
    ************************************/
	.reserve_btn--tel-pc{
		display: none;
	}
	a.reserve_btn.reserve_btn--tel{
		display: block;
	}
	
	/*** ボタン設定 ***/
	a.reserve_btn--tel {
		display: block;
		margin-top: 15px;
		padding: 1rem 0;
		color: #fff;
		background: #094;
		-webkit-box-shadow: 0 5px 0 #008039;
		box-shadow: 0 5px 0 #008039;
	}
	.reserve_btn, a.reserve_btn, button.reserve_btn{
		font-size: 1rem;
	}
	
	/* Webボタン */
	a.reserve_btn--contact i.fa-position-left {
 		font-size: 2rem;
		left: 2rem;
	}
	
	/* 電話ボタン */
	a.reserve_btn--tel i {
		font-size: 2rem;
		}

	a.reserve_btn--tel i.fa-position-left {
		font-size: 2rem;
		left: 2rem;
		}

	a.reserve_btn--tel .number {
		line-height: 1;
		display: inline-block;
		margin-top: 0.5rem;
		padding: 0.25rem 1.5rem;
		letter-spacing: 0;
		color: #094;
		border-radius: 0.5rem;
		background: #fff;
	}

	a.reserve_btn--tel:hover {
		color: #fff;
	}
	
	/************************************
    ** 予約ページ(ここまで)
    ************************************/
	
	/************** インスタグラム(ここから) **************/
	a.sbi_photo{
	}
	#sb_instagram .sbi_photo img{
		object-fit: contain;
	}
	/************** インスタグラム(ここまで) **************/
	
}

/*375px以下*/
@media screen and (max-width: 375px){
	/*必要ならばここにコードを書く*/
	.top_concept-column {
		padding-bottom: 20%;
    }
	.top_concept-column_right_front{
		position: absolute;
		height: 150px;
		width: 250px;
	}
	.top_concept-column_right_back{
		left: 6%;
	}
	
	.menu_top-txt_box{
	  font-size: 1.0rem;
	}
	.menu_top-pic{
 	  left: 45%;
	}
}