不规则阴影

<div class="box-layout">
    <div class="box1"></div>
    <div class="box2"></div>
</div>

.box-layout {
    position: relative;

    .box1{
        width: 60px;
        height: 40px;
        background: #84ffcf;
        border-radius: 15px 15px 0 0;
        margin-left: 50px;
        box-shadow: -2px -1px 0px -1px #a2a2a2, //左边阴影
        0px -2px 0px -1px #a2a2a2, //顶部阴影
        2px 0 0px -1px #a2a2a2; //右边阴影
        // 0 2px 3px -1px red, //底部阴影
        position: absolute;
        top: -38px;
        z-index: 99;
    }

    .box2{
        width: 220px;
        height: 180px;
        background: #84ffcf;
        border-radius: 10px;
        box-shadow: 0 1px 3px 0 #333333;
    }
}