@charset "UTF-8";
.btn-style4 {
    background-color: #1ca2a5;
}

#top-bar { padding: 0px; }
#top-bar .logo { max-height: 60px; width: auto; }
.top-bar-info { display: inline; }
.top-bar-info ul {  margin-bottom: .3em;}
.services-grids .text-primary { color: #FCEE8E !important; }
.embed-responsive-16by9 iframe { max-width: 100%; height:auto; }
.acckey-l:link, .acckey-l:visited { color: #fff; margin-right: .5em; font-size: .8em; }
.acckey-l:hover { color: #FCEE8E; }
.bg-orange { background-color: #fea24a; border: #fa8412 solid 1px; }
.bg-orange:hover { background-color: #fa8412; border-color: #e47911; }
/*
.feature-box-07 .feature-textbox { border-radius: .5em; }
*/
.shop-category li.active a:link, .shop-category li.active a:visited { color: #c30d23; }

.metis.tparrows { border-radius: 50%; }
.bg-secondary { background-color: #15e2dd; }
.fm-search .btn-outline-secondary:hover { color: #c30d23 !important; }
/* 內頁CSS begin */
.page-content { font-size: .9em; }
.pagination { font-size: .9em; }
.pagination a { padding: 0 10px; line-height: 34px; }
.services-single-menu ul li a { padding: 10px 0 10px 10px; }
.contact-info-section i { background: #fa8412; }

/* ===================================
    Services section
====================================== */
.services-carousel .owl-item {
    margin-bottom: 30px; }
  
.service-block {
border-radius: 10px;
overflow: hidden;
height: 100%;
background: #fff; }
.service-block:hover {
    background: #e1c340; }
    .service-block:hover .service-detail {
    background: #e1c340; }
.service-block .service-detail {
    position: relative;
    background-color: #fff;
    margin-top: 0px;
    padding: 0px 35px 60px 35px;
    z-index: 0;
    height: calc(100% - 260px);
}
.service-block .service-detail h3 { color: #3bb573; }
.service-block .service-detail p { margin-bottom: .3em !important; }
.service-block a {
    display: inline-block; }
.service-block .service-detail:hover a, .service-block .service-detail:hover h3 {
    color: #fff; }
.service-block .service-detail:before {
    border-radius: 100%;
    content: "";
    position: absolute;
    top: -43px;
    background-color: #fff;
    display: inline-block;
    z-index: -1;
    left: -105px;
    height: 140%;
    width: 153%;
    transition: all .5s ease 0s; }
.service-block .service-detail:hover:before {
    background: #e1c340;
    content: "";
    height: 140%;
    width: 153%;
    position: absolute;
    left: -102px;
    top: -43px;
    display: inline-block;
    border-radius: 100%;
    z-index: -1; }
.service-block .service-icon {
    position: absolute;
    bottom: -30px;
    left: 0;
    right: 0;
    margin: 0 auto; }
    .service-block .service-icon a {
    display: inline-block; }
    .service-block .service-icon i {
    background-color: #e1c340;
    border-radius: 100%;
    width: 60px;
    height: 60px;
    z-index: 2;
    font-size: 26px;
    line-height: 60px;
    margin: 0;
    display: inline-block;
    color: #fff;
}
.service-block.fill {
    background: #f7f7f7; }
    .service-block.fill:hover {
    background: #e1c340; }
    .service-block.fill:hover .service-detail {
        background: #e1c340; }
    .service-block.fill .service-detail:before {
    background: #f7f7f7; }
    .service-block.fill .service-detail:hover:before {
    background: #e1c340; }

@media screen and (max-width: 1199px) {
.service-block .service-detail {
    height: calc(100% - 210px); }
    .service-block .service-detail:before {
    left: -77px;
    height: 135%; }
    .service-block .service-detail:hover:before {
    height: 135%;
    left: -77px; } }
@media screen and (max-width: 991px) {
.service-block .service-detail {
    height: calc(100% - 240px); }
    .service-block .service-detail:before {
    left: -85px;
    height: 135%; }
    .service-block .service-detail:hover:before {
    height: 135%;
    left: -85px; } }
@media screen and (max-width: 767px) {
.service-block .service-detail {
    height: calc(100% - 310px); }
    .service-block .service-detail:before {
    left: -140px;
    height: 148%; }
    .service-block .service-detail:hover:before {
    height: 148%;
    left: -140px; } }
@media screen and (max-width: 575px) {
.service-block .service-detail {
    height: calc(100% - 45%); }
    .service-block .service-detail:before, .service-block .service-detail:hover:before {
    height: 320px;
    left: -26%; } }

.ft-link {
    background: rgb(252,207,0);
    background: linear-gradient(90deg, rgba(252,207,0,1) 0%, rgba(251,223,230,1) 100%); 
}
.ft-link a:link, .ft-link a:visited { color: #555; }
.ft-link a:hover { color: #c30d23; }
.footer-top-bar a:link, .footer-top-bar a:visited { color: rgb(255, 255, 255, .85); }
.footer-top-bar a:hover { color: #FCEE8E; }
.footer-bar {
    color: #555;
    background: rgb(252,207,0);
    background: linear-gradient(90deg, rgba(252,207,0,1) 0%, rgba(251,223,230,1) 100%); 
    margin-top: 0;
}
.footer-bar a:link, .footer-bar a:visited { color:#555; }
.footer-bar a:hover { color: #c30d23; }

@media screen and (max-width: 768px) {
    .menu_area { margin-top:  .5em; }
    #map { max-width: 100%; max-height: 500px;}
}

@media screen and (max-width: 576px) {
    .bridge .col-form-label { font-size: .9em; }    
}