@charset "UTF-8";

.container {
    max-width: 1140px !important;
    /* xl 的寬度 */
}


body {
    
}

.qrcode{
    display: block;
}

/************************************* nav *************************************/
.nav {
    position: absolute;
}
.navForD {
    margin-left: 80px;
}
.navForD .oneNav {
   display: inline-block;
   margin-right: 15px;
   font-size: 14px;
   color: #fff;
   padding: 7px 15px;
   position: relative;
   border: 1px solid transparent;
   border-radius: 999px;  /* 添加圓角 */
   transition: border-color 0.2s linear;  /* 添加透明度漸變 */
}

.navForD a:hover{
    opacity: 1;
}

/* hover效果直接改變邊框顏色 */
.navForD .oneNav:hover {
   border-color: white;
}

.dropdown-hover {
    position: relative;
}


/* 修改 .navForD .dropdown-menu 的樣式 */
.navForD .dropdown-menu {
    display: block !important; /* 改為永遠 display: block */
    border: none;
    font-size: 14px;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.1);
    position: absolute;
    background-color: #E8FF59;
    min-width: 160px;
    color: #3B2680;
    top: calc(100% + 28px);
    left: -15px;
    padding-top: 8px;
    /* 動畫相關屬性 */
    opacity: 0;
    visibility: hidden;
    transform: translateY(5px); /* 起始位置往上移 */
    transition: all 0.3s ease-out;
    pointer-events: none; /* 避免過渡時可以點擊 */
}

/* hover 時的樣式 */
.dropdown-hover:hover .dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0); /* 移動到原始位置 */
    top: calc(100% + 18px);
    pointer-events: auto; /* 恢復可點擊 */
}

/* 保持三角形的樣式 */
.navForD .dropdown-menu::before {
    content: '';
    position: absolute;
    top: -10px;
    left: 20px;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #E8FF59;
}



/* 空隙處理 */
.dropdown-hover::after {
    content: '';
    position: absolute;
    height: 28px; /* 增加高度確保不會有空隙 */
    width: 100%;
    top: 100%;
    left: 0;
}

/*
.dropdown-hover:hover .dropdown-menu {
    display: block;
}
*/

/* 其餘CSS保持不變 */
.menu-title {
    cursor: pointer;
    position: relative;
    display: inline-flex;
    align-items: center;
}
.arrow-down,
.arrow-up {
    margin-left: 4px;
    width: 12px;
    height: 12px;
    vertical-align: middle;
}
.arrow-up {
    display: none;
}
.dropdown-hover:hover .arrow-down {
    display: none;
}
.dropdown-hover:hover .arrow-up {
    display: inline-block;
}
.dropdown-item {
    display: block;
    padding: 0.5rem 1rem;
/*
    border-bottom: 1px solid;
    border-color: rgba(59, 38, 128, 0.1);
*/
    text-decoration: none;
    color: #3B2680 !important;
}
.dropdown-item:focus,
.dropdown-item:hover {
    background-color: rgba(59, 38, 128, 0.1);
}
a .btnForNavD,
.btnForNavD{
    cursor: pointer;
    position: absolute;
    right: 15px;
    top: 13px;
    display: inline-block;
    border-radius: 999px;
    font-family: "SweiShearLegCJKtc-Medium", sans-serif;
    font-weight: 700;
    font-size: 14px;
    padding: 5px 15px;
    background-color: #E8FF59;
    color: #3B2680;
}
a:hover .btnForNavD,
.btnForNavD:hover {
    opacity: 0.8;
}

/************************************* footer *************************************/
.footer {
    padding-top: 60px;
    padding-bottom: 60px;
}

.footer .shareArea {
    float: inherit;
    text-align: left;
}
.footer a .oneShare {
    margin-left: 0px;
    margin-right: 15px;
}

.footer .logoForBottomBar {
    margin-bottom: 15px;
}

/*


.footer a:hover .oneShare {
    opacity: 0.7;
}

.footer .footerNavs {
    margin-bottom: 10px;
}
*/