* {
  margin: 0;
  padding: 0;
}
a {
  color: #000;
  text-decoration: none;
}
a:hover {
  color: #000;
  text-decoration: underline;
}
ul,
li {
  list-style: none;
}
.main {
  width: 1200px;
  margin: 0 auto;
}
.h20 {
  margin-top: 50px;
  height: 20px;
  background-color: #fbf1e5;
}
img {
  display: block;
  border: none;
}
.page1 {
  margin: 0 auto;
  width: 1011px;
}
.page1 h3 {
  margin-top: 30px;
  height: 66px;
  background: url(./yhyl-20250331-title1.png) no-repeat left center;
}
.page1 div {
  background-color: #ffffff;
  box-shadow: 1px 2px 4px 1px rgba(191, 188, 188, 0.69);
  border-radius: 10px;
}
.page1 div ul {
  padding-top: 20px;
  padding-bottom: 20px;
}
.page1 div ul li {
  position: relative;
  display: block;
  padding: 10px 30px;
  height: 40px;
  line-height: 40px;
  font-size: 20px;
}
.page1 div ul li::after {
  content: "";
  position: absolute;
  width: 9px;
  height: 9px;
  background-color: #b50706;
  top: 27px;
  left: 13px;
  border-radius: 50%;
}
.page1 div ul li a p {
  display: block;
  float: left;
  width: 660px;
  padding-right: 20px;
  box-sizing: border-box;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.page1 div ul li a span {
  display: block;
  float: left;
  width: 200px;
  padding-right: 20px;
  box-sizing: border-box;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.page1 div ul li a em {
  display: block;
  float: left;
}
.page2 {
  margin: 0 auto;
  width: 1011px;
}
.page2 h3 {
  margin-top: 30px;
  height: 66px;
  background: url(./yhyl-20250331-title2.png) no-repeat left center;
}
.page2 div ul li {
  position: relative;
  width: 1011px;
  height: 134px;
  background-color: #ffffff;
  box-shadow: 1px 2px 4px 1px rgba(191, 188, 188, 0.69);
  border-radius: 10px;
  margin-bottom: 14px;
}
.page2 div ul li button {
  position: absolute;
  left: 23px;
  top: 15px;
  width: 105px;
  height: 105px;
  outline: none;
  padding: 0;
  margin: 0;
  border: none;
  cursor: pointer;
}
.page2 div ul li .play-button {
  background: url(./yhyl-20250331-play.png) no-repeat;
}
.page2 div ul li .pause-button {
  background: url(./yhyl-20250331-stop.png) no-repeat;
}
.page2 div ul li audio {
  display: none;
}
.page2 div ul li p,
.page2 div ul li span {
  position: absolute;
  left: 156px;
  top: 32px;
  width: 698px;
  height: 35px;
  font-family: SourceHanSansCN-Regular;
  font-size: 20px;
  font-weight: normal;
  font-stretch: normal;
  line-height: 35px;
  letter-spacing: 0px;
  color: #000000;
}
.page2 div ul li span {
  top: 70px;
  color: #333;
  font-size: 18px;
}
.page2 div ul li span em {
  padding-left: 20px;
  font-style: normal;
}
.page3 {
  margin: 0 auto;
  width: 1011px;
  padding-bottom: 30px;
}
.page3 h3 {
  margin-top: 30px;
  height: 66px;
  background: url(./yhyl-20250331-title3.png) no-repeat left center;
}
.page3 div {
  position: relative;
  margin-left: -12px;
  width: 1036px;
  height: 393px;
  background: url(./yhyl-20250331-bg3.png) no-repeat;
}
.page3 div ul {
  position: absolute;
  width: 301px;
  height: 362px;
  background-color: #d34c41;
  left: 13px;
  top: 0;
}
.page3 div ul li {
  margin-top: 12px;
  width: 301px;
  height: 79px;
  background-color: #e26c5d;
  font-family: SourceHanSansCN-Bold;
  font-size: 23px;
  line-height: 79px;
  text-align: center;
  color: #ffffff;
}
.page3 div ul li.cur {
  background-color: #f3c0bb;
  color: #bb0704;
}
.page3 div ul li:nth-of-type(1) {
  margin-top: 8px;
}
.page3 div video {
  position: absolute;
  right: 12px;
  top: 0;
  width: 705px;
  height: 364px;
  background-color: #000000;
}
h3 a {
  float: right;
  padding: 20px;
  font-size: 16px;
  font-weight: normal;
  color: #666;
}