@charset "UTF-8";

body {
    width: 100%;
    font-family: Arial, 微軟正黑體, sans-serif,  "Microsoft JhengHei", "LiHei Pro", 新細明體;
    font-size: 16px;
    color: #333333;
	overflow-y: scroll;
}

/*側選單*/
.sidebar {
	position: fixed;
	width: 110px;
	right: 0;
	top: 100px;
	display: none;
    z-index: 999;
}
.sidebar li a {
	font-size: 1.125em;
	line-height: 120%;
	text-align: center;
	color: #FFF;
	background-color: rgba(0,0,0,0.75);
	padding: 10px 0;
	margin: 0 auto;
	display: block;
}
.sidebar li a:link, sidebar li a:visited { color: #FFF; }
.sidebar li a:hover, sidebar li a:focus {
    color: #FFFF00; 
    background-color: #1768B7;
    -webkit-transition: all 0.4s linear;
	-moz-transition: all 0.4s linear;
	-ms-transition: all 0.4s linear;
	-o-transition: all 0.4s linear;
	transition: all 0.4s linear;
}
.sidebar li:nth-child(1) a { border-radius: 15px 0 0 0; }
.sidebar li:nth-child(5) a { border-radius: 0 0 0 15px; }

/*手機side  內頁side_page--------------------------------------------*/
.side, .side_page {
    width: 50px;
	position: absolute;
	right: 10px;
    bottom: 60px;
	cursor: pointer;
	display: none;
	z-index: 99999;
}
.side li, .side_page li {
	font-size: 1.8em;
	text-align: center;
	color: #FFF;
    background-color: rgba(0,0,0, 0.5);
}
.side li { color: #FFF; padding: 6px 0; }
/*
.side li:nth-child(1), .side_page li:nth-child(1) { border-radius: 10px 10px 0 0; }
.side li:nth-child(2), .side_page li:nth-child(2) { border-radius: 0 0 10px 10px; }
*/
.side li, .side_page li { border-radius: 5px; }

.side_page li { padding: 5px 0; }
.side_page li a:link, .side_page li a:visited { color: #FFF; }
.side li:hover, .side li:focus,
.side_page li:hover, .side_page li:focus { background-color: rgba(0,0,0, 0.75); }

@media screen and (max-width: 834px) {    
    .side_page { width: 50px; right: 5px; }
}
@media screen and (max-width: 480px) {
    .side, .side_page { width: 50px; right: 8px; bottom: 50px; }
    .side li, .side_page li { font-size: 1.5em; padding: 5px 0; }
}

/*手機選單*/
.sidenav {
    position: fixed; top: 0; left: 0;
    width: 0;
    height: 100%;
    text-align: center;
    background-color: #2F54D6;
    padding-top: 60px;
    transition: 0.5s;
    overflow-x: hidden;
    z-index: 99999;
}
.sidenav a {
    padding: 14px 10px;
    text-decoration: none;
    font-size: 1.6em;
    font-weight: bold;
    color: #FFF;
    display: block;
    transition: 0.3s;
}
.sidenav a:hover {
    color: #FFFF00;
}
.sidenav .closebtn {
    position: absolute; top: 0; right: 20px;
    font-size: 3em;
}


/*---------------------------------------------------------------
----------------------------------------------------------------*/
/*copyright*/
.copyright {
    width: 100%;
    font-size: 0.9em;
    line-height: 26px;
    text-align: center;
    color: #eaeaea;
    background-color: #666;
    padding: 5px 0;
}
.copyright img {
    height: 26px;
    padding: 0 10px 0 0;
}

@media screen and (max-width: 480px) { 
    .copyright { font-size: 0.7em; }
}
@media screen and (max-width: 320px) { 
    .copyright { font-size: 0.5em; }
}