*,*:before,*:after {-webkit-box-sizing:border-box;-moz-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;}
* html .clearfix {zoom:1;}
/* IE6 */*:first-child+html .clearfix {zoom:1;}
/* IE7 */img {max-width:100%;}
body,html{width:100%;height:100%;margin:0;padding:0;}
html {scroll-behavior: smooth;}
p {margin: 0;}
a {text-decoration:none;}
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;}
.noScroll {overflow:hidden;}
p, a, h1, h2, h3, h4, h5 {margin: 0;}
.fx {-moz-transition:all 2s ease-in-out;-o-transition:all 2s ease-in-out;transition:all 2s ease-in-out;}
span.nobreak, i.nobreak {white-space: nowrap; }

.lity {z-index:9990;position:fixed;top:0;right:0;bottom:0;left:0;white-space:nowrap; ;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; background-color: rgba(70, 50, 40, 0.8);; outline:none!important} .lity-wrap:before {content:'';display:inline-block;height:100%;vertical-align:middle;margin-right:-0.25em} .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-container:after {content:'';position:absolute;left:0;top:0;bottom:0;display:block;right:0;width:auto;height:auto;z-index:-1;-webkit-box-shadow:0 0 8px rgba(0,0,0,0.6);box-shadow:0 0 8px rgba(0,0,0,0.6)} .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;} .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%;max-width:100%} .lity-iframe-container {width:100%;height:100vh;padding-top:0%;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%;} .lity-hide {display:none} .lity-active body {overflow: hidden;}

@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)}
}

@media only screen and (min-width: 48rem) {
  .mbo {display: none!important;}
}

@media only screen and (max-width: 48rem) {
  .mbo {display: block!important;} .dko {display: none!important;}
}


body {margin:0px; font-family: "Roboto",'Microsoft YaHei',"Microsoft JhengHei","Source Han Sans","PingFangHK","Heiti TC",Verdana,Geneva,sans-serif!important; position:relative; background-color: #fff; color: #5a462e;}





#header {position: fixed; z-index: 5; top: 0; left: 0; width: 100%; background-color: #fff; box-shadow: 0 0 8px -2px rgba(0,0,0,.5); padding: 1vw 0 1vw;}
#header .container {max-width: 68vw; margin: auto; display: flex; flex-flow: row nowrap; justify-content: space-between;}
#header .openrice-logo {display: block; -ms-flex: 0 0 16%; -webkit-flex: 0 0 16%; flex: 0 0 16%; max-width: 16%;}
#header .openrice-logo img {width: 100%;}
#headerNavGroup {-ms-flex: 0 0 64%; -webkit-flex: 0 0 64%; flex: 0 0 64%; max-width: 64%; display: flex; flex-flow: row wrap; justify-content: space-between;}
#headerNavGroup > a {display: inline-block; position: relative; height: 100%; font-size: 1.375vw; font-weight: 500; color: #5a462e; padding: .95vw .45vw 0;}
#headerNavGroup > a.active {color: #ff4e26;}
#headerShareBtn {display: block; -ms-flex: 0 0 3.5%; -webkit-flex: 0 0 3.5%; flex: 0 0 3.5%; max-width: 3.5%; border-radius: 50%; background: url(../images/share-icon.png) no-repeat center / contain;}

@media only screen and (min-width: 48rem) {
  #headerNavGroup > a:before {content: ''; display: block; position: absolute; left: 0; bottom: -1vw; width: 0%; height: 4px; background-color: #ff4e26; transition: width .2s ease-in-out;}
  #headerNavGroup > a.active:before {width: 100%;}
}
	
@media only screen and (max-width: 48rem) {
  #header {padding: 4vw 6vw; z-index: 20;}
  #header .container {max-width: 100vw; display: block;}
  #header .openrice-logo {max-width: 36vw;}
  #headerNavGroup {display: block; position: fixed; top: -100vh; left: 0; max-width: 100vw; width: 100vw; height: 100vh; background-color: #fff; padding-top: 5vw; opacity: 0; transition: opacity .2s;}
  .navOpened #headerNavGroup {top: 18vw; opacity: 1;}
  #headerNavGroup:before {content: ''; display: block; position: absolute; top: 0; left: 0; right: 0; margin: auto; width: 87%; height: .8vw; background-color: #ddd;}
  #headerNavGroup > a {display: block; text-align: center; margin: 6vw 0; font-size: 8vw; line-height: 1; height: auto;}

  .grid-button {position: absolute; z-index: 100; right: 6vw; top: 4.5vw; width: 9vw; height: 9vw; border-radius: 50%; background: #ff4e26; cursor: pointer;}
  .grid-button .grid {position: relative; display: block; width: 100%; height: 100%;}
  .grid-button .grid > span {position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; display: block; width: 47%; height: .65vw; background-color: #fff; }
  .grid-button .grid > span:before,
  .grid-button .grid > span:after {content: ""; position: absolute; width: 100%; height: 100%; background-color: #fff; transition: all 0.3s; }
  .grid-button .grid > span:before {transform: translateY(-1.5vw); }
  .grid-button .grid > span:after {transform: translateY(1.5vw); }
  .navOpened .grid-button .grid {transform: rotate(45deg); }
  .navOpened .grid-button .grid > span:before {transform: rotate(90deg); }
  .navOpened .grid-button .grid > span:after {transform: rotate(90deg); opacity: 0;}
}



#bodyContent {padding-top: 6.5vw; opacity: 0; transition: opacity .3s ease-in-out;}
#bodyContent.loaded {opacity: 1;}

@media only screen and (max-width: 48rem) {
  #bodyContent {padding-top: 18.5vw;}
}





#introSection {padding-bottom: 2vw; position: relative;}
#introSection .siteTitle {padding: 2vw 0; text-align: center;}
#introSection .siteTitle h1 {font-size: 2.75vw; font-weight: 800; color: #5a462e; line-height: 1.3; letter-spacing: .075vw;}
#introSection .red {color: #ff4e26;}
#introSection .siteTitle h1 .lg {font-size: 1.5em;}
#introSection .siteTitle h1 .xlg {font-size: 2em; font-weight: 900; letter-spacing: .15vw;}
#introSection .siteTitle h1 .goRewardIcon {display: inline-block; vertical-align: middle; width: 18vw; padding-bottom: 8vw; margin: -1.5vw 1vw 0 .75vw; background: url(../images/gorewards@2x.png) no-repeat center / contain;}
#introSection .container {max-width: 82vw; margin: 0 auto; display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center;}
#introSection .contentBlock {-ms-flex: 0 0 46.5%; -webkit-flex: 0 0 46.5%; flex: 0 0 46.5%; max-width: 46.5%;}
#introSection .contentBlock p {font-size: 1.4vw; letter-spacing: .015vw; line-height: 1.6; padding: 0 .85vw;}
#introSection .contentBlock p .orLogo {display: inline-block; vertical-align: middle; width: 8vw; padding-bottom: 3vw; margin: 0 .25vw 0; background: url(../images/orLogo.png) no-repeat center / contain;}
#introSection .contentBlock .date {background-color: #db4d49; color: #fff; font-size: 1.4vw; font-weight: 500; text-align: center; border-radius: 5vw; line-height: 1; padding: 1.3vw 0 1.35vw; margin-top: 1.75vw;}
#introSection .contentBlock .tnc{text-align: right;  }
#introSection small {font-size: 0.9vw; letter-spacing: .015vw; line-height: 2.5; padding: 0 .85vw; margin: 2% auto; }


#introSection .rewardBlock {-ms-flex: 0 0 49%; -webkit-flex: 0 0 49%; flex: 0 0 49%; max-width: 49%; display: flex; flex-flow: row nowrap; justify-content: space-between;}
#introSection .rewardBlock .rewardBox {-ms-flex: 0 0 48%; -webkit-flex: 0 0 48%; flex: 0 0 48%; max-width: 48%; padding: 4.75vw 0 2vw; text-align: center; position: relative; border-radius: 3.75vw; border: 3px solid #ffcb05; box-shadow: 0 0 8px -2px rgba(0,0,0,.35);}
#introSection .rewardBlock .rewardBox:before {content: ''; display: block; position: absolute; left: 0; right: 0; margin: auto;}
#introSection .rewardBlock .rewardBox1:before {background: url(../images/booking-icon.png) no-repeat center top / contain; width: 9vw; padding-bottom: 9vw; top: -3.85vw;}
#introSection .rewardBlock .rewardBox2:before {background: url(../images/review-icon.png) no-repeat center top / contain; width: 6.5vw; padding-bottom: 6vw; top: -1.5vw;}
#introSection .rewardBlock .rewardBox h3 {font-size: 2.15vw; font-weight: 600; line-height: 1;}
#introSection .rewardBlock .rewardBox1 .txtWrap {padding: 1.15vw 0 0;}
#introSection .rewardBlock .rewardBox2 .txtWrap {padding: 2.85vw 0 0;}
#introSection .rewardBlock .rewardBox .txtWrap p {font-size: 1.6vw; font-weight: 600; line-height: 1.2;}
#introSection .rewardBlock .rewardBox .txtWrap p .lg {font-size: 1.25em;}
#introSection .rewardBlock .rewardBox .txtWrap p .sm {font-size: .725em;}
#introSection .rewardBlock .rewardBox .txtWrap p .lhsm {line-height: .7;}
#introSection .rewardBlock .rewardBox .txtWrap small {display: block; font-size: .925vw; margin-top: .35vw;}

#introSection .deco { position: absolute; }
#introSection .deco span{ display: block; padding-bottom: 115%;}
#introSection .deco1{width: 20%; top: -18%; right: -1%; z-index: 3; }
#introSection .deco2 { width: 17%; top: -11%; left: 0; z-index: 3; }
#introSection .deco1 span{background: url(../images/decos/dish1.png) no-repeat center / contain;}
#introSection .deco2 span{background: url(../images/decos/dish2.png) no-repeat center / contain;}

@media only screen and (max-width: 48rem) {
  #introSection .siteTitle {padding: 7vw 0;}
  #introSection .siteTitle h1 {font-size: 4.85vw; font-weight: 600;}
  #introSection .siteTitle h1 .xlg {font-size: 3.15em;}
  #introSection .siteTitle h1 .goRewardIcon  { width: 42vw; padding-bottom: 15vw; margin-right: 0.5vw; }
  #introSection .siteTitle h1 .lg {font-size: 2.2em;}
  #introSection .container {max-width: 90vw; margin-top: 2.5vw; text-align: center;}
  #introSection .contentBlock, #introSection .rewardBlock {-ms-flex: 0 0 100%; -webkit-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
  #introSection .contentBlock {order: 2;}
  #introSection .contentBlock p {font-size: 4.1vw; line-height: 1.5; padding: 0 6vw; margin-top: 4vw;}
  #introSection .contentBlock p .orLogo {width: 18vw; padding-bottom: 6vw;}
  #introSection .contentBlock .date {font-size: 3.375vw; font-weight: 400; padding: 3.5vw 0; margin-top: 3.5vw;}
  #introSection .rewardBlock {order: 1;}
  #introSection .rewardBlock .rewardBox {border: none; border-radius: 8vw; padding: 9.75vw 0 5vw; box-shadow: 0 2px 10px -3px rgba(0,0,0,.35);}
  #introSection .rewardBlock .rewardBox1:before {width: 19vw; padding-bottom: 19vw; top: -7.85vw;}
  #introSection .rewardBlock .rewardBox2:before {width: 14vw; padding-bottom: 11vw; top: -3vw;}
  #introSection .rewardBlock .rewardBox h3 {font-size: 4.5vw;}
  #introSection .rewardBlock .rewardBox1 .txtWrap {padding-top: 2.15vw;}
  #introSection .rewardBlock .rewardBox2 .txtWrap {padding-top: 6.5vw;}
  #introSection .rewardBlock .rewardBox .txtWrap p {font-size: 3.5vw;}
  #introSection .rewardBlock .rewardBox .txtWrap small {font-size: 2.25vw; margin-top: 2.5vw;}
  #introSection .deco1 { width: 34%; top: 0%; right: -8%; z-index: 3; }
  #introSection .deco2 { width: 23%; top: 5%; left: -8%; z-index: 3; }
  #introSection small {font-size: 3vw; }
}








#howToJoinSection {padding: 0.5vw 0 0; background-image: linear-gradient(to bottom, #fff, #fffcdf 7%, #fffcdf 90%, #fffdef 100%);}
#howToJoinSection h2.tt {font-size: 2.5vw; font-weight: 800; text-align: center; line-height: 1; color: #4e3c2d;}
#howToJoinSection .container {max-width: 86vw; margin: auto;}
#howToJoinSection .stepWrapper {margin-top: 2vw; position: relative;}
#howToJoinSection .stepWrapper:after {content: ''; display: block; position: absolute; width: 100%; height: 80%; left: 0; bottom: 0; border-radius: 4vw 4vw 0 0; background-image: linear-gradient(to bottom, #ffcb05, rgba(255, 203, 5, 0));}
#howToJoinSection .stepWrapper .inner {max-width: 90%; margin: auto; padding-bottom: 5vw;}
#howToJoinSection .stepBox {position: relative; max-width: 80%; margin: auto;}
#howToJoinSection .stepBox h2 {font-size: 2.15vw; font-weight: 800; line-height: 1; color: #ff4c32; margin-bottom: .85vw; text-align: center;}
#howToJoinSection .stepBox .pImg {aspect-ratio: 6/9.75; position: relative;}
#howToJoinSection .stepBox .pImg img {position: absolute; top: 0;}
#howToJoinSection .stepBox1 .pImg img {max-width: 123%; left: 0;}
#howToJoinSection .stepBox2 .pImg img {max-width: 108%; left: -4%;}
#howToJoinSection .stepBox3 .pImg img {max-width: 104%; left: -2%;}
#howToJoinSection .stepBox .btm {margin-top: 1vw; text-align: center; padding: 0 1vw;}
#howToJoinSection .stepBox .btm p {font-size: 1.25vw; font-weight: 600; color: #4e3c2d; line-height: 1.2;}
#howToJoinSection .stepBox1 .btm p {color: #000;}
#howToJoinSection .stepBox .btm .downloadGroup {display: flex; flex-flow: row nowrap; justify-content: center; position: relative; max-width: 80%; margin: .5vw auto 0; padding-bottom: .35vw;}
#howToJoinSection .stepBox .btm .downloadGroup:after {content: ''; display: block; position: absolute; width: 16%; padding-bottom: 16%; left: 100%; bottom: 0; background: url(../images/click.svg) no-repeat center / contain;}
#howToJoinSection .stepBox .btm .downloadGroup > a {-ms-flex: 0 0 48%; -webkit-flex: 0 0 48%; flex: 0 0 48%; max-width: 48%; margin: 0 1%;}
#howToJoinSection .stepBox .btm .downloadGroup > a img {width: 100%;}

@media only screen and (min-width: 48rem) {
  #howToJoinSection .stepBox1 h2 {padding-right: 12%;}
  #howToJoinSection .swiper-pagination {display: none;}
}

@media only screen and (max-width: 48rem) {
  #howToJoinSection {padding-top: 6vw; background-image: linear-gradient(to bottom, #fff 10%, #fffcdf 35%, #fffcdf 90%, #fffdef 100%);}
  #howToJoinSection h2.tt {font-size: 7vw;}
  #howToJoinSection .container {max-width: 100vw;}
  #howToJoinSection .stepWrapper {margin-top: 6vw;}
  #howToJoinSection .stepWrapper:after {width: 90%; height: 60%; right: 0; margin: auto; bottom: 20%; border-radius: 16vw;} 
  #howToJoinSection .stepWrapper .inner {max-width: 100%; padding-bottom: 18vw;}
  #howToJoinSection .stepBox h2 {font-size: 8.5vw; margin-bottom: 3vw;}
  #howToJoinSection .stepBox .pImg {aspect-ratio: 7/9;}
  #howToJoinSection .stepBox1 .pImg img { max-width: 82%; left: 16%; }
  #howToJoinSection .stepBox2 .pImg img {max-width: 85%; left: 7%;}
  #howToJoinSection .stepBox3 .pImg img {max-width: 85%; left: 8%;}
  #howToJoinSection .stepBox .btm {margin-top: 2.5vw;}
  #howToJoinSection .stepBox .btm p {font-size: 5vw;}
  #howToJoinSection .stepBox .btm .downloadGroup {margin-top: 2vw;}
  #howToJoinSection .swiper-pagination {bottom: 8vw;}
  #howToJoinSection .swiper-pagination-bullet {width: 3.5vw; height: 3.5vw; margin: 0 1.85vw; box-shadow: 1px 1px 7px -2px rgba(0,0,0, 1); background: #fff; opacity: 1;}
  #howToJoinSection .swiper-pagination-bullet-active {background: #ffcb05;}
}






#mechanicsSection {position: relative;padding: 2.35vw 0 1.25vw; position: relative; background-color: #fff; box-shadow: 0 2px 8px -4px rgba(0,0,0,.5); z-index: 1;}
#mechanicsSection h2.tt {font-size: 2.5vw; font-weight: 800; text-align: center; line-height: 1; color: #4e3c2d;}
#mechanicsSection .container {max-width: 68vw; margin: auto;}
#mechanicsSection .row {display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; padding: .95vw 0;}
#mechanicsSection .row:not(:last-child) {border-bottom: 1px solid #bebebe;}
#mechanicsSection .row.head {border-bottom: 1px solid #ffd500; margin-bottom: .25vw;}
#mechanicsSection .row .col {-ms-flex: 0 0 48%; -webkit-flex: 0 0 48%; flex: 0 0 48%; max-width: 48%; padding: 0 3vw 0 5vw; position: relative;}
#mechanicsSection .row:not(.head) .colL:before,
#mechanicsSection .row:not(.head) .colL:after {content: ''; display: block; width: 3.5%; height: 4px; background-color: #4e3c2d; position: absolute; left: 100.25%; top: 0; bottom: 0; margin: auto;}
#mechanicsSection .row:not(.head) .colL:before {transform: translateY(-5px);}
#mechanicsSection .row:not(.head) .colL:after {transform: translateY(5px);}
#mechanicsSection .row.head h3 {font-size: 1.65vw; font-weight: 700; line-height: 1; display: inline-block; vertical-align: middle;}
#mechanicsSection .row.head .colL h3 {color: #097b40;}
#mechanicsSection .row.head .colR h3 {color: #f15c61;}
#mechanicsSection .row.head i {display: inline-block; vertical-align: middle;}
#mechanicsSection .row.head .bookIcon {width: 5.5vw; padding-bottom: 5.5vw; background: url(../images/booking-icon.png) no-repeat center / contain; margin: -1vw 0 -1vw -1vw;}
#mechanicsSection .row.head .reviewIcon {width: 4.35vw; padding-bottom: 3.25vw; background: url(../images/review-icon.png) no-repeat center / contain; margin: 0 .5vw 0 0;}
#mechanicsSection .row.head .goRewardIcon {width: 8vw; padding-bottom: 3.5vw; background: url(../images/gorewards@2x.png) no-repeat center / contain; margin: 0 1vw 0 0;}
#mechanicsSection .row p {font-size: 1.35vw; font-weight: 500; line-height: 1; color: #4e3c2d;}
#mechanicsSection .row .colL p span {color: #097b40;}
#mechanicsSection .row .colR p span {color: #f15c61;}
#mechanicsSection .row small {display: block; font-size: .95vw; line-height: 1; margin-top: .35vw;}

#mechanicsSection .deco { position: absolute; }
#mechanicsSection .deco span{ display: block; padding-bottom: 115%;}
#mechanicsSection .deco3 { width: 15%; bottom: -20%; right: 4px; z-index: 3; }
#mechanicsSection .deco4 { width: 17%; top: -22%; left: -6%; z-index: 3; }
#mechanicsSection .deco3 span{background: url(../images/decos/dish4.png) no-repeat center / contain;}
#mechanicsSection .deco4 span{background: url(../images/decos/dish3.png) no-repeat center / contain;}
#mechanicsSection .tnc { text-align: center; font-size: 0.7rem; }

@media only screen and (max-width: 48rem) {
  #mechanicsSection {padding: 6.5vw 0 5vw;}
  #mechanicsSection h2.tt {font-size: 7vw;}
  #mechanicsSection .container {max-width: 90vw; margin: 1.5vw 0 0 6vw;}
  #mechanicsSection .row {padding: 1.65vw 0;}
  #mechanicsSection .row.head h3 {font-size: 4.8vw;}
  #mechanicsSection .row.head .bookIcon {width: 19.5vw; padding-bottom: 19.5vw; margin: -3vw 0 -3vw -3.5vw;}
  #mechanicsSection .row.head .reviewIcon {width: 13.35vw; padding-bottom: 11.25vw; margin: 0 0 0 -2vw;}
  #mechanicsSection .row.head .goRewardIcon {width: 23vw; padding-bottom: 12.5vw; margin: 0 0 0 8vw;}
  #mechanicsSection .row .col {padding: 0 0 0 3vw;}
  #mechanicsSection .row:not(.head) .colL:before, #mechanicsSection .row:not(.head) .colL:after {width: 7%; left: 99%; height: 2px;}
  #mechanicsSection .row:not(.head) .colL:before {transform: translateY(-3px);}
  #mechanicsSection .row:not(.head) .colL:after {transform: translateY(2px);}
  #mechanicsSection .row p {font-size: 4vw; line-height: 1.2;}
  #mechanicsSection .row small {font-size: 2.85vw; margin-top: 1.15vw;}
  #mechanicsSection .deco3{ width: 25%; bottom: -12%; right: -6%;}
  #mechanicsSection .deco4 {width: 29%; top: -15%;}
}







#logosSection {padding: 1.15vw 0 0; background-image: linear-gradient(to bottom, #fffcdf 0%, #fffcdf 68%, #fffdef 75%, #fff 100%);}
#logosSection h2.tt {font-size: 2.5vw; font-weight: 800; text-align: center; line-height: 1; color: #4e3c2d;}
#logosSection h2.tt i {display: inline-block; vertical-align: middle; margin: -1.25vw 1vw 0; background: url(../images/booking-icon.png) no-repeat center / contain; width: 7vw; padding-bottom: 9vw;}
#logosSection .container {max-width: 80vw; margin: auto;}
#logosSection .logosGroupWrapper {display: flex; flex-flow: row wrap; margin-bottom: 1.5vw;}
#logosSection .logoItem {-ms-flex: 0 0 10%; -webkit-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; margin: 0 .5% .85vw;}
#logosSection .logoItem .logoImg {aspect-ratio: 1/1; position: relative;}
#logosSection .logoItem .logoImg a {display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;}
#logosSection .logoItem .logoImg img {width: 100%; height: 100%; object-fit: contain;}
#logosSection .logoItem .logoImg .tag {position: absolute; z-index: 1; left: 50%; bottom: 0; font-size: 1vw; font-weight: 400; line-height: 1; padding: 0.3vw .85vw .15vw; border-radius: 2vw; transform: translate(-50%, .25vw); background-color: #43a657; color: #fff; display: inline-block;}
#logosSection .logoItem p {font-size: 1vw; font-weight: 700; text-align: center; line-height: 1.1; margin-top: .5vw; color: #4e3c2d; padding: 0 .35vw;}
#logosSection .logoItem .offerTxt {font-size: .75vw; font-weight: 500; display: block; text-align: center; line-height: 1.1; margin-top: .35vw; color: #4e3c2d; padding: 0 .35vw;}
#logosSection h4 {text-align: center; font-size: 2vw; font-weight: 500; line-height: 1; color: #43a657;}
#logosSection .bookNowBtn {display: block; max-width: 25vw; font-size: 2.85vw; font-weight: 400; text-align: center; line-height: 1; padding: 1.45vw 0 1.5vw; border-radius: 8vw; margin: 2.15vw auto 0; color: #fff; background: #43a657; box-shadow: inset 0 -0.5vw 3.5vw -2.5vw rgba(0,0,0,.6); transition: all .2s ease-in-out;}

@media only screen and (min-width: 48rem) {
  #logosSection .bookNowBtn:hover {box-shadow: 0 0 0 0 rgba(0,0,0,0); background: #5ed276;}
}

@media only screen and (max-width: 48rem) {
  #logosSection {padding-top: 6vw;}
  #logosSection h2.tt {font-size: 7.5vw; line-height: 1.3;}
  #logosSection h2.tt i {width: 34vw; padding-bottom: 34vw; margin: -6vw 0vw -3vw;}
  #logosSection .container {max-width: 90vw; margin-top: 6vw;}
  #logosSection .logoItem {-ms-flex: 0 0 29.334%; -webkit-flex: 0 0 29.334%; flex: 0 0 29.334%; max-width: 29.334%; margin: 0 2% 5vw;}
  #logosSection .logoItem .logoImg img {border-radius: 6vw;}
  #logosSection .logoItem .logoImg .tag {font-size: 3.5vw; padding: 0.4vw 2vw .2vw; transform: translate(-50%, .9vw);}
  #logosSection .logoItem p {font-size: 2.75vw; margin-top: 1.85vw;}
  #logosSection .logoItem .offerTxt {font-size: 2.5vw; margin-top: 1vw;}
  #logosSection h4 {font-size: 8vw;}
  #logosSection .bookNowBtn {max-width: 64vw; font-size: 7vw; padding: 4vw 0 4.35vw; margin-top: 6vw;}
}





#tncPage #bodyContent .container {max-width: 82vw; margin: auto; padding: 4vw 0;}
#tncPage h1 {font-size: 4vw; font-weight: 900; text-align: center; line-height: 1; color: #ff4e26; margin: 0 auto 3vw;}
#tncPage h3 {font-size: 2vw; font-weight: 700; line-height: 1.3; color: #ff4e26; margin: 2vw 0 .35vw;}
#tncPage ol.alphabet {list-style: upper-alpha;}
#tncPage ol.roman {list-style: lower-roman;}
#tncPage li {font-size: 1.25vw; font-weight: 500; color: #5a462e; line-height: 1.7;}
#backTopBtn {width: 5.5vw; height: 5.5vw; margin: 1vw auto 0; cursor: pointer; border-radius: 50%; background-color: #fff; box-shadow: 0 2px 10px -2px rgba(0,0,0,.35); position: relative;}
#backTopBtn:before, #backTopBtn:after {content: ""; position: absolute; top: 0; bottom: 0; margin: auto; left: calc(50% - .15vw); width: .3vw; height: 1.5vw; background-color: #5a462e; transform-origin: 50% .15vw;}
#backTopBtn:before {transform: rotate(45deg);}
#backTopBtn:after {transform: rotate(-45deg);}

@media only screen and (max-width: 48rem){
  #tncPage li {font-size: 2.25vw; line-height: 1.2;}
  #tncPage ol.alphabet {padding-left: 3%;}

}




#footer {background-color: #ffc322; padding: 1rem 0 2rem; margin-top: 8vw; position: relative;}
#footer:before {content: ''; display: block; position: absolute; left: 0; bottom: calc(100% - 1px); width: 100%; padding-bottom: 7.5vw; background: url(../images/footerBG.png) no-repeat center top / 100% auto;}
#footer .container {max-width: 30rem; margin: auto; text-align: center;}
#footer h4 {font-size: 1.45rem; color: #000; font-weight: 700; line-height: 1; margin-bottom: .5rem;}
#footer p {font-size: .875rem; color: #000; line-height: 1.5;}
#footer p.cr {margin-top: .15rem;}

@media only screen and (max-width: 48rem) {
  #footer {margin-top: 23vw; padding: 1.5rem 5vw;}
  #footer:before {padding-bottom: 22vw; background-position: center -5vw; background-size: 400vw auto;}
  #footer h4 {font-size: 4.25vw;}
  #footer p {font-size: 3.15vw;}
}