/*
 * 播放popup(.popUpMovie)置中樣式 — 工程端維護, 不屬於任何切版交付檔, 勿被切版整檔覆蓋
 * 使用頁面:
 *   1. PopUpPlayMovie.jsx import(首頁等bundle頁, div#playMovie)
 *   2. movieIntroReact.jsp link(新介紹頁, div#playMovieDiv)
 *   3. monthly_main.jsp link(月租頁, div#playMovieDiv)
 * 註: 舊介紹頁/直播頁用 liveChannel/liveChannelCommon.css 內的同值規則
 */
.popUpMovie {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(27, 27, 27, 0.7);
    z-index: 1005;
    display: none;
}

.popUpMovie .popUpBox {
    background: #1A1A1A;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
    border-radius: 20px;
    width: calc(100% - 32px);
    height: 515px;
    /* padding: 14px 2% 2%; */
    box-sizing: border-box;
    position: fixed;
    left: 16px;
    top: calc((100vh - 515px)/2);
}

@media screen and (min-width: 1024px) {
    .popUpMovie .popUpBox {
        width: 988px;
        left: calc((100% - 988px)/2);
    }
}