html {}
body{font-family: "SF Pro Text", "SF Pro Icons", system, -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", "Helvetica", "Arial", "Lucida Grande", "Ubuntu", "Cantarell", "Fira Sans", sans-serif;background: #0a0e27;font-size: 14px;}
*{padding:0px;margin:0px;}
ul,ol{list-style:none;}
h1,h2,h3,h4,h5,h6{font-weight:normal;}
a{text-decoration:none;}
input,textarea{outline:none;}
input{background:#fff;}
input,button,textarea{font-family:"SF Pro Text", "SF Pro Icons", system, -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", "Helvetica", "Arial", "Lucida Grande", "Ubuntu", "Cantarell", "Fira Sans", sans-serif;outline:none;}
em,i{font-style:normal;}
img{border:none;}
input,textarea,button{-webkit-appearance: none;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-appearance: none;border-radius: 0;}/*去除苹果默认样式*/
input::-webkit-input-placeholder{/* WebKit browsers*/ color:#999;}
input:-moz-placeholder{/* Mozilla Firefox 4 to 18*/ color:#999;}
input::-moz-placeholder{/* Mozilla Firefox 19+*/ color:#999;}
input:-ms-input-placeholder{/* Internet Explorer 10+*/color:#999;}
.w500{max-width:500px;margin:0 auto;}
.grid1{display: flex;gap: 30px;justify-content: space-between;align-items: center;}

.bg{background-image: linear-gradient(rgba(59, 130, 246, 0.1) 1px, transparent 1px), linear-gradient(90deg, rgba(59, 130, 246, 0.1) 1px, transparent 1px);background-size: 50px 50px;animation: bgCor 20s linear infinite;position: fixed;left:0;top:0;right:0;bottom:0;z-index:-2;}
@keyframes bgCor {
   0% {
       transform: translate(0, 0);
   }
   
   100% {
       transform: translate(50px, 50px);
   }
}

.main{max-width: 500px;margin:0 auto;box-shadow: 0 0 50px rgba(79, 172, 254, 0.2);}
.m1{background:#0a0e27;padding:40px 20px;text-align: center;}
.m1 h2,.m2 h2,.m3 h2,.m4 h2,.m6 h2{font-size:30px;font-weight: bold;color:#936bff;line-height: 50px;margin-bottom:20px;text-align: center;text-shadow: 0 0 20px rgba(147, 107, 255, 0.5);}
.m1 p{font-size:16px;line-height: 32px;color:#a0aec0;margin-bottom:20px;}

.m2{background: #1a214e;padding:40px 20px;text-align: center;}
.m2 img,.m3 img,.m4 img{display: block;margin-bottom:20px;border-radius:10px;}
.m3{background: #0a0e27;padding:40px 20px;text-align: center;}
.m4{background: #1a214e;padding:40px 20px 20px;text-align: center;}
.m4 ul{}
.m4 ul li{border-radius:10px;overflow: hidden;margin-bottom:20px;}
.m4 ul li img{margin-bottom:0;border-radius:0;}
.m4 ul li div{background: rgba(10,14,39,.8);position: relative;}
.m4 ul li h4{font-size:16px;font-weight: bold;color:#ffc530;padding:20px 20px;text-align: left;}
.m4 ul li span{position: absolute;right:20px;top:50%;transform: translateY(-50%);background: linear-gradient(95deg, #ffc530, #ffea7b);border-radius: 100px; color: #0a0e27;font-weight: bold;padding:4px 20px;}
.m5{background: #0a0e27;padding:40px 20px;text-align: center;}
.m5 img{border-radius:10px;}
.m5-m{position: relative;overflow: hidden;border-radius:10px;}
.text1{position: absolute;left:0;top:0;right:0;bottom:0;background: rgba(10, 22, 40, 0.75);}
.text1 p{margin:20px 0;}
.text1 h4{text-shadow: 0 0 20px rgba(79, 172, 254, 0.5);color: #936bff;font-size: 24px;font-weight: bold;letter-spacing: 2px;margin-bottom:30px;}
.text1 button,.m7 button{display: inline-block;
  padding: 15px 40px;
  background: linear-gradient(135deg, #ffc530, #ffea7b);
  color: #0a1628;
  text-decoration: none;
  border: none;
  border-radius: 30px;
  font-size: 16px;
  font-weight: bold;
  box-shadow: 0 4px 20px rgba(255,197,48, 0.4);
  transition: transform 0.2s;
  cursor: pointer;}
.text1 button:hover,.m7 button:hover{ transform: translateY(-3px);box-shadow: 0 6px 25px rgba(255,197,48, 0.6);}

.m6{background: #1a214e;padding:40px 20px;}
.m6 ul{}
.m6 ul li{display: flex;gap:20px;border-bottom:1px solid rgba(93,43,233,.4);padding:20px 0;}
.li-l{flex:1;min-width: 50px;max-width:50px;height:50px;border-radius:100%;overflow: hidden;}
.li-l img{display: block;}
.li-r{}
.li-r h3{font-size:18px;font-weight: bold;color:#ffc530;margin-bottom:10px;}
.li-r p{line-height: 24px;color:#a0aec0;font-size: 12px;}

.m7{background: #0a0e27;padding:40px 20px;text-align: center;}
.m7 p{font-size: 16px; color:#a0aec0;margin-bottom:30px;}

.m8{padding:40px 20px;text-align: center;border-top:1px solid rgba(93,43,233,.4);}
.m8 a{color:#936bff;margin:0 20px;font-weight: bold;}
.m8 p{color:#a0aec0;line-height: 24px;font-size: 12px;margin-top:5px;}



#mask{position: fixed;left:0;top:0;right:0;bottom:0;z-index:9999;}
.pr-r{position:absolute;left:50%;top:50%;transform: translate(-50%,-50%);max-width: 500px;}
.pr-r-m{background: rgba(15, 23, 42, 0.8);border: 2px solid #5d2be9; border-radius: 20px;padding: 50px 30px;max-width: 600px; width: 90%; position: relative;box-shadow: 0 0 50px rgba(59, 130, 246, 0.3), 0 0 100px rgba(59, 130, 246, 0.3);animation: tk 0.4s ease-out;text-align: center;}
@keyframes tk {
   from {
       transform: translateY(-50px);
       opacity: 0;
   }
   to {
       transform: translateY(0);
       opacity: 1;
   }
}
.img-tk{}
.img-tk img{ width: 97px;height: 97px;border-radius: 100%;border: 3px solid #5d2be9;box-shadow: 0 0 30px rgba(59, 130, 246, 0.3);animation: imgtk 2s ease-in-out infinite;}
 @keyframes imgtk {
0% {
                transform: scale(1);
                box-shadow: 0 0 30px rgba(59, 130, 246, 0.3);
            }

            50% {
                transform: scale(1.05);
                box-shadow: 0 0 50px rgba(59, 130, 246, 0.3);
            }
			100% {
			    transform: scale(1);
			    box-shadow: 0 0 30px rgba(59, 130, 246, 0.3);
			}
}
.pr-r-m h2{font-size: 30px;font-weight:bold;color: #5d2be9;background: linear-gradient(95deg, #5d2be9, #936bff);background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;margin:30px 0;text-shadow: 0 0 20px rgba(147, 107, 255, 0.5);}
.pr-r-m p{color:#a0aec0;line-height:32px;font-size:16px;}
.pr-r-m a{padding:15px 40px;font-size: 16px;background: linear-gradient(95deg, #ffc530, #ffea7b);border: none;border-radius: 50px;color: #0a0e27;font-weight: bold;cursor: pointer;transition: all 0.3s;margin-top:40px;display: block;}
.pr-r-m a:hover{  transform: translateY(-3px);box-shadow: 0 10px 40px rgba(255,197,48, 0.3);}
.on_down{text-align: right;font-size: 16px;color:#ffc530;position: absolute;top:25px;right:25px; cursor: pointer;}