@charset "UTF-8";

* {
  margin: 0;
  padding: 0
}

ul,
ol {
  list-style: none
}

.select_box {
  position: relative;
  background-color: #fff;
  border-radius: 4px;
  box-sizing: border-box;
  vertical-align: middle;
  color: #515a6e;
  font-size: 14px;
  line-height: normal;
  flex: 1;
}

.select_box_active {
  border-color: #57a3f3;
  outline: 0;
  -webkit-box-shadow: 0 0 0 2px rgb(45 140 240 / 20%);
  box-shadow: 0 0 0 2px rgb(45 140 240 / 20%);
}

.select,
.selectTwo {
  display: flex;
  align-items: center;
  width: 100%;
  height: 40px;
  /* padding: 5px 10px; */
  /* border: 1px solid #dedede; */
}

.select:hover,
.selectTwo:hover {
  cursor: pointer;
}

.select input,
.selectTwo input {
  display: inline-block;
  height: 32px;
  line-height: 32px;
  font-size: 14px;
  outline: 0;
  border: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #515a6e;
  background-color: transparent;
  position: relative;
  cursor: pointer;
  padding: 0 24px 0 8px;
  width: 100%;
}

.list,
.listTwo {
  /* display: none; */
  position: absolute;
  top: 39px;
  z-index: 900;
  width: 100%;
  border: 1px solid #dedede;
  /* border-top: none; */

  max-height: 220px;
  overflow: auto;
  margin: 5px 0;
  padding: 5px 0;
  background-color: #fff;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 6px rgb(0 0 0 / 20%);
  box-shadow: 0 1px 6px rgb(0 0 0 / 20%);
  will-change: max-height;
}

.list li,
.listTwo li {
  padding: 7px 16px 8px;
  font-size: 14px !important;
  color: #515a6e;
}

.active-li {
  background: #f3f3f3 !important;
  color: #2d8cf0 !important;
}

.sub-comments-leave-active,
.sub-comments-enter-active {
  transition: all 0.25s ease-in-out;
}

.sub-comments-enter,
.sub-comments-leave-to {
  max-height: 0;
  opacity: 0;
}

.sub-comments-enter-to,
.sub-comments-leave {
  max-height: 220px;
  opacity: 1;
}


/* 剪头图标 */
.an-arrow {
  width: 9px;
  height: 9px;
  border-bottom: 2px solid #808695;
  border-right: 2px solid #808695;
  transform: rotate(45deg);
  margin-bottom: 4px;
  position: absolute;
  right: 9px;
  transition: all .25s ease-in-out;
}

.an-arrow-active {
  transform: translateY(50%) rotate(225deg);
}

/* .box:focus {
  border-color: rgb(4, 110, 184);
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(4, 110, 184, 8);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(4, 110, 184, 8);
} */

/* 清除默认样式 */

.box::-webkit-input-placeholder {
  position: relative;
  top: 2px;
  cursor: pointer;
  font-size: 16px;
}

.boxTwo::-webkit-input-placeholder {
  position: relative;
  top: 2px;
  cursor: pointer;
  font-size: 16px;
}