/* ----------公共样式---------- */ body{background: #f6f6f6;} .wrap{overflow: hidden;} .inner{overflow: visible;} .innl{float: left;} .innr{float: right;} .box_hd{ width: 100%; text-align: center; } .box_hd h2{font-size: 30px;color: #252b3a;position: relative;} .box_hd p{ display: inline-block; font-size: 14px; color: #252b3a; line-height: 20px; padding-top: 18px; } .box_hd h2 span, .box_hd p span{color: #0067e1;} .box_hd p a{float: right;position: relative;color: #ff6000;margin-left: 10px;padding-right: 10px;} .box_hd p a:after{ position: absolute; right: 0; top: 50%; width: 6px; height: 9px; background: url(/uploads/image/2iindeximg/pic.png) no-repeat -170px -274px; content: ""; margin-top: -4.5px; } .box_hd p a:hover{font-weight: bold;} /* 新闻 */ .nows_con{ padding-left: 26px; padding-top: 28px; height: 308px; overflow: hidden; } .nows_con h2{ font-size: 24px; color: #222; padding-bottom: 6px; } .nows_con h2 span{ font-size: 14px; color: #999; padding-left: 10px; } .nows_con h2 a{ font-size: 14px; font-style: inherit; float: right; padding: 8px 52px 0 0; color: #666; } .nows_con ul{ margin-top: 10px; margin-bottom: 36px; } .nows_con li{ width: 92%; line-height: 33px; } .nows_con li:hover{ background: #eee; } .nows_con li b{ float: left; width: 16px; height: 16px; margin: 9px 6px 0 5px; background: #a7a7a7; font-size: 14px; color: #fff; text-align: center; line-height: 16px; font-weight: 400; } .nows_con li p{ float: left; width: 91%; font-size: 15px; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .nows_con li.red b{background: #d50212;} .nows_con img{margin-top: 10px;} /*免费咨询直播课*/ /* syxk_box */ /* 全国校区 */ /* ----------banner---------- */ .bans{width:100%; height: 432px; position: relative;z-index: 4;} .bans .bans_bg{position: absolute;left: 0;top: 0;display: none;width: 100%;height: 432px;background: rgba(0,0,0,.6);z-index: 4;} .banner{background: #f9faff;} .banner .slidebox{ width:100%; height:432px; overflow:hidden; position:relative;} .banner .slidebox:hover .bb{display: block;} .banner .slidebox .boxhd{width: 100%;height:32px;position: absolute;left: 0;bottom: 0;z-index: 1;} /* .banner .slidebox .hd{width: 976px; height:100%; overflow:hidden; margin: 0 auto;padding-left: 224px;z-index:1; text-align: center;} */ .banner .slidebox .hd{position: absolute;left: 50%;bottom: 0;width: 976px;height: 100%;text-align: center;overflow: hidden;z-index: 1;margin-left: -376px;} .banner .slidebox .hd ul{height: 100%;position: relative;} .banner .slidebox .hd ul li{ float:left;width: 244px; height: 100%;text-align:center; cursor:pointer;font-size: 12px;color: rgba(255,255,255,.4);line-height: 32px;} .banner .slidebox .hd ul li.on{color:#fff;opacity: 1;} .banner .slidebox .bb{display: none;padding-left: 0; margin-left: 0; height:0; overflow:visible;background: none;bottom: 249px;position: absolute;width: 1200px;left: 50%;margin-left: -600px;} .banner .slidebox .bd .li_in{position: relative;width:100%; height: 432px; margin: 0 auto;} .banner .slidebox .bd a{width:100%; height:400px; display: block; overflow:hidden;} .banner .slidebox .bd{ position:relative; height:400px; z-index:0;} .banner .slidebox .bd li{ zoom:1; vertical-align:middle; width:100%;} .slideban .bd img{position: absolute;left: 50%;margin-left: -960px;height: 100%; border: 0;} .banner .slidebox .prev, .banner .slidebox .next{ position:absolute; left: 50%;margin-left: -366px;top: 0;display:block; width:40px; height:40px; background:url(/uploads/image/2iindeximg/pic.png) 0 -435px no-repeat;} .banner .slidebox .next{ left:auto; right: 50%;margin-right: -590px; background-position-x: -42px;} .banner .slideban .prev:hover{ background-position-x: -84px;} .banner .slideban .next:hover{ background-position-x: -126px;} .index_h ul li .all.on:before{display: none;} .sub_nav{width:1200px; height: 0; position: absolute; left: 50%; margin-left: -600px; top:38px; z-index: 5;} /* .sub_nav .nav_txt{width:224px; height:394px; background: rgba(255,255,255,.95); z-index: 55;} */ .sub_nav .nav_txt{width:224px; height:474px; background: rgba(255,255,255,.95); z-index: 55;} .sub_nav .nav_txt ul{display: none;float: left;width: 100%;} .sub_nav .nav_txt ul.ulon{display: block;} .sub_nav .nav_txt li{margin: 2px auto;} .sub_nav .nav_txt li .coursenav{ position: absolute; display: none; left: 237px; top: -25px; width: 370px; height: 406px; background: #fff; box-sizing: border-box; border-radius: 20px; padding: 12px 10px; z-index: 5; } .sub_nav .nav_txt li .coursenav:before{ position: absolute; width: 13px; height: 100%; left: -13px; top: 0; content: ""; } /* .sub_nav .nav_txt li:hover .coursenav{display: block;} */ .sub_nav .nav_txt li.cur .coursenav{display: block;} .sub_nav .nav_txt li .coursenav .coursenav_top{ position: relative; width: 100%; height: 162px; border-radius: 12px; } /* .sub_nav .nav_txt li.web .coursenav .coursenav_top{background: #209cff;} .sub_nav .nav_txt li.python .coursenav .coursenav_top{background: #764ea9;} .sub_nav .nav_txt li.ai .coursenav .coursenav_top{background: #091c92;} .sub_nav .nav_txt li.ui .coursenav .coursenav_top{background: #f85a52;} .sub_nav .nav_txt li.test .coursenav{top: -32px;} .sub_nav .nav_txt li.test .coursenav .coursenav_top{background: #00a0d3;} .sub_nav .nav_txt li.xmt .coursenav{top: -81px;} .sub_nav .nav_txt li.xmt .coursenav .coursenav_top{background: #a73eca;} .sub_nav .nav_txt li.pm .coursenav{top: -130px;} .sub_nav .nav_txt li.pm .coursenav .coursenav_top{background: #f9692e;} .sub_nav .nav_txt li.linux .coursenav{top: -117px;} .sub_nav .nav_txt li.linux .coursenav .coursenav_top{background: #3361a8;} .sub_nav .nav_txt li.robot .coursenav{top: -117px;} .sub_nav .nav_txt li.robot .coursenav .coursenav_top{background: #0a4ec0;} .sub_nav .nav_txt li.uids .coursenav{top: -156px;} .sub_nav .nav_txt li.uids .coursenav .coursenav_top{background: #f69537;} */ .sub_nav .nav_txt li .coursenav .coursenav_top img{ display: block; width: 100%; } .sub_nav .nav_txt li .coursenav .coursenav_top span{ position: absolute; left: 25px; top: 40px; font-size: 15px; line-height: 26px; color: rgba(255,255,255,.6); } .sub_nav .nav_txt li.hm .coursenav{padding: 16px;} .sub_nav .nav_txt li.hm .coursenav .coursenav_top{height: 180px;margin-bottom: 14px;} .sub_nav .nav_txt li.hm .coursenav .coursenav_top span{top: 60px;} .sub_nav .nav_txt li .coursenav .coursenav_top strong{display: block;font-size: 20px;color: #fff;margin-bottom: 8px;} .sub_nav .nav_txt li .coursenav .coursenav_top b{display: block;color: #fff;} .sub_nav .nav_txt li .coursenav .coursenav_bot{ width: 300px; height: 138px; margin: 24px auto 0; overflow: hidden; } .sub_nav .nav_txt li .coursenav .coursenav_bot p{ width: 356px; text-align: center; margin-left: -28px; } .sub_nav .nav_txt li .coursenav .coursenav_bot a{ position: relative; float: left; width: 118px; height: 68px; font-size: 13px; color: #686868; line-height: 16px; box-sizing: border-box; border-bottom: 1px #f7f7f7 solid; padding-top: 38px; } .sub_nav .nav_txt li .coursenav .coursenav_bot a:hover{color: #333;} .sub_nav .nav_txt li .coursenav .coursenav_bot a:nth-child(2), .sub_nav .nav_txt li .coursenav .coursenav_bot a:nth-child(5){border-left: 1px #f7f7f7 solid;border-right: 1px #f7f7f7 solid;} .sub_nav .nav_txt li .coursenav .coursenav_bot a:nth-child(n 4){height: 71px;padding-top: 54px;} .sub_nav .nav_txt li .coursenav .coursenav_bot a:before{ position: absolute; left: 50%; top: -1px; width: 35px; height: 33px; background: no-repeat; margin-left: -17.5px; content: ""; } .sub_nav .nav_txt li .coursenav .coursenav_bot a:nth-child(n 4):before{top: 13px;} .sub_nav .nav_txt li .coursenav .coursenav_bot a:nth-child(2):before{background-image: ;} .sub_nav .nav_txt li .coursenav .coursenav_bot a:nth-child(3):before{background-image: ;} .sub_nav .nav_txt li .coursenav .coursenav_bot a:nth-child(4):before{background-image: ;} .sub_nav .nav_txt li .coursenav .coursenav_bot a:nth-child(5):before{background-image: ;} .sub_nav .nav_txt li .coursenav .coursenav_bot a:nth-child(6):before{background-image: ;} .sub_nav .nav_txt li .coursenav .coursenav_end{text-align: center;margin-top: 30px;} .sub_nav .nav_txt li .coursenav .coursenav_end a{position: relative;display: inline-block;line-height: 16px;font-size: 13px;color: #0094ed;padding-right: 14px;} .sub_nav .nav_txt li .coursenav .coursenav_end a:hover{color: #5a98f6;} .sub_nav .nav_txt li .coursenav .coursenav_end a:after{ position: absolute; right: 0; top: 2px; width: 6px; height: 10px; background: no-repeat; content: ""; } .sub_nav .nav_txt li>a{ position: relative; display:block; width: 204px; height: 33.5px; font-size: 13px; color: #333; line-height: 33.5px; box-sizing: border-box; border-radius: 10px; padding-left: 18px; margin: 0 auto; } /* .sub_nav .nav_txt li:nth-child(n 12)>a{color: #000 !important;} */ /* .sub_nav .nav_txt li:nth-child(12){background-color: #fafafa;} */ .sub_nav .nav_txt li:nth-child(12)>a{margin-top: 8px;} /* .sub_nav .nav_txt li:nth-child(n 12):hover>a{background-color: rgba(0,0,0,.05) !important;} */ .sub_nav .nav_txt li:last-child:hover:before{display: none;} .sub_nav .nav_txt li:last-child{position: relative;border: none;} .sub_nav .nav_txt li:last-child:before{ position: absolute; left: 23px; top: -1px; width: 178px; height: 1px; background-color: #e9e9e9; /* content: ""; */ } .sub_nav .nav_txt ul.eq2 li>a{height: 50px;line-height: 50px;} /* .sub_nav .nav_txt li:hover>a{background: rgba(255,255,255,.2);} */ .sub_nav .nav_txt li.cur>a{color: #0067e1;font-weight: bold;background: #fff;} .sub_nav .nav_txt li span{float: left; cursor:pointer;} .sub_nav .nav_txt li i{float: right; cursor:default; font-size: 17px;display: none;} .sub_nav .nav_txt ul.eq2{padding-top: 20px;} .sub_nav .nav_txt .eq2 li{width: 194px;height: 57px;border-radius: 6px;margin-left: 15px;margin-bottom: 10px;padding: 0;} .sub_nav .nav_txt ul.eq2 li>a{text-align: center;height: 57px !important;width: 194px;padding: 0;line-height: 57px !important;} .sub_nav .nav_txt .eq2 .ui{background:rgba(255,255,255,.1) no-repeat left bottom;} .sub_nav .nav_txt .eq2 .xmt{background:rgba(255,255,255,.1) no-repeat left bottom;} .sub_nav .nav_txt .eq2 .dt{background:rgba(255,255,255,.1) no-repeat left bottom;} /* .sub_nav .nav_txt .eq2 li:last-child{background:rgba(255,255,255,.1) no-repeat left bottom;} */ .sub_nav .nav_txt .eq2 li .coursenav{left: 210px;} .course_kind{position:absolute;z-index: 100; left:224px; top:0; width:248px; height:496px; background: #fff;display: none;box-shadow: 0 5px 16px rgba(124,124,124,.3);border-top-right-radius: 10px;border-bottom-right-radius: 10px;} .course_kind .icon_fu .icon_fuli{width:248px; height:496px; margin: 0 auto; text-align: center; display: none; overflow: hidden;} .course_kind .icon_fu .icon_fuli .icon_ul{margin-top: 37px;} .course_kind .icon_fu .icon_fuli li{margin-bottom: 22px;} .course_kind .icon_fu .icon_fuli li.innl{width:70px;margin-left: 40px;} .course_kind .icon_fu .icon_fuli li.innr{width:70px;margin-right: 40px;margin-left: 0;} .course_kind .icon_fu .icon_fuli li.innc{clear: both;} .course_kind .icon_fu .icon_fuli li.innend{clear: both;} .course_kind .icon_fu .icon_fuli li span{display: block;text-align:center; padding: 5px 0 5px;} .course_kind .icon_fu .icon_fuli li.innc a{display: block;width: 172px;height: 154px;margin: 0 auto;position: relative;} .course_kind .icon_fu .icon_fuli li.innend a{display: block;width: 183px;height: 49px;line-height: 49px;margin: 0 auto;border-radius: 25px;border: 1px #d3d6db solid;font-size: 16px;color: #353535;} .course_kind .icon_fu .icon_fuli li.innend a:hover{background: #cf2633;border-color: #cf2633;color: #fff;} .course_kind .icon_fu .icon_fuli li.innc span{position: absolute;width: 80%;left: 50%;top: 50%;transform: translate(-50%,-50%);font-size: 20px;color: #404040;text-align: center;font-weight: bold;line-height: 30px;} .course_kind .icon_fu .icon_fuli li:hover .iconfont{color:#d72502;} .course_kind .icon_fu .icon_fuli li:hover span{color:#d72502;} .course_kind .icon_fu .icon_fuli li.innc:hover span{color:#404040;} .course_kind .icon_fu .icon_fuli li.innl:hover img{opacity: 1;} .course_kind .icon_fu .icon_fuli li.innr:hover img{opacity: 1;} /*添加修改*/ .course_kind .icon_fu .icon_fulipython .innend a{box-shadow: none !important;height: 40px !important; line-height: 40px !important;border: none !important;} .course_kind .icon_fu .icon_fulipython li{margin-bottom: 15px !important;} .course_kind .icon_fu .icon_fulipython .top .innend a{color: #fff;background: #9e70ff;} .course_kind .icon_fu .icon_fulipython .btm .innend a{color: #fff;background: #5e83fa;} .course_kind .icon_fu .icon_fulipython .top .innend a:hover{background: #8e59ff;} .course_kind .icon_fu .icon_fulipython .btm .innend a:hover{background: #4973fa;} /*banner下快速通道*/ .fath_path{position: relative;width:100%;background: #fff;box-shadow: 0 0px 13px #f5f5f5;z-index: 3;} .fath_path ul{position: relative;display: -webkit-box;display: flex;width: 1200px;height: 80px;background-color: #f6f6f6;margin: 0 auto;} .fath_path ul:before{position: absolute;left: 0;top: 0;width: 224px;height: 80px;content: "";} .fath_path ul li{width:240px; height: 78px;border-bottom: 2px #fff solid;background-color: #fff;} .fath_path ul li.fathli1{margin-left: 224px;} .fath_path ul li:hover{border-color: #0678ff;background: #f5fafc;} .fath_path ul li a{display: block;width: 100%;height: 100%;} /* .fath_path ul li i{float: left;width: 32px;height: 29px;margin: 26px 20px 0 58px;background: no-repeat 0 -274px;} */ .fath_path ul li i{float: left;width: 32px;height: 29px;margin: 26px 15px 0 42px;background: no-repeat 0 -274px;} .fath_path ul li.fathli2 i{background-position-x: -34px;} .fath_path ul li.fathli3 i{background-position-x: -68px;} .fath_path ul li.fathli4 i{background-position-x: -102px;} .fath_path ul li.fathli5 i{background-position-x: -136px;} .fath_path ul li span{float: left;font-size: 16px;color: #404550;padding-top: 30px;} /* .fath_path ul li.fathli5 i{margin-left: 46px;} */ .fath_path ul li.fathli5 i{margin-left: 26px;} .fath_path ul li.fathli5 span{padding-top: 19px;} .fath_path ul li.fathli5 span em{display: block;font-style: inherit;} @font-face { font-family: 'webfont'; font-display: swap; src: ; /* ie9*/ src: format('embedded-opentype'), /* ie6-ie8 */ format('woff2'), format('woff'), /* chrome、firefox */ format('truetype'), /* chrome、firefox、opera、safari, android, ios 4.2 */ format('svg'); /* ios 4.1- */ } body{ font-family:'pingfang sc','webfont','helvetica neue',arial,'hiragino sans gb','microsoft yahei ui','microsoft yahei',simsun,sans-serif; } .header{height: 142px;} .header_con{margin: 10px 0 0;} .head_up h1{padding: 22px 0 27px;} .head_index{position: absolute;left: 0;top: 0;height: 89px;background: none;} .head_index ul{height: 89px;} .head_nav ul li{position: relative;line-height: 89px;padding: 0 15px;margin-left: 0;} .index_h ul li.lione{top: 89px;height: 38px;line-height: 38px;font-size: 14px;z-index: 6;background: none;margin-right: 180px;padding-left: 0;} .head_nav ul li .all{display: none;position: relative;width: 224px;height: 38px;line-height: 38px;border-radius: 0;background: rgba(255,255,255,.1);} .head_nav ul li .all:after{ display: none; position: absolute; left: 15px; bottom: 0; width: 194px; height: 1px; background: rgba(255,255,255,.2); content: ""; } .index_h ul li .all.on{ position: relative; display: block; font-weight: bold; background: rgba(255,255,255,.95); padding-left: 29px; } /* .index_h ul li .all.on:before{ position: absolute; bottom: 0; width: 166px; height: 1px; content: ""; } */ .index_h ul li .all.on:after{ display: block; left: 29px; width: 166px; background: rgba(214,214,214,.5); } .index_h ul li .all:hover{background: rgba(255,255,255,.95);} .index_h ul li .all:hover:after{display: block;} .index_h ul li.jpkeon:after{ position: absolute; right: 2px; top: 39px; width: 10px; height: 10px; background: no-repeat -102px -305px; content: ""; } .index_h ul li.jpkeon.cur:after{background-position-x: -114px;} .index_h ul li.jpkeon .xkonlist{ display: none; position: fixed; left: 0; top: 94px; width: 100%; height: 60px; text-align: center; line-height: 60px; background-color: rgba(255,255,255,.9); border-top: 35px #fff solid; z-index: 9; } .index_h ul li.jpkeon.cur .xkonlist{display: block;} .index_h ul li.jpkeon .xkonlist a{ display: inline-block; font-size: 15px; color: #333; margin: 0 15px; } .index_h ul li.jpkeon .xkonlist a:hover{font-weight: bold;} .syxk_box{padding: 30px 0 90px;background: #fbfbfb;} .syxk_box .box_con{width: 1050px;overflow: hidden;padding-top: 45px;height: 506px;margin: 0 auto;} .syxk_box .box_con ul {width: 1054px;} .syxk_box .box_con ul li{width: 351px;height: 169px;background: #fff;float: left;padding:12px 0;box-sizing: border-box;position: relative;border-right: 1px #f3f3f3 solid;border-bottom: 1px #f3f3f3 solid;} .syxk_box .box_con .top_hd{width: 176px;margin: 0 auto;position: relative;} .syxk_box .box_con .top_hd .picimg{width: 100%;} .syxk_box .box_con .top_hd .picimg img{height: 45px;display: block;margin: 0 auto;} .syxk_box .box_con .top_hd h3{height: 39px;font-size: 16px;color: #000;text-align: center;line-height: 45px;} .syxk_box .box_con ul li p{font-size: 15px;color: #929292;text-align: center;padding: 3px 0 5px;} .syxk_box .box_con .box_timer span{width: 100%;font-size: 16px;color: #606060;display: block;height: 27px;line-height: 27px;text-align: center;} .syxk_box .box_con li a{font-size: 16px;color: #d52626;width: 137px;height: 36px;border-radius: 50px;display: block;text-align: center;line-height: 36px;margin: 10px auto 0;border: 1px #cf2633 solid;} .syxk_box .box_con ul li .boxcon_mask{position: absolute;width: 354px;height: 168px;background: #fff;left: -2px;top: 0;box-shadow: 0 9px 49px rgba(178,178,178,.26); box-sizing: border-box;padding-top: 15px;transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -o-transition: all 0.5s; -webkit-transform: scale(0);-moz-transform: scale(0);-ms-transform: scale(0);-o-transform: scale(0);transform: scale(0); opacity: 0; z-index: 3;} .syxk_box .box_con ul li:hover .boxcon_mask{-webkit-transform: scale(1);-moz-transform: scale(1);-ms-transform: scale(1);-o-transform: scale(1);transform: scale(1); opacity: 1;} .syxk_box .box_con ul .last img{display: block;margin: 34px auto 17px;} .syxk_box .box_con ul .last p{font-size: 18px;color: #457cd7;font-weight: bold;padding: 0;} .syxk_box .box_con ul .last:hover p{color:#264d8d;} .syxk_box .box_con ul .last{cursor: pointer;} /* ----------视频---------- */ .box_newsvid{padding-top: 78px;} .box_newsvid .newsvid_con .vid{ position: relative; float: left; width: 579px; height: 326px; border-radius: 12px; margin-left: 30px; } .box_newsvid .newsvid_con .vid video{border-radius: 15px;} .box_newsvid .newsvid_con .vid span{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; font-size: 0; cursor: pointer; border-radius: 12px; background: no-repeat; } .box_newsvid .rigtxt{ float: left; width: 526px; height: 326px; margin-left: 33px; } .box_newsvid .rigtxt h3{ height: 35px; border-bottom: 1px #e9e9e9 solid; margin: 4px 0 10px; } .box_newsvid .rigtxt h3 span, .box_newsvid .rigtxt h3 a{ float: left; height: 35px; font-size: 16px; color: #575d6c; line-height: 35px; cursor: pointer; margin-right: 38px; } .box_newsvid .rigtxt h3 span:hover, .box_newsvid .rigtxt h3 a:hover{color: #0067e1;} .box_newsvid .rigtxt h3 span.cur{ font-size: 16px; color: #252b3a; border-bottom: 2px #0067e1 solid; } .box_newsvid .rigtxt h3 a.more{ position: relative; float: right; font-size: 14px; color: #ff6000; padding-right: 18px; margin-right: 0; } .box_newsvid .rigtxt h3 a.more:after{ position: absolute; right: 8px; top: 12px; width: 6px; height: 9px; background: no-repeat -170px -274px; content: ""; } .box_newsvid .rigtxt ul{display: none;} .box_newsvid .rigtxt ul.cur{display: block;} .box_newsvid .rigtxt ul li{ position: relative; height: 34px; padding-left: 11px; line-height: 34px; } .box_newsvid .rigtxt ul li:before{ position: absolute; left: 1px; top: 15px; width: 4px; height: 4px; border-radius: 50%; background: #ff6000; content: ""; } .box_newsvid .rigtxt ul li a{ display: block; font-size: 15px; color: #818692; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* .box_newsvid .rigtxt ul li:nth-child(1) a, .box_newsvid .rigtxt ul li:nth-child(4) a{ font-size: 18px; color: #252b3a; font-weight: bold; } */ .box_newsvid .rigtxt ul li a:hover{color: #0067e1;} /* .box_newsvid .rigtxt ul li:nth-child(1):before, .box_newsvid .rigtxt ul li:nth-child(4):before{ left: 0; top: 17px; width: 6px; height: 6px; background-color: #ff6000; } */ /* ----------免费教程---------- */ .box_freetutorial{ background: -moz-linear-gradient(to bottom , #fff, #f7f7f7); background: linear-gradient(to bottom, #fff,#f7f7f7); padding: 120px 0 86px; } .box_freetutorial .freetutorialbg1{ position: absolute; right: -360px; bottom: -5px; opacity: .5; } .box_freetutorial .freetutorial_con{ position: relative; width: 100%; height: 420px; /* border: 2px #fff solid; */ /* background: -moz-linear-gradient(to bottom , #f3f5f8, #fff); background: linear-gradient(to bottom, #f3f5f8,#fff); */ background-color: #fff; border-radius: 20px; box-sizing: border-box; margin-top: 32px; /* box-shadow: 8px 8px 20px 0 rgba(55,99,170,.06), -8px -8px 20px 0 #fff; */ z-index: 3; } .box_freetutorial .freetutorial_con .openclass{ float: left; width: 225px; height: 420px; border-right: 1px #f7f7f7 solid; } .box_freetutorial .freetutorial_con .openclass .main{width: 200px;margin: 0 auto;} .box_freetutorial .freetutorial_con .openclass .main .opentop{ height: 22px; font-size: 16px; color:#252b3a; font-weight: bold; padding: 30px 0; } .box_freetutorial .freetutorial_con .openclass .main .openpic{ width: 169px; height: 110px; margin: 0 auto; overflow: hidden; border-radius: 12px; } .box_freetutorial .freetutorial_con .openclass .main .openpic img{width: 100%;} .box_freetutorial .freetutorial_con .openclass .main .openconp2{ height: 20px; font-size: 14px; color: #252b3a; line-height: 20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; margin: 9px 0 8px; padding: 0 2px 0 6px; } .box_freetutorial .freetutorial_con .openclass .main .openconp3{ font-size: 13px; color: #575d6c; line-height: 19px; padding: 0 2px 0 6px; height: 94px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; word-break: break-all; } .box_freetutorial .freetutorial_con .openclass .main .openconp3 span{ display: block; width: 96px; height: 24px; color: #ff4359; background: #f5f5f5; border-radius: 24px; text-align: center; line-height: 24px; margin-bottom: 13px; } .box_freetutorial .freetutorial_con .openclass .main .openconp4{ height: 25px; line-height: 25px; font-size: 14px; color: #252b3a; padding-left: 4px; margin-top: 28px; } .box_freetutorial .freetutorial_con .openclass .main .openconp4 a{ float: right; width: 80px; height: 25px; border-radius: 13px; color: #fff; text-align: center; line-height: 25px; background: #0678ff; } .box_freetutorial .freetutorial_con .openclass .main .openconp4 a:hover{background: #1776e5;} .box_freetutorial .freetutorial_con .resources{ float: right; width: 950px; } .box_freetutorial .freetutorial_con .resources .resources_con{height: 28px;padding: 32px 0 22px;} .box_freetutorial .freetutorial_con .resources .resources_con ol li{ position: relative; float: left; font-size: 14px; color: #575d6c; height: 28px; line-height: 20px; cursor: pointer; margin-right: 26px; } .box_freetutorial .freetutorial_con .resources .resources_con ol li:last-child{margin-right: 0;} .box_freetutorial .freetutorial_con .resources .resources_con ol li:hover{font-weight: bold;} .box_freetutorial .freetutorial_con .resources .resources_con ol li.cur{ color: #0067e1; font-weight: bold; } .box_freetutorial .freetutorial_con .resources .resources_con ol li.cur:before{ position: absolute; left: 0; bottom: 0; width: 29px; height: 2px; background: #0067e1; content: ""; } .box_freetutorial .freetutorial_con .resources .lay_con ul{display: none;} .box_freetutorial .freetutorial_con .resources .lay_con ul.cur{display: flex;flex-wrap: wrap;} .box_freetutorial .freetutorial_con .resources .lay_con ul li{ width: 169px; height: 157px; border-radius: 12px; margin-right: 18px; } .box_freetutorial .freetutorial_con .resources .lay_con ul li .img_box{ position: relative; width: 100%; height: 110px; border-radius: 12px; overflow: hidden; } .box_freetutorial .freetutorial_con .resources .lay_con .img_box img{width: 100%;} .box_freetutorial .freetutorial_con .resources .lay_con .sy_mask{position: relative;width: 100%;height: 100%;background: rgba(0,0,0,.6);position: absolute;top: 0;left: 0;overflow: hidden;display: none;} .box_freetutorial .freetutorial_con .resources .lay_con .sy_mask .sy_show{position: absolute;left: 50%;top: 50%;display: block;width: 88px;transform: translate(-50%,-50%);} .box_freetutorial .freetutorial_con .resources .lay_con ul li:hover .sy_mask{display: block;} .box_freetutorial .freetutorial_con .resources .lay_con .btm p{ position: relative; font-size: 12px; color: #98a3b7; line-height: 16px; padding: 11px 0 0 16px; } .box_freetutorial .freetutorial_con .resources .lay_con .btm p:before{ position: absolute; left: -1px; top: 12px; width: 15px; height: 12px; background-image: url(/uploads/image/2iindeximg/sy_box2icon1s.png); background-size: 15px; content: ""; } .box_freetutorial .freetutorial_con .resources .lay_con ul:first-child .btm p{padding-left: 6px;} .box_freetutorial .freetutorial_con .resources .lay_con ul:first-child .btm p:before{display: none;} .box_freetutorial .freetutorial_con .resources .lay_con .btm p span{float: right;} .box_freetutorial .freetutorial_bot{ position: relative; z-index: 3; padding: 37px 0 77px 213px; } .box_freetutorial .freetutorial_bot ul li{ float: left; width: 152px; height: 42px; cursor: pointer; margin-right: 54px; } /* .box_freetutorial .freetutorial_bot ul li.botli3{width: 169px;} */ .box_freetutorial .freetutorial_bot ul li i{ display: none; float: left; width: 37px; height: 35px; background: no-repeat 0 -35px; } .box_freetutorial .freetutorial_bot ul li.botli2 i{background-position: -39px -35px;} .box_freetutorial .freetutorial_bot ul li.botli3 i{background-position: -78px -35px;} .box_freetutorial .freetutorial_bot ul li.botli4 i{background-position: -117px -35px;} /* .box_freetutorial .freetutorial_bot ul li span{ float: left; font-size: 16px; color: #404550; margin: 7px 0 0 13px; } */ .box_freetutorial .freetutorial_bot ul li span{ display: block; font-size: 16px; color: #404550; text-align: center; line-height: 38px; border: 2px #fff solid; background: -moz-linear-gradient(to bottom , #f3f5f8, #fff); background: linear-gradient(to bottom, #f3f5f8,#fff); border-radius: 4px; box-sizing: border-box; box-shadow: 8px 8px 20px 0 rgba(55,99,170,.06), -8px -8px 20px 0 #fff; } .box_freetutorial .freetutorial_bot ul li:hover i{background-position-y: -72px;} .box_freetutorial .freetutorial_bot ul li:hover span{color: #0067e1;font-weight: bold;} /* ----------2020课程中心---------- */ .box_curriculum{position: relative;background-color: #fff;padding: 102px 0 0;} .box_curriculum .curriculum_top{height: 110px;margin-top: 30px;} .box_curriculum .curriculum_top ul{display: flex;justify-content: space-between;} .box_curriculum .curriculum_top ul li{position: relative;height: 110px;flex-direction:row;text-align: center;cursor: pointer;} .box_curriculum .curriculum_top ul li.cur:before{position: absolute;width: 100%;height: 3px;background: #0d7cff;left: 0;bottom: -2px;z-index: 3;content: "";} .box_curriculum .curriculum_top ul li i{display: block;width: 60px;height: 60px;background: no-repeat 0 0;background-size: 60px;margin: 0 auto 8px;} .box_curriculum .curriculum_top ul li.is-enter i{ -webkit-animation:tpm-product-multi__icon-enter .4s steps(23) forwards; animation:tpm-product-multi__icon-enter .4s steps(23) forwards } .box_curriculum .curriculum_top ul li.is-leave i{ -webkit-animation:tpm-product-multi__icon-leave .4s steps(23) forwards; animation:tpm-product-multi__icon-leave .4s steps(23) forwards } .box_curriculum.cur .curriculum_top{ position: fixed; left: 0; top: 0; width: 100%; height: 40px; box-shadow: 0 5px 20px rgba(0,0,0,.04); background-color: #fff; margin-top: 0; padding-top: 15px; z-index: 99; } .box_curriculum.cur .curriculum_top li{height: 40px;} .box_curriculum.cur .curriculum_top li i{display: none;} .box_curriculum.cur .box_hd{margin-bottom: 140px;} @-webkit-keyframes tpm-product-multi__icon-enter{ 0%{background-position:0 0} to{background-position:0 -1380px} } @keyframes tpm-product-multi__icon-enter{ 0%{background-position:0 0} to{background-position:0 -1380px} } @-webkit-keyframes tpm-product-multi__icon-leave{ 0%{background-position:0 -1380px} to{background-position:0 0} } @keyframes tpm-product-multi__icon-leave{ 0%{background-position:0 -1380px} to{background-position:0 0} } .box_curriculum .curriculum_top ul li.top_web i{background-image: ;} .box_curriculum .curriculum_top ul li.top_python i{background-image: ;} .box_curriculum .curriculum_top ul li.top_ai i{background-image: ;} .box_curriculum .curriculum_top ul li.top_ui i{background-image: ;} .box_curriculum .curriculum_top ul li.top_test i{background-image: ;} .box_curriculum .curriculum_top ul li.top_xmt i{background-image: ;} .box_curriculum .curriculum_top ul li.top_pm i{background-image: ;} .box_curriculum .curriculum_top ul li.top_jcdl i{background-image: ;} .box_curriculum .curriculum_top ul li.top_hm i{background-image: ;} .box_curriculum .curriculum_top ul li span{font-size: 14px;color: #252b3a;} .box_curriculum .curriculum_top ul li.cur span{color: #0d7cff;} .box_curriculum .curriculum_top ul li:hover span{color: #0d7cff;} /* .box_curriculum .curriculum_bot{position: relative;width: 100%;background: #f3f4f8;box-shadow: inset 0 10px 16px rgba(208,208,208,.2);margin: 0 auto;padding: 0 0 50px;} */ .box_curriculum .curriculum_bot{position: relative;width: 100%;background: #f7f7f7;margin: 0 auto;padding: 40px 0 50px;} .box_curriculum .curriculum_bot .main_list{width: 1200px;height: 0;overflow: hidden;margin: 0 auto;} .box_curriculum .curriculum_bot .cur_list{height: 424px;background-color: #fff;border-radius: 20px;} .box_curriculum .curriculum_bot .listbot_jyl{position: relative;float: left;width: 262px;height: 424px;border-radius: 20px;box-sizing: border-box;overflow: hidden;background-color: #0c7fff;padding-top: 32px;} .box_curriculum .curriculum_bot .listbot_jyl .jylcon{position: relative;z-index: 3;} .box_curriculum .curriculum_bot .listbot_jyl .jylp1{font-size: 14px;color: #fff;line-height: 36px;padding-left: 34px;} .box_curriculum .curriculum_bot .listbot_jyl .jylp1 span{font-size: 32px;color: #fffe93;} .box_curriculum .curriculum_bot .listbot_jyl .jylp2{position: relative;font-size: 14px;color: #fff;line-height: 18px;padding: 18px 0 0 36px;z-index: 3;} .box_curriculum .curriculum_bot .listbot_jyl .jylbg{display: none;position: absolute;right: 0;bottom: 35px;width: 228px;height: 258px;background: no-repeat;} .box_curriculum .curriculum_bot .listbot_jyl .jylsubject{position: absolute;right: 0;bottom: -30px;width: 262px;height: 424px;opacity: 0;transition: all .8s ease;-moz-transition: all .8s ease;-webkit-transition: all .8s ease;-o-transition: all .8s ease;background: no-repeat;} .box_curriculum .curriculum_bot .hm_list .listbot_jyl .jylsubject{background-image: ;} .box_curriculum .curriculum_bot .web_list .listbot_jyl .jylsubject{background-image: ;} .box_curriculum .curriculum_bot .python_list .listbot_jyl .jylsubject{background-image: ;} .box_curriculum .curriculum_bot .ai_list .listbot_jyl .jylsubject{background-image: ;} .box_curriculum .curriculum_bot .ui_list .listbot_jyl .jylsubject{background-image: ;} .box_curriculum .curriculum_bot .test_list .listbot_jyl .jylsubject{background-image: ;} .box_curriculum .curriculum_bot .xmt_list .listbot_jyl .jylsubject{background-image: ;} .box_curriculum .curriculum_bot .pm_list .listbot_jyl .jylsubject{background-image: ;} .box_curriculum .curriculum_bot .jcdl_list .listbot_jyl .jylsubject{background-image: ;} .box_curriculum .curriculum_bot .cur_list .listbot_jyl .jylsubject{bottom: 0;opacity: 1;} .box_curriculum .curriculum_bot .listbot_con{position: relative;float: right;width: 898px;height: 424px;box-sizing: border-box;padding-top: 36px;} .box_curriculum .curriculum_bot .list_left{position: absolute;left: 0;bottom: 0;width: 100%;height: 60px;padding: 31px 0 22px;} .box_curriculum .curriculum_bot .list_left ul li{position: relative;float: left;width: 160px;height: 46px;margin: 0 39px 0 0;background: #fff;border-radius: 12px;box-shadow: 0px 6px 10px #f7f7f7;overflow: hidden;} .box_curriculum .curriculum_bot .list_left ul li a{display: block;overflow: hidden;} .box_curriculum .curriculum_bot .list_left ul li img{display: none;} .box_curriculum .curriculum_bot .list_left ul li i{float: left;width: 24px;height: 26px;background: no-repeat 0 -305px;margin: 11px 13px 0 35px;} .box_curriculum .curriculum_bot .list_left ul li:nth-child(1){display: none;} .box_curriculum .curriculum_bot .list_left ul li:nth-child(3) i{background-position-x: -26px;} .box_curriculum .curriculum_bot .list_left ul li:nth-child(4) i{background-position-x: -52px;} /* .box_curriculum .curriculum_bot .list_left ul li:hover i{background-position-y: -140px;} */ .box_curriculum .curriculum_bot .list_left ul li span{position: absolute;left: 72px;bottom: 0;width: 182px;font-size: 16px;color: #262626;line-height: 46px;} /* .box_curriculum .curriculum_bot .list_left ul li:hover{box-shadow: 6px 6px 18px 0 rgba(55,99,170,.2);} */ .box_curriculum .curriculum_bot .list_left ul li:hover span{color: #0067e1;} .box_curriculum .curriculum_bot .list_cen{float: left;width: 100%;height: 65px;} .box_curriculum .curriculum_bot .list_cen h2{position: relative;z-index: 3;font-size: 0;color: #252b3a;padding: 0 0 24px 0;height: 26px;line-height: 26px;} .box_curriculum .curriculum_bot .list_cen h2 strong{font-size: 16px;color: #252b3a;} .box_curriculum .curriculum_bot .list_cen h2 a, .box_curriculum .curriculum_bot .topleft h2 a{position: relative;float: right;height: 26px;color: #828282;line-height: 26px;font-size: 14px;color: #ff6000;font-weight: normal;overflow: hidden;padding-right: 10px;} .box_curriculum .curriculum_bot .list_cen h2 a:after, .box_curriculum .curriculum_bot .topleft h2 a:after{ position: absolute; right: 0; top: 8px; width: 6px; height: 9px; background: url(/uploads/image/2iindeximg/pic.png) no-repeat -170px -274px; content: ""; } .box_curriculum .curriculum_bot .list_cen h2 a:hover, .box_curriculum .curriculum_bot .topleft h2 a:hover{font-weight: bold;} .box_curriculum .curriculum_bot .list_cen h2 span{display: none;font-size: 14px;color: #828282;font-weight: 100;margin-left: 8px;} .box_curriculum .curriculum_bot .list_cen li{height: 19px;} .box_curriculum .curriculum_bot .list_cen h3{float: left;font-size: 14px;color: #98a3b7;line-height: 19px;overflow: hidden;margin-right: 12px;} .box_curriculum .curriculum_bot .list_cen h3 span{color: #fff;float: left;width: 44px;height: 19px;border-radius: 6px;background: #ff7331;text-align: center;line-height: 19px;margin-right: 12px;} .box_curriculum .curriculum_bot .list_cen p{float: left;width: 370px;height: 19px;font-size: 14px;color: #404550;line-height: 19px;overflow: hidden;} .box_curriculum .curriculum_bot .list_cen p span{float: left;margin-right: 10px;} /* .box_curriculum .curriculum_bot .list_cen p span em{color: #404550;} */ .box_curriculum .curriculum_bot .list_cen .prev,.box_curriculum .curriculum_bot .list_cen .next{position: absolute;right: 420px;top: 8px;width: 6px;height: 12px;font-size: 0;background: no-repeat -128px -109px;z-index: 4;} .box_curriculum .curriculum_bot .list_cen .next{background-position: -136px -109px;right: 400px;} .box_curriculum .curriculum_bot .list_cen .prev:hover{background-position: -144px -109px;} .box_curriculum .curriculum_bot .list_cen .next:hover{background-position: -152px -109px;} .box_curriculum .curriculum_bot .list_cen .slidebox{position: relative;top: -50px;width: 556px;height: 19px;overflow: hidden;padding-top: 46px;} .box_curriculum .curriculum_bot .more{ position: absolute; left: 0; bottom: 0; width: 100%; height: 22px; z-index: 3; } .box_curriculum .curriculum_bot .list_right{ float: right; width: 289px; height: 357px; border-left: 1px #ebeef2 solid; box-sizing: border-box; padding-left: 49px; } .box_curriculum .curriculum_bot .list_right .kb_info .hd{ width: 100%; height: 66px; position: relative; } .box_curriculum .curriculum_bot .list_right .kb_info .hd span{ display: block; font-size: 16px; color: #252b3a; line-height: 26px; font-weight: bold; margin-bottom: 8px; } /* .box_curriculum .curriculum_bot .list_right .kb_info .hd span b{color: #0067e1;margin-left: 5px;} */ .box_curriculum .curriculum_bot .list_right .kb_info .hd .select{ position: relative; float: left; width: 137px; height: 26px; font-size: 14px; color: #313131; line-height: 26px; cursor: pointer; border: 1px #e4e5ee solid; border-radius: 6px; } .box_curriculum .curriculum_bot .list_right .kb_info .hd .select dt{padding-left: 14px;font-size: 14px;} .box_curriculum .curriculum_bot .list_right .kb_info .hd .select dt i{ position: absolute; width: 8px; height: 5px; background: no-repeat; background-size: 100%; right: 14px; top: 10px; } .box_curriculum .curriculum_bot .list_right .kb_info .hd dd{ display: none; position: absolute; width: 224px; left: -28px; top: 35px; border-radius: 12px; border-top: none; box-shadow: 0 0 20px rgba(0,0,0,.07); background: #fff; padding: 12px 10px; z-index: 5; } .box_curriculum .curriculum_bot .list_right .kb_info .hd dd li{ float: left; width: 33%; text-align: center; line-height: 27px; } .box_curriculum .curriculum_bot .list_right .kb_info .hd dd li a{ font-size: 14px; color: #333; } .box_curriculum .curriculum_bot .list_right .kb_info .hd dd li a:hover{color: #0067e1;} .box_curriculum .curriculum_bot .list_right .kb_info .bd ul{ float: left; height: 260px; margin: 10px 0 0 0; overflow: hidden; } /* .box_curriculum .curriculum_bot .pm_list .list_right .kb_info .bd ul{background: no-repeat 0 0;} */ .box_curriculum .curriculum_bot .list_right .kb_info .bd ul li{ height: 100%; line-height: 22px; position: relative; } .box_curriculum .curriculum_bot .list_right .kb_info .bd ul li a{ display: block; width: 200px; font-size: 13px; color: #595959; cursor: auto; } .box_curriculum .curriculum_bot .list_right .kb_info .bd ul li a:nth-child(6){margin-top: 10px;} /* .box_curriculum .curriculum_bot .list_right .kb_info .bd ul li a:hover{color: #ff3030;} */ .box_curriculum .curriculum_bot .list_right .kb_info .bd ul li a span{width: auto !important;color: #98a3b7;} .box_curriculum .curriculum_bot .list_right .kb_info .bd ul li a em{margin: 0 6px;} .box_curriculum .curriculum_bot .list_right .kb_info .bd ul li a strong{position: relative;font-weight: normal;} .box_curriculum .curriculum_bot .list_right .kb_info .bd ul li a strong i{ position: absolute; right: -18px; top: 0; width: 12px; height: 13px; background: url(/uploads/image/2iindeximg/hot.png) no-repeat; } .box_curriculum .curriculum_bot .topleft{ width: 556px; height: 204px; } .box_curriculum .curriculum_bot .topleft h2{ font-size: 16px; color: #252b3a; font-weight: bold; line-height: 26px; } .box_curriculum .curriculum_bot .topleft p{ display: -webkit-box; display: flex; flex-wrap: wrap; width: 566px; overflow: hidden; margin-top: 15px; } .box_curriculum .curriculum_bot .topleft p span{ height: 35px; font-size: 14px; color: #595959; line-height: 35px; border-radius: 8px; border: 1px #f3f3f3 solid; padding: 0 12px; margin: 0 10px 10px 0; } .box_curriculum .abtn{ position: absolute; right: 50%; bottom: 76px; width: 198px; height: 36px; font-size: 15px; color: #fff; text-align: center; line-height: 36px; border-radius: 18px; background-color: #ff5824; margin-right: -558px; } .box_curriculum .psjtext{ position: absolute; left: 50%; bottom: 70px; width: 210px; font-size: 12px; color: #fff; line-height: 14px; margin-left: -575px; z-index: 3; } .box_curriculum .abtn:hover{background-color: #fe7c54;} /* ----------2020真项目---------- */ .box_project{background-color: #f7f7f7;padding: 0 0 116px;} .box_project .project_top{width: 1170px;margin: 0 auto;padding-bottom: 26px;} .box_project .project_top h2{ font-size: 22px; color: #252b3a; line-height: 30px; } .box_project .project_top h2 a{ position: relative; float: right; font-size: 14px; color: #ff6000; padding-right: 10px; } .box_project .project_top h2 a:after{ position: absolute; right: 0; top: 10px; width: 6px; height: 9px; background: url(/uploads/image/2iindeximg/pic.png) no-repeat -170px -274px; content: ""; } .box_project .project_top h2 a:hover{font-weight: bold;} .box_project .project_top h2 span{ font-size: 26px; color: #0067e1; font-weight: bold; margin-right: 5px; } .box_project .project_bot ol{ float: left; width: 142px; margin-left: 15px; } .box_project .project_bot ol li{ float: left; font-size: 14px; color: #666a75; line-height: 24px; margin: 14px 0 16px; } .box_project .project_bot ol li p{ font-size: 16px; color: #0067e1; } .box_project .project_bot ol li p b{font-size: 24px;} .box_project .project_bot ol li p span{position: relative;top: -12px;} .box_project .project_bot .botlist{ float: right; width: 1021px; height: 242px; border-radius: 20px; background-color: #fff; } .box_project .project_bot .botlist .picscroll-left{position: relative;} .box_project .project_bot .botlist .hd .prev,.box_project .project_bot .botlist .hd .next{position: absolute;right: 54px;top: 260px;width: 34px;height: 34px;border-radius: 50%;z-index: 6;} .box_project .project_bot .botlist .hd .prev i, .box_project .project_bot .botlist .hd .next i{display: block;width: 9px;height: 17px;background: no-repeat -140px -123px;margin: 8.5px auto 0;} .box_project .project_bot .botlist .hd .prev i{margin-left: 11.5px;} .box_project .project_bot .botlist .hd .next{right: 0;} .box_project .project_bot .botlist .hd .next i{background-position: -151px -123px;margin-left: 14px;} .box_project .project_bot .botlist .hd .prev:hover, .box_project .project_bot .botlist .hd .next:hover{background-color: #fff;} .box_project .project_bot .botlist .bd ul{padding: 30px 0 0 !important;} .box_project .project_bot .botlist .bd li{position: relative;float: left;width: 254.5px;height: 183px;border-right: 1px #f2f2f2 solid;} /* .box_project .project_bot .botlist .bd li:hover{box-shadow: 6px 6px 18px 6px rgba(55,99,170,.1);} */ .box_project .project_bot .botlist .bd li .pic{height: 34px;padding-top: 5px;} .box_project .project_bot .botlist .bd li .pic img{height: 34px;margin-left: 38px;} .box_project .project_bot .botlist .bd li .pic span{display: inline-block;max-width: 168px;height: 32px;line-height: 32px;font-size: 18px;color: #333;font-weight: bold;border-radius: 2px;background: #fff;padding: 0 8px;margin-left: 26px;} .box_project .project_bot .botlist .bd li p{font-size: 16px;color: #252b3a;font-weight: 500;height: 21px;padding: 15px 0 7px 26px;overflow: hidden;} .box_project .project_bot .botlist .bd li>span{font-size: 14px;color: #b2b6bf;padding-left: 33px;} .box_project .project_bot .botlist .bd li .mask_con {padding: 14px 34px 0;} .box_project .project_bot .botlist .bd li .mask_con h4{ height: 54px; font-size: 14px; color: #98a3b7; line-height: 18px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } .box_project .project_bot .botlist .bd li.on .mask_con h4{ height: 90px; -webkit-line-clamp: 5; } .box_project .project_bot .botlist .bd li .mask_con a{ position: relative; display: none; width: 102px; height: 36px; font-size: 14px; color: #fff; text-align: center; line-height: 35px; border-radius: 18px; background: #0d7cff; margin: 15px 0 0; padding-right: 8px; } .box_project .project_bot .botlist .bd li .mask_con a:after{ position: absolute; right: 14px; top: 12.5px; width: 5px; height: 8px; background: url(/uploads/image/2iindeximg/pic.png) no-repeat -178px -274px; content: ""; } .box_project .project_bot .botlist .bd li:hover .mask_con h4{ height: 36px; -webkit-line-clamp: 2; } .box_project .project_bot .botlist .bd li:hover .mask_con a{display: block;} .box_project .project_bot .botlist .bd li .mask_con a:hover{background: #1776e5;} .box_project .project_bot .botlist .bd li.on:hover .mask_con h4{ height: 54px; -webkit-line-clamp: 3; } /* ----------2021书籍---------- */ .box_dimensions{height: 195px;padding-top: 100px;} .box_dimensions ol{display: -webkit-box;display: flex;font-size: 0;height: 86px;text-align: center;background-color: #0071ff;margin-top: 28px;justify-content: center;} .box_dimensions ol li{ position: relative; width: 300px; height: 100%; font-size: 20px; color: rgba(255,255,255,.7); text-align: center; line-height: 60px; box-sizing: border-box; cursor: pointer; padding-top: 13px; } .box_dimensions ol li:before{ position: absolute; right: -1px; top: 13px; width: 2px; height: 60px; background-color: #137cff; content: ""; } .box_dimensions ol li:last-child:before, .box_dimensions ol li.cur:before{display: none;} .box_dimensions ol li.cur{color: #fff;background-color: #1287ff;} .box_dimensions ol li.cur:after{ position: absolute; left: 50%; bottom: -7px; border-style: solid; border-width: 7px 11px 0 11px; border-color: #1287ff transparent transparent transparent; content: ""; margin-left: -11px; } .diboxlist{ display: none; position: relative; width: 1200px; height: 500px; border-radius: 20px; background-color: #fff; margin: 0 auto; } .box_books{display: block;} .box_books .booktop{ font-size: 16px; color: #333; text-align: center; line-height: 30px; padding-top: 42px; } .box_books .booktop span{color: #ff7d2f;} .box_books .books_con .bookscon_left{ float: left; width: 1122px; height: 302px; } .box_books .books_con .bookscon_left a.more{ color: #ff671c; } .box_books .books_con .bookscon_left a.more:hover{color: #dc4900;} .box_books .books_con .bookscon_left ol{float: right;width: 108px;margin-top: 32px;} .box_books .books_con .bookscon_left ol li{ position: relative; float: left; height: 29px; font-size: 14px; color: #666; border-radius: 11px; line-height: 29px; cursor: pointer; padding: 0 12px; } .box_books .books_con .bookscon_left ol li.cur{ color: #0071ff; font-weight: bold; background-color: #ebf4ff; } .box_books .books_con .bookscon_left ol li.cur:before{ position: absolute; left: -14px; top: 10px; width: 6px; height: 11px; background: no-repeat -185px -274px; content: ""; } .box_books .books_con .bookscon_left ol li:hover{color: #0071ff;} .box_books .books_con .bookscon_left ul{ float: left; width: 975px; height: 266px; box-sizing: border-box; } .box_books .books_con .bookscon_left ul li{ float: left; width: 107px; height: 196px; margin: 54px -18px 0 64px; } .box_books .books_con .bookscon_left ul li .pic{ height: 140px; box-shadow: 0 10px 20px rgba(204,204,204,.3); overflow: hidden; } .box_books .books_con .bookscon_left ul li .pic img{ width: 100%; transition: all .5s ease; -moz-transition: all .5s ease; -webkit-transition: all .5s ease; -o-transition: all .5s ease; } .box_books .books_con .bookscon_left ul li .pic:hover img{ -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); } .box_books .books_con .bookscon_left ul li p{ font-size: 12px; color: #98a3b7; line-height: 20px; padding-top: 10px; } .boxtea .boxtea_con{ float: left; width: 1060px; height: 400px; background: no-repeat 0 151px; margin: 46px 0 0 72px; } .boxtea .boxtea_con h3, .diboxlist3 .diboxlist3_con h3{ width: 559px; font-size: 24px; color: #252b3a; text-align: center; line-height: 24px; font-weight: bold; padding: 0 0 12px; } .boxtea .boxtea_con p{ width: 559px; font-size: 16px; color: #666; line-height: 30px; } .boxtea .boxtea_con p span{color: #ff7d2f;} .boxtea .boxtea_con .teacon_right{ float: right; width: 462px; height: 380px; border-radius: 12px; background-color: #fafafa; margin-top: 19px; } .boxtea .boxtea_con .teacon_right h4{ font-size: 20px; color: #252b3a; text-align: center; line-height: 24px; font-weight: bold; padding: 46px 0 42px; } .boxtea .boxtea_con .teacon_right ul li{ float: left; width: 180px; height: 128px; font-size: 13px; color: #999; line-height: 18px; margin: 0 -14px 0 42px; } .boxtea .boxtea_con .teacon_right ul li span{ display: block; font-size: 16px; color: #666; padding-bottom: 12px; } .diboxlist3 .diboxlist3_con{ width: 1074px; height: 400px; background: no-repeat 57px 147px; padding: 39px 0 0 57px; } .diboxlist3 .diboxlist3_con h3{width: 525px;padding-bottom: 14px;} .diboxlist3 .diboxlist3_con>p{ width: 466px; font-size: 15px; color: #666; line-height: 20px; margin-left: 24px; } .diboxlist3 .diboxlist3_con .list3_right{ float: right; width: 525px; height: 398px; margin-top: 6px; } .diboxlist3 .diboxlist3_con .list3_right h4{ font-size: 20px; color: #252b3a; text-align: center; line-height: 20px; font-weight: bold; } .diboxlist3 .diboxlist3_con .list3_right .main{ width: 525px; height: 344px; border-radius: 12px; box-sizing: border-box; background-color: #f6f9ff; margin-top: 28px; padding: 23px 0 0 30px; } .diboxlist3 .diboxlist3_con .list3_right .con{ height: 299px; overflow-x: hidden; overflow-y: auto; } .diboxlist3 .diboxlist3_con .list3_right .con::-webkit-scrollbar {width: 7px;height: 1px;} .diboxlist3 .diboxlist3_con .list3_right .con::-webkit-scrollbar-thumb {width: 7px;background-color: #d6dae2;} .diboxlist3 .diboxlist3_con .list3_right .con::-webkit-scrollbar-track{width: 7px;height: 1px;background-color: #eaedf2;} .diboxlist3 .diboxlist3_con .list3_right .con h5{ font-size: 16px; color: #666; font-weight: bold; line-height: 20px; margin-bottom: 12px; } .diboxlist3 .diboxlist3_con .list3_right .con p{ overflow: hidden; margin-bottom: 12px; } .diboxlist3 .diboxlist3_con .list3_right .con p:last-child{margin-bottom: 0;} .diboxlist3 .diboxlist3_con .list3_right .con p span{ float: left; width: 33.3%; font-size: 14px; color: #999; line-height: 24px; } .diboxlist4 .list4_left{ float: left; width: 811px; height: 409px; /* background: no-repeat 0 bottom; */ margin: 50px 51px 0 61px; } .diboxlist4 .list4_left ul{ display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 17px; } .diboxlist4 .list4_left ul li{ width: 400px; height: 173px; text-align: center; line-height: 27px; border-radius: 12px; background-color: #fafafa; } .diboxlist4 .list4_left ul li:last-child{ width: 100%; height: 150px; margin-top: 10px; } .diboxlist4 .list4_left ul li h4{ font-size: 18px; color: #333; padding: 20px 0 6px; } .diboxlist4 .list4_left ul li h4 span, .diboxlist4 .list4_left ul li h5{ font-size: 14px; color: #999; } .diboxlist4 .list4_left ul li p{ display: flex; justify-content: center; font-size: 15px; color: #999; } .diboxlist4 .list4_left ul li p span{ display: block; width: 100px; height: 27px; border-radius: 10px; background-color: #fff; margin: 10px 7.5px 0; } .diboxlist4 .list4_left ul li h6{ display: flex; justify-content: center; margin-top: 12px; } .diboxlist4 .list4_left ul li h6 span{ width: 15%; font-size: 14px; color: #666; } .diboxlist4 .list4_left ul li h6 b{ font-size: 20px; color: #0071ff; } .diboxlist4 .list4_left ul li h6 em{ font-size: 14px; color: #0071ff; font-style: inherit; } .diboxlist4 .list4_left ul li h6 i{ position: relative; top: -8px; font-size: 16px; color: #0071ff; } .diboxlist4 .list4_right{ float: left; width: 228px; height: 383px; background: no-repeat 0 bottom; margin-top: 50px; } .diboxlist4 h3{ font-size: 24px; color: #252b3a; text-align: center; line-height: 24px; font-weight: bold; margin-bottom: 5px; } .diboxlist4 p{ font-size: 16px; color: #666; text-align: center; line-height: 30px; } .diboxlist4 .list4_right p{padding-top: 11px;} /* ----------2020师资团队---------- */ .box_teacher{background-color: #fff;padding: 118px 0 0;} .box_teacher .tea_con{ position: relative; height: 566px; margin: 35px auto 0; } .box_teacher .teabg1{ height: 283px; background: no-repeat center top; } .box_teacher .teabg2{ height: 283px; background: no-repeat center top; } .box_teacher .tea_con .cons{ position: absolute; left: 50%; top: 0; width: 1200px; z-index: 5; margin-left: -600px; } .box_teacher .tea_con .cons ol{ display: -webkit-box; display: flex; width: 970px; margin: 0 auto; justify-content: space-between; } .box_teacher .tea_con .cons ol li{ width: 270px; height: 140px; border-radius: 20px; background-color: #fff; margin: 143px 0 86px; } .box_teacher .tea_con .cons ol li h3{ font-size: 22px; color: #252b3a; font-weight: bold; text-align: center; line-height: 24px; padding: 26px 0 5px; } .box_teacher .tea_con .cons ol li h3 b{font-size: 26px;color: #0067e1;} .box_teacher .tea_con .cons ol li h3 span{position: relative;top: -8px;font-size: 20px;color: #0067e1;} .box_teacher .tea_con .cons ol li:nth-child(2) h3 b, .box_teacher .tea_con .cons ol li:nth-child(2) h3 span{color: #ff5f08;} .box_teacher .tea_con .cons ol li:nth-child(3) h3 b{font-size: 22px;color: #03ac7e;} .box_teacher .tea_con .cons ol li p{ font-size: 14px; color: rgba(51,51,51,.5); line-height: 28px; padding-left: 34px; } .box_teacher .tea_con .cons ol li:nth-child(1) p{padding-left: 26px;} .box_teacher .tea_con .cons ol li p span{font-size: 16px;color: #333;margin-right: 5px;} .box_teacher .tea_con .cons .slideteacher{ position: relative; height: 100%; height: 474px; } .box_teacher .tea_con .cons .bd{ width: 1200px; height: 430px; margin: 0 auto; overflow: hidden; } .box_teacher .tea_con .cons ul li{ position: relative; width: 1022px !important; height: 410px; border: 2px #fff solid; box-sizing: border-box; border-radius: 20px 20px 60px 20px; box-shadow: 0 0 18px rgba(169,169,169,.11); background: #fff no-repeat left bottom; margin: 0 89px 20px; } .box_teacher .tea_con .cons ul li .pic{ position: absolute; left: 45px; bottom: 0; width: 285px; height: 390px; overflow: hidden; } .box_teacher .tea_con .cons ul li .pic:before{ position: absolute; left: 0; bottom: 0; width: 200%; height: 100px; box-shadow: inset 0 -30px 30px -30px #fff; margin-left: -50%; content: ""; } .box_teacher .tea_con .cons ul li .pic img{width: 100%;} .box_teacher .tea_con .cons ul li .main{ position: absolute; left: 368px; top: 50%; width: 612px; transform: translate(0,-50%); } .box_teacher .tea_con .cons ul li.riglist{border-radius: 20px 20px 20px 60px;background: #fff no-repeat right bottom;} .box_teacher .tea_con .cons ul li.riglist .pic{left: auto;right: 45px;} .box_teacher .tea_con .cons ul li.riglist .main{left: 64px;} .box_teacher .tea_con .cons ul li .main h3{ font-size: 22px; color: #333; font-weight: bold; padding: 0 0 10px; } .box_teacher .tea_con .cons ul li .main .mainp1{ display: -webkit-box; display: flex; } .box_teacher .tea_con .cons ul li .main .mainp1 span{ align-items: center; display: flex; height: 28px; font-size: 13px; color: #fff; line-height: 28px; border-radius: 8px; background: #0d7cff; padding: 0 14px; margin: 0 12px 16px 2px; } .box_teacher .tea_con .cons ul li .main .mainp1 span.on{background-color: #ff732f;} .box_teacher .tea_con .cons ul li .main .mainp1 span:last-child{margin-right: 0;} .box_teacher .tea_con .cons ul li .main .mainp2{ position: relative; /* height: 52px; */ font-size: 16px; color: #0d1f39; line-height: 26px; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; padding-left: 14px; } .box_teacher .tea_con .cons ul li .main .mainp2.on{ height: 26px; -webkit-line-clamp: 1; } .box_teacher .tea_con .cons ul li .main .mainp2s{padding-left: 4px;} .box_teacher .tea_con .cons ul li .main .mainp2:before{ position: absolute; left: 0; top: 10.5px; width: 5px; height: 5px; border-radius: 50%; background: #ff5824; content: ""; } .box_teacher .tea_con .cons ul li .main .mainp3{ /* height: 48px; */ font-size: 14px; color: #666; line-height: 24px; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .box_teacher .tea_con .cons ul li .main .mainp3s{margin-top: 10px;} .box_teacher .tea_con .cons ul li .main .mainp3.on{ height: 24px; -webkit-line-clamp: 1; } .box_teacher .tea_con .cons .prev, .box_teacher .tea_con .cons .next{ position:absolute; top: 208px; width: 34px; height: 34px; border-radius: 50%; } .box_teacher .tea_con .cons .prev{left: 26px;} .box_teacher .tea_con .cons .next{right: 26px;} .box_teacher .tea_con .cons .prev:before, .box_teacher .tea_con .cons .next:before{ position: absolute; top: 8.5px; width: 9px; height: 17px; background: no-repeat -140px -123px; content: ""; } .box_teacher .tea_con .cons .prev:before{left: 11px;} .box_teacher .tea_con .cons .next:before{right: 11px;background-position-x: -151px;} .box_teacher .tea_con .cons .prev:hover, .box_teacher .tea_con .cons .next:hover{background: #fafafa;} .box_teacher .a_btn{ position: relative; display: inline-block; /* width: 232px; */ height: 47px; font-size: 15px; color: #ff671d; text-align: center; line-height: 45px; border: 1px #f0f0f0 solid; box-sizing: border-box; border-radius: 24px; padding: 0 26px 0 51px; margin-top: 22px; } .box_teacher .a_btn:before{ position: absolute; left: 20px; top: 13px; width: 20px; height: 20px; background: no-repeat -78px -305px; content: ""; } .box_teacher .a_btn:hover{color: #fff;border-color: #ff671d;background-color: #ff671d;} .box_teacher .teacher_con2{position: relative;z-index: 3;padding-top: 46px;} .box_teacher .teacher_con2 .vidbox{ width: 1200px; height: 350px; border-radius: 20px; background-color: #273759; overflow: hidden; } .box_teacher .teacher_con2 .vidbox video{opacity: .8;} .box_teacher .teacher_con2 ul{ position: relative; display: -webkit-box; display: flex; width: 1130px; z-index: 3; margin: -25px auto 0; justify-content: space-between; } .box_teacher .teacher_con2 ul li{ /* float: left; */ width: 260px; height: 130px; box-sizing: border-box; background-color: #fff; border-radius: 12px; box-shadow: 0 10px 20px rgba(0,0,0,.04); /* margin-right: 30px; */ } .box_teacher .teacher_con2 ul li span{ position: relative; display: block; height: 23px; font-size: 18px; color: #252b3a; font-weight: bold; line-height: 23px; padding: 24px 0 16px 64px; } .box_teacher .teacher_con2 ul li span:before{ position: absolute; left: 30px; top: 24px; width: 29px; height: 23px; background: no-repeat 0 -390px; content: ""; } .box_teacher .teacher_con2 ul li:nth-child(2) span:before{background-position-x: -31px;} .box_teacher .teacher_con2 ul li:nth-child(3) span:before{background-position-x: -62px;} .box_teacher .teacher_con2 ul li:nth-child(4) span:before{background-position-x: -93px;} .box_teacher .teacher_con2 ul li p{ font-size: 15px; color: #404550; padding-left: 30px; } .box_teacher .teacher_con2 ol{ display: -webkit-box; display: flex; width: 1200px; height: 100px; border-radius: 20px; box-sizing: border-box; box-shadow: 0 10px 12px rgba(0,0,0,.02); background-color: #fff; margin-top: 38px; padding-top: 18px; } .box_teacher .teacher_con2 ol li{ /* float: left; */ height: 48px; font-size: 14px; color: #98a3b7; line-height: 24px; border-left: 1px #f4f4f4 solid; padding: 9px 40px; } .box_teacher .teacher_con2 ol li span{ float: left; font-size: 16px; color: #404550; line-height: 48px; margin-right: 12px; } .box_teacher .teacher_con2 ol li p{float: left;} .box_teacher .teacher_con2 ol li:first-child{border: none;padding: 9px 38px 9px 48px;} .box_teacher .teacher_con2 ol li:first-child span{line-height: 24px;} .box_cooperation{padding: 102px 0 0;} .box_cooperation .cooperation_con .slidetion{position: relative;height: 100%;} .box_cooperation .cooperation_con .bd{ width: 1042px; height: 362px; /* border-radius: 12px; */ /* box-shadow: 0 6px 24px 0 rgba(227,237,245,.73); */ /* background: #fff; */ overflow: hidden; margin: 26px auto 0; } .box_cooperation .cooperation_con ul li{ position: relative; height: 362px; overflow: hidden; } .box_cooperation .cooperation_con ul li .pic{ float: left; width: 450px; height: 281px; border-radius: 14px; overflow: hidden; margin: 31px 42px 0 60px; } .box_cooperation .cooperation_con ul li .pic img{width: 100%;} .box_cooperation .cooperation_con ul li .main{ position: absolute; left: 552px; top: 50%; width: 426px; transform: translate(0,-55%); } .box_cooperation .cooperation_con ul li .main h3{ font-size: 20px; color: #262d3c; font-weight: bold; padding: 0 0 10px; } .box_cooperation .cooperation_con ul li .main .mainp1 span{ display: inline-block; height: 28px; font-size: 13px; color: #616161; line-height: 28px; border-radius: 4px; background: #ebf8ff; padding: 0 14px; margin: 0 12px 20px 2px; } .box_cooperation .cooperation_con ul li .main .mainp2{ position: relative; font-size: 15px; color: #262d3c; line-height: 32px; padding-left: 18px; } .box_cooperation .cooperation_con ul li .main .mainp2:before{ position: absolute; left: 6px; top: 13.5px; width: 5px; height: 5px; border-radius: 50%; background: #ff6300; content: ""; } .box_cooperation .cooperation_con ul li .main .mainp3{ position: relative; font-size: 14px; color: #999; line-height: 18px; margin-top: 18px; padding-left: 75px; } .box_cooperation .cooperation_con ul li .main .mainp3 img{ position: absolute; left: 0; top: 50%; margin-top: -15px; } .box_cooperation .cooperation_con .prev, .box_cooperation .cooperation_con .next{ position:absolute; top: 50%; width: 34px; height: 34px; border-radius: 50%; margin-top: -17px; } .box_cooperation .cooperation_con .prev{left: 26px;} .box_cooperation .cooperation_con .next{right: 26px;} .box_cooperation .cooperation_con .prev:before, .box_cooperation .cooperation_con .next:before{ position: absolute; top: 8.5px; width: 9px; height: 17px; background: no-repeat -140px -123px; content: ""; } .box_cooperation .cooperation_con .prev:before{left: 11px;} .box_cooperation .cooperation_con .next:before{right: 11px;background-position-x: -151px;} .box_cooperation .cooperation_con .prev:hover, .box_cooperation .cooperation_con .next:hover{background: #fafafa;} .box_cooperation .cooperationbg1{ display: block; margin: 8px auto 87px; } .box_cooperation .a_btn{width: 253px;} /* 七大子品牌 */ .businessbox{padding: 30px 0 70px;} .businessbox_con{ position: relative; width: 1260px; margin: 20px 0 0 -30px; } .businessbox .businessbox_con img{display: block;} .businessbox .businessbox_con .logos{ position: absolute; transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; -o-transition: all .3s ease; } .businessbox .businessbox_con .logoshm{left: 192px;top: 105px;} .businessbox .businessbox_con .logosdt{left: 131px;top: 248px;} .businessbox .businessbox_con .logoszz{left: 189px;top: 398px;} .businessbox .businessbox_con .logosyxb{left: 1006px;top: 107px;} .businessbox .businessbox_con .logosczh{left: 920px;top: 245px;} .businessbox .businessbox_con .logosbxg{left: 1040px;top: 242px;} .businessbox .businessbox_con .logoskdy{left: 980px;top: 385px;} .businessbox .businessbox_con .logos:hover{margin-top: -5px;} /* ----------不一样的城市,一样的传智播客--------- */ .box_school{ width: 100%; height: 773px; box-sizing: border-box; padding: 76px 0 0; background: no-repeat center top; } .box_school .box_hd h2{color: #fff;} .box_school .box-top img{margin-left: 190px;} .box_school .school_con{ width: 100%; margin-top: 44px; } .box_school .school_con .schoolcon_left{ width: 1200px; height: 453px; box-sizing: border-box; border-radius: 20px; box-shadow: inset 0 0 35px #8fc0ff; background: #fff; margin: 41px auto 0; } .box_school .school_con .schoolcon_right{ position: relative; margin-top: 12px; } .box_school .school_con .schoolcon_right .schoolxq{ height: 15px; cursor: pointer; } .box_school .school_con .schoolcon_right .schoolxq .schoolxqbot p{ font-size: 0; color: #3390ff; } .box_school .school_con .schoolcon_right .schoolxq .schoolxqbot span{ position: relative; display: inline-block; font-size: 15px; height: 35px; color: #fff; line-height: 35px; border-radius: 8px; padding: 0 15px; margin: 0 3px; } .box_school .school_con .schoolcon_right .schoolxq .schoolxqbot span:after{ position: absolute; right: -.5px; top: 10px; width: 1px; height: 15px; background-color: #3390ff; content: ""; } .box_school .school_con .schoolcon_right .schoolxq .schoolxqbot span:hover{color: #0070e5;background-color: #fff;} .box_school .school_con .schoolcon_right .schoolxq .schoolxqbot span.schoolxq_on{ position: relative; color: #0070e5; background-color: #fff; } .box_school .school_con .schoolcon_right .schoolxq .schoolxqbot span.schoolxq_on:after, .box_school .school_con .schoolcon_right .schoolxq .schoolxqbot span:last-child:after, .box_school .school_con .schoolcon_right .schoolxq .schoolxqbot span:hover:after{display: none;} .box_school .school_con .schoolcon_left .topxk{position: relative;height: 224px;} .box_school .school_con .schoolcon_left .topxk .btn{ position: absolute; left: 696px; top: 144px; width: 110px; height: 36px; font-size: 14px; color: #fff; text-align: center; line-height: 36px; border-radius: 18px; box-sizing: border-box; background: #0067e1; padding-right: 8px; } .box_school .school_con .schoolcon_left .topxk .btn:hover{background-color: #2783ef;} .box_school .school_con .schoolcon_left .topxk .btn.on{top: 170px;} .box_school .school_con .schoolcon_left .topxk .btn:after{ position: absolute; right: 14px; top: 14px; width: 5px; height: 8px; background: no-repeat -178px -274px; content: ""; } .box_school .school_con .schoolcon_left .topxk .btn2{ left: 821px; background: #ff5824; } .box_school .school_con .schoolcon_left .topxk .btn2:hover{background-color: #fa7147;} .box_school .school_con .schoolcon_left .topxk ul li{display: none;overflow: hidden;} .box_school .school_con .schoolcon_left .topxk ul li.xqdz_on{display: block;} .box_school .school_con .schoolcon_left .topxk ul li .xqdz_tit{ float: left; width: 100%; position: relative; box-sizing: border-box; padding: 42px 0 20px 64px; } .box_school .school_con .schoolcon_left .topxk ul li .xqdz_tit span{ font-size: 18px; color: #3c3c3c; line-height: 20px; font-weight: bold; } .box_school .school_con .schoolcon_left .topxk ul li .xqxk{ float: left; display: -webkit-box; display: flex; width: 636px; /* height: 142px; */ margin-left: 60px; flex-wrap: wrap; } .box_school .school_con .schoolcon_left .topxk ul li .xqxk a{ /* float: left; */ height: 34px; line-height: 34px; padding: 0 16px; background: #fff; font-size: 14px; color: #3d485d; border: 1px #eee solid; border-radius: 8px; margin: 0 13px 13px 0; } .box_school .school_con .schoolcon_left .topxk ul li .xqxk a:hover{ height: 36px; color: #fff; border: none; background-color: #309bff; padding: 0 17px; } .box_school .school_con .schoolcon_left .topxk ul li div{ float: left; position: relative; width: 480px; } .box_school .school_con .schoolcon_left .topxk ul li div:before{ position: absolute; left: 4px; top: -42px; font-size: 18px; color: #3c3c3c; font-weight: bold; content: "校区地址"; } .box_school .school_con .schoolcon_left .topxk ul li div h2{ font-size: 14px; color: #d72502; margin-bottom: 5px; } .box_school .school_con .schoolcon_left .topxk ul li div p{ font-size: 14px; color: #898c99; line-height: 26px; } .box_school .school_con .schoolcon_left .topxk ul li div .sjbtnindex, .box_school .school_con .schoolcon_left .topxk ul li div .sjbtnindex2, .box_school .school_con .schoolcon_left .topxk ul li div .sjbtnindex3{ display: none; width: 361px; height: 127px; box-sizing: border-box; background: no-repeat 0 0; margin-top: 50px; } .box_school .school_con .schoolcon_left .topxk ul li div .sjbtnindex2{font-size: 12px !important;color: #656f80;padding-left: 6px;} .box_school .school_con .schoolcon_left .topxk ul li div .sjbtnindex3{cursor: default;font-size: 12px !important;color: #656f80;padding: 110px 0 0 6px;background-image: ;} .box_school .school_con .schoolcon_left .topxk ul li div .sjbtnindex span, .box_school .school_con .schoolcon_left .topxk ul li div .sjbtnindex2 span{ display: block !important; font-size: 16px; color: #fff; padding: 37px 0 51px 50px; } .box_school .school_con .schoolcon_left .topxk ul li div .sjbtnindex:hover span, .box_school .school_con .schoolcon_left .topxk ul li div .sjbtnindex2:hover span{font-weight: bold;} .box_school .school_con .schoolcon_bot{ float: left; width: 100%; overflow: hidden; } .box_school .school_con .schoolcon_bot .school_box{ position: relative; width: 1200px; margin: 0 auto; height: 190px; box-sizing: border-box; padding: 0 0 0 30px; } .box_school .school_con .schoolcon_bot .school_box .bd{ width: 1114px; height: 190px; overflow: hidden; } .box_school .school_con .schoolcon_bot .school_box .bd ul{width: 5000px;} .box_school .school_con .schoolcon_bot .school_box .schoolbg{ position: absolute; right: 54px; top: -40px; width: 140px; height: 279px; box-shadow: inset -90px 0 60px -18px #fff; } .box_school .school_con .schoolcon_bot .school_box .bd ul li{ float: left; height: 190px; border-radius: 20px; overflow: hidden; margin-right: 10px; } .box_school .school_con .schoolcon_bot .school_box .bd ul li img{height: 100%;} .box_school .school_con .schoolcon_bot .school_box .prev, .box_school .school_con .schoolcon_bot .school_box .next{ position: absolute; top: 54px; right: 16px; width: 30px; height: 30px; border-radius: 50%; /* box-shadow: 8px 8px 15px 0 rgba(193,200,214,.2); */ /* background: #fff; */ z-index: 5; } .box_school .school_con .schoolcon_bot .school_box .next{top: 112px;} .box_school .school_con .schoolcon_bot .school_box .prev i, .box_school .school_con .schoolcon_bot .school_box .next i{ display: block; width: 9px; height: 17px; background: no-repeat -140px -123px; margin: 6.5px auto; } .box_school .school_con .schoolcon_bot .school_box .next i{background-position-x: -151px;margin-left: 11px;} .box_school .school_con .schoolcon_bot .school_box .prev:hover, .box_school .school_con .schoolcon_bot .school_box .next:hover{background-color: #f4f9ff;} .box_school .school_con .schoolcon_bot .school_box .cura{display: none;} .box_school .school_con .schoolcon_bot .school_box.cur .cura{ position: absolute; display: block; right: 30px; top: 0; width: 271px; height: 190px; border-radius: 20px; overflow: hidden; } .box_school .school_con .schoolcon_bot .school_box.cur .cura:before{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.6); content: ""; } .box_school .school_con .schoolcon_bot .school_box.cur .cura span{ position: absolute; left: 50%; top: 50%; width: 190px; height: 46px; font-size: 15px; color: #fff; text-align: center; line-height: 46px; border-radius: 24px; box-sizing: border-box; background: rgba(255,255,255,.2); transform: translate(-50%, -50%); padding-right: 10px; z-index: 3; } .box_school .school_con .schoolcon_bot .school_box.cur .cura span:after{ position: absolute; right: 18px; top: 18px; width: 7px; height: 11px; background: no-repeat -184px -287px; content: ""; } .box_school .school_con .schoolcon_bot .school_box.cur .cura:hover:before{display: none;} /* .box_school .school_con .schoolcon_bot .school_box.cur .cura:hover span{border-color: rgba(208,246,255,.9);background: rgba(208,246,255,.9);} */ .box_school .school_con .schoolcon_bot .school_box.curcp .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.cursy .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curwh .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curzz .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curgz .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curszzl .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curszcw .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curxm .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curcs .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curhz .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curtj .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.cursh .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curxa .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curjn .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curcq .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curnj .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.cursjz .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curcd .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curhf .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.curty .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.cursy .cura{background: no-repeat;} .box_school .school_con .schoolcon_bot .school_box.cur .bd{width: 784px;} .box_school .school_con .schoolcon_bot .school_box.cur .schoolbg{right: 384px;} .box_school .school_con .schoolcon_bot .school_box.cur .prev, .box_school .school_con .schoolcon_bot .school_box.cur .next{right: 343px;} .box_itczh{padding-top: 90px;} .box_itczh .itczh_con{padding-top: 58px;} .box_itczh .itczh_con .itczhcon_left{ position: relative; float: left; width: 500px; height: 300px; border: 2px #fff solid; box-sizing: border-box; background: -moz-linear-gradient(to bottom , #f3f5f8, #fff); background: linear-gradient(to bottom, #f3f5f8,#fff); border-radius: 4px; box-shadow: 6px 6px 18px 0 rgba(55,99,170,.06), -6px -6px 18px 0 rgba(255,255,255,.7); } .box_itczh .itczh_con .itczhcon_left .itczhpic1{ margin: 38px 0 14px 37px; } .box_itczh .itczh_con .itczhcon_left p{ font-size: 16px; color: #333; line-height: 26px; padding: 0 74px; } .box_itczh .itczh_con .itczhcon_left p span{font-weight: bold;} .box_itczh .itczh_con .itczhcon_right{ float: right; width: 680px; height: 300px; box-sizing: border-box; background: #fff; border-radius: 4px; box-shadow: 6px 6px 18px 0 rgba(55,99,170,.06), -6px -6px 18px 0 rgba(255,255,255,.7); overflow: hidden; } .box_itczh .itczh_con .itczhcon_right ul{ width: 682px; } .box_itczh .itczh_con .itczhcon_right ul li{ position: relative; float: left; width: 340px; height: 150px; border-right: 1px #f5f5f5 solid; border-bottom: 1px #f5f5f5 solid; cursor: pointer; overflow: hidden; } .box_itczh .itczh_con .itczhcon_right ul li p{ font-size: 18px; color: #252b3a; line-height: 22px; padding-top: 65px; } .box_itczh .itczh_con .itczhcon_right ul li p i{ float: left; width: 21px; height: 22px; background: no-repeat 0 -250px; margin: 0 2px 0 118px; } .box_itczh .itczh_con .itczhcon_right ul li:nth-child(2) p i{background-position-x: -23px;} .box_itczh .itczh_con .itczhcon_right ul li:nth-child(3) p i{background-position-x: -46px;} .box_itczh .itczh_con .itczhcon_right ul li:nth-child(4) p i{background-position-x: -69px;} .box_itczh .itczh_con .itczhcon_right ul li img{ position: absolute; left: 0; top: 0; display: none; } .box_itczh .itczh_con .itczhcon_right ul li:nth-child(1) img{display: block;} /* 旋转 */ @-webkit-keyframes circle-inner{ 0%{-webkit-transform:rotate(0deg)}6.25%{-webkit-transform:rotate(-45deg)}12.5%{-webkit-transform:rotate(-45deg)}18.75%{-webkit-transform:rotate(-90deg)}25%{-webkit-transform:rotate(-90deg)}31.25%{-webkit-transform:rotate(-135deg)}37.5%{-webkit-transform:rotate(-135deg)}43.75%{-webkit-transform:rotate(-180deg)}50%{-webkit-transform:rotate(-180deg)}56.25%{-webkit-transform:rotate(-225deg)}62.5%{-webkit-transform:rotate(-225deg)}68.75%{-webkit-transform:rotate(-270deg)}75%{-webkit-transform:rotate(-270deg)}81.25%{-webkit-transform:rotate(-315deg)}87.5%{-webkit-transform:rotate(-315deg)}93.75%{-webkit-transform:rotate(-360deg)}100%{-webkit-transform:rotate(-360deg)} } @-moz-keyframes circle-inner{ 0%{-webkit-transform:rotate(0deg)}6.25%{-webkit-transform:rotate(-45deg)}12.5%{-webkit-transform:rotate(-45deg)}18.75%{-webkit-transform:rotate(-90deg)}25%{-webkit-transform:rotate(-90deg)}31.25%{-webkit-transform:rotate(-135deg)}37.5%{-webkit-transform:rotate(-135deg)}43.75%{-webkit-transform:rotate(-180deg)}50%{-webkit-transform:rotate(-180deg)}56.25%{-webkit-transform:rotate(-225deg)}62.5%{-webkit-transform:rotate(-225deg)}68.75%{-webkit-transform:rotate(-270deg)}75%{-webkit-transform:rotate(-270deg)}81.25%{-webkit-transform:rotate(-315deg)}87.5%{-webkit-transform:rotate(-315deg)}93.75%{-webkit-transform:rotate(-360deg)}100%{-webkit-transform:rotate(-360deg)} } @-o-keyframes circle-inner{ 0%{-webkit-transform:rotate(0deg)}6.25%{-webkit-transform:rotate(-45deg)}12.5%{-webkit-transform:rotate(-45deg)}18.75%{-webkit-transform:rotate(-90deg)}25%{-webkit-transform:rotate(-90deg)}31.25%{-webkit-transform:rotate(-135deg)}37.5%{-webkit-transform:rotate(-135deg)}43.75%{-webkit-transform:rotate(-180deg)}50%{-webkit-transform:rotate(-180deg)}56.25%{-webkit-transform:rotate(-225deg)}62.5%{-webkit-transform:rotate(-225deg)}68.75%{-webkit-transform:rotate(-270deg)}75%{-webkit-transform:rotate(-270deg)}81.25%{-webkit-transform:rotate(-315deg)}87.5%{-webkit-transform:rotate(-315deg)}93.75%{-webkit-transform:rotate(-360deg)}100%{-webkit-transform:rotate(-360deg)} } @keyframes circle-inner{ 0%{-webkit-transform:rotate(0deg)}6.25%{-webkit-transform:rotate(-45deg)}12.5%{-webkit-transform:rotate(-45deg)}18.75%{-webkit-transform:rotate(-90deg)}25%{-webkit-transform:rotate(-90deg)}31.25%{-webkit-transform:rotate(-135deg)}37.5%{-webkit-transform:rotate(-135deg)}43.75%{-webkit-transform:rotate(-180deg)}50%{-webkit-transform:rotate(-180deg)}56.25%{-webkit-transform:rotate(-225deg)}62.5%{-webkit-transform:rotate(-225deg)}68.75%{-webkit-transform:rotate(-270deg)}75%{-webkit-transform:rotate(-270deg)}81.25%{-webkit-transform:rotate(-315deg)}87.5%{-webkit-transform:rotate(-315deg)}93.75%{-webkit-transform:rotate(-360deg)}100%{-webkit-transform:rotate(-360deg)} }