@charset "big5";

body{
	margin:0px;
	padding:0px;
	background: #616161 url(images/bg.jpg) center top fixed;
	font-family:"儷宋 Pro","LiSong Pro","新細明體", "PMingLiU", "細明體", "MingLiU",Verdana, Arial, Helvetica,sans-serif;
}

.basic-font{
	font-size:12pt;
	line-height:1.4em;
	font-weight: bold;
}
.basic-font p{
	padding:0 0 0.6em 0;
	text-indent: 2em;
}
.basic-font p.noindent{
	text-indent: 0em;
}
.basic-font p.largefont{
	font-size: 1.2em;
	font-weight: bolder;
	line-height:1.6em;
}
.basic-font p.smallfont{
	font-size:0.8em;
}

.font-kai{
	font-family:"標楷體", "DFKai-sb","BiauKai";
}

.font-ming{
	font-family:"微軟正黑體","Microsoft JhengHei","儷黑 Pro","LiHei Pro Medium",Verdana, Arial, Helvetica,sans-serif;
}


.wrapper{
	width: 1000px;
	margin:0 auto;
	
	background: #FFFFFF;
	
	-webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.55);
	-moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.55);
	box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.55);
}


/***************/

.intro{
	position: relative;
}
.intro .book{
	position: absolute;
	right:100px;
	top:50px;
}
.intro .book p{
	padding-left:10px;
}

a.shopcart{
	display:block;
	width:160px;
	height:28px;
	text-align: center;
	text-decoration: none;
	background: #00479d;
	color:#FFFFFF;
	font-size: 13px;
	margin-top:12px;
	line-height: 28px;
	border-radius: 4px 4px 4px 4px;
	-moz-border-radius: 4px 4px 4px 4px;
	-webkit-border-radius: 4px 4px 4px 4px;
	border: 0px solid #000000;
}

a.shopcart:hover{
	background: #1465c1;
}

/***************/

.author{
	position: relative;	
}


/***************/

.brief{
	background: url(images/brief_sec.jpg) no-repeat;
	position: relative;
}
.brief .txt{
	position: absolute;
	width:800px;
	height:430px;
	z-index: 9;
	left:100px;
	top:145px;
	overflow: auto;
}
.brief .inline-box{
	height:380px;
}

.good{
	position: relative;
	background: url(images/good-2.jpg) no-repeat;
	width: 100%;
	height: 470px;
	overflow: hidden;
}
.good a.btn{
	display: block;
	position: absolute;
	width: 97px;
	height: 24px;
	background: url(images/good-btn.png) no-repeat;
	z-index: 9;
	text-indent: -9999px;
}
.good a.btn:hover{
	background-position-y: -24px;
}
.good a.btn1{
	left:620px;
	top: 56px;
}
.good a.btn2{
	left:435px;
	top: 150px;
}
.good a.btn3{
	left:460px;
	top: 248px;
}
.good a.btn4{
	left:280px;
	top: 341px;
}
.good a.btn5{
	left:257px;
	top: 432px;
}


.preview{
	position: relative;
	background: url(images/map.jpg) no-repeat;
	height: 800px;
}
.preview a.point{
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
.preview a.point1{
	display: block;
	background: url(images/map-p1.png) no-repeat;
	background-size: contain;
	width:301px;
	height: 127px;
	position: absolute;
	right:88px;
	top:0px;
	text-indent: -9999px;
}
.preview a.point1:hover{
	width:271px;
}
.preview a.point2{
	display: block;
	background: url(images/map-p2.png) no-repeat;
	background-size: contain;
	width:221px;
	height: 69px;
	position: absolute;
	left:554px;
	top:190px;
	text-indent: -9999px;
}
.preview a.point2:hover{
	width: 199px;
}
.preview a.point3{
	display: block;
	background: url(images/map-p3.png) no-repeat;
	background-size: contain;
	width:254px;
	height: 75px;
	position: absolute;
	left:500px;
	top:290px;
	text-indent: -9999px;
}
.preview a.point3:hover{
	width: 229px;
}
.preview a.point4{
	display: block;
	background: url(images/map-p4.png) no-repeat;
	background-size: contain;
	width:191px;
	height: 128px;
	position: absolute;
	right:20px;
	top:470px;
	text-indent: -9999px;
}
.preview a.point4:hover{
	width: 172px;
}
.preview a.point5{
	display: block;
	background: url(images/map-p5.png) no-repeat;
	background-size: contain;
	width:224px;
	height: 141px;
	position: absolute;
	left:505px;
	top:474px;
	text-indent: -9999px;
}
.preview a.point5:hover{
	width: 202px;
}
.preview a.point6{
	display: block;
	background: url(images/map-p6.png) no-repeat;
	background-size: contain;
	width:272px;
	height: 91px;
	position: absolute;
	left:175px;
	top:335px;
	text-indent: -9999px;
}
.preview a.point6:hover{
	width: 245px;
}
.preview a.point7{
	display: block;
	background: url(images/map-p7.png) no-repeat;
	background-size: contain;
	width:270px;
	height: 70px;
	position: absolute;
	left:200px;
	top:190px;
	text-indent: -9999px;
}
.preview a.point7:hover{
	width: 243px;
}
.preview a.point8{
	display: block;
	background: url(images/map-p8.png) no-repeat;
	background-size: contain;
	width:262px;
	height: 82px;
	position: absolute;
	left:185px;
	top:475px;
	text-indent: -9999px;
}
.preview a.point8:hover{
	width: 236px;
}
.preview a.point9{
	display: block;
	background: url(images/map-p9.png) no-repeat;
	background-size: contain;
	width:270px;
	height: 70px;
	position: absolute;
	left:55px;
	bottom:50px;
	text-indent: -9999px;
}
.preview a.point9:hover{
	width: 243px;
}


.mv{
	height:550px;
	position: relative;
	background: url(images/mv.jpg);
}

.mv .mv-box{
	width:800px;
	height:430px;
	margin-left:100px;
	margin-top:80px;
	
	
	-webkit-box-shadow: 0px 3px 3px 0px rgba(50, 50, 50, 0.3);
	-moz-box-shadow:    0px 3px 3px 0px rgba(50, 50, 50, 0.3);
	box-shadow:         0px 3px 3px 0px rgba(50, 50, 50, 0.3);
}


/***************/

.menu{
	height: 70px;
	background: url(images/menu.jpg);
}

.menu ul{
	width: 90%;
	list-style: none;
	margin: 0 auto;
}
.menu ul li{
	display: block;
	float: left;
}
.menu ul li a{
	display: block;
	padding-right:10px;
	padding-left:5px;
	font-size: 1.2em;
	text-decoration: none;
	color: #334468;
	font-weight: bolder;
	letter-spacing: -1px;
}
.menu ul li a:hover{
	color:#953b2a;
	font-size: 1.25em;
}

.menu ul li a:last-child{
	padding-right:0px;
}

/********************/

.goodbox{
	padding:2em;
	margin: 0 auto;
}


/********************/

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}

/********/


#gotop {
	width: 64px;
	height: 64px;
	opacity: 0.8;
	position: fixed;
	bottom: 20px;
	right: 20px;
	display: none;
	text-indent: -9999px;
	background: url(images/top.png) no-repeat;
	background-size: contain;
	z-index: 99;
	opacity: 0.5;
}
