body{ font-size: 16px;}
.w90{ width: 90%; margin: 0 auto;}

.idx-banner{background-color:#fff;height:100vh}
.idx-banner .swiper-container{width: 100%; z-index: 0; height: 100%;}
.idx-banner .swiper-slide{  background-color: #fff;}
.idx-banner .swiper-wrapper, .idx-banner [data-swiper-parallax]{will-change:transform}
.idx-banner .headbg{position:absolute;z-index:0;width:100%;height: 100%;background-repeat:no-repeat;background-size:cover;background-position:center center;-webkit-animation-fill-mode: both; animation-fill-mode: both;}
.idx-banner .headbg::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.1);background-image:-webkit-linear-gradient(top,rgba(0,0,0,.5) 0,rgba(0,0,0,0) 30%);background-image:linear-gradient(to bottom,rgba(0,0,0,.5) 0,rgba(0,0,0,0) 30%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#66000000', endColorstr='#00000000', GradientType=0);z-index: 1;}
.idx-banner .swiper-slide-active .headbg{-webkit-animation: scaleBigToSmall 4s; animation: scaleBigToSmall 4s;}
.idx-banner .swiper-slide .txt{ display: flex; justify-content: center; flex-direction: column; position: absolute; left: 5%; height: 100%;z-index: 5;}
.idx-banner .swiper-slide .txt .f60{ animation: fadeOutUp 2s; -webkit-animation: fadeOutUp 2s;  animation-fill-mode: both;opacity: 0; }
.idx-banner .swiper-slide .txt .f26{ animation: fadeOutDown 2s; -webkit-animation: fadeOutDown 2s; animation-fill-mode: both; opacity: 0;}
.idx-banner .swiper-slide-active .txt .f60{ animation: fadeInDown 1.5s; animation-fill-mode: both; -webkit-animation: fadeInDown 1.5s; opacity: 1;}
.idx-banner .swiper-slide-active .txt .f26{ animation: fadeInUp 1.5s; animation-fill-mode: both; -webkit-animation: fadeInUp 1.5s;opacity: 1;}
.idx-banner .pagination{ position: absolute; bottom: 0; right: 5vw; background-color: rgba(255, 255, 255, 0.8); height: 70px; padding: 0 0 0 30px; width: 18vw;}
.idx-banner .pagination .prev,.idx-banner .pagination .next{ width:60px; height: 60px;}
.idx-banner .pagination .prev:hover .iconfont,.idx-banner .pagination .next:hover .iconfont{ color: #00b0b7;}

header{ background: transparent; position: fixed; z-index: 100; padding-left: 5vw; transition:all .36s ; -webkit-transition:all .36s ; -moz-transition:all .36s ; -ms-transition:all .36s ; -o-transition:all .36s ; }
.indexHeader{ top: 40px; width: 100%;}
.Header{top: 0; width: 100%; background-color: #fff;}
header .con{ width: 90vw;}
header .logo img{ height: 60px;}
header .tel { height: 56px;  padding: 0 20px;  border-radius:30px 0 0 30px ; -webkit-border-radius:30px 0 0 30px ; -moz-border-radius:30px 0 0 30px ; -ms-border-radius:30px 0 0 30px ; -o-border-radius:30px 0 0 30px ; }
header .tel .icon{ width: 30px; height: 30px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
nav { font-size: 18px; color: #666;}
nav li{ padding: 0 20px; position: relative;}
nav .oneNav{ line-height: 100px;  display: block; position: relative;}
nav .oneNav::after{ width: 100%; height:3px; transition: all .36s; background-color: #00b0b7; position: absolute;
	 bottom: 0; left: 0; display: block; content: ''; transform: scale(0,1); -webkit-transform: scale(0,1); -moz-transform: scale(0,1); -ms-transform: scale(0,1); -o-transform: scale(0,1); -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
nav  li.on .oneNav{ color: #00b0b7;}
nav  li.on .oneNav::after { transform: scale(1,1); -webkit-transform: scale(1,1); -moz-transform: scale(1,1); -ms-transform: scale(1,1); -o-transform: scale(1,1); }
nav  a:hover{ color: #00b0b7;}
nav  li dl{position:absolute;text-align: center;min-width: 100%; width: auto;top:110px;left: 50%; background:#fff;   -webkit-box-shadow:0 13px 42px 11px rgba(0,0,0,.15);box-shadow:0 13px 42px 11px rgba(0,0,0,.15);
	border-bottom-left-radius:5px;border-bottom-right-radius:5px;
}
nav  li dl dd{white-space: nowrap;height:50px;line-height:50px;border-bottom:1px solid #eee;transition:all .36s ease;-ms-transition:all .36s ease;-o-transition:all .36s ease;-webkit-transition:all .36s ease;-moz-transition:all .36s ease}
nav  li dl dd:last-child{border-bottom:0}
nav  li dl dd a{ padding: 0 10px;  font-size:14px; color:#333!important; font-weight: normal!important; transition:all .36s ease;-ms-transition:all .36s ease;-o-transition:all .36s ease;-webkit-transition:all .36s ease;-moz-transition:all .36s ease;display:block }
nav  li dl dd:hover{background:#00b0b7}
nav  li dl dd:hover a{color:#fff!important;}
nav  li dl:before{content:"";position:absolute;border-width:0 9px 9px;border-style:solid;border-color:transparent transparent #f6f1e1;top:-9px;left:50%;margin-left:-9px}
nav  li dl{ visibility:hidden; opacity:0; filter:alpha(opacity=0); transform:translateX(-50%) translateY(20px); -ms-transform:translateX(-50%) translateY(20px); -o-transform:translateX(-50%) translateY(20px); -webkit-transform:translateX(-50%) translateY(20px); -moz-transform:translateX(-50%) translateY(20px); transition:all .5s ease; -ms-transition:all .5s ease; -o-transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; }
nav  li:hover dl{ visibility:visible; opacity:1; filter:alpha(opacity=100); transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); }
nav  li>a:hover:after{top:0}
nav  li>a:hover span{transform:translateY(-100%);-ms-transform:translateY(-100%);-o-transform:translateY(-100%);-webkit-transform:translateY(-100%);-moz-transform:translateY(-100%)}


header.scroll{ background-color: #fff; top: 0; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);}
header.scroll  nav .oneNav{ line-height: 80px;}
header.scroll .tel{ border-radius:30px ; -webkit-border-radius:30px ; -moz-border-radius:30px ; -ms-border-radius:30px ; -o-border-radius:30px ; }
header.scroll nav  li dl{top: 90px;}
 
.h_nav{ display: none;}

.h_nav{ height: 60px; width: 60px; background-color:#00b0b7; padding: 18px 8px ;   align-items: flex-end; flex-direction: column;justify-content: space-between; display: none;}

.h_nav .burger{ width: 100%;  height: 1px ; background: #fff;  transition: .8s; display:inline-block;       }
  .h_nav .burger:first-child{ animation: long 2s linear infinite;  }
  .h_nav .burger:nth-of-type(2){  width: 50%;}
  .h_nav .burger:nth-of-type(3){ animation: long 3s linear infinite; -webkit-animation: long 3s linear infinite; }

  .h_nav.close .burger:first-child{ display: none;}
    .h_nav.close .burger:nth-of-type(3){ display: none;}
 
    .h_nav.close .burger:nth-of-type(2) {    position: relative;    z-index: 1; width: 80%;}
    .h_nav.close .burger:nth-of-type(2):before, .h_nav.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;}
    .h_nav.close .burger:nth-of-type(2) {    background: transparent;    transform: rotate(-180deg); }
    .h_nav.close .burger:nth-of-type(2):before, .h_nav.close .burger:nth-of-type(2):after {      opacity: 1;      transition: all .3s; }
.h_nav.close .burger:nth-of-type(2):before {     transform: rotate(45deg); }   .h_nav .burger:nth-of-type(2):after {     transform: rotate(-45deg); }

.idx-about{ background: url(../images/bg1.jpg) no-repeat center center; background-size: cover;}
.ptb-70{ padding:70px  0 ;}
.idx-about .img{ width: 43.6%;}
.idx-about .idx-aboutTop{ display: inline-block;}
.idx-about  .img>div{ position: absolute; left: 0; top: 0;}
.idx-about  .img .paly{ width: 100px;  cursor: pointer; background: #fff; border-radius: 50%; height: auto;
	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;
	transform: scale(1);
	-webkit-animation: ripple-wave1 1s linear infinite; transform: scale(0.8);}
@keyframes ripple-wave1{
		to {
			box-shadow: 0 0 0 15px rgba(255, 255, 255, 0.1),0 0 0 30px rgba(255, 255, 255, 0.1),0 0 0 45px rgba(255, 255, 255, 0.02);
		}
}
.idx-about  .txt .border-bottom{ border-bottom: 1px solid #aaa;}
.border-bottom{ border-bottom: 1px solid #e5e5e5;}
.idxMore{ width: 200px; height: 50px;}
.idxMore span{ border: 1px dashed #fff; width: 24px; height: 24px; border-radius: 50%; display: inline-block; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.idxMore span::after{ transition:all .36s ; content: "\ea66"; display: block; font-family: "iconfont" !important; font-size: 20px; position: absolute; left: 15px; -webkit-transition:all .36s ; -moz-transition:all .36s ; -ms-transition:all .36s ; -o-transition:all .36s ; }
.idxMore:hover span::after{ left: -10px;}
.idxMore:hover{ box-shadow: 0 0 10px rgba(0, 176, 183, 0.5);}
.idx-pro .swiper-slide{ border: 1px solid #e5e5e5; border-radius: 15px; overflow: hidden; -webkit-border-radius: 15px; -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; }
.idx-pro .swiper-slide .img img{ width: 100%; height: 400px; object-fit: cover;}
.idx-pro .swiper-slide  .cha::before{
	 display: block;
	 content: '';
	 padding: 6px 32px;
	 width: 100%;
	 height: 100%;
	 border-radius: 30px;
	 background-color: #00b0b7;
	 position: absolute;
	 left: -32px;
	 top: -6px;
	 transform: scale(0);
	 -webkit-border-radius: 30px;
	 -moz-border-radius: 30px;
	 -ms-border-radius: 30px;
	 -o-border-radius: 30px;
	 -webkit-transform: scale(0);
	 transition: all .36s;
	 -moz-transform: scale(0);
	 -ms-transform: scale(0);
	 -o-transform: scale(0);
	 -webkit-transition: all .36s;
	 -moz-transition: all .36s;
	 -ms-transition: all .36s;
	 -o-transition: all .36s;z-index: -1;
}
.idx-pro .swiper-slide:hover .cha{ color: #fff;}
.idx-pro .swiper-slide:hover .cha:before{ transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); }
.idx-pro .swiper-slide: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) ; }
.idx-yy  .titlt{ position: absolute; top: 70px; left: 50%; z-index: 30; transform: translate(-50%); -webkit-transform: translate(-50%); -moz-transform: translate(-50%); -ms-transform: translate(-50%); -o-transform: translate(-50%); }

.yyImg { background-color: #000;}
.yyImg .img{display: none; 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);}

.yyImg .img img{opacity: 0.8;}
.yyImg .img.on{ display: block;}
.yyImg .img span{ position: absolute; top: 0; left: 0; background: rgba(0,0,0,.1); width: 100%; height: 100%;z-index: 10;}
.yySwiper{ display: none; position: absolute; left: 0; bottom: 25px;z-index: 20; width: 100%; }
.yySwiper .swiper-slide { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; padding-top: 25px; padding-bottom: 10px; }
.yySwiper .swiper-slide .icon{ position: relative; width: 70px; height: 70px; border: 1px dashed #fff; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.yySwiper .swiper-slide .icon::before{ width: 86%; height: 86%; display: block; content: ''; position: absolute; top: 6%; left: 6%; border: 1px solid #fff; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.yySwiper .swiper-slide .icon img{ filter: grayscale(100%) brightness(500%); transition:all .12s ; -webkit-transition:all .12s ; -moz-transition:all .12s ; -ms-transition:all .12s ; -o-transition:all .12s ; }
.yySwiper .swiper-slide-active .icon img{ filter: grayscale(0%) brightness(100%); -webkit-filter: grayscale(0%) brightness(100%); }
.yySwiper .swiper-slide-active  .icon::before{ background-color: #fff;}
.yySwiper .swiper-slide  i:before { content: ''; position: absolute; left: 0; top: 0;  border: 1px solid #fff; width: 100%;height: 100%;  border-radius: 50%;  opacity: 0}
.yySwiper .swiper-slide  i:after {content: '';position: absolute; left: 0;top: 0;border: 1px solid #fff; width: 100%; height: 100%; border-radius: 50%;opacity: 0}
.yySwiper .swiper-slide-active i:before { animation: serv_one_border .9s 0s ease 1; }
.yySwiper .swiper-slide-active i:after { animation: serv_one_border 1.5s 0s ease 1;  }

.yyTxt{  height: 100%; position: absolute; bottom: 0; left: 0;   z-index: 20; width: 100%;}
.yyTxt li{ position: relative; width: calc(100% / 6); height: 100%; justify-content: flex-end; align-items: center; padding-bottom: 5%;}
.yyTxt li .icon{ position: relative; width: 100px; height: 100px; border: 1px dashed #fff; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.yyTxt li .icon::before{ width: 86%; height: 86%; display: block; content: ''; position: absolute; top: 6%; left: 6%; border: 1px solid #fff; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.yyTxt li .icon img{ filter: grayscale(100%) brightness(500%); transition:all .12s ; -webkit-transition:all .12s ; -moz-transition:all .12s ; -ms-transition:all .12s ; -o-transition:all .12s ; }
.yyTxt li div,.yyTxt li a{ position: relative; z-index: 2;}
.yyTxt li::after{ width: 100%; height: 0; position: absolute; top: 0; bottom: 0; background: rgba(0, 0, 0, 0.2); display: block; content: ''; transition: all .5s; z-index: 1;}
.yyTxt li a{ opacity: 0; transform:translateY(20px) ; -webkit-transform:translateY(20px) ; -moz-transform:translateY(20px) ; -ms-transform:translateY(20px) ; -o-transform:translateY(20px) ; }
.yyTxt li.on a{ opacity: 1; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); }
.yyTxt li.on::after{ height: 100%;}
.yyTxt li.on .icon::before{ background-color: #fff;}
.yyTxt li.on .icon img{ filter: grayscale(0%) brightness(100%); -webkit-filter: grayscale(0%) brightness(100%); }
.yyTxt li i:before { content: ''; position: absolute; left: 0; top: 0;  border: 1px solid #fff; width: 100%;height: 100%;  border-radius: 50%;  opacity: 0}
.yyTxt li i:after {content: '';position: absolute; left: 0;top: 0;border: 1px solid #fff; width: 100%; height: 100%; border-radius: 50%;opacity: 0}
.yyTxt li.on i:before { animation: serv_one_border .9s 0s ease 1; }
.yyTxt li.on i:after { animation: serv_one_border 1.5s 0s ease 1;  }
.yyTxt li  a:hover{ color: #00b0b7;}

.idx-news .con .item{ width: 30%;}
.idx-news .con .item{  width: 30%; display: block;}
.idx-news .con .item a{ display: block;}
.idx-news .con .item.img img{ width: 100%; height: 622px;  object-fit: cover;}
.idx-news .con .item .txt{ position: absolute;  left: 0; top: 0; width: 100%; height: 100%; z-index: 5;
	background-image: linear-gradient(to bottom, transparent , rgba(0 0 0 / 0.5));
	 /* background-color: rgba(0, 0, 0, 0.2); */
 padding: 40px; justify-content: flex-end;}
.idx-news .con .item:last-child{ width: 37%; display: flex; }
.idx-news .con .newslink{ display: flex !important; flex-direction: column; justify-content: space-between;}
.idx-news .con .item:hover.img img{ transform: scale(1.1);}
.idx-news .con  .newslink{ height: 48%; padding: 40px 50px; position: relative; border: 1px solid #e5e5e5;}
.idx-news .con .newslink>div{ position: relative; z-index: 5;}
.idx-news .con .newslink::after{ width: 0; height: 100%; position: absolute; top: 0; left: 0; background-color: #00b0b7; content: ''; display: block; transition: all .36s;}
.idx-news .con .newslink:hover,.idx-news .con .newslink:hover .color-999{  color: #fff;}
.idx-news .con .newslink:hover::after{ width: 100%;}
.idx-news .con .newslink .icon{ width: 40px; height: 40px; border-radius: 50%; border: 1px solid #aaa; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.idx-news .con .newslink:hover .icon{ border-color: #fff; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); }
.newslink .DIN::after{ width: 0; transition: all .36s; height: 1px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background-color: #fff; 
display: block; content: '';}
.newslink:hover .DIN:after{ width: 35px;}
.newslink:hover .DIN{ padding-left: 50px;}

footer{ background-color: #222222; color: rgba(255, 255, 255, 0.4); border-top: 10px solid #00b0b7;} 
.footNav a{ margin-right: 60px; }

footer a:hover{ color: #fff;}
.footEwm{ width: 120px; margin-bottom: 12px;}
footer .bottom{ border-top: 1px solid rgba(255, 255, 255, 0.3);}

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

	transition: transform .3s, opacity .3s;
	-webkit-transition: transform .3s, opacity .3s;
	-moz-transition: transform .3s, opacity .3s;
	-ms-transition: transform .3s, opacity .3s;
	-o-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: 10001; 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;}
.neiBan{ margin-top: 100px;}
.w76{ width: 76%; margin: 0 auto;}
.neiBan .txt{ left: 12%; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.neiBan .txt .line{ background-color: #fff; width: 120px; height: 4px;}
 
.locationBox{ min-height: 80px;}
.sedNav a{ line-height: 80px; display: inline-block; margin-left: 90px; position: relative;}
.sedNav a.on::after{ display: block; content: ''; background-color: #00b0b7; width: 100%; height: 2px;}
.sedNav a.on{ color: #00b0b7;}
.sedNav a:hover{ color: #00b0b7;}
.yyNav a{ line-height: 80px; display: inline-block; margin: 0 45px; position: relative;}
.yyNav a.on::after{ display: block; content: ''; background-color: #00b0b7; width: 100%; height: 2px;}
.yyNav a.on{ color: #00b0b7;}
.yyNav a:hover{ color: #00b0b7;}


.w60{ width: 60%;}
.w33{ width: 33%;}
.about-introduction{ background: url(../images/bg2.jpg) no-repeat center center; background-size: cover; padding-bottom: 140px;}
.about-culture{   height: 800px;}
.about-culture .title{ top:70px; left: 50%; transform: translateX(-50%); position: absolute; z-index: 10; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); }
.about-culture  .bg{ width: 100%; height: 150%; object-fit: cover; z-index: 1;}
.about-culture ul{ position: absolute; width: 100%; height: 100%;  top: 0; left: 0; z-index: 5;}
.about-culture ul li{ width: 25%; border-right: 1px solid rgba(255, 255, 255, 0.3);   position: relative; padding-top: 80px; text-align: center; perspective: 300px;}
.about-culture ul li::before{
	 position: absolute;
	 top: 0;
	 left: 0;
	 width: 100%;
	 height: 100%;
	 background-color: rgba(0, 0, 0, .3);
	 display: block;
	 content: '';
	 z-index: 1;
	 transition: all .36s;
	 -webkit-transition: all .36s;
	 -moz-transition: all .36s;
	 -ms-transition: all .36s;
	 -o-transition: all .36s;
	 transform: rotateY(45deg);
	 transform-origin : 0 100%  0 ;opacity: 0;
}
.about-culture ul li div{ position: relative; z-index: 5;}
.about-culture ul li img{ height: 50px;}
.about-culture ul li:hover::before{ opacity: 1; transform:  none; -webkit-transform:  none; -moz-transform:  none; -ms-transform:  none; -o-transform:  none; }
.mb-100{ margin-bottom: 100px;}
.about-history{ background:url(../images/bg4.jpg) no-repeat center center; background-size: cover;} 
#historyswiper { background: url(../images/line.jpg) repeat-x bottom 15px left; padding-bottom: 10px;}
#historyswiper .swiper-slide .DIN{ padding-bottom: 25px;}
#historyswiper .swiper-slide::after{ display: block; content: ''; width: 6px; height: 6px; border-radius: 50%; background-color: #aaa;
   -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; position: absolute; left:50% ; margin-left: -2px; bottom: 0; }
   #historyswiper .swiper-slide::before{ display: block; content: ''; width: 14px; height: 14px; border-radius: 50%;  position: absolute; bottom: -5px;
   border: 1px solid #aaa; left: 50%; margin-left: -7px;   -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
   #historyswiper  .prev span, #historyswiper  .next span{ font-size: 30px; color: #aaa; }
   #historyswiper  .prev{ position: absolute; left: 0; bottom: 0px; z-index: 10;}
   #historyswiper  .next{ position: absolute; right: 0; bottom: 0px;z-index: 10;}
#historyswiper .swiper-slide.swiper-slide-thumb-active::after{ background-color: #00b0b7; transform: scale(1.5); -webkit-transform: scale(1.5); -moz-transform: scale(1.5); -ms-transform: scale(1.5); -o-transform: scale(1.5); }
#historyswiper  .swiper-slide.swiper-slide-thumb-active::before{ border-color: #00b0b7; transform: scale(1.5); -webkit-transform: scale(1.5); -moz-transform: scale(1.5); -ms-transform: scale(1.5); -o-transform: scale(1.5); }

#historyswiper  .swiper-slide.swiper-slide-thumb-active  .f24{ color: #00b0b7; transform: scale(1.15); font-weight: bold; -webkit-transform: scale(1.15); -moz-transform: scale(1.15); -ms-transform: scale(1.15); -o-transform: scale(1.15); }
#historyswiper .swiper-slide{ padding-bottom: 10px;}
.line-height3{ line-height: 3;}
.historytxt .swiper-slide .right{ padding-left: 50px;}


.honor .swiper-container .img{ width: 100%; height: 360px;}
.honor .swiper-container .img img{ max-height: 100%;  max-height: 100%; object-fit: cover;}
.honorLeft,.honorRight{
  width: 70px;
  height: 70px;
  border: 1px solid #ddd;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  transition:all .36s ;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  cursor: pointer;
  -webkit-transition:all .36s ;
  -moz-transition:all .36s ;
  -ms-transition:all .36s ;
  -o-transition:all .36s ;
}
.honorLeft{ left: -100px;}
.honorRight{ right: -100px;}
.honorLeft:hover,.honorRight:hover{ background-color: #00b0b7; color: #fff;}

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

.proLeft{ width: 20%;}
.proRight{ width: 80%; border-left: 1px solid #e5e5e5 ; }

.proLeft dl dt{ height: 90px; line-height: 90px; border-bottom: 1px solid #e5e5e5;}
.proLeft dl a{ display: block;}
.proLeft dl ul{padding-left:40px ;}
.proLeft dl dd{ height: 70px; line-height: 70px;border-bottom: 1px solid #e5e5e5;   position: relative;}
.proLeft dl a:hover{ color: #00b0b7;}
.proLeft dl ul{ display: none;}
.proLeft dl i{ position: absolute; transition: all .36s;color: #00b0b7; right: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.proLeft dl dd i{right: 30px; opacity: 0;}
.proLeft dl.on dt a{ font-weight: bold;color: #00b0b7;}
.proLeft dl.on ul{ display: block; }
.proLeft dl dd:hover i{ right: 0; opacity: 1;}
.proLeft dl dt .an{ width: 50px; height: 50px; background: url(../images/jia.png) no-repeat center center; cursor: pointer; background-size: 40% auto; }
.proLeft dl.on  .an{ background: url(../images/jian.png) no-repeat center center;background-size: 40% auto;}
.border{ border: 1px solid #e5e5e5;}
.proList{display: grid; grid-gap: 40px; grid-template-columns: repeat(2,1fr);}
.proList li { border-radius: 15px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; }
.proList li .img{ border-radius: 15px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; }
.proList li .bg{
    position: absolute;
    left: 0;
    top: 0;
    background-color: rgba(0, 176, 183, 0.5);
    opacity: 0;
    -webkit-transition: all 600ms ease 0s;
    transition: all 600ms ease 0s;
    -webkit-clip-path: polygon(50% 20%, 50% 50%, 20% 50%, 50% 50%, 50% 80%, 50% 50%, 80% 50%, 50% 50%);
    clip-path: polygon(50% 20%, 50% 50%, 20% 50%, 50% 50%, 50% 80%, 50% 50%, 80% 50%, 50% 50%);
    -moz-transition: all 600ms ease 0s;
    -ms-transition: all 600ms ease 0s;
    -o-transition: all 600ms ease 0s;
}

	.proList li:hover .img .bg  {  opacity: 1;
      -webkit-clip-path: polygon(50% 0%, 0% 0%, 0% 50%, 0% 100%, 50% 100%, 100% 100%, 100% 50%, 100% 0%);
              clip-path: polygon(50% 0%, 0% 0%, 0% 50%, 0% 100%, 50% 100%, 100% 100%, 100% 50%, 100% 0%);}
.proList li .img img{ height: 435px; width: 100%; object-fit: cover;}
.proList li:hover{ color: #00b0b7; box-shadow: 0 0 20px rgba(0, 0, 0, .1); transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); }
 
.cellMenuBox{
    margin: 0 auto;
    width: 100%;
}
.neiNav{ margin-top: -15px;}
.menuItem{
    height: 50px;
    border-bottom: 1px solid #EBEBEB;
    padding-top: 15px;
    display: flex;
	position: relative;
}
.menuItem .topTitle{
    font-size: 15px;
    
    font-weight: 500;
    opacity: 1;
    width: 92%;
}
.menuItem .topTitle a{
    display: block;
}
.menuItem .topTitleActive{
    color:#00b0b7;
    border-bottom: 2px solid #00b0b7;
}
 
.menuItem .topBtn img{
    position: absolute;
    height: 40%;
}
.topBtnActive{
    margin-top: 0; 
}
.menuDetail{
    width:92%;
    /*margin: 0 auto;*/
    background:#def5f7;
    opacity:1;
    padding: 2% 4.7%;
    position: absolute;
	top: 100%;
	z-index: 99;
}
.menuDetail li{
    font-size: 14px;
    
    line-height:2.4;
    color:rgba(68,68,68,1);
    opacity:1;
}
.menuDetail li a{
    display: block;
    width: 100%;
}
.menuDetail li:hover{
    color: #00b0b7!important;
}
.pageNewsD{
	width:92%;
	margin:0 auto 10rem auto;
}
.pageNewsD h1:nth-of-type(1){
    margin: 0.8rem 0;
}
.pageNewsD .cont img{
    width: 100%!important;
    height: 100%!important;
}
.backlist:hover{ color: #00b0b7;}
.proinfoOne .img{ width: 56%; }
.proinfoOne .txt{  width: 44%;} 

.proinfoOne .img .swiper-slide img{ width: 100%;height: 520px; object-fit: cover;}
.proinfoOne .txt .more{ display: inline-flex; padding: 15px 30px;}
.proinfoOne .txt .more:hover{ background-color: #00b0b7; color: #fff; box-shadow: 0 0 10px rgba(0, 176, 183, 0.5); transform: translateY(15px); -webkit-transform: translateY(15px); -moz-transform: translateY(15px); -ms-transform: translateY(15px); -o-transform: translateY(15px); }

.proinfoTit{ border-left: 3px solid #00b0b7;  line-height: 1;}

.ysUl::before{ width: calc(100% + 100px); height: calc(100% + 90px); position: absolute; top: -45px; left: -50px; background-color: #f7f8f9; display: block; content: ''; z-index:  1;}
.ysUl li{ width: 50%; line-height: 50px; padding: 10px 30px; border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; position: relative; z-index: 2; background-color: #fff;}

.planList .img{ width: 28%;}
.planList .img img{ width: 100%; height: 270px; object-fit: cover;}
.planList .txt{ width: 72%;}
.planList .txt div{ position: relative; z-index: 5;}
.planList .txt::before{ z-index: 1; width: 0; height: 100%; position: absolute; top: 0; left: 0; display: block; content: ''; background-image: linear-gradient(to right,#00b0b7,#00b0b7);  transition: all .5s; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; -o-transition: all .5s; }
.planList li:hover .txt::before{ width: 100%;}
.planList li:hover { color: #fff; box-shadow: 0 0 10px rgba(0, 176, 183, 0.5);}
.planList li: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); }
.toolbarBot{   width: 100%; height: 60px; background-color: #222;}

.yyList{ display: grid; grid-gap:30px; grid-template-columns: repeat(3,1fr);}
.yyList li{ box-shadow: 0 0 10px rgba(0, 0, 0, .1); border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; }
.yyList li .line{ width: 100%; height: 1px;}
.yyList li  .img img{ width: 100%; object-fit: cover; border-radius: 5px; height: 300px;}
.yyList li  .img .bg{ width: 100%; position: absolute; bottom: 0; left: 0; z-index: 2; transform: translateY(100%); -webkit-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); }
.yyList li .line::after{ width: 20%; height: 2px; background-color: #00b0b7; display: block; content: ''; position: absolute; bottom: 0; left: 0; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.yyList li:hover { color: #00b0b7;}
.yyList li:hover .line::after{ width: 100%;}
.yyList li: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); }
.yyList li:hover .img .bg{ transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); }

.technologyList .line{  width: 50%; height: 2px;}
.technologyList li: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); }
.technologyList li:hover .line{  width: 100%; }

.technologyList li .img .bg{ position: absolute; z-index: 5; background: rgba(0, 176, 183, 0.5); top: 0; left: 0;}
.technologyList li:last-child{ margin-bottom: 0;}
.technologyList li:nth-child(2n) a{ flex-direction: row-reverse;}
.technologyList li:hover .txt{ box-shadow: 0 0 10px rgba(0, 176, 183, .2); border-color: transparent;}

.newslist{ display: grid; grid-gap: 45px; grid-template-columns: repeat(3,1fr);}
.newslist li{ box-shadow: 0 0 10px rgba(0, 0, 0, .1);}
.newslist li  .img img{ width: 100%; height: 350px; object-fit: cover;}
.newslist li .icon{ width: 37px; height: 37px; border-radius: 50%; border-color: #555; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.picture::before {content: "";width: 100%;height: 100%;position: absolute;z-index: 1;left: 0px;}
a:hover .picture::before { animation: gradient-rectangle 1s ; animation-delay: 0s; -webkit-animation-timing-function: cubic-bezier(0, 0, 0.18, 0.96); -webkit-animation:; }
.newslist li:hover { box-shadow: 0 0 20px rgba(0, 0, 0, .1);}
.newslist li: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); }
.newslist li:hover { color: #00b0b7; transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); }
.newslist li:hover .icon{ background-color: #00b0b7; color: #fff; border-color: #00b0b7; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); }
.newslist li:hover .icon .iconfont{ color: #fff;}
.newsInfo img{ margin: 8px 0;}
.newspage a{ width:33.3%;}
.newspage a:hover{ color: #00b0b7;}
.newspage a img{filter: grayscale(100%);}
.newspage a:hover img{ filter: grayscale(0%); -webkit-filter: grayscale(0%); }
.contacttxt{ width: 34%;}
.contactStyle{ height: 520px;}
.mapbox{ width: 66%; height: 100%;}

.contactUl li{ width: 24.3%; padding: 30px 10px; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.contactUl li .icon{ margin-bottom: 15px; }
.contactUl li .icon img{ height: 34px;filter: grayscale(100%); }
.contactUl li:hover { border-radius: 15px; -webkit-border-radius: 15px; box-shadow: 0 0 10px rgba(0, 176, 183, 0.2); -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; }
.contactUl li:hover .icon img{ filter: grayscale(0%); -webkit-filter: grayscale(0%); }

.contactMessage .input{ height: 50PX; line-height: 50PX; width: 49%;}
.inputName{ background: url(../images/input_name.png) no-repeat center left 12px; padding-left: 40px;  background-size: auto 16px;}
.inputTel{ background: url(../images/input_tel.png) no-repeat center left 12px; padding-left: 40px;  background-size: auto 16px;}

.contactMessage .textarea{ width: 100%; background: url(../images/input_con.png) no-repeat left 12px top 16px;  background-size: auto 16px;padding-left: 40px;line-height: 50PX;}
.contactMessage .button{ line-height: 50px;} 

 
.jobtit{ background-color: #00b0b7;  line-height: 70px; text-align: center;}
.jobtop span:nth-child(1){width:30%;}
.jobtop span:nth-child(2){width: 20%;}
.jobtop span:nth-child(3){width: 20%;}
.jobtop span:nth-child(4){width: 20%;}
.jobtop span:nth-child(5){width: 10%;} 

.joblist li{ border: 1px solid #e5e5e5;  border-top: none;  }
.joblist li:first-child{}
.joblist dt{ line-height: 70px; text-align: center;}
.joblist dt .jia{ width: 22px; height: 22px; display: inline-block; background: url(../images/jia2.png)no-repeat center center; background-size: cover; cursor: pointer;}
.joblist dt .jian{ width: 22px; height: 22px; display: inline-block; background: url(../images/jian2.png)no-repeat center center; background-size: cover; cursor: pointer;}
.joblist dd { border-top: 1px solid #e5e5e5; padding-bottom: 20px; display: none;}
/* .joblist dd .item{ padding-top: 20px;}
.joblist dd .left{ width: 25%;} */
.giveTo{
    background-color: #00b0b7;
    color: #fff;
    display: inline-block;
    padding: 8px 25px;
    
    margin-top: 20px;
    /* margin-left: 50px; */
 
    transition: all .36s;
    -webkit-transition: all .36s;
    -moz-transition: all .36s;
    -ms-transition: all .36s;
    -o-transition: all .36s;
}
.giveTo:hover{ color: #fff; box-shadow: 0 0 10px rgba(0, 104, 183,.25); transform:  translateY(-10px); -webkit-transform:  translateY(-10px); -moz-transform:  translateY(-10px); -ms-transform:  translateY(-10px); -o-transform:  translateY(-10px); } 

 
.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:#00b0b7;}

.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: 85;}
.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: #00b0b7; 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;
} 

.joblist  li.on dt{ background-color: #f5f5f5;}
.messageImg{ width: 100%; height: 100%; object-fit: cover;}



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;}

 #content{ align-items: flex-start;}
 @media screen and (max-width:750px) {  #content{ align-items: stretch;} .proRight{ border-left: none;} }