.swiper {
      width: 100%;
      height: 100%;
}

.swiper-slide {
  text-align: center;
  font-size: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: All 0.5s ease;-webkit-transition: All 0.5s ease;-moz-transition: All 0.5s ease;-o-transition: All 0.5s ease;
}

.swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
	
.all_su_AB{
width:100%;
height:100vh;
position:relative;
}
.all_su_A{
width:100%;
height:100vh;
position:absolute;
left:0;
top:0;
z-index:1;
}
.all_su_B{
width:100%;
height:100vh;
position:absolute;
left:0;
top:0;
z-index:2;
}
.cas_8thb_B{
width:100%;
height:100vh;
position:relative;
cursor:pointer;
}
.mySwiper swiper-slide{
height:100vh;
position:relative;
}

.cas_8thb_Ba{
width:auto;
height:56px;
line-height:56px;
font-size:36px;
color:#fff;
position:absolute;
left:40px;
bottom:110px;
transition: All 0.5s ease;-webkit-transition: All 0.5s ease;-moz-transition: All 0.5s ease;-o-transition: All 0.5s ease;
}
.cas_8thb_Bb{
width:auto;
height:36px;
line-height:36px;
font-size:16px;
color:#fff;
position:absolute;
left:40px;
bottom:120px;
opacity:0;
transition: All 0.5s ease;-webkit-transition: All 0.5s ease;-moz-transition: All 0.5s ease;-o-transition: All 0.5s ease;
}
.cas_8thb_Bc{
width:51px;
height:24px;
position:absolute;
left:32px;
bottom:70px;
background:url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTEiIGhlaWdodD0iMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CgogPGc+CiAgPHRpdGxlPkxheWVyIDE8L3RpdGxlPgogIDxwYXRoIHN0cm9rZT0ibnVsbCIgaWQ9InN2Z18xIiBkPSJtMzYuODE3LDAuM2wtMi41NTUxMiwyLjEyMTk5bDkuNjcyOTQsOC4wMzMyNmwtNDMuODY2MDYsMGwwLDMuMjkxOTdsNDMuODY2MDYsLTAuMjYwNTZsLTkuNjcyOTQsOC4wMzMyNmwyLjU1NTEyLDIuMTIxOTlsMTQuMDUzMTQsLTExLjY3MDk3bC0xNC4wNTMxNCwtMTEuNjcwOTd6IiBmaWxsPSIjZmZmIi8+CiA8L2c+Cjwvc3ZnPg==') no-repeat;
transition: All 0.5s ease;-webkit-transition: All 0.5s ease;-moz-transition: All 0.5s ease;-o-transition: All 0.5s ease;
}


.swiper {
  width: 100%;
  height: 100vh;
  margin-left: auto;
  margin-right: auto;
}

.swiper-slide {
  background-size: cover;
  background-position: center;
}

.mySwiper2 {
  height:100vh;
  width: 100%;
}

.mySwiper{
  height:100vh;
  box-sizing: border-box;
  width:calc(100% - 400px);
  margin:0 auto;
  position:relative;
}


.su_8TT{
width:auto;
height:auto;
position:absolute;
left:30px;
top:220px;
font-size:72px;
line-height:90px;
color:#fff;
z-index:999999;
}
.mySwiper:before{
content: " ";
height:100vh;
position: absolute;
top:0;
width:1px;
z-index: 2;
box-sizing: border-box;
background-color:rgba(170,219,213,0.18);
left:0;
}

.mySwiper .swiper-slide {
  width: 25%;
  height:100vh;
  position:relative;
  display:block;
}
.mySwiper .swiper-slide:before{
content: " ";
height:100vh;
position: absolute;
top:0;
width:1px;
z-index: 2;
box-sizing: border-box;
background-color:rgba(170,219,213,0.18);
right:0;
}
.mySwiper .swiper-slide a{
width:100%;
height:100vh;
display:block;
}

.mySwiper .swiper-slide-thumb-active:hover {
 background-color: rgba(0, 0, 0, 0.2);
}

.mySwiper .swiper-slide-thumb-active .cas_8thb_B .cas_8thb_Ba{
bottom:160px;
}
.mySwiper .swiper-slide-thumb-active .cas_8thb_B .cas_8thb_Bb{
opacity:1;
bottom:130px;
}
.mySwiper .swiper-slide-thumb-active .cas_8thb_B .cas_8thb_Bc{
left:40px;
}

.mySwiper .swiper-button-next{
width:51px;
height:24px;
background:url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTEiIGhlaWdodD0iMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CgogPGc+CiAgPHRpdGxlPkxheWVyIDE8L3RpdGxlPgogIDxwYXRoIHN0cm9rZT0ibnVsbCIgaWQ9InN2Z18xIiBkPSJtMzYuODE3LDAuM2wtMi41NTUxMiwyLjEyMTk5bDkuNjcyOTQsOC4wMzMyNmwtNDMuODY2MDYsMGwwLDMuMjkxOTdsNDMuODY2MDYsLTAuMjYwNTZsLTkuNjcyOTQsOC4wMzMyNmwyLjU1NTEyLDIuMTIxOTlsMTQuMDUzMTQsLTExLjY3MDk3bC0xNC4wNTMxNCwtMTEuNjcwOTd6IiBmaWxsPSIjZmZmIi8+CiA8L2c+Cjwvc3ZnPg==') no-repeat;
opacity:0;
transition: All 0.5s ease;-webkit-transition: All 0.5s ease;-moz-transition: All 0.5s ease;-o-transition: All 0.5s ease;
}
.mySwiper .swiper-button-prev{
width:51px;
height:24px;
background:url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTEiIGhlaWdodD0iMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CgogPGc+CiAgPHRpdGxlPkxheWVyIDE8L3RpdGxlPgogIDxwYXRoIHN0cm9rZT0ibnVsbCIgaWQ9InN2Z18xIiBkPSJtMzYuODE3LDAuM2wtMi41NTUxMiwyLjEyMTk5bDkuNjcyOTQsOC4wMzMyNmwtNDMuODY2MDYsMGwwLDMuMjkxOTdsNDMuODY2MDYsLTAuMjYwNTZsLTkuNjcyOTQsOC4wMzMyNmwyLjU1NTEyLDIuMTIxOTlsMTQuMDUzMTQsLTExLjY3MDk3bC0xNC4wNTMxNCwtMTEuNjcwOTd6IiBmaWxsPSIjZmZmIi8+CiA8L2c+Cjwvc3ZnPg==') no-repeat;
transform: rotateY(180deg);
opacity:0;
transition: All 0.5s ease;-webkit-transition: All 0.5s ease;-moz-transition: All 0.5s ease;-o-transition: All 0.5s ease;
}

.swiper-button-disabled{
display:none;
}

.mySwiper:hover .swiper-button-next{opacity:1;}
.mySwiper:hover .swiper-button-prev{opacity:1;}

.swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}