@charset 'UTF-8';

/*===========================================
pickup_ttl
===========================================*/
.pickup_ttl{
position: relative;
margin-top: 2em;
}
.pickup_ttl .feature{
padding-left: calc(140px + 2em);
justify-content: space-between;
align-items: flex-end;
display: flex;
padding-bottom: 1em;
}
.pickup_ttl .feature .ttl:after{
content: "";
display: block;
position: absolute;
bottom: 0;
left: 0;
right: 0;
width: 100%;
height: 2px;
}
.pickup_ttl .feature .month_color_1.ttl:after{background-color: #E14F4F;}
.pickup_ttl .feature .month_color_2.ttl:after{background-color: #EF835C;}
.pickup_ttl .feature .month_color_3.ttl:after{background-color: #E1829E;}
.pickup_ttl .feature .month_color_4.ttl:after{background-color: #A9BC21;}
.pickup_ttl .feature .month_color_5.ttl:after{background-color: #5BB947;}
.pickup_ttl .feature .month_color_6.ttl:after{background-color: #9768B9;}
.pickup_ttl .feature .month_color_7.ttl:after{background-color: #38B5BE;}
.pickup_ttl .feature .month_color_8.ttl:after{background-color: #3A8EC7;}
.pickup_ttl .feature .month_color_9.ttl:after{background-color: #A1568D;}
.pickup_ttl .feature .month_color_10.ttl:after{background-color: #D98D1B;}
.pickup_ttl .feature .month_color_11.ttl:after{background-color: #AC4D2F;}
.pickup_ttl .feature .month_color_12.ttl:after{background-color: #525B98;}
.pickup_ttl .feature .ttl > *{
font-size: 2.8rem;
line-height: 1.4;
font-weight: bold;
}
.pickup_ttl .month{
display: flex;
justify-content: center;
align-items: center;
width: 140px;
position: absolute;
top: 0;
bottom: 0;
left: 0;
}
.pickup_ttl .month_color_1 .month{background-color: #E14F4F;}
.pickup_ttl .month_color_2 .month{background-color: #EF835C;}
.pickup_ttl .month_color_3 .month{background-color: #E1829E;}
.pickup_ttl .month_color_4 .month{background-color: #A9BC21;}
.pickup_ttl .month_color_5 .month{background-color: #5BB947;}
.pickup_ttl .month_color_6 .month{background-color: #9768B9;}
.pickup_ttl .month_color_7 .month{background-color: #38B5BE;}
.pickup_ttl .month_color_8 .month{background-color: #3A8EC7;}
.pickup_ttl .month_color_9 .month{background-color: #A1568D;}
.pickup_ttl .month_color_10 .month{background-color: #D98D1B;}
.pickup_ttl .month_color_11 .month{background-color: #AC4D2F;}
.pickup_ttl .month_color_12 .month{background-color: #525B98;}
.pickup_ttl .month > *{
color: #fff;
font-size: 3rem;
font-weight: bold;
}
.pickup_ttl .month span{
font-size: 4.5rem;
}
.pickup_ttl .feature .mod_txt_01{
margin-top: 0.5em;
}
.pickup_ttl .feature .btn a{
padding-top: 0.5em;
padding-bottom: 0.5em;
white-space: nowrap;
}

@media screen and (max-width:767px){
.pickup_ttl  .ttl{
position: relative;
padding-left: calc(96px + 1em);
padding-bottom: 0.5em;
}
.pickup_ttl .feature .ttl > *{
font-size: 2.4rem;
line-height: 1.5;
}
.pickup_ttl .month{
position: absolute;
width: 96px;
}
.pickup_ttl .month > *{
font-size: 2rem;
}
.pickup_ttl .month span{
font-size: 3rem;
}
.pickup_ttl .feature{
flex-wrap: wrap;
flex-basis: 100%;
padding: 0;
}
.pickup_ttl .feature .txt{
flex-basis: 100%;
}
.pickup_ttl .feature .mod_txt_01{
margin-top: 1em;
}
.pickup_ttl .feature .btn{
margin: 2em 0 0 auto;
}
}

/*===========================================
theme
===========================================*/
.theme{
position: relative;
}
.theme .theme_inner{
position: relative;
z-index: 1;
}
.theme .ttl{
margin: 0;
}

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

/*===========================================
recipeMovie
===========================================*/
.recipeMovie {
margin-top: 8%;
border: 2px solid #E30934;
}
.recipeMovie .recipeMovie_inner{
padding: 8px;
}
.recipeMovie .flex{
display: flex;
align-items: center;
justify-content: center;
}
.recipeMovie .img{
flex-basis: 39.8%;
}
.recipeMovie .data{
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-basis: 60%;
}
.recipeMovie .data > *{
width: 100%;
padding: 0 20px;
}
.recipeMovie .balloon{
display: flex;
justify-content: center;
margin: auto;
}
.recipeMovie .balloon span{
position: relative;
border-radius: 5px;
margin-bottom: 10px;
padding: 0.5em 1em;
text-align: center;
font-weight: bold;
color: #fff;
background: #E30934;
}
.recipeMovie .balloon span:after{
content: "";
display: block;
position: absolute;
bottom: -9px;
left: 0;
right: 0;
width: 0;
height: 0;
margin: auto;
border-style: solid;
border-width: 10px 6px 0 6px;
border-color: #E30934 transparent transparent transparent;
}
.recipeMovie .ttl{
text-align: center;
}
.recipeMovie .ttl > p{
display: inline-block;
font-size: 3rem;
text-align: left;
}
.recipeMovie .btn{
width: 100%;
max-width: 300px;
margin: 1em auto 0 auto;
}

@media screen and (max-width:767px){
.recipeMovie{
margin-bottom: 100px;
}
.recipeMovie .flex{
flex-wrap: wrap;
}
.recipeMovie .flex > *{
flex-basis: 100%;
}
.recipeMovie .data > *{
padding: 20px 0;
}
.recipeMovie .ttl > p{
text-align: center;
letter-spacing: -1px;
}
.recipeMovie .btn{
padding: 0 20px;
}
}






/* 季節の特集レシピ */
.pickup_ttl .feature .season_color_spring.ttl:after{background-color: #FFB6C7;}
.pickup_ttl .feature .season_color_summer.ttl:after{background-color: #8AD7E1;}
.pickup_ttl .feature .season_color_autumn.ttl:after{background-color: #CC8750;}
.pickup_ttl .feature .season_color_winter.ttl:after{background-color: #BECDD4;}

.pickup_ttl .season{
display: flex;
justify-content: center;
align-items: center;
width: 140px;
position: absolute;
top: 0;
bottom: 0;
left: 0;
}
.pickup_ttl .season_color_spring .season{background-color: #FFB6C7;}
.pickup_ttl .season_color_summer .season{background-color: #8AD7E1;}
.pickup_ttl .season_color_autumn .season{background-color: #CC8750;}
.pickup_ttl .season_color_winter .season{background-color: #460E44;}

.pickup_ttl .season > *{
color: #fff;
font-size: 3rem;
font-weight: bold;
}
.pickup_ttl .season span{
font-size: 4.5rem;
}

@media screen and (max-width:767px){

.pickup_ttl .season{
position: absolute;
width: 96px;
}
.pickup_ttl .season > *{
font-size: 2rem;
}
.pickup_ttl .season span{
font-size: 3rem;
}
}