@charset "utf-8";
body{background-color:#f7f7f7;}

.box{width:100%;min-height:163px;box-shadow:0 2px 4px 0 rgba(0,0,0,.05);background-color:#fff;margin-bottom:30px;display:flex;align-items:center}

/*--brand--*/
.brand{display:flex;justify-content:space-between;width:1100px;margin:0 auto;padding:30px 0}
.brand h2{font-size:24px;line-height:35px;font-weight:600;color:#333;margin:0;}
.brand p{font-size:16px;line-height:24px;color:#999;margin-bottom:12px}
.brand .rating {display:none}
.brand .logo{width:240px;height:103px;padding:8px 34px}
.brand .logo a{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.brand .logo img{max-width:100%;max-height:100%}

#mfilter{display:none;}
.filter{display:flex}
.filter a{padding:6px 18px;border-radius:16px;border:1px solid #923caa;font-size:14px;line-height:20px;text-align:center;text-decoration:none;color:#923caa;margin-right:10px}
.filter a.active{background-color:#923caa;color:#fff}

/*--main left--*/
.main{background-color:#f7f7f7;margin:30px auto 40px;display:flex;justify-content:space-between}
.main h2,.main h3{margin:0;font-weight:600;color:#333;}
.main .left{width:820px}
.main .left .list{width:100%;display:flex;flex-direction:column}
.main .left .text{width:100%;padding:25px 30px;margin-bottom:20px;border:1px solid #ddd;background-color:#fff}
.main .left .text h2{font-size:17px;line-height:24px;margin-bottom:6px}
.main .left .text h3{font-size:15px;line-height:20px;margin-bottom:6px}
.main .left .text p{display:flex;font-size:14px;line-height:22px;color:#666;margin-bottom:10px}

/*--list--*/
.list{width:100%;display:flex;flex-direction:column}
.list .header{display:flex;align-items:center;justify-content:space-between;height:36px;background-color:#923caa;padding:0 15px}
.list h3{background:url(../images/best_icon.png) no-repeat;background-size:14px 18px;background-position-y:50%;font-size:15px;font-weight:600;letter-spacing:.47px;color:#fff;padding:8px 20px 6px;display:flex}
.list .ymd{font-size:14px;opacity:.8;color:#fff;text-transform:capitalize;margin:0}
.list .header .success{display:none}
.list .item.active{border:1px solid #923caa}
.list .item{width:100%;min-height:100px;margin-bottom:15px;display:flex;position:relative;border:1px solid #ddd;background-color:#fff}
.list .item p{margin:0}
.list .item .part0{width:100px;margin:0 20px;display:flex;align-items:center;justify-content:center;text-align:center;word-break: break-word;flex-shrink:0;flex-direction:column;color:#923caa;font-weight:700;font-size:30px;line-height:100%;}
.list .item .part0 small{font-size:1.4rem;line-height:21px;}
.list .item .part1{display:flex;flex-direction:column;padding:18px 0;width:440px;margin-right:29px}
.list .item .part1 .row0{display:flex;align-items:center;margin-bottom:5px;font-size:14px;line-height:21px;color:#666}
.list .item .part1 .row0 li{margin-right:10px}
.list .item .part1 .row0 li:last-child{margin-right:0}
.list .item .part1 .row0 .code{font-weight:600;color:#923caa;}
.list .item .part1 .row0 .verified{display:none}
.list .item .part1 .row0 .staffpick{background:url(../images/icon-staffpick.png) no-repeat;background-size:16px 16px;background-position-y:50%;padding-left:19px;}
.list .item .part1 .row1{font-size:17px;line-height:24px;color:#333}
.list .item .part1 .row2{display:flex;align-items:center;margin-top:8px;font-size:13px;line-height:19px;color:#999}
.list .item .part1 .row2 li{display:flex;align-items:center;}
.list .item .part1 .row2 li:after{content:"";display:inline-block;width:3px;height:3px;border-radius:50%;margin:0 8px;background-color:#999}
.list .item .part1 .row2 li:last-child:after{display:none;}

.list .item .part1 .verified{background:url(../images/verified.png) no-repeat;background-size:15px 15px;background-position-y:50%;padding-left:18px;color:#666}
.list .item .line{background-image:linear-gradient(180deg,#ccc,#ccc 50%,transparent 0);width:1px;height:auto;background-size:11px 8px;background-repeat:repeat-y;flex-shrink:0;position:relative}
.list .item .line:after{content:"";display:inline-block;transform:rotate(90deg);position:absolute;bottom:10px;left:-10px;width:20px;height:20px;background:url(../images/cut.png);background-size:cover}
.list .item .part2{display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0 30px;overflow:hidden}
.list .item .part2 button{border:0 none;width:150px;height:42px;display:flex;align-items:center;justify-content:center;border-radius:3px;background-color:#923caa;font-size:16px;font-weight:600;line-height:24px;text-align:center;color:#fff}
.list .item .part2 .viewcode{background-image:url(../images/jiao.png);background-repeat:no-repeat;background-size:24px 26px;background-position-x:100%;}

.listAds{margin-bottom:15px;margin-top:-13px}

/*--list_coupons--*/
.list_coupons{width:820px;border:1px solid #ddd;background-color:#fff;padding:25px 40px;margin-bottom:20px}
.list_coupons h2{font-size:20px;color:#333;text-align:center;padding-bottom:25px}
.list_coupons .bline,.list_coupons li{line-height:24px;border-bottom:1px solid #e7e7e7}
.list_coupons .th{font-weight:600;height:54px;display:flex;align-items:center;font-size:17px;color:#923caa}
.list_coupons .part0{width:130px;margin-right:40px;word-break:break-all}
.list_coupons .part1{max-width:414px;flex:1 1;}
.list_coupons .part2{margin-left:40px;margin-right:auto}
.list_coupons .tr{min-height:46px;padding:12px 0;border-bottom:1px solid #e7e7e7;display:flex;align-items:center;font-size:15px;line-height:22px;color:#666}
.list_coupons .tr .part1{color:#666}

.main .nobottom{margin-bottom:0}

/*--main right--*/
.main .right{width:250px}
.main .right h3{font-size:14px;font-weight:600;line-height:22px;color:#333;width:100%;margin-bottom:10px}

.main .right .rating{display:flex;width:100%;flex-direction:column;justify-content:center;font-size:13px;line-height:21px;padding:30px 15px 10px;border:1px solid #ddd;background-color:#fff;margin-bottom:20px;align-items:center}
.rating .stars{display:flex;}
.rating .stars i{width:24px;height:25px;margin-right:3px;margin-bottom:6px;cursor:pointer;background-size:contain;background-repeat:no-repeat;background-position-y:50%;}
.rating .stars .star{background-image:url(../images/star2.png);}
.rating .stars .active{background-image:url(../images/star1.png);}
.rating .part1{width:100%;color:#999;padding-bottom:20px;border-bottom:1px solid #e7e7e7;text-align:center;margin-bottom:20px}
.rating .item{width:100%;display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;color:#999}


.main .right .popular{padding:20px 15px 0;border:1px solid #ddd;background-color:#fff;margin-bottom:20px}
.popular .item{width:100%;height:60px;display:flex;align-items:center;margin-bottom:20px}
.popular .item .logo{width:60px;height:60px;position:relative;display: flex;align-items:center;}
.popular .item .logo img{max-width:100%;max-height:100%}
.popular .item .logo img{max-width:100%;max-height:100%}
.popular .item .info{flex:1 1;margin-left:10px;font-size:13px;line-height:19px}
.popular .item .info h3{font-weight:600;color:#333;line-height:19px;margin-bottom:0}
.popular .item .info .star{display:flex;background:url(../images/icon-staffpick.png) no-repeat;background-size:14px 14px;background-position-y:50%;padding-left:16px}
.popular .item .info span{color:#333}


.main .right .text{width:100%;padding:16px 15px 20px;border:1px solid #ddd;background-color:#fff}
.main .right .text h2{font-size:14px;line-height:20px;margin-bottom:8px}
.main .right .text p{font-size:13px;line-height:20px;color:#666;margin-bottom:15px}

@media screen and (max-width: 768px){
    .box{min-height:11.5rem;padding:1.5rem;margin:0 auto;background-color:#fff;align-items:center}
    .brand{display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;width:100%;margin:0 auto;padding:0}
    .brand .part1{margin-left:1.5rem;flex-direction:column;align-items:flex-start;padding: 0;}
    .brand .part1 .text{display:none;}
    .brand h2{font-size:1.7rem;line-height:2rem;letter-spacing:.3px;margin-bottom:.5rem}
    .brand .logo{width:8.5rem;height:8.5rem;padding:1rem .5rem;border-radius:4px;box-shadow:0 1px 4px 0 rgba(0,0,0,.08);border:1px solid #e7e7e7;background-color:#fff}
    .brand .filter{display:none;}
    .brand .rating{width:100%;display:flex;align-items:center;justify-content:flex-start;height:1.8rem}
    
    .main{padding:0;width:auto;margin:0 auto}
    .main .left{width:100%;margin-top:0;padding:0 1.5rem}
    .main h2{margin-bottom:1rem;font-size:1.7rem;line-height:2.5rem;text-align:left}
    .main .right{display:none}
    
    #mfilter{display:block;}
    .filter{width:100%;display:flex;margin:1.5rem   ;white-space:nowrap}
    
    .list .header{height:3.5rem;padding:0 1rem;border-radius:.6rem .6rem 0 0;box-shadow:0 .1rem .4rem 0 rgba(0,0,0,.08)}
    .list h3{font-size:1.3rem;font-family: Heebo,sans-serif;}
    .list .item{min-height:9.6rem;margin-bottom:1rem;display:flex;border-radius:0 0 .6rem .6rem;box-shadow:0 1px 4px 0 rgba(0,0,0,.08);border:1px solid #e7e7e7;border-top:0;position:relative;z-index:1}
    .list .ymd{display:none}
    .list .header .success{display:inline;font-size:1.3rem;opacity:1;color:#fff;}

    .rating .stars i{width:1.6rem;height:1.6rem;margin-bottom:0;margin-right:1px}
    .rating .textnum{font-size:1.3rem;line-height:1.8rem;margin-left:.5rem;color:#999}
    .rating num{color:#333}
    
    .list .item .part0{width:8rem;margin:0 1rem;font-size:2.4rem;line-height:2.5rem;}
    .list .item .part1{min-width:21rem;margin-right:0;padding:1.4rem 1.5rem}
    .list .item .part1 .row0{font-size:1rem;line-height:1.9rem;margin-right:.8rem}    
    .list .item .part1 .row0 .verified{display:inline-block}
    .list .item .part1 .row0 .success{display:none}
    .list .item .part1 .row0 li{margin-right: 0.8rem;}
    .list .item .part1 .row1{font-size:1.3rem;line-height:2rem;flex:1 1}
    .list .item .part1 .row2 .verified{display:none;}
    .list .item .part1 .row2{font-size:.5rem;}
    .list .item .part2{display:none}
    .list .item .line{position:absolute;left:10rem;height:100%}
    .list .item .line:after{display:none}
    
    .list_coupons{width:100%;padding:0;position:relative;border:none;margin-bottom:2rem}
    .list_coupons .th{height:4rem;font-size:1.2rem;line-height:2rem}
    .list_coupons .part0{max-width:7.2rem;line-height:1.6rem;width:100%;margin-left:1.5rem;margin-right:0;word-break:break-word;overflow:hidden}
    .list_coupons .part1{max-width:14.6rem;max-height:3.2rem;overflow:hidden;margin-left:2rem;flex:1 1}
    .list_coupons .part2{max-width:9.4rem;margin-left:2rem}
    .list_coupons .tr{min-height:5.2rem;padding:1rem 0;font-size:1.2rem;line-height:1.6rem}

    .list .pages a,.list .pages span{width:3.4rem;height:3.4rem;margin-right:1.5rem}
}