.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden } .clearfix { * height:1%; } .clear { clear: both; } body { background-color: #f5f5f5; font-size: .28rem; visibility: hidden; padding-bottom: 1rem; } body em { font-style: normal; } body a { -webkit-tap-highlight-color: transparent; } .header-block { position: relative; padding-bottom: .5rem; position: relative; overflow: hidden; z-index: 0; background-color: #fff; } .header-block::after { content: ''; width: 200%; position: absolute; left: -50%; height: 100%; top: 0; background: url(/uploads/image/s/images/banner.png) no-repeat bottom center; background-size: 7.5rem; z-index: 1; border-radius: 0 0 50% 50%; z-index: 0; } .header-block .container { position: relative; z-index: 2; } .header-block .container header { height: 1rem; width: 100%; line-height: 1rem; padding: 0 .2rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-sizing: border-box; box-sizing: border-box; z-index: 10; } .header-block .container header .icon_list { width: .64rem; height: .64rem; text-align: center; line-height: .64rem; color: #fff; font-weight: 700; } .header-block .container header .icon_list i { font-size: .46rem; } .header-block .container header .icon_user { width: .64rem; height: .64rem; color: #fff; text-align: center; line-height: .64rem; position: relative; } .header-block .container header .icon_user::after { content: ''; width: 0.12rem; height: 0.12rem; background: #ff6a6a; border-radius: 50%; position: absolute; right: 0; top: 0; } .header-block .container header .icon_user i { font-size: .46rem; } .header-block .container header .search-block { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: rgba(0, 0, 0, 0.1); -webkit-box-flex: 1; -ms-flex: 1; flex: 1; margin: 0 .3rem; border-radius: 1rem; height: .6rem; line-height: .6rem; text-align: center; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; color: rgba(255, 255, 255, 0.4); font-size: .28rem; } .header-block .container header .search-block span { margin-right: .1rem; display: inline-block; } .header-block .container nav.navbar { padding: .2rem .3rem; } .header-block .container nav.navbar ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .header-block .container nav.navbar ul li a { display: block; color: #fff; font-weight: 700; font-size: .32rem; text-align: center; } .header-block .container .ad-swiper { padding-bottom: .5rem; position: relative; margin-top: .1rem; } .header-block .container .ad-swiper .swiper-container { overflow: unset; } .header-block .container .ad-swiper .swiper-container .swiper-slide { background-color: #eee; width: 6.4rem; overflow: hidden; border-radius: .12rem; } .header-block .container .ad-swiper .swiper-container .swiper-slide a { display: block; } .header-block .container .ad-swiper .swiper-container .swiper-slide a img { border-radius: .12rem; max-width: 100%; max-height: 100%; } .header-block .container .ad-swiper .swiper-pagination { padding: .1rem 0; bottom: -.4rem; } .header-block .container .ad-swiper .swiper-pagination-bullet { background-color: #fff; border-radius: 1rem; margin: 0 5px; } .header-block .container .activvity-section { width: 6.6rem; height: 1.8rem; margin: 0 auto; } .header-block .container .activvity-section img { width: 100%; } .navigator-block { background-color: #fff; } .navigator-block .industry-list { padding: .1rem; } .navigator-block .industry-list ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .navigator-block .industry-list ul li { width: 20%; } .navigator-block .industry-list ul li a { padding: .1rem 0; display: block; } .navigator-block .industry-list ul li a img { width: 1.1rem; height: 1.1rem; display: block; margin: 0 auto; } .navigator-block .industry-list ul li a p { color: #333; font-size: .24rem; text-align: center; padding: .1rem 0; } .navigator-block .message-block { padding: .1rem .15rem .5rem; display: -webkit-box; display: -ms-flexbox; display: flex; text-align: center; } .navigator-block .message-block > a { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; color: #fff; font-size: .28rem; font-weight: 700; padding: .3rem .2rem; -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0 .15rem; border-radius: .1rem; line-height: .4rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .navigator-block .message-block > a .iconfont { display: inline-block; font-size: 1rem; color: rgba(0, 0, 0, 0.1); } .navigator-block .message-block > a.add-messages { background-color: #abcaff; -webkit-box-shadow: 0px 15px 20px -10px rgba(155, 197, 251, 0.6); box-shadow: 0px 15px 20px -10px rgba(155, 197, 251, 0.6); } .navigator-block .message-block > a.add-messages .title { text-align: left; } .navigator-block .message-block > a.add-messages .title p:nth-child(2) { font-size: .24rem; } .navigator-block .message-block > a.rankding-section { background-color: #f7bc5e; -webkit-box-shadow: 0px 15px 20px -10px rgba(247, 188, 94, 0.6); box-shadow: 0px 15px 20px -10px rgba(247, 188, 94, 0.6); } .navigator-block .message-block > a.rankding-section .title { text-align: left; } .navigator-block .message-block > a.rankding-section .title p:nth-child(2) { font-size: .24rem; } .navigator-block .hot-news { background-color: #fff; border-radius: .12rem; padding: .2rem .3rem; display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; } .navigator-block .hot-news .date { padding-right: .3rem; -ms-flex-negative: 0; flex-shrink: 0; text-align: center; position: absolute; line-height: .4rem; top: .2rem; left: .32rem; line-height: .5rem; } .navigator-block .hot-news .date p:first-child { font-size: .32rem; color: #000; } .navigator-block .hot-news .date p:nth-child(2) { color: #999; font-size: .24rem; } .navigator-block .hot-news .news-content { height: 1rem; overflow: hidden; width: 100%; line-height: .5rem; } .navigator-block .hot-news .news-content .swiper-slide { height: 1rem; font-size: .28rem; color: #000; display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; padding-left: 1rem; } .navigator-block .hot-news .news-content .swiper-slide .news-title { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding-left: .8rem; position: relative; } .navigator-block .hot-news .news-content .swiper-slide .news-title p { -webkit-box-sizing: border-box; box-sizing: border-box; } .navigator-block .hot-news .news-content .swiper-slide .news-title p:first-child { max-width: 80%; font-size: .32rem; color: #000; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .navigator-block .hot-news .news-content .swiper-slide .news-title p:nth-child(2) { color: #999; font-size: .24rem; } .navigator-block .hot-news .news-content .swiper-slide .news-title .icon { position: absolute; left: 0; top: .1rem; font-size: .24rem; color: #fff; background-color: #ef1f34; padding: 0 .1rem; height: .36rem; line-height: .36rem; border-radius: 3px; } .ad-slide { background-color: #fff; padding: 0 .3rem .3rem; margin-top: .3rem; color: #333; } .ad-slide img { display: none; } .ad-slide .title-block { white-space: nowrap; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: .32rem; font-weight: 700; padding: .3rem 0; } .ad-slide .title-block .slide-box-pagination { display: inline-block; font-weight: normal; position: static; width: auto; font-size: .24rem; color: #999; } .ad-slide .title-block .slide-box-pagination .swiper-pagination-current { color: #fbbb11; font-size: .28rem; text-indent: 2px; } .ad-slide .slide-box { overflow: hidden; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } .ad-slide .slide-box img { width: 100%; border-radius: .1rem; display: block; margin: 0 auto; max-width: calc(100vw / 2); } .ad-slide-block { white-space: nowrap; overflow-x: auto; } .ad-slide-block .slide-view { padding: .1rem .32rem; display: inline-block; margin-top: .2rem; width: 7.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #fff; } .ad-slide-block .slide-view .left-box { width: 50%; float: left; } .ad-slide-block .slide-view .left-box .title { color: #d0835c; font-weight: 700; font-size: .32rem; padding: .2rem 0 0; text-align: center; background-color: #fff; } .ad-slide-block .slide-view .left-box .title .brand-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ad-slide-block .slide-view .left-box .swiper-box { background-color: #fff; padding-bottom: .18rem; border-radius: .1rem; position: relative; overflow: hidden; width: 3.3rem; } .ad-slide-block .slide-view .left-box .swiper-box p { color: #999; font-size: .24rem; padding: .14rem 0; font-weight: normal; text-align: center; } .ad-slide-block .slide-view .left-box .swiper-box img { width: 1.8rem; display: block; margin: 0 auto; border-radius: .06rem; } .ad-slide-block .slide-view .right-box { width: 50%; float: left; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-sizing: border-box; box-sizing: border-box; } .ad-slide-block .slide-view .right-box > a { height: 1.56rem; width: 100%; padding: .16rem .2rem; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #fff; } .ad-slide-block .slide-view .right-box > a .tag-box { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 1.6rem; float: left; height: 100%; } .ad-slide-block .slide-view .right-box > a .tag-box .h3 { color: #f77748; font-size: .32rem; font-weight: 700; } .ad-slide-block .slide-view .right-box > a .tag-box p { color: #999; font-size: .24rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ad-slide-block .slide-view .right-box > a .tag-box em { font-size: .24rem; color: #fff; width: .8rem; height: .3rem; -ms-flex-negative: 0; flex-shrink: 0; height: .36rem; line-height: .36rem; text-align: center; border-radius: 2px; } .ad-slide-block .slide-view .right-box > a .tag-box em.icon_jx { background-color: #ff5a5a; } .ad-slide-block .slide-view .right-box > a .tag-box em.icon_hot { background-color: #fbbb11; } .ad-slide-block .slide-view .right-box > a img { float: right; width: 1.2rem; border-radius: .06rem; } .recommed-brand-ul { background-color: #fff; margin-top: .2rem; position: relative; } .recommed-brand-ul .h2 { font-size: .36rem; font-weight: 700; padding: .3rem .32rem; } /* .recommed-brand-ul .h2 .span{} */ .recommed-brand-ul .cut-btn { color: #fbbb11; font-size: .28rem; outline: none; } .recommed-brand-ul .cut-btn i { vertical-align: middle; } .recommed-brand-ul .industry-swiper { position: relative; } .recommed-brand-ul .industry-swiper .brand-ul-list { -webkit-box-sizing: border-box; box-sizing: border-box; height: 4.8rem; padding: 0 .16rem; background-color: #fff;} .recommed-brand-ul .industry-swiper .brand-ul-list ul { overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -ms-flex-wrap: wrap; flex-wrap: wrap; } .recommed-brand-ul .industry-swiper .brand-ul-list ul.hot-brand li { background-color: #f7f7f7 !important; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li { width: 33.333%; text-align: center; line-height: .8rem; height: .8rem; margin: .2rem 0; float: left; border-radius: .12rem; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(1) a { background-color: #a8f5ed; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(2) a { background-color: #fbdfc7; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(3) a { background-color: #fed2cf; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(4) a { background-color: #d0e4fc; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(5) a { background-color: #dadffd; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(6) a { background-color: #fad7fe; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(7) a { background-color: #fed4e2; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(8) a { background-color: #beeeba; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(9) a { background-color: #fad7fe; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(10) a { background-color: #a8f5ed; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(11) a { background-color: #fbdfc7; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(12) a { background-color: #fed4e2; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(13) a { background-color: #a8f5ed; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(14) a { background-color: #dadffd; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(15) a { background-color: #fad7fe; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(16) a { background-color: #a8f5ed; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(17) a { background-color: #fad7fe; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(18) a { background-color: #fbdfc7; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(19) a { background-color: #fed2cf; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(20) a { background-color: #fed4e2; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(21) a { background-color: #d0e4fc; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(22) a { background-color: #beeeba; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(23) a { background-color: #fed4e2; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(24) a { background-color: #a8f5ed; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(25) a { background-color: #fbdfc7; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(26) a { background-color: #fed2cf; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(27) a { background-color: #d0e4fc; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(28) a { background-color: #fed4e2; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(29) a { background-color: #dadffd; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(30) a { background-color: #fad7fe; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li:nth-child(31) a { background-color: #d0e4fc; } .recommed-brand-ul .industry-swiper .brand-ul-list ul li a { color: #000; display: block; margin: 0 .1rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0 .1rem; border-radius: .1rem; box-sizing: border-box;} .brand-slide { background-color: #fff; padding: 0 .3rem .3rem; margin-top: .3rem; color: #333; } .brand-slide .title-block { white-space: nowrap; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: .36rem; font-weight: 700; padding: .3rem 0; } .brand-slide .title-block .slide-box-pagination { display: inline-block; position: static; font-weight: normal; width: auto; font-size: .24rem; color: #999; } .brand-slide .title-block .slide-box-pagination .swiper-pagination-current { color: #fbbb11; font-size: .28rem; text-indent: 2px; } .brand-slide .slide-box { overflow: hidden; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } .brand-slide .slide-box .swiper-slide { color: #000; text-align: center; display: block; } .brand-slide .slide-box .swiper-slide .brand-name { font-size: .28rem; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; color: #333; } .brand-slide .slide-box .swiper-slide .brand-tag { font-size: .24rem; font-weight: 700; color: #fbbf21; display: inline-block; padding: 0 .1rem; border: 1px solid #fbbf21; margin: .16rem auto; border-radius: .06rem; } .brand-slide .slide-box .swiper-slide .brand-tag i { vertical-align: middle; } .brand-slide .slide-box .swiper-slide .logo-view { display: block; } .brand-slide .slide-box .swiper-slide .logo-view img { width: 2.9rem; height: 2rem: -o-object-fit: cover; object-fit: cover; margin: 0 auto; border-radius: .06rem; -ms-flex-negative: 0; flex-shrink: 0; } .brand-slide .slide-box .swiper-slide .brand-price { color: #666; font-size: .24rem; padding: .1rem 0; line-height: .4rem; } .brand-slide .slide-box .swiper-slide .brand-price em { color: #333; font-weight: 700; } .brand-slide .slide-box .swiper-slide .brand-btn { display: inline-block; background-color: #ef1f34; color: #fff; font-weight: 700; padding: 2px .2rem; border-radius: 2px; } .icon-block { padding: .2rem .32rem; background-color: #fff; margin-top: .3rem; text-align: center; line-height: .4rem; } .icon-block ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .icon-block ul li { color: #333; line-height: .4rem; } .icon-block ul li .img { width: .9rem; height: .9rem; border-radius: 50%; margin: 0 auto; margin-bottom: .1rem; } .icon-block ul li .img span { color: #fff; font-size: .5rem; text-align: center; line-height: .9rem; } .icon-block ul li .img.axjm { background-color: #ff5a5a; } .icon-block ul li .img.wyfw { background-color: #6aa3fb; } .icon-block ul li .img.zsxm { background-color: #fbbb11; } .icon-block ul li .h2 { font-size: .28rem; font-weight: 700; } .icon-block ul li p { color: #999; font-size: .24rem; } .brand-list { padding: 0 .32rem; background-color: #fff; margin-top: .3rem; } .brand-list .h2 { font-size: .36rem; font-weight: 700; color: #333; padding: .3rem 0; } .brand-list ul li { display: -webkit-box; display: -ms-flexbox; display: flex; padding: .2rem 0; border-bottom: 1px solid #eee; } .brand-list ul li:nth-child(-n 3) .brand-info .brand-name .ranking-icon { background: url(/uploads/image/s/images/icon_top.png) no-repeat center; background-size: 100% auto; font-size: .28rem; color: #ef1f34; width: .44rem; height: .68rem; display: inline-block; background-size: cover; text-align: center; line-height: .56rem; } .brand-list ul li:last-child { border: none; } .brand-list ul li .brand-logo { -ms-flex-negative: 0; flex-shrink: 0; width: 2.2rem; height: 2.2rem; display: inline-block; } .brand-list ul li .brand-logo img { width: 2.2rem; height: 2.2rem; border-radius: 3px; } .brand-list ul li .brand-info { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding-left: .2rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: distribute; justify-content: space-around; line-height: .55rem; } .brand-list ul li .brand-info > div { height: .55rem; } .brand-list ul li .brand-info .brand-name { font-size: .32rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .brand-list ul li .brand-info .brand-name a { -ms-flex-negative: 0; flex-shrink: 0; color: #333; display: inline-block; max-width: 3.6rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .32rem; } .brand-list ul li .brand-info .brand-name .ranking-icon { display: none; } .brand-list ul li .brand-info .brand-tag { font-size: .24rem; color: #999; letter-spacing: 1px; } .brand-list ul li .brand-info .brand-icon .icon { font-size: .24rem; color: #8fa3d2; background-color: #eef7ff; padding: 2px .1rem; margin-right: .1rem; } .brand-list ul li .brand-info .brand-icon .icon.icon_ads { color: #deb089; background-color: #fef6eb; } .brand-list ul li .brand-info .brand-line .brand-price { color: #ef1f34; font-size: .24rem; } .brand-list ul li .brand-info .brand-line .brand-price em { font-weight: 700; font-size: .28rem; } .brand-list ul li .brand-info .brand-line .brand-btn { font-size: .28rem; color: #fff; padding: 0 .2rem; background-color: #ef1f34; border-radius: 2px; } .brand-list ul li .brand-info .brand-line .brand-btn:active { background-color: rgba(255, 40, 56, 0.8); } .swiper-brandimg { position: relative; margin-top: .3rem; overflow: hidden; } .swiper-brandimg .swiper-slide { display: block; } .swiper-brandimg .swiper-slide img { width: 100%; } .swiper-brandimg .brandimg-pagination { right: 0; left: auto; bottom: 0; color: #fff; position: absolute; z-index: 1; width: auto; padding: .1rem; } .slide-brandul { background-color: #fff; margin-top: .3rem; } .slide-brandul .title { color: #333; padding: .2rem .32rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; line-height: .5rem; } .slide-brandul .title .left .h2 { font-size: .38rem; font-weight: 700; } .slide-brandul .title .left p { color: #999; font-size: .28rem; margin-top: .1rem; } .slide-brandul .title .btn { display: none; color: #fbbb11; font-size: .28rem; font-weight: 700; } .slide-brandul .slide-ul .switch-tabs { margin: .3rem .32rem; display: -webkit-box; display: -ms-flexbox; display: flex; background-color: #f8f8f8; border-radius: 1rem; } .slide-brandul .slide-ul .switch-tabs span { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; color: #333; font-size: .26rem; text-align: center; border-radius: 1rem; padding: 3px 0; } .slide-brandul .slide-ul .switch-tabs span.on { background-color: #fbbb11; color: #fff; font-weight: 700; } .slide-brandul .swiper-brandul { overflow: hidden; } .slide-brandul .swiper-brandul .swiper-slide { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0 .16rem; } .slide-brandul .swiper-brandul .swiper-slide ul { overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } .slide-brandul .swiper-brandul .swiper-slide ul.hot-brand li { background-color: #f7f7f7 !important; } .slide-brandul .swiper-brandul .swiper-slide ul li { width: 30%; text-align: center; margin: .2rem .1rem; float: left; border-radius: .12rem; } .slide-brandul .swiper-brandul .swiper-slide ul li a { color: #000; display: block; text-align: center; line-height: .4rem; } .slide-brandul .swiper-brandul .swiper-slide ul li a img { display: block; width: 100%; border-radius: 5px; } .slide-brandul .swiper-brandul .swiper-slide ul li a .brand-name { color: #333; font-weight: 600; font-size: .28rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: .1rem; } .slide-brandul .swiper-brandul .swiper-slide ul li a .brand-price { color: #ef1f34; font-size: .24rem; } .brand-news { background-color: #fff; border-radius: .1rem; overflow: hidden; margin-top: .3rem; } .brand-news .news-pagination { height: .7rem; line-height: .7rem; font-size: .36rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-pack: distribute; justify-content: space-around; margin: .3rem .32rem; background-color: #f8f8f8; border-radius: 1rem; overflow: hidden; } .brand-news .news-pagination span { font-size: .36rem; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; border-radius: 1rem !important; height: 100%; border-radius: 0; color: #333; text-align: center; background-color: transparent; font-size: .32rem; opacity: 1; outline: none; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); } .brand-news .news-pagination span.swiper-pagination-bullet-active { background-color: #fbbb11; color: #fff; font-weight: 700; } .brand-news .news-pages { overflow: hidden; -webkit-box-sizing: border-box; box-sizing: border-box; } .brand-news .news-pages .swiper-slide { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0 .32rem; } .brand-news .news-pages .swiper-slide ul { display: block; width: 100%; } .brand-news .news-pages .swiper-slide ul li a { display: -webkit-box; display: -ms-flexbox; display: flex; padding: .2rem 0; border-bottom: 1px solid #eee; } .brand-news .news-pages .swiper-slide ul li a .title-section { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding-left: .2rem; } .brand-news .news-pages .swiper-slide ul li a .title-section .title { font-size: .3rem; color: #333; height: .4rem; line-height: .4rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 5.8rem; } .brand-news .news-pages .swiper-slide ul li a .title-section .date { font-size: .28rem; color: #999; margin-top: .1rem; } .brand-news .news-pages .swiper-slide ul li a .img-view { width: 1.1rem; height: 1.1rem; -ms-flex-negative: 0; flex-shrink: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-line-pack: center; align-content: center; border-radius: 1rem; overflow: hidden; } .brand-news .news-pages .swiper-slide ul li a .img-view img { width: 1.1rem; height: 1.1rem; -o-object-fit: cover; object-fit: cover; } .brand-news .news-pages .swiper-slide .link-a { padding: .3rem 0; color: #fbbb11; display: block; text-align: center; font-size: .32rem; } .brand-news .news-pages .swiper-slide .link-a i { margin-left: .1rem; font-size: .28rem; } .brand-news .news-pages .swiper-slide.top ul li a .img-view { width: 1.1rem; height: 1.1rem; -ms-flex-negative: 0; flex-shrink: 0; background: url(/uploads/image/s/images/tuijian-01.png) no-repeat center; background-size: auto 1rem; color: #666; font-size: .32rem; font-weight: 700; text-align: center; line-height: .9rem; } .brand-news .news-pages .swiper-slide.top ul li:nth-child(-n 3) .img-view { background: url(/uploads/image/s/images/new-01.png) no-repeat center; background-size: auto 1rem; color: rgba(239, 31, 52, 0.8); } .industry-swiper-ul { background-color: #fff; overflow: hidden; margin-top: .3rem; padding-bottom: .2rem; } .industry-swiper-ul .industry-pagination { height: .7rem; line-height: .7rem; font-size: .36rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-pack: distribute; justify-content: space-around; margin: .3rem .32rem; background-color: #f8f8f8; border-radius: 1rem; overflow: hidden; } .industry-swiper-ul .industry-pagination span { font-size: .36rem; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; border-radius: 1rem !important; height: 100%; border-radius: 0; color: #333; text-align: center; background-color: transparent; font-size: .32rem; opacity: 1; outline: none; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); } .industry-swiper-ul .industry-pagination span.swiper-pagination-bullet-active { background-color: #fbbb11; color: #fff; font-weight: 700; } .industry-swiper-ul .industry-pages { overflow: hidden; -webkit-box-sizing: border-box; box-sizing: border-box; } .industry-swiper-ul .industry-pages .swiper-slide { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0 .16rem; } .industry-swiper-ul .industry-pages .swiper-slide ul { overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -ms-flex-wrap: wrap; flex-wrap: wrap; } .industry-swiper-ul .industry-pages .swiper-slide ul li { width: 33.333%; text-align: center; line-height: .8rem; height: .8rem; margin: .2rem 0; float: left; border-radius: .12rem; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(1) a { background-color: #a8f5ed; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(2) a { background-color: #fbdfc7; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(3) a { background-color: #fed2cf; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(4) a { background-color: #d0e4fc; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(5) a { background-color: #dadffd; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(6) a { background-color: #fad7fe; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(7) a { background-color: #fed4e2; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(8) a { background-color: #beeeba; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(9) a { background-color: #fad7fe; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(10) a { background-color: #a8f5ed; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(11) a { background-color: #fbdfc7; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(12) a { background-color: #fed4e2; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(13) a { background-color: #a8f5ed; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(14) a { background-color: #dadffd; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(15) a { background-color: #fad7fe; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(16) a { background-color: #a8f5ed; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(17) a { background-color: #fad7fe; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(18) a { background-color: #fbdfc7; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(19) a { background-color: #fed2cf; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(20) a { background-color: #fed4e2; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(21) a { background-color: #d0e4fc; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(22) a { background-color: #beeeba; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(23) a { background-color: #fed4e2; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(24) a { background-color: #a8f5ed; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(25) a { background-color: #fbdfc7; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(26) a { background-color: #fed2cf; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(27) a { background-color: #d0e4fc; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(28) a { background-color: #fed4e2; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(29) a { background-color: #dadffd; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(30) a { background-color: #fad7fe; } .industry-swiper-ul .industry-pages .swiper-slide ul li:nth-child(31) a { background-color: #d0e4fc; } .industry-swiper-ul .industry-pages .swiper-slide ul li a { color: #000; display: block; margin: 0 .1rem; border-radius: .1rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0 .1rem; box-sizing: border-box;} .brand-news-ul { background-color: #fff; overflow: hidden; margin-top: .3rem; padding: 0 .32rem; } .brand-news-ul .news-ul-pagination { width: 100%; height: .7rem; line-height: .7rem; font-size: .32rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-pack: distribute; justify-content: space-around; margin: .3rem auto; background-color: #f8f8f8; border-radius: 1rem; overflow: hidden; } .brand-news-ul .news-ul-pagination span { font-size: .32rem; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; border-radius: 1rem !important; height: 100%; border-radius: 0; color: #333; text-align: center; background-color: transparent; opacity: 1; outline: none; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); } .brand-news-ul .news-ul-pagination span.swiper-pagination-bullet-active { background-color: #fbbb11; color: #fff; font-weight: 700; } .brand-news-ul .news-ul-pages { overflow: hidden; -webkit-box-sizing: border-box; box-sizing: border-box; } .brand-news-ul .news-ul-pages .swiper-slide { -webkit-box-sizing: border-box; box-sizing: border-box; } .brand-news-ul .news-ul-pages .swiper-slide ul { display: block; width: 100%; } .brand-news-ul .news-ul-pages .swiper-slide ul li a { display: -webkit-box; display: -ms-flexbox; display: flex; padding: .2rem 0; border-bottom: 1px solid #eee; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .brand-news-ul .news-ul-pages .swiper-slide ul li a .title-section { padding-right: .2rem; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .brand-news-ul .news-ul-pages .swiper-slide ul li a .title-section .title { font-size: .32rem; color: #333; height: 1.2rem; line-height: .6rem; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .brand-news-ul .news-ul-pages .swiper-slide ul li a .title-section .date { font-size: .28rem; color: #999; margin-top: .1rem; } .brand-news-ul .news-ul-pages .swiper-slide ul li a .title-section .date .icon { padding: 2px .1rem; color: #fff; font-size: .24rem; margin-right: .1rem; border-radius: .06rem; } .brand-news-ul .news-ul-pages .swiper-slide ul li a .title-section .date .icon.icon_top { background-color: #ef1f34; } .brand-news-ul .news-ul-pages .swiper-slide ul li a .title-section .date .icon.icon_hot { background-color: #fbbb11; } .brand-news-ul .news-ul-pages .swiper-slide ul li a .title-section .date .icon.icon_recommed { background-color: #44b4fb; } .brand-news-ul .news-ul-pages .swiper-slide ul li a .img-view { width: 2.2rem; height: 1.8rem; -ms-flex-preferred-size: 2.2rem; flex-basis: 2.2rem; -ms-flex-negative: 0; flex-shrink: 0; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-line-pack: center; align-content: center; overflow: hidden; } .brand-news-ul .news-ul-pages .swiper-slide ul li a .img-view img { width: 2.2rem; height: 1.8rem; border-radius: .06rem; -o-object-fit: cover; object-fit: cover; } .show-block { background-color: #fff; margin-top: .3rem; padding-bottom: .3rem; } .show-block .h2 { font-size: .36rem; font-weight: 700; color: #333; padding: .3rem 0.32rem; } .show-block .content { background-color: #fff; } .show-block .content ul { white-space: nowrap; overflow-x: scroll; font-size: 0; } .show-block .content ul li { display: inline-block; width: 3.6rem; text-align: center; } .show-block .content ul li .time { color: #fbbb11; font-size: .24rem; font-weight: 700; text-align: center; padding: .3rem 0; border-bottom: 1px solid #eee; position: relative; margin-bottom: .3rem; } .show-block .content ul li .time::before { content: ''; display: inline-block; position: absolute; left: 50%; bottom: -.13rem; width: .26rem; height: .26rem; border-radius: 1rem; background-color: #fbbb11; margin-left: -.13rem; } .show-block .content ul li .card { width: 3.2rem; padding: .2rem; display: block; -webkit-box-sizing: border-box; box-sizing: border-box; margin: .3rem auto; -webkit-box-shadow: 0 0 .3rem #eee; box-shadow: 0 0 .3rem #eee; } .show-block .content ul li .card .ads { color: #ef1f34; font-size: .36rem; font-weight: 700; margin-bottom: .2rem; } .show-block .content ul li .card .ads-m { color: #333; font-size: .28rem; } .show-block .content ul li .card .title { margin-top: .3rem; color: #999; font-weight: 700; font-size: .24rem; line-height: .4rem; } .show-block .link-block { padding: .1rem .32rem; } .show-block .link-block .zh-swiper { overflow: hidden; position: relative; height: 1.6rem; } .show-block .link-block .zh-swiper a { border: 1px solid #eee; display: -webkit-box; display: -ms-flexbox; display: flex; padding: .2rem; -webkit-box-sizing: border-box; box-sizing: border-box; } .show-block .link-block .zh-swiper a .left { color: #666; font-size: .24rem; line-height: .4rem; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .show-block .link-block .zh-swiper a .left .title { color: #000; font-size: .28rem; font-weight: 700; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; } .show-block .link-block .zh-swiper a .left .ads { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; } .show-block .link-block .zh-swiper a .right { width: .8rem; -ms-flex-negative: 0; flex-shrink: 0; color: #fbbb11; font-size: .36rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-line-pack: center; align-content: center; } .show-block .link-block .zh-swiper a .right span { font-size: .4rem; font-weight: 700; line-height: 1.2rem; } .wx-ad { display: -webkit-box; display: -ms-flexbox; display: flex; padding: .3rem .32rem; background-color: #fff; margin-top: .3rem; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-line-pack: center; align-content: center; } .wx-ad .left-content { line-height: .4rem; } .wx-ad .left-content .title p { color: #000; font-size: .28rem; } .wx-ad .left-content .tips { margin-top: .3rem; color: #999; font-size: .24rem; } .wx-ad .right-img { color: #999; font-size: .24rem; text-align: center; } .wx-ad .right-img img { width: 1.7rem; height: 1.7rem; } /* form */ .form-box { width: 90%; padding: .4rem; background-color: #fff; display: none; position: relative; border-radius: .1rem; -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0 auto; } .form-box .h2 { font-size: .38rem; font-weight: 700; color: #000; margin-bottom: .4rem; text-align: center; height: .6rem; line-height: .6rem; } .form-box .h2 span { position: absolute; top: .2rem; right: .2rem; width: .48rem; height: .48rem; background: url(/uploads/image/s/images/icon_close.png) no-repeat center; background-size: cover; } .form-box .title { line-height: 25px; color: #333; font-size: .28rem; margin-bottom: .2rem; } .form-box .title span { color: #000; font-weight: 700; padding: 0 2px; } .form-box .title p:nth-child(2) { margin-top: .1rem; } .form-box form .form-group { padding: 10px 0; } .form-box form .form-group input { width: 100%; height: .8rem; border-radius: 5px; -webkit-box-sizing: border-box; box-sizing: border-box; } .form-box form .form-group input.tel { border: 1px solid #ddd; padding-left: .8rem; font-size: .32rem; color: #999; background: url(/uploads/image/s/images/icon_phone.png) no-repeat 0.1rem center; background-size: .48rem; } .form-box form .form-group input.tel::-webkit-input-placeholder { color: #a6afb7; } .form-box form .form-group input.tel:-ms-input-placeholder { color: #a6afb7; } .form-box form .form-group input.tel::-ms-input-placeholder { color: #a6afb7; } .form-box form .form-group input.tel::placeholder { color: #a6afb7; } .form-box form .form-group input.btn { background-color: #ef1f34; font-size: .36rem; color: #fff; } .form-box form .form-group input.btn:active { background-color: #ef1f34ad; } .form-box .tips { color: #b6bfcc; line-height: .4rem; margin-top: .2rem; font-size: .24rem; } .form-box2 { width: 90%; padding: .4rem; background-color: #fff; display: none; position: relative; border-radius: .1rem; -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0 auto; } .form-box2 .h2 { font-size: .38rem; font-weight: 700; color: #000; margin-bottom: .4rem; text-align: center; height: .6rem; line-height: .6rem; } .form-box2 .h2 span { position: absolute; top: .2rem; right: .2rem; width: .48rem; height: .48rem; background: url(/uploads/image/s/images/icon_close.png) no-repeat center; background-size: cover; } .form-box2 .count-block { line-height: 25px; color: #333; font-size: .28rem; margin-bottom: .2rem; background-color: #e8d2a8; color: #fff; padding: .1rem .2rem; border-radius: .1rem; } .form-box2 .count-block p { font-size: .24rem; } .form-box2 .count-block div { font-size: .6rem; text-align: left; padding: .2rem 0; height: .7rem; line-height: .7rem; } .form-box2 form .form-group { padding: 5px 0; position: relative; } .form-box2 form .form-group.items { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: left; position: relative; } .form-box2 form .form-group.items label { width: 48%; border-radius: .1rem; -webkit-box-sizing: border-box; box-sizing: border-box; border: 1px solid #ddd; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 0 .3rem; color: #6c6c6c; font-weight: 700; font-size: .36rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .form-box2 form .form-group.items .label { width: .36rem; height: .36rem; border-radius: 50%; border: 1px solid #e8d2a8; } .form-box2 form .form-group.items .section { width: 48%; position: relative; } .form-box2 form .form-group.items .section input { font-weight: 700; font-size: .4rem; color: #666; } .form-box2 form .form-group.items .section input::-webkit-input-placeholder { font-size: .32rem; color: #999; font-weight: normal; } .form-box2 form .form-group.items .section input:-ms-input-placeholder { font-size: .32rem; color: #999; font-weight: normal; } .form-box2 form .form-group.items .section input::-ms-input-placeholder { font-size: .32rem; color: #999; font-weight: normal; } .form-box2 form .form-group.items .section input::placeholder { font-size: .32rem; color: #999; font-weight: normal; } .form-box2 form .form-group.items .section span { position: absolute; right: .2rem; top: 50%; -webkit-transform: translatey(-50%); transform: translatey(-50%); font-size: .32rem; line-height: .32rem; } .form-box2 form .form-group.items input { width: 100%; position: relative; } .form-box2 form .form-group.items input[type='radio'] { width: 10px; visibility: hidden; } .form-box2 form .form-group.items input[type='radio']:checked .label { background: url(/uploads/image/s/images/icon_form-checked.svg) no-repeat center; background-size: cover; width: .46rem; height: .46rem; border: none; } .form-box2 form .form-group input { width: 100%; height: .8rem; border-radius: 5px; -webkit-box-sizing: border-box; box-sizing: border-box; border: 1px solid #ddd; font-size: .32rem; color: #999; padding: 0 .2rem; } .form-box2 form .form-group input::-webkit-input-placeholder { color: #a6afb7; } .form-box2 form .form-group input:-ms-input-placeholder { color: #a6afb7; } .form-box2 form .form-group input::-ms-input-placeholder { color: #a6afb7; } .form-box2 form .form-group input::placeholder { color: #a6afb7; } .form-box2 form .form-group input.btn { background-color: #ef1f34; font-size: .36rem; color: #fff; border: none; } .form-box2 form .form-group input.btn:active { background-color: #ef1f34ad; } .form-box2 .tips { color: #b6bfcc; line-height: .4rem; margin-top: .2rem; font-size: .24rem; } body .custom-class { border-radius: 10px; background-color: unset; } .title-block em,.brand-list .h2{ position: relative;padding-left: .2rem;} .title-block em:after{ content: ''; position: absolute; z-index: 0; top: 2px; left: 0; width: 4px; height: 88%; background-color: #ef1f34; border-radius: 2px; } .brand-list .h2:after { content: ''; position: absolute; z-index: 0; top: 17px; left: 0; width: 4px; height: 39%; background-color: #fbbb11; border-radius: 2px; } .layout { margin: 0 15px; position: relative; } .home-top { background: #fff; } .home-top .top-title { padding: 11px 0; } .home-top .top-title img { width: 120px; height: 24px; display: block; } .home-top .top-search { position: absolute; right: 0; top: 10px; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; } .home-top .top-search a { display: block; } .home-top .top-search a svg { margin-top: 2px; fill: #999; } .search-input { width: 222px; height: 29px; border: 1px solid #d1d1d1; border-radius: 2px; padding: 0 10px; margin-top: 8px; background: #fff; } .search-input input { width: 180px; line-height: 27px; border: none; display: block; float: left; font-size: 12px; padding: 0; } .search-input input:focus { outline: none; } .search-input button { float: right; border: none; display: block; background: none; padding-top: 3px; } .search-input button svg { fill: #999; } .top-detail { background: #fff; border-bottom: 1px solid #d6d7d8; } .top-detail .top-title { margin: 0 auto; padding: 11px 0; } .top-detail .top-title h1 { font-size: 20px; line-height: 24px; color: #333; text-align: center; } .top-detail .top-btn { position: absolute; left: 0; top: 10px; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; } .top-detail .top-btn a { } .top-detail .top-btn .history-default { padding: 0; margin: 0; margin-right: 5px; background: #fff; } .top-detail .top-btn .history-default svg { margin-top: 2px; } .top-detail .top-btn a img { width: 46px; height: 24px; } .top-detail .top-search { position: absolute; right: 0; top: 10px; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; } .top-detail .top-search a { display: block; } .top-detail .top-search a svg { margin-top: 2px; fill: #999; } .filter { background: #fff; padding: 9px 0 15px 0; } .filter .layout { display: flex; flex-wrap: nowrap; flex-direction: row; justify-content: space-between; } .filter-info { font-size: 15px; color: #666; line-height: 29px; } .filter-info span { color: #179362; margin-left: 12px; } .filter-btn { font-size: 15px; color: #fff; line-height: 29px; height: 29px; padding: 0 9px; border-radius: 2px; background-color: #179362; } #left-sidebar, #search-sidebar { position: fixed !important; top: 0; max-height: 100% !important; height: 100%; background-color: rgba(0,0,0,0.2); min-width: 45px !important; overflow-x: hidden !important; overflow-y: auto !important; z-index: 9999 !important; -webkit-overflow-scrolling: touch; will-change: transform; display: none; z-index: 10001 !important; width: 100% !important; max-width: 100% !important; } #search-sidebar.show, #left-sidebar.show { display: block; } #left-sidebar .filter-box { width: 80%; background: #fff; height: 100%; } #search-sidebar .filter-box { width: 100%; background: #fff; height: 100%; } .filter-box-top { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; padding: 0 15px; border-bottom: 1px solid #c8c8c6; height: 46px; background: #f8f9fa; position: relative; } .filter-box-top .filter-close { z-index: 2; } .filter-box-top .title { font-size: 20px; color: #179362; line-height: 20px; text-align: center; color: #333; position: absolute; left: 0; bottom: 0; width: 100%; line-height: 46px; z-index: 1; } .filter-box-top .filter-close svg { margin-top: 12px; } .list-set {background:#ffffff;border-top: #d9d9d9 1px solid !important;border-bottom: #d9d9d9 1px solid !important;font-size:18px;} .list-set li {background:#ffffff;} .list-set div {margin-left:15px;height:44px;line-height:44px;padding:0 36px 0 0;overflow:hidden;border-top: #d9d9d9 1px solid !important;background: no-repeat right center;background-size:23px 13px;} .list-set a {display:block;width:100%;height:44px;} .list-set em {display:block;height:16px;line-height:16px;padding:0 6px;float:right;font-size:12px;color:#ffffff;font-style:normal;background:#ff0000;border-radius:10px;margin-top:14px;} .list-set span {float:right;font-size:14px;color:#333333;padding-left:10px;} .list-set li:first-child div {border:none;} .list-set input,.list-set select {border:#eeeeee 1px solid;border-radius:0;-webkit-appearance:none;padding:4px;font-size:14px;} .list-set-img div {margin-left:50px;} .list-set-img img {width:24px;height:24px;position:absolute;z-index:8;margin:10px 0 0 -36px;}