body { padding-top: 121px; overflow-x: hidden; } .banner img { width: 100%; } .banner .slick-dots { right: 50%; bottom: 0; } .banner .slick-prev { background: url(../images/left-jt.png); left: 0; z-index: 9; width: 36px; height: 68px; left: 75px; } .ff a{color:#fff} .banner .slick-prev:before { content: ""; } .banner .slick-dotted.slick-slider { margin-bottom: 0; } .banner .slick-dots li button { position: absolute; bottom: 0; width: 34px; height: 36px; } .banner .slick-dots li { margin: 0 36px; bottom: 25px; left: 50%; transform: translateX(-50%); background: url(../images/banner-dot.png) no-repeat; } .banner .slick-dots li button:before { content: ""; } .banner .slick-dots li::after { content: ""; display: inline-block; margin-left: 23px; margin-bottom: 7px; width: 0; height: 2px; background-color: #fff; } .banner .slick-dots .slick-active::after { width: 45px; } .banner .slick-next { right: 70px; width: 36px; height: 68px; background: url(../images/right-jt.png); } .banner .slick-next:before { content: ""; } .pic { padding-top: 75%; position: relative; overflow: hidden; } .pic img { width: 100%; height: 100%; position: absolute; top: 0; left: 0; transition: all 1s; } .pic img:hover { transform: scale(1.1); } /* section1 */ .main .section1 { background-color: #f4f2ed; padding-top: 40px; padding-bottom: 83px; } .main .section1 .more a { display: block; } .main .section1 .more .ac { font-size: 30px; /* line-height: 16px; */ color: #333; vertical-align: middle; padding-left: 15px; } .main .section1 .more .much { /* text-align: right; */ float: right; padding-top: 15px; font-size: 16px; line-height: 16px; color: #93080c; } .section1 .s1l { float: left; width: 58.9%; } .section1 .s1l .s1ll { float: left; width: 48.5%; /* margin-top: 26px; */ } .section1 .s1l .s1lr { float: right; width: 48.5%; padding-left: 3%; } .section1 .s1l ul li { margin-top: 26px; } .section1 .s1l a { display: block; } .section1 .s1l a div:last-child { box-sizing: border-box; /* height: 130px; */ border: 1px solid #d5d4d2; border-top: 0; } .section1 .s1l a .zi { padding: 20px 20px 18px 15px; } .section1 .s1l img { width: 100%; } .section1 .s1l em { display: block; font-size: 16px; line-height: 16px; color: #93080c; } .section1 .s1l span { display: block; font-size: 18px; padding-top: 12px; line-height: 32px; height: 64px; overflow: hidden; color: #333; } .section1 .s1l ul li:hover span { color: #93080c; } .section1 .s1r { float: right; width: 39%; padding-left: 2.1%; } .section1 .s1r ul { padding-top: 3px; } .section1 .s1r ul li { padding-top: 15px; padding-bottom: 15px; border-bottom: 1px solid #d1d0ce; } .section1 .s1r ul li a { display: block; } .section1 .s1r .date { float: left; } .section1 .s1r .date .day { width: 62px; height: 34px; background-color: #ffe5e6; font-size: 28px; text-align: center; line-height: 34px; color: #93080c; } .section1 .s1r .date .year { width: 62px; height: 28px; background-color: #93080c; font-size: 15px; color: #fff; text-align: center; line-height: 28px; } .section1 .s1r ul li p { overflow: hidden; padding-left: 18px; font-size: 18px; line-height: 31px; color: #333; height: 62px; } .section1 .s1r ul li:hover .day { background-color: #93080c; color: #fff; } .section1 .s1r ul li:hover p { color: #93080c; } /* section2 */ .section2 { padding-top: 62px; padding-bottom: 85px; background-color: #fff; } .main .section1 .more a { display: block; } .main .section2 .more .ac { font-size: 30px; /* line-height: 16px; */ color: #333; vertical-align: middle; padding-left: 15px; } .main .section2 .more .much { /* text-align: right; */ float: right; padding-top: 15px; font-size: 16px; line-height: 16px; color: #93080c; } .section2 .s2l { float: left; width: 100%; } .section2 .s2l .s2ll { float: left; width: 100%; } .section2 .s2l .s2ll ul{ } .section2 .s2l .s2lr { float: right; width: 48.5%; padding-left: 3%; } .section2 .s2l ul li a { display: block; } .section2 .s2l ul li { box-sizing: border-box; width: 24%; margin-top: 45px; border: 1px solid #b2b2b2; padding-left: 25px; padding-right: 15px; display: inline-block; } .section2 .s2l ul li:hover { background-color: #93080c; } .section2 .s2l ul li:hover .context h4, .section2 .s2l ul li:hover .context p { color: #fff; } .section2 .s2l ul li:hover .time { background-color: #ffe5e6; } .section2 .s2l li { position: relative; } .section2 .s2l .time { position: absolute; top: -20px; left: 18px; width: 100px; height: 40px; text-align: center; line-height: 40px; background-color: #fff; font-size: 16px; color: #93080c; } .section2 .s2l h4 { font-size: 18px; line-height: 28px; height: 56px; overflow: hidden; color: #333; padding-top: 25px; margin-bottom: 15px; } .section2 .s2l p { font-size: 14px; line-height: 23px; height: 46px; overflow: hidden; text-overflow: ellipsis; color: #808080; margin-bottom: 30px; } .section2 .s2r { float: right; width: 39%; padding-left: 2.1%; } .section2 .s2r .top { position: relative; width: 100%; margin-top: 36px; margin-bottom: 23px; } .section2 .s2r .top img { width: 100%; } .section2 .s2r .top p { position: absolute; font-size: 30px; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; } .section2 .s2r .xia { width: 100%; } .section2 .s2r .xia ul li a { display: block; } .section2 .s2r .xia .s2slick { float: left; width: 100%; } .xia .s2slick .slul li { float: left; width: 22.7%; margin-right: 3%; } .section2 .s2r .xia ul li:nth-child(4n) { margin-right: 0; } .xia .s2slick .slul li:first-child .i1 { display: block; background: url(../images/work1.png) center center no-repeat; width: 41px; height: 37px; background-size: contain; position: relative; padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li:first-child .i1::before { content: ""; display: block; background: url(../images/work11.png) center center no-repeat; width: 100%; height: 100%; opacity: 0; transition: all 0.2s; background-size: contain; position: relative; padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li:first-child:hover .i1::before { opacity: 1; top: -28px; background: url(../images/work11.png) center center no-repeat; } .xia .s2slick .slul li .i2 { display: block; background: url(../images/work2.png) center center no-repeat; width: 41px; height: 37px; background-size: contain; position: relative; padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li .i2::before { content: ""; display: block; background: url(../images/work22.png) center center no-repeat; width: 100%; height: 100%; opacity: 0; transition: all 0.2s; background-size: contain; position: relative; padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li:hover .i2::before { content: ""; display: block; opacity: 1; top: -29px; background: url(../images/work22.png) center center no-repeat; } .xia .s2slick .slul li .i3 { display: block; background: url(../images/work3.png) center center no-repeat; width: 41px; height: 37px; background-size: contain; position: relative; padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li .i3::before { content: ""; display: block; background: url(../images/work33.png) center center no-repeat; width: 100%; height: 100%; opacity: 0; transition: all 0.2s; background-size: contain; position: relative; padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li:hover .i3::before { content: ""; display: block; opacity: 1; top: -29px; } .xia .s2slick .slul li .i4 { display: block; background: url(../images/work4.png) center center no-repeat; width: 41px; height: 37px; background-size: contain; padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li .i4::before { content: ""; display: block; background: url(../images/work44.png) center center no-repeat; width: 100%; height: 100%; opacity: 0; transition: all 0.2s; background-size: contain; position: relative; padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li:hover .i4::before { content: ""; display: block; opacity: 1; top: -29px; } .xia .s2slick .slul li .i5 { display: block; background: url(../images/work5.png) center center no-repeat; width: 41px; height: 37px; background-size: contain; /* position: relative; */ padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li .i5::before { content: ""; display: block; background: url(../images/work55.png) center center no-repeat; width: 100%; height: 100%; opacity: 0; transition: all 0.2s; background-size: contain; position: relative; padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li:hover .i5::before { content: ""; display: block; opacity: 1; top: -29px; } .xia .s2slick .slul li .i6 { display: block; background: url(../images/work6.png) center center no-repeat; width: 41px; height: 37px; background-size: contain; /* position: relative; */ padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li .i6::before { content: ""; display: block; background: url(../images/work66.png) center center no-repeat; width: 100%; height: 100%; opacity: 0; transition: all 0.2s; background-size: contain; position: relative; padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li:hover .i6::before { content: ""; display: block; opacity: 1; top: -29px; } .xia .s2slick .slul li .i7 { display: block; background: url(../images/work7.png) center center no-repeat; width: 41px; height: 37px; background-size: contain; /* position: relative; */ padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li .i7::before { content: ""; display: block; background: url(../images/work77.png) center center no-repeat; width: 100%; height: 100%; opacity: 0; transition: all 0.2s; background-size: contain; position: relative; padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li:hover .i7::before { content: ""; display: block; opacity: 1; top: -29px; } .xia .s2slick .slul li .i8 { display: block; background: url(../images/work8.png) center center no-repeat; width: 41px; height: 37px; background-size: contain; /* position: relative; */ padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li .i8::before { content: ""; display: block; background: url(../images/work88.png) center center no-repeat; width: 100%; height: 100%; opacity: 0; transition: all 0.2s; background-size: contain; position: relative; padding-top: 30px; margin: 0 auto; } .xia .s2slick .slul li:hover .i8::before { content: ""; display: block; opacity: 1; top: -29px; } .section2 .s2r .xia ul li img { position: relative; padding-top: 30px; margin: 0 auto; } .section2 .s2r .xia ul li p { padding-top: 18px; padding-bottom: 25px; font-size: 16px; line-height: 16px; color: #868686; text-align: center; } .section2 .s2r .xia ul li:hover { background-color: #93080c; } .section2 .s2r .xia ul li:hover p { color: #fff; } .s2slick .slick-dots { margin-top: 30px; } .xia .s2slick .slick-dots li { float: none; width: auto; margin-right: 0; background: url(../images/dots.png) no-repeat center center; } .xia .s2slick .slick-dots li button:before { content: ""; } .section2 .s2r .xia .slick-dots li:hover { background-color: transparent; } .section2 .s2r .xia .slick-dots .slick-active { background: url(../images/adot.png) no-repeat center center; } /* section3 */ .section3 { width: 100%; height: 100%; padding-top: 79px; padding-bottom: 60px; background: url(../images/s3.png); } .section3 .jump-top { text-align: center; } .section3 .jump-top span { position: relative; display: inline-block; cursor: pointer; font-size: 30px; color: #808080; padding-left: 15px; vertical-align: middle; font-weight: normal; padding-left: 55px; margin-right: 45px; } .section3 .jump-top span .m1 { position: absolute; top: 8px; left: 0px; z-index: 2; } .section3 .jump-top span .m2 { position: absolute; top: 8px; left: 0px; /* z-index: 1; */ /* opacity: 0; */ /* top: 2px; */ } .section3 .jump-top span.on .m2 { z-index: 2; } /* .section3 .jump-top span i { margin-top: 5px; padding-right: 15px; } .section3 .jump-top i { padding-right: 15px; float: left; display: block; background: url(../images/s3dw1.png) center center no-repeat; width: 35px; height: 35px; background-size: contain; } .section3 .jump-top span.on i::before { content: ""; padding-right: 15px; display: block; background: url(../images/s3dw.png) center center no-repeat; width: 100%; height: 100%; opacity: 0; transition: all 0.2s; background-size: contain; } .section3 .jump-top span.on i::before { opacity: 1; } */ .section3 .jump-top span.on em { color: #93080c; } .section3 .jump { position: relative; top: 0; bottom: 0; left: 0; right: 0; } .section3 .jump .jump-box { position: absolute; top: 0; bottom: 0; left: 0; right: 0; opacity: 0; } .section3 .jump .jump-box.on { position: relative; z-index: 9; opacity: 1; transition: all 1s; } .section3 .s3b { padding-top: 67px; } .section3 .s3l { float: left; width: 24%; } .section3 .s3l a { overflow: hidden; display: block; } .section3 .s3l .fd { overflow: hidden; } .section3 .s3l .fd:hover img { transform: scale(1.1); transition: all 1s; } .section3 .s3l img { width: 100%; height: 100%; } .section3 .s3l .pic { padding-top: 71.5%; } .section3 .s3l img:hover { transform: scale(1.1); transition: all 1s; } .section3 .s3l p { font-size: 16px; line-height: 16px; color: #93080c; padding-top: 16px; } .section3 .s3l span { display: block; padding-top: 18px; font-size: 16px; line-height: 28px; color: #333; } .section3 .s3l span:hover { color: #93080c; } .section3 .s3m { float: left; width: 34.6%; margin-left: 2.8%; margin-right: 2.8%; } .section3 ul .biao { padding-top: 0; } .section3 ul li { padding-top: 22px; } .section3 ul li:hover p { color: #93080c; } .section3 ul li:first-child { padding-top: 0px !important; } .section3 ul li a { display: block; } .section3 ul li a p { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 16px; line-height: 22px; color: #333; } .section3 ul li a span { font-size: 14px; line-height: 29px; color: #93080c; } .section3 ul li a em { float: right; width: 80%; height: 1px; margin-top: 15px; margin-left: 12px; background-color: #cd9493; } .section3 .s3r { float: right; width: 35.8%; } .section3 .s3r .srb { padding-top: 37px; } .section3 .s3r .srb .pic { padding-top: 77%; } .section3 .s3r .srb .abc { float: left; width: 223px; } .section3 .s3r .srb a { display: block; overflow: hidden; padding-left: 4.5%; } .section3 .s3r .srb a p { font-size: 14px; line-height: 29px; color: #93080c; } .section3 .s3r .srb a h4 { font-size: 16px; line-height: 26px; height: 52px; /* overflow: hidden; */ color: #333; padding-top: 4px; padding-bottom: 16px; } .section3 .s3r .srb a p:last-child { font-size: 14px; line-height: 23px; color: #808080; height: 69px; overflow: hidden; } .section3 .s3r .srb a p:last-child:hover { color: #93080c; } .section3 .s3x { text-align: center; margin-top: 72px; } .section3 .s3x a { display: block; width: 120px; height: 40px; border: 1px solid #c07575; border-radius: 5px; text-align: center; line-height: 40px; font-size: 16px; color: #93080c; margin: 0 auto; } /* section4 */ .section4 { padding-top: 65px; padding-bottom: 70px; } .section4 .s4l { float: left; width: 48%; margin-right: 2%; } .main .section4 .more .ac { font-size: 30px; /* line-height: 16px; */ color: #333; vertical-align: middle; padding-left: 15px; } .main .section4 .more .much { /* text-align: right; */ float: right; padding-top: 15px; font-size: 16px; line-height: 16px; color: #93080c; } .section4 ul li a { display: block; } .section4 ul li a em { color: #93080c; float: left; padding-top: 13px; } .section4 ul { margin-top: 21px; } .section4 ul li a p { padding-left: 8px; margin-right: 100px; font-size: 16px; line-height: 44px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #333; } .section4 ul li:hover p { color: #93080c; } .section4 ul li a span { float: right; margin-top: -44px; font-size: 15px; line-height: 44px; color: #878787; } .section4 .s4m { float: left; width: 30.8%; padding-left: 3.3%; padding-right: 3.3%; } .section4 .s4r { float: right; width: 48%; margin-left: 2%; } /* section5 */ .section5 { /* width: 100%; */ display: none; /* height: 100%; */ padding-top: 58px; padding-bottom: 55px; background: url(../images/s5b.png); } .section5 .more a { display: block; text-align: center; } .section5 .more .ac { font-size: 30px; line-height: 16px; color: #333; padding-left: 15px; vertical-align: middle; } .section5 .more .much { float: right; font-size: 16px; line-height: 16px; color: #93080c; } .section5 .s5l { /* float: left; */ /* width: 31.2% !important; */ } .section5 .context { padding-top: 45px; } .section5 .context a { display: block; overflow: hidden; padding: 0 20px; } .section5 .slick-next { right: 0; } .section5 .context img:hover { transform: scale(1.1); transition: all 1s; } .section5 .pic { padding-top: 60.4%; } .section5 .context .date { padding-top: 27px; padding-bottom: 13px; font-size: 15px; line-height: 16px; color: #93080c; border-bottom: 1px solid #d4a5a3; } .section5 .context h4 { padding-top: 14px; margin-bottom: 21px; font-size: 16px; line-height: 26px; height: 56px; overflow: hidden; text-align: justify; color: #333; } .section5 .context a .neor:hover .ex { color: #93080c; } .section5 .context .ex { font-size: 14px; line-height: 23px; height: 69px; overflow: hidden; color: #808080; text-align: justify; } .section5 .s5m { /* float: left; */ /* width: 30.8% !important; */ /* padding-left: 3.3%; padding-right: 3.3%; */ } .section5 .s5r { /* float: left; */ /* width: 31.2% !important; */ } .section5 .slick-prev:before { content: ""; } .section5 .slick-next:before { content: ""; } /* section6 */ .section6 { padding-top: 48px; padding-bottom: 68px; } .main .section6 .more { padding-bottom: 33px; } .main .section6 .more a { display: block; } .main .section6 .more .ac { font-size: 30px; /* line-height: 16px; */ color: #333; vertical-align: middle; padding-left: 15px; } .main .section6 .more .much { /* text-align: right; */ float: right; padding-top: 15px; font-size: 16px; line-height: 16px; color: #93080c; } .section6 .s6 a { display: block; overflow: hidden; padding: 0 10px; } .section6 .pic { padding-top: 34.7%; } .section6 .s6 a:hover img { transform: scale(1.1); transition: all 1s; } .section6 .slick-next { right: 0; } .section6 .slick-next:before { content: ""; }