/* formula_popup */
@media (min-width: 992px) and (max-width: 1440px) {
    .formula_popup .step_level_one h5 {
        padding-bottom: 4rem;
    }
}

@media (min-width: 992px) {
    .container {
        max-width: 128rem;
    }
    .container_lg {
        max-width: 121.6rem;
    }

    /* =============== */
    .col_gap_30 {
        margin: 0 -1.5rem;
    }
    .col_gap_30 > * {
        padding: 0 1.5rem;
    }

    .col_gap_40 {
        margin: 0 -2rem;
    }
    .col_gap_40 > * {
        padding: 0 2rem;
    }

    .col_gap_45 {
        margin: 0 -2.25rem;
    }
    .col_gap_45 > * {
        padding: 0 2.25rem;
    }

    .col_gap_32 {
        margin: 0 -1.6rem;
    }
    .col_gap_32 > * {
        padding: 0 1.6rem;
    }

    /* ====== qna_area ====== */
    .qna_area .col-lg-6:nth-child(2) {
        padding-left: 0;
    }
}

/* ------ Medium devices (tablets, 991px and down) -----*/
@media (max-width: 991px) {
    html {
        font-size: 46%;
    }

    br {
        display: none;
    }

    :root {
        --header_height: 7.7rem;
    }

    .main_content > * {
        padding: 6rem 0;
    }

    .container {
        padding: 0 2.4rem;
    }

    .col_gap_40,
    .col_gap_30 {
        gap: 2.5rem 0;
    }

    .level {
        padding: 5rem 0;
    }

    /* =========== Header area ========== */
    .mobile_menu {
        position: fixed;
        height: 0;
        width: 100vw;
        left: 0;
        background: #001a47;
        flex-direction: column;
        transition: 0.25s ease;
        top: var(--header_height);
        overflow: hidden;
        gap: 3.5rem;
        overflow-y: auto;
    }

    .mobile_menu::-webkit-scrollbar {
        display: none;
        scrollbar-width: 0;
    }

    .menu_toggled .mobile_menu {
        height: calc(100vh - var(--header_height));
        padding: 3rem 0;
    }

    .logo {
        position: relative;
        left: 0;
        top: 0;
        transform: translate(0, 0);
    }

    .logo img {
        width: 15rem !important;
    }

    .menu_right {
        flex-direction: column;
        gap: 2rem;
    }

    .social_media_icons {
        padding: 0;
    }

    .primary_menu {
        display: grid;
        width: 100%;
        gap: 0;
        margin-right: 0;
    }

    .menu_link {
        padding: 2.5rem 0 !important;
        margin: 0;
        text-align: center;
        border-right: 0 !important;
        font-size: 2.2rem;
        line-height: 1;
        width: 100%;
        border-bottom: 0.1rem solid rgb(208, 150, 43, 0.25);
    }

    .menu_link:hover {
        background: rgb(208, 150, 43, 0.35);
    }

    /* =============== hero_area =============== */
    .hero_area .blue_circle {
        display: none;
    }

    .hero_area {
        overflow: visible !important;
        padding-bottom: 0;
    }

    .hero_area .col-lg-6:nth-child(2) {
        display: flex;
        align-items: center;
        justify-content: end;
    }

    .blue_circle .col-lg-6.pt_65 {
        margin-right: 2rem;
    }

    .hero_content_bottom {
        padding-bottom: 2.4rem;
    }

    .hero_area .row {
        gap: 3rem;
    }

    .hero_img {
        margin-bottom: -5.7rem;
        width: 28rem;
        height: 28rem;
        margin-right: -2rem;
    }

    /* ============ formula_area =========== */
    .formula_area .container > .content {
        padding-bottom: 5rem;
    }

    .formula_area {
        padding: 19rem 0 6.9rem;
    }

    .formula_area .row.col_gap_40 {
        gap: 4.8rem 0;
    }

    .formula_bottom {
        padding-top: 0.8rem;
    }

    .formula_bottom p {
        padding: 0.2rem 0 1rem;
    }

    /* ============ formula_area =========== */
    .service_area .row {
        gap: 1.6rem 0;
    }

    .service_area .row.row1 {
        padding-bottom: 4rem;
    }

    .service_area .row.row1 p {
        padding-bottom: 4rem;
    }

    .service_area {
        padding: 6rem 0;
    }

    /* ============ research_area =========== */
    .research_bottom_left {
        right: -1.7rem;
        gap: 1.5rem;
        padding: 1.3rem 1rem 1rem 2rem;
    }

    .research_img {
        border-radius: 100rem;
    }

    .research_bottom_left {
        right: -1.7rem;
        gap: 1.5rem;
        padding: 1.3rem 1rem 1rem 2rem;
    }

    .research_img {
        border-radius: 100rem;
    }

    .research_box h5 {
        font-size: 3.6rem;
        line-height: 4.32rem;
        text-align: center;
    }

    .research_content {
        padding-left: 0;
        padding-top: 4.5rem;
    }

    .research_box p {
        font-size: 1.6rem;
        text-align: center;
        line-height: 2.4rem;
    }

    .research_content .row {
        gap: 1.7rem;
    }

    .research_content h2 {
        text-align: center;
    }

    .research_area {
        padding: 10.9rem 0 10.4rem 0;
    }

    .research_bottom_left {
        right: -1.7rem;
        gap: 1.5rem;
        padding: 1.3rem 1rem 1rem 2rem;
    }

    .research_img {
        border-radius: 100rem;
    }

    .research_box h5 {
        font-size: 3.6rem;
        line-height: 4.32rem;
        text-align: center;
    }

    .research_content {
        padding-left: 0;
        padding-top: 4.5rem;
    }

    .research_box p {
        font-size: 1.6rem;
        text-align: center;
        line-height: 2.4rem;
    }

    .research_content .row {
        gap: 1.7rem;
    }

    .research_content h2 {
        text-align: center;
    }

    .research_area {
        padding: 10.9rem 0 10.4rem 0;
    }

    /* ================== cta_area ==================== */
    .cta_area {
        display: none;
    }

    .cta_area_two .content p {
        padding: 2.4rem 0 5.3rem;
    }

    .cta_area_two .content {
        padding: 2.8rem 2rem 5.8rem 1rem;
    }

    /* ================== footer_area ==================== */
    .footer_link {
        padding-right: 0;
    }

    .footer_links {
        flex-direction: column;
        align-items: self-start !important;
        gap: 2rem;
    }

    .footer_links {
        padding: 5.5rem 0 7rem;
    }

    /* ================== formula_area ==================== */
    .formula_area .row.col_gap_40 {
        gap: 2.4rem 0;
    }

    .col_gap_40 > * {
        padding: 0 1.2rem;
    }

    .col_gap_40 {
        margin: 0 -2.4rem;
    }

    /* ============ Popup gallery ============ */
    .level_one {
        padding-top: 0;
        padding-bottom: 0;
    }

    .formula_popup {
        padding: 0;
    }

    .blue_circle {
        height: 70.6rem;
        width: 69.5rem;
    }

    .level_four p br {
        display: block;
    }
}

/*----- sm devices (tablets, 767px and down) -----*/
@media (max-width: 767px) {
    /* ============ default styles ============ */
    html {
        font-size: 50%;
    }
    h1,
    h2 {
        font-size: 4rem;
        line-height: 5.2rem;
    }
    h3 {
        font-size: 3.2rem;
        line-height: 3.84rem;
        letter-spacing: -0.01em;
    }
    h6 {
        font-size: 1.6rem;
        line-height: 2.4rem;
    }

    /* padding margins sm */
    .pb_65 {
        padding-bottom: 4rem;
    }
    .pb_50 {
        padding-bottom: 3.5rem;
    }
    .pb_35 {
        padding-bottom: 2rem;
    }
    .pb_95 {
        padding-bottom: 6rem;
    }
    .pt_40 {
        padding-top: 2rem;
    }
    /* padding margins sm */

    /* ============== hero_area ================ */
    .hero_area {
        background: url(../img/hero_bg_mobile.png) no-repeat scroll left top /
            100% 100%;
    }
    .hero_bottom {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 1.2rem;
    }

    .hero_bottom_right p {
        font-size: 1.4rem;
        line-height: 2.1rem;
    }

    .moving_arrow {
        width: 9rem;
        top: -2rem;
    }

    .hero_area .row {
        gap: 1rem;
    }

    .site_header {
        height: 7.7rem;
    }

    .hero_area .col-lg-6.pt_65 {
        padding-top: 2rem;
    }

    .hero_area .content h1 {
        padding-right: 2rem;
    }

    .logo img {
        width: 14rem !important;
    }

    /* ======== Formula area ======== */
    .col_gap_40 > * {
        padding: 0;
    }
    .col_gap_40 {
        margin: 0;
    }
    .formula_bottom button {
        display: none;
    }
    .formula_bottom p.pb_25 {
        padding-bottom: 0;
    }
    .formula_img img {
        height: 29.845rem;
        border-radius: 1.2rem;
    }

    .formula_img {
        border-radius: 1.2rem;
    }
    /* =========== service_area =========== */
    .service_area .row1 .col-lg-3 p {
        font-size: 1.6rem;
        line-height: 2.5rem;
    }

    .service_area .row1 .col-lg-9 h2 {
        font-size: 3.2rem;
        line-height: 3.84rem;
        letter-spacing: -0.01em;
    }

    /* =========== research_area =========== */
    .formula_area .row {
        gap: 4.8rem 0 !important;
    }

    .research_bottom_left {
        flex-direction: row;
        align-items: center !important;
        justify-content: center !important;
        bottom: 2.2rem;
    }

    .research_bottom_left .hero_images img {
        width: 4.05rem;
        height: 4.05rem;
    }

    .research_bottom_left .hero_bottom_right p {
        font-size: 1.2rem;
        line-height: 1.92rem;
    }

    .hero_bottom_right h6 {
        font-size: 1.8rem;
        line-height: 2.7rem;
    }

    .research_content h2 {
        font-size: 3.2rem;
        line-height: 3.84rem;
    }

    .research_content h5 {
        font-size: 3.6rem;
        line-height: 4.32rem;
        padding-bottom: 0.2rem;
    }

    .research_bottom_left {
        bottom: 2.2rem;
    }

    /* =========== cta_area_two =========== */
    .cta_area_two {
        background: #1d1e25;
    }
    .cta_area_two .content h3 {
        font-size: 2.8rem;
        line-height: 3.36rem;
        letter-spacing: -0.01em;
    }
    .cta_area_two .content p {
        font-size: 1.6rem;
        line-height: 2.6rem;
    }
    .qna_area .content {
        padding-bottom: 4.8rem;
    }
    .accordion_item {
        padding: 2.4rem 0;
    }

    /* =========== qna_area =========== */
    .qna_area {
        padding: 5.6rem 0 16.6rem 0;
    }

    /* =========== footer_area =========== */
    .footer_section {
        background: url(../img/footer_bg_sm.png) no-repeat scroll top left /
            100% 100%;
    }
    .footer_link {
        display: grid !important;
        grid-template-columns: 6.1rem 1fr;
    }
    .footer_mid {
        flex-direction: column;
        gap: 3.7rem;
        padding-top: 4rem;
    }
    .footer_symbol {
        height: auto;
        width: 34.6rem;
        bottom: 4.9rem;
        transform: translateY(0);
        top: auto;
    }
    .footer_icon img {
        filter: brightness(0) saturate(100%) invert(21%) sepia(91%)
            saturate(4377%) hue-rotate(224deg) brightness(97%) contrast(97%);
    }

    .footer_content h1 {
        font-size: 4.8rem;
        line-height: 5.28rem;
        letter-spacing: 0.1rem;
    }

    .footer_mid p {
        text-align: center !important;
    }

    .footer_section .container {
        padding: 0 3.9rem;
    }

    .footer_link {
        padding-right: 0;
        margin-right: 0;
        align-items: center;
    }

    .formula_img h1 {
        font-size: 7rem;
        line-height: 1;
        bottom: 1rem;
    }

    /* ================= Popup Mobile =============== */
    .formula_popup .container {
        align-items: flex-start !important;
        justify-content: flex-start;
        padding-top: 4rem;
        padding-bottom: 4rem;
        max-width: 100%;
    }

    .level_one .row {
        gap: 5rem;
    }

    .formula_bottom h6 {
        padding-bottom: 0;
        font-size: 1.6rem;
        line-height: 2.4rem;
        padding-top: 1.4rem;
    }

    .formula_popup .blue_circle {
        display: none;
    }

    .formula_popup .formula_img img {
        border-radius: 2.5rem;
        height: 19.8rem;
    }

    .formula_popup .level h5 {
        padding-bottom: 6.5rem;
    }

    .step_form .form_group.mb_60 {
        margin-bottom: 4rem;
    }

    .step_form.mb_50 {
        margin-bottom: 4rem;
    }

    .level_two {
        padding: 6.5rem 0;
    }

    .level_three {
        padding: 5rem 0;
    }

    .formula_popup .level h5 {
        padding-left: 2rem;
        padding-right: 2rem;
        font-size: 3.3rem;
        line-height: 1.3;
        padding-bottom: 5.6rem;
    }

    .step_form.mb_40 {
        margin-bottom: 5.6rem;
    }

    .form_group.mb_40 {
        margin-bottom: 3.4rem;
    }

    .level_four p {
        padding: 4.3rem 3.4rem;
        line-height: 120%;
        font-size: 1.6rem;
        font-family: var(--titleFont);
        font-weight: 400;
    }

    .level_four h5 {
        padding-bottom: 0 !important;
    }

    .formula_popup .container .level {
        margin: 0 auto;
    }
}

/*----- xs devices (landscape phones, 575px and down) -----*/

@media (max-width: 575px) {
    html {
        font-size: 2.6vw;
    }
}