/* ====== 可辨識 - 焦點樣式  ====== */
/* 移除預設焦點樣式 */ :focus {
		outline: none;
}
/* 基本互動元素焦點樣式 */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
		outline: 0.125rem solid #0066cc !important;
		outline-offset: 0.125rem !important;
}
/* 字體大小按鈕焦點樣式 */
.font-btn:focus-visible {
		outline: 0.125rem solid #0066cc !important;
		outline-offset: 0 !important;
		box-shadow: 0 0 0.1875rem #0066cc;
}
/* 導航連結和品牌標誌焦點樣式 */
.nav-link:focus-visible, .navbar-brand:focus-visible {
		outline-offset: 0 !important;
		background-color: rgba(0, 102, 204, 0.1);
		outline: 0.0625rem solid #0066cc !important;
}
/* Skip link 基本樣式 */
.skip-link {
		position: absolute;
		padding: 8px;
		background-color: #264FB5;
		color: #fff;
		z-index: 9999;
		/* 預設隱藏 */
		transform: translateY(-100%);
		transition: transform 0.3s;
}
/* Skip link 焦點樣式 */
.skip-link:focus-visible {
		position: static;
		transform: translateY(0);
}
/* Logo 列表項目焦點樣式 */
#links .logos-list a:focus-visible .logo-block {
		outline: 0.0625rem solid #23503f !important;
		outline-offset: 0 !important;
}
/* 支援減少動態效果的使用者 */
@media (prefers-reduced-motion: reduce) {
		.skip-link {
				transition: none;
		}
}
/* 高對比度模式支援 */
@media (prefers-contrast: more) {
		:focus-visible {
				outline-width: 0.25rem !important;
				outline-color: #264FB5 !important;
		}
		.nav-link:focus-visible, .navbar-brand:focus-visible {
				background-color: #264FB5;
				color: #ffffff;
		}
}
nav[aria-label="breadcrumb"] {
		position: relative;
		z-index: 2;
}
/* ====== Modal  ====== */
.btn-close:focus {
		outline: none;
		-webkit-box-shadow: none;
		box-shadow: none;
}
#contact_us .modal-content {
		color: #1d2a4a;
		background-color: #f7f7fa;
		border-top: 0.0625rem solid #b7b7b7; /* 1px */
		border-bottom: 0.0625rem solid #b7b7b7; /* 1px */
		background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 1)), to(rgba(233, 241, 254, 1)));
		background: -o-linear-gradient(top, rgba(255, 255, 255, 1)0%, rgba(233, 241, 254, 1)100%);
		background: linear-gradient(to bottom, rgba(255, 255, 255, 1)0%, rgba(233, 241, 254, 1)100%);
		padding: 1rem;
		border-radius: 1rem;
		border: 0;
}
#contact_us .modal-content .title {
		font-size: 2rem;
}
#contact_us .modal-content .text {
		font-weight: normal;
		font-size: 1.25rem;
		letter-spacing: 0.125rem; /* 2px */
}
/* ====== Form ====== */
label, .col-form-label, .form-label {
		font-weight: bold;
		font-size: 1.125rem; /* 18px */
}
.form-check-label {
		font-weight: normal;
}
.form-check-input {
		width: 1.25em;
		height: 1.25em;
		margin-right: 0.5em;
}
.is_required::after {
		content: '*';
		font-size: 1.5em;
		line-height: 1;
		position: relative;
		color: #FF0004;
		font-weight: normal;
}
.form-control.is-valid, .was-validated .form-control:valid, .form-check-input.is-invalid, .was-validated .form-check-input:invalid, .form-check-input.is-valid, .was-validated .form-check-input:valid, .form-select.is-valid, .was-validated .form-select:valid, .form-select.is-invalid, .was-validated .form-select:invalid {
		border-width: 0.125rem; /* 2px */
}
.input-group-text.bg-white, .form-select, .form-control, .form-check-input {
		border-color: #5b5b5b;
}
.remark-text {
		font-size: 0.8125rem; /* 13px */
}
.w-ch {
		min-width: 4.375rem; /* 70px */
		font-weight: bold;
}
a.no_underline {
		text-decoration: none;
}
a.no_underline:hover {
		text-decoration: underline;
}
.sentbtn {
		min-width: 9.375rem; /* 150px */
}
.sentbtn_done:hover, .sentbtn:hover, .sentbtn_done:focus, .sentbtn:focus {
		background-color: #55977e;
		color: #fff;
}
.fancybox-close-small {
		position: absolute;
		width: 3.125rem; /* 50px */
		height: 3.125rem; /* 50px */
}
.fancybox-close-small:after, .fancybox-close-small, .fancybox-close-small:focus {
		outline: none !important;
		-webkit-box-shadow: none !important;
		box-shadow: none !important;
		border: 0 !important;
}
.fancybox-close-small:after {
		content: "×";
		font-family: 'Noto Sans TC', sans-serif;
		position: absolute;
		top: 0.3125rem; /* 5px */
		right: 0.3125rem; /* 5px */
		width: 3.125rem; /* 50px */
		height: 3.125rem; /* 50px */
		line-height: 3.125rem; /* 50px */
		font-size: 2.5em;
		color: #888;
		font-weight: 300;
		text-align: center;
		border-radius: 100%;
		border: 0 !important;
		background-color: transparent;
		-webkit-transition: background-color .25s;
		-o-transition: background-color .25s;
		transition: background-color .25s;
}
input[type="checkbox"] {
		width: 1.25em;
		height: 1.25em;
}
.form-controll, .form-check-label {
		font-size: 1.125em;
		padding-left: 0.25rem;
}
.under-msg {
		margin: auto;
		position: fixed !important;
		text-align: center;
		bottom: 1rem;
		right: 1rem;
		left: auto;
		width: auto;
		background-color: rgba(0, 0, 0, .75);
		color: #ffffff;
		padding: 1rem;
		min-width: 18.75rem; /* 300px */
		max-width: 18.75rem; /* 300px */
		border: 0;
}
.under-msg.alert-success {
		background-color: rgba(9, 106, 70, .9);
}
.under-msg.alert-danger, .under-msg.alert-warning {
		background-color: rgba(220, 0, 0, .65);
}
.under-msg i {
		margin-right: 0.5rem;
}
.has-line {
		position: relative;
}
.has-line::after {
		content: '';
		position: absolute;
		bottom: 0;
		right: 1rem;
		width: calc(100% - 2rem);
		height: 0.0625rem; /* 1px */
		display: block;
		background-color: #fcdcfc;
}
.has-line .invalid-feedback {
		background-color: #dc3545;
		width: 0.9375rem; /* 15px */
		height: 0.9375rem; /* 15px */
		border-radius: 100%;
		left: -0.5rem; /* -8px */
		top: -0.5rem; /* -8px */
		position: absolute;
}
.btn-mode {
		position: relative;
		overflow: visible;
		min-width: 7.5rem; /* 120px */
		padding-left: 0.125rem !important;
		padding-right: 0.125rem !important;
		z-index: 2;
}
.btn-mode > input {
		position: absolute;
		font-size: 1rem;
		font-weight: bold;
		min-width: 7.5rem; /* 120px */
		padding-left: 0.125rem !important;
		padding-right: 0.125rem !important;
		opacity: 0;
		right: 0;
		top: 0;
}
.btn-primary {
		color: #320051;
		background-color: #fcdcfc;
		border-color: #fcdcfc;
}
.reg-board .form-control {
		padding: 0.75rem;
}
.custom-file-label {
		position: absolute;
		top: 0;
		width: calc(100% - 7.8125rem); /* 125px */
		height: 100%;
		right: 0;
		font-size: 1rem;
		padding-left: 1rem;
		overflow: hidden;
		background-color: transparent;
		border: 0;
		color: #fcdcfc;
}
.body-overlay.active {
		z-index: 1020;
		-webkit-transition: opacity .3s ease, width 0s;
		-o-transition: opacity .3s ease, width 0s;
		transition: opacity .3s ease, width 0s;
		opacity: 1;
		width: 100%;
		visibility: visible;
}
.body-overlay {
		opacity: 0;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0);
		z-index: -1;
		pointer-events: none;
		-webkit-backface-visibility: hidden;
		-webkit-transition: opacity 0.3s ease;
		-o-transition: opacity 0.3s ease;
		transition: opacity 0.3s ease;
}
.loading-overlay {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		background-color: rgba(0, 0, 0, 0);
}
.loading-overlay.active {
		z-index: 1021;
		-webkit-transition: opacity .3s ease, width 0s;
		-o-transition: opacity .3s ease, width 0s;
		transition: opacity .3s ease, width 0s;
		opacity: 1;
		width: 100%;
		visibility: visible;
}
.loading-overlay.stop {
		opacity: 0;
		z-index: -1;
		pointer-events: none;
		-webkit-backface-visibility: hidden;
		-webkit-transition: opacity 0.3s ease;
		-o-transition: opacity 0.3s ease;
		transition: opacity 0.3s ease;
}
.loading-overlay.stop .css3-spinner > div {
		-webkit-animation: none !important;
		animation: none !important;
}
.form-control.is-invalid, .was-validated .form-control:invalid {
		border-width: 0.125rem; /* 2px */
}
#dialog-content .modal-header .btn-close, #dialog-content .modal-header .btn-close:focus {
		border: 0;
		outline: none;
		-webkit-box-shadow: none;
		box-shadow: none;
}
#dialog-content {
		margin: auto;
}
#dialog-content .modal-header {
		border: 0;
}
#dialog-content .modal-body h3 {
		text-align: center;
		line-height: 1.5;
}
#dialog-content .modal-body h5 {
		line-height: 1.75;
}
@media (max-width: 61.9375rem) { /* 991px */
		.form-check .form-check-input {
				position: relative;
				top: 0.0625rem; /* 1px */
		}
		.remark-text {
				font-size: 1rem;
		}
}
@media (min-width: 48rem) { /* 768px */
		.reg-board {
				max-width: 30rem; /* 480px */
				margin: auto;
				margin-top: 10rem;
		}
}
@media (max-width: 25rem) { /* 400px */
		.col-xs-12 {
				max-width: 100%;
				width: 100%;
		}
}
.css3-spinner {
		color: #0b5ed7;
		position: relative;
		z-index: auto;
		background-color: transparent;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.contactpage .css3-spinner {
		color: #0b5ed7;
}
.contactpage .css3-spinner > div {
		background-color: #0b5ed7;
}
.css3-spinner > div {
		width: auto;
		height: 0.9375rem; /* 15px */
		gutters: 0;
		radius: 100%;
		margin: 0 0.3125rem; /* 5px */
		background-color: #0b5ed7;
		border-radius: 100%;
		display: inline-block;
		-webkit-animation: bouncedelay 1.4s infinite ease-in-out;
		animation: bouncedelay 1.4s infinite ease-in-out;
		-webkit-animation-fill-mode: both;
		animation-fill-mode: both;
}
.css3-spinner > div > div {
		width: 0.9375rem; /* 15px */
		height: 0.9375rem; /* 15px */
		margin: 0 0.3125rem; /* 5px */
		border-radius: 100%;
}
.css3-spinner .css3-spinner-bounce1, .css3-spinner .css3-spinner-bounce2, .css3-spinner .css3-spinner-bounce3 {
		width: 0.9375rem; /* 15px */
		gutters: 0.1875rem; /* 3px */
}
.css3-spinner .css3-spinner-bounce1 {
		-webkit-animation-delay: -0.32s;
		animation-delay: -0.32s;
}
.css3-spinner .css3-spinner-bounce2 {
		-webkit-animation-delay: -0.16s;
		animation-delay: -0.16s;
}
@-webkit-keyframes bouncedelay {
		0%, 80%, 100% {
				-webkit-transform: scale(0);
				transform: scale(0);
		}
		40% {
				-webkit-transform: scale(1);
				transform: scale(1);
		}
}
@keyframes bouncedelay {
		0%, 80%, 100% {
				-webkit-transform: scale(0);
				transform: scale(0);
		}
		40% {
				-webkit-transform: scale(1);
				transform: scale(1);
		}
}
.css3-spinner > .css3-spinner-flipper {
		width: 2rem; /* 32px */
		radius: 0;
		-webkit-animation: rotateplane 1.2s infinite ease-in-out;
		animation: rotateplane 1.2s infinite ease-in-out;
}
@-webkit-keyframes rotateplane {
		0% {
				-webkit-transform: perspective(7.5rem) rotateX(0deg) rotateY(0deg);
				transform: perspective(7.5rem) rotateX(0deg) rotateY(0deg); /* 120px */
		}
		50% {
				-webkit-transform: perspective(7.5rem) rotateX(-180.1deg) rotateY(0deg);
				transform: perspective(7.5rem) rotateX(-180.1deg) rotateY(0deg); /* 120px */
		}
		100% {
				-webkit-transform: perspective(7.5rem) rotateX(-180deg) rotateY(-179.9deg);
				transform: perspective(7.5rem) rotateX(-180deg) rotateY(-179.9deg); /* 120px */
		}
}
@keyframes rotateplane {
		0% {
				-webkit-transform: perspective(7.5rem) rotateX(0deg) rotateY(0deg);
				transform: perspective(7.5rem) rotateX(0deg) rotateY(0deg); /* 120px */
		}
		50% {
				-webkit-transform: perspective(7.5rem) rotateX(-180.1deg) rotateY(0deg);
				transform: perspective(7.5rem) rotateX(-180.1deg) rotateY(0deg); /* 120px */
		}
		100% {
				-webkit-transform: perspective(7.5rem) rotateX(-180deg) rotateY(-179.9deg);
				transform: perspective(7.5rem) rotateX(-180deg) rotateY(-179.9deg); /* 120px */
		}
}
.css3-spinner > .css3-spinner-double-bounce1, .css3-spinner > .css3-spinner-double-bounce2 {
		width: 2.5rem; /* 40px */
		radius: 50%;
		position: absolute;
		opacity: 0.6;
		-webkit-animation: cssspinnerbounce 2.0s infinite ease-in-out;
		animation: cssspinnerbounce 2.0s infinite ease-in-out;
}
.css3-spinner > .css3-spinner-double-bounce2 {
		-webkit-animation-delay: -1.0s;
		animation-delay: -1.0s;
}
@-webkit-keyframes cssspinnerbounce {
		0%, 100% {
				-webkit-transform: scale(0);
				transform: scale(0);
		}
		50% {
				-webkit-transform: scale(1);
				transform: scale(1);
		}
}
@keyframes cssspinnerbounce {
		0%, 100% {
				-webkit-transform: scale(0);
				transform: scale(0);
		}
		50% {
				-webkit-transform: scale(1);
				transform: scale(1);
		}
}
@media (min-width: 75rem) { /* 1200px */
}
@media (max-width: 61.99875rem) { /* 991.98px */
		#contact_us .modal-content .title {
				font-size: 1.75rem;
		}
		#contact_us .modal-content .text {
				font-size: 1.125rem;
		}
		#appealform label, #appealform .form-label {
				font-size: 1rem;
		}
		#appealform .form-check-label, #appealform .form-check-label {
				font-size: 1rem;
		}
		#appealform .small, #appealform small {
				font-size: .8125rem;
		}
		.form-control::-webkit-input-placeholder {
				font-size: .8125rem;
		}
		.form-control::-moz-placeholder {
				font-size: .8125rem;
		}
		.form-control:-ms-input-placeholder {
				font-size: .8125rem;
		}
		.form-control::-ms-input-placeholder {
				font-size: .8125rem;
		}
		.form-control::placeholder {
				font-size: .8125rem;
		}
		::-webkit-input-placeholder {
				font-size: .8125rem;
		}
		::-moz-placeholder {
				font-size: .8125rem;
		}
		:-moz-placeholder {
				font-size: .8125rem;
		}
		a.no_underline {
				font-size: .85rem;
		}
}
@media (max-width: 47.99875rem) { /* 767.98px */
		#dialog-content h3 {
				font-size: 1.25rem;
		}
		#dialog-content h5 {
				font-size: 1.125rem;
		}
		#dialog-content p {
				font-size: .8125rem;
		}
		#appealform label, #appealform .form-label {
				font-size: .825rem;
		}
		#appealform .form-check-label, #appealform .form-check-inline, #appealform .form-select, #appealform .form-control {
				font-size: .8125rem;
		}
		#appealform .small, #appealform small {
				font-size: .75rem;
		}
		.sentbtn_done, .sentbtn {
				font-size: 1.125rem;
		}
}
@media (max-width: 30rem) { /* 480px */
		#contact_us .modal-content .title {
				font-size: 1.5rem;
		}
		#contact_us .modal-content .text small {
				font-size: .75rem;
		}
		#contact_us .modal-content, #contact_us .modal-content .modal-body {
				padding-left: 0;
				padding-right: 0;
		}
		#appealform .form-check-label {
				text-align: start;
				padding-left: 0;
		}
		a.no_underline {
				font-size: .8125rem;
		}
		.under-msg {
				font-size: 1rem;
				bottom: 1rem;
				left: 0;
				right: 0;
				padding: 1rem;
				min-width: inherit;
				max-width: 80%;
		}
		#dialog-content h3 {
				font-size: 1.125rem;
		}
		#dialog-content h5 {
				font-size: 1rem;
		}
		#dialog-content p {
				font-size: .8125rem;
		}
		.sentbtn_done, .sentbtn {
				font-size: 1rem;
		}
}