JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Блок с тенью</title>


</head>

<body>

<div class="block2">
    
    <div class="wrapper">
        <div class="h">Заголовок</div>
        <div class="line"></div>
    </div>
    
    <div class="content">Содержание блока</div>
    
</div>

</body>
</html>

CSS

.block2 {
    float: left; 
    width: 100%;
    
    font: 14px Arial, Helvetica, sans-serif;
    }

.h, .content {
    background: #c9e39c;
    border: 1px solid #a3d869;
    
    box-shadow: 0 0 7px #808080;
    }

.wrapper {
    float: left;
    max-width: 250px; 
    overflow: hidden; 
    margin: -7px -7px -1px;    
    padding: 7px 7px 0;     
    }

.h {    
    float: left;
    margin-bottom: -10px;
    padding: 5px 10px 13px;
    z-index: 1;
    
    font-size: 17px;
    font-weight: bold;
    border-radius: 7px 7px 0 0;
    }

.line {
    position: relative; 
    z-index: 1;
    clear: both;
    height:1px;  
    margin: 0 -10px 0 1px;    
    
    border-right: 10px solid #a3d869; 
    }

.content {
    clear: both;
    padding: 10px;
    min-height: 100px;
    
    border-radius: 0 0 7px 7px;
    }