@charset "utf-8";

.fangan{
	margin-top: 1em;
}
.title{
	text-align: center;
	padding: 2em 0;
}
.title b{
	color: #3788bf;
	font-size: 2.5em;
	margin-bottom: 1em;
}
.title p{
	color: #666666;
	font-size: 1.5em;
}

.type {
	width: 100%;
	padding-left: 8%;
	padding-right: 8%;
	overflow: hidden;
	border-top: 1px solid #e3e3e3;
	border-bottom: 1px solid #e3e3e3;
}
.type a{
	display: block;
	float: left;
	background: #f1f1f1;
	border-right: 1px solid #e3e3e3;
	border-left: none;
	text-align: center;
	font-size: 1.5em;
	color: #666666;
	line-height: 3.5em;
}
.type a:nth-child(1){
	border-left: 1px solid #e3e3e3;
}
.type a span{
	padding-left: 1.6em;
}
.type a:nth-child(1) span{
	background: url(../images/j1.png) 0 center no-repeat;
	background-size: 20% auto;
}
.type a:nth-child(2) span{
	background: url(../images/j2.jpg) 0 center no-repeat;
	background-size: 20% auto;
}
.type a:nth-child(3) span{
	background: url(../images/j3.jpg) 0 center no-repeat;
	background-size: 20% auto;
}
.type a:nth-child(4) span{
	background: url(../images/j4.jpg) 0 center no-repeat;
	background-size: 20% auto;
}
.type a:nth-child(5) span{
	background: url(../images/j5.jpg) 0 center no-repeat;
	background-size: 20% auto;
}
.type a:nth-child(6) span{
	background: url(../images/j6.jpg) 0 center no-repeat;
	background-size: 20% auto;
}
.type a.on {
	background: #3085c1;
	color: #fff;
}
.type a:hover{
	text-decoration: none;
}
.type a:nth-child(1).on span{
	background: url(../images/j11.png) 0 center no-repeat;
	background-size: 20% auto;
}
.type a:nth-child(2).on span{
	background: url(../images/j21.png) 0 center no-repeat;
	background-size: 20% auto;
}
.type a:nth-child(3).on span{
	background: url(../images/j31.png) 0 center no-repeat;
	background-size: 20% auto;
}
.type a:nth-child(4).on span{
	background: url(../images/j41.png) 0 center no-repeat;
	background-size: 20% auto;
}
.type a:nth-child(5).on span{
	background: url(../images/j51.png) 0 center no-repeat;
	background-size: 20% auto;
}
.type a:nth-child(6).on span{
	background: url(../images/j61.png) 0 center no-repeat;
	background-size: 20% auto;
}
.fangan .cont{
	border-bottom: 1px solid #e8e8e8;
}
.fah h3{
	margin-top:10%;
	font-size: 2.5em;
	color: #1583b6;
	font-weight: bold;
}
.fah h3 span{
	color: #999999;
	font-size: 0.6em;
	font-weight: normal;
}
.fah h5{
	margin-top: 0.5em;
	font-size: 2em;
	font-weight: bold;
	color: #1583b6;
	border-bottom: 1px dashed #c0c0c0;
	padding-bottom: 0.5em;
}
.fah h5 span{
	color: #333333;
}
.fah h5 var{
	font-style: normal;
	color: #ffa507;
}
.fah h6{
	color: #ffa507;
	font-size: 1.5em;
	margin-top: 1em;
}
.fah p{
	font-size: 1.3em;
	line-height: 2.3em;
	color: #494949;
	margin-top: 0.4em;
}
.fah p span{
	font-weight: bold;
}
.fah div{
	text-align: right;
	margin-top: 3em;
	overflow: hidden;
}
.fah div a{
	display: inline-block;
	width: 16%;
	margin-right: 5%;
}
.fah div a:nth-child(3){
	width: auto;
	padding: 0 1.5em;
	background: #ffa507;
	color: #fff;
	border-radius: 1em;
	line-height: 3em;
	text-align: center;
	font-size: 1.3em;
}

/*恒凯出品*/
.chupin img{
	width: 100%;
}

/*怎样做*/
.do{
	margin-top: 1.5em;
}
.do .bd{
	overflow: hidden;
	width: 100%;
}
.do .bd ul{
	overflow: hidden;
}
.do .bd li{
	text-align: center;
	position: relative;
	padding: 2em;
}
.do .bd img{
	display: block;
	margin: 2em auto 1.5em;
	position: relative;
	z-index: 10;
}
.do .bd img:nth-child(1){
	display: block;
}
.do .bd img:nth-child(2){
	display: none;
}
.do .bd p{
	font-size: 1.6em;
	color: #333333;
	margin-bottom: 2em;
	position: relative;
	z-index: 10;
}
.do .bd li.cur{
	background: #3085c1;
}
.do .bd li.cur img:nth-child(1){
	display: none;
}
.do .bd li.cur img:nth-child(2){
	display: block;
}
.do .bd li.cur p{
	color: #fff;
}
/*.do .bd div{
	width: 0;
	height: 100%;
	background: #3085c1;
	position: absolute;
	top: 0;
	left: 50%;
	z-index: 1;
	display: block;
}*/
/*.do .bd li:hover{
	background: #3085c1;
}
.do .bd li:hover p{
	color: #fff;
}*/
.do .hd {
	overflow: hidden;
}
.do .hd ul{
	overflow: hidden;
}
.do .hd li{
	overflow: hidden;
}
.do .hd h6{
	float: left;
	font-size: 1.5em;
	color: #666666;
	line-height: 5em;
	padding-left: 3em;
}
.do .hd div{
	float: right;
}
.do .hd div var{
	display: block;
	font-family: "叶根友钢笔行书升级版";
	font-size: 3.5em;
	color: #666;
	position: relative;
}
.do .hd span{
	font-size: 1.2em;
	line-height: 0.5em;
	position: absolute;
	top: 0;
	right: 0;
}
.do .hd p{
	color: #999999;
	font-size: 1.5em;
}
.do .line {
	margin-top: 1em;
	overflow: hidden;
	margin-bottom: 1em;
}
.do .line ul{
	overflow: hidden;
}
.do .line li{
	height: 0.9em;
	background: url(../images/do4.jpg) 0 center repeat-x;
}
.do .line li.on{
	background: url(../images/do5.jpg) 0 center repeat-x, url(../images/do5.jpg) 0 0 repeat-y, url(../images/do5.jpg) right center repeat-y;
}


/*海量案例*/
.case ul{
	overflow: hidden;
}
.case li{
	padding: 1.5em;	
	overflow: hidden;
	
}
.case li a{
	display: block;
	overflow: hidden;
	padding: 1.5em;
	background: #e8e8e8;
	color: #afafaf; 
	position: relative;
}
.case li img{
	display: block;
	width: 100%;
}
.case li h4{
	font-size: 2em;
	color: #333;
	line-height: 2.3em;
}
.case li span{
	font-size: 1.5em;
}
.case li a>p{
	font-size:1.5em;
	line-height: 2em;
}
.case li a>div{
	width: 100%;
	position: relative;
}
.case li a>div div{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}
.case li a>div p{
	width: 100%;
	height: 100%;
	background: #000;
	opacity: 0.5;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
.case li div var{
	border: 2px solid #fff;
	line-height: 4em;
	padding: 0 1em;
	color: #fff;
	position: relative;
	z-index: 10;
	font-style: normal;
	display: block;
	position: absolute;
	top: 50%;
	margin-top: -2em;
	left:50%;
	letter-spacing: 1px;
	width: 30%;
	margin-left: -15%;
	text-align: center;
}
.case li:hover div div{
	display: block;
}
.case li:hover a{
	background: #3fa0d3;
	color: #fff;
	text-decoration: none;
}
.case li:hover h4{
	color: #fff;
}

.case .more{	
	overflow: hidden;
}
.case .more a{
	color: #1583b6;
	line-height: 3em;
	background: none;
	text-align: center;
}
.case .more span{
	padding: 0 1em;
	border: 1px solid #1583b6;
	border-radius: 0.5em;
	display: inline-block;
}
.case .more:hover a{
	background: none;
	color: #1583b6;
}

/*合作流程*/
.hezuo{
	margin-bottom: 3em;
}
.hezuo b{
	font-size: 3em;
	color: #333333;
	font-weight: normal;
	letter-spacing: 1px;
}
.hezuo b span{
	color: #1583b6;
}
.hezuo h3 span{
	font-size: 1.2em;
	line-height: 1.5em;
	color: #333;
	
}
.hezuo h3 span var{
	font-style: normal;
	font-weight: bold;
}
.hezuo h3 a{
	border: 1px solid #dfdfdf;
	color: #a1a1a1;
	font-size: 0.8em;
	padding: 0.1em 1em;
	display: inline-block;
	line-height: 1.2em;
}
.hezuo h3 em{
	font-style: normal;
	color: #e9e9e9;
	font-size:1.5em;
	display: inline-block;
	padding:0 0.5em;
}
.hezuo img{
	display: block;
	width: 1200px;
	margin:0 auto;
}

/*全网营销*/
.tixian>div{
	overflow: hidden;
	padding: 1em 0.5em;
}
.tixian>div div{
	overflow: hidden;
}
.tixian>div:nth-child(1) div{
	 background: #8dbf20;
}
.tixian>div:nth-child(2) div{
	 background: #e67817;
}
.tixian>div:nth-child(3) div{
	 background: #3b9ce1;
}
.tixian>div:nth-child(4) div{
	 background: #8dbf20;
}
.tixian>div:nth-child(5) div{
	 background: #18b2c8;
}
.tixian img{
	width: 50%;
	display: block;
	margin: 4em auto 2em;
	border-radius: 50%;
}
.tixian p{
	color: #fff;
	font-weight: bold;
	font-size: 1.7em;
	margin-bottom: 2em;
	text-align: center;
}
.tixian>div:hover img{
	box-shadow: 2px 2px 4px #414141;
}


/*客户*/
.kehu ul{
	overflow: hidden;
	border-left: 1px solid #dee1ec;
	border-top: 1px solid #dee1ec;
}
.kehu li{
	border-right: 1px solid #dee1ec;
	border-bottom: 1px solid #dee1ec;
}
.kehu img{
	width: 100%;
}

/*合作流程*/
.liuc{
	overflow: hidden;
	border: 1px solid #ededed;
	border-right: none;
	border-bottom: none;
	margin-bottom: 4em;
}
.liuc li{
	position: relative;
	border-right: 1px solid #ededed;
	border-bottom: 1px solid #ededed;
}
.liuc div{
	overflow: hidden;
	position: relative;
	z-index: 10;
}
.liuc img{
	display: block;
	margin: 4em auto 1em;
	width: 45%;
	padding: 1em;
	border-radius: 50%;
	background: #d8d8d8;
}
.liuc span{
	display: block;
	width: 35%;
	margin: 0 auto 1em;
	border-bottom: 1px solid #999999;
}
.liuc h5{
	font-size: 2em;
	color: #666666;
	text-align: center;
	margin-bottom: 0.5em;
	font-weight: bold;
}
.liuc p{
	font-size: 1em;
	color: #999999;
	margin-bottom: 3em;
	text-align: center;
}
.liuc .bk{
	width: 100%;
	height: 0;
	position: absolute;
	top: 50%;
	left: 0;
	background: #1583b6;
	z-index: 1;
}
.liuc li.on img{
	background:  #fff;
}
.liuc li.on span{
	border-bottom: 1px solid #fff;
}
.liuc li.on h5{
	color:  #fff;
}
.liuc li.on p{
	color:  #fff;
}


/*新闻列表*/
.news{
	margin-top: 3em;
}
.news li{
	overflow: hidden;
	border-bottom: 1px dashed #bebebe;
	padding-bottom: 1em;
}
.news div{
	padding-left: 2em;
	padding-top: 2em;
	overflow: hidden;
}
.news h4{
	font-size: 2em;
	color: #333;
}
.news h6{
	color: #3085c1;
	border-left: 2px solid #3085c1;
	margin-top: 1em;
	line-height: 2em;
	font-size: 1em;
	padding-left: 0.5em;
}
.news h6 span{
	padding: 0 0.5em;
}
.news p{
	font-size: 0.8em;
	color: #666666;
	line-height: 2em;
	margin-top: 1em;
	text-indent: 2em;
}
.news div a{
	color: #3085c1;
	display: block;
	margin-top: 1em;
}
.news div a span{
	padding-right: 0.5em;
}
.news div a:after{
	content: "▶";
}
/*新闻详情页*/
.newsshow{
	padding-bottom: 2em;
	border-bottom: 2px dotted #dedede;
}
.newsshow h1{
	font-size: 3em;
	color: #3085c1;
	padding: 2em 0 1em;
}
.newsinfo{
	overflow: hidden;
	padding: 0 100px;		
	padding-bottom: 1.5em;
	border-bottom: 2px dotted #dedede;
}
.newsinfo span, .newsinfo a{
	padding-left: 2em;
	color: #666666;
	font-size: 1.3em;
	line-height: 2em;
}
.newsinfo span:nth-child(1){
	background:url(../images/ni1.jpg) 0 center no-repeat;
}
.newsinfo span:nth-child(2){
	background:url(../images/ni2.jpg) 0 center no-repeat;
}
.newsinfo span:nth-child(3){
	background:url(../images/ni3.jpg) 0 center no-repeat;
}
.newsinfo a:nth-child(4){
	background:url(../images/ni4.jpg) 0 center no-repeat;
}

#textarea{
	margin-top: 2em;
	font-size: 1.4em;
	color: #666;
	line-height: 2em;
	text-indent: 2em;
	padding-bottom: 2em;
	border-bottom: 2px dotted #dedede;
}

.preNext{
	margin-top: 2em;
	padding: 0 30px;
	overflow: hidden;
}
.preNext li{
	font-size: 1.5em;
	line-height: 2em;
}
.preNext .back{
	display: block;
	background: #3085c1;
	color: #fff;
	line-height: 3em;
	text-align: center;
	margin-top: 1em;
}

/*支付方式*/
.pay{
	margin-top: 3em;
}
.paylist{	
	overflow: hidden;
	padding: 0 0.5em;
	margin: 1em 0;
}
.paylist img{
	border: 1px solid #d2d2d2;
}
.paylist div{
	border: 1px solid #d2d2d2;
	border-left: none;
}
.paylist p{
	color: #333333;
	font-size: 1.3em;
	padding: 0.2em 0.5em;
}
.paylist p:nth-child(1){
	padding-top: 5%;
}
.paylist p span{
	color: #f5a958;
	font-size: 1.4em;
	font-weight: bold;
}

.paylist1{
	border: 1px solid #d2d2d2;
	padding: 1em;
	margin: 1em 0;
	background-color: #f3f3f3;
}
.paylist1 h4{
	font-size: 1.5em;
	color: #3283bb;
	font-weight: bold;
	padding-left: 2.5em;
	background: url(../images/p11.jpg) 0 center no-repeat;
	background-size: 3% 100%;
}
.paylist1 div{
	padding: 1em 2em;
	line-height: 1.5em;
	font-size: 1.1em;
}
.paylist1 div span{
	font-weight: bold;
	font-size: 1.3em;
	color: #3283bb;
}
.paylist1 div p:nth-child(4){
	padding-left: 1.5em;
	background:url(../images/p12.png) 0 center no-repeat;
}


/*案例详情页*/
.casetit{
	overflow: hidden;
	padding: 2em 0;
}
.casetit h4{
	float: left;
	font-size: 2em;
	color: #3085c1;
	padding-left: 1.5em;
	font-weight:bold;
	margin-top: 0.5em;
	letter-spacing: 1px;
}
.casetit span {
	float: right;
	padding-right: 1.5em;
	display: block;
	overflow: hidden;
}
.casetit span a{
	margin-left: 1em;
	display: block;
}
.casescon{
	overflow: hidden;
	position: relative;
}
.casescon .d1{
	overflow: hidden;
	background: #0073c4;
	color: #fff;
	font-size: 1.5em;
	line-height: 2em;
	text-indent: 2em;
	padding-top: 5em;
	padding-left: 5em;
	padding-bottom: 5em;
	height: 60%;
}
.casescon .d1 p{
	width: 70%;
}
.casescon .d2{
	margin-top: -3em;
	margin-left: 5em;
	width: 55%;
	background: url(../images/cs3.jpg) 0 0 no-repeat;
	background-size: 87% 100%;
	padding-top: 1.6em;
	padding-bottom: 2em;
}
.casescon .d2 p{
	font-size: 1.5em;
	line-height: 2em;
	padding-left: 3em;
}
.casescon .d2 p span{
	font-weight: bold;
}
.casescon .d3{
	margin-top: 2em;
	padding-left: 5em;
	overflow: hidden;
}

/*案例用色分析*/
.casecolor{
	background: url(../images/casec1.jpg) center 0 no-repeat;
	overflow: hidden;
	margin-top: 2em;
}
.casecol{
	margin: 9.3em auto 0;
	text-align: center;
	position: relative;
}
.cimg1{
	width: 980px;
}
.cimg2{
	width: 900px;
	height: 508px;
	position: absolute;
	top: 40px;
	left: 50%;
	margin-left: -450px;
}
.caseco{
	overflow: hidden;
	text-align: center;
	margin: 3em auto 2em;
}
.caseco ul{
	overflow: hidden;
	margin-top: 3em;
}
.caseco li{
	padding: 0 6em;
}
.caseco li span{
	font-size: 19px;
}
.caseco li p{
	height: 38px;
	margin: 15px auto 0;
}
@media (max-width: 768px) {
	.casescon .d3{
		padding-left: 3em;
	}
}
.casescon .d3 a{
	margin-right: 1em;
}
.caseimg {
	background: #f1f1f1;
	padding-bottom: 2em;
	margin-top: 2em;

}
.caseimg img{
	max-width: 95%;
	display: block;
	margin: 0 auto;
}

@media (max-width: 768px) {
	.type{padding: 0;}
	.do{margin-top: 0;}
	.do .bd li{padding: 1em;}
	.do .bd p {font-size: 1.5em;}
	.do .hd{display: none;}
	.do .line{display: none;}
	.hezuo img{width: 100%;}
	.do .bd li.cur{background: none;}
	.do .bd li.cur p{color: #333;}
	.do .bd li.cur img:nth-child(1){display: block;}
	.do .bd li.cur img:nth-child(2){display: none;}
	.title b{font-size: 2.5em;}
	.title p{font-size: 1em;}
	.caseimg img{width: auto;}
}

@media (max-width: 360px) {
	.tixian p{font-size: 1.5em;}
}