html,body{ height: 100%; width: 100%; font-size: 14px; } .icon-logo{ background-image: ; width: 316px; height: 60px; background-position: center; background-repeat: no-repeat; -webkit-background-size:316px 44px; background-size:316px 44px; background-color: transparent; margin-left:30px; float: left; } /*swiper配置*/ .swiper-container{ height: 100%; width:100%; } .swiper-container2{ height: 100%; width: 100%; } .swiper-container .swiper-wrapper{ height: 100%; } .swiper-container .swiper-slide{ height: 100%!important; } /*内容*/ .content{ max-width: 1600px; width: 1280px; margin: 0 auto; height: 100%; position: relative; padding-top: 60px; } /*content-1*/ .content-1 .header{ background: transparent; } .content1-msg{ max-width: 1600px; width: 1280px; margin: 0 auto; height: 100%; position: relative; } .content2-msg{ max-width: 1600px; width: 1280px; margin: 0 auto; height: 100%; position: relative; } .banner-1{ background-image: ; width: 100%; height: 100%; background-size:100% 100%; position: absolute; z-index: 1000; } .banner-2{ background-image: ; width: 100%; height: 100%; background-size:100% 100%; position: absolute; z-index: 1000; } .banner-next{ background-image: ; width: 33px; height: 61px; position: absolute; top:50%; margin-top: -16px; left: 0; z-index: 100; } .banner-prev{ background-image: ; width: 33px; height: 61px; position: absolute; top:50%; margin-top: -16px; right: 0; z-index: 100; } .content2-1msg{ width: 100%; position: absolute; bottom: 200px; top: 50%; margin-top: -120px; } .icon-appapk{ margin-top: 40px; width: 550px; position: relative; left: 50%; margin-left: -275px; } .icon-banner2tingche{ background-image: ; width: 100%; height: 303px; background-size: 1920px 303px; background-position: center; } .content2-1msg .icon-app{ background-image: ; width: 251px; height: 73px; margin-right: 12px; } .content2-1msg .icon-apk{ background-image: ; width: 251px; height: 73px; } .content1-msg .icon-tixi{ background-image: ; width: 775px; height: 578px; background-position: center; background-repeat: no-repeat; position: absolute; top:50%; right: 0; margin-top:-289px; z-index: 9; } .content1-msg .font{ width: 600px; color: #fff; position: absolute; top:50%; margin-top: -55px; z-index: 10; } .content1-msg .font-1{ font-size: 30px; margin-bottom: 20px; } .content1-msg .font-2{ font-size: 16px; margin-bottom: 20px; line-height: 30px; } /*content2*/ .content-2{ background: #f6f6f6; } .content-2 h6{ font-size: 30px; text-align: center; font-weight: normal; color: #030303; margin: 20px 0; } .content-2 .p-center{ text-align: center; font-size: 14px; color: #232323; margin-bottom: 20px; } .content2-msg div{ float: left; display: inline-block; width: 370px; height: 270px; margin: 10px 23px; background: #fff; } .content2-msg div:hover{ border: 1px solid #2178ff; cursor: pointer; } .content2-msg .p-1{ text-align: center; font-size: 20px; margin-bottom:20px; } .content2-msg .p-2{ padding: 0 24px; text-align: center; font-size: 16px; line-height: 20px; } .content-2 .icon{ background-position: center; background-repeat: no-repeat; width: 370px; height: 140px; } .content-2 .icon-1{ background-image: ; background-size: 96px 74px; } .content-2 .icon-2{ background-image: ; background-size: 90px 73px; } .content-2 .icon-3{ background-image: ; background-size: 74px 74px; } .content-2 .icon-4{ background-image: ; background-size: 113px 74px; } .content-2 .icon-5{ background-image: ; background-size: 74px 74px; } .content-2 .icon-6{ background-image: ; background-size: 73px 73px; } .content-2 .icon-gengduo{ background-image: ; width: 200px; height: 50px; position: absolute; bottom:20px; left: 50%; margin-left: -100px; } .content-2 .icon-gengduoactive{ background-image: ; width: 200px; height: 50px; position: absolute; bottom:20px; left: 50%; margin-left: -100px; } /*content-3*/ .content-3{ background-image: ; width: 100%; height: 100%; background-size: 100% 100%; background-repeat: no-repeat; background-position: center; } .content3-msg{ background: #fff; padding: 35px 50px; margin: 0 auto; position: absolute; top:50%; margin-top:-281px; } .content3-msg .p-1{ font-size: 24px; text-align: center; line-height: 30px; margin-bottom: 15px; } .content3-msg .p-2{ font-size: 24px; text-align: center; line-height: 30px; margin-bottom: 20px; } .content3-msg .p-3{ font-size: 14px; text-align: center; line-height: 25px; color: #78746d; margin-bottom: 40px; } .content3-msg .color{ color: #1b72ff; } .content3-img{ margin-top: 20px; min-width: 1180px; text-align: center; } .content3-img div{ width: 365px; display: inline-block; position: relative; box-sizing: border-box; } .content-3 .icon3-1{ background-image: ; width: 465px; height:auto; } .content-3 .icon3-2{ background-image: ; width: 465px; height:auto; margin-left: 35px; } .content-3 .icon3-3{ background-image: ; width: 465px; height:341px; } .content-3 .icon3-1:hover{ border: 2px solid #2178ff; cursor: pointer; } .content-3 .icon3-2:hover{ border: 2px solid #2178ff; cursor: pointer; } .content-3 .icon3-3:hover{ border: 2px solid #2178ff; cursor: pointer; } .icon-more{ background-image: ; width: 365px; height: 270px; background-size: 208px 59px; background-repeat: no-repeat; background-position: center; background-color: rgba(49,122,224,0.7); position: absolute; top:0; left: 0; display: none; } /*content-4*/ .content-4{ background-image: ; width: 100%; height: 100%; background-size: 100% 100%; background-repeat: no-repeat; background-position: center; } .content-4 .p-1{ font-size: 30px; text-align: center; color: #030303; margin: 20px 0; } .content-4 .p-2{ font-size: 14px; text-align: center; color: #030303; margin-bottom:30px; } .content-4 .p-3{ color: #6b6b6b; background: #fff; font-size: 16px; display: inline-block; line-height: 30px; padding: 12px; width: 380px; box-sizing: border-box; } .content-4 .roundabout-moveable-item .p-3{ color: #696969; font-size: 18px; } .content-4 .roundabout-in-focus .p-3{ font-size: 20px; color: #fff; } .content-4 .roundabout-in-focus{ border: 0!important; opacity: 1!important; } .content-4 .roundabout-in-focus .p-3{ background: rgba(42,120,228,0.95); font-size: 16px; color: #fff; padding: 23px; display: inline-block; width: 646px; box-sizing: border-box; position: relative; top:-2px; line-height: 30px; } .content-4 .roundabout-in-focus .icon-anli{ background-image: ; width: 200px; height: 50px; margin: 20px auto; display: block; } .content-4 .roundabout-in-focus img{ max-width: 628px!important; } .content-4 .roundabout-moveable-item img{ max-width: 380px } .roundabout-moveable-item{ opacity: 0.8!important; } .icon-huanqiu{ /*background-image: ;*/ background-image: ; width: 380px; height:368px; background-size: 380px 368px; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); filter: gray; } .roundabout-in-focus .icon-huanqiu{ background-image: ; width: 646px; height:444px; background-size:646px 444px; background-repeat: no-repeat; background-position: center; -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: grayscale(0%); filter: light; } .icon-tianhong{ /*background-image: ;*/ background-image: ; width: 380px; height:368px; background-size: 380px 368px; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); filter: gray; } .roundabout-in-focus .icon-tianhong{ background-image: ; width: 646px; height:444px; background-size:646px 444px; background-repeat: no-repeat; background-position: center; -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: grayscale(0%); filter: light; } .icon-dongzhan{ /*background-image: ;*/ background-image: ; width: 380px; height:368px; background-size: 380px 368px; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); filter: gray; } .roundabout-in-focus .icon-dongzhan{ background-image: ; width: 646px; height:444px; background-size:646px 444px; background-repeat: no-repeat; background-position: center; -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: grayscale(0%); filter: light; } /*content-5*/ body .content-5{ background-image: ; width: 100%; height: 900px;!important; background-size: 100% 100%; background-position: center; background-repeat: no-repeat; } .content-5 .content-5-nav{ list-style: none; background: #09264e; margin-top: 120px; left: 0; display: inline-block; } .content-5 .content-5-nav .active{ color: #fff; background: #2e84fb; } .content-5 .content-5-nav li{ height: 40px; line-height: 40px; width: 70px; color: #dee1e6; text-align: center; } .content-5 .content-5-nav li:hover{ cursor: pointer; } .content-5 .about{ position: absolute; right: 0; top: 120px; width: 500px; } .content-5 .about-1{ background-image: ; width: 80%; height: 80%; /*background-size: 100% 100%;*/ /*background-position: center;*/ position: absolute; top:120px; left: 50%; margin-left: -40%; } .content-5 .about-2{ background-image: ; width: 80%; height: 80%; background-size: 100% 100%; background-position: center; position: absolute; top:120px; left: 50%; margin-left: -40%; } .content-5 .about-3{ background-image: ; width: 80%; height: 80%; background-size: 100% 100%; background-position: center; position: absolute; top:120px; left: 50%; margin-left: -40%; } /*content-6*/ .content-6 .p-1{ font-size: 30px; text-align: center; margin: 20px 0; color: black; } .content-6 .p-2{ font-size: 14px; text-align: center; margin-bottom:30px; color: black; } .content-6 .ul6{ list-style: none; height: auto; display: flex;align-items: center;justify-content: center; } .content-6 .ul6 .icon1{ display: inline-block; width: 312px; height: 182px; background-size: 312px 182px; background-repeat: no-repeat; background-position: center; } .content-6 .icon6-1{ background-image: ; } .content-6 .icon6-2{ background-image: ; } .content-6 .icon6-3{ background-image: ; } .content-6 .icon6-4{ background-image: ; } .content-6 .icon6-content{ width: 312px; box-sizing: border-box; border: 1px solid #ccc; height: 230px; border-top: 0; position: relative; top:-2px; padding: 24px; } .content-6 p{ font-size: 14px; color: #606060; line-height: 25px; } .content-6 .ul6 li{ float: left; display: inline-block; margin: 0 40px; } .content-6 .ul6 li img{ width: 100%; height: 100%; } #content-6 a{ font-size: 17px; padding: 8px 40px; color: white; border: 1px #2d8cfb solid; border-radius: 4px; background-color: #2d8cfb; text-decoration:none; } #content-6 a:hover{ text-decoration:none; } #content-6 a:visited { text-decoration:none; } #content-6 a:active { background-color: #f5f5f5; text-decoration:none; } /*动画*/ .info{ -webkit-animation:fadeinup 1s .1s ease both; -moz-animation:fadeinup 1s .1s ease both;} @-webkit-keyframes fadeinup{ 0%{opacity:0; -webkit-transform:translatey(20px)} 100%{opacity:1; -webkit-transform:translatey(0)} } @-moz-keyframes fadeinup{ 0%{opacity:0; -moz-transform:translatey(20px)} 100%{opacity:1; -moz-transform:translatey(0)} } .content-7,.content-6{ margin-top: 15px; } .content-7 .p-1{ font-size: 30px; text-align: center; margin: 20px 0; } .content-7 .p-2{ font-size: 14px; text-align: center; margin-bottom:30px; } .content-7 .ul6{ list-style: none; height: auto; } .content-7 .ul6 .icon1{ display: inline-block; width: 312px; height: 182px; background-size: 312px 182px; background-repeat: no-repeat; background-position: center; } .c-7-data{ width: 1280px; height: 600px; margin:0 auto 40px; display: flex; box-shadow: 20px 20px 50px #c6c6c6; } .content-left{ width: 60%;padding: 40px 30px; } .content-right{ width: 40%;height: 100%; } .content-right .new-img{ width: 100%;height: 100%; } .new-list{ display: flex;cursor: pointer;text-decoration:none; } .left-head{ padding: 18px 12px; font-size: 20px; background-color: #2d84fb;color: white;border-radius: 2px;margin-right: 20px; } .left-head .l-n-l{ font-size: 20px;text-align: center;margin-bottom: 10px;font-weight: 600; } .left-head .l-t-l{ font-size: 14px;text-align: center; } .hr-c{ margin: 16px 0 22px 0;background-color: rgba(220, 220, 220, 0.12); } .ri-title{ width: 580px; } .ri-title .r-t{ font-size: 18px;color: #6c6c6c; margin-bottom: 10px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; } .ri-title .r-t:hover{ color: #2d84fb; } .ri-title .r-d{ font-size: 12px;color: #a8a8a8; line-height: 26px; /*text-indent: 2.4rem;*/ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }