/*layout*/
html,body{margin:0; padding:0;font-family:"微軟正黑體", Arial}

/*整頁bg*/
body{ background:url(../img/oaad-h-bg.jpg) no-repeat;}

/*清除 float*/
.clearf{zoom:1;}
.clearf::before ,.clearf::after{content:""; display:table;}
.clearf::after{ clear:both;}

/*版型1藍色*/
.sys-style-a{border:2px; border-radius:10px; background:#fdfdff; width:95%; margin:1% auto; padding:1%;}

/*版型1藍色-大標題*/
.sys-style-a .title{ color:#6582ee; font-weight:bold;}
.sys-style-a .title h2.s-title{ font-size:2.2em; margin-top:3px; min-height:50px; line-height:1.5em; margin-left:90px; text-align:left;
padding-top:10px;}
.sys-style-a .title span{ font-size:.6em; display:block; margin-top:0; line-height:1em;}
.sys-style-a .title img{width:90px; height:auto; display:block; float:left; vertical-align:middle;} 

/*版型1藍色-麵包屑*/
.sys-style-a .history ,.sys-style-a .history a{ color:#253d94; font-weight:bold; margin-bottom:15px;}

/*版型1藍色-次標題*/
.sys-style-a .subtitle{ color:#6582ee; font-weight:bold; font-size:1.3em; border-top:1px solid #6582ee; border-bottom:1px solid #6582ee;}
.sys-style-a .subtitle h3{padding:10px 0; margin:0;}

/*版型1藍色-說明區*/
.sys-style-a .exp{ color:#646f98;}
.sys-style-a .exptitle{font-size:1.2em; font-weight:bold; border-left:5px solid #646f98; border-radius:2px; margin:10px auto 8px auto; padding-left:10px;}
.sys-style-a .expct{ font-size:.95em; margin-left:18px;}

/*版型1藍色-表單*/

/*版型1藍色-表單-標題*/
.sys-style-a .formsty .form-title{ color:#f1f1f1; border:1px solid #6582ee;border-bottom:5px solid #a1abd3; border-radius:6px; padding:5px 10px; background:#6374ad;}

/*版型1藍色-表單-選擇欄位*/
.sys-style-a .form-a span.ltitle{ display:inline; background:#6582ee; min-width:20%; color:#fff; text-align:center; padding:6px; float:left; margin-right:3px;
vertical-align:middle;}



.sys-style-a .form-a ul.fillform-1,
.sys-style-a .form-a ul.fillform-2,
.sys-style-a .form-a ul.fillform-3,
.sys-style-a .form-a ul.fillform-4,
.sys-style-a .form-a ul.fillform-5
{ margin:0; padding:0;}

.sys-style-a .form-a ul.fillform-1 li,
.sys-style-a .form-a ul.fillform-2 li,
.sys-style-a .form-a ul.fillform-3 li,
.sys-style-a .form-a ul.fillform-4 li,
.sys-style-a .form-a ul.fillform-5 li
{ display:inline-block; white-space:nowrap; list-style:none; font-size:.9em;width: 100%;}

.sys-style-a .form-a ul.fillform-1 li input[type="text"],
.sys-style-a .form-a ul.fillform-2 li input[type="text"],
.sys-style-a .form-a ul.fillform-3 li input[type="text"],
.sys-style-a .form-a ul.fillform-4 li input[type="text"]
{display:inline-block; font-size:.9em;}

.sys-style-a .form-a ul.fillform-1 li input[type="text"],
.sys-style-a .form-a ul.fillform-1 li select,
.sys-style-a .form-a ul.fillform-2 li input[type="text"],
.sys-style-a .form-a ul.fillform-2 li select,
.sys-style-a .form-a ul.fillform-3 li input[type="text"],
.sys-style-a .form-a ul.fillform-3 li select,
.sys-style-a .form-a ul.fillform-4 li input[type="text"],
.sys-style-a .form-a ul.fillform-4 li select
{background:#edf0fc; border:1px solid #6582ee;box-sizing:border-box;-moz-box-sizing:border-box;height:34px; line-height:34px; padding-left:3px;}

.sys-style-a .form-a ul.fillform-1 li select::-ms-expand,
.sys-style-a .form-a ul.fillform-2 li select::-ms-expand,
.sys-style-a .form-a ul.fillform-3 li select::-ms-expand,
.sys-style-a .form-a ul.fillform-4 li select::-ms-expand
{display: none;}


.sys-style-a .form-a ul.fillform-1 li select,
.sys-style-a .form-a ul.fillform-2 li select,
.sys-style-a .form-a ul.fillform-3 li select,
.sys-style-a .form-a ul.fillform-4 li select
{ border:1px solid #6582ee;color:#3b497d; font-size:.95em; font-weight:bold;
appearance:none;
  -moz-appearance:none;
  -webkit-appearance:none;
 background:url(../img/arrow.png) no-repeat right #edf0fc;}

.sys-style-a .form-a ul.fillform-1 li input[type="text"]{width:100%;}
.sys-style-a .form-a ul li input[type="submit"],.form-btn
{min-width:80px; height:34px; background:#6476ba; color:#f7f7f7; font-size:.9em; vertical-align:top; 
border:2px solid #3b3b71; border-radius:2px;
position: relative; float: right; margin-right: 0; margin-top: -35px;}

.rbdr{ border:1px solid #f9b3d5;}

.sys-style-a .form-a ul.fillform-1 li select{ width:100%; display:inline-block;}

.sys-style-a .form-a ul.fillform-2 li input[type="text"],
.sys-style-a .form-a ul.fillform-2 li select{width:48%; vertical-align:middle;}

.sys-style-a .form-a ul.fillform-3 li input[type="text"],
.sys-style-a .form-a ul.fillform-3 li select{width:32.8%; vertical-align:middle;}

.sys-style-a .form-a ul.fillform-4 li input[type="text"],
.sys-style-a .form-a ul.fillform-4 li select{width:21.2%;vertical-align:middle;}

.sys-style-a .form-a ul.fillform-5 li span{ display:block; float:left; border:1px solid #fff; margin-top:10px; font-size:medium; width:auto; white-space:nowrap;}


/*分欄*/
.sysform3 .form-a,.sysform1 .form-a,.sysform2 .form-a{border-bottom:2px solid #6582ee; padding-bottom:3px; vertical-align:top;
display:inline-block;margin:10px .5% 10px 1.5%;}

/*三欄*/
.sysform3 .form-a{ width:30%;}

/*二欄*/
.sysform2 .form-a{ width:47.5%;}

/*一欄*/
.sysform1 .form-a{ width:95%;}

/*按鈕區*/
.btn-area{margin:10px .5% 10px 1.5%;text-align: center;}
.prev-btn,.next-btn,.cancel-btn,.ok-btn{ font-size: medium; font-family:Arial,"Microsoft JhengHei","微軟正黑體",sans-serif ; font-weight:bold; padding:
10px; border-radius:30px;min-width:150px; margin-bottom:10px;-webkit-box-shadow: -1px 3px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: -1px 3px 5px 0px rgba(0,0,0,0.75);
box-shadow: -1px 3px 5px 0px rgba(0,0,0,0.75); margin-right:10px; color:#fff; border:3px solid #ccc; letter-spacing:1px;}
.prev-btn{ background:#748a6a;}
.next-btn{ background:#41719d;}
.ok-btn{ background:#646f98;}
.cancel-btn{ background:#9b6f80;}
.cedit ,.cdelit{  font-weight:bold;color:#FFF; width:60px; height:30px; border-radius:5px; border:2px solid #ededed; margin-right:8px;
-webkit-box-shadow: 0px 3px 4px 0px rgba(0,0,0,0.55);
-moz-box-shadow: 0px 3px 4px 0px rgba(0,0,0,0.55);
box-shadow: 0px 3px 4px 0px rgba(0,0,0,0.55); letter-spacing:2px;}

.cedit{background:#3b91d3;}
.cdelit{background:#9c6094;}

/*表單資料樣式*/
.sys-style-a table{border:0;}
.table-a table{width:95%; margin:2% auto; font-size:.85em; color:#20378f;}
.table-a table th{ background: #515181; color:#fff; padding:5px;}
.table-a table td{border-bottom:2px solid #b2b2cf; padding:8px; text-align:left; font-size: small;}
.table-a table a{ color:#33C;}
.table-a table a:hover{color:#ccc;}
.table-a tr:nth-child(odd){background-color: #fff;}
.table-a tr:nth-child(even){background-color: #f4f3f4;}
.table-a input[type="text"],.table-a select{width:90%; text-align:center; margin:3px 2%;height: 19px; border: 2px solid #9887a0;
font-weight:bold;}
.table-a select{height: 25px;}
.tdfill-2 input[type="text"],.tdfill-2 select{width:40%;}

/*分頁table 設定*/
.table-a table table,.tab-page{width:auto;}
.table-a table table,.tab-page td{border: 0;padding: 10px;font-size: medium; font-weight: bold;}
 
/*分頁span 設定*/
.table-a table span a,.span-page a{ display: inline-block;padding: 10px;font-size: medium;font-weight: bold;}
.table-a table span span {font-size: medium;color: #fff;background: #141685;display: inline-block;padding: 5px;}

/*單選選擇設定*/
.fillform-5 tr,.fillform-5 td,.radio-tab tr,.radio-tab td{border-collapse:collapse; padding:0;}
.fillform-5 input[type="radio"],.radio-tab input[type="radio"]{margin-left:2px;}
.fillform-5 tr,.radio-tab tr{ display:block; float:left; margin-top:10px; font-size:medium; width:auto; }

/*Original-setting*/
td#formSRH_FormTitle_td {
    border-left: 5px solid #59638b;  padding-left: 8px;}

/*media query*/
@media screen and (max-width: 900px){.sysform3 .form-a{ width:45%;}}

@media screen and (max-width: 852px){.tdfill-2 input[type="text"]{width:90%;}.tdfill-2 select{width:100%;}}

@media screen and (max-width: 797px){.sysform3 .form-a ,.sysform2 .form-a{ width:98%;} .table-a table th{ display:none;} .table-a table [data-title]::before{content: attr(data-title); display:inline-block; min-width:80px; background:#8491c1; padding:5px; text-align:center; color:#fff; margin-right:10px;}.table-a table td{ display:block; text-align:left; padding:8px; border-bottom:2px solid #dadeed;}
.table-a table td:last-child{border-bottom:3px solid #666; border-radius:10px;} .table-a table tr:first-child{ display:none;}.table-a table tr{border:1px solid #d6d7da; display:block; margin-bottom:10px; border-radius:10px;}
.table-a table table tr:first-child{ display:block;}
.table-a input[type="text"]{height:28px; line-height:28px;}.table-a select,.tdfill-2 select{width:91.8%;} .table-a select{height:32px;}.table-a input[type="text"],.table-a select,.tdfill-2 select{font-size:medium;}}
@media screen and (max-width: 500px){.sys-style-a .title h2.s-title {font-size: xx-large;}}