弹层-滚动条

要求：弹出框出现，弹出框的内容滚动，但是dom层不随着弹出框的滚动而滚动，在弹层上滚动时整个页面也不滚动

<section class="father">
    <section class="content-body">

    </section>
    <section class="layout">

    </section>
    <section class="layout-body">

    </section>
</section>

.father{
    height: 533px;
    overflow-y: scroll;
    //页面高度设置为屏幕高度，正常情况下超出滚动
}

.content-body{
    height: 533px;
    overflow-y: scroll;//内容高度设置为屏幕高度，正常情况下超出滚动
}

.layout{
    height: 100%;
    width: 100%;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    overflow: hidden;
    z-index: 1000000;
}

.layout-body{
    height: 50%;
    width: 100%;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    overflow: hidden;
    z-index: 1000001;
}