/* HelloHK theme – Section Header */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&amp;display=swap');

/* #section-header::selection, #section-header *::selection{background-color:#e2002c; color:#fff;} */
#section-header, #hot-topic-list-1{position:relative;}
#section-header:before{display:block; content:''; width:100%; height:95%; position:absolute; left:0; top:0;}
#section-header :is(h1, h2, h3, h4, h5, h6), #section-header .desc-container, #section-header .desc-container p{color:#fff;}
html[dir] #section-header .header-banner-container .header-banner .swiper-button-prev, html[dir] #section-header .header-banner-container .header-banner .swiper-button-next{border-radius:50%; box-shadow:-1px -1px 19px 0px rgba(0,0,0,0.15); -webkit-box-shadow:-1px -1px 19px 0px rgba(0,0,0,0.15); -moz-box-shadow:-1px -1px 19px 0px rgba(0,0,0,0.15);}
#section-header .header-banner{visibility:hidden; opacity:0; transition:visibility .25s linear, opacity .25s linear; -moz-transition:visibility .25s linear, opacity .25s linear; -ms-transition:visibility .25s linear, opacity .25s linear; -webkit-transition:visibility .25s linear, opacity .25s linear;}
#section-header .header-banner.ele-loaded{visibility:visible !important; opacity:1 !important;}
#section-header .header-banner a.banner{padding-bottom:31.25%;}
#section-header .header-banner .textbox{padding-top:10%; left:calc(50% - 550px); width:100%; max-width:1100px; height:100%; display:flex; flex-direction:column; justify-content:center;}
@media (max-width: 1099.98px) {
	#section-header .header-banner .textbox{left:0;}
}
#section-header .header-banner .textbox
#section-header .header-banner .hb-title{margin-bottom:15px;}
#section-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6){font-size:50px; font-weight:800; line-height:1.1; text-shadow:0 0 20px #5A5A5A; font-family:'Open Sans', arial, 'Microsoft JHei TC Bold', \5FAE\8EDF\6B63\9ED1\9AD4, 'MHei', PMingLiU, sans-serif !important;}
#section-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6) > img {margin-bottom:15px; height:200px;}
#section-header .header-banner .hb-text{font-weight:600; line-height:1.4; font-family:'Open Sans', arial, 'Microsoft JHei TC Bold', \5FAE\8EDF\6B63\9ED1\9AD4, 'MHei', PMingLiU, sans-serif !important;}
#section-header .header-banner .cover-wrapper:after{display:block; content:''; position:absolute; left:0; bottom:0; width:100%; height:100%; background-size:auto 100%; background-position:left center; background-repeat:no-repeat; pointer-events:none; user-select:none; -moz-user-select:none; -khtml-user-select:none; -webkit-user-select:none; -o-user-select:none;}
#section-header .header-banner .cover-wrapper.pc-cover:after, #section-header .header-banner .cover-wrapper.mb-cover:after{background-image:url(../png/experience-hong-kong-shadow.png);}



/* `xxl` applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1679.98px) {
	#section-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6){font-size:50px;}
}

/* `xxl` applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {
	#section-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6){font-size:40px;}
	#section-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6) > img{height:155px;}
}

/* `xl` applies to large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
	#section-header .header-banner .textbox{padding-left:5%;}
	#section-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6){font-size:30px;}
	#section-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6) > img{height:140px;}
}

/* `lg` applies to medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
	#section-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6){font-size:26px;}
	#section-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6) > img{height:95px; margin-bottom:8px;}
	#section-header .header-banner .hb-text{font-size:15px;}
}

/* `md` applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
	#section-header{margin-top:-15px;}
	#section-header:before{width:calc(100% + 60px); left:-30px; top:-15px;}
	#section-header .header-banner-container{margin-left:-30px; margin-right:-30px;}
	#section-header .header-banner a.banner{padding-bottom:119.4%}
}

/* `sm` applies to x-small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
	/* Component {header banner} */
	#section-header .header-banner .cover-wrapper.mb-cover:after{background-image:url(../png/experience-hong-kong-shadow_m.png);}
	#section-header .header-banner .textbox{padding-left:30px; padding-right:30px;}
	#section-header .header-banner .textbox .hb-content{padding-left:0; padding-right:0;}
}