.detail-icons{border:1px solid var(--c-d1);border-radius:50%;color:var(--c-d1);cursor:pointer;height:50px;line-height:50px;padding:0;position:relative;text-align:center;transition:.3s;width:50px}.detail-icons:hover{color:#27282d}.detail-icons.icon-actived{color:var(--c-red)}.detail-icons.icon-actived .flip-wrap{animation:icon-actived 1s forwards}.detail-icons.icon-hasNum{position:relative}.detail-icons.icon-hasNum .num{background-color:var(--c-red);border-radius:20px;bottom:32px;box-shadow:0 10px 30px #00000012;color:var(--c-fff);font-size:12px;font-style:normal;left:30px;line-height:12px;min-width:24px;padding:6px;position:absolute;text-align:center}.detail-icons .icon-fontsize{font-size:16px}.detail-icons .text-fontsize{font-size:14px}@keyframes icon-actived{0%{transform:scale(1)}10%{transform:scale(.7)}30%{transform:scale(1.3)}46%{transform:scale(1)}}.detail-icons i,.detail-icons span{font-weight:inherit}.detail-icons .flip-wrap{display:block;position:relative}.detail-icons .flip-wrap .flip-up{display:block;transition:transform .3s cubic-bezier(.77,0,.175,1),visibility 0s,opacity .4s cubic-bezier(.77,0,.175,1)}.detail-icons .flip-wrap .flip-down{display:block;left:0;opacity:0;position:absolute;top:0;transform:translateY(-35%);transition:transform .3s cubic-bezier(.77,0,.175,1),visibility 0s .4s,opacity .4s cubic-bezier(.77,0,.175,1);visibility:hidden;width:100%}.detail-icons .flip-wrap .flip-up.active{opacity:0;transform:translateY(35%);transition:transform .4s cubic-bezier(.77,0,.175,1),visibility 0s .4s,opacity .4s cubic-bezier(.77,0,.175,1);visibility:hidden}.detail-icons .flip-wrap .flip-down.active{opacity:1;transform:translateY(0);transition:transform .4s cubic-bezier(.77,0,.175,1),visibility 0s,opacity .4s cubic-bezier(.77,0,.175,1);visibility:inherit}