@media screen and (max-width:1024px){
    #columnA{padding:5% 0;}

    #tof{top:15%;}

    .catch{
        width:100%;
        margin-bottom:15%;
    }

    #boxA{width:100%;}

    #columnB .pc{display:none;}

    .tablet{display:block;}

    #recipesZ{
        width:96%;
        margin:25% 2% 5% 2%;
    }

    #recipesZ > div{
        flex:1 20%;
        max-width:20%;
    }

    #suboutons{
        bottom:25%;
        width:35%;
    }
    .columnC{padding:0 0 11% 0;}

    .yammy{top:26%;}

    /* Header */

    #gNavi{display:none;}

    #okame{
        display:block;
        background-color:#faf4ee;
        padding:1em 1em .5em 1em;
        text-align:left;
    }
    #okame img{
        display:inline-block;
        max-width:200px;
    }
}

@media screen and (max-width:768px){
    .pc,
    .tablet{display:none;}

    .sp{display:block;}

    #columnA{padding:8% 0;}

    #tof{top:5%;}

    .catch,
    #boxA img{width:90%;}

    #boxA{padding-top:5%;}

    #FullCourse,
    #columnB{
        overflow:none;
        background-image:url('../img/fc_bg.jpg');
        background-size:cover;
    }

    #columnB{
        overflow:none;
        background-image:url('../img/printemps/sp_recipe_bg.jpg');
        background-size:cover;
    }

    .columnC{padding:0;}

    .yammy{top:26%;}

    #recipesZ{margin:20% 2% 5% 2%;}

    #recipesZ > div{
        flex:1 43%;
        max-width:43%;
        padding:8% 2% 1% 2%;
    }

    #suboutons{
        bottom:35%;
        width:50%;
    }

    #logo{width:75vw;}

    .ReCiPe{padding:1vh 8vw;}

    .ReCiPe > figure,
    .ReCiPe > div{
        display:block;
        width:100%;
        margin:0 0 1em 0;
    }

    #smenu{padding:0;}

    .rcp{
        width:45.4%;
        margin:.5em 2%;
    }

    #columnCsp{
        display:block;
        position:relative;
    }

    #menulogo{width:40%;}

    /* Footer */
    /*
    footer div{
        display:block;
        width:100%;
        padding:.5em 0 1em 0;
    }

    footer div:nth-of-type(1){text-align:center;}

    footer div:nth-of-type(2){text-align:center;}
    */
}

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

    nav > h5{
        font-size:1em;
        padding:1%;
    }

    #bouton{max-width:24px;}

    #menu h4{
        width:55%;
        font-size:.8em;
    }

    #hero{
        position:fixed;
        width:100vw;
        margin:0;
        padding:0;
        height:100vh;
        min-height:initial;
        overflow:hidden;
    }

    #logo{
        width:75vw;
        display:block;
        position:absolute;
        left:0;
        right:0;
        bottom:25%;
        margin:auto;
    }

    main{
        width:100vw;
        margin:0;
        padding:0;
    }

    #columnA,
    #three{
        font-size:.8em;
        margin-top:100vh;
        overflow:hidden;
    }

    #expi{width:90vw;}

    #expi > img{
        display:block;
        margin:.5em auto;
        width:50vw;
    }

    #FullCourse,
    #columnB{
        margin:0;
        background-image:url('../img/sp_fc_bg.jpg');
    }

    #yammyS{
        opacity:0;
        width:85vw;
        display:block;
        position:absolute;
        top:38%;
        left:0;
        right:0;
        margin:auto;
    }

    #boutonsP{
        display:block;
        position:absolute;
        left:0;
        bottom:7%;
    }

    #columnCsp a:hover{opacity:1;}

    #columnD{
        margin:0;
        background-image:url('../img/sp_recipes_bg.jpg');
        background-repeat:no-repeat;
    }

    #printempsP,
    #leteSp,
    #automneSp,
    #lhivierSp{
        cursor:pointer;
        transform:scale(.9);
    }

    #printempsP:hover,
    #leteSp:hover,
    #automneSp:hover,
    #lhivierSp:hover{transform:scale(1);}

    #columnB{
        background-size:contain;
        background-repeat:repeat-y;
    }

    #recipesZ > div{
        flex:1 80%;
        max-width:80%;
        padding:15% 5% 2% 5%;
    }

    #suboutons{
        width:60%;
        bottom:30%;
    }
}