/* Checkout Css Start */
.desktop_none{
    display: none;
}
.mobile_none{
    display: block;
}
.checkout_smain{
    background-image: url(../img/checkout_bg.png);
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    padding: 140px 0px 80px 0px;
    background-color: var(--base-Off-White, #F0F0F0);
}
.checkout_s1{
    display: flex;
    width: 800px;
    max-width: 800px;
    margin: auto;
    padding: 140px 24px;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}
.checkout_title{
    color: var(--brand-Teal-25, #1E3B40);
    text-align: center;
    font-family: Figtree;
    font-size: 64px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    text-transform: capitalize;
    margin: 0px;
}
.checkout_subtitle{
    color: var(--brand-Teal-50, #316972);
    text-align: center;
    font-family: "Bricolage Grotesque";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 140%;
    margin: 0px;
}
.checkout_s2{
    display: flex;
    width: 1281px;
    max-width: 1281px;
    margin: auto;
    padding: 16px;
    align-items: flex-start;
    gap: 48px;
    flex-shrink: 0;
    border-radius: 16px;
    background: var(--base-White, #FFF);
}
.checkout_left{
    display: flex;
    width: 500px;
    padding: 64px 32px;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 32px;
    flex-shrink: 0;
    align-self: stretch;
    border-radius: 16px;
    background: var(--base-Off-White, #FAFAFA);
}
.checkout_lefttop{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-self: stretch;
}
.checkout_tamounttitle{
    color: #4DA4B2;
    font-family: "Bricolage Grotesque";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 160%;
    margin: 0px;
}
.checkout_tamount{
    color: var(--brand-Teal-25, #1E3B40);
    font-family: Figtree;
    font-size: 48px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    text-transform: capitalize;
    margin: 0px;
}
.check_mastercard{
    margin-inline: auto;
    max-width: 238px;
}
.checkout_leftmid1{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
}
.checkout_leftmidcard{
    cursor: default;
    display: flex;
    width: 100%;
    padding: 20px 24px;
    align-items: center;
    gap: 24px;
    border-radius: 4px;
    border: 1px solid var(--base-04, #E9E9E9);
    background: var(--base-White, #FFF);
}
.checkout_leftmidcard:hover{
    cursor: default;
    border-radius: 4px;
    background: var(--base-White, #FFF);
    box-shadow: 0 100px 80px 0 rgba(0, 0, 0, 0.07), 0 64.815px 46.852px 0 rgba(0, 0, 0, 0.05), 0 38.519px 25.481px 0 rgba(0, 0, 0, 0.04), 0 20px 13px 0 rgba(0, 0, 0, 0.04), 0 8.148px 6.519px 0 rgba(0, 0, 0, 0.03), 0 1.852px 3.148px 0 rgba(0, 0, 0, 0.02);
}

.checkout_leftmidcardleft{
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 1 0 0;
}
.checkout_flag{
    height: 32px;
}
.checkout_cardtitlebar{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
}
.checkout_cardtitle{
    color: var(--brand-Teal-25, #1E3B40);
    font-family: "Bricolage Grotesque";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 180%; /* 28.8px */
    margin: 0px;
}
.checkout_cardinfomain{
    display: flex;
    align-items: flex-start;
    gap: 8px;
}
.checkout_cardinfobar{
    display: flex;
    align-items: center;
    gap: 4px;
}
.checkout_infotext{
    color: #4DA4B2;
    font-family: "Bricolage Grotesque";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin: 0px;
}
.checkout_leftmidcardright{
    display: flex;
    align-items: center;
    gap: 16px;
}
.checkout_cardamount{
    color: var(--brand-Teal-25, #1E3B40);
    font-family: "Bricolage Grotesque";
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 120%;
    letter-spacing: -0.18px;
    text-transform: capitalize;
    margin: 0px;
}
.cdeletebtn{
    padding: 0px;
    border: none;
    background: none;
}
.checkout_leftmid2{
    display: flex;
    padding: 0 24px;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
}
.checkout_leftsubtotalbar{
    display: flex;
    padding: 8px 0;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-bottom: 1px solid var(--base-04, #E9E9E9);
}
.subtotal_text{
    color: var(--brand-Teal-25, #1E3B40);
    font-family: "Bricolage Grotesque";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin: 0px;
}
.discount_text{
    color: var(--base-Success-Green, #47B147);
    font-family: "Bricolage Grotesque";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin: 0px;
}
.checkout_right{
    display: flex;
    padding: 64px;
    flex-direction: column;
    align-items: flex-start;
    gap: 40px;
    flex: 1 0 0;
    align-self: stretch;
}
.checkout_formbar{
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-self: stretch;
}
.checkout_formtitle{
    color: #4DA4B2;
    font-family: "Bricolage Grotesque";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 160%;
    margin: 0px;
}
.checkout_form{
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
}
.checkout_textbox{
    display: flex;
    height: 56px;
    max-height: 56px;
    padding: 20px 24px;
    align-items: center;
    grid-row: 1 / span 1;
    grid-column: 1 / span 2;
    justify-self: stretch;
    border-radius: 100px;
    border: 1px solid var(--base-04, #E9E9E9);
    background: var(--base-Off-White, #FAFAFA);
}
.checkout_textbox::placeholder{
    color: var(--base-02, #727272);
    font-family: "Bricolage Grotesque";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
}
.checkout_textbox:hover{
    border-radius: 100px;
    padding: 20px 32px;
    border: 1px solid #4DA4B2;
    background: #EFF4F5;
    box-shadow: 0 100px 80px 0 rgba(0, 0, 0, 0.07), 0 64.815px 46.852px 0 rgba(0, 0, 0, 0.05), 0 38.519px 25.481px 0 rgba(0, 0, 0, 0.04), 0 20px 13px 0 rgba(0, 0, 0, 0.04), 0 8.148px 6.519px 0 rgba(0, 0, 0, 0.03), 0 1.852px 3.148px 0 rgba(0, 0, 0, 0.02);
}
.cfirst_last{
    display: flex;
    flex-direction: row;
    gap: 24px;
    align-items: center;
}
.checkout_btn{
    background: #F7C113;
    border: 1.5px solid #F7C113;
    width: 100%;
    max-width: 274px;
    padding: 15px 35px;
    height: 56px;
    border-radius: 60px;
    cursor: pointer;
    transition: all 0.5s ease;
    color: var(--base-Off-Black, #0F0F0F);
    font-family: "Bricolage Grotesque";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
}

/* Hover state */
.checkout_btn:hover{
    background: #F7C113;
    border: 1.5px solid #F7C113;
    box-shadow: 0 0 0 8px #fff inset;
}

/* CheckboxR */
.c-checkboxR input[type='checkbox']:checked~label:after, .c-checkboxR input[type='checkbox']:checked~.label:after {
    transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    opacity: 1;
    visibility: visible;
}
.c-checkboxR>.c-divR>label:before, .c-checkboxR>.c-divR>.label:before {
    content: "";
    position: absolute;
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 10px;
    background: transparent;
    border: 1.9px solid #BDBDBD;
    box-sizing: border-box;
    box-shadow: inset 0px 4px 4px rgb(0 0 0 / 5%);
    border-radius: 30px;
    top: 5px;
    left: 0px;
}
input[type=checkbox], input[type=radio] {
    box-sizing: border-box;
    padding: 0;
}
.c-checkboxR input[type='checkbox'] {
    display: none;
}
.c-checkboxR input[type='checkbox']~label:after, .c-checkboxR input[type='checkbox']~.label:after {
    content: url(../img/check_dot.svg);
    display: block;
    position: absolute;
    color: #00173E !important;
    border-radius: 20px;
    border: 5px solid #F7C113;
    font-family: 'Poppins';
    font-size: 30px;
    text-align: center;
    line-height: 12px;
    height: 16px;
    width:16px;
    left: 0px;
    top: 5px;
    transform-origin: 50% 50%;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform: scale(0);
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    -webkit-transition: all .15s ease;
    -ms-transition: all .15s ease;
    transition: all .15s ease;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
.c-checkboxR>.c-divR>label:hover:before, .c-checkboxR>.c-divR>.label:hover:before {
    border: 2px solid #F7C113;
    cursor: pointer;
    transition: border;
}
.c-checkboxR {
    position: relative;
    margin-bottom: 0px;
}
.login_strongR {
    color: var(--brand-Teal-50, #316972);
    font-family: "Bricolage Grotesque";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
}
.login_strongR > .link_re_globalR {
    color: #4DA4B2;
    font-family: "Bricolage Grotesque";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: auto;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;
}
.c-textR {
    margin-left: 24px;
}
/* Checkbox End */
/* Checkout Css End */

/* Checkout Success Css Start */
.csuccess_s1{
    display: flex;
    padding: 240px 24px 104px 24px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 24px;
    background: #FFFFFF;
    align-self: stretch;
}
.csuccess_titlebar{
    display: flex;
    max-width: 800px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 16px;
    align-self: stretch;
    margin: auto;
}
.csuccess_title{
    color: var(--brand-Teal-25, #1E3B40);
    text-align: center;
    font-family: Figtree;
    font-size: 48px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    text-transform: capitalize;
    margin: 0px;
}
.csuccess_subtitle{
    color: var(--brand-Teal-50, #316972);
    text-align: center;
    font-family: "Bricolage Grotesque";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin: 0px;
}
.csuccess_s1 .checkout_btn{
    max-width: fit-content;
}
/* Checkout Success Css End */

/* Checkout Failed Css Start */
.cfailed_btnbar{
    display: flex;
    align-items: flex-start;
    gap: 24px;
    width: 424px;
}
.checkout_btngreen{
    background: #1E3B40;
    border: none;
    width: 100%;
    max-width: 274px;
    padding: 15px 35px;
    height: 56px;
    border-radius: 60px;
    cursor: pointer;
    transition: all 0.5s ease;
    color: var(--base-Off-Black, #F7C113);
    font-family: "Bricolage Grotesque";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
}

/* Hover state */
.checkout_btngreen:hover{
    background: #1E3B40;
    border: 1.5px solid #F7C113;
    color: var(--base-Off-Black, #F7C113);
    box-shadow: 0 0 0 8px #fff inset;
}
.cfailed_btnbar .btn{
    max-width: 100%;
}
/* Checkout Failed Css End */

/* AboutUs Css Start */
.about_smain{
    padding: 0px;
    position: relative;
    overflow: unset;
}
.about_s1{
    padding: 276px 0px 240px 0px;
    background-image: url(../img/about_s1bg.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.about_s1titlebar{
    display: flex;
    max-width: 530px;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin: auto;
}
.about_s1title{
    color: #BC5350;
    text-align: center;
    font-family: Figtree;
    font-size: 64px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    text-transform: capitalize;
    margin: 0px;
}
.about_s1subtitle{
    color: #C76E6B;
    text-align: center;
    font-family: "Bricolage Grotesque";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 140%;
    margin: 0px;
}
.about_s2{
    position: relative;
    padding: 40px 0px 126px 0px;
    background-color: #FAF6F4;
    display: flex;
    flex-direction: column;
    gap: 0px;
}
.about_s2line{
    display: flex;
    flex-direction: row;
    z-index: 1;
    padding: 18px 0px;
    min-height: 269px;
}
.about_s2textbar1{
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 480px;
}

.about_s2textbar2{
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 410px;
}
.about_s2textbar3{
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 405px;
    justify-content: center;
}
.about_s2title{
    color: var(--brand-Teal-25, #1E3B40);
    font-family: Figtree;
    font-size: 48px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    text-transform: capitalize;
    margin: 0px;
}
.about_s2subtitle{
    color: var(--brand-Teal-50, #316972);
    font-family: "Bricolage Grotesque";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin: 0px;
}
.about_s2bg{
    position: absolute;
    max-width: 616px;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    height: 100%;
    z-index: 0;
}
.about_s3main{
    background: linear-gradient(180deg, #FFF 0%, rgba(255, 255, 255, 0.00) 100%);
}
.about_s3{
    padding: 63px 104px 63px 0px;
    display: flex;
    flex-direction: column;
    gap: 40px;
    z-index: 1;
    position: relative;
}
.about_s3top{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
    max-width: 82%;
}
.about_s3toptitle{
    color: var(--brand-Teal-25, #1E3B40);
    font-family: Figtree;
    font-size: 48px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    text-transform: capitalize;
    margin: 0px;
}
.about_s3 button{
    max-width: 200px;
}
.about_s3bottom{
    display: flex;
    flex-direction: column;
    gap: 48px;
    max-width: 82%;
}
.about_s3contentline{
    display: flex;
    flex-direction: row;
    gap: 48px;
}
.about_s3card{
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 33.33%;
}
.about_s3cardtitle{
    color: var(--brand-Teal-25, #1E3B40);
    font-family: Figtree;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    text-transform: capitalize;
    margin: 0px;
}
.about_s3cardsubtitle{
    color: var(--brand-Teal-50, #316972);
    font-family: "Bricolage Grotesque";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin: 0px;
}
.about_s3bg{
    position: absolute;
    right: 0px;
    bottom: -165px;
    z-index: 0;
    max-width: 359px;
}
/* AboutUs Css End */

/* Compatibility Css Start */
.comp_smain{
    padding: 0px;
}
.comp_s1{
    padding: 276px 0px 251px 0px;
    background-image: url(../img/comp_s1bg.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.comp_c1{
    padding: 0px;
    max-width: 752px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: auto;
}
.comp_s1title{
    color: var(--brand-Teal-25, #1E3B40);
    text-align: center;
    font-family: Figtree;
    font-size: 64px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    text-transform: capitalize;
    margin: 0px;
}
.comp_s1subtitle{
    color: var(--brand-Teal-50, #316972);
    text-align: center;
    font-family: "Bricolage Grotesque";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 140%;
    margin: 0px;
}
.comp_s2{
    padding: 0px 0px 80px 0px;
}
.comp_c2{
    display: flex;
    flex-direction: row;
    gap: 80px;
    max-width: 1080px;
    width: max-content;
    margin: auto;
}
.comp_s2text{
    color: var(--brand-Teal-50, #316972);
    font-family: "Bricolage Grotesque";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin: 0px;
}
.comp_s2text li{
    color: var(--brand-Teal-50, #316972);
    font-family: "Bricolage Grotesque";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin: 0px;
}
.comp_s3{
    padding: 64px 0px;
}
.comp_c3{
    display: flex;
    flex-direction: column;
    padding: 0px 24px;
    gap: 32px;
    margin: auto;
    max-width: 750px;
    align-items: center;
}
.comp_s3titlebar{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    align-self: stretch;

}
.comp_s3title{
    color: var(--brand-Teal-25, #1E3B40);
    text-align: center;
    font-family: Figtree;
    font-size: 48px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    text-transform: capitalize;
    margin: 0px;
}
.comp_s3subtitle{
    color: var(--brand-Teal-50, #316972);
    text-align: center;
    font-family: "Bricolage Grotesque";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin: 0px;
}
.comp_c3 .btn{
    max-width: 200px;
}
/* Compatibility Css End */





/* *************** */
/* Responsive Css */
/* ************* */

@media screen and (max-width: 700px) {
    .desktop_none{
    display: block;
    }
    .mobile_none{
    display: none;
    }
/* Checkout Css Start */
    .checkout_smain{
        padding: 0px;
        background: var(--base-Off-White, #FAFAFA);
    }
    .checkout_s1{
        background-image: url(../img/checkout_bgmob.png);
        padding: 112px 24px 145px 24px;
        background-position: center bottom;
        background-repeat: no-repeat;
        background-size: cover;
        max-width: 100%;
    }
    .checkout_title{
        font-size: 32px;
    }
    .checkout_s2{
        padding: 0px;
        flex-direction: column;
        width: 100%;
        gap: 0px;
    }
    .checkout_left{
        padding: 0px 16px 32px 16px;
        gap: 24px;
        width: 100%;
    }
    .checkout_leftmidcard{
        padding: 20px 16px;
    }
    .checkout_right{
        padding: 24px;
    }
    .cfirst_last{
        flex-direction: column;
        gap: 16px;
    }
    .checkout_form{
        gap: 16px;
    }
    .checkout_btn{
        max-width: 100%;
    }
/* Checkout Css End */

/* Checkout Success Css Start */
.csuccess_s1{
    padding: 104px 24px 40px 24px;
}
.csuccess_title{
    font-size: 32px;
}
.csuccess_s1 .checkout_btn{
    max-width: fit-content;
}
/* Checkout Success Css End */

/* Checkout Failed Css Start */
.cfailed_btnbar{
    width: 100%;
}
.cfailed_btnbar .btn{
    max-width: none !important;
}
/* Checkout Failed Css End */

/* AboutUs Css Start */
.about_s2line{
    padding: 0px;
    min-height: fit-content;
}
.about_s1{
    background-image: url(../img/about_s1bgmob.png);
    padding: 175px 24px 187px 24px;
}
.about_s1title{
    font-size: 32px;
}
.about_s2{
    padding: 24px 24px 40px 24px;
    gap: 32px;
    background-image: url(../img/about_s2bgmob.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.about_s2bg{
    display: none;
}
.about_s2title{
    font-size: 28px;
}
.about_s2line .w-100{
    display: none;
}
.about_s3main .container{
    padding: 0px;
}
.about_s3{
    padding: 40px 24px 48px 24px;
    gap: 24px;
}
.about_s3toptitle{
    font-size: 28px;
}
.about_s3contentline{
    flex-direction: column;
    gap: 16px;
}
.about_s3top{
    max-width: 100%;
}
.about_s3bottom{
    max-width: 100%;
    gap: 16px;
}
.about_s3main container{
    padding: 0px;
}
.about_s3card{
    width: 100%;
}
.about_s3bg{
    max-width: 150px;
    bottom: -255px;
}
/* AboutUs Css End */

/*  Compatibility Start */
.comp_s1{
    padding: 157px 24px;
    background-image: url(../img/comp_s1bgmob.png);
}
.comp_s1title{
    font-size: 32px;
}
.comp_s2{
    padding: 10px 24px 40px 24px;
}
.comp_c2{
    flex-direction: column;
    gap: 0px;
}
.comp_s3{
    padding: 40px 0px;
}
.comp_c3{
    padding: 0px 24px;
    gap: 24px;
}
.comp_s3title{
    font-size: 28px;
}
}

@media screen and (min-device-width: 700px) and (max-device-width: 799px) {
    .checkout_s2{
        width: 670px;
        gap: 0px;
        padding: 16px 12px;
    }
    .checkout_right{
        padding: 16px 12px;
    }
    .checkout_left{
        width: 336px;
        padding: 16px 12px;
    }
    .checkout_btn{
        max-width: 224px;
    }
    .cfirst_last{
        flex-direction: column;
        gap: 16px;
    }
    .checkout_leftmidcard{
        padding: 16px;
        gap: 12px;
    }
    .checkout_cardtitle{
        font-size: 14px;
    }
    .checkout_infotext{
        font-size: 12px;
    }
    .checkout_form{
        gap: 16px;
    }
    .about_s2title{
        font-size: 24px;
    }
    .about_s2subtitle{
        font-size: 10px;
    }
    .about_s2textbar1{
        max-width: 260px;
    }
    .about_s2textbar2{
        max-width: 225px;
    }
    .about_s2textbar3{
        max-width: 230px;
    }
    .about_s2{
        padding: 40px 0px 80px 0px;
    }
    .about_s1title{
        font-size: 56px;
    }
    .container{
        max-width: 650px;
    }
    .comp_c2{
        gap: 40px;
    }
    
}

@media screen and (min-device-width: 800px) and (max-device-width: 899px) {
    .checkout_s2{
        width: 750px;
        gap: 0px;
        padding: 16px 12px;
    }
    .checkout_right{
        padding: 16px;
    }
    .checkout_left{
        width: 390px;
        padding: 16px;
    }
    .checkout_btn{
        max-width: 224px;
    }
    .cfirst_last{
        flex-direction: column;
        gap: 16px;
    }
    .checkout_form{
        gap: 16px;
    }
    .about_s2title{
        font-size: 24px;
    }
    .about_s2subtitle{
        font-size: 10px;
    }
    .about_s2textbar1{
        max-width: 260px;
    }
    .about_s2textbar2{
        max-width: 225px;
    }
    .about_s2textbar3{
        max-width: 230px;
    }
    .about_s2{
        padding: 40px 0px 80px 0px;
    }
    .about_s1title{
        font-size: 56px;
    }
    .about_s3{
        max-width: 90%;
    }
    .about_s3toptitle{
        font-size: 32px;
    }
    .about_s3cardtitle{
        font-size: 18px;
    }
    .about_s3cardsubtitle{
        font-size: 12px;
    }
    .about_s3contentline{
        gap: 24px;
    }
    .about_s3bottom{
        gap: 24px;
    }
    .about_s3toptitle{
        font-size: 36px;
    }
    .about_s3contentline{
        gap: 24px;
    }
    .about_s3bg{
        max-width: 310px;
    }
    .about_s3cardtitle{
        font-size: 18px;
    }
    .about_s3cardsubtitle{
        font-size: 14px;
    }
    .about_s3top{
        max-width: 85%;
    }
    .about_s3bottom{
        max-width: 85%;
        gap: 24px;
    }
    .about_s3toptitle{
        font-size: 24px;
    }
    .about_s3contentline{
        gap: 24px;
    }
    .about_s3bg{
        max-width: 260px;
    }
    .comp_c2{
        gap: 32px;
    }
    .comp_s2text{
        font-size: 12px;
    }
    .comp_s2text li{
        font-size: 12px;
    }
}

@media screen and (min-device-width: 900px) and (max-device-width: 999px) {
    .checkout_s2{
        width: 850px;
        gap: 16px;
    }
    .checkout_right{
        padding: 16px;
    }
    .checkout_left{
        width: 400px;
        padding: 16px;
    }
    .checkout_btn{
        max-width: 224px;
    }
    .cfirst_last{
        flex-direction: column;
        gap: 16px;
    }
    .checkout_form{
        gap: 16px;
    }
    .about_s2title{
        font-size: 32px;
    }
    .about_s2subtitle{
        font-size: 14px;
    }
    .about_s2title{
        font-size: 32px;
    }
    .about_s2subtitle{
        font-size: 14px;
    }
    .about_s2textbar1{
        max-width: 340px;
    }
    .about_s2textbar2{
        max-width: 320px;
    }
    .about_s2textbar3{
        max-width: 300px;
    }
    .about_s2title{
        font-size: 24px;
    }
    .about_s2subtitle{
        font-size: 10px;
    }
    .about_s2textbar1{
        max-width: 260px;
    }
    .about_s2textbar2{
        max-width: 225px;
    }
    .about_s2textbar3{
        max-width: 230px;
    }
    .about_s2{
        padding: 40px 0px 80px 0px;
    }
    .about_s1title{
        font-size: 56px;
    }
    .about_s3cardtitle{
        font-size: 18px;
    }
    .about_s3cardsubtitle{
        font-size: 14px;
    }
    .about_s3top{
        max-width: 80%;
    }
    .about_s3bottom{
        max-width: 80%;
        gap: 24px;
    }
    .about_s3toptitle{
        font-size: 36px;
    }
    .about_s3contentline{
        gap: 24px;
    }
    .about_s3bg{
        max-width: 310px;
    }
    .about_s3cardtitle{
        font-size: 18px;
    }
    .about_s3cardsubtitle{
        font-size: 14px;
    }
    .about_s3top{
        max-width: 80%;
    }
    .about_s3bottom{
        max-width: 80%;
        gap: 24px;
    }
    .about_s3toptitle{
        font-size: 24px;
    }
    .about_s3contentline{
        gap: 24px;
    }
    .about_s3bg{
        max-width: 310px;
    }
    .comp_c2{
        gap: 40px;
    }
    .comp_s2text{
        font-size: 14px;
    }
    .comp_s2text li{
        font-size: 14px;
    }
}

@media screen and (min-device-width: 1000px) and (max-device-width: 1099px) {
    .checkout_s2{
        width: 900px;
        gap: 16px;
    }
    .checkout_right{
        padding: 48px 16px;
    }
    .checkout_left{
        width: 400px;
        padding: 32px 16px;
    }
    .checkout_btn{
        max-width: 224px;
    }
    .about_s2title{
        font-size: 32px;
    }
    .about_s2subtitle{
        font-size: 14px;
    }
    .about_s2textbar1{
        max-width: 340px;
    }
    .about_s2textbar2{
        max-width: 320px;
    }
    .about_s2textbar3{
        max-width: 300px;
    }
    .container{
        max-width: 950px;
    }
    .about_s3cardtitle{
        font-size: 18px;
    }
    .about_s3cardsubtitle{
        font-size: 14px;
    }
    .about_s3top{
        max-width: 80%;
    }
    .about_s3bottom{
        max-width: 80%;
        gap: 24px;
    }
    .about_s3toptitle{
        font-size: 36px;
    }
    .about_s3contentline{
        gap: 24px;
    }
    .about_s3bg{
        max-width: 310px;
    }
    .comp_c2{
        gap: 56px;
    }
}

@media screen and (min-device-width: 1100px) and (max-device-width: 1199px) {
    .checkout_s2{
        width: 1000px;
        gap: 16px;
    }
    .checkout_right{
        padding: 48px 24px;
    }
    .checkout_left{
        width: 440px;
        padding: 32px 24px;
    }
    .checkout_btn{
        max-width: 268px;
    }
    .about_s2title{
        font-size: 32px;
    }
    .about_s2subtitle{
        font-size: 14px;
    }
    .container{
        max-width: 1000px;
    }
    .about_s2textbar1{
        max-width: 340px;
    }
    .about_s2textbar2{
        max-width: 320px;
    }
    .about_s2textbar3{
        max-width: 300px;
    }
    .about_s3cardtitle{
        font-size: 18px;
    }
    .about_s3cardsubtitle{
        font-size: 14px;
    }
    .about_s3top{
        max-width: 85%;
    }
    .about_s3bottom{
        max-width: 85%;
        gap: 24px;
    }
    .about_s3toptitle{
        font-size: 36px;
    }
    .about_s3bg{
        max-width: 300px;
    }

    .about_s3contentline{
        gap: 24px;
    }
    .about_smain .container{
        max-width: 1040px;
    }
}

@media screen and (min-device-width: 1200px) and (max-device-width: 1299px) {
    .checkout_s2{
        width: 1200px;
    }
    .checkout_right{
        padding: 48px 24px;
    }
    .about_s1title{
        font-size: 32px;
    }
    .about_s1subtitle{
        font-size: 14px;
    }
    .container{
        max-width: 1180px;
    }
    .about_s3cardtitle{
        font-size: 18px;
    }
    .about_s3cardsubtitle{
        font-size: 14px;
    }
    .about_s3top{
        max-width: 80%;
    }
    .about_s3bottom{
        max-width: 80%;
    }
    .about_s3cardtitle{
        font-size: 18px;
    }
    .about_s3cardsubtitle{
        font-size: 14px;
    }
    .about_s3top{
        max-width: 80%;
    }
    .about_s3bottom{
        max-width: 80%;
    }
    .about_s2title{
        font-size: 46px;
    }
}

@media screen and (min-device-width: 1300px) and (max-device-width: 1399px) {
    .checkout_s2{
        width: 1200px;
    }
    .checkout_right{
        padding: 48px 24px;
    }
    .about_s3cardtitle{
        font-size: 18px;
    }
    .about_s3cardsubtitle{
        font-size: 14px;
    }
    .about_s3top{
        max-width: 80%;
    }
    .about_s3bottom{
        max-width: 80%;
    }
    .about_s2title{
        font-size: 46px;
    }
}

@media screen and (min-device-width: 1400px) and (max-device-width: 1499px) {
    .container{
        max-width: 1250px;
    }
    .about_s3cardtitle{
        font-size: 18px;
    }
    .about_s3cardsubtitle{
        font-size: 14px;
    }
    .about_smain .container{
        max-width: 1340px;
    }
}

@media screen and (min-device-width: 1500px) and (max-device-width: 1599px) {
    .about_s2{
        max-width: 1400px;
    }
    .about_s3cardtitle{
        font-size: 18px;
    }
    .about_s3cardsubtitle{
        font-size: 14px;
    }
}

@media screen and (min-device-width: 1600px) and (max-device-width: 1699px) {

    .about_s3cardtitle{
        font-size: 18px;
    }
    .about_s3cardsubtitle{
        font-size: 14px;
    }
    .about_s2line{
        width: 90%;
        margin: auto;
    }
}

@media screen and (min-device-width: 1700px) and (max-device-width: 1799px) {
    .about_s3cardtitle{
        font-size: 18px;
    }
    .about_s3cardsubtitle{
        font-size: 14px;
    }
    .about_s2line{
        width: 90%;
        margin: auto;
    }
}

@media screen and (min-device-width: 1800px) and (max-device-width: 1899px) {
    .about_s3cardtitle{
        font-size: 18px;
    }
    .about_s3cardsubtitle{
        font-size: 14px;
    }
    .about_s2line{
        width: 90%;
        margin: auto;
    }
}

@media screen and (min-device-width: 1900px) and (max-device-width: 1999px) {
    .about_s2line{
        width: 90%;
        margin: auto;
    }
}

@media screen and (min-device-width: 2000px) and (max-device-width: 2400px) {
    .about_s2line{
        width: 90%;
        margin: auto;
    }
}