/*主選單按鈕*/
.main-menu{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top:0%;  /*設置垂直位置*/
    right:-35%;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    border-radius: 10px;  /*圓角*/
}


/*訂購商品的浮動選單*/

.purchase{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    bottom:0%;  /*設置垂直位置*/
    left:0%;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    background: #009FCC;  /*背景顏色*/
    border-radius: 10px;  /*圓角*/


font-size:100%;
font-family:新細明體;
color:0000cd;
text-align:center;
vertical-align:top;
line-height:180%;
letter-spacing:5px;

}



select{
font-size:100%;
color:0000ff;
letter-spacing:5%;
line-height:5%;
}


.banner{
width:40%;
	position:absolute;
        top:20%;
	left:27%;
}


.banner2{
width:70%;

}

.img-title{
width:60%
}


.copyright{
width:96%
}



body{
width:100%;
margin:0 auto;   /*設定四周的邊界為0 會置中*/
word-break: break-all;  /*強迫文字斷行*/

}

.img-title{
width:100%
}







nav{
margin-bottom:4%;

}

section{
margin-left:3%;  /*左方縮排*/
margin-right:3%;  /*右方縮排*/
margin-bottom:0%;

}

footer{
margin-top:1%;

}

/*表格格式*/
#outbox{
    -moz-column-count: 1;
    -webkit-column-count: 1;
    column-count: 1;
    width:100%; 
}

.content-box{
	width:52%;
	display: inline-block;
	font-size:100%;
text-align:center;
	letter-spacing:2%;
	color:#77DDFF;
	margin-top:2%;
	margin-bottle:2%;
width:23%;
}

.content-box2{
	display: inline-block;
	width:97%;
	margin-top:0%;
margin-right:1%;
margin-left:1%;
vertical-align:top;
		
}



.menu-word{
border:2px solid #ffffff;
padding:10px 40px; 
background:#4B0082;
width:23%;
font-size:110%;
border-radius:25px;
margin:0px auto;

}




.menu-picture {
width:25%;
}

/*麵包屑位置控制*/
.breadcrumb{
margin-bottom:-5%;
font-size:75%;
}



.menu-table{width:100%;
height:3%;
text-align:center;
font-size:150%;
font-family:新細明體;
font-weight:bold;
color:934900;
}




.book-frame{width:70%;
border:4px #99FF33 ridge;
box-shadow: 20px 20px 50px #BBFFEE,-20px -20px 50px #FFFFFF,20px -20px 50px #BBFFEE,-20px 20px 50px #BBFFEE;

}

.book-size{width:100%;

}

.book-size2{width:80%;

}


.link-word{font-size:60%;

}



/*商品介紹的大標題字體*/

.book-title{font-size:100%;
font-family:新細明體;
color:#0000AA;
text-align:center;
vertical-align:top;
line-height:180%;
letter-spacing:10px;

}




/*回頂端*/
.gotop{display:block;
margin:auto;
font-size:100%;
font-family:新細明體;
color:blue;
text-align:center;
vertical-align:top;
letter-spacing:5px;
text-shadow: 2px 2px 5px #ffffff ,-2px -2px 5px #ffffff ,2px -2px 5px #ffffff ,-2px 2px 5px #ffffff ,2px 2px 5px #ffffff ,-2px -2px 5px #ffffff ,2px -2px 5px #ffffff ,-2px 2px 5px #ffffff;

}


/*社群網站與訂購按鈕*/
.social{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    bottom:0%;  /*設置垂直位置*/
    right:0%;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    border-radius: 10px;  /*圓角*/
font-size:120%;
font-family:新細明體;
color:0000cd;
text-align:right;
vertical-align:top;
letter-spacing:10px;
}


/*社群圖示大小控制*/
.social-picture{
width:25%;
margin:1% ;
}


.content-picture{
width:100%;
}




/*基本字體*/

p{font-size:100%;
font-family:新細明體;
color:black;
text-align:left;
vertical-align:top;
line-height:180%;
letter-spacing:5px;
text-shadow: 2px 2px 5px #ffffff ,-2px -2px 5px #ffffff ,2px -2px 5px #ffffff ,-2px 2px 5px #ffffff ,2px 2px 5px #ffffff ,-2px -2px 5px #ffffff ,2px -2px 5px #ffffff ,-2px 2px 5px #ffffff;

/*文字左右對齊*/
text-align: justify;
text-justify:inter-ideograph;

}



.book-list-picture{
width:200%;
valign:top;
border-color:#0000FF;
box-shadow: 2px 2px 10px #00FFFF,-2px -2px 10px #00FFFF,2px -2px 10px #00FFFF,-2px 2px 10px #00FFFF;
}



/*h1標題*/
h1{margin-top:15%;
font-size:120%;
font-family:新細明體;
color:#00BBFF;
text-align:center;
vertical-align:top;
line-height:140%;
letter-spacing:2px;
text-shadow: 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000;
}


/*h2標題1*/
h2{font-size:100%;
font-family:新細明體;
color:#BBFF00;
text-align:center;
vertical-align:top;
line-height:140%;
letter-spacing:10px;
text-shadow: 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000;
}


/*h3標題1*/

h3{margin-top:10%;
font-size:100%;
font-family:新細明體;
color:#FFFF77;
text-align:center;
vertical-align:top;
line-height:140%;
letter-spacing:10px;
text-shadow: 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000, 0px 0px 10px #000;
}




/*h4標題1*/

h4{margin-top:10%;
font-size:100%;
font-family:新細明體;
color:red;
text-align:center;
vertical-align:top;
line-height:140%;
letter-spacing:10px;
text-shadow: 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff;

}






/*超連結*/
a:link{font-size:150%;color:white;text-shadow:1px 1px 5px #0000AA ,1px 1px 5px #0000AA ,1px 1px 5px #0000AA;}
a:visited{font-size:150%;color:white;font-weight:bold;text-shadow:1px 1px 5px #000000 ,1px 1px 5px #000000 ,1px 1px 5px #000000;}
a:hover{font-size:150%;color:white;font-weight:bold;text-shadow:1px 1px 5px #000000 ,1px 1px 5px #000000 ,1px 1px 5px #000000;}
a:active{font-size:150%;color:white;font-weight:bold;text-shadow:1px 1px 5px #000000 ,1px 1px 5px #000000 ,1px 1px 5px #000000;}