/*-----初始化-----*/
/* Prevent font scaling in landscape while allowing user zoom */
html { -webkit-text-size-adjust: 100%}
* { -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent; }
/* Fix FireFox placeholder line-height */
::-moz-placeholder { line-height: 130% }

:focus { outline: none; }

html, body {touch-action: manipulation;/*overflow-y: hidden*/; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; -webkit-text-size-adjust: 100%; height: 100%;}
body{ margin:0; padding:0; color:#313131; font:normal 16px/140% "微軟正黑體", Arial, Helvetica; background:#fff;}
div, p, span, ul, ol, li, h1, h2, h3, h4, h5, h6, input, table, td, th, img{ margin:0; padding:0; border:none;}
ul, ol { list-style:none;}
a{ display:block; text-decoration:none; cursor:pointer;}
img{ display:block; border:none;}
select{ vertical-align:middle; appearance:none; -moz-appearance:none;}
select::-ms-expand{ display:none;}
.hidden{display:none;}
span.a{cursor:pointer;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}

/*-----base-----*/
body.sticky{ padding:100px 0 0 0;}
.wrapper{ position:relative;}
.pagesize { position: relative; margin: 0 auto; padding: 0 5px; box-sizing: border-box; width: 80%; padding:0px 15px; box-sizing:border-box;}

/*input*/
input{ padding:0 0 0 10px; color:#626262; font:normal 16px/140% "微軟正黑體", Arial, Helvetica; color:#676767; background:#fff; box-sizing:border-box;}
select{ width:80px; height:30px; line-height:30px; padding:0 5px; font:normal 16px/140% "微軟正黑體", Arial, Helvetica; background:#fff url(../images/select_arrow.png) no-repeat center right; border:1px solid #dddddd; appearance:none; -moz-appearance:none; -webkit-appearance:none;}
input:disabled{ background:#e5e5e5;}
input.date{ padding:0 0 0 30px; background:#fff url(../images/icon_date.png) no-repeat 5% 50%; background-size:20px;}
input:focus{ border:1px solid #134b96; outline:none;}
input[type="checkbox"], input[type="file"]{ display:none; appearance:none; outline:none; opacity:0; }
input[type="checkbox"].showcheckbox{display:unset;appearance:auto; outline:unset; opacity:1;border:unset}
input[type="checkbox"] + span{ display:inline-block; width:16px; height:16px; margin:-2px 10px 0 0; line-height:16px; vertical-align:middle; background:#fff; border:1px solid #bfbfbf; cursor:pointer;}
input[type="checkbox"]:checked + span{ background:#fff url(../images/checkbox_c.png) no-repeat center center; background-size:16px;}
input[type="radio"] + span {display: inline-block;width: 25px;height: 25px;margin: -2px 10px 0 0;line-height: 25px;vertical-align: middle;background: #fff;cursor: pointer;}
input[type="radio"] + span{ position:relative; width:20px; height:20px; border-radius:100%;}
input[type="radio"]:checked + span::before{ position:absolute; left:0; right:0; top:50%; transform:translateY(-50%); display:block; content:""; width:10px; height:10px; margin:0 auto; background:#448aca; border-radius:100%;}
label{ position:relative; line-height:25px;}
label a{ display:inline-block; margin:0 0 0 5px; color:#448aca;}
label a:hover{ color:#f03a61;}
/*title*/
h2{ font-size:28px; line-height:28px;}
h3{ font-size:24px; line-height:24px;}
.txt_pk { /*color: #d65464;*/ color:red; text-shadow: 1px 0px 0px gray; }
.txt_gr{ color:#1bad85; text-shadow: 1px 0px 0px gray;}
/*button*/
.btn_main{ display:flex; flex-wrap:nowrap; flex-direction:row; justify-content:center; align-items:center;}
.btn_main a,.btn_main span.a{ flex:1 1 auto; display:block; margin:0 2% 0 0; text-align:center; color:#fff; background:#D23749; border:1px solid #D23749; box-sizing:border-box;}
.btn_main a:last-child,.btn_main span.a:last-child{ margin:0;}
.btn_main a:hover,.btn_main span.a:hover{ color:#D23749; background:rgba(0,0,0,0);}
/* 顯示密碼 */
.icon-eye{background-image:url(../images/icon-eye-off.png);background-repeat:no-repeat;background-size:100% 100%;width:20px;height:20px;position:absolute;top:10px;right:10px;cursor:pointer;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.icon-eye.on{background-image:url(../images/icon-eye-on.png)}

/*-----header-----*/
header{ position:relative; top:0; left:0; right:0; padding:20px 0; background:#ffffff; z-index:5; box-sizing:border-box; box-shadow:-2px 0 3px 0 rgba(0,0,0,0.30);}
header h1{ display:inline-block; text-indent:-9999px; vertical-align:middle;}
header h1 a{ width:210px; height:40px; background:url(../images/logo_header.png) no-repeat center center; background-size:100% auto;}
/*選單*/
header .nav_web{ display:inline-block; vertical-align:middle; margin:auto 0;}
header .nav_web .close_frm{ display:none;; }
header ul{ display:inline-block; vertical-align:middle;}
header ul li{ display:inline-block; font-size:18px; margin:0 0 0 20px;}
header ul li a{ color:#333333; font-weight:bold;}
header ul li a:hover{ color:#d23749;}
header .set_account{ position:absolute; top:0; right:15px; display:inline-block; vertical-align:middle;}
header .set_account img{ display:none;}
.btn_sign{ width:70px; height:40px; text-align:center; line-height:40px; color:#D23749; font-weight:bold; border:1px solid #d23749; border-radius:4px;}
.btn_sign:hover{ color:#fff; background:#d23749;}
.Menu_frm{ display:none; }


/*-----footer-----*/
footer{ position:relative; padding:4px 0 0 0; color:#fff; text-align:center; font-size:15px; font-family: Microsoft JhengHei,Calibri,serif; background:linear-gradient(135deg,#900000 0,#953735 100%); z-index:1;}
footer ul li{ display:inline-block; padding:0 10px 0 0; margin:0 6px 7px 0; line-height:15px; border-right:1px solid #fff;}
footer ul li:last-child{ border:none;}
footer .fp_address::before, footer .fp_phone::before{ display:inline-block; width:20px; height:20px; margin:0 4px; vertical-align:middle; content:""; background-size:20px; background-repeat:no-repeat; background-position:center;}
footer .fp_address::before{ background-image:url(../images/icon_address.png);}
footer .fp_phone::before{ background-image:url(../images/icon_phone.png);}


/*-----signin_con-----*/
.signin_con{ height:calc(100vh - 162.1px); background:url(../images/bg_login.png) no-repeat center center; background-size:cover;}
.signin_con .pagesize{ height:100%;}
.signin_con .sc_box{ position:absolute; left:0; right:0; top:50%; transform:translateY(-50%); width:400px; height:auto; margin:auto; padding:45px 40px; background:rgba(0,0,0,0.7); border-radius:10px; box-sizing:border-box; box-shadow:-8px 0 10px 0 rgba(0,0,0,0.38);}
.signin_con .sc_box h2{ margin:0 0 35px 0; color:#fff; text-align:center;}
.signin_con .sc_box h3{ margin:0 0 20px 0; color:#fff; text-align:center; font-size:16px;}
.signin_con .sc_box h3::before{ display:block; content:""; width:90px; height:90px; margin:0 auto 20px auto;  background:url(../images/icon_check.png) no-repeat center center; background-size:100% auto;}
.signin_con .sc_box input{ width:100%; height:40px; line-height:40px; border-radius:3px;}
.signin_con .sc_box li{ margin:0 0 20px 0;}
.signin_con .sc_box label{ color:#fff; font-size:14px;}
.signin_con .btn_main a{ height:40px; line-height:40px; border-radius:3px;}
.signin_con .btn_main span.a{ height:40px; line-height:40px; border-radius:3px;}
.signin_con p{ margin:0 0 20px 0; color:#ffec00; font-size:14px; text-align:justify;}


/*-----content-----*/
.content{ min-height:calc(100vh - 162.1px);}
.inpage_con{ padding:15px 0;}
/*tab*/
.tab_main{ margin:0 0 20px 0; border-bottom:1px solid #d8dde6;}
.tab_main::after{ clear:both; display:block; content:"";}
.tab_main a{ display:block; float:left; padding:10px; color:#000; font-weight:bold; font-size:18px; border-bottom:4px solid rgba(0,0,0,0); cursor:pointer;}
.tab_main a:hover, .tab_main a.select{ border-bottom:4px solid #5b7ea8;}
/*input_set*/
.input_set { margin:0 0 20px 0;}
.input_set div{ display:inline-block; margin:0 6px 0 0; vertical-align:top;}
.input_set h4{ flex:0 0 auto; display:inline-block; vertical-align:middle;}
.input_set input{ display:inline-block; height:30px; vertical-align:middle; font-size:15px; border:1px solid #dddddd;}
.input_set input[type="text"]{ width:100px;}
.input_set input.date{ width:130px;}
.is_name{ overflow:hidden; width:200px; height:30px; padding:0 10px; line-height:30px; text-align:center; font-size:14px; border:1px solid #dddddd; box-sizing:border-box;}
.is_name span{ margin:0 0 0 10px;}
.input_set .btn_main a{ width:60px; height:30px; line-height:28px; font-size:14px;}
.input_set .btn_main span.a{ width:60px; height:30px; line-height:28px; font-size:14px;}
.input_set .alert_con{ display:block; margin:5px 0 0 0; color:#D23749; font-weight:bold; font-size:14px;}
/*table*/
.table_box{ overflow-x:auto; margin:0 0 20px 0;}
.table_box table{ width:100%; table-layout:fixed; border-top:1px solid #dddddd; border-bottom:1px solid #dddddd;}
.table_box table th, .table_box table td{ padding:5px; background:#fff;}
.table_box table th{ color:#fff; background:#5b7ea8;}
	.table_box table td {
		box-shadow:1px 0px 3px #777;
	}
.table_box table tr:nth-child(even) td{ background:#f5f5f5;}
.table_box table tfoot tr td{ background:#dceff4; font-weight:bold;}
.table_box table .btn_main{ display:block;}
.table_box table .btn_main a{ width:60px; margin:0 auto; font-size:12px;}
.table_box table .btn_main span.a{ width:60px; margin:0 auto; font-size:12px;}
.table_box.tb_fixed_01 table th:nth-child(1), .table_box.tb_fixed_01 table td:nth-child(1){ position:sticky; top:0px; left:0; z-index:1;}
.table_box.tb_fixed_01 table th:nth-child(2), .table_box.tb_fixed_01 table td:nth-child(2){ position:sticky; top:0px; left:60px; z-index:1;}
.table_box.tb_fixed_01 table th:nth-child(3), .table_box.tb_fixed_01 table td:nth-child(3){ position:sticky; top:0px; left:120px; z-index:1;}
.table_box.tb_fixed_02 table th:nth-child(1), .table_box.tb_fixed_02 table td:nth-child(1){ position:sticky; top:0px; left:0; z-index:1;}
.table_box.tb_fixed_02 table th:nth-child(2), .table_box.tb_fixed_02 table td:nth-child(2){ position:sticky; top:0px; left:60px; z-index:1;}
.table_box.tb_fixed_03 table th:nth-child(1), .table_box.tb_fixed_03 table td:nth-child(1){ position:sticky; top:0px; left:0; z-index:1;}
.table_box.tb_fixed_03 table th:nth-child(2), .table_box.tb_fixed_03 table td:nth-child(2){ position:sticky; top:0px; left:110px; z-index:1;}
.table_box.tb_fixed_03 table th:nth-child(3), .table_box.tb_fixed_03 table td:nth-child(3){ position:sticky; top:0px; left:170px; z-index:1;}
.table_box.tb_fixed_01 table th:nth-child(1)  { z-index: 2; }
.table_box.tb_fixed_01 table th:nth-child(2) { z-index: 2; }
.table_box.tb_fixed_01 table th:nth-child(3){ z-index:2; }
.table_box.tb_fixed_02 table th:nth-child(1){ z-index: 2; }
.table_box.tb_fixed_02 table th:nth-child(2) { z-index: 2; }
	.table_box.tb_fixed_03 table th:nth-child(1){ z-index: 2; }
	.table_box.tb_fixed_03 table th:nth-child(2) { z-index:2; }
	.table_box.tb_fixed_03 table th:nth-child(3) { z-index: 2; }
	/*-----popup-----*/
	.pop_bg {
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.4);
		z-index: 10;
	} .pop_con{ position:fixed; left:0; right:0; top:50%; transform:translateY(-50%); width:800px; margin:0 auto; padding:30px 20px; background:#fff; border-radius:4px; z-index:11;} .pop_con h2{ margin:0 0 20px 0; font-size:18px;} .pop_con .btn_main a,.pop_con .btn_main span.a{ max-width:100px; height:30px; line-height:28px;}
	/*page_control*/
	.page_control{ margin:0 0 20px 0; text-align:center;} .page_control li{ display:inline-block; vertical-align:middle; margin:0 -4px 0 0; border:1px solid #cccccc; border-right:none;} .page_control li:last-child{ border-right:1px solid #cccccc;} .page_control li a{ display:block; width:30px; height:30px; line-height:30px; color:#898989; font-size:12px; font-family:Arial; background-repeat:no-repeat; background-position:center center; background-size:30px; box-sizing:border-box;} .page_control li a:hover{ color:#5b7ea8; background:#e5e5e5; background-size:30px;} .page_control li.active a{ color:#fff; background-color:#5b7ea8; background-size:30px;} .page_control li a.btn_prev_02{ background-image:url(../images/icon_prev_02_n.png);} .page_control li a.btn_next_02{ background-image:url(../images/icon_next_02_n.png);}
	/* Holding */
	.table_box { overflow: auto; max-height: 500px;} .table_box thead th { position: sticky; top: 0; z-index: 1; } table .left{ text-align:left; } table .center { text-align: center; } table .right { text-align: right; } /*::-webkit-scrollbar { width: 12px; }*/

.table_box::-webkit-scrollbar { width: 12px; }

	/* Track */
	.table_box::-webkit-scrollbar-track { /*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.8);*/ -webkit-border-radius: 10px; background-color: #ddd; border-radius: 0px; }
	/* Handle */
	.table_box::-webkit-scrollbar-thumb {-webkit-border-radius: 5px;border-radius: 5px; background: #444; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); } .Holding table th:nth-child(3) { border-right: 2px solid #448aca; box-shadow: 1px 0px 3px #777; } .Holding table td:nth-child(3) { border-right: 2px solid #448aca; box-shadow: 1px 0px 3px #777; } .Execution th:nth-child(3) { border-right: 2px solid #448aca; box-shadow: 1px 0px 3px #777; } .Execution td:nth-child(3) { border-right: 2px solid #448aca; box-shadow: 1px 0px 3px #777; } .searchDate { color:#5b7ea8;font-weight:900;margin-left:3px; } .hidden { display: none; } .href{ text-decoration:underline; color:blue; cursor:pointer; }
	/* ExecutionDetail */
	#ifr { height:480px; } .exeD_title { position: absolute; top: 0px; background-color: #FFF; border-bottom: 1px solid #AAA; width: 100%; background-color: #E8E8E8;box-sizing:border-box; } .exeD_title table{ width:100%; } .exeD_title table td { padding: 0px 5px; border:1px solid #FFF; } .exeD_title table tr td:nth-child(1) { width: 80px; background-color: #5B7EA8; color:#FFF; font-weight:bold; } .exeD_content { margin-top: 115px; height: 320px; overflow-y: auto; overflow-x:hidden; padding:3px; } .exeD_content::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); background-color: #ffc0cb; } .exeD_content::-webkit-scrollbar { width: 6px; background-color: black; } .exeD_content::-webkit-scrollbar-thumb { background-color: #5B7EA8; } .exeD_box { width: 96%; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; margin: 3px; border-radius: 5px; padding:5px; margin-bottom:10px; } .exeD_box table { border-collapse: collapse; border-top:0px; width:100%; } .exeD_box table td { padding: 0px 5px; border: 1px solid #AAA; } .exeD_box table tr:nth-child(1) td { border-top:0px; } .exeD_box table tr:nth-last-child(1) td { border-bottom: 0px; } .exeD_box table tr td:nth-child(1) { border-left: 0px; width:80px; font-weight:bold; } .exeD_box table tr td:nth-last-child(1) { border-right: 0px; }
.mobile{ display:none}
.ui-datepicker ui-widget.ui-widget-content.ui-helper-clearfix.ui-corner-all{z-index:3}
	/*mobile page*/
	@media screen and (max-width: 1024px) {
	/*Frame*/
	.pagesize { width: auto;padding:0 15px;box-sizing:border-box; }
	.Menu_frm{ display:inline; float:right; padding:5px; border:1px solid #BBB;border-radius:10px;}
	.Menu_frm img{ cursor:pointer; }
	
	/*選單*/
	header .nav_web{ display:none; position:fixed; background-color:#FFF;height:calc(100vh - 95px); top:0; right:0; margin:0;border-left:1px solid #CCC;padding:5px 5px; }
	header .nav_web .close_frm{ display:inline-block; }
	header .nav_web #close { position:absolute; right:15px;cursor:pointer; }

	header ul{ vertical-align:middle;padding:0px; margin-top:40px;}
	header ul li{ font-size:22px; border-bottom:1px solid #999; padding-top:15px; padding-bottom:15px; width:190px; }
	header ul li a:hover{ color:blue;}
	header .set_account{  width:100%; position:relative; }
	.btn_sign{ width:70px; height:40px; text-align:center; line-height:40px; color:#D23749; font-weight:bold; border:0px; font-size:22px;padding-left:20px;margin-top:10px;}
	.btn_sign:hover{ color:red; background:none;}
	.nav_web{ width:230px; }
	
	#Button1{display:none;}

	/* Login */
    .signin_con .sc_box { width: 350px; }

	#ifr {
		height: calc(100vh);
	}
} @media screen and (max-width: 320px) {
	/* Login */
	.signin_con .sc_box {
		width: 300px;
	}
} @media screen and (max-width: 400px) {
		.table_box {
			max-height: 500px;
		}

		#ifr {
			height: 490px;
			width:350px;
		}
	} @media screen and (max-width: 850px) {
		.table_box {
			max-height: 300px;
		}
		.mobile{ display:block}
	}