@charset "utf-8";

.breadcrumb{
    margin: 0px auto 20px;
    width: 98%;
}

.breadcrumb ol {
  list-style: none;
  display: flex;
  gap: 0.5em;
  flex-wrap: wrap;
    font-size: 12px;
}
.breadcrumb li::after {
  content: ">";
  margin: 0 0.5em;
}
.breadcrumb li:last-child::after {
  content: "";
}






#contents.list-raw-materials .listrmBox ul li.cream-stew-sauce{
    display:block;
}

#contents.list-raw-materials .listrmBox ul li.autumn-winter-blend{
    display:block;
}






#contents.list-raw-materials .listrmBox ul li.amani-omega .buyArea{
    display:none;
}


#contents.list-raw-materials .listrmBox ul li.fish-collagen .buyArea{
    display:none;
}



#contents.list-raw-materials .listrmBox ul li.cream-stew-sauce .buyArea{
    display:none;
}

/*#contents.list-raw-materials .listrmBox ul li.autumn-winter-vegetable .buyArea{
    display:none;
}*/



/*#contents.list-raw-materials .newItem.listrmBox{
    display:none;
}*/



#contents.list-raw-materials .listrmBox ul li.horsemeat{
    display:block;
}



#contents.list-recipe .listRecipeBox ul li.horse{
    display:block;
}


.feeding #contents.list-recipe .listRecipeBox ul li.horse{
    display:block;
}


.key{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    display:none;
}

.home .key{
    display:block;
}

.key img{
    width:100%;
    height: auto;
}

#contents{
   margin: 0px 0px 0px 0px; 
}

#contents h2{
    margin: 0px auto 20px;
    padding: 0px 0px 0px 0px;
}

#contents h2 img{
    width: 100%;
}

#contents .lead{
    margin: 0px 0px 20px 0px;
    text-align: center;
    font-size: 16px;
    line-height: 1.4em;
}

#contents .txtBox{
    margin: 0px auto 50px;
    padding: 0px 0px 0px 0px;
    max-width: 800px;
    width: 98%;
}

#contents .txtBox p{ 
    margin: 0px 0px 20px 0px;
    font-size: 16px;
    line-height: 1.5em;
    text-align:left;
}

#contents .txtBox p:last-child{ 
    margin: 0px 0px 0px 0px;
    
}

#contents .txtBox p.red{
    color:#B31F21;
    font-weight: bold;
}


@media (max-width: 767px){
    
    .key{
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        width: 100%;
    }

    .key img{
        width: 100%;
        height: auto;
    }
    
    
    #contents{
        margin: 0px auto;
        padding: 0px 0px 0px 0px;
    }
    
    #contents h2{
        margin: 0px auto 20px;
        padding: 0px 0px 0px 0px;
    }
    
    #contents h2 img{
        width: 100%;
    }
    
    
    
    #contents .lead{
        margin: 0px 0px 20px 0px;
        text-align: center;
        font-size: 3.5vw;
    }
    
    #contents .txtBox{
        margin: 0px auto 20px;
        padding: 0px 0px 0px 0px;
        width: 96%; 
    }
    
    #contents .txtBox p{ 
        margin: 0px 0px 20px 0px;
        font-size: 3.5vw;
        line-height: 1.5em;
    }
}




#contents.guide{
    margin: -60px auto 0px;
    padding: 0px 0px 0px 0px;
    max-width: 1000px;
}

#contents.guide h2{
    max-width: 240px;

}

#contents.guide h3{
    margin: 0px auto 20px;
    padding: 0px 0px 0px 0px;
    color: #006835;
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    line-height: 1.6em;

}

#contents.guide h3 em{
    font-style: italic;
}

#contents.guide h3 span.l01{
    margin: 0px 4px 0px 4px;
    padding: 4px 4px 4px 4px;
    background-color: #006835;
    color: #ffffff;
    font-size: 16px;
    font-weight: normal;
}

#contents.guide h3 span.l02{
    margin: 0px 4px 0px 0px;
    padding: 4px 10px 4px 10px;
    background-color: #eb6100;
    color: #ffffff;
    font-size: 16px;
    font-weight: normal;
}

#contents.guide h3 span.l03{
    margin: 0px 0px 0px 0px;
    padding: 4px 10px 4px 10px;
    background-color: #e60012;
    color: #ffffff;
    font-size: 16px;
    font-weight: normal;
}

#contents.guide .gbox{
    margin: 0px 0px 50px 0px;
    padding: 0px 0px 50px 0px;
    border-bottom: dotted 1px #666666;
}

#contents.guide .gbox .pic{
    margin: 0px auto 50px;
    max-width: 800px;
}

#contents.guide .gbox.guide02 .pic{
    margin: 0px auto 50px;
    max-width: 600px;
}

#contents.guide .gbox.guide04 .pic{
    margin: 0px auto 50px;
    max-width: 400px;
}

#contents.guide .gbox.guide05 .pic{
    margin: 0px auto 50px;
    max-width: 400px;
}

#contents.guide .gbox .btn{
    margin: 0px auto;
    max-width: 400px;
}

@media (max-width: 767px){
    #contents.guide{
        margin: -40px auto 0px;
        padding: 0px 0px 0px 0px;
        width: 98%;
    }
    
    #contents.guide h2{
        width: 60%;
        
    }
    
    #contents.guide h3{
        margin: 0px auto 20px;
        padding: 0px 0px 0px 0px;
        color: #006835;
        text-align: center;
        font-size: 5vw;
        font-weight: bold;
        line-height: 1.8em;
        
    }
    
    #contents.guide .guide02 h3{
        font-size: 5vw;   
    }
    
    #contents.guide .guide03 h3{
        font-size: 5vw;   
    }
    
    #contents.guide h3 em{
        font-style: italic;
    }
    
    #contents.guide h3 span.l01{
        margin: 0px 4px 0px 4px;
        padding: 4px 4px 4px 4px;
        background-color: #006835;
        color: #ffffff;
        font-size: 3.2vw;
        font-weight: normal;
    }
    
    #contents.guide h3 span.l02{
        margin: 0px 4px 0px 0px;
        padding: 4px 10px 4px 10px;
        background-color: #eb6100;
        color: #ffffff;
        font-size: 3.2vw;
        font-weight: normal;
    }
    
    #contents.guide h3 span.l03{
        margin: 0px 0px 0px 0px;
        padding: 4px 10px 4px 10px;
        background-color: #e60012;
        color: #ffffff;
        font-size: 3.2vw;
        font-weight: normal;
    }
    
    #contents.guide .gbox{
        margin: 0px 0px 50px 0px;
        padding: 0px 0px 30px 0px;
        border-bottom: dotted 1px #666666;
    }
    
    #contents.guide .gbox .pic{
        margin: 0px auto 20px;
        width: 98%;
    }
    
    #contents.guide .gbox .btn{
        margin: 0px auto;
        width: 90%;
    }    
}


#contents.food-rotation{
    margin: 0px auto 20px;
}


#contents.food-rotation h2{
    margin: 0px auto 20px;
    max-width: 600px;
}

#contents.food-rotation.blend h2{
    margin: 0px auto 20px;
    max-width: 400px;
}

#contents.food-rotation.food-rotation-f h2,
#contents.food-rotation.food-rotation-b h2,
#contents.food-rotation.food-rotation-h h2{
    margin: 0px auto 20px;
    max-width: 500px;
}

#contents.food-rotation.food-rotation-f h2.f3,
#contents.food-rotation.food-rotation-b h2.f3,
#contents.food-rotation.food-rotation-h h2.f3{
    margin: 0px auto 20px;
    max-width: 550px;
}



#contents.food-rotation.food-rotation-f h2.cy,
#contents.food-rotation.food-rotation-b h2.cy,
#contents.food-rotation.food-rotation-h h2.cy{
    margin: 0px auto;
    max-width: 600px;
}










#contents.food-rotation .lead{
    margin: 0px auto 40px;
    max-width: 900px;
    width: 96%;
    text-align: left;
}

#contents.food-rotation .lead p{
    margin: 0px 0px 20px 0px;
    text-align: left;
}

#contents.food-rotation .lead p.rmemo{
    margin: 0px 0px 6px 0px;
}

#contents.food-rotation .lead p.rmemo em{
    margin: 0px 2px 0px 0px;
    padding: 2px 2px 2px 2px;
    font-style: normal;
    font-weight: bold;
    background-color: #ffffdf;
}

#contents.food-rotation .lead p.rmemo span{
    color: #be1724;
    font-weight: bold;
    font-size: 22px;
}



#contents.food-rotation .lead .pic{
    margin: 0px auto 20px;
    max-width: 60px;
}

#contents.food-rotation .lead .pic01{
    margin: 0px auto 20px;
    width: 100%;
}

#contents.food-rotation.food-rotation-f .lead,
#contents.food-rotation.food-rotation-b .lead,
#contents.food-rotation.food-rotation-h .lead{
    margin: 0px auto 10px;
    
}


#contents.food-rotation .lead .bnrBox{
    margin: 0px auto 12px;
    padding: 0px 0px 0px 0px;
    display:flex;
}

#contents.food-rotation .lead .bnrBox p{
    margin: 0px 0px 0px 0px;
    width: 49%;
}

#contents.food-rotation .lead .bnrBox p.l{
    margin: 0px 0px 0px 0px;
}

#contents.food-rotation .lead .bnrBox p.r{
    margin: 0px 0px 0px 2%;
}



.fbuyArea .tt {
    margin: 0px auto 10px;
    border: solid 1px #1a1a1a;
}

.fbuyArea .tt p {
    margin: 0px 0px 0px 0px;
    padding: 4px 0px 4px 0px;
    text-align: center;
    background-color: #ffffdf;
    border: solid 3px #ffffff;
}

.fbuyArea .tt p span{
    margin: 0px 3px 0px 0px;
    padding: 3px 3px 4px 3px;
    background-color: #0f6022;
    color: #ffffff;
    font-size: 0.9em;
}

#contents .fbuyArea .txtBox{
    margin: 0px auto;
    padding: 0px 0px 0px 0px;
    width: 96%;
}

#contents .fbuyArea .txtBox p{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 0px;
    font-size: 16px;
}

#contents .fbuyArea .txtBox .bold{
    font-weight: bold;
}

#contents .fbuyArea .txtBox .bold span{
    color: #be1724;
}

@media (max-width: 767px){
    
    #contents .fbuyArea .txtBox{
        margin: 0px auto;
        padding: 0px 0px 0px 0px;
        width: 96%;
    }
    
    #contents .fbuyArea .txtBox p{
        margin: 0px 0px 10px 0px;
        padding: 0px 0px 0px 0px;
        font-size: 3.6vw;
    }

    #contents .fbuyArea .txtBox .bold{

    }
    
    
}









#contents.food-rotation .courseDetail{
    margin: 0px auto 0px;
    padding: 0px 0px 0px 0px;
    max-width: 900px;
}







#contents.food-rotation .courseDetail h3{
    margin: 0px auto 0px;
    text-align: center;
    background-color: #0f6022;
}









#contents.food-rotation.sample .courseDetail h3{
    margin: 0px auto 30px;
    text-align: center;
    background-color: #b4d56e;
}

#contents.food-rotation .courseDetail h3 img{
    margin: 0px auto;
    max-width: 600px;
}




#contents.food-rotation .courseDetail .pic{
    margin: 0px auto 30px;
    padding: 20px 0px 0px 0px;
    max-width: 800px;

}

#contents.food-rotation .courseDetail .pic01{
    margin: 0px auto 0px;
    padding: 20px 0px 0px 0px;
    max-width: 600px;

}

#contents.food-rotation.blend .courseDetail .pic01{
    margin: 0px auto 0px;
    padding: 0px 0px 0px 0px;
    max-width: 600px;

}

#contents.food-rotation.blend .courseDetail .pic02{
    margin: 0px auto 20px;
    padding: 30px 0px 0px 0px;
    max-width: 550px;

}


#contents.food-rotation.blend .courseDetail .pic03{
    margin: 0px auto 30px;
    padding: 0px 0px 0px 0px;
    max-width: 450px;

}




#contents.food-rotation .courseDetail .txtBox{
    margin: 0px auto 30px;
    max-width: 800px;
}


#contents.food-rotation.sample .courseDetail .txtBox p span{
    color: #eb6100;
    font-weight: bold;
}

#contents.food-rotation.sample .courseDetail h4{
    margin: 0px auto 10px;
    padding: 10px 0px 10px 0px;
    max-width: 600px;
    text-align: center;
    color: #0f6022;
    font-weight: bold;
    border: dotted 1px #0f6022;
    border-radius: 10px;
    font-size: 16px;
}

#contents.food-rotation.sample .courseDetail .sB{
    margin: 0px 0px 0px 0px;
    display:block;
}

#contents.food-rotation.sample .courseDetail .sB .sB01{
    margin: 0px auto;
    width: 98%;
}

#contents.food-rotation.sample .courseDetail .sB .sB02{
    margin: 0px auto;
    width: 98%;
}


#contents.food-rotation.sample .sBox{
    margin: 0px auto 20px;
    padding: 30px 0px 0px 0px;
    max-width: 900px;
    display:flex;
    flex-wrap: wrap;
    
}

#contents.food-rotation.sample .sBox .pic{
    margin: 0px auto 30px;
    width: 48%;
}



#contents.food-rotation.sample .delibox{
    margin: 0px auto 20px;
    padding: 20px 10px 20px 10px;
    width: 48%;
    background-color: #efefef;
}

#contents.food-rotation.sample .delibox .pic{
    margin: 0px auto;
    width: 90%;
}

#contents.food-rotation.sample .delibox .txt{
    margin: 0px auto;
    width: 90%;
}

#contents.food-rotation.sample .delibox .txt p{
    margin: 0px 0px 10px 0px;
    font-size: 14px;
    line-height: 1.4em;
}

#contents.food-rotation.sample .delibox .txt p span{
    padding: 3px 3px 3px 3px;
    background-color: #ffffff;
    font-weight: bold;
    font-size: 14px;
}

#contents.food-rotation.sample .sB02 .buyArea .attention{
    margin: 0px auto 20px;
    width: 90%;
    color: #ff0000;
    line-height: 1.5em;
    font-weight: bold;
}

#contents.food-rotation.sample .sB02 .buyArea .txtBox{
    margin: 0px auto 20px;
    width: 90%;
}

#contents.food-rotation.sample .sB02 .buyArea .txtBox p span{
    color: #191919;
}

#contents.food-rotation.sample .sB02 .buyArea .link{
    margin: 0px 0px 20px 0px;
    text-align: center;
}

#contents.food-rotation.sample .sB02 .buyArea .link a{
    color: #00a0e9;
}



#contents.food-rotation.sample .sBox .sampleB{
    margin: 0px auto;
    width: 48%;
    display:flex;
}


#contents.food-rotation.sample .sBox .sampleB .pic{
    padding-top: 30px;
    width: 40%;
}

#contents.food-rotation.sample .sBox .sampleB .boxR{
    width: 55%;
}

#contents.food-rotation.sample .sBox .sampleB .boxR .tit{
    margin: 0px 0px 4px 0px;
    padding: 0px 0px 4px 0px;
    font-size: 18px;
    font-weight: bold;
    border-bottom: dotted 1px #1a1a1a;
}

#contents.food-rotation.sample .sBox .sampleB .boxR .cal{
    margin: 0px 0px 8px 0px;
    font-size: 14px;
}

#contents.food-rotation.sample .sBox .sampleB .boxR .dtl{
    line-height: 1.3em;
}

#contents.food-rotation.sample .sBox .sampleB .boxR .protein{
    margin: 0px 0px 0px 0px;
    padding: 4px 4px 4px 4px;
    background-color: #db77ac;
    color: #ffffff;
}

#contents.food-rotation.sample .sBox .sampleB .boxR .vegetable{
    margin: 0px 0px 0px 0px;
    padding: 4px 4px 4px 4px;
    background-color: #39b576;
    color: #ffffff;
}


#contents.food-rotation.sample .sBox .sampleB .boxR .carbohydrates{
    margin: 0px 0px 0px 0px;
    padding: 4px 4px 4px 4px;
    background-color: #a0835c;
    color: #ffffff;
}

#contents.food-rotation.sample .sBox .sampleB .boxR ul li{
    margin: 0px 0px 6px 0px;
    font-size: 13px;
}







@media (max-width: 767px){
    #contents.food-rotation{
        margin: 0px auto 0px;
        padding: 0px 0px 0px 0px;
        width: 98%;
    }
    
    
    #contents.food-rotation h2{
        width: 96%;
        
    }
    
    #contents.food-rotation .lead{
        margin: 0px auto 20px;
        width: 96%;
        text-align: left;
    }
    
    #contents.food-rotation .lead p{
        margin: 0px 0px 20px 0px;
        text-align: left;
    }
    
    #contents.food-rotation .lead p.rmemo em{
        margin: 0px 2px 0px 0px;
        padding: 2px 2px 2px 2px;
        font-style: normal;
        font-weight: bold;
        background-color: #ffffdf;
    }

    #contents.food-rotation .lead p.rmemo span{
        color: #be1724;
        font-weight: bold;
        font-size: 22px;
    }
    
    #contents.food-rotation .courseDetail{
        margin: 0px auto 0px;
        padding: 0px 0px 0px 0px;
        width: 100%;
        
    }
    
    #contents.food-rotation .courseDetail h3{
        margin: 0px auto; 
        padding: 0px 0px 5px 0px;
    }
    
    #contents.food-rotation.sample .courseDetail h3{
         margin: 0px auto 10px; 
    }
    
    #contents.food-rotation .courseDetail h3 img{
        width: 100%;       
    }
    
    
    
    
    
    
    
    #contents.food-rotation .courseDetail .pic{
        margin: 0px auto 10px;
        padding: 10px 0px 0px 0px;
        width: 96%;
        
    }
    
    #contents.food-rotation .courseDetail .pic01{
        margin: 0px auto 0px;
        padding: 10px 0px 0px 0px;
        width: 90%;

    }
    
    #contents.food-rotation.blend .courseDetail .pic01{
        margin: 0px auto 0px;
        padding: 0px 0px 0px 0px;
        width: 96%;

    }
    
    
    #contents.food-rotation .courseDetail .txtBox{
        margin: 0px auto 20px;
    }
    
    
    
    #contents.food-rotation.blend .courseDetail .pic02{
        margin: 0px auto 20px;
        width: 90%;
    }
    
    #contents.food-rotation.blend .courseDetail .pic03{
        margin: 0px auto 20px;
        width: 80%;
    }
    
    
    
    
    
    #contents.food-rotation.sample .courseDetail .sB{
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        display:block;
    }

    #contents.food-rotation.sample .courseDetail .sB .sB01{
        margin: 0px 0px 50px 0px;
        width: 100%;
    }

    #contents.food-rotation.sample .courseDetail .sB .sB02{
        margin: 0px 0px 0px 0px;
        width: 100%;
    }
    
    #contents.food-rotation.sample .courseDetail .sB .pic{
        margin: 0px auto 10px;
        width: 90%;
        
    }
    
    
    #contents.food-rotation.sample .courseDetail .txtBox p span{
        color: #eb6100;
        font-weight: bold;
    }
    
    #contents.food-rotation.sample .courseDetail h4{
        margin: 0px auto 10px;
        padding: 10px 0px 10px 0px;
        width: 96%;
        text-align: center;
        color: #0f6022;
        font-weight: bold;
        border: dotted 1px #0f6022;
        border-radius: 10px;
        font-size: 3.2vw;
    }
    
    
    #contents.food-rotation.sample .delibox{
        margin: 0px auto;
        padding: 10px 4px 10px 4px;
        background-color: #efefef;
        width: 98%;
    }
    
    #contents.food-rotation.sample .delibox .pic{
        margin: 0px auto;
        width: 90%;
    }
    
    #contents.food-rotation.sample .delibox .txt{
        margin: 0px auto;
        width: 98%;
    }
    
    #contents.food-rotation.sample .delibox .txt p{
        margin: 0px 0px 10px 0px;
        font-size: 3vw;
        line-height: 1.4em;
    }
    
    #contents.food-rotation.sample .delibox .txt p span{
        padding: 3px 3px 3px 3px;
        background-color: #ffffff;
        font-weight: bold;
        font-size: 2.8vw;
    }
    
    
    #contents.food-rotation.sample .sB02 .buyArea{
        padding: 30px 0px 20px 0px;
        position: relative;
    }
    
    #contents.food-rotation.sample .sB02 h3{
        margin: 0px auto;
        padding: 10px 0px 10px 0px;
        width: 90%;
        background-image:none;
        background-color: #ffffff;
        color: #0f6022;
        text-align: center;
        border: dotted 1px #0f6022;
        border-radius: 20px;
        position: absolute;
        top:-17px;
        left:5%;
    }
    
    
    #contents.food-rotation.sample .sB02 .buyArea .attention{
        margin: 0px auto 20px;
        width: 86%;
        color: #ff0000;
        line-height: 1.5em;
        font-weight: bold;
    }
    
    #contents.food-rotation.sample .sB02 .buyArea .txtBox{
        
    }
    
    #contents.food-rotation.sample .sB02 .buyArea .txtBox p{
        
    }
    
    #contents.food-rotation.sample .sB02 .buyArea .txtBox p span{
        color: #191919;
    }
    
    #contents.food-rotation.sample .sB02 .buyArea .link{
        margin: 0px 0px 20px 0px;
        text-align: center;
    }
    
    #contents.food-rotation.sample .sB02 .buyArea .link a{
        color: #00a0e9;
    }
    
    #contents.food-rotation.sample .sBox{
        display:block;
    }
    
    #contents.food-rotation.sample .sBox .sampleB{
        margin: 0px 1% 20px 1%;
        width: 98%;
        display:flex;
    }
    
    #contents.food-rotation.sample .sBox .sampleB .pic{
        margin: 0px auto;
        padding: 0px 0px 0px 0px;
        width: 38%;
    }

    #contents.food-rotation.sample .sBox .sampleB .boxR{
        margin: 0px auto;
        width: 55%;
    }
    
    #contents.food-rotation.sample .sBox .sampleB .boxR .tit{
        margin: 0px 0px 4px 0px;
        padding: 0px 0px 4px 0px;
        font-size: 3.8vw;
        font-weight: bold;
        border-bottom: dotted 1px #1a1a1a;
    }

    #contents.food-rotation.sample .sBox .sampleB .boxR .cal{
        margin: 0px 0px 8px 0px;
        font-size: 3.4vw;
    }

    #contents.food-rotation.sample .sBox .sampleB .boxR .dtl{
        line-height: 1.3em;
    }

    #contents.food-rotation.sample .sBox .sampleB .boxR .protein{
        margin: 0px 0px 0px 0px;
        padding: 4px 4px 4px 4px;
        background-color: #db77ac;
        color: #ffffff;
    }

    #contents.food-rotation.sample .sBox .sampleB .boxR .vegetable{
        margin: 0px 0px 0px 0px;
        padding: 4px 4px 4px 4px;
        background-color: #39b576;
        color: #ffffff;
    }


    #contents.food-rotation.sample .sBox .sampleB .boxR .carbohydrates{
        margin: 0px 0px 0px 0px;
        padding: 4px 4px 4px 4px;
        background-color: #a0835c;
        color: #ffffff;
    }

    #contents.food-rotation.sample .sBox .sampleB .boxR ul li{
        margin: 0px 0px 6px 0px;
        font-size: 3.1vw;
    }
    
    
    
}


#contents.food-rotation .buyArea{
    margin: 0px auto 20px;
    padding: 30px 10px 30px 10px;
    max-width: 600px;
    background-color: #ebfcdc;
    border-radius: 10px;
} 

#contents.food-rotation.blend .buyArea{
    margin: 0px auto 20px;
    padding: 30px 10px 30px 10px;
    max-width: 600px;
    background-color: #ebfcdc;
    border-radius: 10px;
} 

#contents.food-rotation .buyArea h3{
    margin: 0px auto 0px;
    padding: 10px 0px 10px 40px;
    width: 70%;
    color: #0f6022;
    font-size: 20px;
    font-weight: bold;
    text-align: left;
    background: url("../img/food-rotation/arrow-popular.png") no-repeat left top;
    background-size: 36px auto;
    
}

#contents.food-rotation.blend .buyArea h3{
    padding: 10px 0px 10px 0px;
    background-color: transparent;
    background-image: none;
    line-height: 1.5em;
    width: 100%;
    text-align: center;
}




#contents.food-rotation.sample .courseDetail .buyArea h3{
    padding: 10px 0px 10px 0px;
    background:none;
    background-color: #ebfcdc;
}

#contents.food-rotation .buyArea .txt{
    margin: 0px auto 10px;
    width: 30%;
}


#contents.food-rotation.blend .buyArea .txt{
    margin: 0px auto 10px;
    width: 60%;
}

#contents.food-rotation #fr1500 .buyArea .txt{
    margin: 0px auto 10px;
    width: 50%;
}



#contents.food-rotation .pic.fr{
    margin: 0px auto 10px;
    max-width: 600px;
}


#contents.food-rotation .smemo{
    margin: 0px auto 40px;
    max-width: 600px;
    font-size: 14px;
}



#contents.food-rotation .buyArea .perserving{
    font-size: 12px;
    text-align: center;
    
}

#contents.food-rotation .buyArea .perserving em{
    margin: 0px 3px 0px 10px;
    
    color: #0f6022;
    font-size: 1.2em;
    font-weight: bold;
    
}

#contents.food-rotation .buyArea .perserving span{
    
    color: #0f6022;
    font-size: 3em;
    font-weight: bold;
    

}


#contents.food-rotation .buyArea .perserving img{
    margin: 0px 10px 0px 0px;
    width: 100px;
}




#contents.food-rotation .buyArea .detailBox{
}



#contents.food-rotation .buyArea .detailBox .price{
    margin: 0px auto 10px;
    padding: 0px 0px 10px 0px;
    width: 70%;
    display:flex;
    border-bottom: solid 1px #4c4c4c;
}

#contents.food-rotation .buyArea .detailBox .price .p01{
    width: 20%;
    text-align: center;
}

#contents.food-rotation .buyArea .detailBox .price select{
    width: 13%;
    text-align: center;
}

#contents.food-rotation .buyArea .detailBox .price .p02{
    width: 60%;
    text-align: center;
}

#contents.food-rotation .buyArea .detailBox .present{
    margin: 0px auto 10px;
    width: 70%;
}

#contents.food-rotation .buyArea .detailBox .check{
    margin: 0px auto 10px;
    width: 90%;
    font-size: 13px;
}

#contents.food-rotation .buyArea .detailBox .buy01{
    margin: 0px auto;
    width: 60%;
}


#contents.food-rotation.sample .buyArea .detailBox .check{
    margin: 0px auto 3px;
    width: 90%;
    color: #e60012;
}



#contents.food-rotation.sample .buyArea .detailBox .check input{
    border-color: #e60012;
}

#contents.food-rotation.sample .buyArea .detailBox .memo{
    margin: 0px auto 10px;
    width: 90%;
    color: #e60012;
    font-size: 14px;
}


#contents.food-rotation.sample .buyArea .detailBox .price{
    font-size: 24px;
    text-align: center;
    display:block;
}

#contents.food-rotation.sample .buyArea .detailBox .price em{
    font-size: 0.6em;
}





@media (max-width: 767px){
    #contents.food-rotation .buyArea{
        margin: 0px auto 40px;
        padding: 20px 10px 10px 10px;
        width: 96%;
        background-color: #ebfcdc;
        border-radius: 10px;
    }
    
    #contents.food-rotation .buyArea h3{
        margin: 0px auto 0px;
        padding: 10px 0px 10px 40px;
        width: 90%;
        color: #0f6022;
        font-size: 4vw;
        font-weight: bold;
        text-align: left;
        background: url("../img/food-rotation/arrow-popular.png") no-repeat left top;
        background-size: 36px auto;
    }
    
    #contents.food-rotation #fr1500 .buyArea h3{
        padding: 10px 0px 10px 40px;
        width: 90%;
    }
    
    #contents.food-rotation .buyArea .txt{
        margin: 0px auto;
        width: 40%;
    }
    
    #contents.food-rotation #fr1500 .buyArea .txt{
        margin: 0px auto;
        width: 60%;
    }
    
    #contents.food-rotation.blend .buyArea .txt{
        margin: 0px auto 10px;
        width: 90%;
    }
    
    
    #contents.food-rotation .buyArea .perserving{
        font-size: 3vw;
        text-align: center;
    }
    
    #contents.food-rotation .buyArea .perserving em{
        margin: 0px 3px 0px 10px;
        color: #0f6022;
        font-size: 1.2em;
        font-weight: bold;
    }
    
    #contents.food-rotation .buyArea .perserving span{
        color: #0f6022;
        font-size: 2.6em;
        font-weight: bold;
        
    }
    
    #contents.food-rotation .buyArea .detailBox{
    }
    
    
    
    #contents.food-rotation .buyArea .detailBox .price{
        margin: 0px auto 10px;
        padding: 0px 0px 10px 0px;
        width: 70%;
        display:flex;
        border-bottom: solid 1px #4c4c4c;
    }
    
    #contents.food-rotation .buyArea .detailBox .price .p01{
        width: 20%;
        text-align: center;
    }
    
    #contents.food-rotation .buyArea .detailBox .price select{
        width: 13%;
        text-align: center;
    }
    
    #contents.food-rotation .buyArea .detailBox .price .p02{
        width: 60%;
        text-align: center;
    }
    
    #contents.food-rotation .buyArea .detailBox .present{
        margin: 0px auto 10px;
        width: 90%;
    }
    
    #contents.food-rotation .buyArea .detailBox .check{
        margin: 0px auto 10px;
        width: 90%;
        font-size: 13px;
    }
    
    #contents.food-rotation .buyArea .detailBox .buy{
        margin: 0px auto 10px;
        width: 80%;
    }
    
    
    #contents.food-rotation .buyArea .detailBox .buy01{
        margin: 0px auto;
        width: 80%;
    }
    
    
    #contents.food-rotation.sample .buyArea .detailBox .check{
        margin: 0px auto 3px;
        width: 90%;
        color: #e60012;
    }
    
    
    
    #contents.food-rotation.sample .buyArea .detailBox .check input{
        border-color: #e60012;
    }
    
    #contents.food-rotation.sample .buyArea .detailBox .memo{
        margin: 0px auto 10px;
        width: 90%;
        color: #e60012;
        font-size: 3.4vw;
    }
    
    
    #contents.food-rotation.sample .buyArea .detailBox .price{
        font-size: 6vw;
        text-align: center;
        display:block;
    }
    
    #contents.food-rotation.sample .buyArea .detailBox .price em{
        font-size: 0.6em;
    }
    
    
    #contents.food-rotation .pic.fr{
        margin: 0px auto 10px;
        width: 98%;
    }
    
    #contents.food-rotation .smemo{
        margin: 0px auto 20px;
        width: 98%;
        font-size: 3.4vw;
    }
    
    
}



#contents.food-rotation.blend .buyArea2{
    margin: 0px auto 0px;
    padding: 30px 10px 30px 10px;
    max-width: 600px;
    background-color: #fffcc1;
    border-radius: 10px;
} 


#contents.food-rotation.blend .buyArea2 h3 {
    margin: 0px auto 0px;
    padding: 10px 0px 10px 0px;
    width: 70%;
    color: #0f6022;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    background-color: transparent;
    background-image: none;
    line-height: 1.5em;
}

#contents.food-rotation.blend .buyArea2 .perserving {
    margin: 0px 0px 20px 0px;
    font-size: 12px;
    text-align: center;
}

#contents.food-rotation.blend .buyArea2 .perserving img {
    margin: 0px 10px 0px 0px;
    width: 100px;
}

#contents.food-rotation.blend .buyArea2 .perserving span {
    color: #0f6022;
    font-size: 3em;
    font-weight: bold;
}

#contents.food-rotation.blend .buyArea2 .buy01{
    margin: 0px auto;
    width: 60%;
}

#contents.food-rotation .courseDetail .cdList{
    margin: 0px auto;
    padding: 0px 0px 50px 0px;
    max-width: 800px;
    background:url("../img/food-rotation/bg-cdlist.png") no-repeat center bottom;
    background-size: auto 50px;
    
}

#contents.food-rotation .courseDetail .cdList ul{
    margin: 0px auto;
    padding: 20px 60px 20px 60px;
    width: 100%;
    background:#efefef;
    border-radius: 10px;
}

#contents.food-rotation .courseDetail .cdList ul li{
    margin: 0px 0px 20px 0px;
    padding: 0px 0px 10px 0px;
    display:flex;
    align-items:center;
    border-bottom: dotted 1px #487f5e;
}

#contents.food-rotation .courseDetail .cdList ul li:last-child{
    margin: 0px 0px 0px 0px;
}

#contents.food-rotation .courseDetail .cdList ul li p.no{
    margin: 0px 10px 0px 0px;
    max-width: 80px;
}



#contents.food-rotation .courseDetail .cdList ul li p.txt{
    max-width: 700px;
    line-height: 1.5em;
}

#contents.food-rotation .courseDetail .cdList ul li p.txt span{
    color: #0f6022;
    font-weight: bold;
}

#contents.food-rotation .courseDetail .best{
    margin: -50px auto 20px;
    max-width: 350px;
}


#contents.food-rotation .buyArea .tit{
    margin: 0px auto 20px;
    width: 74%;
}

#contents.food-rotation .buyArea .attention{
    margin: 0px auto 20px;
    width: 80%;
}

#contents.food-rotation .buyArea .attention li{
    margin: 0px 0px 10px 0px;
    line-height: 1.2em;
    font-size: 13px;
}

#contents.food-rotation .buyArea .attention li span{
    color: #eb6100;
}

#contents.food-rotation .buyArea .bowl{
    margin: 0px auto 20px;
    max-width: 380px;
}

#contents.food-rotation .buyArea .priceB{
    margin: 0px 0px 40px 0px;
}


#contents.food-rotation .buyArea .priceB .memo{
    margin: 5px 0px 5px 0px;
    text-align:center;
}


.questionnaire{
    margin: 0px auto 20px;
    max-width: 800px;
    width: 96%;
}


@media (max-width: 767px){
    
    
    #contents.food-rotation .courseDetail .cdList{
        margin: 0px auto;
        padding: 0px 0px 32px 0px;
        width: 90%;
        background:url("../img/food-rotation/bg-cdlist.png") no-repeat center bottom;
        background-size: auto 32px;

    }

    #contents.food-rotation .courseDetail .cdList ul{
        margin: 0px auto;
        padding: 10px 10px 10px 10px;
        width: 100%;
        background:#efefef;
        border-radius: 10px;
    }

    #contents.food-rotation .courseDetail .cdList ul li{
        margin: 0px 0px 20px 0px;
        padding: 0px 0px 10px 0px;
        display:flex;
        align-items:center;
        border-bottom: dotted 1px #487f5e;
    }

    #contents.food-rotation .courseDetail .cdList ul li:last-child{
        margin: 0px 0px 0px 0px;
    }

    #contents.food-rotation .courseDetail .cdList ul li p.no{
        margin: 0px 10px 0px 0px;
        width: 16%;
    }

    #contents.food-rotation .courseDetail .cdList ul li p.txt{
        width: 84%;
        line-height: 1.5em;
        font-size: 3.6vw;
    }
    
    #contents.food-rotation .courseDetail .cdList ul li:nth-child(1) p.txt{
        margin: 0px 10px 0px 0px;
        width: 69%;
    }

    #contents.food-rotation .courseDetail .cdList ul li p.txt span{
        color: #0f6022;
        font-weight: bold;
    }
    
    #contents.food-rotation .courseDetail .best{
        margin: -37px auto 20px;
        width: 70%
    }
    
    #contents.food-rotation .buyArea .tit{
        margin: 0px auto 20px;
        width: 90%;
    }
    
    #contents.food-rotation .buyArea .attention{
        margin: 0px auto 20px;
        width: 96%;
    }
    
    #contents.food-rotation .buyArea .bowl{
        margin: 0px auto 20px;
        width: 80%;
    }
    
    
    #contents.food-rotation.blend .buyArea2{
        margin: 0px auto 0px;
        padding: 10px 10px 10px 10px;
        width: 96%;
        background-color: #fffcc1;
        border-radius: 10px;
    } 
    
    #contents.food-rotation.blend .buyArea2 .buy01{
        margin: 0px auto;
        width: 80%;
    }
    
    
    
    #contents.food-rotation .questionnaire{
        margin: 0px auto 20px;
        width: 98%;
    }

    
}



#contents.food-rotation .courseDetail .t1{
    margin: 0px auto 20px;
    max-width: 500px;
}

@media (max-width: 767px){
    #contents.food-rotation .courseDetail .t1{
        margin: 0px auto 14px;
        width: 90%;
    }   
}




#contents.food-rotation .courseDetail .tab{
    background-color: #0f6022;
}

#contents.food-rotation .courseDetail .tab ul{
    margin: 0px auto;
    width: 98%;
    display:flex;
    
}

#contents.food-rotation .courseDetail .tab.t3 ul{
    margin: 0px auto;
    width: 76%;
    display:flex;    
}



#contents.food-rotation .courseDetail .tab ul li{

}

#contents.food-rotation.blend .courseDetail .title{
    margin: 0px auto 20px;
    padding: 20px 0px 0px 0px;
    max-width: 420px;
}

@media (max-width: 767px){
    #contents.food-rotation .courseDetail .tab ul{
        margin: 0px auto;
        width: 98%;
        display:flex;
    }
    
    #contents.food-rotation .courseDetail .tab.t3 ul{
        margin: 0px auto;
        width: 98%;
        display:flex;

    }
    
    #contents.food-rotation.blend .courseDetail .title{
        margin: 0px auto 20px;
        padding: 20px 0px 0px 0px;
        width: 80%;
    }
    
    
}




#contents.food-rotation .fListBox{
    margin: 0px auto 20px;
    max-width: 800px;
    
}

#contents.food-rotation .fListBox .fbox{
    margin: 0px 0px 40px 0px;
}

#contents.food-rotation .fListBox .fbox li{
    margin: 0px auto 30px;
    width: 96%;
}


#contents.food-rotation .fListBox .fbox li h3{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 28px;
    font-size: 20px;
    font-weight: bold;
    background: url(/resource/img/common/arrow_h3.png) no-repeat left center;
    background-size: 24px auto;
    color: #0f6022;
}


#contents.food-rotation .fListBox .fbox li p{
    margin: 0px auto;
    width: 80%;
}


#contents.food-rotation.food-rotation-f .courseDetail h3 img,
#contents.food-rotation.food-rotation-b .courseDetail h3 img,
#contents.food-rotation.food-rotation-h .courseDetail h3 img{
    margin-top: 0px;
}



#contents.food-rotation.food-rotation-f .courseDetail .link,
#contents.food-rotation.food-rotation-b .courseDetail .link,
#contents.food-rotation.food-rotation-h .courseDetail .link{
    margin: 0px auto 0px;
    text-align: center;
    background-color: #0f6022;
}

#contents.food-rotation.food-rotation-f .courseDetail .link img,
#contents.food-rotation.food-rotation-b .courseDetail .link img,
#contents.food-rotation.food-rotation-h .courseDetail .link img{
    margin: 0px auto 20px;
    max-width: 500px;
}


#contents.food-rotation.food-rotation-f .courseDetail .tab.t3 ul,
#contents.food-rotation.food-rotation-b .courseDetail .tab.t3 ul,
#contents.food-rotation.food-rotation-h .courseDetail .tab.t3 ul{
    margin: 0px auto;
    width: 90%;
    display:flex;    
}

@media (max-width: 767px){
    
    #contents.food-rotation.food-rotation-f .courseDetail .link img,
    #contents.food-rotation.food-rotation-b .courseDetail .link img,
    #contents.food-rotation.food-rotation-h .courseDetail .link img{
        margin: 0px auto 16px;
        width: 94%;
    }
    
    #contents.food-rotation.food-rotation-f .courseDetail .tab.t3 ul,
    #contents.food-rotation.food-rotation-b .courseDetail .tab.t3 ul,
    #contents.food-rotation.food-rotation-h .courseDetail .tab.t3 ul{
        width: 74%;
    }
    
    #contents.food-rotation .fListBox .fbox li p{
        margin: 0px auto;
        width: 100%;
    }
    
}

.f-benefit{
    margin: 0px auto;
    width: 100%;
}

.f-benefit .pic{
    margin: 0px auto 10px;
    width: 96%
}

.f-benefit .ld1{
    margin: 0px 0px 10px 0px;
    text-align:center;
    font-size: 22px;
    font-weight: bold;
}

.f-benefit .txt{
    margin: 0px 0px 10px 0px;
    text-align:center;
    font-size: 13px;
}


.itemListBtn{
    margin: 0px auto 30px;
    padding: 20px 0px 0px 0px;
    width: 70%;
}


@media (max-width: 767px){
    
    .f-benefit .ld1{
        font-size: 4.4vw;
    }

    .f-benefit .txt{
        font-size: 3.2vw;
    }
    
    .itemListBtn{
        margin: 0px auto 30px;
        padding: 20px 0px 0px 0px;
        width: 90%;
    }
    
    
}


/**/


.buyA.fbuyArea{
    
}

.buyA.fbuyArea .pic{
    margin: 0px 0px 20px 0px;
}

.buyA.fbuyArea .pr{
    margin: 0px 0px 4px 0px;
    font-size: 13px;
}

.buyA.fbuyArea .pr span{
    font-size: 20px;
    font-weight: bold;
}

.buyA.fbuyArea .at{
    margin: 0px 0px 4px 0px;
    font-size: 13px;
    
}

.buyA.fbuyArea .dmemo{
    margin: 0px 0px 0px 20px;
    padding: 0px 0px 20px 0px;
}

.buyA.fbuyArea .dmemo li{
    margin: 0px 0px 0px 0px;
    list-style: disc;
    font-size: 15px;
}



.buyA.fbuyArea .at span{
    font-weight: bold;
}


.buyA.fbuyArea .priceList{
    border-bottom: solid 1px #d2d2d2;
}

.buyA.fbuyArea .priceList .priceRow.r3 {
    border-bottom:none;
}


.buyA.fbuyArea .priceList.pLB{
    padding-top: 20px;
    border-top: dashed 3px #dddddd;
}


@media (max-width: 767px){
    
    .buyA.fbuyArea .pr{
        margin: 0px 0px 0px 0px;
        font-size: 3.4vw;
    }
    
    .buyA.fbuyArea .at{
        margin: 0px 0px 4px 0px;
        font-size: 3.6vw;
        
    }
    
    .buyA.fbuyArea .at span{
        font-weight: bold;
    }
    
    .buyA.fbuyArea .pr span{
        font-size: 4.5vw;
        font-weight: bold;
    }
    
    
}

#contents .fFirst{
    margin: 0px auto 20px;
    width: 96%;
}


#contents .fFirst h3{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 28px;
    font-size: 20px;
    font-weight: bold;
    background: url(/resource/img/common/arrow_h3.png) no-repeat left center;
    background-size: 24px auto;
    color: #0f6022;
}


#contents .fFirst .pic{
    margin: 0px 0px 20px 0px;
}


#contents .fFirst .txt{
    margin: 0px 0px 5px 0px;
    font-size: 12px;
}

@media (max-width: 767px){
     #contents .fFirst .txt{
        margin: 0px 0px 5px 0px;
        font-size: 4vw;
    }   
}

#contents .blend .buyArea .price{
    margin: 0px auto 20px;
    padding: 14px 10px 20px 10px;
    width: 90%;
    background-color: #ffffff;
}


#contents .blend .buyArea .price .p{
    margin: 0px 0px 0px 0px;
    text-align: center;
    font-size: 20px;
}

#contents .blend .buyArea .price .p span{
    text-align: center;
    font-size: 69px;
    font-weight: bold;
    
}

#contents .blend .buyArea .price .pu{
    margin: 10px auto 0px;
    width: 70%;
    
}

#contents .blend .buyArea .price .pu span{
    margin: 0px 5px 0px 0px;
    text-decoration: line-through;
}


#contents .blend .buyArea .price .rmemo{
    text-align:center;
    font-weight: bold;
    font-size: 20px;
}

#contents .blend .buyArea .price .rmemo span{
    color: #DA2C2F;
}





#contents .blend .buyArea .rm{
    margin: 0px 0px 10px 0px;
    text-align:center;
}

#contents .blend .buyArea .price .buy01{
    margin: 0px auto;
    width: 80%;
}

@media (max-width: 767px){
    
   #contents .blend .buyArea .price .p span{
        text-align: center;
        font-size: 12vw;
        font-weight: bold;
    } 
    
    
}



#bowlsClub{
    margin: 0px auto 30px;
    padding: 30px 0px 10px 0px;
    max-width: 800px;
    background-color: #ffffff;
    
    
    display:none;
    
}


#bowlsClub h2{
    margin: 0px auto 20px;
    max-width: 500px;
}

#bowlsClub h3{
    margin: 0px 0px 20px 0px;
    text-align: center;
    font-weight: bold;
}

#bowlsClub h3 span{
    margin: 0px 0px 0px 4px;
    color: #00a0e9;
}

#bowlsClub .review{
    margin: 0px 0px 0px 0px;
    padding: 24px 10px 24px 10px;
    background-color: #f0f0f0;
    border: solid 1px #ffffff;
}

#bowlsClub .review p{
    line-height: 1.5em;
}

#bowlsClub .review:nth-child(2n){
    margin: 0px 0px 0px 0px;
    padding: 24px 10px 24px 10px;
    background-color: #ffffff;
}

#bowlsClub .more{
    margin: 0px 0px 0px 0px;
    padding: 10px 10px 10px 10px;
    text-align: right;    
}


#bowlsClub .more a{
    padding: 4px 0px 4px 23px;
    background: url("../img/common/arrow-more.png") no-repeat left center;
    background-size: 20px auto;
}


@media (max-width: 767px){
    #bowlsClub{
        margin: 0px auto 30px;
        padding: 30px 0px 10px 0px;
        width: 90%;
        background-color: #ffffff;
    }
    
    
    #bowlsClub h2{
        margin: 0px auto 20px;
        width: 80%;
    }
    
    #bowlsClub h3{
        margin: 0px 0px 20px 0px;
        text-align: center;
        font-weight: bold;
    }
    
    #bowlsClub h3 span{
        margin: 0px 0px 0px 4px;
        color: #00a0e9;
    }
    
    #bowlsClub .review{
        margin: 0px 0px 0px 0px;
        padding: 24px 10px 24px 10px;
        background-color: #f0f0f0;
        border: solid 1px #ffffff;
    }
    
    #bowlsClub .review p{
        line-height: 1.5em;
    }
    
    #bowlsClub .review:nth-child(2n){
        margin: 0px 0px 0px 0px;
        padding: 24px 10px 24px 10px;
        background-color: #ffffff;
    }
    
    #bowlsClub .more{
        margin: 0px 0px 0px 0px;
        padding: 10px 10px 10px 10px;
        text-align: right;    
    }
    
    
    #bowlsClub .more a{
        padding: 4px 0px 4px 23px;
        background: url("../img/common/arrow-more.png") no-repeat left center;
        background-size: 20px auto;
    }
    
}



 #clubNews{
    margin: 0px 0px 50px 0px;
     
     
     display:none;
     
}

#clubNews h2{
    margin: 0px auto 20px;
    max-width: 400px;
}

#clubNews .newsBox{
    margin: 0px auto;
    max-width: 800px;
    background-color: #ffffff;
}

#clubNews .newsBox .news{
    margin: 0px 0px 0px 0px;
    padding: 14px 10px 10px 10px;
    display:flex;
    border-bottom: dotted 1px #666666;
}

#clubNews .newsBox .news .pic{
    margin: 0px auto;
    width: 28%;
}

#clubNews .newsBox .news .detail{
    margin: 0px auto;
    width: 68%;
}

#clubNews .newsBox .news .detail .date{
    margin: 0px 0px 10px 0px;
    font-size: 16px;
}

#clubNews .newsBox .news .detail .date span{
    margin: 0px 4px 0px 0px;
    padding: 4px 4px 4px 4px;
    background-color: #0f6022;
    color: #ffffff;
    font-size: 14px;
}


#clubNews .newsBox .news .detail h3{
    margin: 0px 0px 10px 0px;
    font-size: 18px;
    font-weight: bold;
    line-height: 1.3em;
}

#clubNews .newsBox .news .detail .txt{
    margin: 0px 0px 10px 0px;
    line-height: 1.3em;
    font-size: 14px;
}

#clubNews .more{
    margin: 0px 0px 0px 0px;
    padding: 10px 10px 10px 10px;
    text-align: right;    
}


#clubNews .more a{
    padding: 4px 0px 4px 23px;
    background: url("../img/common/arrow-more.png") no-repeat left center;
    background-size: 20px auto;
}


@media (max-width: 767px){
    
    #clubNews{
        margin: 0px 0px 50px 0px;
    }
    
    #clubNews h2{
        margin: 0px auto 20px;
        width: 60%;
    }
    
    #clubNews .newsBox{
        margin: 0px auto;
        width: 90%;
        background-color: #ffffff;
    }
    
    #clubNews .newsBox .news{
        margin: 0px 0px 0px 0px;
        padding: 14px 10px 10px 10px;
        display:flex;
        border-bottom: dotted 1px #666666;
    }
    
    #clubNews .newsBox .news .pic{
        margin: 0px auto;
        width: 28%;
    }
    
    #clubNews .newsBox .news .detail{
        margin: 0px auto;
        width: 68%;
    }
    
    #clubNews .newsBox .news .detail .date{
        margin: 0px 0px 10px 0px;
        font-size: 3.5vw;
    }
    
    #clubNews .newsBox .news .detail .date span{
        margin: 0px 4px 0px 0px;
        padding: 4px 4px 4px 4px;
        background-color: #0f6022;
        color: #ffffff;
        font-size: 3.2vw;
    }
    
    
    #clubNews .newsBox .news .detail h3{
        margin: 0px 0px 10px 0px;
        font-size: 4vw;
        font-weight: bold;
        line-height: 1.3em;
    }
    
    #clubNews .newsBox .news .detail .txt{
        margin: 0px 0px 10px 0px;
        line-height: 1.3em;
        font-size: 3.2vw;
    }
    
    #clubNews .more{
        margin: 0px 0px 0px 0px;
        padding: 10px 10px 10px 10px;
        text-align: right;    
    }
    
    
    #clubNews .more a{
        padding: 4px 0px 4px 23px;
        background: url("../img/common/arrow-more.png") no-repeat left center;
        background-size: 20px auto;
    }
    
}




/*.shopify-buy-frame{
    width:100%!important;
    max-width:100%!important;
}

.shopify-buy__btn{
    padding: 30px 60px 30px 60px!important;
}*/





#recommendBox{
    margin: 0px auto 50px;
    padding: 40px 30px 20px 30px;
    max-width: 700px;
    background-color: #ffffff;
}

#recommendBox h2{
    margin: 0px 10px 20px 10px;
    font-size: 20px;
    font-weight: bold;
    max-width: 700px!important;
}


#recommendBox .boxIn{
    margin: 0px auto;
    max-width: 700px;
}

#recommendBox .boxIn ul{
    display:flex;
}

#recommendBox .boxIn ul li{
    width: 25%;
}

@media (max-width: 767px){

    #recommendBox{
        margin: 0px 0px 20px 0px;
        padding: 20px 10px 20px 10px;
        background-color: #ffffff;
    }
    
    #recommendBox h2{
        margin: 0px 10px 20px 10px;        
        font-size: 4vw;
        font-weight: bold;
    }
    
    #recommendBox .boxIn{
        
    }
    
    #recommendBox .boxIn ul{
        display:flex;
    }
    
    #recommendBox .boxIn ul li{
        width: 25%;
    }
}



.deliveryBox{
    margin: 0px auto 50px;
    max-width: 900px;
    width: 96%;
} 

.deliveryBox p.pic{
    margin: 0px auto 20px;
    max-width: 800px;
}

.deliveryBox p.txt{
        margin: 0px 0px 20px 0px;
        font-size: 16px;
        line-height: 1.5em;

    }

.deliveryBox p.memo{
    font-size: 16px;
    line-height: 1.5em;

}


@media (max-width: 767px){
    .deliveryBox{
        margin: 0px auto 50px;
        width: 90%;
    } 
    
    .deliveryBox p.pic{
        margin: 0px 0px 20px 0px;
    }
    
    .deliveryBox p.txt{
        margin: 0px 0px 20px 0px;
        font-size: 3.6vw;
        line-height: 1.5em;

    }
    
    .deliveryBox p.memo{
        font-size: 3.2vw;
        line-height: 1.5em;

    }
}


.explanation01{
    margin: 0px 0px 0px 0px;
}

.explanation01 .eBox{
    margin: 0px auto;
    padding: 20px 10px 10px 10px;
    max-width: 900px;
    background-color: #ffffff;
}

.explanation01 .eBox dl{
    margin: 0px 0px 0px 0px;
}

.explanation01 .eBox dl dt{
    margin: 0px 0px 14px 0px;
    padding: 0px 0px 10px 10px;
    border-bottom: dotted 1px #505050;
    font-weight: bold;
    font-size: 20px;
}

.explanation01 .eBox dl dd{
    margin: 0px 0px 0px 0px;
    padding: 0px 10px 0px 10px;
    display:block;
}

.explanation01 .eBox dl dd ul{
    margin: 0px 0px 0px 0px;
}
.explanation01 .eBox dl dd ul li{
    margin: 0px 0px 10px 0px;
    font-size: 16px;
}

.explanation01 .eBox dl dd ul li span{
    margin: 0px 0px 0px 0px;
    font-weight: bold;
}






@media (max-width: 767px){
    .explanation01{
        margin: 0px 0px 0px 0px;
    }
    
    .explanation01 .eBox{
        margin: 0px auto;
        padding: 30px 10px 10px 10px;
        width: 96%;
        background-color: #ffffff;
    }
    
    .explanation01 .eBox dl{
        margin: 0px 0px 0px 0px;
    }
    
    .explanation01 .eBox dl dt{
        margin: 0px 0px 14px 0px;
        padding: 0px 0px 10px 0px;
        border-bottom: dotted 1px #505050;
    }
    
    .explanation01 .eBox dl dd{
        margin: 0px 0px 0px 0px;
        display:block;
    }
    
    .explanation01 .eBox dl dd ul{
        margin: 0px 0px 0px 0px;
    }
    .explanation01 .eBox dl dd ul li{
        margin: 0px 0px 10px 0px;
        font-size: 3.2vw;
        line-height: 1.3em;
    }
    
    .explanation01 .eBox dl dd ul li span{
        margin: 0px 0px 0px 0px;
        font-weight: bold;
    }
}



.explanation02{
    margin: 0px 0px 30px 0px;
}

.explanation02 .eBox{
    margin: 0px auto;
    padding: 10px 10px 10px 10px;
    max-width: 900px;
    background-color: #ffffff;
}

.explanation02 .eBox dl{
    margin: 0px 0px 0px 0px;
}

.explanation02 .eBox dl dt{
    margin: 0px 0px 14px 0px;
    padding: 0px 0px 10px 10px;
    border-bottom: dotted 1px #505050;
    font-weight: bold;
    font-size: 20px;
}

.explanation02 .eBox dl dd{
    margin: 0px 0px 0px 0px;
    padding: 0px 10px 0px 10px;
    display:block;
}

.explanation02 .eBox dl dd ul{
    margin: 0px 0px 0px 0px;
    display:flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 1%;
    
}
.explanation02 .eBox dl dd ul li{
    margin: 0px 0px 20px 0px;
    width: 32%;
}




.explanation02 .eBox dl dd ul li .pic{
    margin: 0px auto 14px;
    width: 90%;
}

.explanation02 .eBox dl dd ul li .name{
    margin: 0px 0px 14px 0px;
    text-align: center;
    font-weight: bold;
    font-size: 16px;
}

.explanation02 .eBox dl dd ul li .txt{
    margin: 0px auto;
    padding: 10px 10px 10px 10px;
    width: 90%;
    background-color:#efefef;
    min-height: 300px;
    line-height: 1.4em;
    font-size: 14px;
}

@media (max-width: 767px){
    .explanation02{
        margin: 0px 0px 30px 0px;
    }
    
    .explanation02 .eBox{
        margin: 0px auto;
        padding: 0 0 0 0;
        width: 96%;
        background-color: #ffffff;
    }
    
    .explanation02 .eBox dl{
        margin: 0px 0px 0px 0px;
    }
    
    .explanation02 .eBox dl dt{
        margin: 0px 10px 14px 10px;
        padding: 0px 10px 10px 10px;
        border-bottom: dotted 1px #505050;
    }
    
    .explanation02 .eBox dl dd{
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        display:block;
    }
    
    .explanation02 .eBox dl dd ul{
        margin: 0px 0px 0px 0px;
        display:flex;
        flex-wrap: wrap;
    }
    .explanation02 .eBox dl dd ul li{
        margin: 0px 0px 20px 0px;
        width: 48%;
    }
    
    
    
    .explanation02 .eBox dl dd ul li .pic{
        margin: 0px auto 14px;
        width: 98%;
    }
    
    .explanation02 .eBox dl dd ul li .name{
        margin: 0px 0px 14px 0px;
        text-align: center;
        font-weight: bold;
        font-size: 3vw;
    }
    
    .explanation02 .eBox dl dd ul li .txt{
        margin: 0px auto;
        padding: 10px 10px 10px 10px;
        width: 98%;
        background-color:#efefef;
        min-height: 120px;
        line-height: 1.4em;
        font-size: 3.3vw;
        font-weight: bold;
    }
    
    .explanation02 .eBox dl dd ul li .txt span{
        margin: 0px 0px 3px 0px;
        font-weight: normal;
        font-size: 3vw;
        display:block;
    }
    
    
    
    
}

.explanation03{
    margin: 0px 0px 50px 0px;
}

.explanation03 .eBox{
    margin: 0px auto;
    padding: 10px 10px 10px 10px;
    max-width: 900px;
    background-color: #ffffff;
}

.explanation03 .eBox dl{
    margin: 0px 0px 0px 0px;
}

.explanation03 .eBox dl dt{
    margin: 0px 0px 14px 0px;
    padding: 0px 0px 10px 10px;
    border-bottom: dotted 1px #505050;
    font-weight: bold;
    font-size: 20px;
}

.explanation03 .eBox dl dd{
    margin: 0px 0px 0px 0px;
    padding: 0px 10px 0px 10px;
    display:block;
}


.explanation03 .eBox dl dd .faq{
    margin: 0px 0px 30px 0px;
}

.explanation03 .eBox dl dd .faq p.title{
    margin: 0px 0px 10px 0px;
    font-size: 20px;
    font-weight: bold;
}

.explanation03 .eBox dl dd .faq p.ans{
    font-size: 14px;
}


@media (max-width: 767px){
    .explanation03{
        margin: 0px 0px 50px 0px;
    }
    
    .explanation03 .eBox{
        margin: 0px auto;
        padding: 10px 10px 10px 10px;
        width: 96%;
        background-color: #ffffff;
    }
    
    .explanation03 .eBox dl{
        margin: 0px 0px 0px 0px;
    }
    
    .explanation03 .eBox dl dt{
        margin: 0px 0px 14px 0px;
        padding: 0px 0px 10px 0px;
        border-bottom: dotted 1px #505050;
    }
    
    .explanation03 .eBox dl dd{
        margin: 0px 0px 0px 0px;
        display:block;
    }
}


.explanation{
    
}

/* 矢印 */
.explanation dt {
  position: relative;
}
.explanation dt::after {
  border-right: solid 2px #505050;
  border-top: solid 2px #505050;
  content: "";
  display: block;
  height: 8px;
  position: absolute;
  right: 25px;
  top: 8%;
  transform: rotate(135deg);
  transition: transform .3s ease-in-out, top .3s ease-in-out;
  width: 8px;
}
.explanation dt.open::after {
  top: 45%;
  transform: rotate(-45deg);
}





/* 素材　*/


#contents.raw-materials{
    margin: 0px auto 0px;
    padding: 0px 0px 0px 0px;
    max-width: 900px;
}


#contents.raw-materials h2{
    max-width: 240px;

}



#contents .titBox{
    margin: 0px auto 10px;
    padding: 30px 0px 10px 0px;
    width: 98%;
    border-bottom: solid 2px #cf0f1e;
    background:
    url("/resource/img/common/arrow_tit.png") no-repeat center 8px,
    linear-gradient(to bottom, transparent 0px, transparent 20px, #f0f0ec 10px, #f0f0ec 100%);
    background-size: 38px auto;
}

#contents .titBox p{
    margin: 0px 0px 6px 0px;
    text-align:center;
}

#contents .titBox h1{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    color: #be1724;
    font-weight: bold;
    text-align:center;
    font-size: 30px;
    display:flex;
    justify-content: center;
    align-items: center;
}

#contents .titBox h1 span{
    margin-right: 6px;
    padding: 4px 4px 4px 4px;
    color: #ffffff;
    font-weight: normal;
    font-size: 14px;
    

}





#contents.raw-materials .titBox h1 span.protein{
    background-color: #db77ac;

}

#contents.raw-materials .titBox h1 span.vegetable{
    background-color: #39b576;

}

#contents.raw-materials .titBox h1 span.carbohydrate{
    background-color: #a0835c;

}

#contents.raw-materials .titBox h1 span.source{
    background-color: #7ea0bc;

}

#contents.raw-materials .titBox .cal{
    text-align: center;
    line-height: 1.4em;

}



#contents.raw-materials .pic{
    margin: 0px auto 20px;
    max-width: 800px;

}


#contents.raw-materials .rbox{
    margin: 0px 0px 10px 0px;
    display:block;
}

#contents.raw-materials .rd{
    
}

#contents.raw-materials .rd ul{
    margin: 0px 0px 20px 20px;
}

#contents.raw-materials .rd ul li{
    margin: 0px 0px 6px 0px;
    text-indent: -13px;
    font-size: 13px;
    line-height: 1.5em;
    color: #C83032;
}

#contents.raw-materials .rd ul li:before{
    
    content: "※";
}



#contents.raw-materials .sweettxt{
    width: 44%;
    position: absolute;
    right: 0px;
    top: 54%;
    line-height: 1.4em;
}



#contents.raw-materials h3{
    margin: 0px 0px 20px 0px;
    padding: 0px 0px 10px 0px;
    text-align: center;
    
    font-weight: bold;
    font-size: 18px;
    color: #0f6022;

}

#contents.raw-materials h3 span{
    margin: 0px 6px 0px 0px;
    padding: 4px 4px 4px 4px;
    color: #ffffff;
    font-weight: normal;
    font-size: 16px;
}

#contents.raw-materials h3 span.protein{
    background-color: #db77ac;
}

#contents.raw-materials .rmBox{
    margin: 0px 0px 20px 0px;
    display:flex;
}

#contents.raw-materials .rmBox .pic{
    margin: 0px auto;
    width: 35%;
}

#contents.raw-materials .rmBox .txt{
    margin: 0px auto;
    width: 60%;
}

#contents.raw-materials .rmBox .txt .t1{
    margin: 0px 0px 20px 0px;
    line-height: 1.5em;
}

#contents.raw-materials .rmBox .txt .t2{
    padding: 10px 10px 10px 10px;
    background-color: #ffffff;
    line-height: 1.5em;
    font-size: 3.4vw;
}


#contents.raw-materials .priceBox{
    margin: 0px auto 10px;
    padding: 0px 0px 20px 0px;
    width: 98%;
    
}

#contents.raw-materials .priceBox dl{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 10px 0px;
    display:flex;
    justify-content: center;
    align-items: center;
    border-bottom: solid 1px #969696;
}

#contents.raw-materials .priceBox dl:last-child{
    margin-bottom: 0px;
    padding: 0px 0px 0px 0px;
    border-bottom: none;
}

#contents.raw-materials .priceBox dl dt{
    padding: 4px 0px 0px 0px;
    width: 40%;
    text-align: left;
    font-size: 15px;
    font-weight: bold;
    line-height: 1.5em;
}


#contents.raw-materials .priceBox dl dt span{
    font-size: 40px;
}

#contents.raw-materials .priceBox dl dd{
    padding: 0px 0px 0px 0px;
    width: 40%;
    text-align: center;
}

#contents.raw-materials .priceBox dl dd .buttonbuy a{
    padding: 8px 0px 8px 0px;
    color: #ffffff;
    background-color: #be1724;
    text-decoration: none;
    border-radius: 10px;
    display:block;
}

#contents.raw-materials .priceBox dl#price500 dd .buttonbuy a{
    background-color: #0f6022;
}


#contents.raw-materials .nutrientsBox{
    margin: 0px auto 50px;
    padding: 0px 0px 0px 0px;
    width: 98%;
}

#contents.raw-materials .nutrientsBox .boxIn{
    margin: 0px 0px 60px 0px;
}

#contents.raw-materials .nutrientsBox .boxIn:last-child{
    margin: 0px 0px 0px 0px;
}

#contents.raw-materials .nutrientsBox .boxIn .txt{
    margin: 0px 0px 10px 0px;
    text-align: center;
}

#contents.raw-materials .nutrientsBox .boxIn .txt span{
    font-weight: bold;
}

#contents.raw-materials .nutrientsBox .boxIn .pic{
    margin: 0px auto;
}

#contents.raw-materials .nutrientsBox .boxIn.nutrient{
    
}

#contents.raw-materials .nutrientsBox .boxIn.nutrient dl{
    
}

#contents.raw-materials .nutrientsBox .boxIn.nutrient dl dt{
    
}

#contents.raw-materials .nutrientsBox .boxIn.nutrient dl dd{
    
}

#contents.raw-materials .nutrientsBox .boxIn.nutrient dl dd p{
    margin: 0px auto;
    max-width: 500px;
    text-align: left;
}

#contents.raw-materials .nutrientsBox .boxIn.disease{
    
}

#contents.raw-materials .nutrientsBox .boxIn.disease .txtBox{
    
}

#contents.raw-materials .nutrientsBox .boxIn.disease .txtBox p{
    text-align: center;
}


#contents.raw-materials .nutrientsBox h2{
    margin: 0px auto 20px;
    padding: 0px 0px 10px 0px;
    border-bottom: dotted 1px #4d4d4d; 
    max-width: 500px;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
}

#contents.raw-materials .nutrientsBox .nBox{
    display:block;
}

#contents.raw-materials .nutrientsBox .nBox .nb{
    
}

#contents.raw-materials .nutrientsBox .nBox .nb .tit{
    margin: 0px 0px 80px 0px;
}

#contents.raw-materials .nutrientsBox .nBox .nb .boxin{
    margin: 0px auto;
    max-width: 500px;
    display:flex;
}

#contents.raw-materials .nutrientsBox .nBox .nb .boxin .pic{
    margin: -10px auto 10px;
    width: 44%;    
}

#contents.raw-materials .nutrientsBox .nBox .nb .boxin .txt{
    margin: 0px 0px 0px 0px;
    padding: 0px 2px 20px 2px;
    width: 50%;
    text-align: left;
}

#contents.raw-materials .nutrientsBox .nBox .nb.source .boxin .txt{
    
    width: 100%;
    
}

#contents.raw-materials .nutrientsBox .nBox .nb .boxin .txt p{
    margin: 0px 0px 10px 0px;
    line-height: 1.4em;
    font-size: 18px;
}


#contents.raw-materials .nutrientsBox .boxIn .faqBox{
    margin: 0px auto;
    max-width: 600px;
}

#contents.raw-materials .nutrientsBox .boxIn .faqBox dl{
    margin: 0px 0px 30px 0px;
}

#contents.raw-materials .nutrientsBox .boxIn .faqBox dl dt{
    margin: 0px 0px 0px 0px;
    padding: 10px 0px 20px 0px;
    border-bottom: dotted 1px #afafaf;
}


#contents.raw-materials .nutrientsBox .boxIn .faqBox dl:nth-child(1) dt:before{
    margin: 0px 4px 0px 0px;
    padding: 10px;
    content:"Q1";
    background-color: #0f6022;
    border-radius: 20px;
    color: #ffffff;
    
}

#contents.raw-materials .nutrientsBox .boxIn .faqBox dl:nth-child(2) dt:before{
    margin: 0px 4px 0px 0px;
    padding: 10px;
    content:"Q2";
    background-color: #0f6022;
    border-radius: 20px;
    color: #ffffff;
}

#contents.raw-materials .nutrientsBox .boxIn .faqBox dl:nth-child(3) dt:before{
    margin: 0px 4px 0px 0px;
    padding: 10px;
    content:"Q3";
    background-color: #0f6022;
    border-radius: 20px;
    color: #ffffff;
}





#contents.raw-materials .nutrientsBox .boxIn .faqBox dl dd{
    margin: 0px 0px 0px 0px;
    padding: 10px 0px 0px 0px;
    display:none;
}





#contents.raw-materials .recipe{
    margin: 0px auto 30px;
}

#contents.raw-materials .recipe h3{
    margin: 0px auto 20px;
}

#contents.raw-materials .recipe ul{
    margin: 0px auto;
    max-width: 800px;
    display:flex;
    flex-wrap: wrap;
}

#contents.raw-materials .recipe ul li{
    margin: 0px 1% 20px 1%;
    padding: 20px 4px 5px 4px;
    width: 31%;
    background-color: #fafafa;
    border: solid 1px #e5e5e5;
}

#contents.raw-materials .recipe ul li p.pic{

}

#contents.raw-materials .recipe ul li p.name{
    margin: 0px 0px 12px 0px;
    font-size: 16px;
    text-align: center;
}

#contents.raw-materials .recipe ul li p.detail{
    margin: 0px 0px 12px 0px;
    font-size: 16px;
    text-align: center;
}

#contents.raw-materials .recipe ul li p.link{
    margin: 0px auto;
    width: 90%;
    font-size: 16px;
    text-align: center;
    border-top: dotted 1px #191919;
}

#contents.raw-materials .recipe ul li p.link a{
    padding: 8px 4px 8px 4px;
    display:block;
    text-decoration: none;
    color: #1a1a1a;
}




/**/





#contents.food-rotation .aboutFrc{
    margin: 0px auto;
    width: 96%;
}

#contents.food-rotation .aboutFrc h2{
    margin: 0px 0px 12px 0px;
    padding: 0px 0px 0px 0px;
    text-align: center;
    font-size: 24px;
    font-weight:  bold;
        
}


#contents.food-rotation .aboutFrc .picfrc{
    margin: 0px auto 20px;
    width: 50%;
}

@media (max-width: 767px){
    
    #contents.food-rotation .aboutFrc{
        width: 100%;
    }
    
      #contents.food-rotation .aboutFrc h2{
        font-size: 4.3vw;
    }  
    
    #contents.food-rotation .aboutFrc .picfrc{
        width: 60%;
    }

    
    
}




#contents.food-rotation .f-rmBox{
    margin: 0px auto;
    width: 98%;
}


#contents.food-rotation .f-rmBox h3 {
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 28px;
    font-size: 20px;
    font-weight: bold;
    background: url(/resource/img/common/arrow_h3.png) no-repeat left center;
    background-size: 24px auto;
    color: #0f6022;
}

#contents.food-rotation .f-rmBox ul{
    
}

#contents.food-rotation .f-rmBox ul li{
    margin: 0px 0px 14px 0px;
    display:flex;
}

#contents.food-rotation .f-rmBox ul li .pic{
    margin: 0px 1% 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 39%;
}

#contents.food-rotation .f-rmBox ul li .bR{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 60%;
}

#contents.food-rotation .f-rmBox ul li .bR h4{
    margin: 0px 0px 4px 0px;
    padding: 4px 4px 4px 4px;
    background-color: #d2d2d2;
    color: #1a1a1a;
    font-size: 14px;
    font-weight: bold;
}

#contents.food-rotation .f-rmBox ul li .bR p{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-size: 14px;
    line-height: 1.5em;
}



#contents.food-rotation .f-rmBox.nutrients ul li{
    margin: 0px 0px 14px 0px;
    display:block;
}

#contents.food-rotation .f-rmBox.nutrients ul li .name{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-size: 16px;
    font-weight: bold;
}

#contents.food-rotation .f-rmBox.nutrients ul li .rmn{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    display:flex;
}

#contents.food-rotation .f-rmBox.nutrients ul li .rmn .pic{
    margin: 0px 1% 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 39%;
    background-color: #efefef;
}

#contents.food-rotation .f-rmBox.nutrients ul li .rmn .rmnR{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 60%;
}

#contents.food-rotation .f-rmBox.nutrients ul li .rmn .rmnR .txt{
    font-size: 14px;
}


@media (max-width: 767px){
    #contents.food-rotation .f-rmBox ul li .bR h4{        
        font-size: 4vw;
    }

    #contents.food-rotation .f-rmBox ul li .bR p{
        font-size: 3.2vw;
        line-height: 1.5em;
    }
    
    #contents.food-rotation .f-rmBox.nutrients ul li .rmn .rmnR .txt{
        font-size: 3.2vw;
    }
}


/**/



#contents.food-rotation.list{
    
}

#contents.food-rotation.list .titBox{
        
}

#contents.food-rotation.list .titBox p{
    margin: 0px 0px 2px 0px;
    padding: 4px 0px 0px 0px;
}

#contents.food-rotation.list .titBox p span{
    margin: 0px 2px 0px 2px;
    padding: 2px 2px 2px 2px;
    color: #ffffff;
    font-size: 13px;
}

#contents.food-rotation.list .titBox p span.l1{
    background-color: #006835;
}

#contents.food-rotation.list .titBox p span.l2{
    background-color: #eb6100;
}

#contents.food-rotation.list .titBox p span.l3{
    background-color: #e60012;
}

#contents.food-rotation.list .lead p.pic{
    max-width: 100%;
}





#contents.raw-materials .rd.amani{
    
}

#contents.raw-materials .rd.amani dl{
    margin: 0px 0px 40px 0px;
    padding: 20px 10px 20px 10px;
    background-color: #ffffff;
}

#contents.raw-materials .rd.amani dl dt{
    margin: 0px 0px 10px 0px;
    font-size: 20px;
    font-weight: bold;
    text-align: left;
}

#contents.raw-materials .rd.amani dl dd{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    text-align:center;
    font-size: 18px;
}

#contents.raw-materials .rd.amani dl dl{
    margin: 0px 0px 16px 0px;
    padding: 0px 0px 16px 0px;
    background-color: transparent;
            border-bottom: solid 1px #969696;
}

#contents.raw-materials .rd.amani dl dl dd a{
    font-size: 16px;
}


@media (max-width: 767px){
    
    #contents.raw-materials{
        margin: 0px auto 0px;
        padding: 0px 0px 0px 0px;
        width: 98%;
    }
    
    
    #contents.raw-materials h2{
        margin: 0px auto 40px;
        padding: 0px 0px 0px 0px;
        width: 80%;
        text-align: center;
        
    }
    
    #contents .titBox{
        margin: 0px 0px 12px 0px;
        padding: 30px 0px 6px 0px;
        width: 100%;
        background:
    url("/resource/img/common/arrow_tit.png") no-repeat center 15px,
    linear-gradient(to bottom, transparent 0px, transparent 20px, #f0f0ec 10px, #f0f0ec 100%);
    background-size: 20px auto;
        
    }
    
    #contents .titBox h1{
        margin: 0px 0px 0px 0px;
        color: #be1724;
        font-weight: bold;
        text-align:center;
        font-size: 5vw;
        
    }
    
    #contents .titBox h1 span{
        margin-right: 6px;
        padding: 4px 4px 4px 4px;
        color: #ffffff;
        font-weight: normal;
        font-size: 4vw;
        
    }
    
    #contents.raw-materials .titBox{
        padding-bottom:10px;
    }
    
    #contents.raw-materials .titBox h1 span.protein{
        background-color: #db77ac;
        
    }
    
    #contents.raw-materials .titBox .cal{
        text-align: center;
        
    }
    
    
    
    #contents.raw-materials .pic{
        margin: 0px auto 20px;
        width: 98%;
        
    }
    
    
    #contents.raw-materials .rbox{
        margin: 0px 0px 0px 0px;
        display:block;
    }
    
    #contents.raw-materials .rd{
        width: 100%;
        position: static;
        left:auto;
        top:auto;
    }
    
    #contents.raw-materials .sweettxt{
        margin: 0px auto 30px;
        width: 90%;
        position: static;
        left:auto;
        top:auto;
        font-size: 3.5vw;
    }
    
    
    #contents.raw-materials h3{
        margin: 0px 0px 20px 0px;
        padding: 0px 0px 10px 0px;
        text-align: center;
        font-weight: bold;
        font-size: 4vw;
        
    }
    
    #contents.raw-materials h3 span{
        margin: 0px 6px 0px 0px;
        padding: 4px 4px 4px 4px;
        color: #ffffff;
        font-weight: normal;
        font-size: 3vw;
    }
    
    #contents.raw-materials h3 span.protein{
        background-color: #db77ac;
    }
    
    #contents.raw-materials .rmBox{
        margin: 0px 0px 20px 0px;
        display:flex;
    }
    
    #contents.raw-materials .rmBox .pic{
        margin: 0px auto;
        width: 35%;
    }
    
    #contents.raw-materials .rmBox .txt{
        margin: 0px auto;
        width: 60%;
    }
    
    #contents.raw-materials .rmBox .txt .t1{
        margin: 0px 0px 20px 0px;
        line-height: 1.5em;
    }
    
    #contents.raw-materials .rmBox .txt .t2{
        padding: 10px 10px 10px 10px;
        background-color: #ffffff;
        line-height: 1.5em;
        font-size: 3.4vw;
    }
    
    
    #contents.raw-materials .priceBox{
        margin: 0px auto 10px;
        padding: 0px 0px 20px 0px;
        width: 98%;
        
    }
    
     .other #contents.raw-materials .priceBox{
        margin: 0px auto 20px;
        padding: 0px 0px 20px 0px;
        width: 100%;
        
        background-color:#ffffff;
    }
    
    #contents.raw-materials .priceBox dl{
        margin: 0px 0px 16px 0px;
        padding: 0px 0px 16px 0px;
        display:flex;
        border-bottom: solid 1px #969696;
    }
    
    #contents.raw-materials .priceBox dl:last-child{
        margin-bottom: 0px;
        padding: 0px 0px 0px 0px;
        border-bottom: none;
    }
    
    #contents.raw-materials .priceBox dl dt{
        width: 43%;
        text-align: left;
        font-size: 4vw;
        font-weight: bold;
    }
    
    
    #contents.raw-materials .priceBox dl dt span{
        font-size: 7vw;
    }
    
    #contents.raw-materials .priceBox dl dd{
        width: 55%;
        text-align: center;
    }
    
    
     .other #contents.raw-materials .priceBox dl dt{
        width: 55%;
        text-align: left;
        font-size: 4vw;
        font-weight: bold;
    }
    
    .other #contents.raw-materials .priceBox dl dd{
        width: 45%;
        text-align: center;
    }
    
    
    #contents.raw-materials .nutrientsBox{
        margin: 0px auto 50px;
        padding: 0px 0px 0px 0px;
        width: 98%;
    }
    
    
    #contents.raw-materials .nutrientsBox .boxIn{
        margin: 0px 0px 30px 0px;
    }

    #contents.raw-materials .nutrientsBox .boxIn:last-child{
        margin: 0px 0px 0px 0px;
    }

    #contents.raw-materials .nutrientsBox .boxIn .txt{
        margin: 0px 0px 20px 0px;
        text-align: center;
    }
    
    
    
    #contents.raw-materials .nutrientsBox .boxIn .txt span{
        font-weight: bold;
    }

    #contents.raw-materials .nutrientsBox .boxIn .pic{
        margin: 0px auto;
        width: 90%;
    }
    
    #contents.raw-materials .nutrientsBox .boxIn.nutrient .txtBox{
        width: 100%;
    }
    
    #contents.raw-materials .nutrientsBox .boxIn.nutrient dl dd p{
        text-align: left;
    }
    
    #contents.raw-materials .nutrientsBox .boxIn.disease .txtBox p{
        text-align: left;
    }
    
    
    #contents.raw-materials .nutrientsBox h2{
        margin: 0px 0px 20px 0px;
        padding: 0px 0px 10px 0px;
        border-bottom: dotted 1px #4d4d4d; 
        width: 100%;
        text-align: center;
        font-weight: bold;
    }
    
    #contents.raw-materials .nutrientsBox .nBox{
        display:flex;
    }
    
    #contents.raw-materials .nutrientsBox.source .nBox{
        display:block;
    }
    
    #contents.raw-materials .nutrientsBox .nBox .nb{
        
        
    }
    
    #contents.raw-materials .nutrientsBox .nBox .nb .tit{
        margin: 0px 0px 30px 0px;
    }
    
    #contents.raw-materials .nutrientsBox .nBox .nb .boxin{
            display:flex
    }
    
    #contents.raw-materials .nutrientsBox .nBox .nb .boxin .pic{
        margin: -17px auto 10px;
        width: 40%;    
    }
    
    #contents.raw-materials .nutrientsBox .nBox .nb .boxin .txt{
        margin: 0px 0px 0px 0px;
        padding: 0px 2px 20px 2px;
        width: 60%;
    }
    
    #contents.raw-materials .nutrientsBox .nBox .nb .boxin .txt p{
        margin: 0px 0px 10px 0px;
        line-height: 1.4em;
        font-size: 3.6vw;
        text-align:left;
    }
    
    #contents.raw-materials .nutrientsBox .boxIn .faqBox{
        margin: 0px auto;
        width: 98%;
    }

    #contents.raw-materials .nutrientsBox .boxIn .faqBox dl{
        margin: 0px 0px 30px 0px;
    }

    #contents.raw-materials .nutrientsBox .boxIn .faqBox dl dt{
        margin: 0px 0px 0px 0px;
        padding: 10px 0px 20px 0px;
        border-bottom: dotted 1px #afafaf;
        font-size: 3.4vw;
    }


    #contents.raw-materials .nutrientsBox .boxIn .faqBox dl:nth-child(1) dt:before{
        margin: 0px 4px 0px 0px;
        padding: 10px;
        content:"Q1";
        background-color: #0f6022;
        border-radius: 20px;
        color: #ffffff;

    }

    #contents.raw-materials .nutrientsBox .boxIn .faqBox dl:nth-child(2) dt:before{
        margin: 0px 4px 0px 0px;
        padding: 10px;
        content:"Q2";
        background-color: #0f6022;
        border-radius: 20px;
        color: #ffffff;
    }

    #contents.raw-materials .nutrientsBox .boxIn .faqBox dl:nth-child(3) dt:before{
        margin: 0px 4px 0px 0px;
        padding: 10px;
        content:"Q3";
        background-color: #0f6022;
        border-radius: 20px;
        color: #ffffff;
    }





    #contents.raw-materials .nutrientsBox .boxIn .faqBox dl dd{
        margin: 0px 0px 0px 0px;
        padding: 10px 0px 0px 0px;
        display:none;
        font-size: 3.5vw;
    }
    
    
    
    
    
    
    #contents.raw-materials .recipe{
        margin: 0px auto;
    }
    
    #contents.raw-materials .recipe h3{
        margin: 0px auto 20px;
    }
    
    #contents.raw-materials .recipe ul{
        margin: 0px auto;
        width: 98%;
        display:flex;
        flex-wrap: wrap;
    }
    
    #contents.raw-materials .recipe ul li{
        margin: 0px auto 20px;
        padding: 20px 4px 5px 4px;
        width: 48%;
        background-color: #fafafa;
        border: solid 1px #e5e5e5;
    }
    
    #contents.raw-materials .recipe ul li p.pic{
        
    }
    
    #contents.raw-materials .recipe ul li p.name{
        margin: 0px 0px 6px 0px;
        font-size: 3.5vw;
        text-align: center;
    }
    
    #contents.raw-materials .recipe ul li p.detail{
        margin: 0px 0px 10px 0px;
        font-size: 3.2vw;
        text-align: center;
    }
    
    #contents.raw-materials .recipe ul li p.link{
        margin: 0px auto;
        
        width: 90%;
        
        font-size: 3.2vw;
        text-align: center;
    }
    
    #contents.raw-materials .recipe ul li p.link a{
        padding: 8px 4px 8px 4px;
        display:block;
        text-decoration: none;
        color: #1a1a1a;
    }
    
    
    
    
    
    #contents.raw-materials .rd.amani dl{
        margin: 0px auto;
        padding: 0px 10px 0px 10px;
        width: 100%;
    }
    
    #contents.raw-materials .rd.amani dl dt{
        font-size: 4vw;
    }
    
    #contents.raw-materials .rd.amani dl dd{
        font-size: 5vw;
    }

    #contents.raw-materials .rd.amani p{
        text-align: left;
        font-size: 4vw;
    }    
}


/* rank wear */

#contents.raw-materials .rankBox{
    margin: 0px 0px 0px 0px;
    padding: 20px 10px 16px 10px;
    border: solid 1px #ec6941;
    background-color: #ffffff;
}


#contents.raw-materials .rankBox h2.rank{
    margin: 0px 0px 15px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    text-align: center;
    max-width:100%;
    font-weight: bold;
    color: #ec6941;
    
}

#contents.raw-materials .rankBox h2.rank span{
    margin: 0px 5px 0px 0px;
    padding: 10px 20px 10px 20px;
    border:solid 1px #ec6941;
    border-radius: 20px;
    background-color: #ffffff;
}

#contents.raw-materials .rankBox h2.rank em{
    color: #ec6941;
    font-style:normal;
    letter-spacing: 3px;
}

#contents.raw-materials .rankBox p{
    margin: 0px 0px 14px 0px;
    line-height: 1.6em;
    font-size: 14px;
}

#contents.raw-materials .rankBox p span{
    font-weight: bold;
    
}

#contents.raw-materials .rankBox p.link{
    margin: 0px 0px 0px 0px;
    text-align: center;
}

#contents.raw-materials .rankBox p.link a{
    margin: 0px auto;
    padding: 14px 14px 14px 14px;
    background-color: #ec6941;
    border-radius: 24px;
    color: #ffffff;
    width: 80%;
    text-align: center;
    text-decoration:none;
    font-weight: bold;
    display:block;
}



@media (max-width: 767px){
    #contents.raw-materials .rankBox{
        margin: 0px auto 20px;
        width: 96%;
    }    
}





/* other */
#contents.raw-materials .nutrientsBox.other{
    
}

#contents.raw-materials .nutrientsBox.other .s-rm dl{
    margin: 0px auto 20px;
    max-width: 500px;
}

#contents.raw-materials .nutrientsBox.other .s-rm dl dt{
    margin: 0px 0px 10px 0px;
    font-weight: bold;
}

#contents.raw-materials .nutrientsBox.other .s-rm dl dd{
    
}

#contents.raw-materials .nutrientsBox.other .s-rm dl dd ul{
    
}

#contents.raw-materials .nutrientsBox.other .s-rm dl dd ul li{
    margin: 0px 0px 10px 0px;
    line-height: 1.3em;
}


#contents.raw-materials .nutrientsBox.other .movieBox{
    margin: 0px auto 40px;
    max-width: 550px;
}

#contents.raw-materials .nutrientsBox.other .movieBox video{
    width:100%;
}


@media (max-width: 767px){
    
    #contents.raw-materials .nutrientsBox.other{

    }

    #contents.raw-materials .nutrientsBox.other .s-rm dl{
        margin: 0px auto;
        width: 94%;
    }
    
    #contents.raw-materials .nutrientsBox.other .movieBox{
        margin: 0px auto 20px;
        width: 100%;
    }
    
    
}



#contents.raw-materials .nutrientsBox.other .nBox.spice{
    margin: 0px auto;
    max-width: 550px;
}

#contents.raw-materials .nutrientsBox.other .nBox.spice h3{
    margin: 0px auto 10px;
    max-width: 500px;
    border-bottom: none;
}

#contents.raw-materials .nutrientsBox.other .nBox.spice .txtBox{
    margin: 0px auto 20px;
    max-width: 550px;
}

#contents.raw-materials .nutrientsBox.other .nBox.spice .pic{
    margin: 0px auto 20px;
    max-width: 400px;
}

#contents.raw-materials .nutrientsBox.other .nBox.spice .pic2{
    margin: 0px auto 20px;
    max-width: 600px;
}

#contents.raw-materials .nutrientsBox.other .nBox.spice h4{
    margin: 0px auto 20px;
    padding: 10px 0px 10px 0px;
    border: solid 1px #acacac;
    background-color: #ffffff;
    border-radius: 26px;
    text-align: center;
    font-weight: bold;
    
}

#contents.raw-materials .nutrientsBox.other .nBox.spice dl{
    margin: 0px 0px 40px 0px;
}

#contents.raw-materials .nutrientsBox.other .nBox.spice dl dt{
    margin: 0px 0px 10px 0px;
    text-align: center;
    font-weight: bold;
}


#contents.raw-materials .nutrientsBox.other .amaniBody{
    
}

#contents.raw-materials .nutrientsBox.other .amaniBody{
    
}

#contents.raw-materials .nutrientsBox.other .amaniBody dl{
    margin: 0px  0px 40px 0px;
}

#contents.raw-materials .nutrientsBox.other .amaniBody dl dt{
    margin: 0px 0px 10px 0px;
    font-size: 18px;
    font-weight: bold;
}

#contents.raw-materials .nutrientsBox.other .amaniBody dl dd{
    font-size: 15px;
}

#contents.raw-materials .nutrientsBox.other .amaniBody dl dd ul{
    margin: 0px 0px 0px 20px;
}

#contents.raw-materials .nutrientsBox.other .amaniBody dl dd ul li{
    list-style: circle;
}


#contents.raw-materials .nutrientsBox.other .amaniBody .amaniPic{
    margin: 0px auto;
    width: 80%;
    max-width: 500px;
}

#contents.raw-materials .nutrientsBox.other .amaniBody .amaniPic p{
    margin: 0px 0px 20px 0px;
}



@media (max-width: 767px){
 
    #contents.raw-materials .nutrientsBox.other .nBox.spice{
        margin: 0px auto;
        max-width: 500px;
        display:block;
    }  
    
    #contents.raw-materials .nutrientsBox.other .nBox.spice h4{
        font-size: 3.7vw;
    }
    
    #contents.raw-materials .nutrientsBox.other .nBox.spice dl dd p{
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        font-size: 3.5vw;
    }
    
    
    #contents.raw-materials .nutrientsBox.other .amaniBody{
        
    }
    
    #contents.raw-materials .nutrientsBox.other .amaniBody dl dt{
        font-size: 4vw;
    }
    
    #contents.raw-materials .nutrientsBox.other .amaniBody .amaniPic{
        margin: 0px auto;
        width: 94%;
    }

    
    
    

}



/* menu navi */

.menuList{
    margin: 0px auto 40px;
    max-width: 700px;
    width: 98%;
}

.menuList p.bnrMake{
    margin: 0px 0px 4px 0px;
}

.menuList div.bnrmake{
    margin: 0px auto 20px;
    width: 80%;
}

.menuList ul{
    margin: 0px 0px 4px 0px;
    display:flex;
    border: solid 1px #cccccc;
}

.menuList ul li{
    margin: 0px auto;
    width: 33%;
}


.food-rotation .menuList ul li.n01,
.food-rotation1500 .menuList ul li.n01{
    border: solid 2px #8fc31f;
}

.list-recipe .menuList ul li.n02,
.recipe .menuList ul li.n02{
    border: solid 2px #8fc31f;
}


.list-raw-materials .menuList ul li.n03,
.raw-materials .menuList ul li.n03{
    border: solid 2px #8fc31f;
}


@media (max-width: 767px){
    
    .menuList{
        margin: 0px auto 40px;
        width: 98%;     
    }
    
    .menuList ul{
        display:flex;
        border: solid 1px #cccccc;
    }
    
    .menuList ul li{
        margin: 0px auto;
        width: 33%;
    }
    
    .menuList ul li.on{
        border: solid 2px #8fc31f;
    }
    
    
    .menuList div.bnrmake{
        margin: 0px auto 20px;
        width: 96%;
    }
    
    .menuList p.bnrMake{
        margin: 0px 0px 5px 0px;
    }
    
    
    
    
}


/* instaBox */

.instaBox{
    margin: 0px auto;
    padding: 0px 0px 20px 0px;
    max-width: 700px;
}

.instaBox dl{
    
}

.instaBox dl dt{
    margin: 0px auto 20px;
    text-align: center;
    max-width: 400px;
}

@media (max-width: 767px){
    .instaBox{
        margin: 0px auto;
        width: 96%;
    }    
}



/* レシピ　*/


#contents.recipe{
    margin: 0px auto 0px;
    padding: 0px 0px 0px 0px;
    max-width: 900px;
}
    
#contents.recipe h2{
    max-width: 240px;

}



#contents.recipe .rbox{
    margin: 0px 0px 50px 0px;
    display:block;
    position: relative;
}





#contents.recipe .pic{
    max-width: 500px;

}


#contents.recipe h3{
    margin: 0px auto 20px;
    padding: 0px 0px 10px 0px;
    width: 90%;
    border-bottom: dotted 1px #4c4c4c;

}

#contents.recipe .rd{
    width: 44%;
    position: absolute;
    right: 0px;
    top: 30%;
}

#contents.recipe .rDbox dl{
    margin: 0px auto 12px;
    padding: 0px 0px 10px 0px;
    width: 100%;
    border-bottom: dotted 1px #4c4c4c;
}

#contents.recipe .rDbox dl dt{
    margin: 0px 0px 10px 0px;
    font-size: 15px;
    font-weight: bold;
}

#contents.recipe .rDbox dl dd{
    margin: 0px 0px 10px 0px;
    font-size: 14px;
}


#contents.recipe .txtBox{
    margin: 0px auto 20px;
    width: 96%;
}



.r-wrap {
  width:100%;
  margin: 0 auto 30px;

}

.r-wrap .r-wrap .slider{
    width: 76%!important;
}

.r-wrap .slick-dotted.slick-slider{
        margin:0px auto!important;
    }

.r-wrap .slider .slick-slide {

    overflow: hidden;
/*    background-color: #ffffff;
*/}
.r-wrap .slider .slick-slide img {
    margin: 0px auto;
    padding: 10px 10px 10px 10px;
    display: block;
    max-width: 500px;
    object-fit: cover;
    background-color: #ffffff;
}
.r-wrap .thumbs_dots {
  margin: 0;
  width: 100%!important;
  
}

.r-wrap .thumbs_list{
    margin: 0px 0px 0px 10px;
    width: 90%;
    display:flex;
}

.r-wrap .thumbs_list li {
    margin: 0px 10px 0px 0px;
    width: 145px;
    height: 145px;
    cursor: pointer;
    transition: opacity 0.3s;
    background-color: #ffffff!important;
    background-size: 100% auto!important;
    background-repeat: no-repeat!important;
    border: solid 1px #979797;
}

.r-wrap.r-other .thumbs_list{
    margin: 0px 0px 0px 10px;
    width: 100%;
    display:flex;
}


.r-wrap.r-other .thumbs_list li {
    margin: 0px 1% 0px 0px;
    width: 24%;
    height: 96px;
    cursor: pointer;
    transition: opacity 0.3s;
    background-color: #ffffff!important;
    background-size: 100% auto!important;
    background-repeat: no-repeat!important;
    border: solid 1px #979797;
}



.r-wrap.r-other .slider .slick-slide video{
    margin: 0px 0px 0px 4%;
    padding: 10px 10px 10px 10px;
    display: block;
    width: 450px;
    height: 450px;
    object-fit: cover;
    background-color: #ffffff;
}



.r-wrap .thumbs_list li.slick-active {
  border: solid 2px #8fc31f;
}



#contents.recipe .priceBox{
    margin: 0px auto 50px;
    padding: 0px 0px 7px 0px;
    width: 100%;
    border: solid 1px #969696;
    border-radius: 10px;
    background-color:#ffffff;
}

#contents.recipe .priceBox dl{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 5px 0px;
    display:flex;
    justify-content: center;
    align-items: center;
    border-bottom: solid 1px #969696;
}

#contents.recipe .priceBox dl:last-child{
    margin-bottom: 0px;
    padding: 0px 0px 0px 0px;
    border-bottom: none;
}

#contents.recipe .priceBox dl dt{
    padding: 30px 0px 0px 0px;
    width: 57%;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    line-height: 1.5em;
}


#contents.recipe .priceBox dl dt span{
    padding: 0px 3px 0px 3px;
    font-size: 42px;
}

#contents.recipe .priceBox dl dd{
    width: 40%;
}


#contents.recipe .priceBox dl dd .buttonbuy a{
    padding: 15px 10px 15px 10px;
    color: #ffffff;
    background-color: #eb6100;
    text-decoration: none;
    border-radius: 10px;
}

#contents.recipe .priceBox dl#price15 dd .buttonbuy a{
    background-color: #8fc31f;
}




#contents.recipe .nutrientsBox{
    margin: 0px auto 50px;
    padding: 0px 0px 0px 0px;
    width: 98%;
}

#contents.recipe .nutrientsBox .boxIn{
    margin: 0px 0px 60px 0px;
}

#contents.recipe .nutrientsBox .boxIn:last-child{
    margin: 0px 0px 0px 0px;
}

#contents.recipe .nutrientsBox .boxIn .txt{
    margin: 0px 0px 10px 0px;
    text-align: center;
}

#contents.recipe .nutrientsBox .boxIn .txt span{
    font-weight: bold;
}

#contents.recipe .nutrientsBox .boxIn .pic{
    margin: 0px auto;
}


#contents.recipe .nutrientsBox .boxIn.nutrient{
    
}

#contents.recipe .nutrientsBox .boxIn.nutrient dl{
    margin: 0px 0px 14px 0px;
}

#contents.recipe .nutrientsBox .boxIn.nutrient dl dt{
    margin: 0px 0px 10px 0px;
    font-weight: bold;
}

#contents.recipe .nutrientsBox .boxIn.nutrient dl dd{
    
}

#contents.recipe .nutrientsBox .boxIn.nutrient dl dd p{
    margin: 0px 0px 0px 0px;
    text-align: left;
}





#contents.recipe .nutrientsBox h2{
    margin: 0px auto 20px;
    padding: 0px 0px 10px 0px;
    border-bottom: dotted 1px #4d4d4d; 
    max-width: 800px;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
}

#contents.recipe .nutrientsBox .nBox{
    display:flex;
}

#contents.recipe .nutrientsBox .nBox .nb{
    margin: 0px auto;
    width: 32%;
}

#contents.recipe .nutrientsBox .nBox .nb .tit{
    margin: 0px 0px 80px 0px;
}

#contents.recipe .nutrientsBox .nBox .nb .boxin{
    padding-bottom: 90px;
    border: solid 6px #cbcbcb;    
}

#contents.recipe .nutrientsBox .nBox .nb .boxin .pic{
    margin: -90px auto 10px;
    width: 90%;    
}

#contents.recipe .nutrientsBox .nBox .nb .boxin .txt{
    margin: 0px 0px 0px 0px;
    padding: 0px 2px 20px 2px;
}

#contents.recipe .nutrientsBox .nBox .nb .boxin .txt p{
    margin: 0px 0px 10px 0px;
    line-height: 1.4em;
    font-size: 18px;
}


#contents.recipe .nutrientsBox .boxIn .faqBox{
    margin: 0px auto;
    max-width: 600px;
}

#contents.recipe .nutrientsBox .boxIn .faqBox dl{
    margin: 0px 0px 30px 0px;
}

#contents.recipe .nutrientsBox .boxIn .faqBox dl dt{
    margin: 0px 0px 0px 0px;
    padding: 10px 0px 20px 0px;
    border-bottom: dotted 1px #afafaf;
}


#contents.recipe .nutrientsBox .boxIn .faqBox dl:nth-child(1) dt:before{
    margin: 0px 4px 0px 0px;
    padding: 10px;
    content:"Q1";
    background-color: #0f6022;
    border-radius: 20px;
    color: #ffffff;
    
}

#contents.recipe .nutrientsBox .boxIn .faqBox dl:nth-child(2) dt:before{
    margin: 0px 4px 0px 0px;
    padding: 10px;
    content:"Q2";
    background-color: #0f6022;
    border-radius: 20px;
    color: #ffffff;
}

#contents.recipe .nutrientsBox .boxIn .faqBox dl:nth-child(3) dt:before{
    margin: 0px 4px 0px 0px;
    padding: 10px;
    content:"Q3";
    background-color: #0f6022;
    border-radius: 20px;
    color: #ffffff;
}





#contents.recipe .nutrientsBox .boxIn .faqBox dl dd{
    margin: 0px 0px 0px 0px;
    padding: 10px 0px 0px 0px;
    display:none;
}


/* 矢印 */
.faqBox dt {
  position: relative;
}
.faqBox dt::after {
  border-right: solid 2px #505050;
  border-top: solid 2px #505050;
  content: "";
  display: block;
  height: 8px;
  position: absolute;
  right: 25px;
  top: 38%;
  transform: rotate(135deg);
  transition: transform .3s ease-in-out, top .3s ease-in-out;
  width: 8px;
}
.faqBox dt.open::after {
  top: 45%;
  transform: rotate(-45deg);
}




@media (max-width: 767px){
    #contents.recipe{
        margin: 0px auto 0px;
        padding: 0px 0px 0px 0px;
        width: 100%;
    }
    
    #contents.recipe h2{
        margin: 0px auto 40px;
        width: 60%;
        
    }
    
    
    
    #contents.recipe .rbox{
        margin: 0px 0px 0px 0px;
        display:block;
        position: static;
    }
    
    
    #contents.recipe .pic{
        width: 80%;
        
    }
    
    #contents.recipe .rd{
        width: 100%;
        position: static;
        left:auto;
        top:auto;
    }
    
    #contents.recipe h3{
        margin: 0px auto 20px;
        padding: 0px 0px 10px 0px;
        width: 90%;
        border-bottom: dotted 1px #4c4c4c;
        
    }
    
    #contents.recipe .rDbox dl{
        margin: 0px auto 30px;
        padding: 0px 0px 10px 0px;
        width: 90%;
        border-bottom: dotted 1px #4c4c4c;
    }
    
    #contents.recipe .rDbox dl dt{
        margin: 0px 0px 10px 0px;
        font-size: 3.5vw;
    }
    
    #contents.recipe .rDbox dl dd{
        margin: 0px 0px 10px 0px;
        font-size: 3vw;
    }



    .r-wrap {
      width: 100%;
      margin: 0 auto;
        padding: 4px 4px 8px 4px;
        background-color: #ffffff;
    
    }
    
    .r-wrap .slick-dotted.slick-slider{
        margin:0px auto!important;
    }
    
    .r-wrap .slider{
        width: 76%!important;
    }

    .r-wrap .slider .slick-slide {
        
        overflow: hidden;
        background-color: #ffffff;
    }
    .r-wrap .slider .slick-slide img {
        margin: 0px 0px 0px 0px;
        display: block;
        width: 100%;
        height: auto;
        object-fit: cover;
    }
    .r-wrap .thumbs_dots {
      margin: 0;
      width: 100%!important;
      
    }
    
    .r-wrap .thumbs_list{
        margin: 0px 0px 0px 0px;
        width: 100%;
    }
    
    .r-wrap .thumbs_list li {
      margin: 0px 1% 8px 0px;
        width: 24%;
      height: 100px;
      cursor: pointer;
      transition: opacity 0.3s;
        background-color: #ffffff!important;
        background-size: 100% auto!important;
        background-repeat: no-repeat!important;
        border: solid 1px #979797;
    }
    
    
    
    .r-wrap .thumbs_list li.slick-active {
      border: solid 2px #8fc31f;
    }
    
    
    
    #contents.recipe .priceBox{
        margin: 0px auto 50px;
        padding: 0px 0px 20px 0px;
        width: 90%;
        border: solid 1px #969696;
        border-radius: 10px;
        background-color:#ffffff;
    }
    
    #contents.recipe .priceBox dl{
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 15px 0px;
        display:flex;
        border-bottom: solid 1px #969696;
    }
    
    #contents.recipe .priceBox dl:last-child{
        margin-bottom: 0px;
        padding: 0px 0px 0px 0px;
        border-bottom: none;
    }
    
    #contents.recipe .priceBox dl dt{
        padding: 22px 0px 0px 0px;
        width: 57%;
        text-align: center;
        font-size: 4vw;
        font-weight: bold;
    }
    
    
    #contents.recipe .priceBox dl dt span{
        padding: 0px 3px 0px 3px;
        font-size: 9vw;
    }
    
    #contents.recipe .priceBox dl dd{
        padding: 8px 0px 0px 0px;
        width: 40%;
    }
    
    
    #contents.recipe .nutrientsBox{
        margin: 0px auto 50px;
        padding: 0px 0px 0px 0px;
        width: 98%;
    }
    
    
    #contents.recipe .nutrientsBox .boxIn{
        margin: 0px 0px 30px 0px;
    }

    #contents.recipe .nutrientsBox .boxIn:last-child{
        margin: 0px 0px 0px 0px;
    }

    #contents.recipe .nutrientsBox .boxIn .txt{
        margin: 0px 0px 20px 0px;
        text-align: center;
    }
    
    #contents.recipe .nutrientsBox .boxIn .txt span{
        font-weight: bold;
    }

    #contents.recipe .nutrientsBox .boxIn .pic{
        margin: 0px auto;
        width: 90%;
    }
    
    
    
    #contents.recipe .nutrientsBox h2{
        margin: 0px 0px 20px 0px;
        padding: 0px 0px 10px 0px;
        border-bottom: dotted 1px #4d4d4d; 
        width: 100%;
        text-align: center;
        font-weight: bold;
    }
    
    #contents.recipe .nutrientsBox .nBox{
        display:flex;
    }
    
    #contents.recipe .nutrientsBox .nBox .nb{
        margin: 0px auto;
        width: 32%;
    }
    
    #contents.recipe .nutrientsBox .nBox .nb .tit{
        margin: 0px 0px 30px 0px;
    }
    
    #contents.recipe .nutrientsBox .nBox .nb .boxin{
        padding-bottom: 40px;
        border: solid 6px #cbcbcb;    
    }
    
    #contents.recipe .nutrientsBox .nBox .nb .boxin .pic{
        margin: -40px auto 10px;
        width: 90%;    
    }
    
    #contents.recipe .nutrientsBox .nBox .nb .boxin .txt{
        margin: 0px 0px 0px 0px;
        padding: 0px 2px 20px 2px;
    }
    
    #contents.recipe .nutrientsBox .nBox .nb .boxin .txt p{
        margin: 0px 0px 10px 0px;
        line-height: 1.4em;
        font-size: 3vw;
    }
    
    #contents.recipe .nutrientsBox .boxIn .faqBox{
        margin: 0px auto;
        width: 98%;
    }

    #contents.recipe .nutrientsBox .boxIn .faqBox dl{
        margin: 0px 0px 30px 0px;
    }

    #contents.recipe .nutrientsBox .boxIn .faqBox dl dt{
        margin: 0px 0px 0px 0px;
        padding: 10px 0px 20px 0px;
        border-bottom: dotted 1px #afafaf;
        font-size: 3.2vw;
    }


    #contents.recipe .nutrientsBox .boxIn .faqBox dl:nth-child(1) dt:before{
        margin: 0px 4px 0px 0px;
        padding: 10px;
        content:"Q1";
        background-color: #0f6022;
        border-radius: 20px;
        color: #ffffff;

    }

    #contents.recipe .nutrientsBox .boxIn .faqBox dl:nth-child(2) dt:before{
        margin: 0px 4px 0px 0px;
        padding: 10px;
        content:"Q2";
        background-color: #0f6022;
        border-radius: 20px;
        color: #ffffff;
    }

    #contents.recipe .nutrientsBox .boxIn .faqBox dl:nth-child(3) dt:before{
        margin: 0px 4px 0px 0px;
        padding: 10px;
        content:"Q3";
        background-color: #0f6022;
        border-radius: 20px;
        color: #ffffff;
    }





    #contents.recipe .nutrientsBox .boxIn .faqBox dl dd{
        margin: 0px 0px 0px 0px;
        padding: 10px 0px 0px 0px;
        display:none;
        font-size: 3.5vw;
    }
    
    .r-wrap.r-other .slider{
        width: 100%!important;
    }
    
    .r-wrap.r-other .thumbs_list{
        margin: 0px;
        padding-top: 6px;
        display:flex;
    }


    .r-wrap.r-other .thumbs_list li {
        margin: 0px 0px 10px 0px;
        width: 100%;
        height: 68px;
    }
    
    .r-wrap.r-other .thumbs_dots{
        width: 100%!important;
    }
    
    
    .r-wrap.r-other .slider .slick-slide img {
        margin: 0px 0px 0px 0px;
        padding: 2px 2px 2px 2px;
        
    }
    
    .r-wrap.r-other .slider .slick-slide video{
        margin: 0px 0px 0px 0px;
        padding: 2px 2px 2px 2px;
        width: 100%;
        height: auto;
    }
    
    
}


/* recipe 詳細*/


.buyA{
    margin: 0px auto 30px;
    width: 96%;
}

.buyA .tt{
    margin: 0px auto 10px;
    border: solid 1px #1a1a1a;
}

.buyA .tt p{
    margin: 0px 0px 0px 0px;
    padding: 4px 0px 4px 0px;
    text-align:center;
    background-color: #ffffdf;
    border: solid 3px #ffffff;
}


.buyA .rmemo{
    
}

.buyA .rmemo em{
    margin: 0px 2px 0px 0px;
    padding: 2px 2px 2px 2px;
    font-style: normal;
    font-weight: bold;
    background-color: #ffffdf;
}

.buyA .rmemo span{
    color: #be1724;
    font-weight: bold;
    font-size: 22px;
}

.buyA .pu{
    font-size: 13px;
}

.buyA .priceList {
    margin: 0px 0px 20px 0px;
    display: flex;
    flex-direction: column;
}


.buyA ul.memo{
    margin: 0px 0px 0px 20px;
    padding: 0px 0px 0px 0px;
}

.buyA ul.memo li{
    list-style: disc;
    font-size: 14px;
}


@media (max-width: 767px){
    .buyA ul.memo{
        margin: 0px 0px 0px 20px;
        padding: 0px 0px 0px 0px;
    }

    .buyA ul.memo li{
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        list-style: disc;
        font-size: 4vw;
    }
}



.priceRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  flex-wrap: nowrap;
}



.priceRow .pl{
    font-size: 11px;
      display: flex;
      gap: 4px;
    align-items: baseline;
}

.priceRow .pl span{
    font-size: 30px;
    font-weight: bold;
    
}

.priceRow.r3 .pl span{
    color: #be1724;
}

.priceRow.r3{
    margin: 0px 0px 4px 0px;
    padding-bottom: 4px;
    border-bottom: solid 1px #d2d2d2;
}

.priceRow .cart{
    width: 50%;
}

.priceRow .cart a{
    margin: 0px 0px 0px 0px;
    padding: 6px 10px 6px 10px;
    text-decoration: none;
    background-color: #0f6022;
    color: #ffffff;    
    display:block;
    text-align:center;
    border-radius: 10px;
    font-size: 15px;
}

.priceRow.r3 .cart a{
    background-color: #be1724;
}


.priceRow img.shipping{
    margin: 0px 0px 0px auto;
    width: 36%;
}


@media (max-width: 767px){
    
    .priceRow {
        flex-direction: column;
        align-items: flex-start;
      }

      .priceRow .cart {
        width: 100%;
      }

      .priceRow .cart a {
        width: 100%;
        font-size: 3.4vw;
      }

      .priceRow .pl {
        
        width: 100%;
          font-size: 4vw;
      }
    
    .priceRow .pl span{
        font-size: 10vw;
        
    }
    
    .priceRow img.shipping {
    width: 36%;
    height: auto;
    object-fit: contain;
    display: block;
  }
    
    
}

.commonBox{
    margin: 0px auto 30px;
    width: 98%;
}

.commonBox .tt{
    margin: 0px auto 10px;
    border: solid 1px #1a1a1a;
}

.commonBox .tt p{
    margin: 0px 0px 0px 0px;
    padding: 4px 0px 4px 0px;
    text-align:center;
    background-color: #ffffdf;
    border: solid 3px #ffffff;
}

.commonBox .m{
    font-size: 11px;
}

.commonBox .m em{
    font-style: normal;
}


.commonBox .cmnbox{
    margin: 0px 0px 12px 0px;
}


.commonBox .dmemo{
    margin: 0px 0px 0px 20px;
}

.commonBox .dmemo li{
    margin: 0px 0px 0px 0px;
    list-style: disc;
    font-size: 15px;
}




.aboutR{
    margin: 0px auto 30px;
    width: 90%;
}

#contents .aboutR h3{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 28px;
    font-size: 20px;
    font-weight: bold;
    background: url("/resource/img/common/arrow_h3.png")no-repeat left center;
    background-size: 24px auto;
    color: #0f6022;
}


.aboutR ul{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}

.aboutR ul li{
    margin: 0px 0px 10px 0px;
    padding: 6px 0px 6px 38px;
    font-size: 15px;
}

.aboutR ul li.a01{
    background: url("/resource/img/common/arrow_about01.png") no-repeat left center;
    background-size: 32px auto;
}

.aboutR ul li.a02{
    background: url("/resource/img/common/arrow_about02.png") no-repeat left center;
    background-size: 32px auto;
}

.aboutR ul li.a03{
    background: url("/resource/img/common/arrow_about03.png") no-repeat left center;
    background-size: 32px auto;
}

.aboutR ul li.a04{
    background: url("/resource/img/common/arrow_about04.png") no-repeat left center;
    background-size: 32px auto;
}


.aboutR ul li.a05{
    background: url("/resource/img/common/arrow_about05.png") no-repeat left center;
    background-size: 32px auto;
}

.aboutR ul li.a06{
    background: url("/resource/img/common/arrow_about06.png") no-repeat left center;
    background-size: 32px auto;
}

.aboutR ul li.a07{
    background: url("/resource/img/common/arrow_about07.png") no-repeat left center;
    background-size: 32px auto;
}




#contents .aboutR .lead{
    margin: 0px 0px 10px 0px;
    text-align:left;
    font-size: 18px;
    font-weight: bold;
    color: #be1724;
}


#contents.recipe .aboutR .pic{
    margin: 0px auto;
    padding: 0px 0px 0px 0px;
    width: 100%;
    max-width: 100%;
}


@media (max-width: 767px){
    .aboutR{
        margin: 0px auto 30px;
        width: 90%;
    }

    #contents.recipe .aboutR h3{
        margin: 0px 0px 10px 0px;
        padding: 0px 0px 0px 28px;
        background: url("/resource/img/common/arrow_h3.png")no-repeat left center;
        background-size: 24px auto;
    }
    
    #contents .aboutR .lead{
        margin: 0px 0px 10px 0px;
        text-align:left;
        font-size: 18px;
        font-weight: bold;
        color: #be1724;
    }
    
    .aboutR ul{
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
    }

    .aboutR ul li{
        margin: 0px 0px 6px 0px;
        padding: 6px 0px 6px 38px;
        font-size: 3.6vw;
    }
    
}



.recipe .commonBox{
    
}


.recipe .commonBox h3{
     margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    text-align: center;
}












#contents.list-recipe{
    margin: 0px auto 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
}

#contents.list-recipe h2{
    max-width: 240px;

}


#contents.list-recipe .listRecipeBox{
    margin: 0px auto;
    max-width: 900px;
}

#contents.list-recipe .listRecipeBox ul{
    margin: 0px auto;
    width: 98%;
    display: flex;
    flex-wrap: wrap;
}

#contents.list-recipe .listRecipeBox ul li{
    margin: 0px 1% 40px 1%;
    width: 31%;
}

#contents.list-recipe .listRecipeBox ul li.popular p.pic{
    background: url("../img/common/popular.png") no-repeat right top;
    background-size: 36px auto;
}

#contents.list-recipe .listRecipeBox ul li p.name{
    margin: 0px 0px 10px 0px;
    padding: 6px 0px 6px 0px;
    background-color: #ffffff;
    text-align: center;
}

#contents.list-recipe .listRecipeBox ul li p.pic{
    margin: 0px auto 10px;
    width: 100%;
    text-align: center;
}

#contents.list-recipe .listRecipeBox ul li p.pic img{
    width: 90%;
}

#contents.list-recipe .listRecipeBox ul li ul{
    margin: 0px 0px 14px 0px;
    display:block;
}

#contents.list-recipe .listRecipeBox ul li ul li{
    margin: 0px 0px 5px 0px;
    width: 100%;
    font-size: 14px;
}

#contents.list-recipe .listRecipeBox ul li ul li.protein:before{
    content:"■";
    color: #db77ac;
}

#contents.list-recipe .listRecipeBox ul li ul li.vegetable:before{
    content:"■";
    color: #39b576;
}

#contents.list-recipe .listRecipeBox ul li ul li.carbohydrates:before{
    content:"■";
    color: #a0835c;
}

#contents.list-recipe .listRecipeBox ul li p.price{
    margin: 0px 0px 14px 0px;
    padding: 0px 0px 0px 0px;
    font-size: 16px;
    text-align: center;
}

#contents.list-recipe .listRecipeBox ul li p.link{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 0px;
    font-size: 16px;
    text-align: center;
}

#contents.list-recipe .listRecipeBox ul li p.link a{
    padding: 10px 0px 10px 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #eb6100;
    border-radius: 10px;
    text-decoration: none;
    color: #ffffff;
}


#contents.list-recipe .listRecipeBox ul li .buyArea{
    
}

#contents.list-recipe .listRecipeBox ul li .buyArea .b1 a{
    margin: 0px 0px 4px 0px;
    padding: 10px 0px 10px 0px;
    display:flex;
    justify-content: center;
    align-items: center;
    background-color: #8fc31f;
    border-radius: 10px;
    text-decoration: none;
}

#contents.list-recipe .listRecipeBox ul li .buyArea .b2 a{
    padding: 10px 0px 10px 0px;
    display:flex;
    justify-content: center;
    align-items: center;
    background-color: #eb6100;
    border-radius: 10px;
    text-decoration: none;
}


#contents.list-recipe .listRecipeBox ul li .buyArea .pbox{
    width: 52%;
    text-align: center;
    color: #ffffff;
    font-size: 13px;
}

#contents.list-recipe .listRecipeBox ul li .buyArea .pbox span{
    font-size: 16px;
}


#contents.list-recipe .listRecipeBox ul li .buyArea .buttonbuy{   
    padding: 0px 0px 0px 20px;
    background: url("../img/recipe/arrow-buy.png") no-repeat left center;
    background-size: 13px auto;
    color: #ffffff;
    font-size: 14px;
    font-weight: bold;
}


#contents.list-recipe .listRecipeBox ul li.blend .txt{
    margin: 0px 0px 4px 0px;
    font-size: 11px;
}




@media (max-width: 767px){
    #contents.list-recipe{
        margin: 0px auto 0px;
        padding: 0px 0px 0px 0px;
        width: 100%;
    }
    
    #contents.list-recipe h2{
        width: 60%;
        
    }
        
    #contents.list-recipe .listRecipeBox{
        
    }
    
    #contents.list-recipe .listRecipeBox ul{
        margin: 0px auto;
        width: 98%;
        display: flex;
        flex-wrap: wrap;
    }
    
    #contents.list-recipe .listRecipeBox ul li{
        margin: 0px auto 40px 0px;
        width: 48%;
    }
    
    #contents.list-recipe .listRecipeBox ul li.popular p.pic{
        background: url("../img/common/popular.png") no-repeat right top;
        background-size: 36px auto;
    }
    
    #contents.list-recipe .listRecipeBox ul li p.name{
        margin: 0px 0px 10px 0px;
        padding: 6px 0px 6px 0px;
        background-color: #ffffff;
        text-align: center;
    }
    
    #contents.list-recipe .listRecipeBox ul li p.pic{
        margin: 0px auto 10px;
        width: 100%;
        text-align: center;
    }
    
    #contents.list-recipe .listRecipeBox ul li p.pic img{
        width: 90%;
    }
    
    #contents.list-recipe .listRecipeBox ul li ul{
        margin: 0px 0px 6px 0px;
        display:block;
    }
    
    #contents.list-recipe .listRecipeBox ul li ul li{
        margin: 0px 0px 5px 0px;
        width: 100%;
        font-size: 3vw;
    }
    
    #contents.list-recipe .listRecipeBox ul li ul li.protein:before{
        content:"■";
        color: #db77ac;
    }
    
    #contents.list-recipe .listRecipeBox ul li ul li.vegetable:before{
        content:"■";
        color: #39b576;
    }
    
    #contents.list-recipe .listRecipeBox ul li ul li.carbohydrates:before{
        content:"■";
        color: #a0835c;
    }
    
    #contents.list-recipe .listRecipeBox ul li p.price{
        margin: 0px 0px 6px 0px;
        padding: 0px 0px 0px 0px;
        font-size: 3.4vw;
        text-align: center;
    }
    
    #contents.list-recipe .listRecipeBox ul li p.link{
        margin: 0px 0px 10px 0px;
        padding: 0px 0px 0px 0px;
        font-size: 3.4vw;
        text-align: center;
    }
    
    
    
    
    
    

}








#contents.list-raw-materials{
    margin: 0px auto 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
}

#contents.list-raw-materials h2{
    max-width: 240px;

}







#contents.list-raw-materials .listrmBox{
    margin: 0px auto;
    max-width: 900px;
}

#contents.list-raw-materials .listrmBox ul{
    margin: 0px auto;
    width: 98%;
    display: flex;
    flex-wrap: wrap;
}

#contents.list-raw-materials .listrmBox ul li{
    margin: 0px 1% 40px 1%;
    width: 31%;
}


#contents.list-raw-materials .listrmBox ul li.popular p.pic{
    background: url("../img/common/popular.png") no-repeat right top;
    background-size: 36px auto;
}

#contents.list-raw-materials .listrmBox ul li p.name{
    margin: 0px 0px 10px 0px;
    background-color: #ffffff;
    height: 36px;
    
  display: flex;
  align-items: center;
  justify-content: center;
    
    
}

#contents.list-raw-materials .listrmBox ul li p.name .newitem{
    font-size:0.8em;
    color: #DE3639;
}

#contents.list-raw-materials .listrmBox ul li p.name.small{
    font-size: 13px;
}




#contents.list-raw-materials .listrmBox ul li p.name.small2{
    font-size: 12px;
}

#contents.list-raw-materials .listrmBox ul li.protein p.name{
    border-left: solid 5px #db77ac;
}

#contents.list-raw-materials .listrmBox ul li.vegetable p.name{
    border-left: solid 5px #39b576;
}

#contents.list-raw-materials .listrmBox ul li.carbohydrate p.name{
    border-left: solid 5px #a0835c;
}

#contents.list-raw-materials .listrmBox ul li.source p.name{
    border-left: solid 5px #7ea0bc;
}

#contents.list-raw-materials .listrmBox ul li.other p.name{
    border-left: solid 5px #fbf4be;
}


#contents.list-raw-materials .listrmBox ul li p.pic{
    margin: 0px auto;
    width: 100%;
    min-height: 150px;
    text-align: center;
}

#contents.list-raw-materials .listrmBox ul li.blend p.pic{
    margin: 0px auto 5px;
    width: 92%;
}



#contents.list-raw-materials .listrmBox ul li p.pic img{
    width: 100%;
}


#contents.list-raw-materials .listrmBox ul li .txt{
    margin: 0px 0px 5px 0px;
    min-height: 30px;
}

#contents.list-raw-materials .listrmBox ul li.source .txt{
    margin: 0px 0px 5px 0px;
    min-height: 46px;
}



#contents.list-raw-materials .listrmBox ul li .txt p{
    font-size: 14px;
}

#contents.list-raw-materials .listrmBox ul li.blend .txt p{
    font-size: 11px;
}


#contents.list-raw-materials .listrmBox ul li p.link{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 10px 0px;
    font-size: 14px;
    text-align: right;
}



@media (max-width: 767px){
    #contents.list-raw-materials{
        margin: 0px auto 0px;
        padding: 0px 0px 0px 0px;
        width: 100%;
    }
    
    #contents.list-raw-materials h2{
        width: 60%;
        
    }
    
    
    
    
    
    
    
    #contents.list-raw-materials .listrmBox{
        
    }
    
    #contents.list-raw-materials .listrmBox ul{
        margin: 0px auto;
        width: 98%;
        display: flex;
        flex-wrap: wrap;
    }
    
    #contents.list-raw-materials .listrmBox ul li{
        margin: 0px 1% 40px 1%;
        width: 48%;
    }
    
    #contents.list-raw-materials .listrmBox ul li.popular p.pic{
        background: url("../img/common/popular.png") no-repeat right top;
        background-size: 36px auto;
    }
    
    #contents.list-raw-materials .listrmBox ul li p.name{
        margin: 0px 0px 10px 0px;
        padding: 11px 0px 6px 0px;
        background-color: #ffffff;
        text-align: center;
    }
    
    #contents.list-raw-materials .listrmBox ul li p.name.small{
        font-size: 3.5vw;
    }
    
    #contents.list-raw-materials .listrmBox ul li p.name.small2{
        font-size: 3vw;
    }
    
    #contents.list-raw-materials .listrmBox ul li p.pic{
        margin: 0px auto 1px;
        width: 100%;
        text-align: center;
    }
    
    #contents.list-raw-materials .listrmBox ul li p.pic img{
        margin: 0px 0px 0px 5%;
        width: 90%;
    }
    
    #contents.list-raw-materials .listrmBox ul li .txt{
        margin: 0px 0px 5px 0px;
        min-height: 40px;
    }
    
    #contents.list-raw-materials .listrmBox ul li .txt p{
        font-size: 3.6vw;
        line-height: 1.4em;
    }
    
    #contents.list-raw-materials .listrmBox ul li.blend .txt p{
        font-size: 2.9vw;
    }
    
    #contents.list-raw-materials .listrmBox ul li p.link{
        margin: 0px 0px 10px 0px;
        padding: 0px 0px 0px 0px;
        font-size: 3.4vw;
        text-align: center;
    }
    

}


#contents.list-raw-materials .listrmBox ul li .buyArea{
    
}

#contents.list-raw-materials .listrmBox ul li.other .buyArea{
    display:none;
}

#contents.list-raw-materials .listrmBox ul li.other.blend .buyArea{
    display:block;
}

#contents.list-raw-materials .listrmBox ul li .buyArea .b1 a{
    margin: 0px 0px 4px 0px;
    padding: 10px 0px 10px 0px;
    display:flex;
    justify-content: center;
    align-items: center;
    background-color: #8fc31f;
    border-radius: 10px;
    text-decoration: none;
}

#contents.list-raw-materials .listrmBox ul li .buyArea .b2 a{
    padding: 10px 0px 10px 0px;
    display:flex;
    justify-content: center;
    align-items: center;
    background-color: #eb6100;
    border-radius: 10px;
    text-decoration: none;
}


#contents.list-raw-materials .listrmBox ul li .buyArea .pbox{
    width: 52%;
    text-align: center;
    color: #ffffff;
    font-size: 13px;
}

#contents.list-raw-materials .listrmBox ul li .buyArea .pbox span{
    font-size: 16px;
}


#contents.list-raw-materials .listrmBox ul li .buyArea .buttonbuy{   
    padding: 0px 0px 0px 20px;
    background: url("../img/recipe/arrow-buy.png") no-repeat left center;
    background-size: 13px auto;
    color: #ffffff;
    font-size: 14px;
    font-weight: bold;
}





/* newItem */


#contents.list-raw-materials .newItem{
    margin: 0px auto 60px;
    padding: 12px 0px 12px 0px;
    max-width: 800px;
    width: 96%;
    border-top: solid 1px #d2d2d2;
    border-bottom: solid 1px #d2d2d2;
}

#contents.list-raw-materials .newItem.listrmBox ul{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    display:flex;
    flex-wrap: wrap;
    align-items: stretch;
}


#contents.list-raw-materials .newItem ul li{
    margin: 0px 0px 0px 0px;
    padding: 0px 1% 0px 1%;
    width: 25%;
    border-left: solid 1px #d2d2d2;
    
}

#contents.list-raw-materials .newItem ul li.newtit{
   display: flex;
    align-items: center; 
}

#contents.list-raw-materials .newItem ul li:last-child{
    border-right: solid 1px #d2d2d2;
}

#contents.list-raw-materials .newItem.listrmBox ul li .pic{
    margin: 0px auto;
}

#contents.list-raw-materials .newItem.listrmBox ul li .name{
    padding-left: 10px;
}


#contents.list-raw-materials .newItem ul li .new{
    margin: 0px 0px 5px 0px;
    padding: 4px 4px 4px 4px;
    background-color: #df3639;
    color: #ffffff;
    font-size: 14px;
    
}



@media (max-width: 767px){
    
    
    #contents.list-raw-materials .newItem{
        margin: 0px auto 50px;
        width: 98%;
    }
    
    #contents.list-raw-materials .newItem ul{
        border:none;
    }
    
    #contents.list-raw-materials .newItem ul li{
        margin: 0px auto 20px;
        padding: 0px 1% 0px 1%;
        width: 48%;
        border:none;

    }
    
    #contents.list-raw-materials .newItem ul li:last-child{
        border:none;
    }
    
    
}




.filter{
    margin: 0px auto 30px;
    max-width: 500px;
    border-left: solid 1px #cccccc;
}

.filter .all{
    margin: 0px 0px 0px 0px;
    padding: 10px 0px 10px 0px;
    background: #8fc31f url("../img/common/arrow-all.png") no-repeat 76% center;
    background-size: 20px auto;
    text-align: center;
    font-size: 16px;
    border-top: solid 1px #cccccc;
    border-right: solid 1px #cccccc;
    border-bottom: solid 1px #cccccc;
}

.filter .all:hover{
    cursor: pointer;
}


.filter .filbox{
    display:flex;
    flex-wrap: wrap;
}

.filter .filbox p{
    margin: 0px 0px 0px 0px;
    padding: 10px 0px 10px 0px;
    background-color: #ffffff;
    width: 50%;
    text-align: center;
    font-size: 16px;
    border-bottom: solid 1px #cccccc;
    border-right: solid 1px #cccccc;
}


.filter .filbox p:hover{
    cursor: pointer;
}



.filter .filbox p.protein:before{
    content:"■";
    color: #db77ac;
}

.filter .filbox p.vegetable:before{
    content:"■";
    color: #39b576;
}

.filter .filbox p.carbohydrate:before{
    content:"■";
    color: #a0835c;
}

.filter .filbox p.source:before{
    content:"■";
    color: #7ea0bc;
}





@media (max-width: 767px){
    
    
    .filter{
        margin: 0px auto 30px;
        width: 90%;
        border-left: solid 1px #cccccc;
    }
    
    .filter .all{
        margin: 0px 0px 0px 0px;
        padding: 10px 0px 10px 0px;
        text-align: center;
        font-size: 3.5vw;
        border-top: solid 1px #cccccc;
        border-right: solid 1px #cccccc;
        border-bottom: solid 1px #cccccc;
    }
    
    
    
    .filter .filbox{
        display:flex;
        flex-wrap: wrap;
    }
    
    .filter .filbox p{
        margin: 0px 0px 0px 0px;
        padding: 10px 0px 10px 0px;
        background-color: #ffffff;
        width: 50%;
        text-align: center;
        font-size: 3.5vw;
        border-bottom: solid 1px #cccccc;
        border-right: solid 1px #cccccc;
    }
    
    
}








/* about */



#contents.about{
    margin: 0px auto 0px;
    padding: 0px 0px 0px 0px;
    max-width: 750px;
}

#contents.about h2{
    margin: 0px auto 20px;
    max-width: 450px;
}

#contents.about .lead{
    margin: 0px auto 20px;
    max-width: 800px;
    text-align: left;
}





#contents.about .boxs{
    margin: 0px auto 50px;
    width: 96%;
}

#contents.about .boxs .pic{
    margin: 0px auto 24px;
    max-width: 800px;
    
}

#contents.about .boxs .b03 .pic{
    margin: 0px auto 24px;
    max-width: 400px;
    
}

#contents.about .boxs .abox{
    margin: 0px 0px 20px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    display: flex;
}

#contents.about .boxs .abox.a01 .pic-a{
    width: 33%;
}

#contents.about .boxs .abox.a01 .boxR{
    margin: 0px auto;
    padding: 38px 0px 0px 0px;
    width: 56%;
}

#contents.about .boxs .abox.a01 .boxR .tit{
    margin: 0px 0px 10px 0px;
    width: 200px;
}

#contents.about .boxs .abox.a01 .boxR .txt{
    margin: 0px 0px 10px 0px;
    line-height: 1.5em;
    font-size: 16px;
}


#contents.about .boxs .abox.a02 .pic-a{
    width: 40%;
}

#contents.about .boxs .abox.a02 .boxL{
    margin: 0px auto;
    padding: 20px 0px 0px 0px;
    width: 56%;
}

#contents.about .boxs .abox.a02 .boxL .tit{
    margin: 0px 0px 10px 0px;
    width: 200px;
}

#contents.about .boxs .abox.a02 .boxL .txt{
    margin: 0px 0px 10px 0px;
    line-height: 1.5em;
    font-size: 16px;
}

#contents.about .boxs .abox.a03 .pic-a{
    width: 40%;
}

#contents.about .boxs .abox.a03 .boxR{
    margin: 0px auto;
    padding: 50px 0px 0px 0px;
    width: 56%;
}

#contents.about .boxs .abox.a03 .boxR .tit{
    margin: 0px 0px 10px 0px;
    width: 300px;
}

#contents.about .boxs .abox.a03 .boxR .txt{
    margin: 0px 0px 10px 0px;
    line-height: 1.5em;
    font-size: 16px;
}


#contents.about .boxs h3{
    margin: 0px auto 20px;
    padding: 0px 0px 10px 0px;
    width: 98%;
    border-bottom: dotted 1px #505050;
    text-align: center;
    line-height: 1.5em;
    font-weight: bold;
    font-size: 22px;
}


#contents.about .boxs .txtBox{
    margin: 0px auto 50px;
    width: 98%;
}

#contents.about .boxs .txtBox p{
    line-height: 1.5em;
    font-size: 16px;
}



#contents.about .boxs .bbox{
    margin: 0px auto 60px;
    width: 98%;
}

#contents.about .boxs .bbox .tit{
   margin: 0px 0px 20px 0px;
   text-align: center;
}

#contents.about .boxs .bbox.b01 .tit span{
    margin: 0px 0px 0px 0px;
    padding: 10px 20px 10px 20px;
    background-color: #db81b0;
    border-radius: 20px;
    color: #ffffff;
    font-weight: bold;
}

#contents.about .boxs .bbox.b02 .tit span{
    margin: 0px 0px 0px 0px;
    padding: 10px 20px 10px 20px;
    background-color: #39b576;
    border-radius: 20px;
    color: #ffffff;
    font-weight: bold;
}

#contents.about .boxs .bbox.b03 .tit span{
    margin: 0px 0px 0px 0px;
    padding: 10px 20px 10px 20px;
    background-color: #a0835c;
    border-radius: 20px;
    color: #ffffff;
    font-weight: bold;
}

#contents.about .boxs .bbox .pic{

}

#contents.about .boxs .bbox .txt{
    margin: 0px auto 20px;
    padding: 0px 0px 0px 0px;
    width: 98%;
}

#contents.about .boxs .bbox .txt p{
    line-height: 1.5em;
    font-size: 16px;
}


#contents.about .boxs .nbox{
    margin: 0px auto 30px;
    padding: 0px 0px 0px 0px;
    max-width: 600px;
    display:flex;
}

#contents.about .boxs .nbox ul{
    margin: 0px 5% 0px 0px;
    width: 29%;
    border-right: dotted 1px #505050;
}

#contents.about .boxs .nbox ul:last-child{
    margin: 0px 0px 0px 0px;
    width: 28%;
    border-right: none;
}

#contents.about .boxs .nbox ul li{
    margin: 0px 0px 10px 0px;
    font-size: 13px;
}


#contents.about .boxs .catch{
    margin: 0px auto 10px;
    text-align: center;
    font-weight: bold;
    font-size: 18px;
    line-height: 1.5em;
}

#contents.about .boxs .recipeBox{
    margin: 0px auto 30px;
    width: 98%;
    display:block;

}




#contents.about .boxs .recipeBox p{
    margin: 0px auto;
    width: 100%;

}

#contents.about .boxs .btn{
    margin: 0px auto 30px;
    max-width: 400px;
}






@media (max-width: 767px){
    #contents.about{
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        width: 100%;
    }
    
    #contents.about h2{
        margin: 0px auto 20px;
        width: 90%;
    }
    
    #contents.about .lead{
        margin: 0px auto 20px;
        width: 90%;
        text-align: left;
    }
    
    
    
    
    
    #contents.about .boxs{
        
    }
    
    #contents.about .boxs .pic{
        margin: 0px auto 10px;
        width: 80%;
    }
    
    #contents.about .boxs .abox{
        margin: 0px 0px 20px 0px;
        padding: 0px 0px 0px 0px;
        width: 100%;
        display: flex;
    }
    
    #contents.about .boxs .abox.a01 .pic-a{
        width: 40%;
    }
    
    #contents.about .boxs .abox.a01 .boxR{
        margin: 0px auto;
        padding: 0px 0px 0px 0px;
        width: 56%;
    }
    
    #contents.about .boxs .abox.a01 .boxR .tit{
        margin: 0px 0px 10px 0px;
        width: 100px;
    }
    
    #contents.about .boxs .abox.a01 .boxR .txt{
        margin: 0px 0px 10px 0px;
        line-height: 1.5em;
        font-size: 3.5vw;
    }
    
    
    #contents.about .boxs .abox.a02 .pic-a{
        padding-top: 50px;
        width: 40%;
    }
    
    #contents.about .boxs .abox.a02 .boxL{
        margin: 0px auto;
        width: 56%;
    }
    
    #contents.about .boxs .abox.a02 .boxL .tit{
        margin: 0px 0px 10px 0px;
        width: 150px;
    }
    
    #contents.about .boxs .abox.a02 .boxL .txt{
        margin: 0px 0px 10px 0px;
        line-height: 1.5em;
        font-size: 3.5vw;
    }
    
    #contents.about .boxs .abox.a03 .pic-a{
        width: 40%;
    }
    
    #contents.about .boxs .abox.a03 .boxR{
        margin: 0px auto;
        padding: 0px 0px 0px 0px;
        width: 56%;
    }
    
    #contents.about .boxs .abox.a03 .boxR .tit{
        margin: 0px 0px 10px 0px;
        width: 200px;
    }
    
    #contents.about .boxs .abox.a03 .boxR .txt{
        margin: 0px 0px 10px 0px;
        line-height: 1.5em;
        font-size: 3.5vw;
    }
    
    
    #contents.about .boxs h3{
        margin: 0px auto 20px;
        padding: 0px 0px 10px 0px;
        width: 98%;
        border-bottom: dotted 1px #505050;
        text-align: center;
        line-height: 1.5em;
        font-weight: bold;
        font-size: 4.2vw;
    }
    
    
    #contents.about .boxs .txtBox{
        margin: 0px auto 50px;
        width: 90%;
    }
    
    #contents.about .boxs .txtBox p{
        line-height: 1.5em;
        font-size: 3.6vw;
    }
    
    
    
    #contents.about .boxs .bbox{
        margin: 0px auto 60px;
        width: 98%;
    }
    
    #contents.about .boxs .bbox .tit{
       margin: 0px 0px 20px 0px;
       text-align: center;
    }
    
    #contents.about .boxs .bbox.b01 .tit span{
        margin: 0px 0px 0px 0px;
        padding: 10px 10% 10px 10%;
        background-color: #db81b0;
        border-radius: 20px;
        color: #ffffff;
        font-weight: bold;
    }
    
    #contents.about .boxs .bbox.b02 .tit span{
        margin: 0px 0px 0px 0px;
        padding: 10px 10% 10px 10%;
        background-color: #39b576;
        border-radius: 20px;
        color: #ffffff;
        font-weight: bold;
    }
    
    #contents.about .boxs .bbox.b03 .tit span{
        margin: 0px 0px 0px 0px;
        padding: 10px 10% 10px 10%;
        background-color: #a0835c;
        border-radius: 20px;
        color: #ffffff;
        font-weight: bold;
    }
    
    #contents.about .boxs .bbox .pic{
        
    }
    
    #contents.about .boxs .bbox .txt{
        margin: 0px auto 20px;
        padding: 0px 0px 0px 0px;
        width: 98%;
    }
    
    #contents.about .boxs .bbox .txt p{
        line-height: 1.5em;
        font-size: 3.6vw;
    }
    
    
    #contents.about .boxs .nbox{
        margin: 0px auto 30px;
        padding: 0px 0px 0px 0px;
        width: 96%;
        display:flex;
    }
    
    #contents.about .boxs .nbox ul{
        margin: 0px 5% 0px 0px;
        width: 29%;
        border-right: dotted 1px #505050;
    }
    
    #contents.about .boxs .nbox ul:last-child{
        margin: 0px 0px 0px 0px;
        width: 28%;
        border-right: none;
    }
    
    #contents.about .boxs .nbox ul li{
        margin: 0px 0px 10px 0px;
        font-size: 3.4vw;
    }
    
    
    #contents.about .boxs .catch{
        margin: 0px auto 10px;
        text-align: center;
        font-weight: bold;
        font-size: 3.8vw;
        line-height: 1.5em;
    }
    
    #contents.about .boxs .recipeBox{
        margin: 0px auto 30px;
        width: 98%;
        display:flex;
        
    }
    
    
    
    
    #contents.about .boxs .recipeBox p{
        margin: 0px auto;
        width: 49%;
        
    }
    
    #contents.about .boxs .btn{
        margin: 0px auto 30px;
        width: 90%;
    }
    
    
}


#contents.commit{
    margin: 0px auto 0px;
    padding: 0px 0px 0px 0px;
    max-width: 1000px;
}

#contents.commit h2{
    margin: 0px auto 20px;
    max-width: 500px;
}



#contents.commit .bowlsclub{
    max-width: 900px;
}

#contents.commit .bowlsclub .boxIn .txt{
    width: 50%;
}



#contents.commit .bowlsclub h2{
    margin: 0px auto 14px;
    max-width: 100%;
}

#contents.commit .lead{
    margin: 0px auto 20px;
    max-width: 600px;
    text-align: left;
}


#contents.commit .humangrade{
    background:none;
}

#contents.commit .humangrade .hgbox{

}

#contents.commit .humangrade .hgbox .txtBox{
    max-width: 440px;
}

@media (max-width: 767px){
    #contents.commit{
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        width: 100%;
    }
    
    #contents.commit h2{
        margin: 0px auto 20px;
        width: 90%;
    }
    
    #contents.commit .bowlsclub h2{
        margin: 0px auto 14px;
        width: 100%;
    }
    
    
    #contents.commit .bowlsclub .boxIn .txt{
        width: 55%;
    }
    
    
    #contents.commit .humangrade .hgbox{
        
    }
    
    #contents.commit .humangrade .hgbox .txtBox{
        
    }
}


#contents.how{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
}

#contents.how h2{
    margin: 0px auto 20px;
    max-width: 240px;
}

#contents.how .howbox{
    margin: 0px auto 50px;
    max-width: 900px;
}

#contents.how .howbox h3{
    margin: 0px auto 20px;
    padding: 0px 0px 10px 0px;
    width: 98%;
    border-bottom: dotted 1px #505050;
    text-align: center;
    line-height: 1.5em;
    font-weight: bold;
    font-size: 22px;
}

#contents.how .howbox .pic{
    margin: 0px auto 30px;
    max-width: 500px;
}

 #contents.how .howbox .catch{
    margin: 0px auto 30px;
    width: 96%;
    text-align: center;
    color: #1a1a1a;
    font-weight: bold;
    font-size: 22px;
}

#contents.how .howbox dl{
    margin: 0px auto 40px;
    max-width: 500px;
}

#contents.how .howbox dl dt{
    margin: 0px 0px 30px 0px;
    text-align: center;
}

#contents.how .howbox dl dt span{
    margin: 0px 0px 0px 0px;
    padding: 10px 30px 10px 30px;
    border: solid 1px #191919;
    border-radius: 10px;
    background-color: #ffffff;
}

#contents.how .howbox dl dd{
        
}

#contents.how .howbox dl dd p{
    margin: 0px 0px 0px 0px;
    padding: 14px 0px 14px 0px;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
}

#contents.how .howbox dl dd p.p01{
    background-color: #cccccc;
}

#contents.how .howbox dl dd p.p02{
    background-color: #ffffff;
}


@media (max-width: 767px){
    #contents.how{
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        width: 100%;
    }
    
    #contents.how h2{
        margin: 0px auto 20px;
        width: 90%;
    }
    
    #contents.how .howbox{
        margin: 0px auto;
        width: 96%;
    }
    
    #contents.how .howbox h3{
        margin: 0px auto 20px;
        padding: 0px 0px 10px 0px;
        width: 98%;
        border-bottom: dotted 1px #505050;
        text-align: center;
        line-height: 1.5em;
        font-weight: bold;
    }
    
    #contents.how .howbox .pic{
        margin: 0px auto 30px;
        width: 96%;
    }
    
    #contents.how .howbox .catch{
        margin: 0px auto 30px;
        width: 96%;
        text-align: center;
        color: #1a1a1a;
        font-weight: bold;
        font-size: 3.5vw;
        line-height: 1.4em;
    }
    
    
    #contents.how .howbox dl{
        margin: 0px auto 30px;
        width: 90%;
    }
    
    #contents.how .howbox dl dt{
        margin: 0px 0px 30px 0px;
        text-align: center;
    }
    
    #contents.how .howbox dl dt span{
        margin: 0px 0px 0px 0px;
        padding: 10px 30px 10px 30px;
        border: solid 1px #191919;
        border-radius: 10px;
        background-color: #ffffff;
    }
    
    #contents.how .howbox dl dd{
        
    }
    
    #contents.how .howbox dl dd p{
        margin: 0px 0px 0px 0px;
        padding: 14px 0px 14px 0px;
        text-align: center;
        font-size: 3.6vw;
        font-weight: bold;
    }
    
    #contents.how .howbox dl dd p.p01{
        background-color: #cccccc;
    }

    #contents.how .howbox dl dd p.p02{
        background-color: #ffffff;
    }
    
    
    
    
}


#contents.story{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
}


#contents.story .titBox{
    margin: 0px auto 28px;
}



#contents.story h2{
    margin: 0px auto 20px;
    max-width: 240px;
}

#contents.story .block{
    margin: 0px 0px 50px 0px;
}

#contents.story .block h3{
    margin: 0px auto 20px;
    padding: 0px 0px 10px 0px;
    width: 98%;
    border-bottom: dotted 1px #505050;
    text-align: center;
    line-height: 1.5em;
    font-weight: bold;
    font-size: 22px;
}

#contents.story .block .pic{
    margin: 0px auto;
    max-width: 600px;
}

#contents.story .block .txtBox{
    margin: 0px auto 30px;
}


#contents.story .block .teambox{
    margin: 0px auto 30px;
    max-width: 800px;
    display:flex;
}

#contents.story .block .teambox .pic{
    margin: 0px auto;
    width: 32%;
}

#contents.story .block .teambox .txtBox{
    margin: 0px auto;
    width: 60%;
}




@media (max-width: 767px){
    #contents.story{
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        width: 100%;
    }
    
    #contents.story h2{
        margin: 0px auto 20px;
        width: 50%;
    }
    
    #contents.story .block h3{
        margin: 0px auto 20px;
        padding: 0px 0px 10px 0px;
        width: 98%;
        border-bottom: dotted 1px #505050;
        text-align: center;
        line-height: 1.5em;
        font-weight: bold;
        font-size: 3.5vw;
    }
    
    #contents.story .block{
        margin: 0px 0px 40px 0px;
    }
    
    #contents.story .block .pic{
        margin: 0px auto;
        width: 90%;
    }
    
    
}




#contents.law{
    margin: 0px 0px 0px 0px;
    padding: 20px 0px 50px 0px;
}

#contents.law h2{
    margin: 0px 0px 40px 0px;
    text-align: center;
    font-size: 24px;
    font-weight: bold;
}

#contents.law .lawBox{
    margin: 0px auto;
    max-width: 800px;
}

#contents.law .lawBox dl{
    margin: 0px auto;
    width: 90%;
    display:flex;
}

#contents.law .lawBox dl dt{
    margin: 0px 0px 0px 0px;
    padding: 16px 10px 16px 10px;
    width: 40%;
    background-color: #f2f2f2;
    border-top: solid 1px #dddddd;
    font-size: 15px;
    line-height: 1.5em;
    
}

#contents.law .lawBox dl dd{
    margin: 0px 0px 0px 0px;
    padding: 16px 10px 16px 10px;
    width: 60%;
    border-top: solid 1px #dddddd;
    font-size: 15px;
}

#contents.law .lawBox dl dd p{
    margin: 0px 0px 20px 0px;
    line-height: 1.5em;
}


@media (max-width: 767px){
    #contents.law{

    }
    
    #contents.law .lawBox{

    }
    
    #contents.law .lawBox dl{
        margin: 0px auto 10px;
        width: 90%;
        display:block;
    }
    
    #contents.law .lawBox dl dt{
        width: 100%;
        background-color: #f2f2f2;
        border-top: solid 1px #dddddd;
        line-height: 1.5em;
        font-size: 3.5vw;
    }
    
    #contents.law .lawBox dl dd{
        width: 100%;
        border-top: solid 1px #dddddd;
        font-size: 3.6vw;
    }
    
    #contents.law .lawBox dl dd p{
        line-height: 1.5em;
    }
    
    
    
    
    
}






#contents.corporate{
    margin: 0px 0px 0px 0px;
    padding: 20px 0px 50px 0px;
}

#contents.corporate h2{
    margin: 0px 0px 40px 0px;
    text-align: center;
    font-size: 24px;
    font-weight: bold;
}

#contents.corporate .corporateBox{
    margin: 0px auto;
    max-width: 600px;
}

#contents.corporate .corporateBox dl{
    margin: 0px auto;
    width: 90%;
    display:flex;
}

#contents.corporate .corporateBox dl dt{
    margin: 0px 0px 0px 0px;
    padding: 16px 10px 16px 10px;
    width: 40%;
    background-color: #f2f2f2;
    border-top: solid 1px #dddddd;
    font-size: 15px;
    line-height: 1.5em;
}

#contents.corporate .corporateBox dl dd{
    margin: 0px 0px 0px 0px;
    padding: 16px 10px 16px 10px;
    width: 60%;
    border-top: solid 1px #dddddd;
    font-size: 15px;
}

#contents.corporate .corporateBox dl dd p{
    line-height: 1.5em;
}


@media (max-width: 767px){
    #contents.corporate{

    }
    
    #contents.corporate .corporateBox{

    }
    
    #contents.corporate .corporateBox dl{
        margin: 0px auto 10px;
        width: 90%;
        display:flex;
    }
    
    #contents.corporate .corporateBox dl dt{
        width: 40%;
        background-color: #f2f2f2;
        border-top: solid 1px #dddddd;
        line-height: 1.5em;
    }
    
    #contents.corporate .corporateBox dl dd{
        width: 60%;
        border-top: solid 1px #dddddd;
    }
    
    #contents.corporate .corporateBox dl dd p{
        line-height: 1.5em;
    }
    
   
}



#contents.news{
    margin: 0px auto;
    padding: 0px 0px 50px 0px;
    width: 96%;
}

#contents.news h1{
    margin: 0px 0px 40px 0px;
    padding: 20px 0px 0px 0px;
    text-align: left;
    font-size: 30px;
    font-weight: bold;
}


#contents.news h2{
    margin: 0px 0px 40px 0px;
    text-align: center;
    font-size: 24px;
    font-weight: bold;
}

#contents.news .bodyBox{
    margin: 0px auto;
    max-width: 600px;
    width: 98%;
}

#contents.news .bodyBox p{
    margin: 0px 0px 30px 0px;
    line-height: 1.5em;
}


#contents.news ul{
    margin: 0px auto;
    width: 96%;
    max-width: 600px;
}

#contents.news ul li{
    margin: 0px auto 30px;
    font-size: 18px;
    
}

#contents.news ul.memo li{
    margin: 0px 0px 10px 0px;
    font-size: 16px;
}


@media (max-width: 767px){
    #contents.news{
        margin: 0px auto;
        width: 96%;

    }
    
    #contents.news h1.news{
        margin: 0px 0px 20px 10px;
        padding: 0px 0px 0px 0px;
        text-align: left;
        font-size: 5vw;
        font-weight: bold;
    }
    
    
    #contents.news h2{
        margin: 0px 0px 40px 0px;
        text-align: left;
        font-size: 18px;
        font-weight: bold;
        line-height: 1.4em;
    }
    
    #contents.news h2 br{
        display:none;
    }
    
    
    #contents.news ul.memo li{
        font-size: 3.5vw;
    }
    
    
}



#contents.policy{
    margin: 0px 0px 0px 0px;
    padding: 20px 0px 50px 0px;
}

#contents.policy h2{
    margin: 0px 0px 40px 0px;
    text-align: center;
    font-size: 24px;
    font-weight: bold;
}

#contents.policy .txtBox{
    margin: 0px auto 30px;
    max-width: 600px;
}

#contents.policy .txtBox p{
    margin: 0px 0px 20px 0px;
}

#contents.policy p.right{
    margin: 0px auto 20px;
    max-width: 600px;
    text-align: right;
}

#contents.policy dl{
    margin: 0px auto 30px;
    max-width: 600px;
    width: 96%;
}

#contents.policy dl dt{
    margin: 0px 0px 10px 0px;
    max-width: 600px;
}

#contents.policy dl dd{
    line-height: 1.5em;
}

@media (max-width: 767px){
    #contents.policy{
        margin: 0px auto;
        width: 96%;
    }
    
    #contents.policy dl dd{
        font-size: 3.6vw;
    }
    
    
}





/* モーダル　*/
/*モーダルを開くボタン*/
.modal-open{
	/*position: fixed;
	display: flex;
    align-items: center;
    justify-content: center;
    top: 30%;
    right: 0%;*/
	width: 160px;
	font-weight: bold;
	color: #fff;
	background: #000;
	margin: 0px 10px 0px auto;
    padding: 20px 6px 20px 6px;
	cursor: pointer;
	/*transform: translate(-50%,-50%);*/
    line-height: 1.4em;
    font-size: 13px;
    border-radius: 40px;
    text-align: center;
}
/*モーダル本体の指定 + モーダル外側の背景の指定*/
.modal-container{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	
	padding: 40px 20px;
	overflow: auto;
	opacity: 0;
	visibility: hidden;
	transition: .3s;
    box-sizing: border-box;
}


@media (max-width: 767px){
    .modal-container{
        background: rgba(15,96,34,80%);
    }
    
}


/*モーダル本体の擬似要素の指定*/
.modal-container:before{
	content: "";
	display: inline-block;
	vertical-align: middle;
	height: 100%;
}
/*モーダル本体に「active」クラス付与した時のスタイル*/
.modal-container.active{
	opacity: 1;
	visibility: visible;
}
/*モーダル枠の指定*/
.modal-body{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	max-width: 700px;
	width: 90%;
}
/*モーダルを閉じるボタンの指定*/
.modal-close{
	position: absolute;
	display: flex;
    align-items: center;
    justify-content: center;
	top: -40px;
	right: -40px;
	width: 40px;
	height: 40px;
	font-size: 40px;
	color: #fff;
	cursor: pointer;
}
/*モーダル内のコンテンツの指定*/
.modal-content{
	background: #fff;
	text-align: left;
	padding: 30px;
    border: solid 80px rgba(15,96,34,80%);
}

.modal-content .p1{
    margin: 0px 0px 20px 0px;
    text-align: center;
    font-size: 24px;
    font-weight: bold;
}

.modal-content .p2{
    margin: 0px 0px 20px 0px;
    text-align: center;
    font-size: 16px;
}

.modal-content .p2 span{
    font-size: 16px;
}

.modal-content .p2 input{
    margin: 0px 4px 0px 4px;
    padding: 10px 18px 10px 18px;
    font-size: 24px;
    background-color: #fffccb;
    border: none;
    text-align: center;
}

.modal-content .submit{
    margin: 0px auto;
    width: 110px;
    text-align: center;
    font-size: 16px;
}



.weight-cal-day{
    margin: 0px auto 50px;
    padding: 10px 10px 10px 10px;
    max-width: 800px;
    display:flex;
    flex-direction: row-reverse;
    justify-content: center;
	align-items: center;
    background-color: #ffffff;
}




.wcdBox{
    margin: 0px 0px 0px 0px;
    width: 90%;
}





.wcdBox .ttl{
    margin: 0px 0px 10px 0px;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
}



.wcdBox .wbox{
    display:flex;
}

.wcdBox .wcbody{
    margin: 0px 0px 0px 0px;
    width: 50%;
    
}

.wcdBox .wcbody p{
    margin: 0px 0px 10px 0px;
    font-size: 16px;
    
}





/**/


.recipe .weight-cal-dayBox{
    display:block;
}

.make .weight-cal-dayBox{
    display:none;
}

.make .weight-cal-dayBox.on{
    display:block;
}




.m-fBox{
    margin: 0px auto 50px;
    padding: 0px 0px 20px 0px;
    max-width: 800px;
    flex-direction: row-reverse;
    justify-content: center;
	align-items: center;
    background: url("../img/recipe/bg-weight.png") no-repeat 130px 80px;
    background-size: 30% auto;
    background-color: #ffffff;
}




.m-fBox .tit{
    margin: 0px 0px 0px 0px;
    padding: 10px 0px 10px 0px;
    background-color: #0f6022;
    color: #ffffff;
    text-align: center;
    line-height: 1.5em;
}

.m-fBox .mfbody{
    margin: 0px 0px 0px 0px;
    padding: 50px 0px 50px 0px;
}



.m-fBox .arrow-w{
    margin: 0px auto;
    width: 40px;
}

.m-fBox .arrow-w img{
    width: 100%;
}


.weight-cal-dayBox .modal-open{
    margin: 0px 200px 36px auto;
    background-color: #0f6022;
    font-size: 16px;
    width: 200px;
}

.weight-cal-dayBox .modal-open:after{
    content:"▶️";
    color: #eb6100;
    font-size: 14px;
}


.weight-cal-dayBox .wcdBox{
    margin: 0px auto;
    padding: 30px 20px 10px 20px;
    width: 96%;
    background-color: #eaf0de;
    border-radius: 20px;
}

.m-fBox .ttl span{
    margin: 0px 4px 0px 4px;
    padding: 10px 10px 10px 10px;
    font-size: 18px;
    background-color: #ffffff;
}


.m-fBox table{
    width: 100%;
}

.m-fBox table th{
    margin: 0px 0px 0px 0px;
    padding: 10px 0px 10px 0px;
    text-align: center;
    font-weight: bold;
    border-bottom: dotted 1px #4a4c47;
    border-right: dotted 1px #4a4c47;
}

.m-fBox table td{
    margin: 0px 0px 0px 0px;
    padding: 20px 0px 20px 0px;
    text-align: center;
    font-weight: bold;
    border-bottom: dotted 1px #4a4c47;
    border-right: dotted 1px #4a4c47;
}

.m-fBox table td span{
    margin: 0px 4px 0px 4px;
    padding: 10px 10px 10px 10px;
    font-size: 18px;
    background-color: #ffffff;
}

.m-fBox table th.last,
.m-fBox table td.last{
    border-right:none;
}

.m-fBox table tr.ls td{
    border-bottom:none;
}

.m-fBox table tr.ls td img{
    width: 100px;
}



@media (max-width: 767px){
    
    
    
    .modal-content{
        padding: 8%;
        border: none;
    }
    
    
    
    
    .modal-content .p1{
        margin: 0px 0px 20px 0px;
        text-align: center;
        font-size: 5vw;
        font-weight: bold;
    }

    
    .modal-content .p2{
        margin: 0px 0px 20px 0px;
        text-align: center;
        font-size: 3vw;
    }
    
    .modal-content .p2 input{
        font-size: 6vw;
    }

    .modal-content .p2 span{
        font-size: 2.7vw;
    }
    
    .wcdBox .ttl{
        font-size: 4vw;
        line-height: 3em;
    }
    
    
    .wcdBox .wbox{
        display:block;
    }
    
    .wcdBox .wcbody{
        margin: 0px 0px 30px 0px;
        width: 100%;

    }
    
    .wcdBox .wcbody:last-child{
        margin: 0px 0px 0px 0px;
    }
    
    
    
    .m-fBox{
        margin: 0px auto 50px;
        padding: 0px 0px 20px 0px;
        width: 98%;
        flex-direction: row-reverse;
        justify-content: center;
        align-items: center;
        background: url("../img/recipe/bg-weight.png") no-repeat 10% 82px;
        background-size: 40% auto;
        background-color: #ffffff;
    }


    .m-fBox .tit{
        margin: 0px 0px 0px 0px;
        padding: 10px 0px 10px 0px;
        background-color: #0f6022;
        color: #ffffff;
        text-align: center;
        line-height: 1.5em;
    }
    
    .m-fBox .mfbody{
        margin: 0px 0px 0px 0px;
        padding: 8% 0px 5% 0px;
    }

    .weight-cal-dayBox .modal-open{
        margin: 0px 10px 45px auto;
        background-color: #0f6022;
        width: 50%;
        font-size: 3.8vw;
    }
    
    .m-fBox table{
        width: 100%;
    }
    
    .m-fBox table th{
        margin: 0px 0px 0px 0px;
        padding: 10px 0px 10px 0px;
        text-align: center;
        border-bottom: dotted 1px #4a4c47;
        border-right: dotted 1px #4a4c47;
    }
    
    .m-fBox table td{
        margin: 0px 0px 0px 0px;
        padding: 20px 0px 20px 0px;
        text-align: center;
        border-bottom: dotted 1px #4a4c47;
        border-right: dotted 1px #4a4c47;
    }
    
    .m-fBox table th.last,
    .m-fBox table td.last{
        border-right:none;
    }
    
    .m-fBox table tr.ls td{
        border-bottom:none;
    }
    
}





/* make */


#contents.make {
    margin: 0px auto 0px;
    padding: 0px 0px 0px 0px;
    max-width: 600px;
    
}

#contents.make h2{
    max-width: 240px;

}

#contents.make .txtBox.lead{
    margin: 0px auto 14px;
}

#contents.make .txtBox.lead p{
    text-align: center;
}

#contents.make .txtBox.lead p span{
    font-weight: bold;
}

#contents.make .txtBox.lead p.pic{
    margin: 0px auto 10px;
    max-width: 300px;
}




#contents.make .pointBox{
    margin: 0px 0px 30px 0px;
}

#contents.make .pointBox p{
    margin: 0px auto;
    width: 70%;
}

#contents.make .pointBox ul{
    margin: 0px auto;
    width: 80%;
}

#contents.make .pointBox ul li{
    margin: 0px 0px 16px 0px;
}



@media (max-width: 767px){
    
    
    #contents.make .pointBox ul{
        margin: 0px auto;
        width: 94%;
    }
    
}



#contents.make .makeNavi{
    margin: 0px auto 30px;
    max-width: 450px;
}

#contents.make .makeNavi p{
    margin: 0px auto 20px;
    width: 80%;
}

#contents.make .makeNavi ul{
}

#contents.make .makeNavi ul li{
    margin: 0px 0px 14px 0px;
}

@media (max-width: 767px){
    
    
    #contents.make .makeNavi{
        margin: 0px auto 30px;
        width: 96%;
    }
    
    #contents.make .makeNavi ul li{
        margin: 0px 0px 16px 0px;
    }
    
    
    
    
}






#contents.make .makeRecipeBox{
    margin: -56px 0px 50px 0px;
    padding: 56px 0px 0px 0px;
    
}


#contents.make .makeRecipeBox h2{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    max-width: 100%;
}




#contents.make .makeRecipeIn{
    margin: -18px 0px 0px 0px;
    padding: 0px 0px 30px 0px;
    width: 100%;
    border-left: solid 1px #0f6022;
    border-right: solid 1px #0f6022;
    border-bottom: solid 1px #0f6022;
    background-color: #ffffff;
}

#contents.make .makeRecipe{
    width: 100%;
}


#contents.make .makeRecipe .mbox{
    margin: 0px 2% 0px 2%;
    padding: 2% 0% 2% 0%;
    
    border-bottom: dotted 1px #478556;
}

#contents.make .makeRecipe .mbox ul{
    display:flex;
}

#contents.make .makeRecipe .mbox ul li{
    text-align: center;
    border-radius: 5px;
    line-height: 1.2em;
}

#contents.make .makeRecipe .mbox ul li:hover{
    cursor: pointer;
}

#contents.make .makeRecipe .mbox ul li.on{
    border: dotted 2px #006835;
}

#contents.make .makeRecipe .mbox.protein ul li{
    margin: 0px auto;
    padding: 8px 0px 8px 0px;
    width: 19%;
    border: solid 1px #f19ec2;
    color: #f19ec2;
    font-weight: bold;
}



#contents.make .makeRecipe .mbox.protein ul li.on{
    background-color: #db77ac;
    color: #ffffff;
}

#contents.make .makeRecipe .mbox.vegetable ul li{
    margin: 0px auto;
    padding: 8px 0px 8px 0px;
    width: 48%;
    border: solid 1px #39b576;
    color: #39b576;
    font-weight: bold;
}

#contents.make .makeRecipe .mbox.vegetable ul li.on{
    background-color: #39b576;
    color: #ffffff;
}

#contents.make .makeRecipe .mbox.carbohydrate ul li{
    margin: 0px auto;
    padding: 8px 0px 8px 0px;
    width: 31%;
    border: solid 1px #a0835c;
    color: #a0835c;
    font-weight: bold;
}

#contents.make .makeRecipe .mbox.carbohydrate ul li.on{
    background-color: #a0835c;
    color: #ffffff;
}

#contents.make .makeRecipe .mbox.carbohydrate{
    border:none;
}



#contents.make .makeRecipe h3{
    margin: 0px 0px 10px 0px;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
}

#contents.make .makeRecipe .protein h3:before {
    content: "■";
    color: #db77ac;
}

#contents.make .makeRecipe .vegetable h3:before {
    content: "■";
    color: #39b576;
}

#contents.make .makeRecipe .carbohydrate h3:before {
    content: "■";
    color: #a0835c;
}



#contents.make .makeRecipeBox .btnRecipe a{
    margin: 0px auto;
    padding: 30px 0px 30px 0px;
    width: 200px;
    display:block;
    background-color: #ff7b43;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    border-radius: 6px;
    font-weight: bold;
}






@media (max-width: 767px){
    
    
    #contents.make .makeRecipeBox{
        margin: -56px auto 50px;
        padding: 56px 0px 0px 0px;
        display:block;
        width: 98%;
    }
    
    #contents.make .makeRecipe{
        width: 100%;
    }
    
    #contents.make .makeRecipe h3{
        font-size: 3.8vw;
    }
    
    #contents.make .makeRecipe .mbox{
        margin: 0px 1% 0px 1%;
        padding: 4% 0px 4% 0px;
        background-color: #ffffff;
    }

    #contents.make .makeRecipe .mbox ul{
        display:flex;
    }
    
    #contents.make .makeRecipe .mbox ul li{
        text-align: center;
        font-size: 3.8vw;
    }
    
    #contents.make .makeRecipe .mbox ul li.on{
    }
    
    #contents.make .makeRecipe .mbox.protein ul li{
        width: 24%;
    }
    
    #contents.make .makeRecipe .mbox.vegetable ul li{
        width: 48%;
    }
    
    #contents.make .makeRecipe .mbox.carbohydrate ul li{
        width: 31%;
    }
    
    #contents.make .makeRecipe .mbox.protein ul.s2{
        flex-wrap: wrap;
        justify-content:space-between;
    }

    #contents.make .makeRecipe .mbox.protein ul.s2::after{
      margin: 0px 0.5%;
      content:"";
      display: block;
      width:32%;
    }

    #contents.make .makeRecipe .mbox.protein ul.s2 li{
        margin:0px 0.5% 4px;
        width: 32%;
    }
    
    
    
}







#contents.make .choiceBox{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    display:flex;
    justify-content: center;
    align-items: center;
}

#contents.make .choiceBox .dishBox{
    margin: 0px auto;
    position: relative;
    width: 58%;
}

#contents.make .choiceBox .dishBox .dish{
    width: 100%;
}

#contents.make .choiceBox .dishBox .protein,
#contents.make .choiceBox .dishBox .vegetable,
#contents.make .choiceBox .dishBox .carbohydrate,
#contents.make .choiceBox .dishBox .picA{
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
}


#contents.make .choiceBox .rawbox{
    margin: 0px auto;
    width: 38%;
}

#contents.make .choiceBox .rawbox .rawIn{
    margin: 0px 0px 10px 0px;
    padding: 1% 1% 3% 1%;
    border: solid 2px #cdcdcd;
}

#contents.make .choiceBox .rawbox h3{
    margin: -3% 0px 10px 0px;
    text-align: center;
}

#contents.make .choiceBox .rawbox h3 span{
    padding: 3px 10% 3px 10%;
    background-color: #ffffff;
}

#contents.make .choiceBox .rawbox .boxin{
    margin: 0px 0px 0px 0px;
    display:flex;
}

#contents.make .choiceBox .pic{
    height: 80px;
}

#contents.make .choiceBox .protein_img{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 33%;
}


#contents.make .choiceBox .rawbox .txt{
    font-size: 13px;
    line-height: 1.2em;
}

#contents.make .rawP .txtp{
    font-size: 13px;
    line-height: 1.2em;
}



#contents.make .choiceBox .protein_img .txt{
    text-align: center;
}


#contents.make .choiceBox .vegetable_img{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 33%;
}

#contents.make .choiceBox .carbohydrate_img{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 33%;
}


#contents.make .rawP{
    margin: 0px auto 30px;
    width: 88%;
    display:flex;
    justify-content: center;
    align-items: center;
}

#contents.make .rawP ul{
    margin: 0px 0px 0px 0px;
    width: 70%;
    display:flex;
    
    
}

#contents.make .rawP .txtp{
    width: 30%;
}

#contents.make .rawP .txtp .vegetable{
    font-size: 0.9em;
}

#contents.make .rawP ul li{
    width: 33%;
}





@media (max-width: 767px){
    
    #contents.make .choiceBox{
        width: 100%;
    }
    
    #contents.make .choiceBox .rawbox h3{
        margin: -3% 0px 10px 0px;
        text-align: center;
        font-size: 3.8vw;
        font-weight: bold;
    }
    
    
    
    #contents.make .choiceBox .pic{
        height: 55px;
    }
    
    #contents.make .choiceBox .rawbox .txt{
        font-size: 3.5vw;
        line-height: 1.2em;
    }
    
    
}






#contents.make .dogbreed{
    margin: -56px 0px 20px 0px;
    padding: 56px 0px 0px 0px;
    width: 100%;
}

#contents.make .dogbreed .dogbreedIn{
    margin: -23px 0px 0px 0px;
    padding: 0px 0px 30px 0px;
    background-color: #ffffff;
    border-left: solid 1px #0f6022;
    border-right: solid 1px #0f6022;
    border-bottom: solid 1px #0f6022;
}

#contents.make .dogbreed h2{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    max-width: 100%;
    font-weight: bold;
}

#contents.make .dogbreed .txt{
    margin: 0px 0px 14px 0px;
    padding: 68px 0px 50px 0px;
    text-align: center;
    background: url("../img/make/bg-step02.png") no-repeat center center;
    background-size: 50px auto;
}

#contents.make .dogbreed h3{
    margin: 0px 0px 10px 0px;
    font-size: 16px;
    font-weight: bold;
}


#contents.make .dogbreed .db01{
    margin: 0px 0px 20px 0px;
    padding: 0% 5% 0% 5%;
    background-color: #ffffff;
}

#contents.make .dogbreed .db01 .dbin{
    margin: 0px 0px 20px 0px;
    display:flex;
}



#contents.make .dogbreed .db01 .dbin h3{
    width: 20%;
}

#contents.make .dogbreed .db01 .dbin.db03 h3{
    width: 30%;
}

#contents.make .dogbreed .db01 .dbin.db04 h3{
    width: 30%;
}

#contents.make .dogbreed .db01 .dbin .dbr{
    width: 80%;
}

#contents.make .dogbreed .db01 .dbin .dbr input.dogname{
    padding: 8px 8px 8px 8px;
    width: 100%;
    font-size: 16px;
}

#contents.make .dogbreed .db01 .dbin .dbr select.select_search2{
    padding:2%;
    width: 100%;
    font-size: 16px;
}


#contents.make .dogbreed .db01 .dbin .weight input{
    padding: 8px 8px 8px 8px;
    font-size: 16px;
}


#contents.make .dogbreed .db01 .upload{
    margin: 0px 0px 0px 0px;
}

#contents.make .dogbreed .db01 .weight{
    margin: 0px 0px 0px 0px;
}



#contents.make .dogbreed .submit input{
    margin: 0px auto;
    padding: 30px 0px 30px 0px;
    width: 200px;
    display: block;
    background-color: #ff7b43;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    border-radius: 6px;
    border: none;
    font-weight: bold;
    font-size: 16px;
}


#contents.make .dogbreed .submit input:hover{
    cursor: pointer;
}


#contents.make .dogbreed .pmemo{
    
    margin: 0px auto;
    padding: 20px 10px 0px 10px;
    max-width: 800px;
    font-size: 12px;
    line-height: 1.2em;
    
}



@media (max-width: 767px){
    
   #contents.make .dogbreed{
        margin: -56px auto 0px;
        padding: 56px 0px 20px 0px;
        width: 98%;
    } 
    
    #contents.make .dogbreed .db01 .dbin{
        margin: 0px 0px 30px 0px;
        display:block;
    }

    #contents.make .dogbreed .db01 .dbin h3{
        width: 100%;
    }
    
    #contents.make .dogbreed .db01 .dbin.db03 h3{
        width: 100%;
    }

    #contents.make .dogbreed .db01 .dbin.db04 h3{
        width: 100%;
    }

    #contents.make .dogbreed .db01 .dbin .dbr{
        width: 100%;
    }
    
    #contents.make .dogbreed .pmemo{
        margin: 0px auto;
        padding: 20px 0px 0px 0px;
        width: 94%;
        font-size: 3vw;
        line-height: 1.2em;
    }
    
    
    #contents.make .dogbreed .dogbreedIn{
        margin: -12px 0px 0px 0px;
        
    }
    
    
    
}


#contents.make .madefor{
    margin: -56px auto 0px;
    padding: 56px 0px 0px 0px;
    width: 98%;
    display:none;
    
}

#contents.make .madefor.on{
    display:block;
}

#contents.make .madefor h2{
    margin: 0px 0px 0px 0px;
    width: 100%;
    max-width: 100%;
}

#contents.make .madefor .madeforIn{
    margin: -3% 0px 0px 0px;
    padding: 0px 0px 12% 0px;
    width: 100%;
    border-left: solid 6px #0f6022;
    border-right: solid 6px #0f6022;
    border-bottom: solid 6px #0f6022;
    background-color: rgba(255,252,194,0.45);
    
}




#contents.make .madefor .madeforIn .picbox{
    margin: 0px auto 0px;
    padding: 20px 0px 0px 0px;
    width: 80%;
    position: relative;
    
}

#contents.make .madefor .madeforIn .picbox .rname{
    position: absolute;
    left:30%;
    top: 33%;
    width: 40%;
}


#contents.make .madefor .madeforIn .nutrient{
    margin: -66px auto 50px;
    padding: 0px 10px 10px 10px;
    width: 100%;
}

#contents.make .madefor .madeforIn .nutrient h2{
    margin: 0px 0px 20px 0px;
    padding: 80px 0px 60px 0px;
    text-align: center;
    font-weight: bold;
    
}

#contents.make .madefor .madeforIn .nutrient .txtBox{
    margin: 0px 0px 0px 0px;
}

#contents.make .madefor .madeforIn .nutrient .txtBox .dbox{
    margin: 0px 0px 30px 0px;
}

#contents.make .madefor .madeforIn .nutrient .txtBox .dbox .box{
    margin: 0px 0px 12px 0px;
}

#contents.make .madefor .madeforIn .nutrient .txtBox .dbox .dtxt{
    padding: 5px 5px 5px 5px;
}

#contents.make .madefor .madeforIn .nutrient .txtBox .dbox.p .dtxt{
    background-color: rgba(238,196,218,0.59);
}

#contents.make .madefor .madeforIn .nutrient .txtBox .dbox.v .dtxt{
    background-color: rgba(200,220,205,0.59);
}

#contents.make .madefor .madeforIn .nutrient .txtBox .dbox.c .dtxt{
    background-color: rgba(204,194,180,0.59);
}

#contents.make .madefor .madeforIn .nutrient .txtBox .dbox .dtxt p{
    font-size: 13px;
}

#contents.make .madefor .madeforIn .nutrient .txtBox .dbox .dtxt p span{
    font-weight: bold;
}

#contents.make .madefor .madeforIn .nutrient .txtBox div.box{
    margin: 0px 0px 0px 0px;
    display:flex;
    justify-content: center;
    align-items: center;
}

#contents.make .madefor .madeforIn .nutrient .txtBox div dl dd{
    margin: 0px auto;
    width: 96%;
}
/*
#contents.make .madefor .madeforIn .nutrient .txtBox div.p dl dd{
   border-bottom: solid 3px #e5a9c8; 
}


#contents.make .madefor .madeforIn .nutrient .txtBox div.v dl dd{
   border-bottom: solid 3px #73c7a5; 
}

#contents.make .madefor .madeforIn .nutrient .txtBox div.c dl dd{
   border-bottom: solid 3px #c2b099; 
}*/

#contents.make .madefor .madeforIn .nutrient .txtBox div dl dd p{
    margin: 0px 0px 10px 0px;
    padding: 0px 10px 0px 10px;
}


#contents.make .madefor .madeforIn .nutrient .txtBox div p.pic{
    margin: 0px 0px 0px 0px;
    padding: 10px 10px 10px 10px;
    width: 30%;
    background-color: #efefef;
}

#contents.make .madefor .madeforIn .nutrient .txtBox div dl{
    width: 70%;
}

#contents.make .madefor .madeforIn .nutrient .txtBox div dl dt{
    display:none;
}

#contents.make .madefor .madeforIn .nutrient .txtBox .point{
   margin: 0px 0px 0px 0px;
    padding: 14px 14px 14px 14px;
    background-color: #efefef; 
}

#contents.make .madefor .madeforIn .nutrient .txtBox .point .tit{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 24px;
    background: url("/resource/img/common/arrow_point.png") no-repeat left center;
    background-size: 20px auto;
    font-weight: bold;
}

#contents.make .madefor .madeforIn .nutrient .txtBox .point .txt{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    
    
}

#contents.make .madefor .madeforIn .nutrient .txtBox .point .txt p{
    font-size: 16px;
    font-weight: bold;
    line-height: 1.4em;
}



#contents.make .madefor .madeforIn .nutrient dl{
    margin: 0px 0px 20px 0px;
}

#contents.make .madefor .madeforIn .nutrient dl:last-child{
    margin: 0px 0px 0px 0px;
}

#contents.make .madefor .madeforIn .nutrient dl dt{
    margin: 0px 0px 10px 0px;
}

#contents.make .madefor .madeforIn .nutrient dl dd p{
    margin: 0px 0px 5px 0px;
    font-size: 13px;
}



#contents.make .madefor .madeforIn .movieBox{
    margin: 0px auto;
    width: 40%;
}

#contents.make .madefor .madeforIn .movieBox h3{
    margin: 0px 0px 20px 0px;
    padding: 10px 0px 10px 0px;
    text-align: center;
    border: dotted 1px #0f6022;
    border-radius: 20px;
    color: #0f6022;
}

#contents.make .madefor .madeforIn .movieBox video{
    margin: 0px 0px 15px 0px;
    width: 100%;
}

#contents.make .madefor .madeforIn .movieBox .txt{
    margin: 0px 0px 0px 0px;
    text-align: center;
    line-height: 1.4em;
    font-size: 14px;
    font-weight: normal!important;
}


#contents.make .btmRecipe{
    margin: -1% auto 10px;
    max-width: 8%;
    display:none;
}

#contents.make .btmRecipe.on{
    display:block;
}


@media (max-width: 767px){
    
    
    #contents.make .madefor .madeforIn{
        margin: -3% 0px 0px 0px;
        padding: 0px 0px 14% 0px;
        width: 100%;
        border-left: solid 4px #0f6022;
        border-right: solid 4px #0f6022;
        border-bottom: solid 4px #0f6022;
        background-color: rgba(255,252,194,0.45);
    }  
    
    
    #contents.make .madefor .madeforIn .movieBox{
        margin: 0px auto;
        width: 80%;
    }
    
    #contents.make .madefor .madeforIn .nutrient{
        margin: -66px auto 30px;
        padding: 0px 10px 10px 10px;
        width: 100%;
        
    }
    
    
    #contents.make .madefor .madeforIn .nutrient h2{
        margin: 0px 0px 20px 0px;
        padding: 70px 0px 36px 0px;
        text-align: center;
        font-weight: bold;
        
    }
    
    #contents.make .madefor .madeforIn .nutrient .txtBox{
        margin: 0px 0px 0px 0px;
        width: 100%;
    }
    
    #contents.make .madefor .madeforIn .nutrient .txtBox div dl dd p{
        margin: 0px 0px 5px 0px;
        font-size: 3vw;
    }
    
    
    

    #contents.make .btmRecipe{
        margin: -1.1% auto 10px;
        max-width: 8%;

    }
    
}



#contents.make .dogConsul{
    margin: 0px auto 30px;
    padding: 0px 0px 0px 0px;
    width: 98%;
    background: url("../img/make/dogbg.png") no-repeat center top;
    background-size: 70% auto;
}

#contents.make .dogConsul .dogPic{
    margin: 0px auto;
    padding: 50px 10px 0px 10px;
    
}

#contents.make .dogConsul .dogPic p.pic{
    margin: 0px auto;
    
    max-height: 240px;
    text-align: center;
}

#contents.make .dogConsul .dogPic p.pic img{
    height: 240px;
}

#contents.make .dogConsul .dogPic p.name{
    text-align: center;
}

#contents.make .dogConsul .dogPic p.weight{
    text-align: center;
}


#contents.make .dogConsul .dog em{
    font-size: 13px;
}

#contents.make .dogConsul .dogname{
    margin: 0px auto 20px;
    padding: 0px 0px 0px 0px;
    width: 55%;
    text-align: center;
    font-size: 30px;
    font-weight: bold;
}

#contents.make .dogConsul .dogname .name{
    margin: 0px 0px 0px 0px;
    
}

#contents.make .dogConsul .dogname.line{
    line-height: 36px;
}

#contents.make .dogConsul .dogname.line2{
    margin-top: -20px;
    line-height: 1.1em;
}



#contents.make .dogConsul .caltxt{
    margin: 0px 0px 20px 0px;
    text-align: center;
    line-height: 2.8em;
}

#contents.make .dogConsul .caltxt span{
    margin: 0px 10px 0px 10px;
    padding: 10px 20px 10px 20px;
    font-size: 26px;
    font-weight: bold;
    background-color: #fffcc2;
}


#contents.make .dogConsul .dogDetail{
    margin: 0px 0px 0px 0px;
    padding: 20px 0px 0px 0px;
    background-color: #ffffff;
    
}

#contents.make .dogConsul .dogDetail h3{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 10px 0px;
    font-weight: bold;
    font-size: 18px;
    text-align: center;
    border-bottom: dotted 1px #7cde97;
    border-image: linear-gradient(to right, #7cde97 0%,#7cde97 48%,#d7b1da 52%, #d7b1da 100%);
    border-image-slice: 1;
    line-height: 1.4em;
}

#contents.make .dogConsul .dogDetail .txt{
    margin: 0px 0px 0px 0px;
    padding: 20px 20px 20px 20px;
    background: url("../img/make/bg-detail.png") repeat left top;
    background-size: 22px auto;
}

#contents.make .dogConsul .dogDetail .txt p{
    margin: 0px 0px 20px 0px;
    line-height: 1.7em;
    font-weight: normal;
    font-size: 14px;
    font-family: sans-serif!important;
    
}

#contents.make .dogConsul .dogDetail .txt p span{
    font-weight: bold;
}

#contents.make .dogConsul .dogDetail .txt p.memo{
    padding: 20px 20px 20px 20px;
    background-color: rgba(255,252,194,0.8);
}


@media (max-width: 767px){
    
    #contents.make .dogConsul{
        margin: 0px auto 30px;
        padding: 0px 0px 0px 0px;
        width: 98%;
        background: url("../img/make/dogbg.png") no-repeat center top;
        background-size: 100% auto;
    }
    
    
    #contents.make .dogConsul .dogPic{
        margin: 0px auto;
        padding: 10px;
        width: 100%;  
        height: auto;
        display:block;
    }
    
    #contents.make .dogConsul .dogPic p.pic{
        margin: 0px auto 8%;
        max-height: 240px;
        text-align: center;
    }
    
    #contents.make .dogConsul .dogPic p.pic img{
        height:240px;
    }
    
    #contents.make .dogConsul .dogPic .dog{
        width: 100%;
    }
    
    
    
    #contents.make .dogConsul .dogname{
        margin: 0px auto 20px;
        padding: 0px 0px 0px 0px;
        width: 85%;
        text-align: center;
        font-size: 30px;
        font-weight: bold;
        
    }

    #contents.make .dogConsul .dogname .name{
        margin: 0px 0px 0px 0px;

    }
    
    
    
    #contents.make .dogConsul .cal{
        margin: 0px 0px 20px 0px;
    }
    
    
    #contents.make .dogConsul .dogDetail .txt{
        
    }
    
    #contents.make .dogConsul .dogDetail .txt p{
        font-size: 3.4vw;
        
    }
    
    
    
}





#contents.make .dogRecipe{
    margin: 0px 0px 30px 0px;
    padding: 4px 0px 30px 0px;
    width: 100%;
    border-left: solid 1px #0f6022;
    border-right: solid 1px #0f6022;
    border-bottom: solid 1px #0f6022;
    background-color: #ffffff;
    
    display:none;
    
}



#contents.make .dogRecipe h2{
    margin: 0px auto 20px;
    width: 70%;
    max-width: 70%;
}

#contents.make .dogRecipe h2 img{
    width: 100%;
    max-width: 100%;
}


#contents.make .dogRecipe.on{
    display:block;
}

#contents.make .dogRecipe .boxin{
    margin: 0px auto 24px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    position: relative;
}


#contents.make .dogRecipe .boxin .bg{
    margin: 0px;
    padding: 0px;
    position: relative;
    z-index: 1;
}





#contents.make .dogRecipe .boxin .txtBox{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    max-width: 100%;
    display:flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 6%;
    z-index: 2;
}

#contents.make .dogRecipe .boxin .txtBox.line2{
    top: 8%;
}

#contents.make .dogRecipe .boxin .txtBox p.recipename{
    margin: 22px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 28%;
    color: #fff45c;
    font-size: 40px;
    font-weight: bold;
    font-family: Arial, Helvetica, "sans-serif";
    text-align: right;
    
}

#contents.make .dogRecipe .boxin .txtBox.line2 p.recipename{
     margin-top: 10px;   
}

#contents.make .dogRecipe .boxin .txtBox p.txt{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 20px;
    width: 53%;
    color: #ffffff;
    line-height: 1.4em;
    
}

#contents.make .dogRecipe .boxin .txtBox.line2 p.txt{
    line-height: 1.8em;
}



#contents.make .dogRecipe .boxin .txtBox p.txt span{
    font-size: 34px;
}



#contents.make .dogRecipe .picA{
    margin: 0px auto;
    width: 48%;
    position: absolute;
    left: 3%;
    top: 27%;
    z-index:3;
}

#contents.make .dogRecipe .dogPic{
    margin: 0px auto;
    padding: 8px 0px 0px 0px;
    position: absolute;
    width: 44%;
    right: 5%;
    top: 28%;
    z-index:3;
    background-color: #ffffff;
    border-radius: 10px;
}

#contents.make .dogRecipe .dogPic .name{
    margin: 0px 0px 1px 0px;
    color: #0f6022;
    font-size: 20px;
    text-align: center;
    font-weight: bold;
}

#contents.make .dogRecipe .dogPic .weight{
    margin: 0px 0px 8px 0px;
    color: #0f6022;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
}

#contents.make .dogRecipe .dogPic .cal{
    margin: 0px 0px 0px 0px;
    padding: 5px 0px 5px 0px;
    color: #0f6022;
    font-size: 13px;
    font-weight: bold;
    text-align: center;
    line-height: 1.6em;
    background-color: #fff799;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

#contents.make .dogRecipe .dogPic .cal span{
    font-size: 25px;
}


#contents.make .dogRecipe .dogPic p.pic{
    margin: 0px auto 4px;
    padding: 3px 10px 3px 10px;    
    text-align: center;
}

#contents.make .dogRecipe .dogPic p.pic img{
    height: 150px;
}

#contents.make .dogRecipe .dogPic p.pic2{
    margin: 0px auto 4px;
    padding: 3px 10px 3px 10px;  
    text-align: center;
    
}

#contents.make .dogRecipe .dogPic p.pic2 img{
    height: 150px;
    
}




#contents.make .dogRecipe .pbox{
    margin: -30% auto 0px;
    padding: 0px 0px 0px 0px;
    width: 64%;
    display:flex;
    position: absolute;
    bottom: 0.5%;
    left: 22%;
    z-index:4;
}

#contents.make .dogRecipe .pbox p{
    width: 31%;
}


#contents.make .dogRecipe .picss{
    margin: 0px auto 20px;
    width: 90%;
}


#contents.make .dogRecipe .btnss{
    margin: 0px auto;
    padding: 0px 0px 0px 0px;
    width: 400px;
}

#contents.make .dogRecipe .btnss input{
    margin: 0px 0px 0px 0px;
    width: 400px;
    height: 50px;
    border:none;
    background: url("../img/make/btn-ss.png") no-repeat left top;
    background-size: 100% auto;
}








@media (max-width: 767px){
    
    
    #contents.make .dogRecipe .dogPic{
        padding: 3px 0px 0px 0px;
    }
    
    #contents.make .dogRecipe .dogPic .name{
        font-size: 3vw;
    }
    
    
    
    #contents.make .dogRecipe .dogPic .weight{
        margin: 0px 0px 4px 0px;
        font-size: 3vw;
    }
    
    #contents.make .dogRecipe .dogPic .cal{
        padding: 0px 0px 0px 0px;
        font-size: 2.2vw;
        line-height: 2.2em;
    }
    
    
    #contents.make .dogRecipe .boxin .txtBox p.txt span{
        font-size: 6vw;
    }
    
    #contents.make .dogRecipe .boxin .txtBox p.recipename{
        font-size: 8vw;
    }
    
    
    #contents.make .dogRecipe .dogPic p.pic{
        margin: 0px auto 4px;
        padding: 1% 1% 1% 1%;
       
        text-align: center;
        
    }
    
    #contents.make .dogRecipe .dogPic p.pic2{
        margin: 0px auto 4px;
        padding: 1% 1% 1% 1%;
        
        text-align: center;
        
    }
    
    #contents.make.recipe .picA .pic{
        width: 100%;
    }




    #contents.make .dogRecipe .dogPic p.pic img{
        height: 100px;
    }
    
    #contents.make .dogRecipe .dogPic p.pic2 img{
        height: 100px;
    }
    
    #contents.make .dogRecipe .dogPic.line2 p.pic img{
        height: 90px;
    }
    
    #contents.make .dogRecipe .dogPic.line2 p.pic2 img{
        height: 90px;
    }
    
    #contents.make .dogRecipe .boxin .txtBox{
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        top: 4%;
    }
    
    #contents.make .dogRecipe .boxin .txtBox.line2 p.recipename{
         margin-top: 5px;   
    }
    
    #contents.make .dogRecipe .boxin .txtBox.line2 p.txt{
        line-height: 1.4em;
    }
    
    
    #contents.make .dogRecipe .btnss{
        margin: 0px auto;
        padding: 0px 0px 0px 0px;
        width: 80%;
    }
    
    #contents.make .dogRecipe .btnss input{
        margin: 0px 0px 0px 0px;
        width: 100%;
        
    }
    
    
}

#contents.make .dogRecipe .dogPic .calB{
    padding: 3px 10px 3px 10px;
    background-color: #fff799;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

#contents.make .dogRecipe .dogPic .calB .weight{
    margin: 0px 0px 0px 0px;
    
    text-align: left;
}

#contents.make .dogRecipe .dogPic .calB .cal{
    margin: 0px 0px 0px 0px;
    text-align: left;
}




@media (max-width: 767px){
    
    
    
    #contents.make .dogRecipe .dogPic .calB .cal span{
        font-size: 4.2vw;
    }
    
}



#contents.make .m-fBox{
    padding: 20px 20px 20px 20px;    
}

#contents.make .priceBox{
    margin: 0px auto 50px;
    padding: 0px 0px 7px 0px;
    max-width: 500px;
    border: solid 1px #969696;
    border-radius: 10px;
    background-color:#ffffff;
}

#contents.make .priceBox dl{
    margin: 0px 0px 0px 0px;
    padding: 5px 0px 5px 0px;
    display:flex;
    justify-content: center;
    align-items: center;
    border-bottom: solid 1px #969696;
}

#contents.make .priceBox dl:last-child{
    margin-bottom: 0px;
    padding: 5px 0px 0px 0px;
    border-bottom: none;
}

#contents.make .priceBox dl dt{
    padding: 30px 0px 0px 0px;
    width: 57%;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    line-height: 1.5em;
}


#contents.make .priceBox dl dt span{
    padding: 0px 3px 0px 3px;
    font-size: 42px;
}

#contents.make .priceBox dl dd{
    width: 40%;
}

#contents.make .priceBox dl dd .buttonbuy{
    margin: 0px 0px 2px 0px;
}

#contents.make .priceBox dl dd .buttonbuy a{
    padding: 15px 10px 15px 10px;
    color: #ffffff;
    background-color: #eb6100;
    text-decoration: none;
    text-align: center;
    border-radius: 10px;
    display:block;
}

#contents.make .priceBox dl#price15 dd .buttonbuy a{
    background-color: #8fc31f;
}


#contents.make .topContents{
    background:none;
}

#contents.make .topContents.dogRecommend h2{
    margin: 0px auto 20px;
    padding: 10px 0px 10px 0px;
    max-width: 600px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    background-color: #006835;
    color: #ffffff;
}


#contents.make .topContents.dogRecommend{
    display:none;
}

#contents.make .topContents.dogRecommend.on{
    display:block;
}

#contents.make .topContents.dogRecommend .dogPic{
    margin: 0px auto;
    
}

#contents.make .topContents.dogRecommend .dogPic .pic{
    text-align: center;
}

#contents.make .topContents.dogRecommend .dogPic img{
    height: 200px;
    
}


#contents.make .topContents.dogRecommend h2{
    margin: -46px auto 20px;
    padding: 50px 20px 10px 20px;
    width: 90%;
    border-radius: 20px;
}





#contents .sourceBox{
    display:none;
}

#contents .sourceBox.on{
    display:block;
}

#contents .sourceBox h2{
    margin: 0px auto 20px;
    padding: 10px 0px 10px 0px;
    max-width: 600px;
    text-align: center;
    font-size: 22px;
    font-weight: bold;
    background-color: #006835;
    color: #ffffff;
    border-radius: 20px;
    line-height: 1.5em;
}

#contents .sourceBox h2 span{
    color: #fff45c;
}



#contents .sourceBox #recommendBox h2{
    display:none;
}

#contents .sourceBox .txtBox{
    margin: 0px auto;
}

#contents .sourceBox .txtBox p{
    margin: 0px auto;
    font-size: 12px;
    position: relative;
    max-height: 100px; /* 開く前に見せたい高さを指定 */
    overflow: hidden;
    transition: max-height 1s;
}

#contents .sourceBox .txtBox p::after {
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 34px;
    background: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 0, hsla(0, 0%, 100%, .9) 50%, hsla(0, 0%, 100%, .9) 0, #fff);
    content: '';
}


#contents .sourceBox ul li .title{
    height: 40px;
}




#contents.make .sRecipe .combination{
    margin: 0px auto 10px;
    max-width: 500px;
}

#contents.make .sRecipe .combination h3{
    margin: 0px 0px 4px 0px;
    font-size: 14px;
}

#contents.make .sRecipe .combination .c01{
    margin: 0px 0px 4px 0px;
    font-size: 14px;
}


@media (max-width: 767px){
    
    
    #contents.make{
        margin: 0px auto 0px;
        padding: 0px 0px 0px 0px;
        width: 100%;
    }
    
    
    #contents.make h2{
            width: 60%;

    }
    
    

    
    #contents.make .choiceBox{
        width: 100%;
    }
    
    
    
    
    
    
    
    
    
    
    #contents.make .priceBox{
        margin: 0px auto 50px;
        padding: 0px 0px 20px 0px;
        width: 90%;
        border: solid 1px #969696;
        border-radius: 10px;
        background-color:#ffffff;
    }
    
    #contents.make .priceBox dl{
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 15px 0px;
        display:flex;
        border-bottom: solid 1px #969696;
    }
    
    #contents.make .priceBox dl:last-child{
        margin-bottom: 0px;
        padding: 0px 0px 0px 0px;
        border-bottom: none;
    }
    
    #contents.make .priceBox dl dt{
        padding: 22px 0px 0px 0px;
        width: 57%;
        text-align: center;
        font-size: 4vw;
        font-weight: bold;
    }
    
    
    #contents.make .priceBox dl dt span{
        padding: 0px 3px 0px 3px;
        font-size: 9vw;
    }
    
    #contents.make .priceBox dl dd{
        padding: 8px 0px 0px 0px;
        width: 40%;
    }
    
    
    #contents.make .topContents.dogRecommend .dogPic{
        margin: 0px auto;
        
    }
    
    #contents.make .topContents.dogRecommend .dogPic p.pic{
        text-align: center;
        
    }
    
    #contents.make .topContents.dogRecommend .dogPic img{
        height: 140px;
    }
    
    #contents.make .topContents.dogRecommend h2{
        margin: -46px auto 20px;
        padding: 50px 20px 10px 20px;
        width: 90%;
        border-radius: 20px;
    }

    
    #contents .sourceBox h2{
        margin: 0px auto 20px;
        padding: 10px 0px 10px 0px;
        width: 90%;
        font-size: 4vw;
        
    }
    
    
    
    
    
}







#contents.make .buyRecipe{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    display:none;
    
}

#contents.make .buyRecipe.on{
    display:block;
}

#contents.make .buyRecipe h2{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    max-width: 100%;
}

#contents.make .buyRecipe .boxIn{
    margin: -30px 0px 0px 0px;
    padding: 30px 0px 30px 0px;
    border-left: solid 1px #0f6022;
    border-right: solid 1px #0f6022;
    background-color: #ffffff;
}


#contents.make .buyRecipe .no{
    margin: 0px 0px 20px 0px;
    text-align: center;
    font-weight: bold;
}

#contents.make .buyRecipe .no span{
    font-size: 30px;
}

#contents.make .buyRecipe .cal{
    margin: 0px 0px 20px 0px;
    text-align: center;
}

#contents.make .buyRecipe .cal span{
    margin: 0px 0px 0px 0px;
    padding: 10px 10px 10px 10px;
    border: solid 1px #999999;
}


#contents.make .buyRecipe .rpic{
    margin: 0px auto 20px;
    max-width: 300px;
}


#contents.make .buyRecipe .pbox{
    margin: 0px auto 20px;
    padding: 10px 0px 30px 0px;
    width: 94%;
    display:flex;
    background-color: #e6e6e6;
    border-radius: 10px;
}

#contents.make .buyRecipe .pbox div{
    margin: 0px auto;
    width: 33%;
    
}

#contents.make .buyRecipe .pbox div p{
    margin: 0px auto;
    width: 80%;
}

#contents.make .buyRecipe .pbox div dt{
    text-align: center;
}


#contents.make .buyRecipe .pbox div dd{
    display:none;
}


#contents.make .buyRecipe .dogBox{    
    margin: -18px auto 30px;
    padding: 50px 0px 0px 0px;
    width: 80%;
    display:flex;
    background: url("../img/make/arrow-bg.png") no-repeat center top;
    background-size: 36px auto;
    
}

#contents.make .buyRecipe .dogBox .dogPic{
    margin: 0px auto;
    
}

#contents.make .buyRecipe .dogBox .dogPic .pic{
    text-align: center;
}

#contents.make .buyRecipe .dogBox .dogPic .pic img{
    height: 158px;
}

#contents.make .buyRecipe .dogBox .dog{
    margin: 0px auto;
    width: 66%;
}

#contents.make .buyRecipe .dogBox .dog .dogname{
    margin: 0px 0px 24px 0px;
    line-height: 1.6em;
}

#contents.make .buyRecipe .dogBox .dog .dogname span.name{
    font-size: 30px;
}

#contents.make .buyRecipe .dogBox .dog .txt{
    margin-bottom: 14px;
}

#contents.make .buyRecipe .dogBox .dog .txt span{
    margin: 0px 10px 0px 10px;
    padding: 10px 20px 10px 20px;
    font-size: 26px;
    font-weight: bold;
    background-color: #fffcc2;
}

#contents.make .buyRecipe .dogBox .dog .amount3{
    
    padding-left:20px;
}

#contents.make .buyRecipe .buyAreaBox{
    margin: 0px auto 20px;
    padding: 20px 4% 20px 4%;
    width: 98%;
    background-color: #efefef;
    border-radius: 20px;
    
}


#contents.make .buyRecipe .buyAreaBox .tab-area{
    margin: 0px auto 20px;
    padding: 0px 0px 0px 0px;
    width: 80%;
    
}

#contents.make .buyRecipe .buyAreaBox .tab-area ul{
    display:flex;
    justify-content: center;
    align-items: center;
    background-color: #ffffff;
    border-radius: 10px;
}

#contents.make .buyRecipe .buyAreaBox .tab-area ul li{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 50%;   
    text-align: center;
    line-height: 2em;
    background-color: #ffffff;
    color: #666666;
    font-weight: bold;
    font-size: 18px;
}

#contents.make .buyRecipe .buyAreaBox .tab-area ul li:hover{
    cursor: pointer;
}

#contents.make .buyRecipe .buyAreaBox .tab-area ul li.t3{
    padding: 10px 0px 10px 0px;
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
}

#contents.make .buyRecipe .buyAreaBox .tab-area ul li.t1{
    padding: 28px 0px 28px 0px;
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
}


#contents.make .buyRecipe .buyAreaBox .tab-area ul li.active{
   background-color: #ff7b43;
    border: solid 1px #ffffff;
    color: #ffffff;
}





#contents.make .buyRecipe .buyAreaBox .tab-area ul li span{
    margin: 0px 0px 0px 0px;
    padding: 4px 4px 4px 4px;
    background-color: #fffcc2;
    color: #ff7b43;
    border: solid 1px #ff7b43;
}


#contents.make .buyRecipe .buyAreaBox .tab-area.tb02{
    margin: 0px auto;
}

#contents.make .buyRecipe .buyAreaBox .tab-area.tb02 ul{
    background-color: transparent;
}

#contents.make .buyRecipe .buyAreaBox .tab-area.tb02 ul li{
    padding: 0px;
    background-color: transparent;
}

#contents.make .buyRecipe .buyAreaBox .tab-area.tb02 ul li.active {
    background-color: transparent;
    border: none;
}


#contents.make .buyRecipe .buyAreaBox .tabBody{
    background-color: #ffffff;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .body{
    margin: 0px 0px 0px 0px;
    padding: 20px 0px 0px 0px;
    display:none;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .body.active{
    display:block;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .body .newsBox{
    margin: 0px 0px 10px 0px;
    padding: 10px 0px 0px 0px;
    text-align: center;
}



#contents.make .buyRecipe .buyAreaBox .tabBody .dayBox{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 10px 0px;
    display:flex;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .dayBox div{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 50%;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .dayBox div.all{
    border-right: dotted 1px #ff7b43;
}



#contents.make .buyRecipe .buyAreaBox .tabBody .dayBox div p.pic{
    margin: 0px auto 10px;
    width: 80%;
    text-align: center;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .dayBox div p.txt{
    margin: 0px 0px 10px 0px;
    text-align: center;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .dayBox div p.day{
    margin: 0px 0px 0px 0px;
    text-align: center;
    font-size: 24px;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .dayBox div p.day span{
    font-size: 47px;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .price{
    margin: 0px auto 20px;
    padding: 14px 10px 14px 10px;
    width: 90%;
    background-color: #fffcc2;
}


#contents.make .buyRecipe .buyAreaBox .tabBody .price .p{
    margin: 0px 0px 20px 0px;
    text-align: center;
    font-size: 20px;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .price .p span{
    text-align: center;
    font-size: 69px;
    font-weight: bold;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .price .pu{
    margin: 10px auto 0px;
    width: 70%;
    
}

#contents.make .buyRecipe .buyAreaBox .tabBody .price .pu span{
    margin: 0px 5px 0px 0px;
    text-decoration: line-through;
}



#contents.make .buyRecipe .buyAreaBox .tabBody .price .onemeal{
    margin: 0px 0px 14px 0px;
    text-align: center;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .price .onemeal span{
    margin: 0px 0px 0px 0px;
    padding: 6px 20px 6px 20px;
    background-color: #ffffff;
    border-radius: 10px;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .price .onemeal span.cool{
    margin: 0px 0px 0px 4px;
    padding: 6px 6px 6px 6px;
    background-color: #00a0e9;
    color: #ffffff;
    font-size: 0.9em;
    border-radius: 0px;
}


#contents.make .buyRecipe .buyAreaBox .tabBody .price .memo{
    margin: 0px 0px 0px 0px;
    text-align: center;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .price .rmemo{
    margin: 0px auto;
    padding: 0px 0px 4px 0px;
    width: 80%;
    text-align: center;
    border-bottom: solid 2px #1a1a1a;
    font-weight: bold;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .price .rmemo span{
    color: #eb6100;
}


#contents.make .buyRecipe .buyAreaBox .tabBody .regularBox{
    margin: 0px 0px 0px 0px;
    padding: 0px 10px 14px 10px;
    width: 100%;
    background-color: transparent;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .regularBox h3{
    margin: 0px 0px 0px 0px;
    padding: 20px 0px 20px 0px;
    text-align: center;
    color: #ffffff;
    font-size: 18px;
    font-weight: bold;
    width: 100%;
}


#contents.make .buyRecipe .buyAreaBox .tabBody .regularBox .regbox{
    margin: 0px auto;
    padding: 30px 14px 14px 14px;
    background-color: #ffffff;
    border-radius: 20px;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .regularBox .regbox dl{
    
}

#contents.make .buyRecipe .buyAreaBox .tabBody .regularBox .regbox dl dt{
    margin: 0px 0px 30px 0px;
    padding: 0px 0px 0px 0px;
    text-align: center;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .regularBox .regbox dl dt span{
    margin: 0px 0px 0px 0px;
    padding: 10px 20px 10px 20px;
    border: solid 1px #ff7b43;
    border-radius: 20px;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .regularBox .regbox dl dd ul{
    
}

#contents.make .buyRecipe .buyAreaBox .tabBody .regularBox .regbox dl dd ul li{
    margin: 0px 0px 10px 0px;
    font-size: 14px;
    line-height: 1.3em;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .regularBox .regbox dl dd ul li:before{
    content:"・";
}

#contents.make .buyRecipe .buyAreaBox .tabBody .regularBox .regbox dl dd ul li span{
    color: #ff7b43;
    font-weight: bold;
}



#contents.make .buyRecipe .buyAreaBox .tabBody .regularBox .regbox dl dd p{
    margin: 0px 0px 20px 0px;
    line-height: 1.6em;
    font-size: 14px;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .regularBox .regbox dl dd p span{
    color: #e60012;
    font-weight: bold;
}

#contents.make .buyRecipe .buyAreaBox .tabBody p.cart{
    margin: 0px auto 20px;
    max-width: 500px;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .regularBox .regbox dl dd p.bowl{
    margin: 0px auto 20px;
    width: 70%;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .rm{
    margin: 0px auto;
    width: 90%;
}


#contents.make .buyRecipe .buyAreaBox .tabBody .commonBox{
    margin: 0px 0px 0px 0px;
    padding: 0px 10px 14px 10px;
    width: 100%;
    background-color: #fffcc2;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .commonBox h3{
    margin: 0px 0px 0px 0px;
    padding: 20px 0px 20px 0px;
    text-align: center;
    color: #191919;
    font-size: 18px;
    font-weight: bold;
    width: 100%;
}


#contents.make .buyRecipe .buyAreaBox .tabBody .commonBox .cmnbox{
    margin: 0px auto;
    padding: 30px 14px 14px 14px;
    background-color: #ffffff;
    border-radius: 20px;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .commonBox .cmnbox p{
    margin: 0px 0px 20px 0px;
    line-height: 1.5em;
    font-size: 14px;
}

#contents.make .buyRecipe .buyAreaBox .tabBody .commonBox .cmnbox p.cart{
    margin: 0px 0px 0px 0px;
}


@media (max-width: 767px){
    
    #contents.make .buyRecipe .buyAreaBox .tabBody .price .p{
        font-size: 5vw;
    }
    
    #contents.make .buyRecipe .buyAreaBox .tabBody .price .p span{
        text-align: center;
        font-size: 14vw;
        font-weight: bold;
    }
    
    #contents.make .buyRecipe .dogBox{    
        
        width: 96%;
        

    }
    
    #contents.make .buyRecipe .dogBox .dogPic{
        margin: 0px auto;
        width: auto;
    }
    
    #contents.make .buyRecipe .dogBox .dogPic .pic img{
        height: 120px;
    }
    
    #contents.make .buyRecipe .buyAreaBox .tab-area ul li{
        font-size: 5vw;
    }
    
    #contents.make .buyRecipe .buyAreaBox .tab-area ul li.t1{
        padding: 0px;
        
    }
    
    
    #contents.make .buyRecipe .pbox div dt{
        text-align: center;
        font-size: 3.2vw;
    }
    
}


#contents.make .frC{
    margin: 0px auto;
    width: 96%;
}

#contents.make .frC .boxin{
    position: relative;
}

#contents.make .frC .boxin .btn{
    width: 80%;
    position: absolute;
    bottom: 7%;
    left: 10%;
}



#contents.make .frC .courseDetail{
    margin: 0px 0px 0px 0px;
    padding: 0px 10px 10px 10px;
    background-color: #0f6022;
}

#contents.make .frC .courseDetail .pic img{
    margin: 0px 0px 0px 0px;
}

#contents.make .frC .courseDetail .link{
    margin: 0px auto 24px;
    width:90%;
}


#contents.make .frC .courseDetail .block{ 
    padding: 10px 10px 80px 10px;
    background-color: #ffffff;
}

#contents.make .frC .boxin.courseDetail .btn{
    width: 80%;
    position: absolute;
    bottom: 2%;
    left: 10%;
}


#contents.make .frC .courseDetail .block .pic{
    margin: 0px 0px 40px 0px;
}


@media (max-width: 767px){
    
    
    #contents.make .frC .courseDetail{
        padding: 1% 1% 1% 1%;
        background-color: #0f6022;
    }
    
    #contents.make .frC .courseDetail .block{ 
        padding: 10px 10px 50px 10px;
        background-color: #ffffff;
    }
    
    
}

#contents.make .topContents .dogRecipeRanking{
    margin: 0px 0px 30px 0px;
}

#contents.make .topContents .dogRecipeRanking ul{
    display:flex;
    flex-wrap: wrap;
}

#contents.make .topContents .dogRecipeRanking ul li{
    margin: 0px auto 10px;
    padding: 10px 10px 10px 10px;
    width: 32%;
    background-color: #ffffff;
    border: solid 1px #bebebe;
    border-radius: 10px;
    position: relative;
}

#contents.make .topContents .dogRecipeRanking ul li span img{
    width: 37px;
    position: absolute;
    left: 10px;
    top: 46px;
}


#contents.make .topContents .dogRecipeRanking ul li .rname{
    margin: 0px 0px 10px 0px;
    padding: 4px 0px 4px 0px;
    text-align: center;
    background-color: #006835;
    color: #ffffff;
}

#contents.make .topContents .dogRecipeRanking ul li .pic{
    margin: 0px auto 10px;
    width: 90%;
}

#contents.make .topContents .dogRecipeRanking ul li ul{
    display:block;
}

#contents.make .topContents .dogRecipeRanking ul li ul li{
    margin: 0px 0px 5px 0px;
    padding: 0px 0px 0px 0px;
    border: none;
    border-radius: 0px;
    font-size: 12px;
    width: 100%;
}

#contents.make .topContents .dogRecipeRanking ul li ul li.protein:before{
    content: "■";
    color: #db77ac;
}

#contents.make .topContents .dogRecipeRanking ul li ul li.vegetable:before{
    content: "■";
    color: #39b576;
}

#contents.make .topContents .dogRecipeRanking ul li ul li.carbohydrates:before{
    content: "■";
    color: #a0835c;
}


@media (max-width: 767px){
    
    
    #contents.make .topContents .dogRecipeRanking ul li{
        margin: 0px auto 10px;
        padding: 10px 10px 10px 10px;
        width: 48%;
        
    }
    
}








#contents.make .instabox{
    display:none;
} 

#contents.make .instabox.on{
    display:block;
    overflow-x:hidden;
} 





#contents.make .courseDetail .cdList{
    margin: 0px auto;
    padding: 0px 0px 50px 0px;
    max-width: 800px;
    background:url("../img/food-rotation/bg-cdlist.png") no-repeat center bottom;
    background-size: auto 50px;
    
}

#contents.make .courseDetail .cdList ul{
    margin: 0px auto;
    padding: 20px 60px 20px 60px;
    width: 100%;
    background:#efefef;
    border-radius: 10px;
}

#contents.make .courseDetail .cdList ul li{
    margin: 0px 0px 20px 0px;
    padding: 0px 0px 10px 0px;
    display:flex;
    align-items:center;
    border-bottom: dotted 1px #487f5e;
}

#contents.make .courseDetail .cdList ul li:last-child{
    margin: 0px 0px 0px 0px;
}

#contents.make .courseDetail .cdList ul li p.no{
    margin: 0px 10px 0px 0px;
    max-width: 80px;
}

#contents.make .courseDetail .cdList ul li:nth-child(2) p.no{
    margin: 0px 10px 0px 0px;
    max-width: 150px;
}

#contents.make .courseDetail .cdList ul li p.txt{
    max-width: 700px;
    line-height: 1.5em;
}

#contents.make .courseDetail .cdList ul li p.txt span{
    color: #0f6022;
    font-weight: bold;
}



#contents.make .courseDetail .tab2{
    background-color: #0f6022;
}

#contents.make .courseDetail .tab2 ul{
    margin: 0px auto;
    width: 98%;
    display:flex;
    
}

#contents.make .courseDetail .tab2 ul li{
    cursor: pointer;
}





@media (max-width: 767px){
   
    
    #contents.make .frC{
        width: 98%;
    }
    
    
    
    #contents.make .courseDetail .cdList{
        margin: 0px auto;
        padding: 0px 0px 32px 0px;
        width: 90%;
        background:url("../img/food-rotation/bg-cdlist.png") no-repeat center bottom;
        background-size: auto 32px;

    }

    #contents.make .courseDetail .cdList ul{
        margin: 0px auto;
        padding: 10px 10px 10px 10px;
        width: 100%;
        background:#efefef;
        border-radius: 10px;
    }

    #contents.make .courseDetail .cdList ul li{
        margin: 0px 0px 20px 0px;
        padding: 0px 0px 10px 0px;
        display:flex;
        align-items:center;
        border-bottom: dotted 1px #487f5e;
    }

    #contents.make .courseDetail .cdList ul li:last-child{
        margin: 0px 0px 0px 0px;
    }

    #contents.make .courseDetail .cdList ul li p.no{
        margin: 0px 10px 0px 0px;
        width: 16%;
    }
    
    #contents.make .courseDetail .cdList ul li:nth-child(2) p.no{
        margin: 0px 10px 0px 0px;
        width: 16%;
    }

    #contents.make .courseDetail .cdList ul li p.txt{
        width: 84%;
        line-height: 1.5em;
        font-size: 3.6vw;
    }
    
    #contents.make .courseDetail .cdList ul li:nth-child(1) p.txt{
        margin: 0px 10px 0px 0px;
        width: 69%;
    }

    #contents.make .courseDetail .cdList ul li p.txt span{
        color: #0f6022;
        font-weight: bold;
    }
    
    
    #contents.make .courseDetail .tab2 ul{
        margin: 0px auto;
        width: 100%;
        display:flex;
    }
    
}





#contents.make.recipe{
    max-width: 600px;
}


#contents.make.recipe .r-wrap .thumbs_list{
}


#contents.make.recipe .rbox{
    margin: 0px 0px 0px 0px;
}

#contents.make.recipe .r-wrap .thumbs_dots{
    width: 100%!important;
}

#contents.make.recipe .r-wrap .thumbs_list li{
    width: 100%;
}

#contents.make.recipe .madefor {
    margin: 0px auto;
    padding:0px 0px 0px 0px;
}

#contents.make.recipe .madefor .madeforIn{
    border:none;
    background-color: transparent;
}

#contents.make.recipe .madefor .madeforIn .nutrient{
        margin: 0px auto;
}


#contents.make.recipe .dogbreed{
    
}


#contents.make.recipe h3{
    border-bottom:none;
}

#contents.make.recipe .madefor h3{

    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 28px;
    font-size: 20px;
    font-weight: bold;
    background: url(/resource/img/common/arrow_h3.png) no-repeat left center;
    background-size: 24px auto;
    color: #0f6022;

}


#contents.make.recipe .weight-cal-dayBox.on{
    margin: 0px 0px 30px 0px;
}


#contents.make.recipe .buyRecipe{
    
}


#contents.make.recipe .buyRecipe .boxIn{
    margin: 0px 0px 30px 0px;
    padding: 30px 0px 30px 0px;
    border-top: solid 1px #0f6022;
    border-bottom: solid 1px #0f6022;
}

#contents.make.recipe .buyRecipe .dogBox{
    margin: -18px auto 30px;
    padding: 50px 0px 0px 0px;
    display:none;
}

#contents.make.recipe .buyRecipe .dogBox.on{
    display:flex;
}


#contents.make.recipe .buyRecipe .dogBox .dogPic .pic{
    width: auto;
}



#contents.make.recipe .buyRecipe .buyAreaBox{
    margin: 0px auto;
}


#contents.make.recipe .buyRecipe .dogBox .dog{
    display:none;
}

#contents.make.recipe .buyRecipe .dogBox .dog.on{
    display:block;
}


#contents.make.recipe .dogbreed .db01 .dbin .dbr select.select_search{
    width: 100%;
}


#contents.make.recipe .buyRecipe .buyAreaBox .tabBody .dayBox{
    display:none;
}

#contents.make.recipe .buyRecipe .buyAreaBox .tabBody .dayBox.on{
    display:flex;
}



#contents.make.recipe .topContents.dogRecommend .dogPic p.pic{
    width: auto;
    max-width: 100%;
}


@media (max-width: 767px){
    
    #contents.make.recipe .buyRecipe .dogBox{
        width: 96%;
    }
    
}



/* check */



#contents.check {
    margin: 0px auto 0px;
    padding: 0px 0px 0px 0px;
    max-width: 600px;
    
}

#contents.check h2{
    max-width: 240px;
    text-align: center;

}


#contents.check .txtBox.lead {
    margin: 0px auto 14px;
}

#contents.check .txtBox.lead p{
    text-align: center;
}

#contents.check .txtBox.lead p span {
    font-weight: bold;
}

#contents.check .formBox{
    
}

#contents.check .formBox .dbin{
    margin: 0px 0px 20px 0px;
    display:flex;
}





/* modal */

.modal{
    display: none;
    height: 100vh;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 20;
}
.modal__bg{
    background: rgba(0,0,0,0.8);
    height: 100vh;
    position: fixed;
    width: 100%;
    top:0;
    left:0;
}
.modal__content{
    background: #fffef0;
    border: solid 3px #0f6022;
    left: 20%;
    padding: 20px;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 60%;
    max-width: 450px;
}

.food-rotation .modal__content{
    left:22%;
}

.modal__content .close{
    text-align: right;
}

.modal__content .pbox01{
    margin: 0px 0px 15px 0px;
}

.modal__content .pbox01 p{
    margin: 0px auto;
    width: 90%;
}

.modal__content .rpt{
    margin: 0px 0px 10px 0px;
    font-size: 14px;
    text-align: center;
}

.modal__content .rp{
    margin: 0px auto 10px;
    padding: 1% 1% 1% 1%;
    width: 90%;
    height: 140px;
    overflow-y:scroll;
    font-size: 12px;
    line-height: 1.3em;
    border: solid 1px #9a9a9a;
}

.modal__content .rp p{
    margin: 0px 0px 10px 0px;
}

@media (max-width: 767px){
    .modal__content{
        background: #fffef0;
        left: 50%;
        padding: 10px;
        position: absolute;
        top: 50%;
        transform: translate(-50%,-50%);
        width: 90%;
    }
    .food-rotation .modal__content{
        left:50%;
    }
    
    .modal__content .movie{
        margin: 0px auto;
        width: 90%;
        max-width: 400px;

    }
    
    
}


/* SALE */


.saleBox{
    margin: 0px auto;
    padding: 40px 0px 0px 0px;
    width: 70%;
    background: url("../img/sale/arrow-sale.png") no-repeat center 10px;
    background-size: 30px auto;
}


.saleBox .block{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 0px;
    display:flex;
    align-items: center;
}

.saleBox .block .icon{
    margin: 0px auto;
    width: 20%;
}

.saleBox .block .sR{
    margin: 0px auto;
    width: 78%;
}

.saleBox .block .sR .s1{
    margin: 0px 0px 4px 0px;
    font-size: 15px;
}

.saleBox .block .sR .s2{
    margin: 0px 0px 4px 0px;
    font-size: 15px;
}

.saleBox .block .sR .s2 span{
    color: #c13426;
    font-weight: bold;
    font-size: 18px;
}

.saleBox .block .sR .s3{
    margin: 0px 0px 0px 0px;
}

.saleBox .block .sR .s3 img{
    margin: 0px 10px 0px 0px;
    width: 100px;
}

.saleBox.frc1500 .block .sR .s3{
    margin: 0px 0px 0px 26%;
}

.saleBox .block .sR .s3 em{
    color: #c13426;
    font-weight: bold;
    font-size: 24px;
}

.saleBox .block .sR .s3 span{
    color: #c13426;
    font-weight: bold;
    font-size: 36px;
}

.saleBox .att{
    margin: 0px 0px 4px 0px;
    font-size: 14px;
    text-align: right;
}

.sale .perserving span{
    text-decoration: line-through 4px solid #c13426;
}


@media (max-width: 767px){
    
    .saleBox{
        margin: 0px auto;
        padding: 40px 0px 0px 0px;
        width: 96%;
        background: url("../img/sale/arrow-sale.png") no-repeat center 10px;
        background-size: 30px auto;
    }
    
    
    .saleBox .block .sR .s3 span{
        font-size: 2em;
    }
    
    
    
}


.recipeSale{
    margin: 0px auto 20px;
    padding: 40px 0px 0px 0px;
    background:url("../img/sale/arrow-sale2.png") no-repeat center top;
    background-size: 80px auto;
}


.recipeSale .block{
    margin: 0px auto 0px;
    padding: 20px 10px 20px 10px;
    width: 90%;
    background-color:#fffcc2;
    
}


.recipeSale .block .s1{
    margin: 0px 0px 14px 0px;
    text-align: center;
    color: #106022;
}


.recipeSale .block .s1 span{
    color: #c13426;
    font-size: 20px;
    font-weight: bold;
}


.recipeSale .block .rsbox{
    margin: 0px auto 10px;
    padding: 0px 0px 0px 0px;
    width: 70%;
    display:flex;
    align-items: center;
}


.recipeSale .block .rsbox .icon{
    margin: 0px auto;
    width: 26%;
}

.recipeSale .block .rsbox .sprice{
    margin: 0px auto;
    width: 68%;
}


.recipeSale .block .rsbox .sprice em{
    font-size: 20px;
    color: #c13426;
}

.recipeSale .block .rsbox .sprice span{
    font-size: 62px;
    font-weight: bold;
    color: #c13426;
}


#contents.make .buyRecipe .buyAreaBox.sale .tabBody .price .p span{
    text-decoration: line-through 4px solid #c13426;
}


.recipeSale .block .memo{
    text-align: right;
}


@media (max-width: 767px){
    
    .recipeSale .block .s1{
        margin: 0px 0px 14px 0px;
        text-align: left;
        color: #106022;
        line-height: 1.4em;
    }


    .recipeSale .block .s1 span{
        color: #c13426;
        font-size: 20px;
        font-weight: bold;
        display:block;
    }
    
    .recipeSale .block .rsbox{
        width: 90%;
    }
    
    
    
}



/* mypeage-manual */


#contents.mypage-manual h1{
    margin: 0px 0px 30px 0px;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
}

#contents.mypage-manual h2{
    margin: 0px 0px 20px 0px;
    padding: 15px 10px 15px 10px;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    background-color: #0f6022;
    color: #ffffff;
}

.mmbox{
    margin: 0px auto;
    max-width: 800px;
}

.mmbox dl{
    margin: 0px auto 30px;
    max-width: 800px;
}

.mmbox dl dt{
    margin: 0px auto 14px;
    max-width: 400px;
}

.mmbox dl dt img{
    margin: 0px 0px 0px 0px;
    width: 100%;
}

.mmbox dl dd{
    margin: 0px 0px 0px 0px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
}

.mmbox dl dd br{
    display:none;
}

.mmbox .memo{
    margin: 0px auto 20px;
    padding: 10px 10px 10px 10px;
    max-width: 400px;
    border: dashed 2px #5C5C5C;
    background-color:#ffffff;
    line-height: 1.3em;
    font-size: 14px;
}


@media (max-width: 767px){
    #contents.mypage-manual h1{
        text-align: center;
        font-size: 20px;
        font-weight: bold;
    }
    
    .mmbox{
        margin: 0px auto;
        width: 100%;
    }
    
    .mmbox p{
        margin: 0px auto;
        width: 90%;
    }
    
    
    .mmbox dl dd{
        line-height: 1.4em;
    }
    
    .mmbox dl dd br{
        display:block;
    }
    
    .mmbox .memo{
        margin: 0px auto 20px;
        padding: 3%;
        width: 80%;
        
    }
    
}





/* 商品一覧　*/


#contents.allitems{
    margin: 0px auto 0px;
    padding: 0px 0px 0px 0px;
    max-width: 900px;
}
    
#contents.allitems h2{
    max-width: 240px;

}

#contents.allitems .lead{
    text-align: center;
}



#contents.allitems .linkBox{
    margin: 0px auto 40px;
    max-width: 500px;
    display:flex;
    flex-wrap: wrap;
}

#contents.allitems .linkBox p{
    margin: 0px auto 10px;
    width: 48%;
}


#contents.raw-materials .txtBox .red{
    color:#B31F21;
    font-weight: bold;
}



@media (max-width: 767px){
    
}



#contents.campainSummaryBox{
    margin: 0px auto 0px;
    padding: 0px 0px 0px 0px;
    max-width: 650px;
}

#contents.campainSummaryBox h1{
    margin: 0px 0px 40px 0px;
}

#contents.campainSummaryBox .csbox{
    margin: 0px 0px 40px 0px;
}

#contents.campainSummaryBox .csbox.cnt01{
    margin: 0px 0px 10px 0px;
}

#contents.campainSummaryBox .csbox.cnt06{
    margin: 0px 0px 80px 0px;
}


#contents.campainSummaryBox .sbox{
    margin: 0px auto 50px;
    width: 86%;
}

#contents.campainSummaryBox .lf.mbox{
    margin: 0px auto;
    padding: 0px 0px 30px 0px;
    width: 100%;
    display:flex;
    flex-wrap: wrap;
}

#contents.campainSummaryBox .lf.mbox p{
    margin: 0px auto 10px;
    width: 48%;
}


@media (max-width: 767px){
    #contents.campainSummaryBox{
        margin: 0px auto 0px;
        padding: 30px 0px 0px 0px;
        width: 96%;
    }
}






/* recommend_recipe */


#contents.recommend_recipe h2 {
    margin: 0px auto 20px;
    max-width: 300px;
}


#contents.recommend_recipe .block{
    margin: 0px auto;
    max-width: 800px;
}

#contents.recommend_recipe .block .lead{
    text-align:left;
    line-height: 2em;
}

#contents.recommend_recipe .block .lead .bowlsai{
    margin: 0px 0px 0px 0px;
    padding: 25px 4px 25px 53px;
    background: url("../img/recommend_recipe/logo_ai.png") no-repeat left center;
    background-size: 50px 50px;
    color: #0f6022;
    font-weight: bold;
    font-size: 20px;
    text-decoration: underline;
}


#contents.recommend_recipe .block .dNavi{
    margin: 0px 0px 30px 0px;
    position: relative;
}

#contents.recommend_recipe .block .dNavi ul{
    
}

#contents.recommend_recipe .block .dNavi li{
    position: absolute;
}

#contents.recommend_recipe .block .dNavi li.d01{
    left: 0px;
    top: 0px;
}

#contents.recommend_recipe .block .dNavi li.d02{
    right: 26%;
    top: 3%;
}

#contents.recommend_recipe .block .dNavi li.d03{
    left: 3%;
    bottom: 0%;
}

#contents.recommend_recipe .block .dNavi li.d04{
    right: 0px;
    bottom: 8%;
}



#contents.recommend_recipe .block .dList{
    margin: 0px auto 20px;
    padding: 0px 0px 0px 0px;
    max-width: 600px;
}

#contents.recommend_recipe .block .dList h3{
    margin: 0px auto 20px;
    padding: 10px 0px 10px 0px;
    width: 100%;
    text-align: center;
    background-color: #fffbcb;
    font-size: 20px;
    font-weight: bold;
    color: #095223;
    border: solid 2px #095223;
    border-radius: 20px;
}

#contents.recommend_recipe .block .dList ul{
    
}

#contents.recommend_recipe .block .dList ul li{
    margin: 0px 0px 10px 0px;
    padding: 10px 0px 10px 10px;
    border: solid 2px #0f6022;
    background-color: #ffffff;
    color: #0f6022;
    font-weight: bold;
}


#contents.recommend_recipe .block .dList ul li span{
    margin: 0px 8px 0px 0px;
    padding: 4px 8px 4px 8px;
    background-color: #0f6022;
    color: #ffffff;
}



#contents.recommend_recipe .block .dList ul li:hover{
    border: solid 2px #0f6022;
    background-color: #0f6022;
    color: #ffffff;
}

#contents.recommend_recipe .block .dList ul li:hover span{
    background-color: #fff763;
    color: #0f6022;
}






#contents.recommend_recipe .block.recipe{
    
}

#contents.recommend_recipe .block.recipe h2{
    margin: 0px auto;
    padding: 52px 0px 10px 0px;
    width: 100%;
    background: url("../img/recommend_recipe/h2_bg.png") no-repeat center top;
    background-size: 100px auto;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    color: #095223;
}

#contents.recommend_recipe .block.recipe .lead{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 0px;
    text-align:left;
    line-height: 1.6em;
}

#contents.recommend_recipe .block.recipe .pic{
    margin: 0px 0px 20px 0px;
}



#contents.recommend_recipe .block.recipe h3{
    margin: 0px 0px 14px 0px;
    padding: 10px 0px 10px 0px;
    background-color: #106023;
    color: #ffffff;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    
    
    
}

#contents.recommend_recipe .block.recipe ul{
    margin: 0px auto;
    padding: 0px 0px 0px 0px;
    max-width: 500px;
    display:flex;
    flex-wrap: wrap;
}

#contents.recommend_recipe .block.recipe ul li{
    margin: 0px auto 20px;
    padding: 0px 0px 20px 0px;
    width: 46%;
    border: solid 1px #cccccc;
    background-color: #ffffff;
}

#contents.recommend_recipe .block.recipe ul li a{
    text-decoration: none;
    color: #1a1a1a;
}

#contents.recommend_recipe .block.recipe ul li .name{
    margin: 0px 0px 0px 0px;
    padding: 10px 0px 10px 0px;
    text-align: center;
    background-color: #f2f2f2;
}

#contents.recommend_recipe .block.recipe ul li .rpic{
    margin: 0px auto 10px;
    width: 80%;
}

#contents.recommend_recipe .block.recipe ul li .txt{
    margin: 0px 10px 10px 10px;
    padding: 0px 0px 0px 0px;
    font-size: 14px;
    line-height: 1.5em;
}

#contents.recommend_recipe .block.recipe ul li .btn{
    margin: 0px auto;
    padding: 10px 10px 10px 10px;
    width: 90%;
    background-color: #106023;
    color: #fff100;
    font-size: 14px;
    font-weight: bold;
    text-align:center;
}

#contents.recommend_recipe .block.recipe ul li ul{
    margin: 0px auto 10px;
    padding: 0px 0px 10px 0px;
    width: 96%;
    border-bottom: dotted 1px #000000;
}

#contents.recommend_recipe .block.recipe ul li ul li{
    margin: 0px 0px 5px 10px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    font-size: 14px;
    border:none;
}

#contents.recommend_recipe .block.recipe ul li ul li.protein:before{
    content:"■";
    color: #db77ac;
}

#contents.recommend_recipe .block.recipe ul li ul li.vegetable:before{
    content:"■";
    color: #39b576;
}

#contents.recommend_recipe .block.recipe ul li ul li.carbohydrates:before{
    content:"■";
    color: #a0835c;
}






@media (max-width: 767px){
    
    
    #contents.recommend_recipe h2 {
        margin: 0px auto 20px;
        width: 65%;
    }


    #contents.recommend_recipe .block{
        margin: 0px auto;
        width: 98%;
    }

    #contents.recommend_recipe .block .lead{
        text-align:left;
        line-height: 2em;
        font-size: 4vw;
    }
    
    
    
    #contents.recommend_recipe .block .dNavi{
        margin: 0px auto 30px;
        width: 94%;
    }

    #contents.recommend_recipe .block .dNavi ul{

    }

    #contents.recommend_recipe .block .dNavi li{
        position: absolute;
        width: 20%;
    }
    
    #contents.recommend_recipe .block.recipe ul li ul li{
        margin: 0px 0px 5px 10px;
        padding: 0px 0px 0px 0px;
        width: 100%;
        font-size: 3vw;
        border:none;
    }
    
    
    
}


/* BowlsAI */



#contents.bowlsAI{
    margin: 0px auto;
    max-width: 600px;
    width: 98%;
}

.bowlsAI h1{
    margin: 0px 0px 20px 0px;
    text-align: center;
}


.aiBox{
    margin: 0px 0px 0px 0px;
}

@media (max-width: 767px){
  .aiBox{
        margin: 0px auto;
        width:96%;
    } 
}




.bowlsAI{
    margin: 0px auto;
    padding: 0px 0px 20px 0px;
    max-width: 600px;
}

.bowlsAI h1{
    margin: 0px auto 20px;
    font-size: 30px;
    font-weight: bold;
}

.bowlsAI .bookmark{
    margin: 0px auto 30px;
    text-align: center;
}


.bowlsAI mark {
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 102) 30%);
}


@media (max-width: 767px){
    
    .bowlsAI{
        margin: 0px auto;
        width: 90%;
    }
    
    .bowlsAI h1{
        margin: 0px auto 20px;
        font-size: 5.5vw;
    }

    
}



.popularBox{
    margin: 0px auto 40px;
    padding: 20px 20px 20px 20px;
    background-color: #f9f9ef;
    border-radius: 10px;
}


#contents .popularBox h2{
    margin: 0px 0px 10px 0px;
    font-weight: bold;
    font-size: 30px;
    text-align:center;
}

.popularBox .txt{
    margin: 0px 0px 10px 0px;
    font-size: 15px;
}


.popularBox .question{
    margin: 0px 0px 30px 0px;
}

.popularBox .question h3{
    margin: 0px 0px 15px 0px;
    font-weight: bold;
    font-size: 21px;
}

.popularBox .question ol{
    margin: 0px 0px 0px 0px;
    padding: 0px 10px 0px 30px;
    list-style: decimal;
}

.popularBox .question ol li{
    margin: 0px 0px 10px 0px;
}


.bowlsAI .e02{
    padding-bottom: 50px;
}

@media (max-width: 767px){
    
    #contents .popularBox h2{
        margin: 0px 0px 10px 0px;
        font-weight: bold;
        font-size: 6vw;
    }

    .popularBox .txt{
        margin: 0px 0px 10px 0px;
        font-size: 3.5vw;
    }
        
}



.conceptBox{
    margin: 0px auto;
    padding: 0px 0px 0px 0px;
    width: 98%;
}

.conceptBox h3{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 28px;
    font-size: 20px;
    font-weight: bold;
    background: url(/resource/img/common/arrow_h3.png) no-repeat left center;
    background-size: 24px auto;
    color: #0f6022;
}

#contents .conceptBox .txtBox{
    margin: 0px auto 20px;
    width: 98%;
}

.conceptBox .pic{
    margin: 0px auto 20px;
}


@media (max-width: 767px){
    
   
}


.aboutBox{
    margin: 0px auto 40px;
    padding: 0px 0px 0px 0px;
}

#contents.about .aboutBox h3{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 28px;
    font-size: 20px;
    font-weight: bold;
    background: url(/resource/img/common/arrow_h3.png) no-repeat left center;
    background-size: 24px auto;
    color: #0f6022;
    text-align:left;
    border:none;
}

.aboutBox h4{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 0px;
    font-size: 18px;
    font-weight: bold;
}


.aboutBox .movieBox{
    
}

.aboutBox .movieBox video{
    width: 100%;
}


@media (max-width: 767px){
    
    .aboutBox h3{
        font-size: 5.5vw;
    }

    .aboutBox h4{
        font-size: 4.5vw;
    }
    
}



.topContents .cBox.pickupRecipe{
    margin: 0px auto 80px;
    max-width: 1000px;
}

.topContents .cBox.pickupRecipe h2{
    margin: 0px auto 30px;
    max-width: 300px;
}

.topContents .cBox.pickupRecipe .pList{
    margin: 0px auto;
    width: 100%;
}

.topContents .cBox.pickupRecipe .slick-initialized .slick-slide{
    padding: 10px;
}

.topContents .cBox.pickupRecipe .slick-initialized .slick-slide.slick-active{

}

.topContents .cBox.pickupRecipe .slick-next{
    right: 20%;
    background: url("../img/top/arrow-next.png") no-repeat left top;
    background-size: 50px auto;
    z-index:10;
    width:50px;
    height:50px;
}

.topContents .cBox.pickupRecipe .slick-prev{
    left: 20%;
    background: url("../img/top/arrow-prev.png") no-repeat left top;
    background-size: 50px auto;
    z-index:10;
    width:50px;
    height:50px;
}

.topContents .cBox.pickupRecipe .slick-dots li{
    width: 10px;
    height: 10px;
    border: solid 1px #006835;
    background-color: #ffffff;
    border-radius: 20px;
}

.topContents .cBox.pickupRecipe .slick-dots li.slick-active{
    background-color: #006835;
}

.topContents .cBox.pickupRecipe ul li{
    margin: 0px 4px 0px 4px;
    background-color: #ffffff;
    border: solid 1px #bebebe;
    border-radius: 10px;
}

.topContents .cBox.pickupRecipe ul li ul li{
    margin: 0px 0px 5px 0px;
    border: none;
    border-radius: 0px;
    font-size: 12px;
    
}

.topContents .cBox.pickupRecipe ul li ul li.protein:before{
    content:"■";
    color: #db77ac;
}

.topContents .cBox.pickupRecipe ul li ul li.vegetable:before{
    content:"■";
    color: #39b576;
}

.topContents .cBox.pickupRecipe ul li ul li.carbohydrates:before{
    content:"■";
    color: #a0835c;
}

.topContents .cBox.pickupRecipe ul li a{
    text-decoration: none;
    color: #191919;
}

.topContents .cBox.pickupRecipe ul li a:hover{
    opacity: 0.7;
}

.topContents .cBox.pickupRecipe ul li a:hover img{
    opacity: 0.7;
}


.topContents .cBox.pickupRecipe ul li p.title{
    margin: 0px 0px 10px 0px;
    padding: 4px 0px 4px 0px;
    text-align: center;
    background-color: #006835;
    color: #ffffff;
}

.topContents .cBox.pickupRecipe ul li p.price{
    margin: 0px 0px 10px 0px;
    text-align: center;
    font-size: 12px;
}

.topContents .cBox.pickupRecipe ul li p.link{
    margin: 0px 0px 10px 0px;
    padding: 4px 0px 4px 0px;
    text-align: center;
    font-size: 12px;
    color: #006835;
    border: solid 1px #006835;
    border-radius: 10px;
}

.topContents .cBox.pickupRecipe ul li.popular {
    background:#ffffff url(../img/common/popular.png) no-repeat 96% 12%;
    background-size: 36px auto;
}


@media (max-width: 767px){
    

    .topContents .cBox.pickupRecipe{
        margin: 0px auto 80px;
    }
    
    .topContents .cBox.pickupRecipe h2{
        margin: 0px auto 30px;
        width: 60%;
    }
    
    .topContents .cBox.pickupRecipe .pList{
        margin: 0px auto;
        width: 100%;
    }
    
    .topContents .cBox.pickupRecipe .slick-initialized .slick-slide{
        padding: 10px;
    }
    
    .topContents .cBox.pickupRecipe .slick-initialized .slick-slide.slick-active{
        
    }
    
    .topContents .cBox.pickupRecipe .slick-next{
        right: 20%;
        background: url("../img/top/arrow-next.png") no-repeat left top;
        background-size: 50px auto;
        z-index:10;
        width:50px;
        height:50px;
    }
    
    .topContents .cBox.pickupRecipe .slick-prev{
        left: 20%;
        background: url("../img/top/arrow-prev.png") no-repeat left top;
        background-size: 50px auto;
        z-index:10;
        width:50px;
        height:50px;
    }
    
    .topContents .cBox.pickupRecipe .slick-dots li{
        width: 10px;
        height: 10px;
        border: solid 1px #006835;
        background-color: #ffffff;
        border-radius: 20px;
    }
    
    .topContents .cBox.pickupRecipe .slick-dots li.slick-active{
        background-color: #006835;
    }
    
    
}





#contents.breakfast{
    
}


#contents.breakfast .video{
    margin: 0px auto 30px;
    width: 98%;
    height: 335px;
    position: relative;
    overflow: hidden;
}




#contents.breakfast .video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}




#contents.breakfast .cbox{
    margin: 0px 0px 60px 0px;
}

#contents.breakfast .cbox h2{
    margin: 0px auto 20px;
    padding: 0px 0px 0px 24px;
    width: 96%;    
    background: url("../img/breakfast/h2-arrow.png") no-repeat 0px center;
    background-size: 20px auto;
    font-size: 20px;
    font-weight: bold;
    color: #0f6022;
}

#contents.breakfast .cbox.c01 h2{  
    background: url("../img/breakfast/h2-arrow.png") no-repeat 0px 90%;
    background-size: 20px auto;
}



#contents.breakfast .cbox h2 span{
    font-size: 14px;
}


#contents.breakfast .cbox .txtBox{
    margin: 0px auto 20px;
    width: 96%;
    
}

#contents.breakfast .cbox .pic{
    margin: 0px auto 20px;
    width: 96%;
}


#contents.breakfast .cbox .tib{
    margin: 0px 0px 20px 0px;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
}

#contents.breakfast .cbox ul{
    margin: 0px auto;
    width: 98%;
    display:flex;
    flex-wrap: wrap;
}


@media (max-width: 767px){
    
    #contents.breakfast .cbox h2{
        margin: 0px auto 10px;
        font-size: 6vw;
    }
    
    
    
    #contents.breakfast .video{
        margin: 0px auto 30px;
        width: 98%;
        height: 250px;
        position: relative;
        overflow: hidden;
    }
    
    
    #contents.breakfast .cbox{
        margin: 0px 0px 40px 0px;
    }

}



#contents.breakfast .cbox.c01 ul li{
    margin: 0px 1% 10px 1%;
    width: 48%;
}



#contents.breakfast .cbox.c02 ul{
    margin: 0px auto 10px;
}

#contents.breakfast .cbox.c02 ul li{
    margin: 0px 1% 10px 1%;
    width: 23%;
}

#contents.breakfast .cbox.c02 .txtBox p{
    font-size: 14px;
}

@media (max-width: 767px){
     #contents.breakfast .cbox.c02 .txtBox p{
        font-size: 3.4vw;
    }   
}



#contents.breakfast .cbox.c03{
    
}

#contents.breakfast .cbox.c03 .c03Box{
    margin: 0px 0px 40px 0px;
}

#contents.breakfast .cbox.c03 .c03Box h3{
    margin: 0px 0px 12px 0px;
    padding: 0px 0px 0px 0px;
    text-align: center;
    color: #1f6e30;
    font-size: 18px;
    font-weight: bold;
}

#contents.breakfast .cbox.c03 .c03Box h3 span{
    margin: 0px 0px 0px 0px;
    padding: 10px 30px 10px 30px;
    border: solid 1px #1f6e30;
    border-radius: 30px;
}

#contents.breakfast .cbox.c03 .c03Box h3 em{
    margin: 0px 0px 0px 2px;
    font-size: 1.2em;
}


#contents.breakfast .cbox.c03 .c03Box dl{
    
}

#contents.breakfast .cbox.c03 .c03Box dl dt{
    margin: 0px 0px 12px 0px;
    padding: 0px 0px 0px 0px;
    text-align: center;
    color: #1f6e30;
    font-size: 20px;
    font-weight: bold;
}



#contents.breakfast .cbox.c03 .c03Box dl dd{
    
}

#contents.breakfast .cbox.c03 .c03Box dl dd .txt{
    margin: 0px 0px 20px 0px;
    text-align: center;
}



#contents.breakfast .cbox.c03 .c03Box.c0303 dl dd .txt{
    margin: 0px auto 20px;
    padding: 0px 0px 0px 0px;
    width: 96%;
    text-align: left;
}


#contents.breakfast .cbox.c03 .c03Box.c0303 dl dd .picBox{
    margin: 0px auto;
    padding: 0px 0px 0px 0px;
    width: 90%;
    display:flex;
}



#contents.breakfast .cbox.c03 .c03Box.c0303 dl dd .picBox li{
    margin: 0px 1% 0px 1%;
    width: 48%;
}

#contents.breakfast .cbox.c03 .c03Box.c0303 dl dd .picBox li .tit{
    margin: 0px 0px 10px 0px;
    padding: 3px 0px 3px 0px;
    background-color: #1f6e30;
    color: #ffffff;
    text-align: center;
}

#contents.breakfast .cbox.c03 .c03Box.c0303 dl dd .picBox li .pic{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
}



@media (max-width: 767px){
    
    #contents.breakfast .cbox.c03 .c03Box h3{
        font-size: 5vw;
    }
    
    #contents.breakfast .cbox.c03 .c03Box dl dt{
        font-size: 5.5vw;
    }
    
    #contents.breakfast .cbox.c03 .c03Box dl dd .txt{
        font-size: 4.4vw;
    }
    
    #contents.breakfast .cbox.c03 .c03Box.c0303 dl dd .picBox{
        width: 96%;
    }
    
    #contents.breakfast .cbox.c03 .c03Box.c0303 dl dd .picBox li .tit{
        font-size: 3.8vw;
    }
    
    
}




#contents.breakfast .cbox.c04{
    
}


#contents.breakfast .cbox.c04 .c04Box{
    margin: 0px auto 0px;
    padding: 20px 0px 20px 0px;
    width: 96%;
    background-color: #f0f0ec;
}

#contents.breakfast .cbox.c04 .c04Box ul{
    margin: 0px auto;
    width: 80%;
}

#contents.breakfast .cbox.c04 .c04Box ul li{
    margin: 0px 1% 6px 1%;
    padding: 0px 0px 0px 0px;
    width: 48%;
    font-size: 14px;
    font-weight: bold;
}



@media (max-width: 767px){
    
    #contents.breakfast .cbox.c04 .c04Box ul{
            width: 90%;
    }
    
    
    
}




#contents.breakfast .cbox.c05{
    
}

#contents.breakfast .cbox.c05 h2{  
    background: url("../img/breakfast/h2-arrow.png") no-repeat 0px 90%;
    background-size: 20px auto;
}



#contents.breakfast .cbox.c05 .c05Box{
    
}

#contents.breakfast .cbox.c05 .c05Box h3{
    margin: 0px auto 10px;
    padding: 0px 0px 0px 0px;
    width: 94%;
    font-size: 18px;
    font-weight: bold;
}


#contents.breakfast .cbox.c05 .c05Box ul{
    margin: 0px auto 20px;
    padding: 0px 0px 0px 0px;
    display:flex;
    flex-wrap: wrap;
}

#contents.breakfast .cbox.c05 .c05Box ul li{
    margin: 0px 0.5% 20px 0.5%;
    padding: 0px 0px 0px 0px;
    width: 32.33%;
}

#contents.breakfast .cbox.c05 .c05Box ul li .pic{
    margin: 0px 0px 5px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    
}

#contents.breakfast .cbox.c05 .c05Box ul li .ct{
    margin: 0px 0px 5px 0px;
    padding: 5px 0px 5px 0px;
    background-color: #0f6022;
    color: #ffffff;
    text-align:center;    
}


#contents.breakfast .cbox.c05 .c05Box ul li .name{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    text-align: center;
}



@media (max-width: 767px){
    
    #contents.breakfast .cbox.c05 .c05Box ul li .ct{
        font-size: 3vw;
    }
    
    #contents.breakfast .cbox.c05 .c05Box ul li .ct.s{
        margin: 0px 0px 5px 0px;
        padding: 8px 0px 7px 0px;
        font-size: 2.2vw;
    }
    
    #contents.breakfast .cbox.c05 .c05Box ul li .name{
        font-size: 3vw;
    }
    
    #contents.breakfast .cbox.c05 .c05Box.breeder ul li .name{
        text-align:left;
    }
    
}




/*  awblendBox */


.awblendBox{
    margin: 0px auto;
    width: 96%;
}

.awblendBox.set{
    margin: 0px auto 50px;
}

.awblendBox .label{
    margin: 0px 0px 10px 0px;
}

.awblendBox .label span{
    margin: 0px 0px 0px 0px;
    padding: 4px 20px 4px 20px;
    background-color: #cf0f1e;
    color: #ffffff;
    border-radius: 20px;
}

#contents.raw-materials .awblendBox h2{
    margin: 0px 0px 10px 0px;
    max-width: 100%;
    width: 100%;
    font-size: 20px;
    font-weight: bold;
}

#contents.raw-materials .awblendBox .cal{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 0px;
    font-size: 12px;
}

#contents.raw-materials .awblendBox .txtBox{
    margin: 0px 0px 20px 0px;
    padding: 0px 0px 0px 0px;
    
}

#contents.raw-materials .awblendBox .orderBox{
    margin: 0px 0px 20px 0px;
}

#contents.raw-materials .awblendBox .orderBox dl{
    
}

#contents.raw-materials .awblendBox .orderBox dl dt{
    margin: 0px 0px 10px 0px;
    border: solid 1px #05253c;
}

#contents.raw-materials .awblendBox .orderBox dl dt span{
    margin: 0px 0px 0px 0px;
    padding: 4px 0px 4px 0px;
    display:block;
    background-color: #05253c;
    color: #ffffff;
    text-align: center;
    border: 4px solid #ffffff;
    
}

#contents.raw-materials .awblendBox .orderBox a{
    text-decoration: none;
    color: #ffffff;
    display:block;
}


#contents.raw-materials .awblendBox .orderBox p.s{
    margin: 0px 0px 0px 0px;
    font-size: 14px;
}

#contents.raw-materials .awblendBox .orderBox .memo{
    margin: 0px 0px 10px 0px;
}

#contents.raw-materials .awblendBox .orderBox .obox{
    display:flex;
    align-items: center;
}

#contents.raw-materials .awblendBox .orderBox .obox .price{
    width: 33%;
    color: #be1724;
    font-size: 11px;
    font-weight: bold;
    text-align:center;
}

#contents.raw-materials .awblendBox .orderBox .obox .price span{
    font-size: 30px;
}

#contents.raw-materials .awblendBox .orderBox .obox .price em{
    font-style: normal;
    color: #0d0d0d;
}

#contents.raw-materials .awblendBox .orderBox .obox .del{
    width: 28%;
    max-width: 110px;
    
}

#contents.raw-materials .awblendBox .orderBox .obox .btn{
    margin: 0px auto;
    padding: 4px 0px 4px 0px;
    width: 33%;
    background-color: #be1724;
    border-radius: 10px;
    color: #ffffff;
    text-align: center;
}

#contents.raw-materials .awblendBox.blend .orderBox .obox .btn,
#contents.raw-materials .awblendBox.sauce .orderBox .obox .btn{
    background-color: #0f6022;
}


#contents.raw-materials .awblendBox h3{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 28px;
    font-size: 20px;
    font-weight: bold;
    background: url(/resource/img/common/arrow_h3.png) no-repeat left center;
    background-size: 24px auto;
    color: #0f6022;
    text-align:left;
}

#contents.raw-materials .awblendBox h4{
    
    margin: 0px 0px 0px 0px;
    font-weight: bold;
    font-size: 16px;
    
    
    
}



@media (max-width: 767px){
    
    .awblendBox.set{
        margin: 0px auto 50px;
    }

    
    #contents.raw-materials .awblendBox h2{
        font-size: 4.3vw;
        text-align:left;
        
    }
    
    #contents.raw-materials .awblendBox .cal{
        margin: 0px 0px 10px 0px;
        padding: 0px 0px 0px 0px;
        font-size: 3vw;
    }
    
    #contents.raw-materials .awblendBox .orderBox dl dd p{
        font-size: 3vw;
    }
    
    #contents.raw-materials .awblendBox .orderBox dl dd .obox .del{
        width: 28%;

    }
    
    #contents.raw-materials .awblendBox .orderBox dl dd .obox .btn{
        margin: 0px auto;
        width: 33%;
        font-size: 3.4vw;
        font-weight: bold;
    }
    
    
    #contents.raw-materials .awblendBox.sauce .orderBox .obox .btn{
        padding: 5px 0px 5px 0px;
        width: 50%;
        font-size: 4vw;
        font-weight: bold;
    }
    
    #contents.raw-materials .awblendBox h4{

        margin: 0px 0px 0px 0px;
        font-weight: bold;
        font-size: 4vw;

    }
    
    
    
}



.awblendBox .nBox{
    margin: 0px auto;
    width: 96%;
}

.awblendBox .nBox .list .rmn{
    margin: 0px auto 20px;
    display:flex;
    
}

.awblendBox .nBox .list .pic{
    margin: 0px auto;
    width: 40%;
}

.awblendBox .nBox .list .rmnR{
    margin: 0px auto;
    padding: 20px 0px 0px 5px;
    width: 60%;
}

.awblendBox .nBox .list .rmnR .name{
    font-weight: bold;
    font-size: 1.2em;
}







@media (max-width: 767px){
    
  .awblendBox .nBox .list .pic{
        margin: 0px auto;
        width: 40%!important;
    }

    .awblendBox .nBox .list .rmnR{
        margin: 0px auto;
        padding: 20px 0px 0px 5px;
        width: 60%!important;
    }

    .awblendBox .nBox .list .rmnR .name{
        font-weight: bold;
        font-size: 1em;
    }  
    
    .awblendBox .nBox .list .rmnR .txt{
        font-size: 3.4vw;
    }
    
    
}