@media screen and (max-width: 996px) {
    body {
        max-width: 600px;
        margin: auto;
    }

    /* index */
    .header__area {
        padding: 10px 0;
    }

    .container, .container-md, .container-sm {
        max-width: 100%;
    }

    .col-md-4,
    .col-md-8 {
        width: 50%;
    }

    .d-sm-block,
    .d-lg-block,
    .square {
        display: none !important;
    }

    .d-lg-none {
        display: block !important;
    }

    .hero__thumb-wrapper,
    .hero__shape img.circle {
        display: none;
    }

    .hero__title {
        font-size: 30px;
    }

    .hero__area .row > div,
    .col-sm-6,
    .col-xl-3,
    .col-md-6,
    .col-xl-4,
    .col-xl-8 {
        width: 100%;
    }

    .trending__area div > div {
        width: 100%;
    }

    .trending__area .row {
        flex-direction: column;
    }

    .row {
        margin-right: 0 !important;
        margin-left: 0 !important;
    }

    .trending__more.justify-content-md-end {
        justify-content: center !important;
    }

    .hero__height {
        min-height: 600px !important;
    }

    .header__area.sticky {
        max-width: 600px !important;
        right: 0;
        margin: auto !important;
    }

    /* article----start */
    .body-w {
        margin-top: 60px;
        max-width: 100%;
    }

    .page-article {
        flex-wrap: wrap;
    }

    .page-a-text {
        width: 100%;
    }

    .page-a-right {
        width: 100%;
        margin-top: 20px;
    }

    .page-a-des table {
        max-width: 100% !important;
        width: 100% !important;
    }

    .bg-shape {
        max-width: 600px;
        margin: auto;
    }

    .page__title {
        font-size: 30px;
    }

    .logo img {
        height: 50px;
    }

    #loading {
        max-width: 600px;
        margin: auto;
    }

    .justify-content-center.justify-content-lg-end {
        justify-content: center !important;
    }

    .text-center.text-lg-start {
        text-align: center !important;
    }


    .banner .m-polygon {
        clip-path: polygon(50% 90%, 0% 100%, 100% 100%);
        background-color: #7a33f9;
        width: 100%;
        height: 400px;
        margin-top: -400px;
        margin-bottom: -1px;
    }

    .banner-text {
        position: static !important;
        width: 100% !important;
        min-height: auto;
        height: auto !important;
        flex-grow: 1;
        /*background: #ff4521;*/
        background-image: linear-gradient(to bottom, #7a33f9, #9d37fa00);
        margin: 0;
        padding: 0;
    }

    .banner-text h1 {
        font-size: 1.875rem;
    }

    .banner-text p {
        font-size: 1.25rem;
        text-align: center;
    }

    .banner-text .content {
        align-items: center;
        padding: 20px 20px 50px 20px;
    }

    .d-block.d-lg-none {
        display: block !important;
    }

    .d-none.d-lg-block {
        display: none !important;
    }

    .banner .ad-box {
        width: 100%;
    }

    .banner .ad-box .ad-image {
        width: 80%;
    }


}