body{
	font-family: '微軟正黑體', "Helvetica Neue", Helvetica, Arial, sans-serif;
	}
header{
	text-align:center;
	padding:15px 0;
	box-shadow:0 0 10px #888;
	background-color:#fff;
	position:absolute;
	width:100%;
	}
header img{
	width:130px;
	}
header img, header h1{
	display:inline-block;
	}
header h1{
	color:#000;
	font-size:160%;
	font-weight:800;
	margin-left:10px;
	margin-bottom:0;
	vertical-align:bottom;
	}
main{
	padding-top:105px;
	}
.stepHeader{
	padding:25px 0 20px;
	background-color:#e9e0d9;
	}
.tabs{
	width:350px;
	text-align:center;
	margin:0 auto;
	padding-left:0;
	}
.tabs li{
	width:40%;
  	list-style:none;
  	margin:0 10px;  
  	display:inline-block;
	}
.tabs li:first-child{
	position:relative;
	}
.tabs li:first-child::after{
	content:" "; 
	border-top:10px solid transparent;
	border-bottom:10px solid transparent;
	border-left:15px solid #fff;
	display:inline-block;
	position:absolute;
	right:-22px;
	top:15px;
	}
.tabs li a{
	color:#999;
	font-family:Arial;
	font-size:110%;
	text-decoration:none;
	display:block;
	padding:10px;
	margin-bottom:8px;	
	background-color:#dad3ce;
	border-radius:3px;
	}
.tabs li a:hover{
	color:#e40;
	background-color:#fff;	
	}
.tabs li.active a{
	color:#e40;
	background-color:#fff;
	}
.tabs .active div{
	color:#000;
	}
.tabs div{
	color:#999;
	}
.stepContainer{
	clear: left;
	}
.stepContainer h3{
	color:#e40;
	font-size:170%;
	margin-bottom:30px;
	}
.stepContainer h4{
	font-size:120%;
	font-weight:bold;
	}
.stepContainer input{
	border:none;
	}
.stepContainer label{
	width:15%;
	}
.stepContainer #tab2 label{
	width:12%;
	}
.stepContainer input{
	width:80%;
	}
.stepContainer .form-check input{
	width:auto;
	}
.checkWrap label{
	width:135px;
	}
.checkWrap .form-check-inline label{
	width:auto;
	}
.noteWrap .form-control{
	width:80%;
	display:inline-block;
	padding:0 0 .75rem;
	border:none;
	}
.stepContainer .codeBar input{
	width:auto;
	}
.stepContainer .form-group{
	margin-bottom:2rem;
	}
.stepContainer .form-group.uploadFileWrap{
	margin-bottom:10px;
	}
.form-group.underLine, .noteWrap{
	border-bottom:1px solid #bbb;
	}
.stepContainer em{
	color:#c00;
	}
.stepContainer small{
	color:#666;
	padding-left:102px;
	padding-bottom:10px;
	}
.noteWrap label{
	vertical-align:top;
	}
.checkWrap{
	margin-left:-15px;
	}
.uploadFileWrap .form-control-file{
	display:inline-block;
	width:auto;
	}
.uploadFileNote{
	font-size:80%;
	font-weight:400;
	color:#666;
	padding-left:140px;
	}
.btn.stepBtn{
	width:100%;
	margin:15px 0;
	}
.codeBar img{
	height:30px;
	}
.btnRecode{
	border:none;
	background-color:transparent;
	}
#tab1, .tab2Content{
	padding:30px 0 60px;
	}
.tab2Header{
	padding:35px 0 15px;
	background-color:#eee;
	}
.tab2Header ol{
	padding-left:15px;
	}
#tab2 li{
	line-height:2em;
	}
footer{
	padding:30px 0;
	background-color:#ccc;
	}
footer .logo{
	width:120px;
	margin-bottom:5px;
	}
footer p{
	margin-bottom:0.4rem;
	}
.brandFooter{
	font-size:105%;
	font-weight:bold;
	}
footer .tel, footer .fax{
	display:inline-block;
	}
.footerData{
	margin-top:77px;
	}
.container{
	width:800px;
	}
.toiletWrap{
	width:50%;
	}

/* ====================================================================================================================
 * 水社總合商場一樓 Start
 * ====================================================================================================================*/

.roomAreaWrap{
	padding:150px 0 30px;
	}
.leftArea, .centerArea, .rightArea{
	border:1px solid #aaa;
	}
.icon-col{
	width:100%;
	text-align:center;
	}
.roomAreaWrap .form-check-inline{
	margin-right:0;
	}
/* ====================================================================================================================
 * Mobile Start
 * ====================================================================================================================*/
@media screen and (max-width: 960px) {
	.checkWrap label{
		width:125px;
		}
	.stepContainer #tab2 label{
		width:13%;
		}
	.stepContainer small{
		padding-left:100px;
		}
	}
@media screen and (max-width: 768px) {
	.checkWrap label{
		width:125px;
		}
	.stepContainer #tab2 label{
		width:13%;
		}
	.stepContainer small{
		padding-left:100px;
		}
	footer{
		text-align:center;
		}
	footer .col-md-6{
		display:block;
		flex:inherit;
		max-width:100%;
		}
	.footerData{
		margin-top:0;
		}
	.footerData{
		text-align:left;
		width:370px;
		margin:0 auto;
		}
	.footerData span{
		width:120px;
		display:inline-block;
		}
	}
@media screen and (max-width: 766px) {
	.container{
		max-width:85%;
		}
	.stepContainer label{
		width:17%;
		}
	.stepContainer input{
		width:75%;
		}
	.checkWrap label{
		width:19%;
		}
	.stepContainer #tab2 label{
		width:15%;
		}
	.stepContainer small{
		padding-left:105px;
		}
	}
@media screen and (max-width: 740px) {
	.stepContainer label{
		width:18%;
		}
	.checkWrap label{
		width:20%;
		}
	.stepContainer small{
		padding-left:100px;		
		}	
	}
@media screen and (max-width: 667px) {
	.stepContainer label{
		width:20%;
		}
	.stepContainer #tab2 label{
		width:17%;
		}
	.checkWrap label{
		width:100%;
		display:block;
		}
	.checkWrap .form-check-inline{
		padding-left:15px;
		}
	.stepContainer .noteWrap label, .noteWrap .form-control{
		width:100%;
		}
	}
@media screen and (max-width: 568px) {
	.stepContainer label{
		width:23%;
		}
	.stepContainer #tab2 label{
		width:20%;
		}
	.checkWrap .form-check-inline{
		margin-right:0;
		}
	.uploadFileNote{
		padding-left:15px;
		}
	.stepContainer small{
		padding-left:105px;
		}
	}
@media screen and (max-width: 414px) {
	.stepContainer label, .stepContainer #tab2 label{
		width:100%;
		display:block;
		}
	.stepContainer small{
		padding-left:0;
		}
	}
@media screen and (max-width: 360px) {
	.stepContainer .codeBar input{
		width:130px;
		}
	.footerData{
		text-align:center;
		width:auto;
		}
	.footerData span{
		width:100%;
		display:block;
		}
	}