@charset "utf-8";
/* CSS Document */
body {
	background: #ECE6DD;
	color: #303030;
	font-family: "微軟正黑體", Arial, "新細明體", "Helvetica Neue", Helvetica, sans-serif;
	font-size: 13px;
}
ul,ol{list-style-type: none; margin:0; padding:0;}
img,a img{border:none;}
.clearfix:after,.clearfloat {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.bg-wrap {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 0;
    width:100%;
}
.img-thumbnail{max-width: 100%;}
.stage{
    position:relative;
    width:100%;
    height:auto;
    margin:20px auto;
    padding:0;
    top:0;
    left:0;
    z-index: 100;
    display:block;
}
.webtitle{
	width:320px;
	height:170px;
    position:relative;
	top:0;
	left:0;
    margin:40px auto 30px auto;
	z-index: 500;
}
.webtitle-text{
	width:60px;
	height:60px;
	background-image:url(../images/welcome-text.png);
	background-repeat:no-repeat;
	position:absolute;
}
.webtitle-text-1{ 
	background-position:0 0;
	margin-top:40px;
	margin-left:2px;
}
.webtitle-text-2{ 
	background-position:-60px 0;
	margin-top:10px;
	margin-left:83px;
}
.webtitle-text-3{ 
	background-position:-120px 0;
	margin-top:10px;
	margin-left:170px;
}
.webtitle-text-4{ 
	background-position:-180px 0;
	margin-top:40px;
	margin-left:250px;
}
.webtitle-text-5{ 
	background-position:-240px 0;
	margin-top:107px;
	margin-left:60px;
}
.webtitle-text-6{ 
	background-position:-300px 0;
	margin-top:107px;
	margin-left:122px;
}
.webtitle-text-7{ 
	background-position:-360px 0;
	margin-top:107px;
	margin-left:188px;
}
.logo-wrap{
	width:100%;
	height:auto;
	position:relative;
	margin:60px auto 0 auto;
	padding:0;
	z-index: 600;
	text-align: center;
}
.logo-wrap a{
	display:block;
}
.logo-1group,.logo-2group{
	width:100%;
	height:auto;
	float: none;
	display:block;
	padding:0;
}
.logo-line{
	width:250px;
	height:5px;
	float: none;
	display:block;
	margin:30px auto;
	padding:0;
	background-image:url(../images/logo-line-h.png);
	background-repeat: no-repeat;
	background-position: center 0;
}
.logo-elem{
	margin:10px auto 0 auto;
}


.bgwidth {
    width: 100%;
}

.bgheight {
    height: 100%;
}

@media (min-width: 768px) {
	.stage {
	    position:absolute;
	    top:45%;
	    left:50%;
	    margin: -226px auto auto -540px;
	    width: 1080px;
	    height:452px;
	}
	.webtitle{
		width:330px;
		height:170px;
		position:absolute;
		top:25px;
		left:50%;
		margin-top:0;
		margin-bottom:60px;
		margin-left:-165px;
	}
	.logo-wrap{
		width:100%;
		height:250px;
		position:relative;
		margin:220px 0 0 0;
		padding:0;
	}
	.logo-1group{
		float: left;
	/*width:460px;*/
		height:250px;
		padding-left:0;
		padding-right:36px;
	}
	.logo-2group{
		float: left;
		width:490px;
		height:250px;
		padding-left:0;
		padding-right:0;
	}
	.logo-line{
		float: left;
		width:5px;
		height:250px;
		margin:0 25px;
		background-image:url(../images/logo-line.png);
	}
	.logo-elem{
		margin:40px auto 0 auto;
		padding:0;
		width:100%;
	}	
	.img-thumbnail{max-width: none;}

}