@charset "UTF-8";

a {
  text-decoration: none;
}

ul.ACCORDION {
  opacity: 1;
  margin-left: 0;
}

ul.ACCORDION li {
  list-style: none;
}

ul.ACCORDION li:last-child {
  border: none;
}

ul.ACCORDION a {
  display: block;
}

ul.ACCORDION a {
  -webkit-transition: all 200ms ease-out;
  -moz-transition: all 200ms ease-out;
  -ms-transition: all 200ms ease-out;
  -o-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}

ul.ACCORDION.transit {
  border: 1px solid #ababab;
  border-top: none;
  margin-bottom: 20px;
  padding: 0;
  border: 0;

  border: 1px solid var(--color-gray-500);
  padding: 1.6rem;
  border-radius: 15px;
}

ul.ACCORDION.transit ul {
  margin-left: 0;
  padding: 0;
}

/* 側選單 單線 */
ul.ACCORDION.transit ul.ACCORDION_MENU_1 {
  border-left: 1px solid var(--primary-default);
  margin-left: 4rem;
}

ul.ACCORDION.transit ul > li {
  font-size: 17px;
  border-bottom: none;
}

ul.ACCORDION.transit li.ACCORDION-node {
  position: relative;
}

.ACCORDION a {
  position: relative;
  display: block;
  font-size: 15px;
  color: #585858;
  text-decoration: none;
  padding: 10px 15px;
  padding-left: 35px;
  transition: all 200ms ease-out;
}

.ACCORDION .ACCORDION-node > a {
  padding-right: 30px;
}

.ACCORDION .ACCORDION-node > a::after {
  content: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M9.16797 10.8333H5.00131C4.76519 10.8333 4.56742 10.7533 4.40797 10.5933C4.24853 10.4333 4.16853 10.2355 4.16797 9.99999C4.16742 9.76444 4.24742 9.56666 4.40797 9.40666C4.56853 9.24666 4.7663 9.16666 5.00131 9.16666H9.16797V4.99999C9.16797 4.76388 9.24797 4.5661 9.40797 4.40666C9.56797 4.24722 9.76575 4.16721 10.0013 4.16666C10.2369 4.1661 10.4349 4.2461 10.5955 4.40666C10.756 4.56722 10.8358 4.76499 10.8346 4.99999V9.16666H15.0013C15.2374 9.16666 15.4355 9.24666 15.5955 9.40666C15.7555 9.56666 15.8352 9.76444 15.8346 9.99999C15.8341 10.2355 15.7541 10.4336 15.5946 10.5942C15.4352 10.7547 15.2374 10.8344 15.0013 10.8333H10.8346V15C10.8346 15.2361 10.7546 15.4342 10.5946 15.5942C10.4346 15.7542 10.2369 15.8339 10.0013 15.8333C9.76575 15.8328 9.56797 15.7528 9.40797 15.5933C9.24797 15.4339 9.16797 15.2361 9.16797 15V10.8333Z" fill="%23393a3f"/></svg>');
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
  font-size: 18px;
  color: #585858;
  transition: all 200ms ease-out;
}
.ACCORDION .ACCORDION-node.topic.ACCORDION-closed > a::after {
  content: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M9.16797 10.8333H5.00131C4.76519 10.8333 4.56742 10.7533 4.40797 10.5933C4.24853 10.4333 4.16853 10.2355 4.16797 9.99999C4.16742 9.76444 4.24742 9.56666 4.40797 9.40666C4.56853 9.24666 4.7663 9.16666 5.00131 9.16666H9.16797V4.99999C9.16797 4.76388 9.24797 4.5661 9.40797 4.40666C9.56797 4.24722 9.76575 4.16721 10.0013 4.16666C10.2369 4.1661 10.4349 4.2461 10.5955 4.40666C10.756 4.56722 10.8358 4.76499 10.8346 4.99999V9.16666H15.0013C15.2374 9.16666 15.4355 9.24666 15.5955 9.40666C15.7555 9.56666 15.8352 9.76444 15.8346 9.99999C15.8341 10.2355 15.7541 10.4336 15.5946 10.5942C15.4352 10.7547 15.2374 10.8344 15.0013 10.8333H10.8346V15C10.8346 15.2361 10.7546 15.4342 10.5946 15.5942C10.4346 15.7542 10.2369 15.8339 10.0013 15.8333C9.76575 15.8328 9.56797 15.7528 9.40797 15.5933C9.24797 15.4339 9.16797 15.2361 9.16797 15V10.8333Z" fill="%23ffffff"/></svg>');
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
  font-size: 18px;
  color: #585858;
  transition: all 200ms ease-out;
}

/* 如果點選打開 多層 */
.ACCORDION .ACCORDION-node.ACCORDION-open > a::after {
  content: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M4.16406 10H15.8307" stroke="%23393a3f" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> </svg>');
}

.ACCORDION .ACCORDION-node.ACCORDION-active > a::after {
  content: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M4.16406 10H15.8307" stroke="%23393a3f" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> </svg>');
}

.ACCORDION .ACCORDION-node.topic > a::after {
  content: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M4.16406 10H15.8307" stroke="%23ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> </svg>');
}

ul.ACCORDION.transit ul > li:first-child {
  margin-top: 1px;
}

.item2 {
  padding-left: 2rem;
  transition: all 0.3s ease-in-out;
}

/* .item2:hover a,
.item2:active a {
  background: #f8f8f8;
  border-radius: 5rem;
} */

ul.ACCORDION.transit li.ACCORDION-open > a {
  color: #585858;
}

ul.ACCORDION.transit li.ACCORDION-active a:hover {
  background-color: var(--color-gray-050);
  color: var(--primary-dark);
  border-radius: 10px;
}
ul.ACCORDION.transit li.topic a:hover {
  background-color: var(--primary-dark);
  color: #fff;
}

ul.ACCORDION.transit li.ACCORDION-node:last-child > ul > li:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

ul.ACCORDION.transit a {
  cursor: pointer !important;
  font-size: 16px;
  color: #585858;
  display: block;
  padding: 12px 20px;
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: 0.2s;

  font-family: "Chiron GoRound TC";
}

.item1.ACCORDION-open:after {
  background-color: #fff;
}

ul.ACCORDION.transit li li > a {
  font-size: 16px;
  position: relative;
  padding: 12px 30px 12px 20px;
}

ul.ACCORDION.transit li li > a:hover {
  color: var(--primary-dark);
}

ul.ACCORDION.transit li li li > a {
  padding-left: 45px;
}

ul.ACCORDION.transit li li li > a::before {
  content: "";
  width: 8px;
  height: 1px;
  display: block;
  background-color: #585858;
  position: absolute;
  top: 47.5%;
  left: 30px;
  transform: translate(-50%, -50%);
  transition: all 0.2s;
}

ul.ACCORDION.transit li li li > a:hover:before {
  background-color: var(--primary-dark);
}

ul.ACCORDION li {
  border-radius: 10px;
}
ul.ACCORDION li a {
  margin: 0.8rem 0;
}

ul.ACCORDION li.topic a {
  background-color: var(--primary-dark);
  color: #ffffff;
  border-radius: 10px;
}

ul.ACCORDION li.topic > a {
  background-color: var(--primary-dark);
  color: #ffffff;
  border-radius: 10px;
}

ul.ACCORDION li.topic.ACCORDIONopen > a {
  color: #fff !important;
  background-color: var(--primary-dark);
  border-radius: 10px;
}

ul.ACCORDION li.ACCORDION-node {
  border-radius: 10px;
}

ul.ACCORDION li.item1 {
  position: relative;
}

ul.ACCORDION.transit li.ACCORDION-open > a {
  color: #0074a9;
}

ul.ACCORDION.transit li.ACCORDION-open .topic a {
  color: #ffffff;
  border-radius: 10px;
}

ul.ACCORDION.transit li.ACCORDION-open .topic a:hover {
  color: var(--primary-dark);
  background-color: var(--color-gray-050);
}
ul.ACCORDION.transit li.ACCORDION-open .topic > a:hover {
  color: #fff;
  background-color: var(--primary-dark);
}

ul.ACCORDION.transit li li li.topic > a::before {
  background-color: #ffffff;
}

.ACCORDION .ACCORDION-node.ACCORDION-open li.ACCORDION-open > a::after {
  border-color: transparent #585858 #585858 transparent;
}

.ACCORDION .ACCORDION-node.ACCORDION-open li.ACCORDION-open > a {
  color: #0074a9;
}

ul.ACCORDION li.ACCORDIONopen .topic .ACCORDION-closed a,
ul.ACCORDION li.ACCORDIONopen.topic .item2 a,
ul.ACCORDION li.ACCORDIONopen .topic .item3 a {
  background-color: transparent;
  color: #585858;
}

/* 除了active以外隱藏選單 */
.category-wrapper .item1 {
  display: none;
}

.category-wrapper .item1.topic {
  display: block;
}
.category-wrapper .item1.ACCORDIONopen,
.category-wrapper .item1.ACCORDION-active {
  display: block;
}

.category-wrapper .item1.ACCORDIONopen > a::after,
.category-wrapper .item1.ACCORDION-active > a::after {
  display: none;
}

.category-wrapper .item1 > a {
  pointer-events: none;
}
