*{margin:0;padding:0;}
body{
    background:#222;
    -webkit-perspective:800px;
    perspective:800px;
    overflow:hidden;
    touch-action:none;
}
#wrap{
    position:relative;
    width:120px;
    height:180px;
    margin:auto;
    -webkit-transform-style:preserve-3d;
    transform-style:preserve-3d;
}


#wrap .item{
    position:absolute;
    width:133px;
    height:200px;
    box-shadow:0 0 10px #000;
    border-radius:5px;
    -webkit-box-reflect:below 5px -webkit-linear-gradient(top,rgba(0,0,0,0) 40%,rgba(0,0,0,.5) 100%);
}
#wrap .item img{
    width:100%;
    height:100%;
    display:block;
    border-radius:5px;
}
#wrap .item p{
    position:absolute;
    left:0;
    top:100%;
    width:100%;
    margin-top:8px;
    text-align:center;
    color:#fff;
    font-size:14px;
    font-family:Arial, sans-serif;
    white-space:nowrap;
    pointer-events:none;
}
#wrap .glow{
    position:absolute;
    left:50%;
    top:112%;
    margin-left:-600px;
    margin-top:-600px;
    width:1200px;
    height:1200px;
    border-radius:50%;
    background:-webkit-radial-gradient(center center,600px 600px,rgba(122,122,122,0.2),rgba(0,0,0,0));
    transform:rotateX(90deg);
}

/* 环中心的 logo */
#logo{
    position:absolute;
    left:50%;
    top:50%;
    width:120px;            /* logo 大小，按需改 */
    margin-left:-60px;      /* = width 的一半 */
    margin-top:-60px;       /* = 高度的一半，若高宽不同请对应改 */
    pointer-events:none;    /* 不挡拖拽/点击；要能点就删掉并加 cursor:pointer */
    z-index:1;
}
#logo img{
    width:100%;
    display:block;
}