/* 共用 */
.title { color:#003966; font-size:2.5rem; line-height:50px; }
.titbd { width:120px; height:1px; border-bottom:1px solid #398b9f; margin:0px auto; }

.mhhome { height:100px; }

.loading { background-color:#003966; position: fixed; top:0; left:0; width:100%; height:100%; z-index:10000; }
.loading img { width:auto; padding-top:30vh; }
/* 圖片淡入淡出 */
@keyframes showin {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@keyframes showout {
    0% { opacity: 1; }
    100% { opacity: 0; }
}

.top { position: relative; }
.top .topbnr .bnr { width:100%; height:100vh; }

.about .content { padding:60px 20px; max-width:660px; margin:0px auto; text-align:left; font-size:1.125rem; }
.about .link { display:inline-block; padding:20px 75px; line-height:15px; color:#006aa3; border:1px solid #006aa3; }
.about .link:hover { background-color:#006aa3; color:#f7f3f0; }

.cournews { background-color:#f7f8fb; }

.cournews .title { text-align:left; }
.cournews .course { border-bottom:1px solid #dee3ea; text-align:left; }
.cournews .course .date { color:#952923; font-size:0.875rem; display: table-cell; }
.cournews .course .name { max-width:calc(100% - 70px); padding:20px 0px; padding-left:30px; display: table-cell; }
.cournews .course .name a { color:#000; }
.cournews .course .name a:hover { color:#003966; }
.cournews .link { display: inline-block; color:#0b70a7; padding-top:30px; }
.cournews .link:hover { color:#fe8f30; }


.jcarousel-wrapper { margin: 0px auto; position: relative; }
/** Carousel **/
.jcarousel { position: relative; overflow: hidden; width: 100%; }
.jcarousel ul { width: 10000em; position: relative; list-style: none; margin: 0; padding: 0; height:100vh; }
.jcarousel li { width: 200px; position: absolute; top:0; left:0; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
.jcarousel li .bnr { opacity: 0; }

/** Carousel Controls **/
.control-prev { left: 80px; }
.control-next { right: 80px; }

.jcarousel-control-prev,
.jcarousel-control-next { position: absolute; top: 50%; margin-top: -15px; text-align: center; padding:24px 0px; z-index: 0; font-size:2rem; color: rgba(149, 41, 35, 0.5); text-decoration: none; cursor: pointer; }
.jcarousel-control-prev:hover,
.jcarousel-control-next:hover { color: #fe8f30; }


.slide-btn { position: absolute; bottom: 0vh; left:160px; width: 60px; height: 200px; color: #fff; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; }
.slide-btn:hover { cursor: pointer; color:#fe8f30; text-decoration: none; }
.slide-btn .txt { line-height: 80px; font-size:1.25rem; -webkit-transform: rotate(90deg) translate(-10px,0px); -moz-transform: rotate(90deg) translate(-10px,0px); -ms-transform: rotate(90deg) translate(-10px,0px); -o-transform: rotate(90deg) translate(-10px,0px); transform: rotate(90deg) translate(-10px,0px); }
.slide-btn .slidebd { position: relative;  height:120px; background-color: transparent; overflow: hidden; }
.slide-btn .slidebd .icon { position: absolute; left:50%; top:10px; transform: translate(-50%); animation: jump 3s infinite; font-size:1.75rem; }

@keyframes jump {
    0% { top:10px; }
    50% { top:80px; }
    100% { top:10px; }
}

@media (max-width:1199.98px){
    .slide-btn { left:100px; height:150px; }
    .slide-btn .txt { font-size:1rem; }
    .slide-btn .slidebd { height:70px; }
    .slide-btn .slidebd .icon { font-size:1rem; top:0px; }
    @keyframes jump {
        0% { top:0px; }
        50% { top:50px; }
        100% { top:0px; }
    }
}

@media (max-width:991.98px){}

@media (max-width:767.98px){
    .title { font-size:1.75rem; }
    .titbd { width:80px; }
    .mhhome { height:60px; }

    .about .link { padding:12px 40px; }

    .cournews .course .date,.cournews .course .name { display: block; }
    .cournews .course .date { padding:10px 0px; }
    .cournews .course .name { padding:0px; padding-bottom:15px; }

    .loading img { width:80px; }

    .slide-btn { left:60px; }
    .control-prev { left: 20px; }
    .control-next { right: 20px; }
}

@media ( max-width:575.98px ){}

@media ( min-width:576px ){}

@media ( min-width:768px ){}

@media ( min-width:992px ){
    .cournews .row > div { padding:0px 30px; }
}

@media ( min-width:1200px ){}