/* === Font scale (このサイト基準) =============================== */
:root {
	/* base/body は既に body: 1.4rem / 768px〜は1.6rem */
	--fs-14: 1.4rem; /* 14px: 補助用 */
	--fs-16: 1.6rem; /* 16px: PCの本文 */

	/* 可変トークン（SP → PCで拡大） */
	--fs-20: 2rem; /* SP 20px → PC 24px 相当へ */
	--fs-23: 2.3rem; /* 旧23px指定は本サイトではSPで20、PCで24に寄せる */
	--fs-30: 3rem; /* SP 30px → PC 42px */
	--fs-40: 4rem; /* SP 40px → PC 56px */
	--fs-56: 5.6rem; /* “上限56px”相当の見出し上限をSP40に統一 */

	/* PC〜SPまで滑らかに変化（spacingトークン） */
	--s-120: clamp(4rem, calc(120 / 1920 * 100vw), 12rem);
	--s-100: clamp(3.3rem, calc(100 / 1920 * 100vw), 10rem);
	--s-60: clamp(2rem, calc(60 / 1920 * 100vw), 6rem);
	--s-40: clamp(1.3rem, calc(40 / 1920 * 100vw), 4rem);
	--s-30: clamp(1rem, calc(30 / 1920 * 100vw), 3rem);
	--s-20: clamp(0.7rem, calc(20 / 1920 * 100vw), 2rem);

	/* 追加トークン */
	--s-180: clamp(6rem, calc(180 / 1920 * 100vw), 18rem);
	--s-80: clamp(2.67rem, calc(80 / 1920 * 100vw), 8rem);
	--s-70: clamp(2.33rem, calc(70 / 1920 * 100vw), 7rem);
	--s-50: clamp(1.67rem, calc(50 / 1920 * 100vw), 5rem);
	--s-200: clamp(6.67rem, calc(200 / 1920 * 100vw), 20rem);

	--fw-300: 300;
	--fw-400: 400;
	--fw-500: 500;
	--fw-600: 600;
	--fw-700: 700;
	--fw-900: 900;
}

/* 768px以上で拡大（このCSSの方針に合わせる） */
@media screen and (max-width: 768px) {
	:root {
		--fs-20: 2rem;
		--fs-23: 2rem;
		--fs-30: 2.2rem;
		--fs-40: 2.8rem;
		--fs-56: 5.6rem;

		--s-120: 4rem;
		--s-100: 3.3rem;
		--s-60: 2rem;
		--s-40: 1.3rem;
		--s-30: 1rem;
		--s-20: 0.7rem;
		--s-180: 6rem;
		--s-80: 2.7rem;
		--s-70: 2.3rem;
		--s-50: 1.7rem;
		--s-200: 6.7rem;
	}
}

/* ====== Typography weights ====== */
.cmn-bold,
.footer-cont__info-box-ttl,
.top-news__ttl,
.top-charm__cont-item-txt,
.top-shop__cont-item-info-ttl,
.subhd__ttl-str,
.contact-cmn-ttl,
p {
	font-weight: var(--fw-700);
}

.el_fs23,
.bl_menu-item,
.bl_drink-read {
	font-weight: var(--fw-500);
}

/* ====== Layout helpers (spacingは外出し) ====== */
.bl_flex {
	display: flex;
}
.bl_flex-r {
	display: flex;
	flex-direction: row-reverse;
}

.subhd__ttl-str {
	    font-size: min(10vw,4rem);
}
@media screen and (min-width: 768px){
  .subhd__ttl-str {
        font-size: min(10vw,5.6rem);
  }
}
/* ====== MV ====== */
.bl_mv {
	background-size: cover;
	background-position: center bottom;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	/* margin-bottom: var(--s-120); ← 外出し */
	max-height: 600px;
	height: 80vw;
}

/* ====== features ====== */
.features .bl_mv {
	background: url(/system_panel/uploads/images/img_mv_features.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
}
.bl_features .bl_wrap01 {
	background: url(/system_panel/uploads/images/img_bcg_feature01.png) no-repeat;
}
.bl_features .bl_wrap02 {
	background: url(/system_panel/uploads/images/img_bcg_feature02.png) no-repeat;
}



/* ====== こだわり ====== */
.kodawari .bl_mv {
	background: url(/system_panel/uploads/images/img_mv_kodawari.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
}
.bl_bcg01 {
	background: url(/system_panel/uploads/images/img_bcg_howto01.png) no-repeat;
	background-size: contain;
	background-position: center;
}


 .bl_flex3 {
	display: flex;
	justify-content: center;
	/* margin-top/bottom ← 外出し */
}
 .bl_flex3 .txt-area {
	order: 2;
	width:50%;
	max-width: 440px;
}
 .bl_flex3 .txt-area .sfs-30  {
	font-size:clamp(2rem, calc(30 / 1920 * 100vw), 3rem);
}
 .bl_flex3 .photo01 {
	order: 1;
	width: 25%;
}
 .bl_flex3 .photo02 {
	order: 3;
	width: 25%;
}

 .bl_point {
	background: url(/system_panel/uploads/images/img_bcg_kodawari01.png) no-repeat;
	background-size: contain;
	background-position: center;
}

 .bl_flex .txt-area .mf_w930 {
	max-width: 930px !important;
	width: calc(930 / 1920 * 100vw);
	
	/* margin-top ← 外出し */
	margin-right: calc(-300 / 1920 * 100vw); /* レイアウト */
	z-index: 100;
	position: relative;
}

.bl_flex .txt-area .mf_w670 {
	max-width: 670px !important;
	width: calc(670 / 1920 * 100vw);

}
 .bl_flex-r.bl_last-item {
	background: #2f2d2b;
	/* padding-block ← 外出し */
}


/* ====== howto ====== */
.howto .bl_mv {
	background: url(/system_panel/uploads/images/img_mv_howto.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
}






/* ====== scene ====== */
.scene .bl_mv {
	background: url(/system_panel/uploads/images/img_mv_scene.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
}
.bl_scene01 {
	/* text-align: center;
	padding-bottom ← 外出し */
	font-size: var(--fs-23);
}

.el_txt-c {
	text-align: center;
}
.el_img-c {
	text-align: center;
	margin-inline: auto;
}
.bl_bcg_scene01 {
	background: url(/system_panel/uploads/images/img_bcg_scene01.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
}
.bl_bcg_scene02 {
	background: url(/system_panel/uploads/images/img_bcg_scene02.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
}
.bl_bcg_scene03 {
	background: url(/system_panel/uploads/images/img_bcg_scene03.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
}
.bl_bcg_scene04 {
	background-color: #2f2d2b; /* padding-block ← 外出し */
}

.btn-uber {
	max-width: 500px;
	width: calc(500 / 630 * 100%);
	/* margin-left:auto; 配置のため維持 */
	/* margin-top ← 外出し */
}

/* ====== reason ====== */
.reason .bl_mv {
	background: url(/system_panel/uploads/images/img_mv_reason.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
}
.bl_reason01 {
	/* text-align: center;
	padding-bottom ← 外出し */
	font-size: var(--fs-23);
}

.bl_bcg_reason01 {
	background: url(/system_panel/uploads/images/img_bcg_reason01.png) no-repeat;
	background-size: contain;
	background-position: center center;
}
.bl_reason02 .bl_readon-point {
	background-color: #2f2d2b;
	/* padding/margin-top/bottom ← 外出し */
	font-size: var(--fs-23);
	position: relative;
	padding:.5em 1em;
}
.bl_reason02 .bl_readon-point:before {
	content: '';
	display: block;
	width: 200px;
	height: 130px;
	position: absolute;
	top: -100px;
	right: 0;
	background: url(/system_panel/uploads/images/img_point01.png) no-repeat;
}


.bl_photo-area {
	align-items: center;
}
.bl_reason04 {
	/* padding-block ← 外出し */
	background-color: #2f2d2b;
}


/* ====== menu ====== */
.menu .bl_mv {
	background: url(/system_panel/uploads/images/img_mv_menu.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
}
.bl_menu-tab .row {
	background: #d61118;
	/* padding ← 外出し */
}
.bl_menu-tab .row > div {
	width: 25%;
	text-align: center;
}
.bl_menu-tab .row > div a:after {
	content: '';
	display: block;
	width: 20px;
	height: 20px;
	background: url(/system_panel/uploads/images/img_arrow01.png) no-repeat;
	margin-inline: auto;
}
.bl_menu-tab .row > div + div {
	border-left: 1px solid #fff;
}

.el_fs23 {
	font-size: var(--fs-23);
}

.bl_menu-osusume {
	/* padding-block ← 外出し */
	text-align: center;
	font-size: var(--fs-23);
}
.bl_menu-osusume .bl_flex .txt-area,
.bl_menu-osusume .bl_flex-r .txt-area {
	/* margin-top ← 外出し */
	text-align: left;
}
.bl_menu-osusume .bl_flex .txt-area p,
.bl_menu-osusume .bl_flex-r .txt-area p {
	/*margin-left: 2em;  配置 */
	/* margin-top ← 外出し */
	font-size: var(--fs-23);
}
.bl_scene02 .top-kodawari__cont-btn {
	/* margin-top ← 外出し */
	max-width: 500px;
	width: calc(500 / 630 * 100%);
	margin-left: auto;
	margin-right: 0;
}
.bl_menu-osusume .bl_flex .txt-area a p,
.bl_menu-osusume .bl_flex-r .txt-area a p {
	max-width: 100%;
	width: auto;
	margin-left: 0;
	margin-top: 0;
	font-size: var(--fs-23);
}
.bl_menu-osusume .bl_flex,
.bl_menu-osusume .bl_flex-r {
	justify-content: flex-end;
	/* gap / margin-block ← 外出し */
}

.bl_menu-yakiniku {
	margin-inline: auto; /* 中央寄せ維持 */
	/* margin-bottom ← 外出し */
	justify-content: center;
	max-width: 900px;
}
.bl_menu-yakiniku > div a {
	padding: 0;
	padding-inline: 1.5em;
	border-inline: 1px solid #fff;
	min-width: 0;
	min-height: 0;
	line-height: 1;
	margin-left: -1px;
}
.bl_menu-yakiniku > div a p {

	line-height: 1;
}


.bl_menu-subttl {
	font-size: var(--fs-40);
	background: url(/system_panel/uploads/images/img_bcg_ttl01.png) no-repeat;
	background-position: center bottom;
	text-align: center;
	/* margin-block ← 外出し */
}
.bl_menu-item {
	display: flex;
	justify-content: space-between;
	/* padding ← 外出し（下の重複定義も統一） */
	border-block: 1px solid #fff;
	font-size: var(--fs-23);
	width: 100%;
	margin-inline: auto;
	align-items: center;
	margin-top: -1px;
}
.bl_menu-item > div {
	padding-block: 0.5em;
}


.bl_menu-list-wrap > div {
	width: 46%;
}
.bl_menu-list-wrap.mf_w100 > div {
	width: 100%;
}
.bl_menu-list-wrap {
	justify-content: space-between;
	padding-inline: 15px;
	/* gap:3%; ← 相対gapは撤廃。HTMLで spc-gap-* を付与 */
}

.mbl_menu-name {
	text-align: left;
}
.mf_ai-top {
	align-items: flex-start;
}
.mf_ai-bottom {
	align-items: flex-end;
}

.mf_ai-center {
	align-items: center;
}



.el_bcg-clr01 {
	background: #2f2d2b;
}

.bl_bcg_menu01 {
	background: url(/system_panel/uploads/images/img_bcg_menu02.png) no-repeat;
	background-position: center bottom;
	text-align: center;
	/* padding-block ← 外出し */
}
.mf_txt-shadow {
	text-shadow: 5px 5px 5px #000;
}

.drink .bl_mv {
	background: url(/system_panel/uploads/images/img_mv_drink.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
}
.bl_drink-read {
	/*text-align: center;*/
	font-size: var(--fs-23);
	/* margin-bottom ← 外出し */
}

.el_fixed-bg {
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	height: 600px;
}
.mf_fixed-bg-drink {
	background: url(/system_panel/uploads/images/img_photo_drink00.png) center/cover no-repeat fixed;
}
.mf_fixed-bg-a5 {
	background: url(/system_panel/uploads/images/img_fixed_a501.png) center/cover no-repeat fixed;
}

.bl_bcg_drink01 {
	background: url(/system_panel/uploads/images/img_bcg_dink01.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
	text-align: center;
	/* padding-block ← 外出し */
}

/* 幅100%系 */
.bl_box-w-100 {
overflow: visible; /* はみ出しを許可 */
padding-inline: 15px;
}
.bl_box-w-100 .bl_flex .txt-area,
.bl_box-w-100 .bl_flex-r .txt-area {
	max-width: 600px;
	/* margin-top ← 外出し */
	z-index: 10;
	width: 50%;
}

.bl_box-w-100 .bl_flex .txt-area + div,
.bl_box-w-100 .bl_flex-r .txt-area + div {

	flex: 1;
}
.bl_box-w-100 .bl_flex .txt-area + div img,
.bl_box-w-100 .bl_flex-r .txt-area + div img {
width: 100%;
}

.bl_box-w-100 .bl_flex .txt-area + div{
position: relative;
margin-right: calc(50% - 50vw);
margin-left: 0;
max-width: 1200px;

}

.bl_box-w-100 .bl_flex-r .txt-area + div{
	position: relative;
    margin-right: 0;
    margin-left: calc(50% - 50vw);
	max-width: 1200px;
}
.bl_box-w-100 .bl_flex .txt-area,
.bl_box-w-100 .bl_flex-r .txt-area {
	max-width: 600px;
	/*margin-left:auto;  維持 */
	/* margin-top ← 外出し */
	font-size: var(--fs-23);
	text-align: left;

}
.bl_box-w-100 .bl_flex,
.bl_box-w-100 .bl_flex-r {
	justify-content: flex-end;
	 max-width: 1200px;
	 margin: 0 auto min(70px, 70 / var(--mq) * 1vw);
	/* gap ← 外出し */
}
.bl_box-w-100 .top-kodawari__cont-btn {
	/* margin ← 外出し */
	width: auto;


}



/* 100%コンテンツ */
.bl_contai-w-100 {
	max-width: 1200px;

}
.bl_contai-w-100 .bl_flex .txt-area,
.bl_contai-w-100 .bl_flex-r .txt-area {
	/* margin-top ← 外出し */
	text-align: left;
	max-width: 600px;
	/* margin-top ← 外出し */
	z-index: 10;
	font-size: var(--fs-23);
	flex: 1;
}

.bl_contai-w-100 .top-kodawari__cont-btn {
	/* margin-top ← 外出し */
	max-width: 500px;
	width: calc(500 / 630 * 100%);
	margin-left: auto;
	margin-right: 0;
}

.bl_contai-w-100 .bl_flex,
.bl_contai-w-100 .bl_flex-r {
	justify-content: flex-end;
	/* gap / margin-block ← 外出し */
}

.mf_fs20 {
	font-size: var(--fs-20);
}

/* ====== A5 Wagyu ====== */
.a5wagyu .bl_mv {
	background: url(/system_panel/uploads/images/img_mv_a5.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
}
.bl_bcg_a501 {
	background: url(/system_panel/uploads/images/img_bcg_a501.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
}
.bl_bcg_a502 {
	background: url(/system_panel/uploads/images/img_bcg_a502.png) no-repeat;
	background-size: contain;
	background-position: center center;
	/* padding-block ← 外出し */
}

/* 旧 .mf_ptb120 は使わない（spc-py-120に置換） */

.bl_table {
	width: auto;
	margin-inline: auto;
	max-width: 1000px;
}
.bl_table-tr > div:nth-of-type(1),
.bl_table-tr > div:nth-of-type(2),
.bl_table-tr > div:nth-of-type(3) {
	border: 1px solid #fff;
	margin-top: -1px;
	margin-left: -1px;
}
.bl_table-tr > div:nth-of-type(1) {
	width: 50%;
}
.bl_table-tr > div:nth-of-type(2) {
	width: 25%;
}
.bl_table-tr > div:nth-of-type(3) {
	width: 25%;
	background: #000;
}

/* 旧 el_* は非推奨（spc-*で代替） */
.shop .bl_mv {
	background: url(/system_panel/uploads/images/img_mv_shop.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
}
.bl_bcg_shop01 {
	background: url(/system_panel/uploads/images/img_bcg_shop01.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
	text-align: center;
}
.bl_shop01 {
	text-align: center;
	font-size: var(--fs-23);
}
.bl_th {
	width: 35%;
	margin-top: -1px;
}

.bl_shop-note {
	text-align: left;
	width: 100%;
	max-width: 600px;
}



.bl_shop-photo {
	display:grid;
  grid-template-columns:repeat(3, 1fr);
	gap:3rem;
}
@media screen and (max-width: 1024px) {
.bl_shop-photo {
  grid-template-columns:repeat(2, 1fr);
	gap:3rem;
}
}
.mf_ml-870 {
	max-width: 870px !important;
	width: calc(870 / 1920 * 100vw) !important;
	margin-left: -150px; /* レイアウト調整のため維持 */
}

.recruit .bl_mv {
	background: url(/system_panel/uploads/images/img_mv_recruit.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
}

.bl_recruit-note {
	text-align: left;
	width: 100%;
	max-width: 1000px;
}

.el_fs30 {
	font-size: var(--fs-30);
}
.bl_bcg_recruit01 {
	background: url(/system_panel/uploads/images/img_bcg_recruit01.png) no-repeat;
	background-size: cover;
	background-position: center bottom;
	text-align: center;
}

/* 旧 .mf_js-center / .el_pt0 など !important系は削除し、必要なら別ユーティリティへ */
.bl_tel {
	border: 1px solid #feff09;
	border-radius: 10px;
	font-size: var(--fs-40);
	text-align: center;
	max-width: 470px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #feff09;
	min-height: 104px;
	width: 100%;
	box-sizing: border-box;
}
.bl_contact-btn-area {
	display: flex;
	justify-content: center;
	/* gap / margin-top ← 外出し */
}
.bl_contact-btn-area .cmn-btn {
	margin: 0;
	max-width: 470px;
	border-radius: 10px;
}

.bl_reason01 .sfs-30 {
	font-size: clamp(2.5rem, calc(30 / 1920 * 100vw), 3rem);
}
.bl_menu-item > div:last-child{
	width: 5em;
	text-align: right;
}
.bl_menu-item  div.bl_w7em{
	width: 7em;
}
.bl_menu-item > div:first-child{
	flex: 1;
}
.el_txt-c span{
	font-weight: 700;
}

.bl_shop-note .bl_menu-item > div:last-child{
	width: 100%;
	text-align: left;
}

.bl_shop-note .bl_menu-item > div:first-child{
	flex: none;
}

.txt-area + div{
	width: 50%;
	max-width: 900px;
}
/* ====== SP ====== */
@media screen and (max-width: 1024px) {
	.bl_flex3 {
		flex-direction: column;
	}
	.bl_flex3 .txt-area   {
	font-size:clamp(2.5rem, calc(30 / 1920 * 100vw), 3rem);
	order: 1;
	width: fit-content;
	margin-inline: auto;
}
.bl_flex3 .photo01 {
	order: 2;
	width: 100%;
	text-align: center;
}

.bl_flex3 .photo02 {
	order: 3;
	width: 100%;
	text-align: center;
}
}

@media screen and (max-width: 767px) {
	.bl_flex,
	.bl_flex-r,
	.bl_flex3 {
		flex-direction: column;
	}


	.bl_kodawari .bl_flex .txt-area.mf_w930 {
		max-width: 930px !important;
		width: 100%;
		/* margin-top/right ← 外出し or 0 に */
		margin-right: 0;
		z-index: 100;
	}

	.bl_flex .txt-area .mf_w930{
		width: 100%;
	}

	.bl_kodawari .bl_flex .txt-area,
	.bl_kodawari .bl_flex-r .txt-area,
	.bl_features .bl_flex .txt-area,
	.bl_features .bl_flex-r .txt-area,
	.bl_menu-tabehoudai .bl_flex .txt-area,
	.bl_menu-tabehoudai .bl_flex-r .txt-area,
	.bl_box-w-100 .bl_flex .txt-area,
	.bl_box-w-100 .bl_flex-r .txt-area {
		width: 100%;
		max-width: 100%;
	}

	.bl_menu-tab .row {
		flex-wrap: wrap;

		/* padding/margin ← 外出し */
		margin: 15px;
		background: none;
		gap:1em;
		justify-content: center;
		
	}
	.bl_menu-tab .row > div {
		width: 40%;
		text-align: center; /* margin-block ← 外出し */
		background: #d61118;
		border:none!important;
		font-size: 15px;
	}
	.bl_menu-tab .row > div .sfs-23{
		font-size: 15px;
	}

	

	.bl_menu-list-wrap {
		flex-direction: column;
	}
	.bl_menu-list-wrap > div {
		width: 100%;
	}

	.mf_ttl-880 {
		width: 100%;
		max-width: 880px;
		margin-right: 0;
	}
	/* .mf_mt200{ margin-top:0; } ← 外出しで制御 */
	.bl_flex.bl_shop-photo {
		flex-direction: row;
	}

	.mf_ml-870 {
		width: 100% !important;
		margin-left: 0;
	}
    .bl_shop-photo {
        
        gap: 1rem;
    }


	.bl_shop-photo {
		justify-content: center;
	}
}

.mf_z10{
	z-index: 10;
}

.sfs-14 {
	font-size: var(--fs-14);
}
.sfs-16 {
	font-size: var(--fs-16);
}
.sfs-20 {
	font-size: var(--fs-20);
}
.sfs-23 {
	font-size: var(--fs-23);
}
.sfs-30 {
	font-size: var(--fs-30);
}
.sfs-40 {
	font-size: var(--fs-40);
}
.sfs-56 {
	font-size: var(--fs-56);
}

.sfs-30in {
	font-size: var(--fs-30) !important;
}

/* =========================================================
   Spacing Utilities (1920px base, fluid, 10px=1rem)
   - Per-side margin/padding: .spc-mt-XX / .spc-pr-XX など
   - Sizes: 20,30,40,50,60,70,80,100,120,180,200
   - Mobile reset (<=767px): .spc-sm-mt-0 / .spc-sm-pt-0 など
   ========================================================= */

/* ---------- Margin (per side) ---------- */
/* 20px */
.spc-mt-20 {
	margin-top: clamp(0.7rem, calc(20 / 1920 * 100vw), 2rem);
}
.spc-mr-20 {
	margin-right: clamp(0.7rem, calc(20 / 1920 * 100vw), 2rem);
}
.spc-mb-20 {
	margin-bottom: clamp(0.7rem, calc(20 / 1920 * 100vw), 2rem);
}
.spc-ml-20 {
	margin-left: clamp(0.7rem, calc(20 / 1920 * 100vw), 2rem);
}

/* 30px */
.spc-mt-30 {
	margin-top: clamp(1rem, calc(30 / 1920 * 100vw), 3rem);
}
.spc-mr-30 {
	margin-right: clamp(1rem, calc(30 / 1920 * 100vw), 3rem);
}
.spc-mb-30 {
	margin-bottom: clamp(1rem, calc(30 / 1920 * 100vw), 3rem);
}
.spc-ml-30 {
	margin-left: clamp(1rem, calc(30 / 1920 * 100vw), 3rem);
}

/* 40px */
.spc-mt-40 {
	margin-top: clamp(1.3rem, calc(40 / 1920 * 100vw), 4rem);
}
.spc-mr-40 {
	margin-right: clamp(1.3rem, calc(40 / 1920 * 100vw), 4rem);
}
.spc-mb-40 {
	margin-bottom: clamp(1.3rem, calc(40 / 1920 * 100vw), 4rem);
}
.spc-ml-40 {
	margin-left: clamp(1.3rem, calc(40 / 1920 * 100vw), 4rem);
}

/* 50px */
.spc-mt-50 {
	margin-top: clamp(1.67rem, calc(50 / 1920 * 100vw), 5rem);
}
.spc-mr-50 {
	margin-right: clamp(1.67rem, calc(50 / 1920 * 100vw), 5rem);
}
.spc-mb-50 {
	margin-bottom: clamp(1.67rem, calc(50 / 1920 * 100vw), 5rem);
}
.spc-ml-50 {
	margin-left: clamp(1.67rem, calc(50 / 1920 * 100vw), 5rem);
}

/* 60px */
.spc-mt-60 {
	margin-top: clamp(2rem, calc(60 / 1920 * 100vw), 6rem);
}
.spc-mr-60 {
	margin-right: clamp(2rem, calc(60 / 1920 * 100vw), 6rem);
}
.spc-mb-60 {
	margin-bottom: clamp(2rem, calc(60 / 1920 * 100vw), 6rem);
}
.spc-ml-60 {
	margin-left: clamp(2rem, calc(60 / 1920 * 100vw), 6rem);
}

/* 70px */
.spc-mt-70 {
	margin-top: clamp(2.33rem, calc(70 / 1920 * 100vw), 7rem);
}
.spc-mr-70 {
	margin-right: clamp(2.33rem, calc(70 / 1920 * 100vw), 7rem);
}
.spc-mb-70 {
	margin-bottom: clamp(2.33rem, calc(70 / 1920 * 100vw), 7rem);
}
.spc-ml-70 {
	margin-left: clamp(2.33rem, calc(70 / 1920 * 100vw), 7rem);
}

/* 80px */
.spc-mt-80 {
	margin-top: clamp(2.67rem, calc(80 / 1920 * 100vw), 8rem);
}
.spc-mr-80 {
	margin-right: clamp(2.67rem, calc(80 / 1920 * 100vw), 8rem);
}
.spc-mb-80 {
	margin-bottom: clamp(2.67rem, calc(80 / 1920 * 100vw), 8rem);
}
.spc-ml-80 {
	margin-left: clamp(2.67rem, calc(80 / 1920 * 100vw), 8rem);
}

/* 100px */
.spc-mt-100 {
	margin-top: clamp(3.3rem, calc(100 / 1920 * 100vw), 10rem);
}
.spc-mr-100 {
	margin-right: clamp(3.3rem, calc(100 / 1920 * 100vw), 10rem);
}
.spc-mb-100 {
	margin-bottom: clamp(3.3rem, calc(100 / 1920 * 100vw), 10rem);
}
.spc-ml-100 {
	margin-left: clamp(3.3rem, calc(100 / 1920 * 100vw), 10rem);
}

/* 120px */
.spc-mt-120 {
	margin-top: clamp(4rem, calc(120 / 1920 * 100vw), 12rem);
}
.spc-mr-120 {
	margin-right: clamp(4rem, calc(120 / 1920 * 100vw), 12rem);
}
.spc-mb-120 {
	margin-bottom: clamp(4rem, calc(120 / 1920 * 100vw), 12rem);
}
.spc-ml-120 {
	margin-left: clamp(4rem, calc(120 / 1920 * 100vw), 12rem);
}

/* 180px */
.spc-mt-180 {
	margin-top: clamp(6rem, calc(180 / 1920 * 100vw), 18rem);
}
.spc-mr-180 {
	margin-right: clamp(6rem, calc(180 / 1920 * 100vw), 18rem);
}
.spc-mb-180 {
	margin-bottom: clamp(6rem, calc(180 / 1920 * 100vw), 18rem);
}
.spc-ml-180 {
	margin-left: clamp(6rem, calc(180 / 1920 * 100vw), 18rem);
}

/* 200px */
.spc-mt-200 {
	margin-top: clamp(6.67rem, calc(200 / 1920 * 100vw), 20rem);
}
.spc-mr-200 {
	margin-right: clamp(6.67rem, calc(200 / 1920 * 100vw), 20rem);
}
.spc-mb-200 {
	margin-bottom: clamp(6.67rem, calc(200 / 1920 * 100vw), 20rem);
}
.spc-ml-200 {
	margin-left: clamp(6.67rem, calc(200 / 1920 * 100vw), 20rem);
}

/* Auto helpers */
.spc-mx-auto {
	margin-left: auto;
	margin-right: auto;
}
.spc-ml-auto {
	margin-left: auto;
}
.spc-mr-auto {
	margin-right: auto;
}

/* ---------- Padding (per side) ---------- */
/* 20px */
.spc-pt-20 {
	padding-top: clamp(0.7rem, calc(20 / 1920 * 100vw), 2rem);
}
.spc-pr-20 {
	padding-right: clamp(0.7rem, calc(20 / 1920 * 100vw), 2rem);
}
.spc-pb-20 {
	padding-bottom: clamp(0.7rem, calc(20 / 1920 * 100vw), 2rem);
}
.spc-pl-20 {
	padding-left: clamp(0.7rem, calc(20 / 1920 * 100vw), 2rem);
}

/* 30px */
.spc-pt-30 {
	padding-top: clamp(1rem, calc(30 / 1920 * 100vw), 3rem);
}
.spc-pr-30 {
	padding-right: clamp(1rem, calc(30 / 1920 * 100vw), 3rem);
}
.spc-pb-30 {
	padding-bottom: clamp(1rem, calc(30 / 1920 * 100vw), 3rem);
}
.spc-pl-30 {
	padding-left: clamp(1rem, calc(30 / 1920 * 100vw), 3rem);
}

/* 40px */
.spc-pt-40 {
	padding-top: clamp(1.3rem, calc(40 / 1920 * 100vw), 4rem);
}
.spc-pr-40 {
	padding-right: clamp(1.3rem, calc(40 / 1920 * 100vw), 4rem);
}
.spc-pb-40 {
	padding-bottom: clamp(1.3rem, calc(40 / 1920 * 100vw), 4rem);
}
.spc-pl-40 {
	padding-left: clamp(1.3rem, calc(40 / 1920 * 100vw), 4rem);
}

/* 50px */
.spc-pt-50 {
	padding-top: clamp(1.67rem, calc(50 / 1920 * 100vw), 5rem);
}
.spc-pr-50 {
	padding-right: clamp(1.67rem, calc(50 / 1920 * 100vw), 5rem);
}
.spc-pb-50 {
	padding-bottom: clamp(1.67rem, calc(50 / 1920 * 100vw), 5rem);
}
.spc-pl-50 {
	padding-left: clamp(1.67rem, calc(50 / 1920 * 100vw), 5rem);
}

/* 60px */
.spc-pt-60 {
	padding-top: clamp(2rem, calc(60 / 1920 * 100vw), 6rem);
}
.spc-pr-60 {
	padding-right: clamp(2rem, calc(60 / 1920 * 100vw), 6rem);
}
.spc-pb-60 {
	padding-bottom: clamp(2rem, calc(60 / 1920 * 100vw), 6rem);
}
.spc-pl-60 {
	padding-left: clamp(2rem, calc(60 / 1920 * 100vw), 6rem);
}

/* 70px */
.spc-pt-70 {
	padding-top: clamp(2.33rem, calc(70 / 1920 * 100vw), 7rem);
}
.spc-pr-70 {
	padding-right: clamp(2.33rem, calc(70 / 1920 * 100vw), 7rem);
}
.spc-pb-70 {
	padding-bottom: clamp(2.33rem, calc(70 / 1920 * 100vw), 7rem);
}
.spc-pl-70 {
	padding-left: clamp(2.33rem, calc(70 / 1920 * 100vw), 7rem);
}

/* 80px */
.spc-pt-80 {
	padding-top: clamp(2.67rem, calc(80 / 1920 * 100vw), 8rem);
}
.spc-pr-80 {
	padding-right: clamp(2.67rem, calc(80 / 1920 * 100vw), 8rem);
}
.spc-pb-80 {
	padding-bottom: clamp(2.67rem, calc(80 / 1920 * 100vw), 8rem);
}
.spc-pl-80 {
	padding-left: clamp(2.67rem, calc(80 / 1920 * 100vw), 8rem);
}

/* 100px */
.spc-pt-100 {
	padding-top: clamp(3.3rem, calc(100 / 1920 * 100vw), 10rem);
}
.spc-pr-100 {
	padding-right: clamp(3.3rem, calc(100 / 1920 * 100vw), 10rem);
}
.spc-pb-100 {
	padding-bottom: clamp(3.3rem, calc(100 / 1920 * 100vw), 10rem);
}
.spc-pl-100 {
	padding-left: clamp(3.3rem, calc(100 / 1920 * 100vw), 10rem);
}

/* 120px */
.spc-pt-120 {
	padding-top: clamp(4rem, calc(120 / 1920 * 100vw), 12rem);
}
.spc-pr-120 {
	padding-right: clamp(4rem, calc(120 / 1920 * 100vw), 12rem);
}
.spc-pb-120 {
	padding-bottom: clamp(4rem, calc(120 / 1920 * 100vw), 12rem);
}
.spc-pl-120 {
	padding-left: clamp(4rem, calc(120 / 1920 * 100vw), 12rem);
}

/* 180px */
.spc-pt-180 {
	padding-top: clamp(6rem, calc(180 / 1920 * 100vw), 18rem);
}
.spc-pr-180 {
	padding-right: clamp(6rem, calc(180 / 1920 * 100vw), 18rem);
}
.spc-pb-180 {
	padding-bottom: clamp(6rem, calc(180 / 1920 * 100vw), 18rem);
}
.spc-pl-180 {
	padding-left: clamp(6rem, calc(180 / 1920 * 100vw), 18rem);
}

/* 200px */
.spc-pt-200 {
	padding-top: clamp(6.67rem, calc(200 / 1920 * 100vw), 20rem);
}
.spc-pr-200 {
	padding-right: clamp(6.67rem, calc(200 / 1920 * 100vw), 20rem);
}
.spc-pb-200 {
	padding-bottom: clamp(6.67rem, calc(200 / 1920 * 100vw), 20rem);
}
.spc-pl-200 {
	padding-left: clamp(6.67rem, calc(200 / 1920 * 100vw), 20rem);
}

.spc-plr-base{
	padding-inline: 15px;
}

/* ---------- Mobile reset (<=767pxでゼロにする) ---------- */
/* 必要な面だけを 0 にできるリセット用ユーティリティ */
@media (max-width: 767px) {
	/* margin reset */
	.spc-sm-m-0 {
		margin: 0 !important;
	}
	.spc-sm-mt-0 {
		margin-top: 0 !important;
	}
	.spc-sm-mr-0 {
		margin-right: 0 !important;
	}
	.spc-sm-mb-0 {
		margin-bottom: 0 !important;
	}
	.spc-sm-ml-0 {
		margin-left: 0 !important;
	}
	.spc-sm-mx-0 {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
	.spc-sm-my-0 {
		margin-top: 0 !important;
		margin-bottom: 0 !important;
	}
	.ssp-pl-15{
		padding-left: 15px;
	}
	.ssp-pr-15{
		padding-right: 15px;
	}
	.ssp-plr-15{
		padding-left: 15px;
		padding-right: 15px;
	}
.ssp-mlr-15{
		margin-left: 15px;
		margin-right: 15px;
		width: auto;
	}
	.ssp-mr-15{
		margin-right: 15px;
	}
	.ssp-mtb-1em{
		margin-block: 1em;
	}
	.spc-ml-60,
	.spc-ml-80,
	.spc-ml-40,
	.spc-ml-60{
		margin-left: 0;
	}
	
	


	/* padding reset */
	.spc-sm-p-0 {
		padding: 0 !important;
	}
	.spc-sm-pt-0 {
		padding-top: 0 !important;
	}
	.spc-sm-pr-0 {
		padding-right: 0 !important;
	}
	.spc-sm-pb-0 {
		padding-bottom: 0 !important;
	}
	.spc-sm-pl-0 {
		padding-left: 0 !important;
	}
	.spc-sm-px-0 {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	.spc-sm-py-0 {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}
}

/* ---------- Base Gap ---------- */
.spc-gap-20 {
	gap: clamp(0.7rem, calc(20 / 1920 * 100vw), 2rem);
}
.spc-gap-30 {
	gap: clamp(1rem, calc(30 / 1920 * 100vw), 3rem);
}
.spc-gap-40 {
	gap: clamp(1.3rem, calc(40 / 1920 * 100vw), 4rem);
}
.spc-gap-50 {
	gap: clamp(1.67rem, calc(50 / 1920 * 100vw), 5rem);
}
.spc-gap-60 {
	gap: clamp(2rem, calc(60 / 1920 * 100vw), 6rem);
}
.spc-gap-70 {
	gap: clamp(2.33rem, calc(70 / 1920 * 100vw), 7rem);
}
.spc-gap-80 {
	gap: clamp(2.67rem, calc(80 / 1920 * 100vw), 8rem);
}
.spc-gap-100 {
	gap: clamp(3.3rem, calc(100 / 1920 * 100vw), 10rem);
}
.spc-gap-120 {
	gap: clamp(4rem, calc(120 / 1920 * 100vw), 12rem);
}

/* ---------- Mobile Reset (≤767px) ---------- */
@media (max-width: 767px) {
	.spc-sm-gap-0 {
		gap: 0 !important;
	}
}

.mf_scene-img01 {
	width: calc(750 / 1920 * 100vw);
	max-width: 780px;
	margin-right: calc(-200 / 1920 * 100vw);
	z-index: 10;
	position: relative;
}

.mf_scene-img02 {
	width: calc(630 / 1920 * 100vw);
	max-width: 630px;
	margin-right: calc(-200 / 1920 * 100vw);
	z-index: 10;
}

.mf_menu-img01 {
	width: calc(720 / 1920 * 100vw);
	max-width: 720px;
	margin-left: calc(-200 / 1920 * 100vw);
	z-index: 10;
}

.mf_drink-image01 {
	width: calc(880 / 1920 * 100vw);
	max-width: 880px;
	margin-right: calc(-200 / 1920 * 100vw);
	z-index: 50;
}

.mf_recruit-image01 {
	width: calc(560 / 1920 * 100vw);
	max-width: 560px;
	margin-right: calc(-100 / 1920 * 100vw);
	z-index: 50;
}

.mf_js-center {
	justify-content: center !important;
}

.spc-mlr-auto {
	margin-inline: auto;
}

.bl_mv br{
	display: none;
}
@media (max-width: 1024px) {
	.bl_no-br br{
	display: none;
}
.bl_no-br {
	text-align: left;
}
}

@media (max-width: 767px) {
.bl_mv br{
	display: block;
}
.bl_no-br br{
	display: none;
}
.bl_mv {
	text-align: center;
}
.el_txt-c{
	text-align: left;
}
.bl_kodawari .bl_flex .txt-area p, .bl_kodawari .bl_flex-r .txt-area p,
.bl_features .bl_flex .txt-area p, .bl_features .bl_flex-r .txt-area p,
.bl_reason04.bl_flex-r .txt-area ,
.bl_reason04.bl_flex-r .txt-area p,
.bl_reason04 .top-charm__cont-btn,
.bl_menu-tabehoudai .bl_flex .txt-area p, .bl_menu-tabehoudai .bl_flex-r .txt-area p,
.mf_recruit-image01,
.bl_howto01 .bl_box-w-100 .bl_flex .txt-area, .bl_howto01 .bl_box-w-100 .bl_flex-r .txt-area, .bl_howto01 .bl_box-w-100 .bl_flex .txt-area p, .bl_howto01 .bl_box-w-100 .bl_flex-r .txt-area p,
.bl_reason02 .bl_flex .txt-area ,.bl_reason02 .bl_flex-r .txt-area 
{
	margin-left: 0;
	width: auto;
	max-width: 100%;
}
.mf_scene-img01,
.mf_menu-img01,
.mf_drink-image01,
.bl_box-w-100 .bl_flex .txt-area p, .bl_box-w-100 .bl_flex-r .txt-area p,
.mf_recruit-image01,
.bl_kodawari .bl_flex .txt-area .mf_w930 {
    width: 100%;
    margin-right:0;
    z-index: 10;
		margin-left:0;
		z-index: 10;
		max-width: 100%;
		
}
.bl_scene02 .top-kodawari__cont-btn,
.btn-uber {
    max-width: 100%;
    width: auto;
    margin-left: 0;
    margin-right: 0;
}
.bl_reason02 .bl_flex-r .txt-area{
	margin-left: 0;
}
.bl_reason02 .bl_readon-point {
    font-size: var(--fs-23);
    position: relative;
		margin-block:3em;
}
.bl_reason02 .bl_flex .txt-area {
    margin-right: 0;
    z-index: 10;
}
.bl_reason02 .bl_readon-point:before {
    content: '';
    display: block;
    width: 120px;
    height: 100px;
    position: absolute;
    top: -80px;
    right: 0;
    background: url(/system_panel/uploads/images/img_point01.png) no-repeat;
		background-size: contain;
}

.bl_menu-osusume{
	font-size:1.8rem;

}

.bl_menu-item .mf_fs20{
	font-size:1.8rem;
}
.bl_menu-item{
		font-size:1.8rem;
}


.bl_table {
  display: block;
  overflow-x: auto; /* 横スクロールを許可 */
  white-space: nowrap; /* 折り返し防止 */
  padding: 15px;
	margin-inline: 15px;
}
.bl_table-tr > div:nth-of-type(1) {
	width:16em;
	
}
.bl_table-tr > div:nth-of-type(2) {
	width:8em;
	text-align: center;
}
.bl_table-tr > div:nth-of-type(3) {
		width:10em;
	background: #000;
	text-align: center;
}
.row.bl_table-tr{
	flex-wrap: nowrap;
	width: 34em;
}
.bl_contact-btn-area{
	flex-direction: column;
}
.txt-area + div {
	text-align: center;
}


.bl_kodawari .bl_flex .txt-area + div, .bl_kodawari .bl_flex-r .txt-area + div{
	width: 100%;
	max-width: 100%;
}
.txt-area + div {
    width: 100%;
}
.shop .bl_menu-item{
	flex-direction: column;
}
.shop .bl_menu-item > div {
    padding-block: 0;
		text-align: left;
}
.shop .bl_th{
	width: 100%;
}
.shop .bl_th + div div{
	padding-top:0;
}
.el_fixed-bg {
    background-attachment: scroll; /* ←通常のスクロールに戻す */
		  height: 300px;

	
  }

	.bl_flex .txt-area .mf_w670 {
	width: 80%;

}
}

@media (min-width: 768px){
  .reason-thought__img{
    width: calc(100% / 3);
  }
}

.bl_box-w-100 .bl_flex.bl_flex--center,
.bl_box-w-100 .bl_flex-r.bl_flex--center{
	justify-content: center;
}

.bl_tel-txt p a{
	color: inherit;
}