.l-popup {
    height: 600px;
    width: 700px;
    max-width: 80%;
    max-height: 80%;
    min-height: 300px;
    margin: auto;
    padding: 20px 30px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
}

.fadingPanel {
    background-color: #023f67;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 100;
    display: none;
}

.fadingPanel_open {
    opacity: .5;
    display: block;
}

.popup-fade {
    z-index: 101;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.l-popup {
    height: 600px;
    width: 700px;
    max-width: 80%;
    max-height: 80%;
    min-height: 300px;
    margin: auto;
    padding: 20px 30px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
}

.fadingPanel {
    background-color: #023f67;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 100;
    visibility: hidden;
    transition: visibility 0, opacity 0.1s;
}

.fadingPanel_open {
    opacity: .5;
    visibility: visible;
    transition: visibility 0, opacity 0.1s;
}

.popup-fade {
    z-index: 101;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

Add transition to fading mask.
Add transition to fading mask.
