/*公共样式*/ html{color:#000;background:#fff;overflow-x:hidden;} body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;} table{border-collapse:collapse;border-spacing:0;} fieldset,img{border:0;} address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;} ol,ul,li{list-style:none;} caption,th{text-align:left;} h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;} q:before,q:after{content:'';} abbr,acronym{border:0;font-variant:normal;} sup{vertical-align:text-top;} sub{vertical-align:text-bottom;} input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;outline: none;} input,textarea,select{*font-size:100%;outline: none;}legend{color:#000;} textarea {resize:none;} a{text-decoration:none;} a{ border:none; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color:transparent; outline:none; } .clearfix:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;} .clearfix{*zoom:1;} body{font-family:"microsoft yahei";} html, body { position: relative; height: 100%; } body { /*font-family: helvetica neue, helvetica, arial, sans-serif;*/ font-size: 14px; color:#000; margin: 0; padding: 0; } .swiper-container { width: 100%; height: 100%; } .swiper-slide { text-align: center; font-size: 18px; background: #fff; /* center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } /*导航部分*/ a{cursor:pointer;text-decoration:none;color:inherit;} a:focus,a:hover{text-decoration:none; color: #1c7ec1;} li,p,ul{margin:0;padding:0;list-style:none} .h5online-top{height: 60px; background: #333d49; text-align: center;width:100%;} .h5online-wrap-content{width: 1120px; margin:0 auto; text-align: left; position: relative;} h1,h2{margin-top:0;} h1.com-logo{background: url(/uploads/image/zhimages/logo.png) 0 center no-repeat; width: 172px; height: 60px; font-size: 0; color:#e34f27; text-indent: -10000px; float: left;} .h5online-top ul{float: left; margin-left: 15px; height: 60px;} .h5online-top ul li{float: left; font-size: 16px; background: url(/uploads/image/zhimages/nav_list_left.png) left 0 no-repeat; padding-left: 16px;} .h5online-top ul li a{color: #fff; background: url(/uploads/image/zhimages/nav_list_right.png) right 0 no-repeat #ffffff; line-height: 60px; height: 60px; display: block; padding: 0 20px; padding-right: 36px;} .home-link{float: right; background: url(/uploads/image/zhimages/icon_home.png) left center no-repeat; padding-left: 36px; line-height: 60px; color: #fff;font-size: 15px;} .study{float: left;padding-left: 40px; line-height: 60px; color: #fff;font-size: 18px;} /*.h5online-top .dt{width:103px;}*/ .p-nav{width: 1000px;margin: 0 auto;} .p-nav>.sidebar{position: fixed;top: 400px;margin-left: 1054px;z-index: 99999;font-size:25px;display:none;} /*主题部分*/ .banner{background: center 0px no-repeat;height:885px;overflow:hidden;position:relative;z-index:2;} .banner .wrap1{width:100%;margin:0 auto;height:100%;position:relative;} .banner .wrap1>div:nth-of-type(1){width:149px;height:73px;background: no-repeat;position:absolute;top:225px;left:0px;} .banner .wrap1>div:nth-of-type(2){width:150px;height:72px;background: no-repeat;position:absolute;top:250px;right:0px;} .banner .wrap1>div:nth-of-type(3){width:102px;height:49px;background: no-repeat;position:absolute;right:117px;top:390px;} .banner .wrap3{width:1200px;margin:0 auto;height:100%;position:relative;} .banner .wrap3>div:nth-of-type(1){width:413px;height:110px;background: no-repeat;display:none;position:absolute;top:94px;left:476px;} .banner .wrap3>div:nth-of-type(2){width:962px;height:104px;position:absolute;top:201px;left:152px;} .banner .wrap3>div:nth-of-type(3){width:716px;height:56px;background: no-repeat;display:none;position:absolute;top:322px;left:289px;} .banner .wrap3>div:nth-of-type(4){width:250px;height:54px;background: no-repeat;display:none;position:absolute;top:502px;left:742px;} .banner .wrap3>div:nth-of-type(4) a{display:block;height:54px;} .banner .wrap3 .mxy_lamp{width:155px;height:200px;position:absolute;left:7px;top:592px;} /*banner 云动部分*/ /*第一朵云*/ .banner .wrap1 .cloud1{ -webkit-animation:cloone 8s linear infinite; -moz-animation:cloone 8s linear infinite; -ms-animation:cloone 8s linear infinite; -o-animation:cloone 8s linear infinite; animation:cloone 8s linear infinite; } -webkit-@keyframes cloone{ 0%{top:225px;left:0px;} 50%{top:225px;left:30px;} 100%{top:225px;left:0px;} } -moz-@keyframes cloone{ 0%{top:225px;left:0px;} 50%{top:225px;left:30px;} 100%{top:225px;left:0px;} } -o-@keyframes cloone{ 0%{top:225px;left:0px;} 50%{top:225px;left:30px;} 100%{top:225px;left:0px;} } @keyframes cloone{ 0%{top:225px;left:0px;} 50%{top:225px;left:30px;} 100%{top:225px;left:0px;} } /*第二朵云*/ .banner .wrap1 .cloud2{ -webkit-animation:clotwo 8s linear infinite; -moz-animation:clotwo 8s linear infinite; -ms-animation:clotwo 8s linear infinite; -o-animation:clotwo 8s linear infinite; animation:clotwo 8s linear infinite; } -webkit-@keyframes clotwo{ 0%{top:250px;right:0px;} 50%{top:250px;right:30px;} 100%{top:250px;right:0px;} } -moz-@keyframes clotwo{ 0%{top:250px;right:0px;} 50%{top:250px;right:30px;} 100%{top:250px;right:0px;} } -o-@keyframes clotwo{ 0%{top:250px;right:0px;} 50%{top:250px;right:30px;} 100%{top:250px;right:0px;} } @keyframes clotwo{ 0%{top:250px;right:0px;} 50%{top:250px;right:30px;} 100%{top:250px;right:0px;} } /*第三朵云*/ .banner .wrap1 .cloud3{ -webkit-animation:clothr 10s linear infinite; -moz-animation:clothr 10s linear infinite; -ms-animation:clothr 10s linear infinite; -o-animation:clothr 10s linear infinite; animation:clothr 10s linear infinite; } -webkit-@keyframes clothr{ 0%{top:390px;right:117px;} 50%{top:390px;right:87px;} 100%{top:390px;right:117px;} } -moz-@keyframes clothr{ 0%{top:390px;right:117px;} 50%{top:390px;right:87px;} 100%{top:390px;right:117px;} } -o-@keyframes clothr{ 0%{top:390px;right:117px;} 50%{top:390px;right:87px;} 100%{top:390px;right:117px;} } @keyframes clothr{ 0%{top:390px;right:117px;} 50%{top:390px;right:87px;} 100%{top:390px;right:117px;} } .ban_fbig{position:relative;} .ban_fbig>span{display:inline-block;position:absolute;} .ban_fbig>span:nth-of-type(1){width:97px;height:87px;background: no-repeat;left:0px;top:12px;} .ban_fbig>span:nth-of-type(2){width:93px;height:80px;background: no-repeat;left:94px;top:11px;} .ban_fbig>span:nth-of-type(3){width:199px;height:83px;background: no-repeat;left:186px;top:11px;} .ban_fbig>span:nth-of-type(4){width:99px;height:95px;background: no-repeat;left:383px;top:0px;} .ban_fbig>span:nth-of-type(5){width:95px;height:98px;background: no-repeat;left:481px;top:0px;z-index:2;} .ban_fbig>span:nth-of-type(6){width:124px;height:93px;background: no-repeat;left:567px;top:10px;} .ban_fbig>span:nth-of-type(7){width:100px;height:90px;background: no-repeat;left:676px;top:15px;z-index:2;} .ban_fbig>span:nth-of-type(8){width:97px;height:87px;background: no-repeat;left:774px;top:13px;} .ban_fbig>span:nth-of-type(9){width:99px;height:83px;background: no-repeat;left:863px;top:10px;z-index:3;} .ban_fbig span,#ban_fsm{display:none;} /*banner 运动的车*/ .banner .part3{transform-style:preserve-3d;perspective:100px;} .car{width:165px;height:122px;background: no-repeat;position:absolute;top:656px;left:315px;transform-origin: 50% 50% 0;-webkit-animation:carrun 4s linear 1;-moz-animation:carrun 4s linear 1;-ms-animation:carrun 4s linear 1;-o-animation:carrun 4s linear 1;animation:carrun 4s linear 1;} -webkit-@keyframes carrun{ 0%{width:0%;top:600px;left:596px;-webkit-transform:scale(0);-o-transform:scale(0);-ms-transform:scale(0);-moz-transform:scale(0);transform:scale(0);} 20%{width:20%;top:600px;left:478px;-webkit-transform:scale(0.3);-o-transform:scale(0.3);-ms-transform:scale(0.3);-moz-transform:scale(0.3);transform:scale(0.3);} /* 40%{width:40%;top:590px;left:450px;-webkit-transform:scale(0.6);-o-transform:scale(0.6);-ms-transform:scale(0.6);-moz-transform:scale(0.6);transform:scale(0.6);} 60%{width:60%;top:590px;left:410px;-webkit-transform:scale(0.6);-o-transform:scale(0.6);-ms-transform:scale(0.6);-moz-transform:scale(0.6);transform:scale(0.6);} 80%{width:80%;top:590px;left:420px;-webkit-transform:scale(0.9);-o-transform:scale(0.9);-ms-transform:scale(0.9);-moz-transform:scale(0.9);transform:scale(0.9);} 100%{width:100%;top:656px;left:315px;-webkit-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);-moz-transform:scale(1);transform:scale(1);}*/ } -moz-@keyframes carrun{ 0%{width:0%;top:600px;left:596px;-webkit-transform:scale(0);-o-transform:scale(0);-ms-transform:scale(0);-moz-transform:scale(0);transform:scale(0);} 20%{width:20%;top:600px;left:478px;-webkit-transform:scale(0.3);-o-transform:scale(0.3);-ms-transform:scale(0.3);-moz-transform:scale(0.3);transform:scale(0.3);} /*40%{width:40%;top:590px;left:450px;-webkit-transform:scale(0.6);-o-transform:scale(0.6);-ms-transform:scale(0.6);-moz-transform:scale(0.6);transform:scale(0.6);} 60%{width:60%;top:590px;left:410px;-webkit-transform:scale(0.6);-o-transform:scale(0.6);-ms-transform:scale(0.6);-moz-transform:scale(0.6);transform:scale(0.6);} 80%{width:80%;top:590px;left:420px;-webkit-transform:scale(0.9);-o-transform:scale(0.9);-ms-transform:scale(0.9);-moz-transform:scale(0.9);transform:scale(0.9);} 100%{width:100%;top:656px;left:315px;-webkit-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);-moz-transform:scale(1);transform:scale(1);}*/ } -o-@keyframes carrun{ 0%{width:0%;top:600px;left:596px;-webkit-transform:scale(0);-o-transform:scale(0);-ms-transform:scale(0);-moz-transform:scale(0);transform:scale(0);} 20%{width:20%;top:600px;left:478px;-webkit-transform:scale(0.3);-o-transform:scale(0.3);-ms-transform:scale(0.3);-moz-transform:scale(0.3);transform:scale(0.3);} /* 40%{width:40%;top:590px;left:450px;-webkit-transform:scale(0.6);-o-transform:scale(0.6);-ms-transform:scale(0.6);-moz-transform:scale(0.6);transform:scale(0.6);} 60%{width:60%;top:590px;left:410px;-webkit-transform:scale(0.6);-o-transform:scale(0.6);-ms-transform:scale(0.6);-moz-transform:scale(0.6);transform:scale(0.6);} 80%{width:80%;top:590px;left:420px;-webkit-transform:scale(0.9);-o-transform:scale(0.9);-ms-transform:scale(0.9);-moz-transform:scale(0.9);transform:scale(0.9);} 100%{width:100%;top:656px;left:315px;-webkit-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);-moz-transform:scale(1);transform:scale(1);}*/ } @keyframes carrun{ 0%{width:0%;top:600px;left:596px;-webkit-transform:scale(0);-o-transform:scale(0);-ms-transform:scale(0);-moz-transform:scale(0);transform:scale(0);} 20%{width:20%;top:600px;left:478px;-webkit-transform:scale(0.3);-o-transform:scale(0.3);-ms-transform:scale(0.3);-moz-transform:scale(0.3);transform:scale(0.3);} /*40%{width:40%;top:590px;left:450px;-webkit-transform:scale(0.6);-o-transform:scale(0.6);-ms-transform:scale(0.6);-moz-transform:scale(0.6);transform:scale(0.6);} 60%{width:60%;top:590px;left:410px;-webkit-transform:scale(0.6);-o-transform:scale(0.6);-ms-transform:scale(0.6);-moz-transform:scale(0.6);transform:scale(0.6);} 80%{width:80%;top:590px;left:420px;-webkit-transform:scale(0.9);-o-transform:scale(0.9);-ms-transform:scale(0.9);-moz-transform:scale(0.9);transform:scale(0.9);} 100%{width:100%;top:656px;left:315px;-webkit-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);-moz-transform:scale(1);transform:scale(1);}*/ } /*第一部分*/ .part1{background: center 0px no-repeat;height:849px;/*background-size:100%;*/overflow:hidden;} #snowzone{position:fixed;top:0;left:0;height:100%;} #footer{width:100%;height:80px;font-size:16px;color:white;line-height:80px;text-align:center;background-color:#3589e1;position:relative;z-index:2;} .part1_wrap{width:1200px;height:614px;margin:118px auto;position:relative;} .part1 .title1{width:452px;height:77px;margin:0 auto;position:absolute;top:0px;left:371px;} .part1 .title1 img{width:100%;} .part1_detail{position:absolute;left:122px;top:179px;} .part1_detail li{float:left;width:226px;height:219px;margin-right:21px;position: relative;overflow:hidden;border-right:none; border-bottom:none;} .part1_detail li:nth-of-type(2){margin-top:31px;} .part1_detail li:nth-of-type(4){width:222px;height:219px;margin-right:0px;margin-top:31px;} .part1_detail li img{width:100%;} .part1_5{width:641px;height:155px;background: no-repeat;position:absolute;left:276px;top:458px;/*visibility:hidden;*/} .part1_detail li .border_top,.part1_detail li .border_right,.part1_detail li .border_bottom,.part1_detail li .border_left,.part1_detail li .border_left4,.part1_detail li .border_top4,.part1_detail li .border_right4,.part1_detail li .border_bottom4{ position:absolute;} .part1_detail li .border_top{height:2px;width:222px;font-size:0;background-color:#ffc90e;top:0px;left:-222px;} .part1_detail li .border_top4{height:2px;width:222px;font-size:0;background-color:white;top:0px;left:-222px;} .part1_detail li .border_right{height:219px;width:2px;font-size:0;background-color:#ffc90e;bottom:-219px;right:0;} .part1_detail li .border_right4{height:219px;width:2px;font-size:0;background-color:white;bottom:-219px;right:0;} .part1_detail li .border_bottom{height:2px;width:222px;font-size:0;background-color:#ffc90e;right:-222px;bottom:0;} .part1_detail li .border_bottom4{height:2px;width:222px;font-size:0;background-color:white;right:-222px;bottom:0;} .part1_detail li .border_left{height:219px;width:2px;font-size:0;background-color:#ffc90e;left:4px;top:-219px;} .part1_detail li .border_left4{height:219px;width:2px;font-size:0;background-color:white;left:0px;top:-219px;} /*第二部分*/ .part2{background: center 0px no-repeat;height:852px;/*background-size:100%;*/overflow:hidden;position:relative;z-index:2;} .part2_wrap{width:100%;height:100%;margin:0 auto;position:relative;} .part2_wrap>div:nth-of-type(1){position:absolute;left:0px;top:204px;width:71px;height:24px;background: no-repeat;} .part2_wrap>div:nth-of-type(2){position:absolute;left:60px;top:210px;width:117px;height:45px;background: no-repeat;} .part2_wrap2{width:1200px;height:679px;margin:0 auto;} .part2 .title2{width:534px;height:76px;margin:0 auto;padding-top:138px;} .part2 .title2 img{width:100%;} .part2_detail ul{width:1086px;margin:0 auto;margin-top:57px;} .part2_detail ul li{width:240px;height:224px;float:left;margin-right:42px;} .part2_detail ul li:nth-of-type(1){background-color:#f68939;} .part2_detail ul li:nth-of-type(2){background-color:#f48135;} .part2_detail ul li:nth-of-type(3){background-color:#f1702a;} .part2_detail ul li:nth-of-type(4){background-color:#f06825;margin-right:0px;} .part2_detail ul li p:nth-of-type(1){width:104px;height:34px;margin-left:13px;margin-top:14px;} .part2_detail ul li strong{color:#fff600;font-size:18px;margin-top:14px;display:block;} .part2_detail ul li p:nth-of-type(2){width:212px;margin:0 auto;color:white;font-size:14px;line-height:24px;text-align:left;margin-top:7px;} .part2_3{width:121px;height:168px;background: no-repeat;margin-top:35px;margin-left:538px;} .part2_2 ol{width:721px;margin:0 auto;margin-top:-31px;} .part2_2 ol li{width:144px;height:144px;float:left;margin-right:48px;-webkit-border-radius:50%;-moz-border-radius:50%;-o-border-radius:50%;-ms-border-radius:50%;border-radius:50%;} .part2_2 ol li:nth-of-type(4){margin-right:0px;} .part2_2 .sticker-shadow {opacity: 0.6;} .part2_2 .example_1 .sticker-img{background: no-repeat;} .part2_2 .example_2 .sticker-img{background: no-repeat;} .part2_2 .example_3 .sticker-img{background: no-repeat;} .part2_2 .example_4 .sticker-img{background: no-repeat;} /*第二部分云动部分*/ /*第一朵云*/ .part2 .part2_wrap .cloud1,.part4 .part4_wrap .cloud1,.part6 .part6_wrap .cloud1{ -webkit-animation:cdone 8s linear infinite; -moz-animation:cdone 8s linear infinite; -ms-animation:cdone 8s linear infinite; -o-animation:cdone 8s linear infinite; animation:cdone 8s linear infinite; } -webkit-@keyframes cdone{ 0%{top:204px;left:0px;} 50%{top:204px;left:20px;} 100%{top:204px;left:0px;} } -moz-@keyframes cdone{ 0%{top:204px;left:0px;} 50%{top:204px;left:20px;} 100%{top:204px;left:0px;} } -o-@keyframes cdone{ 0%{top:204px;left:0px;} 50%{top:204px;left:20px;} 100%{top:204px;left:0px;} } @keyframes cdone{ 0%{top:204px;left:0px;} 50%{top:204px;left:20px;} 100%{top:204px;left:0px;} } /*第二朵云*/ .part2 .part2_wrap .cloud2,.part4 .part4_wrap .cloud2,.part6 .part6_wrap .cloud2{ -webkit-animation:cdtwo 10s linear infinite; -moz-animation:cdtwo 10s linear infinite; -ms-animation:cdtwo 10s linear infinite; -o-animation:cdtwo 10s linear infinite; animation:cdtwo 10s linear infinite; } -webkit-@keyframes cdtwo{ 0%{top:210px;left:60px;} 50%{top:210px;left:10px;} 100%{top:210px;left:60px;} } -moz-@keyframes cdtwo{ 0%{top:210px;left:60px;} 50%{top:210px;left:10px;} 100%{top:210px;left:60px;} } -o-@keyframes cdtwo{ 0%{top:210px;left:60px;} 50%{top:210px;left:10px;} 100%{top:210px;left:60px;} } @keyframes cdtwo{ 0%{top:210px;left:60px;} 50%{top:210px;left:10px;} 100%{top:210px;left:60px;} } /*硬币掉落*/ @keyframes mysnow { 0% { bottom: 100%; opacity: 0; } 50% { opacity: 1; transform: rotate(360deg); } 100% { transform: rotate(0deg); opacity: 0; bottom: 0; } } @-webkit-keyframes mysnow { 0% { bottom: 100%; opacity: 0; } 50% { opacity: 1; -webkit-transform: rotate(360deg); } 100% { -webkit-transform: rotate(0deg); opacity: 0; bottom: 0; } } @-moz-keyframes mysnow { 0% { bottom: 100%; opacity: 0; } 50% { opacity: 1; -moz-transform: rotate(360deg); } 100% { -moz-transform: rotate(0deg); opacity: 0; bottom: 0; } } @-ms-keyframes mysnow { 0% { bottom: 100%; opacity: 0; } 50% { opacity: 1; -ms-transform: rotate(360deg); } 100% { -ms-transform: rotate(0deg); opacity: 0; bottom: 0; } } @-o-keyframes mysnow { 0% { bottom: 100%; opacity: 0; } 50% { opacity: 1; -o-transform: rotate(360deg); } 100% { -o-transform: rotate(0deg); opacity: 0; bottom: 0; } } .roll { position: absolute; opacity: 0; animation: mysnow 3s; -webkit-animation: mysnow 3s; -moz-animation: mysnow 53; -ms-animation: mysnow 3s; -o-animation: mysnow 3s; height: auto; } .div { position: fixed; } /*第三部分*/ .part3{background: center 0px no-repeat;height:850px;/*background-size:100%;*/overflow:hidden;position: relative;} .part3_wrap{width:100%;height:100%;margin:0 auto;position:relative;} .part3_wrap>div:nth-of-type(1){position:absolute;left:0px;top:202px;width:186px;height:53px;background: no-repeat;} /*第三部分第一朵云*/ .part3 .part3_wrap .cloud,.part5 .part5_wrap .cloud,.part7 .part7_wrap .cloud{ -webkit-animation:cudone 8s linear infinite; -moz-animation:cudone 8s linear infinite; -ms-animation:cudone 8s linear infinite; -o-animation:cudone 8s linear infinite; animation:cudone 8s linear infinite; } -webkit-@keyframes cudone{ 0%{top:210px;left:0px;} 50%{top:210px;left:60px;} 100%{top:210px;left:0px;} } -moz-@keyframes cudone{ 0%{top:210px;left:0px;} 50%{top:210px;left:60px;} 100%{top:210px;left:0px;} } -o-@keyframes cudone{ 0%{top:210px;left:0px;} 50%{top:210px;left:60px;} 100%{top:210px;left:0px;} } @keyframes cudone{ 0%{top:210px;left:0px;} 50%{top:210px;left:60px;} 100%{top:210px;left:0px;} } .part3 .part3_wrap2{width:1200px;height:100%;margin:0 auto;position:relative;} .part3 .part3_wrap2 .title3{padding-top:93px;} .video1_wrap{margin-top:73px;margin-left:139px;width:330px;height:458px;padding-top:8px;position:relative;overflow:hidden;} .video1{width:305px;height:395px;background: no-repeat;position:relative;margin-left:11px;} .play{width:86px;height:84px;background: no-repeat;display:block;position:absolute;} .video1 .play{left:116px;top:175px;} .video1_p{width:305px;height:50px;background-color:#40a6ed;margin-left:11px;} .video1_p p{width:259px;color:white;font-size:14px;line-height:20px;margin:0 auto;text-align:left;padding-top:4px;} /*按钮部分*/ .part3 .btn_to{position:absolute;left:559px;top:287px;width:450px;height:71px;border:1px solid white;-webkit-border-radius:4px;-moz-border-radius:4px;-o-border-radius:4px;-ms-border-radius:4px;border-radius:4px;} .part3 .btn{width:437px;height:59px;position: relative;overflow: hidden;z-index: 1;cursor: pointer;background-color:#f52d66;-webkit-border-radius:4px;-moz-border-radius:4px;-o-border-radius:4px;-ms-border-radius:4px;border-radius:4px;margin:6px auto;} .part3 .btn-content{width: 100%;height: 100%;line-height:59px;text-align:center;font-size:24px;font-weight: 400;position: relative;z-index: 999;transition: .3s ease-in-out;-webkit-border-radius:4px;-moz-border-radius:4px;-o-border-radius:4px;-ms-border-radius:4px;border-radius:4px;} .part3 .btn-content a{color:white;} /*视频部分*/ .video2_wrap{width:570px;height:280px;position:absolute;left:517px;top:425px;overflow:hidden;padding-top:9px;} .video2{width:549px;height:220px;background: no-repeat;position:relative;margin-left:9px;} .video2_p{width:549px;height:51px;background-color:#40a6ed;margin-left:9px;} .video2_p p{width:549px;color:white;font-size:14px;line-height:51px;text-align:center;} .video2 .play{left:221px;top:72px;} .video1_wrap .border_topl,.video2_wrap .border_topt,.video1_wrap .border_bottoml,.video2_wrap .border_bottomt,.video1_wrap .border_leftl,.video2_wrap .border_leftt,.video1_wrap .border_rightl,.video2_wrap .border_rightt{position:absolute;font-size:0;background-color:#ffffff;} .video1_wrap .border_topl{height:1px;width:329px;top:0px;left:-329px;} .video2_wrap .border_topt{height:1px;width:570px;top:0px;left:-570px;} .video1_wrap .border_bottoml{height:1px;width:329px;bottom:0px;right:-329px;} .video2_wrap .border_bottomt{height:1px;width:570px;bottom:0px;right:-570px;} .video1_wrap .border_leftl{height:466px;width:1px;left:0px;top:-466px;} .video2_wrap .border_leftt{height:289px;width:1px;left:0px;top:-289px;} .video1_wrap .border_rightl{height:466px;width:1px;right:0px;bottom:-466px;} .video2_wrap .border_rightt{height:289px;width:1px;right:0px;bottom:-289px;} /*视频播放部分*/ #black{width:100%;height:6917px;display:none;position:absolute;left:0;top:0;background-color:rgba(0,0,0,0.6);overflow:hidden;z-index:20;} #quit{width:100%;height:188px;position:fixed;color:#646464;cursor:pointer;line-height:227px;left:0;top:0;font-size:94px;z-index:100;display:none;background:rgba(0,0,0,0.8);text-align:right;} .lines1{position:absolute;width:20px;height:516px;left:77px;top:226px;} .lines2{position:absolute;width:424px;height:20px;left:62px;top:716px;} .lines3{position:absolute;width:20px;height:512px;left:477px;top:214px;} .lines4{position:absolute;width:593px;height:20px;left:486px;top:204px;} .line1,.line2,.line3,.line4{background-color:#ffffff;} .line1{width:1px;height:516px;margin-left:9px;} .line2{width:424px;height:1px;margin-top:9px;} .line3{width:1px;height:512px;margin-left:9px;} .line4{width:593px;height:1px;margin-top:9px;} .lines3 .triangle-up {position:absolute;left:0px;top:48px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:17px solid #ffffff;} .lines1 .triangle-down {position:absolute;left:0px;top:0px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:17px solid #ffffff;} .lines2 .triangle-right {position:absolute;left:373px;top:0px;width:0;height:0;border-top:10px solid transparent;border-bottom: 10px solid transparent;border-left: 17px solid #fbfb62;} .lines4 .triangle-right2 {position:absolute;left:577px;top:0px;width:0;height:0;border-top:10px solid transparent;border-bottom: 10px solid transparent;border-left: 17px solid #ffffff;} /*第四部分:更多服务保证*/ .part4{background: center 0px no-repeat;height:847px;/*background-size:100%;*/overflow:hidden;position:relative;z-index:2;} .part4_wrap{width:100%;height:100%;margin:0 auto;position:relative;} .part4_wrap>div:nth-of-type(1){position:absolute;left:0px;top:204px;width:71px;height:24px;background: no-repeat;} .part4_wrap>div:nth-of-type(2){position:absolute;left:60px;top:210px;width:117px;height:45px;background: no-repeat;} .part4_wrap2{width:1200px;height:100%;margin:0 auto;} .part4 .title4{width:540px;height:94px;margin:0 auto;padding-top:90px;} .part4 .title4 img{width:100%;} .part4_detail{width:1027px;margin:0 auto;} .part4_wrap2 ul{margin-top:74px;} .part4_wrap2 li{width:1027px;height:125px;margin-bottom:58px;} .part4_wrap2 li:nth-of-type(3){margin-bottom:0px;} .part4_wrap2 li div:nth-of-type(1){width:230px;height:124px;background-color:#862e47;float:left;} .part4_wrap2 li .part4_p{float:left;width:738px;color:white;font-size:16px;text-align:left;padding:28px 28px 21px 18px;line-height:36px;border-right:1px dashed #ffffff;border-top:1px dashed #ffffff;border-bottom:1px dashed #ffffff;} .part4_wrap2 li div img{margin-top:24px;} .part4_wrap2 li div span{font-size:20px;color:white;display:block;margin-top:8px;} /*第五部分:课程精细化*/ .part5{background: center 0px no-repeat;height:851px;/*background-size:100%;*/overflow:hidden;position:relative;z-index:2;} .part5_wrap{width:100%;height:100%;margin:0 auto;position:relative;} .part5_wrap>div:nth-of-type(1){position:absolute;left:0px;top:202px;width:186px;height:53px;background: no-repeat;} .part5 .part5_wrap2{width:1200px;height:100%;margin:0 auto;position:relative;} .part5 .part5_wrap2 .title5{padding-top:93px;} .part5_wrap2 ul{width:1154px;margin:0 auto;margin-top:45px;} .part5_wrap2 li{width:272px;height:482px;float:left;background: no-repeat;margin-right:21px;} .part5_wrap2 li:nth-of-type(4){margin-right:0px;} .part5_wrap2 li span{width:257px;display:block;color:white;font-size:20px;line-height:36px;text-align:center;padding-top:18px;} .part5_wrap2 li div{margin-left:22px;width:238px;margin-top:24px;} .part5_wrap2 li strong{color:#ffea00;font-size:20px;text-align:left;display:block;margin-bottom:2px;} .part5_wrap2 li div p{font-size:16px;color:white;line-height:28px;text-align:left;} /*按钮部分*/ .part5 .btn_to{position:absolute;left:415px;top:727px;width:365px;height:68px;border:1px solid white;-webkit-border-radius:4px;-moz-border-radius:4px;-o-border-radius:4px;-ms-border-radius:4px;border-radius:4px;} .part5 .btn{width:352px;height:53px;position: relative;overflow: hidden;z-index: 1;cursor: pointer;background-color:#f52d66;-webkit-border-radius:4px;-moz-border-radius:4px;-o-border-radius:4px;-ms-border-radius:4px;border-radius:4px;margin:6px auto;} .part5 .btn-content{width: 100%;height: 100%;line-height:53px;text-align:center;font-size:24px;font-weight: 400;position: relative;z-index: 999;transition: .3s ease-in-out;-webkit-border-radius:4px;-moz-border-radius:4px;-o-border-radius:4px;-ms-border-radius:4px;border-radius:4px;} .part5 .btn-content a{color:white;} /*第六部分:讲师介绍*/ .part6{background: center 0px no-repeat;height:850px;/*background-size:100%;*/overflow:hidden;position:relative;z-index:2;} .part6_wrap{width:100%;height:100%;margin:0 auto;position:relative;} .part6_wrap>div:nth-of-type(1){position:absolute;left:0px;top:204px;width:71px;height:24px;background: no-repeat;} .part6_wrap>div:nth-of-type(2){position:absolute;left:60px;top:210px;width:117px;height:45px;background: no-repeat;} .part6_wrap2{width:1200px;height:100%;margin:0 auto;} .part6 .title6{width:540px;height:94px;margin:0 auto;padding-top:70px;} .part6 .title6 img{width:100%;} .fl{float:left;} .fr{float:right;} .part6_wrap2 .fl{width:369px;position:relative;margin-top:120px;margin-left:80px;} .part6_wrap2 .fl div{width:240px;height:430px;position:absolute;} .part6_wrap2 .fl div:nth-of-type(1){left:0px;top:0px;} .part6_wrap2 .fl div:nth-of-type(2){left:144px;top:8px;} .part6_wrap2 .fr{width:740px;margin-top:76px;} .part6_wrap2 .fr p{color:white;font-size:18px;line-height:36px;width:627px;margin:0 auto;text-align:left;} .part6_wrap2 .fr span{display:block;width:91px;height:36px;line-height:36px;background-color:#d8ff00;margin-bottom:3px;color:#00b3b3;margin-left:59px;-webkit-border-radius:4px;-moz-border-radius:4px;-o-border-radius:4px;-ms-border-radius:4px;border-radius:4px;} .part6_wrap2 .fr>p{font-size:20px;margin-top:69px;} .part6_wrap2 .fr>div{position:relative;} .part6_wrap2 .fr>div img{position:absolute;} .part6_wrap2 .fr>div img:nth-of-type(1){left:0;top:10px;} .part6_wrap2 .fr>div img:nth-of-type(2){left:142px;top:0px;} .part6_wrap2 .fr>div img:nth-of-type(3){left:611px;top:10px;} /*第七部分:常见问题*/ .part7{background: center 0px no-repeat;height:853px;/*background-size:100%;*/overflow:hidden;position:relative;z-index:2;} .part7_wrap{width:100%;height:100%;margin:0 auto;position:relative;} .part7_wrap>div:nth-of-type(1){position:absolute;left:0px;top:202px;width:186px;height:53px;background: no-repeat;} .part7 .part7_wrap2{width:1200px;height:100%;margin:0 auto;position:relative;} .part7 .part7_wrap2 .title7{padding-top:93px;} .part7_wrap2 p{font-size:18px;color:white;line-height:30px;text-align:left;width:1114px;} .part7_wrap2 ul{width:1156px;margin-left:44px;margin-top:27px;} .part7_wrap2 li span{display:inline-block;width:30px;height:39px;float:left;margin-right:10px;} .part7_wrap2 li div:nth-of-type(2){margin-top:6px;margin-bottom:16px;} .part7_wrap2 li div:nth-of-type(3){margin-bottom:20px;margin-left:3px;} .part7_wrap2 li div:nth-of-type(1) span{background: 0px 4px no-repeat;height:34px;} .part7_wrap2 li div:nth-of-type(2) span{background: 0px 4px no-repeat;} .part7_wrap2 li div:nth-of-type(3){width:1096px;height:1px;background-color:white;} /*按钮部分*/ .part7 .btn_to{position:absolute;left:415px;top:696px;width:365px;height:68px;border:1px solid white;-webkit-border-radius:4px;-moz-border-radius:4px;-o-border-radius:4px;-ms-border-radius:4px;border-radius:4px;} .part7 .btn{width:352px;height:53px;position: relative;overflow: hidden;z-index: 1;cursor: pointer;background-color:#f52d66;-webkit-border-radius:4px;-moz-border-radius:4px;-o-border-radius:4px;-ms-border-radius:4px;border-radius:4px;margin:6px auto;} .part7 .btn-content{width: 100%;height: 100%;line-height:53px;text-align:center;font-size:24px;font-weight: 400;position: relative;z-index: 999;transition: .3s ease-in-out;-webkit-border-radius:4px;-moz-border-radius:4px;-o-border-radius:4px;-ms-border-radius:4px;border-radius:4px;} .part7 .btn-content a{color:white;} #fullpage-nav span, .fullpage-slidesnav span{border:2px solid white;background-color:white;} #fullpage-nav li .active span, .fullpage-slidesnav .active span{background-color:rgba(0,0,0,0);} /*底部悬浮*/ /*设置浮动和清除浮动*/ .fl{ float:left;} .fr{ float:right;} .clear{ clear:both;} .fixed_foot{ width:100%; height:70px; background:rgba(40,40,40,0.84); position:fixed; bottom:0px; left:0px; z-index:999999999;min-width:1200px;} .fixed_foot_1200{ width:1200px; margin:0 auto; height:80px;} .fixed_foot_l{ height:auto; overflow:hidden;} .fixed_foot_l ul{ position:relative; height:80px;} .fixed_foot_l ul li{ margin-right:97px; float:left;} .fixed_foot_l ul li .thebg{ margin-top:15px; margin-right:14px; width:43px; height:43px; float:left} .fixed_foot_l ul li .thebg01{ background:url(/uploads/image/zhimg/fixed_foot_01.png) 0 0 no-repeat;} .fixed_foot_l ul li .thebg02{ background:url(/uploads/image/zhimg/fixed_foot_02.png) 0 0 no-repeat;} .fixed_foot_l ul li .thebg03{ background:url(/uploads/image/zhimg/fixed_foot_03.png) 0 0 no-repeat;} .fixed_foot_l ul li .thebg04{ background:url(/uploads/image/zhimg/fixed_foot_04.png) 0 0 no-repeat;} .fixed_foot_l ul li .thebg05{ background:url(/uploads/image/zhimg/fixed_foot_05.png) 0 0 no-repeat;} .fixed_foot_l ul li .thebg01.active{ background:url(/uploads/image/zhimg/fixed_foot_01_act.png) 0 0 no-repeat;} .fixed_foot_l ul li .thebg02.active{ background:url(/uploads/image/zhimg/fixed_foot_02_act.png) 0 0 no-repeat;} .fixed_foot_l ul li .thebg03.active{ background:url(/uploads/image/zhimg/fixed_foot_03_act.png) 0 0 no-repeat;} .fixed_foot_l ul li .thebg04.active{ background:url(/uploads/image/zhimg/fixed_foot_04_act.png) 0 0 no-repeat;} .fixed_foot_l ul li .thebg05.active{ background:url(/uploads/image/zhimg/fixed_foot_05_act.png) 0 0 no-repeat;} .fixed_foot_wz{ font-size:14px; color:#fff; margin-top:18px;} .fixed_foot_wz.active{ color:#36a8ff;} .fixed_foot_r{ width:126px; height:43px; line-height:42px; text-align:center; color:#ffffff; border-radius:5px; background:#f2a633; margin-top:15px; font-size:16px; cursor:pointer;} .fixed_foot_r img{ vertical-align:middle; margin-right:6px;display: inline-block;} .top_one .w1{width: 600px;height: 390px;} .top_one .w2{width: 300px;height: 390px;} /*弹窗*/ .themask{ width:100%; height:100%; background:#000;filter:alpha(opacity=35); -moz-opacity:0.35;opacity:0.35; position:fixed; left:0;top:0; z-index:19; display:none} .thepop{ width:596px; height:323px; background:#fff;-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius:5px; position:fixed; top:0; left:50%; margin-left:-298px; z-index:20; display:none; } .thepop .close{ background:url(/uploads/image/zhimg/thepop_close.png) 0 0 no-repeat; width:60px; height:54px; position:absolute; right:-21px;top:-21px; cursor:pointer} .thepop .tit{ color:#007ee6; font-size:18px; text-align:center; line-height:123px; height:98px;} .thepop .cont{ width:369px; margin:0 auto} .thepop .cont li{ float:left; margin:0 12px; font-size:15px; color:#393f5b; text-align:center; width:99px;} .thepop .cont li .thebg{ width:48px; height:48px; margin:0 auto} .thepop .cont li .bg01{ background:url(/uploads/image/zhimg/thepop_cont_img01.png) 0 0 no-repeat} .thepop .cont li .bg02{ background:url(/uploads/image/zhimg/thepop_cont_img02.png) 0 0 no-repeat} .thepop .cont li .bg03{ background:url(/uploads/image/zhimg/thepop_cont_img03.png) 0 0 no-repeat} .thepop .cont li p{ line-height:40px;font-size: 14px;} .thepop .cont li img{ display:block;} .thepop h2{ color:#393f5b; font-size:18px; text-align:center; height:67px; line-height:53px; text-align:center} .thepop .thebtn{ position:absolute; width:126px; height:34px; text-align:center; line-height:34px; font-size:16px;} .thepop .thebtn01{ background:url(/uploads/image/zhimg/thepop_thebth01.png) 0 0 no-repeat; left:148px; top:253px; color:#f0f2f7;} .thepop .thebtn02{ background:url(/uploads/image/zhimg/thepop_thebth02.png) center 0 no-repeat; height:55px;left:317px; top:253px; color:#4f5362; cursor:pointer} /*左侧悬浮*/ .ni_left{ position:fixed; left:0;top:50%; height:580px; margin-top:-278px; z-index:10;-webkit-box-shadow:0.7px 0.7px 27px 0 rgba(39, 40, 42, 0.15); -moz-box-shadow: 0.7px 0.7px 27px 0 rgba(39, 40, 42, 0.15); box-shadow:0.7px 0.7px 27px 0 rgba(39, 40, 42, 0.15);} .ni_left li{ background:#ffffff; font-size:13px; color:#4f5362;} .ni_left li a{width:79px; height:83px; display:block; overflow:hidden;} .ni_left li i{ font-size:24px; color:#00abf7; margin:24px auto 0; display:block; width:24px;} .ni_left li p{ line-height:28px; text-align:center; font-size:12px;} .ni_left li:hover{ background:#00abf7} .ni_left li:hover i{color:#ffffff;} .ni_left li:hover a{color:#ffffff;} .ni_left li.active{ background:#00abf7} .ni_left li.active i{color:#ffffff;} .ni_left li.active a{color:#ffffff;} @media screen and (max-width: 1366px) { .ni_left{ position:fixed; left:0;top:50%; height:475px; margin-top:-227px; z-index:10;-webkit-box-shadow:0.7px 0.7px 27px 0 rgba(39, 40, 42, 0.15); -moz-box-shadow: 0.7px 0.7px 27px 0 rgba(39, 40, 42, 0.15); box-shadow:0.7px 0.7px 27px 0 rgba(39, 40, 42, 0.15);} .ni_left li{ background:#ffffff; font-size:10px; color:#4f5362;} .ni_left li a{width:65px; height:68px; display:block; overflow:hidden;} .ni_left li i{ font-size:20px; color:#00abf7; margin:20px auto 0; display:block; width:20px;} .ni_left li p{ line-height:23px; text-align:center;font-size:10px;} .ni_left li:hover{ background:#00abf7} .ni_left li:hover i{color:#ffffff;} .ni_left li:hover a{color:#ffffff;} .ni_left li.active{ background:#00abf7} .ni_left li.active i{color:#ffffff;} .ni_left li.active i.i01{} .ni_left li.active a{color:#ffffff;} }