@charset "utf-8";
.cn-left{
	width:180px;
	float:left;
	background:#358cf8;
	padding:0 10px 
}
.cn-right{
	width: calc(100% - 180px);
	padding:20px;
	float:left;
	background:#ffffff
}
.cnwd{
    height:750px;
	width:1200px;
	margin:0 auto
}
.content{
	background:url(../images/bg.png)  no-repeat;
	background-size:cover;
	padding:30px 0;
	width:100%
}
.dhk{
	background:url(../images/dhk.png)  no-repeat;
	width:100%;
	height:205px
}
.dhk p{
	padding:15px;
	font-size:16px;
	color:#c2ddff;
	text-indent:2em;
	line-height:24px
}
.znjqr{
	margin-bottom:130px;
	margin-left:-10px
}
.znjqr img{
	    z-index: 2;
    display: block;
    position: relative;
}
.wfgz a{
	text-align:center;
	width:100%;
	display:block
}
.wfgz{
	margin-bottom:47px
}
.xxzx{
	background:url(../images/xxzx.png) no-repeat;
	height:90px;
	margin-right:20px;
	width: calc(50% - 10px);
	float:left
}
.dhzx{
	background:url(../images/dhzx.png) no-repeat;
	height:90px;
	width: calc(50% - 10px);
	float:left
}
.xxzx a,.dhzx a{
	display:block;
	height:100%;
	width:100%
}
.wt{
	width:260px;
	float:left;
}
.czkj-chat-center{
	width: calc(100% - 280px);
	margin-right:20px;
	float:left;
	background:url(../images/znwd.jpg) bottom center no-repeat;
	background-size:cover;
	border:1px solid #d7dfea;
	border-radius: 10px;
}
.zx{
	margin-bottom:20px;
	    width: 100%;
    height: 90px;
}
.czkj-chat-input textarea{
	background-color:#eff5fa
}
.czkj-chat-input{
	border-radius:0 10px;
	background-color:#eff5fa;
	height:120px
}
#chat{
	height:480px
}

.czkj-chat-input .czkj-enter-btn{
	background:#358cf8;
	color:#fff;
	border-radius:2px;
	font-size:18px;
	width:100px
}
.cjwt{
	border:1px solid #dfdfdf;
	border-radius: 10px;
	margin-bottom:20px
}
.cjwt h3{
	background-color:#eff5fa;
	line-height:48px;
	border-bottom:1px solid #dfdfdf;
	font-size:18px;
	position:relative;
	padding-left:44px
}
.cjwt h3 i{
	width:24px;
	height:24px;
	background:url(../images/cjwt.png) no-repeat;
	position:absolute;
	left:12px;
	top:12px
}
.cjwt .list-t li{
	
	line-height:40px;
	padding-left:25px
}
.cjwt .list-t li:before{
	left:11px
}
.cjwt .list-t li+li{
    border-top: 1px solid #dfdfdf;
}
.cjwt .list-t{
	padding: 7.5px 0;
}
.bmfw{
	border:1px solid #dfdfdf;
	border-radius: 10px;
	padding-bottom:10px
}
.bmfw h3{
	background-color:#eff5fa;
	line-height:48px;
	border-bottom:1px solid #dfdfdf;
	font-size:18px;
	position:relative;
	padding-left:44px
}
.bmfw h3 i{
	width:24px;
	height:24px;
	background:url(../images/bmfw.png) no-repeat;
	position:absolute;
	left:12px;
	top:12px
}
.bmfw .list-a li{
	width:50%;
	float:left;
	margin-bottom:5px
}
.bmfw .list-a li i{
	margin:0 auto;
	width:36px;
	height:36px;
	display:block;
	background-size:100%;
	margin-top:20px;
	
}
.bmfw .list-a li i.s1{
	background: url(../images/hjbl.png) no-repeat;	
}
.bmfw .list-a li i.s2{
	background: url(../images/zyzg.png) no-repeat;	
}
.bmfw .list-a li i.s3{
	background: url(../images/jyky.png) no-repeat;	
}
.bmfw .list-a li i.s4{
	background: url(../images/jtcx.png) no-repeat;	
}
.bmfw .list-a li i.s5{
	background: url(../images/jycy.png) no-repeat;	
}
.bmfw .list-a li i.s6{
	background: url(../images/zjbl.png) no-repeat;	
}
.bmfw .list-a::after ,.jqr .list-a::after,#chat > li.czkj-robot::after{
        content: '';
        height: 0;
        display: block;
        clear: both;
        visibility: hidden;
}
.czkj-enter-word{
	font-size:14px;
	font-style:italic;
	bottom: 0;	
    position: absolute;
}
.czkj-chat-input .czkj-enter-word span{
	color:#333333;
	font-style:normal;
}
.czkj-chat-input textarea::placeholder{
	color:#abaaaa;
	font-size:16px
}
#chat .czkj-robot .czkj-msg{
	background: linear-gradient(to top, #e0f2ff 0%,#ffffff 100%);
	border-radius:4px;
	border:1px solid #c2d1e5;
	font-size:16px;
	line-height: 28px;
}
#chat .czkj-robot .czkj-msg:before {
	background:url(../images/span_2.png) no-repeat;
	width:8px;
	height:7px;
	position:absolute;
	left:-8px;
	top:4px;
	content: "";
}
#chat > li{
margin-bottom:20px
}
#chat > li.czkj-robot{
	padding-left:80px;
	overflow: visible;
}
#chat > li.czkj-robot:before{
	position:absolute;
	left:20px;
	top:-10px;
	display:block;
	content:'';
	width:48px;
	height:48px;
    background: url(../images/robot.png) left no-repeat;
}
#chat > li.czkj-user{
	padding-right:80px;
	overflow: visible;
}
#chat > li.czkj-user:before{
    background: url(../images/user.png) right no-repeat;
	position:absolute;
	right:20px;
	top:-10px;
	display:block;
	content:'';
	width:48px;
	height:48px;
}
#chat .czkj-user .czkj-msg{
	background:#358cf8;
	border-radius:4px;
	font-size:16px;
	line-height: 24px;
    padding: 10px 12px;
    color: #fff;
}
#chat .czkj-user .czkj-msg:before {
	background:url(../images/span_1.png) no-repeat;
	width:8px;
	height:7px;
	position:absolute;
	right:-8px;
	top:4px;
	content: "";
}
@media (max-width: 1200px) {
	.cnwd{
		width:100%
	}
}
@media (max-width: 1024px) {
	#chat > li {
		margin-bottom: 40px;
	}
    .cn-left{
		display:none
	}
	.cn-right{
		width:100%
	}
	.xxzx,.dhzx{
		background-size: 100% 100%;
	}
}
@media (max-width: 768px) {
	.xxzx,.dhzx{
		height: 120px;
		width: 100%;
		margin-bottom: 20px;
	}
	.czkj-chat-center,.wt{
		width:100%;
		margin-bottom:20px
	}
	
}
@media (max-width: 640px) {
	.czkj-chat-input {
		border-radius: 0 10px;
		background-color: #eff5fa;
		height: 120px;
	}
	.czkj-enter {
		display: block;
	}
	.xxzx,.dhzx{
		height:100px
	}
}
@media (max-width: 430px) {
	#chat > li.czkj-robot,#chat > li.czkj-user{
		padding:0px 5%;
		width:100%;
		margin:20px auto
	}
	#chat > li.czkj-robot:before,#chat > li.czkj-user:before{
		display:none
	}
	#chat .czkj-msg{
		width:100%;
		max-width:100%
	}
}