@charset "utf-8";
/* CSS Document */
body{font-family:"Helvetica Neue", Helvetica, Microsoft Yahei, Hiragino Sans GB, WenQuanYi Micro Hei, sans-serif; background:#e9e9e9; color: #FFFFFF; font-size: 14px; width: 100%; overflow-x:hidden; position: relative;}
.mainBox{width: 100%; max-width: 1920px; margin: 0 auto;}
.sideBar{width: 15.6%; max-width: 300px; margin:0 2.5% 0 3%; background: #FFFFFF; text-align: center; position: fixed; top: 40px; right: 100%;
    -moz-transition: width 677ms,height 677ms,opacity 677ms,right 477ms;
    -o-transition: width 677ms,height 677ms,opacity 677ms,right 477ms;
    -webkit-transition: width 677ms,height 677ms,opacity 677ms,right 477ms;
    transition: width 677ms,height 677ms,opacity 677ms,right 477ms;}
.sideBarBtn{display: none; position: fixed; top: 50vh; left: 0; z-index: 1000; cursor: pointer; width:3%; max-width: 57px;}
.sideBar li{border-bottom: 1px solid #e0e0e0; }
.sideBar li a{display: block; width: 100%; text-align: center; position: relative; overflow: hidden; -webkit-perspective:200; perspective-origin:center;}
.sideBar li img{width: 100%; max-width: 300px;}
.sideBar .home{position: relative; border: none; height: 32px;}
.sideBar .vision{border: none;}
.sideBar .home a{display: inline-block; width: 100%; line-height: 32px; font-size: 14px; background: #212121; color: #FFFFFF; text-indent: -16px;}
.sideBar .home span{display: block; position: absolute; top: 0; right: 0;  background: #5f5f5f; margin: 0; cursor: pointer;}
.sideBar .home img{width:32px; height: 32px; padding: 10px; margin: 0; -moz-transition: all 477ms; -o-transition: all 477ms; -webkit-transition: all 477ms; transition: all 477ms; -moz-transform: rotateZ(0deg); -ms-transform: rotateZ(0deg); -o-transform: rotateZ(0deg); -webkit-transform: rotateZ(0deg); transform: rotateZ(0deg);}
.sideBar .home img:hover{-moz-transform: rotateZ(180deg); -ms-transform: rotateZ(180deg); -o-transform: rotateZ(180deg); -webkit-transform: rotateZ(180deg); transform: rotateZ(180deg);}
.mainBox .slideIn{opacity: 1; right:80%;}
.mainBox .sideBar.open{opacity: 1; right: 100%;}
/*.sideBar .web img{width:20%; max-width: 46px;}
.sideBar .app img{width:18%; max-width: 41px;}
.sideBar .vis img{width:21.6%; max-width: 38px;}
.sideBar .vision img{width:21.6%; max-width: 65px;}*/
.mainBox .main{float: right;
	-moz-transition: all 677ms;
    -o-transition: all 677ms;
    -webkit-transition: all 677ms;
    transition: all 677ms;}
.mainBox .rightMove3d {-moz-transform: translate3d(-480px,0,0); -ms-transform: translate3d(-480px,0,0); -o-transform: translate3d(-480px,0,0); -webkit-transform: translate3d(-480px,0,0); transform: translate3d(-480px,0,0);}
.mainBox .main.open {width: 100%; margin: 0;}
.mainBox .main.index{margin:40px 2.5% 0 0; width:77%; max-width: 1440px;}
.main .bannerBox{width: 100%; position: relative;}
.main .bannerBox img{width: 100%;}
.dotBox{position: absolute; left: 50%; bottom: 10px; margin-left: -12px;}
.dotBox li{width: 10px; height: 10px; background: url(../Images/dot.png) no-repeat left center; display: inline-block; padding: 0 6px; cursor: pointer;}
.dotBox .currentLi{background: url(../Images/dot_current.png) no-repeat left center;}
.main .info{padding: 2.5% 0 0 2.5%; background-color: #FFFFFF;}
.main .info .team, .main .info .aboutUs, .main .info .contact{float: left; display: none;}
.main .info .team{width: 23.5%; max-width: 340px;}
.main .aboutUs{margin:1.6% 4.7% 0 4.5%; width: 37%; max-width: 505px; text-align: justify;}
.main .contact{width: 30%; max-width: 425px; margin-top: 1.6%;}
.aboutUs dt span{font-size: 16px; padding: 5px 8px; background-color: #000000; display: inline-block;}
.contact p span, .contact p label{font-size: 16px; padding: 5px 8px; background-color: #000000; display: inline-block;}
.contact p label{color: #FFFFFF; background-color: #545454; padding: 5px 12px;}
.aboutUs dd{color: #666; font-size: 14px; line-height: 26px;}
.contact img{width: 82%; max-width: 323px; margin: 10% 0 5% 0;}
.contact .address{color: #545454; text-align: justify; font-size: 14px; display: block;}
.main .caseBtn{background: #FFFFFF; display: none;}
.main .caseBtn img{width: 100%; margin-top: -20px; cursor: pointer;}
.main .caseBtn .hide{display: none;}
.main .caseBox{display:none; text-align: center; margin: 20px 15px 0 15px;}
.main .caseBox .case img{width:100%}
.main .caseBox .moreBtn{width: 100%; text-align: center; margin-top: 10px; padding: 0 8px;}
.main .caseBox .moreBtn .more{width:100%; background: #E0E0E0;}
.main .caseBox .moreBtn img{width: 24px; padding: 12px 0;}
.footerBox{display: none;}
.footerBox .navBox{padding: 7% 2.5% 2% 3%; border-bottom: 1px solid #dbdadc;}
.footerBox .navBox .logo{float: left; width: 8%; max-width: 141px; margin-right: 3%;}
.footerBox .nav{float: left; vertical-align: middle;}
.footerBox .nav li{display: inline-block; padding: 0 10px;}
.footerBox .nav li a{color: #666666; font-size: 12px; line-height: 32px;}
.footerBox .weibo, .footerBox .weixin{float: right; margin-left: 16px;}
.footerBox .copyRight{padding: 2% 2.5% 2% 3%;}
.footerBox .copyRight img{margin-right: 10px;}
.footerBox .copyRight a{float: left; color: #666666; font-size: 12px; line-height: 22px;}
.footerBox .copyRight i{float: right; color: #999; font-size: 12px; line-height: 22px;}
@media only screen and (max-width: 1440px) {
	.aboutUs dt span, .contact p span, .contact p label{font-size: 14px;}
	.aboutUs dd{font-size: 12px; line-height: 22px; margin-top: 12px;}
	.contact .address{font-size: 12px; line-height: 18px;}
	/*.sideBar li img{margin: 21.3% 0;}*/
}
/*web设计*/
.webPage .sideBar .web{background: #4b4b4b;}
.main .caseList{width: 100%; margin: 0 auto; background: #FFFFFF; position: relative;
	-moz-transition: all 677ms;
    -o-transition: all 677ms;
    -webkit-transition: all 677ms;
    transition: all 677ms;}
.main .caseList.fullPage{width: 98%; margin: 0 auto;}
/*.main .caseList img{width:24.6% ; padding: 8px;}*/
.main .case{text-align: center;}
.main .case a{display: inline-block; width:22.9%; margin: 8px; position: relative;}
.main .case a img{width: 100%;}
.main .case a p{position: absolute; left: 0; top: 0; background: rgba(0,0,0,.55); width: 100%; height:100%; display: none; color: #FFFFFF; vertical-align: middle; text-align: center;}
.main .case a p:after {display:inline-block; width:0; height:100%; vertical-align:middle; content:"";}
.main .case a:hover p{ display: inline-block;}
.main .caseList .title{width: 100%; font-size: 16px; line-height: 56px; padding-left: 20px; background: #212121;}
.main .caseList .case{padding:30px 20px; }
.main .caseList .sideBarBtn{width:3%; max-width: 57px; padding: 0;}


/*视觉*/
.visionPage .main .case{text-align: left;}
.visionPage .main .caseList dt{background: url(../Images/line.png) no-repeat 10% center; background-size: 100%;}
.visionPage .main .caseList dt h5{color: #333333; display: inline-block; font-size: 15px; line-height: 21px; font-weight: normal; text-align: right; width: 8%; background: #fff; padding-right: 14px;}
.visionPage .main .caseList dd{margin-left: 7%;}

/*关于我们*/
.text{padding-bottom: 40px; text-align: center;}
.text p{width: 80%; margin: 0 auto; color: #666666; text-align: justify; font-size: 14px; line-height: 30px; padding: 40px 0;}
.text .aboutImg{width: 30%; max-width: 430px;}
.face{position:relative; backface-visibility:hidden; -webkit-transform-origin:center center; -moz-transform-origin: center center; transform-origin: center center; top: 0; opacity: 1;
	-webkit-transform-style: preserve-3d;
	-webkit-transition: 0.5s;
	-moz-transform-style: preserve-3d;
	-moz-transition: 0.5s;}
.down{position: absolute; top: 100%; left: 0; width: 100%;  backface-visibility:hidden; -webkit-transform-origin:center top; opacity:0; height:100%; z-index:3; padding:0; 
	-webkit-transform-style: preserve-3d;
	-webkit-transition: 0.5s;
	-moz-transform-style: preserve-3d;
	-moz-transition: 0.5s;}
/*.sideBar li:hover{-webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg);}*/
.sideBar li:hover >a .down{opacity:1; top:0;}
.sideBar li:hover >a .face{opacity:0; top: -100%;}
@media only screen and (min-width:1600px ) {
	.footerBox{padding-left: 23%;
	-moz-transition: all 677ms;
    -o-transition: all 677ms;
    -webkit-transition: all 677ms;
    transition: all 677ms;}
	.full{padding-left: 0;}
}

/*联系我们*/
.contactBox{color: #666666;}
.contactInfo{width: 90%; margin: 0 auto; text-align: center; padding-bottom: 20px;}
.contactInfo .tel_Img{display: block; margin-top: 20px; width: 45%; max-width: 430px; float: left;}
.contactInfo .message{text-align: left;}
.contactBox .contactInfo .left{width: 47%; float: left;}
.contactBox .contactInfo .right{width: 47%; float: right;}
.contactBox .radio{margin: 20px 0;}
.contactBox .radio label{margin-right:4px ;}
.contactBox .input{width: 100%;}
.contactBox .input input, .contactBox textarea{width: 100%; border: none;  font-family:"Helvetica Neue", Helvetica, Microsoft Yahei, Hiragino Sans GB, WenQuanYi Micro Hei, sans-serif; color: #666666; font-size: 14px; line-height: 32px; background-color: #E8E8E8;}
.contactBox .input input{display: block; padding-left: 10px; height: 32px; margin-bottom: 10px; }
.contactBox textarea{text-indent: 10px;}
.contactInfo button{padding:6px 18px; font-size: 14px; font-family:"Helvetica Neue", Helvetica, Microsoft Yahei, Hiragino Sans GB, WenQuanYi Micro Hei, sans-serif; text-align: center; background:#f4694a; color: #FFFFFF; margin-top: 20px;}
.mapBox{margin-top: 40px;}
.map{width: 47%; float: right; height: 100%; min-height: 300px;
	-moz-transition: all 677ms;
    -o-transition: all 677ms;
    -webkit-transition: all 677ms;
    transition: all 677ms;}
	.full{padding-left: 0;
}
#allmap{width: 100%; height: 300px}