﻿@charset "utf-8";
/* CSS Document */

/*reset 網頁預設CSS*/
* {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	/*list-style: none;*/
	outline: none;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

button {
	-webkit-appearance: none; /*希望加這行後iphone按鈕不會再自己亂套用了*/
}

/*↓讓footer置底↓*/
html {
	height: 100%;
}

body {
	min-height: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	margin: 0px;
}

.wrap {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
}
/*↑讓footer置底↑*/

h1 {
	font-family: 微軟正黑體;
	font-weight: bold;
}

/* wrapper */
.wrapper {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	text-align: center;
}

	.wrapper > * {
		-webkit-box-flex: 1;
		-ms-flex: 1 100%;
		flex: 1 100%;
	}

/*↓設定置頂導覽選單，包含內文字型排列↓*/
.nav {
	width: 100%;
	height: 90px;
	background: -webkit-gradient(linear, left top, right top, from(#b9003f), to(#002697));
	background: -o-linear-gradient(left, #b9003f, #002697);
	background: linear-gradient(to right, #b9003f, #002697);
	position: fixed;
	z-index: 9;
	top: 0;
}

/*導覽的文字列表部分*/
.nav-text {
	text-align: center;
}

	.nav-text ul {
		display: inline-block;
		-webkit-padding-start: 40px;
		padding-inline-start: 40px;
		-webkit-padding-end: 40px;
		padding-inline-end: 40px;
	}

	.nav-text li {
		list-style-type: none;
		float: left;
	}

		.nav-text li a {
			display: block;
			padding: 2rem 1.5rem;
			color: #fff;
			font-family: 微軟正黑體;
			font-size: 1.2rem;
			text-decoration: none;
			text-shadow: 0.0625em 0.0625em 0.3125em #4b4b4b;
			letter-spacing: 0.2rem;
		}

			.nav-text li a:hover {
				color: #ffe77b;
			}

/*導覽的漢堡選單部分*/
.hamburger-btn {
	padding: 15px;
	background: none;
	border: none;
	display: none;
	cursor: pointer;
	position: fixed;
	top: 20px;
	right: 20px;
}

.hamburger-look {
	background-color: #bfabdf;
	border-radius: 2px;
	display: block;
	height: 4px;
	margin: 0 auto 4px;
	width: 30px;
}

.hamburger-list {
	width: 100%;
	height: calc(100vh - 90px);
	background-color: rgb(51, 42, 58);
	opacity: 90%;
	position: absolute;
	top: 90px;
	right: -100%;
	-webkit-transition: 0.5s;
	-o-transition: 0.5s;
	transition: 0.5s;
	display: none;
}

@media screen and (max-width: 950px) {
	.hamburger-btn {
		display: inline-block;
	}

	.nav-text {
		display: none;
	}

	.hamburger-list {
		height: calc(100vh - 90px);
		top: 90px;
		display: block;
	}
}

.hamburger-list a {
	margin-top: 6px;
	display: block;
	font-family: 微軟正黑體;
	font-size: 1.2rem;
	text-decoration: none;
	text-align: center;
	color: #fff;
	padding: 1rem;
	border-bottom: 1px solid rgb(168, 152, 189);
}

	.hamburger-list a:hover {
		color: rgb(241, 218, 139);
	}

#menu_control {
	position: absolute;
	display: none;
}

	#menu_control:checked ~ .hamburger-menu .hamburger-list {
		right: 0;
	}
/*↑設定置頂導覽選單，包含內文字型排列↑*/

	/*↓設定上方大圖(含字)動畫↓*/
	.banner {
		width: 100%;
		height: 500px;
		background-image: url("images/upper-base.png");
		background-size: cover;
		background-position: center;
		-webkit-animation: blink 1s;
		animation: blink 1s;
		margin-top: 90px;
		margin-bottom: -90px;
	}

	@-webkit-keyframes blink {
		from {
			opacity: 0;
		}

		to {
			opacity: 1;
		}
	}

	@keyframes blink {
		from {
			opacity: 0;
		}

		to {
			opacity: 1;
		}
	}

	.banner-logo {
		z-index: 3;
		position: absolute;
		top: 150px;
	}

	.banner-text {
		z-index: 3;
		margin: 0 auto;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		letter-spacing: 0.05rem;
		color: #fff;
	}
	/*向上浮出動畫*/
	.fadeInUp {
		opacity: 0;
		-webkit-animation-name: fadeInUp;
		animation-name: fadeInUp;
		-webkit-animation-delay: 0.35s;
		animation-delay: 0.35s;
		-webkit-animation-duration: 1s;
		animation-duration: 1s;
		-webkit-animation-fill-mode: both;
		animation-fill-mode: both;
	}

	@-webkit-keyframes fadeInUp {
		from {
			-webkit-transform: translate3d(0, 40px, 0);
			transform: translate3d(0, 40px, 0);
		}

		to {
			-webkit-transform: translate3d(0, 0, 0);
			transform: translate3d(0, 0, 0);
			opacity: 1;
		}
	}

	@keyframes fadeInUp {
		from {
			-webkit-transform: translate3d(0, 40px, 0);
			transform: translate3d(0, 40px, 0);
		}

		to {
			-webkit-transform: translate3d(0, 0, 0);
			transform: translate3d(0, 0, 0);
			opacity: 1;
		}
	}
	/*向下浮出動畫*/
	.fadeInDown {
		opacity: 0;
		-webkit-animation-name: fadeInDown;
		animation-name: fadeInDown;
		-webkit-animation-delay: 0.1s;
		animation-delay: 0.1s;
		-webkit-animation-duration: 1s;
		animation-duration: 1s;
		-webkit-animation-fill-mode: both;
		animation-fill-mode: both;
	}

	@-webkit-keyframes fadeInDown {
		from {
			-webkit-transform: translate3d(0, 0, 0);
			transform: translate3d(0, 0, 0);
		}

		to {
			-webkit-transform: translate3d(0, 40px, 0);
			transform: translate3d(0, 40px, 0);
		}
	}

	@keyframes fadeInDown {
		from {
			-webkit-transform: translate3d(0, 0, 0);
			transform: translate3d(0, 0, 0);
		}

		to {
			-webkit-transform: translate3d(0, 40px, 0);
			transform: translate3d(0, 40px, 0);
		}
	}

	/*用於index第一個區塊動畫延遲*/
	.aniDelay {
		-webkit-animation-delay: 0.5s;
		animation-delay: 0.5s;
	}

	#teco-name {
		z-index: 5;
		position: absolute;
		top: 380px;
		left: 12rem;
		font-size: 1.8rem;
		line-height: 60px;
		text-shadow: 0.0625em 0.0625em 0.3125em #313131;
	}

	#rs-page {
		z-index: 4;
		position: absolute;
		font-family: "Ebrima";
		font-weight: bold;
		font-size: 6rem;
		top: 160px;
		right: 12rem;
		text-align: right;
		opacity: 40%;
	}
	/*↑設定上方大圖(含字)動畫↑*/

	/* 麵包屑 */
	.breadcrumb {
		font-family: "微軟正黑體";
		padding: 3rem 12rem 0.8rem;
		list-style: none;
		text-align: left;
		margin: 90px 0 30px; /*那個90是置頂導覽的高度，在寫media query要更改*/
	}

		.breadcrumb span {
			color: #000;
			display: inline;
			font-size: 18px;
		}

		.breadcrumb li {
			color: #930093;
			display: inline;
			font-size: 18px;
		}

			.breadcrumb li + li:before {
				padding: 8px;
				color: #000;
				content: "/\00a0";
			}

			.breadcrumb li a {
				color: #000;
				text-decoration: none;
			}

				.breadcrumb li a:hover {
					color: #000;
					text-decoration: underline;
				}

	/*↓footer設計↓*/
	footer {
		padding: 20px;
		background-color: #999;
		text-align: center;
		width: 100%;
		margin-top: 100px;
	}

		footer p {
			font-family: 微軟正黑體;
			font-size: 12px;
			font-weight: bold;
			color: #fff;
			letter-spacing: 3px;
            margin:5px;
            padding:0px;
		}
	/*↑footer設計↑*/

	/* ↓inputbox輸入框↓ */
	.inputbox {
		font-family: "微軟正黑體";
		width: 100%;
		outline: none;
		border: 1px solid #cccccc;
		font-size: 15px;
		padding: 6px 10px;
		border-radius: 4px;
		background-color: #fff;
	}

		.inputbox:focus {
			opacity: 1;
			border: 1px solid #77b8f8;
			-webkit-box-shadow: 0 0 4.7px #77b8f8;
			box-shadow: 0 0 4.7px #77b8f8;
			background-color: #fff;
		}

	/*一開始不顯示*/
	.invisible {
		display: none !important;
	}

    /* Inquery樣式背景圖 */
    .backgroundInquery {
        margin-bottom: 100px;
        padding: 30px;
    }

	/* 02樣式背景圖 */
	.background02 {
		background-image: url(../../background/bg02.jpg);
		background-position: center;
		background-size: cover;
		background-attachment: fixed;
		background-repeat: no-repeat;
		margin-bottom: -100px;
		padding: 80px;
	}
	/* 04樣式背景圖 */
	.background04 {
		background-image: url(../../background/bg04.jpg);
		background-position: center;
		background-size: cover;
		background-attachment: fixed;
		background-repeat: no-repeat;
		margin-bottom: -100px;
		padding: 80px;
	}
	/* 05樣式背景圖 */
	.background05 {
		background-color: #e4e4ef;
		background-position: center;
		background-size: cover;
		background-attachment: fixed;
		background-repeat: no-repeat;
		margin-bottom: -100px;
		padding: 80px;
	}
	/* 設定 Passport.visa.Auth 圖片位置 */
	.step {
		text-align: center;
		margin-bottom: 40px;
	}

		.step p {
			font-family: 微軟正黑體;
			font-size: 18px;
			font-weight: bold;
			color: rgb(223, 53, 53);
			margin-top: 10px;
		}

		.step img {
			width: 600px;
		}

	/* 用於01頁面設定會變色的按鈕 */
	.button-section {
		text-align: center;
		margin: 0 auto;
	}

	/*用於01頁面設定會變色的按鈕移過去游標會變色*/
	.on_click_change {
		cursor: pointer;
	}

	/*用於01頁面下方資訊區*/
	.info-section {
		text-align: center;
	}

	/*用於授權書頁面點選按鈕後下方會跑出的東西先不顯示*/
	.btn_file_show {
		display: none;
	}

	/*用於捲動頁面後區塊淡入(搭配script)*/
	.scroll_and_fadeIn {
		opacity: 0;
	}

	/*用於01頁面設定聲明的邊框圓角*/
	.statement-border {
		border: 1px solid #a1a1a1;
		padding: 60px; /*文字跟邊框的距離內縮*/
		border-radius: 20px;
		margin: 40px 12rem;
	}

	/*用於01頁面左右兩欄算一區*/
	.statement-text-2col {
		display: block;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		margin: 0 0 30px 0;
	}

	/*用於01頁面中間一欄算一區*/
	.statement-text-1col {
		display: inline;
		margin: 0 0 30px;
	}

	/* 用於01頁面設定聲明內標題文字格式 */
	.statement-text-left {
		text-align: left;
		line-height: 25px;
		color: #000;
		font-size: 16px;
		font-family: "微軟正黑體";
		font-weight: bold;
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
	}

	/* 用於01頁面設定聲明內容文字格式 */
	.statement-text-right {
		text-align: left;
		line-height: 25px;
		color: #000;
		font-size: 16px;
		font-family: "微軟正黑體";
		-webkit-box-flex: 4;
		-ms-flex: 4;
		flex: 4;
	}

	/* 用於01頁面設定聲明內容文字格式 */
	.statement-text-center {
		text-align: center;
		color: #000;
		font-size: 22px;
		font-family: "微軟正黑體";
		font-weight: bold;
	}

	/*用於01頁面我同意上述內容這句話的字體設計*/
	.agree {
		text-align: center;
		font-family: "微軟正黑體";
		font-size: 18px;
		font-weight: bold;
		color: #000;
	}

	/*用於01頁面button*/
	.btn_next_page {
		width: 150px;
		height: 60px;
		font-family: 微軟正黑體;
		color: #000;
		font-size: 18px;
		letter-spacing: 3px;
		background: -webkit-gradient(linear, left top, left bottom, from(rgb(245, 245, 245)), to(rgb(231, 231, 231)));
		background: -o-linear-gradient(rgb(245, 245, 245), rgb(231, 231, 231));
		background: linear-gradient(rgb(245, 245, 245), rgb(231, 231, 231));
		border: 1px solid #bdbdbd;
		cursor: pointer;
		margin: 50px auto 0;
		text-decoration: none;
	}

		.btn_next_page:hover {
			background: -webkit-gradient(linear, left top, left bottom, from(rgb(197, 196, 196)), to(rgb(206, 206, 206)));
			background: -o-linear-gradient(rgb(197, 196, 196), rgb(206, 206, 206));
			background: linear-gradient(rgb(197, 196, 196), rgb(206, 206, 206));
		}

	/* 設定圓角框用於02 04 05頁面 */
	.formBorder {
		-webkit-box-shadow: 3px 3px 6px #666;
		box-shadow: 3px 3px 6px #666;
		border-radius: 40px;
		background-color: rgba(255, 255, 255, 0.8);
		position: relative;
		padding: 3.5rem 0rem 2.5rem;
		margin: 1rem auto;
		text-align: right;
		width: 45rem;
	}

	/* 用於02 04頁面設定表單內必填字樣 */
	.needToWrite {
		color: #ff0000;
		font-weight: normal;
		font-size: 12px;
		font-family: "微軟正黑體";
	}

	/* 用於02 03 04 05 06頁面設定表單標題字樣 */
	.item {
		color: #4f4f4f;
		font-weight: bold;
		font-size: 16px;
		font-family: "微軟正黑體";
	}

	/* 用於02 03 04 05 06頁面控制表單內格式 */
	.row {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}

    /* 用於送出前確認表單內格式 */
    .rowSubmit {
        text-align: left;
        padding-left: 25%;
    }

	/* 設定表單內說明小字樣 */
	.smallWord {
		width: 300px;
		text-align: left;
		margin: auto auto 1% 15%;
		font-size: 14px;
		font-family: '微軟正黑體';
		color: #2f2f2f;
	}

	/* 設定03頁面step1及step2標題字樣 */
	.page3TitleWord {
		color: #7f5093;
		font-size: 28px;
		font-weight: 700;
		font-family: "微軟正黑體";
	}

	/* 用於03頁面設定表單標頭格式位置 */
	#dayOfReservation {
		text-align: right;
	}

	/* 用於03頁面設定InputBox格式位置 */
	.dayOfReservationInputBox {
		margin: auto auto 2% 10% !important;
	}

	/* 設定03頁面選擇時段button區塊框架 */
	.button03 {
		width: 90%;
		margin-left: 16%;
	}

	/* 設定03頁面選擇時段藍色button */
	.buttonBlue03 {
		background-color: white;
		color: #71a3bf;
		border: 2px solid #71a3bf;
		width: 80px;
		height: 55px;
		margin: 3%;
		-ms-flex-line-pack: center !important;
		align-content: center !important;
		cursor: pointer;
	}

	/* 設定03頁面選擇時段灰色button */
	.buttonGray03 {
		background-color: white;
		color: #b5b5b6;
		border: 2px solid #b5b5b6;
		width: 80px;
		height: 55px;
		margin: 3%;
		-ms-flex-line-pack: center !important;
		align-content: center !important;
		cursor: pointer;
	}

	/* 設定03 05頁面下一頁圖片按鈕 */
	.nextPageButtonImg {
		margin-top: 5%;
	}

	/* 設定Button字樣用於02 04 05頁面 */
	/* 設定Button字樣用於02 04 05頁面 */
	.CommonButton {
		font-family: "微軟正黑體";
		width: 120px;
		height: 45px;
		margin: 5% 5.5% 2%;
		font-size: 16px;
		border: 2px;
		background-color: #e5e5e6;
		border-radius: 0px;
		cursor: pointer;
		outline: none;
		-webkit-appearance: none; /*希望加這行後iphone按鈕不會再自己亂套用了*/
	}

		.CommonButton:hover {
			background-color: #cecece;
		}

	/* 用於05頁面按下button跳出下方注意事項 */
	.note {
		margin: 0 auto;
		line-height: 50px;
		text-align: center;
		-webkit-box-shadow: 3px 3px 6px #666;
		box-shadow: 3px 3px 6px #666;
		margin-top: 5%;
		padding: 5%;
		font-family: 微軟正黑體;
		font-size: 16px;
	}

	/* 用於05頁面必備文件列表標頭字樣設定 */
	.list {
		background-color: #ffffff;
		font-family: "微軟正黑體";
		width: 58%;
		margin: 60px auto;
		padding: 5%;
		-webkit-box-shadow: 3px 3px 6px rgb(180, 176, 190);
		box-shadow: 3px 3px 6px rgb(180, 176, 190);
		text-align: left;
	}

		.list p {
			text-align: center;
			font-family: 微軟正黑體;
			font-size: 24px;
			color: #000;
			font-weight: bold;
			margin-bottom: 50px;
			letter-spacing: 2px;
		}

	/*用於05頁面設定我同意上述內容這句話的字體設計*/
	.agree05 {
		text-align: center;
		font-family: "微軟正黑體";
		font-size: 20px;
		color: #000;
		margin: 3% auto -3% auto;
		font-weight: 550;
	}

	/* 用於06頁面粉色條 */
	.pinkItem {
		background-color: #f7dce2;
		/* color: #FF0080;我沒有AI檔用圖片放大失焦對不到色碼 */
		font-family: "微軟正黑體";
		font-size: 22px;
		font-weight: 900;
		width: 100%;
		padding: 1.5%;
		margin: 0px auto;
		margin-bottom: 5%;
		text-align: center;
		color: #fc002c;
	}

	/* 設定03頁面選擇時段button區塊框架 */
	.button06 {
		width: 300;
		margin-left: 6%;
		background-color: white;
		color: #71a3bf;
		border: 2px solid #71a3bf;
		width: 80px;
		height: 55px;
		margin: 3%;
		-ms-flex-line-pack: center !important;
		align-content: center !important;
	}

	/*讓按鈕三個一行*/
	.box-wrap {
		margin: auto 30%;
		text-align: center;
		overflow: hidden;
	}

		.box-wrap > div {
			width: 31%;
			padding-bottom: 31%;
			margin: 1%;
			float: left;
			background-color: orange;
		}

	.box-wrap01 {
		margin: auto 15%;
		text-align: center;
		overflow: hidden;
	}

		.box-wrap01 > img {
			width: 33%;
			float: left;
		}

	.col-form-label {
		padding-top: calc(0.375rem + 1px);
		padding-bottom: calc(0.375rem + 1px);
		margin-bottom: 0px;
		font-size: inherit;
		line-height: 1.5;
	}

	.col-sm-4 {
		position: relative;
		width: 100%;
		padding-right: 15px;
		padding-left: 15px;
	}

	@media (min-width: 576px) {
		.col-sm-4 {
			max-width: 33.3333%;
			-webkit-box-flex: 0;
			-ms-flex: 0 0 33.3333%;
			flex: 0 0 33.3333%;
		}
	}

	.form-control:disabled,
	.form-control[readonly] {
		background-color: rgb(233, 236, 239);
		opacity: 1;
	}

	@media screen and (prefers-reduced-motion: reduce) {
		.form-control {
			-webkit-transition: none 0s ease 0s;
			-o-transition: none 0s ease 0s;
			transition: none 0s ease 0s;
		}
	}

	/*按鈕被選中後變色*/
	.button-section input[type="checkbox"]:checked + span {
		background-color: rgb(255, 209, 83);
	}

	/*按鈕(含icon)*/

	.btn_type1 /*最短的*/ {
		border-radius: 6px;
		display: inline-block;
		text-decoration: none;
		font-family: 微軟正黑體;
		font-size: 18px;
		font-weight: bold;
		padding: 0.8em 1em;
		position: relative;
		margin: 15px;
		cursor: pointer;
		width: 180px;
		line-height: 40px;
		text-align: justify;
		text-justify: distribute;
		/*text-align-last:justify;*/
	}

	.btn_type2 /*中的*/ {
		border-radius: 6px;
		display: inline-block;
		text-decoration: none;
		font-family: 微軟正黑體;
		font-size: 18px;
		font-weight: bold;
		padding: 0.8em 1em;
		position: relative;
		margin: 15px;
		cursor: pointer;
		width: 240px;
		line-height: 40px;
		text-align: justify;
		text-justify: distribute;
		/*text-align-last:justify;*/
	}

	.btn_type3 /*最長的*/ {
		border-radius: 6px;
		display: inline-block;
		text-decoration: none;
		font-family: 微軟正黑體;
		font-size: 18px;
		font-weight: bold;
		padding: 0.8em 1em;
		position: relative;
		margin: 15px;
		cursor: pointer;
		width: 360px;
		line-height: 40px;
		text-align: justify;
		text-justify: distribute;
		/*text-align-last:justify;*/
	}

	/*三格式按鈕內部分配*/

	.btn_wrap2 /*中的(套用btn_type2)*/ {
		position: absolute;
		display: inline-block;
		height: 30px;
		width: 150px;
	}

    .btn_wrap2_1 /*中的(套用btn_type2)*/ {
        position: absolute;
        display: inline-block;
        height: 30px;
        width: 150px;
        padding-left: 15px;
    }	
    
    .btn_wrap3 /*長的(套用btn_type3)*/ {
		position: absolute;
		display: inline-block;
		height: 40px;
		width: 280px;
	}


	.btn_ch {
		font-size: 16px;
		line-height: 16px;
		display: block;
		text-align: justify;
		-moz-text-align-last: justify;
		text-align-last: justify;
		text-justify: distribute;
	}

	.btn_en {
		font-size: 14px;
		line-height: 20px;
		margin-top: 6px;
		display: block;
		text-align: center;
	}

	.btn_en_small {
		font-size: 12px;
		line-height: 20px;
		margin-top: 6px;
		display: block;
		text-align: center;
	}

	/*按鈕顏色樣式*/
	.btn_colorA {
		background: none #d7eac5;
		color: #516b39;
		-webkit-box-shadow: 0px 2px 10px #829b6d;
		box-shadow: 0px 2px 10px #829b6d;
	}

		.btn_colorA:hover,
		.btn_colorA:focus {
			background: none #a3af95;
		}

	.btn_colorB {
		background: none #c3e5df;
		color: #307577;
		-webkit-box-shadow: 0px 2px 10px #648c84;
		box-shadow: 0px 2px 10px #648c84;
	}

		.btn_colorB:hover,
		.btn_colorB:focus {
			background: none #97afaa;
		}

	.btn_colorC {
		background: none #b9e4ea;
		color: #386182;
		-webkit-box-shadow: 0px 2px 10px #5d8791;
		box-shadow: 0px 2px 10px #5d8791;
	}

		.btn_colorC:hover,
		.btn_colorC:focus {
			background: none #96b9bc;
		}

	.btn_colorD {
		background: none #c5ddea;
		color: #597582;
		-webkit-box-shadow: 0px 2px 10px #596c87;
		box-shadow: 0px 2px 10px #596c87;
		margin: 50px auto;
	}

		.btn_colorD:hover,
		.btn_colorD:focus {
			background: none rgb(138, 169, 173);
		}

	.btn_colorE {
		background: none #ffcccc;
		color: #e04f5f;
		-webkit-box-shadow: 0px 2px 10px #a36971;
		box-shadow: 0px 2px 10px #a36971;
	}

		.btn_colorE:hover,
		.btn_colorE:focus {
			background: none #cc6e87;
		}

	.btn_colorF {
		background: none #ccd9ed;
		color: #324670;
		-webkit-box-shadow: 0px 2px 10px #617187;
		box-shadow: 0px 2px 10px #617187;
	}

	    .btn_colorF:hover,
	    .btn_colorF:focus {
		    background: none #8b95a5;
	    }

    .btn_colorG {
        background: none #c5c8ef;
        color: #4b4687;
        -webkit-box-shadow: 0px 2px 10px #66667f;
        box-shadow: 0px 2px 10px #66667f;
    }

        .btn_colorG:hover,
        .btn_colorG:focus {
            background: none #7979a3;
        }

    .btn_colorH {
        background: none #d4c9f4;
        color: #4b4687;
        -webkit-box-shadow: 0px 2px 10px #66628c;
        box-shadow: 0px 2px 10px #66628c;
    }

        .btn_colorH:hover,
        .btn_colorH:focus {
            background: none #6b658e;
        }

	.btn_color1 {
		background: none #bbc4b1;
		color: #565e49;
		-webkit-box-shadow: 0px 2px 10px #8e9385;
		box-shadow: 0px 2px 10px #8e9385;
	}

		.btn_color1:hover,
		.btn_color1:focus,
		.btn_color1:checked {
			background: none #898e83;
		}

	.btn_color2 {
		background: none #a8c6c1;
		color: #374743;
		-webkit-box-shadow: 0px 2px 10px #6b7f7b;
		box-shadow: 0px 2px 10px #6b7f7b;
	}

		.btn_color2:hover,
		.btn_color2:focus {
			background: none #7a8c89;
		}

	.btn_color3 {
		background: none #a8c3cc;
		color: #3b4649;
		-webkit-box-shadow: 0px 2px 10px #69787c;
		box-shadow: 0px 2px 10px #69787c;
	}

		.btn_color3:hover,
		.btn_color3:focus {
			background: none #74878c;
		}

	.btn_color4 {
		background: none #c2cca8;
		color: #50563c;
		-webkit-box-shadow: 0px 2px 10px #83896e;
		box-shadow: 0px 2px 10px #83896e;
	}

		.btn_color4:hover,
		.btn_color4:focus {
			background: none #838971;
		}

	.btn_color5 {
		background: none #b2d3cf;
		color: #3d4443;
		-webkit-box-shadow: 0px 2px 10px #728784;
		box-shadow: 0px 2px 10px #728784;
	}

		.btn_color5:hover,
		.btn_color5:focus {
			background: none #849996;
		}

	.btn_color6 {
		background: none #bad5db;
		color: #3e4849;
		-webkit-box-shadow: 0px 2px 10px #7a8789;
		box-shadow: 0px 2px 10px #7a8789;
	}

		.btn_color6:hover,
		.btn_color6:focus {
			background: none #8a9b9e;
		}

	.btn_color7 {
		background: none #c1d8b2;
		color: #485142;
		-webkit-box-shadow: 0px 2px 10px #7e8c74;
		box-shadow: 0px 2px 10px #7e8c74;
	}

		.btn_color7:hover,
		.btn_color7:focus {
			background: none #89997e;
		}

	.btn_color8 {
		background: none #bee5e2;
		color: #3d4443;
		-webkit-box-shadow: 0px 2px 10px #728784;
		box-shadow: 0px 2px 10px #728784;
	}

		.btn_color8:hover,
		.btn_color8:focus {
			background: none #88a09d;
		}

	.btn_color9 {
		background: none #b5dae5;
		color: #434e4f;
		-webkit-box-shadow: 0px 2px 10px #7a8789;
		box-shadow: 0px 2px 10px #7a8789;
	}

		.btn_color9:hover,
		.btn_color9:focus {
			background: none #809aa0;
		}

	/*個別按鈕icon設定*/
	#btn_pass:before {
		background: url("images/icon/btn_pass.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		vertical-align: middle;
		top: -2px;
		margin-right: 15px;
	}

	#btn_visa:before {
		background: url("images/icon/btn_visa.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		vertical-align: middle;
		top: -2px;
		margin-right: 15px;
	}

	#btn_auth:before {
		background: url("images/icon/btn_auth.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		vertical-align: middle;
		top: -2px;
		margin-right: 15px;
	}

	#btn_imc:before {
		background: url("images/icon/btn_imc.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		vertical-align: middle;
		margin-right: 15px;
	}


    #btn_counter:before {
        background: url("images/icon/icon_counter.svg") center / 100%;
        content: "";
        display: inline-block;
        height: 30px;
        width: 30px;
        position: relative;
        vertical-align: middle;
        margin-right: 15px;
    }

    #btn_mail1:before {
        background: url("images/icon/icon_mail1.svg") center / 100%;
        content: "";
        display: inline-block;
        height: 30px;
        width: 30px;
        position: relative;
        vertical-align: middle;
        margin-right: 15px;
    }
	#btn_auth1:before {
		background: url("images/icon/icon_auth1.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_auth2:before {
		background: url("images/icon/icon_auth2.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_auth3:before {
		background: url("images/icon/icon_auth3.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_auth4:before {
		background: url("images/icon/icon_auth4.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_auth5:before {
		background: url("images/icon/icon_auth5.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_auth6:before {
		background: url("images/icon/icon_auth6.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_auth7:before {
		background: url("images/icon/icon_auth7.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_auth8:before {
		background: url("images/icon/icon_auth8.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_auth9:before {
		background: url("images/icon/icon_auth9.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_auth10:before {
		background: url("images/icon/icon_auth10.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_auth11:before {
		background: url("images/icon/icon_auth11.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_auth12:before {
		background: url("images/icon/icon_auth12.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_auth13:before {
		background: url("images/icon/icon_auth13.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_auth14:before {
		background: url("images/icon/icon_auth14.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_auth15:before {
		background: url("images/icon/icon_auth15.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_pass1:before {
		background: url("images/icon/icon_pass1.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_pass2:before {
		background: url("images/icon/icon_pass2.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_pass3:before {
		background: url("images/icon/icon_pass3.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_pass4:before {
		background: url("images/icon/icon_pass4.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_pass5:before {
		background: url("images/icon/icon_pass5.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_pass6:before {
		background: url("images/icon/icon_pass6.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_pass7:before {
		background: url("images/icon/icon_pass7.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_visa1:before {
		background: url("images/icon/icon_visa1.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_visa2:before {
		background: url("images/icon/icon_visa2.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_visa3:before {
		background: url("images/icon/icon_visa3.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_visa4:before {
		background: url("images/icon/icon_visa4.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_visa5:before {
		background: url("images/icon/icon_visa5.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_visa6:before {
		background: url("images/icon/icon_visa6.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_visa7:before {
		background: url("images/icon/icon_visa7.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_visa8:before {
		background: url("images/icon/icon_visa8.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	#btn_visa9:before {
		background: url("images/icon/icon_visa9.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

	/* 控制問題頁面各個問題題目及選項 */
	.fieldsetBorder {
		margin-bottom: 3%;
		font-family: "微軟正黑體";
		font-size: 16px;
		letter-spacing: 0.8px;
		line-height: 32px;
		text-align: left;
	}

		/* 問題頁面的問題選項格式控制 */
		.fieldsetBorder p {
			padding-left: 2.2%;
		}

		.fieldsetBorder label {
			margin-left: 10px;
			text-indent: 20px;
		}

	/* 控制問題頁面各個問題題目及選項 */
	.fieldsetBorder-identity {
		margin: 3% auto;
		font-family: "微軟正黑體";
		font-size: 16px;
		letter-spacing: 0.8px;
		text-align: left;
		color: #2a2b2b;
	}
		/* 問題頁面的問題選項格式控制 */
		.fieldsetBorder-identity p {
			padding-left: 3%;
			margin-top: 3.5%;
		}

	/* radiobtn間距 */
	.Radioleft {
		margin-right: 2%;
	}

	/* 對齊方式 */
	.center {
		text-align: center;
	}

	.left {
		text-align: left;
	}

	.right {
		text-align: right;
	}

	.red {
		color: red;
	}

	/* 問題頁面標題文字 */
	.authWord {
		text-align: center;
		font-family: "Noto Sans TC", sans-serif;
		color: #615e6d;
		font-size: 36px;
		font-weight: bold;
		letter-spacing: 0.6rem;
		margin-bottom: 5%;
	}

	/*說明*/
	.description {
		color: rgb(202, 4, 4);
		font-size: 17px;
		font-family: 微軟正黑體;
		margin: -10px auto 20px;
	}

	.description-PersonalDataBooker {
		color: rgb(202, 4, 4);
		font-size: 15px;
		font-weight: bold;
		font-family: 微軟正黑體;
		margin: -10px auto 20px 4.5rem;
		text-align: center;
		width: 68%;
	}

    .descriptionBlack-PersonalDataBooker {
        color: #4f4f4f;
        font-size: 16px;
        font-weight: bold;
        font-family: 微軟正黑體;
        margin: auto auto 20px 2rem;
        text-align: center;
        width: 85%;
    }

    /* 問題頁面問題題目格式控制 */
	.title {
		background-color: #bfbcc5;
		padding-left: 1.5%;
		margin-bottom: 2%;
	}

	/* 身份選擇頁面問題題目格式控制 */
	.identity-title {
		margin-bottom: 2%;
		font-size: 1.2rem;
		font-weight: bold;
		color: #686767;
		letter-spacing: 0.1rem;
	}
	/* 身份選擇頁面問題題目底線格式控制 */
	.identity-line {
		border-bottom: solid #919191 2px;
		margin-bottom: 2%;
		width: 100%;
	}
	/* 問題頁面選項格式控制 */
	.text-padding {
		padding-left: 2.2%;
	}

	/* 問題頁面輸入框往後退格格式控制 */
	.text-padding1 {
		padding-left: 8%;
		font-size: 16px;
	}

	/*月曆頁面上下邊界設定*/
	.wp {
		margin: 12% auto 0%;
	}

	/* 日曆頁面兩欄的框架 */
	.parent {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-flow: row;
		flex-flow: row;
	}

	/* 日曆頁面拆為兩欄的框架*/
	.change {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		margin: 20px;
	}

	/* 設定圓角框用於問題頁面 */
	.formBorderAuth {
		margin: auto;
		background-color: rgba(255, 255, 255, 0.8);
		-webkit-box-shadow: 3px 3px 8px rgb(163, 155, 168);
		box-shadow: 3px 3px 8px rgb(163, 155, 168);
		width: 55%;
		border-radius: 40px;
		padding: 4% 8% 3%;
	}

	.formBorder-PersonalDataBooker {
		padding: 3.5rem 0rem 2.5rem 3rem;
	}

	/*客服頁面*/
	.ohNo {
		background-color: #f2eee7;
		margin: 80px auto 0;
		position: relative;
		width: 700px;
		border-radius: 10px;
		padding: 60px;
	}

	.ohNo_dot {
		background-color: #ccba9b;
		position: absolute;
		width: 20px;
		height: 20px;
		border-radius: 50%;
	}

	#dot1 {
		top: 20px;
		left: 20px;
	}

	#dot2 {
		bottom: 20px;
		left: 20px;
	}

	#dot3 {
		top: 20px;
		right: 20px;
	}

	#dot4 {
		bottom: 20px;
		right: 20px;
	}

	#ohNo_h1 {
		font-size: 100px;
		color: rgb(193, 174, 211);
		margin: auto 200px;
		position: absolute;
		top: -18%;
		left: -40%;
		z-index: 3;
	}

	.ohNo h2 {
		font-size: 28px;
		font-family: 微軟正黑體;
		font-weight: bold;
		color: #a0323a;
		text-align: center;
		margin-bottom: 20px;
	}

	.ohNo h3 {
		font-size: 18px;
		font-family: 微軟正黑體;
		font-weight: bold;
		color: #56486b;
		text-align: center;
		line-height: 35px;
	}

	.contactMe {
		background-color: #919b7b;
		border-radius: 10px;
		width: 60%;
		color: #fff;
		font-family: 微軟正黑體;
		font-weight: bold;
		font-size: 18px;
		padding: 15px;
	}

	#phoneContact {
		margin: 40px auto 0;
	}

		#phoneContact:before {
			height: 30px;
			width: 30px;
			background: url("images/icon/icon_phone.svg") center / 100%;
			display: inline-block;
			margin-right: 18px;
			position: relative;
			vertical-align: middle;
			content: "";
			top: -2px;
		}

	#emailContact {
		margin: 20px auto 0;
	}

		#emailContact:before {
			height: 30px;
			width: 30px;
			background: url("images/icon/icon_mail.svg") center / 100%;
			display: inline-block;
			margin-right: 18px;
			position: relative;
			vertical-align: middle;
			content: "";
			top: -2px;
		}

	/*彈跳動畫 class名稱有txtwav跟bounce*/
	@-webkit-keyframes bounce-wave {
		from {
			-webkit-transform: translateY(0);
			transform: translateY(0)
		}

		to {
			-webkit-transform: translateY(-10px);
			transform: translateY(-10px)
		}
	}

	@keyframes bounce-wave {
		from {
			-webkit-transform: translateY(0);
			transform: translateY(0)
		}

		to {
			-webkit-transform: translateY(-10px);
			transform: translateY(-10px)
		}
	}

	.txtwav.bounce span {
		display: inline-block;
		-webkit-animation-duration: .3s;
		animation-duration: .3s;
		-webkit-animation-name: bounce-wave;
		animation-name: bounce-wave;
		-webkit-animation-iteration-count: infinite;
		animation-iteration-count: infinite;
		-webkit-animation-direction: alternate;
		animation-direction: alternate
	}

	.txtwav.bounce :nth-child(25n+0) {
		-webkit-animation-delay: -.6s;
		animation-delay: -.6s
	}

	.txtwav.bounce :nth-child(25n+1) {
		-webkit-animation-delay: -.576s;
		animation-delay: -.576s
	}

	.txtwav.bounce :nth-child(25n+2) {
		-webkit-animation-delay: -.552s;
		animation-delay: -.552s
	}

	.txtwav.bounce :nth-child(25n+3) {
		-webkit-animation-delay: -.528s;
		animation-delay: -.528s
	}

	.txtwav.bounce :nth-child(25n+4) {
		-webkit-animation-delay: -.504s;
		animation-delay: -.504s
	}

	.txtwav.bounce :nth-child(25n+5) {
		-webkit-animation-delay: -.48s;
		animation-delay: -.48s
	}

	.txtwav.bounce :nth-child(25n+6) {
		-webkit-animation-delay: -.456s;
		animation-delay: -.456s
	}

	.txtwav.bounce :nth-child(25n+7) {
		-webkit-animation-delay: -.432s;
		animation-delay: -.432s
	}

	.txtwav.bounce :nth-child(25n+8) {
		-webkit-animation-delay: -.408s;
		animation-delay: -.408s
	}

	.txtwav.bounce :nth-child(25n+9) {
		-webkit-animation-delay: -.384s;
		animation-delay: -.384s
	}

	.txtwav.bounce :nth-child(25n+10) {
		-webkit-animation-delay: -.36s;
		animation-delay: -.36s
	}

	.txtwav.bounce :nth-child(25n+11) {
		-webkit-animation-delay: -.336s;
		animation-delay: -.336s
	}

	.txtwav.bounce :nth-child(25n+12) {
		-webkit-animation-delay: -.312s;
		animation-delay: -.312s
	}

	.txtwav.bounce :nth-child(25n+13) {
		-webkit-animation-delay: -.288s;
		animation-delay: -.288s
	}

	.txtwav.bounce :nth-child(25n+14) {
		-webkit-animation-delay: -.264s;
		animation-delay: -.264s
	}

	.txtwav.bounce :nth-child(25n+15) {
		-webkit-animation-delay: -.24s;
		animation-delay: -.24s
	}

	.txtwav.bounce :nth-child(25n+16) {
		-webkit-animation-delay: -.216s;
		animation-delay: -.216s
	}

	.txtwav.bounce :nth-child(25n+17) {
		-webkit-animation-delay: -.192s;
		animation-delay: -.192s
	}

	.txtwav.bounce :nth-child(25n+18) {
		-webkit-animation-delay: -.168s;
		animation-delay: -.168s
	}

	.txtwav.bounce :nth-child(25n+19) {
		-webkit-animation-delay: -.144s;
		animation-delay: -.144s
	}

	.txtwav.bounce :nth-child(25n+20) {
		-webkit-animation-delay: -.12s;
		animation-delay: -.12s
	}

	.txtwav.bounce :nth-child(25n+21) {
		-webkit-animation-delay: -.096s;
		animation-delay: -.096s
	}

	.txtwav.bounce :nth-child(25n+22) {
		-webkit-animation-delay: -.072s;
		animation-delay: -.072s
	}

	.txtwav.bounce :nth-child(25n+23) {
		-webkit-animation-delay: -.048s;
		animation-delay: -.048s
	}

	.txtwav.bounce :nth-child(25n+24) {
		-webkit-animation-delay: -.024s;
		animation-delay: -.024s
	}

	.fullScreenRectangle {
		width: 100%;
		background-color: #c9d39f;
		text-align: center;
		font-family: 微軟正黑體;
		font-size: 24px;
		font-weight: bold;
		color: #455125;
		letter-spacing: 5px;
		padding: 24px;
		display: inline-block;
	}

	#reserDone:before {
		background: url("images/icon/icon_check.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 35px;
		width: 35px;
		position: relative;
		vertical-align: middle;
		margin-right: 15px;
		bottom: 2px;
	}

	.suggest {
		font-family: 微軟正黑體;
		margin: 1rem 12rem;
	}

        .suggest li {
            line-height: 34px;
            font-size: 16px;
        }

	.reserInfo {
		width: 1000px;
		background-color: #efefef;
		font-family: 微軟正黑體;
		font-weight: bold;
		text-align: center;
		margin: 40px auto 10px;
		padding: 40px 5%;
		position: relative;
	}

		.reserInfo p {
			display: inline-block;
			text-align: center;
			text-decoration: underline;
			margin-bottom: 30px;
		}

	.btn_reserCancel {
		font-size: 14px;
		font-family: 微軟正黑體;
		font-weight: bold;
		color: #e04f5f;
		position: absolute;
		right: 30px;
		top: 30px;
		background-color: #f2c0ce;
		border-radius: 30px;
		display: inline-block;
		text-decoration: none;
		padding: 0.1em 0.8em;
		cursor: pointer;
		line-height: 30px;
		text-align: justify;
		-moz-text-align-last: justify;
		text-align-last: justify;
		text-justify: distribute;
	}

		.btn_reserCancel:before {
			background: url("images/icon/icon_cancel.svg") center / 100%;
			content: "";
			display: inline-block;
			height: 20px;
			width: 20px;
			position: relative;
			vertical-align: middle;
			top: -0.1em;
			margin-right: 5px;
		}

		.btn_reserCancel:hover {
			background-color: #af5d74;
		}

	.info-section {
		margin-left: 25%;
	}

	.info-text-2col {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		margin: 5px;
	}

	.info-text-left {
		text-align: justify;
		-moz-text-align-last: justify;
		text-align-last: justify;
		text-justify: distribute;
		color: #000;
		font-size: 16px;
		font-family: "微軟正黑體";
		font-weight: bold;
		-webkit-box-flex: 1.5;
		-ms-flex: 1.5;
		flex: 1.5;
		padding-top: 4px;
	}

	.info-text-right {
		text-align: left;
		color: #000;
		font-size: 16px;
		font-family: "微軟正黑體";
		-webkit-box-flex: 8;
		-ms-flex: 8;
		flex: 8;
		float: left;
	}

	.info-colon {
		color: #000;
		font-size: 16px;
		font-family: "微軟正黑體";
		font-weight: bold;
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		margin-right: 5%;
	}

	.info-text-left-1 {
		text-align: justify;
		-moz-text-align-last: justify;
		text-align-last: justify;
		text-justify: distribute;
		color: #000;
		font-size: 16px;
		font-family: "微軟正黑體";
		font-weight: bold;
		-webkit-box-flex: 3;
		-ms-flex: 3;
		flex: 3;
		padding-top: 4px;
	}

	.info-text-right-1 {
		text-align: left;
		color: #000;
		font-size: 16px;
		font-family: "微軟正黑體";
		-webkit-box-flex: 8;
		-ms-flex: 8;
		flex: 8;
		float: left;
	}

	.info-colon-1 {
		color: #000;
		font-size: 16px;
		font-family: "微軟正黑體";
		font-weight: bold;
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		margin-right: 1%;
		color: #0021c7;
	}

	/*修改按鈕*/
	.button_modify {
		font-family: "微軟正黑體";
		padding: 5px;
		margin-left: 10px;
		font-size: 16px;
		line-height: 16px;
		border: 2px;
		background-color: #d1c1f7;
		border-radius: 5px;
		cursor: pointer;
	}

		.button_modify:hover {
			background-color: #9986c4;
		}

	.sameAsReser {
		margin-left: 10px;
	}

	.saveChange {
		background-color: rgb(88, 78, 104);
		cursor: pointer;
		color: #fff;
		padding: 8px 10px;
		letter-spacing: 2px;
		font-size: 14px;
		margin-top: 35px;
		margin-right: 30%;
	}

		.saveChange:hover {
			background-color: rgb(71, 62, 85);
		}

	/*修改個資頁面的inputbox*/
	.inputboxModify {
		font-family: "微軟正黑體";
		width: 60%;
		outline: none;
		border: 1px solid #cccccc;
		font-size: 14px;
		padding: 5px 8px;
		border-radius: 4px;
		background-color: #fff;
	}

	/*QR*/
	.QR_Code {
		text-align: center;
		font-weight: bold;
		margin-top: 40px;
	}

	.qr_place {
		margin: 15px auto 40px;
		width: 15%;
	}

	.qr_text {
		font-family: 微軟正黑體;
	}

	/*預約下一筆*/
	#next_reser:before {
		background: url("images/icon/icon_next.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		top: -2px;
		vertical-align: middle;
		margin-right: 15px;
	}

    /*完成預約*/
    #home_reser:before {
        background: url("images/icon/bs_home.svg") center / 100%;
        content: "";
        display: inline-block;
        height: 30px;
        width: 30px;
        position: relative;
        vertical-align: middle;
    }

    .home_reser:before {
        background: url("images/icon/bs_home.svg") center / 100%;
        content: "";
        display: inline-block;
        height: 30px;
        width: 30px;
        position: relative;
        vertical-align: middle;
    }

	/*取消預約*/
	#cancel_reser:before {
		background: url("images/icon/icon_cancel.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		vertical-align: middle;
	}

	/*影印資訊*/
	#print_info:before {
		background: url("images/icon/icon_printer.svg") center / 100%;
		content: "";
		display: inline-block;
		height: 30px;
		width: 30px;
		position: relative;
		vertical-align: middle;
	}

	/* ↓inputbox系列↓ */
	.personal-page-inputbox {
		margin: 8% auto 2% 10%;
		width: 135%;
		height: 38px;
	}

	.question-page-inputbox {
		width: 100%;
		height: 36px;
		margin: 5% auto 1% -10%;
	}

	.inquiry-page-inputbox {
		margin-bottom: 4%;
		height: 40px;
		width: 100%;
		line-height: 50px;
	}
	/* ↑inputbox系列↑ */

	.inputbox-label {
		line-height: 2.5;
	}
	/* 問題頁面驗證樣式控制 */
	.verification-question {
		width: 290px;
		text-align: left;
		font-size: 14px;
		font-family: '微軟正黑體';
		color: #e24d4d;
		margin-left: -1.5rem;
	}

	/* 查詢頁面驗證樣式控制 */
	.verification-inquiry {
		text-align: left;
		font-size: 14px;
		font-family: '微軟正黑體';
		color: #e24d4d;
		margin: -.5rem auto auto .2rem;
	}

	/* 個人資料頁面驗證樣式控制 */
	.verification-personaldata {
		width: 270px;
		text-align: left;
		margin-left: 15%;
		font-size: 14px;
		font-family: "微軟正黑體";
		color: #2894ff;
	}
	/* 個人資料頁面按鈕及選取方塊設定 */
	.center-personaldata {
		text-align: center;
		margin: 4% auto 3%;
		font-family: "微軟正黑體";
		font-weight: bold;
		color: #3f3f3f;
	}
	/*填寫個人資料頁面radiobutton控制*/
	.personaldata-radiobutton {
		text-align: left;
		padding-left: 7%;
		font-family: "微軟正黑體";
		width: 370px;
	}

		.personaldata-radiobutton p {
			margin: 3.5% auto 3%;
			color: #5b5b5b;
			font-weight: bold;
			font-size: 15px;
		}

	/* 用於搜尋頁面設定表單標題字樣 */
	.item-personal-page {
		color: #4f4f4f;
		font-weight: bold;
		font-size: 16px;
		font-family: "微軟正黑體";
		padding-top: calc(0.375rem + 1px);
		padding-bottom: calc(0.375rem + 1px);
		margin-bottom: 0;
		line-height: 3;
	}

	.item-question-page {
		color: #4f4f4f;
		font-size: 16px;
		font-family: '微軟正黑體';
		padding-bottom: calc(0.375rem + 1px);
		text-align: right;
		margin: 3% 7% auto -2rem;
	}

    .item-submit-page {
        color: #4f4f4f;
        font-size: 16px;
        font-family: "微軟正黑體";
        line-height: 3;
    }

	/* 用於搜尋頁面設定按鈕樣式 */
	.CommonButton-inquiry {
		font-family: "微軟正黑體";
		width: 115px;
		height: 47.5px;
		margin: 5% 3% 2%;
		margin-top: 6.5%;
		font-size: 16px;
		background: -webkit-gradient(linear, left top, left bottom, from(rgb(245, 245, 245)), to(rgb(231, 231, 231)));
		background: -o-linear-gradient(rgb(245, 245, 245), rgb(231, 231, 231));
		background: linear-gradient(rgb(245, 245, 245), rgb(231, 231, 231));
		border: 1px solid #bdbdbd;
		border-radius: 0px;
		cursor: pointer;
		font-weight: normal;
		outline: none;
	}

		.CommonButton-inquiry:hover {
			background: -webkit-gradient(linear, left top, left bottom, from(rgb(197, 196, 196)), to(rgb(206, 206, 206)));
			background: -o-linear-gradient(rgb(197, 196, 196), rgb(206, 206, 206));
			background: linear-gradient(rgb(197, 196, 196), rgb(206, 206, 206));
		}
	/* 設定圓角框用於查詢頁面 */
	.formBorderInquiry {
		background-color: rgb(242, 240, 247);
		-webkit-box-shadow: 3px 5px 10px rgb(165, 160, 173);
		box-shadow: 3px 5px 10px rgb(165, 160, 173);
		position: relative;
		padding: 3.5rem 5rem 2.5rem;
		margin: 1rem auto;
		font-family: "微軟正黑體";
		width: 38rem;
		border-radius: 30px;
	}

	/* 設定圓角框用於選擇預約身分頁面 */
	.formBorderIdentity {
		background-color: rgb(242, 240, 247);
		-webkit-box-shadow: 3px 5px 10px rgb(165, 160, 173);
		box-shadow: 3px 5px 10px rgb(165, 160, 173);
		position: relative;
		padding: 3.5rem 5rem 2.5rem;
		margin: 1rem auto;
		font-family: "微軟正黑體";
		width: 38rem;
		border-radius: 30px;
	}

	/* 用於搜尋頁面設定表單標題字樣 */
	.item-inquiry {
		color: #4f4f4f;
		font-weight: bold;
		font-size: 17px;
		font-family: "微軟正黑體";
	}
	/* 查詢頁面標題文字 */
	.inquiryWord {
		text-align: left;
		font-family: 'Noto Sans TC', sans-serif;
		color: #2e597c;
		font-size: 36px;
		font-weight: normal;
		letter-spacing: .6rem;
		margin: auto auto 2rem 5.3em;
	}
	/* 查詢頁面標題文字底線 */
	.inquiry-line {
		border-bottom: solid #2e597c 4px;
		width: 55%;
	}

	/*月曆頁面*/
	.calenderSection {
		display: -webkit-inline-box;
		display: -ms-inline-flexbox;
		display: inline-flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		margin-left: 12rem;
	}

		.calenderSection p {
			font-family: 微軟正黑體;
			font-size: 24px;
			font-weight: bold;
			color: #624a77;
			margin-bottom: 30px;
		}

	.calenderLeft {
		width: 550px;
		margin-right: 50px;
	}

	.calenderRight {
		width: 400px;
		margin-right: 3rem;
	}

		.calenderRight p {
			margin-bottom: 70px;
		}

	.calenderConfirm {
		background-color: rgb(211, 224, 230);
		border-radius: 10px;
		font-family: 微軟正黑體;
		font-weight: bold;
		color: #324670;
		line-height: 30px;
		width: 100%;
		padding: 30px 30px 35px;
	}

    .calendarNote {
        font-family: 微軟正黑體;
        font-weight: normal;
        color:white;
        border-radius: 10px;
        padding: 7px;
        font-size: 12px;
    }

	/* @media screen and (max-width: 1434px) {
	.calenderRight {
		margin-top: 80px;
	}
}
	*/
	@media screen and (max-width: 1240px) {
		.calenderLeft {
			margin-right: 0;
			margin-bottom: 5rem;
			width: 75%;
		}
	}


	/*月曆的按鈕*/
	.btn_calender {
		font-family: 微軟正黑體;
		font-weight: normal;
		color: #fff;
		border-radius: 50px;
		background-color: #386182;
		cursor: pointer;
		margin: 40px auto 0;
		text-decoration: none;
	}

		.btn_calender:hover {
			background-color: #a7bed1;
		}

	.btn_calender_next {
		padding: 8px 24px;
		font-size: 14px;
		letter-spacing: 5px;
	}

	.btn_calender_cancel {
		padding: 8px 24px;
		font-size: 14px;
		margin-right: 20px;
	}

	.btn_calender_modify {
		padding: 8px 24px;
		font-size: 14px;
	}
	/*↑月曆頁面↑*/

	/*查詢預約狀態*/
	.reserStatus {
		width: 1000px;
		background-color: #efefef;
		font-family: 微軟正黑體;
		font-weight: bold;
		margin: -10px auto 0;
		padding: 0 5% 120px;
		position: relative;
		letter-spacing: 2px;
	}

	.statusList {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		margin-top: 30px;
	}

		.statusList li {
			font-family: 微軟正黑體;
			color: #fff;
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-orient: vertical;
			-webkit-box-direction: normal;
			-ms-flex-direction: column;
			flex-direction: column;
			-webkit-box-pack: center;
			-ms-flex-pack: center;
			justify-content: center;
			text-align: center;
			width: 100px;
			height: 100px;
			background-color: #a3b98e;
			border-radius: 50%;
			position: relative;
		}

			.statusList li + li {
				margin-left: 100px;
			}

				.statusList li + li::before {
					content: "";
					position: absolute;
					width: 100px;
					height: 5px;
					background-color: #a3b98e;
					top: 0;
					bottom: 0;
					right: 100px; /*照理說如果電腦沒壞掉不應該有這行存在*/
					margin: auto;
				}

			.statusList li.active ~ li {
				background-color: #acacac;
			}

				.statusList li.active ~ li::before {
					background-color: #acacac;
				}

	.reserCancel {
		font-family: 微軟正黑體;
		color: #fff;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		text-align: center;
		width: 100px;
		height: 100px;
		background-color: #daa6a6;
		border-radius: 50%;
		margin-top: 30px;
		position: relative;
		margin-left: 15%;
	}

.reserStatusCircle {
    font-family: 微軟正黑體;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    width: 130px;
    height: 130px;
    background-color: #daa6a6;
    border-radius: 50%;
    margin-top: 10px;
    position: relative;
    margin-left: 12%;
}

	.btn_showNameplate {
		font-family: "微軟正黑體";
		color: #35355a;
		padding: 10px 20px;
		font-size: 16px;
		background-color: #c1c1e0;
		border-radius: 20px;
		cursor: pointer;
		outline: none;
		position: absolute;
		top: 200px;
	}

		.btn_showNameplate:hover {
			background-color: #8f8fc4;
		}

	.requiredDoc {
		margin-top: 30px;
		letter-spacing: .8px;
	}

		.requiredDoc ul {
			margin-left: 20px;
		}

	.noticeList {
		margin-top: 40px;
		letter-spacing: .8px;
	}

		.noticeList ul {
			margin-left: 20px;
		}



.linkToAdmin {
    color: inherit; /* blue colors for links too */
    text-decoration: inherit; /* no underline */
}
/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////R W D 分 隔 線//////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*基本手機的RWD*/
@media screen and (max-width: 415px) {
    .nav {
			height: 80px;
		}

		.hamburger-list {
			height: calc(100vh - 80px);
			top: 80px;
			display: block;
		}

		.hamburger-btn {
			top: 15px;
			right: 15px;
		}

		.banner {
			height: 200px;
			margin-top: 80px;
			margin-bottom: -80px;
		}

		.banner-logo {
			display: none;
		}

		#teco-name {
			font-size: 16px;
			line-height: 20px;
			left: 0px;
			margin: 20px;
			top: 170px;
		}

		#rs-page {
			font-size: 35px;
			line-height: 40px;
			right: 0;
			margin: 20px;
			top: 40px;
		}

		.breadcrumb {
			padding: 30px 20px 10px;
			margin: 80px 0 30px;
		}

		footer {
			padding: 15px;
		}

			footer p {
				font-size: 12px;
				line-height: 24px;
				letter-spacing: 2px;
                margin:3px;
                padding:0px;
			}

		.step img {
			width: 90%;
		}

        .background02 {
            padding: 30px;
        }

        .background04 {
            padding: 30px;
        }

        .background05 {
            padding: 30px;
        }

        .backgroundInquery {
            padding: 30px;
        }

		.statement-border {
			padding: 20px;
			margin: 30px 20px;
		}

		#btn_imc {
			margin-top: 20px;
		}

		.btn_type3 {
			width: 90%;
		}

		.btn_wrap3 {
			width: 75%;
		}

		.btn_en {
			font-size: 13px;
		}

		.btn_en_small {
			font-size: 13px;
			line-height: 13px;
		}

		.formBorder {
			position: relative;
			padding: 2rem;
			margin: 1rem 0px 0;
			text-align: left;
			width: auto;
		}

		.formBorderAuth {
			width: 95%;
			padding: 15% 8%;
		}

		.authWord {
			font-size: 26px;
			letter-spacing: 0.6rem;
			margin-bottom: 10%;
		}

		.ohNo {
			width: 90%;
			padding: 15% 20px;
			margin: 0 auto;
		}

		#ohNo_h1 {
			margin: 0 auto !important;
			font-size: 60px;
			top: -40px;
			left: 20%;
		}

		.ohNo h2 {
			font-size: 20px;
		}

		.ohNo h3 {
			font-size: 16px;
		}

		.contactMe {
			width: 100%;
			font-size: 16px;
			padding: 15px;
		}

		#phoneContact:before {
			height: 25px;
			width: 25px;
			margin-right: 8px;
		}

		#emailContact:before {
			height: 25px;
			width: 25px;
			margin-right: 10px;
		}

		.fullScreenRectangle {
			height: 60px;
			font-size: 20px;
			padding: 16px;
		}

		#reserDone:before {
			height: 25px;
			width: 25px;
			margin-right: 15px;
			bottom: 2px;
		}

		.suggest {
			margin: 0 20px 0 20px;
			font-size: 14px;
			line-height: 28px;
			color: rgb(36, 52, 71);
		}

			.suggest li {
				line-height: 20px;
				margin: 10px;
				margin: 10px;
				color: #000;
			}

		.reserInfo {
			width: 90%;
			padding-top: 60px;
		}

		.info-section {
			margin-left: 2%;
		}

		.info-text-left {
			-webkit-box-flex: 4;
			-ms-flex: 4;
			flex: 4;
		}

		.info-text-right {
			-webkit-box-flex: 9;
			-ms-flex: 9;
			flex: 9;
		}

		.info-colon {
			-webkit-box-flex: 0.5;
			-ms-flex: 0.5;
			flex: 0.5;
			margin-right: 2%;
		}

		#qr_place {
			margin: 40px auto 30px;
			width: 50%;
		}

		.btn_reserCancel {
			font-size: 12px;
			right: 15px;
			top: 15px;
			line-height: 28px;
		}

			.btn_reserCancel:before {
				height: 18px;
				width: 18px;
				top: -0.1em;
				margin-right: 2px;
			}

		.reserStatus {
			width: 90%;
			padding-bottom: 40px;
		}

		.btn_showNameplate {
			font-size: 14px;
			top: 278px;
			left: 180px;
		}

		.inquiryWord {
			font-size: 28px;
			margin: auto auto 14px 20px;
		}

		.inquiry-line {
			width: 75%;
		}

        .formBorderInquiry {
            position: relative;
            padding: 1.6rem;
            margin: 1rem -.5% 0;
            width: auto;
        }

		.formBorderIdentity {
			position: relative;
			padding: 1.6rem;
			margin: 1rem -.5% 0;
			width: auto;
		}

		.identity-title {
			font-size: 17px;
		}

		.fieldsetBorder-identity p {
			padding-left: 3%;
			margin-top: 5.5%;
		}

		.col-sm-4 {
			padding: 0;
		}

		.item-inquiry {
			margin: 0;
		}

		.item-question-page {
			margin: auto 1rem auto auto;
			text-align: left;
		}

		.inquiry-page-inputbox {
			margin: 7% auto;
			height: 50px;
			width: 100%;
		}

		.personal-page-inputbox {
			margin: 0% auto 2%;
			height: 40px;
			width: 105%;
		}

		.verification-question {
			width: 270px;
			margin-left: -.3rem;
		}

		.calenderSection {
			margin-left: 20px;
			width: 95%;
		}

			.calenderSection p {
				font-size: 20px;
			}

		.calenderLeft {
			width: 95%;
			margin-right: 0;
		}

		.calenderRight {
			width: 95%;
			margin-right: 0;
		}

			.calenderRight p {
				margin-bottom: 40px;
			}

		.btn_calender {
			margin-right: 0;
		}

		.btn_calender_cancel {
			padding: 8px 16px;
			margin-right: 14px;
		}

		.btn_calender_modify {
			padding: 8px 16px;
		}

		.statusList {
			-webkit-box-orient: vertical;
			-webkit-box-direction: normal;
			-ms-flex-direction: column;
			flex-direction: column;
			margin-left: 15%;
		}

			.statusList li {
				width: 90px;
				height: 90px;
				font-size: 14px;
			}

				.statusList li + li {
					/*margin-left: 90px; */
					margin-left: 0;
					margin-top: 90px;
				}

					.statusList li + li::before {
						/*width: 90px;
    right: 90px; 這邊註解起來都是橫向觀看時的設定*/ /*照理說如果電腦沒壞掉不應該有這行存在*/
						width: 5px;
						height: 90px;
						right: 42.5px;
						bottom: 180px;
					}

		#btnBack, #btnConfirm, #MainContent_btnConfirm {
			margin: 10px 3% 0;
			width: 40%;
		}

		.question-page-inputbox {
			width: 100%;
			height: 36px;
			margin: 2.5% auto 2.5%;
		}

		.description-PersonalDataBooker {
			margin: -10px auto 20px;
			width: 105%;
			text-align: left;
		}

        .descriptionBlack-PersonalDataBooker {
            margin: -10px auto 20px;
            width: 100%;
            text-align: left;
        }

		.smallWord {
			margin: auto auto 1% 1.5%;
		}

		.smallWord-long {
			width: 120%;
		}
	}

	/*iPad平板尺寸RWD*/
	@media screen and (max-width: 768px) and (min-width: 416px) {
		.nav {
			height: 80px;
		}

		.hamburger-btn {
			top: 15px;
			right: 15px;
		}

		.hamburger-list {
			height: calc(100vh - 80px);
			top: 80px;
		}

		.banner {
			height: 300px;
			margin-top: 80px;
			margin-bottom: -80px;
		}

		.banner-logo {
			display: none;
		}

		#teco-name {
			font-size: 24px;
			line-height: 30px;
			left: 0px;
			margin: 35px;
			top: 230px;
		}

		#rs-page {
			font-size: 70px;
			line-height: 70px;
			right: 0;
			margin: 20px 40px;
			top: 40px;
		}

		.breadcrumb {
			padding: 30px 20px 10px 0px;
			margin: 80px auto 30px;
			margin-left: 35px;
		}

		.step img {
			width: 60%;
		}

		.statement-border {
			padding: 8% 5%;
			margin: 0 10% 7%;
		}

		footer {
			margin-top: 10%;
		}

		.button-section {
			width: 80%;
		}

		#btn_section_short {
			width: 50%;
		}

		.suggest {
			margin: 1rem 35px;
		}

		.reserInfo {
			width: 90%;
			padding-top: 40px;
		}

		.info-section {
			margin: 0 15% 0 25%;
		}

		.info-text-left {
			-webkit-box-flex: 1.2;
			-ms-flex: 1.2;
			flex: 1.2;
		}

		.info-text-right {
			-webkit-box-flex: 4;
			-ms-flex: 4;
			flex: 4;
		}

		.info-colon {
			-webkit-box-flex: 1;
			-ms-flex: 1;
			flex: 1;
			margin-right: 2%;
		}

		#qr_place {
			margin: 40px auto 30px;
			width: 30%;
		}

		.reserStatus {
			width: 90%;
		}

		.formBorder {
			position: relative;
			text-align: left;
			width: auto;
		}

		.formBorderInquiry {
			position: relative;
			padding: 3rem 2rem 2rem;
			margin: 1rem auto 5rem;
			width: auto;
		}

		.formBorderIdentity {
			position: relative;
			padding: 2rem 1.7rem;
			margin: 1rem auto;
			width: auto;
		}

		.formBorder-PersonalDataBooker {
			padding: 2rem 0rem 2rem 1.7rem !important;
		}

		.inquiry-page-inputbox {
			margin: 0 0 4% 2%;
			height: 45px;
			width: 100%;
		}

		.inquiryWord {
			text-align: left;
			font-family: "Noto Sans TC", sans-serif;
			color: #2e597c;
			font-size: 36px;
			font-weight: normal;
			letter-spacing: 0.6rem;
			margin: auto auto 2% 1em;
		}

		.personal-page-inputbox {
			margin: 3% auto 2% 5%;
			height: 40px;
			width: 90%;
		}

		.smallWord {
			width: 270px;
			text-align: left;
			margin: auto auto 1% 10%;
		}

		.verification-personaldata {
			width: 270px;
			text-align: left;
			margin-left: 10%;
		}

		.verification-question {
			margin-left: -1rem;
		}

		.ohNo {
			width: 90%;
			padding: 10% 20px;
		}

		#ohNo_h1 {
			margin: 0 auto !important;
			font-size: 100px;
			top: -60px;
			left: 25%;
		}

		.ohNo h2 {
			font-size: 30px;
		}

		.ohNo h3 {
			font-size: 18px;
		}

		.contactMe {
			width: 55%;
			font-size: 18px;
			padding: 16px 20px;
		}

		#phoneContact:before {
			height: 30px;
			width: 30px;
			margin-right: 10px;
		}

		#emailContact:before {
			height: 30px;
			width: 30px;
			margin-right: 12px;
		}

		.formBorderAuth {
			width: 100%;
			margin-bottom: 0;
			padding: 10% 8%;
		}

		.calenderSection {
			margin-left: 35px;
			width: 90%;
		}

			.calenderSection p {
				font-size: 20px;
			}

		.calenderLeft {
			width: 95%;
			margin-right: 0;
		}

		.calenderRight {
			width: 95%;
			margin-right: 0;
		}

		.calenderConfirm {
			width: 80%;
			margin: auto;
		}

		.question-page-inputbox {
			width: 100%;
			height: 36px;
			margin: 1% auto 1% -1rem;
		}

		.item-question-page {
			margin: .5rem;
			text-align: left;
		}

		.description-PersonalDataBooker {
			margin: -10px auto 20px;
			width: 90%;
			text-align: left;
		}

        .descriptionBlack-PersonalDataBooker {
            margin: -10px auto 20px;
            width: 90%;
            text-align: left;
        }
	}
.descriptionBlack-PersonalDataBooker {
    margin: -10px auto 20px;
    width: 90%;
    text-align: left;
}
	/*iPad Pro平板尺寸RWD*/
	@media screen and (max-width: 1120px /*1023*/ ) and (min-width: 769px) {
		#teco-name{
			left: 5rem;
		}

		#rs-page{
			right: 5rem;
		}

		.statement-border{
			margin: 40px 7rem;
		}
		
		.formBorderInquiry {
			position: relative;
			padding: 3rem 2rem 2rem;
			margin: 1rem auto;
			width: 35rem;
		}

		.formBorderIdentity {
			position: relative;
			padding: 2rem;
			margin: 1rem auto;
			width: 35rem;
		}

		.inquiry-page-inputbox {
			margin: 0 4% 4%;
			height: 45px;
			width: 100%;
		}

		.formBorder {
			position: relative;
			padding: 3rem;
			text-align: right;
			width: 45rem;
		}

		.formBorderAuth {
			width: 75%;
		}

		.personal-page-inputbox {
			margin: 6% auto 2% 10%;
			height: 40px;
			width: 18rem;
		}

		.item-inquiry {
			padding-left: 7%;
		}

		.item-question-page {
			margin: .5rem;
			text-align: left;
		}

		.question-page-inputbox {
			width: 100%;
			height: 36px;
			margin: 2.5% auto 2.5% -10%;
		}

		/*.verification-question {
        margin-left: .5rem;
    }*/
	}

	/*更小手機的RWD*/
	@media screen and (max-width: 350px) {
		#rs-page {
			margin: 10px 20px;
		}

		#teco-name {
			margin: 10px 20px;
		}

		.info-text-left {
			-webkit-box-flex: 5.5;
			-ms-flex: 5.5;
			flex: 5.5;
		}

		.statusList {
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-orient: vertical;
			-webkit-box-direction: normal;
			-ms-flex-direction: column;
			flex-direction: column;
			-webkit-box-pack: center;
			-ms-flex-pack: center;
			justify-content: center;
			margin-left: 15%;
		}

			.statusList li {
				width: 80px;
				height: 80px;
				font-size: 14px;
			}

				.statusList li + li {
					/*margin-left: 80px; */
					margin-left: 0;
					margin-top: 80px;
				}

					.statusList li + li::before {
						/*width: 80px;
    right: 80px; 這邊註解起來都是橫向觀看時的設定*/
						width: 5px;
						height: 80px;
						right: 37.5px;
						bottom: 160px;
					}

		.btn_type2 {
			margin: 15px 0;
		}

		.btn_type3 {
			margin: 10px 0;
			padding: 0.8em 0.6em;
			width: 280px;
		}

		.btn_ch {
			font-size: 14px;
		}

		.btn_en {
			font-size: 12px;
		}

		.btn_en_small {
			font-size: 12px;
			line-height: 12px;
		}

		#btn_imc:before {
			margin-right: 10px;
		}

		#ohNo_h1 {
			left: 15%;
		}

		.btn_showNameplate {
			top: 253px;
			left: 150px;
		}
	}

	/*平板特別尺寸RWD*/
	@media screen and (max-width: 769px) and (min-width: 575px) {
        .formBorderInquiry {
            position: relative;
            padding: 3rem 2rem 2rem;
            width: auto;
            margin: 1rem 3rem 3rem;
        }

		.formBorderIdentity {
			position: relative;
			padding: 2rem;
			margin: 1rem auto;
			width: auto;
		}

		.inquiry-page-inputbox {
			margin: 0 0 4% 2%;
			height: 40px;
			width: 100%;
		}

		.formBorder {
			position: relative;
			padding: 2rem 0rem;
			margin: 1rem 0px 0;
			text-align: center;
			width: auto;
		}

		.personal-page-inputbox {
			margin: 6% auto 2% 5%;
			height: 40px;
			width: 175%;
		}
	}

	/*螢幕大於1600px時*/
	@media screen and (min-width: 1600px) {
		.question-page-inputbox {
			width: 270px;
			height: 36px;
			margin: 2.5% auto 2.5% -3rem;
		}

		.item-question-page {
			margin: 1% 15% auto -5rem;
		}

		.verification-question {
			width: 300px;
			margin-left: -3rem;
		}
	}

	/*螢幕小於370px時*/
	@media screen and (max-width: 370px) {
		.question-page-inputbox {
			width: 85%;
			height: 36px;
			margin: 2.5% auto 2.5%;
		}
	}

	/*RWD微調************************************************************************/
	@media screen and (min-width: 1575px) {
		.info-text-left {
			-webkit-box-flex: 2;
			-ms-flex: 2;
			flex: 2;
		}
	}

	@media screen and (min-width: 1120px) and (max-width: 1250px) {
		#teco-name {
			left: 5rem;
		}

		#rs-page {
			right: 5rem;
		}

		.statement-border {
			margin: 40px 7rem;
		}
	}

	@media screen and (min-width: 768px) and (max-width: 1030px) {
		#teco-name {
			margin-right: 3rem;
			line-height: 50px;
		}

		#rs-page {
			font-size: 80px;
			line-height: 80px;
		}

		.statement-border {
			margin: 40px 4rem;
		}
	}

	@media screen and (min-width: 416px) and (max-width: 575px) {
		.smallWord {
			margin: auto auto 1% 3%;
		}

		.verification-personaldata {
			margin-left: 3%;
		}

		.formBorder {
			padding: 1rem 1.7rem;
			margin: 1rem -25px 0;
			width: 120%;
		}

		.personal-page-inputbox {
			margin: 0% auto 2%;
			width: 100%;
		}
	}

	@media screen and (min-width: 416px) and (max-width: 565px){
		#teco-name {
			font-size: 20px;
			line-height: 30px;
			left: 0px;
			margin: 20px 35px 0;
		}
		#rs-page {
			font-size: 50px;
			line-height: 60px;
		}
	}

/*按下送出後，背景反白*/
.overlay {
	background: #e9e9e9;
	left: 0;
	opacity: 0.5;
}


	ul.a {
		margin-left: 0.70em;
		list-style-position: inside;
		list-style: square;
	}
