.pd-wrap {
 position:fixed;
 right:25px;
 top:50%;
 transform:translateY(-50%);
 z-index:9999;
 text-align: center;
}
/* ÀüÃ¼ ¹è³Ê */
.pd-banner {
 width:80px;
 background:#ffffff;
 border:2px solid #107452;
 border-radius:999px;
 padding:10px 0;
 box-shadow:0 6px 18px rgba(0,0,0,0.08);
 overflow:hidden;
}
.pd-item {
 display:flex;
 flex-direction:column;
 align-items:center;
 justify-content:center;
 padding:8px 0;
 text-decoration:none;
 color:#333;
 font-size:13px;
 transition:0.25s ease;
 position:relative;
}
.pd-item:not(:last-child)::after {
 content:"";
 position:absolute;
 bottom:0;
 left:14px;
 right:14px;
 height:1px;
 background: #e5e5e5;
}
/* hover */
.pd-item:hover {
 background:#f4f9f7;
 color:#107452;
}
.pd-icon {
 height:34px;
 display:flex;
 align-items:center;
 justify-content:center;
 font-size:34px;
 line-height:1;
 color:#107452;
 margin-bottom:4px;
}
.pd-text {
 min-height:26px;
 display:flex;
 align-items:center;
 justify-content:center;
 text-align:center;
 line-height:1.2;
}
.pd-logo img {
 height:28px;
 width:auto;
 display:block;
}
.pd-top {
 margin-top:10px;
 width:48px;
 height:48px;
 border-radius:50%;
 border:none;
 background:#107452;
 color:#fff;
 font-size:20px;
 font-weight:bold;
 cursor:pointer;
 box-shadow:0 5px 15px rgba(0,0,0,0.15);
 opacity:0;
 pointer-events:none;
 transition:opacity 0.4s ease;
}
@media (max-width:768px) {
 .pd-wrap {
  right:10px;
 }
 .pd-banner {
  width:56px;
  padding:6px 0;
  border-radius:28px;
 }
 .pd-item {
  padding:6px 0;
 }
 .pd-item:hover {
  background:none;
  color:inherit;
 }
 .pd-icon {
  height:28px;
  font-size:26px;
  margin-bottom:0;
 }
 .pd-text {
  display:none;
 }
 .pd-item:not(:last-child)::after {
  left:10px;
  right:10px;
 }
 .pd-logo img {
  height:24px;
 }
 .pd-top {
  margin-top:5px;
  width:35px;
  height:35px;
  font-size:15px;
  line-height: 35px;
 }
}