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

#main_img::before { background: rgba(0, 0, 0, 0.2); }

#lead_col .photo_list { margin-top: 120px; display: flex; gap: 10px; }

@media screen and (max-width: 600px) {
	#lead_col .photo_list { padding: 0 6vw; margin-top: 5px; flex-wrap: wrap; flex-direction: row; gap: 5px; }
	#lead_col .photo_list div { width: calc(50% - 2.5px); }
}


/* ---------------------------------------------------
	共通
------------------------------------------------------ */
.photo:has(p) { position: relative; }
.photo:has(p)::before { content: ''; width: 100%; height: 120px; background: linear-gradient(to bottom, transparent 30%, rgba(0, 0, 0, 0.6) 100%); z-index: 1; position: absolute; bottom: 0; left: 0; }
.photo > p { position: absolute; color: #fff; bottom: 20px; right: 30px; font-size: 16px; z-index: 2; }

p.caution, .caution li { text-indent: calc(1.5em * -1.05); padding-left: calc(1.5em * 1.05); font-size: 16px; }
.caution li + li { margin-top: calc(0.5em * 1.05); }
p.caution::before, .caution li::before { content: '※'; margin-right: 0.5em; }

.cmn_tit01 + p { text-align: center; }

@media screen and (max-width: 600px) {
	.photo:has(p)::before { height: 50%; }
	.photo > p { bottom: 10px; right: 15px; font-size: 13px; }

	p.caution, .caution li { font-size: 14px; }
}


/* ---------------------------------------------------
	sec01
------------------------------------------------------ */
#sec01 { padding: 55px 0 90px; position: relative; }
#sec01::before { content: ''; width: 674px; height: 625px; background: url(../../cuisine/img/sec_bg01.png) no-repeat center/contain; position: absolute; top: -100px; right: -295px; z-index: -1; }
#sec01 .cmn_tit01 { margin-bottom: 30px; }
#sec01 .cmn_tit01 + p { margin-bottom: 55px; }
#sec01 .menu_col { margin-top: 60px; padding: 55px 90px; background: #3d4a69; color: #fff; overflow: hidden; }
#sec01 .menu_col.cmn_bg::before { height: 100%; background-position: left top -850px; }
#sec01 .menu_col .cmn_tit01 { margin-bottom: 45px; }
#sec01 .menu_col .cmn_tit01 .stit { font-size: 14px; }
#sec01 .menu_col .cmn_tit01 .tit { font-size: 24px; }
#sec01 .menu_col dl { position: relative; font-size: 16px; letter-spacing: 0.1em; }
#sec01 .menu_col dl div { width: fit-content; display: flex; flex-wrap: wrap; gap: 7px 0; flex: 1; }
#sec01 .menu_col dl div dt { width: 110px; flex-shrink: 0; }
#sec01 .menu_col dl div dd { width: calc(100% - 110px); }
#sec01 .menu_col + p { margin-top: 1em; }

@media screen and (hover: hover) {
}
@media screen and (min-width: 601px) {
	#sec01 .menu_col dl { display: flex; padding-bottom: 20px; }
	#sec01 .menu_col dl::before { content: ''; display: block; width: 1px; background: #8891a8; order: 2; margin: 0 100px; }
	#sec01 .menu_col dl div:nth-child(1) { order: 1; }
	#sec01 .menu_col dl div:nth-child(2) { order: 3; }

}
@media screen and (max-width: 600px) {
	#sec01 { padding: 0 0 60px; }
	#sec01::before { width: 90vw; height: 85vw; top: -60px; right: -50vw; }
	#sec01 .cmn_tit01 { margin-bottom: 15px; }
	#sec01 .cmn_tit01 + p { margin-bottom: 35px; filter: drop-shadow(0 0 3px var(--color01)) drop-shadow(0 0 3px var(--color01)); }
	#sec01 .menu_col { padding: 30px 6%; }
	#sec01 .menu_col.cmn_bg::before { background-position: left top -600px; }
	#sec01 .menu_col .cmn_tit01 { margin-bottom: 25px; }
	#sec01 .menu_col .cmn_tit01 .stit { font-size: 12px; }
	#sec01 .menu_col .cmn_tit01 .tit { font-size: 20px; }
	#sec01 .menu_col dl { font-size: 14px; }
	#sec01 .menu_col dl div { gap: 7px 0; }
	#sec01 .menu_col dl div + div { margin-top: 7px; }
	#sec01 .menu_col dl div dt { width: 80px; }
	#sec01 .menu_col dl div dd { width: calc(100% - 80px); }

}

/* ---------------------------------------------------
	sec02
------------------------------------------------------ */
#sec02 { padding-bottom: 120px; }
#sec02 .cmn_tit01 { margin-bottom: 20px; }
#sec02 .cmn_tit01 + p { margin-bottom: 95px; }
#sec02 .menu_list { display: flex; flex-wrap: wrap; gap: 70px 3.75%; }
#sec02 .menu_list > div { width: calc(92.5% / 3); }
#sec02 .menu_list .txt { text-align: center; font-size: 18px; margin-top: 5px; letter-spacing: 0.1em; }
#sec02 .menu_list .txt span { display: block; font-size: 16px; margin-top: 5px; }
#sec02 .caution { margin-top: 60px; }

@media screen and (hover: hover) {
}
@media screen and (min-width: 601px) {
}
@media screen and (max-width: 600px) {
	#sec02 { padding-bottom: 60px; }
	#sec02 .cmn_tit01 { margin-bottom: 15px; }
	#sec02 .cmn_tit01 + p { margin-bottom: 35px; }
	#sec02 .menu_list { gap: 20px 3%; }
	#sec02 .menu_list > div { width: calc(97% / 2); }
	#sec02 .menu_list .txt { font-size: 15px; }
	#sec02 .menu_list .txt span { font-size: 13px; margin-top: 3px; }
	#sec02 .caution { margin-top: 30px; }
}


/* ---------------------------------------------------
	sec03
------------------------------------------------------ */
#sec03 { padding: 105px 0 140px; background: url(../img/bg02.jpg); position: relative; overflow: hidden; }
#sec03::before { content: ''; width: 674px; height: 746px; background: url(../../cuisine/img/sec_bg02.png) no-repeat center/contain; position: absolute; top: -200px; left: -235px; z-index: 0; }
#sec03 > * { position: relative; z-index: 1; }
#sec03 .cmn_tit01 { margin-bottom: 90px; }
#sec03 .flex_box { display: flex; justify-content: space-between; }
#sec03 .flex_box + .flex_box { margin-top: 105px;}
#sec03 .flex_box .txt_col h3 { font-size: 26px; margin-bottom: 30px; letter-spacing: 0.1em; }
#sec03 .flex_box .txt_col p { line-height: 2.1; }

@media screen and (hover: hover) {
}
@media screen and (min-width: 601px) {
	#sec03 .flex_box .photo { width: 550px; }
	#sec03 .flex_box .txt_col { width: 400px; }
}
@media screen and (max-width: 600px) {
	#sec03 { padding: 50px 0 70px; }
	#sec03::before {  width: 90vw; height: 96vw; top: -40vw; left: -30vw; }
	#sec03 .cmn_tit01 { margin-bottom: 40px; }
	#sec03 .flex_box { flex-direction: column-reverse; }
	#sec03 .flex_box + .flex_box { margin-top: 60px;}
	#sec03 .flex_box .txt_col { margin-top: 15px;}
	#sec03 .flex_box .txt_col h3 { font-size: 19px; margin-bottom: 5px; }
	#sec03 .flex_box .txt_col p { line-height: 1.8; }
}



/* ---------------------------------------------------
	sec04
------------------------------------------------------ */
#sec04 { background: var(--color04); color: #fff; }
#sec04::before { height: 100%; background-position: top -1010px left; }
#sec04 > div { display: flex; }
#sec04 .txt_col { flex-grow: 1; align-content: center; padding: 80px 5.4% 80px 8.75%; }
#sec04 .txt_col h2 { font-size: 26px; margin-bottom: 25px; letter-spacing: 0.1em;}
#sec04 .txt_col p { line-height: 2.1; letter-spacing: 0.1em;}
#sec04 .txt_col p + p { margin-top: 1em;}
#sec04 .txt_col .name { font-size: 18px; text-align: right; margin-top: 25px; }

@media screen and (hover: hover) {
}
@media screen and (min-width: 601px) {
	#sec04 .photo { width: max(560px, 43.3vw); margin-left: min(-48px, calc((50vw - 50%) * -1)); flex-shrink: 0; }
}
@media screen and (max-width: 600px) {
	#sec04 { padding: 40px 5%; }
	#sec04::before { background-position: top -800px left -600px; }
	#sec04 > div { flex-direction: column; }
	#sec04 .txt_col { padding: 30px 0 0; }
	#sec04 .txt_col h2 { font-size: 19px; margin-bottom: 15px; }
	#sec04 .txt_col p { line-height: 1.8; }
	#sec04 .txt_col .name { font-size: 16px; margin-top: 15px; }
}



/* ---------------------------------------------------
	sec05
------------------------------------------------------ */
#sec05 { padding: 110px 0 115px; background: url(../img/bg02.jpg); position: relative; overflow: hidden; }
#sec05::before { content: ''; width: 674px; height: 746px; background: url(../../cuisine/img/sec_bg02.png) no-repeat center/contain; position: absolute; bottom: -315px; right: -165px; z-index: 0;  }
#sec05 > * { position: relative; z-index: 1; }
#sec05 .cmn_tit01 { margin-bottom: 90px; }
#sec05 .flex_box { display: flex; justify-content: space-between; }
#sec05 .flex_box .txt_col h3 { font-size: 26px; margin-bottom: 35px; letter-spacing: 0.1em; }
#sec05 .flex_box .txt_col p { line-height: 2.1; }
#sec05 .list_col { display: flex; gap: 2.5%; margin-top: 70px; }
#sec05 .list_col > div { width: calc(92.5% / 4);}
#sec05 .list_col > div .txt { margin-top: 5px; }
#sec05 .cake_col { margin-top: 60px; }
#sec05 .cake_col .tit { font-size: 22px; margin-bottom: 10px; }
#sec05 .cake_col p:not(.tit) { line-height: 2.1; }
#sec05 .cake_col .caution { font-size: 16px; }

@media screen and (hover: hover) {
}
@media screen and (min-width: 601px) {
	#sec05 .flex_box .txt_col { width: min(420px, 35%);}
	#sec05 .flex_box .photo_col { width: min(720px, 60%); }


}
@media screen and (max-width: 600px) {
	#sec05 { padding: 60px 0 70px; }
	#sec05::before { width: 90vw; height: 96vw; bottom: -35vw; right: -30vw; }
	#sec05 .cmn_tit01 { margin-bottom: 30px; }
	#sec05 .flex_box { flex-direction: column-reverse; }
	#sec05 .flex_box .txt_col { margin-top: 30px;}
	#sec05 .flex_box .txt_col h3 { font-size: 19px; margin-bottom: 15px; }
	#sec05 .flex_box .txt_col p { line-height: 1.8; }
	#sec05 .list_col { flex-wrap: wrap; gap: 20px 3%; margin-top: 30px; }
	#sec05 .list_col > div { width: calc(97% / 2);}
	#sec05 .cake_col { margin-top: 50px; filter: drop-shadow(0 0 3px var(--color01)) drop-shadow(0 0 3px var(--color01)); }
	#sec05 .cake_col .tit { font-size: 18px; }
	#sec05 .cake_col p:not(.tit) { line-height: 1.8; }
	#sec05 .cake_col .caution { font-size: 14px; }

}



/* ---------------------------------------------------
	sec06
------------------------------------------------------ */
#sec06 { padding: 105px 0 0; position: relative; }
#sec06::before { content: ''; width: 674px; height: 746px; background: url(../../cuisine/img/sec_bg02.png) no-repeat center/contain; position: absolute; bottom: -495px; left: -195px; z-index: -1; }
#sec06 .cmn_tit01 { margin-bottom: 25px; }
#sec06 .cmn_tit01 + p { margin-bottom: 55px; }
#sec06 .txt_col { margin-top: 45px; }
#sec06 .txt_col h3 { margin-bottom: 25px; font-size: 26px; letter-spacing: 0.1em; }
#sec06 .txt_col p { line-height: 2.1; }
#sec06 .rec_col { margin-top: 55px; padding: 60px 45px; background: url(../img/bg02.jpg); display: flex; justify-content: space-between; }
#sec06 .rec_col .txt h3 { font-size: 20px; margin-bottom: 20px; letter-spacing: 0.1em; }
#sec06 .rec_col .txt h3 span { font-size: 26px; display: block; }
#sec06 .rec_col .txt p { line-height: 2.1; }

@media screen and (hover: hover) {
}
@media screen and (min-width: 601px) {
	#sec06 .rec_col .photo { width: 44%;}
	#sec06 .rec_col .txt { width: 50%; }
}
@media screen and (max-width: 600px) {
	#sec06 { padding: 45px 0 0; }
	#sec06::before { width: 90vw; height: 96vw; bottom: -55vw; left: -25vw; }
	#sec06 .cmn_tit01 { margin-bottom: 15px; }
	#sec06 .cmn_tit01 + p { margin-bottom: 35px; }
	#sec06 .txt_col { margin-top: 20px; }
	#sec06 .txt_col h3 { margin-bottom: 15px; font-size: 19px; }
	#sec06 .txt_col p { line-height: 1.8; }
	#sec06 .rec_col { margin-top: 35px; padding: 35px 6%; flex-direction: column; }
	#sec06 .rec_col .txt { margin-top: 25px; }
	#sec06 .rec_col .txt h3 { font-size: 14px; margin-bottom: 10px; }
	#sec06 .rec_col .txt h3 span { font-size: 19px; }
	#sec06 .rec_col .txt p { line-height: 1.8; }
}


/* ---------------------------------------------------
	sec07
------------------------------------------------------ */
#sec07 { padding: 125px 0 165px; }
#sec07 .cmn_tit01 { margin-bottom: 80px; }
#sec07 .flex_box { display: flex; justify-content: space-between; flex-direction: row-reverse; }
#sec07 .flex_box .photo_col .photo > p { bottom: 10px; right: 20px; }
#sec07 .flex_box .txt_col h3 { font-size: 26px; margin-bottom: 20px; letter-spacing: 0.1em; }
#sec07 .flex_box .txt_col p { line-height: 2.1; }
#sec07 .flex_box .txt_col p + p:not(.caution) { margin-top: 2em;}

@media screen and (hover: hover) {
}
@media screen and (min-width: 601px) {
	#sec07 .flex_box .photo_col { width: 55%; }
	#sec07 .flex_box .txt_col { width: 42%; }
}
@media screen and (max-width: 600px) {
	#sec07 { padding: 70px 0; }
	#sec07 .cmn_tit01 { margin-bottom: 40px; }
	#sec07 .flex_box { flex-direction: column; }
	#sec07 .flex_box .photo_col .photo > p { right: 15px; }
	#sec07 .flex_box .txt_col { margin-top: 25px;}
	#sec07 .flex_box .txt_col h3 { font-size: 19px; margin-bottom: 10px; }
	#sec07 .flex_box .txt_col p { line-height: 1.8; }
	#sec07 .flex_box .txt_col p + p:not(.caution) { margin-top: 1em;}
}




/* ---------------------------------------------------
	sec08
------------------------------------------------------ */
#sec08 { padding: 115px 0; background: var(--color04); color: #fff; }
#sec08::before { height: 100%; background-position: top -950px left;}
#sec08 > div { display: flex; justify-content: space-between;}
#sec08 .txt_col h2 { font-size: 26px; margin-bottom: 35px; }
#sec08 .txt_col :where(p, dl) { line-height: 2.1; letter-spacing: 0.1em; }
#sec08 .txt_col dl { margin-top: 40px; }
#sec08 .txt_col dl div { display: flex;}
#sec08 .txt_col dl div dt {flex-shrink: 0;}

@media screen and (hover: hover) {
}
@media screen and (min-width: 601px) {
	#sec08 .photo_col { width: 60%; }
	#sec08 .txt_col { width: 36%; }
}
@media screen and (max-width: 600px) {
	#sec08 { padding: 50px 0 70px; }
	#sec08::before { background-position: top -400px left;}
	#sec08 > div { flex-direction: column; }
	#sec08 .txt_col { margin-top: 20px;}
	#sec08 .txt_col h2 { font-size: 19px; margin-bottom: 10px; }
	#sec08 .txt_col :where(p, dl) { line-height: 1.8; }
	#sec08 .txt_col dl { margin-top: 15px; }
}




/* ---------------------------------------------------
	sec09
------------------------------------------------------ */
#sec09 { padding: 70px 0 80px; }
#sec09 h2 { font-size: 26px; margin-bottom: 25px; }
#sec09 p { line-height: 2.1; letter-spacing: 0.1em; }
#sec09 a { border-bottom: 1px solid var(--txt_color01); letter-spacing: 0.1em; }

@media screen and (hover: hover) {
}
@media screen and (min-width: 601px) {
}
@media screen and (max-width: 600px) {
	#sec09 { padding: 60px 0; }
	#sec09 h2 { font-size: 19px; margin-bottom: 15px; }
	#sec09 p { line-height: 1.8; }
}
