@charset "utf-8";

/*下層ページpageTitle
-----------------------------------------------------------*/
#pageTitle {
	background: url("../../cuisine/images/bg_pagetitle.webp") 50% 50% no-repeat;
	background-size: cover;
}

/* footer
------------------------------------------------------------------------------------ */
footer {
	margin-top:0;
}



body#pageCuisine {
}

body#pageCuisine ul.cuisinePhotoList {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}

body#pageCuisine ul.cuisinePhotoList li {
	width: calc((100% - 60px) / 3);
}
body#pageCuisine ul.cuisinePhotoList li p.cuisinePhotoListText {
	text-align: center;
	margin-top: 10px;
}

body#pageCuisine section#cuisine01 {
}
body#pageCuisine section#cuisine01 div.innerNarrow {
	margin-bottom: 100px;
}
body#pageCuisine section#cuisine01 .isSmall .hoverCardText {
	padding-top: 0;
}

body#pageCuisine section#cuisine02 {
	margin-top: 150px;
	padding-bottom: 150px;
}
body#pageCuisine section#cuisine02 p.sectionFullImage {
	margin-bottom: 100px;
	background: url("../../cuisine/images/bg_cuisine02.jpg") 50% 50% no-repeat;
	background-size: cover;
}
body#pageCuisine section#cuisine02 div.innerNarrow {
	margin-bottom: 100px;
}
body#pageCuisine section#cuisine02 div#photoBlock01 p.photoBlockImage {
	background: url("../../cuisine/images/cuisine02_01.jpg") 50% 50% no-repeat;
	background-size: cover;
}
body#pageCuisine section#cuisine02 div#photoBlock02 p.photoBlockImage {
	background: url("../../cuisine/images/cuisine02_02.jpg") 50% 50% no-repeat;
	background-size: cover;
}

body#pageCuisine section#cuisine03 {
	padding-bottom: 150px;
}
body#pageCuisine section#cuisine03 p.sectionFullImage {
	margin-bottom: 100px;
	background: url("../../cuisine/images/bg_cuisine03.jpg") 50% 50% no-repeat;
	background-size: cover;
}
body#pageCuisine section#cuisine03 div#photoBlock03 {
	margin-bottom: 80px;
}
body#pageCuisine section#cuisine03 div#photoBlock03 p.photoBlockImage {
	background: url("../../cuisine/images/cuisine03_01.jpg") 50% 50% no-repeat;
	background-size: cover;
}
body#pageCuisine section#cuisine03 ul#cuisinePhotoList01 {
	margin-bottom: 80px;
	padding-bottom: 80px;
	border-bottom: solid 1px var(--color-primary);
}
body#pageCuisine section#cuisine03 div#photoBlock04 p.photoBlockImage {
	background: url("../../cuisine/images/cuisine03_05.jpg") 50% 50% no-repeat;
	background-size: cover;
}
body#pageCuisine section#cuisine03 div#photoBlock05 p.photoBlockImage {
	background: url("../../cuisine/images/cuisine03_06.jpg") 50% 50% no-repeat;
	background-size: cover;
}
body#pageCuisine section#cuisine03 ul#cuisinePhotoList02 {
	margin-top: 80px;
}

body#pageCuisine section#cuisine04 {
	padding-bottom: 150px;
}
body#pageCuisine section#cuisine04 p.sectionFullImage {
	margin-bottom: 100px;
	background: url("../../cuisine/images/bg_cuisine04.jpg") 50% 50% no-repeat;
	background-size: cover;
}
body#pageCuisine section#cuisine04 div.innerNarrow {
	margin-bottom: 100px;
}
body#pageCuisine section#cuisine04 ul#cuisinePhotoList03 {
	margin-top: 80px;
}
body#pageCuisine section#cuisine04 ul#cuisinePhotoList03,
body#pageCuisine section#cuisine04 ul#cuisinePhotoList04 {
	margin-bottom: 80px;
	padding-bottom: 80px;
	border-bottom: solid 1px #CCC;
}
body#pageCuisine section#cuisine04 div#photoBlock06 p.photoBlockImage {
	background: url("../../cuisine/images/cuisine04_01.jpg") 50% 50% no-repeat;
	background-size: cover;
}
body#pageCuisine section#cuisine04 div#photoBlock07 p.photoBlockImage {
	background: url("../../cuisine/images/cuisine04_02.jpg") 50% 50% no-repeat;
	background-size: cover;
}

body#pageCuisine section#cuisine04 div#forChild {
	margin-top: 100px;
	padding: 60px;
	background: #eeedeb;
	border-radius: 40px;
}
body#pageCuisine section#cuisine04 div#forChild div#forChildOption {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	margin-top: 50px;
}
body#pageCuisine section#cuisine04 div#forChild div#forChildOption div {
	width: calc((100% - 50px) / 2);
	margin-right: 50px;
}
body#pageCuisine section#cuisine04 div#forChild div#forChildOption div h4.title03 {
	line-height: 1.5;
}
body#pageCuisine section#cuisine04 div#forChild div#forChildOption div h4.title03 span {
	font-size: 1.25rem;
	line-height: 1.5;
	font-weight: 500;
}
.title05 h2 img {
	width: 380px!important;
	margin-top: 2.5rem;
}
body#pageCuisine section#cuisine04 div#forChild div#forChildOption p#forChildOptionPhoto {
	width: calc((100% - 50px) / 2);
}

/* 別注料理（optionMenu）
-----------------------------------------------------------*/
/* 直後に白背景の帯が続くため、区切り線は不要 */
body#pageCuisine section#cuisine04 ul#cuisinePhotoList03 {
	padding-bottom: 0;
	border-bottom: none;
}
body#pageCuisine div.optionMenu {
	--option-gap: 30px; /* スライド間の余白 */
	--option-arrow: 50px; /* 矢印ボタンのサイズ */
	padding: 100px 0;
	background: #FFF;
}
body#pageCuisine div.optionMenu p.optionMenuLead {
	text-align: center;
	line-height: 1.8;
}
body#pageCuisine div.optionMenu p.optionMenuPeriod {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 15px;
	margin-top: 25px;
	font-weight: bold;
}
body#pageCuisine div.optionMenu p.optionMenuPeriod span.optionMenuPeriodLabel {
	display: inline-block;
	padding: 6px 15px;
	font-size: 0.875rem;
	line-height: 1;
	color: #FFF;
	background: var(--color-primary);
}

/* スライダー */
body#pageCuisine div.optionMenu div.optionInner {
	position: relative;
	margin-top: 50px;
}
body#pageCuisine div.optionMenu ul.optionSlider {
	display: flex;
	gap: var(--option-gap);
}
body#pageCuisine div.optionMenu ul.optionSlider.slick-initialized {
	display: block;
}
body#pageCuisine div.optionMenu ul.optionSlider .slick-list {
	margin: 0 calc(var(--option-gap) / -2);
}
/* カードの高さを揃える */
body#pageCuisine div.optionMenu ul.optionSlider .slick-track {
	display: flex;
}
body#pageCuisine div.optionMenu ul.optionSlider .slick-slide {
	height: auto;
}
body#pageCuisine div.optionMenu li.optionItem {
	width: calc((100% - var(--option-gap) * 2) / 3);
	flex-shrink: 0;
	box-sizing: border-box;
}
body#pageCuisine div.optionMenu ul.optionSlider.slick-initialized li.optionItem {
	padding: 0 calc(var(--option-gap) / 2);
}
body#pageCuisine div.optionMenu li.optionItem p.optionItemImage {
	overflow: hidden;
	border-radius: 12px;
	aspect-ratio: 3 / 2;
}
body#pageCuisine div.optionMenu li.optionItem p.optionItemImage img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
body#pageCuisine div.optionMenu li.optionItem h4.optionItemTitle {
	margin-top: 20px;
	font-size: 1.125rem;
	line-height: 1.5;
	font-weight: bold;
	text-align: center;
}
body#pageCuisine div.optionMenu li.optionItem p.optionItemPrice {
	margin-top: 8px;
	font-family: "Manrope", sans-serif;
	font-size: 1.5rem;
	line-height: 1.2;
	font-weight: bold;
	text-align: center;
	color: var(--color-secondary);
}
body#pageCuisine div.optionMenu li.optionItem p.optionItemPrice span {
	margin-left: 2px;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 0.8125rem;
	font-weight: 500;
}
body#pageCuisine div.optionMenu li.optionItem div.optionItemText {
	margin-top: 15px;
	padding-top: 15px;
	border-top: solid 1px var(--color-text);
	font-size: 0.9375rem;
	line-height: 1.8;
}
body#pageCuisine div.optionMenu li.optionItem p.optionItemNote {
	margin-top: 10px;
	padding-left: 1.2em;
	text-indent: -1.2em;
	font-size: 0.8125rem;
	line-height: 1.6;
	color: var(--color-primary);
}
body#pageCuisine div.optionMenu li.optionItem p.optionItemNote::before {
	content: "※";
}

/* 矢印（画像の上下中央に配置） */
body#pageCuisine div.optionMenu div.optionSliderArrows {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 0;
}
body#pageCuisine div.optionMenu button.optionSliderArrow {
	position: absolute;
	top: 0;
	/* margin-topの%は幅基準 → 1枚分の画像幅(3:2)の半分 - 矢印の半分 */
	margin-top: calc(((100% + var(--option-gap)) / 3 - var(--option-gap)) / 3 - var(--option-arrow) / 2);
	z-index: 2;
	width: var(--option-arrow);
	height: var(--option-arrow);
	padding: 0;
	border: solid 1px var(--color-primary);
	border-radius: 50%;
	background: #FFF;
	cursor: pointer;
	transition: background-color 0.3s ease;
}
body#pageCuisine div.optionMenu button.optionSliderPrev {
	left: calc(var(--option-arrow) / -2);
}
body#pageCuisine div.optionMenu button.optionSliderNext {
	right: calc(var(--option-arrow) / -2);
}
body#pageCuisine div.optionMenu button.optionSliderArrow::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 10px;
	height: 10px;
	border-top: solid 2px var(--color-primary);
	border-right: solid 2px var(--color-primary);
	transition: border-color 0.3s ease;
}
body#pageCuisine div.optionMenu button.optionSliderPrev::before {
	transform: translate(-30%, -50%) rotate(-135deg);
}
body#pageCuisine div.optionMenu button.optionSliderNext::before {
	transform: translate(-70%, -50%) rotate(45deg);
}
body#pageCuisine div.optionMenu button.optionSliderArrow:hover {
	background-color: var(--color-primary);
}
body#pageCuisine div.optionMenu button.optionSliderArrow:hover::before {
	border-color: #FFF;
}

/* ドット（バー） */
body#pageCuisine div.optionMenu ul.slick-dots {
	display: flex;
	justify-content: center;
	gap: 15px;
	margin-top: 40px;
	padding: 0;
}
body#pageCuisine div.optionMenu ul.slick-dots li {
	display: flex;
	width: 60px;
	height: 2px;
	margin: 0;
}
body#pageCuisine div.optionMenu ul.slick-dots li button {
	width: 100%;
	height: 100%;
	padding: 0;
	border: none;
	background: #ccc;
	font-size: 0;
	line-height: 0;
	cursor: pointer;
	transition: background 0.3s;
}
body#pageCuisine div.optionMenu ul.slick-dots li.slick-active button {
	background: var(--color-primary);
}

body#pageCuisine div.optionMenu p.optionMenuMessage {
	margin-top: 50px;
	text-align: center;
	line-height: 1.8;
}
body#pageCuisine div.optionMenu p.optionMenuNote {
	margin-top: 10px;
	font-size: 0.875rem;
	text-align: center;
}
body#pageCuisine div.optionMenu p.boxLinkBtn {
	margin-top: 40px;
}



/* PC 小 
------------------------------------------------------------------------------------------------- */
@media screen and (min-width:1001px) and (max-width:1199px) {
}



/* SP 
------------------------------------------------------------------------------------------------- */
@media screen and (max-width:1000px) {
	body#pageCuisine ul.cuisinePhotoList {
		gap: 20px;
	}
	body#pageCuisine ul.cuisinePhotoList li {
		width: calc((100% - 20px) / 2);
	}

	body#pageCuisine section#cuisine01 div.innerNarrow {
		margin-bottom: 50px;
	}

	body#pageCuisine section#cuisine01 div.sectionInner ul li:first-child h3 {
		font-size: 1.8rem!important;
	}

	body#pageCuisine section#cuisine02 {
		margin-top: 50px;
		padding-bottom: 50px;
	}
	body#pageCuisine section#cuisine02 p.sectionFullImage {
		margin-bottom: 50px;
	}

	body#pageCuisine section#cuisine03 {
		padding-bottom: 50px;
	}
	body#pageCuisine section#cuisine03 p.sectionFullImage {
		margin-bottom: 50px;
	}
	body#pageCuisine section#cuisine03 div#photoBlock03 {
		margin-bottom: 50px;
	}
	body#pageCuisine section#cuisine03 ul#cuisinePhotoList01 {
		margin-bottom: 50px;
		padding-bottom: 50px;
	}
	body#pageCuisine section#cuisine03 ul#cuisinePhotoList02 {
		margin-top: 50px;
	}

	body#pageCuisine section#cuisine04 {
		padding-bottom: 50px;
	}
	body#pageCuisine section#cuisine04 p.sectionFullImage {
		margin-bottom: 50px;
	}
	body#pageCuisine section#cuisine04 div.innerNarrow {
		margin-bottom: 50px;
	}
	body#pageCuisine section#cuisine04 ul#cuisinePhotoList03 {
		margin-top: 50px;
	}
	body#pageCuisine section#cuisine04 ul#cuisinePhotoList03,
	body#pageCuisine section#cuisine04 ul#cuisinePhotoList04 {
		margin-bottom: 50px;
		padding-bottom: 50px;
	}

	body#pageCuisine section#cuisine04 div#forChild {
		margin-top: 50px;
		padding: 30px;
		border-radius: 20px;
	}
	body#pageCuisine section#cuisine04 div#forChild div#forChildOption {
		margin-top: 30px;
	}
	body#pageCuisine section#cuisine04 div#forChild div#forChildOption div {
		width: 100%;
		margin-right: 0;
	}
	body#pageCuisine section#cuisine04 div#forChild div#forChildOption div h4.title03 span {
		font-size: 1.25rem;
		line-height: 1.5;
		font-weight: 500;
	}
	body#pageCuisine section#cuisine04 div#forChild div#forChildOption p#forChildOptionPhoto {
		width: 100%;
		margin-top: 20px;
	}
	.title05 h2 img {
		width: 80%!important;
		margin-top: 2.5rem;
	}
	#forChild p.align-c {
		text-align: left;
	}

	/* 別注料理（optionMenu）
	   スライダーは画面幅いっぱい、カード幅80vwを中央に置き前後のカードを左右に覗かせる
	   （矢印・ドットは出さずスワイプで操作） */
	body#pageCuisine div.optionMenu {
		--option-gap: 4vw;
		padding: 50px 0;
	}
	body#pageCuisine div.optionMenu p.optionMenuLead,
	body#pageCuisine div.optionMenu p.optionMenuMessage {
		text-align: left;
	}
	body#pageCuisine div.optionMenu p.optionMenuPeriod {
		flex-direction: column;
		margin-top: 20px;
		text-align: center;
	}
	body#pageCuisine div.optionMenu div.optionInner {
		/* sectionInnerの左右padding(親幅の5%)分はみ出させて画面幅いっぱいにする
		   （5 / 90 = 5.5556%：%指定はsectionInnerの内容幅基準のため） */
		margin: 25px -5.5556% 0;
		overflow: hidden;
	}
	body#pageCuisine div.optionMenu ul.optionSlider {
		padding: 0 10vw;
	}
	body#pageCuisine div.optionMenu ul.optionSlider.slick-initialized {
		padding: 0;
	}
	body#pageCuisine div.optionMenu ul.optionSlider .slick-list {
		margin: 0;
	}
	body#pageCuisine div.optionMenu li.optionItem {
		width: 80vw;
	}
	body#pageCuisine div.optionMenu li.optionItem p.optionItemImage {
		border-radius: 3.2vw;
	}
	body#pageCuisine div.optionMenu li.optionItem h4.optionItemTitle {
		margin-top: 15px;
		font-size: 1rem;
	}
	body#pageCuisine div.optionMenu li.optionItem p.optionItemPrice {
		font-size: 1.25rem;
	}
	body#pageCuisine div.optionMenu li.optionItem div.optionItemText {
		font-size: 0.875rem;
	}
	body#pageCuisine div.optionMenu div.optionSliderArrows,
	body#pageCuisine div.optionMenu ul.slick-dots {
		display: none !important;
	}
	body#pageCuisine div.optionMenu p.optionMenuMessage {
		margin-top: 30px;
	}
	body#pageCuisine div.optionMenu p.optionMenuNote {
		text-align: left;
	}
	body#pageCuisine div.optionMenu p.boxLinkBtn {
		margin-top: 30px;
	}
}