  body {
	background: #FFFFFF;
	font: 14px/1.5 'Arial','Microsoft YaHei', 'SIMSUN';
	color: #617B87;
	min-width: 980px;
}

body.sub-gray {
    background: #F5F4F9;
}

p, h3 {
	margin: 0;
}

.left {
	float: left;
}

.right {
	float: right;
}

.center {
	margin: 0 auto;
}

ul, ol {
	list-style: none;
	margin: 0;
	padding: 0;
}

a {
	cursor: pointer;
}

a:link, a:visited {
	color: #607A86;
	text-decoration: none;
}

.clearfix:after{
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}

.clearfix{
	*+height:1%;
}

.container {
	width: 980px;
	margin: 0 auto;
}

 .header {
    width: 100%;
    min-width: 980px;
    height: 87px;
    background: url("../img/header.png") center top no-repeat;
   /*  position: fixed;  */
    top: 0;
    z-index: 999;
}

.header .logo a {
    width: 130px;
    height: 51px;
    display: block;
    background: url("../img/sprites.png") 0 0 no-repeat;
    margin: 17px 0 0 52px;
}

.header .nav-button {
    line-height: 51px;
}

.header .button {
    margin-left: 30px;
    cursor: pointer;
}

.header .button i {
    width: 20px;
    height: 20px;
    float: left;
    margin-right: 5px;
    display: block;
    margin-top: 15px;
}

.header .button.register i {
    background: url("../img/sprites.png") -170px 0 no-repeat;
}

.header .button.try i {
    background: url("../img/sprites.png") -200px 0 no-repeat;
}

.header .button.message i {
    background: url("../img/sprites.png") -230px 0 no-repeat;
}

.header .button span {
    float: left;
    color: #333333;
    display: block;
}

.main {
    position: relative;
}

.main .banner {
    width: 100%;
    position: relative;
}

.main .banner ul.banner-list {
    position: relative;
    height: 100%;
}

.main .banner ul.banner-list li {
    width: 100%;
    min-width: 980px;
    height: 100%;
    position: absolute;
    display: none;
    opacity: 0;
    filter:alpha(opacity=0);
}

.main .banner ul.banner-list li a {
    width: 100%;
    height: 100%;
    display: block;
}

.main .banner .banner-focus {
    width: 100%;
    height: 30px;
    position: absolute;
    left: 0;
    bottom: 60px;
}

.main .banner .banner-focus .banner-focus-box {
    text-align: center;
}

.main .banner .banner-focus .banner-focus-box .ol-bg {
    width: 107px;
    height: 22px;
    text-align: center;
    margin: 0 auto;
}

.main .banner .banner-focus .banner-focus-box ol {
    display: inline-block;
    *display: inline;
    *zoom: 1;
}


.main .banner .banner-focus .banner-focus-box ol li {
    width: 10px;
    height: 10px;
    display: block;
    float: left;
    cursor: pointer;
    margin: 0 5px;
    background: url("../img/sprites.png") -20px -75px no-repeat;
}

.main .banner .banner-focus .banner-focus-box ol li.active {
    background: url("../img/sprites.png") 0 -75px no-repeat;
}

.main .tool {
    height: 760px;
    padding-top: 60px;
    background: url("../img/toolbg.jpg") center top no-repeat;
}

.main .tool .tool-headline {
    width: 514px;
    height: 142px;
    margin: 0 auto 58px auto;
    background: url("../img/sprites.png") -248px -108px no-repeat;
    text-indent: -9999px;
}

.main .tool .summary {
    margin: 0 0 60px 0;
    padding-top: 57px;
    color: #333333;
}

.main .summary p {
    text-align: center;
    font-size: 16px;
}

.main ul.list li {
    float: left;
    width: 260px;
    margin-right: 90px;
    position: relative;
}

.main ul.list li.last {
    margin-right: 0;
}

.main .tool ul.list li a .tool-bg {
    width: 260px;
    height: 257px;
    padding-top: 60px;
    text-align: center;
    position: relative;
    z-index: 1;
}

.main .tool ul.list li a .tool-bg .tool-img {
    margin-bottom: 70px;
}

.main .tool ul.list li a .tool-bg .tool-img img {
    transform: scale(1);
    transition: all .8s ease 0s;
    -webkit-transform: scale(1);
    -webkit-transform: all .8s ease 0s;
    -ms-transform: scale(1);
    -ms-transform: all .8s ease 0s;
    -moz-transform: scale(1);
    -moz-transform: all .8s ease 0s;
}

.main .tool ul.list li a:hover .tool-bg .tool-img img {
    transform: scale(0.9);
    transition: all .5s ease 0s;
    -webkit-transform: scale(0.9);
    -webkit-transform: all .8s ease 0s;
    -ms-transform: scale(0.9);
    -ms-transform: all .8s ease 0s;
    -moz-transform: scale(0.9);
    -moz-transform: all .8s ease 0s;
}

.main ul.list li a h3 {
    margin-top: 15px;
    font-weight: 500;
    font-size: 20px;
}

.main .tool ul.list li a .yy {
    width: 280px;
    height: 337px;
    position: absolute;
    top: -10px;
    left: -10px;
    z-index: 0;
    display: none;
}

.main .tool ul.list li a .yy.syy {
    background: url("../img/yy.png") 0 0 no-repeat;
}
.main .tool ul.list li a .yy.lyy {
    background: url("../img/yy.png") -350px 0 no-repeat;
}
.main .tool ul.list li a .yy.ayy {
    background: url("../img/yy.png") -700px 0 no-repeat;
}

.main .tool ul.list li a .tool-bg.tool-school {
    background: url("../img/sprites.png") -70px -270px no-repeat;
    color: #65B948;
}
.main .tool ul.list li a .tool-bg.tool-leader {
    background: url("../img/sprites.png") -360px -270px no-repeat;
    color: #4581BC;
}
.main .tool ul.list li a .tool-bg.tool-ability {
    background: url("../img/sprites.png") -655px -270px no-repeat;
    color: #47B2BA;
}

.main .project {
      padding-top: 80px;
      height: 1000px;
      background: url("../img/projectbg.jpg") center top no-repeat;
      background-size: 1920px 1080px;
  }

.main .project .project-headline {
    width: 508px;
    height: 132px;
    background: url("../img/sprites.png") -235px -620px no-repeat;
    text-indent: -9999px;
    margin: 0 auto;
}

.main .project .summary {
    margin: 0 0 100px 0;
    color: #F3F3F3;
    padding-top: 30px;
}

.main .project .project-bg {
    width: 260px;
    height: 317px;
    background: url("../img/sprites.png") -70px -795px no-repeat;
    text-align: center;
    color: #FFFFFF;
}

.main .circle-icon {
    padding-top: 49px;
    height: 162px;
}

.main .circle-icon img {
    transform: scale(1);
    transition: all .8s ease 0s;
    -webkit-transform: scale(1);
    -webkit-transform: all .8s ease 0s;
    -ms-transform: scale(1);
    -ms-transform: all .8s ease 0s;
    -moz-transform: scale(1);
    -moz-transform: all .8s ease 0s;
}

.main .project-classify ul.list li a:hover .circle-icon img {
    transform: scale(1.1);
    transition: all .5s ease 0s;
    -webkit-transform: scale(1.1);
    -webkit-transform: all .8s ease 0s;
    -ms-transform: scale(1.1);
    -ms-transform: all .8s ease 0s;
    -moz-transform: scale(1.1);
    -moz-transform: all .8s ease 0s;
}

.main .dream {
    padding-top: 85px;
    height: 735px;
    background: url("../img/dreambg.jpg") center top no-repeat;
}

.main .dream .dream-headline {
    width: 592px;
    height: 131px;
    background: url("../img/sprites.png") -192px -1160px no-repeat;
    margin: 0 auto;
    text-indent: -9999px;
}

.main .dream .summary {
    margin: 0 0 70px 0;
    color: #FFFFFF;
    padding-top: 30px;
}

.dream-banner {
    width: 100%;
    height: 360px;
}

.dream-banner .dream-banner-box {
    position: relative;
}

.dream-banner ul.dream-banner-list {
    width: 100%;
    height: 360px;
    position: relative;
}

.dream-banner ul.dream-banner-list li {
    width: 100%;
    height: 360px;
    position: absolute;
    display: none;
    opacity: 0;
    filter:alpha(opacity=0);
}

.dream-banner ul.dream-banner-list li a {
    width: 100%;
    height: 360px;
    display: block;
}

.dream-banner .dream-banner-box span.dream-banner-arrow {
    width: 36px;
    height: 67px;
    display: block;
    position: absolute;
    top: 145px;
    cursor: pointer;
}

.dream-banner .dream-banner-box span.dream-banner-arrow.prev {
    left: -60px;
    background: url(../img/sprites.png) -300px 0 no-repeat;
}

.dream-banner .dream-banner-box span.dream-banner-arrow.next {
    right: -60px;
    background: url(../img/sprites.png) -386px 0 no-repeat;
}

.contact {
    padding: 80px 0;
}

.contact.self-bg {
    background: #FFFFFF;
}

.contact .headline {
    background: url("../img/sprites.png") -900px 0 no-repeat;
    border-bottom: 1px solid #D5DFE7;
    padding-bottom: 15px;
    text-indent: -9999px;
}

.contact .contact-box {
    padding: 15px 0;
}

.contact .contact-box .cs {
    width: 370px;
}

.contact .contact-box .cs .contact-way {
    margin-top: 25px;
}

.contact .contact-box .cs .contact-summary {
    line-height: 1.6em;
    font-size: 14px;
    color: #717171;
}

.contact .contact-box .cs .contact-way .tel {
    float: left;
    font-size: 16px;
}

.contact .contact-box .cs .contact-way .email {
    float: right;
    font-size: 16px;
}

.contact .contact-box .cs .contact-way .tel i {
    width: 20px;
    height: 20px;
    background: url("../img/sprites.png") -510px -2px no-repeat;
    float: left;
    margin-right: 10px;
}

.contact .contact-box .cs .contact-way .email i {
    width: 20px;
    height: 14px;
    background: url("../img/sprites.png") -594px -3px no-repeat;
    float: left;
    margin-top: 5px;
    margin-right: 10px;
}

.contact .contact-box .ec {
    width: 260px;
}

.contact .contact-box .ec .ecode {
    float: left;
    width: 99px;
    margin-right: 10px;
    *margin-right: 5px;
}

.contact .contact-box .ec .ecode.last {
    width: 142px;
    margin-right: 0;
}

.contact .contact-box .ec .ecode .logo1 {
    width: 101px;
    height: 41px;
    background: url("../img/sprites.png") -206px -1455px no-repeat;
}

.contact .contact-box .ec .ecode .logo2 {
    width: 142px;
    height: 35px;
    padding-top: 6px;
    background: url("../img/sprites.png") 0 -1454px no-repeat;
}

.contact .contact-box .ec .ecode .ecode1 {
    width: 78px;
    height: 78px;
    background: url("../img/sprites.png") -406px -1406px no-repeat;
    margin: 26px auto 0 auto;
}

.contact .contact-box .ec .ecode .ecode2 {
    width: 78px;
    height: 78px;
    margin: 26px 0 0 38px;
    background: url("../img/sprites_update.png") -556px -1406px no-repeat;
}

.contact .contact-box .ec .ecode p {
    text-align: center;
    color: #333333;
}

.contact .contact-box .ec .ecode.last p {
    padding-left: 14px;
}

.contact .story,
.contact .about {
    float: left;
}

.contact .story {
    width: 310px;
    margin-right: 15px;
}

.contact .story .headline {
    background-position: -880px -1470px;
}

.contact .about {
    width: 655px;
}

.footer {
    width: 100%;
    background: #333333;
    color: #F3F3F3;
    padding: 40px 0;
    text-align: center;
}

.footer a {
    color: #F3F3F3;
}

.back-top {
    width: 65px;
    height: 65px;
    position: fixed;
    bottom: 20px;
    right: 20px;
    /* background: url("../img/back-top.png") no-repeat; */
    cursor: pointer;
    display: none;
}

.shade {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    background: url("../img/coverbg.png") repeat;
    display: none;
}



.shade .login-box {
    width: 368px;
    height: 436px;
    background: url("../img/login-bg.png") no-repeat;
    position: absolute;
    left: 50%;
    margin-left: -184px;
    top: -500px;
}

.shade .login-wrap {
    width: 270px;
    margin: 0 auto;
}

.shade .dialog-headline {
    height: 72px;
    margin: 25px auto 0 auto;
}

.shade .dialog-headline span {
    font-size: 12px;
    color: #999;
    float: left;
    margin: 29px 0 0 20px;
}

.shade .dialog-headline h3 {
    color: #1D8DEB;
    font-size: 18px;
    font-weight: 500;
    float: left;
    line-height: 72px;
}

.shade .dialog-headline .close {
    width: 18px;
    height: 18px;
    background: url("../img/sprites.png") -784px -945px no-repeat;
    cursor: pointer;
    float: right;
    margin: 27px 0 0 0;
}

.shade .login-box form {
    margin-top: 20px;
}

.shade .login-box .item {
    margin-bottom: 15px;
}

.shade .login-box input {
    width: 244px;
    height: 18px;
    padding: 10px 12px;
    border-radius:4px;
    border: 1px solid #DFDFDF;
}

.shade .login-box input.vcode {
    width: 106px;
}

.shade input.button {
    width: 270px;
    height: 41px;
    background: url("../img/sprites.png") -484px -945px no-repeat;
    color: #FFFFFF;
    font-size: 16px;
    border: 0;
    padding: 0;
    border-radius: 0;
    margin: 0 auto;
}

.shade p.error {
    text-align: center;
}

.shade p.error span {
    background: url("../img/sprites.png") -960px -950px no-repeat;
    padding-left: 25px;
    height: 15px;
    font-size: 12px;
    color: #FF6969;
}

.shade .big-box {
    width: 688px;
    height: 433px;
    background: url("../img/dialog-bg.png") no-repeat;
    position: absolute;
    left: 50%;
    margin-left: -344px;
    top: -500px;
}

.shade .big-box .dialog-wrap {
    width: 600px;
    margin: 0 auto;
    position: relative;
}

.shade .big-box .form-box {
    margin-top: 32px;
}

.shade .big-box .form-box span {
    width: 58px;
    height: 40px;
    padding-right: 10px;
    float: left;
    line-height: 40px;
    font-size: 12px;
}

.shade .big-box .form-box span.r-star {
    background: url("../img/sprites.png") -904px -1001px no-repeat;
}

.shade .big-box .try-infor {
    width: 280px;
}

.shade .big-box .try-infor input {
    width: 186px;
    height: 18px;
    border: 1px solid #DFDFDF;
    border-radius: 4px;
    padding: 10px 12px;
    float: right;
}

.shade .big-box .try-product span {
    width: auto;
}

.shade .big-box .try-product input {
    width: 444px;
    height: 18px;
    border: 1px solid #DFDFDF;
    border-radius: 4px;
    padding: 10px 12px;
}

.shade .dialog-button {
    width: 270px;
    margin: 35px auto 0 auto;
}

.shade .message-inner {
    height: 180px;
}

.shade .message-inner textarea {
    width: 341px;
    height: 158px;
    border: 1px solid #DFDFDF;
    padding: 10px;
}

.shade .message-infor {
    width: 216px;
}

.shade .message-infor .message-infor-item {
    margin-bottom: 30px;
}

.shade .message-infor .message-infor-item.last {
    margin: 0;
}

.shade .big-box .form-box .message-infor span {
    width: 44px;
    float: left;
}

.shade .big-box .form-box .message-infor span.r-star {
    background: url("../img/sprites.png") -927px -1001px no-repeat;
}

.shade .message-infor input {
    width: 134px;
    height: 18px;
    padding: 10px 12px;
    border: 1px solid #DFDFDF;
    border-radius: 4px;
}

.shade .res-box {
    display: none;
    position: absolute;
    top: 55px;
    left: 50px;
}

.shade .res-message {
    width: 500px;
    margin: 50px auto 0 auto;
}

.shade .res-message i.res-icon {
    width: 60px;
    height: 60px;
    background: url("../img/sprites.png") -484px -1010px no-repeat;
    display: block;
    margin: 0 auto;
}

.shade .res-message p {
    width: 500px;
    text-align: center;
    margin: 35px auto 0 auto;
    font-size: 16px;
    color: #333333;
}

.shade .dialog-content {
    display: none;
}

.shade .dialog-content.show {
    display: block;
}

subpages
.sub-bg {
    height: 87px;
}

.sub-page .sub-headline {
    width: 980px;
    height: 75px;
    text-indent: -9999px;
    margin-top: 30px; 
}

.sub-page .sub-headline.scheme {
    background: url("../img/sub-sprites.png") 0 0 no-repeat;
}
.sub-page .sub-headline.exam {
    background: url("../img/sub-sprites.png") 0 -343px no-repeat;
} 

.sub-page .plate {
    margin: 35px 0;
    padding-bottom: 30px;
    border-bottom: 1px dotted #D0D7D9;
}

.sub-page .work {
      margin: 35px 0;
      padding-bottom: 30px;
      border-bottom: 1px dotted #D0D7D9;
}

.sub-page .plate .plate-headline {
    text-indent: -9999px;
    margin-bottom: 15px;
}

.sub-page .plate .school-headline {
    height: 51px;
    background: url("../img/sub-sprites.png") 0 -87px no-repeat;
}
.sub-page .plate .leader-headline {
    height: 67px;
    background: url("../img/sub-sprites.png") 0 -162px no-repeat;
}
.sub-page .plate .job-headline {
    height: 72px;
    background: url("../img/sub-sprites.png") 0 -252px no-repeat;
}
.sub-page .plate .ability-headline {
     height: 62px;
     background: url("../img/sub-sprites.png") 0 -487px no-repeat;
 }
.sub-page .plate .work-headline {
      height: 62px;
      background: url("../img/sub-sprites.png") 0 -780px no-repeat;
 }
.sub-page .plate .character-headline {
    height: 46px;
    background: url("../img/sub-sprites.png") 0 -595px no-repeat;
}
.sub-page .plate .mental-health-headline {
      height: 52px;
      background: url("../img/sub-sprites.png") 0 -873px no-repeat;
}
.sub-page .plate .motive-headline {
    height: 69px;
    background: url("../img/sub-sprites.png") 0 -676px no-repeat;
}

.sub-page ul.list li {
    width: 268px;
    height: 328px;
    border: 1px solid #DDDDDD;
    float: left;
    margin-right: 85px;
    margin-bottom: 35px;
    background: #FFFFFF;
}

.sub-page ul.list li.last {
    margin-right: 0;
}

.sub-page ul.list li a {
    display: block;
}

.sub-page .plate .name {
    width: 260px;
    height: 105px;
    margin: 5px auto 0 auto;
    padding-top: 20px;
}

.sub-page .work .name {
      width: 260px;
      height: 105px;
      margin: 5px auto 0 auto;
      padding-top: 20px;
  }

.sub-page .plate.school-plate .name {
    background: #65B948;
}
.sub-page .plate.leader-plate .name {
    background: #4291BF;
}
.sub-page .plate.job-plate .name {
    background: #47B2BA;
}
.sub-page .plate.ability-plate .name {
    background: #99CC00;
}
.sub-page .plate.work-plate .name {
      background: #99CC00;
}
.sub-page .plate.character-plate .name {
    background: #0099CC;
}
.sub-page .plate.mental-health-plate .name {
      background: #0099CC;
}
.sub-page .plate.motive-plate .name {
    background: #FF9900;
}

.sub-page .plate .name p {
    color: #FFFFFF;
    text-align: center;
}

.sub-page .plate .name p.cnb {
    font-size: 26px;
}

.sub-page .plate .name p.en {
    font-size: 32px;
}

.sub-page .plate .name p.cn {
    font-size: 20px;
}

.sub-page .plate .summary {
    padding-top: 30px;
    height: 125px;
}

.sub-page .plate .summary p {
    color: #86989B;
    text-align: center;
}

.sub-page .more {
    width: 90px;
    height: 25px;
    background: url("../img/sprites.png") -790px -5px no-repeat;
    color: #999999;
    font-size: 12px;
    text-align: center;
    line-height: 25px;
    margin: 0 auto;
}

.sub-page .ability-plate ul.list li a:hover .more {
    background: url("../img/sprites.png") -890px -85px no-repeat;
    color: #FFFFFF;
}
.sub-page .work-plate ul.list li a:hover .more {
      background: url("../img/sprites.png") -890px -85px no-repeat;
      color: #FFFFFF;
}
.sub-page .mental-health-plate ul.list li a:hover .more {
    background: url("../img/sprites.png") -790px -120px no-repeat;
    color: #FFFFFF;
}
.sub-page .character-plate ul.list li a:hover .more {
      background: url("../img/sprites.png") -790px -120px no-repeat;
      color: #FFFFFF;
}
.sub-page .motive-plate ul.list li a:hover .more {
    background: url("../img/sprites.png") -890px -120px no-repeat;
    color: #FFFFFF;
}
.sub-page .school-plate ul.list li a:hover .more {
    background: url("../img/sprites.png") -790px -50px no-repeat;
    color: #FFFFFF;
}
.sub-page .leader-plate ul.list li a:hover .more {
    background: url("../img/sprites.png") -890px -50px no-repeat;
    color: #FFFFFF;
}
.sub-page .job-plate ul.list li a:hover .more {
    background: url("../img/sprites.png") -790px -85px no-repeat;
    color: #FFFFFF;
}  