@import url('css2-OpenSansitalwght04000600070008001400160017001800_swap.css');
@import url('css2-Robotoitalwght04000500070009001400150017001900_swap.css');
*{line-height: 1.5em;padding:0px;margin:0px;zoom:1;font-style:normal;font-size: 16px;font-family: 'Open Sans','Microsoft YaHei','Arial', sans-serif;outline:none;}
*{-moz-box-sizing: border-box;-webkit-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;}
h1,h2,h3,h4,h5,h6{font-family: 'Roboto', sans-serif;}
ul,li{list-style-type: none;list-style:none;}
table{border-collapse:collapse;border-spacing:0;width:100%;}
tbody{display:table-row-group;vertical-align:middle;border-color:inherit;}
tr{display:table-row;vertical-align:inherit;border-color:inherit;}
td{padding:5px 10px;border: 1px solid #333;vertical-align:middle}
button{cursor:pointer;}
img{object-fit:cover;border:0;display: block;}
a,em,b,span,strong,i{display: inline-block;}
input,button,textarea,select,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;font-size:100%;border: 1px solid #ddd;overflow-x: hidden;outline:none;}
a,button{text-decoration:none;color:#333;-webkit-tap-highlight-color:rgba(0,0,0,0);}
a:hover{color: #1da1f2;}
*::selection{background:#1da1f2;color:#fff}
*::-moz-selection{background:#1da1f2;color:#fff}
*::-webkit-selection{background:#1da1f2;color:#fff}
input,select,button{outline:none;border:none;background:#fff;}
html{position:relative;background: #282b32;overflow-x:hidden;scroll-behavior: smooth;}
.pr{position: relative;}
.box{width: 1300px;margin: 0 auto; position: relative;}
.list{display: flex;display: -webkit-flex;flex-wrap: wrap;}
.listlr{display: flex;display: -webkit-flex;flex-wrap: wrap;justify-content:space-between;}
.qc:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.hide{display: none!important;}
.ico{font-family:"iconfont"!important;font-size:16px;font-style:normal;-webkit-font-smoothing: antialiased;-webkit-text-stroke-width: 0.2px;-moz-osx-font-smoothing: grayscale;}
/*Pagination*/
.Pagination{overflow: hidden;margin: 60px 0 60px;text-align: center;}
.Pagination a{float: left;text-decoration:none;font-size: 16px;display: inline-block;color: #333;background: #fff;height: 24px;line-height: 24px;margin: 0 10px;}
.Pagination span{float: left;font-size: 16px;display: inline-block;color: #fff;background: #1da1f2;line-height: 24px;border-radius: 100%;width: 24px;text-align: center;margin: 0 10px;}
.Pagination a:hover{color: #1da1f2;}
.Pagination li{display: inline-block;}
.Pagination_list{display:inline-block;padding: 10px 0px;}
.Pagination em{float: left;margin: 0 5px;font-style:normal;height: 24px;line-height: 24px;display: inline-block;}
.Pagination i{float: left;margin: 0px 20px;font-size: 16px;text-decoration:none;position: relative;top: 0px;}
.Pagination b{font-weight: normal;}
.Pagination strong{float:left;font-weight: normal; margin: 0 10px;}
.fenye{padding: 10px 20px;margin-bottom: 120px;margin-top: 40px;overflow: hidden;border-top: 1px solid #ddd;}
.fenye a{display: inline-block;width: 40%;height: 1.5em;line-height: 1.5em;overflow: hidden;color: #666;white-space:nowrap;text-overflow:ellipsis;font-size: 16px;}
.fenye a:hover{color: #1da1f2;}
.fenye a.fr{text-align:right;}
/*Pagination*/



/*swiper*/
.swiper-pagination span{width:20px;height:6px;border-radius:0px;background: #ddd;opacity:1; }
.swiper-pagination .swiper-pagination-bullet-active{background: #1da1f2;}
.swiper-slide img{display: block; width: 100%;}
/*.swiper-button-next,.swiper-button-prev{background-image:none!important; border: 2px solid #1da1f2; line-height: 44px; text-align: center;}*/
.swiper-button-next i,.swiper-button-prev i{color: #1da1f2;}
.swiper-slide a{display: block;}
/*style*/

.imghover{overflow:hidden}
.imghover img{transition:0.4s;-o-transition:0.4s;-moz-transition:0.4s;-webkit-transition:0.4s;display:block}
.imghover:hover img{transform:scale(1.1);-ms-transform:scale(1.1);-webkit-transform:scale(1.1);-o-transform:scale(1.1);-moz-transform:scale(1.1)}



.pageA{
    position: relative;
    height: 100vh;
    background: #212227;
}
.pageAbj{
    width: 100%;
}
.pageAtxt{
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    display: -webkit-flex;
    align-items:center;
    padding: 80px  2rem 0;
}
.pageAleft{}
.pageAleft h2{
    color: #fff;
    font-size: 0.7rem;
    font-weight: normal;
    margin-bottom: 0.5em;
}
.pageAleft h3{
    color: #c1c1c1;
    font-size: 0.65rem;
    font-weight: normal;
    margin-bottom: 0.5em;
}
.pageAleft p{
    color: #fff;
    font-size: 0.3rem;
}
.pageAleft em{
    font-size: 0.3rem;
    color: #1da1f2;
}


.pageAright{}
.pageAright img{
    width: 6.6rem;
    margin-bottom: 20px;
}
.pageAright p{
    display: inline-block;
    font-size: 0.4rem;
    color: #b4b4b4;
}
.pageAright a{
    width: 2rem;
    background: #05cdad;
    text-align: center;
    font-size: 0.35rem;
    color: #fff;
    border-radius: 40px;
    line-height: 1.8em;
    float: right;
    background-image: linear-gradient(to right, #05cdad , #8cdad5);
}
 
.pageB{
    padding: 1rem 2.5rem 1.5rem;
    background: #fff;
}
.pageBtitle{
    margin-bottom: 0.8rem;
}
.pageBtitle p{
    display: block;
    margin: 0 auto;
    text-align: center;
    font-size: 0.3rem;
    letter-spacing: 1px;
}
.pageBtitle em{
  
    position: absolute;
}
.pageBtitle h3{
    background-image: -webkit-linear-gradient(bottom,#0893e4,#03d2f4,#00ffff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-align: center;
    font-size: 0.6rem;
    font-weight: normal;
    }
.pageBtitle em:nth-child(2){
    right: -0.3rem;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0.3rem 0.5rem 0.3rem;
    border-color: transparent transparent #ffffff transparent;
}
.pageBtitle em:nth-child(1){
    left: -0.3rem;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0.5rem 0.3rem 0 0.3rem;
    border-color: #ffffff transparent transparent transparent;
}
.pageB ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    display: -webkit-flex;
    }
.pageB ul li{
    text-align: center;
    position: relative;
    width: 25%;
}
 .pageB ul li img{width: 100%;}
.pageBcp{
    width: 2.5rem;
    position: absolute;
    right: -1.5rem;
    bottom: -1.4rem;
}


.pageC{
    padding: 1rem 2.5rem;
    background: #282b32;
}
.pageC ul{}
.pageC ul li{
    margin-bottom: 2rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    display: -webkit-flex;
    align-items:center;
}
.pageC ul li:last-child{margin-bottom: 0px;}
.pageC ul li em{
    background-image: linear-gradient(to right, #05cdad , #3d4046);
    font-size: 0.5rem;
    color: #fff;
    padding: 0px 20px 2px 1rem;
}
.pageCleft{}
.pageCright{}
 .pageCright div{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    display: -webkit-flex;
    align-items:center;
    color: #c1c1c1;
    font-size: 0.25rem;
    }
.pageCli1 p{
    color: #c1c1c1;
    font-size: 0.25rem;
    margin: 1rem 0;
}

.pageCli1 strong{
    color: #1da1f2;
    font-size: 0.3rem;
}
.pageCli1 span{
    color: #c1c1c1;
    font-size: 0.25rem;
    display: block;
    padding-left: 3rem;
}
.pageCli1 .pageCright img{
    width: 3.2rem;
    margin-right: 1rem;
}
.pageCli1 .pageCright{}
.pageCli1  h4{
    font-size: 0.25rem;
    color: #c1c1c1;
    font-weight: normal;
    width: 7rem;
}
.pageCli1  h5{
    height: 25px;
    width: 7rem;
    background: #000;
    border-radius: 40px;
    background-image: linear-gradient(to right, #05cdad , #bdcdca);
    margin-top: 10px;
}
.pageCli1 h4 b{
    color: #09cdae;
    font-size: 0.3rem;
    float: right;
}

.pageCli2{}
.pageCli2 .pageCright img{
    width: 7rem;
}

.pageCli3{}
.pageCli3 .pageCright img{
    width: 3rem;
    margin-right: 2rem;
}

.pageCli2 p{
    color: #c1c1c1;
    font-size: 0.3rem;
 padding-top: 1.5rem;
}
.pageCli2 p strong{
    color: #1da1f2;
    font-size: 0.3rem;
}

.pageCli3{}
.pageCli3 p{
    color: #c1c1c1;
    font-size: 0.3rem;
    padding: 0.2rem 0 0.2rem 1rem;
}
.pageCli3 p strong{
    color: #1da1f2;
    font-size: 0.3rem;
}

.pageC ul li.pageCli3 em{
    margin-bottom: 2em;
}




 

  

.pageCli1 .pageCright div{margin-bottom: 0.4rem;font-weight: bold;}
.pageCli1 .pageCright div:nth-child(2){ margin-bottom: 0px; }

#indexBanner{margin: 0rem 15%; padding-bottom: 40px;}




#Overlay {
    position: relative;
  
 
}

#Overlay img{width: 100%;display: block;}
#Overlay  .swiper-slide {
    width: 65%;
    text-align: center;
}
 
#Overlay  .swiper-slide p {
    
color: #fff;
    
text-align: center;
    
display: none;
    
font-size: 0.3rem;
}

.pageD{    padding: 1rem 2.5rem 1.5rem;background: #fff;}
 
#Overlay button i:hover{color: #1da1f2;}

.casebox{background-color: #282b32; padding: 1rem 2.5rem}
.casebox dl{ margin-bottom: 1rem; }
.shejiA{}
.shejiA dt{
    background-image: linear-gradient(to right, #05cdad , #3d4046);
    font-size: 0.5rem;
    color: #fff;
    padding: 0px 1rem 2px 0.2rem;
    display: inline-block;
    margin-bottom: 0.7rem;
}
.shejiA dd{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    display: -webkit-flex;
    align-items: center;
}
.shejiAUl{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    display: -webkit-flex;
}
.shejiAUl li{
    width: 30%;
    text-align: center;
}
.shejiAUl li img{width:100%;margin-bottom: 0.5rem;}
.shejiAUl li p{
    background-image: linear-gradient(to right, #05cdad , #3d4046);
    font-size: 0.3rem;
    color: #fff;
    padding: 4px 20px 4px 20px;
    display: inline-block;
    border-radius: 40px;
}
.shejiBtxt{}
.shejiBtxt h3{
    color: #c1c1c1;
    font-size: 0.3rem;
    font-weight: normal;
    padding: 0.5em 0;
}
.shejiBtxtOl{
    width: 60%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    display: -webkit-flex;
}
.shejiBtxtOl li{
    width: 23%;
    text-align: right;
}
.shejiBtxtOl li img{height: 4rem;display: inline-block;}

.shejiCtxt{}
.shejiCtxt h3{
    color: #c1c1c1;
    font-size: 0.3rem;
    font-weight: normal;
    padding: 0.5em 0;
}

.shejiAUl3{
    width: 52%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    display: -webkit-flex;
    background: #75767a;
    padding: 0.4rem 0.4rem;
    border-radius: 10px;
}
.shejiAUl3 li{text-align: center;}
.shejiAUl3 p{
    color: #000;
}
.shejiAUl3 li img{height: 1.25rem;margin-bottom: 0.4rem;}
#Overlay .swiper-slide-active p{display: block;}

#Overlay .swiper-slide h3{
    display: none;
    position: relative;
    color: #fff;
    font-size: 0.4rem;
    font-weight: normal;
}
#Overlay .swiper-slide-active h3{display:inline-block;}




#Overlay .swiper-slide h3 em:nth-child(1) {
    left: -0.3rem;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0.95rem 0.3rem 0 0.3rem;
    border-color: #282b32 transparent transparent transparent;
    top: 0px;
    display: none;
}
#Overlay .swiper-slide h3 em:nth-child(2) {
    right: -0.3rem;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0.3rem 0.95rem 0.3rem;
    border-color: transparent transparent #282b32 transparent;
    top: 0px;
    display: none;
}
#Overlay .swiper-slide h3 em{position: absolute;}

.Overlay{    background-color: #282b32;
    padding: 5vw 13vw;}
 #Overlay .swiper-slide .txt{
    position: absolute;
    width: 100%;
    left: 0px;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    padding: 0.2rem;
    display: none;
}

#Overlay .swiper-slide-active .txt{display: block;}


#slide3 .swiper-button-next i{font-size: 50px;
    color: #ddd;}
    #slide3 .swiper-button-prev i{font-size: 50px;
    color: #ddd;}
   #slide3 .swiper-slide {
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -ms-filter: blur(5px);
    filter: blur(5px);
        width:46%;
        transition-timing-function:linear;
        opacity: 0.5;
        transform: scale(0.9);
        border-radius: 12px;
        overflow: hidden;
        border: 4px solid #49def7;
    }
 
    #slide3 .swiper-slide img{
        width:100%;
        border-radius: 4px;}
     
   #slide3 .swiper-button-next,#slide3 .swiper-button-prev{
        width:86px;
        height:112px;
        background-size:86px 112px;
        margin-top:-56px;
        outline:none;
        background: none;
        line-height: 122px;
        text-align: center;
        color: #fff;
        }
 /*   #slide3 .swiper-button-next{
        background-image:url(../images/cursor-next.png);}
    #slide3 .swiper-button-prev{
        background-image:url(../images/cursor-prev.png);}    */  
    #slide3 .swiper-pagination-bullet{
  
        opacity:1;
        margin:0 6px !important;
        width:9px;
        height:9px;
        position:relative;
        outline:none;
        vertical-align:middle;}
    #slide3 .swiper-pagination-bullet span{
        width:3px;
        height:3px;
        background:#CCC;
        display:block;
        border-radius:50%;
        margin-top:3px;
        margin-left:3px;
    }
    #slide3 .swiper-pagination-bullet i{
        background:#000;
        height:1px;
        width:20px;
        position:absolute;
        top:4px;
        transform:scaleX(0);
        transform-origin:left;
        z-index:3;
        transition-timing-function:linear;
        }
    #slide3 .swiper-pagination-bullet-active span,#slide3 .swiper-pagination-bullet:hover span{
        width:9px;
        height:9px;
        margin-top:0;
        margin-left:0;
        background:#000;
        position:relative;
        z-index:1;
        }


#slide3{background-color: #282b32;}
 #slide3  .swiper-slide-active{opacity: 1;transform: scale(1);-webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    -ms-filter: blur(0px);
    filter: blur(0px);}

 .pageTitle{background-color: #282b32;padding-top: 0.5rem;}
 .pageTitle h3{text-align: center;}
 .pageTitle h3 img{margin: 0 auto; width: 12.9rem;}


 #Overlay .swiper-slide-active{border: 3px solid #fff;border-radius:4px;}

span.lanse{    color: #c1c1c1;
    font-size: 0.3rem;color: #1da1f2;  margin: 0 5px;}


.pageDA{
    overflow: hidden;
    padding: 1rem 2.5rem 0rem;
}
.pageDA h3{
    background-image: -webkit-linear-gradient(bottom,#0893e4,#03d2f4,#00ffff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-align: center;
    font-size: 0.6rem;
    font-weight: normal;
} 
.pageDA p{
    color: #c1c1c1;
    font-size: 0.3rem;
    text-align: center;
    margin-bottom: 0.6rem;
}
.pageDA img{
    margin: 0 auto;
}

.pageDB{
    background: #fff;
    padding: 1rem 2.5rem 0rem;
}
.pageDB h3{
    background-image: -webkit-linear-gradient(bottom,#02060a,#3b5361,#8fa4af);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    text-align: center;
    font-size: 0.6rem;
    font-weight: normal;
    margin-bottom: 0.3rem;
}
.pageDB p{
    color: #6d8390;
    font-size: 0.3rem;
    text-align: center;
    line-height: 2em;
}
.pageDB div{
    width: 940px;
    margin: 0 auto;
    position: relative;
    margin-top: 1rem;
}
.pageDB img{
    max-width: 100%;
}
.pageDB ul{
    position: absolute;
    width: 100%;
    top: 0px;
    overflow: hidden;
}
.pageDB li{
    width: 50%;
    text-align: center;
    float: left;
    font-size: 0.3rem;
    line-height: 3em;
}
.pageDB div em{
    position: absolute;
    width: 0%;
    transition: 1s;
-o-transition: 1s;
-moz-transition: 1s;
-webkit-transition: 1s;
    height: 100%;
    right: 0px;
    background: rgba(255, 255, 255, 0.40);
}
.pageDB div.right em{  animation:myfirst 3s; width: 50%;}

@keyframes myfirst
{
    0%   {width: 0%;}
    50%  {width: 100%;}
    100%  {width: 50%;}
    
}

.pageDC{
    padding: 1rem 2.5rem 0.5rem;
}
.pageDC h3{
    background-image: -webkit-linear-gradient(bottom,#0893e4,#03d2f4,#00ffff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-align: center;
    font-size: 0.6rem;
    font-weight: normal;
    margin-bottom: 20px;
}
.pageDC p{
    color: #c1c1c1;
    font-size: 0.3rem;
    text-align: center;
}
.pageDC ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    display: -webkit-flex;
    width: 940px;
    margin: 0 auto;
    padding-top: 0.6rem;
}
.pageDC li{
    width: 25%;
}
.pageDC img{
    width: 100%;
}
.pageDC em{    color: #1da1f2;
    font-size: 0.3rem;
    font-weight: bold;
    margin: 0 10px;}

#Overlay button:nth-child(1){
    left: -1rem;
}
#Overlay button:nth-child(2){
    right: -1rem;
}
#Overlay button i{font-size: 50px;color: #ddd;}
#Overlay button{position: absolute;top: 50%;margin-top: -37px;background: none;}

 
#Overlay button i:hover{color: #1da1f2;}


.Specifications{
    padding: 1rem 2.5rem;
    background: #282b32;
}
.Specifications h3{
    background-image: -webkit-linear-gradient(bottom,#0893e4,#03d2f4,#00ffff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-align: center;
    font-size: 0.6rem;
    font-weight: normal;
    margin-bottom: 20px;
}

.Specifications table{}
.Specifications td{
    color: #c1c1c1;
    padding: 10px 20px;
    border: 1px solid #6c6f73;width: 50%;
}
.Specifications tr{
    background: #404348;
}
.Specifications tr:nth-child(even){
    background: #5e5f62;
}

.indexnav{
    padding: 0rem 2rem 0;
    position: fixed;
    width: 100%;
    z-index: 2;
    background: rgba(0, 0, 0, 0.3);
}
.indexnavnr{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    display: -webkit-flex;
    align-items:center;
}
.indexnavnr .logo{}
.indexnavnr ul{}
.indexnavnr ul li{
    float: left;
}
.indexnavnr ul li a{
    color: #fff;
    padding-left: 60px;
}
.indexnavnr .logo img{ height: 80px; }

.fixed .indexnav{    background-color: rgba(0, 0, 0, 0.8);}
.fixed .indexnavnr .logo img{ height: 60px; }
.swiper-pagination{display:none}
/***********************************************************1600px*******************************************************/
@media (min-width:1200px) and (max-width:1600px){
 .indexnav{    padding: 0rem 1rem 0;}
.pageCli1 span{    padding-left: 2rem;}
}