/* 共用 */
body { background:url("./images/img_bg.png")repeat-y 45% top; background-size:auto; }
.loading { display: flex; justify-content: center; align-items:center; background-color:#fff; position: fixed; top:0; left:0; width:100vw; height:100vh; z-index:10000; }
.loading img { width:240px; }

.mhhome { height:80px; }

/* 圖片淡入淡出 */
@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; }

.news .new { text-align:left; padding-top:40px; display: flex; align-items:center; }
.news .new .pic { min-width:100px; }
.news .new .txt { padding-left:20px; }
.news .new .txt .cont { color:#0c1e33; }
.news .new:hover .txt .cont { color:#3553ef; }
.news .new .txt .date { color:#9caeb8; font-size:0.875rem; padding-top:5px; }

.about { display: flex; }
.about .cont { margin-left:64px; margin-top:40px; margin-right:30px; text-align:justify; line-height:30px; }
.about .cont .LinkArea1 { margin-top:40px; }
.about .pic { height:450px; background:url(./images/img_cover-1.png)no-repeat left top,url(./images/img_room.png)no-repeat left center; background-size:auto 100%,cover; }

.ListArea1 { display: flex; justify-content: flex-start; align-items:center; flex-wrap: wrap; }
.ListArea1 .item { width:27%; margin-top:70px; }
.ListArea1 > div:last-child { display:flex; align-self: center; }
.ListArea1 .item .tit { color:#005083; font-size:1.25rem; padding-left:20px; }
.ListArea1 .item img { display: inline-block; width:40px; }
.ListArea1 .item .des { padding:0px 20px; text-align:justify; max-width:250px; margin:30px 30px 16px 30px; min-height:48px; }
.ListArea1 .slash { width:9.5%; margin-top:70px; }

.banner1 { max-width:1515px; height:480px; }
.banner1.boxL { margin-left:auto; margin-right:0px; }

.banner2Area { display: flex; }


@media (min-width:1200px){
    .about .content { padding-left:calc((100% - 1110px) / 2); }
    
}

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

@media (max-width:1199.98px) and (min-width:992px){
    .about .content { padding-left:calc((100% - 930px) / 2); }
}

@media (min-width:992px){
    .about .content .container { padding:0px; }
    .about .content { width: calc(50% + 15px); }
    .about .cont .LinkArea { margin-bottom:20px; }
    .about .pic { width: calc(60% - 15px); }

    
}

@media (max-width:991.98px){
    .news .new.link { justify-content: center; }
    .about { flex-direction: column; }
    .about .cont { margin-left:0px; margin-top:30px; margin-bottom: 30px; margin-right:0px; }
    .about .pic { height:400px; margin-left:30px; }

    .ListArea1 { align-items: flex-start; }
    .ListArea1 .item { width:50%; }

    
}



@media (min-width:768px) and (max-width:991.98px){

}

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


@media (min-width:768px){
    .news .new { padding-left:30px; padding-right:30px; }
    .banner2Area .banner2 { flex:1; }
}

@media (max-width:767.98px){
    body { background:url("./images/img_bg-m.png")repeat-y center top; background-size:auto; }
    .mhhome { height:40px; }

    .news .new .pic { min-width:60px; }
    .about .cont .LinkArea1 { margin-top:20px; }
    .VideoArea .container { max-width:100%; padding:0px; }

    .ListArea1 .item { margin-top:70px; }
    .ListArea1 .item .tit { display: block; padding-left:0px; padding-top:15px; font-size:1rem; }
    .ListArea1 .item .des { max-width:180px; padding:15px 10px; font-size:0.875rem; }

    .banner1 { height:200px; }
    .banner2Area { flex-direction: column; }

    .about .pic { height:300px; margin-left:10px; }
}