@import url('../icon/iconfont.css');

    .iconfont {
      font-family: "iconfont" !important;
      font-size: 16px;
      font-style: normal;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }

    .icon-shangyiyexiayiye:before {
      font-size: 22px;
      font-weight: 800;
      content: "\e600";
    }

    .icon-shangyiyexiayiye1:before {
      font-size: 22px;
      font-weight: 800;
      content: "\e601";
    }

    .icon-up:before {
      font-size: 22px;
      font-weight: 800;
      content: "\e7eb";
    }
     * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
      }
          .back-top{
      position: fixed;
      bottom: 20px;
      background-color: #7a7a7af5;;
      /* padding: 10px; */
      right: 20px;
      z-index: 9999999;
      cursor: pointer;
      font-size: 22px;
      font-weight: 800;
      text-align: center;
      height: 40px;
      width: 40px;
      line-height: 40px;
      transition: all 0.3s ease;
      opacity: 0;
    }
        .TopButtonShow{
      opacity: 1;
    }
      .containter {
        background-color: rgba(222, 222, 222, 0.5);
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 0 80px 0;
      }
      .menu_active{
        color: #000!important;
      }
      .row {
        display: flex;
        flex-wrap: wrap;
      }
      .header {
        background-color: #7a7a7af5;
        position: sticky;
        top: 0;
        z-index: 999;
        animation: all 8s ease;
      }
        .pc-header-stick {
      background-color: #7a7a7af5;
      position: sticky;
      top: 0;
      z-index: 999;
      display: none;
      /* transition: all 0.8s ease; */
      /* opacity: 0; */
      animation: fadeIn 2s;
      /* transform: translateY(-150px); */
      top: 0;
    }
    @keyframes fadeIn {
      0% {
        opacity: 0;
        transform: translateY(-150px);
        top: 0;
      }

      50% {
        opacity: 1;
        transform: translateY(0);
        top: 0;
      }

      100% {
        opacity: 1;
        top: 0;
        position: sticky;
      }
    }
      .menuitem {
        color: #fff;
        font-size: 14px;
        padding: 18px 17px;
        font-weight: 700;
        font-family: sans-serif;
      }
      /* 1. 去除下划线 */
      a {
        text-transform: uppercase;
        text-decoration: none;
      }

      /* 2. 统一链接颜色（覆盖所有状态） */
      a:link,
      a:visited,
      a:hover,
      a:active {
        color: inherit; /* 继承父元素颜色 */
        /* 或指定固定颜色，如 color: #333; */
      }

      /* 3. 移除聚焦轮廓（可选，根据无障碍需求调整） */
      a:focus {
        outline: none;
        /* 建议添加替代聚焦样式，如：box-shadow: 0 0 0 2px blue; */
      }

      /* 4. 移除鼠标手型指针（如需要） */
      a {
        cursor: pointer; /* 保留手型（推荐）或改为 cursor: default; */
      }
      .top-bar {
        margin-top: 20px;
        width: 100%;
        height: 452px;
        /* background-color: yellow; */
        display: flex;
        justify-content: space-between;
      }
      .Category-title {
        background-color: #1c2127;
        height: 150px;
        color: #fff;
        font-size: 22px;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
      }
      .cateClass {
        font-size: 28px;
        margin-bottom: 16px;
      }
      .desc {
        font-size: 16px;
      }
      .post-list {
        margin-top: 20px;
        display: flex;
        flex-wrap: wrap;
      }
      .latet-posts {
        cursor: pointer;
        /* width: 30%; */
        background-color: #fff;
        /* margin-right: 40px; */
        /* margin-bottom: 40px; */
        box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
      }
      .latet-pic {
        position: relative;
        width: 100%;
        display: inline-block;
        height: 300px;
        object-fit: cover;
      }
      .latet-title {
        font-size: 16px;
        font-weight: 800;
        margin-bottom: 10px;
          display: -webkit-box!important;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 2;
          overflow: hidden;
          text-overflow: ellipsis;
          line-height: 1.5em;
          min-height: 3em;
      }
      .latet-des {
        font-size: 14px;
        /*margin-bottom: 30px;*/
      }
      .latest-time {
        font-size: 12px;
        color: #141313;
          position: absolute;
          bottom: 10px;

          /*margin-bottom: 30px;*/
      }
      .post-des {
          position: relative;
        padding: 10px;
          min-height: 143px;
      }


      .post-list {
        margin-top: 20px;
        display: flex;
        /* justify-content: space-between; */

        flex-wrap: wrap;
      }

      .navigation-bar {
        /* margin-top: 20px; */
        width: 80%;
        height: 50px;
        background: #fff;
        display: flex;
        justify-content: center;
        margin: 40px auto 0;
        display: flex;
        line-height: 50px;
        position: relative;
        box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
      }
          .navigation-page:hover {
      background-color: rgba(0, 0, 0, 0.1);
    }
          .navigation-page-prev {
      color: #000000;
      flex: 0;
      position: absolute;
      left: 0px;
      cursor: pointer;
              padding-right: 20px;
         padding-left: 20px;
              font-size: 14px;
    }

    .navigation-page-prev:hover {
      background-color: rgba(0, 0, 0, 0.1);
    }

    .navigation-page-next:hover {
      background-color: rgba(0, 0, 0, 0.1);
    }

          .active {
        background: gray;
        color: #000000;
      }
      .navigation-page-list {
        display: flex;
        box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
      }
.navigation-page-elips{
     color: #a59e9f;
        margin-right: 4px;
}
     .navigation-page {
         color: #a59e9f;
         /* width: 40px; */
         /* height: 30px; */
         /*padding: 0 15px;*/
         width: 40px;
         cursor: pointer;
         margin-right: 4px;
         text-align: center;
         line-height: 50px;
     }
     .navigation-page a{
         width: 100%!important;
         height: 100%!important;
         display: inline-block;
     }
      .navigation-page-list {
        display: flex;
        box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
      }
      .navigation-page-next {
        color: #000000;
        flex: 0;
        position: absolute;
        right: 0px;
        cursor: pointer;
                      padding-right: 20px;
         padding-left: 20px;
          font-size: 14px;
      }
      .cover-describe {
        font-size: 24px;
        font-weight: 800;
        color: #fff;
        margin-bottom: 12px;
        /* background: #000000; */
      }
      .last-post-box {
      width: 33%;
      padding: 20px;
    }
        .left-item {
            color: #000 !important;
            width: 70%;
            position: fixed;
            left: 0;
            background-color: #fff;
            z-index: 99999;
            overflow-y: scroll;
            height: 100vh;
            visibility: hidden;
            transform: translateY(-100%);
            transition: all 0.5s ease;
            opacity: 0;
            top: 0;
        }
      @media only screen and (max-width: 900px) {
        .last-post-box {
          width: 50%;
          padding: 20px;
        }
      }
        @media only screen and (max-width: 768px) {

            /* 移动端 */
            .h5-header {
                background-color: #000;
                height: 150px;
                position: sticky;
                width: 100vw;
                display: none;
                top: 0;
                    z-index: 999;
            }
          .header-image{

                width: 60%;
                object-fit: cover;
                height: 140px;
                position: absolute;
                top: 50%;
                left: 5%;
                transform: translateY(-50%);
            }
            .h5-header-stick {
                position: sticky;
                z-index: 9999;
                animation: fadeIn 2s;
            }

            @keyframes fadeIn {
                0% {
                    opacity: 0;
                    transform: translateY(-150px);
                }

                50% {
                    opacity: 1;
                    transform: translateY(0);
                }

                100% {
                    opacity: 1;
                    position: sticky;
                }
            }

            .block-line {
                width: 100%;
                height: 2px;
                background-color: #fff;
            }

            .block {
                width: 50px;
                height: 50px;
                background-color: gray;
                display: flex;
                flex-direction: column;
                align-content: space-around;
                justify-content: space-around;
                padding: 16px;
                position: absolute;
                right: 10px;
                top: 50%;
                transform: translate(0, -50%);
            }

            .left-item-transform {
                opacity: 1;
                transform: translateY(0);
                bottom: 0;
            }

            .h5-menuitem {
                color: #000;
                font-size: 14px;
                padding: 18px 17px;
                font-weight: 700;
                font-family: sans-serif;
            }

            .close {
                width: 40px;
                height: 40px;
                background: gray;
                color: #fff;
                font-size: 28px;
                font-weight: 800;
                text-align: center;
                /* line-height: 40px; */
                position: absolute;
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
                border-radius: 5px;
            }

            .closer {
                height: 80px;
                position: relative;
                /* margin-bottom: 50px; */
            }

            .top-bar {
                display: inline-block;
            }

            .entry-title {
                font-size: 20px;
            }
                  /* 禁止整个页面滚动 */
      body.no-scroll {
        overflow: hidden;
        /* 移动端额外处理 */
        /* height: 100vh;
        position: fixed;
        width: 100%; */
      }

      /* 针对移动端防止橡胶带效果 */
      body.no-scroll {
        overscroll-behavior: none;
      }
          .last-post-box {
   width: 100%;
      padding: 20px;
    }
          .latet-posts {
     
        margin-right: unset;
      }
        }
        .mx-8{
          margin: 0 8px;
        }



     /* 手机端（屏幕宽度小于768px）隐藏指定内容 */
     @media (max-width: 768px) {
         .mobile-hide {
             display: none !important;
         }
     }