@charset "utf-8";
/* CSS Document */

.menu_boxwrap{
	max-width: 1100px;
	margin-left: auto;
	margin-right: auto;
	display:-webkit-box;
    display:-moz-box;
    display:-ms-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    justify-content: center;
    align-items: center;
	flex-direction: column;
	gap: 10px;
}
.menu_boxwrap .box{
	width: 100%;
	display:-webkit-box;
    display:-moz-box;
    display:-ms-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    justify-content: space-between;
    align-items: center;
	flex-direction: row;
	padding: 15px 0;
	border-bottom: 1px solid #DDDDDD;
}

.price_switch{
  display:flex;
  flex-wrap:wrap;                 /* 2段にする */
  gap: 18px 22px;                 /* 縦 横 */
  margin: 120px auto 0px;
  max-width: 1100px;              /* 好きに */
}

/* ボタン共通 */
.price_switch_btn{
  flex: 1 1 calc(33.333% - 22px); /* 3列 */
  min-width: 0;                   /* min-widthは外す */
  padding: 6px 10px;
  border: 1px solid #e6e6e6;
  background: #dedede;            /* ← 見本の薄グレー */
  cursor: pointer;
  text-decoration: none;
}

/* テキスト */
.price_switch_btn .default_txt{
  margin:0;
  letter-spacing: 0.18em;
  color: #333;                    /* ← 見本の濃グレー */
  text-align:center;
}

/* アクティブ（濃グレー） */
.price_switch_btn.is_active{
  background:#2f3437;             /* ← 見本の濃グレー */
  border-color:#2f3437;
}
.price_switch_btn.is_active .default_txt{
  color:#fff;
}

/* hover */
.price_switch_btn:hover:not(.is_active){
  background:#cfcfcf;
}

/* SPは2列に */
@media (max-width: 768px){
  .price_switch_btn{
    flex: 1 1 calc(50% - 22px);
    }}
    @media (max-width:576px){
		.price_switch_btn .default_txt{
			font-size: 13px;
			letter-spacing: 0.02em;
		}
	}

/* ===== menu card scope ===== */
.menu_cardwrap{
    gap:60px;
    padding: 60px 0;
}
.menu_card{
	background:#fff;
	width: 100%;
}

/* カード本体 */
.menu_card .menu_card_inner{
	padding: 50px clamp(20px, 5vw, 50px);
	gap: clamp(10px, 6vw, 80px);
	align-items:flex-start;
	margin:0 auto;
}

/* 左画像 */
.menu_card .imgbox{
	flex:0 0 420px;
}
.menu_card .imgbox img{
	width:100%;
	height:100%;
	object-fit: cover;
	aspect-ratio: 1.6 / 1;
	overflow: hidden;
	display:block;
}

/* 右側 */
.menu_card .menu_card_body{
	flex:1;
	min-width:0;
}

/* タイトル行 */
.menu_card .menu_card_head{
	justify-content:space-between;
	align-items:baseline;
	gap:16px;
	padding-bottom:10px;
	border-bottom:1px solid #e6e6e6;
	margin-bottom:14px;
}

/* pの初期余白を制御（このカード内だけ） */
.menu_card p{
  margin:0;
}

/* 説明文 */
.menu_card .menu_card_desc_wrap{
  margin-bottom:18px;
 
    
}

/* 料金 */
.menu_card .menu_card_price_wrap{
	margin-bottom:18px;
	align-items: baseline;
	justify-content: flex-start;
}

/* ボタン */
.menu_card_btn_wrap{
	width: 100%;
	max-width: 600px;
	margin-left: auto;
	margin-right: auto;
}
.menu_card_btn{
	width:100%;
	height:54px;
	background:#3b3f42;
	color:#fff;
	text-decoration:none;
	padding:0 20px;
	gap:30px;
}

.menu_card_btn_txt{
	color: #fff;
}
.menu_card_btn .icon img{
  width:16px;
  height:auto;
  display:block;
}

/* レスポンシブ */
@media (max-width: 900px){
  .menu_card .menu_card_inner{
    flex-direction:column;
  }
  .menu_card .imgbox{
    flex:0 0 auto;
    width:100%;
  }
}


/* ---------- IEのみ ---------- */
@media all and (-ms-high-contrast: none) {
}
/* ---------- 1280px ~ ---------- */
@media screen and (max-width: 1280px){
}
/* ---------- 1080px ~ ---------- */
@media screen and (max-width: 1080px){
}
/* ---------- 768px ~ ---------- */
@media screen and (max-width: 768px){
}
/* ---------- 576px ~ ---------- */
@media screen and (max-width: 576px){
	.menu_boxwrap .box{
		justify-content: center;
		gap: 10px;
	}
	.menu_boxwrap .box h3{
		display:-webkit-box;
		display:-moz-box;
		display:-ms-box;
		display:-webkit-flexbox;
		display:-moz-flexbox;
		display:-ms-flexbox;
		display:-webkit-flex;
		display:-moz-flex;
		display:-ms-flex;
		display:flex;
		-webkit-box-lines:multiple;
		-moz-box-lines:multiple;
		-webkit-flex-wrap:wrap;
		-moz-flex-wrap:wrap;
		-ms-flex-wrap:wrap;
		flex-wrap:wrap;
		justify-content: center;
		align-items: center;
		flex-direction: row;
		width: 100%;
		padding: 5px;
		background-color: #f9eef3;
	}
	.menu_card_price_wrap{
		gap: 5px;
	}
}
/* ---------- 350px ~ ---------- */
@media screen and (max-width: 350px){
}

