body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote {margin: 0;padding: 0;} 
*, *:before, *:after { -webkit-box-sizing: border-box; box-sizing: border-box; }
.left { float: left; }
.right { float: right; }
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
:focus { outline: none; }
.hidden { display: none; }
span.nobreak, i.nobreak {white-space: nowrap; }
/** html .clearfix { zoom: 1; }*/
/* IE6 */
/**:first-child + html .clearfix { zoom: 1; }*/
/* IE7 */
img { max-width: 100%; display: block; -webkit-backface-visibility: hidden; -ms-transform: translateZ(0); -webkit-transform: translateZ(0); transform: translateZ(0); image-rendering: -moz-crisp-edges; image-rendering: -o-crisp-edges; image-rendering: -webkit-optimize-contrast; image-rendering: crisp-edges; -ms-interpolation-mode: nearest-neighbor;} 
html {scroll-behavior: smooth;}

h1 {font-size: 2.9em; line-height: 1.2;}
h3 { font-size: 1.6rem; line-height: 1.3; }
p { font-size: 1rem; line-height: 1.6; }
a { text-decoration: none !important; }
.zh h1, .zh h3, .zh p, .zh a, .zh small {letter-spacing: 0; }
.en * {letter-spacing: 0!important;}
.txtYellow {color: #ffd54a;}
.alignCtr { margin: auto; width: 90%; }
.noScroll { overflow: hidden; }
.txtCtr { text-align: center; }
.noPmargin > p { margin: 0; }
.fx {-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.row1, .row2, .row3 {text-overflow: ellipsis;-webkit-box-orient: vertical;display: -webkit-box;overflow: hidden;white-space: normal; }
.row1 {-webkit-line-clamp: 1;}
.row2 {-webkit-line-clamp: 2;}
.row3 {-webkit-line-clamp: 3;}
.line-clamp {display: block; display : -webkit-box; -webkit-box-orient : vertical; position: relative; line-height: 1.5; overflow: hidden; text-overflow: ellipsis; padding: 0 !important; }
.line-clamp:after {content: ''; text-align : right; bottom: 0; right: 0; width: 25%; display : block; position: absolute; height: calc(1em * 1.5); background : linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 75%); }
@supports (-webkit-line-clamp: 1) {.line-clamp:after {display : none !important; } }
.line-clamp-1 {-webkit-line-clamp : 1; height : calc(1em * 1.5 * 1); }
.line-clamp-2 {-webkit-line-clamp : 2; height : calc(1em * 1.5 * 2); }
.line-clamp-3 {-webkit-line-clamp : 3; height : calc(1em * 1.5 * 3); }
.line-clamp-4 {-webkit-line-clamp : 4; height : calc(1em * 1.5 * 4); }
.line-clamp-5 {-webkit-line-clamp : 5; height : calc(1em * 1.5 * 5); }
  
/* lity css */
.lity{z-index:9990;position:fixed;top:0;right:0;bottom:0;left:0;white-space:nowrap;background:#000;background:rgba(0,0,0,0.8);outline:none!important;opacity:0;-webkit-transition:opacity .3s ease;-o-transition:opacity .3s ease;transition:opacity .3s ease} .lity.lity-opened{opacity:1} .lity.lity-closed{opacity:0} .lity *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} .lity-wrap{z-index:9990;position:fixed;top:0;right:0;bottom:0;left:0;text-align:center;outline:none!important} .lity-wrap:before{content:'';display:inline-block;height:100%;vertical-align:middle;} .lity-loader{z-index:9991;color:#fff;position:absolute;top:50%;margin-top:-0.8em;width:100%;text-align:center;font-size:14px;font-family:Arial,Helvetica,sans-serif;opacity:0;-webkit-transition:opacity .3s ease;-o-transition:opacity .3s ease;transition:opacity .3s ease} .lity-loading .lity-loader{opacity:1} .lity-container{z-index:9992;position:relative;text-align:left;vertical-align:middle;display:inline-block;white-space:normal;max-width:100%;max-height:100%;outline:none!important} .lity-content{z-index:9993;width:100%;-webkit-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transition:-webkit-transform .3s ease;-o-transition:-o-transform .3s ease;transition:transform .3s ease; position: relative; border: 15px solid #fff;background-color: #fff;max-height: 100vh!important;} .lity-loading .lity-content,.lity-closed .lity-content{-webkit-transform:scale(.8);-ms-transform:scale(.8);-o-transform:scale(.8);transform:scale(.8)} .lity-close{z-index:9994;width:35px;height:35px;position:fixed;right:10px; top: 10px; margin:auto;background-color: #000; -webkit-appearance:none;cursor:pointer;text-decoration:none;text-align:center;padding:0;color:#fff;font-style:normal;font-size:35px;font-family:Arial,Baskerville,monospace;line-height:32px;text-shadow:0 1px 2px rgba(0,0,0,0.6);border:0;outline:0;-webkit-box-shadow:none; box-shadow: 0 2px 3px rgba(0,0,0,.6); border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%; border: 2px solid #fff;} .lity-close::-moz-focus-inner{border:0;padding:0} .lity-image img{max-width:100%;display:block;line-height:0;border:0} .lity-iframe .lity-container{width:100%;} .lity-iframe-container{width:100%;height:0;padding-top:100vh;overflow:auto;pointer-events:auto;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-overflow-scrolling:touch} .lity-iframe-container iframe{position:absolute;display:block;top:0;left:0;width:100%;height:100%;-webkit-box-shadow:0 0 8px rgba(0,0,0,0.6);box-shadow:0 0 8px rgba(0,0,0,0.6);} .lity-hide{display:none!important}

@keyframes float1 {
  0% {transform: translateY(0)}
  to {transform: translateY(min(.8163265306vw + 6.9387755102px,20px))}
}
@keyframes float2 {
  0% {transform: translate(0) scale(1)}
  to {transform: translate(min(.4081632653vw + 3.4693877551px,10px),-5px) scale(1.03)}
}
@keyframes float3 {
  0% {transform: translate(0) rotate(0)}
  to {transform: translate(min(.8163265306vw + 6.9387755102px,20px),min(.4081632653vw + 3.4693877551px,10px)) rotate(-3deg)}
}
@keyframes float4 {
  0% {transform: translateY(max(-.1632653061vw + -2.387755102px,-5px))}
  to {transform: translateY(min(.4081632653vw + 3.4693877551px,10px))}
}
@keyframes float5 {
  0% {transform: translate(0) scale(1)}
  20% {transform: translate(-.8vw, 2px) scale(1)}
  50% {transform: translate(-2.5vw, -5px) scale(1.03)}
  80% {transform: translate(-4.2vw, 2px) scale(1.01)}
  100% {transform: translate(-5vw, 5px) scale(1) }
}

.mbo {display: none;}
.row .row {margin: 0}
.deco {display: block; position: absolute;}
.deco span {display: block; width: 100%;}
@keyframes card {0% {transform: rotateY(0deg)} 50% {transform: rotateY(-5deg)} 100% {transform: rotateY(5deg)}}


body { margin: 0px; background-color: #fff; position: relative; height: 100%; font-family: Noto Sans TC, "Microsoft YaHei","Source Han Sans",PingFangHK,"Heiti TC",Arial,Verdana,sans-serif; font-weight: 400; color: #222;}


@media only screen and (max-width: 48rem) {
  /* html, body {font-size: 11px;} */
  .mbo {display: block;} .dko {display: none!important;}
}


#bodyWrap {margin: auto; position: relative; background: linear-gradient(to bottom, rgba(230, 202, 178, 0), #e6cab2 17%, #e2c2a6 38%, #f1e2d6 65%, #e4c8b3); overflow: hidden;}

#siteLogo {width: 13.5%; position: absolute; z-index: 1; top: -1vw; left: 4.5%;}
#siteLogo img {width: 100%;}
@media only screen and (max-width: 48rem) {
  #bodyWrap {background: linear-gradient(to bottom, #fcc690 20%, #e2c2a6 40%, #f1e2d6 60%, #e4c8b3);}
  #siteLogo {width: 28%; top: -1.5vw; left: 3.5%;}
}


#KV {position: relative;}
#KV .bgImg {width: 100%;}
#KV .ttImg {position: absolute; top: 6%; left: 0; right: 0; margin: auto; width: 37%;}
@media only screen and (max-width: 48rem) {
  #KV .ttImg {top: 10%; width: 63%;}
}


#introBlock {margin-top: -15.5vw;}
#introBlock .container {max-width: 70%; margin: auto; padding: 0 0 0 19vw; position: relative;}
#introBlock .container:before {content: ''; display: block; position: absolute; z-index: 1; top: -8.5vw; left: 0.5vw; width: 19vw; padding-bottom: 22vw; background: url(../images/riceboy1.png) no-repeat center / contain; animation: float1 3.2s 1s infinite alternate;}
#introBlock .textBlock {border-radius: 1.25vw; border: 3px solid rgba(255, 255, 255, .8); background: linear-gradient(to bottom, rgba(255, 5, 92, .6), rgba(255, 78, 38, .6) 75%, rgba(255, 78, 38, .6)); padding: 1.15vw 2.15vw 1.5vw 2.15vw;}
#introBlock .textBlock p {font-size: 1.25vw; font-weight: 500; line-height: 1.65; color: #fff;}

@media only screen and (max-width: 48rem) {
  #introBlock {margin-top: -53.5vw;}
  #introBlock .container {max-width: 87%; padding: 32vw 0 0 6vw;}
  #introBlock .container:before {top: 0; left: 0; right: 0; margin: auto; width: 33vw; padding-bottom: 38vw;}
  #introBlock .textBlock {border-radius: 3.25vw; border-width: 2px; padding: 2.75vw 2.65vw 3vw 2.65vw;}
  #introBlock .textBlock p {font-size: 3.385vw; line-height: 1.55; letter-spacing: .1vw; text-align: center;}
}






#missionBlock {margin: 5vw 0 10vw; position: relative;}
#missionBlock:after {content: ''; display: block; position: absolute; z-index: 0; width: 100%; padding-bottom: 13%; left: 0; bottom: -26%; background: url(../images/bg-dots2.png) no-repeat center bottom / 100% auto;}
#missionBlock .container {max-width: 43%; margin: auto; position: relative; z-index: 1;}
#missionBlock .infoBlock {position: relative; color: #fdfdfd; text-align: center;}
#missionBlock .infoBlock:before {content: ''; display: block; width: 154%; padding-bottom: 104%; position: absolute; z-index: 0; top: 1%; left: -27%; right: 0; margin: auto;}
#missionBlock .infoBlock > * {position: relative; z-index: 1;}
#missionBlock .infoBlock .ttImg {max-width: 31vw; margin: 0 auto 1.35vw;}
#missionBlock .infoBlock .ttImg img {width: 100%;}
#missionBlock .infoBlock h5 {font-size: 1.625vw; font-weight: 500; line-height: 1.3; text-shadow: 0 1px 5px rgba(0, 0, 0, .65); margin-bottom: 1vw;}
#missionBlock .infoBlock h5 .ul {border-bottom: 2px solid #fdfdfd; margin-top: .45vw; display: inline-block;}
#missionBlock .infoBlock p {font-size: 1.325vw; font-weight: 500; text-shadow: 0 1px 5px rgba(0, 0, 0, .65); line-height: 1.2; margin: 0;}
#missionBlock .infoBlock .yl {color: #fff967; display: inline-block; vertical-align: middle; font-size: 1.6em; font-weight: 800; margin: -.5vw 0 0;}
#missionBlock .infoBlock i.coin {display: inline-block; vertical-align: middle; width: 3vw; height: 3vw; background: url(../images/mission/openrice-game-currency-gold.png) no-repeat center / contain;}
#missionBlock .infoBlock .buGroup {display: flex; flex-flow: row wrap; justify-content: center; margin: .5vw 0 1vw;}
#missionBlock .infoBlock .buGroup .bu {-ms-flex: 0 0 17%; -webkit-flex: 0 0 17%; flex: 0 0 17%; max-width: 17%; margin: 0 1.5%;}
/*#missionBlock .infoBlock .buGroup .bu:nth-child(4) {-ms-flex: 0 0 20.5%; -webkit-flex: 0 0 20.5%; flex: 0 0 20.5%; max-width: 20.5%; margin: 0 -.25%;}*/
#missionBlock .infoBlock .buGroup .bu img {width: 100%;}
#missionBlock .infoBlock .note {display: block; font-size: .825vw; font-weight: 500; line-height: 1.3;}
#missionBlock .deco1 {width: 27vw; top: 26%; right: 122%;}
#missionBlock .deco3 {width: 25vw; bottom: -29%; left: 82%;}
#missionBlock .deco1 span {padding-bottom: 100%; background: url(../images/mission/deco-1.png) no-repeat center / contain; animation: float4 3s infinite alternate;}
#missionBlock .deco3 span {padding-bottom: 100%; background: url(../images/mission/riceboy.png) no-repeat center / contain;}

@media only screen and (min-width: 48rem) {
  #missionBlock .infoBlock:before {background: url(../images/mission/board.png) no-repeat center top / contain;}
  #missionBlock .deco2 {width: 26vw; top: 10%; left: 123%;}
  #missionBlock .deco2 span {padding-bottom: 70%; background: url(../images/mission/deco-2.png) no-repeat center / contain; animation: float2 2.6s infinite alternate;}
}

@media only screen and (max-width: 48rem) {
  #missionBlock {margin: 10vw 0 15vw;}
  #missionBlock .container {max-width: 67%;}
  #missionBlock .infoBlock:before {background: url(../images/mission/board-m.png) no-repeat center top / contain; width: 150%; padding-bottom: 190%; top: 2%; left: -25%;}
  #missionBlock .infoBlock .ttImg {max-width: 64vw; margin: 0 auto 2.25vw;}
  #missionBlock .infoBlock h5 {font-size: 3.75vw; line-height: 1.35; margin-bottom: 1vw;}
  #missionBlock .infoBlock h5 .ul {border-width: 1px; margin-top: 1.5vw; margin-bottom: 1.25vw;}
  #missionBlock .infoBlock p {font-size: 3.125vw; line-height: 1.2; margin: 1.5vw 0;}
  #missionBlock .infoBlock .yl {font-size: 1.8em; margin: -1.15vw 0 0;}
  #missionBlock .infoBlock i.coin {width: 8vw; height: 8vw;}
  #missionBlock .infoBlock .buGroup {margin: 0 0 2.5vw;}
  #missionBlock .infoBlock .buGroup .bu {-ms-flex: 0 0 25%; -webkit-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; margin: 0 2.5% 1%;}
  /*#missionBlock .infoBlock .buGroup .bu:nth-child(4) {-ms-flex: 0 0 30.5%; -webkit-flex: 0 0 30.5%; flex: 0 0 30.5%; max-width: 30.5%; margin: 0 -.25% 1%;}*/
  #missionBlock .infoBlock .note {font-size: 2.25vw;}
  #missionBlock .deco1 {width: 36vw; top: -17%; right: 89%;}
  #missionBlock .deco3 {width: 36vw; bottom: -13%; left: 72%;}
}




#howToBlock {position: relative; z-index: 1;}
#howToBlock .container {max-width: 70%; margin: auto; position: relative;}
#howToBlock .ttImg {max-width: 31vw; margin: 0 auto;}
#howToBlock .ttImg img {width: 100%;}
#howToBlock .infoBlock {display: flex; flex-flow: row wrap; justify-content: space-between; margin-top: 7%;}
#howToBlock .instructTextBlock {-ms-flex: 0 0 35%; -webkit-flex: 0 0 35%; flex: 0 0 35%; max-width: 35%;}
#howToBlock .instructTextBlock .box {position: relative; border-radius: 1.5vw; background-color: #fff4ed; box-shadow: 0 1px 10px 0px rgba(0,0,0,0.1);}
#howToBlock .instructTextBlock .box1 {padding: 8% 6% 8% 42%;}
#howToBlock .instructTextBlock .box2 {padding: 14% 6% 16% 42%;}
#howToBlock .instructTextBlock .box:before {content: ''; display: block; position: absolute;}
#howToBlock .instructTextBlock .box1:before {background: url(../images/how-to/howto-img1.png) no-repeat center / contain; width: 45%; padding-bottom: 55%; top: -18%; left: -8%;}
#howToBlock .instructTextBlock .box2:before {background: url(../images/how-to/howto-img2.png) no-repeat center / contain; width: 31%; padding-bottom: 37%; top: 13%; left: 5%;}
#howToBlock .instructTextBlock .box h3 {font-size: 1.815vw; font-weight: 700; line-height: 1; color: #f25502; margin-bottom: .25vw;}
#howToBlock .instructTextBlock .box p {font-size: 1.375vw; font-weight: 600; line-height: 1.2; color: #5c2603;}
#howToBlock .phoneBlock {-ms-flex: 0 0 23%; -webkit-flex: 0 0 23%; flex: 0 0 23%; max-width: 23%; position: relative; padding-bottom: 34%;}
#howToBlock .phoneBlock .phone {display: block; width: 180%; padding-bottom: 170%; background: url(../images/how-to/phone.png) no-repeat center / contain; position: absolute; left: -40%; top: -19%;}
#howToBlock .phoneBlock .riceboy {display: block; width: 77%; padding-bottom: 21%; background: url(../images/how-to/riceboy_anim.gif) no-repeat center / contain; position: absolute; left: 0; right: 0; bottom: 24%; margin: auto;}
#howToBlock .deco1 {width: 17vw; bottom: -1%; left: 22.5%;}
#howToBlock .deco2 {width: 28vw; bottom: -26%; right: 91%;}
#howToBlock .deco1 span {padding-bottom: 96%; background: url(../images/how-to/riceboy.png) no-repeat center / contain; }
#howToBlock .deco2 span {padding-bottom: 77%; background: url(../images/how-to/deco-1.png) no-repeat center / contain; animation: float3 3s infinite alternate;}

@media only screen and (max-width: 48rem) {
  #howToBlock .container {max-width: 72%;}
  #howToBlock .ttImg {max-width: 65vw;}
  #howToBlock .infoBlock {margin-top: 3%;}
  #howToBlock .instructTextBlock {-ms-flex: 0 0 100%; -webkit-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; order: 2;}
  #howToBlock .instructTextBlock .box {border-radius: 3.5vw;}
  #howToBlock .instructTextBlock .box1 {padding: 7% 6% 7% 42%; margin-bottom: 8%;}
  #howToBlock .instructTextBlock .box2 {padding: 11% 6% 12% 42%;}
  #howToBlock .instructTextBlock .box1:before {width: 42%; padding-bottom: 51%; top: -15%; left: -7%;}
  #howToBlock .instructTextBlock .box2:before {top: 9%;}
  #howToBlock .instructTextBlock .box h3 {font-size: 5.35vw; margin-bottom: 1vw;}
  #howToBlock .instructTextBlock .box p {font-size: 4vw;}
  #howToBlock .phoneBlock {-ms-flex: 0 0 100%; -webkit-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; position: relative; padding-bottom: 168%; order: 1;}
  #howToBlock .phoneBlock .phone {width: 148%; padding-bottom: 138%; left: -24%; top: 0%;}
  #howToBlock .phoneBlock .riceboy {width: 65%; padding-bottom: 16%; bottom: 32%;}
  #howToBlock .deco1 {width: 42vw; bottom: 39%; left: -20%;}
  #howToBlock .deco2 {width: 42vw; bottom: 70%; right: 80%;}
}




#prizeBlock {padding-top: 8vw; position: relative; z-index: 0; margin-top: -4.25vw;}
#prizeBlock:before {content: ''; display: block; position: absolute; z-index: 0; top: 0; left: 50%; transform: translateX(-50%); width: 400vw; height: 400vw; border-radius: 50%; background-color: #f4e8df; box-shadow: 0 0 10px -3px #e2a882;}
#prizeBlock .wrapper {position: relative; background-color: #f4e8df; z-index: 1;}
#prizeBlock .container {max-width: 66%; margin: auto; position: relative;}
#prizeBlock .ttImg {max-width: 31vw; margin: 0 auto;}
#prizeBlock .ttImg img {width: 100%;}
#prizeBlock .prizeRow {display: flex; flex-flow: row wrap; margin-top: .5%; position: relative;}
#prizeBlock .prizeRow.r1 {justify-content: space-between; align-items: flex-end;}
#prizeBlock .prizeRow.r2 {justify-content: center; align-items: center; margin-top: 4%;}
#prizeBlock .prizeRow .prize {-ms-flex: 0 0 32.5%; -webkit-flex: 0 0 32.5%; flex: 0 0 32.5%; max-width: 32.5%; position: relative;}
#prizeBlock .prizeRow.r1:after {content: ''; display: block; position: absolute; z-index: -1; width: 106%; padding-bottom: 15%; left: -3%; bottom: 15%; background: url(../images/prize/green-floor.png) no-repeat center bottom / contain;}
#prizeBlock .prizeRow.r2 .prize {margin: 0 4%;}
#prizeBlock .prizeRow .prize > span {margin: auto; display: block;}
#prizeBlock .prizeRow .prize .rankTT {max-width: 52%;}
#prizeBlock .prizeRow .prize.p1 .rankTT {max-width: 57%; margin-bottom: -7%;}
#prizeBlock .prizeRow .prize.p4 .rankTT {max-width: 88%; margin: 0 auto 2%;}
#prizeBlock .prizeRow .prize.p5 .rankTT {max-width: 108%; width: 108%; margin-left: -4%; margin-bottom: 2%;}
#prizeBlock .prizeRow .prize .img {max-width: 57%; margin-bottom: 6%;}
#prizeBlock .prizeRow .prize.p1 .img {max-width: 72%; margin-bottom: 3%;}
#prizeBlock .prizeRow .prize .desc {max-width: 98%;}
#prizeBlock .prizeRow .prize img {width: 100%;}
#prizeBlock .prizeRow .prize.p1 .deco {width: 14.75vw; bottom: 26%; left: 67%; z-index: 1;}
#prizeBlock .prizeRow .prize.p1 .deco span {padding-bottom: 97%; background: url(../images/prize/riceboy.png) no-repeat center / contain;}

@media only screen and (min-width: 48rem) {
  #prizeBlock .deco1 {width: 31vw; top: -12%; left: 93%;}
  #prizeBlock .deco1 span {padding-bottom: 64%; background: url(../images/prize/deco-1.png) no-repeat center / contain; animation: float1 3s .3s infinite alternate;}
}

@media only screen and (max-width: 48rem) {
  #prizeBlock {margin-top: 0; padding-top: 12vw;}
  #prizeBlock .container {max-width: 94%;}
  #prizeBlock:before {top: -130vw; width: 500vw; height: 500vw; box-shadow: 0 0 35px 15px #e2a882;}
  #prizeBlock .ttImg {max-width: 80vw;}
  #prizeBlock .prizeRow.r1 {justify-content: center; margin-top: 2.5%;}
  #prizeBlock .prizeRow.r1:after {width: 100%; padding-bottom: 13%; left: 0%; bottom: 9.25%;}
  #prizeBlock .prizeRow .prize.p1 {-ms-flex: 0 0 68%; -webkit-flex: 0 0 68%; flex: 0 0 68%; max-width: 68%; order: 1; margin-bottom: 8vw;}
  #prizeBlock .prizeRow .prize.p2, #prizeBlock .prizeRow .prize.p3 {-ms-flex: 0 0 49%; -webkit-flex: 0 0 49%; flex: 0 0 49%; max-width: 49%;}
  #prizeBlock .prizeRow .prize.p2 {margin-right: 1%; order: 2;}
  #prizeBlock .prizeRow .prize.p3 {margin-left: 1%; order: 3;}
  #prizeBlock .prizeRow .prize.p2 .rankTT, #prizeBlock .prizeRow .prize.p3 .rankTT {max-width: 60%;}
  #prizeBlock .prizeRow .prize.p2 .img, #prizeBlock .prizeRow .prize.p3 .img {max-width: 73%;}
  #prizeBlock .prizeRow .prize.p4, #prizeBlock .prizeRow .prize.p5 {-ms-flex: 0 0 50%; -webkit-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
  #prizeBlock .prizeRow .prize.p4 {margin-top: 3vw;}
  #prizeBlock .prizeRow .prize.p5 {margin-top: 6vw;}
  #prizeBlock .prizeRow .prize.p4 .rankTT {max-width: 114%; width: 114%; margin: 0 0 5% -7%;}
  #prizeBlock .prizeRow .prize.p5 .rankTT {max-width: 140%; width: 140%; margin: 0 0 5% -20%;}
  #prizeBlock .prizeRow .prize.p1 .deco {width: 32vw; bottom: 29%; left: 69%;}
  #prizeBlock .prizeRow .prize.p1:after {content: ''; display: block; position: absolute; z-index: -1; width: 146%; padding-bottom: 18%; left: -23%; bottom: 27%; background: url(../images/prize/green-floor.png) no-repeat center bottom / contain;}
}





#toAppBlock {background-color: #f4e8df; padding: 10vw 0 6vw; position: relative;}
#toAppBlock:after {content: ''; display: block; position: absolute; z-index: 0; width: 100%; padding-bottom: 13%; left: 0; bottom: -8%; background: url(../images/bg-dots2.png) no-repeat center bottom / 100% auto;}
#toAppBlock .container {max-width: 46%; margin: auto; padding-right: 10%; position: relative;}
#toAppBlock .ttImg {max-width: 100%;}
#toAppBlock .ttImg img {width: 100%;}
#toAppBlock .deco1 {width: 15vw; top: -64%; left: 68%;}
#toAppBlock .deco1 span {padding-bottom: 105%; background: url(../images/riceboy2.png) no-repeat center / contain;}

@media only screen and (max-width: 48rem) {
  #toAppBlock {padding: 30vw 0 15vw;}
  #toAppBlock:after {padding-bottom: 25%; bottom: 40%; background-size: 130% auto;}
  #toAppBlock .container {max-width: 90%; padding-right: 2%;}
  #toAppBlock .deco1 {width: 34vw; top: -150%; left: 60%;}
  #toAppBlock .deco2 {width: 54vw; top: -32vw; left: -29vw;}
  #toAppBlock .deco2 span {padding-bottom: 64%; background: url(../images/prize/deco-1.png) no-repeat center / contain;}
}
#tips{background-color: #f4e8df;}
#tips .container { max-width: 63%; margin: auto; padding: 2% 0 5%; position: relative; }
#tips .ttImg {max-width: 100%;}
#tips .ttImg img {width: 100%;}

@media only screen and (max-width: 48rem) {
#tips .container { max-width: 90%; padding: 0 0 5%; margin: -9% auto 0; }
}


.footerWrap {position: relative; background-color: #f4455e; padding: 2.5rem 1.5rem;}
.footerWrap .container {max-width: 80rem; margin: auto;}
.footerWrap .row {max-width: none;}
.footTopTxt {color: #fff;}
.footTopTxt p {font-weight: 600; margin-bottom: .25rem; font-size: 1.15rem;}
.footTopTxt small {display: block; font-size: .825rem; line-height: 1.6;}
.footTopSocialGroup {text-align: right;}
.footTopSocialGroup .foot-social {display: inline-block; vertical-align: middle; margin: 0 .5rem; width: 1.5rem; height: 1.5rem;}
.footTopSocialGroup .foot-social.ig {background: url(../images/sm-icons/instagram.svg) no-repeat center center; }
.footTopSocialGroup .foot-social.yt {background: url(../images/sm-icons/youtube.svg) no-repeat center center; }
.footTopSocialGroup .foot-social.fb {background: url(../images/sm-icons/facebook.svg) no-repeat center center; }
.footerCR {color: #fff; margin-top: .5rem; text-align: right;}
.footerCR > span.copyright-text {font-size: .8rem;}
#backtopBtn {position: absolute; left: 0; right: 0; margin: auto; top: -1.25rem; width: 2.5rem; height: 2.5rem; background: url(https://www.openrice.com/info/global/img/backtopArr.png) no-repeat center center; background-color: #fff; cursor: pointer; z-index: 10; box-shadow: 0 0 10px -5px rgba(0,0,0,.2); border-radius: 50%;}
#tncBtn { color: #fff; border: 1px solid; border-radius: 2px; display: inline-block; vertical-align: middle; line-height: 2; padding: 0 8px; font-size: .7rem; margin-left: 10px; }

@media only screen and (max-width: 48rem) {
  .footerWrap {padding: 8vw 4vw; text-align: center;}
  .footTopTxt p {font-size: 3.15vw;}
  .footTopTxt small {font-size: 2vw; display: block; line-height: 1.7;} 
  .footTopSocialGroup {text-align: center; margin-top: 1.5vw;}
  .footTopSocialGroup .foot-social {width: 4vw; height: 4vw; margin: 0 1.5vw;}
  .footerCR {text-align: center; margin-top: 2vw;}
  .footerCR > span.copyright-text {font-size: 1.85vw; display: block;}
  #backtopBtn {width: 7vw; height: 7vw; top: -3.5vw; background-size: 90%;}
}




