﻿.detailBox{position:relative;width:100%;height:180px;overflow:hidden;z-index:1;background:#ccc;}.detailtop{position:relative;height:45px;z-index:2;text-align:center;line-height:45px;color:#fff;}.detailCover{position:relative;z-index:2;padding:0 20px 20px;color:#fff;}.detailCover *{color:#fff;}.readBtn{width:28%;display:inline-block;height:35px;line-height:35px; background:#f5f5f5;border-radius:6px;text-align:center; margin: 2%; font-size:0.9em;}.readBtn:hover,.on{color:#fff;background:#f66; }.off{color:#666;background:#eee;border:1px solid #ddd;}.detailBoxdesc{margin:0 10px 15px 10px;line-height:22px;font-size:0.8em; color:#666;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}.detailBtnBox{text-align:center;padding:10px 0;}.newest{background:#eee}.free,.vip,.booktag{ text-align:right;float:right; width:18%; font-size:0.7em; line-height:60px;}.free{color:#ccc}.vip,.booktag{color:#f66}.comment_list{padding:0 10px 10px 10px;}.comment_list li{line-height:22px;font-size:0.8em;padding:10px 0; border-top:1px solid #f9f9f9;}.orderBar{line-height:35px;}.orderon{ border-bottom:1px solid #f66; color:#f66; font-size:0.9em}.orderoff{background:#fff;color:#999;font-size:0.9em}.pageBox{line-height:25px;padding:10px 0 20px 0}.pageBox select{height:25px;}.pageBox a,.pageBox span{width:20%;text-align:center;font-size:0.8em}.btn03{color:#fff;border-radius:6px;border:1px solid #fff;display:inline-block;padding:5px 10px;margin:10px 0;background:rgba(0,0,0,.3)}.tabBar .selected{color:#ea390f;border-top:3px solid #ea390f;background:#fff;} .tabBar a{line-height:45px;background:#f5f5f5}.subBlock{background:rgba(0,0,0,.8);color:#fff;font-size:0.8em;line-height:25px;padding:20px;margin-bottom:20px;}.cont{width:80%;margin:200px auto;background:#fff;border-radius:20px;}.wh100{position:absolute;width:200%; height:200%; left:-50%; top:-50%}.detailBoxdesc .tag{ font-size:1em; border-radius:6px; padding:2px 8px; white-space:nowrap}

.orderBtn01,.orderBtn02,.plBtn,.changeBtn{ background:url(../images/newIcons01.png) no-repeat; background-size:16px 120px; padding-left:25px; line-height:20px; font-size:0.9em; color:#999;}

.orderBtn01{ background-position:0 -60px;}
.orderBtn02{ background-position:0 -80px;}
.plBtn{ background-position:0 -40px;}
.changeBtn{ background-position:0 -20px;}



#reward{  position:fixed; width:100%; height:100%; top:0; left:0; z-index:1000;background:rgba(0,0,0,.6); display:none}
#reward div{ width:80%; height:300px; background:#fff; margin:40px auto; text-align:center; padding:20px;}
#reward div{ height:410px; }
#reward h2{ margin-bottom:10px;}
#reward p{ display:block;  margin:15px 0;}
#reward input{ height:40px; width:50%; text-indent:10px; margin-bottom:10px;}
.sendBtn{ border:none; background:#F63; color:#fff; font-size:16px;}
.closeBtn{ border:none; background:#999; color:#fff; font-size:16px;}
#reward textarea{ width:90%; border:1px solid #eee; height:120px; padding:5%; color:#666}
#reward textarea{ height:60px;}

#reward ul{ margin-bottom:10px;}
#reward li{ float:left; width:50%; line-height:40px;}
#reward li span{ font-weight:bold; font-size:18px; border:1px solid #eee; display:block; margin:5px;}
#reward li.sel span{ background:#F63; border:1px solid #F63; color:#fff;}
#reward p{ color:#888; font-size:12px;}
#reward em{ font-style:normal; margin:0 3px; color:#f63;}

/*添加*/
.face{ width:10%; height:40px; overflow:hidden;}
.face img{ width:100%; border-radius:50%;}
.username{ color:#999; margin:0 0 0 10px;}
.repBox{ margin-left:8%; border-left:3px; }
.repBox dt{ padding-left:14px; line-height:18px; border-left:2px solid #eee}
.contText{ line-height:20px; margin:2px 0 5px 10px;}
.contTextHidden{max-height:40px; overflow:hidden;}

.repBtn{ padding:0 5px; border-radius:3px; color:#fff;}
/*新*/
.repBox .username{ margin:0;}

.history_list li{ position:relative; margin:15px; overflow:hidden; zoom:1; background:#f9f9f9;}
.history_list li img{ width:20%; float:left}
.history_right{ width:75%; float:right;}
.history_right span{ display:block;}
.history_t{ font-size:1.1em; color:#000; padding:8px 0}
.history_s{ font-size:0.8em; color:#999;padding:0 0 5px 0}
.history_list li i{position:absolute;right:5%;width:22px;height:22px;top:10px;border-radius:11px;background: url(../images/delete.png) no-repeat center center rgba(0,0,0,.6); background-size:16px 16px;}.history_list li i.update{ background:#F33; color:#fff; width:30px; height:20px; line-height:20px; text-align:center; top:50px; left:0; font-size:0.6em; border-radius:3px;}

/*新*/
.mh_list li{ padding:10px; overflow:hidden; zoom:1; border-top:1px solid #eee;}
.mh_list li .imgs{ height:60px; width:80px; overflow:hidden; display:block;} .imgs img{ height:100%}
.mh_list li a{ display:block; line-height:60px;  font-size:0.8em; padding-left:15px; float:left; text-align:left;}

/*新*/
.gotoCont{display:block;background:url(../images/wode_kouzhan.png) 98% center no-repeat;background-size:10px 15px;line-height:30px; padding:10px 30px 10px 10px; border-top:1px solid #f9f9f9; font-size:0.9em}
.gotoCont span{ color:#999; font-size:0.8em}

.checkComm a{ color:#999; margin-left:10px; display:block; }

/*修改*/
#plBox{position:fixed;width:100%; bottom:0; z-index:10;left:0;background:#fff; overflow:hidden; zoom:1; box-shadow:0 0 3px rgba(0,0,0,.2)}.plForm{width:100%;background:#fff;}.plForm textarea{width:100%;border:none;height:90px;box-shadow:0 0 1px rgba(0,0,0,.2);padding:5%;}#closeit{ color:#999}
#plBox a{ width:49%; text-align:center;border-left:1px solid #fafafa; margin:10px 0}

.lazy {
  opacity: 0;
  transition: opacity .3s ease-in;
  background: #f0f0f0 url('/templates/images/loading.gif') center center no-repeat;
  background-size: 30px;
  min-height: 100px;
}

.lazy.loaded {
  opacity: 1;
  background: none;
}

.lazy.loading {
  background-color: #f0f0f0;
}

/* 添加骨架屏效果 */
.showcontentitem {
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: loading 1.5s infinite;
}

@keyframes loading {
  to {
    background-position: -200% 0;
  }
}