|
| | |
|
%html%
/* 自定義css _start_ */
#hoverMask, .hoverMask {
position : absolute;
background-image : url(/main/uploads/wistariateahouse/template/us_UserTemplate2/images/bg_white.png);
background-repeat : repeat;
line-height : 25px;
color : #7e2b0d;
font-size : 16px;
font-weight : bold;
text-align : center;
box-sizing : border-box; /* 應該設定為padding-box，但Chrome不支援 */
-moz-box-sizing : border-box;
-webkit-box-sizing : border-box;
display : none;
border-radius : 50%;
cursor : pointer;
}
#hoverMask, .hoverMask div {
display:table-cell;
width:200px; height:200px; vertical-align:middle; text-align:center;
}
#infoDiv {
position : absolute;
width : 800px;
height : 500px;
z-index : 101;
padding : 0px;
display : none;
opacity : 1;
overflow : auto;
overflow-x : hidden;
-webkit-overflow-scrolling:touch;
}
#infoFrame {
width : 100%;
min-width : 100%;
*width : 100%;
}
#infoClose {
position : absolute;
width : 30px;
height : 30px;
right : 10px;
top : 10px;
z-index : 102;
}
#modalBg {
position : fixed;
//background-image : url(/main/uploads/wistariateahouse/template/us_UserTemplate2/images/bg_white.png);
//background-repeat : repeat;
left : 0px;
top : 0px;
width : 100%;
height : 100%;
z-index : 100;
display: none;
background-color: rgba(0,0,0,0.5);
}
/* 自定義css _end_ */
/* 產品分類選單 */
#prdClassMenu{
width: 150px;
padding-left: 47px;
padding-top: 20px;
}
#prdClassMenu .sub {
display:inline-block;
padding-top: 10px;
border-top: solid 1px black;
/* margin-top:10px; */
}
#prdClassMenu .sub div{
display:inline-block;
margin-right:6px;
margin-left:6px;
}
#prdClassMenu .sub div:last-child{
margin-right:0 !important;
}
#prdClassMenu div {
width: 24px;
height: 140px;
background-repeat: no-repeat;
background-position: 0 0;
margin-bottom:10px;
}
#prdClassMenu div:hover , #prdClassMenu div.actived {
background-position: -24px 0;
cursor: pointer;
}
#prdClassMenu .master{
margin-left:50px;
}
#prdClassMenu .PrdClass_ZC911042{
background-image: url('/main/uploads/wistariateahouse/MsgInfo/PrdClass_ZC911042.png');
height: 120px;
}
#prdClassMenu .PrdClass_ZC711043{
background-image: url('/main/uploads/wistariateahouse/MsgInfo/PrdClass_ZC711043.png');
}
#prdClassMenu .PrdClass_ZC211045{
background-image: url('/main/uploads/wistariateahouse/MsgInfo/PrdClass_ZC211045.png');
height: 100px;
}
#prdClassMenu .PrdClass_ZC911046{
background-image: url('/main/uploads/wistariateahouse/MsgInfo/PrdClass_ZC911046.png');
height: 100px;
}
#prdClassMenu .PrdClass_ZC511047{
background-image: url('/main/uploads/wistariateahouse/MsgInfo/PrdClass_ZC511047.png');
height: 100px;
}
#prdClassMenu .PrdClass_ZC410832{
background-image: url('/main/uploads/wistariateahouse/MsgInfo/PrdClass_ZC410832.png');
height: 60px;
}
#prdClassMenu .PrdClass_ZC911044{
background-image: url('/main/uploads/wistariateahouse/MsgInfo/PrdClass_ZC911044.png');
}
#prdClassMenu .sub {
display: none;
}
/* 產品分類選單 */
.PrdList { border:1px solid transparent; } /* 務必有這個 border，在 firefox,、ie 才不會有問題。 */
.PrdList .divCell { margin-right:36px; margin-bottom:30px; overflow:hidden; }
.PrdList .liCell { text-align:center; padding:0px; border:0px solid #dddddd; overflow:hidden; }
.PrdList .liCellL {}
.PrdList .liCellR {}
.PrdList .liCellT {}
.PrdList .liCellB {}
.PrdList .ColN_1 {}
.PrdList .ColN_2 {}
.PrdList .ColN_3 {}
.PrdList .ColN_4 {}
.PrdList .ColN_5 {}
.PrdList .ColN_6 {}
.PrdList .ColN_7 {}
.PrdList .ColN_8 {}
.PrdList .PrdListCont { text-align:center; width:210px; height: 260px;}
.PrdList .PrdCell { width:100%; }
.PrdList .PrdCell a {}
.PrdList .PrdCell a:hover { color:#000000; }
.PrdList .PrdCell .PrdImgM {
margin-bottom: 8px;
border-radius: 50%;
overflow: hidden;
vertical-align: middle;
/*-webkit-transition: width 2s, height 2s, -webkit-transform 2s;*/
/*transition: width 2s, height 2s, transform 2s;*/
width: 200px;
height: 200px;
}
.PrdList .PrdCell .PrdImgM:hover img { /*transition: width 2s, height 2s, transform 2s;*/ /*transform: scale(2.0);*/ }
.PrdList .PrdCell .PrdImgM img {
max-width: 200px;
width: 100%;
height: 100%;
object-fit: cover;
}
.PrdList .ColN_2 .PrdCell .PrdImgM img {}
.PrdList .ColN_3 .PrdCell .PrdImgM img {
/**========12/16=============*/
object-position: center;
height: 100%;
width: 100%;
object-fit: cover;
height: 200px;
}
.PrdList .ColN_4 .PrdCell .PrdImgM img {}
.PrdList .ColN_5 .PrdCell .PrdImgM img {}
.PrdList .ColN_6 .PrdCell .PrdImgM img {}
.PrdList .ColN_7 .PrdCell .PrdImgM img {}
.PrdList .ColN_8 .PrdCell .PrdImgM img {}
.PrdList .PrdCell .PrdContent { margin-bottom:4px; }
.PrdList .ColN_2 .PrdCell .PrdContent {}
.PrdList .ColN_3 .PrdCell .PrdContent {}
.PrdList .ColN_4 .PrdCell .PrdContent {}
.PrdList .ColN_5 .PrdCell .PrdContent {}
.PrdList .ColN_6 .PrdCell .PrdContent {}
.PrdList .ColN_7 .PrdCell .PrdContent {}
.PrdList .ColN_8 .PrdCell .PrdContent {}
.PrdList .PrdCell .PrdTitle {
line-height:125%;
color:#666666;
display: block !important;
}
.PrdList .PrdCell .PrdDesc { display:none;line-height:125%; margin-bottom:4px; color:#666666; text-align:center; }
.PrdList .PrdCell .PrdPrice { margin-bottom:4px; display:none;}
.PrdList .PrdCell .PrdPriceHint{ display:none;}
.PrdList .PrdCell .PriceName {}
.PrdList .PrdCell .DollarSign { color:#ff0000; }
.PrdList .PrdCell .PriceAmt { color:#ff0000; font-weight:bold; }
.PrdList .PrdCell .DollarUnit {}
.PrdList .PrdCell .PrdCtrl { margin-bottom:8px; display:none;}
.PrdList .PrdCell .PrdQty {}
.PrdList .PrdCell .PrdBtn {}
.PrdList .PrdCell .PrdExt {}
.PrdList .divCell a:hover { text-decoration:none; }
.PrdList .PrdCell .PrdImgM img { max-width:200px; }
/* 預設 */
.PrdList .SaleBtn1 { border:1px solid #aa0000; background:#cc0000; color:#ffffff; padding-left:4px; padding-right:4px; white-space:nowrap; cursor:pointer; }
/* 正常 */
.PrdList .SaleBtn2 { border:1px solid #aa0000; background:#cc0000; color:#ffffff; padding-left:4px; padding-right:4px; white-space:nowrap; cursor:pointer; }
/* 預購 */
.PrdList .SaleBtn3 { border:1px solid #0000aa; background:#000088; color:#ffff00; padding-left:4px; padding-right:4px; white-space:nowrap; cursor:pointer; }
/* 郵購 */
.PrdList .SaleBtn4 { border:1px solid #0000aa; background:#000088; color:#ffff00; padding-left:4px; padding-right:4px; white-space:nowrap; cursor:pointer; }
/* 補貨 */
.PrdList .SaleBtn5 { border:1px solid #006600; background:#008800; color:#ffffff; padding-left:4px; padding-right:4px; white-space:nowrap; cursor:pointer; }
/* 停售 */
.PrdList .SaleBtn6 { border:1px solid #666666; background:#888888; color:#ffffff; padding-left:4px; padding-right:4px; white-space:nowrap; }
/* 售完 */
.PrdList .SaleBtn7 { border:1px solid #666666; background:#888888; color:#ffffff; padding-left:4px; padding-right:4px; white-space:nowrap; }
/* 競標 */
.PrdList .SaleBtn8 { border:1px solid #aa0000; background:#cc0000; color:#ffff00; padding-left:4px; padding-right:4px; white-space:nowrap; cursor:pointer; }
/* 推薦 */
.PrdList .PrdListExtBtn { border:1px solid #998800; background:#aa8800; color:#ffffff; padding-left:4px; padding-right:4px; white-space:nowrap; cursor:pointer; }
/* 紅利兌換 */
.tableExchg { width:100%; }
.tableExchg th , .tableExchg td { padding-top:2px; padding-bottom:2px; padding-left:4px; padding-right:4px; white-space:nowrap; font-weight:normal; color:#444444; border-radius:4px; }
.tableExchg th { text-align:center; background:#dddddd; }
.tableExchg td { text-align:center; }
.tableExchg .tdExchgBtn div { border-radius:4px; background:#cc0000; color:#ffffff; padding-left:4px; padding-right:4px; text-align:center; }
.tableExchg .tdExchgBtn div:hover { background:#ff0000; cursor:pointer; }
.tableExchg .spanExchgPt , .tableExchg .spanExchgAmt { font-weight:bold; color:red; }
/* Responsive 這邊只允許調整Content區的內容，Header、Footer和Copyright區域的CSS不可在此處調整 */
/* .PrdList .divCell {height:180px !important;} */
@media screen and (max-width:800px){
.PrdList .PrdListCont{height: 270px;}
.PrdList .PrdCell .PrdImgM { width: auto; }
}
@media screen and (max-width:680px){
.PrdList .PrdListCont{width: unset; height: unset;}
.PrdList .divCell{margin: 0 0 20px; width: 50%;}
}
@media screen and (max-width:400px){
.PrdList .divCell{width: 100%;}
}
.PrdList .PrdCell .PrdImgM { display:$PrdListPrdImgMDisp$; }
.PrdList .PrdCell .PrdTitle { display:$PrdListPrdTitleDisp$; }
.PrdList .PrdCell .PrdDesc { display:$PrdListPrdDescDisp$; }
.PrdList .PrdCell .PrdPrice { display:$PrdListPrdPriceDisp$; }
.PrdList .PrdCell .PriceName { display:$PrdListPriceNameDisp$; }
.PrdList .PrdCell .PrdQty { display:$PrdListPrdQtyDisp$; }
.PrdList .PrdCell .PrdBtn { display:$PrdListPrdBtnDisp$; }
.PrdList .PrdCell .PrdExt { display:$PrdListPrdExtDisp$; }
.PrdList .PrdCell .PrdTitle { font-family:$PrdListTitleFont$; color:$color$; font-size:$size$; font-style:$style$; font-weight:$weight$; }
.PrdList .PrdCell .PrdDesc { font-family:$PrdListDescFont$; color:$color$; font-size:$size$; font-style:$style$; font-weight:$weight$; }
.PrdList .PrdCell .PriceName { font-family:$PrdListNameFont$; color:$color$; font-size:$size$; font-style:$style$; font-weight:$weight$; }
.PrdList .PrdCell .PriceAmt { font-family:$PrdListAmtFont$; color:$color$; font-size:$size$; font-style:$style$; font-weight:$weight$; }
.PrdList .liCell { padding:$PrdListPadding$; }
.PrdList .liCell { border:$PrdListBorder$; }
.PrdList .divCell { width:$PrdListDivW$; }
.PrdList .liCell { height:$PrdListDivH$; }
.PrdList .divCell { border:$PrdListDivB$; }
.PrdList .divCell { padding:$PrdListDivP$; }
.PrdList .divCell { margin-right:$PrdListDivL$; }
.PrdList .divCell { margin-bottom:$PrdListDivT$; }
| |
| | |
#PageCtrl { font-family:sө; text-align:center; }
#PageCtrl a { color:#666666; }
#PageCtrl a:hover { color:#ff6622; }
#PageCtrl .PageBtn { margin-left:3px; margin-right:3px; }
#PageCtrl .OtherPage {}
#PageCtrl .ThisPage { color:#000000; font-weight:bold; }
#PageCtrl .RecCount { font-weight:bold; }
|
|
| |
