<div class="coupon-new-page">
    <div class="filter-box">
        <span class="no-used">
            <span class="filter-btn active">未使用(99+)</span>
            <span class="iconfont icon-down show-filter-btn"></span>
        </span>
        <span class="used">
            <span class="filter-btn">已使用（8）</span>
        </span>
        <span class="invalid">
            <span class="filter-btn">已失效（15）</span>
        </span>
    </div>
    <div class="filter-item hide">
        <button>全部</button>
        <button>店铺券</button>
        <button>活动券</button>
        <button>运费券</button>
    </div>
    <div class="exchange-box">
        <input type="text" placeholder="请输入优惠券码">
        <button>兑换</button>
    </div>
    <div class="coupon-list" id="couponList">
        <section class="coupon-section">
            <div class="coupon">
                <div class="coupon-left">
                    <p class="value">¥<span>100</span></p>
                    <p class="threshold">满499可用</p>
                </div>
                <div class="coupon-right">
                    <p class="title"><span class="type-shop">[店铺券]</span> Adidas Origins店铺使用</p>
                    <p class="time">2018.1.12-2018.5.20</p>
                    <p>
                        <span class="show-intro-btn">使用说明</span>
                        <span class="iconfont icon-down show-intro-btn show-intro-arrow"></span>
                    </p>
                    <span class="tip"></span>
                </div>
                <button class="use-now">立即使用</button>
                <span class="top-tip"></span>
            </div>
            <ul class="coupon-intro hide">
                <li>全场通用，特例商品暂不支持使用优惠券</li>
                <li>可以与其他类型叠加使用，同店铺只能使用一张，不同店铺真的可 以叠加使用。</li>
            </ul>
        </section>
        <section class="coupon-section">
            <div class="coupon invalid-coupon">
                <div class="coupon-left">
                    <p class="value">¥
                        <span>100</span>
                    </p>
                    <p class="threshold">满499可用</p>
                </div>
                <div class="coupon-right">
                    <p class="title">
                        <span class="">[活动券]</span> Adidas Origins店铺使用</p>
                    <p class="time">2018.1.12-2018.5.20</p>
                    <p>
                        <span class="show-intro-btn">使用说明</span>
                        <span class="iconfont icon-down show-intro-btn show-intro-arrow"></span>
                    </p>
                    <span class="tip"></span>
                </div>
                <div class="stamp"></div>
            </div>
            <ul class="coupon-intro hide">
                <li>全场通用，特例商品暂不支持使用优惠券</li>
                <li>可以与其他类型叠加使用，同店铺只能使用一张，不同店铺真的可 以叠加使用。</li>
            </ul>
        </section>
        <section class="coupon-section">
            <div class="coupon freight-coupon">
                <div class="coupon-left">
                    <span>普通</span>
                </div>
                <div class="coupon-right">
                    <p class="title">
                        <span class="">[运费券]</span> Adidas Origins店铺使用</p>
                    <p class="time">2018.1.12-2018.5.20</p>
                    <p>
                        <span class="show-intro-btn">使用说明</span>
                        <span class="iconfont icon-down show-intro-btn show-intro-arrow"></span>
                    </p>
                    <span class="tip"></span>
                </div>
                <button class="use-now">立即使用</button>
                <span class="top-tip"></span>
            </div>
            <ul class="coupon-intro hide">
                <li>全场通用，特例商品暂不支持使用优惠券</li>
                <li>可以与其他类型叠加使用，同店铺只能使用一张，不同店铺真的可 以叠加使用。</li>
            </ul>
        </section>
    </div>
    <div class="no-conpon-now hide">
        <div class="icon-not"></div>
        <p>暂无优惠券</p>
    </div>
</div>