.breakline {
    word-break: break-all;
    white-space: pre-line;
}

.breakline .MathJax {
    display: inline-block !important; 
}

.scrollbar-custom {
  ms-overflow-style: none;  /* Internet Explorer 10+ */
  scrollbar-width: none;  /* Firefox */
}


.scrollbar-custom::-webkit-scrollbar { 
  display: none;  /* Safari and Chrome */
}

.slick-next {
    display: none !important;
}

header .search-field.dissp form{
    display: flex;
    justify-content: space-between;
    width: 100%;
    flex: 0 0 100%;
}

.btnpage.btnorg a, .btnpage.btnorg button {
    width: 100%;
}

.blockMainQuestion .btnpage button {
    display: block;
    width: 100%;
}

.blockMainQuiz .blockAnswer-image img {
    height: 100%;
    width: 100%;
    min-height: auto;
}
 

html {
    overflow-x: inherit !important;
}

.slick-dots {
    bottom: auto;
}

.slick-slide {
    height: auto;
}

.pagination ul li.active {
    background-color: #1673A1;
    color: white;
}

.pagination ul li a {
    width: 100%;
    text-align: center;
}

.p-news .news-list dl a:hover {
    text-decoration: underline;
    color: #1673A1;
}

.alert-error .content{
    color: #842029;
    background-color: #f8d7da;
    border-color: #f5c2c7;
    position: relative;
    padding: 1rem 1rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 0.25rem;
}

.alert-succeed .content{
    color: #0f5132;
    background-color: #d1e7dd;
    border-color: #badbcc;
     position: relative;
    padding: 1rem 1rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 0.25rem;
}

.alert-error .content a.close, .alert-succeed .content a.close {
    float: right;
    font-size: 18px;
    font-weight: bold;
}

.alert-error .content li, .alert-succeed .content li {
    list-style-type: none;
    text-align: left;
}


.header .user-info {
    height: 100%;
}

.header .user-info .dropdown-content {
    top: -117px;
}

.movie-page .blockVideo #myVideo  {
    width: 100%;
    height: 350px;
}

.movie-page .blockVideo #myVideo  iframe {
    width: 100%;
    height: 100%;
}

.movie-page .blockVideo .video:nth-child(6n) { 
    margin-right: auto !important; 
}

.p-mypage .sliderNews .sliderItem .images, .p-top .sliderNews .sliderItem .images {
    width: 300px;
    height: 250px;
}

.sliderNews .sliderItem .images {
/*    width: 300px;*/
    margin: 0 auto;
}

.p-explainmovie .blockExplain .blockimage .image {
    max-width: 470px;
    height: auto;
    max-height: 300px;
}

.p-explainmovie .blockExplain .blockimage .image img {
    width: 100%;
    object-fit: inherit !important;
}

.p-explainmovie .blockRelatedCourse .sliderItem {
    height: 300px;
}

.p-explainmovie .blockRelatedCourse .sliderItem p.title {
    max-width: 300px;
    margin-top: 10px;
}

.p-explainmovie .blockRelatedCourse .sliderItem .images {
    max-width: 300px;
    height: 200px;
    margin: 0 auto;
}

.p-explainmovie .blockRelatedCourse .sliderItem .images img {
    width: 100%;
    height: 100%;
}

/*.movie-page .blockVideo dl .block-text .txt {
    padding: 30px;
}*/


.p-search .form_submit {
    padding: 40px 45px;
}

.movie-page .blockVideo .images.learning {
    border: 2px solid red;
}

.movie-page .blockVideo .images {
    max-height: 180px !important;
    position: relative;
}

.movie-page .blockVideo .images.learned .overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 10;
    background-color: black;
    opacity: 0.4;
}

.movie-page .blockVideo .sliderItem .box-e {
    height: 200px;
}

.p-search .blockVideo-list .images {
    /*height: 150px;*/
/*    min-height: 200px;
    max-height: 250px;*/
}

.p-search .blockVideo-list .images img {
    /* height: 100%; */
    width: 100%;
}
.p-explainmovie .blockVoice .voice {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.p-explainmovie .blockVoice .voice .images {
    flex: 0 0 50%;
}

.p-explainmovie .blockVoice .voice .images img {
    padding: 20px;
    width: 100%;
    height: auto;
}

.blockMainQuiz .blockAnswer-image {
    height: auto;
    max-width: 500px;
}

.blockMainQuiz .blockQuestion dt {
    flex: 0 0 110px;
}

.blockMainQuiz .blockQuestion dt.correct {
    background: blue;
    /* background: #70AF85; */
}

.blockMainQuiz .blockQuestion dt.fail {
    /* background: #D45D79; */
    background: red;
}

.blockMainQuiz .blockQuestion dt.non {
    background: #595656;
}

.p-explainmovie .blockExplain .blockimage .boxprice dd {
    color: #fff;
}

.movie-page .blockVideo #like {
    cursor: pointer;
}

.page-search .sortselect button.active, 
.page-category .sortselect button.active {
    background-color: oldlace;
}

.page-search .sort.flexbox, .page-category .sort.flexbox {
    width: 600px;
    justify-content: center;
}

.page-search .sort .sortselect, .page-category .sort .sortselect {
    width: 35%;
    margin-right: 10px;
}

.page-search .sort .clearsearch button, .page-category .sort .clearsearch button
{
    width: 150px;
    color: #fff;
    font-weight: bold;
    text-align: center;
    background: #fff;
    padding: 10px;
    border-radius: 5px;
    position: relative;
    height: 44px;
    background-color: #1673A1;
}
 
.page-category .blockVideo-list {
    flex-wrap: wrap;
}

.page-category .blockVideo-list .sliderItem  {
  flex: 0 0 31%;
  margin-top: 2%;
}

.page-category .blockVideo-list .sliderItem .images {
    width: 100%;
}

.select-payment .selectMovieSet.select {
    border: 1px solid red;
}

.p-explainmovie .blockExplain .left {
    min-height: 600px;
    width: 50%;
    padding: 10px;
}

.p-explainmovie .blockExplain .right {
     width: 50%;
}


.p-explainmovie .blockExplain {
    column-count: auto;
    display: flex;
}

.p-explainmovie .blockExplain .blockinfo dl ul li {
    margin-right: 10px;
    flex: auto;
}



.blockAnswerInfo {
    max-width: 600px;
}

.blockAnswerInfo ul {
    justify-content: initial;
    flex-wrap: wrap;
    justify-content: space-between;
}

.blockAnswerInfo ul li {
    width: 39%;
    margin-bottom: 10px;
   justify-content: left;
}

#popupWithdraw h2 {
    font-size: 20px;
}

#popupWithdraw .flexbox .btnpage  {
    width: 45%;
}

#popupWithdraw .flexbox .btnpage a, #popupWithdraw .flexbox .btnpage button {
    width: 100%;
}

.page-register .tableStep02 .tbstyle td:last-child {
    word-break: break-all;
}

.p-news .news-related .btnlink {
    min-width: 360px;
    max-width: 360px;
}
.p-news .news-related .btnlink  a {
    min-height: 115px;
}

.blockMainQuiz .blockAnswer-list .img-answer {
    max-width: 150px;
    margin-left: 50px;
}

.blockMainQuiz .blockHead {
    position: relative;
}

.blockMainQuiz .blockHead .countdown {
    right: 10%;
    position: absolute;
    font-size: 20px;
    text-align: center;
}

.blockMainQuiz .blockHead .countdown p { 
    font-size: 25px;
}

.blockMainQuiz .blockHead .countdown span {
    font-weight: bold;
}

.select-payment .blockVideo .image {
    width: 100%;
    height: auto;
}

.select-payment .blockVideo .image img {
    max-height: 100%;
}


.p-top .news .flexbox {
    position: relative;
}

.p-top .news .formembers {
    position: absolute;
    right: 0;

}

.p-top .formembers{
    color: #1673A1;
    border: 1px solid #1673A1;
    border-radius: 3px;
    background: url(/web/images/ico-user2.svg) no-repeat left 10px center;
    padding: 5px 10px;
    padding-left: 30px;
    min-width: 102px;
    font-size: 16px;
}

.page-register .tableStep02 .tbstyle th {
    text-align: center;
}

#popupNews .modal-content {
    padding: 35px 50px;
    max-width: 650px;
    min-height: 450px;
    position: absolute;
    width: 70%;
    max-height: 500px;
    overflow-y: auto;
}


#popupNews .modal-content .closeNews {
    position: absolute;
    right: 5px;
    top: 5px;
    width: 12px;
    background-color: transparent;
    height: 15px;
}

#popupNews .modal-content .header {
    font-size: 20px;
    width: 70%;
    margin: 0 auto;
}

#popupNews .modal-content .header  h2 {
    color: red;
    border: 1px solid #000;
    padding: 5px;
}

#popupNews .modal-content .titlepage {
    margin: 20px 0;
    display: flex;
    justify-content: center;
}

#popupNews .modal-content .titlepage p {
    display: flex;
    font-size: 17px;
    font-weight: bold;
}

#popupNews .modal-content .titlepage p span {
    margin-right: 20px;
}

.blockRegistered table .btnpage {
    margin-left: 0;
}

.select-payment .blockTablePaymentInfo h3 {
    font-size: 22px;
    text-align: center;
}

.img-eye img {
    margin-top: -2px;
}

.select-payment .blockVideo .blockVideo-list {
    flex-wrap: wrap;
    justify-content: space-between;
}

.select-payment .blockVideo  .blockVideo-list .video {
    margin-right: auto;
    margin-top: 10px;
    width: 32%;
}

.movie-page .blockVideo .star .img-eye {
    display: flex;
    justify-content: center;
    align-items: center;
}


.movie-page .blockVideo .blockVideo-list a {
    width: 32%;
    margin: 5px;
}

.p-mypage .blockTablePaymentInfo table th {
    width: 35%;
}

.tb_logobig_c {
    z-index: 0;
}

.select-payment .blockVideo dl .block-text .txt {
    height: 260px;
}

.blockMainQuiz .blockHead-tit {
    width: 35%;
    word-break: break-all;
    margin-right: 30px;
}

#myContents {
    display: flex;
    margin: 0 auto;
    font-size: 20px;
    flex-wrap: wrap;
    text-align: center;
}

#myContents .listcontent-item {
    list-style: none;
    width: 50%;
    padding: 5px;
}

#myContents .listcontent-item  .txt {
    text-decoration: underline;
    color: #187d9d;
    padding: 5px 10px;
}

#myContents .listcontent-item a.active .txt {
    color: #1673A1;
    background-color: #ccc;
}

.p-mypage .movie-page .blockVideo dl .block-text .block {
    width: 450px;
    border-top: none;
}

.p-mypage  .movie-page .blockVideo dl .block-text .button {
    display: flex;
    margin: 0 auto;
}

.p-mypage  .movie-page .titheadblue {
    margin-bottom: 0;
}

.p-test .commentary {
    margin: 30px 0;
}

.p-test .commentary p, .p-test .commentary .image {
    width: 50%;
}


.p-test .commentary .image img {
    display: block;
    margin: 0 auto;
    padding: 12px;
}

.select-payment .blockTablePaymentInfo .blockLine {
    margin-bottom: 30px;
}

.select-payment .blockTablePaymentInfo .blockLine  .nopayment {
    width: 150px;
    color: #fff;
    font-weight: bold;
    text-align: center;
    background: #fff;
    padding: 10px;
    border-radius: 5px;
    position: relative;
    height: 44px;
    background-color: #FFB677;;
    display: block;
    margin: 0 auto;
}

.p-top .listinfo .sliderItem .txtprice {
    font-size: 16px;
    color: #1673A1;
    font-weight: bold;
}

.p-top .listinfo .sliderItem span {
    text-decoration: line-through;
}

.commentary_images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
}

.commentary_images .image {
    flex: 0 0 40%;
}

.commentary_images .image img {
    width: 100%;
    /* max-height: 300px; */
}

.blockSection .btn-reset {
    max-width: 200px;
    margin-bottom: 20px;
    margin-left: 0;
    margin-top: 10px;
}

.blockSection .btn-reset button {
    text-align: center;
    font-size: 20px;
    min-height: 50px;
    color: #fff;
    position: relative;
    background-color: #1673A1;
    border-radius: 5px;
    display: flex;
}

.blockMainQuiz .blockAnswer {
    margin-bottom: 10px;
}

.blockQuestion .image_attachs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
}

.blockQuestion  .image_attachs .image_attach {
    flex: 0 0 25%;
}

.blockQuestion  .image_attachs .image_attach img {
    padding: 10px;
    width: 100%;
    max-height: 300px;
}

.p-search .blockVideo-list .video 
{
    margin-top: 10px;
    margin-bottom: 2.5%;
    align-self: stretch;
}


@media all and (max-width: 768px) 
{   
    .p-explainmovie .blockExplain .blockimage .image img {
        height: auto;
    }

    .p-mypage .movie-page .blockVideo dl .block-text .block {
        width: 350px;
    }

    .blockAnswerInfo ul li { 
        width: 43%;
    }

    .movie-page .blockVideo .blockVideo-list a {
        width: 48%
    }

    .select-payment .blockVideo  .blockVideo-list .video {
        width: 48%;
        flex: 0 0 48%;
    }

    #popupNews .modal-content {
        width: 90%;
    }

    .movie-page .blockVideo .blockVideo-list a {
        margin: 0 auto;
    }

    .movie-page .blockVideo #myVideo  {
        height: 250px;
    }

    #popupNews .modal-content .titlepage p {
        display: block;
    }
    .transaction_law .tbstyle {
         margin-left: 0 !important;
    }

    .transaction_law .tbstyle td {
        text-align: center;
    }

    .select-payment .blockVideo .image {
        width: 350px;
        height: auto;
        margin: 0 auto;
    }

    .page-search .sort.flexbox, .page-category .sort.flexbox {
        width: auto;
    }
    .page-search .sort.flexbox .sort-bydate  , .page-category .sort.flexbox .sort-bydate  {
        margin: 10px;
    }

    .blockMainQuiz .blockHead .countdown {
        top: 0;
    }
    .blockMainQuiz .blockHead .countdown p {
        font-size: 20px;
    }

    .p-top .news .formembers {
        top: 10%;
    }

    .p-explainmovie .blockExplain .left {
        min-height: auto;
    }

    .p-explainmovie .blockExplain .left, .p-explainmovie .blockExplain .right { 
        width: 48%;
    }
}

@media all and (max-width: 560px) 
{
    .p-explainmovie .blockVoice .voice .images {
        flex: 0 0 100%;
    }

    #myContents .listcontent-item {
        width: 100%;
    }

    .p-test .commentary p, .p-test .commentary .image {
        width: 100%;
    }

    .blockMainQuiz .blockHead-tit {
        width: 300px;
        font-size: 20px;
    }
    .blockMainQuiz .blockHead .countdown span {
        font-size: 20px;
    }

    .select-payment .blockVideo  .blockVideo-list .video {
        width: 100%;
        flex: 0 0 100%;
    }

    .movie-page .blockVideo .blockVideo-list a {
        width: 90%;
    }

     #popupNews .modal-content {
        width: 80%;
    }

    .movie-page .blockVideo .button-star {
        padding: 7px 10px;
    }

    .select-payment .blockVideo .image {
        width: 250px;
        height: auto;
        margin: 0 auto;
    }

    .p-explainmovie .blockExplain .left, .p-explainmovie .blockExplain .right { 
        width: 100%;
    }

    .blockMainQuiz .blockHead-info p.notice {
        font-size: 12px;
    }
}

@media all and (max-width: 375px) 
{
    .blockMainQuiz .blockHead-tit {
        width: 220px;
        font-size: 17px;
    }
    .blockMainQuiz .blockHead .countdown span {
        font-size: 17px;
    }

    .blockAnswerInfo ul li { 
        width: 42%;
        font-size: 13px;
    }

    .select-payment .blockVideo  .blockVideo-list .video {
        width: 100%;
    }

    header .search-field input {
        width: 145px;
    }

    .blockMainQuiz .blockHead-info p.notice {
        font-size: 11px;
    }
}

.icons-header {
    width: max-content;
}

header .header_top_logo img {
    width: 100px;
}

@media (max-width: 768px) {
    header .header_top_logo img {
        width: 80px;
    }

    header .header_top_logo {
        min-width: inherit;
    }
}

.header_top_menu {
    height: 20px !important;
}