body{  font-size: 16px;   }
.inner{ width: 80%; margin: 0 auto;}
header{ width: 100%; height: 90px; padding-left: 10%; width: 100%; position: fixed; top: 0; left: 0; z-index: 100; background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);} 
.banner{ margin-top: 90px;}
.banner img{ width: 100%; height: calc(100vh -  90px); object-fit: cover;}
.banBtn{ position: absolute; left: 10%; bottom: 15%; z-index: 20;}
.banBtn>div{ border: 1px solid #c3c3c3; color: #c3c3c3; width: 60px; height: 60px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.banBtn>div span{ font-size: 24px;}
.banBtn>div:hover{ color: #fff; border-color: #bd171b; background-color: #bd171b;}

.circleH i:before { content: ''; position: absolute; left: 0; top: 0;  border: 1px solid #bd171b; width: 100%;height: 100%;  border-radius: 50%;  opacity: 0}
.circleH i:after {content: '';position: absolute; left: 0;top: 0;border: 1px solid #bd171b; width: 100%; height: 100%; border-radius: 50%;opacity: 0}
.circleH:hover i:before { animation: serv_one_border .9s 0s ease 1;  }
.circleH:hover i:after { animation: serv_one_border 1.5s 0s ease 1; -webkit-animation: serv_one_border 1.5s 0s ease 1; }

nav{ width: 50vw;}
nav a:hover,nav a.on{ color: #bd171b;}
.searchBtn{ width:120px; height: 90px;}.searchBtn span{ font-size: 22px;}.searchBtn:hover{ color: #bd171b;}
.menuBtn {padding:30px 20px; width:90px; height: 90px;   align-items: flex-end; z-index: 6;}
.menuBtn .burger{ width: 100%;  height: 1px ; background: #fff;  transition: .8s; display:inline-block;       }
.menuBtn .burger:first-child{ animation: long 2s linear infinite;  }
.menuBtn .burger:nth-of-type(2){  width: 50%;}
.menuBtn .burger:nth-of-type(3){ animation: long 3s linear infinite; -webkit-animation: long 3s linear infinite; }
.menuBtn.close{align-items: center; justify-content: center;}
.menuBtn.close .burger:first-child{ display: none;}
.menuBtn.close .burger:nth-of-type(3){ display: none;}
.menuBtn.close .burger:nth-of-type(2) {    position: relative;    z-index: 1; width: 80%;}
.menuBtn.close .burger:nth-of-type(2):before, .menuBtn.close .burger:nth-of-type(2):after {      content: '';          position: absolute;      top: 0;      left: 0;      width: 100%;      height: 100%;      background: #fff;      opacity: 0;      z-index: 1;}
.menuBtn.close .burger:nth-of-type(2) {    background: transparent;    transform: rotate(-180deg); }
.menuBtn.close .burger:nth-of-type(2):before, .menuBtn.close .burger:nth-of-type(2):after {      opacity: 1;      transition: all .3s; }
.menuBtn.close .burger:nth-of-type(2):before {     transform: rotate(45deg); }   .menuBtn.close .burger:nth-of-type(2):after {     transform: rotate(-45deg); }

.indexAbout .indexAboutimg{ width: 27.5%;}
.indexAbout  .indexAboutimg img{ width: 100%; height: 100%; object-fit: cover;}
.indexAbout .txt { width: 72.5%;}
.indexAbout .txt .top{ margin-left:10vw; padding-top: 100px;}
.indexAbout .txt .top .videoImg{ width: 40%; height: 290px; overflow: hidden; border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; }
.indexAbout .txt .top .videoImg img{width: 100%; height: 100%; object-fit: cover;  }
.indexAbout .txt .top .videoImg  .playBtn{position: absolute;top: 50%;left: 50%;z-index: 5;width: 75px;height: 75px;border-radius: 50%;background-color: rgba(255, 255, 255, 0.5);-webkit-border-radius: 50%;-moz-border-radius: 50%;-ms-border-radius: 50%;-o-border-radius: 50%;transform: translate(-50%,-50%); box-shadow: 0 0 rgba(255, 255, 255, 0.1),0 0 0 15px rgba(255, 255, 255, 0.1),0 0 0 30px rgba(255, 255, 255, 0.1);animation: ripple-wave1 1s linear infinite;animation-play-state: running;opacity: 1;visibility: visible;-webkit-animation: ripple-wave1 1s linear infinite; 
}
.indexAbout .txt .top .videoImg:hover{ border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; }
.indexAbout .txt .top .right{ width: 56%; }
.abouMOre .yuan{ width: 80px; height: 80px; border-radius: 50%; background-color: #444; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.abouMOre .yuan .iconfont{ color: #fff; font-size: 30px;}
.s1_logo{ width: 62%; position: absolute; bottom: 0; left: 0;}
.indexAbout .txt .bottom{  padding-left: 10vw;}
.indexAbout .txt .bottom li{ width: 33.3%; color: #fff;}
.indexAbout .txt .bottom li span.j{  position: relative;  padding-right: 20px; }
.indexAbout .txt .bottom li span.j::after{ display: block; content: '+'; position: absolute; top: 0 ; right: 0;  font-size: 20px; }

.abouMOre:hover{ color: #bd171b;}
.abouMOre:hover .yuan{ background-color: #bd171b; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); }
.ptb-70{ padding: 70px 0;}
.indexPro{ background: url(../images/indexProBg.jpg) no-repeat center center; background-size: cover;}

.border{ border: 1px solid #e5e5e5;}
.indexTit a.more{  width: 268px; height: 65px;  }.indexTit a.more span{ position: relative; z-index: 5;}
.indexTit a.more::after{ width: 0; height: 100%;  position: absolute; z-index: 1; left: 0; top: 0; background-color: #bd171b; display: block; content: ''; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.indexTit a.more:hover::after{ width: 100%;}.indexTit a.more:hover{ color: #fff;}

.indexPro .left{  width: 31%; }
.indexPro .left .item{ padding-bottom: 30px; display: none;}
 
.indexPro .left a{ margin-left: 12px; width: 320px; height: 68px; border-radius: 37px; -webkit-border-radius: 37px; -moz-border-radius: 37px; -ms-border-radius: 37px; -o-border-radius: 37px;
background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
.indexPro .left a span{ position: absolute;  z-index: 2; right: 0; bottom: 0; width: 68px; height: 68px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; -webkit-transform:; -moz-transform:; -ms-transform:; -o-transform:; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.indexPro .left a span i{ font-size: 30px;} 
.indexPro .left a em{ position: relative ; z-index:10;}
.indexPro .left a:hover span{ width: 100%; height: 100%; border-radius: 37px; -webkit-border-radius: 37px; -moz-border-radius: 37px; -ms-border-radius: 37px; -o-border-radius: 37px; }
.indexPro .left a:hover em{ color: #fff;}.indexPro .left a:hover span i{ opacity: 0;}
.indexPro .center{  width: 37.3%;}
.indexPro .center .quan{     width: 85.6%;  height: 85.6%;  position: absolute;  top: 0;  left: 0;  bottom: 0;  right: 0;  margin: auto;}
.indexPro .center .quan .line {	position: absolute;	width: 100%;	left: 0;	top: 0;	transition: all 1s;}
.indexPro .center .quan .t .on{ color: #000;}
.indexPro .center .quan .t  span {  width: 40px;  height: 40px;  display: block;  font-size: 16px;  line-height: 40px;  text-align: center;  color: #999;  position: absolute;  font-family: GILB;  cursor: pointer;}
.indexPro .center .quan .t span:nth-child(1) {  left: 50%;  top: -32px;  transform: translateX(-50%);}
.indexPro .center .quan .t span:nth-child(2) {  top: 50%;  right: -34px;  transform: translateY(-50%);}
.indexPro .center .quan .t span:nth-child(3) {  left: 50%;  bottom: -32px;  transform: translateX(-50%);}
.indexPro .center .quan .t span:nth-child(4) {  top: 50%;  left: -34px;  transform: translateY(-50%);}
.indexPro .center .pic {  width:80%;  height: 0;  padding-bottom: 80%;  position: absolute;  top: 0;  left: 0;  bottom: 0;  right: 0;  margin: auto;}
.indexPro  .center .pic .img {  width: 100%;  height: 100%;  position: absolute;  overflow: hidden;  border-radius: 100%;  top: 0;  left: 0;  display: none;}
.indexPro  .right{ line-height: 4;  align-items: flex-end; }
.indexPro  .right a{ position: relative;}
.indexPro  .right a::before{ position: absolute; content: ''; left: 0; width: 0; transition: all .36s; top: 50%; height: 3px; margin-top: -2px; background-color: #bd171b; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.indexPro  .right a.on::before{   width: 24px;  }
.indexPro  .right a.on{ padding-left: 42px; font-weight: bold; color: #bd171b;}
.application  .img img{ display: none;}.application  .img img.on{ display: block;}
.application ul{ position: absolute; top: 0; left: 0;  }
.application ul li{ width: 25%; padding: 0 3%; border-right: 1px solid rgba(255, 255, 255, 0.2); position: relative;}
.application ul li::after{ width: 100% ; z-index: 5; height: 0; position: absolute; bottom: 0; left: 0; display: block; content: ''; background-color: rgba(0, 0, 0, 0.3); transition: all .5s; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; -o-transition: all .5s; }
.application ul li .line{ width: 20% ; height: 3px; }
.application ul li  a{ border: 1px solid #fff; padding: 12px 50px; position: relative;}
.application ul li  a em{ position: relative; z-index: 5;}
.application ul li  a:hover em{ color: #fff;}
.application ul li>div,.application ul li>a{ position: relative; z-index: 10; }
.application ul li  a::after{ position: absolute; top: 0; left: 0; display: block; content: ''; width: 0; height: 100%; transition: all .36s; background-color: #bd171b; transition:all .36s ; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.application ul li  a:hover::after{ width: 100%;}
.application ul li  .noe{ display: none; animation: righTOP .3s; -webkit-animation: righTOP .3s; }
.application ul li:hover .noe{ display: block;}
.application ul li:hover::after{ height: 100%;}
.application .img img{ min-height: 730px; width: 100%; object-fit: cover;
	transition: all .36s;
	animation: scaleIn 2s forwards cubic-bezier(0.4, 0, 0.49, 0.93);
	-webkit-animation: scaleIn 2s forwards cubic-bezier(0.4, 0, 0.49, 0.93);
}
.indexNews .swiper-slide a .icon{ border: 1px solid #333; width: 35px; height: 35px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.indexNews .swiper-slide a .icon span{ font-size: 20px; color: #333;}
.pic::before {content: "";width: 100%;height: 100%;position: absolute;z-index: 1;left: 0px;}
a:hover .pic::before { animation: gradient-rectangle 1s ; animation-delay: 0s; -webkit-animation-timing-function: cubic-bezier(0, 0, 0.18, 0.96); -webkit-animation: gradient-rectangle 1s ; }
 
.indexNews .swiper-slide a:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }
.indexNews .swiper-slide a:hover .icon{ background-color: #bd171b; border-color: #bd171b; transform: translateX(-20px) rotate(45deg); -webkit-transform: translateX(-20px) rotate(45deg); -moz-transform: translateX(-20px) rotate(45deg); -ms-transform: translateX(-20px) rotate(45deg); -o-transform: translateX(-20px) rotate(45deg); }.indexNews .swiper-slide a:hover .icon span{ color: #fff;}

footer{ background-color: #333; color: #fff;}
footer .top{ border-bottom: 1px solid rgba(255, 255, 255, 0.1);}
footer .top  .right{ width: 31%;}
.footform .input{ background-color: rgba(255, 255, 255, 0.1); width: 77%;}
.footform .submit{ width: 23%;}
footer .center .left{ width: 61%;}
footer .center .left dt{ margin-bottom: 15px;}
 
footer .center .left dd a{ font-size: 14px; opacity: 0.6;}footer .center .left dd a:hover{ opacity: 1;}
footer .center .right{ width: 31%; border-left: 1px solid rgba(255, 255, 255, 0.1);}
footer .center .right .f14{ margin-top: 15px;}
footer .bottom{ border-top: 1px solid rgba(255, 255, 255, 0.1); padding: 25px 0; color: rgba(255, 255, 255, 0.6); }
footer .bottom a:hover{ color: #fff;}

.select{ border: 1px solid rgba(255, 255, 255, 0.2); color:rgba(255, 255, 255, 0.6);  width: 312px; padding: 15px;}
.null-txt {color:rgba(255, 255, 255, 0.6); width: 100%; background-color: #333;}
.select::after {
    content: "";
    position: absolute;
    top: 23px;
    right: 25px;
    width: 0;
    height: 0;
    border-top: 6px solid #999;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    opacity: .6;
}
 

.navs__pop {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(189,23,27, 0.9);
	z-index: 5;
	overflow: hidden;
	height: 0;
	transition: 1s cubic-bezier(0.77, 0, 0.175, 1);
	-webkit-transition: 1s cubic-bezier(0.77, 0, 0.175, 1);
	-moz-transition: 1s cubic-bezier(0.77, 0, 0.175, 1);
	-ms-transition: 1s cubic-bezier(0.77, 0, 0.175, 1);
	-o-transition: 1s cubic-bezier(0.77, 0, 0.175, 1);
}
  .navs__pop.show {
	height: 100%;
  }
  .navs__menu-wrap {
	position: relative;
	height: 100vh;

  }
  .Circles {
	position: absolute;
	overflow: hidden;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	pointer-events: none !important;
	z-index: 0;
  }
  .Circles-circle {
	display: block;
	position: absolute;
	will-change: transform;
	transition: 1.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  }
  .Circles-circle:nth-child(1) {
	width: 21.87vw;
	height: 21.87vw;
	top: -7.26vw;
	left: -7.26vw;
  }
  .Circles-circle:nth-child(1) .Circles-dot {
	opacity: 0.05;
  }
  .Circles-circle:nth-child(2) {
	width: 35vw;
	height: 35vw;
	top: -11.7vw;
	left: -11.7vw;
	transition: 2.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  }
  .Circles-circle:nth-child(2) .Circles-dot {
	opacity: 0.04;
  }
  .Circles-circle:nth-child(3) {
	width: 48vw;
	height: 48vw;
	top: -16vw;
	left: -16vw;
	transition: 2.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  }
  .Circles-circle:nth-child(3) .Circles-dot {
	opacity: 0.03;
  }
  .Circles-circle:nth-child(4) {
	width: 63.4vw;
	height: 63.4vw;
	top: -21.1vw;
	left: -21.1vw;
	transition: 3.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  }
  .Circles-circle:nth-child(4) .Circles-dot {
	opacity: 0.02;
  }
  .Circles-circle:nth-child(5) {
	width: 92vw;
	height: 92vw;
	top: -30.7vw;
	left: -30.7vw;
	transition: 3.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  }
  .Circles-circle:nth-child(5) .Circles-dot {
	opacity: 0.02;
  }
  .Circles-dot {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
  }
  .Circles-dot:after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #f2f2f2;
	border-radius: 50%;
	transition: transform 1.2s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.6s;
	will-change: transform;
  }
  .navs__menus {
	position: absolute;
	left: 0;
	top: 0;
	 
	width: 100%;  height: 100%;
  }
  .navs__logos {
	text-align: center;
  }
  .navs__logos img {
	display: block;
	width: 233px;
	margin: auto;
  }
  .navs__li {
	margin-top: 90px;
	display: flex;
	display: -webkit-flex;
	justify-content: center;
	-webkit-justify-content: center;
  } 
  .navs__li .left  .navs__item{  white-space: nowrap; }
  .navs__li .left dt { margin-bottom: 10px;}
 .navs__li .left dt a{ color: #fff;  }
 .navs__li .left dd{ color: rgba(255, 255, 255, 0.6); font-size: 14px;}
 .navs__li .left dd a:hover{ color: #fff;}

 

.page-aside {
	position: fixed;
	right: -6px;
	bottom: 180px;
	transform: translateX(100%);
	z-index: 6;
	opacity: 0;
	transition: transform .3s, opacity .3s
}

.page-aside.show {
	transform: translateX(0);
	opacity: 1
}

.page-aside .img {
	max-width: 100%
}

.page-aside-item {
	width: 54px;
	text-align: center;
	height: 50px;
	position: relative;
	z-index: 1;
	cursor: pointer;
	display: block;
	background-color: rgba(0, 0, 0, .5);
	margin: 4px 0;
	border-top-left-radius: 6px;
	border-bottom-left-radius: 6px;
	padding-right: 6px;
	transition: transform .3s;
	display: flex;
	align-items: center;
	justify-content: center
}

.page-aside-item .icon {
	width: 24px
}

#toolbar{ position: fixed; bottom: 0; left: 0; width: 100%; z-index: 90; display: none;}
#toolbar a {
    width: 25%;
   padding: 10px 0;
    text-align: center;
   color: #fff; display: flex; align-items: center; justify-content: center; flex-direction: column;
}
#toolbar img{ height: 20px; margin-bottom:5px;}


div.video-play{position:fixed;top:0;bottom:0;right:0;left:0;width:100vw;height:100vh;z-index:10001;display:none}
div.video-bg{position:absolute;top:0;bottom:0;width:100%;z-index:1001;background:#0b0b0b;opacity:.8}
div.video-wrap{z-index:1002;position:fixed;top:52%;left:50%;-webkit-transform:translate3d(-50%, -52%, 0);transform:translate3d(-50%, -52%, 0);width:1000px;height:570px;  }

div.video-wrap video{width:100%;height:auto}
div.close-btn{cursor: pointer; transition: all .36s;
 
 text-align: center;
 line-height: 40px;
 z-index: 9999;
 position: absolute;
 background: #000;
 border: 2px solid #fff;
 width: 50px;
 height: 50px;
 border-radius: 50%; opacity: 0.5;
 right: -20px;
 top: -25px;}
 div.close-btn:hover{ transform: rotate(180deg); opacity: 1;}

 .neiBan{ margin-top: 90px;}
 .neiBan .txt{ position: absolute; top: 0; left: 0;}
 .neiBan .txt>div{animation: topFloat 1.2s;}

 .submenu,.promenu{ box-shadow: 0 0 10px rgba(0, 0, 0, .15);}
 .submenu a{  flex: 1; border-right: 1px solid #e5e5e5; line-height: 80px;}
 .submenu a.on, .promenu a.on{ color: #fff; background: #bd171b;}
 .submenu a.on:hover,.promenu a.on:hover{ color: #fff;}
 .submenu a:hover, .promenu a:hover{ color: #bd171b;}
.promenu a{ flex: 1;border-right: 1px solid #e5e5e5; line-height: 80px;}

 .aboutOne{ background: url(../images/bg1.jpg) no-repeat center bottom; background-size: 100% auto;}
 .Companyprofile{ width: 80%; opacity: 0.1;}

 .aboutOne .con .left{ padding-left: 10vw; width: 43vw;}
 .aboutOne .con .left img{ width: 100%; height: 100%; object-fit: cover;}
 .aboutOne .con .right{ width: 57vw; }
 .logoBig{  width: 40%;  margin-left: auto ; margin-right: auto;}
 .aboutOne .con .right .top { padding-right: 10vw;}
 .aboutOne .con .right .top .info{  width: 68%; margin: 0 auto;}
 .aboutOne .con .right .bottom li span.j{  position: relative;  padding-right: 20px; }
 .aboutOne .con .right .bottom  li span.j::after{ display: block; content: '+'; position: absolute; top: 0 ; right: 0;  font-size: 20px; }
 .aboutOne .needMarquee{ font-size: 200px; width: 10vw; position: absolute; top: 0;  right: 0; height: 100%; color: #f6f6f6;  z-index: 10; overflow: hidden;}

 .Culture li{ width: 50%; height: 50%; border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5;}
 .Culture li  div{ position: relative; z-index: 5; }
 .Culture li::after{ width: 110%; height: 110%; position: absolute; top: -5%; left: -5%; z-index: 1; background-color: #bd171b; display: block; content: ''; transition:all .42s ; opacity: 0; transform: scale(0.5); -webkit-transform: scale(0.5); -moz-transform: scale(0.5); -ms-transform: scale(0.5); -o-transform: scale(0.5); -webkit-transition:all .42s ; -moz-transition:all .42s ; -ms-transition:all .42s ; -o-transition:all .42s ;
 box-shadow: 0 0 10px rgba(0, 0, 0, .15);}
.Culture li:hover::after{ opacity: 1; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); }
.Culture li:hover div{ color: #fff;}
.Culture .img img{ width: 100%; height: 100%; object-fit: cover;}
.enlarge{ position: absolute; bottom: 20px; right: 20px;}
.honor .swiper-slide{ border: 1px solid #e5e5e5;  cursor: pointer; }
.honor .swiper-slide .img{ height: 390px; border-bottom: 1px solid #e5e5e5; padding: 35px;}
.honor .swiper-slide .txt span{ position: relative; z-index: 5;}
.honor .swiper-slide .txt::after{ width: 100%; height: 2px; z-index: 1; background: #bd171b; position: absolute; left: 0; bottom: 0; content: ''; display: block; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.honor .swiper-slide:hover{ color: #fff;}
.honor .swiper-slide:hover .txt::after{ height: 100%;}

.honorBtn>div{ border: 1px solid #c3c3c3; color: #c3c3c3; width: 60px; height: 60px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.honorBtn>div span{ font-size: 24px;}
.honorBtn>div:hover{ color: #fff; border-color: #bd171b; background-color: #bd171b;}
.honor .swiper-slide .img img{ max-width: 100%; max-height: 100%;}

.researchOne{ padding-top: 150px; background: url(../images/bg2.png) no-repeat left bottom; background-size: 18% auto;}
.researchOne .txt{ width: 44%;} 
.researchOne .con{  width: 508px; height: 508px; position: absolute; top: 53px; left: 53px;  }
.researchOne  .right{ width: 614px; height: 614px;}.researchOne  .img{ display: none;}
.researchOne svg {
	 
	display: block;
}
.researchOne .tu {
	position: absolute;
	top: 0;
	offset-path: path('M252.500,2.500 C390.571,2.500 502.500,114.429 502.500,252.500 C502.500,390.571 390.571,502.500 252.500,502.500 C114.429,502.500 2.500,390.571 2.500,252.500 C2.500,114.429 114.429,2.500 252.500,2.500 Z');
	offset-distance: 0%; z-index: 2;
}
.researchOne .right::before{ content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; border-radius: 50%;
	border: 2px solid rgba(189,23,27, 0.1);
	-webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.researchOne .right.aos-animate .tu {
	animation: red-ball 10s linear infinite;
	-webkit-animation: red-ball 10s linear infinite;
}

.researchOne .right.aos-animate .tu1 {
	animation-delay: 0;
}

.researchOne .right.aos-animate .tu2 {
	animation-delay: 3.3s;
}

.researchOne .right.aos-animate .tu3 {
	animation-delay: 6.6s;
}

.smallyuan{ width: 60%; height: 60%; position: absolute; top: 20%; left: 20%; border: 9px solid rgba(189,23,27, 0.1); border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.teamImg{ width: 100%;}

 
#patentSwiper .swiper-slide{ opacity: 0.6;}
#patentSwiper .swiper-slide.swiper-slide-active{ opacity: 1;}
#patentSwiper .swiper-slide .f20{ margin-top: 50px; opacity: 0;}
#patentSwiper .swiper-slide.swiper-slide-active .f20{  opacity: 1;}

.patentBtnbox{ position: absolute; bottom: 40px;  width: 40%; left:30%; z-index: 10;}
.patentBtn{ cursor: pointer; width: 50px; height: 50px; border-radius: 50%; border: 1px solid #bd171b; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.patentBtn:hover{ background-color: #bd171b; }
.patentBtn:hover .color-red{color: #fff;}

.history .top{ background: url(../images/bg3.jpg) no-repeat center center; background-size: cover; height: 440px;}
.history .top .line{ width: 100%; height: 9px; background-color: #273c50; position: absolute; bottom: 0;  right: 0;}
.history .top .right{ width: 46%; position: absolute; left: 50%; bottom: -15px; overflow: hidden;} 
#yearSwiper .swiper-slide  { opacity: 0.6;  padding-bottom: 60px; text-align: center; position: relative; cursor: pointer;}
#yearSwiper .swiper-slide.swiper-slide-thumb-active  { opacity: 1;}
#yearSwiper .swiper-slide.swiper-slide-thumb-active::after{
 content: '';
 display: block;
 width: 30px;
 height:30px;
 background: url(../images/bg4.png) no-repeat center center;
 background-size: 100% 100%;
 position: absolute;
 bottom:0;
 left: 50%;
 transform: translateX(-50%) ;
 -webkit-transform: translateX(-50%) ;
 -moz-transform: translateX(-50%) ;
 -ms-transform: translateX(-50%) ;
 -o-transform: translateX(-50%) ;
}
.history .bottom .swiper-slide .left{ width: 26%;}
.history .bottom .swiper-slide .right{ width:74% ; border-left: 1px solid #e5e5e5;}
.history .bottom .swiper-slide .right p{ background: url(../images/bg5.png) no-repeat left center; padding-left: 50px; margin-left: -8px; line-height: 3;}

.developmenthistory{ opacity: 0.1;}
.submenuShow{ height: 54px; font-size: 16px;}
.submenuShow.active span{ transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); }

.prolist h2{ font-family: messapia-bold; transition:all .36s ; color: transparent; -webkit-text-stroke: 1.2px #aaa; font-size: 140px; -webkit-transition:all .36s ; -moz-transition:all .36s ; -ms-transition:all .36s ; -o-transition:all .36s ; }
.prolist li{ position: relative; background-color: #eceff1;} .prolist li:nth-child(2n){ background-color: #fff;}
.prolist li::after{ width: 0; height: 2px; transition: all .5s; background-color: #bd171b; display: block; content: ''; position: absolute; bottom: 0; left: 0; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; -o-transition: all .5s;
}
.prolist li:nth-child(2n) .dis-flex-between-center{ flex-direction: row-reverse;}
.prolist li .txt span{  overflow: hidden; width: 180px; height: 50px; border-radius: 25px;   position: relative; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; -o-border-radius: 25px; }
.prolist li .txt span i{ position: relative;  z-index: 5;}
.prolist li .txt span:hover{ box-shadow: 0 0 10px rgba(189,23,27, 0.6);}
.prolist li:hover h2{-webkit-text-stroke: 1.2px #bd171b;}
.prolist li:hover::after{  width: 100%;}
.light{ position: absolute; left: -100%; top: 0; width: 100%; height: 100%; transform: skewx(-25deg);
	background-image: -webkit-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.5),rgba(255,255,255,0));}
.light-tri:hover .light{ left: 100%; transition: 1s;}
.shadow{ box-shadow: 0 0 10px rgba(0, 0, 0, .15);}
.proInfoTop{ padding-top: 110px; margin-top: 90px;}
.backBtn{ justify-content: flex-end;}
.proInfoToplink a{ border: 2px solid #bd171b;  white-space: nowrap;}
.proInfoTop .txt .info{ min-height: 240px;}
.proInfoTop .img{ background-color: #e9e9e9;}
 
.proInfoBot .title span{   padding: 15px 25px;  }
.guangsec {
	overflow: hidden;
	width: 100%;
	position: relative;
	height: 670px; 
  }
 
  .gsecbg {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
  }
  .gsecbg .cover {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 0;
	width: 100%;
	height: 100%;
	background-image: -webkit-gradient(linear, left top, right top, from(rgba(5, 34, 69, 0.5)), to(rgba(16, 124, 201, 0)));
	background-image: linear-gradient(to right, rgba(5, 34, 69, 0.5), rgba(16, 124, 201, 0));
  }
  .gsecbg canvas {
	-o-object-fit: cover;
	   object-fit: cover;
	-o-object-position: center;
	   object-position: center;
  }
  .disn{ display: none;}
  .guangsec .txt{  position: absolute; top: 80px; left: 70px; z-index: 5;}
  .guangsec .txt .more{ border: 1px solid #fff; width: 220px; height: 65px;}
  .guangsec .txt .more:hover{ background-color: #bd171b; border-color: #bd171b; box-shadow: 0 0 10px rgba(189,23,27, 0.6);}
.newslist  li a .icon{ border: 1px solid #333; width: 35px; height: 35px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.newslist li a .icon span{ font-size: 20px; color: #333;}
.newslist  li .img img{ height: 358px; object-fit: cover; width: 100%;}
.newslist li:hover a .img img{ transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }
.newslist li:hover a .icon{ background-color: #bd171b; border-color: #bd171b; transform: translateX(-20px) rotate(45deg); -webkit-transform: translateX(-20px) rotate(45deg); -moz-transform: translateX(-20px) rotate(45deg); -ms-transform: translateX(-20px) rotate(45deg); -o-transform: translateX(-20px) rotate(45deg); }.indexNews .swiper-slide a:hover .icon span{ color: #fff;}
.newslist li:hover{ transform: translateY(-10px); -webkit-transform: translatey(-10px); -moz-transform: translatey(-10px); -ms-transform: translatey(-10px); -o-transform: translatey(-10px); }
.newslist  li{ width: 32%; margin-right:2%;}.newslist  li:nth-child(3n){ margin-right: 0;}

.newsleft{ width: 66%;}
.newsright{ width: 27%;}
.newspage{ border-top: 1px solid #e5e5e5; }
.newspage a{ color:#888; width: 40%; }  .newspage a:nth-child(2){ width:20%}
  .newspage a:hover{ color:#bd171b}

.tjTit{ border-left: 4px solid #bd171b; padding-left: 30px;  line-height: 1;}
.idea{ padding: 100px  65px 180px ; background: url(../images/bg6.jpg) no-repeat center center; background-size: cover;align-items: flex-end;    background-attachment: fixed; position: relative;}
.idea .line{ width: 30px; height: 3px;}
.flUl li{ width: 48.5%; box-shadow:  0 0 15px rgba(189,23,27, 0.2);  position: relative; padding: 25px;}
.flUl li .line{width: 30px; height: 3px; line-height: 1;}
.flUl li .ENG{ color: rgba(189,23,27, 0.05); font-size: 100px;}
.flUl li>div{ position: relative; z-index: 5;}
.flUl li::after{ width: 100%; height: 0; display: block; content: ''; position: absolute; bottom: 0; left: 0; z-index: 2; background-color: #bd171b; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.flUl li:hover::after{ height: 100%;}
.flUl li:hover{ color: #fff;}.flUl li:hover .line{  background-color: #fff;}.flUl li:hover .ENG{ color: #fff;}
.flUlbot{ background-color: #f8e7e8;}
.policy{background: url(../images/bg7.jpg) no-repeat center center; background-size: cover;align-items: flex-end;    background-attachment: fixed; position: relative;
}
.policy li{ flex: 1; border-right: 1px solid rgba(255, 255, 255, 0.2);  height: 600px;}

.jobBox{ width: 90%; margin:  0 auto; border: 1px solid #e5e5e5; border-bottom: none;}
.jobBox .top { border-bottom: 1px solid #e5e5e5;}
.jobBox .top div{  width: 19%;}
.jobBox .top div:nth-child(1){ width: 24%;}
.jobBox .top .border{  transition: all .36s;border-color: #aaaaaa; color: #aaaaaa; padding: 6px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.jobBox .bottom .dis-flex-between { align-items: flex-start;}
.jobBox .bottom .left .tit{ width:200px; white-space: nowrap;}
.jobBox .bottom .left { width: 60%;}
.jobBox .bottom .left .con{ width: calc(100% - 200px);}
.jobBox .bottom a{ display: inline-flex; border-radius: 25px; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; -o-border-radius: 25px; }
.jobBox li .bottom{ display: none;}
 
.jobBox li{ transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s;background-color: #fff; }
.jobBox li:hover{ box-shadow: 0 0 10px rgba(0, 0, 0, .15); transform: scale(1.1);  -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }
.jobBox li:hover .bottom{ display: block; }
.jobBox li:hover .top .border{ border-color: #bd171b; color: #bd171b; transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); }
.jobBox li .applybtn:hover{ box-shadow: 0 0 15px rgba(189,23,27, 0.2);}

.popbox{position: fixed; top: 0; left: 0; z-index: 99999;background:rgba(0, 0, 0, 0.5) none repeat scroll 0 0 !important;filter:Alpha(opacity=50); background:#000; width: 100%; height: 100%; }



.popup{ position: fixed; top: 0; left: 0; z-index: 99999;background:rgba(0, 0, 0, 0.5) none repeat scroll 0 0 !important;filter:Alpha(opacity=50); background:#000; width: 100%; height: 100%; display: none; font-size: 16px;}
.popup-table-type{ display: table;  text-align: center; width: 100%; height: 100%;}
.popup-table-cell{ display: table-cell; vertical-align: middle; height: 100%; width: 100%;}
.popup-container{ box-shadow: 0 0 10px 10px rgba(0,0,0,0.11);width: 90%; max-width: 1100px; margin:auto; padding: 0; position: relative; display: inline-block; border-radius: 10px;}
.popup-container .map{border-radius: 15px; overflow: hidden; max-width: 100%;}
.popup-container .map .con{position: absolute; bottom: 0; left: 0; width: 100%; z-index: 6; background: #fff; color: #333; padding: 15px 20px; text-align: left;}
.popup-container .map .con .h3{font-size: 20px; font-weight: bold;}
.popup-container .map .con .p{font-size: 16px;}
.popup .closed{ position: absolute;top: -30px; right: -30px; cursor: pointer; background: #000; border-radius: 100%; padding: 10px;}
.popup .closed:before{ content: "脳"; font-family: "瀹嬩綋"; font-size: 30px; color: #fff; line-height: 30px; }
@media (max-width:640px) {
    .popup .closed{ right: 0;}
}

.inputbox{ position:relative; line-height:44px;}
.inputbox label{ position:absolute; left:0; padding: 0 10px; color:#bfbfbf; z-index: 0; font-size: 16px;}
.inputbox .text{ width:100%;  line-height:44px;height:44px; padding:0 10px;border-radius:3px; border:1px solid #e4e4e4; background:none; position: relative; z-index: 2; font-size: 16px;transition: all .3s ease-in-out;-webkit-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;
}
.inputbox .text:focus{ border-color:#bd171b;}

.jobpopup .popup-container{background:none;box-shadow:none; max-width: 720px;}
.jobpopup .popup-con{border-radius: 10px; overflow: inherit; background: #fff;padding-bottom: 62px;}
.jobpopup .closed{top: 2%; right: 8%; background: none;  z-index: 205;}
.jobpopup .closed:before{color: #333;}
.jobformbox{ display: none;}
.jobform .form-tit{ border-bottom: 1px solid #eee; color: #333; font-size: 24px; text-align: left; padding: 18px 10%;}
.jobform form{padding: 3% 10% 0% 10%;}
.jobform .item{text-align: left; margin-bottom: 15px;}
.jobform .item2 .selectbox{width: 48%;float: left;}
.jobform .item2 .selectbox:last-child{float: right;}
.jobform .selectbox select{display: block; background: #f9f9f9; height: 55px; padding: 10px; line-height: 30px; width: 100%; border: none; color: #999; font-size: 16px;}
.jobform .name{color: #333; font-size: 18px;}
.jobform .inputbox { position: relative; cursor: text; width: 100%; height: 50px; padding: 10px; line-height: 30px; font-size: 16px; background: #f9f9f9;}
.jobform .inputbox span.tit { position: absolute; color: #999; top: 10px; left: 10px;}
.jobform .inputbox input.text ,.jobform .inputbox select.text{ border: none; background: none; display: block; width: 100%; height: 30px; font-size: 16px;padding:0;}
.jobform .file-filestyle{ line-height: 30px; font-size: 16px; }
.jobform .file-filestyle input.text { border: none; background: none; display: block; width: 100%; height: 30px; font-size: 16px;}
.jobform .file-filestyle span.tit { color: #333; display:block; margin-bottom:15px; }
.jobform .file-filestyle .filebtn{position:relative; width: 85px; height: 80px; border:2px solid #ededed; display:inline-block; font-size:0; text-align: center; line-height: 50px; cursor: pointer;}
.jobform .file-filestyle .filebtn::before,
.jobform .file-filestyle .filebtn::after{ position:absolute; content:''; background:#ededed;}
.jobform .file-filestyle .filebtn::before{ left:20%; width:60%; height:3px; top:50%; margin-top:-1px;}
.jobform .file-filestyle .filebtn::after{ left:50%; margin-left:-1px; width:3px; top:20%; height:60%;}
.jobform .btns{padding-top: 0; text-align: center;position: absolute;bottom: -45px;left: 50%;margin-left: -85px;margin-left: -50px;}
.jobform .btn{display: inline-block; background: #bd171b; font-size: 16px; color: #fff; width: 170px; height: 50px; text-align: center; line-height: 50px; border-radius: 55px; border: none; cursor: pointer;}
@media (max-width:640px) {
    .jobform .form-tit{font-size: 20px;}
    .jobform .name,.jobform .inputbox,.jobform .file-filestyle{font-size: 14px;}
    .jobform .inputbox input.text{font-size: 14px;}
    .jobform .inputbox span.tit,.jobform .file-filestyle span.tit{top: 5px;}
    .jobform .inputbox{padding: 5px 10px; line-height: 20px; height: 42px;line-height: 32px;}
    .jobform .file-filestyle{padding: 0 10px; line-height: 20px; height: 30px;}
    .jobform .file-filestyle .filebtn{line-height: 90px;width: 50px;height: 50px;}
    .jobform .btn{font-size:14px; width: 110px;height: 34px;line-height: 34px;border-radius: 30px;}
	.jobform .btns {
	    padding-top: 0;
	    text-align: center;
	    position: absolute;
	    bottom: -45px;
	    left: 50%;
	    margin-left: -50px;
	}
}

.jobform{
	position: relative;
}

.contactCon .right .icon{ width: 70px; height: 70px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } 
.contactCon .right .icon span{ font-size: 35px;}
.contactImg { width: 100%; height: 100%; object-fit: cover;}
.contactEwm{ position: absolute; top: 0; right: 0;}
.contactEwm img{ width: 120px;}
.mapBox{ width: 100%; height: 550px; overflow: hidden;}
.gbookForm .input{ border: 1px solid #e2e2e2; background-color: #fafafa;  width: 100%; padding: 20px;}
.gbookForm  .textarea{ border: 1px solid #e2e2e2; background-color: #fafafa;  width: 100%; padding: 20px;}
.gbookForm  .submit{ padding: 15px 50px; margin: 0 30px;}
.gbookForm  .reset{ padding: 15px 50px; margin: 0 30px; background-color: #999999;}

.downlist li{ border: 1px solid #e5e5e5; padding: 35px 20px; border-bottom: none;}
.downlist li:last-child{ border-bottom: 1px solid #e5e5e5;}
.downlist li .left{ width: 70%; padding-left: 32px;}
.downlist li .left::after{ width: 5px; height: 5px; border: 1px solid #e5e5e5; border-radius: 50%; display: block; content: ''; top: 50%; left: 0; margin-top: -3px; position: absolute;
	 -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.downlist li a.border{ padding: 5px 12px; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; } 
.downlist li a.border .down{filter: grayscale(100%);}.downlist li a.border:hover{ color: #bd171b; border-color: #bd171b;}
.downlist li a.border:hover .down{  filter: grayscale(0%); }



.searchBan{ height:500px ; line-height: 500px; margin-top: 90px;}
.searchBox{ padding: 30px; margin-top: -80px; box-shadow: 0 0 10px rgba(0, 0, 0, .15); position: relative; z-index: 5;}

.serviceback {width: 160px;line-height: 50px; display: block;perspective: 500;-webkit-perspective: 500; }
.serviceback .w {position: relative;-webkit-transition: all 0.25s;-o-transition: all 0.25s;transition: all 0.25s;-webkit-transform-style: preserve-3d;        transform-style: preserve-3d;pointer-events: none;}
.serviceback .f { background: #f8e7e8;padding: 0 30px; color: #333; } 
.serviceback .t {position: absolute;background-color: #bd171b;width: 100%;height: 100%;padding: 0 30px;left: 0;color: #fff;top: -50px;-webkit-transform-origin: center bottom;    -ms-transform-origin: center bottom;        transform-origin: center bottom;-webkit-transform: rotateX(90deg);        transform: rotateX(90deg);-webkit-backface-visibility: hidden;        backface-visibility: hidden;}
.serviceback:hover .w {-webkit-transform: translateY(25px) translateZ(-25px) rotate3d(1, 0, 0, -90deg);        transform: translateY(25px) translateZ(-25px) rotate3d(1, 0, 0, -90deg);}
 
.searchBox .input{ line-height: 50px; width: 72%; padding: 0 25px; color: #000; border: 1px solid #e5e5e5;}
.searchBox button{ line-height: 50px; width: 14%;}

 
.searchbot  ul a{ padding: 30px 25px;   border-bottom: 1px solid #e5e5e5;}
.searchbot  ul a:last-child{ border-bottom: none;}
.searchbot  ul a:hover{ color: #bd171b;}
.searchbot ul a span{ width: 80%; word-break:break-all;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}

.zhanwei{padding-top: 100px;margin-top: -100px;}

.categoryLeft {
	width: 35%;
}

.categoryLeft a.more {
	overflow: hidden;
	width: 180px;
	height: 50px;
	border-radius: 25px;
	position: relative;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	-ms-border-radius: 25px;
	-o-border-radius: 25px;
}

.categoryLeft a.more i {
	position: relative;
	z-index: 5;
}

.categoryLeft a.more:hover {
	box-shadow: 0 0 10px rgba(189, 23, 27, 0.6);
}

.categoryRight {
	width: 65%;
}
#yySwiper .swiper-slide .img{ perspective: 200px; }
#yySwiper .swiper-slide .desc{ position: absolute; left: 0; top: 0; opacity: 0; z-index: 5; transform: translateY(20px);}
#yySwiper .swiper-slide:hover .desc{transform: translateY(0); opacity: 1;}
#yySwiper .swiper-slide:hover .img{   background-color: rgba(0, 0, 0, 0.6);}
#yySwiper .swiper-slide:hover .img img{ opacity: .4; transform:scale(1.1);  }


.idxproList li{ width: 31.5%; margin-right: 2.75%; box-shadow: 0 0 10px rgba(0, 0, 0, .08);  }

.idxproList li:nth-child(3n){ margin-right: 0;}

.idxproList li .img{ width: 100%;  height: 360px; }

.idxproList li .img a{ width: 100%; height: 100%;}

.idxproList li .img img{ max-width: 90%; max-height: 90%; object-fit: cover;}

.idxproList li .txt{ padding-top: 0;}

.idxproList li .btn a{ width:150px ; height: 46px; border-radius: 23px; -webkit-border-radius: 23px; -moz-border-radius: 23px; -ms-border-radius: 23px; -o-border-radius: 23px; }

.ljgd{ background-color: #bd171b; color: #fff;  border-color: #bd171b;}

 

.idxproList li:hover{ box-shadow: 0 0 0 10px #bd171b; color: #bd171b; transform: scale(0.95)  ; -webkit-transform: scale(0.95)  ; -moz-transform: scale(0.95)  ; -ms-transform: scale(0.95)  ; -o-transform: scale(0.95)  ; }

.ljgd:hover,.ljzx:hover{ background-color: #bd171b; color: #fff; transform: translateY(-8px);}