@charset "utf-8";
/* CSS Document */

.sub{ height:auto}
.sub-loca{ margin-top:20px; padding:16px 0; font-size:16px; color:#333; border-top:1px solid #eeeff2; border-bottom:1px solid #eeeff2}
.sub-loca a{ color:#333}
.sub-loca span{ padding:0 10px; color:#e7e7e7}

.sub-con{ width:1200px; margin:0 auto; padding-bottom:58px; overflow:hidden}
.sub-left{ width:884px; overflow:hidden; float:left}

/**** 右侧课程 ****/
.sub-r-course{ width:286px; margin-top:28px; border:1px solid #e7e7e7; float:right}
.sub-r-course h3{ height:48px; padding:0 10px; line-height:48px; border-bottom:1px solid #e7e7e7}
.sub-r-course h3 a{ height:44px; padding:0 10px; border-bottom:4px solid #00c9de; font-size:20px; color:#333; display:inline-block}
.sub-r-course .tempWrap{ padding:20px; padding-bottom:0}
.sub-r-course .bd li{ height:216px}
.sub-r-course .bd img{ width:100%}
.sub-r-course .bd a{ display:inline-block}
.sub-r-course .course-txt{ padding-top:8px; font-size:12px; font-weight:bolder; color:#333;text-align: center;}

/**** 翻页 ****/
.page-num{ padding-top:30px; text-align:center; line-height:38px; float:left}
.page-num li{
	float: left;
}
.page-num .thisclass{ display:inline-block; min-width:38px; height:38px; margin:0 3px; background:#00c9de; border:1px solid #00c9de; color:#fff}
.page-num .btn{ display:inline-block; margin:0 3px; border:1px solid #eee; padding:0 10px; color:#a7a7a7}
.page-num a{ display:inline-block; min-width:38px; height:38px; margin:0 3px; border:1px solid #eee; color:#666 !important}
.page-num a:hover{ background:#00c9de; border:1px solid #00c9de; color:#fff !important}

/**** 干货分享 ****/
.sub-l-news{ overflow:hidden}
.sub-l-news li{ padding:22px 0; border-bottom:1px solid #e7e7e7; float:left}
.sub-l-news .news-time{ width:92px; height:84px; padding-top:8px; background:#00c9de; color:#fff; font-size:18px; text-align:center; float:left}
.sub-l-news .news-time i{ width:100%; display:inline-block; font-size:30px}
.sub-l-news .news-tit,.sub-l-news .news-word{ width:772px; float:right}
.sub-l-news .news-tit{ padding-top:3px}
.sub-l-news .news-tit a{ font-size:16px; font-weight:bolder; color:#333}
.sub-l-news .news-word{ padding-top:7px; font-size:16px; line-height:30px; color:#999}
.sub-l-news .news-word a{ color:#ff6600}

/**** 讲师风采 ****/
.sub-l-teacher{ overflow:hidden}
.sub-l-teacher li{ padding:20px 0; border-bottom:1px solid #e7e7e7; overflow:hidden}
/**/
.sub-l-teacher .teacher-pic{ width:240px; height:288px; overflow:hidden; float:left}
.sub-l-teacher .teacher-pic img{ height:100%}
/**/
.sub-l-teacher .teacher-txt{ width:614px; padding-top:20px; font-size:16px; float:right}
.sub-l-teacher .txt-name{ width:112px; height:34px; line-height:34px; text-align:center; background:#040307; font-weight:bolder; color:#fff; -webkit-border-radius:9999px; border-radius:9999px}
.sub-l-teacher .txt-remark{ padding-left:10px; padding-top:16px; color:#00c9de; display:inline-block}
.sub-l-teacher .txt-word{ padding:7px 0 30px 10px; color:#666; line-height:30px}
.sub-l-teacher .txt-btn{ width:150px; height:44px; margin:0 17px; line-height:44px; text-align:center; background:#fff; color:#00c9de; border:1px solid #00c9de; float:right; -webkit-border-radius:9999px; border-radius:9999px}
.sub-l-teacher .txt-btn i{ width:30px; height:44px; margin-right:10px; background:url(../images/iconTeacher.png) no-repeat center center; display:inline-block; vertical-align:top}

/**** 课程介绍 ****/
.sub-l-course{ width:1200px; position:relative; margin:0 auto; padding:30px 0 58px; overflow:hidden}
.sub-l-course ul{ overflow:hidden; padding-top:20px}
.sub-l-course ul li{ width:284px; margin:0 8px; float:left}
.sub-l-course ul li a{ width:282px; height:256px; margin-bottom:20px; color:#333; border:1px solid #eeeff2; display:inline-block; position:relative; overflow:hidden; -webkit-border-radius:2px; border-radius:2px; -webkit-transition:all ease-in-out .3s; transition:all ease-in-out .3s}
.sub-l-course ul li a:hover{ border:1px solid #00c9de; margin-top:-10px; margin-bottom:30px; color:#fff; box-shadow:0 4px 4px rgba(0,0,0,.1); background:-webkit-linear-gradient(left,#00d39b,#00c9de); background:-o-linear-gradient(right,#00d39b,#00c9de); background:-moz-linear-gradient(right,#00d39b,#00c9de); background:linear-gradient(to right,#00d39b,#00c9de)}
/**/
.sub-l-course .course-pic{ width:278px; height:184px; overflow:hidden; margin:0 auto; border:2px solid rgba(255,255,255,0)}
.sub-l-course .course-pic img{ width:100%}
.sub-l-course .course-txt{ padding:20px 16px; font-size:16px; font-weight:bolder}

/**** 课程视频 ****/
.sub-l-video{ width:896px}
.sub-l-video li{ width:428px; height:320px; margin-right:20px; padding-top:20px; float:left}
.sub-l-video li a{ width:426px; height:318px; display:inline-block; border:1px solid #e7e7e7; position:relative; background:#fff; color:#535353; -webkit-transition:all ease-in-out .4s; transition:all ease-in-out .4s}
.sub-l-video li a:hover{ margin-top:-10px; background:#040307; color:#fff; border-color:#040307; box-shadow:0 4px 4px rgba(0,0,0,.2)}
.sub-l-video .video-pic{ padding:12px; overflow:hidden}
.sub-l-video .video-pic img{ width:100%}
.sub-l-video .video-txt{ padding:0 12px; font-size:18px; font-weight:bolder}
.sub-l-video .video-icon{ width:60px; height:60px; display:inline-block; background:url(../images/iconVideo.png) no-repeat center center; position:absolute; left:183px; top:90px}

/**** 联系我们 ****/
.sub-contact{ width:1200px; min-height:540px; margin:0 auto; padding:20px 0 70px}
.sub-contact .contact-word{ width:294px; height:430px; padding:110px 0 0 50px; color:#fff; float:left}
.sub-contact .contact-word h4{ padding-bottom:10px; font-size:48px; font-weight:bolder}
.sub-contact .contact-word p{ height:38px}
.sub-contact .contact-word img{ margin-right:10px; vertical-align:middle}
.sub-contact .contact-map{ width:856px; padding-top:140px; float:right}
.sub-contact .contact-word{ background:-webkit-linear-gradient(bottom,#00d39b,#00c9de); background:-o-linear-gradient(top,#00d39b,#00c9de); background:-moz-linear-gradient(top,#00d39b,#00c9de); background:linear-gradient(to top,#00d39b,#00c9de); filter:alpha(opacity=100 finishopacity=100 style=1 startx=0,starty=0,finishx=0,finishy=0) progid:DXImageTransform.Microsoft.gradient(startcolorstr=#00d39b,endcolorstr=#00c9de,gradientType=1); -ms-filter:alpha(opacity=100 finishopacity=100 style=1 startx=0,starty=0,finishx=0,finishy=0) progid:DXImageTransform.Microsoft.gradient(startcolorstr=red,endcolorstr=blue,gradientType=1)}

/**** 详情页 ****/
.sub-l-details{ width:886px; margin-top:28px; border:1px solid #e7e7e7; float:left}
.details-tit{ padding:10px 30px; border-bottom:1px solid #e7e7e7; overflow:hidden}
.details-tit h2{ padding:25px 0 15px; font-size:24px; color:#333; text-align:center}
.details-tit p{ color:#999}
.details-tit p span{ float:right}
.details-tit p .look{ background:url(../images/look.png) no-repeat left center; margin-left:10px; padding-left:18px}
/**/
.details-con{ padding:30px; font-size:16px; line-height:30px; color:#666; text-align:justify}
.details-con img{ max-width:100%}
/**/
.details-foot{ padding:24px; border-top:1px solid #e7e7e7; position:relative; overflow:hidden}
.details-f-code{ width:100px; height:100px; float:left}
.details-f-collect{ height:20px; margin:10px 0 0 25px; padding-left:30px; color:#666; background:url(../images/iconCollect.png) no-repeat left center; display:inline-block}
.details-f-link{ margin-left:125px; padding-top:10px}
.details-f-link p{ padding:3px 0}
.details-f-link a{ color:#666}
.details-f-share{ width:180px; height:60px; position:absolute; right:0; top:40px}