.index_con {
  width: 100vw;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #E8F7FF;

  .contentWrap {
    width: 800px;
    height: 500px;
    border: 2px solid #999;

    .title {
      padding: 20px;
      border-bottom: 2px solid #999;
    }

    .content {
      display: flex;
      align-items: center;
      justify-content: space-between;

      .cleft{
        margin-top:20px;
        margin-left:10px;
        width:500px;
        height:400px;
        background-color:#000;
      }
    }
  }
}

.item_warp {
  width: 200px;
  height: 200px;
  display: flex;
  align-content: center;
  justify-content: center;
  flex-wrap: wrap;
  cursor: pointer;

  &:hover {
    color: red;
  }

  :nth-child(2) {
    width: 100%;
    text-align: center;
    margin-top: 10px;
  }
}

.img {
  width: 52px;
  height: 52px;
  background-color: saddlebrown;
}