@charset "utf-8";
/* ==========================================================================
   sale.css  -  Today's Deals     Design: Sale-PC / Sale-SP
   ========================================================================== */
.sl { padding-bottom: .56rem; }
.sl-head {
    padding: .24rem 0 .9rem;
    background: var(--c-sage);
    color: var(--c-white);
}
.sl-head_inner {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: .12rem;
}
.sl-head_title {
    font-size: .28rem;
    line-height: .36rem;
    font-weight: 700;
    text-transform: uppercase;
}
.sl-head_lead {
    margin-top: .04rem;
    font-size: .14rem;
    line-height: .2rem;
    color: var(--c-warm);
}
.sl-head_pill {
    padding: .06rem .14rem;
    border-radius: 9999px;
    background: var(--c-gold);
    font-size: .13rem;
    font-weight: 700;
    color: var(--c-ink);
}
.sl-sec-title {
    font-size: .2rem;
    line-height: .28rem;
    font-weight: 700;
    text-transform: uppercase;
}
/* white card that overlaps the sage band */
.sl-deals {
    position: relative;
    margin-top: -.66rem;
    padding: .2rem .16rem .08rem;
    border-radius: .12rem;
    background: var(--c-white);
    box-shadow: 0 .04rem .2rem #1c191714;
}
.sl-deals_head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: .04rem .12rem;
}
.sl-deals_note {
    font-size: .12rem;
    color: var(--c-ink-muted);
}
.sl-deals .c-grid--scroll { margin-top: .14rem; }

.sl-all { margin-top: .48rem; scroll-margin-top: calc(var(--header-h) + .16rem); }
.sl-all_head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: .08rem .16rem;
}
.sl-sort {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.sl-sort li { display: flex; align-items: center; }
.sl-sort li + li::before {
    content: "";
    width: 1px;
    height: .12rem;
    margin: 0 .1rem;
    background: var(--c-line);
}
.sl-sort a {
    display: flex;
    align-items: center;
    min-height: .32rem;
    font-size: .13rem;
    color: var(--c-ink-muted);
}
.sl-sort a:hover { color: var(--c-ink); }
.sl-sort .is-current {
    font-weight: 700;
    color: var(--c-ink);
    text-decoration: underline;
    text-decoration-color: var(--c-gold);
    text-decoration-thickness: 2px;
    text-underline-offset: .06rem;
}
.sl-pills { margin-top: .14rem; }
.sl-empty { margin-top: .2rem; }

@media (min-width: 768px) {
    .sl { padding-bottom: .8rem; }
    .sl-head { padding: .48rem 0 1.2rem; }
    .sl-head_title { font-size: .4rem; line-height: .52rem; }
    .sl-head_lead { font-size: .16rem; line-height: .24rem; }
    .sl-head_pill { font-size: .14rem; padding: .08rem .18rem; }
    .sl-sec-title { font-size: .24rem; line-height: .32rem; }
    .sl-deals {
        margin-top: -.8rem;
        padding: .28rem .28rem .24rem;
    }
    .sl-deals_note { font-size: .13rem; }
    .sl-deals .c-grid--scroll { margin-top: .2rem; }
    .sl-all { margin-top: .64rem; }
    .sl-pills { margin-top: .2rem; }
}
@media (min-width: 1280px) {
    .sl-deals .c-grid--scroll { gap: .24rem .16rem; }
    .sl-deals .c-product_img { height: 2.4rem; }
}