@charset "utf-8";
/* CSS Document */

.container{
 width: 1080px;
 margin: 0 auto 80px;
}


/*タイトルまわり*/
.titleWrap{
 height: 400px;
 margin-bottom: 110px;
 padding: 169px 177px 0 89px;
 background-repeat: no-repeat;
 background-position: center;
 background-size: cover;
}
.Hospital .titleWrap{ background-image: url("/product/set/images/hospital/bg_title.jpg");}
.Senior .titleWrap{ background-image: url("/product/set/images/senior/bg_title.jpg");}
.Industrial .titleWrap{ background-image: url("/product/set/images/industrial/bg_title.jpg");}
.Restaurant .titleWrap{ background-image: url("/product/set/images/restaurant/bg_title.jpg");}
.Buffet .titleWrap{ background-image: url("/product/set/images/buffet/bg_title.jpg");}
.Kids .titleWrap{
 background-image: url("/product/set/images/kids/bg_title.jpg");
 text-align: right;
}

.titleWrap .text{
 display: inline-block;
 text-align: center;
}
.titleWrap .text p{
 font-size: 1.4rem;
 margin-bottom: 10px;
 text-shadow: 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 8px #fff, 0px 0px 8px #fff, 0px 0px 8px #fff, 0px 0px 8px #fff, 0px 0px 8px #fff, 0px 0px 8px #fff, 0px 0px 8px #fff, 0px 0px 8px #fff;
}
.titleWrap .text h1{
 font-size: 3.6rem;
 letter-spacing: 0.1em;
 text-shadow: 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 8px #fff, 0px 0px 8px #fff, 0px 0px 8px #fff, 0px 0px 8px #fff, 0px 0px 8px #fff;
}
.Hospital .titleWrap .text h1 span{ color: #3467cd;}
.Senior .titleWrap .text h1 span{ color: #d9941d;}
.Industrial .titleWrap .text h1 span{ color: #60b432;}
.Restaurant .titleWrap .text h1 span{ color: #de6641;}
.Buffet .titleWrap .text h1 span{ color: #6455c2;}
.Kids .titleWrap .text h1 span{ color: #d44370;}


/*キャッチコピーまわり*/
.catchArea{
 text-align: center;
 margin-bottom: 85px;
}
.catchArea h2{
 font-size: 2.6rem;
 letter-spacing: 0.1em;
 margin-bottom: 32px;
}
.catchArea p{
 font-size: 1.4rem;
 line-height: 2.7rem;
}


/*ナビゲーションまわり*/
.setNav{
 display: flex;
 justify-content: space-between;
 margin-bottom: 60px;
}
.setNav li{ width: 177px;}
.setNav li a{
 display: block;
 text-align: center;
 height: 30px;
 font-size: 1.2rem;
 font-weight: 400;
 color: #b7b7b7;
 border-bottom: 3px solid #e0e0e0;
 transition: color 0.2s, border-color 0.2s;
}
.setNav .link-hospital a:hover,
.Hospital .setNav .link-hospital a{ color: #3467cd; border-color: #3467cd;}
.setNav .link-senior a:hover,
.Senior .setNav .link-senior a{ color: #d9941d; border-color: #d9941d;}
.setNav .link-industrial a:hover,
.Industrial .setNav .link-industrial a{ color: #60b432; border-color: #60b432;}
.setNav .link-restaurant a:hover,
.Restaurant .setNav .link-restaurant a{ color: #de6641; border-color: #de6641;}
.setNav .link-buffet a:hover,
.Buffet .setNav .link-buffet a{ color: #6455c2; border-color: #6455c2;}
.setNav .link-kids a:hover,
.Kids .setNav .link-kids a{ color: #d44370; border-color: #d44370;}


/*メニュー一覧*/
.menuList{
 display: flex;
 justify-content: space-between;
 align-items: flex-start;
 flex-wrap: wrap;
}
.menuList > li{
 width: 510px;
 margin-bottom: 100px;
 position: relative;
}
/*ヒートサーブアイコン*/
.menuList > li.heatServe::after{
 content: "";
 width: 54px;
 height: 54px;
 background: url("/product/set/images/common/icon_heatserve.png") no-repeat center;
 position: absolute;
 top: 30px;
 right: -27px;
}
/*マイクロサーブアイコン*/
.menuList > li.microServe::after{
 content: "";
 width: 54px;
 height: 54px;
 background: url("/product/set/images/common/icon_microserve.png") no-repeat center;
 position: absolute;
 top: 30px;
 right: -27px;
}
/*電子レンジOKアイコン*/
.menuList > li.rangeok::after{
 content: "";
 width: 54px;
 height: 54px;
 background: url("/product/set/images/common/icon_rangeok.png") no-repeat center;
 position: absolute;
 top: 30px;
 right: -27px;
}
/*エコマークアイコン*/
.menuList > li.eco::after{
 content: "";
 width: 90px;
 height: 38px;
 background: url("/product/set/images/common/icon_eco.png") no-repeat center;
 position: absolute;
 top: 30px;
 right: -27px;
}

/*ヒートサーブ　エコマークアイコン*/
.menuList > li.heatServe_eco::after{
    content: "";
    width: 60px;
    height: 90px;
    background: url("/product/set/images/common/icon_heatserve_eco.png") no-repeat center;
    position: absolute;
    top: 30px;
    right: -27px;
   }
   
.menuList .setImg{
 width: 100%;
 height: auto;
 margin-bottom: 44px;
 /*block要素にしたら余白変わるのでしない*/
}

.menuList .menuTitle{
 text-align: center;
 position: relative;
 padding-bottom: 30px;
 letter-spacing: 0.1em;
 margin-bottom: 36px;
}
.menuList .menuTitle::after{
 content: "";
 display: block;
 width: 40px;
 height: 4px;
 position: absolute;
 bottom: 0;
 left: calc(50% - 20px);
}
.Hospital .menuList .menuTitle::after{ background-color: #3467cd;}
.Senior .menuList .menuTitle::after{ background-color: #d9941d;}
.Industrial .menuList .menuTitle::after{ background-color: #60b432;}
.Restaurant .menuList .menuTitle::after{ background-color: #de6641;}
.Buffet .menuList .menuTitle::after{ background-color: #6455c2;}
.Kids .menuList .menuTitle::after{ background-color: #d44370;}
.menuList .menuTitle p{
 font-size: 1.6rem;
 margin-bottom: 12px;
}
.menuList .menuTitle h3{
 font-size: 2.6rem;
 margin-top: 10px;/*上のキャッチコピーがないときに余白*/
}

.menuList .menuExp{
 font-size: 1.4rem;
 line-height: 2.7rem;
 margin-bottom: 30px;
 text-align: justify;
 text-justify: inter-ideograph;
}

.menuList li h4{
 font-size: 1.6rem;
 margin-bottom: 10px;
}
.menuList .tablewareArea{ margin-bottom: 28px;}
.menuList .tablewareArea > div{
 font-size: 1.2rem;
 line-height: 2.4rem;
 padding: 16px 20px;
 background-color: #f9f9f9;
}
.menuList .tablewareArea > div a{
 color: #003f7e;
 border-bottom: 1px solid #003f7e;
 transition: border-color 0.1s;
}
.menuList .tablewareArea > div a:hover{ border-color: rgba(255,255,255,0);}

.menuList .recipeArea h4{ margin-top: 34px;}
.menuList .recipeArea > p{
 font-size: 1.2rem;
 margin-bottom: 11px;
}
.menuList .recipeArea .dawnloadBtn{
 margin: 0;
 width: 166px;
 height: 38px;
 line-height: 38px;
 font-size: 1rem;
}
.menuList .recipeArea .dawnloadBtn::before{ border-radius: 19px;}
.menuList .recipeArea .dawnloadBtn .dawnloadArrow{
 transform: scale(0.83);
 top: 11px;
 right: 22px;
}
/*レシピなしのときのマージン調整*/
.menuList li > div:last-of-type{ margin-bottom: 0;}


/*幼児給食のアレルギー対応食*/
.menuList .plusArea{ margin-top: 40px;}
.menuList .plusArea > div{
 display: flex;
 align-items: center;
 margin-top: 28px;
}
.menuList .plusArea > div img{
 filter: drop-shadow(0px 3px 4px rgba(0,0,0,0.2));
 margin-right: 19px;
}
.menuList .plusArea > div p{
 font-size: 1.4rem;
 font-weight: 500;
 line-height: 2.4rem;
 margin-top: -20px;
}
.menuList .plusArea > div p span{
 font-size: 1.2rem;
 font-weight: 300;
}