/*手机端导航*/ .mobile { width: 100%; position: absolute; display: none; top: 0px; right: 0; z-index: 99991 } .mobile_title { width: 100%; float: left; color: #fff; position: absolute; left: 0; top: 0; width: 50%; height: 50px; line-height: 50px; text-align: center; font-size: 14px; font-weight: normal; } .mobile_title a { float: left; margin-left: 10px; color: #fff; line-height: 31px; height: 31px; } .mobile-inner-header { width: auto; height: 42px; position: absolute; top: 13px; right: 5px; } .mobile-inner-header-icon { color: #ffffff; height: 40px; font-size: 25px; text-align: center; float: right; width: 40px; position: relative; -webkit-transition: background 0.5s; -moz-transition: background 0.5s; -o-transition: background 0.5s; transition: background 0.5s; } .mobile-inner-header-icon:hover { opacity: 0.8; cursor: pointer; } .mobile-inner-header-icon span { position: absolute; left: calc((100% - 25px) / 2); top: calc((100% - 1px) / 3); width: 25px; height: 2px; background-color: rgba(255, 255, 255, 1); } .mobile-inner-header-icon span:nth-child(1) { transform: translateY(4px) rotate(0deg); } .mobile-inner-header-icon span:nth-child(2) { transform: translateY(-4px) rotate(0deg); } .mobile-inner-header-icon-click span:nth-child(1) { animation-duration: 0.5s; animation-fill-mode: both; animation-name: clickfirst; } .mobile-inner-header-icon-click span:nth-child(2) { animation-duration: 0.5s; animation-fill-mode: both; animation-name: clicksecond; } .mobile-inner-header-icon { color: #fff; height: 31px; float: right; width: 32px; position: relative; cursor: pointer; font-weight: bold; text-align: center; margin-top: 5px; background: #fff; z-index: 9999; } .mobile-inner-header-icon-out span { width: 24px; height: 2px; background-color: #444; display: block; } .mobile-inner-header-icon-out span:nth-child(1) { animation-duration: 0.5s; animation-fill-mode: both; animation-name: outfirst; } .mobile-inner-header-icon-out span:nth-child(2) { animation-duration: 0.5s; animation-fill-mode: both; animation-name: outsecond; } .mobile-inner-header-icon-out span:nth-child(2) { animation-duration: 0.5s; animation-fill-mode: both; animation-name: outthird; } .mobile-inner-header-icon-click { background: none; margin-top: 10px; } .mobile-inner-header-icon span:nth-child(1) { transform: translateY(4px) rotate(0deg); } .mobile-inner-header-icon span:nth-child(2) { transform: translateY(-4px) rotate(0deg); } .mobile-inner-header-icon span:nth-child(3) { transform: translateY(-4px) rotate(0deg); } .mobile-inner-header-icon-click span:nth-child(1) { animation-duration: 0.5s; animation-fill-mode: both; animation-name: clickfirst; } .mobile-inner-header-icon-click span:nth-child(2) { animation-duration: 0.5s; animation-fill-mode: both; animation-name: clicksecond; } .mobile-inner-header-icon-click span:nth-child(3) { animation-duration: 0.5s; animation-fill-mode: both; animation-name: clickthird; } @keyframes clickfirst { 0% { transform: translateY(4px) rotate(0deg); } 100% { transform: translateY(0) rotate(45deg); } } @keyframes clicksecond { 0% { transform: translateY(-4px) rotate(0deg); } 100% { transform: translateY(0) rotate(-45deg); } } @keyframes clickthird { 0% { opacity: 0 } 100% { opacity: 0 } } .mobile-inner-header-icon-out span:nth-child(1) { animation-duration: 0.5s; animation-fill-mode: both; animation-name: outfirst; } .mobile-inner-header-icon-out span:nth-child(2) { animation-duration: 0.5s; animation-fill-mode: both; animation-name: outsecond; } .mobile-inner-header-icon-out span:nth-child(3) { animation-duration: 0.5s; animation-fill-mode: both; animation-name: outthird; } @keyframes outfirst { 0% { transform: translateY(0) rotate(-45deg); } 100% { transform: translateY(-4px) rotate(0deg); } } @keyframes outsecond { 0% { transform: translateY(0) rotate(45deg); } 100% { transform: translateY(4px) rotate(0deg); } } @keyframes outthird { 0% { transform: translateY(0) rotate(90deg); } 100% { transform: translateY(12px) rotate(0deg); } } .mobile-inner-nav { min-height: 100vh; background-color: rgba(28, 28, 28, 0.9); width: 100%; position: absolute; top: 0; left: 0px; padding-top: 50px; padding-bottom: 25px; display: none; z-index: 999; } .mobile-inner-nav a { display: inline-block; line-height: 45px; text-decoration: none; width: 100%; font-size: 1.1rem; text-align: center; border-bottom: solid 1px #444; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .mobile-inner-nav li { position: relative; padding: 0 20px; } .mobile-inner-nav li a { text-indent: 0; } .mobile-inner-nav li strong { color: #fff; position: absolute; right: 20px; top: 0; font-size: 1.6em; font-weight: normal; cursor: pointer; width: 40px; height: 45px; text-align: center; line-height: 45px; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .mobile-inner-nav a { -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: returnToNormal; animation-name: returnToNormal; color: #fff; } @-webkit-keyframes returnToNormal { from { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .mobile_subNav { display: none; padding-left: 10px; } .mobile-inner-nav dd a { height: 35px; line-height: 35px; border-bottom: dotted 1px rgb(105, 106, 106); font-size: 1rem; color: #c4c4c4; } .mobile_search { clear: both; position: relative; height: 36px; margin: 10px 30px 0; border: 1px solid #747474; border-radius: 30px; overflow: hidden; } .mobile_search input[type='text'] { width: 79%; color: #d9d9d9; margin-left: 15px; border: none; height: 34px; background: none; } .mobile_search .notxt1 { width: 45px; height: 36px; color: #fff; right: 0; position: absolute; top: 0; left: auto; background: url(../images/search.png) no-repeat center !important; border: none; } @keyframes rotate { from { transform: rotateX(90deg) translateY(0%); top: 43px; } to { transform: rotateX(0deg) translateY(0%); top: 43px; } } @media screen and (max-width:1600px) { .container,.banner .swiper-pagination,#issues li{ width: 1380px; } .mainbox .dllist{ padding: 8px 0 6px; } .media-list li>p { margin: 10px 20px; } .swiper-media .ptbox .inner{ padding-bottom: 55%; } .list1 li a{ font-size: 16px; } .list1 li span{ font-size: 14px } } @media screen and (max-width:1400px) { .container,.banner .swiper-pagination,#issues li{ width: 1200px; } .media-list li>p { margin: 7px 20px; } .mainbox .dllist{ padding: 5px 0 4px; } .swiper-news .ptbox .inner{ padding-bottom: 69%; } .swiper-media .ptbox .inner{ padding-bottom: 55%; } .list1 li{ padding: 7px 0 6px; } .c_first_part ul li p{ font-size: 16px; padding:15px 20px; } .c_second_part li>p{ font-size: 16px } .lrxz li{ float: left; width: calc(25% - 70px); margin: 15px 35px 0px; position: relative; } } @media screen and (max-width:1200px) { body{ min-width: 100%; } .container{ width: 100%; padding-left: 20px; padding-right: 20px; } .banner .swiper-pagination{ width: 100%; padding-right: 20px; } .header>.container{ padding: 20px 30px; } .nav-list .nav-item{ height: 54px; } .nav-list .nav-item a{ font-size: 18px; line-height: 54px; } .mainHd{ padding: 10px 0; } .mainHd img{ width: 36px; margin-right: 6px; } .swiper-news{ margin-right: 15px; } .main1 .dllist{ width: calc(50% - 8px); } .swiper-news .ptbox .inner{ padding-bottom: 64%; } .newslist .dllist:nth-last-child(1),.newslist .dllist:nth-last-child(2){ display: none; } .swiper-zt{ margin-left: -6px; margin-right: -6px; } .swiper-zt .swiper-slide{ width: calc(33.33% - 12px); margin: 0 6px; } .main2_1, .main2_2{ width: calc(34% - 8px); } .main2_2{ margin-left: 16px; } .main2_3 .list1 li:nth-child(6){ display: none; } .main3_2{ margin-left: 16px; } .footer{ padding: 15px 0; } .section>.container{ padding: 0; } .side{ width: 258px; } .column{ padding-left: 20px; padding-right: 20px; } .common-list li{ line-height: 50px; height: 50px; padding-left: 18px; } .common-list li::before{ width: 10px; height: 2px; top:50%; margin-top: -1px; left: 0px; } .teacher ul,.lrxz ul{ margin: 15px 0; margin-left: -10px; margin-right: -10px; } .teacher li{ width: calc(25% - 20px); margin: 10px; } .lrxz ul li{ width: calc(25% - 40px); margin: 10px 20px; } .c_second_part ul{ padding: 30px; } .c_second_part_list{ padding:15px 30px 0; } .aboutCont>.container{ padding:0 15px; } } @media screen and (max-width:1000px) { .header>.container,.nav-list-box{ display: none; } .mheader{ padding:20px 25px; display: block; background: #037EC4; } .mheader .logo{ width: 45%; } .mheader .logo img{ width: 100%; } .mobile{ display: block; } .mobile-inner-header{ top:30px; right: 15px; } .flexbox{ display: block; } .top .flexbox,.section .flexbox{ display: flex; } .swiper-news{ margin-right: 0; width: 100%; margin-bottom: 15px; } .main1 .newslist{ width: 100%; } .swiper-news .ptbox .inner{ padding-bottom: 55%; } .swiper-zt .swiper-slide{ width: calc(50% - 12px); } .main2_1, .main2_2,.main2_3,.main3_1,.main3_2{ width: 100%; display: block; margin: 0; margin-bottom: 15px; } .footer{ text-align: center; padding: 0; } .footerR{ width: 100%; text-align: center; padding-top: 0; background: none; } .newslist .dllist:nth-last-child(1), .newslist .dllist:nth-last-child(2){ display: flex; } .sbanner img{ height: 25vw; object-fit: cover; } .sbanner .txt>div>p{ padding-bottom: 0; } .sbanner .txt ul{ max-width: 80%; font-size: 14px;margin-top: 10px; } .leader{ margin: 15px 0; } .leader .leaderItem{ margin-bottom: 5px; padding: 10px; } .leader .leaderItem .info{ padding-left: 15px; } .leader .leaderItem .ptbox{ width: 148px; } .leader .leaderItem .ptbox img{ width: 148px; height: 148px; } .orglist ul li{ width: 100%; } .bread{ font-size: 15px; overflow: hidden; } .sbanner .txt ul{ display: none; } .msidebar{ display: block; } .teacher li { width: calc(33.33% - 20px); margin: 10px; } .lrxz ul li{ width: calc(33.33% - 20px); margin: 10px; } .c_first_part ul li p{ font-size: 14px; padding: 10px; } .partHd{ padding-top: 8px; margin: 30px 0; } .partHd b,.partHd span{ font-size: 34px;word-break:break-all; } .partHd::before{ width: 48px; height: 2px; } .c_second_part_items{ padding: 15px 30px; } .c_second_part li>a,.c_second_part_items>a{ height: 150px; width: 150px; } .c_second_part li>a img,.c_second_part_items>a img{ width: 100%; height: 150px; object-fit: cover; } .c_second_part li{ width: 33.33%; } .c_second_part_list .c_second_part_items:nth-child(2),.c_second_part_list .c_second_part_items:nth-child(3){ width: 100%; } #timeline,#issues li{ width: 714px; } #issues li img{ display: none; } #issues .timelist{ width: 100%; margin: 0; } #dates{ width: 714px; } } @media screen and (max-width:600px) { .header,.nav-list-box{ display: none; } .mheader{ padding: 15px; display: block; background: #037EC4; } .mheader .logo{ width: 60%; } .mheader .logo img{ width: 100%; } .mobile{ display: block; } .mobile-inner-header{ top:25px; right: 15px; } .container{ padding-left: 15px; padding-right: 15px; } .main1 .dllist{ width: 100%; } .main3_1 .mainBd{ flex-wrap: wrap; padding-top: 6px; height:auto; margin: 15px 0 20px; } .main3_1 .mainBd a{ width: 50%; } .main3_1 .mainBd a{ margin: 8px 0 5px; padding: 0 10px; } .main3_1 .mainBd a:nth-child(odd){ border-left: none; } .main3_2 .mainBd{ padding: 15px 0; } .swiper-rw .ptbox .inner{ padding-bottom: 90%; } .swiper-rw p{ line-height: 36px; } .section>.flexbox{ display: block; padding: 0 20px; } .sbanner .txt p{ margin: 0; } .sbanner{ height: 26vw; } .sbanner img { width: 100%; height: 26vw; object-fit: cover; } .side{ width: 100%; box-shadow: 0 0 3px #ddd; padding: 0; margin:20px 0 10px; } .side>p{ position: relative; height: 50px; line-height: 50px; font-size: 18px; } .side>p>span{ display: block; top:10px; } .side>ul{ display: none; } .column{ padding: 0; border: 0; } .bread a{ height: 30px; line-height: 30px; } #timeline,#issues li{ width: 90vw;height: auto; } #issues{ padding-bottom: 20px; } #issues .timelist{ width: 100%; margin: 0; } #issues .timelist>p{ font-size: 17px } #issues .timelist h3{ font-size: 32px; padding: 5px 0 25px; } #dates{ width: 90vw; height: 68px; margin: 0 5vw; } #dates li{ width: 20vw; height: 68px; font-size: 15px; } #dates a{ width: 80px; height: 68px; background-size: 68px; } #dates .selected, #dates a:hover{ background-size: 68px; } #timeline::before{ bottom: 81px; } #next, #prev{ bottom: 58px; } .partHd{ margin: 30px 0 20px; } .c_first_part ul{ display: block; } .c_first_part ul li{ width: 100%; margin-bottom: 15px; } .c_first_part ul li p{ font-size: 16px; } .c_second_part_list { padding: 15px 0px 0; } .c_second_part_items{ padding: 10px 20px; } .c_second_part_items .txt{ padding-left: 20px; } .c_second_part ul{ padding: 15px; } .c_second_part li{ padding:10px 12px; align-items: flex-start; } .c_second_part li>a,.c_second_part_items>a{ width: 140px; height: 140px; } .c_second_part li>a img,.c_second_part_items>a img{ width: 140px; height: 140px; } .c_second_part li>p{ font-size: 15px; line-height: 1.4; width: 100%; } .content img{height:auto} } @media screen and (max-width:480px) { body{ font-size: 15px } .pt15{ padding-top: 10px; } .mheader .logo{ width:70%; } .mobile-inner-header{ top:22px; right: 15px; } .sbanner{ height:30vw; } .sbanner img { width: 100%; height: 30vw; object-fit: cover; } .mainHd{ padding: 8px 0; margin-bottom: 8px; } .mainHd img{ width: 32px; } .swiper-zt .swiper-slide{ width: 60%; } .list1 li{ padding: 5px 0; } .list1 li a{ font-size: 15px } .footerR a.w .qCode{ top:-170px; width: 156px; margin-left: -78px; height: 156px; } .footerR a.w .qCode img{ width: 140px; } .partHd{ margin: 25px 0 15px; } .teacher li { width: calc(50% - 20px); margin: 10px; } .lrxz ul li{ width: calc(50% - 20px); margin: 10px; } .leader .leaderItem .ptbox { width: 128px; } .leader .leaderItem .ptbox img{ width: 128px; height: 128px; } .leader .leaderItem .info .txt{ font-size: 15px } #timeline{ margin-top:0px; padding-bottom: 30px; } #timeline,#issues li{ width: 90vw;height: auto; } #issues{ padding-top: 0; padding-bottom: 20px; } #issues .timelist{ width: 100%; margin: 0; } #issues .timelist>p{ font-size: 15px; padding: 10px 0; } #issues .timelist h3{ font-size: 28px; padding: 0px 0 20px; } #dates{ height: 60px; } #dates li{ width: 25vw; height: 60px; font-size: 13px; } #dates a{ width: 80px; height: 60px; background-size: 60px; } #dates .selected, #dates a:hover{ background-size: 60px; } #timeline::before{ bottom: 60px; } #next, #prev{ bottom: 38px; } .position{ padding: 15px 0; font-size: 16px; } .position .home{ padding-left: 40px; height: 34px; line-height: 34px; background-size: 34px; } .position em{ margin: 0 6px; } .partHd b, .partHd span{ font-size: 30px } .c_second_part li{ width: 50%; padding: 10px 12px 5px; } } @media screen and (max-width:400px) { .mobile-inner-header{ top:18px } .common-list li p{ margin-right: 100px; } .partHd b, .partHd span{ font-size: 28px; } .partHd span{ letter-spacing: 1px; } .c_second_part li>a,.c_second_part_items>a{ width: 130px; height: 130px; } .c_second_part li>a img,.c_second_part_items>a img{ width: 130px; height: 130px; } .c_second_part li>p{ font-size: 14px; line-height: 1.4; } .c_first_part ul li p{ font-size: 14px } } @media screen and (max-width:320px) { body{ font-size: 14px } .main3_1 .mainBd a img{ width: 60%; } .c_second_part li>a,.c_second_part_items>a{ width: 120px; height: 120px; } .c_second_part li>a img,.c_second_part_items>a img{ width: 120px; height: 120px; } .c_second_part li>p{ font-size: 14px; line-height: 1.4; } } @media screen and (max-width:600px) { .news-list li{ padding: 15px 0; } .news-list .img{ width: 120px; height: 79px; } .news-list .txt{ height: 79px; margin: 0 20px 0 135px; } .news-list .txt h2{ font-size: 16px; padding-top: 0; margin-bottom: 5px; } .news-list .txt p{ font-size: 12px; -webkit-line-clamp: 2; } .news-list .time{ display: none; } .news-list li:hover .date{ display: none; } }