#app {
  background-size: 100% 100%;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
}
.style0 .body-pic {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/body/background.jpg)
    0 0/100% 100% #f8f8ff;
}
.style0 .head-back-color {
  background-color: #3a3f51;
}
.style0 .head-brand-color {
  color: rgba(234, 235, 237, 0.99);
}
.style0 .head-keyword-back-color {
  background-color: rgba(234, 235, 237, 0.98);
}
.style0 .head-music-pic {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/body/music_play.png)
    no-repeat;
}
.style0 .panel-aside-back-color {
  background-color: #edf1f2;
}
.style0 .panel-aside-color {
  color: #4e5c64;
}
.style0 .panel-item-pic-1 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-1.jpg)
    no-repeat;
}
.style0 .panel-item-pic-2 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-2.jpg)
    no-repeat;
}
.style0 .panel-item-pic-3 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-3.jpg)
    no-repeat;
}
.style0 .panel-item-pic-4 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-4.jpg)
    no-repeat;
}
.style0 .panel-item-pic-5 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-5.jpg)
    no-repeat;
}
.style0 .panel-item-pic-6 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-6.jpg)
    no-repeat;
}
.style0 .panel-item-pic-7 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-7.jpg)
    no-repeat;
}
.style0 .panel-item-pic-8 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-8.jpg)
    no-repeat;
}
.style0 .panel-item-pic-9 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-9.jpg)
    no-repeat;
}
.style0 .panel-item-pic-10 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-10.jpg)
    no-repeat;
}
.style0 .panel-item-pic-11 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-11.jpg)
    no-repeat;
}
.style0 .panel-item-pic-12 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-12.jpg)
    no-repeat;
}
.style0 .panel-item-pic-13 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-13.jpg)
    no-repeat;
}
.style0 .panel-item-pic-14 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-14.jpg)
    no-repeat;
}
.style0 .panel-item-pic-15 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-15.jpg)
    no-repeat;
}
.style0 .panel-item-pic-16 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-16.jpg)
    no-repeat;
}
.style0 .panel-item-pic-17 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-17.jpg)
    no-repeat;
}
.style0 .panel-item-pic-18 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-18.jpg)
    no-repeat;
}
.style0 .panel-item-pic-19 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-19.jpg)
    no-repeat;
}
.style0 .panel-item-pic-20 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-20.jpg)
    no-repeat;
}
.style0 .panel-item-pic-21 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-21.jpg)
    no-repeat;
}
.style0 .panel-item-pic-22 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-22.jpg)
    no-repeat;
}
.style0 .panel-item-pic-23 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-23.jpg)
    no-repeat;
}
.style0 .panel-item-pic-24 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-24.jpg)
    no-repeat;
}
.style0 .panel-item-pic-25 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-25.jpg)
    no-repeat;
}
.style0 .panel-item-pic-26 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-26.jpg)
    no-repeat;
}
.style0 .panel-item-pic-27 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-27.jpg)
    no-repeat;
}
.style0 .panel-item-pic-28 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-28.jpg)
    no-repeat;
}
.style0 .panel-item-pic-29 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-29.jpg)
    no-repeat;
}
.style0 .panel-item-pic-30 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-30.jpg)
    no-repeat;
}
.style0 .panel-item-pic-31 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-31.jpg)
    no-repeat;
}
.style0 .panel-item-pic-32 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-32.jpg)
    no-repeat;
}
.style0 .panel-item-pic-33 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-33.jpg)
    no-repeat;
}
.style0 .panel-item-pic-34 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-34.jpg)
    no-repeat;
}
.style0 .panel-item-pic-35 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/pageItem/page-item-35.jpg)
    no-repeat;
}
.style0 .panel-item-title-color {
  color: #323232;
}
.style0 .panel-avatar-dec {
  text-align: center;
  padding: 20px;
}
.style0 .panel-avatar-dec img {
  width: 90px;
  height: 90px;
  border-radius: 45px;
}
.style0 .panel-avatar-sign {
  display: block;
}
.style0 .panel-right-img-style {
  width: 45px;
  height: 45px;
  border-radius: 25px;
}
.style0 .panel-right-img-pic-0 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/menuIcon/menuicon-0.png)
    no-repeat;
}
.style0 .panel-right-img-pic-1 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/menuIcon/menuicon-1.png)
    no-repeat;
}
.style0 .panel-right-img-pic-2 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/menuIcon/menuicon-2.png)
    no-repeat;
}
.style0 .panel-right-img-pic-3 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/menuIcon/menuicon-3.png)
    no-repeat;
}
.style0 .panel-right-img-pic-4 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/menuIcon/menuicon-4.png)
    no-repeat;
}
.style0 .panel-right-img-pic-5 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/menuIcon/menuicon-5.png)
    no-repeat;
}
.style0 .panel-right-img-pic-6 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/menuIcon/menuicon-6.png)
    no-repeat;
}
.style0 .panel-right-img-pic-7 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/menuIcon/menuicon-7.png)
    no-repeat;
}
.style0 .panel-right-img-pic-8 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/menuIcon/menuicon-8.png)
    no-repeat;
}
.style0 .panel-right-img-pic-9 {
  background: url(https://cjunn.gitee.io/blog_theme_atum/img/menuIcon/menuicon-9.png)
    no-repeat;
}
.style1 .body-pic {
  background: url() 0 0/100% 100% #f8f8ff;
}
.style1 .head-back-color {
  background-color: #f9f9f9;
}
.style1 .head-brand-color {
  color: #444;
}
.style1 .head-keyword-back-color {
  background-color: #fff;
}
.style1 .head-music-pic {
  background: url(https://yjlaugus.gitee.io/blog/img/body/music_play.png)
    no-repeat;
}
.style1 .panel-aside-back-color {
  background-color: #f9f9f9;
}
.style1 .panel-aside-color {
  color: #777;
}
.style1 .panel-item-pic-1 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-1.jpg)
    no-repeat;
}
.style1 .panel-item-pic-2 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-2.jpg)
    no-repeat;
}
.style1 .panel-item-pic-3 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-3.jpg)
    no-repeat;
}
.style1 .panel-item-pic-4 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-4.jpg)
    no-repeat;
}
.style1 .panel-item-pic-5 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-5.jpg)
    no-repeat;
}
.style1 .panel-item-pic-6 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-6.jpg)
    no-repeat;
}
.style1 .panel-item-pic-7 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-7.jpg)
    no-repeat;
}
.style1 .panel-item-pic-8 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-8.jpg)
    no-repeat;
}
.style1 .panel-item-pic-9 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-9.jpg)
    no-repeat;
}
.style1 .panel-item-pic-10 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-10.jpg)
    no-repeat;
}
.style1 .panel-item-pic-11 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-11.jpg)
    no-repeat;
}
.style1 .panel-item-pic-12 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-12.jpg)
    no-repeat;
}
.style1 .panel-item-pic-13 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-13.jpg)
    no-repeat;
}
.style1 .panel-item-pic-14 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-14.jpg)
    no-repeat;
}
.style1 .panel-item-pic-15 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-15.jpg)
    no-repeat;
}
.style1 .panel-item-pic-16 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-16.jpg)
    no-repeat;
}
.style1 .panel-item-pic-17 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-17.jpg)
    no-repeat;
}
.style1 .panel-item-pic-18 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-18.jpg)
    no-repeat;
}
.style1 .panel-item-pic-19 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-19.jpg)
    no-repeat;
}
.style1 .panel-item-pic-20 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-20.jpg)
    no-repeat;
}
.style1 .panel-item-pic-21 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-21.jpg)
    no-repeat;
}
.style1 .panel-item-pic-22 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-22.jpg)
    no-repeat;
}
.style1 .panel-item-pic-23 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-23.jpg)
    no-repeat;
}
.style1 .panel-item-pic-24 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-24.jpg)
    no-repeat;
}
.style1 .panel-item-pic-25 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-25.jpg)
    no-repeat;
}
.style1 .panel-item-pic-26 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-26.jpg)
    no-repeat;
}
.style1 .panel-item-pic-27 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-27.jpg)
    no-repeat;
}
.style1 .panel-item-pic-28 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-28.jpg)
    no-repeat;
}
.style1 .panel-item-pic-29 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-29.jpg)
    no-repeat;
}
.style1 .panel-item-pic-30 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-30.jpg)
    no-repeat;
}
.style1 .panel-item-pic-31 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-31.jpg)
    no-repeat;
}
.style1 .panel-item-pic-32 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-32.jpg)
    no-repeat;
}
.style1 .panel-item-pic-33 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-33.jpg)
    no-repeat;
}
.style1 .panel-item-pic-34 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-34.jpg)
    no-repeat;
}
.style1 .panel-item-pic-35 {
  background: url(https://yjlaugus.gitee.io/blog/img/pageItem/page-item-35.jpg)
    no-repeat;
}
.style1 .panel-item-title-color {
  color: #555;
}
.style1 .panel-avatar-dec {
  text-align: left;
  padding: 20px;
}
.style1 .panel-avatar-dec img {
  width: 60px;
  height: 60px;
  border-radius: 30px;
}
.style1 .panel-avatar-sign {
  display: inline-block;
  padding-left: 20px;
  position: absolute;
  top: 2px;
}
.style1 .panel-right-img-style {
  width: 45px;
  height: 45px;
  border-radius: 5px;
}
.style1 .panel-right-img-pic-0 {
  background: url(https://yjlaugus.gitee.io/blog/img/menuIcon/menuicon-0.png)
    no-repeat;
}
.style1 .panel-right-img-pic-1 {
  background: url(https://yjlaugus.gitee.io/blog/img/menuIcon/menuicon-1.png)
    no-repeat;
}
.style1 .panel-right-img-pic-2 {
  background: url(https://yjlaugus.gitee.io/blog/img/menuIcon/menuicon-2.png)
    no-repeat;
}
.style1 .panel-right-img-pic-3 {
  background: url(https://yjlaugus.gitee.io/blog/img/menuIcon/menuicon-3.png)
    no-repeat;
}
.style1 .panel-right-img-pic-4 {
  background: url(https://yjlaugus.gitee.io/blog/img/menuIcon/menuicon-4.png)
    no-repeat;
}
.style1 .panel-right-img-pic-5 {
  background: url(https://yjlaugus.gitee.io/blog/img/menuIcon/menuicon-5.png)
    no-repeat;
}
.style1 .panel-right-img-pic-6 {
  background: url(https://yjlaugus.gitee.io/blog/img/menuIcon/menuicon-6.png)
    no-repeat;
}
.style1 .panel-right-img-pic-7 {
  background: url(https://yjlaugus.gitee.io/blog/img/menuIcon/menuicon-7.png)
    no-repeat;
}
.style1 .panel-right-img-pic-8 {
  background: url(https://yjlaugus.gitee.io/blog/img/menuIcon/menuicon-8.png)
    no-repeat;
}
.style1 .panel-right-img-pic-9 {
  background: url(https://yjlaugus.gitee.io/blog/img/menuIcon/menuicon-9.png)
    no-repeat;
}
#blog_panel {
  display: inline-block;
  height: 100%;
  text-align: left;
  font-size: 0;
  position: relative;
  -webkit-box-shadow: 0 0 4px 3px rgba(0, 0, 0, 0.05);
  box-shadow: 0 0 4px 3px rgba(0, 0, 0, 0.05);
  opacity: 0.98;
}
@media only screen and (max-width: 468px) {
  #blog_panel {
    width: 100%;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_panel {
    width: 100%;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_panel {
    width: 100%;
  }
}
@media only screen and (min-width: 900px) and (max-width: 1074px) {
  #blog_panel {
    width: 895px;
  }
}
@media only screen and (min-width: 1075px) and (max-width: 1249px) {
  #blog_panel {
    width: 1060px;
  }
}
@media only screen and (min-width: 1250px) and (max-width: 1420px) {
  #blog_panel {
    width: 1200px;
  }
}
@media only screen and (min-width: 1421px) {
  #blog_panel {
    width: 1400px;
  }
}
#blog_panel .blog-head-bar {
  height: 50px;
  z-index: 10;
}
#blog_panel .main-panel {
  height: calc(100% - 50px);
  position: relative;
  left: 0;
}
@media only screen and (min-width: 550px) and (max-width: 899px) and (min-width: 550px) and (max-width: 899px) {
  #blog_panel .main-panel .blog-aside-show {
    -webkit-transform: translateX(0) !important;
    transform: translateX(0) !important;
    width: 70% !important;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) and (min-width: 469px) and (max-width: 549px) {
  #blog_panel .main-panel .blog-aside-show {
    -webkit-transform: translateX(0) !important;
    transform: translateX(0) !important;
    width: 70% !important;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) and (max-width: 468px) {
  #blog_panel .main-panel .blog-aside-show {
    -webkit-transform: translateX(0) !important;
    transform: translateX(0) !important;
    width: 70% !important;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) and (min-width: 550px) and (max-width: 899px) {
  #blog_panel .main-panel .blog-aside-hide {
    -webkit-transform: translateX(-105%);
    transform: translateX(-105%);
    width: 70% !important;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) and (min-width: 469px) and (max-width: 549px) {
  #blog_panel .main-panel .blog-aside-hide {
    -webkit-transform: translateX(-105%);
    transform: translateX(-105%);
    width: 70% !important;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) and (max-width: 468px) {
  #blog_panel .main-panel .blog-aside-hide {
    -webkit-transform: translateX(-105%);
    transform: translateX(-105%);
    width: 70% !important;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) and (min-width: 550px) and (max-width: 899px) {
  #blog_panel .main-panel .blog-aside-show {
    -webkit-transform: translateX(0) !important;
    transform: translateX(0) !important;
    width: 70% !important;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) and (min-width: 469px) and (max-width: 549px) {
  #blog_panel .main-panel .blog-aside-show {
    -webkit-transform: translateX(0) !important;
    transform: translateX(0) !important;
    width: 70% !important;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) and (max-width: 468px) {
  #blog_panel .main-panel .blog-aside-show {
    -webkit-transform: translateX(0) !important;
    transform: translateX(0) !important;
    width: 70% !important;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) and (min-width: 550px) and (max-width: 899px) {
  #blog_panel .main-panel .blog-aside-hide {
    -webkit-transform: translateX(-105%);
    transform: translateX(-105%);
    width: 70% !important;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) and (min-width: 469px) and (max-width: 549px) {
  #blog_panel .main-panel .blog-aside-hide {
    -webkit-transform: translateX(-105%);
    transform: translateX(-105%);
    width: 70% !important;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) and (max-width: 468px) {
  #blog_panel .main-panel .blog-aside-hide {
    -webkit-transform: translateX(-105%);
    transform: translateX(-105%);
    width: 70% !important;
  }
}
@media only screen and (max-width: 468px) and (min-width: 550px) and (max-width: 899px) {
  #blog_panel .main-panel .blog-aside-show {
    -webkit-transform: translateX(0) !important;
    transform: translateX(0) !important;
    width: 70% !important;
  }
}
@media only screen and (max-width: 468px) and (min-width: 469px) and (max-width: 549px) {
  #blog_panel .main-panel .blog-aside-show {
    -webkit-transform: translateX(0) !important;
    transform: translateX(0) !important;
    width: 70% !important;
  }
}
@media only screen and (max-width: 468px) and (max-width: 468px) {
  #blog_panel .main-panel .blog-aside-show {
    -webkit-transform: translateX(0) !important;
    transform: translateX(0) !important;
    width: 70% !important;
  }
}
@media only screen and (max-width: 468px) and (min-width: 550px) and (max-width: 899px) {
  #blog_panel .main-panel .blog-aside-hide {
    -webkit-transform: translateX(-105%);
    transform: translateX(-105%);
    width: 70% !important;
  }
}
@media only screen and (max-width: 468px) and (min-width: 469px) and (max-width: 549px) {
  #blog_panel .main-panel .blog-aside-hide {
    -webkit-transform: translateX(-105%);
    transform: translateX(-105%);
    width: 70% !important;
  }
}
@media only screen and (max-width: 468px) and (max-width: 468px) {
  #blog_panel .main-panel .blog-aside-hide {
    -webkit-transform: translateX(-105%);
    transform: translateX(-105%);
    width: 70% !important;
  }
}
#blog_panel .main-panel .panel-aside-shape {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 3;
  background-color: rgba(0, 0, 0, 0.3);
  display: none;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_panel .main-panel .panel-aside-shape {
    display: inline-block;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_panel .main-panel .panel-aside-shape {
    display: inline-block;
  }
}
@media only screen and (max-width: 468px) {
  #blog_panel .main-panel .panel-aside-shape {
    display: inline-block;
  }
}
#blog_panel .main-panel .panel-aside-shape-hide {
  display: none;
}
#blog_panel .main-panel .panel-aside {
  position: absolute;
  left: 0;
  z-index: 4;
  -webkit-transition: all 0.3s ease-out 0.1s;
  transition: all 0.3s ease-out 0.1s;
  width: 230px;
  height: 100%;
  display: inline-block;
  vertical-align: top;
  -webkit-box-shadow: 0.8px 0.8px 0.8px rgba(0, 0, 0, 0.2);
  box-shadow: 0.8px 0.8px 0.8px rgba(0, 0, 0, 0.2);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#blog_panel .main-panel .loading-bar-clz {
  width: 100%;
  position: absolute;
  vertical-align: top;
  z-index: 2;
  width: calc(100% - 230px);
  left: 230px;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_panel .main-panel .loading-bar-clz {
    width: 100%;
    left: 0;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_panel .main-panel .loading-bar-clz {
    width: 100%;
    left: 0;
  }
}
@media only screen and (max-width: 468px) {
  #blog_panel .main-panel .loading-bar-clz {
    width: 100%;
    left: 0;
  }
}
#blog_panel .main-panel .loading-body-clz {
  -webkit-transition: all 0.25s ease-in-out 0s;
  transition: all 0.25s ease-in-out 0s;
  position: absolute;
  vertical-align: top;
  z-index: 2;
  width: calc(100% - 230px);
  left: 230px;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_panel .main-panel .loading-body-clz {
    width: 100%;
    left: 0;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_panel .main-panel .loading-body-clz {
    width: 100%;
    left: 0;
  }
}
@media only screen and (max-width: 468px) {
  #blog_panel .main-panel .loading-body-clz {
    width: 100%;
    left: 0;
  }
}
#blog_panel .main-panel .route-body {
  background-color: #f6f8f9;
  left: 230px;
  width: calc(100% - 230px);
  position: absolute;
  top: 0;
  overflow-y: scroll;
  display: inline-block;
  height: 100%;
  overflow-x: hidden;
  vertical-align: top;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_panel .main-panel .route-body {
    left: 0;
    width: 100%;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_panel .main-panel .route-body {
    left: 0;
    width: 100%;
  }
}
@media only screen and (max-width: 468px) {
  #blog_panel .main-panel .route-body {
    left: 0;
    width: 100%;
  }
}
#blog_panel .main-panel .route-body .router-view-wrap {
  min-height: calc(100% - 40px);
}
#blog_head_bar {
  position: relative;
  z-index: 100;
  -webkit-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
  -webkit-box-shadow: 0 1px 4px 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px 4px 1px rgba(0, 0, 0, 0.05);
}
#blog_head_bar .float-right-wrap {
  height: 100%;
  float: right;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_head_bar .float-right-wrap {
    height: 0;
    float: none;
    z-index: -1;
    position: absolute;
    width: 100%;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_head_bar .float-right-wrap {
    height: 0;
    float: none;
    z-index: -1;
    position: absolute;
    width: 100%;
  }
}
@media only screen and (max-width: 468px) {
  #blog_head_bar .float-right-wrap {
    height: 0;
    float: none;
    z-index: -1;
    position: absolute;
    width: 100%;
  }
}
#brand_name {
  display: inline-block;
  height: 50px;
  width: 230px;
}
#brand_name .max-screen {
  position: relative;
  height: 100%;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #brand_name .max-screen {
    display: none;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #brand_name .max-screen {
    display: none;
  }
}
@media only screen and (max-width: 468px) {
  #brand_name .max-screen {
    display: none;
  }
}
#brand_name .max-screen .max-screen-wrap {
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#brand_name .max-screen .max-screen-wrap .blog-name,
#brand_name .max-screen .max-screen-wrap .icon {
  font-weight: 700;
  font-size: 19px;
  cursor: pointer;
  text-align: center;
  height: 100%;
}
#brand_name .max-screen .max-screen-wrap .icon {
  font-size: 21px;
  position: relative;
  bottom: -2px;
}
#brand_name .min-screen {
  width: 50px;
  height: 100%;
  display: none;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #brand_name .min-screen {
    display: inline-block;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #brand_name .min-screen {
    display: inline-block;
  }
}
@media only screen and (max-width: 468px) {
  #brand_name .min-screen {
    display: inline-block;
  }
}
#brand_name .min-screen .min-screen-wrap {
  width: 50px;
  height: 50px;
  cursor: pointer;
  position: absolute;
  z-index: 3;
}
#brand_name .min-screen .min-screen-wrap .icon {
  color: #a6a8b1;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#brand_name .min-screen .min-screen-wrap:hover {
  background-color: rgba(0, 0, 0, 0.12);
}
#brand_name .min-screen .min-screen-wrap:hover .icon {
  color: rgba(234, 235, 237, 0.99);
}
#keyword_searcher:before {
  content: "";
  height: 1px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 4;
  background-color: rgba(20, 20, 20, 0.1);
}
#keyword_searcher {
  vertical-align: top;
  display: inline-block;
  width: 263px;
  height: 50px;
  position: relative;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #keyword_searcher {
    width: 100%;
    text-align: center;
    z-index: 2;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #keyword_searcher {
    width: 100%;
    text-align: center;
    z-index: 2;
  }
}
@media only screen and (max-width: 468px) {
  #keyword_searcher {
    width: 100%;
    text-align: center;
    z-index: 2;
  }
}
#keyword_searcher .trans-enter-active,
#keyword_searcher .trans-leave-active {
  -webkit-transition: all 0.24s ease-in-out 0s;
  transition: all 0.24s ease-in-out 0s;
}
#keyword_searcher .trans-enter,
#keyword_searcher .trans-leave-to {
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}
#keyword_searcher .pop-list {
  position: absolute;
  z-index: 1;
}
#keyword_searcher .keyword-searcher-shade {
  position: absolute;
  left: -4px;
  right: -4px;
  top: 0;
  bottom: 0;
  z-index: 2;
}
#keyword_searcher .keyword-searcher-wrap {
  z-index: 3;
  padding: 10px 0;
  height: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 0;
  position: relative;
}
#keyword_searcher .keyword-searcher-wrap .search-btn {
  display: inline-block;
  position: relative;
  height: 100%;
  border-radius: 0 25px 25px 0;
  padding: 0 13px;
  cursor: pointer;
}
#keyword_searcher .keyword-searcher-wrap .search-btn .-search {
  display: inline-block;
  padding-top: 9px;
}
#keyword_searcher .keyword-searcher-wrap .search-btn:hover .-search {
  color: #000;
}
#keyword_searcher .keyword-searcher-wrap .input-wrap {
  width: 220px;
  display: inline-block;
  vertical-align: top;
  height: 100%;
  border-radius: 25px 0 0 25px;
  border: 0;
  margin: 0;
  padding: 10px 5px 8px 16px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
  font-size: 11px;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #keyword_searcher .keyword-searcher-wrap .input-wrap {
    width: 85%;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #keyword_searcher .keyword-searcher-wrap .input-wrap {
    width: 85%;
  }
}
@media only screen and (max-width: 468px) {
  #keyword_searcher .keyword-searcher-wrap .input-wrap {
    width: 85%;
  }
}
#keyword_searcher .keyword-searcher-wrap .input-wrap:focus {
  background-color: #fff;
}
#pop_list {
  position: absolute;
}
#pop_list,
#pop_list .pop-list-wrap {
  width: 100%;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}
#pop_list .pop-list-wrap {
  background-color: #fff;
  overflow-y: scroll;
  max-height: 250px;
  cursor: pointer;
}
#pop_list .pop-list-wrap .pop-list-item {
  padding: 8px 14px;
  color: grey;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  font-size: 0;
  position: relative;
}
#pop_list .pop-list-wrap .pop-list-item .left-flag {
  background-color: rgba(107, 178, 255, 0.7);
  width: 3px;
  display: inline-block;
  top: 2px;
  bottom: 2px;
  position: absolute;
  left: 1px;
}
#pop_list .pop-list-wrap .pop-list-item .item-key {
  font-size: 13px;
  display: inline-block;
}
#pop_list .pop-list-wrap .pop-list-item .item-key1 {
  width: 75%;
}
#pop_list .pop-list-wrap .pop-list-item .item-key2 {
  float: right;
  width: 20%;
  text-align: right;
}
#pop_list .pop-list-wrap .pop-list-head {
  font-size: 12px;
  background-color: #edf1f2;
  font-weight: 700;
  padding: 7px 14px;
}
#pop_list .pop-list-wrap .pop-list-item:hover {
  background-color: #edf1f2;
}
.jq-toast-wrap,
.jq-toast-wrap * {
  margin: 0;
  padding: 0;
}
.jq-toast-wrap {
  display: block;
  position: fixed;
  width: 250px;
  pointer-events: none !important;
  letter-spacing: normal;
  z-index: 9000 !important;
}
.jq-toast-wrap.bottom-left {
  bottom: 20px;
  left: 20px;
}
.jq-toast-wrap.bottom-right {
  bottom: 20px;
  right: 40px;
}
.jq-toast-wrap.top-left {
  top: 20px;
  left: 20px;
}
.jq-toast-wrap.top-right {
  top: 20px;
  right: 40px;
}
.jq-toast-single {
  display: block;
  width: 100%;
  padding: 10px;
  margin: 0 0 5px;
  border-radius: 4px;
  font-size: 12px;
  font-family: arial, sans-serif;
  line-height: 17px;
  position: relative;
  pointer-events: all !important;
  background-color: #444;
  color: #fff;
}
.jq-toast-single h2 {
  font-family: arial, sans-serif;
  font-size: 14px;
  margin: 0 0 7px;
  background: 0 0;
  color: inherit;
  line-height: inherit;
  letter-spacing: normal;
}
.jq-toast-single a {
  color: #eee;
  text-decoration: none;
  font-weight: 700;
  border-bottom: 1px solid #fff;
  padding-bottom: 3px;
  font-size: 12px;
}
.jq-toast-single ul {
  margin: 0 0 0 15px;
  background: 0 0;
  padding: 0;
}
.jq-toast-single ul li {
  list-style-type: disc !important;
  line-height: 17px;
  background: 0 0;
  margin: 0;
  padding: 0;
  letter-spacing: normal;
}
.close-jq-toast-single {
  position: absolute;
  top: 3px;
  right: 7px;
  font-size: 14px;
  cursor: pointer;
}
.jq-toast-loader {
  display: block;
  position: absolute;
  top: -2px;
  height: 5px;
  width: 0;
  left: 0;
  border-radius: 5px;
  background: red;
}
.jq-toast-loaded {
  width: 100%;
}
.jq-has-icon {
  padding: 10px 10px 10px 50px;
  background-repeat: no-repeat;
  background-position: 10px;
}
.jq-icon-info {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=);
  background-color: #31708f;
  color: #d9edf7;
  border-color: #bce8f1;
}
.jq-icon-warning {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=);
  background-color: #8a6d3b;
  color: #fcf8e3;
  border-color: #faebcc;
}
.jq-icon-error {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=);
  background-color: #a94442;
  color: #f2dede;
  border-color: #ebccd1;
}
.jq-icon-success {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==);
  color: #dff0d8;
  background-color: #3c763d;
  border-color: #d6e9c6;
}
#music_player {
  color: #a6a8b1;
  width: 250px;
  height: 50px;
  display: inline-block;
  font-size: 0;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #music_player {
    width: 100%;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #music_player {
    width: 100%;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
}
@media only screen and (max-width: 468px) {
  #music_player {
    width: 100%;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
}
#music_player .music-player-out-wrap {
  position: relative;
  font-size: 0;
}
#music_player .music-player-out-wrap .trans-enter-active,
#music_player .music-player-out-wrap .trans-leave-active {
  -webkit-transition: all 0.24s ease-in-out 0s;
  transition: all 0.24s ease-in-out 0s;
}
#music_player .music-player-out-wrap .trans-enter,
#music_player .music-player-out-wrap .trans-leave-to {
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}
#music_player .music-player-out-wrap .pop-list {
  position: absolute;
  top: 50px;
  z-index: 2;
}
#music_player .music-player-out-wrap .music-player-shade {
  position: absolute;
  left: -4px;
  right: -4px;
  top: 0;
  bottom: 0;
  height: 50px;
  z-index: 3;
}
#music_player .music-player-out-wrap .music-player-wrap {
  width: 250px;
  display: inline-block;
  position: relative;
  height: 50px;
  text-align: right;
  float: right;
  z-index: 4;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #music_player .music-player-out-wrap .music-player-wrap {
    float: none;
    width: 100%;
    text-align: center;
    padding-left: 35px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #music_player .music-player-out-wrap .music-player-wrap {
    float: none;
    width: 100%;
    text-align: center;
    padding-left: 35px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
}
@media only screen and (max-width: 468px) {
  #music_player .music-player-out-wrap .music-player-wrap {
    float: none;
    width: 100%;
    text-align: center;
    padding-left: 35px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
}
@-webkit-keyframes rotation {
  0% {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(1turn);
  }
}
#music_player .music-player-out-wrap .music-player-wrap .Rotation {
  -webkit-transform: rotate(1turn);
  animation: rotation 8s linear infinite;
  -moz-animation: rotation 8s linear infinite;
  -webkit-animation: rotation 8s linear infinite;
  -o-animation: rotation 8s linear infinite;
}
#music_player .music-player-out-wrap .music-player-wrap .music-img-wrap {
  padding: 4px 0;
  display: inline-block;
  vertical-align: top;
}
#music_player
  .music-player-out-wrap
  .music-player-wrap
  .music-img-wrap
  .div-img {
  background-size: 100% 100%;
  width: 42px;
  height: 42px;
  border-radius: 21px;
  cursor: pointer;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}
#music_player
  .music-player-out-wrap
  .music-player-wrap
  .music-right-wrap:hover
  .music-volume-wrap {
  vertical-align: bottom;
  display: inline-block;
  position: absolute;
  cursor: pointer;
  right: 0;
  bottom: 4px;
}
#music_player .music-player-out-wrap .music-player-wrap .music-right-wrap {
  padding: 4px 0 0;
  display: inline-block;
  vertical-align: top;
  position: relative;
  text-align: left;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 50px;
}
#music_player
  .music-player-out-wrap
  .music-player-wrap
  .music-right-wrap
  .music-progress {
  height: 2px;
  background-color: #a6a8b1;
  position: absolute;
  bottom: 0;
}
#music_player
  .music-player-out-wrap
  .music-player-wrap
  .music-right-wrap
  .music-ope-wrap {
  padding-left: 13px;
  vertical-align: top;
  display: inline-block;
  font-size: 12px;
  padding-top: 3px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#music_player
  .music-player-out-wrap
  .music-player-wrap
  .music-right-wrap
  .music-ope-wrap
  .music-title {
  cursor: pointer;
  overflow: hidden;
  position: relative;
  height: 15px;
}
#music_player
  .music-player-out-wrap
  .music-player-wrap
  .music-right-wrap
  .music-ope-wrap
  .music-title
  .music-display-info {
  overflow: hidden;
}
@-webkit-keyframes marquee {
  0% {
    left: 0;
  }
  to {
    left: -105%;
  }
}
@keyframes marquee {
  0% {
    left: 0;
  }
  to {
    left: -105%;
  }
}
@-webkit-keyframes marqueeT {
  0% {
    left: 105%;
  }
  to {
    left: 0;
  }
}
@keyframes marqueeT {
  0% {
    left: 105%;
  }
  to {
    left: 0;
  }
}
#music_player
  .music-player-out-wrap
  .music-player-wrap
  .music-right-wrap
  .music-ope-wrap
  .music-title
  .marqueeT {
  -webkit-animation: marqueeT 12s linear infinite;
  animation: marqueeT 12s linear infinite;
  white-space: nowrap;
  position: absolute;
}
#music_player
  .music-player-out-wrap
  .music-player-wrap
  .music-right-wrap
  .music-ope-wrap
  .music-title
  .marquee {
  -webkit-animation: marquee 12s linear infinite;
  animation: marquee 12s linear infinite;
  white-space: nowrap;
  z-index: 2;
  position: absolute;
}
#music_player
  .music-player-out-wrap
  .music-player-wrap
  .music-right-wrap
  .music-ope-wrap
  .music-ope-bar {
  padding-top: 7px;
}
#music_player
  .music-player-out-wrap
  .music-player-wrap
  .music-right-wrap
  .music-ope-wrap
  .music-ope-bar
  .play {
  position: relative;
  top: 1px;
}
#music_player
  .music-player-out-wrap
  .music-player-wrap
  .music-right-wrap
  .music-ope-wrap
  .music-ope-bar
  .icon {
  display: inline-block;
  font-size: 17px;
  width: 25px;
  cursor: pointer;
  font-weight: 700;
}
#music_player
  .music-player-out-wrap
  .music-player-wrap
  .music-right-wrap
  .music-volume-wrap {
  display: none;
}
#music_player .music-player-out-wrap .music-player-wrap .music-list-wrap {
  height: 50px;
  width: 50px;
  display: inline-block;
  position: relative;
  cursor: pointer;
  text-align: center;
  line-height: 50px;
  color: #a6a8b1;
}
#music_player .music-player-out-wrap .music-player-wrap .music-list-wrap:hover {
  background-color: rgba(0, 0, 0, 0.12);
  color: hsla(0, 0%, 94.1%, 0.9);
}
#beer_list:after,
#beer_list:before {
  content: "";
  height: 1px;
  position: absolute;
  left: 0;
  right: 0;
  z-index: 1;
  background-color: rgba(20, 20, 20, 0.1);
}
#beer_list:after {
  bottom: 0;
  z-index: 1;
}
#beer_list:before {
  z-index: 2;
  top: 0;
}
#beer_list {
  display: inline-block;
  height: 50px;
  width: 50px;
  vertical-align: top;
  cursor: pointer;
  font-size: 12px;
  position: relative;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #beer_list {
    width: 100%;
    text-align: left;
    height: 50px;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #beer_list {
    width: 100%;
    text-align: left;
    height: 50px;
  }
}
@media only screen and (max-width: 468px) {
  #beer_list {
    width: 100%;
    text-align: left;
    height: 50px;
  }
}
#beer_list .beer-list-wrap {
  width: 100%;
  height: 100%;
  position: absolute;
}
#beer_list .beer-list-wrap .beer-wrap {
  width: 50px;
  height: 100%;
  line-height: 50px;
  text-align: center;
  font-weight: 700;
  color: #a6a8b1;
  position: absolute;
  z-index: 1;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #beer_list .beer-list-wrap .beer-wrap {
    width: 100%;
    text-align: left;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #beer_list .beer-list-wrap .beer-wrap {
    width: 100%;
    text-align: left;
  }
}
@media only screen and (max-width: 468px) {
  #beer_list .beer-list-wrap .beer-wrap {
    width: 100%;
    text-align: left;
  }
}
#beer_list .beer-list-wrap .beer-wrap .beer-inner-wrap:hover {
  background-color: rgba(0, 0, 0, 0.12);
  color: hsla(0, 0%, 94.1%, 0.9);
}
#beer_list .beer-list-wrap .beer-wrap .beer-inner-wrap {
  height: 50px;
  overflow: hidden;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #beer_list .beer-list-wrap .beer-wrap .beer-inner-wrap {
    width: 100%;
    padding-left: 25px;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #beer_list .beer-list-wrap .beer-wrap .beer-inner-wrap {
    width: 100%;
    padding-left: 25px;
  }
}
@media only screen and (max-width: 468px) {
  #beer_list .beer-list-wrap .beer-wrap .beer-inner-wrap {
    width: 100%;
    padding-left: 25px;
  }
}
#beer_list .beer-list-wrap .pop-list {
  position: absolute;
  left: -134px;
  width: 260px;
  z-index: 0;
  top: 50px;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #beer_list .beer-list-wrap .pop-list {
    width: 100%;
    left: 0;
    z-index: 0;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #beer_list .beer-list-wrap .pop-list {
    width: 100%;
    left: 0;
    z-index: 0;
  }
}
@media only screen and (max-width: 468px) {
  #beer_list .beer-list-wrap .pop-list {
    width: 100%;
    left: 0;
    z-index: 0;
  }
}
#beer_list .beer-list-wrap .trans-enter-active,
#beer_list .beer-list-wrap .trans-leave-active {
  -webkit-transition: all 0.24s ease-in-out 0s;
  transition: all 0.24s ease-in-out 0s;
}
#beer_list .beer-list-wrap .trans-enter,
#beer_list .beer-list-wrap .trans-leave-to {
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}
#set_btn {
  display: inline-block;
  vertical-align: top;
  position: relative;
  width: 80px;
  font-size: 0;
  overflow: hidden;
  height: 50px;
  z-index: 2;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #set_btn {
    text-align: left;
    width: 100%;
    z-index: -1;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #set_btn {
    text-align: left;
    width: 100%;
    z-index: -1;
  }
}
@media only screen and (max-width: 468px) {
  #set_btn {
    text-align: left;
    width: 100%;
    z-index: -1;
  }
}
#set_btn .set-btn-out-wrap:hover {
  background-color: rgba(0, 0, 0, 0.12);
  color: hsla(0, 0%, 94.1%, 0.9);
}
#set_btn .set-btn-out-wrap {
  width: 100%;
  height: 100%;
  cursor: pointer;
}
#set_btn .set-btn-out-wrap .set-btn-wrap {
  height: 100%;
  cursor: pointer;
  font-size: 14px;
  text-align: center;
  line-height: 50px;
  width: 80px;
  color: #a6a8b1;
}
#set_btn .set-btn-out-wrap .set-btn-wrap .angeldown1 {
  padding-left: 6px;
  font-size: 13px;
}
#min_set_btn {
  height: 50px;
  width: 50px;
  line-height: 50px;
  text-align: center;
  font-size: 16px;
  color: #a6a8b1;
  cursor: pointer;
  z-index: 2;
  position: absolute;
  right: 0;
  top: 0;
  display: none;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #min_set_btn {
    display: inline-block;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #min_set_btn {
    display: inline-block;
  }
}
@media only screen and (max-width: 468px) {
  #min_set_btn {
    display: inline-block;
  }
}
#min_set_btn:hover {
  background-color: rgba(0, 0, 0, 0.12);
  color: hsla(0, 0%, 94.1%, 0.9);
}
#brand_title {
  top: 0;
  position: absolute;
  width: 100%;
  height: 50px;
  z-index: 2;
  text-align: center;
  font-size: 20px;
  color: #a6a8b1;
  line-height: 50px;
  font-weight: 700;
  display: none;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #brand_title {
    display: inline-block;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #brand_title {
    display: inline-block;
  }
}
@media only screen and (max-width: 468px) {
  #brand_title {
    display: inline-block;
  }
}
#brand_title .brand-title-wrap {
  padding-left: 10px;
  padding-right: 10px;
  cursor: pointer;
}
#panel_aside {
  width: 100%;
  height: 100%;
  position: relative;
}
#panel_aside .panel-aside-wrap {
  position: absolute;
  top: 0;
  bottom: 50px;
  overflow-y: scroll;
  width: 100%;
}
#panel_aside .panel-aside-bottom {
  position: absolute;
  bottom: 0;
  height: 50px;
  width: 100%;
}
#panel_aside .panel-aside-bottom .blog-menu-bar {
  padding-top: 5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 12px;
  position: relative;
}
#panel_aside .panel-aside-bottom .blog-menu-bar > div {
  cursor: pointer;
  margin-top: 6px;
  display: inline-block;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  text-align: center;
}
#avatar_area:hover {
  background: url(https://yjlaugus.gitee.io/blog/img/body/float.gif);
  background-size: cover;
}
#avatar_area {
  font-size: 0;
}
#avatar_area .avatar-area-wrap {
  position: relative;
  cursor: pointer;
}
#avatar_area .avatar-area-wrap img {
  -webkit-box-shadow: 2px 2px 3px #e1e1e1;
  box-shadow: 2px 2px 3px #e1e1e1;
}
#avatar_area .avatar-area-wrap .name-wrap {
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  margin-top: 8px;
  margin-bottom: 2px;
}
#avatar_area .avatar-area-wrap .name-wrap .icon {
  font-size: 2px;
  position: relative;
  top: 1px;
}
#avatar_area .avatar-area-wrap .sign-wrap {
  cursor: pointer;
  text-align: center;
  margin-top: 4px;
  font-size: 12px;
}
#menu_items {
  font-size: 0;
}
#menu_items .menu-items-wrap {
  border-top: 1px solid #e2e8ea;
  padding-bottom: 10px;
}
#menu_items .menu-items-wrap .menu-item-title {
  color: #98a6ad;
  font-size: 12px;
  padding: 10px 13px 6px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#menu_items .menu-items-wrap .menu-item-area .item-row {
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#menu_items
  .menu-items-wrap
  .menu-item-area
  .item-row
  .children-item-wrap:hover,
#menu_items .menu-items-wrap .menu-item-area .item-row .parent-item-wrap:hover {
  background-color: hsla(0, 0%, 58.8%, 0.15);
}
#menu_items
  .menu-items-wrap
  .menu-item-area
  .item-row
  .func-radio:not(:checked)
  + label
  .arrow-wrap
  .show-bottom-icon {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
#menu_items
  .menu-items-wrap
  .menu-item-area
  .item-row
  .func-radio:not(:checked)
  + label
  + .children-wrap {
  height: 0 !important;
}
#menu_items .menu-items-wrap .menu-item-area .item-row .children-wrap {
  overflow: hidden;
  -webkit-transition: all 0.2s ease-in-out 0s;
  transition: all 0.2s ease-in-out 0s;
}
#menu_items
  .menu-items-wrap
  .menu-item-area
  .item-row
  .children-wrap
  .children-item-wrap {
  padding: 7px 23px 7px 60px;
  cursor: pointer;
  font-size: 13px;
  position: relative;
}
#menu_items
  .menu-items-wrap
  .menu-item-area
  .item-row
  .children-wrap
  .children-item-wrap
  .children-num {
  border-radius: 10px;
  font-size: 10px;
  float: right;
  padding: 1px 0;
  width: 25px;
  height: 14px;
  line-height: 14px;
  background-color: #cfdadd;
  color: #fff;
  text-align: center;
  position: relative;
  right: -4px;
  top: 2px;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
}
#menu_items .menu-items-wrap .menu-item-area .item-row .parent-item-wrap {
  cursor: pointer;
  padding: 9px 23px;
  line-height: 1.4;
}
#menu_items
  .menu-items-wrap
  .menu-item-area
  .item-row
  .parent-item-wrap
  .icon-wrap {
  padding-right: 19px;
}
#menu_items
  .menu-items-wrap
  .menu-item-area
  .item-row
  .parent-item-wrap
  .arrow-wrap {
  display: inline-block;
  font-size: 8px;
  float: right;
  padding-top: 1px;
}
#menu_items
  .menu-items-wrap
  .menu-item-area
  .item-row
  .parent-item-wrap
  .arrow-wrap
  .show-bottom-icon {
  display: inline-block;
  -webkit-transition: all 0.2s ease-in-out 0s;
  transition: all 0.2s ease-in-out 0s;
}
#menu_items
  .menu-items-wrap
  .menu-item-area
  .item-row
  .parent-item-wrap
  .icon-wrap,
#menu_items
  .menu-items-wrap
  .menu-item-area
  .item-row
  .parent-item-wrap
  .title-wrap {
  font-size: 14px;
  display: inline-block;
}
#menu_items
  .menu-items-wrap
  .menu-item-area
  .item-row
  .parent-item-wrap
  .icon-wrap
  .icon,
#menu_items
  .menu-items-wrap
  .menu-item-area
  .item-row
  .parent-item-wrap
  .title-wrap
  .icon {
  font-size: 17px;
  position: relative;
  top: 2px;
}
#category_body .category-body-wrap {
  padding-bottom: 10px;
  height: 100%;
  font-size: 0;
  border-right: 1px solid #e2e8ea;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-color: #f6f8f9;
}
#category_body .category-body-wrap .article-list-wrap {
  padding-top: 20px;
}
#category_body .category-body-wrap .article-list-wrap .item-wrap {
  background-color: #fcfeff;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 5px;
  margin: 0 20px 20px;
  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
}
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-body {
  line-height: 1.5;
  height: 175px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 20px 15px 15px 20px;
  display: inline-block;
  vertical-align: top;
  position: relative;
}
@media only screen and (max-width: 468px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-body {
    width: calc(100% - 110px);
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-body {
    width: calc(100% - 170px);
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-body {
    width: calc(100% - 210px);
  }
}
@media only screen and (min-width: 900px) and (max-width: 1074px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-body {
    width: calc(100% - 215px);
  }
}
@media only screen and (min-width: 1075px) and (max-width: 1249px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-body {
    width: calc(100% - 180px);
  }
}
@media only screen and (min-width: 1250px) and (max-width: 1420px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-body {
    width: calc(100% - 220px);
  }
}
@media only screen and (min-width: 1421px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-body {
    width: calc(100% - 250px);
  }
}
@media only screen and (max-width: 468px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-body {
    padding: 3px 10px 5px 12px;
    height: 100px;
  }
}
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-body
  .item-title {
  font-size: 22px;
  margin-bottom: 10px;
  cursor: pointer;
}
@media only screen and (max-width: 468px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-body
    .item-title {
    margin-bottom: 2px;
    font-size: 20px;
  }
}
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-body
  .item-desc {
  line-height: 25px;
  font-size: 14px;
  color: #a2b0b7;
  cursor: pointer;
}
@media only screen and (max-width: 468px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-body
    .item-desc {
    -webkit-line-clamp: 2;
    font-size: 13px;
    line-height: 20px;
  }
}
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-body
  .item-bottom {
  border-top: 1px solid #dee5e7;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  padding-top: 5px;
  bottom: 6px;
  left: 20px;
  right: 20px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: inline-block;
}
@media only screen and (max-width: 468px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-body
    .item-bottom {
    padding-top: 1px;
    bottom: -2px;
    text-align: left;
  }
}
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-body
  .item-bottom
  .item-comment,
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-body
  .item-bottom
  .item-read,
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-body
  .item-bottom
  .item-time {
  padding-left: 12px;
}
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-body
  .item-bottom
  .item-author,
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-body
  .item-bottom
  .item-comment,
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-body
  .item-bottom
  .item-read,
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-body
  .item-bottom
  .item-time {
  cursor: pointer;
  color: #a2b0b7;
  display: inline-block;
  font-size: 12px;
}
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-body
  .item-bottom
  .item-author
  .icon,
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-body
  .item-bottom
  .item-comment
  .icon,
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-body
  .item-bottom
  .item-read
  .icon,
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-body
  .item-bottom
  .item-time
  .icon {
  font-size: 10px;
}
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-img {
  display: inline-block;
  vertical-align: top;
}
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-img
  .div-img,
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .complex-item
  .item-img
  img {
  width: 250px;
  height: 175px;
  border-radius: 5px 0 0 5px;
  -webkit-transform: translateY(-0.5px) translateX(1px);
  transform: translateY(-0.5px) translateX(1px);
  padding-top: 0.5px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  background-size: 100% 100%;
}
@media only screen and (max-width: 468px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-img
    .div-img,
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-img
    img {
    height: 105px;
    width: 110px;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-img
    .div-img,
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-img
    img {
    width: 170px;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-img
    .div-img,
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-img
    img {
    width: 210px;
  }
}
@media only screen and (min-width: 900px) and (max-width: 1074px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-img
    .div-img,
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-img
    img {
    width: 215px;
  }
}
@media only screen and (min-width: 1075px) and (max-width: 1249px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-img
    .div-img,
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-img
    img {
    width: 180px;
  }
}
@media only screen and (min-width: 1250px) and (max-width: 1420px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-img
    .div-img,
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-img
    img {
    width: 220px;
  }
}
@media only screen and (min-width: 1421px) {
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-img
    .div-img,
  #category_body
    .category-body-wrap
    .article-list-wrap
    .item-wrap
    .complex-item
    .item-img
    img {
    width: 250px;
  }
}
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .simple-item
  .simple-item-body {
  padding: 25px;
}
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .simple-item
  .simple-item-body
  .simple-item-title {
  color: #323232;
  cursor: pointer;
  font-size: 23px;
  font-weight: 600;
}
#category_body
  .category-body-wrap
  .article-list-wrap
  .item-wrap
  .simple-item
  .simple-item-body
  .simple-item-bottom {
  cursor: pointer;
  margin-top: 14px;
  font-size: 14px;
  color: #97979f;
}
#category_body .category-body-wrap .head-title {
  display: inline-block;
  width: 100%;
  padding: 11px 15px 9px 20px;
  border-bottom: 1px solid #e2e8ea;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-color: #fff;
  height: 55px;
}
#category_body .category-body-wrap .head-title .title-font {
  display: inline-block;
  font-size: 22px;
  font-weight: 500;
  color: #000;
  padding: 0 0 6px;
}
#category_body .category-body-wrap .head-title .title-thumb {
  display: inline-block;
  font-size: 23px;
  color: #000;
}
#category_body .category-body-wrap .head-title .title-sign {
  margin-left: 10px;
  display: inline-block;
  color: #98a6ad;
  font-size: 12px;
  max-width: 65%;
}
#page_line .post-comment-num {
  text-align: center;
  padding-top: 2px;
  padding-bottom: 3px;
  font-size: 12px;
}
#page_line .post-comment-num ul.pagination {
  display: inline-block;
  padding: 0;
  margin: 0;
}
#page_line .post-comment-num ul.pagination li {
  display: inline;
}
#page_line .post-comment-num ul.pagination li a {
  font-size: 12px;
  color: #383838;
  float: left;
  text-decoration: none;
  border-radius: 3px;
  cursor: pointer;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #page_line .post-comment-num ul.pagination li a {
    padding: 5px 9px;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #page_line .post-comment-num ul.pagination li a {
    padding: 5px 9px;
  }
}
@media only screen and (max-width: 468px) {
  #page_line .post-comment-num ul.pagination li a {
    padding: 5px 9px;
  }
}
#page_line .post-comment-num ul.pagination li a.active {
  background-color: rgba(58, 63, 81, 0.99);
  color: #fff;
  border-radius: 3px;
}
#page_line .post-comment-num ul.pagination li a:hover:not(.active) {
  background-color: #ddd;
}
#page_line .post-comment-num li.seatClz a::-moz-selection {
  color: transparent !important;
  background-color: transparent !important;
}
#page_line .post-comment-num li.seatClz a::selection {
  color: transparent !important;
  background-color: transparent !important;
}
#page_line .post-comment-num li.seatClz a:hover {
  background-color: transparent !important;
}
#page_line .post-comment-num li.seatClz a {
  cursor: default !important;
  color: transparent !important;
}
#route_body {
  position: relative;
}
#route_body .inner-route-body {
  display: inline-block;
  width: 922px;
  vertical-align: top;
  position: relative;
}
@media only screen and (max-width: 468px) {
  #route_body .inner-route-body {
    width: 100%;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #route_body .inner-route-body {
    width: 100%;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #route_body .inner-route-body {
    width: 100%;
  }
}
@media only screen and (min-width: 900px) and (max-width: 1074px) {
  #route_body .inner-route-body {
    width: 660px;
  }
}
@media only screen and (min-width: 1075px) and (max-width: 1249px) {
  #route_body .inner-route-body {
    width: 580px;
  }
}
@media only screen and (min-width: 1250px) and (max-width: 1420px) {
  #route_body .inner-route-body {
    width: 720px;
  }
}
@media only screen and (min-width: 1421px) {
  #route_body .inner-route-body {
    width: 920px;
  }
}
#route_body .pub-aside {
  display: inline-block;
  width: 248px;
  vertical-align: top;
  position: relative;
  border-left: 1px solid #e2e8ea;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  left: -1px;
}
@media only screen and (min-width: 900px) and (max-width: 1074px) {
  #route_body .pub-aside {
    display: none;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #route_body .pub-aside {
    display: none;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #route_body .pub-aside {
    display: none;
  }
}
@media only screen and (max-width: 468px) {
  #route_body .pub-aside {
    display: none;
  }
}
#pub_aside {
  width: 100%;
  font-size: 10px;
  background-color: #f9f9f9;
}
#pub_aside .pub-body {
  padding: 13px 17px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-color: #f9f9f9;
  position: relative;
}
#pub_aside .pub-body .pub-body-menulist {
  position: absolute;
  left: 7px;
  right: 5px;
}
#pub_aside .pub-body .pub-body-title {
  margin-bottom: 15px;
  color: #58666e;
  font-size: 15px;
}
#pub_aside .pub-body .pub-item {
  padding-bottom: 25px;
}
#pub_aside .pub-body .pub-item .pub-face {
  background-size: cover !important;
  -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
  cursor: pointer;
}
#pub_aside .pub-body .pub-item .pub-face,
#pub_aside .pub-body .pub-item .pub-item-wrap {
  display: inline-block;
  vertical-align: top;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#pub_aside .pub-body .pub-item .pub-item-wrap {
  width: calc(100% - 50px);
  padding-left: 9px;
  font-size: 0;
  padding-right: 1px;
}
#pub_aside .pub-body .pub-body-comment .item-body,
#pub_aside .pub-body .pub-body-comment .item-committer,
#pub_aside .pub-body .pub-body-comment .item-title {
  color: #58666e;
  font-size: 12.5px;
  cursor: pointer;
}
#pub_aside .pub-body .pub-body-comment .item-body {
  color: #98a6ad;
}
#pub_aside .pub-body .pub-body-comment .item-committer {
  float: right;
}
#pub_aside .pub-body .pub-body-view-posts .item-title {
  color: #58666e;
  font-size: 12.5px;
  cursor: pointer;
  line-height: 17px;
}
#pub_aside .pub-body .pub-body-view-posts .item-see,
#pub_aside .pub-body .pub-body-view-posts .item-see .icon {
  font-size: 10px;
  color: #98a6ad;
}
#pub_aside .pub-head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-bottom: 1px solid #e2e8ea;
}
#pub_aside .pub-head .article-menu-bottom {
  border-bottom: 1px solid #b4b4b4;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#pub_aside .pub-head .article-menu-item {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  text-align: center;
  cursor: pointer;
  height: 100%;
  line-height: 40px;
  margin-top: 10px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#pub_aside .pub-head .article-menu-item span {
  font-size: 23px !important;
  color: #98a6ad;
}
.emoji_btn {
  position: absolute;
  display: inline-block;
  cursor: pointer;
  width: 25px;
  height: 25px;
}
.emoji_container * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.emoji_container {
  display: none;
  position: absolute;
  background-color: #fff;
  border: 1px solid #bfbfbf;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.176);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.176);
}
.emoji_container ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}
.emoji_content {
  height: 277px;
  overflow-y: auto;
  padding: 5px;
}
.emoji_content ul {
  padding-top: 1px;
  padding-left: 1px;
}
.emoji_content ul li {
  width: 54px;
  height: 54px;
  float: left;
  border: 1px solid #e3e3e3;
  margin-top: -1px;
  margin-left: -1px;
}
.emoji_content ul li a {
  display: block;
  line-height: 54px;
  text-align: center;
  cursor: pointer;
}
.emoji_content ul li a img {
  vertical-align: middle;
  max-width: 30px;
  max-height: 30px;
}
.emoji_content .mCSB_scrollTools {
  width: 10px;
}
.emoji_content .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical,
.emoji_content .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical {
  margin: 5px 0;
}
.emoji_tab {
  background-color: #f7f7f7;
  border-top: 1px solid #e3e3e3;
  color: #666;
  height: 32px;
  position: relative;
}
.emoji_tab_prev {
  border-right: 4px dashed;
  left: 8px;
}
.emoji_tab_next,
.emoji_tab_prev {
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  cursor: pointer;
  top: 12px;
  position: absolute;
  display: inline-block;
  height: 0;
  vertical-align: middle;
  width: 0;
}
.emoji_tab_next {
  border-left: 4px dashed;
  right: 7px;
}
.emoji_tab_list {
  left: 22px;
  overflow: hidden;
  position: absolute;
  top: 0;
}
.emoji_tab_list ul {
  width: 1500px;
  -webkit-transition: all 0.8s ease 0s;
  transition: all 0.8s ease 0s;
}
.emoji_tab_list ul li {
  border-top: 0;
  cursor: pointer;
  float: left;
  height: 22px;
  line-height: 22px;
  margin: 5px 4px 0 0;
  font-size: 12px;
  border-radius: 3px;
  text-align: center;
  width: 68px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.emoji_tab_list ul li:hover {
  background: #e5e5e5;
}
.emoji_tab_list ul li.selected {
  color: #fff;
  background: #4682b4;
}
.emoji_preview {
  position: absolute;
  top: 0;
  border: 1px solid #c8c8c8;
  border-radius: 50%;
  width: 65px;
  height: 65px;
  background: #fff;
  text-align: center;
  line-height: 65px;
  -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.176);
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.176);
  z-index: 2;
  display: none;
}
.emoji_preview img {
  vertical-align: middle;
  max-width: 42px;
  max-height: 42px;
}
.emoji_icon {
  vertical-align: top;
  margin-left: 2px;
  margin-right: 2px;
  width: 23px;
  height: 23px;
  background-color: transparent;
}
#blog_info_page .menu-body-item {
  padding: 8px 5px 0 6px;
}
#blog_info_page .menu-body-item .menu-body-item-title {
  margin-bottom: 10px;
  color: #58666e;
  font-size: 15px;
}
#blog_info_page .menu-body-item .menu-body-info {
  font-size: 13px;
  color: #44525a;
  border: 1px solid #e2e8ea;
  border-radius: 5px;
}
#blog_info_page .menu-body-item .menu-body-info .info-item:nth-of-type(n-1) {
  border-bottom: 1px solid #e2e8ea;
}
#blog_info_page .menu-body-item .menu-body-info .info-item {
  cursor: pointer;
  opacity: 0.6;
  background-color: #fff;
  padding: 10px 20px;
  min-height: 18px;
}
#blog_info_page .menu-body-item .menu-body-info .info-item .icon {
  position: relative;
  top: -1px;
}
#blog_info_page .menu-body-item .menu-body-info .info-item span {
  vertical-align: top;
}
#blog_info_page .menu-body-item .menu-body-info .info-item .info-item-left {
  float: left;
}
#blog_info_page .menu-body-item .menu-body-info .info-item .info-item-right {
  float: right;
}
#blog_cloud_page .menu-body-item {
  padding: 15px 8px 0;
}
#blog_cloud_page .menu-body-item .menu-body-item-title {
  margin-bottom: 10px;
  color: #58666e;
  font-size: 15px;
}
#blog_cloud_page .menu-body-item .cloud-content {
  display: inline-block;
  font-size: 12px;
  word-break: break-all;
  width: 100%;
  margin-bottom: 20px;
}
#blog_cloud_page .menu-body-item .cloud-content > span {
  display: inline-block;
  margin-right: 3px;
  margin-bottom: 3px;
}
#blog_cloud_page .menu-body-item .info-item-bg:after,
#blog_cloud_page .menu-body-item .info-item-bg:before {
  content: "\3000";
  width: 8px;
  display: inline-block;
  height: 18px;
  background-color: #cfdadd;
  vertical-align: top;
}
#blog_cloud_page .menu-body-item .info-item-bg:before {
  border-radius: 20px 0 0 20px;
}
#blog_cloud_page .menu-body-item .info-item-bg:after {
  border-radius: 0 20px 20px 0;
}
#blog_cloud_page .menu-body-item .info-item-bg {
  font-size: 0;
  height: 18px;
  overflow: hidden;
  width: auto;
  display: inline-block;
}
#blog_cloud_page .menu-body-item .info-item-bg > span {
  font-size: 12.8px;
  background-color: #cfdadd;
  display: inline-block;
  color: #fff;
  text-shadow: 1px 1px 1px rgba(80, 80, 80, 0.6);
  cursor: pointer;
  height: 18px;
  vertical-align: top;
  position: relative;
  top: -1px;
  padding-bottom: 1px;
  max-width: 85px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#blog_navicat_page .blog-navicat-page::-webkit-scrollbar {
  display: none;
}
#blog_navicat_page .blog-navicat-page {
  font-size: 12px;
  position: relative;
  width: 235px;
}
.toc,
.toc * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.toc {
  padding: 1rem 0;
  width: 100%;
  max-width: 350px;
  margin: 1rem 0;
  color: #333;
  position: relative;
}
.toc.toc-fixed {
  z-index: 10;
}
.toc-hightlight {
  width: 100%;
  background: #eee;
  position: absolute;
  left: 0;
  top: 0;
  border-left: 3px solid #009a61;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.toc.toc-fixed {
  z-index: 1;
}
.toc-nav a {
  margin-right: 0 !important;
}
.toc-brand {
  padding: 0 1.25rem;
  font-weight: 700;
  font-size: 1rem;
  line-height: inherit;
  white-space: nowrap;
  display: block;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.toc-navbar {
  position: relative;
  display: block;
  scroll-behavior: smooth;
}
.toc-navbar::-webkit-scrollbar-thumb:horizontal {
  width: 5px;
  background-color: #ccc;
  border-radius: 6px;
}
.toc-navbar::-webkit-scrollbar-track-piece {
  background-color: #fff;
  border-radius: 0;
}
.toc-navbar::-webkit-scrollbar {
  width: 10px;
  height: 8px;
}
.toc-navbar::-webkit-scrollbar-thumb:vertical {
  height: 50px;
  background-color: #999;
  border-radius: 4px;
  outline: 2px solid #fff;
  outline-offset: -2px;
  border: 2px solid #fff;
}
.toc-navbar::-webkit-scrollbar-thumb:hover {
  height: 50px;
  background-color: #9f9f9f;
  border-radius: 4px;
}
.toc-nav {
  display: block;
  padding-left: 0;
  margin-bottom: 0;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.toc-link {
  display: block;
  padding: 0.2rem 1.7rem;
  font-size: 0.9rem;
  text-decoration: none;
  color: #555;
  position: relative;
}
.toc-link:before {
  content: " ";
  height: 0.25rem;
  width: 0.25rem;
  background: #555;
  position: absolute;
  top: 0.8rem;
  left: 1rem;
}
.toc-link.active:before,
.toc-link:hover:before {
  background: #009a61;
}
.toc-link.active,
.toc-link:hover {
  color: #009a61;
}
.toc-link.ml-1 {
  padding-left: 2rem !important;
}
.toc-link.ml-2 {
  padding-left: 3rem !important;
}
.toc-link.ml-3 {
  padding-left: 4rem !important;
}
.toc-link.ml-4 {
  padding-left: 5rem !important;
}
.toc-link.ml-5 {
  padding-left: 6rem !important;
}
.toc-link.ml-6 {
  padding-left: 7rem !important;
}
#blog_cloud_ad {
  padding: 0 5px;
}
#blog_cloud_ad .pub-body-title {
  margin-bottom: 2px !important;
}
#blog_cloud_ad .blog-cloud-ad-item {
  padding: 5px 0;
}
#blog_cloud_ad .blog-cloud-ad-item img {
  width: 100%;
  cursor: pointer;
}
#route_body_shade {
  height: 100%;
  position: relative;
  z-index: 10;
}
#route_body_shade .fade-enter-active,
#route_body_shade .fade-leave-active {
  -webkit-transition: all 0.25s ease-in-out 0s;
  transition: all 0.25s ease-in-out 0s;
}
#route_body_shade .fade-enter,
#route_body_shade .fade-leave-to {
  opacity: 0;
}
#route_body_shade .trans-enter,
#route_body_shade .trans-leave-to {
  -webkit-transform: translateY(0);
  transform: translateY(0);
}
#route_body_shade .loading-screen-lump-wrap {
  position: absolute;
  left: 0;
  right: 0;
}
#route_body_shade .loading-screen-lump-wrap .loading-screen-lump {
  font-size: 12px;
  z-index: 2;
  height: 85px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition: all 0.25s ease-in-out 0s;
  transition: all 0.25s ease-in-out 0s;
  position: relative;
}
#route_body_shade
  .loading-screen-lump-wrap
  .loading-screen-lump
  .loading-screen-wrap {
  margin: 8px;
  height: 65px;
  background-color: #fff;
  border-radius: 5px;
  -webkit-box-shadow: 0 1px 5px rgba(80, 80, 80, 0.2);
  box-shadow: 0 1px 5px rgba(80, 80, 80, 0.2);
  text-align: center;
}
#route_body_shade
  .loading-screen-lump-wrap
  .loading-screen-lump
  .loading-screen-wrap
  .loading-screen-in {
  padding-top: 13px;
  width: 40px;
  height: 100%;
  display: inline-block;
}
#route_body_shade
  .loading-screen-lump-wrap
  .loading-screen-lump
  .loading-screen-wrap
  .loading-screen-in
  .k-ball7a {
  border: 0;
  margin: 0;
  width: 16px;
  height: 16px;
  position: absolute;
  border-radius: 50%;
  -webkit-animation: k-loadingO 2s ease infinite;
  animation: k-loadingO 2s ease infinite;
  background: #19a68c;
  -webkit-animation-delay: -1.5s;
  animation-delay: -1.5s;
}
#route_body_shade
  .loading-screen-lump-wrap
  .loading-screen-lump
  .loading-screen-wrap
  .loading-screen-in
  .k-ball7b {
  border: 0;
  margin: 0;
  width: 16px;
  height: 16px;
  position: absolute;
  border-radius: 50%;
  -webkit-animation: k-loadingO 2s ease infinite;
  animation: k-loadingO 2s ease infinite;
  background: #f63d3a;
  -webkit-animation-delay: -1s;
  animation-delay: -1s;
}
#route_body_shade
  .loading-screen-lump-wrap
  .loading-screen-lump
  .loading-screen-wrap
  .loading-screen-in
  .k-ball7c {
  border: 0;
  margin: 0;
  width: 16px;
  height: 16px;
  position: absolute;
  border-radius: 50%;
  -webkit-animation: k-loadingO 2s ease infinite;
  animation: k-loadingO 2s ease infinite;
  background: #fda543;
  -webkit-animation-delay: -0.5s;
  animation-delay: -0.5s;
}
#route_body_shade
  .loading-screen-lump-wrap
  .loading-screen-lump
  .loading-screen-wrap
  .loading-screen-in
  .k-ball7d {
  border: 0;
  margin: 0;
  width: 16px;
  height: 16px;
  position: absolute;
  border-radius: 50%;
  -webkit-animation: k-loadingO 2s ease infinite;
  animation: k-loadingO 2s ease infinite;
  background: #193b48;
}
@-webkit-keyframes k-loadingO {
  0%,
  to {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
  25% {
    -webkit-transform: translate(160%);
    transform: translate(160%);
  }
  50% {
    -webkit-transform: translate(160%, 160%);
    transform: translate(160%, 160%);
  }
  75% {
    -webkit-transform: translateY(160%);
    transform: translateY(160%);
  }
}
@keyframes k-loadingO {
  0%,
  to {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
  25% {
    -webkit-transform: translate(160%);
    transform: translate(160%);
  }
  50% {
    -webkit-transform: translate(160%, 160%);
    transform: translate(160%, 160%);
  }
  75% {
    -webkit-transform: translateY(160%);
    transform: translateY(160%);
  }
}
#route_body_shade .loading-screen-lump-wrap .loading-screen-lump-show {
  -webkit-transform: translateY(0);
  transform: translateY(0);
}
#route_body_shade .loading-screen-back {
  position: absolute;
  height: 100%;
  width: 100%;
  background-color: #fafafa;
  display: inline-block;
}
.loading-bar .preloaderbarShow {
  -webkit-transform: translateY(0) !important;
  transform: translateY(0) !important;
}
.loading-bar .preloaderbar {
  -webkit-transition: all 0.2s ease 0s;
  transition: all 0.2s ease 0s;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
  z-index: 1;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  margin-bottom: -4px;
}
.loading-bar .preloaderbar .bar {
  position: absolute;
  width: 100%;
  height: 0;
  text-indent: -9999px;
  background-color: #23b7e5;
}
.loading-bar .preloaderbar .bar:before {
  position: absolute;
  right: 50%;
  left: 50%;
  height: 3px;
  background-color: inherit;
  content: "";
}
.loading-bar .preloaderbar.active {
  -webkit-animation: changebar 2.25s 0.75s infinite;
  animation: changebar 2.25s 0.75s infinite;
}
.loading-bar .preloaderbar.active .bar {
  -webkit-animation: changebar 2.25s infinite;
  animation: changebar 2.25s infinite;
}
.loading-bar .preloaderbar.active .bar:before {
  -webkit-animation: movingbar 0.75s infinite;
  animation: movingbar 0.75s infinite;
}
@-webkit-keyframes movingbar {
  0% {
    right: 50%;
    left: 50%;
  }
  99.9% {
    right: 0;
    left: 0;
  }
  to {
    right: 50%;
    left: 50%;
  }
}
@keyframes movingbar {
  0% {
    right: 50%;
    left: 50%;
  }
  99.9% {
    right: 0;
    left: 0;
  }
  to {
    right: 50%;
    left: 50%;
  }
}
@-webkit-keyframes changebar {
  0% {
    background-color: #8bc34a;
  }
  33.3% {
    background-color: #8bc34a;
  }
  33.33% {
    background-color: #ffca28;
  }
  66.6% {
    background-color: #ffca28;
  }
  66.66% {
    background-color: #f44336;
  }
  99.9% {
    background-color: #f44336;
  }
}
@keyframes changebar {
  0% {
    background-color: #8bc34a;
  }
  33.3% {
    background-color: #8bc34a;
  }
  33.33% {
    background-color: #ffca28;
  }
  66.6% {
    background-color: #ffca28;
  }
  66.66% {
    background-color: #f44336;
  }
  99.9% {
    background-color: #f44336;
  }
}
#blog_bottom {
  width: 100%;
  height: 40px;
  background-color: #edf1f2;
  border-top: 1px solid #dee5e7;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  font-size: 0;
  line-height: 43px;
  overflow: hidden;
  white-space: nowrap;
}
#blog_bottom .copyright {
  cursor: default;
  display: inline-block;
  color: #58666e;
  font-size: 13px;
  float: left;
  line-height: 16px;
  -webkit-transform: translateY(calc(50% + 6px));
  transform: translateY(calc(50% + 6px));
  margin-left: 16px;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_bottom .copyright {
    margin-left: 5px;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_bottom .copyright {
    margin-left: 5px;
  }
}
@media only screen and (max-width: 468px) {
  #blog_bottom .copyright {
    margin-left: 5px;
  }
}
#blog_bottom .author-clz {
  font-weight: 700;
  cursor: pointer;
  padding: 0 4px;
  border-bottom: 1px solid hsla(0, 0%, 47.1%, 0.6);
}
#blog_bottom .technology {
  font-weight: 600;
  font-size: 28px;
  font-family: "\9ED1\4F53";
  color: #8c888b;
  background: -webkit-linear-gradient(45deg, red, #f90, #fc0, #6c0, #0fc);
  color: transparent;
  -webkit-background-clip: text;
  -webkit-animation: ran 10s linear infinite;
  animation: ran 10s linear infinite;
  display: inline-block;
  font-size: 15px;
  float: right;
  padding-right: 10px;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_bottom .technology {
    display: none;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_bottom .technology {
    display: none;
  }
}
@media only screen and (max-width: 468px) {
  #blog_bottom .technology {
    display: none;
  }
}
#blog_article_full_screen {
  position: absolute;
  z-index: 15;
}
#blog_article_full_screen .fade-leave-active,
#blog_article_full_screen fade-enter-active {
  opacity: 1;
}
#blog_article_full_screen .fade-enter,
#blog_article_full_screen .fade-leave-to {
  opacity: 0;
}
#blog_article_full_screen .blog-article-full-screen-warp {
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
  position: absolute;
  z-index: 5 !important;
}
#blog_article_full_screen
  .blog-article-full-screen-warp
  .post-body-content-fiex-wrap::-webkit-scrollbar {
  width: 7px;
  height: 7px;
  background-color: #f5f5f5;
}
#blog_article_full_screen
  .blog-article-full-screen-warp
  .post-body-content-fiex-wrap::-webkit-scrollbar-track {
  border-radius: 10px;
  background-color: #f5f5f5;
}
#blog_article_full_screen
  .blog-article-full-screen-warp
  .post-body-content-fiex-wrap::-webkit-scrollbar-thumb:hover {
  background-color: #a0a0a0;
}
#blog_article_full_screen
  .blog-article-full-screen-warp
  .post-body-content-fiex-wrap::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: #a0a0a0;
}
#blog_article_full_screen
  .blog-article-full-screen-warp
  .post-body-content-fiex-wrap {
  -webkit-transform-origin: 0 0;
  transform-origin: center;
  -webkit-transition: all 0.3s ease-in;
  background: #e0d8c8;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  text-align: center;
  padding: 20px;
  overflow-y: scroll;
  overflow-scrolling: touch;
  -webkit-overflow-scrolling: touch;
  z-index: 99 !important;
}
#blog_article_full_screen
  .blog-article-full-screen-warp
  .post-body-content-fiex-wrap
  .post-body-fiex-close {
  display: inline-block;
  position: fixed;
  top: 0;
  cursor: pointer;
  margin: 10px;
}
@media only screen and (max-width: 468px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-close {
    right: 35px;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-close {
    right: 35px;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-close {
    right: 35px;
  }
}
@media only screen and (min-width: 900px) and (max-width: 1074px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-close {
    right: 35px;
  }
}
@media only screen and (min-width: 1075px) and (max-width: 1249px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-close {
    right: "";
  }
}
@media only screen and (min-width: 1250px) and (max-width: 1420px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-close {
    right: "";
  }
}
@media only screen and (min-width: 1421px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-close {
    right: "";
  }
}
#blog_article_full_screen
  .blog-article-full-screen-warp
  .post-body-content-fiex-wrap
  .post-body-fiex-close
  span {
  font-size: 35px !important;
  color: rgba(80, 80, 80, 0.4);
}
#blog_article_full_screen
  .blog-article-full-screen-warp
  .post-body-content-fiex-wrap
  .post-body-fiex-menu {
  text-align: left;
  display: inline-block;
  position: fixed;
  margin-left: 10px;
  top: 50px;
  height: 800px;
  font-size: 12px;
}
#blog_article_full_screen
  .blog-article-full-screen-warp
  .post-body-content-fiex-wrap
  .post-body-fiex-menu
  #post_body_fiex_menu_anchor {
  position: relative;
  background: hsla(0, 0%, 98%, 0.5);
  border-radius: 5px;
  -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
}
@media only screen and (max-width: 468px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-menu
    #post_body_fiex_menu_anchor {
    width: 0;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-menu
    #post_body_fiex_menu_anchor {
    width: 0;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-menu
    #post_body_fiex_menu_anchor {
    width: 0;
  }
}
@media only screen and (min-width: 900px) and (max-width: 1074px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-menu
    #post_body_fiex_menu_anchor {
    width: 0;
  }
}
@media only screen and (min-width: 1075px) and (max-width: 1249px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-menu
    #post_body_fiex_menu_anchor {
    width: 200px;
  }
}
@media only screen and (min-width: 1250px) and (max-width: 1420px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-menu
    #post_body_fiex_menu_anchor {
    width: 220px;
  }
}
@media only screen and (min-width: 1421px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-menu
    #post_body_fiex_menu_anchor {
    width: 220px;
  }
}
@media only screen and (max-width: 468px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-menu
    #post_body_fiex_menu_anchor {
    display: none;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-menu
    #post_body_fiex_menu_anchor {
    display: none;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-menu
    #post_body_fiex_menu_anchor {
    display: none;
  }
}
@media only screen and (min-width: 900px) and (max-width: 1074px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-menu
    #post_body_fiex_menu_anchor {
    display: none;
  }
}
@media only screen and (min-width: 1075px) and (max-width: 1249px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-menu
    #post_body_fiex_menu_anchor {
    display: "";
  }
}
@media only screen and (min-width: 1250px) and (max-width: 1420px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-menu
    #post_body_fiex_menu_anchor {
    display: "";
  }
}
@media only screen and (min-width: 1421px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-fiex-menu
    #post_body_fiex_menu_anchor {
    display: "";
  }
}
#blog_article_full_screen
  .blog-article-full-screen-warp
  .post-body-content-fiex-wrap
  .post-body-fiex-menu
  #post_body_fiex_menu_anchor
  .toc-brand {
  margin-bottom: 10px !important;
}
#blog_article_full_screen
  .blog-article-full-screen-warp
  .post-body-content-fiex-wrap
  .post-body-title-fullscreen {
  width: 100%;
  font-weight: 700;
  text-align: center;
  font-size: 25px;
  margin-bottom: 10px;
}
#blog_article_full_screen
  .blog-article-full-screen-warp
  .post-body-content-fiex-wrap
  .post-body-content-fiex-inner-wrap {
  display: inline-block;
  padding: 50px 55px 40px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 auto;
  background: #f8f1e2;
  -webkit-box-shadow: 0 6px 12px 3px rgba(0, 0, 0, 0.2);
  box-shadow: 0 6px 12px 3px rgba(0, 0, 0, 0.2);
  border-radius: 3px;
  text-align: left;
}
@media only screen and (max-width: 468px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-content-fiex-inner-wrap {
    width: 100%;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-content-fiex-inner-wrap {
    width: 100%;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-content-fiex-inner-wrap {
    width: 100%;
  }
}
@media only screen and (min-width: 900px) and (max-width: 1074px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-content-fiex-inner-wrap {
    width: 100%;
  }
}
@media only screen and (min-width: 1075px) and (max-width: 1249px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-content-fiex-inner-wrap {
    width: 640px;
  }
}
@media only screen and (min-width: 1250px) and (max-width: 1420px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-content-fiex-inner-wrap {
    width: 740px;
  }
}
@media only screen and (min-width: 1421px) {
  #blog_article_full_screen
    .blog-article-full-screen-warp
    .post-body-content-fiex-wrap
    .post-body-content-fiex-inner-wrap {
    width: 920px;
  }
}
#blog_article_full_screen
  .blog-article-full-screen-warp
  .post-body-content-fiex-wrap {
  padding-top: 10px;
  font-size: 15px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#article_body {
  border-right: 1px solid #dee5e7;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-color: #f6f8f9;
}
#article_body .article-body-margin {
  margin: 10px 15px;
}
#article_body .article-body-item {
  background-color: #fff;
  margin: 10px 15px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-shadow: 1px 1px 2px rgba(80, 80, 80, 0.2);
  box-shadow: 1px 1px 2px rgba(80, 80, 80, 0.2);
  border-radius: 5px;
  border: 1px solid hsla(0, 0%, 94.1%, 0.8);
  padding: 20px 30px;
}
#article_title .article-page-head-wrap {
  border-bottom: 1px solid #e2e8ea;
  padding: 18px 15px 22px 22px;
  background-color: #fff;
}
#article_title .article-page-head-wrap .author-title {
  font-size: 22px;
  margin-bottom: 15px;
}
#article_title .article-page-head-wrap .author-title .fangdabtn {
  margin-left: 10px;
  cursor: pointer;
}
#article_title .article-page-head-wrap .author-sign {
  margin-top: 6px;
  color: #98a6ad;
  font-size: 12px;
}
#article_title .article-page-head-wrap .author-sign > span {
  margin-right: 10px;
}
#article_title .article-page-head-wrap .author-sign > span .icon {
  margin-right: 1px;
}
#article_title .article-page-head-wrap .author-sign .ios-shijian,
#article_title .article-page-head-wrap .author-sign .label,
#article_title .article-page-head-wrap .author-sign .renyuanguanli,
#article_title .article-page-head-wrap .author-sign .see {
  font-size: 11px;
}
#article_title .article-page-head-wrap .author-sign .label-item {
  cursor: pointer;
}
#article_pre_line {
  font-size: 12px;
}
#article_pre_line .post-body-title {
  color: #58666e;
  padding: 8px 15px 6px;
  margin: 10px 15px 0;
  background-color: #fff;
  font-size: 14px;
  border: 1px solid #eee;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 5px;
}
#article_pre_line .post-body-title span {
  cursor: pointer;
}
#article_pre_line .post-body-title .right-area {
  float: right;
}
#article_pre_line .post-body-title .right-area .weibo {
  margin-left: 8px;
  margin-right: 4px;
}
#article_pre_line .post-body-title .sep {
  font-size: 13px;
  color: #ccc;
  margin-left: 2px;
  margin-right: 2px;
}
#article_pre_line .post-body-title span {
  vertical-align: top;
}
#article_pre_line .post-body-title .home {
  margin-right: 2px;
}
#article_desc .article-page-body-wrap {
  font-size: 15px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#article_desc .article-page-body-wrap .inner-body-wrap {
  border-bottom: 1px solid #d3d3d3;
}
#article_desc .article-page-body-wrap .inner-body-wrap .body-wrap-bottom {
  font-size: 12px;
  color: #9b9b9b;
  padding-top: 5px;
  padding-bottom: 8px;
}
#article_desc
  .article-page-body-wrap
  .inner-body-wrap
  .body-wrap-bottom
  .ios-shijian {
  font-size: 11px;
}
#article_desc .article-page-body-wrap .post-body-bottom {
  font-size: 15px;
  margin-top: 8px;
  margin-bottom: 8px;
  text-align: center;
  font-size: 12px;
  color: rgba(60, 60, 60, 0.95);
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #article_desc .article-page-body-wrap .post-body-bottom {
    font-size: 10px;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #article_desc .article-page-body-wrap .post-body-bottom {
    font-size: 10px;
  }
}
@media only screen and (max-width: 468px) {
  #article_desc .article-page-body-wrap .post-body-bottom {
    font-size: 10px;
  }
}
#article_desc
  .article-page-body-wrap
  .post-body-bottom
  .post-bottom-item:hover {
  background-color: hsla(0, 0%, 86.3%, 0.7);
}
#article_desc
  .article-page-body-wrap
  .post-body-bottom
  .post-bottom-item:active {
  background-color: hsla(0, 0%, 86.3%, 0.6);
}
#article_desc .article-page-body-wrap .post-body-bottom .post-bottom-item {
  display: inline-block;
  padding: 2px 8px;
  margin-top: 3px;
  background-color: hsla(0, 0%, 94.1%, 0.8);
  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
  border: 1px solid #ccc;
  cursor: pointer;
  margin-left: 4px;
  margin-right: 4px;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #article_desc .article-page-body-wrap .post-body-bottom .post-bottom-item {
    height: 18px;
    line-height: 14px;
  }
  #article_desc
    .article-page-body-wrap
    .post-body-bottom
    .post-bottom-item
    .icon {
    position: relative;
    top: 1px;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #article_desc .article-page-body-wrap .post-body-bottom .post-bottom-item {
    height: 18px;
    line-height: 14px;
  }
  #article_desc
    .article-page-body-wrap
    .post-body-bottom
    .post-bottom-item
    .icon {
    position: relative;
    top: 1px;
  }
}
@media only screen and (max-width: 468px) {
  #article_desc .article-page-body-wrap .post-body-bottom .post-bottom-item {
    height: 18px;
    line-height: 14px;
  }
  #article_desc
    .article-page-body-wrap
    .post-body-bottom
    .post-bottom-item
    .icon {
    position: relative;
    top: 1px;
  }
}
#articles_comment .comment-top {
  margin-bottom: 12px;
}
#articles_comment .comment-top .comment-title {
  font-size: 19px;
  color: #34495e;
  font-weight: 600;
}
#articles_comment .comment-top .right-bar-wrap {
  float: right;
  position: relative;
  top: 10px;
}
#articles_comment .comment-top .right-bar-wrap .icon {
  font-size: 18px;
  font-weight: 700;
  cursor: pointer;
  padding-left: 4px;
  color: #787878;
}
#articles_comment .comment-textarea {
  height: 200px;
}
#articles_comment .comment-textarea textarea {
  width: 100%;
  height: 100%;
  outline: none;
  resize: none;
  padding: 5px;
  line-height: 18px;
  border: 1px solid hsla(0, 0%, 58.4%, 0.7);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#articles_comment .comment-textarea textarea:focus {
  border: 1px solid #d2d2d2;
}
#articles_comment .comment-bottom {
  position: relative;
  margin-top: 4px;
}
#articles_comment .comment-bottom .comment-btn {
  position: absolute;
  top: 7px;
  width: 100%;
  text-align: center;
}
#articles_comment .comment-bottom .comment-btn span {
  vertical-align: top;
  font-size: 14px;
  border: 1px solid hsla(0, 0%, 62.7%, 0.5);
  padding: 3px 35px;
  border-radius: 5px;
  background-color: hsla(0, 0%, 52.9%, 0.2);
  cursor: pointer;
}
#articles_comment .comment-bottom .comment-btn .cancel {
  padding: 3px 8px;
  font-size: 11px;
  vertical-align: bottom;
  margin-left: 5px;
  position: absolute;
}
#articles_comment .comment-bottom .comment-btn span:hover {
  background-color: hsla(0, 0%, 45.1%, 0.3);
}
#articles_comment .comment-bottom .comment-btn span:active {
  background-color: hsla(0, 0%, 49%, 0.4);
}
#articles_comment .comment-bottom .opt-bar .ext-wrap > span {
  vertical-align: top;
  line-height: 18px;
  width: 60px;
  display: inline-block;
  text-align: center;
  cursor: pointer;
  border: 1px solid hsla(0, 0%, 62.7%, 0.5);
  padding: 3px 3px 1px;
  margin: 3px 3px 3px 0;
  border-radius: 5px;
  background-color: hsla(0, 0%, 74.5%, 0.2);
  font-size: 9px;
  z-index: 1;
  position: relative;
}
#articles_comment .comment-bottom .opt-bar .ext-wrap > span:hover {
  background-color: hsla(0, 0%, 45.1%, 0.3);
}
#articles_comment .comment-bottom .opt-bar .ext-wrap > span:active {
  background-color: hsla(0, 0%, 49%, 0.4);
}
#article_message .article-message-wrap .message-title {
  font-size: 19px;
  color: #34495e;
  font-weight: 600;
  padding-bottom: 10px;
}
#article_message .article-message-wrap .message-body-nocomment {
  font-size: 15px;
  text-align: center;
  color: grey;
}
#article_message .article-message-wrap .message-body-warp {
  font-size: 15px;
}
#article_message .article-message-wrap .message-body-warp .body-item {
  vertical-align: top;
  width: 100%;
  position: relative;
  border-top: 1px solid #e7edef;
  padding-top: 12px;
  padding-bottom: 12px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .avatar-img {
  display: inline-block;
  padding-right: 10px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .avatar-img
  img {
  width: 45px;
  height: 45px;
  border-radius: 28px;
  -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .message-desc {
  vertical-align: top;
  display: inline-block;
  word-wrap: break-word;
  width: calc(100% - 60px);
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .message-desc
  .message-desc-bar {
  cursor: pointer;
  display: inline-block;
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .message-desc
  .message-desc-bar
  .desc-level {
  font-size: 13px;
  text-decoration: none;
  color: #333;
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .message-desc
  .message-desc-bar
  .desc-author {
  margin-left: 5px;
  font-size: 16px;
  display: inline-block;
  font-weight: 600;
  color: #58666e;
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .message-desc
  .desc-date {
  font-size: 12px;
  color: rgba(152, 166, 173, 0.9);
  margin: 8px 0;
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .message-desc
  .desc-content {
  font-size: 15px;
  color: #536269;
  line-height: 21px;
  margin-top: 5px;
  margin-bottom: 20px;
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .message-desc
  .desc-content
  a {
  color: #536269;
  text-decoration: none;
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .message-desc
  .desc-content
  img {
  max-width: 100%;
  max-height: 100%;
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .message-btn-wrap {
  display: inline-block;
  vertical-align: top;
  position: absolute;
  right: 0;
  width: 150px;
  height: 100%;
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .message-btn-wrap
  .message-btn {
  width: 100%;
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .message-btn-wrap
  .message-btn
  > span {
  font-size: 8px;
  padding: 2px 8px;
  cursor: pointer;
  border-radius: 10px;
  background-color: rgba(25, 169, 213, 0.2);
  -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
  color: rgba(80, 80, 80, 0.6);
  margin-right: 4px;
  text-align: center;
  float: right;
  height: 14px;
  line-height: 14px;
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .message-btn-wrap
  .message-btn
  > span
  .icon {
  position: relative;
  top: 2px;
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .message-btn-wrap
  .message-btn
  > span
  .nozan {
  display: inline-block;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .message-btn-wrap
  .btn1 {
  position: absolute;
  top: 0;
}
#article_message
  .article-message-wrap
  .message-body-warp
  .body-item
  .message-btn-wrap
  .btn2 {
  position: absolute;
  bottom: 25px;
}
#pagination .post-comment-num {
  text-align: center;
  padding-top: 2px;
  padding-bottom: 7px;
  font-size: 12px;
}
#pagination .post-comment-num ul.pagination {
  display: inline-block;
  padding: 0;
  margin: 0;
}
#pagination .post-comment-num ul.pagination li {
  display: inline;
}
#pagination .post-comment-num ul.pagination li a {
  font-size: 12px;
  color: #383838;
  float: left;
  padding: 5px 11px;
  text-decoration: none;
  border-radius: 3px;
  cursor: pointer;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#pagination .post-comment-num ul.pagination li a.active {
  background-color: rgba(58, 63, 81, 0.99);
  color: #fff;
  border-radius: 3px;
}
#pagination .post-comment-num ul.pagination li a:hover:not(.active) {
  background-color: #ddd;
}
#pagination .post-comment-num li.seatClz a::-moz-selection {
  color: transparent !important;
  background-color: transparent !important;
}
#pagination .post-comment-num li.seatClz a::selection {
  color: transparent !important;
  background-color: transparent !important;
}
#pagination .post-comment-num li.seatClz a:hover {
  background-color: transparent !important;
}
#pagination .post-comment-num li.seatClz a {
  cursor: default !important;
  color: transparent !important;
}
#article_pre_pos {
  font-size: 15px;
}
#article_pre_pos .post-turning-pos,
#article_pre_pos .post-turning-pre {
  display: inline-block;
  background-color: #fff;
  -webkit-box-shadow: 1px 1px 2px rgba(80, 80, 80, 0.2);
  box-shadow: 1px 1px 2px rgba(80, 80, 80, 0.2);
  border-radius: 10px;
  cursor: pointer;
  border: 1px solid hsla(0, 0%, 94.1%, 0.8);
  padding: 5px 8px;
  font-size: 12px;
  color: #566872;
}
#article_pre_pos .post-turning-pos {
  float: right;
}
#blog_author_ing {
  position: relative;
  font-size: 0;
  vertical-align: top;
  display: inline-block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #dee5e7;
}
@media only screen and (max-width: 468px) {
  #blog_author_ing {
    width: 100%;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_author_ing {
    width: 100%;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_author_ing {
    width: 100%;
  }
}
@media only screen and (min-width: 900px) and (max-width: 1074px) {
  #blog_author_ing {
    width: 100%;
  }
}
@media only screen and (min-width: 1075px) and (max-width: 1249px) {
  #blog_author_ing {
    width: 577px;
  }
}
@media only screen and (min-width: 1250px) and (max-width: 1420px) {
  #blog_author_ing {
    width: 716px;
  }
}
@media only screen and (min-width: 1421px) {
  #blog_author_ing {
    width: 915px;
  }
}
#blog_author_ing .author-head-img-wrap {
  height: 240px;
  border-bottom: 1px solid #e2e8ea;
  overflow: hidden;
  position: relative;
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_author_ing .author-head-img-wrap {
    height: 200px;
  }
}
@media only screen and (max-width: 468px) {
  #blog_author_ing .author-head-img-wrap {
    height: 136px;
  }
}
#blog_author_ing .author-head-img-wrap .author-head-img {
  padding-left: 1px;
  width: calc(100% + 2px);
  z-index: 0;
  position: absolute;
  min-height: 100%;
}
#blog_author_ing .author-head-img-wrap .author-head-content {
  position: absolute;
  display: inline-block;
  width: 100%;
  height: 100%;
  padding: 40px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-color: hsla(0, 0%, 100%, 0.3);
}
@media only screen and (max-width: 468px) {
  #blog_author_ing .author-head-img-wrap .author-head-content {
    padding: 10px 20px 20px;
  }
}
#blog_author_ing
  .author-head-img-wrap
  .author-head-content
  .author-head-content-wrap {
  font-size: 0;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#blog_author_ing
  .author-head-img-wrap
  .author-head-content
  .author-head-content-wrap
  .head-bottom-wrap
  .head-bottom-icon {
  cursor: pointer;
  margin: 6px 6px 0 0;
  display: inline-block;
  width: 28px;
  height: 28px;
  background-color: hsla(0, 0%, 100%, 0.95);
  border-radius: 14px;
  background-clip: padding-box;
  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
  text-align: center;
}
#blog_author_ing
  .author-head-img-wrap
  .author-head-content
  .author-head-content-wrap
  .head-bottom-wrap
  .head-bottom-icon
  .icon {
  line-height: 28px;
  font-size: 15px;
  color: #58666e;
}
#blog_author_ing
  .author-head-img-wrap
  .author-head-content
  .author-head-content-wrap
  .head-bottom-wrap
  .head-bottom-icon:hover {
  background-color: hsla(0, 0%, 90.2%, 0.9);
}
#blog_author_ing
  .author-head-img-wrap
  .author-head-content
  .author-head-content-wrap
  .head-bottom-wrap
  .head-bottom-icon:active {
  background-color: hsla(0, 0%, 82.4%, 0.9);
}
#blog_author_ing
  .author-head-img-wrap
  .author-head-content
  .author-head-content-wrap
  .head-author-name {
  display: inline-block;
  font-size: 30px;
  font-weight: 600;
  color: #1e1e1e;
}
@media only screen and (max-width: 468px) {
  #blog_author_ing
    .author-head-img-wrap
    .author-head-content
    .author-head-content-wrap
    .head-author-name {
    font-size: 25px;
  }
}
#blog_author_ing
  .author-head-img-wrap
  .author-head-content
  .author-head-content-wrap
  .head-author-sign {
  display: inline-block;
  font-size: 15px;
  padding-left: 15px;
  color: hsla(0, 0%, 39.2%, 0.9);
}
@media only screen and (max-width: 468px) {
  #blog_author_ing
    .author-head-img-wrap
    .author-head-content
    .author-head-content-wrap
    .head-author-sign {
    font-size: 10px;
  }
}
#blog_author_ing
  .author-head-img-wrap
  .author-head-content
  .author-head-content-wrap
  .head-author-info {
  display: inline-block;
  float: right;
}
#blog_author_ing
  .author-head-img-wrap
  .author-head-content
  .author-head-content-wrap
  .head-author-info
  .head-author-info-item:not(:last-of-type) {
  margin-right: 30px;
}
#blog_author_ing
  .author-head-img-wrap
  .author-head-content
  .author-head-content-wrap
  .head-author-info
  .head-author-info-item {
  margin-top: 10px;
  display: inline-block;
}
@media only screen and (max-width: 468px) {
  #blog_author_ing
    .author-head-img-wrap
    .author-head-content
    .author-head-content-wrap
    .head-author-info
    .head-author-info-item {
    margin-top: 2px;
  }
}
#blog_author_ing
  .author-head-img-wrap
  .author-head-content
  .author-head-content-wrap
  .head-author-info
  .head-author-info-item
  .head-info-num {
  text-align: center;
  font-size: 25px;
  cursor: pointer;
  font-weight: 800;
  color: #58666e;
}
@media only screen and (max-width: 468px) {
  #blog_author_ing
    .author-head-img-wrap
    .author-head-content
    .author-head-content-wrap
    .head-author-info
    .head-author-info-item
    .head-info-num {
    font-size: 16px;
  }
}
#blog_author_ing
  .author-head-img-wrap
  .author-head-content
  .author-head-content-wrap
  .head-author-info
  .head-author-info-item
  .head-info-title {
  text-align: center;
  font-size: 13px;
}
@media only screen and (max-width: 468px) {
  #blog_author_ing
    .author-head-img-wrap
    .author-head-content
    .author-head-content-wrap
    .head-author-info
    .head-author-info-item
    .head-info-title {
    font-size: 10px;
  }
}
#blog_author_ing .page-num {
  font-size: 13px;
  z-index: 2;
  width: 100%;
  padding-top: 5px;
  padding-bottom: 5px;
  border-bottom: 1px solid #dee5e7;
  text-align: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#blog_author_ing .author-body-wrap {
  margin-bottom: 5px;
}
#blog_author_ing .author-body-wrap .author-content-item:after {
  content: "";
  width: 1px;
  background-color: #dee5e7;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 43px;
  z-index: 0;
}
#blog_author_ing .author-body-wrap .author-content-item:last-of-type {
  padding-bottom: 30px;
}
#blog_author_ing .author-body-wrap .author-content-item:first-of-type {
  padding-top: 10px;
}
#blog_author_ing .author-body-wrap .author-content-item:last-of-type:before {
  content: "";
  position: absolute;
  bottom: 0;
  width: 10px;
  height: 10px;
  left: 37px;
  border-radius: 5px;
  background-color: #fff;
  border: 1px solid #dee5e7;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  z-index: 1;
}
#blog_author_ing .author-body-wrap .author-content-item {
  position: relative;
  padding-right: 40px;
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-img-wrap {
  position: relative;
  width: 84px;
  text-align: center;
  display: inline-block;
  vertical-align: top;
  padding-top: 20px;
  z-index: 1;
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-img-wrap
  img {
  cursor: pointer;
  width: 40px;
  height: 40px;
  border-radius: 20px;
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap:after,
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap:before {
  content: "";
  position: absolute;
  left: -10px;
  top: 8px;
  font-size: 0;
  line-height: 0;
  border-left-width: 0;
  border-left-style: dashed;
  border-top: 10px dashed transparent;
  border-bottom: 10px dashed transparent;
  border-right: 10px solid #fff;
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap:after {
  left: -8px;
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap:before {
  left: -10px;
  border-right-color: #dee5e7;
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap {
  position: relative;
  color: #58666e;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin-top: 20px;
  width: calc(100% - 84px) !important;
  display: inline-block;
  vertical-align: top;
  word-break: break-all;
  font-size: 14px;
  background-color: #fff;
  border: 1px solid #dee5e7;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  border-radius: 5px;
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap
  .boadr-top-wrap {
  padding: 10px 10px 10px 14px;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_author_ing
    .author-body-wrap
    .author-content-item
    .author-content-body-wrap
    .boadr-top-wrap {
    padding: 8px;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_author_ing
    .author-body-wrap
    .author-content-item
    .author-content-body-wrap
    .boadr-top-wrap {
    padding: 8px;
  }
}
@media only screen and (max-width: 468px) {
  #blog_author_ing
    .author-body-wrap
    .author-content-item
    .author-content-body-wrap
    .boadr-top-wrap {
    padding: 8px;
  }
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap
  .boadr-top-wrap
  span {
  vertical-align: top;
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap
  .boadr-top-wrap
  .board-top-time {
  cursor: pointer;
  padding-right: 4px;
  font-size: 12px;
  float: right;
  color: #98a6ad;
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap
  .board-middle-wrap {
  word-break: break-all;
  border-top: 1px solid #dee5e7;
  border-bottom: 1px solid #dee5e7;
  padding: 20px 14px 30px;
  color: #58666e;
  font-size: 14px;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_author_ing
    .author-body-wrap
    .author-content-item
    .author-content-body-wrap
    .board-middle-wrap {
    padding: 10px 9px 13px;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_author_ing
    .author-body-wrap
    .author-content-item
    .author-content-body-wrap
    .board-middle-wrap {
    padding: 10px 9px 13px;
  }
}
@media only screen and (max-width: 468px) {
  #blog_author_ing
    .author-body-wrap
    .author-content-item
    .author-content-body-wrap
    .board-middle-wrap {
    padding: 10px 9px 13px;
  }
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap
  .board-middle-wrap
  a {
  color: #58666e;
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap
  .board-bottom-wrap {
  display: inline-block;
  padding: 10px 0 4px 14px;
  color: #96a4ab;
  font-size: 12px;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_author_ing
    .author-body-wrap
    .author-content-item
    .author-content-body-wrap
    .board-bottom-wrap {
    padding: 6px 0 6px 9px;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_author_ing
    .author-body-wrap
    .author-content-item
    .author-content-body-wrap
    .board-bottom-wrap {
    padding: 6px 0 6px 9px;
  }
}
@media only screen and (max-width: 468px) {
  #blog_author_ing
    .author-body-wrap
    .author-content-item
    .author-content-body-wrap
    .board-bottom-wrap {
    padding: 6px 0 6px 9px;
  }
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap
  .board-bottom-wrap
  span {
  cursor: pointer;
  vertical-align: top;
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap
  .board-bottom-wrap
  .icon {
  padding-right: 1px;
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap
  .board-bottom-wrap
  .heart {
  font-size: 14px;
  position: relative;
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap
  .board-bottom-wrap
  .position {
  position: relative;
  top: -2px;
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap
  .board-bottom-wrap
  .heart-wrap {
  margin-right: 5px;
}
#blog_author_ing
  .author-body-wrap
  .author-content-item
  .author-content-body-wrap
  .board-bottom-wrap
  span:hover {
  color: #829097;
}
.main-center-frame:after {
  content: "";
  border-right: 1px solid #dee5e7;
  font-size: 1px;
  position: absolute;
  top: 0;
  bottom: 0;
  overflow: hidden;
}
@media only screen and (max-width: 468px) {
  .main-center-frame:after {
    left: 100%;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  .main-center-frame:after {
    left: 100%;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  .main-center-frame:after {
    left: 100%;
  }
}
@media only screen and (min-width: 900px) and (max-width: 1074px) {
  .main-center-frame:after {
    left: 700px;
  }
}
@media only screen and (min-width: 1075px) and (max-width: 1249px) {
  .main-center-frame:after {
    left: 580px;
  }
}
@media only screen and (min-width: 1250px) and (max-width: 1420px) {
  .main-center-frame:after {
    left: 720px;
  }
}
@media only screen and (min-width: 1421px) {
  .main-center-frame:after {
    left: 920px;
  }
}
.main-center-frame {
  display: inline-block;
  vertical-align: top;
  font-size: 0;
  width: 880px;
  height: auto;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 468px) {
  .main-center-frame {
    width: 100%;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  .main-center-frame {
    width: 100%;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  .main-center-frame {
    width: 100%;
  }
}
@media only screen and (min-width: 900px) and (max-width: 1074px) {
  .main-center-frame {
    width: 660px;
  }
}
@media only screen and (min-width: 1075px) and (max-width: 1249px) {
  .main-center-frame {
    width: 580px;
  }
}
@media only screen and (min-width: 1250px) and (max-width: 1420px) {
  .main-center-frame {
    width: 720px;
  }
}
@media only screen and (min-width: 1421px) {
  .main-center-frame {
    width: 920px;
  }
}
.main-center-frame .page-head-article {
  background-color: #fff;
  font-size: 20px;
  font-weight: 600;
  display: inline-block;
  width: 100%;
  border-bottom: 1px solid #e2e8ea;
  padding: 25px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #2d2d2d;
}
.main-center-frame .post-body-title {
  color: #58666e;
  padding: 8px 15px 6px;
  margin: 10px 19px;
  background-color: #fff;
  font-size: 14px;
  border: 1px solid #dee5e7;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 5px;
}
.main-center-frame .post-body-title span {
  cursor: pointer;
}
.main-center-frame .post-body-title .right-area {
  float: right;
}
.main-center-frame .post-body-title .right-area .weibo {
  margin-left: 8px;
  margin-right: 4px;
}
.main-center-frame .post-body-title .sep {
  font-size: 13px;
  color: #ccc;
  margin-left: 2px;
  margin-right: 2px;
}
.main-center-frame .post-body-title span {
  vertical-align: top;
}
.main-center-frame .post-body-title .home {
  margin-right: 2px;
}
ul.pagination {
  display: inline-block;
  padding: 0;
  margin: 0;
}
ul.pagination li {
  display: inline;
}
ul.pagination li a {
  font-size: 12px;
  color: #383838;
  float: left;
  padding: 5px 11px;
  text-decoration: none;
  border-radius: 3px;
  cursor: pointer;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
ul.pagination li a.active {
  background-color: rgba(58, 63, 81, 0.99);
  color: #fff;
  border-radius: 3px;
}
ul.pagination li a:hover:not(.active) {
  background-color: #ddd;
}
li.seatClz a::-moz-selection {
  color: transparent !important;
  background-color: transparent !important;
}
li.seatClz a::selection {
  color: transparent !important;
  background-color: transparent !important;
}
li.seatClz a:hover {
  background-color: transparent !important;
}
li.seatClz a {
  cursor: default !important;
  color: transparent !important;
}
#app pre:before {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  margin-bottom: 1.625em;
  background-color: #f56565;
  border-radius: 9999px;
  -webkit-box-shadow: 20px 0 0 0 #fbd38d, 40px 0 0 0 #48bb78;
  box-shadow: 20px 0 0 0 #fbd38d, 40px 0 0 0 #48bb78;
  position: absolute;
  top: 14px;
  left: 15px;
}
#app pre:hover .copyBtn {
  color: #141414;
  display: inline-block;
}
#app pre {
  position: relative;
  font-family: SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono,
    Courier New, monospace;
  font-size: 90%;
  color: #4e5c64;
  overflow-x: auto;
  background-color: #282b2e;
  border-radius: 5px;
  padding: 32px 12px 12px;
  margin: 10px 0;
}
#app pre,
#app pre .copyBtn {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#app pre .copyBtn {
  display: none;
  position: absolute;
  right: 8px;
  top: 8px;
  cursor: pointer;
  background-color: #a0a0a0;
  border-radius: 8px;
  line-height: 16px;
  padding: 2px 7px;
  -webkit-box-shadow: 1px 1px 2px rgba(40, 40, 40, 0.2);
  box-shadow: 1px 1px 2px rgba(40, 40, 40, 0.2);
}
#app pre::-webkit-scrollbar-thumb:hover {
  background-color: #282b2e;
}
#app pre code::-webkit-scrollbar {
  width: 4px;
  height: 5px;
}
#app pre:hover code::-webkit-scrollbar-thumb {
  background-color: #646464;
}
#app pre code::-webkit-scrollbar-thumb,
#app pre code::-webkit-scrollbar-track {
  border-radius: 5px;
}
.postBody {
  font-family: Helvetica, Hiragino Sans GB, Microsoft Yahei,
    "\5FAE\8F6F\96C5\9ED1", Arial, sans-serif;
}
.postBody video {
  width: 100%;
}
.postBody blockquote {
  padding: 13px 45px;
  border-left: 3px solid #dde6e9;
  background-color: #f3f5f7;
  margin: 1.5em 0;
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  .postBody blockquote {
    padding: 13px 20px;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  .postBody blockquote {
    padding: 13px 20px;
  }
}
@media only screen and (max-width: 468px) {
  .postBody blockquote {
    padding: 13px 20px;
  }
}
.postBody a {
  color: #58666e;
  border-bottom: 1px solid #999;
  word-wrap: break-word;
  word-break: break-all;
  text-decoration: none;
}
.postBody p code {
  font-size: 90%;
  color: #c7254e;
  background-color: #f9f2f4;
  border-radius: 2px;
  margin: 2px;
  padding: 2px 4px;
  font-family: consolas;
}
.postBody ol,
.postBody p,
.postBody ul {
  color: #536269;
  line-height: 25px;
  margin-bottom: 7px;
}
.postBody table {
  width: 100%;
  border: 0;
  border-collapse: collapse;
  border-spacing: 0;
  text-align: left;
  margin: 0 0 4px;
}
.postBody table th {
  background-color: hsla(0, 0%, 47.1%, 0.3);
}
.postBody table td,
.postBody table th {
  border: 1px solid hsla(0, 0%, 78.4%, 0.8);
  padding: 2px 6px;
  cursor: pointer;
  min-width: 60px;
}
.postBody table tr {
  word-break: break-all;
}
.postBody table tr:hover {
  background-color: hsla(0, 0%, 70.6%, 0.2);
}
.postBody img {
  max-width: 100%;
  border-radius: 5px;
  border: 1px solid #ccc;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}
.postBody ol li {
  list-style-type: decimal;
  margin-left: 32px;
}
.postBody ul li {
  list-style-type: disc;
  margin-left: 32px;
}
.postBody :not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) + h1 {
  margin-top: 37px;
}
.postBody :not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) + h2 {
  margin-top: 34px;
}
.postBody :not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) + h3 {
  margin-top: 31px;
}
.postBody :not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) + h4 {
  margin-top: 28px;
}
.postBody :not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) + h5 {
  margin-top: 25px;
}
.postBody :not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) + h6 {
  margin-top: 22px;
}
.postBody h1,
.postBody h2,
.postBody h3,
.postBody h4,
.postBody h5,
.postBody h6 {
  margin-bottom: 5px;
  color: rgba(50, 50, 50, 0.9);
}
.postBody h1 {
  font-size: 21px;
}
.postBody h2 {
  font-size: 19px;
}
.postBody h3 {
  font-size: 16px;
}
.postBody h4 {
  font-size: 14px;
}
.postBody h5 {
  font-size: 12px;
}
.postBody h6 {
  font-size: 11px;
}
.toc-brand {
  margin-bottom: 5px;
  color: #646464;
  padding: 0 16px;
}
.toc-brand .topBtnDown {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
.toc-brand .topBtn {
  display: inline-block;
  margin-left: 7px;
  padding: 0 3px;
  -webkit-transition: all 0.2s ease-in-out 0s;
  transition: all 0.2s ease-in-out 0s;
  cursor: pointer;
}
.toc-link.active,
.toc-link:hover {
  color: #505050;
  background-color: hsla(0, 0%, 92.2%, 0.9);
}
.toc-hightlight,
.toc-link:before {
  display: none;
}
.toc-link {
  padding: 5px 20px;
}
.toc-nav {
  overflow-y: scroll;
}
.toc-nav a {
  margin-right: 11px;
}
.toc-nav::-webkit-scrollbar {
  display: none;
}
#blog_author_aside {
  display: inline-block;
  vertical-align: top;
  position: absolute;
  bottom: 0;
  top: 0;
  border-left: 1px solid #dee5e7;
  -webkit-box-sizing: border-box;
  -webkit-transform: translateX(-1px);
  transform: translateX(-1px);
  width: 255px;
  overflow-x: hidden;
  padding: 15px 18px;
  font-size: 0;
  box-sizing: border-box;
}
@media only screen and (max-width: 468px) {
  #blog_author_aside {
    left: 100%;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_author_aside {
    left: 100%;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_author_aside {
    left: 100%;
  }
}
@media only screen and (min-width: 900px) and (max-width: 1074px) {
  #blog_author_aside {
    left: 100%;
  }
}
@media only screen and (min-width: 1075px) and (max-width: 1249px) {
  #blog_author_aside {
    left: 577px;
  }
}
@media only screen and (min-width: 1250px) and (max-width: 1420px) {
  #blog_author_aside {
    left: 716px;
  }
}
@media only screen and (min-width: 1421px) {
  #blog_author_aside {
    left: 915px;
  }
}
@media only screen and (min-width: 900px) and (max-width: 1074px) {
  #blog_author_aside {
    display: none;
  }
}
@media only screen and (min-width: 550px) and (max-width: 899px) {
  #blog_author_aside {
    display: none;
  }
}
@media only screen and (min-width: 469px) and (max-width: 549px) {
  #blog_author_aside {
    display: none;
  }
}
@media only screen and (max-width: 468px) {
  #blog_author_aside {
    display: none;
  }
}
#blog_author_aside .blog-author-aside-wrap .contact-title {
  font-size: 16px;
  color: #58666e;
}
#blog_author_aside .blog-author-aside-wrap .contact-item {
  color: #58666e;
  cursor: pointer;
  margin-top: 18px;
}
#blog_author_aside .blog-author-aside-wrap .contact-item .contact-content {
  display: inline-block;
  margin-left: 10px;
  position: relative;
  bottom: 4px;
}
#blog_author_aside
  .blog-author-aside-wrap
  .contact-item
  .contact-content
  .contact-content-top {
  font-size: 12px;
  color: #7a7e7b;
  margin-bottom: 3px;
}
#blog_author_aside
  .blog-author-aside-wrap
  .contact-item
  .contact-content
  .contact-content-bottom {
  font-size: 10px;
  color: #98a6ad;
}
#blog_author_aside .blog-author-aside-wrap .contact-item .contact-png {
  display: inline-block;
  border: 2px solid #fff;
  -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3);
  border-radius: 31px;
  width: 31px;
  height: 31px;
  padding: 3px;
  overflow: hidden;
}
#blog_author_aside .blog-author-aside-wrap .contact-item .contact-png img {
  width: 31px;
  height: 31px;
}
#blog_author_aside .blog-author-aside-wrap .about-me-wrap {
  margin-top: 32px;
  margin-left: -10px;
  margin-right: -10px;
  background-color: #fdfdfd;
}
#blog_author_aside .blog-author-aside-wrap .about-me-wrap .about-me-head {
  font-size: 13px;
  cursor: pointer;
  padding: 10px;
  border: 1px solid #d3d9db;
  border-bottom-color: #e2e8ea;
  border-radius: 6px 6px 0 0;
}
#blog_author_aside .blog-author-aside-wrap .about-me-wrap .about-me-body {
  border-left: 1px solid #d3d9db;
  border-right: 1px solid #d3d9db;
  border-bottom: 1px solid #d3d9db;
  border-radius: 0 0 6px 6px;
  padding: 10px 20px 20px;
  font-size: 15px;
}
#blog_author_aside .blog-author-aside-wrap .about-me-wrap .about-me-body img {
  width: 100%;
}
@font-face {
  font-family: iconfont;
  src: url(https://cjunn.gitee.io/blog_theme_atum/20200727215620/fonts/iconfont.3884023.eot);
  src: url(https://cjunn.gitee.io/blog_theme_atum/20200727215620/fonts/iconfont.3884023.eot#iefix)
      format("embedded-opentype"),
    url("data:application/x-font-woff2;charset=utf-8;base64,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")
      format("woff2"),
    url(https://cjunn.gitee.io/blog_theme_atum/20200727215620/fonts/iconfont.37545d0.woff)
      format("woff"),
    url(https://cjunn.gitee.io/blog_theme_atum/20200727215620/fonts/iconfont.7e1d415.ttf)
      format("truetype"),
    url(https://cjunn.gitee.io/blog_theme_atum/20200727215620/img/iconfont.046e27f.svg#iconfont)
      format("svg");
}
.iconfont {
  font-family: iconfont !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.bug:before {
  content: "\E655";
}
.fangda:before {
  content: "\E611";
}
.top:before {
  content: "\E665";
}
.refresh:before {
  content: "\E6A3";
}
.groupctrl:before {
  content: "\E6DF";
}
.code:before {
  content: "\E6F2";
}
.copy:before {
  content: "\E6F3";
}
.editor:before {
  content: "\E74D";
}
.image-text:before {
  content: "\E753";
}
.link:before {
  content: "\E756";
}
.pin:before {
  content: "\E75D";
}
.bold:before {
  content: "\E7CC";
}
.LogonClosed:before {
  content: "\E723";
}
.eye:before {
  content: "\E9E1";
}
.label:before {
  content: "\E709";
}
.pen:before {
  content: "\E60F";
}
.face2:before {
  content: "\E60E";
}
.weibo:before {
  content: "\E60D";
}
.details_admire_icon:before {
  content: "\E613";
}
.zan:before {
  content: "\E622";
}
.star:before {
  content: "\E61D";
}
.see:before {
  content: "\E7C6";
}
.ios-shijian:before {
  content: "\E609";
}
.renyuanguanli:before {
  content: "\E60A";
}
.talk:before {
  content: "\E60B";
}
.shezhi:before {
  content: "\E70F";
}
.play1:before {
  content: "\E69F";
}
.timeout:before {
  content: "\E6A2";
}
.heart:before {
  content: "\E647";
}
.Icon-Fixedposition-:before {
  content: "\E61B";
}
.wechat:before {
  content: "\E603";
}
.qq2:before {
  content: "\E608";
}
.git:before {
  content: "\E64A";
}
.bottom:before {
  content: "\E601";
}
.arrow-d:before {
  content: "\E602";
}
.comment1:before {
  content: "\E687";
}
.comment:before {
  content: "\E607";
}
.angeldown1:before {
  content: "\E606";
}
.angle-double-right:before {
  content: "\E61C";
}
.angle-double-left:before {
  content: "\E65E";
}
.volume-x:before {
  content: "\E6D7";
}
.volume-:before {
  content: "\E6D8";
}
.menu:before {
  content: "\E669";
}
.links:before {
  content: "\E605";
}
.equalizer:before {
  content: "\E69D";
}
.transfer:before {
  content: "\E7B9";
}
.file:before {
  content: "\E738";
}
.fire:before {
  content: "\E604";
}
.cogs:before {
  content: "\E69E";
}
.rss:before {
  content: "\E89E";
}
.rss-square:before {
  content: "\E74C";
}
.tupian:before {
  content: "\E64F";
}
.ic_addmusic:before {
  content: "\E680";
}
.paper:before {
  content: "\E765";
}
.headphones1:before {
  content: "\E8D9";
}
.gift:before {
  content: "\E700";
}
.home:before {
  content: "\E61A";
}
.bell:before {
  content: "\E69C";
}
.-search:before {
  content: "\E600";
}
.headphones:before {
  content: "\E6DD";
}
::-moz-selection {
  background-color: #3a3f51;
  color: #fff;
}
::selection {
  background-color: #3a3f51;
  color: #fff;
}
body {
  font-family: Microsoft YaHei, 微软雅黑, MicrosoftJhengHei, 华文细黑, STHeiti,
    MingLiu !important;
  color: #323232;
  cursor: default;
}
pre code {
  cursor: text;
}
blockquote,
body,
button,
dd,
dl,
dt,
fieldset,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
input,
lengend,
li,
ol,
p,
pre,
td,
textarea,
th,
ul {
  margin: 0;
  padding: 0;
}
input {
  border: none;
  outline: none;
  -webkit-appearance: none;
}
.none-base-scroll {
  overflow-scrolling: touch;
}
.none-base-scroll::-webkit-scrollbar {
  display: none;
}
.small-base-scroll {
  overflow-scrolling: touch;
}
.small-base-scroll::-webkit-scrollbar {
  width: 4px;
  height: 4px;
  background-color: #f5f5f5;
}
.small-base-scroll::-webkit-scrollbar-track {
  border-radius: 5px;
  background-color: #f5f5f5;
}
.small-base-scroll::-webkit-scrollbar-thumb:hover {
  background-color: silver;
}
.small-base-scroll::-webkit-scrollbar-thumb {
  border-radius: 5px;
  background-color: #c8c8c8;
}
.middle-base-scroll {
  overflow-scrolling: touch;
}
.middle-base-scroll::-webkit-scrollbar {
  width: 7px;
  height: 7px;
  background-color: #f5f5f5;
}
.middle-base-scroll::-webkit-scrollbar-track {
  border-radius: 10px;
  background-color: #f5f5f5;
}
.middle-base-scroll::-webkit-scrollbar-thumb:hover {
  background-color: silver;
}
.middle-base-scroll::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: #c8c8c8;
}
.three-ellipsis {
  -webkit-line-clamp: 3;
}
.double-ellipsis,
.three-ellipsis {
  word-break: break-all;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.double-ellipsis {
  -webkit-line-clamp: 2;
}
.sing-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}
.hljs {
  color: #a9b7c6;
  background: #282b2e;
  display: block;
  overflow-x: auto;
  padding: 0.5em;
}
.hljs-bullet,
.hljs-literal,
.hljs-number,
.hljs-symbol {
  color: #6897bb;
}
.hljs-deletion,
.hljs-keyword,
.hljs-selector-tag {
  color: #cc7832;
}
.hljs-link,
.hljs-template-variable,
.hljs-variable {
  color: #629755;
}
.hljs-comment,
.hljs-quote {
  color: grey;
}
.hljs-meta {
  color: #bbb529;
}
.hljs-addition,
.hljs-attribute,
.hljs-string {
  color: #6a8759;
}
.hljs-section,
.hljs-title,
.hljs-type {
  color: #ffc66d;
}
.hljs-name,
.hljs-selector-class,
.hljs-selector-id {
  color: #e8bf6a;
}
.hljs-emphasis {
  font-style: italic;
}
.hljs-strong {
  font-weight: 700;
}