.page-root[data-v-dacc7602] {
  display: flex;
  margin: 30px auto;
  padding-bottom: 80px;
}
.page-root .video-play-wrapper[data-v-dacc7602] {
  margin-bottom: 24px;
}
.page-root .video-play-wrapper .v-player[data-v-dacc7602] {
  position: relative;
  width: 750px;
  height: 423px;
}
.page-root .video-play-wrapper .v-player[data-v-dacc7602] .video-js {
  width: 750px;
  height: 423px;
  font-size: 10px;
  background-color: transparent;
}
.page-root .video-play-wrapper .v-player[data-v-dacc7602] .video-js .vjs-poster {
  outline: none!important;
  background-color: transparent;
}
.page-root .video-play-wrapper .v-player[data-v-dacc7602] .video-js video,
.page-root .video-play-wrapper .v-player[data-v-dacc7602] .video-js button,
.page-root .video-play-wrapper .v-player[data-v-dacc7602] .video-js .vjs-menu-item {
  outline: none!important;
}
.page-root .video-play-wrapper .v-player[data-v-dacc7602] .video-js .vjs-big-play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 80px;
  height: 80px;
  border: none;
  line-height: 80px;
  text-align: center;
  border-radius: 80px;
  background-color: rgba(0, 0, 0, 0.4);
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTJweCIgaGVpZ2h0PSIxMnB4IiB2aWV3Qm94PSIwIDAgMTIgMTIiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDYxLjIgKDg5NjUzKSAtIGh0dHBzOi8vc2tldGNoLmNvbSAtLT4KICAgIDx0aXRsZT7nvJbnu4QgMzwvdGl0bGU+CiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4KICAgIDxnIGlkPSLnvJbnu4QtMyIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj4KICAgICAgICA8ZyBmaWxsPSIjRkZGRkZGIiBpZD0iVHJpYW5nbGUtMiIgc3Ryb2tlPSIjRkZGRkZGIiBzdHJva2Utd2lkdGg9IjIiPgogICAgICAgICAgICA8cG9seWdvbiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg2LjAwMDAwMCwgNi4wMDAwMDApIHJvdGF0ZSg5MC4wMDAwMDApIHRyYW5zbGF0ZSgtNi4wMDAwMDAsIC02LjAwMDAwMCkgIiBwb2ludHM9IjYgNCA5IDggMyA4Ij48L3BvbHlnb24+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50px;
  transform: translate(-50%, -50%);
}
.page-root .video-play-wrapper .v-player[data-v-dacc7602] .video-js .vjs-big-play-button:hover {
  background-color: rgba(0, 0, 0, 0.6);
}
.page-root .video-play-wrapper .v-player[data-v-dacc7602] .video-js .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button {
  position: relative;
}
.page-root .video-play-wrapper .v-player[data-v-dacc7602] .video-js .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: transparent;
}
.page-root .video-play-wrapper .v-player .diversion-dialog[data-v-dacc7602] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://youjia.cdn.bcebos.com/diversionPc/video-diversion.png') no-repeat;
  background-size: contain;
}
.page-root .video-play-wrapper .v-player .diversion-dialog .close-mask[data-v-dacc7602] {
  width: 25px;
  height: 25px;
  position: absolute;
  top: 12px;
  right: 26px;
}
.page-root .video-play-wrapper .v-player .diversion-dialog .qr-code[data-v-dacc7602] {
  width: 114px;
  height: 114px;
  background: url('https://youjia.cdn.bcebos.com/diversionPc/qr-code.png') no-repeat;
  background-size: contain;
  margin: 132px auto;
}
.page-root .article[data-v-dacc7602] {
  width: 750px;
  margin-right: 50px;
}
.page-root .title[data-v-dacc7602] {
  font-size: 32px;
  line-height: 32px;
  color: #333333;
}
.page-root .user[data-v-dacc7602] {
  margin-top: 25px;
  display: flex;
  align-items: center;
}
.page-root .user-avatar[data-v-dacc7602] {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  margin-right: 9px;
  overflow: hidden;
}
.page-root .user-avatar img[data-v-dacc7602] {
  width: 100%;
  height: 100%;
}
.page-root .user-name[data-v-dacc7602] {
  font-size: 14px;
  line-height: 14px;
  color: #333333;
}
.page-root .user .publish-time[data-v-dacc7602] {
  margin-top: 8px;
  font-size: 12px;
  line-height: 12px;
  color: #999999;
}
.page-root .cover-img[data-v-dacc7602] {
  display: block;
  width: 100%;
  margin-top: 20px;
}
.page-root .content[data-v-dacc7602] {
  margin-top: 20px;
}
.page-root .content-item[data-v-dacc7602] {
  margin-bottom: 20px;
}
.page-root .content-item-title[data-v-dacc7602] {
  margin-bottom: 8px;
  font-family: PingFangSC-Medium;
  font-size: 16px;
  color: #333333;
  position: relative;
  word-break: break-all;
}
.page-root .content-item-title .number-icon[data-v-dacc7602] {
  width: 16px;
  height: 16px;
  background: linear-gradient(to bottom right, #0CEEEF, #00BBBC) 100% no-repeat;
  text-align: center;
  display: inline-block;
  font-size: 13px;
  margin-right: 8px;
  line-height: 16px;
  color: #fff;
  font-family: PingFangSC-Medium;
  border-radius: 3px;
  position: relative;
  top: -1px;
}
.page-root .content-item-img[data-v-dacc7602] {
  display: block;
  width: 100%;
  margin-top: 20px;
}
.page-root .content-item-p[data-v-dacc7602] {
  font-family: PingFangSC-Regular;
  font-size: 14px;
  color: #333333;
  word-break: break-all;
}
.page-root .feeds[data-v-dacc7602] {
  width: 300px;
  padding-top: 32px;
}
.page-root .feeds-title[data-v-dacc7602] {
  font-size: 20px;
  color: #333333;
}
.page-root .feeds-content[data-v-dacc7602] {
  margin-top: 25px;
}
.page-root .feeds .feed-item[data-v-dacc7602] {
  display: block;
  margin-bottom: 24px;
  cursor: pointer;
}
.page-root .feeds .feed-item:hover .feed-img img[data-v-dacc7602] {
  transform: scale(1.1);
}
.page-root .feeds .feed-item:hover .feed-title[data-v-dacc7602] {
  color: #00CECF;
}
.page-root .feeds .feed-item .feed-img[data-v-dacc7602] {
  width: 300px;
  height: 146px;
  overflow: hidden;
}
.page-root .feeds .feed-item .feed-img img[data-v-dacc7602] {
  display: block;
  width: 100%;
  transition: transform 0.3s linear;
}
.page-root .feeds .feed-item .feed-title[data-v-dacc7602] {
  margin-top: 8px;
  font-size: 14px;
  font-weight: normal;
  color: #333333;
  transition: color 0.1s linear;
}
.page-root .feeds .feed-item.feed-item-download[data-v-dacc7602] {
  position: relative;
}
.page-root .feeds .feed-item.feed-item-download:hover .feed-download[data-v-dacc7602] {
  display: block;
}
.page-root .feeds .feed-item .feed-download[data-v-dacc7602] {
  position: absolute;
  display: none;
  right: -100px;
  top: 0;
  width: 150px;
  height: 200px;
}
.page-root .feeds .feed-item .feed-download-img[data-v-dacc7602] {
  height: 150px;
  border-radius: 10px 10px 0 0;
  overflow: hidden;
  background: linear-gradient(left top, #60e3ad, #5bced0);
}
.page-root .feeds .feed-item .feed-download-img img[data-v-dacc7602] {
  display: block;
  width: 120px;
  height: 120px;
  margin: 15px auto 0;
}
.page-root .feeds .feed-item .feed-download-text[data-v-dacc7602] {
  padding-top: 10px;
  height: 50px;
  font-size: 12px;
  line-height: 15px;
  color: #333;
  border-radius: 0 0 10px 10px;
  border-width: 0 2px 2px;
  border-style: solid;
  border-color: #5bced0;
  text-align: center;
  background: #FFF;
}
.no-data[data-v-dacc7602] {
  display: block;
  margin: 0 auto;
  font-size: 18px;
  text-align: center;
  color: #00CECF;
}