@charset "utf-8";

/* ========== 基础样式 ========== */
body {margin: 0px;padding: 0px;text-align: left;word-break: normal;word-wrap: break-word;font-size: 14px;font-family: Arial, "宋体";color: #000;background: url('bg.png') repeat;}
form, dl, dt, dd, ul, li {margin: 0px;padding: 0px;}
table , div {margin: 0 auto;}
ul,li {list-style-type: none;text-align: left;margin: 0px;padding: 0;}
li {height: 20px;}
a {font-size: 14px;text-decoration: none;color: #000;padding: 0;outline: none;hide-focus: expression(this.hideFocus=true);}
a:hover {text-decoration: none;}
img, input, select {vertical-align: middle;}
img {border: 0;outline-width: 0;}
.clear {clear: both;}
.hr { width:100%;height: 10px;overflow: hidden;}
.hide {display: none;}
h1{display:none;}

/* ========== 布局容器 ========== */
.gg {margin:0 auto; width:1310px; text-align:center;}

/* ========== 头部导航 ========== */
.hbox {height: 50px;line-height: 50px;background: #333;}
.header {width: 1310px;height: 50px;margin: 0 auto;position: relative;z-index: 9;}
.header .logo {position: absolute;left: 0;top: 0;}
.header .menu {height: 50px;line-height: 50px;position: absolute;left: 175px;top: 0;}
.header .menu li {float: left;height: 50px;line-height: 50px;position: relative;z-index: 8}
.header .menu li span {display: block;}
.header .menu li a, .header .menu li span {height: 50px;font-size: 16px;color: #FFF;padding: 0 15px;display: block;}
.header .menu li a:hover {color: #bbb;}
.header .menu li ul {display: none;position: absolute;left: 0;top: 50px;width: 360px;background: #1e1e1e;padding: 10px;}
.header .menu li ul li {height: 30px;line-height: 30px;width: 120px;display: inline-block;overflow: hidden;}
.header .menu li ul li a {height: 30px;font-size: 14px;color: #FFF;padding: 0 5px;display: block;}
.header .search {height: 30px;line-height: 30px;width: 160px;background: url('search_bg.gif') repeat-x;position: absolute;right: 0;top: 10px;}
.header .search .input {float: left;width: 130px;height: 30px;overflow: hidden;}
.header .search .input input {border: 0;height: 20px;line-height: 20px;font-size: 14px; padding-left:5px;margin: 3px;width: 130px;display: block;}
.header .search .btn {float: left;width: 30px;height: 30px;overflow: hidden;}
.header .search .btn input {width: 30px;height: 30px;border: 0;cursor: pointer;background: url('search_icon.png') no-repeat center center;display: block;}

/* ========== 移动端菜单按钮 ========== */
.mobile-menu-toggle {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
}
.mobile-menu-btn {display: none;}

/* ========== 面包屑导航 ========== */
.current {width: 1310px;margin: 0 auto;position: relative;z-index: 1;height: 25px;line-height: 25px;}
.current .b a {background: url('gt.gif') no-repeat right center;padding: 0 15px 0 0;margin: 0 6px 0 0;}
.current .bshare {position: absolute;right: 0;bottom: 5px;width: 140px;}

/* ========== 主内容区 ========== */
.main {width: 1310px;margin: 0 auto;overflow: hidden;}
.main .list {width: 1310px;display: inline-block;}
.main .list .item {float: left;width: 180px;height: 250px;overflow: hidden;position: relative;margin: 0 0 15px 7px;}
.main .list .item span {position: absolute;left: 0;bottom: 0;width: 180px;height: 30px;line-height: 30px;text-align: center;background: url("title_bg.png") repeat;color: #FFF;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.main .list .big {width: 360px;height: 640px;}
.main .list .big span {width: 360px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.main .two_two {float: left;width: 360px;margin: 0;display: inline-block;}
.main .one_two {float: left;width: 180px;display: inline-block;margin: 0;}
.main .title {height: 35px;line-height: 35px;border-bottom: 1px solid #999;margin: 15px 0 10px 0;position: relative;}
.main .title a,.spage .title h1 {font-size: 20px;font-weight: bold;font-family: "微软雅黑";}
.main .title p{ text-align:center; font-size: 20px;font-weight: bold;font-family: "微软雅黑";}
.spage .title,.spage .title h1 {padding: 0;margin: 0;}
.main .title span {position: absolute;left: 120px;top: 0;}
.main .title span a {font-size: 14px;color: #777;font-weight: normal;display: inline-block;margin: 0 0 0 20px;float: left;}
.main .title span a:hover {color: #000;}
.main .subsort {border-bottom: 1px solid #999;margin: 0 0 10px 0;display: block;width: 1310px;overflow: hidden;}
.main .subsort ul {width: 1308px;}
.main .subsort li {float: left;width: 108px; margin:0 5px; height: 33px;text-align: left;}
.main .subsort li a {width: 108px;height: 25px;line-height: 25px;display: block;background: #eee;white-space: nowrap;border-radius: 3px;text-align: center;}
.main .subsort li a:hover {background: #FFF;}
.main .notdata {padding: 100px 0;background: #FFF;text-align: center;}
.main .topic {position: relative;background: url('shandian.png') no-repeat left 6px;padding: 0 0 0 18px;height: 40px;}
.main .topic h2 {float:left;padding: 0 0 10px 0;margin: 0;font-size: 22px;font-family: "微软雅黑";font-weight: normal;}
.main .topic font {float: left;line-height: 40px;font-size: 16px;padding: 0 0 0 10px;}
.main .topic span {position: absolute;right: 0;bottom: 10px;color: #666;font-family: simsun;}

/* ========== 内容页 ========== */
.cbox {border: 1px solid #bbb;background: #FFF;box-shadow: 2px 2px 2px #1e1e1e;}
.content {position: relative;text-align: center;width: 958px;overflow: hidden;}
.content img {max-width: 918px;padding: 20px;}
.content a.prev {position: absolute;left: 0;top: 0;width: 479px;display: inline-block;outline-width: 0;}
.content a.prev:hover {background: url('prev.png') no-repeat left center;}
.content a.next {position: absolute;right: 0;top: 0;width: 479px;display: inline-block;}
.content a.next:hover {background: url('next.png') no-repeat right center;}
.info {height: 40px;position: relative;overflow: hidden;}
.info .tag {position: absolute;left: 10px;top: 5px;width: 840px;height: 30px;line-height: 30px;font-weight: bold;}
.info .tag a {margin: 0 10px 0 0;font-weight: normal;}
.info span {position: absolute;right: 10px;top: 5px;height: 30px;line-height: 30px;padding: 0 0 0 25px;background: url('heart.png') no-repeat left center;}
.intro {border-bottom: 1px solid #bbb;padding: 10px;line-height: 25px;}
.pbox {width: 978px;height: 134px;position: relative;border-top: 1px solid #EFEFEF;margin: 0 auto;}
.pbox .l, .pbox .r {width: 124px;height: 114px;position: absolute;top: 10px;overflow: hidden;line-height: 20px;text-align: center;font-size: 12px;}
.pbox .l a, .pbox .r a {width: 120px;height: 90px;border: 2px solid #bbb;overflow: hidden;display: block;box-shadow: 1px 1px 1px #1e1e1e;}
.pbox .l img, .pbox .r img {width: 120px;height: 150px;display: block;border: 0;}
.pbox .l {left: 0;}
.pbox .r {right: 0;}
.pbox .m {position: absolute;left: 134px;top: 10px;width: 668px;height: 114px;}
.pbox .m .thumb {width: 668px;height: 94px;position: relative;}
.pbox .m .thumb a.p {position: absolute;left: 0;top: 0;width: 20px;height: 94px;background: url('arrow.gif') no-repeat left center;}
.pbox .m .thumb a.p:hover {background-position: -37px center;}
.pbox .m .thumb a.n {position: absolute;right: 0;top: 0;width: 20px;height: 94px;background: url('arrow.gif') no-repeat -93px center;}
.pbox .m .thumb a.n:hover {background-position: -130px center;}
.pbox .m .thumb ul {position: absolute;left: 30px;top: 0;width: 605px;height: 94px;}
.pbox .m .thumb li {float: left;width: 120px;height: 90px;border: 2px solid #bbb;margin: 0 3px 0 2px;box-shadow: 1px 1px 1px #1e1e1e;}
.pbox .m .thumb li.selected, .pbox .m .thumb li:hover, .pbox .l a:hover, .pbox .r a:hover {border: 2px solid #cb1e1c;}

/* ========== 链接和页脚 ========== */
.link {width: 1310px;margin: 0 auto;line-height: 25px;}
.link span {height: 30px;background: url('link.gif') no-repeat left 5px;display: block;}
.link a {margin: 0 10px 0 0;font-size: 12px;}
.footer {background: url('footer.jpg') repeat;padding: 10px 0;}
.footer .sort {width: 1310px;margin: 0 auto;}
.footer .sort .col {display: block;}
.footer .sort .col span {display: block;font-weight: bold;padding: 5px 0 5px 20px;background: url('tit_icon.png') no-repeat left center;}
.footer .sort .col a {display: inline-block;float: left;height: 22px;line-height: 22px;white-space: nowrap;font-size: 12px;margin: 0 10px 0 0;color: #333;}
.footer .sort .col span a {display: block;float: none;font-size: 14px;color: #000;}
.footer .copyright {width: 1310px;margin: 0 auto;padding: 10px 0;text-align: center;}

/* ========== 滚动按钮 ========== */
.scroll {position: fixed;right: 16px;bottom: 10px;z-index: 9999;}
.scroll a {display: block;width: 40px;height: 40px;margin-bottom: 6px;background: url('scroll.png') no-repeat;}
.scroll a:hover {background-position: 0 -40px;}

/* ========== 分页 ========== */
.pagebox {padding: 10px 0 0 0;text-align: center;font-family: "宋体";}
.pagebox img {vertical-align: middle;}
.pagebox a.more {width: 300px;height: 28px;line-height: 28px;background: #009100;color: #FFFFFF;border: 1px solid #006b00;font-weight: bold;font-size: 14px;display: inline-block;}
.pagebox a {padding: 7px 15px;border: 1px solid #cecfce;background: #FFFFFF;display: inline-block;margin: 0 10px 0 0;font-size: 14px;color: #999;}
.pagebox b {padding: 7px 15px;border: 1px solid #cecfce;background: #009100;display: inline-block;margin: 0 10px 0 0;font-size: 14px;color: #fff;}
.pagebox a.bg {background: #009100;color: #FFFFFF;border: 1px solid #006b00;}
.pagebox a.now {color: #1e1e1e;}
.pagebox span {padding: 7px 0;display: inline-block;margin: 0 10px 0 0;font-size: 14px;}

/* ========== 轮播 ========== */
.mwrap {width: 1310px;position: relative;}
.mwrap .mbox {width: 765px;margin: 0 auto;overflow: hidden;}
.mwrap .mbox .list {width: 780px;}
.mwrap a.pl {position: absolute;left: 0;top: 50%;margin: -36px 0 0 0;background: url('pleft.png') no-repeat center center #888;}
.mwrap a.pr {position: absolute;right: 0;top: 50%;margin: -36px 0 0 0;background: url('pright.png') no-repeat center center #888;}
.mwrap a.pl:hover, .mwrap a.pr:hover {background-color: #009100;}

/* ========== 视频/手稿列表 ========== */
.spbox {width: 970px;}
.spbox .item {float: left;width: 473px;margin: 10px 10px 0 0;border: 1px solid #bbb;background: #FFF;}
.spbox .item .cont {margin: 10px;line-height: 25px;height: 75px;overflow: hidden;}
ul.wsd {width: 968px;padding: 0 1px;}
ul.wsd li {float: left;width: 230px;height: 40px;line-height: 40px;border: 1px solid #bbb;background: #FFF;margin: 10px 10px 0 0;}
ul.wsd li a {display: block;text-align: center;font-size: 18px;}
ul.wsd li a:hover {background: #f7f7f7;}


/* ================================================
   响应式 - 平板端 (768px - 1024px)
   ================================================ */
@media screen and (max-width: 1024px) {
    .gg {width: 100%;padding: 0 10px;box-sizing: border-box;}
    .header {width: 100%;}
    .main {width: 100%;}
    .main .list {width: 100%;}
    .current {width: 100%;padding: 0 10px;box-sizing: border-box;}
    .link {width: 100%;}
    .footer .sort {width: 100%;}
    .footer .copyright {width: 100%;}
    .mwrap {width: 100%;}
    
    .header .menu {left: 150px;}
    .header .menu li a, .header .menu li span {padding: 0 10px;font-size: 14px;}
    
    .main .subsort {width: 100%;}
    .main .subsort ul {width: 100%;}
    .main .subsort li {width: 30%;margin: 0 1%;float: left;}
    .main .subsort li a {width: 100%;}
    
    .main .list .item {width: 31%;margin: 0 1% 15px 1%;}
    .main .list .item span {width: 100%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
    .main .list .big {width: 31%;height: auto;float: left;margin: 0 1% 15px 1%;}
    .main .list .big span {width: 100%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
    
    .spbox {width: 100%;}
    .spbox .item {width: 31%;margin: 10px 1%;float: left;}
    
    ul.wsd {width: 100%;}
    ul.wsd li {width: 31%;}
    
    .content {width: 100%;}
    .content img {max-width: 100%;padding: 10px;}
    .content a.prev, .content a.next {width: 50%;}
    
    .info .tag {width: auto;right: 80px;}
    
    .pbox {width: 100%;height: auto;padding-bottom: 10px;}
    .pbox .l, .pbox .r {position: relative;top: auto;width: 31%;height: auto;margin: 0 1%;float: left;}
    .pbox .l a, .pbox .r a {width: 100%;height: auto;}
    .pbox .l img, .pbox .r img {width: 100%;height: auto;}
    .pbox .m {position: relative;left: 0;top: 10px;width: 100%;height: auto;float: left;}
    .pbox .m .thumb {width: 100%;height: auto;}
    .pbox .m .thumb ul {position: relative;left: 0;width: 100%;height: auto;overflow: hidden;}
    .pbox .m .thumb li {width: 30%;height: auto;margin: 0 1% 10px 1%;float: left;}
}


/* ================================================
   响应式 - 手机端 (最大767px)
   ================================================ */
@media screen and (max-width: 767px) {
    body {font-size: 12px;}
    a {font-size: 12px;}
    
    /* ========== 头部导航适配 ========== */
    .hbox {height: auto;min-height: 50px;line-height: 50px;position: relative;}
    .header {width: 100%;height: auto;padding: 0 10px;box-sizing: border-box;}
    .header .logo {position: relative;display: inline-block;vertical-align: middle;}
    .header .logo img {height: 40px;width: auto;}
    
    /* 显示汉堡菜单按钮 */
    .mobile-menu-btn {
        display: block;
        position: fixed;
        right: 10px;
        top: 5px;
        width: 40px;
        height: 40px;
        cursor: pointer;
        z-index: 100;
    }
    .mobile-menu-btn::before,
    .mobile-menu-btn::after {
        content: '';
        position: absolute;
        left: 8px;
        width: 24px;
        height: 3px;
        background: #fff;
        border-radius: 2px;
        transition: all 0.3s ease;
    }
    .mobile-menu-btn::before {top: 10px;}
    .mobile-menu-btn::after {top: 26px;}
    .mobile-menu-btn span {
        position: absolute;
        left: 8px;
        top: 18px;
        width: 24px;
        height: 3px;
        background: #fff;
        border-radius: 2px;
        transition: all 0.3s ease;
        display: block;
    }
    
    /* 菜单打开时的按钮动画 */
    body.menu-open .mobile-menu-btn::before {
        transform: rotate(45deg);
        top: 18px;
    }
    body.menu-open .mobile-menu-btn span {
        opacity: 0;
    }
    body.menu-open .mobile-menu-btn::after {
        transform: rotate(-45deg);
        top: 18px;
    }
    
    /* 隐藏原PC版导航 */
    .header .menu {
        display: block;
        position: relative;
        left: 0;
        top: 0;
        width: 100%;
        height: auto;
        line-height: normal;
        max-height: 0;
        overflow: hidden;
        background: #1e1e1e;
        margin-top: 5px;
    }
    
    /* 搜索框在菜单上面 */
    .header .search {
        position: relative;
        right: auto;
        top: auto;
        width: 100%;
        margin: 10px 0;
        order: -1;
    }
    .header .search .input {width: calc(100% - 40px);}
    .header .search .input input {width: 100%;}
    
    /* 展开菜单 */
    body.menu-open .header .menu {
        max-height: 5000px;
        overflow: visible;
    }
    
    /* 菜单列表样式 - 使用#menu匹配线上DOM结构，加!important覆盖PC端规则 */
    .header #menu {
        width: 100% !important;
    }
    .header #menu > li {
        float: none !important;
        height: auto !important;
        line-height: normal !important;
        width: 100% !important;
        border-bottom: 1px solid #e0e0e0;
        position: relative;
        z-index: auto !important;
    }
    .header #menu > li > a,
    .header #menu > li > span {
        height: 44px !important;
        line-height: 44px !important;
        font-size: 16px !important;
        padding: 0 35px 0 15px !important;
        display: block !important;
        color: #fff !important;
        background: #2a2a2a !important;
        width: 100%;
        box-sizing: border-box;
        position: relative;
    }
    /* 带子菜单的span添加下拉箭头图标 */
    .header #menu > li > span::after {
        content: '▼';
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%) rotate(0deg);
        font-size: 12px;
        color: #fff;
        transition: transform 0.3s ease;
        opacity: 0.8;
    }
    .header #menu > li.open > span::after {
        transform: translateY(-50%) rotate(180deg);
        opacity: 1;
    }
    
    /* 子菜单展开 - 白色背景（模仿m站普通文档流布局） */
    .header #menu > li > ul {
        display: none !important;
        position: relative !important;
        top: auto !important;
        left: auto !important;
        width: 100%;
        padding: 10px 5px;
        background: #fff !important;
        border-bottom: 1px solid #e0e0e0;
        box-sizing: border-box;
        overflow: hidden;
    }
    .header #menu > li.open > ul {
        display: block !important;
    }
    .header #menu > li > ul > li {
        float: left !important;
        width: 33.33% !important;
        height: auto !important;
        line-height: normal !important;
        display: block;
        border: none;
    }
    .header #menu > li > ul > li > a {
        height: 36px !important;
        line-height: 36px !important;
        font-size: 16px !important;
        padding: 0 10px !important;
        display: block !important;
        text-align: center !important;
        color: #333 !important;
        background: none !important;
    }
    
    /* 面包屑 */
    .current {width: 100%;height: auto;line-height: normal;padding: 8px 10px;box-sizing: border-box;font-size: 12px;}
    .current .bshare {position: relative;right: auto;bottom: auto;width: auto;margin-top: 5px;}
    
    /* 主内容区 */
    .main {width: 100%;padding: 0 10px;box-sizing: border-box;overflow: visible;}
    .main .list {width: 100%;display: block;}
    
    /* 列表卡片 - 三列布局（与m站一致） */
    .main .list .item {float: left;width: 31%;height: auto;margin: 0 1% 10px 1%;}
    .main .list .item img {width: 100%;height: auto;display: block;}
    .main .list .item span {position: relative;width: 100%;height: 25px;line-height: 25px;padding: 0;font-size: 12px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
    
    /* 大图卡片 - 也参与三列布局 */
    .main .list .big {width: 31%;height: auto;float: left;margin: 0 1% 10px 1%;}
    .main .list .big img {width: 100%;height: auto;}
    .main .list .big span {width: 100%;height: 25px;line-height: 25px;padding: 0;font-size: 12px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
    
    /* 双列/单列项目 */
    .main .two_two {float: left;width: 31%;margin: 0 1%;}
    .main .one_two {float: left;width: 31%;margin: 0 1%;}
    
    /* 标题区 */
    .main .title {height: auto;line-height: normal;padding: 5px 0;margin: 10px 0;}
    .main .title a, .spage .title h1 {font-size: 16px;}
    .main .title p {font-size: 16px;padding: 5px 0;}
    .main .title span {position: relative;left: 0;top: 0;display: block;margin-top: 5px;}
    .main .title span a {font-size: 12px;margin: 0 10px 5px 0;float: none;display: inline-block;}
    
    /* 子分类 - 三列 */
    .main .subsort {width: 100%;}
    .main .subsort ul {width: 100%;}
    .main .subsort li {float: left;width: 31%;margin: 0 1% 5px 1%;height: auto;}
    .main .subsort li a {width: 100%;height: auto;line-height: 30px;font-size: 12px;padding: 5px 0;}
    
    /* 主题/话题 */
    .main .topic {height: auto;padding: 5px 0 5px 18px;}
    .main .topic h2 {float: none;font-size: 18px;padding: 0;margin: 0 0 5px 0;}
    .main .topic font {float: none;line-height: 1.5;font-size: 14px;padding: 0;display: block;}
    .main .topic span {position: relative;right: auto;bottom: auto;display: block;margin-top: 5px;}
    
    /* 内容页 */
    .cbox {margin: 0 10px;}
    .content {width: 100%;overflow: visible;}
    .content img {max-width: 100%;padding: 10px;box-sizing: border-box;}
    .content a.prev, .content a.next {width: 50%;height: 200px;}
    
    /* 信息栏 */
    .info {height: auto;padding: 5px 10px;}
    .info .tag {position: relative;left: 0;top: 0;width: auto;height: auto;line-height: 1.5;display: block;padding-bottom: 5px;}
    .info span {position: relative;right: auto;top: auto;display: block;margin-top: 5px;}
    
    /* 简介 */
    .intro {padding: 10px;line-height: 1.6;font-size: 13px;}
    
    /* 缩略图/上一页下一页 - 三列 */
    .pbox {width: 100%;height: auto;padding: 10px;box-sizing: border-box;}
    .pbox .l, .pbox .r {position: relative;top: auto;width: 31%;height: auto;margin: 0 1%;}
    .pbox .l a, .pbox .r a {width: 100%;height: auto;}
    .pbox .l img, .pbox .r img {width: 100%;height: auto;}
    .pbox .m {position: relative;left: 0;top: 10px;width: 100%;height: auto;margin-top: 10px;}
    .pbox .m .thumb {width: 100%;height: auto;}
    .pbox .m .thumb a.p, .pbox .m .thumb a.n {top: 0;height: 100%;}
    .pbox .m .thumb ul {position: relative;left: 25px;top: 0;width: calc(100% - 50px);height: auto;overflow-x: auto;white-space: nowrap;}
    .pbox .m .thumb li {display: inline-block;float: none;width: 80px;height: auto;margin: 0 3px;}
    
    /* 页脚 */
    .link {width: 100%;padding: 0 10px;box-sizing: border-box;}
    .link span {height: auto;padding: 5px 0;}
    .link a {display: inline-block;margin: 3px 5px;}
    .footer {padding: 10px;}
    .footer .sort {width: 100%;}
    .footer .sort .col span {padding: 5px 0;font-size: 14px;}
    .footer .sort .col a {float: none;display: inline-block;margin: 3px 5px;}
    .footer .sort .col span a {font-size: 14px;}
    .footer .copyright {width: 100%;padding: 10px 0;font-size: 12px;}
    
    /* 滚动按钮 */
    .scroll {right: 10px;bottom: 10px;}
    .scroll a {width: 35px;height: 35px;}
    
    /* 分页 */
    .pagebox {padding: 10px;font-size: 12px;}
    .pagebox a, .pagebox b, .pagebox span {padding: 5px 10px;margin: 3px;display: inline-block;font-size: 12px;}
    .pagebox a.more {width: auto;}
    
    /* 轮播 */
    .mwrap {width: 100%;}
    .mwrap .mbox {width: 100%;}
    .mwrap .mbox .list {width: 100%;}
    .mwrap a.pl, .mwrap a.pr {width: 30px;height: 30px;margin: -15px 0 0 0;}
    
    /* 特殊列表 - 三列 */
    .spbox {width: 100%;}
    .spbox .item {float: left;width: 31%;margin: 10px 1%;}
    .spbox .item .cont {height: auto;}
    
    ul.wsd {width: 100%;padding: 0;}
    ul.wsd li {float: left;width: 31%;height: auto;line-height: normal;margin: 5px 1%;}
    ul.wsd li a {padding: 8px 0;font-size: 14px;}
}