@media print,
screen and (min-width: 750px) {
  .books-detail-container {
    width: 1200px;
    margin: auto;
    padding: 0 90px;
    padding: 30px 90px 18px;
  }

  .books-detail-container .books-detail-info {
    margin-top: 30px;
  }

  .books-detail-container .books-detail-info .content-top:after {
    clear: both;
    content: "";
    width: 0;
    height: 0;
    visibility: hidden;
    display: block;
  }

  .books-detail-container .books-detail-info .content-top-left {
    float: left;
    width: 225px;
    margin-right: 30px;
    margin-top: 26px;
  }

  .books-detail-container .books-detail-info .content-top-left img {
    max-width: 225px;
    max-height: 350px;
    margin: 0 auto;
  }

  .books-detail-container .books-detail-info .content-top-right {
    float: left;
    width: 590px;
  }

  .books-detail-container .books-detail-info .jap-title {
    margin-top: 26px;
    font-size: 35px;
    font-weight: 600;
    color: #323232;
  }

  .books-detail-container .books-detail-info .base {
    font-size: 16px;
    line-height: 27px;
  }

  .books-detail-container .books-detail-info .base:after {
    clear: both;
    content: "";
    width: 0;
    height: 0;
    visibility: hidden;
    display: block;
  }

  .books-detail-container .books-detail-info .base .tit {
    float: left;
    color: #999;
    width: 80px;
    text-align: right;
  }

  .books-detail-container .books-detail-info .base .auth {
    float: left;
    color: #333;
  }

  .books-detail-container .books-detail-info .other-tag {
    height: 50px;
    margin: 15px 0;
  }

  .books-detail-container .books-detail-info .other-tag img {
    height: 100%;
    width: auto;
  }

  .books-detail-container .books-detail-info .tag {
    border-top: 1px solid #eee;
    margin-top: 20px;
    padding-top: 20px;
  }

  .books-detail-container .books-detail-info .tag>ul:after {
    clear: both;
    content: "";
    width: 0;
    height: 0;
    visibility: hidden;
    display: block;
  }

  .books-detail-container .books-detail-info .tag>ul>li {
    float: left;
    padding: 6px 20px;
    font-size: 15px;
    color: #fff;
    background: #c29b73;
    border-radius: 4px;
  }

  .books-detail-container .books-detail-info .tag>ul>li+li {
    margin-left: 10px;
  }

  .books-detail-container .books-detail-info .content-bottom {
    margin-top: 40px;
    font-size: 20px;
    color: #c29b73;
  }

  .books-detail-container .books-detail-desc .books-detail-item {
    padding: 50px 0;
  }

  .books-detail-container .books-detail-desc .books-detail-item:after {
    clear: both;
    content: "";
    width: 0;
    height: 0;
    visibility: hidden;
    display: block;
  }

  .books-detail-container .books-detail-desc .books-detail-item>div {
    float: left;
  }

  .books-detail-container .books-detail-desc .books-detail-item .left {
    width: 150px;
  }

  .books-detail-container .books-detail-desc .books-detail-item .left:after {
    clear: both;
    content: "";
    width: 0;
    height: 0;
    visibility: hidden;
    display: block;
  }

  .books-detail-container .books-detail-desc .books-detail-item .left>span {
    float: left;
    color: #666;
    font-size: 20px;
  }

  .books-detail-container .books-detail-desc .books-detail-item .left .circle {
    width: 14px;
    height: 14px;
    margin: 6px 8px 0 0;
    border-radius: 50%;
    background: #c29b73;
  }

  .books-detail-container .books-detail-desc .books-detail-item .left .circle:before {
    content: " ";
    display: block;
    width: 8px;
    height: 8px;
    margin: 3px 0 0 3px;
    border-radius: 50%;
    background: #fff;
  }

  .books-detail-container .books-detail-desc .books-detail-item+.books-detail-item {
    border-top: 1px solid #D6D7D8;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right {
    width: 750px;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .desc-books {
    margin-bottom: 30px;
    font-size: 16px;
    color: #000000;
    line-height: 26px;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .author {
    color: #323232;
    font-size: 22px;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .desc-author {
    font-size: 16px;
    color: #666;
    line-height: 26px;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .catalog:after {
    clear: both;
    content: "";
    width: 0;
    height: 0;
    visibility: hidden;
    display: block;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .catalog>div {
    float: left;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .catalog .catalog-left {
    margin-right: 15px;
    color: #323232;
    font-size: 16px;
    font-weight: 600;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .catalog .catalog-content {
    width: 621px;
    color: #666;
    font-size: 14px;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .catalog .catalog-content.collapse {
    display: block;
    height: 22px;
    overflow: hidden;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .catalog .catalog-right {
    font-size: 14px;
    color: #3B8BE6;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list:after {
    clear: both;
    content: "";
    width: 0;
    height: 0;
    visibility: hidden;
    display: block;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item {
    float: left;
    width: 175px;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item:after {
    clear: both;
    content: "";
    width: 0;
    height: 0;
    visibility: hidden;
    display: block;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item .img {
    float: left;
    display: flex;
    align-items: flex-start;
    height: 110px;
    width: 68px;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item .img img {
    margin: 0 auto;
    max-height: 110px;
    max-width: 68px;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item .info {
    float: left;
    margin-left: 10px;
    width: 96px;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item .info .tit {
    font-size: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item .info .author {
    color: #999;
    font-size: 12px;
    margin-top: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item+.rel-list-item {
    margin-left: 15px;
  }
}

@media screen and (max-width: 750px) {

  /**
  * 甯у姩鐢荤紪鍐欓€傞厤 
  * 璋冪敤鏂规硶  .keyframes(all,鍔ㄧ敾鍚嶇О,{鍔ㄧ敾鏁堟灉})
  */
  .books-detail-container {
    padding: .36rem .3rem .4rem;
  }

  .books-detail-container .books-detail-info {
    margin-top: .48rem;
  }

  .books-detail-container .books-detail-info .content-top:after {
    clear: both;
    content: "";
    width: 0;
    height: 0;
    visibility: hidden;
    display: block;
  }

  .books-detail-container .books-detail-info .content-top-left {
    float: left;
    width: 2.3rem;
    margin-right: .32rem;
  }

  .books-detail-container .books-detail-info .content-top-left img {
    width: 2.3rem;
  }

  .books-detail-container .books-detail-info .content-top-right {
    float: left;
    width: 4rem;
  }

  .books-detail-container .books-detail-info .jap-title {
    font-size: .35rem;
    font-weight: 600;
    color: #323232;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .books-detail-container .books-detail-info .base {
    font-size: .2rem;
  }

  .books-detail-container .books-detail-info .base:after {
    clear: both;
    content: "";
    width: 0;
    height: 0;
    visibility: hidden;
    display: block;
  }

  .books-detail-container .books-detail-info .base .tit {
    float: left;
    color: #999;
    width: 1.1rem;
    text-align: right;
  }

  .books-detail-container .books-detail-info .base .auth {
    float: left;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 2.9rem;
  }

  .books-detail-container .books-detail-info .base:last-child {
    margin-top: .4rem;
  }

  .books-detail-container .books-detail-info .other-tag {
    margin: .2rem .1rem;
    height: .4rem;
  }

  .books-detail-container .books-detail-info .other-tag img {
    height: 100%;
    width: auto;
  }

  .books-detail-container .books-detail-info .tag {
    border-top: 1px solid #eee;
    margin-top: .20rem;
    padding-top: .20rem;
  }

  .books-detail-container .books-detail-info .tag>ul:after {
    clear: both;
    content: "";
    width: 0;
    height: 0;
    visibility: hidden;
    display: block;
  }

  .books-detail-container .books-detail-info .tag>ul>li {
    float: left;
    padding: 3px 6px;
    font-size: 12px;
    color: #fff;
    background: #c29b73;
    border-radius: 4px;
  }

  .books-detail-container .books-detail-info .tag>ul>li+li {
    margin-left: .10rem;
  }

  .books-detail-container .books-detail-info .content-bottom {
    margin-top: .40rem;
    font-size: .20rem;
    color: #c29b73;
  }

  .books-detail-container .books-detail-desc .books-detail-item {
    padding: .4rem 0;
  }

  .books-detail-container .books-detail-desc .books-detail-item .left {
    margin-bottom: .4rem;
  }

  .books-detail-container .books-detail-desc .books-detail-item .left:after {
    clear: both;
    content: "";
    width: 0;
    height: 0;
    visibility: hidden;
    display: block;
  }

  .books-detail-container .books-detail-desc .books-detail-item .left>span {
    float: left;
    color: #666;
    font-size: .34rem;
  }

  .books-detail-container .books-detail-desc .books-detail-item .left .circle {
    width: 14px;
    height: 14px;
    margin: 6px 8px 0 0;
    border-radius: 50%;
    background: #c29b73;
  }

  .books-detail-container .books-detail-desc .books-detail-item .left .circle:before {
    content: " ";
    display: block;
    width: 8px;
    height: 8px;
    margin: 3px 0 0 3px;
    border-radius: 50%;
    background: #fff;
  }

  .books-detail-container .books-detail-desc .books-detail-item+.books-detail-item {
    border-top: 1px solid #D6D7D8;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right {
    width: 6.8rem;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .desc-books {
    font-size: .24rem;
    color: #323232;
    line-height: .4rem;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .desc-books>p {
    margin-bottom: .2rem;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .author {
    color: #323232;
    font-size: .24rem;
    margin-bottom: .2rem;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .desc-author {
    font-size: 0.24rem;
    color: #323232;
    line-height: .4rem;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .catalog .catalog-left {
    margin: .3rem 0;
    color: #323232;
    font-size: .28rem;
    font-weight: 600;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .catalog .catalog-content {
    color: #323232;
    width: 6.8rem;
    font-size: .24rem;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .catalog .catalog-content.collapse {
    display: block;
    height: .3rem;
    overflow: hidden;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .catalog .catalog-right {
    margin-top: .4rem;
    font-size: .24rem;
    color: #3B8BE6;
    text-align: center;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list:after {
    clear: both;
    content: "";
    width: 0;
    height: 0;
    visibility: hidden;
    display: block;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item {
    float: left;
    width: 3.1rem;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item:after {
    clear: both;
    content: "";
    width: 0;
    height: 0;
    visibility: hidden;
    display: block;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item .img {
    float: left;
    display: flex;
    align-items: flex-start;
    height: 2.2rem;
    width: 1.36rem;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item .img img {
    margin: 0 auto;
    max-height: 2.2rem;
    max-width: 1.36rem;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item .info {
    float: left;
    margin-left: .2rem;
    width: 1.54rem;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item .info .tit {
    font-size: .3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item .info .author {
    color: #999;
    font-size: .24rem;
    margin-top: .3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .books-detail-container .books-detail-desc .books-detail-item .right .rel-list-item:nth-child(2n) {
    margin-left: .5rem;
  }
}