@charset "utf-8";
/*1200+ 内容宽度：1190px  页面内容居中  匹配默认样式 */
.content{ width: 1200px; margin: 0 auto; position: relative; }

/*banner*/
.banner{ background: url(../images/banner.jpg) center top no-repeat; height: 280px; }
.banner img{ max-width: 100%; }
.banner .text{ display: block; margin: 0 auto; position: relative; top: 43px; left: 20px; }
.banner .text-btn{text-align: center; position: relative; top: 70px;}
.banner .text01{ margin-right: 20px; }
.banner .more{ }
.banner .light{ display: block; position: absolute; left:62px; top: 102px;  }
.banner .sun{ display: block; position: absolute; right:107px; top: 59px; }

/*大标题*/
.title{ height: 100px; line-height: 100px; background:url(../images/bg_title.jpg) left center repeat-x; font-size: 30px; color: #333333; text-align: center; }
.title .text{ background: #fff; display: inline-block; padding: 0 10px; position: relative; white-space:nowrap; }
.title span{ width:50px; height: 3px; position: absolute; top: 50%; margin-top: -2px; background: #33CBCC  }
.title span.left{ left:-50px;}
.title span.right{ right:-50px;}
/*模块样式*/
.module	{box-sizing: border-box; /*width: 50%;*/ width: 50%; float: left; padding:0 15px; margin-bottom:30px;}
.module .module-name { border-bottom: 1px solid #E4E4E4; position: relative; }
.module .module-name span{ font-size: 22px; color: #33cbcc; display: inline-block; border-bottom: 3px solid #33CBCC; position: relative;bottom: -1px; padding-bottom: 10px; }
.module .module-name span em{ /*color: #242424 */}
.module .more{ display: block; background:#B2BDC6; color: #fff; width: 50px; height: 20px; line-height: 20px; font-family: "Arial"; font-size: 14px; text-align: center; border-radius: 4px; position: absolute;right: 0; top: 50%; margin-top: -10px; }
.module .more:hover{ background: #FFAE00; }

/*文章列表*/
.article-list{box-sizing: border-box; padding: 10px 0 0 0;}
.article-list li{ display: block; box-sizing: border-box; padding: 0 0 15px 230px; position: relative;height:140px; border-bottom: 1px dashed #DEDEDE; margin-bottom: 15px; }
.article-list img{ display: block; position: absolute; left: 0; top: 0; width:220px; height: 135px;  }
.article-list .article-info{}
.article-list .article-info .article-title{ display: block; font-size: 16px; color: #3f3f3f; line-height: 1.8; /*white-space: nowrap; text-overflow: ellipsis; overflow: hidden;*/ margin-bottom:10px;  }
.article-list li:hover .article-info .article-title{color: #ff6501; }
.article-list .article-info p{ font-size: 14px; color: #888888; line-height: 24px;   text-overflow: ellipsis; overflow: hidden; height:48px; }

/*文章列表*/
.list{box-sizing: border-box; }
.list li{ display: block; box-sizing: border-box;  position: relative; border-bottom: 1px dashed #DEDEDE; margin-bottom: 15px; padding-bottom: 15px; }
.list img{ display: block; float: left; width: 244px; height: 162px; margin: 0;  }
.list .list-info{ float: right; width:650px; }
.list .list-info .list-title{display: block; font-size: 20px; color: #3f3f3f; line-height: 2;/* white-space: nowrap; text-overflow: ellipsis; overflow: hidden; */}
.list li:hover .list-info .list-title{color: #ff6501; }
.list .list-info p{ font-size: 16px; color: #888888; line-height: 30px; text-indent: 0; height:90px; overflow: hidden;  }

/*培训项目封面*/
.training-item{ padding-top: 50px; }
.training-item h1{font-size: 32px; font-family: "宋体"; font-weight: bold; text-align: center; line-height: 1.5; color: #0096e8;}
.training-item p{ font-size: 16px; color: #636363; line-height: 1.8 }
.training-item a.more{ display: block; width:136px; height: 41px; background: url(../images/more.jpg) no-repeat;  }
.item1 img{float: right;}
.item1 h1{padding-top: 20px;}
.item1 .info{ float: left; width: 60%; position: relative; box-sizing: border-box; padding: 20px 20px 50px 20px;}
.item1 .lt{ display: block; width: 44px; height: 44px; background: url(../images/lt.png) no-repeat; position: absolute;left: 0; top: 0; }
.item1 .rb{ display: block; width: 44px; height: 44px; background: url(../images/rb.png) no-repeat; position: absolute; right: 0; bottom: 30px;}
.item1 p{ font-size: 18px; width: 94%; margin: 20px auto 30px auto }
.item1 a.more{position: absolute; left: 40px; bottom: 0;}
.item2 img{float: left;}
.item2 .info{ float: right; box-sizing: border-box; padding:50px 0 0 80px; width: 60%;}
.item2 .item{ background:url(../images/item.jpg) left top no-repeat; padding:0 50px 30px 90px;  }
.item2 .course{ background: url(../images/course.jpg) left top no-repeat;padding:0 50px 0 90px; }
.item2 .title{ background: none; text-align: left; font-size: 22px; color: #404040; height:50px; line-height: 50px;  }
.item2 p{ margin-bottom: 20px; }
.item2{ padding-bottom: 50px; }

.big-title{text-align: center; font-size:30px; color: #333333; line-height: 50px; padding-bottom: 20px; }
.item-list{ width: 96%; margin: 0 auto; }
.item-list li{ display: block; box-sizing: border-box; width: 33.3333%; height: 280px; float: left; margin-bottom:40px; overflow:hidden;}
.item-list li a{ width: 260px; padding: 10px; height: 280px; margin: 0 auto; border: 1px solid #fff; display: block; box-sizing: border-box;  }
.item-list li img{ margin:0 auto ; width:240px; height: 160px; }
.item-list .list-info .list-title{ font-size: 16px; line-height: 26px; overflow:hidden; display:block; }
.item-list .list-info p{ font-size: 14px; text-indent: 0; color: #30343c; min-height:56px; overflow:hidden; }
.item-list li:hover a{border: 1px solid #E4E4E4}
/*1023-1200 内容宽度990 页面内容居中 */
@media only screen and (max-width:1200px) {
	.content{ width: 990px; }
	.banner .text{ width: 600px; }
	.right-content{ width: 710px; }
	.list .list-info{ width: 440px; }
	.item-list .list-info p{  height: auto; overflow: auto; }
	.item1 img{ width: 360px; }
	.item2 img{ width: 360px; }
	.item-list{ width: 100%; }
	.item-list li{ }
	.item-list li a{width: 100%; padding: 5px;  }
}

/*768-1024  内容宽度740  两边间距14 页面内容居中 */
@media only screen and (max-width:1023px) {
	.content{ width: 740px; }
	.banner .light{ display: none; }
	.banner .sun{ display: none; }
	.item1 img{ float: none; display: block; margin: 0 auto; width: auto; max-width: 90%; }
	.item1 .info{ width: 100%; float: none; }
	.item2 img{ float: none; display: block; margin: 0 auto; width: auto; max-width: 90%; }
	.item2 .info{ width: 100%; float: none; padding: 20px 0; }
	.article-list li{ overflow:hidden;  }
	
	
}

/*ipad竖屏：(orientation:portrait)  ipad横屏：(orientation:landscape) */
@media only screen and (width:768px) and (orientation:portrait) { }

/*640-767 内容宽度590 两边间距25 页面内容居中 */
@media only screen and (max-width:767px) {
	.content{width: 590px;}
	.banner{ height: 250px; }
	.banner img{ display: block; max-width: 100%; margin: 0 auto;}
	.banner .text{ width: 80%; position: relative; top: 20px; left: 0;  }
	.banner .text-btn{ position: relative; top: 30px; left: 0; }
	.banner .text01{ margin: 0 auto 10px auto; }
	.module{ width: 100%; float: none; }
	.right-content{ width: 100%; }
	.list .list-info{ width: 330px; }
	.item-list li{ width: 50%; height:auto; overflow: visible; }
	.item-list li img{ display: block; max-width: 100%; margin: 0 auto 10px; }
	.item-list li a{width: 100%; height: 290px;}
	
	.item2 .item{  padding:0 20px 30px 90px;  }
	.item2 .course{ padding:0 20px 0 90px; }
	
	.article-list li{ height:auto; min-height:110px; }
	.article-list .article-info p{ overflow: visible; height: auto; }
}

/* 480-639  按百分比缩放 */
@media only screen and (max-width:639px) {
	.content{ width: 96%; }
	.banner{ height: 200px; }
	.banner .more{ width: 120px; }
	.banner .text01{width: 280px;}
	.list img{ float: none; margin: 0 auto; display: block; max-width: 100%; height: auto; }
	.list .list-info{ float: none; width: 100%; }
	.item-list li{ width: 100%; float: none; margin-bottom:20px; }
	.item-list li a{height: auto;}
	.item-list .list-info .list-title{ height: auto; overflow: auto; }
	.list .list-info p{  height: auto; overflow: visible;  }
}
/* 360-479  按百分比缩放 */
@media only screen and (max-width:479px) {}
/* 320-359  按百分比缩放 */
@media only screen and (max-width:360px) {
	.article-list li{ padding: 0 0 15px 0 }
	.article-list img{ position: static; width: 90%; margin: 0 auto; height: auto; }
}
.zoomIn{ animation:zoomIn 1s ease-out}
.rotate{ animation:rotate 8s linear infinite}
.jump{ animation:jump 5s ease-out infinite}
@-webkit-keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }

}

@keyframes zoomIn {
   0% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }

}

@keyframes rotate {
   0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-webkit-keyframes jump {
	0% {
	  
	    -webkit-transform: none;
	    transform: none;
	}
	50% {
	   
	    -webkit-transform: translate3d(0, -20%, 0);
	    transform: translate3d(0, -20%, 0);
	}

	100% {
	    
	    -webkit-transform: none;
	    transform: none;
	}

}

@keyframes jump {
   0% {
	  
	    -webkit-transform: none;
	    transform: none;
	}
	50% {
	   
	    -webkit-transform: translate3d(0, -20%, 0);
	    transform: translate3d(0, -20%, 0);
	}

	  
	100% {
	    
	    -webkit-transform: none;
	    transform: none;
	}
}