
.more-icon{width:80px;height:80px;border:#fff dashed 1px;padding:8px;border-radius:50%;cursor:pointer;transition: all 0.3s;-webkit-transition: all 0.3s;margin:50px auto 0;    display: block;}
.more-icon i {
    display: block;
    width: 62px;
    height: 62px;
    background-image: url(https://omo-oss-image.thefastimg.com/portal-saas/new2023052509114819227/cms/image/470bd41a-4902-427b-9855-329c94c62a1a.png?d=1688037477709);
    background-position: center;
    background-repeat: no-repeat;
    background-color: #fff;
    border-radius: 50%;
    font-size: 24px;
    color: #fff;
    text-align: center;
    line-height: 62px;
    position: relative;
    z-index: 2;
}
.more-icon i:after{content:"";display:block;width:60px;height:60px;border-radius:50%;position:absolute;top:1px;left:1px;z-index:1}
.more-icon:hover i:after{animation: iconS 1.6s ease-out infinite;background:#e51515;}
@media(max-width:1280px){
.more-icon{width:60px;height:60px;padding:6px;margin:36px auto 0;}
.more-icon i{width:46px;height:46px;font-size:20px;line-height:46px;}
.more-icon i:after{width:44px;height:44px;}
}
@media(max-width:480px){
.more-icon{width:48px;height:48px;padding:4px;margin:24px auto 0;}
.more-icon i{width:38px;height:38px;font-size:16px;line-height:38px;}
.more-icon i:after{width:36px;height:36px;}
}

  @keyframes iconS {
    from {
        transform: scale(1);
        filter: opacity(0.8);
    }
    to {
        transform: scale(1.4);
        filter: opacity(0);
    }
}
