.albums-list{padding:58px 0; background:;}
.albums-list .list-box{display:block;}
.albums-list .list-box ul{margin:-18px;}
.albums-list .list-box ul:after{display:block; content:''; clear:both;}
.albums-list .list-box ul li{float:left; padding:18px; width:25%;}
.albums-list .list-box ul li a{display:block; cursor:pointer;}
.albums-list .list-box ul li a span{display:block; position:relative; padding-bottom:100%;}
.albums-list .list-box ul li a span>ins{position:absolute; left:0; top:0; right:0; bottom:0; background:url('../box/load.gif') center no-repeat #fefefe;
display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-o-box; display:box; 
-webkit-box-pack:center; -moz-box-pack:center; -ms-flex-pack:center; -o-box-pack:center; box-pack:center; 
-webkit-box-align:center; -moz-box-align:center; -ms-flex-align:center; -o-box-align:center; box-align:center;}
.albums-list .list-box ul li a span>ins>i{display:block; position:relative; width:100%; height:100%; opacity:0;
transition:opacity .28s;
-webkit-perspective:1800px;
-moz-perspective:1800px;
-ms-perspective:1800px;
-o-perspective:1800px;
perspective:1800px;
-webkit-transform-style:preserve-3d;
-moz-transform-style:preserve-3d;
-ms-transform-style:preserve-3d;
-o-transform-style:preserve-3d;
transform-style:preserve-3d;}
.albums-list .list-box ul li a span>ins.on{background:none;}
.albums-list .list-box ul li a span>ins.on>i{opacity:1;}
.albums-list .list-box ul li a span>ins>i:before{display:block; content:''; position:absolute; z-index:6; top:0; right:98%; bottom:0; left:0; box-shadow:0 0 4px rgba(255,255,255,.18);
background:-webkit-linear-gradient(left, rgba(0,0,0,.18), rgba(0,0,0,0));
background:-o-linear-gradient(left, rgba(0,0,0,.18), rgba(0,0,0,0));
background:-moz-linear-gradient(left, rgba(0,0,0,.18), rgba(0,0,0,0));
background:linear-gradient(left, rgba(0,0,0,.18), rgba(0,0,0,0));}
.albums-list .list-box ul li a span>ins>i:after{display:block; content:''; position:absolute; top:0; right:0; bottom:0; left:0; z-index:1; background:#fff; box-shadow:0 2px 12px rgba(0,0,0,.18);}
.albums-list .list-box ul li a span>ins>i>u{display:block; content:''; position:absolute; top:0; right:0; bottom:0; left:0; z-index:2; background:#f8f8f8; box-shadow:0 2px 8px rgba(0,0,0,.18);
-webkit-transform-origin:left; -moz-transform-origin:left; -ms-transform-origin:left; -o-transform-origin:left; transform-origin:left;
-webkit-transition:.28s;
-moz-transition:.28s;
-ms-transition:.28s;
-o-transition:.28s;
transition:.28s;}
.albums-list .list-box ul li a span>ins>i>img{display:block; position:relative; z-index:5; width:100%; height:100%; margin:0 auto; box-shadow:0 2px 4px rgba(0,0,0,.08);
-webkit-transform-origin:left; -moz-transform-origin:left; -ms-transform-origin:left; -o-transform-origin:left; transform-origin:left;
-webkit-transition:.28s;
-moz-transition:.28s;
-ms-transition:.28s;
-o-transition:.28s;
transition:.28s;} 
.albums-list .list-box ul li a:hover span>ins>i>u{
-webkit-transform:rotateY(-21deg);
-moz-transform:rotateY(-21deg);
-ms-transform:rotateY(-21deg);
-o-transform:rotateY(-21deg);
transform:rotateY(-21deg);}
.albums-list .list-box ul li a:hover span>ins>i>img{
-webkit-transform:rotateY(-28deg);
-moz-transform:rotateY(-28deg);
-ms-transform:rotateY(-28deg);
-o-transform:rotateY(-28deg);
transform:rotateY(-28deg);}
.albums-list .list-box ul li a h3{display:block; text-align:center; margin-top:18px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
@media(max-width:992px){
.albums-list .list-box ul li{width:50%;}
}
@media(max-width:767px){
.albums-list{padding:28px 0;}
.albums-list .list-box ul{margin:0;}
.albums-list .list-box ul li{width:100%;} 
}
.albums-list dir{margin-top:18px;}


.filp-book{transition:padding-left .28s; position:fixed; top:0; left:0; width:100%; height:100%; padding:38px 38px 88px 38px;
display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-o-box; display:box; 
-webkit-box-pack:center; -moz-box-pack:center; -ms-flex-pack:center; -o-box-pack:center; box-pack:center; 
-webkit-box-align:center; -moz-box-align:center; -ms-flex-align:center; -o-box-align:center; box-align:center;}
.filp-book:before{position:absolute; top:50%; left:50%; margin:-29px 0 0 -29px; content:attr(loaded); width:58px; height:58px; line-height:58px; text-align:center; font-size:14px; color:#f00;
border-radius:50%; background:#fff no-repeat center url("../box/load.gif");}
.filp-book.active:before{display:none;}
.filp-book>canvas{display:block; max-width:100%; max-height:100%; opacity:0;}
.filp-move{position:absolute; z-index:88888; left:0; top:0; right:0; bottom:0; cursor:move;}
@media(max-width:1200px){
.filp-book{padding:28px 28px 68px 28px;}
}
@media(max-width:767px){
.filp-book{padding:18px 18px 38px 18px;}
}


.filp-slide{position:relative;}
.filp-pages{position:absolute; top:0; right:0; bottom:0; left:0; z-index:88;
-webkit-perspective:2800px;
-moz-perspective:2800px;
-ms-perspective:2800px;
-o-perspective:2800px;
perspective:2800px; 
-webkit-transform-style:preserve-3d;
-moz-transform-style:preserve-3d;
-ms-transform-style:preserve-3d;
-o-transform-style:preserve-3d;
transform-style:preserve-3d;}
.filp-pages>li{background:url('../box/load.gif') center no-repeat #fff !important;}
.filp-pages>li.has{background:none !important;}


@media(min-width:1201px), (orientation:landscape){
.filp-pages{transition:.4s linear;}
.filp-pages:after{display:block; content:''; clear:both;}
.filp-slide.ok .filp-pages{transform:translateX(-25%);}
.filp-slide.over .filp-pages{transform:translateX(25%);}
.filp-pages>li{position:absolute; top:0; right:0; width:50%; display:none; height:100%; visibility:visible; transform-origin:left; }
.filp-pages>li:first-child{position:relative; float:right;}
.filp-pages>li:before{position:absolute; top:0; width:8%; bottom:0; left:0; content:''; z-index:6; 
background:-webkit-linear-gradient(left, rgba(0,0,0,.06), rgba(0,0,0,0));
background:-o-linear-gradient(left, rgba(0,0,0,.06), rgba(0,0,0,0));
background:-moz-linear-gradient(left, rgba(0,0,0,.06), rgba(0,0,0,0));
background:linear-gradient(left, rgba(0,0,0,.06), rgba(0,0,0,0));} 
.filp-pages>li:after{position:absolute; content:''; top:0; right:0; bottom:0; left:0; z-index:8;}
.filp-pages>li>canvas{display:block; width:100%; height:100%;}
.filp-pages>li:nth-child(2n)>canvas{
-webkit-transform:scaleX(-1);
-moz-transform:scaleX(-1);
-ms-transform:scaleX(-1);
-o-transform:scaleX(-1);
transform:scaleX(-1);}
.filp-pages>li:not(.on):nth-child(2n){visibility:hidden; transition:z-index 0s .2s linear, visibility 0s .2s linear, transform .4s linear;}
.filp-pages>li:not(.on):nth-child(2n+1){visibility:visible; transition:z-index 0s .2s linear, visibility 0s .2s linear, transform .4s linear;}
.filp-pages>li.on{
-webkit-transform-origin:left; -moz-transform-origin:left; -ms-transform-origin:left; -o-transform-origin:left; transform-origin:left;
-webkit-transform:rotateY(-180deg);
-moz-transform:rotateY(-180deg);
-ms-transform:rotateY(-180deg);
-o-transform:rotateY(-180deg);
transform:rotateY(-180deg);}
.filp-pages>li.on:nth-child(2n){visibility:visible; transition:z-index 0s .2s linear, visibility 0s .2s linear, transform .4s linear;}
.filp-pages>li.on:nth-child(2n+1){visibility:hidden; transition:z-index 0s .2s linear, visibility .2s linear, transform .4s linear;}
.filp-pages>li.in{display:block; box-shadow:5px 0 6px rgba(0,0,0,.08);}
}
@media(max-width:1200px) and (orientation:portrait){
.filp-pages:after{display:block; content:''; clear:both;}
.filp-pages>li{position:absolute; top:0; left:0; width:100%; height:100%; display:none; visibility:visible; right:0; transition:transform .66s linear; transform-origin:left;}
.filp-pages>li:first-child{position:relative; float:right;}  
.filp-pages>li:before{position:absolute; content:''; top:0; right:0; bottom:0; left:0; z-index:8;}
.filp-pages>li>canvas{display:block; width:100%; height:100%; transition:visibility .22s .22s linear,opacity .22s .22s linear;}
.filp-pages>li.on{transform:rotateY(-261deg); visibility:hidden;} 
.filp-pages>li.on>canvas{visibility:hidden; transition:visibility .22s linear,opacity .22s linear; opacity:.68;}
.filp-pages>li.in{display:block; box-shadow:0 0 8px rgba(0,0,0,.18);}

.filp-move+.filp-slide>.filp-pages>li{display:none;}
.filp-move+.filp-slide>.filp-pages>li:not(.on).in:first-child,
.filp-move+.filp-slide>.filp-pages>li.on.in+li.in{display:block;}
}



.albums-filp{position:fixed; top:0; right:0; bottom:0; left:0; z-index:88888; display:none; background:#fff; background:;}
.albums-filp.active{display:block;}

.filp-close{position:absolute; z-index:9; top:8px; right:8px; z-index:8;}
.filp-close a{font-size:36px; width:38px; height:38px; line-height:38px; border-radius:50%; background:#f8f8f8; cursor:pointer; text-decoration:none; overflow:hidden; transition:.28s; display:block; text-align:center;}
.filp-close a:hover{transform:rotate(180deg);}
@media(max-width:767px){ 
.filp-close a{font-size:28px; width:34px; height:34px; line-height:34px;}
}

.filp-prev{position:absolute; z-index:8; top:50%; left:28px; margin-top:-24px; z-index:8;}
.filp-prev a{font-size:38px; width:48px; height:48px; line-height:48px; padding-right:4px; border-radius:50%; 
background:#f8f8f8; cursor:pointer; text-decoration:none; overflow:hidden; transition:.28s; display:block; text-align:center;}
@media(max-width:767px){ 
.filp-prev{left:8px;}
.filp-prev a{color:#383838; background:rgba(255,255,255,.38); opacity:.38;}
.filp-prev a:hover{opacity:1;}
}

.filp-next{position:absolute; z-index:8; top:50%; right:28px; margin-top:-24px; z-index:8;}
.filp-next a{font-size:38px; width:48px; height:48px; line-height:48px; padding-left:4px; border-radius:50%; 
background:#f8f8f8; cursor:pointer; text-decoration:none; overflow:hidden; transition:.28s; display:block; text-align:center;}
@media(max-width:767px){ 
.filp-next{right:8px;}
.filp-next a{color:#383838; background:rgba(255,255,255,.38); opacity:.38;}
.filp-next a:hover{opacity:1;}
}

.filp-controls{position:absolute; z-index:8; bottom:12px; left:0; overflow:hidden; border-radius:4px; padding:0 6px; box-shadow:0 0 6px rgba(0,0,0,.28); background:#f8f8f8;}
.filp-controls>a{float:left; font-size:15px; width:38px; height:42px; color:#383838; line-height:42px; text-align:center; cursor:pointer;}
.filp-controls>a:first-child{border-left:0;}
.filp-controls>a.on{color:#1880fe; color:#b82828;}
.filp-controls>a.no{color:#a8a8a8;}
.filp-controls>a>i{display:none;}
.filp-controls>a>i:first-child{display:inline-block;}
.filp-controls>a.on>i:first-child{display:none;}
.filp-controls>a.on>i:last-child{display:inline-block;}
.filp-controls>b{float:left; color:#fff; font-weight:normal; height:42px; background:#f1f1f1; }
.filp-controls>b>input{display:block; background:none; border:none; text-align:center; letter-spacing:-.5px; font-size:12px; width:52px; height:42px; line-height:42px;}
.filp-controls>b>input::-webkit-input-placeholder{color:#888;}
.filp-controls>b>input::-moz-input-placeholder{color:#888;}
.filp-controls>b>input::-ms-input-placeholder{color:#888;}
.filp-controls>b>input::focus::-webkit-input-placeholder{color:#f0f0f0;}
.filp-controls>b>input::focus::-moz-input-placeholder{color:#f0f0f0;}
.filp-controls>b>input::focus::-ms-input-placeholder{color:#f0f0f0;} 
.filp-controls .filp_phone{display:none;} 
@media(max-width:767px){  
.filp_list,
.filp_left,
.filp_right,
.filp_full,
.filp-controls>b{display:none;}
.filp-controls .filp_phone,
.filp-controls .filp_share{display:block;}
.filp-controls{padding:0 0 0 4px; width:332px;}
.filp-controls>a{font-size:18px; width:36px; height:46px; color:#383838; line-height:46px; text-align:center; cursor:pointer;}
.filp-controls .fa-phone{font-size:20px;}
}


.filp-qrcode{position:absolute; left:50%; top:50%; text-align:center; width:220px; padding:8px 10px; margin:-150px 0 0 -110px; z-index:18; display:none;}
.filp-qrcode:before{position:fixed; top:0; right:0; bottom:0; left:0; content:''; z-index:12; background:rgba(0,0,0,.18);}
.filp-qrcode:after{position:absolute; background:#fafafa; top:0; right:0; bottom:0; left:0; content:''; z-index:16; box-shadow:0 0 8px rgba(0,0,0,.18);}
.filp-qrcode.active{display:block;}
.filp-qrcode>i{position:absolute; width:24px; height:24px; line-height:24px; text-align:center; background:#fff; z-index:18; 
color:#585885; border-radius:50%; right:-12px; top:-12px; box-shadow:0 0 8px rgba(0,0,0,.18); cursor:pointer;}
.filp-qrcode>i:hover{color:#1880fe; color:#b82828;}
.filp-qrcode>span{display:block; padding-bottom:4px; text-align:center; position:relative; z-index:18;}
.filp-qrcode>div{width:200px; height:200px; box-shadow:0 0 4px rgba(0,0,0,.18); position:relative; z-index:18;}
.filp-qrcode>div>img{display:block; width:100%; height:100%;}
.filp-qrcode>a{display:inline-block; line-height:32px; background:#1880fe; color:#fff; margin:18px 0 8px 0; 
padding:0 12px; border-radius:3px; box-shadow:0 0 4px rgba(0,0,0,.18);  position:relative; z-index:18; background:#b82828;}


.filp-phone{position:absolute; right:18px; bottom:88px; z-index:8; display:none;}
.filp-phone>a{width:48px; height:48px; line-height:48px; text-align:center; box-shadow:0 0 4px rgba(0,0,0,.38); transition:.28s; color:#585858;
border-radius:50%; display:block; font-size:24px; background:#fff; background-image:radial-gradient(rgba(0,0,0,0) 25%,rgba(0,0,0,.08) 100%);} 
@media(max-width:767px){ 
.filp-phone{display:block;}
}


.filp-list{position:fixed; left:-188px; top:0; bottom:0; width:180px; height:100%; overflow:auto; z-index:999; background:#f0f0f0; transition:.28s; box-shadow:0 0 8px rgba(0,0,0,.38);}
.filp-list>i.fa-times{position:fixed; left:-80px; top:18px; width:38px; height:38px; line-height:38px; text-align:center; background:#f0f0f0; border-radius:0 8px 8px 0; 
cursor:pointer; transition:.28s; box-shadow:3px 0 3px rgba(0,0,0,.28); color:#585858;}
.filp-list>i.fa-times:hover{color:#1880fe; color:#b82828;}
.filp-list.active{left:0;}
.filp-list.active>i.fa-times{left:180px;}
.filp-list ul,
.filp-list li{padding:8px; list-style:none; display:block; margin:0;}
.filp-list li canvas{display:block; width:100%; background:#fff no-repeat center url("../box/load.gif"); background-size:28px 28px; border-radius:2px;}
.filp-list a{display:block; border:2px solid #f0f0f0; position:relative; transition:.28s;}
.filp-list li a:before{content:attr(number); position:absolute; right:0; bottom:0; height:22px; width:22px; padding:4px 0 0 4px; line-height:18px; text-align:center; 
font-size:12px; color:#fff; background:rgba(0,0,0,.28); border-top-left-radius:50px;}
.filp-list li:nth-child(2n) a:before{padding:4px 4px 0 0; right:auto; border-radius:0; border-top-right-radius:50px; left:0;}
.filp-list li.on a,
.filp-list a:hover{border-color:#1880fe; border-color:#b82828;}
.filp-list::-webkit-scrollbar{width:8px; height:8px;}
.filp-list::-webkit-scrollbar-thumb{width:8px; height:8px; border-radius:4px; background:#c8c8c8; border:1px solid #fafafa;}
.filp-list::-webkit-scrollbar-thumb:hover{background:#1880fe;  background-color:#b82828;}
.filp-list::-webkit-scrollbar-track-piece{width:8px; height:8px; background:#f0f0f0;}

#filp_music{display:none;}
#copy{position:fixed; top:-888px; left:-888px;}