@charset "utf-8";
/* ===================================================
	Meal Kids Unique Style （モバイルファースト）
====================================================== */
.ofi { width: 100%; height: 100%;}

/* ---------------------------------------------------
Block Contents Navigation
------------------------------------------------------ */
.box_cnav{ width: 92%; margin: 0 auto 40px;}
.box_cnav ul{ display: flex; justify-content: space-between; flex-wrap: wrap; font-size: 18px; line-height: 1; text-align: center;}
.box_cnav ul li{ width: 49%; margin: 0 0 2%; border: solid 1px #aaa; background: #fff; box-sizing: border-box;}
.box_cnav ul li.kids{ border: solid 1px #40281e; background: #40281e; color: #fff;}
.box_cnav ul li a{ display: block; width: 100%; padding: 10px 0;}
.box_cnav ul li a:hover{ text-decoration: none; background-color: #F4F4F4;}
.box_cnav ul li.kids a{ color: #fff; background: #40281e;}

@media screen and (min-width: 601px) {
.box_cnav{ width: 92%; max-width: 1200px; margin: 0 auto 80px;}
.box_cnav ul{ justify-content: center; flex-wrap: nowrap; font-size: 18px;}
.box_cnav ul li{ width: calc( 16.6% - 5px); margin: 0 5px; }
.box_cnav ul li a{ padding: 30px 0;}
}

@media screen and (max-width: 320px) {
.box_cnav ul{ font-size: 16px;}
}


/* ---------------------------------------------------
Section 01
------------------------------------------------------ */
#sec_01{ background: url("../img/bg_wallpaper_02.jpg") repeat center center; padding: 50px 0;}
#sec_01 .tit_01{ text-align: center; font-size: 33px; line-height: 1.8; padding: 0 0 20px; z-index: 3;}
#sec_01 .tit_01 .copy_01{ display: block; font-size: 18px;}
#sec_01 .tit_01 .copy_02{ display: block; color: #40281e;}
#sec_01 .img_01{ width: 100%; height: auto; overflow: hidden; z-index: 1;}
#sec_01 .txt_01{ font-size: 15px; line-height: 2; padding: 15px 4% 0;}

@media screen and (min-width: 601px) {
#sec_01{ padding: 0 0 100px;}
#sec_01 .inner_01{ position: relative; width: 92%; max-width: 1200px; margin: 0 auto;}
#sec_01 .tit_01{ text-align: left; font-size: 46px; line-height: 1.3; padding: 30px 15px; position: absolute; top: 0; right: 100px; background: #fff; display: flex; justify-content: flex-end; flex-direction: row-reverse; width: 2.1em;}
#sec_01 .tit_01 .copy_01{ font-size: 22px; writing-mode: vertical-rl; -ms-writing-mode: tb-rl; font-feature-settings: "palt" 0;}
#sec_01 .tit_01 .copy_02{ writing-mode: vertical-rl; -ms-writing-mode: tb-rl; font-feature-settings: "palt" 0; display: flex; align-items: center; }
#sec_01 .tit_01 .copy_02 .en { writing-mode: horizontal-tb; -ms-writing-mode: lr-tb; line-height: 1; letter-spacing: 0; }
#sec_01 .inner_02{ width: 92%; max-width: 1200px; margin: 0 auto; }
#sec_01 .txt_01{ text-align: center; font-size: 16px; line-height: 2; box-sizing: border-box; padding: 40px 4% 0; }
}


/* ---------------------------------------------------
Section 02
------------------------------------------------------ */
#sec_02 { display: block; position: relative; z-index: 1; background: url(../img/bg_wallpaper_01.jpg) repeat center center; padding: 50px 0; }
#sec_02 .inner { width: 86%; margin: 0 auto;}
#sec_02 .flex_box .img { overflow: hidden;}
#sec_02 .flex_box .box_txt { padding: 15px 0 0 0; }
#sec_02 .flex_box .box_txt .tit_01 { color: #640e10; font-size: 20px; margin-bottom: 10px; }
#sec_02 .flex_box .box_txt .txt_01 { line-height: 2; font-size: 15px; }
#sec_02 .flex_box .box_txt .txt_02 { margin-top: 1em; line-height: 2; font-size: 15px; padding-left: 1em; text-indent: -1em; }
#sec_02 .flex_box .box_txt .txt_02::before { content: '※';}
#sec_02 .flex_box .box_txt .txt_03 { margin-top: 2em; text-align: right; font-size: 15px; }
#sec_02 .flex_box .box_txt .txt_03 .price { font-size: 17px; }
#sec_02 .flex_box .box_txt .txt_03 .price span { font-size: 26px; }
#sec_02 .flex_box + .flex_box { margin-top: 50px;}

@media screen and (min-width: 601px) {
	#sec_02 { padding: 85px 0 135px;}
	#sec_02 .inner { position: relative; width: 92%; max-width: 1200px; }
	#sec_02 .flex_box { display: flex; justify-content: space-between; }
	#sec_02 .flex_box .img { width: 56.67%; flex-shrink: 0; }
	#sec_02 .flex_box .box_txt { padding: 50px 0 0 70px; flex-grow: 1; }
	#sec_02 .flex_box .box_txt .tit_01 { font-size: 28px; margin-bottom: 20px; }
	#sec_02 .flex_box .box_txt .txt_03 .price { font-size: 18px; }
	#sec_02 .flex_box .box_txt .txt_03 .price span { font-size: 30px; }
	#sec_02 .flex_box.no_img::before { content: ''; display: block; width: 56.67%; height: 1px; }
	#sec_02 .flex_box + .flex_box { margin-top: 75px;}
}


/* ---------------------------------------------------
Section 03
------------------------------------------------------ */
#sec_03 { background: url("../img/bg_wallpaper_02.jpg") repeat center center; padding: 0 0 50px; margin-bottom: 40px; }
#sec_03 .inner { width: 86%; margin: 0 auto;}
#sec_03 .tit_01 { font-size: 30px; color: #640e10; text-align: center; padding: 50px 0 20px; letter-spacing: 0.1em; }
#sec_03 .tit_01 span { font-size: 15px; display: block; color: #000; letter-spacing: 0; }
#sec_03 > div > p { font-size: 15px; line-height: 2; }
#sec_03 .flex_box { margin: 30px 0 0; }
#sec_03 .photo_col { margin-bottom: 25px; overflow: hidden;}
#sec_03 .txt_col { font-size: 15px; line-height: 2; }
#sec_03 .txt_col p + p { margin-top: 1em;}
#sec_03 .txt_col span { text-indent: 1.6em; display: block; }
#sec_03 .txt_col p.price { text-align: right; margin-top: 5px;  }
#sec_03 .txt_col p.price span { font-size: 26px; display: inline; }
#sec_03 .txt_col ul { margin-top: 1em; }
#sec_03 dl:first-of-type { margin-top: 20px; border-top: 1px solid #aaa; }
#sec_03 dl:last-of-type { margin-bottom: 25px; }
#sec_03 dl { font-size: 15px; line-height: 2; }
#sec_03 dl .txt_01 { color: #640e10; margin-bottom: 5px; }
#sec_03 dl dt { text-align: center; background: #e7e3d4; padding: 5px; line-height: 1.6; }
#sec_03 dl dd { border-bottom: 1px solid #aaa; box-sizing: border-box; display: flex; justify-content: center; flex-direction: column; }
#sec_03 dl dd div { padding: 15px; border-bottom: 1px solid #aaa; letter-spacing: 0; }
#sec_03 dl dd div:last-child { border-bottom: none; }
#sec_03 dl dd ul li { text-indent: -1.3em; padding-left: 1.3em; }
#sec_03 dl + .coution { line-height: 2; color: #de4819; font-size: 15px; }
#sec_03 .coution li { padding-left: 1em; text-indent: -1em;}
#sec_03 .coution li::before { content: '※'; }
#sec_03 #btn_col { text-align: center; margin-top: 40px; }
#sec_03 #btn_col a { display: block; width: 100%; }
#sec_03 #btn_col .note_01 { margin-top: 10px; font-size: 12px; }

@media screen and (min-width: 601px) {
	#sec_03 { padding: 0 0 120px; margin-bottom: 70px;}
	#sec_03 .inner { position: relative; width: 92%; max-width: 1200px; }
	#sec_03 .tit_01 { font-size: 43px; padding: 100px 0 30px; }
	#sec_03 .tit_01 span { font-size: 24px; margin-bottom: 10px; }
	#sec_03 > div > p { font-size: 15px; text-align: center; }
	#sec_03 .flex_box { display: flex; justify-content: space-between; margin: 50px 0 70px; }
	#sec_03 .photo_col { width: 56.67%; flex-shrink: 0; margin-bottom: 0; }
	#sec_03 .txt_col { margin-left: 70px; }
	#sec_03 .txt_col p + p { margin-top: 2em;}
	#sec_03 .txt_col p.price { font-size: 15px; }
	#sec_03 .txt_col p.price span { font-size: 30px; }
	#sec_03 .txt_col ul { margin-top: 2em; }
	#sec_03 dl:first-of-type { margin-top: 20px; }
	#sec_03 dl dt { border-bottom: 1px solid #aaa; }
	#sec_03 dl:last-of-type { margin-bottom: 25px; }
	#sec_03 dl { display: flex; flex-wrap: wrap; }
	#sec_03 dl dt { width: 200px; padding: 25px 0; box-sizing: border-box; }
	#sec_03 dl dd { width: calc(100% - 200px); }
	#sec_03 dl dd div { display: flex; padding: 25px 30px; }
	#sec_03 dl .txt_01 { width: 260px; }
	#sec_03 #btn_col { margin-top: 75px;}
	#sec_03 #btn_col a { width: fit-content; margin: 0 auto; }
	#sec_03 #btn_col .note_01 { font-size: 16px; }

}