/* 轮播图 */
.swiper1 {
  width: 100%;
  height: 580px;
 
}
.swiper-slide .swiper-img {
	display: inline-block;
  width: 100%;
  height: 100%;
  background-size: cover !important;
}
/* 分页器的基本样式 */
.swiper1 .swiper-pagination-bullet {
  width: 14px;
  height: 8px;
  opacity: 0.5;
  background: #C6C6C6;
  border-radius: 4px;
}
/* 选中的分页器样式 */
.swiper1 .swiper-pagination-bullet-active {
  color: #fff;
  background: #C6C6C6;
  border-radius: 4px;
  opacity: 1;
}
.swiper-button-next,
.swiper-button-prev {
  opacity: 0;
}
.swiper1:hover .swiper-button-next,
.swiper1:hover .swiper-button-prev {
  opacity: 0.5;
  /* 设置按钮的透明度 */
}
.swiper-button-prev,
.swiper-button-next {
  color: #fff;
  /* 设置按钮上文字的颜色 */
  font-size: 24px;
  /* 设置按钮上文字的大小 */
  padding: 5px;
  /* 设置按钮的内边距 */
  border-radius: 5px;
  /* 设置按钮的圆角 */
  margin: 0 8%;
  transition: all 0.3s;
}
/* 鼠标悬浮时改变按钮样式 */
.swiper-button-prev:hover,
.swiper-button-next:hover {
  opacity: 1 !important;
  /* 鼠标悬浮时按钮全透明 */
}
/* 行情 */
.index-top-bot {
  background: #0F172F;
  margin-bottom: 70px;
}
.index-top-bot-pro {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
  color: #fff;
}
.index-top-bot-pro .index-pro-i {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin: 18px 0;
}
.index-top-bot-pro .index-pro-i .title,
.index-top-bot-pro .index-pro-i .trend {
  font-size: 14px;
  text-align: center;
}
.index-top-bot-pro .index-pro-i .content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-line-pack: center;
  align-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-family: 'PF-bold';
  font-size: 30px;
}
.index-top-bot-pro .index-pro-i .content::after {
  content: '';
  width: 8px;
  height: 20px;
  margin-left: 5px;
}
.index-top-bot-pro .raise .content::after {
  background-image: url('../../images/index/green-arrow.png');
}
.index-top-bot-pro .raise .trend {
  color: #00ff15;
}
.index-top-bot-pro .drop .content::after {
  background-image: url('../../images/index/red-arrow.png');
}
.index-top-bot-pro .drop .trend {
  color: #ff001f;
}
.cm-titile {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.cm-titile h2 {
  font-weight: 600;
  font-size: 30px;
  color: #000000;
  text-align: center;
}
.cm-titile p {
  width: 80%;
  font-weight: 400;
  font-size: 14px;
  color: #555555;
  margin-top: 30px;
  text-align: center;
}
/* step-1 */
.step-1 ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-top: 60px;
}
.step-1 ul li {
  width: 33.33%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-bottom: 65px;
}
.step-1 ul li .item-title {
  font-weight: 600;
  font-size: 22px;
  color: #000000;
  margin: 10px 15px;
}
.step-1 ul li .item-msg {
  width: 55%;
  font-weight: 400;
  font-size: 14px;
  color: #555555;
  text-align: center;
}
.step-1 ul li img {
  width: 130px;
  height: 130px;
}
/* step-2 */
.step-2-main {
  display: flex;
  justify-content: space-between;
  padding: 0px 50px;
}
.step-2 {
  padding: 70px 0px 95px;
  background: #FAFAFA;
  margin-bottom: 57px;
}
.ster2-left {
  width: 390px;
  margin-right: 148px;
}
.swiper2 {
  width: 100%;
  position: relative;
  cursor: pointer;
}
.swiper2 img{
	width: 100%;
}
.swiper2 .swiper2-msg {
  font-weight: 400;
  font-size: 18px;
  color: #9B9A9A;
  margin-top: 10px;
  text-align: center;
  padding-bottom: 30px;
}
/* 分页器的基本样式 */
.swiper2 .swiper-pagination-bullet {
  width: 14px;
  height: 8px;
  opacity: 0.5;
  background: #C6C6C6;
  border-radius: 4px;
}
/* 选中的分页器样式 */
.swiper2 .swiper-pagination-bullet-active {
  color: #fff;
  background: #666666;
  border-radius: 4px;
  opacity: 1;
}
.swiper2 .swiper-pagination {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0px;
}
.step2-right {
  flex: 1;
}
.step2-right-main {
  margin-top: 65px;
  display: flex;
  justify-content: center;
}
.step2-right-main ul {
  display: inline-flex;
  border: 1px solid #156CED;
}
.step2-right-main ul li {
  height: 147px;
}
.step2-right-main ul li a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 53px 20px 15px ;
  position: relative;
  
}
.step2-right-main ul li p {
  font-weight: 400;
  font-size: 14px;
  color: #156CED;
  margin-top: 30px ;
}
.step2-right-main ul li:not(:last-child) {
  border-right: 1px solid #156CED;
}
.step2-right-main ul li a::before {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 100%;
  background: #156CED;
  opacity: 0;
  transition: all 0.4s;
}
.step2-right-main ul li a:hover::before {
  opacity: 1;
}
.step2-right-main ul li a:hover img,
.step2-right-main ul li a:hover p {
  filter: brightness(100);
}
/* 三步即可开始交易 */
.step-3 {
  margin-bottom: 70px;
}
.step-3 ul {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 70px ;
}
.step-3 ul li {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px ;
  border-radius: 12px;
}
.step-3 ul li:nth-child(odd) {
  flex: 1;
  transition: all 0.3s;
}
.step-3 ul li:nth-child(odd):hover {
  margin-top: -30px;
  box-shadow: 0px 0px 14px #dedede;
}
.step-3 ul li .item-title {
  font-weight: 600;
  font-size: 22px;
  color: #000000;
  margin: 43px 0px 17px;
}
.step-3 ul li .item-msg {
  font-weight: 400;
  font-size: 14px;
  color: #555555;
  text-align: center;
}
.step-3 .kh-btn {
  width: 350px;
  height: 50px;
  background: #156CED;
  border-radius: 4px;
  margin: 50px auto 0px;
  transition: all 0.3s;
  cursor: pointer;
}
.step-3 .kh-btn a {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 18px;
  color: #FFFFFF;
  text-align: center;
}
.step-3 .kh-btn:hover {
  transform: scale(1.1);
}
/* 资讯step-4 */
.step-4{
  background: #156CED;
  padding: 70px 0px;
  margin-bottom: 80px;
}
.step-4 .news-flex{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	position: relative;
}
.news-top{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 50px;
}
.step-4 .news-lable{
	font-weight: 600;
	font-size: 30px;
	color: #FFFFFF;
}
.step-4 .news-more{
	font-weight: 400;
	font-size: 16px;
	color: #C0D9FF;
	
}
.step-4 .news-left,.step-4 .news-right{
	width: 566px;
}
.news-left-main{
	position: relative;
}
.news-left-main::before{
	content: '';
	height: 100%;
	width: 1px;
	background: #6EA8FF;
	position: absolute;
	right: -33px;
}

.step-4 .news-left .news-info{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom:20px ;
}
.step-4 .news-left .news-info-main{
	flex: 1;
	height:120px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	color: #BFD9FF;
}
.step-4 .news-left .news-info-main:hover{
	color: #fff;
}
.step-4 .news-left .news-info:hover img{
	transform: scale(1.1);
}
.step-4 .news-img-box{
	width: 220px;
	height: 120px;
	border-radius: 4px;
	margin-right: 20px;
	overflow: hidden;
}
.step-4 .news-left .news-info img{
	width: 100%;
	height: 100%;
	transition: all .3s;
}
.step-4 .news-left .news-info .news-info-title{
	font-weight: bold;
	font-size: 18px;
	color: #FFFFFF;
	-moz-box-orient: vertical;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	display: -moz-box;
	-webkit-line-clamp:1;
	overflow: hidden;
	
}
.step-4 .news-left .news-info .news-info-msg{
	font-size: 14px;
	-moz-box-orient: vertical;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	display: -moz-box;
	-webkit-line-clamp: 2;
	overflow: hidden;
	margin-bottom: 10px;
}
.step-4 .news-left .news-info .news-info-time{
	font-weight: 400;
	font-size: 14px;
}


 .step-4  .news-item{
	 display: flex;
	 justify-content: space-between;
	 align-items: center;
	 font-weight: 400;
	 font-size: 14px;
	 color: #BFD9FF;
 }
 .step-4  .news-item .news-item-title{
	 flex: 1;
	 -moz-box-orient: vertical;
	 -webkit-box-orient: vertical;
	 display: -webkit-box;
	 display: -moz-box;
	 -webkit-line-clamp: 1;
	 overflow: hidden;
	 margin-right: 15px;
 } 
.step-4 .news-more:hover,
.step-4 .news-item:hover{
	  color: #fff;
  }
.step-4 .news-list{
	counter-reset:sectioncounter
}
.step-4 .news-list li{
	position: relative;
	padding-left: 20px;
	
}
.step-4 .news-list li:not(:last-child){
	margin-bottom:16px;
}
.step-4 .news-list li::before{
	display: inline-block;
	content: counter(sectioncounter);
	counter-increment: sectioncounter;
	font-size: 14px;
	color: #BFD9FF;
	position: absolute;
	left:0;
	
}

.step-5 .step-5-ul1{
	margin-top: 92px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.step-5 .step-5-ul1 li{
	width: 33.33%;
	margin-bottom: 60px;
	display: flex;
	align-items: center;
}
.step-5 .step-5-ul1 li:nth-child(2),
.step-5 .step-5-ul1 li:nth-child(5){
	justify-content: center;
}
.step-5 .step-5-ul1 li:nth-child(3),
.step-5 .step-5-ul1 li:nth-child(6){
	justify-content: flex-end;
}
.step-5-1{
	padding: 40px 0px 27px;
	background: #FAFAFA;
}
.step-5 .step-5-ul2{
	margin-top: 20px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;

}
.step-5 .step-5-ul2 li{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.step-5 .step-5-ul2 li img{
	margin-bottom:29px ;
}
.step-5 .step-5-ul2 li p{
	font-weight: 400;
	font-size: 16px;
	color: #555555;
	text-align: center;
}