/* Theme DHK Festival 2024-2025 */
@import url('font-opensans.css');
@import url('font-notosans.css');
@import url('font-notosanstc.css');
@import url('font-notosanssc.css');
@import url('font-notosansjp.css');

:root {
	--main-font: 'Open Sans', arial, 'PingFang TC', 'Microsoft JhengHei', \5FAE\8EDF\6B63\9ED1\9AD4, 'MHei', PMingLiU, sans-serif;
	--title-font: 'Open Sans', 'Noto Sans', 'Noto Sans TC', arial, 'PingFang TC', 'Microsoft JhengHei', \5FAE\8EDF\6B63\9ED1\9AD4, 'MHei', PMingLiU, sans-serif;
	--main-font-size: 20px;
	--h1-font-size: 50px;
	--h2-font-size: 30px;
	--h3-font-size: 30px;
	--h4-font-size: 24px;
	--h5-font-size: 20px;
	--h6-font-size: 19px;

	--title-font-color:#004A5C;
	--main-font-color: #004A5C;
	--colorbox-font-color: #fff;
	--link-color: #004A5C;
	--link-color-hover: #004A5C;
	--primary-button-font-color: #fff;
	--primary-button-bgcolor: #E27C46;
	--selection-font-color: #fff;
	--selection-bgcolor: #6ac7b4;
	--scrollarea-scrollbar-color-thumb: #ff1600;
	--scrollarea-scrollbar-color-track: #ebe5e9;
	--scrollarea-scrollbar-width: 5px;
	--swiper-pagination-bullet-active-color: #007aff;
}
html[lang="zh-CN"]{
	--main-font: 'Open Sans', arial, 'PingFang SC', 'Microsoft JhengHei', \5FAE\8EDF\6B63\9ED1\9AD4, 'MHei', PMingLiU, sans-serif;
	--title-font: 'Open Sans', 'Noto Sans', 'Noto Sans SC', arial, 'PingFang SC', 'Microsoft JhengHei', \5FAE\8EDF\6B63\9ED1\9AD4, 'MHei', PMingLiU, sans-serif;
}
html[lang="ja"]{
	--main-font: 'Open Sans', arial, 'Hiragino Sans', 'Microsoft JhengHei', \5FAE\8EDF\6B63\9ED1\9AD4, 'MHei', PMingLiU, sans-serif;
	--title-font: 'Open Sans', 'Noto Sans', 'Noto Sans JP', arial, 'Hiragino Sans', 'Microsoft JhengHei', \5FAE\8EDF\6B63\9ED1\9AD4, 'MHei', PMingLiU, sans-serif;
}

/* DHK style reset */
.navbar-container{height:auto !important;}
.pwafooter{display:none !important;}
.footerexperiencefragment{position:relative; -webkit-transform:translate3d(0, 0, 0);}
.webchat-mobile{display:none !important;}
.remarks, .remarks p{display:inline-block; color:inherit; width:100%;}

/** Common **/
html[dir] body{background-color:#fff !important;}
html[dir] .footer{border-top:0 !important;}
#theme-skhaf ::selection{background-color:var(--selection-bgcolor); color:var(--selection-font-color);}
.noselect, .noselect *{pointer-events:none; user-select:none; -moz-user-select:none; -khtml-user-select:none; -webkit-user-select:none; -o-user-select:none;}

#theme-skhaf{position:relative; font-weight:400; font-style:normal; /* background-color:#14B9CD; */ background-color:#1FC9D6;}
#theme-skhaf:before{display:block; content:''; position:absolute; left:0; top:0; width:100%; height:100%; background-image:url(../png/bg-pattern-2.png); background-size:1920px auto; background-position:center top; background-repeat:repeat-y; mix-blend-mode:multiply; opacity:.5;}
#theme-skhaf > .aem-Grid{position:relative; z-index:1;}
#theme-skhaf *:not(h1, h2, h3, h4, h5, h6, h1 *, h2 *, h3 *, h4 *, h5 *, h6 *, .es-single-banner-title){font-family:var(--main-font);}
#theme-skhaf, #theme-skhaf :is(div, span, p, a, li, table th, table td):not(h1 *, h2 *, h3 *, h4 *, h5 *, h6 *){font-size:var(--main-font-size); font-weight:400; line-height:1.5; color:var(--main-font-color);}
#theme-skhaf .theme-dark, #theme-skhaf .theme-dark :is(div, span, p, a, li, table th, table td){color:#fff;}
#theme-skhaf .caption .cmp-text p{font-size:0.6875rem;}
#theme-skhaf a.underlined{background-image: -webkit-gradient(linear, left top, left bottom, from(var(--link-color-hover)), to(var(--link-color-hover))),-webkit-gradient(linear, left top, left bottom, from(var(--link-color)), to(var(--link-color)));}
#theme-skhaf a.underlined:hover{color:var(--link-color-hover);}
#theme-skhaf b, #theme-skhaf strong{font-weight:700;}
#theme-skhaf b *, #theme-skhaf strong *{font-weight:inherit !important;}
#theme-skhaf img:not(.iconVideoPlay){max-width:100%;}
#theme-skhaf small{display:inline-block;}
#theme-skhaf :is(.remarks, .remarks *), #theme-skhaf .caption, #theme-skhaf .caption :is(p, a){font-size:14px !important; letter-spacing: 0 !important; line-height:1.3 !important;}
#theme-skhaf .sharing{display:flex; width:100%; justify-content:flex-start;}
#theme-skhaf .sharing .sharing__container{padding:0 !important;}
#theme-skhaf .sharing ul.sharing__list{margin-top:0 !important; margin-bottom:0 !important; flex-wrap:nowrap;}
#theme-skhaf .sharing li.sharing__item:not(:last-child){margin-right:10px;}
#theme-skhaf .sharing li.sharing__item > svg{background-color:transparent; overflow:hidden; border-radius:999px;}
#theme-skhaf .sharing ul.sharing__list .icon-hover__showed path{fill:var(--intro-font-color);}
#theme-skhaf .sharing ul.sharing__list .icon-hover__hidden path{fill:var(--intro-font-color);}

#theme-skhaf :is(.aem-GridColumn.aem-GridColumn--default--8, .dhk-container.max-width-1100, .container-cust, .non-featured-offers-container, .es-btn-group-container){float:none !important; width:100% !important; margin-left:auto !important; margin-right:auto !important; padding:0 20px !important; clear:both !important;}
#theme-skhaf :is(.aem-GridColumn.aem-GridColumn--default--8, .dhk-container.max-width-1100, .non-featured-offers-container, .es-btn-group-container):not(.gohk2022-full-width-container){max-width:calc(1360px + 20px + 20px) !important;}
#theme-skhaf .container-cust{max-width:calc(1360px + 20px + 20px);}
#theme-skhaf .container-cust.large{max-width:calc(1520px + 20px + 20px);}
#theme-skhaf .container-cust > .row:not(:last-child){margin-bottom:50px;}
#theme-skhaf .container.dhk-container.max-width-1100 .cmp-container, #theme-skhaf .gohk2022-full-width-container{max-width:none !important;}
#theme-skhaf .freeformeditor-v2 .row, #theme-skhaf .dataviewcontainer{padding-left:20px; padding-right:20px; margin-left:-20px; margin-right:-20px;}
#theme-skhaf :is(.cta.padding-horizontal .multiple-links, .cta.padding-horizontal .cta-link, .text.padding-horizontal .cmp-text, .image.padding-horizontal .cmp-image, .title.padding-horizontal .cmp-title){padding-left:0 !important; padding-right:0 !important;}
@media (min-width: 991.98px){
	#theme-skhaf .text.caption :is(p, a, *){font-size:16px !important;}
}
#theme-skhaf .text.caption{position:relative; padding-left:44px; margin-top:15px;}
#theme-skhaf .text.caption:before{display:block; content:''; position:absolute; left:0; top:0; width:30px; height:30px; border-radius:999px; background-image:url("data:image/svg+xml,%3Csvg width='7' height='17' viewBox='0 0 7 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.9584 0.44239C4.5267 0.15395 4.0192 0 3.5 0C2.8038 0 2.1361 0.27656 1.6439 0.76884C1.1516 1.26113 0.875 1.92881 0.875 2.625C0.875 3.1442 1.029 3.6517 1.3174 4.0834C1.6058 4.5151 2.0158 4.8515 2.4955 5.0502C2.9751 5.2489 3.5029 5.3008 4.0121 5.1996C4.5213 5.0983 4.9891 4.8483 5.3562 4.4812C5.7233 4.114 5.9733 3.6463 6.0746 3.1371C6.1759 2.62791 6.1239 2.10011 5.9252 1.62046C5.7265 1.1408 5.3901 0.73083 4.9584 0.44239ZM6.7803 16.4053C6.921 16.2647 7 16.0739 7 15.875V14.375C7 14.1761 6.921 13.9853 6.7803 13.8447C6.6397 13.704 6.4489 13.625 6.25 13.625H5.5V7.375C5.5 7.1761 5.421 6.9853 5.2803 6.8447C5.1397 6.704 4.9489 6.625 4.75 6.625H0.75C0.5511 6.625 0.3603 6.704 0.2197 6.8447C0.0789995 6.9853 0 7.1761 0 7.375V8.875C0 9.0739 0.0789995 9.2647 0.2197 9.4053C0.3603 9.546 0.5511 9.625 0.75 9.625H1.5V13.625H0.75C0.5511 13.625 0.3603 13.704 0.2197 13.8447C0.0789995 13.9853 0 14.1761 0 14.375V15.875C0 16.0739 0.0789995 16.2647 0.2197 16.4053C0.3603 16.546 0.5511 16.625 0.75 16.625H6.25C6.4489 16.625 6.6397 16.546 6.7803 16.4053Z' fill='%23ffffff'/%3E%3C/svg%3E%0A"); background-repeat:no-repeat; background-position:center; background-color:var(--primary-button-bgcolor);}

#theme-skhaf .breadcrumb{padding:20px 0;}
#theme-skhaf .breadcrumb *{font-size:14px; font-weight:600; font-family:var(--title-font);}
#theme-skhaf .breadcrumb .cmp-breadcrumb{border:0; margin-top:0; padding-top:0;}
#theme-skhaf .breadcrumb .cmp-breadcrumb > .container{max-width:none !important;}
#theme-skhaf .breadcrumb svg .cls-100{stroke:#004A5C; stroke-width:1px;}
#theme-skhaf .breadcrumb .cmp-breadcrumb__item{padding-right:14px; margin-right:4px;}
#theme-skhaf .breadcrumb .cmp-breadcrumb__item:after{border-color:#004A5C;}

#theme-skhaf :is(h1, h2, h3, h4, h5, h6, h1 *, h2 *, h3 *, h4 *, h5 *, h6 *){font-weight:600; font-family:var(--title-font); color:var(--title-font-color); line-height:1.2;}
#theme-skhaf :is(h1, h1 *){font-size: var(--h1-font-size); letter-spacing:-1px; font-weight:500;}
#theme-skhaf :is(h2, h2 *){font-size: var(--h2-font-size);}
#theme-skhaf :is(h3, h3 *){font-size: var(--h3-font-size);}
#theme-skhaf :is(h4, h4 *){font-size: var(--h4-font-size);}
#theme-skhaf :is(h5, h5 *){font-size: var(--h5-font-size);}
#theme-skhaf :is(h6, h6 *){font-size: var(--h6-font-size);}

#theme-skhaf .theme-dark{
	--title-font-color:#fff;
	--link-color: #fff;
	--link-color-hover: #fff;
}
#theme-skhaf .theme-dark :is(h1, h2, h3, h4, h5, h6, h1 *, h2 *, h3 *, h4 *, h5 *, h6 *){color:var(--title-font-color);}

.has-youtube .fancybox__content, .has-vimeo .fancybox__content, .has-html5video .fancybox__content, .has-iframe .fancybox__content{width:80% !important; height:auto !important;}
.has-iframe .fancybox__content{width:80% !important; height:auto !important; padding:0 !important; aspect-ratio:1.77778 / 1; background-color:transparent !important;}
#theme-skhaf .section-head{margin-bottom:40px;}
#theme-skhaf .swiper-pagination-bullet:not(.swiper-pagination-bullet-active){opacity:.7;}

#theme-skhaf .btn-primary{position:relative; display:inline-flex; justify-content:center; align-items:center; min-height:60px; border-radius:999px; padding:15px 30px; margin-bottom:4px; border:0; background-color:var(--primary-button-bgcolor); outline:none; line-height:1.15; }
#theme-skhaf .btn-primary, #theme-skhaf .btn-primary *{color:var(--primary-button-font-color) !important; font-weight:600 !important;}
#theme-skhaf .btn-primary:not(:last-child){margin-right:8px;}
#theme-skhaf .btn-primary:after{display:block; content:''; position:absolute; right:20px; top:calc(50% - 8px); width:9px; height:16px; -webkit-mask:url(../svg/button-arrow-icon.svg) no-repeat 50% 50%; mask:url(../svg/button-arrow-icon.svg) no-repeat 50% 50%; -webkit-mask-size:cover; mask-size:cover; background-color:var(--story-button-font-color); transition:transform .4s cubic-bezier(0.25, 1, 0.5, 1); -moz-transition:transform .4s cubic-bezier(0.25, 1, 0.5, 1); -ms-transition:transform .4s cubic-bezier(0.25, 1, 0.5, 1); -webkit-transition:transform .4s cubic-bezier(0.25, 1, 0.5, 1);}
#theme-skhaf .btn-primary:hover:after{transform:translateX(3px) scale(.85);}
.btn-primary.disabled{padding:12px 20px !important; filter:grayscale(.65); pointer-events:none; user-select:none; -moz-user-select:none; -khtml-user-select:none; -webkit-user-select:none; -o-user-select:none;}
.btn-primary.disabled:after{display:none !important;}

.scroll-area{padding-right:10px;}
@-moz-document url-prefix() {
	.scroll-area{scrollbar-color:var(--scrollarea-scrollbar-color-thumb) var(--scrollarea-scrollbar-color-track); scrollbar-width:thin; scrollbar-gutter:auto;}
}
@supports selector(::-webkit-scrollbar) {
	.scroll-area::-webkit-scrollbar-thumb{border-radius:999px; border:3px solid transparent; background-clip:content-box; background:var(--scrollarea-scrollbar-color-thumb); cursor:pointer;}
	.scroll-area::-webkit-scrollbar-track{border-radius:999px; background:var(--scrollarea-scrollbar-color-track);}
	.scroll-area::-webkit-scrollbar{width:var(--scrollarea-scrollbar-width);}
}


/* Announcement */
#theme-skhaf .announce-box{
	--title-font-color: #fff;
	--main-font-color:#fff;
	--link-color: #fff;
	--link-color-hover: #fff;
}
#theme-skhaf .announce-box :is(.gkActivity-tip-content-text, .gkActivity-down-text) a{position:relative; background-image: -webkit-gradient(linear, left top, left bottom, from(var(--link-color-hover)), to(var(--link-color-hover))),-webkit-gradient(linear, left top, left bottom, from(var(--link-color)), to(var(--link-color))); background-position:0% 95%; background-repeat:no-repeat; background-size:0% 1px, 100% 1px;}
#theme-skhaf .announce-box :is(.gkActivity-tip-content-text, .gkActivity-down-text) a:hover{color:var(--link-color-hover); background-size:100% 1px, 100% 1px;}

/* Color box */
.colorbox-grid{display:flex; flex-direction:row; flex-wrap:wrap; gap:2.6vw; /* margin:auto 10%; */}
.colorbox-grid > .colorbox{flex:0 0 calc(50% - 1.3vw); max-width:calc(50% - 1.3vw);}
.colorbox-grid > .colorbox .colorbox-content-head{margin-bottom:30px;}
.colorbox-grid > .colorbox .colorbox-content-cover{margin-bottom:15px;}

.colorbox{position:relative; padding:50px 45px 45px; border-radius:10px;}
.colorbox:before{display:block; content:''; position:absolute; left:50%; top:10px; transform: translate(-50%, -100%); background-repeat:no-repeat; background-size:100% auto; z-index:1;}
.colorbox .colorbox-content{display:flex; flex-direction:column; text-align:center;}
.colorbox .colorbox-content-cover > img{border-radius:10px;}
.colorbox .colorbox-content-cover > .swiper{position:relative; overflow:hidden;}
.colorbox .colorbox-content-cover > .swiper .swiper-slide{border-radius:10px; overflow:hidden;}
.colorbox .colorbox-content-cover > .swiper .swiper-pagination{position:relative; bottom:auto;}
.colorbox .colorbox-content-cover > .swiper .swiper-pagination-bullet{background-color:#fff;}
.colorbox *{color:var(--colorbox-font-color) !important;}

.colorbox.full-width{padding:60px 6.9vw; /* margin:auto 10%; */}
.colorbox.full-width .colorbox-content{flex-direction:row; gap:4.2vw; text-align:left;}
.colorbox.full-width .colorbox-content-cover{flex:0 0 41%; overflow:hidden;}
.colorbox.full-width .colorbox-content-details{flex:1;}

.colorbox#sai-kung{background-image:url(../png/colorbox-bottom-sai-kung.png); background-position:bottom center; background-size:100% auto; background-repeat:no-repeat;}
.colorbox#yim-tin-tsai:before{width:191px; height:87px; background-image:url(../svg/colorbox-top-yim-tin-tsai.svg);}
.colorbox#sharp-island:before{width:261px; height:113px; background-image:url(../svg/colorbox-top-sharp-island.svg);}
.colorbox#kau-sai-chau:before{width:227px; height:48px; background-image:url(../svg/colorbox-top-kau-sai-chau.svg);}
.colorbox#high-island:before{width:261px; height:88px; background-image:url(../svg/colorbox-top-high-island.svg);}

.colorbox#yim-tin-tsai, .colorbox#sharp-island{margin-top:85px;}
.colorbox#kau-sai-chau, .colorbox#high-island{margin-top:78px;}

/* Component {Read more tiles} */
#theme-skhaf .more-reads-tiles{
	background-color:#fff; border-radius:10px;
	--h4-font-size: 18px;
}
#theme-skhaf .more-reads-tiles *{color:#00657E !important;}

/* Component {DHK e-Solution Suggested Content} */
#theme-skhaf .suggested-content{
	--h4-font-size: 18px;
}
#theme-skhaf .suggested-content .suggested-content-container .suggested-content-title{display:none;}
#theme-skhaf .suggested-content .suggested-content-container .suggested-content-item{border-radius:10px; border:0;}
#theme-skhaf .suggested-content .suggested-content-container .suggested-content-item .route-left{flex:0 0 186px;}
#theme-skhaf .suggested-content .suggested-content-container .suggested-content-item .route-left img{height:auto;}
#theme-skhaf .suggested-content .suggested-content-container .suggested-content-item .route-right{height:140px; padding-left:30px; padding-right:30px; font-weight:600;}
#theme-skhaf .suggested-content .suggested-content-container .suggested-content-item :is(.route-desc, .route-desc *){font-size:var(--h4-font-size) !important; font-weight:600 !important; font-family:var(--title-font) !important;}
#theme-skhaf .suggested-content .suggested-content-list .swiper-pagination-bullet{margin:0 5px;}



/* `xxl` applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1679.98px) {
	
}


/* `xxl` applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {
	:root {
		--main-font-size: 17px;
		--h1-font-size: 55px;
		--h2-font-size: 44px;
		--h3-font-size: 38px;
		--h4-font-size: 32px;
		--h5-font-size: 21px;
		--h6-font-size: 19px;
	}
}


/* `xl` applies to large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {

}


/* `lg` applies to medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
	:root {
		--main-font-size: 16px;
		--h1-font-size: 48px;
		--h2-font-size: 36px;
		--h3-font-size: 32px;
		--h4-font-size: 28px;
		--h5-font-size: 20px;
		--h6-font-size: 17px;
	}

	/* common */
	#theme-skhaf .breadcrumb{padding:10px 0;}
	#theme-skhaf .breadcrumb *{font-size:13px;}
	#theme-skhaf .breadcrumb .cmp-breadcrumb > .container{padding-left:0; padding-right:0;}

	#theme-skhaf :is(h1, h2, h3, h4, h5, h6, h1 *, h2 *, h3 *, h4 *, h5 *, h6 *) br{display:none;}
	.fancybox__container{max-width:100vw; max-height:100vh;}
	.fancybox-slide{padding:0;}
	#theme-skhaf .section-head{margin-bottom:35px;}

	/* Color box */
	.colorbox{padding:45px 30px 40px;}
	.colorbox.full-width{padding-left:30px; padding-right:30px;}

	/* Component {DHK e-Solution Suggested Content} */
	#theme-skhaf .suggested-content .suggested-content-container .suggested-content-item > a{padding:0 !important;}
	#theme-skhaf .suggested-content :is(.swiper-button-prev, .swiper-button-next) svg > g > g{fill:#004A5C; stroke:#004A5C;}
}


/* `md` applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
	:root {
		--main-font-size: 15px;
		--h1-font-size: 35px;
		--h2-font-size: 24px;
		--h3-font-size: 21px;
		--h4-font-size: 19px;
		--h5-font-size: 17px;
		--h6-font-size: 15px;
	}

	/* Common */
	#theme-skhaf :is(.aem-GridColumn.aem-GridColumn--default--8, .dhk-container.max-width-1100, .container-cust, .non-featured-offers-container, .es-btn-group-container){padding:0 15px !important;}
	.aem-GridColumn.aem-GridColumn--default--12:not(.aem-GridColumn--offset--extrasmall--1) > .dhk-content{padding-left:0 !important; padding-right:0 !important; padding-top:0 !important;}
	#theme-skhaf .cmp-container > .aem-Grid > .freeformeditor-v2 .row{padding-left:0; padding-right:0; margin-left:-15px; margin-right:-15px;}
	#theme-skhaf .section-head{margin-bottom:30px;}

	/* Color box */
	.colorbox-grid{flex-direction:column; gap:20px;}
	.colorbox-grid > .colorbox{flex:0 0 100%; max-width:none; width:100%;}
	.colorbox-grid > .colorbox .colorbox-content-head{margin-bottom:20px;}
	.colorbox-grid > .colorbox .colorbox-content-cover{margin-bottom:10px;}

	.colorbox{padding:40px 25px 35px;}
	.colorbox .colorbox-content{text-align:left;}
	
	.colorbox.full-width{padding:40px 25px 35px;}
	.colorbox.full-width .colorbox-content{flex-direction:column; gap:20px;}
	.colorbox.full-width .colorbox-content-cover{flex:auto;}

	.colorbox#sai-kung{background-position:bottom right -50px; background-size:900px auto;}

	/* Component {DHK e-Solution Suggested Content} */
	#theme-skhaf .suggested-content .suggested-content-container .suggested-content-item .route-left{flex:0 0 140px;}
	#theme-skhaf .suggested-content .suggested-content-container .suggested-content-item .route-right{height:auto !important;}
}


/* `sm` applies to x-small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
	
}





/* touch device fix */
@media (hover: none) and (pointer: coarse) {

}

/* IE 10 & 11 fix */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	
}