.clearfix:after{ content: ''; display: block; clear: both; width: 0; height: 0;}
/*banner*/

.app-banner{ width: 100%; height:620px; background-repeat: no-repeat; background-position: center top;}
.app-banner.exam{ background-image:url(../images/exam-1.jpg);}
.app-banner .banner-tex{ text-align: center; color: #fff; padding-top: 155px;}
.app-banner .banner-tex h4{ font-size: 48px; font-weight:lighter; line-height: 58px; margin-top: 25px;}
.app-banner .banner-tex p{ font-size: 24px; line-height: 30px;}
.app-banner .banner-tex span{ margin-top:20px; display:block; font-size:30px; line-height: 40px;}
.app-banner .banner-bot{ margin-top: 45px;}
.app-banner .banner-btn{ margin-top: 15px; display:block; position: relative;}
.app-banner .banner-btn p{ width: 100px; text-align: right; color: #fff; font-size: 20px; display: inline-block;}
.app-banner .banner-btn a{ margin-left: 20px; display:inline-block; line-height:50px; width: 238px; border: 1px solid #ff6800; color: #ff6800; font-size:18px;}
.app-banner .banner-btn a.on{ background-color: #ff6800; color: #fff;}
.app-banner .banner-btn a:hover{ background-color: #ec6000; color: #fff;}
.app-banner .banner-btn dl{ display:none; z-index: 2; position: absolute; top:82px; right:50%; margin-right:-287.5px; padding: 15px 10px; border: 1px solid #ededed; background-color: #fff; text-align: center;}
.app-banner .banner-btn dt img{ width: 137px; height: 137px; padding: 13px; border: 1px solid #ededed;}
.app-banner .banner-btn dd{ color: #ff6800; font-size: 16px; padding-top: 15px; line-height: 16px;}
.app-banner .banner-btn dl sup{ position: absolute; left:50%; margin-left: -10px; top: -19px; display: block; border: 10px solid transparent;
    border-bottom: 9px solid #fff;
    width: 0;
    height: 0px;
    }
/*考试系统*/
.app-main{ min-width: 1200px;}
.exam-o{ margin-top: -104px; padding-bottom: 60px;}
.exam-o-img{ text-align: center;}
.exam-o-img img{ display: inline-block;}
.exam-o-problem{ margin-top: 40px;}
.exam-tit{ text-align: center; margin-bottom: 40px;}
.exam-tit h4{ color: #333; font-size: 30px; line-height: 46px; font-weight: normal;}
.exam-tit p{ color: #999; font-size: 16px; line-height: 28px;}
.exam-o-problem-con .box{ padding: 40px 0; width: 570px; -moz-box-shadow:0 5px 25px rgba(0,0,0,.1);;-webkit-box-shadow:0 5px 25px rgba(0,0,0,.1);;box-shadow:0 5px 25px rgba(0,0,0,.1);}
.exam-o-problem-con .box:before{ content: ''; float: left; display: block; width: 123px; height: 122px; background: url(../images/exam-3.png) no-repeat; background-position: 0 -355px; margin: 20px 38px 0 42px;}
.exam-o-problem-con .box-con{ float: left;}
.exam-o-problem-con h4{ color: #ff6800; font-size: 24px; font-weight: normal; line-height: 24px;}
.exam-o-problem-con ul{ margin-top: 20px;}
.exam-o-problem-con li{ font-size: 14px; color: #666; line-height: 17px; padding-left: 25px; margin:12px 0 0 0; background: url(../images/exam-3.png) no-repeat; background-position: 0 -599px;}
.exam-o-problem-con .fr.box:before{ background-position: 0 -477px;}
.exam-o-problem-con .fr h4{ color: #a5d76e;}
.exam-o-problem-con .fr li{ background-position: 0 -616px;}
.exam-o-function{ margin-top: 60px;}
.exam-o-function ul{ margin-left: -53px;}
.exam-o-function li{ width: 260px; margin-left: 53px; padding: 35px 0 40px; float: left; text-align: center; -moz-box-shadow:0 5px 25px rgba(0,0,0,.1);;-webkit-box-shadow:0 5px 25px rgba(0,0,0,.1);;box-shadow:0 5px 25px rgba(0,0,0,.1);}
.exam-o-function .li-img{ width: 94px; height: 87px; margin: 0 auto;}
.exam-o-function .li-img span{ display: block; float: left; width: 94px; height: 82px; margin: 2.5px 0 0 0; background: url(../images/exam-3.png) no-repeat; background-position: 0 -273px;}
.exam-o-function li:nth-child(2) .li-img span{ width: 60px; height: 87px; margin: 0 0 0 17px; background-position: 0 -108px;}
.exam-o-function li:nth-child(3) .li-img span{ width: 56px; height: 71px; margin: 8px 0 0 19px; background-position: 0 -37px;}
.exam-o-function li:nth-child(4) .li-img span{ width: 70px; height: 78px; margin: 4.5px 0 0 12px; background-position: 0 -195px;}
.exam-o-function dl{ margin-top: 30px;}
.exam-o-function dt{ color: #333; font-size: 24px; line-height: 24px;}
.exam-o-function dd{ color: #999; font-size: 18px; line-height: 18px; margin-top: 15px;}
.exam-o-function .tex{ text-align: center; color: #999; font-size: 16px; line-height: 24px; padding: 50px 0 0 0;}
.exam-t{ padding-top: 84px; height: 456px; overflow: hidden; background: url(../images/exam-4.jpg) no-repeat top center; background-attachment: fixed;}
.exam-t-con{ background-color: #fff; height: 380px;}
.exam-t-con .fl{ width: 50%; height: 100%; background: url(../images/exam-6.png) center no-repeat #f7f7f7;}
.exam-t-con .fr{ margin-top: 60px; color: #999;}
.exam-t-con .code{ float: left; text-align: center; font-size: 14px;}
.exam-t-con .code img{ padding: 18px; border: 1px solid #959595; width: 204px; height: 204px;}
.exam-t-con .code p{ padding-top: 10px;}
.exam-t-con .dow { float: left; margin: 0 30px;}
.exam-t-con .dow h4{ font-weight: normal;}
.exam-t-con .dow a{-moz-border-radius:5px; -webkit-border-radius:5px; border-radius: 5px; display: block; padding:10px 25px; border: 1px solid #00aaee; color: #00aaee; font-size: 18px; margin-top: 10px;}
.exam-t-con .dow a span{ display: inline-block; line-height: 37px; padding-left: 52px; background: url(../images/exam-3.png) no-repeat;}
.exam-t-con .dow a:hover{ background-color: #00aaee; color: #fff;}
.exam-t-con .dow p{ font-size: 12px; margin-top: 20px;}
.exam-s dl{ padding:60px 0; border-bottom:1px solid #e4e4e4}
.exam-s dl.dl-s{ border-bottom:1px solid #e4e4e4; padding-bottom:40px; margin-bottom:0}
.exam-s dl.dl-f{ border-bottom:0; padding-bottom:45px; margin-bottom:0}
.exam-s dl h4{ color:#333; font-size:28px; line-height:30px; font-weight:normal; padding-top:88px;}
.exam-s dl p{ font-size:14px; color: #333; line-height:22px; padding-top:15px;}
.exam-s dl dd { position:relative;}
.exam-s dl dd.bounceInLeft span{ width:79px; height:178px; background:url(../images/crm-10.png) no-repeat; position:absolute; right:-40px; bottom:-40px;}
.exam-s dl dd.bounceInLeft { margin-left:45px;} 
.exam-s dl dd.bounceInRight { margin-right:45px;} 
.exam-s dl dt.bounceInLeft { margin-left:45px;} 
.exam-s dl dt.bounceInRight { margin-right:45px;} 
.exam-s .t-b{ padding:60px 0 40px; text-align:center; background: url(../images/exam-13.jpg) no-repeat center top #f5f5f5;}
.exam-s .t-b .p-o{ color:#fc5604; font-size:36px; line-height:56px;}
.exam-s .t-b .p-o span{ display:block; color:#ff6800; font-size: 24px; padding: 15px 0;}
.exam-s .t-b a{ display:inline-block; width:240px; height:52px; text-align:center; line-height:52px; background-color:#ff6800; color:#fff; font-size:22px; margin:15px 0;}
.exam-s .t-b a:hover{ background-color:#e95f00;;}
.exam-s .t-b .p-o a{ display: inline-block; line-height: 30px; height: 30px; background-color: #96cb11; width: auto; padding: 0 10px; font-size: 16px; margin-left: 20px;}
.exam-s .t-b .p-t{ color:#fc5604; font-size:18px; line-height:28px;}

/*CRM*/
.app-banner.crm{ height: 760px; background-image:url(../images/crm-1.jpg);}
.app-banner.crm .banner-tex{ padding-top: 125px;}
.crm-main .exam-o{ margin-top: -270px;}
.crm-main .exam-o-img img{ padding-left: 90px;}
.crm-main .exam-o-problem-con .box{-moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none; width: auto; padding-bottom: 0;}
.crm-main .exam-o-problem-con .box:before{ width: 127px; height: 127px; background-position: 0 -633px; margin-left: 0; margin-top: 0;}
.crm-main .exam-o-problem-con .box:nth-child(2):before{ height: 123px; background-position: 0 -760px;}
.crm-main .exam-t-con .fl{ background: url(../images/exam-14.png) no-repeat center #f7f7f7;}
.crm-main .exam-s dl h4{ padding-top: 70px;}
.crm-main .exam-s .t-b{ min-height:343px; padding:100px 0 0 0 ; background: url(../images/exam-20.jpg) no-repeat center bottom #fff;}


@media screen and (max-width: 640px){
	.app-main{
		min-width: 100%;
	}
	.app-banner.crm{
		height: 450px;
	}
	.app-banner .banner-tex p{
		font-size: 18px;
	}
	.app-banner .banner-tex h4{
		font-size: 18px;
		margin-top: 0;
	}
	.app-banner .banner-tex span{
		font-size: 18px;
		margin-top: 0;
	}
	.app-banner.crm .banner-tex{
		padding-top: 75px;
	}
	.app-banner .banner-btn p{
	    width: 60px;
    	font-size: 16px;
	}
	.app-banner .banner-btn a{
		width: 118px;
    	font-size: 16px;
    	line-height: 40px;
    	border-radius: 5px;
	}
	.crm-main .exam-o-img img{
		padding-left: 0;
    	width: 100%;
	}
	.crm-main .exam-o{
		margin-top: -70px;
	}
	.exam-tit h4{
		font-size: 18px;
	}
	.exam-tit p{
		font-size: 14px;
	}
	.exam-o-problem-con li{
		font-size: 12px;
	}
	.exam-o-problem{
		padding: 0 15px;
	}
	.exam-o-problem-con .box-con{
		margin-top: 15px;
	}
	.crm-main .exam-t-con .fl{
		display: none;
	}
	.exam-t{
		height: 425px;
	}
	.exam-t-con{
		height: 320px;
	}
	.exam-t-con .code img{
		width: 140px;
		height: auto;
	}
	.exam-t-con .fr{
		width: 100%;
	}
	.exam-t-con .code{
	    padding-left: 15px;
	}
	.exam-t-con .dow{
		margin: 0;
    	margin-left: 10px;
	}
	.exam-t-con .dow a{
		font-size: 14px;
    	padding: 10px;
	}
	.exam-s .t-b .p-o{
		font-size: 18px;
		line-height: 36px;
	}
	.exam-s .t-b .p-o span{
		font-size: 16px;
	}
	.exam-s .t-b .p-o a{
		margin-left: 0;
	}
	.exam-s .t-b a{
		width: 210px;
    	font-size: 18px;
	}
	.exam-s dl dt.bounceInRight{
		width: calc(60% - 15px);
		margin-right: 0;
		padding-left: 15px;
	}
	.crm-main .exam-s dl h4{
		padding-top: 0;
		font-size: 16px;
	}
	.exam-s dl{
    	padding: 50px 10px;
	}
	.exam-s dl p{
		font-size: 12px;
	}
	.exam-s dl dd.bounceInLeft{
		width: 40%;
		margin-left: 0;
	}
	.exam-s dl dd.bounceInLeft img{
		width: 100%;
	}
	.exam-s dl dt.bounceInLeft{
		width: calc(60% - 15px);
		margin-left: 0;
		padding-right: 15px;
	}
	.exam-s dl dd.bounceInRight{
		width: 40%;
		margin-right: 0;
	}
	.exam-s dl dd.bounceInRight img{
		width: 100%;
	}
	.crm-main .exam-s .t-b{
	    min-height: 330px;
    	padding: 80px 0 0 0;
	}

}