﻿/* 開戶之前準備 - 說明 */
.cls_Index_Notice_table {display:table;font-size:0;border-collapse:collapse;border:0;margin:0px auto}
.cls_Index_Notice_Logo {display:table-cell;font-size:0;border-collapse:collapse;border:0;vertical-align:middle;box-sizing:border-box}
.cls_Index_Notice_Title_1 {display:table-cell;font-size:0;border-collapse:collapse;border:0;vertical-align:middle;box-sizing:border-box}
.cls_Index_Notice_Line {display:table-cell;font-size:0;border-collapse:collapse;border:0;vertical-align:middle;box-sizing:border-box;padding:0px 12px}
.cls_Index_Notice_Line div {width:2px;height:20px;background:#8B919C}
.cls_Index_Notice_Title_2 {display:table-cell;font-size:0;border-collapse:collapse;border:0;vertical-align:middle;box-sizing:border-box}
.cls_Index_Notice_Title_1 span, 
.cls_Index_Notice_Title_2 span {font-size:26px;color:#FFFFFF}

/* 開戶之前請準備 */
.cls_Index_NoticePrepare_table {display:table;font-size:0;border-collapse:collapse;border:0;margin:0px auto}
.cls_Index_NoticePrepare_Title {display:table-cell;font-size:0;border-collapse:collapse;border:0;vertical-align:middle;box-sizing:border-box}
.cls_Index_NoticePrepare_Title span {font-size:14px;color:#172439;letter-spacing:0.35px}
.cls_Index_NoticePrepare_Left {display:table-cell;font-size:0;border-collapse:collapse;border:0;vertical-align:middle;box-sizing:border-box;width:70px;padding-right:12px}
.cls_Index_NoticePrepare_Right {display:table-cell;font-size:0;border-collapse:collapse;border:0;vertical-align:middle;box-sizing:border-box;width:70px;padding-left:12px}
.cls_Index_NoticePrepare_Left div {width:100%;height:1px;background: linear-gradient(to right, #ffffff 0%,#172439 100%)}
.cls_Index_NoticePrepare_Right div {width:100%;height:1px;background: linear-gradient(to left, #ffffff 0%,#172439 100%)}

/* 國民身分證、第二證件、永豐銀行戶 */
.cls_Index_DocIcon_table {display:table;font-size:0;border-collapse:collapse;border:0;margin:0px auto;width:252px}
.cls_Index_DocIcon_Left {display:table-cell;font-size:0;border-collapse:collapse;border:0;vertical-align:middle;text-align:center;box-sizing:border-box;width:35%}
.cls_Index_DocIcon_Mid {display:table-cell;font-size:0;border-collapse:collapse;border:0;vertical-align:middle;text-align:center;box-sizing:border-box;width:30%}
.cls_Index_DocIcon_Right {display:table-cell;font-size:0;border-collapse:collapse;border:0;vertical-align:middle;text-align:center;box-sizing:border-box;width:35%}
.cls_Index_DocIcon_Left img, 
.cls_Index_DocIcon_Mid img, 
.cls_Index_DocIcon_Right img {width:56px}
.cls_Index_DocIcon_Left div, 
.cls_Index_DocIcon_Mid div, 
.cls_Index_DocIcon_Right div {font-size:14px;color:#172439;letter-spacing:0.35px}

/* 首頁內容區塊 */
.cls_Index_Input_Area {width:100%;max-width:345px;margin:0px auto}

/* 出生年月日 - 寬度 */
.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%}

/* 確認閱讀條款區域 */
.cls_Index_CheckBox_Area {padding:0px 14px;box-sizing:border-box}

/* ================================================== */
/*  條款                                              */
/* ================================================== */

/* DocButtons Area */
.cls_DocButtons {position:fixed;bottom:0px;left:0px;width:100%;padding:17px 16px 16px 16px;box-sizing:border-box;font-size:0px;background:#FFF;display:none;border-top:1px solid #e6ebf5}
.cls_DocButtons_table {display:table;font-size:0;border-collapse:collapse;border:0;width:100%;margin:0px auto}
.cls_DocButtons_td {display:table-cell;font-size:0;height:60px;text-align:left;vertical-align:middle;border:0}

/* 返回按鈕 */
.cls_DocButtons_Back {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_DocButtons_Back div {display:table-cell;font-size:21px;color:#FFFFFF;width:100%;height:60px;text-align:center;vertical-align:middle;border:1px solid #c43826;white-space:nowrap;padding-left:20px;padding-right:20px;box-sizing:border-box}
.cls_DocButtons_Back div a {color:#FFFFFF;text-decoration:none}

/* 指定營業員 input 樣式 */
.cls_Input.Sales {background:url(../../Images/Common/ICON_Search.svg) no-repeat left 24px;background-size:32px 32px}
.cls_Input.Sales .cls_InputEffect {padding-left:37px}
.cls_Input.Sales .cls_InputEffect ~ .placeholder_Hide {left:37px}
.cls_InputEffect_Result_Empty {color:#c43826;}

/* 選定營業員後遮罩區域 */
.cls_Input.Sales .cls_InputEffect ~ .cls_SALE_EMP_NAME_Final {z-index:2;position:absolute;top:25px;left:37px;font-family:"微軟正黑體","Microsoft JhengHei";color:#172439;font-size:21px;font-weight:bold;letter-spacing:.5px;white-space:nowrap;background:#FFF;width:90%}
.cls_SALE_EMP_NAME_Final.Hide {display:none}

/* 指定營業員 - 查詢結果 */
.cls_Sales_Result {display:table;font-size:0;border-collapse:collapse;border:0;margin:8px auto 0px auto;width:100%}
.cls_Sales_Result div {display:table-cell;border-collapse:collapse;width:100%;height:54px;font-size:21px;font-weight:bold;color:#172439;background:#e6ebf5;text-align:center;vertical-align:middle;cursor:pointer}

/* 指定營業員 - 查詢結果無資料 */
.cls_Sales_Result_Empty {display:table;font-size:0;border-collapse:collapse;border:0;margin:8px auto 0px auto;width:100%}
.cls_Sales_Result_Empty div {display:table-cell;border-collapse:collapse;width:100%;height:54px;font-size:21px;font-weight:bold;color:#c43826;background:#f9ebe9;text-align:center;vertical-align:middle}
.cls_Sales_Result_Empty label {vertical-align:middle}
.alert-area-icon {height:24px;vertical-align: middle}

/* CheckBox 樣式不允許勾選 */
.Disable.cls_CheckBox, .Disable.cls_CheckBox * {cursor:not-allowed}
.Disable.cls_CheckBox .cls_ICON div {background:url(../../Images/Common/ICON_CheckBox_DIS2.svg) no-repeat;background-size:26px 26px}
.Disable.cls_CheckBox span {cursor:not-allowed}


/* ▁▁▁▁▁▁▂▄▆█ RWD Setting █▆▄▂▁▁▁▁▁▁ */

@media screen and (max-width: 460px) {
    .cls_DocButtons_Back {max-width:100%}
}
@media screen and (max-width: 393px) {
    /* 出生年月日 - 月、日寬度 */
    .cls_Birthday_MonthDay_Width {width:50px}

    /* 指定營業員 */
    .cls_Input.Sales .cls_InputEffect {font-size:18px;padding-bottom:8px}
    .cls_Input.Sales .cls_InputEffect ~ .placeholder_Hide {font-size:18px;top:28px}
    .cls_Input.Sales .cls_InputEffect ~ .cls_SALE_EMP_NAME_Final {font-size:18px;top:28px}
}
@media screen and (max-width: 320px) {
    /* 確認閱讀條款區域 */
    .cls_Index_CheckBox_Area {padding:0px 0px}
    /* 出生年月日 - 寬度 */
    .cls_Birthday_Year_W {width:42%}
    .cls_Birthday_MonthDay_Width {width:20%}
    .cls_Index_Notice_Line {padding:0px 5px}

    /* 指定營業員 */
    .cls_Input.Sales .cls_InputEffect {font-size:16px;padding-bottom:8px}
    .cls_Input.Sales .cls_InputEffect ~ .placeholder_Hide {font-size:16px;top:28px}
    .cls_Input.Sales .cls_InputEffect ~ .cls_SALE_EMP_NAME_Final {font-size:16px;top:28px}
}