/*GENERAL*/
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;}
img.ctrImg { display: block; margin: auto; }

h1 {font-size: 2.9em; line-height: 1.2;}
h3 { font-size: 1.6rem; line-height: 1.3; }
h4 { font-size: 1.4rem; line-height: 1.3; }
p { font-size: 1rem; line-height: 1.6; }
a { text-decoration: none !important; z-index: 1;}
.zh h1, .zh h3, .zh p, .zh a, .zh small {position: relative;}
small { font-size: 14px; line-height: 1.5; }
.txtYellow {color: #ffd54a;}
.alignCtr { margin: auto; width: 90%; }
.noScroll { overflow: hidden; }
.txtCtr { text-align: center; }
.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.2; 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.2); 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.2 * 1); }
.line-clamp-2 {-webkit-line-clamp : 2; height : calc(1em * 1.2 * 2); }
.line-clamp-3 {-webkit-line-clamp : 3; height : calc(1em * 1.2 * 3); }
.line-clamp-4 {-webkit-line-clamp : 4; height : calc(1em * 1.2 * 4); }
.line-clamp-5 {-webkit-line-clamp : 5; height : calc(1em * 1.2 * 5); }
.preloader { text-align: center; padding: 4em;color:#e2e5e7;}
#preloader {font-size: 0; padding: 0; text-align: center;color:#e2e5e7;}    
#preloader *, .preloader * {color: inherit;}
#preloader *:before {background-color: #e2e5e7; }
.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}

.containerL { width: 100%; margin: auto; max-width: 1200px; }
.containerS { width: 100%; margin: auto; max-width: 1000px; }
@media (min-width: 1599px) {
  .containerL, .containerS {max-width: 1600px;}
}
.row .row {margin: 0}
.mbo {display: none!important;}

/* skeleton */
.skeleton {background-color: #e2e5e7; background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0)); background-size: 40px 100%; background-repeat: no-repeat; background-position: left -40px top 0; -webkit-animation: shine 1s ease infinite; animation: shine 1s ease infinite; }
@-webkit-keyframes shine {to {background-position: right -40px top 0;}}
@keyframes shine {to {background-position: right -40px top 0;}}


@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 spin {0% {transform: rotate(0deg)} to {transform: rotate(360deg)}}
@keyframes floatDown1 {0% {transform: translateY(0%)} to {transform: translateY(1500%)}}
@keyframes floatDown2 {0% {transform: translateY(0%)} to {transform: translateY(1000%)}}
@keyframes floatDown3 {0% {transform: translateY(0%)} to {transform: translateY(400%)}}
@keyframes snowFlakeFade {
  0%, 100% { opacity: 0; }
  8%, 92% { opacity: 1; }
}

@media (min-width: 769px) {
  .float-effect {display: inline-block;transition-duration: 0.3s;transition-property: transform;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);transform: translateZ(0);box-shadow: 0 0 1px rgba(0, 0, 0, 0);}
  .float-effect:hover {transform: translateY(-5px);}
}



body { margin: 0px; position: relative; height: 100%; font-family: Noto Sans TC, "Microsoft YaHei","Source Han Sans",PingFangHK,"Heiti TC",Arial,Verdana,sans-serif; font-weight: 500;}
#bodyWrap {position: relative; margin: auto;}
#bodyContent {overflow: hidden;}

@media only screen and (max-width: 92rem) {
  html.buPage {font-size: 13px;}
}

@media only screen and (max-width: 80rem) {
  html.buPage {font-size: 11px;}
}

@media only screen and (max-width: 64.25rem) {
  html.buPage {font-size: 10px;}
}

@media only screen and (max-width: 48rem) {
  html, html.buPage , body {font-size: 13px;}
  #bodyWrap { margin: auto; min-width: 0;  }
  .mbo {display: block!important;} .dko {display: none!important;}
}




#headerNew {position: absolute; top: 0; left: 0; width: 100%; z-index: 100;}
#headerNew > .inner { padding: 2.25vw 1.5vw; }
#headerNew .maxWidth {max-width: 72vw; margin: auto; text-align: center;}
#headerNew .openrice-logo img { max-width: 9.5vw; float: left;}
#headerNew .headerDesktop { display: inline-block; margin: .75vw 0 0 -4vw;}
#headerNew .headerDesktop .li {display: inline-block; vertical-align: middle; position: relative;}
#headerNew .headerDesktop .li > a {color: #fff; font-size: 1.325vw; position: relative; display: inline-block; line-height: 1; font-weight: 700; margin: 0 .75vw; padding-bottom: .5vw;}
#headerNew .headerDesktop .li > a:before {content: ''; display: block; position: absolute; left: 0; bottom: 0; width: 0%; height: 3px; background-color: #fff; transition: width 0.1s ease-in-out;}
#headerNew .headerDesktop .li > a.active:before {width: 100%;}

@media (min-width: 48rem) {
  #headerNew .headerDesktop .li > a:hover:before {width: 100%;}
}

@media (max-width: 48rem) {
  #headerNew > .inner {padding: 8vw 0 0;}
  #headerNew .maxWidth {max-width: 23vw;}
  #headerNew .openrice-logo {display: block;}
  #headerNew .openrice-logo img {max-width: 23vw; float: none; margin: auto;}
}



#headerNew2 {background: #6298f3;}
#headerNew2 .inner {padding: 15px 10px; position: relative; z-index: 99;}
#headerNew2 .inner .openrice-logo {display: block; max-width: 110px; }

@media (min-width: 48rem) {
  #headerNew2 {width: 23%; z-index: 5; height: 100vh; position: fixed; top: 0; left: 0;}
  #headerNew2 .wrapper::-webkit-scrollbar {display: none;}
  #headerNew2 .wrapper {-ms-overflow-style: none; scrollbar-width: none;overflow-y: scroll; display: -ms-flexbox; display: -webkit-box; display: -webkit-flex; display: flex; -ms-flex-flow: column nowrap;-webkit-flex-flow: column nowrap; flex-flow: column nowrap; -webkit-justify-content: space-between; justify-content: space-between; height: 100%; background: url(../images/subpage/bg_subpage_side.jpg) no-repeat center top / 100% auto; }
  #headerNew2 .wrapper:after {content: ''; display: block; width: 100%; bottom: 0; left: 0; padding-bottom: 68%; background: url(../images/subpage/page-graphic.png) no-repeat center bottom / 100% auto;}
  #headerNew2 .inner {padding: 0; }
  #headerNew2 .inner .headerDesktop .menuKv {background: url(../images/subpage/page-TT.png) no-repeat center center; background-size: contain; padding-bottom: 55%; margin: 8% auto 8%; max-width: 95%; display: block;}
  #headerNew2 .inner .headerDesktop .li {max-width: 70%; margin: auto;}

  #headerNew2 a.bu-link {display: block; font-weight: 800; font-size: 1.585rem; letter-spacing: .1rem; margin: 0; line-height: 3.35rem; color: #fff; position: relative; border-radius: 6rem; padding: 3px;}
  #headerNew2 a.bu-link:before {content: ''; display: block; width: 2.25rem; height: 2.25rem; border-radius: 50%; position: absolute; left: 18%; top: 0; bottom: 0; margin: auto; border: 1px solid #fff;}
  #headerNew2 a.bu-link.active {color:#3775d0; background: linear-gradient(17deg, #c4a76a, #f5f8db, #ccb497);}
  #headerNew2 a.bu-link.active:before {background: url(../images/subpage/menu-bell.png) no-repeat center; background-size: 105%; border-color: rgba(0, 0, 0, 0.0); z-index: 1;}
  #headerNew2 a.bu-link > span {display: block; padding-left: 36%; padding-bottom: .1rem; position: relative; border-radius: 6rem;}
  #headerNew2 a.bu-link.active > span {background: linear-gradient(to bottom, #f4f9ff, #cadcfe); box-shadow: inset 0px 0px 3px rgba(0, 0, 0, 0.25);}
}

/* @media (min-width: 1500px) {
  #headerNew2 .inner .headerDesktop .menuKv {margin: 30px auto 0;}
} */

@media only screen and (max-width: 64.25rem) {
  #headerNew2 .inner .headerDesktop .li {max-width: 85%;}
}

@media (max-width: 48rem) {
  #headerNew2 {/*position: fixed;*/ position: absolute; top: 0; left: 0; width: 100%; z-index: 100; background: transparent;}
  /* .noScroll #headerNew2 {z-index: 1000;}
  #headerNew2.is-scrolled {top: -60px; -webkit-transition: all .2s; -moz-transition: all .2s; transition: all .2s; }
  #headerNew2.is-scrollup {top: 0; -webkit-transition: all .2s; -moz-transition: all .2s; transition: all .2s; } */
  #headerNew2 .inner {padding: 3vw;}
  #headerNew2 .inner .openrice-logo {max-width: 22vw; }
  #headerNew2 .inner .openrice-logo img {width: 100%;}
}




@media only screen and (max-width: 48rem) {
  .grid-button {padding: 0; position: absolute; z-index: 100; right: 2vw; top: 1vw;}
  .grid-button .grid {position: relative;display: block; width: 12vw; height: 12vw; cursor: pointer; margin: 0 auto; -webkit-transition: all 0.3s; transition: all 0.3s; }
  .grid-button .grid:after {content: ''; display: block; position: absolute; width: 70%; height: 70%; border-radius: 50%; left: 15%; top: 15%;}
  .grid-button .grid.open:after {border: 1px solid #fff;}
  .grid-button .grid > span {position:absolute;top: calc(50% - 1px);left:0;right:0;margin:auto;display:block;width:45%; height:2px; background-color:#fff}
  .grid-button .grid > span:before,
  .grid-button .grid > span:after {content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-transition: all 0.3s; transition: all 0.3s; background-color: #fff;}
  .grid-button .grid > span:before {-webkit-transform: translateY(-7px);transform: translateY(-7px);}
  .grid-button .grid > span:after {-webkit-transform: translateY(7px);transform: translateY(7px);}
  .grid-button .grid.open > span {background: 0 0;}
  .grid-button .grid.open > span:before{-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg); background-color: #fff;}
  .grid-button .grid.open > span:after{-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg); background-color: #fff;}
  #headmenus {opacity: 1;visibility: visible; width: 100%; height: 100%;position: fixed; top: 0;left: 100%; z-index: 100; background: #181b2a url(../images/subpage/bg_subpage_side.jpg) no-repeat center top / 100% auto; transition: all .3s ease-in-out;}
  #headmenus.navOpened {left: 0; box-shadow: -4px 0px 4px rgba(0,0,0,0.15);}
  #headmenus > .wrap {overflow-y: scroll; padding: 60px 0 0; text-align: left; height: 100%;}
  #headmenus > .wrap .mmenuKv {padding-bottom: 38%; background: url(../images/subpage/page-TT.png) no-repeat center / contain; margin-bottom: 10vw;}

  #headmenus > .wrap > a { display: block; width: calc(100% - 45vw); margin: 1.5vw auto; position: relative; font-size: 5vw; font-weight: 800; line-height: 11vw; color: #fff; border-radius: 12vw; padding: 2px;}
  #headmenus > .wrap > a:before {content: ''; display: block; width: 7vw; height: 7vw; border-radius: 50%; position: absolute; left: 18%; top: 0; bottom: 0; margin: auto; border: 1px solid #fff;}
  #headmenus > .wrap > a.active {color:#3775d0; background: linear-gradient(17deg, #c4a76a, #f5f8db, #ccb497);}
  #headmenus > .wrap > a.active:before {background: url(../images/subpage/menu-bell.png) no-repeat center; background-size: 108%; border-color: rgba(0, 0, 0, 0.0); z-index: 1;}
  #headmenus > .wrap > a > span {display: block; padding-left: 36%; padding-bottom: .15vw; position: relative; border-radius: 12vw;}
  #headmenus > .wrap > a.active > span {background: linear-gradient(to bottom, #f4f9ff, #cadcfe); box-shadow: inset 0px 0px 3px rgba(0, 0, 0, 0.25);}

}








.buPage #bodyContent {background: url(../images/subpage/bg_subpage_main.jpg) no-repeat top center, linear-gradient(to bottom, #fff 73rem, #faeff8, #9ce6fd 100%); position: relative;}
.buPage .result-container, .buPage #bodyContent > .inner {position: relative; margin: auto;}


@media (min-width: 769px) {
  .buPage #bodyWrap {font-size: 0;}
  .buPage #bodyWrap:before {content: "";display: inline-block; width: 23%; height: 100vh; position: relative;}
  .buPage #bodyContent {min-height: 100vh; padding: 0px 0 10rem; display: inline-block;position: relative; width: 77%;}
  .result_wrapper { padding:0px ;}
  .result-container { padding: 40px 30px;}
  #bookingPage .result-container { padding: 10px 30px 40px;}
}


@media (min-width: 1500px) {
  .buPage #bodyContent > .inner {max-width: 80rem; }
}

@media (min-width: 1920px) {
  .buPage #bodyContent {background-size: 100% auto;}
}

@media (max-width: 1500px) {
  .buPage .result-container, .buPage #bodyContent > .inner {max-width: 78rem;}
}

@media (max-width: 768px) {
  .buPage #bodyContent {padding: 12vw 0 0;width: 100%; margin-left: 0; background: url(../images/subpage/bg_subpage_main_m@2x.jpg) no-repeat top center / 100% auto, linear-gradient(to bottom, #fff 130vw, #faeff8 230vw, #9ce6fd 100%);}

}



.anchorNav {height: 3.375rem; position: relative; margin: 0px auto; text-align: center; z-index: 5;}
.anchorNav .container {-webkit-transition: all .2s; -moz-transition: all .2s; transition: all .2s; top: -70px; text-align: center; font-size: 0;}
.anchorNav.sticky .container {position: fixed; z-index: 5; width: 100%; max-width: 100%; right: 0; top: 0; padding: 1rem 5px; -webkit-transition: all .1s; -moz-transition: all .1s; transition: all .1s; box-shadow: 0px 0px 6px -1px rgba(0,0,0,.15); background: rgba(255, 255, 255, 0.85);}
/* .anchorNav.sticky .container:before, .anchorNav.sticky .container:after {content: ''; display: block; position: absolute; width: 100%; left: 0; height: 2px; background: #e1ce97; background: linear-gradient(-90deg, rgba(253,242,188,0.2) 0%, rgba(227,196,131,1) 13%, rgba(253,242,188,1) 43%, rgba(253,253,253,1) 55%, rgba(230,219,165,1) 87%, rgba(253,242,188,0.2) 100%);}
.anchorNav.sticky .container:before {top: 0;}
.anchorNav.sticky .container:after {bottom: 0;} */


.anchorNav .filterBtn, .anchorNav .allBtn {position: relative; display: inline-block; vertical-align: middle; margin: 0 .4rem; cursor: pointer; background: linear-gradient(17deg, #c4a76a, #f5f8db, #ccb497); border-radius: 6rem; padding: 4px;}
.anchorNav .filterBtn span, .anchorNav .allBtn span {display: block; position: relative; z-index: 2; font-size: 1.35rem; font-weight: 700; line-height: 2.85rem; color: #fff; text-align: center; width: 10rem; height: 3rem; border-radius: 6rem; padding-bottom: .1rem; background: linear-gradient(to bottom, #fa5f9e, #e2387a); transition: all .2s;}
.anchorNav .filterBtn.active span, .anchorNav .allBtn.active span {background: linear-gradient(to bottom, #efd39b, #aa924a);}


.catListTTImg {margin: 0 auto 3.5rem; position: relative; width: 35rem; height: 10rem; padding-top: 4.5rem;}
.catListTTImg:before {content: ''; display: block; position: absolute; z-index: 0; top: 0%; left: 0%; width: 100%; height: 100%; background: url(../images/subpage/title.png) no-repeat center / contain;}
.catListTTImg span {position: relative; font-size: 2.35rem; font-weight: 800; line-height: 1; color: #fff; text-align: center; display: block; z-index: 1;}


@media (min-width: 769px) {
  .anchorNav.sticky .container {width: 77%;}
}

@media (max-width: 768px) {
  .anchorNav {height: 10vw; margin: 2vw auto 4vw; }
  .anchorNav.sticky {z-index: 100;}
  .anchorNav .container {font-size: 0; white-space: nowrap;overflow-y: scroll;-ms-overflow-style: none;scrollbar-width: none;}
  .anchorNav .container::-webkit-scrollbar {display: none;}
  .anchorNav.sticky .container {width:100%; padding: .5rem 5px; background: #fff;}
  .anchorNav .filterBtn, .anchorNav .allBtn {margin: 0 1vw; padding: 3px; border-radius: 10vw;}
  .anchorNav .filterBtn:first-child {margin-left: 5vw;}
  .anchorNav .filterBtn:last-child {margin-right: 5vw;}
  .anchorNav .filterBtn span, .anchorNav .allBtn span {width: 32vw; height: 9vw; border-radius: 10vw; font-size: 4.15vw; line-height: 8.5vw; padding-bottom: .1vw;}
  .catListTTImg {margin: 3rem auto 2.5rem; width: 24rem; height: 7rem; padding-top: 3.5rem;}
  .catListTTImg span {font-size: 1.75rem;}
}



.subcatWrap {margin: 0px auto 50px;}
.subcatWrap .holder > .filterBtn {display: inline-block;vertical-align: middle;position: relative;margin: 0 8px;cursor: pointer;font-size: 1.3rem;color: #ed5e58;border-radius: 5px;letter-spacing: 1px;font-weight: 600;padding: 0.3em 3%;line-height: 2;border: 1px solid;}
.subcatWrap .holder > .filterBtn.active {background-color: #ed5e58; color: #fff; border-color: #ed5e58;}
@media (min-width: 769px) {
  .subcatWrap .holder > .filterBtn {min-width: 140px;}
}
@media (max-width: 768px) {
  .subcatWrap {margin-bottom: 30px;}
  .subcatWrap .holder > .filterBtn {font-size: 1.15rem; margin: 0 3px; line-height: 33px;padding:0 2.5% ;}
}



.poiList {margin: auto; font-size: 0; text-align: center; display: none;}
.poiList.active {display: block;}
.offerItem {box-shadow: 0px 1px 2px #ddd; position: relative; text-align: left; background-color: #fff;}
@media (min-width: 769px) {
  #specialPage .pageTT img {max-width: 34rem; margin: 3.5rem auto 0;}
  #bookingPage .pageTT img {max-width: 36rem; margin: 3.5rem auto 0;}
  #bookingPage .pageTT2 img {max-width: 30rem; margin: 0 auto;}
  #voucherPage .pageTT img {max-width: 33.5rem; margin: 3.5rem auto 0;}
  #tasPage .pageTT img {max-width: 36rem; margin: 3.5rem auto 0;}
  #payPage .pageTT img {max-width: 36rem; margin: 3.5rem auto 0;}
  .poiList {padding: 0;}
  .offerItem {width: 32%; display: inline-block; vertical-align: top; margin: 0 5px 15px; padding: 0 0 90px; max-width: 330px}
}

@media (max-width: 768px) {
  .pageTT {margin: auto; width: 100%;}
  #specialPage .pageTT img {max-width: 77vw; margin: 2vw auto 12vw;}
  #bookingPage .pageTT img {max-width: 75vw; margin: 2vw auto 0;}
  #voucherPage .pageTT img {max-width: 70vw; margin: 2vw auto;}
  #tasPage .pageTT img {max-width: 77vw; margin: 2vw auto 0;}
  #payPage .pageTT img {max-width: 75vw; margin: 4vw auto 0;}
  .result-container {padding: 0 6vw 12vw;}
}






#offerBlock {margin: 4rem 0 3rem;}
.banner {margin: 20px auto; font-size: 0; box-sizing: content-box; border: 1px solid #9f9f9f; border-radius: 30px; overflow: hidden; background-color: #fff; }
.banner .info {text-align: center;}
.banner .info .bannerTT {font-size: 2rem; color: #333; font-weight: 800; margin-bottom: .25rem;}
.banner .info .offerTT {font-size: 2rem; display: inline-block; color: #333; font-weight: 800;}
.banner .info .offerTT .small {font-size: .785em; display: inline-block;}
.banner .info .offerTT .big {font-size: 1.15em;}
.banner .info .txtBrown {color: #bc8649;}
.banner .info .txtRed {color: #d9251e;}
.banner .info .txtPink {color: #f76b9f;}
.banner .info .txtBlue {color: #3e89e2;}
.banner .info .bgBrown {background-color: #bc8649;}
.banner .info .bgRed {background-color: #d9251e;}
.banner .info .bgPink {background-color: #f76b9f;}
.banner .info .bgBlue {background-color: #3e89e2;}
.banner .info hr {display: block; margin: 1rem auto; max-width: 90%; border-width: 1px 0;}

.banner .info .code {font-size: 1.75rem; line-height: 1.8; display: inline-block; color: #fff; font-weight: 800; margin: 10px auto; padding: 0 1rem .1rem; border-radius: 5px;}
.banner .info .tncBtn {margin: 0.5em 0; color: #777; font-size: .785rem; display: inline-block; border: 1px solid; border-radius: 3px; padding: 0 25px; line-height: 2; font-weight: 800;}
.banner .info .btn {color: #777; font-size: 1rem; border: 1px solid; margin-top: 10px; border-radius: 5px; padding: 0 25px 4px; display: inline-block; line-height: 1.5; font-weight: 800;}
.banner .info .note {color: #777; font-size: .925rem; display: block; font-weight: 800;}
.banner .img {position: relative;}

#bookingPage .banner .info hr {margin-bottom: 1.5rem; max-width: 87%;}
#bookingPage .banner .img {background: url(../images/subpage/02-booking/booking-banner.jpg) no-repeat center / cover;}

#voucherPage .banner .info .code {margin: 2px auto 6px;}
#voucherPage .banner .img {background: url(../images/subpage/03-voucher/voucher-banner.jpg) no-repeat center / cover;}

#tasPage .banner .img {background: url(../images/subpage/04-tas/tas-banner.jpg) no-repeat center / cover;}
#tasPage .banner .info .offerTT {font-size: 2.1rem;}
#tasPage .banner .info .offerTT .small {font-size: .775em;}

#payPage .banner .img {background: url(../images/subpage/05-orp/orp-banner.jpg) no-repeat center / cover;}
#payPage .banner .info .bannerTT {font-size: 1.6rem; margin-bottom: .15rem;}
#payPage .banner .info .offerTT .small {display: block;}
#payPage .banner .info hr {margin: 1.5rem auto; max-width: 93%;}
#payPage .banner .info .rdi {display: inline-block; vertical-align: middle; width: 2.3rem; height: 2.15rem; background: url(../images/subpage/05-orp/RD.png) no-repeat center / contain;}

@media (min-width: 769px) {
  .banner {position: relative; max-width: 62rem;}
  .banner .info {padding: 25px 20px; width: 49%; }
  .banner .img {position: absolute; right: 0; top: 0; height: 100%; width: 51%;}
  #bookingPage .banner .info .note {margin-bottom: 1rem;}
  #voucherPage .banner .info {width: 53%;}
  #voucherPage .banner .img {width: 47%;}
  #tasPage .banner .info {width: 43%;}
  #tasPage .banner .img {width: 57%;}
  #payPage .banner .info {width: 53%;}
  #payPage .banner .img {width: 47%;}
}

@media (max-width: 640px) {
  #offerBlock {margin-top: 16vw;}
  .banner {margin: 0 auto; max-width: 90vw; position: relative; border-radius: 4vw;}
  .banner .img {padding-bottom: 57%; width: 100%;}
  .banner .info {padding: 15px 15px 25px;}
  .banner .info .bannerTT, .banner .info .offerTT2 {font-size: 1.7rem;}
  .banner .info .offerTT {font-size: 1.5rem;}
  .banner .info .code {font-size: 1.45rem;}
  .banner .info .tncBtn {font-size: .85rem; line-height: 1.8; padding: 0 10px;}
  .banner .info .btn {font-size: .85rem; line-height: 1.85; padding-bottom: 1px;}

  #voucherPage .banner .img {background: url(../images/subpage/03-voucher/voucher-banner-m.jpg) no-repeat center / cover;}
  #tasPage .banner .img {background: url(../images/subpage/04-tas/tas-banner-m.jpg) no-repeat center / cover;}
  #payPage .banner .img {background: url(../images/subpage/05-orp/orp-banner-m.jpg) no-repeat center / cover;}
}
@media (max-width: 320px) {
  .banner .info .bannerTT, .banner .info .offerTT2 {font-size: 1.2rem;}
}









.footerWrap {position: relative; z-index: 1;}
.footerWrap .footerTop {padding: 2rem 1.5rem 1.5rem; background: #f6f5fe; border-radius: 4rem 4rem 0 0;}
.buPage .footerWrap .footerTop {border-radius: 0;}
footer .container {max-width: 74rem; margin: auto;}
.footTopTxt {color: #6476d0;}
.footTopTxt p {font-weight: 700; margin-bottom: .15rem; font-size: 1.35rem;}
.footTopTxt small {display: block; font-size: 0.85rem; line-height: 1.6;}
.footTopSocialGroup {text-align: right;}
.footTopSocialGroup .tncBtn {display: inline-block; vertical-align: middle; margin: .1rem .35rem 0; font-size: .85rem; line-height: 1.8; padding: 0 .5rem .1rem; color: #6476d0; border: 1px solid; border-radius: 3px;}
.footTopSocialGroup .foot-social {display: inline-block; vertical-align: middle; margin: 0 .35rem; }
.footTopSocialGroup .foot-social.ig {background: url(../images/social-icons/instagram.svg) no-repeat center center; width: 1.5rem; height: 1.5rem;}
.footTopSocialGroup .foot-social.yt {background: url(../images/social-icons/youtube.svg) no-repeat center center; width: 1.5rem; height: 1.5rem;}
.footTopSocialGroup .foot-social.fb {background: url(../images/social-icons/facebook.svg) no-repeat center center; width: 1.5rem; height: 1.5rem;}
.footerCR {color: #6476d0; margin-top: .25rem; text-align: right;}
.footerCR > span {display: inline-block; vertical-align: middle;}
#OR_FOOT_logo {width: 1.25rem; height: 1.25rem;}
#OR_FOOT_logo img {display: block; width: 100%; height: 100%;}
.footerCR > span.copyright-text {font-size: .85rem; margin-left: 5px;}

@media only screen and (min-width: 769px) {
  .buPage footer {position: absolute; bottom: 0;width: 100%; z-index: 4;}
}
@media only screen and (max-width: 768px) {
  .footerWrap .footerTop, .buPage .footerWrap .footerTop {padding: 6vw; border-radius: 10vw 10vw 0 0;}
  footer .container {max-width: 100vw;}
  .footTopTxt {text-align: center;}
  .footTopTxt p {font-size: 4.5vw; margin-bottom: 2.5vw;}
  .footTopTxt small {font-size: 3vw;}
  .footTopSocialGroup {text-align: center; margin-top: 3vw;}
  .footTopSocialGroup .tncBtn {font-size: 2.65vw; padding: 0 1.5vw; display: block; max-width: 19vw; margin: 0 auto 3vw;}
  .footTopSocialGroup .foot-social {margin: 0 1.5vw; width: 5vw!important; height: 5vw!important;}
  .footerCR {text-align: center; margin-top: .85rem;}
  .footerCR > span#OR_FOOT_logo {width: 4.25vw; height: 4.25vw; vertical-align: top; margin-top: -.95vw;}
  .footerCR > span.copyright-text {font-size: 2.5vw;}
  .footerCR .mRowDrop {display: block;}
  /* #backTopBtn {position: absolute; right: 3vw; top: -7vw; width: 14vw;height: 14vw;background: url(../images/subpage/mobile/up_m.png) no-repeat center center / contain;cursor: pointer;} */
}





.snowWrapper {position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 0;}
.snow {background: white; border-radius: 100%; left: 50%; position: absolute; top: 0; width: 6px; height: 6px;
  box-shadow: 0 0px 3px 0px #fff, 30px 30px 0px 0 #fff, 150px 60px 3px 0 #fff,
    300px 90px 3px 0 #fff, 90px 210px 3px 0 #fff, 390px 210px 3px 0px #fff,
    -90px 90px 3px 0 #fff, -165px 135px 3px 0 #fff, -240px 90px 3px 0 #fff,
    -390px 120px 3px 0 #fff, -450px 270px 3px 0 #fff, -480px 240px 3px 0 #fff,
    -570px 390px 3px 0 #fff, -450px 450px 3px 0 #fff, -390px 360px 3px 0 #fff,
    -300px 390px 3px 0 #fff, -270px 240px 3px 0 #fff, -120px 300px 3px 0 #fff,
    -90px 270px 3px 0 #fff, 0px 300px 3px 0 #fff, 120px 320px 3px 0 #fff,
    240px 360px 3px 0 #fff, 150px 540px 3px 0 #fff, 300px 450px 3px 0 #fff,
    420px 360px 3px 0 #fff, 510px 270px 3px 0 #fff, 510px 390px 3px 0 #fff,
    480px 420px 3px 0 #fff, 510px 390px 3px 0 #fff, 30px 390px 3px 0 #fff,
    540px 540px 3px 0 #fff, 600px 480px 3px 0 #fff, 600px 780px 3px 0 #fff,
    750px 285px 3px 0 #fff, -600px 480px 3px 0 #fff, -600px 540px 3px 0 #fff,
    -660px 555px 3px 0 #fff, -450px 600px 3px 0 #fff, -300px 750px 3px 0 #fff,
    -240px 585px 3px 0 #fff, -570px 840px 3px 0 #fff, -450px 1050px 3px 0 #fff,
    -750px 750px 3px 0 #fff, 450px 1050px 3px 0 #fff, 300px 690px 3px 0 #fff;

  -webkit-animation: snow 10s linear infinite;
  -moz-animation: snow 10s linear infinite;
  animation: snow 10s linear infinite;
}

.snow::after {content: ""; background: white; border-radius: 100%; left: 100px; position: absolute; top: -200px; width: 6px; height: 6px;
  box-shadow: 0 0px 3px 0px #fff, 30px 30px 0px 0 #fff, 150px 60px 3px 0 #fff,
  300px 90px 3px 0 #fff, 90px 210px 3px 0 #fff, 390px 210px 3px 0px #fff,
  -90px 90px 3px 0 #fff, -165px 135px 3px 0 #fff, -240px 90px 3px 0 #fff,
  -390px 120px 3px 0 #fff, -450px 270px 3px 0 #fff, -480px 240px 3px 0 #fff,
  -570px 390px 3px 0 #fff, -450px 450px 3px 0 #fff, -390px 360px 3px 0 #fff,
  -300px 390px 3px 0 #fff, -270px 240px 3px 0 #fff, -120px 300px 3px 0 #fff,
  -90px 270px 3px 0 #fff, 0px 300px 3px 0 #fff, 120px 320px 3px 0 #fff,
  240px 360px 3px 0 #fff, 150px 540px 3px 0 #fff, 300px 450px 3px 0 #fff,
  420px 360px 3px 0 #fff, 510px 270px 3px 0 #fff, 510px 390px 3px 0 #fff,
  480px 420px 3px 0 #fff, 510px 390px 3px 0 #fff, 30px 390px 3px 0 #fff,
  540px 540px 3px 0 #fff, 600px 480px 3px 0 #fff, 600px 780px 3px 0 #fff,
  750px 285px 3px 0 #fff, -600px 480px 3px 0 #fff, -600px 540px 3px 0 #fff,
  -660px 555px 3px 0 #fff, -450px 600px 3px 0 #fff, -300px 750px 3px 0 #fff,
  -240px 585px 3px 0 #fff, -570px 840px 3px 0 #fff, -450px 1050px 3px 0 #fff,
  -750px 750px 3px 0 #fff, 450px 1050px 3px 0 #fff, 300px 690px 3px 0 #fff;
}

.snow::before {content: ""; background: white; border-radius: 100%; left: -200px; position: absolute; top: -300px; width: 6px; height: 6px;
  box-shadow: 0 0px 3px 0px #fff, 30px 30px 0px 0 #fff, 150px 60px 3px 0 #fff,
  300px 90px 3px 0 #fff, 90px 210px 3px 0 #fff, 390px 210px 3px 0px #fff,
  -90px 90px 3px 0 #fff, -165px 135px 3px 0 #fff, -240px 90px 3px 0 #fff,
  -390px 120px 3px 0 #fff, -450px 270px 3px 0 #fff, -480px 240px 3px 0 #fff,
  -570px 390px 3px 0 #fff, -450px 450px 3px 0 #fff, -390px 360px 3px 0 #fff,
  -300px 390px 3px 0 #fff, -270px 240px 3px 0 #fff, -120px 300px 3px 0 #fff,
  -90px 270px 3px 0 #fff, 0px 300px 3px 0 #fff, 120px 320px 3px 0 #fff,
  240px 360px 3px 0 #fff, 150px 540px 3px 0 #fff, 300px 450px 3px 0 #fff,
  420px 360px 3px 0 #fff, 510px 270px 3px 0 #fff, 510px 390px 3px 0 #fff,
  480px 420px 3px 0 #fff, 510px 390px 3px 0 #fff, 30px 390px 3px 0 #fff,
  540px 540px 3px 0 #fff, 600px 480px 3px 0 #fff, 600px 780px 3px 0 #fff,
  750px 285px 3px 0 #fff, -600px 480px 3px 0 #fff, -600px 540px 3px 0 #fff,
  -660px 555px 3px 0 #fff, -450px 600px 3px 0 #fff, -300px 750px 3px 0 #fff,
  -240px 585px 3px 0 #fff, -570px 840px 3px 0 #fff, -450px 1050px 3px 0 #fff,
  -750px 750px 3px 0 #fff, 450px 1050px 3px 0 #fff, 300px 690px 3px 0 #fff;
}

@keyframes snow {
  0% {transform: translate(0, 0); opacity: 0.15;}
  20% {transform: translate(-20px, 100px);opacity: 1;}
  70% {transform: translate(-70px, 250px);opacity: 0.7;}
  100% {transform: translate(-100px, 300px);opacity: 0.1;}
}


.snow2 {content: ""; position: absolute; top: -100px; left: 50%; border-radius: 50%; width: 10px; height: 10px; background: #fff; opacity: 0.8;
  -webkit-animation: slowSnow 30s linear infinite;
  -moz-animation: slowSnow 30s linear infinite;
  animation: slowSnow 30s linear infinite;
  box-shadow: 0 0px 6px 0px #fff, -60px 150px 4px 1px #fff,
    240px 210px 4px 1px #fff, 600px 450px 4px 1px #fff, -600px 450px 4px 1px #fff,
    -300px 300px 4px 1px #fff, 270px 540px 4px 1px #fff, 570px 840px 4px 1px #fff,
    -450px 750px 4px 1px #fff, -570px 840px 4px 1px #fff,
    -570px 240px 4px 1px #fff, -750px 600px 4px 1px #fff,
    -810px 1140px 4px 1px #fff, 810px 990px 4px 1px #fff,
    -600px 1170px 4px 1px #fff, -720px 930px 4px 1px #fff,
    540px 1040px 4px 1px #fff;
}

.snow2::before {content: ""; position: absolute; top: -500px; left: 50%; border-radius: 50%; width: 10px; height: 10px; background: #fff; opacity: 0.8;
  -webkit-animation: slowSnow 20s linear infinite;
  -moz-animation: slowSnow 20s linear infinite;
  animation: slowSnow 20s linear infinite;
  box-shadow: 0 0px 6px 0px #fff, -60px 150px 4px 1px #fff,
  240px 210px 4px 1px #fff, 600px 450px 4px 1px #fff, -600px 450px 4px 1px #fff,
  -300px 300px 4px 1px #fff, 270px 540px 4px 1px #fff, 570px 840px 4px 1px #fff,
  -450px 750px 4px 1px #fff, -570px 840px 4px 1px #fff,
  -570px 240px 4px 1px #fff, -750px 600px 4px 1px #fff,
  -810px 1140px 4px 1px #fff, 810px 990px 4px 1px #fff,
  -600px 1170px 4px 1px #fff, -720px 930px 4px 1px #fff,
  540px 1040px 4px 1px #fff;
}

@keyframes slowSnow {
  0% {transform: translate(0, 0);}
  20% {transform: translate(-20px, 100px);}
  70% {transform: translate(0px, 250px);}
  100% {transform: translate(10px, 300px);}
}