* { margin: 0px; padding: 0px; }
body {background: #043130 url(../image/bg.png) center top no-repeat;-webkit-text-size-adjust: none;font-family: "Microsoft YaHei", "PingFang SC",Arial, "Helvetica Neue", Helvetica, STHeiTi, sans-serif;background-size: 100%;}
html {min-width: 1220px;}
.wraper {width: 100%;margin: 0 auto;min-width: 1220px;}
.wrap {width: 1220px;margin: 0px auto;}
.fl {float: left; }
.fr {float: right; }
dl, dt, ul { list-style: none; text-decoration: none; padding-inline-start: 0px; }
a {text-decoration: none; color: #333;}
.clearfix::before, .clearfix::after { content: ""; display: table; clear: both; }
.un {transition: all 0.3s ease-out 0s; }
.none {display: none; }
.ellipsis {text-overflow: ellipsis;white-space: nowrap; overflow: hidden}
.flex{display: flex;}
.column{flex-direction: column;}

.logo{margin-top: 30px; margin-left: 20px;}
.title{margin-top: 23px;text-align:center;display: flex;justify-content: center;}
.title img{width:80%;display:block;text-align:center;}
.inr{background: url(../image/inr.png) center no-repeat;box-sizing: border-box;height: 194px;padding: 96px 40px 0;text-indent: 2em;color: #dee1e1;font-size: 16px;line-height: 24px;margin-top: -51px;}
.top ul li{width: 284px;height: 174px;box-sizing: border-box;padding: 28px 20px 0 42px;margin-right: 22px;margin-top: 33px;}
.top ul li h4{
  font-size: 25px;
  margin-bottom: 18px;
  background: linear-gradient(to left, #1accff, #18ffc0);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-left: 34px;
}
.top ul li p{line-height: 32px;font-size: 14px;color: #ffffff;}
.top ul li:nth-child(1){background: url(../image/a1.png) center no-repeat; margin-left: 8px;}
.top ul li:nth-child(2){background: url(../image/a2.png) center no-repeat;}
.top ul li:nth-child(3){background: url(../image/a3.png) center no-repeat;}
.top ul li:nth-child(4){background: url(../image/a4.png) center no-repeat; margin-right: 0px;}
.tit{text-align: center;margin: 40px auto;}

.guest ul{background: url(../image/line.png) 0 7px no-repeat;}
.guest ul li{margin-left: 32px;}
.guest ul li h3{font-size: 28px;color: #fff;line-height: 45px;margin-bottom: 20px;margin-left: 20px;}
.guest ul li .course{display: flex;background: url(../image/videoBg.png) center no-repeat;height: 192px;margin-bottom: 26px;box-sizing: border-box;padding: 20px 57px;align-items: center;}
.introduce{margin-left:15px;}
.introduce h1{font-size:38px;color:#fff;margin-bottom:10px;display: flex;align-items: center;}
.introduce h1 b{display: inline-block; background: url(../image/b.png) center no-repeat; width: 7px; height: 33px; margin-right: 10px;}
.introduce p{font-size:22px; color:#fff}
.manage ul{display: flex; justify-content: space-between;}
.manage ul li{width: 363px; height: 426px; padding: 0 20px 0 30px; box-sizing: border-box; background: url(../image/b1.png) center no-repeat; display: flex; flex-direction: column; align-items: center; padding-top: 40px;}
.manage ul li h2{
	background: linear-gradient(to left, #1accff, #18ffc0);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-size: 31px;
	margin-top: 10px;
	margin-bottom: 15px;
}
.manage ul li p{font-size: 16px; color: #fff; line-height: 28px; text-align: left;}
.circle {
  width: 120px;
  height: 120px;
  position: relative;
  overflow: hidden;
  text-align: center;
}
.circle img{z-index: 100; position: relative; margin-top: 40px;}
.circle::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url(../image/circled.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  
  animation: rotate 5s linear infinite;
}

@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.aim ul li{height: 193px; margin-bottom: 38px; background: url(../image/c1.png) center no-repeat;box-sizing: border-box;padding: 42px 39px 0;text-align: center;}
.aim ul li h3{
	font-size: 26px;
	background: linear-gradient(to left, #1accff, #18ffc0);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	text-align: center;
	margin-bottom: 21px;
	display: inline-block;
	}
.aim ul li p{font-size: 16px;color: #fff;text-align: center;line-height: 30px;}

.detail{display: flex;justify-content: flex-start;height: 52px;font-size: 17px;line-height: 45px;color: #fff;margin-bottom: 17px;gap: 0 29px;margin-left: 10px;box-sizing: border-box;}
.detail .time{background: url(../image/time.png) center no-repeat; width: 239px; box-sizing: border-box; padding-left: 42px;}
.detail .area{background: url(../image/area.png) center no-repeat; width: 422px;box-sizing: border-box; padding-left: 42px;}
.detail .tel{background: url(../image/tel.png) center no-repeat; width: 479px;box-sizing: border-box; padding-left: 42px;}

.map{background: url(../image/map.png) center no-repeat;height: 537px;position: relative;margin-bottom: 30px;}
.map div{position: absolute; bottom: 35px; left: 280px; color: #fff;}


.research-title {
	font-size: 34px;
	font-weight: bold;
	text-align: center;
	background: url(../images/c.png) center top no-repeat;
	height: 70px;
	line-height: 70px;
	display: block;
	margin-top: 7px;
}
.research-success-tip{background: linear-gradient(to left, #1accff, #18ffc0);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;}
.research-content {
	position: relative;
	width: 1200px;
	height: 400px;
	overflow: hidden;
	border-radius: 0px 0px 10px 10px;
}

.scroll-container {
	position: absolute;
	top: 0;
	left: 0;
	width: 5180px;
	height: 400px;
	z-index: 1;
	display: flex;
	animation: scrollLeft 240s linear infinite;
}
.group-portrait {width: 5180;height: 400px;object-fit: cover;flex-shrink: 0;display: flex;}
.group {width: 2590px;height: 400px;object-fit: cover;flex-shrink: 0;}

@keyframes scrollLeft {
	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(-5180px);
	}
}


.guest .tit{background: url(../image/tit1.png) center no-repeat;text-align: center;font-size: 38px;color: #fff;font-weight: bold;height: 51px;line-height: 51px;}
.manage .tit{background: url(../image/tit2.png) center no-repeat;text-align: center;font-size: 38px;color: #fff;font-weight: bold;height: 49px;line-height: 49px;}
.aim .tit{background: url(../image/tit3.png) center no-repeat;text-align: center;font-size: 38px;color: #fff;font-weight: bold;height: 49px;line-height: 49px;}
.tip .tit{background: url(../image/tit4.png) center no-repeat;text-align: center;font-size: 38px;color: #fff;font-weight: bold;height: 49px;line-height: 49px;}

.huigu{background: url(../image/huigu.png) center no-repeat; height: 377px; display: flex; justify-content: center; align-items: center;}
.huigu img{width: 1168px; height:347px}

.introduce .check{background: url(../image/guankan.png) center no-repeat;width: 114px;height: 33px;line-height: 33px;font-size: 16px;font-weight: bold;color: #fff;display: inline-block;position: relative;margin-left: 20px;text-align: center;top: 1px;}
.introduce .check span{position: absolute; background: url(../image/trans.png) center no-repeat; width: 10px; height: 12px; left: 10px; top: 10px;}
.introduce .check:hover{-webkit-animation: shake-top 0.8s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
	        animation: shake-top 0.8s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;}

@-webkit-keyframes shake-top {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
    -webkit-transform-origin: 50% 0;
            transform-origin: 50% 0;
  }
  10% {
    -webkit-transform: rotate(2deg);
            transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
            transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
            transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
            transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
            transform: rotate(2deg);
  }
}
@keyframes shake-top {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
    -webkit-transform-origin: 50% 0;
            transform-origin: 50% 0;
  }
  10% {
    -webkit-transform: rotate(2deg);
            transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
            transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
            transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
            transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
            transform: rotate(2deg);
  }
}