body{ 
	font-family: "Arial Black", "Arial Bold";
}
table#ShowTable tr td:first-child,table#ShowTable tr th:first-child {padding-left:1rem;}

/* 大螢幕 */
@Media (min-width: 980px) 
{ 
	table#ShowTable  td,th{ font-size: 2rem;height: 4.4rem; padding:3px;white-space: nowrap;border-left-style: solid;border-left-color: #000000;border-width:1px;}
	table#ShowTable1 td,th{ font-size: 2rem;height: 4.4rem; padding:3px;white-space: nowrap;border-left-style: solid;border-left-color: #000000;border-width:1px;}
	table#ShowTable2 td,th{ font-size: 2rem;height: 4.4rem; padding:3px;white-space: nowrap;border-left-style: solid;border-left-color: #000000;border-width:1px;}    
    thead th {height: 2.2rem !important; }
    .head_ttp {text-align:right;color:#80FFFF;background-color:#555555;}
    #ShowTable,#ShowTable1,#ShowTable2 {min-width: 1100px !important;}
}
 
/* 平板電腦、橫向手機和一般桌機解析度 */
@Media (min-width: 768px) and (max-width: 979px) 
{
	table#ShowTable  td,th{ font-size: 2rem;height: 4.4rem; padding:3px;white-space: nowrap;border-left-style: solid;border-left-color: #000000;border-width:1px;}
	table#ShowTable1 td,th{ font-size: 2rem;height: 4.4rem; padding:3px;white-space: nowrap;border-left-style: solid;border-left-color: #000000;border-width:1px;}
	table#ShowTable2 td,th{ font-size: 2rem;height: 4.4rem; padding:3px;white-space: nowrap;border-left-style: solid;border-left-color: #000000;border-width:1px;}    
    thead th {height: 2.2rem !important; }
    .head_ttp {text-align:center;color:#80FFFF;background-color:#555555;}
    table#ShowTable tr td:last-child, table#ShowTable1 tr td:last-child, table#ShowTable2 tr td:last-child { padding-right: 12px !important; }  
    #ShowTable,#ShowTable1,#ShowTable2 {min-width: 1100px !important;}
}
/* 橫向智慧手機及其他更小解析度 */
@Media (min-width: 361px) and (max-width: 767px) 
{
	table#ShowTable  td,th {font-size: 2.4rem; height: 3.3rem; padding-left:2px; padding-right:2px;	white-space: nowrap;border-left-style: solid;border-left-color: #000000;border-width:1px;}
	table#ShowTable1 td,th {font-size: 2.4rem; height: 3.3rem; padding-left:2px; padding-right:2px;	white-space: nowrap;border-left-style: solid;border-left-color: #000000;border-width:1px;}
	table#ShowTable2 td,th {font-size: 2.2rem; height: 3.3rem; padding-left:2px; padding-right:2px; white-space: nowrap;border-left-style: solid;border-left-color: #000000;border-width:1px;}
	.sno_link_smaller {	font-size:1.9rem;	padding-top: 1px !important; padding-bottom: 1px !important; }
	.sno_link_small   { font-size:1.5rem;	padding-top: 1px !important; padding-bottom: 1px !important; }
	.sno_link_small2  { font-size:1.2rem;	padding-top: 1px !important; padding-bottom: 1px !important; } /*沒用到*/
    .head_ttp {text-align:center;color:#80FFFF;background-color:#555555;}
    table#ShowTable tr td:last-child, table#ShowTable1 tr td:last-child, table#ShowTable2 tr td:last-child { padding-right: 12px !important; } 
    #annModal .modal-footer {width:100%;flex-direction: column;}
    #alert_message {letter-spacing: 0px;}
}
@Media (max-width: 360px) 
{
	table#ShowTable  td,th {font-size: 2.2rem; height: 3.3rem; padding-left:1px; padding-right:1px;	white-space: nowrap;border-left-style: solid;border-left-color: #000000;border-width:1px;}
	table#ShowTable1 td,th {font-size: 2.2rem; height: 3.3rem; padding-left:1px; padding-right:1px;	white-space: nowrap;border-left-style: solid;border-left-color: #000000;border-width:1px;}
	table#ShowTable2 td,th {font-size: 2rem; height: 3.3rem; padding-left:1px; padding-right:1px; white-space: nowrap;border-left-style: solid;border-left-color: #000000;border-width:1px;}
	.sno_link_smaller {	font-size:1.7rem;	padding-top: 1px !important; padding-bottom: 1px !important; }
	.sno_link_small   { font-size:1.5rem;	padding-top: 1px !important; padding-bottom: 1px !important; }
	.sno_link_small2  { font-size:1.2rem;	padding-top: 1px !important; padding-bottom: 1px !important; } /*沒用到*/
    .head_ttp {text-align:center;color:#80FFFF;background-color:#555555;}
    table#ShowTable tr td:last-child, table#ShowTable1 tr td:last-child, table#ShowTable2 tr td:last-child { padding-right: 12px !important; } 
    #annModal .modal-footer {width:100%;flex-direction: column;}
    table#ShowTable tr td:first-child {padding-left:0.5rem;}
}

.main{	height:100%; padding:8px; background-color:black; color:white;}
#footer , main{ font-size: 2.6rem; }
/*****************************************************/
.r_eq {text-align:right;color:#000000;}
.r_up {text-align:right;color:#FF0000;}
.r_dn {text-align:right;color:#00bb00;}

.et {text-align:center;color:#FFFFFF;background-color:#555555;}
.en {text-align:left;color:#FFFFFF;}
.eq {text-align:right;color:#FFFFFF;}
.dn {text-align:right;color:#22FF22;}
.us {text-align:right;color:#FFFFFF;background-color:#930000;border-bottom: 1px solid #000;}
.ds {text-align:right;color:#FFFFFF;background-color:#019858;border-bottom: 1px solid #000;}
.up {text-align:right;color:#FF0000;}
.t3 {text-align:right;color:#00FFFF;}
.y3 {text-align:right;color:#EEEE00;}
.t1 {text-align:left;color:#00FFFF;}
.t2 {color:#00FFFF;}
.y1 {text-align:left;color:#EEEE00;}
.y2 {color:#EEEE00;}
.eq_color {color:#FFFFFF;}
.dn_color {color:#22FF22;}
.up_color {color:#FF0000;}

.us_color {color:#FFFFFF;background-color:#930000;}
.ds_color {color:#FFFFFF;background-color:#019858;}

.ttp_color{color:#80FFFF;}
.warn     {color:#FF0000;font-size:1.4rem;border:  1px solid #FF0000; width:20px;height:20px;border-radius:2px;margin-left:5px;padding:1px;}
.warn2    {color:#EEEE00;font-size:1.6rem;}
.warn3    {color:#FF0000;font-size:1.6rem;}
.no {text-align:right;color:#8E8E8E;} /*無值--*/
.no_left {text-align:left;color:#8E8E8E;} /*無值--*/

.left  {text-align:left !important}
.right {text-align:right !important;padding-right:20px !important;}
.center {text-align:center !important}
.right2 {text-align:right !important;}

.sno_link {color:#FFFFFF; font-family: "新細明體";}
.sno_link:active {COLOR: #FFFFFF;}
.sno_link:hover  {COLOR: red;}

.stock_cname { padding-left: 5px; }
.last { padding-left: 5px; }
.display_cmp {display:inline-block;width:100%;height:100%;}

.guest{ display: inline-block; font-size:1.6rem !important; height: auto; line-height:30px; width: 4.4rem; vertical-align: middle;  background: #FF0000;  color:#FFFFFF;font-weight:600;border-radius:2px;cursor:pointer;border-width:1px; border-style:solid;border-color:yellow;}
.guest_disable { display: inline-block; font-size:1.6rem !important; height: auto; line-height:30px; width: 4.4rem; vertical-align: middle;  background: #4F4F4F;  color:#FFFFFF;font-weight:600;border-radius:2px;cursor:not-allowed;border-width:1px; border-style:solid;border-color:yellow;}

/***********************
	閃爍背景色
************************/
.up_bgcolor { background-color:#930000; }
.dn_bgcolor { background-color:#019858; }
/***********************
	漲跌背景色
************************/
.cmp{ text-align:right; padding-right: 3px;}
.up_cmp { border:2px #930000 solid;border-radius:6px;background-color:#930000;color:#FFFFFF;width: 90%; display: inline-block;padding-right:10px;padding-left:5px;	margin-left : 1px !important;	margin-right: 1px !important;}
.dn_cmp { border:2px #019858 solid;border-radius:6px;background-color:#019858;color:#FFFFFF;width: 90%;	display: inline-block;padding-right:10px;padding-left:5px;	margin-left : 1px !important;	margin-right: 1px !important;}
.eq_cmp {text-align:right;color:#FFFFFF;}
.opt_up_cmp {border:1px #930000 solid;border-radius:3px;background-color:#930000;color:#FFFFFF;width: 90%;display: inline-block;margin:1px !important;text-align: right;}
.opt_dn_cmp {border:1px #019858 solid;border-radius:3px;background-color:#019858;color:#FFFFFF;width: 90%;display: inline-block;margin:1px !important;text-align: right;}
.opt_eq_cmp {color:#FFFFFF;display: inline-block;width: 90%;margin:1px !important;text-align: right;}
.arrow_up{ margin-left: 10px; width: 0; height: 0; border-width: 10px; border-style: solid; border-color: transparent #FF0000 transparent transparent; transform: rotate(90deg); /*顺时针旋转90°*/}
.arrow_down{ margin-left:10px; float: left; width: 0; height: 0; border-width: 10px; border-style: solid; border-color:#22FF22 transparent transparent transparent;}
/*******************************/
/* 日期顯示 */
.dateline {	height: 20px !important;font-size: 1.4rem !important;border-bottom: 1px solid #222222 !important;color: #999999;padding-left: 5px;}
/*quotes*/
.dateline2 {height: 20px !important;font-size: 1.4rem !important;color: #999999;}
.dt_dateline {border-bottom: 1px solid #222222 !important; color: #999999; padding-left: 5px; }
.dt_exchange {font-size: 1.4rem !important; padding-left: 5px; }
/* 小數點顯示 */
.dot_style{	font-size: smaller;	text-decoration:underline; }
/* 漲跌幅%小數點顯示 */
.dot_style2{ font-size: smaller; }
/* 秒數顯示 */
.second_style{ font-size: larger; }

/* 數字欄顯示 */
.td_style { font-weight: 500; }
.dt_td_style   { font-weight: 500; padding-left: 5px; padding-right: 5px; text-align:right }
.dt_last_style { font-weight: 500; padding-right: 5px !important; text-align:right }
.dt_time_style { font-weight: 500; padding-left: 5px; padding-right: 10px; }
.fa {display:inline; }

/*******************************/
/* 選擇權 */

.opt_call {	background-color: #930000 !important;color: #FFFFFF;text-align: center;font-size: 1.8rem;height: 2rem !important;}
.opt_put {	background-color: #009100 !important;color: #FFFFFF;text-align: center;font-size: 1.8rem;height: 2rem !important;}
.quote_list{/*	height:3.8rem;*/}

/*******************************/
/*每行區隔線*/
.tr_underline {border-bottom: 1px solid #222222;}
/*PC版報價更新底線*/
.underline {border-bottom:#AAA 1px solid;}
/*******************************/
.list_quote {height: 5rem;}
.dt_list_quote {height: 4rem;}
.byside {
    /*
    font-size:18px;
    padding-top:0px !important;
    padding-bottom:0px !important;
    vertical-align :top;
	line-height: 1;
    */
}
.more {font-size: 1.6rem;position: fixed;bottom: 45px;right: 20px;opacity:0.7; color: #000;}
.tr_end { padding-right: 5px; }

/*************************
  可交易狀態
**************************/
.trade_status {
    border:1px #0072e3 solid;border-radius:2px;
    background-color: #0072e3;
    color: #FFFFFF;
    width: 26px;
    height: 24px;
    display: inline-block;
    padding: 0px;
    margin: 0px;
    font-size: 1.8rem;
    vertical-align: middle;    
}
/***********************
	table fixed
************************/

.grid_8 {
	display: inline;
	float: left;
	/*margin-left: 10px;*/
	/*margin-right: 10px;*/ /*加上margin後, height250的width會計算錯誤*/
}
.height250 {
    /*height: 250px;*/
	width: 100%;
	min-width:300px;
    height: 76vh;
    overflow-x: auto;
    overflow-y: auto;
}
.height350 { /*平板或桌機*/
	/*width: 90%;*/
	/*width: 100%;    */
	min-width:600px;
    /*max-width:1000px;*/
    height: 85vh;
    overflow-x: auto;
    overflow-y: auto;
}
/*選擇權*/
.height850 { /*mobile*/
	width: 100%;min-width:300px;height: 82vh;overflow-x: auto;overflow-y: auto;}
.height950 { /*平板或桌機*/
	width: 100%;min-width:300px;height: 82vh;overflow-x: auto;overflow-y: auto;}
.height250_iframe {
	width: 100%;
	min-width:300px;
    height: 100vh;
    overflow-x: auto;
    overflow-y: auto;
}
.grid_8_iframe {
	display: inline;
	float: left;
	margin-left: 0px;
	margin-right: 0px;
}
/* indexcate */
.height250_swiper {
	width: 100%;
	min-width:300px;
    height: 75vh;
    overflow-x: auto;
    overflow-y: auto;
}
.height350_swiper { /*平板或桌機*/
	/*width: 100%;*/
	min-width:500px;
    height: 73vh;
    overflow-x: auto;
    overflow-y: auto;
}
/***********************
	alert
************************/
   
#alert_message {
    z-index: 9;    
    display: none;
    font-size: 1.6rem;
    font-weight: normal;
    width: 100%;
    height:30px;
    text-align: center;
    vertical-align: center;
    left: 0;
    top: 6%;    
    position: fixed;    /*relative;fixed*/
    padding: 0rem 1.25rem;
    /*
    padding-top: 0rem;
    padding-right: 1.25rem;
    padding-bottom: 0rem;
    padding-left: 1.25rem;
    */
    margin-bottom: 0rem;
    border: 1px solid transparent;
    border-radius: 0.25rem;
    /*color: #856404;*/
    color: #AA0000;
    background-color: #fff3cd;
    border-color: #ffeeba;
    letter-spacing: 1px;    
}
/*.waitConnect {color:#AA0000 !important;width:100px !important;}*/
.greenConnect{color:#00A600 !important;}
/*
#loading_dots {
  animation: dots 1.5s steps(5, end) infinite;
}
*/
    #loading_dots {
        animation: dots 1.5s steps(5, end) infinite;
        width:100px;
        font-size: 22px;
        font-weight: bold;
        text-align:left;
        display: inline-block;        
    }
/*
@keyframes dots {
  0% {
    content: '.';
  }
  25% {
    content: '..';
  }
  50% {
    content: '...';
  }
  75% {
    content: '..';
  }
  100% {
    content: '.';
  }
}
*/
/***********************
	自選
************************/
#personal_reserved , #personal_delete , #personal_disabled , #personal_add {
    font-size: 2.6rem;
    font-weight: 600;
}

/***********************
	自選
************************/
#fx_list a {
    color:#FFFFFF;
}
/***********************
	分鐘
************************/
.list_detail {
    font-size: 2.4rem !important;
    padding-left:2px;
    padding-right:10px;
    padding-top:2px;
    padding-bottom:2px;
    /*font-weight: 600px;*/
}
.list_detail9 {
    font-size: 2rem !important;
    padding-left:2px;
    padding-right:10px;
    padding-top:2px;
    padding-bottom:2px;
    /*font-weight: 600px;*/
}
.head_detail9 {
    font-size: 2rem !important;
    padding-left:2px;
    padding-right:10px;
    /*padding-top:2px;
    padding-bottom:2px;*/
}
#search_time{
	/*display:flex;*/
	flex-wrap:nowrap;
	justify-content: space-around;
	width:100%;
    height: 50px;
	z-index: 500;
	position: fixed;
	bottom:50px;
	background-color: #adadad;
    padding-top: 10px;
    vertical-align:center !important;
    text-align: center;
}
#search_time span,button{
    font-size: 2.2rem;
    font-weight: 600;
}

#header_quote{
	width:90%;
	font-size:2.6rem;
    text-align: center;
}

#head_title, #head_last, #head_cmp {
    /*width:30%;
		border:1px #930000 solid;*/

}
/*****************************************************/
/*加入自選*/
#head_menu {
    cursor: pointer;
}
#setstock2 {
    display:none; 
    top:20%;left:5%;
    position: absolute;
    z-index:10;
    background-color:#EEEEEE;
    padding:5px;
    text-align:center;
    width:90%;
    max-width:300px;
    font-size: 2.2rem;
    font-weight: 600;
}
.setstock_focus {background-color: #464646 !important;}
.ss2_title { background-color: #fff0ac; }
.ss2_body { font-size:1.8rem !important; }
.click_focus { background-color: #004B97; }
.focus { background-color: #FFFFAA; }

/*自選search*/
.ui-autocomplete {
    max-height: 300px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    z-index: 111111;
}
/* IE 6 doesn't support max-height
 * we use height instead, but this forces the menu to always be this tall
 */
* html .ui-autocomplete {
    height: 300px;
}
.ui-menu-item {
    font-size: 1.6rem;
}


input[type=radio] {
  -ms-transform: scale(1.5); /* IE */
  -moz-transform: scale(1.5); /* FireFox */
  -webkit-transform: scale(1.5); /* Safari and Chrome */
  -o-transform: scale(1.5); /* Opera */
}

#loading {
    height: 100%;
    /*100%覆蓋網頁內容, 避免user在loading時進行其他操作*/    
    width: 100%;
    position: fixed;
    z-index: 1000;
    /*須大於網頁內容*/    
    top: 0;
    left: 0;
    display: block;
    /*background: #000; opacity: 0.7; */
    background: rgba(70, 70, 70, 0.75);
    text-align: center;
    display:none;    
}
.loading-img {
    width: 250px;
    min-height: 22px;
    text-align: center;
    background: #EEE;
    box-shadow: 0 1px 2px rgb(0 0 0 / 27%);
    border-radius: 7px;
    padding: 10px 15px;
    font-size: 14px;
    color: #464646;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -140px;
    margin-top: -30px;
    word-break: break-all;
}

#hisModal {font-size:26px;overflow:auto;}
#hisModal .modal-content{background-color:#E3F2D9;font-size:26px;}
#hisModal .modal-title {font-size:26px;}
#hisModal .modal-body .time{background-color:#C7E4B3;font-size:20px;font-weight:600;}
#hisModal .modal-body .title{background-color:#ABD78D;}
#hisModal .modal-body pre,.modal-body .content{background-color:#3A5E21;color:#FFFFFF;padding-bottom: 10px;padding-left:10px;}
#hisModal .modal-body p {margin:0;padding:5px 10px;}
#hisModal .modal-footer .action  {width:100%;}
#hisModal .modal-footer .action1 {width:100%;margin:0;padding:5px 10px;background-color:#3A5E21;color:#FFFFFF;text-align:left;}
#hisModal .modal-footer .action2 {width:100%;margin:0;padding:5px 10px;background-color:#C00000;color:#FFFFFF;text-align:left;}
#hisModal button {font-size:26px;}

#annModal {font-size:26px;overflow:auto;}
#annModal .modal-content{background-color:#E3F2D9;font-size:26px;}
#annModal .modal-title {font-size:26px;}
#annModal .modal-body .time{background-color:#C7E4B3;font-size:20px;font-weight:600;}
#annModal .modal-body .title{background-color:#ABD78D;}
#annModal .modal-body pre,.modal-body .content{background-color:#3A5E21;color:#FFFFFF;padding-bottom: 10px;padding-left:10px;}
#annModal .modal-body p {margin:0;padding:5px 10px;}
#annModal .modal-footer {width:100%;}
#annModal .modal-footer .action  {width:100%;}
#annModal .modal-footer .action1 {width:100%;margin:0;padding:5px 10px;background-color:#3A5E21;color:#FFFFFF;text-align:left;}
#annModal .modal-footer .action2 {width:100%;margin:0;padding:5px 10px;background-color:#C00000;color:#FFFFFF;text-align:left;}
#annModal button {font-size:18px;}