/*
  author  : 5syx.cn
*/
#caseCon {
	padding: 80px 0px 50px 80px; height: 620px;
}
.case-pic {
	width: 650px; height: 620px; float: left; position: relative;
}
.case-pic .case-bigpic {
	background: url("../img/bg-case.png") no-repeat left top; padding: 25px 0px 0px 24px; width: 630px; height: 500px;
}
.case-pic .case-bigpic img {
	width: 604px; height: 348px; display: block;
}
.case-pic .keyboard {
	left: 68px; width: 39px; height: 50px; bottom: 20px; position: absolute;
}
.case-pic .mouse {
	width: 134px; height: 43px; right: 20px; bottom: 20px; position: absolute;
}
.case-txt {
	width: 370px; margin-right: 20px; float: right;
}
.case-txt h1 {
	color: rgb(0, 0, 0); line-height: 70px; font-size: 24px; font-weight: normal;
}
.case-txt .case-list li {
	color: rgb(89, 87, 87); line-height: 34px;
}
.case-txt .case-list li a:hover {
	text-decoration: underline;
}
.content-info {
	padding: 30px; color: rgb(102, 102, 102); line-height: 200%; font-size: 15px;
}
.content-info p {
	padding: 4px 0px; text-indent: 2em;
}

.service {
	background: url("../img/bg-service.jpg") no-repeat top; width: 100%; height: 299px;
}
.service-wrap .hd {
	height: 120px; padding-top: 120px;
}
.service-wrap .hd strong {
	background: url("../img/bg-sline.png") no-repeat center 80px; height: 110px; color: rgb(255, 255, 255); font-size: 52px;
}
.service-wrap .bd {
	text-align: center;
}
.service-wrap .bd h4 {
	color: rgb(255, 255, 255); font-size: 18px; font-weight: normal;
}

/* online server  */
.OnlineService {
	background: width: 100%; height: 299px;
}

.project {
	margin: 80px auto 30px; width: 1140px;
}
.project li {
	width: 46%; margin-bottom: 60px; float: left;
}
.project li.pro-itemr {
	margin-left: 8%;
}
.project li .icon-pro {
	background: url("../img/bg-icon-pro.png") no-repeat; width: 138px; height: 138px; margin-right: 15px; float: left; display: block;
}
.project li .proitem1 {
	background-position: 0px -138px;
}
.project li .proitem1:hover {
	
}
.project li .proitem2 {
	background-position: -138px -138px;
}
.project li .proitem2:hover {
	background-position: -138px 0px;
}
.project li .proitem3 {
	background-position: -276px -138px;
}
.project li .proitem3:hover {
	background-position: -276px 0px;
}
.project li .proitem4 {
	background-position: -414px -138px;
}
.project li .proitem4:hover {
	background-position: -414px 0px;
}
.project li .pro-r {
	width: 350px; float: left;
}
.project li .pro-r h2 {
	color: rgb(0, 0, 0); line-height: 42px; padding-bottom: 8px; font-size: 18px; font-weight: normal;
}
.project li .pro-r p {
	color: rgb(89, 87, 87); line-height: 20px;
}
.project li .schedule {
	background: rgb(170, 171, 171); border-radius: 10px; width: 100%; height: 22px; text-align: center; margin-top: 14px; position: relative;
}
.project li .schedule .line-sc {
	background: rgb(232, 64, 79); border-radius: 10px; left: 0px; top: 0px; height: 22px; color: rgb(255, 255, 255); line-height: 22px; font-size: 14px; font-weight: bold; position: absolute;
}
.next-service {
	text-align: center; padding-bottom: 80px;
}
.next-service h5 {
	color: rgb(0, 0, 0); line-height: 60px; font-size: 30px; font-weight: normal;
}
.next-service p {
	color: rgb(114, 113, 113); line-height: 32px; font-size: 18px;
}
.workslogon {
	background: url("../img/bg-workslogon.jpg") no-repeat top; width: 100%; height: 420px;
}
.workslogon .idea {
	margin: 0px auto;
	width: 854px;
	padding-top: 65px;
}
.workslogon .idea .hd {
	background: url("../img/bg-idea2.png") no-repeat;
	width: 854px;
	height: 190px;
}
.workslogon .idea .hd li {
	padding: 35px 0px 0px 24px;
	width: 130px;
	height: 130px;
	float: left;
}
.workslogon .idea .hd li strong {
	padding-top: 15px; font-size: 30px;
}
.workslogon .idea .hd li span {
	font-size: 24px;
}
.workslogon .idea .hd li.idea-item1 {
	padding-left: 95px;
}
.workslogon .idea .bd {
	text-align: center; color: rgb(255, 255, 255); padding-top: 10px;
}
.workslogon .idea .bd strong {
	line-height: 60px; font-size: 30px; font-weight: normal;
}
.workslogon .idea .bd p {
	line-height: 26px; font-size: 14px;
}
.manage {
	background: url("../img/bg-manage.jpg") no-repeat top; width: 100%; height: 570px;
}
.manage-wrap {
	margin: 0px auto; width: 840px; color: rgb(255, 255, 255); padding-top: 58px;
}
.manage-wrap .managetitle {
	text-align: center; font-size: 30px; font-weight: normal;
}
.manage-wrap .managetab {
	margin: 0px auto; padding: 35px 0px 30px; width: 248px;
}
.manage-wrap .managetab a {
	border: 1px solid rgb(0, 162, 233); width: 120px; height: 28px; text-align: center; color: rgb(255, 255, 255); line-height: 27px; font-size: 14px; text-decoration: none; float: left; cursor: pointer;
}
.manage-wrap .managetab a.on {
	background: rgb(0, 162, 233);
}
.manage-wrap .managetab dd {
	text-align: center;
}
.manage-wrap .managetab dd img {
	display: block;
}
.browser {
	padding: 65px 0px; text-align: center;
}
.browser h4 {
	color: rgb(0, 0, 0); line-height: 80px; font-size: 48px; font-weight: normal;
}
.browser img {
	padding: 30px 0px;
}
.browser p {
	color: rgb(89, 87, 87); line-height: 28px;
}
.about-us {
	background: url("../img/about_company.jpg") no-repeat top; width: 100%; height: 535px; color: rgb(255, 255, 255);
}

.about-5s {
	background: url("../img/5sbg.png") no-repeat top;
	width: 100%;
	height: 260px;
	color: rgb(255, 255, 255);
}

.case-info {
	background: url("../img/case_bg2.jpg") no-repeat top; width: 100%; height: 162px; color: rgb(255, 255, 255);
}

.Product-info {
	background: url("../img/prdbanner.jpg") no-repeat top; width: 100%; height: 260px; color: rgb(255, 255, 255);
}


.about-item {
	transition:0.2s ease-out; width: 170px; padding-top: 152px; padding-left: 170px; float: left; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out;
}
.about-item h2 {
	background: url("../img/about-item.png") no-repeat; margin: 0px auto; width: 169px; height: 139px; text-align: center; padding-top: 45px; font-weight: normal; display: inline-block;
}
.about-item h2 span {
	display: block;
}
.about-item h2 .abhh {
	line-height: 50px; font-size: 30px;
}
.about-item h2 .abft {
	font-size: 24px;
}
.about-item .about-info {
	text-align: center;
}
.about-item .about-info p {
	line-height: 22px;
}
.about-item:hover {
	margin-top: -12px;
}
.know-wrap {
	width: 1100px;
	height: 400px;
}
.5s-wrap {
	width: 1100px;
	height: 400px;
}
.Team-wrap {
	margin: 10px auto;
	width: 1100px;
}


.Team-wrap p {
	line-height: 24px;
	text-indent: 2em;
	padding-bottom: 8px;
	font-size: 14px;
	color:#FFFFFF
}

.know-wrap h3 {
	text-align: center; color: rgb(0, 162, 233); line-height: 32px; padding-bottom: 20px; font-size: 18px; font-weight: normal;
}

.5s-wrap h3 {
	text-align: center; color: rgb(0, 162, 233); line-height: 32px; padding-bottom: 20px; font-size: 18px; font-weight: normal;
}


.know-wrap p {
	color: rgb(0, 0, 0);
	line-height: 24px;
	text-indent: 2em;
	padding-bottom: 8px;
	font-size: 14px;
}

.5s-wrap p {
	color: rgb(0, 0, 0);
	line-height: 24px;
	text-indent: 2em;
	padding-bottom: 8px;
	font-size: 12px;
}

.environment {
	background: url("../img/bg-environment.jpg") no-repeat top; width: 100%; height: 348px;
}
.envir-wrap .envir-info {
	margin: 0px auto; width: 450px; text-align: center; padding-top: 75px;
}
.envir-wrap .envir-info strong {
	color: rgb(255, 255, 255); line-height: 50px; font-size: 24px; font-weight: normal;
}
.us-team {
	background: url("../img/bg_u_team.jpg") no-repeat top;
	width: 100%;
	height: 888px;
}
.team-wrap {
	padding-top: 50px;
}
.team-wrap .hd strong {
	color: rgb(255, 255, 255);
}
.team-wrap .team-info h3 {
	text-align: center; color: rgb(255, 255, 255); line-height: 70px; font-size: 18px; font-weight: normal;
}
.team-members {
	margin-top: 50px;
}
.team-members ul {
	margin-left: 0px;
}
.team-members .temp-item {
	width: 200px;
	color: rgb(255, 255, 255);
	padding-left: 15px;
	float: left;
}
.team-members .temp-item img {
	width: 250px; height: 250px; padding-bottom: 30px; display: block;
}
.team-members .temp-item .t-qq {
	background: url("../img/bg-contactqq.png") no-repeat; width: 42px; height: 42px; float: right; display: block;
}
.team-members .temp-item .t-name {
	text-align: center;
}
.team-members .temp-item .t-name h4 {
	line-height: 24px; font-size: 24px; font-weight: normal;
}
.team-members .temp-item .t-name span {
	line-height: 28px; font-size: 12px;
}
.team-members .temp-item dd p {
	text-align: center; line-height: 22px;
}
.team-members .temp-item:hover {
	-webkit-animation: pulse 1s .2s ease both; -moz-animation: pulse 1s .2s ease both;
}
#map {
	height: 395px;
}
.contact-wrap {
	color: rgb(255, 255, 255);
	position: relative;
	z-index: 999;
}
.contact-wrap .contact-add {
	background: url("../img/contact-add.png") no-repeat;
	left: 250px;
	top: 100px;
	width: 310px;
	height: 223px;
	padding-top: 15px;
	padding-left: 20px;
	position: absolute;
}
.contact-wrap .contact-add h2 {
	line-height: 40px; font-size: 18px; font-weight: normal;
}
.contact-wrap .contact-add p {
	line-height: 26px;
}
.contact-wrap .contact-us {
	left: 742px; top: 158px; width: 400px; height: 200px; position: absolute;
}
.contact-wrap .contact-us h2 {
	line-height: 48px; font-size: 30px; font-weight: normal;
}
.contact-wrap .contact-us li {
	background: url("../img/bg-contactqq.png") no-repeat; margin: 12px 0px; width: 148px; height: 42px; padding-left: 48px; float: left; cursor: pointer;
}
.contact-wrap .contact-us li a {
	color: rgb(255, 255, 255);
}
.contact-wrap .contact-us li h3 {
	line-height: 20px;
}
.attention {
	padding-top: 20px;
}
.attention li {
	margin: 25px 65px; width: 265px; float: left; display: block;
}
.attention li h2 {
	line-height: 50px; font-size: 18px; font-weight: normal;
}
.attention li img {
	width: 265px; height: 265px; display: block;
}
.attention .attent-con {
	width: 265px; height: 125px; overflow: hidden; position: relative;
	padding: 16px 0 0; line-height: 24px; color: #555555;
}
.attention .attent-con .attenttxt {
	background: rgb(0, 0, 0); width: 265px; height: 265px; bottom: 265px; position: absolute; opacity: 0.8;
}
.attention .attent-con .attenttxt .nn {
	padding: 110px 0px 0px; text-align: center; color: rgb(255, 255, 255); font-family: 微软雅黑; font-size: 20px;
}
.attention .attent-con .attenttxt .en {
	padding: 10px 0px 0px; text-align: center; color: rgb(255, 255, 255); font-family: 微软雅黑; font-size: 14px;
}
.appointment {
	margin-top: 40px; border-top-color: rgb(217, 217, 217); border-top-width: 1px; border-top-style: solid;
}
.present {
	padding: 30px 0px;
}
.present-info {
	text-align: center; color: rgb(137, 137, 137);
}
.present-info h3 {
	line-height: 48px; padding-bottom: 10px; font-size: 24px; font-weight: normal;
}
.present-info p {
	line-height: 24px; font-size: 14px;
}
.mation-form {
	padding-top: 30px;
}
.mation-form .ipt {
	width: 100%;
}
.mation-form .one-third {
	width: 19%;
	margin-right: 6%;
	margin-bottom: 21px;
	float: left;
}
.mation-form .one-third input {
	width: 97%;
}
.mation-form .lastcolumn {
	margin-right: 0%;
}
.mation-form input {
	padding: 2px 10px; border-radius: 5px; border: 1px solid rgb(229, 229, 229); height: 40px; color: rgb(85, 85, 85); line-height: 24px; font-size: 14px; font-weight: 400; margin-bottom: 10px; display: inline-block; background-color: rgb(255, 255, 255); -webkit-border-radius: 5px; -moz-border-radius: 5px;
}
.mation-form textarea {
	padding: 2px 10px; border-radius: 5px; border: 1px solid rgb(229, 229, 229); height: 40px; color: rgb(85, 85, 85); line-height: 24px; font-size: 14px; font-weight: 400; margin-bottom: 10px; display: inline-block; background-color: rgb(255, 255, 255); -webkit-border-radius: 5px; -moz-border-radius: 5px;
}
.mation-form input:focus {
	border: 1px solid rgb(19, 192, 223); transition:border 0.2s linear, box-shadow 0.2s linear; -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; -o-transition: border linear 0.2s, box-shadow linear 0.2s; -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
}
.mation-form textarea:focus {
	border: 1px solid rgb(19, 192, 223); transition:border 0.2s linear, box-shadow 0.2s linear; -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; -o-transition: border linear 0.2s, box-shadow linear 0.2s; -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
}
.mation-form .maintextarea {
	width: 98%; height: 80px; margin-bottom: 20px;
}
.mation-form .centered {
	text-align: center; margin-bottom: 15px;
}
.mation-form .verification {
	width: 100px;
}
.mation-form .submit-btn {
	background: rgb(19, 192, 223); border: currentColor; width: 240px; color: rgb(255, 255, 255); font-size: 14px; font-weight: 800;
}
.mation-form .submit-btn:hover {
	cursor: pointer; background-color: rgb(16, 203, 236);
}
.contact_bg
{
	background-image: url(../img/contact_bg.jpg);
	background-repeat: no-repeat;
}
/* map  */
.contactBox {
	background: rgb(31, 38, 54); margin: 50px 0px 20px; overflow: hidden; position: relative;
}
.contactBox:hover #dituContent {
	opacity: 1;
}
#dituContent {
	transition:0.2s linear; height: 550px; opacity: 0.8; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;
}
.contactBox::after {
	left: 0px; top: 0px; width: 100%; bottom: 0px; display: block; position: absolute; z-index: 99; content: "";
}
.contactBox:hover::after {
	display: none;
}
.mapBox {
	overflow: hidden; position: relative;
}
.mapBox::before {
	background: url("../images/mapIcon.png") no-repeat; transition:0.1s ease-in; left: 50%; top: 0px; width: 123px; height: 248px; margin-left: -61px; display: block; position: absolute; z-index: 100; content: ""; -webkit-transition: 0.2s ease-in 0s; -moz-transition: 0.2s ease-in 0s; -o-transition: 0.2s ease-in 0s;
}
.contactBox:hover .mapBox::before {
	margin-top: -248px;
}
.iw_poi_title {
	color: rgb(204, 85, 34); overflow: hidden; padding-right: 13px; font-size: 14px; font-weight: bold; white-space: nowrap;
}
.iw_poi_content {
	font: 12px/normal arial, sans-serif; overflow: visible; padding-top: 4px; -ms-word-wrap: break-word; font-size-adjust: none; font-stretch: normal;
}
.contactFoot {
	padding: 20px 10px; transition:0.1s ease-in; left: 0px; right: 0px; bottom: 0px; color: rgb(255, 255, 255); position: absolute; z-index: 101; -webkit-transition: 0.2s ease-in 0s; -moz-transition: 0.2s ease-in 0s; -o-transition: 0.2s ease-in 0s;
}
.contactBox:hover .contactFoot {
	background: rgba(0, 0, 0, 0.5);
}
.contactFoot dl {
	width: 24.5%;
	float: left;
}
.contactFoot dt {
	padding-bottom: 5px; font-size: 18px;
}
.contactFoot dd {
	padding: 5px 0px 0px; font-size: 12px;
}
.contactFoot dd a {
	color: rgb(255, 255, 255);
}
.qqBtn {
	padding-top: 5px; display: inline-block;
}
.telBtn {
	padding-top: 5px; display: inline-block;
}
.qqBtn::before {
	background: url("../img/Cicon.png") no-repeat 0% 0% / 25px 50px; width: 26px; height: 25px; margin-right: 5px; vertical-align: middle; display: inline-block; content: "";
}
.telBtn::before {
	background: url("../img/Cicon.png") no-repeat 0% 0% / 25px 50px; width: 26px; height: 25px; margin-right: 5px; vertical-align: middle; display: inline-block; content: "";
}
.telBtn::before {
	background: url("../img/Cicon.png") no-repeat 0px bottom / 25px 50px;
}
