/* 首頁廣告圖片 20241217 */
body.hideWindow {
  overflow: hidden;
}

.indexImg {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 999999;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  background: rgba(255, 255, 255, .5);
  padding: 20px;
}

.indexImg::before {
  content: '';
  width: 100%;
  height: 100%;
  backdrop-filter: blur(5px);
  position: absolute;
  left: 0;
  top: 0;
  z-index: 0;
}

.indexImg_cont {
  position: relative;
  z-index: 5;
  overflow: hidden;
  max-width: 100%;
  max-height: 100%;
  display: flex;
}

.indexImg_cont form {
  max-height: 100%;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: center;
  align-items: center;
}

.indexImg_close {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 20;
  font-size: 20px;
  padding: 10px;
  line-height: 1;
  cursor: pointer;
  background: rgba(255, 255, 255, .3);
}

.indexImg_check {
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  /* width: 100%; */
  padding: 10px;
}

.indexImg_check input+label {
  padding-left: 10px;
}

.swiper-indexImg {
  width: 100%;
  max-height: calc(100% - 2em);
  max-width: 100%;
  overflow: hidden;
}

.swiper-indexImg a {
  max-width: 100%;
  max-height: 100%;
  display: block;
}

.swiper-indexImg img {
  max-width: 100%;
  max-height: 80vh;
  display: block;
}




/*首頁*/
.bannerindex {
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  position: fixed;
  --swiper-navigation-color: #dfdfdf;
  --swiper-pagination-color: #dfdfdf;
  --swiper-pagination-bullet-inactive-color: #dfdfdf;
  --swiper-pagination-bullet-size: 10px;
  --swiper-pagination-bullet-inactive-opacity: .5;
  --swiper-pagination-bullet-horizontal-gap: 5px;
  --swiper-pagination-bullet-width: 3em;
  --swiper-pagination-bullet-height: 3px;
  --swiper-pagination-bullet-border-radius: 0;
}

.bannerindex * {
  -webkit-transition: ease .3s;
  -moz-transition: ease .3s;
  -ms-transition: ease .3s;
  -o-transition: ease .3s;
  transition: ease .3s;
}

.swiper-banner {
  width: 100%;
  height: 100vh;
  position: absolute;
  left: -50%;
  margin-left: 50%;
}

.swiper-banner .swiper-slide img {
  width: 100%;
  max-width: 100%;
  /* height: 100vh */
  height: auto;
  display: block;
}

.effect1 img {
  transform: scale(1.05, 1.05) translate(5%, 5%);
  transform: scale(1.05, 1.05) translate(0.5%, 0.5%);
  /*tr     =    (sc-1)/2sc*100%              */
  /* --1.25       0.25/2.5*100%=10%          */
}

.leftUp img {
  -webkit-animation-name: leftUp;
  animation-name: leftUp;
}

@-webkit-keyframes leftUp {
  0% {
    transform: scale(1.05, 1.05) translate(0.5%, 0.5%);
  }

  100% {
    transform: scale(1.05, 1.05) translate(-0.5%, -0.5%);
  }
}

@keyframes leftUp {
  0% {
    transform: scale(1.05, 1.05) translate(0.5%, 0.5%);
  }

  100% {
    transform: scale(1.05, 1.05) translate(-0.5%, -0.5%);
  }
}

.moveRight img {
  -webkit-animation-name: moveRight;
  animation-name: moveRight;
}

@-webkit-keyframes moveRight {
  0% {
    transform: scale(1.05, 1.05) translate(-0.5%, 0);
  }

  100% {
    transform: scale(1.05, 1.05) translate(0.5%, 0);
  }
}

@keyframes moveRight {
  0% {
    transform: scale(1.05, 1.05) translate(-0.5%, 0);
  }

  100% {
    transform: scale(1.05, 1.05) translate(0.5%, 0);
  }
}

.moveDown img {
  -webkit-animation-name: moveDown;
  animation-name: moveDown;
}

@-webkit-keyframes moveDown {
  0% {
    transform: scale(1.05, 1.05) translate(0, -0.5%);
  }

  100% {
    transform: scale(1.05, 1.05) translate(0, 0.5%);
  }
}

@keyframes moveDown {
  0% {
    transform: scale(1.05, 1.05) translate(0, -0.5%);
  }

  100% {
    transform: scale(1.05, 1.05) translate(0, 0.5%);
  }
}

.centerBig img {
  -webkit-animation-name: centerBig;
  animation-name: centerBig;
}

@-webkit-keyframes centerBig {
  100% {
    transform: scale(1.05, 1.05);
  }
}

@keyframes centerBig {
  100% {
    transform: scale(1.05, 1.05);
  }
}

.rightDownBig img {
  -webkit-animation-name: rightDownBig;
  animation-name: rightDownBig;
}

@-webkit-keyframes rightDownBig {
  100% {
    transform: scale(1.05, 1.05) translate(0.5%, 0.5%);
  }
}

@keyframes rightDownBig {
  100% {
    transform: scale(1.05, 1.05) translate(0.5%, 0.5%);
  }
}

.swiper-banner .swiper-slide img {
  animation-duration: 5s;
  animation-timing-function: linear;
  animation-fill-mode: forwards;
  -webkit-animation-duration: 5s;
  -webkit-animation-timing-function: linear;
  -webkit-animation-fill-mode: forwards;
}

/* .swiper-pagination {
	bottom: 15px;
	left: 50%;
	margin-left: -45px;
} */

/* .swiper-banner .swiper-pagination-bullet {
	width: 10px;
	height: 10px;
	margin: 0 5px;
}

.swiper-banner .swiper-slide img {
	opacity: 0 !important;
}

.swiper-banner .swiper-slide-active img {
	opacity: 1 !important;
}
*/

.mobile_wp {
  display: none;
}

.sb_marquee {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  padding: .5em 0;
}

.sb_marquee p {
  display: inline-block;
  margin: 0;
}

@media screen and (max-width: 768px) {
  .bannerindex {
    position: relative;
    height: 0;
    padding-bottom: 47%
  }

  .swiper-banner {
    left: 0;
    margin: 0;
  }

  .swiper-banner .swiper-slide img {
    height: auto;
  }

  #content_main {
    margin-top: 0;
  }
}

/* 20261012新增切版 */


.swiper-banner .swiper-slide:has(.bannerindex_text) {
  background: #000 !important;
}

.swiper-banner .swiper-slide:has(.bannerindex_text) img {
  opacity: 0.7;
}

.swiper-banner .swiper-slide a {
  position: relative;
  display: block;
  height: min(520px, 90dvh);
  overflow: hidden;
}

.swiper-banner .swiper-slide a>img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
  animation: none;
}

@media (min-width:601px) {

  .swiper-banner .swiper-slide:nth-child(3) a>img {
    object-position: 50% 70%;
  }
}


.bannerindex_text {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: center;
  justify-content: center;
  text-align: center;
  color: #FFFFFF;
  width: 100%;
  top: 28%;
  left: 0;
  z-index: 10;
  padding: 0 min(20px, 4vw);
  font-size: 16px;
  --ban_text_gap: min(20px, 4vw);
}

.bannerindex_text .pc_hide {
  display: none;
}

.bannerindex_text figure {
  font-family: var(--ffMain);
  width: fit-content;
  padding-bottom: var(--ban_text_gap);
  border-bottom: 2px solid #FFFFFF;
  margin-bottom: var(--ban_text_gap);
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: center;
  justify-content: center;
  width: min(1000px, 100%);
}

.bannerindex_text h3 {
  font-size: min(1.5em, 4vw);
  font-weight: 300;
  line-height: 1.8;
}

.bannerindex_text h6 {
  font-size: min(2.5em, 6.5vw);
  font-weight: bold;
  font-family: var(--ffNunitoSans);
  line-height: 1.2;
}

.bannerindex_text p {
  width: 100%;
  max-width: 1000px;
  opacity: .95;
  font-size: min(1em, 1.9vw);
  font-weight: 200;
  letter-spacing: .05em;
  text-shadow: 0px 0px 5px rgba(0, 0, 0, .3), 0px 0px 5px rgba(0, 0, 0, .3), 0px 0px 5px rgba(0, 0, 0, .3), 0px 0px 5px rgba(0, 0, 0, .3);
}

.bannerindex_text p span{display: block;}

@media (max-width:1024px) {
  .bannerindex_text h3 {
    font-size: min(2em, 4vw);
  }
}

@media (max-width:850px) {

  .bannerindex_text .tab_show {
    display: inline;
  }

  .bannerindex_text .tab_hide {
    display: none;
  }

  .bannerindex_text {
    transform: translateY(-50%);
    --ban_text_gap: min(10px, 2vw);
    top: 50%;
  }

  .bannerindex_text h6 {
    font-size: min(4em, 5vw);
  }

  .bannerindex_text h3 {
    font-size: min(2em, 3.5vw);
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    line-height: 1.4;
    min-height: 2.8em;
  }

  .bannerindex_text p {
    font-size: min(1.25em, 2vw);
  }
}

@media (max-width:600px) {

  .bannerindex_text {
    padding-top: 0;
  }

  .bannerindex_text .pc_hide {
    display: inline;
  }

  .bannerindex_text .mob_hide {
    display: none;
  }

  .bannerindex:has(.bannerindex_text),
  .swiper-banner:has(.bannerindex_text) {
    height: auto;
  }

  .swiper-banner .swiper-slide:has(.bannerindex_text) a {
    height: calc(100dvh - 100px - var(--header_h));
  }

  .swiper-banner .swiper-slide:has(.bannerindex_text) img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .bannerindex_text h3 {
    font-size: min(1.5em, 7vw);
    margin-top: .2em;
  }

  .bannerindex_text h6 {
    text-align: center;
    max-width: 7em;
    font-size: min(2.5em, 15vw);
    line-height: 1;
  }

  .bannerindex_text p {
    font-size: min(1em, 4vw);
    font-weight: normal;
  }

  .bannerindex_text p span{margin-top: .8em;}
}