body { background:url("./images/img_bg_2.png")repeat-y 45% top; background-size:100%; }

.mhinside { height:60px; }

/* 上方標題banner */
.TopBnrArea1 { position: relative; width:100%; height:360px; }
.TopBnrArea1 .TopTitle { display: flex; position: absolute; bottom:0px; width:100%; }
.TopBnrArea1 .TopTitle .leftArea { width:35.9375%; background-color:#fff; padding:28px 0px; padding-left:calc((100% - 1140px) / 2); }
.TopBnrArea1 .TopTitle .leftArea .UnitTitle { padding:0px 15px; }

.TopBnrArea2 { position: relative; width:100%; }
.TopBnrArea2 .TopTitle { display: flex; position: absolute; bottom:0px; width:100%; }
.TopBnrArea2 .TopTitle .leftArea { width:calc((100% - 1110px) / 2 + 120px ); background-color:#fff; padding:0px; padding-left:calc((100% - 1110px) / 2); }
.TopBnrArea2 .TopTitle .leftArea .back { background-color:#073190; color:#fff; width:120px; height:120px; float:right; border:none; }

.TopBnrArea1 .TopTitle .rightArea { flex-grow: 1; background:url("./images/img_tit-bg.png")repeat-y left center; }
.TopBnrArea2 .TopTitle .rightArea { background:transparent; }

.RowItems .ColItem { margin-top:40px; }
.RowItems .ColBg { height:100%; background-color:#f6f6f6; }
.RowItems .ColItem .ColCont { padding:20px; font-size:1.125rem; color:#0c1e33; }

.Content { text-align:left; }
.Content .CArea { margin-top:60px; }

.Content .CArea .CTitle { color:#ea6955; font-size:1.25rem; }
.Content .CArea .CLink a { color:#073190; border-bottom:1px solid #073190; }
.Content .CArea .CLink a:hover { color:#5fc1c7; border-bottom:1px solid #5fc1c7; }

.ClsArea .row { margin:0px -3px; }
.ClsArea .row .col-2 { padding:0px 3px; }
.ClsArea .ClsItem { display: block; text-align:left; color:#3553ef; border-bottom:1px solid #3553ef; padding-bottom:20px; }
.ClsArea .ClsItem.active { color:#073190; border-bottom:2px solid #073190; padding-bottom:19px; }
.ClsArea select { width:100%; padding:20px 10px; color:#073190; border:none; border-bottom:1px solid #073190; }

/*-------------------------------------------------------------*/

.news .ColItem { margin-top:80px; } 
.news .ColBg { text-align:left; }
.news .tit { font-size:1.25rem; }
.news .date , .Content .date { color:#919191; font-size:0.875rem; margin-top:10px; }

.service { text-align:left; }
.service .item { margin-top:80px; }
.service .item .cont { background-color:#f9f9f9; }
.service .item .cont .des { margin:30px 0px; min-height:48px; }

.qa .qaArea { margin-top:45px; }
.qa .qaArea .area { padding:30px 0px; padding-left:25px; border-bottom:1px solid #e5edf2; display: flex; align-items:flex-start; text-align:left; cursor: pointer; }
.qa .qaArea .area i { padding:5px 0px;margin-right:40px; color:#073190; }
.qa .qaArea .area .question { font-size:1.25rem; color:#073190; }
.qa .qaArea .area .answer { display: none; color:#000; margin-top:40px; }

.contact .infArea { text-align:left; margin-top:30px; border:1px solid #e2e2e2; padding:40px; }
.contact .infArea .tit { color:#073190; }
.contact .infArea .bd { background-color:#e5edf2; display: inline-block; height:4px; width:40px; margin:20px 0px; }
.contact .infArea .area:not(:last-of-type) { margin-bottom:50px; }
.contact .infArea .area .cont1 { color:#919191; font-size:0.875rem; margin-bottom:10px; }
.contact .infArea .area .cont2 { color:#262626; }

@media(max-width:1199.98px) and (min-width:992px){
    .TopBnrArea1 .TopTitle .leftArea { padding-left: calc((100% - 960px) / 2); }
    .TopBnrArea2 .TopTitle .leftArea { width:calc((100% - 930px) / 2 + 120px ); padding-left:calc((100% - 930px) / 2); }
}

@media (max-width:991.98px){
    .service .item .cont .des { margin:15px 0px; }

    .contact .infArea { padding:20px; }
}

@media (min-width:768px){
    .Content .CArea .CSpace { height:10px; }
    .Content .CArea .CData { margin:0px -45px; } 
    .Content .CArea .CData .CRow { display: flex; margin-top:10px; }
    .Content .CArea .CData .CRow > div { flex:1; padding:0px 45px; }

    .Content .CArea .CCont:not(:first-of-type) { margin-top:24px; }
    .Content .CArea .CLink { margin-top:60px; }

    .service .item { position:relative; padding-top:40px; }
    .service .item .pic { position: absolute; left:0px; right:auto; top:0px; width:calc(50% + 85px); }
    .service .item.rev .pic { left:auto; right:0px; }
    .service .item .cont { width:calc(50% - 15px); padding:60px; padding-left:120px; margin-left:auto; margin-right:0px; }
    .service .item.rev .cont { margin-left:0px; margin-right:auto; padding-right:120px; padding-left:60px; } 

    .contact .infArea { margin-left:75px; }
}

@media (max-width:991.98px) and (min-width:768px){
    .TopBnrArea1 .TopTitle .leftArea { width:50%; padding-left:calc((100% - 720px) / 2); }
    .TopBnrArea2 .TopTitle .leftArea { width:calc((100% - 690px) / 2 + 120px ); padding-left:calc((100% - 690px) / 2); }

    .service .item { padding-top:20px; }
    .service .item .pic { width:calc(50% + 30px); }
    .service .item .cont { width:50%; padding:30px; padding-left:60px; }
    .service .item.rev .cont { padding-right:60px; padding-left:30px; }
    
    .contact .infArea { margin-left:30px; }
}

@media (max-width:767.98px){
    body { background-size:160%; }

    .mhinside { height:60px; }

    .TopBnrArea1 .TopTitle .leftArea { width:70%; padding:15px 0px; }
    .TopBnrArea2 .TopTitle .leftArea { width:80px; padding:0px; }
    .TopBnrArea2 .TopTitle .leftArea .back { width:80px; height:48px; font-size: 0.75rem; }

    .TopBnrArea1 .TopTitle .rightArea { background-size: 50% 100%; }
    
    .Content .CArea { margin-top:30px; }
    .Content .CArea .CCont { margin-top:30px; }
    .Content .CArea .CCont .CDesc { margin-top:10px; }
    .Content .CArea .CCont .CLink { margin-top:30px; }

    .service .item .pic { position: static; width:100%; }
    .service .item .cont { width:100%; padding:30px; }

    .qa .qaArea .area { padding:20px 0px; }
    .qa .qaArea .area i { margin-right:30px; padding:7px 0px; }
    .qa .qaArea .area .answer { margin-top:20px; }

    .contact form { padding-bottom:60px; }
}

@media (max-width:767.98px) and (min-width:576px){
    .TopBnrArea1 .TopTitle .leftArea { padding-left:calc((100% - 540px) / 2); }
    
}

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