@media (min-width: 320px) and (max-width: 480.98px) {
    .logo {
        width: 8rem;
    }

    .enter-area h1 {
        margin-top: 3rem;
        font-size: 2rem;
    }

    .footer-square {
        margin: 2.5rem 0;
    }

    .enter-area .square,
    .square-white {
        width: 5rem;
    }

    .enter-area h4 {
        font-size: .83rem;
    }

    .free-btn-div {
        margin-top: 2.5rem;
    }

    .free-btn-div a,
    .enter-area-white .free-btn-div a {
        font-size: .9rem;
    }

    .circle-tree-area {
        padding-top: 5rem;
    }

    .circle-tree-area .circle-container {
        width: 330px;
        height: 330px;
    }

    .circle-tree-area .main-circle {
        width: 215px;
        height: 215px;
    }

    .circle-tree-area .main-circle-border {
        width: 150px;
        height: 150px;
    }

    .circle-tree-area .circle-arm {
        width: 50px;
        height: 50px;
        padding: .1rem;
    }

    .circle-tree-area .main-circle h1 {
        font-size: 1rem;
    }

    .circle-tree-area .main-circle p {
        font-size: .8rem;
    }

    .circle-tree-area .text-absolute-circle {
        width: 210px;
    }

    .circle-tree-area .circle-arm.active {
        top: 15% !important;
        z-index: 999;
    }

    #splide-brands .splide__arrow--prev {
        left: 1rem !important;
        font-size: .9rem;
        width: 2.5rem;
        height: 2.5rem;
    }

    #splide-brands .splide__arrow--next {
        right: 1rem !important;
        font-size: .9rem;
        width: 2.5rem;
        height: 2.5rem;
    }

    .brands-area img {
        height: 5rem;
    }

    .ourmap-area .stage {
        width: 100%;
    }

    .brands-area,
    footer {
        margin-top: 5rem;
    }

    .ourmap-area h1 {
        text-align: center;
    }

    .ourmap-area .stage.left {
        text-align: start;
        float: inline-start;
        clear: none;
        margin-left: auto !important;
    }

    .ourmap-area .stage.stage-6 {
        background-color: #fff;
    }

    .ourmap-area .stage.stage-6 h2,
    .ourmap-area .stage.stage-6 h3,
    .ourmap-area .stage.stage-6 p {
        color: #000;
    }

    .ourmap-area .stage.stage-6 span {
        color: #fff;
    }

    .ourmap-area .stage.stage-6:hover span {
        color: #000;
    }

    footer .last-col-area {
        text-align: start;
        margin-top: 2rem;
    }

    footer .last-col-area a {
        font-size: .8rem;
    }

    footer .footer-description {
        margin-top: 2.5rem;
    }

    footer .sub-footer,
    footer .sub-footer .first-sub-footer,
    footer .sub-footer .last-sub-foot {
        text-align: center !important;
        font-size: .9rem;
    }

    footer .sub-footer .last-sub-foot {
        margin-top: 1rem;
    }

    .header-fixed .logo {
        width: 6rem;
    }

    .header-fixed .navbar {
        margin: 0;
    }
}

@media (min-width: 481px) and (max-width: 575.98px) {
    .enter-area h1 {
        font-size: 3rem;
        margin-top: 4rem;
    }

    .footer-square {
        margin: 3.5rem 0;
    }

    .enter-area h4,
    .free-btn-div a {
        font-size: 1rem;
    }

    .free-btn-div {
        margin-top: 2.5rem;
    }

    .circle-tree-area .main-circle {
        width: 275px;
        height: 275px;
    }

    .circle-tree-area .main-circle-border {
        width: 310px;
        height: 310px;
    }

    .circle-tree-area .circle-container {
        width: 460px;
        height: 460px;
    }

    .circle-tree-area .circle-arm {
        width: 65px;
        height: 65px;
        padding: .1rem;
    }

    .circle-tree-area .text-absolute-circle {
        width: 250px;
    }

    .circle-tree-area .circle-arm.active {
        top: 15% !important;
    }

    .circle-tree-area .main-circle h1 {
        font-size: 1.2rem;
    }

    .circle-tree-area .main-circle p {
        font-size: .9rem;
    }

    .ourmap-area .stage {
        width: 100%;
    }

    .brands-area,
    footer {
        margin-top: 5rem;
    }

    .ourmap-area h1 {
        text-align: center;
    }

    .ourmap-area .stage.left {
        text-align: start;
        float: inline-start;
        clear: none;
        margin-left: auto !important;
    }

    .ourmap-area .stage.stage-6 {
        background-color: #fff;
    }

    .ourmap-area .stage.stage-6 h2,
    .ourmap-area .stage.stage-6 h3,
    .ourmap-area .stage.stage-6 p {
        color: #000;
    }

    .ourmap-area .stage.stage-6 span {
        color: #fff;
    }

    .ourmap-area .stage.stage-6:hover span {
        color: #000;
    }

    footer .last-col-area {
        text-align: start;
        margin-top: 2rem;
    }

    footer .last-col-area a {
        font-size: .8rem;
    }

    footer .footer-description {
        margin-top: 2.5rem;
    }

    footer .sub-footer,
    footer .sub-footer .first-sub-footer,
    footer .sub-footer .last-sub-foot {
        text-align: center !important;
        font-size: .9rem;
    }

    footer .sub-footer .last-sub-foot {
        margin-top: 1rem;
    }

    .logo {
        width: 8rem;
    }

    .mobile-logo-menu img {
        width: 9rem;
    }

    .circle-tree-area .circle-container {
        margin-top: 3rem;
    }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    .enter-area h1 {
        font-size: 3rem;
        margin-top: 4rem;
    }

    .footer-square {
        margin: 3.5rem 0;
    }

    .enter-area h4,
    .free-btn-div a {
        font-size: 1rem;
    }

    .free-btn-div {
        margin-top: 2.5rem;
    }

    .circle-tree-area .main-circle {
        width: 275px;
        height: 275px;
    }

    .circle-tree-area .main-circle-border {
        width: 310px;
        height: 310px;
    }

    .circle-tree-area .circle-container {
        width: 460px;
        height: 460px;
    }

    .circle-tree-area .circle-arm {
        width: 65px;
        height: 65px;
        padding: .1rem;
    }

    .circle-tree-area .text-absolute-circle {
        width: 250px;
    }

    .circle-tree-area .circle-arm.active {
        top: 15% !important;
    }

    .circle-tree-area .main-circle h1 {
        font-size: 1.2rem;
    }

    .circle-tree-area .main-circle p {
        font-size: .9rem;
    }

    .ourmap-area .stage {
        width: 100%;
    }

    .brands-area,
    footer {
        margin-top: 5rem;
    }

    .ourmap-area h1 {
        text-align: center;
    }

    .ourmap-area .stage.left {
        text-align: start;
        float: inline-start;
        clear: none;
        margin-left: auto !important;
    }

    .ourmap-area .stage.stage-6 {
        background-color: #fff;
    }

    .ourmap-area .stage.stage-6 h2,
    .ourmap-area .stage.stage-6 h3,
    .ourmap-area .stage.stage-6 p {
        color: #000;
    }

    .ourmap-area .stage.stage-6 span {
        color: #fff;
    }

    .ourmap-area .stage.stage-6:hover span {
        color: #000;
    }

    footer .last-col-area {
        text-align: start;
        margin-top: 2rem;
    }

    footer .last-col-area a {
        font-size: .8rem;
    }

    footer .footer-description {
        margin-top: 2.5rem;
    }

    footer .sub-footer,
    footer .sub-footer .first-sub-footer,
    footer .sub-footer .last-sub-foot {
        text-align: center !important;
        font-size: .9rem;
    }

    footer .sub-footer .last-sub-foot {
        margin-top: 1rem;
    }

    .logo {
        width: 8rem;
    }

    .mobile-logo-menu img {
        width: 9rem;
    }

    .circle-tree-area .circle-container {
        margin-top: 3rem;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .logo {
        width: 8rem;
    }

    .nav-link {
        font-size: 1rem;
        margin: 0 1rem;
    }

    .enter-area h1 {
        font-size: 3.5rem;
        margin-top: 4rem;
    }

    .footer-square {
        margin: 3.5rem 0;
    }

    .enter-area .square,
    .enter-area-white .square-white {
        width: 6.5rem;
    }

    .enter-area h4 {
        font-size: 1.1rem;
    }

    .free-btn-div {
        margin-top: 2.5rem;
    }

    .circle-tree-area .circle-container {
        width: 650px;
        height: 650px;
        margin-top: 4rem;
    }

    .circle-tree-area .circle-arm {
        width: 90px;
        height: 90px;
    }

    footer .sub-footer .last-sub-foot {
        text-align: center;
        margin-top: 1.5rem;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .enter-area h1 {
        font-size: 4rem;
        margin-top: 3rem;
    }

    .circle-tree-area .col-lg-5 {
        width: 100%;
    }

    .circle-tree-area .col-lg-7 {
        width: 100%;
        margin-top: 5rem;
    }

    footer .sub-footer .center-sub-foot{
        font-size: 1rem;
    }

    footer .sub-footer .last-sub-foot a{
        font-size: .77rem;
    }
}

@media (min-width: 1200px) and (max-width: 1399.98px) {
    .enter-area h1 {
        font-size: 4rem;
        margin-top: 4rem;
    }

    .footer-square{
        margin: 3.5rem 0;
    }

    .circle-tree-area .circle-container {
        width: 650px;
        height: 650px;
    }

    .circle-tree-area .main-circle{
        height: 350px;
        width: 350px;
    }

    .circle-tree-area .main-circle-border{
        width: 400px;
        height: 400px;
    }
    .circle-tree-area .circle-arm{
        width: 100px;
        height: 100px;
    }

    .circle-tree-area .circle-arm.active{
        top: 18% !important;
    }

    footer .sub-footer .last-sub-foot a{
        font-size: .9rem;
    }
}

@media (min-width: 1400px) and (max-width: 1599.98px) {
    .enter-area h1 {
        font-size: 4rem;
        margin-top: 4rem;
    }

    .footer-square{
        margin: 3rem 0;
    }

    .circle-tree-area .circle-container {
        width: 650px;
        height: 650px;
    }

    .circle-tree-area .main-circle{
        height: 350px;
        width: 350px;
    }

    .circle-tree-area .main-circle-border{
        width: 400px;
        height: 400px;
    }
    .circle-tree-area .circle-arm{
        width: 100px;
        height: 100px;
    }

    .circle-tree-area .circle-arm.active{
        top: 18% !important;
    }

    footer .sub-footer .last-sub-foot a{
        font-size: .9rem;
    }

    .free-btn-div{
        margin-top: 2.5rem;
    }
}