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



/*廣告*/
.ad{
width:10%;
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top:0%;  /*設置垂直位置*/
    left:3%;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    border-radius: 10px;  /*圓角*/
}




/*文字區域縮排用*/ 
.indentation{      
margin-left:5%;  /*左方縮排*/
margin-right:5%;  /*右方縮排*/

}




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

}

.img-title{
width:100%;
}


.banner{      
width:50%;
margin-top:6%;
}


.frame-up{
width:100%;
display:block; margin:auto;
margin-bottom:-4%;
}



.frame-down{
width:100%;
display:block; margin:auto;
margin-top:-4%;

}


.line-QR-code{
width:20%;
margin-top:5%;
}




header{
margin-bottom:3%;  /*設定下邊界*/


}


nav{
margin-bottom:4%;

}

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

}

footer{
margin-top:1%;

}



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


.menu-picture{
width:50%;
}



.content-picture{
width:80%;
}




/*基本字體*/

p{font-size:130%;
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;

}






/*h1標題*/
h1{margin-top:6%;
font-size:150%;
font-family:新細明體;
color:#00BBFF;
text-align:center;
vertical-align:top;
line-height:100%;
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;
}


/*h2標題1*/
h2{margin-top:6%;
font-size:150%;
font-family:新細明體;
color:#BBFF00;
text-align:center;
vertical-align:top;
line-height:100%;
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:6%;
font-size:150%;
font-family:新細明體;
color:#FFFF77;
text-align:center;
vertical-align:top;
line-height:100%;
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;
}





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