@charset "utf-8";
*{
    /* outline: 1px solid #f00; */
}

.content {
  display: block;
}
@media all and (min-width:768px){
  .content{
      display: flex;
  }
}

/* 平板以下的目錄為滿版，浮在內容之上 */
@media all and (max-width:991px){
  .menuArea{
    position: absolute;
    z-index: 99;
    transform: translateX(-15px);
}
}


/* 手機版選單寬度預設為100% */
/* 992以上的選單寬度為230px */
.menuArea {
  width: 100vw; 
}
@media all and (min-width:992px){
  .menuArea {
    width: 230px;
  }
}

.menuArea a{
  color: #666;
}
.menuArea .accordion .accordion-button:not(.collapsed) {
  color: #FFF;
  background-color: #1BBBBB;
}
.menuArea .accordion .accordion-button {
  font-size: 18px;
  color: #1BBBBB;
  background-color: #F2F2F2;
     width: 100%;
}
@media screen and (min-width:992px) {
  .menuArea .accordion .accordion-button {
    width: 230px;

  }
}


.menuArea .menuItemLayer2.accordion-button {
  font-size: 15px ;
  padding: 8px;
  /* width: 195px; */
  width: 95%;
}
/* 沒有子項目的要單獨設定，內容同上 */
.menuArea .menuItemLayer2 {
  font-size: 15px ;
  padding: 5px 8px;
  /* width: 195px; */
  width: 95%;
}
@media screen and (min-width:992px) {
  .menuArea .menuItemLayer2.accordion-button {
    width: 195px;
  }
  .menuArea .menuItemLayer2 {
    width: 195px;
  }
}

.menuArea .menuItemLayer2.accordion-button:not(.collapsed) {
  color: #666;
  background-color: #fff;
}
.menuArea .menuItemLayer2.accordion-button {
  color: #666;
  background-color: #fff;
}

.menuArea .accordion-body{
  padding: 0 0 0 20px;
}

.menuArea ul {
  padding-left: 0;
  margin-bottom: 0;
}

.menuArea ul li {
  font-size: 15px;
  list-style-type: none;
  padding: 3px;
}

.layer2.accordion-item{
  font-size: 12px ;
  border: 0;
}


/* 第二層 打開前的> */
.menuArea .accordion .accordion-button.collapsed::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23999'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* 第一層 打開後的> */
.menuArea .accordion .accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23FFF'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* 第二層 打開前的> */
.menuArea .accordion .menuItemLayer2.accordion-button.collapsed::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23999'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* 第二層 打開後的> */
.menuArea .accordion .menuItemLayer2.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23999'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}


.accordion-button {
  width: 100%;
}