.sider-list > li > ul {
  display: none;
}

/* .sider-list > li > ul > li > ul {
  display: none;
} */
/* .sider-list > li.choosed > ul {
  display: block;
} */

.sider-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-right: 25px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  cursor: pointer;
}
.sider-item.first span {
  display: block;
  background-image: linear-gradient(#F787CF, #F787CF);
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 0 1px;
  transition: background-size .3s;
}

.sider-li:not(.choosed) .sider-item.first:hover span {
  color: #F787CF;
  background-size: 100% 1px;
}

.sider-item.first {
  color: rgba(0, 0, 0, 0.8500);
  font-weight: 500;
  font-size: 16px;
  padding: 16px 12px;
  line-height: 1.2;
}

.choosed > .first {
  color: rgba(255, 255, 255, 1);
  background-image: url(../../img/F787CF/sider-list-choosed-bg.png);
  background-size: cover;
  background-repeat: no-repeat;
  font-weight: bold;
}

.sider-item.second {
  color: rgba(0, 0, 0, 0.8500);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.2;
  padding: 16px 12px 16px 16px;
}

.sider-item.second span {
  display: block;
  background-image: linear-gradient(#F787CF, #F787CF);
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 0 1px;
  transition: background-size .3s;
}

.choosed > .sider-item.second span {
  /* background-size: 100% 1px; */
  color: #F787CF;
}

.sider-li:not(.choosed) .sider-item.second:hover span {
  color: #F787CF;
  background-size: 100% 1px;
}

.choosed > .sider-item.second > i {
  color: rgba(247, 135, 207, 0.8);
}

.choosed > .sider-item.thrid > i {
  color: rgba(247, 135, 207, 0.8);
}

.sider-item.thrid {
  color: rgba(0, 0, 0, 0.8500);
  font-weight: 500;
  font-size: 14px;
  /* padding:12px; */
  background-color: rgba(245, 245, 245, 1);
  line-height: 1.2;
  padding: 12px 12px 12px 24px;
}

.choosed > .sider-item.thrid span {
  color: rgba(247, 135, 207, 0.8);
  display: block;
  background-image: linear-gradient(#F787CF,#F787CF);
  background-position: 0 100%;
  background-repeat: no-repeat;
  /* background-size: 100% 1px; */
  transition: background-size .3s;
}

.sider-item.thrid span {
  display: block;
  background-image: linear-gradient(#F787CF,#F787CF);
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 0 1px;
  transition: background-size .3s;
}

/* .sider-item.thrid:hover {
  color: rgba(247, 135, 207, 0.8);
} */

.sider-li:not(.choosed) .sider-item.thrid:hover span {
  color: #F787CF;
  background-size: 100% 1px;
  /* color: rgba(247, 135, 207, 0.8); */
}

.c-white {
  color: rgba(255, 255, 255, 1);
}

.c-black {
  color: rgba(51, 51, 51, 1);
}

.sider-item.fourth {
  color: rgba(0, 0, 0, 0.8500);
  font-weight: 500;
  font-size: 14px;
  line-height: 1.2;
  padding: 12px 12px 12px 30px;

}

.choosed > .sider-item.fourth span {
  color: rgba(247, 135, 207, 0.8);
  display: block;
  background-image: linear-gradient(#F787CF,#F787CF);
  background-position: 0 100%;
  background-repeat: no-repeat;
  /* background-size: 100% 1px; */
  transition: background-size .3s;
}

.sider-item.fourth span {
  display: block;
  background-image: linear-gradient(#F787CF,#F787CF);
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 0 1px;
  transition: background-size .3s;
}

/* .sider-item.thrid:hover {
  color: rgba(247, 135, 207, 0.8);
} */

.sider-li:not(.choosed) .sider-item.fourth:hover span {
  color: #F787CF;
  background-size: 100% 1px;
  /* color: rgba(247, 135, 207, 0.8); */
}

.sider-item.fifth {
  color: rgba(0, 0, 0, 0.8500);
  font-weight: 500;
  font-size: 14px;
  line-height: 1.2;
  padding: 12px 12px 12px 40px;
}

.choosed > .sider-item.fifth span {
  color: #F787CF;
  display: block;
  background-image: linear-gradient(#F787CF,#F787CF);
  background-position: 0 100%;
  background-repeat: no-repeat;
  transition: background-size .3s;
}

.sider-item.fifth span {
  display: block;
  background-image: linear-gradient(#F787CF,#F787CF);
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 0 1px;
  transition: background-size .3s;
}

.sider-li:not(.choosed) .sider-item.fifth:hover span {
  color: #F787CF;
  background-size: 100% 1px;
}