/* 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-color:white;}

/* 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%}

/* 圖檔預設為無框 */
img {border:none;}

/* Hyperlink 滑鼠預設為選取指標 */
a{cursor:pointer;}
a,a:visited{outline:none;behavior:expression(this.onFocus=this.blur());}

/* 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}

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


/* 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}

/* 內容區塊 */
.cls_Content_Area {width:100%;max-width:345px;margin:0px auto}

/* Buttons Area */
.cls_Buttons {width:100%;padding:16px 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:70%;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:300px;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:300px;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:300px;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}

/* 按鈕區域固定高度 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_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;padding-left:14px;}
.cls_ItemTitle div span {font-size:16px;font-weight:600;letter-spacing:0.4px;color:#172439;box-sizing:border-box}
.cls_ItemTitle div.ICON {width:30px;text-align:right}
.cls_ItemTitle div.ICON img {width:20px;cursor:pointer}

.cls_ItemTitle div .placeholder {display:block;margin-bottom:5px;color:#9fadc3;font-size:14px;letter-spacing:.5px;}
.cls_ItemTitle div .font21 {font-size:21px;}

/* 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:#9fadc3;transition:.15s}
.cls_InputEffect.focus ~ .placeholder       {top:0;font-size:14px;color:#9fadc3;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_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}

/* RadioBox 樣式 */
.cls_RBs_Area {position:relative;width:100%;min-height:60px;vertical-align:bottom;font-size:0}
.cls_RBs_Area .placeholder {margin-left:14px; padding-bottom:14px; font-family:"微軟正黑體","Microsoft JhengHei";color:#9fadc3;font-size:14px;letter-spacing:.5px;white-space:nowrap}

.cls_RadioBox {width:100%;margin-left:14px; 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/ICON/ICON_RadioBox_NO.svg) no-repeat;background-size:26px 26px}
.ON.cls_RadioBox .cls_ICON div {background:url(../Images/ICON/ICON_RadioBox_YES.svg) no-repeat;background-size:26px 26px}
.cls_RadioBox div span {font-size:20px;color:#172439;letter-spacing:0.53px;}

@media screen and (max-width: 320px) {
    /* 備註說明標題 */
    .cls_ItemTitle div .font21 {font-size:16px;}

    /* RadioBox 樣式 */
    .cls_RadioBox .cls_ICON {width:34px} 
    .cls_RadioBox div span {font-size:16px}
}

@media screen and (max-width: 385px) {
    /* 備註說明標題 */
    .cls_ItemTitle div {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}
    /* RadioBox 樣式 */
    .cls_RBs_Area .placeholder {margin-left:5px;}
    .cls_RadioBox {margin-left:5px;}
    .cls_RadioBox div span {font-size:18px}
}

/* 出生年月日 - 寬度 */
.cls_Birthday_Year_W {width:40%}
.cls_Birthday_Slash {color:#172439;font-weight:bold;font-size:21px;width:9%;text-align:center;vertical-align:bottom;padding-bottom:5px}
.cls_Birthday_MonthDay_Width {width:21%}


/* ▁▁▁▁▁▁▂▄▆█ 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: 393px) {
    /* 出生年月日 - 月、日寬度 */
    .cls_Birthday_MonthDay_Width {width:50px}
}
@media screen and (max-width: 320px) {
    /* 出生年月日 - 寬度 */
    .cls_Birthday_Year_W {width:42%}
    .cls_Birthday_MonthDay_Width {width:20%}
}