@charset 'utf-8';
/* ======================================== 
食育CSS
========================================*/

/* ==================== ▽ 色設定CSS ▽ ==================== */

/* 給食づくりで大切にしていること */
div.food_box h1 { background-color:#fffcb6; border:1px solid #000; }
div.food_box h1::before, div.food_box h1::after { color:#4ce8c4; }

@media only screen and (min-width:600px) {
/* ◆ ===== タブレット ===== ◆ */

/* 給食づくりで大切にしていること */
div.food_box { border:1px solid #000; }
div.kugiri { background-image:linear-gradient( 90deg,#4CE8C4 50%,transparent 50% ); }

}

@media only screen and (min-width:1025px) {
/* ◆ ===== PC ===== ◆ */

}


/* ==================== ▽ 個別CSS ▽ ==================== */

/* 食育メイン画像 */
div.content_main_ph { margin:25px auto auto auto; max-width:250px; }

/* 給食づくりで大切にしていること */
div.food_box { margin:0 0 60px 0; }
div.food_box h1 { border-radius:5em; font-size:16px; padding:7px 0; margin:0 0 24px 0; }
div.food_box h1::before, div.food_box h1::after { content:'●'; font-size:.5em; vertical-align:middle; }
div.food_box h1::before { margin:0 5px 0 0; }
div.food_box h1::after { margin:0 0 0 5px; }
div.food_box ul { margin:0 0 24px 0; }
div.food_box ul li { text-indent:-1.25em; padding-left:1.25em; }
div.food_box ul li::before { content:'・'; margin:0 .25em 0 0; }
div.food_box img { max-width:180px; }
div.sample_box p { margin:20px 0; }
div.sample_ph img { max-width:225px; }
div.kugiri { margin:60px auto; }
div.list_box { padding:0 20px; margin:0 0 40px 0; }
div.list_box div.list_icon { margin:0 0 20px 0; }
div.list_box div.list_icon img { height:auto; width:80px; }
div.list_box div.list_ph { margin:0 0 20px 0; }
div.list_box div.list_ph img { border-radius:5px; }

@media only screen and (min-width:600px) {
/* ◆ ===== タブレット ===== ◆ */

/* 食育メイン画像 */
div.content_main_ph { margin:36px auto auto auto; max-width:350px; }

/* 給食づくりで大切にしていること */
div.food_box { margin:0 0 80px 0; }
div.food_box { border-radius:5px; position:relative; z-index:1; padding:50px 24px 50px 24px; }
div.food_box h1 { font-size:18px; display:inline-block; padding:7px 24px; margin:0; position:absolute; top:-24px; left:50%; transform:translate(-50%,0); width:400px; }
div.food_box p { display:inline-block; position:absolute; right:-45px; bottom:-30px; }
div.food_box img { max-width:150px; }
div.food_sample { display:flex; justify-content:space-around; align-items:flex-start; }
div.sample_box { padding:0 10px; }
div.kugiri { background-size:3px; height:11px; width:70%; }
div.item_list { display:flex; justify-content:space-around; align-items:flex-start; }
div.list_box { box-sizing:border-box; padding:0 10px; width:33%; }
div.list_box div.list_icon img { height:45px; width:auto; }

}

@media only screen and (min-width:1025px) {
/* ◆ ===== PC ===== ◆ */

/* 食育メイン画像 */
div.content_main_ph { margin:60px auto auto auto; }

/* 給食づくりで大切にしていること */
div.food_box h1 { font-size:20px;padding:7px 24px; width:500px; }
div.food_box { padding:60px 36px; margin:auto auto 50px auto; max-width:750px; }
div.sample_ph { width:50%; }
div.sample_ph img { max-width:400px; }
div.list_box { padding:0 15px; }
div.list_box div.list_icon img { height:80px; }

}
