.side-fixed-section {
  position: fixed;
  top: 50%;
  right: 0px;
  z-index: 51;
  transform: translateY(-38%);
}

.side-fixed-section .item {
  position: relative;
  width: 72px;
  height: 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  background-size: 64px 64px;
  background-position: 50%;
  background-repeat: no-repeat;
}

.side-fixed-section .item.noBg {
  background: none;
}

.side-fixed-section .item.hidden {
  display: none;
}

.side-fixed-section .item .img-wrap {
  width: 64px;
  height: 64px;
}

.side-fixed-section .item:hover .listen,
.side-fixed-section .item:hover .phone,
.side-fixed-section .item:hover .qrcode {
  display: flex;
}

.side-fixed-section .item .qrcode {
  display: none;
  position: absolute;
  left: -150px;
  top: 0;
  width: 144px;
  height: 190px;
  background: #fff;
  border-radius: 4px;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  padding-top: 10px;
}

.side-fixed-section .item .qrcode .qr_img {
  width: 120px;
  height: 120px;
  margin-bottom: 8px;
  background-size: 100% 100%;
}

.side-fixed-section .item .qrcode .txt {
  font-size: 14px;
  text-align: center;
  color: #3a3d4b;
}

.side-fixed-section .item .listen {
  display: none;
  position: absolute;
  left: -135px;
  top: 0;
  width: 148px;
  height: 176px;
  padding-top: 20px;
  box-sizing: border-box;
  flex-direction: column;
  align-items: center;
  background-size: 100% 100%;
}

.side-fixed-section .item .listen .line1 {
  background: #f6f7fa;
  border-radius: 8px;
}

.side-fixed-section .item .listen .line1,
.side-fixed-section .item .listen .line2 {
  width: 104px;
  height: 44px;
  text-align: center;
  line-height: 44px;
  color: #3a3d4b;
  font-size: 14px;
}

.side-fixed-section .item .listen .btn {
  display: inline-block;
  width: 104px;
  height: 28px;
  color: #fff;
  text-align: center;
  line-height: 28px;
  font-size: 14px;
  margin-top: 18px;
  background: linear-gradient(90deg, #ff6870, #f8323c);
  border-radius: 14px;
}

.side-fixed-section .item .phone {
  display: none;
  width: 120px;
  height: 32px;
  justify-content: center;
  align-items: center;
  font-weight: 400;
  text-align: left;
  color: #543e04;
  position: absolute;
  left: -120px;
  top: 20px;
  background-image: url(../img_new/txt.png);
  background-size: 100% 100%;
}

.side-fixed-section .item .phone .txt {
  line-height: 32px;
  font-size: 13px;
  font-weight: 700;
  text-align: left;
  color: #543e04;
}

.side-fixed-section .item .img {
  display: inline-block;
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.side-fixed-section .item .select_img {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.side-fixed-section .fixed-content {
  position: relative;
  cursor: pointer;
  height: 75px;
  right: 0px;
}

.side-fixed-section .fixed-content .img {
  position: relative;
  width: 80px;
  right: 13px;
}

.side-fixed-section .fixed-content .q1,
.side-fixed-section .fixed-content .q2 {
  position: absolute;
  left: -27px;
  top: 16px;
  width: 28px;
  height: 19px;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADgAAAAoCAMAAACcjsm3AAABSlBMVEUAAAD/u0z/uUf/szj/tyj/vVH/tkL/qh//sjT/w1//qR7/xGD/sir/uUf/rSf/x2z/qBz/szj/xWb/w1//xGb/qyL/xWX/xmb/qyD/yGn/s1D/qBr/tDr/x2z/qBv/sjP/xmr/rCb/yGz/qBz/yGv/qRz/qiP/yW3/qRv/rSb/qh7/sTX/rB//yG7/w2L/wV//wmD/yG7/tDv/wFv/qBr/wV7/tkH/szr/wFz/yG7/wmH/rSj/t0D/sTH/wln/sjD/x2v/rB7/qBv/rSz/xmX/tDz/w2X/tDX/u07/t0P/v1f/wFr/wV3/vVP/uUj/sDH/ryz/rCb/tDv/ukz/sjX/w2P/w2D/szj/xGX/qiD/vFH/uEb/sTP/xWj/rSr/tT7/tT3/tkD/vlX/tkH/ry//rSn/qyT/x2v/qR3/sjf/qBv/ukn/qyP/qiL3IMDPAAAASHRSTlMAI44jBo4j444jGxYVDvfv7+zihXV1aEgkGwX89/X13M7NwsK5uaiNjYdpYkH6+Pj05eDe0c/Luamnnp6Yg3BwVlZMSz8zJiIONhf1AAABvklEQVRIx7WVV1PCQBRGr4oigoBUxS4CUuy9d6X30MEOgvD/X70JCQQiQ3ZnPO9n7jd7HhZ6UWiex9pMsIwIqFRqBQxi2utc/ozFSul0PZl8fXn7CASK0Wgq5fcXIpH3YGj/xDINUmbPtZV4vC1ms13xRxCDoVB4+0zVP9GtTXwJYh3F3osFXgxntow9k6dWqwmx2JlaFF8Mo8gwK3OimcomKw6dimKGyRmeOveU+RYnVlAsoSi+mBKLGVbMGfibNns+3xwwNdor4lQUy2s2TjR/5/GiIJZQlEwtdEU0y2UTN3QJRWGqtKN0KoqLahQ3GijKfhyGE2suLKjnRVkdBVFng7sGK7ZkdhTEmpVdSjI1w4susLMiQUdeXAMlTiXtiOIuLOFF0o4oLsI8XiTtiOIm6Bs0HWs6OGjQdKytgJOu4yl46DpaYGqequMcgIOm4zoA+Gg6WgFxkHfEg8isnrSjTgUct6Qdb4DHTNbRBB08VfkdGQuI8CnldjQ89H1Vbq2cjjtG6YelMa8O63hoUsOfaO6vLyeRBe7i0WibcQ7jlRWtIcywFy8UQAyKC14ACjG59wg0LB9rgAoF/CO/Gm0X2s90JGEAAAAASUVORK5CYII=);
  background-size: 100%;
}

.side-fixed-section .fixed-content .q1 .d1,
.side-fixed-section .fixed-content .q1 .d2,
.side-fixed-section .fixed-content .q1 .d3,
.side-fixed-section .fixed-content .q2 .d1,
.side-fixed-section .fixed-content .q2 .d2,
.side-fixed-section .fixed-content .q2 .d3 {
  display: inline-block;
  position: absolute;
  width: 3px;
  height: 3px;
  top: 7px;
  background-color: #fff;
  border-radius: 50%;
}

.side-fixed-section .fixed-content .q1 .d1,
.side-fixed-section .fixed-content .q2 .d1 {
  left: 6px;
}

.side-fixed-section .fixed-content .q1 .d2,
.side-fixed-section .fixed-content .q2 .d2 {
  left: 13px;
}

.side-fixed-section .fixed-content .q1 .d3,
.side-fixed-section .fixed-content .q2 .d3 {
  left: 19px;
}

.side-fixed-section .fixed-content .q2 {
  z-index: -1;
  top: 3px;
  left: -16px;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAkCAMAAAD8bpkFAAABJlBMVEUAAACIsP+Erf96p/+Yuv+HrP+tx/+Ttv+pxf99qP93oP9glv+qxP+gvv+wyP9mmf9hl/+qxP9bl/9elP+bvP+xyf9dlf+xyf9elP9snv9clP9pm/9elP+fvv+wyv9dlf9xov92pv+EqP9flf9wn/9pm/94pf+qxf9unv+pw/9kmf93pP+nwf+mwf92o/+sx/+tx/9tnv9mm/97qP9ck/+jwP+jv/9rmf+iv/+Stf+Cq/9rnP9om/+Ksf9/qf93pP+gvv+Nsv98p/95pv9lmf+dvf+WuP+Ps/9zov91o/9tnv+sxf+Yuf+Utv+Ir/9xof9wn/+bu/+iv/+Zuv+ErP+jwP+Frf+nwv+lwf+pxP9il/9dk/+Grv9hlv9flf+ux/92o/+mwv+IfHaxAAAAOXRSTlMAHSMjHQr9IxsTB+fMxa9gODQc9fPy2tjLyLCpmIVtbUQfDv318Ovk4+LPzKWgnpqWiHp4TkVAMiyJ1+UAAAABjklEQVQ4y6WUZ1fCMBSGo1C0gyEogqAM996DXTYCbkQkFPX//wlvOmiBekiO7/fnvPfmSYLGwjsXSOb1OLQkeGSfpXX38lu79pBK1YvF3GO3k07n86VyoXDfeNoKn99OAdduuVp9MZAcIF0L8tzMZMLxMYA7en+V5TFkQFpKpXLZQLLZCGcSTqkHCGmpAVKHwaZamoBUDvwGsbj70dNa2taWjtpS+B61VCqiznDSp4FY1h90O3qLifT7IW2205aGVGfsAi2KElUP10UQ+/XzE0h/uOkDxNMC5MdETC82gyl4DXZ3tbSWGV70Foz9aOPLQGSaXYY4hjwqQucFWoYw2SpBaL0ogATRCiD0XmCwAHIBwuAFY0xaWLwAAruwecEinBijlxC7lyjYZ/RyBXeMzYsokJvM5CWGIGcsXoICQQSJ3kvAp7/9fWov3tF/IVF6AcIId9yj8CL6kDU37lleti84NJE7+JP/9LIX8SaRbZJONXOjXKotDgExJL4DCI+YkjhkRpBw0uAQa3j03/wCh2RmQnArmeEAAAAASUVORK5CYII=);
}

.side-fixed-section .fixed-content .txt {
  position: absolute;
  bottom: 5px;
  right: 7px;
  font-size: 12px;
  font-weight: 500;
  text-align: center;
  color: #fff;
  width: 76px;
  height: 27px;
  line-height: 27px;
  background: linear-gradient(0deg, #FE636B, #E0002A);
  border-radius: 14px;
}