@charset "utf-8"; /* ===================首页样式========================== */ .indban { width:100%; overflow:hidden; position:relative; } .indban-img { width:100%; } .indban-img img { width:100%; object-fit:cover; } .indban-img img.p { display:block; height:calc(100vh - 130px); } .indban-img img.m { display:none; } .indban-cont { position:absolute; width:100%; height:100%; display:flex; flex-direction:column; justify-content:center; z-index:3; top:0; left:0; } .indban-cont h2 { font-size:36px; color:#fff; font-weight:700; line-height:1; opacity:0; font-family:"宋体","simsun","\5b8b\4f53"; position:relative; } .indban-cont h2 span { display:inline-block; position:relative; padding-bottom:16px; } .indban-cont h2 b { color:#0756a0; } .indban-cont h2 span::after { content:""; width:0; position:absolute; height:1px; bottom:0; background:#fff; left:0; } .indban-cont p { font-size:24px; color:#fff; line-height:1; margin:24px 0 38px; opacity:0; font-weight:300; } .indban-cont a { display:flex; opacity:0; width:194px; height:50px; align-items:center; justify-content:center; border-radius:6px; color:#fff; background:#0756a0; font-size:18px; transition:all .4s ease; } .indban-cont a span { padding-right:54px; height:24px; line-height:24px; display:inline-block; background: no-repeat right center; transition:all .4s ease; } .indban-cont a:hover { background:#0756a0; } /* --- */ .indban .swiper-pagination { bottom:44px; } .indban .swiper-pagination-bullet { width:40px; height:6px; border-radius:2px; } #video-3 { max-width:130%; max-height:130%; margin:0; overflow:scroll; position:absolute; top:0%; left:0%; z-index:0; } #video-3 img { opacity:0; } .indban .video a { position:relative; display:block; width:100%; height:100%; } .indban .video a .boxwen { position:absolute; width:100%; /*top:0; */ /*bottom:0; */ /*left:0; */ margin:auto; margin-top:14%; text-align:center; line-height:1; height:302px; font-weight:bold; } .indban .video a .boxwen .tit1 { font-size:40px; line-height:1.5; overflow:hidden; color:#e60012; } .indban .video a .boxwen .tit2 { color:#fff; font-weight:bold; font-size:20px; line-height:1.5; overflow:hidden; margin-top:15px; margin-bottom:45px; } .indban .video a .boxwen .more { color:#fff; font-weight:normal; margin:0 auto; width:220px; height:45px; font-size:18px; line-height:45px; border:2px solid #ffffff; transition:1s; transform:translatey(0); transition-delay:.1s; } .indban .video a .boxwen .more:hover { transition:1s; transform:translatey(0); transition-delay:.1s; background-color:#e60012; } .indban-m { display:none; } @media screen and ( max-width:1000px) { .indban-m { display:block; } .indban { display:none; } .indban-m .swiper-pagination-bullet { width:30px; height:4px; border-radius:2px; } #video-3 { max-width:130%; max-height:130%; margin:0; overflow:scroll; position:absolute; top:0%; left:0%; z-index:0; } #video-3 img { opacity:0; } .indban-m .video a { position:relative; display:block; width:100%; height:100%; } .indban-m .video a .boxwen { position:absolute; width:100%; /*top:10%; */ /*bottom:0; */ /*left:0; */ margin:auto; text-align:center; line-height:1; height:302px; font-weight:bold; margin-top:3%; } .indban-m .video a .boxwen .tit1 { font-size:24px; line-height:1.5; overflow:hidden; color:#e60012; } .indban-m .video a .boxwen .tit2 { color:#fff; font-weight:bold; font-size:18px; line-height:1.5; overflow:hidden; margin-top:15px; margin-bottom:25px; } .indban-m .video a .boxwen .more { color:#fff; font-weight:normal; margin:0 auto; width:220px; height:45px; font-size:18px; line-height:45px; border:2px solid #ffffff; transition:1s; transform:translatey(0); transition-delay:.1s; } .indban-m .video a .boxwen .more:hover { transition:1s; transform:translatey(0); transition-delay:.1s; background-color:#e60012; } }/* 动画 */ .swiper-slide-active .indban-cont h2 { animation:banlt 1.4s ease both 0.6s; } .swiper-slide-active .indban-cont p { animation:banrt 1.4s ease both 0.6s; } .swiper-slide-active .indban-cont a { animation:banup 1s ease both 1.2s; } .swiper-slide-active .indban-cont h2 span::after { animation:banlw 1.4s ease both 1.4s; } @keyframes banlt { 0% { transform:translatex(-240px); opacity:0; } 100% { transform:translatex(0); opacity:1; } }@keyframes banrt { 0% { transform:translatex(240px); opacity:0; } 100% { transform:translatex(0); opacity:1; } }@keyframes banup { 0% { transform:translatey(40px); opacity:0; } 100% { transform:translatey(0); opacity:1; } }@keyframes banlw { 0% { width:0; } 100% { width:calc(100% - 90px); } }.indtitle { width:100%; text-align:center; color:#1b1b1b; } .indtitle h3 { font-size:36px; font-weight:700; line-height:1; position:relative; padding-bottom:20px; } .indtitle h3::after { content:""; position:absolute; width:36px; height:2px; background:#fc7700; left:50%; bottom:0; margin-left:-18px; } .indtitle h6 { font-size:36px; font-weight:300; opacity:0.2; font-family:"思源黑体 cn","source han sans cn","noto sans"; line-height:1; margin-top:16px; letter-spacing:-1px; } .indtitle p { font-size:18px; line-height:36px; margin-top:12px; } .indfa { width:100%; padding-top:110px; overflow:hidden; } .indfa .indtitle { padding:0 4%; } .indfa-list { width:100%; margin-top:40px; } .indfa-list ul { display:flex; flex-wrap:wrap; } .indfa-list li { float:left; } .indfa-list li { width:33.3%; } .indfa-list li:hover .title { color:#0756a0; } .indfa-list { width:100%; margin-top:40px; } .indfa-list ul { display:flex; flex-wrap:wrap; } .indfa-list li { float:left; } .indfa-list li:nth-child(1) { width:33.8%; } .indfa-list li:nth-child(2) { width:37.1%; } .indfa-list li:nth-child(3) { width:29.1%; } .indfa-link { display:block; width:100%; position:relative; overflow:hidden; } .indfa-link img { width:100%; object-fit:cover; transition:all .6s ease; height:404px; } .indfa-list li:nth-child(1) .indfa-link img { height:808px; } .indfa-link:hover img { transform:scale(1.04); } .indfa-link>h2 { width:100%; padding:0 36px; font-size:18px; color:#fff; font-weight:700; height:45px; line-height:45px; width:70%; bottom:26px; position:absolute; left:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; background-image: ; background-repeat: no-repeat; margin-left: 12px; } .indfa-first { position:absolute; z-index:2; width:80%; padding:30px 44px 33px 44px; left:10%; top:164px; background-color: rgba(7,86,160,.6); } .indfa-first h2 { font-size:24px; color:#fff; font-weight:700; line-height:1; position:relative; padding-bottom:32px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } .indfa-first h2::after { content:""; position:absolute; width:48px; height:5px; background:#fff; left:0; bottom:0; } .indfa-first p { font-size:16px; color:#fff; line-height:32px; margin-top:18px; height:64px; overflow:hidden; -webkit-line-clamp:2; display:-webkit-box; text-overflow:ellipsis; -webkit-box-orient:vertical; } .indfa-more { width:166px; height:40px; background: no-repeat right 10px center; display:flex; align-items:center; justify-content:center; border-radius:20px; border:1px solid #fff; margin-top:38px; transition:all .4s ease; } .indfa-more span { font-size:16px; color:#fff; padding-right:30px; } .indfa-more:hover { background-color:#44b42e; border:1px solid #44b42e; } .indfa-link { display:block; width:100%; position:relative; overflow:hidden; } .indfa-link .thumb { position:relative; overflow:hidden; } .indfa-link img { width:100%; object-fit:cover; transition:all .6s ease; height:404px; } .indfa-link:hover img { transform:scale(1.04); } .indfa-list .title { width:100%; padding:0 36px; font-size:18px; font-weight:700; line-height:1.5; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; line-height:45px; } .indfa-first .title { font-size:24px; color:#fff; font-weight:700; line-height:1; position:relative; padding-left:0px; padding-bottom:32px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; background-color:unset; } .indfa-first .title::after { content:""; position:absolute; width:48px; height:5px; background:#fff; left:0; bottom:0; } .indfa-first p { font-size:16px; color:#fff; line-height:32px; margin-top:18px; height:64px; overflow:hidden; -webkit-line-clamp:2; display:-webkit-box; text-overflow:ellipsis; -webkit-box-orient:vertical; } .indfa-more { width:166px; height:40px; display:flex; align-items:center; justify-content:center; border-radius:20px; background-color:#0756a0; border:1px solid #0756a0; margin-top:38px; transition:all .4s ease; } .indfa-more span { font-size:16px; color:#fff; padding-right:30px; } .indfa-more:hover { background-color:#fc7700; border:1px solid #fc7700; } .indpro { padding-top:88px; padding-bottom:88px; /*background-color:#f6f6f6; */ background: center no-repeat; background-size:100%; } .indpro .indprotwo { margin-top:12px; margin-bottom:40px; } .indpro .indprotwo a { font-size:18px; color:#fff; padding:7px 25px; line-height:40px; margin-right:15px; border-radius:5px; background-color:#0756a0; } .indpro .indprotwo a.active { color:#fff; background-color:#fc7700; } .indpro .indpro-list ul { display:none; } .indpro .indpro-list ul.active { display:block; } .indpro .indpro-list ul:nth-child(2).active,.indpro .indpro-list ul:nth-child(3).active,.indpro .indpro-list ul:nth-child(5).active,.indpro .indpro-list ul:nth-child(6).active { display:table; margin:0 auto; text-align:center; } .indpro .indpro-list ul:nth-child(2) li,.indpro .indpro-list ul:nth-child(3) li,.indpro .indpro-list ul:nth-child(5) li,.indpro .indpro-list ul:nth-child(6) li { width:unset; } .indpro .indpro-list ul:nth-child(2) li img,.indpro .indpro-list ul:nth-child(3) li img,.indpro .indpro-list ul:nth-child(5) li img,.indpro .indpro-list ul:nth-child(6) li img { max-width:400px; height:auto; } .indpro .indpro-list ul li { width:33%; float:left; text-align:center; } .indpro .indpro-list ul li p { text-align:center; padding:15px; } .indpro .indpro-list ul li .thumb { border:1px solid #ccc; max-width:80% } .indpro .indpro-list ul li img { width:100%; height:auto; overflow:hidden; padding:10%; background-color:#fff; } .indal { width:100%; overflow:hidden; padding:84px 0; } .indal-loop { width:100%; margin-top:42px; position:relative; padding:0 50px; height:auto; } .indal-loop .indal-link:hover .title { color:#0756a0; } .indal-link { display:block; width:100%; overflow:hidden; } .indal-link img { width:100%; object-fit:cover; transition:all .6s ease; height:auto !important; } .indal-cont { position:absolute; display:flex; flex-direction:column; padding:0 32px; justify-content:center; width:100%; height:100%; left:0%; top:0%; z-index:2; } .indal-cont i { width:88px; height:88px; position:relative; z-index:2; border-radius:50%; display:block; background: no-repeat center; border:1px solid #fff; margin:0 auto; opacity:0; } .indal-cont.active i { opacity:.5; transition:all .8s; } .indal-cont h2 { font-size:24px; color:#fff; position:relative; z-index:2; line-height:1; margin:60px 0 20px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } .indal-cont p.desc { font-size:18px; color:#fff; position:relative; z-index:2; line-height:36px; height:108px; overflow:hidden; -webkit-line-clamp:3; text-overflow:ellipsis; -webkit-box-orient:vertical; opacity:0; transition:all .8s; text-align:center; margin-top:15px; } .indal-cont.active p.desc { opacity:.5; transition:all .8s; } .indal-cont::after { content:""; position:absolute; width:100%; height:100%; top:0; left:0; z-index:1; background:#0756a0; transform:scale(0.88); opacity:0; transition:all .6s ease; } .indal-link:hover img { transform:scale(1.04); } .indal-link:hover .indal-cont::after { transform:scale(1); opacity:.8; } .indal-link:hover .indal-cont i { transform:rotate(360deg); transition:all .8s ease; } .indal-prev,.indal-next { position:absolute; width:44px; height:40px; background: no-repeat center; top:35%; margin-top:-20px; cursor:pointer; transition:all .4s ease; } .indal-prev { left:-36px; transform:rotate(180deg); } .indal-next { right:-36px; } .indal-prev:hover,.indal-next:hover { background-image:; } .indal-more { width:100%; margin-top:68px; } .indal-more a { display:flex; align-items:center; justify-content:center; width:266px; height:66px; border-radius:10px; background:#0756a0; margin:0 auto; transition:all .4s ease; } .indal-more a:hover { background:#fc7700; border:1px solid #fc7700; } .indal-more a span { font-size:24px; height:40px; line-height:40px; color:#fff; padding-right:28px; } .indal-more a .iconfont { font-size:36px; color:#fff; } .indal-more a span .indal-more a:hover { background:#0756a0; } .indal .title { text-align:center; line-height:40px; white-space:nowrap; } .indal .title:hover { color:#0756a0; } .indgy { width:100%; overflow:hidden; background-repeat:no-repeat; background-size:cover; background-position:left top; padding:200px 0 300px; } .indgy-cont { width:100%; padding-right:130px; } .indgy-cont .indtitle { color:#fff; text-align:left; } .indgy-cont .indtitle h3::after { display:none; } .indgy-cont .indtitle h3 { padding-bottom:0; } .indgy-cont .indtitle h6 { opacity:1; text-transform:uppercase; margin-top:24px; } .indgy-cont .indtitle p { margin-top:28px; margin-bottom:28px; text-align:justify; text-justify:distribute; padding:28px 15px; background-color:rgba(7,86,160,.6); border-radius:15px; } .indgy-cont a { display:flex; width:140px; height:36px; margin-top:18px; align-items:center; justify-content:center; border-radius:6px; color:#fff; font-size:16px; transition:all .4s ease; background:#0756a0; border:1px solid #0756a0; } .indgy-cont a span { padding-right:18px; height:24px; line-height:24px; display:inline-block; transition:all .4s ease; } .indgy-cont a .iconfont { font-size:22px; } .indgy-cont a:hover { background:#fc7700; border:1px solid #fc7700; } .indnum { width:100%; position:relative; z-index:4; margin-top:-168px; } .indnum-list { width:87%; padding:0 135px 0 80px; overflow:hidden; position:relative; } .indnum-list::before { content:""; position:absolute; left:0; top:0; height:100%; width:50%; background:#0756a0; } .indnum-item { width:25%; height:244px; text-align:center; float:left; padding:58px 20px 0; color:#fff; position:relative; background:#0756a0; } .indnum-item::after { content:""; position:absolute; width:1px; height:100%; top:0; right:0; background:rgba(255,255,255,0.1); } .indnum-item:last-child:after { display:none; } .indnum-item h6 { position: relative; font-size:50px; font-family:arial; line-height:1; font-family:'helvetica'; } .indnum-item h6 i{ position: absolute; font-size: 18px; top: 0px; } .indnum-item h6::after { content:""; display:block; width:20px; height:1px; background:#a8c9a2; margin:10px auto; } .indnum-item p { font-size:14px; line-height:24px; } .indnum-list::after { content:""; width:135px; height:76px; position:absolute; bottom:0; right:0; } .indxw { width:100%; overflow:hidden; padding:120px 0 160px; background: center no-repeat; background-size:100%; background-position:bottom; } .indxw-loop { width:100%; margin-top:60px; position:relative; } .indxw-loop-imgcont { width:100%; position:relative; } .indxw-loop-imgcont img { width:100%; object-fit:cover; } .indxw-loop-cont { position:absolute; display:block; z-index:4; background-color:rgba(35,87,193,.7); transition:all .6s ease; width:670px; padding:36px 160px 24px 36px; left:0; bottom:0; color:#fff; } .indxw-loop-cont span { display:block; line-height:1.5em; font-size:14px; } .indxw-loop-cont .title { font-size:24px; line-height:36px; font-weight:700; height:72px; margin:20px 0; overflow:hidden; -webkit-line-clamp:2; display:-webkit-box; text-overflow:ellipsis; -webkit-box-orient:vertical; } .indxw-loop-cont p { font-size:18px; line-height:30px; height:60px; overflow:hidden; -webkit-line-clamp:2; display:-webkit-box; text-overflow:ellipsis; -webkit-box-orient:vertical; } .indxw-loop-cont:hover { background-color:rgba(35,87,193,1); } .indxw-loop-mix { position:absolute; display:flex; flex-wrap:wrap; width:206px; height:76px; align-items:center; background:rgba(255,255,255,0.8); z-index:1; right:3px; bottom:3px; } .indxw-loop-num { font-size:18px; color:#333; margin-left:50px; line-height:1; } .indxw-loop-num b { font-weight:500; } .indxw-loop-num span { color:#0756a0; } .indxw-loop-btn { margin-left:26px; font-size:0; } .indxw-loop-btn>div { display:inline-block; width:24px; height:24px; background: no-repeat center; cursor:pointer; transition:all .4s ease; } .indxw-loop-btn>div.indxw-next { transform:rotate(180deg); margin-left:16px; } .indxw-loop-btn>div:hover { background-image:; } .indxw-list { width:100%; margin-top:110px; } .indxw-list li { width:46.8%; } .indxw-list li:first-child { float:left; } .indxw-list li:last-child { float:right; } .indxw-list-title { width:100%; overflow:hidden; padding-bottom:20px; border-bottom:1px solid #d0d0d0; } .indxw-list-title h4 { font-size:28px; line-height:1; color:#333; font-weight:700; float:left; } .indxw-list-title a { display:block; float:right; font-size:16px; color:#999; margin-right:60px; transition:all .4s ease; padding-right:18px; } .indxw-list-title a:hover { color:#0756a0; } .indxw-list-link { display:block; width:100%; } .indxw-list-link a { display:block; width:100%; padding:24px 0; border-bottom:1px solid #eee; } .indxw-list-link a:last-child { border-bottom:none; } .indxw-list-link a span { display:block; font-size:16px; color:#999; line-height:1; } .indxw-list-link a .title { font-size:18px; color:#333; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; transition:all .4s ease; margin-top:14px; padding-right:60px; } .indxw-list-link a:hover .title { color:#0756a0; } .indhz { width:100%; overflow:hidden; padding-bottom:32px; } .indhz .contain { max-width:1280px; } .indhz-list { width:100%; margin-top:70px; } .indhz-ul { margin:-3% 0 0 -3%; } .indhz-link { width:22%; margin:3% 0 0 3%; display:block; border-left:1px solid #f8f8f8; border-bottom:1px solid #f8f8f8; float:left; } .indhz-link-img { width:100%; display:flex; align-items:center; justify-content:center; height:98px; border-bottom:1px solid #ebebeb; } .indhz-link-img img { max-width:88%; max-height:88%; transition:all .4s ease; } .indhz-link-cont { width:100%; padding:14px 20px 24px; overflow:hidden; } .indhz-link-cont span,.indhz-link-cont p { font-size:12px; height:16px; line-height:16px; } .indhz-link-cont span { display:block; color:#999; width:63px; float:left; } .indhz-link-cont p { width:100%; text-align:center; float:right; color:#666; transition:all .4s ease; position:relative; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; :0 auto; } .indhz-link-cont p::before { content:""; position:absolute; width:1px; height:100%; top:0; left:16px; background:#666; display:none; } .indhz-link:hover .indhz-link-img img { transform:translatey(-6px); } .indhz-link:hover .indhz-link-cont p { color:#0756a0; } .indhy { width:100%; overflow:hidden; background-repeat:no-repeat; background-size:cover; background-position:left top; padding:100px 0 70px; } .indhy-title { width:100%; text-align:center; color:#fff; } .indhy-title h3 { font-size:36px; line-height:1; font-family:"宋体","simsun","\5b8b\4f53"; font-weight:700; } .indhy-title p { font-size:17px; text-transform:uppercase; opacity:0.27; font-weight:300; line-height:1; margin-top:10px; } .indhy-link { width:100%; margin-top:58px; font-size:0; text-align:center; } .indhy-link a { display:inline-flex; justify-content:center; vertical-align:middle; width:190px; height:52px; line-height:52px; margin:0 5px; transition:background .4s ease; } .indhy-link a span { font-size:18px; height:52px; line-height:52px; display:inline-block; padding-right:18px; transition:all .4s ease; } .indhy-link-more { background:rgba(255,255,255,0.37); color:#fff; } .indhy-link-rele { background:#fff; color:#0756a0; } .indhy-link-more:hover { background:#fff; color:#0756a0; } .indhy-link-rele:hover { background:rgba(35,87,193,.8); color:#fff; } /* -------------------------pc端--------------------------- */ @media all and (max-width:1700px) { /* 1600 × (900) */ .indfa-link img { height:334px; } .indnum-list { padding:0 135px 0 36px; } }@media all and (max-width:1599px) { /* 1440 × (700) */ .indban-cont h2 { font-size:32px; } .indban-cont p { font-size:20px; margin:20px 0 34px; } .indban-cont a { width:170px; height:44px; } .indban-cont a span { padding-right:42px; } .indban .swiper-pagination { bottom:28px; } .indfa { padding-top:88px; } .indtitle h3 { font-size:32px; padding-bottom:16px; } .indtitle h6 { font-size:32px; margin-top:12px; } .indfa-link img { height:300px; } .indfa-list li:nth-child(1) .indfa-link img{ height: 600px; } .indfa-first { padding:10% 60px 0 70px; top:0px; } .indal { padding:80px 0; } .indal-link img,.indal-loop { height:auto; } .indal-cont .title { font-size:20px; margin:40px 0 16px; } .indal-cont p { line-height:30px; height:90px; } .indal-more a span { font-size:22px; padding-right:28px; } .indal-more a { width:236px; height:60px; } .indal-more { margin-top:60px; } .indtitle p { line-height:32px; } .indnum-item h6 { font-size:44px; } .indnum-item:nth-child(2) h6 { position:relative; } .indnum .square { font-size:6px; position:absolute; } .indnum-item { height:170px; padding:38px 30px 0; } .indnum { margin-top:-94px; } .indnum-list { width:92%; } .indgy { padding:120px 0 240px; } .indxw { padding:100px 0 120px; } .indxw-loop { margin-top:50px; } .indxw-loop-cont .title { font-size:20px; line-height:30px; height:60px; margin:16px 0; } .indxw-list-title h4 { font-size:24px; } .indxw-list { margin-top:90px; } .indhz-list { margin-top:58px; } .indhy { padding:80px 0 60px; } .indhy-link { margin-top:48px; } .indhy-title h3 { font-size:32px; } .indhy-title p { font-size:16px; } .indal-prev { left:-28px; } .indal-next { right:-28px; } @keyframes banlw { 0% { width:0; } 100% { width:calc(100% - 80px); } }}@media all and (max-width:1439px) { /* 1360 */ .indnum-list { width:94.5%; } .indfa-link img { height:282px; } .indfa-list li:nth-child(1) .indfa-link img{ height: 564px; } }@media all and (max-width:1359px) { /* 1280 */ .indal-prev { left:-10px; } .indal-next { right:-10px; } } @media all and (max-width:1279px) { /* 1152 × (700) */ .indban-cont h2 { font-size:30px; } @keyframes banlw { 0% { width:0; } 100% { width:calc(100% - 76px); } }.indtitle h3 { font-size:28px; padding-bottom:14px; } .indtitle h6 { font-size:28px; margin-top:10px; } .indtitle p { line-height:28px; font-size:16px; } .indfa-list .title { padding:0 28px; font-size:16px; bottom:20px; } .indfa-link img { height:240px; } .indfa-list li:nth-child(1) .indfa-link img{ height: 480px; } .indfa-first .title { font-size:20px; padding-bottom:26px; padding-left:0px; } .indfa-first .title::after { height:3px; } .indfa-first p { line-height:26px; margin-top:16px; height:52px; } .indfa-more span { padding-right:24px; } .indfa-more { width:144px; margin-top:28px; } .indfa { padding-top:68px; } .indfa-first { padding:0 40px 0 50px; top:120px; } .indal { padding:68px 0; } .indal-link img,.indal-loop { height:390px; } .indal-cont { padding:0 20px; } .indal-cont p { font-size:16px; line-height:26px; height:78px; } .indal-cont h2 { font-size:18px; margin:28px 0 12px; } .indgy-cont .indtitle p { margin-top:18px; } .indgy { padding:90px 0 180px; } .indnum-item p { line-height:22px; } .indnum-item h6 { font-size:40px; } .indnum-item { height:190px; padding:24px 20px 0; } .indnum-list { width:96%; } .indnum { margin-top:-114px; } .indxw { padding:70px 0 90px; } .indxw-loop { margin-top:40px; } .indxw-loop-cont { width:590px; padding:28px 100px 20px 28px; } .indxw-list-title a { margin-right:0; } .indxw-list-link a .title { padding-right:0; } .indxw-list { margin-top:70px; } .indhz-list { margin-top:50px; } .indhy { padding:70px 0 60px; } .indhy-link { margin-top:36px; } .indhy-link a { width:170px; height:46px; line-height:46px; } .indban-img img.p { height:calc(100vh - 100px); } }@media all and (max-width:1151px) { /* 1024 */ .indban-img img.p { height:auto; min-height:auto; } }/* ------------------------手机端-------------------------- */ @media all and (max-width:1000px) { /* 平板设备 720 适配 */ .indfa-first { padding:20px 20px; top:68px; } .indfa-link img { height:162px; } .indfa-link>h2{ padding:0 15px; font-size: 16px; width:100%; } .indfa-list li:nth-child(1) .indfa-link img{ height: 324px; } .indal-link img,.indal-loop { height:426px; } .indnum-list::after { display:none; } .indnum-list { padding:0; width:100%; background:#0756a0; } .indnum { margin-top:0; } .indgy { padding:80px 0 100px; } .indnum-item { height:auto; padding:24px 20px; } .indnum-list::before { display:none; } .indxw-loop-cont { position:relative; width:100%; padding:28px 100px 20px 28px; } .indxw-loop-mix { bottom:auto; top:217px; height:60px; } .indhz-link { width:47%; } .indfa-list .title { /*padding:0 20px; */ padding-bottom:20px; } .indgy-cont { padding-right:0; } .indxw-loop-imgcont img { min-height:280px; } } @media all and (max-width:640px) { /* 移动终端以上 360 适配 */ .indban-img img.p { display:block; max-width:100%; max-height:100%; } .indban-img img.m { display:block; min-height:400px; } .indban-cont h2 { font-size:24px; line-height:32px; } .indban-cont p { font-size:16px; margin:16px 0 24px; line-height:26px; } @keyframes banlw { 0% { width:0; } 100% { width:100%; } }.indban-cont a { width:148px; height:40px; font-size:16px; } .indban-cont a span { padding-right:32px; } .indban .swiper-pagination { bottom:12px; } .indban .swiper-pagination-bullet { margin:0 5px !important; } .indfa { padding-top:40px; } .indtitle h3 { font-size:24px; padding-bottom:12px; } .indtitle h6 { font-size:24px; } .indtitle p { line-height:26px; margin-top:8px; } .indfa-list li { width:49.5%; } .indfa-list li:nth-child(1){ width:100%; } .indfa-list li:nth-child(2), .indfa-list li:nth-child(3), .indfa-list li:nth-child(4), .indfa-list li:nth-child(5){ width:49.5%; } .indfa-list li:nth-child(3),.indfa-list li:nth-child(5) { margin-right:1%; } .indfa-link img { height:auto !important; } .indfa-list { margin-top:32px; } .indal { padding:40px 0; } .indal-loop { margin-top:32px; padding:0 26px; } .indal-prev,.indal-next { width:26px; height:26px; background-size:24px auto; margin-top:-13px; } .indal-prev { left:-8px; } .indal-next { right:-8px; } .indal-link img,.indal-loop { height:auto; } .indal-cont::after { display:none; } .indal-cont { width:100%; height:100%; left:0; top:0; } .indal-more { margin-top:36px; } .indal-more a span { font-size:20px; padding-right:40px; background-size:25px auto; } .indal-more a { width:180px; height:48px; } .indgy-cont .indtitle h6 { margin-top:12px; } .indgy-cont .indtitle p { margin-top:12px; } .indgy { padding:40px 0 50px; background-position:left 39% top 0; } .indnum-item { width:50%; padding:20px 16px; } .indnum-item p { line-height:20px; font-size:12px; } .indnum-item h6 { font-size:28px; } .indnum-item h6::after { margin:6px auto; } .indnum-item::after:nth-child(2n) { display:none; } .indnum-item:nth-child(-n 2):before { content:""; position:absolute; width:100%; height:1px; bottom:0; left:0; background:rgba(255,255,255,0.1); } .indxw { padding:40px 0; } .indxw-loop { margin-top:32px; } .indxw-loop-num { margin-left:20px; } .indxw-loop-btn { margin-left:16px; } .indxw-loop-btn>div.indxw-next { margin-left:8px; } .indxw-loop-imgcont img { min-height:200px; } .indxw-loop-mix { width:150px; top:147px; height:50px; } .indxw-loop-cont .title { font-size:18px; line-height:28px; height:56px; margin:8px 0; } .indxw-loop-cont p { font-size:16px; line-height:26px; height:52px; } .indxw-loop-cont { padding:24px 20px; background-image:none; } .indxw-list li { width:100%; } .indxw-list li:last-child { margin-top:16px; } .indxw-list { margin-top:36px; } .indxw-list-title { padding-bottom:16px; } .indxw-list-title h3 { font-size:20px; } .indxw-list-link a .title { font-size:16px; margin-top:8px; } .indxw-list-link a { padding:16px 0; } .indhz-ul { margin:0; } .indhz-link { width:50%; margin:0; } .indhz-list { margin-top:32px; } .indhy { padding:40px 0 44px; } .indhy-title h3 { font-size:28px; line-height:32px; } .indhy-title p { line-height:22px; } .indhy-link a { width:152px; } .indhy-link a span { padding-right:30px; } .indhy-link { margin-top:24px; } }/*首页产品二级导航*/ @media screen and ( min-width:1001px) { .indprotwo-m { display:none; } }@media screen and ( max-width:1000px) { .indprotwo { display:none; } .indprotwo-m { display:block; position:relative; text-align:left; padding-left:4%; } .indprotwo-m .iconfont { display:block; } .indprotwo-m .indprotwo-m-t { width:100%; display:none; position:absolute; left:0; top:45px; background-color:#fff; z-index:1; } .indprotwo-m a { display:block; padding:10px 25px; } .indprotwo-m .indprotwo-m-t.active { display:block; } .indpro .indpro-list ul li { width:50%; } .indpro .indpro-list ul li img { max-width:100%; } }/*首页产品样式修改*/ .container-fluid { margin:0 auto; } .container-fluid:before { content:""; display:table; } .row { width:100%; } .row:before { }.col-md-4 { position:relative; width:33.333333%; float:left; } .navbar-fixed-slides1 { position:relative; overflow:hidden; height:800px; background: no-repeat center bottom; background-size:100% 100%; } .navbar-fixed-slides1 .items { height:100%; padding:7% 8%; text-align:center; border-right:1px solid #e0e0e0; height:1000px; } .navbar-fixed-slides1 .items .icobox { margin-bottom:20px; } .navbar-fixed-slides1 .items .icobox .u-icon { display:inline-block; width:105px; height:105px; background-position:center center; } .navbar-fixed-slides1 .items .icobox .u-icon.u-icon-1 { background-image:; } .navbar-fixed-slides1 .items .icobox .u-icon.u-icon-2 { background-image:; } .navbar-fixed-slides1 .items .icobox .u-icon.u-icon-3 { background-image:; } .navbar-fixed-slides1 .items.last { border:none; } .navbar-fixed-slides1 .items .title { font-size:36px; text-align:center; margin-bottom:20px; } .navbar-fixed-slides1 .items .text { font-size:16px; margin-bottom:30px; height:60px; } .navbar-fixed-slides1 .items .ul-list { margin-bottom:30px; display:none; overflow:unset !important; } .navbar-fixed-slides1 .items .ul-list li { padding:10px 0; border-top:1px #fff solid; } .navbar-fixed-slides1 .items .ul-list li a { text-decoration:none; color:#fff; } .navbar-fixed-slides1 .items.active { background-image:linear-gradient(rgba(0,192,255,0.8),rgba(47,249,117,0.5)); color:#fff; } .navbar-fixed-slides1 .items.active .icobox { margin-bottom:15px; } .navbar-fixed-slides1 .items.active .icobox .u-icon { background-position:center center; } .navbar-fixed-slides1 .items.active .icobox .u-icon.u-icon-1 { background-image:; } .navbar-fixed-slides1 .items.active .icobox .u-icon.u-icon-2 { background-image:; } .navbar-fixed-slides1 .items.active .icobox .u-icon.u-icon-3 { background-image:; } .navbar-fixed-slides1 .items .btn.btn-line { display:inline-block; font-size:16px; padding:6px 47px; height:55px; background:none; border-radius:30px; border:2px solid #ccc; color:#999; line-height:40px; } .navbar-fixed-slides1 .items.active .btn { color:#fff; border-color:#fff; } .navbar-fixed-slides1 #bg-ico1 { width:85%; height:auto; position:absolute; margin-left:-200px; opacity:0; } .navbar-fixed-slides1 #bg-ico2 { width:85%; opacity:0; position:absolute; /*top:50%; */ left:57%; margin-left:-670px; width:50%; height:auto; } .navbar-fixed-slides1 #bg-ico3 { width:85%; height:auto; position:absolute; margin-right:-200px; right:0; opacity:0; /* display:none; position:absolute; right:-5%; width:43%; top:1%; animation:show-business 1s; transform:rotate(70deg); -webkit-transform:rotate(70deg); opacity:1; */ } @keyframes show-business { 0% { opacity:0; transform:rotate(0deg); } 100% { opacity:1; transform:rotate(70deg); } }@media screen and ( max-width:1000px) { .col-md-4 { position:relative; width:100%; float:none; } .navbar-fixed-slides1 { position:relative; overflow:hidden; height:auto; background: no-repeat center bottom; background-size:auto 100%; } .navbar-fixed-slides1 .container-fluid { width:100%; } .navbar-fixed-slides1 .items { padding:20px; text-align:center; border-right:none; height:auto; border-bottom:1px solid #e0e0e0; } .navbar-fixed-slides1 .items .icobox { margin-bottom:10px; } .navbar-fixed-slides1 .items .icobox .u-icon { width:70px; height:70px; background-position:center center; background-size:70px 70px; } .navbar-fixed-slides1 .items.last { border:none; } .navbar-fixed-slides1 .items .title { font-size:20px; line-height:1; height:auto; text-align:center; margin-bottom:10px; } .navbar-fixed-slides1 .items .text { font-size:14px; margin-bottom:15px; height:auto; min-height:auto; } .navbar-fixed-slides1 .items .ul-list { margin-bottom:10px; display:none; } .navbar-fixed-slides1 .items .ul-list li { padding:5px 0; border-top:1px #fff solid; } .navbar-fixed-slides1 .items .ul-list li a { text-decoration:none; color:#fff; } .navbar-fixed-slides1 .items .btn { background:#fff; } .navbar-fixed-slides1 .items.active { color:#fff; } .navbar-fixed-slides1 .items.active .icobox { margin-bottom:15px; } .navbar-fixed-slides1 .items.active .icobox .u-icon { background-position:center center; } .navbar-fixed-slides1 .items.active .btn { color:#fff; border-color:#fff; background:none; } .navbar-fixed-slides1 #bg-ico1 { width:auto; height:400px; position:absolute; margin-left:-200px; opacity:0; } .navbar-fixed-slides1 #bg-ico2 { opacity:0; position:absolute; top:50%; left:85%; margin-top:-230px; margin-left:-350px; width:auto; height:300px; } .navbar-fixed-slides1 #bg-ico3 { display:none; position:absolute; right:5%; width:80%; top:55%; animation:show-business 1s; transform:rotate(70deg); opacity:1; } } /*应用案例*/ @media screen and ( min-width: 1001px) { .indfa .pc{ display: block; } .indfa .m{ display: none; } } @media screen and ( max-width: 1000px) { .indfa .pc{ display: none; } .indfa .m{ display: block; } .indfa-list li:nth-child(1){ width:100%; } .indfa-list li:nth-child(2),.indfa-list li:nth-child(3),.indfa-list li:nth-child(4),.indfa-list li:nth-child(5){ width:50%; margin-right: 0; } } .navbar-fixed-slides1 .items .btn.btn-line.btn-en{ }