*{margin:0;padding:0;box-sizing: border-box;}
.cs-left{
  width:50vw;
  height: 50vh;
  border:1px solid #ddd;
  margin: 25vh auto 0;
    position: relative;
}
.cs-left .bottom,
.cs-left .top{
  position: absolute;
  top:-1px;
  left:-1px;
  right:-1px;
}
.cs-left .bottom{
  bottom:-1px;
  top:auto;
}
  .cs-left .bottom::before,
.cs-left .bottom::after,
.cs-left .top::before,
.cs-left .top::after{
  content: '';
  position: absolute;
  left:0;
  top:0;
  width: 10px;
  height: 10px;
  border:solid #000;
  border-width: 2px 0 0 2px;
}
.cs-left .bottom::after,
.cs-left .top::after{
  left:auto;
  right:0;
  border-width: 2px 2px 0 0;
}
.cs-left .bottom::before{
  top:auto;
  bottom:0;
  border-width: 0 0 2px 2px;
}
.cs-left .bottom::after{
  top:auto;
  bottom:0;
  border-width:0 2px 2px 0;
}