@import url("reset.css");

*{
	margin:0;
	padding:0;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
}
/*a{color: #FFFFFF;}*/
html{ 
	font-family:Arial, Verdana, "微軟正黑體";
	-webkit-text-size-adjust:none;
}

body{
  	font-family: ‘Noto Sans TC’, Arial, Verdana, Helvetica, sans-serif;
	font-size: 17px;
	font-weight: 500;
	line-height: 1.5em;
	letter-spacing:0px;
	background-image:url(../images/bodyBG.png);
	background-repeat:repeat;
	background-color:#fff;
	background-position:center top;
	padding-top: 50px;
	}
.header {
    position: fixed;
    margin: auto;
    background-color: #FFF;
    z-index: 100;
    width: 100%;
    top: 0;
}
#wrapper{
	width:100%;
	min-height:100%;
/*	background: url(images/bg.png) no-repeat center top;*/
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	}
#TOP-MENU{
		display:block;
		width:100%;
		height:60px;
		position:relative; 
		background-color:#06507f;
		position:fixed;
		top: 0;
		left: 0;
		z-index: 9991;/*把選單改成永遠隨頂*/
	}
	
	#TOP-MENU #BTN{ 
		display:block;
		width:60px;
		height:40px;
		background-image:url(../images/btn.png);
		
		position:absolute;  
		right:5px;
		top:10px;
		text-indent:-9999px;
	}
	
	/***0621修改--NAV展開-絕對定位疊在navbar下層***/ 
	#NAV{
		width:100%;
		height:auto;
		background-color:#8bbccc;		
		display:none;  
		position: fixed; 
		top: 60px;
		left: 0;		
		z-index: 9990;/*用絕對定位讓NAV疊在下層*/
	}

	#NAV.open{top: 60px; display: block;}
	
	#NAV ul{
		width:100%;
		height:auto;
	}
	
	#NAV li{
		width:100%;
		float:none; 
	}
	
	#NAV li a{
		display:block;
		width:100%;
		height:50px;
		line-height:50px;
		text-align:center;
		text-decoration:none;
		background-color:#5096ca;
		border:1px solid #FFF;
		color:#fff;
	}
	
	#NAV li a:hover{
		background-color:#ccc;
		border:1px solid #FFF;
	}
	.NAV-LOGO{
	display:block;
	float:left;
	width:80px;
	height:40px;
	line-height:50px;
	top:8px;left:10px;
	text-align:center; }

	.NAV-LOGO img{
	
		margin:12%;
		line-height:40px;
		}
#logor{
	display:none;
	float:left;
	}
#logor img{display: none;
	width:80%;
	margin:3%;}	


.logor{display: none;float:left;line-height:60px;}
.logor img{	display: none;}
.buypng img{display:none;}
.bg-blue{background-color: #0099cc;}
.navcolor{font-weight: 700;}

.cart_icon{font-size: 1.5em;padding-right: 5%;color: #FFFFFF;}
.mobileBn{width: 100%;height: auto;text-align: center;padding-top: 0;}
.headerBn{display:none;}
.headerTitle{display:none;}
.headerG1{display:none;}
.headerG2{display:none;}


.buycar{width: 50%; margin:1% 0 2% 1%;text-align: center; }
.buycar img{max-width: 70%;}
.buy2{max-width: 50px;margin:1% 0 0 1% }
.flr{float:none;}
.fll{float: none;}
.red{font-size: 1.5em;color:#eb2727;font-weight: 600;}
.blue{font-size: 1.1em;color:#3399cc;font-weight: 600;}
.em{font-style:  italic;}

.cont1{width:100%;	margin:0 auto;background-color: #fff;background-image: url("../images/bg-p1.png");background-position: center bottom;background-repeat: no-repeat;	/*background-attachment: fixed;background-size: cover;*/}
.cont1:after{content: '';display: block;clear: both;}
.box1{width:100%;margin:0 auto;padding: 1% 2% 15%;}
.box1:after{content: '';display: block;clear: both;}/*偽元素,不用設高度,自動撐高*/
.box1 h2{text-align: center;margin: 2% auto;}
.box1 h2 img{width: 92%;height: auto;}
.auauthor{display: none;}
.auauthorM{display:block;max-width: 92%;float: none;margin: 4% auto;}

.cont2{width:100%;	margin:0 auto;background-color: #ffe70b;background-image: url("../images/bg-p2.png");background-position: center bottom;background-repeat: no-repeat;/*	background-attachment: fixed;	background-size: cover;*/	}
.cont2:after{content: '';display: block;clear: both;}
.box2{width:100%;margin:0 auto;padding: 1% 2% 15%;}
.box2:after{content: '';display: block;clear: both;}
.box2 h2{text-align: center;margin: 2% auto;}
.box2 h2 img{width: 92%;height: auto;}

.Bookintro{width: 98%;height: auto;padding-bottom: 10px; margin: 1%;text-align: center;}
.Bookintro img{padding-bottom: 2%;}
.BookintroTXT{width: 98%;height: auto;padding-bottom: 10px; margin: 1%;text-align: left;}

.cont3{width:100%;	margin:0 auto; background-color: #fff;background-image: url(../images/bg-p3.png);background-position: center bottom;background-repeat: no-repeat;}
.cont3:after{content: '';display: block;clear: both;}
.box3{width:100%;margin:0 auto;padding: 1% 2% 15%;}
.box3:after{content: '';display: block;clear: both;}
.box3 h2{text-align: center;margin: 3% auto;}
.box3 h2 img{width: 92%;height: auto;}
.box3 h3{text-align: center;margin: 1% auto;font-size: 1.5em;font-weight: 600;}
.box3 h6{text-align: center;margin: 1% auto;font-size: 0.9em;line-height: 1.5em;}
.box3 p{}
.box3 p img{max-width: 90%;margin:4%; float: none;text-align: center;}

.cont4{width:100%;	margin:0 auto; background-color: #029dd5;background-image: url(../images/bg-p4.png);background-position: center bottom;background-repeat: no-repeat;}
.cont4:after{content: '';display: block;clear: both;}
.box4{width:100%;margin:0 auto;padding: 1% 2% 15%;}
.box4:after{content: '';display: block;clear: both;}
.box4 h2{font-size: 1.2em;font-weight: 600;text-align: center;padding-bottom: 3%;}
.box4 h2 img{width: 92%;height: auto;}
.box4 h3{margin: 1% auto;font-size: 1.5em;line-height: 1.5em; font-weight: 600;}
.TXTcont{width: 100%;padding: 0; float: none;}
.TXTcont img{max-width: 99%;float: none;text-align: center;}

.cont5{width:100%;	margin:0 auto; background-color: #fff;background-image: url("../images/bg-p5.png");background-position: center bottom;background-repeat: no-repeat;}
.cont5:after{content: '';display: block;clear: both;}
.box5{width:100%;margin:0 auto;padding: 1% 2% 15%;}
.box5:after{content: '';display: block;clear: both;}
.box5 h2{font-size: 1.2em;font-weight: 600;text-align: center;padding-bottom: 2%;}
.box5 h2 img{width: 92%;height: auto;}
.box5 h5{text-align: center;margin: 1% auto;font-size: 0.9em;line-height: 1.5em;}
.box5 h6{text-align: left;margin: 2% auto;font-size: 0.8em;line-height: 1.1em;letter-spacing:0px;display: -webkit-box; display: -webkit-flex; display: flex;display: -ms-flexbox; -webkit-box-align: center;-ms-flex-align: center;align-items: center;}
.box5ba{margin: 5% auto;position: relative;display: none;}
.box5ba img{width: 1000px;height: 300px;border: 3px solid #000;}
.box5baM{margin: 5% auto;position: relative;text-align: center; display: block;}
.box5baM img{width: 94%;height: auto;border: 3px solid #000;}
.box5babut1{width: 80px;height: 30px;border-radius:6px;background-color: #d61624;padding: 4px;font-size: 0.9em;color: #fff; font-weight: 500;letter-spacing:1px;text-align: center;position: absolute;right:32%;	bottom: 3%;}
.box5babut2{width: 80px;height: 30px;border-radius:6px;background-color: #d61624;padding: 4px;font-size: 0.9em;color: #fff; font-weight: 500;letter-spacing:1px;text-align: center;position: absolute;right:7%;	bottom: 3%;}

.box5 p a:link,a:visited,a:hover,a:active {font-weight: 600;color: #C40A0D;}
.TXTcont5{width:98%;margin: 0 auto;padding: 2%;}
.fblogo{max-width: 25px;border: 0;float: left;padding:0 2px 5px 0;display: -webkit-box; display: -webkit-flex; display: flex;display: -ms-flexbox; -webkit-box-align: center;-ms-flex-align: center;align-items: center;}

.fbintro{max-width: 98%; border: 3px solid #000;border-radius:20px;margin: 4% auto;margin: 0 auto;text-align: center;}
.fbintro h5{font-size: 1.3em;font-weight: 600;line-height: 1.5em;padding:2% 0 1%;}
.fbintro span{font-size: 1.2em; font-weight: 700;}
.fbintro p{font-size: 0.85em;font-weight: 500;line-height: 1.6em;letter-spacing:1px;}
.fbcomm{max-width: 98%;padding:  1% 4%;margin: 0 auto;text-align: center;}

/*slider原body語法,搬進css*/
.slider {width: 50%; margin: 100px auto; text-align: center;}
.slick-slide {margin: 0px 6px;}
.slick-slide img {width: 100%; }
.slick-prev{left: 30px;width: 30px;}
.slick-next{right: 30px;width: 30px;}
.slick-prev:before{color: black;content: url('../images/prev.svg');}
.slick-next:before {color: black;content: url('../images/next.svg');}
.slick-slide { transition: all ease-in-out .3s; opacity: .2; }
.slick-active {opacity: 1; }
.slick-current {opacity: 1;}
.fbsl{width: 100%;margin: 0 auto;text-align: center;}
/*結束*/

.cont6{width:100%;	margin:0 auto; background-color: #ffe70b;background-image: url("../images/bg-p6.png");background-position: center bottom;background-repeat: no-repeat;}
.cont6:after{content: '';display: block;clear: both;}
.box6{width:100%;margin:0 auto;padding: 1% 2% 15%;}
.box6:after{content: '';display: block;clear: both;}
.box6 h2{font-size: 1.2em;font-weight: 700;text-align: center;padding-bottom: 2%;}
.box6 h2 img{width: 92%;height: auto;}
.box6 h6{margin: 1% auto;font-size: 0.9em;line-height: 1.1em;}

.setBookBg{width: 100%;height: auto; background-color: #FFF;margin: 1% auto;padding: 4% 0; position: relative;text-align: center;border-radius:20px;}
.setBookBg:after{content: '';display: block;clear: both;}
.setBookintro{width: 100%;height: auto;margin: 0 auto;text-align: center;}
.setBookintro img{padding-bottom: 2%;}
.setBookintroTXT{width: 98%; padding: 3% 4%; margin: 0;text-align: left;margin: 0 auto;}
.bookg{max-width: 94%;text-align: center;}

.picBg{width: 100%; margin: 1% auto;text-align: center;}
.picBg img{max-height: auto;width: 90%; margin: 1%;text-align: center; border: 3px solid #000;float: none;}

.tsBookBg{width: 48%;height: auto;padding: 3% 0; background-color: #FFFFFF;margin: 1%;position: relative;text-align: center;float: left;border-radius:20px;}
.tsBookBg img{max-width: 94%;height: auto;padding: 4px 0 0 0;}
.tsBookBg p a:link,a:visited,a:hover,a:active{color: #333;text-decoration: none;}

.tsBookBg p{font-size: 0.9em;color:#666;font-weight: 500;}
.textline{text-decoration:line-through;}

clear{clear:both;}

/*** footer ***/
.bottom a:link{font-size:13px;font-weight:bold;color:#FFF;text-decoration:none}
.bottom a:hover{font-size:13px;font-weight:bold;color:#FFF;background-color:#666666;text-decoration:underline}
.bottom a:visited{font-size:13px;font-weight:bold;color:#FFF;background-color:#666666;text-decoration:none}
.footer01{font-size:13px;font-weight:bold;color:#bd4d03;background-color:#fff;text-align:center;padding:20px 0 10px 0}
.footer02{font-size:13px;text-align:center;color:#000;line-height:24px;background-color:#fff}
.footer02 a:link{font-size:13px;text-align:center;color:#000;text-decoration:none}
.footer02 a:hover{font-size:13px;text-align:center;color:#000;text-decoration:underline}
.footer02 a:visited{font-size:13px;text-align:center;color:#000;text-decoration:none}
.bottom1{font-size:13px;font-weight:bold;color:#FFF;background-color:#3e3d43;height:35px;padding:20px 0 10px 0;text-align:center;margin: 0 auto;}
.footer011{font-size:13px;font-weight:bold;color:#fff;background-color:#3e3d43;text-align:center;padding:20px 0 10px 0}
.footer011 img{margin: 0 30px;}
.footer021{font-size:13px;text-align:center;color:#aaaaaa;line-height:24px;background-color:#222127;}
#backtotop{
	display:scroll;
	position: fixed;
	
   bottom: 4px;
   right: 0px;
  
   opacity: 0.8;
   z-index: 10;
   cursor: pointer;
   transition: all .5s
   -webkit-transition: all .5s;
   -moz-transition: all .5s;
	}
#backtotop:hover {
opacity: 1;
}