
body {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: 0;  /* Firefox */
}
body::-webkit-scrollbar {
  display: none;
}

.controls {
  position: fixed;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  list-style: none;
  z-index: 1000;
}

.controls li {
  width: 30px;
  height: 30px;
  font: bold 16px/30px '宋体';
  text-align: center;
  background-color: #8db49a;
  color: white;
  cursor: pointer;
  border-radius: 50%;
}

.controls li+li {
  margin-top: 5px;
}

.controls li.active {
  background-color: #227764;
  color: #fff;
}

.my-bullet {
  width: 10px;
  height: 10px;
  display: block;
  background-color: #8db49a;
  border-radius: 50%;
  margin: auto;
}
.my-bullet ~ .my-bullet {
  margin-top: 10px;
}
.my-bullet-active{
  
  width: 15px;
  height: 15px;
  background: #227764 !important;
  opacity: 1 !important;
}

.my-bullet1 {
  width: 10px;
  height: 10px;
  display: block;
  background-color: #fff;
  border-radius: 50%;
  margin: auto;
}

.my-bullet1-active{
  
  width: 25px;
  height: 10px;
  opacity: 1 !important;
  border-radius: 15px;
}
/* .swiper .screen {
  padding: 0;
}
.swiper .container {
  padding-top: 110px ;
  height: 100vh;
}
.swiper .slideFooter {
  height: 300px;
} */
@media (min-width: 993px) { 
  /* .swiper .container {
    padding-top: 90px;
    height: 100vh;
  } */
  .swiper .slideFooter {
    height: 380px;
    padding-top: 60px;
    box-sizing: border-box;
  }
  .footer-section {
    padding: 0 20px;
  }
  .textDuiqi {
    display: inline-block;
    font-weight: bold;
    letter-spacing: 2px;
  }
  .swiper .anli {
    padding-top: 100px;
  }
  .nav.tab-style-one {
    margin-top: 20px;
  }
  .about-content {
    position: relative;
  }
  .about-content .solar-button {
    position: absolute;
    bottom: 10px;
    right: 20px;
  }
  .aboutContainer {
    padding-top: 120px;
  }
  p.about-desc {
    width: 100%;
  }
  .screen {
    height: 100vh;
    padding: 0;
    padding-top: 102px;
  }
  .swiper-wrapper1 .swiper-slide:first-child .screen {
    padding: 0;
  }
  .swiper-wrapper1 .swiper-slide:last-child .screen {
    padding: 0;
  }
  .screen .container {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
}
@media (max-width: 768px) { 
  .meta-blog-3 {
    text-align: left;
  }
  .news-right {
    padding: 0 12px !important;
  }
  .blog-content-4 {
    padding: 20px 22px 25px;
  }
  .about-content .solar-button {
   display: block;
   text-align: right;
  }
  .about-thumb img {
    padding: 0;
  }
  .swiper3 {
    margin-bottom: 20px;
  }

  .portfolio-button a{
    padding: 4px 10px;
  }
}
.owl-dots {
  position: absolute;
  bottom: 20px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 50px;
}
.owl-dot.active {
  margin-top: 0;
}
.owl-dots div {
  margin-top: 0;
}
.swiper-pagination1 {
  position: absolute;
  bottom: 20px !important;
  left: 50% !important;
  transform: translateX(-50%);
  width: 120px !important;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10;
  color: #fff;
}
#xl_chrome_ext_4DB361DE-01F7-4376-B494-639E489D19ED {
  display: none !important;
}
/* .about-list-item ul li span {
  font-size: 12px;
} */
div[data-v-app] {
  display: none !important;
}
.single-portfolio-box.inner {
  margin: 0;
}
.swiper-wrapper3 {
  flex-wrap: nowrap;
}
.swiper-pagination3 {
  position: absolute;
  bottom: 0px !important;
  left: 50% !important;
  transform: translateX(-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10;
  column-gap: 10px;
}

.my-bullet3 {
  width: 10px;
  height: 10px;
  display: block;
  background-color: #8db49a;
  border-radius: 50%;
}

.my-bullet3-active{
  
  width: 40px;
  height: 10px;
  opacity: 1 !important;
  border-radius: 15px;
  background-color: #227764;
}
.swiper3  {
  padding-bottom: 30px !important;
}
/* 飞窗动画样式 */
/* 更酷炫的飞窗动画，h1和h4不同方向和速度，慢一点且无倾斜 */
/* 默认飞窗动画 */
.slider-content h1,
.slider-content h4 {
  opacity: 0;
}


/* 默认隐藏 h1 和 h4 */
.slider-content h1,
.slider-content h4 {
  opacity: 0;
}

/* 默认飞窗动画 */
.slider-content.flyin h1 {
  animation: flyin-h1 1.2s cubic-bezier(0.23, 1, 0.32, 1);
  animation-fill-mode: forwards;
}
.slider-content.flyin h4 {
  animation: flyin-h4 1.5s cubic-bezier(0.23, 1, 0.32, 1);
  animation-fill-mode: forwards;
}

/* 针对不同slide的差异化动画，优先级更高，覆盖默认动画 */
.slider-3 .slider-content.flyin h1 {
  animation: flyin-h1-left 1.2s cubic-bezier(0.23, 1, 0.32, 1) !important;
  animation-fill-mode: forwards !important;
}
.slider-4 .slider-content.flyin h1 {
  animation: flyin-h1-top 1.2s cubic-bezier(0.23, 1, 0.32, 1) !important;
  animation-fill-mode: forwards !important;
}
.slider-5 .slider-content.flyin h1 {
  animation: flyin-h1-rotate 1.2s cubic-bezier(0.23, 1, 0.32, 1) !important;
  animation-fill-mode: forwards !important;
}

/* 你可以继续为其他slide添加不同动画 */

@keyframes flyin-h1 {
  0% { opacity: 0; transform: translateX(-80px) scale(0.92); filter: blur(8px);}
  60% { opacity: 1; transform: translateX(8px) scale(1.04); filter: blur(0);}
  100% { opacity: 1; transform: translateX(0) scale(1); filter: blur(0);}
}
@keyframes flyin-h4 {
  0% { opacity: 0; transform: translateY(60px) scale(0.96); filter: blur(10px);}
  60% { opacity: 1; transform: translateY(-6px) scale(1.03); filter: blur(0);}
  100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0);}
}
@keyframes flyin-h1-left {
  0% { opacity: 0; transform: translateX(-120px) scale(0.9);}
  100% { opacity: 1; transform: translateX(0) scale(1);}
}
@keyframes flyin-h1-top {
  0% { opacity: 0; transform: translateY(-80px) scale(0.9);}
  100% { opacity: 1; transform: translateY(0) scale(1);}
}
@keyframes flyin-h1-rotate {
  0% { opacity: 0; transform: rotateY(60deg) scale(0.8);}
  100% { opacity: 1; transform: rotateY(0) scale(1);}
}

.blog-content-2 h4 a {
  /* padding: 0; */
  margin: 0;
}
.portfolio-thumb>h1 {
  position: absolute;
  top: 20px;
  display: flex;
  justify-content: center;
  width: 100%;
  z-index: 99999;
}
.portfolio-thumb>h1 a{
    font-size: 32px;
    font-weight: 500;
    display: inline-block;
    font-family: 'Rubik';
    padding-bottom: 11px;
    transition: 0.5s;
    color: #fff;
}
.portfolio-content h4 {
  margin-bottom: 35px;
  font-size: 16px;
}
.portfolio-content {
  padding-bottom: 65px;
  height: 100%;
  padding-top: 60px;
  display: flex;
  align-items: flex-end;
}
.portfolio-content .portfolio-button {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 65px;
  background: #227764;
  display: flex;
  align-items: center;
  justify-content: center;
}
.portfolio-content .portfolio-button a {
  width: 100%;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-size: 18px;
  line-height: 36px;
}

.portfolio-button a:hover{
  color: #fff;
  background: #227764;
}
.portfolio-button a i {
  color: #fff;
  background: #227764;
  font-size: 18px;
  margin-left: 8px;
  line-height: normal;
  width: auto;
  height: auto;
  margin-top: 2px;
}
.portfolio-button a:hover:before {
  display: none;
}
@media (max-width: 768px) { 
  .portfolio-thumb>h1 {
    top: 10px;
  }
  .portfolio-thumb>h1 a {
    font-size: 16px;
  }
  .portfolio-content h4 {
    margin-bottom: 20px;
    font-size: 14px;
  }
  .portfolio-content .portfolio-button {
    height: 50px;
  }
  .portfolio-content .portfolio-button a {
    font-size: 15px;
  }
  .portfolio-button a i {
    font-size: 15px;
  }
}

.swiper3-button-prev,
.swiper3-button-next {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    border-radius: 50%;
    background: #227764;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    transition: background 0.3s;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);;
    border: none;
    padding: 0;
}
.swiper3-button-prev:hover,
.swiper3-button-next:hover {
    background: #227764;
    color: #fff;
}
.swiper3-button-prev:after,
.swiper3-button-next:after {
    font-size: 22px  !important;
    font-weight: bold;
    color: #fff;         /* 箭头为白色 */
    margin: 0;
    line-height: 1  !important;
    display: block;
}