@media screen and (max-width:991px) {
    body {
        background: #2a2a2a;
    }

    main {
        margin-top: 60px;
    }

    header .container .logo img {
        width: 20%;
        padding-left: 5px;
    }

    header .container .logo {
        position: relative;
        top: 5px;
    }

    header .container .login {
        display: flex;
        float: right;
        right: 10px;
        position: relative;
        top: 3px;
    }

    header .container .login .btn1 {
        border-radius: 50px;
        margin-left: 5px;
        width: 100px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }

    .tab_4 {
        width: 100%;
        height: auto;
    }

    .tab_4 .container {
        max-width: 1280px;
        height: auto;
        margin: 0 auto;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        box-sizing: border-box;
        gap: 0.5em;
        padding: 10px;
    }

    .tab_4 .container .row {
        background: linear-gradient(to bottom, #e3d898, #b19560);
        border-radius: 15px;
        padding: 10px;
    }

    .tab_4 .container .row img {
        width: 60%;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .tab_4 .container .row p {
        color: #000;
        font-family: DB-Heavent-Cond;
        font-size: 18px;
        font-weight: 600;
        text-align: center;
    }

    .banner-001 {
        display: block;
    }

}

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

    header .container .logo img {
        width: 80%;
        padding-left: 5px;
    }

    header .container .logo {
        position: relative;
        top: 5px;
    }

    header .container .login .btn1 {
        border-radius: 50px;
        margin-left: 5px;
        width: 100px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }
}