/* Prevent font scaling in landscape while allowing user zoom */
html {-webkit-text-size-adjust: 100%}

/* 取消連點放大 */
html, body {touch-action:manipulation}

/* body Style */
body {margin:0;padding:0;font-family:"微軟正黑體","Microsoft JhengHei";-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0);color:#333;background:#FFF}

/* Disable Tap Hightligt Color */
* {-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-tap-highlight-color: transparent}
:focus {outline:none}

/* Fix FireFox placeholder line-height */
::-moz-placeholder {line-height:130%}

a {cursor:pointer}

/* Top Banner Shadow */
.cls_TopBanner_Shadow {width:100%;position:fixed;top:0;left:0;z-index:6}
.cls_TopBanner_Shadow div {display:table;margin:0px auto;width:100%;height:55px;border-radius:10%;box-shadow:0 5px 10px rgba(159,173,195,0.5);font-size:0}

/* Top Banner */
.cls_TopBanner {width:100%;position:fixed;top:0;left:0;z-index:10;background:linear-gradient(99deg, #ffffff 46%, #e6ebf5 101%);font-size:0px;box-sizing:border-box}
.cls_TopBanner_table {display:table;font-size:0;border-collapse:collapse;border:0;width:100%;max-width:720px;margin:0px auto;height:56px;line-height:56px;}
.cls_TopBanner_Left  {display:table-cell;font-size:0;width:45px;text-align:center;vertical-align:middle;border:0;padding-left:15px;box-sizing:border-box}
.cls_TopBanner_Right {display:table-cell;font-size:0;width:45px;text-align:center;vertical-align:middle;border:0;padding-right:15px;box-sizing:border-box}
.cls_TopBanner_Left img, .cls_TopBanner_Right img {width:28px}
.cls_TopBanner_Center {display:table-cell;font-size:0;text-align:center;vertical-align:middle}
.cls_PrePage {display:none}/* 預設為不顯示 */
.S.cls_PrePage {display:inline-block}

.cls_TopBanner_Title {display:table;font-size:0;border-collapse:collapse;border:0;margin:0px auto}
.cls_TopBanner_Title_Logo {display:table-cell;font-size:0;width:35px;text-align:left;vertical-align:middle;border:0}
.cls_TopBanner_Title_Logo img {width:30px}
.cls_TopBanner_Title_Label {display:table-cell;font-size:0;width:1px;white-space:nowrap;text-align:center;vertical-align:middle;border:0}
#divTopBanner_Title {font-size:18px;font-weight:600;letter-spacing:1px;color:#182942;letter-spacing:0.45px}

/* 嵌入式 TopBanner */
.Embed .cls_TopBanner_Left {display:none}
.Embed .cls_TopBanner_Center {text-align:left}
.Embed .cls_TopBanner_Title {margin:initial}
.Embed .cls_TopBanner_Title_Logo {width:45px;padding-left:15px;padding-right:5px;box-sizing:border-box}

/* Top Banner Extra Height */
.cls_TopBanner_ExHeight {height:56px}

/* Footer */
.cls_Footer {visibility:hidden;display:block;margin:0 auto;opacity:0;width:100%}
.cls_Footer.Fixed {position:fixed;bottom:0;left:0}
.cls_Fotter_Height {font-size:0;display:block;border:0;height:0;background:#ff6a00}
.cls_Footer_BG {display:table;width:100%;font-size:0;background:#e6ebf5}
.cls_Footer_MSG {display:table-cell;height:56px;text-align:center;vertical-align:middle;font-size:13px;color:#9fadc3;padding:5px 10px;box-sizing:border-box}
.cls_Footer_MSG a {font-size:13px;color:#9fadc3}
/* 顯示 Footer */
.cls_Footer.ON {visibility:visible;opacity:1}

/* Body Container Area */
.BodyContainer {width:100%;max-width:720px;margin:0px auto;box-sizing:border-box}

/* Body Container Padding LR */
.cls_BC_Padding {padding:0px 30px}

/* Buttons Area */
.cls_Buttons {width:100%;padding:17px 16px 16px 16px;box-sizing:border-box;font-size:0px;background:#FFF}

.cls_Buttons_table {display:table;font-size:0;border-collapse:collapse;border:0;width:100%;margin:0px auto}
.cls_Buttons_Left  {display:none;font-size:0;width:50%;height:60px;text-align:right;vertical-align:middle;border:0}
.cls_Buttons_Right {display:table-cell;font-size:0;width:50%;height:60px;text-align:left;vertical-align:middle;border:0}

/* 返回按鈕 */
.cls_Buttons_Back {display:table;font-size:0;border-collapse:collapse;border:0;width:100%;max-width:150px;background:#FFFFFF;margin:0px auto;cursor:pointer;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.cls_Buttons_Back div {display:table-cell;font-size:21px;color:#172439;width:100%;height:60px;text-align:center;vertical-align:middle;border:1px solid #9fadc3;white-space:nowrap;padding-left:20px;padding-right:20px;box-sizing:border-box}

/* 下一步按鈕 */
.cls_Buttons_Next {display:table;font-size:0;border-collapse:collapse;border:0;width:100%;max-width:150px;background:#c43826;margin:0px auto;cursor:pointer;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.cls_Buttons_Next div {display:table-cell;font-size:21px;color:#FFFFFF;width:100%;height:60px;text-align:center;vertical-align:middle;border:1px solid #c43826;background:#c43826;white-space:nowrap;padding-left:20px;padding-right:20px;box-sizing:border-box}
.cls_Buttons_Next div a {color:#FFFFFF;text-decoration:none;cursor:pointer}
.cls_Buttons_Next div * {cursor:pointer}

/* 下一步按鈕 - disabled */
.cls_Buttons_Disabled {display:table;font-size:0;border-collapse:collapse;border:0;width:100%;max-width:150px;background:#c0c0c0;margin:0px auto;cursor:not-allowed;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.cls_Buttons_Disabled div {display:table-cell;font-size:21px;color:#FFFFFF;width:100%;height:60px;text-align:center;vertical-align:middle;border:1px solid #c0c0c0;background:#c0c0c0;white-space:nowrap;padding-left:20px;padding-right:20px;box-sizing:border-box}
.cls_Buttons_Disabled div * {cursor:not-allowed}

/* 顯示2個按鈕時 */
.TWO .cls_Buttons_Left {padding-right:7px;box-sizing:border-box;display:table-cell}
.TWO .cls_Buttons_Right {padding-left:7px;box-sizing:border-box}
.TWO .cls_Buttons_Back {float:right;margin:initial;width:150px}
.TWO .cls_Buttons_Next {float:left;margin:initial;width:150px}
.TWO .cls_Buttons_Disabled {float:left;margin:initial}

/* 按鈕區域固定高度 for Position:fixed */
.cls_Buttons_Height {height:0px;font-size:0px;box-sizing:border-box;display:block}

/* 固定下方 */
.cls_Buttons.Fixed {position:fixed;z-index:6;bottom:0px;left:0px;padding:17px 16px 16px 16px}

/* 進度條 */
.cls_STEP_table {display:none;font-size:0;border-collapse:collapse;border:0;width:100%;margin:0px auto}
.cls_STEP_td {display:table-cell;height:50px;vertical-align:middle;background:#e6ebf5;text-align:center}
.myUL {padding:0}
.myUL li {position:relative;display:inline-block;box-sizing:border-box;cursor:default;width:120px}
.myUL li .circle {z-index:2;display:inline-block;height:9px;width:9px;line-height:9px;font-size:0px;background:#e6ebf5;border-radius:50%;margin-right:8px;margin-bottom:1px;box-shadow:0 0 0 2px rgba(159, 173, 195, 1)}
.myUL li.visited .circle {background:#172439}
.myUL li .item {z-index:2;font-size:14px;color:#9fadc3;font-weight:600;display:inline-block;letter-spacing:0.35px}
.myUL li.visited .item {color:#1d3558}
/* 連接線 - 未完成 */
.myUL li::before {position:absolute;content:'';z-index:1;top:9px;left:calc(-20%);background:#9fadc3;height:1px;width:calc(38%)}
/* 連接線 - 已完成 */
.myUL li.visited::before{position:absolute;content:'';z-index:1;top:9px;left:calc(-20%);background:#1d3558;height:1px;width:calc(38%)}
/* 連接線 - 第一個不顯示 */
.myUL li:first-child::before{display:none}
.cls_STEP_table.ON  {display:table}

/* input 樣式 */
.cls_Input {display:inline-block;position:relative;width:100%;min-height:60px;vertical-align:bottom;box-sizing:border-box;border-bottom:1px solid #e6ebf5;font-size:0}
.cls_InputEffect {z-index:1;position:absolute;bottom:0;left:0;width:100%;height:42px;font-size:21px;font-family:"微軟正黑體","Microsoft JhengHei";color:#172439;box-sizing:border-box;border:0;padding:10px 14px 6px 14px;box-sizing:border-box;background-color:transparent;-webkit-appearance:none}
.cls_InputEffect ~ .cls_FocusLine {z-index:2;position:absolute;bottom:-1px;left:50%;width:0;height:2px;background-color:#DAA360;transition:.15s}
.cls_InputEffect:focus ~ .cls_FocusLine {width:100%;background-color:#DAA360;transition:.15s;left:0}
.cls_InputEffect.focus ~ .cls_FocusLine {width:100%;background-color:#DAA360;transition:.15s;left:0}/*  Fix APP */

/*.has-content.cls_InputEffect ~ .cls_FocusLine{width:100%;background-color:#DAA360;transition:0.2s;left:0}*/
/* 樣式一：滑鼠停駐 input 時 label 移至上方 */
.cls_InputEffect ~ .placeholder {z-index:-1;position:absolute;top:25px;left:14px;font-family:"微軟正黑體","Microsoft JhengHei";color:#9fadc3;font-size:21px;transition:.15s;letter-spacing:.5px;white-space:nowrap}
.cls_InputEffect:focus ~ .placeholder       {top:0;font-size:14px;color:#DAA360;transition:.15s}
.cls_InputEffect.focus ~ .placeholder       {top:0;font-size:14px;color:#DAA360;transition:.15s}/*  Fix APP */
.cls_InputEffect.has-content ~ .placeholder {top:0;font-size:14px;color:#9fadc3;transition:.15s}

/* 樣式二：滑鼠停駐 input 時 label 消失 */
.cls_InputEffect ~ .placeholder_Hide {z-index:-1;position:absolute;top:25px;left:14px;font-family:"微軟正黑體","Microsoft JhengHei";color:#9fadc3;font-size:21px;letter-spacing:.5px;white-space:nowrap}
.cls_InputEffect:focus ~ .placeholder_Hide,.has-content.cls_InputEffect ~ .placeholder_Hide{visibility:hidden}
.cls_InputEffect.focus ~ .placeholder_Hide,.has-content.cls_InputEffect ~ .placeholder_Hide{visibility:hidden}/*  Fix APP */
.cls_InputEffect ~ .title {z-index:-1;position:absolute;top:0px;left:14px;font-family:"微軟正黑體","Microsoft JhengHei";color:#9fadc3;font-size:14px;letter-spacing:.5px;white-space:nowrap}
.cls_InputEffect:focus ~ .title {color:#daa360}
.cls_InputEffect.focus ~ .title {color:#daa360}/*  Fix APP */

/* 樣式三：不可修改 */
.cls_Input.disabled {border-bottom:none}
.cls_Input.disabled .cls_InputEffect {color:#3f5372;cursor:not-allowed;background:#EBEBEB;border-radius:3px;padding:10px 14px}

/* 樣式四：無副標題 */
.cls_Input.nosubtitle {min-height:48px}
.cls_Input.nosubtitle .cls_InputEffect ~ .placeholder_Hide {top:13px}

/* 退票年度 - 年 (固定) */
.cls_InputEffect ~ .placeholder_Fixed {z-index:-1;position:absolute;top:25px;right:14px;font-family:"微軟正黑體","Microsoft JhengHei";color:#172439;font-size:21px;letter-spacing:.5px;white-space:nowrap}

/* input 檢核錯誤時 */
.cls_Input_ErrorMSG {display:none;position:absolute;font-size:14px;color:#cb4827;bottom:-18px;left:14px;white-space:nowrap}
.error.cls_Input {border-bottom:1px solid #C43826}
.error.cls_Input .cls_InputEffect ~ .placeholder {color:#c43826}
.error.cls_Input .cls_InputEffect ~ .placeholder_Hide {color:#c43826}
.error.cls_Input .cls_InputEffect ~ .title {color:#c43826}
.error.cls_Input .cls_InputEffect:focus ~ .title {color:#c43826}
.error.cls_Input .has-content.cls_InputEffect ~ .title {color:#daa360}
.error.cls_Input .cls_Input_ErrorMSG {display:inline-block}
.error.cls_Input .cls_InputEffect ~ .cls_FocusLine, 
.error.cls_Input .cls_InputEffect:focus ~ .cls_FocusLine {background-color:#C43826}
.error.cls_Input .cls_InputEffect:focus ~ .placeholder,.error.cls_Input .has-content.cls_InputEffect ~ .placeholder{color:#c43826}
.error.cls_Input .cls_InputEffect:focus ~ .placeholder_Hide,.error.cls_Input .has-content.cls_InputEffect ~ .placeholder_Hide{color:#c43826}

/* CheckBox 樣式 */
.cls_CheckBox {display:table;font-size:0;border-collapse:collapse;border:0;width:100%;cursor:pointer;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.cls_CheckBox div {display:table-cell;font-size:0;vertical-align:middle}
.cls_CheckBox .cls_ICON {width:38px}
.cls_CheckBox .cls_ICON div {display:inline-block;width:26px;height:26px;padding:0px;background:url(../../Images/Common/ICON_CheckBox_NO.svg) no-repeat;background-size:26px 26px}
.ON.cls_CheckBox .cls_ICON div {background:url(../../Images/Common/ICON_CheckBox_YES.svg) no-repeat;background-size:26px 26px}
.cls_CheckBox div span {font-size:21px;color:#172439;letter-spacing:-0.53px;}

/* RadioBox 樣式 */
.cls_RadioBox {display:table;font-size:0;border-collapse:collapse;border:0;cursor:pointer;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.cls_RadioBox div {display:table-cell;font-size:0;border-collapse:collapse;border:0;vertical-align:top}
.cls_RadioBox .cls_ICON {width:38px}
.cls_RadioBox .cls_ICON div {display:inline-block;width:26px;height:26px;padding:0px;background:url(../../Images/Common/ICON_RadioBox_NO.svg) no-repeat;background-size:26px 26px}
.ON.cls_RadioBox .cls_ICON div {background:url(../../Images/Common/ICON_RadioBox_YES.svg) no-repeat;background-size:26px 26px}
.cls_RadioBox div span {font-size:21px;color:#172439;letter-spacing:0.53px}
.cls_RadioBox .cls_ICON div.disabled {background:url(../../Images/Common/ICON_RadioBox_NO_DIS.svg) no-repeat}

/* 備註說明標題 */
.cls_ItemTitle {display:table;font-size:0;border-collapse:collapse;border:0}
.cls_ItemTitle div {display:table-cell;border-collapse:collapse;border:0;font-size:0px;text-align:left;vertical-align:middle;height:22px}
.cls_ItemTitle div span {font-size:16px;font-weight:600;letter-spacing:0.4px;color:#172439;padding-left:14px;box-sizing:border-box}
.cls_ItemTitle div.ICON {width:30px;text-align:right}
.cls_ItemTitle div.ICON img {width:20px;cursor:pointer}

/* Notice_R */
.cls_Notice_R_ICON {display:table-cell;font-size:0px;width:1px;white-space:nowrap;vertical-align:middle;padding-right:7px;box-sizing:border-box;height:24px}
.cls_Notice_R_ICON img {width:20px;cursor:pointer}
.cls_Notice_R {display:table-cell;font-size:16px;color:#c43826;letter-spacing:0.4px;white-space:nowrap;vertical-align:middle;height:24px}

/* 選擇方塊 */
.cls_SelBox_Item {display:table;font-size:0;border-collapse:collapse;border:0;margin:0px auto;box-sizing:border-box;cursor:pointer;width:100%}
.cls_SelBox_Item div {display:table-cell;border-collapse:collapse;width:150px;height:60px;border:1px solid #c43826;color:#c43826;background:#FFFFFF;box-sizing:border-box;font-size:21px;text-align:center;vertical-align:middle}
.ON.cls_SelBox_Item div {color:#FFFFFF;background:#c43826}
.Disabled.cls_SelBox_Item div {color:#FFFFFF;background:#c0c0c0;border:1px solid #c0c0c0;cursor:not-allowed}

/* 垂直置中 Area */
.cls_MiddleContent {position:fixed;z-index:1;top:0;left:0;width:100%;height:100%}

/* 垂直置中 Position */
.cls_MiddleContent_Position {z-index:1;position:relative;top:0;bottom:0;width:100%;height:100%}
.cls_MiddleContent_Position img {max-width:720px}
#divMiddleContent_Inner {margin-top:-50px}

._Err {font-size:12px;color:rgba(230, 235, 245, 0.8);text-align:center}


/* ▁▁▁▁▁▁▂▄▆█ RWD Setting █▆▄▂▁▁▁▁▁▁ */

@media screen and (max-width: 460px) {
    .cls_Buttons_Next {max-width:100%}
    .cls_Buttons_Disabled {max-width:100%}
}
@media screen and (max-width: 434px) {
    .cls_CheckBox .cls_ICON {vertical-align:top;padding-top:2px}
}
@media screen and (max-width: 360px) {
    .myUL li {width:100px}
    /* 連接線 - 未完成 */
    .myUL li::after {left:calc(83%);width:calc(30%)}
    /* 連接線 - 已完成 */
    .myUL li.visited::after{left:calc(83%);width:calc(30%)}
}

@media screen and (max-width: 385px) {
    /* 備註說明標題 */
    .cls_ItemTitle div span {padding-left:5px}
    /* input 樣式 */
    .cls_InputEffect {padding:10px 5px 6px 5px }
    .cls_InputEffect ~ .placeholder {left:5px}
    .cls_InputEffect:focus ~ .placeholder,.has-content.cls_InputEffect ~ .placeholder{left:5px}
    .cls_InputEffect ~ .placeholder_Hide {left:5px}
    .cls_InputEffect:focus ~ .placeholder_Hide,.has-content.cls_InputEffect ~ .placeholder_Hide{left:5px}
    .cls_InputEffect ~ .title {left:5px}
    /* input 檢核錯誤時 */
    .cls_Input_ErrorMSG {left:5px}
}
@media screen and (max-width: 323px) {
    /* input 樣式 */
    /*.cls_InputEffect {font-size:16px}
    .cls_InputEffect ~ .placeholder {font-size:16px}
    .cls_InputEffect ~ .placeholder_Hide {font-size:16px}*/
}
@media screen and (max-width: 320px) {
    /* CheckBox 樣式 */
    .cls_CheckBox .cls_ICON {width:34px}
    /* RadioBox 樣式 */
    .cls_RadioBox .cls_ICON {width:34px} 
}