html{margin: 0;padding: 0;height: 100%;}
body {
	margin: 0 auto;
	padding: 0;
	font-family:Arial,sans-serif;
	text-align:center;
	background:#fff;
	color:#666;
    width:1180px;
	height:100%;
}

.button {color:#fff;border:none;cursor:pointer;padding:5px 28px;margin:0;background:#00618D;font-size:16px;border-radius:5px;}
.button2 {color:#fff;border:none;cursor:pointer;padding:6px 18px;margin:0;background:#339900;font-size:22px;border-radius:5px;}
.lang_btn {color:#fff;border:none;cursor:pointer;padding:5px 10px;margin:0;background:#339900;font-size:16px;border-radius:5px;width:150px;}
.lang_secbtn {color:#fff;border:none;cursor:pointer;padding:5px 10px;margin:0;background:#AC312E;font-size:16px;border-radius:5px;background-repeat: no-repeat;width:150px;}
.lang_unsecbtn {color:#999;border:none;cursor:pointer;padding:5px 10px;margin:0;background:#eee;font-size:16px;border-radius:5px;background-repeat: no-repeat;width:150px;}

.lang_unsecbtn:hover {color:#fff;background:#AC312E;border:none;cursor:pointer;padding:5px 10px;margin:0;font-size:16px;border-radius:5px;background-repeat: no-repeat;width:150px;}

a.domain:link,a.domain:visited {font-size:16px;color:#aaa;text-decoration: none;}
a.domain:hover,a.domain:active {font-size:16px;color:#aaa;text-decoration: none;}

a.checklang:link,a.checklang:visited {font-size:12px;color:#0C63C4;text-decoration: none;}
a.checklang:hover,a.checklang:active {font-size:12px;color:#0C63C4;text-decoration: none;}

a.text:link,a.text:visited,a.text:hover,a.text:active {font-size:16px;color:#999999;text-decoration: none;}
a.switch:link,a.switch:visited,a.switch:hover,a.switch:active {font-size:14px;color:#ff0000;text-decoration: none;}

.wrap_main{padding:10px;font-size:12px;width:1160px;text-align:left;}
.unselect{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-decoration: none;}
.btn_box{border:2px solid #eee;padding:10px 20px;width:900px;margin: 0 auto;line-height:60px;}
.btn_box button{margin-right:30px;}

.left{float:left;width:600px;}

.right{float:right;width:540px;}

.subtitle {
	padding:5px 15px 3px;
	font-size:18px;
	background:#F9E128;
	color:#000;
	line-height:28px;
	word-wrap: break-word;
	-webkit-box-orient: vertical;
	overflow: hidden;
	max-height: 80px; 
	text-align: center;
	display:none;
}

.subtitle b{color:#AC312E;}

.anrlh_div{width:173px;height:80px;float:left;}
.anrlh_div_l{width:150px;float:left;text-align:center;padding-top:24px;}
.anrlh_div_sex{font-size:16px;padding-bottom:10px;color:#999;}
.anrlh_div_play{width:16px;margin:0 auto;height:16px;padding:2px;cursor:pointer;}

.rateBtn{margin-left:10px;font-size:16px;cursor:pointer;color:#999;}
.rate_button{margin-left:10px;font-size:16px;cursor:pointer;color:#fff;background:#AC312E;border:2px solid #AC312E;}

.icon-bars {	
	position: relative;
	width: 40px;
	height: 30px;
  }
  .icon-bars .bar {
	position: absolute;
	bottom: 0;
	left: 0;
	top: 0;
	width: 8px;
	background-color: #999;
	-webkit-animation: up-down 1.5s infinite;
			animation: up-down 1.5s infinite;
  }
  .icon-bars .bar:nth-child(2) {
	left: 15px;
	-webkit-animation-delay: -1s;
			animation-delay: -1s;
  }
  .icon-bars .bar:nth-child(3) {
	left: 30px;
	-webkit-animation-delay: -0.5s;
			animation-delay: -0.5s;
  }
  
  @-webkit-keyframes up-down {
	from {
	  top: 24px;
	}
	50% {
	  top: 0;
	}
	to {
	  top: 24px;
	}
  }
  
  @keyframes up-down {
	from {
	  top: 24px;
	}
	50% {
	  top: 0;
	}
	to {
	  top: 24px;
	}
  }

  .wa_secbtn {color:#fff;border:none;cursor:pointer;padding:6px 20px 6px 45px;margin:0;background:#22CD64;font-size:20px;border-radius:5px;background-image: url('/images/tts/whatsapp.svg');background-position:10px;background-size:20px  20px;background-repeat: no-repeat;}

  
.spinner {
    position: relative;
    width: 40px;
    height: 40px;
	display:none;
}

/* Dot 样式 */
.dot {
    position: absolute;
    width: 8px;
    height: 8px;
    background-color: rgba(51, 51, 51, 0.8);
    border-radius: 50%;
    animation: dotFade 1s linear infinite;
}

/* 定义每个 dot 的位置 */
.dot:nth-child(1) { top: 0; left: 50%; transform: translate(-50%, -50%); }
.dot:nth-child(2) { top: 14.64%; left: 85.36%; transform: translate(-50%, -50%); }
.dot:nth-child(3) { top: 50%; left: 100%; transform: translate(-50%, -50%); }
.dot:nth-child(4) { top: 85.36%; left: 85.36%; transform: translate(-50%, -50%); }
.dot:nth-child(5) { top: 100%; left: 50%; transform: translate(-50%, -50%); }
.dot:nth-child(6) { top: 85.36%; left: 14.64%; transform: translate(-50%, -50%); }
.dot:nth-child(7) { top: 50%; left: 0; transform: translate(-50%, -50%); }
.dot:nth-child(8) { top: 14.64%; left: 14.64%; transform: translate(-50%, -50%); }

/* Dot 动画 */
@keyframes dotFade {
    0%, 100% { opacity: 0.2; }
    50% { opacity: 1; }
}

/* 延迟每个 dot 的动画开始时间 */
.dot:nth-child(1) { animation-delay: 0s; }
.dot:nth-child(2) { animation-delay: 0.125s; }
.dot:nth-child(3) { animation-delay: 0.25s; }
.dot:nth-child(4) { animation-delay: 0.375s; }
.dot:nth-child(5) { animation-delay: 0.5s; }
.dot:nth-child(6) { animation-delay: 0.625s; }
.dot:nth-child(7) { animation-delay: 0.75s; }
.dot:nth-child(8) { animation-delay: 0.875s; }

#slider-container {
    width: 390px;
    padding:10px 5px;
    height: 30px;
    position: relative;
    cursor: pointer;
    float:left;
}

#slider-bar {
    width: 390px;
    height: 4px;
    left:4px;
    top:23px;
    position: absolute;
    background-color: #bbb;
    z-index:10;
}

#slider-thumb {
    width: 10px;
    height: 10px;
    background-color:#666;
    border-radius: 50%;
    position: absolute;
    top: 20px;
    left: 0;
    z-index: 99;
    user-select: none;
}

#slider-bar::before {
    top:0;
    left:0;
    content: '';
    position: absolute;
    height: 100%;
    width: var(--before-width, 0);
    background-color:#666;
    z-index: 20;
}

.my-range {
	-webkit-appearance: none; /* 必须，否则无法自定义 */
	width: 300px;
	height: 4px;
	background: #bbb;
	border-radius: 3px;
}

/* 滑块 */
.my-range::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 16px;
	height: 16px;
	background: #666;
	border-radius: 50%;
	cursor: pointer;
	border: none;
	margin-top: -6px; /* 让滑块垂直居中轨道 */
}

/* 滑轨（Track） */
.my-range::-webkit-slider-runnable-track {
	height: 4px;
	background: #bbb;
	border-radius: 3px;
}

.my-range::-moz-range-track {
	height: 4px;
	background: #ddd;
	border-radius: 3px;
}

.my-range::-moz-range-thumb {
	width: 16px;
	height: 16px;
	background: #666;
	border-radius: 50%;
	cursor: pointer;
	border: none;
}

.share{width:450px;padding:10px 15px;display: flex;align-items: center;background:#F7F7F7;display:none;}
.share span{margin-right:20px;}
.share img{height:24px;width:24px;cursor:pointer;vertical-align:middle;}

.rate{padding:10px 0 20px;width:540px;text-align:center;}
.rate span{margin-right:15px;}

.overlay {
    position: fixed; 
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    display: none;
    z-index: 999;
}

.modal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    padding: 4vw;
    border-radius:0.8vw;
    display: none;
    z-index: 1000;
}