h1{
	line-height:3vw;
	text-align: center;
	margin: 7.5% auto 2.5%;
	letter-spacing: 0.2vw;
}
.in-page-flex0{
	display:flex;
	justify-content: space-between;
	align-items: center;
	width: 45%;
	margin: auto auto 7.5%;
}
.in-page0-chi{
	width:45%;
	background-color:#535119;
	padding-top: 0.5em;
	padding-bottom:0.5em;
	text-align: center;
	color:white;
}
.in-page-chi{
	width:19.5%;
	position:relative;
}
.in-page-chi img{aspect-ratio:1/1;}
.in-page-chi label{
	position: absolute;
	top: 50%; 
	left: 50%; 
	transform: translate(-50%, -50%);
	color:white;
}
.slider-container {
	position: relative;
	width: 100%;
	aspect-ratio:1200/675;
}

.slider {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	opacity: 0;
	transition: opacity 1s ease; /* フェード用のトランジション */
}

.active-slide {
	opacity: 1;
}

.button-container {
	text-align: right;
	margin-top: 1%;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin-bottom: 1%;
}

.slider-btn,.slider-btn2,.slider-btn3,.slider-btn4,.slider-btn5 {
	aspect-ratio:1200/675;
	width: 16%;
	margin: 0 0.1%;
	cursor: pointer;
	border:none;
	background-color:#dee2e2;
	background-size:100% 100%;
}
.active-btn {
	border: 2px solid #535119;  /* アクティブ時の背景色 */
}
.meal-section-region{
	margin: 5% auto;
	display: block;
}
.meal-section-region:first-of-type{
	margin-top: 10%;
}
.meal-section-content-region{
	width:68%;
	margin: auto;
}
.meal-section-content-region h2{
	margin: 15% auto 5%;
	width:fit-content;
}
.meal-flex1,.meal-flex2{
	display:flex;
	justify-content: space-between;
}
.mt5{margin-top:5%!important;}
.mb5{margin-bottom:5%!important;}
.meal-flex1-chi{
	width:50%;
	text-align: justify;
	text-align-last:left;
	display: flex;
	justify-content: center;
	align-items: center;
}
.kondate-yoyaku{
	width:100%;
	display:flex;
	justify-content: space-between;
	align-items: flex-start;
}
.kondate-region{
    width: 50%;
    aspect-ratio: 5 / 4;
    border: 1px solid #535119;
    writing-mode: vertical-rl;
    text-orientation: upright;
    white-space: nowrap;
    display: flex;
    text-align: left;
    gap: 3%;
    padding: 2%;
    /* margin-left: 3%;*/
}
.category,.food-name{
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-direction: column;
	margin: 0 auto 5%;
}
.category{height:3vw;}
.food-name{height:16vw;}
.meal-page-yoyaku-region{
	width:50%;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	margin-top:3%;
}
.yusyoku-img-grid{
	display:grid;
	grid-template-columns: repeat(6, 1fr);
	column-gap: 2%;
	margin: 5% auto;
}
.meal-flex1-chi-content{width:66%;}
.t-justfy{text-align:justify;text-align-last: left;}

.kondate-yoyaku a,.plan-chi-region a{
	width: 50%;
	margin: 10% auto auto 0;
	background-color: #535119;
	padding-top: 2%;
	padding-bottom: 2%;
	margin-bottom: 0;
	color: white;
	display: flex;
	justify-content: center;
}

#dinner{
	margin: auto auto 5%;
	width:68%;
}
#dinner h2{
	text-align: center;
	margin-bottom:3%;
	letter-spacing: 1vw;
}
#dinner p{
	text-align:center;
}
.in-page-flex{
	margin: 5% auto;
	display:flex;
	justify-content: space-between;
	align-items: flex-start;
	column-gap: 1%;
	text-align: center;
}
#dinner label{
	white-space: nowrap;
}
#in-page-flex-container{
	display:flex;
	justify-content: space-between;
	align-items: center;
	column-gap: 0.5%;
}


#plan-ichiran{
	width:65%;
	margin: auto;
	display: grid;
	grid-template-columns: repeat(2,1fr);
	gap:5%;
}
.plan-chi-region{margin-bottom:10%;}
.plan-chi-region p{
	padding-right: 5%;
	padding-left: 5%;
	margin-top:5%;
}
.plan-chi-region a{margin-left:5%;margin-top:5%;}

#tsuika-ryouri-content,#nomimono-content-region{
	width:40%;
	margin: auto;
	text-align: center;
}
#tsuika-ryouri-content h2{margin-bottom:2%;}
.tsuika-ryouri-grid{
	margin: 5% auto;
	display:grid;
	grid-template-columns: 1fr 1fr;
	text-align: center;
	gap: 5%;
}
#nomimono-flex{
	display:flex;
	justify-content: space-between;
	margin: 10% auto;
}
.nomimono-flex-chi{
	width:45%;
}
.sake-flex{
	display:flex;
	justify-content: space-around;
}
.sake-name{width:50%;}
.sake-karasa{width:25%;}
.sake-ryou{width:25%;}
.shochu-name{width:60%;}
.shochu-sanchi{width:30%;}
.sake-name,.shochu-sanchi{text-align: left;}
#nomimono{margin:10% auto;}
#nomimono h3{
	width:100%;
	padding-bottom:3%;
	border-bottom:1px solid #535119;
}
#wine,#sparkling{
	text-align: left;
	padding-left: 1%;
}
#wine h3,#sparkling h3{
	padding-bottom:2%;
	margin-bottom:1%;
}
#wine p,#sparkling p{
	margin-top:3%;
}
#nomimono h4{
	margin: 5% auto;
}
#sparkling{margin-top:10%;}
.row-reverse{flex-direction: row-reverse;}
.sake-txt-tyousei{padding-left:2.5%;display: block;}
.nomimono-menu{text-align:left;padding-left: 10%;}
/*以下スマホ*/
@media(max-width:768px){
	
	#dinner label{
		white-space: unset;
	}
	h1{
		width:90%;
		text-align: justify;
		margin: 10% auto;
	}
	.meal-flex1-chi-content {
		width: 100%
	}
	.meal-flex1-chi-content p:nth-child(1){
		margin-top:5%;
	}
	.meal-flex1-chi-content p:nth-child(2){
		margin-top:-3%;
		margin-bottom:10%!important;
	}
	.yusyoku-img-grid{
		row-gap:2%;
		
	}
	.kondate-yoyaku{display:block;}
	.kondate-region{
		width:100%;
		margin-left:0;
		padding:5%;
		aspect-ratio:100/99;
		column-gap: 0;
	}
	.kondate-region p{width:5vw;}
	.category{height:12vw;}
	.food-name{height:55vw;}
	.meal-page-yoyaku-region{
		width:100%;
	}
	.kondate-yoyaku a, .plan-chi-region a {
		margin: 7.5% auto 15%;
	}
	#plan-ichiran {
		width: 95%;
		display: block;
	}
	.plan-chi-region p {
		padding-right: 1%;
		padding-left: 1%;
		margin-top: 2%;
	}
	.yusyoku-img-grid{
		display:grid;
		grid-template-columns: repeat(3, 1fr);
		margin: auto auto 10%;
	}
	
	#dinner label {
		margin-top: 0;
		margin-bottom:5%!important;
		white-space: nowrap
	}


	#dinner{
		width:95%;
	}
	.meal-section-content-region{
		width: 95%;
	}
	.slider-btn,.slider-btn2,.slider-btn3,.slider-btn4,.slider-btn5 {
		aspect-ratio:1/1;
		background-size:cover;
		background-position: center;
	}
	.meal-flex1{display:block;}
	.meal-flex1-chi{width:100%;}
	.meal-flex1-chi a {
		margin: 5% auto auto auto;
	}
	.slider-buttons label {
		width: 4vw;
		height: 4vw;
	}
	#tsuika-ryouri-content, #nomimono-content-region {
		width: 95%;
	}
	#nomimono {
		margin: 20% auto;
	}
	.nomimono-menu {
		font-size:3.3vw!important;
		letter-spacing: -0.1vw!important;
		padding-left: 0;
	}
	.nomimono-flex-chi{width:49%;}
	.plan-txt .fs26{letter-spacing:1vw!important;}
	.sp-ls05{letter-spacing:-0.5vw!important;}
	.sp-ls15{letter-spacing:-1.5vw!important;}
	.mb5-sp{margin-bottom:5%!important;}
	.sake-txt-tyousei{padding-left:4%;}
}
#okosama{
	width: 100%;
	aspect-ratio:600/420;
}

/*以下献立スタイル*/
.kondate-txt-flex{
	display:flex;
	justify-content: space-between;
	align-items: flex-start;
}
.kondate-txt-l,.kondate-txt-r{
	width:50%;
	padding: 5%;
}
.menu-contents {
	border:1px solid #535119;
}

/* --- タブボタンのスタイル --- */
.tab-buttons {
	display: flex;
	width: 65%;
}

.tab-button {
    background-color: transparent;
	border:1px solid #535119;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	color:#535119;
}

/* アクティブな（選択されている）タブのスタイル */
.tab-button.active {
    color: #fff; /* テキスト色を白に */
    background-color: #535119; /* 画像の濃い緑色を再現 */
    /* アクティブなタブには下線やボーダーを付けないで、コンテンツエリアと一体感を出す */
}

/* タブボタンの境界線 */
.tab-buttons .tab-button:first-child {
    border-right: 1px solid #ccc;
}

/* --- 献立内容のスタイル --- */
.menu-contents {
	padding: 5%;
	aspect-ratio: 443 / 500;
}

.menu-content.hidden {
    display: none; /* 非表示にする */
}

.menu-content p{line-height:1.75vw;}
.kondate-a{
	background: #535119;
	color: white;
	padding: 0.5rem 1rem;
	text-align: center;
	display: block;
	width:60%;
	margin: 20% auto auto;
}
.kondate-a:hover{
	color: white;
}
.tsukigawari-region h2,.tsuika-region h2{margin:10% auto 2%;}
.kisetsu-flex{
	display: flex;
	justify-content: center;
	align-items: flex-start;
	gap: 1%;
	margin-top: 5%;
}
.kisetsu-flex-chi{
	width:24%;
	text-align: center;
}
#tsuika .fs24{
	text-align:center;
	margin:2% auto;
}
#okosama-region{margin-top:7.5%;margin-bottom:-2.5%;}
#kisetsu-gentei-goannai{margin:5% auto;}
#kisetsu-gentei-goannai a{
	display:flex;
	justify-content: left;
	align-items: flex-end;
	margin-top: 5%;
}
#kisetsu-gentei-goannai a span{
	width:85%;
	display: block;
	color:#2a290d;
	line-height: 2vw;
}
#kisetsu-gentei-goannai a img{
	width:6%;
	display: block;
	margin-bottom:0.4vw;
}
.drink-nav-flex{
	display:flex;
	align-items: center;
	justify-content: space-between;
	gap:1%;
}
.drink-nav-flex a,.drink-nav-flex a img{aspect-ratio:310/235;}
.drink-nav-flex a{width:24%;}
#drink-nav{margin:10% auto;}

@media(max-width:768px){
	.meal-section-region p{
		text-align: justify;
		text-align-last:left;
	}
	.in-page0-chi {
		width: 48%;
	}
	.in-page-chi {
		width: 49%;
		margin-bottom: 2%;
	}
	.in-page-flex {flex-wrap: wrap;}
	#dinner,.in-page-flex0{width:95%;}
	.kondate-txt-l, .kondate-txt-r {
		width: 100%;
	}
	.kondate-txt-flex {
		display: block;
	}
	.kondate-txt-r{padding-top:0;}
	.kondate-txt-l{padding-bottom:0;padding-top:5%;}
	.kondate-a{width:90%;margin:0 auto 20%;}
	.kisetsu-flex{
		flex-wrap:wrap;
		justify-content: space-between;
	}
	.kisetsu-flex-chi {
		width: 49%;
		margin-bottom: 5%;
	}
	.kisetsu-flex-chi p{
		line-height: 4vw !important;
        margin-top: 5%;
	}
	.tsukigawari-region h2, .tsuika-region h2 {
		margin: 10% auto 5%;
	}
	#kisetsu-gentei-goannai a {
		justify-content: center;
	}
	#kisetsu-gentei-goannai a span {
		width: 65%;
		line-height: 6.5vw;
	}
	.meal-section-region {
		margin: 15% auto;
	}
	#kisetsu-ajiwai{margin-bottom:0;}
	#tsuika{margin:10% auto;}
	#kisetsu-gentei-goannai {
		margin: -5% auto 5%;
	}
	#drink-nav {
		margin: -5% auto 15%;
	}
	.drink-nav-flex a {
		width: 49%;
	}
	.drink-nav-flex{
		flex-wrap: wrap;
	}
	.in-page-flex0 {margin-bottom: 15%;}
}
