body { background:url(images/bg2.jpg) repeat #fbece3;}
#append-btn, #append-list{display:none !important;}
img{vertical-align:top;}
.content{width:auto; margin:0 auto; text-align:center; background:url(images/content_bg.png) repeat-x center top; padding:0 0 30px 0;}
/*主視覺*/
.visual{width:auto; margin:0 auto; background:url(images/visual_bg.png) no-repeat center top; }
.vd{margin:0 auto; width:100%; text-align:center; }
.vd img{max-width:100%;}
/*menu*/
.menubar{margin:0 auto; text-align:center; width:auto;  position:relative; background:url(images/menu_bg.png) repeat-x center top; height:65px;}

.menubar ul{list-style-type:none; text-align:center; margin:0 auto; width:950px; padding-top:9px;  }
.menubar ul li{display:block; float:left; text-decoration:none; margin:0 3px;}
.menubar li + li{}
.menubar li a, .menubar li a:link, .menubar  li a:visited{color:#FFFFFF; font-family:'微軟正黑體','Microsoft JhengHei','新細明體','PMingLiU',Arial,sans-serif; font-weight:bold; font-size:19px; text-shadow:0 1px 1px #e42624;  padding:6px 9px; border-radius:4px; text-decoration:none;}
.menubar li.active a, .menubar li:hover a{background-color:#a76a5c; text-shadow:none; text-decoration:none;} 

/* 黏住時 */
.fixing .menubar{position:fixed; width:100%; top:0; z-index:9998 !important;}

/*介紹文*/
.foreword, .product{margin:0 auto; width:950px; box-sizing:border-box; font-family:'微軟正黑體','Microsoft JhengHei','新細明體','PMingLiU',Arial,sans-serif;  }
.foreword h3, h3.g-doc, .product h3{border-left:7px solid #011f92; color:#333; font-size:24px; padding:0 0 0 14px; margin:20px 0 10px;  text-align:left; }
.foreword p{color:#663c32; font-size:18px; padding-left:20px; text-align:left; margin:20px 0;}
.foreword img{ margin:5px 5px 20px; width:300px; height:200px;}
/*step2-嵌入*/
.foreword iframe{  
  top: 0;
  left: 0;
  width: 100%;
  height: 650px; margin:30px 0; }
  .order{ display:block; text-align:right; padding-right:3px;}
.order a, .order a:link, .order a:visited, .order a:hover{ display:inline-block; background:url(images/buy.png) no-repeat left top; width:152px; height:40px; margin:0 0 0 6px; font-size:22px; font-weight:bold; text-decoration:none; color:#fff; vertical-align:middle; text-align:center; letter-spacing:1px;}
.order a:hover{ background:url(images/buy.png) no-repeat left -40px;}
.order a span{ display:block; padding-top:3px;}
.order a:hover span{padding-top:4px;}
/*注意事項*/
.noteic{margin:0 auto; width:100%; padding:0px 20px 0; text-align:left; font-size:14px; line-height:1.8em;}
.noteic h4{ font-size:16px;}
.noteic ol {margin-left:20px;}
.noteic ol li{list-style-position:outside;}
/* +時刻表按鈕*/
h3.g-doc span{margin:5px 5px 0 5px; display:inline-block;  }
h3.g-doc span a, h3.g-doc span a:link, h3.g-doc span a:visited{ padding:3px 5px; color:#FFF; background-color:#489ff6; border-radius:3px; font-size:16px; font-family:'微軟正黑體','Microsoft JhengHei','新細明體','PMingLiU',Arial,sans-serif; margin-left:5px;}
h3.g-doc span a:hover{ color:#FFF; background-color:#06c; text-decoration:none;}

/*商品*/
.product h3{border-left:none; background:url(images/p01.png) no-repeat; padding:0 0 0 32px; }
/*C26*/
.ph{font-size:20px; font-family:'微軟正黑體','Microsoft JhengHei','新細明體','PMingLiU',Arial,sans-serif; margin-top:10px; position:relative; }
.ph-img{display:none;}
.ph-title{ margin-bottom:10px;}
.group-type-ph{ font-size:18px;  margin:0 0 15px 8px; width:100%; text-align:left; }

.group-type-ph a, .group-type-ph a:link, .group-type-ph a:visited{color:#06c; display:block; text-decoration:none; padding:.5em 1em;  border-bottom:1px #bbb79e dashed; height:230px; overflow-y:hidden;}
.group-type-ph a:hover, .group-type-ph a:active{ background:#eac5c5;  }
.ph-detail{color:#996666; font-size:18px; }
.ph-detail img{ float:left; margin-right:10px; width:240px; height:160px;}
.ph-detail var{ font-size:14px; font-style:normal; background:#ff95cc; border-radius:4px; color:#FFF; padding:2px 5px 3px; }
.group-type-ph a:hover .ph-detail{color:#545454; }
/* .ph-feature{color:#545454; font-size:15px; width:86%;}*/
.ph-feature{ position:absolute; z-index:3; right:10px; bottom:20px;}
.price{position:absolute; z-index:5; right:15px; bottom:64px;}
.price, .price i{ color:#C00; font-style:normal; float:right; font-size:16px; margin-top:8px;}
.price span{ font-size:24px;}




/* fixed bottom bar */
.navbar-fixed-bottom{border-top:1px solid #dedede; height:50px; padding:0 30px; z-index:600 !important; background:#f98782; background:rgba(249,135,130,.87);}
.btn-top, .ad-md, .ad-sm{float:right; vertical-align:middle;}
.btn-top:link, .btn-top:visited{margin:3px 0 0 8px; width:72px; height:42px; text-align:center; font-weight:bold; color:#5d5d5d; border-radius:2px; background:#fff;
background: -webkit-linear-gradient(top, rgba(253,253,253,1) 0%, rgba(246,246,246,1) 38%, rgba(221,221,221,1) 100%);
background: linear-gradient(to bottom, rgba(253,253,253,1) 0%, rgba(246,246,246,1) 38%, rgba(221,221,221,1) 100%);
-webkit-box-shadow:inset 0 0 3px 2px rgba(255,255,255,.5); box-shadow:inset 0 0 3px 2px rgba(255,255,255,.5); 
}
.btn-top b{display:block; width:20px; height:8px; background:url(images/btn_top_arr.png) no-repeat center bottom; margin:9px auto 0;}
.ad-md, .ad-sm{margin:5px 0 0;}
.ad-sm{display:none;}
.btn-push:link, .btn-push:visited{display:inline-block; vertical-align:middle; width:130px; height:40px; margin:5px 0 0; padding-left:45px; background:url(images/btn_push.png) no-repeat 0 -40px; color:#fff; line-height:40px; font-size:18px; font-weight:bold;  text-shadow:0 1px 1px #e42624;}
.btn-push:hover{text-decoration:none;}
.btn-push.pressed{background-position:0 0; text-decoration:none;}
.drawer{position:fixed; padding-bottom:50px; width:100%; height:0; bottom:0; opacity:0; z-index:400; -webkit-transition:opacity 0.35s ease; transition:opacity 0.35s ease;}
.drawer.lifted{display:block; height:auto; opacity:1;}
.drawer a:link, .drawer a:visited{margin:0 30px; padding:10px 5px 10px 25px; font-size:15px; display:block; background:#a76a5c url(images/drawer_link_arr.png) no-repeat 10px center; color:#fff; border-top:1px solid #f98782;}
.drawer a:hover, .drawer a:active{background-color:#eac5c5; color:#000;}


/**RWD**/
@media (min-width: 1200px) {
}

@media (min-width: 767px) and (max-width: 949px){
.content{ background:none;}
.menubar ul{width:100%; }
.menubar li a, .menubar li a:link, .menubar  li a:visited{font-size:18px;}
.foreword, .product{margin:0 auto; width:100%; padding:0 20px;}
.foreword img{width:30%; height:30%; }
.foreword iframe{  
   height: 520px;}
        .order{ text-align:center; }

}




@media (min-width: 640px) and (max-width: 766px){
.content{ background:none;}
.menubar{display:none;}
.menubar li a, .menubar li a:link, .menubar  li a:visited{font-size:18px;}
.foreword, .product{margin:0 auto; width:100%; padding:0 20px;}
.foreword img{ width:80%; height:80%;}
.group-type-ph a, .group-type-ph a:link, .group-type-ph a:visited{color:#06c; display:block; text-decoration:none; padding:.5em 1em;  border-bottom:1px #bbb79e dashed; height:270px;  overflow-y:none; }
.price{position:absolute; z-index:5; right:150px; bottom:22px;}
.foreword iframe{  
   height: 480px;}
     .order{ text-align:center; }

}


@media (min-width: 500px) and (max-width: 639px){
.content{ background:none;}
.menubar{ display:none;}
.foreword, .product{margin:0 auto; width:100%; padding:0 20px;}
h3.g-doc{ font-size:18px;}
h3.g-doc span a, h3.g-doc span a:link, h3.g-doc span a:visited{ font-size:14px;}
.foreword img{ width:100%; height:100%;}
.group-type-ph a, .group-type-ph a:link, .group-type-ph a:visited{color:#06c; display:block; text-decoration:none; padding:.5em 1em;  border-bottom:1px #bbb79e dashed;  height:auto;  overflow-y:none; }
.ph-feature{display:none;}
.price{ position: relative; right:0px; bottom:0px;}
.foreword iframe{  
   height: 480px;}
        .order{ text-align:center; }


}

@media (max-width: 499px){
.content{ background:none;}	
.menubar{ display:none;}
.foreword, .product{margin:0 auto; width:100%; padding:0 20px;}
h3.g-doc{ font-size:18px;}
h3.g-doc span a, h3.g-doc span a:link, h3.g-doc span a:visited{ font-size:14px;}
.foreword img{ width:100%; height:100%;}
.group-type-ph a, .group-type-ph a:link, .group-type-ph a:visited{color:#06c; display:block; text-decoration:none; padding:.5em 1em;  border-bottom:1px #bbb79e dashed; height:auto; overflow-y:hidden;}

.ph-detail{color:#996666; font-size:16px; }
.ph-detail img{ width:50%; height:50%; }
.ph-feature{display:none;}
.price{ position: relative; right:0px; bottom:0px;}
.foreword iframe{  
   height: 400px;}
        .order{ text-align:center; }
}