body {
	background: #f5f9ff;
	min-height: 100%;
	font-family: "Microsoft YaHei","微软雅黑";font-weight: normal;
}

.banner {
	height: 670px;
	background: url(../images/pc/index/banner.png) no-repeat center;
}
.banner .btn-item {
	position: absolute;
	left: 50%;
	bottom: 100px;
	margin: 0 0 0 -120px;
	display: inline-block;
	width: 240px;
	height: 56px;
	text-align: center;
	line-height: 56px;
	border-radius: 28px;
	font-size: 22px;
	color: #fff;
	font-weight: bold;
	background: linear-gradient(to right, #4060ff, #8f7fff);
}

/* 视频弹出层 */
.video-popup {
	display: none;
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	background: rgba(255, 255, 255, 0.15);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}
.video-popup.show {
    display: block;
}
.video-popup .video-box {
	width: 800px;
	height: 450px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -225px 0 0 -400px;
	background: #000;
}
.video-popup .video-box .close-btn {
	width: 40px;
	height: 40px;
	position: absolute;
	left: 50%;
	bottom: -60px;
	margin-left: -20px;
	cursor: pointer;
}

/* 简介 */
.introduction {
	padding: 30px 0 40px 0;
}
.introduction .intro-text {
	width: 1059px;
	height: 172px;
	background: url('../images/pc/index/s01-icon01.png') no-repeat center;
	margin: 15px auto 30px auto;
}
.introduction .intro-text p {
	padding: 25px 50px;
	font-size: 20px;
	color: #202020;
	line-height: 2;
	text-align: center;
}
.introduction .video-list {
	width: 1200px;
	margin: 0 auto;
}
.introduction .video-list h3 {
	font-size: 24px;
	color: #1a52ab;
	padding: 0 0 20px 0;
}

/* 音频播放 */
.introduction .audio-box {
	overflow: hidden;
	width: 580px;
	height: 322px;
	background: #fff;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	text-align: left;
}
.introduction .audio-bg {
	width: 538px;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	height: 270px;
	margin: 26px auto;
	background: linear-gradient(to right, #ebedfe, #e7e4fc);
}
.introduction .audio-box .infor01 {
	font-size: 22px;
	color: #202020;
	padding: 38px 0 0 45px;
}
.introduction .audio-box .infor01 img {
	vertical-align: -webkit-baseline-middle;
}
.introduction .audio-box .infor02 {
	font-size: 16px;
	color: #919ba9;
	padding: 10px 0 20px 45px;
}
.introduction .audio-controls {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 20px;
	overflow: hidden;
}
.introduction .audio-controls .prev-btn,
.introduction .audio-controls .next-btn {
	width: 30px;
	height: 30px;
}

/* 进度条区域 */
.audio-progress-box {
  padding: 0 45px 20px 45px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.time-start, .time-total {
  font-size: 14px;
  color: #626c79;
}
/* 自定义渐变进度条核心样式 */
.audio-progress {
  flex: 1;
  height: 16px;
  border-radius: 999px;
  -webkit-appearance: none;
  appearance: none;
  /* 初始状态：0%播放，全是底色 */
  background: linear-gradient(to right, #7b9aff, #a87bff 0%, #f5f8fd 0%);
  outline: none;
}

/* 进度条滑轨底色（底层轨道，不要在这里设置background，会覆盖渐变） */
.audio-progress::-webkit-slider-runnable-track {
  height: 16px;
  border-radius: 999px;
  background: transparent; /* 关键：设为透明，让外层渐变生效 */
}

/* 拖动圆点 */
.audio-progress::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,0.12);
  border: none;
  margin-top: -4px;
  cursor: pointer;
}

/* Firefox 专用，firefox有独立progress伪类，保留 */
.audio-progress::-moz-range-track {
  height: 16px;
  border-radius: 999px;
  background: #f5f8fd;
}
.audio-progress::-moz-range-progress {
  background: linear-gradient(90deg, #7b9aff, #a87bff);
  height: 16px;
  border-radius: 999px;
}
.audio-progress::-moz-range-thumb {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #fff;
  border: none;
  box-shadow: 0 4px 12px rgba(0,0,0,0.12);
  cursor: pointer;
}


/* 播放按钮 */
.play, .pause {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  margin: 15px 20px;
  background: url('../images/pc/index/play.png') no-repeat center;
}
.pause {
  background: url('../images/pc/index/pause.png') no-repeat center;
  display: none;
}



/* 时间线 */
.timeline {
	background: url('../images/pc/index/s02-bg.png') repeat-x center;
}
.timeline .timeline-pic {
	height: 620px;
	background: url('../images/pc/index/s02-timeline.png') no-repeat center;
}
.timeline .timeline-box {
	height: 350px;
}
.timeline .title {
	margin: 20px 0 30px 0;
}
.timeline .btn-box {
	padding: 20px 0 40px 0;
}
.timeline .btn-box p {
	font-size: 20px;
	color: #5b72d8;
	padding: 25px 0 0 0;
	font-weight: bold;
}
.timeline .btn-box .btn-item {
	display: inline-block;
	width: 240px;
	height: 56px;
	text-align: center;
	line-height: 56px;
	border-radius: 28px;
	font-size: 22px;
	color: #fff;
	font-weight: bold;
	background: linear-gradient(to right, #4060ff, #8f7fff);
}
.timeline .btn-box .btn-item:hover {
	opacity: .8;
}

/* 赛事动态 */
.news {
	width: 1200px;
	margin: 0 auto;
	padding: 40px 0;
}
.news .news-item {
	width: 580px;
	height: 325px;
	background: linear-gradient(to right, #e3effe, #f4f4ff);
	box-shadow: 0 0 10px rgba(0,0,0,.1);
	border: solid 1px #f2f7fb;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
}
.news .news-item h3 {
	margin: 25px 0;
	padding: 0 0 10px 0;
	background:url('../images/pc/index/s03-title-bg.png') no-repeat center bottom;
	font-size: 24px;
	color: #1a52ab;
	text-align: center;
}
.news .news-item ul {
	padding: 0 20px;
}
.news .news-left li {
	height: 42px;
	line-height: 42px;
	font-size: 16px;
	color: #21252c;
	padding: 0 0 0 20px;
	background: url('../images/pc/index/s03-list-style.png') no-repeat left center;
}
.news .news-left li a {
	color: #21252c;
	display: block;
	width: 400px;
	height: 100%;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.news .news-left li a:hover {
	color: #1a52ab;
}
.news .news-left li span {
	color: #acb3bf;
}
.news .news-right li {
	height: 42px;
	line-height: 42px;
	font-size: 16px;
	color: #21252c;
	padding: 0 0 0 36px;
	position: relative;
}
.news .news-right li a {
	color: #4160ff;
}
.news .news-right li .icon {
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}

/* 公开课 */
.public-class {
	padding: 20px 0 40px 0;
}
.public-class .class-box {
	width: 1200px;
	margin: 0 auto;
	padding: 30px 0 0 0;
}
.public-class .class-box ul {
	margin: 0 0 0 -20px;
}
.public-class .class-box li {
	width: 280px;
	height: 222px;
	background: linear-gradient(135deg, #63a8ff, #2563eb);
	padding: 2px;
	border-radius: 22px;
	margin: 0 0 0 20px;
}
.public-class .class-box li .card-inner {
	width: 280px;
	height: 222px;
	background: #fff;
	border-radius: 20px;
}
.public-class .class-box li .pic {
	border-radius: 20px;
	overflow: hidden;
	height: 160px;
}
.public-class .class-box li .des {
	font-size: 16px;
	color: #000000;
	margin: 6px 20px;
	line-height: 1.5;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
.public-class .class-box li:hover .pic img {
	transition: transform 0.8s ease; /* 0.3秒平滑过渡 */
	transform: scale(1.05);
}
.public-class .class-box .more {
	padding: 30px 0 0 0;
	font-size: 16px;
}
.public-class .class-box .more a {
	color: #8590b7;
}

/* 报名弹出层 */
.apply-popup {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	background: rgba(255, 255, 255, 0.15);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border-radius: 16px;
	border: 1px solid rgba(255, 255, 255, 0.2);
	color: #fff;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
	display: none;
	justify-content: center;
	align-items: center;
}

.apply-popup .pop-content {
	max-width: 818px;
	margin: 5vh auto;
	width: auto;
	max-height: 90vh;
	overflow-y: auto;
	overflow-x: hidden;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	background: #fff;
	border-radius: 8px;
	padding: 10px 0;
	box-sizing: border-box;
	box-shadow: 0 0 16px rgba(0, 0, 0, 0.1);
}
.apply-popup .pop-content img {
	max-width: 100%;
	height: auto;
	display: block;
}
/* 美化滚动条（可选） */
.apply-popup .pop-content::-webkit-scrollbar {
	width: 6px;
}
.apply-popup .pop-content::-webkit-scrollbar-thumb {
	background: #ccc;
	border-radius: 3px;
}
.apply-popup .pop-content::-webkit-scrollbar-track {
	background: transparent;
}
.apply-popup .pop-content .close-btn {
	width: 30px;
	height: 30px;
	top: 10px;
	right: 10px;
	cursor: pointer;
}

/* 底部 */
.footer {
	background: #314db3;
}