/*Mobile*/
@media all and (min-width: 1px) and (max-width: 767px){
    h1{font-size:1.6em}
    h2{font-size:1.45em;line-height:1.6em}
    h2 span{font-size:1.1em}
    #event_date .date{flex-direction: column;gap: 1rem;}
    #event_date h1{width:90%;margin:0 auto}
    #event_date .test{width:100%;margin:.6rem auto}
    #event_date .tb1{font-size:1.4em}
    #event_date p{font-size:1.2em;display:block}
    #event_date .test_type{margin: .5rem auto;}
    #event_book{width:96%;margin:0 auto 2%;padding:5% 2% 2%}
    #event_date .test_type{width:84%;margin:0 auto}
    .ribbon{width:82%}
    .ribbon h1{padding:2.5% 1rem}
    .h1_2{display:block;font-size:.9em}
    figure {width: 100%;}
    figcaption {margin: 6% auto 5%;}
    #event_book h2 b{display:block;margin-right:0}
    #event_book h3{text-align:center;font-size:1.2em}
    .bookList{width:100%}
    .bookList ul{width:100%;padding:2% 0% 1%}
    .bookList ul li{font-size:1em}
    .bookList ul.half li{width:100%}
    #event_media ul{width:88%;margin:1% auto 2%;padding:2% 3%;border-radius:12px}
    #event_course,#event_flashcar,#event_classlink{width:96%;margin:2% auto;padding:2% 0}
    #event_course table{line-height:1.55em}
    .buybtn{font-size:1.25em}
    #event_classlink ul li{font-size:1.05em}
    #event_note{width:90%}
    #good_grade{width:90%;margin:4% auto 0;padding:2%;font-size:1.2em;border-radius:15px}
}

@media all and (min-width: 1px) and (max-width: 1200px){
    #BodyHeader,#event_news,#event_menu{display:none}
    #BodyContainer,#BodyContentEvent{width:100%}
    /*Event_heaader*/
    #BodyHeader_m{height:auto;margin:2% auto;text-align:center}
    #BodyHeader_m img{max-width:50%;height:auto;clear:both}
    @media screen and (orientation:landscape){
        #BodyHeader_m{margin:1.5% auto 1%}
        #BodyHeader_m img{max-width:30%}
    }
        
    ul.flashcar li {
        width: 45%;
    }
    /*Footer*/
    #BodyFooter_rwd{width:100%;margin:0 auto;padding:0;color:#000}
    #BodyFooter_rwd a{color:#000}
    #BodyFooter_rwd #footer_address{width:100%;margin:0 auto;padding:4% 0 1%;text-align:center}
    #BodyFooter_rwd #footer_address ul{padding:0;text-align:center;width:100%;clear:both}
    #BodyFooter_rwd #footer_address li{display:block;width:100%;line-height:2em;text-align:center;font-size:.8em}
    #footer_address br{display:none}
    #footer_address li:nth-of-type(1) img:first-child{display:block;text-align:center;margin:0 auto 2%;max-width: 100%;}
    /*top*/
    #topbutton{width:50px;height:50px;color:#FFF;border-radius:50%;background:#000;opacity:.4;right:1%;bottom:8%;position:fixed;font-size:15px;line-height:50px;text-align:center}
    #topbutton a{color:#FFF;text-decoration:none}
}