.mobile-inner{ display:none;}

@media only screen and (min-width:901px) and (max-width: 1300px){
.case_box{ width:98%; margin:0 auto;}

}

@media only screen and (min-width:240px) and (max-width: 900px){
.header{display:none;}
.mobile-inner{ display:block;}

/*-------隐藏浮动连接---------*/
.mainbox{ width:100%; margin:0 auto;}
.main80{ width:98%; margin:0 auto;}
.main70{ width:98%; margin:0 auto;}

/*手机导航start*/
.mobile-inner{
	width: 100%;
	margin:0 auto;
	background-color: #fafafa;
	position:fixed; left:0; top:0; z-index:99999;
}
.mobile-inner img{
	width: 100%;
	margin-bottom: 30px;
}
.mobile-inner p{
	color: #676767;
	line-height: 25px;
	font-size: 16px;
	padding-bottom: 30px;
	padding-right: 30px;
	padding-left: 30px;
	margin:0px;
}
.mobile-inner-header{
	background-color: rgba(0,0,0,0.7);
	width: 100%;
	height: 50px;
	position: absolute;
	top: 0px;
	left: 0px;
}

.mobile-inner-header .mobile-inner-logo{ float:left; text-align:right}
.mobile-inner-header .mobile-inner-logo img{ height:40px; width:auto; margin:5px 0 0 10px;}

.mobile-inner-header-icon{
	color: #ffffff;
	height: 50px;
	font-size:25px;
	text-align: center;
	float:right;
	width: 50px;
	position: relative;
	-webkit-transition: background 0.5s;
	-moz-transition: background 0.5s;
	-o-transition: background 0.5s;
	transition: background 0.5s;
}
.mobile-inner-header-icon:hover{
	background-color: rgba(255,255,255,0.2);
	cursor: pointer;
}
.mobile-inner-header-icon span{
	position: absolute;
	left: calc((100% - 25px) / 2);
	top: calc((100% - 1px) / 2);
	width: 25px;
	height: 1px;
	background-color: rgba(255,255,255,1);
}
.mobile-inner-header-icon span:nth-child(1){
transform: translateY(6px) rotate(0deg);
	}
.mobile-inner-header-icon span:nth-child(2){
opacity:1;
	}
.mobile-inner-header-icon span:nth-child(3){
transform: translateY(-6px) rotate(0deg);
	}
	
.mobile-inner-header-icon-click span:nth-child(1){
	animation-duration: 0.5s;
	animation-fill-mode: both;
	animation-name: clickfirst;
	}		
.mobile-inner-header-icon-click span:nth-child(2){
	animation-duration: 0.5s;
	animation-fill-mode: both;
	animation-name: fadeOut;
	}
.mobile-inner-header-icon-click span:nth-child(3){
	animation-duration: 0.5s;
	animation-fill-mode: both;
	animation-name: clicksecond;
	}

@keyframes clickfirst {
  0% { transform: translateY(6px) rotate(0deg); }
  100% {  transform: translateY(0) rotate(45deg); }
}	
@keyframes clicksecond {
	0% { transform: translateY(-6px) rotate(0deg);  }

  100% {  transform: translateY(0) rotate(-45deg); }
}	
@keyframes fadeOut {
    0% { opacity: 1 }
    100% {  opacity: 0}
}
.mobile-inner-header-icon-out span:nth-child(1){
	animation-duration: 0.5s;
	animation-fill-mode: both;
	animation-name: outfirst;
	}		
.mobile-inner-header-icon-out span:nth-child(2){
	}
.mobile-inner-header-icon-out span:nth-child(3){
	animation-duration: 0.5s;
	animation-fill-mode: both;
	animation-name: outsecond;
	}

@keyframes outfirst {
  0% {  transform: translateY(0) rotate(-45deg);  }

  100% {   transform: translateY(-6px) rotate(0deg);  }
}	

@keyframes outsecond {
  0% {    transform: translateY(0) rotate(45deg);  }

  100% {    transform: translateY(6px) rotate(0deg);  }
}
.mobile-inner-nav{
	background-color: rgba(0,0,0,0.9);
	width: 100%;
	position: absolute;
	top: 50px;
	left: 0px;
	padding-top: 10px;
	padding-bottom: 20px;
	display: none;
}
.mobile-inner-nav .moul li a{
	display: inline-block;
	line-height: 40px;
	text-decoration: none;
	width: 80%;
	margin-left: 10%;
	color: #FFFFFF;
	border-bottom: solid 1px rgba(255,255,255,0.3);
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	font-weight:300;
}
.mobile-inner-nav .moul li a span{ display:inline-block; margin-left:5px;}
.mobile-inner-nav a:hover{color: rgba(255,255,255,0.4);	border-bottom: solid 1px rgba(255,255,255,0.2);}
.mobile-inner-nav .mosmul li a{line-height: 30px;text-decoration: none;width: 80%;margin-left: 10%;color: #FFFFFF;}
.mobile-inner-nav .moul li .mosmul{ margin-left:30px; display:none}
.mobile-inner-nav .moul li .mosm2ul{ margin-left:30px; display:none}
/*手机导航end*/
.titleIn{ width:90%; text-align:center; margin:0.8rem auto 0.4rem;}
.titleIn .titleBox{	padding: 10px 10px;	}
.titleIn .titleBox h1{font-size:2em; margin-bottom:5px; color:#3AABD0}

.titleIn2{ width:90%; text-align:center; margin:0 auto 0.4rem;}
.titleIn2 .titleBox{line-height:200%; padding:10px 0px; }
.titleIn2 .titleBox h1{letter-spacing:5px;font-size:2em; margin-bottom:15px; color:#fff;}
.titleIn2 p{ color: #a4a4a4; font-size:1.0em;}

.server{overflow: hidden;height:3.0rem;}
.servera{margin: 0 auto;overflow: hidden;width: 100%; text-align:center}
.serverb{ display:inline-block;text-align: center; width: 20%; margin:0 2%;}
.serverb p{color: #696768;font-size: 0.8em;}
.serverb img{ margin-top: 0.3rem;width: 0.66rem; height: 0.66rem; margin-bottom: 0.05rem;}

.inServices2{ margin-top:10px}
.inServices2 ul li{ float:none; width:100%; margin-bottom:0px;}
.teaser_content {margin: 0; height:250px;padding:20px 5px;z-index: 2;position: relative;}
.teaser_bg:hover{margin-top:0px;}
.teaser_icon{ font-size:2.5em;margin-bottom:10px;}
.teaser h1{ font-size:1.6em;margin:10px 0;}
.teaser p{ line-height:150%;}
.teaser .theme_button {margin:15px 0 0;}

/*案例*/
.caseList{ margin:0px 0% 0; background:url(/images/ban3.jpg); background-size:auto 100%;padding:30px 0 20px; width:100%;}
.caseList .listmd5{ width:50%;height:auto;}
.boxImg{width: 98%;height:auto; padding:1%;}
.boxImg .box-content{width: 96%; margin:0 2%;height:82%;color: #fff;position: absolute;top: 18%;left:0;}
.boxImg .title{font-size:16px;line-height:150%;}
.boxImg .post{font-size: 12px;margin:10px 0;}
.boxImg .icon li a{display: block;width:30px;height: 30px;line-height:30px;font-size:16px;}
.more a.tomore{background-color:#3AABD0; color:#fff; padding:5px 20px; border-radius:50px; font-size:1.2em; display:inline-block;-webkit-transition: 0.6s ease;-moz-transition: 0.6s ease;}
.more a.tomore:hover {background-color: #337ab7; margin-top:-10px;}

.aboutIn{ color:#a4a4a4; margin-bottom:30px;}
.aboutIn .abouL{float:none; width:100%;}
.aboutIn .abouL img{cursor: pointer; height:auto;transition: all 0.6s;}
.aboutIn .abouR{float:none; width:100%;}

.work-item{width:46%;float:left;min-height: 1px;padding:0 1%;margin-top:10px; height:220px}
.work-item-i{ display:none;}

.work-words h3{	font-size: 14px;margin: 10px 0; color:#40B3D7;}
.work-words p{	min-height:50px; font-size:10px;}

.counter-section{ display:none;}

/*客户logo*/
.caseLogo{border-top:1px solid #eaeaea;border-left:1px solid #eaeaea;}
.brand-item{margin-left:-1px;width:33.3%;position:relative;float:left;overflow:hidden;border-right:1px solid #eaeaea;border-bottom:1px solid #eaeaea;}

.newsbox .newslist{width:100%; float:none; margin-right:0%;}
.newsbox .newslist:nth-child(3n){ margin-right:0%;}
.news-top{height:35px;border-bottom:1px solid #e0e0e0;}

/* footer */
footer{padding: 20px 2% 0; width:96%;}
footer .fotC{ float:left; width:50%; margin-bottom:10px;}
footer .fotC h1{ font-size:1.2em; margin-bottom:10px;color:#fff;}
footer .fotC ul li{ line-height:24px;background:url(/images/icon_jt.png) no-repeat 0 5px; padding-left:20px;}
footer .fotR{ float:left; width:50%;}
footer .fotR .pic img{ height:90px}
.copyright{	color:#aaa;line-height:150%; text-align:center}
.banner{ margin-top:50px;}
.banner .title h1 { font-size: 30px; margin-top: 15px;}
.banner.show .title .bar { width: 100px;}
.banner .title .bar {background:#3AABD0;height: 5px; width: 0; }

.service .text:before{content:"";height:4px;width:90px;background:#27bec9;display: block;}
.service .text h1{font-size:20px;color: #474747;margin-top:10px;}
.service .text h2{font-size:14px;color: #474747;font-family:Arial;margin-top:10px;margin-bottom:20px;}
.service .text h3{font-size:18px;color: #474747;margin-top:10px;}
.service .text p{font-size:12px;color: #474747;margin-top:10px;}
.service .text .list{margin-bottom:10px;}
.service .text .list h3{width:200px;display: inline-block;margin:0 0 15px 0;}
.service .text .link{color: #474747;margin-top:25px;}
.service .text .link a{margin:0 20px;cursor: pointer;color: #27bec9;}
.service1{position:relative; padding:30px 0}
.service1 .text{ float:none; width:90%; margin:10px 5%}
.service1 .pic{float:none;margin-top:0px; max-width:100%; display:inline-block}
.service2{position:relative;overflow:hidden; height:auto;}
.service2 .text{ float:none; padding: 20px 0;width:90%;margin:10px 5%;}
.service2 .pic{loat:none;margin-top:0px; max-width:100%; display:inline-block}
.service3{position:relative;overflow:hidden;height:auto;}
.service3 .text{ float:none;width:90%;margin:10px 5%;}
.service3 .pic{float:none; margin-top:0px; max-width:100%; display:inline-block}
.service4{position:relative;overflow:hidden;height:auto;}
.service4 .text{ float:none; padding: 20px 0;width:90%;margin:10px 5%;}
.service4 .pic{float:none; max-width:45%; display:inline-block}
.service5{position:relative;overflow:hidden;height:auto;}
.service5 .text{ float:none; width:90%;margin:10px 5%;}
.service5 .pic{float:none;margin-top:0px; max-width:100%; display:inline-block}
.counter-section{padding:30px 0;background:rgba(255,255,255,0.2);margin:60px 0 10px}
.counter-item {width:50%;height:60px; padding:10px 0%;}
.num-item-bd{ margin-left:-1px;	border-right:0px solid #333;}

.titlebox{border-bottom:1px solid #ddd;padding:30px 0 10px;}
.titlebox a:first-child{ padding-left:25px; background:url(/images/home.png) no-repeat 0 0; display:inline-block;}
.news { width:98%;margin:0 auto;}
.news .list{padding:30px 0;}
.news .item{margin-top:10px;position:relative;height:auto;padding-left:0px;}
.news .item:first-child{margin-top:0;}
.news .item .date{ display:none}
.news .item .pic{float:none;height:100%;width:100%;margin-right:0px;}
.news .item .pic img{width:100%;height:auto;}
.news .item h3 a{height:40px;line-height:40px;color:#474747;}
.news .item h1 a{height:auto;line-height:120%;color:#474747;font-size: 14px; text-align:center; display:block}
.news .item p{margin-top:5px;font-size:12px;line-height:180%;}
.news .item .more{ display:none}

.dede_pages2{ margin:20px 0 0; text-align:center;color:#666;}
.dede_pages2 ul li{display:inline-block;padding:4px 8px; margin-right:6px;border:1px solid #999;}
.dede_pages2 ul li a{color:#666;	display:block;}
.dede_pages2 ul li a:hover{color:#3AABD0;text-decoration:none;}
.dede_pages2 ul li.thisclass,
.dede_pages2 ul li.thisclass a,.pagebox ul li.thisclass a:hover{ color:#3AABD0;
	background-color:#f5f5f5;padding:4px 8px;
}
.news_arc{padding:30px 0; width:98%;margin:0 auto;}
.news_arc .title{position:relative;}
.news_arc .title .date{ display:none}
.news_arc .title h1{line-height:40px;font-size:18px; text-indent:0px;width:100%; padding-top:30px;}
.news_arc .title .back{background:url(/images/ico4.png) left center no-repeat;padding-left:40px;height:24px;line-height:20px;font-size:12px;color:#909090;position:absolute;right:0;top:0px;}
.news_arc .content{padding:30px 0;line-height:180%;font-size:12px;}
.news_arc .content p{line-height: 180%;text-indent: 2em;}
.news_arc .list{border-top:1px solid #ddd;padding:10px 0;}
.news_arc .list .item{float:none;width:100%;}
.news_arc .list .item:first-child{float:none;}
.news_arc .list .item h2{float:left;font-size:14px; margin-bottom:10px;}
.news_arc .list .item h2 a{color:#474747;}
.news_arc .list .item span{float:none;}

.case_box{ width:98%; margin:0 auto;}
.case_arc1{padding:30px 0;}
.case_arc1 .title{text-align:center;}
.case_arc1 .title span{ float:right; display:inline-block; position: absolute; right:0px; top: -50px;}
.case_arc1 .title span a{display:inline-block; margin-top:0; margin-right:10px; width: 30px;height:30px;line-height:30px;border-radius: 50%;
background: #3196BC;font-size: 16px;font-weight: 700;color: #fff;transition: all 0.5s ease 0s;margin-top:10px;}

.case_arc1 .title h1{font-size:20px;}
.case_arc1 .content{margin-top:30px;position:relative;}
.case_arc1 .pc{background:url(/images/pc.png) center top no-repeat; background-size:100% auto;width:320px;height:260px;margin:auto;position:relative;padding-top:12px;}
.case_arc1 .pc .mask{background:url(/images/pc_mask.png) right top no-repeat; background-size:100% auto;width:300px;height:250px;position:absolute;right:0;top:0;}
.case_arc1 .pc .inner{width:300px;height:170px;overflow:hidden;margin-left:12px;position:relative;}
.case_arc1 .pc .inner .frame{height:100%;overflow:hidden;}
.case_arc1 .pc .inner .frame .child{float:left;height:100%;width:100%;}

.case_arc1 .phone{background:url(/images/phone.png) center top no-repeat;width:194px;height:420px;position:relative;right:auto;top:auto; margin:0 auto;}
.case_arc1 .phone .mask{background:url(/images/phone_mask.png) right top no-repeat;width:80px;height:280px;position:absolute;right:0;top:0;}
.case_arc1 .phone .inner{padding-top:49px;margin-left:12px;width:171px;height:304px;overflow:hidden;}
.case_arc1.show .phone .inner{opacity:1;}
.case_arc1 .phone .inner img{width:100%;height:auto;}
.case_arc1 .more{display:block;margin:30px auto 0;background:#3AABD0;height:42px;line-height:42px;width:210px;text-align:center;color:#fff;font-size:1.2em; text-transform:uppercase;border-radius:26px;transition:all 0.2s ease-out 0s;-webkit-transition:all 0.2s ease-out 0s;}

.nav_float {display: none;}
.service_m {
    display: block;
    background: #3AABD0 url(/images/icon6_2.png) center center no-repeat;
    height: 40px;
    width: 40px;
    border-radius: 5px;
    position: fixed;
    right: 5px;
    top: 50%;
    margin-top: -20px;
    background-size: 70% auto;
    z-index: 10;
    animation: svm 5s ease-in 0s infinite;
    -webkit-animation: svm 5s ease-i 0s infinite;
}
}