@media screen and (min-width:768px) {
    
    .parent {
        display: flex;
        align-items: center;
        text-align: center;
        width: 80%;
        margin: 10px 15% 10px 15%;
    }
    .half {
        width: 50%;
        padding: 2%;
        display: flex;
        align-items: center;
    }
    .shop-card-width {
        width: 400px;
        height: 510px;
    }
    .width-youtube {
        width: 60%;
        margin: 30px 20% 30px 20%;
        height: 60vh;
    }
    .top-background-img {
        height: 75vh;
        align-items: center;
        display: flex;
    }
    .yoko-card {
        display: flex;
        align-items: center;
        justify-content: center;
    }

}

/*----------------------------------------------------------------------------------------------------------------------------------*/

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

    .parent {
        display: block;
        align-items: center;
        text-align: center;
        width: 100%;
        padding: 5%;
    }
    .half {
        width: 100%;
        padding: 5%;
        display: block;
    }
    .shop-card-width {
        width: 300px;
        margin: 0 auto;
    }
    .width-youtube {
        width: 90%;
        margin: 5%;
        height: 40vh;
    }
    .top-background-img {
        height: 95vh;
        align-items: center;
        display: flex;
    }
    .yoko-card {
        display: block;
    }

}