/** New:  #16277  by  LJ  2021-05-13 */	
.pt24 { padding-top: 24px; }
.pt30 { padding-top: 30px; }
.pb15 { padding-bottom: 15px; }
.pb32 { padding-bottom: 32px; }
.ptb30 { padding-top: 30px; padding-bottom: 30px; }
.plr24 { padding-left: 24px; padding-right: 24px; }
.p24 { padding: 24px; }
.mt8 { margin-top: 8px; }
.mt12 { margin-top: 12px; }
.mt16 { margin-top: 16px; }
.mt24 { margin-top: 24px; }
.mt32 { margin-top: 32px; }
.mt48 { margin-top: 48px; }
.ml15 { margin-left: 15px; }
.mr16 { margin-right: 16px; }
.mr24 { margin-right: 24px; }
.lh24 { line-height: 24px; }
.lh32 { line-height: 32px; }
.f12 { font-size: 12px !important; }
.f24 { font-size: 24px; }
.w468 { width: 468px; }
.w712 { width: 712px; }
.h680 { height: 680px; }
.ptb30-lr24 { padding: 30px 24px; }

.vm { display: inline-block; vertical-align: middle; }
.bg-f8 { background-color: #f8f8f8; }
.ect { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.ect-clamp { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.cu-p { cursor: pointer; }
.line-vertical { position: relative; margin: 0 10px; } 
.line-vertical:after { position: absolute; right: 0; top: 50%; content: ''; border-right: 1px solid #e8e8e8; height: 10px; margin-top: -5px; }
.radius-4 { border-radius: 4px; }

.iconfont { vertical-align: middle; margin-top: -2px; }
a:hover, .s-primary { color: #FF562F; }
a.s-primary:hover { text-decoration: underline; }
.btn.s-primary:hover { text-decoration: none; }
.btn-primary { background-color: #FF562F; border-color: #FF562F; color: #fff; }
.btn-primary:hover { color: #fff; background-color: #FF7153; border-color: #FF7153; }
.btn-primary-line { border-color: #FF562F; color: #FF562F; }
.btn-primary-line:hover { background-color: #FF562F; border-color: #FF562F; color: #fff; }
.btn.is-disabled {
    color: #fff; background-color: #ccc; border-color: #ccc;
    cursor: no-drop;
}

/* ico-star */
.ico-star { 
    position: relative; display: inline-block; vertical-align: middle;
    font-family: 'iconfont'; font-size: 18px; line-height: 1; cursor: pointer; color: #e8e8e8;
}
.ico-star:before { content: '\e7d0'; }
/* stars-bar */
.stars-bar, .stars-bar .iconbox, .stars-bar .txt { display: inline-block; vertical-align: middle; }
.stars-bar .txt { font-size: 16px; color: #FF562F; margin-left: 10px; font-weight: 600; }
.iconbox { position: relative; }
.iconbox .ico-star { margin: -3px 5px 0; }
.iconbox .star-color { position: absolute; left: 0; top: 0; bottom: 0; width: 0; overflow: hidden; white-space: nowrap; }
.iconbox .star-color .ico-star { color: #FF562F; }
    /**/
.stars-mini { line-height: 20px; height: 20px; }
.stars-mini .ico-star { font-size: 14px; margin: -3px 3px 0; }
.stars-mini .txt { font-size: 14px; margin-left: 5px; }

/* nous-box-bg */
.nous-box-bg { background: url('../../images/2021/nous/bg.png') center top no-repeat; padding-top: 40px; }

/* time-title */
.time-title { font-size: 32px; line-height: 44px; color: #56B1B1; text-align: center; }

/* recommend-list */
.recommend-list { margin-left: -48px; }
.recommend-list li { float: left; margin: 40px 0 0 48px; width: 368px; }
.recommend-list .item { display: block; background-color: #fff; border-radius: 4px; overflow: hidden; -webkit-transition: all .2s linear; transition: all .2s linear; }
.recommend-list .img-block { height: 245px; }
.recommend-list .conts { padding: 20px 24px; }
.recommend-list .conts .tit { font-size: 16px; line-height: 20px; height: 20px; }
.recommend-list .conts .det { margin-top: 10px; font-size: 14px; line-height: 20px; height: 40px; color: #999; }
.recommend-list .item:hover { -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05); box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05); }


/* food-list */
.food-list { margin-left: -20px; }
.food-list li {
    position: relative; top: 0; float: left; margin: 20px 0 0 20px; 
    background-color: #fff; overflow: hidden;
    width: 224px; height: 270px; border-radius: 4px;
    -webkit-transition: top linear .2s;
    transition: top linear .2s;
}
.food-list li:hover { top: -6px; }
.food-list .conts { padding: 16px; }
.food-list .conts .img-block { height: 128px; }
.food-list .pop {
    position: absolute; right: 0; bottom: 0; left: 0; height: 124px;
    background: -webkit-gradient(linear,left top, left bottom,from(rgba(255,255,255,.5)), color-stop(70%, rgba(255,255,255,1)));
    background: linear-gradient(to bottom,rgba(255,255,255,.5) 0%, rgba(255,255,255,1) 70%); 
    filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr= #B2FFFFFF,endColorStr= #FFFFFFFF);
    visibility: hidden; opacity: 0;
    -webkit-transition: all linear .3s; transition: all linear .3s;
}
.food-list li:hover .pop { 
    opacity: 1; visibility: visible;
}
.food-list .pop .btn {
    display: block; margin: 70px auto 0; text-align: center;
    width: 86px; height: 30px; line-height: 30px; border-radius: 16px;
    font-size: 12px;
}
.food-list .pop .btn:hover { opacity: .8; }
    /* food-list-v2 */
.food-list-v2 li { height: 232px; }
.food-list-v2 .pop { height: 87px; }
.food-list-v2 .pop .btn { margin-top: 31px; }

/* hot-rank-swiper */
.hot-rank-swiper,
.hot-rank-swiper .img-block {
    width: 468px; height: 560px;
}
.hot-rank-swiper .pagination {
    position: absolute; right: 0; bottom: 20px; left: 0;
    line-height: 1; text-align: center;
}
.hot-rank-swiper .pagination span {
    margin: 0 4px; display: inline-block; opacity: .8;
    width: 20px; height: 4px; background-color: #fff;
}
.hot-rank-swiper .pagination .swiper-active-switch { background-color: #FF562F; opacity: 1; }

/* question-list */
.question-list li { 
    position: relative; margin-top: 37px; padding-left: 34px;
}
.question-list li:first-child { margin-top: 0; }
.question-list .tag {
    position: absolute; top: 1px; left: 0;
    width: 18px; height: 18px; background: url('../../images/2021/region/ico5.png') no-repeat;
}
.question-list .det {
    padding: 20px; background-color: #F8F8F8; border-radius: 8px;
    line-height: 20px;
}
.question-list .det label {
    float: left; margin-right: 12px; padding: 0 7px; line-height: 18px;
    border: 1px solid #bbb; border-radius: 2px;
}

/* ask-box */
.ask-box { padding-bottom: 24px; border-bottom: 2px solid #E8E8E8; }
.ask-box .textarea {
    display: block;
    padding: 16px; width: 386px; height: 68px;
    background-color: #f8f8f8; border-radius: 4px;
    font-size: 16px; line-height: 20px; overflow-y: auto;
}
.ask-box .textarea::-webkit-input-placeholder { color: #bbb; }
.ask-box .textarea:-ms-input-placeholder { color: #bbb; }
.ask-box .textarea::-ms-input-placeholder { color: #bbb; }
.ask-box .textarea::placeholder { color: #bbb; }
.ask-box .btn {
    padding: 0 19px; height: 32px; line-height: 30px; 
    font-size: 12px; border-radius: 16px;
}

/* checked-box */
.checked-box {
    position: relative; padding-left: 24px;
    color: #999; font-size: 14px; line-height: 32px;
    cursor: pointer; display: inline-block;
}
.checked-box:before {
    font-family: 'iconfont';
    content: "\e68b"; position: absolute; top: 0; left: 0;
    font-size: 16px; color: #bbb;
}
.checked-box.is-checked:before {
    content: "\e68e";
    color: #FF562F;
} 
.checked-box input { display: none; }

/* dynamic-roll */
.dynamic-roll { position: relative; height: 345px; overflow: hidden; }
.dynamic-list { position: absolute; top: 0; right: 0; left: 0; }
.dynamic-list li {
    position: relative; padding-left: 76px;
    height: 115px;
}
.dynamic-list li:before {
    content: ''; position: absolute; top: 31px; bottom: 1px; left: 26px;
    width: 1px; background-color: #e8e8e8;
}
.dynamic-list .time {
    position: absolute; top: 0; left: -18px; width: 100px;
    line-height: 30px; text-align: center; white-space: nowrap;
    font-size: 12px; color: #999;
}
.dynamic-list .info { 
    line-height: 30px; font-size: 12px; color: #999;
}
.dynamic-list .info img {
    float: left; width: 30px; height: 30px; margin-right: 6px;
    border-radius: 50%;
}
.dynamic-list .det {
    margin-top: 14px;
    font-size: 16px; line-height: 22px;
}

/* tab-nav */
.tab-nav .nav { cursor: pointer; }

/* them-tab-nav */
.them-tab-nav { position: relative; }
.them-tab-nav .nav {
    position: relative; margin: 0 16px;
    font-size: 16px; font-weight: 600;
}
.them-tab-nav .nav.is-this { color: #FF562F; }
.them-tab-nav .nav:before {
    content: ''; position: absolute; top: 50%; right: -16px;
    width: 1px; height: 13px; margin-top: -6px; background-color: #ddd;
}
.them-tab-nav .nav:last-child:before { display: none; }

/* ms-tab-nav */
.ms-tab-nav .nav {
    position: relative; float: left; margin-right: 36px;
    font-size: 18px; font-weight: 600;
}
.ms-tab-nav .nav:before {
    content: '/'; position: absolute; right: -20px;
    color: #ddd; font-weight: normal;
}
.ms-tab-nav .nav:last-child { margin-right: 0; }
.ms-tab-nav .nav:last-child:before { display: none; }
.ms-tab-nav .nav.is-this { color: #FF562F; }

/* goodfood-list */
.goodfood-list li { float: left; width: 50%; margin-top: 32px; }
.goodfood-list .img-block {
    width: 150px; height: 100px;
}
.goodfood-list .ect-clamp { height: 40px; }

/* hot-city-food */
.hot-city-food { line-height: 32px; }
.hot-city-food .tag { margin-left: -20px; }
.hot-city-food .item { float: left; line-height: 32px; padding: 0 16px; border-radius: 16px; background-color: #E8E8E8; margin-left: 20px; color: #666; margin-top: 10px; }
.hot-city-food .item:hover { color: #fff; background-color: #FF562F; -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05); box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05); }

/* food-book-list */
.food-book-list { margin-left: -20px; }
.food-book-list li { margin: 20px 0 0 20px; float: left; width: 224px; }
.food-book-list .item { display: block; padding: 16px; background-color: #fff; border-radius: 4px; -webkit-transition: all .2s linear; transition: all .2s linear; }
.food-book-list .img-block { height: 128px; border-radius: 4px; overflow: hidden; }
.food-book-list .tit { margin-top: 20px; line-height: 22px; height: 44px; font-size: 16px; }
.food-book-list .item:hover { -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); }

/* good-answer */
.good-answer { margin-left: -24px; }
.good-answer li { float: left; width: 384px; margin: 24px 0 0 24px; }
.good-answer .item { display: block; position: relative; padding: 40px 20px 30px; background-color: #fff; border-radius: 4px; overflow: hidden; }
.good-answer .item:hover { -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); }
.good-answer .tag { position: absolute; top: 0; left: 0; padding: 0 10px; height: 24px; line-height: 24px; overflow: hidden; background-color: #FFAC99; color: #fff; border-radius: 4px 0 4px 0; font-size: 12px; }
.good-answer .tit { font-size: 16px; line-height: 22px; height: 22px; }
.good-answer .det { font-size: 14px; color: #999; line-height: 20px; height: 40px; margin-top: 8px; }
.good-answer .info { margin-top: 16px; line-height: 36px; }
.good-answer .time { padding: 0 24px 0 20px; background-color: #F1F1F1; border-radius: 18px; color: #333; margin-right: 16px; }
.good-answer .time .iconfont { font-size: 16px; margin-right: 24px; }
.good-answer .num { font-size: 12px; color: #bbb; }
.good-answer .num i { margin-right: 4px; color: #333; }
