﻿@charset "utf-8";
*{margin:0;padding:0;list-style:none;border:0;}
/* body */
body {margin:0; padding:0}
{width:100%; margin:0 auto; overflow:hidden}
.main_image {width:100%; height:422px; border-top:1px solid #d7d7d7; overflow:hidden; margin:0 auto; position:relative}
.main_image ul {width:9999px; height:100%; overflow:hidden; position:absolute; top:0; left:0}
.main_image li {float:left; width:100%; height:100%;}
.main_image li span {display:block; width:100%; height:100%}
.main_image li a {display:block; width:100%; height:100%}
.main_image li .img {background-size:auto 422px;background-position:center top;background-repeat:no-repeat;background-size: auto 100% !important;}
div.flicking_con {margin:0 auto; position:relative}
div.flicking_con .flicking_inner {position:absolute; top:360px; left:90px; z-index:999; width:300px; height:21px} /* 121126 */
div.flicking_con a {float:left; width:21px; height:21px; margin:0; padding:0; background:url('../images/btn_main_img.png') 0 0 no-repeat; display:block; text-indent:-1000px}
div.flicking_con a.on {background-position:0 -21px}
#btn_prev,#btn_next{z-index:11111;position:absolute;display:block;width:44px!important;height:133px!important;top:50%;margin-top:-69px;opacity: 0.325;}

#btn_prev:hover{opacity: 1;}
#btn_next:hover{opacity: 1;}

.STitle {
    padding-top: 120px;
    text-align: center;

}

.STitle h2 {
    font-size: 30px;
	font-weight: 400;
}

.STitle h2 span  {
    font-size: 14px;
    display: block;
    padding-top: 15px;
}


.WSTitle li span{line-height: inherit !important;font-size: 40px !important;font-family: microsoft yahei !important;font-weight: bolder !important;color: #4C9BF1 !important;}


.WSTitle{padding-bottom:50px !important;}





/*about service contact*/

.ibox{ background: #373d41;  margin-top: 53px;}



.ibox  .block{margin: 0 auto;width: 1260px;

}








.ibox .iabout,

.ibox .iservice,

.ibox .icontact{ float: left; position: relative; width:33.333%;}

.ibox div img{ width:100%; max-width:100%; float:left;}

.ibox div .hover{ display: none; background: rgba(0,0,0,.4); position: absolute; z-index: 2; left:0; top:0; width: 100%}

/*切换*/

#about{ height: 500px; }



.ibox div .hover{ position: absolute; z-index: 2; left:0; top:0; width: 100%; opacity: 0; display: block;

-webkit-transition: all 0.6s ease;-moz-transition: all 0.6s ease;transition: all 0.6s ease; top: 0;}

.ibox div .hover img{ display: block; float: none;}

.ibox div .hover .more{ background: #383735; line-height: 30px; font-size: 12px; text-align: center; color: #fff; text-indent: 10px; opacity: 0;-webkit-transition: all 1.0s ease;-moz-transition: all 1.0s ease;transition: all 1.0s ease; top: 0;}



.iabout:hover .hover,

.iservice:hover .hover,

.icontact:hover .hover{ opacity: 1; top: -9%}

.iabout:hover .hover .more,

.iservice:hover .hover .more,

.icontact:hover .hover .more{ text-indent: 0; opacity: 1 }



#news{ padding-top: 110px; }

#news .newstitle{ text-align:center; }

#newsbox{

    position: relative;

    display: block; padding-top:50px;

}

#newsbox:before {

    content: "";

    display: block;

    width: 0;

    height: 30px;

    border-left: 1px solid #fff;

    position: absolute;

    left: 50%;

    top: 50px;

    z-index: 9;

}

#newsbox:after {

    content: "";

    display: block;

    width: 0;

    height: 30px;

    border-left: 1px solid #4d9ff6;

    position: absolute;

    left: 50%;

    top: 20px;

}

#newsbox .Content{ position: relative; background: #4d9ff6; height: 600px;}

#newsbox .Content span{ position: absolute; display: block; margin:0; height: 100%; width: 100%;-webkit-transition: all 10.8s ease;-moz-transition: all 10.8s ease;transition: all 0.8s ease;}



.ibox div .hover .more{width:100%;position:relative;margin-top:0;}









#caseall{ padding:70px 0;margin:0 auto;width:1260px; }

#caseall ul{width: 101%;display: block;font-size: 0;margin-left: -0.5%;}

#caseall ul li{display: block;width: 24%;position: relative;overflow: hidden; float: left;margin-left: 0.5%;margin-right: 0.5%;padding: 0;margin-bottom: 1%;padding-top: 24%;margin-top: 0;}

#caseall ul li a{ width: 100%;display: block;}
#caseall ul li a img{position: absolute;bottom: 0;left: 0;width: 100%;-webkit-transition:all 0.4s ease 0s;
-moz-transition:all 0.4s ease 0s;
-o-transition:all 0.4s ease 0s;
-ms-transition:all 0.4s ease 0s;
transition:all 0.4s ease 0s;
transform:rotate(0deg);
-ms-transform:rotate(0deg);     /* IE 9 */
-moz-transform:rotate(0deg);    /* Firefox */
-webkit-transform:rotate(0deg); /* Safari 鍜?Chrome */
-o-transform:rotate(0deg); 
}
#caseall ul li:hover a img{
    -webkit-transform:scale(1.2, 1.2);
-moz-transform:scale(1.2, 1.2);
-o-transform:scale(1.2, 1.2);
-ms-transform:scale(1.2, 1.2);
transform:scale(1.2, 1.2);
-webkit-transition:all 0.4s ease 0s;
-moz-transition:all 0.4s ease 0s;
-o-transition:all 0.4s ease 0s;
-ms-transition:all 0.4s ease 0s;
transition:all 0.4s ease 0s;

}
#caseall ul li a .note{position: absolute;bottom: 0;left: 0;width: 100%;height: 36px;line-height: 36px;color: #fff;font-size: 15px;background: rgba(0,0,0,0.62);}
#caseall ul li a .note .tith3{float: left;margin-left: 5%;width: 65%;}
#caseall ul li a .note .authsor{float: right;width:25%;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;margin-right: 5%; }
#caseall ul li a .note .authsor .mname{float: right;}
#caseall ul li a .note .authsor .iconauthor{float: right;width: 21px; height: 21px;display:block;vertical-align: middle;margin-left: 10px;background: url(../../images/xianguo/iconauthor1.jpg) no-repeat center center;margin-top: 8px;}
#caseall ul li:hover a .note{display: none;}
#caseall ul li a .hoverh{position: absolute;top:0;left: 0;right: 0;bottom: 0;}
#caseall ul li a .hoverh .zhezhao{
-webkit-transform:translate(0px,100%);
-moz-transform:translate(0px,100%);
-o-transform:translate(0px,100%);
-ms-transform:translate(0px,100%);
transform:translate(0px,100%);

    position: absolute;top:0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,0.62);display: block;}
#caseall ul li a .hoverh .erweima{position: absolute;left:30%;top:12%;width: 40%;padding-top:40%;background: url(../../images/xianguo/erweima.jpg) no-repeat center center;background-size:100% 100%;
    -webkit-transform:scale(0, 0);
-moz-transform:scale(0, 0);
-o-transform:scale(0, 0);
-ms-transform:scale(0, 0);
transform:scale(0, 0);


}
#caseall ul li a .hoverh .line{position: absolute;left: 50%;top: 55%;height: 0px;width: 0%;border-bottom: 1px solid #fff;
    -webkit-transition:all 0.4s ease 0s;
-moz-transition:all 0.4s ease 0s;
-o-transition:all 0.4s ease 0s;
-ms-transition:all 0.4s ease 0s;
transition:all 0.4s ease 0s;opacity: 0;}
#caseall ul li a .hoverh .tith2{position: absolute;left: 0;top: 65%;width: 100%;text-align: center;color: #fff;font-size: 18px;font-weight: bold;}
#caseall ul li a .hoverh .contectnr{position: absolute;top: 80%;left: 0;width: 80%;padding-left: 10%;}
#caseall ul li a .hoverh .contectnr .iconls{width: 33.3%;display: block;float: left;height:20px;overflow:hidden;}
#caseall ul li a .hoverh .contectnr .iconls i{margin-left: 0%;display: block;width:20% ;float: left;height: 19px;}
#caseall ul li a .hoverh .contectnr .iconls i.browseicon{background:url(../../images/xianguo/browseicon.png) no-repeat center center;background-size:cover }
#caseall ul li a .hoverh .contectnr .iconls i.loveicon{background:url(../../images/xianguo/loveicon.png) no-repeat center center;background-size:cover}
#caseall ul li a .hoverh .contectnr .iconls i.authoricon{background:url(../../images/xianguo/authoricon.png) no-repeat center center;background-size:cover}
#caseall ul li a .hoverh .contectnr .iconls .num{width: auto;margin-left: 5%;color: #fff;font-size: 15px;line-height: 19px;}
#caseall ul li:hover a .hoverh .zhezhao{
-webkit-transition:all 0.4s ease 0s;
-moz-transition:all 0.4s ease 0s;
-o-transition:all 0.4s ease 0s;
-ms-transition:all 0.4s ease 0s;
transition:all 0.4s ease 0s;

-webkit-transform:translate(0px,0px);
-moz-transform:translate(0px,0px);
-o-transform:translate(0px,0px);
-ms-transform:translate(0px,0px);
transform:translate(0px,0px);

}
#caseall ul li:hover a .hoverh .erweima{
    -webkit-transition:all 0.4s ease 0s;
-moz-transition:all 0.4s ease 0s;
-o-transition:all 0.4s ease 0s;
-ms-transition:all 0.4s ease 0s;
transition:all 0.4s ease 0s;
    -webkit-transform:scale(1, 1);
-moz-transform:scale(1, 1);
-o-transform:scale(1, 1);
-ms-transform:scale(1, 1);
transform:scale(1, 1);

}
#caseall ul li:hover a .hoverh .line{
    width: 80%;
    left: 10%;
        -webkit-transition:all 0.4s ease 0s;
-moz-transition:all 0.4s ease 0s;
-o-transition:all 0.4s ease 0s;
-ms-transition:all 0.4s ease 0s;
transition:all 0.4s ease 0s;
opacity: 1;
}
#caseall ul li a .hoverh .tith2,#caseall ul li a .hoverh .contectnr{
    -webkit-transform:translate(0px,-20px);
-moz-transform:translate(0px,-20px);
-o-transform:translate(0px,-20px);
-ms-transform:translate(0px,-20px);
transform:translate(0px,-20px);    
    -webkit-transition:all 0.4s ease 0s;
-moz-transition:all 0.4s ease 0s;
-o-transition:all 0.4s ease 0s;
-ms-transition:all 0.4s ease 0s;
transition:all 0.4s ease 0s;
opacity: 0;
}
#caseall ul li:hover a .hoverh .tith2,#caseall ul li:hover a .hoverh .contectnr{
-webkit-transform:translate(0px,0px);
-moz-transform:translate(0px,0px);
-o-transform:translate(0px,0px);
-ms-transform:translate(0px,0px);
transform:translate(0px,0px);    
    -webkit-transition:all 0.4s ease 0s;
-moz-transition:all 0.4s ease 0s;
-o-transition:all 0.4s ease 0s;
-ms-transition:all 0.4s ease 0s;
transition:all 0.4s ease 0s;
opacity: 1;
}


































#btn_prev{background:url(../images/hover_left.png) no-repeat left top;left:100px;}
#btn_next{background:url(../images/hover_right.png) no-repeat right top;right:100px;}
.topus_box  a:hover{color: #fff;background: #4d9ff6 !important;text-decoration:none;} 


#search_div1 { position:absolute;   left: -139px;top:26px; width:165px; height:35px; border: 1px solid #e0e0e0;_border: 1px solid #e0e0e0;*border: 1px solid #e0e0e0;background: #fff; display:none;border-radius: 10px;}


.search_tta{width: 23px;
height: 24px;display: block; font-size:0;
cursor: pointer;background: url('../images/icon_top.png') no-repeat;background-size: 108px 35px;background-position: -8px -6px;}


.mobile_nav_hide{float:left;width:53px;height:25px; position:relative;  }

.mobile_nav_hide .btn-link{width: 23px;
height: 24px;cursor: pointer;position:relative; top:-7px;background:none;background: url('../images/icon_top.png') no-repeat;background-size: 108px 35px;background-position: -8px -6px;}

#service_028 .block {margin-left: 40px;
margin-right: 40px;
    background: url('../images/service_bg.jpg');
    height: 350px;
}
.nav  li{color:#666; }

header .nav > li{margin-right:0 !important;}

.active a {color:#fff !important;background: #4d9ff6 !important;}

header .nav > li:hover a{color:#fff !important;background: #4d9ff6 !important;}


.navbar-collapse .nav{float:left;width:630px;height:43px;margin-top: 25px;}

.navbar-collapse  .nav li{list-style-type:none;margin-right:10px;float:left;width:auto;padding-right:10px;}


.navbar-collapse  .nav li a{display: block;font-size: 14px;line-height: 40px;font-weight: normal;color: #666;padding:0 16px;text-align: center;}















