@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);

body {
font:400 1.2rem/2rem Noto Sans TC , sans-serif ;
margin: 0;
box-sizing: border-box;
color: #1f1f1f;
background:;
}

h1,h2,h3 {font:400 1.2rem/2rem Noto Sans TC , sans-serif ;color:;}
h1 {text-align: center;font-size:2rem;}



h2 {
    margin:0 auto 20px;
    border-bottom: 3px solid #f39;
    padding: 16px 20px 16px 20px;
    line-height: 28px;
    background: #eee;
    font-size: ;
    color: #f39;
}
a {text-decoration:none;color:#555;border:none;}
a:hover{text-decoration:none;color:;}

img {max-width:100%;}

main {margin: 0 auto;overflow:hidden;width:90%;}

.slogan {font-style: italic;text-align:center;color:#c49;font-size:1.5rem;}
.slogan P::before  {content: "《 ";color:#CCC;}
.slogan p::after  {content: " 》";color:#CCC;}

/* 麵包屑 */
#breadcrumbs {width:100%;margin:1% auto;padding:;overflow:hidden;font-size:1rem;}
#breadcrumbs ul {margin:0;padding:0 0 0.8%;list-style:none;border-bottom:1px solid #ddd;overflow:hidden;}
#breadcrumbs li {float:left;margin:0  0 0;padding:0;background:;}
#breadcrumbs li:first-child {margin-left:0;padding:;}
#breadcrumbs li:first-child::before {content: '';}
#breadcrumbs li a {color:#c49;}
#breadcrumbs li::before  {content: "│";color:#ddd;}

/* list */
.list {overflow:hidden;}
.list ul {margin:0;padding:0;list-style:none;box-sizing: border-box;}
.list li {border:1px solid #ccc;margin:1% 0;padding:1% 2%;}
.list li a {color:;}
.list li a::after  {content: "　MORE";color:#c49;}




/* goods */
.goods {overflow:hidden;margin-bottom:;}
.goods ul {margin:0;padding:0;list-style:none;text-align:center;background:;overflow:hidden;box-sizing: border-box;}
.goods li {float:left;width:23.5%;border:1px solid #ccc;margin:0 2% 2.5% 0;padding:;box-sizing: border-box;border-radius:8px;background:;}
.goods li:nth-child(4n) {margin-right:0;}
.goods img {max-width:100%;border-radius:7px 7px 0 0;}
.goods p {line-height:;margin:0;padding:0 3%;
position:relative;
margin:0;
height:3em;
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.goods .price {padding:;margin:3% 0;color:#c00;display: inline-block;}
.goods .price::before  {content: '$ ';color:#aaa;}


.button {margin:0 auto;width:100%;overflow : hidden;box-sizing: border-box;text-align: center;}

.btn {
    display: inline-block;
    padding: 10px 15px;
    margin: 0 0 2%;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border-radius: 5px;
}

.btn-info {
    color: #fff;
    background-color: #f39;
    text-align: center;
}

.photo-center {text-align: center;}

#goods-header {overflow:hidden;border-bottom:1px #ccc solid;padding:20px 0;}

.goods-info {line-height:2rem;padding:0;}
.goods-info h1 {text-align:left;margin:0;}
#goods-header .price {padding:;margin:3% 0;color:#c00;display: inline-block;}
#goods-header .price::before  {content: '$ ';}

@media (min-width: 75em) {
.item {}

#goods-header .big-img {float:left;width:49%;line-height:;margin:0 2% 0 0;}
.goods-info {float:right;width:49%;}

#goods-header .botton {text-align: left;}

}

@media (max-width: 64em) {
.item {margin:0 1rem;}

.goods li {width:49%;margin:0 2% 2% 0;}
.goods li:nth-child(2n) {margin-right:0;}
#goods-header {text-align: center;}
#goods-header h1 {display: inline-block;}
}

/* 版權宣告 */
footer {width:100%;margin:0 auto;padding:20px 0;text-align: center;overflow:hidden;font-size:1rem;background:#111;color:#f2f2f2;}
footer p {padding:0 5%;}
footer ul {list-style:none;text-align: center;padding:0;}
footer li {display: inline-block;margin:10px;padding:0;}

/* 回頂部 */
.back-to-top {
display: none; /* 默認是隱藏的，這樣在第一屏才不顯示 */
position: fixed; /* 位置是固定的 */
bottom: 20px; /* 顯示在頁面底部 */
right: 30px; /* 顯示在頁面的右邊 */
z-index: 99; /* 確保不被其他功能覆蓋 */
outline: none; /* 不顯示外框 */
background-color: #f69; /* 設置背景背景顏色 */
color: #FFF; /* 設置文本顏色 */
cursor: pointer; /* 滑鼠移到按鈕上顯示手型 */
padding: 1rem 1.5rem; /* 增加一些內邊距 */
border-radius: 0px; /* 增加圓角 */
filter: alpha(opacity=70);opacity: 0.7;
}

.back-to-top:hover {
background-color: #f69; /* 滑鼠移上去時，反轉顏色 */
color: #fff;
filter: alpha(opacity=100);opacity: 1.0;
}