body { font-family: "Microsoft Yahei", "Helvetica Neue", Helvetica, Arial, sans-serif !important; width: 100%; margin: 0; padding: 0; } .px1320 { width: 1320px; } .header-wrapper { width: 100%; position: relative; height: 550px; overflow: hidden; } .header-wrapper .nav, .list-header .nav { display: flex; flex-direction: row; justify-content: space-between; width: 100%; margin: 0 auto; padding: 10px 0 0 0; position: absolute; top: 0; left: 50%; margin-left: -50%; height: 85px; line-height: 85px; z-index: 1000; background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .header-wrapper .nav .logo, .list-header .nav .logo { display: flex; flex-direction: row; justify-content: flex-start; align-items: center; height: 85px; margin-left: 50px; } .header-wrapper .nav .logo img, .list-header .nav .logo img { width: 215px; height: 50px; } .header-wrapper .nav .logo .title, .list-header .nav .logo .title { font-size: 26px; color: #fff; margin: 0 0 0 20px; } .header-wrapper .nav #list, .list-header .nav #list { display: flex; flex-direction: row; padding-right: 50px; } .header-wrapper .nav #list ul, .list-header .nav #list ul { display: flex; flex-direction: row; height: 85px; align-items: center; } .header-wrapper .nav #list ul li, .list-header .nav #list ul li { position: relative; } .header-wrapper .nav #list ul li a, .list-header .nav #list ul li a { padding: 0 13px; font-size: 18px; color: #fff; cursor: pointer; } .list-header .nav #list ul li a { color: #fff; } .header-wrapper .nav #list ul li .sub, .list-header .nav #list ul li .sub { width: 156px; left: 50%; margin-left: -78px; top: 70px; display: none; height: auto; position: absolute; text-align: left; padding: 10px 0; z-index: 1000; background-color: #fff; border-radius: 7px; box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.1); } .header-wrapper .nav #list ul li a::nth-child(7) { color: red; } .header-wrapper .nav #list>ul>li ul::before, .list-header .nav #list>ul>li ul::before { position: absolute; width: 17px; height: 7px; left: 50%; margin-left: -8px; top: -7px; content: ""; background-image: url(../images/2023/sub_nav_bg.png); box-sizing: border-box; } .header-wrapper .nav #list .sub li, .list-header .nav #list .sub li { vertical-align: middle; line-height: normal; } .header-wrapper .nav #list .sub li a, .list-header .nav #list .sub li a { display: block; font-size: 16px; color: #333; text-align: center; padding: 13px 30px; } .header-wrapper .nav #list .sub li a:hover, .list-header .nav #list .sub li a:hover { background-color: #ecf6fa; color: #23768e; } .header-wrapper .nav .blank, .list-header .nav .blank { width: 80px; } .header-wrapper .banner { width: 100%; height: 500px; position: relative; overflow: hidden; } .header-wrapper .banner img { width: 100%; height: 500px; object-fit: cover; overflow: hidden; } .header-wrapper .banner .swiper .swiper-my-button-next, .header-wrapper .banner .swiper .swiper-my-button-prev { position: absolute; top: 50%; margin-top: -51px; z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; background-size: 100% 100%; width: 27px; height: 51px; transition: all 0.5s; } .header-wrapper .banner .swiper .swiper-my-button-next { background: url(../images/2023/next.png) no-repeat; right: 280px; } .header-wrapper .banner .swiper .swiper-my-button-prev { left: 280px; background: url(../images/2023/prev.png) no-repeat; } .header-wrapper .banner .swiper { --swiper-theme-color: #036c6c; /* 两种都可以 */ } .search-wrapper { width: 30px; height: 30px; background-color: #029696; border-radius: 50%; display: inline; text-align: center; line-height: 30px; margin: 28px 0 0 0; cursor: pointer; } .search-wrapper img { width: 25px; height: 25px; display: block; margin: 3px 0 0 3px; } #root { width: 100%; height: auto; text-align: center; } #root .modal { display: none; position: fixed; top: 0; left: 0; z-index: 10; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .4); border-radius: 5px 5px 0 0; } #root .modal-content { position: fixed; top: 50%; left: 50%; width: 550px; height: 54px; margin-top: -160px; margin-left: -275px; } #root .modal .search-input { width: 420px; border: none; background: #fff; padding-left: 15px; height: 52px; line-height: 52px; font-size: 14px; color: #666; float: left; } #root .modal .search-btn { width: 110px; border: none; background: #036d6d; height: 54px; line-height: 54px; font-size: 14px; color: #fff; text-align: center; float: left; cursor: pointer; font-size: 16px; border: none; } .container { background-color: #f3f9f9; width: 100%; padding: 30px 0; } .list-wrapper { display: flex; flex-direction: row; justify-content: space-between; width: 1320px; margin: 0 auto; } .list-wrapper .news-wrapper { width: 900px; } .list-wrapper .news-wrapper .news-header { display: flex; flex-direction: row; justify-content: space-between; background-repeat: repeat-x; background-position: left bottom; background-image: url(../images/2023/title-11.jpg); } .list-wrapper .news-wrapper .news-header .title { margin: 0; font-size: 16px; color: #888; text-transform: uppercase; } .list-wrapper .news-wrapper .news-header .title span { padding-right: 10px; font-size: 24px; color: #333; padding-bottom: 18px; border-bottom: 4px solid #21748d; display: inline-block; font-weight: bold; } .list-wrapper .news-wrapper .news-header .more { font-size: 14px; color: #888; margin-top: 7px; } .list-wrapper .news-wrapper .news-header .more a { color: #888; } .list-wrapper .news-wrapper .news-content { display: flex; flex-direction: row; margin: 20px 0 0 0; } .list-wrapper .news-wrapper .news-content .pic-news { width: 440px; height: 350px; background-color: #fff; position: relative; overflow: hidden; } .list-wrapper .news-wrapper .news-content .pic-news .img-wrapper { overflow: hidden; height: 300px; width: 100%; } .list-wrapper .news-wrapper .news-content .pic-news img { width: 100%; height: 300px; border: none; } .list-wrapper .news-wrapper .news-content .pic-news .text { height: 50px; line-height: 50px; text-align: center; font-size: 16px; } .list-wrapper .news-wrapper .news-content .pic-news .swiper-news-button-next, .list-wrapper .news-wrapper .news-content .pic-news .swiper-news-button-prev { position: absolute; top: 50%; margin-top: -51px; z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; background-size: 100% 100%; width: 27px; height: 51px; transition: all 0.5s; } .list-wrapper .news-wrapper .news-content .pic-news .swiper-news-button-next { background: url(../images/2023/next.png) no-repeat; right: 20px; } .list-wrapper .news-wrapper .news-content .pic-news .swiper-news-button-prev { left: 20px; background: url(../images/2023/prev.png) no-repeat; } .list-wrapper .news-wrapper .news-content .text-news { width: 440px; } .list-wrapper .news-wrapper .news-content .text-news ul li { width: 100%; height: 44px; line-height: 44px; overflow: hidden; font-size: 16px; } .list-wrapper .news-wrapper .news-content .text-news ul li a { display: flex; flex-direction: row; justify-content: space-between; margin: 0 0 0 20px; color:#333; } .list-wrapper .news-wrapper .news-content .text-news ul li a span.news-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .list-wrapper .news-wrapper .news-content .text-news ul li a em { width: 120px; font-style: normal; text-align: right; } .list-wrapper .news-wrapper .news-content .text-news ul li a:hover { color: #006666; } .list-wrapper .notice-wrapper { height: 300px; width: 380px; display: flex; flex-direction: column; } .list-wrapper .notice-wrapper .notice-header { display: flex; flex-direction: row; justify-content: space-between; background-repeat: repeat-x; background-position: left bottom; background-image: url(../images/2023/title-11.jpg); width: 380px; } .list-wrapper .notice-wrapper .notice-header .title { margin: 0; font-size: 16px; color: #888; text-transform: uppercase; } .list-wrapper .notice-wrapper .notice-header .title span { padding-right: 10px; font-size: 24px; color: #333; padding-bottom: 18px; border-bottom: 4px solid #21748d; display: inline-block; font-weight: bold; } .list-wrapper .notice-wrapper .notice-header .more { font-size: 14px; color: #888; margin-top: 7px; } .list-wrapper .notice-wrapper .notice-header .more a { color: #888; } .list-wrapper .notice-wrapper .notice-content { width: 330px; background-color: #f4f2f2; padding: 25px; height: 320px; } .list-wrapper .notice-wrapper .notice-content ul li a { font-size: 16px !important; color: #333; display: flex; flex-direction: row; justify-content: flex-start; margin-bottom: 22px; } .list-wrapper .notice-wrapper .notice-content ul li a .date { width: 77px; height: 66px; background-color: #fff; text-align: center; border-radius: 10px; margin-right: 25px; display: flex; flex-direction: column; justify-content: center; } .list-wrapper .notice-wrapper .notice-content ul li a .date .day { margin: 0; font-size: 20px; color: #1f586b; font-weight: bold; width: 77px; } .list-wrapper .notice-wrapper .notice-content ul li a .date .year { margin: 0; font-size: 14px; color: #999; margin-top: 6px; } .list-wrapper .notice-wrapper .notice-content ul li a .title { font-size: 16px; color: #333; line-height: 30px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .list-wrapper .notice-wrapper .notice-content ul li a:hover .title { color: #036c6c; } .main1-container { margin-top: 15px; background-repeat: no-repeat; background-position: center; background-image: url(../images/2023/main1-bg.jpg); background-size: cover; padding: 50px 0; height: 635px; } .main1-wrapper { width: 1320px; margin: 0 auto; display: flex; flex-direction: row; justify-content: space-between; } .main1-wrapper .party, .main1-wrapper .student { width: 650px; display: flex; flex-direction: column; } .main1-wrapper .party .party-header, .main1-wrapper .student .student-header { display: flex; flex-direction: row; justify-content: space-between; width: 650px; } .main1-wrapper .party .party-header .title, .main1-wrapper .student .student-header .title { margin: 0; font-size: 16px; color: #fff; text-transform: uppercase; } .main1-wrapper .party .party-header .title span, .main1-wrapper .student .student-header .title span { padding-right: 10px; font-size: 24px; color: #fff; padding-bottom: 18px; display: inline-block; font-weight: bold; } .main1-wrapper .party .party-header .more, .main1-wrapper .student .student-header .more { font-size: 14px; color: #fff; margin-top: 7px; } .main1-wrapper .party .party-header .more a, .main1-wrapper .student .student-header .more a { color: #fff; } .main1-wrapper .party .party-content ul li a, .main1-wrapper .student .student-content ul li a { background-color: #fff; height: 150px; display: flex; flex-direction: row; justify-content: space-between; padding: 20px; margin: 0 0 20px 0; } .main1-wrapper .party .party-content ul li a .content-wrapper, .main1-wrapper .student .student-content ul li a .content-wrapper { margin: 0 20px 0 0; display: flex; flex-direction: column; width: 420px; height: 150px; } .main1-wrapper .party .party-content ul li a .content-wrapper h1, .main1-wrapper .student .student-content ul li a .content-wrapper h1 { font-size: 18px; color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; height: 35px; line-height: 35px; } .main1-wrapper .party .party-content ul li a .content-wrapper h1:hover, .main1-wrapper .student .student-content ul li a .content-wrapper h1:hover { color: #036c6c; } .main1-wrapper .party .party-content ul li a .content-wrapper .date, .main1-wrapper .student .student-content ul li a .content-wrapper .date { font-size: 16px; color: #666; height: 40px; line-height: 40px; } .main1-wrapper .party .party-content ul li a .content-wrapper p, .main1-wrapper .student .student-content ul li a .content-wrapper p { font-size: 16px; color: #666; width: 420px; height: 75px; line-height: 25px; } .main1-wrapper .party .party-content ul li a .img-wrapper, .main1-wrapper .student .student-content ul li a .img-wrapper { width: 210px; height: 150px; overflow: hidden; } .main1-wrapper .party .party-content ul li a .img-wrapper img, .main1-wrapper .student .student-content ul li a .img-wrapper img { width: 210px; height: 150px; } .main2-container { width: 100%; } .main2-wrapper { width: 1320px; margin: 0 auto; display: flex; flex-direction: column; padding: 50px 0; } .main2-wrapper .main2-header { width: 1320px; border-bottom: 1px solid #dbdddf; margin-bottom: 30px; } .main2-wrapper .main2-header h1 { font-size: 26px; font-weight: bold; color: #000; text-align: center; } .main2-wrapper .main2-header h2 { text-align: center; font-size: 18px; color: #999; text-transform: uppercase; padding: 10px 0 22px; } .main2-wrapper .main2-header h3 { width: 50px; border-bottom: 5px solid #036c6c; text-align: center; margin: 0 auto; } .main2-wrapper .main2-content { margin: 30px 0 0 0; width: 1320px; } .main2-wrapper .main2-content ul { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; } .main2-wrapper .main2-content ul li { width: calc((100% - 60px) / 3); margin-right: 20px; margin-bottom: 40px; border-bottom: 1px solid #dbdddf; padding: 0 0 10px 0; } .main2-wrapper .main2-content ul li:nth-of-type(3n+0) { margin-right: 0; } .main2-wrapper .main2-content ul li a h1 { font-size: 18px; color: #333; line-height: 30px; } .main2-wrapper .main2-content ul li a:hover h1 { color: #036c6c; } .main2-wrapper .main2-content ul li a .date-wrapper { display: flex; flex-direction: row; justify-content: space-between; height: 40px; line-height: 40px; } .main2-wrapper .main2-content ul li a .date-wrapper .date { font-size: 16px; color: #666; } .main2-wrapper .main2-content .more { width: 80px; border: 1px solid #036c6c; border-radius: 20px; height: 30px; line-height: 30px; text-align: center; margin: 0 auto; padding: 0 10px; font-size: 14px; } .main2-wrapper .main2-content .more:hover { background-color: #036c6c; border: 1px solid #ccc; color: #fff; } .main2-wrapper .main2-content .more:hover a { color: #fff; } .main3-container { width: 100%; margin: 30px 0; } .main3-container .video-wrapper { width: 1320px; height: 225px; margin: 0 auto; background: url(../images/2023/video.jpg) no-repeat center; cursor: pointer; } .main3-container .video-wrapper .text-wrapper { width: 200px; margin: 0 auto; display: flex; flex-direction: column; justify-content: center; align-items: center; } .main3-container .video-wrapper .text-wrapper img { width: 50px; height: 50px; text-align: center; margin: 50px 0 0 0; } .main3-container .video-wrapper .text-wrapper h1 { color: #fff; font-size: 16px; line-height: 30px; height: 30px; } .main3-container .video-wrapper .text-wrapper h2 { font-size: 18px; line-height: 30px; font-weight: bold; } .main3-container .video-wrapper .text-wrapper h2 a { color: #fff; font-weight: bold; } .main3-container .video-wrapper .text-wrapper h2 a:hover { color: #333; } .footer-container { width: 100%; background-color: #029696; text-align: center; padding: 50px 0; color: #fff; } .footer-container p { line-height: 35px; } .footer-container p a { color: #fff; } .list-header { width: 100%; height: 508px; position: relative; } .list-header .list-banner img { object-fit: cover; object-position: center; width: 100%; height: 508px; } .list-header .level-wrapper { width: 1320px; margin: 0 auto; position: relative; } .list-header .level-wrapper .level-1 { width: 206px; min-height: 50px; line-height: 50px; background-color: #029696; position: absolute; bottom: 0; left: 0; font-size: 20px; color: #fff; padding: 20px 25px 20px 44px; border-radius: 20px 20px 0 0; } .list-container { width: 1320px; min-height: 500px; margin: 0 auto; display: flex; flex-direction: row; justify-content: space-between; } .list-container .tree-nav-wrapper { display: flex; flex-direction: column; width: 275px; margin-bottom: 100px; margin-top: 10px; } .list-container .tree-nav-wrapper ul li a { display: block; font-size: 18px; color: #333; height: 65px; line-height: 65px; padding-left: 44px; background-color: #f4fafc; background-repeat: no-repeat; background-position: right center; position: relative; } .list-container .tree-nav-wrapper ul li.curr a { background-color: #029696 !important; color: #fff; } .list-container .tree-nav-wrapper ul li.has-child ul li a { background-color: #f4fafc !important; color: #333; } .list-container .tree-nav-wrapper ul li a::after { position: absolute; width: 18px; height: 18px; right: 25px; top: 50%; margin-top: -6px; content: ""; background-image: url(../images/2023/arrow-right.png); background-repeat: no-repeat; background-position: center; background-size: cover; } .list-container .tree-nav-wrapper ul li.has-child a::after { background-image: url(../images/2023/arrow-down.png); } .list-container .tree-nav-wrapper ul li.has-child ul li a::after { background-image: url(../images/2023/arrow-right-double.png); } .list-container .tree-nav-wrapper ul li.has-child ul li a:hover { color: #029696; } .list-container .tree-nav-wrapper ul li.has-child ul li.on a { color: #029696; } .list-container .tree-nav-wrapper ul li ul { display: flex; flex-direction: column; } .list-container .tree-nav-wrapper ul li ul li a { font-size: 14px; margin: 0; border-bottom: 1px dashed #ccc; } .list-container .list-content-wrapper { width: 980px; } .list-container .list-content-wrapper .position-wrapper { width: 980px; display: flex; flex-direction: row; justify-content: space-between; margin: 20px 0; height: 50px; line-height: 50px; font-size: 16px; color: #999; border-bottom: 1px solid #c1c1c1; height: 50px; padding-bottom: 10px; } .list-container .list-content-wrapper .position-wrapper .position-name { color: #21748d; font-size: 28px; font-weight: 700; line-height: 66px; padding-left: 16px; position: relative; z-index: 1; } .list-container .list-content-wrapper .position-wrapper .position-name::after { content: ""; position: absolute; left: 0; top: 34px; width: 5px; height: 29px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); background: #5c8ba7; } .list-container .list-content-wrapper .position-wrapper .level-link em { font-size: 16px; color: #999; font-style: normal; margin-right: 10px; } .list-container .list-content-wrapper .position-wrapper .level-link a { font-size: 16px; color: #999; } .list-container .list-content-wrapper .position-wrapper a { font-size: 16px; color: #999; } #list-content { width: 940px; display: flex; flex-direction: column; justify-content: flex-start; margin-bottom: 50px; } #list-content ul li { background-color: #f8f8f8; height: 150px; padding: 20px; width: 100%; margin: 0 0 15px 0; } #list-content ul li .date { font-size: 20px; color: #21768f; margin-bottom: 10px; } #list-content ul li .date::after { display: block; content: ""; width: 27px; height: 1px; background-color: #5a98ab; margin-top: 15px; } #list-content ul li h1, #list-content ul li h1 a { clear: both; font-size: 20px; color: #333; padding: 15px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #list-content ul li h1 a:hover { color: #036c6c; } #list-content ul li p { font-size: 16px; color: #999; line-height: 1.8; height: 3.6em; overflow: hidden; } .list-content-wrapper .page-wrapper, .list3-content-wrapper .page-wrapper { margin: 20px 0; height: 50px; } .pb_sys_style1 .p_no_d { border: 1px solid #21748d !important; color: #fff; background-color: #21748d !important; } .pb_sys_style8 .p_no_d, .pb_sys_style8 .p_no a:hover { border: 1px solid #21748d !important; color: #fff; background-color: #21748d !important; } .page-content { margin: 0 auto; min-height: 400px; padding: 50px 0; } .page-content .article-title { padding-bottom: 30px; } .page-content .article-title h3 { font-size: 30px; color: #333; text-align: center; font-weight: normal; padding-bottom: 20px; font-family: "微软雅黑"; } .page-content .article-title .article-author { font-size: 14px; color: #999999; text-align: center; } .page-content .article { padding: 50px 0; border-top: 1px solid #E1E1E1; border-bottom: 1px solid #E1E1E1; font-size: 14px; font-family: "宋体"; } #myList-nav { margin: 30px 0; } #myList-nav .ln-letters a { width: 31px; height: 31px; line-height: 31px; text-align: center; color: #fff; background: #029696; margin: 5px 10px 5px 0; border-radius: 20px; font-size: 16px; display: block; float: left; text-decoration: none; } #myList-nav .ln-letters a.ln-disabled { color: #999; background: #efeeee; } #myList { clear: both; padding: 30px 0; min-height: 400px; } #myList ul { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; } #myList ul li { width: calc((100%) / 7); margin-bottom: 40px; padding: 0 0 10px 0; } #myList ul li:nth-of-type(6n+0) { margin-right: 0; } #teacherlist-content { padding: 30px 0; min-height: 500px; } #teacherlist-content .teacherlist-header { width: 100%; font-size: 20px; color: #000; font-weight: 700; height: 64px; line-height: 64px; padding-left: 44px; background: #f1f4f8; position: relative; } #teacherlist-content .teacherlist-header::after { content: ""; position: absolute; left: 29px; top: 50%; width: 4px; height: 21px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); background: #029696; } #teacherlist-content .teacherlist-wrapper { padding: 35px 0 13px 0; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; } #teacherlist-content ul li { width: calc((100%) / 6); margin-bottom: 20px; padding: 0 0 10px 0; } #teacherlist-content ul li a { color: #000; font-size: 16px; } #teacherlist-content ul li #teacherlist-content ul li:nth-of-type(6n+0) { margin-right: 0; } #list-content .article-title { padding-bottom: 30px; } #list-content .article-title h3 { font-size: 24px; color: #333; text-align: center; font-weight: normal; padding-bottom: 20px; font-family: "微软雅黑"; line-height: 35px; } #list-content .article-title .article-author { font-size: 14px; color: #999999; text-align: center; } #list-content .article { padding: 50px 0; border-top: 1px solid #E1E1E1; border-bottom: 1px solid #E1E1E1; font-size: 16px; font-family: "宋体"; color: #000; line-height: 30px; min-height: 400px; } #user-info { width: 100%; min-height: 400px; padding: 0 0 50px 0; margin: 0 0 50px 0; } #user-info .basic-info { display: flex; flex-direction: row; justify-content: space-between; } #user-info .basic-info img { width: 200px; height: 250px; } #user-info .basic-info .detail-info { width: 700px; display: flex; flex-direction: column; } #user-info .basic-info .detail-info .user-item { display: flex; flex-direction: row; justify-content: space-between; height: 32px; line-height: 32px; margin-bottom: 24px; } #user-info .basic-info .detail-info .user-item .left-wrapper, #user-info .basic-info .detail-info .user-item .right-wrapper { width: 50%; display: flex; flex-direction: row; font-size: 16px; color: #000; } #user-info .basic-info .detail-info .user-item .left-wrapper p:first-child, #user-info .basic-info .detail-info .user-item .right-wrapper p:first-child { margin-right: 10px; } #user-info .other-info .other-info-wrapper { display: flex; flex-direction: column; margin-top: 20px; } #user-info .teachercontent-header { width: 100%; font-size: 20px; color: #000; font-weight: 700; height: 64px; line-height: 64px; padding-left: 44px; background: #f1f4f8; position: relative; } #user-info .teachercontent-header::after { content: ""; position: absolute; left: 29px; top: 50%; width: 4px; height: 21px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); background: #029696; } #user-info .teachercontent-wrapper { width: 100%; padding: 20px 0; line-height: 30px; font-size: 16px; color: #000; text-align: justify; } #teacher-detail { width: 100%; margin-bottom: 50px; min-height: 400px; display: flex; flex-direction: column; } #teacher-detail .teacher-item { display: flex; flex-direction: row; margin-bottom: 20px; border-bottom: 1px dashed #ccc; padding: 0 0 20px 0; } #teacher-detail .teacher-item .img-wrapper { width: 200px; height: 240px; position: relative; margin-right: 20px; } #teacher-detail .teacher-item .img-wrapper img { width: 200px; height: 240px; } #teacher-detail .teacher-item .img-wrapper .username { position: absolute; left: 0; color: #fff; width: 200px; bottom: 20px; height: 41px; line-height: 41px; font-size: 22px; background: linear-gradient(300deg, transparent 30px, #029696 0) top right; background-size: 100% 100%; background-repeat: no-repeat; text-align: center; } #teacher-detail .teacher-item .text-wrapper { width: 760px; height: 182px; height: 240px; } #teacher-detail .teacher-item .text-wrapper p { font-size: 16px; color: #595757; line-height: 40px; } #teacher-detail .teacher-item .text-wrapper p.title { color: #029696; } #list1-content { display: flex; flex-direction: column; min-height: 500px; } #list1-content ul li a { display: flex; flex-direction: row; justify-content: space-between; margin-bottom: 15px; border-bottom: 1px solid #e0e0e0; color: #555; font-size: 16px; color: #000; line-height: 40px; height: 40px; padding-bottom: 5px; font-weight: normal; } #li7 a { color: red !important; } #li7 .sub a { color: #000 !important; } #list1-content ul li a span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #list1-content ul li a em { width: 360px; text-align: right; } #list1-content ul li a:hover { color: #029696; } #myList2 { clear: both; min-height: 400px; margin: 20px 0 50px 0; } #myList2 dl { border-bottom: 1px dashed #ddd; overflow: hidden; padding: 12px 0; display: flex; flex-direction: row; } #myList2 dl dt { color: #029696; font-size: 16px; font-weight: 600; line-height: 35px; margin-right: 20px; } #myList2 dl dd { line-height: 35px; text-align: justify; } #myList2 dl dd a { margin-right: 30px; font-size: 14px; color: #000; } #myList2 dl dd a:hover { color: #029696; text-decoration: underline; } /*single channel list*/ .list-container .list3-content-wrapper { width: 1320px; } .list-container .list3-content-wrapper .position-wrapper { width: 1320px; display: flex; flex-direction: row; justify-content: space-between; margin: 20px 0; height: 50px; line-height: 50px; font-size: 16px; color: #999; border-bottom: 1px solid #c1c1c1; height: 50px; padding-bottom: 10px; } .list-container .list3-content-wrapper .position-wrapper .position-name { color: #21748d; font-size: 28px; font-weight: 700; line-height: 66px; padding-left: 16px; position: relative; z-index: 1; } .list-container .list3-content-wrapper .position-wrapper .position-name::after { content: ""; position: absolute; left: 0; top: 34px; width: 5px; height: 29px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); background: #5c8ba7; } #list3-content { display: flex; flex-direction: column; min-height: 500px; } #list3-content ul li a { display: flex; flex-direction: row; justify-content: space-between; margin-bottom: 15px; border-bottom: 1px solid #e0e0e0; color: #555; font-size: 16px; color: #000; line-height: 40px; height: 40px; padding-bottom: 5px; font-weight: normal; } #list3-content ul li a span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #list3-content ul li a em { width: 360px; text-align: right; } #list3-content ul li a:hover { color: #029696; } .page-content .position-wrapper { width: 1320px; display: flex; flex-direction: row; justify-content: space-between; margin: 0 0 30px 0; height: 50px; line-height: 50px; font-size: 16px; color: #999; border-bottom: 1px solid #c1c1c1; height: 50px; padding-bottom: 10px; } .page-content .position-wrapper .position-name { color: #21748d; font-size: 28px; font-weight: 700; line-height: 66px; padding-left: 16px; position: relative; z-index: 1; } .page-content .position-wrapper .position-name::after { content: ""; position: absolute; left: 0; top: 34px; width: 5px; height: 29px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); background: #5c8ba7; }