@media (min-width: 24px){
    .content{
        width: 1024px;
        min-width: 1024px;
        margin: 60px auto 0;
    }
    .content-list{
        float: left;
        width: 500px;
        height: 262px;
        background-color: #fff;
        margin:  0 0 60px 0;
    }
    .content-list:hover, .content-list:focus{
        background-color: #efefef;
    }
    .list-singular{
        margin: 0 24px 60px 0;
    }
    .product-image{
        float: left;
        width: 206px;
        height: 206px;
        margin: 28px  0px 0 38px;
    }
    .product-image img{
        width: 206px;
        height: 206px;
    }
    .qrcode{
        float: left;
        width: 254px;
        text-align: center;
    }
    .qrcode h4{
        font-size: 20px;
        color: #000000;
        margin: 32px 0 30px 0;
    }
    .qrcode img{
        width: 145px;
        height: 145px;
    }
}

/*�ƶ�����ʽ*/
@media (max-width: 23px){
    .mb-banner {
        width: 100%;
        border-top: none;
    }
    .mb-banner img{
        width: 100%;
    }
    .content{
        width: 100%;
    }
    .content-list{
        width: 100%;
        float: left;
        border-bottom: 2px solid #DBDBDB;
        padding: 10% 0 10% 0
    }


    .product-image{
        width: 50%;
        float: left;
        text-align: center;
    }
    .product-image img{
        width: 78%;
    }
    .qrcode{
        width: 50%;
        float: left;
        text-align: center;
    }
    .qrcode img{
        width: 54%;
    }
    .qrcode h4{
        font-size: 15px;
        color: #1D8DE4;
        margin: 0 0 18px 0;
    }
}