/*采用rem为单位做移动端页面*/
@media screen and (min-width: 750px) {
  html {
    font-size: 75px !important;
  }
}
* {
  padding: 0;
  margin: 0;
  list-style: none;
  text-decoration: none;
}
html {
  width: 100%;
}
*,
:after,
:before {
  box-sizing: border-box;
}
article,
aside,
blockquote,
body,
button,
dd,
details,
div,
dl,
dt,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
hr,
input,
legend,
li,
menu,
nav,
ol,
p,
section,
td,
textarea,
th,
ul {
  margin: 0;
  padding: 0;
}
img {
  border-style: none;
}
#app,
html,
html body {
  height: 100%;
}
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
}
#app .wraps {
  min-height: 100%;
  min-width: 920px;
  display: flex;
  flex-direction: column;
  background: #f5f5f5;
}
#app .wraps a {
  color: #2d8cf0;
  background: 0 0;
  text-decoration: none;
  outline: 0;
  cursor: pointer;
  transition: color 0.2s ease;
}
#app .wraps .head1 {
  min-width: 920px;
  width: 100%;
  top: 0;
  position: fixed;
}
#app .wraps .header-wraps {
  z-index: 999;
}
#app .wraps .header-wraps .head-box {
  height: 60px;
  background: #fff;
  box-shadow: 0 0 5px #ccc;
}
#app .wraps .header-wraps .head-box .head {
  max-width: 1446px;
  height: 100%;
  padding: 0 50px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#app .wraps .header-wraps .head-box .head .logo {
  width: 336px;
}
#app .wraps .header-wraps .head-box .head .logo img {
  width: 100%;
  display: block;
}
#app .wraps .header-wraps .head-box .head .header-right {
  display: flex;
  align-items: center;
}
#app .wraps .header-wraps .head-box .head .header-right .ivu-tooltip {
  display: inline-block;
}
#app .wraps .header-wraps .head-box .head .header-right .ivu-tooltip .ivu-tooltip-rel {
  position: relative;
  width: inherit;
  display: inline-block;
}
#app .wraps .header-wraps .head-box .head .header-right .ivu-tooltip .ivu-tooltip-rel .ivu-avatar.ivu-avatar-icon {
  font-size: 18px;
}
#app .wraps .header-wraps .head-box .head .header-right .ivu-tooltip .ivu-tooltip-rel .ivu-avatar {
  display: inline-block;
  text-align: center;
  background: #ccc;
  color: #fff;
  white-space: nowrap;
  position: relative;
  overflow: hidden;
  vertical-align: middle;
  width: 32px;
  height: 32px;
  line-height: 32px;
  border-radius: 50%;
}
#app .wraps .header-wraps .head-box .head .header-right .outLoing {
  margin: 0 15px;
  line-height: 1;
  display: inline-block;
  cursor: pointer;
  color: #666;
  font-size: 16px;
}
#app .wraps .content {
  max-width: 1496px;
  min-width: 920px;
  width: 100%;
  padding: 0 30px;
  margin: 80px auto 80px auto;
  display: flex;
  flex-direction: column;
  flex: 1;
}
#app .wraps .content .nav-box {
  padding: 15px 15px;
  background: #fff;
  border-radius: 6px;
  box-shadow: 0 2px 8px #ccc;
}
#app .wraps .content .nav-box .nav-heid {
  min-height: 40px;
}
#app .wraps .content .nav-box .nav-heid .nav {
  float: left;
  padding: 5px 8px;
  margin: 5px 2px;
  font-size: 16px;
  color: #1c1f21;
  font-family: 微软雅黑;
  cursor: pointer;
  border: 1px solid transparent;
}
#app .wraps .content .nav-box .nav-heid .nav-active {
  color: #f20d0d;
}
#app .wraps .content .video-list {
  margin-top: 40px;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fill, 260px);
  gap: 30px 12px;
  justify-content: space-between;
  position: relative;
}
#app .wraps .content .video-list .video-item {
  width: 100%;
  border-radius: 5px;
  background-color: #fff;
  box-shadow: 0 2px 8px #ccc;
  overflow: hidden;
}
#app .wraps .content .video-list .video-item.actived{
  border:1px solid red;
}
#app .wraps .content .video-list .video-item a {
  color: #2d8cf0;
  background: 0 0;
  text-decoration: none;
  outline: 0;
  cursor: pointer;
  transition: color 0.2s ease;
}
#app .wraps .content .video-list .video-item a .video-item-img {
  display: block;
  width: 100%;
  height: 140px;
  background-color: #e5e5e5;
  border-bottom: 1px #92da5a solid;
}
#app .wraps .content .video-list .video-item a .video-item-title {
  padding: 0 10px;
  margin: 5px 0;
  font-size: 16px;
  text-align: left;
  color: #606470;
  font-weight: 700;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
#app .wraps .footer-wraps {
  height: 102px;
  background: #212121;
}
#app .wraps .footer-wraps .footer-cont {
  max-width: 1446px;
  width: 100%;
  height: 100%;
  padding: 0 50px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
#app .wraps .footer-wraps .footer-cont .footer-beian {
  color: #eaeaea;
  font-size: 16px;
  line-height: 1;
}
#app .wraps .footer-wraps .footer-cont .footer-beian a {
  margin: 10px 0;
  display: inline-block;
}
#app .wraps .footer-wraps .footer-cont .footer-QR {
  display: none;
  margin-left: 30px;
  justify-content: flex-start;
  align-items: center;
}
#app .wraps .footer-wraps .footer-cont .footer-QR .QR-box {
  cursor: pointer;
  margin: 0 10px;
}
#app .wraps .footer-wraps .footer-cont .footer-QR .QR-box .QR-icon {
  width: 32px;
  height: 32px;
  padding: 4px;
  border: 1px solid #8a8a8a;
  border-radius: 50%;
  display: block;
}
#app .wraps .footer-wraps .footer-cont .footer-QR .QR-box .QR-icon img {
  width: 100%;
  display: block;
}
#app .wraps .foot {
  min-width: 920px;
  margin-top: auto;
}
@media screen and (max-width: 768px) {
  #app .wraps {
    width: 100%;
    min-width: 0;
    margin: 0 auto;
  }
  #app .wraps .head1 {
    width: 100%;
    min-width: 0;
  }
  #app .wraps .header-wraps .head-box {
    height: 0.7rem;
  }
  #app .wraps .header-wraps .head-box .head {
    padding: 0 0.25rem;
  }
  #app .wraps .header-wraps .head-box .head .logo {
    width: 3.6rem;
  }
  #app .wraps .content {
    min-width: 0;
    margin: 1rem 0 0 0;
    padding: 0 0;
  }
  #app .wraps .content .nav-box {
    padding: 0.1rem;
    position: relative;
    box-shadow: 0 7px 7px -6px #ccc;
    margin: 0 0.2rem;
  }
  #app .wraps .content .nav-box .nav-heid {
    max-height: 0.85rem;
    min-height: 0.5rem;
    overflow: hidden;
  }
  #app .wraps .content .nav-box .nav-heid .nav {
    font-size: 0.2rem;
    padding: 0.1rem 0.1rem;
    margin: 0;
    line-height: 1;
    font-family: Arial, Helvetica, sans-serif;
  }
  #app .wraps .content .nav-box .nav-btn {
    width: 1.2rem;
    height: 0.2rem;
    background: #fff;
    position: absolute;
    bottom: -0.2rem;
    left: 50%;
    transform: translateX(-50%);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    box-shadow: 0 7px 7px -6px #ccc;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAUCAYAAADhj08IAAABJWlDQ1BDSUUgUkdCAAAokZWPv0rDUBSHvxsEi0IQvA9wl4KgQqhuTklbSkGkVIckW5OGKtIk3Fz/FHwM38Cli6uTs5OgUHDyEZydhDpEWqFg8YMD3/kdOJwD1pbb8JrWBgxTo7stT/lBqFZfqbDOJvsc9OIidzudQ4A0SxMW+HxDAEx23YbXXJz/yVqcawN8AbV+UsQgHCC6MrkBcQvI6Dw3IMaA1CfdOohHwB6U/gzYUenvgK39IATxAciBH4RgAciodAlIk1wbgHqWj/TZ4NSomuM4yu1nUaKOR4VJhoVqp3Gm80z3TNIHyvsAqNTbTdVtef98dzl+ECoAxKzkLPtFfKEvf1RYe8v7+Y6bO9h5mE6n9/PsaAiTKqyE82z7CajCS/Ubx/NOrIi0AjMAAAAJcEhZcwAACxMAAAsTAQCanBgAAAUIaVRYdFhNTDpjb20uYWRvYmUueG1wAAAAAAA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjYtYzE0MiA3OS4xNjA5MjQsIDIwMTcvMDcvMTMtMDE6MDY6MzkgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIiB4bWxuczpwaG90b3Nob3A9Imh0dHA6Ly9ucy5hZG9iZS5jb20vcGhvdG9zaG9wLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdEV2dD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlRXZlbnQjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDIwLTA2LTIyVDA5OjQzOjE4KzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAyMC0wNi0yMlQwOTo0NzoxMyswODowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAyMC0wNi0yMlQwOTo0NzoxMyswODowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJDSUUgUkdCIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOmMwNDU5NTJiLTJkMWUtNWI0OS04Y2IzLTg1NjgwNmNlNzViOCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpjMDQ1OTUyYi0yZDFlLTViNDktOGNiMy04NTY4MDZjZTc1YjgiIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpjMDQ1OTUyYi0yZDFlLTViNDktOGNiMy04NTY4MDZjZTc1YjgiPiA8eG1wTU06SGlzdG9yeT4gPHJkZjpTZXE+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJjcmVhdGVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOmMwNDU5NTJiLTJkMWUtNWI0OS04Y2IzLTg1NjgwNmNlNzViOCIgc3RFdnQ6d2hlbj0iMjAyMC0wNi0yMlQwOTo0MzoxOCswODowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6gjINhAAABUUlEQVRIib3Sv0oDQRDH8e/sdT6AYGeqcAo+gJW1EMIRLuCDCNa2PokJYQnXWFj4BlYJd42xt7IRhNyNTZQzXszd3p9fs7Azs/uBXQEYjUaXWZYFIvKuqo/W2gc6TNH9AhAEwQo4zvWOrbXTLlBBEITAJLf1aq3tSRiGvfV6/VIw0zquAAWAMcY30+l0par3BXOTzWCnKBGJZrNZbABU9RZYdIXbhQIWaZreAHgASZK89fv9JxG5AA63mkPf95dxHC/bRmVZNp7P58sfWFe4sqhfsLZxVVB/YG3hqqIKYU3jXFA7YU3hXFH/wuri6qD2wlxxdVGlYFVxTaAApEzTd4bD4YkxZgKcFpTHm7U2qjKsBK4olVFQ8inz2fOsjaCcYBVwzihnWB4HnIvIUb6mqs+qeuWKAoc/tp3BYHDged61iJwBn6qapGl6F0XRR51zvwD2IzlSeg9I1QAAAABJRU5ErkJggg==);
    background-position: 50%;
    background-size: 0.2rem;
    background-repeat: no-repeat;
  }
  #app .wraps .content .nav-box .nav-btn-active {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAUCAYAAADhj08IAAABJWlDQ1BDSUUgUkdCAAAokZWPv0rDUBSHvxsEi0IQvA9wl4KgQqhuTklbSkGkVIckW5OGKtIk3Fz/FHwM38Cli6uTs5OgUHDyEZydhDpEWqFg8YMD3/kdOJwD1pbb8JrWBgxTo7stT/lBqFZfqbDOJvsc9OIidzudQ4A0SxMW+HxDAEx23YbXXJz/yVqcawN8AbV+UsQgHCC6MrkBcQvI6Dw3IMaA1CfdOohHwB6U/gzYUenvgK39IATxAciBH4RgAciodAlIk1wbgHqWj/TZ4NSomuM4yu1nUaKOR4VJhoVqp3Gm80z3TNIHyvsAqNTbTdVtef98dzl+ECoAxKzkLPtFfKEvf1RYe8v7+Y6bO9h5mE6n9/PsaAiTKqyE82z7CajCS/Ubx/NOrIi0AjMAAAAJcEhZcwAACxMAAAsTAQCanBgAAAasaVRYdFhNTDpjb20uYWRvYmUueG1wAAAAAAA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjYtYzE0MiA3OS4xNjA5MjQsIDIwMTcvMDcvMTMtMDE6MDY6MzkgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIiB4bWxuczpwaG90b3Nob3A9Imh0dHA6Ly9ucy5hZG9iZS5jb20vcGhvdG9zaG9wLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdEV2dD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlRXZlbnQjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDIwLTA2LTIyVDA5OjQzOjE4KzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAyMC0wNi0yMlQxMDoxOTo1NyswODowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAyMC0wNi0yMlQxMDoxOTo1NyswODowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJDSUUgUkdCIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjYzYzg5M2QyLWEzM2YtM2E0OC1iMzZhLTI3Y2ViNjRmN2E4YiIgeG1wTU06RG9jdW1lbnRJRD0iYWRvYmU6ZG9jaWQ6cGhvdG9zaG9wOmI5ZDE5MWNhLWEyMTQtNjY0OC04ODdkLTkwMWZmZDlhYWFhYSIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOmMwNDU5NTJiLTJkMWUtNWI0OS04Y2IzLTg1NjgwNmNlNzViOCI+IDx4bXBNTTpIaXN0b3J5PiA8cmRmOlNlcT4gPHJkZjpsaSBzdEV2dDphY3Rpb249ImNyZWF0ZWQiIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6YzA0NTk1MmItMmQxZS01YjQ5LThjYjMtODU2ODA2Y2U3NWI4IiBzdEV2dDp3aGVuPSIyMDIwLTA2LTIyVDA5OjQzOjE4KzA4OjAwIiBzdEV2dDpzb2Z0d2FyZUFnZW50PSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIi8+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJzYXZlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDo3YmU5MWNlZS0yYTMzLWQ5NDQtYmZkZi1iMDU0ZGFhMzkxYTYiIHN0RXZ0OndoZW49IjIwMjAtMDYtMjJUMTA6MTk6NTcrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiIHN0RXZ0OmNoYW5nZWQ9Ii8iLz4gPHJkZjpsaSBzdEV2dDphY3Rpb249InNhdmVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOjYzYzg5M2QyLWEzM2YtM2E0OC1iMzZhLTI3Y2ViNjRmN2E4YiIgc3RFdnQ6d2hlbj0iMjAyMC0wNi0yMlQxMDoxOTo1NyswODowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgc3RFdnQ6Y2hhbmdlZD0iLyIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4HyJxNAAABRUlEQVRIib3Vv0rEMBwH8O8vKQg+gLO61NxNvoEvUEIp18nXcNRZEN/C6YSW0hdwdRIE+wcHXcXdrYnL3VG93vVP0v6WkPySXz4kgRAMw/O8Q875FRG5AA601q9VVd2lafpjUpdMFkspZ0T0QETn9XGt9YvW+jJJkmxymJRyxhhbApjvmPKmlAqH4vhIKAA4IqIL13WfyrL8Hh3WEWWM63WVLahw1S4bcr2vtfOJtaHiOH4siiITQmQAFv/yvU+uE6wLat2xhWuF9UHZxO2FDUHZwu2EmaBs4BphNlCmuC2YTZQJ7g9sDNRQ3AY2JmoIjk+F6otjAMA5v50CtY5VzbAhNSeiGwCgIAjOlFL5VKh6+L6/QMPf6jjOKa0mfAA4nhK1B/cZx/EJBwAhRElEXwAyxth1FEXJFChg8+aea/vf53n+/gsC3/u7M2K/MwAAAABJRU5ErkJggg==);
  }
  #app .wraps .content .video-list {
    margin-top: 0.6rem;
    grid-template-columns: repeat(auto-fill, 2.2rem);
    padding: 0.2rem;
  }
  #app .wraps .content .video-list .video-item a .video-item-img {
    height: 1.2rem;
  }
  #app .wraps .content .video-list .video-item a .video-item-title {
    padding: 0 0.1rem;
    margin: 5px 0;
    font-size: 0.16rem;
  }
  #app .wraps .foot {
    min-width: 0;
    height: 1.5rem;
  }
  #app .wraps .foot .footer-cont .footer-beian {
    font-size: 0.2rem;
  }
  #app .wraps .foot .footer-cont .footer-beian a {
    margin: 10px 0;
    display: inline-block;
  }
  #app .wraps .foot .footer-cont .footer-QR .QR-mobile {
    display: none;
  }
}
@media screen and (max-width: 640px) {
  input,input::-webkit-input-placeholder { /* Chrome, Opera, Safari */
    font-size: 0.28rem; /* 设置为所需的字体大小 */
  }
  input,input:-moz-placeholder { /* Firefox 18- */
    font-size: 0.28rem; /* 设置为所需的字体大小 */
  }
  input,input::-moz-placeholder { /* Firefox 19+ */
    font-size: 0.28rem; /* 设置为所需的字体大小 */
  }
  input,input:-ms-input-placeholder { /* Internet Explorer 10-11 */
    font-size: 0.28rem; /* 设置为所需的字体大小 */
  }
  .layui-btn{
    height: 0.6rem;
    line-height: 0.6rem;
    padding: 0 0.2rem;
    font-size: 0.28rem;
  }
  #app .wraps {
    width: 100%;
    min-width: 0;
    margin: 0 auto;
  }
  #app .wraps .head1 {
    width: 100%;
    min-width: 0;
  }
  #app .wraps .header-wraps .head-box {
    height: 1rem;
  }
  #app .wraps .header-wraps .head-box .head {
    padding: 0 0.25rem;
  }
  #app .wraps .header-wraps .head-box .head .logo {
    width: 4.8rem;
  }
  #app .wraps .content {
    min-width: 0;
    margin: 1.3rem 0 0 0;
    padding: 0 0;
  }
  #app .wraps .content .nav-box {
    padding: 0.1rem 0.1rem 0.15rem;
    position: relative;
    box-shadow: 0 7px 7px -6px #ccc;
  }
  #app .wraps .content .nav-box .nav-heid {
    max-height: 1.6rem;
    min-height: 0.7rem;
    overflow: hidden;
    transition: all 0.4s;
  }
  #app .wraps .content .nav-box .nav-heid .nav {
    font-size: 0.32rem;
    padding: 0.1rem 0.2rem;
    margin: 0;
    line-height: 1;
  }
  #app .wraps .content .nav-box .nav-btn {
    width: 1.5rem;
    height: 0.4rem;
    background: #fff;
    position: absolute;
    bottom: -0.4rem;
    left: 50%;
    transform: translateX(-50%);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    box-shadow: 0 7px 7px -6px #ccc;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAUCAYAAADhj08IAAABJWlDQ1BDSUUgUkdCAAAokZWPv0rDUBSHvxsEi0IQvA9wl4KgQqhuTklbSkGkVIckW5OGKtIk3Fz/FHwM38Cli6uTs5OgUHDyEZydhDpEWqFg8YMD3/kdOJwD1pbb8JrWBgxTo7stT/lBqFZfqbDOJvsc9OIidzudQ4A0SxMW+HxDAEx23YbXXJz/yVqcawN8AbV+UsQgHCC6MrkBcQvI6Dw3IMaA1CfdOohHwB6U/gzYUenvgK39IATxAciBH4RgAciodAlIk1wbgHqWj/TZ4NSomuM4yu1nUaKOR4VJhoVqp3Gm80z3TNIHyvsAqNTbTdVtef98dzl+ECoAxKzkLPtFfKEvf1RYe8v7+Y6bO9h5mE6n9/PsaAiTKqyE82z7CajCS/Ubx/NOrIi0AjMAAAAJcEhZcwAACxMAAAsTAQCanBgAAAUIaVRYdFhNTDpjb20uYWRvYmUueG1wAAAAAAA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjYtYzE0MiA3OS4xNjA5MjQsIDIwMTcvMDcvMTMtMDE6MDY6MzkgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIiB4bWxuczpwaG90b3Nob3A9Imh0dHA6Ly9ucy5hZG9iZS5jb20vcGhvdG9zaG9wLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdEV2dD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlRXZlbnQjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDIwLTA2LTIyVDA5OjQzOjE4KzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAyMC0wNi0yMlQwOTo0NzoxMyswODowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAyMC0wNi0yMlQwOTo0NzoxMyswODowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJDSUUgUkdCIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOmMwNDU5NTJiLTJkMWUtNWI0OS04Y2IzLTg1NjgwNmNlNzViOCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpjMDQ1OTUyYi0yZDFlLTViNDktOGNiMy04NTY4MDZjZTc1YjgiIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpjMDQ1OTUyYi0yZDFlLTViNDktOGNiMy04NTY4MDZjZTc1YjgiPiA8eG1wTU06SGlzdG9yeT4gPHJkZjpTZXE+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJjcmVhdGVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOmMwNDU5NTJiLTJkMWUtNWI0OS04Y2IzLTg1NjgwNmNlNzViOCIgc3RFdnQ6d2hlbj0iMjAyMC0wNi0yMlQwOTo0MzoxOCswODowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6gjINhAAABUUlEQVRIib3Sv0oDQRDH8e/sdT6AYGeqcAo+gJW1EMIRLuCDCNa2PokJYQnXWFj4BlYJd42xt7IRhNyNTZQzXszd3p9fs7Azs/uBXQEYjUaXWZYFIvKuqo/W2gc6TNH9AhAEwQo4zvWOrbXTLlBBEITAJLf1aq3tSRiGvfV6/VIw0zquAAWAMcY30+l0par3BXOTzWCnKBGJZrNZbABU9RZYdIXbhQIWaZreAHgASZK89fv9JxG5AA63mkPf95dxHC/bRmVZNp7P58sfWFe4sqhfsLZxVVB/YG3hqqIKYU3jXFA7YU3hXFH/wuri6qD2wlxxdVGlYFVxTaAApEzTd4bD4YkxZgKcFpTHm7U2qjKsBK4olVFQ8inz2fOsjaCcYBVwzihnWB4HnIvIUb6mqs+qeuWKAoc/tp3BYHDged61iJwBn6qapGl6F0XRR51zvwD2IzlSeg9I1QAAAABJRU5ErkJggg==);
    background-position: 50%;
    background-size: 0.3rem;
    background-repeat: no-repeat;
  }
  #app .wraps .content .nav-box .nav-btn-active {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAUCAYAAADhj08IAAABJWlDQ1BDSUUgUkdCAAAokZWPv0rDUBSHvxsEi0IQvA9wl4KgQqhuTklbSkGkVIckW5OGKtIk3Fz/FHwM38Cli6uTs5OgUHDyEZydhDpEWqFg8YMD3/kdOJwD1pbb8JrWBgxTo7stT/lBqFZfqbDOJvsc9OIidzudQ4A0SxMW+HxDAEx23YbXXJz/yVqcawN8AbV+UsQgHCC6MrkBcQvI6Dw3IMaA1CfdOohHwB6U/gzYUenvgK39IATxAciBH4RgAciodAlIk1wbgHqWj/TZ4NSomuM4yu1nUaKOR4VJhoVqp3Gm80z3TNIHyvsAqNTbTdVtef98dzl+ECoAxKzkLPtFfKEvf1RYe8v7+Y6bO9h5mE6n9/PsaAiTKqyE82z7CajCS/Ubx/NOrIi0AjMAAAAJcEhZcwAACxMAAAsTAQCanBgAAAasaVRYdFhNTDpjb20uYWRvYmUueG1wAAAAAAA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjYtYzE0MiA3OS4xNjA5MjQsIDIwMTcvMDcvMTMtMDE6MDY6MzkgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIiB4bWxuczpwaG90b3Nob3A9Imh0dHA6Ly9ucy5hZG9iZS5jb20vcGhvdG9zaG9wLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdEV2dD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlRXZlbnQjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDIwLTA2LTIyVDA5OjQzOjE4KzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAyMC0wNi0yMlQxMDoxOTo1NyswODowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAyMC0wNi0yMlQxMDoxOTo1NyswODowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJDSUUgUkdCIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjYzYzg5M2QyLWEzM2YtM2E0OC1iMzZhLTI3Y2ViNjRmN2E4YiIgeG1wTU06RG9jdW1lbnRJRD0iYWRvYmU6ZG9jaWQ6cGhvdG9zaG9wOmI5ZDE5MWNhLWEyMTQtNjY0OC04ODdkLTkwMWZmZDlhYWFhYSIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOmMwNDU5NTJiLTJkMWUtNWI0OS04Y2IzLTg1NjgwNmNlNzViOCI+IDx4bXBNTTpIaXN0b3J5PiA8cmRmOlNlcT4gPHJkZjpsaSBzdEV2dDphY3Rpb249ImNyZWF0ZWQiIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6YzA0NTk1MmItMmQxZS01YjQ5LThjYjMtODU2ODA2Y2U3NWI4IiBzdEV2dDp3aGVuPSIyMDIwLTA2LTIyVDA5OjQzOjE4KzA4OjAwIiBzdEV2dDpzb2Z0d2FyZUFnZW50PSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIi8+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJzYXZlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDo3YmU5MWNlZS0yYTMzLWQ5NDQtYmZkZi1iMDU0ZGFhMzkxYTYiIHN0RXZ0OndoZW49IjIwMjAtMDYtMjJUMTA6MTk6NTcrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiIHN0RXZ0OmNoYW5nZWQ9Ii8iLz4gPHJkZjpsaSBzdEV2dDphY3Rpb249InNhdmVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOjYzYzg5M2QyLWEzM2YtM2E0OC1iMzZhLTI3Y2ViNjRmN2E4YiIgc3RFdnQ6d2hlbj0iMjAyMC0wNi0yMlQxMDoxOTo1NyswODowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgc3RFdnQ6Y2hhbmdlZD0iLyIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4HyJxNAAABRUlEQVRIib3Vv0rEMBwH8O8vKQg+gLO61NxNvoEvUEIp18nXcNRZEN/C6YSW0hdwdRIE+wcHXcXdrYnL3VG93vVP0v6WkPySXz4kgRAMw/O8Q875FRG5AA601q9VVd2lafpjUpdMFkspZ0T0QETn9XGt9YvW+jJJkmxymJRyxhhbApjvmPKmlAqH4vhIKAA4IqIL13WfyrL8Hh3WEWWM63WVLahw1S4bcr2vtfOJtaHiOH4siiITQmQAFv/yvU+uE6wLat2xhWuF9UHZxO2FDUHZwu2EmaBs4BphNlCmuC2YTZQJ7g9sDNRQ3AY2JmoIjk+F6otjAMA5v50CtY5VzbAhNSeiGwCgIAjOlFL5VKh6+L6/QMPf6jjOKa0mfAA4nhK1B/cZx/EJBwAhRElEXwAyxth1FEXJFChg8+aea/vf53n+/gsC3/u7M2K/MwAAAABJRU5ErkJggg==);
  }
  #app .wraps .content .video-list {
    margin-top: 0.6rem;
    grid-template-columns: repeat(auto-fill, 3.4rem);
    padding: 0.2rem;
  }
  #app .wraps .content .video-list .video-item a .video-item-img {
    height: 1.8rem;
  }
  #app .wraps .content .video-list .video-item a .video-item-title {
    padding: 0 0.1rem;
    margin: 5px 0;
    font-size: 0.26rem;
  }
  #app .wraps .foot {
    min-width: 0;
  }
  #app .wraps .foot .footer-cont .footer-beian {
    font-size: 0.28rem;
  }
  #app .wraps .foot .footer-cont .footer-beian a {
    margin: 10px 0;
    display: inline-block;
  }
  #app .wraps .foot .footer-cont .footer-QR .QR-mobile {
    display: none;
  }
}