body, html{ margin: 0px; padding: 0px; background: #FFF; color: #000; }
body, html{ overflow-x: hidden; }
.overflow-unset{ overflow: unset !important; }
*{ 
    box-sizing:  border-box; 
    font-family: "Noto Sans Display", Arial, Helvetica, sans-serif;
}
[data-lang="tc"] *,
[data-lang="sc"] *{
    font-family: "Noto Sans Display", "Microsoft Jhenghei", "Hiragino Sans GB", "Microsoft YaHei", arial, sans-serif;
}

a{ transition: ease all 0.3s; color: inherit; text-decoration: none; }
a:before,
a:after{ transition: ease all 0.3s; }

body{ font-size: 14px; }
html * { -webkit-text-size-adjust: none; }
img { width: auto; height: auto; max-width: 100%; }
/*================================================================================*/
/*GENERIC*/
/*================================================================================*/
.hkpm_inner_page{ padding-top: 150px; }
.notice .hkpm_inner_page{ padding-top: 240px; }
.accessibility_icon { align-self: flex-end; min-height: 55px; min-width: 100px; max-width: 120px; margin-left: 24px; margin-top: -12px;}
.accessibility_icon + .accessibility_icon {margin-left: 12px;}
.hkpm_main{ max-width: 1520px; padding: 0px 60px; margin: 0px auto; }

@media screen and (max-width:1279px){
    .hkpm_inner_page{ padding-top: 140px; }
    .notice .hkpm_inner_page{ padding-top: 200px; }
    .hkpm_main{ padding: 0px 40px; }
    .accessibility_icon { margin-top: 0; }
}
@media screen and (max-width:1023px){
    .hkpm_inner_page{ padding-top: 100px; }    
    .notice .hkpm_inner_page{ padding-top: 160px; }
    .hkpm_main{ padding: 0px 20px; }
}

.hkpm_main h1{ font-size: 100px; line-height:   1em; margin: 0px 0px 30px 0px; padding: 0px; font-weight: 100; }
.hkpm_main h2{ font-size:  65px; line-height:   1em; margin: 0px 0px 30px 0px; padding: 0px; font-weight: 100; text-transform: uppercase; }
.hkpm_main h2.shorten{ font-size: 52px;}
.hkpm_main .h3,
.hkpm_main h3{ font-size:  30px; line-height: 1.2em; margin: 0px 0px  5px 0px; padding: 0px; font-weight: 400; }
.hkpm_main h4{ font-size:  22px; line-height: 1.3em; margin: 0px  0px 0px 0px; padding: 0px; font-weight: 400; }
.hkpm_main h5{ font-size:  19px; line-height: 1.3em; margin: 0px  0px 0px 0px; padding: 0px; font-weight: 400; }
.hkpm_main h6{ font-size:  18px; line-height: 1.3em; margin: 0px  0px 0px 0px; padding: 0px; font-weight: 400; }
.hkpm_main p { font-size:  16px; line-height: 1.5em; margin: 0px  0px 0px 0px; padding: 0px; }
.hkpm_main blockquote { font-size:  16px; line-height: 1.5em; margin: 0px  0px 0px 0px; padding-left: 16px; border-left: 2px solid #A28C57; }
.hkpm_main td,
.hkpm_main th{ font-size:  16px; line-height: 1.5em; margin: 0px  0px 0px 0px; padding: 0px; }
.hkpm_main li{ font-size:  16px; line-height: 1.5em; margin: 0px 0px 15px 0px; padding: 0px; }

.hkpm_main hr{
    display: block; border:none; border-top:1px solid #D7D7D7;
    margin: 60px 0px;
}
.hkpm_main hr.gold {
    border-top-color: rgba(162, 140, 87, 0.5);
}

.hkpm_main blockquote strong,
.hkpm_main p strong{ font-weight: 600; }
.hkpm_main blockquote strong.gold,
.hkpm_main p strong.gold{ color: inherit;}

.hkpm_main blockquote.highlight{ padding-bottom: 0.5em; font-size: 1.2em; }

/* .hkpm_inner_page #thematic{ margin-top: 60px;} */

@media screen and (max-width:1439px){
    .hkpm_main h1{ font-size: 84px; }
    .hkpm_main h2{ font-size: 64px; }
    .hkpm_main h2.shorten{ font-size: 48px;}
}
@media screen and (max-width:1279px){
    .hkpm_main h1{ font-size: 72px; }
    .hkpm_main .h3,
    .hkpm_main h2{ font-size: 55px; }
    .hkpm_main h2.shorten{ font-size: 48px;}
    .hkpm_main h3{ font-size: 24px; }
    .hkpm_main h4{ font-size: 19px; }
    .hkpm_main h5{ font-size: 16px; }
    .hkpm_main h6{ font-size: 16px; }
    .hkpm_main blockquote,
    .hkpm_main p { font-size: 15px; }
    .hkpm_main td,
    .hkpm_main th{ font-size: 15px; }
    .hkpm_main li{ font-size: 15px; }
}
@media screen and (max-width:1023px){
    body{ font-size: 14px; }
    .hkpm_main h1{ font-size: 64px; }
    .hkpm_main h2{ font-size: 48px; }
    .hkpm_main h2.shorten{ font-size: 42px;}
    .hkpm_main .h3,
    .hkpm_main h3{ font-size: 20px; }
    .hkpm_main h4{ font-size: 19px; }
    .hkpm_main h5{ font-size: 16px; }
    .hkpm_main h6{ font-size: 16px; }
    .hkpm_main blockquote,
    .hkpm_main p { font-size: 14px; }
    .hkpm_main td,
    .hkpm_main th{ font-size: 14px; }
    .hkpm_main li{ font-size: 14px; }
    
    .hkpm_main hr{ margin: 40px 0px; }
}
@media screen and (max-width:767px){
    body{ font-size: 14px; }
    .hkpm_main h1{ font-size: 48px; }
    .hkpm_main h2{ font-size: 40px; }
    .hkpm_main h2.shorten{ font-size: 36px;}
    .hkpm_main .h3,
    .hkpm_main h3{ font-size: 18px; }
    .hkpm_main h4{ font-size: 18px; }
    .hkpm_main h5{ font-size: 15px; }
    .hkpm_main h6{ font-size: 15px; }
    .hkpm_main blockquote,
    .hkpm_main p { font-size: 14px; }
    .hkpm_main td,
    .hkpm_main th{ font-size: 14px; }
    .hkpm_main li{ font-size: 14px; }
}
@media screen and (max-width:479px){
    .hkpm_main h2{ font-size: 36px;}
    .hkpm_main h2.shorten{ font-size: 24px;}
}

.hkpm_main ul{ margin: 0px; padding: 0px 0px 0px 0px; }
.hkpm_main ol{ margin: 0px; padding: 0px 0px 0px 30px; }

.hkpm_main ul li{
    position: relative;
    list-style: none; padding-left: 20px; 
}
.hkpm_main ul li:last-of-type{ margin-bottom: 0px; }
.hkpm_main ul li:before{
    content: ""; display: block;
    position: absolute; top: 8px; left: 0px;
    width: 8px; height: 8px; border-radius: 50%;
    background: #A28C57; 
}
.hkpm_main ul li li:before{
    background: #FFF;  border: 1px solid #A28C57;
    box-sizing: border-box;
}

.hkpm_main h2.larger{ font-size: 96px; font-weight: 900; text-align: center; color: #A28C57; margin-top: 150px; max-width: 100%; }
.hkpm_main h2.large { font-size: 80px; font-weight: 600; text-align: left;   color: #A28C57; margin-top: 120px; max-width: 100%; }
.hkpm_main h2.medium{ font-size: 65px; font-weight: 500; }
.hkpm_main h2.small { font-size: 55px; font-weight: 500; text-align: center; text-transform: none; }

.hkpm_main .h3.large,
.hkpm_main h3.large { font-size: 45px;  font-weight: 500; }
.hkpm_main h3.small { font-size: 25px;  font-weight: 500; }

.hkpm_main h2.custom-larger{ font-size: 96px; font-weight: 900; color: #A28C57; }
.hkpm_main h2.custom-large { font-size: 80px; font-weight: 600; color: #A28C57; }
.hkpm_main h2.custom-medium{ font-size: 65px; font-weight: 500; }
.hkpm_main h2.custom-small { font-size: 55px; font-weight: 500; text-transform: none; }

.hkpm_main .h3.custom-large,
.hkpm_main h3.custom-large { font-size: 45px;  font-weight: 500; }
.hkpm_main h3.custom-small { font-size: 25px;  font-weight: 500; }

.hkpm_main h2 strong{ font-weight: 900; color: #A28C57; }
.hkpm_main h2 a{ transition:none; }

.hkpm_main .grey{ color: #000; }
.hkpm_main .gold{ color: #A28C57; }
.hkpm_main .warning{ color: #C66; }
.hkpm_main .highlight{ color: #A28C57; font-weight: bold; }
.hkpm_main .center{ text-align: center; margin-left: auto; margin-right: auto; }

.hkpm_main .short  { max-width: 800px; }
.hkpm_main .shorter{ max-width: 600px; }

/* .hkpm_main .quote:before{
    content: ""; display: block;
    height: 50px; width: 100%;
    background-image: url(../img/quote.png);
    background-position: top center;
    background-repeat: no-repeat; margin-top: 120px; 
} */

.hkpm_bg_grey{ background: #F6F6F6; padding: 120px 0px; }

@media screen and (max-width:1279px){
    .hkpm_main h2.larger{ font-size: 84px; margin-top: 120px; }  
    .hkpm_main h2.large { font-size: 80px; margin-top: 90px; }  
    .hkpm_main h2.medium{ font-size: 55px; }
    .hkpm_main h2.small { font-size: 48px; }

    .hkpm_main .h3.large,
    .hkpm_main h3.large { font-size: 36px; }
    .hkpm_main h3.small { font-size: 20px; }
    
    .hkpm_main h2.custom-larger{ font-size: 84px; }  
    .hkpm_main h2.custom-large { font-size: 80px; }  
    .hkpm_main h2.custom-medium{ font-size: 55px; }
    .hkpm_main h2.custom-small { font-size: 48px; }

    .hkpm_main .h3.custom-large,
    .hkpm_main h3.custom-large { font-size: 36px; }
    .hkpm_main h3.custom-small { font-size: 20px; }

    .hkpm_main li{ margin: 0px 0px 10px 0px; }
    .hkpm_main .quote:before{ margin-top: 45px; }
}
@media screen and (max-width:1023px){
    .hkpm_main h2.larger{ font-size: 72px; margin-top: 90px; }
    .hkpm_main h2.large { font-size: 60px; margin-top: 60px; }
    .hkpm_main h2.medium{ font-size: 48px; }
    .hkpm_main h2.small { font-size: 40px; }

    .hkpm_main .h3.large,
    .hkpm_main h3.large { font-size: 30px; }
    .hkpm_main h3.small { font-size: 18px; }
    
    .hkpm_main h2.custom-larger{ font-size: 72px; }
    .hkpm_main h2.custom-large { font-size: 60px; }
    .hkpm_main h2.custom-medium{ font-size: 48px; }
    .hkpm_main h2.custom-small { font-size: 40px; }

    .hkpm_main .h3.custom-large,
    .hkpm_main h3.custom-large { font-size: 30px; }
    .hkpm_main h3.custom-small { font-size: 18px; }

    .hkpm_main li{ margin: 0px 0px 5px 0px; }
    .hkpm_main .quote:before{ margin-top: 30px; }
    .hkpm_bg_grey{ padding: 60px 0px; }    
}
@media screen and (max-width:767px){
    .hkpm_main h2.larger{ font-size: 48px; margin-top: 60px; }
    .hkpm_main h2.large { font-size: 48px; margin-top: 40px; }
    .hkpm_main h2.medium{ font-size: 40px; }
    .hkpm_main h2.small { font-size: 36px; }

    .hkpm_main .h3.large,
    .hkpm_main h3.large { font-size: 24px; }
    .hkpm_main h3.small { font-size: 16px; }
    
    .hkpm_main h2.custom-larger{ font-size: 48px; }
    .hkpm_main h2.custom-large { font-size: 48px; }
    .hkpm_main h2.custom-medium{ font-size: 40px; }
    .hkpm_main h2.custom-small { font-size: 36px; }

    .hkpm_main .h3.custom-large,
    .hkpm_main h3.custom-large { font-size: 24px; }
    .hkpm_main h3.custom-small { font-size: 16px; }

    .hkpm_main .quote:before{ margin-top: 20px; }
    .hkpm_bg_grey{ padding: 40px 0px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_btn{
    position: relative;
    display: inline-block; overflow: hidden;
    font-size: 19px; font-weight: bold; 
    border-left: 1px solid #A28C57;
}
.hkpm_btn.inactive{ opacity: 0.3; }

.hkpm_btn:before{
    content: ""; display: block; box-sizing: border-box; 
    position: absolute; top: 0px; right: 0px; width: 100%; height: 100%;
    border: 1px solid #A28C57; background: rgba(255,255,255,0);
    transform: skew(-15deg, 0deg) translateX(-10px);
}
.hkpm_btn:after{
    content: ""; display: block; box-sizing: border-box; 
    position: absolute; top: 0px; right: 0px; width: 100%; height: 100%;
    border: 1px solid #A28C57; background: #A28C57;
    transform: skew(-15deg, 0deg) translateX(-150%); 
}
.hkpm_btn span{ 
    position: relative; display: block; z-index: 1;
    padding: 15px 60px 15px 30px; 
    color: #A28C57;  
    /* white-space: nowrap; */
}
.hkpm_btn span:after{
    content: ""; display: block; box-sizing: border-box;
    position: absolute; top: calc(50% - 3px); right: 30px; width: 6px; height: 6px;
    border-top: 2px solid #A28C57;
    border-right: 2px solid #A28C57;
    transform: rotate(45deg);
}
.hkpm_btn:not(.inactive):hover:after{ transform: skew(-15deg, 0deg) translateX(-10px); }
.hkpm_btn:not(.inactive):hover span{ color: #FFF; }
.hkpm_btn:not(.inactive):hover span:after{ 
    border-top-color: #FFF;
    border-right-color: #FFF;
}
.hkpm_form .hkpm_btn:before{ transform: skew(0deg, 0deg) translateX(-10px);}
.hkpm_form .hkpm_btn:after{ transform: skew(0deg, 0deg) translateX(-150%);}
.hkpm_form .hkpm_btn:not(.inactive):hover:after{ transform: skew(0deg, 0deg) translateX(-10px); }

.swiper-slide--dark{ color:#FFF; background: #000; }

.swiper-slide--dark .hkpm_btn, .hkpm_btn--dark{ 
    /*border-left-color: rgba(0,0,0,0); */
    border-color: rgba(255,255,255,0.6);
}
.swiper-slide--dark .hkpm_btn, .hkpm_btn--dark:hover{ 
    border-color: #A28C57;
}
.swiper-slide--dark .hkpm_btn:before, .hkpm_btn--dark:before{ 
    /*border-color: rgba(0,0,0,0); background: rgba(0,0,0,0.3); */
    border-color: rgba(255,255,255,0.6);
    background: rgba(0,0,0,0);
}
.swiper-slide--dark  .hkpm_btn:after, .hkpm_btn--dark:after{ 
    border-color: #A28C57;
}
.swiper-slide--dark .hkpm_btn span, .hkpm_btn--dark span{ color:#FFF; }
.swiper-slide--dark .hkpm_btn span:after, .hkpm_btn--dark span:after{ 
    border-top-color: #FFF;
    border-right-color: #FFF;
}

.swiper-slide--dark ul li:before{ background: #FFF; }
.swiper-slide--dark ul.hkpm_line_list li{ border-bottom: 1px solid #FFF; }
.swiper-slide--dark blockquote{ border-left-color: #FFF; color: #FFF;}
.swiper-slide--dark .highlight, .swiper-slide--dark .hkpm_arr, .hkpm_ticket_info--gold .hkpm_arr{color: #FFF!important}
.swiper-slide--dark .hkpm_arr:after{ filter: brightness(0) invert();}
.swiper-slide--dark table{ border-color: #FFF;}

.swiper-slide--dark td.hkpm_table_header:first-child,
.swiper-slide--dark td.hkpm_table_header:last-child,
.swiper-slide--dark th.hkpm_table_header:first-child,
.swiper-slide--dark th.hkpm_table_header:last-child,
.swiper-slide--dark td.hkpm_table_header,
.swiper-slide--dark th.hkpm_table_header{
    color: #FFFFFF !important; 
    border-bottom-color: #5f5635 !important; 
}
.swiper-slide--dark .hkpm_table2 td,    
.swiper-slide--dark .hkpm_table2 th{
    color: #000;
}

.swiper-slide--dark .gold{ color: #FFF; }

@media screen and (max-width:1279px){ .hkpm_btn{ font-size: 16px; } } 
@media screen and (max-width:1023px){ .hkpm_btn{ font-size: 15px; } .hkpm_btn span{  padding: 10px 50px 10px 20px; } }
@media screen and (max-width:767px){  .hkpm_btn{ font-size: 14px; } }
/*--------------------------------------------------------------------------------*/
.hkpm_gt{
    position: relative; font-size: 16px; line-height: 1.5em;
    display: inline-block; padding: 0px 15px 0px 0px;
    text-decoration: none !important;
}
.hkpm_gt:hover{ color: #A28C57; }
.hkpm_gt:after{
    content: ""; display: block; box-sizing: border-box;
    position: absolute; top: calc(50% - 3px); right: 5px; width: 6px; height: 6px;
    border-top: 2px solid #A28C57;
    border-right: 2px solid #A28C57;
    transform: rotate(45deg) translateX(0px);
}
.hkpm_gt:hover:after{ right: 0px; }

@media screen and (max-width:1279px){ .hkpm_gt{ font-size: 15px; } } 
@media screen and (max-width:1023px){ .hkpm_gt{ font-size: 14px; } }
@media screen and (max-width:767px){  .hkpm_gt{ font-size: 14px; } }
/*--------------------------------------------------------------------------------*/
.hkpm_arr{ 
    position: relative; 
    display: inline-block;
    font-size: 19px; font-weight: bold;
    padding: 0px 30px 0px 0px; color: #A28C57 !important; 
    text-decoration: none !important;
}
.hkpm_arr.hkpm_arr_inline,.hkpm_arr.hkpm_arr_inline a{
    font-size: 1em;
    text-decoration: underline;
    font-weight: 500;
} 
.hkpm_arr:after{
    content: ""; display: block;
    position: absolute; width: 20px; height: 20px; top:calc(50% - 10px); right: 5px;
    background-image: url(../img/svg/arr-sml.svg);
    background-position: center center;
    
    background-repeat: no-repeat; 
}
.hkpm_arr:hover:after{ right: -5px; }
.hkpm_arr.hkpm_arr--reverse{  padding: 0px 0px 0px 30px; }
.hkpm_arr.hkpm_arr--reverse:after{ right: auto; left: 5px; transform: rotate(180deg); }
.hkpm_arr.hkpm_arr--reverse:hover:after{ right: auto; left: 0px; }

.hkpm_arr.hkpm_arr--download:after{
    background-image: url(../img/download.png);
    background-size: 15px; width: 15px; height: 15px;
    top:calc(50% - 7px);
}
.hkpm_arr.hkpm_arr--download:hover:after{ right: 5px; }
/*--------------------------------------------------------------------------------*/
.hkpm_arrbox{
    display: block; position: relative;
    font-size: 19px; border:1px solid #D7D7D7;
    padding: 20px 60px 20px 20px; margin: 0px 0px 20px 0px;
}
.hkpm_arrbox:after{
    content: ""; display: block;
    position: absolute; width: 20px; height: 20px; top:calc(50% - 10px); right: 20px;
    background-image: url(../img/svg/arr-sml.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 20px;
}
.hkpm_arrbox:hover{ background-color: #A28C57; color: #FFF; }
.hkpm_arrbox:hover:after{ filter: brightness(0) invert(1);}

@media screen and (max-width:1279px){ .hkpm_arr, .hkpm_arrbox{ font-size: 15px; } } 
@media screen and (max-width:1023px){ .hkpm_arr, .hkpm_arrbox{ font-size: 14px; } }
@media screen and (max-width:767px){  .hkpm_arr, .hkpm_arrbox{ font-size: 14px; } }
/*--------------------------------------------------------------------------------*/
.hkpm_download{
    display: flex; align-items: center; justify-content: space-between;
    padding: 20px 0px; border-bottom: 1px solid #A28C57;
}
.hkpm_download span:last-child{ font-weight: bold; color: #5F5635; white-space: nowrap; }
.hkpm_download span:last-child:after{
    content: ""; display: inline-block; vertical-align: middle;
    width: 15px; height: 15px; margin: 0px 0px 0px 10px;
    background-image: url(../img/download.png);
    background-position: center center;
    background-size: 15px;
    background-repeat: no-repeat;
}
.hkpm_download_list{ display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap; }
.hkpm_download_list .hkpm_download{
    width: calc(50% - 20px); margin: 0px; 
}
.hkpm_download_list .hkpm_download:nth-of-type(odd){ margin: 0px 40px 0px 0px; }

.hkpm_download.arrow span:last-child:after{
    background-image: url(../img/arr_r.png);
}
.hkpm_download.noicon span:last-child:after{
    display: none;
}
@media screen and (max-width:1023px){
    .hkpm_download_list .hkpm_download{ width: 100%; }
    .hkpm_download_list .hkpm_download:nth-of-type(odd){ margin: 0px 0px 0px 0px; }
 }
/*--------------------------------------------------------------------------------*/
.hkpm_action{
    display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap;
}
.hkpm_action > *{
    padding-left: 20px; margin-right: 20px; margin-bottom: 10px;
    border-left: 1px solid #A28C57;
}
.hkpm_action > :first-child{ padding-left: 0px !important; border:none; }

@media screen and (max-width:1279px){ .hkpm_action .hkpm_arr{ padding-left: 15px; margin-right: 15px; } } 
@media screen and (max-width:1023px){ .hkpm_action .hkpm_arr{ padding-left: 15px; margin-right: 15px; } } 
@media screen and (max-width:767px){  .hkpm_action .hkpm_arr{ padding-left: 10px; margin-right: 10px; } } 
/*--------------------------------------------------------------------------------*/
.hkpm_label{ 
    position: relative;    
    font-size: 20px; line-height: 1.5em; text-align: left; 
    padding-left: 30px; margin: 5px 0px;
}
.hkpm_label:before{
    content: ""; display: block; box-sizing: border-box;
    position: absolute; top: calc(50% - 10px); left: 0px;
    width: 20px; height: 20px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;    
}
.hkpm_label--pt:before    { background-image: url(../img/pt.png); height: 23px; width: 21px; }
.hkpm_label--cal:before   { background-image: url(../img/svg/icon-cal.svg); }
.hkpm_label--time:before  { background-image: url(../img/svg/icon-clock.svg); }
.hkpm_label--ticket:before{ background-image: url(../img/svg/icon-ticket.svg); }
.hkpm_label--cat:before{ background-image: url(../img/category.png); }
.hkpm_label--edit:before{ background-image: url(../img/edit.png); }
.hkpm_label--none         { padding-left: 0px; }

.hkpm_label_list{
    display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
}
.hkpm_label_list .hkpm_label{ 
    padding-right: 20px; margin-right: 20px; 
    border-right: 1px solid #A28C57; font-size: 14px;
}
.hkpm_label_list .hkpm_label:before{ width: 16px; height: 16px; top:calc(50% - 8px); }
.hkpm_label_list .hkpm_label:last-child{  border:none; }

.hkpm_label_list .hkpm_label_tag{
    display: inline-block; 
    background: #A28C57; color: #FFF; 
    font-weight: bold; font-size: 19px;
    padding: 5px 10px; border-radius: 10px; margin-right: 20px;
}
.hkpm_label_list .hkpm_label_title{
    display: inline-block; 
    font-weight: bold; font-size: 16px;
    padding-right: 20px; margin-right: 20px;
    border-right: 1px solid #A28C57;    
}
.hkpm_inner_page .hkpm_label_list  .hkpm_label{ font-size: 19px; }

@media screen and (max-width:1279px){ 
    .hkpm_label_list .hkpm_label_tag,
    .hkpm_label{ font-size: 18px; } 
} 
@media screen and (max-width:1023px){ 
    .hkpm_label_list .hkpm_label_tag, 
    .hkpm_label{ font-size: 16px; } 
}
@media screen and (max-width:767px){  
    .hkpm_label_list .hkpm_label_tag,
    .hkpm_label{ font-size: 15px; } 

    .hkpm_label_list { justify-content: center; }
    .hkpm_label_list .hkpm_label--cal{ border: none; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_row{ display: flex; align-items: center; justify-content: flex-start; }
.hkpm_row.align-items-top{ align-items: flex-start; }

.hkpm_row > .sep{ width: 20px; align-self: stretch; }
.hkpm_row > .sep:before{ 
    content: ""; display: block;
    width: 1px; height: 100%; width: 1px; margin: 0px auto;
    background: #D7D7D7;
}
.hkpm_row .hkpm_col li a{ text-decoration: underline; }

.hkpm_row--hour{ padding: 20px 0px 0px 0px; }
.hkpm_row--hour > .hkpm_col{ width: calc(50% - 40px); }
.hkpm_row--hour > .sep{ width: 80px; }

.hkpm_row--subhour{ justify-content: space-between; }
.hkpm_row--subhour .hkpm_row{ align-items: flex-start;}
.hkpm_row--subhour > .hkpm_col:first-of-type{ padding-right: 40px; width: 65%; }
.hkpm_row--subhour > .hkpm_col:last-of-type{ width: 35%; }
.hkpm_row--subhour > .hkpm_col .hkpm_col { width: auto; }
.hkpm_row--subhour .hkpm_label{ font-size: 16px; }
.hkpm_row--subhour .hkpm_gt{ white-space: nowrap;}

.hkpm_row--2col--sep{ margin: 60px 0px; }
.hkpm_row--2col--sep .hkpm_col:first-of-type{ width: 50%; padding: 60px 80px 60px 0px; border-right: 1px solid #A28C57; }
.hkpm_row--2col--sep .hkpm_col:last-of-type { width: 50%; padding: 60px 0px 60px 80px; border-right: none; }
.hkpm_row--2col--sep .hkpm_col > *{ max-width: 450px; }
.hkpm_bg_grey .hkpm_row--2col--sep{ margin-top: 0px !important; }

.hkpm_row--2col{ margin: 60px 0px; align-items: flex-start; flex-wrap: wrap; }
.hkpm_row--2col img{ width: 100%; height: auto;}
.hkpm_row--2col .hkpm_col:nth-of-type(odd){ width: 50%; padding: 0px 40px 0px 0px; }
.hkpm_row--2col .hkpm_col:nth-of-type(even){ width: 50%; padding: 0px 0px 0px 40px; }
@media screen and (min-width: 1024px) {
    .hkpm_row--2col-sml .hkpm_col:nth-of-type(odd){ padding: 0px 60px 0px 0px; }
    .hkpm_row--2col-sml .hkpm_col:nth-of-type(even){ padding: 0px 0px 0px 60px; }
}
@media screen and (min-width: 1280px) {
    .hkpm_row--2col-sml .hkpm_col:nth-of-type(odd){ padding: 0px 90px 0px 0px; }
    .hkpm_row--2col-sml .hkpm_col:nth-of-type(even){ padding: 0px 0px 0px 90px; }
}

.hkpm_row--3col{ margin: 60px 0px; align-items: flex-start; width: calc(100% + 40px); flex-wrap: wrap; }
.hkpm_row--3col img{ width: 100%; height: auto; }
.hkpm_row--3col .hkpm_col{ width: calc(33.33% - 40px); margin: 0px 40px 0px 0px; }

.hkpm_img_block{ margin-bottom: 80px; }
.hkpm_img_block h3,
.hkpm_img_block p{ margin: 0px 0px 10px 0px !important;}
.hkpm_img_block img{ display: block; width: 100%; height: auto; margin-bottom: 20px;}
.hkpm_img_block.mg-0 {margin: 0 !important}

.hkpm_row--2col .hkpm_col:last-of-type .hkpm_img_block{ margin-top: 80px; margin-bottom: 0px; }

.hkpm_row--contact{ align-items: stretch; }
.hkpm_row--contact .hkpm_row{ align-items: flex-start; }
.hkpm_row--contact > .hkpm_col:first-of-type{ width: 33.33%; padding: 20px 80px 20px 0px; border-right: 1px solid #A28C57; }
.hkpm_row--contact > .hkpm_col:last-of-type { width: 66.66%; padding: 20px 0px 20px 80px; }
.hkpm_row--contact > .hkpm_col .hkpm_col    { width: 50%; padding-right: 40px; }

.hkpm_row--subscribe{ justify-content: space-between; }
.hkpm_row--subscribe .hkpm_col{ width: calc(50% - 40px); }

@media screen and (max-width:1439px){
    .hkpm_row--subhour{ flex-wrap: wrap; }
    .hkpm_row--subhour > .hkpm_col{ width: 100% !important; }
    .hkpm_row--subhour > .hkpm_col:first-of-type{ padding-bottom: 20px; }
}
@media screen and (max-width:1279px){
    .hkpm_row--contact > .hkpm_col:first-of-type{ width: 40%; padding: 20px 40px 20px 0px; }
    .hkpm_row--contact > .hkpm_col:last-of-type { width: 60%; padding: 20px 0px 20px 40px; }
    
    .hkpm_row--3col{ width: calc(100% + 20px);  }
    .hkpm_row--3col .hkpm_col{ width: calc(33.33% - 20px);  margin: 0px 20px 0px 0px; }
}
@media screen and (max-width:1023px){
    .hkpm_row--hour > .hkpm_col:first-of-type{ width: calc(60% - 20px); }
    .hkpm_row--hour > .hkpm_col:last-of-type{ width: calc(40% - 20px); }
    .hkpm_row--hour > .sep{ width: 40px; }

    .hkpm_row--2col--sep .hkpm_col:first-of-type{ padding: 40px 40px 40px 0px; }
    .hkpm_row--2col--sep .hkpm_col:last-of-type { padding: 40px 0px 40px 40px; }

    .hkpm_row--2col .hkpm_col:nth-of-type(odd){ padding: 0px 20px 0px 0px; }
    .hkpm_row--2col .hkpm_col:nth-of-type(even){ padding: 0px 0px 0px 20px; }

    .hkpm_row--3col .hkpm_col{ width: calc(50% - 20px);  margin: 0px 20px 0px 0px; }

    .hkpm_row--contact { flex-wrap: wrap; }
    .hkpm_row--contact > .hkpm_col:first-of-type{ width: 100%; padding: 0px; border: none; border-bottom: 1px solid #D7D7D7; }
    .hkpm_row--contact > .hkpm_col:last-of-type { width: 100%; padding: 0px; }

    .hkpm_row--subscribe .hkpm_col{ width: calc(50% - 20px); }
}
@media screen and (max-width:767px){   
    .hkpm_row--hour{ flex-wrap: wrap; }
    .hkpm_row--hour > .hkpm_col{ width: 100% !important;; }
    .hkpm_row--hour > .hkpm_col:first-of-type{ padding-bottom: 20px; }

    .hkpm_row--subhour > .hkpm_col{ padding-right: 0px !important; }
    .hkpm_row--subhour > .hkpm_col:last-of-type{ display: flex; align-items: center; justify-content: space-between; }
    .hkpm_row--subhour > .hkpm_col .hkpm_label{ width: calc(50% - 10px); }    
    .hkpm_row--subhour .hkpm_label{ font-size: 14px; }

    .hkpm_row--2col--sep{ margin: 50px 0px; display: block; }
    .hkpm_row--2col--sep .hkpm_col:first-of-type{ width: 100%; padding: 0px; margin: 40px 0px; border:none; }    
    .hkpm_row--2col--sep .hkpm_col:last-of-type{  width: 100%; padding: 0px; margin: 40px 0px; }
    
    .hkpm_row--2col{ margin: 40px 0px; display: block; }
    .hkpm_row--2col .hkpm_col:nth-of-type(odd){ width: 100%; padding: 0px; margin: 20px 0px; }    
    .hkpm_row--2col .hkpm_col:nth-of-type(even){  width: 100%; padding: 0px; margin: 20px 0px; }
    .hkpm_row--2col .hkpm_col .hkpm_download{ padding-top: 0px;}
    
    .hkpm_row--3col{ width: calc(100% + 0px);  }
    .hkpm_row--3col .hkpm_col{ width: calc(100% - 0px); margin: 0px 0px 0px 0px; }

    .hkpm_img_block{ margin-bottom: 40px; }
    .hkpm_row--2col .hkpm_col:last-of-type .hkpm_img_block{ margin-top: 40px; }

    .hkpm_row--subscribe{  display: block; }
    .hkpm_row--subscribe .hkpm_col{ width: 100%; margin: 40px 0px; }
}
@media screen and (max-width:479px){   
    .hkpm_row--contact > .hkpm_col .hkpm_row{ display: block; }
    .hkpm_row--contact > .hkpm_col .hkpm_col{ width: 100%; }
    .hkpm_row--subhour  .hkpm_col .hkpm_col{ width:  calc(50% - 20px); }
}
/*================================================================================*/
/*HEAD*/
/*================================================================================*/
.hkpm_head_site_title{ 

    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
 }
/*--------------------------------------------------------------------------------*/
.hkpm_menu{
    position: fixed; z-index: 99;
    top:0px; left: 0px; width: 100%; 
    background: rgba(255,255,255,0);
    transition: ease all 0.3s;    
    /*animation: top_menu 1s ease-in-out;*/
}
.hkpm_menu.notice{ top: 77px; }
.hkpm_menu .hkpm_main{
    display: flex; align-items: center; justify-content: flex-start;
    max-width: 1600px;
}
@keyframes top_menu {
    0%  { top: -120px; }        
    100%{ top: 0px; }    
}
/*--------------------------------------------------------------------------------*/
.hkpm_menu .hkpm_main .hkpm_menu_logo{ width: 130px; height: 100px; overflow: visible; transition: ease all 0.3s; }
.hkpm_menu .hkpm_main .hkpm_menu_logo img{ display: block; height: 100%; width: auto; transition: ease all 0.3s; object-position: top; object-fit: contain;}
.hkpm_menu .hkpm_main .hkpm_menu_logo span{ display: none; }
.hkpm_menu .hkpm_main .hkpm_menu_logo .logo_float{ display: none; height: 45px; width: auto; }
.hkpm_menu .hkpm_main .hkpm_menu_logo .logo--dark{ display: none; }
/*--------------------------------------------------------------------------------*/
.hkpm_menu .hkpm_main .hkpm_menu_main{
    flex:1;
    display: flex; align-items: center; justify-content: center;
}
.hkpm_menu .hkpm_main .hkpm_menu_main .hkpm_menu_item{
    position: relative; margin: 0px 10px; 
}
.hkpm_menu .hkpm_main .hkpm_menu_main .hkpm_menu_item > a{
    position: relative; display: block;
    font-size: 15px; line-height: 2em; font-weight: 500; text-decoration: none;
    text-transform: uppercase; letter-spacing: 1px;
    color: #000; 
}
.hkpm_menu .hkpm_main .hkpm_menu_main .hkpm_menu_item > a:hover{ color: #000; }
.hkpm_menu .hkpm_main .hkpm_menu_main .hkpm_menu_item > a:after{
    content: ""; display: block;
    bottom:0px; left: 0px; width: 1%; height: 2px;
    background: #A28C57; opacity: 0;
}
.hkpm_menu .hkpm_main .hkpm_menu_main .hkpm_menu_item.active > a:after,
.hkpm_menu .hkpm_main .hkpm_menu_main .hkpm_menu_item:hover > a:after{ width: 100%; opacity: 1; }

.hkpm_menu .hkpm_main .hkpm_menu_main .hkpm_menu_item .hkpm_menu_dropdown{ display: none; }
/*.hkpm_menu .hkpm_main .hkpm_menu_main .hkpm_menu_item:hover .hkpm_menu_dropdown,*/
.hkpm_menu .hkpm_main .hkpm_menu_main .hkpm_menu_item.show .hkpm_menu_dropdown,
.hkpm_menu .hkpm_main .hkpm_menu_main .hkpm_menu_item:focus-within .hkpm_menu_dropdown{
    display: block;
    position: absolute; top:100%; left: 0px; 
    min-width: 240px; padding: 30px 30px;
    background: #F6F6F6; border: 1px solid #F6F6F6;
}
.hkpm_menu .hkpm_main .hkpm_menu_main .hkpm_menu_item .hkpm_menu_dropdown a{
    display: block; padding: 0px 0px 15px 0px;
    color: #000;
}
.hkpm_menu .hkpm_main .hkpm_menu_main .hkpm_menu_item .hkpm_menu_dropdown a:hover{ color: #5F5635; }
.hkpm_menu .hkpm_main .hkpm_menu_main .hkpm_menu_item .hkpm_menu_dropdown a:last-of-type{ padding-bottom: 0px; }
/*--------------------------------------------------------------------------------*/
.hkpm_menu .hkpm_main .hkpm_menu_side{ 
    width: 250px; 
    display: flex; align-items: center; justify-content: flex-end;
}
.hkpm_menu .hkpm_main .hkpm_menu_side a{
    font-size: 14px; text-decoration: none; white-space: nowrap;
    color: #000; margin: 0px 7px;
}
.hkpm_menu .hkpm_main .hkpm_menu_side .lang{ opacity: 0.6; }
.hkpm_menu .hkpm_main .hkpm_menu_side .lang.active{ opacity: 1; }
.hkpm_menu .hkpm_main .hkpm_menu_side .lang:hover{ color: #A28C57; }

.hkpm_menu .hkpm_main .hkpm_menu_side .sep{
    display: block; height: 15px; width: 1px; margin: 0px 7px;
    background: #D7D7D7;
}
.hkpm_menu .hkpm_main .hkpm_menu_side .ticket{ margin: 0px 10px; color: #000; display: flex; align-items: center; justify-content: flex-start; }
.hkpm_menu .hkpm_main .hkpm_menu_side .ticket span{ display: none;}
.hkpm_menu .hkpm_main .hkpm_menu_side .ticket:hover{ color: #A28C57; }
.hkpm_menu .hkpm_main .hkpm_menu_side .ticket:before{
    content: ""; display: block;
    width: 20px; height: 20px; 
    background-image: url(../img/svg/shopping-cart-black.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    margin-right: 5px; margin-top: 1px;
}
.hkpm_menu .hkpm_main .hkpm_menu_side .search{display: none; margin-left: 10px; margin-right: 10px; }
.hkpm_menu .hkpm_main .hkpm_menu_side .search span{ display: none; }
.hkpm_menu .hkpm_main .hkpm_menu_side .search:before{
    content: ""; display: block;
    width: 20px; height: 20px; 
    background-image: url(../img/svg/icon-search-d.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
}
.hkpm_menu .hkpm_main .hkpm_menu_side .ticket.hasitems{ position: relative; }
.hkpm_menu .hkpm_main .hkpm_menu_side .ticket.hasitems:after{
    content: ""; display: block;
    width: 12px; height: 12px; 
    position: absolute; top:0px; left: 10px;
    background: #C66; border-radius: 50%;
}
/*--------------------------------------------------------------------------------*/
.hkpm_menu.dark:not(.floating,.open) .hkpm_main .hkpm_menu_main .hkpm_menu_item > a{ color: #FFF; }
.hkpm_menu.dark:not(.floating,.open) .hkpm_main .hkpm_menu_main .hkpm_menu_item > a:hover{ color: #FFF; }

.hkpm_menu.dark:not(.floating,.open) .hkpm_main .hkpm_menu_side a{ color: #FFF; }
.hkpm_menu.dark:not(.floating,.open) .hkpm_main .hkpm_menu_side a:hover{ color: #5F5635; }
.hkpm_menu.dark:not(.floating,.open) .hkpm_main .hkpm_menu_side .ticket:before,
.hkpm_menu.dark:not(.floating,.open) .hkpm_main .hkpm_menu_side .search:before{
    filter: brightness(0) invert(1);
}
/*--------------------------------------------------------------------------------*/
.hkpm_menu.floating, .hkpm_menu.open{ 
    background: #FFF;
    border-bottom: 1px solid #D7D7D7;
}
.floating .hkpm_main .hkpm_menu_logo,
.open .hkpm_main .hkpm_menu_logo{ height: 60px; }

.floating .hkpm_main .hkpm_menu_logo .logo,
.open .hkpm_main .hkpm_menu_logo .logo{  height: 55px; }

.hkpm_menu.dark .hkpm_main .hkpm_menu_logo .logo--light{ display: none; } 
.hkpm_menu.dark .hkpm_main .hkpm_menu_logo .logo--dark{ display: block; } 

.hkpm_menu.dark.open .hkpm_main .hkpm_menu_logo .logo--light{ display: block; } 
.hkpm_menu.dark.open .hkpm_main .hkpm_menu_logo .logo--dark{ display: none; } 
.hkpm_menu.dark.floating .hkpm_main .hkpm_menu_logo .logo--light{ display: block; } 
.hkpm_menu.dark.floating .hkpm_main .hkpm_menu_logo .logo--dark{ display: none; } 

/*
.floating .hkpm_main .hkpm_menu_logo .logo,
.open .hkpm_main .hkpm_menu_logo .logo{ display: none; }

.floating .hkpm_main .hkpm_menu_logo .logo_float,
.open .hkpm_main .hkpm_menu_logo .logo_float{ display: block; }
*/
/*--------------------------------------------------------------------------------*/
.hkpm_menu .hkpm_menu_profile{
    position: relative; line-height: 1.2em;
    display: flex; align-items: center; justify-content: flex-start;
    padding: 0px 5px 0px 5px; margin: 0px ;
    border-right: 1px solid #D7D7D7;
}
.hkpm_menu .hkpm_menu_profile:not(.js-menu_profile_unlogged) > a:after{    
    content: ""; display: block;
    position: absolute; top:calc(50% - 2px); right: 1px;
    width: 4px; height: 4px; 
    border-bottom: 1px solid #000;
    border-right: 1px solid #000;
    transform: rotate(45deg);
}
.hkpm_menu.dark:not(.floating) .hkpm_menu_profile:not(.js-menu_profile_unlogged) > a:after{  
    border-bottom: 1px solid #FFF;
    border-right: 1px solid #FFF;  
}

.hkpm_menu .hkpm_menu_profile > a{ 
    display: block; position: relative; 
    max-width: 100px; overflow: hidden;
    white-space: nowrap; text-overflow: ellipsis;
}
.hkpm_menu .hkpm_menu_profile:not(.js-menu_profile_unlogged) > a{
    padding-right: 10px;
}

.hkpm_menu .hkpm_menu_profile .hkpm_menu_profile_dropdown{
    display: none;
    position: absolute; 
    top:100%; left: 0px; min-width: auto; height: auto;    
    padding: 10px 0px 0px 0px;
}
.hkpm_menu .hkpm_menu_profile .hkpm_menu_profile_dropdown a{
    display: block; position: relative;
    padding: 0px 30px 15px 30px; margin: 0px;
    background: #F6F6F6; color: #000 !important;
    /*border-bottom: 1px solid #CCC;*/ opacity: 1 !important;
}
.hkpm_menu .hkpm_menu_profile .hkpm_menu_profile_dropdown a:first-of-type{ padding-top: 30px;}
.hkpm_menu .hkpm_menu_profile .hkpm_menu_profile_dropdown a:last-of-type{ padding-bottom: 30px;}
.hkpm_menu .hkpm_menu_profile .hkpm_menu_profile_dropdown a:hover{ color: #5F5635 !important; }


.hkpm_menu .hkpm_menu_profile .hkpm_menu_profile_dropdown a:last-of-type{
    border: none;
}
.hkpm_menu .hkpm_menu_profile:focus-within .hkpm_menu_profile_dropdown,
.hkpm_menu .hkpm_menu_profile.show .hkpm_menu_profile_dropdown{
    display: block;
}
.hkpm_menu .hkpm_menu_profile.disable { display: none !important;}
/*================================================================================*/
/*MOBILE MENU*/
/*================================================================================*/
.hkpm_menu .hkpm_main .hkpm_menu_side .mobile{ display: none; }

@media screen and (max-width:1399px){
    .hkpm_menu .hkpm_main .hkpm_menu_logo{ width: auto; flex: 1;  min-width: 80px}
    .hkpm_menu .hkpm_main .hkpm_menu_side{ width: auto; }
    .hkpm_menu .hkpm_main .hkpm_menu_main{ display: none; }

    .hkpm_menu .hkpm_main .hkpm_menu_side .lang,
    .hkpm_menu .hkpm_main .hkpm_menu_side .sep{ display: none; }
    .hkpm_menu .hkpm_main .hkpm_menu_side .ticket span{ display: none; }

    .hkpm_menu .hkpm_main .hkpm_menu_side .ticket:before{ 
        background-image: url(../img/svg/icon-ticket.svg);
        margin: 0px; width: 26px; height: 20px; 
    }    

    .hkpm_menu .hkpm_main .hkpm_menu_side .search:before{ 
        background-image: url(../img/svg/icon-search.svg);
        margin: 0px; width: 20px; height: 20px; 
    }
    .hkpm_menu .hkpm_main .hkpm_menu_side .ticket{ display: block; margin: 0px 0px 0px 20px; }
    .hkpm_menu .hkpm_main .hkpm_menu_side .search{ display: none; }

    .hkpm_menu .hkpm_main .hkpm_menu_logo{ height: 100px; }
    .floating .hkpm_main .hkpm_menu_logo,
    .open .hkpm_main .hkpm_menu_logo{ height: 60px; }

    .hkpm_menu .hkpm_main .hkpm_menu_logo .logo{  height: 80px; width: auto; }
    .hkpm_menu .hkpm_main .hkpm_menu_logo .logo_float{ height: 45px; width: auto; }
    
    .floating .hkpm_main .hkpm_menu_logo .logo,
    .open .hkpm_main .hkpm_menu_logo .logo{  height: 45px; }

    .hkpm_menu .hkpm_main .hkpm_menu_side .mobile{ 
        position: relative; margin: 0px 0px 0px 0px;
        display: block; width: 32px; height: 14px; 
    }
    .hkpm_menu.open .hkpm_main .hkpm_menu_side .mobile{  margin-left: 10px; }

    .hkpm_menu .hkpm_main .hkpm_menu_side .mobile span{ display: none; }
    .hkpm_menu .hkpm_main .hkpm_menu_side .mobile span.bar{
        display: block; overflow: hidden;
        position: absolute; top: calc(50% - 1px); left: 0px; width: 28px; height: 2px; 
        color: rgba(255,255,255,0); background: #000;        
    }
    .hkpm_menu .hkpm_main .hkpm_menu_side .mobile:before,
    .hkpm_menu .hkpm_main .hkpm_menu_side .mobile:after{
        content: ""; display: block; width: 32px; height: 2px;
        position: absolute;  background: #000;
    }
    .hkpm_menu .hkpm_main .hkpm_menu_side .mobile:before{ top: 0px; left: 0px; }
    .hkpm_menu .hkpm_main .hkpm_menu_side .mobile:after{ bottom: 0px; width: 24px; }

    .hkpm_menu.dark:not(.floating,.open) .hkpm_main .hkpm_menu_side .mobile{ filter: invert(1); }

    .hkpm_menu .hkpm_main .hkpm_menu_side .mobile.active:before{ 
        transform: rotate(45deg); transform-origin: 0% 50%;  left: 7px; width: 26px; top:-3px;
    }    
    .hkpm_menu .hkpm_main .hkpm_menu_side .mobile.active:after{
        transform: rotate(-45deg); transform-origin: 0% 50%; left: 7px; width: 26px; bottom:-3px;
    }
    .hkpm_menu .hkpm_main .hkpm_menu_side .mobile.active .bar{ opacity: 0; }

    .hkpm_menu.open .hkpm_main .ticket,
    .hkpm_menu.open .hkpm_main .search{ display: none; }
    .hkpm_menu.open .hkpm_main .lang{ display: block; }

    .hkpm_menu .hkpm_main .hkpm_menu_side .ticket.hasitems:after{ left: 16px; }

    .hkpm_menu:not(.open) .hkpm_main .hkpm_menu_profile{ display: none;}
    .hkpm_menu .hkpm_main .hkpm_menu_profile .hkpm_menu_profile_dropdown{ display: none !important;}

    .hkpm_menu .hkpm_main .hkpm_menu_profile{ height: 60px; border: none; }
    .hkpm_menu .hkpm_main .hkpm_menu_profile.show{ background: #F6F6F6;}
}
/*--------------------------------------------------------------------------------*/
.hkpm_mobile_menu{
    position: fixed; z-index: 98; display: none;
    top:0px; left: -100%; width: 100%; height: 100%; overflow: scroll;
    background: rgba(255,255,255,0.7); padding: 0px; 
    font-size: 14px; transition: ease left 0.3s;    
} 
.hkpm_mobile_menu.notice{ top: 77px; }
.hkpm_mobile_menu.show{   left: 0%; display: block; }

.hkpm_mobile_menu .hkpm_mobile_menu_main{ 
    padding: 60px 0px 20px 0px; 
    background: #FFF; border-bottom: 1px solid #D7D7D7;
}

.hkpm_mobile_menu .hkpm_mobile_menu_main .hkpm_mobile_menu_s1{ 
    display: none; padding: 0px 0px;
    background: #F6F6F6;
}
.hkpm_mobile_menu .hkpm_mobile_menu_main .hkpm_mobile_menu_s1.show{ display: block;}
.hkpm_mobile_menu .hkpm_mobile_menu_main .hkpm_mobile_menu_s1 a{
    display: block; position: relative;
    padding: 15px 20px;
    border-bottom: 1px solid #D7D7D7;
}
.hkpm_mobile_menu .hkpm_mobile_menu_main .hkpm_mobile_menu_s1 a::after{
    content: ""; display: block;
    position: absolute; top:calc(50% - 4px); right: 24px;
    width: 8px; height: 8px;
    border-top: 1px solid #53504e;
    border-right: 1px solid #53504e;
    transform: rotate(45deg);
}
.hkpm_mobile_menu .hkpm_mobile_menu_main .hkpm_mobile_menu_s2{  padding: 20px 20px 20px 20px; }

.hkpm_mobile_menu .hkpm_menu_item{   
    position: relative;
    display: block; padding: 10px 30px 10px 0px; border-bottom:1px solid #D7D7D7;    
}
.hkpm_mobile_menu .hkpm_menu_item:last-of-type{ border:none; }
.hkpm_mobile_menu .hkpm_menu_item > a{ 
    font-size: 20px; text-transform: uppercase;
    color: #000; font-family: 500;
}
.hkpm_mobile_menu .hkpm_menu_item .hkpm_menu_item_more{
    position: absolute; top: 10px; right: 0px;
    width: 20px; height: 20px; 
    display: flex; align-items: center; justify-content: center; 
}
.hkpm_mobile_menu .hkpm_menu_item .hkpm_menu_item_more span{ display: none; }
.hkpm_mobile_menu .hkpm_menu_item .hkpm_menu_item_more:before{
    content: ""; display: block;
    width: 8px; height: 8px;
    border-top: 1px solid #A28C57;
    border-right: 1px solid #A28C57;
    transform: rotate(45deg);
}
.hkpm_mobile_menu .hkpm_menu_item.open .hkpm_menu_item_more:before{
    transform: rotate(135deg); margin-bottom: 4px;
}
.hkpm_mobile_menu .hkpm_menu_item.open > a{
    color: #A28C57;
}
.hkpm_mobile_menu .hkpm_menu_dropdown{
    display: none; padding: 10px 0px 0px 0px;
}
.hkpm_mobile_menu .hkpm_menu_dropdown a{
    display: block; padding: 0px 0px 10px 0px;
    font-size: 16px; text-transform: none;
    color: #000; 
}
.hkpm_mobile_menu .hkpm_menu_lang{
    padding: 20px 20px; 
    background: #FFF; border-bottom: 1px solid #D7D7D7;
    display: none; align-items: center; justify-content: center;
}
.hkpm_mobile_menu .hkpm_menu_lang .lang{ opacity: 0.6; margin: 0px 10px; display: block; }
.hkpm_mobile_menu .hkpm_menu_lang .lang.active{ opacity: 1; color: #A28C57; }

@media screen and (min-width:1280px){ .hkpm_mobile_menu{ display: none; } } 

/*--------------------------------------------------------------------------------*/
.hkpm_mobile_menu .hkpm_mobile_menu_main{ border-bottom:none; }
.hkpm_mobile_foot{ background: #FFF; padding-bottom: 60px;}
.hkpm_mobile_foot_img{ width: auto; max-width: 100%; height: auto; display: block; margin: 0px 20px; }

.hkpm_mobile_foot_body{ padding: 0px 20px; }
.hkpm_mobile_foot_body h3{ font-weight: 500; margin-bottom: 5px; }
.hkpm_mobile_foot_body .hkpm_row{ align-items:  stretch; }
.hkpm_mobile_foot_body .hkpm_col{ width: calc(50% - 10px); }
.hkpm_mobile_foot_body .hkpm_col.sep{ width: 20px;}
.hkpm_mobile_foot_body .hkpm_col p{ margin: 0px; }
.hkpm_mobile_foot_body .hkpm_col,
.hkpm_mobile_foot_body .hkpm_label,
.hkpm_mobile_foot_body .hkpm_gt { font-size: 14px; }

.hkpm_mobile_foot_link{ 
    margin: 40px 0px 0px 0px; padding: 40px 20px;  
    border-top: 1px solid #D7D7D7; 
    display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap;
} 
.hkpm_mobile_foot_link a{
    width: calc(50% - 20px); margin: 0px 20px 10px 0px;
}
.hkpm_mobile_extra_link{ 
    margin: -20px 0px 0px 0px; padding: 20px 20px;  
    border-top: 1px solid #D7D7D7; background: #F6F6F6;
    display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap;
} 
.hkpm_mobile_extra_link a{
    width: calc(100% - 20px); margin: 0px 20px 10px 0px;
}

.hkpm_mobile_foot_sns{ display: flex; align-items: center; justify-content: flex-start; }
.hkpm_mobile_foot_sns a{ margin: 0px 20px 0px 0px; filter: grayscale(1); opacity: 1; flex-shrink: 0;}
.hkpm_mobile_foot_sns a img{
    height: 30px; width: 30px; 
    object-fit: contain; object-position: center center;
}
.hkpm_mobile_foot_sns a:hover{ filter: grayscale(0); opacity: 1; } 
.hkpm_mobile_foot_icon {
    margin-top: 40px;
}
.hkpm_mobile_foot_copy{ font-size: 10px; margin-top: 40px; }
.hkpm_mobile_foot_copy span{display: inline-block;}

@media screen and (max-width:479px){ 
    .hkpm_mobile_foot_img{ margin: 0px; max-width: 100%;} 
} 
/*================================================================================*/
/*BANNER*/
/*================================================================================*/
.hkpm_banner{ position: relative; }
.hkpm_event_exhib_banner{ position: relative; }
.hkpm_banner .swiper-slide{ overflow: hidden; }
.notice .hkpm_banner{ margin-top: 60px;}
 
.hkpm_banner .hkpm_banner_slide{
    display: flex; align-items: center; justify-content: space-between;
    height: 100vh; max-height: 840px; position: relative; 
}
.hkpm_banner .hkpm_banner_slide .hkpm_banner_text{ 
    width: 50%;     
    animation: banner_text 1s ease-in-out;
}
.hkpm_banner .hkpm_banner_slide .hkpm_banner_text p{ 
    margin: 20px 0px;
}
.hkpm_banner .hkpm_banner_slide .hkpm_btn{ 
    margin: 0px 10px 10px 0px;
}
.hkpm_banner .hkpm_banner_slide .hkpm_banner_img { 
    width: 50%; padding: 0px 40px; 
    animation: banner_img 1s ease-in-out;
}
@keyframes banner_text {
    0%  { opacity: 0; } 
    100%{ opacity: 1; } 
    /*
    0%  { transform: translateX(-50vw); } 
    100%{ transform: translateX(-0vw); } 
    */
}
@keyframes banner_img {
    0%  { transform: translateY(50vh) scale(1.2); } 
    100%{ transform: translateY(0vh)  scale(1); } 
}

.hkpm_banner .hkpm_banner_slide .hkpm_banner_img .media{ 
    position: relative; margin: 0px auto; width: 100%; max-width: 100%; max-height: calc(100vh - 200px); 
}
.hkpm_banner  .hkpm_banner_bg img:nth-child(2){ display: none; }
.hkpm_banner  .hkpm_banner_bg video:nth-child(2){ display: none; }
.hkpm_banner  .hkpm_banner_img .media:nth-child(2){ display: none; }
.hkpm_banner  .hkpm_banner_img .media video:nth-child(2){ display: none; } 


.hkpm_banner .hkpm_banner_slide .hkpm_banner_img .media:before{ 
    content: ""; display: block; padding-bottom: 100%; 
}
.hkpm_banner .hkpm_banner_slide .hkpm_banner_img .media img,
.hkpm_banner .hkpm_banner_slide .hkpm_banner_img .media video{
    position: absolute; 
    top:0px; left: 0px; width: 100%; height: 100%;
    object-fit: cover; object-position: center center;
}
.hkpm_banner .hkpm_banner_slide .hkpm_banner_img .media--rect{ max-width: 75%; }
.hkpm_banner .hkpm_banner_slide .hkpm_banner_img .media--rect:before{ padding-bottom: 140%; } 
.hkpm_banner .hkpm_banner_slide .hkpm_banner_img .media:not(.media--rect) img{ object-fit: contain; }

.hkpm_banner .swiper-slide--dark h2,
.hkpm_banner .swiper-slide--dark h2 strong{ color: #FFF; }

@media screen and (max-width:767px){
    .hkpm_banner  .hkpm_banner_bg img:nth-child(1){ display: none; }
    .hkpm_banner  .hkpm_banner_bg video:nth-child(1){ display: none; }
    .hkpm_banner  .hkpm_banner_img .media:nth-child(1){ display: none; }
    .hkpm_banner  .hkpm_banner_img .media video:nth-child(1){ display: none; }

    .hkpm_banner  .hkpm_banner_bg img:nth-child(2){ display: block; }
    .hkpm_banner  .hkpm_banner_bg video:nth-child(2){ display: block; }
    .hkpm_banner  .hkpm_banner_img .media:nth-child(2){ display: block; }
    .hkpm_banner  .hkpm_banner_img .media video:nth-child(2){ display: block; }

    .hkpm_banner .hkpm_banner_slide{ 
        flex-wrap: wrap; align-items: flex-start; padding: 0px; 
        height: 960px; min-height: 100vh; max-height: none; 
    }    
    .hkpm_banner .hkpm_banner_slide .hkpm_banner_text{ 
        width: 100%; height: auto; padding: 120px 20px 20px 20px; 
    }
    .hkpm_banner .hkpm_banner_slide .hkpm_banner_text.fullheight{
        display: block;
        height: 100%; padding: 20px;
        padding: 250px 20px 0px 20px;   
    }

    .hkpm_banner .hkpm_banner_slide .hkpm_banner_img { 
        width: 100%; height: auto; padding: 0px; 
        display: flex; align-items: center; justify-content: center;
    }
    .hkpm_banner .hkpm_banner_slide .hkpm_banner_img .media{ 
        max-height: 100%; height: 100%; 
        max-width: 100%; width: 100%; 
    }
}
@media screen and (max-width:479px){
    .hkpm_banner .hkpm_banner_slide{ 
         height: 800px; min-height: 100vh; max-height: none; 
    }
}
/*--------------------------------------------------------------------------------*/
.hkpm_banner .hkpm_banner_bg{
    position: absolute; top:0px; left: 0px; width: 100%; height: 100%;
}
.hkpm_banner .hkpm_banner_bg img,
.hkpm_banner .hkpm_banner_bg video{
    position: absolute; top:0px; left: 0px; width: 100%; height: 100%;
    object-fit: cover; object-position: center;    
}
.hkpm_banner .hkpm_banner_bg:after{
    content: ""; display: block;
    position: absolute; top:0px; left: 0px; width: 100%; height: 100%;
    /* background: rgba(0,0,0,0.3); */
}
/*--------------------------------------------------------------------------------*/
.hkpm_banner .hkpm_banner_nav{
    pointer-events: none; 
    position: absolute;  z-index: 97;
    bottom:0px; left: 0px; width: 100%; text-align: right;
    padding: 0px 60px 40px 0px;
}

.hkpm_event_exhib_banner .hkpm_event_exhib_nav{
    pointer-events: none; 
    position: absolute;  z-index: 97;
    bottom:0px; left: 0px; width: 100%; text-align: right;
    padding: 0px 60px 40px 0px;
}

.hkpm_banner .hkpm_banner_nav .swiper-pagination-bullet-active{ background: #A28C57; }
.hkpm_banner.dark .hkpm_banner_nav .swiper-pagination-bullet{ background: #FFF; }
.hkpm_banner.dark .hkpm_banner_nav .swiper-pagination-bullet-active{ background: #A28C57; }

.hkpm_event_exhib_banner .hkpm_event_exhib_nav .swiper-pagination-bullet-active{ background: #A28C57; }
.hkpm_event_exhib_banner.dark .hkpm_event_exhib_nav .swiper-pagination-bullet{ background: #000; }
.hkpm_event_exhib_banner.dark .hkpm_event_exhib_nav .swiper-pagination-bullet-active{ background: #A28C57; }

.hkpm_event_exhib_banner .swiper-nav .swiper-pagination-bullet{ margin: 0px 15px; background: #000; }
.hkpm_event_exhib_banner .swiper-nav .swiper-pagination-bullet-active{ background: #A28C57;  }

.swiper-nav .swiper-pagination-bullet{ margin: 0px 15px; background: #7B7475; }
.swiper-nav .swiper-pagination-bullet-active{ background: #A28C57;  }
.hkpm_banner .hkpm_banner_nav .swiper-pagination-bullet{ pointer-events: all;  margin: 0px 0px 0px 20px; }



.hkpm_banner .hkpm_banner_pause{
    pointer-events: all; cursor: pointer;
    display: inline-block; vertical-align: middle;
    width: 20px ; height: 20px; margin-left: 20px;
    position: relative;
}
.hkpm_banner .hkpm_banner_pause span{ display: none; }
.hkpm_banner .hkpm_banner_pause:before,
.hkpm_banner .hkpm_banner_pause:after{
    content: ""; display: block;
    position: absolute;
    width: 5px; height: 100%; background: #A28C57;
}
.hkpm_banner .hkpm_banner_pause:before{ top:0px; left: calc(50% + 2px); }
.hkpm_banner .hkpm_banner_pause:after{ top:0px; right: calc(50% + 2px); }
.hkpm_banner .hkpm_banner_pause:hover:before,
.hkpm_banner .hkpm_banner_pause:hover:after{ background: #53504e; }


.hkpm_event_exhib_banner .hkpm_event_exhib_banner_nav .swiper-pagination-bullet{ pointer-events: all;  margin: 0px 0px 0px 20px; }

.hkpm_event_exhib_banner .hkpm_event_exhib_banner_pause{
    pointer-events: all; cursor: pointer;
    display: inline-block; vertical-align: middle;
    width: 20px ; height: 20px; margin-left: 20px;
    position: relative;
}
.hkpm_event_exhib_banner .hkpm_event_exhib_banner_pause span{ display: none; }
.hkpm_event_exhib_banner .hkpm_event_exhib_banner_pause:before,
.hkpm_event_exhib_banner .hkpm_event_exhib_banner_pause:after{
    content: ""; display: block;
    position: absolute;
    width: 5px; height: 100%; background: #A28C57;
}
.hkpm_event_exhib_banner .hkpm_event_exhib_banner_pause:before{ top:0px; left: calc(50% + 2px); }
.hkpm_event_exhib_banner .hkpm_event_exhib_banner_pause:after{ top:0px; right: calc(50% + 2px); }
.hkpm_event_exhib_banner .hkpm_event_exhib_banner_pause:hover:before,
.hkpm_event_exhib_banner .hkpm_event_exhib_banner_pause:hover:after{ background: #53504e; }

.hkpm_page_prev,
.hkpm_page_next,
.swiper-button-prev,
.swiper-button-next{ position: static; margin: 0px; height: auto; }

.hkpm_page_prev:after,
.hkpm_page_next:after,
.swiper-button-prev:after,
.swiper-button-next:after{
    content: ""; display: block;
    width: 49px; height: 15px; 
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
}
.hkpm_page_prev:after,
.swiper-button-prev:after{ background-image: url(../img/svg/arr-lrg_l.svg);}

.hkpm_page_next:after,
.swiper-button-next:after{ background-image: url(../img/svg/arr-lrg.svg); }

@media screen and (max-width:1279px){
    .hkpm_banner .hkpm_banner_nav{ padding: 0px 40px 40px 0px; }
    .hkpm_event_exhib_banner .hkpm_event_exhib_banner_nav{ padding: 0px 40px 40px 0px; }

}
@media screen and (max-width:1023px){
    .hkpm_banner .hkpm_banner_nav{ padding: 0px 20px 20px 0px; }
    .hkpm_event_exhib_banner .hkpm_event_exhib_banner_nav{ padding: 0px 20px 20px 0px; }

    .swiper-nav .swiper-pagination-bullet{ margin: 0px 10px; }
}
@media screen and (max-width:767px){
    .swiper-nav .swiper-pagination-bullet{ margin: 0px 5px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_banner .hkpm_banner_clock{
    position: absolute; pointer-events: none; z-index: 1;
    bottom: 0px; left: 0px; width: 100%; height: 200px;
    display: flex; align-items: flex-end; justify-content: flex-start;
    color: #5F5635; opacity: 0;
    transition: ease all 0.3s;
}
.hkpm_banner .hkpm_banner_clock .hkpm_main{ width: 100%; padding-bottom: 20px;}

.hkpm_banner .hkpm_banner_clock_items{
    display: flex; align-items: flex-end; justify-content: flex-start;
    font-size: 19px; margin-top: 5px; 
}
.hkpm_banner .hkpm_banner_clock_item{ padding: 0px 20px 0px 0px; }
.hkpm_banner .hkpm_banner_clock_item span{ display: block; }
.hkpm_banner .hkpm_banner_clock_item span:first-of-type{ font-size: 65px; line-height: 65px; font-weight: 100; }

.hkpm_banner.dark .hkpm_banner_clock{ color: #FFF; }

.hkpm_banner .hkpm_banner_clock.show{ opacity: 1; }

@media screen and (max-width:1559px){
    .hkpm_banner .hkpm_banner_clock{ padding-left: 40px; }
}
@media screen and (max-width:1279px){
    .hkpm_banner .hkpm_banner_clock_items{ font-size: 16px; }
    .hkpm_banner .hkpm_banner_clock_item span:first-of-type{ font-size: 48px; line-height: 48px; }
}
@media screen and (max-width:1023px){
    .hkpm_banner .hkpm_banner_clock_item{ padding: 0px 10px 0px 0px; }
    .hkpm_banner .hkpm_banner_clock_items{ font-size: 14px; }
    .hkpm_banner .hkpm_banner_clock_item span:first-of-type{ font-size: 30px; line-height: 30px; }
}
@media screen and (max-width:767px){
    .hkpm_banner .hkpm_banner_clock{ display: none; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_banner .hkpm_banner_menu{
    pointer-events: none; 
    position: absolute; z-index: 97; top:0px; right: 0px; width: 100%; height: 100%;
    display: flex; align-items: flex-end; justify-content: center; flex-direction: column;
    padding-right: 60px; overflow: hidden;    
}
.hkpm_banner .hkpm_banner_menu a{
    pointer-events: all; 
    font-size: 14px; color: #000;
    margin: 10px 0px;
    animation: banner_menu 1s ease-in-out;
}
@keyframes banner_menu {
    0%  { transform: translateX(50vw); } 
    100%{ transform: translateX(0vw); } 
}

.hkpm_banner .hkpm_banner_menu a:hover{ color: #5F5635; }
.hkpm_banner.dark .hkpm_banner_menu a{ color: #FFF; }
.hkpm_banner.dark .hkpm_banner_menu a:hover{ color: #5F5635; }

@media screen and (max-width:1279px){
    .hkpm_banner .hkpm_banner_menu{ display: none; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_banner .hkpm_banner_scroll{
    position: absolute; z-index: 1; bottom:40px; left: 60px;    
}
.hkpm_banner .hkpm_banner_scroll:before{
    content:""; display: block;
    width: 22px; height: 40px;
    background: #FFF; border: 1px solid #A28C57; border-radius: 11px;
}
.hkpm_banner .hkpm_banner_scroll:after{
    content:""; display: block; 
    position: absolute;
    top: 10px; left: calc(50% - 1px);
    width: 2px; height: 8px; 
    background: #A28C57;
    animation: swipe 1.5s linear infinite;
}
.hkpm_banner .hkpm_banner_scroll span{ display: none; }

@keyframes swipe {
    0%  { top: 10px; }       
    50% { top: 22px; }       
    100%{ top: 10px; }    
}
@media screen and (max-width:1279px){
    .hkpm_banner .hkpm_banner_scroll{ left: 40px; }
}
@media screen and (max-width:1023px){
    .hkpm_banner .hkpm_banner_scroll{ left: 20px; bottom:20px; }
}
/*================================================================================*/
/*Medium/Video BANNER*/
/*================================================================================*/
.hkpm_medium_banner,
.hkpm_video_banner{
    position: relative;
    background-attachment: fixed;
    background-size: cover;
    background-position: center center;    
}
.hkpm_medium_banner{ margin: 60px 0px; }
.hkpm_video_banner{ background: #000; color: #FFF; }

.hkpm_video_banner:before{ 
    content: ""; display: block;
    padding-bottom: 45%;
}
.hkpm_medium_banner img{
    width: 100%; height: auto; display: block;
}
.hkpm_video_banner img{
    position: absolute; top:0px; left: 0px; width: 100%; height: 100%;
    object-fit: cover; object-position: center center;
}
.hkpm_video_banner .hkpm_video_text{    
    position: absolute; top:0px; left: 0px; width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: flex-start;
}
.hkpm_video_banner .hkpm_video_text .hkpm_main{ width: 100%; }
.hkpm_video_banner .hkpm_video_text .hkpm_main > *{ max-width: 450px; }

.hkpm_video_banner .hkpm_video_play{
    position: absolute; 
    top: calc(50% - 60px); left: calc(50% - 60px); 
    width: 120px; height: 120px;    
}
.hkpm_video_banner .hkpm_video_play span{ display: none; }
.hkpm_video_banner .hkpm_video_play:after{
    content: ""; display: block;
    width: 100%; height: 100%; border-radius: 50%;
    border: 1px solid #FFF;
    background-image: url(../img/play2.png);
    background-position: center center;
    background-repeat: no-repeat;
}
.hkpm_video_banner .hkpm_video_play:hover:after{
    background-color: #A28C57;
}
.hkpm_video_banner video{ 
    position: absolute; top:0px; left: 0px; width: 100%; height: 100%; 
    background: #000;
} 

@media screen and (max-width:1279px){
    .hkpm_video_banner .hkpm_video_play{ left: auto; right: 40px; }
}
@media screen and (max-width:1023px){
    .hkpm_medium_banner{ margin: 20px 0px; }

    .hkpm_video_banner .hkpm_video_play{ 
        width: 80px; height: 80px;     
        left: calc(50% - 40px);  top: calc(50% - 40px); 
    }
}
@media screen and (max-width:767px){
    .hkpm_video_banner:before{ padding-bottom: 80%; }
    .hkpm_video_banner .hkpm_video_text .hkpm_main{  padding-right: 100px; }
    .hkpm_video_banner .hkpm_video_play{ 
        width: 60px; height: 60px;     
        left: calc(50% - 30px);  top: calc(50% - 30px); 
    }
    .hkpm_video_banner .hkpm_video_play:after{
        background-size: 15px;
    }
}
/*================================================================================*/
/*SMALL BANNER*/
/*================================================================================*/
.hkpm_small_banner{
    position: relative;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-color: #000;
}
.hkpm_small_banner .hkpm_small_banner_text{
    position: relative; padding: 120px 0px;
    display: flex; align-items: center; justify-content: flex-start;
}
.hkpm_small_banner .hkpm_small_banner_text .hkpm_main{ width: 100%;  }
.hkpm_small_banner .hkpm_small_banner_text h2{
    font-size: 50px; color: #FFF;
    max-width: 550px; text-transform: none;
}
.hkpm_small_banner .hkpm_small_banner_text h2 strong{ color: inherit; font-weight: 500; }
.hkpm_small_banner .hkpm_small_banner_text h2.small{ font-size: 40px; max-width: 800px; text-align: left; }

@media screen and (max-width:1279px){
    .hkpm_small_banner .hkpm_small_banner_text h2{ font-size: 45px; }
    .hkpm_small_banner .hkpm_small_banner_text h2.small{ font-size: 36px; }
}
@media screen and (max-width:1023px){
    .hkpm_small_banner .hkpm_small_banner_text h2{ font-size: 40px; }
    .hkpm_small_banner .hkpm_small_banner_text h2.small{ font-size: 32px; }
    .hkpm_small_banner{  background-attachment: scroll; }
}
@media screen and (max-width:767px){
    .hkpm_small_banner .hkpm_small_banner_text h2{ font-size: 35px; }
    .hkpm_small_banner .hkpm_small_banner_text h2.small{ font-size: 28px; }
    .hkpm_small_banner .hkpm_small_banner_text{ padding: 60px 0px; }
}
/*================================================================================*/
/*HOME EXHIBITION*/
/*================================================================================*/
.hkpm_exhibition{ position: relative; background: #F6F6F6; width: 100%; overflow: hidden; }
.hkpm_exhibition .hkpm_main{ position: relative; z-index: 1; }
.hkpm_exhibition:before{
    content: ""; display: block;
    position: absolute; top:-1px; left:0px; width: 100%; padding-bottom: 20%;
    background: linear-gradient(-10deg, #F6F6F6 0%, #F6F6F6 50%, #FFF 50%, #FFF 100%);
}
@media screen and (max-width:767px){ 
    .hkpm_exhibition{ padding-right: 40px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_exhibition_list .hkpm_exhibition_item{
    display: flex; align-items: center; justify-content: space-between;
    margin: 60px 0px 0px 0px; min-height: 100vh;
}
.hkpm_exhibition_list .hkpm_exhibition_item .hkpm_exhibition_col:first-of-type{ width: calc(50% - 80px); }
.hkpm_exhibition_list .hkpm_exhibition_item .hkpm_exhibition_col:last-of-type { width: calc(50% - 0px);  }
.hkpm_exhibition_list .hkpm_exhibition_item:nth-of-type(even){ flex-direction: row-reverse; }

.hkpm_exhibition_list .hkpm_exhibition_item h3{ font-size: 40px; line-height: 1.2em;  margin: 0px; }
.hkpm_exhibition_list .hkpm_exhibition_item h4{ margin: 20px 0px; }
.hkpm_exhibition_list .hkpm_exhibition_item p { margin: 20px 0px; }

.hkpm_exhibition_list .hkpm_exhibition_item .hkpm_exhibition_pic{ position: relative; max-width: 75vh; }
.hkpm_exhibition_list .hkpm_exhibition_item .hkpm_exhibition_pic:before{
    content: ""; display: block;
    padding-bottom: 100%; 
}
.hkpm_exhibition_list .hkpm_exhibition_item .hkpm_exhibition_pic_layer{
    position: absolute; top:0px; left: 0px; width: 50%; height: 50%; 
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
}
.hkpm_exhibition_list .hkpm_exhibition_item .hkpm_action{ margin-top: 20px; }
/*--------------------------------------------------------------------------------*/
@media screen and (max-width:1279px){
    .hkpm_exhibition_list .hkpm_exhibition_item .hkpm_exhibition_col:first-of-type{ width: calc(100% - 400px - 80px); }
    .hkpm_exhibition_list .hkpm_exhibition_item .hkpm_exhibition_col:last-of-type { width: 400px; }
}
@media screen and (max-width:1023px){
    .hkpm_exhibition_list .hkpm_exhibition_item{ flex-wrap: wrap; flex-direction: row-reverse; min-height: auto; }
    .hkpm_exhibition_list .hkpm_exhibition_item .hkpm_exhibition_col:first-of-type{ width: 100%; }
    .hkpm_exhibition_list .hkpm_exhibition_item .hkpm_exhibition_col:last-of-type { width: 100%; }
    .hkpm_exhibition_list .hkpm_exhibition_item .hkpm_exhibition_pic{ max-width: 640px; margin: 40px auto; }
}
@media screen and (max-width:767px){
    .hkpm_exhibition_list .hkpm_exhibition_item h3{ font-size: 36px; }
    .hkpm_exhibition_list .hkpm_exhibition_item .hkpm_exhibition_pic{ max-width: 480px; margin: 40px auto; }
}
@media screen and (max-width:479px){
    .hkpm_exhibition_list .hkpm_exhibition_item h3{ font-size: 24px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_exhibition .hkpm_exhibition_nav{ 
    position: fixed; z-index: 97;
    display: flex; align-items: center; justify-content: center; flex-direction: column;
    top:0px; right: -60px; width: 60px; height: 100%; 
    transition: ease all 0.3s;
    pointer-events: none;
}
.hkpm_exhibition .hkpm_exhibition_title{ 
    position: fixed; z-index: 97;    
    top:0px; left: 0%; width: 100%; padding-top: 100px;
    transition: ease all 0.3s; opacity: 0;
    pointer-events: none;
}

.hkpm_exhibition .hkpm_exhibition_nav .hkpm_exhibition_nav_btn{
    pointer-events: all;
    display: flex;  align-items: center; justify-content:center;
    width: 32px; height: 32px;
}
.hkpm_exhibition .hkpm_exhibition_nav .hkpm_exhibition_nav_btn:before{
    content: ""; display: block;
    width: 10px; height: 10px;
    background: #7B7475; opacity: 0.2; 
    border-radius: 50%;
}
.hkpm_exhibition .hkpm_exhibition_nav .hkpm_exhibition_nav_btn.active:before{
    background: #A28C57; opacity: 1;
}
.hkpm_exhibition .hkpm_exhibition_nav .hkpm_exhibition_nav_btn span{ display: none; }
.hkpm_exhibition.inscreen .hkpm_exhibition_nav{ right: 0px; }
.hkpm_exhibition.inscreen .hkpm_exhibition_title{ left: 0%; opacity: 1; }
.hkpm_exhibition.inscreen .hkpm_exhibition_title .hkpm_main{ width: 100%;}


.hkpm_exhibition.inscreen.even .hkpm_exhibition_title h2,
.hkpm_exhibition.inscreen.even .hkpm_exhibition_title h3{ text-align: right; }

@media screen and (max-width:1023px){
    .hkpm_exhibition .hkpm_exhibition_title{  display: none; }
}
@media screen and (max-width:767px){
    .hkpm_exhibition .hkpm_exhibition_nav{ width: 40px; }
}
/*================================================================================*/
/*FLOATING EXHIBITION BOOKING*/
/*================================================================================*/
.hkpm_exhibition_booking{ 
    position: fixed; bottom:0px; left:0px; width: 100%; z-index: 10;
    background: #A28C57; color: #FFF;
    padding: 10px 0px; transition: ease all 0.3s;
}
.hkpm_exhibition_booking .hkpm_row{ justify-content: space-between; }
.hkpm_exhibition_booking .hkpm_label_list{ justify-content: flex-start; }
.hkpm_exhibition_booking .hkpm_label_title,
.hkpm_exhibition_booking .hkpm_label{ font-size: 16px; border-color: #FFF; }
.hkpm_exhibition_booking .hkpm_label:before{ filter: brightness(0) invert(1); }

.hkpm_exhibition_booking .hkpm_btn--dark{ display: block; }
.hkpm_exhibition_booking .hkpm_btn--dark,
.hkpm_exhibition_booking .hkpm_btn--dark:after,
.hkpm_exhibition_booking .hkpm_btn--dark:before{ border-color: #A28C57; color: #FFF;  }
.hkpm_exhibition_booking .hkpm_btn--dark span{ padding-top: 10px; padding-bottom: 10px; }

.hkpm_exhibition_booking .hkpm_btn--dark:hover:after{ background: #FFF; }
.hkpm_exhibition_booking .hkpm_btn--dark:hover span{ color: #000; } 
.hkpm_exhibition_booking .hkpm_btn--dark:hover span:after{ border-color: #A28C57; }

.hkpm_exhibition_booking .hkpm_label--cal{ display: none; }
.hkpm_exhibition_booking .hkpm_label--time{ display: none; }
.hkpm_exhibition_booking .hkpm_label_title,
.hkpm_exhibition_booking .hkpm_label{ font-size: 19px; }

.hkpm_exhibition_booking.inactive{
    opacity: 0; pointer-events: none;
}

@media screen and (max-width:1023px){
    .hkpm_exhibition_booking .hkpm_label_title,
    .hkpm_exhibition_booking .hkpm_label{ font-size: 14px;  }
}
@media screen and (max-width:767px){
    .hkpm_exhibition_booking .hkpm_label_title{ width: 100%; border: none;}
    .hkpm_exhibition_booking .hkpm_label_title,
    .hkpm_exhibition_booking .hkpm_label{ font-size: 14px; border: none; padding-bottom: 5px; }
    .hkpm_exhibition_booking .hkpm_row{ flex-wrap: wrap; }
    .hkpm_exhibition_booking .hkpm_col{ width: 100%; }
    .hkpm_exhibition_booking .hkpm_btn{ margin-top: 10px;}
}
/*--------------------------------------------------------------------------------*/
.hkpm_cart_countdown{
    display: none;
    margin: 0px 0px 20px 0px; padding: 10px 20px; text-align: right;
    background: #F6F6F6; color: #000;
}
/*================================================================================*/
/*DISCOVER*/
/*================================================================================*/
.hkpm_discover{ position: relative; background: #FFF; padding-top: 1px; }
.hkpm_discover .hkpm_main{ position: relative; z-index: 1; }
.hkpm_discover:before{
    content: ""; display: block;
    position: absolute; top:-1px; left:0px; width: 100%; padding-bottom: 20%;
    /* background: linear-gradient(10deg, #FFF 0%, #FFF 50%, #F6F6F6 50%, #F6F6F6 100%); */
}
/*--------------------------------------------------------------------------------*/
.hkpm_discover_more{ margin: 60px 0px; display: block;  }
.hkpm_discover_more .hkpm_action{
    justify-content: center; padding: 30px 0px;
}
.hkpm_view_more{ width: 100%; padding-top: 60px; display: block; }
.hkpm_view_more span{ 
    display: block; text-align: center; margin: 0px;
    font-size:19px; font-weight: bold; color: #A28C57;
}
.hkpm_view_more span:after{
    content: ""; display: block;
    width: 30px; height: 30px; margin: 0px auto;
    background-image: url(../img/more.png);
    background-position: center center;
    background-repeat: no-repeat;    
}
.hkpm_view_more:hover span{ filter: brightness(0); }
.hkpm_no_result{ 
    width: 100%; padding: 60px 0px;
    font-size: 19px !important; text-align: center;
}
@media screen and (max-width:1279px){
    .hkpm_view_more{ padding-top: 40px; }
}
@media screen and (max-width:1023px){
    .hkpm_view_more{ padding-top: 20px; }
    .hkpm_discover_more{ margin: 90px 0px; }
}
@media screen and (max-width:767px){
    /* .hkpm_view_more{ padding-top: 0px; } */
    .hkpm_discover_more{ margin: 60px 0px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_discover_slider,
.hkpm_publication_slider{ margin: 40px 0px 60px 0px; }
.hkpm_discover_slider .hkpm_discover_slide{  position: relative; }
.hkpm_discover_slider .hkpm_discover_slide:before{ 
    content: ""; display: block;
    position: absolute; top:0px; left: 0px; 
    width: calc(100% - 80px); height: calc(100% - 80px);
    transform: skew(-2deg, 0deg) translateX(10px);
    background: #F6F6F6;
}
.hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_row{
    position: relative;
    display: flex; align-items: flex-start; justify-content: flex-start;
    padding: 40px 0px 40px 60px; 
}
.hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_text{ width: 45%; padding: 0px 40px 80px 0px; }
.hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_img { width: 55%; position: relative; }
.hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_img:before{
    content: ""; display: block; padding-bottom: 135%;
}
.hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_img img{
    position: absolute; display: block;
    top:0px; left: 0px; width: 100%; height: 100%;
    object-fit: cover; object-position: center center;
}

.hkpm_discover_slider .hkpm_discover_slide h3{ font-size: 25px; }
.hkpm_discover_slider .hkpm_discover_slide h4,
.hkpm_discover_slider .hkpm_discover_slide p{ margin: 80px 0px 40px 0px; }
.hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_text a:hover h3{ text-decoration: underline;}
.hkpm_discover_slider .hkpm_discover_slide .hkpm_arr{ display: inline-block; margin-bottom: 5px; margin-right: 40px; white-space: nowrap;  }

.hkpm_discover_slider .swiper-slide:nth-of-type(even){ padding-top:80px; }

@media screen and (max-width:1279px){        
    .hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_text{ width: calc(100% - 200px); }
    .hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_img { width: 200px;  }

    .hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_row{  padding: 40px 0px 20px 40px;  }
    .hkpm_discover_slider .hkpm_discover_slide h4,
    .hkpm_discover_slider .hkpm_discover_slide p{ margin: 60px 0px 20px 0px; }
}
@media screen and (max-width:1023px){
    .hkpm_discover_slider{ margin: 30px 0px; }
    .hkpm_discover_slider .hkpm_discover_slide h3{ font-size: 20px; }
    .hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_text{ width: calc(100% - 33vw); }
    .hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_img { width: 33vw;  }
    .hkpm_discover_slider .swiper-slide:nth-of-type(even){ padding-top:0px; }

    .hkpm_discover_slider .hkpm_discover_slide h4,
    .hkpm_discover_slider .hkpm_discover_slide p{ margin: 40px 0px 20px 0px; }
}
@media screen and (max-width:767px){
    .hkpm_discover_slider{ margin: 20px 0px; }
    .hkpm_discover_slider .hkpm_discover_slide h3{ font-size: 18px; }
    .hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_text{ width: calc(100% - 33vw); }
    .hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_img { width: 33vw;  }

    .hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_row{  padding: 40px 0px 20px 40px;  }

    .hkpm_discover_slider .hkpm_discover_slide h4,
    .hkpm_discover_slider .hkpm_discover_slide p{ margin: 20px 0px 20px 0px; }
}
@media screen and (max-width:479px){
    .hkpm_discover_slider .hkpm_discover_slide:before{ 
        left: -15px;
    }
    .hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_text{ width: calc(100% - 40vw);  }
    .hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_img { width: 40vw;  }

    .hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_row{  padding: 20px 0px 20px 20px;  }
    .hkpm_discover_slider .hkpm_discover_slide p{ margin: 20px 0px 20px 0px; }
    .hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_text{ padding-right: 20px; }
    
    .hkpm_discover_slider .hkpm_discover_slide:before{ height: calc(100% - 40px); }
    .hkpm_discover_slider .hkpm_discover_slide .hkpm_discover_slide_text{ padding-bottom: 40px; }
}

.hkpm_discover_slider--2col{
    display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap;
}
.hkpm_discover_slider--2col .hkpm_discover_slide{ width: calc(50% - 20px); }
.hkpm_discover_slider--2col .hkpm_discover_slide:nth-of-type(even){ margin-top: 80px;}

@media screen and (max-width:1023px){
    .hkpm_discover_slider--2col .hkpm_discover_slide{ width: 100%; }
    .hkpm_discover_slider--2col .hkpm_discover_slide:nth-of-type(even){ margin-top: 0px;}
}
/*--------------------------------------------------------------------------------*/
.hkpm_discover_slider--1col .hkpm_discover_slide .hkpm_discover_slide_text{ width: 25%; }
.hkpm_discover_slider--1col .hkpm_discover_slide .hkpm_discover_slide_img { width: 75%; }
.hkpm_discover_slider--1col .hkpm_discover_slide .hkpm_discover_slide_img:before{ padding-bottom: 45%; }
.hkpm_discover_slider--1col .hkpm_discover_slide:before{ width: calc(50% - 120px); }

@media screen and (min-width:1024px){   
    .hkpm_discover_slider--1col .hkpm_discover_slide:nth-of-type(even) .hkpm_discover_slide_row{  
        flex-direction: row-reverse; 
        padding: 0px 60px 40px 0px; 
    }
    .hkpm_discover_slider--1col .hkpm_discover_slide:nth-of-type(even) .hkpm_discover_slide_text{ padding: 80px 0px 0px 40px; }
    .hkpm_discover_slider--1col .hkpm_discover_slide:nth-of-type(even):before{ 
        right: 20px; left: auto; top:40px; height: calc(100% - 40px); 
    }
}
@media screen and (max-width:1279px){   
    .hkpm_discover_slider--1col .hkpm_discover_slide .hkpm_discover_slide_text{ width: 33.33%; }
    .hkpm_discover_slider--1col .hkpm_discover_slide .hkpm_discover_slide_img { width: 66.67%; }
    .hkpm_discover_slider--1col .hkpm_discover_slide:before{ width: calc(50% - 60px); }
}
@media screen and (max-width:1023px){   
    .hkpm_discover_slider--1col .hkpm_discover_slide{ margin-bottom: 40px; background: #F6F6F6;} 
    .hkpm_discover_slider--1col .hkpm_discover_slide .hkpm_discover_slide_row{ flex-wrap: wrap; padding: 0px; } 
    .hkpm_discover_slider--1col .hkpm_discover_slide .hkpm_discover_slide_text{ width: 100%; padding: 40px 20px; }
    .hkpm_discover_slider--1col .hkpm_discover_slide .hkpm_discover_slide_img { width: 100%; }
    .hkpm_discover_slider--1col .hkpm_discover_slide:before{ display: none; }
}
@media screen and (max-width:767px){   
    .hkpm_discover_slider--1col .hkpm_discover_slide{ margin-bottom: 20px; }
    .hkpm_discover_slider--1col .hkpm_discover_slide .hkpm_discover_slide_text{ padding: 20px 20px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_publication_slider .hkpm_discover_slider_nav,
.hkpm_discover_slider .hkpm_discover_slider_nav{
    display: flex; align-items: center; justify-content: center;
}
.hkpm_publication_slider .swiper-nav,
.hkpm_discover_slider_nav .swiper-nav{
    display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
    margin: 0px 15px;
}
.hkpm_publication_slider .hkpm_discover_slider_nav{ padding-top: 40px;}
/*================================================================================*/
/*ABOUT*/
/*================================================================================*/
.hkpm_about{ position: relative; overflow: hidden; margin-bottom: 0px !important; }
.hkpm_about .hkpm_main{ position: relative; z-index: 1; }
.hkpm_about:after{
    content: ""; display: block;
    position: absolute; bottom:0px; left:0px; width: 100%; padding-bottom: 20%;
    background: linear-gradient(-10deg, #F6F6F6 0%, #F6F6F6 50%, #FFF 50%, #FFF 100%);
}
/*================================================================================*/
/*TICKET INFO*/
/*================================================================================*/
.hkpm_ticket_info{ padding: 120px 0px; }
/* .hkpm_ticket_info.item0, */
/* .hkpm_ticket_info:first-of-type{ margin-top: 120px; } */
.hkpm_ticket_info:first-of-type{ margin-top: 0; }

.hkpm_ticket_info--blank:first-child,
.hkpm_ticket_info--white:first-child,
.hkpm_ticket_info--grey_block:first-child{ padding-top:0 !important}

.hkpm_ticket_info .hkpm_row{ justify-content: space-between; }
.hkpm_ticket_info .hkpm_col{ width: calc(50% - 20px); max-width: 600px; }
.hkpm_ticket_info p{ margin: 20px 0px;}

/*
.hkpm_ticket_info ul{ list-style: none; margin: 0px; padding: 0px; margin-bottom: 20px; }
.hkpm_ticket_info ul li{ 
    padding: 10px 0px; margin: 0px;
    border-bottom: 1px solid #A28C57;
}
.hkpm_ticket_info ul li:before{ display: none; }
.hkpm_ticket_info ul li:last-of-type{ border: none; }
*/

.hkpm_ticket_info .hkpm_btn{ margin: 0px 10px 10px 0px;}
.hkpm_ticket_info .hkpm_col:last-of-type .action{ display: none; }
.hkpm_ticket_info table{ border-style: solid; border-collapse: collapse;}

.hkpm_ticket_info--gold { 
    color: #FFF; background: #000;
    background-image: url(../img/ticket.jpg);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}
.hkpm_ticket_info--gold ul li{ border-color: #FFF; }
.hkpm_ticket_info--gold .hkpm_btn,
.hkpm_ticket_info--gold .hkpm_btn:after{ border-color: #5F5635; color: #FFF; }
.hkpm_ticket_info--gold .hkpm_btn:before{ background: #5F5635; }
.hkpm_ticket_info--gold .hkpm_btn span{ color: #FFF; } 
.hkpm_ticket_info--gold .hkpm_btn span:after{ border-color: #FFF;  }

.hkpm_ticket_info--gold .hkpm_btn:hover:after{ background: #FFF; }
.hkpm_ticket_info--gold .hkpm_btn:hover span{ color: #A28C57; } 
.hkpm_ticket_info--gold .hkpm_btn:hover span:after{ border-color: #A28C57; }
.hkpm_ticket_info--gold ul li:before{ background: #FFF; }
.hkpm_ticket_info--gold ul.hkpm_line_list li{ border-bottom: 1px solid #FFF; }
.hkpm_ticket_info--gold blockquote{ border-left-color: #FFF; color: #FFF;}
.hkpm_ticket_info--gold .highlight, .hkpm_ticket_info--gold .hkpm_arr{color: #FFF!important}
.hkpm_ticket_info--gold .hkpm_arr:after{ filter: brightness(0) invert();}
.hkpm_ticket_info--gold table{ border-color: #FFF;}

.hkpm_ticket_info--white{ color: #000; background: #FFF; }
.hkpm_ticket_info--white h3{ color: #A28C57; }
.hkpm_ticket_info--white h4{ color: #A28C57; }
.hkpm_ticket_info--grey { color: #000; background: #F6F6F6; }
.hkpm_ticket_info--grey h3{ color: #A28C57; }
.hkpm_ticket_info--grey p{ color: #000; }

.hkpm_ticket_info--grey + .hkpm_ticket_info--grey,
.hkpm_ticket_info--gold + .hkpm_ticket_info--gold,
.hkpm_ticket_info--white + .hkpm_ticket_info--blank,
.hkpm_ticket_info--grey_block + .hkpm_ticket_info--blank,
.hkpm_ticket_info--blank + .hkpm_ticket_info--white,
.hkpm_ticket_info--blank + .hkpm_ticket_info--grey_block,
.hkpm_ticket_info--white + .hkpm_ticket_info--grey_block,
.hkpm_ticket_info--grey_block + .hkpm_ticket_info--white,
.hkpm_ticket_info--white + .hkpm_ticket_info--white,
.hkpm_ticket_info--grey_block + .hkpm_ticket_info--grey_block {
    padding-top: 0;
}
.hkpm_ticket_info--white + .hkpm_ticket_info--blank,
.hkpm_ticket_info--grey_block + .hkpm_ticket_info--blank,
.hkpm_ticket_info--blank + .hkpm_ticket_info--white,
.hkpm_ticket_info--blank + .hkpm_ticket_info--grey_block
{
    margin-top: -60px;
}

.hkpm_ticket_info--white + .hkpm_ticket_info--grey_block{
    margin-top: -80px;
}
@media screen and (max-width:1023px){
    .hkpm_ticket_info--white + .hkpm_ticket_info--blank,
    .hkpm_ticket_info--grey_block + .hkpm_ticket_info--blank,
    .hkpm_ticket_info--blank + .hkpm_ticket_info--white,
    .hkpm_ticket_info--blank + .hkpm_ticket_info--grey_block,
    .hkpm_ticket_info--white + .hkpm_ticket_info--grey_block{
        margin-top: -20px;
    }
}


.hkpm_ticket_info--gold td.hkpm_table_header:first-child,
.hkpm_ticket_info--gold td.hkpm_table_header:last-child,
.hkpm_ticket_info--gold th.hkpm_table_header:first-child,
.hkpm_ticket_info--gold th.hkpm_table_header:last-child,
.hkpm_ticket_info--gold td.hkpm_table_header,
.hkpm_ticket_info--gold th.hkpm_table_header{
    color: #FFFFFF !important; 
    border-bottom-color: #5f5635 !important; 
}

.hkpm_ticket_info--gold .hkpm_table2 td,    
.hkpm_ticket_info--gold .hkpm_table2 th{
    color: #000;
}

.hkpm_ticket_info--gold .gold{
    color: #FFF;
}

.hkpm_ticket_info--grey_block .hkpm_row{ align-items: stretch;}
.hkpm_ticket_info--grey_block .hkpm_col, .hkpm_ticket_info--grey_block .hkpm_block{ background-color: #f5f5f5; padding: 30px; max-width: 100%;}
.hkpm_ticket_info--grey_block .hkpm_col+.hkpm_col{ margin-left: 40px}
.hkpm_ticket_info--grey_block .hkpm_col > *:first-child{ margin-top: 0; }

.hkpm_ticket_info .hkpm_row--border{ align-items: stretch; }
.hkpm_ticket_info .hkpm_row--border .hkpm_col{ width: 50%; max-width: none; }
.hkpm_ticket_info .hkpm_row--border .hkpm_col:first-of-type{ padding-right: 60px; border-right: 1px solid #A28C57; }
.hkpm_ticket_info .hkpm_row--border .hkpm_col:last-of-type{ padding-left: 60px; }
.hkpm_ticket_info .hkpm_row--border .hkpm_col:first-of-type > * { max-width: 600px; }
.hkpm_ticket_info .hkpm_row--border .hkpm_col:last-of-type  > * { max-width: 600px; margin-left: auto; }

.hkpm_ticket_info--gold .hkpm_row--border .hkpm_col:first-of-type{  border-right: 1px solid #FFF; }

.hkpm_ticket_info .hkpm_row--border .hkpm_col:first-of-type:last-of-type{ width: 70%; border:none; }
.hkpm_ticket_info .hkpm_row--border .hkpm_col:first-of-type:last-of-type > *{ max-width: 100%; }

.hkpm_ticket_info .hkpm_row--border.single_col .hkpm_col{ border:none; }
.hkpm_ticket_info--grey_block .single_col .hkpm_col{ width: 660px; }

.hkpm_ticket_info table{ width: 100%; }
.hkpm_ticket_info .hkpm_table2:last-child{ margin-bottom: 0; }

.data_template{ display: none; }

@media screen and (max-width:1023px){
    /* .hkpm_ticket_info:first-of-type{ margin-top: 60px; } */
    .hkpm_ticket_info{ padding: 40px 0px; }
    .hkpm_ticket_info .hkpm_row{ flex-wrap: wrap; }
    .hkpm_ticket_info .hkpm_col{ width: 100%; max-width: 600px; margin: 0px 0px; }

    .hkpm_ticket_info--grey_block .hkpm_col{ max-width: 100%; }
    .hkpm_ticket_info--grey_block .hkpm_col+.hkpm_col{ margin-top: 20px; margin-left: 0; }
}
@media screen and (max-width:1023px){
    /* .hkpm_ticket_info:first-of-type{ margin-top: 40px; } */

    .hkpm_ticket_info .hkpm_col:first-of-type .action{ display: none; }
    .hkpm_ticket_info .hkpm_col:last-of-type .action{ display: block; }

    .hkpm_ticket_info .hkpm_row--border{ flex-wrap: wrap; }    
    .hkpm_ticket_info .hkpm_row--border .hkpm_col:first-of-type,
    .hkpm_ticket_info .hkpm_row--border .hkpm_col:last-of-type{ padding-right: 0px;  padding-left: 0px; width: 100%; }
    .hkpm_ticket_info .hkpm_row--border .hkpm_col:first-of-type{ 
        border-right: none; border-bottom: 1px solid #A28C57;
        padding-bottom: 40px;
    }
    .hkpm_ticket_info .hkpm_row--border .hkpm_col:last-of-type{  padding-top: 60px; border-top: 1px solid #A28C57; }
    .hkpm_ticket_info .hkpm_row--border .hkpm_col:last-of-type > *{ margin-left: 0px;}

    .hkpm_ticket_info--gold .hkpm_row--border .hkpm_col:last-of-type{  border-top: 1px solid #FFF; }
}
/*================================================================================*/
/*BOOKING STEPS */
/*================================================================================*/
.hkpm_booking{ position: relative; } 
.hkpm_booking h3{ font-size: 25px; font-weight: 500; margin: 20px 0px; }
.hkpm_booking p > a{ color: #5F5635; text-decoration: underline;}
.hkpm_booking p > a:hover{ color: #5F5635; }

.hkpm_booking .hkpm_booking_map{ overflow: auto; }
.hkpm_booking .hkpm_booking_map img{display: block; width: auto; height: auto; max-width: none; }

.hkpm_booking .hkpm_booking_action{ 
    display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap;
    padding: 40px 0px 0px 0px;
}
.hkpm_booking .hkpm_booking_action > *{ margin-right: 40px; margin-bottom: 20px; }

.hkpm_booking .hkpm_booking_side{
    position: absolute; 
    top:0px; right: 0px; width: 50%;    
    background:#F6F6F6; 
}
.hkpm_booking .hkpm_booking_side .hkpm_main{
    max-width: 720px;
    margin: 0px; padding: 80px 80px;
}
.hkpm_booking .hkpm_booking_side .hkpm_booking_mobile{ display: none; }


.hkpm_booking .hkpm_booking_step{ display: none; padding-bottom: 120px; }
.hkpm_booking .hkpm_booking_step:first-of-type{ display: block; }

.hkpm_booking .hkpm_booking_step#date,
.hkpm_booking .hkpm_booking_step#time,
.hkpm_booking .hkpm_booking_step#area,
.hkpm_booking .hkpm_booking_step#seat,
.hkpm_booking .hkpm_booking_step#ticket{
    width: 50%; padding-right: 80px;
}

.hkpm_booking_succss_info{ margin: 20px 0px 0px 0px; }
.hkpm_booking_succss_info table{ border-spacing:0px }
.hkpm_booking_succss_info table td{ padding: 0px 20px 10px 0px;}
.hkpm_booking_succss_info table td:first-of-type{ max-width: 200px ;}

@media screen and (max-width:1279px){
    .hkpm_booking .hkpm_booking_step#date,
    .hkpm_booking .hkpm_booking_step#time,
    .hkpm_booking .hkpm_booking_step#area,
    .hkpm_booking .hkpm_booking_step#seat,
    .hkpm_booking .hkpm_booking_step#ticket{
       padding-right: 40px;
    }
    .hkpm_booking .hkpm_booking_side .hkpm_main{ padding: 80px 40px; }
}
@media screen and (max-width:1023px){
    .hkpm_booking .hkpm_booking_step#date,
    .hkpm_booking .hkpm_booking_step#time,
    .hkpm_booking .hkpm_booking_step#area,
    .hkpm_booking .hkpm_booking_step#seat,
    .hkpm_booking .hkpm_booking_step#ticket{
        width: 100%; max-width: 800px;
        padding-right: 0px;
    }
    .hkpm_booking .hkpm_booking_side{ 
        position: fixed; z-index: 10; 
        display: flex; align-items: flex-end; justify-content: flex-end; flex-direction: column;
        bottom: 0px; left: 0px; top: auto;
        width: 100%; overflow: auto;
        background: rgba(0,0,0,0);
        transition: ease all 0.3;
    }
    .hkpm_booking .hkpm_booking_side .hkpm_main{ 
        padding: 0px 20px; width: 100%; max-width: 100%;
        background: #FFF; display: none;
    }
    .hkpm_booking .hkpm_booking_side .hkpm_main > h3{ display: none; }

    .hkpm_booking .hkpm_booking_side .hkpm_booking_mobile{ 
        display: block; position: relative; width: 100%;
        font-size: 16px; font-weight: bold;
        background: #FFF; padding: 20px; 
        border-top: 1px solid #D7D7D7;
    }
    .hkpm_booking .hkpm_booking_side .hkpm_booking_mobile:after{
        content: ""; display: block;
        position: absolute; top:calc(50% - 4px); right: 20px;
        width: 8px; height: 8px;
        border-top: 1px solid #000;
        border-right: 1px solid #000;
        transform: rotate(-45deg);
    }
    .hkpm_booking .hkpm_booking_side.open{ 
        height: 100%; background: rgba(0,0,0,0.1); 
        pointer-events: none;
    }
    .hkpm_booking .hkpm_booking_side.open > *{ pointer-events: all; }
    .hkpm_booking .hkpm_booking_side.open .hkpm_main{ display: block; }
    .hkpm_booking .hkpm_booking_side.open .hkpm_booking_mobile:after{ transform: rotate(135deg); }

    .hkpm_booking h3{ font-size: 18px; margin: 20px 0px 20px 0px; } 
    .hkpm_booking .hkpm_booking_action{ padding: 20px 0px 40px 0px; }
    
    
    .hkpm_booking .hkpm_booking_side .hkpm_main{ background: #F6F6F6; }
    .hkpm_booking .hkpm_booking_side .hkpm_booking_mobile{ background: #F6F6F6; }

    .hkpm_booking .hkpm_booking_side .hkpm_main{ max-height: calc(100vh - 200px) ;  overflow: auto; }
}
@media screen and (max-width:767px){ 
    .hkpm_booking h3{ font-size: 16px; margin: 20px 0px 20px 0px; } 
    .hkpm_booking .hkpm_booking_action{  padding: 20px 0px 0px 0px; }

}
/*--------------------------------------------------------------------------------*/
.hkpm_booking_step_nav{
    max-width: 800px;
    display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap;
    padding: 0px; margin: 0px; list-style: none;
    border-bottom: 1px solid #D7D7D7;
}
.hkpm_booking_step_nav a{ 
    display: block; position: relative;
    padding: 20px 0px; margin: 0px; 
    display: flex; align-items: center; justify-content: flex-start;
    opacity: 0.5; 
}
.hkpm_booking_step_nav a:before{
    content: ""; display: block;
    width: 8px; height: 8px;
    border-top: 1px solid #D7D7D7;
    border-right: 1px solid #D7D7D7;
    transform: rotate(45deg);
    margin: 0px 10px;
}
.hkpm_booking_step_nav a:first-of-type:before{ display: none; }

.hkpm_booking_step_nav a.active{ opacity: 1; font-weight: 500; }
.hkpm_booking_step_nav a.active:after{
    content: ""; display: block;    
    position: absolute; bottom: -1px; left: 0px; width: 100%; height: 2px; 
    background: #A28C57;
}
@media screen and (max-width:1023px){
    .hkpm_booking_step_nav a{ padding: 15px 0px; }
}
@media screen and (max-width:767px){
    .hkpm_booking_step_nav a{ padding: 10px 0px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_selector{
    display: flex; align-items: stretch; justify-content:flex-start; flex-wrap: wrap;
}
.hkpm_selector a{
    display: flex; align-items: center; justify-content:center;
    width: 100%; padding: 10px 20px; margin: 0px 10px 10px 0px;
    border:1px solid #D7D7D7;
    border-radius: 30px;
}
.hkpm_selector a.inactive{ opacity: 0.3; }
.hkpm_selector a:not(.inactive):hover,
.hkpm_selector a.active{
    background: #A28C57; color: #FFF;
}

.hkpm_selector--time a{ width: 100%; max-width: 110px; }
.hkpm_selector--time a span:first-of-type{ font-size: 19px; }
.hkpm_selector--time a span:last-of-type{ opacity:0.7; margin-left: 5px; }

.hkpm_selector--area a{ 
    position: relative;
    width: 100%; max-width: 300px; 
    justify-content: flex-start; flex-wrap: wrap;
    padding-left: 40px;
}
.hkpm_selector--area a:before{
    content: ""; display: block;
    position: absolute; top: calc(50% - 8px); left: 15px;
    width: 16px; height: 16px; margin-right: 10px;
    background: #5F5635; border-radius: 50%;
}
.hkpm_selector--area a span:first-of-type{ white-space: nowrap; margin-right: 5px; }
.hkpm_selector--area a span:last-of-type{ opacity:0.7; }

.hkpm_selector--seat a{ width: 100%; max-width: 110px; }

@media screen and (max-width:1023px){
    .hkpm_selector--time a{ max-width: 100px; }
    .hkpm_selector--time a span:first-of-type{ font-size: 16px; }
}
@media screen and (max-width:767px){
    .hkpm_selector--time a{ max-width: 80px; }
    .hkpm_selector--time a span:first-of-type{ font-size: 14px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_ticket_type{    
    display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap;
    margin: 0px 0px 10px 0px;
}
.hkpm_ticket_type .hkpm_ticket_type_text{ 
    width: calc(100% - 150px); padding-right: 20px;
    display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;
}
.hkpm_ticket_type .hkpm_ticket_type_text :first-child{ flex: 1; padding-right: 40px;}
.hkpm_ticket_type .hkpm_ticket_type_text :last-child{ width: 100px; }
.hkpm_ticket_type .hkpm_ticket_type_discount_label{
    width: auto !important; display: inline-block; 
    padding: 5px 6px !important; margin-right: 5px;
    border: 1px solid #A28C57; color: #A28C57;
    font-size: 12px;
}
.hkpm_ticket_type .hkpm_ticket_type_text_name{ display: inline;}
.hkpm_ticket_type .hkpm_ticket_type_qty{ width: 150px; }

.hkpm_ticket_type--head .hkpm_ticket_type_text{ font-weight: 500; }
.hkpm_ticket_type--head .hkpm_ticket_type_qty{  font-weight: 500; text-align: center; }

.hkpm_ticket_type .hkpm_input_text { margin-top: 0px; width: 100%; }

@media screen and (max-width:767px){
    .hkpm_ticket_type .hkpm_ticket_type_text :first-child{ width: 100%; padding-right: 0px; }
    .hkpm_ticket_type .hkpm_ticket_type_text :last-child{ width: 100%; }
}
@media screen and (max-width:479px){
    .hkpm_ticket_type .hkpm_ticket_type_text{ width: calc(100% - 120px); }
    .hkpm_ticket_type .hkpm_ticket_type_qty{ width: 120px; }
    .hkpm_ticket_type .hkpm_ticket_type_text_name{ display: inline-block;}
}
/*--------------------------------------------------------------------------------*/
.hkpm_payment{
    display: flex; align-items: center; justify-content: flex-start;  flex-wrap: wrap;
    margin-bottom: 40px; max-width: 1000px;
}
.hkpm_payment a{
    display: flex; align-items: center; justify-content: center;    
    width: 200px; height: 150px; padding-bottom: 1px; overflow: hidden;
    /*border-bottom: 1px solid #D7D7D7;*/
}
.hkpm_payment a img{ 
    width: calc(100% - 20px); max-width: 150px;
    height: calc(100% - 20px); 
    object-fit: contain; object-position: center center;
    filter: grayscale(1); 
    transition: ease all 0.3s;
}
.hkpm_payment a[data-value="ae"] img{ max-width: 80px; }

.hkpm_payment a:hover{ border-color: #5F5635; }
.hkpm_payment a:hover img{ filter:grayscale(0); opacity: 1; }

@media screen and (max-width:1023px){
    .hkpm_payment a{ height: 120px; } 
}
@media screen and (max-width:767px){
    .hkpm_payment a{ width: 33.33%; height: 100px; } 
    .hkpm_payment a[data-value="ae"] img{ max-width: 60px; }
}
/*================================================================================*/
/*CART*/
/*================================================================================*/
.hkpm_cart{ margin: 0px 0px 40px 0px; }
.hkpm_cart_item{
    padding: 20px 0px 10px 0px; border-top: 1px solid #D7D7D7;
    position: relative;
}
.hkpm_cart_item:first-of-type{ border-top:none; }
.hkpm_cart_item .hkpm_cart_row{
    display: flex; align-items: center; justify-content: space-between;    
    margin: 0px 0px 10px 0px;
}
.hkpm_cart_item h3{ font-size: 20px; margin: 0px; padding: 0px; font-weight: 600; }
.hkpm_cart_item p { font-size: 16px; margin: 0px; padding: 0px; }
.hkpm_cart_item .hkpm_cart_price{ width: 100px; text-align: right;  }

.hkpm_cart_item.hkpm_cart_item--total p{ font-size: 19px; font-weight: bold; }

.hkpm_cart_item .hkpm_cart_del{
    position: absolute; top:20px; right: 0px; 
    width: 40px; height: 40px; 
    border: 1px solid #7B7475; border-radius: 50%;
    display: none; align-items: center; justify-content: center;
}
.hkpm_cart_item .hkpm_cart_del:before{
    content: ""; display: block;
    background-image: url(../img/icon_del.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 15px; height: 20px; width: 15px;
}
.hkpm_cart_item .hkpm_cart_del:hover{ background: #A28C57; }
.hkpm_cart_item .hkpm_cart_del:hover:before{ filter: brightness(0) invert(1); }
.hkpm_cart_item .hkpm_cart_del span{ display: none; }

.hkpm_cart_item--total p{ font-weight: 500; }
.hkpm_cart_item--total{ 
    border-top: 1px solid #D7D7D7; 
    border-bottom: 1px solid #D7D7D7; 
}
.hkpm_cart_timer{
    position:fixed; 
    top:120px; right:60px; z-index:97;
}
.hkpm_cart_timer .time{ 
    padding: 20px; min-width: 100px; font-size: 1.5em;
    background: #F6F6F6; color: #000;
    text-align: center; border-radius: 10px;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.3); 
}

@media screen and (max-width:1279px){ 
    .hkpm_cart_timer{ top:100px; right: 40px; }
    .hkpm_cart_timer .time{  min-width: 80px; padding: 15px; }
}
@media screen and (max-width:1023px){ 
    .hkpm_cart_timer{ top:80px; right: 20px;  }
    .hkpm_cart_timer .time{  min-width: 60px; padding: 10px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_booking_step#cart .hkpm_cart_item{ padding-right: 80px; }
.hkpm_booking_step#cart .hkpm_cart_item--total p{ color: #A28C57; }
.hkpm_booking_step#cart .hkpm_cart_del{ display: flex; }
.hkpm_booking_step#cart .hkpm_cart_item--total{ 
    border-top: 1px solid #A28C57; 
    border-bottom: 1px solid #A28C57;     
}
.hkpm_booking_step#cart .hkpm_cart_item--total .hkpm_cart_row{ justify-content: flex-end; }

.hkpm_booking_step#confirm .hkpm_cart_item { max-width: 800px; }
.hkpm_booking_step#confirm .hkpm_cart_price,
.hkpm_booking_step#confirm .hkpm_cart_item--total{ display: none !important; }

.hkpm_booking_step#seat .hkpm_arr{
    display: inline-block; margin: 20px 0px;
}
/*--------------------------------------------------------------------------------*/
@media screen and (max-width:1023px){ 
    .hkpm_cart_item h3{ font-size: 16px; }
    .hkpm_cart_item p { font-size: 14px; }
    .hkpm_cart{ margin: 0px 0px 20px 0px; }
}
@media screen and (max-width:767px){ 
    .hkpm_cart_item h3{ font-size: 14px; }
    .hkpm_cart_item p { font-size: 12px; }
    .hkpm_cart_item .hkpm_cart_del{ left: 0px; right: auto; bottom:20px; top: auto; }

    .hkpm_booking_step#cart .hkpm_cart_item{ padding-right: 0px; padding-bottom: 70px; }    
    .hkpm_booking_step#cart .hkpm_cart_item--total{ padding-bottom: 10px; }
}
/*================================================================================*/
/*CALENDAR*/
/*================================================================================*/
.hkpm_calendar{ 
    margin: 20px 0px 40px 0px; 
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently */
}
.hkpm_calendar .hkpm_calendar_date_options{
    font-size: 20px; 
    margin: 0px 0px 20px 0px; 
    border-bottom: 1px solid #D7D7D7;
    height: 40px; 
}
.hkpm_calendar .hkpm_calendar_date_options a{
    display: inline-block;
    border-bottom: 1px solid rgba(0,0,0,0);    
    height: 40px; 
    line-height: 40px;
    text-align: center;
}
.hkpm_calendar .hkpm_calendar_date_options a.active,
.hkpm_calendar .hkpm_calendar_date_options a:hover{ border-color: #A28C57; opacity: 1; color: #5F5635; }
.hkpm_calendar .hkpm_calendar_date_options .js-cal_clear{
    float: left;
    color: #A28C57;
    font-size: 24px;
    font-weight: 500;
}
.hkpm_calendar .hkpm_calendar_date_options .js-cal_today{
    float: left;
    color: #000;
    font-size: 18px;
    margin-left: 15px;
}
.hkpm_calendar .hkpm_calendar_date_options .js-cal_week{
    float: left;
    color: #000;
    font-size: 18px;
    margin-left: 15px;
}
.hkpm_calendar .hkpm_calendar_date_options .js-cal_past{
    float: right;
    color: #000;
    font-size: 24px;
    font-weight: 500;
}
.hkpm_calendar .hkpm_calendar_head{
    display: flex; align-items: center; justify-content: space-between;
    font-size: 25px; font-weight: 500; margin: 0px 0px 20px 0px;
}
.hkpm_calendar .hkpm_calendar_prev,
.hkpm_calendar .hkpm_calendar_next{
    content: ""; display: block;
    width: 48px; height: 48px;
    border: 1px solid #D7D7D7; border-radius: 50%;
    transition: none;
}
.hkpm_calendar .hkpm_calendar_prev span,
.hkpm_calendar .hkpm_calendar_next span{ display: none; }
.hkpm_calendar .hkpm_calendar_prev:before,
.hkpm_calendar .hkpm_calendar_next:before{
    content: ""; display: block;
    width: 100%; height: 100%;
    background-image: url(../img/svg/arr-lrg.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 50%;
    filter:brightness(0);
}
.hkpm_calendar .hkpm_calendar_prev:before{ background-image: url(../img/svg/arr-lrg_l.svg); }

.hkpm_calendar .hkpm_calendar_prev:hover,
.hkpm_calendar .hkpm_calendar_next:hover{ background: #A28C57; color: #FFF; }
.hkpm_calendar .hkpm_calendar_prev:hover:before,
.hkpm_calendar .hkpm_calendar_next:hover:before{ filter: brightness(0) invert(1); }

.hkpm_calendar .hkpm_calendar_prev.inactive,
.hkpm_calendar .hkpm_calendar_next.inactive{ visibility: hidden; }

.hkpm_calendar_row{ 
    display: flex; align-items: center; justify-content: space-between;
}
.hkpm_calendar_row--week{ font-size: 15px; }
.hkpm_calendar_row a{ width: 14%; max-width: 48px; text-align: center; padding: 5px 0px; position: relative; }

.hkpm_calendar_row a.dot:after{
    display: block; content: "";
    position: absolute; bottom: 10px; left: calc(50% - 3px); width: 6px; height: 6px;
    background: #AAA; border-radius: 50%;

}
.hkpm_calendar_row:not(.hkpm_calendar_row--week) a span{
    display: flex; align-items: center; justify-content: center;
    max-width: 48px; height: 48px; margin: 0px auto;
    font-size: 19px;
}
.hkpm_calendar_row:not(.hkpm_calendar_row--week) a.today span{
    border:1px solid #A28C57; background: rgba(255,255,255,0.3); color: #000; border-radius: 50%;
}

.hkpm_calendar_row:not(.hkpm_calendar_row--week) a.active span,
.hkpm_calendar_row:not(.hkpm_calendar_row--week) a:not(.inactive):not(.other):hover span{
    border:1px solid #A28C57; background: #A28C57; color: #FFF; border-radius: 50%;
}
.hkpm_calendar_row:not(.hkpm_calendar_row--week) a.past,
.hkpm_calendar_row:not(.hkpm_calendar_row--week) a.other,
.hkpm_calendar_row:not(.hkpm_calendar_row--week) a.inactive{ opacity: 0.5; cursor:default; }

.hkpm_calendar_row:not(.hkpm_calendar_row--week) a.other{ visibility: hidden; }

.hkpm_calendar_row:not(.hkpm_calendar_row--week) a.soldout{
    opacity: 1 !important;
    /*
    background: url(../img/forbidden.png);
    background-size: 75%;
    background-repeat: no-repeat;
    background-position: center center;*/
    pointer-events: none;
}
.hkpm_calendar_row:not(.hkpm_calendar_row--week) a.soldout span{
    position: relative;
    border: 1px solid rgba(0,0,0,1); 
    border-radius: 50%; opacity: 0.3;
}
.hkpm_calendar_row:not(.hkpm_calendar_row--week) a.soldout span:after{
    content: ""; display: block;
    position: absolute;
    top:50%; left: 0px;
    width: 100%; height: 1px;
    background: rgba(0,0,0,1);
    transform: rotate(-45deg);
}

.hkpm_calendar_clear{ 
    margin-bottom: 20px;
    display: flex; align-items: flex-start; justify-content: space-between;
 }
 .hkpm_calendar_clear > a,
 .hkpm_calendar_clear > span{ width: 33.33%;}
 .hkpm_calendar_clear > a:nth-child(2),
 .hkpm_calendar_clear > span:nth-child(2){ text-align: center; }
 .hkpm_calendar_clear > a:nth-child(3),
 .hkpm_calendar_clear > span:nth-child(3){ text-align: right; }
 

@media screen and (max-width:1023px){ 
    .hkpm_calendar .hkpm_calendar_prev,
    .hkpm_calendar .hkpm_calendar_next,
    .hkpm_calendar_row:not(.hkpm_calendar_row--week) a span{ width: 40px; height: 40px; }
    .hkpm_calendar_row:not(.hkpm_calendar_row--week) a span{ font-size: 16px; }
    .hkpm_calendar_now{ font-size: 20px; }
}
@media screen and (max-width:767px){ 
    .hkpm_calendar .hkpm_calendar_prev,
    .hkpm_calendar .hkpm_calendar_next,
    .hkpm_calendar_row:not(.hkpm_calendar_row--week) a span{ width: 32px; height: 32px; }
    .hkpm_calendar_row:not(.hkpm_calendar_row--week) a span{ font-size: 14px; }
    .hkpm_calendar_now{ font-size: 18px; }
}
/*================================================================================*/
/*BOOKING INPUTS*/
/*================================================================================*/
input[type="radio"] {
    position: relative;
    width: 15px;
    height: 15px;
    vertical-align: middle; margin-bottom: 2px; margin-left: 2px; margin-right: 4px;
    background-color: transparent;
    border: 1px solid transparent;
}
input[type="radio"]:before {
    content:"";
    position: absolute;
    display: inline-block;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    border: 1px solid #000;
    top: -1px;
    left: -1px;
    background-color: #FFF;
}
input[type="radio"]:checked:after {
    content:""; 
    position: absolute;
    width: 11px;
    height: 11px;
    top: 2px;
    left: 2px;
    background-color: #5F5635;
    border-radius: 50%;
}
/*--------------------------------------------------------------------------------*/
input[type="checkbox"] {
    position: relative;
    width: 15px;
    height: 15px;
    vertical-align: middle; margin-bottom: 2px; margin-left: 2px; margin-right: 4px;
    background-color: transparent;
    border: 1px solid transparent;
}
input[type="checkbox"]:before {
    content:"";
    position: absolute;
    display: inline-block;
    width: 15px;
    height: 15px;
    border: 1px solid #000;
    top: -1px;
    left: -1px;
    background-color: #FFF;
}
input[type="checkbox"]:checked:after {
    content:""; 
    position: absolute;
    width: 15px;
    height: 15px;
    top: 0px;
    left: 0px;
    background-color: #5F5635;
    background-image: url(../img/svg/tick.svg);
    background-size: 10px;
    background-position: center center;
    background-repeat: no-repeat;
}
/*--------------------------------------------------------------------------------*/
.hkpm_input_text{ margin: 20px 0px; }
.hkpm_input_text p{ margin-bottom: 10px; font-weight: 500; }

.hkpm_input_text_box{
    display: flex; align-items: center; justify-content: space-between;
    border:1px solid #D7D7D7; border-radius: 300px;
}
.hkpm_input_text.invalid .hkpm_input_text_box{ border-color: #C66;} 

.hkpm_input_text_box input{
    border: none; background: none;  height: 40px;
    padding: 0px 20px; flex: 1;
}
.hkpm_input_text_box .hkpm_arr:hover:after{ right: 0px; }
/*--------------------------------------------------------------------------------*/
.hkpm_input_checkbox{
    display: flex; align-items: flex-start; justify-content: space-between ;
    margin: 10px 0px; max-width: 1000px;
}
.hkpm_input_checkbox span{ width: calc(100% - 30px); }
.hkpm_input_checkbox a{ color: #5F5635; text-decoration: underline; }
.hkpm_input_checkbox a:hover{ color: #5F5635; }
.hkpm_input_checkbox.invalid span,
.hkpm_input_checkbox.invalid a{ color: #C33; }
/*--------------------------------------------------------------------------------*/
.hkpm_input_step{ 
    display: flex; align-items: center; justify-content: flex-start;
    border: 1px solid #D7D7D7; border-radius: 30px;
    max-width: 200px;
}
.hkpm_input_step input{ 
    width: calc(100% - 80px); height: 40px; text-align: center;
    border: none; background: none; 
}
.hkpm_input_step a{ 
    width: 40px; text-align: center; 
    font-size: 20px; color: #000;;
    font-family: 'Courier New', Courier, monospace;
}
.hkpm_input_step a:hover{ opacity: 1; }

/*================================================================================*/
/*FORM INPUTS*/
/*================================================================================*/
p.mandate{ font-weight: 500; }
span.mandate{ font-size: 16px; color: #000;  display:block; }
.mandate:before{
    content: "*"; display: inline-block; margin-right: 5px;
    color: #A28C57;
}

.hkpm_form{ margin-bottom: 120px; }
.hkpm_form .hkpm_btn{ margin-right: 20px; }

.hkpm_form_body{
    width: 100%;
    display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap;
}

.hkpm_pop .hkpm_form{ margin-bottom: 0px; }
.hkpm_pop .hkpm_form .hkpm_form_input { margin-bottom: 20px; }

@media screen and (max-width:767px){
    .hkpm_form{ margin-bottom: 60px; } 
}
/*--------------------------------------------------------------------------------*/
.hkpm_form_input_title{ width: 100%; margin-bottom: 10px; }
.hkpm_form_input_title > *{ margin: 0px !important;}
.hkpm_form_input_note{ margin-top: -30px; margin-bottom: 40px; width: 100%; }

.hkpm_form_input{
    height: 60px; width: calc(50% - 20px); 
    position: relative; margin: 0px 0px 40px 0px;
}
.hkpm_form_input.hkpm_form_input--full,
.hkpm_pop .hkpm_form_input{ width: 100%; }

.hkpm_form_input--text,
.hkpm_form_input--placeholder{ 
    display: flex; align-items: center; justify-content: flex-start;
}

.hkpm_form_input .label,
.hkpm_form_input .upload{
    position: absolute; top:0px; left: 0px; width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: flex-start;
    padding: 0px 20px; pointer-events: none;
    transition: ease all 0.3s;
}
.hkpm_form_input .label{ z-index: 1; }

.hkpm_form_input .upload{ justify-content: space-between; }
.hkpm_form_input .upload .file{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: calc(100% - 80px); }
.hkpm_form_input .upload .text{ 
    padding-left: 20px;
    background-image: url(../img/upload.png);
    background-position: center left;
    background-repeat: no-repeat;
}

.hkpm_form_input select,
.hkpm_form_input input[type=text],
.hkpm_form_input input[type=file],
.hkpm_form_input input[type=password],
.hkpm_form_input textarea,
.hkpm_form_input .display,
.hkpm_form_input_col .display{
    font-size: 16px;
    position: absolute; 
    bottom:0px; left: 0px; width: 100%; height: 100%;   
    padding: 20px 40px 0px 20px; 
}

.hkpm_form_input select,
.hkpm_form_input input[type=text],
.hkpm_form_input input[type=file],
.hkpm_form_input input[type=password],
.hkpm_form_input textarea,
.hkpm_form_input .display,
.hkpm_form_input_col .display,
.hkpm_form_input .upload{
    background: none;  background-color: #FFF;
    border: 1px solid #D7D7D7; border-radius: 5px;
}
.hkpm_form_input.focused .display{ outline: 1px solid #000;}
.hkpm_form_input_col.focused .display{ outline: 1px solid #000;}

.hkpm_form_input.invalid select,
.hkpm_form_input.invalid input[type=text],
.hkpm_form_input.invalid input[type=file],
.hkpm_form_input.invalid input[type=password],
.hkpm_form_input.invalid textarea,
.hkpm_form_input.invalid .display,
.hkpm_form_input.invalid .upload{ border-color: #C33; }

.hkpm_form_input select:focus,
.hkpm_form_input input[type=text]:focus{ outline: 1px solid #000; }

.hkpm_form_input textarea{ resize: none !important; }
.hkpm_form_input select,
.hkpm_form_input input[type=file]{ opacity: 0; cursor: pointer; z-index: 2;  }

.hkpm_form_input .display,
.hkpm_form_input_col .display{ 
    display: flex; align-items: center; justify-content: flex-start; 
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; 
    position: relative; 
} 
.hkpm_form_input .display:after{
    content: ""; display: block;
    position: absolute;
    width: 5px; height: 5px; top:calc(50% - 6px); right: 20px;
    border-bottom: 1px solid #7B7475;
    border-right: 1px solid #7B7475;
    transform: rotate(45deg);  
}

.hkpm_form_input.readonly,
.hkpm_form_input.readonly .display,
.hkpm_form_input.readonly input[type="text"],
.hkpm_form_input.readonly select{ background: #F6F6F6 !important; } 

.hkpm_form_input.readonly:after,
.hkpm_form_input.readonly .display:after,
.hkpm_form_input_col.readonly .display:after{ display: none !important; }


.hkpm_form_input .error_message{
    display: none;
    position: absolute; top: 100%; left: 0px; width: 100%;
    padding: 5px 0px 0px 0px; 
}
.hkpm_form_input.invalid .error_message{ display: block; color: #C33; }
 .error_message{ display: block; color: #C33; }

@media screen and (max-width:1023px){ 
    .hkpm_form_input{ width: calc(50% - 10px); margin-bottom: 20px; }
    .hkpm_form_input.invalid_message{ margin-bottom: 40px; }
    .hkpm_form_input_note{ margin-top: -10px;  margin-bottom: 20px; }    
}
@media screen and (max-width:767px){
    .hkpm_form_input{ width: 100%; }
    .hkpm_form_input--text{ height: auto; margin-top: -10px; }
    .hkpm_form_input--placeholder{ display: none; }

    .hkpm_form_input .label,
    .hkpm_form_input .upload{ padding: 0px 10px; }

    .hkpm_form_input .display,
    .hkpm_form_input select,
    .hkpm_form_input input[type=text],
    .hkpm_form_input input[type=file],
    .hkpm_form_input input[type=password],
    .hkpm_form_input textarea{
        font-size: 14px;
        padding: 10px 40px 0px 10px;
    }
}
/*--------------------------------------------------------------------------------*/
.hkpm_form_input.notempty .label,
.hkpm_form_input.focused  .label,
.hkpm_form_input_col.notempty .label,
.hkpm_form_input_col.focused  .label{ font-size: 10px; height: 30px; }

.hkpm_form_input.notempty .upload,
.hkpm_form_input.focused  .upload{ padding-top: 20px; }
.hkpm_form_input.notnull  .upload{ padding-right: 40px; }

.hkpm_form_input.notnull:after{
    content: "*"; display: flex; align-items: center; justify-content: flex-end;
    position: absolute; top:0px; right: 20px; width: 20px; height: 100%;
    color: #A28C57; 
}
.hkpm_form_input:not(.hkpm_form_input--2col).notnull .display:after{ right: 45px; }
/*--------------------------------------------------------------------------------*/
.hkpm_form_input--textarea{ width: 100%; height: 300px; }
.hkpm_form_input--textarea .label,
.hkpm_form_input--textarea.notnull:after{ height: 60px; }
.hkpm_form_input--textarea textarea{ padding-top: 30px; }

.hkpm_form_input--textarea.focused .label,
.hkpm_form_input--textarea.notempty .label{ height: 30px; }
/*--------------------------------------------------------------------------------*/
.hkpm_form_input.hkpm_form_input--2col,
.hkpm_form_input.hkpm_form_input--3col{
    display: flex; align-items: center; justify-content: flex-start;
    border: 1px solid #D7D7D7; border-radius: 5px;
    background: #FFF;
}
.hkpm_form_input--2col .hkpm_form_input_col,
.hkpm_form_input--3col .hkpm_form_input_col{ position: relative; height: 100%; }

.hkpm_form_input--2colx .hkpm_form_input_col .display,
.hkpm_form_input--3colx .hkpm_form_input_col .display{ padding-top: 0px; }


.hkpm_form_input.hkpm_form_input--2col.invalid,
.hkpm_form_input.hkpm_form_input--3col.invalid{ border-color: #C33; }

.hkpm_form_input.hkpm_form_input--2col input,
.hkpm_form_input.hkpm_form_input--2col select,
.hkpm_form_input.hkpm_form_input--2col .display,
.hkpm_form_input.hkpm_form_input--3col input,
.hkpm_form_input.hkpm_form_input--3col select,
.hkpm_form_input.hkpm_form_input--3col .display{
    border: none;
}
/*--------------------------------------------------------------------------------*/
.hkpm_form_input--2col .hkpm_form_input_col:nth-of-type(1){ width: 120px; border-right: 1px solid #D7D7D7; }
.hkpm_form_input--2col .hkpm_form_input_col:nth-of-type(2){ width: calc(100% - 120px); }
/*--------------------------------------------------------------------------------*/
.hkpm_form_input--3col .hkpm_form_input_col:nth-of-type(1){ 
    display: flex; align-items: center; justify-content: flex-start;
    padding: 0px 20px; width: 40%; 
    display: none;
}
.hkpm_form_input--3col .hkpm_form_input_col:nth-of-type(2){ width: 50%; border-left: 1px solid #D7D7D7; border-left: none; }
.hkpm_form_input--3col .hkpm_form_input_col:nth-of-type(3){ width: 50%; border-left: 1px solid #D7D7D7;  }


.hkpm_form_input--3col .hkpm_form_input_col.notnull .display:after{ right: 40px;;}
.hkpm_form_input--3col .hkpm_form_input_col.notnull:after{
    content: "*"; color: #A28C57;
    position: absolute; top: 0px; right:10px; width: 20px; height: 100%;
    display: flex; align-items: center; justify-content: center;
}
@media screen and (max-width:767px){
    .hkpm_form_input--3col .hkpm_form_input_col:nth-of-type(1){ padding: 0px 10px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_form_input--radio{ 
    width: 100%; height: auto; padding: 20px 20px 10px 20px;
    display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap;
    border: 1px solid #D7D7D7; border-radius: 5px;
    background: #FFF;
}
.hkpm_form_input_radio_text{ width: calc(50% + 20px); padding: 0px 40px 20px 0px; }
.hkpm_form_input_radio_text.short{ width: 25%; }
.hkpm_form_input_radio{ flex : 1; display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; }

.hkpm_form_input_radio label{ 
    display: flex; align-items: center; justify-content: flex-start; /*flex-wrap: wrap;*/
    margin: 0px 40px 20px 0px; 
}
.hkpm_form_input_radio label span{ margin-left: 10px; }
.hkpm_form_input_radio label input[type=text]{ 
    display: block; position: static; flex: 1;
    padding: 0px; margin: 0px 0px 0px 10px;    
    border:none; border-radius: 0px;
    border-bottom: 1px solid #999;
}

@media screen and (max-width:1023px){     
    .hkpm_form_input_radio_text{ width: 100%; }
    .hkpm_form_input_radio_text.short{ width: 100%; }
    .hkpm_form_input_radio{ flex: auto; }
}
@media screen and (max-width:479px){     
    .hkpm_form_input_radio label input[type=text]{ width: 100%; flex: auto; margin: 10px 0px 0px 0px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_form_input--calendar{
    width: 100%; height: auto; overflow: visible;
    display: flex; align-items: stretch; justify-content: flex-start; flex-wrap: wrap;
    border: 1px solid #D7D7D7; border-radius: 5px;
    background: #FFF;
}
.hkpm_form_input_cal_text{ 
    width: 15%; border-right: 1px solid #D7D7D7;
    display: flex; align-items: center; justify-content: flex-start;
    padding: 10px 20px; min-height: 60px;
}
.hkpm_form_input_cal_date{ 
    position: relative; 
    width: 35%; border-right: 1px solid #D7D7D7;
}
.hkpm_form_input_cal_date .cal_display{
    position: absolute; width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: flex-start;
    padding: 0px 40px 0px 20px;
}
.hkpm_form_input_cal_date .cal_display:after{
    content: ""; display: block;
    position: absolute; top:calc(50% - 10px); right: 10px;
    width: 20px; height: 20px;
    background-image: url(../img/svg/icon-cal.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
}

.hkpm_form_input_cal_date .hkpm_calendar {
    position: absolute; z-index: 10;
    top: 100%; left: -1px; width: calc(50vw - 40px); max-width: 600px;    
    padding: 20px; margin: 0px;
    background: #FFF; border: 1px solid #D7D7D7;
    display: none;
}
.hkpm_form_input_cal_date.open .hkpm_calendar{ display: block; }

.hkpm_form_input_cal_time{ 
    width: 50%; padding-left: 20px;
    display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; 
}
.hkpm_form_input_cal_time label{ 
    display: flex; align-items: center; justify-content: flex-start;
    margin: 10px 40px 10px 0px; 
}
@media screen and (max-width:767px){     
    .hkpm_form_input_cal_text{ width: 180px; }
    .hkpm_form_input_cal_date{ width: calc(100% - 180px); border:none; }
    .hkpm_form_input_cal_time{ width: 100%;  border-top: 1px solid #D7D7D7; padding: 10px 20px; }

    .hkpm_form_input_cal_date .hkpm_calendar { width: calc(100vw - 80px); right: -1px; left: auto; }
}
@media screen and (max-width:479px){     
    .hkpm_form_input_cal_text{ width: 120px; }
    .hkpm_form_input_cal_date{ width: calc(100% - 120px); border:none; }
    .hkpm_form_input_cal_date .hkpm_calendar { width: calc(100vw - 40px); }
}
/*--------------------------------------------------------------------------------*/
.hkpm_form_checklist{
    display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap;
    width: calc(100% + 20px);
}
.hkpm_form_checklist label{
    width: calc(50%  - 20px); margin: 0px 20px 20px 0px; padding: 15px 20px;
    display: flex; align-items: center; justify-content: flex-start;
    border: 1px solid #D7D7D7;
}
.hkpm_form_checklist label input{ margin-right: 10px; }

@media screen and (max-width:767px){
    .hkpm_form_checklist{ width: 100%; flex-wrap: wrap; }
    .hkpm_form_checklist label{ width: 100%; margin: 0px 0px 10px 0px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_form_input_table{ width: 100%; }
.hkpm_form_input_table.js-member_add_body{ padding-top: 40px; }

.hkpm_form_input_table .row{
    display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;
}
.hkpm_form_input_table .cell:nth-of-type(1){ flex: 1; padding-right: 20px; }
.hkpm_form_input_table .cell:nth-of-type(2){ width: 180px; }
.hkpm_form_input_table .cell--sub{ 
    width: 540px !important; 
    display: flex; align-items: center; justify-content: flex-start;
} 
.hkpm_form_input_table .cell--sub .sub:nth-of-type(1){ width: 180px; }
.hkpm_form_input_table .cell--sub .sub:nth-of-type(2){ flex: 1; }
.hkpm_form_input_table .cell--sub .sub:nth-of-type(3){ width: 180px; }
.hkpm_form_input_table .cell_total{ transition: ease all 0.3s; }

.hkpm_form_input_table .cell-expand{ position: relative; padding-right: 20px; }
.hkpm_form_input_table .cell-expand a{
    position: absolute; display: block;
    top: calc(50% - 10px); right: 0px;
    width: 20px; height: 20px;
}
.hkpm_form_input_table .cell-expand a:before{
    content: "+";
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    font-family: 'Courier New', Courier, monospace;    
}
.hkpm_form_input_table .expanded .cell-expand a:before{ content: "-"; }
.hkpm_form_input_table .expanded .cell_total{ opacity: 0; }

.hkpm_form_input_table .row--body{ padding: 20px 0px; border-bottom:1px solid #D7D7D7; }
.hkpm_form_input_table .row--body:last-of-type{ border: none; }
.hkpm_form_input_table .row--body .cell{ font-size: 20px; }

.hkpm_form_input_table .row--head{ border: none; }
.hkpm_form_input_table .row--head .cell{ font-size: 24px; }
.hkpm_form_input_table .row--head .cell:last-of-type,
.hkpm_form_input_table .row--head .sub:nth-child(2),
.hkpm_form_input_table .row--head .sub:nth-child(3){ color: #7B7475; }

.hkpm_form_input_table input[type=radio],
.hkpm_form_input_table input[type=checkbox]{ margin-right: 20px; }

.hkpm_form_input_table .error_message{ padding-top: 10px;}

.hkpm_form_input_table.invalid .row--head .cell,
.hkpm_form_input_table.invalid .row--body .cell{ color: #C33; }
/*--------------------------------------------------------------------------------*/
.hkpm_form_input_table .row--breakdown{
    padding: 10px 0px 0px 0px;
}
.hkpm_form_input_table .row--total{
    padding: 10px 0px 0px 0px; margin: 10px 0px 0px 0px;
    border-top: 1px solid #D7D7D7;
}
.hkpm_form_input_table--price{
    padding: 0px 0px 20px 0px; border-bottom:1px solid #D7D7D7; margin-bottom: 40px;
}
.hkpm_form_input_table--price .row--head .cell:last-of-type{ color: #000; }

/*--------------------------------------------------------------------------------*/
.hkpm_form_input_table_add{
    padding: 40px 0px; font-size: 24px; width: 100%;
    border-top: 1px solid #D7D7D7;
}
.hkpm_form_input_table_add a:before{ content: "+"; color: #5F5635; display: inline-block; margin-right: 10px; }
.hkpm_form_input_table_add a span{ color: #000; text-decoration: underline;}

.hkpm_form_input_table .hkpm_form_input_table_add{
    font-size: inherit; padding: 0px; border: none;
}
.hkpm_form_input_table .hkpm_form_input_table_add a:before{ content: "-"; }

@media screen and (max-width:1023px){     
    .hkpm_form_input_table .cell--sub{ width: 100% !important; margin-top: 20px; }   

    .hkpm_form_input_table .row--body .cell{ font-size: 18px; }
    .hkpm_form_input_table .row--head .cell{ font-size: 20px; }
    .hkpm_form_input_table .row--body{ padding: 20px 0px; }

    .hkpm_form_input_table_add{ font-size: 20px; padding: 30px 0px; }
}
@media screen and (max-width:767px){ 
    .hkpm_form_input_table .cell:nth-of-type(2){ width: 150px; }
    .hkpm_form_input_table .cell--sub .sub:nth-of-type(1){ width: 150px; }
    .hkpm_form_input_table .cell--sub .sub:nth-of-type(3){ width: 150px; }

    .hkpm_form_input_table .row--body .cell{ font-size: 16px; }
    .hkpm_form_input_table .row--head .cell{ font-size: 16px; }
    .hkpm_form_input_table .row--body{ padding: 20px 0px; }
    
    .hkpm_form_input_table_add{ font-size: 16px; padding: 20px 0px; }
}
@media screen and (max-width:479px){ 
    .hkpm_form_input_table .cell:nth-of-type(2){ width: 80px; }
    .hkpm_form_input_table .cell--sub .sub:nth-of-type(1){ width: 150px; }
    .hkpm_form_input_table .cell--sub .sub:nth-of-type(3){ width: 80px; }
    .hkpm_form_input_table .row--body .cell{ font-size: 16px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_form_stepper{
    display: flex; align-items: center; justify-content: center;
    border: 1px solid #D7D7D7; border-radius: 30px;
    width: 120px;
}
.hkpm_form_stepper input{ 
    width: calc(100% - 80px); 
    border: none; background: none; color: #000;
    text-align: center; font-size: 16px;
}
.hkpm_form_stepper a{ 
    font-family: 'Courier New', Courier, monospace;
    width: 40px; height: 40px; font-size: 18px;
    display: flex; align-items: center; justify-content: center;
}
/*================================================================================*/
/*AUDIO*/
/*================================================================================*/
.hkpm_row--audio{ justify-content: space-between; align-items: flex-start; margin: 60px 0px 120px 0px; }
.hkpm_row--audio .hkpm_col{ width: calc(50% - 40px); }

@media screen and (max-width:1279px){ 
    .hkpm_row--audio .hkpm_col{ width: calc(50% - 20px); }
}
@media screen and (max-width:1023px){ 
    .hkpm_row--audio{ margin: 40px 0px 60px 0px; }
    .hkpm_row--audio .hkpm_col{ width: calc(50% - 10px); }
}
@media screen and (max-width:767px){ 
    .hkpm_row--audio{ margin: 20px 0px 40px 0px; }
    .hkpm_row--audio{ flex-wrap: wrap; }
    .hkpm_row--audio .hkpm_col{ width: 100%; }
}
@media screen and (max-width:479px){ 
    .hkpm_row--audio{ margin: 20px 0px 0px 0px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_playlist{ display: block; }
.hkpm_playlist .hkpm_playlist_info{
    padding: 15px 30px;
    border: 1px solid #D7D7D7;
    display: flex;  align-items: center; justify-content: flex-start;
}
.hkpm_playlist .hkpm_playlist_info .name{ margin-right: auto; }
.hkpm_playlist .hkpm_playlist_info .btn{
    display: block;
    margin-left: 10px; padding-left: 10px;
    border-left: 1px solid #A28C57;
}
.hkpm_playlist .hkpm_playlist_info .btn:after{
    content: ""; display: inline-block; vertical-align: middle;
    width: 5px; height: 5px; margin-left: 5px;
    border-top:1px solid #000;
    border-right:1px solid #000;
    transform: rotate(45deg);  
}
.hkpm_playlist .hkpm_playlist_info .btn:hover{ text-decoration: underline; }

.hkpm_playlist .hkpm_playlist_items a{
    display: flex;  align-items: center; justify-content: flex-start;
    padding: 15px 30px;
    background: #F6F6F6;
    border: 1px solid #D7D7D7;
    border-top: none;
}
.hkpm_playlist .hkpm_playlist_items .image{ width: 55px; }
.hkpm_playlist .hkpm_playlist_items .name{ flex: 1; padding: 0px 20px; }
.hkpm_playlist .hkpm_playlist_items .desc,
.hkpm_playlist .hkpm_playlist_items .longdesc{ display: none;}
.hkpm_playlist .hkpm_playlist_items .wave{ width: 32px; display: none; }

.hkpm_playlist .hkpm_playlist_items .image img{ width: 55px; height: 55px; display: block; }
.hkpm_playlist .hkpm_playlist_items a:after{
    content: ""; display: block;
    width: 32px; height: 32px;
    border: 1px solid #D7D7D7; border-radius: 50%;
    background-image: url(../img/play.png);
    background-position: center center;
    background-repeat: no-repeat;
}
.hkpm_playlist .hkpm_playlist_items a:hover,
.hkpm_playlist .hkpm_playlist_items a.active,
.hkpm_playlist .hkpm_playlist_items a.playing{ background: #FFF; }
.hkpm_playlist .hkpm_playlist_items a.playing:after{ display: none; }

.hkpm_playlist .hkpm_playlist_items a.playing .wave{ 
    display: flex; align-items: center; justify-content: center;
}
.hkpm_playlist .hkpm_playlist_items a.playing .wave span{
    display: flex; align-items: center; justify-content: flex-start;
}
.hkpm_playlist .hkpm_playlist_items a.playing .wave span:before,
.hkpm_playlist .hkpm_playlist_items a.playing .wave span:after{
    content: ""; display: block;
    width: 1px; height: 20px; background: #A28C57;
    margin-right: 1px;
    animation: wave 1s linear infinite;
    transform: scale(0.1);
}
.hkpm_playlist .hkpm_playlist_items a.playing .wave span:nth-child(1):before{ animation-delay: 0.1s; }
.hkpm_playlist .hkpm_playlist_items a.playing .wave span:nth-child(1):after { animation-delay: 0.2s; }
.hkpm_playlist .hkpm_playlist_items a.playing .wave span:nth-child(2):before{ animation-delay: 0.3s; }
.hkpm_playlist .hkpm_playlist_items a.playing .wave span:nth-child(2):after { animation-delay: 0.2s; }
.hkpm_playlist .hkpm_playlist_items a.playing .wave span:nth-child(3):before{ animation-delay: 0.1s; }
.hkpm_playlist .hkpm_playlist_items a.playing .wave span:nth-child(3):after { animation-delay: 0.2s; }
.hkpm_playlist .hkpm_playlist_items a.playing .wave span:nth-child(4):before{ animation-delay: 0.3s; }
.hkpm_playlist .hkpm_playlist_items a.playing .wave span:nth-child(4):after { animation-delay: 0.4s; }
.hkpm_playlist .hkpm_playlist_items a.playing .wave span:nth-child(5):before{ animation-delay: 0.5s; }
.hkpm_playlist .hkpm_playlist_items a.playing .wave span:nth-child(5):after { animation-delay: 0.4s; }

.hkpm_playlist .hkpm_playlist_items a.nosound:after{ display: none; }

@keyframes wave {
    0%  { transform: scaleY(0.1); }        
    50%{ transform: scaleY(1); }     
    100%{ transform: scaleY(0.1); }    
}

.hkpm_playlist_desc img{ width: 100%; }
.hkpm_playlist_desc h3{ margin: 20px 0px 0px 0px; }
.hkpm_playlist_desc p { margin: 0px 0px 20px 0px; }

@media screen and (max-width:767px){ 
    .hkpm_playlist_desc{ padding-bottom: 20px;}
    .hkpm_playlist_desc .js-audio_name,
    .hkpm_playlist_desc .js-audio_desc,
    .hkpm_playlist_desc .js-audio_longdesc{
        display: none;
    }
}
@media screen and (max-width:479px){ 
    .hkpm_playlist{ margin-left: -20px; width: calc(100% + 40px); }
}
/*--------------------------------------------------------------------------------*/
.hkpm_player{
    background: #7B7475; color: #FFF;
    display: none; align-items: center; justify-content: space-between; 
    padding: 30px 30px; 
}
.hkpm_player.show{ display: flex; }

.hkpm_player audio{ width: 100%; display: none; }
.hkpm_player h3{ font-size: 20px; }
.hkpm_player .hkpm_player_main{ width: calc(100% - 100px); padding-right: 20px; }
.hkpm_player .hkpm_player_transcript{ width: 100px; text-align: right; }
.hkpm_player .hkpm_player_transcript a{ white-space: nowrap; }
.hkpm_player .hkpm_player_transcript a:after{
    content: ""; display: inline-block; vertical-align: middle; 
    width: 5px; height: 5px; margin-left: 5px; 
    border-top:1px solid #FFF; 
    border-right:1px solid #FFF; 
    transform: rotate(45deg); 
}
.hkpm_player .hkpm_player_transcript a:hover{ text-decoration: underline; }

.hkpm_player .hkpm_player_interface{
    display: flex; align-items: center; justify-content: space-between;
}
.hkpm_player .hkpm_player_interface .play{ display:block; width: 32px; height: 32px; position: relative; }
.hkpm_player .hkpm_player_interface .play:after{
    content: ""; display: block; 
    width: 32px; height: 32px;     
    background-image: url(../img/play2.png);
    background-position: center center;
    background-repeat: no-repeat;
    transition: none;
}
.hkpm_player .hkpm_player_interface .play.playing:after{
    position: absolute; top:6px; left: 8px; width: 6px; height: 20px;
    background: #FFF;
}
.hkpm_player .hkpm_player_interface .play.playing:before{
    content: ""; display: block; 
    position: absolute; top:6px; right: 8px; width: 6px; height: 20px;
    background: #FFF;
}

.hkpm_player .hkpm_player_interface .play span{ display: none; }
.hkpm_player .hkpm_player_interface .timeline{
    width: calc(100% - 32px - 20px);
    display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;
    font-size: 12px; cursor: pointer;
}
.hkpm_player .hkpm_player_interface .timeline .line{
    height: 5px; background: rgba(255,255,255,0.3); width: 100%; 
    margin-bottom: 5px; margin-top: 20px;
    position: relative; border-radius: 10px; overflow: hidden;
}
.hkpm_player .hkpm_player_interface .timeline .line span{
    position: absolute; top:0px; left: 0px; width: 0%; height: 100%;
    background: #FFF;
}

@media screen and (max-width:1023px){ 
    .hkpm_playlist .hkpm_playlist_info{ padding: 10px 20px; }
    .hkpm_playlist .hkpm_playlist_items a{ padding: 10px 20px; }
    .hkpm_player{ padding: 20px 20px; }

    .hkpm_player .hkpm_player_main{ width: calc(100% - 60px);}
    .hkpm_player .hkpm_player_transcript{ width: 60px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_floorplan{ padding: 120px 0px; background: #F6F6F6; text-align: center; }
.hkpm_floorplan h3{ 
     margin-bottom: 40px; 
}
.hkpm_floorplan h3 span{
    display: inline-block; border-bottom: 2px solid #000; padding-bottom: 5px;
}
.hkpm_floorplan img{ display: block; margin: 0px auto; }

@media screen and (max-width:1023px){ 
    .hkpm_floorplan{ padding: 60px 0px;}
}
@media screen and (max-width:767px){ 
    .hkpm_floorplan{ padding: 60px 0px;}
}
/*--------------------------------------------------------------------------------*/
.hkpm_media{ display: block; position: relative;}
.hkpm_media:before{
    content: ""; display: block;
    padding-bottom: 56.25%; background: #000;
}
.hkpm_media video,
.hkpm_media img{
    position: absolute; top:0px; left: 0px; width: 100%; height: 100%;
}
.hkpm_media img{ object-fit: cover;}
.hkpm_media a{
    position: absolute; 
    top: calc(50% - 24px); left: calc(50% - 24px); width: 48px; height: 48px;
    background-color: #5F5635; 
    background-image: url(../img/play2.png);
    background-repeat: no-repeat;
    background-position:  center center;
    background-size: 25%;
    border-radius: 50%;
}
.hkpm_media a span{ display: none;}
.hkpm_media a:hover{ background-color: #53504e;} 
/*================================================================================*/
/*EVENT FILTER*/
/*================================================================================*/
.hkpm_filter{
    display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap;
    margin: 20px 0px;
}
.hkpm_filter .hkpm_filter_tag,
.hkpm_filter .hkpm_filter_select{ width: calc(50% - 20px); }
.hkpm_filter .hkpm_filter_tag--full{ width: 100%; }

.hkpm_filter.hkpm_filter--center{ justify-content:center; } 
.hkpm_filter.hkpm_filter--vr{ justify-content:center; margin: 20px 0px 0px 0px; }

@media screen and (min-width:1024px){
    /* .hkpm_filter{ margin: 10px 0px; } */
    .hkpm_filter .hkpm_filter_item--quarter{ width: calc(25% - 20px) !important; }
    .hkpm_filter .hkpm_filter_item--3-4{ width: calc(75% - 20px) !important; }
    .hkpm_filter.hkpm_filter--vr{ justify-content:center; margin: 10px 0px 0px 0px; }
}
@media screen and (max-width:1023px){     
    .hkpm_filter{ margin: 5px 0px; }
    .hkpm_filter .hkpm_filter_tag,
    .hkpm_filter .hkpm_filter_select,
    .hkpm_filter .hkpm_filter_search{ width: 100%; margin: 10px 0px; }
    .hkpm_filter.hkpm_filter--vr{ justify-content:center; margin: 5px 0px 0px 0px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_filter .hkpm_filter_tag{
    position: relative; padding-right: 60px;
    border-bottom: 1px solid #D7D7D7; 
}
.hkpm_filter .hkpm_filter_slider .swiper-slide{ width: auto; }

.hkpm_filter .hkpm_filter_slider a{
    font-size: 19px;
    position: relative; 
    display: flex;  align-items: center; justify-content: flex-start;
    border-bottom: 1px solid rgba(0,0,0,0);    
    height: 40px; 
}
.hkpm_filter .hkpm_filter_slider a.active,
.hkpm_filter .hkpm_filter_slider a:hover{ border-color: #A28C57; opacity: 1; color: #5F5635; }

.hkpm_filter .swiper-button-prev,
.hkpm_filter .swiper-button-next{
    position: absolute;  
    display: flex; align-items: center; justify-content: center;
    top: 0px; right: 0px; left: auto;
    width: 30px; height: 40px; 
}
.hkpm_filter .swiper-button-prev{ right: 30px; }

.hkpm_filter .swiper-button-prev:after,
.hkpm_filter .swiper-button-next:after{ 
    content: ""; display: block;
    width: 5px; height: 5px;
    border-top:1px solid #A28C57;
    border-right:1px solid #A28C57;
    background: none;
    transform: rotate(45deg); 
}
.hkpm_filter .swiper-button-prev:after{ transform: rotate(-135deg); }
/*--------------------------------------------------------------------------------*/
.hkpm_filter .hkpm_filter_select{
    display: flex; align-items: flex-end; justify-content: space-between;
}
.hkpm_filter .hkpm_filter_select .hkpm_filter_inputbox{
    width: calc(50% - 20px);     
    position: relative; border-bottom: 1px solid #A28C57;
    
}
.hkpm_filter .hkpm_filter_select .hkpm_filter_inputbox.w-100 {
    width: 100%;
}
.hkpm_filter .hkpm_filter_select .hkpm_filter_inputbox:before{
    content: ""; display: block; height: 2em;
}
.hkpm_filter .hkpm_filter_select .label,
.hkpm_filter .hkpm_filter_select .input{
    position: absolute; top:0px; left: 0px; width: 100%; height: 100%;
    cursor: pointer; font-size: 19px;
}
.hkpm_filter .hkpm_filter_select .label{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis;  padding-right: 40px;}
.hkpm_filter .hkpm_filter_select .label:after{    
    content: ""; display: block;
    position: absolute; top:calc(50% - 7px); right: 5px;
    width: 5px; height: 5px;
    border-bottom:1px solid #A28C57;
    border-right:1px solid #A28C57;
    transform: rotate(45deg); 
}
.hkpm_filter .hkpm_filter_select .input{ opacity: 0; }
.hkpm_filter .hkpm_filter_select .input:focus{ opacity: 1; }

.hkpm_filter .hkpm_filter_select .hkpm_calendar{
    position: absolute; z-index: 10;
    top:100%; left: 0px; width: calc(50vw - 40px); max-width: 600px; 
    padding: 20px;  margin: 0px; 
    background: #FFF; border: 1px solid #D7D7D7;
    display: none;
}
.hkpm_filter .hkpm_filter_select .hkpm_filter_inputbox.open .hkpm_calendar{
    display: block;
}
@media screen and (max-width:1023px){     
    .hkpm_filter .hkpm_filter_select .hkpm_filter_inputbox{ width: calc(50% - 10px); }
    .hkpm_filter .hkpm_filter_select .hkpm_calendar{ width: calc(100vw - 40px); padding: 10px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_filter .hkpm_filter_search{ width: calc(50% - 20px); }
.hkpm_filter .hkpm_filter_search input{
    font-size: 16px;
    display: block; width: 100%; height: 2.5em;
    background: none; border: none;
    border-bottom: 1px solid #A28C57;
    padding: 0px 0px 0px 40px;

    background-image: url(../img/svg/icon-search-g.svg);
    background-position: center left ;
    background-size: 20px;
    background-repeat: no-repeat;
}
@media screen and (max-width:1023px){     
    .hkpm_filter .hkpm_filter_search{ width: 100%; margin: 10px 0px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_lookback{ padding-bottom: 80px;  }
.hkpm_lookback > h3{ margin-top: 40px; }
.hkpm_lookback_item{
    display:flex; align-items:center; justify-content:flex-start;
    padding: 20px 0px; border-bottom:1px solid #999; 
}
.hkpm_lookback_item_img{ width: 200px; height: 133px; overflow: hidden;  }
.hkpm_lookback_item_img img{ width: 100%; height: auto; display:block; }
.hkpm_lookback_item_text{ width: calc(100% - 200px); padding-left: 40px; }
.hkpm_lookback_item_text .hkpm_arr{ display: inline-block; margin-top: 10px;}
.hkpm_lookback .hkpm_lookback_item.data_template{ display:none; }

@media screen and (max-width:767px){  
    .hkpm_lookback{ padding-bottom: 40px;}
    .hkpm_lookback_item{ flex-wrap: wrap; }
    .hkpm_lookback_item_text{ width: 100%;; padding-left: 0px; padding-top: 20px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_publication{ 
    display: flex; align-items: stretch; justify-content: flex-start; flex-wrap: wrap;
    padding-bottom: 100px; width: calc(100% - 20px);
}
.hkpm_publication .hkpm_publication_item{ width: calc(25% - 20px); margin: 0px 20px 20px 0px; } 
.hkpm_publication_item{ 
    position: relative;
    padding: 20px 20px 20px 20px;
}
.hkpm_publication_item:before{
    content: ""; display: block;
    position: absolute; background: #F6F6F6;
    width: 100%; height: 80%; left: 0px; bottom:0px
}
.hkpm_publication_item_img{ position: relative;  }
.hkpm_publication_item_img:before{ content: ""; display: block; padding-bottom: 100%; }
.hkpm_publication_item_img .img{ 
    position: absolute; width: 100%; height: 100%; top:0px; left: 0px;
    display: flex; align-items: flex-end; justify-content: flex-start;
}
.hkpm_publication_item_img .img img{ max-width: 100%; max-height: 100%; width: auto; height: auto; }

.hkpm_publication_item_text{ position: relative; padding: 20px 0px; }
.hkpm_publication_item_text h3{ margin: 5px 0px 20px 0px;}

@media screen and (max-width:1279px){
    .hkpm_publication .hkpm_publication_item{ width: calc(33.33% - 20px); }
}
@media screen and (max-width:1023px){
    .hkpm_publication_item{ padding-top: 10px; }
    .hkpm_publication .hkpm_publication_item{ width: calc(50% - 20px); }
}
@media screen and (max-width:767px){
    .hkpm_publication{ margin-top: 20px; }
}
@media screen and (max-width:479px){
    .hkpm_publication{ width: 100%; }
    .hkpm_publication_item{ padding-top: 0; }
    .hkpm_publication .hkpm_publication_item{ width: calc(100% - 0px); margin-right: 0px; }
    .hkpm_publication_item_img .img img{ height: 100%; width: 100%; object-fit: contain; object-position: center left; }
}
/*================================================================================*/
/*EXHIBITION DETAIL*/
/*================================================================================*/
.hkpm_row--exhibtion{ align-items: flex-start; margin: 120px 0px 60px 0px; }
.hkpm_row--exhibtion .hkpm_col{ width: 50%;}
.hkpm_row--exhibtion .hkpm_col:first-of-type{ padding-right: 80px; }
.hkpm_row--exhibtion img{ width: 100%; height: auto; display: block; }



@media screen and (max-width:1279px){
    .hkpm_row--exhibtion .hkpm_col:first-of-type{ padding-right: 40px; }
}
@media screen and (max-width:1023px){
    .hkpm_row--exhibtion{ margin:60px 0px 40px 0px; flex-wrap: wrap; }
    .hkpm_row--exhibtion h3{ margin-bottom: 20px; }
    .hkpm_row--exhibtion .hkpm_col{ width: 100%; }
    .hkpm_row--exhibtion .hkpm_col:first-of-type{ padding-right: 0px; }

    .hkpm_row--invert{ flex-direction: column-reverse; }
}
@media screen and (max-width:767px){
    .hkpm_row--exhibtion{ margin:40px 0px 20px 0px; }
    .hkpm_row--exhibtion .hkpm_action .hkpm_arr{
        margin: 0px 40px 10px 0px; border: none; padding-left: 0px;
    }
}
/*--------------------------------------------------------------------------------*/
.hkpm_exhibition_slider.hkpm_exhibition_slider--home{
    max-width: 1280px; margin: 0px auto; margin-top: 40px;
}
.hkpm_exhibition_slider--vr .swiper-wrapper {
    height: auto;
}
@media screen and (min-width:768px){
    .hkpm_exhibition_slider--home,
    .hkpm_exhibition_slider--vr { overflow: visible; width: 100%;}
}
.hkpm_exhibition_slider_title h3{ margin: 0px !important; max-width: 100% !important;}
.hkpm_exhibition_slider_title p { margin: 10px 0px 0px 0px !important; }
.hkpm_exhibition_slider_title > :first-child{ max-width: 75%; }
.hkpm_exhibition_slider_title .hkpm_arr{ margin-top: 10px; display: inline-block;  }

.hkpm_exhibition_slider_nav{ display: flex; align-items: flex-start; justify-content: flex-end; }
.hkpm_exhibition_slider_nav .swiper-pagination-bullet{ margin: 0px 0px 0px 20px; }
.hkpm_exhibition_slider_nav .swiper-button-prev,
.hkpm_exhibition_slider_nav .swiper-button-next{  margin: 5px 0px 0px 20px; }

.hkpm_exhibition_slider_nav.hkpm_exhibition_slider_nav--left{ justify-content: flex-start; }
.hkpm_exhibition_slider_nav.type-2 {
    --swiper-navigation-size: 80px;
}
.hkpm_exhibition_slider_nav.type-2 .swiper-button-prev:after {
    background-image: url(../img/svg/arr-xlg_l.svg);
}
.hkpm_exhibition_slider_nav.type-2 .swiper-button-next:after {
    background-image: url(../img/svg/arr-xlg.svg);
}
.hkpm_exhibition_slider_nav.type-2:has(.swiper-button-disabled + .swiper-button-next.swiper-button-disabled) {
    display: none;
}
.hkpm_exhibition_slider_nav.hide {
    display: none;
}
/* html,body{ overflow-x: hidden !important;} */
.hkpm_exhibition_slider .swiper-slide{  max-width: 540px;  }
.hkpm_exhibition_slider .swiper-slide img{ margin-bottom: 10px; max-height: 100%; }
.hkpm_exhibition_slider .swiper-slide h3,
.hkpm_exhibition_slider .swiper-slide h4{ margin: 0px 0px 5px 0px; }
.hkpm_exhibition_slider .swiper-slide p{ margin:0px; }
.hkpm_exhibition_slider .swiper-slide .hkpm_arr{ margin-top: 20px; display: inline-block; }

.hkpm_exhibition_slider_mnav{ display: none; padding-top: 10px; text-align: center; }

.hkpm_exhibition_slider_title{
    display: flex; align-items: flex-end; justify-content: space-between;
    margin: 0px 0px 20px 0px;
}
.hkpm_exhibition_slider--tour .swiper-slide{ max-width: 320px; }
.hkpm_exhibition_slider--tour .swiper-slide .hkpm_arr{ margin-top: 10px; }

@media screen and (max-width:1279px){
    .hkpm_exhibition_slider_title > :first-child{ max-width: 50%; }
    .hkpm_exhibition_slider.hkpm_exhibition_slider--home{ margin: 0px 20px 0px 20px; width: auto; }
}
@media screen and (max-width:1023px){
    .hkpm_exhibition_slider_title{ flex-wrap: wrap; }
    .hkpm_exhibition_slider_title > :first-child{ max-width: 100%; }
    .hkpm_exhibition_slider_nav{ width: 100%; margin-top: 20px; }
    .hkpm_exhibition_slider_nav .swiper-button-prev,
    .hkpm_exhibition_slider_nav .swiper-button-next{  margin: 0px 0px 0px 20px; }
}
@media screen and (max-width:767px){
    .hkpm_exhibition_slider .swiper-slide{ max-width: 100%; }
    .hkpm_exhibition_slider .swiper-slide img{ max-height: 100%; width: auto;}
    .hkpm_exhibition_slider--home .swiper-slide img{ max-height: 100%; width: 100%;}

    .hkpm_exhibition_slider--tour .swiper-slide{ max-width: 240px; }
    .hkpm_exhibition_slider_nav { display: none; }
    .hkpm_exhibition_slider_mnav{ display: block; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_volunteer{
    display: flex; align-items: center; justify-content: flex-start;
}
.hkpm_volunteer img{ 
    width: 64px; height: auto;
    margin-right: 20px;
}
/*--------------------------------------------------------------------------------*/
.hkpm_img{ width: 100%; position: relative; }
.hkpm_img:before{ content:""; display:block; padding-bottom: 75%; }
.hkpm_img img{
    position: absolute; top:0px; left: 0px; width: 100%; height: 100%;
    display: block; object-position: center center; object-fit: contain;
    background: #F6F6F6;
}
/*--------------------------------------------------------------------------------*/
/* EVENT/EXHIBTION SLIDE POP UP */ 
.hkpm_row--event{ align-items: flex-start; }
.hkpm_row--event .hkpm_col:first-of-type{ width: 66%; }
.hkpm_row--event .hkpm_col:last-of-type { width: 33%;  padding-left: 40px; }

@media screen and (max-width:1023px){    
    .hkpm_row--event .hkpm_col:first-of-type{ width: 50%; }
    .hkpm_row--event .hkpm_col:last-of-type { width: 50%;  padding-left: 20px; }
}
@media screen and (max-width:767px){    
    .hkpm_row--event{ flex-wrap: wrap; }
    .hkpm_row--event .hkpm_col:first-of-type{ width: 100%; }
    .hkpm_row--event .hkpm_col:last-of-type { width: 100%; padding-top: 20px; padding-left: 0px; }
}
/*================================================================================*/
/*CRUMB*/
/*================================================================================*/
.hkpm_crumb{
    display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
}
.hkpm_crumb--large-btm { margin-bottom: 80px;}
.hkpm_crumb > a{
    color: #000; font-size: 14px;
    display: flex; align-items: center; justify-content: center;
    text-transform: uppercase;
}
.hkpm_crumb > a:hover{ opacity: 1; }
.hkpm_crumb > a:after{
    content: ">"; display: block;
    margin: 0px 15px; text-decoration: none !important;
}
.hkpm_crumb h2{ width: 100%; color: #A28C57; font-weight: 500 !important; text-align: center; margin-top: 20px;  }
.hkpm_crumb h2 a{ display:block; max-width: 1100px; margin: 0px auto; text-transform: uppercase; }

.hkpm_crumb_desc{ border-bottom: 1px solid #A28C57; padding-bottom: 60px; }
.hkpm_crumb_desc > *{ max-width: 1000px; margin: 0px auto !important;}
/*--------------------------------------------------------------------------------*/
.hkpm_sticky_tab {
    position: sticky;
    top: 60px;
    z-index: 10;
    background-color: #fff;
}
.notice .hkpm_sticky_tab {
    top: calc(60px + 77px);
}
.hkpm_sticky_tab .hkpm_tab {
    padding: 12px 0;
    border-bottom: 1px transparent solid;
}
/* .hkpm_sticky_tab._sticky .hkpm_tab {
    border-bottom-color: #eee;
} */
.hkpm_tab{
    display: flex; align-items: center; justify-content: center; flex-wrap: wrap; 
    margin: 24px 0px;
}
.hkpm_tab a{
    display: block; font-size: 25px; font-weight: 500;
    margin: 0px 20px; padding: 0px 0px 5px 0px; 
    border-bottom: 1px solid rgba(0,0,0,0);
}
.hkpm_tab.hkpm_tab--border a{
    border-bottom: 1px solid #D7D7D7;
    margin: 0px; padding:  10px 20px 5px 20px;
}

.hkpm_tab a:hover,
.hkpm_tab a.active{ color: #5F5635; border-bottom: 1px solid #A28C57; opacity: 1; }

.hkpm_tab--sep a{ position: relative; }
.hkpm_tab--sep a:after{ 
    content: ""; display: block;
    position: absolute;
    height: 100%; width: 1px; right: -20px; top: 0px;
    background: #7B7475;
}
.hkpm_tab--sep a:last-of-type:after{  display: none; }
.hkpm_tab--sep{ 
    flex-wrap: nowrap;
    align-items: stretch;
}
.hkpm_tab--sep a{
    display: flex; align-items: flex-start;
}

.js-general_tab_content{ display: none }
.js-general_tab_content.active{ display: block }

@media screen and (max-width:1023px){
    .hkpm_tab a{ font-size: 20px; margin: 0px 15px;  }
    .hkpm_tab--sep a:after{ right: -15px; }
}
@media screen and (max-width:767px){
    .hkpm_tab{ margin: 14px 0px; }
    .hkpm_tab a{ font-size: 18px; margin: 0px 10px; }
    .hkpm_tab--sep a:after{ right: -10px; }

    .hkpm_tab--sep a{ 
        /* flex: 1; */
        font-size: 12px;
        display: flex; 
        /* max-width: 80px; */
        align-items: center; 
        justify-content: center;
        text-align: center;
    }
}
/*--------------------------------------------------------------------------------*/
.hkpm_table{ overflow: auto; }
.hkpm_table table, table.hkpm_table{ width: 100%; border-spacing: 0; }
.hkpm_table th,
.hkpm_table td{ 
    padding: 15px 0px; vertical-align: top;
    border-bottom: 1px solid #A28C57; 
}
.hkpm_table th{ font-weight: 500; text-align: left; max-width: 25%; }

.hkpm_table tr:last-of-type th,
.hkpm_table tr:last-of-type td{ border: none; }

.hkpm_table td li{ margin: 0px 0px 5px 0px; }

.hkpm_table2{ border: none !important; margin-bottom: 40px;}

.hkpm_table2 tr:nth-child(even) td,
.hkpm_table2 tr:nth-child(even) th{ background-color: #f5f5f5; }

.hkpm_table2 tr:nth-child(odd) td,
.hkpm_table2 tr:nth-child(odd) th{ background-color: #fbfbfb; }

.hkpm_table2 td, .hkpm_table2 th,
.hkpm_table2 tr:last-of-type th,
.hkpm_table2 tr:last-of-type td{ 
    padding: 18px; 
    border-top: none; 
    border-right: none; 
    border-left: none; 
    border-bottom: 1px solid #cecece; 
    vertical-align: middle;
}
.hkpm_table2 tr:last-of-type th:first-child, .hkpm_table2 tr:last-of-type td:first-child,
.hkpm_table2 td:first-child, .hkpm_table2 th:first-child{ border-left: 1px solid #cecece}

.hkpm_table2 tr:last-of-type th:last-child, .hkpm_table2 tr:last-of-type td:last-child,
.hkpm_table2 td:last-child, .hkpm_table2 th:last-child{ border-right: 1px solid #cecece}

td.hkpm_table_header:first-child,
td.hkpm_table_header:last-child,
th.hkpm_table_header:first-child,
th.hkpm_table_header:last-child,
td.hkpm_table_header,
th.hkpm_table_header{
    background-color: transparent !important;
    padding: 10px 16px;      
    text-align: center; 
    color: #A28C57; 
    font-weight: 500; 
    border-right: none; 
    border-left: none; 
    border-bottom: 3px solid #A28C57; 
}
/*--------------------------------------------------------------------------------*/
.hkpm_accordion{
    margin: 60px 0px 30px 0px;
    border-top: 1px solid #A28C57;
}
.hkpm_accordion .hkpm_accordion_item{
    border-bottom: 1px solid #A28C57;
}
.hkpm_accordion .hkpm_accordion_head{
    font-size: 30px; color: #A28C57;
    display: block; position: relative;
    padding: 20px 60px 20px 0px;
    
}
.hkpm_accordion--inner{ margin: 40px 0px; }
.hkpm_accordion--inner .hkpm_accordion_head{ font-size: 24px; padding: 20px 40px 20px 0px; }

.hkpm_accordion .hkpm_accordion_head:before,
.hkpm_accordion .hkpm_accordion_head:after{
    content: ""; display: block; position: absolute;
    width: 20px; height: 1px;
    top: calc(50%); right: 20px;
    background: #A28C57;
}
.hkpm_accordion .hkpm_accordion_head:after{
    transform: rotate(90deg);
}
.hkpm_accordion .hkpm_accordion_head.open:after{
    transform: rotate(0deg);
}
.hkpm_accordion .hkpm_accordion_body{ display: none; padding-bottom: 20px; }
.hkpm_accordion .hkpm_accordion_body > :first-child{ margin-top: 0px !important; }
.hkpm_accordion .hkpm_accordion_body a:not(.hkpm_download){ color: #5F5635; text-decoration: underline; }

.hkpm_accordion .hkpm_accordion_body ul,
.hkpm_accordion .hkpm_accordion_body ol{ max-width: 100%; }

@media screen and (max-width:1279px){
    .hkpm_accordion .hkpm_accordion_head{ font-size: 30px; padding: 20px 60px 20px 0px; }
    .hkpm_accordion--inner .hkpm_accordion_head{ font-size: 20px; padding: 20px 40px 20px 0px; }
}
@media screen and (max-width:1023px){
    .hkpm_accordion{ margin: 40px 0px 20px 0px; }
    .hkpm_accordion .hkpm_accordion_head{ font-size: 28px; }

    .hkpm_accordion--inner{ margin: 20px 0px;}
    .hkpm_accordion--inner .hkpm_accordion_head{ font-size: 18px; padding: 20px 40px 20px 0px; }
}
@media screen and (max-width:767px){
    .hkpm_accordion .hkpm_accordion_head{ font-size: 20px; }
    
    .hkpm_accordion--inner{ margin: 20px 0px;}
    .hkpm_accordion--inner .hkpm_accordion_head{ font-size: 18px; padding: 20px 40px 20px 0px; }
}
/*================================================================================*/
/*BOARD MEMBER*/
/*================================================================================*/
.hkpm_board{
    display: flex; align-items: flex-start; justify-content:  flex-start; flex-wrap: wrap;
    width: calc(100% + 40px); margin: 60px 0px;
}
.hkpm_board .hkpm_board_member{ width: calc(33.33% - 40px); margin: 0px 40px 40px 0px; }
.hkpm_board .hkpm_board_member img{ width: 100%; height: auto; display: block; }
.hkpm_board .hkpm_board_member h3,
.hkpm_board .hkpm_board_member p{ margin: 10px 0px; }

.hkpm_row--member{ justify-content: space-between; margin-bottom: 20px;}
.hkpm_row--member .hkpm_col:first-of-type{ width: 50%; padding-right: 40px; }
.hkpm_row--member .hkpm_col:last-of-type{ width: 50%; text-align: right;}

@media screen and (max-width:1023px){
    .hkpm_board{ width: calc(100% + 20px); }
    .hkpm_board .hkpm_board_member{ width: calc(33.33% - 20px); margin: 0px 20px 40px 0px;  }
}
@media screen and (max-width:767px){
    .hkpm_board .hkpm_board_member{ width: calc(50% - 20px); margin: 0px 20px 40px 0px;  }

    .hkpm_row--member{ width: 100%; flex-wrap: wrap; flex-direction:column-reverse;}
    .hkpm_row--member .hkpm_col:first-of-type{ width: 100%; }
    .hkpm_row--member .hkpm_col:last-of-type{ width: 100%; text-align: left; margin-bottom: 20px; }
}
@media screen and (max-width:479px){
    .hkpm_board{ width: 100%; }
    .hkpm_board .hkpm_board_member{ width: 100%; margin: 0px 0px 20px 0px;  }
}
/*--------------------------------------------------------------------------------*/
.hkpm_team .hkpm_row { margin: 60px 0px; justify-content: space-between; }
.hkpm_team .hkpm_row .hkpm_col:first-of-type{ width: 420px; }
.hkpm_team .hkpm_row .hkpm_col:last-of-type{  width: calc(100% - 420px - 80px); }

.hkpm_team .hkpm_row .hkpm_col:first-of-type img{ width: 100%; height: auto; display: block; }

.hkpm_team .hkpm_row .hkpm_col h3{ margin-bottom: 0px; }
.hkpm_team .hkpm_row .hkpm_col h4{ margin-top: 10px; }

.hkpm_team .hkpm_row:nth-of-type(even){ flex-direction: row-reverse; }

@media screen and (max-width:1279px){
    .hkpm_team .hkpm_row .hkpm_col:first-of-type{ width: 25vw; }
    .hkpm_team .hkpm_row .hkpm_col:last-of-type{  width: calc(100% - 25vw - 40px); }
}
@media screen and (max-width:1023px){
    .hkpm_team .hkpm_row { margin: 40px 0px; }
    .hkpm_team .hkpm_row .hkpm_col:first-of-type{ width: 33vw; }
    .hkpm_team .hkpm_row .hkpm_col:last-of-type{  width: calc(100% - 33vw - 20px); }
}
@media screen and (max-width:767px){
    .hkpm_team .hkpm_row { margin: 40px 0px; flex-wrap: wrap; }
    .hkpm_team .hkpm_row .hkpm_col:first-of-type{ width: 100%; }
    .hkpm_team .hkpm_row .hkpm_col:last-of-type{  width: 100%; }

    .hkpm_team .hkpm_row .hkpm_col:first-of-type img{ max-width: 320px; }
    .hkpm_team .hkpm_row:nth-of-type(even){ flex-direction: row; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_team_list{
    display: flex; align-items: flex-end; justify-content: flex-start; flex-wrap: wrap;
    width: calc(100% + 40px);
}
.hkpm_team_list .hkpm_team_list_item{
    width: calc(50% - 40px); margin: 0px 40px 0px 0px; padding: 30px 0px;
    border-bottom: 1px solid #A28C57;
}
.hkpm_team_list .hkpm_team_list_item.fullwidth,
.hkpm_team_list .hkpm_team_list_item:first-of-type{ width: calc(100% - 40px);}

.hkpm_team_list .hkpm_team_list_item h3{ margin: 0px; }
.hkpm_team_list .hkpm_team_list_item p{ margin: 10px 0px 0px 0px; }


@media screen and (max-width:1023px){
    .hkpm_team_list { width: calc(100% + 20px); }
    .hkpm_team_list .hkpm_team_list_item{ width: calc(50% - 20px); margin: 0px 20px 0px 0px; padding: 20px 0px; }
}
@media screen and (max-width:479px){
    .hkpm_team_list { width: calc(100% + 0px); }
    .hkpm_team_list .hkpm_team_list_item{ width: calc(100% - 0px); margin: 0px 0px 0px 0px; }
    .hkpm_team_list .hkpm_team_list_item:nth-last-of-type(2){ border-bottom: 1px solid #A28C57 !important; }

    .hkpm_team_list .hkpm_team_list_item.fullwidth,
    .hkpm_team_list .hkpm_team_list_item:first-of-type{ width: calc(100% - 0px);}
}
/*================================================================================*/
/*BUILDING*/
/*================================================================================*/
.hkpm_building{ 
    display: flex; align-items: flex-end; justify-content: flex-start; flex-wrap: wrap;
    width: calc(100% + 40px); margin: 0px 0px;
}
.hkpm_building .hkpm_building_item{ 
    width: calc(33.33% - 40px); color: #53504e;
    margin: 0px 40px 0px 0px; padding: 30px 0px;
    border-bottom: 1px solid #A28C57;
}
.hkpm_building .hkpm_building_item:nth-child(3n+1):nth-last-child(-n+3),
.hkpm_building .hkpm_building_item:nth-child(3n+1):nth-last-child(-n+3) ~ .hkpm_building_item{ border: none; }

.hkpm_building .hkpm_building_item p{  font-size: 22px; line-height: 1em; font-weight: 400; margin: 0px; }
.hkpm_building .hkpm_building_item h3{ font-size: 70px; line-height: 1em; font-weight: 100; margin: 10px 0px 0px 0px; }
.hkpm_building .hkpm_building_item h3 span{ font-size: 22px; font-weight: 400; }
@media screen and (max-width:1279px){
    .hkpm_building .hkpm_building_item p{  font-size: 20px; }
    .hkpm_building .hkpm_building_item h3{ font-size: 60px; }
    .hkpm_building .hkpm_building_item h3 span{ font-size: 20px;}
}
@media screen and (max-width:1023px){
    .hkpm_building{ width: calc(100% + 20px); }
    .hkpm_building .hkpm_building_item{ width: calc(33.33% - 20px); margin: 0px 20px 0px 0px; }
    .hkpm_building .hkpm_building_item p{  font-size: 18px; }
    .hkpm_building .hkpm_building_item h3{ font-size: 48px; }
    .hkpm_building .hkpm_building_item h3 span{ font-size: 18px;}
}
@media screen and (max-width:767px){
    .hkpm_building{ width: calc(100% + 20px); }
    .hkpm_building .hkpm_building_item{ width: calc(50% - 20px); padding: 20px 0px; }    
    .hkpm_building .hkpm_building_item:nth-last-child(3){ border-bottom: 1px solid #A28C57; }

    .hkpm_building .hkpm_building_item p{  font-size: 15px; }
    .hkpm_building .hkpm_building_item h3{ font-size: 36px; }
    .hkpm_building .hkpm_building_item h3 span{ font-size: 15px;}
}
@media screen and (max-width:479px){
    .hkpm_building .hkpm_building_item p{  font-size: 12px; }
    .hkpm_building .hkpm_building_item h3{ font-size: 24px; }
    .hkpm_building .hkpm_building_item h3 span{ font-size: 12px;}
}

/*================================================================================*/
/*MEMBER REGISTRATION*/
/*================================================================================*/
.hkpm_member_reg{ display: flex; align-items: stretch; justify-content: flex-start; flex-wrap: wrap; width: calc(100% + 40px); }
.hkpm_member_reg_item{
    background: #F6F6F6; padding: 40px 40px;
}
.hkpm_member_reg .hkpm_member_reg_item{ width: calc(33.33% - 40px); margin: 10px 40px 10px 0px; }
.hkpm_member_reg_item:last-child:first-child{ width: calc(100% - 40px); }

.hkpm_member_reg_item h3,
.hkpm_member_reg_item h4,
.hkpm_member_reg_item p{ margin: 10px 0px !important; }
.hkpm_member_reg_item .hkpm_btn{ margin-top: 20px; }

@media screen and (max-width:1023px){
    .hkpm_member_reg{ width: calc(100% + 20px); }
    .hkpm_member_reg_item{ padding: 40px 20px;  }
    .hkpm_member_reg .hkpm_member_reg_item{ width: calc(33.33% - 20px); margin-right: 20px; }
    .hkpm_member_reg .hkpm_member_reg_item:last-child:first-child{ width: calc(100% - 20px); }
}
@media screen and (max-width:767px){
    .hkpm_member_reg .hkpm_member_reg_item{ width: calc(50% - 20px); }
    .hkpm_zigzag .hkpm_member_reg_item:last-child:first-child{ width: 100%; padding: 20px; }
    .hkpm_zigzag .hkpm_col:not(:first-child) .hkpm_member_reg_item:last-child:first-child { margin-top: 20px; }
}
@media screen and (max-width:479px){
    .hkpm_member_reg{ width: 100%; }
    .hkpm_member_reg .hkpm_member_reg_item{ width: 100%; margin-right: 0px; }
    .hkpm_member_reg .hkpm_member_reg_item:last-child:first-child{ width: 100%; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_member_benefit{ display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap; width: calc(100% + 40px); }
.hkpm_member_benefit_item{
    width: calc(33.33% - 40px);
    margin: 0px 40px 40px 0px; padding: 0px 20px 0px 0px;
}
.hkpm_member_benefit_item h3,
.hkpm_member_benefit_item h4,
.hkpm_member_benefit_item p{ margin: 10px 0px !important; }

.hkpm_member_benefit_item .img{ 
    width: 100px; height: 100px; 
    display: flex; align-items: center; justify-content: flex-start;
}
@media screen and (max-width:1023px){
    .hkpm_member_benefit{ width: calc(100% + 20px); }
    .hkpm_member_benefit_item{ width: calc(50% - 20px); margin-right: 20px; margin-bottom: 20px;  }
}
@media screen and (max-width:767px){
    .hkpm_member_benefit{ width: calc(100% + 20px); }
    .hkpm_member_benefit_item{ 
        position: relative; width: calc(100% - 0px); min-height: 100px; padding-left: 95px;
        display: flex; align-items: flex-start; justify-content: center; flex-direction: column;
    }
    .hkpm_member_benefit_item .img{ 
        position: absolute; top:0px; left: 0px; width: 72px; height: 100%;         
        display: flex; align-items: center; justify-content: flex-start; 
    }
}
/*--------------------------------------------------------------------------------*/
.hkpm_member_banner{
    background: #F6F6F6;
    padding-top: 120px; margin: 0px !important;
}
.hkpm_member_banner .hkpm_medium_banner{ margin: 0px; position: relative; }
.hkpm_member_banner .hkpm_medium_banner:after{
    content: ""; display: block;
    position: absolute; z-index: 1; width: 100%; height: 25%; top:-1px; left: 0px;  
    background: linear-gradient(-6deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, #F6F6F6 50.5%, #F6F6F6 100%);
}
@media screen and (max-width:1023px){
    .hkpm_member_banner{ padding-top: 60px; }
}
@media screen and (max-width:767px){
    .hkpm_member_banner{ padding-top: 40px; }
}
@media screen and (max-width:479px){
    .hkpm_member_banner{ padding-top: 20px; }
}

/*--------------------------------------------------------------------------------*/
.hkpm_corporate{ 
    display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap;
    padding-bottom: 20px;
}
.hkpm_corporate .hkpm_corporate_head{ position: relative; width: 100%;  }
.hkpm_corporate .hkpm_corporate_head:before{
    content: ""; display: block;
    position: absolute; top: 50%; left: 0px;
    width: 100%; height: 1px; background: #999;
}
.hkpm_corporate .hkpm_corporate_head span{
    position: relative; background: #FFF; padding: 0px 20px 0px 0px; text-align: center;
}
.hkpm_corporate .hkpm_corporate_img{     
    width:20%; max-width: 320px; padding: 20px 20px 20px 0px;
}
.hkpm_corporate .hkpm_corporate_img img{ width: auto; height: auto; display: block; max-width: 100%;  }

@media screen and (max-width:1279px){
    .hkpm_corporate .hkpm_corporate_img{ width: 25%; }
}
@media screen and (max-width:1023px){
    .hkpm_corporate .hkpm_corporate_img{ width: 33.33%; }
}
@media screen and (max-width:767px){
    .hkpm_corporate .hkpm_corporate_img{ width: 50%; }
}
@media screen and (max-width:479px){
    .hkpm_corporate .hkpm_corporate_img{ width: 100%; }
}
/*================================================================================*/
/*GENERIC*/
/*================================================================================*/
.hkpm_zigzag .hkpm_row{ margin: 60px 0px; justify-content: space-between;  }
.hkpm_zigzag .hkpm_row.reverse,
.hkpm_zigzag .hkpm_row:nth-of-type(even){ flex-direction: row-reverse; }

.hkpm_zigzag--top .hkpm_row{ align-items: flex-start;}

.hkpm_zigzag .hkpm_col{ width: calc(50% - 40px); }
.hkpm_zigzag .hkpm_col img{ max-width: 100%; height: auto;}

.hkpm_zigzag .hkpm_col.full_width{ width: 100%; }
.hkpm_zigzag .hkpm_col.w-33 {
    width: calc(33.33% - 40px);
}
.hkpm_zigzag .hkpm_col.w-66 {
    width: calc(66.66% - 40px);
}
.hkpm_zigzag .hkpm_zigzag_text{ max-width: 100%; padding:0px 0px 0px 0px; }
.hkpm_zigzag .hkpm_row.reverse .hkpm_zigzag_text,
.hkpm_zigzag .hkpm_row:nth-of-type(even) .hkpm_zigzag_text{ margin-left: auto; }

.hkpm_zigzag .hkpm_zigzag_text h3{ font-weight: 500; }

@media screen and (max-width:1023px){
    .hkpm_zigzag .hkpm_col{ width: calc(50% - 20px); }
    .hkpm_zigzag .hkpm_col.w-33 {
        width: calc(33.33% - 20px);
    }
    .hkpm_zigzag .hkpm_col.w-66 {
        width: calc(66.66% - 20px);
    }
}
@media screen and (max-width:767px){
    .hkpm_zigzag .hkpm_row.reverse,
    .hkpm_zigzag .hkpm_row:nth-of-type(even){ flex-direction: row; }
    .hkpm_zigzag .hkpm_row{ margin: 60px 0px; flex-wrap: wrap; }
    .hkpm_zigzag .hkpm_col{ width: 100%; }
    .hkpm_zigzag .hkpm_col.w-33,
    .hkpm_zigzag .hkpm_col.w-66 {
        width: 100%;
    }

    .hkpm_zigzag .hkpm_col h3{ margin-bottom: 0px;}
    .hkpm_zigzag .hkpm_col p:first-of-type{ margin-top: 10px;}
}
/*--------------------------------------------------------------------------------*/
.hkpm_generic{ margin: 60px 0px 120px 0px; }
.hkpm_generic.hkpm_bg_grey{ margin: 0px; }
.hkpm_generic.hkpm_generic--notice{ margin-top: 0px; }

.hkpm_generic h2, 
.hkpm_generic h3, 
.hkpm_generic h4, 
.hkpm_generic h5, 
.hkpm_generic h6, 
.hkpm_generic p{ margin: 20px 0px; max-width: 1000px; }
.hkpm_generic li{ max-width: 1000px; }

.hkpm_generic td > a,
.hkpm_generic li > a,
.hkpm_generic p > a{ color: #5F5635; text-decoration: underline; }
.hkpm_generic td > a:hover,
.hkpm_generic li > a:hover,
.hkpm_generic p > a:hover{ color: #5F5635; }
.hkpm_generic .hkpm_main > h3{ margin-top: 60px; }

.hkpm_generic.hkpm_generic--notice .hkpm_main > h2,
.hkpm_generic.hkpm_generic--notice .hkpm_main > h3{ margin-top: 20px; max-width: 1000px;  }


.hkpm_generic--member{ margin-top: 0px;}
.hkpm_generic--member ul{ max-width: 800px; margin: 0px auto 60px auto; }
.hkpm_generic--member .hkpm_booking_step_nav { max-width: 100%; margin-bottom: 40px; }

@media screen and (max-width:1023px){
    .hkpm_generic{ margin: 40px 0px; }
    .hkpm_generic .hkpm_main > h3{ margin-top: 40px; }
    .hkpm_generic.hkpm_generic--notice{ margin-top: 0px; }
}
/*================================================================================*/
/*POP*/
/*================================================================================*/
.hkpm_pop{ 
    position: fixed; z-index: 100;
    top: 0px; left: 0px;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.5);
    opacity: 0; pointer-events: none;
    transition: ease all 0.3s;
}
.hkpm_pop .hkpm_pop_body{
    position: absolute;    
    top:0px; right: -100%;
    width: calc(100% - 200px); height: 100%; max-width: 1400px; 
    background: #FFF; overflow: auto; 
    
}
.hkpm_pop .hkpm_pop_body .hkpm_pop_content{
    min-height: 100%; display: flex; align-items: center; justify-content: flex-start;
}
.hkpm_pop .hkpm_pop_body .hkpm_pop_content .hkpm_main{ 
    width: 100%;  margin: 0px; padding: 150px 100px; 
}
.hkpm_pop.full .hkpm_pop_body .hkpm_pop_content .hkpm_main{margin: 0 auto;}
.hkpm_pop_close{
    position: absolute; z-index: 1;
    display: flex; align-items: center; justify-content: center;
    top: 40px; left: 100px; width: 60px; height: 60px;
    font-size: 30px; font-family:'Courier New', Courier, monospace;
    background: #FFF; border: 1px solid #7B7475; border-radius: 50%;
}
.hkpm_pop_close:hover{ background: #A28C57; color: #FFF; }

.hkpm_pop.show{ opacity: 1; pointer-events: all; }
.hkpm_pop.small .hkpm_pop_body{ width: 50%; max-width: 720px; }
.hkpm_pop.full .hkpm_pop_body{ width: 100%; max-width: none; }
/*--------------------------------------------------------------------------------*/
.hkpm_pop h3,
.hkpm_pop h4,
.hkpm_pop h5,
.hkpm_pop h6{ max-width: 500px; margin-bottom: 20px;}
.hkpm_pop P { margin-bottom: 20px; }

.hkpm_pop_slider_thumb{
    margin: 20px 0px 0px 0px;
    display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap;
}
.hkpm_pop_slider_thumb a{ position: relative; margin: 0px 20px 20px 0px; width: 60px; opacity: 0.5;}
.hkpm_pop_slider_thumb a.active{ opacity: 1; }
.hkpm_pop_slider_thumb a:before{
    content: ""; display: block;
    padding-bottom: 100%;
}
.hkpm_pop_slider_thumb a img{ position: absolute; top:0px; left: 0px; width: 100%; height: 100%; object-fit: cover; }
.js-pop_slider h4 span {
    display: inline-block;
}
.js-pop_slider h4 span:after {
    content: "";
    display: block;
    bottom: 0px;
    left: 0px;
    width: 1%;
    height: 2px;
    background: #A28C57;
    opacity: 0;
    transition: 0.3s opacity ease, 0.3s width ease;
}
.js-pop_slider:hover h4 span:after {
    width: 100%;
    opacity: 1;
}
.js-pop_slider:hover h4 span.no_underline:after {
    width: 100%;
    opacity: 0!important;
}
.js-pop_slider_detail,
.js-pop_detail{ display: none; }

@media screen and (max-width:1439px){
    .hkpm_pop .hkpm_pop_body{ width: calc(100% - 100px); }
    .hkpm_pop .hkpm_pop_body .hkpm_pop_content .hkpm_main{ padding: 120px 40px; }
    .hkpm_pop .hkpm_pop_body .hkpm_pop_close{ left: 40px; }
    .hkpm_pop.small .hkpm_pop_body{ width: 75%; }
}
@media screen and (max-width:1023px){
    .hkpm_pop .hkpm_pop_body{ width: calc(100% - 20px); }
    .hkpm_pop .hkpm_pop_body .hkpm_pop_content .hkpm_main{ padding: 80px 20px; }    
    .hkpm_pop .hkpm_pop_body .hkpm_pop_close{ width: 40px; height: 40px; left: 20px; top: 20px; font-size: 20px; }
    .hkpm_pop.small .hkpm_pop_body{ width: calc(100% - 20px); }
}
@media screen and (max-width:767px){
    .hkpm_pop .hkpm_pop_body{ width: 100%; }
    .hkpm_pop.small .hkpm_pop_body{ width: 100%; }
}
/*================================================================================*/
/*FOOT*/
/*================================================================================*/
.hkpm_foot{ padding: 30px 0px 40px 0px; }
.hkpm_foot p{ font-size: 14px; line-height: 1.5em; color: rgba(0,0,0,0.7); margin-bottom: 10px; } 
.hkpm_foot p span{ display: inline-block; }

.hkpm_foot a{ color: rgba(0,0,0,0.7); }
.hkpm_foot a:hover{ color: #000; }

.hkpm_foot .hkpm_foot_action{
    display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap;
}
.hkpm_foot .hkpm_foot_action a{
    display: block; 
    border-left: 1px solid #D7D7D7; 
    margin: 0px 0px 0px 10px; padding: 0px 0px 0px 15px;
}
.hkpm_foot .hkpm_foot_action a:first-of-type{ border: none; padding: 0px; margin: 0px; }

.hkpm_foot .hkpm_foot_sns{ display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 20px 40px; margin-bottom: 0; }
.hkpm_foot .hkpm_foot_sns a{ /* margin: 0px 0px 0px 40px; */ filter: grayscale(1); opacity: 1; position: relative; flex-shrink: 0; }
.hkpm_foot .hkpm_foot_sns a img{
    height: 32px; width: 32px; 
    object-fit: contain; object-position: center center;
}
.hkpm_foot .hkpm_foot_sns a.open,
.hkpm_foot .hkpm_foot_sns a:hover{ filter: grayscale(0); opacity: 1;  z-index: 1;} 

.hkpm_foot .hkpm_foot_sns a:nth-of-type(2) img{ /* transform: scale(1.2); */ width: calc(32px * 1.2); }

.hkpm_mobile_foot_body .hkpm_mobile_foot_sns .hkpm_foot_sns_wechat,
.hkpm_foot .hkpm_foot_sns .hkpm_foot_sns_wechat{
    display: none; padding: 10px; overflow: hidden; 
    background: #FFF; border: 1px solid #CCC; border-radius: 20px;
    position: absolute; bottom:50px; left: calc(50% - 160px - 52px);
    width: 280px; height: 280px;
}
.hkpm_mobile_foot_body .hkpm_mobile_foot_sns .hkpm_foot_sns_wechat{
	left: calc(50% - 110px);
}

.hkpm_mobile_foot_body .hkpm_mobile_foot_sns .hkpm_foot_sns_wechat img,
.hkpm_foot .hkpm_foot_sns .hkpm_foot_sns_wechat img{
    width: 100%; height: auto; display: block;
}
.hkpm_mobile_foot_body .hkpm_mobile_foot_sns a.open .hkpm_foot_sns_wechat,
.hkpm_foot .hkpm_foot_sns a.open .hkpm_foot_sns_wechat{ display: block; }

.hkpm_mobile_foot_body .hkpm_mobile_foot_sns a.open:before,
.hkpm_mobile_foot_body .hkpm_mobile_foot_sns a.open:after,
.hkpm_foot .hkpm_foot_sns a.open:before,
.hkpm_foot .hkpm_foot_sns a.open:after{
    content: ""; display: block; z-index: 1;
    border-style: solid;
    border-width: 10px;
    border-color: #AAA transparent transparent transparent;
    position: absolute; top: -14px; left: calc(50% - 10px);
    width: 0px; height: 0px;;
}

.hkpm_mobile_foot_body .hkpm_mobile_foot_sns a.open:after,
.hkpm_foot .hkpm_foot_sns a.open:after{
    border-color: #FFF transparent transparent transparent; 
    top:-15px;
}

@media (hover: hover) {
    /*
    .hkpm_foot .hkpm_foot_sns a:hover .hkpm_foot_sns_wechat{ display: block; }
    
    .hkpm_foot .hkpm_foot_sns a:last-child:hover:before,
    .hkpm_foot .hkpm_foot_sns a:last-child:hover:after{
        content: ""; display: block; z-index: 1;
        border-style: solid;
        border-width: 10px;
        border-color: #AAA transparent transparent transparent;
        position: absolute; top: -14px; left: calc(50% - 10px);
        width: 0px; height: 0px;;
    }
    .hkpm_foot .hkpm_foot_sns a:last-child:hover:after{
        border-color: #FFF transparent transparent transparent; 
        top:-15px;
    }*/
}

.hkpm_row--foot > .hkpm_col:nth-of-type(1){ width: 330px; }
.hkpm_row--foot > .hkpm_col:nth-of-type(2){ width: calc(100% - 330px - 220px); }
.hkpm_row--foot > .hkpm_col.hkpm_col--foot_action{ width: calc(100% - 330px - 340px - 220px);}
.hkpm_row--foot > .hkpm_col:nth-of-type(3){ width: 340px; }
.hkpm_row--foot > .hkpm_col:nth-of-type(4){ /* width: 220px; */ width: auto; display: flex; align-items: center; justify-content: flex-end; }

.hkpm_row--foot h3.gold{ font-weight: 500;}
.hkpm_row--foot .wk-logo{ width: 150px; height: auto; padding: 0 22.5px; }

@media screen and (max-width:1279px){
    .hkpm_row--foot{ flex-wrap: wrap; }
    .hkpm_row--foot > .hkpm_col:nth-of-type(1){ width: 100%; }
    .hkpm_row--foot > .hkpm_col:nth-of-type(2){ width: 100%; }
    .hkpm_row--foot > .hkpm_col:nth-of-type(3){ width: 100%; }
	
    .hkpm_foot .hkpm_row--foot{ text-align: center; }    
    .hkpm_foot .hkpm_row--foot > .hkpm_col:nth-of-type(1){ order:2; padding-bottom: 40px; }
    .hkpm_foot .hkpm_row--foot > .hkpm_col:nth-of-type(2){ order:4; }
    .hkpm_foot .hkpm_row--foot > .hkpm_col:nth-of-type(3){ order:1; padding-bottom: 40px; }
	.hkpm_foot .hkpm_row--foot > .hkpm_col:nth-of-type(4){ order:3; padding-bottom: 20px; width: 100%; display: inline; }
    .hkpm_foot .hkpm_foot_sns{ justify-content: center; padding-top: 20px; }
    .hkpm_foot .hkpm_foot_sns a:first-of-type{ margin: 0px; }
    .hkpm_foot .hkpm_foot_action{ justify-content: center; }
    
    .hkpm_mobile_foot_body .hkpm_mobile_foot_sns .hkpm_foot_sns_wechat{ bottom: 47px; }
    .hkpm_foot .hkpm_foot_sns .hkpm_foot_sns_wechat{ bottom: 50px; }
}
@media screen and (max-width:767px){
    .hkpm_foot .hkpm_foot_action{ display: none; }
    .hkpm_foot p{ font-size: 12px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_subscribe{
    background: #F6F6F6; padding: 30px 0px;
    border-top: 1px solid #D7D7D7;
}
.hkpm_subscribe h3{ font-size: 40px; }
.hkpm_subscribe .hkpm_col:nth-of-type(3){  text-align: right; } 

@media screen and (max-width:1279px){
    .hkpm_subscribe .hkpm_col:nth-of-type(2){ padding: 15px 0px; }
    .hkpm_subscribe .hkpm_col:nth-of-type(3){  text-align: left; } 
}
@media screen and (max-width:1023px){
    .hkpm_subscribe h3{ font-size: 30px; }
}
@media screen and (max-width:767px){
    .hkpm_subscribe h3{ font-size: 24px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_address{ padding: 30px 0px; border-top: 1px solid #D7D7D7; }
.hkpm_address h3{ font-size: 20px; }
.hkpm_address .hkpm_label{ font-size: 18px; margin-top: 5px; }

.hkpm_address .hkpm_row--foot > .hkpm_col:nth-of-type(1) img{ width: 150px; height: auto;}
.hkpm_address .hkpm_row--foot > .hkpm_col:nth-of-type(2){ width: calc(100% - 330px); }

.hkpm_row--addr > .hkpm_col:first-of-type{ padding-right: 60px; }
.hkpm_row--addr img{ max-width: 275px; }

@media screen and (max-width:1279px){
    .hkpm_address{ display: none; }
    .hkpm_address .hkpm_row--foot > .hkpm_col:nth-of-type(2){ width: 100%; }
    .hkpm_row--addr{ margin-top: 20px; }
    .hkpm_row--addr > .hkpm_col:first-of-type{ padding-right: 40px; }
}
@media screen and (max-width:1023px){
    .hkpm_row--addr > .hkpm_col:first-of-type{ padding-right: 20px; }
}
@media screen and (max-width:767px){
    .hkpm_row--addr{ flex-wrap: wrap; }
    .hkpm_row--addr > .hkpm_col{ width: 100%; }
    .hkpm_row--addr > .hkpm_col:first-of-type{ padding-bottom: 20px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_top{
    height: 0px; width: 100%;
    position: relative;
}
.hkpm_top a{    
    position:  absolute; top:-36px; right: 60px;
    display: flex;  align-items: center; justify-content: center;
    width: 72px; height: 72px; background: #FFF;
    box-shadow:  0px 0px 10px rgba(0,0,0,0.3); border-radius: 50%;
}
.hkpm_top a:before{ 
    content: ""; display: block;
    width: 10px; height: 10px;
    border-top:2px solid #7B7475;
    border-right:2px solid #7B7475;
    transform: rotate(-45deg); margin-top: 7px;
}
.hkpm_top a span{ display: none; }
.hkpm_top a:hover{ background: #5F5635; }
.hkpm_top a:hover:before{ border-color: #FFF; }

@media screen and (max-width:1279px){ 
    .hkpm_top a{ top:-30px; right: 40px; width: 60px; height: 60px; }
}
@media screen and (max-width:1023px){ 
    .hkpm_top a{ top:-24px; right: 20px; width: 48px; height: 48px; }
}
/*================================================================================*/
/*MISC*/
/*================================================================================*/
.hkpm_404{ 
    display: flex; align-items: center; justify-content: center;
    min-height: 720px; text-align: center; padding: 200px 0px;
    background-image: url(../img/404.png); 
    background-position: bottom right; 
    background-repeat: no-repeat;
    margin: 0px !important;
}
.hkpm_404 .hkpm_main h2{ font-weight: 100; }
.hkpm_404 .hkpm_main h3{ font-weight: 500; }
.hkpm_404 .hkpm_main h2,
.hkpm_404 .hkpm_main h3{ margin: 0px auto; text-align: center; }
.hkpm_404 .hkpm_main blockquote,
.hkpm_404 .hkpm_main p{ margin: 20px 0px; text-align: center; }

@media screen and (max-width:1023px){
    .hkpm_404{ background-size: 80%; min-height: 480px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_notice{
    position: fixed; z-index: 99;
    top:-300px; left: 0px; width: 100%; /* height: 77px;*/ min-height: 57px; padding: 10px 0px;
    background: #7B7475; color: #FFF;
    transition: ease all 0.3s;
}
.hkpm_notice.show{ top:0px; }

.hkpm_notice .hkpm_main{
    /*height: 100%*/ min-height: 57px; max-width: 100%;
    display: flex; align-items: center; justify-content: flex-start;
}
.hkpm_notice .hkpm_notice_title{ width: 160px; white-space: nowrap; font-weight: 600; }
.hkpm_notice .hkpm_notice_close{ width: 40px; text-align: right; }
.hkpm_notice .hkpm_notice_body { width: calc(100% - 200px); }
.hkpm_notice .hkpm_notice_body .swiper-wrapper{ align-items: center; }
.hkpm_notice .hkpm_notice_body .swiper-slide a, 
.hkpm_notice .hkpm_notice_body .swiper-slide span{ 
    width: 100%; display: block;
    /*white-space: nowrap; text-overflow: ellipsis; overflow: hidden;*/
    padding-right: 60px;
}

.hkpm_notice .hkpm_notice_close a{
    display: flex; align-items: center; justify-content: center;
    width: 40px; height: 40px;
}
.hkpm_notice .hkpm_notice_close a span{ display: none; }
.hkpm_notice .hkpm_notice_close a:before{
    content: ""; display: block;
    width: 10px; height: 10px; 
    border-top:1px solid #FFF;
    border-left:1px solid #FFF;
    transform: rotate(45deg);
}
.hkpm_notice .hkpm_notice_body a:hover{ text-decoration: underline ;}

.hkpm_notice .hkpm_notice_slider .hkpm_notice_nav{
    position: absolute; z-index: 1;
    display: flex; align-items: center; justify-content: flex-end;
    width: 60px; height: 100%; top: 0px; right: 0px; left: auto; 
    background: #7B7475;
}
.hkpm_notice .hkpm_notice_slider .hkpm_notice_nav .swiper-pagination-bullet{
    height: auto;
    aspect-ratio: 1 / 1;
    margin: 0 3px;
    background: #FFF;
}
.hkpm_notice .hkpm_notice_slider .hkpm_notice_nav .swiper-pagination-bullet-active{ background: #FFF; }

@media screen and (max-width:1023px){ 
    .hkpm_notice .hkpm_notice_title{ width: 140px; }
    .hkpm_notice .hkpm_notice_close{ width: 40px; }
    .hkpm_notice .hkpm_notice_body { width: calc(100% - 180px); }
}
@media screen and (max-width:767px){ 
    .hkpm_notice { padding-top: 30px;}
    .hkpm_notice .hkpm_main{ min-height: 30px; }
    .hkpm_notice .hkpm_notice_title{ width: 120px; position: absolute; top: 10px;}
    .hkpm_notice .hkpm_notice_close{ width: 40px; }
    .hkpm_notice .hkpm_notice_body { width: calc(100% - 40px); }
}
/*--------------------------------------------------------------------------------*/
.hkpm_notice_block{ width: 100%; display:flex;}
.hkpm_notice_block--left{ 
    display:flex; 
    align-items: center; 
    justify-content: center; 
    width: 300px; 
    background-color: #5f5635; 
    color:#FFF; 
    padding: 20px; 
    border-right: 1px solid #322f1c; 
}
.hkpm_notice_block--left_icon{ 
    flex-shrink: 0;
    flex-grow: 0;
    width: 50px;
    margin-right: 16px;
    height: 50px;
    border-radius: 100%;
    background-color: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    font-weight: 500;
    line-height: 1em;
    color: #5f5635;
    user-select: none;
 }
.hkpm_notice_block--right{ display:flex; align-items: center;  background-color: #8a7344; color:#FFF; padding: 20px; flex-grow: 1; flex-shrink: 1;}

@media screen and (max-width: 767px){
    .hkpm_notice_block--left{ width: 250px; }
    .hkpm_notice_block--left_icon{ width: 40px; height: 40px; font-size: 35px;}
}

@media screen and (max-width:479px){
    .hkpm_notice_block{ display:block; } 
    .hkpm_notice_block--left{ padding: 12px; }
    .hkpm_notice_block--left, .hkpm_notice_block--right{ width: 100%;}
}
/*--------------------------------------------------------------------------------*/
.hkpm_important_item{
    display: flex; align-items: center; justify-content: flex-start;
    padding-bottom: 30px; margin-bottom: 30px;
    border-bottom: 1px solid #5F5635;
}
.hkpm_important_item .hkpm_important_item_text{ flex: 1; }

/*--------------------------------------------------------------------------------*/
.hkpm_cookie{
    position: fixed; z-index: 11;
    bottom:40px; left: -200%; 
    transition: ease all 1s;
}
.hkpm_cookie.show{ left: 0%; }
.hkpm_cookie:before{ 
    content: ""; display: block;
    position: absolute; top:0px; left: 0px; z-index: -1;
    width: calc(100% + 20px); height: 100%; 
    transform: skew(-10deg, 0deg) translateX(10px);
    background: #7B7475;
}
.hkpm_cookie .hkpm_cookie_body{
    padding: 40px 40px 40px 100px; max-width: 600px; position: relative;
    color: #FFF; background: #7B7475; 
}
.hkpm_cookie .hkpm_cookie_body p{
    margin: 0px 0px 20px 0px; font-size: 16px;
}
.hkpm_cookie .hkpm_cookie_action{
    display: flex; align-items: center; justify-content: flex-start;
}
.hkpm_cookie .hkpm_cookie_action a:not(.hkpm_btn){
    text-decoration: underline; margin-left: 40px;
}
@media screen and (max-width:1023px){ 
    .hkpm_cookie .hkpm_cookie_body{ padding-left: 40px; }
}
@media screen and (max-width:767px){ 
    .hkpm_cookie{ bottom: 0px; }
    .hkpm_cookie .hkpm_cookie_body{ padding: 20px; }
    .hkpm_cookie .hkpm_cookie_body p{ font-size: 14px; }
}
/*--------------------------------------------------------------------------------*/
.hkpm_loading{
    display: none; pointer-events: all;
    position: fixed; z-index: 9999;
    top:0px; left: 0px; width: 100%; height: 100%;
    background: rgba(0,0,0,0.7);
}

.hkpm_loading:before{
    content: ""; display: block;    
    position: absolute; top: calc(50% - 30px); left: calc(50% - 30px);
    width: 60px; height: 60px;
    background-image: url(../img/loading.png);
    background-size: contain;
    background-repeat: no-repeat;
    filter: invert(1);
    animation: rotate 10s linear infinite
}
@keyframes rotate {
    0%  { transform: rotate(0deg); }        
    25% { transform: rotate(90deg); }        
    50% { transform: rotate(180deg); }        
    75% { transform: rotate(270deg); }        
    100%{ transform: rotate(360deg); }        
}
/*--------------------------------------------------------------------------------*/
.hkpm_sitemap{ display:flex; align-items:flex-start; justify-content:flex-start; flex-wrap:wrap; }
.hkpm_sitemap_item{ width:25%; padding:0px 40px 60px 0px; }

.hkpm_sitemap_item > a{
    display: block; font-size: 30px;
    color: #A28C57; 
    text-decoration: underline;                        
}
.hkpm_sitemap_item > a:hover{ text-decoration: none; }

.hkpm_sitemap_subitem > a{
    display: block; font-size: 16px;
    color: #000; margin: 10px 0px;
    text-decoration: underline;
   
}
.hkpm_sitemap_subitem > a:hover{ text-decoration: none; }


@media screen and (max-width:1023px){
    .hkpm_sitemap_item{ width:33%;  padding:0px 20px 40px 0px;  }
}
@media screen and (max-width:767px){
    .hkpm_sitemap_item{ width:50%; }
}
/*================================================================================*/
/* SEARCH */
/*================================================================================*/
.hkpm_search{
    position: fixed; z-index: 101;
    top:0px; left: 0px; width: 100%; height: 100%;
    background: rgba(255,255,255,0.95);
    display: none; 
}
.hkpm_search.show{ display: block; }

.hkpm_search .hkpm_main{
    position: relative;
    height: 100%; display: flex; align-items: center; justify-content: center;
}
.hkpm_search .hkpm_pop_close{ left: auto; right: 20px; }

.hkpm_search_body{ width: 100%; max-width: 640px; text-align: center; margin: 0px auto; }
.hkpm_search_body h3{ 
    font-size: 120px; line-height: 1em; color: #A28C57; 
    margin: 0px; padding: 0px; 
}
.hkpm_search_body .hkpm_search_form{
    width: 100%; display: block; 
    position: relative; width: 100%; height: 72px;
    border: 1px solid #999; border-radius: 8px;
    margin: 20px 0px;
}
.hkpm_search_body .hkpm_search_form:before{
    content: ""; display: block;
    position: absolute; top:0px; left: 0px;
    
    width: 72px; height: 100%;    
    background-image: url(../img/svg/icon-search.svg);
    background-size: 33%;
    background-repeat: no-repeat;
    background-position: center center;
    border-right: 1px solid #999;
}
.hkpm_search_body .hkpm_search_form input[type=text]{
    position: absolute;
    width: calc(100% - 72px); height: 100%;
    top:0px; left: 72px; border: none; background: none;
    padding: 0px 60px 0px 20px ; font-size: 20px;
}
.hkpm_search_body .hkpm_search_btn{
    position: absolute;
    top: calc(50% - 12px); right: 20px;
    width: 24px; height: 24px; 
}
.hkpm_search_body .hkpm_search_btn span{ display: none; }
.hkpm_search_body .hkpm_search_btn:before{
    content: ""; display: block; box-sizing: border-box;
    position: absolute; top: calc(50% - 0px); right: 0%; width: 40%; height: 40%;
    border-top: 2px solid #999;
    border-right: 2px solid #999;
    transform: rotate(45deg);
    transform-origin: 100% 0%;
}
.hkpm_search_body .hkpm_search_btn:after{
    content: ""; display: block; position: absolute; 
    top: calc(50% - 1px); right: 0%; width: 100%; height: 2px;
    background: #999;
}
.hkpm_search_body .hkpm_search_popular{ 
    width: 100%; display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap;
    padding-left: 80px; position: relative;
}
.hkpm_search_body .hkpm_search_popular span{ 
    width: 80px; height: 1em; text-align: left;
    position: absolute; top:0px; left: 0px;
}
.hkpm_search_body .hkpm_search_popular *{ margin: 0px 20px 10px 0px; }
.hkpm_search_body .hkpm_search_popular span{ font-weight: bold; }
.hkpm_search_body .hkpm_search_popular a:hover{ text-decoration: underline; }

@media screen and (max-width:1279px){
    .hkpm_search_body h3{ font-size:100px; }
}
@media screen and (max-width:1023px){
    .hkpm_search_body h3{ font-size: 80px; }
    .hkpm_search_body .hkpm_search_form{ height: 60px; }
    .hkpm_search_body .hkpm_search_form input[type=text]{ font-size: 18px; left: 60px; width: calc(100% - 60px); }
    .hkpm_search_body .hkpm_search_form:before{ width: 60px; }
}
@media screen and (max-width:767px){
    .hkpm_search_body h3{ font-size: 60px; }
    .hkpm_search_body .hkpm_search_form{ height: 48px; }
    .hkpm_search_body .hkpm_search_form input[type=text]{ font-size: 16px; left: 48px; width: calc(100% - 48px); }
    .hkpm_search_body .hkpm_search_form:before{ width: 48px; }
    .hkpm_search_body .hkpm_search_btn{ right: 10px; }
    
}
/*--------------------------------------------------------------------------------*/
.hkpm_search_result_item{ 
    display: flex; align-items: center; justify-content: flex-start;
    border-bottom: 1px solid #999; padding-bottom: 40px; margin-bottom: 40px;
}
.hkpm_search_result_item .hkpm_search_result_text{ width: calc(100% - 375px); padding-right: 80px; }
.hkpm_search_result_item .hkpm_search_result_img{ width: 375px;}

.hkpm_search_result_item h3{ margin: 5px 0px 10px 0px; }
.hkpm_search_result_item img{ width: 100%; height: auto; display: block; }
.hkpm_search_result_item .hkpm_arr{ margin-top: 20px; display: inline-block;}
.hkpm_search_result_item .highlight{ color: #5F5635; }

@media screen and (max-width:1279px){ 
    .hkpm_search_result_item .hkpm_search_result_text{ width: calc(100% - 300px); padding-right: 40px; }
    .hkpm_search_result_item .hkpm_search_result_img{ width: 300px;}
}
@media screen and (max-width:1023px){ 
    .hkpm_search_result_item .hkpm_search_result_text{ width: calc(100% - 240px); padding-right: 20px; }
    .hkpm_search_result_item .hkpm_search_result_img{ width: 240px;}
}
@media screen and (max-width:767px){ 
    .hkpm_search_result_item{ flex-wrap: wrap; }
    .hkpm_search_result_item .hkpm_search_result_text{ width: 100%; padding-right: 0px; }
    .hkpm_search_result_item .hkpm_search_result_img{ width: 100%; }
    .hkpm_search_result_item .hkpm_search_result_img img{ max-width: 240px; margin-top: 20px;}
}
/*--------------------------------------------------------------------------------*/
.hkpm_search_empty{ text-align: center; padding: 100px 0px 200px 0px; }
/*--------------------------------------------------------------------------------*/
.hkpm_page{
    display: flex; align-items: center; justify-content: center;
    margin: 40px 0px 100px 0px;
}
.hkpm_page_prev span,
.hkpm_page_next span{ display: none; }

.hkpm_page_prev.inactive,
.hkpm_page_next.inactive{ opacity: 0.3; }

.hkpm_page .hkpm_page_text{  margin: 0px 40px; }
.hkpm_page .hkpm_page_text span{
    display:inline-block; 
    padding: 5px 12px; margin-right: 10px;
    border: 1px solid #999; 
}
/*================================================================================*/
/* ANIMATION */
/*================================================================================*/
.animation{ 
    transition: ease-in-out all 1s;
}
.animation--heading{ transform: translateY(-120px);}
@media screen and (max-width:1023px){ .animation--heading{ transform: translateY(-60px); } }
@media screen and (max-width: 767px){ .animation--heading{ transform: translateY(-40px); } }
.animation--heading.inscreen{ transform: translateY(0px) !important; }

/*--------------------------------------------------------------------------------*/
.animation--up{ transform:translateX(0vw) translateY(10vh); opacity: 0; }
.animation--up.inscreen{ transform:translateX(0vw) translateY(0vw); opacity: 1; }
.animation--up.outscreen{ transform:translateX(0vw) translateY(-10vh); opacity: 0; }

.animation--up_left{ transform:translateX(8vw) translateY(10vh); opacity: 0; }
.animation--up_left.inscreen{ transform:translateX(0vw) translateY(0vw); opacity: 1; }
.animation--up_left.outscreen{ transform:translateX(4vw) translateY(-10vh); opacity: 0; }

.animation--up_right{ transform:translateX(-8vw) translateY(10vh); opacity: 0; }
.animation--up_right.inscreen{ transform:translateX(0vw) translateY(0vw); opacity: 1; }
.animation--up_right.outscreen{ transform:translateX(-4vw) translateY(-10vh); opacity: 0; }

.animation--left{ transform:translateX(8vw) translateY(0vh); opacity: 0; }
.animation--left.inscreen{ transform:translateX(0vw) translateY(0vw); opacity: 1; }
.animation--left.outscreen{ transform:translateX(4vw) translateY(-10vh); opacity: 0; }

.animation--right{ transform:translateX(-8vw) translateY(0vh); opacity: 0; }
.animation--right.inscreen{ transform:translateX(0vw) translateY(0vw); opacity: 1; }
.animation--right.outscreen{ transform:translateX(-4vw) translateY(-10vh); opacity: 0; }

/*--------------------------------------------------------------------------------*/
@media screen and (max-width:767px){ 
    .mobile--left{ text-align: left !important;}
}
/*--------------------------------------------------------------------------------*/
#a11y-to-content{
    position: fixed; top: -100px; left: 0px; z-index: 100;
    background: #FFF;  padding: 5px 20px;
    transition: ease all 0.3s;
}
#a11y-to-content:focus{
    top:0px;
}
/*--------------------------------------------------------------------------------*/
.hkpm_logged-in, .hkpm_logged-out{
    display: none;
}

/*--------------------------------------------------------------------------------*/
/* LINE LIST (Rich Editor) */
ul.hkpm_line_list{ list-style: none; margin: 0px; padding: 0px; margin-bottom: 20px; }
ul.hkpm_line_list li{ 
    padding: 10px 0px; margin: 0px;
    border-bottom: 1px solid #A28C57;
}
ul.hkpm_line_list li:before{ display: none; }
ul.hkpm_line_list li:last-of-type{ border: none; }
/*--------------------------------------------------------------------------------*/
/* OVERRIDES */
.hkpm_addr .hkpm_gt{
    display:inline-block; vertical-align:middle; 
    margin-left:5px; padding-left:5px;
    border-left:1px solid #CCC;
}
.hkpm_open_hrs{ margin-bottom:20px; border-left: 3px solid #dad1bc; }
.hkpm_open_hrs:last-of-type{ margin-bottom: 0px; }
.hkpm_open_hrs .hkpm_label:before{ display: none !important;}
.hkpm_open_hrs .hkpm_label{ padding-left: 20px; margin: 0px; }
.hkpm_open_hrs .hkpm_label:first-of-type{ font-weight: bold; }
.hkpm_row .hkpm_row--subhour{ align-items: flex-start; }

@media screen and (max-width: 767px){
    .hkpm_open_hrs{ width: calc(50% - 10px); }
    .hkpm_open_hrs .hkpm_label{ width: 100% !important; }
    .hkpm_open_hrs{ margin-bottom: 0px; }
}

.grecaptcha-badge { visibility: hidden; }

.hkpm_main .hkpm_title{
    font-weight: 500; 
}

.js-accordion{
    cursor: pointer;
}

.no-margin{
    margin: 0 !important;
}




/*--------------------------------------------------------------------------------*/
/* MENU BOOK NOW BUTTON */
.hkpm_booknow{
    position: relative;
    display: block;
    overflow: hidden;
    flex-shrink: 0;
}               
.hkpm_booknow:before{
    content: "";
    display: block;
    box-sizing: border-box;
    position: absolute;
    top: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    border: 1px solid #A28C57;
    background: rgba(255, 255, 255, 0);
    transform: skew(-15deg, 0deg) translateX(-10px);
}
.hkpm_booknow:after{
    content: "";
    display: block;
    box-sizing: border-box;
    position: absolute;
    top: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    border: 1px solid #A28C57;
    background: #A28C57;
    transform: skew(-15deg, 0deg) translateX(-10px);
    transform-origin: right center;
}
.hkpm_booknow:hover:after {
    transform: skew(-15deg, 0deg) translateX(-10px) scaleX(0);
}
.hkpm_booknow span{
    display: block;
    position: relative;
    padding: 8px 32px 8px 15px;
    border-left: 1px solid #A28C57;
    color: #FFF;
    font-weight: bold;
    z-index: 2;
    transition: 0.3s color ease;
} 
.hkpm_booknow:hover span {
    color: #A28C57;
}
.hkpm_booknow span:after {
    content: ""; display: block;
    box-sizing: border-box;
    position: absolute; top: calc(50% - 3px); right: 22px; width: 6px; height: 6px;
    border-top: 2px solid #FFF;
    border-right: 2px solid #FFF;
    transform: rotate(45deg);
    transition: 0.3s border-color ease;
}
.hkpm_booknow:hover span:after {
    border-top-color: #A28C57;
    border-right-color: #A28C57;
}
/*
.hkpm_booknow:hover:before,
.hkpm_booknow:hover:after{
    background: #FFF;
}
.hkpm_booknow:hover span{ color: #A28C57; }
.hkpm_booknow:hover span:after{ border-color: #A28C57; }
*/
.hkpm_menu.open .hkpm_menu_profile{
    display: none !important;
}

.hkpm_mobile_menu_s0{
    padding:20px 20px 0px 20px;
    display: flex; align-items: center; justify-content: flex-end;
}
.hkpm_mobile_menu_s0 .hkpm_menu_profile{
    margin: 0px 10px 0px 0px; padding: 0px 10px 0px 0px;
    border-right: 1px solid #CCC; line-height: 1.2em;
}
.hkpm_mobile_menu_s0 .hkpm_menu_profile:last-child {
    padding-right: 0;
    margin-right: 0;
    border-right: 0;
}
.hkpm_mobile_menu_s0 .hkpm_menu_profile.disable{ display: none; }
.hkpm_mobile_menu_s0 .hkpm_menu_profile_dropdown{ display: none; }
.hkpm_mobile_menu_s0 .hkpm_menu_profile > a {
    display: block; position: relative;
    /*max-width: 100px;*/
}
.hkpm_mobile_menu_s0 .hkpm_menu_profile:not(.js-menu_profile_unlogged) > a{
    padding-right: 10px; 
}
.hkpm_mobile_menu_s0 .hkpm_menu_profile:not(.js-menu_profile_unlogged) > a:after {
    content: ""; display: block;
    position: absolute;
    top: calc(50% - 2px); right: 1px; width: 4px; height: 4px;
    border-bottom: 1px solid #A28C57;
    border-right: 1px solid #A28C57;
    transform: rotate(45deg);
}
.hkpm_mobile_menu_s0 .ticket span{ display: none;}
.hkpm_mobile_menu_s0 .ticket:before {
    content: ""; display: block;
    width: 20px; height: 20px;
    background-image: url(../img/svg/shopping-cart-black.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    margin-right: 5px;
    margin-top: 1px;
}
.hkpm_mobile_menu_s1.show{ border-top: 1px solid #D7D7D7;  margin-top: 10px; }

@media screen and (min-width:1400px) {
    .hkpm_booknow--mobile{ display: none !important;}
}
@media screen and (max-width:1399px) {
    .hkpm_booknow--desktop{ display: none !important;}
    .hkpm_menu_side .search{ display: none !important; }
    .hkpm_menu_side .ticket{ display: none !important; }
    .hkpm_menu .hkpm_main .hkpm_menu_side .ticket, 
    .hkpm_menu .hkpm_main .hkpm_menu_side .search{ margin-left: 5px; }
}


/*------------------
event/exhibition multi banner
---------------------*/

.banner_nav{
    position: absolute;
    z-index: 999;
    display: flex;
    flex-direction: flex-end;
    justify-content: flex-end;
    align-items: center;
    /* padding: 20px; */
    padding-right: 10px;
}

.hkpm_event_exhib_banner .hkpm_event_exhib_banner_nav{ padding: 0px 40px 40px 0px; }
@media screen and (max-width:1023px){
    .hkpm_event_exhib_banner .hkpm_event_exhib_banner_nav{ padding: 0px 20px 20px 0px; }

    .swiper-nav .swiper-pagination-bullet{ margin: 0px 10px; }
}


.hkpm_event_exhib_banner .swiper-container {
    width: 100%;
    height: 37.5vw; /* Now set to 720/1920=37.5% Set height to auto for responsive resizing */
    position: relative;
}

.hkpm_event_exhib_banner .swiper-slide img {
    width: 100%;
    /* height: auto; */
    min-height: 37.5vw;
    max-height: 50vw;
    object-fit:cover;
    object-position: center;
}

.hkpm_event_exhib_banner .swiper-pagination {
    position: absolute;
    bottom: 10px;
    right: 10px; /* Adjust this value for the desired right offset */
}
        
/*------------------
ticket / info new style
---------------------*/
.ticket-list__rich-editor {
    padding: 0;
}
.ticket-list__rich-editor p:first-child {margin-top: 0;}
.ticket-list__rich-editor p:last-child {margin-bottom: 0;}
.ticket-notice {
    position: relative;
    display: flex;
    align-items: flex-start;
    padding: 14px 42px 14px 14px;
    margin: 38px 0;
    background-color: #F6F6F6;
}
.ticket-notice:first-child {
    margin-top: 0;
}
.ticket-notice__close {
    position: absolute;
    top: 14px;
    right: 14px;
    display: block;
    width: 20px;
    height: 20px;
    border: 0;
    background-color: transparent;
    cursor: pointer;
}
.ticket-notice__close:before,
.ticket-notice__close:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    display: block;
    width: 100%;
    height: 1px;
    background-color: #A28C57;
    transition: 0.3s background-color ease, 0.3s transform ease;
}
.ticket-notice__close:after {
    transform: rotate(90deg);
}
.ticket-notice__close.active:after {
    transform: rotate(0deg);
}
.ticket-notice__left {
    flex-shrink: 0;
    margin-right: 28px;
}
.hkpm_main .ticket-notice__title {
    display: flex;
    align-items: center;
    color: #A28C57;
    font-size: 22px;
}
.ticket-notice__title-icon {
    display: inline-flex;
    width: 1.4em;
    height: 1.4em;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 50%;
    margin-right: 8px;
    font-weight: bold;
    color: #fff;
    background-color: #A28C57;
}
.ticket-notice__close:hover:before,
.ticket-notice__close:hover:after {
    background-color: #A28C57;
}
.swiper-anchor {
    display: flex;
    align-items: center;
}
.circle-arrow {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: 1px #A28C57 solid;
    border-radius: 50%;
    transition: 0.3s background-color ease, transform 0.3s ease;
}
.circle-arrow--left {
    transform: rotate(90deg);
}
.circle-arrow--right {
    transform: rotate(-90deg);
}
.open .circle-arrow {
    transform: rotate(180deg);
}
.circle-arrow:after {
    content: "";
    display: block;
    width: 30%;
    height: 30%;
    margin-top: -10%;
    border-right: 1px #A28C57 solid;
    border-bottom: 1px #A28C57 solid;
    background: none;
    transform: rotate(45deg);
    transition: 0.3s border-color ease;
}
.circle-arrow:hover,
.circle-arrow__outer:hover .circle-arrow {
    background-color: #a28c57;
}
.circle-arrow:hover:after,
.circle-arrow__outer:hover .circle-arrow:after {
    border-color: #fff;
}
.swiper-anchor__container {
    flex-grow: 1;
    margin: 0 24px;
}
/* .swiper-anchor__container:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 30px;
    height: 100%;
    background-image: linear-gradient(to right, transparent, rgba(0,0,0,0.1));
    z-index: 2;
} */
.hide-shadow:after {
    display: none;
}
.ticket-list {
    margin: 38px 0;
}
.ticket-list:last-child {
    margin-bottom: 88px;
}
.ticket-list__item {
    border: 1px #d7d7d7 solid;
    margin: 34px 0;
    overflow: hidden;
}
.ticket-list__item:first-child {
    margin-top: 0;
}
.ticket-list__item:last-child {
    margin-bottom: 0;
}
.hkpm_main .ticket-list__title {
    padding: 12px 24px;
    margin: 0;
    background-color: #efe8d8;
    transition: 0.3s background-color ease, 0.3s color ease;
}
.ticket-list__title > *:last-child {
    margin-bottom: 0;
}
.swiper-anchor__btn {
    display: flex;
    align-items: center;
    width: 370px;
    max-width: 70%;
    height: auto;
    padding: 14px 24px;
    border: 1px #d7d7d7 solid;
    /* font-weight: 500; */
    font-size: 16px;
    overflow: hidden;
    transition: 0.3s color ease, 0.3s opacity ease;
}
.swiper-anchor__btn > * {
    flex-grow: 1;
}
.swiper-anchor__btn span {
    position: relative;
    z-index: 2;
}
.swiper-anchor__btn:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: calc(100% + 20px);
    height: 100%;
    background-color: #A28C57;
    transform: translateX(-150%);
    transition-duration: 0.5s;
    clip-path: polygon(0 0, 100% 0%, calc(100% - 20px) 100%, 0% 100%);
}
.swiper-anchor__btn:hover,
.swiper-anchor__btn.active {
    color: #fff !important;
}
.swiper-anchor__btn:hover:before,
.swiper-anchor__btn.active:before {
    transform: translateX(20px);
}
.ticket-list__item.active .ticket-list__title {
    color: #fff !important;
    background-color: #A28C57;
}
.swiper-anchor__btn:hover *,
.swiper-anchor__btn.active *,
.ticket-list__item.active .ticket-list__title * {
    color: #fff !important;
}
.ticket-list__content {
    display: flex;
    flex-wrap: wrap;
    border-bottom: 1px #d7d7d7 solid;
}
.ticket-list__content:last-child {
    border-bottom: 0;
}
.ticket-list__subitem-content {padding: 0 38px 0 0;}
.ticket-list__subitem-content:last-child {padding: 0;}
.ticket-list__accordion-btn .circle-arrow {
    margin-left: 0.5em;
}
.ticket-list__accordion-btn._link {
    text-decoration: underline;
    transition: 0.3s opacity ease;
}
.ticket-list__accordion-btn._link:hover {
    opacity: 0.7;
    text-decoration: none;
}
.ticket-list__subitem-container {
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    width: calc(100% - 240px);
}
.ticket-list__subitem {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-grow: 1;
    width: 100%;
    padding: 24px;
    border-bottom: 1px #d7d7d7 solid;
}
.ticket-list__subitem:last-child {
    border-bottom: 0;
}
.ticket-list__subitem-price {
    flex-shrink: 0;
    width: 140px;
    font-size: 20px;
    font-weight: 500;
}
.ticket-list__subitem-price._mb {
    display: none;
    width: 100%;
}
.ticket-list__accordion-container {
    flex-shrink: 0;
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    width: 240px;
    padding: 24px 12px;
    background-color: #f7f7f7;
}
.ticket-list__accordion-btn {
    display: flex;
    align-items: center;
    margin: auto;
    color: #A28C57;
    font-size: 22px;
    font-weight: bold;
}
.ticket-list__blk {
    display: none;
    width: 100%;
    background-color: #f4f4f4;
}
.ticket-list__blk-inner {
    display: flex;
}
.ticket-list__blk-item {
    flex-grow: 1;
    width: 50%;
    padding: 38px 24px;
    border-right: 1px #d7d7d7 solid;
}
.ticket-list__blk-item:last-child {
    border-right: 0;
}
.ticket-list__detail-btn {
    margin-top: 0.5em;
}
.ticket-list__detail-btn:hover {
    text-decoration: none;
}
.ticket-list .pop {
    display: none;
}
.ticket-list__remark {
    width: 100%;
    padding: 24px 0 0;
}
.ticket-popup__content {
    padding: 0;
}
.ticket-popup__content h3, .ticket-popup__content h4, .ticket-popup__content h5, .ticket-popup__content h6 {
    max-width: none;
}
.icon-grid__container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 38px 24px;
}
.icon-grid__item {
    display: flex;
}
.icon-grid__img {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    object-fit: cover;
    object-position: top left;
    margin-right: 12px;
}
.icon-grid__textarea h4 {
    margin-top: 0;
    margin-bottom: 0.5em;
}
.icon-grid__textarea p {
    margin-top: 0;
}
.icon-grid__textarea p:last-child {
    margin-bottom: 0;
}
.hkpm-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
}
.hkpm-grid__item-img {
    display: block;
    margin-bottom: 12px;
}
.hkpm-grid__item h4:last-child,
.hkpm-grid__item p:last-child {
    margin-bottom: 0;
}
.margin-sec {
    margin-top: 88px;
    margin-bottom: 88px;
}
.margin-sec:first-child {
    margin-top: 0;
}
.margin-sec:last-child {
    margin-bottom: 0;
}
.fw-500 {
    font-weight: 500 !important;
}
.fw-400 {
    font-weight: 400 !important;
}
.video-pop {
    position: fixed;
    z-index: 9999;
    display: none;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.75);
    overflow: hidden;
}
.video-pop__close {
    position: absolute;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    top: 40px;
    right: 60px;
    width: 48px;
    height: 48px;
    color: #fff;
    background: #000;
    border-radius: 50%;
}
.video-pop__body {
    position: absolute;
    top: 50%;
    left: 20px;
    width: calc(100% - 40px);
    max-height: calc(100% - 40px);
    color: #000;
    background: #fff;
    transform: translateY(-50%);
    overflow: auto;
}
.video-pop__frame {
    position: relative;
    height: 80vh;
    background: #333;
    color: #fff;
}
.video-pop__frame iframe,
.video-pop__frame video {
    display: block;
    width: 100%;
    height: 100%;
    border: none;
}
.video-pop__desc {
    padding: 20px 40px;
}
.video-pop__desc p {
    font-size: 14px;
    line-height: 1.5em;
    margin: 0px;
}
.video-pop__desc-btn {
    display: block;
    margin: 20px auto;
    text-align: center;
}
.video-popup__btn {
    /* --left: 30px; */
    /* --bottom: 30px; */
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    cursor: pointer;
}
.video-popup__btn img {
    display: block;
    width: 100%;
}
.video-popup__btn:after {
    content: "";
    position: absolute;
    /* left: var(--left); */
    /* bottom: var(--bottom); */
    top: 50%;
    left: 50%;
    display: block;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: url(../img/svg/icon-play.svg) 52% center / 20% auto no-repeat #fff;
    /* animation: videoBtn 0.5s ease 0s 1 reverse forwards; */
    transform: translate(-50%, -50%) scale(1);
    transition: 0.3s all ease;
}
.video-popup__btn:focus:after,
.video-popup__btn:hover:after {
    /* animation: videoBtn2 0.5s ease 0s 1 normal forwards; */
    transform: translate(-50%, -50%) scale(1.2);
}
/* @keyframes videoBtn {
    0% {
        left: var(--left);
        bottom: var(--bottom);
        transform: none;
        opacity: 1;
    }
    50% {
        left: var(--left);
        bottom: var(--bottom);
        transform: none;
        opacity: 0;
    }
    51% {
        left: 50%;
        bottom: 50%;
        transform: translate(-50%, 50%) scale(1);
        opacity: 0;
    }
    100% {
        left: 50%;
        bottom: 50%;
        transform: translate(-50%, 50%) scale(1.5);
        opacity: 1;
    }
}
@keyframes videoBtn2 {
    0% {
        left: var(--left);
        bottom: var(--bottom);
        transform: none;
        opacity: 1;
    }
    50% {
        left: var(--left);
        bottom: var(--bottom);
        transform: none;
        opacity: 0;
    }
    51% {
        left: 50%;
        bottom: 50%;
        transform: translate(-50%, 50%) scale(1);
        opacity: 0;
    }
    100% {
        left: 50%;
        bottom: 50%;
        transform: translate(-50%, 50%) scale(1.5);
        opacity: 1;
    }
} */
.egypt-banner {
    display: flex;
    min-height: min(1080px, 100vh);
    color: #fff;
    /* background: url(/preview/assets/img/egypt/banner.jpg) 40vw top / 1000px auto no-repeat fixed; */
    background-color: #000;
    clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 100%);
}
.egypt-banner__bg {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}
.egypt-banner__bg img,
.egypt-banner__bg video {
    position: absolute;
    top: 0px;
    left: 0px;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.egypt-banner__bg img:nth-child(2) {
    display: none;
}
/* .egypt-banner__img {
    position: relative;
    top: auto;
    right: auto;
    display: none;
    width: 100%;
    height: auto;
    margin: 0 auto;
    max-width: 480px;
} */
.egypt-banner .hkpm_main {
    position: relative;
    width: 100%;
}
.egypt-banner__textarea {
    position: relative;
    display: flex;
    flex-flow: column;
    align-items: flex-start;
    justify-content: center;
    width: 54%;
    height: 100%;
    padding-top: 170px;
    padding-bottom: 58px;
}
.hkpm_main .egypt-banner__title {
    font-size: 64px;
    font-weight: 400;
    line-height: 1.1;
}
.hkpm_main .egypt-banner__title p {
    font-size: inherit;
    line-height: inherit;
}
.egypt-banner p {
    font-size: 20px;
}
.egypt-banner__info {
    display: flex;
    align-items: center;
    gap: 20px;
}
.hkpm_main .egypt-banner__info-date {
    position: relative;
    padding-left: 1.5em;
}
.hkpm_main .egypt-banner__info-date:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 1em;
    height: 1.5em;
    background: url(../img/egypt/icon-calendar.svg) left center / contain no-repeat;
}
.egypt-banner__info-line {
    display: block;
    width: 1px;
    height: 1.5em;
    background-color: #fff;
}
.egypt-banner .hkpm_btn {
    margin: 24px 0;
}
.logo-list {
    margin-top: 38px;
    display: flex;
    flex-flow: column;
    gap: 24px;
}
.logo-list__row {
    display: flex;
    flex-wrap: wrap;
    gap: 24px 58px;
}
.logo-list__col {
    display: flex;
    flex-flow: column;
}
.hkpm_main .logo-list__col-title {
    margin-bottom: 12px;
    font-size: 14px;
    font-weight: normal;
    text-transform: none;
}
.logo-list__col-logos {
    flex-grow: 1;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px 58px;
}
.logo-list__col-logos img {
    width: auto;
}
.tickets-info {
    position: relative;
    display: flex;
    align-items: center;
    padding: 120px 0;
    border-bottom: 1px solid rgba(162, 140, 87, 0.65);
}
.tickets-info:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 4px;
    display: block;
    width: 100%;
    height: 1px;
    background-color: rgba(162, 140, 87, 0.65);
}
.tickets-info__col {
    width: 50%;
    padding: 0 38px;
    border-right: 1px solid rgba(162, 140, 87, 0.3);
}
.tickets-info__col:first-child {
    padding-left: 0;
}
.tickets-info__col:last-child {
    border-right: 0;
}
.tickets-info__col-inner {
    display: flex;
    flex-direction: column;
    max-width: 500px;
}
.tickets-info__col-inner--center {
    margin: 0 auto;
}
.tickets-info__item {
    padding: 42px 0;
    border-bottom: 1px solid rgba(162, 140, 87, 0.3);
}
.tickets-info__item:first-child {
    padding-top: 0;
}
.tickets-info__item:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}
.tickets-info__item h3 {
    margin-bottom: 0.5em;
}
.tickets-info__item p {
    margin-bottom: 1em;
}
.tickets-info__item p:last-child {
    margin-bottom: 0;
}
.js-pop_content_detail {
    display: none !important;
}
@media screen and (max-width: 1439px) {
    /* .egypt-banner {
        background-position: 100% top;
        background-size: 70vw auto;
    } */
    .hkpm_main .egypt-banner__title {
        font-size: 60px;
    }
}
@media screen and (max-width: 1279px) {
    .ticket-list__subitem-price {
        width: 90px;
    }
    .ticket-list__detail-btn,
    .ticket-list__subitem-price {
        font-size: 18px;
    }
    .hkpm_main .ticket-notice__title,
    .ticket-list__accordion-btn {
        font-size: 20px;
    }
    .hkpm_main .egypt-banner__title {
        font-size: 54px;
    }
    .egypt-banner p {
        font-size: 18px;
    }
}
@media screen and (max-width: 1023px) {
    .ticket-list__subitem-container {
        width: calc(100% - 150px);
    }
    .hkpm_main .ticket-notice__title,
    .ticket-list__accordion-btn {
        font-size: 18px;
    }
    .ticket-list__accordion-btn .circle-arrow {
        width: 1em;
        height: 1em;
    }
    .ticket-list__accordion-container {
        width: 150px;
    }
    .icon-grid__img {
        width: 30px;
        height: 30px;
    }
    .margin-sec {
        margin-top: 68px;
        margin-bottom: 68px;
    }
    .video-pop__close {
        right: 40px;
    }
    .video-pop__desc {
        padding: 20px;
    }
    .video-pop__desc p {
        font-size: 14px;
    }
    .hkpm_main .egypt-banner__title {
        font-size: 48px;
    }
    .tickets-info {
        padding: 90px 0;
    }
}
@media screen and (max-width: 767px) {
    .egypt-banner .hkpm_main {
        display: flex;
        flex-flow: column;
    }
    .egypt-banner__bg img:nth-child(1) {
        display: none;
    }
    .egypt-banner__bg img:nth-child(2) {
        display: block;
    }
    .ticket-notice {
        flex-flow: column;
    }
    .ticket-notice__left {
        margin-right: 0;
        width: 100%;
    }
    .ticket-notice__right {
        width: 100%;
        margin-top: 6px;
    }
    .swiper-anchor__container {
        margin: 0 8px;
    }
    .ticket-list__blk-inner {
        flex-flow: column;
    }
    .ticket-list__blk-item {
        width: 100%;
        border-right: 0;
        border-bottom: 1px #d7d7d7 solid;
    }
    .ticket-list__blk-item:last-child {
        border-bottom: 0;
    }
    .ticket-list__subitem-container,
    .ticket-list__accordion-container {
        width: 100%;
    }
    .ticket-list__accordion-container {
        padding: 12px;
    }
    .ticket-list__accordion-btn {
        width: 100%;
        justify-content: center;
    }
    .ticket-list__detail-btn {
        font-size: 16px;
    }
    .ticket-list__subitem-content {padding: 0;}
    .ticket-list__subitem-price {
        width: 100%;
        margin-top: 6px;
    }
    .ticket-list__subitem-price._dt {
        display: none;
    }
    .ticket-list__subitem-price._mb {
        display: block;
    }
    .margin-sec {
        margin-top: 58px;
        margin-bottom: 58px;
    }
    .video-popup__btn {
        --left: 20px;
        --bottom: 20px;
    }
    .video-popup__btn:after {
        width: 60px;
        height: 60px;
    }
    .hkpm_main .egypt-banner__title {
        font-size: 36px;
    }
    /* .egypt-banner {
        background-image: none !important;
    }
    .egypt-banner__img {
        display: block;
    } */
    .notice .egypt-banner__img {
        padding-top: 80px;
    }
    .egypt-banner__textarea {
        width: 100%;
        height: auto;
        padding: 38px 0;
        margin: auto 0;
    }
    .egypt-banner p {
        font-size: 16px;
    }
    .tickets-info {
        flex-flow: column;
        padding: 60px 0;
    }
    .tickets-info__col {
        width: 100%;
        padding: 28px 0;
        border-right: 0;
        border-bottom: 1px solid rgba(162, 140, 87, 0.3);
    }
    .tickets-info__col:first-child {
        padding-top: 0;
    }
    .tickets-info__col:last-child {
        padding-bottom: 0;
        border-bottom: 0;
    }
    .tickets-info__col-inner {
        max-width: 100%;
    }
    
    .tickets-info__item {
        padding: 28px 0;
    }
}
@media screen and (max-width: 479px) {
    .icon-grid__container {
        grid-template-columns: 1fr;
        gap: 28px;
    }
    .icon-grid__img {
        width: 20px;
        height: 20px;
    }
    .hkpm-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }
    .margin-sec {
        margin-top: 48px;
        margin-bottom: 48px;
    }
    .video-popup__btn:after {
        width: 50px;
        height: 50px;
    }
    .hkpm_main .egypt-banner__title {
        font-size: 34px;
    }
    .egypt-banner__info {
        gap: 10px;
    }
}

@media screen and (max-width: 767px) {
    html body .hkpm_head .hkpm_menu .hkpm_main .hkpm_menu_logo,
    html body .hkpm_head .hkpm_menu.floating .hkpm_main .hkpm_menu_logo,
    html body .hkpm_head .hkpm_menu.open .hkpm_main .hkpm_menu_logo {
        width: 118px !important;
        height: 58px !important;
        min-width: 118px !important;
        max-width: 32vw !important;
        transition: none !important;
    }

    html body .hkpm_head .hkpm_menu .hkpm_main .hkpm_menu_logo a,
    html body .hkpm_head .hkpm_menu.floating .hkpm_main .hkpm_menu_logo a,
    html body .hkpm_head .hkpm_menu.open .hkpm_main .hkpm_menu_logo a {
        width: 118px !important;
        height: 58px !important;
        max-width: 32vw !important;
        transition: none !important;
    }

    html body .hkpm_head .hkpm_menu .hkpm_main .hkpm_menu_logo .logo,
    html body .hkpm_head .hkpm_menu.floating .hkpm_main .hkpm_menu_logo .logo,
    html body .hkpm_head .hkpm_menu.open .hkpm_main .hkpm_menu_logo .logo {
        width: 118px !important;
        height: 58px !important;
        max-width: 32vw !important;
        max-height: 58px !important;
        transform: scale(0.82) !important;
        transform-origin: left center !important;
        transition: none !important;
    }
}

.p24-mobile-notice-break {
    display: none !important;
}

@media screen and (max-width: 767px) {
    .p24-mobile-notice-break {
        display: block !important;
    }
}

@media screen and (max-width: 767px) {
    html body .hkpm_notice {
        box-sizing: border-box !important;
        min-height: 77px !important;
        padding: 8px 14px 9px !important;
        overflow: hidden !important;
    }

    html body .hkpm_notice .hkpm_main {
        display: block !important;
        width: 100% !important;
        min-height: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    html body .hkpm_notice .hkpm_notice_title {
        position: static !important;
        width: 100% !important;
        margin: 0 0 2px !important;
        font-size: 13px !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
    }

    html body .hkpm_notice .hkpm_notice_body,
    html body .hkpm_notice .hkpm_notice_slider,
    html body .hkpm_notice .swiper-container {
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important;
    }

    html body .hkpm_notice .swiper-wrapper {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        transform: none !important;
    }

    html body .hkpm_notice .swiper-slide {
        display: none !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    html body .hkpm_notice .swiper-slide-active {
        display: block !important;
    }

    html body .hkpm_notice .hkpm_notice_body .swiper-slide a,
    html body .hkpm_notice .hkpm_notice_body .swiper-slide span {
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: 100% !important;
        padding-right: 0 !important;
        font-size: 12px !important;
        line-height: 1.35 !important;
        white-space: normal !important;
        word-break: keep-all !important;
        overflow-wrap: normal !important;
        overflow: visible !important;
    }

    html body .hkpm_notice .hkpm_notice_close,
    html body .hkpm_notice .hkpm_notice_nav {
        display: none !important;
    }
}

@media screen and (max-width: 380px) {
    html body .hkpm_notice {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    html body .hkpm_notice .hkpm_notice_title {
        font-size: 12px !important;
    }

    html body .hkpm_notice .hkpm_notice_body .swiper-slide a,
    html body .hkpm_notice .hkpm_notice_body .swiper-slide span {
        font-size: 11px !important;
    }
}

@media screen and (max-width: 767px) {
    html body .hkpm_head .hkpm_menu .hkpm_main {
        justify-content: flex-end !important;
        padding-left: 14px !important;
    }

    html body .hkpm_head .hkpm_menu .hkpm_main .hkpm_menu_side {
        margin-left: auto !important;
        gap: 2px !important;
    }

    html body .hkpm_head .hkpm_booknow--mobile {
        min-height: 34px !important;
        padding: 0 10px !important;
        font-size: 13px !important;
        transform: translateX(10px) !important;
    }

    html body .hkpm_head .hkpm_menu .hkpm_main .hkpm_menu_side .mobile {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 40px !important;
        height: 40px !important;
        margin-left: 0 !important;
        background: transparent !important;
        border-radius: 0 !important;
        transform: translateX(16px) !important;
    }

    html body .hkpm_head .hkpm_menu .hkpm_main .hkpm_menu_side .mobile::before,
    html body .hkpm_head .hkpm_menu .hkpm_main .hkpm_menu_side .mobile::after,
    html body .hkpm_head .hkpm_menu .hkpm_main .hkpm_menu_side .mobile .bar::before,
    html body .hkpm_head .hkpm_menu .hkpm_main .hkpm_menu_side .mobile .bar::after {
        display: none !important;
        content: none !important;
    }

    html body .hkpm_head .hkpm_menu .hkpm_main .hkpm_menu_side .mobile .bar {
        display: block !important;
        width: 24px !important;
        height: 2px !important;
        overflow: visible !important;
        background: #111 !important;
        box-shadow: 0 -7px 0 #111, 0 7px 0 #111 !important;
        opacity: 1 !important;
    }

    html body .hkpm_head .hkpm_menu.dark:not(.floating,.open) .hkpm_main .hkpm_menu_side .mobile,
    html body .hkpm_head .hkpm_menu.floating .hkpm_main .hkpm_menu_side .mobile,
    html body .hkpm_head .hkpm_menu.open .hkpm_main .hkpm_menu_side .mobile {
        filter: none !important;
    }

    html body .hkpm_head .hkpm_mobile_menu {
        display: none !important;
        position: fixed !important;
        top: auto;
        left: 0 !important;
        right: 0 !important;
        width: auto !important;
        height: auto !important;
        max-height: calc(100vh - 170px) !important;
        overflow: hidden !important;
        padding: 8px 12px 10px !important;
        background: #fff !important;
        border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
        box-shadow: 0 18px 36px rgba(0, 0, 0, 0.12) !important;
        z-index: 10020 !important;
    }

    html body .hkpm_head .hkpm_mobile_menu.is-open {
        display: block !important;
    }

    html body .hkpm_head .hkpm_mobile_menu .hkpm_mobile_menu_main {
        max-width: 390px !important;
        margin: 0 auto !important;
        padding: 0 !important;
        border-bottom: 0 !important;
    }

    html body .hkpm_head .hkpm_mobile_menu_s2 {
        padding: 0 !important;
    }

    html body .hkpm_head .hkpm_mobile_menu_s2 .hkpm_menu_item {
        padding: 0 !important;
        border-bottom: 0 !important;
    }

    html body .hkpm_head .hkpm_mobile_menu_s2 .hkpm_menu_item + .hkpm_menu_item {
        margin-top: 5px !important;
    }

    html body .hkpm_head .hkpm_mobile_menu_s2 .hkpm_menu_item > a {
        display: block !important;
        padding: 9px 13px !important;
        background: #fff !important;
        color: #18221d !important;
        border: 1px solid #e7e3da !important;
        box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05) !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        text-align: left !important;
    }

    html body .hkpm_head .hkpm_mobile_menu .p24-about-dropdown {
        margin-top: 5px !important;
    }

    html body .hkpm_head .hkpm_mobile_menu .p24-about-dropdown a {
        padding: 8px 13px !important;
        font-size: 13px !important;
        line-height: 1.2 !important;
    }
}