/* ================================================
   index.css - 首頁專用樣式
   原自 index.aspx 內嵌 <style> 區塊，抽離至此
   ================================================ */

/* --- 登入框 (桌機Banner版) --- */
.loginbox {
    position: absolute;
    top: 50%;
    left: 10%;
    margin-top: -150px;
    width: 260px;
    height: 290px;
    padding: 0;
    box-sizing: border-box;
    color: #fff;
    background-color: rgba(14, 36, 61, .9);
    text-align: center;
    z-index: 100;
}

/* --- 登入框 (手機版) --- */
.loginbox2 {
    position: absolute;
    width: 260px;
    height: 300px;
    padding: 0;
    box-sizing: border-box;
    color: #fff;
    background-color: rgba(14, 36, 61, .9);
    text-align: center;
}

/* --- 首頁公告登入區塊尺寸 (手機版) --- */
.home-word2 {
    width: 300px;
    height: 300px;
}

/* --- 公告文字區塊 --- */
.home-word p {
    margin-block-start: 0;
    margin-block-end: 0;
    clear: both;
    overflow: hidden;
}

.home-word .kind {
    float: left;
    border-radius: 3px;
    color: #ffffff;
    font-size: 12px;
    padding: 2px 5px;
    display: inline-block;
    margin-right: 10px;
}

.home-word .yellow { background: #ff9d01; }
.home-word .blue   { background: #1f5a9e; }
.home-word .red    { background: #fd0100; }

.home-word p a {
    width: 75%;
    float: left;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
}

.home-word p .date {
    font-family: 微軟正黑體, Arial;
    font-size: 14px;
    font-weight: bold;
    color: #005CAF;
    float: right;
    width: 70px;
    margin-right: 5px;
}

/* --- 快捷區塊 / Portfolio --- */
.recent_portfolio #portfolio-preview-items.four-cols .portfolio-item {
    width: 320px;
}

.he-wrap {
    width: 100%;
    border: 0px;
}

.portfolio-item h3 {
    font-weight: 700;
    float: left;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 14px;
    font-family: "Open Sans";
    font-size: 20px;
}

.he-wrap1 {
    width: 100%;
    border: 0px;
}

.recent_portfolio #portfolio-preview-items.four-cols .new_column_layout {
    width: 567px;
}

.new_column_layout .home-word {
    width: 100%;
}

/* --- 響應式斷點 --- */
@media screen and (max-width: 800px) {
    .m_hide    { display: none; }
    .bn_block  { position: relative; height: auto; }
    .m2_show   { display: inherit; }
}

@media screen and (min-width: 800px) {
    .m2_hide   { display: none; }
}

@media (max-width: 979px) and (min-width: 768px) {
    #portfolio-preview-items.four-cols .portfolio-item {
        width: 47% !important;
    }
    .home-word           { height: 260px; }
    .home-word p a       { width: 57%; }
}

@media screen and (max-width: 768px) {
    .recent_portfolio #portfolio-preview-items.four-cols .new_column_layout {
        width: 320px;
    }
    .home-word           { height: 640px; }
    .home-word p a       { width: 55%; }
}

/* ================================================
   登入框文字樣式（桌機版 Banner + 手機版）
   ================================================ */

/* --- 登入框標題「WEB下單」--- */
.login-title {
    font-family: 微軟正黑體, Arial;
    font-size: 22px;
    line-height: 30pt;
    color: #fff;
    font-weight: bold;
}

/* --- 系統下拉選項文字 --- */
.login-select-text {
    font-family: 微軟正黑體, Arial;
    font-size: 16px;
    line-height: 25pt;
    color: #333;
}

/* --- 登入方式 Radio 說明標籤 --- */
.login-radio-label {
    font-family: 微軟正黑體, Arial;
    font-size: 16px;
    line-height: 25pt;
    color: #fff;
}

/* --- 驗證碼刷新圖示 --- */
.captcha-refresh { cursor: pointer; }

/* --- 登入按鈕共用底色 / 邊框 --- */
.btn-login {
    margin-top: 5px;
    margin-bottom: 5px;
    background: #009DCD;
    border: 2px solid #009DCD;
    color: #fff;
}

/* --- 桌機版登入按鈕（較小） --- */
.btn-login-sm { padding: 4px 20px; }

/* --- 手機版登入按鈕（較大） --- */
.btn-login-lg { padding: 9px 30px; }

/* --- 驗證碼輸入框寬度 --- */
.captcha-input { width: 100px; }

/* --- 驗證碼輸入錯誤提示 --- */
.validate-result {
    display: inline-block;
    width: 100px;
    color: red;
    font-weight: bold;
    font-size: 16px;
}

/* --- 忘記密碼 / 密碼解鎖連結 --- */
.link-pwd {
    font-family: 微軟正黑體, Arial;
    font-size: 12px;
    text-decoration: underline;
    color: #000;
}

/* ================================================
   Portfolio 卡片漸層樣式
   ================================================ */

/* --- 線上開戶：藍色漸層卡片 --- */
.info-blue-gradient {
    border: 0;
    font-size: 30px;
    background: -webkit-gradient(linear, left top, right bottom,
        color-stop(0%,  #1e5799), color-stop(69%, #2989d8),
        color-stop(69%, #2989d8), color-stop(70%, #207cca),
        color-stop(70%, #207cca), color-stop(100%, #7db9e8));
    background: -ms-linear-gradient(#1e5799, #7db9e8);
    filter: progid:DXImageTransform.Microsoft.gradient(
        startColorstr='#1e5799', endColorstr='#7db9e8', GradientType=0);
}

.info-blue-gradient h3 { width: 100%; }

/* --- 犇亞公告：黃色漸層卡片 --- */
.info-yellow-gradient {
    border: 0;
    background: -webkit-gradient(linear, left top, right bottom,
        color-stop(0%,  #fcb900), color-stop(28%, #fcd500),
        color-stop(49%, #fcb900), color-stop(52%, #fcd500),
        color-stop(52%, #fcd500));
    background: -ms-linear-gradient(#fcb900, #fcd500);
    filter: progid:DXImageTransform.Microsoft.gradient(
        startColorstr='#fcb900', endColorstr='#fcd500', GradientType=0);
}

/* --- 卡片標題連結白色文字 --- */
.link-white { color: #F4F4F4; }

/* ================================================
   桌機版驗證碼表格欄位對齊
   ================================================ */
.td-spacer        { vertical-align: text-top;    width: 5%;  }
.td-captcha-img   { vertical-align: text-bottom; width: 40%; }
.td-captcha-btn   { text-align: center;          width: 40%; }
.td-captcha-input { vertical-align: text-top;    text-align: left; height: inherit; }
.td-captcha-msg   { vertical-align: text-top; }
.td-captcha-links { vertical-align: text-bottom; text-align: left; }

/* --- 水平置中容器（display:table 版） --- */
.center-table-block { display: table; margin: 0 auto; }

/* ================================================
   快捷 / Portfolio 區塊間距
   ================================================ */

/* --- 快捷鍵區（fws_5481c3c7e9b4b）--- */
.section-quicklinks {
    padding-top: 40px !important;
    padding-bottom: 10px !important;
}

/* --- Portfolio 展示區（fws_5476fa058fa8c）--- */
.section-portfolio {
    background-color: #fff;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* ================================================
   Responsive Menu：sub-menu 展開/收合動畫
   以 CSS max-height transition 取代 jQuery slideToggle；
   初始 max-height:0 同時取代 jQuery .hide() 的初始化邏輯。
   ================================================ */
.menu-small ul.menu > li.hasSubMenu > ul.sub-menu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-in-out;
}
.menu-small ul.menu > li.hasSubMenu.sub-open > ul.sub-menu {
    max-height: 800px; /* 足夠大的值，涵蓋最多選項的子選單 */
}