html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

ul,li{list-style: none;}
body {
	font-family: "微软雅黑",Arial,Helvetica,sans-serif;color:#333;
	color: #666;
	overflow-x: hidden;
	 font-size: 12px;
}

img {
	max-width: 100%;
	height: auto;
}


a:hover {
	text-decoration: none;
	color: #999;
}

.navbar-inverse{border:none;background:none;}
.carousel-control.left,.carousel-control.right{background:none;}
.navbar-inverse .navbar-brand{color: #fff;padding-left:0;}
.navbar-inverse .navbar-toggle{border:none;background: none;}
.navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus{ background:none;}
.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:hover, .navbar-inverse .navbar-nav>.active>a:focus{background: none;border-bottom: 2px solid #fff;}
.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form{border:none;}
/* .navbar-inverse .navbar-nav>li>a{position: relative;}
.navbar-inverse .navbar-nav>li>a i{ position: absolute;bottom:0;left:0;width: 0;height: 2px; background:#fff;display: block; }
.navbar-inverse .navbar-nav>li>a:hover i,.navbar-inverse .navbar-nav>.active>a i{width: 100%;transition:all 0.4s;} */
.navbar-wrapper {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 20;
}

/* Flip around the padding for proper display in narrow viewports */
.navbar-wrapper > .container {
  padding-right: 0;
  padding-left: 0;
}
.navbar-wrapper .navbar {
  padding-right: 15px;
  padding-left: 15px;
}
.navbar-wrapper .navbar .container {
  width: auto;
}

.carousel {
  height: 500px;
  margin-bottom: 40px;
  background-color: #4092f5;
  /* padding-top:100px; */
}
.navbar-inverse .navbar-nav>li>a{color:#fff; font-size: 14px;}
.navbar-nav{ float: right}

.featurette-divider {
  margin: 80px 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the productBox headings */
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  letter-spacing: -1px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
  bottom:20%;
  left:15%;
  width: 36%;
}
.carousel-caption p {
    margin-bottom: 20px;
    line-height: 1.4;
  }
/* Declare heights because of positioning of img element */
.carousel .item {
  height: 500px;

}
.carousel-inner > .item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 500px;
}

.banner-1 h3:first-child{animation-delay: 0.2s;}
.banner-1 p:nth-of-type(1){animation-delay: 0.5s;}
.banner-1 p:nth-of-type(2){animation-delay: 0.8s;}
/* ---------------------------------------------- */
.wrapperBox{padding-top:57px;}
.fl{float: left;}
.compayName{ padding-left:10px;}
.compayName span{font-weight: bold;padding-top: 10px;display: block}
.compayName p{font-size: 14px;}
.navLogo{ width: 40px; height: 40px;}
.b-secondTit{ font-size: 18px;}
.carousel-caption{text-shadow:none;}
.banner-1{ text-align:left;}
.banner-1 h3{ font-size: 30px;margin-bottom: 20px;}
.banner-1 p{ font-size: 14px;}
.banner-1 p.b-secondTit{font-size: 16px;}
.banner-1 .moreBtn{ width: 120px; height: 40px; line-height: 40px;text-align: center;color:#333;  display:block;border-radius:50px;background:#fff;}
.b-rightImg{ position: absolute; top:20%;right:15%;}
.sectionBox{margin:0 auto 0px;padding-bottom: 40px;}
.sectionBox .titBox{ background: url(../images/bigTitBg.png) center 9px no-repeat; margin-bottom: 40px; position: relative; text-align: center;color:#999;}
.sectionBox .titBox .titText h2{ font-size: 26px;margin-bottom: 5px;color:#333;}
.productBox{background:url(../images/product-Bg.jpg) no-repeat;padding:40px 0 40px;overflow: hidden; position: relative;}
.productBox .titBox .titText h2,.productBox .titBox .titText p{color:#fff;}
.productBox .productCon{overflow: hidden; /* background:#fff; */position: relative;width: 100%;min-height:200px;padding: 0px 20px 30px;border-radius: 6px 6px 0 0;}
.productBox .productCon ul li{ position: relative;background:#fff;float: left;width: 31%; border-radius:6px 6px 0 0;margin:0 10px 0 16px;border:1px solid #ddd;padding:0 0 10px 0;box-shadow: 4px 3px 7px 0 rgba(7,17,27,.05);}
.productBox .productCon ul li h3{ text-align: center;font-weight:bold;color:#fff;border-radius:6px 6px 0 0;font-size:16px;border-bottom:1px solid #ddd;padding:20px 8px 15px; }
.productBox .productCon ul li:last-child{margin-right: 0;}
.viewArrowBtn{ font-size: 30px; position: absolute;left:50%;margin-left:-15px;bottom: -20px; color:#a2dbfb;}
.viewArrowBtn:hover{color: #2aa6eb}
.productBox .p-BoxCon{padding: 5px 9px 20px 19px;overflow: hidden;}    
.productBox .p-BoxCon a{ float: left;border:1px solid #ddd; width: 47%;margin:10px 7px 0 0;padding:5px 4px;color:#333;font-size: 14px;}
/* .productBox .p-BoxCon a:last-child{margin-right: 0;width: 64%;text-align:left;} */


.projectBox{ /* background: #fafafa;padding:40px 0 30px; */}
.projectCon ul li{transition:all 0.5s;float: left; width: 30%;border:1px solid #f5f5f5; margin:10px 19px 15px; position: relative; background:rgba(252,252,252,0.4);box-shadow: 0 3px 3px 0 rgba(7,17,27,.05);border-radius: 10px;padding:30px 20px;}
.projectCon ul li a{ color:#666;}
.projectCon ul li:hover{transform:translate(0,-20px);}
.projectCon  ul li .p-leftImg{/* background: #edf6fe; */border-radius: 50px; width: 80px; height: 80px;text-align: center;color:#fff; position: absolute;left:20px;top:30px;}
.projectCon ul li:first-child .p-leftImg{background:rgba(37,178,122,0.1)}
.projectCon ul li:nth-of-type(2) .p-leftImg{background:rgba(250,180,1,0.1)}
.projectCon ul li:nth-of-type(3) .p-leftImg{background:rgba(171,93,233,0.1)}
.projectCon ul li:nth-of-type(4) .p-leftImg{background:rgba(2,181,249,0.1)}
.projectCon ul li:nth-of-type(5) .p-leftImg{background:rgba(233,93,93,0.1)}
.projectCon ul li:first-child .p-leftImg .incircleBg{background:rgba(37,178,122,1)}
.projectCon ul li:nth-of-type(2) .p-leftImg .incircleBg{background:rgba(250,180,1,1)}
.projectCon ul li:nth-of-type(3) .p-leftImg .incircleBg{background:rgba(171,93,233,1)}
.projectCon ul li:nth-of-type(4) .p-leftImg .incircleBg{background:rgba(2,181,249,1)}
.projectCon ul li:nth-of-type(5) .p-leftImg .incircleBg{background:rgba(233,93,93,1)}
.projectCon  ul li .p-leftImg span.incircleBg{width:60px;height:60px; display:block;background:#a2dbfb;border-radius: 50px; position: absolute;left:10px;top:10px;}
.projectCon  ul li .p-leftImg span{ font-size: 34px; z-index: 99; position: absolute;top:22px;left:22px;}
.projectCon  ul li .r-projectCon{width: 100%;padding:15px 10px 0 100px;}
.projectCon  ul li .r-projectCon h2{ font-size: 14px; font-weight:bold;margin-bottom: 10px;}

/*successDemo*/
.successBox{background-color:#fcfcfc;padding:40px 0;}
.portfolio-filter-btn-group .selected{ background-color: #fafafa;color:#4092f5;}
.portfolio-filter-btn-group{ text-align: center; margin:0 0 30px;overflow: hidden;}
.portfolio-filter-btn-group li a{margin:0px 10px;width:110px; height: 40px;border-radius: 20px; line-height: 40px; display: inline-block;font-size: 14px;color:#666;border:1px solid #ddd;}
.portfolio-filter-btn-group li a:link,.portfolio-filter-btn-group li a:hover{text-decoration: none;}
.grid {
	position: relative;
	clear: both;
	margin: 0 auto;
	padding: 1em 0 4em;
	max-width: 100%;
	list-style: none;
	text-align: center;
}

.grid h2{
    font-size: 20px;
}

.grid figure {
	position: relative;
	float: left;
	overflow: hidden;
	margin: 10px 1%;
	min-width: 100%;
	max-width: 100%;
	height: auto;
	/* background: #666; */
	text-align: center;
	cursor: pointer;
}

.grid figure img {
	position: relative;
	display: block;
	min-height: auto;
	max-width: 100%;
	opacity: 0.8;
}

.grid figure figcaption {
	padding: 2em;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
	pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}



figure.effect-bubba {
	/* background: #666; */
}

figure.effect-bubba img {
	opacity: 1;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
}

figure.effect-bubba:hover figcaption{opacity: 1;background:rgba(64,146,245,0.8);transition:all 0.2s; }
.figure.effect-bubba:hover img {
	opacity: 0.4;
}

figure.effect-bubba figcaption::before,
figure.effect-bubba figcaption::after {
	position: absolute;
	top: 30px;
	right: 30px;
	bottom: 30px;
	left: 30px;
	content: '';
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}

figure.effect-bubba figcaption::before {
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	-webkit-transform: scale(0,1);
	transform: scale(0,1);
}

figure.effect-bubba figcaption::after {
	border-right: 1px solid #fff;
	border-left: 1px solid #fff;
	-webkit-transform: scale(1,0);
	transform: scale(1,0);
}

figure.effect-bubba h2 {
	padding-top: 20%;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
    color: #fff;
    font-weight: 800;
    opacity: 0;
}

figure.effect-bubba p {
	padding: 20px 2.5em;
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(0,20px,0);
	transform: translate3d(0,20px,0);
}

figure.effect-bubba:hover figcaption::before,
figure.effect-bubba:hover figcaption::after {
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1);
}

figure.effect-bubba:hover h2,
figure.effect-bubba:hover p {
	opacity: 1;
 -webkit-transform: translate3d(0,-5px,0); 
	transform: translate3d(0,-5px,0);
}
/* .viewMoreBtn{	
	border:1px solid #ddd;
	display:block;
	text-align: center;
	margin: 40px auto 10px;
    width: 170px;
    height: 40px;
    border-radius: 20px;
    line-height: 40px;
	font-size: 14px;
	color: #333;
} */

.viewMoreBtn a{width: 170px;margin: 40px auto 10px;position: relative; color:#333; overflow: hidden;background: #fff;border:1px solid #ddd;
  display: block;text-align: center;height: 50px;line-height: 50px;font-size: 14px; border-radius: 30px;transition: all 0.6s cubic-bezier(0.785,0.135,0.150,0.860) 100ms;
}
.viewMoreBtn a span{
  display:block;width:100%;
  text-align: center;
  transition: all 0.6s cubic-bezier(0.785,0.135,0.150,0.860) 100ms;
  position: relative;
}
.viewMoreBtn a span:after{
    content:attr(data-tit);
    position: absolute;height: 100%;
    top:0px;left:0px;width:100%;border-radius: 30px;
    color:transparent;
    transform: translate(0,100%);
}
.viewMoreBtn a:hover{border:1px solid #4092f5;}
.viewMoreBtn a:hover span{color: transparent;transform: translate(0,-100%);}
.viewMoreBtn a:hover span:after{background-color: #4092f5;color:#fff;}



/*合作伙伴*/
.cooperativeBox{ margin-bottom: 0;padding: 40px 0;}
.cooperateBox{ overflow: hidden;}
.cooperateBox ul li{ float: left; width: 18%; text-align: center; padding:10px;  margin:0 9px; transition:background 0.5s ease-in-out; cursor: pointer; font-size: 16px}
.cooperateBox ul li:hover{transform:scale(1.1); transition:all 0.7s;}



/*footer*/
.contactUs{background: #1c1c1c; overflow: hidden; padding: 40px; color: #fff; clear:both;}
.maImgBox{ text-align: center}
.maImgBox .maImg{ width: 100px; height: 100px;}
.contactDetail{ font-size: 14px; text-align: left;}
.contactDetail h3{font-size: 14px; color: #fff;}
.contactDetail p{ margin:10px 0;}
.footerContainBox{width:1200px; margin:0px auto; padding:10px 0;}
.telImgBox{ background:url(../images/telImg.png) no-repeat; width:260px;  padding-left:60px;}
.telImgBox p{ font-size: 16px;}
.telImgBox p.telNum{ font-size:20px;color:#f7c014}
.s-navBox{background: #4094f6;}
.s-navBox .navbar{margin-bottom: 5px}
.s-navBox .navbar-brand{padding-top:7px; font-size: 16px;}
.contentBox{padding:10px 0px 10px; overflow:hidden;min-height:400px;}
.contactLeft{padding:1px; background: #fcfcfc;border-radius: 6px 6px 0 0}
.contactLeft ul li{padding:12px 10px;font-size: 14px;cursor:pointer; }
.contactLeft ul li:first-child{border-radius: 6px 6px 0 0}
.contactLeft ul li.cur{background: #3f93f5;color: #fff;font-weight: bold;}
.contactRight{padding: 10px 0 0 40px;}
.contactRight .r-contentList{display: none;}
.contactUsBox{width: 100%;margin:20px auto;overflow: hidden;}
.contactUsBox  h2{border-bottom: 1px solid #ddd; font-size: 18px; padding-bottom: 10px;}
.contactCon{padding:20px 0;}
.contactCon p{text-indent: 28px; font-size: 14px; line-height: 26px; }
.c-sort{margin-bottom: 10px;overflow: hidden;}
.c-sort p{width: 50%;float:left;}
.companyMap{width:100%;margin:0px auto;height:400px;border:1px solid #ddd}

.pageBox{ text-align: center;}
.pageBox .pagination>li>a,.pageBox .pagination>li>span{padding:12px 18px;font-size:14px;color:#333;}
.guiderNav{padding:15px 0px;/* margin-top:58px; */font-size: 14px; background: #fcfcfc; color:#333}
.guiderNav a{color:#333;}
.guiderNav a:hover{text-decoration: underline;}

.guiderNav span{border-left:5px solid #ddd;padding-left: 5px;}
.successList{background-color: #fff;padding:20px 0px;border-radius: 6px;overflow: hidden;}
.successList .portfolio-filter-btn-group{ text-align: right;}
.successList .portfolio-filter-btn-group li a{ text-align: center;}
.contentBox h2{ font-size:18px;}

/*case Detail*/
.projectIntro .p-instro{ line-height: 26px; font-size: 14px; }
.projectIntro .p-instro div{padding-bottom: 10px;}
.projectIntro h2{border-bottom: 1px solid #ddd; padding-bottom: 10px;}
.projectIntro .p-instro{padding:20px;}
.projectIntro .p-instro p{ text-indent: 28px;}
.projectIntro .p-IntroList{margin:20px;}
.computerBox{}

/*custom development*/

.dzList{ padding:20px 0;overflow:hidden;}
.dzList .dzContent{/* padding:0px 40px; */}
.dzList .dzContent .dzText{margin-top: 20px; line-height: 26px;}
.grayBg{ background:#fcfcfc;}
/*productList*/
.productListBox{}
.productListBox .productListCon{padding:20px 0;}
.productListBox .dzTitle{ border-left: 6px solid #4094f6;padding-left:10px;}
.productListBox .productListCon ul li{ position: relative;border:1px solid #ddd;color:#333;transform:translateY(0px);transition:all .2s;min-height:135px;padding:1px; text-align:center;font-size: 16px; margin:5px 10px 15px 0;float: left;width:32%;}
.productListBox .productListCon ul li:hover{transform:translateY(-10px);}
.productListBox .productListCon ul li h3{display: block;background-color:rgba(252,252,252,0.9);color: #31708f; transition:all 0.2s;padding:15px 10px; font-size: 14px;font-weight: bold;}
.productListBox .productListCon ul li a:hover{ /* color: #fff; */ }
.productBanner{color:#fff; text-align: center;background: url(../images/bg2.jpg) center no-repeat;padding-top:40px; height: 170px; }
.productBanner .p-titBox strong{ font-size: 20px;margin-bottom: 15px;display: block;}
.productBanner .p-titBox p{ font-size: 16px;}
.c-topBanner{background: url(../images/contactBg.jpg) center no-repeat; background-size:cover;}
.serverListBanner{background: url(../images/banner1.jpg) center no-repeat; background-size:cover;}
.productListBox .p-content{ border-top:1px solid #fff;position: relative;width:100%;color:#333;padding:10px 20px; text-align: left;min-height:80px;}
.productListBox .productListCon ul li .p-content a{ color: #666; font-size: 14px; text-align: left;padding:5px;display:block;}
.productListBox .productListCon ul li .p-content i{color:#666;margin-right:5px;}
.productListBox .productListCon ul li .p-content a:hover{text-decoration: underline;}
.productListBox .productListCon ul li:hover h3{background: #18b5f9;color: #fff}
/* .productListBox .productListCon ul li:hover .p-content a{color: #fff}
.productListBox .productListCon ul li:hover .p-content i{color:#fff;} */
.productDetailBox{padding:20px 0;}
.productDetailBox h2{text-align: center;padding:15px;border-bottom: 1px solid #ddd;}
.productDetailBox .p-detailCon {margin:60px 0 0;padding:40px 20px;border-radius: 10px; clear:both;overflow: hidden; background:#fcfcfc;}
.productDetailBox .p-detailCon h3{padding-bottom:10px;font-size:16px; text-align: center;}
.productDetailBox .p-detailCon .mainFunBox {margin-top: 10px;}
.productDetailBox .p-detailCon .mainFunBox span{ padding:10px 30px; margin:0px 10px 10px; text-align:center;border:1px solid #ddd;float:left;display:block;}
.productDetailBox .p-detailCon .mainFunBox i{margin-right: 5px;}
.productDetailBox .p-contentDetail{ clear:both; line-height: 26px; font-size: 14px;}
.productDetailBox .p-contentDetail p{text-indent: 28px;margin-bottom: 10px;}
.p-conImgBox{ padding:40px 0; }

/*serverList*/
.serverList{ position: relative; min-height: 350px;padding:40px 0;}
.serContent h3 .f_title{ font-size: 26px;color:#666;}
.serContent h3 .en{margin-top: 15px; display: block;font-style: normal; font-size: 18px;color:#999;}
.serContent h3 .line{width:100px; height: 1px; display: block; background: #cccccc; margin-top:20px;}
.serContent .serConBox{margin-top: 20px; line-height: 26px; text-indent: 28px;}
.serContent .serSort{overflow: hidden;margin:20px 0;}
.serContent .serSort span{border:1px solid #ddd; background:#fefefe;display:inline-block;margin:10px 5px 0 0; padding:5px 10px;}
/* .serverImgBox{position: absolute;height: 100%;bottom:0px;right: 0}
.serverImgBox2{position: absolute;height: 100%;bottom:0px;left: 0} */

@media only screen and (min-width :375px) and (max-width:767px){
.s-navBox{box-shadow: 0 3px 7px 0 rgba(7,17,27,.05); }
.s-navBox .navbar,.navbar-nav{margin-bottom: 0px}
.navbar-nav{ float: none;background:#fff;color:#666;}
.navbar-wrapper .navbar{padding:0;}
.navbar-inverse .navbar-nav>li>a{color:#333;}
.navbar-inverse .navbar-brand{padding-left:15px;}
.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:hover, .navbar-inverse .navbar-nav>.active>a:focus{color: #fff;background:#4092f5}
.navbar-inverse .navbar-nav>li>a:hover, .navbar-inverse .navbar-nav>li>a:focus{color: #333;}
.carousel{padding-top:0;}
.carousel-caption {width:92%;padding:2%;bottom: 0;left:5%;}
.b-rightImg{top:10%;right: 0;padding:0 8%;}
.banner-1 h3{font-size: 20px;margin-bottom: 10px;}
/*index*/
.wrapperBox{padding-top:50px;}
.projectCon ul li{ width: 100%;border:1px solid #f5f5f5; margin:10px 0 15px; }
.productBox{min-height: 730px;padding-bottom: 0}
.productBox .productCon ul li{width: 100%;margin:0 0 15px 0; }
.productBox .p-BoxCon a{width: 47%;}
.cooperateBox ul li{width:44%;}
.maImgBox{text-align: left;}
.contactDetail{margin: 20px 0;}
.sectionBox .titBox{margin-bottom: 20px;}
/*success demo*/
.guiderNav{padding:15px 0;}
.portfolio-filter-btn-group li a{ width:30%;margin:0 5px;float: left;}
.pageBox .pagination>li>a, .pageBox .pagination>li>span{padding:6px 12px;}
/*contactUS*/
.contactUsBox{margin:0px auto;width: 100%;}
.contactLeft{overflow: hidden;}
.contactLeft ul li{ float: left;width: 25%}
.contactRight{padding:20px 0 0;}
.contactLeft ul li:first-child{border-radius: 6px 0 0 6px;}
.contactLeft ul li:last-child{border-radius: 0px 6px 6px 0px;}
.contactRight .r-contentList{padding:15px 10px;}
.contentBox h2{font-size: 16px;}
/*dz-development*/
.dzList .dzContent{ padding:0;}

/*productList*/
.productListBox .productListCon ul li{width: 100%;}
}