#voucherPage #banners>a {
  color: black;
}
.catListTTImg{
  margin: 30px auto 5px;
}
#voucherPage .banner {
  border: 0px;
  box-shadow: 2px 7px 27px -9px rgba(0, 0, 0, 0.31);
  -webkit-box-shadow: 2px 7px 27px -9px rgba(0, 0, 0, 0.31);
  -moz-box-shadow: 2px 7px 27px -9px rgba(0, 0, 0, 0.31);
  text-align: center;
}

#voucherPage .banner1 .img {
  background: url(../images/page/banner-voucher.jpg) no-repeat center center;
  background-size: cover;
}
#voucherPage .banner1 .img2 {
  background: url(../images/page/banner-voucher2.jpg) no-repeat center center;
  background-size: cover;
  width: 51%;
}
#voucherPage .banner2{
  display: flex;
  flex-wrap: wrap;
}
#voucherPage .banner .info .bannerTT {
  color: #000000;
}
#voucherPage .banner .info .bannerTT.pink {
  color: #df8683;
}
#voucherPage .banner .info .bannerTT2 {
  font-size: 1.45rem;
  color: #000;
  font-weight: 800;
  letter-spacing: 1px;
  margin-bottom: 0.5rem;
}
#voucherPage .banner .info .bannerTT i {
  background: url(../images/03_Voucher/icon-voucher.png) no-repeat center center;
  background-size: contain;
  width: 37px;
  vertical-align: middle;
  margin: -5px 0.2em 0 -0.3em;
}

#voucherPage .banner .info .bannerTT .en {
  letter-spacing: 0;
}

#voucherPage .banner .info .bannerTT .tag {
  color: #000000;
  border: 1px solid;
  border-radius: 4px;
  display: inline-block;
  vertical-align: middle;
  line-height: 1.8;
  padding: 0 5px;
  font-size: .75rem;
}

#voucherPage .banner .info .code2 {
  display: inline-block;
  vertical-align: middle;
  padding: 0;
  margin: 0;
  font-size: 1.1rem;
}

#voucherPage .banner .info p {
  font-size: 1.25rem;
  color: #454545;
  font-weight: 600;
}

#voucherPage .banner .info .offerTT {
  background-color: #644C9E;
  vertical-align: middle;
  color: #fff;
  padding: 0 15px;
  margin: 0 auto .5rem;
  line-height: 1.8;
}

#voucherPage .banner .info .offerTT.red {
  background-color: #ED8080;
}
#voucherPage .banner .info .offerTT.brown {
  background-color: #bf9978;
}
#voucherPage .banner .info hr {
  margin: 1rem auto;
  max-width: 75%;
}

@media (min-width: 641px) {
  #voucherPage .banner {
    box-sizing: border-box;
  }
}

@media (max-width: 1000px) {
  #voucherPage #banners>.columns {
    -ms-flex: 0 0 100%;
    -webkit-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
}

@media (max-width: 640px) {
  #voucherPage .banner .info {
    padding: 20px 8%;
  }

  #voucherPage .banner .info .offerTT {
    margin-top: 0;
  }

  #voucherPage .banner .info .bannerTT {
    margin-bottom: 0.3em;
  }
}

@media (max-width: 320px) {
  #voucherPage .banner .info .bannerTT {
    font-size: 1.2rem;
  }
}

.anchorNav .filterBtn,
.anchorNav .allBtn {
  padding: 0.3em 3%;
  font-size: 1.2rem;
}

@media (min-width: 769px) {

  .anchorNav .filterBtn,
  .anchorNav .allBtn {
    font-size: 1.1rem;
    cursor: pointer;
  }
}

@media (min-width: 1028px) {

  .anchorNav .filterBtn,
  .anchorNav .allBtn {
    font-size: 1.2rem;
  }
}

.voucher {
  display: inline-block;
  vertical-align: top;
  text-align: left;
  margin: 0 .5em 1em;
  font-size: 1rem;
  width: 400px;
  background-color: #fff;
  border-radius: 10px
}

.voucher .vw .v {
  display: none
}

.voucher .vw .v.active {
  display: block
}

.voucher .btm .vw .v {
  margin-top: .8em
}

.voucher .img {
  height: 200px;
  position: relative;
  border-style: solid;
  border-width: 1px 1px 0 1px;
  border-color: #dfdfdf
}

.voucher .text {
  position: relative;
  padding: .85em 0 0 0;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  -ms-flex-flow: row wrap;
  -webkit-flex-flow: row wrap;
  flex-flow: row wrap;
  height: calc(100% - 200px)
}

.voucher .text .top {
  -ms-flex: 0 0 100%;
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
  padding: 0 1.25em
}

.voucher .text .name {
  font-size: 1.5em;
  letter-spacing: 0;
  color: #000;
  font-weight: 800;
  line-height: 1.2;
  margin: .3em 0 .4em
}

.voucher .text .subtags {
  font-size: .9em;
  color: #8c8c8c;
  line-height: 1;
  margin: .2em 0
}

.voucher .text .tt {
  color: #000;
  font-weight: 600;
  font-size: 1em;
  -webkit-line-clamp: 2;
  max-height: calc(1em * 1.5 * 2);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  position: relative;
  line-height: 1.5;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: .4em 0 0.4em 0;
  padding-left: 1em
}

.voucher .text .tt:before {
  content: "";
  display: block;
  left: 0;
  width: .3em;
  height: calc(1em * 1.5 * 2);
  background-color: green;
  position: absolute;
  top: 0
}

.voucher .text .desc p {
  font-size: .9em;
  color: #8a8a8a;
  -webkit-line-clamp: 3;
  max-height: calc(1em * 1.6 * 3);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  position: relative;
  line-height: 1.6;
  overflow: hidden;
  text-overflow: ellipsis
}

.voucher .text .desc p:first-child~*,
.voucher .text .desc ul,
.voucher .text .desc ul~* {
  display: none
}

.voucher .text .btm {
  -ms-flex: 0 0 100%;
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
  -ms-flex-align: end;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  align-self: flex-end;
  border-top: 1px dashed #bdbdbd;
  margin-top: 1em;
  padding: 0 1.25em 1.2em
}

.voucher .text .btm p {
  padding: .9em 0 .5em .2em;
  font-weight: 400;
  color: #8c8c8c
}

.voucher .text .btm p.vw1 {
  display: none
}

.vwPriceBtns.vw1 {
  display: none
}

.voucher .text .vwPriceBtns .morebtn,
.voucher .text .vwPriceBtns .priceBtn {
  cursor: pointer;
  position: relative;
  font-size: 1em;
  text-align: center;
  border-radius: 4px;
  line-height: 1.7;
  padding: 0 .8em;
  border: 1px solid;
  color: #bdbdbd;
  font-weight: 600;
  display: inline-block;
  vertical-align: top;
  margin-right: .2em;
  margin-bottom: .3em;
  background-color: #f9f9f9;
  z-index: 2;
}

.voucher .text .vwPriceBtns .priceBtn.active {
  color: #fff;
  background-color: #02a25a;
  border-color: #02a25a;
  cursor: default
}

.voucher .text .vwPriceBtns .morebtn {
  font-size: .9em;
  line-height: 1.94
}

.voucher .text .prices {
  display: inline-block
}

.voucher .text .prices .price {
  display: inline-block;
  vertical-align: bottom
}

.voucher .text .prices .price>span {
  display: inline-block;
  vertical-align: text-bottom;
  margin-right: .15em
}

.voucher .text .prices .price .discount {
  color: #009245;
  font-size: 2.5em;
  position: relative;
  font-weight: 800;
  line-height: 1;
  margin-right: .1em
}

.voucher .text .prices .price .original {
  color: #ed1c24;
  font-size: .9em;
  display: block;
  padding-left: 2px;
  text-decoration: line-through;
  font-style: italic;
  display: inline-block;
  letter-spacing: -1px
}

.voucher .text .prices .sold {
  color: #8a8a8a;
  font-size: 12px;
  padding: 0 5px;
  line-height: 1;
  display: inline-block;
  vertical-align: bottom;
  position: relative;
  top: -.2em;
  margin-left: 1em;
  border-left: 1px solid
}

.voucher .text .vlinkBtn {
  display: inline-block;
  border-radius: 5px;
  letter-spacing: 1px;
  padding: 0 .8em;
  line-height: 2.3;
  font-size: 1.1em;
  text-align: center;
  color: #fff;
  background-color: #00a25a;
  font-weight: 600;
  float: right
}

.voucher .tag {
  position: absolute;
  left: 15px;
  top: 10px;
  font-size: 1.5em;
  color: #fff;
  font-weight: 800;
  padding: 0 8px;
  background-color: #02a25a;
  border-radius: 3px;
  line-height: 1.8;
  text-align: center
}

@media (min-width: 769px) {
  
  .voucher .text .btm {
    border-radius: 0 0 10px 10px
  }

  .voucher .text .vwPriceBtns .priceBtn:hover {
    border: 1px solid red
  }

  .voucher .text .vlinkBtn:hover {
    background-color: #0ed87e
  }

  .voucher .img {
    border-radius: 10px 10px 0 0
  }

  .voucher .text {
    border-radius: 0 0 10px 10px;
    border-style: solid;
    border-width: 0 1px 1px 1px;
    border-color: #dfdfdf
  }

  .voucher .text .vwPriceBtns .morebtn,
  .voucher .text .vwPriceBtns .priceBtn {
    font-size: 1.1em;
    line-height: 1.9
  }

  .voucher .text .vwPriceBtns .morebtn {
    font-size: 1em;
    line-height: 2.1
  }

  .voucher .text .tt:hover {
    background-color: #f0fff7
  }
}

@media (min-width: 769px) {
  .voucher {
    width: 31%;
  }
}

@media (min-width: 1400px) {
  .voucher {
    width: 400px
  }
}

@media (min-width: 1500px) {
  .voucher .text .name {
    font-size: 1.7em
  }
}

@media (max-width: 1215px) and (max-width: 1280px) {
  .voucher {
    margin: 0 0.1em 1em;
  }
}

@media (max-width: 768px) {
  .voucher {
    width: 46%
  }

  .voucher .img {
    height: 170px;
  }
}

@media (max-width: 680px) {
  #resultList {
    min-height: 100vh
  }

  #resultList .list {
    padding: 2em 1em
  }

  #resultList .list .listing-catTT {
    display: none
  }

  .voucher {
    margin: 0 0 .5em;
    width: 100%
  }

  .voucher .tag {
    font-size: 1.4em
  }

  .voucher .text .name {
    font-size: 1.4em
  }

  .voucher {
    border-bottom: 2px solid #dfdfdf
  }

  .voucher .text .tt {
    -webkit-line-clamp: initial;
    max-height: 100%;
    display: inline-blcok;
    overflow: initial;
    text-overflow: initial
  }

  .voucher .text .tt:before {
    height: 100%
  }
  #voucherPage .banner .info{
    width: 100%;
    order: 2;
  }
  #voucherPage .banner1 .img2{
    height: 313px;
    width: 100%;
    order: 1;
  }
}

@media (max-width: 480px) {
  .voucher .img {
    height: 197px
  }
}

@media (max-width: 400px) {
  .voucher .img {
    height: 185px
  }
}

@media (max-width: 320px) {
  .voucher .text .name {
    font-size: 1.3em
  }

  .voucher .img {
    height: 160px
  }
}

/*doris 20230914 */
  
#campaigns {/*background: url(https://static6.orstatic.com/info/orpay-hotpot2021/images/bg-brown.jpg);*/
  /* background-color: #ffd626;  */
  background: rgb(240,231,200);
background: linear-gradient(180deg, rgba(240,231,200,1) 0%, rgba(243,236,218,1) 35%, rgba(228,209,174,1) 100%);
  margin: 0!important; 
  padding: 30px 0 0; 
  position: relative; 
  max-width: none!important;}
#campaigns .containerL {max-width: 1300px; position: relative;}
/*#campaigns:before {content: ''; display: block; position: absolute; left: 0; bottom: 100%; width: 100%; height: 50px; background: url(https://static6.orstatic.com/info/orpay-hotpot2021/images/wave-2.png) repeat-x center bottom;}*/
/*#campaigns .ttImg {max-width: 350px; padding-bottom: 8%; margin: 0 auto 30px; background: url(https://static5.orstatic.com/info/orpay-hotpot2021/images/title_BU.png) no-repeat center center; background-size: contain; }*/
#campaigns h1 {
  text-align: center; 
  color: #5E4821;
  letter-spacing: -1px; 
  /* font-size: 1.9rem; */
  margin: 30px 0 ; }


@media (max-width: 768px) {
#campaigns {padding-top: 50px!important; padding-bottom: 50px!important; }
#campaigns:before {background-size: 1000px; height: 25px; bottom: auto; top: -24px;}
#campaigns .ttImg { margin-bottom: 30px; max-width: 240px; padding-bottom: 15%;}
#campaigns h1 {font-size: 1.5rem; margin: 0 0 30px 0; }
}
