@charset "utf-8";
/*!VIPABC | Author by Mike Li*/
/*!v2.0 | 2016-3-9*/
/*!License: vipabc.com*/


/*Reset*/
*{margin:0;padding:0;list-style-type:none;}

*html,*html body /* 修正IE6振动bug */{
	background-image:url(about:blank);
	background-attachment:fixed;
}
body{
	font-family:"Hiragino Sans GB" ,"Microsoft Yahei",Arial,Lucida,Verdana,SimSun,Helvetica,sans-serif;
	font-size:14px;
}

a,img{border:none;text-decoration:none;}
a{color:#333;blr:expression(this.onFocus=this.blur());} /*去掉a标签的虚线框，避免出现奇怪的选中区域*/
/*a:active {test:expression(target="_blank");}*/
:focus{outline:0;}
label{cursor:pointer;}
img{vertical-align:middle;}
table{empty-cells:show;border-collapse:collapse;border-spacing:0;}
h1{font-size:1.6em;}h2,h3,h4{font-size:1.4em;}h5,h6{font-size:1.2em;}
input{border:none;}
textarea{overflow:scroll;}

a, input,textarea, .hover-delay {
	font-family:"Hiragino Sans GB", "Microsoft Yahei",Arial,Lucida,Verdana,SimSun,Helvetica,sans-serif;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;

}
input.none-radius{
	border-radius:0;
	-moz-border-radius:0;
	-webkit-border-radius:0;
}

::-ms-clear{ display:none;}
::-ms-reveal { display: none; }

.clear{clear:both;}
.txt-indent{text-indent:-9999999px;overflow:hidden;}

input[type=text],input[type=tel],input[type=email], input[type=button]{
	-webkit-appearance: none;
	box-shadow: none;
}
input:-webkit-autofill,
    textarea:-webkit-autofill,
    select:-webkit-autofill {
        box-shadow:0 0 0 60px #fff inset;
        -webkit-text-fill-color: #000;
    }


/*Reset end*/
/* conmmon */
.button-animated:active{
	-webkit-transform:scale(0.9);
    -moz-transform:scale(0.9);
    -ms-transform:scale(0.9);
    -o-transform:scale(0.9);
    transform:scale(0.9);
    -webkit-box-shadow:0px 0px 20px #FFF;
    -moz-box-shadow:0px 0px 20px #FFF;
    -o-box-shadow:0px 0px 20px #FFF;
    box-shadow:0px 0px 20px #FFF;
}

/*-------------- wrapper -------------*/
.wrapper, .header-wrapper, .banner-info, .solution-canWe{
	width: 100%;
	height: auto;
}
.inside{width: 1000px; height: auto; margin: 0 auto;}

/*------------------- banner ----------------*/
.banner-wrapper{
	position: relative;
	width: 100%;
	height: 700px;
	background: url("../image/banner20160223.jpg") no-repeat center center;
	background-size: cover;
}
.header-wrapper{
	position:absolute;
	height: 63px;
	left:0;
	top:0;
	background: url("../image/head_bg.png") repeat;
}
.logo{
	display: inline-block;
	float: left;
	margin-top: 6px;
}
.logo img{width:155px;}
.logo-brief{
	display: inline-block;
	float: left;
	margin-left: 14px;
	line-height: 63px;
	font-size: 16px;
	color: #fff;
}
.tel-num{
	display: inline-block;
	float: right;
	margin-left: 8px;
	font-size: 16px;
	line-height: 63px;
	color: #fff;
}
.online-contact, .tel-contact{
	display: block;
	float: right;
	margin-top: 10px;
}
.online-contact{cursor:pointer;}
.tel-contact{margin-left: 13px;}
.tel-contact img,.online-contact img{width:43px;height:43px;}
.banner-info{
	text-align: center;
	color: #fff;
	padding-top: 130px;
}

.banner-info h1{
	font-size: 64px;

}
.banner-info h3{
	margin: 17px 0;
	font-size: 22px;
	letter-spacing: 2px;
	font-weight: normal;
}
.banner-info p{
	position:relative;
	width: 530px;
	margin: 0 auto;
	font-size: 13px;
}

.order-service{
	display: inline-block;
	width: 185px;
	height: 60px;
	margin: 40px auto 0 auto;
	border: solid 2px #fff;
	line-height: 60px;
	text-align: center;
	font-size: 22px;
	color: #fff;
}
.order-service:hover, .order-service:active{
	border-color: #ff4747;
	text-shadow: 2px 3px 2px #be1f1f;
	background-color: #ff4747;
}
.banner-arrow{
	position: absolute;
	left: 50%;
	bottom: 20px;
	z-index: 10;
	margin-left: -22px;

}

/*-------------- solution -------------*/
.solution-canWe{
	float:left;
	padding-bottom:90px;
}
.solution-canWe h3{
	text-align: center;
	margin-bottom: 55px;
	font-size: 30px;
}

.solution-canWe p.p-h3{
	text-align: center;
	font-size: 20px;
	letter-spacing: 4px;
}
.solution-list{
	float: left;
	width: 100%;
}
.solution-list li{
	float: left;
	width: 25%;
	text-align: center;
}
.solution-list li h4{
	margin: 10px 0 16px 0;
	color: #333;
	font-weight: normal;
}
.solution-list li p{
	width: 90%;
	margin: 0 auto;
	color: #656565;
}
/*-------------- role ---------------*/
.role ul{
	position: relative;
	height:616px;
}
.role ul li{
	position: absolute;
	width:50%;
	height:308px;
}
.role ul li.img-wrap{
	overflow: hidden;
}
.role ul .img-left{
	/*width:50%;*/
	/*height:308px;*/
	top:0;
	left:0;
	background:url(../image/sight0120160623.jpg) no-repeat right center;
}
.role ul .img-right{
/*	width:50%;
	height:308px;*/
	top:308px;
	right:0;
	background:url(../image/sight0220160623-2.jpg) no-repeat left center;
}
.role ul li.text-wrap{
	padding-top:70px;

}
.role ul li h3{
	color:#eb3c45;
	margin-bottom:45px;
}
.role ul li p{
	font-size:14px;
	color:#666666;
	width:auto;
}
.role .text_right{
	top:0;
	right:0;
	text-align: left;
	padding-left:35px;
	box-sizing: border-box;
}
.role .text_right div{
	padding-left:15px;
	border-left:10px solid #eb3c45;
}
.role .text_left{
	top:308px;
	left:0;
	text-align: right;
	padding-right:35px;
	box-sizing: border-box;
	
}
.role .text_left div{
	padding-right:15px;
	border-right:10px solid #eb3c45;
}
.role .p-gap{
	margin-top:25px;
}
/*-------------- advantage -------------*/
.advantage{
	/*float:left;*/
	color:#fff;
	padding:68px 0 80px 0;
	background-color:#eb3c45;
}
.advantage li h4, .character li p{color:#fff;}
.advantage li p{width: 84%;color:#fff;}


/*-------------- action ------------------*/
.action{
	background-color: #fefbfb;
	padding:79px 0 88px 0;
}
.action img{
	width:100%;
}
.action .solution-list li{
	width:30%;
	*width:278px;
	padding:15px 10px;
	border:1px solid #e4e4e4;
	margin-right:5%;
	box-sizing: border-box;
}
.action .solution-list .last-li{margin-right:0;}
.action .solution-list li p{text-align: left;}
.action .solution-list li h4{
	margin:26px 0 20px 0 ;
	font-weight: 600;
}
.action .solution-list li p{
	width:100%;
	font-size:14px;
	line-height: 34px;
	color: #1e1e1e;
}
.action .solution-list li p b{
	margin-right:5px;
}

/*-------------- client-said -------------*/
.client-said{
	float:left;
	width:100%;
	height:auto;
	padding:38px 0 20px 0;
	color:#3d3c3c;
}
.client-said h3, .friend-corp h3{
	margin-bottom: 30px;
	text-align:center;
	font-size: 28px;
}
.client-saidlist{
	width:70%;
	margin:0 15%;
}
.client-saidlist li{
	float:left;
	width:100%;
	margin-bottom:40px;
}
.item-left{
	float:left;
	width:288px;
}
.item-right{
	margin-left:288px;
}
.client-saidlist h4{font-size: 17px; margin-bottom:8px;}
.client-saidlist h4 span{
	display:inline-block;
	width:100%;
}

.client-saidlist a{
	display:block;
	width:136px;
	margin-top:8px;
	line-height:36px;
	text-align:center;
	border:solid 2px #eb3c45;
	font-size:16px;
	color:#eb3c45;
}
.client-saidlist a:hover, .client-saidlist a:active{
	text-shadow: 2px 3px 2px #be1f1f;
	color:#fff;
	background-color:#eb3c45;
}
.friend-logo1{margin-top:35px;}
.friend-logo2{margin-top:10px;}


/*-------------- friend-corp -------------*/
.friend-corp{
	float:left;
	width:100%;
	height:auto;
	padding:90px 0;
	text-align:center;
	color:#545353;
	background-color:#ebebec;
}
.friend-corp h3{ margin-bottom:40px;}

/*-------------- friend-corp -------------*/
.tryUse-wrap{
	padding:42px 0;
}
.tryUse-wrap, .tryUse-wrap h3, .tryUse-wrap p.p-h3, .method{
	float:left;
	width:100%;
}
.tryUse-wrap h3{
	margin-bottom:14px;
	font-size:28px;
	text-align:center;
	color:#3d3c3c;
}
.tryUse-wrap h3 span{
	display:inline-block;
	width:100%;
}
.tryUse-wrap p.p-h3{
	margin-bottom:30px;
	font-size:18px;
	text-align:center;
	letter-spacing:4px;
}
.tryUse-wrap .inside{
	position: relative;
}

/*.tryUse-wrap img{float:left;}*/
.vp-formWrap ul li p{
	position: relative;
	width:100%;
	padding:5px 0 5px 10px;
	background-color: #fff;
	border:1px solid #665d56;
}
.vp-formWrap ul li .form-submit-p{
	border:none;
	padding:0;
	background-color: transparent;
}
.vp-formWrap .meg-error{
	line-height: 30px;
	top:0;
}
.form-wrap2{
	width:660px;
	margin-left:70px;
	margin-top:10px;
	position: absolute;
	top:0;
	right:0;
	z-index:10;
}
.form-wrap2 ul li{
	float:left;
    width: 70%;
	height:44px;
	margin-bottom:12px;
}
.form-wrap2 ul li:nth-child(odd){
	margin-right:20px;
}
.form-wrap2 ul li p{
	position:relative;
	padding:12px;
	border:solid 1px #5c5c5c;
}
.txt-input{
	width:100%;
	height:100%;
	color:#999;
	font-size:14px;
	background-color:#fff;
}
.tryUse-wrap .sumbit-btn{
	display: block;
	width:384px;
	height:44px;
	margin:20px auto 0 auto;
	line-height:44px;
	text-align:center;
	font-size:18px;
	letter-spacing:2px;
	color:#fff;
	background-color:#3d3c3c;
	border-radius:0;
	cursor:pointer;
}
.tryUse-wrap  .sumbit-btn:hover, .tryUse-wrap  .sumbit-btn:active{
	text-shadow: 2px 3px 2px #222222;
	background-color:#333232;
}

.method{
	width:100%;
	background-color: #eb3c45;
	padding:25px 0;
	text-align:center;
	font-size:20px;
	line-height:24px;
	color: #fff;
}
.method2{
	font-size: 25px;
}
.form-wrap2 .form-input{
	color:#3d3c3c;
	font-size:18px;
}
.meg-error{
	display: inline-block;
    position: absolute;
    line-height: 44px;
    right: 1px;
    top: 1px;
    z-index: 10;
    color: #f65662;
    background-color: #fff;
} 

/*-------------- weChat-wrap -------------*/
.weChat-wrap{
	padding-bottom:10px;
}
.fixed-wrap{
	position:relative;
	width:420px;
	height:200px;
	margin:0 auto;
}
.QR-code{
	float:left;
	padding:5px;
	margin:30px 80px 0 0;
	background-color:#fff;
}
.QR-code-desp{
	position:absolute;
	width:100px;
	left:130px;
	top:34px;
	z-index:10;
}
.ipad{
	float:left;
}
/*-------------- tutorMing ----------*/
.tutorMing h3{
	color:#e60012;
	font-size: 30px;
	margin-bottom:20px;
	text-align: center;
}
.tutorMing p{
	font-size:24px;
	color:#3d3c3c;
	text-align: center;
}
.tutorMing .corporate{
	margin-top:80px;
	padding-bottom:90px;
}
.tutorMing .brand{
	width:400px;
	float:left;
}
.tutorMing .brand img{
	display: block;
	width:100%;
	border:1px solid #f2f0f0;
}
.tutorMing .brand .tutorMing-logo{
	margin-top:26px;
}
.tutorMing .text{
	float:right;
	width: 600px;
	*width:575px;
    padding-left: 25px;
}
}
.tutorMing .text h6{
	font-size:24px;
}
.tutorMing .text p{
	font-size:16px;
	text-align: left;
	line-height: 28px;
}
.tutorMing .text .know-more{
	font-size:20px;
	line-height: 40px;
	margin-top:50px;
	font-weight: 600;
}


/*-------------- footer -------------*/
.footer{
	float:left;
	width:100%;
	height:auto;
	padding:40px 0;
	font-size:26px;
	/*font-weight:bold;*/
	color:#fff;
	background-color: #333;
}
.footer a{color:#3d3c3c;}
.footer .inside{
	position:relative;
	width:790px;
	text-align:center;
}
.footer-yao{
	position:absolute;
	right:0;
	bottom:-40px;
	z-index:20;
}
.mobile_btn{
	display: none;
}
@media all and (max-width:1000px){

.inside{width:100%;}
.tutorMing .brand{
	width:40%;
}
.tutorMing .text{
	width:50%;
}
.friend-corp img{
	width:100%;
}
.tutorMing h3{
	font-size:26px;
}
	.action .solution-list li {
    width: 32%;
    margin-right: 2%;
    height:420px;
}
}

@media all and (max-width:900px){
	.role ul li.text-wrap{
		padding-top:30px;
	}
	.role .p-gap {
    	margin-top: 15px;
	}

	.role .text_left{
		padding-left: 10px;
	}

.action .solution-list li h4{
	font-size:16px;
}
.action .solution-list li p{
	line-height: 24px;
}
	.action .solution-list li {
    height:400px;
}
	.tryUse-wrap .inside img{
		width:30%;
		padding-top:80px;
	}
	.tutorMing .brand{
		width:45%;
	}
	.tutorMing .corporate {
    margin-top: 40px;
    padding-bottom: 40px;
}
}

@media all and (max-width:840px){

.friend-corp img{
	width:90%;
	margin:0 5%;
}

}

@media all and (max-width:820px){

.logo{margin-left:10px;margin-top: 6px;}
.tel-num{display:none;}
.tel-contact{margin-right:10px;}
.method{
	margin-top:20px;
}


.footer{text-align:center;}
.footer-yao{display:none;}

}

@media all and (max-width:800px){

.no-wrap{width:100%;}


.footer .inside{width:100%;}
.form-wrap2{
position: static;
margin:auto;
}
.tryUse-wrap .inside img{
	display: none;
}
.tutorMing h3{
	font-size:24px;
}

}

@media all and (max-width:750px){


.no-wrap img{display:none;}


}


@media all and (max-width:660px){


.item-left, .item-right{width:100%;margin:0;}
.item-left{
	text-align:center;
	margin-bottom:20px;
}
.client-saidlist h4{text-align:center;margin-bottom:20px;}
.friend-logo1, .friend-logo2{margin-top:0;}
.client-saidlist a{
	width:60%;
	margin:12px auto;
}


/*.tryUse-wrap  .sumbit-btn:hover, .tryUse-wrap  .sumbit-btn:active{
	text-shadow: 0 0 0;
	background-color:#eb3c45;
}*/

.footer{padding:15px 0;}
.footer span{
	display:inline-block;
	width:100%;
	margin-top:10px;
}


}

@media all and (max-width:610px){

.logo-brief span{display:none;}

.banner-wrapper{
	height:400px;
	background-size: cover;
}
.banner-info{padding-top:100px;}
.banner-info h1{
	font-size:30px;
}
.banner-info h3{
	width:80%;
	margin:17px 10%;
	font-size:15px;
	letter-spacing: 0;
}
.banner-info p{display:none;}

.banner-arrow{display: none;}
.vp-bannerForm{
	display: none;
}
.order-service{
	height:40px;
	line-height:40px;
	margin-top:30px;
}

.tryUse-wrap h3 span{
	font-size:18px;
}
.solution-canWe{padding-bottom:20px;}
.solution-list li{
	width:50%;
	margin:0 0 25px 0;
}
.mobile_btn{
	display: block;
	text-align: center;
	margin-top:40px;
}
.mobile_btn button{
	font-size: 18px;
	background-color: #e60012;
	color:#fff;
	border-radius: 5px;
	border:none;
	padding:10px 20px;
}
.mobile_btn button:hover{
	background-color: #d60212;
}
.role ul li p {
    text-align: left;
}
.role .solution-list li{
	margin:0;
}
.role .text_left {
    padding-right: 20px;
}
.role .text_right {
    padding-left: 20px;
}
.role .text_left h3{
	text-align: left;
}

     .role .solution-list{
     	height:auto;
     }
 .role .solution-list li{
 	position:static;
 	width:100%;
 	height:auto;
 }

  .role ul li.text-wrap{
  	padding:20px 10px;
  }
  .role ul li h3{
  	margin-bottom:20px;
  }
  .role ul .img-wrap{
  	height:200px;
  	background-size: cover;
  }
  .role .text_left div {
    padding-left: 15px;
    border-left: 10px solid #eb3c45;
    padding-right:0;
    border-right:0;
}
}


@media all and (max-width:470px){


.online-contact, .ipad{display:none;}

.fixed-wrap{
	position:static;
	width:100%;
	height:auto;
	text-align:center;
}
.QR-code{
	width:90px;
	float:none;
	margin:0 auto;
}
.QR-code-desp{
	position:static;
	width:60%;
	height:auto;
	margin:10px 20%;
}
.action .solution-list{
	float: none;
	width:90%;
	margin:auto;
}
.action .solution-list li{
	width:100%;
	height:auto;
	margin:0 0 20px 0;
}
.action .solution-list li p{
	text-align: center;
}
.tutorMing .text h6 {
    font-size: 18px;
}
.tutorMing .text p {
    font-size: 14px;
}
.tutorMing .text .know-more {
    font-size: 16px;
    line-height: 26px;
    margin-top: 30px;
    }

.friend-corp{
	padding:50px 0;
}
}

@media all and (max-width:420px){

.banner-wrapper{
	height:380px;
	background-position: 50% center;
}

.header-wrapper{height:46px;}
.logo img{width:100px;}
.logo-brief{line-height:46px;}
.logo-brief strong{font-size:14px;}
/*.tel-contact img{width:36px;height: 36px;}*/
.tel-contact{
	margin-top:0;
}


.solution-list li{
	width:90%;
	margin:0 5% 25px 5%;
}
.solution-list li img{width:22%;}

.action .solution-list li img{
	width:100%;
}

.client-saidlist{width:90%;margin:0 5%;}
.client-said h3{
	width:90%;
	margin:0 5% 30px 5%;
	font-size:25px;
}
.friend-logo1{width:60%;}
.friend-logo2{width:64%;}
.client-saidlist a{width:80%;}

.client-saidlist a:hover, .client-saidlist a:active{
	color:#eb3c45;
	text-shadow:0 0 0;
	background-color:transparent;
}

.friend-corp h3{ font-size:22px;}
.tryUse-wrap h3{
	width:90%;
	margin:0 5% 5px 5%;
	font-size:22px;
}
.tryUse-wrap p.p-h3{
	width:90%;
	margin:0 5% 20px 5%;
	font-size:15px;
}

.tryUse-wrap  .sumbit-btn{margin-top:5px;}

.footer{font-size:20px;}
.tryUse-wrap .sumbit-btn{
	width:90%;
}
.role ul li h3{
	font-size:18px;
}
.role ul li p{
	font-size:12px;
}

}
@media all and (max-width:400px){
	.form-wrap2 ul li{
		height:32px;
		margin: 0 0 20px 0;
	}
	.form-wrap2 ul li p{
		padding:8px;
	}
	.form-wrap2 .meg-error{
		line-height: 32px
	}
	.form-wrap2 .form-input{
		font-size:16px;
	}
	.form-wrap2 span.select_wrap{
		height:39px;
		line-height: 39px;
	}
	.form-wrap2 span.select_current{
		font-size:16px;
		height:39px;
	}
	.form-wrap2 span.select_btn{
		width:39px;
		height:39px;
	}
}







/*------ 兼容性提示 ------*/
.cp-tips{
	width:100%;
	height:40px;
	line-height:40px;
	text-align:center;
	color:#960;
	background-color:#ffefc6;
}
.cp-tips-close{
	display:block;
	float:right;
	width:22px;
	height:22px;
	margin:9px;
	background:url("../image/ie-close.png") no-repeat;
	cursor:pointer;
}
.cp-tips a{
	color:#f75c61;
	text-decoration:underline;
}