.index_info_container {
  .search_container {
    width: 214px;
    min-height: 200px;
    position: absolute;
    top: 100px;
    left: 480px;
    background: rgba(0, 41, 82, 0.68);
    border-radius: 4px;
    border: 1px solid rgba(44, 105, 172, 0.6);

    .top {
      width: 214px;
      height: 37px;
      background-size: 100% 100%;
      display: flex;
      padding: 5px;
      position: relative;

      .list {
        color: #ffffff;
        padding: 2px 8px;
        cursor: pointer;

        &:hover {
          border-radius: 2px;
          background-color: rgba(36, 115, 239, 0.549);
          box-shadow: 0 1px 1px 0 rgba(2, 32, 95, 0.4);
        }
      }

      .active {
        border-radius: 2px;
        background-color: rgba(36, 115, 239, 0.549);
        box-shadow: 0 1px 1px 0 rgba(2, 32, 95, 0.4);
      }

      .close {
        position: absolute;
        top: 5px;
        right: 10px;
        cursor: pointer;
      }
    }

    .search_con {
      background: rgba(5, 40, 106, 0.68);
      height: 30px;
      border: 1px solid rgba(23, 86, 168, 0.68);
      margin: 5px;
      border-radius: 4px;
      color: #4371af;
      line-height: 30px;
      padding-left: 5px;


      .input {
        border: none;
        background: none;
        width: 100%;
        height: 30px;
        outline: none;
        color: #ffffff;

        &::-webkit-input-placeholder {
          color: #4371af;
        }
      }

    }

    .con {
      width: 100%;

      .item {
        width: 100%;
        display: flex;
        justify-content: space-between;

        color: #ffffff;
        padding: 5px;
        box-sizing: border-box;
        border-bottom: 1px dashed #205376;
        align-items: center;

        .btn {
          border-radius: 4px;
          background-color: rgba(36, 115, 239, 0.2);
          padding: 2px 5px;
          border: 1px solid rgba(42, 86, 158, 0.58);
          cursor: pointer;
        }
      }
    }
  }
}
