﻿@charset "utf-8";
/* ==========================================================================
   软装到家(源站 rzdj168.com)手机版模板补充样式   rzdj-mobile.css
   --------------------------------------------------------------------------
   源站手机版样式已按源站顺序完整复刻：
     css/bootstrap.min.css  css/diy.css  css/main.css  css/index.css
     css/style.css          (源站 skin/css/style.css)
     css/cs-style.css       (源站 skin/cs/style.css)
     css/cs-common.css      (源站 skin/cs/common.css)
   本文件只补充三类样式，不覆盖源站任何规则：
     1) 源站用 Swiper 实现、本项目改用 TouchSlide 的版块(轮播圆点/服务保障)
     2) 源站 skin 中缺失的图片不参与的元素(公司动态列表、合作品牌网格)
     3) Destoon 系统元素(手机版分页、返回顶部、底部导航、弹层)
   ========================================================================== */

/* ---------- 1. 轮播圆点(TouchSlide autoPage 生成，复用源站 icon.png 雪碧图) ---------- */
.rzdj-dots{ text-align:center; height:.4rem; line-height:.4rem; font-size:0; }
.rzdj-dots span{ display:inline-block; width:.12rem; height:.12rem; margin:0 .06rem; background:url(../img/icon.png) no-repeat; background-size:2.4rem auto; background-position:-.26rem 0; vertical-align:middle; cursor:pointer; }
.rzdj-dots span.cur,
.rzdj-dots span.on{ width:.24rem; height:.2rem; background-position:0 0; }

/* ---------- 2. 服务保障(源站 .swiper-container1；改用 TouchSlide 滑动) ---------- */
.fwbz{ position:relative; height:5.3rem; overflow:hidden; background:#f6f6f6; padding-top:.4rem; }
/* 首页整页灰底（源站灰 #f6f6f6）；分类标题条 .biaoti 保持源站白底 #FFF，不覆盖 */
/* 手机版首页：整页灰底画布（白卡浮在灰底上），分类格仍是白底 */
.home-bg{ background:#f6f6f6; display:flow-root; }
/* 首页各版块标题条：上方留白 22px，标题/英文到下方内容 22px（下留白 .1rem + 内容上留白 .3rem） */
.home-bg .biaoti{ height:auto; padding-top:.4rem; padding-bottom:.1rem; }
.home-bg .mui-k{ background:#fff; padding-top:.3rem; }
/* 品类九宫格与下方橙色数据块之间的装饰线：整体间距压到 22px */
.home-bg .line{ margin:.16rem .3rem 0; }
/* 灰色版块（服务保障 / 全面布局）之间与标题上下，统一 22px */
.home-bg .gray-sec.m-t-6{ margin-top:.4rem !important; }
.gray-sec .panel-title{ margin-bottom:0; }
.gray-sec .pinzhik{ margin-top:0; }
/* 白底区块：我们的产品 / 服务案例 / 工厂环境（.biaoti 已是白底，内容格同步白底）
   公司动态整块（标题+tab+横向滚动）用 .white-sec 包成白底 */
.home-bg .mcanpin{ background:#fff; height:auto; display:flow-root; padding-top:.3rem; }
/* 产品/案例/工厂内容格：图与图之间的间距加大（源站 46% + 2% + 15px → 44% + 3% + .5rem） */
.home-bg .mcanpin ul li{ width:44%; margin:0 3% .5rem; }
.white-sec{ background:#fff; }
/* 白底区块之间的间隔用内边距，避免中间露出灰底形成灰条 */
.p-t-6{ padding-top:.6rem; }
/* 白卡区块统一灰底（源站灰 #f6f6f6）：标题+卡片整块灰底 */
.gray-sec{ background:#f6f6f6; }
.pinzhi{ background:#f6f6f6; padding-top:.4rem; }
/* 客户评价：swiper-wrapper 是裁剪盒，头顶留 12px 给卡片阴影；上留白合计仍为 22px；底部给圆点留 22px */
.gray-sec .pinzhi{ padding:.18rem 0 .4rem; }
.gray-sec .pinzhi .swiper-slide{ padding-top:12px; }
.fwbz .tip{ position:absolute; left:0; right:0; bottom:.06rem; }
.fwbz .swiper-slide{ height:4.04rem; box-sizing:border-box; padding:0 20px 0 0; background:none; box-shadow:none; }
.fwbz .swiper-slide .fwbz-card{ height:4.04rem; box-sizing:border-box; background:#ffffff; padding:.3rem; box-shadow:none; border-radius:20px; text-align:center; }
.fwbz .rzdj-dots span{ width:8px; height:8px; margin:0 4px; border-radius:50%; background:#000000; opacity:.2; }
.fwbz .rzdj-dots span.cur, .fwbz .rzdj-dots span.on{ width:8px; height:8px; opacity:1; background:#007AFF; }
/* 我们的产品：标题上方留白与内容区留白都加大；留白算在白底内，不露出灰底 */
.biaoti-pad{ height:auto; padding-top:.4rem; padding-bottom:.1rem; }
.home-bg .mcanpin-pad{ padding-top:.3rem; }
/* 客户评价轮播圆点：换成与服务保障一致的蓝色扁平圆点，与标题两侧的橙色圆点区分开 */
.pinzhi .rzdj-dots span{ width:8px; height:8px; margin:0 4px; border-radius:50%; background-color:#000000; background-image:none; opacity:.2; }
.pinzhi .rzdj-dots span.cur, .pinzhi .rzdj-dots span.on{ width:8px; height:8px; background-color:#007AFF; background-image:none; opacity:1; }

/* ---------- 3. 公司动态列表 ---------- */
.rzdj-news{ padding:0 .3rem; }
.rzdj-news li{ display:flex; align-items:center; padding:.24rem 0; border-bottom:1px solid #f2f2f2; }
.rzdj-news li .nimg{ flex:0 0 2.2rem; width:2.2rem; height:1.6rem; overflow:hidden; border-radius:6px; background:#f6f6f6; }
.rzdj-news li .nimg img{ width:100%; height:100%; object-fit:cover; display:block; }
.rzdj-news li .ntxt{ flex:1; padding-left:.24rem; min-width:0; }
.rzdj-news li .ntxt h3{ font-size:.3rem; line-height:.44rem; font-weight:400; color:#333; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.rzdj-news li .ntxt p{ font-size:.24rem; color:#999; margin-top:.12rem; }

/* ---------- 4. 合作品牌网格 ---------- */
.rzdj-brands{ display:flex; flex-wrap:wrap; padding:.24rem .3rem .3rem; }
/* 公司动态 / 合作品牌：标题自带 33px 下外边距，白底区块内改由内容上留白承担 22px */
.white-sec .panel-title{ margin-bottom:0; }
/* 公司动态：标题到下方 tab 栏 22px */
.home-bg .tab-menu{ padding-top:.4rem; }
.rzdj-brands li{ width:33.33%; box-sizing:border-box; padding:.16rem .12rem; }
.rzdj-brands li img{ width:100%; display:block; }

/* ---------- 5. 返回顶部 ---------- */
.back2top{ position:fixed; right:.3rem; bottom:2.2rem; z-index:990; }
.back2top a{ display:block; width:.8rem; height:.8rem; border-radius:50%; background:rgba(0,0,0,.35) url(../images/gotop.png) center no-repeat; background-size:.36rem auto; text-indent:-999em; overflow:hidden; }

/* ---------- 6. Destoon 手机版分页(api/pages.mobile.php 输出 #page-prev / #page-goto / #page-next) ---------- */
.pglist{ padding:.4rem .3rem; text-align:center; font-size:.26rem; }
.pglist a{ display:inline-block; height:.6rem; line-height:.6rem; margin:.06rem; padding:0 .24rem; border:1px solid #e6e6e6; border-radius:30px; color:#666; background:#fff; }
.pglist a:hover{ border-color:#f2904f; color:#f2904f; }
.pglist a b{ color:#f2904f; font-weight:700; }

/* ---------- 7. Destoon 系统底部导航(带 $foot 的页面)与悬浮球 ---------- */
.foot-bar-fix{ height:1.1rem; }
.foot-bar{ position:fixed; left:0; bottom:0; width:100%; height:1.1rem; background:#f2904f; z-index:900; }
.foot-bar ul{ display:flex; width:100%; max-width:640px; margin:0 auto; }
.foot-bar ul li{ flex:1; text-align:center; }
.foot-bar ul li a{ display:block; padding-top:.14rem; color:#fff; font-size:.24rem; }
.ui-ball{ position:fixed; right:.3rem; bottom:2.2rem; width:.9rem; height:.9rem; border-radius:50%; background:rgba(0,0,0,.35); z-index:989; }

/* ---------- 8. 系统弹层基础样式(皮肤不含系统 style.css，给出最小可用样式) ---------- */
.ui-toast{ position:fixed; left:50%; top:45%; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); background:rgba(0,0,0,.75); color:#fff; padding:.16rem .32rem; border-radius:6px; font-size:.28rem; z-index:9999; display:none; }
.ui-mask{ position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.45); z-index:9990; display:none; }
.ui-sheet,.ui-loading{ display:none; }
.share_icon{ display:none; }

/* ---------- 9. 分类导航条(模块首页/列表页、详情页的分类切换) ---------- */
.rzdj-cats{ display:flex; flex-wrap:wrap; padding:.24rem .3rem 0; background:#fff; }
.rzdj-cats a{ display:inline-block; height:.6rem; line-height:.6rem; margin:0 .16rem .2rem 0; padding:0 .28rem; font-size:.26rem; color:#555; background:#f4f4f4; border-radius:30px; }
.rzdj-cats a.on{ background:#f2904f; color:#fff; }

/* ---------- 10. 空数据提示 ---------- */
.rzdj-empty{ padding:1.2rem .3rem; text-align:center; color:#999; font-size:.28rem; background:#fff; }

/* ---------- 11. 单页正文(.about容器，与PC版同源站样式，手机版适配) ---------- */
.about{ width:100%; box-sizing:border-box; background:#fff; border-radius:.2rem; padding:.6rem .3rem .3rem; margin:0 auto; background-image:url(../img/3j.png); background-repeat:no-repeat; background-position:.3rem top; background-size:auto .4rem; }
.about h1{ font-family:Tahoma,Geneva,sans-serif; font-size:.72rem; line-height:.5rem; font-weight:normal; color:#eee; letter-spacing:.1rem; }
.about h2{ font-family:Tahoma,Geneva,sans-serif; font-size:.5rem; font-weight:normal; color:#999; letter-spacing:.1rem; background-image:url(../img/hx.png); background-repeat:no-repeat; background-position:left bottom; background-size:auto .06rem; line-height:1.2rem; margin-bottom:.3rem; margin-top:-.2rem; }
.about h3{ font-size:.32rem; color:#333; margin:.2rem 0; }
.about p{ font-size:.28rem; line-height:.56rem; color:#333; }
.about img{ max-width:100%; height:auto; display:block; margin:.2rem 0; }
.about ul{ padding-left:.4rem; }
.about ul li{ font-size:.28rem; line-height:.56rem; color:#333; list-style:disc; }
.about .wjx{ height:.3rem; width:1.57rem; background-image:url(../img/wjx.png?v=2); background-repeat:no-repeat; background-position:left center; background-size:auto .3rem; margin-top:.3rem; }

/*[rzdj-fix] 手机版头部菜单图标：三杠统一白色（透明头与悬浮橙底都白），抽屉打开时显示关闭图标 */
#menu_icon_black{display:none !important;}
#menu_icon_white{display:inline-block;}
.header-box.index #menu_icon_white{display:inline-block;}
html.overflow #menu_icon_white{display:none !important;}
/*[rzdj-fix] bootstrap 的 h1{font-size:2.5rem}/h2{font-size:2rem} 在 rem 根字号(html=屏宽/7.5≈55.7px)下
  会算成 139px/111px 的巨型字；按源站 .diy p{16px} 与 .pinzhi_you h2{18px} 的字号体系给内容标题定值 */
.diy h1{font-size:20px;}
.diy h2{font-size:18px;}
.diy h3,.diy h4,.diy h5,.diy h6{font-size:16px;}
.diy h1,.diy h2,.diy h3,.diy h4,.diy h5,.diy h6{line-height:1.8em;font-weight:bold;margin:.3rem 0 .2rem;}
/*[rzdj-fix] 单页内容图片限宽：源站内容里的原图是 PC 尺寸，手机版会横向溢出 */
.diy img{max-width:100%;height:auto;}

/*[rzdj-fix] 内页固定底栏 #toolbar 会盖住页脚版权信息：页面底部预留等高空位（占位块仅内页输出，首页不受影响） */
.toolbar-hold{height:1.1rem;}

/*[rzdj-fix] 手机版分页：照抄源站 wap/skin/css/style.css 的 .pglist 原值 */
.pglist{padding:20px 0 30px;width:100%;text-align:center;clear:both;}
.pglist a{display:inline-block;color:#666 !important;font-weight:bold;background:#fff !important;border:1px solid #ddd !important;border-radius:2px !important;margin:0 3px 10px !important;padding:0 14px !important;line-height:30px;text-decoration:none;}
.pglist *{display:inline-block;vertical-align:middle;line-height:30px;padding-bottom:1px;}
.pglist a:hover,.pglist .hover{color:#fff !important;background:#FF6600 !important;border-color:#FF6600 !important;}
.pglist .page-num-current{background-color:#F60 !important;color:#FFF !important;border-color:#F60 !important;}
.pglist .pg-sep{color:#666;line-height:30px;padding:0 2px;}