body{
    background: #fff;
}
/* 公共类-版心 */
.banXin{
    width: 1230px;
    margin: 0 auto;
}
/* 公共类-水平+垂直居中 */
.juZhong{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

/* 头部区域 */
#headerBox{
    width: 100%;
    height: 33px;
    background: #f2f2f2;
    border-bottom: 1px solid #e5e5e5;
}
#headerBox .banXin{
    height: 100%;
    /* background: red; */
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #999999;
    font-size: 12px;
}
#login{
    margin: 0 19px;
}

#favorites{margin: 0; 
    padding: 0; 
    box-sizing: 
    border-box; 
    /* background: red; */
}
#favorites ul{list-style: none}
#favorites nav ul{ display: flex;}
#favorites ul div{display: none;}
#favorites li:hover div{display: block;}

/* 头部区域-图标样式 */
#headerBox .icon-sanjiao1{
    font-size: 12px;
}
#headerBox .icon-gouwucheman, 
#headerBox .icon-liebiao1{
    font-size: 14px;
    color: #ff0036;
}
#headerBox .icon-shouji{
    color: #ff0036;
    position: relative;
    top: 3px;
}
#headerRight span:nth-of-type(1){
    margin-right: 19px;
}
#headerRight span:nth-of-type(2){
    margin-right: 20px;
}
#headerRight span:nth-of-type(3),
#headerRight span:nth-of-type(4),
#headerRight span:nth-of-type(5){
    margin-right: 21px;
}
#headerRight span:nth-of-type(6){
    margin-right: 15px;
}
#headerRight span:nth-of-type(7){
    margin-right: 7px;
}
/* 通过伪类选择器去制作竖线 */
#headerRight span:nth-of-type(3)::after{
    content: "";
    display: inline-block;
    width: 1px;
    height: 14px;
    background: #cccccc;
    position: relative;
    left: 12px;
    top: 2px;
}
/* 鼠标移上变颜色 */
.redColor:hover{
    color: #ff0036;
    cursor: pointer; /*鼠标形状：手指*/
}
.pdBox:hover{
    background: #fff;
    padding: 10px;
}
.pdBox:hover b{    
    color: #ff0036;
    text-decoration: underline;
}
/* Logo区域 */
#logoBox{
    height: 131px;
    /* background: red; */
    display: flex;
}
#logoBox img{
    position: relative;
    left: -34px;
}
#logoBox form{
    width: 625px;
    height: 40px;
    /* background: pink; */
    margin-top: 38px;
    margin-left: 75px;
    display: flex;
}
#logoBox input{
    width: 495px;
    height: 100%;
    border: 2px solid #ff0036;
    padding-left: 8px;
}
#logoBox button{
    width: 130px;
    height: 100%;
    background: #ff0036;
    border: none;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
}
/* 导航区域 */
#navBox{
    height: 34px;
    /* background: pink; */
    display: flex;
    line-height: 34px;
}
#navBox p:nth-of-type(1){
    width: 200px;
    background: #ff0036;
    color: #fff;
    padding-left: 14px;
    margin: 0;
}
#navBox img{
    width: 97px;
    height: auto;
    position: relative;
    top: 3px;
}
#navBox p{
    margin: 0 10px;
}
/* Banner海报区域 */
#bannerBox{
    width: 100%;
    height: 502px;
    background: #b50b14 url(./../img/index01-banner2.webp) no-repeat center;
}
#bannerBox .banXin{
    height: 100%;
    display: flex;
    justify-content: space-between;
}
/* 侧边栏区域 */
#asideBox{
    width: 200px;
    height: 100%;
    background: rgba(0,0,0, 0.5);
    color: #fff;
    font-size: 14px;
}
#asideBox .iconfont{
    color: #9b6e70;
    margin-right: 7px;
}
#asideBox p{
    /* margin: 10px auto 8px 13px; */
    height: 31px;
    line-height: 31px;
    padding-left: 10px;
}
/* 小图区域  */
#sPicBox{
    width: 220px;
    height: 100%;
}
#sPicBox div{
    width: 100%;
    height: 235px;
    background: rgba(255,255,255, 0.5);
    margin-top: 10px;
}
#sPicBox div img{
    width: 100%;
    height: auto;
}
/* 内容主体区域 */
#mainBox{
    width: 100%;
    background: #f5f5f5;
}

/* 七夕模块 */
#qiXiBox{
    height: 360px;
    /* background: pink; */
}
#qiXiBox h2{
    height: 90px;
    text-align: center;
    padding-top: 33px;
}
#qiXiBox ul{
    display: flex;
    justify-content: space-between;
}
#qiXiBox li{
    width: 238px;
    height: 270px;
}
#qiXiBox li img{
    width: 100%;
    height: auto;
}
/* 品牌模块 */
#pinPaiBox{
    height: 370px;
    margin: 35px auto 15px;
    /* background: pink; */
    display: flex;
    justify-content: space-between;
}
#pinPaiLeft{
    width: 235px;
    height: 100%;
    background: #fff;
}
#pinPaiCenter, #pinPaiRight{
    width: 485px;
    height: 100%;
    background: #fff;
}
#pinPaiBox h4{
    height: 54px;
    line-height: 54px;
    padding: 0 15px 0 10px;
}
#pinPaiBox .zwTitle{
    font-weight: bold;
    font-size: 18px;
}
#pinPaiBox .ywTitle{
    font-weight: bold;
    font-size: 12px;
    margin-left: 11px;
}
#pinPaiBox .youJT{
    float: right;
    font-size: 12px;
    color: #666697;
}
.youJT .iconfont{
    color: #bbb;
    position: relative;
    top: 1px;
}
#pinPaiBox p{
    width: 100%;
    height: 316px;
    background: url(./../img/index02-07.webp) no-repeat center;
    background-size: cover;
}
#pinPaiCenter p{
    background-image: url(./../img/index02-08.webp);
}
#pinPaiRight p{
    background-image: url(./../img/index02-09.webp);
}
/* Logo列表模块 */
#listBox{
    height: 322px;
    background: #fff;
}
#listBox ul{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}
#listBox li{
    width: 10%;
    height: 108px;
    /* background: pink; */
    display: flex;
    justify-content: center;
    align-items: center;
    border-right: 1px solid #f5f5f5;
    border-bottom: 1px solid #f5f5f5;
    position: relative;
    color: #a99b99;
}
#listBox li img{
    width: 70%;
    height: auto;
}
/* 遮罩层 */
#listBox .hideBox{
    width: 100%;
    height: 100%;
    background: rgba(0,0,0, 0.7);
    position: absolute;
    left: 0;
    top: 0;
    color: #fff;
    opacity: 0;/* 隐藏--透明度 0-1 */
}
.hideBox button{
    width: 63px;
    height: 18px;
    background: #ff0036;
    border: none;
    color: #fff;
    font-size: 12px;
    border-radius: 9px;
    margin-top: 12px;
}
#listBox li:hover .hideBox{
    opacity: 1;
}
/* 天猫超市 */
.chaoShiBox{
    height: 680px;
    /* background: pink; */
    overflow: hidden;
}
.chaoShiBox h4{
    height: 23px;
    margin-top: 24px;
    margin-bottom: 10px;
}
.chaoShiBox h4 img{
    height: 100%;
    width: auto;
}
.chaoShiContent{
    height: 623px;
    width: 100%;
    /* background: yellow; */
    display: flex;
}
.maoTaiBox{
    width: 237px;
    height: 100%;
    /* background: skyblue; */
    position: relative;
}
.maoTaiBox img{
    width: 100%;
    height: auto;
}
.maoTaiBox p{
    width: 197px;
    height: 64px;
    /* background: pink; */
    position: absolute;
    left: 0;
    bottom: 124px;
    display: flex;
}
.maoTaiBox p span{
    display: inline-block;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}
.maoTaiBox p span:first-of-type{
    width: 70px;
    height: 100%;
    background: rgba(0,0,0, 0.7);
}
.maoTaiBox p span:last-of-type{
    width: 127px;
    height: 100%;
    background: rgba(0,0,0, 0.5);
}
.maoTaiBox i{
    position: absolute;
    right: 15px;
    bottom: 15px;
    color: #fff;
    font-size: 33px;
}

.chaoShiList{
    width: 993px;
    height: 100%;
    /* background: yellowgreen; */
    padding-left: 13px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: space-between;
}
.chaoShiList li{
    width: 236px;
    height: 302px;
    background: #fff;
}
.chaoShiList #todayBox{
    width: 484px;
}
#todayBox > div{
    width: 462px;
    height: 282px;
    background: #fff;
/* 盒子阴影 box-shadow: 水平偏移量 垂直偏移量 羽化程度 颜色 inset|outset */
    box-shadow: 0 0 6px rgba(0,0,0, 0.2);
}
#todayBox nav {
    width: 100%;
    height: 57px;
    display: flex;
}
#todayBox nav span{
    width: 50%;
    height: 100%;
    background: #00b262;
    display: inline-block;
    color:#fff;
    text-align: center;
    line-height: 57px;
}
#todayBox nav span:last-of-type{
    background: #f1f1f1;
    color: #000;
}
#jxhz{
    position: relative;
    height: 212px;
}
#zhiPicBox{
    width: 130px;
    height: 180px;
    position: absolute;
    right: 64px;
    top: 20px;
}
#zhiPicBox img{
    width: auto;
    height: 100%;
}
#jtBox{
    width: 257px;
    height: 84px;
    background: #f1f1f1;
    position: absolute;
    left: 0;
    bottom: 52px;
    padding-left: 26px;
}

#jtBox::after{
    content: "";
    position: absolute;
    right: -42px;
    top: 0;
    /* 三角形的做法 */
    width: 0;
    height: 0;
    border-left: 42px solid #f1f1f1;
    border-top: 42px solid transparent;
    border-bottom: 42px solid transparent;
}
#jtBox p:first-of-type{
    font-size: 24px;
    color: #00b262;
    font-weight: bold;
    margin-top: 14px;
    margin-bottom: 12px;
}
#jtBox p:first-of-type img{
    position: relative;
    top: 3px;
}
#jtBox p:last-of-type{
    font-size: 18px;
}
.goodInfo{
    padding: 21px 26px 0px 26px;
}
.goodInfo p:first-of-type{
    width: 185px;
    height: 185px;
}
.goodInfo p:first-of-type img{
    width: 100%;
    height: auto;
}
.goodInfo p:nth-of-type(2){
    width: 140px;
    height: 40px;
    margin: 8px auto 12px;
    text-align: center;
    line-height: 20px;
    overflow: hidden;
}
.goodInfo p:nth-of-type(3){
    text-align: center;
    color: #ff0036;
    font-size: 14px;
}
/* 天猫国际 */
.jinkouBox>div{
    height: 301px; 
    position: relative;
}
.jinkouBox>div:first-of-type{
    margin-bottom: 21px;
}
#zhiYingBox{
    padding-left: 27px;
}
#zhiYingBox p:first-of-type{
    font-size: 18px;
    margin-top: 24px;
    margin-bottom: 10px;
}
#zhiYingBox p:nth-of-type(2){
    color: #7a45e5
}
#zhiYingBox p:nth-of-type(3){
    width: 162px;
    margin: 38px auto 0;
}
#zhiYingBox p:nth-of-type(3) img{
    width: 100%;
    height: auto;
}

/* 底部ICP备案信息 */
#bottomBox {
position:absolute;
left:50%;
bottom:0;
text-align :center;
}