body {
    padding-top: 57px;
}

.sns-button {
    width: 95%;
}

#search-term {
    width: 18rem;
}

.language-button {
    margin-left: 1rem;
}

.dlg-btn-language {
    color: #333;
}

#player {
    width: 100%;
}

.video-area {
    padding-right: 0;
}

.video-cover {
    -webkit-overflow-scrolling: touch;
}

.video-contents {
    padding-right: 15px;
    overflow-y: scroll;
}

.subtitle-area {
    padding-right: 0;
}

.subtitle-cover {
    -webkit-overflow-scrolling: touch;
}

.subtitle-contents {
    padding-right: 15px;
    overflow-y: scroll;
}

.subtitle {
    padding-top: 0.3rem;
}

.subtitle2 {
    padding-top: 0.3rem;
    width:86%;
}

.subtitle_left {
    float:left;
    width:86%;
}

.subtitle_right {
    float:right;
    width:14%;
    text-align:center;
}

.content_1:hover {
    color: #0044CC;
}

.subtitleIndex, .startTime, .duration {
    display: none;
}

.player-relative {
    position: relative;
}

.player-absolute {
    position: absolute;
    right: 15px;
    bottom: 0;
    padding: 0 0.4em;
    color: #eee;
    background: rgba(0,0,0,.6);
    font-weight: bold;
    border-radius: 5px;
}

.control-area {
}

h1 {
    font-size: 1.375rem;
}

h5 {
    position:relative;
    border-left: 6px solid #3498db;
    padding: .25em 0 .5em .75em;
}

.navbar-align {
    justify-content:flex-start !important;
}

.transcript {
    font-size: 1.125rem;
}

.modal-title {
    font-size: 20px;
    font-weight: 500;
}

@media (max-width: 575.98px) {
}

@media (max-width: 767.98px) {
    .sns-button {
        width: 100%;
    }

    #player {
        width: 100%;
    }

    .video-area {
        padding-left: 0;
        padding-right: 0;
    }

    .video-cover {
        -webkit-overflow-scrolling: touch;
    }

    .video-contents {
        padding-right: 0;
        overflow-y: hidden;
    }

    .subtitle-area {
    }

    .subtitle-cover {
            -webkit-overflow-scrolling: touch;
    }

    .subtitle-contents {
        padding-right: 15px;
        overflow-y: auto;
    }

    .control-area {
    }

    .transcript {
        font-size: 0.875rem;
    }
}

@media (max-width: 991.98px) {
    #search-term {
        width: 12rem;
    }

    .language-button {
        margin-left: 0;
    }
}

@media (max-width: 1199.98px) {
}