/* CSS Document */
@charset "utf-8";
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
*{
	/*解除padding跟寬高的關係*/
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-ms-box-sizing:border-box;
	box-sizing:border-box;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

input,textarea {
	outline: none; 
}

a {
	outline:none; /* for Firefox Google Chrome  */
    behavior:expression(this.onFocus=this.blur()); /* for IE */
	color: #050505;
}
.RexCB {
	clear:both;
	height:0px;
}
/********************_basic**********************/
/* 載入 */
#web-loading {
	position: fixed;
	z-index: 9999;
	width: 100vw;
	height: 100vh;
	top: 0;
	left: 0;
	text-align: center;
	font-size: 0.9rem;
	color: #595758;
	background-color: #FFF;
	background-image: url(../../favicon-48.png) !important;
	background-position: center center;
	background-repeat: no-repeat;
	display: none;
}

.web-loader {
	border:10px solid #f3f3f3;
	border-radius:50%;
	border-top:10px solid #33CC00;
	width:80px;
	height:80px;
	-webkit-animation:spin 2s linear infinite; /* Safari */
	animation:spin 2s linear infinite;
	position:absolute;
	top:50%;
	right:50%;
	margin-top:-40px;
	margin-right:-40px;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform:rotate(0deg); }
  100% { -webkit-transform:rotate(360deg); }
}

@keyframes spin {
  0% { transform:rotate(0deg); }
  100% { transform:rotate(360deg); }
}

#wrapper {
	width: 100%;
	height: 100%;
	bottom: 0;
	/*網頁內設定999以內 */
	z-index: 999;
}
.area-box {
	width:100%;
}

.area-1220 {
	margin-right:auto;
	margin-left:auto;
	max-width:1220px;
	width:100%;
}

.area-970 {
	margin-right:auto;
	margin-left:auto;
	max-width:970px;
	width:100%;
}

.area-850 {
	margin-right:auto;
	margin-left:auto;
	max-width:850px;
	width:100%;
}

.area-700 {
	margin-right:auto;
	margin-left:auto;
	max-width:700px;
	width:100%;
}

.area-25 {
	padding-right:2.5%;
	padding-left:2.5%;
}

#toTop {
	height: 50px;
	width: 50px;
	position: fixed;
	right: 10px;
	bottom: 20px;
	display: none;
	cursor: pointer;
	z-index: 999;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	overflow: hidden;
	background-color: #FFF;
	border: 2px solid #FFF;

	-o-transition: background-color .30s linear;
	-webkit-transition: background-color .30s linear;
	-moz-transition: background-color .30s linear;
	transition: background-color .30s linear;
}

#toTop svg{
	display: block;
	height: auto;
	width: 100%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	overflow: hidden;
}

#toTop:hover{   
	background-color: #000;
	border: 2px solid #000;
}
#toTop:hover path{   
	fill: #FFF;
}

.no-wrap{
	white-space: nowrap;
	overflow: hidden;
	text-overflow : ellipsis;
}

.v-h {
    position: absolute !important;
    height: 1px; width: 1px; 
    overflow: hidden;
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px);
}

.fix-ie{
	border: 1px solid #FF0;
	position: fixed;
	top: 0px;
	right: 0px;
	z-index: 9999;
	padding-top: 8px;
	padding-right: 15px;
	padding-bottom: 8px;
	padding-left: 15px;
	background-color: #FF3;
	font-size: 12px;
	color: #000;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-left-radius: 5px;
}

.gray-color {
	color: #999 !important;
}

.red-color {
	color: #F00 !important;
}
.blue-color {
	color: #039 !important;
}
.orange-color {
	color: #F90 !important;
}

/* 特效CSS */
/*----- 圖片原地放大 ----*/
.SizePic {overflow:hidden;}
.SizePic img {transform:scale(1,1);transition: all 0.3s ease-out;}
.SizePic img:hover {transform:scale(1.05,1.05);}

.fa-fw {
    text-align: center;
    width: 1.25em;
	color:#7b7b7b;
}

.w-sm-50 {
	width: 50% !important;	
}

.max-screen {
	max-width: 1920px !important;
	padding-right: 0px !important;
	padding-left: 0px !important;
}

/*去除ie edge的密碼框出現的小眼睛*/
input[type="password"]::-ms-reveal{
	display: none;
}
input[type="password"]::-ms-clear{
	display: none;
}
input[type="password"]::-o-clear{
	display: none;
}

/* ==平板電腦====================================== */
@media screen and (min-width: 576px) and (max-width: 991px) {

	html, body {
		width:100%;
		min-height:100%;
	}

	#wrapper {
		width:100%;
		max-width:100%;
		min-height:100%;
		bottom:0;
	}

	.w-sm-50 {
		width: auto !important;	
	}
}
/* ==手機電腦====================================== */
@media screen and (max-width:575px) {
	
	html, body {
		width:100%;
		min-height:100%;
	}

	#wrapper {
		width:100%;
		max-width:100%;
		min-height:100%;
		bottom:0;
	}

	.w-sm-50 {
		width: auto !important;
	}

}

#test {
	padding-top: 10px;
	padding-bottom: 10px;
	margin-left: 5px;
	background-size: 100% auto;
	background-position: center top;
	vertical-align: middle;
	display: inline-block;
	height: 100% !important;
	padding-left: 10%;
	display: block;
	text-align: center;
	background-color: transparent;
	margin-right: 5px;
	min-height: 300px;
	background-position: 5px 5px;
	background-size: cover;
	text-decoration: underline;
	width: 100%;
	height: auto;
	float: left;
	line-height: 1px;
	z-index: 999;
	font-size: 2rem;
	cursor: pointer;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #D8D8D8;
	border-top-width: 1px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-left-style: solid;
	border-top-color: #D8D8D8;
	border-right-color: #D8D8D8;
	border-left-color: #D8D8D8;
	-webkit-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	text-transform: uppercase;
　/*所有字母皆為大寫*/
	text-transform:lowercase;　/*所有字母皆為小寫*/
	text-transform:capitalize;　/*第一個字母大寫，其他字母小寫*/	
	margin-bottom: 3px;	
	background-image: url(Smarty/tplate-10015-basic/images/idx-icon.svg);
	background-repeat: no-repeat;
}