body { margin: 0; padding: 0; background: url(../img/body-bg.jpg) no-repeat center top #002ab1; background-size: 100% 1050px; color: #00429c; font-size: 14px; font-family: Nunito Sans, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji; } .header { height: 103px; position: relative; } .header .logo { display: block; width: 90px; height: 80px; background-image: url(../img/logo_xueyuan.png); background-repeat: no-repeat; background-size: 500px 80px; position: absolute; top: 15px; left: 0; } .header .logo span { position: absolute; width: 605px; color: #fff; font-weight: bold; font-size: 26px; left: 100px; top: 23px; } .header .zh-icon { color: #fff; position: absolute; top: 4px; right: 0; } .header .zh-icon a { color: #fff; text-decoration: none; } .content { width: 80%; margin: 0px auto; min-height: calc(100vh - 60px); } .nav { margin-bottom: 36px; } .nav a.nav-link { position: relative; top: -15px; text-decoration: none; color: #00429c; display: inline-block; padding: 0 10px; height: 45px; line-height: 45px; } .nav a.nav-link:hover { background-color: #dd8200; color: #fff; } .nav ul.list { padding: 0; list-style: none; display: flex; font-size: 14px; font-weight: bolder; } .nav ul.list li { padding-right: 40px; cursor: pointer; position: relative; } .nav ul.sub-list { display: none; position: absolute; list-style: none; padding: 0; background: #dd8200; color: #fff; font-weight: normal; top: 35px; z-index: 10000; padding: 5px; } .nav ul.sub-list li { padding: 8px 5px; text-align: left; width: 180px; position: relative; } .nav ul.sub-list li a.nav-sub-link { color: #fff; text-decoration: none; } .nav ul.sub-list li:hover { background-color: #ffb955; } .nav ul.list li:hover>ul.sub-list { display: block; } .nav ul.sub-list ul.third-list { display: none; position: absolute; list-style: none; padding: 0; background: #dd8200; color: #fff; font-weight: normal; top: -5px; z-index: 100000; padding: 5px; left: 190px; } .nav ul.sub-list ul.third-list a { color: #fff; text-decoration: none; } .nav ul.sub-list>li:hover>ul.third-list { display: block; } .news-event { display: flex; padding: 20px 15px; background-color: #fff; border-radius: 6px; margin-top: 24px; } .news-event .news { width: 70%; padding-right: 15px; border-right: 1px dotted #999; } .news-event .news .list-title { height: 45px; line-height: 45px; padding: 0 10px; font-size: 18px; font-weight: bold; color: #fff; background-color: #004098; margin-bottom: 20px; } .news-event .news .news-block { padding-left: 15px; padding-bottom: 10px; border-bottom: 1px dotted #999; margin-bottom: 10px; position: relative; } .news-event .news .news-block::before { content: ''; display: block; position: absolute; width: 10px; height: 10px; background-image: url(../img/ico-list.png); background-repeat: no-repeat; background-size: 10px 10px; top: 4px; left: 0; } .news-event .news .news-block:last-child { border-bottom: 0; margin-bottom: 0; } .news-event .news .news-block .news-title { line-height: 18px; font-weight: bold; font-size: 14px; margin-bottom: 10px; } .news-event .news .news-block .news-title a { color: #00429c; text-decoration: none; } .news-event .news .news-block .news-content { color: #4d6d98; margin-bottom: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .news-event .news .news-block .news-date { text-align: right; color: #4d6d98; } .news-event .event { width: 30%; padding-left: 15px; } .news-event .event .list-title { height: 45px; line-height: 45px; padding: 0 10px; font-size: 18px; font-weight: bold; color: #fff; background-color: #dd8200; margin-bottom: 15px; } .news-event .event .event-block { margin-bottom: 15px; } .news-event .event .event-block:last-child { margin-bottom: 0; } .news-event .event .event-block .event-title { margin-bottom: 10px; } .news-event .event .event-block .event-title a { color: #004098; text-decoration: none; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; } .news-event .event .event-block .event-date { text-align: right; color: #333; } .footer { display: flex; color: #fff; justify-content: space-between; align-items: center; height: 45px; margin-top: 24px; background-color: #000a5d; padding: 0 40px; } .lb-box { width: 100%; height: 350px; margin: 0px auto; position: relative; overflow: hidden; z-index: 1; border-radius: 6px; border: 2px solid #fff; box-shadow: 0 0 6px 2px #fff; } @media (max-width:568px) { .lb-box { width: 76%; height: 220px; } } .lb-content { width: 100%; height: 100%; z-index: 1; } .lb-item { width: 100%; height: 100%; display: none; position: relative; } .lb-item>a { width: 100%; height: 100%; display: block; } .lb-item>a>img { width: 100%; height: 100%; } .lb-item>a>span { width: 100%; display: block; position: absolute; bottom: 0px; padding: 15px; color: #fff; background-color: rgba(0, 0, 0, 0.7); } @media (max-width:568px) { .lb-item>a>span { padding: 10px; } } .lb-item.active { display: block; left: 0%; z-index: 1; } .lb-item.active.left { left: -100%; z-index: 1; } .lb-item.active.right { left: 100%; z-index: 1; } /* */ .lb-item.next, .lb-item.prev { display: block; position: absolute; top: 0px; } .lb-item.next { left: 100%; } .lb-item.prev { left: -100%; } .lb-item.next.left, .lb-item.prev.right { left: 0%; } .lb-sign { position: absolute; right: 38%; top: 85%; padding: 5px 3px; border-radius: 6px; list-style: none; user-select: none; background-color: rgba(0, 0, 0, 0.3); z-index: 1; } .lb-sign li { width: 100px; height: 5px; font-size: 14px; font-weight: 500; line-height: 20px; text-align: center; float: left; color: #aaa; margin: auto 4px; border-radius: 3px; cursor: pointer; padding-left: 5px; } .lb-sign li:hover { color: #fff; } .lb-sign li.active { color: #000; background-color: #EBEBEB; } .lb-ctrl { position: absolute; top: 50%; transform: translateY(-50%); font-size: 100px; font-weight: 100; user-select: none; background-color: none; color: #fff; border-radius: 5px; cursor: pointer; transition: all 0.1s linear; } @media (max-width:568px) { .lb-ctrl { font-size: 30px; } } .lb-ctrl.left { left: -150px; z-index: 1; } .lb-ctrl.right { right: -150px; z-index: 1; } .lb-box:hover .lb-ctrl.left { left: 100px; } .lb-box:hover .lb-ctrl.right { right: 100px; } .lb-ctrl:hover { background-color: none; } .about-content { background-color: #f0f0f0; border-radius: 6px; padding: 20px 10px; color: #333; position: relative; } .about-content .content-title { position: absolute; height: 40px; color: #fff; line-height: 40px; padding: 0 20px; top: -30px; font-size: 26px; font-weight: bold; border-radius: 6px; background: linear-gradient(to bottom, #fff 0%, #004099 5%); } .about-content .img-wpr { text-align: center; } .about-content .img-wpr img { width: 100%; height: auto; }