.product-detail-page {
    $theme-color: #d0021b;

    .m-hide{
        display:none;
    }
    .brand-banner {
        height: 45px;
        width: 100%;

        img {
            display: block;
            height: 45px;
        }

        .opt {
            margin-top: 5px;
        }

        .home {
            display: inline-block;
            width: 32px;
            height: 32px;
            line-height: 32px;
            border: 1px solid #fff;
            text-align: center;
            color: #fff;
            cursor: pointer;
        }

        .brand-fav {
            display: inline-block;
            height: 32px;
            line-height: 32px;
            border: 1px solid #fff;
            padding-left: 10px;
            padding-right: 10px;
            text-align: center;
            color: #fff;
            cursor: pointer;
        }

        .fav-num {
            font-size: 13px;
            color: white;
        }

        .home {
            margin-right: 5px;

            .iconfont {
                font-size: 14px;
            }
        }

        .brand-fav .iconfont {
            font-size: 13px;
        }

        .coled {
            color: #ee0014;
        }
    }

    .path-nav {
        border: none;
        margin-bottom: 0;
    }

    .main {
        width: 1150px;
        min-height: 560px;

        .infos {
            width: 585px;
        }

        .img {
            position: relative;
            width: 420px;
            height: 600px;
        }

        .img-show {
            display: block;
            width: 420px;
            height: 560px;
        }

        .tags {
            position: absolute;
            top: 0;
            left: 0;
        }

        .good-tag {
            float: left;
            box-sizing: border-box;
            height: 22px;
            line-height: 22px;
            color: #fff;
            padding: 0 7px;
            margin-right: 5px;
            font-size: 12px;
        }

        .new-tag {
            background: #78dc7d;
        }

        .renew-tag {
            background: #78dc7e;
        }

        .new-festival-tag {
            width: 72px;
            text-align: center;
            background-image: resolve("product/newPro-icon.png");
            color: #000;
            padding: 0;
        }

        .yep-tag,
        .ymp-tag,
        .sale-tag {
            background: #ff565b;
        }

        .few-tag {
            background: #ffac5b;
        }

        .limit-tag {
            border: 1px solid #4e4e4e;
            color: #4e4e4e;
            background: #fff;
        }

        .presell-tag {
            background: #000;
        }

        .thumbs {
            width: 75px;
            height: 560px;
            margin-left: 10px;
            margin-right: 60px;
            overflow: hidden;
        }

        .thumb {
            display: block;
            width: 71px;
            height: 96px;
            cursor: pointer;
            margin-bottom: 15px;
            border: 2px solid white;

            &.active {
                border: 2px solid black;
            }
        }

        .name {
            font-size: 20px;
            font-weight: bold;
            line-height: 30px;
        }

        .sale-tip {
            display: block;
            font-weight: bold;
            color: $theme-color;
            font-size: 13px;
            line-height: 20px;
            padding-top: 15px;
        }

        .brand-name {
            color: #666;
            font-size: 12px;
        }

        .title {
            color: black;
            font-size: 13px;
            letter-spacing: 5px;
            line-height: 20px;
        }

        .market-price {
        }

        .sale-price {
            margin-top: 8px;
        }

        .price {
            color: #000;
            font-size: 22px;
            line-height: 24px;
            font-weight: bold;
            display: inline-block;
            vertical-align: middle;
        }

        .promotion {
            display: inline-block;
            color: red;
            border: 1px red solid;
            font-size: 12px;
            padding: 2px 4px;
            margin-right: 20px;
        }

        .bundle {
            display: inline-block;
            float: left;
            color: red;
            font-size: 13px;
            padding: 2px 4px;
            margin-top: 6px;
            margin-left: 5px;
            margin-right: 20px;
        }

        .few-sold {
            float: left;
            display: inline-block;
            color: black;
            font-size: 13px;
            padding: 2px 4px;
            margin-top: 6px;
            margin-left: 5px;
            margin-right: 20px;

            i {
                color: red;
            }
        }


        .has-other-price {
            color: #444444;
            text-decoration: line-through;
            font-size: 13px;
            font-weight: normal;
        }

        .arrival-date {

            .date {
                display: inline-block;
                color: #ee0014;
                font-size: 15px;
                font-weight: bold;
                height: 17px;
                padding-top: 3px;
                line-height: 22px;
            }
        }

        .desc {
            display: inline-block;
            height: 22px;
            margin-left: 20px;
        }

        .price-row {
            display: inline-block;
            height: 20px;
            margin-bottom: 16px;
        }

        .promotion-price {
            display: inline-block;
            height: 24px;
        }

        .vip-price {
            line-height: 14px;
            color: #707070;
            font-size: 13px;
            display: inline-block;
            height: 22px;
            vertical-align: top;

            .login-url,
            .cur {
                color: #f02200;
                display: inline-block;
                font-size: 13px;
                padding-top: 3px;
                margin-left: 20px;
                vertical-align: top;
            }

            .unlogin {
                display: inline-block;
                padding-top: 3px;
            }

            .vip-price-item {
                display: inline-block;
                margin-left: 5px;
                vertical-align: top;
                padding-top: 3px;
            }

            .vip-schedual {
                color: #999;
                text-decoration: underline;
                margin-left: 5px;
            }

            .vip-level {
                display: inline-block;
                width: 43px;
                height: 18px;
                margin-right: 10px;
                background: resolve("product/vip.png") no-repeat;
            }

            .vip-level-1 {
                display: inline-block;
                width: 30px;
                height: 18px;
                background: resolve("product/vip-1.png") no-repeat;
            }

            .vip-level-2 {
                display: inline-block;
                width: 30px;
                height: 18px;
                background: resolve("product/vip-2.png") no-repeat;
            }

            .vip-level-3 {
                display: inline-block;
                width: 30px;
                height: 18px;
                background: resolve("product/vip-3.png") no-repeat;
            }

            .title {
                display: inline-block;
                width: 36px;
                height: 24px;
                background: resolve("product/students-price-icon.png") no-repeat;
                color: #fff;
                margin-top: -3px;
            }

            .student-price {
                color: #f02200;
                display: inline-block;
                font-size: 13px;
                padding-top: 3px;
                vertical-align: top;
            }
        }

        .activity-wrapper {
            margin-top: 16px;
            position: relative;
            width: 100%;

            .activity {

                li {
                    margin-bottom: 8px;
                }
            }

            .activity-title {
                height: 22px;
                position: absolute;
                right: 0;
                top: 0;
                font-size: 12px;
                cursor: pointer;
                z-index: 6;

                .index {
                    font-size: 10px;
                }
            }

            .activity-container {
                position: absolute;
                left: 62px;
                top: -10px;
                width: calc(585px - 72px);
                background: #f5f5f5;
                padding: 10px;
                border: 1px solid #e0e0e0;
                z-index: 5;
                display: none;
            }
        }

        .small-coupon-list {

            height: 18px;
            margin-top: 10px;

            .small-pre {
                line-height: 18px;
                font-size: 12px;
                color: #999;
            }

            .small-suf {
                line-height: 18px;
                font-size: 12px;
                color: red;
                margin-left: 8px;
                margin-right: 8px;
            }

            .more-coupon {
                cursor: pointer;
            }

            .small-desc {
                line-height: 18px;
                font-size: 12px;
                color: white;
                margin-left: 8px;
                margin-right: 8px;
                cursor: pointer;
            }

            .small {
                position: relative;
                float: left;
                height: 18px;
                margin-right: 20px;
                margin-left: 5px;
                background-color: #d0021b;
                min-width: 10px;
            }

            .small:before {
                position: absolute;
                display: inline-block;
                content: "";
                top: 0;
                left: -5px;
                width: 5px;
                height: 18px;
                background: url(/product/small-coupon-before.png);
            }

            .small:after {
                position: absolute;
                display: inline-block;
                content: "";
                top: 0;
                right: -5px;
                width: 5px;
                height: 18px;
                background: url(/product/small-coupon-after.png);
            }
        }

        .ac-type {
            display: inline-block;
            width: 70px;
            height: 20px;
            line-height: 20px;
            margin-right: 5px;
            text-align: center;
            background: #b0b0b0;
            color: #fff;
            font-size: 12px;
        }

        .ac-des {
            font-size: 13px;
        }

        .row {
            margin-bottom: 12px;
        }


        .trade-content {
            padding-top: 20px;
            margin-top: 20px;
            border-top: 1px solid #eaeceb;
        }

        .chose-color {
            font-size: 12px;

            .title {
                margin-top: 10px;
            }

            img {
                float: left;
                display: inline-block;
                width: 25px;
                height: 34px;
            }

            ul {
                list-style: none;
                width: 510px;
            }

            li {
                margin-right: 10px;
                cursor: pointer;
                border: 1px solid #999999;
                height: 34px;

                &.focus {
                    border-color: black;
                }
            }

            li.disable {
                opacity: .6;
            }

            .color-name {
                float:left;
                height: 34px;
                line-height: 34px;
                text-align: center;
                margin-left: 8px;
                margin-right: 10px;
            }
        }

        .chose-size,
        .chose-ticket {
            font-size: 12px;

            .title {
                margin-top: 4px;
            }

            margin-bottom: 32px;

            li {
                float: left;
                display: block;
                height: 24px;
                line-height: 24px;
                margin-right: 8px;
                margin-bottom: 5px;
                padding: 0 10px;
                border: 1px solid #999999;
                text-align: center;
                cursor: pointer;
                min-width: 10px;

                &.disable {
                    opacity: 0.5;
                }

                &.focus {
                    color: #fff;
                    background: #222;
                    border: 1px solid #222;
                }
            }
        }

        .size-wrapper {
            width: 510px;
            position: relative;
        }

        .size {
            float: left;
            color: black;
        }

        .size-ruler {
            float: left;
            display: block;
            width: 57px;
            height: 24px;
            background: resolve("product/size-ruler.jpg");
            margin-bottom: 5px;
            cursor: pointer;
        }

        .size-warn {
            position: absolute;
            height: 24px;
            line-height: 24px;
            left: 0;
            bottom: -25px;
        }

        .num-warn {
            float: left;
            height: 24px;
            line-height: 24px;
        }

        .color-size-tip {
            color: #999;
            clear: both;
            line-height: 18px;
        }

        .line {
            width: 100%;
            height: 2px;
            border-bottom: 1px solid #eaeceb;
            margin-top: 20px;
            margin-bottom: 20px;
        }

        .chose-count .title {
            margin-top: 4px;
        }

        .num {
            display: block;
            width: 50px;
            height: 25px;
            line-height: 25px;
            text-align: center;
            border: 1px solid black;
            color: black;
            font-size: 12px;
            margin-left: 5px;
            margin-right: 5px;
        }

        .minus-plus {
            display: block;
            width: 25px;
            height: 25px;
            border: 1px solid #b0b0b0;
            text-align: center;
            cursor: pointer;
            background-color: #e0e0e0;

            i {
                display: block;
                width: 25px;
                height: 25px;
                line-height: 25px;
                font-size: 12px;
                -moz-user-select: none;
                color: black;
            }

            .dis {
                color: #999;
            }
        }

        .minus {
            border-top: 1px solid #eaeceb;
            font-size: 13px;
        }

        .lc-btn {
            float: left;
            display: block;
            width: 80px;
            height: 27px;
            line-height: 27px;
            color: #fff;
            background: #222;
            margin-left: 10px;
            font-size: 12px;
            text-align: center;
            cursor: default;

            &.had-lc,
            &.lc-sold-out {
                background: #ccc;
            }

            &.dis {
                background: #ccc;
            }
        }

        .num-wraper {
            position: relative;
        }

        $arrowTop: 40px;
        $arrow: product/arrow.png;
        $contentW: 220px;

        .lc-container {
            position: absolute;
            top: calc(0 - ($arrowTop - 1px));
            right: calc(0 - (width($arrow) + $contentW));
            z-index: 1;
        }

        .lc-arrow {
            position: absolute;
            top: $arrowTop;
            left: calc(0 - (width($arrow) -1px));
            width: width($arrow);
            height: height($arrow);
            background: resolve($arrow);
        }

        .lc-content {
            box-sizing: border-box;
            width: $contentW;
            height: 285px;
            text-align: center;
            background: #f8f8f8;
            border: 1px solid #cecece;
            padding: 40px 25px 0;

            .qr-code {
                width: 140px;
                height: 140px;
                margin: 0 auto;
            }

            .title {
                font-size: 18px;
                color: #000;
                margin: 12px 0;
                line-height: 24px;
            }

            .sub-title {
                font-size: 14px;
                color: #939290;
            }
        }

        .buy-btn,
        .buy-ticket {
            display: inline-block;
            margin-right: 10px;
            height: 46px;
            line-height: 46px;
            width: 180px;
            text-align: center;
            color: #fff;
            background: $theme-color;
            font-size: 16px;
            cursor: pointer;

            &.hover {
                background: #eb3b19;
                background: rgba(233, 38, 1, 0.8);
            }

            &.dis {
                background: #ccc;
            }
        }

        .buy-now {
            display: inline-block;
            margin-right: 10px;
            height: 44px;
            line-height: 44px;
            width: 180px;
            text-align: center;
            color: black;
            font-size: 16px;
            cursor: pointer;
            border: 1px solid #222;
            background: white;

            &.dis {
                background: #ccc;
                border: 1px solid #ccc;
                color: white;
            }
        }

        .add-to-cart {
            .iconfont {
                font-size: 19px;
                margin-right: 5px;
            }
        }


        .collect-product,
        .keep-shopping {
            display: inline-block;
            width: 120px;
            height: 44px;
            text-align: center;
            line-height: 44px;

            background: #fff;
            color: #222;
            border: 1px solid #ccc;
            font-size: 16px;
            cursor: pointer;

            .iconfont {
                color: #ccc;
                font-size: 19px;
            }

            &.coled .iconfont {
                color: #fa5252;
            }
        }

        .share-row {
            margin-top: 20px;
            height: 16px;

            .title {
                line-height: 16px !important;
            }
        }

        .balance {
            display: none;

            .success-tip {
                color: #222;
                font-size: 18px;
                margin-bottom: 10px;
            }

            .cart-total {
                color: #999;
                font-size: 12px;
            }

            .balance-btns {
                margin-top: 20px;
            }
        }
    }

    .other-infos {
        padding-bottom: 30px;
        border-left: 1px solid #eaeceb;
        border-right: 1px solid #eaeceb;
        border-bottom: 1px solid #eaeceb;
        width: 960px;
        float: left;
        margin-top: 30px;

        .video-player {
            width: 750px;
            height: 420px;
        }

    }


    /**套餐**/
    .package-box {
        margin-top: 30px;
        border: 1px solid #eaeceb;

        .title-header {
            line-height: 45px;
            background-color: #f5f5f5;
            border-bottom: 1px solid #eaeceb;
            text-indent: 20px;
        }

        .package-pro {
            width: 990px;
            margin: 0 auto;
        }

        .spliter {
            width: 50px;
            float: left;
            margin: 0 25px;
            color: #b0b0b0;
            text-align: center;
            font-size: 25px;
            line-height: 196px;
        }

        .good-info {
            margin: 25px 0;
            width: 110px;
        }

        .good-info .good-detail-img {
            width: 100px;
            height: 135px;
            margin: 0 auto;
        }

        .good-info .good-detail-text > .price {
            text-align: center;
            font-weight: bold;
            margin-top: 0;
        }

        .good-info .good-detail-text > a {
            height: 40px;
            margin-top: 5px;
        }

        .package-priceList {
            float: left;
            margin-top: 25px;

            .sale-price {
                text-decoration: line-through;
            }

            .package-price {
                font-weight: bold;
            }

            .save-text {
                margin-top: 15px;
            }

            .buy-product {
                margin-top: 30px;
                border-color: #d42838;
            }

            > p {
                line-height: 30px;
                font-size: 14px;
            }
        }

        .red-color {
            color: #d0021b;
        }
    }


     .fixednav{

       position: fixed;
       top:-30px;
       margin-left: 961px;
     }

     .shoppingCar {
        background-color: #f5f5f5;
        float: left;
        height: 240px;
        width: 186px;
        border-right: 1px solid #eaeceb;
        height: 1000px;
        margin-top: 29px;

        .shoppingCar-btn{

          display:none;
          height: 48px;
          line-height: 45px;
          text-align: center;
          color: #fff;
          background-color: #d0021b;
          font-size: 16px;
          cursor: pointer;

          .iconfont {
              font-size: 22px;
              margin-right: 5px;
          }

          &:hover{
            background: #eb3b19;
            background: rgba(233, 38, 1, 0.8);
          }

            &.disable {
                background: #ccc;
                border: 1px solid #ccc;
                color: white;
            }


        }

        .shoppingCar-nav{
          padding: 20px 30px 0px 30px;

          li{
            display: block;
            font-size: 16px;
            line-height: 36px;
            text-align: center;

            a{
                color: #999;
                font-size: 15px;
             }

            .fixed{
             color: #000;
             font-size: 18px;
            }
          }
        }
     }


      .bottom-tab{

      .bottom-title{
        font-size: 14px;
        display: inline-block;
        padding-bottom: 12px;
        margin: 10px 10px -2px 0;
        font-weight: bold;
        cursor: pointer;
        }

       .bottom-cur{
         border-bottom: 2px solid #000;
       }

       .change{
            float: right;

          .change-icon{
            font-size: 18px;
          }
       }

     }

     #goodsMessage{
       margin-top: 0;
       margin-left: 0;
       margin-right: 0;

       .description-content{
         margin-left: 80px;
         margin-right: 80px;
       }
     }


    .info-block {
        margin-top: 36px;
        margin-left: 80px;
        margin-right: 80px;
        color: #999;
        border-top: 1px solid #e0e0e0;
        font-size: 12px;

        .basic {
            width: 800px;
            margin: 0 auto;

            li {
                float: left;
                width: 200px;
                margin-top: 10px;
                margin-bottom: 10px;
                font-size:14px;

                color: #444;

                .valueSpace {
                   margin-left:7px;
                }

                #desc-color {
                    margin-left:7px;
                    width: 35%;
                    display: inline-block;
                    vertical-align: bottom;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                }
            }
        }


        .comfort {
            width: 510px;
            border: 1px solid #e0e0e0;
            margin: 20px auto;
            padding-bottom: 10px;
            padding-top: 10px;
            color: #444;
            font-size: 14px;

            li {
                margin: 9px auto;
                font-size: 14px;
                text-align: center;
                width: 50%;
            }
        }

        .comfort-block {
            display: inline-block;
            width: 14px;
            height: 10px;
            border: 1px solid #eaeceb;
            margin-right: 2px;

            &.cur {
                background: #444;
                border: 1px solid #444;
            }
        }
    }

    .info-bottom {
      margin: 0px;
    }

     #block-title-head {
       margin-top: 20px;
       margin-bottom: 20px;
     }

      .block-title {
        margin-bottom: 30px;
        margin-top: -16px;
        text-align: center;

        .title-head{
            border-left: 20px solid #fff;
            border-right: 20px solid #fff;

        .title {
            display: inline-block;
            padding-top: 15px;
            font-size: 16px;
            margin-left: auto;
            margin-right: auto;

            &.cur {
                color: #444;
                border: 1px solid #444;
                padding: 7px 28px 6px;
                text-align: center;
                background-color: #fff;
            }

            }

          }

        .sep {
            display: inline-block;
            margin: 0 30px;
            color: #eaeceb;
            font-size: 14px;
            cursor: default;
            font-weight: bold;
        }
    }

    .description-content {
        overflow: hidden;
    }

    .material-content {
        /*display: none;*/
        overflow: hidden;
    }

   .description-material-tab{
     .info-block{
           color: #999;
           font-size: 12px;
           margin-top: 0px;
           border: none;
     }
   }

    .material-detail li {
        position: relative;
        width: 860px;
        min-height: 40px;
        padding-bottom: 20px;
        margin: 0 auto 20px;

        .img-wrap {
            position: absolute;
            top: 50%;
            margin-top: -30px;

            img {
                float: left;
                width: 120px;
                height: 40px;
            }

            .name {
                float: left;
                width: 120px;
                line-height: 20px;
                border-right: 1px dotted #eaeceb;
                color: #000;
                text-align: center;
                font-size: 16px;
            }
        }

        .text {
            float: left;
            width: 538px;
            padding-left: 20px;
            margin-left: 240px;
            line-height: 24px;
            font-size: 14px;
            border-left: 1px solid #eaeceb;
            color: #444;
        }
    }

    .wash {
        text-align: center;

        li {
            display: inline-block;
            padding: 0 20px;
            color: #666;
            border-right: 1px solid #eaeceb;
        }
    }

    .size-info {
        text-align: center;
    }

    .size-table,
    .reference-table{
      width: 100%;
      font-size: 14px;
      color: #666;
      border: 1px solid #e0e0e0;

      thead{
          background-color: #f5f5f5;
          color: #666;
          font-size: 14px;
          border-bottom: 1px solid #e0e0e0;
      }
    }

    .reference-table{

      tbody{

        tr{
          height: 42px;
        }
      }
    }

    .size-table,
    .reference-table,
    .fitting-report-table {
        text-align: center;
        margin: 0 auto 20px;

        th {
            width: 110px;
            text-align: center;
        }

        tr {
            height: 30px;
        }

        tr,
        td {
            text-align: center;
        }

        tbody {
            color: #222;
        }

        .avatar {
            width: 26px;
            height: 26px;
            border-radius: 50px;
        }

        .avatar-col {
            width: 26px;
            padding-left: 20px;
            padding-right: 20px;
        }

        .model-col {
            width: 90px;
        }

        .remark-col {
            width: 200px;
        }
    }

    .fr-img-wrap {
        width: 100%;
        text-align: center;

        img {
            max-width: 100%;
        }
    }

    .ref-model {
        padding-top: 10px;

        .model {
            width: 444px;
            height: 35px;
            padding-top: 47px;
            padding-left: 316px;
            color: #666;
            overflow: hidden;
            margin: 10px auto 0;

            em {
                margin-left: 5px;
            }
        }
    }

    .size-tip {
        color: #999;
        font-size: 14px;
        margin-top: 10px;
        text-align: center;
    }



    .details {
        text-align: center;
        font-size: 12px;
        color: #999;
        line-height: 18px;
    }

    .details-html {
        width: 100%;
        text-align: center;
        margin: 0 auto;

        .details-word{
            font-size: 14px;
            color: #444;
            display: inline-block;
            margin-bottom: 30px;
            line-height: 25px;
        }

        b {
            font-weight: bold;
        }

        i {
            font-style: italic;
        }

        img {
            max-width: 100%;
        }

        .img-responsive {
            width: 100%;
        }
    }

    /*.consults {
        display: none;
    }*/

    .consult-comment .title {
        color: #666;

        &.cur {
            color: #000;
        }
    }

      .cc-content {
        padding: 20px 0px 0px;
        font-size: 12px;

        .comment-star {
            position: relative;
            display: inline-block;
            height: 20px;
            width: 90px;
            cursor: pointer;
            background: resolve("home/star.png") 0 -20px repeat-x;

            .star-1, .star-2, .star-3, .star-4, .star-5{
                position: absolute;
                left:0;
                top:0;
                display:inline-block;
                height:20px;
                width: 18px;

                &.active {
                    background: resolve("home/star.png") repeat-x;
                }
            }
            .star-2{
                width:36px;
            }
            .star-3{
                width:54px;
            }
            .star-4{
                width:72px;
            }
            .star-5{
                width:90px;
            }

            &.editable > span{
                &:hover{
                    background: resolve("home/star.png") repeat-x;
                }
            }
        }

        h2 {
            font-weight: bold;
            font-size: 14px;
            margin-bottom: 10px;
            color: #000;

        }

        li {
            border-top: 1px solid #eaeceb;
            padding: 20px 0;
            min-height: 150px;
        }

        .user-info {
            color: #999;
            line-height: 16px;

            > * {
                float: left;
            }

            .name {
                color: #444;
                font-size: 14px;
            }

            .date {
                color: #bbb;
            }

            .question {
                color: #222;
            }

            &+dl{
                 margin-right: 0;

                dd {
                    width: 100%;
                    margin-right: 0;

                    span{
                        display: inline-block;
                        width: 62px;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                        vertical-align: bottom;
                    }
                }
            }
        }

        .user-avatar {
            width: 30px;
            height: 30px;
            margin-right: 5px;
        }

        .comment-detail{

            .comment-date{
              font-size: 14px;
              color: #b0b0b0;
            }
            .tag-list{
                height:24px;
            }

            .img-preview{
                img {
                    /*width:100%;*/
                }
                .img-thumb{
                    display:inline-block;
                    max-width:70px;
                    max-height:100px;
                    border:2px solid #999;
                    display:block;
                    width:70px;
                    height:100px;
                    border:2px solid white;
                    margin-bottom: 10px;

                    &.active,
                    &:hover{
                        border-color:#000;
                    }

                    img{
                        max-width:70px;
                        max-height:100px;
                        vertical-align: top;
                    }
                }

                .img-detail{
                    padding: 5px 0px 10px 0;
                    font-size: 13px;
                    display:none;

                    .toolbar {
                        dd {
                            display: inline-block;
                            margin-left: 10px;
                            margin-right: 10px;
                            cursor:pointer;
                        }
                    }

                    .img-wrap{
                        max-width:345px;
                        max-height:345px;
                        overflow:hidden;

                        img{
                            max-width:345px;
                            max-height:345px;
                            vertical-align: top;
                        }
                    }
                }

            }
        }

        dl {
            line-height:1.5;
            color: #999;
            margin-right:20px;

            dd {
                margin:0 20px 5px 20px;
            }

            &.horizontal-list{
                dd {
                    float:left;
                    width: 100px;
                    text-align: center;
                }
            }
        }

        .more-wrap {
            text-align: center;
            color: #666;
            border-top: 1px solid #eaeceb;
            padding: 20px 0;
            font-size: 14px;
            font-weight: bold;
            color: #666;
        }

        .btn-wrap {
            padding: 20px 0;
            border-top: 1px solid #eaeceb;
        }

        .load-more {
            cursor: pointer;
        }

        .btn {
            display: block;
            width: 140px;
            height: 32px;
            line-height: 32px;
            color: #fff;
            background: #222;
            text-align: center;
            font-size: 12px;
            margin: 0 auto;
            cursor: pointer;

            .iconfont {
                font-size: 14px;
            }
        }

        .comment,
        .consult {
            margin-top: 10px;
        }
        .comment {
            margin-bottom:10px;
            line-height: 20px;
            font-size: 14px;
            color: #444;
        }

        /*.consults {
            display: none;
        }*/

        &.comments {
            h2 {
                font-size: 14px;
                font-weight:normal;
                color: #666;
                height: 28px;
                float:left;
                padding: 4px 15px 2px 15px;
                line-height: 30px;
                cursor: pointer;
                margin-bottom:0;
                border-top: 1px solid #e0e0e0;
                border-left: 1px solid #e0e0e0;
                border-right: 1px solid #e0e0e0;
                background-color: #eee;

                &.active{
                    margin-bottom: 0px;
                    color:#000;
                    border-top: 2px solid #444;
                    border-right: 1px solid #444;
                    border-left: 1px solid #444;
                    background-color: #fff;
                }
            }

            .user-info {
                color: #999;
                line-height: 16px;
                margin-left: -10px;
                overflow: hidden;
                text-overflow: ellipsis;

                > * {
                    float:none;
                }
            }

            .user-avatar {
                display: block;
                margin: 0 auto 10px auto;
            }
        }
    }

    .new-consult {
        padding: 20px 0;
        border-top: 1px solid #eaeceb;

        textarea {
            width: 590px;
            height: 80px;
            padding: 5px;
            outline: none;
            resize: none;
        }

        .submit-consult {
            display: block;
            width: 140px;
            height: 32px;
            line-height: 32px;
            margin: 8px 0 0;

        }

        .error {
            border-color: #e01;
        }
    }

    .consult-success {
        border-top: 1px solid #eaeceb;
        margin-top: 30px;
        text-align: center;
        padding: 20px 0;

        p {
            width: 295px;
            height: 55px;
            line-height: 55px;
            margin: 0 auto;
            border: 2px solid #222;
            display: block;
            color: #222;
            font-weight: bold;
        }
    }

    .after-service {
        text-align: center;
        margin-top: 30px;
        margin-bottom: 20px;
        border: 1px #e0e0e0 solid;

        .after-service-content {
            display: none;
        }

        .after-service-switch {
            height: 46px;
            border-bottom: 1px #e0e0e0 solid;
            line-height: 44px;
            background: #f5f5f5;
            text-align: center;
            font-size: 15px;
            cursor: pointer;

            .iconfont {
                font-size: 15px;
            }
        }

        .orange {
            color: #f9761a;
        }

        h4 {
            font-weight: bold;
            font-size: 14px;
            line-height: 24px;
            color: #222;
            margin-top: 10px;

            &:first-child {
                margin-top: 0;
            }
        }

        .img-3{
           width: 982px;
           height: 330px;
           margin: 60px auto;
           background: resolve("product/after-service.png");
        }

        a {
            color: #666;
        }
    }

    .support-saleReturned-service {
        $service: product/service.png;

        width: width($service);
        height: height($service);
        margin: 45px auto;
        background: resolve($service);
    }

    .not-support-saleReturned-service {
        $service: product/limit.png;

        width: width($service);
        height: height($service);
        margin: 45px auto;
        background: resolve($service);
    }

    .latest-walk {
        overflow: inherit;
        border-top: none;
        display: none;

        .goods {
            width: 1150px;
            margin: 0 auto;
            height: 410px;
            margin-top: 20px;

            > div {
                float: left;
                width: 222px;
                margin-right: 10px;

                &:nth-child(5n) {
                    margin-right: 0;
                }
            }
        }

        img {
            height: 300px;
            width: 222px;
            display: block;
        }

        .name {
            display: block;
            margin: 15px auto;
            color: #222;
            line-height: 16px;
        }

        .price {
            color: #222;
            font-weight: bold;
            margin-top: 5px;
            text-align: center;
        }

        .market-price {
            margin-right: 5px;
        }

        .has-sale {
            text-decoration: line-through;
            color: #999;
        }
    }

    .warn-tip {
        display: inline-block;
        color: #e01;
        font-size: 12px;

        i {
            font-size: 14px;
        }
    }

    .hot-point-wrap {
        position: relative;
        margin: 0 auto;

        .hot-point {
            position: absolute;
            filter: progid:dximagetransform.microsoft.alpha(Opacity=0); /* IE8 Hack */

            &.hover .pointer {
                background-position: 0 -25px;
            }

            &.hover .hp-good {
                display: block;
            }
        }

        .pointer {
            position: absolute;
            display: block;
            background: resolve("product/hp-num.png") no-repeat 0 0;
            color: #fff;
            cursor: pointer;
            width: 25px;
            height: 25px;
            line-height: 25px;
            text-align: center;
            left: 0;
            top: 0;
            font-size: 18px;
        }

        .hp-good {
            display: none;
            position: absolute;
            left: 30px;
            top: 0;
            width: 210px;
            background: #000;
            height: 60px;
            padding: 10px;

            .pic {
                display: block;
                float: left;
                width: 60px;
                height: 60px;
                margin-right: 10px;
            }

            .info {
                position: relative;
                float: left;
                color: #fff;
                font-size: 12px;
                width: 140px;
                height: 60px;
                line-height: 20px;
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
                text-align: left;
            }

            .check-btn {
                display: block;
                position: absolute;
                height: 18px;
                width: 40px;
                text-decoration: none;
                right: 0;
                bottom: 0;
                text-align: center;
                background: #e8e8e8;
                border-radius: 2px;
            }
        }
    }

    .individual-comment {

        .block-title {

           .sep {
               &+.title {
                  margin-right: 34px;
               }
           }
        }
    }

    .recommend-content {
        position: relative;
        height: 410px;
        overflow: hidden;
        margin-top: 20px;

        .recommend-slider {
            width: 100%;
            box-sizing: border-box;
            height: 410px;
            overflow: hidden;
        }

        ul {
            height: 100%;
        }

        li {
            float: left;
            width: 232px;
            height: 410px;
            overflow: hidden;
        }

        .img-brand-switch {
            display: block;
            display: none;
            a {
                position: absolute;
                top: 50%;
                margin-top: -40px;
                font-size: 24px;
                color: #fff;
                width: 40px;
                height: 32px;
                padding-top: 8px;
                text-align: center;
                background-color: #b0b0b0;

                &.focus {
                    background-color: #444;
                }

                &.prev {
                    left: 0;
                }

                &.next {
                    right: 0;
                }
            }
        }

        .good {
            float: left;
            width: 225px;
            margin-right: 10px;

            a {
                cursor: pointer;

                & > div {
                    background-color: #f4f7f6;
                }
            }

            img {
                display: block;
                width: 222px;
                height: 300px;
            }

            .name {
                display: block;
                max-width: 150px;
                height: 18px;
                line-height: 16px;
                margin: 5px auto;
                color: #222;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }

            .price {
                color: #222;
                font-weight: 700;
                margin-top: 5px;
                text-align: center;
            }

            .market-price {
                color: #999;
                margin-right: 5px;
                text-decoration: line-through;
            }

            .sale-price {
                color: #000;
                font-weight: 700;
            }
        }
    }
}

.coupon-big {
    width: 380px;

    .header {
        font-size: 25px;
        text-align: center;
        margin-bottom: 20px;
        width: 100%;
    }

    .coupon-big-list {
        width: 100%;
        height: 560px;
        overflow: auto;
    }

    .coupon-small-list {
        width: 100%;
        height: 300px;
        overflow: auto;
    }

    .divide-line {
        position: relative;
        height: 1px;
        background-color: #999;
        top: 15px;
        text-align: center;
        margin-right: 60px;
        margin-left: 60px;
        z-index: 1;
    }

    .title {
        position: relative;
        line-height: 30px;
        font-size: 18px;
        color: #999;
        text-align: center;
        background-color: #f8f8f8;
        margin-right: 125px;
        margin-left: 125px;
        text-align: center;
        z-index: 2;
    }

    .pre {
        width: 20px;
        height: 100%;
        float: left;
        font-size: 18px;
        color:white;
        margin-left: 16px;
        margin-right: 20px;
        margin-top: 10px;
    }

    .desc {
        float:left;
        width: 180px;
        margin-left: 20px;
        height: 100%;
    }

    .amount {
        font-size:30px;
        color: white;
        margin-top: 10px;
        text-align: left;
    }

    .rule {
        font-size: 15px;
        color: white;
        line-height: 30px;
        text-align: left;
    }

    .status {
        float:left;
        width: 70px;
        margin-left: 10px;
        height: 100%;
        cursor: pointer;
    }

    .coupon-status {
        margin-top: 12px;
        width: 100%;
        text-align: center;
        color: white;
        font-size: 20px;
        margin-bottom: 10px;
    }

    .coupon-go {
        width: 100%;
        text-align: center;
        color: white;
        font-size: 20px;
    }

    .coupon-btn {
        display: inline-block;
        heigth: 15px;
        font-size: 10px !important;
        line-height: 15px;
        color: #cf021b;
        padding: 1px 10px;
        background-color: white;
    }

    .item-bg {
        width: 341px;
        height: 75px;
        background: resolve("product/coupon-big.png") no-repeat;
        margin: 20px auto;
    }
}
     .common-consults{

       margin: 10px auto;

       .common-question{
             width: 100%;
             font-size: 14px;
             margin : 30px auto;


           &.input {
               width: 100%;
               font-size: 14px;
               padding-top: 30px;
               margin: 0;
           }

             textarea{
                width: 770px;
                height: 70px;
                padding: 0;
                outline: #e0e0e0;
                resize: none;
                background-color: #fff;
                border: 1px solid #e0e0e0;
                font-size: 14px;
                padding: 15px;
             }

             .err{
               border: 1px solid #e01;
             }


             .btn{
                display: block;
                padding: 0;
                width: 100%;
                height: 38px;
                line-height: 38px;
                color: #000;
                background: #f5f5f5;
                text-align: center;
                font-size: 14px;
                margin: 0 auto;
                cursor: pointer;
                margin-top: -2px;
                border: 1px solid #e0e0e0;
             }


            span{
               display:block;
               margin-top:15px;
               line-height: 20px;
               font-family: initial;

               i{
                 margin-right: 8px;
                 /*color: #000;*/
                 font-size: 18px;
                }

                .leave-message{
                  color: #000;
                }

             }

             .top-question{
               color: #000;
               font-size: 14px;

               .right-time{
                 display: inline-block;
                 float: right;
                 color: #999;
               }

         }


          .common-advice{
            color:#d0001b;

            .advice{
              color:#d0001b;
            }

          }

         a{
            color:#d0001b;
            cursor: pointer;
         }

          .common-message{
            border-bottom: 2px solid #ccc;
            min-height: 30px;
          }

         .common-zan{
           border-bottom: 1px solid #e0e0e0;

           height: 100px;

           .zan-content{
             margin: 0 auto;
             width: 60%;
             text-align: center;
             padding-top: 30px;

             span{
               display: inline-block;
               width: 49%;

               i{
                 color: #ccc;
                 cursor: pointer;
                 font-size: 20px;
               }

               .getzan{
                 color:#d0001b;
                 font-size: 22px;
               }

              }

              .icon-border{
                border-right: 2px solid #eaeceb;
              }

           }

         }

      }

       .buy-consults{
         border-top: 1px solid #e0e0e0;
         margin-top: 45px;

         .block-title {
           margin-bottom: 30px;
           margin-top: -18px;
           text-align: center;

           .title-head{
               border-left: 20px solid #fff;
               border-right: 20px solid #fff;

           .title {
               display: inline-block;
               font-weight: bold;
               font-size: 14px;
               margin-left: auto;
               margin-right: auto;

               &.cur{
                   color: #fff;
                   border: 1px solid #000;
                   padding: 8px 26px;
                   text-align: center;
                   background-color: #444;
                   font-weight: 100;
               }
             }
           }
         }
       }

     }

     #judge{
       margin: 30px 80px 10px 80px;


       .judge-content{
         background-color: #fff;

         .pull-right{
           color: #444;
           font-size: 14px;
         }

         .img-4{
           width: 135px;
           height: 200px;
           margin: 60px auto;
           background: resolve("product/no-comment-pic.png");
           background-size: 135px;
           background-repeat: no-repeat;

           .img-4-message{
            text-align: center;
            padding-top: 130px;
            padding-left: 18px;
            width: 100px;
            font-size: 18px;
            color: #444;
            height: 40px;
            display: inline-block;
           }
         }

         .msg-pager{
          text-align: center;
          margin: 10px auto;

         }
       }

       .comment-tabs{
            padding-top: 12px;
            border-bottom: 1px solid #444;
            height: 35px;
       }

     }

     .judge-head{


        span{
          display: inline-block;
          margin-right: 20px;

        }

        .name{
          vertical-align: top;
          line-height: 20px;
          font-size: 16px;
        }

     }

     .total-content{
       position: relative;
     }

.buy-product {
    display: inline-block;
    width: 120px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    border: 1px solid;
    cursor: pointer;
}

.chose-color {
    font-size: 12px;

    .title {
        margin-top: 14px;
    }

    img {
        float: left;
        display: inline-block;
        height: 34px;
        width: 25px;
    }

    li {
        margin-bottom: 5px;
        margin-right: 10px;
        cursor: pointer;
        border: 1px solid #eaeceb;
        height: 34px;

        &.focus {
            border-color: black;
        }

        &.disable {
            opacity: 0.5;
        }
    }

    .color-name {
        float:left;
        height: 34px;
        line-height: 34px;
        text-align: center;
        margin-left: 5px;
        margin-right: 5px;
    }
}

.chose-size,
.chose-ticket {
    font-size: 12px;

    .title {
        margin-top: 3px;
    }

    li {
        float: left;
        display: block;
        height: 24px;
        line-height: 24px;
        margin-right: 10px;
        padding: 0 5px;
        border: 1px solid #eaeceb;
        text-align: center;
        cursor: pointer;
        min-width: 28px;

        &.disable {
            opacity: 0.5;
        }

        &.focus {
            color: #fff;
            background: #222;
        }
    }
}

/****放大镜****/
.magnifier {
    &.move-object {
        height: 135px;
        width: 135px;
        background: resolve("product/move.png") no-repeat;
        top: 0;
        right: 0;
        position: absolute;
    }

    &.max {
        width: 558px;
        height: 558px;
        border: 2px solid #b0b0b0;
        background: white;
        display: block;
        position: absolute;
        overflow: hidden;
        left: 515px;
        top: 0;
        z-index: 100;
    }

    &.move-over {
        position: absolute;
        width: 420px;
        height: 560px;
        z-index: 2;
        top: 0;
        left: 0;
        background: resolve("product/transparent.gif");
    }
}

/****套餐弹出框***/
.pkg-dialog {
    width: 500px;
    max-height: 680px;
    padding: 20px 20px 0 20px;
    border-color: rgba(0,0,0,.6);

    .pkg-close {
        position: relative;
        top: 0;
        right: 0;
    }

    .pkg-close .iconfont {
        font-size: 35px;
        line-height: 40px;
        font-weight: normal;
    }

    .pkgDg-header {
        height: 50px;
        line-height: 50px;
        text-align: left;
        font-size: 16px;
        font-weight: 600;
    }

    .pkgDg-prodetal {
        width: 100%;
        max-height: 490px;
        padding-bottom: 80px;
        overflow: auto;
    }

    .pkg-product {
        border: 1px solid #ddd;
        padding: 15px;
        margin-bottom: 15px;

        .pkg-proImg {
            float: left;
            width: 85px;
            height: 109px;

            > img {
                width: 100%;
                height:100%;
            }
        }

        .chose-color .title {
            font-size: 13px;
        }

        .chose-size .title {
            margin-top: 6px;
        }

        .chose-size li {
            margin-bottom: 5px;
        }

        .type-chose {
            float: left;
            width: 350px;
            margin-left: 15px;

            .pkg-colors, .pkg-sizes {
                width: 275px;
                font-size: 13px;
            }
        }

        .row {
            margin-bottom: 15px;
        }

        .chose-done {
            font-size: 13px;
            text-align: left;

            .pkg-size {
                margin-left: 15px;
            }
        }

        .warn-tip {
            color: red;
        }
    }

    .pkgDg-footer {
        height: 80px;
        line-height: 80px;
        width: 500px;
        background: #f8f8f8;
        position: absolute;
        bottom: 0;

        .totalMoney em {
            color: #d0021b;
            font-size: 20px;
            font-weight: bold;
        }

        .buy-product {
            margin-top: 25px;
        }
    }

    .pkgDg-footer:before {
        position: absolute;
        left: -20px;
        content: '';
        display: block;
        width: 540px;
        border-top: 1px solid #ddd;
    }
}

.consults-pager {
  .msg-pager {
    text-align: center;
    margin: 0 auto;
  }
}

.notify-goods-wrapper {
    .ring {
        color: #d42838;
        font-size: 32px;
    }

    .title {
        font-size: 22px;
        font-weight: bold;
    }

    .content {
        font-size: 12px;
        line-height: 20px;
        margin-top: 20px;

        .qr-img{
            display: inline-block;
            width: 100px;
            height: 100px;
            background: resolve("layout/qr.png");
            background-size: 100px;
        }
    }

    .checked {
        font-size:12px;
        color: black;
    }

    .row {
        height: 33px;
        margin-bottom: 30px;
        margin-top: 20px;

        .ok {
            display: inline-block;
            background-color: #d42838;
            color: white;
            width: 130px;
            height: 33px;
            font-size: 15px;
            line-height: 33px;
            margin-right: 20px;
            cursor: pointer;
        }

        .ok2 {
            display: inline-block;
            background-color: black;
            color: white;
            width: 150px;
            height: 33px;
            font-size: 15px;
            line-height: 33px;
            margin-right: 20px;
            cursor: pointer;
        }

        .cancel {
            display: inline-block;
            border: 1px solid black;
            width: 130px;
            height: 33px;
            font-size: 15px;
            line-height: 33px;
            cursor: pointer;
        }
    }



}


     .consult-alert{
        width: 500px;
        background-color: #fff;
      .content{

        .consult-head{
          margin: 20px auto;

          i{
            color: #ff0000;
            font-size: 18px;
          }

          span{
            font-size: 20px;
            margin-left: 10px;
          }
        }

        .consult-qr{
           margin: 30px auto;
           div{
             display: inline-block;
           }

          .qr-img{
            width: 100px;
            height: 100px;
            background: resolve("layout/qr.png");
            background-repeat: no-repeat;
            background-size: 100px;
          }

          .qr-line{
            width: 40px;
            height: 100px;
            background: resolve("product/qr-line.png");
            background-repeat: no-repeat;
            background-size: 40px, 100px;
          }

          .learn-more{

            .downapp{
              position: relative;
              top: -45px;
            }

            .learn-content{
              position: relative;
              top: -15px;
            }
          }


        }
      }

      .btns{

        #dialog-consult-sure{
        line-height: 40px;
        width: 180px;
        height: 40px;
        background-color: #d0021b;
        border: none;
       }
      }
    }

.img-responsive {
    display: block;
    height: auto;
    max-width: 100%
}