/* ================= 在线悬浮窗模块 ================= */

/* —— 1. 总容器 —— */
.online_func{
  position:fixed;
  right:20px;
  top:50%;
  width:100px;
  transform:translateY(-50%);
  z-index:999;
}
@media (max-width:900px){
  .online_func{
    left:0; right:0; bottom:0; top:auto;
    width:auto;
    transform:none;
  }
}

/* —— 2. 按钮项 —— */
.online_func .online_item{
  position:relative;
  display:block;
  height:98px;
  margin:1px 0;
  padding:1px 0;
  background:#f3f3f3;
  color:#666;
  text-align:center;
  transition:all .3s ease;
  overflow:hidden;
}
.online_func .online_item:hover{
  background:#355571;
  color:#fff;
}

/* 移动横排 */
@media (max-width:900px){
  .online_func .online_item{
    float:left;
    width:25%;
    height:78px;
    margin:0;
  }
}

/* —— 3. 图标 / 文字 —— */
.online_func .online_symbol{
  display:block;
  margin:20px 0 10px;
}
@media (max-width:900px){
  .online_func .online_symbol{margin:7px 0 0;}
}

/* 统一 <img> 图标尺寸 */
.online_func .online_symbol img{
  width:40px!important;
  height:40px!important;
  object-fit:contain;
}

/* 若仍使用 <em class="ico ..."> 字体图标 */
.online_func .online_symbol .ico{
  display:inline-block;
  width:24px;height:24px;
  font-size:24px; line-height:24px;
}

/* —— 4. 特殊按钮显隐 —— */
.online_item.online_phone{display:none;}
@media (max-width:900px){
  .online_item.online_wechat{display:none;}
  .online_item.online_phone {display:block;}
}

/* —— 5. 二维码弹窗 —— */
.online_item.online_wechat{position:relative;}
.online_item .online_wnd{
  display:none;
  position:absolute;
  top:50%; right:100%;
  width:160px;height:160px;
  padding:6px;
  transform:translateY(-50%);
  background:url("/pc/images/online_wnd_bg.png") no-repeat center;
  z-index:999;
}
.online_item:hover .online_wnd,
.online_item.online_wechat.active .online_wnd{display:block;}

@media (max-width:900px){
  .online_item .online_wnd{
    top:auto; bottom:100%; right:50%;
    margin-bottom:10px;
    transform:translateX(50%);
    background:#fff;
    box-shadow:0 0 7px rgba(0,0,0,.3);
  }
}

/* 弹窗内容居中 */
.online_wnd_content{
  text-align:center;
  line-height:160px;
}
.online_wnd_content .barcode_img{
  max-width:100%;
  height:auto;
  vertical-align:middle;
}

/* PC / 平板 ≥ 900px  —— 靠左侧展开（按钮在右，弹窗在左） */
.online_item.online_wechat .online_wnd{
  right: calc(100% + 10px);   /* 在按钮左侧，再留 10px 间距 */
  left: auto;                 /* 避免 left 影响 */
  top: 50%;
  transform: translateY(-50%);
}

/* ≤ 900px 移动端保持向上展开（不改动） */
@media (max-width:900px){
  .online_item.online_wechat .online_wnd{
    right: 50%;
    bottom: 100%;
    left: auto;
    transform: translate(50%, 0);
  }
}
/* /* 让二维码弹窗可以伸出按钮，不被裁剪；同时抬高层级 */
.online_item.online_wechat{
  overflow: visible !important;   /* 关键：允许内容溢出 */
  z-index: 1001;                  /* 比父容器 online_func 的 50 高得多 */
}

/* 弹窗定位到按钮左侧，留 10px 间距，垂直居中 */
.online_item.online_wechat .online_wnd{
  right: calc(100% + 10px);
  left: auto;
  top: 50%;
  transform: translateY(-50%);
}================= /在线悬浮窗模块 ================= */
