body,div,ul,ol,li,h1,h2,h3,p,tr,td,img{margin: 0;padding: 0;}
img { vertical-align:top;}
body{margin:0 auto;  background:url(images/bg.jpg) repeat #6b615a;} 
.content{margin:0 auto;}	
.main-area{ width:100%; max-width:950px; background:url(images/main_bg.jpg) repeat-y;}
.main-area > img{width: 100%;}
.footerHere{width: 100%; max-width: 950px;}
.footerHere > img{width: 100%;}
.title_p{display: none;}
h2{ display:block; margin-left:10px; padding-left:70px; background:url(images/icon.png) no-repeat; font-size:22px; font-family:"微軟正黑體"; line-height:1.7em; letter-spacing:1px; color:#575d5e;}


/* 商品區 */
.cms{background:#ffc2c5; padding-bottom:50px;}



/* 商品列 GROUP-TYPE-PH */
.group-type-ph{padding-top:20px;}
.ph{display:inline-block; position: relative; width:90%; margin: 5%; padding:0 0 30px 0 ; border:1px solid transparent; border-color:#ffffff; background:#ffffff; border:1px #ddddd3 solid;}
.ph:hover{cursor:pointer; background-color:#f8f7b4; border:1px #b7a788 solid; }

/* .ph-img{position:relative; z-index:3 !important; width:300px; height:200px; background:#000; border:0;} */
.ph-img > img{width:100%;}
/*.ph.masked .ph-img img{opacity:.6; filter:alpha(opacity=60);}*/
.ph a:link, .ph a:visited{position:relative; display:block; text-decoration:none;}
.ph-title{color:#2e4e54; padding:8px 0; letter-spacing:1px; line-height:22px; display:block; padding-left:0px; padding:10px; font-size:16px; font-family:"微軟正黑體";}
.ph-detail{ color:#e7458a; padding-left:10px; overflow:hidden; height:55px;}
.ph-feature{ color:#7c7c7c; padding-left:10px; padding-right:10px;}
.price{color:#d30808; font-size:11px; position: absolute; bottom: -20px; right: 5px;}
.price span{font-size:17px;}
.price span:after{ display:inline; font-size:11px; position:relative; top:-1px; font-weight:normal;}
.note{color:#888; line-height:1.5; margin:10px 20px;}
.note ul li{list-style-position:outside; margin-left:10px;}
.scroll2top:link, .scroll2top:visited{width:70px; height:70px; background:url(images/top_badge.png) no-repeat 0 -70px; margin-left:940px;}
.scroll2top:hover{background-position:0 0;}


@media  only screen and (min-width:767px){
    .ph{width:47%;margin:1%;}
    .title_m{display: none;}
    .title_p{display: block;}
}

@media  only screen and (min-width:960px){
    .ph{width:30%;margin:1%;}
    .ph:nth-child(odd){margin-left:2%;}
    .ph:nth-child(even){margin-right:0%;}
}

@media  only screen and (max-width:768px){
    .ph{width:90%;margin:5%;}
}