html,
body {
  width: 100%;
}
.viewport {
  width: 100%;
  background-color: #edf1f4;
}
.w-top {
  width: 100%;
  height: 14.13333333rem;
  background-color: #fff;
}
.w-picture {
  width: 10.76666667rem;
  height: 13.96666667rem;
  margin: 0 auto;
  padding-top: 0rem;
}
.w-content {
  padding: 0 0.93333333rem;
  padding-top: 1.33333333rem;
  padding-bottom: 3.66666667rem;
  margin-top: 0.66666667rem;
  background-color: #fff;
  font-size: 1.06666667rem;
}
.w-content h4 {
  font-weight: normal;
  padding-bottom: 0.66666667rem;
}
.w-content p {
  line-height: 1.53333333rem;
  /*text-indent: 2em;*/
  padding-bottom: 0.53333333rem;
}
.w-content .w-pubCont {
  padding-bottom: 1.33333333rem;
}
.w-bottom {
  width: 100%;
  height: 3.66666667rem;
  background-color: rgba(255, 255, 255, 0.95);
  box-shadow: 0px -2px 10px rgba(0, 0, 0, 0.3);
  font-size: 1.06666667rem;
  line-height: 3.86666667rem;
  text-align: center;
  position: fixed;
  bottom: 0;
  z-index: 1000;
}
.w-bottom a {
  width: 50%;
  float: left;
  color: #ec660a;
}
.w-bottom a:nth-child(1) {
  border-right: 1px solid rgba(161, 161, 161, 0.5);
  box-sizing: border-box;
}

.w-brief-line {
    width: 2px;
    height: 15px;
    background: #0C95FF;
    margin-right: 3px;
    margin-top: 3px;
}

.clear:after {
    clear: both;
    display: block;
    content: ''
}

.fll {
    float: left;
}

.flr {
    float: right;
}

.w-name-price-box {
    background: #FFF;
    padding: 13px 0 14px 15px;
    margin-top: 0.66666667rem;
}

.w-name {
    font-size: 18px;
    line-height: 22px;
    margin-bottom: 8px;
}

.w-price {
    font-size: 20px;
    color: #FF6000;
    line-height: 20px;
}

.original-price{
    color: #999;
    text-decoration: line-through;
    font-size: .6rem;
}

.w-book-bottom {
    width: 100%;
    height: 48px;
    background-color: rgba(255, 255, 255, 0.95);
    box-shadow: 0px -2px 10px rgba(0, 0, 0, 0.3);
    line-height: 48px;
    text-align: center;
    position: fixed;
    bottom: 0;
    z-index: 1000;
}

.w-book-bottom-inner {
    width: 100%;
    padding: 0 .6rem;
    box-sizing: border-box;
}

.books-home-img {
    width: 24px;
    display: inline-block;
    vertical-align: middle;
}

.buy-now-btn {
    width: 230px;
    height: 38px;
    line-height: 38px;
    background: #FF6000;
    border-radius: 4px;
    color: #fff;
    font-size: 16px;
    vertical-align: middle;
    display: inline-block;
}

.books-home-txt {
    font-size: 16px;
    color: #666666;
    vertical-align: middle;
}

@media screen and (max-width: 320px) {
    .buy-now-btn {
        width: 200px;
        height: 36px;
        line-height: 36px;
    }
}

.buy-book-layer-mask {
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    background: rgba(0, 0, 0, 0.40);
    z-index: 1100;
}

.buy-book-layer {
    background: #FFF;
    position: fixed;
    width: 100%;
    bottom: 0;
    left: 0;
    z-index: 1200;
}

.confirm-buy-btn {
    height: 38px;
    line-height: 38px;
    background: #FF6000;
    border-radius: 4px;
    color: #fff;
    font-size: 16px;
    text-align: center;
    margin: 6px 15px;
    ;
}

.add-icon {
    width: 32px;
    height: 32px;
    display: inline-block;
    vertical-align: middle;
    background: url('../images/add_icon.png');
    background-size: 100% 100%;
}

.gray-add-icon {
    width: 32px;
    height: 32px;
    display: inline-block;
    vertical-align: middle;
    background: url('../images/gray_add_icon.png');
    background-size: 100% 100%;
}

.reduce-icon {
    width: 32px;
    height: 32px;
    display: inline-block;
    vertical-align: middle;
    background: url('../images/reduce_icon.png');
    background-size: 100% 100%;
}

.gray-reduce-icon {
    width: 32px;
    height: 32px;
    display: inline-block;
    vertical-align: middle;
    background: url('../images/gray_reduce_icon.png');
    background-size: 100% 100%;
}

.buy-num-part {
    margin: 6px 15px;
    font-size: 15px;
    color: #333333;
    height: 54px;
    line-height: 54px;
}

.buy-num-txt {
    vertical-align: middle;
    margin: 0 6px;
}