* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}
body {
  margin: 0;
  padding: 0;
  list-style: none;
  background:#fbfbfc;
}
.headTop {
  display: flex;
  justify-content: space-between;
  padding:.625rem;
  /* align-items: center; */
}
#app {
  /* padding: .625rem; */
}
.headTop-left {
  width: 40%;
}
.headTop-right {
  width: 60%;
}
.headTop-left-img{
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.headTop-left-img-p1 {
    width:2.25rem;
    height:1.25rem;
    background:#f0f0f0;
    border-radius:.25rem;
    color:#757575;
    font-size:.75rem;
    text-align: center;
    line-height:1.25rem;
}
.headTop-left-img-p2{
    font-size:1rem;
    color:#151b24;
    font-weight: bold;
    margin-left:.375rem;
}
.headTop-left-img-p3{
    font-size:.75rem;
    border:.0625rem solid #d6d8dd;
    background:#f5f8fa;
    text-align: center;
    line-height:1.125rem;
    border-radius:.25rem;
    color:#7c8593;
    width:7.0625rem;
    margin-top:.3125rem;
}
.headTop-right{
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.headTop-right-item{
    /* width:6.25rem; */
    text-align: center;
}
.headTop-right-item p{
    color:#5a6a7f;
    font-size:.75rem;
    margin-top:.1875rem;
    
}
.margin-right-20{
    margin-right:.9375rem;
}
.arrowImg{
    margin-left:.5rem;
    width:.625rem;
    height:.625rem;
}
.goodItem{
    display: flex;
    justify-content: space-between;
    background:#fff;
    margin-top:.5rem;
    padding:.375rem;
    border-radius:.375rem;
    /* align-items: center; */
}
.itemLeft{
    width:34%;
    height:8rem;
    border-radius:.375rem;
    position: relative;
}
.goodImg{
    width:100%;
    height:8rem;
    border-radius:.375rem;
}
.itemRight{
    width:63%;
    height:8rem;
}
.itemNum{
    width:1.75rem;
    height:1.25rem;
    background:rgba(0,0,0,0.5);
    border-radius:.25rem;
    position: absolute;
    top:0;
    left:0;
    text-align: center;
    color:#fff;
    font-size:.8125rem;
    line-height:1.25rem;
}
.goodBack{
    position: absolute;
    bottom:0;
    left:0;
    width:5rem;
    height:1.625rem;
    background:#fff;
    border-radius:1.5625rem;
    display: flex;
    justify-content: center;
    align-items: center;
}
.goodBack-img{
    width:.75rem;
    height:.75rem;
    margin-right:.1875rem;
}
.goodBack-text{
    font-size:.75rem;
    color:#333;
}
.itemBand .itemTop{
    color:#fff;
    background: #303641;
    border-radius:.25rem;
    font-size:.75rem;
    padding:.125rem .3125rem;
    margin-right:.1875rem;
}
.itemBand{
    overflow: hidden;
    /*超出部分隐藏*/
    text-overflow: ellipsis;
    /*超出部分显示省略号*/
    white-space: nowrap;
    /*规定段落中的文本不进行换行 */
}
.itemName{
    color:#333;
    font-size:1rem;
}
.itemSmall{
    color:#f1312f;
    font-size:.8125rem;
    margin:.3125rem 0;
}
.itemCoupon{
    border-radius:.25rem;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    overflow: hidden;
}
.itemCoupon-text{
    background:#f1312f;
    color:#fff;
    text-align: center;
    font-size:.75rem;
    border:.0625rem solid #f1312f;
    width:34%;
}
.itemCoupon-price{
    font-size:.75rem;
    color:#f1312f;
    padding:0 .25rem;
    /* min-width:22%; */
    text-align: center;
    border-right:.0625rem solid #f1312f;
    border-top:.0625rem solid #f1312f;
    border-bottom:.0625rem solid #f1312f;
    border-top-right-radius:.25rem;
    border-bottom-right-radius:.25rem;
}
.itemPrice{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top:1rem;
}
.itemPrice-left-price{
    color:#f1312f;
}
.itemPrice-left-price span:nth-child(1){
    font-size:.75rem;
}

.itemPrice-left-price span:nth-child(2){
    font-size:1.125rem;
}
.itemPrice-left-price span:nth-child(3){
    font-size:1.25rem;
    font-weight: bold;
}
.itemPrice-sale{
    font-size:.75rem;
    color:#7b8798;
}
.itemPrice-right{
    display:flex;
    justify-content: flex-end;
    height:2.25rem;
    border-radius:.5rem;
    overflow: hidden;
}
.itemPrice-right-img{
    width:50%;
    background:#f5f8fa;
    display: flex;
    justify-content: center;
    align-items: center;
}
.itemPrice-right-img img{
    width:1.5rem;
    height:1.5rem;
}
.itemPrice-right-text{
    background:#f1312f;
    color:#fff;
    font-size:.875rem;
    line-height:2.25rem;
    /* padding:0 .75rem; */
    box-sizing: border-box;
    width:4.375rem;
    text-align: center;
}
.headBottom{
    /* margin-top:.125rem; */
}
.goodList{
    padding:.625rem;
}