@charset "utf-8";

/* --------------------------------------
* 基本
* -------------------------------------- */
.MuiForm,
.MuiForm input,
.MuiForm select { font-family: "Microsoft JhengHei", sans-serif; font-size: 1rem; line-height: 1; text-align: left; color: rgba(0,0,0,0.87);}
.MuiForm input,
.MuiForm select { display: block; margin: 0; padding: 0; border: 0; border-radius: 0px; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box;  background-color: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.MuiForm input:focus,
.MuiForm select:focus { outline: none;}
    @media screen and (max-width:767px){
    }
    @media screen and (min-width:768px){
      /*.MuiForm,
      .MuiForm input,
      .MuiForm select,
      .MuiForm label { font-size: 18px;}*/
    }
    
  
/* --------------------------------------
* 一般樣式
* -------------------------------------- */
.MuiForm { z-index: 0; position: relative; margin: 24px 8px; padding: 0; color: rgba(0,0,0,0.87);}
.MuiForm .MuiForm_animated { transition: color 200ms cubic-bezier(0, 0, 0.2, 1) 0ms, transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;}
.MuiForm .MuiForm_helpertext { display: none; margin-top: 3px; font-size: 0.75rem; line-height: 1.66; color: #f44336; text-align: left;}
.MuiForm .MuiForm_icon { fill: currentColor; display: inline-block; width: 1em; height: 1em; font-size: 1.5rem; transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;}
.MuiForm .MuiForm_box { }

/*底圖*/
.MuiForm .MuiForm_bg { pointer-events: none; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: 0; padding: 0; border: 0;}
.MuiForm .MuiForm_bg { border-style: solid; border-width: 0 0 1px 0; border-color: rgba(0,0,0,0.23); border-radius: inherit;}
.MuiForm:hover .MuiForm_bg { border-color: rgba(0,0,0,0.87);}
    /*高亮*/
    .MuiForm.is_focused .MuiForm_bg { border-width: 0 0 2px 0; border-color: #4c67ff;}
    .MuiForm.is_empty .MuiForm_bg { border-width: 0 0 2px 0; border-color: #f44336;}

/*文字*/  
.MuiForm .MuiForm_label { pointer-events: none; z-index: 1; position: absolute; top: 0; left: 0; display: block; transform-origin: top left; transform: translate(0px,20px) scale(1); color: rgba(0,0,0,0.54);}
.MuiForm .MuiForm_label:after { content: ""; z-index: -1; position: absolute; top: 0; left: -8px; width: calc(100% + 16px); height: 100%; display: block; background-color: #fff; opacity: 0;}
    /*飄移*/
    .MuiForm.is_shrink .MuiForm_label { transform: translate(0px,1.5px) scale(0.75);}
    .MuiForm.is_shrink .MuiForm_label:after { opacity: 1;}
    /*高亮*/
    .MuiForm.is_focused .MuiForm_label { color: #4c67ff;}
    .MuiForm.is_empty .MuiForm_label { color: #f44336;}
    
    .MuiForm .MuiForm_label .altMsg { display: none;}
    .MuiForm.is_empty .MuiForm_label .altMsg { display: block;}

/*輸入欄input*/
.MuiForm_inputbox .MuiForm_box { padding-top: 16px;}
.MuiForm_inputbox .MuiForm_label { transform: translate(0px,27px) scale(1);}
.MuiForm_inputbox .MuiForm_input { padding: 6px 0 7px;}
  
/*下拉選單select*/
.MuiForm_selectbox .MuiForm_box { position: relative; padding-top: 16px;}
.MuiForm_selectbox .MuiForm_select { position: relative; padding: 8px 0 10px; border-color: currentColor; cursor: pointer;}
.MuiForm_selectbox .MuiForm_select { } 
.MuiForm_selectbox .MuiForm_icon { pointer-events: none; position: absolute; top: calc(50% - 6px); right: 0; color: rgba(0,0,0,0.54);}

/*上傳file*/
.MuiForm_uploadbox { padding: 14.5px 14px;}
.MuiForm_uploadbox .MuiForm_uploadbox_upload { display: block; text-align: center; cursor: pointer;}
.MuiForm_uploadbox .MuiForm_upload { position: absolute; top: 0; left: 0; opacity: 0; }
.MuiForm_uploadbox .MuiForm_btn { display: block; margin: 0 auto; padding: 10px 0; border-radius: 4px; width: 100%; max-width: 120px; color: #fff; text-align: center; background-color: #4c67ff;}
.MuiForm_uploadbox .MuiForm_btn:before { content: "上傳";}
.MuiForm_uploadbox .MuiForm_btn_clear {  background-color: #666;}
.MuiForm_uploadbox .MuiForm_btn_clear:before { content: "清除";}
.MuiForm_uploadbox .MuiForm_icon { padding: 30px 0 6px; width: 3em; height: 3em; color: rgba(0,0,0,0.54);}
.MuiForm_uploadbox .MuiForm_uploadbox_preview { display: none;}
.MuiForm_uploadbox .MuiForm_preview_img { display: block; margin-bottom: 10px; width: 100%; height: 0; padding-bottom: 100%; background-position: center top; background-size: contain; background-repeat: no-repeat;}

    /*預覽*/
    .MuiForm.is_preview .MuiForm_uploadbox_importview { display: none;}
    .MuiForm.is_preview .MuiForm_uploadbox_preview { display: block;}
  


  
/* --------------------------------------
* 自訂樣式
* -------------------------------------- */

  
/*樣式--外框線*/
.MuiForm_style_outline { }
.MuiForm_style_outline .MuiForm_helpertext { margin-left: 14px; margin-right: 14px;}
.MuiForm_style_outline .MuiForm_icon { right: 7px;}
.MuiForm_style_outline .MuiForm_box { border-radius: 4px;}

/*底圖*/
.MuiForm_style_outline .MuiForm_bg { border-width: 1px;}
    /*高亮*/
    .MuiForm_style_outline.is_focused .MuiForm_bg { border-width: 2px;}

/*文字*/  
.MuiForm_style_outline .MuiForm_label { transform: translate(14px,17px) scale(1);}
    /*飄移*/
    .MuiForm_style_outline.is_shrink .MuiForm_label { transform: translate(14px,-6px) scale(0.75);} 

/*輸入欄input*/
.MuiForm_style_outline.MuiForm_inputbox .MuiForm_box { padding: 14.5px 14px;}
.MuiForm_style_outline.MuiForm_inputbox .MuiForm_input { padding: 0;}

/*下拉選單select*/
.MuiForm_style_outline.MuiForm_selectbox .MuiForm_box { padding: 0;}
.MuiForm_style_outline.MuiForm_selectbox .MuiForm_select { padding: 17px 14px; padding-right: 32px;}
.MuiForm_style_outline.MuiForm_selectbox .MuiForm_icon { top: calc(50% - 12px);}