@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;}


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



/* -- 顏色 -- */
.mule_color_top_a{ background:#e60012;}
.mule_color_top_b{ background:#000;}
.mule_color_top_c{ background:#00adbb;}

.mule_color_maintit_a{ background:#036eb8;}
.mule_color_maintit_b{ background:#8fc31f !important;}
.mule_color_maintit_b span{ background:#8fc31f !important;}
.mule_color_maintit_c{ background:#00adbb !important;}
.mule_color_maintit_c span{ background:#00adbb !important;}

.mule_color_foobbt_a{ color:#fff; background:#036eb8;}
.mule_color_foobbt_as{ color:#000; background:#d9d9d9;}
.mule_color_foobbt_b{ color:#fff; background:#000;}
.mule_color_foobbt_c{ color:#fff; background:#00adbb;}



/* -- 抬頭 -- */
.mule_topbar_zone{ width:100%; height:70px; padding:0 !important; margin:0 auto; box-sizing:border-box;}
.mule_title_txt{ display:flex; justify-content:center; align-items:center;
    width:100%; height:70px; padding:0; margin:0 auto; box-sizing:border-box;}
.mule_title_txt img{ width:auto; height:70px; padding:0; margin:0 auto; box-sizing:border-box;}



/* -- 進度條 -- */
.mule_schedule_bar{ display:flex; justify-content:space-between; align-items:self-start;
    width:100%; padding:0; margin:60px auto 0 0; box-sizing:border-box; position:relative;}

.mule_schedule_box{ display:flex; justify-content:center; align-items:center; flex-wrap:wrap;
    padding:0; margin:0; box-sizing:border-box; z-index:5;}
.mule_schedule_box p{ width:100%; text-align:center; font-size:1.2em; font-weight:bold; 
    padding:0; margin:18px auto 0 auto; box-sizing:border-box;}

.mule_schedule_ball{ display:flex; justify-content:center; align-items:center;
    width:80px; height:80px; font-size:1.8em; font-weight:bold; border-radius:50%; padding:0; margin:0; box-sizing:border-box;}

.mule_schedule_line{ width:90%; height:8px; background:#d9d9d9; 
    padding:0; margin:0 auto; box-sizing:border-box; position:absolute; top:36px; left:5%; z-index:1;}

.sball_a{ color:#fff; background:#000; padding:0; margin:0; box-sizing:border-box;}
.sball_b{ color:#000; background:#d9d9d9; padding:0; margin:0; box-sizing:border-box;}



/* -- 中間資訊 -- */
.mule_main_zone{ width:100%; height:auto; padding:0; margin:50px auto 0 auto; box-sizing:border-box;}

.mule_main_title{ display:flex; justify-content:flex-start; align-items:center;
    width:100%; height:auto; padding:0; margin:0 auto 30px auto; box-sizing:border-box;}
.mule_main_title span{ display:inline-table; width:9px; height:44px; padding:0; margin:0 20px 0 0; box-sizing:border-box;} 
.mule_main_title h3{ display:inline-table; font-size:2.5em;  font-weight:bold; color:#000; padding:0; margin:0; box-sizing:border-box;}
.mule_main_title h4{ display:inline-table; font-size:2.5em;  font-weight:bold; color:#ff0000; padding:0; margin:0; box-sizing:border-box;}

.mule_res_header,
.mule_res_end{ width:100%; height:auto; padding:0 0 0 30px; margin:0; box-sizing:border-box;}
.mule_res_header{ margin:0 0 30px 0;}
.mule_res_end{ margin:25px 0 0 0;}
.mule_res_header p,
.mule_res_end p{ font-size:1.5em; font-weight:bold; padding:0; margin:0; box-sizing:border-box;}

.mule_reserve_bar{ display:flex; justify-content:space-between; align-items:center;
    width:40%; height:auto; padding:0 0 0 32px; margin:0 0 15px 0; box-sizing:border-box;}
.mule_reserve_bar h3,
.mule_reserve_bar h4{ font-size:1.5em; font-weight:bold; padding:0; margin:0; box-sizing:border-box;}

.mule_email_nbar{ width:100%; height:auto; 
    padding:0 0 0 35px; margin:0; box-sizing:border-box;}
.mule_email_nbar h3{ font-size:2em; padding:0; margin:0; box-sizing:border-box; }
.mule_email_nbar h3 span{ color:#e60012;}



/* -- 付款完成 -- */
.mule_main_zone_out{ display:flex; justify-content:space-between; align-items:self-start; 
    padding:0; margin:0 auto; box-sizing:border-box;}
.mule_main_za{ width:60%; padding:0 30px 0 0;}
.mule_main_zb{ width:40%;}
.mule_main_zone_out .mule_main_za .mule_reserve_bar{ width:100% !important;}



/* -- 發票選項 -- */
.mule_bill_selzone{ margin:0;}
.mule_bill_selzone ul{ display:flex;}
.mule_bill_selzone ul li{ display:flex; justify-content:flex-start; align-items:self-start; margin:0 50px 0 0;}
.mule_bill_selzone ul li input{ width:20px; height:20px; margin:8px 8px 0 0;}
.mule_bill_selzone ul li label{ font-size:1.5em; font-weight:bold;}

.mule_bill_indata_a{ width:calc(100% - 290px); padding:0; margin:0 0 0 290px; box-sizing:border-box;}
.mule_bill_indata_a ul{ display:flex; margin:0;}
.mule_bill_indata_a ul li{ display:flex; justify-content:flex-start; align-items:center; padding:0; margin:0 50px 0 0;}
.mule_bill_indata_a ul li input{ width:20px; height:20px; margin:0 8px 0 0;}
.mule_bill_indata_a ul li label{ font-size:1.2em; font-weight:bold;}

.mule_bill_indata_af{ padding:0; margin:0 !important; box-sizing:border-box;}
.mule_bill_indata_afbox{ padding:0 0 0 15px !important;}
.mule_bill_indata_afbox label{ font-size:.9em; font-weight:normal !important;}
.mule_bill_indata_afbox label span{ color:#ff0000;}
.mule_bill_indata_afbox input{ border:none; border-bottom:solid 1px #000; border-radius:0; padding:10px 10px 20px 10px;}
.mule_bill_indata_afbox input::placeholder{ color:#d0cece;}

.mule_bill_indata_inpa{ width:50%; padding:0 0 0 10px;}
.mule_bill_indata_inpa label{ font-size:1.2em; font-weight:normal; margin:-20px 0 0 0;}
.mule_bill_indata_inpa label span{ color:#ff0000;}
.mule_bill_indata_inpa input{ border:none; border-bottom:solid 1px #000; border-radius:0;}
.mule_bill_indata_inpa input::placeholder{ color:#d0cece;}

.mule_bill_indata_inpb{ width:100%; margin:10px 0 0 0; padding:0 0 0 5px;}
.mule_bill_indata_inpb label{ font-size:1.5em; font-weight:norma; padding:0; margin:0; box-sizing:border-box;}
.mule_bill_indata_inpb input{ width:100%; border:none; border-bottom:solid 1px #000; border-radius:0;}
.mule_bill_indata_inpb input::placeholder{ color:#d0cece;}

.mule_bill_indata_b{ width:calc(100% - 565px); border-left:solid 3px #d9d9d9; padding:10px; margin:0 0 0 565px; box-sizing:border-box;}
.mule_bill_indata_b ul{ display:flex; flex-wrap:wrap;
    width:100%; height:250px; padding:0; margin:0; box-sizing:border-box; overflow-x:auto;}
.mule_bill_indata_b ul li{ display:flex; margin:0 20px 15px 0;}
.mule_bill_indata_b ul li input{ width:20px; height:20px; margin:5px 8px 0 0;}
.mule_bill_indata_b ul li label{ font-size:1.2em; font-weight:bold;}

.mule_bill_indata_sel{ border:none !important; font-size:1.2em !important;
    border-radius:0 !important; border-left:solid 3px #d9d9d9 !important; border-bottom:solid 1px #000 !important; 
    margin:0 0 0 15px;}

.mule_bill_indata_c{ width:calc(100% - 760px); border-left:solid 3px #d9d9d9; 
    padding:0 10px 10px 10px; margin:0 0 0 760px; box-sizing:border-box;}
.mule_bill_indata_c ul{ display:flex; flex-wrap:wrap;
    width:100%; height:250px; padding:0; margin:0; box-sizing:border-box; overflow-x:auto;}
.mule_bill_indata_c ul li{ display:flex; flex-wrap:wrap; margin:0 0 8px 0;}
.mule_bill_indata_c ul li input{ width:80%; height:30px; border:none; border-radius:0; border-bottom:solid 1px #000; 
    padding:0; margin:0; box-sizing:border-box;}
.mule_bill_indata_c ul li label{ width:80%; font-size:1em; font-weight:bold; padding:0; margin:0; box-sizing:border-box;}
.mule_bill_indata_c ul li label span{ color:#ff0000;}

.mule_bill_indata_cf{ display:flex; flex-wrap:wrap; width:calc(100% - 10px); height:280px; border-left:solid 3px #d9d9d9; 
    padding:10px; margin:10px 0 0 10px !important; box-sizing:border-box; overflow-x:auto;}
.mule_bill_indata_cf li{ display:flex; flex-wrap:wrap; margin:0 0 8px 0 !important;}
.mule_bill_indata_cf li input{ width:100% !important; height:30px !important; border:none !important; 
    border-radius:0; border-bottom:solid 1px #000 !important; padding:0 0 0 10px; margin:0;}
.mule_bill_indata_cf li label{ width:100%; font-size:1em; font-weight:bold; 
    padding:0 !important; margin:0 0 -10px 0 !important; box-sizing:border-box;}
.mule_bill_indata_cf li label span{ color:#ff0000 !important;}



.hint_txt_box{ display:flex; justify-content:flex-start; align-items:center;
    width:50%; height:40px; border-radius:10px; color:#fff; background:#e60012; 
    padding:0 20px; margin:10px 0 0 0; box-sizing:border-box; position:relative;}
.hint_txt_box p{ display:block; width:100%; text-align:center; font-size:1.3em; font-weight:bold; color:#fff; 
    padding:0; margin:0; box-sizing:border-box; white-space:nowrap; overflow:hidden;}
.hint_txt_box span{ display:block; width:15px; height:15px; background:#e60012; 
    position:absolute; top:-5px; left:20px; transform:rotate(45deg); z-index:1;}



/* -- 付款方式 -- */
.mule_payment_method_zone{ width:420px; height:auto; padding:0; margin:0 auto 30px auto; box-sizing:border-box;}
.mule_payment_method_zone h3{ font-size:1.2em; font-weight:bold; 
    background:url(../images/wallet_pix.svg) no-repeat 1px 2px; background-size:20px; 
    padding:0 0 0 25px; margin:0 0 20px 0; box-sizing:border-box;}
.mule_payment_method_box{ border:solid 1px #e9e9e9; border-radius:10px; 
    background:#fff; padding:0; margin:0 auto; box-sizing:border-box;}
.mule_payment_method_tit{ display:flex; justify-content:space-between; align-items:center;
    background:#f3f3f3; padding:20px; margin:0; box-sizing:border-box;}
.mule_payment_method_tit h4{ font-size:1em; font-weight:bold; 
    background:url(../images/check_pix.svg) no-repeat 0px 0px; background-size:18px; 
    padding:0 0 0 25px; margin:0; box-sizing:border-box;} 
.mule_cards_box{ display:flex; justify-content:flex-end; align-items:center; padding:0; margin:0; box-sizing:border-box;}
.mule_cards_box img{ width:30px; height:auto; padding:0; margin:0 0 0 5px; box-sizing:border-box;}
.mule_payment_method_main{ width:100%; height:auto; padding:20px; margin:0; box-sizing:border-box;}
.mule_payment_main_up{ padding:0; margin:0 0 20px 0; box-sizing:border-box;}
.mule_payment_main_up label{ font-size:1em; font-weight:bold; background:url(../images/creditcard_pix.svg) no-repeat 0px 2px; 
     background-size:18px;  padding:0 0 0 25px; margin:0 0 5px 0; box-sizing:border-box;}
.mule_payment_main_do{ display:flex; justify-content:space-between; align-items:self-start;
    padding:0; margin:0 0 10px 0; box-sizing:border-box;}
.mule_payment_main_rl{ width:45%;}
.mule_payment_main_rl label{ font-size:1em; font-weight:bold; padding:0 0 0 25px; margin:0 0 5px 0; box-sizing:border-box;}
.mule_payment_main_rl:nth-child(1) label{ background:url(../images/date_pix.svg) no-repeat 0px 2px; background-size:18px; }
.mule_payment_main_rl:nth-child(2) label{ background:url(../images/lock_pix.svg) no-repeat 0px 2px; background-size:18px; }

.mule_down_text_box{ display:block; padding:0;}

.mule_payment_method_mainout{ width:55%; padding:0 0 0 25px}




/* -- 底部按鈕 -- */
.mule_foot_zone{ display:flex; justify-content:center; align-items:self-start; flex-wrap:wrap;
    width:100%; height:auto; background:#fff; padding:0; margin:0 auto; box-sizing:border-box;}

.mule_txti_box{ width:100%; color:#000; padding:0 70px !important; margin:0 0 50px 0 !important; box-sizing:border-box;}
.mule_txti_box label{ font-size:1em; font-weight:bold; color:#000;}
.mule_txti_box label span{ color:#828282;}
.mule_txti_box label a{ text-decoration:none; color:#828282;}

.mule_nextstep_box{ display:flex; justify-content:center; align-items:center;
    width:100%; height:auto; padding:0; margin:0 auto; box-sizing:border-box;}

.mule_nextstep_abt{ display:flex; justify-content:center; align-items:center;
    text-decoration:none; width:215px; height:60px; font-size:2.2em; font-weight:bold; border:none; border-radius:15px; 
    padding:0; margin:0; box-sizing:border-box; cursor:pointer;}

.mule_nextstep_bbt{ display:flex; justify-content:center; align-items:center;
    text-decoration:none; width:215px; height:60px; font-size:2.2em; font-weight:bold; border:none; border-radius:15px; 
    padding:0; margin:0 45px; box-sizing:border-box; cursor:pointer;}

.mule_nextstep_abtenter{ display:flex; justify-content:center; align-items:center;
    text-decoration:none; width:80%; height:40px; font-size:1.5em; font-weight:bold; border:none; border-radius:15px; 
    padding:0; margin:50px 0; box-sizing:border-box; cursor:pointer;}



.edit_hide{ display:none !important;}

.Largeformat_hide{ display:none !important;}
.Largeformat_show{ display:block !important;}




/* -- 預約追蹤 -- */
.mule_reserve_zone{ padding:0 !important; margin:0 auto !important; box-sizing:border-box;}
.mule_reserve_zone .container{ padding:0 !important; margin:0 auto !important; box-sizing:border-box;}

.mule_reserve_title_bar{ display:flex; justify-content:center; align-items:center;
    width:100%; height:32px; border-bottom:solid 1px #dcdddd; background:#efefef; padding:0; margin:0 auto; box-sizing:border-box;}
.mule_reserve_title_bar p{ font-size:1.2em; font-weight:bold; color:#231815; padding:0; margin:0 auto; box-sizing:border-box;}

.mule_reserve_data_zone{ width:100%; height:auto; 
    background:#fff; padding:15px 20px; margin:0 auto; box-sizing:border-box;}
.mule_reserve_data_boxs{ display:flex; justify-content:space-between; align-items:center;
    width:100%; height:auto; padding:0; margin:0 auto; box-sizing:border-box;}
.mule_reserve_data_box{ display:flex; justify-content:center; align-items:center; flex-wrap:wrap;
    width:32%; height:65px; text-align:center; border:solid 1px #000;
    padding:0; margin:0; box-sizing:border-box;}
.mule_reserve_data_box h3{ width:100%; text-align:center; font-size:1em; font-weight:bold; color:#231815; 
    padding:0; margin:5px 0; box-sizing:border-box;}
.mule_reserve_data_box h3 p{ width:100%; text-align:center; font-size:1em; color:#898989; padding:0; margin:0; box-sizing:border-box;}

.mule_hitchhike_line{ display:flex; justify-content:flex-start; align-items:center;
    padding:0; margin:8px 0 0 0; box-sizing:border-box;}
.mule_hitchhike_line h3{ font-size:1em; font-weight:bold; color:#231815; padding:0; margin:0 10px 0 0; box-sizing:border-box;}
.mule_hitchhike_line p{ font-size:1em; font-weight:bold; color:#898989; padding:0; margin:0; box-sizing:border-box;}

.mule_hitchhike_linebox{ display:flex; justify-content:flex-start; align-items:center;
    width:100%; border:solid 1px #000; padding:10px; margin:2% auto 0 auto; box-sizing:border-box;}
.mule_hitchhike_linebox p{ line-height:15px; font-size:.9em; font-weight:bold; padding:0; margin:0; box-sizing:border-box;}

.mhl_cor_a p{ color:#e60012;}
.mhl_cor_b p{ color:#e60012;}
.mhl_cor_c p{ color:#00adbb;}
.mhl_cor_d p{ color:#00adbb;}

.mule_title_openbar{ width:100%; height:32px; font-size:.62em !important; font-weight:bold; border-bottom:solid 1px #dcdddd !important;
    background:#efefef !important; padding:0; margin:0 auto; box-sizing:border-box;}
.mule_title_openul{ font-size:.9em; font-weight:bold; padding:0; margin:0; box-sizing:border-box;}
.mule_title_openul p{ padding:0; margin:0; box-sizing:border-box;}
.mule_title_openul ol{ padding:0 0 0 17px; margin:0; box-sizing:border-box;}
.mule_title_openul ol li{ padding:0x; margin:0; box-sizing:border-box;}
.mule_title_openul span{ color:#e60012; padding:0; margin:0; box-sizing:border-box;}

.mto_cor_a{ color:#231815 !important;}
.mto_cor_b{ color:#e60012 !important;}
.mto_cor_c{ color:#231815 !important;}
.mto_cor_d{ color:#231815 !important;}


.mto_cor_a:not(.collapsed)::after {
 background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff0000'%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;
}
.mto_cor_a.collapsed::before {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff0000'%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");
}
.mto_cor_a.collapsed::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff0000'%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");
}

.mto_cor_b:not(.collapsed)::after {
 background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff0000'%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;
}
.mto_cor_b.collapsed::before {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff0000'%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");
}
.mto_cor_b.collapsed::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff0000'%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");
}

.mto_cor_c:not(.collapsed)::after {
 background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff0000'%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;
}
.mto_cor_c.collapsed::before {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff0000'%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");
}
.mto_cor_c.collapsed::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff0000'%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");
}

.mto_cor_d:not(.collapsed)::after {
 background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff0000'%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;
}
.mto_cor_d.collapsed::before {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff0000'%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");
}
.mto_cor_d.collapsed::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff0000'%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");
}


.mule_reserve_schedule_zone{ display:flex; justify-content:space-between; align-items:center; 
    width:100%; height:auto; background:#fff; padding:15px 10px; margin:0 auto; box-sizing:border-box;
    position:relative;}
.mule_resc_box_a,
.mule_resc_box_b{ text-align:center; z-index:5;}
.mule_resc_box_a p,
.mule_resc_box_b p{ font-size:.8em; font-weight:bold; color:#d9d9d9; padding:0; margin:0 auto 8px auto; box-sizing:border-box;}
.mule_resc_box_b p{ color:#231815;}
.mule_resc_box_a h4,
.mule_resc_box_b h4{ display:flex; justify-content:center; align-items:center;
    width:36px; height:36px;
    font-size:1em; font-weight:bold; border:solid 6px #d9d9d9; border-radius:50%; color:#fff; background:#d9d9d9;
    padding:0; margin:0 auto; box-sizing:border-box;}
.mule_resc_box_b h4{ background:#22ac38;}
.mule_resc_box_line{ width:94%; height:10px; background:#d9d9d9; position:absolute; bottom:27px; left:3%; z-index:1;}

.mrbb_color_a h4{ background:#22ac38;}
.mrbb_color_b h4{ background:#000;}
.mrbb_color_c h4{ background:#00adbb;}
.mrbb_color_d h4{ background:#22ac38;}

.mule_reserve_times_bar{ display:flex; justify-content:center; align-items:center;
    width:100%; height:auto; border-bottom:solid 1px #dcdddd; background:#036eb8; padding:5px 10px; margin:0 auto; box-sizing:border-box;}
.mule_reserve_times_bar p{ line-height:25px; font-size:1em; font-weight:bold; text-align:center; color:#fff; 
    padding:0; margin:0 auto; box-sizing:border-box;}

.mrtb_cor_a{ background:#036eb8;}
.mrtb_cor_b{ background:#00adbb;}
.mrtb_cor_c{ background:#036eb8;}
.mrtb_cor_d{ background:#8fc31f;}

.mule_reserve_map_zone{ display:flex; justify-content:center; align-items:self-start;
    width:100%; height:auto; padding:0; margin:0 auto; box-sizing:border-box; position:relative;}
.mule_reserve_map_pm{ width:30px; height:60px; border:solid 1px #efefef; border-radius:5px; box-shadow:3px 3px 5px rgba(0,0,0,.2);
    background:#fff; overflow:hidden; position:absolute; right:10px; bottom:10px; z-index:10;}
.mule_reserve_map_pm a{ display:flex; justify-content:center; align-items:center;
    width:30px; height:30px; padding:0; margin:0 auto; box-sizing:border-box;}
.mule_reserve_map_pm a:first-child{ border-bottom:solid 1px #efefef;}
.mule_reserve_map_pm a img{ width:90%; height:auto; padding:0; margin:0; box-sizing:border-box;}
.mule_reserve_map_zone img{ width:100%; height:auto; padding:0; margin:0 auto; box-sizing:border-box; z-index:5;} 

.mule_reserve_cancel_title{ width:95%; font-size:1.2em; font-weight:bold; text-align:center; border:solid 1px #036eb8; border-radius:7px 7px 0 0;
     color:#fff; background:#036eb8; padding:3px 0; margin:0 auto; box-sizing:border-box;}

.mule_reserve_cancel_text{ width:95%; border:solid 1px #036eb8; border-radius:0 0 7px 7px; background:#fff; padding:20px; margin:0 auto; box-sizing:border-box;}
.mule_reserve_cancel_text p{ line-height:35 px; font-size:1.3em; font-weight:bold; color:#036eb8; 
    padding:0; margin:0; box-sizing:border-box;}

.mrct_cor_a{ border:solid 1px #036eb8; background:#036eb8;}
.mrctx_cor_a{ border:solid 1px #036eb8;}
.mrctx_cor_a p{ color:#036eb8;}

.mrct_cor_b{ border:solid 1px #00adbb; background:#00adbb;}
.mrctx_cor_b{ border:solid 1px #00adbb;}
.mrctx_cor_b p{ color:#00adbb;}

.mrct_cor_c{ border:solid 1px #036eb8; background:#036eb8;}
.mrctx_cor_c{ border:solid 1px #036eb8;}
.mrctx_cor_c p{ color:#036eb8;}

.mrct_cor_d{ border:solid 1px #8fc31f; background:#8fc31f;}
.mrctx_cor_d{ border:solid 1px #8fc31f;}
.mrctx_cor_d p{ color:#8fc31f;}

.mrct_cor_e{ border:solid 1px #e60012; background:#e60012;}
.mrctx_cor_e{ border:solid 1px #e60012;}
.mrctx_cor_e p{ color:#e60012;}

.mrct_cor_f{ border:solid 1px #000; background:#000;}
.mrctx_cor_f{ border:solid 1px #000;}
.mrctx_cor_f p{ color:#000;}


/* -- 預約追蹤電腦版切割 -- */
.mrctx_layout_zone{ display:flex; justify-content:center; align-items:self-start; width:100%;
    padding:0; margin:0 auto; box-sizing:border-box;}
.mrctx_layout_le{ width:450px; margin:50px 30px 0 0;}
.mrctx_layout_ro{ width:700px; margin:50px 0 0 0; }
.mrctx_layout_re{ width:100%; }


/* -- 跳出視窗 -- */
.mule_popout_zone{ width:100%; height:100%; 
    background:rgba(0,0,0,.8); padding:0; margin:0; box-sizing:border-box; position:absolute; top:0; left:0;}
.mule_popout_box{ width:460px; height:390px; border-radius:10px; 
    background:#fff; padding:0 0 30px 0; margin:130px auto 0 auto; box-sizing:border-box; position:relative;}
.mule_popout_title{ display:flex; justify-content:center; align-items:center;
    width:100%; height:106px; padding:0; margin:0 auto; box-sizing:border-box;}
.mule_popout_title img{ width:75%; height:auto; padding:20px 0 0 0; margin:0 auto; box-sizing:border-box;}
.mule_popout_main{ width:100%; height:auto; text-align:center; padding:0; margin:30px auto 50px auto; box-sizing:border-box;}
.mule_popout_main h3{ font-size:1.5em; font-weight:bold; color:#231815; padding:0; margin:0 auto; box-sizing:border-box;}
.mule_popout_main input{ width:75%; height:40px; text-align:center; font-size:1.2em; border:solid 1px #000; border-radius:8px; 
    padding:5px 20px; margin:10px auto; box-sizing:border-box;}
.mule_popout_main p{ font-size:1em; color:#898989; padding:0; margin:0 auto; box-sizing:border-box;}
.mule_popout_main img{ width:100px; height:auto; padding:0; margin:-30px auto 0 auto; box-sizing:border-box;}
.mule_popout_main h4{ font-size:1.3em; font-weight:bold; color:#231815; padding:0; margin:20px auto 0 auto; box-sizing:border-box;}
.mule_popout_bbt{ width:100%; height:auto; padding:0; margin:0 auto; box-sizing:border-box;}
.mule_popout_bbt button{ width:75%; height:45px; font-size:1.5em; padding:0; margin:0 auto; box-sizing:border-box;}
.mule_popout_pss{ width:100%; height:110px; padding:0; margin:0 auto; box-sizing:border-box;}

.mule_popout_failed_tit{ display:flex; justify-content:center; align-items:center;
    width:100%; text-align:center; border-radius:10px 10px 0 0; padding:0; margin:0 auto; box-sizing:border-box;}
.mule_popout_failed_tit h3{ font-size:2em; font-weight:bold; color:#fff; padding:10px; margin:0; box-sizing:border-box;}
.mule_popout_failed_main{ width:100%; height:auto; text-align:center; padding:0; margin:70px auto; box-sizing:border-box;}
.mule_popout_failed_main p{ font-size:1.5em; padding:0 20px; margin:0 auto; box-sizing:border-box;}
.mpb{ position:absolute; bottom:40px }













@media (max-width: 1024px) {
.mule_schedule_box{ display:block; text-align:center;}
.mule_schedule_ball{ margin:0 auto;}
.mule_schedule_box p{ width:auto;}

/* -- 發票選項 -- */
.mule_bill_indata_b{ width: calc(100% - 530px); margin: 0 0 0 530px;}
.mule_bill_indata_b ul{ height:600px;}
.mule_bill_selzone ul li input{ margin:5px 8px 0 0;}
.mule_bill_selzone ul li label{ font-size:1.3em;}
.mule_bill_indata_c{ width:calc(100% - 715px); margin:0 0 0 715px;}

/* -- 預約追蹤電腦版切割 -- */
.mrctx_layout_zone{}
.mrctx_layout_le{ width:380px; margin:40px 15px 0 0;}
.mrctx_layout_ro{ width:540px; margin:40px 0 0 0;}
}



@media (max-width: 820px) {
.mule_reserve_bar{ width:60%;}

.mule_bill_indata_inpa{ width:65%;}
.mule_bill_selzone ul li input {margin:6px 8px 0 0;}
.mule_bill_selzone ul li label{ font-size: 1.3em;}

/* -- 發票選項 -- */
.mule_bill_indata_a{ width:calc(100% - 230px); margin:0 0 0 230px;}
.mule_bill_indata_inpa label{ font-size:1em;}
.mule_bill_indata_b{ width:calc(100% - 400px); margin:0 0 0 400px;}
.mule_bill_indata_b ul{ height:450px;}
.mule_bill_indata_b ul li label{ font-size:1em;}
.mule_bill_selzone ul li{ margin:0 20px 0 0;}
.mule_bill_selzone ul li input{ width:18px; height:18px; margin:3px 8px 0 0;}
.mule_bill_selzone ul li label{ font-size:1em; font-weight:bold;}

.mule_bill_indata_c{ width:calc(100% - 530px); margin:0 0 0 530px;}
.mule_bill_indata_c ul{ width:100%; height:250px;}
.mule_bill_indata_c ul li input{ width:100%;}
.mule_bill_indata_c ul li label{ width:100%;}

.mule_resc_box_line{ width:90%; left:5%;}

/* -- 預約追蹤電腦版切割 -- */
.mrctx_layout_zone{}
.mrctx_layout_le{ width:380px; margin:40px 15px 0 0;}
.mrctx_layout_ro{ width:380px; margin:40px 0 0 0;}

/* -- 付款方式 -- */
.mule_payment_method_mainout{ width:80%; padding:0 0 0 25px}

}




@media (max-width: 768px) {
.mule_bill_indata_b ul{ height:280px;}
}



@media (max-width: 475px) {
/* -- 抬頭 -- */
.mule_topbar_zone{ height:50px;}
.mule_title_txt{ height:50px;}
.mule_title_txt img{ height:50px;}

/* -- 進度條 -- */
.mule_schedule_bar{ margin:25px auto 0 auto;}
.mule_schedule_box{ display:flex; justify-content:center; align-items:center; flex-wrap:wrap;
    padding:0; margin:0; box-sizing:border-box; z-index:5;}
.mule_schedule_box p{ width:82px; font-size:.7em; position:absolute; bottom:-25px;}
.mule_schedule_ball{ width:34px; height:34px; font-size:1em;}
.mule_schedule_line{ width:90%; height:4px; top:15px; left:5%;}

/* -- 內容 -- */
.mule_main_zone{  margin:50px auto 0 auto;}
.mule_main_title{ margin:0 auto 20px auto; box-sizing:border-box;}
.mule_main_title span{ width:10px; height:37px; margin:0 12px 0 0;} 
.mule_main_title h3{ font-size:1.6em;}
.mule_main_title h4{ font-size:1.6em;}
.mule_res_header{ margin:0 0 30px 0;}
.mule_res_end{ margin:25px 0 0 0;}
.mule_res_header p,
.mule_res_end p{ line-height:20px; font-size:1em; padding:0;}
.mule_reserve_bar{ display:block; width:100%; padding:0 0 0 25px; margin:0 0 30px 0;}
.mule_reserve_bar h3,
.mule_reserve_bar h4{ font-size:1.1em;}
.mule_reserve_bar h3{ display:block; margin:0 0 15px 0; }

/* -- 發票選項 -- */
.mule_bill_selzone{ margin:0;}
.mule_bill_selzone ul{ display:block; margin:0 0 0 -15px;}
.mule_bill_selzone ul li{ margin:0 0 30px 0;}
.mule_bill_selzone ul li input{ width:15px; height:15px; margin:8px 8px 0 0;}
.mule_bill_selzone ul li label{ font-size:1.2em; font-weight:bold;}
.mule_email_nbar{ padding:0 0 0 23px}
.mule_email_nbar h3{ font-size:1.5em; font-weight:bold;}
.mule_bill_indata_inpb label{ font-size:1em;}

/* -- 付款方式 -- */
.mule_payment_method_zone{ width:100%;}
.mule_payment_method_mainout{ width:100%; padding:0; margin:0 auto;}

/* -- 付款完成 -- */
.mule_main_zone_out{ flex-wrap:wrap; height:1000px;}
.mule_main_za{ width:100%; padding:0;}
.mule_main_zb{ width:100%;}
.mule_main_zone_out .mule_main_za .mule_reserve_bar{ width:100% !important;}
.mule_main_zone_out .mule_main_zb{ margin:0 !important;}

/* -- 底部按鈕 -- */
.mule_foot_zone{ height:auto; padding:20px 20px 30px 20px;}
.mule_txti_box{ width:100%; color:#000; padding:0 20px !important; margin:0 0 20px 0 !important; box-sizing:border-box;}
.mule_txti_box input{ width:15px; height:15px; padding:0; margin:0;}
.mule_txti_box label{ line-height:16px; font-size:.7em;}
.mule_nextstep_abt{  width:90%; height:32px; font-size:1.1em; border-radius:8px; margin:0 auto 20px auto;}
.mule_nextstep_bbt{ width:140px; height:32px; font-size:1.1em; border-radius:8px; margin:0 19px;}

.Largeformat_hide{ display:block !important;}
.smalllayout_hide{ display:none !important;}

.edit_hide{ display:none !important;}

.mule_down_text_box{ padding:0;}
.hint_txt_box{ width:100%;}

.mule_resc_box_line{ width:85%; left:8%;}

/* -- 預約追蹤電腦版切割 -- */
.mrctx_layout_zone{ flex-wrap:wrap;}
.mrctx_layout_le{ width:100%; margin:0;}
.mrctx_layout_ro{ width:100%; margin:0;}

/* -- 跳出視窗 -- */
.mule_popout_box{ width:330px; height:360px;}
.mule_popout_main img{ margin:-10px auto 0 auto;}
.mule_popout_main h4{ margin:20px auto -20px auto;}
.mule_popout_title{ height:80px;}
.mule_popout_pss{ height:80px;}

.mule_popout_failed_tit h3{ font-size:1.5em;}
.mule_popout_failed_main{ padding:40px 10px 40px 10px; margin:0 auto;}
.mule_popout_failed_main p{ line-height:30px; font-size:1.3em; padding:0 30px; margin:0 auto; box-sizing:border-box;}
}



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



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

