* { margin: 0px; padding: 0px; -webkit-box-sizing: border-box; box-sizing: border-box; font-family: "Microsoft Yahei"; } li { list-style: none; } a { text-decoration: none; } body{ position: relative; } .header_center { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; background-color: rgba(0, 0, 0, 0); position: fixed; top: 0px; left: 0px; z-index: 99; width: 100%; } .header_center>div:first-child { height: 120px; display: flex; justify-content: space-around; align-items: center; max-width: 1300px; width: 100%; } .nav_box { max-width: 1300px; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; } .nav_pc { width: 100%; position: relative; } .nav_pc1 { width: 100%; -ms-flex-negative: 1; flex-shrink: 1; } .nav_pc2 { width: 30%; -ms-flex-negative: 0; flex-shrink: 0; } .nav_pc>a.search_btn { background-image: url(../img/search.png); display: block; background-repeat: no-repeat; background-position: center center; background-size: contain; position: absolute; right: 12px; top: 16px; width: 24px; height: 24px; } .nav_pc>ul { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; } .nav_pc1>ul>li { width: 16.6%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 54px; line-height: 54px; position: relative; } .nav_pc2>ul>li{ width: 20%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 48px; line-height: 48px; position: relative; } .nav_pc2>ul>li:after { content: "\\"; display: block; position: absolute; color: #fff; right: 0px; top: 0px; } .nav_pc2>ul>li:last-child:after { display: none; } .nav_pc>ul>li>a { color: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .nav_pc>ul>li>a>img { width: 28px; } .nav_pc>ul>li:hover { background-color: #aaa; } .nav_pc>ul>li:hover>ul { display: block; } .nav_pc>ul>li>ul{ display: none; position: absolute; top: 54px; z-index: 99; left: 0px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; } .nav_pc>ul>li>ul>li { background-color: rgba(0, 0, 0, .4); line-height: 48px; height: 48px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .nav_pc>ul>li>ul>li>a:after { content: ""; } .nav_pc>ul>li>ul>li>a { color: #fff; } .nav_pc>ul>li>ul>li:hover { background-color: #aaa; } #menu_mob { display: none; } .nav_mob { display: none; } @media screen and (max-width: 1000px) { .header_center { padding-top: 0px; position: fixed; background-color: #7d0000; } .banner{ margin-top: 100px; } .header_center>div:first-child { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin: 0px; padding: 36px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 100px; } .logo_l_decor, .logo_r_decor { display: none; } .header_center>div:first-child>img { margin: 0px; width: 35vw; } .nav_pc { display: none; } #menu_mob { width: 57px; background-image: url(../img/menu.png); height: 57px; background-repeat: no-repeat; background-position: center center; outline: none; border: none; float: right; display: block; background-size: 60% 60%; background-color: rgba(0,0,0,0); } .nav_mob { display: none; position: fixed; top: 0; right: 0; bottom: 0; width: 100%; z-index: 99; font-size: 18px; } .nav_mob .bg { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 99; background-color: rgba(0, 0, 0, .43) } .nav_mob>ul { float: right; width: 61.8%; max-height: 100%; background-color: #9b0d14; padding: 10px 0 10px; overflow: hidden; overflow-y: auto; position: relative; z-index: 100; } .nav_mob>li { overflow: hidden } .nav_mob .v1 { display: block; font-size: 16px; color: #fff; position: relative; padding: 0px 20px; margin: 13px 0px; text-align: left; } .nav_mob div { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; } .nav_mob div i { display: block; width: 36px; height: 36px; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAACXBIWXMAAAsTAAALEwEAmpwYAAAF7mlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDUgNzkuMTYzNDk5LCAyMDE4LzA4LzEzLTE2OjQwOjIyICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIiB4bWxuczpwaG90b3Nob3A9Imh0dHA6Ly9ucy5hZG9iZS5jb20vcGhvdG9zaG9wLzEuMC8iIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKFdpbmRvd3MpIiB4bXA6Q3JlYXRlRGF0ZT0iMjAyMC0xMi0wMVQxMjo0OTowMyswODowMCIgeG1wOk1vZGlmeURhdGU9IjIwMjAtMTItMDFUMTI6NDk6NTgrMDg6MDAiIHhtcDpNZXRhZGF0YURhdGU9IjIwMjAtMTItMDFUMTI6NDk6NTgrMDg6MDAiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MWQ3NzVkYzUtZjg4ZC02ZjRkLTlmYmUtYzI0NzBiMWZhODE2IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjg5MkI5NjI3MzM5MDExRUJCQjhBODJGNkZFNkNGNzU3IiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6ODkyQjk2MjczMzkwMTFFQkJCOEE4MkY2RkU2Q0Y3NTciIGRjOmZvcm1hdD0iaW1hZ2UvcG5nIiBwaG90b3Nob3A6Q29sb3JNb2RlPSIzIiBwaG90b3Nob3A6SUNDUHJvZmlsZT0ic1JHQiBJRUM2MTk2Ni0yLjEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo4OTJCOTYyNDMzOTAxMUVCQkI4QTgyRjZGRTZDRjc1NyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo4OTJCOTYyNTMzOTAxMUVCQkI4QTgyRjZGRTZDRjc1NyIvPiA8eG1wTU06SGlzdG9yeT4gPHJkZjpTZXE+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJzYXZlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDoxZDc3NWRjNS1mODhkLTZmNGQtOWZiZS1jMjQ3MGIxZmE4MTYiIHN0RXZ0OndoZW49IjIwMjAtMTItMDFUMTI6NDk6NTgrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE5IChXaW5kb3dzKSIgc3RFdnQ6Y2hhbmdlZD0iLyIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6Ft5eaAAABV0lEQVRoge3aoUtDURTH8e+GZtvQZFObYZhMFhEENSwNLNa5YJJlw7KwZBQGRhHr/gK7CxZtJoOMFcGfYRe8QYTp5e69s/OFV7Z3zzufMl5YRRLzVHXWC+TOwdZzsPUcbD0HW8/B1nOw9RxsPQdbz8HWc7D1HJyhJWAI3M/g2dnBVWAAbAD7QC/z87ODB0AdeATegRbQzbqBpFzXrSa9SFqUtKXvznPtkQvbD7BXSSvR540I3bIC7gXQSNLaD9+fROhm2cHdAPmQtPnLfe0IfVhWcCdCbE95/07ZwKfR8rtTnLsIZz41+VErBbgZYRt/OH8Zzo4lrRcdfBRhj/8x5yrMeJO0WlTwXoRtJ5h3E2Y9S1ouIngYFuwknHkXZj6kmrmQ8KXtDKgB1wlnHgB94CnVwIrkf2oxnYOt52DrOdh6Draeg63nYOs52HoOtp6Dredg680d+AsnGUbJBL+EygAAAABJRU5ErkJggg==') center center no-repeat; -ms-background-size: cover; background-size: cover; } .nav_mob>ul>li.on div i { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAACXBIWXMAAAsTAAALEwEAmpwYAAAF5WlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDUgNzkuMTYzNDk5LCAyMDE4LzA4LzEzLTE2OjQwOjIyICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIiB4bWxuczpwaG90b3Nob3A9Imh0dHA6Ly9ucy5hZG9iZS5jb20vcGhvdG9zaG9wLzEuMC8iIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKFdpbmRvd3MpIiB4bXA6Q3JlYXRlRGF0ZT0iMjAyMC0xMi0wMVQxMjo0OToxMiswODowMCIgeG1wOk1vZGlmeURhdGU9IjIwMjAtMTItMDFUMTI6NTArMDg6MDAiIHhtcDpNZXRhZGF0YURhdGU9IjIwMjAtMTItMDFUMTI6NTArMDg6MDAiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6ODNhNzM4ZGMtZGIyYi1iNDRlLTg2N2MtNzU0N2QzYjZjMThlIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjhFNkQxQzU1MzM5MDExRUI4N0EzRTM1MDExNzk2MUExIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6OEU2RDFDNTUzMzkwMTFFQjg3QTNFMzUwMTE3OTYxQTEiIGRjOmZvcm1hdD0iaW1hZ2UvcG5nIiBwaG90b3Nob3A6Q29sb3JNb2RlPSIzIiBwaG90b3Nob3A6SUNDUHJvZmlsZT0ic1JHQiBJRUM2MTk2Ni0yLjEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo4RTZEMUM1MjMzOTAxMUVCODdBM0UzNTAxMTc5NjFBMSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo4RTZEMUM1MzMzOTAxMUVCODdBM0UzNTAxMTc5NjFBMSIvPiA8eG1wTU06SGlzdG9yeT4gPHJkZjpTZXE+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJzYXZlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDo4M2E3MzhkYy1kYjJiLWI0NGUtODY3Yy03NTQ3ZDNiNmMxOGUiIHN0RXZ0OndoZW49IjIwMjAtMTItMDFUMTI6NTArMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE5IChXaW5kb3dzKSIgc3RFdnQ6Y2hhbmdlZD0iLyIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6UsDuwAAABb0lEQVRoge3ar0tDURiH8e8GZqsmm0aDmEwWWRA0LA00WN2y2ATDsqDFPjCK/4BVNItJ0GYSBLEIPoZ7Lp4gwtw558rr+8BgP+55937KhcFagP5T7aYXKJ2Dredg6znYeg62noOt52DrOdh6Draeg63nYOs5eII6krYTzqsbSTpINg1I9bijaj/hzIsw8ybVzJTgDl8NEsw7C7MegJm/CBawGaG3JphzGmY8A3Mpd0wNFtCL0N1fnD8KZ9+AhdT75QAL6EfotTHOHYYzH8Byjt1ygUV186pbGfP61Vx75QQLGAbAO7D4w3WDCLuRc6fcYAHHAfIKzH/z+U6E7eXepwRYwCiAnoDZ6P1uhN0tsUspsIDzAHsEpqhuSnV7pfYoCRZwGYC3wEt4Piy5QwuK/uWhLela0lJ4fSKpX3KB0mBJmpZ0Jele0nrpL28C3Gj+e9h6Draeg63nYOs52HoOtp6Dredg6znYeg62noOt9wl3cgDsLvhXzwAAAABJRU5ErkJggg==') } .nav_mob>ul>li>ul { display: none; background-color: #a5161c; padding-bottom: .04rem; overflow: hidden } .nav_mob>ul>li>ul>li { border-bottom: 1px solid #9b0d14; overflow: hidden; } .nav_mob>ul>li>ul>li:last-child { border-bottom: none } .nav_mob>ul>li>ul>li a { display: block; font-size: 14px; color: #fff; line-height: 36px; overflow: hidden; padding-left: 34px; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis; text-align: left; } .nav_mob form{ width: 61.8%; float: right; position: relative; z-index: 100; background-color: #0c7863; border-top: 1px solid #aaa; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .nav_mob form>input{ width: 100%; padding: 5px; background-color: #0c7863; border: none; outline: none; color: #fff; line-height: 32px; float: left; } .nav_mob form>button{ width: 50px; height: 42px; background-image: url(../images/search_icon.png); background-color: #055243; background-repeat: no-repeat; background-size: 27px 27px; background-position: center center; float: right; outline: none; border: none; } } @media screen and (max-width: 640px) { .header_center>div:first-child>a>img{ width: 50vw; } } /* @media screen and (max-width: 400px) { .nav_mob>ul>li>a { letter-spacing: 0px; font-size: 13px; } } */ .banner{ width: 100%; max-width: 1920px; overflow: hidden; } .banner img{ display: block; width: 100%; } .middle_list{ width: 100%; max-width: 10000000px; } .middle_list_center{ display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 24px; max-width: 1300px; margin: 0 auto; padding-top: 24px; } .column_title { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .column_title>div{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .column_title>div>p:first-child{ font-size: 22px; -moz-text-align-last: justify; line-height: 54px; border-bottom: 1px solid #4f4b4b; color: #7d0000; font-weight: bold; } .column_title>div>p:last-child{ color: #000; font-size: 16px; line-height: 36px; text-transform: uppercase; letter-spacing: 2px; position: relative; padding-bottom: 8px; margin-top: 10px; margin-bottom: 10px; line-height: 20px; } .column_title>div>p:last-child:after{ content: ""; position: absolute; display: none; width: 20px; height: 4px; background-color: #7d0000; left: 0px; bottom: -4px; } .column_title>a { color: #aaa; font-size: 17px; letter-spacing: 2px; -ms-flex-item-align: start; align-self: flex-start; margin-top: 16px; white-space: nowrap; opacity: 0; } .column_title_tab { display: -webkit-box; display: -ms-flexbox; display: flex; height: 50px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; border-bottom: 1px solid #aaa; } .column_title_tab>a { color: #666; } .column_title_tab>div>span { margin-left: 6px; margin-right: 6px; } .column_title_tab>div>p { font-size: 20px; letter-spacing: 3px; color: #ddd; } .column_title_tab>div>p:hover { cursor: pointer; } .column_title_tab>div>p.active { color: #7d0000; } .column_title_tab>div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media screen and (max-width: 768px) { .column_title_tab>div>p { font-size: 16px; letter-spacing: 0px; color: #ddd; } } .tab_btn { width: 150px; min-width: 150px; } .tab_block { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } /*.tab_btn { width: 140px; }*/ .tab_group_title { width: 100%; padding: 0px 15%; color: #fff; background-color: #7d0000; text-align: center; height: 56px; line-height: 56px; font-size: 18px; letter-spacing: 2px; overflow:hidden; } .tab_group { margin-top: 24px; width: 100%; } .tab_group>li { width: 100%; background-color: #f2f0ec; min-height: 36px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 16px; font-size: 16px; line-height: 36px; justify-content: center; } .tab_group>li>a { display: block; text-align: center; width: 100%; color: #504b4c; } .tab_group>li:hover>a { color: #000; } .tab_group>li:last-child { border: none; } @media screen and (max-width: 1000px){ .middle_list_center{ padding: 12px; } } @media screen and (max-width: 640px) { body{ background-color: #f5f5f5; } .middle_list_center { display: -webkit-box; display: -ms-flexbox; display: flex; background-color: #f5f5f5; padding: 2vw; padding-top: 24px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .banner { position: relative; height:250px; overflow: hidden; } .banner img{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); height: 100%; width: auto; } .column_title>p { font-size: 14px; line-height: 42px; border-bottom: 1px solid #4f4b4b; color: #7d0000; letter-spacing: 2px; } .column_title>a{ font-size: 14px; } .tab_btn{ display: none; } } @media screen and (max-width: 420px) { .tab_btn{ width: 100px; min-width: 100px } .tab_group_title,.tab_group>li{ padding-right: 20px; padding-left: 8px; } } /*移动tab*/ .sub_columns{ padding: 10px 0px; display: none; } .now_column{ background-color: #7d0000; display: -webkit-box; display: -ms-flexbox; display: flex; color: #fff; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 10px 8px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 36px; width: 100%; } .now_column img{ } .sub_columns ul{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 0px; overflow: hidden; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } .sub_columns ul li{ list-style: none; width: 100%; border-bottom: 1px solid #eee; background-color: #ddd; } .sub_columns ul li a{ height: 36px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-left: 10px; font-size: 14px; color:#333; } .sub_columns ul li.selected{ background-color: #666; } .sub_columns ul li.selected a{ color: #fff; } @media screen and (max-width: 640px){ .sub_columns{ display: block; } } /*教师列表*/ .teacher_list{ margin-left: 24px; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; padding: 24px; padding-top: 0px; } .teacher_group{ display: -webkit-box; display: -ms-flexbox; display: flex; padding-top: 12px; background-color: #f2f0ec; padding-bottom: 12px; margin-top: 12px; flex-direction:column; } .teacher_group_name{ font-size: 18px; text-align: center; letter-spacing: 15px; line-height: 36px; } .teacher_group ul{ -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-right: 1.5%; padding-left: 1.5%; } .teacher_group ul>li{ width: 33%; } .teacher_group ul>li:nth-child(n+4){ margin-top: 24px; } .teacher_group ul>li>a{ display: block; position: relative; width: 100%; padding-right: 78px; } .dir_teacher_group{ flex-direction: column; } .dir_teacher_group>.teacher_group_name{ width: 100%; font-size: 18px; letter-spacing: 4px; color: #7d0000; text-align: center; line-height: 72px; } .dir_teacher_group>.teacher_group_name>a{ color: #7d0000; } .dir_teacher_group>ul{ padding-right: 12px; padding-left: 12px; } .dir_teacher_group>ul>li>a{ display: block; position: relative; width: 100%; padding-right: 144px; } .teacher_group ul>li>a>p{ position: absolute; width: 78px; padding: 4px; right: 0px; font-size: 16px; color: #1c354b; line-height: 32px; bottom: 0px; } .dir_teacher_group>ul>li>a>p{ bottom: unset; top: -4px; width:144px; } .teacher_group ul>li>a>p>span{ display: block; } .teacher_name{ background-color: #b4b4b4; color: #fff; padding: 2px 4px; } .teacher_group ul>li>a>div{ position: relative; width: 100%; padding-top: 145%; overflow: hidden; } .teacher_group ul>li>a>div>img{ position: absolute; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); left: 50%; top: 50%; height: 100%; } @media screen and (max-width: 1000px) { .teacher_group ul>li>a{ padding-right: 76px; } .teacher_group ul>li>a>p{ font-size: 14px; line-height: 21px; width: 76px; } } @media screen and (max-width: 878px){ .teacher_group{ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding-left: 12px; } .teacher_group_name{ line-height: 48px; padding-left: 0px; } .teacher_group ul>li{ width: 48%; } .teacher_group ul>li:nth-child(n+3){ margin-top: 24px; } } @media screen and (max-width: 640px) { .teacher_list{ padding-top: 0px; padding-right: 0px; margin-left: 0px; padding-left: 0px; } .teacher_group_name{ font-size: 16px; width: 180px; letter-spacing: 2px; } .teacher_group{ padding-top: 0px; padding-left: 0px; background-color: #f5f5f5; } .teacher_group ul>li>a{ padding-right: 60px; } .teacher_group ul>li>a>p{ font-size: 10px; width: 60px; line-height: 16px; bottom: 0px; } .column_title>div>p:first-child{ font-size: 16.81px; line-height: 36px; } .column_title>div>p:last-child{ font-size: 16px; } .column_title>div>a{ font-size: 14px; } .column_title>a{ font-size: 14px; color: #333; } } @media screen and (max-width: 540px){ .teacher_group ul>li{ width: 80%; } .teacher_group ul>li:nth-child(n+2){ margin-top: 24px; } } @media screen and (max-width: 440px){ .teacher_group ul>li{ width: 100%; } } /*学术实践*/ .advertisement_list{ width: 100%; -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; } .advertisement_list ul{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-top: 24px; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .advertisement_list ul>li{ width: 32%; padding-bottom: 136px; background-color: #f2f0ec; position: relative; margin-bottom: 24px; } .advertisement_list ul>li:after{ content: ""; position: absolute; width: 20px; height: 4px; background-color: #00343f; left: 12px; bottom: 18px; } .advertisement_list ul>li>a{ display: block; width: 100%; background-color: #f2f0ec; color: #666; } .advertisement_list ul>li>a>img{ width: 100%; } .advertisement_list ul>li>a>p{ padding: 2px 14px; line-height: 20px; font-size: 16px; color: #666; padding-top: 6px; } .advertisement_list ul>li>a>span{ color: #666; position: absolute; bottom: 12px; right: 12px; } @media screen and (max-width: 640px){ .advertisement_list ul>li{ width: 48%; } .advertisement_list ul>li:nth-child(n+3){ margin-top: 12px; } } @media screen and (max-width: 400px){ .advertisement_list ul>li{ width: 100%; } } /*教师介绍三级页面*/ .teacher_info{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-top: 36px; background-color: #f2f0ec; padding-left: 36px; margin-top: 12px; } .teacher_card{ width: 300px; padding-right: 82px; position: relative; -ms-flex-item-align: start; align-self: flex-start; min-width: 300px; } .teacher_intro{ max-width: 620px; padding-right: 80px; } .teacher_card>p{ position: absolute; width: 82px; padding: 4px; padding-left: 8px; right: 0px; color: #1c354b; line-height: 28px; bottom: 0px; } .teacher_card>p>span{ display: block; } .teacher_name{ background-color: #b5b5b5; color: #fff; padding: 2px 4px; } .teacher_card>div{ position: relative; width: 100%; padding-top: 145%; } .teacher_card>div>img{ position: absolute; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); left: 50%; top: 50%; width: 100%; max-width: 100%; max-height: 100%; } .intro_title{ letter-spacing: 4px; font-size: 18px; color: #666; margin-bottom: 24px; } .intro_item>p{ background-color: #b5b5b5; color: #fff; font-size: 14px; display: inline-block; padding: 4px } .intro_item>div>p{ color: #333; line-height: 28px; margin-top: 18px; margin-bottom: 18px; } @media screen and (max-width: 1150px){ .teacher_intro{ padding-right: 12px; padding-left: 12px; } } @media screen and (max-width: 800px){ .teacher_info{ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-left: 12px; background-color: #f5f5f5; padding-top: 12px; } .teacher_card{ -ms-flex-item-align: start; align-self: flex-start; margin-left: 0px; } .teacher_intro{ margin-top: 24px; padding-left: 0px; } .intro_title{ display: none; } } @media screen and (max-width: 520px){ .teacher_card{ width: 100%; margin-left: 0px; min-width: 0px; max-width: 300px; } .teacher_info{ padding-left: 0px; padding-top: 12px; } .teacher_card{ padding-right: 72px; } .teacher_card>p{ width: 72px; padding-left: 4px; } .intro_item>div>p{ font-size: 16px; line-height: 24px; } .teacher_card>p{ font-size: 16px; line-height: 28px; } } /*学院概况*/ .school_info{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding-top: 36px; -ms-flex-wrap: wrap; flex-wrap: wrap; background-color: #f2f0ec; padding-left: 12px; padding-right: 12px; padding-bottom: 36px; } .school_info>div{ width: 46%; } .school_images img{ width: 100%; margin-bottom: 12px; } @media screen and (max-width: 640px){ .school_info>div{ width: 100%; } .school_info{ background-color: #f5f5f5; padding-left: 0px; padding-right: 0px; } } .text_list{ background-color: #f2f0ec; padding: 0px 12px; } .text_list>ul{ } .text_list>ul>li:last-child{ border-bottom: none; } .text_list>ul>li{ padding-top: 24px; padding-bottom: 24px; border-bottom: 1px solid #333; padding-right: 36px; width: 100%; } .text_list>ul>li>a{ color: #666; } .text_list>ul>li>a:hover{ color: #000; } @media screen and (max-width: 640px){ .text_list{ background-color: #f5f5f5; padding: 0px; } } .advertisement{ max-width: 1300px; margin: 0 auto; margin-top: 36px; } .advertisement ul{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-top: 24px; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .advertisement ul>li{ width: 23%; padding-bottom: 136px; background-color: #f2f0ec; position: relative; } .advertisement ul>li:after{ content: ""; position: absolute; width: 20px; height: 4px; background-color: #00343f; left: 12px; bottom: 18px; } .advertisement ul>li>a{ display: block; width: 100%; background-color: #f2f0ec; } .advertisement ul>li>a>img{ width: 100%; } .advertisement ul>li>a>p{ padding: 2px 14px; line-height: 20px; font-size: 16px; color: #666; padding-top: 6px; } .advertisement ul>li>a>span{ color: #666; position: absolute; bottom: 12px; right: 12px; } @media screen and (max-width: 1000px){ .advertisement ul>li{ width: 32%; } .advertisement ul>li:nth-child(n+4){ display: none; } } @media screen and (max-width: 640px){ .advertisement ul{ -ms-flex-wrap: wrap; flex-wrap: wrap; } .advertisement ul>li{ width: 45%; } .advertisement ul>li:nth-child(n+3){ width: 100%; margin-top: 24px; } .advertisement ul>li:nth-child(4){ display: block; } .practice{ display: none; } } .xsgz_list { display: flex; flex-wrap: wrap; justify-content: space-between; } .xsgz_list>div { width: 45%; } .list_title { display: flex; justify-content: space-between; align-items: center; height: 45px; border-bottom: 1px solid #aaa; } .list_title>p { font-size: 18px; color: #7d0000; letter-spacing: 2px; } .list_title>a { color: #666; } .xsgz_list>div { margin-top: 12px; } .xsgz_list>div>ul>li:last-child {} .xsgz_list>div>ul>li { padding-top: 8px; padding-bottom: 8px; padding-right: 36px; width: 100%; } .xsgz_list>div>ul>li>a { color: #666; } .xsgz_list>div>ul>li>a:hover { color: #000; } @media screen and (max-width: 1000px) { .xsgz_list { flex-direction: column; } .list_title>p, .list_title { font-size: 14px; } .xsgz_list>div:nth-child(2n) { padding-left: 0px; } .xsgz_list>div { width: 100%; } } .faculty_list{ padding-top: 24px; } .faculty_list>p,.teacher_list>p{ text-align: center; font-size: 20px; color: #7d0000; line-height: 54px; margin-bottom: 36px; } .faculty_list>p>a,.teacher_list>p>a{ color: #7d0000; } .faculty_list ul{ display: flex; flex-wrap: wrap; justify-content: space-between; } .faculty_list ul li{ width: 45%; margin-bottom: 24px; } .faculty_list ul li:hover a{ text-decoration: underline; } .faculty_list ul li a { display: block; text-align: center; color: #333; } .faculty_list ul li a img{ width: 350px; height: 175px; } .faculty_list ul li a p{ font-size: 20px; line-height: 28px; } @media screen and (max-width: 900px){ .faculty_list ul li a img{ width: 280px; height: 140px; } } @media screen and (max-width: 768px){ .faculty_list ul li{ width: 100%; } .faculty_list ul li a p{ font-size: 16px; } } .article_title{ font-size: 24px; color: #666; line-height: 28px; margin-top: 12px; margin-bottom: 12px; text-align: center; } .article_info{ font-size: 14px; color: #9e9a9a; line-height: 18px; margin-top: 6px; margin-bottom: 6px; text-align: center; letter-spacing: 2px; } .article_content{ color: #666; line-height: 28px; } .article_content p{ } .footer{ background-color: #f2f0ec; padding-top: 32px; margin-top: 48px; padding-bottom: 24px; } .footer_center{ max-width: 1300px; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-negative: 1; flex-shrink: 1; } .footer_right{ display: -webkit-box; display: -ms-flexbox; display: flex; width: 75%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .contact_us { width: 25%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: auto; min-width: 235px; -ms-flex-negative: 0; flex-shrink: 0 } .contact_us>img { width: 190px; height: 130px; margin-top: 12px; } .contact_item { padding: 8px; padding-right: 18px; margin-top: 16px; } .contact_item p { font-size: 14px; display: -webkit-box; display: -ms-flexbox; display: flex; margin: 10px 0px; } .column_title>div>p:first-child>span{ color: #ddd; } .column_title>div>p:first-child>span.active{ color:#7d0000; } .contact_item p span:first-child { display: block; padding-right: 12px; text-align: justify; -moz-text-align-last: justify; text-align-last: justify; width: 72px; position: relative; -ms-flex-negative: 0; flex-shrink: 0; } .contact_item p span:first-child:after { content: ":"; position: absolute; right: 5px; top: 1px; display: block; color: #000; } .contact_item p span:last-child { display: block; } .group_logo{ display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; padding-right: 20%; margin-top: 12px; padding-bottom: 12px; } .group_logo img{ } .links { width: 100%; } .links ul { padding-top: 24px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap:wrap; flex-wrap:wrap; justify-content: space-between; } .links ul li { margin-bottom: 12px; } .links ul li img { height: 65px; } @media screen and (max-width: 1000px){ .footer_right{ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .links{ width: 100%; padding-bottom: 0px; padding-top: 0px; } .links ul{ display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-top: 18px; } } @media screen and (max-width: 768px) { .links ul{ justify-content: space-between; } .links ul li{ width: 46%; } .links ul li img { width: 100%; height: auto; } } @media screen and (max-width: 640px) { .footer .column_title{ padding: 0px; } .footer{ padding: 8px; overflow: hidden; } .footer_center{ width: 100%; } .contact_us{ min-width: 0px; width: 50%; } .group_logo{ padding-right: 0px; display: none; } .links{ margin-bottom: 64px; padding-left: 0px; } .footer { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; padding: 8px; } } @media screen and (max-width: 400px) { .footer_right{ width: 40%; } .contact_us{ width: 60%; } .links ul{ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .links ul li{ width: 100%; } .links ul li:nth-child(n+6){ display: none; } .links ul li a img{ width: 100%; height: auto; } }