@charset "gb2312";
/* CSS Document */
/*什么是H5*/
.pdt5{padding-top:5px;}
.pdt10{padding-top:10px;}
.pdt15{padding-top:15px;}
.pdt20{padding-top:20px;}
.pdt25{padding-top:25px;}
.pdt30{padding-top:30px;}
.pdt40{padding-top:40px;}
.pdt45{padding-top:45px;}
.pdt50{padding-top:50px;}
.pdt55{padding-top:55px;}
.pdt60{padding-top:60px;}
.pdt65{padding-top:65px;}
.pdt70{padding-top:70px;}
.pdt80{padding-top:80px;}
.pdt90{padding-top:90px;}
.pdt100{padding-top:100px;}
em{ display:block;}
.fz24{ font-size:24px;}
.fz26{ font-size:26px;}
.fz28{ font-size:28px;}
/*banner*/
.H5_banner{width:100%;height:330px;background:url(../images/h5_banner.jpg) center no-repeat;min-width:1200px;margin:0 auto; position:relative; margin-top: 12px;}
.H5_banner01{width:208px;height:38px;line-height:38px;border:1px #e99190 solid;border-radius:2px;margin-left:55px;}
.H5_banner02{ font-size:34px;margin-left:55px; text-align:left;}
.H5_banner03{ color:#ffd74b;margin-left:55px; text-align:left;}
.H5_banner04{width:198px;height:46px; line-height:46px;margin-top:20px;margin-left:55px;background:#fff;border-radius:25px; position:relative;}
.H5_banner04 p{ font-size:16px;color:#e47671; font-weight:bold; text-align:left;padding-left:50px;}
.H5_banner04 img{ position:absolute;top:12px;right:40px;}
/*Web4.0时代，重新定义HTML5*/
.h5_redefine{width:100%;height:674px;background:#f5f8fa;min-width:1200px;margin:0 auto; position:relative;}
.h5_redefine_main{width:100%;margin:0 auto;}
.h5_redefine_main ul{width:96%;margin:0 auto;}
.h5_redefine_main ul li{float:left;width:512px;height:335px;margin:0px 30px;margin-top:70px;}
.h5_redefine_main ul li p{ line-height:98px;}
.h5_redefine_main ul li span{ display:block;width:348px; line-height:24px; text-align:left;margin-top:45px;margin-left:70px;}
/*8大特性，赋予HTML5强大的生命力*/
.h5_vitality{width:100%;height:702px;background:#fff;min-width:1200px;margin:0 auto; position:relative;}
.h5_vitality_main{width:100%;margin:0 auto;}
.h5_vitality_main ul{width:100%;margin:0 auto;margin-top:70px;}
.h5_vitality_main ul li{float:left;width:275px;height:202px;border:1px #e8e8e8 solid;border-right:none;border-bottom:none; position:relative;}
.h5_vitality_main ul li em{width:26px;height:3px;background:#fd5f56;margin:0 auto;margin-top:15px;}
.h5_vitality_main ul li span{ display:block;}
.h5_vitality_main_hover{width:100%;height:202px;margin:0 auto; position:absolute;top:0px;left:0px;background:#ff6960;}
/*4大优势，让HTML5成为互联网领域的主宰者*/
.h5_masters{width:100%;height:512px;background:url(../images/h5_masters_bei.jpg) center no-repeat;min-width:1200px;margin:0 auto; position:relative;}
.h5_masters_main{width:100%;margin:0 auto; position:relative;}
.h5_masters_main ul{width:100%;margin:0 auto;margin-top:50px; position:absolute;top:10px; z-index:9;}
.h5_masters_main ul li{float:left;width:284px;height:407px;margin:0px 8px;background:#fff;border-radius:2px; transition:.4s; -webkit-transition:.4s;}
.h5_masters_main ul li span{ display:block;height:280px;padding:0px 32px;padding-top:50px;text-align:left;}
.h5_masters_main ul li p{width:100%;height:78px;line-height:78px;background:#ff6960;border-radius:0px 0px 2px 2px;}
.h5_masters_main ul li:hover{margin-top:-10px;transition:.4s; -webkit-transition:.4s;}
.h5_masters_main ul li:hover p{background:#383838;}
/*多设备跨平台，成为HTML5打败其他同类语言的制胜法宝*/
.h5_weapon{width:100%;height:603px;background:#f5f8fa;min-width:1200px;margin:0 auto; position:relative;}
.h5_weapon_main{width:100%;margin:0 auto;margin-top:90px; position:relative; z-index:10;}
.h5_weapon_left{width:493px;height:332px;background:url(../images/h5_weapon_main_img01.png) center no-repeat;margin-left:92px;}
.h5_weapon_left ul{width:100%;margin:0 auto; margin-top:155px;}
.h5_weapon_left ul li{ font-size:14px;color:#fff; text-align:left; line-height:30px;margin-left:50px;}
.h5_weapon_right{width:493px;height:317px;background:url(../images/h5_weapon_main_img.png) center no-repeat;margin-top:40px;margin-right:92px;}
.h5_weapon_right ul{width:100%;margin:0 auto; margin-top:155px;}
.h5_weapon_right ul li{ font-size:14px;color:#fff; text-align:left; line-height:30px;margin-left:50px;}
/*生活中处处充满着HTML5的身影，它时时刻刻在我们身边*/
.h5_side{width:100%;height:652px;background:#fff;min-width:1200px;margin:0 auto; position:relative;}
.h5_side_main{width:100%;margin:0 auto;}
.h5_side_main ul{width:100%;margin:0 auto;margin-top:60px;}
.h5_side_main ul li{float:left;width:139px;height:130px; position:relative;margin:0px 30px;}
.h5_side_main ul li img{width:100%;}
.h5_side_main ul li p{width:100%;margin-top:25px;}
.h5_side_main_hover{width:100%; position:absolute;top:0px;}
/*大势所趋，来华清远见一键学懂HTML5*/
.h5_understand{width:100%;height:884px;background:#383838;min-width:1200px;margin:0 auto; position:relative;}
.h5_understand_main{width:100%;margin:0 auto;}
.h5_understand_main ul{width:95%;margin:0 auto;margin-top:34px;}
.h5_understand_main ul li{float:left;width:542px;height:137px;background:#4c4c4c;border-radius:5px;margin:0px 12px;margin-top:23px;transition:.4s; -webkit-transition:.4s;}
.h5_understand_left{width:95px;height:137px;}
.h5_understand_left p{float:left; font-size:58px;color:#fff; font-weight:bold;padding-left:15px;padding-top:30px;}
.h5_understand_left em{float:right;width:1px;height:77px;background:#383838;margin-top:30px;}
.h5_understand_right{width:426px;height:137px;}
.h5_understand_right p{ text-align:left;margin-top:15px;}
.h5_understand_right span{ display:block; text-align:left; line-height:24px;margin-top:10px;padding-right:10px;}
.h5_understand_main ul li:hover{background:#ff6960;transition:.4s; -webkit-transition:.4s;}
.h5_understand_main ul li:hover em{background:#fff;}
.h5_understand_main ul li:hover span{color:#fff;}
.h5_understand_more{width:240px;height:60px;line-height:60px;margin:0 auto;margin-top:85px;}
.h5_understand_more p{background:#fff;border:1px #fff solid;border-radius:2px;transition:.4s; -webkit-transition:.4s;}
.h5_understand_more p:hover{background:none; color:#fff;transition:.4s; -webkit-transition:.4s;}
/*成为职场大咖，你就是互联网的未来*/
.h5_future{width:100%;height:766px;background:#f5f8fa;min-width:1200px;margin:0 auto; position:relative;}
.h5_future_main{width:100%;margin:0 auto;}
.h5_future_main ul{width:86%;margin:0 auto;margin-top:60px;}
.h5_future_main ul li{float:left;width:343px;}
.h5_future_main ul li em{width:218px;height:45px;line-height:45px;border:1px #ff6960 solid;border-radius:22.5px;margin:0 auto;margin-top:25px;color:#ff6960;}
.h5_future_main ul li span{ display:block; font-size:28px;color:#ff6960;padding-top:60px;}
.h5_understand_more1{width:240px;height:60px;line-height:60px;margin:0 auto;margin-top:48px;}
.h5_understand_more1 p{background:#fff;border:1px #fff solid;border-radius:2px;transition:.4s; -webkit-transition:.4s;}
.h5_understand_more1 p:hover{background:none;border:1px #999 solid; color:#333;transition:.4s; -webkit-transition:.4s;}
/*为什么从华清毕业能高薪？因为讲师牛，课程好！*/
.h5_Coursegood{width:100%;height:612px;background:#fff;min-width:1200px;margin:0 auto; position:relative;}
.h5_Coursegood_main{width:100%;margin:0 auto;}
.h5_Coursegood_main ul{width:100%;margin:0 auto;margin-top:60px;}
.h5_Coursegood_main ul li{float:left;width:380px;height:318px;border:1px #e9e9e9 solid;border-radius:2px;margin:0 9px;}
.h5_Coursegood_main ul li img{width:100%;height:215px;border-radius:2px 2px 0px 0px; }
.h5_Coursegood_main ul li .clrl{font-size:18px;color:#444; text-align:left;line-height:55px;padding-left:20px;}
.h5_Coursegood_main ul li .clrl_01{float:left; font-size:12px;color:#999999; text-align:left;margin-top:10px;padding-left:20px;}
.h5_Coursegood_main ul li .clrl_01 img{width:14px;height:9px;margin-right:5px;}
.h5_Coursegood_main ul li .clrl_02{float:left; font-size:12px;color:#999999; text-align:left;margin-top:10px;padding-left:20px;}
.h5_Coursegood_main ul li .clrl_02 img{width:12px;height:12px;margin-right:5px;}
.h5_Coursegood_main ul li:hover .clrl{color:#ff6960}

/*时间*/
.xxzy_data{width:100%;min-width:1200px; margin:0 auto;background:#f5f8fa; position:relative;}
.xxzy_data_1{width:100%;height:100px;border-bottom:1px #f1f1f1 solid; text-align:left;}
.xxzy_data_1 ul{padding:32px 0px;}
.xxzy_data_1 ul li{ float:left;margin:0px 26px;}
.xxzy_data_1 ul li img{float:left;margin-top:4px; margin-right:15px;}
.xxzy_data_1 ul li p{float:left;color:#999999; font-size:20px;font-weight:bold;}
.xxzy_data_1 ul li p span{float:left; display:block; font-size:14px; color:#999999;font-weight:normal;}

/*HTML5就业前景*/
/*banner*/
.h5qj_banner{width:100%;height:330px;background:url(../images/h5qj_banner.jpg) center no-repeat;min-width:1200px;margin:0 auto; position:relative;margin-top: 12px;}
/*红透半边天的HTML5为什么这么火？*/
.h5qj_why{width:100%;height:718px;min-width:1200px; margin:0 auto;background:#f5f8fa; position:relative;}
.h5qj_why_main{width:100%;margin:0 auto;}
.h5qj_why_main ul{width:100%;margin:0 auto;margin-top:60px;}
.h5qj_why_main ul li{float:left;width:380px;height:210px;border-radius:8px;margin:0px 10px;}
.h5qj_why_main ul li img{margin-top:20px;}
.h5qj_why_main01{width:1200px;height:166px;background:#fff;border-radius:5px;margin-top:60px;box-shadow: 0 5px 15px 1px rgba(0,0,0,0.05);}
.h5qj_why_main01 p{line-height:24px; text-align:left;padding:35px 54px}
/*先来一份推心置腹的HTML5发展趋势分析*/
.h5qj_Analysis{width:100%;height:869px;background:url(../images/h5qj_Analysis_bei.jpg) center no-repeat;min-width:1200px;margin:0 auto; position:relative;}
.h5qj_Analysis_main{width:100%;height:670px;margin:0 auto; background:url(../images/h5qj_Analysis_img.png)  center no-repeat; position:relative;}
.h5qj_Analysis_main ul{width:100%;margin:0 auto;}
.h5qj_Analysis_main ul li{width:230px;height:130px; position:absolute;}
.h5qj_Analysis_main_li02{width:520px;height:130px;background:url(../images/h5qj_Analysis_img011.png) center no-repeat; position:absolute;top:-18px; left:-15px;}
.h5qj_Analysis_main_li02 p{ text-align:left;padding-top:15px;padding-left:124px;padding-right:32px; line-height:24px;}
.h5qj_Analysis_more{width:260px;height:50px;line-height:50px;background:#f5f5f5;border:1px #cccccc solid;border-radius:3px;margin:0 auto; position:absolute;bottom:0px; left:0px;right:0px;transition:.4s; -webkit-transition:.4s;}
.h5qj_Analysis_more:hover{background:none;transition:.4s; -webkit-transition:.4s;}
/*职业发展报告：5年月薪可达30K以上*/
.h5qj_report{width:100%;height:563px;min-width:1200px; margin:0 auto;background:#f5f8fa; position:relative;}
.h5qj_report_main{width:100%;margin:0 auto;margin-top:60px;}
.h5qj_report_left{width:632px;height:295px;margin-left:118px;}
.h5qj_report_left img{width:100%;}
.h5qj_report_right{width:300px;height:290px;background:#ff6960;border-radius:8px;margin-right:118px;}
/*是什么让HTML5高薪成为必然？*/
.h5qj_necessarily{width:100%;height:596px;min-width:1200px; margin:0 auto;background:url(../images/h5qj_necessarily_bei.jpg) center no-repeat; position:relative;}
.h5qj_necessarily_main{width:100%;margin:0 auto;}
.cloud-product-ul{width:100%;margin:0 auto;margin-top:60px;}
.cloud-product-ul li{position:relative;margin-left:12px;width:200px;height:324px;float:left;background:#3e3e3e}
.normal-inner{transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s;-o-transition:all .5s;}
.active-inner{position:relative;display:none;height:100%;}
.cloud-product-ul li.active .active-inner{display:block;}
.cloud-product-ul li.active .normal-inner{display:none;}
.cloud-product-ul li{}
.cloud-product-ul li.active{z-index:9;width:400px;height:324px;border:1px #ff6960 solid;border-radius:8px;background:none;}
.h5qj_necessarily_01{width:100%;}
.h5qj_necessarily_01 em{width:26px;height:4px;border-radius:2px;background:#fff;margin:0 auto;margin-top:20px;}
.h5qj_necessarily_02{margin:35px;}
.h5qj_necessarily_02 p{ text-align:left;}
.h5qj_necessarily_02 em{width:26px;height:4px;background:#ff6960;border-radius:2px;margin-top:28px;margin-bottom:20px;}
.h5qj_necessarily_02 span{ display:block; text-align:left; line-height:30px;}
/*就业方向广，全能型H5人才月薪过万只是小目标*/
.h5qj_direction{width:100%;height:592px;min-width:1200px; margin:0 auto;background:#fff; position:relative;}
.h5qj_direction_main{width:100%;height:260px;background:#fff;border-radius:3px;box-shadow: 0 5px 25px 5px rgba(0,0,0,0.05);margin-top:90px; position:relative;}
.h5qj_direction_left{width:292px;height:172px;background:url(../images/h5qj_direction_img.jpg) center no-repeat;margin-left:30px;margin-top:30px;border-radius:8px;}
.h5qj_direction_left img{margin-top:65px;}
.h5qj_direction_right{width:292px;height:172px;background:url(../images/h5qj_direction_img01.jpg) center no-repeat;margin-right:30px;margin-top:30px;border-radius:8px;}
.h5qj_direction_right img{margin-top:65px;}
.h5qj_direction_center{width:495px;height:320px;background:#fff;border-radius:3px;position:absolute;top:-30px;left:0px;right:0px;margin:0 auto;box-shadow: 0 5px 25px 5px rgba(0,0,0,0.05);}
.h5qj_direction_center p{ line-height:24px; text-align:left;padding:40px 38px;}
/*来华清学习HTML5课程，成为企业真正需要的开发人员*/
.h5qj_development{width:100%;height:710px;min-width:1200px; margin:0 auto;background:#f5f8fa; position:relative;}
.h5qj_development_main{width:100%;margin:0 auto;margin-top:60px;}
.h5qj_development_main ul{width:100%;height:328px;margin:0 auto; position:relative;}
.h5qj_development_main ul li{width:175px;height:159px;background:url(../images/h5qj_development_img.png) center no-repeat; position:absolute;}
.h5qj_development_main_hover{width:175px;height:159px;background:url(../images/h5qj_development_img01.png) center no-repeat; position:absolute;top:0px;left:0px; z-index:9;}
.h5qj_development_more{}
.h5qj_development_more{width:260px;height:50px;line-height:50px;background:#f5f5f5;border:1px #cccccc solid;border-radius:3px;margin:0 auto;margin-top:70px;transition:.4s; -webkit-transition:.4s;}
.h5qj_development_more:hover{background:none;transition:.4s; -webkit-transition:.4s;}
/*四个月，你不仅能学到热门项目，重要的是可以高薪啊！*/
.h5qj_salaries{width:100%;height:928px;min-width:1200px; margin:0 auto;background:#383838; position:relative;}
.h5qj_salaries_main{width:100%;margin:0 auto;}
.h5qj_salaries_main ul{width:98%;margin:0 auto;margin-top:60px;}
.h5qj_salaries_main ul li{float:left;width:350px;height:410px;background:#fff;border-radius:8px;margin:0px 20px;}
.jyqj_easy_c{width:100%; height:auto;position:relative;margin-top:60px;}
.jyqj_easy_d{ width:100%; height:auto; margin:0 auto; display:table;}
.jyqj_easy_d li{ float:left;height:223px;height:146px;margin-right:21px;position:relative;}
.jyqj_easy_d li img{width:100%;height:146px;}
.jyqj_easy_d li p{width:100%; position:absolute;bottom:38px;}

.jyqj_easy_f{ width:24px; height:40px; position:absolute; top:55px; left:0px; z-index:99; cursor:pointer;}
.jyqj_easy_g{ width:24px; height:40px; position:absolute; top:55px; right:0px; z-index:99; cursor:pointer;}
.jyqj_easy_h{width:1200px; height:auto; margin:0 auto;}
/*高薪经验分享，师哥师姐有话讲*/
.h5qj_speech{width:100%;height:663px;min-width:1200px; margin:0 auto;background:#fff; position:relative;}
.h5qj_speech_main{width:100%;margin:0 auto;margin-top:50px;}
.h5qj_speech_left{width:590px;height:400px;background:url(../images/h5qj_speech_left.jpg) top center #fff no-repeat;border-radius:8px;box-shadow: 0 5px 15px 1px rgba(0,0,0,0.1);}
.h5qj_speech_left img{margin-top:130px;}
.h5qj_speech_left  p{margin-top:152px;}
.h5qj_speech_right{width:590px;height:400px;}
.h5qj_speech_right ul{width:100%;margin:0 auto;}
.h5qj_speech_right ul li{ float:left;width:279px;height:190px;border:1px #f0f5f6 solid;border-radius:3px;margin-left:14px;}
.h5qj_speech_right ul li img{width:100%;height:130px;border-radius:3px 3px 0px 0px;}
.h5qj_speech_right ul li p{width:100%;height:60px;line-height:60px;}
.h5qj_speech_right ul li:hover p{color:#ff6960;}
/*他们是现在的H5开发工程师，但H5的未来却由你掌控*/
.h5qj_control{width:100%;height:952px;min-width:1200px; margin:0 auto;background:#f5f8fa; position:relative;}
.h5qj_control_main{width:1100px;margin:0 auto;box-shadow: 0 10px 20px rgba(0,0,0,0.1);margin-top:50px;}
.qrs_here_list{width:1100px;height:71px; line-height:71px; background:url(../images/h5qj_control_top.png) center no-repeat; margin:0 auto;}
.h5qj_control_work{width:1100px;margin:0 auto;background:#fff;}
.h5qj_control_list01 li{width:100%;height:64px; line-height:64px; text-align:center;background:url(../images/h5qj_control_xian.jpg) center bottom no-repeat;}
.h5qj_control_list01 li p{float:left;width:132px;}
.h5qj_control_list01 li p.qrs_here_w01{width:176px;}
.h5qj_control_list01 li p.qrs_here_w02{width:275px;}
.h5qj_control_list01 li p.qrs_here_w03{width:187px;background:#232937;font-size:16px;color:#f7bc07; font-weight:bold; position:relative;box-shadow: 0 10px 20px rgba(0,0,0,0.4);}
.h5qj_control_list01 li p.qrs_here_w04{width:154px;}
/*63%以上的华清学员都能高薪就业！Why？*/
.h5qj_can{width:100%;height:670px;min-width:1200px; margin:0 auto;background:#fff; position:relative;}
.h5qj_can_main{width:100%;margin:0 auto;}
.h5qj_can_main ul{width:93%;margin:0 auto;margin-top:60px;}
.h5qj_can_main ul li{float:left;width:276px;height:199px;border-left:1px #dde2e6 solid;border-top:1px #dde2e6 solid; position:relative;}
.h5qj_can_main ul li em{width:26px;height:3px;background:#ff6960;border-radius:3px;margin:0 auto;margin-top:20px;}
.h5qj_can_main_hover{width:100%;height:199px;background:#ff6960; position:absolute; top:0px;}
.h5qj_can_main_hover span{ display:block; text-align:left; line-height:24px;padding:15px 45px;}
/*h5课程大纲*/
/*banner*/
.h5lx_banner{width:100%;height:330px;min-width:1200px; margin:0 auto;background:url(../images/h5lx_banner.jpg) center no-repeat; position:relative;margin-top: 12px;}
.h5lx_banner01{width:170px;height:36px; line-height:36px;padding-top:85px;}
.h5lx_banner01 p{border:1px #ee9aa0 solid;border-radius:3px;}
.h5lx_banner02{width:100%;margin:0 auto;}
.h5lx_banner02 ul{width:100%;margin:0 auto;margin-top:20px;}
.h5lx_banner02 ul li{float:left;margin:0px 15px;}
.h5lx_banner02 ul li img{float:left;margin-top:2px;margin-right:5px;}
.h5lx_banner02 ul li span{ float:left;color:#fee514;}
/*华清远见HTML5课程发展史——4次技术革新*/
.h5lx_innovation{width:100%;height:918px;min-width:1200px; margin:0 auto;background:#fff; position:relative;}
.h5lx_innovation_main{width:100%;margin:0 auto;}
.h5lx_innovation_main .tab-hd {width:62%;margin:0 auto;margin-top:60px; overflow:hidden; zoom:1;}
.h5lx_innovation_main .tab-hd li{ float:left; width:186px;height:165px;text-align:center; cursor:pointer; position:relative;}
.h5lx_innovation_main .tab-hd li.active{}
.h5lx_innovation_img01{width:104px;height:104px;background:url(../images/h5lx_innovation_main_img.png) center 30px no-repeat; transition:.4s; -webkit-transition:.4s;}
.h5lx_innovation_img02{width:110px;height:110px;background:url(../images/h5lx_innovation_main_img01.png) center 22px no-repeat;transition:.4s; -webkit-transition:.4s;}
.h5lx_innovation_img03{width:125px;height:125px;background:url(../images/h5lx_innovation_main_img02.png) center 10px no-repeat;transition:.4s; -webkit-transition:.4s;}
.h5lx_innovation_img04{width:131px;height:131px;background:url(../images/h5lx_innovation_main_img03.png) center 2px no-repeat;transition:.4s; -webkit-transition:.4s;}
.h5lx_innovation_img01.active{width:104px;height:104px;background:url(../images/h5lx_innovation_main_img_red.png) center 30px no-repeat;transition:.4s; -webkit-transition:.4s;}
.h5lx_innovation_img02.active{width:110px;height:110px;background:url(../images/h5lx_innovation_main_img01_red.png) center 22px no-repeat;transition:.4s; -webkit-transition:.4s;}
.h5lx_innovation_img03.active{width:125px;height:125px;background:url(../images/h5lx_innovation_main_img02_red.png) center 10px no-repeat;transition:.4s; -webkit-transition:.4s;}
.h5lx_innovation_img04.active{width:130px;height:130px;background:url(../images/h5lx_innovation_main_img03_red.png) center 2px no-repeat;transition:.4s; -webkit-transition:.4s;}
.h5lx_innovation_main .tab-hd li p{ position:absolute;left:0px;right:0px;bottom:0px; margin:0 auto;}
.h5lx_innovation_main .tab-bd{width:100%;margin:0 auto;margin-top:50px;}
.h5lx_innovation_main .tab-bd li{display:none;width:1150px;height:460px;background:#fff;border-radius:3px;box-shadow: 0 5px 15px 1px rgba(0,0,0,0.1);margin:0 auto;}
.h5lx_innovation_main .tab-bd li.thisclass{ display:list-item;}
.h5lx_innovation_left{width:580px;height:380px;margin-top:40px;margin-left:40px;}
.h5lx_innovation_right{width:460px;height:340px;padding:20px 25px;margin-top:40px;}
.h5lx_innovation_right p{ text-align:left;padding-bottom:10px;}
.h5lx_innovation_right span{ display:block;line-height:26px; text-align:left;}
/*六大课程优势，完全适应市场需求*/
.h5lx_demand{width:100%;height:603px;min-width:1200px; margin:0 auto;background:#f5f8fa; position:relative;}
.h5lx_demand_main{width:100%;margin:0 auto;margin-top:60px;}
.h5lx_demand_left{width:540px;height:370px;background:#fff; border-radius:8px; position:relative;box-shadow: 0 10px 20px rgba(0,0,0,0.05);}
.h5lx_demand_left .img{width:100%;height:301px;border-radius:8px 8px 0px 0px;}
.h5lx_demand_left .img01{width:60px;height:60px; position:absolute;top:115px;left:0px;right:0px;margin:0 auto;}
.h5lx_demand_left p{width:100%;height:70px;line-height:70px;}
.h5lx_demand_right{width:650px;height:370px;}
.h5lx_demand_right ul{width:100%;margin:0 auto;}
.h5lx_demand_right ul li{float:left;width:200px;height:180px;margin:0 8px;}

/*超主流技术学到手，跨越小白到大神的鸿沟*/
.h5lx_mainstream{width:100%;height:590px;min-width:1200px; margin:0 auto;background:#fff; position:relative;}
.h5lx_mainstream_main{width:100%;margin:0 auto;margin-top:60px;}
.h5lx_mainstream_left{width:341px;height:159px;margin-top:50px;background:url(../images/h5lx_mainstreamleft.png) center no-repeat;}
.h5lx_mainstream_left p{width:305px; line-height:36px;margin-top:45px;}
.h5lx_mainstream_center{width:432px;height:358px;background:url(../images/h5lx_mainstreamimg.png) center no-repeat; position:relative;}
.h5lx_jamp{width:132px;height:36px; position:absolute;top:90px;left:112px;}
.h5lx_jamp01{width:132px;height:36px; position:absolute;top:30px;right:0px;}
.h5lx_jamp02{width:132px;height:36px; position:absolute;top:106px;right:-20px;}
.h5lx_jamp03{width:132px;height:36px; position:absolute;top:170px;left:2px;}
.h5lx_jamp04{width:132px;height:36px; position:absolute;top:190px;left:108px;}
.h5lx_jamp05{width:132px;height:36px; position:absolute;top:185px;right:25px;}
.h5lx_jamp06{width:132px;height:36px; position:absolute;top:286px;left:128px;}
.h5lx_mainstream_right{width:341px;height:159px;margin-top:50px;background:url(../images/h5lx_mainstreamright.png) center no-repeat;}
.h5lx_mainstream_right p{width:305px; line-height:36px;margin-top:45px;margin-left:35px;}
.h5lx_jamp,.h5lx_jamp01,.h5lx_jamp02,.h5lx_jamp03,.h5lx_jamp04,.h5lx_jamp05,.h5lx_jamp06 img {animation: myfirst 2s infinite;}
@keyframes myfirst {
0% {
	transform: translate(0px, 0px);
}
50% {
	transform: translate(0px, -10px);
}
100% {
	transform: translate(0px, 0px);
}
}
/*华清HTML5课程大纲重磅登场，引入时下热门框架*/
.h5lx_framework{width:100%;height:1187px;min-width:1200px; margin:0 auto;background:#383838; position:relative;}
.h5lx_framework_main{width:100%;margin:0 auto; position:relative;margin-top:30px;}
.h5lx_framework_main .tab-hd {float:right;width:400px;overflow:hidden; zoom:1;margin-top:60px;}
.h5lx_framework_main .tab-hd li{ float:left; width:90px;height:40px; line-height:40px;margin:0px 5px; color:#999; background:#515050;border-radius:3px; text-align:center; cursor:pointer;}
.h5lx_framework_main .tab-hd li.active{ background:#ff4c59;color:#fff;}
.h5lx_framework_main .tab-bd {width:100%;margin:0 auto;}
.h5lx_framework_main .tab-bd li{display:none;margin-top:60px;overflow-y:auto;}
.h5lx_framework_main .tab-bd li.thisclass{ display:list-item;}
.h5lx_framework_main01{width:100%;height:600px;background:#323131;padding-top:40px;}
.h5lx_framework_title{width:720px; position:absolute;top:0px; left:0px;}
.h5lx_framework_title p{ float:left;font-size:100px; font-weight:bold;color:#ff6960;margin-right:20px;}
.h5lx_framework_title span{ display:block}
.h5lx_framework_title .soan1{ display:block;float:left;width:170px;height:44px;line-height:44px;margin-top:30px;background:#ff6960;border-radius:3px;}
.h5lx_framework_bd{width:1105px;height:174px;background:#383636;border-radius:3px;margin:0 auto;margin-top:10px;}
.h5lx_framework_bd p{ text-align:left;padding-top:35px;padding-left:30px;}
.h5lx_framework_bd span{float:left; display:block; font-size:14px;color:#888; line-height:30px; text-align:left;margin-left:30px;margin-top:20px;}
.h5lx_framework_bd_left{width:620px;height:106px;padding:40px;background:#323131;border-radius:5px;margin-top:20px;}
.h5lx_framework_bd_left em{float:left;width:4px;height:18px;background:#fd695f;border-radius:1.5px;margin-top:2px;margin-right:12px;}
.h5lx_framework_bd_left span{ float:left;text-align:left; }
.h5lx_framework_bd_left p{color:#888; text-align:left;margin-top:20px; line-height:26px;}
.h5lx_framework_bd_right{width:400px;height:106px;padding:40px;background:#323131;border-radius:5px;margin-top:20px;}
.h5lx_framework_bd_right em{float:left;width:4px;height:18px;background:#fd695f;border-radius:1.5px;margin-top:2px;margin-right:12px;}
.h5lx_framework_bd_right span{ float:left;text-align:left; }
.h5lx_framework_bd_right p{color:#888; text-align:left;margin-top:20px; line-height:26px;}
/*PC/移动、Web前/后端，各大企业级真实案例全部get！*/
.h5lx_PC{width:100%;height:1570px;min-width:1200px; margin:0 auto;background:#fff; position:relative;}
.h5lx_PC_main .tab-hd {width:80%;margin:0 auto;overflow:hidden; zoom:1;margin-top:60px;}
.h5lx_PC_main .tab-hd li{ float:left; width:160px;height:120px; color:#fff; text-align:center; cursor:pointer; position:relative;}
.h5lx_PC_main .tab-hd li p{ font-size:16px;color:#666; position:absolute;bottom:0px; left:0px; right:0px;}
.h5lx_PC_main .tab-hd li.active p{color:#ff6960;}
.h5lx_PC_01{width:90px;height:90px;background:url(../images/h5lx_PC_img011.png) top center no-repeat;transition:.4s; -webkit-transition:.4s;}
.h5lx_PC_01.active{width:90px;height:90px;background:url(../images/h5lx_PC_img01.png) top center no-repeat; transition:.4s; -webkit-transition:.4s;}
.h5lx_PC_02{width:90px;height:90px;background:url(../images/h5lx_PC_img02.png) top center no-repeat;transition:.4s; -webkit-transition:.4s;}
.h5lx_PC_02.active{width:90px;height:90px;background:url(../images/h5lx_PC_img022.png) top center no-repeat;transition:.4s; -webkit-transition:.4s; }
.h5lx_PC_03{width:90px;height:90px;background:url(../images/h5lx_PC_img03.png) top center no-repeat;transition:.4s; -webkit-transition:.4s;}
.h5lx_PC_03.active{width:90px;height:90px;background:url(../images/h5lx_PC_img033.png) top center no-repeat;transition:.4s; -webkit-transition:.4s; }
.h5lx_PC_04{width:90px;height:90px;background:url(../images/h5lx_PC_img04.png) top center no-repeat;transition:.4s; -webkit-transition:.4s;}
.h5lx_PC_04.active{width:90px;height:90px;background:url(../images/h5lx_PC_img044.png) top center no-repeat; transition:.4s; -webkit-transition:.4s;}
.h5lx_PC_05{width:90px;height:90px;background:url(../images/h5lx_PC_img05.png) top center no-repeat;transition:.4s; -webkit-transition:.4s;}
.h5lx_PC_05.active{width:90px;height:90px;background:url(../images/h5lx_PC_img055.png) top center no-repeat;transition:.4s; -webkit-transition:.4s; }
.h5lx_PC_06{width:90px;height:90px;background:url(../images/h5lx_PC_img06.png) top center no-repeat;transition:.4s; -webkit-transition:.4s;}
.h5lx_PC_06.active{width:90px;height:90px;background:url(../images/h5lx_PC_img066.png) top center no-repeat;transition:.4s; -webkit-transition:.4s; }
.h5lx_PC_main .tab-bd{width:100%;height:450px;margin:0 auto;margin-top:50px; position:relative;}
.h5lx_PC_main .tab-bd li{display:none;}
.h5lx_PC_main .tab-bd li.thisclass{ display:list-item;}
.h5lx_PC_main .tab-bd li p{ text-align:left;}
.h5lx_PC_main .tab-bd li em{width:25px;height:4px;background:#ff584f;border-radius:2px;margin-top:30px;}
.h5lx_PC_main .tab-bd li span{ display:block;width:80px;height:30px;line-height:30px;border:1px #ff584f solid;border-radius:3px; text-align:center;color:#ff584f; font-weight:bold;margin-top:30px;}
.h5lx_PC_main .tab-bd li img{ position:absolute;bottom:0px; right:0px;}
.h5lx_PC_main01{width:100%;margin:0 auto;margin-top:40px;}
.h5lx_PC_main01 .tab-hd {width:620px;height:40px;margin:0 auto;background:url(../images/h5lx_PC_main01.jpg) center bottom no-repeat; overflow:hidden; zoom:1;}
.h5lx_PC_main01 .tab-hd li{ float:left;padding:0px 20px; color:#333; font-size:16px;text-align:center; cursor:pointer;}
.h5lx_PC_main01 .tab-hd li.active{ color:#ff6960; font-size:16px;padding-bottom:18px;background:url(../images/h5lx_PC_main02.jpg) center bottom no-repeat;}
.h5lx_PC_main01 .tab-bd li{display:none;padding-top:50px;}
.h5lx_PC_main01 .tab-bd li.thisclass{ display:list-item;}
.h5lx_PC_main01_img{width:380px;height:493px;box-shadow: 0 10px 20px rgba(0,0,0,0.1);margin:0 10px;}
.h5lx_PC_main_more{width:260px;height:50px;line-height:50px;background:#f5f5f5;border:1px #cccccc solid;border-radius:3px;margin:0 auto;margin-top:60px; transition:.4s; -webkit-transition:.4s;}
.h5lx_PC_main_more:hover{background:none;transition:.4s; -webkit-transition:.4s;}
/*跟着华清HTML5课程大纲走，可选择多种职业方向*/
.h5lx_html5{width:100%;height:543px;min-width:1200px; margin:0 auto;background:#f5f8fa; position:relative;}
.h5lx_html5_main{width:100%;margin:0 auto;}
.h5lx_html5_main ul{width:100%;margin:0 auto;margin-top:60px;}
.h5lx_html5_main ul li{float:left;width:299px;height:104px;border-right:1px #e0e3e4 solid;border-bottom:1px #e0e3e4 solid;}
.h5lx_html5_main ul li img{float:left;margin-top:38px;margin-left:50px;margin-right:10px;}
.h5lx_html5_main ul li span{ display:block;float:left;margin-top:38px;}
/*名企招聘+不断好评，让高薪就业实至名归*/
.h5lx_Name{width:100%;height:532px;min-width:1200px; margin:0 auto;background:#2f2c2d; position:relative;}
.emplo_c{ width:100%; height:auto;position:relative;}
.emplo_d{ width:100%; height:auto; margin:0 auto; display:table;}
.emplo_d li{ float:left;width:1200px;height:300px;background:#fff;border-radius:3px;margin-top:60px;}
.emplo_e{width:332px; height:130px;border:1px #000 solid;margin-top:10px;}
.emplo_f{ width:55px; height:36px; position:absolute; top:285px; left:65px; z-index:99; cursor:pointer;}
.emplo_g{ width:55px; height:36px; position:absolute; top:285px; left:120px; z-index:99; cursor:pointer;}
.emplo_h{width:1200px; height:auto; margin:0 auto;}
.h5lx_Name_left{float:left;width:240px;height:300px;background:url(../images/h5lx_Name_left_bei.png) center no-repeat;}
.h5lx_Name_left em{width:36px; height:4px;background:#fff;margin:0 auto;margin-top:32px;}
.h5lx_Name_left span{ display:block; text-align:left; line-height:20px;padding:25px 20px;}
.h5lx_Name_right{width:950px;height:300px;}
.h5lx_Name_right01{float:left;width:296px;height:230px;margin:0px 10px; margin-top:40px; position:relative;}
.h5lx_Name_right01 .img{margin-top:10px;}
.h5lx_Name_right01 .img01{position:absolute;top:118px; right:20px;}
.h5lx_Name_right01_hover{width:100%;height:230px; position:absolute; top:0px;background:#fff;box-shadow: 0 10px 20px rgba(0,0,0,0.1);}
.h5lx_Name_right01_hover .img02{ position:absolute; top:65px; left:0px; right:0px;margin:0 auto;}
/*华清真实学员就业经验分享！高薪攻略助你少走弯路！*/
.h5lx_experience{width:100%;height:467px;min-width:1200px; margin:0 auto;background:#fff; position:relative;}
.h5lx_experience{width:100%;margin:0 auto;}
.h5lx_experience ul{width:100%;margin:0 auto;margin-top:60px;}
.h5lx_experience ul li{float:left;width:288px;height:222px;border-radius:3px; position:relative;margin:0px 6px;}
.h5lx_experience ul li .img{width:288px;height:162px;border-radius:3px 3px 0px 0px;}
.h5lx_experience ul li .img01{position:absolute;top:118px; right:20px;}
.h5lx_experience ul li p{width:100%;height:62px;}
.h5lx_experience_hover{width:100%;height:222px; position:absolute; top:0px;background:#fff;box-shadow: 0 10px 20px rgba(0,0,0,0.1);}
.h5lx_experience_hover .img02{ position:absolute; top:65px; left:0px; right:0px;margin:0 auto;}
/*跟着华清HTML5课程大纲走，平均就业薪资10-15K*/
.h5lx_follow{width:100%;height:932px;min-width:1200px; margin:0 auto;background:#f5f8fa; position:relative;}
.h5qj_control_main{width:1100px;margin:0 auto;box-shadow: 0 10px 20px rgba(0,0,0,0.1);margin-top:50px;}
.qrs_here_list{width:1100px;height:71px; line-height:71px; background:url(../images/h5qj_control_top.png) center no-repeat; margin:0 auto;}
.h5qj_control_work{width:1100px;margin:0 auto;background:#fff;}
.h5qj_control_list01 li{width:100%;height:64px; line-height:64px; text-align:center;background:url(../images/h5qj_control_xian.jpg) center bottom no-repeat;}
.h5qj_control_list01 li p{float:left;width:132px;}
.h5qj_control_list01 li p.qrs_here_w01{width:176px;}
.h5qj_control_list01 li p.qrs_here_w02{width:275px;}
.h5qj_control_list01 li p.qrs_here_w03{width:187px;background:#232937;font-size:16px;color:#f7bc07; font-weight:bold; position:relative;box-shadow: 0 10px 20px rgba(0,0,0,0.4);}
.h5qj_control_list01 li p.qrs_here_w04{width:154px;}


/*底部悬浮表单*/
.bottom{width:100%;height:195px; position: fixed; bottom: 0;min-width:1200px; z-index:99;}
.close-warp{width:180px;height:166px; position: absolute;left:0; display:none; cursor:pointer;bottom:0px;}
.bottom-warp{width:100%;height:195px;background:url(http://www.hqyj.com/zhuanti/2018wlwsj/images/baoming.png) bottom repeat-x;min-width:1200px; z-index:999; }
.bottom-img{width:885px;margin:0 auto; position: relative;}
.bottom-warp .xx{width:25px;height:25px; position: absolute;top:28px;right:-92px;cursor: pointer;}
/*dfoot*/
.dfoot{width:100%;min-width:1200px;height:195px; position:fixed;left:0px;bottom:0px;}
.btn-select {float:left; position: relative; display: inline-block; width: 134px; height: 40px; font-size:14px; font-family:"微软雅黑", Arial, Tahoma,"微软雅黑"; background: #fff;color: #999999;text-align:left; cursor:pointer;border-radius: 4px;box-shadow: 0 5px 15px 1px rgba(0,0,0,0.1);margin-left:8px;margin-right:8px;} 
.btn-select .cur-select { position: absolute; display: block; width: 134px; height: 40px; background:url(../images/king_zi.png) no-repeat 100px center;  padding-left: 20px; line-height: 40px;cursor:pointer; border-radius:4px;}
.btn-select select { position: absolute; top: 0; left: 0; width: 134px; height: 40px; opacity: 0; filter: alpha(opacity: 0;); font-size:14px; font-family:"微软雅黑", Arial, Tahoma,"微软雅黑"; cursor:pointer;}
.dfoot input{float:left;color:#333;}
.bm_input{width:132px;height:40px;border-radius:4px;font-size:14px;color: #333;background: #fff;cursor:pointer;padding-left: 20px;margin-left:10px;}
.bm_input3{width:140px;height:40px;border-radius:4px;font-size:14px;color: #333;background: #fff;cursor:pointer;padding-left: 20px;margin-left:18px;}
.bm_input4{width:140px;height:40px;border-radius:4px;font-size:14px;color: #333;background: #fff;cursor:pointer;padding-left: 20px;margin-left:18px;}
.z_btn{width:120px;height:40px;border-radius:4px;font-size:18px;color: #fff !important;background: #f9643c;cursor:pointer;margin-left:18px;}
.z_btn:hover{background:#e44015; transition:1s; -webkit-transition:1s;}
/*报名*/
input::-webkit-input-placeholder{ /*webkit内核浏览器*/
color:#999999;}
input:-moz-placeholder{/*firefox 1.8-*/
color:#999999;	}
input::-moz-placeholder{/*firefox 1.9+*/
color:#999999;	}
input:-ms-placeholder{
color:#999999;	}

.dfoot_center{float:right;width:700px;}
.dfoot_center p{ font-size:16px;color:#fff;padding-bottom:30px;}