*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body{
  margin: 0;
  padding: 0;
}
.wrap{
  width: 100vw;
  height: 100vh;
}
.title-img{
  width: 100vw;
}
.header{
  display: flex;
  padding: 6vw 4vw 5vw;
  align-items: center;
  background: rgb(245 244 244 / 63%);
}
.header img{
  width: 28vw;
  height: auto;
}
.header-info{
  padding-left: 4vw;
}
.header-info .header-title{
  font-size: 4.5vw;
  font-weight: bold;
  color: #333;
}
.header-info .header-tag{
  margin: 2.5vw 0 1.5vw 0;
}
.header-tag span{
  position: relative;
  display: inline-block;
  color: #FF7A38;
  padding: 0.2vw 1.5vw;
  font-size: 3.5vw;
  margin-right: 4px;
}
.header-tag span::after {
  content: ' ';
  position: absolute;
  left: 0;
  top: 0;
  border: 1px solid #FF7A38;
  border-radius: 6px;
  box-sizing: border-box;
  width: 200%;
  height: 200%;
  transform: scale(.5);
  transform-origin: left top;
}
.active-time{
  color: #939393;
  font-size: 2.5vw;
}

.container{
  width: 100vw;
  padding: 0vw 8vw 25vw;
}
.container .part-title{
  text-align: center;
  margin: 4vw 0 4vw 0;
}
.container .part-title span{
  font-weight: bold;
  color: #333;
  font-size: 4.7vw;
  box-shadow: inset 0px -12px 0px #d1edff;
}
.container .part img{
  width: 100%;
  padding: 4vw 0;
}
.container p{
  color: #646464;
  font-size: 3.9vw;
  line-height: 6.5vw;
  text-align: justify;
  letter-spacing: 1.3px;
  word-break: break-all;
}

.footer{
  position: fixed;
  margin: 0 0 5vw 0;
  text-align: center;
  bottom: 0;
  width: 100vw;
}
.footer .link{
  background: #0097FF;
  color: #fff;
  text-decoration: none;
  font-size: 4vw;
  width: 85vw;
  height: 13vw;
  border-radius: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
}

.footer .tip{
  position: absolute;
  top: -4vw;
  right: 17vw;
  color: #fff;
  background: linear-gradient(to right, #FFB269, #F36A26);
  padding: 1vw 3vw;
  font-size: 2.5vw;
  border-radius: 15px 15px 15px 0;
}

.loading{
  margin: 50vw auto;
  text-align: center;
}
.loading-img{
  width: 10vw;
  animation: jiazai 1.2s linear infinite;
}
.loading p{
  margin-top: 2vw;
  font-size: 3.5vw;
  color: #2a2a2a;
}
@keyframes jiazai {
  0%{
      transform: rotate(0deg)
  }
  100%{
      transform: rotate(360deg)
  }
}

.error{
  text-align: center;
  padding-top: 20vw;
  color: #cacaca;
  font-size: 4vw;
}

.error img{
  width: 250px;
  height: 250px;
  margin: 0 auto;
}
.error p{
  color: #c3c3c3;
  font-size: 4vw;
  font-family: MI LANTING;
  opacity: 0.8;
}
.error span{
  color: #0982ff;
  padding: 0 4px;
  text-decoration: underline;
  cursor: pointer;
}

.toast{
  font-size: 13px;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 14px;
  text-align: center;
  color: rgba(0, 0, 0, 0.7);
  padding: 12px 16px;
  width: max-content;
  background: rgb(232 232 232);
  box-shadow: 0px 14.5185px 29.037px rgb(0 0 0 / 5%), 0px 18.1481px 36.2963px rgb(0 0 0 / 5%);
}

.no-activity{
  margin: 50vw auto;
  text-align: center;
  font-size: 4vw;
  color: #ababab;
}