/* fv */
.fv{
    background: url(../img/step4/bg_fv.png) #FFF no-repeat;
    background-size: cover;
    background-position: center top;
    padding: 1.5% 0 29.8%;
}

.fv .txt_fv{
    width: 76vw;
    margin: 33% auto 0;
    font-size: 1.9vw;
    text-align: center;
    line-height: 1.8;
}

@media screen and (max-width: 768px){
    .fv{
        background: url(../img/step4/bg_fv_sp.png) #FFF no-repeat;
        background-size: cover;
        background-position: center top;
        padding: 5% 0 89%;
    }
    .fv .txt_fv{
        width: 86vw;
        margin: 88% auto 0;
        font-size: 4.4vw;
        line-height: 1.7;
    }
}

/* menu */
.menu{
    background: url(../img/step4/bg_menu.png) no-repeat;
    background-size: 100% auto;
    background-position: center bottom;
    margin: -19% 0 0;
}

.menu_list{
    background: #FCCDCA;
    padding: 4% 5% 4%;
}

.menu_list ul li.first::before{
    position: absolute;
    top:5%;
    left: 0.2%;
    content: "";
    width: 3vw;
    height:3vw;
    background: url(../img/step4/icon_menu_01.svg) no-repeat;
    background-size: 100% auto;
    background-position: left center;
}
.menu_list ul li.second::before{
    position: absolute;
    top:5%;
    left: 34.3%;
    display: block;
    content: "";
    width: 3vw;
    height:3vw;
    background: url(../img/step4/icon_menu_02.svg) no-repeat;
    background-size: 100% auto;
    background-position: left center;
}
.menu_list ul li.third::before{
    position: absolute;
    top:5%;
    left: 73.6%;
    display: block;
    content: "";
    width: 3vw;
    height:3vw;
    background: url(../img/step4/icon_menu_03.svg) no-repeat;
    background-size: 100% auto;
    background-position: left center;
}


@media screen and (max-width: 768px){
    .menu{
        background: url(../img/step4/bg_menu_sp.png) no-repeat;
        background-size: 100% auto;
        background-position: center bottom;
        padding: 0 0 30%;
        margin:-76% 0 0;
    }
    .menu_list ul li.first::before{
        position: absolute;
        top: 5%;
        left: 12%;
        display: block;
        content: "";
        width: 9vw;
        height: 9vw;
        background: url(../img/step4/icon_menu_01.svg) no-repeat;
        background-size: 100% auto;
        background-position: left center;
    }
    .menu_list ul li.second::before{
        position: absolute;
        top: 38%;
        left: 12%;
        display: block;
        content: "";
        width: 9vw;
        height: 9vw;
        background: url(../img/step4/icon_menu_02.svg) no-repeat;
        background-size: 100% auto;
        background-position: left center;
    }
    .menu_list ul li.third::before{
        position: absolute;
        top: 71%;
        left: 12%;
        display: block;
        content: "";
        width: 9vw;
        height: 9vw;
        background: url(../img/step4/icon_menu_03.svg) no-repeat;
        background-size: 100% auto;
        background-position: left center;
    }
}

/* sale */
.sale{
    background: #FCCDCA;
    background: url(../img/step4/bg_sale.png) #FCCDCA no-repeat;
    background-size: 100% auto;
    background-position: center bottom;
    padding: 4% 0 16%;
    margin: -0.3% 0 0;
}

.sale h2{
    width: 34vw;
    margin: 0 auto 2%;
}

.sale .txt_sale{
    width: 66vw;
    margin: 0 auto 2%;
    font-size:1.6vw;
    line-height: 1.5;
    text-align: center;
}
.sale .sale_list{
    width: 60vw;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2%;
}
.sale .sale_list li{
    width: 47%;
    line-height: 1.5;
    margin: 0 0 2%;
}
.sale .sale_list li a{
    display: block;
}

.sale .modal-content .txt_modal{
    text-align: center;
}

.modal-content .shop_list{
    width:66%;
    margin: 0 auto;
}

@media screen and (max-width: 768px){
    .sale{
        background: #FCCDCA;
        background: url(../img/step4/bg_sale_sp.png) #FCCDCA no-repeat;
        background-size: 100% auto;
        background-position: center bottom;
        padding: 10% 0 28%;
        margin: -0.5% auto 0;
    }
    .sale h2{
        width: 80vw;
        margin: 0 auto 4%;
    }
    .sale .txt_sale{
        width: 78vw;
        margin: 0 auto 4%;
        font-size:4vw;
        line-height: 1.7;
        text-align: left;
    }
    .sale .sale_list{
        width: 90vw;
        display: block;
    }
    .sale .sale_list li{
        width: 100%;
        line-height: 1.5;
        margin: 0 0 2%;
    }
    .sale .modal-content .txt_modal{
        text-align: left;
    }
    .modal-content .shop_list{
        width:100%;
    }
}

/* pointup */
.pointup{
    background: url(../img/step4/bg_pointup.png) repeat-y;
    background-size: 100% auto;
    padding:4% 0 16%;
    margin: -0.3% 0 0;
}
.pointup h2{
    width: 36vw;
    margin: 0 auto 2%;
}
.pointup .txt_pointup{
    width: 62vw;
    margin: 0 auto 2%;
    font-size:1.6vw;
    line-height: 1.5;
    text-align: center;
}
.pointup .pointup_list{
    width: 48vw;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content:  space-between;
}
.pointup .pointup_list li{
    width: 30%;
    margin: 0 0 4%;
}

.pointup .pointup_list li a{
    display: block;
}
.pointup .modal-content .txt_modal{
    text-align: center;
}
.pointup .btn_pointup{
    width: 48vw;
    margin: 2% auto 0;
}

@media screen and (max-width: 768px){
    .pointup{
        background: url(../img/step4/bg_pointup_sp.png) repeat-y;
        background-size: 100% auto;
        padding:12% 0 22%;
        margin: -0.4% auto 0;
    }
    .pointup h2{
        width: 86vw;
        margin: 0 auto 4%;
    }
    .pointup .txt_pointup{
        width: 76vw;
        margin: 0 auto 4%;
        font-size:4vw;
        line-height: 1.7;
        text-align: left;
    }
    .pointup .pointup_list{
        width: 76vw;
        display: flex;
        gap: 4%;
    }
    .pointup .pointup_list li{
        width: 48%;
        margin: 0 0 6%;
    }
    .pointup .btn_pointup{
        width: 76vw;
        margin: 2% auto 0;
    }
}

/* movie */
.bg_movie{
    width: 100%;
    margin: -11% 0 0;
}
.movie{
    padding: 3% 0 14%;
    background:url(../img/common/bg_link.png) #FCCDCA no-repeat;
    background-size: 100% auto;
    background-position: center bottom;
}

.movie h2{
    width: 32vw;
    margin: 0 auto 2%;
}
.movie .txt_movie{
    width: 60vw;
    margin: 0 auto 2%;
    font-size:1.6vw;
    line-height: 1.5;
    text-align: center;
}
.movie .movie_gallery{
    width: 100%;
    margin: 0 auto;
}
.movie .movie_gallery li{
    margin: 0 1%;
}
.movie .movie_gallery .slick-next{
    top:46%;
    right:36%;
}
.movie .movie_gallery .slick-prev{
    top:46%;
    left:36%;
}

.movie .movie_gallery .slick-dots li{
    margin: 5px;
}

.movie .movie_gallery .slick-dots{
    bottom:-46px;
}

.movie .btn_movie{
    width: 24vw;
    margin: 5% auto 2%;
}
@media screen and (max-width: 768px){
    .bg_movie{
        margin: -27% 0 0;
    }
    .movie{
        margin: -1% 0 0;
        padding: 10% 0 30%;
        background:url(../img/common/bg_link_sp.png) #FCCDCA no-repeat;
        background-size: 100% auto;
        background-position: center bottom;
    }
    .movie h2{
        width: 76vw;
        margin: 0 auto 6%;
    }
    .movie .txt_movie{
        width: 80vw;
        margin: 0 auto 4%;
        font-size:4vw;
        line-height: 1.7;
        text-align: left;
    }
    .movie .movie_gallery li{
        margin: 0 1%;
    }   
    .movie .movie_gallery .slick-next{
        right:12%;
    }
    .movie .movie_gallery .slick-prev{
        left:12%;
    }
    .movie .btn_movie{
        width: 56vw;
        margin: 16% auto 2%;
    }
}