.checkout {
    background: #f6f6f6;
}

:root {
    --adyen-sdk-color-background-always-dark: #006dff;
    --adyen-sdk-color-background-inverse-primary-hover: #0048cd;
    --adyen-sdk-text-caption-font-size: 12px;
    --adyen-sdk-text-body-font-size: 14px;
}


.header {
    padding: 20px 0;
    border-bottom: 1px solid #e2e2e2;
    background: #fff;
    height: fit-content;
}

.icon-visa {
    display: inline-block;
    background: url('/static/img/sprite2.png') no-repeat -18px -116px;
    width: 43px;
    height: 30px;
}

.success-icon {
    display: inline-block;
    background: url('/static/img/sprite2.png') no-repeat -256px -168px;
    width: 14px;
    height: 14px;
}

.language-icon {
    display: inline-block;
    background: url('/static/img/sprite2.png') no-repeat -215px -169px;
    width: 15px;
    height: 14px;
}

.google-icon {
    display: inline-block;
    background: url('/static/img/sprite2.png') no-repeat -161px -291px;
    width: 51px;
    height: 20px;
    vertical-align: middle;
}

.more-img {
    display: inline-block;
    background: url('/static/img/sprite2.png') no-repeat -446px -63px;
    width: 37px;
    height: 37px;

}

.product-close {
    display: inline-block;
    background: url('/static/img/sprite2.png') no-repeat -333px -164px;
    width: 21px;
    height: 21px;
}

.remove-coupon {
    cursor: pointer
}

.coupon-icon {
    display: inline-block;
    background: url('/static/img/sprite2.png') no-repeat -174px -168px;
    width: 16px;
    height: 16px;

}

.coupon-close {
    display: inline-block;
    background: url('/static/img/sprite2.png') no-repeat -237px -168px;
    width: 14px;
    height: 15px;
}

.success-img {
    display: inline-block;
    background: url('/static/img/sprite2.png') no-repeat -376px -113px;
    width: 38px;
    height: 33px;
}

.icon-user {
    display: inline-block;
    background: url('/static/img/sprite2.png') no-repeat -302px -163px;
    width: 23px;
    height: 23px;
}

.error-icon {
    display: inline-block;
    background: url('/static/img/sprite2.png') no-repeat -197px -172px;
    width: 11px;
    height: 11px;
}

.card-types {
    background: url('/static/img/card-types.svg');
    width: 347px;
    height: 30px;
}

.nova2pay-cardType,
.antom-cardType {
    background: url('/static/img/card-type.svg') no-repeat center center / cover;
    width: 132px;
    height: 39px;
    margin-top: 20px;
}

.card-number-nova2pay,
.card-number-antom_card {
    position: relative;
}

.card-number-nova2pay:after,
.card-number-antom_card:after {
    content: "";
    position: absolute;
    top: 10px;
    right: 15px;
    width: 25px;
    height: 17px;
    background: url('/static/img/card-icon.svg') no-repeat center center / contain;
    background-size: 100% 100%;

}

.ssl {
    display: inline-block;
    background: url('/static/img/ssl2x.png') no-repeat center center / cover;
    width: 62px;
    height: 32px;
}

.securetrust {
    display: inline-block;
    background: url('/static/img/validate2x.png') no-repeat center center / cover;
    width: 55px;
    height: 32px;
}

.norton {
    display: inline-block;
    background: url('/static/img/norton2x.png') no-repeat center center / cover;
    width: 61px;
    height: 32px;
}

.mcafee {
    display: inline-block;
    background: url('/static/img/mcafee2x.png') no-repeat center center / cover;
    width: 62px;
    height: 32px;
}

.arrow {
    display: inline-block;
    background: url('/static/img/sprite2.png') no-repeat -129px -173px;
    width: 10px;
    height: 7px;

}

.icon-paypal {
    display: inline-block;
    background: url('/static/img/sprite2.png') no-repeat -18px -289px;
    width: 79px;
    height: 22px;
}

.full-loading {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, 0.514);
    display: flex;
    justify-content: center;
    align-items: center;
}

.loading-black {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    animation: loading 2s linear infinite;
}

.header .logo {
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    /* display: none; */
    height: 42px;
    opacity: 0;
    width: 180px;
    min-height: 20px;

}

.header .header-img {
    height: 32px;
}

.header .container {
    position: relative;
    /*  display: flex;*/
    /*  align-items: center;*/
    /*  justify-content: space-between;*/
}

.header .header-content {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 15px;
}

.header .language {
    position: relative;
    font-size: 14px;
}

.header .language-text {
    display: flex;
    align-items: center;
    border-radius: 4px;
    border: 1px solid #e7e7e7;
    background: #f5f5f5;
    padding: 7px 7px;
    cursor: pointer;
}

.header .language-select-box {
    border-radius: 3px;
    border: 1px solid #d9d9d9;
    position: absolute;
    z-index: 99;
    height: 147px;
    background: #fff;
    min-width: 100%;
    display: none;
}

.header .arrow {
    margin-left: 13px;
}

.header .language-icon {
    margin-right: 8px;
}

.currency-text {
    min-width: 180px;
}

.header .language-select-box {
    width: max-content;
    padding: 7px;
    height: 145px;
    overflow-y: scroll;
    min-width: 113px;
}

.header .language-select-box li {
    padding: 6px;
    cursor: pointer;
}

.header .language-select-box li:hover {
    border-radius: 4px;
    background: #f6f6f6;
}

.service-tips {
    position: relative;
    cursor: pointer;
    display: inline-block;
}

.tips-pop {
    position: absolute;
    padding: 8px 15px;
    width: 220px;
    top: 50%;
    transform: translateY(-50%);
    left: 30px;
    color: #333;
    font-size: 12px;
    font-weight: 300;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s ease, visibility 0s 0.3s;
    border-radius: 6px;
    background: #fff;
    line-height: 1.5;
    box-shadow: 0px 6px 19.9px 0px rgba(120, 120, 120, 0.18);
}

.tips-pop::after {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -10px;
    content: "";
    width: 0;
    height: 0;
    border-right: 15px solid #ffffff;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
}

.service-tips:hover .tips-pop {
    visibility: visible;
    opacity: 1;
    transition: opacity 0.3s ease, visibility 0s 0s;
}

.page {
    background: #fff;
    padding: 25px 28px;
}

.content {
    width: max-content;
    margin: 0 auto;
}

.main {
    margin: 30px auto 0 auto;
    width: max-content;
    max-width: 1300px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
}

.bottom {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.product-close {
    cursor: pointer;
    /* margin-top: 13px; */
    width: 20px;
}

.page-title {
    color: #212121;
    font-size: 24px;
    font-weight: 500;
}

@keyframes loading {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(360deg);
    }
}

.coupon-icon {
    cursor: pointer;
}

.arrow {
    transition: all 0.2s;
}

.arrow.active {
    transform: rotate(180deg);
}

.search-select {
    position: relative;
    width: max-content;
    font-size: 14px;
}

.search-select .search-text {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 3px;
    border: 1px solid #d9d9d9;
    padding: 5px 11px 5px 6px;
    width: max-content;
    min-width: 180px;
}

.search-select .search-box {
    display: flex;
    align-items: center;
    border-radius: 3px;
    border: 1px solid #d9d9d9;
    background: #fff;
    padding: 7px 5px;
}

.search-select .search-ul {
    display: none;
    position: absolute;
    border-radius: 3px;
    border: 1px solid #d9d9d9;
    padding: 7px;
    background: #fff;
    font-weight: 300;
    width: max-content;
    z-index: 99;
}

.search-select .search-value {
    font-weight: 300;
}

.search-select ul {
    margin-top: 6px;
    max-height: 200px;
    overflow: scroll;
}

.search-select li {
    cursor: pointer;
    padding: 5px;
}

.search-select li:hover {
    border-radius: 4px;
    background: #f6f6f6;
}

.search-select input {
    width: 80%;
    margin-left: 8px;
}

.order-title {
    display: flex;
    justify-content: space-between;
}

.page {
    width: 610px;
}

.table-box {
    margin-top: 16px;
}

.table-box .table-header {
    display: flex;
    justify-content: space-between;
    border-radius: 3px;
    background: #f1f1f1;
    padding: 6px 46px 9px 16px;
    font-weight: 300;
}

.table-box .product-name {
    width: 285px;
    line-height: 1.5;
}

.table-box .num {
    width: 10%;
    text-align: center;
}

.table-box .product-tr .num {
    text-align: center;
    width: 10%;
}

.table-box .price-td {
    width: 100px;
}

.table-box .product-tr {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.table-box .price-td {
    text-align: center;
}

.table-box .table-body {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 333px;
    overflow-y: scroll;
    margin-top: 16px;
}

.table-box .service {
    border-radius: 3px;
    background: #f6f6f6;
    margin-top: 16px;
    padding: 13px;
    display: flex;
    justify-content: space-between;
}

.table-box .service-name img {
    width: 13px;
}

.table-box .product-item {
    width: 490px;
}

.table-box .table-body_tr {
    display: flex;
    align-items: start;
    justify-content: space-between;
    border-radius: 3px;
    border: 1px solid #dfdfdf;
    padding: 17px;
}

.table-box .text {
    width: 179px;
    color: #212121;
}

.table-box .service-tr {
    display: flex;
    align-items: center;
    font-weight: 300;
    gap: 12px;
}

input[type="checkbox"] {
    appearance: none;
    width: 17px;
    height: 17px;
    border: 1px solid #ddd;
    border-radius: 2px;
    background: #fff;
    cursor: pointer;
    position: relative;
}

input[type="checkbox"]:checked {
    background: #fff;
}

input[type="checkbox"]:checked:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 4px;
    top: 0;
    width: 10px;
    height: 7px;
    background: url(/static/img/right.png) no-repeat center;
    background-size: contain;
}

.cvc .payment-info_input,
.cvc-nova2pay .payment-info_input,
.cvc-antom_card .payment-info_input {
    position: relative;
}

/* .cvc  */
.error-icon {
    position: absolute;
    width: 14px;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 10px;
    cursor: pointer;
}

.cvc .error-icon:hover ~ .cvc-pop,
.cvc-nova2pay .error-icon:hover ~ .cvc-pop,
.cvc-antom_card .error-icon:hover ~ .cvc-pop {
    visibility: visible;
    opacity: 1;
    transition: opacity 0.3s ease, visibility 0s 0s;
}

.cvc .cvc-pop,
.cvc-nova2pay .cvc-pop,
.cvc-antom_card .cvc-pop {
    position: absolute;
    z-index: 99;
    right: -10px;
    max-width: 300px;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0px 3.078px 12.4px 0px rgba(120, 120, 120, 0.18);
    padding: 12px;
    text-align: center;
    width: max-content;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s ease, visibility 0s 0.3s;
}

.cvc .cvc-pop::after,
.cvc-nova2pay .cvc-pop::after,
.cvc-antom_card .cvc-pop::after {
    position: absolute;
    top: -6px;
    right: 17px;
    content: "";
    width: 0;
    height: 0;
    border-bottom: 15px solid #ffffff;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
}

.cvc .cvc-pop .cvc-pop_title,
.cvc-nova2pay .cvc-pop .cvc-pop_title,
.cvc-antom_card .cvc-pop .cvc-pop_title {
    font-size: 12px;
    font-weight: 500;
    color: #333;
}

.cvc .cvc-pop .cvc-box,
.cvc-nova2pay .cvc-pop .cvc-box,
.cvc-antom_card .cvc-pop .cvc-box {
    display: flex;
    justify-content: center;
    gap: 13px;
    font-size: 10px;
    margin-top: 10px;
}

.cvc .cvc-pop .cvc-item,
.cvc-nova2pay .cvc-pop .cvc-item,
.cvc-antom_card .cvc-pop .cvc-item {
    width: 130px;
}

.cvc .cvc-pop .cvc-text,
.cvc-nova2pay .cvc-pop .cvc-text,
.cvc-antom_card .cvc-pop .cvc-text {
    padding: 0;
    line-height: 1.5;
    margin-top: 7px;
}

.cvc .cvc-pop img,
.cvc-nova2pay .cvc-pop .cvc-img,
.cvc-antom_card .cvc-pop .cvc-img {
    width: 130px;
    height: 76px;
}

.cvc-nova2pay .cvc-pop .cvc-img1,
.cvc-antom_card .cvc-pop .cvc-img1 {
    background: url(/static/img/cvc-img1.webp) no-repeat center center / cover;
}

.cvc-nova2pay .cvc-pop .cvc-img2,
.cvc-antom_card .cvc-pop .cvc-img2 {
    background: url(/static/img/cvc-img2.webp) no-repeat center center / cover;
}

.cvc .cvc-pop .cvc-tips,
.cvc-nova2pay .cvc-pop .cvc-tips,
.cvc-antom_card .cvc-pop .cvc-tips {
    color: #8d8d8d;
    font-size: 10px;
    font-weight: 300;
    margin-top: 11px;
    line-height: 1.5;
}

.old-price {
    color: #666;
    font-size: 12px;
    text-decoration: line-through;
    font-weight: 300;
    margin-top: 5px;
}

.order-box {
    margin-top: 34px;
}

.order-box .order-box_title {
    font-weight: 300;
    color: #1685fe;
}

.order-box .order-box_item {
    display: flex;
    justify-content: space-between;
    border-radius: 3px;
    border: 1px solid rgba(29, 136, 255, 0.3);
    background: rgba(29, 136, 255, 0.05);
    padding: 15px 18px;
    margin-top: 12px;
    line-height: 1.5;
}

.order-box .item-right {
    display: flex;
    align-items: center;
    gap: 20px;
}

.order-box .add {
    cursor: pointer;
    width: 20px;
}

.order-box .product-name {
    width: 180px;
}

.coupon {
    margin: 15px 0;
}

.coupon .coupon-one {
    display: flex;
    align-items: center;
    gap: 10px;
}

.coupon .coupon-text {
    color: #1685fe;
    cursor: pointer;
    font-weight: 300;
}

.coupon-con {
    display: none;
}

.coupon-con-box {

    border-radius: 4px;
    border: 1px solid #dbdbdb;
    background: #fff;
    width: 170px;
    font-size: 12px;
    padding: 4px 8px;
}

.coupon .coupon-con input {
    width: 89%;
    background: transparent;
}

.coupon .coupon-btn {
    display: none;
    color: #44ca4d;
    font-size: 12px;
    border-radius: 4px;
    background: rgba(68, 202, 77, 0.1);
    padding: 4px 10px;
    font-weight: 300;
    cursor: pointer;
}

.coupon .success-text {
    display: none;
    color: #44ca4d;
    font-size: 12px;
    font-weight: 300;
}

.coupon .coupon-tips {
    display: none;
    color: #e02020;
    font-size: 12px;
    font-weight: 300;
    margin-top: 7px;
    padding-left: 25px;
}

.coupon .coupon-close {
    display: none;
    border-radius: 3px;
    cursor: pointer;
}

.coupon .success-icon {
    display: none;
}

.total,
.coupon-discount,
.tax {
    width: 100%;
    display: flex;
    justify-content: space-between;
    font-weight: 300;
    margin-top: 10px;
}

.coupon-price,
.tax-price {
    color: #808080;
}

.tax-tag {
    color: #006dff;
    border-radius: 3px;
    background: rgba(3, 111, 254, 0.1);
    padding: 3px 4px;
}

.payment {
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #d9d9d9;
    padding-top: 20px;
    font-size: 18px;
    margin-top: 15px;
}

.payment-pirce {
    color: #ff4c4c;
}

.agreement {
    font-weight: 300;
    margin: 30px 0;
}

.agreement a {
    margin-right: 30px;
    color: #848484;
    text-decoration: underline;
}

.email-tips {
    color: #212121;
    font-size: 16px;
    font-weight: 300;
    line-height: 150%;
}

.email-box {
    position: relative;
    width: 280px;
    margin-top: 20px;
}

.email-box input {
    font-size: 16px;
    width: 100%;
    border-radius: 4px;
    border: 1px solid #dbdbdb;
    background: #fff;
    padding: 10px 12px;
}

.email-box ul {
    display: none;
    position: absolute;
    width: 100%;
    height: 138px;
    overflow-y: scroll;
    border-radius: 3px;
    border: 1px solid #d9d9d9;
    background: #fff;
    padding: 6px;
    z-index: 99;
    /* opacity: 0;
    visibility: hidden;
    transition: all .2s;
    max-height: 0; */
}

.email-ul.active {
    opacity: 1;
    visibility: visible;
    max-height: 138px;
}

.email-box li {
    padding: 4px 6px;
    font-weight: 300;
    cursor: pointer;
}

.email-box li:hover {
    border-radius: 4px;
    background: #f6f6f6;
}

.email-box .error {
    border: 1px solid #e02020;
    background: #fbeeee;
}

.payment-method {
    margin-top: 22px;
}

.payment-method_title {
    font-size: 16px;
    margin-top: 46px;
}

.payment-methods {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 15px;
}

.payment-method_item {
    display: flex;
    align-items: center;
    gap: 12px;

}

.item-radio {
    position: relative;
    width: 12px;
    height: 12px;
    border: 1px solid #ddd;
    border-radius: 50%;
    cursor: pointer;
}

.item-type {
    position: relative;
    transition: all 0.2s;
    cursor: pointer;
}

.item-type img {
    height: 36px;
    width: auto;
}

.type-icon .tips-pop {
    /* top: 0;
    visibility: visible;
    opacity: 1; */
    transition: opacity 0.3s ease, visibility 0s 0s;
    left: 50%;
    transform: translate(-50%, calc(-100% - 40px));
    width: 280px;
    z-index: 99;
    text-align: center;
}

.type-icon .tips-pop::after {
    border-left: 10px solid transparent;
    border-top: 15px solid #fff;
    border-bottom: unset;
    border-right: 10px solid transparent;
    left: 50%;
    transform: translate(-50%, -50%);
    top: unset;
    bottom: -20px;

}

.airwallex_apple .item-type.disable:hover .tips-pop {
    visibility: visible;
    opacity: 1;
    transition: opacity 0.3s ease, visibility 0s 0s;
}

/* .type-icon:nth-of-type(2) {
  display: none;
} */

.type-icon {
    /* overflow: hidden; */
    position: relative;
}

.jump_pay_card.selecte .type-icon {
    background: url(/static/images/checkout/jumppay-card-s.png) no-repeat center center / cover;
    width: 75px;
    height: 37px;
}

.jump_pay_wallet.selected .type-icon {
    background: url(/static/images/checkout/jumppay-sbp-s.png) no-repeat center center / cover;
    width: 75px;
    height: 37px;
}


.jump_pay_card .type-icon {
    background: url(/static/images/checkout/jumppay-card.png) no-repeat center center / cover;
    width: 75px;
    height: 37px;
}

.jump_pay_wallet .type-icon {
    background: url(/static/images/checkout/jumppay-sbp.png) no-repeat center center / cover;
    width: 76px;
    height: 37px;
}


.airwallex_apple .type-icon {
    background: url(/static/img/applepay.svg) no-repeat center center / cover;
    width: 72px;
    height: 37px;
}

.airwallex_apple.selected .type-icon {
    background: url(/static/img/applypay-s.svg) no-repeat center center / cover;
    height: 36px;
}

.stripe_card .type-icon {
    background: url(/static/img/stripe.svg) no-repeat center center / cover;
    width: 77px;
    height: 37px;
}

/* .adyencard .type-icon  {
  background: url(/static/img/adyen.svg)  no-repeat  center center / cover;
	width: 77px;
	height: 37px;
 } */
.nova2pay_card .type-icon,
.airwallex_card .type-icon,
.ocean_card .type-icon,
.adyen_card .type-icon,
.wondergate_card .type-icon,
.antom_card .type-icon {
    background: url(/static/img/card.svg) no-repeat center center / cover;
    width: 108px;
    height: 37px;
}

/* .adyencard.selected .type-icon  {
  background: url(/static/img/adyen-s.svg)  -no-repeat  center center / cover;
	width: 77px;
	height: 37px;
 } */
.stripe_card.selected .type-icon {
    background: url(/static/img/stripe-s.svg) no-repeat center center / cover;
    width: 76px;
    height: 36px;
}

.qrcode_pay .type-icon {
    background: url(/static/img/qrcode.svg) no-repeat center center / cover;
    width: 108px;
    height: 37px;
}

.qrcode-tips-title {
    font-weight: 600;
    font-size: 16px;
}

.qrcode-box-content {
    display: flex;
    gap: 20px;
}

.qrcode_pay.selected .type-icon {
    background: url(/static/img/qrcode-s.svg) no-repeat center center / cover;
    width: 108px;
    height: 37px;
}

.nova2pay_card.selected .type-icon,
.antom_card.selected .type-icon,
.airwallex_card.selected .type-icon,
.ocean_card.selected .type-icon,
.adyen_card.selected .type-icon,
.wondergate_card.selected .type-icon {
    background: url(/static/img/card-s.svg) no-repeat center center / cover;
    height: 36px;
}

.airwallex_google .type-icon {
    background: url(/static/img/googlepay.svg) no-repeat center center / cover;
    width: 77px;
    height: 37px;
}

.airwallex_google.selected .type-icon {
    background: url(/static/img/googlepay-s.svg) no-repeat center center / cover;
    width: 77px;
    height: 36px;
}

.paypal .type-icon {
    background: url(/static/img/paypal.svg) no-repeat center center / cover;
    width: 108px;
    height: 37px;
}

.paypal.selected .type-icon {
    background: url(/static/img/paypal-s.svg) no-repeat center center / cover;
    width: 108px;
    height: 36px;
}

.tips-content a {
    text-decoration: underline;
}

.selected .item-radio::after {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    background: #11a5ff;
    border-radius: 50%;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
}

.card-types {
    margin-top: 15px;
    max-height: 30px;
    max-width: 100%;
}

.stripecard-box,
.adyencard-box {
    display: none;
}

.billing-info,
.nova2paycard-box,
.antomcard-box,
.payment-info {
    margin-top: 16px;
    display: flex;
    align-items: start;
    gap: 15px;
}

.billing-input {
    border-radius: 4px;
    border: 1px solid #dbdbdb;
    background: #fff;
    padding: 9px;
    width: 130px;
}

.payment-info_input {
    padding: 0 9px;
}

.search-select .country-text,
.search-select .state-text {
    padding: 9px;
    font-size: 12px;
}

.payment-info_input {
    border-radius: 4px;
    border: 1px solid #dbdbdb;
    height: 36px;
    /* padding: 9px; */
    font-size: 12px;
    width: 100%;
}

.checkout-btn-disable {
    position: relative;
    z-index: 1;
    background: #f4f4f5!important;
    color: #909399!important;
    pointer-events: none;
    border: 0.5px solid #e9e9eb;
}
.checkout-btn-disable::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(0.5px);
    border-radius: 4px;
    z-index: 90;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    cursor: not-allowed;
}

.qyt_title,
.result-table_td:nth-of-type(2) {
    width: 130px;
    text-align: center;
}

.price_title,
.result-table_td:nth-of-type(3),
.until_title,
.result-table_td:nth-of-type(4) {
    width: 115px;
    text-align: center;
    /* word-break: break-all; */
}

.card-number,
.card-number-nova2pay,
.card-number-antom_card {
    width: 336px;
}

.expiry,
.cvc,
.expiry-nova2pay,
.expiry-antom_card {
    width: 210px;
}

.cvc-nova2pay,
.cvc-antom_card {
    width: 160px;
}

.stripecard-box,
.oceanCardpay-box,
.adyencard-box {
    margin-top: 20px;
}


.submit,
.stripecard-btn,
.stripecard-submit,
.qrcode-btn,
.nova2paycard-btn,
.antom-card-btn,
.oceanCardpay-btn,
.adyencard-btn,
.wondergate-card-btn,
.jump-pay-btn {
    display: none;
    font-size: 18px;
    color: #fff;
    border-radius: 4px;
    background: #006dff;
    padding: 11px 30px;
    width: max-content;
    text-align: center;
    margin-top: 56px;
    letter-spacing: -0.63px;
    cursor: pointer;
    transition: all 0.2s;
}

.qrcode-img-box {
    flex-shrink: 0;
    border-radius: 11px;
    border: 1px solid #D9D9D9;

    width: max-content;
    overflow: hidden;
}

.qrcode-box {
    display: none;
    margin: 40px 0;
}

.qrcode-tips {
    line-height: 1.8;
}

.qrcode-tips ul {
    padding-left: 14px;

}

.qrcode-tips ul li {
    list-style: disc;
    font-size: 12px;
    color: #848484;
}

.qrcode-tips ul li::marker {
    color: #006dff;
    font-size: 14px;
}

.qrcode {
    width: 150px;
    height: 150px;

}


.adyencard-power {
    display: none;
    border-radius: 4px;
    background: #FAFAFA;
    padding: 17px 22px;
    margin-top: 30px;
}

.sale-img {
    width: 18px;
}

.adyencard-power-title {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #222;
}

.adyen-logo {
    width: 60px;
}

.adyencard-power-text {
    color: #B9B9B9;
    font-size: 14px;
    font-weight: 300;
    margin: 14px 0;
}

.adyencard-power-img {
    width: 462px;
}

.adyencard-power-img.pc {
    display: block;
}

.adyencard-power-img.mobile {
    display: none;
}

.safari {
    margin: 0 auto;
}

.button-text {
    font-size: 18px;
    color: #fff;
    font-weight: 600;
    font-family: 'Montserrat', sans-serif;
}

.submit:hover,
.stripecard-btn:hover,
.nova2paycard-btn:hover,
.antom-card-btn:hover,
.adyencard-btn:hover,
.stripecard-submit:hover {
    background: #0048cd;
}

.agreement-box {
    color: #616161;
    font-size: 12px;
    font-weight: 300;
    line-height: 160%;
    letter-spacing: -0.42px;
    display: flex;
    align-items: start;
    gap: 8px;
    margin-top: 15px;
}

.agreement-box input {
    flex-shrink: 0;
    margin-top: 4px;
}

.agreement {
    text-decoration: underline;
    cursor: pointer;
}

.copyright {
    text-align: right;
    color: #848484;
    font-size: 14px;
    font-weight: 300;
    letter-spacing: -0.49px;
    margin: 30px 0;
}

.pay-box .email::placeholder {
    font-size: 16px;
}

.pay-box input::placeholder {
    font-family: 'Montserrat', Sans-serif;
    color: #C5C5C5;
    font-size: 12px;
    font-weight: 300;
}

.product-box,
.pay-box {
    display: flex;
    flex-direction: column;
}

.product-box .page,
.pay-box .page {
    flex: 1;
}

.paypal-btn {
    display: none;
    background: #ffc439;
    padding: 16px 60px;
    width: max-content;
    cursor: pointer;
    border-radius: 3px;
    margin-top: 46px;
    transition: all 0.2s;
}

.paypal-btn img {
    height: 20px;
}

.paypal-btn:hover {
    background: #ffa920;
}

.applepay-btn,
.googlepay-btn {
    display: none;
    cursor: pointer;
    margin-top: 46px;
    border-radius: 4px;
    border: 1px solid #333;
    background: #fff;
    width: 200px;
    text-align: center;
    font-size: 18px;
    padding: 13px 0;
    transition: all 0.2s;
}

.type-loading,
.back-btn-loading {
    display: inline-block;
    width: 23px;
    height: 23px;
    background: url(/static/img/loading.png) no-repeat center;
    background-size: cover;
}

.back-btn-loading {
    display: block;
    margin: 30px auto;
    animation: loading 2s linear infinite;
}

.payinsider {
    display: none
}

.applepay-btn img {
    margin-left: 5px;
}

.applepay-btn:hover {
    color: #fff;
    background: #333;
}

.googlepay-btn {
    display: none;
    margin-top: 46px;
    width: 250px;
}

#googlePayButton {
    display: none;
    margin-top: 46px;
    width: 250px;
}

#applePayButton {
    display: none;
    margin-top: 46px;
    width: 250px;
}

.applepay-btn img {
    height: 20px;
}

.applepay-btn:hover img {
    content: url(/static/img/apple-icon-white.png);
}

.more-img {
    cursor: pointer;
    width: 35px;
}

.more {
    position: relative;
    width: 35px;
}

.page2 {
    width: 660px;
}

.applepay-btn {
    position: relative;
}

/* #applePayButton {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 2;
  top: 0;
  left: 0;
} */

.more-con {
    display: none;
    position: absolute;
    right: 0;
    margin-top: 15px;
    align-items: center;
    padding: 13px;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0px 6px 19.9px 0px rgba(120, 120, 120, 0.18);
}

.more-con_box {
    display: flex;
    gap: 10px;
}

.more-con_box span {
    cursor: pointer;
    border: 1px solid transparent;
}

.more-con_box span:hover {
    display: block;
    border: 1px solid #11a5ff;
    border-radius: 5px;
    background-color: rgba(17, 165, 255, 0.1);
}

.more-con::before {
    position: absolute;
    top: -10px;
    right: 10px;
    content: "";
    width: 0;
    height: 0;
    border-bottom: 15px solid #ffffff;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
}

.mask {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.21);
    z-index: 99;
}

.mask .pop {
    position: absolute;
    width: 728px;
    background: #fff;
    border-radius: 11px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 30px;
}

.mask .mask-close {
    position: absolute;
    top: 12px;
    right: 12px;
    cursor: pointer;
    background: url('/static//img/sprite2.png') no-repeat -276px -166px;
    width: 19px;
    height: 19px;
}

.mask .title {
    font-size: 20px;
    text-align: center;
    margin-bottom: 20px;
}

.mask .pop-content {
    height: 500px;
    overflow-y: scroll;
    margin-top: 20px;
    line-height: 1.5;
}

.mask p {
    margin-bottom: 10px;
    font-weight: 300;
}

.mask .min-title {
    font-size: 16px;
    margin-top: 20px;
    margin-bottom: 10px;
}

.mask .text {
    margin-bottom: 7px;
}

.result-box {
    display: none;
    width: 1000px;
    background: #fff;
    padding: 43px 53px;
    min-height: 767px;
}

.result-title {
    text-align: center;
    font-size: 24px;
}

.result-title img {
    margin-right: 5px;
}

.result-text {
    font-size: 16px;
    color: #333;
    text-align: center;
    margin-top: 10px;
    font-weight: 300;
}

.result-info {
    margin-top: 50px;
    display: flex;
    justify-content: space-between;
}

.result-table {
    border: 1px solid #dfdfdf;
    border-top: unset;
    line-height: 1.5;
    min-width: 100%;
}

.result-table_header {
    display: flex;
    justify-content: space-between;
    padding: 10px 40px 10px 20px;
    border-radius: 3px;
    border-bottom: 1px solid #dfdfdf;
}

.result-table_title {
    font-weight: 400;
}

.result-table_body {
    padding: 13px 17px;
}

.result-table_tr {
    display: flex;
    justify-content: space-between;
    padding: 7px 20px 7px 0;
}

.result-table_td {
    font-weight: 300;
}

.result-table_title:first-child,
.result-table_td:first-child {
    width: 30%;
}

.user-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 3px 3px 0px 0px;
    border: 1px solid #dfdfdf;
    background: #fbfbfb;
    padding: 10px 17px;
    margin-top: 13px;
}

.email {
    display: flex;
    gap: 10px;
}

.email-number {
    font-weight: 300;
}

.login-btn {
    display: none;
    border-radius: 3px;
    background: #212121;
    color: #fff;
    padding: 8px 35px;
    cursor: pointer;
    transition: all 0.2s;
}

.login-btn:hover {
    background: #006dff;
}

.back-btn {
    width: max-content;
    padding: 0 35px;
    height: 45px;
    border-radius: 4px;
    border: 1px solid #4298f8;
    color: #4298f8;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 32px auto;
    cursor: pointer;
    font-size: 18px;
    transition: all 0.2s;
}

.back-btn:hover {
    border: 1px solid #4298f8;
    background: #4298f8;
    color: #fff;
}

.error-result {
    text-align: center;
}

.error-img {
    margin: 90px auto 0;
}

.error-text {
    margin-top: -80px;
    font-size: 20px;
    padding: 0 100px;
    font-weight: 300;
    line-height: 1.6;
}

.store-btn {
    display: block;
    width: 326px;
    line-height: 54px;
    border-radius: 4px;
    background: #006dff;
    font-size: 18px;
    color: #fff;
    margin: 45px auto 30px auto;
    transition: all 0.2s;
}

.store-btn:hover {
    background: #0048cd;
}

.jump-tips {
    color: #3c4854;
    font-size: 16px;
    font-weight: 300;
}

.toast {
    position: fixed;
    display: none;
    align-items: start;
    font-weight: 300;
    line-height: 1.5;
    gap: 10px;
    top: 100px;
    padding: 12px;
    left: 50%;
    transform: translateX(-50%);
    max-width: 600px;
    border-radius: 4px;
    border: 1px solid #e02020;
    background: #fbeeee;
}

.error-tips {
    display: none;
    color: #e02020;
    font-size: 12px;
    font-weight: 300;
    line-height: 150%;
    margin-top: 6px;
}

.error,
.state-text.error {
    border-radius: 4px;
    border: 1px solid #e02020;
    background: #fbeeee;
}

.loading {
    display: none;
    width: 15px;
    animation: loading 2s linear infinite;
    margin-left: 13px;
}

.item-type .type-loading {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    display: none;
    width: 15px;
    height: 15px;
    animation: loading 2s linear infinite;
    z-index: 91;
}

.item-type.disable::after {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    background: #dddddd54;
}

.loading-cover::after {
    cursor: not-allowed;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.3);
    z-index: 90;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.type-disable-cover::before {
    border: 0.722px solid #949494;
    cursor: not-allowed;
    content: "";
    position: absolute;
    width: 97%;
    height: 97%;
    background: #cccccc4a;
    backdrop-filter: blur(0.5px);
    border-radius: 4px;
    z-index: 90;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    pointer-events: none;
    cursor: not-allowed;
}

.type-loading-cover::after {
    border: 0.722px solid #11a5ff;
    cursor: not-allowed;
    content: "";
    position: absolute;
    width: 97%;
    height: 97%;
    background: rgba(205, 236, 254, 0.81);
    backdrop-filter: blur(0.5px);
    border-radius: 4px;
    z-index: 90;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.gpay-card-info-container {
    height: 50px;
}

/* .search-select, */
.lastname-input,
.firstname-input {
    flex: 1;
}


.billing-input {
    width: 100%;
}

#cvc {

    margin-top: 0;
    border: unset;
    padding-left: 8px;
}

.cvc .payment-info,
.cvc-nova2pay .payment-info_input,
.cvc-antom_card .payment-info_input {
    padding: 0 !important;
}

.cvc {
    /* margin-top: 8px; */
}

#nova2pay-cvc,
#antom_card-cvc {
    border-radius: 4px;
    height: 34px;
    padding: 9px;
    font-size: 12px;
    width: 100%;
}

.coupon-btn {
    position: relative;
    overflow: hidden;
}

.coupon-btn.coupon-loading::before {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: 100%;
    height: 100%;
    background: rgba(68, 202, 77, 0.1);
    z-index: 1;
}

.coupon-btn.coupon-loading::after {
    position: absolute;
    content: '';
    width: 16px;
    height: 16px;
    background: url(/static/img/loading3.png) no-repeat center;
    background-size: cover;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    animation: loading 2s linear infinite;
    z-index: 2;
}

.currency-name {
    display: none;
}

.product-close {
    position: absolute;
    right: 20px;
}

.table-body_tr {
    position: relative;
}

.red {
    color: #FF4C4C;
}

.coupon-mask {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.21);
    z-index: 99;
}

.coupon-mask .coupon-mask-close {
    position: absolute;
    bottom: -40px;
    left: 50%;
    transform: translate(-50%, 0);
    cursor: pointer;
    background: url('/static//img/close-mark.png') no-repeat;
    width: 39px;
    height: 39px;

}

.coupon-mask .pop {
    position: absolute;
    width: 416px;
    border-radius: 11px;
    top: 53%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 430px;
    text-align: center;
}

.coupon-mask .coupon-mask_bg {
    position: absolute;
    width: 613px;
    height: auto;
    top: 24%;
    left: 44%;
    transform: translate(-50%, -50%);
    z-index: -1;
}

.coupon-mask .title {
    color: #ef6129;
    font-size: 26px;
    font-weight: 700;
}

.coupon-mask .text {
    color: #ef6129;
    font-size: 18px;
    margin-top: 8px;
}

.coupon-mask .pop-bottom {
    height: 160px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.coupon-mask .discount {
    position: relative;
    background: linear-gradient(180deg, #ff7036 0%, #f32121 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 80px;
    font-weight: 900;
    margin: 10px auto 26px;
    width: 330px;
    height: 112px;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1;
    padding: 5px 0;
}

.coupon-mask .use-btn {
    border-radius: 200px;
    border: 0.5px solid #fffed6;
    background: radial-gradient(46.43% 45.33% at 41.69% 50%, #ff4001 0%, rgba(255, 64, 1, 0) 100%), radial-gradient(118.43% 40.42% at 7.72% 28.75%, #fffda6 0%, rgba(255, 255, 255, 0) 100%), radial-gradient(69.19% 37.39% at 107.79% 0%, #ff7500 0%, rgba(255, 66, 0, 0) 100%), radial-gradient(89.75% 54.52% at 83.46% 89.75%, #fff926 0%, rgba(255, 69, 0, 0.6) 100%), #ff4001;
    box-shadow: 0px 9.36px 7.8px -6.24px #fff14e, 0px 9.36px 6.24px -3.12px rgba(255, 73, 0, 0.3), 0px 0px 6.24px 0px #fea000 inset, 0px 0px 9.36px 0px #fffd54 inset;
    color: #fff;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), 0 2px 2px rgba(0, 0, 0, 0.1);
    font-size: 42px;
    width: max-content;
    padding: 12px 0;
    width: 340px;
    cursor: pointer;
    margin: 0 auto;
    transition: all 0.2s;
    text-shadow: 0px -4px 3px rgba(149, 2, 2, 0.5);

}

.coupon-mask .use-btn:hover {
    transform: scale(1.05);
}

.safari-mask {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.21);
    z-index: 99;
}

.safari-mask .pop {
    position: absolute;
    width: 540px;
    border-radius: 11px;
    top: 53%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    background: #fff;
    padding: 40px;
}

.safari-mask .title {
    color: #222;
    font-size: 16px;
    font-weight: 600;
    margin: 10px;
}

.safari-mask .text {
    color: #707070;
    font-size: 14px;
    font-weight: 300;
    line-height: 180%;
    word-break: break-word;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.safari-mask .copy-btn {
    border-radius: 5px;
    background: #408CFF;
    color: #FFF;
    width: 336px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    cursor: pointer;
    margin: 30px auto 0;
    transition: all .2s;
}

.safari-mask .copy-btn:hover {
    transform: scale(1.05);
}

.safari-mask .copy-tips {
    display: none;
    color: #707070;
    font-size: 12px;
    font-weight: 300;
    line-height: 180%;
    margin-top: 10px;
}

.safari-mask .success-icon {
    vertical-align: middle;
}

.safari-mask .safari-mask-close {
    position: absolute;
    top: 12px;
    right: 12px;
    cursor: pointer;
    background: url('/static//img/sprite2.png') no-repeat -276px -166px;
    width: 19px;
    height: 19px;
}

.bottom .agreement {
    text-decoration: unset;

}

.bottom .agreement a {
    text-decoration: underline;
}

.oceanCardpay-type-img {
    display: none;
    /* margin-top: 5px; */
}

.oceanCardpay-type-img img {
    height: 35px;
    width: auto;
}

.oceanCardpay-btn {
    margin-top: 30px;
}

#oceanpayment-element {
    /* height: 110px;
    overflow: hidden; */
}

.result-bottom {
    display: none;
    text-align: center;
    line-height: 2;
}

.result-bottom-link {
    position: relative;
}

#result-bottom-iframe {
    width: 100%;
    min-height: 590px;
}

.result-bottom-link.iframe-loading::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 30px;
    height: 30px;
    background: url(/static/img/loading-black.png) no-repeat center;
    background-size: cover;
    z-index: 2;
    animation: loading 2s linear infinite;
}

.result-bottom-link.iframe-loading::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.514);
    z-index: 1;

}

.back-btn.back-btn-loading {
    position: relative;
    cursor: not-allowed;
    pointer-events: none;
    background-color: #fff;
    color: transparent;

}

.back-btn.back-btn-loading::after {
    content: '';
    position: absolute;
    top: 13px;

    width: 20px;
    height: 20px;
    left: 41%;
    transform: translateX(-50%);
    background: url(/static/img/loading.png) no-repeat center;
    animation: loading 2s linear infinite;
    background-size: cover;
}

.result-text.result-title-text {
    font-size: 22px;
}

.result-text.result-tip {
    font-size: 14px;
    color: #848484;

}

@media (max-width: 1300px) {
    .oceanCardpay-type-img {
        /* margin-top: 10px; */
    }

    .oceanCardpay-type-img img {
        height: 30px;
        width: auto;
    }

    .header .language-select-box {
        right: 0;
    }

    .main {
        max-width: 100%;
    }

    .product-box,
    .pay-box {
        width: 48%;
    }

    .content {
        width: 100%;
    }

    .container {
        width: 100%;
        padding: 0 20px;
    }

    .page2,
    .page {
        width: 100%;
    }

    .bottom {
        padding: 0 20px;
    }
}

@media (max-width: 1024px) {

    .content,
    .product-box,
    .pay-box {
        width: 100%;
    }

    .product-box,
    .pay-box {
        margin: 0 30px;
    }

    .main {
        max-width: 100%;
    }

    .page {
        width: 100%;
        padding: 20px 11px;
        background: #fbfbfb;
    }

    .product-tr {
        position: relative;
        padding-right: 30px;
    }

    .table-box .product-item {
        width: 100%;
    }

    .table-box .table-header {
        padding: 6px 54px 9px 16px;
    }


    .bottom {
        margin: 0 30px;
        padding: 0;
    }
}

@media (max-width: 1024px) {
    .product-box {
        width: 100%;
    }

    .product-box,
    .pay-box {
        margin: unset;
    }

    .page {
        max-width: 100%;
        overflow: hidden;
    }


    .header {
        padding: 15px 0;
    }

    .header .logo {
        width: 118px;
    }

    .header .header-img {
        display: none;
    }

    .main {
        width: 100%;
        flex-direction: column;
        justify-content: center;
        padding: 0 30px;
    }


}

@media (max-width: 820px) {
    .qrcode-box-content {
        flex-direction: column;
        gap: 10px;
    }

    .qrcode-img-box {
        margin: 0 auto;
    }

    .qrcode-tips-title {
        text-align: center;
    }

    .safari-mask .pop {
        width: 90%;
    }

    .safari-mask .copy-btn {
        width: 250px;
    }

    .coupon-mask .pop {
        top: 51%;
        height: 277px;
    }

    .coupon-mask .coupon-mask_bg {
        top: 22%;
        left: 46%;
    }

    .coupon-mask .title {
        font-size: 19px;
    }

    .coupon-mask .text {
        font-size: 16px;
    }

    .coupon-mask .discount {
        font-size: 50px;
        margin: 10px auto 5px;
        max-width: 280px;
        height: 70px;
    }

    .coupon-mask .pop-bottom {
        height: 108px;
    }

    .coupon-mask .coupon-mask-close {

        width: 28px;
        height: 28px;
        background-size: cover;
    }

    .search-select .search-text {
        width: 160px;
        min-width: unset;
    }

    .coupon-mask .use-btn {
        font-size: 25px;
        padding: 9px 0;
        width: 250px;
    }

    .order-title .currency-select {
        width: 180px;
    }

    .googlepay-btn {
        width: 100%;
    }

    .cvc .cvc-pop,
    .cvc-nova2pay .cvc-pop,
    .cvc-antom_card .cvc-pop {
        right: -15px;
    }

    .cvc .cvc-pop::after,
    .cvc-nova2pay .cvc-pop::after,
    .cvc-antom_card .cvc-pop::after {
        right: 9px;
        /* left: 50%;
        transform: translateX(-50%); */
    }

    .toast {
        width: 80%;
    }

    body {
        background: #fbfbfb;
    }

    .main {
        padding: 0;
        margin: 0;
    }


    .page-title {
        font-size: 20px;
    }

    /* .table-box .text, */
    .table-box .product-name {
        width: 42%;
    }

    .table-box .text {
        width: 100%;
    }

    .table-box .service-tr {
        flex-wrap: wrap;
    }

    .table-box .service-name {
        width: 132px;
        line-height: 1.5;
    }

    .table-box .product-item {
        width: 100%;
    }

    .table-box .product-close {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        height: 20px;

        margin: auto;

    }

    .table-box .table-body_tr {
        position: relative;
        padding: 8px 11px;
        background: #fff;
    }

    .table-box .product-tr {
        padding-right: 10px;
    }

    .table-box .table-header {
        padding: 6px 30px 9px 16px;
    }

    .table-box .service {
        padding-right: 30px;
    }

    .bottom {
        flex-direction: column;
        justify-content: center;
        text-align: center;
        gap: 12px;
        margin: 16px 0 30px;
    }

    .copyright {
        text-align: center;
        margin: 0;
    }

    .agreement {
        margin: 0;
    }

    .payment-methods,
    .billing-info,
    .nova2paycard-box,
    .antomcard-box,
    .payment-info {
        flex-wrap: wrap;
    }

    img {
        max-width: 100%;
        height: auto;
    }

    .card-number,
    .card-number-nova2pay,
    .card-number-antom_card,
    .email-box {
        width: 100%;
    }

    .expiry,
    .cvc,
    .billing-input,
    .search-select {
        width: 48%;
    }

    .search-select .search-text,
    .search-select .search-ul {
        width: 100%;
    }

    .type-icon,
    .more-img {
        height: 32px;
        width: auto;
    }

    .payment-method_item {
        gap: 8px;
    }

    .more {
        position: unset;
    }

    .payment-methods {
        position: relative;
    }

    .billing-info,
    .nova2paycard-box,
    .antomcard-box,
    .payment-info {
        gap: 10px;
    }

    .billing-info .search-select,
    .billing-info .lastname-input,
    .billing-info .firstname-input {
        flex: 0 0 47%;
    }

    .billing-info .billing-input {
        width: 100%;
    }

    .more-con {
        left: 50%;
        transform: translateX(-50%);
        right: unset;
        width: 100%;
    }

    .more-con::before {
        left: 110px;
    }

    .page2 {
        width: 100%;
        max-width: 100vw;
        background: #fff;
    }

    .email-tips {
        font-size: 14px;
    }

    .applepay-btn,
    .googlepay-btn,
    .paypal-btn,
    .stripecard-submit,
    .stripecard-btn,
    .adyencard-btn,
    .submit {
        width: 100%;
        text-align: center;
    }

    .adyencard-power {
        margin-top: 40px;
    }

    .adyencard-power-img.pc {
        display: none;
    }

    .adyencard-power-img.mobile {
        display: block;
    }

    .adyencard-power-img {
        width: 306px;
    }

    .mask .pop {
        width: 95%;
    }

    .result-box {
        width: 100%;
        margin: 10px auto;
        padding: 30px 8px;
    }

    .content {
        width: 100%;
    }

    .result-title {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        font-size: 20px;
        gap: 10px;
    }

    .result-text {
        line-height: 1.5;
        padding: 0 10px;
    }

    .result-info {
        flex-direction: column;
        gap: 10px;
    }

    .login-btn {
        padding: 10px;
        min-width: 60px;
        text-align: center;
    }

    .user-box {
        padding: 10px;
    }

    .result-table-wrap {
        width: 100%;
        overflow-x: scroll;
    }

    .result-table {
        width: max-content;
    }

    .result-table_title,
    .result-table_td {
        margin: 0 10px;
        text-align: center;
    }

    .result-table_title:first-child,
    .result-table_td:first-child {
        width: 200px;
        text-align: left;
    }

    *::-webkit-scrollbar {
        height: 8px;
    }

    .error-text {
        padding: 0 40px;
    }

    .jump-tips {
        padding: 0 10px;
        line-height: 1.5;
    }

    .error-img {
        width: 90%;
    }
}

@media (max-width: 480px) {
    .expiry, .cvc, .expiry-nova2pay, .expiry-antom_card {
        width: 163px;
    }
}