﻿
body.bj{ background: #F4F7F9;}
.mall-banner{ display: inline-block; width: 100%;}
.mall-banner h1{ display: inline-block; float: left; width: 100%;}
.mall-banner h1 img{ display: block; width: 100%;overflow: hidden; float: left; border-radius: 0.5rem;}
.mall-banner h2{ height: 3.2rem; overflow: hidden; width: 90%; padding: 0 5%;}
.mall-banner h2 span{ width: 49.5%; float: left; text-align: center; padding-top: 0.9rem; display: block;}
.mall-banner h2 .sp1{ display: block; color: #000000; font-size: 0.8rem; text-align: left;}
.mall-banner h2 .sp1 i{ color: #E1B05C; font-size: 1.3rem; margin-right: 0.5rem;}
.mall-banner h2 .sp2{text-align: right; padding-top: 1.3rem;}
.mall-banner h2 .sp2 a{ display: block; color: #000000; font-size: 0.8rem; padding-left:2rem; background-size:1.78rem 1.6rem;}
#mall-banner{ width: 92%; padding: 0 4%; display: inline-block; border-radius:0.5rem; overflow: hidden; margin-bottom: 0.7rem;}

.tipMessage{ width: 92%; margin: 0 auto 0.7rem; height: 1.25rem; overflow: hidden;}
.tipMessage span{ display: block; float: left; width: 8%; height: 1.25rem; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAqNJREFUeNrcmEtIVUEYxz23yB50b5uiSCKSKOi1KSoQKYvChMpF0SKJIMVFUIFBtgmEHqBQidCujfRAF0aLlCxaFLUoeiy0TUpQUmRYRo+VHX+ffAemEe3c8xjEgR//68ycb/7OzJnH8XzfL5gqKVMwhdLMuAGaPO8ocg6WwTM4Xuf7r6LE8uIME0bOIBet7GFYiaFBZ8M0gRFJOTjkbM5MYiRIy52YCWFE0ozUzYQ0MtGzJfAIDsQ2E8eIpo2wDdqIdQeykczwYH1MI5KaoRa+wT7oJm7uv682leYgJbAGdkJFng1f5dU+qbFy/B42Yq9A7kMxdErsOjWRsUxk4Qo/B/WByxGMmPEqke9oByyUPBru1+H6AuVwbNwwUXku8hhOwLyEVvjP8BP2y+pMG0vU0EekWus0kD/b7pnTsD7JvYZGZXtYDS90WFqNsrvIE1gMe20zVWlsfjQ6gOyGT7CDXthlFF9XrbTNFKe1G2NoyHgbjxhFD1Q3uT5CdBjrTWDyA/IHipya0UkraZFV9AsKnZphrgQmhow8D8lq7zgdpj2qr428VTAL+m0zfSn2iqxhZ/XPm0ZRuepT20xrSkbmI+1y+oOXwUQmX468NVqt3TbTCG8SNrIOeatD9BUOMpH/anGtLoi98PAfM1T6jZTKJqczPIm0AZbCc9hKG31qcrP+82NNBwYz1uv3Q3db2dRkpTwF92KYuQFrYQtx36mRMqQLZD9qIb8zr9sBAWTynY9yhDBiLNBVuEY74ZZsQdQbyetwxQMXkPq4657OE/nvG+CwaSSvSxwPXmoaW6Min/jaQHrnGrF6ErnEhTwLjxumVK4q0kMhhmzE2SUuhKH3Tr9CTGJIDt+3nX8SUUNV2hO+7jHbo1z6Y3+FmNYfi0YFGADXnOn0Icyb3wAAAABJRU5ErkJggg==) no-repeat left top; background-size:1.25rem; }
.tipMessage .marquee{ display: block; width: 92%; float: left; color: #8B0000; font-size: 0.95rem;}
@keyframes kf-marque-animation{ 
	0% { transform: translateX(0);} 
	100% { transform: translateX(-55%);} 
}
.marquee{
    width: 82%;
    float: left;
    border: none;
    display: block;
    margin: 0 auto;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: clip;
    position: relative;
}
.marquee .content{
    display: inline-block;
    position: relative;
    padding-right: 0px;
    animation: kf-marque-animation 12s linear infinite;
    white-space: nowrap;
}
.marquee .content p{
	line-height: 1.4rem; padding-left: 3%;}

.mall-nav{ width: 92%; margin: 0 auto; background: #fff; margin-bottom: 0.7rem; border-radius:0.5rem; overflow: hidden;}
.mall-nav ul{ background: #FFFFFF; display: inline-block; padding-bottom: 1rem; width: 100%;}
.mall-nav ul li{ float: left; width: 25%; padding-top: 0.7rem;}
.mall-nav ul li a{ display: block; text-align: center;}
.mall-nav ul li a img{ display: block; width: 4.28rem; height: 4.28rem; margin: 0 auto; }
.mall-nav ul li a span{ display: block; color: #2C2C2C; font-size: 0.9rem; height: 2rem; line-height: 2rem;}
.mall-nav ul li.li a span{ margin-left: 0.1rem;}

.mall-hot{ background: url(../images/mall/fenlei_bj1.png) no-repeat left; background-size:cover; display: inline-block; width: 92%; padding-bottom: 1rem; margin:0 4% 0.6rem 4%; border-radius:0.5rem; overflow: hidden;}
.mall-hot h1{ width: 95.5%; margin: 0 0 0 4.5%;}
.mall-hot h1 span{ position: relative; margin: 1.15rem auto; font-size: 1.1rem; font-weight: bold; text-align: left; display: block;}
.mall-hot h1 span a{ color: #AE805C; display: block;}
.mall-hot h1 span:after{ content: ''; position: absolute; right: 4.5%; top: 0; bottom: 0; margin: auto; transform:rotate(-45deg); display: block; width: 0.5rem; height: 0.5rem; border: 2px solid #AE805C; border-left:none; border-top:none;}
.mall-hot-nr{ width: 95%; margin: 0 auto; overflow: hidden;}
.hot-slide{ display: inline-block; width: 100%;}
.mall-hot-nr ul li{ overflow: hidden; display: block; float: left; width: 31%; margin-left: 2%; background: #fff; border-radius: 0.5rem;}
.mall-hot-nr ul li a{ width: 100%; display: block; overflow: hidden;}
.mall-hot-nr ul li p img{ display: block; width: 100%; margin: 0 auto;}
.mall-hot-nr ul li p{ position: relative;}
.mall-hot-nr ul li p i.i1{ position: absolute; left: 0.3rem; top:0.4rem; display: block; text-align: center; font-size: 0.7rem; color: #FFFFFF; width: 1.43rem; height: 1.43rem; line-height: 1.2rem; background: url(../images/mall/ico_bj.png) no-repeat left top; background-size:100%;}
.mall-hot-nr ul li p i.i2{position: absolute; left: 0.3rem; top:0.4rem; display: block; text-align: center; font-size: 0.7rem; color: #FFFFFF; width: 1.43rem; height: 1.43rem; line-height: 1.2rem; background: url(../images/mall/ico_red_bj.png) no-repeat left top; background-size:100%;}
.mall-hot-nr ul li span{ max-width: 7rem; width: 90%; padding: 0 5%; padding-top: 0.5rem; display: block; color: #000; font-size: 0.93rem;overflow: hidden; white-space: nowrap;text-overflow: ellipsis;}
.mall-hot-nr ul li em{ padding: 0 5%; width: 90%; display: block; font-size: 0.75rem; color: #000; padding-bottom: 0.5rem; }
.mall-hot-nr ul li em i{ color: #BE9E72; margin-right: 0.2rem; font-size: 1.3rem;}
.mall-hot-nr ol{ display: none; width: 3rem; margin: 0 auto; padding: 1.2rem 0; height: 0.4rem;}
.mall-hot-nr ol li{ display: block; float: left; width: 0.5rem; margin-right: 0.75rem; height: 0.5rem; background: #D2D2D2; border-radius: 100%; font-size: 0px;}
.mall-hot-nr ol li.on{ background: #FF3838;}
.mall-hot-nr ol li:nth-child(3){ margin-right: 0;}

.mall-recommend{ display: inline-block; width: 100%; padding-bottom: 3.9rem;}
.mall-recommend h1 span{ margin: 0.7rem auto; display: block; font-size: 1.1rem; text-align: center; color: #fff; display: block; background: url(../images/mall/mall_pro_tit2.jpg) no-repeat center top; width: 9.3rem; height: 1.87rem; background-size:9.3rem;}
.mall-recommend h1 i{ float: right; font-size: 0.9rem; margin-right: 5%; background: url(../images/mall/mall_jt.jpg) no-repeat right 0.475rem; background-size:0.8rem; padding-right: 1.1rem;}
.mall-recommend h1 i a{ color: #7B7C81; }
.mall-recommend-nr{ display: inline-block; width: 92%; margin: 0 4%;}
.mall-recommend-nr ul li{ float: left; width: 49%; border-radius: 0.5rem; overflow: hidden; background: #fff; margin-bottom: 0.5rem;}
.mall-recommend-nr ul li.list{ float: right;}
.mall-recommend-nr ul li p img{ display: block; width: 100%; margin: 0 auto;}
.mall-recommend-nr ul li span{ text-overflow: ellipsis; white-space: nowrap; background: #fff; display: block; height: 1.5rem; padding: 0 5%; padding-top: 0.5rem; color: #000; overflow:hidden; font-size: 0.93rem;}
.mall-recommend-nr ul li em{ background: #fff; display: block; padding: 0 5%; padding-bottom: 1rem; color: #000; font-size: 0.75rem;}
.mall-recommend-nr ul li em i{ color: #BE9E72; margin-right: 0.2rem; font-size: 1.3rem;}

#loading{ width: 100%; height: 0.6rem; display: none; padding: 0.7rem 0;}
#loading img{ display: block; width: 1rem; height: 1rem; margin: 0 auto;}

.vip-nav{ width:100%; border-top:0.5px solid #DFDFDF; position: fixed; bottom: 0rem; left: 0; z-index: 999; background: #fff; height: 3.9rem; overflow: hidden;}
.vip-nav-bottom{ width: 100%; display: inline-block;}
.vip-nav-bottom span a{ color: #000000; font-size: 0.8rem; display: block; width: 33.33%; float: left; text-align: center; height: 3.9rem; line-height: 6rem;}
.vip-nav-bottom span a.nav-icon1{ background: url(../images/mall/nav_ico1.png) no-repeat center 0.5rem; background-size:1.78rem;}
.vip-nav-bottom span a.nav-icon3{ background: url(../images/mall/nav_ico3.png) no-repeat center 0.5rem; background-size:1.78rem;}
.vip-nav-bottom span a.nav-icon4{ background: url(../images/mall/nav_ico4.png) no-repeat center 0.5rem; background-size:1.78rem;}
.vip-nav-bottom span a.nav-icon3.cur{ background: url(../images/mall/nav_ico3_cur.png) no-repeat center 0.5rem; background-size:1.78rem;}
.vip-nav-bottom span a.cur{ color: #B20000; font-weight: bold;}

.vip-nav span a.nav-icon4.ico{ position: relative;}
.vip-nav span a.nav-icon4.ico:after{ content: ""; position: absolute; top: 0.3rem; right: 33%; background:#B20000; display: block; width: 0.5rem; height: 0.5rem; border-radius: 100%;}

/* 缓慢显示动画 */
 @keyframes fade-in { 0% {opacity: 0;} 10% {opacity: 0.1} 20% {opacity: 0.2} 30% {opacity: 0.3} 40% {opacity: 0.4} 50% {opacity: 0.5} 60% {opacity: 0.6} 70% {opacity: 0.7} 80% {opacity: 0.8} 90% {opacity: 0.9} 100% {opacity: 1}}  
@-webkit-keyframes fade-in {0% {opacity: 0;} 10% {opacity: 0.1} 20% {opacity: 0.2} 30% {opacity: 0.3} 40% {opacity: 0.4} 50% {opacity: 0.5} 60% {opacity: 0.6} 70% {opacity: 0.7} 80% {opacity: 0.8} 90% {opacity: 0.9} 100% {opacity: 1}} 
#showAnimation { animation: fade-in;animation-duration: 0.35s;-webkit-animation:fade-in 0.35s;}   

