@charset "utf-8"; .banner a{ display: block; position: relative; } .banner img{ display: block; width: 100%; } .banner .paga{ font-size: 0; bottom: 25px; } .banner .paga span{ width: 15px; height: 15px; background: transparent; border: 1px solid #fff; margin: 0 7px; position: relative; opacity: 1; } .banner .paga span:after, .banner .paga span:last-child:before{ position: absolute; content: ''; top: 50%; left: -13px; width: 10px; height: 1px; background: #fff; } .banner .paga span:last-child:before{ width: 20px; left: auto; right: -24px; } .banner .paga span:first-child:after{ left: -24px; width: 20px ; } .banner .paga .swiper-pagination-bullet-active{ background: #fff; } .tit001{ display: flex; justify-content: space-between; align-items: flex-end; padding-bottom: 14px; border-bottom: 1px solid #cccccc; margin-bottom: 30px; } .tit001 .ll{ display: flex; align-items: center; position: relative; } .tit001 .ll:after{ position: absolute; content: ''; left: 0; right: 0; bottom: -15px; height: 3px; background: #2f5da4; } .tit001 .ll img{ display: block; margin-right: 10px; } .tit001 .ll h2{ font-size: 28px; color: #2f5da4; line-height: 30px; font-family: 'sourcebold'; } .container01 .aleft{ width: 31.47%; } .list1w a{ display: block; position: relative; } .list1w a .pic{ padding-top: 345px; } .list1w a .txt{ position: absolute; left: 0; right: 0; bottom: 10px; padding: 0 15px; z-index: 3; } .list1w a .txt p{ font-size: 18px; line-height: 28px; color: #fff; height: 56px; } .list1w .paga{ font-size: 0; left: auto; right: 20px; bottom: 15px; width: auto; } .list1w .paga span{ width: 10px; height: 10px; background: #fff; margin: 0 5px; } .list1w a:after{ position: absolute; content: ''; left: 0; right: 0; top: 0; bottom: 0; background: repeat-x bottom center; } .container01 .aright{ width: 66%; } .s1-list li{ width: 47.67%; padding-top: 6px; padding-bottom: 6px; border-bottom: 1px solid #efefef; } .s1-list li a{ display: flex; align-items: center; justify-content: space-between; } .s1-list li .time{ display: block; width: 42px; color: #006fe4; text-align: center; font-family: "times new roman"; } .s1-list li .time span{ display: block; font-size: 24px; line-height: 28px; font-weight: 600; } .s1-list li .time em{ display: block; font-size: 12px; line-height: 16px; } .s1-list li .txt{ width: calc(100% - 56px); } .s1-list li .txt p{ font-size: 16px; line-height: 28px; color: #333333; height: 56px; } .s1-list li .txt p i{ display: inline-block; margin-left: 50px; width: 29px; height: 16px; vertical-align: middle; background: no-repeat 50%; background-size: 29px; } .container01{ padding-top: 55px; padding-bottom: 65px; background: no-repeat bottom center; background-size: cover; } .container02 .tit001 h2{ color: #fff; } .container02 .tit001 .ll:after{ background: #fbc570; } .container02 .tit001{ margin-bottom: 13px; } .container02 .item{ width: 31.46%; } .s2-list li{ position: relative; line-height: 36px; color: #fff; } .s2-list li a{ font-size: 16px; padding-right: 80px; } .s2-list li time{ position: absolute; right: 0; top: 0; font-size: 12px; font-family: "times new roman"; } .s2-list li:hover a{ color: #fbc570; } .container02{ padding-top: 55px; padding-bottom: 48px; background: no-repeat 50%; background-size: cover; } .container03 .s1 .item{ width: 31.73%; } .mttxt a{ display: flex; justify-content: space-between; } .mttxt a .pic{ width: 161px; height: 120px; } .mttxt a .txt{ width: calc(100% - 179px); } .mttxt a .txt h2{ font-size: 16px; line-height: 28px; height: 56px; font-weight: 600; color: #000000; margin-bottom: 8px; } .mttxt a .txt p{ font-size: 12px; line-height: 22px; color: #808080; height: 44px; word-break: break-all; } .mttxt{ margin-bottom: 25px; } .mtlist li{ position: relative; line-height: 38px; } .mtlist li a{ font-size: 16px; color: #333; padding-right: 95px; } .mtlist li time{ position: absolute; top: 0; right: 0; font-size: 12px; color: #007aff; font-family: "times new roman"; } .pellist li .block1 a{ font-size: 16px; line-height: 38px; color: #333333; } .pellist li .block1 i{ position: absolute; left: 0; top: 50%; width: 17px; height: 17px; background: no-repeat 50%; transform: translatey(-50%); cursor: pointer; } .pellist li .block1{ position: relative; padding-left: 33px; } .pellist li .block2 .bcon{ display: flex; align-items: center; justify-content: space-between; padding-bottom: 5px; } .pellist li .block2 .bcon .pic{ width: 97px; height: 97px; border-radius: 50%; } .pellist li .block2 .bcon .txt{ width: calc(100% - 126px); padding-right: 53px; position: relative; } .pellist li .block2 .bcon .txt h2{ font-size: 16px; color: #333333; line-height: 28px; font-weight: 600; margin-bottom: 5px; } .pellist li .block2 .bcon .txt p{ font-size: 12px; line-height: 22px; color: #808080; -webkit-line-clamp: 3; height: 66px; } .pellist li .block2 .bcon .txt i{ position: absolute; right: 10px; top: 50%; width: 17px; height: 17px; background: no-repeat 50%; transform: translatey(-50%); cursor: pointer; } .pellist li .block2, .pellist li.show .block1{ display: none; } .pellist li.show .block2{ display: block; } .pellist li.show { margin-bottom: 2px; border-bottom: 1px solid #efefef; } .vdlist li { width: 47.9%; margin-bottom: 20px; } .vdlist li a{ display: block; } .vdlist li a .pic{ padding-top: 126px; } .vdlist li a .pic i{ position: absolute; right: 17px; bottom: 14px; width: 37px; height: 37px; background: no-repeat 50%; } .vdlist li a .txt{ text-align: center; } .vdlist li a .txt p{ font-size: 16px; line-height: 24px; color: #333333; height: 48px; } .container03 .tit001{ margin-bottom: 25px; } .list2w a{ display: block; background: #fff; padding: 6px 7px; box-shadow: 0 0 10px rgba(51, 51, 51, 0.2); } .list2w a .pic{ padding-top: 35.47%; } .list2w .swiper-container{ padding: 10px; } .list2w .btn{ width: 11px; height: 21px; background-size: 11px; margin-top: 0; transform: translatey(-50%); } .list2w .prev{ left: 0; background-image: ; } .list2w .next{ right: 0; background-image: ; } .list2w { padding-left: 30px; padding-right: 30px; position: relative; margin-bottom: 44px; margin-top: 38px; } .iconlist li{ width: 10%; position: relative; } .iconlist li a{ display: block; } .iconlist li .icon{ width: 62px; height: 60px; margin: 0 auto; position: relative; } .iconlist p{ font-size: 16px; color: #666666; line-height: 20px; text-align: center; margin-top: 18px; margin-bottom: 10px; } .iconlist li:hover .icon img{ transform: rotatey(180deg); } .iconlist li:hover p{ color: #007aff; } .iconlist li .lvbox{ position: absolute; left: 50%; top: 100%; width: 150px; transform: translatex(-50%); background: #fff; box-shadow: 0 0 10px rgba(51, 51, 51, 0.15); z-index: 99; opacity: 0; visibility: hidden; transition: .5s; border-radius: 5px; } .iconlist li .lvbox a{ font-size: 16px; line-height: 28px; color: #333; text-align: center; padding: 5px 10px; } .iconlist li .lvbox a:hover{ color: #007aff; } .iconlist li:hover .lvbox{ opacity: 1; visibility: visible; } .container03{ padding-top: 54px; padding-bottom: 148px; background: no-repeat bottom center; background-size: cover; } .side-nav { z-index: 3; position: fixed; width: 118px; top: 200%; transition: 0.6s; transform: translatey(-50%); padding-left: 1px; right: 6px; background: no-repeat left top; padding-top: 116px; } .side-nav.show { top: 50%; } .side-nav ul { padding: 20px 0 0; width: 100px; border-radius: 0 0 50px 50px; background-image: linear-gradient(#2aa0e6, #415ef2); } .side-nav ul li:not(:last-child) { width: 74px; font-size: 14px; text-align: center; line-height: 30px; border: 1px solid #fff; border-radius: 4px; height: 32px; margin: 0 auto 8px; color: #fff; cursor: pointer; } .side-nav ul li:not(:last-child):hover { background-color: #fff; color: #004ea2 } .side-nav ul li:last-child { text-align: center; padding: 4px 0 26px; cursor: pointer; } .side-nav ul li a { color: #fff; } .side-nav ul li:not(:last-child):hover a { background-color: #fff; color: #004ea2 } @media screen and (max-width: 1200px){ .banner{ margin-top: 75px; } .banner .paga{ bottom: 10px; } .banner .paga span{ width: 8px; height: 8px; } .container01 .aleft{ width: 100%; margin-bottom: 25px; } .list1w a .pic{ padding-top: 73.09%; } .container01 .aright{ width: 100%; } .container01{ padding-top: 30px; padding-bottom: 20px; } .list1w a .txt p{ font-size: 16px; height: auto; display: block; white-space: nowrap; padding-right: 110px; } .container02 .item{ width: 48.5%; } .container02 .item.xycz{ width: 100%; margin-bottom: 20px; } .container02{ padding-top: 30px; padding-bottom: 20px; } .container03 .s1 .item{ width: 48.5%; margin-bottom: 20px; } .container03 .s1 .item.vd{ width: 100%; margin-bottom: 0; } .vdlist li a .pic{ padding-top: 67.54%; } .list2w{ margin-top: 0; margin-bottom: 30px; } .container03{ padding-top: 30px; } .side-nav{ display: none; } } @media screen and (max-width: 1024px){ .tit001 .ll h2{ font-size: 22px; } .tit001{ padding-bottom: 10px; margin-bottom: 25px; } .tit001 .ll:after{ bottom: -11px; } .s1-list li .txt p{ font-size: 14px; } .s2-list li a, .pellist li .block1 a{ font-size: 14px; } .mtlist li a,.mttxt a .txt h2, .pellist li .block2 .bcon .txt h2{ font-size: 14px; } .iconlist p{ font-size: 14px; margin-top: 12px; } .iconlist li .icon{ width: 50px; height: 48px; } .list2w{ padding: 0; } .list1w .paga span{ width: 6px; height: 6px; } .list1w .paga{ right: 0; } .iconlist li .lvbox a{ font-size: 12px; } .iconlist li .lvbox{ width: 120px; } } @media screen and (max-width: 900px){ .s1-list li{ width: 100%; } .container02 .item{ width: 100%; margin-bottom: 20px; } .container03 .s1 .item{ width: 100%; } .vdlist li a .txt p{ font-size: 14px; } .iconlist li{ width: 20%; margin-bottom: 20px; } .container03{ padding-bottom: 10px; } } @media screen and (max-width: 768px){ .tit001 .ll h2{ font-size: 20px; } .tit001, .container03 .tit001{ margin-bottom: 15px; } .list1w a .txt p{ font-size: 14px; padding-right: 80px; } .list1w a .txt{ padding: 0; } .mttxt a .pic { width: 131px; height: 97px; } .mttxt a .txt{ width: calc(100% - 145px); } .mttxt a{ align-items: center; } .mttxt{ margin-bottom: 10px; } .pellist li .block2 .bcon .txt { width: calc(100% - 110px); padding-right: 30px; position: relative; } .iconlist li .icon{ width: 30px; height: 28px; } } @media screen and (max-width: 640px){ .banner{ margin-top: 66px; } .container01, .container03{ padding-top: 20px; padding-bottom: 10px; } .container02{ padding-top: 20px; padding-bottom: 0; } }