
/* 图片列表 */
.list-picview{font-size: 0;margin:-15px 0 0 0; }
.list-picview li{position:relative;display: inline-block;overflow: hidden; margin:20px 2% 0 0;cursor: pointer; vertical-align: top;}
.list-picview li{width:50%; margin:10px 0 0 0;padding:0 5px 0 0; }
.list-picview li:nth-child(2n) {margin:10px 0 0 0;padding:0 0 0 5px;}
.list-picview li .pic{position:relative;width:100%;padding-top:75%;}
.list-picview li .pic img , .list-picview li .pic .pic-h100{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;}
.list-picview li .pic .pic-h100{text-align: center;}
.list-picview li .pic .pic-h100 img{width:auto;height:100%;max-width:100%;position:static;}
.list-picview li h2{margin:10px 0 20px 0;font-weight:normal;font-size:14px;line-height:150%;padding:0 15px;text-align: center;color:#666;}
/* 图片查看器 */
#pictureViewer{width:100%;height:100%;position:fixed;top:0;left:0;background-color:rgba(0,0,0,.3);z-index:10000}
#pictureViewer>.content{background-color:#f7f7f7;position:absolute;width:80%;height:80%;margin:auto;top:0;right:0;bottom:0;left:0}
#pictureViewer .menu-bar{padding:10px 0 0 0;width:100%}
#pictureViewer .menu-bar .handel{width:30px;height:30px;line-height:30px;text-align:center;float:right;cursor:pointer;background:rgba(0,0,0,.25);color:rgba(255,255,255,.8);border-radius:3px;margin-right:10px;-webkit-transition:all .3s;-moz-transition:all .3s;-ms-transition:all .3s;-o-transition:all .3s;transition:all .3s;}
#pictureViewer .menu-bar .handel i{font-size:14px;margin:0 0 0 3px;}
#pictureViewer .menu-bar .handel:hover{background:rgba(0,0,0,.20);}
#pictureViewer .handel-next,#pictureViewer .handel-prev{display:inline-block;width:36px;height:60px;line-height:60px;background:rgba(0,0,0,.25);color:rgba(255,255,255,.8);position:relative;top:calc(50% - 70px);text-align:center;cursor:pointer;z-index:10009;-webkit-transition:all .3s;-moz-transition:all .3s;-ms-transition:all .3s;-o-transition:all .3s;transition:all .3s;}
#pictureViewer .handel-next,#pictureViewer .handel-prev,#pictureViewer .menu-bar .handel{-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;-khtml-user-select:none;user-select:none;-webkit-touch-callout:none}
#pictureViewer .handel-next i,#pictureViewer .handel-prev i{font-size:20px}
#pictureViewer .handel-next:hover,#pictureViewer .handel-prev:hover{background-color:rgba(0, 0, 0, 0.20);}
#pictureViewer .picture-content{display:inline-block;width:80%;height:calc(100% - 80px);position:absolute;margin:0 auto;left:0;right:0}
#pictureViewer .picture-content .cover{position:absolute;margin:auto;top:0;right:0;bottom:0;left:0}
#pictureViewer .counter{position:absolute;bottom:0;height:40px;line-height:40px;width:100%;text-align:center;color:#999;font-size:13px}
#pictureViewer .hide{display:none}
#pictureViewer .left{float:left}
#pictureViewer .right{float:right}
#pictureViewer .clear-flex{clear:both}
#pictureViewer img{max-width:100%;max-height:100%}

@media screen and (max-width:760px){
.list-screenshot ul li{width:240px;}
#pictureViewer>.content{width:400px;height:400px}
#pictureViewer .handel-next i,#pictureViewer .handel-prev i{font-size:18px}
#pictureViewer .picture-content{width:100%}
}
@media screen and (max-width:520px){
#pictureViewer>.content{width:100%;}
.list-picview{font-size: 0;margin:-10px 0 0 0;}
.list-picview li h2{font-size: 14px;line-height: 21px;height: 21px;}
}
/* 夜间模式 */
body.fuinight #pictureViewer>.content{background: #333;}
body.fuinight #pictureViewer .counter{color:#777;}