/*# sourceMappingURL=style.css.map */ @media (min-width:320px){ .ind-banner, .img-hailian{ display: none; } .inde-phone{ width: 100%; } .inde-phone .swiper-container { width: 100%; height: 100%; } .inde-phone .swiper-slide { text-align: center; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } .inde-phone .swiper-slide img{ display: block; width: 100%; } .inde-phone .swiper-pagination-bullet{ opacity: 1; background-color: transparent; border: 2px solid #fff; height: 10px; width: 10px; } .inde-phone .swiper-pagination-bullet-active{ background-color: #fff; } .inde-phone .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{ margin: 0 8px; } .indlayout .list2{display: block;} .indlayout .list1{display: none;} .index{ padding-left:4.5%; padding-right:4.5%; max-width: 1600px; margin: 0 auto; } .flex-direction-nav{display: none;} .header-phone{position: fixed;top: 0;left: 0;z-index: 10;width: 100%;} .banner .slides img{ width: 1920px; position: relative; left: 50%; top:0; margin-left: -960px; } .banner .slides .fa{ position: absolute; top:65%; left:6%; z-index: 3; color: #fff; font-size:30px; font-weight: bold; line-height:42px; width:88%; } .index .indabout{padding: 50px 0 70px;position: relative;} .index .indabout:before{ display: block; width: 1px; background-color: #e5e5e5; height: 60px; content: ''; position: absolute; bottom: -30px; left: 49.5%; } .index .indabout .title{ text-align: center; padding-top: 10px; background: url(../../img/img39.png) center top/100% auto no-repeat; } .index .indabout .title .mintit{ width: 100%; font-size: 16px; line-height: 26px; color: #000000; letter-spacing: 10px; margin-bottom: 10px; } .index .indabout .title h2{ font-size: 24px; line-height: 30px; color: #555555; margin: 0 0 30px; } .index .indabout .details{max-width: 1040px;margin: 0 auto;} .index .indabout .details,.index .indabout .details p{ font-size: 14px; line-height: 24px; color: #888888; margin-bottom: 0; text-align: center; } .indlayout{ background-color: #fbfbfb; padding: 75px 0 60px; } .indlayout .title{ font-size: 24px; line-height: 30px; margin-bottom: 10px; color: #555555; text-align: center; } .indlayout .pic{ max-width: 1285px; margin: 0 auto; width: 100%; position: relative; } .indlayout .pic img{ display: block; /*width: 140%; position: relative; left: -20%;*/ width: 100%; position: relative; left: 0; } .indlayout .pic .img1{display: none;} .indlayout .pic .img2{display: block;} .indlayout .pic i{z-index: 10;display: none;cursor: pointer;} .indlayout .pic .i1{ width: 20px; height: 31px; position: absolute; top: 29%; left: 31%; background: url(../../img/hlind-img.png) center/cover no-repeat; } .indlayout .pic .i2{ width: 20px; height: 31px; position: absolute; top: 42%; right: 29.8%; background: url(../../img/hlind-img.png) center/cover no-repeat; } .indlayout .pic .i3{ width: 20px; height: 31px; position: absolute; top: 36%; right: 27%; background: url(../../img/hlind-img.png) center/cover no-repeat; } .indlayout .pic .i4{ width: 20px; height: 31px; position: absolute; top: 45%; right: 28%; background: url(../../img/hlind-img.png) center/cover no-repeat; } .indlayout .list{ width: 100%; margin: 0 auto; position: relative; padding: 0 30px; } .indlayout .list .box{ width: 100%; border-radius: 10px; position: relative; bottom: 0; left: 0; height: 29px; background-color: #0778e3; cursor: pointer; margin-bottom: 15px; } .indlayout .list .box .warp{ position: absolute; bottom: 0; left: 0; width: 100%; background-color: #0778e3; border-radius: 10px; } .indlayout .list .box .tit{ font-size: 14px; line-height:29px; padding:0 12% 0 5%; width: 100%; color: #fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; background: url(../../img/img40.png) 95% 7px no-repeat; } .indlayout .list .box.on .tit{ overflow:inherit; white-space:inherit; line-height: 22px; background: url(../../img/img400.png) 95% 7px no-repeat; } .indlayout .list .box .details,.indlayout .list .box .details p{ font-family: '宋体'; font-size: 14px; line-height: 22px; color: #fff; } .indlayout .list .box .details{padding:0 5%;display: none;} .indlayout .list .box .details p{margin-bottom: 0;} .indlayout .list .box.on .warp{ padding: 10px 0; } .index .indbase{padding:50px 0 0px;} .index .indpro{padding:0 0 50px;} .index .indpro .title{ margin-bottom:30px; } .index .indpro .title h2{ font-size: 24px; line-height: 30px; margin:0 0 15px; color: #555555; text-align: center; } .index .indpro .title .details{ font-size:14px; line-height: 24px; text-align: center; margin: 0 auto; color: #999999; position: relative; padding-bottom: 25px; } .index .indpro .title .details:before{ display: block; content: ''; width: 38px; height: 1px; background-color: #7f7f7f; position: absolute; bottom: 0; left: 50%; margin-left: -19px; } .index .indpro #indpro .slides li{ width: 100%; /*margin-right: 28px;*/ margin-right:30px; } .index .indpro #indpro .slides li a{ display: block; width: 96%; height: 100%; margin: 0 auto; box-shadow: 0 5px 10px rgba(0,0,0,0.1) } /*.index #indpro{padding-bottom: 75px;}*/ .index #indpro .flex-viewport{ padding: 0 0px 75px; box-sizing:content-box; } .index .indpro #indpro li a .pic{ width: 100%; overflow: hidden; } .index .indpro #indpro li a .pic img{ width: 100%; display: block; } .index .indpro #indpro li a .box{ padding: 30px 20px; } .index .indpro #indpro li a .box .tit{ font-size: 18px; line-height: 24px; color: #999999; font-family: '宋体'; margin-bottom: 25px; } .index .indpro #indpro li a .box .tit span{ font-size: 20px; line-height: 24px; color: #000000; padding-right: 10px; font-family: '微软雅黑' } .index .indpro #indpro li a .box .details{ font-size: 14px; line-height: 24px; color: #999999; margin-bottom: 40px; } .index .indpro #indpro li a .box .more{ font-size: 14px; line-height: 20px; color: #999999; text-transform:uppercase; } .index .indpro #indpro .flex-control-paging li a{ border:1px solid #b4b4b4; } .index .indpro #indpro .flex-control-paging li a.flex-active{ background-color: #b4d6f7; border:1px solid #b4d6f7; } .index .indpro #indpro .flex-direction-nav{display: none;} .pcshow{display:none;} .index .indbase .swiper-container-horizontal>.swiper-pagination-bullets{ bottom:50px; } .index .indbase h2{ font-size: 24px; line-height: 30px; color: #555555; text-align: center; margin:0 0 20px; } .index .indbase .device{margin-bottom: 40px;} .index .indbase .swiper-container { width: 100%; height:445px; box-sizing:content-box; } .index .indbase .device .swiper-slide { font-size: 18px; background: #fff; height: 100%; padding-bottom: 50px; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } .index .indbase .swiper-slide .titbox{ width: 100%; height: 100%; display: block; } .index .indbase .swiper-slide .img{ width: 33.3%; float: left; position: relative; height: 100%; overflow: hidden; } .index .indbase .swiper-slide .img a{ display: block; width: 100%; height: 100%; } .index .indbase .swiper-slide img{ display: block; height:100%; position: absolute; left: 50%; top: 0; margin-left: -308px; } .index .indbase .swiper-slide .img .fa{ width: 80%; top: 50%; left: 10%; position: absolute; height:70px; border:2px solid rgba(255,255,255,0.5); margin-top: -35px; } .index .indbase .swiper-slide .img .fa p{ font-size: 18px; line-height: 20px; margin:10px 0 5px; color: #fff; padding-left: 30%; } .index .indbase .swiper-slide .img .fa span{ font-size: 18px; color: #fff; line-height: 20px; letter-spacing: 2px; font-family: 'BebasNeueBook'; text-transform: uppercase; padding-left: 30%; } .index .indbase .swiper-pagination-bullet{ opacity: 1; background: transparent; width: 11px; height: 11px; } .index .indbase .pagination{ width: 100%; text-align: center; } .index .indbase .pagination span{margin: 0 5px;} .index .indbase .swiper-pagination-bullet{ border:1px solid #c9c9c9; } .index .indbase .swiper-pagination-bullet-active{ background: #b4d6f7; border:1px solid #b4d6f7; } .indnews{display: none;} .indpnews{ width: 100%; padding: 0 4.5% 50px; } .indpnews .title{ height: 85px; margin-bottom: 47px; background: url(../../img/img43.png) center bottom/100% auto no-repeat; } .indpnews .title h2{ font-size: 24px; line-height: 30px; padding-top: 55px; color: #555555; text-align: center; margin: 0; } .indpnews #swi3{margin-bottom: 35px;} .indpnews #swi3 .swiper-slide a{ display: block; width: 100%; height: 100%; } .indpnews #swi3 .swiper-slide .tit{ font-size: 14px; line-height: 18px; color: #0778e3; } .indpnews #swi3 .swiper-slide .tit span{ float: right; color: #000000; font-family: 'arial'; } .indpnews #swi3 .swiper-slide .box h3{ font-size: 20px; line-height: 28px; color: #000000; margin: 20px 0 15px; } .indpnews #swi3 .swiper-slide .box .details{ font-size: 14px; color: #888888; line-height: 24px; margin-bottom: 50px; } .indpnews #swi3 .swiper-slide .more{ font-size: 14px; color: #999999; line-height: 24px; } .indpnews .swiper-container .swiper-slide{ width: 100%; } .indpnews .swiper-pagination{ width: 91%; text-align: center; } .indpnews .swiper-pagination span{ border: 1px solid #c9c9c9; margin: 0 5px; background: transparent; width: 11px; height: 11px; opacity: 1; } .indpnews .swiper-pagination .swiper-pagination-bullet-active{ border: 1px solid #b4d6f7; background: #b4d6f7; } .wel .footer .fot-top{display: none;} } @media (min-width:320px) and (max-width:767px) { } @media (min-width:768px){ .indlayout .pic i{display: none;} .index .indpro #indpro li a .box .tit{ height: 51px; overflow: hidden; } .index .indpro #indpro li a .box .details{ height: 70px; overflow: hidden; } .header-phone{position: relative;} .index{ padding-left:30px; padding-right:30px; } .banner .slides img{ width: 100%; position: relative; left:0; margin-left:0px; } .banner .slides .fa{ top:47%; font-size: 40px; line-height: 52px; left:7%; width: 440px; } .index .indabout{padding: 85px 0 ;} .index .indabout .title{ text-align: center; padding-top:6%; background: url(../../img/img39.png) center top/100% auto no-repeat; } .index .indabout .title .mintit{ font-size: 19px; line-height: 30px; letter-spacing: 30px; margin-bottom: 25px; } .index .indabout .title h2{ font-size: 30px; line-height: 40px; margin: 0 0 45px; } .indlayout{ padding: 75px 0 30px; } .indlayout .title{ font-size: 34px; line-height: 40px; } .indlayout .pic img{ width: 100%; left: 0; } .indlayout .list{ max-width: 1080px; top: -30px; padding: 0 10px; } .indlayout .list .box{ width: 23%; margin: 0 1% 2%; float: left; } .indlayout .list .box .tit{ background: url(../../img/img40.png) 94% 7px no-repeat; } .indlayout .list .box.on .tit{ line-height: 24px; } .index .indpro{padding: 30px 0 70px;} .index .indpro .title{ margin-bottom: 40px; } .index .indpro .title h2{ font-size: 34px; line-height: 40px; margin: 0 0 20px; } .index .indpro #indpro .slides li{ width: 33%; } /*.index #indpro{padding-bottom: 75px;}*/ .index #indpro .flex-viewport{ padding: 0 0px 75px; box-sizing:content-box; } .index .indpro #indpro li a .pic{ width: 100%; overflow: hidden; } .index .indpro #indpro li a .pic img{ width: 100%; display: block; } .index .indpro #indpro li a .box{ padding: 40px 30px; } .index .indpro #indpro li a .box .tit{ font-size: 18px; line-height: 24px; color: #999999; font-family: '宋体'; /*margin-bottom: 25px;*/ } .index .indpro #indpro li a .box .tit span{ font-size: 22px; line-height: 24px; color: #000000; padding-right: 10px; font-family: '微软雅黑' } .index .indpro #indpro li a .box .details{ font-size: 14px; line-height: 24px; color: #999999; margin-bottom: 40px; } .index .indpro #indpro li a .box .more{ font-size: 14px; line-height: 20px; color: #999999; text-transform:uppercase; } .index .indbase{padding: 75px 0 0px;} .index .indbase h2{ font-size: 34px; line-height: 40px; margin:0 0 30px; } .index .indbase .swiper-slide .img .fa{ width: 150px; left: 50%; margin-left: -75px; height: 85px; } .index .indbase .swiper-slide .img .fa p{ font-size: 24px; line-height: 30px; padding-left: 40%; } .index .indbase .swiper-slide .img .fa span{ padding-left: 40%; letter-spacing: 4px; } .index .indabout .details,.index .indabout .details p{ font-size: 16px; line-height: 30px; } .index .indpro .title .details{ font-size:16px; line-height: 24px; } .indpnews #swi3 .swiper-slide .box .details,.indpnews #swi3 .swiper-slide .more{ font-size: 16px; line-height: 24px; } } @media (min-width:768px) and (max-width:992px) { .indlayout .list .box.on .warp{ padding: 10px 3%; } .indlayout .list .box .tit{ background: none; padding: 0 10% 0 5%; } .indpnews .title{ height: 100px; background: url(../../img/img43.png) center bottom/auto 100% no-repeat; } .indpnews .title h2{ padding-top: 65px; } .indpnews .swiper-container .swiper-slide{ width: 50%; } .indpnews #swi3 .swiper-slide a{ display: block; width:92%; margin: 0 auto; height: 100%; } } @media (min-width:992px){ .indlayout .list2, .inde-phone{display: none;} .indlayout .list1, .ind-banner, .img-hailian{display:block;} .indlayout .pic .img1{display: block;} .indlayout .pic .img2{display: none;} .indlayout .pic i{display: block;} .equi.on{ margin-top:67px; } .flex-direction-nav{display: block;} .phoneshow,.indpnews{display: none;} .banner .slides .fa{ font-size: 50px; line-height: 60px; left:7%; top: 47%; width:750px; } .index .indabout .title h2{font-size: 34px;} .index .indpro #indpro .slides li{ width: 25%; } .index .indpro #indpro li a .box .tit span{ font-size: 24px; } .index .indbase h2{ font-size: 34px; line-height: 40px; margin:0 0 45px; } .index .indbase .warp{ width:100%; height: 390px; overflow: hidden; } .index .indbase .warp .list{ /*width: 14.2%;*/ /*width: 11.11%;*/ width: calc(100% / 9); float: left; position: relative; overflow: hidden; cursor: pointer; /*transition: all 0.4s;*/ /*-webkit-transition: all 0.4s;*/ } .index .indbase .warp .list a{ display: block; width: 100%; height: 100%; cursor: pointer; position: relative; } .index .indbase .warp:hover .list{ width: 8.75%; } .index .indbase .warp:hover .list:hover{ width:30%; } .pcshow{display: block;} .index .indbase{padding: 100px 0 70px;} .index .indbase .warp .list a:before{ display: block; width: 100%; height: 100%; position: absolute; top: 0; z-index: 1; left: 0; background-color: rgba(0,0,0,0.2); content:' '; } .index .indbase .warp .list img{ position: relative; left: 50%; top: 0; margin-left: -308px; } .index .indbase .warp .list .box{ /*width: 110px;*/ /*width: 100px;*/ width: 90px; height: 120px; border:2px solid rgba(255,255,255,0.5); position: absolute; top: 50%; left: 50%; /*margin: -42px 0 0 -62.5px;*/ /*margin: -42px 0 0 -50px;*/ margin: -42px 0 0 -45px; z-index: 2; transition: all 0.3s; -webkit-transition: all 0.3s; opacity: 1; filter: alpha(opacity=100); } .index .indbase .warp .list:hover .box{ opacity: 0; filter: alpha(opacity=0); } .index .indbase .warp .list .box p{ /*font-size: 28px;*/ font-size: 20px; line-height: 30px; color: #ffffff; margin-bottom: 0; /*padding: 10px 0 6px 25px;*/ padding: 10px 0 4px 5px; } .index .indbase .warp .list .box span{ /*font-size:18px;*/ font-size: 16px; line-height:20px; color: #ffffff; padding-left: 5px; text-transform: uppercase; letter-spacing: 7px; font-family: 'BebasNeueRegular'; } .index .indbase .warp .list .mian{ padding: 15px 5%; width: 90%; position: absolute; top: 50%; left: 50%; height: 148px; margin: -74px 0 0 -45%; z-index: 3; /*padding:20px 8%;*/ opacity: 0; filter: alpha(opacity=0); transition: all 0.3s; -webkit-transition: all 0.3s; background:#0778e3 url(../../img/img41.png) 110% 252% no-repeat; } .index .indbase .warp .list:hover .mian{ opacity: 1; filter: alpha(opacity=100); } .index .indbase .warp .list .mian .left{ width: 30%; float: left; border-right: 1px solid #086ac7; } .index .indbase .warp .list .mian .left h3{ font-size: 24px; line-height: 30px; color: #fff; margin:2px 0 5px; } .index .indbase .warp .list .mian .left p{ font-size: 18px; line-height: 20px; color: #fff; text-transform: uppercase; font-family: 'BebasNeueRegular'; letter-spacing: 2px; margin-bottom: 15px; } .index .indbase .warp .list .mian .left i{ display: block; height: 25px; width: 25px; background: url(../../img/img42.png) center no-repeat; } .index .indbase .warp .list .mian .right{ width: 65%; float: right; font-size: 13px; line-height: 26px; color: #fff; height: 100%; text-align: justify; height: 105px; overflow: hidden; } .indnews{ display: block; width: 100%; padding-bottom: 85px; background-color: #f7f7f7; } .indnews .mian{ max-width: 1600px; width: 100%; padding: 0 30px; margin: 0 auto; } .indnews .mian .title{ margin-bottom: 20px; height: 180px; background: url(../../img/img43.png) center -20px no-repeat; } .indnews .mian .title h2{ font-size: 34px; line-height: 40px; color: #444444; text-align: center; margin:0; padding-top: 75px; } .indnews .mian .warp li{ width: 25%; float: left; cursor: pointer; } .indnews .mian .warp li a{ display: block; width: 100%; height: 100%; cursor: pointer; } .indnews .mian .warp li:nth-child(2){ margin: 0 12.5%; } .indnews .mian .warp li .tit{ font-size: 13px; line-height: 26px; color: #0778e3; } .indnews .mian .warp li .tit span{ float: right; color: #000000; font-family: 'arial' } .indnews .mian .warp li .box h3{ font-size: 26px; line-height: 48px; color: #000000; margin: 0 0 25px; height: 95px; overflow: hidden; transition: all 0.3s; -webkit-transition: all 0.3s; } .indnews .mian .warp li:hover .box h3{ color: #006cb8; } .indnews .mian .warp li .box .details{ font-size: 13px; line-height: 26px; color: #000000; margin-bottom: 25px; height: 75px; overflow: hidden; } .indnews .mian .warp li .box .more{ font-size: 13px; color: #000; line-height: 20px; font-family: 'arial' } } @media (min-width:992px) and (max-width:1200px) { } @media (min-width:1150px){ .index .indabout .title{ text-align: center; padding-top: 95px; background: url(../../img/img39.png) center top no-repeat; } } @media (min-width:1200px){ .banner .slides .fa{ font-size: 60px; line-height: 72px; } .index .indbase .warp .list .box{ width: 110px; height: 120px; border:2px solid rgba(255,255,255,0.5); position: absolute; top: 50%; left: 50%; margin: -42px 0 0 -55px; z-index: 2; transition: all 0.3s; -webkit-transition: all 0.3s; opacity: 1; filter: alpha(opacity=100); display: flex; flex-direction: column; justify-content: center; } .index .indbase .warp .list .box p{ font-size: 24px; line-height: 30px; color: #ffffff; margin-bottom: 0; padding: 10px 0 6px 20px; } .index .indbase .warp .list .box span{ font-size:18px; line-height:20px; color: #ffffff; padding-left: 20px; text-transform: uppercase; letter-spacing: 7px; font-family: 'BebasNeueRegular'; } .index .indbase .warp .list .mian{ width: 90%; position: absolute; top: 50%; left: 50%; height: 170px; margin: -74px 0 0 -45%; z-index: 3; padding:20px 8%; opacity: 0; filter: alpha(opacity=0); transition: all 0.3s; -webkit-transition: all 0.3s; background:#0778e3 url(../../img/img41.png) 110% 252% no-repeat; } .index .indbase .warp .list .mian .left p{ font-size: 18px; line-height: 20px; color: #fff; text-transform: uppercase; font-family: 'BebasNeueRegular'; letter-spacing: 3px; margin-bottom: 15px; } } @media (min-width:1500px){ .index .indbase .warp .list .box{ width: 125px; margin: -42px 0 0 -62.5px; } } .index-pos { position: fixed; top: 50%; right: 0; transform: translateY(-50%); z-index: 10; }