/**自定义样式**/
body {
    font-family: "Helvetica Neue","Microsoft JhengHei", Helvetica, 'SimHei', Arial, sans-serif;
    color:#000;
}

/*數字跳動變化*/
.index_history{ padding:60px 0;}
.index_history .index_history_title{ text-align: center; border:solid 1px #ff6600; font-size: 12px; background:#fff2ea; line-height: 28px; /*width:360px;*/ margin:20px auto 0}
/*.index_history .col-md-4{ border-right: solid 1px #f1f1f1}*/
.index_history .col-md-4 .digital{ background:url("../img/cl.png") left 3px no-repeat; padding-left: 66px; width:230px; margin: 0 auto; }
.index_history .col-md-4:nth-child(2) .digital{ background:url("../img/bj.png") left 4px no-repeat;}
.index_history .col-md-4:nth-child(3) .digital{ background:url("../img/qz.png") left 3px no-repeat;}
.index_history .col-md-4 .digital p{ margin: 0;}
.index_history .col-md-4 .digital p .timer{  font-weight: bold;}

/*生活所需*/
.long_box{}
.long_box .row{ margin: 0;}
.long_box .col-lg-3{ background: #373d41; padding: 0; position: relative;    /*opacity:.6;filter: alpha(opacity=60);  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(60));*/  transition: all .4s cubic-bezier(.4,0,.2,1);  }
.long_box .col-lg-3 img{ max-width: 100%; }
.long_box .col-lg-3 .content img{ transition: all .4s cubic-bezier(.4,0,.2,1);opacity: 1;  filter: alpha(opacity=1);}

.long_box .col-lg-3 .content{ position: absolute; left: 0; top:35%; text-align: center; padding: 0 28px; color: #fff; line-height: 24px;transition: all .4s cubic-bezier(.4,0,.2,1);}
.long_box .col-lg-3 .content .long_title{ font-size: 22px; font-weight: bold; line-height: 60px; transition: all .4s cubic-bezier(.4,0,.2,1); }
.long_box .col-lg-3 .content p{opacity: 0;  filter: alpha(opacity=0);    transition: all .4s cubic-bezier(.4,0,.2,1); }
.long_box .col-lg-3 .content .btn{ color: #ffffff; border: solid 1px #fff; border-radius: 0; width: 124px; line-height: 40px; padding: 0; margin-top: 46px;opacity: 0;  filter: alpha(opacity=0);    transition: all .4s cubic-bezier(.4,0,.2,1);}

.long_box .col-lg-3:hover{background: #ed6d00;transition: all .4s cubic-bezier(.4,0,.2,1);}
.long_box .col-lg-3:hover .content{ position: absolute; left: 0; top:10%;transition: all .4s cubic-bezier(.4,0,.2,1);}
.long_box .col-lg-3:hover .content img{    transition: all .4s cubic-bezier(.4,0,.2,1);opacity: 0;  filter: alpha(opacity=0); }
.long_box .col-lg-3:hover .content p{ opacity: 1;  filter: alpha(opacity=1);   }
.long_box .col-lg-3:hover .content .btn{ opacity: 1;  filter: alpha(opacity=1);   }
.long_box .col-lg-3 .content .btn:hover{ background: #fff; color: #ed6d00;}

/*我們的服務*/
.services_bg{ width: 100%; background: #f5f5f5;    padding:75px 0 90px;}
.index_title{}
.index_title h2{ font-size: 32px; color: #090b17;}
.index_title p{ font-size: 18px; color: #090b17; }

.services_bg .row{ margin-top: 35px;}
.services_bg .col-lg-4{ margin: 0; padding: 0;}
.services_bg .col-lg-4 .services{ background: #ffffff; color: #090b17; padding: 28px; border-radius: 15px; line-height: 24px; margin: 10px;/*-webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear;*/}
.services_bg .col-lg-4 .services h3{ line-height:24px; font-size: 18px; margin-top: 13px;}
.services_bg .col-lg-4 .services h3 img{ vertical-align:1px; line-height: 24px; padding-left: 16px;}
.services_bg .col-lg-4 .services p{ margin: 0;margin-top: 10px; font-size: 18px; height: 48px; }

.services_bg .col-lg-4 a:hover .services{ color:#313342;}
/*.services_bg .col-lg-4 a:hover .services{ -webkit-transform: translate(0, -2px); -moz-transform: translate(0, -2px); transform: translate(0, -2px); box-shadow: 0 4px 20px rgba(86, 86, 86, 0.1);}*/

/*安心通服務介紹*/
#introduction{  padding:75px 0 90px;}
#introduction .text{ margin-top:46px;}

.index-btn{ margin-top: 35px;}
.index-btn .btn{ width: 180px; height: 50px; background: #fe7200; line-height: 50px; text-align: center; padding: 0; border-radius: 30px;  color: #fff; margin-right: 15px;}
.index-btn .btn:hover{ background: #f38930;}

/*活動資訊*/
.news_box{}
.news_box .col-lg-3{ margin: 30px 0; padding: 0 15px;}
.news_box .col-lg-3 .news{ background: #fff;}
.news_box .col-lg-3 .news img{ max-width: 100%; display: block; margin: 0 auto;}
.news_box .col-lg-3 .news div{ padding: 28px;line-height: 24px;text-align: left;}
.news_box .col-lg-3 .news div h3{ font-size: 16px;line-height: 26px;  height: 104px; margin-top: 0; color: #090b17; margin: 0;}
.news_box .col-lg-3 .news div p{ margin:0; color: #757575; font-weight: normal;}
.news_box .col-lg-3 .bar{ height: 1px; background: #fe7200;  width:0px;   /*-webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15); */-webkit-transition: width 1s ease;  -o-transition: width 1s ease;  transition: width 1s ease; }
.news_box .col-lg-3 a:hover .bar{width: 100%;}



/*==========節日裝飾css==============*/
/*
.services_bg{ background:url('../img/new-year-bg2.png') center top no-repeat, url('../img/new-year-bg.png'); padding-top: 50px;}
.index_titl_new{ text-align: center; background:url("../img/new-year-title.png") center top no-repeat;}
.index_titl_new h2{ padding:45px 20px 10px; margin: 0; }
.index_titl_new p{ padding:0 0 10px; margin: 0; }
*/



@media only  screen and (max-width:1600px) {
    /*生活所需*/
    .long_box .col-lg-3 .content{ position: absolute; left: 0; top:30%;}
    .long_box .col-lg-3:hover .content{ position: absolute; left: 0; top:6%;}
    .long_box .col-lg-3 .content .btn{  margin-top:26px;}
}

@media only  screen and (max-width:1440px) {
    /*生活所需*/
    .long_box .col-lg-3 .content{ position: absolute; left: 0; top:30%;}
    .long_box .col-lg-3:hover .content{ position: absolute; left: 0; top:1%;}
    .long_box .col-lg-3 .content .btn{  margin-top:26px;}
}

@media only  screen and (max-width:1240px) {
    /*生活所需*/
    .long_box .col-lg-3 .content{ position: absolute; left: 0; top:30%;}
    .long_box .col-lg-3:hover .content{ position: absolute; left: 0; top:-10%;}
    .long_box .col-lg-3 .content .btn{  margin-top:26px;}
}

@media only  screen and (max-width:1180px) {
    /*生活所需*/
    .long_box .col-lg-3 .content{ position: absolute; left: 0; top:30%;}
    .long_box .col-lg-3:hover .content{ position: absolute; left: 0; top:-14%;}
    .long_box .col-lg-3 .content .btn{  margin-top:26px;}

}

@media only  screen and (max-width:1150px) {
    /*生活所需*/
    .long_box .col-lg-3 .content .btn{  margin-top:16px;}
    .long_box .col-lg-3:hover .content{ position: absolute; left: 0; top:10%;transition: all .4s cubic-bezier(.4,0,.2,1);}
    .long_box .col-lg-3:hover .content img{    transition: all .4s cubic-bezier(.4,0,.2,1);opacity: 1;  filter: alpha(opacity=1); }
    .long_box .col-lg-3:hover .content p{ opacity: 0;  filter: alpha(opacity=0); height: 1px; padding: 0; margin: 0; }

}

@media only  screen and (max-width:1050px) {
    /*生活所需*/
    .long_box .col-lg-3:hover{background: #373d41;}
    .long_box .col-lg-3:hover .content{ position: absolute; left: 0; top:20%; }
    .long_box .col-lg-3 .content p{ opacity: 0;  filter: alpha(opacity=0); height: 1px; padding: 0; margin: 0; }
    .long_box .col-lg-3 .content .btn{  margin-top: 16px;opacity: 0;  filter: alpha(opacity=1);    transition: all .4s cubic-bezier(.4,0,.2,1);}
    .long_box .col-lg-3 .content .btn:hover { background:none; color: #ffffff;}
}

@media only  screen and (max-width: 750px) {
    /*數字跳動變化*/
    .index_history{ padding-bottom:0;}
    .index_history  .col-md-4 .digital{ margin-bottom: 40px;}

    /*生活所需*/
    .long_box .col-lg-3:hover{background: #373d41;}
    .long_box .col-lg-3:hover .content{ position: absolute; left: 0; top:30%; }
    .long_box .col-lg-3 .content p{ opacity: 0;  filter: alpha(opacity=0); height: 1px; padding: 0; margin: 0; }
    .long_box .col-lg-3 .content .btn{  margin-top: 1px;opacity: 1;  filter: alpha(opacity=1);    transition: all .4s cubic-bezier(.4,0,.2,1);}
    .long_box .col-lg-3 .content .btn:hover { background:none; color: #ffffff;}


    /*安心通服務介紹*/
    #introduction{ padding: 40px 15px 60px;}
    #introduction .col-lg-5{ padding: 0 2%;}
    #introduction .text{ margin-top:26px;}

    .index-btn{ margin-top: 35px;}
    .index-btn .btn{ width: 160px; height: 40px; margin-bottom: 20px; background: #fe7200; line-height: 40px; text-align: center; padding: 0; border-radius: 30px;  color: #fff; margin-right: 15px;}
    .index-btn .btn:hover{ background: #f97a0f;}


    /*活動資訊*/
    .news_box{}
    .news_box .col-lg-3{ margin:20px 0; padding: 0 10px;}
    .news_box .col-lg-3 .news div{ padding: 18px;line-height: 24px;}
	
	
     /*==========節日裝飾css==========*/
/*    .services_bg{ background:#f5f5f5; padding-top: 50px;}
    .index_titl_new{ text-align: center; background:none;}
    .index_titl_new h2{ padding:0; margin:20px 0 0; }*/
}


@media only  screen and (max-width:640px) {
    /*生活所需*/
    .long_box .col-lg-3:hover{background: #373d41;}
    .long_box .col-lg-3 .content{ position: absolute; left: 0; top:15%; }
    .long_box .col-lg-3:hover .content{ position: absolute; left: 0; top:15%; }

    /*我們的服務*/
    .services_bg{ width: 100%; background: #f5f5f5;    padding:40px 0 60px;}
    .services_bg .col-lg-4 .services{ background: #ffffff; color: #090b17; padding: 18px; border-radius: 8px; line-height: 24px; margin: 10px;}
    .services_bg .col-lg-4 .services h4{ line-height:36px;}
    .services_bg .col-lg-4 .services p{ margin: 0;margin-top: 10px; height:auto; }


}

@media only  screen and (max-width:460px) {
    /*生活所需*/
    .long_box .col-lg-3 .content{ position: absolute; left: 0; top:20%; }
    .long_box .col-lg-3:hover .content{ position: absolute; left: 0; top:20%; }
    .long_box .col-lg-3 {  width: 100%;  }

}


body.small-font .long_box .col-lg-3 .content .long_title{ font-size: 22px;}
body.small-font .index_title h2{ font-size: 32px; color: #090b17;}
body.small-font .index_title p{ font-size: 18px; color: #090b17; }
body.small-font .services_bg .col-lg-4 .services h3{  font-size: 18px;}
body.small-font .services_bg .col-lg-4 .services p{font-size: 18px; }
body.small-font .news_box .col-lg-3 .news div h3{ font-size: 16px;}
body.small-font .index_history .index_history_title{ font-size: 16px;}

body.medium-font .long_box .col-lg-3 .content .long_title{ font-size: 24px;}
body.medium-font .index_title h2{ font-size: 34px; color: #090b17;}
body.medium-font .index_title p{ font-size: 20px; color: #090b17; }
body.medium-font .services_bg .col-lg-4 .services h3{  font-size: 20px;}
body.medium-font .services_bg .col-lg-4 .services p{font-size: 20px; }
body.medium-font .news_box .col-lg-3 .news div h3{ font-size: 18px;}
body.medium-font .index_history .index_history_title{ font-size: 18px;}
body.medium-font .long_box .col-lg-3 .content .btn{ font-size: 16px;}
body.medium-font #introduction{  padding:55px 0 75px;}
body.medium-font .index_history .col-md-4 .digital{  width:240px;}


body.large-font .long_box .col-lg-3 .content .long_title{ font-size: 26px;}
body.large-font .index_title h2{ font-size: 36px; color: #090b17;}
body.large-font .index_title p{ font-size: 22px; color: #090b17; }
body.large-font .services_bg .col-lg-4 .services h3{  font-size: 22px;}
body.large-font .services_bg .col-lg-4 .services p{font-size: 22px; }
body.large-font .news_box .col-lg-3 .news div h3{ font-size: 20px;}
body.large-font .index_history .index_history_title{ font-size: 20px;}
body.large-font .long_box .col-lg-3 .content .btn{ font-size: 16px;}
body.large-font #introduction{  padding:35px 0 55px;}
body.large-font .index_history .col-md-4 .digital{  width:250px;}