@charset "utf-8";

/*
 * File    : rwd-pricing.css
 * Author  : STUDIO-JT (JSH)
 *
 * SUMMARY :
 * 1600px
 * 1480px
 * 1200px
 * 860px
 * 540px
 */



/* **************************************** *
 * 1680px
 * **************************************** */
@media (max-width: 1680px){

}



/* **************************************** *
 * 1480px
 * **************************************** */
@media (max-width: 1480px){

    .pricing-plan .article__section-title span:after { width: 50rem; transform: translate(24rem, 38rem); }
    .pricing-compare .article__section-title span:before { width: 190rem; transform: translate(-30rem, -24rem); }

    .pricing-plan__slider { margin: 0 -8rem; }
    .pricing-plan__item { width: calc(33.33% - 16rem); padding: 49rem 49rem 59rem; margin: 0 8rem; height: auto; }
    .pricing-plan__head { margin-bottom: 50rem; }
    .pricing-plan__list > li + li { margin-top: 20rem; }
    .pricing-plan__item.pricing-plan--active { padding: 47rem 47rem 57rem; }

    .pricing-compare__container { gap: 16rem; }
    .pricing-compare__head { padding: 0 28rem; height: 76rem; }
    .pricing-compare__list > li { padding: 0 28rem; height: 76rem; }
    .pricing-compare__slider .pricing-compare__item { margin-right: 16rem; }
    .pricing-compare__item { width: 328rem; }

}



/* **************************************** *
 * 1200px
 * **************************************** */
@media (max-width: 1200px){
    
    .pricing-plan.article__section { overflow: hidden; }
    .pricing-plan .article__section-title span:after { width: 46rem; transform: translate(26rem, 32rem); }
    .pricing-compare .article__section-title span:before { width: 180rem; transform: translate(-22rem, -24rem); }

    .pricing-plan__item { padding: 39rem 39rem 49rem; }
    .pricing-plan__head { margin-bottom: 40rem; }
    .pricing-plan__title { gap: 10rem; }
    .pricing-plan__account { margin-top: 16rem; }
    .pricing-plan__list > li { padding-left: 30rem; }
    .pricing-plan__list > li + li { margin-top: 16rem; }
    .pricing-plan__list .jt-icon { width: 20rem; }
    .pricing-plan__item.pricing-plan--active { padding: 37rem 37rem 47rem; }

    .pricing-compare__container { padding-top: 0; }
    .pricing-compare__head { padding: 0 24rem; height: 72rem; top: calc(var(--header-height) - var(--minimize-height) + 16rem); }
    .pricing-compare__title { gap: 10rem; }
    .pricing-compare__list > li { padding: 0 24rem; height: 72rem; gap: 8rem; }
    .pricing-compare__list .jt-icon { width: 16rem; }
    .pricing-compare__item { width: 268rem; }

}



/* **************************************** *
 * 860px
 * **************************************** */
@media (max-width: 860px){

    .pricing-plan .article__section-title span:after { display: none; }
    .pricing-compare .article__section-title span:before { width: 160rem; transform: translate(-19rem, -24rem); }

    .pricing-plan__slider { margin: 0 -6rem; overflow: visible; }
    .pricing-plan__item { width: 360rem; margin: 0 6rem; padding: 35rem 35rem 39rem; }
    .pricing-plan__item.pricing-plan--active { padding: 33rem 33rem 37rem; }
    .pricing-plan__head { margin-bottom: 36rem; }

    .pricing-compare.article__section { overflow: hidden; }
    .pricing-compare__container { gap: 12rem; }
    .pricing-compare__slider { overflow: hidden; margin-left: -20rem; margin-right: -30rem; padding-left: 20rem; padding-right: 30rem; }
    .pricing-compare__slider .pricing-compare__item { margin-right: 12rem; }
    .pricing-compare__item { width: 348rem; }
    .pricing-compare__head { position: relative; top: 0; padding: 0 20rem; height: 68rem; }
    .pricing-compare__list > li { padding: 0 20rem; height: 68rem; }
    .pricing-compare__sticky .pricing-compare__head { width: calc(100% + 1px); }

}



/* **************************************** *
 * 540px
 * **************************************** */
@media (max-width: 540px){

    .pricing-compare .article__section-title span:before { width: 140rem; transform: translate(-15rem, -20rem); }

    .pricing-plan__slider { margin: 0 -4rem; overflow: visible; }
    .pricing-plan__item { width: 300rem; margin: 0 4rem; padding: 29rem 19rem 35rem; border-radius: 8rem; }
    .pricing-plan__item.pricing-plan--active { padding: 27rem 17rem 33rem; }
    .pricing-plan__account { margin-top: 12rem; }
    .pricing-plan__head { margin-bottom: 30rem; }
    .pricing-plan__list > li { padding-left: 24rem; }
    .pricing-plan__list > li + li { margin-top: 12rem; }
    .pricing-plan__list .jt-icon { width: 16rem; }

    .pricing-compare__container { gap: 8rem; }
    .pricing-compare__item { width: 210rem; }
    .pricing-compare__slider { margin-left: -16rem; margin-right: -21rem; padding-left: 16rem; padding-right: 21rem; }
    .pricing-compare__slider .pricing-compare__item { margin-right: 8rem; }
    .pricing-compare__title { gap: 8rem; }
    .pricing-compare__head { padding: 0 16rem; }
    .pricing-compare__list > li { padding: 0 16rem; }
    .pricing-compare__sticky .pricing-compare__item { width: 130rem; }

}