
@media screen and (min-width:768px) {
.recommendBox{margin-bottom:16px;overflow: hidden;}
.recommendBox .hd{font-size:16px;color:#4A4F58;font-weight:bold;padding:16px 32px}
#productRecommend{padding:10px;background: #fff}
#productRecommend li{float:left;width:153px !important;height:205px;overflow:hidden;list-style: none;}
#productRecommend li .item{width:153px;height:205px;margin:0 auto;line-height:22px}
#productRecommend li .item a{display:block;width:100%;height:100%;color:#93979F}
#productRecommend li .item a:hover{color:#E15616}
#productRecommend li .item img{display:block;width:100%;height:100%}
#productRecommend li .item span{max-height:44px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
#productRecommend .swiper-wrapper{height:205px;}
#productRecommend .swiper-pagination{width:100%;height:14px;z-index:1;text-align:center;font-size:0;}
#productRecommend .swiper-pagination span{display:inline-block;width:14px;height:4px;border:5px solid transparent;cursor:pointer;opacity:.2;}
#productRecommend .swiper-pagination span:before{content:"";display:inline-block;width:100%;height:4px;background:#E15616;border-radius:2px}
#productRecommend .swiper-pagination span.on{width:28px;opacity:1;}
    .preview-container {
        width: 100%;
        height: auto;
        background-color: #f6f6f6;
        margin-bottom: 20px;
    }

    .preview-container-top {
        width: 100%;
        height: 80px;
        background-color: #FFC684;
        font-size: 30px;
        color: #FFF;
        line-height: 80px;
        text-align: center;
    }

    .inner-container {
        width: 1184px;
        height: auto;
        margin: 0 auto;
    }

    .preview-header {
        padding: 12px;
        background-color: #FFFFFF;
        margin: 10px 0 20px 0;
        overflow: hidden
    }

    .preview-header .preview-banner {
        width: 452px;
        height: 545px;
        float: left;
        position: relative;
    }

    .preview-header .preview-info {
        width: 685px;
        float: right;
        opacity: 0;
    }

    .preview-header .preview-info.active {
        opacity: 1;
    }

    .preview-header .preview-banner-big {
        width: 452px;
        height: 452px;
        float: left;
    }

    .preview-header .preview-banner-big .preview-img {
        width: 100%;
        height: 100%;
        display: block;
    }

    .preview-header .preview-banner-big span {
        display: none;
        position: absolute;
        left: 0;
        top: 0;
        width: 215px;
        height: 215px;
        border: 1px solid #aaa;
        background: rgba(255, 208, 22, 0.4);
        opacity: .5;
        filter: alpha(opacity:50);
        cursor: move;
    }

    .preview-header .preview-banner-small {
        width: 100%;
        height: 98px;
        padding: 10px;
        float: left;
    }

    .preview-header .preview-banner-small .item {
        width: 78px;
        height: 78px;
        margin-right: 9px;
        float: left;
        background-color: #fff;
        cursor: pointer;
        list-style: none;
        opacity: .5;
    }

    .preview-header .preview-banner-small .item:last-child {
        margin-right: 0;
    }

    .preview-header .preview-banner-small .item img {
        width: 100%;
        height: 100%;
        display: block;
        -moz-transition: .5s;
        -webkit-transition: .5s;
        transition: .5s;
    }

    .preview-header .preview-banner-small .item.item-cur {
        border-color: #e15616;
    }

    .preview-header .preview-banner-small .item.item-cur img {
        opacity: 1;
    }

    .preview-header .preview-box {
        display: none;
        overflow: hidden;
        position: absolute;
        right: -555px;
        top: 0;
        width: 548px;
        height: 548px;
        border: 1px solid #e4e4e4;
        z-index: 9999;
        background: #FFFFFF;
    }

    .preview-header .preview-box img {
        width: 1096px;
        height: 1096px;
        margin-right: 10px;
        display: block;
    }

    .preview-info .preview-info-title {
        width: 100%;
        height: auto;
        float: left;
        position: relative;
    }

    .preview-info .preview-info-title .info-p {
        height: auto;
        float: left;
    }

    .preview-info .preview-info-title .info-p.classly {
        font-size: 14px;
        color: #999;
    }

    .preview-info .preview-info-title .info-p.name {
        font-size: 18px;
        color: #333;
        font-weight: bold;
        line-height: 24px;
        height: auto;
        width: 100%;
        margin: 10px 0;
    }

    .preview-info .preview-info-title .info-p.label .label-s {
        font-size: 12px;
        background: #A69DFE;
        color: #fff;
        padding: 5px 10px;
        border-radius: 2px;
        margin: 0 10px 5px 0;
        display: inline-block;
    }

    .preview-info .preview-info-main {
        padding: 16px 20px;
        background-color: #f3f7fe;
        border-radius: 2px;
        float: left;
        margin-top: 15px;
    }

    .preview-info .preview-info-main .info {
        width: 50%;
        height: 30px;
        float: left;
        margin-bottom: 5px;
        line-height: 30px;
    }

    .preview-info .preview-info-main .info .label {
        width: 70px;
        height: 30px;
        float: left;
        display: block;
        font-size: 14px;
        line-height: 30px;
        text-align: right;
        color: #999;
    }
    .preview-info .preview-info-main .info p {
        float: left;
        height: 100%;
        padding-left: 20px;
        color: #4a4f58;
    }
    .preview-bottom .preview-left .preview-tabs-item.active {
        background-color: #e15616;
        color: #FFF;
    }
    .member-detail {
        color: #999999;
        font-size: 14px;
    }
    .loginWithParam {
        color: #FC4444;
        font-size: 14px;
    }
    .recommended-item div {
        width: 152px !important;
        height: 153px;
        margin-top: 10px;
    }
    .recommended-item img {
        width: 100%;
        height: 100%;
    }
    .recommended-item p {
        color: #666666;
    }
    .main {
        width: 1184px;
        margin: 20px auto 0;
    }
    .title {
        line-height: 40px;
        padding-left: 10px;
        margin: 0 auto;
        font-size: 16px;
        color: #333333;
        border-bottom: 1px solid #E15616;
        font-weight: bold;
    }
    .mainContent {
        width: 100%;
        font-size: 0;
    }
    .mainContentLeft {
        width: 100%;
        display: inline-block;
        background-color: #fff;
        vertical-align: top;
    }
    .Disclaimer {
        padding: 20px 10px;
        background-color: #fff;
    }
    .Disclaimer h3 {
        font-size: 14px;
        margin-bottom: 20px;
        color: #333333;
    }
    .Disclaimer p {
        font-size: 14px;
        color: #999999;
        padding: 0 10px
    }
    .contentHtml {
        font-size: 14px;
        padding: 0 20px 10px;
        text-align: left;
        margin: auto;
    }
    .contentHtml div{
        margin: 10px auto;
    }
    .contentHtml img {
        display: block;
        margin: 20px auto 0;
        max-width: 100%;
    }

    .yishou_img {
        position: absolute;
        top: 0;
        right: 0;
        transform: translate(-9%, 7%);
        width: 15%;
        opacity: 0;
    }
    .iconLogo {
        position: absolute;
        left: 0;
        top: 0;
        color: #fff;
        font-size: 14px;
        padding: 5px 12px;
        border-radius: 0 0 10px 0;
    }
    .brandMain {
        position: absolute;
        left: 30px;
        top: 29px;
        width: 90%;
        padding: 15px;
        border: 1px solid #F2F2F2;
        border-radius: 10px;
        background-color: #fff;
        cursor: pointer;
        line-height: 24px;
        letter-spacing: 1.5px;
    }
    .Brand img {
        vertical-align: -1px;
        margin-left: 5px;
    }
    .zheng-graphics {
        position: absolute;
        left: 60px;
        top: -9px;
        width: 15px;
        height: 15px;
        background-color: #fff;
        border: 1px solid rgba(234, 234, 234, 1);
        /*box-shadow: 2px -2px 5px -2px rgba(0, 0, 0, 0.16);*/
        transform: rotate(-45deg);
        border-left: 0;
        border-bottom: 0;
        z-index: 1;
    }
    .brandMain:hover {
        box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .16);
    }
    .brandMain:hover .zheng-graphics {
        box-shadow: 2px -2px 5px -2px rgba(0, 0, 0, 0.16);
    }
    .defaulImg div {
        border: none;
    }

    .show {
        opacity: 1 !important;
    }

    .ercode img {
        opacity: 0;
    }

    .hoverBrand:hover .brandMain {
        display: block;
    }

    .swiper-pagination {
        bottom: 0 !important;
    }

    .preview-header .preview-banner-small .item.addImg {
        border: 1px solid #e15616;
        opacity:1;
    }
    .infotag {
        font-size: 10px;
        width: 58px;
        height: 22px;
        line-height: 22px;
        text-align: center;
        display: inline-block;
        border-radius: 2px;
        flex: auto;
        margin: 0 10px
    }

    .ItemInfo tag {
        display: flex;
    }

    .infotag.news {
        border: solid 1px #f94b4b;
        color: #f94b4b;
        background-color: #fadbdb
    }

    .infotag.brand {
        border: solid 1px #f9a24b;
        color: #f9a24b;
        background-color: #faefdb;
    }

    .infotag.sold {
        border: solid 1px #9aa5b5;
        color: #9aa5b5;
        background-color: #e3ebf7;
    }

    .infotag.other {
        border: solid 1px #1890f9;
        color: #1890f9;
        background-color: #e3ebf7;
    }
    .fave-text{
        color: #f94b4b;
        font-weight: bold;
    }
    .fave-text .big{
        font-size: 20px;
    }

}


/* 移动端*/
@media screen and (max-width:768px){
.inner-container{width: 100%;overflow: hidden;}
#swiperImage .swiper-wrapper .swiper-slide{position:relative;zoom:1;vertical-align:middle;width:100%;overflow:hidden;text-align:center}
#swiperImage .swiper-wrapper img{width:auto;height:100vw;display:block}
#imgShown{width: 100%; height: 100vw;position: relative;background: #fff}
.preview-info{
    box-sizing: border-box;
    padding: 0 3.3vw;
    overflow: hidden;
    background: #fff

}
.preview-info-main{
    box-sizing: border-box;
    padding: 2.8vw;
    font-size: 3.4vw;
    line-height: 7.5vw;
    color: #93979F;
    background: #f3f7fe;
    border-radius: 2px;
    position: relative;
    margin: 3.5vw 0;
    overflow: hidden
}
  .preview-info .preview-info-main .info {
        width: 100%;
        height: 30px;
        float: left;
        margin-bottom: 5px;
        line-height: 30px;
    }

    .preview-info .preview-info-main .info .label {
        width: 70px;
        height: 30px;
        float: left;
        display: block;
        font-size: 14px;
        line-height: 30px;
        text-align: right;
        color: #999;
    }

    .preview-info .preview-info-main .info p {
        float: left;
        height: 100%;
        padding-left: 20px;
    }
    .preview-info-title{
        font-size: 16px;
        color: #22272e;
        padding-top: 15px
    }
    .ercode{
        padding: 2.8vw;
    }
    .ercode img{
        width: 100%;
        height: 100%;
    }
    .main{
        margin-top: 5vw;
        padding: 2.8vw;
        background: #fff
    }
    .Disclaimer span{
       display: block;
       padding: 1.7vw 0;
       text-align: center;
    }
    .Disclaimer P{
        line-height: 6.4vw;
    }
    .contentHtml div{
        margin-top: 2.7vw;
    }
    .contentHtml img{
        width: 100%;
    }
    .info-p.name{
        color: #22272e;
        font-size: 5.6vw;
    }
    .infotag {
        font-size:  0.4vw;
        width: 11.6vw;
        height: 4.8vw;
        line-height:  4.8vw;
        text-align: center;
        display: inline-block;
        border-radius: .48vw;
        flex: auto;
        margin: 0 1.72vw
    }
    .infotag.news {
        border: solid 1px #f94b4b;
        color: #f94b4b;
        background-color: #fadbdb
    }

    .infotag.brand {
        border: solid 1px #f9a24b;
        color: #f9a24b;
        background-color: #faefdb;
    }

    .infotag.sold {
        border: solid 1px #9aa5b5;
        color: #9aa5b5;
        background-color: #e3ebf7;
    }

    .infotag.other {
        border: solid 1px #1890f9;
        color: #1890f9;
        background-color: #e3ebf7;
    }
    .Disclaimer{
        background: #fef6f3;
        border-radius: 2.7vw;
        padding: 2.7vw;
    }
    .main .title{
        padding: 2.7vw 0;
        font-size: 4.27vw;
        color: #22272e
    }
    .contentHtml{margin-top: 2.7vw}
    .fave-text{
            color: #f94b4b;
            font-weight: bold;
        }
    .fave-text .big{
        font-size: 3.7vw;
    }

}
