/* packageE/community_buying/components/floatBtn/floatBtn.wxss */

@import "/mycss/stylesheet.wxss";
@import "/mycss/iconfont.wxss";

.container {
  position: fixed;
  left: 1.6rem;
  bottom: 5rem;
  width: 2.813rem;
  height: 2.813rem;
  border-radius: 50%;
}

.container .floatBtn {
  width: 2.813rem;
  height: 2.813rem;
  border-radius: 50%;
  position: relative;
}

.container .floatBtn .my {
  width: 2.813rem;
  height: 2.813rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  font-size: 0.688rem;
  color: #fff;
  position: relative;
  z-index: 2;
  border-radius: 50%;
  background-color: #f14e4e;
  box-shadow:
    0 0.094rem 0.219rem 0
    rgba(131, 131, 131, 0.59);
  transition: 0.5s;
}

.container .floatBtn .my.close {
  transform: rotate(720deg) scale(0.7);
}

.container .floatBtn .cc {
  position: absolute;
  left: 0;
  top: 0;
  width: 2.813rem;
  height: 2.813rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  font-size: 0.688rem;
  color: #fff;
  background-color: #f14e4e;
  transition: 0.5s;
}

.container .floatBtn .ccs {
  box-shadow:
    0 0.094rem 0.219rem 0
    rgba(255, 255, 255, 0.2);
}

.container .floatBtn .c1 {
  top: -4rem;
}

.container .floatBtn .c2 {
  top: -8rem;
}

.container .floatBtn .c3 {
  top: -12rem;
}

.container .floatBtn .c4 {
  top: -16rem;
}