@charset "utf-8"; .section1 { /* padding-bottom: 65px; */ } .sect1 { position: relative; margin-top: -96px; z-index: 2; background: #fff; } .xgss { padding-left: 40px; padding-right: 40px; } .sect1>ul { margin-top: 65px; } .s1-search { height: 94px; border-bottom: 3px solid #ba2a17; font-size: 0; } .s1-search input[type="text"] { display: inline-block; width: 96%; height: 94px; line-height: 94px; vertical-align: middle; } .s1-search input[type="image"] { display: inline-block; vertical-align: middle; } .s1-search input::placeholder { font-size: 28px; color: #ba2a17; opacity: .5; font-family: "微软雅黑"; } .ss-nr { padding-top: 15px; line-height: 30px; } .ss-nr span { font-size: 14px; color: #999; } .ss-nr a { display: inline-block; font-size: 14px; color: #666; margin-right: 15px; } .ss-nr a:hover { color: #ba2a17; } .ss-nr a.on { color: #ba2a17; } .sect1>ul>li { position: relative; float: left; width: 32%; margin-left: 2%; height: 620px; box-sizing: border-box; padding-left: 55px; padding-right: 55px; transition:0.5s; overflow:hidden; } .sect1>ul>li:nth-child(3n-2) { margin-left: 0; } .sect1>ul>li:hover:after{ transform:scale(1.2) } .sect1>ul>li:nth-child(1)::after { content: ''; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url(/uploads/image/images/s1-bg1.jpg) no-repeat center center; background-size: cover; z-index: -1; transition: 0.5s; } .sect1>ul>li:nth-child(2)::after { content: ''; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url(/uploads/image/images/s1-bg2.jpg) no-repeat center center; background-size: cover; z-index: -1; transition: 0.5s; } .sect1>ul>li:nth-child(3)::after { content: ''; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url(/uploads/image/images/s1-bg3.jpg) no-repeat center center; background-size: cover; z-index: -1; transition: 0.5s; } .sect1>ul>li>.box { text-align: center; height: 0; overflow: hidden; margin-top: 15px; } .sect1>ul>li>.box ul { position: relative; padding-top: 30px; } .sect1>ul>li>.box ul::before { content: ""; position: absolute; top: 0; left: 50%; right: 50%; height: 1px; background: rgba(255, 255, 255, .5); transition: all .4s; } .sect1>ul>li>.box ul>li { line-height: 35px; } .sect1>ul>li>.box ul>li>a { font-size: 16px; color: #decbcb; } .sect1>ul>li>.box ul>li:hover>a { color: #fff; } .tbxx { margin-top: 235px; text-align: center; transition: all .3s; } .tbxx a { display: block; } .tbxx p { margin-top: 15px; margin-bottom: 10px; font-size: 24px; color: #fff; font-weight: bold; } .tbxx span { font-size: 16px; color: #fff; font-family: "思源宋"; } .sect1>ul>li:hover>.box ul::before { left: 0; right: 0; } .sect1>ul>li:hover .tbxx { margin-top: 50px; } .sect1>ul>li:hover .box { height: auto; } .section2 { padding-top: 80px; padding-bottom: 20px; background: url(/uploads/image/images/sect2-bg.jpg) no-repeat center center; background-size: cover; } .sect2-l { float: left; width: 65.4%; } .sect2-r { float: right; width: 31%; } .title { overflow: hidden; padding-bottom: 30px; line-height: 32px; border-bottom: 2px solid #bfbfbf; } .title h2 { float: left; line-height: 32px; padding-left: 20px; border-left: 4px solid #ba2a17; font-size: 32px; color: #333333; } .title a { float: right; font-size: 14px; color: #999; } .title a:hover { text-decoration: underline; } .sect2-l ul { background-color: #fff; padding: 15px 30px; } .sect2-l ul li { margin-top: 17px; } .sect2-l ul li a { position: relative; display: block; overflow: hidden; } .sect2-l ul li a .date { float: left; width: 63px; height: 20px; /* background: url(/uploads/image/images/date.png) no-repeat center center; */ text-align: center; color: #fff; font-family: "思源宋"; font-size: 0; } .sect2-l ul li a .text { overflow: hidden; height: 27px; padding-left: 30px; padding-right: 60px; } .sect2-l ul li a .text p { line-height: 27px; font-size: 18px; color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: all .3s; } .sect2-l ul li:hover a .text p { font-weight: bold; color: #ba2a17; } .sect2-l ul li a .date p { padding-top: 18px; font-size: 20px; line-height: 20px; } .sect2-l ul li a .date span { display: block; font-size: 12px; line-height: 2; } .sect2-l ul li a .bq { position: absolute; right: 0; width: 60px; text-align: center; top: 50%; transform: translatey(-50%); } .sect2-l ul li a .bq span { position: relative; display: inline-block; padding-left: 6px; padding-right: 6px; padding-bottom: 8px; line-height: 20px; font-size: 12px; color: #fff; border-radius: 2px; } .sect2-l ul li.sty a .bq span { background: url(/uploads/image/images/sty-bg.png) no-repeat center center; background-size: 100% 100%; } .sect2-l ul li.teach a .bq span { background: url(/uploads/image/images/teach.png) no-repeat center center; background-size: 100% 100%; } .sect2-l ul li.manage a .bq span { background: url(/uploads/image/images/masange-bg.png) no-repeat center center; background-size: 100% 100%; } .sect2-r ul { background-color: #fff; padding: 10px 0px; padding-bottom: 0; } .sect2-r ul li { padding-top: 15px; padding-bottom: 34px; border-bottom: 1px dashed #d8d8d8; } .sect2-r ul li a { display: block; overflow: hidden; } .sect2-r ul li a .tpp { float: left; width: 180px; } .sect2-r ul li a .tpp .pic { padding-top: 57%; } .sect2-r ul li a .text { overflow: hidden; padding-left: 28px; } .sect2-r ul li a .text span { display: block; font-size: 14px; color: #ba2a17; font-family: "思源宋"; } .sect2-r ul li a .text p { margin-top: 5px; line-height: 25px; font-size: 16px; color: #333; height: 50px; overflow: hidden; } .sect2-r ul li:hover a .text p { color: #ba2a17; } .section3 { position: relative; padding-top: 15px; padding-bottom: 15px; background: url(/uploads/image/images/section3-bg.jpg) no-repeat center top; background-size: cover; } .section3::before { content: ""; position: absolute; left: 50%; transform: translatex(-50%); top: 0; border: 15px solid transparent; border-top: 15px solid #fff; } .section3::after { content: ""; position: absolute; left: 50%; transform: translatex(-50%); top: 0px; border: 15px solid transparent; border-top: 18px solid #ba2a17; /* animation: down 3s infinite;*/ } @-webkit-keyframes down { 0% { transform: translatex(-50%) translatey(0); } 50% { transform: translatex(-50%) translatey(15px); } 100% { transform: translatex(-50%) translatey(0px); } } .sect3 { position: relative; } .topic { position: relative; text-align: center; } .topic h2 { position: relative; font-size: 32px; font-weight: bold; color: #fff; padding-bottom: 25px; } .topic h2::after { content: ""; position: absolute; width: 41px; height: 4px; background: #fff; left: 50%; transform: translatex(-50%); bottom: 0; } .s3 ul { margin: 0 -12px; } .s3 ul li { margin-top: 30px; margin-bottom: 20px; } .s3 ul li a { display: block; margin: 0 12px; } .s3 ul li a .pic { padding-top: 28%; } .s3 .slick-dots { position: relative; } .s3 .slick-dots li { width: 12px; height: 12px; border-radius: 50%; background: rgba(255, 255, 255, .5); margin: 0 14px; } .s3 .slick-dots li.slick-active { background-color: #fff; } .sect3 .more { position: absolute; right: 0; bottom: 0; } .sect3 .more a { font-size: 14px; color: #fff; } .sect3 .more:hover a { text-decoration: underline; } .section4 { padding-top: 80px; padding-bottom: 80px; } .sect4 .topic h2 { color: #333333; } .sect4 .topic h2::after { background: #ba2a17; } .s4 { margin-top: 50px; } .s4-l { float: left; width: 49%; } .s4-r { float: right; width: 49%; } .s4 a { display: block; position: relative; } .s4 a:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; top: 0; background: url(/uploads/image/images/s4-l.png) repeat-x center bottom; } .s4 .text { position: absolute; left: 0; right: 0; padding: 30px 25px; bottom: 0; z-index: 2; } .s4 .text .date { padding-left: 22px; background: url(/uploads/image/images/time.png) no-repeat left center; font-size: 14px; color: #fff; font-family: "思源宋"; } .s4 .text p { margin-top: 10px; line-height: 30px; font-size: 18px; color: #fff; height: 60px; overflow: hidden; } .s4 .text:hover p { text-decoration: underline; } .s4 ul li { float: left; width: 48.5%; margin-left: 3%; transition: all .3s; } .s4 ul li:nth-child(2n-1) { margin-left: 0; } .s4-r a { padding-top: 75%; transition: all .3s; } .s4-r ul li:nth-child(1) { background: #8e7475; margin-bottom: 17px; } .s4-r ul li:nth-child(1) .text { bottom: auto; top: 15px; } .s4-r ul li:nth-child(2) { background: url(/uploads/image/images/s4r-pic1.jpg) no-repeat center center; background-size: 100% 100%; margin-bottom: 17px; transition: all .3s; } .s4-r ul li:hover:nth-child(2) { background-size: 120% 120%; } .s4-r ul li:nth-child(3) { background: url(/uploads/image/images/s4r-pic2.jpg) no-repeat center center; background-size: 100% 100%; transition: all .3s; } .s4-r ul li:hover:nth-child(3) { background-size: 120% 120%; } .s4-r ul li:nth-child(4) { background: #3c586d; } .s4-r ul li:nth-child(4) .text { bottom: auto; top: 15px; } .s4-r ul li:nth-child(1) a::after { display: none; } .s4-r ul li:nth-child(4) a::after { display: none; } .sect4 .more { margin-top: 50px; text-align: center; } .sect4 .more a { font-size: 14px; color: #999999; } .sect4 .more:hover a { text-decoration: underline; } .s4 a:hover img { transform: scale(1.1); } #link { padding: 55px 0; background: #f4f4f4; } .link { position: relative; padding-left: 235px; } .link>span { position: absolute; padding-left: 20px; left: 0; top: 50%; transform: translatey(-50%); border-left: 4px solid #bd1e30; font-size: 32px; line-height: 32px; color: #333; font-weight: bold; } .link>ul>li { position: relative; float: left; width: 31.333%; margin-left: 2%; } .link>ul>li:nth-child(3n-2) { margin-left: 0; } .link>ul>li p { position: relative; line-height: 50px; border: 1px solid #bfbfbf; padding-left: 15px; padding-right: 40px; } .link>ul>li p span { position: absolute; right: 15px; top: 50%; transform: translatey(-50%); width: 30px; height: 30px; background: url(/uploads/image/images/link-icon.png) no-repeat center center; cursor: pointer; } .link>ul>li>ul { position: absolute; bottom: 50px; left: 0; right: 0; height: 200px; background: #fff; box-shadow: 0 -10px 10px #e2dddd; display: none; overflow-y: auto; z-index: 9; } .link>ul>li>ul::-webkit-scrollbar { width: 4px; height: 8px; background-color: #f5f5f5; } .link>ul>li>ul::-webkit-scrollbar-track { border-radius: 10px; background-color: #e2e2e2; } .link>ul>li>ul::-webkit-scrollbar-thumb { border-radius: 10px; background-color: #ba2a17; } .link>ul>li>ul>li { text-align: center; line-height: 40px; } .link>ul>li>ul>li>a { font-size: 16px; color: #333; } .link>ul>li>ul>li:hover { background: #ba2a17; } .link>ul>li>ul>li:hover>a { color: #fff; } @media screen and (min-width:1400px) {.link>ul>li:nth-child(3) {width:33%}} @media screen and (max-width:1400px) { .link>span { left: 15px; } .sect3 .more { right: 15px; } .sect1 { margin-top: 0; } .banner .slick-dots { bottom: 20px; } } @media screen and (max-width:1200px) { .xgss { padding-left: 0; padding-right: 0; } } @media screen and (max-width:1024px) { .sect1>ul>li>.box { height: auto; } .sect1>ul>li .tbxx { margin-top: 50px; } .sect2-l { width: 55%; } .sect2-r { width: 42%; } .s4 .text { padding: 15px; } .s4 .text p { font-size: 16px; } .sect1>ul>li>.box ul::before { left: 0; right: 0; } } @media screen and (max-width:1000px) { .sect1>ul>li { padding-left: 15px; padding-right: 15px; } .sect1>ul>li .tbxx .icon img { height: 35px; } .tbxx p { margin-top: 10px; margin-bottom: 5px; font-size: 16px; } .sect1>ul>li>.box ul { padding-top: 10px; } .sect1>ul>li { height: 515px; } .sect1>ul { margin-top: 15px; } .section1 { padding-bottom: 15px; } .section2 { padding-top: 15px; padding-bottom: 15px; } .sect2-r ul li a .tpp { width: 90px; margin-top: 15px; } .section4 { padding-top: 15px; padding-bottom: 15px; } #link { padding: 15px 0; } } @media screen and (max-width:750px) { .sect1>ul>li>.box ul>li>a { width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block; line-height: 30px; } .detail-text table { overflow-x:auto; } } @media screen and (max-width:700px) { .sect2-l ul li a .bq { top: 25%; } .s1-search input::placeholder { font-size: 18px; } .s1-search { height: 50px; } .s1-search input[type="text"] { height: 50px; line-height: 50px; } .s1-search input[type="text"] { width: 90%; } .sect1>ul>li { width: 100%; height: auto; margin-left: 0; margin-bottom: 15px; padding-bottom: 15px; } .sect1>ul>li .tbxx { margin-top: 15px; } .sect1>ul>li>.box ul { font-size: 0; text-align: left; } .sect1>ul>li>.box ul>li { display: inline-block; width: 50%; text-align: left; line-height: 22px; } .sect2-l { float: none; width: 100%; } .sect2-r { float: none; width: 100%; margin-top: 15px; } .title h2 { line-height: 24px; padding-left: 10px; font-size: 18px; } .title { padding-bottom: 5px; } .sect2-l ul { padding: 15px; } .sect2-l ul li { margin-top: 5px; } .sect2-l ul li a .text { padding-left: 24px; height: 25px; } .sect2-l ul li a .date { width: 50px; height: 40px; background-size: 100% 100%; } .sect2-l ul li a .date p { padding-top: 10px; font-size: 16px; } .sect2-l ul li a .text p { line-height: 25px; font-size: 14px; } .sect2-r ul { padding: 15px; } .sect2-r ul li { padding-top: 10px; padding-bottom: 15px; } .sect2-r ul li a .text { padding-left: 15px; } .section3 { padding-top: 15px; padding-bottom: 15px; } .topic h2 { font-size: 18px; padding-bottom: 10px; } .s3 ul li { margin-top: 15px; margin-bottom: 15px; } .s3 .slick-dots li { margin: 0 5px; } .s4-l { float: none; width: 100%; } .s4 { margin-top: 15px; } .s4-r { margin-top: 15px; float: none; width: 100%; } .s4 .text p { line-height: 18px; height: 36px; } .sect4 .more { margin-top: 15px; } .link>span { position: relative; font-size: 18px; line-height: 20px; padding-left: 5px; left: 0; } .link { padding-left: 15px; } .link ul { margin-top: 15px; } .link>ul>li { float: none; width: 100%; margin-right: 0; margin-left: 0; margin-top: 15px; } } .bq1 {float:left;} @media screen and (min-width:420px) { .bq1 { margin-right:20px; } } @media screen and (max-width:480px){ .sect1>ul>li>.box ul>li{ width: 100%; text-align: center; } .sect1>ul>li>.box ul>li>a{ font-size: 14px; } .sect2-l ul li a .date{ height: 32px; } }