﻿/* ==reset.css================= */

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset, img {
	border:0;
}
address, caption, cite, code, dfn, em, strong, th, var {
	font-style:normal;
	font-weight:normal;
}
ol, ul {
	list-style:none;
}
caption, th {
	text-align:left;
}
/*h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}*/
q:before, q:after {
	content:'';
}
abbr, acronym {
	border:0;
}

/* ==reset.css================= */

*{
	margin:0;
	padding:0;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
}
map *:focus {
	outline: none;
}
a{
 outline: none; /* for Firefox Google Chrome  */
 behavior:expression(this.onFocus=this.blur()); /* for IE */
}
#top-bar{ width:100%; height:50px; background:#928ac2;z-index: 999; position:fixed; top:-65px;
 
 /* CSS3 陰影*/-webkit-box-shadow: 0px 2px 2px #ccc;
-moz-box-shadow: 0px 2px 2px #ccc;
box-shadow: 0px 2px 2px #ccc; 
}
#menu{width:1100px; margin:0 auto; line-height:50px;text-align: center;}
#menu b, #menu a{color:#fff; padding:0 20px;text-decoration: none;}
html{
	width: 100%;
	height: 100%;
	margin: 0 auto;
	font-family:Arial,Times New Roman,"微軟正黑體";
	-webkit-text-size-adjust:none;
}
body{
	width: 100%;
	height: 100%;
	margin: 0 auto;
	background-image: url(../images/bodybg.png);
	background-repeat:no-repeat;
	background-position: center top;
	background-color: #fed5c9;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;	
	clip: rect(0px,0px,0px,0px);
}
.Wcont{width: 1200px;	height: 1645px; text-align: center;	margin: 0 auto;	position: relative;	z-index: 1;background-repeat: no-repeat;background-position: top center;}

.cont{	width: 1200px;	text-align: center;	margin: 0 auto;	padding-top: 50px;	position: relative;	z-index: 1;}
.cont2{	width: 1200px;	text-align: center;	margin: 0 auto;	position: relative;	overflow: hidden;/*clearboth沒作用,用這個才有效*/}

.topBns1{
	position: absolute;
	width: 410px;
	height: 505px;
	top: 29px;
	left: 79px;
	z-index: 3;
}
/*.topBns2{
	position: absolute;
	width: 182px;
	height: 326px;
	top: 235px;
	left: 910px;
	z-index: 2;
}*/
.topBns2{
    position:absolute;
    width: 170px;
	height: 305px;
	top: 235px;
	left: 910px;
	z-index: 3;
    animation-name:animationpeo;
	animation-duration:1s;
	animation-delay:6s;
    animation-direction:alternate;
	animation-iteration-count:10;

}
@keyframes animationpeo{
	0%{left:915px;transform: rotate(5deg); }25%{left:920px;transform: rotate(-10deg); /**/}50%{left:925px;transform: rotate(-15deg);}75%{left:930px;transform: rotate(-10deg);}100%{left:920px;transform: rotate(0deg);}
}
.topBns3{
	position: absolute;
	width: 561px;
	height: 261px;
	top: 290px;
	left: 367px;
	z-index: 2;
}
/*.topBns4{
	position: absolute;
	width: 341px;
	height: 70px;
	top: 172px;
	left: 547px;
	z-index: 2;
}*/
.topBns4{
    position:absolute;
    width: 341px;
	height: 70px;
	top: 172px;
	left: 547px;
	z-index: 3;
    animation-name:animationkey;
	animation-duration:6s;
/*animation-iteration-count:infinite;*/
animation-direction:alternate;
animation-timing-function:ease;
animation-delay:0.3s;
}
@keyframes animationkey{
    0%{left:800px;}50%{left:400px;}75%{left:500px;}100%{left:547px;}
}
.topBns5{
	position: absolute;
	width: 195px;
	height: 182px;
	top: 0;
	left: 877px;
	z-index: 2;
}
.topBns6{
	position: absolute;
	width: 802px;
	height: 105px;
	top: 574px;
	left: 170px;
	z-index: 2;
}

.Wcont2{width: 1200px;	height: 2150px;	text-align: center;	margin: 0 auto;	position: relative;	background-repeat: no-repeat;background-position: top center;}
.Wcont2:after{	content: '';	display: block;	clear: both;}

.bookbg1{
	position: absolute;
	width: 1136px;
	height: 594px;
	top: 649px;
	left: 0px;
	z-index: 2;
}
.bookbg2{
	position: absolute;
	width: 1133px;
	height: 454px;
	top: 1198px;
	left: 0px;
	z-index: 2;
}
.bookbg3{
	position: absolute;
	width: 1133px;
	height: 513px;
	top: 15px;
	left: 0px;
	z-index: 2;
}
.bookbg4{
	position: absolute;
	width: 1078px;
	height: 588px;
	top: 500px;
	left: 0px;
	z-index: 2;
}
.book12-1{
	position: absolute;
	width: 215px;
	height: 257px;
	top: 789px;
	left: 136px;
	z-index: 3;
}
.book12-2{
	position: absolute;
	width: 196px;
	height: 280px;
	top: 761px;
	left: 505px;
	z-index: 3;
}
.book12-3{
	position: absolute;
	width: 215px;
	height: 254px;
	top: 800px;
	left: 851px;
	z-index: 3;
}
.book12-4{
	position: absolute;
	width: 277px;
	height: 197px;
	top: 1341px;
	left: 132px;
	z-index: 3;
}
.book12-5{
	position: absolute;
	width: 215px;
	height: 256px;
	top: 1307px;
	left: 539px;
	z-index: 3;
}
.book12-6{
	position: absolute;
	width: 235px;
	height: 233px;
	top: 1361px;
	left: 885px;
	z-index: 3;
}
.book12-7{
	position: absolute;
	width: 234px;
	height: 234px;
	top: 193px;
	left: 136px;
	z-index: 3;
}
.book12-8{
	position: absolute;
	width: 234px;
	height: 234px;
	top: 59px;
	left: 504px;
	z-index: 3;
}
.book12-9{
	position: absolute;
	width: 217px;
	height: 284px;
	top: 139px;
	left: 856px;
	z-index: 3;
}
.book12-10{
	position: absolute;
	width: 225px;
	height: 250px;
	top: 705px;
	left: 141px;
	z-index: 3;
}
.book12-11{
	position: absolute;
	width: 243px;
	height: 233px;
	top: 597px;
	left: 544px;
	z-index: 3;
}
.book12-12{
	position: absolute;
	width: 207px;
	height: 240px;
	top: 773px;
	left: 845px;
	z-index: 3;
}
.bookbg5s1{
	position: absolute;
	width: 469px;
	height: 553px;
	top: 1076px;
	left: 0px;
	z-index: 2;
}
.bookbg5s2{
	position: absolute;
	width: 412px;
	height: 459px;
	top: 1109px;
	left: 420px;
	z-index: 2;
}
.bookbg5s3{
	position: absolute;
	width: 335px;
	height: 454px;
	top: 1110px;
	left: 800px;
	z-index: 2;
}
.bookbg6s1{
	position: absolute;
	width: 374px;
	height: 465px;
	top: 1637px;
	left: 12px;
	z-index: 2;
}
.bookbg6s2{
	position: absolute;
	width: 433px;
	height: 423px;
	top: 1667px;
	left: 390px;
	z-index: 2;
}
.bookbg6s3{
	position: absolute;
	width: 473px;
	height: 440px;
	top: 1594px;
	left: 723px;
	z-index: 2;
}
.pagetop{
	position: absolute;
	width: 930px;
	height: 282px;
	top: 9px;
	left: 127px;
	z-index: 2;
}
.Pagecont{width: 1200px;height: 1600px;	text-align: center;	margin: 0 auto;	position: relative;}
.Pageconts{width: 1200px;height: 1530px;	text-align: center;	margin: 0 auto;	position: relative;}
.Pagecont2{width: 1200px;text-align: center;padding-left: 60px;padding-bottom: 60px; margin: 0 auto;position: relative;}

/*===========內頁設定===========*/
.p1s1{position: absolute;width: 1131px;	height: 862px;top: 300px;left: 33px;z-index: 2;}
.p1mv-1{
	position: absolute;
	width: 310px;
	height: 179px;
	top: 977px;
	left: 109px;
	z-index: 3;
	border: 5px #000 solid;
	border-radius: 10px;
	background-color: #000;
}
.p1mv-2{
	position: absolute;
	width: 310px;
	height: 179px;
	top: 898px;
	left: 462px;
	z-index: 3;
	border: 5px #000 solid;
	border-radius: 10px;
	background-color: #000;
}
.p1mv-3{
	position: absolute;
	width: 310px;
	height: 179px;
	top: 939px;
	left: 829px;
	z-index: 3;
	border: 5px #000 solid;
	border-radius: 10px;
	background-color: #000;
}
.p1s2{position: absolute;width: 1085px;height: 398px;top: 1171px;left: 46px;	z-index: 2;}
.p1book{width: 1000px;padding-bottom:60px;padding-top: 40px; margin: 0 auto;background-color: #FFFFFF;-moz-border-radius: 10px;	border-radius: 10px;	
	-moz-box-shadow: 6px 6px 12px -2px rgba(20%,20%,40%,0.5);box-shadow:6px 6px 12px -2px rgba(20%,20%,40%,0.5);text-align: center;	overflow:hidden;/*這地方有效*/}

.p2s1{
	position: absolute;
	width: 1124px;
	height: 765px;
	top: 300px;
	left: 8px;
	z-index: 2;
}
.p2mv-3{
	position: absolute;
	width: 310px;
	height: 179px;
	top: 894px;
	left: 835px;
	z-index: 3;
	border: 5px #000 solid;
	border-radius: 10px;
	background-color: #000;
}
.p2s2{
	position: absolute;
	width: 1085px;
	height: 484px;
	top: 1080px;
	left: 46px;
	z-index: 2;
}
.p2book{width: 1000px;height: 1650px;padding:40px 0 ;margin: 0 auto;background-color: #FFFFFF;-moz-border-radius: 10px;	border-radius: 10px;	
	-moz-box-shadow: 6px 6px 12px -2px rgba(20%,20%,40%,0.5);box-shadow:6px 6px 12px -2px rgba(20%,20%,40%,0.5);text-align: center;	}

.p3s1{position: absolute;width: 1088px;	height: 685px;top: 300px;left: 33px;z-index: 2;}
.p3mv-1{position: absolute;	width: 310px;height: 179px;	top: 976px;	left: 117px;z-index: 3;	border: 5px #000 solid;	border-radius: 10px;background-color: #000;}
.p3mv-2{position: absolute;	width: 310px;height: 179px;	top: 898px;	left: 466px;z-index: 3;	border: 5px #000 solid;	border-radius: 10px;background-color: #000;}
.p3mv-3{position: absolute;	width: 310px;height: 179px;	top: 943px;	left: 826px;z-index: 3;	border: 5px #000 solid;	border-radius: 10px;background-color: #000;}
.p3s2{
	position: absolute;
	width: 1085px;
	height: 475px;
	top: 1016px;
	left: 46px;
	z-index: 2;
}
.p3book{width: 1000px;height: 1650px;padding:40px 0 ;margin: 0 auto;background-color: #FFFFFF;-moz-border-radius: 10px;	border-radius: 10px;	
	-moz-box-shadow: 6px 6px 12px -2px rgba(20%,20%,40%,0.5);box-shadow:6px 6px 12px -2px rgba(20%,20%,40%,0.5);text-align: center;	}

.p4s1{position: absolute;width: 1072px;	height: 740px;top: 300px;left: 33px;z-index: 2;}
.p4mv-1{position: absolute;	width: 310px;height: 179px;	top: 976px;	left: 117px;z-index: 3;	border: 5px #000 solid;	border-radius: 10px;background-color: #000;}
.p4mv-2{position: absolute;	width: 310px;height: 179px;	top: 898px;	left: 466px;z-index: 3;	border: 5px #000 solid;	border-radius: 10px;background-color: #000;}
.p4mv-3{
	position: absolute;
	width: 310px;
	height: 179px;
	top: 974px;
	left: 817px;
	z-index: 3;
	border: 5px #000 solid;
	border-radius: 10px;
	background-color: #000;
}
.p4s2{
	position: absolute;
	width: 1085px;
	height: 480px;
	top: 1137px;
	left: 46px;
	z-index: 2;
}
.p4book{width: 1000px;height: 1650px;padding:40px 0 ;margin: 0 auto;background-color: #FFFFFF;-moz-border-radius: 10px;	border-radius: 10px;	
	-moz-box-shadow: 6px 6px 12px -2px rgba(20%,20%,40%,0.5);box-shadow:6px 6px 12px -2px rgba(20%,20%,40%,0.5);text-align: center;	}

.p5s1{
	position: absolute;
	width: 1107px;
	height: 768px;
	top: 313px;
	left: 33px;
	z-index: 2;
}
.p5mv-1{position: absolute;	width: 310px;height: 179px;	top: 976px;	left: 117px;z-index: 3;	border: 5px #000 solid;	border-radius: 10px;background-color: #000;}
.p5mv-2{position: absolute;	width: 310px;height: 179px;	top: 898px;	left: 466px;z-index: 3;	border: 5px #000 solid;	border-radius: 10px;background-color: #000;}
.p5mv-3{
	position: absolute;
	width: 310px;
	height: 179px;
	top: 1012px;
	left: 851px;
	z-index: 3;
	border: 5px #000 solid;
	border-radius: 10px;
	background-color: #000;
}
.p5s2{
	position: absolute;
	width: 1085px;
	height: 398px;
	top: 1070px;
	left: 46px;
	z-index: 2;
}
.p5book{width: 1000px;height: 1650px;padding:40px 0 ;margin: 0 auto;background-color: #FFFFFF;-moz-border-radius: 10px;	border-radius: 10px;	
	-moz-box-shadow: 6px 6px 12px -2px rgba(20%,20%,40%,0.5);box-shadow:6px 6px 12px -2px rgba(20%,20%,40%,0.5);text-align: center;	}

.p6s1{position: absolute;width: 1112px;	height: 717px;top: 300px;left: 33px;z-index: 2;}
.p6mv-1{
	position: absolute;
	width: 310px;
	height: 179px;
	top: 965px;
	left: 108px;
	z-index: 3;
	border: 5px #000 solid;
	border-radius: 10px;
	background-color: #000;
}
.p6mv-2{
	position: absolute;
	width: 310px;
	height: 179px;
	top: 867px;
	left: 459px;
	z-index: 3;
	border: 5px #000 solid;
	border-radius: 10px;
	background-color: #000;
}
.p6mv-3{
	position: absolute;
	width: 310px;
	height: 179px;
	top: 967px;
	left: 826px;
	z-index: 3;
	border: 5px #000 solid;
	border-radius: 10px;
	background-color: #000;
}
.p6s2{position: absolute;width: 1085px;height: 400px;top: 1171px;left: 46px;	z-index: 2;}
.p6book{width: 1000px;height: 1650px;padding:40px 0 ;margin: 0 auto;background-color: #FFFFFF;-moz-border-radius: 10px;	border-radius: 10px;	
	-moz-box-shadow: 6px 6px 12px -2px rgba(20%,20%,40%,0.5);box-shadow:6px 6px 12px -2px rgba(20%,20%,40%,0.5);text-align: center;	}

/*===========內頁設定end===========*/

.point{	position: absolute;	top: 590px;}

#Menu {
/*	width:inherit;*/
	width:100%;
	height:50px;
	padding-top:2px;
	background-color:#ffd4d1;
	z-index:201;/*比pic高一層*/
	position:fixed;
/*	box-shadow:2px 2px 3px rgba(20%,20%,40%,0.5);*/
}
.buy {
	width:100px;
	height:auto;
	position:absolute;
	right:10px;
	bottom:220px;
	position:fixed;
	z-index: 99;
	}
.buy2 {
	width:120px;
	height:auto;
	position:absolute;
	right:5px;
	bottom:270px;
	position:fixed;
	z-index: 99;
	}
.return {
	width:100px;
	height:auto;
	position:absolute;
	right:10px;
	bottom:20px;
	position:fixed;
	z-index: 99;
	}
#backtotop{
	display:scroll;position:fixed;
	position: fixed;
   bottom: 30px;
   right: 30px;
   width: 80px;
   height: 80px;
   z-index: 10;
   cursor: pointer;
   transition: all .5s
   -webkit-transition: all .5s;
   -moz-transition: all .5s;
	}
#gobuy{
	display:scroll;
	position:fixed;
	position: fixed;
   bottom: 160px;
   right: 30px;
   width: 80px;
   height: 80px;
   z-index: 10;
   cursor: pointer;
   transition: all .5s
   -webkit-transition: all .5s;
   -moz-transition: all .5s;
	}
