/* Index ��ҳ */
 .Case_show {
	width:100%;
	background: #f6d03b;
	color: #ffffff;
	padding-top: 157px;
	padding-bottom: 100px;
}
.Case_show .Case_content {
	width:82%;
	margin: 0 auto;
	position: relative;
}
.Case_left {
	width:38%;
}
.Case_right {
	width: 58%;  float: right;
}
.Case_right_box{ overflow: hidden; position: relative; height: 600px; padding-top: 80px;}
.case_r_list{ overflow: hidden; height: 413px; margin-top: 80px;}
.case_r_list li{ float: left; width: 235px; height: 413px;}
.iphone{ position: absolute; left: 220px; top:14px;}

.unlike {
	font-size: 16px; margin-top: 20px;
}
.p {
	line-height:33px
}
.read_more {
	display: block;
	border-radius: 10px;
	background-color: rgb(243, 152, 0);
	width: 248px;
	height: 60px;
	text-transform: uppercase;
	color: #ffffff;
	text-align: center;
	line-height:60px;
	margin-top: 20px;
}
.read_more:hover{
	background-color: #d5890b;
	transition:0.5s ease-in-out;
	-webkit-transition:0.5s ease-in-out;
	-moz-transition:0.5s ease-in-out;
}
.index_case_list {
	width:66.7%;
	position: relative;
}
.index_case_list_1_4 {
	width:33.2%;
	position: relative;
	display: inline-block;
}
.index_case_list_1_3 {
	width:33.3333%;
	position: relative;
}
.mask {
	background: rgba(246, 208, 59, .89);
	position: absolute;
	left:0px;
	top: 0px;
	width: 100%;
	height: 100%;
	text-align: center;
	color: #ffffff;
}
.Service {
	width:100%;
	padding-top: 119px;
}
.Service_center {
	width:83.33333%;
	margin: 0 auto;
	text-align: center;
	color: #666666;
}
.Service_title {
	font-size: 36px;
}
.Service_content {
	border-bottom: 1px solid #e7e7e7;
	font-size: 0;
}
.Service_content .list_1_4 {
	width:25%;
	text-align: right;
	margin-bottom: 87px;
	display: inline-block;
}
.Service_content .list_1_4 h4 {
	text-align: center;
	font-size: 16px;
}
.Service_content .list_img {
	width:223px;
	height:201px;
	line-height:201px;
	margin: 0 auto;
	text-align:center;
	position: relative;
	overflow: hidden;
}

.pingpai_img{
	width:152px;
	height:200px;
	position: relative;
	overflow: hidden;
	margin: 0 auto;
}

.list_img .pingpai_icon{
	width:115px;
	height:65px;
	text-align: center;
	position: absolute;
	overflow:hidden;
	top:80px;
	left:20px;
}
.list_img .pingpai{
	position: absolute;
	left:20px;
}
.list_img:hover .pingpai{
	animation:pingpai 2s forwards linear;
}

.list_img .appyingyong{
	position: relative;
	width:149px;
	height:200px;
	overflow: hidden;
	margin: 0 auto;
}
.list_img .appyingyong_img{
	position: absolute;
	top:60px;
	left:50px;
}
.list_img:hover .appyingyong_img{
	animation:zoomIn 1s forwards;
	-webkit-animation:zoomIn 1s forwards;
}
.list_img .ui_img{
	width:141px;
	height:200px;
	margin: 0 auto;
	text-align: center;
	position: relative;
}
.list_img .rocket_index{
	position: absolute;
	top:135px;
}
.list_img:hover .rocket_index{
	animation:rocket 1s linear;
}
.list_img .des_img{
	width:184px;
	height:200px;
	position: relative;
	margin:0 auto;
	text-align: center;
}
.dot{position: absolute;top:87px;left:56px;}
.list_img:hover .dot{
	animation:dot 1s linear alternate infinite
}
.list_img:hover .rotateIn{
	animation:flash 2s linear;
}

.list_img:hover .fadeIn{
	animation:fadeIn 3s  linear alternate;
}
.gear_img{position: relative;width:170px;height:200px;margin:0 auto}
.gear{
	position: absolute;
	top: 24px;
	right: -27px;
}
.list_img:hover .gear{
	animation:gear 1s linear forwards;
	-webkit-animation: gear 1s linear forwards;
}

.list_img .star_img{
	position: relative;
	width:156px;
	margin:0 auto;
	height:200px;
}

.list_img .star{
	position: absolute;
	top: 70px;
	left: 0px;
}
.list_img .talk_point{
	position:absolute;
	width:35px;
	top: 82px;
	height:33px;
	left: 41px;
}
.point{
	position: absolute;
	top:13px;
	left:5px;
	width:6px;
	height:6px;
}
.point2{
	position: absolute;
	top:13px;
	left:15px;
	width:6px;
	height:6px;
	
}
.point3{
	position: absolute;
	top:13px;
	left:25px;
	width:6px;
	height:6px;
}
.gupiao{
	position: relative;
	width:178px;
	height:200px;
	margin: 0 auto;
	text-align: center;
}
.gupiao_img{
	width:63px;
	height:44px;
	position: absolute;
	top:79px;
	overflow: hidden;
	left:98px;
}
.gupiao:hover .gupiao_img{
	animation:gupiao 1s linear;
	-webkit-animation:gupiao 1s linear;
}
.h5:hover .point{
	animation:fadeIn_none 1s linear;
}
.h5:hover .point2{
	animation:fadeIn_none 1s 1s linear;
}
.h5:hover .point3{
	animation:fadeIn_none 1s 2s linear;
}
/* About */
 .About {
	padding-top: 146px;
}
.About_title {
	color: #666666;
	font-size: 36px;
}
.about_center {
	width:1200px;
	margin: 0 auto;
	color: #666666;
	text-align: center;
}
/* Case */
 .ul {
	width:100%;
	margin: 0 auto;
	font-size: 0;
}
.ul .case_list {
	width:50%;
	font-size: 0;
}
.ul img {
}
.ul .case_list_s {
	width:25%;
}
/* Partner */
 .partner {
	width:1200px;
	position: relative;
	margin:150px auto 0;
}
.khjl {
	width:250px;
	height:233px;
	position: relative;
	margin-right: 40px;
	margin-top: 20px;
}
.clearfix{clear:both}

.wag {
	width:250px;
	height:287px;
	position: relative;
	margin-bottom:100px;
	margin-right: 40px;
}
.sjs {
	width:250px;
	height:280px;
	position: relative;
	margin-bottom:100px;
	margin-right: 40px;
}
.cxy {
	width:250px;
	height:237px;
	position: relative;
	margin-top: 5px;;
	margin-bottom:50px;
}
.talk1 {
	background: url("../images/talk.png") no-repeat;
	width:350px;
	height:260px;
	position: absolute;
	left:220px;
	top:-22px;
	display: none;
	z-index:9
}
.talk2 {
	background: url("../images/talk.png") no-repeat;
	width:350px;
	height:260px;
	position: absolute;
	left:240px;
	top:-11px;
	display: none;
	z-index:9
}
.talk3 {
	background: url("../images/talk.png") no-repeat;
	width:350px;
	height:260px;
	position: absolute;
	left:270px;
	top:-11px;
	display: none;
	z-index:9
}
.talk4 {
	background: url("../images/talk_r.png") no-repeat;
	width:372px;
	height:260px;
	position: absolute;
	right:290px;
	top:-20px;
	display: none;
	z-index:9
}
.talk_text {
	width:226px;
	height:279px;
	text-align: left;
	padding-top: 20px;
	padding-left: 100px;
	color:#333333;
	font-size: 15px;
}
.talk_text h3 {
	font-weight: 600;
}
.talk_text ul {
	margin-top: 34px;
	line-height:1.5;
}

/* �ͻ����� */
 .khjl_ani {
	width:100%;
	position: relative;
}
.khjl_body {
	width:100%;
	transform:rotate(-14deg);
	top:0;
	left:0;
	z-index: 3;
	text-align: center;
	transition: 1s
}
.khjl_ani:hover .khjl_body {
	transform:rotate(0deg);
	margin-left:18px;
	transition: 1s
}
.khjl_foot {
	width:100%;
	height:58px;
	text-align: center;
	margin-top: -14px;
}
.khjl_foot img {
	max-height:58px;
}
.khjl_shadow {
	width:100%;
	height:49px;
	text-align: center;
	margin-top: -20px;
}
/* �İ��� */
 .wag_ani {
	width:100%;
	position: relative;
}
.wag_body {
	width:100%;
	z-index:3;
	text-align: center;
	transition:1s
}
.wag_hand_l {
	width:58px;
	text-align: right;
	top:45%;
	left:0px;
	z-index:7;
	position: absolute;
	transform-origin:top right;
}
.wag_hand_r {
	width:58px;
	text-align: left;
	top:45%;
	right:0px;
	z-index:7;
	position: absolute;
	transform-origin:0 0;
}
.wag_foot_l {
	width:43%;
	float: left;
	text-align: right;
	margin-top: -25px;
	height:66px;
}
.wag_foot_r {
	width:43%;
	float: right;
	margin-top: -25px;
	text-align: left;
	height:66px
}
.wag_shadow {
	width:100%;
	text-align: center;
	margin-top:0px
}
.wag_shadow img {
	margin-top: -20px;
}
.leftUp {
	animation:leftUp 1s infinite alternate linear;
	-webkit-animation:leftUp 1s infinite alternate linear
}
.rightUp {
	animation:rightUp 1s infinite alternate linear;
	-webkit-animation:rightUp 1s infinite alternate linear
}
.leftRight {
	animation:leftRight 1s infinite alternate linear;
	-webkit-animation:leftRight 1s infinite alternate linear
}
/* ���ʦ */
 .sjs_ani {
	width:100%;
	position: relative;
}
.sjs_body {
	width:100%;
	z-index:3;
	text-align: center;
	transition:1s;
	position: relative;
}
.sjs_hand_l {
	width: 21%;
	text-align: right;
	float: left;
	margin-top: -70%;
	z-index:7;
	position: relative;
	transform-origin:51px 111px;
}
.sjs_hand_r {
	width: 21%;
	text-align: left;
	float: right;
	margin-top: -38.5%;
	z-index:7;
	margin-right: 6px;
	position: relative;
	transform-origin:3px 30px;
}
.sjs_foot {
	width:100%;
	margin-top: -5%;
	height:66px;
}
.sjs_shadow {
	width:100%;
	text-align: center;
	margin-top:0px
}
.sjs_shadow img {
	margin-top: -37px;
}
.sjs_right_up {
	animation:sjs_right_up 2s infinite alternate linear;
	-webkit-animation:sjs_right_up 2s infinite alternate linear;
}
/* ����Ա */
 .cxy_ani {
	width:100%;
	text-align: center;
	margin-top: 30px;
}
.cxy_body {
	width:100%;
	position: relative;
	z-index: 3;
	text-align: left;
}
.cxy_hand_l {
	text-align: right;
	float: left;
	position: relative;
	margin-top: -20%;
	margin-left: -10px;
	transform-origin:top right;
	z-index: 4;
	transition:1s ease-in-out
}
.cxy_hand_r {
	text-align: right;
	float: left;
	position: relative;
	margin-top: -20%;
	transform-origin:54px -10px;
	margin-left: 71px;
	z-index: 4;
	transition:1s ease-in-out
}
.cxy_hand_computer {
	position: relative;
	z-index: 4;
}
.cxy_hand_computer img {
	position: absolute;
	left: -21px;
	top: -28px;
}
.cxy_foot {
	width:100%;
	position: absolute;
	text-align: center;
	left:-25px;
}
.cxy_foot img {
	margin-top:-6%
}
.cxy_tail {
	width:30%;
	float: right;
	text-align: left;
	margin-right: 34px;
	margin-top: -45%;
}
.cxy_shadow {
	margin-top: 5px;
	margin-right: 20px;
	text-align: center;
}
.cxy_hand {
	animation:cxy_hand 1s infinite alternate linear;
	-webkit-animation:cxy_hand 1s infinite alternate linear
}
/* ������ҳ */
 .detail_banner {
	width:100%;
	position: relative;
}
.mask_banner {
	top:100%;
	position: absolute;
	height:150px;
	background:rgba(0, 0, 0, 0.7);
	width:100%;
	margin-top: -150px;
	color: #fff;
}
.mask_banner .b_explain {
	height:70px;
	overflow: hidden;
	text-align: center;
}
.lookpc, .lookphone {
	display: block;
	background: #f39800;
	height:46px;
	width:127px;
	float: left;
	line-height:46px;
	color: #fff;
	border-radius:2px;
	text-align: center;
	float: left;
	margin-left: 20px;
	margin-right: 20px
}
.lookphone{
	float: left;
	background: #5b9ce4;
}
.next {
	display: block;
	background: #5b9ce4;;
	height:46px;
	width:127px;
	line-height:46px;
	color: #fff;
	float: right;
	border-radius:2px;
	text-align: center;
	float: left;
}
.prev {
	display: block;
	background: #5b9ce4;;
	height:46px;
	width:127px;
	line-height:46px;
	color: #fff;
	float: left;
	border-radius:2px;
	text-align: center;
}
.mask_center {
	width:1258px;
	margin: 0 auto;
}
.btn_center {
	width:590px;
	margin:20px auto 0;
	position: relative;
}
.hover {
	width:120px;
	height:135px;	
	position: absolute;
	left:318.5px;
	top:-150px;
	display: block;
	background: #FFFFFF;
	text-align: center;
	display: none;
}
/* banner */
.bannerPic{ width: 100%;}
.bannerList{}
.bannerList li{}
.bannerList li img{ width: 100%;}
.hover .hover_pic{ max-width: 96px; width: 100%;margin-top: 5px;}
.sanjiao{ position: absolute; left: 50.5px; bottom: -11px; width: 19px; height: 11px;}
.service_center {
	width:1217px;
	margin:141px auto 0;
}


/* 动画 */
@keyframes gear{
	from{
		transform:rotate(-360deg)
	}
	to{
		transform:rotate(0deg)
	}
}
@-webkit-keyframes gear{
	from{
		transform:rotate(-360deg)
	}
	to{
		transform:rotate(0deg)
	}
}

 @keyframes leftUp {
	from {
		transform:rotate(0deg)
	}
	to {
		transform:rotate(-80deg)
	}
}
@-webkit-keyframes leftUp {
	from {
		transform:rotate(0deg)
	}
	to {
		transform:rotate(-80deg)
	}
}
@keyframes rightUp {
	from {
		transform:rotate(0deg)
	}
	to {
		transform:rotate(80deg)
	}
}
@-webkit-keyframes rightUp {
	from {
		transform:rotate(0deg)
	}
	to {
		transform:rotate(80deg)
	}
}
@keyframes leftRight {
	from {
		transform:rotate(5deg);
		-webkit-transform:rotate(5deg);
	}
	to {
		transform:rotate(-5deg);
		-webkit-transform:rotate(-5deg);
	}
}
@-webkit-keyframes leftRight {
	from {
		transform:rotate(5deg);
		-webkit-transform:rotate(5deg);
	}
	to {
		transform:rotate(-5deg);
		-webkit-transform:rotate(-5deg);
	}
}
@keyframes sjs_right_up {
	from {
		transform:rotate(0deg);
		-webkit-transform:rotate(0deg);
	}
	to {
		transform:rotate(-36deg);
		-webkit-transform:rotate(-36deg)
	}
}
@-webkit-keyframes sjs_right_up {
	from {
		transform:rotate(0deg);
		-webkit-transform:rotate(0deg);
	}
	to {
		transform:rotate(-36deg);
		-webkit-transform:rotate(-36deg)
	}
}
@keyframes cxy_hand {
	from {
		transform:rotate(0deg);
		-webkit-transform:rotate(0deg);
	}
	to {
		transform:rotate(20deg);
		-webkit-transform:rotate(20deg);
	}
}
@-webkit-keyframes cxy_hand {
	from {
		transform:rotate(0deg);
		-webkit-transform:rotate(0deg);
	}
	to {
		transform:rotate(20deg);
		-webkit-transform:rotate(20deg);
	}
}

@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes pingpai{
	from{
		left:-100px;
	}
	to{
		left:20px
	}
}
@-webkit-keyframes pingpai{
	from{
		left:-100px;
	}
	to{
		left:20px;
	}
}
@-moz-keyframes pingpai{
	from{
		left:-100px;
	}
	to{
		left:20px
	}
}
@keyframes rocket{
	from{left:0}
	
	to{top:105px;left:200px}
}
@-webkit-keyframes pingpai{
	from{
		left:-100px;
	}
	to{
		left:150px;
	}
}
@-moz-keyframes pingpai{
	from{
		left:-100px;
	}
	to{
		left:150px;
	}
}
@keyframes dot{
	from{
		top:71px;
	}
	to{
		top:113px;
	}
}
@-webkit-keyframes dot{
	from{
		top:71px;
	}
	to{
		top:113px;
	}
}

@-moz-keyframes dot{
	from{
		top:71px;
	}
	to{
		top:113px;
	}
}
@-webkit-keyframes flash {
  from, 50%, to {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

@keyframes flash {
  from, 50%, to {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}


@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn_none {
  from {
    opacity: 0;
    display: none;
  }

  to {
    opacity: 1;
    display: block;
  }
}

@-webkitkeyframes fadeIn_none {
  from {
    opacity: 0;
    display: none;
  }

  to {
    opacity: 1;
    display: block;
  }
}

@keyframes gupiao{
	0%{
		width:1px;
		height:44px;
	}

	to{
		width:63px;
		height:44px;
	}
}

@keyframes gupiao{
	0%{
		width:1px;
		height:44px;
	}

	to{
		width:63px;
		height:44px;
	}
}


/* case案例页面 */
.case{ }
.case_list{ font-size: 0;}
.case_more{ width: 100%; height: 170px; text-align: center; padding-top: 100px;}
.more_pic{ }
.inner{ width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); position: absolute; top: 100%; display: -moz-box; display: -webkit-box; -webkit-box-align: center; -moz-box-align: center;}
.in_dis{ display: none; left: 0; top: 0;}
.contant{ width: 100%; position: relative; background: url(../images/contantus_bg.png) no-repeat; height: 636px; background-position: center center; background-size: cover; min-width: 1200px;}
.contant_form{ width: 1200px; margin: 0 auto;}
.form_left{ margin-left: 30px;}
.l_text{ font-size: 16px; color: #FFFFFF; margin: 30px 0; height: 20px; line-height: 20px; border-left: 1px solid #6c6c6c; padding-left: 10px;}
.l_name{ width: 390px; height: 36px; background: #FFFFFF; margin: 30px 0; border-radius: 3px;}
.name_pic{ width: 16px; height: 22px; margin-left: 25px;  float: left; }
.name_mt1{ margin-top: 7px;}
.name_mt2{ margin-top: 10px;}
.name_mt3{ margin-top: 7px; }
.name_mt4{ margin-top: 8px;}
.name_mt5{ margin-top: 7px;}
.name_input{ height: 36px; margin-left: 15px; border: none; width: 290px;}
.l_demand{ width: 390px; height: 100px; background: #FFFFFF; margin: 20px 0; border-radius: 3px;}
.demand_t{ width: 300px; height: 100px; margin-left: 15px; border: none; line-height: 36px;}
.name_btn{  width: 390px; height: 46px; background: #FFFFFF; border-radius: 3px; margin-top: 10px; background: #f39800; border: none; font-size: 16px; color: #FFFFFF;}
.contant_right{ width: 576px; margin-right: 30px;}
.r_text{  margin-top: 75px; width: 576px; height: 120px;}
.r_txt{ font-size: 40px; color: #868686; margin-top: 20px; padding-left: 5px;}
.r_txt2{ font-size: 16px; color: #FFFFFF; padding-left: 5px; line-height: 30px;}
.share_btn{ width: 102px; height: 40px; border-top: 1px solid #5c5c5c; float: right; margin-top: 30px;}
.share_con{ width: 33.3333%; height: 40px; float: left; text-align: center; line-height: 40px;}
.share_con img{ vertical-align: middle;}
.footer{ width: 100%; height: 63px; background: rgba(0,0,0,0.8); position: absolute; left: 0; bottom: 0;}
.footer_con{ width: 1200px; height: 63px; line-height: 63px; margin: 0 auto;}
.footer_text{ width: 100%; text-align: center; font-size: 14px; color: #FFFFFF;}
.footer_text a{ color: #FFFFFF;}

.i_hover{ width: 100%; text-align: center; }
.i_text{ color: #FFFFFF; width: 100%;  margin-top: 20px; font-size: 16px;}

/* about */
.about_banner{ width: 100%; background: url(../images/about_banner.png) no-repeat; height: 100%; position: relative; min-width: 1200px;}
.about_text{ position: absolute; top: 0; left: 0; width: 100%;}
.t_t{ font-size: 48px; color: #FFFFFF; width: 100%; text-align: center;}
.t_p{ font-family: "myfont"; font-size: 36px; width: 100%; text-align: center; color: #FFFFFF;}
.about_content{ width: 1200px; margin: 100px auto 0;}
.about_us{ font-size: 36px; color: #333333;}
.about_line{ width: 80px; height: 4px; background: #F39800; border-radius: 3px; margin-top: 30px;}
.a_us{ font-size: 22px; color: #999999; margin-top: 30px;}
.a_text{ font-size: 16px; color: #666666; margin-top: 40px; line-height: 30px;}
.service_idea{ margin-top: 150px; width: 100%; background: #eeeeee;}
.service_content{ width: 1200px; margin: 150px auto 0;}
.s_about_us{ width: 100%; text-align: center; font-size: 36px; color: #333333;}
.s_about_line{ width: 80px; height: 4px; background: #F39800; border-radius: 3px; margin: 30px auto 0;}
.s_text{ font-size: 16px; width: 100%; text-align: center; color: #999999; margin-top: 30px;}
.s_txt{ font-size: 16px; width: 100%; text-align: center; color: #666666; margin-top: 30px; line-height: 30px;}
.cooperative{ width: 1200px; margin: 100px auto;}
.coo_list{ width: 1200px; border: 1px solid #999999;}
.coo_list li{ width: 200px; background: #999999; height: 90px; float: left;  }
.li_box{ width: 198px; height: 88px; margin-top: 1px; margin-left: 1px; background: #ffffff; text-align: center; line-height: 88px;}
.li_box img{ vertical-align: middle;}
.t_t{ font-size: 48px; color: #FFFFFF;}

/* service */
.ser_list{ margin-top: 90px;}
.ser_list li{ width: 363px;}
.ser_list_p{ font-size: 16px; color: #666666; line-height: 30px; margin-top: 20px;}
.liucheng{ width: 100%; margin-top: 50px; padding-bottom: 50px;}
.ser_span1{ display: inline-block; width: 270px; text-align: left;padding-top: 20px;}
.ser_span2{ display: inline-block; width: 308px; text-align: left;padding-top: 20px;}
.ser_span3{ display: inline-block; width: 253px; text-align: left;padding-top: 20px;}
.ser_span4{ display: inline-block; width: 340px; text-align: left;padding-top: 20px;}
.ser_span5{ display: inline-block; text-align: left;padding-top: 20px;}

/* contantus */
.contant_bg{ width: 100%; height: 100%; background: url(../images/contant_p.png) no-repeat; background-size: cover; background-position: center center;}

/* 返回顶部  */
.daydayup{ position: fixed; bottom: 30px; right: 50px; opacity: 0;z-index: 99;}


.outer{ display: inline-block;}

