@charset "UTF-8"; /* 两屏滚动 */ .body_home{ height:100%; position: relative; } .body_b { width: 100%; position: fixed; left: 0%; top: 100%; bottom: 0; right: 0; background: #fff; overflow: hidden; transition: top 0.7s cubic-bezier(0.5,0,0.2,1) 0s; z-index: 77; overflow-x: hidden; overflow-y: auto; outline: none; } .body_b.showdiv { top: 0; padding-top: 1.36rem; } .home body { height: 100%; overflow: hidden; padding: 0; } header.mobile{ background: #15a0bf; box-shadow: 0 0 10px 2px rgba(0,0,0,0.3); animation: 0.8s ease .3s 1 normal backwards running fadeInDown2; } .mobile .nav ul>li ol{ background: rgba(255,255,255,1); box-shadow: 0 0 5px 2px rgba(0,0,0,0.05); } .mobile .nav ul>li ol a{ color: #15a0bf; } header.mobile::before{ display: none; } /* banner */ .banner{ position: relative; animation: 0.8s ease .3s 1 normal backwards running fadeInUp; } .banner .news_images img{ display: block; width: 100%; height: 100vh; object-fit: cover; transform: scale(1.2); transition: opacity 0.3s ease, transform 0s ease 1s; } .banner .slick-active .news_images img { -webkit-transform: scale(1); transform: scale(1); transition: all 5s cubic-bezier(0, .56, .44, 1); } .banner::before{ display: block; content: ""; width: 28%; height: 0.6rem; background: #f3f7f8; position: absolute; left: 0; bottom: 0; z-index: 66; } .banner::after{ display: block; content: ""; border-left: 0.2rem solid #f3f7f8; border-bottom: 0.3rem solid #f3f7f8; border-right: 0.2rem solid transparent; border-top: 0.3rem solid transparent; position: absolute; left: 28%; bottom: 0; z-index: 66; } .banner .slick-dots{ width: 1500px; right: 50%; bottom: 0.25rem; transform: translate(50%,0); display: flex; justify-content: flex-start; align-items: center; z-index: 77; } .banner .slick-dots li{ width: 0.1rem; height: 0.1rem; margin-right: 0.15rem; position: relative; } .banner .slick-dots li:last-of-type{ margin-right: 0; } .banner .slick-dots li button,.banner .slick-dots li button:before{ width: 0.1rem; height: 0.1rem; } .banner .slick-dots li button:before { border-radius: 0.1rem; content: ''; opacity: 1; background: #333333; transform: translate(-50%,-50%); z-index: 10; } .banner .slick-dots li.slick-active,.banner .slick-dots li.slick-active button,.banner .slick-dots li.slick-active button:before{ width: 0.28rem; } .banner .slick-dots li.slick-active button:before{ background: #159fbe; } /* 栏目标题 */ .lmTit{ display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.3rem; } .lmTit h2{ font-size: 0.4rem; color: #333333; line-height: 1; font-weight: normal; } .lmTit h2 span{ font-size: 0.16rem; color: #999999; font-weight: normal; line-height: 0.2rem; margin-left: 5px; } .lmTit a{ font-size: 0.16rem; line-height: 0.3rem; color: #666666; } .lmTit a:hover{ color: #15a0bf; } .img{ position: relative; overflow: hidden; } .img img{ display: block; width: 100%; /* height: 100%;*/ object-fit: cover; position: absolute; left: 0; top: 0; transition: all .3s; } .bg1{ padding: 0.9rem 0; background: #f3f7f8; position: relative; } .bg1 .w1500{ position: relative; z-index: 9; } .bg1::after{ display: block; content: ""; width: 100%; height: 100%; background: url(../img/bg1_1.png) no-repeat left bottom; background-size: auto 55%; position: absolute; left: 0; top: 0; } .bg1::before{ display: block; content: ""; width: 100%; height: 100%; background: url(../img/bg1_2.png) no-repeat right bottom; background-size: 40% auto; position: absolute; right: 0; top: 0; } .aboutCon{ width: 62%; background: #ffffff url(../img/aboutBg.png) no-repeat right bottom; padding: 0.6rem; box-sizing: border-box; margin-top: 0.4rem; } .aboutCon h2{ font-size: 0.26rem; line-height: .4rem; font-weight: normal; color: #333333; } .aboutCon h2 span{ display: block; font-size: 0.16rem; line-height: 0.3rem; color: #999999; } .aboutCon .con{ margin: 0.7rem 0; position: relative; } .aboutCon .con::before{ display: block; content: ""; width: 16px; height: 3px; background: #000000; position: absolute; left: 0; top: -0.2rem; } .aboutCon .con p{ font-size: 0.16rem; line-height: 0.3rem; color: #666666; } .aboutCon a.more{ position: relative; z-index: 9; display: block; width: 1.2rem; } .aboutCon a.more span{ display: block; width: 1.2rem; font-size: 0.16rem; line-height: 0.36rem; text-align: center; color: #ffffff; background: #129fbd; position: relative; z-index: 9; cursor: pointer; } .aboutCon a.more::after{ display: block; content: ""; width: 100%; height: 100%; background: #88cfde; position: absolute; left: -5px; top: -5px; z-index: -1; } .aboutCon a.more:hover{ transform: translate(5px,-5px); } .about{ position: relative; } .aboutImg{ width: 38%; height: 100%; position: absolute; right: 0; top: 0; } .aboutImg img{ display: block; width: 100%; height: 100%; object-fit: cover; } /* ztzl */ .bg6{ padding: 1.2rem 0 1rem; background: #f4f9fd url(../img/bg6.png) no-repeat center bottom; } .ztzl{ margin-top: 0.6rem; } .ztzl ul li{ float: left; width: 23.5%; margin-right: 2%; } .ztzl ul li:nth-of-type(4n){ margin-right: 0; } .ztzl ul li a{ display: block; width: 100%; padding: 50.5% 0 0; } .ztzl ul li a:hover img{ transform: scale(1.2); } .bg3{ padding: 0.8rem 0; background: #f3f7f8 url(../img/bg3.png) no-repeat center bottom; background-size: 100% auto; } .new { display: flex; flex-wrap: wrap; justify-content: space-between; } .new .newSub{ width: 48.5%; } div.newSub a{ display: block; width: 100%; height: auto; position: relative; } div.newSub a p.img{ width: 100%; padding: 59% 0 0; } div.newSub a p.con{ width: 100%; padding: 0.15rem 0.3rem; display: flex; justify-content: space-between; background: #ffffff; box-sizing: border-box; } div.newSub a p.con span{ font-size: 0.18rem; line-height: 0.5rem; color: #333333; } div.newSub a p.con span:nth-of-type(2){ color: #999999; } div.newSub a p.con span:nth-of-type(1){ padding-left: 0.65rem; display: inline-block; box-sizing: border-box; position: relative; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 80%; } div.newSub a p.con span:nth-of-type(1)::before{ display: block; content: ""; width: 0.45rem; height: 0.45rem; border: 1px solid #e5e5e5; border-radius: 100%; background: #ffffff url(../img/timeIcon2.png) no-repeat center; background-size: 60% auto; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } div.newSub a p.time{ width: 0.98rem; height: auto; background: #1396b4; position: absolute; left: 0.3rem; top: 0; color: #ffffff; font-size: 0.18rem; line-height: 1.25; text-align: center; } div.newSub a p.time span{ display: block; font-size: 0.4rem; font-weight: bold; } div.newSub a p.time::before{ display: block; content: ""; border-top: 0.25rem solid #1396b4; border-bottom: 0 solid transparent; border-left: 0.49rem solid transparent; border-right: 0.49rem solid transparent; position: absolute; left: 0; top: 100%; } div.newSub a:hover img{ transform: scale(1.2); } div.newSub a:hover .con span{ color: #15a0bf; } .newSub .newImg a{ display: flex; width: 100%; justify-content: space-between; align-items: center; padding-bottom: 0.42rem; border-bottom: 1px dashed #d9d9d9; margin-bottom: 0.15rem; } .newSub .newImg p.img{ width: 35%; padding: 1.86rem 0 0; background: #afdae3; overflow:inherit; } .newSub .newImg p.img img{ left: 0.12rem; top: 0.12rem; } .newSub .newImg p.con { width: 65%; padding-left: 0.42rem; box-sizing: border-box; } .newSub .newImg p.con span{ display: block; } .newSub .newImg p.con span:nth-of-type(1){ font-size: 0.2rem; line-height: 0.3rem; color: #000000; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .newSub .newImg p.con span:nth-of-type(2){ font-size: 0.16rem; line-height: 0.3rem; color: #666666; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 0.2rem 0; } .newSub .newImg p.con span:nth-of-type(3){ font-size: 0.18rem; line-height: 0.3rem; color: #999999; padding-left: 0.65rem; position: relative; } .newSub .newImg p.con span:nth-of-type(3)::before{ display: block; content: ""; width: 0.45rem; height: 0.45rem; border: 1px solid #e5e5e5; border-radius: 100%; background: #ffffff url(../img/timeIcon2.png) no-repeat center; background-size: 60% auto; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .newSub .newImg a:hover span:nth-of-type(1){ color: #1396b4; } .newSub .newImg a:hover span:nth-of-type(2){ color: #333333; } .newSub .newList a{ display: block; width: 100%; font-size: 0.18rem; line-height: 0.44rem; color: #333333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-left: 0.2rem; position: relative; box-sizing: border-box; } .newSub .newList a::before{ display: block; content: ""; width: 0.08rem; height: 0.08rem; border-radius: 100%; background: #c2c6c6; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .newSub .newList a span{ color: #999999; margin-left: 5px; } .newSub .newList a:hover{ color: #1396b4; } .newSub .newList a:hover::before{ background: #1396b4; } .bg4{ background: url(../img/bg4.png) no-repeat top center; background-size: 100% 60%; padding: 0.8rem 0; } .bg4 .lmTit h2,.bg4 .lmTit h2 span,.bg4 .lmTit a{ color: #ffffff; } .notice{ background: #ffffff; padding: 0.2rem 0.5rem; box-sizing: border-box; border-bottom: 5px solid #15a0bf; } .notice ul li{ width: 32%; } .notice ul div.slick-slide { display: flex; justify-content: space-between; flex-wrap: wrap; } .notice li a{ display: block; } .notice li a .time{ font-size: 0.16rem; line-height: 1; color: #666666; } .notice li a .time span{ font-size: 0.4rem; color: #333333; font-weight: bold; } .notice li a .con{ font-size: 0.18rem; line-height: 0.3rem; color: #333333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 10px 0; } .notice li a .con span{ font-size: 0.16rem; color: #999999; margin-left: 5px; } .notice li a:hover .time,.notice li a:hover .con,.notice li a:hover .time span,.notice li a:hover .con span{ color: #15a0bf; } .notice .slick-dots{ position: static; width: 100%; box-sizing: border-box; display: flex; justify-content: space-between; } .notice .slick-dots li { width: 32%; height: auto; position: relative; } .notice .slick-dots{ overflow: hidden; position: relative; bottom: inherit; } .notice .slick-dots::before{ display: block; content: ""; width: 100%; height: 1px; background: #bdbdbd; position: absolute; left: 0; top: 50%; } .notice .slick-dots li button{ width: 0.12rem; height: 0.12rem; background: #fff; border: 1px solid #bdbdbd; border-radius: 100%; position: relative; } .notice .slick-dots li button::before{ content: ""; width: 0.06rem; height: 0.06rem; opacity: 1; border-radius: 100%; background: #bdbdbd; } .notice .slick-dots li.slick-active button{ border: 1px solid #15a0bf; } .notice .slick-dots li.slick-active button::before{ background: #15a0bf; } .bg5{ background: url(../img/bg5.png) no-repeat right center; padding-bottom: 1rem; } .bg5 .lmTit{ margin-bottom: 0.5rem; } .bg5 .w1500{ position: relative; } .teacherTab .tabIn{ position: absolute; right: 0; top: 0; } .teacherTab .tabIn li{ float: left; width: 1.78rem; line-height: 0.5rem; background: #15a0bf; font-size: 0.2rem; text-align: center; color: #ffffff; margin-left: 0.3rem; cursor: pointer; } .teacherTab .tabIn li:first-of-type { margin-left: 0; } .teacherTab .tabIn li:hover,.teacherTab .tabIn li.in{ background: #ecac42; } .teacherTab .tabCon>div{ display: flex; flex-wrap: wrap; justify-content: space-between; display: none; animation: 0.6s ease .3s 1 normal backwards running fadeInUp; } .teacherTab .tabCon>div.con{ display: flex; } .teacherTab .tabCon .teacher2{ width: 75%; } .teacher2 li{ padding-left: 10px; box-sizing: border-box; } .teacher2 li a{ display: block; width: 100%; padding: 136% 0 0; background-position: center; } .teacher2 li a p{ width: 90%; height: auto; background: #ffffff; position: absolute; left: 5%; bottom: 0.2rem; box-sizing: border-box; padding: 0.25rem; font-size: 0.18rem; line-height: 0.4rem; color: #333333; font-weight: bold; border-top: 0.05rem solid #15a0bf;overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .teacher2 li a p span{ font-size: 0.16rem; color: #666666; font-weight: normal; margin-left: 5px; } .teacher2 li.slick-current a p{ border-top: 0.05rem solid #ecab3e; } .teacher2 li a:hover img{ transform: scale(1.2); } .teacher2 li a:hover p{ color: #15a0bf; } .teacherTab .tabCon .teacher1{ width: 25%; padding-right: 0.75rem; box-sizing: border-box; background: url(../img/teacherBg.png) no-repeat left bottom 1rem; position: relative; } .teacher1 li a{ display: block; width: 100%; height: auto; } .teacher1 li a p:nth-of-type(1){ font-size: 0.3rem; line-height: 1; color: #333333; margin-top: 0.2rem; } .teacher1 li a p:nth-of-type(1) span{ font-size: 0.16rem; color: #666666; margin-left: 5px; } .teacher1 li a p:nth-of-type(2){ font-size: 0.15rem; line-height: 0.26rem; color: #666666; text-align: justify; margin: 0.3rem 0; } .teacher1 li a p:nth-of-type(3){ text-align: center; font-size: 0.16rem; color: #666666; width: 1.38rem; line-height: 0.4rem; border: 1px solid #dedede; } .teacher1 li a p:nth-of-type(3):hover{ background: #15a0bf; color: #ffffff; border: 1px solid #15a0bf; } .teacher1 li a:hover p:nth-of-type(1),.teacher1 li a:hover p:nth-of-type(1) span{ color: #15a0bf; } .teacher1 li a:hover p:nth-of-type(2){ color: #333333; } .teacher1 .slick-prev, .teacher1 .slick-next{ width: 0.54rem; height: 0.54rem; border: 1px solid #ffffff; background: url(../img/arrowIcon1.png) no-repeat center; border-radius: 100%; top: auto; bottom: 0; left: 0; transform: none; z-index: 99; } .teacher1 .slick-next{ right: auto; left: 0.74rem; transform: rotateY(180deg); } .teacher1 .slick-prev:hover{ background: #ffffff url(../img/arrowIcon2.png) no-repeat center; } .teacher1 .slick-next:hover{ background: #ffffff url(../img/arrowIcon2.png) no-repeat center; } .teacherTab .tabCon>div{ position: relative; z-index: 9; } .teacherTab .tabCon>div::after,.teacherTab .tabCon>div::before{ display: block; content: ""; width: 72%; height: 2rem; background: #15a0bf; position: absolute; bottom: 0; transform: translateY(50%); z-index: -1; } .teacherTab .tabCon>div::after{ left: 0; } .teacherTab .tabCon>div::before{ right: 100%; } .bg2{ padding-top: 1.7rem; background: url(../img/bg2.png) no-repeat top left; background-size: auto 100%; } .bg2 .jyxm{ width: 100%; padding: 1rem 0 0.8rem 1rem; background: #ffffff; box-sizing: border-box; position: relative; } .bg2 .jyxm::before{ display: block; content: ""; width: 100%; height: 100%; background: #ffffff url(../img/bg2_2.png) no-repeat left center; position: absolute; top: 0; left: 100%; } .jyxmSub{ display: flex; justify-content: flex-start; flex-direction: row-reverse; position: relative; } .jyxmTab{ width: 31%; background: #8291a7; padding: 0.18rem; box-sizing: border-box; } .jyxmTab li{ display: flex; cursor: pointer; width: 100%; height: 1.92rem; padding: 0 0.26rem 0 0.4rem; box-sizing: border-box; align-items: center; background: #8897ae; position: relative; } .jyxmTab li::before{ display: block; content: ""; width: 0.5rem; height: 0.5rem; position: absolute; right: 0.26rem; top: 0.3rem; } .jyxmTab li:nth-of-type(1)::before{ background: url(../img/jyxmIcon1.png) no-repeat top right; background-size: 0.5rem auto; } .jyxmTab li:nth-of-type(2)::before{ background: url(../img/jyxmIcon2.png) no-repeat top right; background-size: 0.37rem auto; } .jyxmTab li:nth-of-type(3)::before{ background: url(../img/jyxmIcon3.png) no-repeat top right; background-size: 0.46rem auto; } .jyxmTab li div{ display: flex; width: 100%; justify-content: flex-start; padding-bottom: 0.3rem; background: url(../img/jyxmTab1.png) no-repeat left bottom; align-items: center; } .jyxmTab li:nth-of-type(2){ background: #8593aa; } .jyxmTab li.in{ background: linear-gradient(180deg, #acb8ca 0%, #99a9c1 100%); } .jyxmTab li.in div{ background: url(../img/jyxmTab2.png) no-repeat left bottom; } .jyxmTab li div p:nth-of-type(1){ font-size: 0.5rem; line-height: 1; color: #ffffff; margin-right: 0.2rem; } .jyxmTab li div p:nth-of-type(2){ font-size: 0.24rem; line-height: 0.3rem; color: #ffffff; } .jyxmTab li div p:nth-of-type(2) span{ display: block; font-size: 0.14rem; color: rgba(255,255,255,0.6); line-height: 0.2rem; } .jyxmCon{ width: 42%; padding-right: 0.1rem; display: flex; flex-direction: column; align-items: flex-end; } .jyxmOn>div{ display: none; } .jyxmOn>div.active{ display: block; animation: 0.6s ease .3s 1 normal backwards running fadeInUp; } .jyxmOn{ width: 100%; height: 64%; background: #1898b5 url(../img/jyxmBg2.png) no-repeat right bottom; padding: 0.4rem; padding-bottom: 0; box-sizing: border-box; } .jyxmOn ul li{ float: left; width: 32%; margin-right: 2%; } .jyxmOn ul li:nth-of-type(3n){ margin-right: 0; } .jyxmOn ul li a{ display: block; width: 100%; font-size: 0.18rem; line-height: 0.54rem; color: #ffffff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: relative; z-index: 99; } .jyxmOn a.more{ display: block; width: 1.2rem; line-height: 0.4rem; font-size: 0.18rem; font-weight: bold; text-align: center; color: #ffffff; background: #5db6cb; margin-top: 0.4rem; position: relative; z-index: 99; } .jyxmOn a.more:hover,.jyxmOn ul li a:hover{ color: #ecab3e; } .bmrk{ width: 56%; height: 36%; padding-top: 0.1rem; box-sizing: border-box; } .bmrk a{ display: block; width: 100%; height: 100%; background: #ecab3e url(../img/jyxmBg.png) no-repeat right bottom; background-size: 90% auto; } .bmrk a p{ font-size: 0.2rem; line-height: 0.3rem; font-weight: bold; margin-left: 0.3rem; color: #ffffff; writing-mode: vertical-rl; writing-mode: tb-rl; text-indent: 0.3rem; } .bmrk a:hover p{ color: #15a0bf; } .jyxmImg{ position: absolute; left: 0; bottom: 0; width: 45%; padding-right: 0.14rem; box-sizing: border-box; } .jyxmImg img{ display: block; width: 100%; height: auto; } .bg2 .lmTit{ position: absolute; } .hlxy{ position: relative; } .hlxy .lmTit{ position: absolute; left: 50%; top: 0; width: 24.4%; } .hlxy .lmTit img{ display: block; width: auto; height: auto; max-width: 75%; margin: 0 auto; transform: translateY(-40%); } .hlxy .hlxySub{ float: left; } .hlxy1{ width: 50%; position: relative; } .hlxy1 li a{ display: block; width: 100%; padding: 5.4rem 0 0; position: relative; } .hlxy1 li a p{ width: 100%; padding: 0.2rem 1.3rem 0.2rem 0.3rem; box-sizing: border-box; font-size: 0.18rem; line-height: 0.3rem; color: #ffffff; background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.5) 30%,rgba(0,0,0,0.8) 100%); position: absolute; left: 0; bottom: 0; } .hlxy1 .slick-prev, .hlxy1 .slick-next{ width: 32px; height: 22px; background: url(../img/arrowIcon4.png) no-repeat center; background-size: 100% auto; top: auto; bottom: 0.24rem; left: auto; right: 0.8rem; transform: none; z-index: 87; } .hlxy1 .slick-next{ right: 0.3rem; transform: rotateY(180deg); } .hlxy1 .slick-prev:hover{ background: url(../img/arrowIcon3.png) no-repeat center; } .hlxy1 .slick-next:hover{ background: url(../img/arrowIcon3.png) no-repeat center; } .hlxy a{ display: block; width: 100%; position: relative; } .hlxy a:hover img{ transform: scale(1.2); } .hlxy .con{ width: 100%; padding: 0.2rem 0.9rem 0.2rem 0.3rem; box-sizing: border-box; font-size: 0.18rem; line-height: 0.3rem; color: #ffffff; background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.5) 30%,rgba(0,0,0,0.8) 100%); position: absolute; left: 0; bottom: 0; } .hlxy .con::before{ display: block; content: ""; width: 0.4rem; height: 0.4rem; position: absolute; right: 0.3rem; bottom: 0.15rem; border-radius: 100%; background-size: 60% auto!important; } .hlxy2 .con::before{ background: #cc0612 url(../img/icon3.png) no-repeat center; } .hlxy3 .con::before{ background: #000000 url(../img/icon5.png) no-repeat center; } .hlxy4 .con::before{ background: #21c504 url(../img/icon1.png) no-repeat center; } .hlxy5 .con::before{ background: #f16c8d url(../img/icon4.png) no-repeat center; } .hlxy6 .con::before{ background: #fbac00 url(../img/icon2.png) no-repeat center; } .hlxy2{ width: 24.4%; margin-top: 1.4rem; } .hlxy3,.hlxy4{ width: 25.6%; } .hlxy5{ width: 36.6%; } .hlxy6{ float: right!important; width: 50%; } .hlxy2 a{ padding: 4rem 0 0; } .hlxy3 a{ padding: 2.7rem 0 0; } .hlxy4 a{ padding: 2.7rem 0 0; } .hlxy5 a{ padding: 4.3rem 0 0; } .hlxy6 a{ padding: 4.3rem 0 0; } .code{ width: 14.4%; height: 4.3rem; position: absolute; left: 36.6%; bottom: 0; background: #94a0b4 url(../img/codeBg.png) no-repeat right bottom; padding: 0.3rem; box-sizing: border-box; float: none; display: flex; justify-content: center; align-items: flex-start; } .code p{ font-size: 0.22rem; line-height: 0.3rem; color: #ffffff; writing-mode: vertical-rl; writing-mode: tb-rl; font-weight: bold; letter-spacing: 10px; margin-right: 0.3rem; } .code p span{ font-size: 0.16rem; font-weight: normal; } .code .codeSub{ width: auto; height: 100%; display: flex; justify-content: space-between; flex-direction: column; } .code .codeSub li{ width: 0.52rem; height: 0.52rem; border: 1px solid #ffffff; border-radius: 100%; position: relative; cursor: pointer; } .code .codeSub li:nth-of-type(1){ background: url(../img/icon1.png) no-repeat center; } .code .codeSub li:nth-of-type(2){ background: url(../img/icon2.png) no-repeat center; } .code .codeSub li:nth-of-type(3){ background: url(../img/icon3.png) no-repeat center; } .code .codeSub li:nth-of-type(4){ background: url(../img/icon4.png) no-repeat center; } .code .codeSub li:nth-of-type(5){ background: url(../img/icon5.png) no-repeat center; } .code .codeSub li p{ display: none; width: auto; height: auto; position: absolute; left: 50%; bottom: 100%; transform: translateX(-50%); padding-bottom: 20px; animation: 0.5s ease .3s 1 normal backwards running codeDown; z-index: 88; } .code .codeSub li p::before { display: block; content: ""; position: absolute; left: 50%; bottom: 1px; transform: translateX(-50%); border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid transparent; border-top: 10px solid rgba(255,255,255,1); } .code .codeSub li p img{ display: block; width: 0.88rem; height: 0.88rem; object-fit: cover; max-width: none; } .code .codeSub li:hover p{ display: block; } /* 动画 */ @media only screen and (max-width: 1540px){ .teacherTab .tabIn{ right: 0.3rem; } .banner .slick-dots{ width: 100%; padding: 0 0.3rem; box-sizing: border-box; } } /* 媒体查询 */ @media only screen and (max-width: 1440px){ .home body{ height:auto; overflow:auto; } .banner .news_images img{ height:auto; } .body_home{ height:auto; } .body_b{ position:static; padding-top: 0; overflow: hidden; } .bb .bb_sub{ display: none; } .banner .slick-active .news_images img ,.banner .news_images img{ transform: none; transition: none; } .showdiv .bb{ bottom: 0; } .body_b.showdiv{ padding-top: 0; } } @media only screen and (max-width: 1040px){ .banner .slick-dots{ padding: 0 20px; bottom: 15px; } .p07{ padding: 50px 0; } .lmTit{ margin-bottom: 30px; } .lmTit h2{ font-size: 32px; line-height: 1; } .lmTit h2 span{ font-size: 15px; line-height: 20px; margin-top: 3px; } .lmTit a{ font-size: 16px; line-height: 30px; } .bg1{ padding: 50px 0; } .bg1::before{ display: none; } .aboutCon{ padding: 40px; width: 100%; margin-top: 0; } .aboutCon .con{ margin: 30px 0; } .aboutImg{ display: none; } .aboutCon h2{ font-size: 22px; line-height: 36px; } .aboutCon h2 span{ font-size: 15px; line-height: 24px; } .aboutCon .con p{ font-size: 15px; line-height: 26px; } .ztzl ul li{ width: 48%; margin-right: 4%; margin-top: 30px; } .ztzl ul li:nth-of-type(1),.ztzl ul li:nth-of-type(2){ margin-top: 0; } .ztzl ul li:nth-of-type(2n){ margin-right: 0; } .new .newSub{ width: 49%; } div.newSub a p.con{ padding: 10px; } div.newSub a p.con span:nth-of-type(1){ padding-left: 35px; max-width: 100%; line-height: 34px; font-size: 16px; } div.newSub a p.con span:nth-of-type(1)::before{ width: 30px; height: 30px; font-size: 16px; line-height: 40px; } div.newSub a p.con span:nth-of-type(2){ display: none; } div.newSub a p.time{ width: 68px; font-size: 14px; left: 0; } div.newSub a p.time span{ font-size: 24px; } div.newSub a p.time::before{ border-top: 15px solid #1396b4; border-bottom: 0 solid transparent; border-left: 34px solid transparent; border-right: 34px solid transparent; } div.newSub a p.img{ padding: 305px 0 0; } .newSub .newImg p.img{ width: 40%; padding: 120px 0 0; } .newSub .newImg p.con{ width: 60%; padding-left: 15px; } .newSub .newImg p.img img{ left: 0; top: 0; } .newSub .newImg p.con span:nth-of-type(1){ font-size: 16px; line-height: 22px; } .newSub .newImg p.con span:nth-of-type(2){ font-size: 14px; line-height: 20px; margin: 5px 0; } .newSub .newImg p.con span:nth-of-type(3){ font-size: 16px; padding-left: 35px; } .newSub .newImg p.con span:nth-of-type(3)::before{ width: 30px; height: 30px; } .newSub .newImg a{ padding-bottom: 15px; margin-bottom: 5px; } .newSub .newList a{ font-size: 16px; line-height: 36px; } .bg3{ padding: 50px 0; } .bg4{ padding: 50px 0; } .notice{ padding: 20px 40px; } .notice li a .time span{ font-size: 30px; } .notice li a .con span,.notice li a .time{ font-size: 14px; } .notice li a .con{ font-size: 16px; } .teacherTab .tabIn{ right: 20px; } .teacherTab .tabIn li{ width: 100px; margin-left: 10px; font-size: 16px; line-height: 40px; } .teacherTab .tabCon .teacher2{ width: 66%; } .teacherTab .tabCon .teacher1{ width: 34%; padding-right: 30px; background: url(../img/teacherBg.png) no-repeat left bottom; position: static; } .teacher2 li a p{ width: 100%; left: 0; bottom: 0; /* padding: 10px;*/ font-size: 16px; } .teacher2 li a p span { font-size: 14px; } .teacher1 li a p:nth-of-type(1){ font-size: 20px; margin-top: 10px; } .teacher1 li a p:nth-of-type(1) span{ font-size: 14px; } .teacher1 li a p:nth-of-type(2){ font-size: 14px; line-height: 22px; margin: 20px 0; } .teacher1 li a p:nth-of-type(3) { border: 1px solid #15a0bf; background: #15a0bf; color: #ffffff; } .teacher1 .slick-prev, .teacher1 .slick-next { bottom: -0.77rem; left: 50%; transform: translateX(-150%); } .teacher1 .slick-next { transform: translateX(50%) rotateY(180deg); } .teacherTab .tabCon>div::after, .teacherTab .tabCon>div::before{ width: 100%; height: 1rem; right: auto; transform: translateY(100%); } .bg2{ padding-top: 80px; } .bg2 .jyxm{ padding: 30px 0 30px 30px; } .bg2 .lmTit{ position: static; } .jyxmCon{ width: 60%; } .jyxmTab{ width: 40%; padding: 10px; } .jyxmImg{ width: 36%; } .bmrk{ width: 40%; } .jyxmTab li{ padding: 0 10px; height: 136px; } .jyxmTab li div p:nth-of-type(1){ font-size: 36px; margin-right: 10px; } .jyxmTab li div p:nth-of-type(2){ font-size: 18px; } .jyxmTab li div p:nth-of-type(2) span{ font-size: 12px; } .jyxmTab li::before{ width: 30px; height: 30px; top: 10px; right: 10px; background-size: 100% auto!important; } .jyxmOn{ padding: 20px; } .jyxmOn ul li a{ font-size: 16px; } .banner::before{ height: 40px; } .banner::after{ border-left: 10px solid #f3f7f8; border-bottom: 20px solid #f3f7f8; border-right: 10px solid transparent; border-top: 20px solid transparent; } .hlxy .lmTit{ position: static; width: 100%; transform: none; } .hlxy .lmTit img { transform: none; max-width: 50%; } .hlxy2,.hlxy3,.hlxy4,.hlxy5,.hlxy6{ width: 50%; margin-top: 0; } .hlxy1 li a{ padding: 72% 0 0; } .hlxy2 a{ padding: 72.2% 0 0; } .hlxy3 a{ padding: 72% 0 0; } .hlxy4 a{ padding: 72% 0 0; } .hlxy5 a{ padding: 72% 0 0; } .hlxy6 a{ padding: 72% 0 0; } .bg6{ padding: 50px 0 90px; } .ztzl{ margin-top: 50px; } .code{ width: 100%; position: static; height: auto; padding: 20px; flex-direction: column; } .code p { writing-mode: inherit; letter-spacing: 2px; } .code .codeSub { flex-direction: row; margin-top: 20px; } .code .codeSub li { margin-right: 20px; } .code .codeSub li:last-of-type { margin-right: 0; } } @media only screen and (max-width: 768px){ .banner .slick-dots{ padding: 0 15px; } .bg1{ padding: 40px 0; } .aboutCon{ padding: 30px; } .lmTit h2{ font-size: 28px; } .new .newSub{ width: 100%; } div.newSub{ margin-bottom: 20px; } div.newSub a p.img{ padding: 60% 0 0; } .newSub .newImg p.img{ padding: 25% 0 0; } .newSub .newImg p.con span:nth-of-type(2) { margin: 15px 0; } .bg4,.bg3{ padding: 40px 0; } .notice ul div.slick-slide li{ width: 100%; border-bottom: 1px solid #bdbdbd; margin-bottom: 10px; } .notice ul div.slick-slide li:last-of-type { border-bottom: none; margin-bottom: 0; } .notice .slick-dots li::before{ left: 0; } .notice{ padding: 20px 30px; } .teacherTab .tabCon .teacher1{ width: 0; padding: 0; } .teacherTab .tabCon .teacher1 .slick-list{ display: none; } .teacherTab .tabCon .teacher2{ width: 100%; } .teacherTab .tabIn{ position: static; padding: 0 5px; box-sizing: border-box; } .teacherTab .tabIn li{ width: calc(100% / 3); margin-left: 0; margin-bottom: 20px; line-height: 50px; } .teacher2 li{ padding: 0 5px; } .teacherTab .tabCon>div::after, .teacherTab .tabCon>div::before{ width: calc(100% - 10px); left: 5px; } .teacher2 li a p{ line-height: 20px; /* padding: 10px 0;*/ font-size: 14px; } .teacher2 li a p span { font-size: 12px; } .bg5 .lmTit{ margin-bottom: 30px; padding: 0 5px; box-sizing: border-box; } .jyxmImg{ display: none; } .jyxmTab,.jyxmCon{ width: 100%; padding: 0; padding-right: 0; } .jyxmSub{ flex-direction: column; } .bg2{ padding-top: 30px; } .bg2 .jyxm::before{ display: none; } .bg2 .jyxm{ padding: 20px; } .jyxmOn a.more{ margin-top: 20px; } .bmrk{ width: 100%; height: auto; } .bmrk a { padding: 30px 0; background-size: 40% auto; } .bmrk a p { text-indent: 0; } .jyxmOn ul li{ width: 49%; } .jyxmOn ul li a{ line-height: 40px; } .jyxmOn ul li:nth-of-type(3n){ margin-right: 2%; } .jyxmOn ul li:nth-of-type(2n){ margin-right: 0; } .jyxmTab li div p:nth-of-type(2) span{ display: none; } .jyxmTab{ display: flex; } .jyxmTab li{ width: calc(100% / 3.01); text-align: center; height: 88px; } .jyxmTab li div p:nth-of-type(2) { text-align: center; line-height: 22px; } .jyxmTab li::before{ display: none; } .jyxmTab li div{ background: none!important; padding-bottom: 0!important; justify-content: center; flex-direction: column; } .jyxmTab li div p:nth-of-type(1) { margin-right: 0; margin-bottom: 5px; } .bg6{ padding: 40px 0 90px; } .ztzl{ margin-top: 40px; } } @media only screen and (max-width: 560px){ .banner .slick-dots{ bottom: 5px; } .banner::before{ width: 40%; height: 30px; } .banner::after{ left: 40%; border-left: 10px solid #f3f7f8; border-bottom: 15px solid #f3f7f8; border-right: 10px solid transparent; border-top: 15px solid transparent; } .lmTit{ margin-bottom: 20px; } .lmTit h2{ font-size: 24px; line-height: 1; } .lmTit h2 span{ font-size: 14px; line-height: 1; margin-top: 5px; } .lmTit a{ font-size: 14px; line-height: 30px; } .bg1{ padding: 30px 0; } .aboutCon{ padding: 20px; } .aboutCon h2{ font-size: 18px; line-height: 30px; } .aboutCon h2 span{ font-size: 13px; line-height: 20px; } .aboutCon .con p{ font-size: 14px; line-height: 24px; } .ztzl ul li{ width: 49%; margin-right: 2%; margin-top: 10px; } .bg4,.bg3{ padding: 30px 0; } .newSub .newImg p.img{ padding: 35% 0 0; } .newSub .newImg p.con span:nth-of-type(1){ font-size: 14px; line-height: 20px; } .newSub .newImg p.con span:nth-of-type(2){ font-size: 12px; margin: 5px 0px; } .newSub .newImg p.con span:nth-of-type(3){ font-size: 14px; } div.newSub a p.con span:nth-of-type(1),.newSub .newList a{ font-size: 14px; } .newSub .newList a{ padding-left: 10px; } .newSub .newList a::before{ width: 5px; height: 5px; } .notice li a .time span{ font-size: 20px; } .notice li a .con span,.notice li a .time{ font-size: 12px; } .notice li a .con{ font-size: 14px; } .lmTit h2 span{ display: block; margin-left: 0; } .notice{ padding: 20px; } .bg5{ padding-bottom: 60px; } .teacherTab .tabCon>div::after, .teacherTab .tabCon>div::before{ height: 60px; } .teacher1 .slick-prev, .teacher1 .slick-next{ width: 40px; height: 40px; bottom: -50px; } .teacher1 .slick-prev, .teacher1 .slick-next { transform: translateX(-130%); } .teacher1 .slick-next { transform: translateX(30%) rotateY(180deg); } .bg5 .lmTit{ margin-bottom: 20px; } .teacherTab .tabIn li{ font-size: 15px; line-height: 40px; margin-bottom: 10px; } .bg2 .jyxm{ padding: 20px 15px; } .jyxmOn ul li{ width: 100%; margin-right: 0; } .jyxmOn ul li a{ font-size: 14px; line-height: 36px; } .jyxmOn a.more{ margin-top: 10px; font-size: 14px; } .jyxmTab li div p:nth-of-type(2){ font-size: 14px; } .jyxmTab li{ height: 74px; padding: 0 5px; } .jyxmTab li div p:nth-of-type(1) { font-size: 26px; } .hlxy2, .hlxy3, .hlxy4, .hlxy5, .hlxy6,.hlxy1{ width: 100%; } .hlxy1 li a p{ padding: 10px 95px 10px 10px; font-size: 16px; } .hlxy .con { font-size: 16px; padding: 10px 50px 10px 10px; } .hlxy .con::before { width: 30px; height: 30px; right: 10px; bottom: 10px; } .hlxy1 .slick-prev, .hlxy1 .slick-next { bottom: 12px; right: 55px; } .hlxy1 .slick-next { right: 10px; } .bg6{ padding: 30px 0 60px; } .ztzl{ margin-top: 30px; } .code .codeSub li{ margin-right: 0; } .code .codeSub{ justify-content: space-between; margin-top: 10px; width: 100%; } .code { padding: 10px; } }