jQueryモーダルボタンがスクロールバーの背後に隠されています

jQueryポップアップモーダルにスクロールバーを追加しました。誰かがスクロールバーの前にボタンを前進させる方法を説明できますか？前もって感謝します。jQueryモーダルボタンがスクロールバーの背後に隠されています

前：

後：

のCss：

/* Close Button */ 
.popup-close { 
    width:30px; 
    height:30px; 
    padding-top:4px; 
    display:inline-block; 
    position:absolute; 
    top:0px; 
    right:0px; 
    transition:ease 0.25s all; 
    -webkit-transform:translate(50%, -50%); 
    transform:translate(50%, -50%); 
    border-radius:1000px; 
    background:rgba(0,0,0,0.8); 
    font-family:Arial, Sans-Serif; 
    font-size:20px; 
    text-align:center; 
    line-height:100%; 
    color:#fff;; 
} 

.popup-close:hover { 
    -webkit-transform:translate(50%, -50%) rotate(180deg); 
    transform:translate(50%, -50%) rotate(180deg); 
    background:rgba(0,0,0,1); 
    text-decoration:none; 
} 

.popup-inner { 
    color: black; 
    height: 500px; 
    overflow-y: auto; 
    overflow-x: hidden; 
    position: fixed; 
}

HTML：

<div class="popup" data-popup="popup-1"> 

    <div class="popup-inner"> 

     <p> content</p> 

     <p><a data-popup-close="popup-1" href="#">Close</a></p> 
     <a class="popup-close" data-popup-close="popup-1" href="#">x</a> 
    </div> 
</div>

出典

2017-04-17 Jordan Wood