.template-group-list{font-size:18px;display:flex;justify-content:space-around;padding-bottom:30px}.group-item{color:#595757;cursor:pointer;line-height:50px}.group-item.active{color:#ff6055}.template-item{width:220px;display:inline-block;margin-right:25px;margin-bottom:20px;box-shadow:1px 5px 10px 0 #dad7d7;border-radius:6px}.template-wrapper{position:relative;border-radius:6px;overflow:hidden;transition:all .3s linear}.button,.id,.mask{position:absolute}.template-wrapper:hover{transform:translateY(-10px)}.mask{left:0;right:0;bottom:0;top:0;background:0 0;transition:background .3s linear}.mask:hover{background:rgba(0,0,0,.5)}.mask:hover .button{opacity:1}.id{font-size:14px;color:#fff;line-height:24px;left:0;top:10px;padding:0 10px 0 6px;background:rgba(0,0,0,.3);border-radius:0 24px 24px 0}.button{opacity:0;top:50%;left:50%;transform:translate(-50%,-50%);font-size:14px;color:#fff;background:#f7745e;padding:7px 16px;border-radius:30px;cursor:pointer;transition:all .3s linear}.template-item:nth-child(5n){margin-right:0}.template-item .title{text-align:center;line-height:28px}@media (min-width:1000px){.template-item:nth-child(5n){margin-right:0}.template-list{width:1200px}.template-item img{height:416px;width:220px}}@media (max-width:999px){.template-list{width:100%}.template-item{width:46%;margin-left:2%;margin-right:2%}.template-item img{height:86vw;width:100%}.template-group-list{flex-wrap:wrap;margin-top:20px;padding-bottom:10px}.group-item{margin-right:10px;line-height:40px;font-size:14px}.template-item:nth-child(2n){margin-right:0}.button{font-size:12px}}