@charset "utf-8"; @font-face { font-family: 'sySong'; src: url('../style/sySong.woff') format('woff'); font-weight: normal; font-style: normal; } .sect { padding-top: 45px; } .s1-l { float: left; width: 680px; } .s1-l a { display: block; position: relative; } .s1-l a .pic { padding-top: 64%; } .s1-l a p { position: absolute; left: 0; right: 0; bottom: 0; line-height: 55px; background: rgba(0, 0, 0, .46); padding-left: 20px; padding-right: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 18px; color: #fff; } .s1-l .slick-dots { width: auto; right: 20px; bottom: 15px; } .s1-l .slick-dots li { width: 14px; height: 14px; border-radius: 50%; background-color: #fff; margin: 0 10px; } .s1-l .slick-dots li.slick-active { background-color: #1d2081; } .s1-r { float: right; width: calc(100% - 720px); } .title { border-bottom: 1px solid #dddddd; overflow: hidden; } .title h2 { float: left; line-height: 54px; padding-left: 6px; /* border-left: 6px solid #ffa10e; */ /* padding-left: 20px; */ padding-right: 60px; background-size: 100% 100%; } .title h2 span { font-size: 26px; color: #1d2081; } .title a { float: right; font-size: 16px; color: #666; margin-top: 25px; } .title a:hover { color: #1d2081; } .s1-r-top { padding: 20px 0; border-bottom: 1px dashed #dddddd; } .s1-r-top h2 { font-size: 18px; color: #111; font-weight: bold; margin-bottom: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .s1-r-top p { font-size: 14px; line-height: 22px; color: #919191; height: 44px; overflow: hidden; } .list { margin-top: 15px; } .list>li { padding-left: 15px; background: url(../images/list.png) no-repeat left center; line-height: 40px; } .list>li:hover a { color: #1d2081; text-decoration: none; } .list>li a { display: block; font-size: 18px; color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .s2-l { float: left; width: 48%; } .s2-r { float: right; width: 48%; } .tpp-list { overflow: hidden; margin-top: 25px; } .tpp-list>li { float: left; width: 48%; margin-left: 4%; } .tpp-list>li:nth-child(2n-1) { margin-left: 0; } .tpp-list>li a { display: block; position: relative; } .tpp-list>li a .pic { padding-top: 63%; } .tpp-list>li a p { position: absolute; left: 0; right: 0; bottom: 0; line-height: 45px; background: rgba(0, 0, 0, .52); font-size: 16px; color: #fff; padding: 0 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .bt-list>li { float: left; border: 1px solid #dddddd; background-color: #fcfcfc; margin-top: 30px; width: 48%; margin-left: 4%; box-sizing: border-box; } .bt-list>li:nth-child(2n-1) { margin-left: 0; } .bt-list>li a { display: block; padding: 20px 20px 20px 25px; background: url(../images/txt-list.png) no-repeat left 20px; } .bt-list>li a p { line-height: 24px; font-size: 18px; color: #333; height: 48px; overflow: hidden; } .bt-list>li:hover { box-shadow: 0 0 10px #f6c2c2; } .bt-list>li:hover a p { color: #be1219; } .s3-l { float: left; width: 48%; } .s3-r { float: right; width: 48%; } .s3-l .s3-ll { float: left; width: 290px; background-color: #f8f3f3; padding: 25px; box-sizing: border-box; margin-top: 30px; } .s3-l .bt-list { overflow: hidden; padding-left: 30px; } .s3-l .bt-list li { float: none; width: 100%; margin-left: 0; margin-top: 22px; } .s3-l .s3-ll h2 { font-size: 18px; color: #be1219; font-weight: bold; padding-bottom: 30px; border-bottom: 2px solid #be1219; } .s3-l .s3-ll p { margin-top: 25px; line-height: 24px; font-size: 14px; color: #8d8a8a; } .s3-l .bt-list li a { background-image: none; background-color: #f8f3f3; background-position: 0 100%; background-size: 1% 100%; background-repeat: no-repeat; background-image: linear-gradient(#be1219, #be1219); transition: background-size .3s; } .s3-l .bt-list li:hover a { background-size: 100% 100%; } .s3-l .bt-list li:hover a p { color: #fff; } .s3-l .bt-list>li a p { line-height: 27px; height: 54px; } .s3r-top { padding-top: 30px; padding-bottom: 25px; border-bottom: 1px dashed #dddddd; overflow: hidden; } .s3r-top a { display: block; overflow: hidden; } .s3r-top .tpp { float: left; width: 240px; } .s3r-top .tpp .pic { padding-top: 63%; } .s3r-top .text { overflow: hidden; padding-left: 25px; } .s3r-top .text h2 { line-height: 30px; font-size: 18px; color: #111; height: 60px; overflow: hidden; font-weight: normal; margin-bottom: 20px; } .s3r-top .text p { line-height: 20px; font-size: 14px; color: #919191; height: 60px; overflow: hidden; } .zt { margin-top: 25px; margin-bottom: 65px; } .zt>ul { margin-left: -15px; margin-right: -15px; } .zt ul li { margin: 0 15px; } .zt ul li a { display: block; } .zt ul li a .pic { padding-top: 63.5%; } .s5 .cont{ margin: 30px 0; } @media screen and (max-width: 1100px) { .s1-l { width: 580px; } .s1-r { width: calc(100% - 610px); } .s1-r-top { padding: 10px 0; } .s1-r-top h2 { margin-bottom: 5px; } .list>li { line-height: 34px; } .bt-list>li { margin-top: 17px; } .s3-l .s3-ll { width: 215px; padding: 15px; } .s3-l .bt-list li { margin-top: 35px; } } @media screen and (max-width: 1340px) { .zt { padding-left: 15px; padding-right: 15px; } } @media screen and (max-width:900px) { .s1-l, .s2-l, .s3-l { float: none; width: 100%; } .s1-l { margin-top: 15px; } .s1-r { float: none; width: 100%;overflow: hidden; } .s2-r { float: none; width: 100%; margin-top: 15px; } .s3-r { float: none; width: 100%; margin-top: 15px; } } @media screen and (max-width:700px) { .sect { padding-top: 15px; } .title h2 span { font-size: 18px; } .title h2 { padding-right: 40px; line-height: 35px; background-size: 120px 100%; } .title a { margin-top: 5px; font-size: 14px; } .list { margin-top: 0; } .list>li a { font-size: 15px; } .s1-l a p { font-size: 15px; } .s1-l .slick-dots li { margin: 0 5px; } .bt-list>li { float: none; width: 100%; margin-left: 0; } .bt-list>li a { padding: 15px; } .s3-l .s3-ll { float: none; width: 100%; margin-top: 15px; } .s3-l .bt-list { padding-left: 0; } .s3-l .bt-list li { margin-top: 15px; } .s3r-top { padding-top: 15px; padding-bottom: 15px; } .s3r-top .tpp { float: none; width: 100%; } .s3r-top .text { padding-left: 0; } .zt { margin-top: 15px; margin-bottom: 15px; } } .tzgg { display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 30px; } .tzgg li{width:48%;padding: 18px 10px;background: #f0f0f0;margin-bottom: 31px;box-sizing: border-box;position:relative;} .tzgg li a{color:#333;line-height: 30px;height: 60px;display: block;text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;} .tzgg li::before{position:absolute;content:"";left:0px;width: 4px;height: 22px;background: #1d2081;top: 0;} .s5 ul{display: flex;flex-wrap: wrap;} .s5 ul li{ width: 12.5%; margin-right: 2%; box-sizing: border-box; padding: 30px; transition: all 1s; } .s5 ul li .pic1{width: 60%;margin: 0 auto;} .s5 ul li .pic1 img{width: 100%;} .s5 ul li:hover{ box-shadow: 0px 10px 50px rgba(0 0 0/40%); opacity: .8; } .s5 ul li:nth-child(1){ background: #3c56b8; } .s5 ul li p{ text-align: center; color: #fff; } .s5 ul li:nth-child(2){ background: #de7878; } .s5 ul li:nth-child(3){ background: #3db1af; } .s5 ul li:nth-child(4) { background: #b16c3d; } .s5 ul li:nth-child(5) { background: #67b13d; } .s5 ul li:nth-child(6) { background: #a8b13d; } .s5 ul li:nth-child(7) { background: #3d79b1; margin-right: 0; } @media screen and (max-width: 1024px) { .s5 ul li { width: 25%; } } @media screen and (max-width: 600px) { .s5 ul li a{ display: flex; align-items: center; } .s5 ul li { width: 100%; margin-bottom: 10px; } .s5 ul li{ margin-right:0; } .s5 ul li .pic1 { width: 20%; margin: inherit; } .s5 ul li{padding:0;margin-top: 0;} }