/* ===================================================================
   intersk 响应式样式（手机 / 平板自适应）
   仅通过媒体查询覆盖桌面固定宽度布局，不影响桌面端原有效果。
   中英文站共用本文件（css.css 之后引入）。
   =================================================================== */

/* 基础：所有图片/视频/iframe 默认缩放自适应 */
img, video, iframe { max-width: 100%; height: auto; }

/* 让 box-sizing 在容器上生效，避免 width:100% + padding 溢出 */
.wrap, .wrap2, #nav, #top, .menu, .footer, .footerys,
.linkboxtop, .linkboxbottom, .linkbox, .indexnew, .hshouc {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* ===================================================================
   汉堡按钮（手机导航键）基础样式：桌面隐藏，手机靠右显示
   =================================================================== */
.nav-toggle {
  display: none;                 /* 桌面端不显示 */
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 46px; height: 42px;
  padding: 0;
  background: #974478;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.nav-toggle span {
  display: block;
  width: 22px; height: 2px;
  background: #fff;
  border-radius: 2px;
  transition: transform .3s ease, opacity .3s ease;
}
/* 展开态：三条杠变成 X */
.nav-toggle.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.active span:nth-child(2) { opacity: 0; }
.nav-toggle.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* 下拉面板内的实用区（热线 + 搜索），桌面隐藏 */
.mobile-utils { display: none; }

/* ---------- 平板：容器由固定 1000px 改为流式（上限 1000px） ---------- */
@media (max-width: 1024px) {
  .wrap, .wrap2, #nav, #top, .menu, .footer, .footerys,
  .linkboxtop, .linkboxbottom, .linkbox, .indexnew, .hshouc {
    width: 100%;
    max-width: 1000px;
  }
  .wrap, .wrap2, .menu, #top, .footer, .footerys,
  .linkboxtop, .linkboxbottom, .linkbox, .indexnew, .hshouc {
    padding-left: 10px;
    padding-right: 10px;
  }
  /* 首页三栏在平板上先收窄，不堆叠 */
  .main003001, .main003002 { width: 48%; margin-left: 0; }
  .main003003 { width: 100%; float: none; margin-top: 12px; }
  .main003002 { margin-left: 4%; }
}

/* ---------- 手机：结构性重排（<=768px） ---------- */
@media (max-width: 768px) {
  *, *::before, *::after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

  /* 顶部：logo / 语言 / 电话 / 搜索 由绝对定位改为纵向居中堆叠 */
  #header { height: auto; }
  #top { position: static; width: 100%; height: auto; text-align: center; padding: 12px 10px 16px; }
  #top > img { display: block; margin: 0 auto 8px; max-width: 75%; height: auto; }
  .lang_switch { position: static; display: inline-block; margin: 4px auto 8px; }
  #top .tel { position: static; width: auto; height: auto; top: auto; right: auto; text-align: center; margin: 6px 0; }
  #top .tel li { float: none; display: inline-block; background: none; padding: 0 8px; }
  #top .search { position: static; width: 100%; height: auto; top: auto; right: auto; text-align: center; margin: 10px 0 0; }
  #top .search form { margin-top: 0 !important; }
  .sskuan { width: 70%; max-width: 240px; }

  /* 汉堡按钮：手机显示并靠右 */
  .nav-toggle { order: 3; display: inline-flex; }

  /* 顶部栏：logo 靠左，语言 + 汉堡靠右，干净一行（大气） */
  #top {
    position: relative;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    padding: 10px 12px;
  }
  #top > img { display: block; margin: 0; max-width: 55%; height: auto; flex: 0 1 auto; margin-right: auto; }
  .lang_switch { order: 2; position: static; margin: 0 12px 0 0; }
  #top .tel, #top .search { display: none; }   /* 移入下拉面板 */

  /* 导航：默认折叠，点击汉堡展开为全宽下拉面板 */
  .menuys { height: auto; display: none; background: #974478; }
  .menuys.open {
    display: block;
    -webkit-animation: navDrop .25s ease;
    animation: navDrop .25s ease;
  }
  @-webkit-keyframes navDrop { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
  @keyframes navDrop { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }

  .menu { width: 100%; }
  .menu ul { height: auto !important; padding-left: 0 !important; }
  .menu > ul > li {
    float: none; width: 100%; height: auto; line-height: normal;
    text-align: left; background: none;
    border-bottom: 1px solid rgba(255, 255, 255, .22);
    padding: 0; font-size: 16px;
  }
  .menu > ul > li > a {
    display: block; padding: 15px 16px; height: auto; line-height: 1.4;
    font-size: 16px; color: #fff;
  }
  .menu ul ul {
    position: static; visibility: visible; height: auto;
    padding-left: 0; margin: 0; width: 100%;
    background: rgba(0, 0, 0, .12);
  }
  .menu ul ul li {
    width: 100%; height: auto; line-height: normal;
    padding: 0; background: none;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
  }
  .menu ul ul li a {
    display: block; padding: 12px 16px 12px 32px; width: 100%; height: auto;
    color: #f3e6ee;
  }

  /* 下拉面板内的实用区（热线 + 搜索） */
  .mobile-utils {
    display: block;
    padding: 14px 16px;
    background: #7d375f;
    border-bottom: 1px solid rgba(255, 255, 255, .15);
  }
  .mobile-utils .mu-tel { color: #fff; font-weight: bold; font-size: 15px; margin-bottom: 10px; }
  .mobile-utils .mu-search { display: flex; align-items: center; gap: 8px; }
  .mobile-utils .mu-search .sskuan { width: 100%; max-width: none; height: 36px; border: none; border-radius: 4px; padding: 0 10px; }
  .mobile-utils .mu-search .seago { width: 36px; height: 36px; }

  /* 整体更大气：正文加大、容器内边距宽松 */
  body { font-size: 16px; line-height: 1.7; }
  .wrap, .wrap2 { padding-left: 14px; padding-right: 14px; }

  /* 内页两栏（sidebar + main） -> 单栏堆叠 */
  .sidebar { float: none; width: 100%; }
  .main { float: none; width: 100%; }

  /* 面包屑（当前位置）不再固定宽 */
  .all_t { height: auto; }
  .all_t .atl { float: none; width: auto; }
  .all_t_wz { float: none; width: auto; }
  .all_t_home { float: none; width: auto; text-align: left; margin-top: 4px; }
  .all_t .atr { float: none; }

  /* 首页案例图（mainbox）4 列 -> 2 列 */
  .mainbox li { width: 48%; margin-right: 4%; }
  .mainbox li:nth-child(2n) { margin-right: 0; }

  /* 首页三栏 -> 堆叠 */
  .main003001, .main003002, .main003003 { float: none; width: 100%; margin-left: 0; }
  .main003002, .main003003 { margin-top: 14px; }
  .left_box_pic { float: none; width: 100%; text-align: center; margin: 0 0 8px; }
  .left_box_news { width: 100%; height: auto; }
  .main003002box001 dt, .main003002box001 dd { float: none; width: 100%; }

  /* 产品列表卡：flex 两列（覆盖固定 175px + float） */
  .box1_m_pro { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; justify-content: space-between; }
  .box1_m_pro > *:not(.product) { -webkit-box-flex: 1; -webkit-flex: 1 1 100%; flex: 1 1 100%; }
  .product { float: none; width: 48%; margin: 0 0 12px 0 !important; }
  .product dt { height: auto; }

  /* 侧栏热门产品滚动区：正常流，2 列 */
  #demo { height: auto !important; }
  .leftcpgd { width: 48%; display: inline-block; vertical-align: top; }

  /* 新品横向滚动：改为可横向滑动，隐藏箭头 */
  .show_cont, .office_center { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .office_list { display: inline-block; width: 140px; vertical-align: top; }
  .arr_l_x, .arr_r_x { display: none; }

  /* 首页轮播：高度自适应，图片铺满 */
  .index_banner, #show, #kinMaxShow { height: auto !important; overflow: hidden; }
  .index_banner img { width: 100% !important; height: auto !important; display: block; }

  /* 产品详情：图 + 信息 堆叠 */
  .cpdpic { float: none; width: 100% !important; }
  .cpdtitle { float: none; width: 100%; }

  /* 底部 */
  .footer { width: 100%; padding: 12px 10px; }
  .footer dt { font-size: 13px; line-height: 1.7; }
  .footerys { height: auto; }
}

/* ---------- 小手机：单列（<=480px） ---------- */
@media (max-width: 480px) {
  .mainbox li { width: 100%; margin-right: 0; }
  .product { width: 100%; }
  .leftcpgd { width: 100%; }
  .menu li { font-size: 16px; }
  #top > img { max-width: 85%; }
}