@charset "UTF-8";



BODY{  font-family:'微軟正黑體 Noto Sans TC',sans-serif; font-size:1em; font-weight:normal;
    padding:0; margin:0 auto !important; box-sizing:border-box; position:relative;}



.backfu_zone{ background:#fff; padding:0 !important; margin:0 auto; box-sizing:border-box;}



/* -- 登入 -- */
.backfu_login_bg{ background:#213146;}
.backfu_login_box{ width:420px; height:auto; border:solid 6px rgba(180,230,255,1); border-radius:20px; background:#ccc; 
    padding:40px 40px 50px 40px; background:url(../images/lo_bk.jpg) no-repeat center center; background-size:;
    margin:15% auto 0 auto; box-sizing:border-box; box-shadow:inset 0 0 30px rgba(90,200,255,.5);}
.backfu_login_box h3{ width:100%; text-align:center; font-size:1.9em; font-weight:bold; 
    color:#fff; padding:0; margin:0 auto; box-sizing:border-box;}
.backfu_login_box h3 img{ width:250px; height:auto; padding:0; margin:0 auto 10px auto; box-sizing:border-box;}

.backfu_login_inp{ position:relative;}
.backfu_login_inp label{ font-size:1.2em; font-weight:bold; color:#fff; padding:0 2px 0 5px; margin:0; box-sizing:border-box;}
.backfu_login_inp input{ width:100%; height:auto; border:solid 3px rgba(255,255,255,.5); border-radius:10px; 
    color:#fff !important; background:rgba(60,215,255,.3); padding:10px 15px; margin:0 auto; box-sizing:border-box;
    box-shadow:inset 0 0 20px 5px rgba(0,110,125,1);}
.backfu_login_inp input::placeholder{ color:#7bf7d1;}
.backfu_login_inp input:focus{ border-color:#fff; color:#fff !important; background-color:#07294b;}
.backfu_login_inp input:-webkit-autofill{ border-color:#fff; color:#fff !important; background-color:#07294b;}
.backfu_login_inp input:-webkit-autofill:focus{ border-color:#fff; color:#fff !important; background-color:#07294b;}
.backfu_login_inp input:-webkit-autofill{ background-color:#07294b !important; -webkit-text-fill-color:#fff !important;
  border:solid 3px #fff; box-shadow: 0 0 0px 1000px #07294b inset !important;}
.ba_hide_eye{ width:30px; height:30px; background:url(../images/eye_op.svg) no-repeat center center;
    padding:0; margin:0; box-sizing:border-box; 
    position:absolute; right:15px; bottom:10px; z-index:50; cursor:pointer; transition:0.4s;}
.ba_hide_eye:hover,
.ba_hide_eye:active{ background:url(../images/eye_co.svg) no-repeat center center;}
.ba_hide_eye.active{ background:url(../images/eye_co.svg) no-repeat center center;}

.backfu_login_dobbt{ font-size:1.5em !important; font-weight:bold !important; border:solid 3px rgba(255,255,255,.5) !important; 
    border-radius:10px !important; color:#fff !important; background:#16b585 !important; padding:0; margin:10px 0 0 0; 
    box-sizing:border-box; transition:0.4s;}
.backfu_login_dobbt:hover,
.backfu_login_dobbt:active{ border:solid 3px rgba(255,255,255,.9) !important; 
    background:#000 !important; box-shadow:inset 0 0 30px 1px rgba(0,170,255,.5) !important;}



/* -- 上層 -- */
.backfu_title{ display:flex; justify-content:space-between; align-items:center;
    width:100%; height:60px; background:#213146; padding:0 !important; margin:0 auto !important; box-sizing:border-box;}

.backfu_logo{ display:flex; justify-content:space-between; align-items:center;
    width:250px; height:60px; background:#213146; 
    padding:0 0 0 20px; margin:0 auto; box-sizing:border-box;}
.backfu_logo a{ display:block; text-decoration:none; width:100%; height:auto;}
.backfu_logo a p{ line-height:60px; font-size:1.2em; font-weight:bold; color:#fff; padding:0; margin:0; box-sizing:border-box;}

.backfu_title_r{ display:flex; justify-content:flex-end; align-items:center;
    width:calc(100% - 250px); height:60px; padding:0 20px 0 0; margin:0; box-sizing:border-box;}
.backfu_title_r input{ border:solid 1px rgba(255,255,255,.8); border-radius:10px; color:#fff; background:rgba(255,255,255,.1); 
    padding:5px 10px; margin:0 10px 0 0; box-sizing:border-box; box-shadow:inset 1px 1px 10px rgba(0,0,0,.3);}
.backfu_title_r a{ display:flex; justify-content:center; align-items:center;
    width:35px; height:35px; border:solid 1px rgba(255,255,255,.8); border-radius:5px; background:rgba(255,255,255,.2); padding:0; margin:0; box-sizing:border-box;}
.backfu_title_r a img{ width:70%; height:auto; padding:0; margin:0; box-sizing:border-box;}

.backfu_feSel_bar{ display:flex; justify-content:right; align-items:center;
    width:auto; height:auto; padding:0; margin:0; box-sizing:border-box;}
.backfu_feSel_bar li{ width:auto; height:auto; padding:0; margin:0 0 0 10px; box-sizing:border-box;}
.backfu_feSel_bar li a{ width:40px; height:36px; border:solid 2px #fff; border-radius:10px;
    background:#030204; padding:0; margin:0; box-sizing:border-box; 
    box-shadow:inset 0 0 5px 2px #0078ff,0 0 3px 1px #00eaff; transition:0.4s;}
.backfu_feSel_bar li a:hover,
.backfu_feSel_bar li a:active{ background:#0078ff;}
.backfu_feSel_bar li .active{ background:#0078ff;}

.backfu_name_bar{ font-size:1em; color:#9bedff; padding:0; margin:0 10px 0 0; box-sizing:border-box;}

.hidden{ display:none !important;}

.backfu_swap_bbt{ display:block; width:32px !important; height:32px !important; border:solid 2px #fff !important; border-radius:10px !important;
    background:#030204 !important; padding:0; margin:0 0 0 10px !important; box-sizing:border-box;
    box-shadow:inset 0 0 5px 2px #0078ff,0 0 3px 1px #00eaff; transition:0.4s;}
.backfu_swap_bbt img{ width:80% !important; height:auto;}






/* -- 下層 -- */
.backfu_main{ display:flex; justify-content:space-between; align-items:flex-start;
    width:100%; 
    background:#000; padding:0 !important; margin:0 auto !important; box-sizing:border-box;}



/* -- 左選單 -- */
.backfu_main_left{ display:flex; justify-content:left; align-items:flex-start;
    width:250px !important;  
    padding:0 !important; margin:0 !important; box-sizing:border-box;
    overflow-y:auto; transition:width 0.3s ease; flex-shrink:0;}

.accordion-button{ font-size:14px; font-weight:bold;}
.accordion-body { padding:5px 10px;}
.nav-link{ color:#212529; text-decoration:none;}
.nav-link:hover{ color:#0d6efd; text-decoration:underline;}

.backfu_lmunu_box{ width:95% !important; border:none !important; border-radius:0 10px 10px 0 !important; 
    background:#none !important; padding:0;}
.backfu_lmunu_a{ border:none !important; border-radius:0 !important; background:rgba(0,0,0,0) !important;}
.backfu_lmunu_a h2{ border-radius:0 !important;}
.backfu_lmunu_a button{ box-shadow:none !important; border-radius:0 10px 10px 0 !important;}

.backfu_lmunu_u{ width:100% !important; padding:0 !important; margin:0 !important;}
.backfu_lmunu_u li{ width:97% !important; border-top:solid 1px #8ce5ff; border-bottom:solid 1px #015278;
    color:#fff; background:#657680; padding:8px 10px 8px 30px !important; margin:0 !important; transition:0.4s;}
.backfu_lmunu_u li:first-child{ border-top:none;}
.backfu_lmunu_u li:last-child{ border-bottom:none;}
.backfu_lmunu_u li:hover,
.backfu_lmunu_u li:active{ background:#0c1929 !important; box-shadow:inset 0 0 15px rgba(30,125,250,.9) !important;}
.backfu_lmunu_u li a{ text-decoration:none !important; color:#fff;}

.backfu_second_floor{ width:100% !important; padding:0 !important; margin:0 !important;}
.backfu_second_floor a{ display:block; text-decoration:none; width:97% !important; border-top:solid 1px #4d8eb5; border-bottom:solid 1px #294856;
    color:#fff; background:#496373; padding:8px 10px 8px 30px !important; margin:0 !important; transition:0.4s;}
.backfu_second_floor:first-child a{ border-top:none;}
.backfu_second_floor:last-child a{ border-bottom:none;}
.backfu_second_floor a:hover,
.backfu_second_floor a:active{ background:#0c1929 !important; box-shadow:inset 0 0 15px rgba(30,125,250,.9) !important;}

.backfu_second_floor .active{ color:#f48e00; background:#0c1929 !important; box-shadow:inset 0 0 15px rgba(30,125,250,.9) !important;}

.backfu_Logout_bbt{ display:flex; justify-content:flex-start; width:100%; padding:0; margin:10px 0 0 0; box-sizing:border-box;}
.backfu_Logout_bbt a{ display:block; text-decoration:none; width:100%; font-size:1em; font-weight:bold;
    border:solid 1px rgba(255,255,255,.1) !important; border-radius:0 10px 10px 0; color:#fff !important; 
    color:#16b585 !important; background:#34445c !important; padding:15px 20px; margin:0 !important; box-sizing:border-box; transition:0.4s;}
.backfu_Logout_bbt a:hover,
.backfu_Logout_bbt a:active{ text-shadow:1px 1px 0 rgba(255,255,255,.2); color:#fff !important; background:#16b585 !important; }

.first_bbt{ border:none !important; border-bottom:solid 1px rgba(255,255,255,.1) !important; color:#fff !important; 
    color:#7ed3fb !important; background:#34445c !important;}
.first_bbt:hover,
.first_bbt:active{ text-shadow:1px 1px 0 rgba(255,255,255,.2); color:#213146 !important; background:#7ed3fb !important; }

.backfu_lmunu_bkere{ width:100% !important; padding:0 !important; margin:0 !important;}

.second_bker{ border:none !important; background:none !important; padding:0 !important; margin:0 !important; box-sizing:border-box !important;}
.second_bker button{ border-radius:0 !important;}
.second_bbt{ width:97% !important; border-top:solid 1px #6dacbf !important; border-bottom:solid 1px #39454b !important; 
    border-radius:50px !important; color:#fff !important; background:#657680 !important; padding:8px 10px 8px 30px !important; margin:0 !important; transition:0.4s;}
.second_bbt:hover,
.second_bbt li:active{ background:#0c1929 !important; box-shadow:inset 0 0 15px rgba(30,125,250,.9) !important;}

.backfu_lmunu_bkere{ background:none;}

.backfu_lmunu_us{ width:100%; background:none !important; padding:0 !important; margin:0 !important; box-sizing:border-box !important;}
.backfu_lmunu_us li{ width:97% !important; border-top:solid 1px #8ce5ff; border-bottom:solid 1px #015278;
    color:#fff; background:#689cc3; padding:8px 10px 8px 50px !important; margin:0 !important; transition:0.4s;}
.backfu_lmunu_us li:first-child{ border-top:none;}
.backfu_lmunu_us li:last-child{ border-bottom:none;}
.backfu_lmunu_us li:hover,
.backfu_lmunu_us li:active{ background:#006fff !important; box-shadow:inset 0 0 15px rgba(0,255,255,1) !important;}
.backfu_lmunu_us li a{ text-decoration:none !important; color:#fff;}
.backfu_lmunu_us li a i{ display:none;}


.backfu_lmunu_us .active{ background:#006fff !important; box-shadow:inset 0 0 15px rgba(0,255,255,1) !important;}
.backfu_lmunu_us .active a{ color:#f48e00 !important;}
.backfu_lmunu_us .active a i{ display:inline-block;}

.accordion-button:not(.collapsed){ color:#9affda !important; background:#0086aa !important;}

.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") !important;
}
.accordion-button.collapsed::before {
  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");
}
.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='%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");
}

.first_sl_bbt{ display:block; text-decoration:none; width:100%; font-size:.5em; font-weight:bold;
    border-bottom:solid 1px rgba(255,255,255,.1) !important; border-radius:0 10px 10px 0; color:#fff !important; 
    color:#7ed3fb !important; background:#34445c !important; padding:15px 20px; margin:0; box-sizing:border-box; transition:0.4s;}
.first_sl_bbt:hover,
.first_sl_bbt:active{ text-shadow:1px 1px 0 rgba(255,255,255,.2); color:#213146 !important; background:#7ed3fb !important; }



/* -- 右內容 -- */
.backfu_main_right{ width:calc(100% - 250px) !important; 
    padding:0 !important; margin:0 !important; box-sizing:border-box; transition: width 0.3s ease; flex-grow:1;}
.backfu_main_right_bata{ min-height:calc(100vh - 60px); width:100%; height:100%; border-radius:15px 0 0 0; background:#fff; padding:20px; margin:0 auto; box-sizing:border-box;}

.backfu_main_title{ display:flex; justify-content:space-between; align-items:flex-start;
    width:100%; font-size:1.5em; font-weight:bold; text-align:left;
    padding:0; margin:0 0 20px 0; box-sizing:border-box; position:relative;}

.backfu_select_ab{ margin:0 0 10px 0;}
.backfu_select_bbt{ width:auto !important;}
.backfu_select_bbt button{ width:auto; !important; height:36px; line-height:20px !important; border:solid 3px #719ed9 !important; border-radius:10px !important; 
    color:#fff !important; background:#667993 !important;}

.backfu_table_typle_a{ width:100%; border-top:solid 1px #466e81; padding:0 !important; margin:0 auto 5px auto; box-sizing:border-box;}
.backfu_table_typle_a:nth-child(even) ul{ background:#fff;}

.backfu_table_typle_a ul{ display:flex; justify-content:flex-start; align-items:flex-start; flex-wrap:wrap;
    color:#19536b; background:#f7f7f7; padding:0; margin:0; box-sizing:border-box;}
.backfu_table_typle_a ul li{ font-size:1em; text-shadow:1px 1px 0 rgba(255,255,255,.5); padding:4px 8px; margin:0 0 2px 0;}
.backfu_table_typle_a ul li:nth-child(even){ color:#; background:#e1eaf0;}

.backfu_table_typle_b{ background:#f7f7f7; margin:10px auto;}
.backfu_table_bbar{ display:flex; justify-content:space-between; align-items:center;
    border-bottom:solid 1px #fff; padding:0;}
.backfu_table_bbar:nth-child(odd){ background:#e1eaf0;}
.backfu_tb_l{ width:30%; text-align:right; border-right:solid 1px #fff; color:#383838; padding:5px 12px;}
.backfu_tb_r{ width:70%; color:#19536b; padding:5px 12px;}

.backfu_selzoom_bbt{ display:flex; justify-content:center; align-items:center;
    width:30px; height:30px; overflow:hidden;}
.backfu_selzoom_bbt img{ width:100%; height:auto;}

.backfu_selzoom_box{ transition:max-height 0.3s ease, opacity 0.3s ease; overflow:hidden; opacity:1;}
.backfu_selzoom_box.hidden{ max-height:0; opacity:0;}













@media (max-width: 1024px) {
}


@media (max-width: 820px) {
}


@media (max-width: 768px) {
}


@media (max-width: 475px) {
/* -- 登入 -- */
.backfu_login_box{ width:90%; margin:20% auto 0 auto;}

/* -- 上層 -- */
.backfu_logo{ justify-content:left; width:120px;}
.backfu_logo a{ padding:0; margin:0; box-sizing:border-box;}
.backfu_title_r{ width: calc(100% - 120px);}
.backfu_feSel_bar{ margin:0 0 0 0;}
.backfu_feSel_bar li a{ width:36px; height:32px;}
.backfu_main_title{ margin:0 0 10px 0;}
.backfu_select_bbt{ width:100% !important; border-bottom:solid 1px #7f7f7f; padding:0 0 20px 0; margin:0 0 20px 0;}
.backfu_select_bbt button{ width:100% !important; height:44px !important; line-height:none !important; border:solid 3px #719ed9 !important; border-radius:10px !important; 
    color:#fff !important; background:#667993 !important;}

.backfu_table_typle_a.first{ border-top: 2px solid red;}
.backfu_table_typle_a:first-of-type{ border-top:2px solid #fff;}
.backfu_swap_bbt{ margin:0 -10px 0 10px !important;}




}


@media (max-width: 375px) {
}


@media (max-width: 320px) {
}

