@charset "UTF-8";
/* 宣告 */
/* 無障礙 focus 控制
   - 滑鼠點擊不顯示外框
   - 鍵盤操作（Tab）才顯示 focus 樣式(可自定樣式)
*/
:where(a, button, input, textarea, select, summary, [tabindex]):focus:not(:focus-visible) {
  outline: none;
}
:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
  outline: 2px solid #000;
  outline-offset: 3px;
}

:root {
  --header-h: 80px;
  --gap: 25px;
  --gap-sec: max(50px, 12vh);
  --h-input: 50px;
  --w-label: max(5em, 70px);
  --h-btn-lg: 50px;
  --h-btn-sm: 40px;
  --fs-h1: clamp(1.625rem, 1.3545rem + 0.7463vw, 2.25rem);
  --fs-h2: clamp(1.5rem, 1.1754rem + 0.8955vw, 2.25rem);
  --fs-h3: clamp(1.375rem, 1.2668rem + 0.2985vw, 1.625rem);
  --fs-h4: clamp(1.25rem, 1.1418rem + 0.2985vw, 1.5rem);
  --fs-h5: clamp(1.1875rem, 1.1063rem + 0.2239vw, 1.375rem);
  --fs-h6: clamp(1.0625rem, 1.0084rem + 0.1493vw, 1.1875rem);
  --w-container: 1290px;
}

@media (max-width: 1199px) {
  :root {
    --header-h: 70px;
  }
}
@media (max-width: 991px) {
  :root {
    --gap-sec: max(45px, 7vh);
  }
}
@media (max-width: 499px) {
  :root {
    --gap: 15px;
  }
}
/* ==== swiper ==== */
/* 共用樣式 .swiper */
.swiper {
  position: relative;
  font-size: 0;
  line-height: 0;
}
.swiper .swiper-wrapper .swiper-slide {
  position: relative;
}
.swiper .swiper-wrapper .swiper-slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

/* pagination 點 */
.swiper-pagination {
  z-index: 5;
  bottom: 0 !important;
  padding: 0 10px;
  font-size: 0;
  text-align: center;
  line-height: 0;
}
.swiper-pagination .swiper-pagination-bullet {
  display: inline-block;
  margin: 0 4px !important;
  padding: 0;
  width: 10px;
  height: 10px;
  opacity: 1;
  border: none;
  border-radius: 100%;
  background-color: #ddd;
  -webkit-transition: background-color 0.35s;
  transition: background-color 0.35s;
}
.swiper-pagination .swiper-pagination-bullet:hover, .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #8f714d;
}

/* scrollbar */
.swiper-scrollbar {
  left: 0 !important;
  width: 100% !important;
  height: 4px;
}

/* navigation 左右箭頭 */
.swiper-aw {
  display: block;
  z-index: 5;
  top: 50%;
  margin: 0;
  width: 40px;
  height: auto;
  font-size: 0;
  outline: none;
  border: #8f714d solid 1px;
  border-radius: 100%;
  background-color: #fff;
  -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0px 3px 5px;
          box-shadow: rgba(0, 0, 0, 0.1) 0px 3px 5px;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-transition: background-color 0.35s;
  transition: background-color 0.35s;
}
.swiper-aw::before {
  display: block;
  content: "";
  padding-bottom: 100%;
  width: 100%;
}
.swiper-aw::after {
  display: none;
}
.swiper-aw i {
  display: block;
  position: absolute;
  top: 50%;
  left: 52%;
  width: 100%;
  max-width: 17px;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.swiper-aw i::before, .swiper-aw i::after {
  content: "";
  position: absolute;
  top: 50%;
}
.swiper-aw i::before {
  margin-top: -4px;
  right: 0;
  width: 9px;
  height: 9px;
  border-width: 1px;
  border-style: solid;
  border-color: #8f714d #8f714d transparent transparent;
  -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
          transform-origin: center center;
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}
.swiper-aw i::after {
  left: 0;
  width: 100%;
  height: 1px;
  background: #8f714d;
}
.swiper-aw:hover {
  background-color: #8f714d;
}
.swiper-aw:hover i::before {
  border-color: #fff #fff transparent transparent;
}
.swiper-aw:hover i::after {
  background: #fff;
}
.swiper-aw.swiper-button-disabled {
  pointer-events: auto;
  cursor: not-allowed !important;
}
@media (max-width: 991px) {
  .swiper-aw {
    width: 32px;
  }
  .swiper-aw i {
    max-width: 12px;
  }
  .swiper-aw i::before {
    margin-top: -3.5px;
    width: 7px;
    height: 7px;
  }
}

.swiper-button-prev {
  left: 0;
}
.swiper-button-prev i {
  left: 48%;
  -webkit-transform: translate(-50%, -50%) rotate(180deg);
      -ms-transform: translate(-50%, -50%) rotate(180deg);
          transform: translate(-50%, -50%) rotate(180deg);
}

.swiper-button-next {
  right: 0;
}

/* 隱藏按鈕 */
.is-prevent-btn .control-btn {
  display: none !important;
  pointer-events: none;
}
.is-prevent-btn .swiper-aw {
  display: none;
}

/* 置中 */
.is-center .swiper {
  padding-bottom: 0 !important;
}
.is-center .swiper-wrapper {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}