#bodyContent {background: linear-gradient(to bottom, #E6E3E1, #ffffff);overflow: hidden;}
#headerNew {position: relative;z-index: 99;}
#headerNew > .inner { background-color: #fff; padding: 10px; border-bottom: 1px solid #eee;}
#headerNew .maxWidth { max-width: 1200px;margin: auto;}
#headerNew .openrice-logo > img { height: 35px; display: inline-block; padding-right:5px;}
#headerNew .travel-logo > img {float: right; height: 25px; display: inline-block; padding-right: 5px; margin-top: 5px; }
#headerNew .headerDesktop { float: right; margin-top: 6px;}
#headerNew .headerDesktop .li { font-size: 12px;font-weight: 700;display: inline-block;vertical-align: middle;margin-left: 5px; position: relative;}
#headerNew .headerDesktop .li > a {font-size: 15px; border: 1px solid #000; padding: 5px 10px; border-radius: 3px; line-height: 1;cursor: pointer; letter-spacing: 2px; color: #000;}
#headerNew .headerDesktop .li > a.joinBtn {font-size: 15px; background-color: #4e3c2d; padding: 5px 12px; border-radius: 3px; line-height: 1;cursor: pointer; letter-spacing: 2px; color: #ffffff;}
#headerNew .headerDesktop .faq-icon {width: 20px; height: 16px; background: url(https://static7.orstatic.com/info/dbs-instaredeem/images/icon_faq.svg) no-repeat center center; background-size: contain; margin-right: 2px;display: inline-block;vertical-align: top;}
#headerNew .headerDesktop .li a.facebook-share {padding: 5px 6px; margin-left: 5px; border-radius: 50%; line-height: 1.2;}

#sectionTop {position: relative;width: 100%; }
#KV {position: relative; }
#KV .clouds { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; pointer-events: none; }
#KV .clouds img { position: absolute; top: 0; max-width: 100%; animation: animate calc(8s * var(--i)) ease-in-out infinite;    z-index: 2; }
#KV .ttImg, #KV .deco {position: absolute; display: block; z-index: 4;}
#KV img.KVbg {width: 100%;}
#KV .ttImg {top: 5%; right: 13%; margin: auto; width: 43%;}
#KV .sign {background: url(../img/kv-sign.png) no-repeat center / contain; top: 2%; width: 26%; padding-bottom: 33%; animation: wiggle 6s ease-in-out infinite alternate-reverse;}
#KV .stand{background: url(../img/stand.png) no-repeat center / contain; top: 2%; width: 26%; padding-bottom: 15%; animation: wiggle 6s ease-in-out infinite alternate-reverse;}
#KV .standbk{width: 50%; position: relative; top: 0; right: -25%;}
#KV .standbk img.jp{position: relative;top: 108px;}
#KV .standbk img.th{position: relative;top: 115px; width: 72%; left: 29%; }
#KV .standbk img.tw{position: relative;top: 123px; width: 63%; left: 27%;}
#KV .standbk img.sg{position: relative; top: 138px; width: 66%; left: 31%; }
#KV .standbk img.macau{position: relative;top: 152px; width: 70%; left: -10%;}

#KV .decos{position: absolute; left: 0; right: 0; margin: auto; top: 0; bottom: 0; max-width: 80rem;}
#KV span.deco1 { background: url(../img/kv-gift1.png) no-repeat center center; background-size: contain; width: 27%; padding-bottom: 25%; }
#KV span.deco2 { background: url(../img/kv-gift2.png) no-repeat center center; background-size: contain; width: 24%; padding-bottom: 20%;}
#KV span.deco3 { background: url(../img/deco-yellowplane.png) no-repeat center center; background-size: contain; width: 12%; padding-bottom: 12%;  z-index: 2;}
#KV span.deco4 { background: url(../img/deco-yellowplane-2.png) no-repeat center center; background-size: contain; width: 6%; padding-bottom: 8%;  z-index: 1;}

#KV span.deco1 {top: -4%; right: -40%; animation: fuwafuwa02 3s ease-in-out infinite alternate-reverse;}
#KV span.deco2{top: 47%; left: -43%; animation: fuwafuwa04 2s ease-in-out infinite alternate-reverse; }
#KV span.deco3{top: 7%; right: 35%;animation: kvDecoAnim3 60s linear infinite;}
#KV span.deco4{top: -38%; right: 150%;animation: kvDecoAnim4 40s linear infinite; }

#introBoxWrap {position: relative; margin: -28% auto 0%; padding: 1rem 2rem 0; font-size: 0; z-index: 4; }
#introBoxWrap .containerL .row.small-collapse{max-width: 85rem;}
#introBoxWrap h3 {font-size: 1.83rem; font-weight: 800; color: #ffffff; margin-bottom: 1.5rem;text-align: center;filter: drop-shadow(1px 2px 3px black);}
#introBoxWrap h3 > span:first-child {font-size: 2.5rem; color: #009342; background: #FFE000; padding: 0 2%; border-radius: 10px; margin: 1%;}
#introBoxWrap .info {max-width: 95%;}
#introBoxWrap p {font-size: 1.365rem; font-weight: 800; line-height: 1.75; color: #4E3C2D; filter: drop-shadow(0px 1px 3px white);}
#introBoxWrap p.period {border-radius: 50px; line-height: 1.5; margin-top: 10px; color: #f8f8f8; border: 2px solid #ffffff; background: rgb(0 131 0); text-align: center; padding: 2%; margin-top: 1.35rem; filter: drop-shadow(5px 7px 0px #32B232);}
#introBoxWrap .intromenu { padding: 33% 0; display: inline-block; vertical-align: top; width: 47%; margin: -8% 1%; position: relative; text-align: center;}
#introBoxWrap .intromenu a:first-child {margin: 0px 0 0 6%;}
#introBoxWrap .intromenu.anc1 {background: url(../img/info-1.png) no-repeat center center; background-size: contain;}
#introBoxWrap .intromenu.anc2 {background: url(../img/info-2.png) no-repeat center center; background-size: contain;}

#introBoxWrap .tncBtn{display: block; font-size: 15px; color: black; margin: 0 auto; text-align: center; padding: 15px 0; text-decoration: underline;}


#prizeBlock {position: relative; padding: 0 1rem; margin-top: 0; z-index: 1;}
#prizeBlock .container > div.p1 {-ms-flex: 0 0 30%; -webkit-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%;}
#prizeBlock .container > div.p2 {-ms-flex: 0 0 37%; -webkit-flex: 0 0 37%; flex: 0 0 37%; max-width: 37%;margin: -15%;}
#prizeBlock .container > div.p3 {-ms-flex: 0 0 30.85%; -webkit-flex: 0 0 30.85%; flex: 0 0 30.85%; max-width: 30.85%;}
#prizeBlock .decos {position: absolute; left: 0; right: 0; margin: auto; top: 0; bottom: 0; max-width: 80rem; }
#prizeBlock span.deco{position: absolute;}
#prizeBlock span.deco1 {background: url(../img/deco-airplane.png) no-repeat center center; background-size: contain; width: 45%; padding-bottom: 45%;animation: spin 30s linear infinite; /* 動畫設置 */}
#prizeBlock span.deco2 {background: url(../img/deco-airplane2.png) no-repeat center center; background-size: contain; width: 45%; padding-bottom: 45%;animation: spin2 40s linear infinite; /* 動畫設置 */}

#prizeBlock span.deco1 {left: -55%;}
#prizeBlock span.deco2 {right: -55%; top: 52%;}
#prizeBlock .prize-tt img { display: block; margin: 2% auto 10%; width: 40%;}
#prizeBlock .small-prize {width: 80rem; display: flex ; flex-flow: wrap; justify-content: center;}
#prizeBlock .small-prize img {width: 90% }

#CountryBlock {position: relative; padding: 0 1rem; margin-top: 0; z-index: 1;}
#CountryBlock .Poi-tt img {display: block; margin: 3% auto; width: 25%; }
#CountryBlock .image-link { display: inline-block;}
#CountryBlock .container > div.b1 {-ms-flex: 0 0 20%; -webkit-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
#CountryBlock .container > div.b1 > .image-link:hover img{ content: url('../img/btn/btn-jap-on.png'); /* 悬停时更改图像 */ }
#CountryBlock .container > div.b2 {-ms-flex: 0 0 20%; -webkit-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
#CountryBlock .container > div.b2 > .image-link:hover img{ content: url('../img/btn/btn-thai-on.png'); /* 悬停时更改图像 */ }
#CountryBlock .container > div.b3 {-ms-flex: 0 0 20%; -webkit-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
#CountryBlock .container > div.b3 > .image-link:hover img{ content: url('../img/btn/btn-tw-on.png'); /* 悬停时更改图像 */ }
#CountryBlock .container > div.b4 {-ms-flex: 0 0 20%; -webkit-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
#CountryBlock .container > div.b4 > .image-link:hover img{ content: url('../img/btn/btn-sg-on.png'); /* 悬停时更改图像 */ }
#CountryBlock .container > div.b5 {-ms-flex: 0 0 20%; -webkit-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
#CountryBlock .container > div.b5 > .image-link:hover img{ content: url('../img/btn/btn-macau-on.png'); /* 悬停时更改图像 */ }

#bottomBlock {background: url(../img/bottom-bg.png) no-repeat bottom / contain }
#bottomBlock .container{ padding-bottom: 3%;}
#bottomBlock .tncBtn{color: #000000; font-size: .8rem; margin-right: 5.5rem; line-height: 2; padding: 0 .5rem .2rem; border: 1px solid;    margin-bottom: 23px; }
#bottomBlock  #videoPlayer {position: relative; width: 100%; display: block; margin: 0 auto; padding: 6%;}
#bottomBlock  #videoPlayer .videoFrame {position: relative; width: 100%; padding-bottom: 56.25%; border: solid; border-radius: 40px; border-color: #FFC107;}
#bottomBlock  #videoPlayer .videoFrame iframe {position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; border-radius: 2.5rem;}



/*Effect*/
@keyframes animate 
{
  0% { opacity: 0; transform: scale(1); }
  25%, 75% { opacity: 1; }
  100% {opacity: 0; transform: scale(3); }
}
@keyframes float1 {
    0% {transform: translateY(0)}
    to {transform: translateY(min(.8163265306vw + 6.9387755102px,20px))}
  }
@keyframes kvDecoAnim3 {
    0% { top: 9%; /* 起始位置 */ right: 35%; /* 起始位置 */ }
    100% { top: -38%; /* 上升 45% */ right: 150%; /* 向左移動 */ }
}
@keyframes kvDecoAnim4 {
    0% { top: -33%;; /* 起始位置 */ right: 150%; /* 起始位置 */ }
    100% { top: 15%; /* 下降 45% */ right: 20%; /* 向左移動 */ }
}

@keyframes wiggle {
  0% {transform: rotate(2deg);}
  25% {transform: rotate(-2deg);}
  50% {transform: rotate(4deg);}
  75% {transform: rotate(-1deg);}
  100% {transform: rotate(0deg);}
}


@keyframes fuwafuwa02 {
    0% {transform: translateY(0)}
    to {transform: translateY(min(.8163265306vw + 6.9387755102px,20px))}
  }
@keyframes fuwafuwa03 {
    0% {transform: translate(0) scale(1)}
    to {transform: translate(min(.4081632653vw + 3.4693877551px,10px),-5px) scale(1.03)}
  }
@keyframes fuwafuwa04 {
    0% {transform: translate(0) rotate(0)}
    to {transform: translate(min(.8163265306vw + 6.9387755102px,20px),min(.4081632653vw + 3.4693877551px,10px)) rotate(-3deg)}
  }
 @keyframes fuwafuwa05 {
    0% {transform: translateY(max(-.1632653061vw + -2.387755102px,-5px))}
    to {transform: translateY(min(.4081632653vw + 3.4693877551px,15px))}
  }
@keyframes spin {
    from { transform: rotate(0deg); /* 開始時的旋轉角度 */ }
    to { transform: rotate(360deg); /* 結束時的旋轉角度 */ }
}
@keyframes spin2 {
    from { transform: rotate(0deg); /* 開始時的旋轉角度 */ }
    to { transform: rotate(-360deg); /* 結束時的旋轉角度 */ }
}


/*1280 到 1920px*/
@media (min-width: 80rem) and (max-width: 120rem){
  #whatsappBox {max-width: 30rem; }
}

/*768px 到 1280px*/
@media (min-width: 48rem) and (max-width: 80rem) {

}

/*小于或等于 768px*/
@media (max-width: 48rem) {
  #KV .standbk { width: 60%;right: -25%;}
  #KV .stand {width: 50%; padding-bottom: 35%; left: -5%; }
  #KV .standbk img.jp {top: 70px; width: 100%; }
  #KV .standbk img.th{top: 79px; width: 75%; left: 21%;}
  #KV .standbk img.tw {top: 86px; width: 67%; left: 18%; }
  #KV .standbk img.sg {top: 100px; width: 75%; left: 21%;}
  #KV .standbk img.macau{top: 101px; width: 70%; left: -18%; }

}

/*小于或等于 640px*/
@media (max-width: 40em) {
    .mbo{display: block;}
    #headerNew > .inner {padding: 10px;}
    #headerNew .openrice-logo > img {display: inline-block;vertical-align: text-top;height: 30px; }
    #headerNew .headerDesktop {margin-top: 4px;}
    #headerNew .travel-logo > img {height: 17px; margin-top: 2%;}
  
    #KV .sign{ top: 9%; width: 41%; padding-bottom: 73%;}
    #KV .ttImg { right: 5%; width: 56%; }
    #KV span.deco1 { top: -7%; left: 84%;}
    #KV span.deco2 { top: 55%; left: -10%;}


    #introBoxWrap {margin: -45% auto 0%;text-align: center; }
    #introBoxWrap h3{ margin-top: 4%; font-size: 2rem; }
    #prizeBlock .container{justify-content: center;}
    #prizeBlock .prize-tt img {margin: 10% auto 13%; width: 80%; }
    #prizeBlock .container > div.p1 ,#prizeBlock .container > div.p2, #prizeBlock .container > div.p3 {-ms-flex: 0 0 100%; -webkit-flex: 0 0 100%; flex: 0 0 100%; max-width: 80%;}
    #prizeBlock .container > div.p1 {order: 2; margin: 20% 0 0 -15%}
    #prizeBlock .container > div.p2 {order: 1; }
    #prizeBlock .container > div.p3 {order: 3; margin: 0% 0 0 -15%}
    #prizeBlock .small-prize {order:4;}
    #prizeBlock .small-prize img { width: 65%;}

    #CountryBlock .container{justify-content: center;}
    #CountryBlock .Poi-tt img {margin: 8% auto; width: 60%;}
    #CountryBlock .container > div.b1, #CountryBlock .container > div.b2,#CountryBlock .container > div.b3, #CountryBlock .container > div.b4,#CountryBlock .container > div.b5 {padding:1%;-ms-flex: 0 0 45%; -webkit-flex: 0 0 45%; flex: 0 0 45%; max-width: 45%;}
    
    #bottomBlock .container { display: block; text-align: center; padding-bottom: 21%;}
    #bottomBlock .container p {font-size: 14px;}
    #bottomBlock .tncBtn {font-size: 1.3rem; margin-right: initial;}
    .footerWrap .footerTop {background-color: #4F3C2D; padding: 30px 4%;text-align: center;}
}


/*小于或等于 334px*/
@media (max-width: 24.85em) {
  #KV .standbk img.jp {top: 53px; width: 100%; }
  #KV .standbk img.th{top: 62px; width: 75%; left: 21%;}
  #KV .standbk img.tw {top: 64px; width: 67%; left: 18%; }
  #KV .standbk img.sg {top: 74px; width: 75%; left: 21%;}
  #KV .standbk img.macau{top: 83px; width: 70%; left: -18%; }
}


/*小于或等于 240px*/
@media (max-width: 20em) {
  #headerNew .openrice-logo > img { height: 18px; }
  #headerNew .travel-logo > img { height: 11px;  }
}



#whatsappBox {max-width: 30rem; position: fixed; z-index: 100; bottom: 4rem; right:-200px; opacity: 0;transition: all .3s ease-in-out; margin: auto} 
#whatsappBox.show {right: -1rem; opacity: 1}
#whatsappBox img {animation: fuwafuwa05 2s ease-in-out infinite alternate-reverse; -webkit-filter: drop-shadow(1px 1px 4px rgba(0,0,0,0.6));filter: drop-shadow(1px 1px 4px rgba(0,0,0,0.6));}

@media (min-width: 48rem) and (max-width: 80rem) {
  #whatsappBox.show { right: 3rem;  }
  #whatsappBox { max-width: 20rem;}
}

@media screen and (max-width: 40em) {
    #whatsappBox {max-width: 17rem; }
    #whatsappBox.show {right: -1.5rem;}
}