@font-face{
	font-family: "site-main-font";
	src: url(/fonts/gothic.ttf);
	unicode-range:U+00-024F;
}
@font-face{
	font-family: "site-main-font";
	font-weight: bold;
	src: url(/fonts/gothicb.ttf);
	unicode-range:U+00-024F;
}
@font-face{
	font-family: "site-main-font";
	font-weight: bold;
	font-style: italic;
	src: url(/fonts/GOTHICBI.TTF);
	unicode-range:U+00-024F;
}
@font-face{
	font-family: "site-main-font";
	font-style: italic;
	src: url(/fonts/GOTHICI.TTF);
	unicode-range:U+00-024F;
}
@font-face{
	font-family:"site-main-font";
	src:  local("Heiti TC"), local("微軟正黑體"), local("Microsoft JhengHei"),url(/fonts/MSJH.TTC);
	unicode-range: U+4E00-9FFF;
}
@font-face{
	font-family:"site-main-font";
	font-weight: bold;
	src:  local("Heiti TC Bold"), local("微軟正黑體 Bold"), local("Microsoft JhengHei UI Bold"),url(/fonts/MSJHBD.TTC);
	unicode-range: U+4E00-9FFF;
}

.navbar{
		min-height: auto;
	}
	

@media screen and (max-width:720px) {
	.navbar{
		min-height: auto;
	}
	#page_header h4{
		font-size: 1em !important;
	}
}
@media screen and (max-width:390px){
	#title_shift_r, .h03 { display: none;}
}

body,html{
	font-family:"site-main-font";
	margin: 0;
	padding: 0;
}
h1,h2,h3,h4,h5,h6{
	font-family:"site-main-font";
	font-weight: bold;
	margin: 0;
	padding: 0;
}
.page{
	max-width: 950px;
	margin-left: auto;
	margin-right: auto;	
}
#page_header{
	padding: 0.5em;
	margin-top: 0px;
	background-color: #23C130;
	color: #FFFFFF;
	-webkit-box-shadow: 0px 0px 1em 0 #000000;
	box-shadow: 0px 0px 1em 0 #000000;
	text-shadow: 0px 0px 0.3em #5F5F5F;
}
#page_content{
	padding: 5px;
	margin-top: 1em;
	margin-bottom: 1em;
}

#page_footer{
	position: fixed;
	z-index: 1;
	bottom: 0px;
	color: #FFFFFF;
	font-size: 0.7em;
	background: #777777;
	padding: 0.3em;
	margin-bottom: 0em;
	width: 100%;	
}

li{
	margin-bottom: 0.5em
}
mark{
	font-weight: bold;
	padding:0.2em 0em;
}
th,td,tr{
	/*vertical-align: middle !important;*/
}
#accept_btt {
	border-radius: 0.5em;
	border: 2px solid #FF8EC6;
	background-color: #FFD6F2;
	-webkit-box-shadow: 0px 0px 1em;
	box-shadow: 0px 0px 1em;
	padding: 0.7em;
	font-weight: bold;
	text-align: left;
}
#accept_btt:hover,#accept_btt:active{
	border: 2px solid #ADFF87;
	background-color: #B5FFD4;
}

#ccb {
	border-radius: 0.3em;
	background-color: #FF9596;
}

button{
	font-weight: bold !important;
	padding: 0.4em 1em !important;
	border-radius: 0.2em !important;
	background-color: #FFE459;
	border: 1px solid gray !important;
}
button:hover{
	background-color: #639AEF !important;	
}
.fa_color {
	border: 1px solid #275F93;
}

.fa_color .panel-heading {
	border: 1px solid #275F93;
	background: #275F93;
	color: #FFFFFF;
}

.ma_color {
	border: 1px solid #9528C5;
}

.ma_color .panel-heading {
	border: 1px solid #9528C5;
	background: #9528C5;
	color: #FFFFFF;
}

.other_color {
	border: 1px solid #376C00;
}

.other_color .panel-heading {
	border: 1px solid #376C00;
	background: #376C00;
	color: #FFFFFF;
}

.save_color {
	border: 1px solid #CD8600;
}

.save_color .panel-heading {
	border: 1px solid #CD8600;
	background: #CD8600;
	color: #FFFFFF;
}
.submit_color {
	border: 1px solid #377400;
}

.submit_color .panel-heading {
	border: 1px solid #377400;
	background: #377400;
	color: #FFFFFF;
}
input:focus, textarea:focus{
	background: #FFD671;	
}

::placeholder {
  color:#003E93;
}

.gnote_color {
	border: 1px solid #740032;
}

.gnote_color .panel-heading {
	border: 1px solid #740032;
	background: #740032;
	color: #FFFFFF;
}
.statement_color {
	border: 1px solid #0043AB;
}

.statement_color .panel-heading {
	border: 1px solid #0043AB;
	background: #0043AB;
	color: #FFFFFF;
}
/*
input:valid,select:valid{
	border: thin solid #009A37;
}
*/
.error_input{
	background: #FFAFB1;
}
.new_app_color {
	border: 1px solid #007104;
}

.new_app_color .panel-heading {
	border: 1px solid #007104;
	background: #007104;
	color: #FFFFFF;
}

.old_app_color {
	border: 1px solid #8000AB;
}

.old_app_color .panel-heading {
	border: 1px solid #8000AB;
	background: #8000AB;
	color: #FFFFFF;
}



#last_nav li{
	float: left;
	width: 33.33%;
	box-sizing: border-box;
	list-style: inside;
	list-style-type: none;
	margin: 0em;
	padding-inline-start:0em;	
}
#last_nav ol{
	padding-inline-start:0em;	
}
#session_part {
    border-radius: 0.5em;
    padding: 0.6em;
    border: thin solid #707070;
    margin-bottom: 0.5em;
}

.finish{
    background-color: #9ED993;
}
.non-finish{
    background-color: #F4B8B8;
}
.last-finish{
    background-color: #FBFF88;
}
#session_bbt button {
	width: 7em;
	padding: 0.2em !important;
	margin: 0 !important;
}

#session_text{    
    float: left;
	font-size: 1.2em;
	font-weight: bold;
}

#session_bbt {
    float: right;
}

.container-fluid {
    padding-right: 0px  !important;
    padding-left: 0px !important;
}

.h01{
	display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
}
.h02{    display: flex
;
    flex-direction: row;
    align-content: center;
    justify-content: flex-start;
    gap: 3px;}
.h02 div{    display: flex
;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    gap: 2px;}
.h03{display: flex
;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    gap: 2px;}
#title_shift_r{
	text-align: right;
}
.language-div{
	display: flex
;
    flex-direction: row;
    align-content: flex-start;
    justify-content: flex-start;
    gap: 0.55em 1.5em;
    padding-left: 2em;
	flex-wrap: wrap;
}
.language-cb{display: flex
;
    flex-direction: row;
    align-content: center;
    align-items: stretch;
    justify-content: flex-start;
    flex-wrap: nowrap;
	gap:5px}