﻿/*首页*/
  
.flash{ width:100%; background:linear-gradient(45deg,rgba(19,29,60,1) 0%,rgba(24,29,54,1) 24%,rgba(11,29,66,1) 68%,rgba(9,29,69,1) 100%);;}
.flash .swiper-pagination{ width:100%; text-align:center; bottom:0;}
.flash .swiper-pagination-bullet{ width:10px; height:10px; margin:0 10px; outline:none; opacity:1; box-sizing:border-box;border:1px solid #fff;background:none;}
.flash .swiper-pagination-bullet-active{ opacity:1;background:#fff;border:0; }
.flash .txt{ width:100%; height:100%; position:absolute; left:0; top:0; display:flex; align-items:center; justify-content:center; color:#fff;}
.flash .txt h2{ font-size:48px; line-height:50px; font-weight:300;}
.flash .txt h2 strong{ margin-right:20px;}
.flash.wap{ display:none;}

.index_about{ width:870px; padding:100px 0; margin:0 auto; font-size:24px; line-height:48px; text-align:center;}
.index_about .playbtn{ background:linear-gradient(-90deg,rgba(35,101,232,1) 0%, rgba(0,162,237,1) 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; display:inline-block; font-size:18px; font-weight:bold; margin-top:20px;}
.index_about .playbtn:after{ width:100%; height:2px; display:block; content:""; background:linear-gradient(-90deg,rgba(35,101,232,1),rgba(0,162,237,1)); margin:0 auto; transition:all 0.4s;}
.index_about .playbtn:hover:after{ width:20%;}
 
.video_pop{background:#fff;width:1000px;height:550px; z-index:1002;position: fixed;top:50%;left:50%;margin:-275px 0 0 -500px; transform:scale(0); opacity:0; transition:all 0.8s cubic-bezier(0.105,1.095,0.000,1.110); border-radius:12px; box-shadow:0 3px 10 0 rgba(0,0,0,0.1); background:#000;}
.video_pop.niu{ transform:scale(1); opacity:1;}
#videostr{width:1000px;height:550px;}
.popover_close{ background:url(../images/close.png) no-repeat; width:18px; height:18px; display:block; position:absolute; z-index:1003; right:0px; top:-30px;} 

.index_technology{  background-size:100% auto;  width:100%; position:relative; background:linear-gradient(180deg,rgba(158,200,222,0.15) 0%,rgba(255,255,255,1) 100%); padding-bottom:50px; overflow:hidden;}
.index_technology .mainbox{ position:relative; z-index:1;}
.index_technology .bg{ position:absolute; left:0; top:0%;} 
.index_technology .txt{ float:left; overflow:hidden; position:relative; z-index:1}
.index_technology .txt h2{ font-size:40px; line-height:42px; margin:150px 0 50px 0;}
.index_technology .txt ul{ font-size:18px; line-height:40px; color:#666;}
.index_technology .right_r{ float:right; position:relative; z-index:1; margin-top:80px;}

.index_technology .right_r .row:nth-child(1){transform: translate(-85px, 0)}
.index_technology .right_r .row:nth-child(2){transform: translate(0, -50px)}
.index_technology .right_r .row:nth-child(3){transform: translate(-85px, -100px)}
.hexagon {display:inline-block; transition:all 0.4s; margin-left:0px; vertical-align:top;  }
.hexagon:hover{ transform:scale(1.15);}
/*.hexagon .bar-rotate-left {width:120px;height:170px;overflow: hidden;transform: rotate(60deg);display: inline-block;}
.hexagon .bar-rotate-right {width:120px;height:170px;overflow: hidden;transform: rotate(60deg);display: inline-block; }*/
.hexagon .bar-horizontal {width:169px;height:189px; display: flex;justify-content: center;align-items: center; }
.hexagon .bar-horizontal a{  padding: 0px 4px 15px 0; display:block; font-size:17px; line-height:32px; color:#fff; box-sizing:border-box; text-align:center;}
.hexagon.b1 .bar-horizontal {background:url(../images/bg1.png) no-repeat; background-size:contain;}
.hexagon.b2 .bar-horizontal {background:url(../images/bg2.png) no-repeat; background-size:contain;}
.hexagon.b3 .bar-horizontal {background:url(../images/bg3.png) no-repeat; background-size:contain;}
.hexagon.b4 .bar-horizontal {background:url(../images/bg4.png) no-repeat; background-size:contain;}

.hexagon.b5 .bar-horizontal {background:url(../images/bg5.png) no-repeat; background-size:contain;}
.hexagon.b6 .bar-horizontal {background:url(../images/bg6.png) no-repeat; background-size:contain;}
.hexagon.b7 .bar-horizontal {background:url(../images/bg7.png) no-repeat; background-size:contain;}
.hexagon.b8 .bar-horizontal {background:url(../images/bg8.png) no-repeat; background-size:contain;}

.hexagon.b9 .bar-horizontal {background:url(../images/bg9.png) no-repeat; background-size:contain;}
.hexagon.b10 .bar-horizontal {background:url(../images/bg10.png) no-repeat; background-size:contain;}
.hexagon.b11 .bar-horizontal {background:url(../images/bg11.png) no-repeat; background-size:contain;}
.hexagon.b12 .bar-horizontal {background:url(../images/bg12.png) no-repeat; background-size:contain;}
 
.g_title{font-size:40px; line-height:42px; text-align:center;}

.index_product{ padding-bottom:50px;} 
.index_product ul{ margin-top:50px;}
.index_product li{ width:20%; overflow:hidden; float:left; text-align:center; font-size:20px; position:relative; box-sizing:border-box; padding:30px;}
.index_product li .bg{ background:rgba(36,42,48,0.9); width:100%; height:100%; position:absolute; left:0; top:0; color:#fff; z-index:10;  display:flex; align-items:center; justify-content:center; transition:all .6s; transform:translateY(-300%);}
.index_product li:hover .bg{ transform:translateY(0)}
.index_product li .bg h3{ font-size:24px; margin-bottom:30px;}
.index_product li .bg span{ font-size:16px;}
.index_product li dd{ font-size:20px; margin-top:10px; text-align:center;}
.index_product li dt{ height:230px;}
.index_product li dt img{ max-height:100%; max-width:100%; width:auto;} 
.index_news{ padding:70px 0 80px 0;}
.index_news dl{ width:31.66666666666667%; background:#fff; float:left; transition:all .4s; margin:50px 2.5% 0 0; }
.index_news dl:nth-last-child(1){ margin:50px 0 0 0;}
.index_news dl:hover{  box-shadow:0px 2px 30px 0px rgba(18,14,0,0.08);}
.index_news dl dd{ padding:20px 30px; height:160px; box-sizing:border-box; width:100%; border:1px solid #EEEEEE; border-top:0;}
.index_news dl:hover dd{ border:1px solid #fff;border-top:0;}
.index_news dl dd span{ font-size:14px; color:#999; float:left; line-height:32px;}
.index_news dl dd .time{ float:right; background:url(../images/weikaishi.png) no-repeat; width:140px; height:32px; color:#fff; font-size:14px; line-height:32px; text-align:center; margin-right:-40px;}
.index_news dl dd .time.wu{ background:none; color:#999; margin-right:0; text-align:right;}
.index_news dl dd h3{ font-size:18px; line-height:30px; margin-top:10px;}
.index_qix{ padding-bottom:140px;}
.index_qix li{ float:left; margin-top:15px; text-align:center; width:20%; overflow:hidden; overflow:hidden; height:80px; display:flex; align-items:center; justify-content:center;}
.index_qix li img{ max-height:80px; max-width:100%; width:auto;}

.business{ background:url(../images/businessbg.png) no-repeat center top; background-size:100% auto;}
.business .top{ text-align:center;}
.business .top p{ font-size:18px; color:#666; margin-top:20px;}
.business .con{ width:920px; height:380px; position:relative; margin:70px auto 50px auto;}
.business .con .list{ width:380px; height:100%;   position:absolute; top:0; }
.business .con .list .yuan{ animation:zhuan 5s linear infinite;}
.business .con .list.y1{ left:0; }
.business .con .list.y2{ left:270px;}
.business .con .list.y3{ right:0; }
.business .con .list a{ display:block; width:110px; height:110px; border-radius:50%; line-height:110px; color:#fff; font-size:16px; text-align:center; position:absolute; z-index:100;}
.business .con .list.y1 a{background:linear-gradient(90deg,rgba(123,72,225,1),rgba(70,96,228,1)); box-shadow:0px 10px 30px 0px rgba(63,102,228,0.3); }
.business .con .list.y1 a.btn1{ left:50%; top:-40px; margin-left:-60px;}
.business .con .list.y1 a.btn2{ left:-40px; top:50%; margin-top:-40px;}
.business .con .list.y1 a.btn3{ left:50%; bottom:-40px; margin-left:-60px;}

.business .con .list.y2 a{ background:linear-gradient(-90deg,rgba(29,125,251,1),rgba(10,173,255,1));box-shadow:0px 10px 30px 0px rgba(9,157,255,0.3);  }

.business .con .list.y2 a.btn1{ left:0; top:0px; }
.business .con .list.y2 a.btn2{ left:0px; bottom:0%; }
.business .con .list.y2 a.btn3{ right:0; top:0px;}
.business .con .list.y2 a.btn4{ right:0; bottom:0px; } 
.business .con .list.y2 a.btn5{ left:50%; bottom:-40px; margin-left:-50px; } 

.business .con .list.y3 a{ background:linear-gradient(-90deg,rgba(35,166,232,1),rgba(0,191,229,1));box-shadow:0px 20px 40px 0px rgba(63,199,251,0.3);}
.business .con .list.y3 a.btn1{ right:50%; top:-40px; margin-right:-60px;}
.business .con .list.y3 a.btn2{ right:-40px; top:50%; margin-top:-40px;}
.business .con .list.y3 a.btn3{ right:50%; bottom:-40px; margin-right:-60px;}

@keyframes zhuan
{
from { transform:rotate(0)}
to { transform:rotate(360deg)}
}

@media screen and (max-width:1950px){
.index_about{ padding:80px 0; font-size:20px; line-height:40px; }

.index_product li .bg h3{ font-size:20px; margin-bottom:20px;}
.index_product li .bg span{ font-size:14px;}
.index_product li dd{ font-size:18px; }	 
}

@media screen and (max-width:1500px) { 
.index_technology .txt h2{ font-size:30px; line-height:32px; margin:150px 0 20px 0;}
.index_technology .txt ul{ font-size:16px; line-height:32px; }
.g_title{font-size:30px; line-height:32px;}
.flash .txt h2{ font-size:40px; }
.flash .txt h2 strong{ margin-right:15px;}


}

@media screen and (max-width:1230px) {
.hexagon .bar-horizontal a{ font-size:14px; line-height:22px; }
.hexagon .bar-horizontal {width:140px;height:150px;}
.index_technology .right_r .row:nth-child(1){transform: translate(-62px, 0)}
.index_technology .right_r .row:nth-child(2){transform: translate(0, -25px)}
.index_technology .right_r .row:nth-child(3){transform: translate(-62px, -50px)}
 
 
.index_technology .txt h2{ font-size:24px; line-height:26px; margin:120px 0 10px 0;}
.index_technology .txt ul{ font-size:14px; line-height:28px; }
.g_title{font-size:24px; line-height:26px;}

.flash .txt h2{ font-size:30px; line-height:35px; }
.flash .txt h2 strong{ margin-right:10px;}
.index_product li{ width:25%;}


.index_news dl dd{ padding:20px 20px;  }
.index_news dl dd span{ font-size:12px; }
.index_news dl dd .time{ font-size:12px; }
.index_news dl dd h3{ font-size:16px; }
.business .top p{ font-size:14px; }
}
@media screen and (max-width:1030px) { 
.video_pop{ width:80%; height:300px; margin: -150px 0 0 -40%; }
#videostr{ width:100%; height:300px;} 
.index_product li{ width:33.3333%;}
.index_news dl dd h3{ font-size:14px; line-height:24px;}
.business .con{ width:80%; height:300px;}
.business .con .list{ width:300px; }
.business .con .list.y2{ left:31%;}
.business .con .list a{  width:90px; height:90px; line-height:90px; font-size:14px; }
 
.business .con .list.y1 a.btn1{ top:-30px; margin-left:-50px;}
.business .con .list.y1 a.btn2{ left:-30px; margin-top:-40px;}
.business .con .list.y1 a.btn3{ bottom:-30px; margin-left:-50px;}
 
.business .con .list.y2 a.btn1{ left:-20px; top:20px; }
.business .con .list.y2 a.btn2{ left:-20px; bottom:20px; }
.business .con .list.y2 a.btn3{ right:-20px; top:20px;}
.business .con .list.y2 a.btn4{ right:-20px; bottom:20px; } 
.business .con .list.y2 a.btn5{ left:50%; bottom:-30px; margin-left:-40px; } 
 
.business .con .list.y3 a.btn1{ right:50%; top:-30px; margin-right:-50px;}
.business .con .list.y3 a.btn2{ right:-30px;  margin-top:-40px;}
.business .con .list.y3 a.btn3{ right:50%; bottom:-30px; margin-right:-50px;}
}

@media screen and (max-width:930px) {
.business .con{ width:80%; height:auto;}
.business .con .list{ width:300px; margin:0 auto; position:relative; margin-top:-20px; }
.business .con .list.y2{ left:0;}
.business .con .list.y3 a.btn1{ right:auto; left:-30px; top:50%; margin-right:0; margin-top:-40px;}
.business .con .list.y3 a.btn2{ right:-30px;  margin-top:-40px;}
.business .con .list.y3 a.btn3{ right:50%; bottom:-30px; margin-right:-50px;}	
} 

@media screen and (max-width:880px){
.index_about{ width:90%; padding:50px 0; font-size:18px; line-height:32px; }	
.index_about .playbtn{ font-size:16px;}
}

@media screen and (max-width:768px) {
.flash .swiper-pagination-bullet{ width:6px; height:6px; margin:0 6px;}
.flash.pc{ display:none;} 
.flash.wap{ display:block; margin-top:50px;}

.index_technology .txt{ float:none; width:100%;}
.index_technology .txt h2{ font-size:20px; line-height:26px; margin:50px 0 10px 0;}
.index_technology .right_r{ float:none; width:100%; margin-top:30px; text-align:center;} 
.index_technology .right_r .row:nth-child(1){transform: translate(0px, 0)}
.index_technology .right_r .row:nth-child(2){transform: translate(0, -10px)}
.index_technology .right_r .row:nth-child(3){transform: translate(0px, -20px)}
.hexagon { margin:0 5px;  }
.g_title{ font-size:20px;}
.flash .txt h2{ font-size:20px; line-height:35px; }
.index_product li{ width:50%;}
.index_news{ padding:50px 0;}
.index_news dl{ width:100%; float:none; margin:30px 0 0 0; }
.index_news dl:nth-last-child(1){ margin:30px 0 0 0;}
.index_news dl dd{ height:auto;} 

.index_qix{ padding-bottom:50px;}
.index_qix li{ width:33.33333%; }
}
@media screen and (max-width:620px) {	
.video_pop{ width:90%; height:240px; margin: -150px 0 0 -45%; }
#videostr{ width:100%; height:240px;}
}
 
@media screen and (max-width:480px) {
.index_product .tab li{ height:70px; } 
.product .list{ height:300px;} 
.map .hua{ top:15%; right:19%;}
.hexagon{ margin:0 2px; }
.hexagon .bar-horizontal a{ font-size:12px; line-height:20px; }
.index_technology .right_r .row:nth-child(1){transform: translate(0px, 0)}
.index_technology .right_r .row:nth-child(2){transform: translate(0, -10px)}
.index_technology .right_r .row:nth-child(3){transform: translate(0px, -20px)}
 
 
.index_product li{ padding:20px;}
.index_product li dt{ height:130px;}
.index_product li .bg h3{ font-size:16px; margin-bottom:10px;}
.index_product li .bg span{ font-size:12px;}
.index_product li dd{ font-size:14px; }	 
.index_qix li{ width:50%; }
}

@media screen and (max-width:400px) {
.contact_fl .fr p a{ display:block;} 
}

 