@charset "UTF-8";
/* CSS Document */
/* Common */

:root {
	--tal-brand-dark: #414042;
	--tal-brand-brown: #b79670; /* 183 150 112 */

	--tal-accent-primary: var(--tal-brand-dark);
	--tal-accent-primary-variant: color-mix(in srgb, var(--tal-accent-primary) 100%, #000000 30%);
	--tal-accent-secondary: var(--tal-brand-brown);
	--tal-accent-secondary-variant: color-mix(in srgb, var(--tal-accent-secondary) 100%, #000000 30%);

	--tal-ui-gray: #525252;
	--tal-ui-lightgray: #f7f7f7;
	--tal-ui-lightgray2: #979197;
	--tal-ui-lightgray3: #edeced;

	/* --tal-ui-lightbrown: color-mix(in srgb, var(--tal-accent-secondary) 10%, #ffffff 100%); */
	/* --tal-ui-lightbrown: #f7f4f1; */
	--tal-ui-lightbrown: #f2f0ed;
	--tal-ui-lightbrown2: #d8cbbd;
	--tal-ui-lightbrown3: #e6dfd5;
	--tal-ui-darkbrown: #80694e;

	--swiper-theme-color: white;

	--fullheaderheight: 63px;

	--tal-border-radius-s: .5rem;
}

html { width:100%; height:100%; overflow:auto; min-height:0 !important; scroll-behavior:auto !important; }
body { background:var(--tal-accent-primary); /* background:var(--tal-ui-lightgray); */ background-size:cover; color:var(--tal-ui-gray); -webkit-text-size-adjust:none; }
html, body { font-family:"exo-2-variable","source-han-sans-cjk-hk", HelveticaNeue, Arial, sans-serif; }
a {
	text-decoration:none; cursor:pointer; color:var(--tal-accent-primary);
	transition:color 300ms; -webkit-transition:color 300ms; -ms-transition:color 300ms;
}
a:hover { color:var(--tal-accent-secondary); text-decoration:none; }
a.active { color:var(--tal-accent-secondary); }
a:focus { outline:none; color:var(--tal-accent-secondary); text-decoration:none; }
a:link:after, a:visited:after { content:""; }

p { margin-bottom:2rem; }
/* p:nth-last-of-type(1) { margin:0; } */
p:last-child, ul:last-child { margin:0; }
p + div { margin-top:-1em; }


.h1, h1, .h2, h2 { margin-bottom:2rem; /* font-weight:600; */ font-variation-settings:'wght' 700; }
.h3, h3 { font-weight:600; font-variation-settings:'wght' 600; letter-spacing:0; }
.h4, h4 { font-weight:600; font-variation-settings:'wght' 600; letter-spacing:0; }

strong { font-variation-settings:'wght' 700; font-weight:normal; }

::placeholder { color:var(--tal-ui-lightgray2) !important; font-weight:300; font-variation-settings:"wght" 300; }

.form-control, .form-select { transition:background-color 300ms; }
.form-control:focus, .form-select:focus { background-color:var(--tal-ui-lightbrown3); box-shadow: 0 0 0 0.25rem rgba(183, 150, 112, 0.5); }

.modal_video { backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); -ms-backdrop-filter:blur(20px); }
.modal_video .modal-body { padding:0; background-color:black; }
.modal_video .btn-close { position:absolute; right:0; background-color:white; border-radius:100%; width:1.8em; height:1.8em; z-index:1; margin-right:-0.9em; margin-top:-0.9em; opacity:1; }

input[type=checkbox]:checked { background-color:var(--tal-accent-secondary); border-color:var(--tal-accent-secondary); }




.tal-header { width:100%; height:var(--fullheaderheight); }
.tal-header .navbar { background-color:var(--tal-accent-secondary); color:var(--tal-accent-primary); position:fixed; top:0; width:100%; z-index:100; min-width:320px; }
.tal-header .navbar-toggler { border:0; box-shadow:none; }

.tal-header .navbar-contents { transition:none; }
.tal-header .navbar-contents { justify-content:end; } /* for no lang button, remove this when lang button back */

.tal-header .navbar-nav { padding-left:6.5em; position:relative; }
.tal-header .navbar-nav { margin: 0 !important; } /* for no lang button, remove this when lang button back */
.tal-header .navbar-nav.main .nav-item + .nav-item { margin-left:1.5em; }

.tal-header .nav-link { box-shadow:unset; opacity:.7; }
.tal-header .nav-link:hover { opacity:1; }
.tal-header .nav-link.active { font-variation-settings:'wght' 700; }

.tal-header .navbar-nav.sub { justify-content:end; }

.tal-header-navbar-bg { display:none; position:absolute; top:0; left:0; width:100%; height:100%; background:url(../img/common/bg-nav-mobile.png) center center no-repeat; background-size:contain; opacity:.1; }




.tal-main { background:var(--tal-ui-lightgray); }
.tal-main a { color:var(--tal-accent-secondary); }
/* .tal-main a:hover { text-decoration:underline; } */

.tal-common-padding { padding:6rem 0; }

.tal-common-hero { position:relative; height:200px; background-color:white; }
.tal-common-hero-bg { position:absolute; width:100%; height:100%; top:0; left:0; }
.tal-common-hero-bg-container { display:flex; justify-content:space-between; position:relative; height:100%; }
.tal-common-hero-bg-map { height:100%; translate:-30% 0; position:absolute; }
.tal-common-hero-bg-symbol { height:100%; position:absolute; right:0; }

.tal-common-hero-container { display:flex; align-items:center; height:100%; position:relative; }

.tal-common-hero-headline { margin-bottom:-.25em; }

.tal-common-breadcrumbs { height:56px; background-color:var(--tal-ui-lightbrown); border-bottom:1px solid white; }
.tal-common-breadcrumbs-container { display:flex; align-items:center; height:100%; }
.tal-common-breadcrumbs-list { display:flex; align-items:flex-start; }
.tal-common-breadcrumbs-item { line-height:14px; display:flex; color:var(--tal-accent-primary); }
.tal-common-breadcrumbs-item.active { color:var(--tal-accent-secondary); }
.tal-common-breadcrumbs-item.home { /* height:14px; */ background:url(../img/contents/icon/icon-hero-home.svg) center center no-repeat; background-size:contain; background-position:left center; padding-left:12px; display:flex; align-items:center; }
.tal-common-breadcrumbs-item::after { font-family:'Material Symbols Outlined'; font-variation-settings:'wght' 300; content:"chevron_right" !important; font-size:18px; display:block; line-height:12px; margin-left:.3em; margin-right:.125em; position:relative; color:var(--tal-accent-primary); font-feature-settings:'liga'; -webkit-font-feature-settings:'liga'; }
.tal-common-breadcrumbs-item:last-child::after { content:unset !important; }

.tal-common-intro { background-color:var(--tal-accent-primary); color:white; /* min-height:570px; */ }
.tal-common-intro h2 { color:var(--tal-accent-secondary); }
/* .tal-common-intro p { font-size:16px; } */
.tal-common-intro .tal-decoline::after { background-color:var(--tal-accent-secondary); }

/* .tal-common-intro-container:not(.active) { display:none; } */
/* .tal-common-intro-container.active {
	animation:switch_slide 5s step-end forwards;
} */

.tal-common-intro-animate { display:flex; align-items:end; height:570px; position:relative; }

.tal-common-video-panel { position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; object-position:center; }

.tal-common-contents { background-color: var(--tal-ui-lightbrown); }
.tal-common-contents.tal-common-padding { padding:4rem 0; }

.tal-common-deco-cubes { position:relative; }
.tal-common-deco-cube { width:50px; height:50px; background-color:var(--tal-accent-secondary); position:absolute; opacity:.5; }
.tal-common-deco-cube.large { width:100px; height:100px; }
.tal-common-deco-cube.one { right:0; bottom:calc(100% + 2em); }
.tal-common-deco-cube.two { right:74px; bottom:100%; translate:0 50%; }
.tal-common-deco-cube.three { right:0; bottom:0; translate:100% -100%; }
.tal-common-deco-cube.four { right:0; bottom:0; translate:0 50%; }

.tal-common-panel { width:100%; background-color:white; display:flex; flex-direction:column; align-items:center; padding:2.5em; }
.tal-common-panel-headline { margin-bottom:1.5rem; color:var(--tal-accent-secondary); }

.tal-common-button { border:1px solid var(--tal-ui-lightgray2); padding:1rem; font-variation-settings:'wght' 700; line-height:1; transition:background-color 300ms; background-color:white; color:var(--tal-accent-secondary); border-radius:2rem; border-color:var(--tal-accent-secondary); }
.tal-common-button:hover { background-color:var(--tal-ui-lightbrown2); border-color:var(--tal-accent-secondary); }
.tal-main a.tal-common-button:hover { text-decoration:none; }
.tal-common-button:active, .tal-common-button:first-child:active { background-color:var(--tal-accent-secondary) !important; border-color:var(--tal-accent-secondary) !important; }

.tal-common-accordion { font-size:18px; }
.tal-common-accordion.standalone .accordion-item {
	border: var(--bs-accordion-border-width) solid var(--bs-accordion-border-color);
	border-top-left-radius: var(--bs-accordion-border-radius) !important;
  	border-top-right-radius: var(--bs-accordion-border-radius) !important;
	border-bottom-right-radius: var(--bs-accordion-border-radius) !important;
	border-bottom-left-radius: var(--bs-accordion-border-radius) !important;
}
.tal-common-accordion.standalone .accordion-item > .accordion-header .accordion-button {
	border-top-left-radius: var(--bs-accordion-inner-border-radius) !important;
	border-top-right-radius: var(--bs-accordion-inner-border-radius) !important;
	border-bottom-right-radius: var(--bs-accordion-inner-border-radius) !important;
	border-bottom-left-radius: var(--bs-accordion-inner-border-radius) !important;
}
.tal-common-accordion.standalone .accordion-item > .accordion-header .accordion-button:not(.collapsed) {
	border-bottom-right-radius: unset !important;
	border-bottom-left-radius: unset !important;
}
.tal-common-accordion .accordion-item { background-color:var(--tal-ui-lightbrown3); }
.tal-common-accordion .accordion-item + .accordion-item { margin-top:.5em; }
.tal-common-accordion .accordion-button { font-size:18px; font-variation-settings:'wght' 700; color:var(--tal-accent-primary); }
.tal-common-accordion .accordion-button:focus { box-shadow:none; }
.tal-common-accordion .accordion-button:not(.collapsed) { background-color:var(--tal-ui-lightbrown3); border-bottom:1px solid var(--tal-accent-secondary); /* color:white; */ }
.tal-common-accordion .accordion-button::after { font-family:'Material Symbols Outlined'; font-variation-settings:'wght' 200; content:"add"; font-size:28px; line-height:28px; position:relative; color:var(--tal-accent-primary); font-feature-settings:'liga'; -webkit-font-feature-settings:'liga'; background:none; color:white; color:inherit; transform:unset; margin-top:-.25em; }
.tal-common-accordion .accordion-button:not(.collapsed)::after { content:"remove"; color:var(--tal-accent-primary); color:var(--tal-accent-primary); }

.tal-common-hr { margin:2.5rem 0; height:0; border:1px solid var(--tal-ui-lightgray2); display:block; }

.tal-common-figurecards { display:flex; gap:1em; flex-wrap:wrap; margin-bottom:2em; justify-content:start; }
.tal-common-figurecard { flex:0 1 calc(50% - .5em); /* width:unset; max-width:50%; */ background-color:var(--tal-ui-lightbrown); padding:1em; overflow:hidden; }
.tal-common-figurecard.large { flex:100%; max-width:100%; }
.tal-common-figurecard-link { position:relative; display:block; margin-bottom:1em; }
.tal-common-figurecard-link .tal-common-figurecard-img { margin-bottom:0; }
.tal-common-figurecard-imgs { display:flex; gap:1em; }
.tal-common-figurecard-img { aspect-ratio:405/228; width:100%; overflow:hidden; margin-bottom:1em; object-fit:cover; position:relative; }
.tal-common-figurecard-img.s { aspect-ratio:137/267; flex-basis:16.666%; width:unset; }
.tal-common-figurecard-img.sq { aspect-ratio:1/1; flex-basis:33.333%; width:unset; }

.tal-common-figurecard-copy { font-size:16px; line-height:1.3; }
.tal-common-figurecard-note { color:var(--tal-accent-secondary); font-size:16px; line-height:1.3; border-left:3px solid var(--tal-accent-secondary); padding-left:1em; }

.tal-common-figurecard-overlay { position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,.1); display:flex; justify-content:center; align-items:center; transition:background-color 300ms; }
.tal-common-figurecard-overlay:hover { background-color:rgba(0,0,0,.3);  }
.tal-common-figurecard-overlay .icon { color:white; font-size:72px; }




.tal-footer { background-color:var(--tal-ui-lightgray); display:flex; align-items:center; padding-top:3em; padding-bottom:3em; }
.tal-footer-contents { display:flex; position:relative; }
.tal-footer-left { display:flex; position:relative; align-items:center; }
.tal-footer-left .logo { width:188px; }
.tal-footer-left::after { content:""; width:1px; height:100%; background-color:var(--tal-ui-lightgray2); opacity:.5; margin-left:3em; margin-right:3em; }

.tal-footer-right { display:flex; padding:4em 0 0; flex:1; }

.tal-footer-legal { position:relative; display:flex; flex-direction:column; width:100%; font-size:14px; }

.tal-footer-legal-links { margin-bottom:1em; }
.tal-footer-legal-link { opacity:.7; }
.tal-footer-legal-link:hover { opacity:1; }
.tal-footer-legal-link + .tal-footer-legal-link { margin-left:2.85em; }

.tal-footer-legal-social { position:absolute; top:-20px; right:0; display:flex; flex-direction:column; align-items:end; }
.tal-footer-legal-social-items { font-size:1.4em; line-height:1em; margin-bottom:1em; }
.tal-footer-legal-social-item + .tal-footer-legal-social-item { margin-left:1.3em; }
.tal-footer-legal-social-links { display:flex; flex-direction:row; }
.tal-footer-legal-social-links .tal-footer-legal-link { font-size:12px; }
.tal-footer-legal-social-links .tal-footer-legal-link + .tal-footer-legal-link { margin-left:20px; }
.tal-footer-legal-awards { align-self:end; }

.tal-scroll-downs {	position:absolute; top:0; right:0; bottom:0; left:0; margin:auto; width:34px; height:55px; }
.mousey { width:3px; padding:10px 15px; height:35px; border:2px solid #fff; border-radius:25px; opacity:0.75; box-sizing:content-box; }
.scroller { width:3px; height:10px; border-radius:25%; background-color: #fff; animation-name:scroll; animation-duration:2.2s; animation-timing-function:cubic-bezier(.15,.41,.69,.94); animation-iteration-count:infinite; }

.tal-text-white { color:white; }

.tal-decoline { position:relative; }
.tal-decoline::after { content:''; position:absolute; left:0; top:calc(100% + .5rem); width:74px; height:5px; background-color:var(--tal-ui-gray); }
.tal-text-white.tal-decoline::after { background-color:white; }

.tal-card-wrapper { display:flex; justify-content:space-between; }
.tal-card-wrapper .tal-card { flex-basis:calc(50% - .5rem); }
.tal-card { display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; background-color:rgba(255,255,255,.5); padding:9rem 0; }
.tal-card-headline { color:var(--tal-accent-secondary); }
.tal-card-subhead { color:var(--tal-accent-primary); margin-bottom:0; }

.tal-typewriter { /* display:inline-flex; */ display:inline; margin-bottom:0; position:relative; }
/* .tal-common-intro-swiper .swiper-slide-active .tal-typewriter > span, .tal-common-intro-container.active .tal-typewriter > span {
  line-height:1em; height:1em; word-break:break-all; overflow: hidden; border-right:2px solid var(--tal-brand-brown); 
  animation: 
    typing 3s steps(27, end), */
    /* typing 1s steps(27, end) 4s reverse forwards, */
    /* blink-caret .5s step-end infinite;
} */

.type {
	position:relative;
	display:inline;
	overflow:visible;
	color:#0000;
	background:
		linear-gradient(-90deg,var(--tal-brand-brown) 5px,#0000 0) 0 0,
		linear-gradient(var(--tal-brand-brown) 0 0) 0 0;
	background-size:100% 200%;
	-webkit-background-clip:padding-box,text;
	background-clip:padding-box,text;
	background-repeat:no-repeat;
}

.tal-common-intro-swiper .swiper-slide-active .type {
	animation: 
		b .7s infinite steps(1),
		t 2s steps(var(--n), end) forwards,
		t 1s steps(var(--n), end) 3s reverse forwards;
}

/* CSS for Swiper freemode smooth scrolling */
.swiper-free-mode > .swiper-wrapper {
    transition-timing-function: linear !important;
}




/* The typing effect */
/* @keyframes typing {
  from { width: 0 }
  to { width: 100% }
}

@keyframes blink-caret {
  from, to { border-color: transparent }
  50% { border-color: var(--tal-brand-brown) }
}

@keyframes switch_slide {
  from { display:block; }
  to { display:none; }
} */

@keyframes t{
	from { background-size:0 200% }
}

@keyframes b{
	50% { background-position:0 -100%,0 0 }
}

@keyframes scroll {
	0% { opacity: 0; }
	10% { transform: translateY(0); opacity: 1; }
	100% { transform: translateY(15px); opacity: 0;}
}




@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { 
	
}

@media (max-width: 1649.98px) {
	
}
@media (max-width: 1399.98px) {
	.tal-common-intro-animate { height:40vw; }
}
@media (max-width: 1219.98px) {
	
}
@media (min-width: 1200px) {
	.h1, h1, .h2, h2 { font-size:3.5rem; margin-bottom:2.8rem; }
	.h3, h3 { font-size:2.25rem; margin-bottom:2.5rem; }

	p { font-size:18px; }

	.tal-card-headline { font-size:3rem; }
}
@media (max-width: 1199.98px) {
	.tal-header .navbar-nav { padding-left:3.5em; }
	.tal-header .navbar-nav.main .nav-item + .nav-item { margin-left:.75em; }

	.tal-common-hero { height:160px; }

	.tal-footer-legal-social { position:unset; align-items:start; }
}
@media (min-width: 992px) {
	
}
@media (max-width: 991.98px) {
	.modal-body { padding:10px; }

	.tal-header .navbar-nav { padding-left:1em; /* margin-top:1em; */ }
	.tal-header .navbar-nav.main .nav-item + .nav-item { margin-left:0; }

	.tal-common-padding { padding:4rem 0; }

	.tal-footer { padding-top:2em; }

	.tal-footer-left .logo { margin-bottom:30px; }
	.tal-footer-right { padding-top:0; }

	.tal-footer-contents { flex-direction:column; }
	.tal-footer-legal-links { display:flex; flex-direction:column; }
	.tal-footer-legal-link { position:relative; display:flex; flex-direction:column; }
	.tal-footer-legal-link:hover { font-variation-settings:'wght' 700; }
	.tal-footer-legal-links .tal-footer-legal-link::after { content:""; width:100%; height:1px; background-color:var(--tal-ui-lightgray2); margin-top:10px; margin-bottom:10px; opacity:.2; }
	.tal-footer-legal-link + .tal-footer-legal-link { margin-left:0; }
	.tal-footer-legal-social { position:unset; top:unset; right:unset; display:flex; flex-direction:column; align-items:start; margin-bottom:10px; }
	.tal-footer-legal-social-item + .tal-footer-legal-social-item { margin-left:15px; }
	.tal-footer-legal-social-links { flex-direction:column; margin-bottom:1em; }
	.tal-footer-legal-social-links .tal-footer-legal-link { font-size:14px; }
	.tal-footer-legal-social-links .tal-footer-legal-link + .tal-footer-legal-link { margin-left:unset; margin-top:1em; }
	.tal-footer-legal-copyright { margin-bottom:35px; }
	.tal-footer-legal-awards { align-self:flex-start; }
}
@media (min-width: 768px) {
	
}
@media (max-width: 767.98px) {
	.modal-body { padding:0px; }

	.tal-header .navbar-contents {
		position:fixed; top:var(--fullheaderheight); bottom:0; left:0; right:0; background-color:white; height:unset !important; display:flex; justify-content:center; flex-direction:column; align-items:start;
		scale: 1 0;
		transition: none; transform-origin: center top;
	}
	.tal-header .navbar-contents.collapsing {
		scale:inherit;
		transition: scale .3s;
	}
	.tal-header .navbar-contents.show {
		scale: 1 1;
		transition: scale .3s;
	}
	@starting-style{
		.tal-header .navbar-contents {
			scale: 1 0;
		}
	}
	.tal-header .navbar-contents .nav-link { font-size:34px; padding:10px 0; line-height:1; opacity:1; font-variation-settings:'wght' 700; }
	.tal-header .navbar-contents .nav-link.active, .tal-header .navbar-contents .nav-link:hover { color:var(--tal-accent-secondary); }
	.tal-header .navbar-nav.sub { width:100%; }
	.tal-header .navbar-nav.sub .nav-link { font-size:28px; }

	.tal-header-navbar-bg { display:block; }

	.tal-header .navbar-nav .dropdown-menu { width:100%; position:relative; top:unset; }
	.tal-header .navbar-nav .dropdown-item { font-size:24px; }

	.tal-common-padding { padding:3rem 0; }

	.tal-common-hero { height:120px; }
	.tal-common-hero-headline { font-size:32px; }

	.tal-common-contents.tal-common-padding { padding:2rem 0; }

	.tal-common-deco-cube { display:none; }

	.tal-common-panel-headline { text-align:center; }

	.tal-common-accordion { font-size:inherit; }

	.tal-common-figurecard { flex-basis:calc(100% - .5em); }
	.tal-common-figurecard-imgs { flex-wrap:wrap; }
	.tal-common-figurecard-img.s { aspect-ratio:137/267; flex-basis:calc(50% - .5em); width:unset; }
    .tal-common-figurecard-img.sq { aspect-ratio:1/1; flex-basis:100%; width:unset; }

	.tal-card-wrapper { flex-direction:column; flex-basis:unset; gap:1em; }
	.tal-card { padding:4.3rem 0; }
}
@media (max-width: 575.98px) {
	
}
@media (max-width: 479.98px) {
	.tal-common-intro-animate { height:230px; }
	/* .tal-typewriter > span { animation:unset; border-right:0; height:unset; word-break:unset; } */
}