.skill-container {
  width: 100%;
  .container {
    width: 1316px;
    text-align: center;

    img {
      width: 100%;
      margin-top: 24px;
      border-radius: 12px;
    }
    .train-list {
      display: flex;
      margin: 24px 0;
      border: 1px solid #177cfa;
      border-radius: 8px;
      .train-item {
        cursor: pointer;
        flex: 0 0 20%;
        height: 58px;
        line-height: 58px;
        border-right: 1px solid #177cfa;
        font-size: 24px;
        font-weight: 500;
        color: #177cfa;
        &:nth-child(5) {
          border-right: 0;
          border-radius: 0 8px 8px 0;
        }
        &:nth-child(1) {
          border-radius: 8px 0 0 8px;
        }

        .active {
          background-color: #177cfa;
        }
      }
      .train-item-active {
        background-color: #177cfa;
        color: #ffffff;
      }
    }
  }
}
