.masonry li{float:left;margin-bottom:1.5rem}
.masonry box{background-color:rgb(255,255,255);position:relative;padding:0;border-top:1px solid rgb(255,255,255)}
.masonry box badge{background:rgba(0,10,30,.1);color:rgba(255,255,255,.8);position:absolute;z-index:1;right:.75rem;top:.75rem;padding:0 .2rem;font-size:.6rem;border-radius:.2rem 0;height:.8rem;line-height:.8rem}
.masonry box badge:empty{display:none}
.masonry box badge.view{background:none;color:rgba(255,255,255,.3)}
.masonry box badge.view:before{font-family:'iconfont';content:'\e73d';margin-right:.2rem}
.masonry figure{position:relative;background-color:rgb(255,255,255)}
.masonry figure a{display:block;position:relative;overflow:hidden}
.masonry figure span{background:rgba(0,10,30,.8);color:rgb(255,255,255);position:absolute;z-index:2;left:0;right:0;bottom:0;padding:.35rem .7rem}
.masonry figure span:empty{display:none}
.masonry figure img{display:block;width:100%}
.masonry.radius figure img{object-fit:cover;transition:all .3s ease;border-radius:0 0 50% 50% /0 0 1rem 1rem}
.masonry figure a:active img{transform:scale(1.05,1.05);border-radius:0}
.masonry intro{padding:1rem;position:relative;z-index:3;line-height:1.5em}
.masonry intro h3,
.masonry intro h4,
.masonry intro h5,
.masonry intro h6{line-height:1.5em;margin:.5rem 0}
.masonry intro h5,
.masonry intro p{line-height:1.5em;opacity:.5}
.masonry intro h6{line-height:1.5em;opacity:.3}
.masonry intro.high h3,
.masonry intro.high h4,
.masonry intro.high h5,
.masonry intro.high h6{height:1.5em;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.masonry intro.high p{height:3em;overflow:hidden}
.masonry intro h3 a,
.masonry intro h4 a{font-weight:700;color:inherit}
.masonry intro price.rmb,
.masonry intro price.cny,
.masonry intro .free{color:rgb(250,50,100)}
.masonry intro unit:before{content:' / 'attr(data-unit)}
.masonry intro .free unit{display:none}
.masonry intro sale{position:absolute;z-index:2;left:0;right:0;top:-2px}
.masonry intro sale:before{content:attr(data-sale);background-color:rgb(250,200,50);position:absolute;top:-.5rem;left:50%;margin-left:-2em;height:1.2rem;line-height:1.2rem;width:4em;color:rgb(255,255,255);box-shadow:0 1px 1px rgba(0,10,30,.2)}
.masonry face{position:absolute;z-index:inherit;width:3.6rem;height:3.6rem;line-height:3.6rem;text-align:center;border-radius:50%;overflow:hidden;top:0;left:50%;margin:-2rem 0 0 -1.8rem;box-sizing:border-box;border:.2rem solid rgb(255,255,255);background:rgb(255,255,255)}
.masonry face img{width:100%;height:100%;object-fit:cover}
.masonry face+h3,
.masonry face+h4,
.masonry face+h5,
.masonry face+h6{margin-top:1rem}
.masonry box.light1 intro:before{content:'\8350';position:absolute;z-index:1;left:50%;top:-.8rem;margin:0 0 0 -.75rem;background:rgb(255,255,255);color:rgb(250,50,100);width:1.5rem;height:1.5rem;line-height:1.5rem;text-align:center;border-radius:50%;box-shadow:0 1px 1px rgba(0,10,30,.2)}
.masonry.book box{padding-bottom:0}
.masonry.book intro{position:absolute;bottom:0;left:0;right:0;background:rgba(0,10,30,.5)}
.masonry.book intro a{color:rgb(255,255,255)}
.masonry.book intro h4{margin:0}
.masonry.book intro p{display:none}
.masonry.disc figure{box-shadow:0 0 1px rgba(0,10,30,.2)}
.masonry.disc box{padding-bottom:0;background:none}
.masonry.disc a.zoomBox:hover,
.masonry.shadow box{box-shadow:0 0 1px rgba(0,10,30,.2)}
.masonry.falt box{background-color:rgb(245,245,245);border-top:none}
.masonry.falt figure{padding:1px 0}
.masonry.cover figure{box-shadow:0 0 1px rgba(0,10,30,.2)}
.masonry.cover figure a{height:0;padding-top:100%;background-position:50% 50%;background-repeat:no-repeat;background-size:cover}
.masonry.cover figure img:first-child{display:none}
.masonry.calc75 figure a{padding-top:75%}
.masonry.calc625 figure a{padding-top:62.5%}
.masonry.gray100 figure a{filter:grayscale(100%)}
.masonry.gray50 figure a{filter:grayscale(50%)}
.masonry.gray100 figure a:hover,
.masonry.gray50 figure a:hover{filter:grayscale(0)}

@media screen and (max-width:768px),screen and (max-width:991px){
.masonry li.col-3,
.masonry li.col-4{width:calc(33.3333% - 1.5rem)}
}

@media screen and (max-width:481px),screen and (max-width:767px){
.masonry box{box-shadow:none}
.masonry li.col-3,
.masonry li.col-4{width:calc(50% - 1rem);padding-left:.5rem;padding-right:.5rem}
.masonry li{margin-bottom:1rem}
.masonry.book intro{padding:.5rem 1rem}
.masonry.book figure,
.masonry.book figure a{height:0;padding-bottom:100%;overflow:hidden}
.masonry.book img{position:absolute;top:-25%}
.masonry img.zoomImg{display:none !important}
.masonry.disc a.zoomBox:hover{box-shadow:none}
}

@media screen and (max-width:480px){
.masonry li.col-3,
.masonry li.col-4{width:100%;padding-left:0;padding-right:0}
.masonry li{margin-bottom:.5rem}	
}