JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box">
  <h1>Title</h1>
  <h2>Sub-title</h2>
  <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. </p>
<img src="https://img.icons8.com/officel/80/000000/minecraft-main-character.png"/>
</div>

CSS

body {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}
.box {
  padding: 20px;
  border: 2px solid black;
  border-top: unset;border-bottom:unset;
  position: relative;
  width: 800px;
}

.box img {
  position:absolute;
  width: 280px;
  height: 340px;
  right: 0;
  top: -40px;
}
.box:before {
  content:'';
  width: 100%;
  height: 2px;
  background: black;
  position: absolute;
  top: 0;
  left: 0;
}
.box:after {
  content:'';
  width: 100%;
  height: 2px;
  background: black;
  position: absolute;
  bottom: 0;
  left: 0;
}