/* .testFont { font-family:"Times New Roman"; font-size:2rem; } */
/* 共用 */
.title { color:#262626; font-size:2.5rem; line-height:50px; }
.subtitle { color:#262626; }
.titbd { width:120px; height:1px; border-bottom:1px solid #9b98a5; margin:0px auto; }
.mhhome { height:100px; }

.loading { background-color:#fff; 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; }
}

/* .logo { height:160px; width:160px; left:120px; } */
/* .logo img { padding-top:15px; width:auto; } */

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

.homeArea1 { background:url("./images/bg1.png") repeat-x top left ; background-color:#f5f1f9; }
.homeArea1 .bnr1 .ColBg .des { display: block; padding:40px; }
.homeArea1 .bnr1 .ColBg .des .tt { color:#5142b3; font-size:1.25rem; }
.homeArea1 .bnr1 .ColBg .des .cont { text-align:justify; color:#696672; margin-top:15px; }
.homeArea1 .bnr1 .ColBg:hover { background-color:#8026a6; }
.homeArea1 .bnr1 .ColBg:hover .des .tt,
.homeArea1 .bnr1 .ColBg:hover .des .cont { color:#fff; }

.homeArea1 .bnr2 { text-align:left; }

.bnr2 { margin-top:40px; }
.bnr2 .ColItem .ColBg { overflow: hidden; border-radius: 5px; }
.bnr2 .ColItem .des { padding:20px; color:#474747; }
.bnr2 .ColItem .ColBg:hover .des { background-color:#8026a6; color:#fff; }

.cournews { background:url("./images/img_bg.jpg")no-repeat center center; background-size:cover; text-align:left; }
.cournews .title { text-align:left; }
.cournews .courses > div:first-child { margin-top:40px; border-top:none; }
.cournews .course { border-top:1px dotted #b6a8f4 ; text-align:left; padding:20px 0px; }
.cournews .course .date { color:#7d68f3; font-size:0.875rem; }
.cournews .course .name { max-width:calc(100% - 20px); font-size:1.25rem; }
.cournews .course .name a { color:#262626; }
.cournews .course .name a:hover { color:#8026a6; }
.cournews .link { display: inline-block; color:#5142b3; padding:12px 35px; border:1px solid #5142b3; margin-top:20px; }
.cournews .link i { margin-left:10px; }
.cournews .link:hover { background-color:#8026a6; color:#fff; }

.homeArea2 { padding:160px 0px; }
.homeArea2 .area { text-align:left; }
.homeArea2 .area .left .tt { color:#5142b3; font-size:2.5rem; }
.homeArea2 .area .left .tt2 { color:#5142b3; }
.homeArea2 .link { display: inline-block; border:1px solid #75c6d1; color:#75c6d1; padding:12px 35px; margin-top:20px; }
.homeArea2 .link i { margin-left:10px; }
.homeArea2 .link:hover { background-color:#8026a6; border:1px solid #8026a6; color:#fff; }
.homeArea2 .area .right { color:#474747; text-align: justify; }

.map-responsive { overflow:hidden; padding-bottom:640px; position:relative; height:0; }
.map-responsive iframe { left:0; top:0; height:100%; width:100%; position:absolute; }

.contact { position: absolute; display: block; left:0px; top:0px; width:496px; background-color:#5142b3; padding:40px; text-align:left; z-index:2; }
.contact:hover { background-color:#8026a6; }
.contact .title , .contact .subtitle { color:#fff; }
.contact .cont { position: relative; margin-top:45px; color:#fff; }
.contact .cont i { position: absolute; right:0px; top:50%; transform: translate(0,-50%); margin-left:25px; }

/* amination area init */
/* .cont, .prod,.btmbnr, .newcont { transform:translateY(100px); opacity: 0; } */
.upslideAni { animation:upslide 2s; transform:translateY(0px); opacity: 1; }
/* animation */
@keyframes upslide {
    0% { transform:translateY(100px); opacity: 0; }
    100% { transform: translateY(0px); opacity: 1; }
}


@media (max-width:1199.98px){
    /* .logo { left:50px; } */
}

@media (max-width:1199.98px) and (min-width:992px){
    /* .top .topbnr .bnr { height:50vh; } */

}

@media (min-width:992px){
    .cournews .row > div { padding:0px 30px; }
    .homeArea2 .area .left { width:380px; }
    .homeArea2 .area .right { width:calc(100% - 380px); }
}

@media (max-width:991.98px){
    .homeArea1 .bnr1 .ColBg .des { padding:20px; }
}



@media (min-width:768px) and (max-width:991.98px){
    .homeArea2 .area .left { width:300px; }
    .homeArea2 .area .right { width:calc(100% - 300px); }
}

/* 手機橫寬991.98內 banner全版 */
/* @media (max-width:991.98px) and (orientation: landscape){
    .top .topbnr .bnr { height:100vh; }
} */

@media (min-width:768px){
    .homeArea2 .area { display: flex; }
    
}

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

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

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

    .homeArea2 { padding:60px 0px; }
    .homeArea2 .area .left .tt { font-size:1.75rem; }
    .homeArea2 .area .right { margin:50px 0px; }
    .homeArea2 .link { margin-top:0px; }

    .map-responsive { padding-bottom:300px; }
    .contact { position:static; width:100%; padding:30px; }
    .contact .cont { margin-top:30px; padding-right:40px; }

    .loading img { width:80px; }
}