.char-container {
  display: flex;
  justify-content: space-around;
}
 .character a{
 color: #fb5006;
 font-size: 10px;
}
.character {
    border: 1px solid #000;
    margin: 1px;
    padding: 2px;
    background-color: #009000;
  /* 可以添加其他样式，如字体大小、颜色等 */
}
        .text-line {
            display: none; /* 一开始隐藏所有行 */
            color: red;
            line-height: 35px;
        }
       .text-line a{

            color: red;
            line-height: 35px;
        }
        #lunbo {
            min-height: 50px; /* 确保div有最小高度 */
            background-color: #ffffff;
        }
        #lunbo p{
            font-size: 16px;
            text-align: center; 
        }
        .idde {
            color: red;
            line-height: 40px;
        }

    .nav-container {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        padding: 0px;
        width: 100%; /* 宽度自适应 */

        margin: 0 auto; /* 居中 */
        margin-top: 5px;
    }

    .nav-container a {
        color: #f6f6f1;
        text-decoration: none; /* 去掉链接下划线 */
        font-weight: bold;
    }

    .nav-item {
        flex: 1 1 calc(10% - 20px); /* 电脑端每行10个，增加间距 */
        margin: 1px; /* 增加间距 */
        text-align: center;
        background-color: #07a7e1; /* 默认颜色 */
        padding: 15px; /* 调整内边距 */
        box-sizing: border-box;
        font-size: 14px; /* 默认字体稍大 */
        min-width: 100px; /* 增加最小宽度，避免文字重叠 */
        word-wrap: break-word; /* 允许文字换行 */
        white-space: normal; /* 允许文字换行 */
        border-radius: 0px; /* 圆角效果 */
        transition: background-color 0.3s ease; /* 背景色过渡效果 */
                    line-height: 0%;
    }

    .nav-item:hover {
        background-color: #0590c7; /* 鼠标悬停效果 */
    }

    /* 从第9个栏目开始改变颜色 */
    .nav-item.alt-color {
        background-color: #d30404; /* 另一种颜色 */
    }

    .nav-item.alt-color:hover {
        background-color: #e65a50; /* 鼠标悬停效果 */
    }

    /* 平板端样式 */
    @media (max-width: 1024px) {
        .nav-item {
            flex: 1 1 calc(20% - 10px); /* 每行5个 */
            font-size: 14px; /* 字体稍小 */
            min-width: 90px; /* 调整最小宽度 */
            line-height: 0%;
        }
    }

    /* 手机端样式 */
    @media (max-width: 768px) {
        .nav-container {
            padding: 0px;
            width:100%; /* 宽度占满屏幕 */
        }
        .nav-item {
            flex: 1 1 calc(22% - 10px); /* 每行4个 */
            font-size: 12px; /* 字体稍小 */
            padding: 14px; /* 内边距稍小 */
            min-width: 80px; /* 调整最小宽度 */
                        line-height: 0%;
        }
    }

    /* 超小屏幕（如 iPhone SE） */
    @media (max-width: 480px) {
        .nav-item {
            flex: 1 1 calc(25% - 10px); /* 每行3个 */
            font-size: 11px; /* 字体更小 */
            padding: 14px; /* 内边距更小 */
            min-width: 70px; /* 调整最小宽度 */
            line-height: 0%;
        }
    }  
 /* 容器样式 */
.tag-container {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
     padding: 5px;
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 4px;
}

/* 标签样式 */
.tag {
    background-color: #e90909;
    border: 1px solid #ff1c00;
    border-radius: 1px;
    color: #00796b;
    font-size: 13px;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
}
.tag a {color: #dee9e7;}
/* 鼠标悬停时的样式 */
.tag:hover {
    background-color: #26c6da; /* 悬停时背景色 */
    color: #fff; /* 悬停时文字颜色 */
}     
  .vodlist-thumb {
    position: relative;
    display: block;
  }

  .vodlist-thumb::after {
    content: attr(data-time); /* 使用 data-time 属性作为时间内容 */
    position: absolute;
    bottom: 5px;
    right: 5px;
    background-color: rgba(0, 0, 0, 0.7);
    color: #fff;
    padding: 2px 5px;
    font-size: 12px;
    border-radius: 3px;
  }
  	@media (min-width: 768px) {
    .dplayer-container {
      height: 560px; 
    }
  }

  @media (max-width: 767px) {
    .dplayer-container {
      height: 280px; 
    }
  }