@import"./苏宁媒体查询.less";
*{
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
}
body{
    background-color: #000;
}
.heard{
    z-index: 100;
    position: fixed;
    top: 0;
    margin-left: -50%;
    // left: 50%;
    margin: 0 auto ;
    width: 23.4375rem;
    height: 2.75rem;
    background-color: transparent;
    &.heardone{
        background-color: rgb(255, 189, 0, 0.8);
    }

    .heard1{
        width: 1.375rem;
        height: 2.1875rem;
        // background-color: red;
        background: url(./苏宁图片/下载.png)no-repeat;
        display:inline-block;
        background-size:100%;
        margin-left: .3125rem;
        margin-top: .3125rem;
    }
    div{
        display: inline-block;
        position: absolute;
        margin-left: .3125rem;
        width: 17.5625rem;
        height: 2.75rem;
        // background-color: red;
        i{
            background: url(./苏宁图片/下载\ \(1\).png)no-repeat;
            position: absolute;
            width: 1.125rem;
            height: 1.125rem;
            top: .76rem;
            left: 1.4rem;
            background-size:100%;
        }

        form{
            position: absolute;
            top: .3125rem;
            width: 17.5625rem;
            height: 2.125rem;
            background-color: transparent;
            border-radius: .925rem;

            input{
                background-color: rgba(255, 255, 255, 0.611);
                width: 17.5625rem;
                height: 2.125rem;
                border-radius: .925rem;
                position: absolute;
                left: .625rem;
                border: 0;
                // top: .3925rem;
            }
        }
    }

    
    .heard3{
        position: absolute;
        right: .625rem;
        top: .6rem;
        text-align: center;
        display: inline-block;
        width: 2.375rem;
        height: 2.1875rem;
        font-size: .8125rem;
        color: white;
        
    }




}

html, body {
    position: relative;
    height: 100%;
  }
  body {
    background: #eee;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: .875rem;
    color:#000;
    margin: 0;
    padding: 0;
  }
  .swiper-container {
    position: relative;
    bottom: 2.75rem;
    width: 23.4375rem;
    height: 11.5rem;
  }
  .swiper-slide {
    text-align: center;
    font-size: 1.125rem;
    background: #fff;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    img{
        width: 23.4375rem;
        height: 11.5rem;
    
    }
  }


  .baokuan{
    margin: 0 auto;
    position: relative;
    bottom: 2.725rem;
    display:flex;
    flex-wrap: wrap;
    width: 23.4375rem;
    height: 9.625rem;
    background-color: rgba(255, 255, 255, 0.452);
}
.baokuan1{
    width: 4.6875rem;
    height: 4.4375rem;
    img{
        margin-left: .9125rem;
        margin-top: .4125rem;
        width: 2.625rem;
        height: 2.625rem;
    }   
    div{
        text-align: center;
    }
}

.sntt{
    width: 21.9375rem;
    margin: 0 auto;
    border-radius: 1.125rem;
    height: 3.5rem;
    position: relative;
    bottom: 1.925rem;
    background-color: aliceblue;
    img{
        width: 2.0625rem;
        height: 2.0625rem;
        // z-index: 110;
        margin-left: 1.095rem;
        margin-top: .625rem;

    }
    .toutiao{
        width: 17.0625rem;
        height: 3.1875rem;
        position: absolute;
        top: 0.15rem;
        right: 0;
        border-top-right-radius: 1.125rem;
        border-bottom-right-radius: 1.125rem;
        .swiper-wrapper{
            .shangxia1{
                width: 18.5625rem;
                height: 3.3875rem;
                // background-color: #e62e2e;
                // display: flex;
                // flex-wrap: wrap;
                i{
                    width: 2.125rem;
                    height: .75rem;
                    font-size: .36rem;
                    position: absolute;
                    left: 0;
                    top: 0;
                    background-color: rgb(255, 113, 13);
                    border-radius: 1.125rem;
                }
                span{
                    width: 11.25rem;
                    height: 1rem;
                    font-size: .48rem;
                    position: absolute;
                    left: 2.3rem;
                    top: 0;

                }
                img{
                    position: absolute;
                    right: 1.5125rem;
                    bottom: 0rem;
                    width: 3.1875rem;
                    height: 3.1875rem;
                    border-top-right-radius: 1.125rem;
                    border-bottom-right-radius: 1.125rem;
                
                }
                .shangxia11{
                    width: 2.125rem;
                    height: .75rem;
                    font-size: .36rem;
                    position: absolute;
                    left: 0;
                    top: 1.625rem;

                }
                .shangxia12{
                    width: 11.25rem;
                    height: 1rem;
                    font-size: .48rem;
                    position: absolute;
                    left: 2.3rem;
                    top: 1.625rem;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    overflow: hidden;
                }
            }

            .shangxia2{
                width: 18.5625rem;
                height: 3.1875rem;
                // background-color: aqua;
                i{
                    width: 2.125rem;
                    height: .75rem;
                    font-size: .36rem;
                    position: absolute;
                    left: 0;
                    top: 0;
                    background-color: rgb(255, 113, 13);
                    border-radius: 1.125rem;
                }
                span{
                    width: 11.25rem;
                    height: 1rem;
                    font-size: .48rem;
                    position: absolute;
                    left: 2.3rem;
                    top: 0;

                }
                img{
                    position: absolute;
                    right: 1.5125rem;
                    bottom: 0rem;
                    width: 3.1875rem;
                    height: 3.1875rem;
                    border-top-right-radius: 1.125rem;
                    border-bottom-right-radius: 1.125rem;
                
                }
                .shangxia11{
                    width: 2.125rem;
                    height: .75rem;
                    font-size: .36rem;
                    position: absolute;
                    left: 0;
                    top: 1.625rem;

                }
                .shangxia12{
                    width: 11.25rem;
                    height: 1rem;
                    font-size: .48rem;
                    position: absolute;
                    left: 2.3rem;
                    top: 1.625rem;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    overflow: hidden;
                }

            }
    
        }
    }
    
}




.newrenlb{
    width: 21.9375rem;
    height: 12.875rem;
    margin: 0 auto;
    position: relative;
    bottom: 1.125rem;
    border-top-left-radius: 1.125rem;
    img{
        width: 21.9375rem;
        height: 5rem;
        margin: 0 auto;
        border-top-left-radius: 1.125rem;
        border-top-right-radius: 1.125rem;

    }
    div{
        display: flex;
        flex-wrap: wrap;
        // font-size: 0;
        width: 21.9375rem;
        height: 7.8125rem;
        background-color: rgb(255, 255, 255,);
        .newrenlb1{
            width: 10.9375rem;
            height: 7.8125rem;
            .newrenlb11{
                width: 5rem;
                height: 1.25rem;
                color: #FF6A0C;
                font-size: .925rem;
                margin-left: .3125rem;
            }
            .newrenlb12{
                width: 9.375rem;
                height: .9375rem;
                color: rgba(255, 105, 12, 0.808);
                font-size: .325rem;
                margin-left: .3125rem;

            }
            img{
                width: 4.375rem;
                height: 4.375rem;
            }
        }
        .newrenlb2{
            width: 5.4375rem;
            height: 7.8125rem;
            .newrenlb21{
                width: 4.6875rem;
                height: 1.25rem;
                color: #e62e2e;
                font-size: .9375rem;
            }
            .newrenlb22{
                width: 4.6875rem;
                height: .9375rem;
                color: #e62e2e;
                font-size: .625rem;
            }
            img{
                width: 4.375rem;
                height: 4.375rem;
            }

        }
        .newrenlb3{
            width: 5.4375rem;
            height: 7.8125rem;
            .newrenlb21{
                width: 4.6875rem;
                height: 1.25rem;
                color: rgba(0, 0, 0, 0.747);
                font-size: .9375rem;
            }
            .newrenlb22{
                width: 4.6875rem;
                height: .9375rem;
                color: rgba(0, 0, 0, 0.356);
                font-size: .625rem;
            }

            img{
                width: 4.375rem;
                height: 4.375rem;
            }

        }
    }
}


.xianshi{
    position: relative;
    width: 21.9375rem;
    height: 7.8125rem;
    background-color: rgba(255, 255, 255, 0.39);
    margin: 0 auto;
    border-top-left-radius: .995rem;
    border-top-right-radius: .995rem;
    .xianshi1{
        display: inline-block;
        position: absolute;
        left: 0;
        width: 10.9375rem;
        height: 7.8125rem;
        background-color:white;
        border-top-left-radius: .995rem;
        .xianshi11{
            width: 10.9375rem;
            height: 1.8125rem;
            border-top-left-radius: .995rem;
            .xianshi111{
                position: absolute;
                left: .8125rem;
                top: .3125rem;
                border-top-left-radius: .995rem;
                width: 4rem;
                height: 1.25rem;
                font-size: 1rem;
            }
            .xianshi112{
                position: absolute;
                top: .4125rem;
                left: 5.8125rem;
                width: 4rem;
                height: 1.25rem;
                color: white;
                background-color: #FF6A0C;
                border-radius: .8125rem;
            }

        }
        .xianshi12{
            width: 5.5rem;
            height: .875rem;
            // background-color: #FF6A0C;
            margin-left: .7125rem;
            font-size: .125rem;
            color: rgba(0, 0, 0, 0.514);
            display: inline-block;
        }
        .xianshi13{
            width: 4.1625rem;
            height: .875rem;
            // background-color: #FF6A0C;
            display: inline-block;
            span{
                font-size: .1875rem;
                border-radius: .325rem;
                background-color: black;
                color: white;
            }
        }
        ul{
            width: 10.9375rem;
            height: 4.0625rem;
            margin-top: .5125rem;
            display: flex;
            flex-wrap: wrap;
            li{
                width: 3.125rem;
                height: 4.0625rem;
                margin-left: .3925rem;
                text-align: center;
                img{
                    width: 3.125rem;
                    height: 3.125rem;
                }
                span{
                    font-size: .625rem;
                    color: #FF6A0C;
                }
            }
        }

    }


    .xianshi2{
        position: absolute;
        right: 0;
        display: inline-block;
        width: 10.7375rem;
        height: 7.8125rem;
        background-color: white;
        border-top-right-radius: .995rem;
        div{
            .xianshi111{
                color: #FF6A0C;
            }
            ul{
                li{
                    margin: 0 auto;
                    span{
                        color: #000;
                    }
                }
            }
        }

    }
    
}

.snlogo{
    width: 3.125rem;
    height: 4.5rem;
    position: fixed;
    right: .0625rem;
    top: 17.25rem;
    z-index: 10000;


    img{
        width: 3.125rem;
        height: 4.5rem;

    }

}
.goodhuo{
    position: relative;
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid rgba(0, 0, 0, 0.256);
    width: 21.9375rem;
    height: 7.8125rem;
    // background-color: #e62e2e;
    margin: 0 auto;
    .goodhuo1{
        width: 5.4375rem;
        height: 7.8125rem;
        background-color: white;
        p{
            font-size: 1.1375rem;
            color: #F840B1;
            margin-left: .3125rem;
            margin-top: .3125rem;
        }
        span{
            color: gray;
            margin-left: .3125rem;
            margin-top: .3125rem;

        }
        img{
            width: 4.375rem;
            height: 4.375rem;
            margin-left: .6125rem;

        }
        div{
          width: 4.375rem;
          height: 1rem;
          font-size: .625rem;
          text-align: center;
          position: absolute;
          bottom: 0;
          left: .3875rem;
          color: #FF6A0C;
        //   margin-bottom: .0625rem;
        }
    }
    .goodhuo2{
        width: 5.4375rem;
        height: 7.8125rem;
        background-color: white;
        border-left: .0625rem solid rgba(128, 128, 128, 0.486);
        img{
            width: 4.375rem;
            height: 4.375rem;
            margin-left: .6125rem;

        }
        p{
            font-size: 1.1375rem;
            color: black;
            margin-left: .3125rem;
            margin-top: .3125rem;
        }
        span{
            color: gray;
            margin-left: .3125rem;
            margin-top: .3125rem;
            font-size: .625rem;

        }
        div{
            width: 4.375rem;
            height: 1rem;
            font-size: .625rem;
            text-align: center;
            position: absolute;
            bottom: 0;
            left: 5.9875rem;
            color: rgba(0, 0, 0, 0.459);
          //   margin-bottom: .0625rem;
          }
  
    }

    .goodhuo3{
        position: relative;
        border-left: .0625rem solid rgba(128, 128, 128, 0.486);
        width: 10.9379rem;
        height: 7.8125rem;
        background-color: rgba(255, 255, 255, 0.479);
    
        .goodhuo31{
            width: 10.9375rem;
            height: 1.8125rem;
            font-size: 1.0375rem;
            padding-left: .3125rem;
            padding-top: .3125rem;
            color: #FF6A0C;
        }
        .goodhuo32{
            width: 9.375rem;
            height: .9375rem;
            font-size: .625rem;
            color: gray;
            margin-left: .3125rem;
        }
        img{
            width: 4.375rem;
            height: 4.375rem;
            margin-left: .4125rem;
            margin-top: .1925rem;
        }
        a{
            p{
                position: absolute;
                bottom: .215rem;
                left: .41rem;
                width: 4.375rem;
                height: 1rem;
                background-color: rgba(128, 128, 128, 0.815);
                color: #000;
                text-align: center;
                line-height: 1rem;
            }
        }
        .goodhuo321{
            position: absolute;
            bottom: .215rem;
            left: 5.42rem;
            width: 4.375rem;
            height: 1rem;
            background-color: rgba(128, 128, 128, 0.815);
            color: #000;
            text-align: center;
            line-height: 1rem;

        }
    }
}

.tad{
    width: 23.4375rem;
    height: 3.125rem;
    position: fixed;
    background-color: rgba(255, 255, 255, 0.699);
    // left: 0;
    bottom:0;
    margin: 0 auto;
    z-index: 199;
    display: flex;
    flex-wrap: wrap;
    .tad1{
        width: 4.6875rem;
        height: 3.125rem;
        img{
            display: block;
            width: 1.75rem;
            height: 1.75rem;
            margin: 0 auto;

            // text-align: center;
        }
        span{
            display: block;
            text-align: center;
            margin: 0 auto;
            width: 4.6875rem;
            height: .875rem;
            font-size: .825rem;
            // color: #FF6A0C;
        }
    }
}