html,body{height: 100%;}
.body-box{flex: 1;overflow-y: scroll;}
.header-bar{position: relative;flex-shrink: 0;}
.search-bar{background-color: #fff;display: flex;align-items: center; padding: 0.625rem;font-size: 0.875rem;padding-bottom: 0;}
.search-bar>a{flex-shrink: 0;padding: 0 0.3125rem;margin-right: 0.3125rem;text-align: right;line-height: 2.25rem;}
.search-box{flex: 1;position: relative;}
.search-box input{width: 100%;border-radius: 1.25rem;height: 2.125rem;border: 1px solid #f2f2f2;padding: 0 0.625rem;text-indent: 2em;}
.search-box i{position: absolute;left: 0;top: 0;bottom: 0;margin: auto;height: 2.125rem;display: flex;align-items: center;justify-content: center;width: 2.25rem;color: #af8300;font-weight: 700;}
.banner-box {position: relative;z-index: 0;overflow: hidden;background-color: #fff;}
.banner-box img{width: 100%;display: block;border-radius: 0.5rem;}
.banner-box .swiper-slide{padding: 0.625rem ;}
.banner-box .swiper-pagination{bottom: 1.25rem}
.banner-box .swiper-pagination .swiper-pagination-bullet{margin: 1px !important;width: .7em;height: .3em;border-radius: 0.625rem;}
.list-img-box{overflow: hidden;position: relative;padding-bottom:1em;background-color: #fff;}
.list-img-box li{overflow: hidden;background-color: #fff;padding: 0.2rem;border-radius: 0.33rem;}
.list-img-box a{width: 20%;display: flex;flex-flow: column;align-items: center;float: left;justify-content: center;font-size: .8em;text-align: center;white-space: nowrap;text-overflow: ellipsis;padding: 0.625rem 0;overflow: hidden;}
.list-img-box img{width: 3.1rem; height: 3.1rem;margin-bottom: 0.625rem;max-width: 100%;border-radius: 0.3125rem;display: block;}
.list-img-box .swiper-pagination{bottom: .5em;}
.list-img-box .swiper-pagination-bullet{width: 1em;border-radius: 0;height: .3em;margin-left: 0 !important;margin-right: 0 !important;}
.list-img-box .swiper-pagination-bullet-active{background-color: #af8300;}
.filter-box.on{position: fixed;top: 2.6rem;left: 0;right: 0;z-index: 1001;}

.filter-box{position: relative;background-color: #fff;}
.filter-box .item-hd{display: flex;padding: 0.625rem;font-size: 0.75rem;}
.filter-box .item-hd i{display: inline-block;}
.filter-box .item-hd li+li{margin-left: 0.625rem;}
.filter-box .item-hd li{flex: 1;text-align: center;background-color: #f2f2f2;color: #999;height: 1.75rem;line-height: 1.75rem;cursor: pointer;}
.filter-box .item-bd ul{display: flex;flex-flow: row wrap;padding: 0.3125rem;}
.filter-box .item-bd li{width: 50%;padding: 0.3125rem;font-size: 0.8125rem;color: #555;overflow: hidden;}
.filter-box .item-bd a{display: block;line-height: 1.5rem;white-space: nowrap;text-overflow: ellipsis;}
.filter-box .item-bd li.on a{color: #af8300;}
.filter-box .item-bd ul{display: none;}
.filter-box .item-bd ul.on{display: flex;}
.filter-box .item-hd li.on{color: #af8300;}
.filter-box .item-hd li.on i{transform: scale(-1);}

.list-shop{padding: 0.3125rem;background-color: #fff;}
.list-shop li{padding: 0.3125rem;display: flex;}
.list-shop .img{flex-shrink: 0;width: 5rem; height: 5rem;display: flex;align-items: center;justify-content: center;border-radius: 0.25rem;overflow: hidden;margin-right: 0.6rem;}
.list-shop .img img{min-width: 100%; min-height: 100%; max-width:none;}
.list-shop .text{flex: 1;overflow: hidden; display: flex;flex-flow: column;}
.list-shop li+li{margin-top: 0.3rem;}
.list-shop .tit{font-weight: 700;display: block;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.list-shop .clb{ padding: 0.2rem 0;color: #999;font-size: 0.75rem;line-height: 1.5rem;}
.list-shop .fl{color: #af8300;}
.list-shop .cont p{font-size: 0.8rem;color: #999;line-height: 1.3em;}
.list-shop .cont{border-bottom: 1px solid #f6f6f6;flex:1}