.carousel {
	width: 100%;
  max-width: 100%;
    top: 80px;
	margin: 0px auto;
}

.carousel-cell {
  width: 100%;
  max-width: 100%;
  height: 600px;
  margin: 0 ;
	text-align: center;
    padding-bottom: 39.0625% !important;

}

/* arrow color */
.flickity-prev-next-button .arrow {
  fill: white;
}
.flickity-prev-next-button.no-svg {
  color: white;
}


/* hide disabled button */

.flickity-page-dots {
  bottom: 0px;
}

/* white circles */
.flickity-page-dots .dot {
  width: 12px;
  height: 12px;
  opacity: 1;
  background: transparent;
  border: 2px solid white;
}
/* fill-in selected dot */
.flickity-page-dots .dot.is-selected {
  background: white;
}

 
.banner_overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.2));
}



/*------------
首頁-banner 

----------------*/

.hero-slider .carousel-cell {
  width: 100%;
  max-width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;

}
/*-----edu style----*/
.hero-slider .flickity-prev-next-button {
  background: transparent;
   width: 40px;
   height: 40px;
   font-size: 0rem;
   text-indent: -9999px;
   background-color: transparent;
  
 
}
.hero-slider .flickity-prev-next-button:hover {
  background: transparent;
}
.hero-slider .flickity-prev-next-button .arrow {
  fill: white;
}

.hero-slider .flickity-page-dots .dot {
  width: 30px;
  height: 4px;
  opacity: 1;
  background: rgba(255, 255, 255, 0.5);
  border: 0 solid white;
  border-radius: 0;
}
.hero-slider .flickity-page-dots .dot.is-selected {
  background-color: #005bac;
  width:40px;
  border-radius: none;
}
         

.hero-slider .flickity-page-dots {
  bottom:50px;
}

.banner_Area {
    padding: 0px 180px;
    position: relative;
    top: 100px; /* 2024/08單位反應切圖 top: 70px; */
    width: 100%;
    max-width: 100%;
    width: 100vw;
    margin: 0px auto;
    background-image: url(/Images/bg/top_bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    overflow: hidden;
    min-height: 700px; /* min-height: 620px;*/
}

.hero-slider {
    max-height: 600px; /*max-height:550px;*/
    min-height: 1px;
    width: 100%;
    overflow: hidden;
    position: relative;
    display: block;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: auto;
    padding: 0;
    box-sizing: content-box;
}
@media (max-width: 1680px) {
  .banner_Area{ 
    padding:0px 120px;
    min-height:580px;
  }
  .hero-slider .flickity-page-dots {
    bottom:60px;
  }
  }

@media (max-width: 1440px) {

  .banner_Area {
    top:60px;
    padding: 0 90px;
    min-height:500px;}

    .hero-slider {
      max-height:500px;}

      .hero-slider .flickity-page-dots {
        bottom:70px;
      }

}

@media (max-width:1366px) {

  .banner_Area {
      top: 0px;
      padding: 0 60px;
      min-height: 420px
    }
  
    .hero-slider {
      max-height: 420px
    }
  
    .hero-slider .carousel-cell {
      background-position: 0 15%
    }
    
    .hero-slider .flickity-page-dots {
      bottom:40px;
    }
}
@media (max-width:1280px) {

.banner_Area {
  top: 60px;
}
.hero-slider .flickity-page-dots {
  bottom:70px;
}
}
@media (max-width:1024px) {

  .banner_Area {
    top: 60px;
    padding: 0 30px;
    min-height: 400px;
  }


  .hero-slider {
    max-height: 420px
  }
}


@media (max-width:991px) {

  .banner_Area {
    padding: 0 30px;
    min-height: 380px;
  }


  .hero-slider {
    max-height: 380px
  }
}

@media (max-width:932px) {

  .banner_Area {
    padding: 0 20px;
    min-height: 350px;
  }


  .hero-slider {
    max-height: 350px
  }

  .hero-slider .carousel-cell {
    background-position: 0 0;
}
}



@media (max-width:844px) {
  .hero-slider .flickity-prev-next-button {
    width: 30px;
    height: 30px
  }

  .banner_Area {
    min-height: 310px;
  }


  .hero-slider {
    max-height: 350px
  }

  .hero-slider .flickity-page-dots .dot {
    width: 25px;
    height: 2px;
  }

  .hero-slider .flickity-page-dots .dot.is-selected {
    width: 30px;
  }

  .flickity-page-dots .dot {
    margin: 0 5px
  }
  .flickity-prev-next-button .flickity-button-icon {
    left: 0%;
    top: 0%;}
}

@media (max-width:667px) {

  .banner_Area {
    padding: 0 15px;
    min-height:200px;
  }


  .hero-slider {
    max-height: 250px
  }
 
}
@media (max-width:430px) {
.banner_Area {
  padding:0
}

.hero-slider .flickity-page-dots {
  bottom:40px;
}
}

@media (max-width:390px) {
  .hero-slider .flickity-page-dots {
    bottom:35px;
  }

  .banner_Area {
    min-height:185px;
  }


  .hero-slider {
    max-height: 200px
  }

}