.news-page,
.news-detail-page { color: #707070; background: #f2f2f2; }
.news-page { overflow: hidden; font-family: -apple-system, "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Arial, sans-serif; font-size: 1rem; line-height: 1; }
.video-page { color: #707070; background: #fff; font-family: -apple-system, "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Arial, sans-serif; font-size: 1rem; line-height: 1; }

.editorial-banner { position: relative; width: 100%; overflow: hidden; }
.editorial-banner picture,
.editorial-banner img { width: 100%; display: block; }
.editorial-banner h1 { position: absolute; top: 50%; left: 22.5rem; margin: 0; color: #f5f5f5; font-size: 3rem; font-weight: 300; line-height: 1.2; transform: translateY(-50%); }

/* News index */
.news-category,
.news-listing { width: 80vw; margin-inline: auto; }
.news-category { padding-top: 5.625rem; display: flex; justify-content: flex-end; }
.editorial-banner--news .editorial-banner__headline { position: absolute; top: 50%; left: 22.5rem; transform: translateY(-50%); animation: news-banner-enter 2s linear 1; }
.editorial-banner--news h1 { position: static; margin: 0 0 2.6875rem; color: #e3e3e3; font-size: 3rem; font-weight: 300; line-height: 1; transform: none; }
@keyframes news-banner-enter {
  from { top: 0; opacity: 0; }
  to { top: 50%; opacity: 1; }
}
.news-category__select { position: relative; width: 100%; height: 4.875rem; text-align: right; }
.news-category__select input { width: 20.5rem; height: 4.875rem; padding: 0 1.75rem; display: inline-block; color: #545454; background: #fafafa; border: 0; border-radius: .125rem; box-sizing: border-box; opacity: 1; font-family: Arial, sans-serif; font-size: 1.5rem; font-weight: 300; line-height: normal; }
.news-category__select input:focus-visible { outline: 0; }
.news-category__toggle { position: absolute; top: 0; right: 0; width: 5rem; height: 4.875rem; padding: 0; color: #000; background: #ccc; border: 0; cursor: pointer; display: grid; place-items: center; transition: background-color .2s ease; }
.news-category__chevron { width: 1.875rem; height: 1.875rem; display: block; color: #fff; transition: transform .3s ease; }
.news-category__toggle:hover { background: #e3540b; }
.news-category__select.is-open .news-category__chevron { transform: rotate(180deg); }
.news-category__options { position: absolute; z-index: 8; top: 4.875rem; right: 0; width: 20.5rem; max-height: 0; padding: 0; overflow: auto; background: #fff; box-sizing: border-box; text-align: left; transition: max-height 1s ease, padding 1s ease; }
.news-category__select.is-open .news-category__options { max-height: 10.9375rem; padding: .5rem 0; }
.news-category__options a { height: 3.5rem; padding: .25rem .25rem .25rem 1.75rem; display: block; color: #707070; box-sizing: border-box; font-size: 1.5rem; font-weight: 300; line-height: 3rem; }
.news-category__options a:hover,
.news-category__options a:focus-visible { color: #f0f0f0; background: #e3540b; outline: 0; }
.news-listing { margin-top: 2.875rem; padding-bottom: 6.1875rem; }
.news-years { position: relative; height: 4.875rem; margin-bottom: 3.125rem; overflow: hidden; background: transparent; border: 0; }
.news-years__track { width: 100%; height: 100%; display: flex; gap: .25rem; overflow: hidden; scroll-behavior: smooth; }
.news-years a { min-width: 0; min-height: 0; height: 4.875rem; flex: 0 0 calc((100% - .75rem) / 4); display: grid; place-items: center; color: #707070; background: #f7f7f7; border: 0; box-sizing: border-box; font-size: 1.5rem; font-weight: 300; line-height: 4.875rem; }
.news-years a:hover,
.news-years a.is-active { color: #707070; background: #f7f7f7; }
.news-years > button { position: absolute; z-index: 2; top: 0; width: 5rem; height: 4.875rem; padding: 0; display: grid; place-items: center; color: #fff; background: #ccc; border: 0; cursor: pointer; font-size: 1rem; transition: background-color .2s ease, opacity .2s ease; }
.news-years > button:first-of-type { left: 0; border: 0; }
.news-years > button:last-of-type { right: 0; border: 0; }
.news-years > button:disabled { cursor: default; opacity: .35; }
.news-years > button span { width: .625rem; height: .625rem; display: block; border-top: 2px solid #fff; border-right: 2px solid #fff; }
.news-years > button:first-of-type span { transform: rotate(-135deg); }
.news-years > button:last-of-type span { transform: rotate(45deg); }
.news-listing ul { margin: 0; padding: 0; list-style: none; }
.news-listing li { border-bottom: 1px solid #e6e6e6; cursor: pointer; }
.news-listing li > a { min-height: 0; padding: 1.3125rem 0 2.0625rem; display: flex; align-items: center; justify-content: space-between; color: #707070; }
.news-listing__primary,
.news-listing__entry { display: flex; align-items: center; }
.news-listing time { margin-right: 10.875rem; color: #707070; font-size: 1.25rem; font-weight: 300; line-height: 1; }
.news-listing h2 { width: max-content; min-width: 0; max-width: 40vw; margin: 0; overflow: hidden; font-size: 1.25rem; font-weight: 300; line-height: 1; transition: color .2s ease; }
.news-listing__entry { flex: 0 0 auto; font-size: 1.25rem; font-weight: 300; line-height: 1; white-space: nowrap; }
.news-listing__icon { width: 1.375rem; height: 1.375rem; margin-left: .5625rem; display: grid; place-items: center; color: #707070; border: 1px solid #e3540b; border-radius: .125rem; box-sizing: border-box; }
.news-listing__icon i { display: inline-block; color: #e3540b; font-size: 1rem; line-height: 1; transform: rotate(270deg); }

/* News article */
.news-article-shell { width: auto; max-width: 75rem; margin: 0 auto; padding: 2.5rem 1.25rem; box-sizing: content-box; }
.news-article { padding: 2.5rem; background: #fff; border-radius: 2px; box-shadow: 0 1px 3px rgb(0 0 0 / 10%); }
.news-article h1 { margin: 0 0 1.25rem; color: #4c4c4c; font-size: 2rem; font-weight: 300; line-height: 1.4; }
.news-article__meta { margin-bottom: 1.875rem; padding-bottom: 1.875rem; display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; color: #999; border-bottom: 1px solid #eee; font-size: 1rem; line-height: 1; }
.news-article__meta > * { font-size: .875rem; line-height: 1rem; }
.news-article__body { color: #707070; font-size: 1rem; font-weight: 400; line-height: 1.8; }
.news-article__body p { margin: 0 0 1em; }
.news-article__body h2,
.news-article__body h3 { margin: 1.75em 0 .75em; color: #555; font-weight: 400; line-height: 1.5; }
.news-article__body h2 { font-size: 1.5rem; }
.news-article__body h3 { font-size: 1.25rem; }
.news-article__body img { max-width: 100%; height: auto; margin: 1.25rem auto; display: block; }
.news-share { margin-top: 1.875rem; padding-top: 1.25rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .9375rem; border-top: 1px solid #eee; font-family: -apple-system, "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Arial, sans-serif; font-size: 1rem; font-weight: 400; line-height: 1rem; }
.news-share .news-share__button { padding: .5rem .9375rem; display: flex; align-items: center; gap: .3125rem; color: #fff; background: #707070; border: 0; border-radius: .25rem; cursor: pointer; font: 400 13.3333px Arial, sans-serif; line-height: normal; text-decoration: none; transition: background-color .3s ease; }
.news-share .news-share__button i { font-family: "iconfont" !important; font-size: 1rem; font-style: normal; line-height: 1; }
.news-share .news-share__wechat { background: #07c160; }
.news-share .news-share__wechat:hover { background: #069951; }
.news-share .news-share__weibo { background: #e6162d; }
.news-share .news-share__weibo:hover { background: #c11325; }
.news-share .news-share__facebook { background: #1877f2; }
.news-share .news-share__facebook:hover { background: #1464cc; }
.news-share .news-share__twitter { background: #1da1f2; }
.news-share .news-share__twitter:hover { background: #1886cc; }
.news-share .news-share__copy:hover { background: #5a5a5a; }

/* Video index */
.editorial-banner--video .editorial-banner__headline { position: absolute; top: 50%; left: 22.5rem; transform: translateY(-50%); animation: video-banner-enter 2s linear 1; }
.editorial-banner--video h1 { position: static; margin: 0 0 2.6875rem; color: #e3e3e3; font-size: 3rem; font-weight: 300; line-height: 1; transform: none; }
@keyframes video-banner-enter {
  from { top: 0; opacity: 0; }
  to { top: 50%; opacity: 1; }
}
.video-sections { width: calc(100% - 2.5rem); max-width: 75rem; margin: 5.25rem auto calc(16.375rem + .0381rem); }
.video-section { margin-bottom: 0; }
.video-section.is-loading { position: relative; min-height: 12rem; }
.video-section.is-loading::before { position: absolute; z-index: 5; inset: 0; content: ""; background: rgb(255 255 255 / 70%); }
.video-section.is-loading::after { position: absolute; z-index: 6; top: 50%; left: 50%; width: 1.5rem; height: 1.5rem; content: ""; border: 2px solid #d8dce5; border-top-color: #909399; border-radius: 50%; transform: translate(-50%, -50%); animation: video-loading-spin .75s linear infinite; }
@keyframes video-loading-spin { to { transform: translate(-50%, -50%) rotate(360deg); } }
.video-section > header { margin-bottom: 1.875rem; padding-bottom: .9375rem; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #bfbfbf; }
.video-section h2 { margin: 0; color: #333; font-size: 1.375rem; font-weight: 400; line-height: 1; }
.video-section > header a { color: #999; cursor: pointer; font-size: .875rem; line-height: 1; text-decoration: none; transition: color .3s ease; }
.video-section > header a:hover { color: #333; }
.video-section__grid { margin-bottom: 3rem; display: flex; flex-wrap: wrap; justify-content: space-between; }
.video-tile { width: calc(50% - .5rem); margin-bottom: 1.25rem; padding: 0; display: block; overflow: hidden; background: #fff; border: 1px solid #ebeef5; transition: box-shadow .3s ease; }
.video-tile:hover { box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%); }
.video-tile__body { height: 100%; padding: 1.25rem; display: flex; flex-direction: column; box-sizing: border-box; }
.video-thumbnail { position: relative; width: 100%; padding: 0; display: block; overflow: hidden; aspect-ratio: 16 / 9; background: #111; border: 0; cursor: pointer; }
.video-tile img { width: 100%; height: 100%; display: block; object-fit: cover; }
.video-thumbnail .video-indicator { position: absolute; z-index: 1; right: .625rem; bottom: .625rem; padding: .3125rem .5rem; display: block; color: #fff; background: rgb(0 0 0 / 70%); border-radius: .25rem; font-size: .75rem; line-height: 1; transition: opacity .3s ease; }
.video-thumbnail .video-play-mark { width: 1em; height: 1em; display: block; overflow: visible; }
.video-thumbnail .video-overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; background: rgb(0 0 0 / 50%); opacity: 0; transition: opacity .3s ease; }
.video-thumbnail .video-play-icon { width: 1em; height: 1em; display: block; font-size: 3rem; transition: transform .3s ease; }
.video-thumbnail:hover .video-indicator { opacity: 0; }
.video-thumbnail:hover .video-overlay { opacity: 1; }
.video-thumbnail:hover .video-play-icon { transform: scale(1.1); }
.video-tile__text { display: flex; flex-direction: column; gap: .5rem; }
.video-tile h3 { margin: 1vw 0 .5vw; color: #666; font-size: 1.25rem; font-weight: 400; line-height: 1.625rem; }
.video-tile p { height: 2.5rem; margin: 0; overflow: hidden; color: #666; font-size: .875rem; font-weight: 400; line-height: 1.375rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.video-tile time { margin-top: auto; color: #818181; font-size: .75rem; line-height: 1; text-align: right; }
.video-paging { position: relative; margin: 0 0 3.9375rem; display: flex; justify-content: center; gap: 1.25rem; border-top: 1px solid #bfbfbf; line-height: 1; }
.video-paging a { position: relative; min-width: 1.25rem; padding-top: .75rem; color: #b3b3b3; font-size: .875rem; font-weight: 400; line-height: 1rem; text-align: center; }
.video-paging a::before { position: absolute; top: -1px; left: 0; width: 0; height: 1px; content: ""; background: #ff5733; transition: width .2s ease; }
.video-paging a:hover,
.video-paging a.is-current { color: #e3540b; }
.video-paging a:hover::before,
.video-paging a.is-current::before { width: 100%; }

@media (min-width:1025px) and (max-width:1600px) {
  .news-listing li > a { min-height: 4.75rem; box-sizing: border-box; }
}

@media (max-width:1024px) {
  .editorial-banner--news .editorial-banner__headline { left: 5rem; transform: translateY(0); }
  .editorial-banner--news h1 { margin-bottom: 1.25rem; }
  .editorial-banner--video .editorial-banner__headline { left: 11.25rem; }
  .news-category__select { height: 2.5rem; }
  .news-category__select input { height: 2.5rem; font-size: .875rem; }
  .news-category__toggle { width: 2.5rem; height: 2.5rem; }
  .news-category__options { top: 2.5rem; }
  .news-years { height: 2.5rem; }
  .news-years > button { width: 2.5rem; height: 2.5rem; }
  .news-years a { height: 2.5rem; font-size: .875rem; line-height: 2.5rem; }
  .news-listing li > a { min-height: 4.75rem; box-sizing: border-box; }
  .news-listing h2,
  .news-listing time,
  .news-listing__entry { font-size: .75rem; line-height: 1; }
  .news-listing h2,
  .news-listing time { line-height: 1; }
}

@media (min-width:1024px) and (max-width:1199px) {
  .video-sections { width: calc(100% - 5rem); }
}

@media (min-width:768px) and (max-width:1023px) {
  .video-sections { width: calc(100% - 3.75rem); }
}

@media (min-width:768px) and (max-width:800px) {
  .news-listing h2 { max-width: 38.55vw; }
}

@media (max-width:767px) {
  .editorial-banner h1 { top: auto; bottom: 3.125rem; left: 4rem; font-size: 1.875rem; font-weight: 500; line-height: 1; transform: none; }
  .editorial-banner--news .editorial-banner__headline { top: auto; bottom: 3.125rem; left: 4rem; transform: none; }
  .editorial-banner--news h1 { position: static; margin-bottom: 1.25rem; font-size: 1.875rem; font-weight: 500; line-height: 1; transform: none; }
  .editorial-banner--video .editorial-banner__headline { top: auto; bottom: 0; left: 4rem; }
  .editorial-banner--video h1 { position: static; margin-bottom: .5rem; font-size: 1.875rem; font-weight: 500; line-height: 1; transform: none; }
  .news-category,
  .news-listing { width: 80vw; padding-right: 4rem; padding-left: 4rem; box-sizing: border-box; }
  .news-category { padding-top: 1.25rem; justify-content: flex-end; }
  .news-category__select { width: 100%; height: 3.75rem; }
  .news-category__select input { height: 3.75rem; color: #b3b3b3; font-size: 1.5rem; }
  .news-category__toggle { width: 3.75rem; height: 3.75rem; }
  .news-category__options { top: 3.75rem; }
  .news-listing { margin-top: 1.25rem; padding-bottom: 5rem; }
  .news-years { height: 3.75rem; margin-bottom: 0; }
  .news-years > button { width: 3.75rem; height: 3.75rem; }
  .news-years a { height: 3.75rem; flex-basis: calc((100% - .25rem) / 2); font-size: 1.5rem; line-height: 3.75rem; }
  .news-listing ul { margin-bottom: 2.5rem; }
  .news-listing li > a { min-height: 0; padding: 1.25rem 0 1.375rem; flex-direction: column; align-items: flex-start; gap: 1.25rem; }
  .news-listing__primary { flex-direction: column; align-items: flex-start; gap: .625rem; }
  .news-listing time { margin: 0; display: block; font-size: 1rem; line-height: 1.125rem; }
  .news-listing h2 { width: auto; max-width: 40vw; color: #707070; font-size: 1.125rem; font-weight: 400; line-height: 1.125rem; white-space: normal; }
  .news-listing__entry { margin: 0; padding: 0; display: flex; font-size: 1rem; line-height: 1; }
  .news-listing__icon { width: 1.125rem; height: 1.125rem; margin-left: .5625rem; }
  .news-article-shell { padding: 1.25rem; box-sizing: border-box; }
  .news-article { padding: 1.25rem; }
  .news-article h1 { font-size: 1.5rem; }
  .news-article__meta { margin-bottom: 1.25rem; padding-bottom: 1.25rem; }
  .news-share { justify-content: center; }
  .video-sections { width: calc(100% - 2.5rem); margin-top: 3rem; margin-bottom: 16.375rem; }
  .video-section { margin-bottom: 0; }
  .video-section > header { margin-bottom: 1.875rem; padding-bottom: .9375rem; }
  .video-tile { width: 100%; }
  .video-thumbnail .video-indicator { right: .3125rem; bottom: .3125rem; padding: .1875rem .375rem; font-size: .625rem; }
  .video-thumbnail .video-play-icon { font-size: 2.25rem; }
  .video-tile h3 { font-size: 1rem; line-height: 1.375rem; }
  .video-tile p { height: auto; max-height: 2.25rem; font-size: .75rem; line-height: 1.125rem; }
  .video-tile time { font-size: .625rem; }
  .video-paging { height: 1.8125rem; }
}

@media (max-width:520px) {
  .news-category,
  .news-listing { width: 80vw; padding-right: 1.25rem; padding-left: 1.25rem; box-sizing: content-box; }
  .news-category__select { width: 100%; height: 2.5rem; }
  .news-category__select input { width: 17.5rem; height: 2.5rem; font-size: 1.125rem; }
  .news-category__toggle { width: 2.5rem; height: 2.5rem; }
  .news-category__chevron { width: 1.5rem; height: 1.5rem; }
  .news-category__options { top: 2.5rem; width: 17.5rem; }
  .news-category__options a { height: 2.5rem; font-size: 1.125rem; line-height: 2rem; }
  .news-years { height: 2.5rem; }
  .news-years > button { width: 2.5rem; height: 2.5rem; }
  .news-years a { height: 2.5rem; font-size: 1.125rem; line-height: 2.5rem; }
  .news-listing { padding-bottom: 3.6875rem; }
  .news-article-shell { padding: .9375rem; }
  .news-article { padding: .9375rem; }
  .news-article h1 { font-size: 1.25rem; }
  .news-article__body { font-size: .875rem; }
  .news-share__break { display: none; }
  .video-sections { margin-bottom: calc(16.375rem + .0762rem); }
}

@media (max-width:450px) {
  .page--news-index #main-content,
  .page--video-index #main-content { margin-top: -2.5rem; }
  .editorial-banner--video .editorial-banner__headline { left: 1.25rem; }
  .editorial-banner--video h1 { font-size: 1.5rem; }
}

@media (width:768px) {
  .page--news-index #main-content,
  .page--news-detail #main-content,
  .page--video-index #main-content { padding-top: 2.5rem; }
}