@media (max-width: 768px){

    *{
        font-size: 100%;
    }
    header{
        margin: 0 auto;
        right: 10%;
        max-width: 80%;
        border-radius: 15px;
    }
    .hero{
        width: 100%;
        padding: 90% 0%;
        background-repeat: repeat-y;
        background-size: auto;
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;

    }
    .hero p{
        font-size: 0%;

    }
    .hero h1{
        background: #dedddd91;
        backdrop-filter: blur(10px);
        padding: 5%;
        border-radius: 20px;
    }
    .b2_grid{
        display: flex;
        flex-direction: column;
    }
    .general_block_3{
        flex-direction: column;
    }
    .card_b2{
        max-width: 100%;
    }
    .general_block_1{
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        border-bottom: 1px solid;
    }
    .bl_1{
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
    }
    .general_block_1 p{
        
    }
    .general_block_1 img{
    height: 0px;        
    }
    h2{
        font-size: 200%;
    }
    footer{
    }
    .fut_lv1 h2{
    }
    .fut_lv1 a{
        font-size: 70%;
        
    }
}