@charset "UTF-8";
/*-------------------------------------------------------------------------------*/
/*    Travel Search                                                                        */
/*-------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------*/
/*    Travel attraction                                                                     */
/*-------------------------------------------------------------------------------*/
body {
  font-family: "Microsoft Jhenghei", "微軟正黑體", "Trebuchet MS", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: black;
}

.kf_map_right {
  height: 300px;
}

@media (min-width: 576px) {
  .kf_map_right {
    height: 460px;
  }
}

.kf_search_bar {
  position: relative;
  border-bottom: 2px solid #000f20;
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.25);
  z-index: 3;
}

.kf_invisible {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  border: 0;
}

.dropdown dd {
  position: relative;
}

.dropdown dd ul {
  display: none;
  position: absolute;
  left: 0;
  width: 100%;
  padding: .25rem;
  color: white;
  background: #0156b9;
}

.dropdown dd ul li {
  padding: .5rem;
  padding-right: 0;
}

.dropdown dd ul li input[type="checkbox"] {
  margin-right: .25rem;
}

.dropdown dt a {
  display: block;
  overflow: hidden;
  min-height: 50px;
  line-height: 1.5;
  padding: .8125rem 1rem;
  background: #0162d2 url(../../images/module/travel/dropdown-arrow.png) no-repeat right 1.65rem center;
}

.dropdown dt a span {
  display: inline-block;
  cursor: pointer;
}

.dropdown a, .dropdown a:visited {
  color: white;
}

.kf_search {
  width: 100%;
}

.kf_search input {
  float: left;
  height: 46px;
  border-style: none;
  outline: 0;
  font-size: 1em;
  color: white;
  background-color: #00857e;
  border-radius: 0;
  box-sizing: border-box;
}

.kf_search_txt {
  width: calc(100% - 60px);
  padding-left: 1em;
}

.kf_search_txt::-webkit-input-placeholder {
  color: white;
}

.kf_search_btn {
  width: 60px;
  padding: .75rem .25rem;
}

/*---------------------------$breakpoints768px---------------------------*/
@media (min-width: 768px) {
  html, body, form {
    height: 100%;
  }
  .kf_map_main {
    position: relative;
    height: 100%;
    height: calc(100% - 80px);
  }
  .kf_map_left {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 409px;
    height: 100%;
    box-shadow: 5px 0 5px 0 rgba(0, 0, 0, 0.2);
  }
  .kf_map_right {
    margin-left: 409px;
    margin-top: 50px;
    height: 100%;
  }
}

/*-------------------------------------------------------------------------------*/
/*    Travel List Map                                                                      */
/*-------------------------------------------------------------------------------*/
.kf_map_poiList_item {
  position: relative;
  padding: 1.25rem 0;
  background: white;
  border-bottom: 1px solid #e9ecef;
}

.kf_map_poiList_item:hover, .kf_map_poiList_item:focus, .kf_map_poiList_item:active {
  background: #f0f2f4;
}

.kf_map_type {
  position: absolute;
  top: calc(50% - 50px);
  left: 0;
  display: flex;
  width: 60px;
  height: 60px;
  margin: 20px;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  color: white;
}

.kf_map_typeTeal {
  background: #00c5ab;
  box-shadow: 0 0 0 5px rgba(0, 197, 171, 0.5), 0 0 0 10px rgba(0, 197, 171, 0.25);
}

.kf_map_typeGreen {
  background: #23b858;
  box-shadow: 0 0 0 5px rgba(35, 184, 88, 0.5), 0 0 0 10px rgba(35, 184, 88, 0.25);
}

.kf_map_typeYellow {
  background: #edb800;
  box-shadow: 0 0 0 5px rgba(237, 184, 0, 0.5), 0 0 0 10px rgba(237, 184, 0, 0.25);
}

.kf_map_typeOrange {
  background: #ff8d1e;
  box-shadow: 0 0 0 5px rgba(255, 141, 30, 0.5), 0 0 0 10px rgba(255, 141, 30, 0.25);
}

.kf_map_typePink {
  background: #ff6085;
  box-shadow: 0 0 0 5px rgba(255, 96, 133, 0.5), 0 0 0 10px rgba(255, 96, 133, 0.25);
}

.kf_map_typePuple {
  background: #8841a2;
  box-shadow: 0 0 0 5px rgba(136, 65, 162, 0.5), 0 0 0 10px rgba(136, 65, 162, 0.25);
}

.kf_map_typeIndigo {
  background: #5e71d7;
  box-shadow: 0 0 0 5px rgba(94, 113, 215, 0.5), 0 0 0 10px rgba(94, 113, 215, 0.25);
}

.kf_map_data {
  position: relative;
  margin-left: 100px;
  padding-right: 1.25rem;
}

.kf_map_data .kf_collect_btn {
  position: absolute;
  top: 0;
  right: .5rem;
  width: 45px;
  height: 45px;
}

.kf_map_tit {
  margin-right: 45px;
  font-weight: bold;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.kf_map_tit a {
  display: block;
  color: #0162d2;
}

.kf_map_tit a:hover, .kf_map_tit a:focus {
  color: #ff007e;
}

.kf_collect_btn {
  color: #ff4f81;
  font-size: 1.75rem;
  text-align: center;
}

.kf_collect_btn:hover, .kf_collect_btn:focus {
  color: #e60071;
}

.kf_collect_btn i {
  display: none;
}

.kf_map_dataList {
  margin-top: .625rem;
}

.kf_map_dataList li {
  margin-top: .25rem;
  line-height: 1.2;
}

.kf_map_dataList li i {
  width: 1rem;
  color: #00857e;
}

.kf_listPage {
  padding: 1rem;
  text-align: center;
  color: black;
  background: #dee2e6;
}

@media (min-width: 768px) {
  .kf_map_listwrap {
    position: relative;
    height: calc(100% - 98px);
  }
  .kf_map_poiList {
    overflow: auto;
    height: calc(100% - 48px);
  }
  .kf_listPage {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
  }
}

/*-------------------------------------------------------------------------------*/
/*    Travel header                                                                         */
/*-------------------------------------------------------------------------------*/
.kf_search_head {
  position: relative;
  height: 60px;
  background: #267de0;
}

.kf_search_logo {
  display: inline-block;
  min-width: 240px;
  padding: .625rem;
  font-size: 0;
}

.kf_search_logo img {
  height: 40px;
}

.kf_home_btn, .kf_sitemap_btn {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  padding: 0 1rem;
  color: white;
  display: flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  background-color: #0162d2;
}

.kf_home_btn:focus, .kf_home_btn:hover, .kf_sitemap_btn:focus, .kf_sitemap_btn:hover {
  background-color: #014a9f;
}

.kf_home_btn:active, .kf_sitemap_btn:active {
  background-color: #002753;
}

.kf_sitemap_btn {
  display: none;
  right: 81px;
}

@media (min-width: 576px) {
  .kf_search_head {
    height: 80px;
  }
  .kf_search_logo {
    min-width: 350px;
  }
  .kf_search_logo img {
    height: 60px;
  }
  .kf_home_btn, .kf_sitemap_btn {
    line-height: 80px;
  }
}

@media (min-width: 768px) {
  .kf_sitemap_btn {
    display: inline-block;
  }
}

/*-------------------------------------------------------------------------------*/
/*    $_kf_travel_Breadcrumbs                                                                      */
/*-------------------------------------------------------------------------------*/
.kf_map_breadcrumbs {
  display: none;
}

@media (min-width: 768px) {
  .kf_map_breadcrumbs {
    display: block;
    position: absolute;
    width: 100%;
    margin-left: 409px;
    z-index: 99;
    padding: .8125rem 1rem;
    background: rgba(0, 0, 0, 0.75);
  }
  .kf_map_breadcrumbs_ul li {
    display: inline-block;
    line-height: 1.5;
  }
  .kf_map_breadcrumbs_ul li a {
    padding: 0 .75rem 0 1rem;
    position: relative;
    color: rgba(255, 255, 255, 0.85);
  }
  .kf_map_breadcrumbs_ul li a:before {
    content: '';
    position: absolute;
    left: 0;
    top: .5rem;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 5px;
    border-color: transparent transparent transparent #fff;
  }
  .kf_map_breadcrumbs_ul li a:hover, .kf_map_breadcrumbs_ul li a:focus {
    color: white;
  }
}

/*-------------------------------------------------------------------------------*/
/*    Travel gmap                                                                           */
/*-------------------------------------------------------------------------------*/
.kf_equipmap {
  position: relative;
}

.kf_widget {
  width: 320px;
  padding: 2rem 1rem 1rem 1rem;
  background: white;
}

.kf_widget_pic {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 160px;
  margin: auto;
  text-align: center;
  vertical-align: middle;
  border: 1px solid #00b8ae;
  background-color: #e9ecef;
  background-image: url(../../images/module/no_image.svg);
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center center;
}

.kf_widget_pic img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  margin: auto;
  vertical-align: middle;
}

.kf_widget_tit {
  position: relative;
  padding: .5rem 0;
  text-align: left;
  font-size: 16px;
  font-family: "Microsoft Jhenghei", "微軟正黑體", "Trebuchet MS", "Helvetica Neue", Helvetica, Arial, sans-serif;
  border-bottom: 1px solid #00857e;
}

.kf_widget_tit i.fa {
  position: absolute;
  left: .25rem;
  top: .75rem;
  color: #00857e;
}

.kf_widget_tit a {
  display: inline-block;
  padding: .25rem 0 .25rem 1.25rem;
  color: inherit;
}

.kf_widget_tit a:hover, .kf_widget_tit a:focus {
  color: #00a2ff;
}

.kf_widget_data {
  position: relative;
  padding-top: .5rem;
  text-align: left;
}

.kf_widget_data dl {
  margin-right: 45px;
  padding: .125rem 0;
}

.kf_widget_data dl:nth-child(3) {
  margin-right: 0;
}

.kf_widget_data dt, .kf_widget_data dd {
  display: inline-block;
  padding: .05rem 0;
  line-height: 1.2;
  font-size: 16px;
  font-family: "Microsoft Jhenghei", "微軟正黑體", "Trebuchet MS", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.kf_widget_data dt {
  color: #00857e;
}

.kf_widget_data .kf_collect_btn {
  position: absolute;
  top: .5rem;
  right: 0;
  width: 45px;
}

/*-------------------------------------------------------------------------------*/
/*    $_kf_travel_footer                                                                     */
/*-------------------------------------------------------------------------------*/
.kf_map_foot {
  position: relative;
  padding: 1.5rem 1rem;
  background: #0162d2;
  color: rgba(255, 255, 255, 0.85);
  font-size: 0.875em;
  line-height: 1.5;
}

.kf_map_foot::after {
  content: "";
  display: table;
  clear: both;
}

.kf_map_foot_link a {
  color: rgba(255, 255, 255, 0.85);
  margin-right: 1rem;
}

.kf_map_foot_link a:last-child {
  margin-right: 0;
}

.kf_map_foot_link a:hover, .kf_map_foot_link a:focus {
  color: white;
  text-decoration: underline;
}

.kf_map_foot_info {
  margin-top: 1rem;
}

.kf_map_foot_mark {
  margin-top: 1rem;
}

.kf_map_foot_mark a {
  display: inline-block;
  vertical-align: top;
  margin-right: .75rem;
  color: white;
}

@media (min-width: 992px) {
  .kf_map_foot_mark {
    position: absolute;
    right: 0;
    top: 1rem;
  }
}
