.plans-panel {
    border-radius: 10px;
    background: #f1f1f0;
    padding: max(1rem, min(1.0356vw + .757282rem, 2rem));
    width: 100%;
    height: 38rem;
    margin-top: 20px;
    -webkit-transition: 1s;
}

.setCategoryBtn.active {
    background-color: var(--color-surface-white) !important;
    color: var(--color-just-black) !important;
}

.body-1 {
    background: var(--color-just-black);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
    letter-spacing: -.01em;
    line-height: 1.3;
    font-size: max(1.25rem, min(.2589vw + 1.18932rem, 1.5rem));
}

.body-2 {
    background: var(--color-just-black);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
    letter-spacing: -.01em;
    line-height: 1.3;
    font-size: max(1.25rem, min(.2589vw + 1.18932rem, 1.5rem));
}

.body-3 {
    background: var(--color-just-black);
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    font-weight: 800;
    letter-spacing: -.01em;
    line-height: 1.3;
    font-size: max(1.25rem, min(.2589vw + 1.18932rem, 1.5rem));
}

.body-4 {
    background: var(--color-just-black);
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    font-weight: 800;
    letter-spacing: -.01em;
    line-height: 1.3;
    font-size: max(1.25rem, min(.2589vw + 1.18932rem, 1.5rem));
}


.pricing-plans__price.heading-m {
    font-size: max(2.5rem, min(4.41176vw - .919118rem, 4.375rem));
    margin-top: 1rem;
}

.heading-m {
    color: var(--color-just-black);
    font-weight: 600;
    letter-spacing: -.01em;
    line-height: 1;
}

.pricing-plans__disclaimer-asterisk {
    font-size: 40%;
    vertical-align: top;
}

.heading-s {
    font-size: 1rem;
}

.heading-r .heading-s {
    font-weight: 600;
    letter-spacing: -.01em;
    line-height: 1;
}

.pricing-plans__price {
    background: var(--panel-theme);
    -webkit-background-clip: text;
    background-clip: text;
}

.panel-button1 {
    background: var(--color-just-black) !important;
    border-radius: 50em;
    border: 2px solid var(--color-surface-white);
    font-size: max(1rem, min(.38835vw + .908981rem, 1.375rem));
    font-weight: 600;
    width: 100%;
    color: var(--color-surface-white);
    padding: 8px;
    transition: background 0.5s ease, color 0.5s ease;
}

.panel-button1:hover {
    background: var(--color-just-black);

    color: var(--color-surface-white);
}

.panel-button2 {
    background: var(--color-just-black) !important;
    border-radius: 50em;
    border: 2px solid var(--color-surface-white);
    font-size: max(1rem, min(.38835vw + .908981rem, 1.375rem));
    font-weight: 600;
    width: 100%;
    color: var(--color-surface-white);
    padding: 8px;
    transition: background 0.5s ease, color 0.5s ease;
}

.panel-button2:hover {
    background: linear-gradient(to right, #a9a1ff 20.74%, #cdc8ff 65.5%);
    color: var(--color-surface-white);
}

.panel-button3 {
    background: var(--color-just-black) !important;
    border-radius: 50em;
    border: 2px solid var(--color-surface-white);
    font-size: max(1rem, min(.38835vw + .908981rem, 1.375rem));
    font-weight: 600;
    width: 100%;
    color: var(--color-surface-white);
    padding: 8px;
    transition: background 0.5s ease, color 0.5s ease;
}

.color_darkblue {
    color: var(--color-just-black) !important;
}

.panel-button3:hover {
    background: linear-gradient(to right, #ffb7fb 20.74%, #ffd9fd 65.5%);
    color: var(--color-surface-white);
}

.panel-button4 {
    background: var(--color-just-black) !important;
    border-radius: 50em;
    border: 2px solid var(--color-surface-white);
    font-size: max(1rem, min(.38835vw + .908981rem, 1.375rem));
    font-weight: 600;
    width: 100%;
    color: var(--color-surface-white);
    padding: 8px;
    transition: background 0.5s ease, color 0.5s ease;
}

.panel-button4:hover {
    background: linear-gradient(to right, #77e6ff 20.74%, #99ecff 65.5%);
    color: var(--color-surface-white);
}

.js-description-core {
    color: var(--color-just-black);
    font-size: 14px;
    line-height: 1.2;
    min-height: 3.3rem;
    font-weight: 600;
}

.pricing-plans__description {
    color: var(--color-surface50);
    font-size: max(1rem, min(.294118vw + .772059rem, 1.125rem));
    line-height: 1.2;
    margin-top: 1.5rem;
    margin-bottom: 1rem;
}

.pricing-plans__disclaimer {
    height: 3.8rem;
    color: var(--color-just-black);
    font-size: 15px;
    line-height: 1.2;
    margin: max(1rem, min(.776699vw + .817961rem, 1.75rem)) 0;
}

.pricing-plans__benefit {
    margin: 0 !important;
}

.pricing-plans__benefit>a {
    color: var(--color-surface50);
}

.pricing-plans__license {
    position: fixed;
    bottom: 20px;
    z-index: 999;
}

.pricing-plans__license>a {
    color: var(--color-surface50);
    text-decoration: none;

}
.pricing-plans__benefit {
    color: var(--color-just-black);
    font-weight: 600;
    margin-bottom: .8125rem;
    padding-left: 15px;
    font-size: 15px;
}

.green {
    background: linear-gradient(114.41deg, #0ae448 20.74%, #abff84 65.5%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.purple {
    background: linear-gradient(114.41deg, #a69eff 20.74%, #d0ccff 65.5%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.pink {
    background: linear-gradient(114.41deg, #ff96f9 20.74%, #f1dcf0 65.5%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.blue {
    background: linear-gradient(114.41deg, #0cbbe1 20.74%, #99ecff 65.5%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.pricing-btnStyle {
    border: 2px solid var(--color-just-black) !important;
    font-size: 14px;
    font-weight: 700 !important;
    margin-bottom: 10px;
    background: var(--color-surface-white);
    color: var(--color-just-black) !important;
    border-radius: 6.25rem;
    padding: 0.7rem 2.5rem !important;

}

.pricing-btnStyle:focus {
    background: var(--color-just-black) !important;
    color: var(--color-surface-white) !important;
}

@media only screen and (max-width: 991px) {
    .js-description-core {
        min-height: 2.7rem;
    }

    .pricing-btnStyle {
        font-size: 16px !important;
        margin-bottom: 7px !important;
        padding: 0.7rem 15px !important;
    }

}

@media (min-width: 1399px) {
    .gap-screen {
        gap: 1.5rem !important;
    }
}

@media (max-width: 1399px) {
    .gap-screen {
        gap: 1.5rem !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .percent-30 {
        width: 31% !important;
    }

    .gap-screen {
        gap: 1.5rem !important;
    }
}

@media (min-width: 536px) and (max-width: 767px) {
    .pricing-btnStyle {
        font-size: 13px !important;
        margin-bottom: 7px !important;
        padding: 0.5rem 10px !important;
    }

    .percent-30 {
        width: 32% !important;
    }

    .gap-screen {
        gap: .5rem !important;
    }
}

@media (min-width: 528px) and (max-width: 536px) {
    .pricing-btnStyle {
        font-size: 13px !important;
        margin-bottom: 7px !important;
        padding: 0.5rem 9px !important;
    }

    .percent-30 {
        width: 32% !important;
    }

    .gap-screen {
        gap: .5rem !important;
    }
}

@media (min-width: 485px) and (max-width: 528px) {
    .pricing-btnStyle {
        font-size: 2.5vw !important;
        margin-bottom: 7px !important;
        padding: 0.5rem 7px !important;
    }

    .percent-30 {
        width: 32% !important;
    }

    .gap-screen {
        gap: .5rem !important;
    }
}

@media (min-width: 361px) and (max-width: 485px) {
    .pricing-btnStyle {
        font-size: 2.5vw !important;
        margin-bottom: 7px !important;
        padding: 0.5rem 3px !important;
    }

    .percent-30 {
        width: 31.2% !important;
    }

    .gap-screen {
        gap: .5rem !important;
    }

}

@media screen and (max-width: 361px) {
    .pricing-btnStyle {
        font-size: 11px !important;
        margin-bottom: 7px !important;
        padding: 0.5rem 9px !important;
    }

    .percent-50 {
        width: 48% !important;
    }

    .gap-screen {
        gap: .5rem !important;
    }
}

@media only screen and (max-width: 466px) {
    .body-1 {
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight: 700;
        letter-spacing: -.01em;
        line-height: 1.3;
        font-size: max(1.25rem, min(.2589vw + 1.18932rem, 1.5rem));
    }
}


/* list */
.pricing-detail-page {
    background-color: var(--color-surface-white) !important;
}

.table-color {
    background-color: var(--color-just-black) !important;
}

.features-table__header {
    background-color: var(--color-surface-white) !important;
    color: var(--color-surface-white) !important;
}

.features-table__row>td {
    background-color: var(--color-surface-white) !important;
    color: var(--color-just-black) !important;
    font-weight: 600;
    padding: 2rem;
}

td>a {
    text-decoration: underline !important;
    color: var(--color-surface-white) !important;
}

.pricing-plans__comparison-intro>a {
    text-decoration: underline !important;
    color: var(--color-surface75) !important;
}

.pricing-plans__comparison-intro {
    font-size: 1.1rem;
    color: var(--color-surface75);
    padding-top: max(3rem, min(3.23625vw + 2.24151rem, 6.125rem));
    padding-bottom: max(1.5rem, min(1.5534vw + 1.13592rem, 3rem));
    text-align: center;
}

.lilac-pricing {
    color: var(--color-just-black) !important;
}

.pink-pricing {
    color: #fec5fb;
}

.blue-pricing {
    color: #00bae2;
}

.features-table td:nth-child(2),
.features-table th:nth-child(2) {
    color: var(--color-just-black) !important;
}

.features-table td:nth-child(3),
.features-table th:nth-child(3) {
    color: var(--color-just-black) !important;
}

.features-table td:nth-child(4),
.features-table th:nth-child(4) {
    color: var(--color-just-black) !important;
}

.features-table td:nth-child(5),
.features-table th:nth-child(5) {
    color: var(--color-just-black) !important;
}

.linear-green {
    background: var(--color-just-black) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.linear-purple {
    background: var(--color-just-black) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.linear-pink {
    background: var(--color-just-black) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.linear-blue {
    background: var(--color-just-black) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

tr>td {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
}

td {
    font-size: max(.875rem, min(.2589vw + .81432rem, 1.125rem));
}

th {
    font-size: max(1rem, min(.517799vw + .878641rem, 1.5rem));
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
}

.features-table__header>div {
    white-space: nowrap;
}

.pricing-plans__footer {
    display: block;
    text-align: center;
}

.button__label {
    background: white !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.button-linear-green {
    align-items: center;


    background: var(--color-just-black) !important;
    border: 2px solid var(--color-surface-white);
    border-radius: 6.25rem;
    cursor: pointer;
    display: inline-flex;
    font-size: max(1rem, min(.38835vw + .908981rem, 1.375rem));
    font-weight: 600;
    gap: .363636em;
    justify-content: center;
    letter-spacing: -.01em;
    line-height: 1.04545;
    overflow: hidden;
    padding: .9375rem 1.5rem;
    position: relative;
    text-decoration: none;
    color: var(--color-surface-white);
}

.button-linear-green:hover {
    color: var(--color-just-black) !important;
    background: var(--color-surface-white) !important;
}

.button-linear-green:hover .button__label {
    background: none !important;
    -webkit-text-fill-color: var(--color-just-black) !important;
}

.button-linear-green:hover .arrow-pricing {
    color: black !important;
}

.arrow-pricing {
    padding-top: 2px;
    color: var(--color-surface-white) !important;
}

.body-pricing {
    margin-bottom: max(1rem, min(1.0356vw + .757282rem, 2rem));
    font-weight: 400;
    letter-spacing: -.01em;
    line-height: 1.3;
    font-size: max(1.25rem, min(.2589vw + 1.18932rem, 1.5rem));
    color: var(--color-just-black) !important;
    font-weight: 700;
}

.body-pricing>a {
    text-decoration: underline !important;
    color: var(--color-just-black) !important;
    font-weight: 700;
}

.check-icon {
    font-size: 1.3rem;
    text-align: center;
}

.swiper-container {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

@media screen and (max-width: 1200px) {
    .svg-style1 {
        margin-top: 7px !important;
    }

    .svg-style {
        margin-top: 7px !important;
    }

}

@media screen and (max-width: 788px) {

    .features-table__header>div {
        white-space: nowrap;
    }

    .svg-style1 {
        margin-right: 9px !important;
    }
}
