@charset "gb2312";
a{  text-decoration:none;color:#666;}
a:hover{  text-decoration:none;}
img{ vertical-align:middle; }
body,form,ul,li,div,table,img,input,dl,dd,dt,iframe{color:#000;padding:0px; margin:0px; word-break:break-all; border:0px; list-style:none;   background-repeat:no-repeat; }
body{ background-color:#f7f7f7; margin:auto;line-height:22px; font-size:12px; }
iframe{ width:100%; height:100%; min-height:400px; clear:both; display:block; }
input,select{-webkit-appearance:none;-webkit-border-radius:0;}


.left{ float:left;}
.right{ float:right;}
.center{ float:left;}
.clear_both{ clear:both;}
.user_img{border-radius:50%; border:3px #fff solid;}




	.page_no{ padding-top:5px;padding-bottom:20px; margin-top:20px;margin-bottom:20px; text-align:center;width:95%; padding-left:5%;overflow-y:hidden;overflow-x:scroll;white-space: nowrap; overflow-style:none; height:50px;}
	.page_no::-webkit-scrollbar {display:none}
	.page_no span{ display:inline-block; color:#ccc;padding:5px 10px 5px 10px; }
	.page_no a{  display:inline-block;color:#666; font-size:16px; padding:8px 15px 8px 15px; margin-right:10px;}	
	.page_no .font14{font-size:14px;}
	#page_this{ color:#333;border:1px #ddd solid; border-radius:5px; }
	#page_this:hover{}
	.next_page{ width:100%; clear:both;  border-top:1px #ddd solid; margin-top:50px;padding-bottom:100px; padding-top:30px;  }
	
	

.key_input_div { background-color: #fff; border-radius: 20px; padding-bottom: 30px; position:relative;box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);}
.key_input_div .title { font-size: 25px; color: #000; font-weight: bolder; line-height: 30px; padding-top: 50px; padding-left: 15%; }
.input-box { height: 60px; font-size: 40px; display: flex; align-items: center; justify-content: center; border-radius: 50px; background-color: #eee; pointer-events: none; letter-spacing: 5px; width: 75%; margin: auto; border: 3px #eee solid; margin-top: 40px; }
.prefix { color: #333; font-weight: bold;}
.default-zero { color: #999; }
.user-input { color: #333; font-weight: bold; }
.keyboard { width: 76%; margin: auto; text-align: center; padding-top: 30px; }
.key { width: 29.33%; aspect-ratio: 1/1; margin-left: 2%; margin-right: 2%; margin-bottom: 10px; font-size: 35px; font-weight: bold; border: none; border-radius: 100px; background-color: #f7f7f7; color: #333; cursor: pointer; transition: all 0.2s ease; box-shadow: 0 1px 0 #eee; display: flex; align-items: center; justify-content: center; float: left; }
.close-btn {  background-color:#8ba3bb; color:#eee; text-decoration: none;box-shadow:none; }
.func-key { background-color: #e74c3c; color: #fff; font-size: 20px; }
.func-submit{background-color: #2ecc71;}
.hi888{ position:absolute; right:25px; top:50px; display:inline-block; background-color:#f7f7f7; border-radius:10px; padding:5px 10px; }
	



.vip-card { width: 85%; margin: auto; margin-top: 10px; margin-bottom: 20px; height: 150px; background-color: #F5D76E; border-radius: 18px; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05); padding: 30px 5%; position: relative; color: #444; overflow:hidden; }
.vip-card .card-gloss { position: absolute; top: 0; right: 0; width: 26%; height: 100%; background: linear-gradient(120deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0) 80%); pointer-events: none; }
.vip-card .card-vip { position: absolute; top: 20px; right: 25px; font-size: 18px; color:#666; font-weight:bolder;  }
.card-number { position: absolute; top: 50%; transform: translateY(-60%); width: 100%; padding: 0 25px; }
.card-number label { font-size: 13px; color: rgba(68, 68, 68, 0.75); margin-bottom: 12px; display: block; letter-spacing: 1px; }
.card-number .number { font-size: 32px; font-weight: 800; letter-spacing: 6px; color: #f7f7f7;  font-family: "Microsoft Yahei", "Courier New", monospace; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); }
.card-points { position: absolute; bottom: 30px; left: 25px; display: flex; align-items: center; gap: 12px; background: rgba(255, 255, 255, 0.25); padding: 8px 15px; border-radius: 20px; backdrop-filter: blur(3px); }
.card-points label { font-size: 14px; color: rgba(68, 68, 68, 0.85); font-weight: 500; }
.card-points .points { font-size: 22px; font-weight: 800; color: #333; }