
        .btnsd {
            position: relative;
            display: inline-block;
            overflow: hidden;
        }
        .btnsdborder {
            position: relative;
            overflow: hidden;
            border-radius: 5px;
        }
        .goods_name_line2{
            
        }
        spanjk {
            position: absolute;
            background: #3D5AFE;
            transform: translate(-50%, -50%);
            border-radius: 50%;
            animation: animate78 10s linear infinite;
        }

        @keyframes animate78 {
            0% {
                width: 0;
                height: 0;
                opacity: 0.8;
            }

            100% {
                width: 5000px;
                height: 5000px;
                opacity: 0;
            }
        }
        .ripple-button {
            position: relative;
            overflow: hidden;
        }
        @keyframes animate89 {
            0% {
                width: 0;
                height: 0;
                opacity: 0.8;
            }

            100% {
                width: 1000px;
                height: 1000px;
                opacity: 1;
            }
        }
        .ripple-button {
            position: relative;
            overflow: hidden;
        }

       spanjkborder {
            position: absolute;
            border: 1px solid #3D5AFE;
            transform: translate(-50%, -50%);
            border-radius: 50%;
           
            animation: animate89 2s ease-out forwards; 
        }

        .spanjkborder {
            position: absolute;
            transform: translate(-50%, -50%);
            border-radius: 50%;
             background: #000;
            animation: animate89 3s ease-out forwards; 
        }

    /* 图片旋转特效 */

.rotateimg {
    animation: spin 2s ease-out forwards; /* 应用动画 */
}

@keyframes blink {
    0% { opacity: 1; transform: scale(1);}
    50% { opacity: 0.5;  transform: scale(1.5);}
    100% { opacity: 1;  transform: scale(1);}
}



.myImageblink {
    animation: blink 2s ease-out forwards; /* 应用动画 */
}


@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* 波浪效果 */

@keyframes wave {
  0%, 100% {
   transform: scale(1);
  }
  50% {
    transform: scale(0.9);
  }
}

.wave-text {
  display: inline-block; /* 或者根据需要设置为其他合适的display值 */
  animation: wave 1s ease-out forwards; 
}

.nav_name_line{
    margin-top: -20px;
}
.btnsdborder{
    width: 100%;
    height: 1px;
}


 /* 核心特效按钮样式 */
        .magic-btn {
            position: relative;
           background: linear-gradient(135deg, #c3455c, #7d0733);
            border: none;
            border-radius: 8px;
            cursor: pointer;
            overflow: hidden;
            transition: all 0.3s ease;
        }

        /* 流光伪元素 */
        .magic-btn::before {
            content: "";
            position: absolute;
            top: -50%;
            left: -50%;
            width: 200%;
            height: 200%;
            background: linear-gradient(
                to right,
                transparent,
                rgba(255, 255, 255, 0.2),
                transparent
            );
            transform: rotate(45deg);
            animation: lightFlow 3s linear infinite;
            opacity: 0;
        }

        /* hover 触发特效 */
        .magic-btn:hover {
            box-shadow: 0 0 20px rgba(76, 161, 175, 0.6);
            transform: translateY(-2px);
        }

        .magic-btn:hover::before {
            opacity: 1;
        }

        /* 流光动画 */
        @keyframes lightFlow {
            0% {
                transform: rotate(45deg) translateX(-100%);
            }
            100% {
                transform: rotate(45deg) translateX(100%);
            }
        }

        /* 点击反馈 */
        .magic-btn:active {
            transform: translateY(0);
            box-shadow: 0 0 10px rgba(76, 161, 175, 0.8);
        }



        .magic-btn2 {
            position: relative;

            border: none;
            border-radius: 8px;
            cursor: pointer;
            overflow: hidden;
            transition: all 0.3s ease;
        }

        /* 流光伪元素 */
        .magic-btn2::before {
            content: "";
            position: absolute;
            top: -50%;
            left: -50%;
            width: 200%;
            height: 200%;
            background: linear-gradient(
                    to right,
                    transparent,
                    rgba(255, 255, 255, 0.2),
                    transparent
            );
            transform: rotate(45deg);
            animation: lightFlow 3s linear infinite;
            opacity: 0;
        }

        /* hover 触发特效 */
        .magic-btn2:hover {
            box-shadow: 0 0 20px rgba(76, 161, 175, 0.6);
            transform: translateY(-2px);
        }

        .magic-btn2:hover::before {
            opacity: 1;
        }

        /* 流光动画 */
        @keyframes lightFlow {
            0% {
                transform: rotate(45deg) translateX(-100%);
            }
            100% {
                transform: rotate(45deg) translateX(100%);
            }
        }

        /* 点击反馈 */
        .magic-btn2:active {
            transform: translateY(0);
            box-shadow: 0 0 10px rgba(76, 161, 175, 0.8);
        }



        /* 精美气泡样式 - 渐变+高光+阴影+旋转 */
        .bubble {
            position: fixed;
            border-radius: 50%;
            pointer-events: none;
            z-index: 99999999;
            /* 抛物线动画 + 旋转动画 */
            transition: all 1.2s cubic-bezier(0.15, 0.7, 0.25, 1);
            box-shadow: 0 2px 8px rgba(0,0,0,0.2);
        }
        /* 气泡高光质感 */
        .bubble::after {
            content: '';
            position: absolute;
            top: 15%;
            left: 20%;
            width: 30%;
            height: 20%;
            background: rgba(255,255,255,0.6);
            border-radius: 50%;
        }