/*css reset*/
*{
    -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite, code,del,dfn,em,img,ins,kbd,q,samp,small,strong,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio, video{ margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; outline-style:none;/*FF*/font-size:10px;  font-family: "Microsoft Yahei","Arial";  list-style:none;}
/* html{
  scroll-behavior: smooth;
} */
body { line-height:1; }
a{ margin:0; padding:0; border:0; font-size:100%; vertical-align:baseline; background:transparent;text-decoration:none; color:#000; cursor:pointer;outline:0;}
a:hover,a:focus{ text-decoration:none;  outline-style:none;/*FF*/ }
table { border-collapse:collapse; border-spacing:0;}
input, select {vertical-align:middle;}
img{
  max-width: 100%;
}
/*字体引用*/
@font-face {
  font-family: "EnterGrid"; /* Project id  */
  src: url('/static/fonts/Enter-the-Grid-2.ttf?t=232424242') format('truetype');
}
@font-face {
  font-family: "TT0857M"; /* Project id  */
  src: url('/static/fonts/TT0857M.TTF?t=123465134') format('truetype');
}
@font-face {
  font-family: "iconfont"; /* Project id  */
  src: url('/static/fonts/iconfont.ttf?t=1751441396846') format('truetype');
}

.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-down:before {
  content: "\e664";
}

.icon-youxiang:before {
  content: "\e632";
}

.icon-right:before {
  content: "\e642";
}

.icon-dizhi:before {
  content: "\e628";
}

.icon-diqiu:before {
  content: "\e844";
}

.icon-dianhua:before {
  content: "\e862";
}

.icon-fax-fill:before {
  content: "\e620";
}

.icon-sousuo:before {
  content: "\e8b9";
}



/*公共*/
.warp{max-width:1600px;margin:0 auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.warp2{max-width:1300px;margin:0 auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
:root {
  /* 颜色参数 */
  --primary-color: #fff; /* 主色调 */
  --secondary-color: #e4001c; /* 次要色调 */
  --text-color: #000; /* 默认文本颜色 */
  --light-color: #1d97d5; /* 浅色背景 */
  --dark-color: #595959; /* 深色文本 */
  --accent-color: #ff6b00; /* 强调色 */

  /* 文字大小参数 */
  --font-size-xs: 1.4rem; /* 超小字体 */
  --font-size-sm: 1.8rem; /* 小字体 */
  --font-size-md: 2rem; /* 中等字体 */
  --font-size-lg: 2.4rem; /* 大字体 */
  --font-size-lx: 2.6rem; /* 大字体 */
  --font-size-lxx: 3rem; /* 大字体 */
  --font-size-x: 3.6rem; /* 超大字体 */
  --font-size-xx: 4.4rem; /* 超大字体 */
  --font-size-xl: 4.8rem; /* 超大字体 */
  --font-size-xxll: 6rem; /* 特大字体 */
  --font-size-xxl: 6.8rem; /* 特大字体 */
--font-size-xxxl: 8rem; /* 特大字体 */
--font-size-xxxxl: 10rem; /* 特大字体 */
}

.flex-box{
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}
.flex-txt{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}


.Pagination{
    text-align: center;
    height: auto;
    _height: 45px; 
    line-height: 20px;
    margin-right: 15px;
    _margin-right: 5px; 
    color:#565656;
    margin-top: 10px;
    _margin-top: 20px; 
    clear:both;
    width: 100%;
}
.Pagination li{display: inline-block;}
.Pagination a:hover{
    color: #fff;
    border: 1px solid #e4001c;
    background-color: #e4001c;
}

.Pagination a,.Pagination span{ 
    font-size: 14px;
    text-decoration: none;
    display: block;
    float: left;
    color: #565656;
    border: 1px solid #ccc;
    height: 34px;
    line-height: 34px;
    margin: 0 2px;
    width: 34px;
    text-align: center;
}
.Pagination span{ 
    font-size: 14px;
    text-decoration: none;
    display: block;
    color: #666;
    height: 34px;
    line-height: 34px;
    margin: 0 2px;
    width: 34px;
    text-align: center;
}
.Pagination li.active span{
    color: #fff;
    border: 1px solid #e4001c;
    background-color: #e4001c;
}

/*分页*/
div.fy {text-align:center;line-height:4rem; width: 100%}
div.fy a { margin:2px 2px;padding:8px 12px;color:#666;font-size:1.4em; display:inline; background: #fff; box-shadow: 2px 2px 4px rgba(0,0,0,0.2);}
div.fy a:hover {
    color: #fff;
    background: #e4001c;
    box-shadow: 2px 2px 4px rgba(0,0,0,0.2);
}
div.fy a:active {
    color: #fff;
    background: #e4001c;
    box-shadow: 2px 2px 4px rgba(0,0,0,0.2);
}
div.fy span.current {
    margin: 2px 2px;
    padding: 8px 12px;
    color: #fff;
    font-size: 1.4em;
    background: #e4001c;
    box-shadow: 2px 2px 4px rgba(0,0,0,0.2);
}
div.fy span.disabled{  margin:2px 2px;padding:8px 12px; color:#666; font-size:1.4em; background: #fff;  box-shadow: 2px 2px 4px rgba(0,0,0,0.2);}


/*手机导航*/
.m-header{ width:100%; background:#fff;}
#hamburger { width: 24px; height: 14px;	position:fixed;	top: 30px;	right: 20px;	z-index: 21;display: none !important;}
#hamburger:before, #hamburger:after, #hamburger span { background:#fff; content: ''; display: block;    width: 20px;  height: 2px;}
#hamburger span {	margin: 4px 0 0 0;}
#hamburger:after {	margin: 4px 0 0 0;}
#hamburger.hb-fixed {	position: fixed;}
/* Hamburger animation */
#hamburger:before, #hamburger:after, #hamburger span {	-webkit-transition: none 0.3s ease 0.3s;	transition: none 0.3s ease 0.3s;	-webkit-transition-property: transform, top, bottom, left, opacity, margin;	transition-property: transform, top, bottom, left, opacity, margin;}
html.mm-opening #hamburger:before, html.mm-opening #hamburger:after {top: 20px;background-color: #fff;}
html.mm-opening #hamburger span {	left: -50px;	opacity: 0;}
html.mm-opening #hamburger:before {	transform: rotate( 45deg );	margin: 7.5px 0 0 0;}
html.mm-opening #hamburger:after {	transform: rotate( -45deg );margin: -7.5px 0 0 0;}
.fixd #hamburger:before,.fixd  #hamburger:after, .fixd #hamburger span { background:#fff; content: ''; display: block;    width: 20px;  height: 2px;}
/*手机底部*/
.bottomlist{ background:#e4001c; position:fixed; width:100%; bottom:0; left:0;  display:none; z-index:200;}
.bottomlist ul{ width:100%;}
.bottomlist ul li{ width:33.33%; float:left; text-align:center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding:5px;}
.bottomlist>ul>li>a>div{ font-size:1.6em; color:#fff;}
.bottomlist ul li img{ width:40px; height:40px;}

/*搜索*/
.overCurtain {position: fixed; top:20px; right:40px; height:40px; width:40px;display:none; opacity:1; z-index:100000; cursor:pointer;}
.hide-center { background-color:rgba(0,0,0,0.8);  position:fixed; z-index:99999; display:none; width:100%; height:100%; top:0;}
.hide-center .boxs{ display:table; width:100%; height:100%;}
.hide-center .box{ display:table-cell; vertical-align:middle; padding:0 20px;}
.field__input{ float:left; width:100%; border:none; outline:none; height:60px; padding:20px 160px; font-size:3.2em; font-weight:bold; color:#fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; text-align:center; border-bottom:1px solid #ccc; background-color: transparent;}
.m-btn{ float:left; border:none; outline:none; background-color: transparent; padding:19.5px; height:60px; font-size:1.6em; font-weight:bold; color:#fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width:140px; position:absolute; right:40px; text-transform:uppercase;}
.s-close { width:40px; height:40px; transition:linear .5s all;-moz-transition: linear .5s all; -webkit-transition:linear .5s all; -o-transition: linear .5s all; font-size:0px; margin-top:20px;    display:block;}
.s-close::before,.s-close::after {  content:''; width:40px; height:2px; background:#FFF;    display:block; transition:linear .5s all;-moz-transition: linear .5s all; -webkit-transition:linear .5s all; -o-transition: linear .5s all;}
.s-close::before {  -webkit-transform:rotate(45deg);    transform:rotate(45deg);}
.s-close::after {   -webkit-transform:translateY(-2px) rotate(-45deg);  transform:translateY(-2px) rotate(-45deg);}
.s-close:hover:before{transform:rotate(90deg);}
.s-close:hover:after{ transform:rotate(0deg);}


/*头部*/

.header{  
    text-align: center; 
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 20;
    
}
.header.up,.fixd .header{ position: fixed; background: #000;  width: 100%; z-index: 20; box-shadow: 0 0 6px rgba(0,0,0,0.6);}
.header .mune{
    display: flex ;
    align-items: center;
}
.header .logo a{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.header .logo a p{
  font-size: var(--font-size-lg);
  color: #000;
  letter-spacing: 4px;
  padding-left: 20px;
}
.header.up .logo a p,.fixd .header .logo a p{   
  color: #fff;
}
.header nav{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap; 
    align-items:center; 
   
}
.header nav .item{
    position: relative;
    display: grid;
    align-items: center;
    margin: 0 5px;
    
}
.header nav a{
    font-size: var(--font-size-sm);
    color: #000;
    margin: 0 15px;
    display: flex;
    align-items: center;
    position: relative;
    line-height: 50px;

}
.header.up nav a,.fixd .header nav a{
    
    color: var(--primary-color);

}
.header nav .item::after{
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px;
  background: var(--secondary-color);
  transition: ease .5s all;
  -moz-transition: ease .5s all;
}
.header nav .item:hover:after{
    width: 100%;
}



.header .lan,.header .search-head{
/*  padding: 38px 0 28px 10px;*/
    padding: 0;
    
}
.header .lan{
    display: flex;
    justify-content: flex-start;
    align-items:center;
    margin-right: 10px;

}
.header .lan a{
    padding: 0;
    position: relative;
    color: #fff;
}
.header .lan a:first-child{
    padding: 0;
}
.header .search{
  border-right: 1px solid #000;
  padding-right: 12px;
}
.header.up .search,.fixd .header .search{
  border-right: 1px solid #fff;
  padding-right: 12px;
}
.header .search a{
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  line-height: 24px;
}
.header .search p,.header .search i{
  color: #000;
  font-size: var( --font-size-sm);
}
.header.up .search p,.header.up .search i,.fixd .header .search p,.fixd .header .search i{
  color: #fff;
  font-size: var( --font-size-sm);
}
.header .search i{
  font-size: var(--font-size-md);
  padding-right: 10px;
}


.header .lan .lun{  
    cursor: pointer; 
    color: #000;
    position: relative;  
    padding: 30px 20px 30px 10px;

}
.fixd .header .lan .lun{  
    color: #fff;
}
.header.up .lan .lun{   
    color: var(--primary-color);
}
.header .lan .lun i{
    font-size: 24px;
}
.header .lan .lun:after{ 
    position: absolute;
    right: 0;
    width: 20px;
    content: "\e664";
    font-family: "iconfont" !important;
    color: #000;
    font-size: 2rem;
    top: 50%;
    transform: translateY(-50%);
}
.header.up .lan .lun:after,.fixd .header .lan .lun:after{ 
    
    color: var(--primary-color);
}
.header .lan .lun a{ font-size: 1.4rem; line-height: 32px;}
.header .lan .lun .ld{ 
    position: absolute; 
    top:80%; 
    right: 0; 
    width: 150px;
    background: #000 ; 
    transform: scale(0); 
    transform-origin : 50% 0 0;
    z-index: 988;
}
.header .lan .lun .ld a{ display: block; color: #fff; text-align: center;}
.header .lan .lun .ld a:hover{ background:var(--secondary-color);}
.header .lan .lun:hover .ld{ transform: scale(1);}



.header .logo{ padding:23px 0;}

/*下拉*/
.header nav .item .mud{
  position: absolute;
  top: 100%;
  width: auto;
  background: rgba(0, 0, 0, .8);
  z-index: 988;
  left: 50%;
  border-radius:  0 0 10px 10px;
  transform: translate(-50%,0);
  transition: ease 1s all;
  -moz-transition: ease 1s all;
  min-width: 150px;
  overflow: hidden;
  height: 0;
  opacity: 0;
  
}
.header nav .item .mud a{
  display: block;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  line-height: 45px;
  font-size: 14px;
  margin: 0;
  padding: 0 10px;
  text-transform: lowercase;
}
.header nav .item .mud a::first-letter{
  text-transform: uppercase;
}
.header nav .item .mud a:first-child{
  margin-top: 20px;
}
.header nav .item .mud a:last-child{
  margin-bottom: 15px;
}
.header nav .item .mud a::after{
  display: none;
}
.header nav .item .mud a:hover{
  background: var(--secondary-color);
}
.header nav .item:hover .mud{
  height: auto;
  opacity: 1;
}


#m1 #a1:after,#m2 #a2:after,#m3 #a3:after,#m4 #a4:after,#m5 #a5:after{
  width: 100%;
}


/*底部*/
.foot_form{
  text-align: center;
  background-color: #000;
  padding: 100px 0;
}
.foot_form h2{
  font-size: var(--font-size-xxl);
  font-family:"EnterGrid" ;
  color: #fff;
  padding-bottom: 34px;
  
}
.foot_form p{
  font-size: var(--font-size-md);
  color: #999;
}
.foot_input{
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  max-width: 750px;
  margin: 0 auto;
  padding-top: 45px;
}
.foot_input input{
  background-color: #333;
  border: none;
  outline: none;
  height: 64px;
  line-height: 64px;
  padding-left: 24px;
  font-size: var(--font-size-md);
  color: #fff;
}

.foot_input button{
  height: 64px;
  border: none;
  outline: none;
  color: #fff;
  font-size: 60px;
  background: var(--secondary-color);
  width: 120px;
}
.foot_input button i{
  font-size: 40px;
}

.footer{
  background-color: #000;
}
.footer .fo1 .warp{
  display: grid;
  grid-template-columns: repeat(5,auto);
  color: #fff;

}
.footer .fo1 .item h3{
  color: #808080;
  font-size: var(--font-size-lg);
  padding-bottom: 30px;
}
.footer .fo1 .item a{
  color: #fff;
  font-size: var(--font-size-xs);
  display: block;
  padding-bottom: 20px;
  text-transform: lowercase;
  
}
.footer .fo1 .item a:hover{
  text-decoration: underline;
}
.footer .fo1 .item a::first-letter{
  text-transform: uppercase;
}
.footer .fo1 .item p{
  font-size: var(--font-size-xs);
  padding-bottom: 20px;
}

.footer .fo2{
  padding-top: 60px;
}
.footer .fo2 a{
  margin-right: 25px;
  display: inline-block;
  border-radius: 50%;
  border: 2px solid #fff;
  padding: 5px;
}
.footer .fo2 a:hover{
  background: var(--secondary-color);
  border-color: var(--secondary-color);
}
.footer .fo3{
  padding: 50px 0;
}
.footer .fo3 .warp{
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #fff;
  
}
.footer .fo3 p{
  font-size: var(--font-size-xs);
}

.footer .fo2 .weixin{
    position: relative;
}
.footer .fo2 .weixin .code{
    position: absolute;
    width: 120px;
    height: 120px;
    padding: 10px;
    background-color: #fff;
    bottom: 70px;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
}
.footer .fo2 .weixin .code img{
    width: 100%;
}
.footer .fo2 .weixin:hover .code{
    opacity: 1;
}


/*banner*/
.banner .txt{ transition:ease 0.5s all;-moz-transition: ease 0.5s all; -webkit-transition:ease 0.5s all; -o-transition: ease 0.5s all;}
.banner .swiper-slide{
    position: relative; 
    height: 1031px; 
    overflow: hidden;
    display: flex;
    justify-content: center;
    flex-direction: column;
 
}
.banner .ban1{ background: url(/static/images/banner01.jpg) center bottom no-repeat; background-size: cover !important; position: relative;}
.banner .ban2{ background: url(/static/images/banner02.jpg) center bottom no-repeat; background-size: cover;}
.banner .ban3{ background: url(/static/images/banner03.jpg) center bottom no-repeat; background-size: cover;}
.banner .ban4{ background: url(/static/images/banner04.jpg) center bottom no-repeat; background-size: cover;}
.banner .ban5{ background: url(/static/images/banner05.jpg) center bottom no-repeat; background-size: cover;}
.banner .warp{
    width: 100%;
}
.banner .txt{
    display: flex;
    justify-content: left;
    flex-direction: column;
    color: #333;
    width: 43%;
    
}
.banner .txt h2{ 
    font-size: var(--font-size-xxxxl);
    margin-bottom: 50px;
    font-family:"EnterGrid" ;
    line-height: 78px;
    transform: translateX(30%);
    opacity: 0;
    font-style: italic;
    transition: ease 0.7s all;
    -moz-transition: ease 0.7s all;
    -webkit-transition: ease 0.7s all;
    -o-transition: ease 0.7s all;
    transition-delay: 0.2s;
    
}
.banner .txt h3{ 
    font-size: var(--font-size-xxxl);
    margin-bottom: 50px;
    font-family:"EnterGrid" ;
    line-height: 78px;
    transform: translateX(30%);
    opacity: 0;
    transition: ease 0.7s all;
    -moz-transition: ease 0.7s all;
    -webkit-transition: ease 0.7s all;
    -o-transition: ease 0.7s all;
    transition-delay: 0.2s;
    
}
.banner .txt h4{ 
    font-size: var(--font-size-xx);
    margin-bottom: 50px;
    font-family:"EnterGrid" ;
    line-height: 64px;
    transform: translateX(30%);
    opacity: 0;
    transition: ease 0.7s all;
    -moz-transition: ease 0.7s all;
    -webkit-transition: ease 0.7s all;
    -o-transition: ease 0.7s all;
    transition-delay: 0.2s;
    
}
.banner .txt p{ 
    font-size: var(--font-size-lx);
    font-family:"TT0857M" ;  
    line-height: 48px;
    text-transform: uppercase;
    transform: translateX(30%);
    opacity: 0;
    transition: ease 0.7s all;
    -moz-transition: ease 0.7s all;
    -webkit-transition: ease 0.7s all;
    -o-transition: ease 0.7s all;
    transition-delay: 0.4s;
}
.ban4 .txt p,.ban5 .txt p{
  text-transform: none;
}
.ban5 .txt{
  color: #fff;
}

.banner .swiper-slide-active .txt h2,.banner .swiper-slide-active .txt h3,.banner .swiper-slide-active .txt h4,.banner .swiper-slide-active .txt p{
    transform: translateX(0);
    opacity: 1;
}


.hid{
    display: none;
}
.his{
    display: block;
}
.banner .txt a{
    font-size: 1.8rem;
    border: 1px solid #fff;
    line-height: 36px;
    border-radius: 18px;
    display: inline-block;
    width: 200px;
    color: #fff;
    padding: 0 0 0 28px;
    position: relative;
    margin-top:100px;
}
.banner .txt a:hover{
    background-color: #014190;
    border: 1px solid #014190;
    color: #fff;
}
.banner .txt a:hover:after{
    content: "\e8d4";
    font-size: 1.6rem;
    color: #fff;

}

.ban3 .txt a{
    margin-top:45px;
}
.banner .txt a:after{
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    font-family: "iconfont";
    content: "\e8d7";
    font-size: 1.4rem;
    color: #fff;
    font-weight: lighter;

}


.banner .swiper-horizontal>.swiper-pagination-bullets, .banner .swiper-pagination-bullets.swiper-pagination-horizontal, .banner .swiper-pagination-custom, .banner .swiper-pagination-fraction {
    bottom: var(--swiper-pagination-bottom, 120px);
    top: var(--swiper-pagination-top, auto);
    left: 0;
    width: 33%;
}
.banner .swiper-pagination-bullet {
    width: var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,60px));
    height: var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,3px));
    display: inline-block;
    border-radius: var(--swiper-pagination-bullet-border-radius,0);
    background: var(--swiper-pagination-bullet-inactive-color,#8c8f8f);
    opacity: var(--swiper-pagination-bullet-inactive-opacity, .2);
}
.banner .swiper-pagination-bullet-active {
    opacity: var(--swiper-pagination-bullet-opacity, 1);
    background:  #e4001c;
}

.banner .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .banner .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 10px var(--swiper-pagination-bullet-horizontal-gap,4px);
}


/*index*/
.ip1{
  padding: 85px 0;
}
.ip1 .title{
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 200px;
}
.ip1 .title h2{
  font-size: var(--font-size-xxl);
  font-family:"EnterGrid" ;
}
.ip1 .title .list{
  position: relative;
}
.ip1 .info{
  padding-top: 60px;
}


.app_page{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    grid-gap: 40px;
    width: 100%;
    position: relative;    

}
.app_page::after{
    content: "";
    position: absolute;
    width: 100%;
    height: 4px;
    background: #e6e6e6;
    top: 104px;
    border-radius: 2px;
    left: 0;
}
.app_page  .swiper-pagination-bullet{
    width: auto;
    height: auto;
    border-radius: 0;
    background: none;
    border: 1px solid #fff;
    border-bottom: none;
    opacity: 1;
    padding: 0;
}
.app_page  .swiper-pagination-bullet:first-child{
    border-left: none;
}
.app_page  .swiper-pagination-bullet:last-child{
    border-right: none;
}
.app_page  .img{
    padding: 0 20px;
    position: relative;
    text-align: center;
    display: flex;
    justify-content: center;
    border-right:none;
    padding-bottom: 25px;
    
}
.app_page  .img::after{
  content: "";
  position: absolute;
  width: 0px;
  height: 4px;
  background: #e4001c;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  transition: all 0.3s ease;
}
.app_page .img .img_border{
    border: 5px solid #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 82px;
    width:82px;
    transition: all 0.3s ease;
    border: 1px solid #999;
    border-radius: 41px;

}


.app_page  .img img{
  filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
  -webkit-filter: grayscale(100%); /* 针对旧版WebKit浏览器 */
  filter: grayscale(100%); /* 现代浏览器 */
}
.app_page  .txt{
    color: #b3b3b3;
    text-align:  center

}
.app_page  .txt p{
    font-size: 14px;
    line-height: 22px;
    font-weight: bold;
    text-transform: uppercase;
    padding-top: 20px;
}
.app_page .swiper-pagination-bullet-active{
    /* background-color: #e4001c;
    position: relative; */
    justify-content: center;
}
.app_page  .swiper-pagination-bullet-active .img::after{
  
  width: 88px;
  
}
.app_page .swiper-pagination-bullet-active .img .img_border{
    background-color: #e4001c;
    border: 1px solid #e4001c;
}

.app_page .swiper-pagination-bullet-active .txt{
    text-align: center;
    padding-left: 0;
    display: block;
}
.app_page .swiper-pagination-bullet-active .txt p{
    font-size: 16px;
    color: #e4001c;
}


.application .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .application .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{
    margin: 0;
}
.application .swiper-horizontal>.swiper-pagination-bullets, .application .swiper-pagination-bullets.swiper-pagination-horizontal, .application .swiper-pagination-custom, .application .swiper-pagination-fraction{
    bottom:0;
}

.img1{
  background: url(/static/images/ip1_icon1.png) center center no-repeat;
}
.img2{
  background: url(/static/images/ip1_icon2.png) center center no-repeat;
}
.img3{
  background: url(/static/images/ip1_icon3.png) center center no-repeat;
}

.app_page .swiper-pagination-bullet-active .img1{
  background: url(/static/images/ip1_icon1_active.png) center center no-repeat;
}
.app_page .swiper-pagination-bullet-active .img2{
  background: url(/static/images/ip1_icon2_active.png) center center no-repeat;
}   
.app_page .swiper-pagination-bullet-active .img3{     
  background: url(/static/images/ip1_icon3_active.png) center center no-repeat;  
}


.ip1 .info .swiper-slide{
  display: grid;
  grid-template-columns: 40% 60%;
  
}
.ip1 .info .swiper-slide img{
  max-width: 100%;
}
.ip1 .info .txt{
  background-color: #e4e9ee;
  padding: 50px 100px 50px 60px;
}
.ip1 .info .ip1_logo{
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  padding-bottom:70px ;
}
.ip1 .info .ip1_logo img{
  padding-right: 25px;
}
.ip1 .info .ip1_logo h3{
  font-size:  var(--font-size-lxx);
  font-weight: normal;
  color: #333;
}
.ip1 .info .txt b{
  font-size: var(--font-size-sm);
  padding-bottom: 30px;
  display: block;
  color: #4d4d4d;
  line-height: 32px;
  text-transform: uppercase;
}
.ip1 .info .txt p{
  font-size: var(--font-size-xs);
  color: #808080;
  line-height: 24px;
  padding-bottom: 20px;
}
.ip1 .info .txt a{
  margin-top: 40px;
}
a.idx_btn{
  font-size: var(--font-size-sm);
  color: #fff;
  padding: 15px 60px 15px 30px;
  background-color: #e4001c;
  border-radius: 6px;
  display: inline-block;
  font-family: "TT0857M";
  position: relative;
  text-align: left;
  transition: all 0.3s ease;
  width: 200px;
}
a.idx_btn:after{
  content: "\e642";
  font-family: "iconfont" !important;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  z-index: 2;
  transition: all 0.3s ease;
  font-size: 24px;
}
a.idx_btn:hover{
  padding: 15px 60px 15px 35px;
}
/* a.idx_btn:hover:after{
  right: 25px;
} */
.pp1{
  background: url(/static/images/ip1_img1.jpg) center center no-repeat;
  background-size: cover;
}
.pp2{
  background: url(/static/images/ip1_img2.jpg) center center no-repeat;
  background-size: cover;
}
.pp3{
  background: url(/static/images/ip1_img3.jpg) center center no-repeat;
  background-size: cover;
}



.ip2{
  position: relative;
  background: url(/static/images/ip2_bg.jpg) center center no-repeat;
  background-size: cover;
  padding: 120px 0;
}

.infos{
  width: 100%;
}
.ip2 h3{
  font-size: var(--font-size-xxl);
  font-family:"EnterGrid" ;
  padding-bottom: 40px;;
}
.ip2 p{
  font-size: var(--font-size-lg);
  padding-bottom: 55px;
}
.ip2 .img{
  margin-top: 50px;
}

.ip2 .map_info{
  position: absolute;
  top: 50%;
  left: calc((100% - 1600px) / 2);
  transform: translate(0,-50%);
  z-index: 10;
  
}
.maps img{
  width: 100%;
} 
.maps p{
  font-size: 18px;
  text-align: center;
  line-height: 40px;
  padding-bottom: 20px;
}

.ip2 .map{
  position: relative;
  z-index: 9;
}
.ip2 .map .item{
  position: absolute;
  
  z-index: 9999;
  width: 10px;
  height: 10px;
  background-color: #e4001c;
  border-radius: 50%;
  cursor: pointer;
}
.ip2 .map .item::after{
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 16px;
  height: 16px;
  border: 1px solid #e4001c;
  border-radius: 50%;
  display: none;
}

.ip2 .map .map_tit{
  position: absolute;
  left:25px;
  top: 50%;
  transform: translateY(-50%);
  height: 30px;
  line-height: 30px;
  padding:0 15px;
  background-color: #e4001c;
  display: none;
  
}

.ip2 .map .map_tit:before{
		content:"";
		position:absolute;
		top: 50%;
    transform: translateY(-50%);
	  left: -8px;
    border-bottom: 8px solid transparent;
	  border-top: 8px solid transparent;
	  border-right:8px solid #e4001c;
	
	}

.ip2 .map .item.cur::after,.ip2 .map .item:hover::after,.ip2 .map .item.cur .map_tit{
  display: block;
  
}
.ip2 .map .map_tit p{
  font-size: 14px;
  color: #fff;
  white-space: nowrap;
}

.item01{
  right: 28.5%;
    top: 47.6%;
}
.item02{
  right: 28.5%;
    top: 53.7%;
}
.item03{
  right: 28.5%;
    top: 52.2%;
  
}
.item04{
  right: 29.85%;
    top: 50.8%;
}
.item05{
  right: 29.85%;
    top: 56.8%;
}
.item06{
  right: 31.2%;
    top: 52.3%;
}
.item07{
  right: 31.2%;
    top: 56.8%;
}


.ip3{
  background-color: #1a1a1a;
  padding: 85px 0;
}

.app_page2{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    grid-gap: 40px;
    max-width: 920px;
    position: relative;  
    margin: 0 auto;

}

.app_page2  .swiper-pagination-bullet{
    width: auto;
    height: auto;
    border-radius: 0;
    opacity: 1;
    padding: 0;
    background-color: #1a1a1a;
}

.app_page2  .img{
    padding: 0 20px;
    position: relative;
    text-align: center;
    display: flex;
    justify-content: center;
    border-right:none;
    padding-bottom: 25px;
    
}
.app_page2  .img::after{
  content: "";
  position: absolute;
  width: 0px;
  height: 4px;
  background: #e4001c;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  transition: all 0.3s ease;
}
.app_page2 .img .img_border{
    border: 5px solid #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 82px;
    width:82px;
    transition: all 0.3s ease;
    border: 1px solid #999;
    border-radius: 41px;

}


.app_page2  .txt{
    color: #fff;
    text-align: center;

}
.app_page2  .txt a{
    font-size:var(--font-size-lg);
    line-height: 30px;
    padding-top: 20px;
    padding-bottom: 15px;
    color: #fff;
    position: relative;
    display: inline-block;
}
.app_page2  .txt a::after{
    content: "";
    position: absolute; 
    width: 0px;
    height: 1px;
    background: #e4001c;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    transition: all 0.3s ease;
}
.app_page2 .swiper-pagination-bullet-active{
    background-color: #1a1a1a;
    position: relative; 
    justify-content:center;
}


.app_page2 .swiper-pagination-bullet-active .txt{
    
    padding-left: 0;
    display: block;
}
/* .app_page2 .swiper-pagination-bullet-active .txt a{
    border-bottom: 1px solid #e4001c;
} */
.app_page2 .swiper-pagination-bullet-active .txt a::after{
  width: 100%;
}

.ip3 .list{
  padding-top: 45px;
  padding: 0 10%;
}
.ip3 .title{
  padding-bottom: 100px;;
}
.ip3 .swiper-slide{
  display: grid;
  grid-template-columns: 1fr auto;
  grid-gap: 40px;
  align-items: center;
  color: #fff;
  
}

.ip3 .list h3{
  font-size: var(--font-size-xxl);
  font-family:"EnterGrid" ;
  padding-bottom: 65px;
  padding-left: 4px;
  line-height: 1.3em;
}
.ip3 .list p{
  font-size: var(--font-size-lg);
  padding-bottom: 30px;
}

.ip4{
  background-color: #e4e9ee;
  padding: 85px 0;
}

.ip4 .list{
  padding-top: 45px;
}
.ip4 .swiper-slide{
  display: grid;
  grid-template-columns: 1fr auto;
  grid-gap: 80px;
  align-items: center;
  color: #000;
  direction: rtl;
  padding: 100px 0;
}

.ip4 .swiper-slide img{
  max-width: 100%;
}
.ip4 .list .txt{
  padding-right: calc((100vw - 1600px)/2 + 70px);
  text-align: right;


}
.ip4 .list h3{
  font-size: var(--font-size-xxl);
  font-family:"EnterGrid" ;
  padding-bottom: 65px;;
}
.ip4 .list p{
  font-size: var(--font-size-lg);
  padding-bottom: 30px;
}
.ip4 .app_page2{
  max-width: 1100px;
  grid-template-columns: auto auto auto;
  align-items: center;
}
.ip4 .app_page2 .swiper-pagination-bullet{
  background-color: #e4e9ee;
  color: #000;
}
.ip4 .app_page2 .swiper-pagination-bullet-active{
  background-color: #e4e9ee;
}
.ip4 .app_page2 .txt a{
  color: #000;
}


.ip5{
  padding: 85px 0;
}
.ip5 .title{
  display: grid;
  grid-template-columns: 1fr auto;
  grid-gap: 40px;
  align-items: center;
  color: #000;
  padding-bottom: 50px;
}

.ip5 .title h3{
  font-size: var(--font-size-xxl);
  font-family:"EnterGrid" ;
}
.ip5 .info img{
  max-width: 100%;
}
.ip5 .info time{
  margin: 40px 0 25px 0;
  background-color: #e4001c;
  color: #fff;
  font-size: 14px;
  border-radius: 5px;
  display: inline-block;
  padding: 5px 15px;
}
.ip5 .info h4{
  font-size: var(--font-size-lxx);
  font-weight: bold;
  color: #000;
  padding-bottom: 20px;

}
.ip5 .info p{
  font-size: 16px;
  color: #999;
  line-height: 24px;
  
}
.ip5 .list{
  margin-top: 80px;
}
.ip5 .list .swiper-slide{
  padding: 10px;
}
.ip5 .list .swiper-slide a{
  background-color: #fff;
  display: block;
  padding: 15px 15px 40px 15px;
}
.ip5 .list .swiper-slide img{
  width: 100%;
}
.ip5 .list time{
  font-size: 16px;
  color: #e4001c;
  margin: 30px 0 10px 0;
  display: block;
}
.ip5 .list p{
  font-size: 20px;
  color: #000;
  line-height: 30px;
  font-weight: bold;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  height: 90px;

}
.ip5 .list .swiper-slide-active a,.ip5 .list .swiper-slide a:hover{
  box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
}


/*内页*/


.inside h2{
  font-size: var(--font-size-xxl);
  font-family: "EnterGrid";
  
}

.inside .title{
  text-align: center;
  padding-bottom: 50px;
}

/*通用*/


.banners .warp{
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  height: 100%;
}
.banners .warp .tit{
  width: 50%;
}
.banners .tit p{
  font-size: var(--font-size-lg);
  color: #fff;
  padding-bottom: 20px;

}

.banners .tit h2{
  color: #fff;
  padding-bottom: 12px;
  padding-left: 2px;
  font-size: var(--font-size-xxxl);
}
.banners .tit h2 b{
  font-size: 1em;
  font-family: "EnterGrid";
  color: var(--secondary-color);
}
.banners .tit h3{
  color: #000;
  padding-bottom:20px;
  padding-left: 2px;
  font-size: var(--font-size-xxl);
  font-family: "EnterGrid";
  line-height:1.3em ;
}
.productshow1 .tit p{
  font-size: var(--font-size-x);
  color: #4d4d4d;
}



.about{ background: url(/static/images/banners/banner-about.jpg) center center no-repeat;}
.product1{ background: url(/static/images/banners/banner-product.jpg) center center no-repeat;}
.product2{ background: url(/static/images/banners/banner-product2.jpg) center center no-repeat;}

.productshow2{ background: url(/static/images/product/productshow02.jpg) center center no-repeat;}
.news{ background: url(/static/images/banners/banner-news.jpg) center center no-repeat;}
.service{ background: url(/static/images/banners/banner-service.jpg) center center no-repeat;}
.contact{ background: url(/static/images/banners/banner-contact.jpg) center center no-repeat;}
.banners,.banners2{ 
    background-size: cover;   
    overflow:hidden;
    position:relative;
    height:720px;
    
}
.productshow1{ background: url(/static/images/product/productshow01.jpg) center center no-repeat;height: 935px;background-size: cover;}

.pro .tit p{
  color: #4d4d4d;
}

.pro .tit h2{
  color: #000; 
}


.ab1{
  padding: 110px 0;
  background-color: #f3f6f8;
}
.ab1 h2{
  color: #000;
}
.ab1_list{
  box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
  margin-top: 70px;
}
.ab1_list .item{
  display: grid;
  grid-template-columns: 50% 50%;
  grid-gap: 0px;
  background-color: #fff;
}
.ab1_list .item:nth-child(2){
  direction: rtl; 
}
.ab1_list .item:nth-child(1) .info{
  background: url(/static/images/about/ab1_item_bg1.jpg) right bottom no-repeat #fff;
}
.ab1_list .item:nth-child(2) .info{
  background: url(/static/images/about/ab1_item_bg2.jpg) right bottom no-repeat #e4e9ee;
  text-align: end;
}

.ab1_list .item:nth-child(2) .ip1_logo{
  display: block;
}
.ab1_list .item:nth-child(3) .info{
  background: url(/static/images/about/ab1_item_bg3.jpg) right bottom no-repeat #e4e9ee;
}

.ab1_list .info{
  padding: 60px 100px 60px 60px;
}
.ab1_list .info .ip1_logo{
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  padding-bottom:70px ;
}
.ab1_list .info .ip1_logo img{
  padding-right: 25px;
}
.ab1_list .info .ip1_logo h3{
  font-size:  var(--font-size-lxx);
  font-weight: normal;
  color: #333;
}
.ab1_list .info b{
  font-size: var(--font-size-md);
  padding-bottom: 20px;
  display: block;
  color: #4d4d4d;
  line-height: 32px;
  text-transform: uppercase;
}
.ab1_list .info p{
  font-size: var(--font-size-xs);
  color: #808080;
  line-height: 24px;
  padding-bottom: 60px;
}

.ab1_img1{
  background: url(/static/images/about/ab1_img1.jpg) center center no-repeat;
  background-size: cover;
}
.ab1_img2{
  background: url(/static/images/about/ab1_img2.jpg) center center no-repeat;
  background-size: cover;
}
.ab1_img3{
  background: url(/static/images/about/ab1_img3.jpg) center center no-repeat;
  background-size: cover;
}

.ab2{
  background: url(/static/images/about/ab2_bg.jpg) center center no-repeat;
  background-size: cover;
  padding: 120px 0;
}
.ab2 h2{
  color: #fff;
}

/*时间轴*/

.mob_btn{
  display: none;
}
.timeline_btn{
  position: relative;
  height: 100px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mob_btn .time_btn{
  position: relative;
  margin: 0 15px;
}
.mob_btn .time_btn.swiper-button-prev,.mob_btn .time_btn.swiper-button-next{
  top: 0;
}
.time-line-box {
 padding-top: 40px;
}
.time_swiper{
  padding: 0 96px;
  position: relative;
  background: url(/static/images/about/line2.png) repeat-x left center;
}
/* .time-line-box:after {
  content: '';
  background: url(/static/images/about/line2.png) repeat-x left bottom;
  height: 57px;
  width: 1000%;
  position: absolute;
  left: 0;
  z-index: 1;
  top: 50%;
} */
.time-line-box ul li {
  float: left;
  width: 211px;
  position: relative;
  padding-top: 0;
  padding-bottom: 0;
  z-index: 2;
  height: 300px;
  margin-bottom: 300px;
}
.time-line-box ul li:before {
  content: '';
  height: 100%;
  border-left: #fff 2px solid;
  position: absolute;
  top: 0px;
  left: 4px;
}
.time-line-box ul li dl {
  padding-left: 35px;
}
.time-line-box ul li dl dt {
  font-size: var(--font-size-xl);
  color: #fff;
  font-weight: bold;
  position: relative;
  margin-bottom: 10px;
}
.time-line-box ul li:after {
  content: '';
  width: 10px;
  height: 10px;
  border-radius: 100%;
  background: #fff;
  position: absolute;
  left: 0px;
  bottom: -4px;
}
.time-line-box ul li dl dd {
  color: #fff;
  font-size: 14px;
  line-height: 1.8;
  position: relative;
}
/* .time-line-box ul li dl dd:after {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 100%;
  background: #2DA891;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -3px;
} */

.time-line-box ul li:nth-child(2n) {
  margin-bottom: 0;
  margin-top: 300px;
  display: grid;
  align-items: end;

}
.time-line-box ul li:nth-child(2n):before {
  top: auto;
  bottom: 0px;
  height: 100%;
  z-index: 2;
}
.time-line-box ul li:nth-child(2n):after {
  top: -4px;
}

.time-line-box ul li:nth-child(2n) .layui-text {
  /* position: absolute;
  left: 0;
  bottom: 10px; */
}
.time-line-box ul .item-this:after {
  border-left: #2DA891 2px solid;
}
.time-line-box ul .item-this .layui-text {
  border-left: #2DA891 2px solid !important;
}

.time_btn{
  width: 64px;
  height: 64px;
  background-color: #f00;
}
.time_btn.swiper-button-next{
  right:0;
  color: #fff;
  top: calc(50% - 10px);
}
.time_btn.swiper-button-prev{
  left: 0;
  color: #fff;
  top: calc(50% - 10px);
}
.time_btn.swiper-button-prev:after,.time_btn.swiper-button-next:after{
  font-size: 30px;
}


.time-line-box li.swiper-slide-active:before{
  border-color: #e4001c;
}
.time-line-box li.swiper-slide-active::after{
  background-color: #e4001c;
}
.time-line-box li.swiper-slide-active dt{
  color: #e4001c;
}

.time-line-box .swiper-button-next.swiper-button-disabled, .time-line-box .swiper-button-prev.swiper-button-disabled {
    opacity: 1;
    cursor: auto;
    pointer-events: none;
}


.ab3{
  background: url(/static/images/about/ab3_bg.jpg) center center no-repeat;
  background-size: cover;
  padding: 120px 0;
}
.ab3 .warp{
  max-width: 1400px;
}
.ab3_icon{
  display: flex;
  justify-content: center;
}
.ab3_list{
  display: grid;
  grid-template-columns: repeat(3,1fr);
  grid-gap: 60px;
}
.ab3_list .item{
  background-color: #e5eaef;
  padding: 90px 60px;
  border-radius: 10px;
}
.ab3_list .item .img{
  width: 120px;
  height: 120px;
  background-color: #ffffff;
  border-radius: 60px;
  position: relative;
  margin-bottom: 50px;
}
.ab3_list .item .img:after{
  position: absolute;
  content: '';
  width: 132px;
  height:132px;
  border-radius: 66px;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  border: 1px solid #808080;
}

.ab3_list .item h3{
  font-size: var(--font-size-lxx);
  font-weight: bold;
  color: #000;
  padding-bottom: 55px;
  margin-bottom: 55px;
  width: 100%;
  text-align: center;
  border-bottom: 1px solid #4d4d4d;
}
.ab3_list .item p{
  font-size: var(--font-size-xs);
  color: #808080;
  line-height: 24px;
  width: 100%;
  text-align: center;
}

.ab3_list .item:hover{
  box-shadow: 0 0 10px rgba(0,0,0,0.5);
  background-color: #fff;
}
.ab3_list .item:hover .img{
  background-color: #000;
}
.ab3_list .item:hover .img:after{
  border: 1px solid #000;
}
.ab3_list .item:hover h3{
  color: #e4001c;
}



.ab3_img1{
  background: url(/static/images/about/ab3_img1.png) center center no-repeat;
}
.ab3_img2{
  background: url(/static/images/about/ab3_img2.png) center center no-repeat;
}
.ab3_img3{
  background: url(/static/images/about/ab3_img3.png) center center no-repeat;
}

.ab3_list .item:hover .ab3_img1{
  background: url(/static/images/about/ab3_img1_h.png) center center no-repeat #000;
}
.ab3_list .item:hover .ab3_img2{
  background: url(/static/images/about/ab3_img2_h.png) center center no-repeat #000;
}
.ab3_list .item:hover .ab3_img3{
  background: url(/static/images/about/ab3_img3_h.png) center center no-repeat #000;
}

.ab3_txt{
  padding: 35px 15% 0 15%;
  
}
.ab3_txt p{
  font-size: var(--font-size-xs);
  text-align: center;
  line-height: 24px;
}

/*about-lusunny*/
.ab_list{
  border-bottom: 1px solid #c6c6c6;
}
.ab_list .warp{
  text-align: center;
  
}
.ab_list .warp a{
  display: inline-block;
  line-height: 70px;
  height: 70px;
  font-size: var(--font-size-sm);
  color: #000;
  position: relative;
  margin: 0 60px;
  padding: 0 15px;
  text-transform: uppercase;
  
}
.ab_list .warp a::after{
  content: '';
  width:0;
  height: 1px;
  background-color: #e4001c;
  position: absolute;
  left: 0;
  bottom: -1px;
  transition:ease 0.5s all;-moz-transition: ease 0.5s all; -webkit-transition:ease 0.5s all; -o-transition: ease 0.5s all;
}
.ab_list .warp a.cur,.ab_list .warp a:hover{
  color: #e4001c;
}
.ab_list .warp a.cur::after,.ab_list .warp a:hover::after{
  width: 100%;
}

.ab_tip{
  background-color: #f5f8fa;
  padding: 30px 0;
}
.ab_tip .warp>*{
  font-size: var(--font-size-xs);
  font-style: normal;
  display: inline-block;
}
.ab_tip .warp a:hover{
  text-decoration: underline;
}
.ab_tip .warp i{
  padding: 0 8px;
}

.ab_info{
  padding: 90px 0 300px 0;
}
.ab_info .warp{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.ab_info .warp>*{
  width: 100%;
}
.info_head{
  text-align: center;
}
.ab_logo{
  display: flex;
  justify-content:  center;
  align-items: center;
  flex-wrap: wrap;
  padding-bottom: 45px;
}
.ab_logo img{
  padding-right: 30px;
}
.ab_logo h3{
  font-size: var(--font-size-x);
  font-weight: normal;
  color: #333333;
}

.ab_info{
  background: url(/static/images/about/ab_lusunny_bg.jpg) center bottom no-repeat #fff;
}
.ab_info .warp{
  max-width: 1500px;
}
.ab_info .company{
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 60px;
  padding-top: 100px;
}
.about3 .company{
  display: initial;
}
.ab_info .company .txt{
  padding: 50px  100px 0 40px;
}
.about3 .company .txt{
  padding: 0 40px 0 0;
}
.company2 .txt{
  padding: 0;
}
.about3 .img{
  float: left;
  margin-right: 80px;
  margin-bottom: 40px;
}

.ab_info .company .txt h4{
  font-size: var(--font-size-xx);
  font-weight: bold;
  color: #e4001c;
  padding-bottom: 40px;
  line-height: 1.3em;
}
.ab_info .company .txt p{
  font-size: var(--font-size-sm);
  color: #1a1a1a;
  line-height: 32px;
}
.about3 .company .txt p{
  padding-bottom: 15px;
}
.ab_info .company .txt h4:nth-child(3){
  padding-top: 70px;
}


/*product*/
.product{
  padding: 95px 0;
}
.product h3{
  text-align: center;
  padding-bottom: 60px;
  font-size: var(--font-size-xxl);
  text-transform: uppercase;
}
.pro_list a{
  display: inline-block;
  margin-right: 45px;
  line-height: 45px;
  font-size: var(--font-size-sm);
  position: relative;
  color: #808080;
  text-transform: uppercase;
}
.pro_list a::after{
  content: '';
  width: 0;
  height: 1px;
  background-color: #e4001c;
  position: absolute;
  left: 0;
  bottom: -1px;
  transition:ease 0.5s all;-moz-transition: ease 0.5s all; -webkit-transition:ease 0.5s all; -o-transition: ease 0.5s all;
}
.pro_list a:hover,.pro_list a.cur{
  color: #e4001c;
}
.pro_list a.cur::after,.pro_list a:hover::after{
  width: 100%;
}
.pro_box{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 45px;
  padding: 40px 0 ;
  margin-bottom: 20px;
}

.pro_box .img{
  background: linear-gradient(to bottom, #f6f6f6 0%, #e6e6e6 60%,#e6e6e6 100%);
  border-radius: 30px;
  padding: 20px 0;
  text-align: center;
}
.pro_box  p{
  text-align: center;
  line-height: 30px;
  font-size: var(--font-size-sm);
  padding-top: 25px;
}


/*productshow*/
.proshow1{
  padding: 110px 0;
}
.proshow1 .warp{
  text-align: center;
}
.proshow1 h4,.proshow2 h4{
  font-size: var(--font-size-xxll);
  text-align: center;
  font-family: "EnterGrid";
  line-height: 1.3em;
  padding-bottom: 40px;
}
.proshow1 h4{
  width: 50%;
  margin: 0 auto;

}
.proshow1 .img{
  text-align: center;
}
.proshow1 .colors{
  text-align: center;
  padding-top: 60px;
}
.proshow1 .colors .dot{
  width: 24px;
  height: 24px;
  border-radius:12px;
  display: inline-block;
  margin: 0 20px;
  border: 1px solid #ccc;
  position: relative;
  cursor: pointer;
}
.proshow1 .colors .dot::before{
  content: '';
  width: 24px;
  height: 24px;
  border-radius: 10px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  transition:ease 0.5s all;-moz-transition: ease 0.5s all; -webkit-transition:ease 0.5s all; -o-transition: ease 0.5s all;
}
.proshow1 .colors .dot::after{
  content: '';
  width: 34px;
  height:0px;
  border-radius: 15px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: #ccc;
  z-index:-1;
  transition:ease 0.5s all;-moz-transition: ease 0.5s all; -webkit-transition:ease 0.5s all; -o-transition: ease 0.5s all;
}
.proshow1 .colors .cur:after,.proshow1 .colors .dot:hover:after{
  width: 34px;
  height:64px;
}

.proshow2{
  background-color: #f3f9fc;
  padding: 100px 0;
}
.proshow2 .memo_bg{
  padding: 75px;
  background-color: #fff;
}
.proshow2 .memo{
  overflow: auto;
}
.proshow2 .memo table{
  width: 100%;
  min-width: 700px;
  

}
.proshow2 .memo table td{
  text-align: center;
  padding: 10px 0;
  font-size: var(--font-size-sm);
  color: #000;
  border-top: 1px solid #9f9f9f;
  border-bottom: 1px solid #9f9f9f;
  height: 74px;
  vertical-align: middle;
}
.proshow2 .memo table td span{
  
  font-size: var(--font-size-sm);
  color: #000;
}
.proshow2 .memo table td:nth-child(2n-1){
  width: 20%;
  text-align: left;
  padding-left: 20px;
  font-weight: bold;
}
.proshow2 .memo table td:nth-child(3){
  padding-left: 50px;
  position: relative;
}
.proshow2 .memo table td:nth-child(3)::before{
  content: '';
  width: 1px;  
  height: 40px;   
  background-color: #9f9f9f;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
}
.proshow2 .memo table td:nth-child(2n){
  width: 30%;
}
.detail{
  padding-left: 20px;
  padding-top: 25px;
  border-bottom: 1px solid #9f9f9f;
  padding-bottom: 70px;
}
.detail b{
  font-size: var(--font-size-sm);
  color: #000;
  padding-bottom: 25px;
  display: block;
  
}
.detail p{
  font-size: var(--font-size-sm);
  color: #000;
  line-height: 36px;
}

.memo_para{
  display: grid;
  grid-template-columns: 20% auto 20% auto;
  align-items: center;
}
.memo_para .dot{
  position: relative;
  text-align: left;
  padding: 10px 0;
  font-size: var(--font-size-sm);
  color: #000;
  border-top: 1px solid #9f9f9f;
  border-bottom: 1px solid #9f9f9f;
  height: 74px;
  line-height: 54px;
}
.memo_para .dot:nth-child(2n-1){
  font-weight: bold;
  padding-left: 30px;
}

.memo_para .dot:nth-child(3)::before{
  content: '';
  width: 1px;  
  height: 40px;   
  background-color: #9f9f9f;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
}

/*news*/

.news_list{
  padding: 120px 0;
  background-color: #f6f6f6;
}
.news_list h2{
  text-align: center;
}
.top_news{
  padding-top: 100px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 35px;
}

.top_news .img{ 
  overflow: hidden; 
}
.top_news .img img{
  width: 100%;
  transition: ease 0.5s all;
  -moz-transition: ease 0.5s all;
  -webkit-transition: ease 0.5s all;
  -o-transition: ease 0.5s all;
}
.top_news .box{
  padding: 35px 40px;
  background-color: #fff;
}
.top_news .box p{
  font-size: var(--font-size-sm);
  color: #000;
  line-height: 24px;
  font-weight: bold;
}
.date{
  display: flex;
  justify-content: space-between;
  padding-top: 30px;
}
.date time,.date i{
  font-size: 12px;
  font-style: normal;
  position: relative;
}
.date i{
  padding-right: 20px;
}
.date i::after{
  content: "\e642";
  font-family: "iconfont" !important;
  position: absolute;
  top: 50%;
  right: 0px;
  transform: translateY(-50%);
  z-index: 2;
  font-size: 18px;
}
.top_news a:hover img{
  transform: scale(1.1);
}
.top_news a:hover .box{
  background-color: #e4001c;
}
.top_news a:hover  .box p{
  color: #fff;
}
.top_news a:hover .box .date time,.top_news a:hover .box .date i{
  color: #fff;
}
.top_news a:hover .box .date i::after{
  color: #fff;
}

.new_box{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 35px;
  padding-top: 35px;
  padding-bottom: 50px;
}
.new_box .img{
  overflow: hidden;
}
.new_box img{
  width: 100%;
  transition: ease 0.5s all;
  -moz-transition: ease 0.5s all;
  -webkit-transition: ease 0.5s all;
  -o-transition: ease 0.5s all;
}
.new_box .info{
  padding: 30px 20px;
  background-color: #fff;
}
.new_box .info p{
  font-size: var(--font-size-sm);
  color: #000;
  line-height: 24px;
  font-weight: bold;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 100px;
  height: 72px;
}

.new_box a:hover img{
  transform: scale(1.1);
}
.new_box a:hover .info{
  background-color: #e4001c;
}
.new_box a:hover .info p{
  color: #fff;
}
.new_box a:hover .info .date time,.new_box a:hover .info .date i{
  color: #fff;
}
.new_box a:hover .info .date i::after{
  color: #fff;
}


/*newsshow*/
.newsshow{ padding:50px 0 120px 0;background:#f6f6f6;}
.newsshow .boxs{ background:#fff; }

.newsshow .tit{ padding:40px; text-align:center;}
.newsshow .tit h3{ font-size:2em; color:#333333;  line-height:24px; margin-bottom:20px;}
.newsshow .tit .dot{ background:#666; padding:0 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.newsshow .tit .dot h4{ color:#fff; font-size:1.4em; display:inline-block; padding:14px 15px;}
.newsshow .txt{ padding:20px 40px; line-height:24px; color:#666666; }
.newsshow .txt *{ font-size:14px; line-height:24px;}
.newsshow .txt p{ font-size:14px; text-indent:0em;}
.newsshow .txt img{ max-width:100%; margin:0 auto; padding:0px 0;}
.newsshow .btn{ padding:40px;}
.newsshow .btn a{ display:block; background:#fff; font-size:1.4em; color:#333333; line-height:24px; padding:12px 20px; margin-top:10px;}
.newsshow .btn a:hover{ background:#e4001c !important; color:#fff !important;}



.serv_1{
  padding: 100px 0;
}
.serv_1 h2{
  text-align: center;
  padding-bottom: 70px;
}
.video_list{
  display: grid;
  grid-template-columns:70% 30%;
  gap: 15px;
}
.video_right{
  max-height: 600px;
  overflow-y: auto;
  padding-right: 30px;
}

.video_right::-webkit-scrollbar {
  width:3px; /* 滚动条宽度 */
}
 
.video_right::-webkit-scrollbar-track {
  background: url(/static/images/service/line.jpg) center top repeat-y;
}
.video_right::-webkit-scrollbar-thumb {
  background: #f00; /* 滑块颜色 */
  border-radius: 5px;
} 
.video_right::-webkit-scrollbar-thumb:hover {
  background: #555; /* 滑块悬停颜色 */
}

.video_img{
  position: relative;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 600px;
}
.video_img img{
  width: 100%;
}
.video_img .tit{
  position: absolute;
  left: 0;
  bottom: 0;
  padding: 40px 70px;
  display: grid;
  grid-template-columns: auto 100px;
  gap: 60px;
  width: 100%;
}
.video_img .tit h5{
  font-size: var(--font-size-lxx);
  color: #fff;
  line-height: 24px;
  font-weight: bold;
  padding-bottom: 20px;
}
.video_img .tit p{
  font-size: 16px;
  color: #fff;
  line-height: 24px;
}

.video_img .tit .play{
  display: flex;
  align-items: center;
  justify-content: center;
  
}

.video_right .item{
  position: relative;
  margin-bottom: 15px;
  border: 1px solid #fff;
}
.video_right .item img{
  width: 100%;
}
.video_right .item .txt{
  position: absolute;
  left: 0;
  bottom: 0;
  padding: 20px;
  color: #fff;
  width: 60%;
}
.video_right .item .txt p{
  font-size: 14px;
  line-height: 24px;
  white-space:initial ;
}
.video_right .item:hover,.video_right .item.cur{
  border: 1px solid #e4001c;
}

.serv_2{
  background-color: #eaedf2;
  padding: 80px 0;
}
.serv_2 h2{
  text-align: center;
  padding-bottom: 30px;
}


.serv_2 .panel-header:after,.serv_2 .panel-header:before,.serv_2 .panel-header{transition:ease .5s all;-moz-transition: ease .5s all; -webkit-transition:ease .5s all; -o-transition: ease .5s all;}
.serv_2{ padding:80px 0}
.serv_2 .panel { margin: 30px 0 60px 0;  }
.serv_2 .panel-header h3{  color: #000; font-size: var(--font-size-md);  display: block; position: relative; font-weight: normal; line-height: 1.3em;}
.serv_2 .panel-header{ 
  position: relative;  
  background: #fff; 
  margin-top:20px;
  display: grid;
  align-items: center;
  grid-template-columns: auto 1fr;
  gap: 0;
  padding: 10px 0;
}
.serv_2 .panel-header i{
  font-size: var(--font-size-sm);
  color: #e4001c;
  border-right: 1px solid #f2f2f2;
  display: block;
  font-style: normal;
  padding: 20px 25px 20px 30px;
  position: relative;
  margin-right: 25px;
}
.serv_2 .panel-header i:after{
  position: absolute;
  content: "";
  right: -2px;
  top: 50%;
  width: 3px;
  height: 23px;
  transform: translateY(-50%);
  background: #e4001c;
}
.serv_2 .panel-header:after{ position: absolute;content: "";right: 20px;top: 31px; width: 15px; height: 2px;background: #000;}
.serv_2 .panel-header:before{position: absolute;content: "";right: 26px;top: 25px; width: 2px; height: 15px;background: #000;}
.serv_2 .panel-body{ padding:30px 65px 60px 65px; border-top:1px solid #f2f2f2;; background-color:#fff }
.serv_2 .panel-body { display:none;}
.serv_2 .panel-body h4{font-size: 1.8em; font-weight: bold; color: #333; padding-bottom: 20px}
.serv_2 .panel-body p{ color:#333; font-size:1.6em; line-height:30px;}
.serv_2 .panel-body .tq{text-indent: 1em}
.serv_2 .panel-body p b{font-weight: bold; font-size: 1em}
.serv_2 .panel-header.titls:after,.serv_2 .panel-header.titls:before{top: 31px;width: 15px; height: 2px;right: 20px;}
.serv_2 .panel-header.titls h3:after{  opacity: 1;}


.serv_3{
  padding: 110px 0;
  background: url(/static/images/service/ser3_bg.jpg) center top no-repeat;
  background-size: cover;
}
.serv_3 h2{
  text-align: center;
}
.serv_3_box{
  padding-top: 110px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 30px;
}
.serv_3 .serv_3_left a{
  font-size:  var( --font-size-md);
  color: #fff;
  line-height: 24px;
  font-weight: bold;
  padding:35px  95px 35px 35px;
  background: url(/static/images/service/download_icon.png) center right 20px no-repeat #000;
  display: block;
  margin-bottom:1px;
}
.serv_3 .serv_3_left a:hover,
.serv_3 .serv_3_left a.cur{
  background-color: #e4001c;
}


.serv_3_right{
  overflow-x: auto;
}
 
.serv_list .item{
  padding: 20px;
  background-color: #f2f2f2;
  box-shadow: 4px 4px 5px 0 rgba(0, 0, 0, .1);
}
.serv_list .item .img{
  padding-bottom: 20px;
}
.serv_list .item .img img{
  width: 100%;
}
.serv_list .item .txt{
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: flex-end;
  
}
.serv_list .item .txt p{
  color: #4d4d4d;
  font-size: 14px;
}


.download{
  padding-bottom: 80px;
}

.download .swiper-horizontal>.swiper-scrollbar, .download .swiper-scrollbar.swiper-scrollbar-horizontal{
  background: url(/static/images/service/serv_3_line.jpg) left center repeat-x;
}
.download .swiper-scrollbar-drag{
  background: #f00; 
}


/*联系我们*/
.con_1{
  background-color: #f1f5f8;
  padding: 100px 0;
}
.con_1 h2{
  text-align: center;
  padding-bottom: 80px;
}
.add_box{
  display: grid;
  grid-template-columns: 35% 65% ;
  gap: 0;

}
.add_box .img{
  background: url(/static/images/contact/map.jpg) center center no-repeat;
  background-size: cover;
}
.add_box .info{
  background-color: #fff;
  padding: 55px;
}
.add_box .info h5{
  font-size: var(--font-size-lxx);
  text-transform: uppercase;
  padding-bottom: 60px;
}
.add_box .info h6{
  font-size: 18px;
  color: #e4001c;
  font-weight: bold;
  padding-bottom: 30px;
}
.add_box .info p{
  font-size: 14px;
  line-height: 28px;
}
.add_box .info p b{
  font-size: 14px;
  font-weight: bold;
}

.con_2{
  background-color: #000;
  padding: 150px 0;
}
.con_list{
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 30px;
  align-items: center;

}
.con_list .item{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  position: relative;
  padding: 75px 0;
  background:
          linear-gradient(to left, #9a9a9a, #9a9a9a) left top no-repeat,
          linear-gradient(to bottom, #9a9a9a, #9a9a9a) left top no-repeat,
          linear-gradient(to left, #9a9a9a, #9a9a9a) right top no-repeat,
          linear-gradient(to bottom, #9a9a9a, #9a9a9a) right top no-repeat,
          linear-gradient(to left,  #9a9a9a, #9a9a9a) left bottom no-repeat,
          linear-gradient(to bottom, #9a9a9a, #9a9a9a) left bottom no-repeat,
          linear-gradient(to left, #9a9a9a, #9a9a9a) right bottom no-repeat,
          linear-gradient(to left,  #9a9a9a, #9a9a9a) right bottom no-repeat;
        background-size:
          2px 60px,
          60px 2px,
          2px 60px,
          60px 2px;

}



.con_list .img{
  width: 110px;
  height: 110px;
  border-radius: 50%;
  background-color: #333;
  position: relative;

}

.con_list .img:after{
  position: absolute;
  content: '';
  width: 122px;
  height:122px;
  border-radius: 50%;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  border: 1px solid #333;
}


.con_2_img1{
  background: url(/static/images/contact/con_2_img1.png) center center no-repeat;
}
.con_2_img2{
  background: url(/static/images/contact/con_2_img2.png) center center no-repeat;
}
.con_2_img3{
  background: url(/static/images/contact/con_2_img3.png) center center no-repeat;
}
.con_list .info{
  width: 100%;
  text-align: center;
  padding-top: 45px;
}
.con_list .info b{
  color: #fff;
  font-size: 30px;
  padding-bottom: 20px;
  display: block;
}
.con_list .info p{
  font-size: 14px;
  line-height: 24px;
  color: #999;
}



.con_list .item:hover{  
  background:
          linear-gradient(to left, #e4001c, #e4001c) left top no-repeat,
          linear-gradient(to bottom, #e4001c, #e4001c) left top no-repeat,
          linear-gradient(to left, #e4001c, #e4001c) right top no-repeat,
          linear-gradient(to bottom, #e4001c, #e4001c) right top no-repeat,
          linear-gradient(to left,  #e4001c, #e4001c) left bottom no-repeat,
          linear-gradient(to bottom, #e4001c, #e4001c) left bottom no-repeat,
          linear-gradient(to left, #e4001c, #e4001c) right bottom no-repeat,
          linear-gradient(to left,  #e4001c, #e4001c) right bottom no-repeat;
          background-size:
          2px 60px,
          60px 2px,
          2px 60px,
          60px 2px;
}

.con_list .item:hover .img{
  background-color: #e4001c;

}
.con_list .item:hover .img:after{
  border: 1px solid #e4001c;
}
.con_list .item:hover .info b{
  color: #e4001c;
}
.con_list .item:hover .info p{
  color: #e4001c;
}

.con_3{
  background: url(/static/images/contact/con_3_bg.jpg) center center no-repeat;
  background-size: cover;
  padding: 150px 0;
}
.con_3 h2{
  text-align: center;
}
.con_3 .con_form{
  background-color: #f3f3f3;
  padding: 60px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px;
  margin-top: 60px;
}

.con_3 .item{
  position: relative;
}
.con_3 .item::after{
  content: '';
  position: absolute;
  top: 50%; 
  left: 40px;  
  transform: translate(-50%,-50%);  
  width: 30px;
  height: 30px;
}
.con_3 .con_form input{
  border: none;
  outline: 0;
  background-color: #d4d4d4;
  height: 64px;
  line-height: 64px;
  width: 100%;
  padding-left: 72px;
  font-size: 16px;
  color: #4d4d4d;
  position: relative;

}

.pers:after{
  background: url(/static/images/contact/con_form_icon1.png) center center no-repeat;
}
.phone:after{
  background: url(/static/images/contact/con_form_icon2.png) center center no-repeat;
}
.email:after{
  background: url(/static/images/contact/con_form_icon3.png) center  center no-repeat;
}
.con_3 .item.txt::after{
  top: 18px; 
  left: 25px; 
  transform: none; 
  background: url(/static/images/contact/con_form_icon4.png) center  center no-repeat;
}
.con_3 .item textarea{
  width: 100%;
  border: none;
  outline: 0;
  background-color: #d4d4d4;
  height: 200px;
  font-size: 16px;
  color: #4d4d4d;
  padding: 20px 25px 25px 72px;
  font-family: 'Microsoft Yahei';
}
.con_3 .txt,.con_3 .btn{
  width: 100%;
  grid-column: 1 / span 3;
}

.con_3 .btn{
  text-align: center;
  padding-top: 40px;
}
.con_3 .item button{
  width: 250px;
  height: 50px;
  line-height: 50px;
  background-color: #e4001c;
  font-size: 16px;
  border: none;
  outline: 0;
  color: #fff;
  text-transform: uppercase;
  border-radius: 10px;
}