:root{
    --mjColor: #1D7957; /* 主色 */
    --mjColor-d: #0B4B33;
    --mjColor-l: #0A8755;
    --subColor: ; /* 副色 */

    --black: #11190E;

    --gray: #6C6C6C;
    --gray-d: #2E2E2E;
    --gray-l: #BFBFBF;
    --gray-lx2: #f4f4f4;
    --white:#fff;

    --red: #d40023;

    --transition: all .3s linear;
    --transition-ease: all .3s ease-out;
    --menuW:clamp(4rem,5.5vw,6rem);
    --logoLpd:clamp(1rem,3.5vw,4.5rem);
}

/* !====js-下拉選單==== */
.dropdown{position:relative;}
[data-toggle="dropdown"]{position: relative;cursor: pointer;display: block;padding-right: 2rem;}
.dropdownMenu{display: none;position: absolute;top: 90%;left: 50%;min-width: 180px;transform: translateX(-50%);}
.dropdown:has(.--isOpen) .dropdownMenu{}

/* !====選單==== */
.navbar{position: fixed;top: 0;left: 0;right: 0;z-index: 9999;}
.navbar--fixed{background: #fff;}
.MenuShow.navbar--fixed{background: transparent;}
.navbar--fixed .rollup__line{color:var(--black)}
.navbar>.container{display: flex;justify-content: space-between;align-items: center;max-width: 100%;padding:0}
.navbarBrand{position: relative;;display: block;margin: 0 var(--logoLpd);background: url(../images/all/logo-header.svg?v=20260806)no-repeat left center / contain;width:clamp(20rem,30vw,24rem);aspect-ratio: 455/77;z-index: 999;}
.navBar-fun{display: flex;}
.navbarNav{display: flex;gap:clamp(0.5rem,1vw,1rem);align-items: center;margin-left: auto;}
.navbarNav.--isOpen{background:#fff;position:fixed;flex-direction:column;align-items:flex-start;top:0;right:0;padding-top:calc( var(--headerH) + 2rem);padding-left:var(--logoLpd);padding-bottom: 2rem;width:min(100%,40rem);height:100dvh;max-height:100dvh;overflow-y:auto;overflow-x: clip;z-index: 3;}
.navbarNav.--isOpen .navSub {position: static;box-shadow:none;margin-top: 0;padding:clamp(0.4rem,1vw,1rem);background: var(--gray-lx2);}
.headerInfo{display: none;position: relative;padding:clamp(1rem,2vw,2rem) clamp(1.25rem,3vw,3rem) ;background: var(--gray-lx2);width: calc(100% - 2rem);margin-bottom: 2rem;}
.headerInfo .ftInfoDt__item::before,.headerInfo .ftInfoDt__item{opacity: 1;font-size: clamp(0.875rem,1vw,1rem);}
.headerInfo .ftInfoLogo {width: clamp(12rem,18vw,14rem);filter: invert();    margin-bottom: 1.5rem;}
/* 漢堡選單展開 */
.MenuShow .dropdownMenu{left: 0;transform: translateX(0);}
.MenuShow .navLink{padding:0.8rem 0;display: flex;flex-direction: row;align-items: center;justify-content: space-between;}
.MenuShow .navbarNav__item {border-bottom: 1px solid #cbcbcb;width: 100%;width: calc(100% - 2rem);background: #fff;}
.MenuShow  .navbarNav{gap:0}
/* .MenuShow .navbarNav__item.active{overflow: visible;} */
.MenuShow .navbarNav__item.dropdown .navLink::after {display:inline-block;font-family:bootstrap-icons!important;content:" \F4FE";font-size:1.25rem;padding-left: 0.5rem;}
.MenuShow  .navbarNav__item.dropdown .navLink.--isOpen::after{content:" \F63B"}
.MenuShow .rollup__line{color:var(--black)}
.MenuShow  .headerInfo{display: block;}
.MenuShow  .navLink::before{display: none;}
/* menu */
.navbarToggle{position: relative;;width: var(--menuW);height: 100%;min-height: 6rem;aspect-ratio: 1/1;background: var(--black);display: flex;flex-direction: column;gap:0.35rem;align-items: center;justify-content: center;z-index: 999;border: none;transition: var(--transition);}
.navbarToggle span{width: 1.8rem;height: 2px;background: #fff;display: inline-block;border-radius: 100rem;transition: 0.3s all;}
.navbarToggle.--isOpen  span:nth-child(1){transform:translateY(0.45rem) rotate(45deg);}
.navbarToggle.--isOpen  span:nth-child(2){transform:translateX(0.75rem);opacity:0;}
.navbarToggle.--isOpen  span:nth-child(3){transform:translateY(-0.5rem) rotate(-45deg);}

/* 選單大類樣式 */
.navLink{position: relative;;display: flex;flex-direction: row;cursor: pointer;font-size: clamp(1.125rem,1vw,1.25rem);flex-direction: column;overflow: hidden;padding: 2rem clamp(0.2rem,0.4vw,0.625rem);}
.navLink::before{content:"";width: 0.3rem;height: 0.35rem;background: var(--mjColor-d);position: absolute;left: 50%;bottom:10%;transform: translate(-50%,0%);opacity: 0;}
.navLink__tt{--hH:1.7rem;position:relative;overflow: hidden;transition: 0.3s linear all;height:var(--hH);overflow: hidden;}
.rollup__inner{display:block;transition:transform .85s cubic-bezier(.2,.8,.2,1);will-change:transform;}
.rollup__line{display:block;height:var(--hH);font-size: clamp(1rem,1vw,1.125rem);white-space: nowrap;color:var(--black)}
.navLink.--isOpen .rollup__inner,.navLink:hover .rollup__inner { transform: translateY(-1.8rem);}
.navbarNav__item.active .rollup__line{color:var(--mjColor-d)}
.navbarNav__item.active .navLink::before{opacity: 1;bottom:20%}

#pd0 .rollup__line{color:#fff}
#pd0 .navbar--fixed .rollup__line{color:var(--black)}
#pd0 .MenuShow .rollup__line{color:var(--black)}

/* 選單第二層樣式 */
.navSub{background-color: #fff;box-shadow: 0 0 10px rgba(0,0,0,0.1);list-style: none;padding:0.5rem 1rem;padding:0}
.navSubLink{display: flex;text-align: left;padding:0.8rem 1.125rem;color:var(--black);align-items: center;gap:0.5rem;font-size: 1rem;border-bottom: 1px dashed #c9c9c9;}
.navSubLink::before{content:"";width: 5px;height: 5px;background: var(--mjColor);position: relative;top:2px;flex: 0 0 auto}
.navSub__item:hover .navSubLink{background: var(--gray-lx2);color:var(--mjColor)}
.navSub__item:last-of-type .navSubLink{border-bottom: none;}

/* 語系 */
.navbar__lang{display: flex;margin-right: clamp(1rem,1.3vw,1.5rem);}
.navbar__lang__item{padding:clamp(0.5rem,0.7vw,1rem) clamp(1rem,1.3vw,1.25rem);background: #fff;font-size: 1rem;text-align: center;white-space: nowrap;}
.navbar__lang__item:not(.--active):hover{color:var(--mjColor)}
.navbar__lang__item.--active{background: var(--mjColor);color:var(--white)}
.MenuShow .navbar__lang{padding-top: 1.5rem;padding-bottom: 2rem;width: 100%;background: #fff;}

@media screen and (max-width: 1400px) {
    .navbarNav__item,.navbar__lang{display: none;}
    .MenuShow .navbarNav__item,.MenuShow .navbar__lang{display: block;}

}
@media screen and (max-width: 992px) {
    .navbarNav.--isOpen{width: 100%;}
    .navbarNav.--isOpen::before{content:"";width: 100%;height: 6rem;left: 0;top:0;position: fixed;background: #fff;z-index: 24;}
    .MenuShow .navbarNav__item,.headerInfo{width: calc(100% - 1.25rem);}
    .headerInfo .ftInfoLogo{display: none;}
    .navbarNav__item.active .navLink::before{display: none;}


}