@charset "utf-8"; @font-face { font-family: 'alibabapuhuitiblack'; src: format('truetype'); } @font-face { font-family: 'alibabapuhuitimedium'; src: format('truetype'); } body, html { background: #fff; display: block; } .banner { width: 100%; height: 617px; } .banner img { width: 100%; height: 617px; } .newbanner { width: 100%; height: 1060px; position: relative; z-index: 10; background: center no-repeat; } .mainbg { width: 1300px; margin: auto; background: #f3f3f3; position: absolute; top: 0; left: 50%; margin-left: -650px; z-index: 0; height: 200%; } .newbanner .text { position: absolute; width: 50%; left: 25%; bottom: 233px; } .newbanner .text p { color: #306bab; font-size: 20px; line-height: 24px; text-align: justify; text-indent: 2em; font-family: 'alibabapuhuitimedium'; } .mainwidth { width: 1300px; margin: auto; background: #f3f3f3; padding: 50px; box-sizing: border-box; } .lyoutbg1 { background: url(/uploads/image/zzimg/lyoutbg1.png) no-repeat center bottom #f3f3f3 } .intro p { color: #4456b7; font-size: 25px; text-indent: 2em; line-height: 36px; font-family: 'alibabapuhuitimedium'; } .nav { width: 100%; position: relative; z-index: 10; } .nav ul { padding-bottom: 80px; width: 1300px; margin: 0 auto; padding: 0 30px 80px 30px; box-sizing: border-box; } .nav li { background: rgba(254, 212, 105, 1); border-radius: 5px; margin-right: 47px; height: 70px; width: 210px; line-height: 70px; text-align: center; box-shadow: 0 0 0 4px rgba(243, 243, 243, 1); font-size: 25px; cursor: pointer; } .nav li a { color: #4456b7; font-family: 'alibabapuhuitimedium'; } .nav li:hover { background: #fed469; box-shadow: 0 0 0 4px rgba(254, 212, 105, 1); } .nav li:hover a { font-size: 32px; color: #3b3f60; font-weight: bold; } .fixednav { position: fixed; top: 0px; left: 0px; width: 100%; z-index: 9999; box-shadow: -5px 2px 8px #daa828; background: #fff !important; } .public { position: relative; z-index: 10; margin: 0 auto; background: no-repeat top center; } .public>.tit1 { width: 725px; height: 95px; margin: 0 auto; text-align: center; } .public>.tit1 img { margin-top: 20px; } .public>.tit2 { font-size: 35px; color: #4456b7; font-family: 'alibabapuhuitiblack'; text-align: center; } .public>.tit3 { font-size: 25px; color: #4456b7; text-align: center; font-family: 'alibabapuhuitimedium'; font-weight: bold; } .lxq { width: 1200px; height: 900px; margin: 20px auto; overflow: hidden; } .zfl { width: 1200px; height: 440px; margin: 20px auto; position: relative; } .xfc { width: 100%; margin-top: -150px; } .xf { width: 100%; height: 680px; position: relative; } .xf>.pics { position: absolute; width: 62%; height: 100%; } .xf>.text { position: absolute; width: 500px; height: 100%; z-index: 10; left: 57%; /* padding: 100px 40px 40px 40px; */ box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; align-items: center; } .xf>.text p { display: inline-block; color: #fff; text-indent: 2em; line-height: 35px; font-size: 20px; /* text-shadow: 0 0 4px #000; */ font-family: 'alibabapuhuitimedium'; } .bg1 { background: linear-gradient(to right, rgba(0, 103, 179), rgba(157, 148, 221)); } .bg2 { background: linear-gradient(to right, rgba(187, 202, 128), rgba(98, 153, 44)); } .bg3 { background: linear-gradient(to right, rgba(255, 201, 142), rgba(182, 142, 81)); } .bg4 { background: linear-gradient(to right, rgba(144, 190, 216), rgba(62, 144, 183)); } .bg5 { background: linear-gradient(to right, rgba(211, 241, 255), rgba(132, 199, 227)); } .qjd { width: 100%; height: 540px; background: #4456b7; } .footer { height: 58px; background: #004898; color: #b5cde3; text-align: center; line-height: 58px; } .footer span { margin: 0 10px; } .swiper_demo1 { position: relative; width: 100%; height: 900px; } .swiper_demo1 .swiper-slide { height: 900px; text-align: center; position: relative; } .swipernonbg { background: none; margin-bottom: 20px; } .swiper_demo1 .swiper-slide .inpic { width: 100%; height: 547px; } .swiper_demo1 .swiper-slide img { width: 100%; height: 100%; border-radius: 20px; } .swiper_demo1 .pagination { position: absolute; z-index: 1; top: 600px; right: 60px; width: 140px; height: 24px; background: #fff; border-radius: 20px; text-align: center; } .swiper_demo1 .swiper-pagination-switch { display: inline-block; width: 10px; height: 10px; margin: 0 4px; cursor: pointer; border-radius: 20%; background-color: #decfcf; } .swiper_demo1 .pagination .swiper-active-switch { background-color: #0455b4; } .swiper_demo1 .arrow i { position: absolute; z-index: 1; top: 38%; display: inline-block; cursor: pointer; } .swiper_demo1 .arrow .arrow-left { left: 20px; } .swiper_demo1 .arrow .arrow-left i { color: #fff; font-size: 40px; } .swiper_demo1 .arrow .arrow-right { right: 20px; transform: scalex(-1); } .swiper_demo1 .arrow .arrow-right i { color: #fff; font-size: 40px; } /* demo2 */ .swiper_demo2 { position: relative; width: 100%; height: 900px; } .swiper_demo2 .swiper-slide { height: 900px; text-align: center; position: relative; } .swiper_demo2 .swiper-slide .inpic { width: 100%; height: 547px; } .swiper_demo2 .swiper-slide img { width: 100%; height: 100%; border-radius: 20px; } .swiper_demo2 .pagination { position: absolute; z-index: 1; top: 600px; right: 60px; width: 140px; height: 24px; background: #fff; border-radius: 20px; text-align: center; } .swiper_demo2 .swiper-pagination-switch { display: inline-block; width: 10px; height: 10px; margin: 0 4px; cursor: pointer; border-radius: 20%; background-color: #decfcf; } .swiper_demo2 .pagination .swiper-active-switch { background-color: #0455b4; } .swiper_demo2 .arrow i { position: absolute; z-index: 1; top: 38%; display: inline-block; cursor: pointer; } .swiper_demo2 .arrow .arrow-left { left: 20px; } .swiper_demo2 .arrow .arrow-left i { color: #fff; font-size: 40px; } .swiper_demo2 .arrow .arrow-right { right: 20px; transform: scalex(-1); } .swiper_demo2 .arrow .arrow-right i { color: #fff; font-size: 40px; } /* demo3 */ .swiper_demo3 { position: relative; width: 100%; height: 900px; } .swiper_demo3 .swiper-slide { height: 900px; text-align: center; position: relative; } .swiper_demo3 .swiper-slide .inpic { width: 100%; height: 547px; } .swiper_demo3 .swiper-slide img { width: 100%; height: 100%; border-radius: 20px; } .swiper_demo3 .pagination { position: absolute; z-index: 1; top: 600px; right: 60px; width: 140px; height: 24px; background: #fff; border-radius: 20px; text-align: center; } .swiper_demo3 .swiper-pagination-switch { display: inline-block; width: 10px; height: 10px; margin: 0 4px; cursor: pointer; border-radius: 20%; background-color: #decfcf; } .swiper_demo3 .pagination .swiper-active-switch { background-color: #0455b4; } .swiper_demo3 .arrow i { position: absolute; z-index: 1; top: 38%; display: inline-block; cursor: pointer; } .swiper_demo3 .arrow .arrow-left { left: 20px; } .swiper_demo3 .arrow .arrow-left i { color: #fff; font-size: 40px; } .swiper_demo3 .arrow .arrow-right { right: 20px; transform: scalex(-1); } .swiper_demo3 .arrow .arrow-right i { color: #fff; font-size: 40px; } /* demo4 */ .swiper_demo4 { position: relative; width: 100%; height: 780px; } .swiper_demo4 .swiper-slide { height: 780px; text-align: center; } .swiper_demo4 .swiper-slide img { width: 100%; height: 100%; border-radius: 20px; } .swiper_demo4 .pagination2 { position: absolute; z-index: 1; width: 1300px; left: 50%; margin-left: -650px; height: 50px; margin-top: 20px; text-align: center; } .swiper_demo4 .swiper-pagination-switch { display: inline-block; width: 150px; height: 14px; margin: 0 50px; cursor: pointer; background: linear-gradient(to right, rgba(251, 197, 99, 1), rgba(251, 197, 99, 0)); } .swiper_demo4 .pagination2 .swiper-active-switch { background: linear-gradient(to right, rgba(82, 97, 172, 1), rgba(82, 97, 172, 0)); } .swiper_demo4 .arrow i { position: absolute; z-index: 1; top: 50%; display: inline-block; cursor: pointer; } .swiper_demo4 .arrow .arrow-left { left: 10px; } .swiper_demo4 .arrow .arrow-right { right: 10px; } /* 致富路*/ .textwrap { position: relative; width: 1200px; height: 320px; overflow: hidden; } .txtcon { position: absolute; width: 9600px; height: 320px; left: 0; } .txt { width: 1200px; /* float: left; */ position: absolute; /* display: none; */ opacity: 0 } .txt:nth-child(1) { /* display: block; */ opacity: 1 } /* .t1 { position: absolute; top: 0; left: 0; z-index: 3; } .t2 { position: absolute; top: 0; left: 1200px; z-index: 3; } .t3 { position: absolute; top: 0; left: 2400px; z-index: 3; } .t4 { position: absolute; top: 0; left: 3600px; z-index: 3; } .t5 { position: absolute; top: 0; left: 4800px; z-index: 3; } .t6 { position: absolute; top: 0; left: 6000px; z-index: 3; } .t7 { position: absolute; top: 0; left: 7200px; z-index: 3; } .t8 { position: absolute; top: 0; left: 8400px; z-index: 3; } */ /* 文字 */ .wrap { margin: 50px auto; width: 1200; height: 442px; position: relative; overflow: hidden; border-radius: 0 20px 20px 0; border-right: solid 2px #fff; } .zfl .leftbtn { position: absolute; z-index: 100; left: 0px; top: 35%; height: 150px; /* line-height: 150px; */ /* background: red; */ width: 60px; background: rgba(0, 0, 0, 0.4); /* background: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)); */ /* border-radius: 20px 0 0 20px; */ cursor: pointer; } .zfl .leftbtn i { position: absolute; left: 20px; top: 35%; font-size: 30px; color: #fff; } .zfl .rightbtn { position: absolute; z-index: 100; right: 2px; top: 35%; height: 150px; width: 60px; /* background: linear-gradient(to right, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)); */ background: rgba(0, 0, 0, 0.4); /* border-radius: 20px 0 0 20px; */ cursor: pointer; cursor: pointer; transform: scalex(-1); } .zfl .rightbtn i { position: absolute; /* left: 20px; top: 45%; */ left: 20px; top: 35%; font-size: 30px; color: #fff; } .pic { width: 800px; height: 442px; cursor: pointer; border-radius: 20px; border: solid 2px #fff; } .pic .picicon { position: absolute; background: #ffe4af; width: 11px; height: 28px; top: 30px; z-index: 1000; } .pic1 { position: absolute; top: 0; left: 0; z-index: 1; } .pic2 { position: absolute; top: 0; left: 780px; z-index: 3; } .pic3 { position: absolute; top: 0; left: 840px; z-index: 5; } .pic4 { position: absolute; top: 0; left: 900px; z-index: 7; } .pic5 { background: ; position: absolute; top: 0; left: 960px; z-index: 9; } .pic6 { background: ; position: absolute; top: 0; left: 1020px; z-index: 9; } .pic7 { background: ; position: absolute; top: 0; left: 1080px; z-index: 9; } .pic8 { background: ; position: absolute; top: 0; left: 1140px; z-index: 9; }