.box {
  width:150px;
  height:200px;
  border:15px solid transparent; /* control the offset of the lines */
  outline:2px solid #000; /* adjust the 2px here */
  outline-offset:-10px; /* control the offset of the rectangle */
  background:
    linear-gradient(#000 0 0) top,
    linear-gradient(#000 0 0) left,
    linear-gradient(#000 0 0) bottom,
    linear-gradient(#000 0 0) right;
  background-size:200% 2px,2px 200%; /* adjust the 2px here */
  background-origin:padding-box;
  background-repeat:no-repeat;
}

<div class="box"></div>

.box {
  --c:red;   /* color */
  --b:2px;   /* thickness of lines */
  --o1:15px; /* offest of lines*/
  --o2:10px; /* offset of rectangle */
  
  width:150px;
  height:200px;
  box-sizing:border-box;
  display:inline-block;
  border:var(--o1) solid transparent; 
  outline:var(--b) solid var(--c); 
  outline-offset:calc(-1*var(--o2));
  background:
    linear-gradient(var(--c) 0 0) top,
    linear-gradient(var(--c) 0 0) left,
    linear-gradient(var(--c) 0 0) bottom,
    linear-gradient(var(--c) 0 0) right;
  background-size:200% var(--b),var(--b) 200%; 
  background-origin:padding-box;
  background-repeat:no-repeat;
}

<div class="box"></div>
<div class="box" style="--c:green;--b:1px;--o1:20px;"></div>
<div class="box" style="--c:blue;--b:4px;--o1:40px;--o2:20px;"></div>
<div class="box" style="--c:#000;--b:1px;--o1:10px;--o2:0;"></div>

body {
  margin:0;
  padding:0;
}

.artdeco {
   position: relative;
   margin:20px;
   padding:20px;
   border:2px solid black;
   min-height:300px;
}

.artdeco:before {
   content:'';
   position: absolute;
   top:-20px;
   bottom:-20px;
   left:10px;
   right:10px;
   border-left: 2px solid black;
   border-right: 2px solid black;
}

.artdeco:after {
   content:'';
   position: absolute;
   top:10px;
   bottom:10px;
   left:-20px;
   right:-20px;
   border-top: 2px solid black;
   border-bottom: 2px solid black;
}

<div class="artdeco"></div>