@charset "utf-8";
/* 基本樣式:版型使用顏色(工研藍)V1801 */

/*  ===== 網站元件樣式 ===== */
/* font style */
.font-normal{color:#181818;}
.font-normal a{color:#428bca;text-decoration: none;border-bottom: 1px solid transparent;transition: all ease-in-out 0.2s;}
.font-normal a:hover{color:#2a6496;border-color:#2a6496;}

.font-white{color:#FFFFFF;}
.font-white a{color:#FFFFFF; text-decoration:none;border-bottom: 1px solid transparent;transition: all ease-in-out 0.2s;}
.font-white a:hover{color:#FF0;border-color:#FF0;}
.font-title{color:#00899a;}
.font-title a{color:#00899a; text-decoration:none;border-bottom: 1px solid transparent;transition: all ease-in-out 0.2s;}
.font-title a:hover{color:#00b0c5; border-color:#00b0c5;}
.font-red{color:red;}

/* 指引步驟 */
.processtable .prononework{background:#f1f1f1; border:1px solid #cbcbcb; color:#9c9c9c; }
.processtable .procurrent{ font-weight:bold; border:1px solid #4565a1; background:#3b3b3b; color:#fff;}
.processtable .profinish{background:#fff; color:#656565; border:1px solid #ababab;}
.processtable .proiconfinish{color:#ababab;}
.processtable .proiconcurrent{color:#2a2a2a;}
.processtable .proiconnone{color:#e9e9e9;}
/* 指引步驟樣式二 */
.OchiStep li a {color: white;background-color: hsla(0, 0%, 83%, 1);text-align: center;text-transform: capitalize;}
.OchiStep li.completed a {background:#eaeaea;color:#404040;}
.OchiStep li.completed a:after {border-left: 30px solid #eaeaea;}
.OchiStep li.active a {background: #3b3b3b;}
.OchiStep li.active a:after {border-left: 30px solid #3b3b3b;}
.OchiStep li a:before {border-left: 30px solid white;}
.OchiStep li a:after {border-left: 30px solid hsla(0, 0%, 83%, 1);}

/* 頁籤式按鈕 */
.tabmenublock{border-bottom:1px solid #d3d3d3;}
.SlimTabBtnCurrent{background:#FFFFFF; border:1px solid #d3d3d3; border-bottom:0; font-weight:bold;}
.SlimTabBtn a{color:#535353; text-decoration:none; background:#ededed;border:1px solid #d3d3d3;transition: all ease-in-out 0.2s;}
.SlimTabBtn a:hover{color:#1688c3; background:#fff;}

/* 按鈕樣式:一般 */
a.genbtn,input.genbtn,button.genbtn{
    border:1px solid #d1d1d1; padding:5px 15px;*padding:5px;_padding:5px;color:#434343; font-size:1.15em; margin:0px 2px;font-weight:bold;
    background-color:#fafafa;text-shadow: 1px 1px 1px #fff;
    background-image: -webkit-linear-gradient(top, #fafafa, #dddddd);
    background-image: -moz-linear-gradient(top, #fafafa, #dddddd);
    background-image: -ms-linear-gradient(top, #fafafa, #dddddd);
    background-image: -o-linear-gradient(top, #fafafa, #dddddd);
    background-image: linear-gradient(to bottom, #fafafa, #dddddd);
    -webkit-border-radius:8px;
    -moz-border-radius:8px;
    border-radius:8px;
    transition: all ease-in-out 0.2s;
}
a.genbtn:hover,input.genbtn:hover,button.genbtn:hover{
    cursor:pointer;color:#fff;border:1px solid #232323;text-decoration:none;
    background-color:#6d6d6d;text-shadow: 1px 1px 1px #000;
    background-image: -webkit-linear-gradient(top, #6d6d6d, #171717);
    background-image: -moz-linear-gradient(top, #6d6d6d, #171717);
    background-image: -ms-linear-gradient(top, #6d6d6d, #171717);
    background-image: -o-linear-gradient(top, #6d6d6d, #171717);
    background-image: linear-gradient(to bottom, #6d6d6d, #171717);
}
a.genbtnS, input.genbtnS, button.genbtnS {
    border: 1px solid #d1d1d1;
    padding: 3px 15px;
    *padding: 5px;
    _padding: 5px;
    color: #434343;
    font-size: 1.0em;
    margin: 0px 2px;
    font-weight: bold;
    background-color: #fafafa;
    text-shadow: 1px 1px 1px #fff;
    background-image: -webkit-linear-gradient(top, #fafafa, #dddddd);
    background-image: -moz-linear-gradient(top, #fafafa, #dddddd);
    background-image: -ms-linear-gradient(top, #fafafa, #dddddd);
    background-image: -o-linear-gradient(top, #fafafa, #dddddd);
    background-image: linear-gradient(to bottom, #fafafa, #dddddd);
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    transition: all ease-in-out 0.2s;
}
a.genbtnS:hover,input.genbtnS:hover,button.genbtnS:hover{
    cursor:pointer;color:#fff;border:1px solid #232323;text-decoration:none;
    background-color:#6d6d6d;text-shadow: 1px 1px 1px #000;
    background-image: -webkit-linear-gradient(top, #6d6d6d, #171717);
    background-image: -moz-linear-gradient(top, #6d6d6d, #171717);
    background-image: -ms-linear-gradient(top, #6d6d6d, #171717);
    background-image: -o-linear-gradient(top, #6d6d6d, #171717);
    background-image: linear-gradient(to bottom, #6d6d6d, #171717);
}
a.genbtn:hover,a.genbtnS:hover{cursor:pointer;}

input.genbtn{
    padding:3px 15px;*padding:5px;_padding:5px;
}
input.genbtnS{
    padding:2px 15px;*padding:5px;_padding:5px;
}
button.genbtn{
    padding:3px 15px;*padding:5px;_padding:5px;
}
button.genbtnS{
    padding:2px 15px;*padding:5px;_padding:5px;
}
/* 按鈕樣式:特殊 */
a.keybtn, input.keybtn, button.keybtn {
    border: 1px solid #cdb469;
    padding: 5px 15px;
    *padding: 5px;
    _padding: 5px;
    color: #6d5941;
    font-size: 1.15em;
    margin: 0px 2px;
    font-weight: bold;
    background-color: #fefad9;
    text-shadow: 1px 1px 1px #fff;
    background-image: -webkit-linear-gradient(top, #fefad9, #fff17c);
    background-image: -moz-linear-gradient(top, #fefad9, #fff17c);
    background-image: -ms-linear-gradient(top, #fefad9, #fff17c);
    background-image: -o-linear-gradient(top, #fefad9, #fff17c);
    background-image: linear-gradient(to bottom, #fefad9, #fff17c);
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    transition: all ease-in-out 0.2s;
}
a.keybtn:hover,input.keybtn:hover,button.keybtn:hover{
cursor:pointer;color:#fff;border:1px solid #925712;text-decoration:none;
background-color:#ed9700;text-shadow: 1px 1px 1px #000;
background-image: -webkit-linear-gradient(top, #ed9700, #be6700);
background-image: -moz-linear-gradient(top, #ed9700, #be6700);
background-image: -ms-linear-gradient(top, #ed9700, #be6700);
background-image: -o-linear-gradient(top, #ed9700, #be6700);
background-image: linear-gradient(to bottom, #ed9700, #be6700);
}
a.keybtnS,input.keybtnS,button.keybtnS{
border:1px solid #cdb469; padding:3px 15px;*padding:5px;_padding:5px;color:#6d5941; font-size:1.0em; margin:0px 2px;font-weight:bold;
background-color:#fefad9;text-shadow: 1px 1px 1px #fff;
background-image: -webkit-linear-gradient(top, #fefad9, #fff17c);
background-image: -moz-linear-gradient(top, #fefad9, #fff17c);
background-image: -ms-linear-gradient(top, #fefad9, #fff17c);
background-image: -o-linear-gradient(top, #fefad9, #fff17c);
background-image: linear-gradient(to bottom, #fefad9, #fff17c);
-webkit-border-radius:6px;
-moz-border-radius:6px;
border-radius:6px;
transition: all ease-in-out 0.2s;
}
a.keybtnS:hover,input.keybtnS:hover,button.keybtnS:hover{
cursor:pointer;color:#fff;border:1px solid #925712;text-decoration:none;
background-color:#ed9700;text-shadow: 1px 1px 1px #000;
background-image: -webkit-linear-gradient(top, #ed9700, #be6700);
background-image: -moz-linear-gradient(top, #ed9700, #be6700);
background-image: -ms-linear-gradient(top, #ed9700, #be6700);
background-image: -o-linear-gradient(top, #ed9700, #be6700);
background-image: linear-gradient(to bottom, #ed9700, #be6700);
}
a.keybtn:hover,a.keybtnS:hover{cursor:pointer;}

input.keybtn{
padding:3px 15px;*padding:5px;_padding:5px;
}
input.keybtnS{
padding:2px 15px;*padding:5px;_padding:5px;
}
button.keybtn{
padding:3px 15px;*padding:5px;_padding:5px;
}
button.keybtnS{
padding:2px 15px;*padding:5px;_padding:5px;
}

/* 輸入框 */
.inputex{border:1px solid #c5c5c5;transition: all ease-in-out 0.2s;}
.inputex:hover{border:1px solid #7b7b7b;}
.inputex:focus{border:1px solid #202020;}
/* 表單樣式 */
.gentable table{}
.gentable th{border-bottom:1px solid #bababa;}
.gentable td{border-bottom:1px dotted #bababa;}
.gentable td.titlebg{background:#f7f7f7;}
.titlebackicon{padding-right:10px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='20' %3E%3Ccircle cx='5' cy='6' r='1' fill='rgb(119, 155, 160)' /%3E%3Ccircle cx='5' cy='14' r='1' fill='rgb(119, 155, 160)' /%3E%3C/svg%3E") no-repeat right;}

/* 雙色表格 */
/* 雙色表格 layout */
.stripeMe table{border-collapse:collapse;}
.stripeMe table tr td{padding:8px 5px; border-collapse:collapse;}
.stripeMe th{padding:10px 5px; border-collapse:collapse;}
/* 雙色表格 color */
.stripeMe table{border:1px solid #9aced1;}
.stripeMe table tr td{border:1px solid #c1e1e8; background-color:#fbfeff;}
.stripeMe th{color:#204851; border:1px solid #77adba; background:#a6e3ee;}
.stripeMe th a{color:#1e9798; text-decoration:none;border-bottom: 1px solid transparent;transition: all ease-in-out 0.2s;}
.stripeMe th a:hover{color:#045051; border-color:#045051;}
.stripeMe tr:nth-child(even) > td{background-color:#e7f5f7;}
.stripeMe tr td:first-child{border-left-color:#9aced1;}
.stripeMe tr th:first-child{border-left-color:#9aced1;}
.stripeMe tr td:last-child{border-right-color:#9aced1;}
.stripeMe tr th:last-child{border-right-color:#9aced1;}
.stripeMe tr:last-child td{border-bottom-color:#9aced1;}
.stripeMe tr.spe td{background-color:#FEFBC2;}
/* 雙色表格內無樣式表格 */
.stripeMe table.tablenonestyle{border:0px;}
.stripeMe table.tablenonestyle tr td{padding:0px; border:0; background-color:transparent;}
/* 雙色表格內單純格線表格 */
.stripeMe table.tableline{}
.stripeMe table.tableline tr td{padding:3px; border-color:#c8c8c8; background-color:transparent;}


/* input group */
.Ochi-inputgroup .itemcell .adomicon{background:#EBEBEB; border:1px solid #c5c5c5; color:#999999;text-shadow: 1px 1px 1px #fff;}
.Ochi-inputgroup .itemcell input.typein{border:1px solid #c5c5c5;transition: all ease-in-out 0.2s;}
.Ochi-inputgroup .itemcell input.typein:hover{border:1px solid #7b7b7b;}
.Ochi-inputgroup .itemcell input.typein:focus{border:1px solid #202020;}
.Ochi-inputgroup .itemcell a.btnlink,.Ochi-inputgroup .itemcell input.btnlink,.Ochi-inputgroup .itemcell button.btnlink{
    border:1px solid #d1d1d1; color:#434343;text-shadow: 1px 1px 1px #fff;
    background-color:#fafafa;text-shadow: 1px 1px 1px #fff;
    background-image: -webkit-linear-gradient(top, #fafafa, #dddddd);
    background-image: -moz-linear-gradient(top, #fafafa, #dddddd);
    background-image: -ms-linear-gradient(top, #fafafa, #dddddd);
    background-image: -o-linear-gradient(top, #fafafa, #dddddd);
    background-image: linear-gradient(to bottom, #fafafa, #dddddd);
}
.Ochi-inputgroup .itemcell a.btnlink:hover,.Ochi-inputgroup .itemcell input.btnlink:hover,.Ochi-inputgroup .itemcell button.btnlink:hover{
    color:#fff;border:1px solid #232323;text-decoration:none;
    background-color:#6d6d6d;text-shadow: 1px 1px 1px #000;
    background-image: -webkit-linear-gradient(top, #6d6d6d, #171717);
    background-image: -moz-linear-gradient(top, #6d6d6d, #171717);
    background-image: -ms-linear-gradient(top, #6d6d6d, #171717);
    background-image: -o-linear-gradient(top, #6d6d6d, #171717);
    background-image: linear-gradient(to bottom, #6d6d6d, #171717);
}


/* 使用font-awesome美化checkbox、radio */
input[type=radio].with-font ~ label:before,
input[type=checkbox].with-font ~ label:before {
    color: #909090;
}

input[type=radio].with-font:checked ~ label:before,
input[type=checkbox].with-font:checked ~ label:before  {
    color: #1498dd;
}

input[type=checkbox].with-font:checked ~ label:before {
    color: #1498dd;
}