/* hiso-rfloat.css — CMS right contact float for k-white case pages.
   Cloned from /skin/css/style.css (.side 悬浮客服).
   Selector div.side:has(>ul>li.sideetel) avoids colliding with aside.side left column.
   v=20261102_back3_thin11 */
div.side:has(>ul>li.sideetel){
  --side-size: clamp(44px, 2.35vw, 51px);
  --side-icon: calc(var(--side-size) * .65);
  --side-panel: calc(var(--side-size) * 6);
  --side-accent: #dfff00;
  position:fixed;
  left:auto;
  right:0;
  top:50%;
  bottom:auto;
  width:var(--side-size);
  height:auto;
  margin-top:calc(var(--side-size) * -1.6);
  padding:0;
  display:block;
  flex-direction:unset;
  z-index:100;
  border:none; /* Dagang: no white outer frame 20261101 */
  background:transparent; /* no white outer fill/轮廓 */
  border-bottom:0;
  box-sizing:border-box;
  overflow:visible;
}
div.side:has(>ul>li.sideetel) ul{
  list-style:none;
  margin:0;
  padding:0;
}
div.side:has(>ul>li.sideetel) ul li{
  width:100%;
  height:var(--side-size);
  float:left;
  position:relative;
  color:#333;
  font-size:0.14rem;
  line-height:0.38rem;
  text-align:center;
  transition:all .3s;
  cursor:pointer;
  background:#000;
  display:flex;
  justify-content:center;
  align-items:center;
  margin-bottom:2px; /* optional inter-button seam; page shows through */
  box-sizing:border-box;
  border:none;
}
div.side:has(>ul>li.sideetel) ul li:last-child{
  margin-bottom:0; /* no white strip under stack */
}
div.side:has(>ul>li.sideetel) ul li:hover{
  background:var(--side-accent);
  color:#000;
}
div.side:has(>ul>li.sideetel) ul li:hover a{color:#000}
div.side:has(>ul>li.sideetel) ul li.sideewm .ewBox.son{
  width:var(--side-panel);
  min-width:var(--side-panel);
  max-width:var(--side-panel);
  display:none;
  color:#363636;
  text-align:center;
  position:absolute;
  left:calc(var(--side-panel) * -1 - 2px);
  top:0;
  border:1px solid #e0e0e0;
  background:#fff;
  padding:calc(var(--side-size) * .86);
  box-sizing:border-box;
}
div.side:has(>ul>li.sideetel) ul li.sideetel .telBox.son{
  width:var(--side-panel);
  min-width:var(--side-panel);
  max-width:var(--side-panel);
  height:var(--side-size);
  display:none;
  color:#323333;
  text-align:left;
  position:absolute;
  left:calc(var(--side-panel) * -1 - 2px);
  top:0;
  background:#fff;
  border:1px solid #e0e0e0;
  box-sizing:border-box;
}
div.side:has(>ul>li.sideetel) ul li.sideetel .telBox dd{
  display:block;
  height:var(--side-size);
  overflow:hidden;
  padding-left:12px;
  padding-right:12px;
  line-height:var(--side-size);
  font-size:clamp(14px, .9vw, 17px);
  white-space:nowrap;
  margin:0;
}
div.side:has(>ul>li.sideetel) ul li:hover .son{
  display:flex!important;
  animation:hiso-rfloat-fadein 1s;
  align-items:center;
  justify-content:center;
}
@keyframes hiso-rfloat-fadein{from{opacity:0}to{opacity:1}}
div.side:has(>ul>li.sideetel) ul li a{
  display:flex;
  height:var(--side-size);
  width:100%;
  justify-content:center;
  align-items:center;
  text-decoration:none;
  color:inherit;
}
div.side:has(>ul>li.sideetel) .ic{
  width:var(--side-icon);
  height:var(--side-icon);
  display:block;
  background:#fff;
  transition:background-color .22s ease;
}
div.side:has(>ul>li.sideetel) ul li:hover .ic{
  background:#000;
  filter:drop-shadow(0 0 2px #000) drop-shadow(0 0 2px #000) drop-shadow(0 0 2px #000);
}
div.side:has(>ul>li.sideetel) .side-icon{
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:contain;
  mask-size:contain;
}
div.side:has(>ul>li.sideetel) .side-icon-phone{
  -webkit-mask-image:url(/skin/images/side-phone.svg);
  mask-image:url(/skin/images/side-phone.svg);
}
div.side:has(>ul>li.sideetel) .side-icon-wechat{
  -webkit-mask-image:url(/skin/images/side-wechat.svg);
  mask-image:url(/skin/images/side-wechat.svg);
}
div.side:has(>ul>li.sideetel) .side-icon-chat{
  -webkit-mask-image:url(/skin/images/side-chat.svg);
  mask-image:url(/skin/images/side-chat.svg);
}
div.side:has(>ul>li.sideetel) .side-icon-back{
  -webkit-mask-image:url(/skin/images/side-back.svg?v=20261102_thin11);
  mask-image:url(/skin/images/side-back.svg?v=20261102_thin11);
}
div.side:has(>ul>li.sideetel) ul li.sideewm .ewBox.son img{
  max-width:100%;
  display:block;
}
/* phone: keep visible like CMS (no hide) */
