/* =========================================================
   PbootCMS 响应式适配样式 (二级目录 /xiezilou/)
   作用：在移动端断点下把固定宽度桌面布局改为流式/单列，
        不影响桌面端（>1200px）既有样式。
   引入方式：已在各 PC 模板 </head> 前通过
   <link rel="stylesheet" href="/xiezilou/template/default/css/responsive.css"> 引入
   ========================================================= */

/* ---------- 中屏(≤1200px)：放开强制最小宽度，容器转流式 ---------- */
@media screen and (max-width: 1200px) {
  body { min-width: 0 !important; }
  .banner_0907,
  .theme-detail,
  .chengqu,
  .box4,
  .warp,
  .w,
  .cooperation,
  .likeBox,
  .titleBox,
  .titleBox.pt14 {
    width: 100% !important;
    padding-left: 10px;
    padding-right: 10px;
    box-sizing: border-box;
  }
  .container {
    padding-left: 10px;
    padding-right: 10px;
    box-sizing: border-box;
  }
}

/* ---------- 平板/手机(≤768px)：单列堆叠、图片自适应 ---------- */
@media screen and (max-width: 768px) {
  body { font-size: 14px; }
  img { max-width: 100% !important; height: auto !important; }

  .box4 li img,
  .likeImg img,
  .list-style5 li img,
  .list-style5 .first img,
  .zixun-left img,
  .zixun-right img {
    width: 100% !important;
    height: auto !important;
  }

  /* 头部：取消固定吸顶，导航换行可横向滚动 */
  .logo { position: static !important; }
  .banner_0907 {
    width: 100% !important;
    padding: 5px 10px;
    box-sizing: border-box;
  }
  .logo .link {
    float: none !important;
    margin: 10px 0 0 0 !important;
    display: flex;
    flex-wrap: wrap;
  }
  .logo .link a {
    width: auto !important;
    padding: 6px 10px !important;
  }
  .search {
    float: none !important;
    width: 100% !important;
    margin: 10px 0 !important;
    box-sizing: border-box;
  }
  .search .input input {
    width: 68% !important;
    box-sizing: border-box;
  }

  /* 通用：取消浮动，单列堆叠 */
  .theme-detail,
  .chengqu,
  .box4,
  .warp,
  .w,
  .likeBox,
  .likeAbout,
  .likeImg,
  .zixun-box,
  .wenben2,
  .chhot,
  .clearfix1 li,
  .list-style5 li,
  .list-style5 .first,
  .box4 li,
  .zixun-left,
  .zixun-right,
  .likeAbout-price,
  .price-box .dl-box {
    float: none !important;
    width: 100% !important;
    height: auto !important;
    box-sizing: border-box;
  }
  .list-style5 li,
  .list-style5 .first,
  .box4 li { margin: 0 0 15px 0 !important; }
  .likeAbout { padding-left: 0 !important; }
  .likeAbout .p1,
  .likeAbout .p2 { width: 100% !important; }
  .likeAbout-price {
    position: static !important;
    text-align: left !important;
    margin-top: 8px;
  }

  /* 网格：两列排布，提升利用率 */
  .list-style5 li,
  .box4 li { width: 48% !important; display: inline-block; vertical-align: top; margin-right: 2% !important; }
  .list-style5 .first { width: 48% !important; height: auto !important; }
  .clearfix1 li { width: 50% !important; }

  /* 资讯区：双栏转单栏 */
  .zixun-box { width: 100% !important; }
  .zixun-box .zixun-item { width: 100% !important; padding: 0 10px !important; }
  .wenben2 { width: 100% !important; margin-left: 0 !important; float: none !important; }

  /* 页脚：绝对定位改流式 */
  #foot .d1,
  #foot .d2,
  #foot .d3 {
    position: static !important;
    width: 100% !important;
    border: 0 !important;
    padding: 10px 0 !important;
    text-align: center;
  }
  .foot-line { margin-top: 10px !important; }
  .fuwu { height: auto !important; }
  .clearfix1 { padding: 20px 10px 0 10px !important; }
}

/* ---------- 小屏(≤480px)：全部单列 ---------- */
@media screen and (max-width: 480px) {
  .list-style5 li,
  .box4 li,
  .list-style5 .first,
  .clearfix1 li {
    width: 100% !important;
    margin-right: 0 !important;
    display: block;
  }
  .h1-title .s1 { font-size: 18px !important; }
  .likeAbout h3 { font-size: 16px !important; }
}