/*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; } .clickableArea {width:100vw;height: 100vh;position: absolute;z-index: 1;} 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; } img.ctrImg { display: block; margin: auto; } @font-face { font-family: 'openrice'; src: url('../fonts/icomoon.eot?vcyzrx'); src: url('../fonts/icomoon.eot?vcyzrx#iefix') format('embedded-opentype'), url('../fonts/icomoon.ttf?vcyzrx') format('truetype'), url('../fonts/icomoon.woff?vcyzrx') format('woff'), url('../fonts/icomoon.svg?vcyzrx#icomoon') format('svg'); font-weight: normal; font-style: normal; } html { scroll-behavior: smooth; } [class*=" icon-"], [class^=icon-] {font-family: openrice!important;font-style: normal;font-weight: 700;font-variant: normal;text-transform: none;line-height: 1;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;} .icon-facebook:before {content: "\ea90";} .icon-chevron-thin-left:before {content: "\e902";} .icon-chevron-thin-right:before {content: "\e901";} 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: .5px; } .en * {letter-spacing: 0!important;} small { font-size: 14px; line-height: 1.5; } .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.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); } .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;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} .linkbtn {display: inline-block;box-shadow: inset -0.5px -1.9px 5px 0 rgba(0, 1, 0, 0.35); background-image: linear-gradient(to top, #b5c0e7, #eeeaf3); padding: 7px 20px; color: #1a3444; text-align: center; letter-spacing: 2px; font-weight: 600; line-height: 1;} .containerL { width: 100%; margin: auto; max-width: 1200px; } .containerS { width: 100%; margin: auto; max-width: 1000px; } .mbo {display: none;} #tcBtn {display: inline-block;} .row .row {margin: 0} /* 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; } } /*HEADER*/ .caret {display: inline-block;width: 0;height: 0;margin-left: 2px;vertical-align: middle;border-top: 4px solid;border-right: 4px solid transparent;border-left: 4px solid transparent;} .headerInner{position:relative}@font-face{font-family:icomoon;src:url(../font/icomoon.eot?ee7fk8);src:url(../font/icomoon.eot?ee7fk8#iefix) format('embedded-opentype'),url(../font/icomoon.ttf?ee7fk8) format('truetype'),url(../font/icomoon.woff?ee7fk8) format('woff'),url(../font/icomoon.svg?ee7fk8#icomoon) format('svg');font-weight:400;font-style:normal;font-display: swap;}[class*=" icon-"],[class^=icon-]{font-family:icomoon!important;font-style:normal;font-weight:700;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-google:before{content:"\e900"}.icon-facebook:before{content:"\ea90"}.icon-twitter:before{content:"\ea96"}.icon-youtube:before{content:"\ea9d"}.icon-instagram:before{content:"\ea92"}.icon-chevron-thin-left:before{content:"\e902"}.icon-chevron-thin-right:before{content:"\e901"}*,:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.clearfix:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}.headerInner .li,.headerInner .li a{color:#4e3c2e;font-size:14px}* html .clearfix{zoom:1}img{max-width:100%}.globalContainer{max-width:1100px;width:100%;margin:auto;}.headerWrap{background-color:#fff155}.headerInner>a{float:left}.headerInner>div.headerDesktop{float:right;margin-top:8px}.headerInner .openrice-logo>img{max-width:110px;display:inline-block}.headerInner .li{font-weight:700;display:inline-block;vertical-align:middle;margin-left:25px}#mHeaderMenu{width:100%;background-color:rgba(0,0,0,.7);max-height:0;overflow:hidden;z-index:99;text-align:center;-webkit-transition:all .3s;-moz-transition:all .3s;-o-transition:all .3s;transition:all .3s}@media (max-width:640px){.headerInner>div.headerDesktop{display:none}#mHeaderMenu,.burgerNav,.mMenuLinks,.mMenuLinks>a,.mMenuSocials{display:block}.headerInner .openrice-logo>img{max-width:100px}.mMenuLinks>a{border-bottom:1px solid rgba(255,255,255,.25)}} #headerNew {position: fixed; left: 0; top: 0; width: 100%; z-index: 100;} #headerNew > .inner { background-color: white; padding: 20px 0;} #headerNew .maxWidth {max-width: 1100px;margin: auto;} #headerNew .openrice-logo {display: inline-block; max-width: 110px;} #headerNew .openrice-logo > img {display: inline-block;} #headerNew .voucher-logo {display: inline-block;max-width: 125px; vertical-align: middle; margin-left: .75em; padding-left: .75em; position: relative;} #headerNew .voucher-logo:before {content: ''; display: block; width: 1px; height: 80%; background: #ccc; position: absolute; left: 0; top: 0; bottom: 0; margin: auto;} #headerNew .headerDesktop { float: right; margin-top: 8px;} #headerNew .headerMobile {display: none;} #headerNew .headerDesktop .li { color: #4e3c2e;font-size: 12px;font-weight: 700;display: inline-block;vertical-align: middle;margin-left: 5px; position: relative;} #headerNew .headerDesktop .li > a, #headerNew .headerDesktop .li > span {color: #4e3c2e;font-size: 18px; border: 1px solid #4e3c2e; padding: 5px 20px; border-radius: 20px; line-height: 1;cursor: pointer;} #headerNew .headerDesktop .li > a.headbtn.homebtn {color: #009345; border: 1px solid #009345; padding: 4px 15px; line-height: 1;} #headerNew .headerDesktop .li > a.headbtn.homebtn svg {fill: #009345; width: 1em; display: inline-block; vertical-align: middle; margin-right: 0.5em; margin-top: -0.2em; height: 100%;} .share-button-tooltip-container {z-index: 1;display: flex;position: absolute;top: 200%;right: 0; display: none;} .show .share-button-tooltip-container {display: block;} .share-button-tooltip-container .share-tooltip { background-color: #fff; border-radius: 8px; align-items: center; padding: 10px 15px; display: flex; box-shadow: 0 0 10px #0003; } .share-button-tooltip-container .share-button { cursor: pointer; margin-right: 15px; } .share-button-tooltip-container .facebook-share-button { background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNiAzNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8ZGVmcz4KICAgICAgICA8cGF0aCBpZD0ia3l2YmljcnVlYSIgZD0iTTAgMGgyNHYyMy44NTRIMHoiLz4KICAgIDwvZGVmcz4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNiA2KSI+CiAgICAgICAgICAgIDxtYXNrIGlkPSJhaWNqYzI5cG1iIiBmaWxsPSIjZmZmIj4KICAgICAgICAgICAgICAgIDx1c2UgeGxpbms6aHJlZj0iI2t5dmJpY3J1ZWEiLz4KICAgICAgICAgICAgPC9tYXNrPgogICAgICAgICAgICA8cGF0aCBkPSJNMjQgMTIuMDcyQzI0IDUuNDA0IDE4LjYyNyAwIDEyIDAgNS4zNyAwLS4wMDIgNS40MDQtLjAwMiAxMi4wNzItLjAwMSAxOC4xIDQuMzg3IDIzLjA5MyAxMC4xMjQgMjR2LTguNDM3SDcuMDc3di0zLjQ5aDMuMDQ3di0yLjY2YzAtMy4wMjUgMS43OTItNC42OTcgNC41MzMtNC42OTcgMS4zMTMgMCAyLjY4Ni4yMzYgMi42ODYuMjM2djIuOTcxSDE1LjgzYy0xLjQ5IDAtMS45NTYuOTMtMS45NTYgMS44ODZ2Mi4yNjRoMy4zMjlsLS41MzIgMy40OWgtMi43OTdWMjRDMTkuNjEyIDIzLjA5MyAyNCAxOC4xIDI0IDEyLjA3MiIgZmlsbD0iIzE4NzdGMiIgbWFzaz0idXJsKCNhaWNqYzI5cG1iKSIvPgogICAgICAgIDwvZz4KICAgICAgICA8cGF0aCBkPSJNMjIuNjcgMjEuNDY4IDIzLjIwNCAxOGgtMy4zMjl2LTIuMjUyYzAtLjk0OS40NjUtMS44NzQgMS45NTYtMS44NzRoMS41MTN2LTIuOTUzcy0xLjM3My0uMjM0LTIuNjg2LS4yMzRjLTIuNzQxIDAtNC41MzMgMS42NjEtNC41MzMgNC42NjlWMThoLTMuMDQ3djMuNDY4aDMuMDQ3djguMzg2YTEyLjA5IDEyLjA5IDAgMCAwIDMuNzUgMHYtOC4zODZoMi43OTciIGZpbGw9IiNGRkYiLz4KICAgIDwvZz4KPC9zdmc+Cg==); background-size: 100%; width: 36px; height: 36px; display: block; } .share-button-tooltip-container .twitter-share-button { background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNSIgaGVpZ2h0PSIyNSIgdmlld0JveD0iMCAwIDI1IDI1Ij4KICAgIDxwYXRoIGZpbGw9IiMwMEFCRjAiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTE5LjgzIDYuMjk3YTguNDQxIDguNDQxIDAgMCAwIDEuMjEyLS4zMzljLjQzMy0uMTY5Ljg2Ny0uMzU5IDEuMDI4LS40NTFhMzcuNCAzNy40IDAgMCAxIC4zNzQtLjIxYy0uMTM3LjM1OS0uMjQuNTk5LS4zMS43Mi0uMTAzLjE4Mi0uMzcuNTkyLS41OTcuODI2YTUuNjI5IDUuNjI5IDAgMCAxLS42ODcuNTg1IDcuMTMzIDcuMTMzIDAgMCAxLS4yMTEuMTRjLjE4Mi0uMDE1LjMzOS0uMDM3LjQ3LS4wNjYuMTk2LS4wNDQuODMzLS4xOTUgMS4wMjYtLjI2LjE5Mi0uMDY0LjUwNC0uMTc2LjYzLS4yMjcuMDgzLS4wMzQuMTYxLS4wNjkuMjM1LS4xMDVhNC4yODIgNC4yODIgMCAwIDEtLjIzNi4zMzNjLS4wOTYuMTItLjMzNy40MzYtLjQ1Ni41NjMtLjExOC4xMjctLjQ0OC40ODMtLjcwNC43MS0uMjU1LjIyNi0uNDk1LjQwNy0uNTYyLjQ2LS4wNDUuMDM1LS4wNzguMDU5LS4wOTguMDcxLjAwNC44NjYtLjAxNiAxLjQ1Ni0uMDYgMS43Ny0uMDY1LjQ3Mi0uMTg5IDEuMjU4LS4zNDggMS44MjQtLjE1OS41NjYtLjM2OSAxLjE1OC0uNTUyIDEuNTczYTE1LjYyMiAxNS42MjIgMCAwIDEtLjk3OCAxLjgzNWMtLjQuNjI5LS43NDMgMS4wMzMtLjkwOCAxLjIyOS0uMTY2LjE5Ni0uNjg4Ljc0Ny0uODU4LjkwNi0uMTcuMTYtMS4wNTUuODg4LTEuMjM0IDEuMDExLS4xOC4xMjMtMS4yMy44MDMtMS45NTIgMS4xMDItLjcyMi4yOTgtMS4zMjMuNDg5LTEuODk0LjYyNS0uNTcuMTM2LTEuNi4yODItMi4yMjguMzEyLS42MjguMDMtMS4yODYuMDEyLTEuOTIxLS4wNXMtMS4yMTMtLjIxMy0xLjY5NS0uMzJjLS40ODItLjEwNS0uOTI3LS4yOTYtMS4zOTYtLjQ2Mi0uNDctLjE2Ni0xLjAzNi0uNDkzLTEuMjg3LS42MkE3LjA3IDcuMDcgMCAwIDEgMyAxOS40MDhjLjMyLjAzMS41MTYuMDQ3LjU4OC4wNDcuMTA3IDAgLjU2Mi4wMzIgMS4wOTMtLjAyLjUzMi0uMDUzLjg1My0uMDk2IDEuMjY4LS4yMDdhOS4yNDQgOS4yNDQgMCAwIDAgMS4xMjYtLjM2NmMuMzQ3LS4xNDMuODIxLS4zODYgMS4wMDMtLjQ4Ny4xODMtLjEuNTktLjM3Mi43MzMtLjQ3NmwuMjYtLjE5NWMtLjEwOS4wMDYtLjIyOSAwLS4zNi0uMDE4YTUuMTEgNS4xMSAwIDAgMS0uODQ0LS4xODIgNC44NzQgNC44NzQgMCAwIDEtLjc5Mi0uMzU2IDUuMjYgNS4yNiAwIDAgMS0uNjk4LS41MTQgNC45OTMgNC45OTMgMCAwIDEtLjQ5My0uNTM2IDUuODI0IDUuODI0IDAgMCAxLS40NDItLjcyMSA0LjUzMiA0LjUzMiAwIDAgMS0uMjExLS41MzhjLjE4NS4wNDIuMzE3LjA2Ny4zOTYuMDc3LjEyLjAxNS40LjAxNC41MjQuMDE0cy40MzMtLjAzNC41MzYtLjA1MmMuMTAyLS4wMTcuMjEtLjA0LjI1LS4wNTMuMDI3LS4wMS4wNzktLjAyMi4xNTUtLjAzOGEzLjYyOCAzLjYyOCAwIDAgMS0uNDM0LS4xMDYgNy4yNTYgNy4yNTYgMCAwIDEtLjY0LS4yNjljLS4xMzQtLjA3MS0uNTYzLS4zMjQtLjgxOS0uNTYtLjI1NS0uMjM1LS42MDQtLjU4LS44NzQtMS4wNzdhNC41NyA0LjU3IDAgMCAxLS40OTUtMS41MjhjLS4wMzMtLjI4Ni0uMDQzLS40MTEtLjAzLS4zNzd2LS4xNjFjLjIyMS4xMi40MDIuMjA2LjU0Mi4yNTcuMjEuMDc1LjU3Ni4xOC43Ni4yMDcuMTg1LjAyNy4zNzMuMDQ3LjQzOS4wNDdoLjExNmE4LjMyMiA4LjMyMiAwIDAgMS0uMzgxLS4yODMgNS41OTQgNS41OTQgMCAwIDEtLjQ3My0uNDc0IDQuNTU5IDQuNTU5IDAgMCAxLS41NzMtLjg4NiA0LjE4NSA0LjE4NSAwIDAgMS0uMzgyLTEuNDEyIDQuMzIgNC4zMiAwIDAgMSAuMTcyLTEuNTc3Yy4wOS0uMjU3LjI4Ni0uNjk3LjMyMi0uNzYyLjAyNC0uMDQyLjA0LS4wNy4wNDctLjA4NWE5LjkyIDkuOTIgMCAwIDAgLjc4My44NzdjLjE5Ni4xOTguNTg0LjU1Ljc5Mi43MjQuMjA3LjE3NS43OTUuNjI3IDEuMDQ4Ljc4NS4yNTMuMTU5LjYxNi40MDEgMS4xMDIuNjQxLjQ4Ny4yNC45NjQuNDU5IDEuMzU2LjU5MS4zOTIuMTMzIDEuMTE5LjM1NSAxLjUyMi40MzYuNDA0LjA4Ljg5Ni4xNjIgMS4yMjIuMTk0LjIxOC4wMi40MjguMDM2LjYyOS4wNDctLjA0Mi0uMTktLjA3LS4zNTEtLjA4My0uNDgxYTUuOTkzIDUuOTkzIDAgMCAxLS4wMTQtLjc4N2MuMDE0LS4xOTkuMDk4LS42NjguMTgzLS45MjUuMDg2LS4yNTcuMy0uNzA0LjM5OC0uODY2LjA5Ny0uMTYyLjM0NC0uNDkzLjUxNi0uNjc5LjE3MS0uMTg1LjQ5LS40NDguNzAyLS41OTQuMjEzLS4xNDcuNjU4LS4zNzIuODY1LS40NS4yMDctLjA3OC41Ni0uMjEzIDEuMDU0LS4yMzcuNDk0LS4wMjQuMzk3LS4wMTQuNTgtLjAxNC4xODQgMCAuNTEuMDMzLjg4LjE0Mi4zNy4xMDkuNzI0LjI2Mi45NDIuMzg3LjIxOC4xMjQuNDYyLjI5Mi42NjUuNDY5LjEzNS4xMTguMjM1LjIxNy4yOTkuMjk3eiIvPgo8L3N2Zz4K); background-size: 100%; width: 25px; height: 25px; display: block; } .share-button-tooltip-container .email-share-button { background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNSIgaGVpZ2h0PSIyNSIgdmlld0JveD0iMCAwIDI1IDI1Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPHBhdGggZD0iTTAgMGgyNXYyNUgweiIvPgogICAgICAgIDxnIGZpbGw9IiMzRTNFM0UiPgogICAgICAgICAgICA8cGF0aCBkPSJNMjEuOTU5IDcuN0wxMyAxMy45NjJsLTguOTM3LTYuMzNDNC4xOTUgNy4yNjEgNC41MiA3IDQuOSA3aDE2LjJjLjQwMyAwIC43NDQuMjk0Ljg1OS43ek00IDkuMTE4bDUuNCAzLjk3Mkw0IDE3LjYwNlY5LjExOHptMTggLjA5M3Y4LjM5NWwtNS40LTQuNTE2TDIyIDkuMjExeiIvPgogICAgICAgICAgICA8cGF0aCBkPSJNNC45NTQgMTguMzlsNS4zMjMtNC42MDMgMi43OTcgMS44NDkgMi42MjYtMS44NSA1LjM4NSA0LjU0NmEuODE4LjgxOCAwIDAgMS0uMzA0LjA1OEg0Ljk1NHoiLz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPgo=); background-size: 100%; width: 25px; height: 25px; display: block; } .share-button-tooltip-container .copylink-share-button { background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNSIgaGVpZ2h0PSIyNSIgdmlld0JveD0iMCAwIDI1IDI1Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPHBhdGggZD0iTTAgMGgyNXYyNUgweiIvPgogICAgICAgIDxwYXRoIGZpbGw9IiMzRTNFM0UiIGQ9Ik04LjkyMSAxOS42NTNsMi44OTMtMi44OTJhLjgxOC44MTggMCAxIDEgMS4xNTcgMS4xNTdMOS41IDIxLjM4OGEuODE4LjgxOCAwIDAgMS0xLjE1NyAwbC00LjA1LTQuMDQ5YS44MTguODE4IDAgMCAxIDAtMS4xNTdsNi4zNjQtNi4zNjRhLjgxOC44MTggMCAwIDEgMS4xNTcgMGwxLjE1NyAxLjE1N2EuODE4LjgxOCAwIDEgMS0xLjE1NyAxLjE1N2wtLjU3OS0uNTc4TDYuMDMgMTYuNzZsMi44OTIgMi44OTItLjAwMS4wMDF6bTEyLjE1LTkuODM1bC02LjM2NCA2LjM2NGEuODE4LjgxOCAwIDAgMS0xLjE1NyAwbC0xLjczNi0xLjczNmEuODE4LjgxOCAwIDEgMSAxLjE1Ny0xLjE1N2wxLjE1NyAxLjE1NyA1LjIwNy01LjIwNy0yLjg5My0yLjg5Mi0yLjg5MiAyLjg5MmEuODE4LjgxOCAwIDEgMS0xLjE1Ny0xLjE1N2wzLjQ3LTMuNDdhLjgxOC44MTggMCAwIDEgMS4xNTggMGw0LjA1IDQuMDQ5Yy4zMi4zMi4zMi44MzcgMCAxLjE1N3oiLz4KICAgIDwvZz4KPC9zdmc+Cg==); background-size: 100%; width: 25px; height: 25px; display: block; } .share-button-tooltip-container .share-button:last-child { margin-right: 0; } #copiedMsgNoti {position: fixed; background-color: #000c; border-radius: 12px; text-align: center; padding: 0 20px; top: 0; bottom: 0; left: 0; right: 0; margin: auto; box-shadow: 0 0 4px #fff; font-size: 1em; z-index: 200; color: #fff; width: 10rem; height: 3rem; line-height: 3rem;} #copiedMsgNoti.hide {opacity: 0; visibility: hidden; transition: all .3s;} #dropmenus {position: relative; height: 100%; display: flex;-ms-flex-flow: row nowrap;-webkit-flex-flow: row nowrap; flex-flow: row nowrap;font-size: 17px;} #dropmenus .dropmenu {display: inline-block; vertical-align: middle; width: calc(45% - 1px); margin-left: 1px;} #dropmenus .dropmenu.sorting {order:1;} #dropmenus .dropmenu.district {order:2;} #dropmenus .dropmenu.cuisine {order:3;} #dropmenus .dropmenubtn {color: #888;padding: 0.8em;line-height: 1;cursor: pointer;background-color: #fff;font-weight: 400;letter-spacing: 1px;} #dropmenus .dropmenu .dropmenubtn .txt {} #dropmenus .dropmenu .dropmenubtn .searchBarIcon {display: inline-block;margin-right: 0.25em;width: 20px;height: 20px;vertical-align: bottom;} #dropmenus .dropmenu.down .dropmenubtn .txt, #dropmenus .dropmenu.down .dropmenubtn .caret {color:#009245} #dropmenus .dropmenu.down .dropmenubtn .caret { -webkit-transform: rotate(180deg);transform: rotate(180deg);} #dropmenus .dropmenu .subcat-dropmenu-block {padding: 20px 30px;opacity: 0;display: none;background: #fff;position: absolute; z-index: 20; top: 100%; width: 100%; left: 0;-webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);box-shadow: 0 6px 12px rgba(0,0,0,.175); margin: 5px 0 0;} #dropmenus .dropmenu.down .subcat-dropmenu-block {opacity: 1;display: block;animation: animShowLangMenu .3s;-webkit-transform: translateY(0px);transform: translateY(0px);border-radius: 8px;} #dropmenus .dropmenu #tabs {display: -ms-flexbox;display: -webkit-box; display: -webkit-flex;display: flex; -webkit-flex-flow: row nowrap; -ms-flex-flow: row nowrap; flex-flow: row nowrap; border: 1px solid #ccc;} #dropmenus .dropmenu #tabs .tab {-ms-flex: 1 0 20%;-webkit-box-flex: 0;-webkit-flex: 1 0 20%;flex: 1 0 20%; font-size: 17px; text-align: center; font-weight: 400; letter-spacing: 1px; line-height: 1.9; cursor: pointer; color: #4e3c2e; border-left: 1px solid #ccc;} #dropmenus .dropmenu #tabs .tab:first-child {border: none;} #dropmenus .dropmenu #tabs .tab.active {background-color: #009245; color: #fff;} #dropmenus .dropmenu .categorys .list {opacity: 0;display: none; padding: 20px 0;} #dropmenus .dropmenu .categorys .list.active {opacity: 1;display: block;animation: animShowLangMenu .3s;-webkit-transform: translateY(0px);transform: translateY(0px);} .dropmenu ul li {font-size: 15px; font-weight: 400; padding: 0 5px; margin: 7px 0; letter-spacing: 1px; display: inline-block; vertical-align: middle; width: 20%;} .dropmenu.sorting ul li {width: auto; margin-right: 15px;} .dropmenu ul li input[type="radio"] {margin-right: 5px; cursor: pointer; display: inline-block; vertical-align: middle; margin: 0 ; position: absolute; left: -9999px;} .dropmenu.district ul li:first-child {display: block;} .dropmenu ul li label {color: #666; cursor: pointer;display: inline-block; position: relative; padding-left: 23px; } .dropmenu ul li label:before {content: '';position: absolute;left: 0;top: 3px;width: 15px;height: 15px;border: 1px solid #666;border-radius: 100%;background: #fff;} .dropmenu ul li label:after {content: '';width: 15px;height: 15px;background: #009245;position: absolute;top: 3px;left: 0px;border-radius: 100%;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;} .dropmenu ul li input[type="radio"]:not(:checked) + label:after {opacity: 0;-webkit-transform: scale(0);transform: scale(0);} .dropmenu ul li input[type="radio"]:checked + label:after {opacity: 1;-webkit-transform: scale(1);transform: scale(1);} #dropmenus #searchbtn {display: inline-block; vertical-align: middle; width: 10%; background-color: #009245; cursor: pointer; height: 100%; position: relative; order:4;} #dropmenus #searchbtn svg {width: 60%; height: 60%; fill: #fff; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto;} .result_wrapper {width:100%;margin:0 auto;} #resultList {background-color: transparent; } #resultList #notfound {font-size: 23px;} #moreBtn {color: #000; display: block; border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;background-color: #ffd64a; width: 150px; text-align: center; padding: 15px; margin: 0 auto; cursor: pointer;font-size: 16px;margin: 30px auto;} #clientList {font-size: 0;} #clientList > .clientLogo {display: inline-block; vertical-align: middle; width: 12%; margin: 0 2% 2%; padding-bottom: 19%;} .vwPriceBtns.vw1 {display: none;} #mheadbar {background: rgba(0,0,0,0.8); opacity: 0; z-index: -1; width: 100%; height: calc(100% - 50px); position: fixed; left: 0; top: 50px; overflow-y: scroll; -webkit-transition: all .3s ease;-o-transition:all .3s ease;transition:all .3s ease} #mheadbar.navOpened {z-index: 100; opacity: 1; } #mheadbar .inner {padding: 30px; text-align: center; background-color: #f6f6ec; font-size: 0; position: absolute; left: 0; top: -600px; width: 100%;-webkit-transition: all .3s ease;-o-transition:all .3s ease;transition:all .3s ease} #mheadbar.navOpened .inner {top: 0;} #mheadbar .inner a {display: inline-block; vertical-align: middle; width: 19%; margin: 0 .5%; max-width: 180px;} 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: 500; font-size: 14px; min-width: 80em; color: #222; padding-top: 75px;} #bodyWrap { margin: auto;} #bodyContent {overflow: hidden;} @media only screen and (max-width: 768px) { #bodyWrap { margin: auto; min-width: 0; } } @media only screen and (max-width: 640px) { p {font-size: 14px;} .mbo {display: block;} .dko {display: none!important;} .grid-button {padding: 7px; position: absolute; z-index: 1000; right: 10px; top: 5px; border-radius: 50%; background: #fff;} .grid-button .grid {position: relative;display: block; width: 22px; height: 20px; cursor: pointer; margin: 0 auto; float: none; -webkit-transition: all 0.3s; transition: all 0.3s; } .grid-button .grid > span {position: absolute; top: calc(50% - 1px); display: block; width: 100%; height: 3px; background-color: #6559a5; } .grid-button .grid > span:before, .grid-button .grid > span:after {content: ""; position: absolute; width: 100%; height: 100%; background-color: #6559a5; -webkit-transition: all 0.3s; transition: all 0.3s; } .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, .grid-button .grid.open > span:before, .grid-button .grid.open > span:after {background-color: #6559a5;} .grid-button .grid.open {-webkit-transform: rotate(45deg); transform: rotate(45deg); } .grid-button .grid.open > span:before {-webkit-transform: rotate(90deg); transform: rotate(90deg); } .grid-button .grid.open > span:after {-webkit-transform: rotate(90deg); transform: rotate(90deg); } #headmenus {opacity: 1;visibility: visible;width: calc(100% - 50px);height: 100%;position: fixed;top: 0;left: 100%;z-index: 1000;background:url(https://static8.orstatic.com/info/campaign/2021/Mastercard/Q4-weekly-special/images/bg-purple.jpg);-webkit-transition: all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;} #headmenus.navOpened {left: 55px;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 {background: url(https://static8.orstatic.com/info/campaign/2021/Mastercard/Q4-weekly-special/images/KV-menu.jpg) no-repeat center center; background-size: cover; padding-bottom: 44%; margin-bottom: 30px;} #headmenus > .wrap > a {display: block; font-weight: 600; font-size: 24px; letter-spacing: 5px; margin: 10px 30px; line-height: 50px; color: #fff; position: relative; padding-left: 80px; border-radius: 20px;} #headmenus > .wrap > a:before {content: ''; display: block; width: 35px; height: 35px; border-radius: 50%; border: 1px solid #fff; position: absolute; left: 25px; top: 0; bottom: 0; margin: auto;} #headmenus > .wrap > a.active {border: 1px solid #fff; color: #733588;} #headmenus > .wrap > a.active:before {background: url(https://static8.orstatic.com/info/campaign/2021/Mastercard/Q4-weekly-special/images/menu-heart@2x.png) no-repeat center 65%; background-size: 70%; background-color: #733588; border-color: #733588;} } @media only screen and (max-width: 340px) { #headmenus > .wrap > a {font-size: 20px; letter-spacing: 3px; margin: 5px 20px; padding-left: 70px;} } @media screen and ( max-width:768px) { body {min-width:0;} .mbl {display: block!important;} .dkt, #headerNew .headerDesktop {display: none!important;} #headerNew .globalContainer {padding: 0;} body {padding-top:52px;min-width:0;} .container {width: 100%;} .dkt {display: none;} .mbl {display: block;} .lity-iframe-container {height:700px;} #headerNew {border-bottom: 1px solid #ccc;} #headerNew .maxWidth {max-width: 700px;} #headerNew > .inner {padding: 1.5% 0 1.5%; } #headerNew .headerDesktop {display: none;} #headerNew .headerMobile {display: block;width: 100%;position: absolute;top:0;} #headerNew .headerMobile .grid-button {padding:1%;z-index: 100;position: fixed; background-color: #009345;border-radius: 10px;border: 2px solid white; top: 10px;} #headerNew .headerMobile .grid {position: relative;display: block;width: 100%;cursor: pointer;margin: 0 auto;float: none;padding:20% 20%;} #headerNew #mheadbar {background-color: #fff; z-index: 1000; width: 100%; height: 100%; position: fixed; top: 0; left: 100%; overflow-y: scroll; -webkit-transition: left .3s ease;-o-transition:left .3s ease;transition:left .3s ease} #headerNew #mheadbar.navOpened {left: 0;} #headerNew #mheadbar .head {padding: 17px 5px; text-align: right; position: absolute; top: 0; left: 0; width: 100%; font-size: 0; border-bottom: 1px solid #ccc;} #headerNew #mheadbar .head .close {cursor: pointer; width: 50px; height: 50px; position: absolute; left: 5px; top: 0;} #headerNew #mheadbar .head .close svg {fill: #3a3a3a; width: 25px; height: 25px; position: absolute; margin: auto; top: 0; bottom: 0; left: 0; right: 0;} #headerNew #mheadbar .head a.headbtn {display: inline-block; letter-spacing: 1px; line-height: 1; padding: 0 10px; font-size: 17px; font-weight: 600; color: #009345;} #headerNew #mheadbar .head a.headbtn svg {fill: #009345; width: 15px; display: inline-block; vertical-align: middle; margin-right: 5px; margin-top: -4px; height: 100%;} #headerNew #mheadbar .head a.headbtn:last-child {border-left: 1px solid #009345;} #headerNew #mheadbar .head a.headbtn span {letter-spacing: 0;} #headerNew #mheadbar .chosen {position: relative; width: 100%; left: 0; top: 50px; padding: 1em; border-bottom: 1px solid #ccc;} #headerNew #mheadbar .chosen div {display: inline-block; vertical-align: middle; line-height: 30px; font-size: 17px; letter-spacing: 1px; padding: 0 1em;} #headerNew #mheadbar #mdropmenus {height: calc(100vh - 145px); margin-top: 3em; overflow-y: scroll;} #headerNew #mheadbar #mdropmenus .container {} #headerNew #mheadbar #mdropmenus .tabs {display: flex;-ms-flex-flow: row wrap;-webkit-flex-flow: row wrap; flex-flow: row wrap;} #headerNew #mheadbar #mdropmenus .tabs .dropmenu {width: 100%;} #headerNew #mheadbar #mdropmenus .tabs .dropmenu.sorting {order:1;} #headerNew #mheadbar #mdropmenus .tabs .dropmenu.district {order:2;} #headerNew #mheadbar #mdropmenus .tabs .dropmenu.cuisine {order:3;margin-bottom: 4rem;} #headerNew #mheadbar #mdropmenus .tabs .dropmenu button {background-color: #eee; color: #000; outline: none; border: none; border-bottom: 1px solid #ccc; display: block; width: 100%; text-align: left; cursor: pointer; padding: 1em 2em; font-size: 17px; transition: 0.4s; -webkit-transition: .4s; -moz-transition: .4s;} #headerNew #mheadbar #mdropmenus .tabs .dropmenu button.active {background-color: #009345; color: #ffffff;} #headerNew #mheadbar #mdropmenus .tabs .dropmenu button:after {content: '\e901';color: #777;font-weight: 600;float: right; font-family:icomoon!important; margin-left: 5px; -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg);} #headerNew #mheadbar #mdropmenus .tabs .dropmenu.sorting button:after {display: none;} #headerNew #mheadbar #mdropmenus .tabs .dropmenu button.active:after {-webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); transform: rotate(-90deg);} #headerNew #mheadbar #mdropmenus .tabs .dropmenu .panel, #headerNew #mheadbar #mdropmenus .tabs .dropmenu .subpanel {max-height: 0;overflow: hidden; transition: max-height 0.2s ease-out;} #headerNew #mheadbar #mdropmenus .tabs .dropmenu .subtab {background-color: #ffffff;} #headerNew #mheadbar #mdropmenus .tabs .dropmenu .subtab.active {background-color:#ade2c5;color:#000000;} #headerNew #mheadbar #mdropmenus .tabs .dropmenu .panel ul {padding: 15px 2rem; font-size: 0;} #headerNew #mheadbar #mdropmenus .tabs .dropmenu .panel ul li {width: 50%; padding: 0;} #headerNew #mheadbar #mdropmenus .tabs .dropmenu.sorting .panel ul li {width: 100%;} #headerNew #mheadbar .btns {position: fixed; bottom: 0; left: 100%; width: 100%; padding: 8px; background-color: #fff;} #headerNew #mheadbar.navOpened .btns {left: 0} #headerNew #mheadbar .btns .columns {padding: 2px;} #headerNew #mheadbar .btns .btn {cursor: pointer; display: block; color: #fff; text-align: center; line-height: 45px; letter-spacing: 1px; font-weight: 400; font-size: 15px;} #headerNew #mheadbar .btns .btn.clearBtn {background-color: #b3b3b3;} #headerNew #mheadbar .btns .btn.searchbtn {background-color: #009345;} /*#search {display: none;}*/ .mbl.homebtn {display: none;} .grid-button {display: block; position: fixed; border-radius: 50%; background-color: #fff; top: 5px; right: 5px; margin: 0; padding: 10px 11px; z-index: 20;} .grid-button .grid {width: 20px; height: 25px; margin-top: -3px; margin-left: 2px;} .grid-button .grid > span, .grid-button .grid > span:before, .grid-button .grid > span:after {border-radius: 10px;} #headmenus {opacity: 1;visibility: visible;width: calc(100% - 50px);height: 100%;position: fixed;top: 0;left: 100%;z-index: 10; background: #fff; -webkit-transition: all .3s ease;-o-transition:all .3s ease;transition:all .3s ease} #headmenus.navOpened {left: 55px;box-shadow: -4px 0px 4px rgba(0,0,0,0.15);} #headmenus > .wrap > img {display: block;} #headmenus > .wrap {overflow-y: scroll; text-align: left;} #headmenus > .wrap > a {display: block; font-size: 22px; letter-spacing: 0px; margin: 0 40px;line-height: 70px;} #headmenus > .wrap > a:nth-child(2) {margin-top: 2rem;} #headmenus > .wrap .cats {padding: 0 40px 20px;} #headmenus > .wrap .cats > .row {-ms-flex-flow: column wrap;-webkit-flex-flow: column wrap;flex-flow: column wrap;} #headmenus > .wrap .cats .col {margin-top: 15px; display: block;} #headmenus > .wrap .cats .tt {font-size: 20px; font-weight: 600; letter-spacing: 2px; line-height: 1; color: #000;} #headmenus > .wrap .cats .tt:before {content: ''; display: inline-block; vertical-align: middle; width: 40px; height: 40px; margin-right: 8px; margin-top: -2px;} #headmenus > .wrap .cats .columns:last-child {padding-bottom:5rem;} #headmenus > .wrap .cats a.item {font-size: 19px; display: block; color: #6a7766; line-height: 1; margin: 20px 0;letter-spacing: 2px;position: relative;} #headmenus > .wrap .mbtm {background-color: #adadad; padding: 1rem 0 10rem 40px; width: 100%;} #headmenus > .wrap .mbtm a {color: #fff; line-height: 1.3; display: inline-block; font-size: 19px; letter-spacing: 2px;} #headmenus > .wrap .mbtm a:first-child {border-right: 1px solid #fff;padding-right: 15px;} #headmenus > .wrap .mbtm a:last-child {padding-left: 15px;} #headmenus > .wrap > a:after {content: "";display: block;width: 30px;height: 30px;position: absolute;right: 0;top: 0;bottom: 0;margin: auto;background: url(https://www.openrice.com/info/global/img/backtopArr.png) no-repeat center center;background-size: contain;transform: rotate(90deg);} #headmenus > .wrap .cats a.item:after {content: "";display: block;width: 20px;height: 20px;position: absolute;right: 0;top: 0;bottom: 0;margin: auto;background: url(https://www.openrice.com/info/global/img/backtopArr.png) no-repeat center center;background-size: contain;transform: rotate(90deg);} #headmenus > .wrap > a.drp:after {transform: rotate(180deg);} #headmenus .head-dropmenu-block {display: none;} } @media screen and ( max-width:640px) { small {font-size: 0.9rem;} #headerNew .maxWidth {max-width: 90%;} #headerNew > .inner {padding: 3.5% 0 3%; } #headerNew .openrice-logo {max-width: 90px;} #headerNew .openrice-logo > img {margin-left: 3%;} #headerNew .voucher-logo {max-width: 95px; margin-left: .5em;padding-left: .5em;} #headerNew .headerDesktop {margin-top: 1px;} .mbl.homebtn {color: #009345;line-height: 1;display: inline-block;position: relative;right: 18%;float: right;top: 0;width: 9%;} .mbl.homebtn svg {fill: #009345;width: 100%;display: inline-block;height: 100%;} } .footerWrap .footerTop {background-color: #000; padding: 30px 15px;} .footTopTxt {color: #fff; max-width: 625px;} .footTopTxt p {font-weight: 600; margin-bottom: 5px; font-size: 1.1rem;} .en .footTopTxt small {font-size: .75em;} .footTopSocialGroup {text-align: right;} .footTopSocialGroup .foot-social {display: inline-block; vertical-align: middle; margin: 0 5px; } .footTopSocialGroup .foot-social.ig {background: url(https://static5.orstatic.com/info/campaign/2021/Mastercard/Q4-weekly-special/images/instagram.svg) no-repeat center center; width: 20px; height: 20px;} .footTopSocialGroup .foot-social.yt {background: url(https://static6.orstatic.com/info/campaign/2021/Mastercard/Q4-weekly-special/images/youtube.svg) no-repeat center center; width: 20px; height: 20px;} .footTopSocialGroup .foot-social.fb {background: url(https://static6.orstatic.com/info/campaign/2021/Mastercard/Q4-weekly-special/images/facebook.svg) no-repeat center center; width: 20px; height: 20px;} .footTopSocialGroup .foot-social.mw {background: url(https://static5.orstatic.com/info/campaign/2021/Mastercard/Q4-weekly-special/images/mewe.svg) no-repeat center center; width: 35px; height: 35px;} #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;} .footerCR {color: #fff; margin-top: 5px; text-align: right;} .footerCR > span {display: inline-block; vertical-align: middle;} .footerCR > span.copyright-text {font-size: .7rem; margin-left: 5px;} #backtopBtn {position: absolute;right: 20px;top: -20px;width: 41px;height: 41px;background: url(https://www.openrice.com/info/global/img/backtopArr.png) no-repeat center center / contain;cursor: pointer;} @media only screen and (max-width: 640px) { .footTopTxt /*{text-align: center;}*/ .footTopTxt p {font-size: 1rem;} .footTopTxt small {font-size: .75em;} .footTopSocialGroup {text-align: center; margin-top: 20px;} .footerCR {text-align: center;} .footerCR > span#OR_FOOT_logo {max-width: 15px; vertical-align: top;} .footerCR .mRowDrop {display: block;} } @media (max-width: 360px) {.footerCR > span {font-size: 9px;}} .KV {position: relative; z-index: 0; } .KV:after {content: ''; position: absolute; display: block; width: 100%; height: 100%; top: 0; left: 0; background: linear-gradient(-45deg, transparent 30%, #fde6ba 60%, #fffef0 65%, #fde6ba 70%, transparent 80% 100%); background-size: 280% 100%; animation: gradient 6s infinite cubic-bezier(.62, .28, .23, .99) both; opacity: .6; -webkit-clip-path: circle(calc(2.113 * 100vw) at 50% calc(100% - calc(2.13 * 100vw))); clip-path: circle(calc(2.113 * 100vw) at 50% calc(100% - calc(2.13 * 100vw)));} @keyframes gradient { 0% {background-position: 0% 50%;} 50% {background-position: -200% 50%;} 100% {background-position: 0% 50%;} } #intro {position: relative; padding: 0 20px 70px; text-align: center; margin: auto; max-width: 61rem;} #intro .vImg {max-width: 58rem; width: 100%;} #intro .txtImg {margin: 1.75rem auto .75rem; max-width: 58rem; width: 100%;} #intro a {color: #5E4821; display: inline-block; padding-bottom: 2px; border-bottom: 2px solid;} #intro .deco {position: absolute; margin: auto; } #intro .deco1 {background: url(../images/coupon1.png) no-repeat center / contain; width: 140px; height: 123px; right: 109%; top: -5%; animation: float1 1.5s ease-in-out infinite alternate;} #intro .deco2 {background: url(../images/coupon2.png) no-repeat center / contain; width: 118px; height: 109px; left: 110%; top: -4%; animation: float2 1.2s ease-in-out infinite alternate;} #intro .deco3 {background: url(../images/coupon3.png) no-repeat center / contain; width: 122px; height: 125px; right: 104%; top: 30%; animation: float2 1.6s ease-in-out infinite alternate;} #intro .deco4 {background: url(../images/coupon4.png) no-repeat center / contain; width: 131px; height: 79px; left: 111%; top: 35%; animation: float3 1.4s ease-in-out infinite alternate;} @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 (max-width: 80rem) { #intro .deco1 {right: 105%; width: 100px;} #intro .deco2 {left: 105%; width: 90px;} #intro .deco3 {right: 105%; width: 95px;} #intro .deco4 {left: 105%; width: 100px;} } @media (max-width: 80rem) and (min-width: 48rem) { .KV:after { -webkit-clip-path: circle(calc(1.95 * 80rem) at 50% calc(100% - calc(1.965 * 80rem))); clip-path: circle(calc(1.95 * 80rem) at 50% calc(100% - calc(1.965 * 80rem))); } } @media (max-width: 48rem) { .KV:after { -webkit-clip-path: circle(calc(2.062 * 100vw) at 50% calc(100% - calc(2.13 * 100vw))); clip-path: circle(calc(2.062 * 100vw) at 50% calc(100% - calc(2.13 * 100vw))); } } @media (max-width: 640px) { #intro {padding: 0 5px 40px;} #intro .vImg {max-width: 95%;} #intro .txtImg {margin: 0.75rem auto 0.1rem;} #intro a {font-size: .65rem;} #intro .deco1 {right: 87%; width: 60px; top: -13%;} #intro .deco2 {left: 90%; width: 50px; top: -13%;} #intro .deco3 {right: 91%; width: 50px; top: 53%;} #intro .deco4 {left: 86%; width: 55px; top: 53%;} } .result_wrapper {background-color: #F2F4EF;padding-bottom: 60px;} #voucherPage.result_wrapper {background: url(../images/voucher_bg.jpg) repeat-y left -5px / 100% auto;} .result_wrapper .ttImg {display: block;margin: 0px auto 50px; width: 300px; height: 75px;} #voucherPage.result_wrapper .ttImg {background: url(../images/voucher-logo_tc.png) no-repeat center center; background-size: contain;} .en #voucherPage.result_wrapper .ttImg {background: url(../images/voucher-logo_en.png) no-repeat center center; background-size: contain;} .poiList {margin: auto; font-size: 0; text-align: center;} .offerItem {box-shadow: 0px 1px 2px #ddd; position: relative; text-align: left; background-color: #fff;} .offerItem .btn a {min-width: 90px;} .result_wrapper .btns {text-align: center; margin: 10px auto 0;} .result_wrapper .btns > a {display: inline-block; vertical-align: middle; width: 100%; font-size: 1.5rem; text-align: center; padding: 0 15px; font-weight: 600; border-radius: 10px; border: 2px solid #009342; line-height: 2.5;} .zh .result_wrapper .btns > a {letter-spacing: 2px; } .result_wrapper .btns > a:first-child {background-color: #009342; color: #fff; } .result_wrapper .btns > a:last-child {background-color: #fff; color: #009342; } .result_wrapper .btns > a span:after {content: ''; display: inline-block; vertical-align: middle; width: 35px; height: 23px; margin-left: 5px;} .result_wrapper .btns > a:first-child span:after {background: url(../images/bn_arrow.png) no-repeat center center; background-size: contain;} .result_wrapper .btns > a:last-child span:after {background: url(../images/bn_arrow_green.png) no-repeat center center; background-size: contain;} @media (min-width: 769px) { .result-container {margin-bottom: 40px;} .poiList {padding: 0;} .result_wrapper .btns > a {width: 300px; margin: 0 5px;} } @media (min-width: 641px) { #voucherPage.result_wrapper {padding-top: 40px; margin-top: -1px;} .offerItem {width: 330px; display: inline-block; vertical-align: top; margin: 0 5px 15px; padding: 0 0 90px; } } @media (max-width: 768px) { .result-container {padding: 0 15px 20px;} .result_wrapper {padding: 2% 0 2%;} .result_wrapper .ttImg {margin: 0 auto 25px; width: 220px; height: 55px;} .result_wrapper .btns {padding: 0 15px; margin-top: 0;} .result_wrapper .btns > a {font-size: 1.2rem; margin: 5px auto; line-height: 2.2; } .result_wrapper .btns > a span:after {height: 18px; width: 27px; margin-top: -1px;} } @media (max-width: 640px) { #voucherPage.result_wrapper {background: url(../images/voucher_bg-m.jpg) repeat-y left -20px / 100% auto; margin-top: -1px;} } .ctrImg.fullwidth{width: 100%;} #voucher .voucher {display: inline-block; vertical-align: top; text-align: left; overflow: hidden; width: 100%;height: 100%; position: relative; background-color: #fff; border:1px solid #eeeeee; border-radius: 10px; padding-bottom: 145px;} #voucher .voucher .vw .v {display: none} #voucher .voucher .vw .v.active {display: block} #voucher .voucher .vwImg {display: block; } #voucher .voucher .vwImg > .v {position: relative;} #voucher .voucher .img {padding-bottom: 50%;} #voucher .voucher .vwImg .tag {display: inline-block; vertical-align: middle; background: #009245; color: #fff; font-size: 22px; line-height: 1.5; font-weight: 600; padding: 0 12px; border-radius: 3px; margin-right: 5px; font-family: "Microsoft YaHei", "Microsoft JhengHei","Noto Sans TC", "Source Han Sans","PingFangHK","Heiti TC",Arial,Verdana,sans-serif; position: absolute; top: 10px; left: 10px;} #voucher .voucher .text {padding: 15px; position: initial;} #voucher .voucher .text .subt {color: #a0a0a0; font-size: 14px; margin-bottom: 6px; line-height: 1;} #voucher .voucher .text .poiName {color: #1a1a1a; font-size: 24px; margin-bottom: 7px; font-weight: 600; line-height: 1.5;} #voucher .voucher .text .tt {font-size: 1rem; color: #1a1a1a; font-weight: 600; line-height: 1.4; max-height: calc(1em * 1.4 * 3); letter-spacing: .5px; display: -webkit-box; -webkit-box-orient: vertical; position: relative; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp : 3; padding-left: 13px;} #voucher .voucher .text .tt:before {content: ''; display: block; position: absolute; left: 0; top: 0; width: 4px; height: 100%; background-color: #009245;} #voucher .voucher .text .desc {color: #a0a0a0; margin-top: 10px; font-size: 14px; line-height: 1.5;} #voucher .voucher .text .desc p, #voucher .voucher .text .desc ul li {color: #a0a0a0; line-height: 1.5; overflow: hidden; text-overflow: ellipsis; padding: 0 !important; -webkit-line-clamp : 3; height : calc(1em * 1.5 * 3);} #voucher .voucher .text .desc > * {display: none;} #voucher .voucher .text .desc > :first-child {display: block;} #voucher .voucher .text .badge-msg {position: relative; padding: 5px 0 5px 5px; border-top: 1px solid; border-bottom: 1px solid; margin: 15px auto 0; letter-spacing: 0; font-size: 0;} #voucher .voucher .text .badge-msg > span {display: inline-block; vertical-align: middle; width: calc(100% - 40px); font-size: .95rem; font-weight: 600; color: #E4292A; padding-left: 10px;} #voucher .voucher .text .badge-msg:before {content: ''; display: inline-block; vertical-align: middle; width: 40px; height: 40px;} #voucher .voucher .text .badge-msg.badge-chinese:before {background: url(../img/icon-1.png) no-repeat center; background-size: cover;} #voucher .voucher .text .badge-msg.badge-western:before {background: url(../img/icon-2.png) no-repeat center; background-size: cover;} #voucher .voucher .text .badge-msg.badge-asia:before {background: url(../img/icon-3.png) no-repeat center; background-size: cover;} #voucher .voucher .text .badge-msg small {font-size: .8em; display: block; line-height: 1.4;} #voucher .voucher .text .btm {position: absolute;bottom: 1rem;width: calc(100% - 30px); border-top: 1px dashed #ccc; padding-top: 10px;} #voucher .voucher .text .btm .hd {padding: 0 0 0.3em 0.2em;font-weight: 400;color: #8c8c8c; font-size: .85rem;} #voucher .voucher .text .vwPriceBtns {margin-bottom: .5rem;} #voucher .voucher .text .vwPriceBtns .priceBtn, #voucher .voucher .text .vwPriceBtns .morebtn {cursor: pointer; font-size: .95rem;text-align: center; border-radius: 4px; line-height: 1.7; padding: 0 0.8rem; border: 1px solid; color: #bdbdbd; font-weight: 600; display: inline-block; vertical-align: top; margin-right: .2rem; margin-bottom: .3rem;background-color: #f9f9f9;} #voucher .voucher .text .vwPriceBtns .priceBtn.active {color: #fff; background-color: #00A45A; border-color: #00A45A; cursor: default;} #voucher .voucher .text .vwPriceBtns .morebtn {} #voucher .voucher .text .btm .price {display: inline-block; vertical-align: middle; text-align: center;} #voucher .voucher .text .btm .price .discount {color: #009245; font-size: 28px; margin-bottom: 1px; line-height: 1; font-weight: 600; display: inline-block; } #voucher .voucher .text .btm .price .original {color: #ee4341; font-size: 14px; font-style: italic; text-decoration: line-through; line-height: 1; display: inline-block; margin-left: 0.3em;} #voucher .voucher .text .btm .sold {border-radius: 3px; border: 1px solid #009245; font-size: 12px; line-height: 2; color: #009245; padding: 0 5px; min-width: 60px; text-align: center; display: inline-block; vertical-align: middle; margin-left: 10px;} #voucher .voucher .text .vlinkBtn {display: inline-block;border-radius: 5px;letter-spacing: 1px;padding: 0 .8em;line-height: 2.3;font-size: 1.1rem;text-align: center;color: #fff;background-color: #00a25a;font-weight: 600;float: right; margin-top: .25rem;} @media (min-width: 769px) { #voucher .voucher {width: 32%; margin: 0 .667% 1.3%; max-width: 350px; } } @media (max-width: 768px) { #voucher .voucher { margin: 0 0 1rem; display: block;} #voucher .voucher .clink {padding: 15px 35px 5px; font-size: 12px; right: -35px; top: -5px;letter-spacing: 0px;} #voucher .voucher .vwImg {width: 100%;} #voucher .voucher .vwImg .tag {top: 1rem;left: 1rem;font-size: 1.4rem;} #voucher .voucher .text {padding: 15px 15px 15px 20px;} #voucher .voucher .text .tt {font-size: 16px; letter-spacing: 1px; } #voucher .voucher .text .subt {font-size: 13px; padding-right: 10px; display: -webkit-box;-webkit-box-orient: vertical;position: relative;overflow: hidden;text-overflow: ellipsis;-webkit-line-clamp: 1; max-height: calc(1em * 1.4 * 1); line-height: 1; margin-bottom: 10px;} #voucher .voucher .text .btm .price .discount {font-size: 28px;display: inline-block;} #voucher .voucher .text .btm .price .original {font-size: 16px;display: inline-block;margin-left: 0.3em;margin-top: -0.1em;} #voucher .voucher .text .btm .sold {min-width: 50px;} #voucher .voucher .text .vlinkBtn {margin-top: -.25rem;} } @media (max-width: 480px) { #voucher .voucher .text {width: 100%;min-height: auto;} #voucher .voucher .vwImg{width: 100%;min-height: auto;} #voucher .voucher .clink {transform: none; border-radius: 2px; padding: 0.4em 0.8em; font-size: 15px; top: 0.5em; right: 0.5em;background-color:#ffffff;color:#009245;border:1px solid #dddddd; } #voucher .voucher .clink span {display: inline-block!important;} } #campaigns {background: #f0e7c8; background: linear-gradient(180deg, #f0e7c8 0%, #f3ecda 35%, #e4d1ae 100%); margin: 0!important; max-width: none;} #campaigns h1 {text-align: center;color: #5E4821;letter-spacing: -1px; margin: 30px 0;} #campaigns .swiper-wrapper {height: auto!important;} #campaigns .swiper-pagination-bullets {bottom: 45px!important;} @media (max-width: 768px) { #campaigns {padding: 30px 0 50px} #campaigns h1 {font-size: 1.5rem;margin: 0 0 30px 0;} } @media (max-width: 640px) { #campaigns .newOffer .img {min-height: 0!important;} } #whatsappBox{max-width:180px;position:fixed;z-index:100;bottom:2rem;right:-200px;opacity:0;transition:all .3s ease-in-out;margin:auto} #whatsappBox.show{right:1rem;opacity:1} #whatsappBox img {-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 screen and (max-width: 40em) { #whatsappBox img{width: 9rem;} }