@charset 'UTF-8';

@media screen and (max-width:767px){
.contents .contents_inner{
    padding: 8% 0 4em 0;
}
}

/*===========================================
recipe_icon
===========================================*/
[class*="recipe_icon_"]{
display: inline-block;
position: relative;
padding-left: calc(25px + 0.25em);
}
[class*="recipe_icon_"]:before{
content: "";
display: block;
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 25px;
height: 25px;
margin: auto;
background: center no-repeat;
background-size: contain;
}
.recipe_icon_cal:before{
background-image: url(/files/user/recipes/image/icon_cal.svg);
}
.recipe_icon_salt:before{
background-image: url(/files/user/recipes/image/icon_salt.svg);
}
.recipe_icon_time:before{
background-image: url(/files/user/recipes/image/icon_time.svg);
}
.recipe_icon_point:before{
width: 23px;
height: 36px;
background-image: url(/files/user/recipes/image/icon_point.svg);
}
.recipe_icon_protein:before{
width: 23px;
height: 36px;
background-image: url(/files/user/recipes/image/icon_protein.svg);
}

@media screen and (max-width:767px){
[class*="recipe_icon_"]{
padding-left: 28px;
}
}

/*===========================================
recipeDetailInfo
===========================================*/
.recipeDetailInfo{
margin-top: 6%;
}
.recipeDetailInfo .img{
flex-basis: 40%;
}
.recipeDetailInfo .img .recipeDetailCap{
margin-top: 1em;
}
.recipeDetailInfo .data{
flex-basis: calc(60% - 40px);
}
.recipeDetailInfo .data .ttl{
margin: 0;
}
.recipeDetailInfo .data * + .ttl{
margin-top: 2em;
}
.recipeDetailInfo .data .shareBtnBlock{
display: flex;
justify-content: flex-end;
margin-top: 0;
}
.recipeDetailInfo .data .shareBtnBlock .btn{
margin-left: 1em;
}
.recipeDetailInfo .data .shareBtnBlock .btn a{
padding-top: 0.5em;
padding-bottom: 0.5em;
padding-left: calc(2em + 8px);
padding-right: calc(2em + 8px);
}
.recipeDetailInfo .recipeList{
counter-reset:count;
margin-top: 1.5em;
}
.recipeDetailInfo .recipeList li{
counter-increment:count;
border-bottom: 1px solid #ddd;
font-weight: bold;
}
.recipeDetailInfo .recipeList li a{
display: block;
padding: 0.75em 0;
text-decoration: none;
background: rgba(0,0,0,0);
}
.recipeDetailInfo .recipeList li a:hover{
background: rgba(0,0,0,0.03);
}
.recipeDetailInfo .recipeList li a:before{
content:counter(count);
display: inline-block;
margin-right: 1.75em;
width: 19px;
height: 19px;
border: 1px solid #E30934;
border-radius: 19px;
color: #E30934;
font-size: 12px;
text-indent: -1px;
letter-spacing: -1px;
font-weight: bold;
text-align: center;
line-height: 19px;
vertical-align: middle;
overflow: hidden;
}
.recipeDetailInfo .recipeData{
margin-top: 2em;
}
.recipeDetailInfo .recipeData tr + tr th,
.recipeDetailInfo .recipeData tr + tr td{
padding-top: 0.5em;
}
.recipeDetailInfo .recipeData th{
padding-right: 2em;
}
.recipeDetailInfo .recipeData .note{
margin-top: 0.5em;
}
.recipeDetailInfo .recipeData .note li{
font-size: 1.4rem;
text-align: right;
}
.recipeDetailInfo .recipeIngredients{
margin-top: 2em;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
padding: 1.5em 1em;
}
.recipeDetailInfo .recipeIngredients dt{
font-weight: bold;
}
.recipeDetailInfo .recipeIngredients dd + dt{
margin-top: 1em;
}
.recipeDetailInfo .recipeIngredients a{
text-decoration: underline;
}
.recipeDetailInfo .recipeRelation{
margin-top: 2em;
}
.recipeDetailInfo .recipeRelation .list li{
font-weight: bold;
}
.recipeDetailInfo .recipeRelation .list li + li{
margin-top: 0.25em;
}
.recipeDetailInfo .recipeRelation .note{
margin-top: 1em;
}
.recipeDetailInfo .recipeRelation .note li{
font-size: 1.4rem;
}
.recipeDetailInfo .movie a{
display: block;
}
.recipeDetailInfo .movie figure{
display: block;
position: relative;
}
.recipeDetailInfo .movie figure:before{
content: '';
display: block;
position: absolute;
width: 31.76%;
height: 0;
padding-top: 31.76%;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
background: url(/files/user/shared/image/icon_play.svg) center no-repeat;
background-size: contain;
opacity: 0.8;
z-index: 1;
}
.recipeDetailInfo .movie figure:after{
content: '';
display: block;
position: absolute;
width: 100%;
height: 100%;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0,0,0,0.2);
}

@media screen and (max-width:767px){
.recipeDetailInfo{
margin-top: 3em;
}
.recipeDetailInfo .img{
flex-basis: 100%;
}
.recipeDetailInfo .data{
flex-basis: 100%;
}
.recipeDetailInfo .data .shareBtnBlock{
display: none;
}
.shareBtnList{
margin-top: 1em;
}
.shareBtnList ul > *{
flex-basis: calc((100% - 10px) / 2);
}
.shareBtnList ul > *:nth-of-type(n + 3){
margin-top: 10px;
}
}

/*===========================================
shareBtnList
===========================================*/
.shareBtnBlock{
margin-top: 3em;
}
.shareBtnList{
padding-bottom: 20px;
}
.shareBtnList .ttl{
margin-top: 0;
}
.shareBtnList ul{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-top: 2em;
}
.shareBtnList ul > *{
display: flex;
flex-basis: calc((100% - 30px) / 4);
}
.shareBtnList a{
flex: 1;
justify-content: center;
display: flex;
flex-wrap: wrap;
position: relative;
border: 1px solid #ccc;
padding: 20px;
font-size: 1.4rem;
font-weight: bold;
}
.shareBtnList a:before{
content: "";
display: block;
width: 55px;
height: 55px;
background: center no-repeat;
background-size: 55px;
}
.shareBtnList .li a:before{
background-image: url(/files/user/shared/image/icon_li.svg);
}
.shareBtnList .tw a:before{
background-image: url(/files/user/shared/image/icon_tw.svg);
}
.shareBtnList .fb a:before{
background-image: url(/files/user/shared/image/icon_fb.svg);
}
.shareBtnList .ml a:before{
background-image: url(/files/user/shared/image/icon_mail.svg);
}
.shareBtnList a span{
flex-basis: 100%;
margin-top: 0.5em;
text-align: center;
}

@media screen and (max-width:767px){
.shareBtnList ul{
margin-top: 1em;
}
.shareBtnList ul > *{
flex-basis: calc((100% - 10px) / 2);
}
.shareBtnList ul > *:nth-of-type(n + 3){
margin-top: 10px;
}
}

/*===========================================
recipeDetailPoint
===========================================*/
.recipeDetailPoint{
margin-top: 2em;
}
.recipeDetailPoint .box{
padding: 20px;
}
.recipeDetailPoint .ttl{
font-size: 2rem;
font-weight: bold;
}

/*===========================================
recipeDescription
===========================================*/
.recipeDescription{
margin-top: 2em;
padding: 0.5em 0;
background: #FAFAFA;
}
.recipeDescription .flex{
display: flex;
justify-content: space-between;
align-items: center;
}
.recipeDescription .ttl{
}
.recipeDescription .ttl > *{
width: 12em;
border-right: 1px solid #ddd;
line-height: 1;
text-align: center;
}
.recipeDescription .list{
margin: 0 auto 0 1em;
}
.recipeDescription .list ul{
display: flex;
}
.recipeDescription .list li{
white-space: nowrap;
margin: 0 0.5em;
}
.recipeDescription [class*="recipe_icon_"]{
display: inline-block;
position: relative;
padding-left: calc(25px + 0.25em);
}
.recipeDescription [class*="recipe_icon_"]:before{
content: "";
display: block;
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 25px;
height: 25px;
margin: auto;
background: center no-repeat;
background-size: contain;
}
.recipeDescription .recipe_icon_cal:before{
background-image: url(/files/user/recipes/image/icon_cal.svg);
}
.recipeDescription .recipe_icon_salt:before{
background-image: url(/files/user/recipes/image/icon_salt.svg);
}
.recipeDescription .recipe_icon_time:before{
background-image: url(/files/user/recipes/image/icon_time.svg);
}
.recipeDescription .recipe_icon_protein:before{
background-image: url(/files/user/recipes/image/icon_protein.svg);
}
.recipeDescription .note{
margin-left: 1em;
padding-right: 1em;
}
.recipeDescription .note p{
font-size: 1.4rem;
}

@media screen and (max-width:767px){
.recipeDescription .flex{
flex-wrap: wrap;
padding: 1em;
}
.recipeDescription .flex > *{
flex-basis: 100%;
}
.recipeDescription .ttl > *{
width: auto;
border: none;
text-align: left;
line-height: 1.7;
}
.recipeDescription .list{
margin: 0;
}
.recipeDescription .list ul{
flex-wrap: wrap;
}
.recipeDescription .list li{
margin: 1em 0 0 0;
margin-right: 0.75em;
font-size: 1.4rem;
}
.recipeDescription .note{
margin: 1em 0 0 0;
padding: 0;
}
.recipeDescription [class*="recipe_icon_"]{
padding-left: 25px;
}
}



/*===========================================
recipeDetail
===========================================*/
.recipeDetail{
margin-top: 8%;
}
.recipeDetail .recipeDetailTtl{
border-top: 1px solid #E30934;
padding-top: 1.5em;
}
.recipeDetail .recipeDetailTtl > *{
color: #E30934;
font-size: 2.8rem;
font-weight: bold;
}
.recipeDetail .recipeDetailColumn{
margin-top: 2em;
}
.recipeDetail .recipeDetailColumn .ttl{
margin-top: 0;
}
.recipeDetail .recipeDetailColumn .ttl small{
font-size: 2rem;
}
.recipeDetail .nutritionTable{
margin-top: 2em;
}
.recipeDetail .nutritionTable .link{
margin-top: 1em;
text-align: right;
}
.recipeDetail .nutritionTable .flex{
display: flex;
margin-top: 1em;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
}
.recipeDetail .nutritionTable .flex > *{
flex-grow: 1;
}
.recipeDetail .nutritionTable table{
width: 100%;
}
.recipeDetail .nutritionTable th,
.recipeDetail .nutritionTable td{
width: 50%;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
padding: 0.5em 1em;
white-space: nowrap;
}
.recipeDetail .nutritionTable th{
font-weight: bold;
text-align: center;
background: #fafafa;
}
.recipeDetail .nutritionTable td{
font-size: 1.5rem;
}
.recipeDetail .note{
margin-top: 1em;
}
.recipeDetail .note li,
.recipeDetail .note p{
font-size: 1.4rem;
}

@media screen and (max-width:767px){
.recipeDetail{
margin-top: 6em;
}
.recipeDetail .recipeDetailColumn > .mod_flex > * + *{
margin-top: 3em;
}
.recipeDetail .recipeDetailColumn .ttl small{
font-size: 1.8rem;
}
.recipeDetail .recipeDetailTtl > *{
font-size: 2.4rem;
}
.recipeDetail .nutritionTable .flex{
flex-wrap: wrap;
}
.recipeDetail .nutritionTable .flex > *{
flex-basis: 100%;
}
.recipeDetail .nutritionTable th{
text-align: left;
}
}

/*===========================================
ingredient
===========================================*/
.ingredient{
margin-top: 0.5em;
}
.ingredient > ul > li,
.ingredient > ul > li > div{
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
border-bottom: 1px solid #ddd;
padding: 1em 0;
}
.ingredient > ul > li > p{
margin: 0 auto 0 0;
}
.ingredient > ul > li > p:last-child{
margin: 0 0 auto auto;
padding-left: 1em;
text-align: right;
white-space: nowrap;
}
.ingredient > ul > li > div{
flex-basis: 100%;
border: none;
padding: 0;
}
.ingredient > ul > li > div + div{
margin-top: 0.5em;
}
.ingredient > ul > li .group{
flex-basis: 3em;
margin: 0 0 auto 0;
font-size: 1.4rem;
}
.ingredient > ul > li .group span{
display: block;
width: 2em;
height: 2em;
margin-right: 1em;
color: #fff;
font-weight: bold;
line-height: 2em;
text-align: center;
vertical-align: middle;
background: #E30934;
}
.ingredient > ul > li a{
display: block;
text-decoration: underline;
}
.ingredient > ul > li p img{
width: 107px;
}
.ingredient .note{
font-size: 1.4rem;
}

/*===========================================
recipeRelatedArticleBox
===========================================*/
.recipeRelatedArticleBox{
margin-top: 10%;
}
.recipeRelatedArticleBox .box{
border-color: #E30934;
padding: 18px;
}
.recipeRelatedArticleBox .img{
display: flex;
align-items: center;
flex-basis: 41.49%;
}
.recipeRelatedArticleBox .data{
flex-basis: calc(58.51% - 30px);
display: flex;
flex-wrap: wrap;
}
.recipeRelatedArticleBox .txt{
flex-basis: 100%;
}
.recipeRelatedArticleBox .txt > * + *{
margin-top: 0.25em;
}
.recipeRelatedArticleBox .ttl > *{
font-size: 2rem;
font-weight: bold;
}
.recipeRelatedArticleBox .btn{
flex-basis: 100%;
max-width: 300px;
margin: auto auto 0 auto;
}
.recipeRelatedArticleBox .btn p{
margin-top: 1em;
}

@media screen and (max-width:767px){
.recipeRelatedArticleBox .box{
padding: 8px;
}
.recipeRelatedArticleBox .img{
flex-basis: 100%;
}
.recipeRelatedArticleBox .data{
flex-basis: 100%;
margin-top: 1.5em;
padding: 0 10px 1em 10px;
}
.recipeRelatedArticleBox .txt{
margin-top: 1em;
}
.recipeRelatedArticleBox .btn{
margin-top: 1.5em;
}
}

/*===========================================
recipeList_3_1
===========================================*/
.recipeList_3_1{
margin-top: 2em;
}
.recipeList_3_1 .mod_flex > *{
display: flex;
}
.recipeList_3_1 .mod_flex > *:nth-of-type(n + 4){
margin-top: 60px;
}
.recipeList_3_1 a{
display: flex;
align-items: flex-start;
flex-wrap: wrap;
position: relative;
flex-basis: 100%;
padding-top: 69.35%;
}
.recipeList_3_1 a > *{
flex-basis: 100%;
}
.recipeList_3_1 .img{
position: absolute;
top: 0;
left: 0;
right: 0;
width: 100%;
}
.recipeList_3_1 .img figure{
display: block;
position: relative;
height: 0;
padding-top: 69.35%;
}
.recipeList_3_1 .img img{
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
width: 100%;
height: 100%;
}
.recipeList_3_1 .txt{
display: flex;
flex-wrap: wrap;
margin: 1em 0;
}
.recipeList_3_1 .txt .ttl{
flex-basis: 100%;
}
.recipeList_3_1 .cap{
margin-top: 0.5em;
}
.recipeList_3_1 .data{
margin: auto 0 0 0;
background: #FAFAFA;
}
.recipeList_3_1 .data ul{
display: flex;
justify-content: center;
flex-wrap: wrap;
padding-bottom: 0.75em;
}
.recipeList_3_1 .data li{
margin: 0.75em 0.33em 0 0.33em;
font-size: 1.5rem;
}
.recipeList_3_1 .icon_allergy{
margin-top: 0.5em;
margin-right: 5px;
}
.recipeList_3_1 .icon_allergy > *{
display: inline-block;
border: 1px solid #E30934;
padding: 0.25em 1em;
color: #E30934;
font-size: 1.2rem;
}
.recipeList_3_1 .icon_chukameisai{
margin-top: 0.5em;
margin-right: 5px;
}
.recipeList_3_1 .icon_chukameisai > *{
display: inline-block;
border: 1px solid #E30934;
padding: 0.25em 1em;
color: #E30934;
font-size: 1.2rem;
}

@media screen and (max-width:767px){
.recipeList_3_1.mod_itemList_3_1 > .mod_flex > *:nth-of-type(n + 2) {
margin-top: 15%;
}
}

/*===========================================
recipeNav
===========================================*/
.recipeNav{
padding: 0 20px;
}
.recipeNav .recipeNav_wrap{
max-width: 1000px;
margin: auto;
}
.recipeNav .recipeNav_inner{
padding: 100px 0 0 0;
}
.recipeNav a{
display: block;
}
.recipeNav .img {
position: relative;
height: 0;
padding-top: 48%;
margin-bottom: 0.5em;
overflow: hidden;
}
.recipeNav .img img {
transform: translateY(-50%);
position: absolute;
top: 50%;
left: 0;
}
.recipeNav .btn{
max-width: 300px;
margin: 4% auto 0 auto;
}

@media screen and (max-width:767px){
.recipeNav .recipeNav_inner{
padding: 5em 0 0 0;
}
.recipeNav .btn{
margin-top: 2em;
}
}

/*===========================================
recipeContents
===========================================*/
.recipeContents{
padding: 0 20px;
background: url(/files/user/recipes/image/recipecontents_bg_01.jpg) center no-repeat;
background-size: cover;
}
.recipeContents .recipeContentsWrap{
max-width: 1000px;
margin: auto;
}
.recipeContents .recipeContentsInner{
padding: 6% 0;
}
.recipeContents * + .recipeContentsTtl{
margin-top: 8%;
}
.recipeContents .recipeContentsTtl > *{
font-size: 2.8rem;
color: #fff;
font-weight: bold;
text-align: center;
}
.recipeContents .list{
margin-top: 2em;
}
.recipeContents .list + .list{
margin-top: 3em;
}
.recipeContents .mod_btn_01{
background: #fff;
border-radius: 3em;
}
.recipeContents .mod_bnrBtn_01{
background-color: #fff;
}

@media screen and (max-width:767px){
.recipeContents .recipeContentsInner{
padding: 4em 0;
}
}

/*===========================================
listFlowCooking
===========================================*/
.listFlowCooking{
margin-top: 0.5em;
}
.listFlowCooking > ul > li{
display: flex;
justify-content: space-between;
border-bottom: 1px solid #ddd;
padding: 1em 0;
}
.listFlowCooking > ul > li > *{
flex-basis: calc(100% - 3em);
}
.listFlowCooking > ul > li > *:first-child{
flex-basis: 2em;
white-space: nowrap;
color: #E30934;
font-weight: bold;
}
.listFlowCooking > ul > li > .flex{
display: flex;
justify-content: space-between;
}
.listFlowCooking > ul > li > .flex > p:first-child{
padding-right: 1em;
}
.listFlowCooking > ul > li > .flex img{
width: auto;
}

@media screen and (max-width:767px){
.listFlowCooking > ul > li > p:first-child{
position: absolute;
}
.listFlowCooking > ul > li > p + p{
padding: 0 0 0 3em;
}
.listFlowCooking > ul > li > .flex{
flex: 1;
flex-wrap: wrap;
}
.listFlowCooking > ul > li > .flex > p{
flex-basis: 100%;
}
.listFlowCooking > ul > li > .flex > p:first-child{
flex-basis: auto;
padding: 0 0 0 3em;
}
.listFlowCooking > ul > li > .flex img{
margin: 0.5em auto 0 auto;
}
}

/*===========================================
recipeSearch
===========================================*/
.recipeSearch_block{
padding: 0 20px;
background: url(/files/user/recipes/image/recipesearch_bg_01.jpg) center no-repeat;
background-size: cover;
}
.recipeSearch_block .recipeSearch_wrap{
max-width: 1000px;
margin: auto;
}
.recipeSearch_block .recipeSearch_inner{
padding: 6% 0;
}
.recipeSearch_block .recipeSearch_ttl > *{
color: #fff;
font-size: 2.8rem;
font-weight: bold;
text-align: center;
}
#recipeSearch{
margin-top: 3%;
background: #fff;
}
#recipeSearch .recipeSearchHeader{
padding: 40px 20px 0 20px;
}
#recipeSearch .recipeSearchHeader .flex{
display: flex;
justify-content: space-between;
align-items: flex-end;
}
#recipeSearch .recipeSearchHeader .keyword{
display: flex;
align-items: center;
flex-basis: 100%;
}
#recipeSearch .recipeSearchHeader .keyword .ttl{
font-weight: bold;
white-space: nowrap;
}
#recipeSearch .recipeSearchHeader .keyword .search{
position: relative;
width: 100%;
margin-left: 1em;
border: 1px solid #666;
border-radius: 35px;
overflow: hidden;
}
#recipeSearch .recipeSearchHeader .keyword .search .recipeSearch_submit{
position: absolute;
top: 0;
bottom: 0;
right: 0;
width: 48px;
margin: auto;
border: none;
border-top-right-radius: 35px;
border-bottom-right-radius: 35px;
background: url(/files/user/shared/image/icon_search.svg) center no-repeat;
background-size: 16px;
cursor: pointer;
outline: none;
}
#recipeSearch .recipeSearchHeader .keyword .search input{
width: 100%;
border: none;
padding: 1em 35px 1em 1.5em;
font-size: 1.3rem;
background: transparent;
outline: none;
}
#recipeSearch .recipeSearchHeader .btn{
display: none;
}
#recipeSearch .recipeSearchHeader .btn a{
display: block;
position: relative;
width: 100%;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
padding: 1.33em 1em;
color: #fff;
text-align: center;
font-weight: bold;
background: #E30934;
}
#recipeSearch .recipeSearchHeader .btn a.accordion:after {
transform: none;
content: '';
display: block;
position: absolute;
width: 12px;
height: 12px;
top: 0;
bottom: 0;
right: 20px;
margin: auto;
border: none;
background: url(/files/user/shared/image/icon_plus_wh.svg) center no-repeat;
background-size: contain;
}
#recipeSearch .recipeSearchHeader .btn a.accordion.open:after {
background-image: url(/files/user/shared/image/icon_minus_wh.svg);
}
#recipeSearch .recipeSearchBody{
margin-top: 40px;
}
#recipeSearch .recipeSearchBody .box{
padding: 0 20px 20px 20px;
background: transparent;
}
#recipeSearch .recipeSearchBody .flex{
position: relative;
display: flex;
justify-content: space-between;
}
#recipeSearch .recipeSearchBody .flex:after{
content: "";
display: block;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
width: 1px;
height: 100%;
margin: auto;
background: #ddd;
}
#recipeSearch .recipeSearchBody .flex > *{
flex-basis: calc((100% - 40px) / 2);
}
#recipeSearch .recipeSearchBody .flex > *:nth-of-type(2n){
margin: 0 0 0 auto;
}
#recipeSearch .recipeSearchBody .ttl{
margin-top: 1em;
}
#recipeSearch .recipeSearchBody .ttl > *{
color: #E30934;
font-size: 2rem;
font-weight: bold;
text-align: center;
}
#recipeSearch .recipeSearchBody .list{
margin-top: 1em;
}
#recipeSearch .recipeSearchBody .list ul{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#recipeSearch .recipeSearchBody .list li{
display: flex;
margin-bottom: 5px;
background: #fff;
}
#recipeSearch .recipeSearchBody .list .column2{
flex-basis: calc((100% - 5px) / 2);
}
#recipeSearch .recipeSearchBody .list .column3{
flex-basis: calc((100% - 10px) / 3);
}
#recipeSearch .recipeSearchBody .list .column4{
flex-basis: calc((100% - 15px) / 4);
}
#recipeSearch .recipeSearchBody .list li a{
display: flex;
flex-basis: 100%;
align-items: center;
min-height: 4.5em;
justify-content: center;
border: 1px solid #ddd;
font-size: 1.5rem;
background: #fff;
}
#recipeSearch .recipeSearchBody .list li span{
display: block;
padding: 0.5em;
text-align: center;
}
#recipeSearch .recipeSearchBody .ingredient .mod_list_check ul{
display: flex;
flex-wrap: wrap;
}
#recipeSearch .recipeSearchBody .ingredient .mod_list_check li{
margin-right: 1.5em;
}
#recipeSearch .recipeSearchBody .type .mod_list_radio ul{
display: flex;
flex-wrap: wrap;
}
#recipeSearch .recipeSearchBody .type .mod_list_radio li{
margin-right: 1.5em;
}
#recipeSearch .recipeSearchBody .type .mod_list_radio li.fb100p{
flex-basis: 100%;
}

#recipeSearch .recipeSearchBody .requirement{
margin-top: 40px;
border: 2px solid #E30934;
border-radius: 10px;
padding: 20px;
background: #fff;
}
#recipeSearch .recipeSearchBody .requirement .ttl{
margin-top: 0;
}
#recipeSearch .recipeSearchBody .requirement .ttl > *{
color: #333;
}
#recipeSearch .recipeSearchBody .requirement .selectBlock{
display: flex;
justify-content: space-between;
border-top: 1px solid #ddd;
padding: 1em 20px;
}
#recipeSearch .recipeSearchBody .requirement .selectBlock .ttl{
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
flex-basis: 21.5%;
margin-right: 2em;
}
#recipeSearch .recipeSearchBody .requirement .selectBlock .ttl > *{
position: relative;
flex-basis: 100%;
}
#recipeSearch .recipeSearchBody .requirement .selectBlock .ttl > *:before{
content: "";
display: block;
width: 57px;
height: 46px;
margin: 0 auto 0.5em auto;
background: center no-repeat;
background-size: contain;
}
#recipeSearch .recipeSearchBody .requirement .ingredient .ttl > *:before{
background-image: url(/files/user/recipes/image/icon_ingredient_red.svg);
}
#recipeSearch .recipeSearchBody .requirement .type .ttl > *:before{
background-image: url(/files/user/recipes/image/icon_type_red.svg);
}
#recipeSearch .recipeSearchBody .requirement .selectBlock .subTtl{
font-weight: bold;
}
#recipeSearch .recipeSearchBody .requirement .inputBlock > * + *{
margin-top: 0.5em;
}
#recipeSearch .recipeSearchBody .requirement .inputBlock{
flex-basis: 33%;
margin-right: 2em;
}
#recipeSearch .recipeSearchBody .requirement .inputBlock:last-child{
flex-basis: 41.5%;
margin-right: 0;
}
#recipeSearch .recipeSearchBody .requirement .inputBlock .list{
margin-top: 1em;
}
#recipeSearch .recipeSearchBody .requirement .select{
border: 1px solid #ccc;
background: #fafafa;
}
#recipeSearch .recipeSearchBody .requirement select{
width: 100%;
border: none;
padding: 1em 0.5em;
background-color: transparent;
outline: none;
}
#recipeSearch .recipeSearchBody .requirement .result{
position: relative;
padding: 1em;
background: #F5F5F5;
}
#recipeSearch .recipeSearchBody .requirement .result_inner{
display: flex;
justify-content: center;
}
#recipeSearch .recipeSearchBody .requirement .result .txt{
padding: 0 1em;
text-align: center;
}
#recipeSearch .recipeSearchBody .requirement .result .txt p{
display: inline-block;
text-align: center;
font-weight: bold;
}
#recipeSearch .recipeSearchBody .requirement .result span{
color: #E30934;
font-size: 2.4rem;
}
#recipeSearch .recipeSearchBody .requirement .result .btn{
width: 100%;
max-width: 14em;
margin: 0 0 0 2em;
}
#recipeSearch .recipeSearchBody .requirement .result .btn > *{
flex-basis: 100%;
}
#recipeSearch .recipeSearchBody .requirement .result .btn > * > *{
display: block;
position: relative;
width: 100%;
border: 1px solid #e30934;
border-radius: 3em;
padding: 0.5em;
padding-left: calc(1.25em + 8px);
padding-right: calc(1.25em + 8px);
font-size: 1.5rem;
color: #e30934;
font-weight: bold;
text-align: center;
text-decoration: none;
background: #fff;
cursor: pointer;
}
#recipeSearch .recipeSearchBody .requirement .result .btn > * > *:after{
transform: rotate(45deg);
content: "";
display: block;
position: absolute;
top: 0;
bottom: 0;
right: 15px;
width: 8px;
height: 8px;
margin: auto;
border-top: 2px solid #e30934;
border-right: 2px solid #e30934;
}

@media screen and (min-width:768px){
#recipeSearch .recipeSearchBody{
height: auto !important;
}
}

@media screen and (max-width:767px){
#recipeSearch .recipeSearch_inner{
padding: 4em 0 80px 0;
}
#recipeSearch .recipeSearch_block{
margin-top: 2em;
}
#recipeSearch .recipeSearchHeader .flex{
flex-wrap: wrap;
border-bottom: 1px solid #ddd;
}
#recipeSearch .recipeSearchHeader .keyword {
flex-basis: 100%;
flex-wrap: wrap;
padding: 0;
}
#recipeSearch .recipeSearchHeader .keyword .search{
margin: 0.5em 0 0 0;
}
#recipeSearch .recipeSearchHeader .btn {
display: block;
margin: 2em 0 0 auto;
flex-basis: 15em;
}
#recipeSearch .recipeSearchHeader .btn a{
padding-top: 0.75em;
padding-bottom: 0.75em;
}
#recipeSearch .recipeSearchBody .flex{
flex-wrap: wrap;
}
#recipeSearch .recipeSearchBody .flex > *{
flex-basis: 100%;
}
#recipeSearch .recipeSearchBody .flex:after{
content: normal;
}
#recipeSearch .recipeSearchBody .flex .menu{
margin-top: 2em;
border-top: 1px solid #F1DDE1;
}
#recipeSearch .recipeSearchBody .flex .menu .ttl{
margin-top: 2em;
}
#recipeSearch .recipeSearchBody .list li a{
min-height: 3.5em;
}
#recipeSearch .recipeSearchBody .category .list li:nth-of-type(1),
#recipeSearch .recipeSearchBody .category .list li:nth-of-type(2),
#recipeSearch .recipeSearchBody .category .list li:nth-of-type(3),
#recipeSearch .recipeSearchBody .category .list li:nth-of-type(4){
flex-basis: calc((100% - 10px) / 3);
}
#recipeSearch .recipeSearchBody .category .list li:nth-of-type(5){
flex-basis: calc(((100% - 10px) / 3) * 2 + 5px);
}
#recipeSearch .recipeSearchBody .category .list li:nth-of-type(6),
#recipeSearch .recipeSearchBody .category .list li:nth-of-type(7){
flex-basis: calc((100% - 5px) / 2);
}
#recipeSearch .recipeSearchBody .category .list li:nth-of-type(8),
#recipeSearch .recipeSearchBody .category .list li:nth-of-type(9),
#recipeSearch .recipeSearchBody .category .list li:nth-of-type(10){
flex-basis: calc((100% - 10px) / 3);
}
#recipeSearch .recipeSearchBody .category .list li:nth-of-type(11){
flex-basis: calc(100%);
}
#recipeSearch .recipeSearchBody .menu .list li:nth-of-type(1),
#recipeSearch .recipeSearchBody .menu .list li:nth-of-type(2),
#recipeSearch .recipeSearchBody .menu .list li:nth-of-type(3){
flex-basis: calc((100% - 10px) / 3);
}
#recipeSearch .recipeSearchBody .menu .list li:nth-of-type(4),
#recipeSearch .recipeSearchBody .menu .list li:nth-of-type(5),
#recipeSearch .recipeSearchBody .menu .list li:nth-of-type(6),
#recipeSearch .recipeSearchBody .menu .list li:nth-of-type(7){
flex-basis: calc((100% - 5px) / 2);
}
#recipeSearch .recipeSearchBody .requirement .selectBlock{
flex-wrap: wrap;
padding: 0;
}
#recipeSearch .recipeSearchBody .requirement .type{
margin-top: 1.5em;
}
#recipeSearch .recipeSearchBody .ttl > *{
font-size: 1.8rem;
}
#recipeSearch .recipeSearchBody .requirement .selectBlock .ttl{
flex-basis: 100%;
margin: 1.5em 0 0 0;
}
#recipeSearch .recipeSearchBody .requirement .selectBlock .ttl > *{
text-align: left;
}
#recipeSearch .recipeSearchBody .requirement .selectBlock .ttl > *:before{
display: inline-block;
width: 35px;
height: 28px;
margin: 0 0.5em 0 0;
vertical-align: middle;
}
#recipeSearch .recipeSearchBody .requirement .inputBlock{
flex-basis: 100%;
margin: 0;
}
#recipeSearch .recipeSearchBody .requirement .inputBlock:last-child{
flex-basis: 100%;
}
#recipeSearch .recipeSearchBody .requirement .selectBlock .subTtl{
margin-top: 1em;
}
#recipeSearch .recipeSearchBody .ingredient .mod_list_check li{
flex-basis: 100%;
margin: 0;
}
#recipeSearch .recipeSearchBody .type .mod_list_radio li{
flex-basis: 100%;
margin: 0;
}
#recipeSearch .recipeSearchBody .type .mod_list_radio li + li{
margin: 0.5em 0 0 0;
}
#recipeSearch .recipeSearchBody .requirement .result{
margin-top: 2em;
}
#recipeSearch .recipeSearchBody .requirement .result_inner {
flex-wrap: wrap;
}
#recipeSearch .recipeSearchBody .requirement .result .txt{
width: 100%;
}
#recipeSearch .recipeSearchBody .requirement .result .txt p{
text-align: left;
}
#recipeSearch .recipeSearchBody .requirement .result span{
font-size: 2rem;
}
#recipeSearch .recipeSearchBody .requirement .result .btn{
margin: 1em 0 0 0;
}
}

/*===========================================
kazarigiriContents
===========================================*/
.kazarigiriContents{
background: url(/files/user/recipes/image/kazarigiri_bg_01.jpg) bottom center no-repeat;
background-size: cover;
}
.kazarigiriContents .kazarigiriContents_wrap{
max-width: 1000px;
margin: auto;
}
.kazarigiriContents .ttl > *{
color: #fff;
font-size: 2.8rem;
text-align: center;
font-weight: bold;
}
.kazarigiriContents .box1{
padding: 0 20px;
}
.kazarigiriContents .box1 .kazarigiriContents_inner{
padding: 8% 0;
}
.kazarigiriContents .box1 .list{
margin-top: 2em;
}
.kazarigiriContents .box1 .mod_bnrBtn_01{
background: #fff;
}
.kazarigiriContents .list a{
background: #fff;
}
.kazarigiriContents .box2{
padding: 0 20px;
background: rgba(255,255,255,0.8);
}
.kazarigiriContents .box2 .kazarigiriContents_inner{
padding: 5% 0;
}
.kazarigiriContents .box2 .mod_btn_01{
border-radius: 3em;
background: #fff;
}

@media screen and (max-width:767px){
.kazarigiriContents{
background-size: auto 135%;
}
.kazarigiriContents .ttl > *{
font-size: 2.4rem;
}
.kazarigiriContents .box1 .kazarigiriContents_inner{
padding-top: 3em;
padding-bottom: 3em;
}
.kazarigiriContents .box2 .kazarigiriContents_inner{
padding-top: 2em;
padding-bottom: 2em;
}
}

/*===========================================
meatContents
===========================================*/
.meatContents{
background: url(/files/user/recipes/image/meat_bg_01.jpg) bottom center no-repeat #ccc;
background-size: cover;
}
.meatContents .meatContents_wrap{
max-width: 1000px;
margin: auto;
}
.meatContents .meatContents_inner{
padding: 8% 0;
}
.meatContents .ttl > *{
color: #fff;
font-size: 2.8rem;
text-align: center;
font-weight: bold;
}
.meatContents .box1{
padding: 0 20px;
}
.meatContents .box1 .meatContents_inner{
padding: 8% 0;
}
.meatContents .box1 .column{
display: flex;
justify-content: space-between;
margin-top: 2em;
padding: 40px 0;
background: #fff;
}
.meatContents .box1 .column > *:nth-of-type(1){
flex-grow: 1;
border-right: 1px solid #ddd;
}
.meatContents .box1 .column > *:nth-of-type(2){
flex-basis: 67.2%;
}
.meatContents .box1 .btn{
padding: 0 40px;
}
.meatContents .box1 .btn a{
padding-top: 0;
padding-bottom: 0;
white-space: nowrap;
font-size: 2rem;
}
.meatContents .box1 .btn a:before{
top: 0.25em;
}
.meatContents .box1 .btn a:after{
top: 0.7em;
}
.meatContents .box1 .list{
padding: 0 40px;
}
.meatContents .box1 .list ul{
display: flex;
flex-wrap: wrap;
}
.meatContents .box1 .list li{
flex-basis: 50%;
padding-left: 0;
text-indent: 0;
}
.meatContents .box1 .list li:nth-of-type(n + 3){
margin-top: 0.5em;
}
.meatContents .box1 .list li a{
display: inline-block;
}
.meatContents .box1 .list li:nth-of-type(odd) a{
margin-right: 1em;
}
.meatContents .box2{
padding: 0 20px;
background: rgba(255,255,255,0.8);
}
.meatContents .box2 .meatContents_inner{
padding: 5% 0;
}
.meatContents .box2 .mod_btn_01{
border-radius: 3em;
background: #fff;
}

@media screen and (max-width:767px){
.meatContents{
margin-top: 4em;
}
.meatContents .ttl > *{
font-size: 2.4rem;
}
.meatContents .box1 .btn{
padding: 0 30px;
}
.meatContents .box1 .column{
flex-wrap: wrap;
padding: 30px 0;
}
.meatContents .box1 .column > *:nth-of-type(1){
flex-basis: 100%;
}
.meatContents .box1 .column > *:nth-of-type(2){
flex-basis: 100%;
}
.meatContents .box1 .list{
margin-top: 1.5em;
padding: 0 30px;
}
.meatContents .box1 .list li{
flex-basis: 100%;
}
.meatContents .box1 .list li:nth-of-type(n + 2){
margin-top: 0.75em;
}
.meatContents .box2 .meatContents_inner{
padding-top: 2em;
padding-bottom: 2em;
}
}

/*===========================================
recipeTop
===========================================*/
.recipeTop{
max-width: 1000px;
margin: auto;
}
.recipeTop .recipeTop_inner{
padding: 75px 0 100px 0;
}
.recipeTop .btn{
box-sizing: content-box;
max-width: 300px;
margin: 0 auto;
padding: 0 20px;
}

@media screen and (max-width:767px){
.recipeTop .recipeTop_inner{
padding: 3em 0 0 0;
}
}


/*===========================================
print
===========================================*/
@media print {
.recipeDetailInfo .data .shareBtnBlock{
display: flex !important;
}
}