h5{
    font-size:14px; line-height: 20px;text-indent: 10px;
    flex-flow: row wrap;
    flex: 1;
    flex-wrap: wrap;
    border-width: 1px;
    border-style: solid;
    border-color: #2c2c36;
    text-align: center;
}
guanggooda {
        display: flex;
        flex-flow: row wrap;
        flex: 1;
       flex-wrap: wrap;
       border-width: 1px;
    border-style: solid;
    border-color: #2c2c36;
    margin: 0 0 4px;
     }
.wrap {
	margin:0 auto;
}
/*@media*/
@media screen and (min-width:1024px) {
	#nav-right,.pull-left,.pcyc {
	display:none;
}
.mb10 {
	margin-bottom:10px;
}
.mb20 {
	margin-bottom:3px;
}
.mt20 {
	margin-top:20px;
}
.wrap {
	width:1200px;
}
#header {
	background-color:rgba(15,15,15,.99);
	min-width:1200px;
	height:46px;
	clear:both;
}


.pcmenu {
	float:right;
	margin-right:3px;
}
.ui-nav-right .nav-item {
	height:46px;
	float:left;
	overflow:hidden;
	border-radius: 5px;
}
.ui-nav-right .nav-item:hover {
	background-color:#FF6A62;
}
.ui-nav-right .nav-item .nav-link {
	display:block;
	min-width:54px;
	height:46px;
	line-height:46px;
	overflow:hidden;
	padding:0 10px 0 10px;
	font-size:16px;
	text-align:center;
	color:#cccccc;
	z-index:9;
	float:left;
	position:relative;
	-webkit-text-stroke-width:0.2px;
}
.ui-nav-right .current {
	background-color:#f44336a3;
	border-radius: 5px;
}
.ui-nav-right .currenta {
	background-color:#bf8762;
	border-radius: 5px;
}
/*toolbar*/
.navbar {
	position:relative;
	height:45px;
	line-height:45px;
	margin-top:10px;
}

/*footer*/
#footer_e {
	width:100%;
	margin:0 auto;
	margin-top:15px;
	border-top:1px solid #191818;
	background:#282828;
	min-width:1200px;
	color:#717171;
     margin-bottom:24px;
}
#footer_w {
	height:54px;
	overflow:hidden;
	position:relative;
	padding:10px 0 10px 0;
	margin-top:5px;
}
#footer_w .footmenu {
	margin-bottom:5px;
	text-align:center;
}
#footer_w .footmenu a {
	font-size:15px;
	color:#CEBFBF;
	margin:0 5px;
}
#SOHUCS {padding: 0px 10px !important; width: calc(100% - 20px) !important;}
}
@media screen and (max-width:1023px) {
	.wrap {
	width:100%;
	max-width:768px;
	overflow:hidden;
}
.gongao,.mbyc {
	display:none !important;
}
.mb10 {
	margin-bottom:5px;
}
.mb20 {
	margin-bottom:10px;
}
.mt20 {
	margin-top:10px;
}


.pcmenu {
/* 	position:absolute; */
	float:left;
	top:46px;
	background:#1e1e28;
	width:100%;
	max-width:768px;
	clear:both;
	z-index:99;
}
.yccd {display:none;}
.pcmenu ul {
	border:1px solid #ff5722;
}
.pcmenu ul li {
	float:left;
	width:25%;
	padding:5px 0px;
	text-align:center;
}
.pcmenu ul li a {
	width:94%;
	margin:0 auto;
	display:block;
	padding:5px 0;
	border-radius:5px;
	background-color:#2e2e3a;
	color:#cccccc;
}
.search-box {
    display: none;
    position: absolute;
    top: 0;
    width: calc(100% - 44px);
    height: 46px;
    float: right;
    z-index: 98;
    background: #DC1414;
}

}
.search-box form {margin-top:5px;}
.search-input {
    width: calc(100% - 10px);
    float: left;
    height: 33px;
    line-height: 30px;
    font-size: 14px;
    overflow: hidden;
    color: #666;
    text-indent: 9px;
    border: 1px solid #F5F5F5;
    background-color: #F5F5F5;
    font-family: Microsoft Yahei;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}



 handede {  
    display: flex;
    flex-flow: row wrap;
    flex: 1;
    background: #2e2e3a;
    flex-wrap: wrap;
	margin: auto;
	width: 100%;  
}



/*副导航条*/
.title{
  padding:5px 3px 5px 5px;
  margin-top:-10px;
  margin-bottom:10px;
  list-style:none;
  background-color:#3a3939;
  font-size:13px;
  width:100%;
}
.title>li{display:inline-block}
.title>li+li:before{
  padding:0 2px;
  color:#ddd;content:"| "
}
.title .r a{
  padding:4px 5px;
  font-size:13px;
  /*border:1px solid #4c8fe8;*/
  text-align:center;
  margin-right:-1px;
}
/*.title .r .hover,.title .r a:hover{
    background-color:#4c8fe8;
    color:#fff;
    border:1px solid #4c8fe8;
}*/
/*ads*/
.g100 a img{width:50%; height:100px; margin-bottom: 5px; float: left;}
.adbox a img{width:50%; height:60px; margin-bottom: 5px; float: left;}
.adsx a img{width:50%; height:60px; text-align: center;}
.adswidth {width:100%; text-align: center;}
.aa1{
    height: 5px;
    background: radial-gradient(circle at 20% 30%,rgba(0,80,0,0.8) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(0,0,80,0.8) 0%,transparent 50%),linear-gradient(135deg,#228B22,#20B2AA,#87CEEB);
}
.aa2{
        height: 30px;
    background: radial-gradient(circle at 20% 30%,rgba(0,80,0,0.8) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(0,0,80,0.8) 0%,transparent 50%),linear-gradient(135deg,#228B22,#20B2AA,#87CEEB);
}
.dqwz{
    min-height: 34px;
    line-height: 34px;
    background-image: linear-gradient(rgb(34, 35, 38), rgb(0, 0, 0));
    margin-top: 0px;
    margin-bottom: 4px;
    clear: both;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(51, 51, 51);
    border-image: initial;
    text-indent: 10px;
}
.dqwzsy{
    min-height: 34px;
    line-height: 34px;
    background-image: linear-gradient(rgb(34, 35, 38), rgb(0, 0, 0));
    margin-top: 0px;
    margin-bottom: 1px;
    clear: both;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(51, 51, 51);
    border-image: initial;
    text-indent: 10px;
}
.image-jianjie img {
    display: inline-block; /* 或者使用 float: left; */
    vertical-align: middle; /* 使图片和文字垂直居中对齐 */
    margin-right: 10px; /*根据需要调整间距 */
    width: 100%;
}
 
.image-jianjie span {
            position: relative;
            width: 300px;
            height: 200px;
            background: #f8f9fa;
            border: 3px solid #3498db;
        }
        
.jian-pal{
        color: #ccc;
    width: 100%;
    float: left;
    line-height: 16px;
    margin: 1px 0px 10px 0px;
    border: 1px solid #333;
    padding: 10px 10px;
    box-sizing: border-box;
    position: relative;
    outline: none;
}
.jian-adstype{
        margin: 1px 0px 10px 0px;
    border: 1px solid #333;
    padding: 4px 4px;
    display: flex;
    justify-content: center;
}

.ads-type a img{width:100%; height:50px; text-align: center;}

/*文字列表*/
/* 模块标题样式 */
.dqwzsy {
  font-size: 15px;
  font-weight: bold;
  color: #e0e0e0;
  border-left: 5px solid #ff5a5a;
  padding-left: 12px;
  margin-bottom: 4px;
}

/* 网格容器：每行两列，共十行 */
.hot-grid-wrap {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 两列 */
  gap: 10px;
}

/* 每项视频块 */
.hot-grid-item {
  background-color: #252525;
  border: 1px solid #333;
  border-radius: 6px;
  padding: 8px;
  overflow: hidden;
}

/* 视频链接文字样式 */
.hot-grid-link {
  display: block;
  font-size: 14px;
  color: #bbbbbb;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none;
}
.hot-grid-link:hover {
  color: #ff5a5a;
  text-decoration: underline;
}

/* 移动端自适应：每项垂直排列 */
@media (max-width: 768px) {
  .hot-grid-wrap {
    grid-template-columns: 1fr;
  }
  .hot-grid-link {
    font-size: 16px;
    white-space: normal;
    word-break: break-word;
  }
}
/*视频列表*/
.video-grid-5x5 {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 五列 */
  gap: 16px;
}

/* 每项样式 */
.video-grid-item {
  background: #252525;
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid #333;
}

/* 缩略图区域（懒加载） */
.video-thumb {
  display: block;
  width: 100%;
  padding-top: 60%; /* 固定比例占位 */
  background-size: cover;
  background-position: center;
  position: relative;
}

/* 播放图标 & 文字覆盖 */
.play-icon {
  position: absolute;
  top: 6px;
  left: 6px;
  width: 20px;
  height: 20px;
  background: url('/static/img/play-icon.svg') no-repeat center;
  background-size: contain;
}
.pic-text {
  position: absolute;
  bottom: 6px;
  right: 6px;
  font-size: 12px;
  color: #fff;
  background: rgba(0,0,0,0.5);
  padding: 2px 6px;
  border-radius: 4px;
}

/* 视频标题样式 */
.video-title {
  font-size: 14px;
  margin: 6px 10px;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.video-title a {
  color: #bbb;
  text-decoration: none;
}
.video-title a:hover {
  color: #ff5a5a;
}

/* 移动端自适应 */
@media (max-width: 1024px) {
  .video-grid-5x5 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 768px) {
  .video-grid-5x5 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 480px) {
  .video-grid-5x5 {
    grid-template-columns: 1fr;
  }
}
/*导航条样子*/
.nav-header {
  background-color: #222;
  padding: 10px 15px;
  color: #eee;
}

.nav-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.site-title a {
  font-size: 20px;
  font-weight: bold;
  color: #fff;
  text-decoration: none;
}

.site-search {
  width: 400px;
  max-width: 100%;
}

.site-search form {
  display: flex;
  flex-wrap: nowrap;
}

.search-input {
  flex: 1;
  padding: 8px 10px;
  border: 1px solid #444;
  border-right: none;
  border-radius: 4px 0 0 4px;
  background: #2a2a2a;
  color: #fff;
  min-width: 0;
}

.search-btn {
  padding: 8px 14px;
  background-color: #ff5a5a;
  border: 1px solid #ff5a5a;
  color: #fff;
  border-radius: 0 4px 4px 0;
  cursor: pointer;
}

/* 导航菜单区 */
.nav-menu {
  margin-top: 12px;
}

.menu-list {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  list-style: none;
  padding-left: 0;
}
.menu-list li a {
  color: #ccc;
  padding: 6px 10px;
  border-radius: 4px;
  text-decoration: none;
  transition: all 0.3s ease;
}
.menu-list li a:hover {
  background-color: rgba(255, 255, 255, 0.1);
  color: #ff5a5a;
}

/* ✅ 移动端排布优化 */
@media (max-width: 768px) {
  .nav-top {
    flex-direction: column;
    align-items: stretch;
  }

  .site-title {
    text-align: center;
    margin-bottom: 10px;
  }

  .site-search {
    width: 100%;
    padding: 0 10px;
    margin-bottom: 10px;
  }

  .nav-menu {
    padding: 0 10px;
  }

  .menu-list {
    flex-direction: column;
    align-items: center;
  }

  .menu-list li {
    width: 100%;
    text-align: center;
  }
}
.menu-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.menu-list li a {
  padding: 6px 10px;
  font-size: 14px;
  color: #ccc;
  text-decoration: none;
  border-radius: 4px;
  background-color: transparent;
  transition: all 0.3s ease;
}
.menu-list li a:hover {
  background-color: rgba(255, 255, 255, 0.1);
  color: #ff5a5a;
}
@media (max-width: 768px) {
  .menu-list {
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 10px;
  }

  .menu-list li {
    flex: 0 1 auto;
  }

  .menu-list li a {
    font-size: 13px;
    white-space: nowrap; /* 避免文字换行 */
  }
}
@media (max-width: 768px) {
  .menu-list {
    overflow-x: auto;
    flex-wrap: nowrap;
    scroll-snap-type: x mandatory;
  }

  .menu-list li {
    scroll-snap-align: start;
  }
}
.nav-wrap {
  background: #222222;
  padding: 10px 12px;
  border-radius: 6px;
  max-width: 100%;
  overflow-x: hidden;
  box-sizing: border-box;
}

/* 网格布局，每行最多显示5项 */
.nav-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.announcement-table {
  width: 100%;
  margin: 20px auto;
  padding: 10px;
  box-sizing: border-box;
}

.table-notice {
  width: 100%;
  border-collapse: collapse;
  text-align: center;
  font-size: 14px;
  color: #333;
  background-color: #f9f9f9;
  border: 1px solid #ccc;
}

.table-notice td {
  padding: 12px;
  border: 1px solid #ddd;
  vertical-align: middle;
}

.table-notice a {
  color: #FF5722;
  text-decoration: none;
}

.table-notice a:hover {
  text-decoration: underline;
}
@media screen and (max-width: 768px) {
  .table-notice td {
    display: block;
    width: 100%;
    text-align: left;
  }

  .table-notice tr {
    display: block;
    margin-bottom: 10px;
  }
}
.notice-wrapper {
  margin: 0;
  padding: 0;
  background-color: #2f2f2f;
  color: #ddd;
}

.notice-table {
  width: 100%;
  border-collapse: collapse;
  margin: 0;
  padding: 0;
  border: none;
   border-radius: 8px;
}

.notice-table td {
  padding: 8px 8px;
  border: 1px solid #444;
  font-size: 13px;
  color: #383838;
  text-align: center;
  font-weight: 600;
  background-color: #222222;
}

.notice-table a {
  color: #00BCD4;
  text-decoration: none;
}

.notice-table a:hover {
  color: #FF5722;
  text-decoration: underline;
}

.notice-tip {
  background: #000;
  background-size: cover;
  padding: 12px;
  font-size: 14px;
  line-height: 1.7;
  text-align: center;
  color: #e5e5e5;
  margin: 1px;
  border-radius: 0;
  border-radius: 10px;
}

/*搜索页*/
        /* 样式继承首页分类页的布局 */
        .dqwz {
          font-size: 16px;
          padding: 10px 0;
          color: #00BCD4;
          font-weight: bold;
        }
        .video-grid-5x5 {
          display: grid;
          grid-template-columns: repeat(4, 1fr);
          grid-gap: 16px;
        }
        .video-grid-item {
          background-color: #1e1e1e;
          border: 1px solid #333;
          border-radius: 8px;
          overflow: hidden;
          transition: box-shadow 0.2s ease;
        }
        .video-grid-item:hover {
          box-shadow: 0 8px 20px rgba(0,0,0,0.4);
        }
        .video-thumb {
          display: block;
          position: relative;
          aspect-ratio: 16/9;
          overflow: hidden;
        }
        .video-thumb img {
          width: 100%;
          height: 100%;
          object-fit: cover;
          display: block;
        }
        .play-icon {
          position: absolute;
          left: 8px;
          bottom: 8px;
          width: 24px;
          height: 24px;
          background: url(/path-to-icon.png) no-repeat center;
          background-size: contain;
        }
        .pic-text {
          position: absolute;
          right: 8px;
          bottom: 6px;
          font-size: 12px;
          color: #ffcc99;
        }
        .video-title {
          margin: 10px 12px 4px;
          font-size: 14px;
          color: #fff;
          font-weight: bold;
        }
        .video-meta {
          margin: 0 12px 12px;
          font-size: 12px;
          color: #aaa;
        }
        .title a {
          background: #37474F;
          color: #fff;
          font-size: 13px;
          padding: 6px 12px;
          margin: 6px 6px 0 0;
          border-radius: 20px;
          text-decoration: none;
          display: inline-block;
        }
        .title a:hover {
          background: #00BCD4;
          color: #000;
        }
        @media screen and (max-width: 768px) {
          .video-grid-5x5 { grid-template-columns: repeat(2, 1fr); }
        }
@media screen and (max-width: 768px) {
  .video-grid-5x5 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .video-grid-5x5 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (min-width: 1025px) {
  .video-grid-5x5 {
    grid-template-columns: repeat(4, 1fr);
  }
}


/* 盒子：PC 横排，内容不挤压 */
.detail-box {
  display: flex;
  gap: 16px;
  background: #1e1e1e;
  border: 1px solid #333;
  border-radius: 10px;
  padding: 12px;
  align-items: flex-start;     /* 顶对齐 */
}

/* 海报：固定列宽，避免被压缩；图片自适应 */
.detail-poster {
  max-width: 450px;
}
.poster-img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  display: block;
}

/* 信息：可伸展，避免超宽溢出 */
.detail-info {
  flex: 1 1 0;
  min-width: 0;                /* 关键：允许内容收缩，避免被挤换行异常 */
  color: #ddd;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 0 8px 0 4px;
  text-align: left;
}

/* 标题：左对齐，最多两行省略 */
.vod-title {
  font-size: 22px;
  line-height: 1.35;
  color: #00BCD4;
  margin: 4px 0 8px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 元信息 */
.vod-meta {
  list-style: none;
  padding: 0;
  margin: 0 0 12px;
}
.vod-meta li {
  margin-bottom: 8px;
  font-size: 14px;
  color: #ccc;
  text-align: left;
}

/* 播放按钮：PC 固定宽度，移动端撑满 */
.play-btn {
  display: inline-block;
  width: 160px;                /* PC 固定宽度，避免随内容变化 */
  padding: 10px 16px;
  background-color: #ff5722;
  color: #fff;
  font-size: 16px;
  border-radius: 6px;
  text-decoration: none;
  text-align: center;
  transition: transform .15s ease, background-color .2s ease;
  margin-top: 6px;
}
.play-btn:hover { background-color: #e64a19; transform: translateY(-1px); }
.play-btn:focus { outline: 2px solid #00BCD4; outline-offset: 2px; }

/* 面包屑和通用小样式 */
.breadcrumb a { color: #9bd; text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; }
.video-title { font-size: 15px; margin: 8px 0 4px; text-align: center; }
.video-update { font-size: 12px; color: #aaa; text-align: center; margin: 0; }
.tag-chip {
  display: inline-block; margin: 5px 6px; padding: 4px 8px;
  border-radius: 20px; background: #37474F; color: #eee; text-decoration: none;
}

/* 移动端：堆叠，标题与详情保持左对齐，按钮全宽 */
@media (max-width: 768px) {
  .detail-box {
    flex-direction: column;
    align-items: flex-start;   /* 整体左对齐 */
  }
  .detail-poster, .detail-info {
    width: 100%;
    max-width: 100%;
  }
  .vod-title,
  .vod-meta li,
  .detail-info { text-align: left; }

  .play-btn {
    display: block;
    width: 100%;
    box-sizing: border-box;
    font-size: 18px;
    padding: 12px 16px;
    margin-top: 10px;
  }
}
/* 面包屑容器 */
.breadcrumb {
  font-size: 14px;           /* ✅ 统一文字大小 */
  color: #aaa;
}

/* 链接样式 */
.breadcrumb a {
  color: #cccc;            /* ✅ 链接颜色区分，可改为你主题色 */
  text-decoration: none;
  margin-right: 4px;
}

.breadcrumb a:hover {
  text-decoration: underline;
  color: #FF5722;            /* ✅ 鼠标悬停时变色提示交互 */
}

/* 当前页文字样式 */
.breadcrumb span[aria-current="page"] {
  color: #fff;               /* ✅ 当前页面文本颜色，更显眼 */
  font-weight: 500;
  margin-left: 4px;
}

.video-thumb.lazyload {
  background-color: #222222;
  background-size: cover;
  background-position: center;
  transition: opacity 1s ease;
  opacity: 0;
}

.video-thumb.lazyloaded {
  opacity: 1;
}

.wrap {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 15px;
}

.title {
  margin: 20px 0;
  font-size: 14px;
  color: #eee;
}

.tag-chip {
  display: inline-block;
  margin: 5px 6px;
  padding: 4px 8px;
  border-radius: 20px;
  background: #37474F;
  color: #eee;
  text-decoration: none;
}