.container.full-width {
    padding-left: 0;
    padding-right: 0;
}

html {
    overflow-x: hidden;
}

/* 背景圖 */
.event-wrap {
    width: 100%;
    font: 16px/1.6 Helvetica, 微軟正黑體, 新細明體, Heiti TC, 黑體, sans-serif, serif;
    color: #000;
    margin: 0 auto;
    overflow: hidden;
    /* -webkit-overflow-scrolling: touch; */
}
@media screen and ( min-width: 769px) {
    .event-wrap,
    .container {
        max-width: 640px;
    }
}
.bgRibbon{
    background-image: url(../images/bgRibbon.png);
    background-repeat: no-repeat;
    width: 100%;
    height: auto;
    margin: 0 auto;
    background-size: cover;
    background-position:center;
    background-repeat: no-repeat;
    background-size: 100% auto;
}
@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .bgRibbon {
        background-image: url(../images/bgRibbon@2x.png);
    }
}

.bg-deep-orange{
    background: #FFF1DD;
}
.bg-light-orange{
    background: #FFF8ED;
}
.bgEntrancepage {
    background-image: url(../images/bgEntrancepage.png);
    background-repeat: no-repeat;
    min-width: 375px;
    width: 100%;
    height: 336px;
    margin: 0 auto;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    padding-bottom: 89%;
    position: relative;
    background-size: 100% auto;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .bgEntrancepage {
        background-image: url(../images/bgEntrancepage@2x.png);
    }
}
.bgStatusEnd {
    background-image: url(../images/bgStatusEnd.png);
    background-repeat: no-repeat;
    margin: 0 auto;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    padding-bottom: 130%;
    position: relative;
    background-size: 100% auto;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .bgStatusEnd {
        background-image: url(../images/bgStatusEnd@2x.png);
    }
}
.bgStatusEmpty {
    background-image: url(../images/bgStatusEmpty.png);
    background-repeat: no-repeat;
    margin: 0 auto;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    padding-bottom: 130%;
    position: relative;
    background-size: 100% auto;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .bgStatusEmpty {
        background-image: url(../images/bgStatusEmpty@2x.png);
    }
}
.imgMoneybagDuringWeb {
    background-image: url(../images/imgMoneybagDuringWeb.png);
    background-repeat: no-repeat;
    margin: 0 auto;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    padding-bottom: 60%;
    position: relative;
    background-size: 100% auto;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .imgMoneybagDuringWeb {
        background-image: url(../images/imgMoneybagDuringWeb@2x.png);
    }
}
.bold {
    font-weight: bold;
}

.event-form-group {
    margin-bottom: 25px;
}

.event-form-group label {
    font-size: 14px;
    color: #858585;
    font-weight: normal;
    padding-left: 12px;
}

.event-input {
    height: 44px;
    border-radius: 22px;
    text-align: center;
    box-shadow: none;
    box-shadow: none;
}

.form-control.event-input.with-send {
    padding-right: 12%;
}
.form-control.event-input {
    font-size: 18px;
}
.verify-code-img {
    display: inline-block;
}

.error-tip {
    font-size: 14px;
    color: #de5858;
    text-align: right;
    padding-right: 12px;
}

.verify-code-img img {
    height: 21px;
    width: 91px;
}

.btn-green {
    width: 100%;
    font-size: 17px;
    background: #fff;
    color: #00a8b8;
    display: block;
    text-align: center;
    border: 2px solid #00a8b8;
    height: 52px;
    border-radius: 26px;
    padding: 12px;
    /* margin-top: 10px; */
}

.btn-green:disabled {
    border-color: #909090;
    color: #909090;
}

.btn-green:hover,
.btn-green:focus {
	/* comment by Green
    color: #00a8b8;
    text-decoration: none;
    */
}
/* add by Green */
.btn-disabled {
    width: 100%;
    font-size: 17px;
    background: #fff;
    color: #9B9B9B;
    display: block;
    text-align: center;
    border: 2px solid #9B9B9B;
    height: 52px;
    border-radius: 26px;
    padding: 12px;
    margin-top: 10px;
}
.btn-green.small{
    width: 80%;
    font-size: 16px;
    height: 36px;
    padding: 5px;
    margin: 0 auto;
}
.btn-grey {
    width: 100%;
    font-size: 17px;
    background: #fff;
    color: #666666;
    display: block;
    text-align: center;
    border: 2px solid #666666;
    height: 52px;
    border-radius: 26px;
    padding: 12px;
    margin-top: 10px;
}
.padding-30 {
    padding: 30px;
}

.event-confirm-tip {
    font-size: 14px;
    text-align: center;
    color: #666;
}

.event-confirm-tip a {
    color: #00a8b8;
}

.eventTxt {
    position: absolute;
    display: block;
    text-align: center;
    top: 25%;
    right: 6%;
    bottom: 25%;
    left: 12%;
    margin: auto;
    color: #333333;
}

@media screen and (max-width: 320px) {
    .bgEntrancepage {
        min-width: 320px;
        height: 287px;
    }
    .eventTxt {
        position: absolute;
        top: 20%;
        left: 6%;
    }
}

.icRenew {
    background-image: url(../images/icRenew.png);
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
    background-position: center;
    background-repeat: no-repeat;
    display: inline-block;
    vertical-align: middle;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .icRenew {
        background-image: url(../images/icRenew@2x.png);
        background-size: 24px 24px;
    }
}

.icArrowRight {
    background-image: url(../images/icArrowRight.png);
    background-repeat: no-repeat;
    width: 9px;
    height: 9px;
    background-position: center;
    background-repeat: no-repeat;
    display: inline-block;
    vertical-align: middle;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .icArrowRight {
        background-image: url(../images/icArrowRight@2x.png);
        background-size: 9px 9px;
    }
}
/* 紅包袋 */
.eventArea{
    position: relative;
    width: 100%;
    height: calc(100vw * 1.232);
    max-height: 782px;
    /* margin-bottom: 5px;  */
}
.bigBag{
    display: block;
    position: absolute;
    width: 100%;
    top: 0;
}
.imgMoneybagLarge {
    /* background-image: url(../images/imgMoneybagLarge.png); */
    /* min-width: 478px; */
    width: 100%;
    margin: 0 auto;
    background-size: contain;
    position: relative;
    background-repeat: no-repeat;
    background-position:-15px center;
    background-size: 95% auto;
}
/* @media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .imgMoneybagLarge {
        background-image: url(../images/imgMoneybagLarge@2x.png);
    }
} */
.RedEnvelopeTxt {
    color: #fff;
    position: absolute;
    display: block;
    height: 160px;
    text-align: center;
    top: 136px;
    right: 0%;
    /* bottom: 0%; */
    left: 0%;
    margin: auto;
    line-height: 1;
}
/* 留言板 */
.board .font-s-txt {
    margin-bottom: 8px;
}
.board,.msgboard{
    position: absolute;
    bottom: 1.5%;
    margin-top: -2%;
    left:0;
    width: 100%;
}
.imgInputpaper {
    /* background-image: url(../images/imgInputpaper.png); */
    background-repeat: no-repeat;
    min-width: 365px;
    min-height: 119px;
    width: 96%;
    height: auto;
    margin: auto;
    background-size:cover;
    background-position:center;
    background-repeat: no-repeat;
    /* padding-bottom: 89%; */
    position: relative;
    background-size: 100% auto;
}
/* @media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .imgInputpaper {
        background-image: url(../images/imgInputpaper@2x.png);
    }
} */
.messageTxt {
    color: #333;
    position: absolute;
    display: block;
    height: 72px;
    text-align: center;
    top: 0%;
    right:0%;
    bottom:0%;
    left: 0%;
    margin: auto;
    line-height: 1;
}
.messageTxt .bold {
    margin-bottom: 8px;
}
/* 狗狗 */
.dog{
    position: absolute;
    top: 56%;
    right:2%;
    width: 30%;
}
.imgHurtDog {
    background-image: url(../images/imgHurtDog.png);
    background-repeat: no-repeat;
    min-width: 112px;
    min-height: 126px;
    width: 100%;
    height: auto;
    margin: auto;
    background-size:cover;
    background-position:center;
    background-repeat: no-repeat;
    padding-bottom: 115%;
    position: relative;
    background-size: 100% auto;
}
@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .imgHurtDog {
        background-image: url(../images/imgHurtDog@2x.png);
    }
}
/* 筆 */
/* mantis#14601: 紅包/ 新戶頁面跑版 (V29) */
.pen{
    position: absolute;
    top: 68%;
    left: calc(100%/2 - 150px);
    width:10%;
}
/* 新戶完成頁 */
/* mantis#14601: 紅包/ 新戶頁面跑版 (V29) */
.pen-new{
    position: absolute;
    top: 69%;
    left: calc(100%/2 - 150px);
    width:10%;
}
.imgBrush {
    background-image: url(../images/imgBrush.png);
    background-repeat: no-repeat;
    width:30px;
    height: 58px;
    margin: auto;
    background-size:cover;
    background-position:center;
    background-repeat: no-repeat;
    background-size: 100% auto;
}
@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .imgBrush {
        background-image: url(../images/imgBrush@2x.png);
    }
}
@media screen and (max-width: 320px) {
    .imgMoneybagLarge {
        /* min-width: 410px; */
        height: auto;
    }
    .RedEnvelopeTxt {
        position: absolute;
        top: 35%;
        /* left: -3%; */
    }
    .board{
        /* top: 57%; */
        left:0;
        bottom: 0%;
        width: 100%;
    }
    .imgInputpaper{
        min-width: 320px;
    }
    .messageTxt {
        position: absolute;
        top: 0%;
    }
    .dog{
        top: 49%;
        right:6%;
        width: 30%;
    }
    /* mantis#14601: 紅包/ 新戶頁面跑版 (V29) */
    .pen{
        position: absolute;
        top: 64%;
    	left: calc(100%/2 - 140px);
        width:10%;
    }
    .pen-new{
        position: absolute;
        top: 69%;
    	left: calc(100%/2 - 140px);
    	width:10%;
    }
}
@media screen and (min-width: 414px) {
    .imgMoneybagLarge {
        background-size: 100% auto;
    }
    .RedEnvelopeTxt {
        position: absolute;
        top: 20%;
        bottom: 0%;
        /* left: 4%; */
    }
    .board{
        /* top: 54%; */
        left:0;
        bottom: 2%;
        width: 100%;
    }
    .dog{
        top: 55%;
        right:3%;
    }
    /* mantis#14601: 紅包/ 新戶頁面跑版 (V29) */
    .pen{
        top: 70%;
    	left: calc(100%/2 - 150px);
        width:10%;
    }
    .pen-new{
    	position: absolute;
        top: 69%;
    	left: calc(100%/2 - 150px);
    	width:10%;
    }

}
@media screen and (min-width: 768px) {
    .board{
        /* top: 48%; */
        left:0;
        width: 100%;
        bottom: 9%;
    }
    .dog{
        top: 48%;
        right:6%;
        width: 30%;
    }
    .imgHurtDog {
        padding-bottom: 115%;
    }
    /* mantis#14601: 紅包/ 新戶頁面跑版 (V29) */
    .pen{
        top: 73%;
    	left: calc(100%/2 - 160px);
        width:10%;
    }
    .pen-new{
    	position: absolute;
        top: 69%;
    	left: calc(100%/2 - 160px);
    	width:10%;
    }
}
@media screen and (max-width: 768px) {
    .eventArea,
    .bigBag {
        max-height: 938px;
    }
    .board
}
/* 結果 background */
.bgResultpage {
    background-image: url(../images/bgResultpageBottom.png);
    background-repeat: no-repeat;
    width: 100%;
    height: 28px;
    margin: 0 auto;
    background-size: contain;
    background-position:center;
    background-repeat: no-repeat;
    display: block;
    background-size: 100% auto;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .bgResultpage {
        background-image: url(../images/bgResultpageBottom@2x.png);
    }
}
.ResultContent{
    background: #FFF1DD;
    margin-top: -4px;
    padding: 0 15px;
}
.segment-radius-list{
    background-color: #fff;
    border: 1px solid #efefef;
    /* mantis#14601: 紅包/ 新戶頁面跑版 (V29) */
    border-radius: 10px;
    overflow:visible;
}
.segment-radius-list .status{
    background-color: #FFE497;
    padding: 8px 15px;
    font-size: 1rem;
    color: #333333;
    border-radius: 20px 20px 0 0;
}
.segment-radius-list a.item, .segment-radius-list .item{
    display: table;
    width: 100%;
    min-height: 80px;
    padding: 10px 15px 10px 20px;
    border-bottom: 1px solid #efefef;
}
.segment-radius-list .item .title{
    display: table-row;
    width: 100%;
    text-align: center;
}
.segment-radius-list .item:last-child{
    border-bottom: none;
}
.segment-radius-list .item .title .list{
    display: table-cell;
    vertical-align: middle;
    text-align: left;
}
.segment-radius-list .item .title .amount{
    display: table-cell;
    vertical-align: middle;
    text-align: right;
}
.segment-radius-list .item .desc{
    color: #666;
    font-size: 14px;
}
.icMessage{
    background-image: url(../images/icMessage.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 20px; /*Sprint 83 調整 icon 尺寸 */
    height: 20px; /*Sprint 83 調整 icon 尺寸 */
    display: inline-block;
    vertical-align: middle;
    margin-right: 4px; /*Sprint 83 調整 間距 */
    margin-bottom: 2px;
    background-size: 100% auto;
  }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx){
    .icMessage{
      background-image: url(../images/icMessage@2x.png);
    }
  }
  .tagMax{
    background-image: url(../images/tagMax.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 64px;
    height: 32px;
    display:block;
    color: #fff;
    position: absolute;
    right: -10px;
    text-align: center;
    z-index: 99;
    padding-top: 2px;
    background-size: 100% auto;
  }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx){
    .tagMax{
      background-image: url(../images/tagMax@2x.png);
    }
  }
  @media screen and (min-width: 320px) {
    .imgCandy{
     right:10%;
  }
}
  @media screen and (min-width: 768px) {
    .imgCandy{
      right:35%;
    }
  }
.icSend{
    background-image: url(../images/icSend.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 20px;
    height: 20px;
    display:block;
    vertical-align: middle;
    color: #fff;
    position: absolute;
    right:10%;
    top: 14px;
    text-align: center;
    z-index: 99;
    overflow: visible;
    background-size: 100% auto;
  }
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx){
    .icSend{
      background-image: url(../images/icSend@2x.png);
    }
  }
.imgCandy{
    background-image: url(../images/imgCandy.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 34px;
    height: 66px;
    display:block;
    vertical-align: middle;
    color: #fff;
    position: absolute;
    left:10px;
    top: -32px;
    text-align: center;
    z-index: 99;
    overflow: visible;
    background-size: 100% auto;
  }
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx){
    .imgCandy{
      background-image: url(../images/imgCandy@2x.png);
    }
}
.icArrowDown {
    background-image: url(../images/icArrowDown.png);
    background-repeat: no-repeat;
    width: 16px;
    height: 16px;
    background-position: center;
    background-repeat: no-repeat;
    display: inline-block;
    vertical-align: middle;
    margin-left: 5px;
    margin-bottom: 5px;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .icArrowDown {
        background-image: url(../images/icArrowDown@2x.png);
        background-size: 16px 16px;
    }
}
.icArrowUp {
    background-image: url(../images/icArrowUp.png);
    background-repeat: no-repeat;
    width: 16px;
    height: 16px;
    background-position: center;
    background-repeat: no-repeat;
    display: inline-block;
    vertical-align: middle;
    margin-left: 5px;
    margin-bottom: 5px;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .icArrowUp {
        background-image: url(../images/icArrowUp@2x.png);
        background-size: 16px 16px;
    }
}
.segment-radius-list .moreItem .item:last-child{
    border-bottom: none;
}
.moreDetail{
    padding: 10px;
    color: #00a8b8;
}


/* 影片樣式 */

.videoMask {
    position: relative;
    width: 100%;
    left: 0;
    top: 0;
}

.videoMask img {
    width: 100%;
}

.imgMoneybagLarge {
    padding-bottom: 95%;
}

.imgMoneybagLarge .font-default-title {
    font-size: 18px;
    margin-bottom: 10px;
    font-weight: normal;
}
.imgMoneybagLarge .font-45-title {
    font-size: 65px;
    font-weight: 500;
}
.imgMoneybagLarge .font-xs-txt {
    font-size: 16px;
}
.pen,
.award-list,
.bigBag .money-text, 
.bigBag .money-desp, 
.board,.messageTxt,.formBoard {
    opacity: 0;
    transition: all .3s ease;
}

.event-wrap.is-loading + .loading {
    pointer-events: all;
    opacity: 1;
    display: block;
    animation: none;
}
.event-wrap.is-loading {
    overflow: hidden;
}

@keyframes fadeOut {
    0% {
        opacity: 1;
        display: block;
        z-index: 9;
    }
    99% {
        opacity: 0;
        display: block;
        z-index: 9;
    }
    100% {
        opacity: 0;
        display: block;
        display: none;
        z-index: -1;
    }
}

.loading {
    position: absolute;
    width: 100%;
    height: 100%;
    display: none;
    opacity: 0;
    left: 0;
    top: 0;
    z-index: 99;
    background: #faf4eb;
    pointer-events: none;
    animation: fadeOut 1s ease forwards;
}
.loading img {
    position: absolute;
    top: 0; left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}

input.form-control.event-input[disabled] {
    background: rgba(255,255,255,.8);
}

.pen {
    transform: translateY(-30px);
    transition-delay: .4s;
}
.board {
    transition-delay: .2s;
}
 
.bigBag .money-desp {
    transition-delay: .2s;
}

.award-list {
    margin-top: 12px;
    transition-delay: .2s;
}
.messageTxt {
    transition-delay: .2s;
}
.formBoard{
    transition-delay: .2s;
}
.award-list.fade-in,
.bigBag .money-text.fade-in, 
.bigBag .money-desp.fade-in, 
.pen.fade-in, 
.board.fade-in,.messageTxt.fade-in,.formBoard.fade-in{
    opacity: 1;
    transform: translateY(0px);
}

.red-envelope-content{
    position: absolute;
    width: 100%;
    top: 5%;
    bottom: 5%;
    text-align: center;
  }
.red-envelope-content .content-box{
    position: absolute;
    width: 100%;
    padding: 15px;
    top: 30%;
    height: 295px;
    bottom: 20%;
    color: #333333;
  }
.ResultEmpty{
    padding:30px 10px ;
    text-align: center;
    color: #666;
}
/* popup content */
.pop-ui-overlay-b {
    position: fixed;
    height: 100%;
    width: 100%;
    min-height: 100%;  
    opacity: 1 !important;
    background: rgba(0,0,0,0.8) !important; 
    top:0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999;
}
.pop-share-content{
    text-shadow: none;
    padding:30px;
}
.pop-scroll-wrapper {
    padding: 0 !important;
    position: relative;
    width: 90%;
}
.pop-scroll-wrapper.pop-wrapper{
    position: fixed;
    top:50%;
    transform: translate(0, -50%);
    right:0%;
    left:0%;
    margin:0 auto;
    max-width:320px;
    z-index: 9999;
   
}

.pop-content{
    text-shadow: none;
    padding:30px;
    border-radius: 15px; 
    background: #fff;
}
.imgPopupDog{
    background-image: url(../images/imgPopupDog.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 202px;
    height: 94px;
    display:block;
    vertical-align: middle;
    text-align: center;
    background-size: 100% auto;
    margin: 0 auto 20px;
  }
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx){
    .imgPopupDog{
      background-image: url(../images/imgPopupDog@2x.png);
    }
}
.imgPopupNotIce{
    background-image: url(../images/imgPopupNotIce.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 202px;
    height: 95px;
    display:block;
    vertical-align: middle;
    text-align: center;
    background-size: 100% auto;
    margin: 0 auto 20px;
  }
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx){
    .imgPopupNotIce{
      background-image: url(../images/imgPopupNotIce@2x.png);
    }
}
.icAcCheckSuccess{
    background-image: url(../images/icAcCheckSuccess.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 40px;
    height: 40px;
    display:block;
    vertical-align: middle;
    text-align: center;
    background-size: 100% auto;
    margin: 0 auto 20px;
  }
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx){
    .icAcCheckSuccess{
      background-image: url(../images/icAcCheckSuccess@2x.png);
    }
}
/* Sprint 72 搶台新紅包 */
.imgTSredenvelope {
    background-image: url(../images/imgTSredenvelope.png);
    background-repeat: no-repeat;
    min-width: 375px;
    width: 100%;
    height: 436px;
    margin: 0 auto;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    padding-bottom: 110%;
    position: relative;
    background-size: 100% auto;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .imgTSredenvelope {
        background-image: url(../images/imgTSredenvelope@2x.png);
    }
}
.eventTxt.TSB-event{
    top:40%;
}
.imgFinish {
    background-image: url(../images/imgFinish.png);
    background-repeat: no-repeat;
    margin: 0 auto;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    padding-bottom: 130%;
    position: relative;
    background-size: 100% auto;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .imgFinish {
        background-image: url(../images/imgFinish@2x.png);
    }
}
.red-envelope-content .content-box.TSB-event{
    top:25%;
}
.imgEmpty {
    background-image: url(../images/imgEmpty.png);
    background-repeat: no-repeat;
    margin: 0 auto;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    padding-bottom: 130%;
    position: relative;
    background-size: 100% auto;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .imgEmpty {
        background-image: url(../images/imgEmpty@2x.png);
    }
}
.bgReceiveMoney {
    width: 100% ;
    background:url(../images/bgReceiveMoney.png) ;
    background-position: center bottom;
    background-repeat: no-repeat;
    -webkit-background-size: cover ;
    background-size: cover ;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .bgReceiveMoney {
        background-image: url(../images/bgReceiveMoney@2x.png);
    }
}
.RedEnvelopeTxt.TSB-event{
    top:215px;
}
@media screen and (max-width: 320px) {
    .imgTSredenvelope{
        min-width: 320px;
        height: 372px;
    }
    .RedEnvelopeTxt.TSB-event{
        top:170px;
    }
}
@media screen and (min-width: 414px) {
    .RedEnvelopeTxt.TSB-event{
        top:0px;
    }
    .imgTSredenvelope{
        padding-bottom:115% ;
    }
}
@media screen and (max-width: 414px) {
    .bgReceiveMoney{
        height: 100%;
    }
}
.imgReceiveMoney {
    background-image: url(../images/imgReceiveMoney.png);
    background-repeat: no-repeat;
    min-width: 320px;
    min-height: 520px;
    width: 100%;
    margin: 0 auto;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    padding-bottom: 160%;
    /* position: relative; */
    background-size: 100% auto;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .imgReceiveMoney {
        background-image: url(../images/imgReceiveMoney@2x.png);
    }
}

.error .form-control{
    border-color: #de5858;
}

.icFormDelete{
    background-image: url(../images/icFormDelete.png);
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
    display:block;
    background-size: 100% auto;
    position: absolute;
    top:10px;
    right:10px;
  }
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx){
    .icFormDelete{
      background-image: url(../images/icFormDelete@2x.png);
    }
}

/* Sprint 83 */
.imgMoneybagDuringWebS {
    background-image: url(../images/imgMoneybagDuringWebS.png);
    background-repeat: no-repeat;
    margin: 0 auto;
    background-size: contain;
    background-position:center 10px;
    background-repeat: no-repeat;
    padding-bottom: 48%;
    position: relative;
    background-size: 100% auto;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .imgMoneybagDuringWebS {
        background-image: url(../images/imgMoneybagDuringWebS@2x.png);
    }
}
.imgMain {
    background-image: url(../images/imgMain.png);
    min-width: 320px;
    width: 100%;
    margin: 0 auto;
    background-size: contain;
    position: relative;
    background-repeat: no-repeat;
    background-position:0 center;
    background-size: 100% auto;
    padding-bottom: 96%;
    padding-top: 10px;
}
@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .imgMain {
        background-image: url(../images/imgMain@2x.png);
    }
}
.formBoard{
    border: 1px solid #efefef;
    /* mantis#14601: 紅包/ 新戶頁面跑版 (V29) */
    border-radius: 10px;min-height: 98px;
    background: #fff; 
    /* padding: 20px; */
    /* margin-bottom: 10px; */
}
.formBoard-test{
    display: block;
    position: absolute;
    width: 100%;
    top:56%;
    left: 50%;
    transform: translate(-50%, -50%);
    border: 1px solid #efefef;
    border-radius: 15px;
    width: 90%;
    min-height: 98px;
    background: #fff;
    
}
.imgCopy{
    background-clip: padding-box;
    background-image: url(../images/imgCopy.png);
    background-repeat: no-repeat;
    background-position: center top;
  }
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
    .imgCopy{
      background-image: url(../images/imgCopy@2x.png);
      background-size: contain;
    }
}
.imgInputpaper-bg {
    background-image: url(../images/imgInputpaper-bg.png);
    background-repeat: no-repeat;
    /* min-width: 365px; */
    min-height: 119px;
    width: 98%;
    height: auto;
    margin: auto;
    background-size:cover;
    background-position:center;
    background-repeat: no-repeat;
    /* padding-bottom: 89%; */
    position: relative;
    background-size: 100% auto;
}
@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .imgInputpaper-bg {
        background-image: url(../images/imgInputpaper-bg@2x.png);
    }
}
.icAcCheckSuccess_small{
    background-image: url(../images/icAcCheckSuccess_small.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 24px;
    height: 24px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
    margin-bottom: 2px;
    background-size: 100% auto;
  }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx){
    .icAcCheckSuccess_small{
      background-image: url(../images/icAcCheckSuccess_small@2x.png);
    }
  }
/*  */
.imgMainGif {
    /* background-image: url(../images/imgMain.gif); */
    min-width: 320px;
    width: 100%;
    margin: 0 auto;
    background-size: contain;
    position: relative;
    background-repeat: no-repeat;
    background-position:0 center;
    background-size: 100% auto;
    padding-bottom: 96%;
    padding-top: 10px;
}
@media screen and (min-width: 414px) {
    .imgMainGif {
        background-size: 100% auto;
    }
}
.bgPatternYellowTop {
    background-image: url(../images/bgPatternYellowTop.png);
    background-repeat: no-repeat;
    width: 100%;
    height: 54px;
    margin: -2px auto;
    background-size: contain;
    background-position:center;
    background-repeat: no-repeat;
    display: block;
    background-size: 100% auto;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .bgPatternYellowTop {
        background-image: url(../images/bgPatternYellowTop@2x.png);
    }
}
.bgPatternYellowContent{
    background: #FFF2CD;
    padding: 0px 15px 0;
    }
}
@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .bgPatternYellowBottom {
        bbackground: #FFF2CD url(../images/bgPatternYellowDown@2x.png) no-repeat center bottom;
    }
} 
.bgPatternYellowDown {
    background-image: url(../images/bgPatternYellowDown.png);
    background-repeat: no-repeat;
    width: 100%;
    height: 54px;
    margin: -2px auto;
    background-size: contain;
    background-position:center;
    background-repeat: no-repeat;
    display: block;
    background-size: 100% auto;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .bgPatternYellowDown {
        background-image: url(../images/bgPatternYellowDown@2x.png);
    }
}
.msgContent{
    margin-top: -80px;
    margin-bottom: 20px;
}
@media screen and (max-width: 320px) {
    .msgContent{
        margin-top: -76px;
    }
    .bgPatternYellowTop,.bgPatternYellowDown{
        margin: -6px auto;
    }
}
@media screen and (min-width: 414px) {
    .msgContent{
        margin-top: -90px;
    }
    .bgPatternYellowTop,.bgPatternYellowDown{
        margin: 0 auto;
    }
}
@media screen and (min-width: 768px) {
    .msgContent{
        margin-top: -100px;
    }
    .bgPatternYellowTop,.bgPatternYellowDown{
        margin: 0 auto;
    }
}
.icArrowRight-16 {
    background-image: url(../images/icArrowRight-16.png);
    background-repeat: no-repeat;
    width:16px;
    height: 16px;
    background-position: center;
    background-repeat: no-repeat;
    display: inline-block;
    vertical-align: middle;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .icArrowRight-16 {
        background-image: url(../images/icArrowRight-16@2x.png);
        background-size: 16px 16px;
    }
}
.imgDogResult {
    background-image: url(../images/imgDogResult.png);
    background-repeat: no-repeat;
    margin: 35px auto 0;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    padding-bottom: 106%;
    position: relative;
    background-size: 100% auto;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
    .imgDogResult {
        background-image: url(../images/imgDogResult@2x.png);
    }
}
.form-control.error{
    border: 1px solid #de5858;
}