@charset "UTF-8";

body {
	width: 100%;
	font-family: Arial, 微軟正黑體, sans-serif,  "Microsoft JhengHei", "LiHei Pro", 新細明體;
	font-size: 16px;
	color: #333333;
	background-color: #325ee7;
	overflow-y: scroll;
}
.wrapper { width: 100%; }
section { position: relative; width: 100%; padding: 0; margin: 0; }
.float-left { float: left; }
.float-right { float: right; }
.hide { display: none; }
*:after, *:before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}


/*側選單--------------------------------------------*/
.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: #4F7511;
    -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, .side_page {
    width: 60px;
	position: absolute;
	right: 10px;
    bottom: 60px;
	cursor: pointer;
	display: none;
	z-index: 999;
}
.side li, .side_page li {
	font-size: 2em;
	text-align: center;
	color: #FFF;
	background-color: rgba(0,0,0, 0.5);
}
.side li { color: #FFF; border-radius: 10px; padding: 10px 0; }

/*side_page*/
.side_page li { padding: 5px 0; }
.side_page li a:link, .side_page li a:visited { color: #FFF; }
.side_page li:hover, .side_page li:focus { background-color: rgba(0,0,0, 0.8); }
.side_page li:nth-child(1) { border-radius: 10px 10px 0 0; }
.side_page li:nth-child(2) { border-radius: 0 0 10px 10px; }

@media screen and (max-width: 1440px) {    
    .sidebar li a:link, .sidebar li a:visited {	font-size: 1em; }
}
@media screen and (max-width: 1280px) { 
    .sidebar { width: 100px; }
    .sidebar li { font-size: 1em; }
}
@media screen and (max-width: 834px) {    
    .side_page { width: 50px; right: 5px; }
}
@media screen and (max-width: 480px) {
    .side_page { width: 40px; right: 5px; bottom: 40px; }
    .side_page li {	font-size: 1.5em; padding: 5px 0; }
}


/*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: 1em; }
}
@media screen and (max-width: 320px) { 
    .copyright { font-size: 0.8em; }
}


/*購物車按鈕--------------------------------------------*/
.cart { width: 70%; text-align: center; margin: 0 auto;}
.pointer { cursor: pointer; }
.width120 { width: 100%;}
.button02, .button03, .button04 {
	height: 40px;
	text-align: center;
	border-radius: 3px;
}
.button02 span, .button03 span, .button04 span {
	font-size: 0.9em;
    line-height: 38px;
}

/*02--放入購物車*/
.button02 {
	color: #17A6F8;
	background-color: #FFF;
	border: 1px solid #17A6F8;
}
.button02:hover, .button02:focus {
	color: #FFFFFF;
	background-color: #17A6F8;
	border: 1px solid #17A6F8;
}

/*03--已放入購物車*/
.button03 {
	color: #FFFFFF;
	background-color: #999999;
	border:1px solid #999999;
	cursor: default;
}

/*04--已售完，補書中/新書尚未入庫/不開放訂購*/
.button04 {
	color: #666666;
	background-color: #FFFFFF;
	border:1px solid #666666;
	cursor: default;
}

@media screen and (max-width: 1280px) {
    .cart { width: 85%; }
    .button02 span, .button03 span, .button04 span { font-size: 0.8em; }
}
@media screen and (max-width: 834px) {
    .button02 span, .button03 span, .button04 span { font-size: 0.8em; }    
}
@media screen and (max-width: 480px) {
    .button02 span, .button03 span, .button04 span { font-size: 0.9em; } 
}