/*--------- Laptop -----------*/

@media screen and (max-width: 1400px) and (min-width: 1200px) {
    html {
        font-size: 54%;
    }
}

@media screen and (max-width: 1199px) and (min-width: 992px) {
    html {
        font-size: 44%;
    }
}


/* --- Tablet | 991px and down ---- */
@media screen and (max-width: 991px) {

    .d-md-none {
        display: none;
    }

    .title_xxl {
        font-size: 6rem;
    }

    .title_xl {
        font-size: 4.4rem;
    }

    .menu_toggle {
        display: inline-block;
    }

    .menu {
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 0;
    }

    .menu li {
        width: 100%;
    }

    .menu a {
        display: block;
        padding: 1.6rem 0;
        border-bottom: 0.1rem solid #EDEDED;
    }

    .offcanvas_menu .button_md {
        width: 100%;
        text-align: center;
        margin-top: auto;
    }

    .hero_wrapper {
        display: flex;
        flex-direction: column;
    }

    .hero_left {
        padding-bottom: 6rem;
    }

    .hero_left h1 br {
        display: none;
    }

    .hero_left p {
        max-width: 64rem;
    }

    .summery_item_box {
        display: flex;
        flex-direction: column;
    }

    .matters_card_wrapper {
        grid-template-columns: repeat(2, 1fr);
    }

    .works_wrapper {
        grid-template-columns: repeat(2, 1fr);
    }

    .works_card .number_box {
        display: none;
    }

    .works_card .card_content p {
        max-width: 26rem;
    }

    .result_content {
        grid-template-columns: 1fr;
    }

    .result_content .content_right p {
        max-width: 100%;
        padding: 0;
        padding-top: 3rem;
    }

    .result_content .content_right p br {
        display: none;
    }

    .result_item_box {
        grid-template-columns: 1fr;
    }

    .result_item .item_content {
        padding-right: 1rem;
    }

    .result_item.item02 .item_content,
    .result_item.item04 .item_content {
        padding-left: 2rem;
    }

    .result_item.item02 .item_icon,
    .result_item.item04 .item_icon {
        margin-left: auto;
    }

    .result_item.item01 .item_icon,
    .result_item.item03 .item_icon {
        margin-left: auto;
        order: 2;
        margin-right: -0.3rem;
    }

    .result_item.item01,
    .result_item.item03 {
        border-radius: 0 20rem 20rem 0;
    }

    .result_item.item01::after,
    .result_item.item03::after {
        left: 0;
    }

    .result_item p {
        max-width: 100%;
    }

    .result_item p br {
        display: none;
    }

    .pricing_wrapper {
        display: flex;
        flex-direction: column;
    }

    .pricing_report_box {
        padding: 4rem;
    }

    .pricing_refund_box {
        padding: 4rem;
    }

    .pricing_refund_box .title_xl {
        font-size: 3.2rem;
    }

    .ready_content .title_xl {
        font-size: 3.6rem;
    }

    .footer_wrapper {
        grid-template-columns: 1fr;
        gap: 6rem;
    }
}


/* --- Mobile | 767px and down ---- */
@media screen and (max-width: 767px) {

    /* title */
    .title_xxl {
        font-size: 4.2rem;
    }

    .title_xl {
        font-size: 3.4rem;
    }

    /* texts */
    .text_lg {
        font-size: 2rem;
    }

    .text_md {
        font-size: 1.8rem;
    }

    /* button */
    .button_lg {
        font-size: 1.8rem;
        padding: 1.4rem 4rem;
    }

    .navber {
        border-radius: 1.2rem;
        margin-top: 2rem;
    }

    .logo {
        font-size: 1.8rem;
    }

    .logo img {
        width: 4rem;
    }

    .menu_toggle {
        width: 3.2rem;
    }

    .hero_section {
        padding-top: 12rem;
    }

    .hero_left {
        padding-bottom: 3.2rem;
    }

    .hero_enter_title {
        font-size: 1.4rem;
    }

    .hero_right .title_sm {
        font-size: 1.8rem;
    }

    .hero_right_wrapper {
        flex-direction: column;
    }

    .summery_title_box {
        padding-bottom: 3.2rem;
    }

    .summary_section {
        padding-top: 7rem;
    }

    .summery_wrapper {
        padding: 1.6rem;
    }

    .summary_content {
        padding: 3rem 2rem;
    }

    .summery_item {
        padding: 3rem 2rem;
    }

    .warning_box {
        padding: 3rem 2rem;
    }

    .fixing_box {
        padding: 3rem 2rem;
    }

    .summary_content .content_icon {
        margin-bottom: 2.4rem;
    }

    .matters_section {
        margin-top: 8rem;
    }

    .matters_title_box {
        padding-bottom: 3.2rem;
    }

    .matters_wrapper {
        padding: 8rem 0;
    }

    .matters_card_wrapper {
        grid-template-columns: 1fr;
    }

    .works_title_box {
        padding-bottom: 3.2rem;
    }

    .works_title_box .title_xl {
        max-width: 28rem;
        margin-left: auto;
        margin-right: auto;
    }

    .works_wrapper {
        grid-template-columns: 1fr;
    }

    .works_card .card_content p {
        max-width: 100%;
    }

    .reviews_table {
        overflow: auto;
    }

    .reviews_table th {
        padding: 2rem 1.2rem;
    }

    .reviews_table td {
        padding: 1.2rem;
    }

    .reviews_section {
        padding: 8rem 0;
    }

    .reviews_title_box {
        padding-bottom: 3.2rem;
    }

    .result_section {
        padding: 8rem 0;
    }

    .result_wrapper {
        padding: 2rem 1.2rem;
    }

    .result_content {
        padding-bottom: 3rem;
    }

    .result_content .content_left {
        padding-left: 2rem;
        padding-bottom: 1.5rem;
    }

    .result_content .content_left::before {
        width: 0.5rem;
    }

    .result_content .content_left h3 {
        padding-bottom: 0.5rem;
    }

    .result_item_box {
        gap: 1.6rem;
    }

    .result_item::after {
        display: none;
    }

    .result_item.item01 .item_content,
    .result_item.item03 .item_content {
        padding-left: 1.2rem;
    }

    .result_item.item02 .item_content,
    .result_item.item04 .item_content {
        padding-left: 1.2rem;
    }

    .result_item .item_icon img {
        width: 10rem;
    }

    .result_item h4 {
        font-size: 1.6rem;
        padding-bottom: 0.5rem;
    }

    .result_item h4 br {
        display: none;
    }

    .result_item p {
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        line-clamp: 3;
        -webkit-box-orient: vertical;
        font-size: 1.4rem;
        line-height: 1.20;

    }


    .matters_shape {
        right: -5rem;
        bottom: -4.5rem;
        width: 18rem;
        z-index: -1;
    }

    .pricing_section {
        padding: 8rem 0;
    }

    .pricing_card {
        padding: 3rem 2rem;
    }

    .pricing_card .card_amount h4 {
        font-size: 5.5rem;
    }

    .pricing_card .card_title {
        padding-bottom: 2rem;
    }

    .pricing_card .cadr_enter_title {
        font-size: 1.1rem;
    }

    .pricing_report_box {
        padding: 4rem 2.4rem;
    }

    .pricing_card .card_amount {
        padding-bottom: 2rem;
    }

    .pricing_refund_box {
        padding: 4rem 2.4rem;
    }

    .pricing_report_box {
        padding: 2.4rem;
        border-radius: 2rem;
        margin-bottom: 4rem;
    }

    .pricing_report_box h4 {
        font-size: 2.4rem;
    }

    .pricing_refund_box {
        padding: 3.2rem;
        border-radius: 2rem;
    }

    .pricing_refund_box .title_xl {
        font-size: 2.4rem;
    }

    .pricing_refund_box .box_icon {
        margin-bottom: 1.6rem;
    }

    .ready_content .title_xl {
        font-size: 3.2rem;
    }

    .ready_content .title_xl br,
    .ready_content h3 br {
        display: none;
    }

    .ready_button_group {
        flex-direction: column;
    }

    .ready_input button {
        padding: 1.2rem;
    }

    .footer_section {
        padding: 7rem 0 3rem;
    }

    .footer_logo {
        font-size: 2.6rem;
        padding-bottom: 2.4rem;
    }

    .footer_logo img {
        width: 6rem;
    }

    .footer_wrapper {
        grid-template-columns: 1fr;
        gap: 6rem;
    }

    .footer_bottom {
        flex-direction: column;
    }

    .copyright {
        font-size: 1.8rem;
        text-align: center;
        padding-bottom: 2rem;
    }

    .footer_bottom ul {
        justify-content: center;
    }
}

/*----- xs devices 575px and down -----*/
@media screen and (max-width: 575px) {

    html {
        font-size: 2.415vw;
    }

}