@charset "UTF-8";

.introduces {
  /* ---andy 2023/08/29      */
  /* .swal2-popup{
       width: auto !important;
    }
    */
  /* ---andy end      */
  /* ---andy 2023/09/05      */
  /* ---andy end      */
  /* 為了sm  576px設限制*/
}

.introduces .position {
  position: absolute;
  top: 125px;
  font-size: 31px;
  right: 12px;
}

.introduces .real-time-positioning {
  position: absolute;
  top: 200px;
  right: -16px;
  font-size: 20px;
  transform: rotate(90deg);
}

.introduces input:focus {
  border: transparent !important;
}

.introduces #map {
  height: 600px;
  width: 100%;
}

.introduces .map-box {
  position: relative;
}

.introduces .map-List {
  position: absolute;
  top: 40px;
  left: 60px;
  width: 300px;
  max-height: 500px;
  overflow-x: auto;
  overflow-y: scroll;
}

.introduces .map-List::-webkit-scrollbar {
  display: none;
}

.introduces .main-list .accordion-button {
  font-size: 19px;
}

.introduces .main-list-content {
  font-size: 16px;
}

.introduces .main-list-content img {
  width: 20px;
}

.introduces .select_list select {
  width: 200px;
}

.introduces .non-person {
  fill: #e60012;
}

.introduces .person {
  fill: #0473ea;
}

.introduces .btn.bg-light-blue {
  background-color: #008cd6;
}

.introduces .btn.bg-red {
  background-color: #e60012;
}

.introduces .no-break {
  white-space: nowrap;
}

.introduces .swal2-title {
  margin-bottom: 0 !important;
}

.introduces .select-type-1 {
  background-position: right 10px bottom 20px !important;
}

.introduces #select-nav-list {
  text-align: center;
}

.introduces .large-svg {
  transform: scale(1.9);
  margin-right: 20px;
}

@media (max-width: 768px) {
  .introduces .select_list select {
    width: auto;
  }

  .introduces .sh-select.select-type-1.full {
    width: 100%;
  }
}

@media (max-width: 768px) {
  .introduces .map-List {
    width: 100%;
    position: unset;
  }

  .introduces #map {
    height: 400px;
  }

  .introduces .position-relative {
    margin-bottom: 20PX;
  }
}

@media (max-width: 992px) {
  .introduces .select_list {
    margin-top: 20px !important;
    margin-bottom: -30px;
  }
}

.introduces .copy-url img {
  width: 34px;
  height: 34px;
}

.introduces .place-bar {
  color: #212529;
  font-family: Microsoft JhengHei;
  font-size: 18px !important;
  font-style: normal;
  font-weight: bold;
  line-height: 1.4;
}

.introduces .sub-store-content.py-4.px-32 {
  min-height: 245px;
  border-radius: 8px;
  border: 2px solid var(--Gray-500, #ADB5BD);
}

.introduces .store-content {
  padding: 20px 0px 120px 0px;
}

.introduces .title-name {
  width: 28px;
  height: 35px;
  transform: translate(0px, -3px);
}

.introduces .navigation,
.introduces .appointment {
  border: 1px solid #E60012;
}

.introduces .appointment:hover {
  background: #E60012;
  box-shadow: 0px 2px 3px 1px rgba(0, 0, 0, 0.35);
}

.introduces .appointment:active {
  background: #AB000D !important;
}

.introduces .copy-url-svg {
  margin-bottom: 20px;
  color: #6C757D;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-decoration-line: underline;
  text-align: right;
}

@media (max-width: 768px) {
  .introduces .copy-url-svg {
    margin-bottom: unset;
  }
}

.introduces .copy-url-svg:hover {
  color: #495057;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-decoration-line: underline;
}

.introduces .copy-url-svg:hover img {
  filter: brightness(0.5);
}

.introduces .go-to-map {
  width: 128px;
  height: 42px;
  border-radius: 100px;
  border: 1px solid #ADB5BD;
  color: #212529;
  font-family: Microsoft JhengHei;
  font-size: 18px;
  font-style: normal;
  font-weight: lighter;
  line-height: 40px;
  /* 25.2px */
  text-align: center;
  cursor: pointer;
}

.introduces .go-to-map:hover {
  border-radius: 100px;
  border: 1px solid #ADB5BD;
  background: #F8F8F8;
}

.introduces .go-to-map:active {
  border-radius: 100px;
  border: 1px solid #495057;
  background: #E9ECEF;
}

.introduces .go-to-map a {
  color: #212529;
  display: block;
}

.introduces .go-to-map:active a {
  color: #212529;
}

.introduces .go-to-map:hover a {
  color: #212529;
}

.introduces .sub-select-person-input {
  width: 164px !important;
  height: 43px !important;
  color: #212529 !important;
  font-family: Microsoft JhengHei !important;
  font-size: 18px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 31px !important;
  /* 25.2px */
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.introduces .select-person {
  margin-top: 20px;
  margin-bottom: 20px;
}

.introduces .person-bottom {
  display: none;
  position: absolute;
  width: 164px;
  border-radius: 4px;
  text-align: center;
  padding: 4px 0px;
  border-radius: 4px;
  background: #FFF;
  box-shadow: 0px 7px 20px 2px rgba(0, 0, 0, 0.25);
  top: 50px;
  z-index: 1;
}

@media (max-width: 768px) {
  .introduces .person-bottom {
    display: none !important;
  }
}

.introduces .person-bottom .text:hover {
  background-color: #E9ECEF;
}

.introduces .person-bottom .text:active {
  background-color: #DEE2E6;
}

.introduces .person-bottom .text {
  height: 39px;
  color: #212529;
  font-family: Microsoft JhengHei;
  font-size: 18px;
  font-style: normal;
  font-weight: lighter;
  line-height: 27px;
  padding: 6px 16px;
}

.introduces .person-bottom .text img {
  width: 22px;
}

.introduces .sub-select-person:hover .person-bottom {
  display: block;
}

.introduces .bridge {
  height: 50px;
  position: absolute;
  width: 100%;
  background-color: rgba(0, 0, 0, 0);
  display: none;
}

.introduces .sub-select-person:hover .bridge {
  display: block;
}

.introduces .sub-app {
  min-width: 650px;
  width: 65%;
}

@media (max-width: 768px) {
  .introduces .sub-app {
    min-width: unset;
    width: 100% !important;
  }
}

.introduces .accordion-item {
  cursor: pointer;
  width: -moz-max-content !important;
  width: max-content !important;
}

@media (max-width: 768px) {
  .introduces .accordion-item {
    white-space: nowrap;
    width: -moz-max-content !important;
    width: max-content !important;
  }
}

.introduces .accordion-item.active {
  border-bottom: 3px solid #0094D8 !important;
}

.introduces #pc-content {
  display: flex !important;
}

@media (max-width: 768px) {
  .introduces #pc-content {
    display: none !important;
  }
}

.introduces #mb-content {
  display: none !important;
}

@media (max-width: 768px) {
  .introduces #mb-content {
    display: flex !important;
  }
}

.introduces #menu-swiper {
  overflow: hidden !important;
  width: 950px;
  max-width: 100%;
}

.introduces .parent-swipper {
  width: 100%;
  height: 60px;
}

.introduces .swiper-slide {
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}

.introduces .reserve_car_rental {
  color: #FFF;
}

.introduces .reserve_car_rental:hover {
  color: #FFF;
}

.introduces .van-picker-bottom {
  display: none;
}

.introduces li.van-picker-column__item.van-picker-column__item--selected {
  color: #000;
}

.introduces .van-picker-bottom li {
  color: #ADB5BD;
  font-size: 22px;
}

.introduces .not-van-picker-bottom {
  display: block;
}

.introduces .not-van-picker-bottom>div {
  padding: 5px 24px;
}

.introduces .not-van-picker-bottom>div:hover {
  background-color: #E9ECEF;
}

.introduces .van-picker__columns::before {
  position: absolute;
  content: "";
  top: 50%;
  transform: translate(16px, -50%);
  left: 0;
  right: 0;
  width: calc(100% - 32px);
  height: 44px;
  background: rgb(234, 236, 238);
  border-radius: 5px;
  pointer-events: none;
  padding: 0px 16px;
}

.introduces .van-picker__columns {
  background-color: #fff;
  display: none !important;
}

.introduces .van-picker {
  background-color: rgba(0, 0, 0, 0);
  border-radius: 10px 10px 0px 0px;
}

.introduces .van-picker__toolbar {
  height: 56px;
  font-size: 20px;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  background-color: #fff;
}

.introduces [class*=van-hairline]::after {
  position: absolute;
  box-sizing: border-box;
  content: " ";
  pointer-events: none;
  top: -50%;
  right: -50%;
  bottom: -50%;
  left: -50%;
  border: 0 solid #ebedf0;
  transform: scale(0.5);
}

.introduces .not-van-picker-bottom {
  display: block;
  background-color: #fff;
  position: absolute;
  border-radius: 4px;
  z-index: 100;
  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.12);
}

@media (max-width: 768px) {
  .introduces .van-picker-bottom {
    position: fixed;
    bottom: 0px;
    right: 0px;
    left: 0px;
    z-index: 10000;
    display: none;
  }
}

@media (max-width: 768px) {
  .introduces .van-picker-bottom.show {
    display: block;
    position: fixed;
    bottom: 0px;
    right: 0px;
    left: 0px;
    z-index: 1000000;
  }
}

@media (max-width: 768px) {
  .introduces .van-picker__title {
    max-width: 50%;
    font-weight: 500;
    font-size: 20px;
    line-height: 20px;
    text-align: center;
    font-weight: bold;
  }
}

@media (max-width: 768px) {

  .introduces .van-picker__cancel,
  .introduces .van-picker__confirm {
    font-size: 20px;
  }
}

@media (max-width: 768px) {
  .introduces .van-picker__confirm {
    color: #0094D8;
  }
}

@media (max-width: 768px) {
  .introduces .not-van-picker-bottom {
    display: none;
  }
}

.introduces .mb-person {
  display: none !important;
}

@media (max-width: 768px) {
  .introduces .mb-person {
    display: block !important;
  }
}

.introduces .vant-mask {
  display: none;
  background-color: rgba(0, 0, 0, 0.45);
  position: fixed;
  right: 0px;
  left: 0px;
  top: 0px;
  bottom: 0px;
  z-index: 10000;
}

@media (max-width: 768px) {
  .introduces .vant-mask {
    display: block;
  }
}

.introduces .wrap-div {
  padding: 0px 30px 63px 30px;
  color: #212529;
  font-family: Microsoft JhengHei;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 140%;
  /* 25.2px */
}

.introduces .wrap-div div.focus {
  color: #0094D8;
}

.introduces .focus .done {
  visibility: visible;
}

.introduces .all {
  border-bottom: 1px solid #DEE2E6;
  padding: 16px 0px;
}

.introduces .has {
  border-bottom: 1px solid #DEE2E6;
  padding: 16px 0px;
}

.introduces .without {
  padding: 16px 0px;
}

.introduces .has>img {
  width: 22px;
  margin-right: 4px;
}

.introduces .without>img {
  width: 22px;
  margin-right: 4px;
}

.introduces .done {
  float: right;
  visibility: hidden;
}

@media (max-width: 768px) {
  .introduces .van-picker__title {
    max-width: 50% !important;
    font-weight: 500 !important;
    font-size: 20px !important;
    line-height: 20px !important;
    text-align: center !important;
    font-weight: bold !important;
  }
}

@media (max-width: 768px) {
  .introduces .van-picker__confirm {
    color: #0094D8 !important;
    text-align: center;
    font-family: Noto Sans TC;
    font-size: 20px !important;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
  }
}

@media (max-width: 768px) {
  .introduces .van-picker__cancel {
    color: #212529 !important;
    text-align: center;
    font-family: Noto Sans TC;
    font-size: 20px !important;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
  }
}

.introduces .navigation:hover {
  color: #E60012 !important;
  border: 1px solid #E60012 !important;
  background: linear-gradient(0deg, rgba(220, 53, 69, 0.1) 0%, rgba(220, 53, 69, 0.1) 100%), #FFF !important;
  box-shadow: 0px 2px 3px 1px rgba(0, 0, 0, 0.35);
}

.introduces .navigation:active {
  border: 1px solid #AB000D !important;
  background: linear-gradient(0deg, rgba(220, 53, 69, 0.1) 0%, rgba(220, 53, 69, 0.1) 100%), #FFF !important;
}

.introduces .person-bottom .text.blue-back {
  background-color: rgba(0, 112, 216, 0.15);
}

.introduces .w-34per {
  width: 34%;
}

.introduces .w-34per img {
  -o-object-fit: cover;
  object-fit: cover;
}

@media (max-width: 768px) {
  .introduces .w-34per {
    width: 100%;
  }
}

.introduces .w-170px {
  width: 170px !important;
}

.introduces #self-intro {
  margin-top: 170px;
}

@media (max-width: 577px) {
  .introduces #self-intro {
    margin-top: 50px;
  }
}

.introduces .fs-14-gc {
  font-size: 28px;
}

.introduces .bold-title {
  font-size: 28px;
  height: 83px;
  border-bottom: 1px solid #CED4DA;
  margin-bottom: 60px;
  margin-top: 69px;
}

@media (max-width: 577px) {
  .introduces .bold-title {
    margin-bottom: 40px;
    margin-top: 40px;
  }
}

.introduces .sub-bold-title {
  font-weight: bold;
  font-size: 25px;
  line-height: 40px;
  padding-bottom: 10px;
}

.introduces .content-intro {
  max-width: 1200px;
  width: 100%;
  min-height: 100vh;
  margin-bottom: 50px !important;
}

@media (max-width: 1200px) {
  .introduces .content-intro {
    margin-bottom: 0px !important;
  }
}

@media (max-width: 577px) {
  .introduces .content-intro {
    padding: 0px 0px;
  }
}

.introduces .fc-focus {
  color: #007DC3;
  font-size: 16px;
  font-weight: bold;
}

.introduces .fc-focus-deepblue {
  color: #00529E;
  font-size: 16px;
  font-weight: bold;
}

.introduces .fc-normal {
  color: #000;
  font-size: 16px;
  font-weight: normal;
}

.introduces .block-text {
  padding-bottom: 56px;
}

.introduces .sub-content {
  line-height: 25.6px;
  text-indent: -13px;
  padding-left: 18px;
}

.introduces .fix-ul {
  text-indent: 0px;
  margin-left: -18px;
}

.introduces .en-list-ul {
  list-style: lower-alpha;
}

.introduces ol {
  list-style: decimal !important;
}

.introduces .text-indent {
  line-height: 25.6px;
  padding-left: 18px;
}

.introduces .intro-banner {
  width: 112px;
  height: 65px;
  padding: 20px;
}

.introduces .intro-banner.active {
  border-bottom: 3px solid #0094d8;
}

.introduces .intro-banner a {
  display: block;
  font-weight: bold;
  font-size: 18px;
  color: #000;
}

.introduces #menu-swiper {
  overflow: hidden !important;
  width: 950px;
  max-width: 100%;
}

.introduces .swiper-wrapper {
  justify-content: center;
  gap: 16px;
}

@media (max-width: 950px) {
  .introduces .swiper-wrapper {
    gap: 0px;
  }
}

@media (max-width: 850px) {
  .introduces .swiper-wrapper {
    justify-content: unset;
  }
}

@media (max-width: 577px) {
  .introduces .content-intro {
    width: 100%;
    min-height: 100vh;
  }
}

.introduces .wrap-modal {
  width: 100%;
  height: 100%;
  overflow-y: auto;
}

@media (max-width: 767.98px) {
  .introduces .wrap-modal {
    overflow-y: hidden;
  }
}

@media (max-width: 767.98px) {

  .introduces .sub-intro-1,
  .introduces .sub-intro-2,
  .introduces .sub-intro-3,
  .introduces .sub-intro-4,
  .introduces .sub-intro-5,
  .introduces .sub-intro-6 {
    padding-bottom: 70px !important;
  }
}

@media (max-width: 1150px) {
  .introduces [id^=intro] [src*="ios-close.svg"] {
    display: none !important;
  }
}