@charset "UTF-8";
/* 20211224_行銷活動專區UI調整 */
.promoHeadBlock{width: 100%; font: bold 19px/44px var(--main-font); color: #ffffff; text-align: center; background-color: var(--momo-color);}
.promoHeadBlock .titleLeftArrow {background: url(//m.momoshop.com.tw/img/returnIcon.png) no-repeat center center /auto 25px;display: inline-block;height: 44px;left: 0;position: absolute;width: 40px;}
.bannerBg{ width: 100%; height: 50px; background-color: var(--momo-color); border-radius: 0 0 50px 50px;}
.bannerDeepDarkBlueBg{ width: 100%; height: 65px; background-color: #5E6999; border-radius: 0 0 50px 50px;}
.bannerBlock{box-sizing: border-box;border-radius: 8px;margin: -50px 15px 15px 15px;box-shadow: rgba(0, 0, 0, 0.298) 2px 3px 10px 0px;}
.bannerBlock .bannerImg{width: 100%;line-height: 0;border-radius: 8px;}
.bannerBlock .bannerImg img{width: 100%;height: auto; border-radius: 8px 8px 0 0;}
.bannerBlock.noImage .bannerImg{display:none;}
.bannerBlock.noImage .actityInfo{border-radius:8px;}
.bannerBlock .actityInfo{display: inline-block;padding: 12px 10px;box-sizing: border-box;width: 100%;font-size: 0;background: #ffffff;border-radius: 0 0 8px 8px;}
.bannerBlock .actityInfo h2{display: block;color: #000000;font: bold 17px/28px var(--main-font);margin: 0 0 4px 0; position:initial;}
.bannerBlock .actityInfo b{display: inline-block;color: #333333;font: 13px/17px var(--main-font);margin: 0;width: 65px;vertical-align: top;}
.bannerBlock .actityInfo span{display: inline-block;color: #333333;font: 13px/17px var(--main-font);margin: 0;width: calc(100% - 65px);}
.bannerBlock .actityInfo span.activity-time { width: auto; text-indent: -5em; margin-left: 5em;}
.bannerBlock .actityInfo .activityThreshold span{overflow: visible;vertical-align: top;text-overflow: ellipsis;margin: 0;}
.bannerBlock .actityInfo .activityThreshold span:first-child{text-indent:65px;width: auto;}
.bannerBlock .actityInfo .activityNote{display: inline-block;font-size: 0;width: 100%;}
.bannerBlock .actityInfo .activityNote span{display: inline-block; width: calc(100% - 105px);}
.bannerBlock .actityInfo .activityNote span.overStep{overflow: hidden;vertical-align: top;text-overflow: ellipsis;margin: 0;white-space: nowrap;}
.bannerBlock .actityInfo .activityNote button{display: none;font: 13px/17px var(--main-font);border: none;color: var(--momo-color);margin: 0px;padding: 0 0 0 14px;background-color: unset;cursor: pointer;}
.bannerBlock .actityInfo .activityNote.showAll span{white-space: unset;width: calc(100% - 65px);}
.bannerBlock .actityInfo .activityNote.showAll button{display: none}

/* 20220401_滿件滿額贈UI調整 */
.bannerBlock .actityInfo .activityThreshold{display:flex;}
.bannerBlock .actityInfo .activityThreshold span.overStep{overflow: hidden;display: -webkit-box;text-overflow: ellipsis;margin: 0;-webkit-line-clamp: 4;-webkit-box-orient: vertical;word-break: break-all;}

/* 20250303_跨店折UI調整 */
/* 文字截斷容器 */
.truncate-text-container {
  position: relative;
  max-width: calc(100% - 65px); /* 設定容器的最大寬度 */
  height: auto; /* 自動調整高度 */
  display: inline-block;
}
/* 文字截斷樣式 */
.truncate-text-content {
  font-size: 13px;
  color: #333;
  line-height: 1.5em;
  display: -webkit-box;
  -webkit-line-clamp: 2; /* 限制顯示兩行文字 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 0;
}
/* 更多按鈕樣式 */
.truncate-action-button {
  position: absolute;
  background: rgb(255,255,255);
  background: linear-gradient(288deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 60%, rgba(255,255,255,0) 100%);
  border: 0;
  bottom: 0;
  right: 0;
  padding: 0 0 0 2.75em;
  font-size: 13px;
  color: #d62872;
  cursor: pointer;
  white-space: nowrap; /* 防止按鈕文字換行 */
  font-style: normal;
  display: none;
  height: 18px;
  line-height: 16px;
}
/* 使用 ::before 加上省略號在按鈕前 */
.truncate-action-button::before {
  content: "...";
  position: absolute;
  left: 1.2em; /* 按鈕前面的省略號位置 */
  top: 0px;
  font-size: 16px;
  color: #333;
}
/* 當展開時，移除截斷效果，並確保不影響其他樣式 */
.truncate-text-container.truncate-expanded .truncate-text-content {
  display: block;
  -webkit-line-clamp: unset;
  -webkit-box-orient: unset;
  overflow: visible;
  text-overflow: unset;
  white-space: normal;
}

/* 星評及評價數量 */
.star-box {height: 15px;display: flex;}
.itemizedStyle .ratingStars { padding: 0 10px 4px;}
.ratingStars .star { width: 15px; height: 15px; display: inline-block; box-sizing: border-box; background-size: cover; background-position: center; }
.ratingStars .star.starFull { background-image: url('//image.momoshop.com.tw/ecm/img/cmm/icon_star_full_24x24.svg'); }
.ratingStars .star.startHalf { background-image: url('//image.momoshop.com.tw/ecm/img/cmm/icon_star_half_24x24.svg'); }
.ratingStars .star.starOutline { background-image: url('//image.momoshop.com.tw/ecm/img/cmm/icon_star_outline_24x24.svg'); }
.ratingCounts { display: inline-block; vertical-align: middle; font-size: 11px; line-height: 15px; color: #b3b3b3; }
.ratingCounts .number { display: inline-block; vertical-align: bottom; overflow: hidden; text-overflow: ellipsis; max-width: 68px; width: auto;}

