@charset "UTF-8";
/*flex兼容写法*/
/*主轴居中对齐*/
/* 主轴两端对齐 */
/* 主轴start对齐 */
/* 主轴end对齐 */
/*交叉轴居中对齐*/
/* 交叉轴start对齐 */
/* 交叉轴底部对齐 */
/* 交叉轴文本基线对齐 */
/* 交叉轴上下对齐并铺满 */
/* 主轴从上到下 */
/* 主轴从下到上 */
/* 主轴从左到右 */
/* 主轴从右到左 */
/* 是否允许子元素伸缩 */
/* 子元素的显示次序 */
.swiper-slide {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center; }

.banner-slide {
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% 100%; }
  .banner-slide .banner {
    width: 50%;
    height: 60%;
    overflow: hidden;
    border: 0.3rem solid #fff;
    background-color: transparent;
    padding: .3rem; }
    .banner-slide .banner .banner-content {
      width: 100%;
      height: 100%;
      background-color: #fff;
      padding: 1rem 2rem; }
      .banner-slide .banner .banner-content .avatar {
        width: auto;
        height: 33.33333333333%; }
      .banner-slide .banner .banner-content .content {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        height: 55%;
        font-size: 1.5rem; }
      .banner-slide .banner .banner-content .author {
        text-align: right;
        font-weight: bold; }

.content-container {
  margin: 1.5rem auto 3rem; }
  .content-container .article-list {
    padding-left: 0; }
    .content-container .article-list .article-order {
      margin-bottom: 1rem; }
      .content-container .article-list .article-order a {
        margin-right: 1rem; }
        .content-container .article-list .article-order a.active {
          color: #343a40; }
  .content-container .side-panel {
    padding-left: 2rem; }
  .content-container .article {
    padding: 1.5rem 0 1rem;
    border-top: 1px solid #dee2e6; }
    .content-container .article .img > img {
      width: 100%;
      height: auto; }
    .content-container .article .info {
      padding: 0 1rem 2rem;
      position: relative; }
      .content-container .article .info .title {
        display: block;
        font-size: 1.375rem;
        font-weight: bold;
        color: #343a40;
        word-break: break-all; }
      .content-container .article .info .excerpt {
        margin-top: .5rem;
        text-indent: 2em;
        word-break: break-all; }
      .content-container .article .info .other {
        position: absolute;
        left: 0;
        right: 15px;
        bottom: 0;
        text-align: right;
        font-size: .875rem;
        color: #6c757d; }
        .content-container .article .info .other span {
          margin-right: .5rem; }
          .content-container .article .info .other span .pofont {
            margin-right: .25rem; }
        .content-container .article .info .other a {
          color: #6c757d; }
        .content-container .article .info .other .category {
          font-weight: bold; }
  .content-container .page-btn {
    border-top: 1px solid #dee2e6;
    padding: 1.5rem 15px 0;
    text-align: center; }
  .content-container .about-me, .content-container .tag-list {
    position: relative;
    border: 1px solid #dee2e6;
    padding: 2rem 1.5rem; }
    .content-container .about-me .title, .content-container .tag-list .title {
      position: absolute;
      font-size: 1.375rem;
      font-weight: bold;
      color: #343a40;
      padding: .5rem 1.5rem;
      top: 0;
      left: 50%;
      transform: translate(-50%, -55%);
      background-color: #fff; }
  .content-container .about-me {
    margin-top: 2.5rem; }
    .content-container .about-me .avatar {
      width: 100%; }
    .content-container .about-me .motto {
      font-size: 1.125rem;
      font-weight: bold;
      color: #343a40;
      padding: 1rem;
      text-align: center; }
    .content-container .about-me .introduce {
      text-indent: 2em; }
  .content-container .tag-list {
    margin-top: 3.5rem; }
    .content-container .tag-list .tag {
      background-color: #dee2e6;
      color: #6c757d;
      padding: .25rem .5rem;
      display: inline-block;
      margin-right: .5rem;
      margin-bottom: .75rem; }
      .content-container .tag-list .tag:hover, .content-container .tag-list .tag:focus {
        background-color: #28a745;
        color: #fff; }

@media (min-width: 992px) and (max-width: 1199.98px) {
  .content-container .about-me .title, .content-container .tag-list .title {
    font-size: 1.25rem;
    padding: .25rem 1.25rem; }
  .content-container .article .info .title {
    font-size: 1.25rem; } }
@media (min-width: 768px) and (max-width: 991.98px) {
  .banner-slide .banner {
    width: 60%; }
    .banner-slide .banner .banner-content {
      padding: 1rem 1.5rem; }

  .content-container .article-list {
    padding-left: 15px; }
  .content-container .article .info .title {
    font-size: 1.125rem; } }
@media (min-width: 576px) and (max-width: 767.98px) {
  .banner-slide .banner {
    width: 60%; }
    .banner-slide .banner .banner-content {
      padding: 1rem 1.5rem; }
      .banner-slide .banner .banner-content .content {
        height: 85%; }

  .content-container {
    margin: 1.5rem auto 2rem; }
    .content-container .article-list {
      padding-left: 15px; }
    .content-container .article {
      padding: 1rem 0; }
      .content-container .article .info {
        padding: 1rem 1rem 2rem; }
        .content-container .article .info .title {
          font-size: 1.125rem; } }
@media (max-width: 575.98px) {
  .banner-slide .banner {
    width: 70%;
    height: 70%;
    border-width: .1875rem;
    padding: .1875rem; }
    .banner-slide .banner .banner-content {
      padding: .5rem 1rem; }
      .banner-slide .banner .banner-content .content {
        height: 75%;
        font-size: 1.125rem; }
      .banner-slide .banner .banner-content .author {
        font-size: .875rem; }

  .content-container {
    margin: 1rem auto 2rem; }
    .content-container .article-list {
      padding-left: 15px; }
      .content-container .article-list .article-order {
        margin-bottom: .75rem; }
    .content-container .article {
      padding: 1rem 0; }
      .content-container .article .info {
        padding: 1rem 1rem 2rem; }
        .content-container .article .info .title {
          font-size: 1.125rem; } }

/*# sourceMappingURL=index.css.map */