.img_gallery {
    height: 400px;
    overflow: hidden;
    position: relative;
    display: none;
}

.main_img {
    height: 400px;
    overflow: hidden;
    position: relative;
}

.main_img ul {
    width: 9999px;
    height: 400px;
    overflow: hidden;
    position: abs olute;
    top: 0;
    left: 0
}

.main_img li {
    float: left;
    width: 100%;
    height: 400px;
}

.main_img li span {
    display: block;
    width: 100%;
    height: 400px
}

.main_img li a {
    display: block;
    width: 100%;
    height: 400px

}
.main_img li img{
    width: 100%;
    margin-top: 55px;
}
/*.main_img li .img_1 {*/
    /*background: url('../images/15305165575087.jpg') center top no-repeat*/
/*}*/

/*.main_img li .img_2 {*/
    /*background: url('../images/15302600107934.jpg') center top no-repeat*/
/*}*/

/*.main_img li .img_3 {*/
    /*background: url('../images/14533644653506.png') center top no-repeat*/
/*}*/

/*.main_img li .img_4{background:url('../img/img_main_4.jpg') center top no-repeat}*/
/*.main_img li .img_5{background:url('../img/img_main_5.jpg') center top no-repeat}*/
.img_font {
    position: absolute;
    bottom: 30px;
    left: 30%;
    color: #f00;
    width: 100%;
    padding: 10px;
}

.img_font span {
    display: none;
}

div.point {
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999;
    /*width: 140px;*/
    height: 21px;
}

div.point a {
    float: left;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #d4d4d4;
    margin: 0 5px;
    display: block;
    text-indent: -1000px
}

div.point a.on {
    background: #000;
}

#btn_prev, #btn_next {
    z-index: 11111;
    position: absolute;
    width: 73px !important;
    height: 74px !important;
    top: 50%;
    margin-top: -37px;
    display: none;
}

#btn_prev {
    background: url(../img/hover_left.png) no-repeat left top;
    left: 100px;
}

#btn_next {
    background: url(../img/hover_right.png) no-repeat right top;
    right: 100px;
}



.sj-main img{
    max-width: 100%;
    float: left;
}
.sj-main .sj-product{
    float: left;
    width: 100%;
    border: 1px solid #acacac;
}
.sj-main .sj-product .list{
    float: left;
    width: 33.33%;
}
.sj-main .sj-product .list .gif{
    float: left;
    height: 140px;
    width: 100%;
    position: relative;
}
.sj-main .sj-product .list .gif img{
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.sj-main .sj-product .list .pic{
    float: left;
    height: 140px;
    width: 100%;
    position: relative;
}
.sj-main .sj-product .list .pic img{
    display: block;
    width: 100%;
    height: 100%;
}
.sj-main .sj-product .list .pic span{
    position: absolute;
    bottom: 0;
    width: 100%;
    display: block;
    line-height: 28px;
    text-align: center;
    color: #fff;
    font-size: 16px;
    background: rgba(184,184,184,0.9);
}






@media screen and (max-width: 768px){
    .img_gallery{
        display: block;
    }
}
@media screen and (max-width: 414px){
    .img_gallery{
        height: 305px;
        margin-bottom: 60px;
    }
    .main_img{
        height: 280px;
    }
    .main_img ul{
        height: 280px;
    }
    .main_img li{
        height: 280px;
    }
    .main_img li span{
        height: 280px;
    }
    .main_img li a{
        height: 280px;
    }
}

@media screen and (max-width: 375px){
    .sj-main .sj-product .list .gif{
        height: 124px;
    }
    .sj-main .sj-product .list .pic{
        height: 124px;
    }
}
@media screen and (max-width: 320px){
    .sj-main .sj-product .list .gif{
        height: 105px;
    }
    .sj-main .sj-product .list .pic{
        height: 105px;
    }
}