.nilecard-collect-point-section .collect-point-inner{display:flex;flex-flow:wrap;gap:5rem 8rem}.nilecard-collect-point-section .col-left{width:42%}.nilecard-collect-point-section .col-left .title{margin:0;border-bottom:1px solid var(--black-200-color);padding-bottom:2.625rem;font-size:var(--text-5_5xl);line-height:var(--text-line-spacing-5_5xl)}.nilecard-collect-point-section .col-left .rich-text__text{margin-top:2.625rem;color:var(--color-text-lighter-new)}.nilecard-collect-point-section .col-right{flex:1;padding-top:var(--title-height)}.nilecard-collect-point-section .collect-point-card{background-color:var(--primary-100-color);padding:3.375rem;border-radius:var(--border-radius-base);display:flex;flex-flow:wrap}.nilecard-collect-point-section .collect-point-card .collect-point-info{width:15.5rem}.nilecard-collect-point-section .collect-point-card .points-progress-bar{flex:1;margin-left:2.75rem;padding-left:2.75rem;border-left:.125rem solid var(--white-color)}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info .point-info-inner{display:flex;background-color:var(--white-color);border-radius:var(--border-radius);padding:1rem}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info{margin-bottom:1rem}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info:last-child{margin-bottom:0}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info .point-info-inner .point-title{flex:1;font-size:var(--text-lg);color:var(--primary-color);font-weight:500;position:relative;padding-right:1rem;line-height:1}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info .point-info-inner .collect-point-num{flex:1;color:var(--color-text-lighter-new);display:flex;flex-flow:column;line-height:1}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info .point-info-inner .collect-point-num .price{color:var(--black-color);font-size:var(--text-5xl);font-family:var(--font-heading-family);letter-spacing:-.125rem;display:block;line-height:1;font-variation-settings:var(--font-variation-settings-3)}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info .point-info-inner .point-title:before{content:"";height:100%;position:absolute;right:1rem;background:var(--black-200-color);width:1px}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info.redeem-point .point-info-inner{background-color:var(--primary-color)}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info.redeem-point{margin-top:2.875rem}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info.redeem-point .point-info-inner .point-title,.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info.redeem-point .point-info-inner .collect-point-num,.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info.redeem-point .point-info-inner .collect-point-num .price{color:var(--white-color)}.nilecard-collect-point-section .collect-point-card .points-progress-bar .progress-bar-inner{display:flex;height:100%;flex-flow:column;justify-content:center;align-items:center}.nilecard-collect-point-section .collect-point-card .points-progress-bar .progress-bar-inner .progress-value{width:100%;display:flex;justify-content:space-between;color:var(--black-300-color);line-height:1}.nilecard-collect-point-section .collect-point-card .points-progress-bar .progress-bar-inner .progress{width:100%;height:.625rem;overflow:hidden;background-color:var(--white-color);border-radius:var(--border-radius-lg);margin-top:.5rem}.nilecard-collect-point-section .collect-point-card .points-progress-bar .progress-bar-inner .progress .progress-bar{background:var(--primary-color);display:-ms-flexbox;display:flex!important;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;text-align:center;white-space:nowrap;transition:width .6s ease;height:100%;width:0}.nilecard-collect-point-section .collect-point-card .points-progress-bar .progress-bar-inner .total-point{color:var(--dark-black-color);font-family:var(--font-heading-family);font-size:var(--text-4xl);font-variation-settings:var(--font-variation-settings-4);line-height:1;margin-top:1.25rem;opacity:0}.nilecard-collect-point-section .collect-point-card .points-progress-bar .progress-bar-inner .total-point .text{font-size:var(--text-base);line-height:var(--text-line-spacing-base)}.nilecard-collect-point-section .col-right .note{font-size:var(--text-sm);color:var(--black-300-color);font-weight:400;margin-top:.875rem;line-height:1}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info{opacity:0}.nilecard-collect-point-section .collect-point-card.active-card .collect-point-info .point-info{animation:var(--animation-slide-in-top);animation-delay:.2s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}.nilecard-collect-point-section .collect-point-card.active-card .collect-point-info .point-info.spend-point{animation-delay:.2s}.nilecard-collect-point-section .collect-point-card.active-card .collect-point-info .point-info.earn-point{animation-delay:.4s}.nilecard-collect-point-section .collect-point-card.active-card .points-progress-bar .progress-bar-inner .progress .progress-bar{animation-name:progress;animation-duration:1s;animation-fill-mode:forwards;animation-delay:.6s}.nilecard-collect-point-section .collect-point-card.active-card .points-progress-bar .progress-bar-inner .total-point{animation:var(--animation-slide-in-top);animation-delay:.8s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}.nilecard-collect-point-section .collect-point-card.active-card .collect-point-info .point-info.redeem-point{animation-delay:1.2s}@keyframes progress{0%{width:0}to{width:100%}}@media (max-width:1536px){.nilecard-collect-point-section .col-left .title{padding-bottom:2rem}.nilecard-collect-point-section .col-left .rich-text__text{margin-top:2rem}.nilecard-collect-point-section .collect-point-inner{gap:3rem 3rem}.nilecard-collect-point-section .col-left{width:50%}.nilecard-collect-point-section .collect-point-card{padding:2rem}.nilecard-collect-point-section .collect-point-card .points-progress-bar{margin-left:2rem;padding-left:2rem}}@media (max-width: 1280px){.nilecard-collect-point-section .col-left .title{font-size:var(--text-5xl);line-height:var(--text-line-spacing-5xl)}.nilecard-collect-point-section .collect-point-card{padding:1.6rem}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info .point-info-inner .collect-point-num .price{font-size:var(--text-4xl)}.nilecard-collect-point-section .collect-point-card .collect-point-info{width:14rem}.nilecard-collect-point-section .collect-point-card .points-progress-bar{margin-left:1.6rem;padding-left:1.6rem}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info .point-info-inner .point-title{font-size:var(--text-base)}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info .point-info-inner .point-title{padding-right:.625rem}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info .point-info-inner .point-title:before{right:.625rem}}@media (max-width: 992px){.nilecard-collect-point-section .col-left .title{font-size:var(--text-4xl);line-height:var(--text-line-spacing-4xl)}.nilecard-collect-point-section .collect-point-inner{gap:1.5rem}.nilecard-collect-point-section .col-left{width:33.33%}.nilecard-collect-point-section .collect-point-card{padding:1rem}}@media (max-width: 768px){.nilecard-collect-point-section .col-left{width:100%}.nilecard-collect-point-section .col-left .title{padding-bottom:1.5rem}.nilecard-collect-point-section .col-left .rich-text__text{margin-top:1.5rem;font-size:var(--text-base);line-height:var(--text-line-spacing-base)}.nilecard-collect-point-section .collect-point-inner{flex-flow:column}.nilecard-collect-point-section .col-right{padding-top:0}}@media (max-width: 576px){.nilecard-collect-point-section .collect-point-card{flex-flow:column;gap:2rem}.nilecard-collect-point-section .collect-point-card .points-progress-bar{border:none;padding:0;margin:0}.nilecard-collect-point-section .collect-point-card .collect-point-info{width:100%}.nilecard-collect-point-section .collect-point-card .collect-point-info .point-info.redeem-point{margin-top:0}}
/*# sourceMappingURL=/cdn/shop/t/4/assets/nilecard-collect-point.css.map */
