﻿@charset "utf-8";
/* ══════════════════════════
   BANNER / SPLIDE
══════════════════════════ */
#banner-splide {
	position:relative;
	width:100%;
	height:100%;
}
#banner-splide .splide__track {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
#banner-splide .splide__list {
	height:100%;
}
#banner-splide .splide__slide {
	position:relative;
	height:100%;
	overflow:hidden;
}
.slide-media {
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	object-fit:cover;
	transform:scale(1.04);
	transition:transform 5s ease-out;
}
.splide__slide.is-active .slide-media {
	transform:scale(1);
}
.slide-video-wrap {
	position:absolute;
	inset:0;
	overflow:hidden;
}
.slide-video-wrap iframe, .slide-video-wrap video {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	width:100vw;
	height:56.25vw;
	pointer-events:none;
}
.slide-overlay {
	position:absolute;
	inset:0;
	background:linear-gradient(0deg, rgba(10,22,14,0.2) 0%, rgba(10,22,14,0.05) 40%, rgba(10,22,14,0.5) 65%, rgba(10,22,14,0.75) 90%  );
}
.slide-content {
	position:absolute;
	inset:0;
	width:100%;
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	justify-content:flex-start;
	gap:10px;
	padding:clamp(30px, 6.25vw, 100px) clamp(20px, 8vw, 120px) clamp(20px, 4vw, 80px);
	box-sizing:border-box;
}
.slide-label {
	display:flex;
	flex-wrap:wrap;
	gap:clamp(0.3rem, 1.2vw, 1rem);
}
.slide-label .label-item {
	font-size:clamp(0.6rem, 1.5vw, 1rem);
	line-height:160%;
	letter-spacing:0.3em;
	color:var(--cyan-blue-light);
	padding:clamp(0.3rem, 1.2vw, 0.6rem) clamp(0.6rem, 1.5vw, 1.2rem);
	border-radius:99px;
	background-color:var(--green-dark);
}
.slide-tag {
	font-size:clamp(0.9rem, 1.8vw, 1.5rem);
	letter-spacing:0.3em;
	color:var(--gold-light);
	text-transform:uppercase;
	opacity:0;
	transform:translateY(20px);
	transition:all 0.7s 0.2s;
	filter:drop-shadow(0 1px 3px rgba(0, 0, 0, 0.5));
}
.slide-title {
	font-family:"Noto Serif SC", "Source Han Serif SC", "Songti SC", "SimSun", STSong, serif;
	font-size:clamp(1.75rem, 5vw, 5rem);
	font-weight:600;
	line-height:1.1;
	color:#fff;
	opacity:0;
	transform:translateY(24px);
	transition:all 0.8s 0.35s;
	filter:drop-shadow(0 1px 3px rgba(0, 0, 0, 0.5));
}
.slide-title em {
	font-family:'Cormorant Garamond', serif;
	font-style:italic;
	font-weight:300;
	color:var(--gold-light);
	display:block;
	font-size:1.15em;
	filter:drop-shadow(0 1px 3px rgba(0, 0, 0, 0.5));
}
.slide-desc {
	font-size:clamp(0.9rem, 1.8vw, 1.5rem);
	line-height:150%;
	font-weight:300;
	color:rgba(255,255,255,0.95);
	line-height:1.7;
	margin-bottom:20px;
	opacity:0;
	transform:translateY(20px);
	transition:all 0.8s 0.5s;
	filter:drop-shadow(0 1px 3px rgba(0, 0, 0, 0.5));
}
.slide-cta {
	display:inline-flex;
	align-items:center;
	gap:10px;
	color:#fff;
	font-size:clamp(0.8rem, 1.6vw, 1.2rem);
	font-weight:600;
	letter-spacing:0.15em;
	text-decoration:none;
	border-bottom:1px solid var(--gold-light);
	padding:15px 1.5em;
	opacity:0;
	transform:translateY(16px);
	transition:all 0.7s 0.65s;
	/*max-width:calc(7.6em + 56px);*/
}
.slide-cta:hover, .slide-cta:focus {
	color:var(--gold-light);
}
.slide-cta .arrow {
	width:30px;
	height:30px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	background-color:var(--gold-light);
	border-radius:99px;
	transition:all 0.4s ease;
}
.slide-cta .arrow::before {
	content:'';
	display:block;
	transition:transform 0.3s;
}
.slide-cta .arrow::before {
	width:16px;
	height:16px;
	background-color:rgb(255, 255, 255);
	mask-image:url(../images/icon_readmore.svg);
	mask-size:contain;
	mask-repeat:no-repeat;
	mask-position:center center;
}
.slide-cta:hover .arrow {
	transform:translateX(6px);
}
.splide__slide.is-active .slide-tag, .splide__slide.is-active .slide-title, .splide__slide.is-active .slide-desc, .splide__slide.is-active .slide-cta {
	opacity:1;
	transform:translateY(0);
}
@media screen and (max-width:990px) {
	#banner-splide {
		height:56.25vw;
	}
}
@media screen and (max-width:767px) {
	#banner-splide {
		height:440px;
	}
	.slide-video-wrap iframe, .slide-video-wrap video {
		width:auto;
		height:440px;
	}
}
@media screen and (max-width:480px) {
	#banner-splide {
		height:100vw;
	}
	.slide-video-wrap iframe, .slide-video-wrap video {
		height:100vw;
	}
}
@media screen and (max-width:768px) {
	.slide-desc {
		margin-bottom:0;
	}
	.slide-cta {
		padding:10px 1.5em;
	}
}
@media screen and (min-width:991px) {
	#banner-splide {
		height:calc(100vh - 140px);
		min-height:36.25vw;
		max-height:56.25vw;
	}
}
@media screen and (min-width:1260px) {
	#banner-splide {
		height:calc(100vh - 176px);
	}
	#wrapper:has(#header.flex) #banner-splide {
		height:calc(100vh - 90px);
	}
	.slide-content {
		gap:20px;
	}
}
/* Splide custom arrows */
#banner-splide .splide__arrow {
	background:rgba(0,0,0,0.8);
	width:50px;
	height:50px;
	border-radius:99px;
	backdrop-filter:blur(8px);
	transition:all 0.3s;
	opacity:0;
}
#banner-splide .splide__arrow svg {
	fill:var(--gold);
}
#banner-splide .splide__arrow:hover {
	background:var(--gold);
	border-color:var(--gold);
	opacity:1;
}
#banner-splide .splide__arrow:hover svg {
	fill:var(--green-dark);
}
#banner-splide .splide__arrows {
	display:flex;
}
#banner-splide .splide__arrow--prev {
	left:-40px;
}
#banner-splide .splide__arrow--next {
	right:-40px;
}
#banner-splide:hover .splide__arrow--prev {
	left:20px;
	opacity:1;
}
#banner-splide:hover .splide__arrow--next {
	right:20px;
	opacity:1;
}
/* Splide custom pagination */
#banner-splide .splide__pagination {
	bottom:30px;
	gap:8px;
}
#banner-splide .splide__pagination__page {
	width:32px;
	height:6px;
	border-radius:6px;
	background:rgba(255,255,255,0.9);
	transition:background 0.3s, width 0.3s;
	position:relative;
	overflow:hidden;
	opacity:1;
}
#banner-splide .splide__pagination__page.is-active {
	width:56px;
	transform:none;
}
#banner-splide .splide__pagination__page::before {
	content:"";
	display:block;
	width:0%;
	height:100%;
	background:var(--cyan-blue-light);
	border-radius:6px;
}
#banner-splide .splide__pagination__page.is-active::before {
	transition:all 0.2s;
	animation-duration:5.5s;
	animation-iteration-count:1;
	animation-name:fullWidth;
	animation-fill-mode:forwards;
}
#banner-splide:has(.slide-video-wrap) li:first-of-type .splide__pagination__page.is-active::before {
	animation-duration:20s;
}
@-webkit-keyframes fullWidth {
	0% {
		width:0%;
	}
	100% {
		width:100%;
	}
}
@keyframes fullWidth {
	0% {
		width:0%;
	}
	100% {
		width:100%;
	}
}
@media screen and (max-width:767px) {
	#banner-splide .splide__arrows {
		display:none;
	}
	#banner-splide .splide__arrow {
		width:45px;
		height:45px;
		opacity:1;
		border:none;		
		pointer-events:auto;
		background:var(--green-deep);
	}
	#banner-splide .splide__arrow:hover svg {
		fill:var(--green-deep);
	}
	#banner-splide .splide__arrow--prev {
		left:0 !important;
	}
	#banner-splide .splide__arrow--next {
		right:0 !important;
	}
	#banner-splide .splide__pagination {
		left:50%;
		bottom:-45px;
		display:flex;
		flex-direction:row;
        flex-wrap:wrap;
        justify-content:center;
		width:max-content;
		max-width:100%;
		padding:0 60px;
		gap:5px;
		transform:translateX(-50%);
	}
	#banner-splide .splide__pagination__page {
		width:12px;
		height:12px;
		border-radius:50px;
		background:rgba(0,0,0,.15);
	}
	#banner-splide .splide__pagination__page.is-active {
		width:30px;
	}
	#banner-splide .splide__pagination__page::before {
		background:var(--green-light);
	}
}
@media screen and (max-width:480px) {
}
@media screen and (min-width:1260px) {
}
@media screen and (min-width:1680px) {
	#banner-splide .splide__arrow {
		width:60px;
		height:60px;
	}
	#banner-splide .splide__arrow svg {
		width:20px;
		height:20px;
	}
	#banner-splide:hover .splide__arrow--prev {
		left:50px;
	}
	#banner-splide:hover .splide__arrow--next {
		right:50px;
	}
}

/* ── Video Controls (Slide 1) ── */
.video-controls {
	position:absolute;
	right:20px;
	bottom:20px;
	display:flex;
	gap:8px;
	z-index:20;
	opacity:0;
	transform:translateY(8px);
	transition:opacity 0.5s 0.3s, transform 0.5s 0.3s;
	pointer-events:none;
}
.splide__slide.is-active .video-controls {
	opacity:1;
	transform:translateY(0);
	pointer-events:auto;
}
.video-ctrl-btn {
	width:44px;
	height:44px;
	border:none;
	background:#fff;
	backdrop-filter:blur(10px);
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	color:#fff;
	transition:background 0.3s, border-color 0.3s, transform 0.2s;
	position:relative;
	overflow:hidden;
	border-radius:44px;
}
.video-ctrl-btn:hover {
	background:rgba(196,151,58,0.75);
	border-color:var(--gold);
	transform:scale(1.06);
}
.video-ctrl-btn span {
	width:20px;
	height:20px;
	fill:#fff;
	position:absolute;
	transition:opacity 0.2s, transform 0.2s;
	background-color:#333;
	mask-repeat:no-repeat;
	mask-position:center;
	mask-size:auto;
}
.video-ctrl-btn:hover span {
	background-color:#fff;
}
#iconVideoPause {
	mask-image:url(../images/video_pause.svg);
}
#iconVideoPlay {
	mask-image:url(../images/video_play.svg);
}
#iconMuted {
	mask-image:url(../images/video_muted.svg);
}
#iconUnmuted {
	mask-image:url(../images/video_unmuted.svg);
}
/* icon states */
.video-ctrl-btn .icon-show {
	opacity:1;
	transform:scale(1);
}
.video-ctrl-btn .icon-hide {
	opacity:0;
	transform:scale(1);
}
/* tooltip */
.video-ctrl-btn::after {
	content:attr(data-tip);
	position:absolute;
	bottom:calc(100% + 8px);
	left:50%;
	transform:translateX(-50%) translateY(4px);
	background:rgba(12,31,20,0.9);
	color:rgba(255,255,255,0.85);
	font-size:0.625rem;
	letter-spacing:0.12em;
	white-space:nowrap;
	padding:5px 10px;
	border:1px solid rgba(196,151,58,0.3);
	opacity:0;
	pointer-events:none;
	transition:opacity 0.2s, transform 0.2s;
}
.video-ctrl-btn:hover::after {
	opacity:1;
	transform:translateX(-50%) translateY(0);
}
/* scroll indicator */
.scroll-hint {
	position:absolute;
	bottom:30px;
	right:48px;
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:6px;
	color:rgba(255,255,255,0.5);
	font-size:1.2em;
	letter-spacing:0.2em;
	z-index:10;
	visibility:hidden;
}
.scroll-line {
	width:1px;
	height:48px;
	background:linear-gradient(to bottom, rgba(255,255,255,0.5), transparent);
	animation:scrollPulse 2s ease-in-out infinite;
}
@keyframes scrollPulse {
	0%, 100% {
		opacity:0.3;
		transform:scaleY(1);
	}
	50% {
		opacity:1;
		transform:scaleY(0.6) translateY(20px);
	}
}
@media screen and (min-width:768px) {
	.video-controls {
		right:30px;
		bottom:30px;
	}
	.scroll-hint {
		right:48px;
	}
	.scroll-line {
		height:48px;
	}
}
/* ══════════════════════════
   SECTION COMMONS
══════════════════════════ */
.section {
	position:relative;
	padding:8vw 0;
}
.section.pb0 {
	padding-bottom:0;
}
.section.z1 {
    z-index:1;
}
.section.z2 {
    z-index:2;
}
.section.statusbar-section {
	background-color:#faf6ed;
}
.section.box1::before {
	content:'';
	display:block;
	width:100%;
	height:100%;
	background-color:#faf6ed;
	position:absolute;
	right:0;
	bottom:0;
	z-index:-1;
}
.section.box2::before {
	content:'';
	display:block;
	width:100vw;
	height:100vw;
	background-image:url(../images/totem_yao.svg);
	background-position:center;
	background-repeat:no-repeat;
	background-size:contain;
	position:absolute;
	right:0;
	bottom:0;
	transform:translate3d(35%, 30%, 0);
	opacity:.1;
	z-index:-1;
}
.section.box2.taoyuan::before {
	width:106vw;
	height:106vw;
	background-image:url(../images/totem_miao.svg);
	right:inherit;
	left:0;
	transform:translate3d(-37%, 10%, 0);
}
.section.box2::after {
	content:'';
	display:block;
	width:100%;
	height:100%;
	background-color:#faf6ed;
	position:absolute;
	right:0;
	bottom:0;
	z-index:-2;
}
.section.feature-section {
	overflow:hidden;
}
.section.feature-section.shanshuiyuan {
	background-color:#beeef7;
}
.section.feature-section.indigo {
	background-color:#e6f4fd;
}
.section.feature-section.shanshuiyuan::before {
	content:'';
	display:block;
	width:100%;
	height:100%;
	background-image:url(../images/feature-shanshuiyuan-bg.png);
	background-position:left 50% top -26vw;
	background-repeat:repeat-y;
	background-size:150% auto;
	position:absolute;
	left:0;
	top:0;
}
.section.feature-section.indigo::before {
	content:'';
	display:block;
	width:100%;
	height:100%;
	background-image:url(../images/feature-indigo-bg.png);
	background-position:left top;
	background-repeat:repeat-y;
	background-size:100% auto;
	position:absolute;
	left:0;
	top:0;
}
.section.light-type {
	overflow:hidden;
}
.section.light-type::before {
	content:'';
	display:block;
	width:100vw;
	height:100vw;
	background-image:url(../images/totem_dong.webp);
	background-position:center;
	background-repeat:no-repeat;
	background-size:contain;
	position:absolute;
	left:0;
	bottom:0;
	transform:translate3d(-14.5%, 20%, 0);
	opacity:.95;
}
.section.light-type::after {
	content:'';
	display:block;
	width:100%;
	height:100%;
	background-color:#6d5141;
	position:absolute;
	right:0;
	bottom:0;
	z-index:-1;
}
.section.utopianHigh-section::before {
	content:'';
	display:block;
	width:100%;
	height:100%;
	background-color:#fff;
	background-image:linear-gradient(0deg, #f5eee1 20%, rgba(255,255,255,0) 80%);
	position:absolute;
	right:0;
	bottom:0;
	z-index:-1;
}
.section.sustainability-section::before {
	content:'';
	display:block;
	width:100%;
	height:0%;
	padding-bottom:74%;
	background-image:url(../images/sustainability_bg.webp);
	background-position:right bottom;
	background-repeat:no-repeat;
	background-size:cover;
	position:absolute;
	right:0;
	top:-6vw;
	z-index:-1;
}
.section.cultural-section::before {
	content:'';
	display:block;
	width:100%;
	height:0%;
	padding-bottom:78%;
	background-image:url(../images/culturalsalon_bg.webp);
	background-position:right top;
	background-repeat:no-repeat;
	background-size:cover;
	position:absolute;
	right:0;
	top:-2vw;
	z-index:-1;
	transform:translate3d(0, -50%, 0);
}
.section.shop-section::before,
.section.shop-section::after {
	content:'';
	display:block;
	width:100%;
	position:absolute;
	left:0;
	top:4vw;
	z-index:-2;
	aspect-ratio:100 / 55;
	border-radius:40px 100vh 100vh 100vh;
	max-width:calc(100vw - 20px);
	background-color:#e8e4e0;
}
.section.shop-section::after {
	background-image:url(../images/shop_bg.webp);
	background-repeat:no-repeat;
	background-position:200% 100%;
	background-size:auto 150%;
	z-index:-1;
	opacity:.5;
	mix-blend-mode:darken;
}
.section.legacy-section {
	background-color:#e3edf1;
	background-image:linear-gradient(0deg, #e3edf1 0%, #c8e1e6 100%);
	background-image:url(../images/mountains.webp);
	background-position:center calc(100% + 1px);
	background-repeat:no-repeat;
	background-size:116vw auto;
	padding-bottom:21vw;
}
.section.indigo-section {
	text-align:center;
	padding:5vw 0;
	background:url(../images/indigo-section-bg.jpg) no-repeat 50% 50%;
	background-size:cover;
}
.section.indigo-section dl {
	display:flex;
	justify-content:center;
    align-items:center;
	flex-wrap:wrap;
	gap:1vw 5vw;
}
.section.indigo-section dd {
	color:#fff;
	font-size:clamp(1.5em, 2.7vw, 2.7em);
	letter-spacing:0.3em;
	line-height:200%;
}
@media screen and (max-width:767px) {
	#banner-splide:has(.splide__pagination) + .section {
		padding-top:80px;
	}
}
@media screen and (max-width:640px) {
	.section.shop-section::before,
	.section.shop-section::after {
		aspect-ratio:100 / 75;
		border-radius:40px 120px 120px 120px;
	}
	.section.shop-section::after {
		background-position:-200% 100%;
		background-size:auto 150%;
	}
	.section.indigo-section {
		padding:40px 0;
	}
}
@media screen and (min-width:768px) {
	.section.shop-section::before,
	.section.shop-section::after {
		aspect-ratio:100 / 45;
	}
	.section.shop-section::after {
		background-position:right -100px top -200px;
		background-size:auto 550px;
	}
}
@media screen and (min-width:991px) {
	.section.shop-section::before,
	.section.shop-section::after {
		top:-12vw;
		max-width:77vw;
	}
	.section.shop-section::after {
		background-position:125% 55%;
		background-size:auto 140%;
	}
}
@media screen and (min-width:1260px) {
	.section.shop-section::after {
		background-position:110% 65%;
	}
	.section.indigo-section {
		padding:3.5vw 0;
	}
}
@media screen and (min-width:1680px) {
	.section.shop-section::after {
		background-position:80% 80%;
		background-size:auto 120%;
	}
	.section.indigo-section {
		padding:2vw 0;
	}
}


/**/
.section-header {
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	justify-content:center;
	margin-bottom:2vw;
}
.feature .section-header {
	margin-bottom:1vw;
}
.section-header .flex-gap {
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	justify-content:center;
	gap:1.5rem;
}
.section-header:has(.section-label) {
	gap:0.5em;
}
.section-header.header-center {
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}
.section-title {
	font-family:"微軟雅黑", "Microsoft YaHei", serif;
	font-size:clamp(2rem, 4vw, 4.125rem);
	font-weight:600;
	line-height:1.25;
	color:var(--text-dark);
}
.shanshuiyuan .section-title {
	color:#15788c;
}
.indigo .section-title {
	color:#014da1;
}
.section-title:has(em) {
	display:inline-flex;
	flex-wrap:wrap;
	align-items:flex-end;
	gap:clamp(0.35rem, 1vw, 1rem) clamp(0.75rem, 2vw, 2rem);
}
.section-title em {
	font-size:clamp(1rem, 1.5vw, 1.75rem);
	line-height:1;
	font-style:normal;
	font-weight:400;
	color:var(--gold-dark);
	display:block;
}
.section-title em[lang="en"] {
	font-family:Arial, Helvetica, sans-serif;
}
.shanshuiyuan .section-title em {
	color:#bf9f60;
}
.indigo .section-title em {
	color:#d69378;
}
.section-label {
	font-size:clamp(1.14rem, 1.6vw, 1.95rem);
	line-height:150%;
	letter-spacing:0.025em;
	font-weight:700;
	color:var(--text-mid);
	text-transform:uppercase;
	font-family:system-ui, sans-serif;
}
.shanshuiyuan .section-label {
	color:#999999;
}
.indigo .section-label {
	color:#777777;
}
/**/
.light-type .section-title {
	color:var(--text-white);
}
.light-type .section-title em {
	color:#d1ba9a;
}
.light-type .section-label {
	color:#bbbbbb;
}
@media screen and (max-width:768px) {
	.section {
		padding:50px 0;
	}
	.section-header {
		flex-direction:column;
		align-items:flex-start;
		gap:20px;
	}
}
@media screen and (min-width:991px) {
	.section {
		padding:5.2vw 0;
	}
	.section-label {
		font-size:3em;
	}
	.section.statusbar {
		padding-top:80px;
	}
}
@-webkit-keyframes flipInY {
	0% {
		-webkit-animation-timing-function:ease-in;
		animation-timing-function:ease-in;
		opacity:0;
		-webkit-transform:perspective(400px) rotateY(90deg);
		transform:perspective(400px) rotateY(90deg);
	}
	40% {
		-webkit-animation-timing-function:ease-in;
		animation-timing-function:ease-in;
		-webkit-transform:perspective(400px) rotateY(-20deg);
		transform:perspective(400px) rotateY(-20deg);
	}
	60% {
		opacity:1;
		-webkit-transform:perspective(400px) rotateY(10deg);
		transform:perspective(400px) rotateY(10deg);
	}
	80% {
		-webkit-transform:perspective(400px) rotateY(-5deg);
		transform:perspective(400px) rotateY(-5deg);
	}
	to {
		-webkit-transform:perspective(400px);
		transform:perspective(400px);
	}
}
@keyframes flipInY {
	0% {
		-webkit-animation-timing-function:ease-in;
		animation-timing-function:ease-in;
		opacity:0;
		-webkit-transform:perspective(400px) rotateY(90deg);
		transform:perspective(400px) rotateY(90deg);
	}
	40% {
		-webkit-animation-timing-function:ease-in;
		animation-timing-function:ease-in;
		-webkit-transform:perspective(400px) rotateY(-20deg);
		transform:perspective(400px) rotateY(-20deg);
	}
	60% {
		opacity:1;
		-webkit-transform:perspective(400px) rotateY(10deg);
		transform:perspective(400px) rotateY(10deg);
	}
	80% {
		-webkit-transform:perspective(400px) rotateY(-5deg);
		transform:perspective(400px) rotateY(-5deg);
	}
	to {
		-webkit-transform:perspective(400px);
		transform:perspective(400px)
	}
}
/**/
.readMore a {
	display:inline-block;
	padding:20px 20px 20px 30px;
	box-sizing:border-box;
	background-color:transparent;
	border:1px solid #000;
	color:#000;
	font-size:1.8em;
	font-weight:bold;
	line-height:120%;
	transition:all 0.1s ease;
	border-radius:40px;
	box-shadow:0 0 4px rgba(255,255,255,0.3);
}
.readMore a:hover, .readMore a:focus {
	background-color:#000;
	border-color:transparent;
	color:#ffffff;
}
.readMore a span {
	display:flex;
	align-items:center;
	position:relative;
	padding-right:56px;
	transition:all 0.4s ease;
}
.readMore a span:before, .readMore a span:after {
	content:"";
	display:block;
	position:absolute;
	right:0;
	top:50%;
}
.readMore a span:before {
	width:30px;
	height:30px;
	background-color:#000;
	border-radius:30px;
	margin-top:-15px;
}
.readMore a span:after {
	width:16px;
	height:16px;
	background-color:#fff;
	mask-image:url(../images/icon_readmore.svg);
	mask-size:contain;
	mask-repeat:no-repeat;
	mask-position:center;
	margin-top:-8px;
	margin-right:7px;
}
/**/
.coverBox {
	position:relative;
}
.coverBox .arrowMore, .coverBox .curveMore {
	position:absolute;
	right:0;
	bottom:0;
	z-index:1;
}
.arrowMore, .curveMore {
	width:auto;
	height:70px;
	padding-left:15px;
	display:inline-flex;
	align-items:center;
	gap:15px;
	border-radius:35px 0 20px;
	font-size:1.8em;
	color:var(--text-dark);
	transition:all 0.4s ease;
	background-color:transparent;
}
.arrowMore {
	white-space:nowrap;
}
.curveMore {
	align-items:flex-end;
	padding-left:20px;
}
a:hover .arrowMore, a:hover .curveMore, a.arrowMore:hover, a.curveMore:hover {
	transform:translate3d(5px, 0, 0);
	color:var(--gold-dark);
}
.arrowMore .arrow, .curveMore .arrow {
	width:50px;
	height:50px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	background-color:var(--text-dark);
	border-radius:99px;
	transition:all 0.4s ease;
}
a:hover .arrow, a:focus .arrow {
	background-color:var(--gold-dark);
}
.arrowMore .arrow::before, .curveMore .arrow::before {
	content:'';
	display:block;
	transition:transform 0.3s;
	width:16px;
	height:16px;
	background-color:rgb(255, 255, 255);
	mask-image:url(../images/icon_readmore.svg);
	mask-size:contain;
	mask-repeat:no-repeat;
	mask-position:center center;
}
@media screen and (min-width: 641px) and (max-width: 990px) {
	.arrowMore, .curveMore {
		height:50px;
		gap:10px;
	}
}
@media screen and (max-width:640px) {
	.arrowMore, .curveMore {
		font-size:clamp(1.3em, 2.9vw, 1.7em);
		height:9vw;
		gap:clamp(5px, 1.2vw, 10px);
	}
	.arrowMore .arrow, .curveMore .arrow {
		width:8vw;
		height:8vw;
	}
}
/* ══════════════════════════
  三大园区
══════════════════════════ */
.viewpointList {
	width:100%;
	display:flex;
	flex-wrap:wrap;
	gap:20px;
}
.viewpointList .item {
	width:100%;
	transition:all 0.4s ease;
	min-width:180px;
}
.viewWrap {
	width:100%;
	height:100%;
	display:block;
	position:relative;
}
.viewpointList .coverBox {
	width:100%;
	position:relative;
	display:block;
	transition:all 0.5s ease;
}
.viewWrap .photo {
	width:100%;
	height:100%;
	display:block;
	overflow:hidden;
	position:relative;
	mask-image:url(../images/curve_box_top.svg),  url(../images/curve_square.svg),  url(../images/curve_box.svg),  url(../images/curve_masking.svg);
	mask-size:100% auto, 100% auto, 100% auto, auto 160px;
	mask-repeat:no-repeat;
	mask-position:left top, left calc(100% - 120px), left calc(100% - 200px), bottom right;
}
.viewWrap .photo .img {
	width:100%;
	height:0%;
	padding-bottom:100%;
	display:block;
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
	transition:all 0.5s ease;
}
.viewWrap:hover .photo .img, .viewWrap:focus .photo .img {
	-webkit-transform:scale(1.08);
	-moz-transform:scale(1.08);
	-ms-transform:scale(1.08);
	-o-transform:scale(1.08);
	transform:scale(1.08);
}
.viewWrap .photo img {
	object-fit:cover;
	object-position:center;
	width:100% !important;
	height:100% !important;
	aspect-ratio:1 / 1;
	max-width:none !important;
	position:absolute;
	left:50%;
	top:0%;
	transform:translate3d(-50%, 0%, 0);
}
.viewWrap .photo::after {
	content:"";
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-color:transparent;
	background-image:linear-gradient(  180deg,  rgba(0, 0, 0, 0) 30%,  rgba(0, 0, 0, 0.7) 90%  );
}
.viewWrap .photo, .viewWrap .photo img {
	border-radius:clamp(1.5rem, 3.6vw, 2.5rem);
}
.viewWrap .coverWord {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	color:#fff;
	display:flex;
	flex-wrap:wrap;
	flex-direction:column;
	align-items:flex-start;
	justify-content:flex-end;
	box-sizing:border-box;
	padding:20px 20px 80px;
}
.viewWrap .firstTitle {
	font-size:1.4em;
	font-weight:400;
	background-color:#8f200e;
	padding:10px 15px;
	border-radius:99px;
	margin-bottom:0.5em;
	white-space:nowrap;
}
.item:nth-child(2n) .viewWrap .firstTitle {
	background-color:#b18653;
}
.item:nth-child(3n) .viewWrap .firstTitle {
	background-color:#4c6a52;
}
.viewWrap .coverWord dl dt {
	font-size:2.5em;
	line-height:150%;
	font-weight:bold;
	text-shadow:0px 0px 3px rgba(0, 0, 0, 0.8);
}
.viewWrap .coverWord dl dd {
	font-size:1.5em;
	line-height:150%;
	margin-top:.5em;
	overflow:hidden;
	text-overflow:ellipsis;
	display:-webkit-box;
	-webkit-line-clamp:2;
	line-clamp:2;
	-webkit-box-orient:vertical;
}
.viewWrap .coverWord dl dd[lang="en"] {
	font-family:"Bahnschrift", Arial, Helvetica, sans-serif;
	margin-top:.125em;
}
@media screen and (max-width:990px) {
	.viewWrap .firstTitle {
		font-size:1.3em;
		padding:5px 10px;
	}
}
@media screen and (max-width:640px) {
	.viewWrap .coverWord dl dt {
		font-size:1.8em;
	}
	.viewWrap .photo {
		mask-image:url(../images/curve_square.svg), url(../images/curve_masking.svg);
		mask-position:left 0 top calc(100% - 23vw), bottom right;
		mask-size:105% auto, auto 24vw;
	}
	.viewWrap .photo, .viewWrap .photo img {
		border-radius:5vw;
	}
}
@media screen and (min-width:991px) {
	.viewpointList {
		flex-wrap:nowrap;
		flex-direction:row;
	}
	.viewpointList .item {
		width:20%;
	}
	.viewpointList .item.focu-show {
		flex-grow:1;
	}
	.viewpointList .coverBox {
		height:66vh;
		min-height:640px;
	}
	.viewWrap .photo .img {
		height:100%;
		padding-bottom:0%;
	}
	.viewWrap .coverWord {
		padding:40px 30px 80px;
	}
	.viewWrap .photo,  .viewWrap .photo img {
		border-radius:40px;
	}
}
@media screen and (min-width:1260px) {
	.viewpointList {
		gap:30px;
	}
	.viewpointList .item {
		width:25%;
	}
	.viewWrap .coverWord dl dt {
		font-size:3.2em;
	}
	.viewWrap .coverWord dl dd {
		font-size:2em;
	}
	.viewWrap .coverWord dl dd[lang="en"] {
		font-size:2.4em;
	}
}
@media screen and (min-width:1680px) {
	.viewpointList .item {
		width:484px;
	}
	.viewWrap .coverWord dl dt {
		font-size:3.6em;
	}
}
/* ══════════════════════════
   桃源风情
══════════════════════════ */
.ethnicList {
	width:100%;
	display:grid;
	grid-template-columns:repeat(2, 1fr);
	align-items:flex-start;
	gap:20px;
	margin:0 auto;
}
.ethnicList .item {
	width:100%;
}
.ethnicList .item a {
	aspect-ratio:1 / 1;
	display:block;
	position:relative;
	border-radius:clamp(1.5rem, 3.6vw, 2.5rem);
	overflow:hidden;
}
.ethnicList .item a:hover, .ethnicList .item a:focus {
	animation-duration:.5s;
	animation-iteration-count:1;
	animation-name:pulse;
	-webkit-animation-timing-function:ease-in-out;
	animation-timing-function:ease-in-out
}
.ethnicList .item a::before {
	content:"";
	position:absolute;
	width:100%;
	height:100%;
	display:block;
	background-image:url(../images/ethnic_cover.webp);
	background-size:cover;
	background-repeat:no-repeat;
	mix-blend-mode:luminosity;
}
.ethnicList .item:first-of-type a {
	background-color:#662619;
}
.ethnicList .item:nth-of-type(2) a {
	background-color:#392241;
}
.ethnicList .item:nth-of-type(3) a {
	background-color:#1a2f1c;
}
.ethnicList .item:last-of-type a {
	background-color:#2e2d56;
}
.pattern-box {
	width:100%;
	height:100%;
	position:relative;
	z-index:1;
}
.pattern-box img {
	object-fit:cover;
	object-position:center center;
	width:100% !important;
	height:100% !important;
	max-width:none !important;
	position:absolute;
	left:50%;
	top:0%;
	transform:translate3d(-50%, 0%, 0);
}
@-webkit-keyframes pulse {
	0% {
		-webkit-transform:scaleX(1);
		transform:scaleX(1);
	}
	50% {
		-webkit-transform:scale3d(1.05, 1.05, 1.05);
		transform:scale3d(1.05, 1.05, 1.05);
	}
	to {
		-webkit-transform:scaleX(1);
		transform:scaleX(1);
	}
}
@keyframes pulse {
	0% {
		-webkit-transform:scaleX(1);
		transform:scaleX(1);
	}
	50% {
		-webkit-transform:scale3d(1.05, 1.05, 1.05);
		transform:scale3d(1.05, 1.05, 1.05);
	}
	to {
		-webkit-transform:scaleX(1);
		transform:scaleX(1);
	}
}
@media screen and (max-width:640px) {
	.ethnicList .item a {
		border-radius:5vw;
	}
}
@media screen and (min-width:768px) {
	.ethnicList {
		grid-template-columns:repeat(4, 1fr);
	}
	.ethnicList .item:nth-child(2n) {
		margin-top:3.5vw;
	}
}
@media screen and (min-width:1260px) {
	.ethnicList {
		gap:30px;
	}
	.ethnicList .item a {
		border-radius:40px;
	}
}
@media screen and (min-width:1680px) {
	.ethnicList {
		gap:40px;
		max-width:1500px;
	}
	.ethnicList .item:nth-child(2n) {
		margin-top:60px;
	}
}
/* ══════════════════════════
   Splide Control Buttons
══════════════════════════ */
div[class$="-splide"]:has(.is-overflow) .splide {
	padding-bottom:45px;
}
.section .splide__list {
	cursor:grab;
}
.section .splide__list:active {
	cursor:grabbing;
}
/* ── Arrows ── */
.section .splide__arrows {
	display:flex;
	align-items:center;
	gap:8px;
}
.section .splide__arrow {
	position:static;
	transform:none;
	width:45px;
	height:45px;
	border-radius:0;
	background:transparent;
	border:none;
	opacity:1;
	transition:background 0.3s, border-color 0.3s;
	border-radius:50px;
}
.section .splide__arrow svg {
	fill:#fff;
	width:18px;
	height:18px;
}
.section .splide__arrow:hover {
	background:var(--gold);
	border-color:var(--gold);
}
.section .splide__arrow:hover svg {
	fill:#000;
}
.section .splide__arrow:disabled {
	opacity:0.35;
	cursor:not-allowed;
}
.section:not(.light-type) .splide__arrow svg {
	fill:#000;
}
/* ── splideMore ── */
.morewrap {
	display:flex;
	align-items:center;
	gap:0;
}
.splideMore {
	width:45px;
	height:45px;
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	flex-shrink:0;
	transition:background 0.3s, border-color 0.3s;
	border:none;
	background:rgba(0, 0, 0, 0.6);
	color:#fff;
	border-radius:50px;
}
.splideMore:hover, .splideMore:focus {
	background-color:var(--gold);
	color:#000;
}
.splideMore::before {
	content:'';
	display:block;
	width:20px;
	height:20px;
	background-color:#fff;
	mask-image:url(../images/icon-splidemore.svg);
	mask-size:contain;
	mask-repeat:no-repeat;
	mask-position:center;
}
.splideMore:hover::before, .splideMore:focus::before {
	background-color:#000;
}
@media screen and (min-width:768px) {
	div[class$="-splide"]:has(.is-overflow) .splide {
		padding-bottom:30px;
	}
	.section .splide__arrow {
		width:48px;
		height:48px;
	}
	.splideMore {
		width:48px;
		height:48px;
	}
}
@media screen and (min-width:991px) {
	#ich-splide .splide__arrows,  #gallery-splide .splide__arrows {
		position:absolute;
		top:-80px;
		right:0;
	}
	.morewrap {
		position:absolute;
		top:-80px;
		right:calc(238px + 10px);
	}
}
/* ── Pause Btn ── */
.section button[class$="-pause-btn"] {
	width:48px;
	height:48px;
	background:rgba(0, 0, 0, 0.6);
	border:none;
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	flex-shrink:0;
	transition:background 0.3s, border-color 0.3s;
	color:#fff;
	border-radius:50px;
}
.section button[class$="-pause-btn"]:hover {
	background:var(--gold);
	border-color:var(--gold);
	color:var(--green-dark);
}
.section button[class$="-pause-btn"] svg {
	width:16px;
	height:16px;
	fill:currentColor;
}
/* ── Counter ── */
.section *[class$="-counter"] {
	min-width:70px;
	height:48px;
	padding:0;
	background:transparent;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:3px;
	flex-shrink:0;
	font-family:'Bahnschrift', 'Cormorant Garamond', serif;
	font-size:2em;
	font-weight:400;
	line-height:1;
}
.section *[class$="-counter-current"] {
	color:var(--gold-light);
	transition:opacity 0.2s;
}
.section *[class$="-counter-sep"] {
	margin:0px 0.5em;
}
.section *[class$="-counter-sep"]::before {
	content:"";
	display:block;
	width:2px;
	height:1.25em;
	background-color:rgba(255, 255, 255,.5);
	transform:rotate(25deg);
}
.section *[class$="-counter-total"] {
	color:rgba(255, 255, 255,.5);
}
.section:not(.light-type) *[class$="-counter-sep"]::before {
	background-color:#777;
}
.section:not(.light-type) *[class$="-counter-total"] {
	color:#777;
}
/* ── Pagination ── */
.section .splide__pagination {
	gap:6px;
	bottom:0;
	margin:0 auto;
}
.section .splide__pagination__page {
	display:block;
	width:24px;
	height:6px;
	border-radius:0;
	background:rgba(255,255,255,0.15);
	border:none;
	border-radius:6px;
	margin:0;
	opacity:1;
	transition:background 0.3s, width 0.35s;
}
.section .splide__pagination__page.is-active {
	background:var(--gold);
	width:40px;
	transform:none;
}
.section:not(.light-type) .splide__pagination__page {
	background:rgba(0, 0, 0, 0.6);
}
.section:not(.light-type) .splide__pagination__page.is-active {
	background:var(--gold-chroma);
}
@media screen and (max-width:767px) {
	.section .splide__arrow {
		position:absolute;
		width:45px;
		height:45px;
		opacity:1;
		border:none;		
		pointer-events:auto;
		transform:translateY(-50%);
	}
	.section .splide__arrow:hover svg {
		fill:var(--green-deep);
	}
	.section .splide__arrow--prev {
		left:0 !important;
	}
	.section .splide__arrow--next {
		right:0 !important;
	}
	.section .splide__pagination {
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;
		justify-content:center;
		width:max-content;
		max-width:100%;
		padding:0 60px;
		gap:5px;
	}
	.section .splide__pagination__page {
		width:12px;
		height:12px;
		border-radius:50px;
		margin:3px;
	}
	.section .splide__pagination__page.is-active {
		width:30px;
	}
}
/* ── Pause Hint ── */
.section button[class$="-pause-hint"] {
	display:flex;
	align-items:center;
	gap:8px;
	margin-top:28px;
	font-size:1.3em;
	letter-spacing:0.2em;
	color:rgba(255,255,255,0.35);
}
.section button[class$="-pause-dot"] {
	width:6px;
	height:6px;
	border-radius:50%;
	background:var(--gold);
	animation:pulseDot 1.8s ease-in-out infinite;
}
.section button[class$="-pause-hint"].paused .ich-pause-dot {
	animation-play-state:paused;
	background:rgba(255,255,255,0.25);
}
.section button[class$="-pause-hint"].paused span::after {
	content:'（暫停中）';
}
/* ══════════════════════════
   桃源非遗
══════════════════════════ */
.ich-splide {
	position:relative;
}
#ich-splide {
	overflow:visible;
	display:flex;
	flex-wrap:wrap;
	gap:10px;
}
#ich-splide .splide__track {
	width:100%;
	overflow:hidden;
	padding:5px 0;
}
/* ── ich Card ── */
.ich-card {
	border:none;
	cursor:pointer;
	transition:transform 0.35s, border-color 0.3s;
	overflow:hidden;
	position:relative;
	background-color:rgba(0, 0, 0, 0.6);
	display:block;
	border-radius:clamp(1.5rem, 3.6vw, 2.5rem);
}
.ich-card:hover {
	transform:translateY(-5px);
}
.ich-img-wrap {
	position:relative;
	aspect-ratio:1 / 1;
	overflow:hidden;
	background:var(--green-mid);
	border-radius:clamp(1.5rem, 3.6vw, 2.5rem);
	box-sizing:border-box;
}
.ich-img {
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
	transition:transform 0.55s ease;
}
.ich-card:hover .ich-img {
	transform:scale(1.2);
}
.ich-body {
	padding:20px;
	transition:opacity 0.4s ease;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:1em;
}
.ich-type {
	font-size:1.3em;
	letter-spacing:0.22em;
	color:var(--gold-light);
	margin-bottom:5px;
}
.ich-name {
	font-family:"Noto Serif SC", "Source Han Serif SC", "Songti SC", "SimSun", STSong, serif;
	font-size:2em;
	font-weight:bold;
	color:var(--cream);
	line-height:1.4;
}
.ich-badge {
	background:var(--gold-chroma);
	color:#fff;
	font-size:1.2em;
	letter-spacing:0.15em;
	padding:6px 10px;
	font-weight:400;
	font-style:italic;
	border-radius:99px;
}
@media screen and (max-width:640px) {
	.ich-card,
	.ich-img-wrap {
		border-radius:5vw;
	}
}
@media screen and (min-width:1260px) {
	.ich-card, .ich-img-wrap {
		border-radius:40px;
	}
	.ich-name {
		font-size:3em;
	}
	.ich-body {
		min-height:124px;
	}
}
/* ══════════════════════════
   桃源映像
══════════════════════════ */
.gallery-splide {
	position:relative;
}
#gallery-splide {
	overflow:visible;
	display:flex;
	flex-wrap:wrap;
	gap:10px;
}
#gallery-splide .splide__track {
	width:100%;
	overflow:hidden;
	padding:5px 0;
}
/* ── gallery Card ── */
.gallery-card {
	border:none;
	cursor:pointer;
	transition:transform 0.35s, border-color 0.3s;
	overflow:hidden;
	position:relative;
	display:block;
	border-radius:clamp(1.5rem, 3.6vw, 2.5rem);
}
.gallery-card:hover {
	transform:translateY(-5px);
}
.gallery-img-wrap {
	position:relative;
	aspect-ratio:3 / 2;
	overflow:hidden;
	background:var(--green-mid);
	border-radius:clamp(1.5rem, 3.6vw, 2.5rem);
	box-sizing:border-box;
}
.gallery-img-wrap .play-btn {
	position:absolute;
	top:50%;
	left:50%;
	z-index:3;
	transform:translate(-50%, -50%);
	width:25%;
	height:25%;
	border:none;
	display:flex;
	align-items:center;
	justify-content:center;
	cursor:pointer;
	transition:transform .25s ease, background .25s ease;
	background-color:transparent;
	background-image:url(../images/ico_videoPlay.svg);
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center;
	opacity:.6;
}
a:hover .gallery-img-wrap .play-btn {
	transform:translate(-50%, -50%) scale(1.07);
	opacity:.8;
}
.gallery-img-wrap::after {
	content:"";
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-color:transparent;
	background-image:linear-gradient(  180deg,  rgba(0, 0, 0, 0) 30%,  rgba(0, 0, 0, 0.7) 90%  );
}
.gallery-img {
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
	transition:transform 0.55s ease;
}
.gallery-card:hover .gallery-img {
	transform:scale(1.2);
}
.gallery-body {
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	padding:20px;
	transition:opacity 0.4s ease;
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	justify-content:center;
}
.gallery-name {
	font-family:"Noto Serif SC", "Source Han Serif SC", "Songti SC", "SimSun", STSong, serif;
	font-size:clamp(2em, 1.6vw, 3em);
	font-weight:bold;
	color:var(--cream);
	line-height:150%;
}
.gallery-badge {
	position:absolute;
	top:16px;
	left:16px;
	background:var(--black-bg);
	color:#fff;
	font-size:1.2em;
	letter-spacing:0.15em;
	padding:6px 10px;
	font-weight:400;
	font-style:italic;
	border-radius:99px;
}
.gallery-meta {
	font-size:clamp(1.3em, 1.2vw, 1.8em);
	line-height:150%;
	color:var(--text-gray);
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:8px;
}
.gallery-meta > * {
	display:inline-flex;
	align-items:center;
	gap:8px;
}
.gallery-meta >*::before {
	content:"";
	display:block;
	width:3px;
	height:3px;
	background-color:var(--text-gray);
	border-radius:3px;
}
@media screen and (max-width:640px) {
}
@media screen and (min-width:1260px) {
	.gallery-body {
		padding:30px;
		min-height:124px;
	}
	.gallery-badge {
		top:30px;
		left:30px;
	}
}
/* ── 放大檢視 Lightbox ──
   注意：這個區塊刻意放在 #wrapper 之外（見 default.aspx），
   因為 .container.fade-up 有 transform，會讓內層 position:fixed 失效 */
.gallery-lightbox {
	position:fixed;
	inset:0;
	z-index:9999;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:90px 100px;
	box-sizing:border-box;
	opacity:0;
	visibility:hidden;
	transition:opacity 0.3s ease, visibility 0s linear 0.3s;
}
.gallery-lightbox.is-open {
	opacity:1;
	visibility:visible;
	transition:opacity 0.3s ease, visibility 0s linear 0s;
}
.gallery-lightbox .is-hidden {
	display:none;
}
.gallery-lightbox__backdrop {
	position:absolute;
	inset:0;
	background:rgba(0, 0, 0, .92);
	cursor:pointer;
}
.gallery-lightbox__stage {
	position:relative;
	z-index:1;
	max-width:100%;
	max-height:100%;
	display:flex;
	flex-direction:column;
	align-items:center;
	transform:scale(.94);
	transition:transform 0.3s ease;
}
.gallery-lightbox.is-open .gallery-lightbox__stage {
	transform:scale(1);
}
.gallery-lightbox__img,
.gallery-lightbox__video {
	display:none;
	max-width:100%;
	max-height:calc(100vh - 230px);
	width:auto;
	height:auto;
	border-radius:20px;
	background:#000;
	box-shadow:0 30px 70px rgba(0, 0, 0, .5);
}
.gallery-lightbox__img.is-active,
.gallery-lightbox__video.is-active {
	display:block;
}
.gallery-lightbox__caption {
	margin-top:24px;
	text-align:center;
	max-width:640px;
}
.gallery-lightbox__name {
	font-family:"Noto Serif SC", "Source Han Serif SC", "Songti SC", "SimSun", STSong, serif;
	font-size:2em;
	font-weight:bold;
	color:var(--cream);
	line-height:1.4;
}
.gallery-lightbox__meta {
	margin-top:6px;
	font-size:1.6em;
	color:rgba(255, 255, 255, .6);
}
.gallery-lightbox__close,
.gallery-lightbox__prev,
.gallery-lightbox__next {
	position:absolute;
	z-index:2;
	width:52px;
	height:52px;
	border:none;
	border-radius:50px;
	background:rgba(0, 0, 0, .6);
	color:#fff;
	display:flex;
	align-items:center;
	justify-content:center;
	cursor:pointer;
	transition:background 0.3s, color 0.3s;
}
.gallery-lightbox__close:hover,
.gallery-lightbox__prev:hover,
.gallery-lightbox__next:hover {
	background:var(--gold);
	color:var(--green-dark);
}
.gallery-lightbox__close svg,
.gallery-lightbox__prev svg,
.gallery-lightbox__next svg {
	width:20px;
	height:20px;
	fill:none;
	stroke:currentColor;
	stroke-width:2.4;
	stroke-linecap:round;
	stroke-linejoin:round;
}
.gallery-lightbox__close {
	top:24px;
	right:24px;
}
.gallery-lightbox__prev {
	left:24px;
	top:50%;
	transform:translateY(-50%);
}
.gallery-lightbox__next {
	right:24px;
	top:50%;
	transform:translateY(-50%);
}
.gallery-lightbox__counter {
	position:absolute;
	top:26px;
	left:26px;
	z-index:2;
	color:rgba(255, 255, 255, .7);
	font-family:'Bahnschrift', 'Cormorant Garamond', serif;
	font-size:1.8em;
	letter-spacing:.05em;
}
html.gallery-lightbox-open,
html.gallery-lightbox-open body {
	overflow:hidden;
}
@media screen and (max-width:767px) {
	.gallery-lightbox {
		padding:64px 14px;
	}
	.gallery-lightbox__img,
	.gallery-lightbox__video {
		max-height:calc(100vh - 180px);
		border-radius:12px;
	}
	.gallery-lightbox__close {
		top:14px;
		right:14px;
		width:42px;
		height:42px;
	}
	.gallery-lightbox__prev,
	.gallery-lightbox__next {
		width:42px;
		height:42px;
	}
	.gallery-lightbox__prev {
		left:8px;
	}
	.gallery-lightbox__next {
		right:8px;
	}
	.gallery-lightbox__counter {
		top:16px;
		left:16px;
		font-size:1.4em;
	}
	.gallery-lightbox__name {
		font-size:1.6em;
	}
	.gallery-lightbox__meta {
		font-size:1.3em;
	}
}
/* ══════════════════════════
   桃源风情
══════════════════════════ */
.relatedLinks {
	width:100%;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:20px;
	margin:0 auto;
}
.relatedLinks .item {
	max-width:100%;
}
.relatedLinks .item a {
	position:relative;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:flex-start;
	gap:.5em;
	text-align:center;
}
.relatedLinks .item strong {
	font-size:2.5em;
	line-height:150%;
	font-weight:bold;
	color:var(--text-dark);
}
.relatedLinks .item p[lang="en"] {
	font-family:"Bahnschrift", Arial, Helvetica, sans-serif;
	margin-top:.125em;
	font-size:1.8em;
	color:var(--gold-dark);
}
.relatedIcon {
	width:70%;
	position:relative;
	z-index:1;
	background-color:#faf6ed;
	border-radius:46% / 46%;
	box-shadow:0 0 20px rgba(0, 0, 0, .15);
	aspect-ratio:1 / 1;
	margin:0 auto;
	max-width:160px;
}
.relatedIcon .img {
	width:100%;
	height:100%;
	display:block;
}
.relatedIcon img {
	object-fit:cover;
	object-position:center center;
	width:80% !important;
	height:80% !important;
	max-width:none !important;
	position:absolute;
	left:50%;
	top:50%;
	transform:translate3d(-50%, -50%, 0);
}
.relatedLinks .item a:hover .relatedIcon, .relatedLinks .item a:focus .relatedIcon {
	animation-duration:.5s;
	animation-iteration-count:1;
	animation-name:pulse;
	-webkit-animation-timing-function:ease-in-out;
	animation-timing-function:ease-in-out
}
@media screen and (max-width:767px) {
	.relatedLinks .item {
		width:calc(50% - 10px);
	}
}
@media screen and (min-width:768px) and (max-width:990px) {
	.relatedLinks {
		display:grid;
		align-items:flex-start;
		grid-template-columns:repeat(4, 1fr);
	}
}
@media screen and (min-width:991px) {
	.relatedLinks {
		display:grid;
		align-items:flex-start;
		grid-template-columns:repeat(7, 1fr);
	}
	.relatedLinks .item {
		width:100%;
	}
}
@media screen and (min-width:1260px) {
	.relatedLinks {
		gap:30px;
	}
	.relatedLinks .item strong {
		font-size:3.2em;
	}
	.relatedLinks .item p[lang="en"] {
		font-size:2.4em;
	}
}
@media screen and (min-width:1680px) {
	.relatedLinks {
		gap:40px;
	}
	.relatedIcon {
		max-width:160px;
	}
	.relatedLinks .item strong {
		font-size:3.6em;
	}
}
/* ══════════════════════════
   桃源盛事
══════════════════════════ */
.eventsWrap {
	display:grid;
	align-items:flex-start;
	grid-template-columns:1fr;
	gap:20px;
}
.oneBox {
	padding:20px;
	position:relative;
	z-index:1;
}
.oneBox, .firstPost {
	display:flex;
	flex-direction:column;
	gap:15px;
}
.oneBox::before {
	content:"";
	display:block;
	width:100%;
	height:100%;
	border-radius:clamp(1.5rem, 3.6vw, 2.5rem);
	background-color:#d6daea;
	mask-image:url(../images/curve_masking_top.svg), url(../images/curve_square.svg), url(../images/curve_box.svg);
	mask-size:auto 160px, 100% auto, 100% auto;
	mask-repeat:no-repeat;
	mask-position:top right, left 120px, left 200px;
	position:absolute;
	right:0;
	top:0;
	z-index:-1;
}
.eventsWrap .oneBox:nth-child(2n)::before {
	background-color:#cce2d4;
}
.eventsWrap .oneBox:nth-child(3n)::before {
	background-color:#dbd6d2;
}
.box-head {
	width:100%;
	display:flex;
	flex-wrap:wrap;
	flex-direction:row;
	justify-content:space-between;
	align-items:center;
	min-height:50px;
}
.box-head .arrowMore {
	position:absolute;
	top:0;
	right:0;
}
.titleHead {
	width:calc(100% - 80px);
	display:flex;
	flex-wrap:wrap;
	align-items:flex-end;
	gap:1rem;
}
.titleHead h3 {
	font-size:clamp(1.75rem, 2.38vw, 2.25rem);
	color:#3f4a75;
}
.titleHead .subtitle {
	font-size:clamp(1.125rem, 1.42vw, 1.5rem);
	color:var(--text-mid);
}
.titleHead .subtitle[lang="en"] {
	font-family:"Bahnschrift", Arial, Helvetica, sans-serif;
}
.events-name {
	color:#3f4a75;
	font-size:1.8em;
	line-height:150%;
}
.eventsWrap .oneBox:nth-child(2n) .titleHead h3, .eventsWrap .oneBox:nth-child(2n) .events-name {
	color:var(--green-mid);
}
.eventsWrap .oneBox:nth-child(3n) .titleHead h3, .eventsWrap .oneBox:nth-child(3n) .events-name {
	color:#55463c;
}
.events-meta {
	font-size:1.6em;
	line-height:170%;
	color:var(--gold-deep);
}
.events-meta time {
	white-space:nowrap;
}
a:hover .events-name, a:focus .events-name, a:hover .events-meta, a:focus .events-meta {
	color:var(--red-deep) !important;
}
.photo-wrap, .video-wrap {
	width:100%;
	aspect-ratio:16 / 9;
	border-radius:clamp(0.75rem, 2vw, 1.25rem);
	overflow:hidden;
}
.photo-wrap .img {
	width:100%;
	height:100%;
	display:block;
	transition:transform 0.55s ease;
}
.photo-wrap img {
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
}
a:hover .photo-wrap .img, a:focus .photo-wrap .img {
	-webkit-transform:scale(1.08);
	-moz-transform:scale(1.08);
	-ms-transform:scale(1.08);
	-o-transform:scale(1.08);
	transform:scale(1.08);
}
.video-wrap {
	position:relative;
}
.video-wrap::before {
	content:"";
	display:block;
	position:absolute;
	left:50%;
	top:50%;
	background-image:url(../images/ico_videoPlay.svg);
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center;
	width:70px;
	height:70px;
	margin-left:-35px;
	margin-top:-35px;
	z-index:2;
	opacity:.7;
	transition:opacity 0.5s ease, transform 0.4s ease;
}
a:hover .video-wrap::before {
	opacity:.85;
	transform:scale(1.1);
}
.video-wrap::after {
	content:"";
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-color:transparent;
	background-image:linear-gradient(180deg, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.7) 90%);
}
.onePost {
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	transition:transform 0.4s ease;
}
.onePost.column {
	flex-direction:column;
	gap:0;
}
.onePost:has(.events-meta) {
	justify-content:space-between;
}
.onePost:hover, .onePost:focus {
	transform:translate3d(0, -3px, 0);
}
.onePost .events-name {
	flex-grow:1;
}
.eventsList {
	width:100%;
	position:relative;
	list-style-type:none;
}
.eventsList li {
	padding:1.5em 0;
	border-top:1px dashed rgba(0,0,0,.15);
}
.learnWrap .eventsList li {
	border-color:rgba(255,255,255,.3);
}
.eventsList li:last-child {
	padding-bottom:0;
}
.dotList .events-name {
	display:flex;
	align-items:flex-start;
	gap:12px;
}
.dotList .events-name::before {
	content:"";
	width:8px;
	height:8px;
	border-radius:4px;
	margin-top:.65em;
	flex-shrink:0;
	background:var(--cyan-blue-light);
}
.oneBox:nth-child(even) .dotList .events-name::before {
	background:var(--gold);
}
@media screen and (min-width:641px) and (max-width:990px) {
	.oneBox {
		flex-wrap:wrap;
		flex-direction:row;
		justify-content:flex-end;
		align-content:flex-start;
		min-height:calc(22.75vw + 100px);
		gap:20px;
	}
	.oneBox::before {
		border-radius:2.5vw;
	}
	.box-head {
		min-height:60px;
	}
	.firstPost {
		width:100%;
	}
}
@media screen and (min-width:768px) and (max-width:990px) {
	.oneBox:has(.eventsList) .firstPost {
		padding-left:calc(40% + 20px);
		position:relative;
	}
	.oneBox:has(.eventsList) .photo-wrap {
		position:absolute;
		left:0;
		top:0;
		width:40%;
	}
	.oneBox:has(.firstPost) .eventsList {
		width:calc(100% - (40% + 20px));
	}
	.onePost .events-name {
		max-width:calc(100% - 110px);
	}
}
@media screen and (max-width:640px) {
	.oneBox::before {
		mask-size:auto 25vw, 100% auto, 100% auto;
		mask-position:top right, left 25vw, left 40vw;
		border-radius:5vw;
	}
}
@media screen and (min-width:768px) {
	.events-name {
		text-overflow:ellipsis;
		display:-webkit-box;
		-webkit-line-clamp:2;
		-webkit-box-orient:vertical;
		overflow:hidden;
	}
	.onePost .events-name {
		max-width:calc(100% - 120px);
	}
	.onePost.column .events-name {
		max-width:100%;
	}
}
@media screen and (min-width:991px) {
	.eventsWrap {
		grid-template-columns:repeat(3, 1fr);
	}
	.oneBox {
		min-height:100%;
	}
}
@media screen and (min-width:1260px) {
	.eventsWrap {
		gap:30px;
	}
	.eventsWrap .oneBox {
		padding:30px;
	}
	.eventsWrap .oneBox::before {
		border-radius:40px;
	}
	.photo-wrap, .video-wrap {
		border-radius:20px;
	}
	.events-name {
		font-size:2em;
		line-height:180%;
	}
	.events-meta {
		font-size:1.8em;
		line-height:200%;
	}
	.onePost {
		flex-wrap:nowrap;
	}
	.dotList .events-name::before {
		margin-top:.75em;
	}
}
/* ══════════════════════════
   桃源研学
══════════════════════════ */
.learnWrap {
	display:grid;
	align-items:flex-start;
	grid-template-columns:1fr;
	gap:20px;
}
.learnWrap .oneBox::before {
	background-color:#2d713a;
}
.learnWrap .oneBox:nth-child(2n)::before {
	background-color:#b18653;
}
.learnWrap .oneBox:nth-child(3n)::before {
	background-color:#466e8c;
}
.learnWrap .photo-wrap, .learnWrap .video-wrap {
	aspect-ratio:3 / 2;
}
.learnWrap .titleHead .subtitle {
	color:#dddddd;
}
.learnWrap .events-name, .learnWrap .titleHead h3, .learnWrap .oneBox:nth-child(2n) .titleHead h3, .learnWrap .oneBox:nth-child(2n) .events-name, .learnWrap .oneBox:nth-child(3n) .titleHead h3, .learnWrap .oneBox:nth-child(3n) .events-name {
	color:var(--text-white);
}
.learnWrap .events-meta {
	color:#e6d282;
}
.learnWrap a:hover .events-name, .learnWrap a:focus .events-name, .learnWrap a:hover .events-meta, .learnWrap a:focus .events-meta {
	color:var(--cyan-blue-light) !important;
}
@media screen and (min-width:768px) and (max-width:990px) {
	.learnWrap .oneBox {
		min-height:calc(26.5vw + 100px);
	}
}
@media screen and (min-width:991px) {
	.learnWrap {
		grid-template-columns:1fr 1fr 1fr;
	}
}
@media screen and (min-width:1260px) {
	.learnWrap {
		gap:30px;
	}
	.learnWrap .oneBox {
		padding:30px;
	}
	.learnWrap .oneBox::before {
		border-radius:40px;
	}
	.learnWrap .box-head {
		min-height:80px;
	}
}
@media screen and (min-width:1680px) {
}
/* ══════════════════════════
   桃源永续
══════════════════════════ */
.esgWrap {
	width:100%;
}
/* ---- Card grid ---- */
.grid {
	display:grid;
	grid-template-columns:1fr;
	gap:20px;
}
.card {
	position:relative;
	border-radius:clamp(1.5rem, 3.6vw, 2.5rem);
	background-color:transparent;
	box-shadow:var(--shadow);
	padding:20px;
	display:flex;
	flex-direction:column;
	gap:1.5rem;
}
.esgWrap .card::before {
	content:"";
	display:block;
	width:100%;
	height:100%;
	border-radius:clamp(1.5rem, 3.6vw, 2.5rem);
	background-color:#faf0d7;
	mask-image:url(../images/curve_masking_top.svg), url(../images/curve_square.svg), url(../images/curve_box.svg);
	mask-size:auto 160px, 100% auto, 100% auto;
	mask-repeat:no-repeat;
	mask-position:top right, left 120px, left 200px;
	position:absolute;
	right:0;
	top:0;
	z-index:-1;
}
.card-head {
	width:100%;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
	min-height:70px;
}
.card-head-left {
	display:flex;
	align-items:center;
	gap:14px;
}
.card-head .arrowMore {
	position:absolute;
	right:0;
	top:0;
}
.icon-circle {
	width:56px;
	height:56px;
	display:flex;
	align-items:center;
	justify-content:center;
	flex-shrink:0;
	background:#fff;
	mask-image:url(../images/ico_mask.svg);
	mask-size:contain;
	mask-repeat:no-repeat;
	mask-position:center;
}
.card-head-text .zh-title {
	font-family:var(--font-heading);
	font-weight:700;
	font-size:clamp(1.75rem, 2.38vw, 2.25rem);
	color:var(--ink);
}
.card-head-text .en-label {
	display:block;
	font-family:var(--font-heading);
	font-style:normal;
	color:var(--gold-chroma);
	margin-bottom:2px;
	font-size:clamp(1.125rem, 1.42vw, 1.5rem);
	font-weight:600;
	font-family:Bahnschrift, Arial, Helvetica, sans-serif;
}
/* ---- Photo carousel ---- */
.photo-splide {
	overflow:visible;
}
.photo-splide .splide__track {
	border-radius:clamp(0.75rem, 2vw, 1.25rem);
	overflow:hidden;
}
.photo-splide .splide__slide {
	position:relative;
}
.ph-photo {
	width:100%;
	height:100%;
	aspect-ratio:3 / 2;
}
.ph-photo img {
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
}
/* dots pagination */
.photo-splide .splide__pagination {
	bottom:auto;
	top:-30px;
	right:0;
	justify-content:flex-end;
	gap:10px;
}
.photo-splide .splide__pagination__page, .photo-splide:not(.light-type) .splide__pagination__page {
	background:#b2b2b2;
	width:10px;
	height:10px;
	opacity:1;
	margin:5px;
}
.photo-splide .splide__pagination__page.is-active {
	width:10px;
	height:10px;
	background:#fff;
}
.photo-splide .splide__pagination__page.is-active::before {
	content:"";
	display:block;
	width:20px;
	height:20px;
	border:1px solid var(--gold-chroma);
	position:absolute;
	left:-5px;
	top:-5px;
	border-radius:20px;
}
/* ---- Bullet list ---- */
ul.feature-list {
	list-style:none;
	margin:0;
	padding:0;
	display:flex;
	flex-direction:column;
	gap:15px;
}
ul.feature-list li {
	font-size:1.8em;
	line-height:150%;
}
ul.feature-list li a {
	color:var(--text-mid);
}
ul.feature-list li a:hover, ul.feature-list li a:focus {
	color:var(--red-deep);
}
ul.feature-list .onePost {
	display:flex;
	align-items:flex-start;
	justify-content:flex-start;
	gap:12px;
}
ul.feature-list .onePost::before {
	content:"";
	width:8px;
	height:8px;
	border-radius:4px;
	background:var(--gold-chroma);
	margin-top:.65em;
	flex-shrink:0;
}
@media screen and (min-width:768px) and (max-width:990px) {
	.esgWrap .card {
		flex-wrap:wrap;
		flex-direction:row;
		justify-content:flex-end;
		align-content:flex-start;
		gap:20px;
	}
	.photo-splide {
		width:40%;
	}
	ul.feature-list {
		width:calc(100% - (40% + 20px));
	}
}
@media screen and (max-width:640px) {
	.esgWrap .card::before {
		mask-size:auto 25vw, 100% auto, 100% auto;
		mask-position:top right, left 25vw, left 40vw;
		border-radius:5vw;
	}
}
@media screen and (min-width:991px) {
	.grid {
		grid-template-columns:repeat(3, 1fr);
	}
	.esgWrap .card::before {
		background-color:#fff;
	}
	.card-head {
		min-height:80px;
	}
	.icon-circle {
		background-color:#eee3d0;
	}
}
@media screen and (min-width:1260px) {
	.grid {
		gap:30px;
	}
	.esgWrap .card::before {
		border-radius:40px;
	}
	.icon-circle {
		width:80px;
		height:80px;
	}
	.card {
		padding:30px;
	}
	ul.feature-list li {
		font-size:2em;
		line-height:180%;
	}
	ul.feature-list .onePost::before {
		margin-top:.75em;
	}
}
/* ══════════════════════════
   FADE-IN ANIMATION
══════════════════════════ */
.fade-up {
	opacity:0;
	transform:translateY(36px);
	transition:opacity 0.8s ease, transform 0.8s ease;
}
.fade-up.visible {
	opacity:1;
	transform:translateY(0);
}

@media print {
}
