/*------------------------------------------

MV

------------------------------------------*/

.mv {
  width: 100%;
  overflow: hidden;
  max-height: 600px;
}
.mv img {
  width: 100%;
  min-height: 100%;
  max-height: 600px;
  display: block;
  object-fit: cover;
}

.list {
  font-size: 1.3rem;
}
.list li {
  line-height: 2.5;
  padding-left: 32px;
  position: relative;
}
.list li::after {
  content: "";
  width: 27px;
  height: 27px;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.list li::after {
  background-image: url(../images/meal/ico.png);
}

.inr {
  width: 100%;
  max-width: 1280px;
  margin-right: auto;
  margin-left: auto;
}

.txt {
  line-height: 1.8em;
}

.chef-box {
  background-color: #f6f6f6;
  padding-top: 90px;
}
.chef-box.bg_w {
  background-color: #ffffff;
  padding-top: 90px;
}
.chef-box .t-grey {
  color: #888;
}
.chef-box-inr {
  display: flex;
}
.chef-box-inr img {
  width: 100%;
  height: 500px;
  object-fit: cover;
}
.meal_b,
section.b_b {
  /* background-image: url(../img/black_linen_v2.png); */
}
.pop-box {
  padding-bottom: 140px;
}
.pop-box .img-list li {
  width: 24%;
  max-width: 400px;
}
.meal_gal {
  height: 200px;
}
.meal_gal_img {
  width: 100%;
  height: 200px;
  object-fit: cover;
}
.chef_flex {
  display: flex;
  justify-content: center;
  align-items: center;
}
.chef_text {
  width: 85%;
}
.chef_text ul.li-in {
  text-indent: 2em;
}

@media screen and (max-width: 767px) {
  .chef_flex {
    padding: 15px;
  }
}

/*PC*/
@media screen and (min-width: 768px) {
  .page-title h1 {
    color: #fff;
    text-shadow: black 1px 1px 4px, black -1px 1px 4px, black 1px -1px 4px, black -1px -1px 4px;
    position: absolute;
    font-size: 50px;
    top: 200px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    letter-spacing: 6px;
  }
  .page-title h2 {
    color: #fff;
    text-shadow: black 1px 1px 8px, black -1px 1px 8px, black 1px -1px 8px, black -1px -1px 8px;
    position: absolute;
    font-size: 30px;
    top: 300px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  }
  .page-title p {
    color: #fff;
    text-shadow: black 1px 1px 10px, black -1px 1px 10px, black 1px -1px 10px, black -1px -1px 10px;
    position: absolute;
    font-size: 16px;
    top: 340px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    line-height: 1.8;
  }

  .chef-box-inr {
    flex-direction: row;
  }
  .chef-box-inr-in {
    width: 50%;
    padding: 1px;
  }
} /*END*/

/*Smartphone*/
@media screen and (max-width: 767px) {
  .page-title h1 {
    color: #fff;
    text-shadow: black 1px 1px 2px, black -1px 1px 2px, black 1px -1px 2px, black -1px -1px 2px;
    position: absolute;
    font-size: 28px;
    top: 100px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    letter-spacing: 6px;
  }
  .page-title h2 {
    font-size: 22px;
    margin-top: 20px;
  }
  .page-title p {
    font-size: 14px;
  }
  .list {
    font-size: 1.2rem;
  }
  .list li {
    padding-left: 18px;
  }
  .list li::after {
    width: 15px;
    height: 15px;
  }

  .txt {
    line-height: 1.5em;
  }
  .chef-box {
    padding-top: 30px;
  }
  .chef-box-inr {
    flex-direction: column;
  }
  .chef-box-inr img {
    height: 240px;
  }

  .pop-box {
    padding-bottom: 70px;
  }

  .pop-box .img-list li {
    width: 49.5%;
    margin-bottom: 5px;
    max-width: none;
  }
  .meal_gal {
    height: 150px;
  }
  .meal_gal_img {
    width: 100%;
    height: 150px;
    object-fit: cover;
  }
} /*END*/


/*20250305 追記*/
	.chef-box {
		padding-bottom: 60px;
	}
	.chef_text p span , .chef-info p span {
		display: inline-block;
	}
	.chef_text h2 {
		font-size: 2.4rem;
	}
	.chef-box-inr-in img {
    	object-fit: cover;
      height: 600px;
      width: 100%;
	}
	.chef_text.menu {
		width: 60%;
		margin: 0 auto;
	}
	table {
		width: 70%;
		margin: 0 auto;
	}
	table th {
		width: 40%;
    	padding: 10px;
    	border-bottom: 1px dotted #ccc;
	}
	table td {
		width: 60%;
    	border-bottom: 1px dotted #ccc;
	}
	.chef-info .inr {
		display: flex;
		width: calc(100% - 100px);
		padding: 50px;
		border: 1px solid #eee;
	}
	.chef-info .inr .chef-info-img {
		width: 28%;
	}
	.chef-info .inr .chef-info-img img {
		width: 100%;
		    box-shadow: 2px 2px 2px #888;
	}
	.chef-info .inr .chef-info-txt {
		width: 72%;
		padding-left: 50px;
    padding-top: 50px;
	}
	@media screen and (max-width: 896px) {
	.chef-box-inr-in img {
		height: auto;
	}
		.chef_text {
			width: 95%;
		}
	table {
		width: 96%;
		margin: 0 auto;
		font-size: 14px;
	}
	table th {
		width: 25%;
    	padding: 10px;
    	border-bottom: 1px dotted #ccc;
	}
	table td {
		width: 75%;
    	border-bottom: 1px dotted #ccc;
	}
			.chef-info .inr {
		flex-direction: column;
		width: calc(100% - 40px);
		padding: 0;
	}
			.chef-info .inr .chef-info-img {
		width: 100%;
    padding: 20px;
	}
			.chef-info .inr .chef-info-txt {
		width: 100%;
		padding: 20px;
	}
}

/* roomより */
	.tabl_txt {
    text-align: center;
    font-size: 2rem;
}
.table_img {
  display: flex;
  width: 90%;
  margin: 0 auto;
}
.table_imgbox {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  width: 24%;
}
.table_imgbox > div {
  width: 100%;
}
.table_imgbox img {
  width: 100%;
  height: auto;
  object-fit: cover;
}
.table_box {
  width: 76%;
}
@media screen and (max-width: 920px) {
  .room-list2 {
    width: 49%;
  }
}
@media screen and (max-width: 600px) {
	  .table_img {
    flex-direction: column;
  }
  .table_imgbox {
    flex-wrap: nowrap;
    flex-direction: unset;
	  width: 100%;
  }
	.table_box {
    width: 100%;
}
	.table_imgbox > div {
  width: 50%;
}
  .room-list {
    width: 100%;
  }
  .room-list2 {
    width: 100%;
  }
	    table.room_table th {
        width: 30%;
			padding: 0;
    }
	    table.room_table td {
        width: 70%;
    }
}


/* 陽みどりさんページ */

/* style.css または 追加CSS に追加 */
.voice {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 84%;
  margin: 0 auto;
}

.fusen-3 {
    display: flex;
    position: relative;
    width: 48%;
    padding: 2em 2.2em;
    background-color: #f6f6f6;
}

.fusen-3::before {
    position: absolute;
    bottom: -5px;
    right: 7px;
    z-index: -1;
    transform: rotate(2deg);
    width: 70%;
    height: 97%;
    background-color: #d0d0d0;
    content: "";
    filter: blur(4px);
}
.fusen-3 h4 {
  padding: 20px 0 0;
  font-size: 16px;
}
/* --- モーダル表示のためのCSS --- */

/* モーダルを開くボタンのスタイル */
.modal-open-button {
  padding: 6px 18px;
  text-decoration: none;
  cursor: pointer;
  border-radius: 5px;
  display: inline-block; /* ボタンとして表示 */
  margin-top: 15px; /* 必要に応じて上部の余白を追加 */
  float: right;
  border: 1px solid #888888;
}

/* モーダル全体のコンテナ */
.modal {
  position: fixed; /* 画面に固定 */
  top: 0;
  left: 0;
  z-index: 9999; /* 他の要素より手前に表示するために高めに設定 */
  display: flex; /* コンテンツを中央に配置するためにflexboxを使用 */
  align-items: center; /* 垂直方向中央寄せ */
  justify-content: center; /* 水平方向中央寄せ */
  width: 100%; /* 全幅 */
  height: 100%; /* 全高 */
  background-color: rgb(0 0 0 / 60%); /* 半透明の背景オーバーレイ */

  /* 初期状態では非表示にする */
  opacity: 0;
  pointer-events: none; /* 非表示時にはクリックなどのイベントを無効化 */

  /* アニメーションを完全に無効化する場合 */
  /* transition: none; を追加することで、JavaScriptによるクラス切り替え時にアニメーションしない */
  transition: opacity 0.3s ease; /* スムーズなフェードイン・アウト */
}

/* モーダルが表示されたときに適用されるクラス（JavaScriptで追加/削除） */
.modal.is-open {
  opacity: 1; /* 不透明にして表示 */
  pointer-events: auto; /* クリックなどのイベントを有効化 */
}

/* モーダル内の閉じるボタン（X印）のスタイル */
.close {
  position: fixed;
  top: 100px;
  right: 15%;
  font-size: 50px;
  color: #333; /* ボタンの色 */
  text-decoration: none;
  cursor: pointer;
  z-index: 10000; /* モーダルコンテンツより手前に表示 */
  /* transform: translate(50%, -50%); /* Xボタンの位置調整（オプション） */
}

/* モーダルコンテンツのラッパー（白いボックス部分） */
.modal-wrapper {
  position: relative; /* 閉じるボタンのabsolute配置の基準 */
  width: 90%; /* モーダルの幅 */
  max-width: 900px; /* モーダルの最大幅 */
  max-height: 80vh; /* ビューポートの高さに対する最大高さ (vhを使用) */
  padding: 25px; /* コンテンツのパディング */
  background-color: #FEFEFE; /* 背景色 */
  border-radius: 8px; /* 角の丸み */
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3); /* 影 */
  overflow-y: auto; /* コンテンツが高さに収まらない場合にスクロール可能にする */
  -webkit-overflow-scrolling: touch; /* iOSでのスクロールをスムーズに */
}

/* モーダルコンテンツ内のスタイル */
.modal-content h5 {
  font-size: 16px;
    margin-bottom: 20px;
    background: #f6f6f6;
    padding: 10px 20px;
}

.modal-content h4 { /* 記事タイトルにh4を使用しているため */
  margin-top: 0;
  margin-bottom: 15px;
  font-size: 2rem; /* サイズ調整 */
}

.modal-content img {
  max-width: 100%;
  height: auto;
  display: block;
  margin-bottom: 1.5em;
  border-radius: 4px; /* 画像の角を少し丸くする */
}

.modal-content p {
  margin-bottom: 1em;
  line-height: 2;
}

@media screen and (max-width:896px) {
.voice {
  width: 100%;
}
.fusen-3 {
    width: 92%;
    margin: 0 auto 30px;
}
.fusen-3 h4 {
  padding: 20px 0 0;
  font-size: 16px;
}

/* モーダル内の閉じるボタン（X印）のスタイル */
.close {
  top: 9%;
  right: 24px;
  font-size: 40px;
}

}

.top_slider_linkbtn {
    position: fixed;
    bottom: 100px;
    right: 40px;
    z-index: 2;
}
.top_slider_linkbtn a.linkbtn {
    position: relative;
    display: block;
    width: 220px;
    height: 120px;
    background-color: rgba(35,23,20,0.7);
    box-shadow: 0 10px 25px 0 rgba(0, 0, 0, .5);
    text-align: center;
    transition: 0.3s;
}

.top_slider_linkbtn a.linkbtn:hover {
    background-color: rgba(35,23,20,1);
}

.top_slider_linkbtn .linkbtn_inner {
    position: absolute;
    width: 90%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 2.0rem;
    line-height: 1.4;
    color: #fff;
}
@media screen and (max-width:896px) {
.top_slider_linkbtn a.linkbtn {
    width: 180px;
    height: 70px;
}
.top_slider_linkbtn {
    bottom: 70px;
    right: 10px;
}
.top_slider_linkbtn .linkbtn_inner {
    font-size: 1.6rem;
}
}


/*食事ページ内のみ　閉じるバナー*/
/* .callout-container-bnr5 {
  position: fixed;
  width: 80%;
  max-width: 600px;
  z-index: 4;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  background-color: #fff;
  padding: 5px;
}

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 3;
}

.callout-container-bnr5 img {
        width: 100%;
}

.bnr_close {
    position: absolute;
    right: -15px;
    color: white;
    font-size: 50px;
    padding: 10px;
    line-height: 1;
    cursor: pointer;
    z-index: 1;
}

.bnr_close:hover {
  color: lightgrey;
} */