/* 基本
--------------------------------------------------- */
body{font-family:Arial,"Microsoft YaHei","Microsoft JhengHei",Helvetica, sans-serif, "微軟正黑體";overflow-x: hidden;}
/*HTML5 tag*/
a {cursor:pointer;}
img{max-width:100%; height: auto;}
ul, li{list-style-type:none; padding: 0;}
/* LAYOUT CLASS
--------------------------------------------------- */
.nav > li > a{font-size:16px;}
.navbar-inverse {background-color:#fff; border: none;}
.navbar{
    margin-bottom: 10px;
    border-radius:0px; min-height: 100px;
    -moz-box-shadow:0px 4px 12px -2px rgba(20%,20%,40%,0.5);
    -webkit-box-shadow:0px 4px 12px -2px rgba(20%,20%,40%,0.5);
    box-shadow:0px 4px 12px -2px rgba(20%,20%,40%,0.5);}
.navbar-inverse .navbar-nav > li > a{color: #3e3e3e; padding-bottom: 5px;}
.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
    color: #137bd8;
    border-bottom:3px solid #137bd8;}
.navbar-brand{padding: 30px 15px;}

@media (min-width: 768px){
.navbar-right {
    float: right !important;
    margin-right: -15px;
    margin-top: 4%;}
}
@media only screen and (max-width:991px) and (min-width:768px) {
    .navbar-right {margin-top: 7%;}
}
/*header
-----------------------------------------------------*/
.carousel-indicators li{
    border-radius: 0px;
    border:none;
    width: 30px; height:5px;
    background-color:#fff;
}
.carousel-indicators .active{
    width: 60px; height:5px;
    background-color:#4c5359;
}
/*about
-----------------------------------------------------*/
.block_ab{
    background-image: url(../images/about_bg.jpg);
    background-repeat: no-repeat;
    background-position:center;
    background-size: cover;
    padding-bottom: 50px;
    position: relative;
}
.page-header{text-align: center;padding-bottom: 0px;}
.ab_txt{
    font-size:20px; color:#fff; border-bottom:3px solid #ffd02d;
    width:100px; margin: 0 auto; padding-bottom: 10px;}

.ab_txt_en{font-family:"Century Gothic" !important; font-size: 46px; color:#ffd02d;}
.ab_txt_en01{color:#fff; font-size: 35px;}

.ab_pic{display:inline-block; width:40%;}
.ab_pic > img{position: absolute; top:27%; left:8%;}

.ab_contxt{display:inline-block; width:48%;}
.ab_contxt p{color:#fff;font-size:18px; line-height:2;margin:30px 0 0 10px;}
.ab_contxt p span{display: block; text-indent:35px;}

.ab_btn{float: right;  border: 1px solid #ffd02d;}
.ab_btn a{color:#ffd02d;}
.ab_btn:hover a{color:#000;}
.ab_btn:hover{ background-color:#ffd02d;}

/*about
-----------------------------------------------------*/
.block_so{
    background-image: url(../images/soltion_bg.jpg);
    background-repeat: no-repeat;
    background-position:center;
    background-size: cover;
    padding-bottom: 50px;
    position: relative;
}
.so_txt{
    font-size:20px; color:#000; border-bottom:3px solid #137bd8;
    width:100px; margin: 0 auto; padding-bottom: 10px;}

.so_txt_en{font-family:"Century Gothic" !important; font-size:46px; color:#137bd8;}
.so_txt_en01{color:#000; font-size: 35px;}

.so_list{width: 100%; margin: 0 auto;}
.so_list ul{overflow: hidden;}
.so_list ul li{
    text-align: center;
    width:19%; margin-right: 1%; float:left; list-style-type: none;}

.so_txt01{font-size: 24px; color:#000; margin-top: 10px;}
.so_txt02{font-size:20px; color:#808080; margin-top: -15px;}
p.so_txt02 + p{color:#808080; text-align: center;}

.so_btn{border: 1px solid #808080;}
.so_btn a{color:#808080;}
.so_btn:hover {background:#808080; text-decoration: none;}
.so_btn:hover a{color:#fff;}



/*affiliates
-----------------------------------------------------*/
.block_aff{padding-bottom:10%;}
.block_aff ul{overflow: hidden;}
.block_aff ul li{width:15%; margin-right: 1%; float: left; border:1px solid #b4b4b4;}

/*footer
-----------------------------------------------------*/
footer{width:100%;}
.copyright{
    color:#ddd; 
    text-align: center;
    background-color:#2a2a2a; 
    padding:10px 0;}

.block{position: relative;}
.block_contact{background-color:#3f3f3f;}

.block_con{ 
    position: absolute; 
    float: left;
    background-color:#1b1b1b; 
    padding:20px; 
    color:#fff;
    bottom: 10px;}
.block_con h1{margin-top: 0px;}

.f_icon{margin: 0;}
.f_icon::before{
    content:url('../images/icon.jpg'); 
    display: inline-block; 
    vertical-align:middle;}
.f_icon span{display: inline-block;vertical-align: middle;}

.f_phone{font-size: 45px; color:#fff; margin:0;}

.f_con_list{ float: left; margin: 5% 3%; text-align: left;}
.f_con_list ul li{color:#fff; line-height:2;letter-spacing:2px;}
.f_con_list ul li a{color:#ccc;}
.f_con_list ul li a:hover{color:#fff; text-decoration: none; }

.f_list{width:65%; float:right;}
.f_list01{font-size: 22px; color:#ffa727 !important;}
.f_list02{color:#fff;}





@media only screen and (max-width:1199px) and (min-width:991px) {
    /* .ab_pic{width: 45%;} */

    }
@media only screen and (max-width:991px) and (min-width:320px) {
    .ab_contxt{width:100%;}
    .ab_pic{display: none;}
    .navbar-brand{padding:30px 10px;}
        .block_con{position: inherit;}
    }
@media only screen and (max-width:991px) and (min-width:640px) {
    .so_list ul li, .block_aff ul li{width:32%;margin-bottom: 20px; margin-right: 1%;}
    {width:32%; margin-bottom: 20px; margin-right: 1%;}
}

/*1024*/
@media only screen and (max-width:1024px){}
/*991*/
@media only screen and (max-width:991px){
    .block_con{width: 98%; bottom: 90%;}
    .f_list{width: 100%;}
    .f_icon,.f_txt{display: inline-block; vertical-align: middle;}
/*     .block_contact{margin-top:12%;} */
    .f_icon{padding-left: 5%;}
    .f_txt{padding-left:3%;}
}
/*960*/
@media only screen and (max-width:960px){}

/*767*/
@media only screen and (max-width:767px){
    .navbar-toggle{margin-top: 45px;}
    .navbar-inverse .navbar-toggle .icon-bar{background-color:#337ab7;}
    .navbar-inverse .navbar-toggle:hover .icon-bar{background-color:#fff;}
    .navbar-inverse .navbar-toggle:hover,
    .navbar-inverse .navbar-toggle:focus{
        background-color:#337ab7;}
    .navbar-inverse .navbar-toggle {border-color:#337ab7;}
    /* .block_contact{margin-top:25%;} */
    .f_icon,.f_txt{padding:0;}
    .f_list{padding-top: 5%;}
    }
/*767*/
@media only screen and (max-width:721px){
    .block_con{text-align: center;}
   /*  .block_contact{margin-top:40%;} */
    }
/*640*/
@media only screen and (max-width:640px){
    .so_list ul li, .block_aff ul li{width:48%; margin-bottom: 20px; margin-right:1%; text-align: center;}
    .f_con_list{margin: 5% 1%;}
    .f_list{padding-top:10%;}
}
/*480*/
@media only screen and (max-width:480px){
    .so_list ul li, .block_aff ul li{
        width:100%; 
        margin-bottom: 20px; 
        margin-right:1%;}
    .block_con{text-align:left;}

}
/*400*/
@media only screen and (max-width:400px){
    .f_phone{font-size: 33px;}
}
/*320*/
@media only screen and (max-width:320px){
    .navbar-brand{padding: 30px 5px; height: auto;}
    .ab_pic{display: none;}
    .ab_contxt{width: 100%;}
    .ab_contxt p{font-size: 16px;}  
    .f_phone{font-size: 33px;}
    .f_list{padding-top: 15%;}
    .f_con_list{margin: 0;}
   /*  .block_contact{margin-top:80%;} */
    .block_con{text-align:left;}
    .m01{margin-right: 10%;}
    

}
