@charset "utf-8";
/* ===================================================
	cuisine CSS
====================================================== */

.sec_slide { line-height: 0; font-size: 0; margin-bottom: 0 !important;}
.sec_slide .item { position: relative; overflow: hidden;}
.sec_slide .slick-list { position: relative; z-index: 0;}
.sec_slide .item::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 320px;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(to bottom,
			rgba(0, 0, 0, 0) 50%,
			rgba(0, 0, 0, 0.3) 75%,
			rgba(0, 0, 0, 0.5) 100%);
}

.sec_slide .item img {
	display: block;
	width: 100%;
}

.sec_slide .item span {
	position: absolute;
	right: 0;
	left: 0;
	bottom: 60px;
	display: table;
	margin: 0 auto;
	color: rgba(255, 255, 255, .7);
	font-size: 18px;
	line-height: 1;
	z-index: 2;
	width: 100%;
	text-align: center;
}

.sec_slide .slick-dots {
	bottom: 20px;
	position: absolute;
	z-index: 3;
}
.sec_slide .slick-slide { position: relative; z-index: 2;}

.sec_slide .slick-dots li {
	width: auto;
	margin: 0 4px;
}

.sec_slide .slick-dots li button {
	padding: 0;
}

/* デフォルト消す */
.sec_slide .slick-dots li button:before {
	content: "";
}

/* 通常dot */
.sec_slide .slick_bot,
.sec_slide .slick_bot2 {
	margin-top: 30px;
}

.sec_slide .slick-dots li button {
	width: 8px;
	height: 4px;
	background: rgba(255, 255, 255, 0.2);
	border-radius: 2px;
	display: block;
	transition: all 0.3s ease;
}

/* active */
.sec_slide .slick-dots li.slick-active button {
	width: 23px;
	background: rgba(255, 255, 255, 0.6);
	border-radius: 2px;
	transform: scaleX(1);
	transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

@media screen and (max-width: 600px) {

	.sec_slide .slick-dots { bottom: 0;}
	.sec_slide .item span { font-size: 14px; bottom: 30px;}
}

/* ---------------------------------------------------
#sec1
------------------------------------------------------ */
#sec1 { padding: 200px 0; background: url(../../cuisine/img/sec1_bg.jpg)no-repeat right -226px top 60px;}
#sec1 h2 { margin: 0 0 70px; text-align: center; font-style: italic; font-size: 40px; color: rgba(65, 65, 65, .6); line-height: 1.5;}
#sec1 h2+img { width: 100%;}
#sec1 .inner_md { padding: 120px 0 140px;}
#sec1 .inner_md p { padding: 0 0 40px; margin: 0 auto; width: 700px; max-width: 100%;}
#sec1_photo { display: flex; width: 100%;}
#sec1_photo li img { width: 100%;}
#sec1_photo li:nth-of-type(1) { width: 62.5%;}
#sec1_photo li:nth-of-type(1) img { height: 750px;}
#sec1_photo li:nth-of-type(2) { width: 37.5%; height: 750px;}
#sec1_photo li:nth-of-type(2) img { height: 50%;}

@media screen and (hover: hover) and (min-width: 601px) {


}

@media screen and (max-width: 600px) {
	#sec1 { padding: 100px 0; background-size: 170% auto; background-position: top right;}
	#sec1 h2 { font-size: 26px; margin: 0 0 30px;}
	#sec1 .inner_md { padding: 50px 0;}
	#sec1 .inner_md p { padding: 0 0 20px;}
	#sec1_photo { display: block;}
	#sec1_photo li:nth-of-type(1) { width: 100%;}
	#sec1_photo li:nth-of-type(1) img { height: 70vw;}
	#sec1_photo li:nth-of-type(2) { width: 100%; display: flex; height: auto;}
	#sec1_photo li:nth-of-type(2) img { width: 50%; height: 35vw;}
}


/* ---------------------------------------------------
#sec2
------------------------------------------------------ */
#sec2 h2 { text-align: center; font-style: italic; font-size: 40px; color: rgba(65, 65, 65, .6); line-height: 1.5;}
#sec2 h2 span { display: block; font-size: 18px;}
#sec2 .meal_time { display: flex; justify-content: center; margin: 20px 0 50px;}
#sec2 .meal_time li { width: 100px; font-style: italic; text-align: center; border: 1px solid #ececec; color: rgba(65, 65, 65, .6);}
#sec2 .meal_time li:nth-of-type(1) { margin-right: 8px; background-color: #ececec;}
#sec2 * { min-height: 0; min-width: 0;}
#sec2 .menu_photo:not(.sec_slide) { position: relative;}
#sec2 .menu_photo+p { padding: 60px 0 70px; text-align: center;}
#sec2 .menu_photo:not(.sec_slide) .item >span { position: absolute; right: 0;
	left: 20px;
	bottom: 30px;
	display: table;
	color: rgba(255, 255, 255, .7);
	font-size: 18px;
	line-height: 1;
	z-index: 2;
	width: 100%;}


#sec2 .menu_wrap { margin-bottom: 160px;}
#sec2 .menu_other { display: flex; justify-content: space-between; margin-top: 100px;}
#sec2 .menu_other li { position: relative; width: 48%;}
#sec2 .menu_other li span { position: absolute; right: 0;
	left: 20px;
	bottom: 20px;
	display: table;
	color: rgba(255, 255, 255, .7);
	font-size: 18px;
	line-height: 1;
	z-index: 2;
	width: 100%;}
#sec2 .menu_other li::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 320px;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(to bottom,
			rgba(0, 0, 0, 0) 50%,
			rgba(0, 0, 0, 0.3) 75%,
			rgba(0, 0, 0, 0.5) 100%);
}

.menu_list h4 { margin: 0 0 30px; font-size: 24px; font-style: italic; color: rgba(133, 117, 114, .6);}
.menu_list li { display: flex; justify-content: space-between; border-bottom: 1px solid rgba(65, 65, 65, .2);; padding: 29px 60px 29px 34px;}
.menu_list li .menu_tit { color: rgba(65, 65, 65, .6);}
.menu_list li .menu_tit span.color1 { padding: 0 0 0 30px; font-size: 16px; color: rgba(192, 41, 41, .7);}
.menu_list li .menu_tit span.color2 { padding: 0 0 0 30px; font-size: 16px; color: rgba(65, 65, 65, .6); font-style: italic;}
.menu_list li .menu_price { width: 100px; font-size: 16px;}
.menu_list ul+p { padding: 30px 0 0; font-size: 16px; opacity: .6;}

@media screen and (max-width: 600px) {
	#sec2 h2 span { font-size: 16px;}
	#sec2 h2 { font-size: 26px;}
	#sec2 .meal_time { margin: 10px 0 30px;}
	#sec2 .menu_wrap >p { margin: 10px 0 30px}

	.menu_list li { padding: 10px 0;}
	.menu_list li .menu_tit span.color1,
	.menu_list li .menu_tit span.color2 { padding: 0;}
	.menu_list ul+p { padding: 20px 0 0;}
	#sec2 .menu_wrap { margin-bottom: 100px;}
	#sec2 .menu_photo:not(.sec_slide) .item >span { bottom: 20px; font-size: 14px;}
	#sec2 .menu_photo+p { padding: 0; text-align: left;}

	#sec2 .menu_other { display: block; margin-top: 50px;}
	#sec2 .menu_other li { width: 100%;}
	#sec2 .menu_other li:nth-of-type(1) { margin-bottom: 10px;}
	#sec2 .menu_other li span { font-size: 14px;}
}

/* ---------------------------------------------------
#sec3
------------------------------------------------------ */
#sec3 { position: relative; padding: 220px 0 200px; background: url(../../cuisine/img/sec3_bg.png)no-repeat right 50px bottom 20px,url(../../cuisine/img/sec3_bg2.gif);}
#sec3 .inner_md { position: relative; z-index: 2;}
#sec3 h2 { margin: 0 0 40px; font-style: italic; font-size: 40px; color: rgba(65, 65, 65, .6); line-height: 1.5;}
#sec3 h2 .meal_time { margin: 0 0 0 40px; display: inline-block; width: 100px; font-size: 18px; font-style: italic; text-align: center; border: 1px solid #ececec; color: rgba(65, 65, 65, .6); background-color: #fff; vertical-align: middle;}
#sec3 .flex_col div { width: 53%; padding: 40px 0 0;}
#sec3 .flex_col div h3 { font-size: 28px; font-style: italic; font-size: 28px; color: rgba(65, 65, 65, .6); line-height: 1.5;}
#sec3 .flex_col p.price { margin-bottom: 30px; color: rgba(65, 65, 65, .6);}
#sec3 .flex_col p.note { margin-top: 30px; color: rgba(65, 65, 65, .6);}
#sec3 .flex_col img { width: 42%;}
#sec3 .flex_col:nth-of-type(1) { margin-bottom: 50px;}

#sec3::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 1;
	background: radial-gradient(ellipse at 18% 18%,
			rgba(235, 210, 214, 0.32) 0%,
			rgba(235, 210, 214, 0.22) 22%,
			rgba(235, 210, 214, 0.12) 42%,
			rgba(235, 210, 214, 0.05) 58%,
			rgba(235, 210, 214, 0) 76%);
}

@media screen and (max-width: 600px) {
#sec3 { padding: 100px 0;}
#sec3 h2 { margin: 0 0 30px; font-size: 26px; text-align: center;}
#sec3 h2 .meal_time { display: table; margin: 0 auto;}
#sec3 .flex_col img,
#sec3 .flex_col div { width: 100%;}
#sec3 .flex_col div { padding: 20px 0 0;}
#sec3 .flex_col div h3 { font-size: 24px;}
#sec3 .flex_col p.price { margin-bottom: 20px;}
#sec3 .flex_col p.note { margin-top: 20px;}
}

/* ---------------------------------------------------
#sec4
------------------------------------------------------ */
#sec4 { padding: 190px 0 130px;}
#sec4 h2 { margin: 0 0 40px; font-style: italic; font-size: 40px; color: rgba(65, 65, 65, .6); line-height: 1.5;}
#sec4 img { width: 42%;}
#sec4 .flex_col div { width: 53%; padding: 40px 0 0;}
#sec4 .flex_col div h3 { font-size: 28px; font-style: italic; font-size: 28px; color: rgba(65, 65, 65, .6); line-height: 1.5;}
#sec4 .flex_col p.price { margin-bottom: 30px; color: rgba(65, 65, 65, .6);}

@media screen and (max-width: 600px) {
	#sec4 { padding: 100px 0 50px;}
	#sec4 h2 { margin: 0 0 20px; font-size: 26px;}
	#sec4 img { width: 100%;}
	#sec4 .flex_col div { width: 100%; padding: 20px 0 0;}
	#sec4 .flex_col p.price { margin-bottom: 20px;}
	#sec4 .flex_col div h3 { font-size: 22px;}
	
}

/* ---------------------------------------------------
#sec5
------------------------------------------------------ */
#sec5 { padding: 0 0 150px;}
#sec5 h2 { margin: 0 0 40px; font-style: italic; font-size: 40px; color: rgba(65, 65, 65, .6); line-height: 1.5;}
#sec5 ul { display: flex; justify-content: space-between;}
#sec5 ul li { width: 48%;}
#sec5 ul li p { padding: 10px 0 0; color: rgba(65, 65, 65, .6);}
#sec5 ul+p { margin: 20px 0 0; color: rgba(65, 65, 65, .6);}


@media screen and (max-width: 600px) {
	#sec5 { padding: 0 0 100px;}
	#sec5 h2 { margin: 0 0 20px; font-size: 26px;}
	#sec5 ul { display: block;}
	#sec5 ul li { width: 100%;}
	#sec5 ul li:nth-of-type(1) { margin-bottom: 20px;}
	#sec5 ul li p { padding: 0;}

}

/* ---------------------------------------------------
#sec6
------------------------------------------------------ */
#sec6 { padding: 200px 0 250px; color: rgba(255,255,255,.6); background: url(../../img/sec_plan_bg1.png)no-repeat right bottom,url(../../img/sec_plan_bg2.png);}
#sec6 h2 { margin: 0 0 40px; font-style: italic; font-size: 40px; line-height: 1.5;}
#sec6 h2 span { display: table; margin: 0 0 20px; padding: 5px 19px; font-size: 20px; font-style: italic; text-align: center; color: #42302c; background-color: #fff; vertical-align: middle;}
#sec6 .flex_col >img { width: 58%;}
#sec6 .flex_col >div { width: 35%;}
#sec6 .flex_col >div p.note { padding: 20px 0 0; text-decoration: underline;}

@media screen and (max-width: 600px) {
	#sec6 { padding: 100px 0;}
	#sec6 h2 { margin: 0 0 20px; font-size: 26px;}
	#sec6 h2 span { margin: 0 0 10px;}
	#sec6 .flex_col >img { width: 100%;}
	#sec6 .flex_col >div { width: 100%; margin: 20px 0 0;}
}

/* ---------------------------------------------------
#sec7
------------------------------------------------------ */
#sec7 { padding: 200px 0 170px;}
#sec7 h2 { margin: 0 0 40px; font-style: italic; font-size: 40px; line-height: 1.5; color: rgba(65, 65, 65, .6); text-align: center;}
#sec7 h2 span { display: block; font-size: 18px;}
#sec7 .flex_col { margin: 65px 0 90px;}
#sec7 .flex_col >p { width: 52%;}
#sec7 .photo_col { width: 40%; }
#sec7 .photo_col p { color: rgba(65, 65, 65, .6);}
#sec7 .list_col h3 { margin: 0 0 40px; font-style: italic; font-size: 40px; line-height: 1.5; color: rgba(65, 65, 65, .6)}
#sec7 .list_col div { padding: 30px 5%; background-color: rgba(65, 65, 65, .07);}
#sec7 .list_col div dl { display: flex; padding: 35px 0; border-bottom: 1px solid rgba(65, 65, 65, .2);}
#sec7 .list_col div dl:last-of-type { border-bottom: none;}
#sec7 .list_col div dt { width: 225px; color: rgba(65, 65, 65, .6);}
#sec7 .list_col div dd { width: calc(100% - 225px); font-size: 16px;}
#sec7 .list_col div dd a { border-bottom: 1px solid #414141;}
#sec7 .list_col div dd dl { display: block; padding: 0; border-bottom: none;}
#sec7 .list_col div dd dl:not(:last-of-type) { padding: 0 0 10px;}
#sec7 .list_col div dd dt,
#sec7 .list_col div dd dd { width: 100%;}

@media screen and (max-width: 600px) {
	#sec7 { padding: 100px 0;}
	#sec7 h2 { margin: 0 0 20px; font-size: 26px;}
	#sec7 h2 span { font-size: 16px;}
	#sec7 .flex_col { margin: 20px 0 50px;}
	#sec7 .list_col h3 { margin: 0 0 20px; font-size: 26px;}
	#sec7 .list_col div { padding: 15px 5%;}
	#sec7 .list_col div dl { display: block; padding: 20px 0;}
	#sec7 .list_col div dt,
	#sec7 .list_col div dd { width: 100%;}
	#sec7 .flex_col >p { width: 100%; margin: 0 0 20px;}
	#sec7 .photo_col { width: 100%;}
}