@charset "UTF-8";
/*!
 * cms-header.css
 * Acting on 【Global】
 */
/*
統一小寫，請下列的風格

[data-元件-名稱]
    [data-global-header]
    [data-global-footer]

[data-頁面-編號] 
    [data-index-1]
    [data-index-2]
    [data-index-3]
    [data-index-4]
[data-頁面-名稱] 
    [data-index-header]
    [data-index-footer]
*/
/*================= cms-header =================*/
[data-global-header] .cms-header-nav {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 10;
  display: block;
  margin: auto;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.7);
}

@media (min-width: 1360px) {
  [data-global-header] .cms-header-nav {
    width: 1300px;
    background-color: transparent;
  }
}

[data-global-header] .cms-logo {
  -webkit-transition: all 1s ease 0s;
  transition: all 1s ease 0s;
  width: 50%;
}

@media (min-width: 960px) {
  [data-global-header] .cms-logo {
    width: 100%;
  }
}

[data-global-header] .cms-header-nav-hide {
  top: -100%;
  -webkit-transition: top 2s ease 0s;
  transition: top 2s ease 0s;
}

[data-global-header] .cms-header-nav .cms-header-sms {
  -webkit-transition: top 1s ease 0s;
  transition: top 1s ease 0s;
}

[data-global-header] .cms-header-nav .cms-header-gray .cms-header-menu-item-link {
  color: #333333;
}

[data-global-header] .cms-header-nav .cms-header-menu a::after {
  display: block;
  color: #005187;
  content: attr(data-language-english);
  font-weight: bold;
  font-size: 0.666667rem;
}

[data-global-header] .cms-header-nav .cms-header-menu-item {
  display: block;
  padding: 15px 0;
  position: relative;
}

[data-global-header] .cms-header-nav .cms-header-menu-item-link {
  position: relative;
  display: block;
  margin-left: 0;
  font-size: 1rem;
  -webkit-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
}

@media (min-width: 1200px) {
  [data-global-header] .cms-header-nav .cms-header-menu-item-link {
    margin-left: 1rem;
  }
}

@media (min-width: 1400px) {
  [data-global-header] .cms-header-nav .cms-header-menu-item-link {
    margin-left: 2.777778rem;
  }
}

[data-global-header] .cms-header-nav .cms-header-menu-item-link .cms-current {
  position: absolute;
  right: 0;
  bottom: -0.333333rem;
  left: 0;
  overflow: hidden;
  margin: -1px auto;
  padding: 0;
  width: 100px;
  height: 1px;
  border: 0;
  background-color: red;
  white-space: nowrap;
}

@media (min-width: 1200px) {
  [data-global-header] .cms-header-nav .cms-header-menu-item-link .cms-current {
    margin: -1px;
    width: 100%;
    background-color: red;
  }
}

/* 子選單 */
[data-global-header] .cms-header-nav .cms-header-sub-menu {
  position: relative;
  display: block;
  padding-top: 12px;
  left: 0;
  padding-left: 20px;
}

@media (min-width: 1200px) {
  [data-global-header] .cms-header-nav .cms-header-sub-menu {
    margin-left: 1.111111rem;
    position: absolute;
    display: none;
    padding-left: 0px;
  }
}

@media (min-width: 1300px) {
  [data-global-header] .cms-header-nav .cms-header-sub-menu {
    margin-left: 1.666667rem;
  }
}

@media (min-width: 1400px) {
  [data-global-header] .cms-header-nav .cms-header-sub-menu {
    margin-left: 2.777778rem;
  }
}

/* 子選單 - Hover */
[data-global-header] .cms-header-nav .cms-header-menu-item:hover .cms-header-sub-menu {
  display: block;
}

.dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: '';
  border-top: 0.3em solid;
  border-right: 0.3em solid transparent;
  border-bottom: 0;
  border-left: 0.3em solid transparent;
}

[data-global-header] .cms-header-nav .cms-header-sub-menu-item-link {
  padding: 10px;
  width: 100%;
  display: block;
}

@media (min-width: 1200px) {
  [data-global-header] .cms-header-nav .cms-header-sub-menu-item {
    width: 150px;
    border: 1px solid #bdbdbd;
    background-color: rgba(255, 255, 255, 0.8);
  }
}

/* Javascript */
[data-global-header].js-active .cms-header-collapse {
  display: block;
}

[data-global-header].js-active .cms-header-nav {
  background: rgba(255, 255, 255, 0.9);
  overflow: scroll;
}

[data-global-header].js-active .navbar-nav {
  display: block;
  float: none;
  vertical-align: top;
}

[data-global-header].js-active .cms-header-sms {
  position: absolute;
  top: 2.5rem;
  right: 6rem;
}

@media (max-width: 576px) {
  [data-global-header].js-active .cms-header-sms {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
  }
}

[data-global-header].js-active .cms-header-sms .nav-item {
  display: inline-block;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
}

[data-global-header].js-active .navbar .navbar-collapse {
  text-align: center;
}

[data-global-header].js-active .cms-header-nav {
  height: 100vh;
}

.cms-breadcrumb {
  position: relative;
  margin: auto;
  max-width: 1300px;
  color: #777777;
  font-size: 0.666667rem;
  font-family: 'Noto Sans CJK TC';
}

.cms-breadcrumb .cms-breadcrumb-list {
  position: absolute;
  left: 0;
  bottom: 0;
  padding: 0 15px;
}

@media (min-width: 960px) {
  .cms-breadcrumb .cms-breadcrumb-list {
    padding: 15px 0;
    left: auto;
    right: 0;
  }
}

.cms-breadcrumb .cms-breadcrumb-item {
  display: inline;
}

.cms-breadcrumb .cms-breadcrumb-item:nth-child(2n + 1)::after {
  padding: 0 6px;
  content: ' > ';
}

.cms-breadcrumb .cms-breadcrumb-item:nth-child(2n)::after {
  padding: 0 6px;
  content: ' > ';
}

.cms-breadcrumb .cms-breadcrumb-item:last-child::after {
  padding: 0;
  content: '';
}
