ul.nnav{}
ul.nnav:after{content:"";display:block;clear:both;} 
ul.nnav>li{}
ul.nnav>li a{}
ul.nnav>li ul{}
ul.nnav>li ul:after{content:"";display:block;clear:both;} 
ul.nnav>li ul>li{} 
 
.hg-video{margin:15px auto;}
.hg-video-list{margin:0px;padding:0px;list-style:none;margin-bottom:20px;}
.hg-video-list:after{display:block;content:"";clear:both;}
.hg-video-list li{margin:0px;padding:0px;list-style:none;float:left;width: 26%;margin-left:2%;margin-bottom: 25px;position: relative;}
.hg-video-list li a{display:block;position:relative;}
.hg-video-list li .pic-play{width: 100%;height: 260px;overflow: hidden;min-height: 260px;background-color:#e9ecea;position: relative;}
.hg-video-list li .pic-play:hover {filter: brightness(50%);/* box-shadow: 0 0 10px 4px #aaa; */transition: all .2s ease-in-out;}
.hg-video-list li .pic-play img{min-width: 100%;/* min-height: 200px; */height: 100%;}
.hg-video-list li .pic-play .pic-play-button {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 75px;height: 75px;background-color: #fff;border-radius: 50%;box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);display: flex;justify-content: center;align-items: center;opacity: 0.8;transition: opacity 0.1s ease-in-out;padding-left:8px;}
.hg-video-list li .pic-play .pic-play-button:hover {opacity: 1;}
.hg-video-list li .pic-play .pic-play-button:before {content: "";border-style: solid;border-width: 15px 0 15px 26px;border-color: transparent transparent transparent #000;height: 0;width: 0;}
.hg-video-list li .title{position: absolute;left: 0px;bottom: 0px;background: #9e9e9ee6;width: 100%;height: 260px;padding: 15px 15px;display: none;}
.hg-video-list li .title h4{font-size: 18px;font-weight: normal;color: #fbb442;text-align: justify;line-height: 25px;margin-bottom: 15px;}
.hg-video-list li .title p{height:50px;overflow:hidden;color: #f2dec2;font-size: 14px;line-height:25px;}
.hg-video-list li:hover .title{display:block;}
.pagination{padding-top:0px;padding-bottom:0px;}

@keyframes fadeIn {
    from { /* 动画开始时 */
        opacity: 0;}
    to { /* 动画结束时 */
        opacity: 1;}
}
 



@media screen and (max-width:768px) {
    .hg-video-list li{width:96%;}
}


@media screen and (max-width:480px) {

}
/* 以下样式不用修改 开始*/
    /* 默认ul 无需修改 */
    .nav_menustyle_1_1 ul
    {
        list-style-type:none;
        padding:0px; 
        margin:0px;}
    /* 默认li 无需修改 */
    .nav_menustyle_1_1 li
    {
        float:left;
        text-align:center;
        position:relative;}
    /* 2级以上 li 无需修改 */
    .nav_menustyle_1_1 ul li ul li
    {
        float:none;
        z-index:100;}
    /* 3级以上默认ul 无需修改 */
    .nav_menustyle_1_1 ul li ul li ul
    {
        left:100%;
        top:0px;}
    /* IE6下的table样式 无需修改 */
    .nav_menustyle_1_1 table 
    {
        position:absolute; 
        left:0px;
        border-collapse:collapse; 
        border-spacing:0; 
        z-index:100;}   
    .nav_menustyle_1_1 table table
    {
        top:0px;}
    .nav_menustyle_1_1 td 
    {
        padding: 0;}   
    /* 共6级导航子菜单打开关闭控制 无需修改 */
    .nav_menustyle_1_1 li ul,
    .nav_menustyle_1_1 li:hover ul li ul,
    .nav_menustyle_1_1 li:hover ul li:hover ul li ul,
    .nav_menustyle_1_1 li:hover ul li:hover ul li:hover ul li ul,
    .nav_menustyle_1_1 li:hover ul li:hover ul li:hover ul li:hover ul li ul
    {
        display:none;}
    .nav_menustyle_1_1 li a:hover ul li ul,
    .nav_menustyle_1_1 li a:hover ul li a:hover ul li ul,
    .nav_menustyle_1_1 li a:hover ul li a:hover ul li a:hover ul li ul,
    .nav_menustyle_1_1 li a:hover ul li a:hover ul li a:hover ul li a:hover ul li ul
    {
        visibility:hidden;}
    .nav_menustyle_1_1 li a:hover ul,
    .nav_menustyle_1_1 li:hover ul,
    .nav_menustyle_1_1 li:hover ul li:hover ul,
    .nav_menustyle_1_1 li:hover ul li:hover ul li:hover ul,
    .nav_menustyle_1_1 li:hover ul li:hover ul li:hover ul li:hover ul,
    .nav_menustyle_1_1 li:hover ul li:hover ul li:hover ul li:hover ul li:hover ul    
    {
        display:block;
        position:absolute;}
    .nav_menustyle_1_1 li a:hover ul li a:hover ul,
    .nav_menustyle_1_1 li a:hover ul li a:hover ul li a:hover ul,
    .nav_menustyle_1_1 li a:hover ul li a:hover ul li a:hover ul li a:hover ul,
    .nav_menustyle_1_1 li a:hover ul li a:hover ul li a:hover ul li a:hover ul li a:hover ul
    {
        visibility:visible;}
    /* 默认a属性 无需修改 */
    .nav_menustyle_1_1 a
    {
        display:block;
        text-decoration:none;
        white-space:nowrap;}
/* 以上样式不用修改 结束*/
/* 默认链接样式 可以修改默认的 字体、颜色、宽度、高度、背景色、边框等*/
.nav_menustyle_1_1 a
{
    width:90px;         /*菜单宽度*/
    height:25px;        /*菜单高度*/
    line-height:25px;   /*字体高度, 可设为菜单高度*/
    font-size:14px;     /*字体大小*/
    color:#000;         /*字体颜色*/
    background:#eeeeee; /*背景色*/
    border:1px solid #fff;  /*边框颜色*/
    border-width:0px 1px 1px 0px;}
/* 默认hover链接样式 可以设置默认的鼠标移上样式 */
.nav_menustyle_1_1 a:hover
{
    color:#fff; /*鼠标移上颜色*/
    background:#2687eb;}
/* IE6兼容性代码，在IE6下起效， 必须根据菜单高宽进行设定 */
.nav_menustyle_1_1 table 
{
    top:26px;}   
.nav_menustyle_1_1 table table
{
    left:91px;}   
/* 2级以上链接样式 可以修改2级以上菜单的 字体、颜色、宽度、高度、背景色、边框等*/
.nav_menustyle_1_1 ul li ul li a
{}
/* 2级以上hover链接样式 可以修改2级以上菜单的鼠标移上样式*/
.nav_menustyle_1_1 ul li ul li a:hover
{}
/* 3级以上链接样式 可以修改3级以上菜单的 字体、颜色、宽度、高度、背景色、边框等*/
.nav_menustyle_1_1 ul li ul li ul li a
{}
/* 3级以上hover链接样式 可以修改3级以上菜单的鼠标移上样式*/
.nav_menustyle_1_1 ul li ul li ul li a:hover
{}