@font-face {
    font-family:'Lato';src:url("/hk/diamond/themes/unionpay/css/fonts/Lato-Thin.eot");src:url("/hk/diamond/themes/unionpay/css/fonts/Lato-Thind41d.eot") format("embedded-opentype"),url("/hk/diamond/themes/unionpay/css/fonts/Lato-Thin.woff") format("woff"),url("/hk/diamond/themes/unionpay/css/fonts/Lato-Thin.ttf") format("truetype"),url("/hk/diamond/themes/unionpay/css/fonts/Lato-Thin.svg") format("svg");font-weight:100;font-style:normal
}

@font-face {
    font-family:'Lato';src:url("/hk/diamond/themes/unionpay/css/fonts/Lato-Light.eot");src:url("/hk/diamond/themes/unionpay/css/fonts/Lato-Lightd41d.eot") format("embedded-opentype"),url("/hk/diamond/themes/unionpay/css/fonts/Lato-Light.woff") format("woff"),url("/hk/diamond/themes/unionpay/css/fonts/Lato-Light.ttf") format("truetype"),url("/hk/diamond/themes/unionpay/css/fonts/Lato-Light.svg") format("svg");font-weight:300;font-style:normal
}

@font-face {
    font-family:'Lato';src:url("/hk/diamond/themes/unionpay/css/fonts/Lato-Regular.eot");src:url("/hk/diamond/themes/unionpay/css/fonts/Lato-Regulard41d.eot") format("embedded-opentype"),url("/hk/diamond/themes/unionpay/css/fonts/Lato-Regular.woff") format("woff"),url("/hk/diamond/themes/unionpay/css/fonts/Lato-Regular.ttf") format("truetype"),url("/hk/diamond/themes/unionpay/css/fonts/Lato-Regular.svg") format("svg");font-weight:400;font-style:normal
}

@font-face {
    font-family:'Lato';src:url("/hk/diamond/themes/unionpay/css/fonts/Lato-Bold.eot");src:url("/hk/diamond/themes/unionpay/css/fonts/Lato-Boldd41d.eot") format("embedded-opentype"),url("/hk/diamond/themes/unionpay/css/fonts/Lato-Bold.woff") format("woff"),url("/hk/diamond/themes/unionpay/css/fonts/Lato-Bold.ttf") format("truetype"),url("/hk/diamond/themes/unionpay/css/fonts/Lato-Bold.svg") format("svg");font-weight:bold;font-style:normal
}

@font-face {
    font-family:'icomoon';src:url("/hk/diamond/themes/unionpay/css/fonts/icomoon6a2b.eot");src:url("/hk/diamond/themes/unionpay/css/fonts/icomoon6a2b.eot") format("embedded-opentype"),url("/hk/diamond/themes/unionpay/css/fonts/icomoon6a2b.ttf") format("truetype"),url("/hk/diamond/themes/unionpay/css/fonts/icomoon6a2b.woff") format("woff"),url("/hk/diamond/themes/unionpay/css/fonts/icomoon6a2b.svg") format("svg");font-weight:normal;font-style:normal
}[class^="icon-"],[class*=" icon-"] {
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}[data-icon]:before {
     font-family: "icomoon" !important;
     content: attr(data-icon);
     font-style: normal !important;
     font-weight: normal !important;
     font-variant: normal !important;
     text-transform: none !important;
     speak: none;
     line-height: 1;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale
 }[class^="icon-"]:before,[class*=" icon-"]:before {
      font-family: "icomoon" !important;
      font-style: normal !important;
      font-weight: normal !important;
      font-variant: normal !important;
      text-transform: none !important;
      speak: none;
      line-height: 1;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale
  }

.icon-art:before {
    content: "\61"
}

.icon-dining:before {
    content: "\62"
}

.icon-entertainment:before {
    content: "\63"
}

.icon-facebook:before {
    content: "\64"
}

.icon-home:before {
    content: "\65"
}

.icon-living:before {
    content: "\66"
}

.icon-shopping:before {
    content: "\68"
}

.icon-travel:before {
    content: "\69"
}

.icon-wellness:before {
    content: "\6a"
}

.icon-rewards:before {
    content: "\67"
}

.icon-bank-list:before {
    content: "\6b"
}

.section {
    background-color: #0C0C08
}

#section-home .content {
    overflow: hidden
}

#section-home .content .prevBtn,#section-home .content .nextBtn {
    z-index: 1002;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    position: absolute;
    top: 400px;
    width: 135px;
    height: 85px;
    cursor: pointer;
}

#section-home .content .prevBtn .text,#section-home .content .nextBtn .text {
    font-size: 12px;
    color: #ffffff;
    position: absolute;
    top: 0px;
    left: 0px
}

#section-home .content .prevBtn img,#section-home .content .nextBtn img {
    position: absolute;
    top: 22px;
    left: 0px;
    width: 60px;
    height: 60px
}

#section-home .content .prevBtn .icon-left,#section-home .content .prevBtn .icon-right,#section-home .content .nextBtn .icon-left,#section-home .content .nextBtn .icon-right {
    position: absolute;
    width: 20px;
    height: 45px
}

#section-home .content .prevBtn .icon-left,#section-home .content .nextBtn .icon-left {
    top: 18px;
    left: 17px;
}

#section-home .content .prevBtn .icon-right,#section-home .content .nextBtn .icon-right {
    top: 18px;
    right: 17px;
}

#section-home .content .prevBtn {
    /* top: 400px; */
    left: 0px;
}

#section-home .content .prevBtn:hover {
    top: 390px
}

#section-home .content .prevBtn::before {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 60px;
    height: 1px;
}

#section-home .content .prevBtn .text {
    top: 76px;
    left: 70px
}

#section-home .content .nextBtn {
    left: auto;
    right: 0px
}

#section-home .content .nextBtn:hover {
    top: 400px;
}

#section-home .content .nextBtn img {
    position: absolute;
    top: 22px;
    left: auto;
    right: 0px;
    width: 60px;
    height: 60px;
}

#section-home .content .nextBtn::before {
    position: absolute;
    top: 4px;
    right: 0px;
    width: 60px;
    height: 1px;
}

#section-home .content .nextBtn .text {
    top: -4px;
    left: 36px
}

#section-home .content .m_prevBtn,#section-home .content .m_nextBtn {
    cursor: pointer;
    display: none
}

#section-home .content #mainSlider {
    width: 100%;
    height: 100%
}

#section-home .content #mainSlider .slick-next,#section-home .content #mainSlider .slick-prev {
    display: none !important
}

#section-home .content #mainSlider .slick-list {
    height: 100%;
    position: relative
}

#section-home .content #mainSlider .slick-list .slick-track {
    height: 100%;
    position: relative
}

#section-home .content #mainSlider .slick-list .item {
    width: 100%;
    height: 100%
}

#section-home .content #mainSlider .slick-list .item .banner {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-position: center center;
    background-size: cover
}

#section-home .content #mainSlider .slick-list .item .banner img {
    width: 1920px;
    max-width: 1920px;
    height: 1080px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -960px;
    margin-top: -540px
}

#section-home .content #mainSlider .slick-dots {
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
    bottom: 13%
}

#section-home .content #mainSlider .slick-dots li {
    margin: 0 5px
}

#section-home .content #mainSlider .slick-dots li button:before {
    color: #ffffff;
    font-size: 12px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    z-index: 2
}

#section-home .content #mainSlider .slick-dots li button:after {
    content: " ";
    opacity: 0;
    position: relative;
    float: left;
    top: -4px;
    left: -3px;
    width: 16px;
    height: 16px;
    border: 3px solid;
    background: #ffffff;
    border-radius: 16px;
    border-color: #ffffff;
    z-index: 1
}

#section-home .content #mainSlider .slick-dots li.slick-active button:before,#section-home .content #mainSlider .slick-dots li.slick-active button:after {
    color: #A57743;
    opacity: 1
}

#section-home .content .black {
    width: 100%;
    position: absolute;
    height: 170px;
    bottom: 0px;
    left: 0px;
    background-image: url("/hk/diamond/themes/unionpay/images/overlay_bottom.png")
}

@media (max-width: 991px) {
    #section-home .content .black {
        display: none
    }
}

#section-home .content .slogan {
    width: 100%;
    position: absolute;
    top: 0px;
    top: 50%;
    right: 50%;
    -webkit-transform: translate(50%, -50%);
    transform: translate(50%, -50%);
    z-index: 2;
    letter-spacing: -0.05em;
    font-size: 4em
}

#section-home .content .slogan .title {
    width: 100%;
    color: #A57743;
    position: relative;
    text-align: center;
    font-weight: 100;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out
}

#section-home .content .slogan .title em {
    font-style: normal;
    font-weight: bold
}

#section-home .content .slogan.color-white .title,#section-home .content .slogan.color-white .desc {
    color: #ffffff
}

#section-home .content .slogan.color-black .title,#section-home .content .slogan.color-black .desc {
    color: #000000
}

#section-home .content .slogan.color-gold .title,#section-home .content .slogan.color-gold .desc {
    color: #A57743
}

#section-home .content .slogan.color-entertainment .title,#section-home .content .slogan.color-entertainment .desc {
    color: #0d928d
}

#section-home .content .slogan.color-travel .title,#section-home .content .slogan.color-travel .desc {
    color: #2c5c9e
}

#section-home .content .slogan.color-wellness .title,#section-home .content .slogan.color-wellness .desc {
    color: #5597D1
}

#section-home .content .slogan.color-living .title,#section-home .content .slogan.color-living .desc {
    color: #5dc3ad
}

#section-home .content .slogan.color-shopping .title,#section-home .content .slogan.color-shopping .desc {
    color: #ed1a3b
}

#section-home .content .slogan.color-shopping .title,#section-home .content .slogan.color-shopping .desc {
    color: #ed1a3b
}

#section-home .content .slogan.color-dining .title,#section-home .content .slogan.color-dining .desc {
    color: #f58472
}

#section-home .content .slogan.color-rewards .title,#section-home .content .slogan.color-rewards .desc {
    color: #A57743
}

#section-home .content .slogan.color-home .title,#section-home .content .slogan.color-home .desc {
    color: #9C7141
}

#section-home .content .slogan .desc {
    width: 100%;
    font-size: 0.8em;
    color: #A57743;
    position: relative;
    text-align: center;
    font-weight: 100;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out
}

#section-home .content .floatingBox {
    display: none !important;
    bottom: 3%;
    left: 4%;
    color: #ab6e30;
    font-weight: 100;
    position: absolute;
    display: inline-block
}

#section-home .content .floatingBox img {
    float: left
}

#section-home .content .floatingBox .text {
    float: left;
    height: 86px;
    padding: 10px 20px;
    background-color: #ffffff
}

#section-home .content .floatingBox .text .title {
    margin-bottom: 6px
}

#section-home .content .floatingBox .text .title span {
    display: block
}

#section-home .content .floatingBox .text .square-button {
    font-size: 12px;
    color: #ab6e30;
    border: solid #ab6e30 1px;
    height: 20px;
    line-height: 18px;
    width: 82px
}

#section-home .content .floatingBox .text .square-button.button--wayra::before {
    background: #a57743
}

#section-home .content .floatingBox .close {
    width: 37px;
    height: 86px;
    float: right;
    background-image: url("/hk/diamond/themes/unionpay/images/banner/thumb_floatimg_bg.png")
}

#section-home .content .floatingBox .close .close-btn {
    cursor: pointer;
    position: absolute;
    right: 14px;
    top: 12px;
    width: 16px;
    height: 16px;
    opacity: 0.5
}

#section-home .content .floatingBox .close .close-btn:hover {
    opacity: 1
}

#section-home .content .floatingBox .close .close-btn::before,#section-home .content .floatingBox .close .close-btn::after {
    position: absolute;
    left: 5px;
    content: ' ';
    height: 18px;
    width: 1px;
    background-color: #565656
}

#section-home .content .floatingBox .close .close-btn::before {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

#section-home .content .floatingBox .close .close-btn::after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

#section-home .content .phoneBox {
    position: absolute;
    color: #ffffff;
    right: 6%;
    bottom: 3%;
    text-shadow: 0px 0px 6px #212121
}

#section-home .content .phoneBox .title {
    text-align: right
}

#section-home .content .phoneBox .title img {
    display: inline-block;
    margin-right: 10px
}

#section-home .content .phoneBox span {
    color: #ffffff;
    font-size: 36px;
    font-weight: 100;
    float: right
}

#section-home .content #arrowDown {
    z-index: 1002;
    -webkit-animation: MoveUpDown 2s linear infinite;
    animation: MoveUpDown 2s linear infinite;
    width: 208px;
    height: 41px;
    position: absolute;
    bottom: 6%;
    left: 50%;
    margin-left: -104px;
    background-image: url("/hk/diamond/themes/unionpay/images/prestige_arrow_down.png")
}

#section-home .content #arrowDown span {
    color: #ffffff;
    width: auto;
    font-size: 10px;
    width: 250px;
    text-align: center;
    position: absolute;
    top: -25px;
    left: -104px;
    display: none
}

.zh #section-home .content #arrowDown {
    background-image: url("/hk/diamond/themes/unionpay/images/prestige_arrow_down_zh.png")
}

#section-rewards .content {
    position: relative;
    width: 80%;
    margin-left: 10%;
    margin-right: 10%;
    max-width: 1200px;
    margin: 0 auto;
    height: 100%
}

#section-rewards .content .square-button {
    width: 26%;
    position: absolute;
    top: 15%;
    right: 0px;
    left: auto;
    padding: 32px 0px;
    text-align: center;
    border-color: #956330;
    border: 1px solid #956330
}

#section-rewards .content .square-button:hover span {
    color: #ffffff
}

#section-rewards .content .square-button span {
    font-size: 16px;
    font-weight: 400;
    color: #956330;
    line-height: 64px;
    width: 100%
}

#section-rewards .content .square-button::before {
    background: #956330
}

#section-rewards .content .top_content .title {
    width: 100%;
    height: auto;
    margin-top: 7%;
    padding-top: 70px;
    font-size: 60px;
    color: #A57743;
    display: inline-block;
    line-height: 21px;
    margin-bottom: 10px;
    font-weight: 100;
    letter-spacing: -6px
}

#section-rewards .content .top_content .title em {
    font-style: normal;
    font-size: 16px;
    display: inline-block;
    color: #878787;
    width: 100%;
    font-weight: 400
}

#section-rewards .content .top_content .list-content {
    width: 100%;
    height: auto;
    color: #A57743;
    font-size: 16px;
    font-weight: 400
}

#section-rewards .content .top_content .list-content span {
    width: 70%;
    display: inline-block;
    margin-top: 20px;
    line-height: 20px
}

#section-rewards .content .banner_content {
    width: 100%;
    margin-top: 5%
}

#section-rewards .content .banner_content .left {
    width: 45%;
    max-width: 570px;
    height: 100%;
    float: left
}

#section-rewards .content .banner_content .left,#section-rewards .content .banner_content .right {
    position: relative
}

#section-rewards .content .banner_content .left .title,#section-rewards .content .banner_content .right .title {
    position: absolute;
    bottom: 26%;
    left: 0px;
    width: 80%;
    margin-left: 10%;
    margin-right: 10%;
    text-align: center;
    color: #ffffff;
    font-size: 30px;
    letter-spacing: -2px;
    font-weight: 100;
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease
}

#section-rewards .content .banner_content .left .title::after,#section-rewards .content .banner_content .right .title::after {
    padding-bottom: 2%;
    width: 30px;
    height: 1px;
    border-bottom: 1px solid #ffffff;
    display: block;
    margin: 0 auto;
    content: " "
}

#section-rewards .content .banner_content .left .rewards_slider,#section-rewards .content .banner_content .right .rewards_slider {
    width: 100%
}

#section-rewards .content .banner_content .left .rewards_slider .slick-prev,#section-rewards .content .banner_content .left .rewards_slider .slick-next,#section-rewards .content .banner_content .right .rewards_slider .slick-prev,#section-rewards .content .banner_content .right .rewards_slider .slick-next {
    display: none !important
}

#section-rewards .content .banner_content .left .rewards_slider .slick-dots,#section-rewards .content .banner_content .right .rewards_slider .slick-dots {
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
    bottom: -40px
}

#section-rewards .content .banner_content .left .rewards_slider .slick-dots li,#section-rewards .content .banner_content .right .rewards_slider .slick-dots li {
    margin: 0 5px
}

#section-rewards .content .banner_content .left .rewards_slider .slick-dots li button:before,#section-rewards .content .banner_content .right .rewards_slider .slick-dots li button:before {
    color: #ffffff;
    font-size: 12px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    z-index: 2
}

#section-rewards .content .banner_content .left .rewards_slider .slick-dots li button:after,#section-rewards .content .banner_content .right .rewards_slider .slick-dots li button:after {
    content: " ";
    opacity: 0;
    position: relative;
    float: left;
    top: -4px;
    left: -3px;
    width: 16px;
    height: 16px;
    border: 3px solid;
    background: #ffffff;
    border-radius: 16px;
    border-color: #ffffff;
    z-index: 1
}

#section-rewards .content .banner_content .left .rewards_slider .slick-dots li.slick-active button:before,#section-rewards .content .banner_content .left .rewards_slider .slick-dots li.slick-active button:after,#section-rewards .content .banner_content .right .rewards_slider .slick-dots li.slick-active button:before,#section-rewards .content .banner_content .right .rewards_slider .slick-dots li.slick-active button:after {
    color: #A57743;
    opacity: 1
}

#section-rewards .content .banner_content .left .rewards_slider .slick-track,#section-rewards .content .banner_content .right .rewards_slider .slick-track {
    width: 100%
}

#section-rewards .content .banner_content .left .rewards_slider .slick-track .item,#section-rewards .content .banner_content .right .rewards_slider .slick-track .item {
    position: relative
}

#section-rewards .content .banner_content .left .rewards_slider .slick-track .item .image,#section-rewards .content .banner_content .right .rewards_slider .slick-track .item .image {
    background-size: cover;
    background-position: center center;
    width: 100%;
    padding-bottom: 74%
}

#section-rewards .content .banner_content .left .rewards_slider .slick-track .item .image::after,#section-rewards .content .banner_content .right .rewards_slider .slick-track .item .image::after {
    content: " ";
    background: rgba(0,0,0,0.5);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)), to(rgba(0,0,0,0.5)));
    background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.5));
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0px;
    left: 0px
}

#section-rewards .content .banner_content .left .rewards_slider .slick-track .item .descBox,#section-rewards .content .banner_content .right .rewards_slider .slick-track .item .descBox {
    position: absolute;
    width: 80%;
    bottom: 9%;
    margin-left: 10%;
    margin-right: 10%;
    left: 0px;
    text-align: center;
    z-index: 3;
    color: #ffffff;
    z-index: 3
}

#section-rewards .content .banner_content .right {
    width: 45%;
    max-width: 570px;
    height: 100%;
    float: right
}

a {
    color: #333333
}

.sub-section .content {
    width: 100%;
    max-width: 1920px;
    position: relative;
    margin: 0 auto
}

.sub-section .content .sub-header {
    margin: 0px;
    width: 100%
}

.sub-section .content .slider_container {
    width: 1200px;
    height: 100%;
    margin: 0 auto;
    position: absolute;
    top: 0px;
    left: 50%;
    margin-left: -600px
}

.sub-section .content .subSlider {
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    position: absolute;
    top: 0%;
    left: 0%;
    margin: 0 auto;
    display: block;
    width: 75%;
    max-width: 880px;
    margin-top: 30%
}

.sub-section .content .subSlider .slick-prev,.sub-section .content .subSlider .slick-next {
    bottom: -60px;
    top: auto;
    left: auto
}

.sub-section .content .subSlider .slick-prev:before,.sub-section .content .subSlider .slick-next:before {
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease
}

.sub-section .content .subSlider .slick-prev {
    height: 60px;
    width: 30px;
    right: 65px
}

.sub-section .content .subSlider .slick-prev::before {
    position: absolute;
    top: 13px;
    left: 0px;
    z-index: 5;
    content: url("/hk/diamond/themes/unionpay/images/prestige_allslider_arrow_prev.png")
}

.sub-section .content .subSlider .slick-prev::after {
    content: " ";
    width: 27px;
    height: 27px;
    position: absolute;
    top: 14px;
    left: 1px;
    border-radius: 27px;
    z-index: 2;
    background-color: rgba(255,255,255,0.3)
}

.sub-section .content .subSlider .slick-next {
    height: 60px;
    width: 30px;
    right: 18px
}

.sub-section .content .subSlider .slick-next::before {
    position: absolute;
    top: 13px;
    left: 0px;
    z-index: 5;
    content: url("/hk/diamond/themes/unionpay/images/prestige_allslider_arrow_next.png")
}

.sub-section .content .subSlider .slick-next::after {
    content: " ";
    width: 27px;
    height: 27px;
    position: absolute;
    top: 14px;
    left: 1px;
    border-radius: 27px;
    z-index: 2;
    background-color: rgba(255,255,255,0.3)
}

.sub-section .content .subSlider .slick-list {
    padding: 0;
    position: relative;
    padding-top: 20px;
    outline: none !important
}

.sub-section .content .subSlider .slick-list .slick-track .emptySlider {
    height: 300px
}

.sub-section .content .subSlider .slick-list .slick-track .subItem {
    outline: none !important;
    width: 300px;
    margin-left: 20px;
    margin-right: 20px
}

.sub-section .content .subSlider .slick-list .slick-track .subItem:hover .slider-item {
    margin-top: -5px;
    -webkit-box-shadow: 5px 5px 20px rgba(0,0,0,0.2);
    box-shadow: 5px 5px 20px rgba(0,0,0,0.2)
}

.sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item {
    outline: none !important;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
    margin-top: 0px;
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: 280px;
    background-color: #ffffff
}

.sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .imageBox {
    display: inline-block;
    margin-top: 3%;
    width: 94%;
    margin-left: 3%;
    height: 225px;
    background-size: cover;
    background-position: center center
}

.sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .text {
    font-size: 16px;
    padding: 20px;
    min-height: 200px
}

.sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .text .text-title {
    font-weight: bold;
    padding-bottom: 10px
}

.sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .text .description {
    font-size: 0.9em;
    margin-bottom: 10px;
    min-height: 82px;
    max-height: 52px;
    overflow: hidden
}

.sub-section .content .subSlider .slick-list .slick-track .slick-slide {
    outline: none
}

.sub-section .content .subSlider .slick-dots {
    width: 50%;
    text-align: left;
    padding-left: 12px;
    bottom: -25px
}

.sub-section .content .subSlider .slick-dots li {
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    opacity: 0.5
}

.sub-section .content .subSlider .slick-dots li:hover {
    opacity: 1
}

.sub-section .content .subSlider .slick-dots li button:before {
    z-index: 2
}

.sub-section .content .subSlider .slick-dots li button:after {
    content: " ";
    opacity: 0;
    position: absolute;
    top: 1px;
    left: 2px;
    width: 16px;
    height: 16px;
    border: 3px solid;
    background: #ffffff;
    border-radius: 15px;
    border-color: #ffffff;
    z-index: 1
}

.sub-section .content .subSlider .slick-dots .slick-active {
    opacity: 1
}

.sub-section .content .subSlider .slick-dots li.slick-active button:after {
    opacity: 1
}

.sub-section .content .layer_container {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative
}

.sub-section .content .layer_container .m_title_layer,.sub-section .content .layer_container .m_title_second_layer {
    display: none
}

.sub-section .content .layer_container .bg_layer,.sub-section .content .layer_container .over_layer {
    width: 2120px;
    height: 1080px;
    margin-left: 0px;
    background-position: center center;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -1060px;
    margin-top: -540px
}

.sub-section .content .layer_container .title_layer {
    width: 1200px;
    height: 100%;
    background-size: cover;
    background-position: center center;
    position: absolute;
    top: 0px;
    left: 50%;
    margin-left: -600px
}

.sub-section .content .layer_container .title_layer span {
    color: #ffffff;
    display: inline-block;
    margin-top: 18%;
    width: 100%;
    font-size: 120px;
    font-weight: 100;
    text-align: right;
    letter-spacing: -12px;
    line-height: 100px
}

.sub-section .content .layer_container .tag_layer {
    width: 1200px;
    height: 100%;
    background-size: cover;
    background-position: center center;
    position: absolute;
    top: 0px;
    left: 50%;
    margin-left: -600px
}

.sub-section .content .layer_container .tag_layer span {
    color: #ffffff;
    display: inline-block;
    margin-top: 15%;
    width: 260px;
    float: right;
    font-size: 20px;
    font-weight: 900;
    text-align: left;
    letter-spacing: 0px;
    line-height: 30px;
    font-family: "微軟正黑體", "Microsoft JhengHei", "新細明體", "PMingLiU", Verdana, Arial, Helvetica,sans-serif
}

.sub-section .content .layer_container .sub_title_layer {
    width: 1200px;
    height: 100%;
    background-size: cover;
    background-position: center center;
    position: absolute;
    top: 0px;
    left: 50%;
    margin-left: -600px
}

.sub-section .content .layer_container .sub_title_layer span {
    color: #ffffff;
    display: inline-block;
    width: auto;
    font-size: 120px;
    font-weight: 100;
    text-align: left;
    float: right;
    font-style: normal;
    margin-top: 27%;
    letter-spacing: -12px;
    line-height: 95px
}

.sub-section .content .layer_container .desc_layer {
    width: 1200px;
    height: 100%;
    background-size: cover;
    background-position: center center;
    position: absolute;
    top: 0px;
    left: 50%;
    margin-left: -600px
}

.sub-section .content .layer_container .desc_layer p {
    width: 260px;
    color: #ffffff;
    line-height: 24px;
    float: right;
    font-size: 16px;
    margin-top: 46%;
    text-shadow: 2px 2px 10px #585858
}

.sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item {
    background-color: rgba(255,255,255,0.9)
}

.sub-section .content.right .subSlider {
    top: 0%;
    right: 0%;
    left: auto
}

.sub-section .content.right .layer_container .tag_layer {
    float: left
}

.sub-section .content.right .layer_container .tag_layer span {
    float: left
}

.sub-section .content.right .layer_container .title_layer span {
    color: #ffffff;
    display: inline-block;
    width: 100%;
    font-size: 120px;
    font-weight: 100;
    text-align: left
}

.sub-section .content.right .layer_container .sub_title_layer span {
    color: #ffffff;
    display: inline-block;
    width: auto;
    font-size: 120px;
    font-weight: 100;
    text-align: left;
    float: left;
    font-style: normal;
    letter-spacing: -12px;
    line-height: 95px
}

.sub-section .content.right .layer_container .desc_layer p {
    width: 260px;
    color: #ffffff;
    line-height: 24px;
    float: left;
    font-size: 16px
}

.sub-section .m_layer {
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    background-position: center center;
    background-size: cover
}

.sub-section.color-travel .slider-item::after {
    z-index: 1002;
    content: " ";
    position: absolute;
    display: block;
    bottom: 0px;
    right: 0px;
    border-style: solid;
    border-width: 0 0 100px 15px;
    border-color: transparent transparent #185ca3 transparent
}

.sub-section.color-travel .slider-item .square-button {
    color: #185ca3;
    border: solid #185ca3 1px;
    border: none;
    border-radius: 0;
    text-decoration: none;
    margin-left: 0;
    margin-right: 0;
    width: 80px;
    height: 30px;
    padding: 0;
    outline: none;
    cursor: pointer;
    position: absolute;
    bottom: 20px;
    left: 20px
}

.sub-section.color-travel .slider-item .square-button::after {
    content: " ";
    border: solid #185ca3 1px;
    width: 79px !important;
    height: 30px !important;
    display: block;
    position: absolute;
    top: 0px;
    left: 1px;
    z-index: 0;
    pointer-events: none !important
}

.sub-section.color-travel .slider-item .square-button a {
    color: #185ca3;
    z-index: 1
}

.sub-section.color-travel .slider-item .button--wayra::before {
    background: #185ca3
}

.sub-section.color-travel .subSlider .slick-prev::after,.sub-section.color-travel .subSlider .slick-next::after {
    background-color: #185ca3;
    opacity: 0.6
}

.sub-section.color-travel .slick-dots li:hover button::before {
    content: "•";
    color: #185ca3;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-travel .slick-dots li button::before {
    content: "•";
    color: #fff;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-travel .slick-dots li.slick-active button::before {
    content: "•";
    color: #185ca3;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-travel .content .layer_container .title_layer span,.sub-section.color-travel .content .layer_container .sub_title_layer span,.sub-section.color-travel .content .layer_container .m_title_layer span,.sub-section.color-travel .content .layer_container .tag_layer span,.sub-section.color-travel .content.right .layer_container .title_layer span,.sub-section.color-travel .content.right .layer_container .sub_title_layer span,.sub-section.color-travel .content.right .layer_container .m_title_layer span,.sub-section.color-travel .content.right .layer_container .tag_layer span {
    color: #185ca3
}

.sub-section.color-travel .content .layer_container .desc_layer p,.sub-section.color-travel .content.right .layer_container .desc_layer p {
    color: #185ca3;
    text-shadow: none
}

.sub-section.color-travel .content .subSlider .slick-list .slick-track .subItem .slider-item .text .text-title {
    color: #185ca3
}

.sub-section.color-dining .content .sub-header {
    margin-top: 2%
}

.sub-section.color-dining .slider-item::after {
    z-index: 1002;
    content: " ";
    position: absolute;
    display: block;
    bottom: 0px;
    right: 0px;
    border-style: solid;
    border-width: 0 0 100px 15px;
    border-color: transparent transparent #F58472 transparent
}

.sub-section.color-dining .slider-item .square-button {
    color: #F58472;
    border: solid #F58472 1px;
    border: none;
    border-radius: 0;
    text-decoration: none;
    margin-left: 0;
    margin-right: 0;
    width: 80px;
    height: 30px;
    padding: 0;
    outline: none;
    cursor: pointer;
    position: absolute;
    bottom: 20px;
    left: 20px
}

.sub-section.color-dining .slider-item .square-button::after {
    content: " ";
    border: solid #F58472 1px;
    width: 79px !important;
    height: 30px !important;
    display: block;
    position: absolute;
    top: 0px;
    left: 1px;
    z-index: 0;
    pointer-events: none !important
}

.sub-section.color-dining .slider-item .square-button a {
    color: #F58472;
    z-index: 1
}

.sub-section.color-dining .slider-item .button--wayra::before {
    background: #F58472
}

.sub-section.color-dining .subSlider .slick-prev::after,.sub-section.color-dining .subSlider .slick-next::after {
    background-color: #F58472;
    opacity: 0.6
}

.sub-section.color-dining .slick-dots li:hover button::before {
    content: "•";
    color: #F58472;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-dining .slick-dots li button::before {
    content: "•";
    color: #fff;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-dining .slick-dots li.slick-active button::before {
    content: "•";
    color: #F58472;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-dining .content .layer_container .title_layer span,.sub-section.color-dining .content .layer_container .sub_title_layer span,.sub-section.color-dining .content .layer_container .m_title_layer span,.sub-section.color-dining .content .layer_container .tag_layer span,.sub-section.color-dining .content.right .layer_container .title_layer span,.sub-section.color-dining .content.right .layer_container .sub_title_layer span,.sub-section.color-dining .content.right .layer_container .m_title_layer span,.sub-section.color-dining .content.right .layer_container .tag_layer span {
    color: #F58472
}

.sub-section.color-dining .content .layer_container .desc_layer p,.sub-section.color-dining .content.right .layer_container .desc_layer p {
    color: #F58472;
    text-shadow: none
}

.sub-section.color-dining .content .subSlider .slick-list .slick-track .subItem .slider-item .text .text-title {
    color: #F58472
}

.sub-section.color-entertainment .slider-item::after {
    z-index: 1002;
    content: " ";
    position: absolute;
    display: block;
    bottom: 0px;
    right: 0px;
    border-style: solid;
    border-width: 0 0 100px 15px;
    border-color: transparent transparent #00958E transparent
}

.sub-section.color-entertainment .slider-item .square-button {
    color: #00958E;
    border: solid #00958E 1px;
    border: none;
    border-radius: 0;
    text-decoration: none;
    margin-left: 0;
    margin-right: 0;
    width: 80px;
    height: 30px;
    padding: 0;
    outline: none;
    cursor: pointer;
    position: absolute;
    bottom: 20px;
    left: 20px
}

.sub-section.color-entertainment .slider-item .square-button::after {
    content: " ";
    border: solid #00958E 1px;
    width: 79px !important;
    height: 30px !important;
    display: block;
    position: absolute;
    top: 0px;
    left: 1px;
    z-index: 0;
    pointer-events: none !important
}

.sub-section.color-entertainment .slider-item .square-button a {
    color: #00958E;
    z-index: 1
}

.sub-section.color-entertainment .slider-item .button--wayra::before {
    background: #00958E
}

.sub-section.color-entertainment .subSlider .slick-prev::after,.sub-section.color-entertainment .subSlider .slick-next::after {
    background-color: #00958E;
    opacity: 0.6
}

.sub-section.color-entertainment .slick-dots li:hover button::before {
    content: "•";
    color: #00958E;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-entertainment .slick-dots li button::before {
    content: "•";
    color: #fff;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-entertainment .slick-dots li.slick-active button::before {
    content: "•";
    color: #00958E;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-entertainment .content .subSlider .slick-list .slick-track .subItem .slider-item .text .text-title {
    color: #00958E
}

.sub-section.color-shopping .slider-item::after {
    z-index: 1002;
    content: " ";
    position: absolute;
    display: block;
    bottom: 0px;
    right: 0px;
    border-style: solid;
    border-width: 0 0 100px 15px;
    border-color: transparent transparent #FF0031 transparent
}

.sub-section.color-shopping .slider-item .square-button {
    color: #FF0031;
    border: solid #FF0031 1px;
    border: none;
    border-radius: 0;
    text-decoration: none;
    margin-left: 0;
    margin-right: 0;
    width: 80px;
    height: 30px;
    padding: 0;
    outline: none;
    cursor: pointer;
    position: absolute;
    bottom: 20px;
    left: 20px
}

.sub-section.color-shopping .slider-item .square-button::after {
    content: " ";
    border: solid #FF0031 1px;
    width: 79px !important;
    height: 30px !important;
    display: block;
    position: absolute;
    top: 0px;
    left: 1px;
    z-index: 0;
    pointer-events: none !important
}

.sub-section.color-shopping .slider-item .square-button a {
    color: #FF0031;
    z-index: 1
}

.sub-section.color-shopping .slider-item .button--wayra::before {
    background: #FF0031
}

.sub-section.color-shopping .subSlider .slick-prev::after,.sub-section.color-shopping .subSlider .slick-next::after {
    background-color: #FF0031;
    opacity: 0.6
}

.sub-section.color-shopping .slick-dots li:hover button::before {
    content: "•";
    color: #FF0031;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-shopping .slick-dots li button::before {
    content: "•";
    color: #fff;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-shopping .slick-dots li.slick-active button::before {
    content: "•";
    color: #FF0031;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-shopping .content .subSlider .slick-list .slick-track .subItem .slider-item .text .text-title {
    color: #FF0031
}

.sub-section.color-living .slider-item::after {
    z-index: 1002;
    content: " ";
    position: absolute;
    display: block;
    bottom: 0px;
    right: 0px;
    border-style: solid;
    border-width: 0 0 100px 15px;
    border-color: transparent transparent #1DC6AC transparent
}

.sub-section.color-living .slider-item .square-button {
    color: #1DC6AC;
    border: solid #1DC6AC 1px;
    border: none;
    border-radius: 0;
    text-decoration: none;
    margin-left: 0;
    margin-right: 0;
    width: 80px;
    height: 30px;
    padding: 0;
    outline: none;
    cursor: pointer;
    position: absolute;
    bottom: 20px;
    left: 20px
}

.sub-section.color-living .slider-item .square-button::after {
    content: " ";
    border: solid #1DC6AC 1px;
    width: 79px !important;
    height: 30px !important;
    display: block;
    position: absolute;
    top: 0px;
    left: 1px;
    z-index: 0;
    pointer-events: none !important
}

.sub-section.color-living .slider-item .square-button a {
    color: #1DC6AC;
    z-index: 1
}

.sub-section.color-living .slider-item .button--wayra::before {
    background: #1DC6AC
}

.sub-section.color-living .subSlider .slick-prev::after,.sub-section.color-living .subSlider .slick-next::after {
    background-color: #1DC6AC;
    opacity: 0.6
}

.sub-section.color-living .slick-dots li:hover button::before {
    content: "•";
    color: #1DC6AC;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-living .slick-dots li button::before {
    content: "•";
    color: #fff;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-living .slick-dots li.slick-active button::before {
    content: "•";
    color: #1DC6AC;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-living .content .subSlider .slick-list .slick-track .subItem .slider-item .text .text-title {
    color: #1DC6AC
}

.sub-section.color-wellness .slider-item::after {
    z-index: 1002;
    content: " ";
    position: absolute;
    display: block;
    bottom: 0px;
    right: 0px;
    border-style: solid;
    border-width: 0 0 100px 15px;
    border-color: transparent transparent #3C98D6 transparent
}

.sub-section.color-wellness .slider-item .square-button {
    color: #3C98D6;
    border: solid #3C98D6 1px;
    border: none;
    border-radius: 0;
    text-decoration: none;
    margin-left: 0;
    margin-right: 0;
    width: 80px;
    height: 30px;
    padding: 0;
    outline: none;
    cursor: pointer;
    position: absolute;
    bottom: 20px;
    left: 20px
}

.sub-section.color-wellness .slider-item .square-button::after {
    content: " ";
    border: solid #3C98D6 1px;
    width: 79px !important;
    height: 30px !important;
    display: block;
    position: absolute;
    top: 0px;
    left: 1px;
    z-index: 0;
    pointer-events: none !important
}

.sub-section.color-wellness .slider-item .square-button a {
    color: #3C98D6;
    z-index: 1
}

.sub-section.color-wellness .slider-item .button--wayra::before {
    background: #3C98D6
}

.sub-section.color-wellness .subSlider .slick-prev::after,.sub-section.color-wellness .subSlider .slick-next::after {
    background-color: #3C98D6;
    opacity: 0.6
}

.sub-section.color-wellness .slick-dots li:hover button::before {
    content: "•";
    color: #3C98D6;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-wellness .slick-dots li button::before {
    content: "•";
    color: #fff;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-wellness .slick-dots li.slick-active button::before {
    content: "•";
    color: #3C98D6;
    font-size: 12px;
    opacity: inherit
}

.sub-section.color-wellness .content .subSlider .slick-list .slick-track .subItem .slider-item .text .text-title {
    color: #3C98D6
}

.sub-section.color-rewards {
    background: #1E1E13
}

.sub-section .content .subSlider .slick-list .slick-track .subItem.prestigeItem .slider-item,.sub-section .content.right .subSlider .slick-list .slick-track .subItem.prestigeItem .slider-item {
    background-color: rgba(30,30,19,0.9)
}

.sub-section .content .subSlider .slick-list .slick-track .subItem.prestigeItem .slider-item .text .text-title,.sub-section .content .subSlider .slick-list .slick-track .subItem.prestigeItem .slider-item .description,.sub-section .content.right .subSlider .slick-list .slick-track .subItem.prestigeItem .slider-item .text .text-title,.sub-section .content.right .subSlider .slick-list .slick-track .subItem.prestigeItem .slider-item .description {
    color: #ffffff
}

.sub-section .content .subSlider .slick-list .slick-track .subItem.prestigeItem .slider-item::before,.sub-section .content.right .subSlider .slick-list .slick-track .subItem.prestigeItem .slider-item::before {
    width: 156px;
    height: 99px;
    position: absolute;
    top: -5px;
    left: -6px;
    content: " ";
    background-image: url(/hk/diamond/themes/unionpay/images/ribbon.png);
    background-size: 100%;
    background-repeat: no-repeat
}

.sub-section .content .subSlider .slick-list .slick-track .subItem.noRibbon .slider-item::before,.sub-section .content.right .subSlider .slick-list .slick-track .subItem.noRibbon .slider-item::before {
    display: none
}

@media (max-width: 1200px) {
    .sub-section .content .layer_container .desc_layer,.sub-section .content .layer_container .title_layer,.sub-section .content .layer_container .sub_title_layer,.sub-section .content .layer_container .tag_layer,.sub-section .content.right .layer_container .desc_layer,.sub-section .content.right .layer_container .title_layer,.sub-section .content.right .layer_container .sub_title_layer,.sub-section .content.right .layer_container .tag_layer {
        width: 1000px;
        margin-left: -500px
    }

    .sub-section .content .layer_container .sub_title_layer span,.sub-section .content.right .layer_container .sub_title_layer span {
        margin-top: 30%
    }

    .sub-section .content .layer_container .desc_layer p,.sub-section .content.right .layer_container .desc_layer p {
        margin-top: 52%
    }

    .sub-section .content .subSlider {
        width: 63%;
        left: 3%;
        margin-top: 28%
    }

    .sub-section .content.right .subSlider {
        width: 63%;
        right: 3%;
        margin-top: 28%
    }

    #section-entertainment .layer_container .title_layer span {
        margin-top: 18%
    }

    #section-entertainment .content .slider_container .subSlider {
        margin-top: 31%
    }

    #section-entertainment .content .layer_container .sub_title_layer span {
        margin-top: 38%
    }

    #section-entertainment .content .layer_container .desc_layer p {
        margin-top: 63%
    }
}

@media (max-width: 1100px) {
    .sub-section .content .layer_container .title_layer,.sub-section .content .layer_container .sub_title_layer,.sub-section .content .layer_container .desc_layer,.sub-section .content .layer_container .tag_layer,.sub-section .content.right .layer_container .title_layer,.sub-section .content.right .layer_container .sub_title_layer,.sub-section .content.right .layer_container .desc_layer,.sub-section .content.right .layer_container .tag_layer {
        width: 950px;
        margin-left: -475px
    }

    .sub-section .content .slider_container {
        width: 950px;
        margin-left: -475px
    }

    .sub-section .content .subSlider,.sub-section .content.right .subSlider {
        margin-top: 33%
    }

    #section-entertainment .content .slider_container .subSlider {
        margin-top: 37%
    }
}

@media (max-width: 1024px) {
    .sub-section .content .layer_container .bg_layer,.sub-section .content .layer_container .over_layer {
        -webkit-transform: scale(0.9, 0.9);
        transform: scale(0.9, 0.9)
    }

    .sub-section .content .layer_container .title_layer,.sub-section .content .layer_container .sub_title_layer,.sub-section .content .layer_container .desc_layer,.sub-section .content .layer_container .tag_layer,.sub-section .content.right .layer_container .title_layer,.sub-section .content.right .layer_container .sub_title_layer,.sub-section .content.right .layer_container .desc_layer,.sub-section .content.right .layer_container .tag_layer {
        width: 900px;
        margin-left: -450px
    }

    .sub-section .content .layer_container .title_layer span,.sub-section .content.right .layer_container .title_layer span {
        margin-top: 20%
    }

    .sub-section .content .layer_container .sub_title_layer span,.sub-section .content.right .layer_container .sub_title_layer span {
        margin-top: 34%
    }

    .sub-section .content .layer_container .desc_layer p,.sub-section .content.right .layer_container .desc_layer p {
        margin-top: 60%
    }

    .sub-section .content .slider_container {
        width: 950px;
        margin-left: -475px
    }

    .sub-section .content .slider_container .subSlider {
        left: 1%;
        margin-top: 35%
    }

    .sub-section .content.right .slider_container {
        width: 950px;
        margin-left: -475px
    }

    .sub-section .content.right .slider_container .subSlider {
        left: auto;
        right: 1%;
        margin-top: 35%
    }
}

@media (max-width: 991px) {
    .sub-section .content .layer_container .title_layer,.sub-section .content .layer_container .sub_title_layer,.sub-section .content .layer_container .desc_layer,.sub-section .content .layer_container .tag_layer {
        width: 100%;
        margin-right: 5%;
        left: auto;
        right: 0%
    }

    .sub-section .content.right .layer_container .title_layer,.sub-section .content.right .layer_container .sub_title_layer,.sub-section .content.right .layer_container .desc_layer,.sub-section .content.right .layer_container .tag_layer {
        width: 100%;
        margin-left: 5%;
        left: 0%
    }

    .sub-section .content .slider_container {
        width: 90%;
        margin-left: 0px;
        left: 0%
    }

    .sub-section .content .slider_container .subSlider {
        margin-top: 40%;
        left: 3%
    }

    .sub-section .content.right .slider_container {
        width: 90%;
        margin-left: 10%;
        right: 0%
    }

    .sub-section .content.right .slider_container .subSlider {
        margin-top: 40%;
        right: 3%
    }

    #section-entertainment .content .layer_container .title_layer span {
        margin-top: 20%
    }

    #section-entertainment .content .slider_container .subSlider {
        margin-top: 46%
    }

    #section-entertainment .content .layer_container .sub_title_layer span {
        margin-top: 43%
    }

    #section-entertainment .content .layer_container .desc_layer p {
        margin-top: 70%
    }
}

@media (max-width: 850px) {
    #section-entertainment .content .layer_container .title_layer span {
        margin-top: 18%;
        font-size: 95px
    }
}

@media (max-height: 800px) {
    .sub-section .content .subSlider {
        margin-top: 21%
    }

    .sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .text {
        min-height: 160px;
        padding: 15px 20px
    }

    .sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .text .text-title {
        font-size: 13px
    }

    .sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .text .description {
        font-size: 12px;
        min-height: 65px
    }

    .sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .imageBox {
        height: 185px
    }

    .sub-section .content .layer_container .tag_layer span,.sub-section .content.right .layer_container .tag_layer span {
        margin-top: 11%
    }

    .sub-section .content .layer_container .title_layer span,.sub-section .content.right .layer_container .title_layer span {
        margin-top: 13%
    }

    .sub-section .content .layer_container .sub_title_layer span,.sub-section .content.right .layer_container .sub_title_layer span {
        margin-top: 21%
    }

    .sub-section .content .layer_container .desc_layer p,.sub-section .content.right .layer_container .desc_layer p {
        margin-top: 38%
    }
}


@media (max-height: 720px) and (min-width: 1024px) {
    .fp-section .content {
        margin-top: -360px
    }
}

@media (max-width: 640px) {
    .sub-section .content .subSlider .slick-prev,.sub-section .content .subSlider .slick-next {
        /*display: none !important*/
    }
}

@media (max-width: 991px) {
    #section-rewards .content .top_content .title {
        margin-top: 14%;
        width: 70%
    }

    #section-rewards .content .square-button {
        top: 19%
    }

    #section-rewards .content .banner_content .left .title,#section-rewards .content .banner_content .right .title {
        bottom: 37%;
        font-size: 24px
    }

    #section-rewards .content .banner_content .left .rewards_slider .slick-track .item .descBox,#section-rewards .content .banner_content .right .rewards_slider .slick-track .item .descBox {
        bottom: 15%;
        font-size: 14px
    }
}

@media (max-width: 900px) {
    #section-rewards .content .top_content .title {
        line-height: 52px;
        width: 100%
    }

    #section-rewards .content .banner_content {
        float: left;
        margin-bottom: 100px
    }

    #section-rewards .content .square-button {
        position: relative;
        width: 100%;
        margin: 20px 0px;
        margin-bottom: 50px;
        top: 0px
    }
    .sub-section .content .subSlider .slick-dots {
        width: 60%;
    }
}

@media (max-height: 768px) {

    .sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .text {
        min-height: 160px;
        padding: 15px 20px
    }

    .sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .text .text-title {
        font-size: 13px;
        padding-bottom: 6px
    }

    .sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .text .description {
        font-size: 12px
    }

    .sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .imageBox {
        height: 170px
    }
}

@media (max-height: 768px) and (max-width: 600px) {
    .sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .text .description {
        display: block
    }

    .sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .text {
        min-height: 190px
    }

}


@media (max-width: 767px) {
    .sub-section .content .layer_container,.sub-section .content.right .layer_container{overflow:initial}
    .sub-section .content .layer_container .tag_layer,.sub-section .content.right .layer_container .tag_layer{top:-30px;margin-left:5%;margin-right:0;right:auto;left:0}
    .sub-section .content .layer_container .tag_layer span,.sub-section .content.right .layer_container .tag_layer span{float:left;margin-top:0}
    #section-entertainment .content .slider_container .subSlider{margin-top:3%;margin-top: 3%;
        bottom: 0;
        top: auto;
    }
    #section-home{padding-top:0;top:0!important}
    #section-home .slick-slider{margin-bottom:0}
    #section-detail{top:0!important}
    .sub-section .content,.sub-section .content.right{padding-top:60px;overflow:hidden}
    .sub-section .content .layer_container .m_title_layer,.sub-section .content .layer_container .m_title_second_layer,.sub-section .content.right .layer_container .m_title_layer,.sub-section .content.right .layer_container .m_title_second_layer{color:#fff;display:inline-block;float:left;margin-top:0;font-size:40px;margin-left:30px;letter-spacing:0;width:100%;line-height:50px;font-weight:100}
    .sub-section .content .layer_container .m_title_second_layer,.sub-section .content.right .layer_container .m_title_second_layer{margin-bottom:0}
    .sub-section .content .layer_container .bg_layer,.sub-section .content .layer_container .over_layer,.sub-section .content.right .layer_container .bg_layer,.sub-section .content.right .layer_container .over_layer{display:none}
    .sub-section .content .layer_container .title_layer,.sub-section .content.right .layer_container .title_layer{display:none}
    .sub-section .content .layer_container .desc_layer,.sub-section .content .layer_container .sub_title_layer,.sub-section .content.right .layer_container .desc_layer,.sub-section .content.right .layer_container .sub_title_layer{float:left;position:relative;width:100%;margin-left:0;top:auto;left:auto;right:auto}
    .sub-section .content .layer_container .desc_layer p,.sub-section .content .layer_container .desc_layer span,.sub-section .content .layer_container .sub_title_layer p,.sub-section .content .layer_container .sub_title_layer span,.sub-section .content.right .layer_container .desc_layer p,.sub-section .content.right .layer_container .desc_layer span,.sub-section .content.right .layer_container .sub_title_layer p,.sub-section .content.right .layer_container .sub_title_layer span{text-align:left;float:left;margin-top:0;font-size:40px;margin-left:30px;letter-spacing:0;width:100%;line-height:50px}
    .sub-section .content .layer_container .sub_title_layer span,.sub-section .content .layer_container .title_layer span,.sub-section .content.right .layer_container .sub_title_layer span,.sub-section .content.right .layer_container .title_layer span{padding-right:20%;word-wrap:break-word}
    .sub-section .content .layer_container .desc_layer,.sub-section .content.right .layer_container .desc_layer{margin-top:10px;margin-bottom:0%;width:100%}
    .sub-section .content .layer_container .desc_layer p,.sub-section .content.right .layer_container .desc_layer p{width:220px;font-size:16px;line-height:20px}
    .sub-section .m_layer{display:block}
    .sub-section .content .slider_container,.sub-section .content.right .slider_container{width:100%;margin-left:0}
    .sub-section .content .slider_container .subSlider,.sub-section .content.right .slider_container .subSlider{bottom:0; top:auto; margin-bottom:0;right:auto;left:10%;width:80%;padding-top:0;margin-top:3%;height: 380px!important;}
    .sub-section .content .slider_container .subSlider .slick-list .slick-track .subItem,.sub-section .content.right .slider_container .subSlider .slick-list .slick-track .subItem{padding-top:10px;margin-left:15px;margin-right:15px}
    .sub-section .content .slider_container .subSlider .slick-list .slick-track .subItem:hover .slider-item,.sub-section .content.right .slider_container .subSlider .slick-list .slick-track .subItem:hover .slider-item{margin-top:0}
    .sub-section .content .slider_container .subSlider .slick-list,.sub-section .content.right .slider_container .subSlider .slick-list{padding:0;overflow:visible}
    /*8-18修改*/
    .sub-section .content .slider_container .subSlider .slick-next,
    .sub-section .content .slider_container .subSlider .slick-prev,
    .sub-section .content.right .slider_container .subSlider .slick-next,
    .sub-section .content.right .slider_container .subSlider .slick-prev{
        /*display:none!important*/
        top: 40%;
    }
    .sub-section .content .slider_container .subSlider .slick-next,
    .sub-section .content.right .slider_container .subSlider .slick-next{
        right: 0;
    }
    .sub-section .content .slider_container .subSlider .slick-prev,
    .sub-section .content.right .slider_container .subSlider .slick-prev{
        left: 0;
    }
    .sub-section .content .subSlider .slick-next{
        background: url("/hk/diamond/themes/unionpay/images/right_arrow.png") no-repeat center;
        background-size: 15px;
    }
    .sub-section .content .subSlider .slick-prev{
        background: url("/hk/diamond/themes/unionpay/images/left_arrow.png") no-repeat center;
        background-size: 15px;
    }
    .sub-section .content .subSlider .slick-next::before,
    .sub-section .content .subSlider .slick-next::after,
    .sub-section .content .subSlider .slick-prev::before,
    .sub-section .content .subSlider .slick-prev::after{
        opacity: 0;
    }

    /*8-18修改 end*/


    .sub-section .content .slider_container .subSlider .slick-dots,
    .sub-section .content.right .slider_container .subSlider .slick-dots{
        opacity: 0;
        width:100%;
        bottom:20px;
        padding-left:0;
        text-align:center
    }
    .sub-section .content .slider_container .subSlider .slick-dots li,.sub-section .content.right .slider_container .subSlider .slick-dots li{margin:0 5px }
    .sub-section .content .slider_container .subSlider .slick-dots li button::before,.sub-section .content.right .slider_container .subSlider .slick-dots li button::before{font-size:8px!important}
    .sub-section .content .slider_container .subSlider .slick-dots li button::after,.sub-section .content.right .slider_container .subSlider .slick-dots li button::after{display:none}
    .sub-section .content .slider_container .subSlider .slick-dots li.slick-active button::before,.sub-section .content.right .slider_container .subSlider .slick-dots li.slick-active button::before{font-size:8px!important}
    .sub-section .content .layer_container .desc_layer,.sub-section .content .layer_container .sub_title_layer,.sub-section .content .layer_container .title_layer,.sub-section .content.right .layer_container .desc_layer,.sub-section .content.right .layer_container .sub_title_layer,.sub-section .content.right .layer_container .title_layer{height:auto}
    #section-entertainment .content .layer_container .desc_layer,#section-entertainment .content .layer_container .sub_title_layer{float:left;position:relative;width:100%;margin-left:0;margin-top:0;top:auto;left:auto;right:auto}
    #section-entertainment .content .layer_container .desc_layer p,#section-entertainment .content .layer_container .desc_layer span,#section-entertainment .content .layer_container .sub_title_layer p,#section-entertainment .content .layer_container .sub_title_layer span{margin-top:0}
    #section-entertainment .content .layer_container .desc_layer{margin-top:20px;margin-bottom:50%;width:100%}
    #page_container,footer{float:left}
    #section-home .content #mainSlider .slick-list .item .banner img{display:none}
    #section-home .content .slogan{font-size:1.2em}
    #section-home .content .phoneBox{display:none}
    #section-home .content .floatingBox{display:none}
    #section-home .content #mainSlider .slick-dots li.slick-active button:after{opacity:0}
    #arrowDown{display:none}
    #section-home{height:300px!important;margin-top:60px}
    #section-home .content::before{border-width:130px 50px 0 80px}
    #section-home .content::after{border-width:0 0 130px 52px}
    #section-home .content .m_nextBtn,#section-home .content .m_prevBtn{width:43px;height:100px;display:block;position:absolute;top:115px}
    #section-home .content .m_nextBtn img,#section-home .content .m_prevBtn img{width:100%;max-width:16px;position:absolute;top:20px;right:0}
    #section-home .content .m_prevBtn{left:25px;z-index:2}
    #section-home .content .m_prevBtn img{width:100%;max-width:16px;position:absolute;top:20px;left:0;right:auto}
    #section-home .content .m_nextBtn{right:25px;z-index:2}
    #section-home .nextBtn,#section-home .prevBtn{display:none}
    #section-rewards .content .top_content .list-content span{width:100%;margin-bottom:0}
    #section-rewards .content .top_content .title{
        padding: 0;
        margin-top: 0;
        width: 100%;
        font-size: 35px;
        line-height: 35px;
        margin-top: 4rem;
        margin-bottom: 0;
    }
    #section-rewards .content .banner_content{float:left;margin-bottom:10px}
    #section-rewards .content .banner_content .left,#section-rewards .content .banner_content .right{width:49%;margin-bottom:50px}
    #section-rewards .content .square-button{padding:24px 0}
    #section-rewards .content .square-button span{line-height:46px}
    #section-rewards .content .banner_content .left .rewards_slider .slick-dots li.slick-active button:after,#section-rewards .content .banner_content .right .rewards_slider .slick-dots li.slick-active button:after{display:none}
    .sub-section{top:0!important}

    #section-rewards .content .top_content .list-content {
        font-size: 14px;
    }

    .top_content{
        padding-top: 10px;
    }
    #section-rewards .content {
        width: 95%;
        margin-left: 0%;
        margin-right: 0%;
        max-width:  100%;
        margin: 0 auto;
    }
    #section-rewards .content .banner_content .left .title, #section-rewards .content .banner_content .right .title {
        bottom: auto;
        top: 15%;
        font-size: 16px;
    }
    #section-rewards .content .banner_content .left .rewards_slider .slick-track .item .descBox, #section-rewards .content .banner_content .right .rewards_slider .slick-track .item .descBox {
        bottom: auto;
        font-size: 12px;
        top: 38%;
    }

    #section-rewards .content .banner_content .left .rewards_slider, #section-rewards .content .banner_content .right .rewards_slider {
        width: 100%;
        display: block;
        margin: 0 auto;
    }

    #section-rewards .content .banner_content .left .rewards_slider .slick-dots, #section-rewards .content .banner_content .right .rewards_slider .slick-dots {
        bottom: -30px;
    }
    .sub-section.color-dining .content .layer_container .title_layer span, .sub-section.color-dining .content .layer_container .sub_title_layer span, .sub-section.color-dining .content .layer_container .m_title_layer span, .sub-section.color-dining .content .layer_container .tag_layer span, .sub-section.color-dining .content.right .layer_container .title_layer span, .sub-section.color-dining .content.right .layer_container .sub_title_layer span, .sub-section.color-dining .content.right .layer_container .m_title_layer span, .sub-section.color-dining .content.right .layer_container .tag_layer span {
        color: #F58472;
        font-size: 35px;
        line-height: 30px;
    }


    #section-rewards .content .banner_content .left{
        margin-right: 2%;
    }

    .sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item {
        width: 90%;
        max-width: 100%;
    }



    .sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .text {
        min-height: auto;
    }

    .sub-section.color-living .content .subSlider .slick-list .slick-track .subItem .slider-item .text .text-title {
        color: #1DC6AC;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }

    .sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .text .text-title {
        color: #1DC6AC;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }
    .sub-section .content .layer_container .m_title_layer, .sub-section .content .layer_container .m_title_second_layer, .sub-section .content.right .layer_container .m_title_layer, .sub-section .content.right .layer_container .m_title_second_layer {
        font-size: 35px;
        line-height: 35px;
    }
    #section-rewards .content .banner_content .left .rewards_slider .slick-dots li, #section-rewards .content .banner_content .right .rewards_slider .slick-dots li {
        margin: 0 4px;
    }

    .slick-dots li {
        height: 8px;
        width: 8px;
        margin: 0 5px;
    }
}
@media (max-width: 600px) {

    .sub-section .content .layer_container .m_title_layer, .sub-section .content .layer_container .m_title_second_layer, .sub-section .content.right .layer_container .m_title_layer, .sub-section .content.right .layer_container .m_title_second_layer {
        margin-top: 10px;
    }
    #section-home .content .m_nextBtn, #section-home .content .m_prevBtn {
        width: 43px;
        height: 100px;
        display: block;
        position: absolute;
        top: 43%;
    }
}
@media (max-width: 500px) {

    .sub-section .content .subSlider .slick-dots li{margin:0}
    .sub-section .content .subSlider .slick-dots{padding-left:0!important;text-align:left!important}
    .sub-section .content .subSlider .slick-list::after,.sub-section .content .subSlider .slick-list::before{display:none}
    .sub-section .content .subSlider .slick-list .slick-slide{opacity:1}
    .sub-section .content .subSlider .slick-list .slick-active{opacity:1}
    .sub-section .content .subSlider .slick-track .subItem,.sub-section .content.right .subSlider .slick-track .subItem{margin-left:10px;margin-right:10px}
    .sub-section .content .slider_container .subSlider .slick-list .slick-track .subItem,.sub-section .content.right .slider_container .subSlider .slick-list .slick-track .subItem{margin-left:6px;margin-right:6px}
    #section-home .content .slogan{font-size:1em;top:59%}
    #section-home .content::before{border-width:100px 30px 0 80px}
    #section-home .content::after{border-width:0 0 100px 30px}
    #section-home .content .m_nextBtn,#section-home .content .m_prevBtn{width:15px;display:block;position:absolute}
    #section-home .content .m_nextBtn img,#section-home .content .m_prevBtn img{width:100%}
    #section-home .content .m_prevBtn{top:42%;left:15px;z-index:2}
    #section-home .content .m_nextBtn{top:42%;right:15px;z-index:2}
    #section-home .content #mainSlider .slick-dots{bottom:12%}
    #section-home .content #mainSlider .slick-dots li{margin:0 3px}
    #section-home .content #mainSlider .slick-dots li button:before{font-size:9px}
    #section-home .content #mainSlider .slick-dots li button:after{top:2px;left:3px;width:14px;height:14px;opacity:0!important}
    #section-home .content #mainSlider .slick-next,#section-home .content #mainSlider .slick-prev{display:none}

}


@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
    .sub-section .content .slider_container .subSlider, .sub-section .content.right .slider_container .subSlider {
        width: 70%;
        padding-top: 0;
        margin-top: 3%;
        height: 450px!important;
    }
    .sub-section.color-dining .content .layer_container .title_layer span, .sub-section.color-dining .content .layer_container .sub_title_layer span, .sub-section.color-dining .content .layer_container .m_title_layer span, .sub-section.color-dining .content .layer_container .tag_layer span, .sub-section.color-dining .content.right .layer_container .title_layer span, .sub-section.color-dining .content.right .layer_container .sub_title_layer span, .sub-section.color-dining .content.right .layer_container .m_title_layer span, .sub-section.color-dining .content.right .layer_container .tag_layer span {
        color: #F58472;
        font-size: 32px;
        line-height: 28px;
    }
}
@media (max-width: 360px) {
    .sub-section .content .slider_container .subSlider, .sub-section .content.right .slider_container .subSlider {
        width: 70%;
        padding-top: 0;
        margin-top: 3%;
        height: 300px!important;
    }
    .sub-section .content .subSlider .slick-list .slick-track .subItem .slider-item .text {
        min-height: 80px;
    }
    .sub-section .content .layer_container .m_title_layer, .sub-section .content .layer_container .m_title_second_layer, .sub-section .content.right .layer_container .m_title_layer, .sub-section .content.right .layer_container .m_title_second_layer {
        font-size: 30px;
        line-height: 30px;
    }
    .sub-section .content .layer_container .sub_title_layer span, .sub-section .content .layer_container .title_layer span, .sub-section .content.right .layer_container .sub_title_layer span, .sub-section .content.right .layer_container .title_layer span {
        padding-right: 20%;
        word-wrap: break-word;
        font-size: 30px;
        line-height: 30px;
    }
    .sub-section .content .slider_container .subSlider .slick-dots, .sub-section .content.right .slider_container .subSlider .slick-dots {
        bottom: 0;
    }
}

.switchBtn{
    display: none;
    width: 40px;
    position: fixed;
    top: 20%;
    right: 0;
    z-index: 9;
    border-top-left-radius: 14px;
    border-bottom-left-radius: 14px;
    overflow: hidden;
}
.switchBtn a{
    display: inline-block;
    width: 40px;
    height: 70px;
    line-height: 70px;
    font-size: 14px;
    color: #fff;
    text-align: center;
    background: #b09066;
    /*margin: 33px 0;*/
}
.switchBtn a span{
    display: inline-block;
    transform: rotate(90deg);
}
#btnPrev span{
    padding-left:20px;
    background:url("/hk/diamond/themes/unionpay/images/prev-icon.png") no-repeat center left;
}
#btnNext{
    margin-top: 2px;
}
#btnNext span{
    padding-right:20px;
    background:url("/hk/diamond/themes/unionpay/images/next-icon.png") no-repeat center right;
}
@media screen and (max-width: 768px){
    .switchBtn{
        display: block;
    }
}