@charset "UTF-8";

.header-index .container{ position: relative;}
.index_nav{ height: 70px; background-color: #EAEBEC;}
.index_nav.active{ top: 64px; left: 0; right: 0; z-index: 9; box-shadow: 4px 1px 31px 0 rgba(74,74,74,0.50);
  position:fixed!important;/* FF IE7*/
  position:absolute;/*IE6*/
  _top:expression(eval(document.compatMode &&
  document.compatMode=='CSS1Compat') ?
  documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/
  document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/
}
.index_title_nav.active{ margin-top: 70px;}
.index_nav .container{ position: relative;}
.index_nav ul{ width: 1200px; padding: 24px 0 21px; margin: 0 auto;}
.index_nav ul li{ float: left; font-size: 16px; line-height: 22px; height: 22px; color: #14147F; width: 70px; margin-right: 300px; text-align: center; white-space: nowrap; overflow: visible; cursor: pointer;}
.index_nav ul li:last-child{ margin-right: 0;}
.index_nav ul li:hover,.index_nav ul li.active{ color: #FB7E2A;}
.index_nav em{ width: 70px; height: 5px; background-color: #FB7E2A; display: block; position: absolute; bottom: -3px; left: 0;}
/* 主体板块 */
.index_title{ min-width: 1200px;  text-align: center; background-color: #fff;}
.index_title h2{ color: #171717; font-size: 26px; font-weight: 500; line-height: 37px; padding-top: 50px; padding-bottom: 10px;}
.index_title h3{ font-size: 20px; font-weight: normal; line-height: 28px; padding-bottom: 50px;}
.section{ min-width: 1200px; text-align: center;}
.section .container{ width: 1200px; margin: 0 auto;}
/* page1 */
.stage1{ padding: 0;}
.banner{ width:100%; clear:both; position: relative;}
.banner ul{ margin:0px; padding:0px; list-style:none; width:100%; height: 600px; position: relative;}
.banner ul li{ position:absolute; left:0; top:0; width:100%; min-width: 1200px; height:100%; display:none; background-color: #3D6FEA; background-position: center; background-repeat: no-repeat; overflow: hidden;}
.banner ul li:first-child{ display: block;}
.banner .btn{ width:1200px; min-width: 1200px; height: 5px; bottom: 26px; position:absolute; z-index: 2; left:50%; margin-left:-600px; text-align: center; font-size: 0; line-height: 0;}
.banner .btn span{ display: inline-block; *display: inline; *zoom: 1; width:40px; height:5px; margin: 0 5px; z-index: 3; cursor:pointer; background-color: #fff;}
.banner .btn span.active{ background-color: #213C80; filter:alpha(opacity=100); -moz-opacity:1; opacity:1;}

/* page2 */
.stage2{ background-color: #EAEBEC; padding: 37px 0 11px; text-align: center;}
.stage2 ul{ font-size: 0; line-height: 0; text-align: center;}
.stage2 li{ transition: transform .5s ease; display: inline-block; width: 280px; height: 230px; margin-right: 26px; margin-bottom: 26px; text-align: center; background-color: #fff; box-shadow: 0 5px 20px 0 rgba(210,208,208,0.52); border-radius: 4px; overflow: hidden; cursor: pointer;}
.stage2 li:nth-child(4n){ margin-right: 0;}
.stage2 li:hover{ transform: scale(1.15);}
.stage2 li h4{ font-size: 18px; font-weight: 500; color: #14147F; line-height: 25px; padding-top: 25px;}
.stage2 li p{ font-size: 14px; line-height: 25px; padding-top: 8px;}
.stage2.app_wrap li em{ transform: scale(1); margin: 22px auto 0;}
.stage2.app_wrap li.ico_xsqw em{ margin-top: -13px;}
.stage2.app_wrap li.ico_ifass em{  margin-top: -3px;}
.stage2.app_wrap li.ico_ilearning em{ margin-top: -3px}
.stage2.app_wrap li.ico_ijob em{ margin-top: -28px;}

/* page3 */
.stage3{ background-color: #E3EAFF; font-weight: 200;}
.stage3 ul{ padding-top: 0;}
.stage3 ul li{ transition: opacity .5s ease; float: left; width: 400px; height: 560px; background-image: url(../images/www/stages.jpg?v=2.0); position: relative; text-align: center; background-repeat: no-repeat; overflow: hidden;}
.stage3 ul li i{ position: absolute; z-index: 1; transition: opacity .5s ease; opacity: 0; top: 0; right: 0; bottom: 0; left: 0; background-image: url(../images/www/stages.jpg?v=2.0);}
.stage3 ul li em{ position: relative; z-index: 2; transition: margin-top .5s ease,transform .5s ease; -webkit-transform-origin: 50% 0%; margin-top: 160px; transform: scale(1); margin-left: 125px; display: block; width: 150px; height: 150px; background-image: url(../images/www/index1.png?v=2.0); background-repeat: no-repeat;}
.stage3 ul li h4{ position: relative; z-index: 2; transition: opacity .5s ease; opacity: 1; margin-top: 50px; font-size: 18px; color: #fff; line-height: 20px;}
.stage3 ul li p{ position: relative; z-index: 2; transition: display .5s ease; display: block; margin-top: 20px; font-size: 14px; color: #fff; line-height: 20px;}
.stage3 ul li .box{ position: relative; z-index: 2; transition: opacity .5s ease; opacity: 0; margin: 20px auto 0; display: block; width: 339px; padding: 8px 12px 18px; background: url(../images/www/index1.png?v=2.0) -2261px -806px no-repeat; text-align: left;}
.stage3 ul li .box span{ display: block; padding-top: 10px; font-size: 14px; color: #fff; line-height: 20px;}
.stage3 ul li:hover i{ opacity: 1;}
.stage3 ul li:hover em{ margin-top: 122px; transform: scale(.86);}
.stage3 ul li:hover p{ display: none;}
.stage3 ul li:hover .box{ opacity: 1;}
.stage3 ul li.stage_01{ background-position: 0 0;}
.stage3 ul li.stage_02{ background-position: -400px 0;}
.stage3 ul li.stage_03{ background-position: -800px 0;}
.stage3 ul li.stage_01 i{ background-position: -1200px 0;}
.stage3 ul li.stage_02 i{ background-position: -1600px 0;}
.stage3 ul li.stage_03 i{ background-position: -2000px 0;}
.stage3 ul li.stage_01 em{ background-position: -68px -28px;}
.stage3 ul li.stage_02 em{ background-position: -445px -28px;}
.stage3 ul li.stage_03 em{ background-position: -846px -28px;}
/* page4 */
.stage4{ background-color: #EAEBEC; padding-top: 74px; padding-bottom: 58px;}
.stage4_box{ position: relative; z-index: 2; padding-top: 38px; width: 1199px; background: url(../images/www/index1.png?v=2.0) -83px -1331px no-repeat;}
.stage4_box>em{ position: absolute; z-index: 1; bottom: -58px; left: 0; width: 744px; height: 58px; background: url(../images/www/index1.png?v=2.0) -1259px -1120px no-repeat;}
.stage4 .con{ float: left; margin-left: 2px; width: 744px; height: 451px; border-radius: 4px 0 0 4px;}
.stage4 .tab{ width: 451px; margin-left: 746px;}
.stage4 .tab li{ width: 451px; height: 100px; margin-bottom: 17px; position: relative;}
.stage4 .tab li:last-child{ margin-bottom: 0;}
.stage4 .tab li>em{ position: absolute; z-index: 1; top: -10px; left: 0; display: block; width: 481px; height: 179px; background: url(../images/www/index1.png?v=2.0) -50px -747px no-repeat;}
.stage4 .tab li.active>em{ background-position: -635px -747px;}
.stage4 .tab li .box{ transition: background-color .5s ease; cursor: pointer; width: 417px; margin-left: 34px; height: 100px; background-color: #EAEBEC; border-radius: 4px; position: relative; z-index: 2;}
.stage4 .tab li.active .box{ width: 451px; margin-left: 0; background-color: #fff; border-radius: 0 4px 4px 0;}
.stage4 .tab li .box em{ float: left; display: block; z-index: 3; width: 109px; height: 100px; background: url(../images/www/index1.png?v=2.0) -665px -979px no-repeat;}
.stage4 .tab li:nth-child(2n) .box em{ background-position: -373px -979px;}
.stage4 .tab li.active .box em{ float: right; background: url(../images/www/index1.png?v=2.0) -79px -979px no-repeat;}
.stage4 .tab li .box em i{ display: block; width: 65px; height: 65px; margin-top: 17px; margin-left: 11px; background-image: url(../images/www/index1.png?v=2.0);}
.stage4 .tab li.active .box em i{ width: 70px; height: 70px; margin-top: 15px; margin-left: 22px;}
.stage4 .tab li.data1 .box em i{ background-position: -554px -1174px;}
.stage4 .tab li.data2 .box em i{ background-position: -662px -1174px;}
.stage4 .tab li.data3 .box em i{ background-position: -771px -1174px;}
.stage4 .tab li.data4 .box em i{ background-position: -878px -1174px;}
.stage4 .tab li.active.data1 .box em i{ background-position: -83px -1171px;}
.stage4 .tab li.active.data2 .box em i{ background-position: -192px -1171px;}
.stage4 .tab li.active.data3 .box em i{ background-position: -302px -1171px;}
.stage4 .tab li.active.data4 .box em i{ background-position: -411px -1171px;}
.stage4 .tab li .box h4{ transition: top .2s ease,left .2s ease,color .2s ease; position: absolute; z-index: 3; top: 35px; left: 195px; font-size: 20px; line-height: 37px; letter-spacing: 4px;}
.stage4 .tab li.active .box h4{ top: 10px; left: 122px; font-size: 20px; color: #1C98E0;}
.stage4 .tab li .box p{ transition: top .2s ease,opacity .2s ease; opacity: 0; width: 321px; position: absolute; z-index: 3; top: 67px; left: 20px; font-size: 14px; line-height: 21px; text-align: left;}
.stage4 .tab li.active .box p{ top: 50px; opacity: 1;}
.stage4 .con{ background-color: #fcfdfd; overflow: hidden; width: 744px; height: 451px;}
.stage4 .con li{ display: none; width: 744px; height: 451px; background-image: url(../images/www/index1.png?v=2.0);}
.stage4 .con li.active{ display: block;}
.stage4 .con li.data1{ background-position: -69px -240px;}
.stage4 .con li.data2{ background-position: -868px -240px;}
.stage4 .con li.data3{ background-position: -1667px -240px;}
.stage4 .con li.data4{ background-position: -2466px -240px;}

/* page5 */
.stage5{ background-color: #fff; padding-bottom: 0;}
.stage5 .school{ width: 1100px; margin: 0 auto; padding-bottom: 25px;}
.stage5 .school li{ float: left; width: 100px; text-align: center;}
.stage5 .school li img{ width: 66px; height: 66px; border: 2px solid #fff; border-radius: 50%;}

/* page6 */
.stage6{ background-color: #4a4a4a; color: #fff; text-align: left; padding-top: 25px; font-weight: 200;}
.stage6 h4{ font-size: 16px; line-height: 22px; padding-bottom: 6px;}
.stage6 .stage6_top .about{ float: left; width: 420px;}
.stage6 .stage6_top .about h5{ font-size: 14px; font-weight: normal; line-height: 20px; padding-top: 18px; padding-bottom: 18px; font-family: tahoma,arial,'Hiragino Sans GB','宋体',sans-serif;}
.stage6 .stage6_top .about .service{ border-top: 1px solid #5f5f5f; padding: 25px 0 0;}
.stage6 .stage6_top .about .service_left{ float: left; width: 280px;}
.stage6 .stage6_top .about .service_left p{ font-size: 18px; line-height: 38px; padding-left: 52px; position: relative;}
.stage6 .stage6_top .about .service_left p em{ display: block; width: 38px; height: 38px; position: absolute; top: 0; left: 0; background: url(../images/www/index1.png?v=2.0) no-repeat;}
.stage6 .stage6_top .about .service_left p.tel{ margin-bottom: 25px;}
.stage6 .stage6_top .about .service_left p.tel em{ background-position: -2404px -1082px;}
.stage6 .stage6_top .about .service_left p.email em{ background-position: -2324px -1082px;}
.stage6 .stage6_top .about h6{ padding-top: 25px; font-size: 14px;}
.stage6 .stage6_top .about h6 span{ color: #E8F1F2; display: block; padding-top: 7px; font-weight: 200;}
.stage6 .stage6_top .about .service_right{ float: right; width: 115px; text-align: center;}
.stage6 .stage6_top .about .service_right img{ width: 115px;  height: 115px;}
.stage6 .stage6_top .about .service_right p{ font-size: 14px; line-height: 20px; padding-top: 12px; white-space: nowrap;}
.stage6 .stage6_top .pro{ float: left; width: 300px; margin-left: 100px;}
.stage6 .stage6_top .pro h4{ padding-bottom: 0;}
.stage6 .stage6_top .pro h5{ margin-top: 15px; margin-bottom: 10px; width: 108px; height: 24px; line-height: 24px; background-color: #1C98E0; font-size: 16px; text-align: center; border-radius: 5px;}
.stage6 .stage6_top .pro li{ padding-bottom: 16px;}
.stage6 .stage6_top .pro li:last-child{ padding-bottom: 0;}
.stage6 .stage6_top .pro li a{ color: #fff; cursor: pointer;}
.stage6 .stage6_top .pro li.disabled a{ cursor: default;}
.stage6 .stage6_top .pro li.disabled a:hover{ text-decoration: none;}
.stage6 .stage6_top .app{ float: right; width: 300px;}
.stage6 .stage6_top .app .app_ma{ border-top: 1px solid #5f5f5f; padding-top: 9px;}
.stage6 .stage6_top .app .app_ma li{ float: left; width: 95px; margin-bottom: 15px;}
.stage6 .stage6_top .app .app_ma li:nth-child(2n-1){ margin-right: 110px;}
.stage6 .stage6_top .app .app_ma li img{ width: 95px; height: 95px;}
.stage6 .stage6_top .app .app_ma li p{ padding-bottom: 7px; white-space: nowrap;}
.stage6 .friendlink{ padding: 0 0 15px;}

.pg-canvas{ width: 100%; height: 100%; z-index: 1; position: absolute; top: 0; left: 0;}