body {

}

.display_course_menu_section {
    width: 100%;
}

.bar_bg_1 {
    height: 78px;
    width: 100%;
    background-color: #00365C;
    position: absolute;
    z-index: 0;
}

.nav_bar_bottom {
    background-color: #00365C;
    height: 52px;
    width: 100%;
    position: absolute;
    bottom: 0px;
}

.bar_bg_1 .title_page {
    font-size: 20px;
    color: #F89938;
    position: absolute;
    left: 0px;
    top: 24px;
}

.sub_menu_link_section {
    position: absolute;
    color: #FFFFFF;
    font-size: 12px;
    right: 0px;
    top: 12px;
}

.course_menu_link .caption {
    bottom: 0px;
    font-size: 14px;
    position: absolute;
    text-align: center;
    width: 90%;
    margin-left: 5%;
}

.nav_bar_bottom .caption {
    font-size: 14px;
    color: #FFFFFF;
    position: absolute;
    left: 0px;
    top: calc(50% - (18px / 2));
}

.txt_orange {
    color: #F79838;
}

.main_box_content {
    width: 100%;
    /* height: calc(100vh - (52px + 78px)); */
    position: absolute;
    top: 78px;
}

.caption a:hover {
    color: #D21C5B;
}

.txt_t1 {
    position: absolute;
    font-size: 12px;
    line-height: 20px;
    top: 0px;
    width: 328px;
    color: #1C3664;
}

.bg_txt_t2 {
    position: absolute;
    top: 84px;
    left: -28px;
    width: 300px;
}

.txt_t2 {
    position: absolute;
    font-size: 12px;
    line-height: 20px;
    top: 118px;
    width: 228px;
    color: #1C3664;
}

.txt_t3 {
    position: absolute;
    font-size: 12px;
    line-height: 20px;
    top: 250px;
    width: 240px;
    color: #1C3664;
}

.txt_t4 {
    color: #9A3366;
    font-size: 12px;
    font-style: italic;
    position: absolute;
    bottom: 0px;
    right: 256px;
}

.M_intro {
    position: absolute;
    right: 84px;
    top: 0px;
    height: 95%;
}

.M_intro_ask {
    position: absolute;
    right: 55%;
    bottom: 5%;
    height: 65%;
}

.reset_submit_section {
    width: 174px;
    height: 40px;
    position: absolute;
    right: 12px;
    bottom: 12px;
}

.reset_btn {
    position: absolute;
    height: 100%;
    left: 0px;
    cursor: pointer;
}

.submit_btn {
    position: absolute;
    height: 100%;
    right: 0px;
    cursor: pointer;
}



.popup_box {
    width: 264px;
    height: 164px;
    position: absolute;
    line-height: 14px;
}

.popup_box .txt_box {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding: 16px 18px;
    position: absolute;
    top: 0px;
    left: 0px;
    font-size: 12px;
    color: #1C3664;
}

.popup_box_2 {
    width: 306px;
    height: 166px;
    position: absolute;
    top: 230px;
    left: 60px;
    z-index: 5;
}

.popup_box_2 .txt_box {
    width: 90%;
    height: 100%;
    box-sizing: border-box;
    padding: 36px 44px;
    position: absolute;
    top: 0px;
    left: 0px;
    font-size: 12px;
    color: #DD6226;
}

.popup_box_3 {
    width: 390px;
    /* height: 166px; */
    position: absolute;
    top: 220px;
    left: -16px;
    z-index: 5;
}

.popup_box_3 .txt_box {
    width: 90%;
    height: 100%;
    box-sizing: border-box;
    padding: 52px 54px;
    position: absolute;
    top: 0px;
    left: 0px;
    font-size: 12px;
    color: #DD6226;
}

.bold_txt {
    font-weight: bold;
}

#popup_alex {
    top: 24px;
    left: 320px;
    z-index: 5;
}

.close_button {
    position: absolute;
    height: 32px;
    top: -12px;
    right: -12px;
    z-index: 20;
    cursor: pointer;
}

.select_btn {
    position: absolute;
    height: 40px;
    bottom: -10px;
    right: 12px;
    z-index: 20;
    cursor: pointer;
}

.txt_width {
    width: 55%;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
    /* .main_box_content {
        height: calc(100vh - (52px + 78px + 28px));
    } */
}