@charset "utf-8";
/* =========================================================================
   大展装饰设计顾问有限公司  szggzs.com  移动端响应式（最终落地版）
   位置：/themes/default/css/responsive.css（静态站 C:\Users\Administrator\Desktop\123）
   原则：
     1) 默认（≥1025px，不命中任何媒体查询）不写裸规则 → PC 端像素级不变
     2) 全部覆盖仅出现在 max-width 媒体查询内
     3) 只调宽度/布局/缩放；字号、配色、背景图、hover 保持原样
     4) 类名均来自静态站真实 DOM
   断点：≤1024  平板/小桌面 ；≤768  大屏手机 ；≤480  手机竖屏
   ========================================================================= */

/* —— 修复（仅 PC 视口 ≥769px 生效）：作品详情页引用 slide/css/photo.css，
      其 .nav 面包屑规则（1000px/40px）会误覆盖导航条（.navBar 内的 .nav），
      导致详情页导航条比列表页高/宽。用更高优先级的 .navBar .nav 让其恢复
      全局样式（25px 高、navBar 内自适应）；面包屑 .nav 不在 .navBar 内，不受影响。
      不放进 ≤768 媒体查询，避免误伤手机端汉堡菜单的 .nav 100% 布局。 —— */
@media screen and (min-width: 769px) {
  .navBar .nav { width: auto !important; height: 25px !important; margin: 0 auto; }
  /* 电脑端缩略图区：加宽到大图一致(950px)，隐藏两侧箭头，小图均分铺满背景区 */
  .slideList .picList { width: 950px !important; }
  .slideList .picList .l2 { width: 950px !important; }
  .slideList .picList .l1, .slideList .picList .l3 { display: none !important; }
  .slideList .picList .listM { width: 950px !important; height: auto !important; overflow: hidden !important; }
  #scrollcontent { display: flex !important; flex-wrap: nowrap !important; width: 950px !important; position: static !important; overflow-x: auto !important; }
  #scrollcontent li { flex: 0 0 150px !important; display: block !important; float: none !important; }
  #scrollcontent li img { width: 100% !important; height: 100px !important; object-fit: cover !important; display: block !important; }
  .slideList .picList .scrollBar { display: none !important; }
  /* 最新消息列表：左侧小图 + 右侧标题一行 + 来源作者日期一行 */
  .PageNewslist dl { position: relative; padding-left: 150px; min-height: 96px; }
  .PageNewslist dl dd.preview img { position: absolute; left: 8px; top: 8px; width: 120px; height: 80px; margin: 0; }
  .PageNewslist dl dd.preview { float: none; width: auto; text-indent: 0; margin-left: 0; font-size: 0; line-height: 0; }
  .PageNewslist dl dd.preview a { display: none; }
  .PageNewslist dl dt { margin-left: 0; }
  .PageNewslist dl dd.info { text-align: left; }
  .PageNewslist dl dd.info span { margin-right: 8px; }
}

/* —— 修复：详情页面包屑（.main > .nav）复用 global.css 的 .nav，
      global.css 里 .nav 是 position:absolute（导航条定位用），会误让详情页
      面包屑脱离文档流，导致下面的大图/标题上移被面包屑遮挡。
      这里把详情页面包屑改为静态定位正常占位，大图整体下移不被挡；
      并改为白底深色文字，与列表页保持一致。 —— */
.main > .nav { background: #fff !important; position: static !important; }
.main > .nav .navList { color: #8E5730 !important; }
.main > .nav .navList a { color: #8E5730 !important; }
/* —— 详情页底部"返回列表"：居中显示在原有上下蓝线之间 —— */
.operbar { text-align: center; }
.operbar a { color: #00599B; line-height: 27px; }


/* ============================ ≤1024px 平板 / 小桌面 ====================== */
@media screen and (max-width: 1024px) {

  /* 安全网：禁止任何子元素把页面撑出横向滚动 */
  html, body { max-width: 100%; overflow-x: hidden; }

  /* 安全网：站内图片在窄屏不溢出（仅媒体查询内，不影响 PC） */
  img { max-width: 100%; height: auto; }

  /* —— 顶部 header 1000px → 流式 —— */
  .header { width: auto; max-width: 100%; margin: 0 10px; }
  .toplogo { float: none; text-align: center; width: 100%; }
  .toplogo img { max-width: 90vw; width: auto; height: auto; display: inline-block; }
  .toplink { float: none; margin: 8px 0 0; text-align: center; }

  /* —— 导航条 1000px → 流式 —— */
  .head { margin-top: 10px; }
  .navBar { width: auto; margin: 0 10px; }

  /* 详情页面包屑 .nav 固定 1000px，窄视口（≤1024）会溢出靠左把"首页"裁掉，改流式 */
  .main > .nav { width: auto; margin: 0 10px 6px; }

  /* —— 主体容器 1004/1000px → 流式 —— */
  .mainbody { width: auto; max-width: 100%; margin: 20px 10px 40px; }
  .main { width: auto; max-width: 100%; }
  .mainindex { width: auto; max-width: 100%; }
  /* page_left 在 global.css 本就 display:none，频道页单栏；page_right 1000px → 流式 */
  .page_left { display: none; }
  .page_right { width: auto; float: none; margin-right: 0; }

  /* —— 首页轮播 focusname1：500px → 300px。
       注意 focus/1/css.css 在首页是 <body> 内后注入的，等优先级会压过本文件，
       故这里用 .m1 .focusname1 复合选择器提高优先级 —— */
  .m1 { margin-top: 15px; }
  .m1 .focusname1 { height: 300px; }
  .m1 .focusname1 .bd li { height: 300px; background-size: cover; background-position: center center; }
  .m1 .focusname1 .bd li a { height: 300px; }

  /* —— 页脚 footer 994px → 流式，高度自适应 —— */
  .footer { width: auto; margin: 0 10px; height: auto; padding: 10px 0 20px; }
  .footer .footmenu { width: auto; }
  .footer .about, .footer .copyright { padding: 0 10px; }

  /* —— 频道内容边距收紧 —— */
  .rightContent { padding: 10px; }

  /* —— 详情正文图片：news.css 写死 max-width:720px → 100% —— */
  .PageNewsview #content .text img { max-width: 100% !important; height: auto; }
  .PageAboutContent img { width: 100%; height: auto; }

  /* —— 新闻图文列表预览小图取消左浮动 —— */
  .PageNewslist dl dd.preview img { float: none; margin: 0 0 8px; }

  /* —— 图片详情页（slide 看图器）整组 1000/950/900px → 流式 —— */
  .slideMHD, .titleM, .titleM .title, .titleM .title2,
  .slideNews, .slideNews .picDiv, .slideList, .slideList .picList,
  .recommend, .recommend .picNews, .recommend .picNews .l1, .recommend .picNews .l3,
  .functionHead, .yw, .moreList, .moreList ul,
  .listMpic, .listMpic .pic, .listMpic .introduction { width: auto; }
  /* 看图器自带面包屑 .nav（slide/css/photo.css 内 width:1000px） */
  .slideMHD .nav { width: auto; }
  .functionPic { width: auto !important; max-width: 100% !important; float: none !important; text-align: center !important; }
  .functionPic div { float: none !important; display: inline-block !important; margin: 0 6px !important; }
  .slideNews .picDiv img { max-width: 100% !important; height: auto !important; box-sizing: border-box !important; }
  .titleM .title { float: none; text-align: center; }
  .titleM .functionPic { float: none; width: auto; text-align: center; }
  .slideList .before, .slideList .after { width: auto; float: none; overflow: hidden; }
  .slideList .picList { float: none; margin: 10px 0; }
  .slideList .picList .l2, .slideList .picList .listM { width: auto; }
  .slideList .picList .scrollBar { width: auto; }
  /* 详情页底部 5px 线与页脚容器（photo.css 内 1000px）→ 流式，避免手机横向溢出 */
  .smooth { width: auto !important; margin-left: 10px !important; margin-right: 10px !important; }
  .bottom, .copyright { width: auto !important; max-width: 100% !important; margin: 0 10px !important; }

  /* —— 作品清单 <table width="100%">：不压扁 —— */
  .page_right table { width: 100%; border-collapse: collapse; }
}


/* ============================ ≤768px 大屏手机 ============================ */
@media screen and (max-width: 768px) {

  /* —— 最新消息列表：手机端上小图、下标题、再来源日期 —— */
  .PageNewslist dl { display: flex; flex-direction: column; padding: 8px; overflow: hidden; }
  .PageNewslist dl dd.preview { order: 1; font-size: 0; line-height: 0; margin-left: 0; }
  .PageNewslist dl dd.preview img { display: block; width: 100%; height: auto; float: none; margin: 0 0 6px; box-sizing: border-box; }
  .PageNewslist dl dd.preview a { display: none; }
  .PageNewslist dl dt { order: 2; margin-left: 0; }
  .PageNewslist dl dd.info { order: 3; text-align: left; }
  .PageNewslist dl dd.info span { margin-right: 8px; }

  /* —— 站点导航：手机端用汉堡菜单，导航条只留“菜单”按钮 —— */
  .head { position: relative; height: auto !important; overflow: visible !important; }
  .navBar { position: relative; height: auto !important; overflow: visible !important;
            box-sizing: border-box; }
  .mnav-btn { display: block !important; cursor: pointer; text-align: center;
              padding: 10px 0; font-size: 15px; letter-spacing: 2px;
              background: rgba(0,0,0,.15); color: #fff; }
  .mnav-btn::before { content: "☰ 导航菜单"; }
  .nav { position: static !important; width: 100% !important; height: auto !important;
         display: none !important; clear: both; float: none; }
  .navBar.mopen .nav { display: block !important; }
  .mainbodyindex { clear: both; position: relative; z-index: 0; }
  /* 一级菜单纵向堆叠 */
  .nav .m { float: none; width: 100%; display: block; border-top: 1px solid rgba(255,255,255,.18); }
  .nav .m span { display: none; }
  .nav h3 { float: none; width: 100%; height: auto; line-height: 30px; padding: 0; font-size: 13px; text-align: center; }
  /* 子菜单默认收起，点击一级菜单展开（JS 在 global.js） */
  .nav .sub { display: none !important; position: static; width: 100%; padding: 0; }
  .nav .sub li { width: 100%; height: auto; line-height: 24px;
                 background-color: #8a3f1f; border: 0; text-align: center; }
  .nav .sub li a { padding: 2px 0; display: block; }

  /* —— 首页轮播再压矮 —— */
  .m1 .focusname1 { height: 220px; }
  .m1 .focusname1 .bd li { height: 220px; }
  .m1 .focusname1 .bd li a { height: 220px; }

  /* —— 新闻列表链接：float+margin60 → block，自然换行 —— */
  .PageNewsListbox dl dd ul li a,
  .PageNewslist_2 ul li a { float: none; margin-right: 0; display: block; }
  .PageNewsListbox dl dd ul li span,
  .PageNewslist_2 ul li span { float: none; display: block; color: #999; }

  /* —— 项目作品子分类 → 横向小按钮（覆盖 li 内联 float/margin） —— */
  .page_right > ul { display: flex !important; flex-wrap: wrap; margin: 0; }
  .page_right > ul li { float: none !important; width: auto !important;
                        margin: 4px !important; line-height: normal !important;
                        padding: 0 !important; }
  .page_right > ul li a { display: inline-block; padding: 6px 14px;
                          border: 1px solid #c8a06b; border-radius: 18px;
                          color: #8E5730; background: #fff;
                          text-align: center; white-space: nowrap; }
  /* 当前所在子分类高亮（a 指向当前页） */
  .page_right > ul li a[href] { position: relative; }
  .page_right > ul li a[href$="index.html"] { }
  .page_right > ul li a.current, .page_right > ul li.current a,
  .page_right > ul li a.active, .page_right > ul li.active a {
    background: #8E5730; color: #fff; border-color: #8E5730; }

  /* —— 分页条不溢出 —— */
  .pages .p_btns .total_count,
  .pages .p_btns .jumppage { float: none; display: block; text-align: center; }

  /* —— 作品详情（看图器）手机端紧凑 —— */
  .slideMHD{ padding: 0!important }
  .slideMHD .titleM{ margin: 8px 0 4px!important }
  .slideNews .picDiv{ margin: 6px 0!important }
  .slideNews .picDiv img{ display: block; border-radius: 4px }
  #picDiv p.info{ text-align: center; margin: 6px 0!important; font-size: 14px }
  .functionPic{ text-align: center; margin: 4px 0!important }
  .functionPic div{ display: inline-block; margin: 0 6px!important }
  .slideList .before, .slideList .after{ margin: 4px 0!important; text-align: center }
  .slideList .before img, .slideList .after img{ display: none!important }
  .slideList .picList{ margin: 8px 0!important; text-align: center }
  .slideList .picList .l1, .slideList .picList .l3{ display: none!important }
  .slideList .picList .l2{ width: 100%!important; height: auto!important; }
  .slideList .picList .listM{ width: 100%!important; height: auto!important; overflow: visible!important; }
  .slideList { overflow: hidden!important; }
  .slideList .picList .scrollBar{ display: none!important; }
  #scrollcontent{ position: static!important; width: 100%!important; left: 0!important; display: flex; flex-wrap: wrap; justify-content: center; }
  #scrollcontent li{ width: 30%!important; margin: 1.5%!important; list-style: none; }
  .slideList .before, .slideList .after{ height: auto!important; min-height: 0!important;
                                          padding: 2px 0!important }
  .slideList .before p, .slideList .after p{ margin: 0!important; line-height: 22px;
                                              height: auto!important }
  .slideList .after p a{ display: inline-block!important; height: auto!important;
                          line-height: 22px!important }
}


/* ============================ ≤480px 手机竖屏 =========================== */
@media screen and (max-width: 480px) {

  .header { margin: 0 8px; }
  .navBar { margin: 0 8px; }
  .mainbody { margin: 15px 8px 30px; }
  .footer { margin: 0 8px; }

  /* logo 图不超过屏宽 */
  .toplogo img { max-width: 100%; height: auto; display: block; margin: 0 auto; }

  /* 轮播压到横幅高度 */
  .m1 .focusname1 { height: 180px; }
  .m1 .focusname1 .bd li { height: 180px; }
  .m1 .focusname1 .bd li a { height: 180px; }

  /* 页脚联系信息折行 */
  .footer .about, .footer .copyright { line-height: 20px; word-break: break-all; }

  /* 文章标题不溢出 */
  .PageNewsview .title { display: block; width: 100%; }
  .PageNewsview .title h2 { display: block; width: 100%; font-size: 14px; line-height: 22px; height: auto; padding: 6px 0; word-break: break-all; }
  .PageNewsview .info { display: block; width: 100%; }
  .PageNewsview .info span { display: inline-block; margin: 2px 6px 0 0; }

  .PageNewslist dl dt a { font-size: 13px; letter-spacing: 1px; }
}