锘縤mg { max-width: 100%; } body { font-size: 0; } .right { float: right; } .shehui-1 .text h2 br{ display: none; } .shehui-4 .swiper-slide .img1{ display: block; } .shehui-4 .swiper-slide .img2{ display: none; } .left { float: left; } .shehui-1 .text h2 { font-size: 70px; color: #FFFFFF; margin-bottom: 45px; } .shehui-1 .text { position: absolute; top: 60%; right: 13%; transform: translateY(-50%); } .shehui-1 .text p { font-size: 18px; color: #FFFFFF; margin-bottom: 15px; } .shehui-1 .text i { width: 23px; height: 20px; display: inline-block; vertical-align: middle; margin-right: 15px; } .shehui-2 { padding: 150px 0 160px 0; } .shehui-2 .conn2-left { width: 45%; float: left; } .shehui-2 .conn2-left h2 { font-weight: bold; font-size: 30px; } .shehui-2 .conn2-left i { display: block; width: 56px; height: 2px; margin: 20px 0; background: #f5c921; } .shehui-2 .conn2-left .text:nth-of-type(1) p { font-size: 16px; color: #333333; line-height: 30px; margin-bottom: 100px; color: #999999; } .shehui-2 .conn2-left .text:nth-of-type(4) p { font-size: 16px; color: #333333; line-height: 30px; padding-top: 70px; margin-bottom: 0; color: #999999; } .shehui-2 .text { clear: both; width: 78%; } .shehui-2 .conn2-left .conn2-img { float: left; width: 45.4%; height: 296px; margin-right: 6%; overflow: hidden; } .shehui-2 .conn2-left .conn2-img img { transition: .5s; width: 100%; } .shehui-2 .conn2-left .conn2-img:hover img { transform: scale(1.1); } .shehui-2 .conn2-left .conn2-img:nth-of-type(3) { margin: 0; } .shehui-2 .conn2-right { width: 53%; } .shehui-2 .conn2-right .text { margin-top: 70px; } .shehui-2 .conn2-right .text p { font-size: 16px; color: #333; line-height: 30px; color: #999999; } .shehui-2 .conn2-right .conn2-right-img { width: 99%; height: 600px; overflow: hidden; } .shehui-2 .conn2-right .conn2-right-img img { transition: .5s; width: 100%; } .shehui-2 .conn2-right .conn2-right-img:hover img { transform: scale(1.1); } .shehui-3 .content { position: relative; z-index: 1; } .shehui-3 .conn3-left { position: absolute; top: 140px; left: 12%; width: 28%; z-index: 2; transition: 1s; background-size: cover; } .shehui-3 .conn3-left span { width: 100%; display: block; background: #f5c921; position: absolute; bottom: 0; font-size: 100px; color: #f7d465; text-align: right; padding-top: 70px; padding-bottom: 40px; padding-right: 30px; } .shehui-3 .swiper-container { width: 100%; float: right; text-align: right; } .shehui-3 .conn3 { width: 63%; text-align: left; float: right; } .shehui-3 .conn3 img { width: 100%; } .shehui-3 .conn3-bottom .swiper-container { width: 80%; text-align: left; } .shehui-3 .conn3-bottom .conn3 { width: 100%; height: auto; margin-bottom: 50px; } .shehui-3 .conn3-bottom { clear: both; position: relative; } .shehui-3 .conn3-bottom .conn-dian { float: left; width: 49%; } .shehui-3 .conn3-bottom .shixian { width: 322px; height: 2px; background: #e9e9e8; position: absolute; top: 180px; left: 33%; } .shehui-3 .conn3-bottom .conn-dian .header2-zy { margin-top: 170px; } .shehui-3 .conn3-bottom .conn-text { float: right; width: 49%; } .shehui-3 .conn3-bottom .conn-text h3 { font-size: 24px; color: #636363; padding-bottom: 10px; padding-top: 70px; } .shehui-3 .conn3-bottom .conn-text h2 { font-size: 36px; color: #333333; padding-bottom: 45px; } .shehui-3 .conn3-bottom .conn-text p { font-size: 16px; padding-bottom: 50px; line-height: 30px; color: #636363; } .shehui-3 .swiper-pagination { margin-left: 200px; } .shehui-3 .swiper-pagination-bullet { width: 20px; height: 20px; background: #d3d3d3; margin-right: 60px; opacity: 1; border: solid 2px #d3d3d3; } .shehui-3 .swiper-pagination-bullet-active { background: #FFFFFF; border: solid 2px #d3d3d3; } .shehui-3 .conn3-left img { opacity: 0; visibility: hidden; } .shehui-4 .swiper-pagination { color: #FFFFFF; font-size: 18px; width: 4%; display: inline-block; border: 1px solid #8d8885; margin: 0 auto; padding: 5px; text-align: center; left: 0; right: 0; margin: auto; bottom: 90px; } .shehui-4 .swiper-slide { position: relative; } .shehui-4 .swiper-slide:before { content: " "; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .7); } .shehui-4 .swiper-slide img { width: 100%; height: 100%; } .shehui-4 .swiper-button-next, .shehui-4 .swiper-button-prev { width: 42px; height: 42px; } .shehui-4 .swiper-button-prev { background-image: url("/static/home/images/img-H/s3-jiantou_01_03.png"); background-size: contain; left: 77px; } .shehui-4 .swiper-button-next { background-image: url("/static/home/images/img-H/s3-jiantou_03.png"); background-size: contain; right: 77px; } .shehui-4 .text { position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: auto; text-align: center; } .shehui-4 .text h3 { font-size: 30px; color: #FFFFFF; } .shehui-4 .text i { display: block; width: 48px; height: 2px; background: #f5c921; margin: 15px auto 40px auto; } .shehui-4 .text h2 { font-size: 36px; color: #FFFFFF; margin-bottom: 34px; } .shehui-4 .text p { font-size: 22px; color: #FFFFFF; } @media only screen and (max-width: 1700px) { .shehui-3 .conn3-bottom .shixian { left: 29%; } .shehui-2 { padding: 130px 0 140px 0; } .shehui-2 .conn2-left .text:nth-of-type(1) p { margin-bottom: 32px; } .shehui-2 .text { width: 82%; } .shehui-2 .conn2-left .text:nth-of-type(4) p { padding-top: 32px; } .shehui-2 .conn2-right .text { margin-top: 32px; } .shehui-3 .swiper-pagination { margin-left: 8%; } .shehui-3 .conn3-bottom .conn-text p { padding-bottom: 30px; } .comm_top { margin-top: 145px; } .shehui-2 .conn2-left .conn2-img img, .shehui-2 .conn2-left .conn2-img { height: 248px; } .shehui-2 .conn2-left .conn2-img { width: 43.6%; } .shehui-2 .conn2-right .conn2-right-img img, .shehui-2 .conn2-right .conn2-right-img { height: 482px; } .shehui-3 .conn3-bottom .conn-text h3 { padding-top: 70px; } } @media only screen and (max-width: 1600px) { .shehui-1 .text h2 { font-size: 60px; } .shehui-2 { padding: 110px 0 120px 0; } .shehui-2 .conn2-left h2 { font-size: 28px; } .shehui-2 .conn2-left .text:nth-of-type(1) p { line-height: 28px; margin-bottom: 42px; } .shehui-2 .conn2-left .text:nth-of-type(4) p, .shehui-2 .conn2-right .text p { line-height: 28px; } .shehui-3 .conn3-left span { padding-top: 60px; padding-bottom: 30px; font-size: 70px; } .shehui-3 .conn3-bottom .conn-text p { line-height: 28px; } .shehui-3 .conn3-bottom .shixian { left: 28%; } .shehui-3 .conn3-bottom .conn-text h2 { font-size: 32px; } .shehui-4 .text h2 { font-size: 32px; } .shehui-4 .swiper-pagination { bottom: 80px; } } @media only screen and (max-width:1500px) { .shehui-1 .text h2 { font-size: 50px; margin-bottom: 35px; } .shehui-2 { padding: 90px 0 100px 0; } .shehui-2 .text { width: 90%; } .shehui-3 .conn3-left span { padding-top: 50px; padding-bottom: 20px; font-size: 60px; } .shehui-3 .conn3-bottom .conn-text h2 { font-size: 30px; padding-bottom: 35px; } .shehui-4 .text h2 { font-size: 30px; } .shehui-4 .swiper-pagination { bottom: 70px; } .shehui-3 .conn3-bottom .conn-dian .header2-zy { margin-top: 235px; } .shehui-3 .conn3-bottom .shixian { top: 244px; } } @media only screen and (max-width:1440px) { .comm_top { margin-top: 129px; } .shehui-1 .text h2 { font-size: 46px; margin-bottom: 30px; } .shehui-2 { padding: 70px 0 80px 0; } .shehui-2 .conn2-left .text:nth-of-type(1) p, .shehui-2 .conn2-left .text:nth-of-type(4) p, .shehui-2 .conn2-right .text p { line-height: 26px; } .shehui-2 .conn2-left i { margin: 18px 0; } .shehui-3 .conn3-left span { padding-top: 40px; padding-bottom: 10px; font-size: 50px; } .shehui-3 .conn3-bottom .conn-text h3 { font-size: 22px; color: #636363; padding-bottom: 10px; padding-top: 140px; } .shehui-3 .conn3-bottom .conn-dian .header2-zy { margin-top: 230px; } .shehui-3 .conn3-bottom .shixian { width: 290px; top: 240px; left: 29%; } .shehui-3 .conn3-bottom .conn-text p { padding-bottom: 20px; } .shehui-4 .swiper-pagination { width: 6%; } .shehui-4 .text h3 { font-size: 22px; } .shehui-4 .text h2 { font-size: 26px; } .shehui-4 .text i { margin: 15px auto 30px auto; } .shehui-2 .conn2-left .text:nth-of-type(1) p, .shehui-2 .conn2-left .text:nth-of-type(4) p, .shehui-2 .conn2-right .text p { font-size: 14px; line-height: 24px; } .shehui-2 .conn2-left h2 { font-size: 24px; } .shehui-2 .conn2-left .text:nth-of-type(1) p { margin-bottom: 32px; } .shehui-2 { padding: 50px 0 60px 0; } .shehui-3 .conn3-left span { padding-top: 30px; padding-bottom: 10px; font-size: 40px; } .shehui-3 .conn3-bottom .conn-text h3 { font-size: 20px; padding-top: 75px; } .shehui-3 .conn3-bottom .conn-text h2 { font-size: 26px; padding-bottom: 30px; } .shehui-3 .conn3-bottom .conn-text p { line-height: 26px; font-size: 14px; } .shehui-3 .conn3-bottom .conn-dian .header2-zy { margin-top: 155px; } .shehui-3 .conn3-bottom .shixian { width: 245px; top: 165px; left: 31%; } .shehui-4 .text h2 { font-size: 24px; } .shehui-2 .conn2-left .conn2-img img, .shehui-2 .conn2-left .conn2-img { height: 215px; } .shehui-2 .conn2-right .conn2-right-img img, .shehui-2 .conn2-right .conn2-right-img { height: 412px; } } @media only screen and (max-width: 1366px) { .shehui-3 .conn3 { width: 70%; height: 400px; } .shehui-2 .conn2-right .conn2-right-img { width: 96%; } .shehui-4 .text p { font-size: 20px; } .shehui-3 .swiper-container { width: 88%; float: none; margin: inherit; } .shehui-3 .conn3-left { position: absolute; top: 84px; left: 10%; width: 22%; } .shehui-3 .conn3-bottom .conn-text h3 { padding-top: 5px; padding-bottom: 0; } .shehui-3 .conn3-bottom .conn-text h2 { padding-bottom: 5px; } .shehui-3 .conn3-bottom .shixian { width: 176px; top: 70px; left: 31%; } .shehui-3 .conn3-bottom .conn-dian .header2-zy { margin-top: 60px; } .shehui-3 .conn3-bottom .conn-text p { padding-bottom: 0 } } @media only screen and (max-width: 1200px) { .shehui-1 .text h2 { font-size: 36px; margin-bottom: 25px; } .shehui-1 .text p { font-size: 16px; } .shehui-2 { padding: 30px 0 40px 0; } .shehui-2 .conn2-left h2 { font-size: 20px; } .shehui-2 .conn2-left i { margin: 15px 0; } .shehui-2 .conn2-right .conn2-right-img { width: 86%; height: 382px; } .shehui-2 .conn2-right .conn2-right-img img { width: 100%; height: 100%; } .shehui-2 .conn2-left .text:nth-of-type(4) p { padding-top: 25px; } .shehui-2 .conn2-right .text { margin-top: 25px; } .shehui-3 .conn3-left { top: 150px; } .shehui-3 .conn3-left span { padding-top: 20px; padding-bottom: 10px; font-size: 30px; } .shehui-3 .conn3-bottom .conn-text h3 { font-size: 18px; padding-top: 70px; } .shehui-3 .conn3-bottom .conn-text h2 { font-size: 22px; padding-bottom: 20px; } .shehui-3 .conn3-bottom .conn-dian .header2-zy { margin-top: 135px; } .shehui-3 .conn3-bottom .shixian { width: 120px; top: 146px; left: 39%; } .shehui-3 .conn3-bottom .conn-text p { padding-bottom: 30px; line-height: 24px; } .shehui-4 .text h3 { font-size: 20px; } .shehui-4 .text h2 { font-size: 22px; } .shehui-4 .text i { margin: 15px auto 20px auto; } .shehui-4 .swiper-button-next, .shehui-4 .swiper-button-prev { width: 31px; height: 32px; } .shehui-4 .swiper-pagination { bottom: 40px; width: 6%; } .shehui-2 .conn2-left .conn2-img img, .shehui-2 .conn2-left .conn2-img { width: 171px; height: 172px; } .shehui-3 .conn3 { width: 100%; height: 365px; } .shehui-3 .swiper-container { float: right; } .shehui-3 .conn3-left { left: 0; top: 185px; } .shehui-3 .content { width: 72%; position: relative; margin: 0 auto; } } @media only screen and (max-width: 992px) { .shehui-3 .content { width: 100%; padding: 0 15px; } .shehui-4 .swiper-slide .img1{ display: none; } .shehui-4 .swiper-slide .img2{ display: block; } .shehui-1 .text h2 br{ display: block; } .shehui-3 .conn3-bottom .conn-dian .header2-zy { margin-top: 75px; } .shehui-3 .conn3-bottom .conn-text h3 { padding-top: 22px; } .comm_top { margin-top: 60px; } .shehui-1 .text h2 { font-size: 22px; line-height: 30px; text-align: center; margin-bottom: 20px; } .shehui-1 .text p { font-size: 14px; } .shehui-1 .text { width: 100%; right: 0; left: 0; margin: auto; padding: 0 15px; } .shehui-1 .text i { width: 15px; height: 15px; } .shehui-2 .conn2-left { width: 100%; } .shehui-2 .text { width: 100%; } .shehui-2 .conn2-right { width: 100%; } .shehui-4 .text h3 { font-size: 14px; } .shehui-4 .text i { margin: 10px auto 10px auto; } .shehui-4 .text h2 { font-size: 16px; margin-bottom: 5px; } .shehui-4 .text p { font-size: 12px; line-height: 20px; } .shehui-4 .swiper-button-next, .shehui-4 .swiper-button-prev { width: 24px; height: 26px; } .shehui-4 .swiper-button-next { right: 14px; } .shehui-4 .swiper-button-prev { left: 14px; } .shehui-4 .swiper-pagination { bottom: 5px; width: 11%; font-size: 12px; padding: 2px; } .shehui-2 .conn2-left .conn2-img:nth-of-type(odd) { float: right; } .shehui-2 .conn2-left .conn2-img { width: 49%; margin-right: 0; height: auto; } .shehui-2 .conn2-left .conn2-img img { width: 100%; } .shehui-2 .conn2-right .conn2-right-img { width: 100%; height: auto; } .shehui-2 .conn2-right .conn2-right-img img { width: 100%; } .shehui-2 { padding: 20px 0; } .shehui-2 .conn2-left .text:nth-of-type(1) p { margin-bottom: 20px; } .shehui-2 .conn2-left .text:nth-of-type(4) p { padding-top: 20px; padding-bottom: 20px; } .shehui-2 .conn2-right .text { margin-top: 20px; } .swiper-button-next, .swiper-button-prev { transform: translateY(-50%); margin: 0; } .shehui-4 .text { width: 100%; padding: 0 50px; box-sizing: border-box; } .shehui-3 .conn3 { width: 100%; } .shehui-3 .swiper-container { width: 100%; padding-bottom: 32px; } .shehui-3 .conn3-bottom .shixian { width: 15%; display: none; } .shehui-3 .conn3-bottom .swiper-container { padding-bottom: 0; } .shehui-3 .conn3-bottom .conn3 { height: auto; padding: 0 15px; margin-bottom: 0; box-sizing: border-box; } .shehui-3 .conn3-bottom .conn-text p { padding-bottom: 20px; } .shehui-3 .conn3-left { background: none !important; width: 46%; top: 56%; text-align: center; transform: translateY(-50%); display: none; } .shehui-3 .conn3-bottom .conn-text h3 { padding-bottom: 10px; } .shehui-3 .conn3-bottom .conn-text h2 { padding-bottom: 10px; } .shehui-3 .conn3-left span { text-align: center; padding: 10px 0; padding-right: 0; } .shehui-3 .content { padding: 0; padding-bottom: 48px; } .shehui-3 .conn3-left img { display: none; } .shehui-3 .conn3-bottom .conn-dian { position: absolute; bottom: 0; } .shehui-3 .conn3 span { width: 46%; display: inline-block; background: #f5c921; position: absolute; left: 0; bottom: -32px; z-index: 2; font-size: 30px; color: #f7d465; text-align: right; padding-top: 70px; padding-bottom: 40px; padding-right: 30px; text-align: center; padding: 4% 0px; } .shehui-3 .conn3-bottom .conn-text { width: 100%; margin-top: 15px; } /*.shehui-4 .swiper-container{ height: 230px; } .shehui-4 .swiper-container img{ opacity: 0; } .shehui-4 .swiper-container .swiper-slide:nth-of-type(1){ background: url("/static/home/images/img-H/s4-item1_03.jpg")center no-repeat; background-size: cover; } .shehui-4 .swiper-container .swiper-slide:nth-of-type(2){ background: url("/static/home/images/img-H/s4-item1_02.jpg")center no-repeat; background-size: cover; } .shehui-4 .swiper-container .swiper-slide:nth-of-type(3){ background: url("/static/home/images/img-H/s4-item1_04.jpg")center no-repeat; background-size: cover; } .shehui-1 .text i img{ height: auto; }*/ .shehui-2 .conn2-left h2 { text-align: center; } .shehui-2 .conn2-left i { margin: 15px auto; } .shehui-2 .conn2-left .text:nth-of-type(1) p { text-align: center; } .shehui-2 .conn2-left .conn2-img, .shehui-2 .conn2-left .text:nth-of-type(4) p, .conn2-right { display: none; } } @media only screen and (max-width: 768px) { .shehui-3 .conn3-bottom .conn-dian .header2-zy { margin-top: 20px; } .shehui-3 .conn3-bottom .conn-text h3 { font-size: 16px; padding-top: 20px; } .shehui-3 .conn3-bottom .conn-text h3 { font-size: 16px; padding-top: 0px; } .shehui-3 .conn3 { width: 100%; height: auto; } .shehui-3 .conn3-bottom .conn-dian { width: 100%; } .shehui-3 .swiper-pagination { left: 0; margin-left: 0; right: 0; margin: auto; } .shehui-3 .swiper-pagination-bullet { margin: 0; margin: 0 25px; } .shehui-3 .conn3-bottom .shixian { width: 100%; top: 60px; left: 0; right: 0; margin: auto; } .shehui-3 .conn3-bottom .swiper-container { width: 100%; } .shehui-3 .content { width: 100%; } }