@charset "UTF-8";

body{
	margin:0px;
	padding:0px;
	background: #FFFFFF;
	font-family:"微軟正黑體","Microsoft JhengHei","儷黑 Pro","LiHei Pro Medium",Verdana, Arial, Helvetica,sans-serif;
}
.basic-txt{
	font-size:12pt;
	line-height:1.6em;
}
.basic-txt p{
	padding:0 0 0.2em 0;
	text-indent: 0em;
}

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

#conatiner{
	background: #FFFFFF;
}

.wrapper{
	width: 100%;
	margin:0 auto;
}

.content{
	width: 1000px;
	margin: 0 auto;
	min-width: 1000px;
}
/***************/

.menu{
	background: #FFFFFF;
	opacity: 0.8;
	position: fixed;
	top:0px;
	left: 0px;
	right: 0px;
	z-index: 9;
}
.menu:hover{
	opacity: 1;
	border-bottom:1px solid #000000;
}
.menu ul{
	list-style: none;
	padding: 0px;
	margin: 0px;
	width: 1000px;
	height: 50px;
	margin: 0 auto;
}
.menu ul li{
	display: block;
	float: left;
	text-align: center;
	padding:12px 5px 0 5px ;
	font-weight: bolder;
	font-size: 13px;
	background: url(images/menu-dot.png) no-repeat;
	background-position-y: 24px;
}
.menu ul li a{
	color: #000000;
	text-decoration: none;
}

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

.head1{
	background: url(images/head1.jpg) center top;
}
.head1 .content{
	background: url(images/head1.jpg) center top;
	position: relative;
	height: 700px;
}
.head1 .t1{
	display: block;
	position: absolute;
	left: 0px;
	top:80px;
}
.head1 .t2{
	display: block;
	position: absolute;
	left: -10px;
	top:123px;
}
.head1 .t3{
	display: block;
	position: absolute;
	right: -5px;
	top:475px;
}
.head1 .t4{
	display: block;
	position: absolute;
	left: 690px;
	top:208px;
}
.head1 .tt{
	display: block;
	position: absolute;
	left: 387px;
	top:35px;
}
.head2{
	background: url(images/head2.jpg) center top;
}
.head2 .content{
	background: url(images/head2.jpg) center top;
	position: relative;
	height: 240px;
}
.head2 .content img{
	margin-left: 42px;
	margin-top: 30px;
}

.booksec{
	background: url(images/book-sec.png) center top;
}
.booksec .content{
	background: url(images/book-sec.png) center top;
	height: 700px;
	position: relative;
}
.booksec .book{
	display: block;
	position: absolute;
	left: 30px;
	top:122px;
}
.booksec .qatt{
	display: block;
	position: absolute;
	left: 450px;
	top:70px;
}
.booksec .tt{
	display: block;
	position: absolute;
	left: 400px;
	top:425px;
}
.booksec .shopbox{
	position: absolute;
	left: 400px;
	top:310px;
	color:#FFFFFF;
}
.booksec .shopbox .btn{
	display: inline-block;
	margin-top: 8px;
	margin-left: 4px;
	height: 24px;
	line-height: 24px;
	width: 120px;
}


.intro .content{
	background: #FFFFFF;
	padding-top: 20px;
	padding-bottom: 20px;
}
.intro .content .txt{
	width: 800px;
	margin: 0 auto;
}
.intro .content p{
	line-height: 1.8em;
}
.intro .content p strong{
	font-weight: bolder;
	/*color:#de1f30;*/
}
.intro .content p.sp{
	color:#7f2d00;
}
.intro .content img{
	margin-top: 20px;
}

.goodsec{
	background: url(images/good-sec.png) center top; 
}
.goodsec .content{
	background: url(images/good-sec.png) center top;
	height: 460px;
	padding-top: 90px;
}
.goodsec .content .txtbox{
	width: 788px;
	margin: 0 auto;
	height: 400px;
	padding-right: 12px;
	overflow: auto;
	line-height: 1.8em;
}

.spesec{
	background: url(images/spe-sec.jpg) center top;
}
.spesec .content{
	background: url(images/spe-sec.jpg) center top;
	height: 750px;
}
.spesec .preview .box{
	width: 920px;
	height: 560px;
	margin: 0 auto;
	border:1px solid #000000;
	margin-top: 10px;
	background: #FFFFFF;
	-webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.3);
	box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.3);
}

.exsec{
	background: url(images/ex-sec.png) center top;
}
.exsec .content{
	background: url(images/ex-sec.png) center top;
	height: 840px;
}

.exsec .content ul{
	list-style: none;
	margin: 0px;
	padding: 0px;
	margin-bottom: 30px;
	margin-top: 20px;
}
.exsec .content ul li{
	display: inline-block;
	width: 55%;
	vertical-align: middle;
}
.exsec .content ul li.book{
	width: 25%;
	padding-left: 90px;
}
.exsec .content ul li.txt{
	padding-left: 90px;
}
.exsec span.tt{
	color: #394a8b;
	font-size: 1.1em;
	font-weight: bolder;
}
.exsec a.btn{
	margin-top: -21px;
	margin-left: 260px;
	width: 100px;
	height: 18px;
	line-height: 18px;
}

.footer{
	background: #17181e;
}


.qa-main{
	width: 500px;
	height: 100%;
	position: fixed;
	z-index: 8;
	background: #c45460;
	color: #FFFFFF;
	padding: 2em;
	padding-left: 4em;
	padding-top: 4em;
	font-size: 14px;
	border-left: 2px solid #000000;
	right:-620px;
	-webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
.qa-main-move{
	right:0px;
	-webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

.qa-main span.tt{
	font-size: 1.2em;
	font-weight: bolder;
	color:#fff45c;
}

.qa-main a.btn{
	margin: 0 auto;
	margin-top: 30px;
	float: left;
	margin-left: -73px;
	width: 100px;
	background: #000000;
	color: #FFFFFF;
	font-weight: bolder;
	width: 40px;
	height: 40px;
	line-height: 40px;
	border-radius: 50% 50% 50% 50%;
	-moz-border-radius: 50% 50% 50% 50%;
	-webkit-border-radius: 50% 50% 50% 50%;
	
}
.qa-main a.btn:hover{
	color:#c45460;
}

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

a.btn{
	display:block;
	width:160px;
	height:30px;
	text-align: center;
	text-decoration: none;
	background: #ffa800;
	color:#FFFFFF;
	font-size: 13px;
	margin-top:0px;
	line-height: 30px;
	border-radius: 8px 8px 8px 8px;
	-moz-border-radius: 8px 8px 8px 8px;
	-webkit-border-radius: 8px 8px 8px 8px;
	border: 0px solid #000000;
}

a.btn:hover{
	background: #000000;
}

/********/


a#gotop {
	width: 60px;
	height: 60px;
	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;
}


/********/

.btcf:after {
    content:"";
    display:table;
    clear:both;
}