/* BASIC css start */
.content_title { display: flex; justify-content: space-between; align-items: center; margin: 50px 0 30px; }
.content_title h3 { font-size: 25px; font-weight: bold; }
.content_title h3 p { display: inline-block; font-weight: normal; font-size: 15px; margin-left: 10px; }
.content_title h3 p span { font-weight: bold; font-size: 15px; }
.content_title .title_btn { border: 1px solid #000; font-size: 15px; font-weight: bold; padding: 3px 12px; margin-left: 10px; }
.content_title .title_btn:first-child { background: #000; color: #fff; font-weight: 500; }
.event_banner { display: flex; justify-content: space-between; margin-bottom: 50px; }
.event_banner a { width: 100%; }
.event_banner img { width: 100%; }

.coupon_top_menu { display: flex; margin-bottom: 50px; }
.coupon_top_menu li { border: 1px solid #d7d7d7; border-radius: 50px; margin-right: 15px; }
.coupon_top_menu a { display: inline-block; width: 120px; text-align: center; height: 40px; line-height: 40px; font-size: 17px; font-weight: 500; }
.coupon_top_menu li:hover { border-color: var(--main-color); }
.coupon_top_menu li:hover a { color: var(--main-color); }

.content_box { margin-bottom: 100px; min-height: 480px; }
.content_box .coupon_lst_box { display: flex; flex-wrap: wrap; }
.content_box .coupon_lst_box > li { width: calc( (100% / 3 ) - 26.66px ); margin: 0 39.9px 35px 0; }
.content_box .coupon_lst_box > li .coupon_lst {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    border: 1px solid #d7d7d7;
    box-sizing: border-box;
    padding: 20px;
    border-radius: 12px 12px 0 0;
    overflow: hidden;
    background: #fff;
    cursor:pointer;
}
.content_box .coupon_lst_box > li .coupon_lst:hover { border: 2px solid var(--main-color); margin-top: -1px; }
.content_box .coupon_lst_box > li .coupon_lst.on:hover { border-width: 1px; margin-top: 0px; }
.content_box .coupon_lst_box > li .coupon_lst > a:first-child { position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 1; }
.content_box .coupon_lst_box > li .coupon_lst.on { border-color: #999; }
.content_box .coupon_lst_box > li .coupon_lst.on > a:first-child { z-index: 10; background: rgba(0,0,0,0.4); }
.content_box .coupon_lst_box > li:nth-child(3n) { margin-right: 0; }

.content_box .coupon_prd_pic { width: 50%; flex-shrink: 0; background: #f3f3f3; border-radius: 6%; position: relative; display: flex; overflow: hidden; }
.content_box .coupon_prd_pic::after { content: ''; display: inline-block; padding-bottom: 100%; }
.content_box .coupon_prd_pic img { position: absolute; width: 100%; height: 100%; }

.content_box .coupon_info { position: static; z-index: 1; width: 44%;cursor:pointer }
.content_box .coupon_info .d_day_txt { color: #fff; font-size: 12px; background: var(--main-color); margin: 0 0 5px; display: inline-block; padding: 2px 5px; font-weight: 500; }
.content_box .coupon_info h4 { font-weight: bold; font-size: 15px; padding-bottom: 5px; word-break: keep-all; }
.content_box .coupon_info span { font-size: 13px; }
.content_box .coupon_info p { color: var(--main-color); font-weight: bold; font-size: 20px; padding: 15px 0 13px; }
.content_box .coupon_info p span { font-weight: normal; font-size: 20px; }
.content_box .coupon_info .coupon_btn { display: flex; }
.content_box .coupon_info .coupon_btn > li { margin-right: 5px; }
.content_box .coupon_info .coupon_btn a { display: inline-block; border: 1px solid #000; box-sizing: border-box; border-radius: 8px; padding: 0 10px; height: 24px; line-height: 21px; font-size: 13px; }
.content_box .coupon_info .coupon_btn > li:first-child a { background: #000; color: #fff; }

.content_box .coupon_lst_box > li .coupon_link { background: #e3e3e3; border-bottom-right-radius: 12px; border-bottom-left-radius: 12px; margin-top: -12px; text-align: center; overflow: hidden; }
.content_box .coupon_lst_box > li .coupon_link a { color: #707070; display: block; height: 57px; line-height: 66px; font-size: 14px; font-weight: 500; }
.content_box .coupon_lst_box > li .coupon_link a i { font-size: 13px; }


.content_box .coupon_prd_pic a.brandA {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}
.content_box .coupon_prd_pic img.br_cou {
    height: 100px;
    width: auto;
}
/* BASIC css end */

