/* Globel */
* {
	text-decoration: none;
	outline: none;
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	margin: 0;
	padding: 0;
}
html,
body {
	font-family: "Noto Sans TC", "Microsoft JhengHei", sans-serif;
	font-weight: 500;
	overflow-x: hidden;
	scrollbar-width: none;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
}
body {
	background-color: #fff;
	display: flex;
	flex-direction: column;
	color: #fff;
}

button {
	cursor: pointer;
	border: none;
	background: transparent;
}

a {
	width: 100%;
	height: 100%;
	cursor: pointer;
	color: #fff;
}

button:active,
a:active,
.slide-next:active,
.slide-prev:active,
.continue:active {
	transform: scale(0.98) translateY(1.5px) translateZ(0) !important;
}

section {
	background-size: cover;
}

nav {
	width: 100%;
	height: auto;
	position: absolute;
	top: 0;
}

.wrap,
.swiper-container {
	width: 100%;
	height: 100%;
	max-width: none;
    max-height: none;
	position: relative;
}

.slide-container {
	width: 100%;
	height: 100%;
	max-width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	position: relative;
}

.swiper-slide {
	width: 100%;
	height: 100%;
	max-width: 1920px;
	max-height: 953px;
	background-size: cover !important;
	display: flex;
	justify-content: center;
	align-items: center;
	opacity: 0 !important;
    /* transition: opacity 1s ease; */
}

.swiper-slide-active {
    opacity: 1 !important;
}

.swiper-slide-prev,
.swiper-slide-next,
.swiper-slide-duplicate {
    opacity: 0 !important;
}

.slide-content {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.slide-content,
.slide-count,
.digit {
	display: flex;
	opacity: 0;
}

.slide9 .slide-content,
.slide10 .slide-content,
.slide11 .slide-content {
	opacity: 1;
}

.slide-content.fade-in-top,
.slide-count.fade-in-top,
.digit.fade-in-top,
.slide12-info.fade-in-top,
.slide12-btns.fade-in-top,
.slide16-btns.fade-in-top,
.server-name.fade-in-top {
	animation: fade-in-top 0.2s linear forwards;
}

.slide-count.fade-in-top {
	animation-delay: 0.2s;
}

/* Slide 1 */
.slide1 {
	background: url("/img/event/20260128/index_bg.jpg") no-repeat;
}

.bar-left a,
.bar-right a {
	display: block;
}

.bar-left {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 10;
}

.bar-left .logo {
	background: url("/img/event/20260128/logo.png") no-repeat;
	width: 280px;
	height: 120px;
}

.bar-right {
	width: 200px;
	height: auto;
	position: absolute;
	top: 20px;
	right: 10px;
	display: flex;
	justify-content: space-evenly;
	z-index: 10;
}

.bar-right .register {
	background: url("/img/event/20260128/icon_register.png") no-repeat;
	width: 52px;
	height: 52px;
}

.bar-right .download {
	background: url("/img/event/20260128/icon_download.png") no-repeat;
	width: 52px;
	height: 52px;
}

.bar-right .fans {
	background: url("/img/event/20260128/icon_fb.png") no-repeat;
	width: 52px;
	height: 52px;
}

.slide1 .slide1-title {
	background: url("/img/event/20260128/main_title.png") no-repeat;
	width: 880px;
	height: 300px;
	position: absolute;
	top: 30px;
}

.slide1 .slide1-content {
	width: 800px;
	height: 390px;
	position: absolute;
	top: 44%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-evenly;
	z-index: 3;
}

.slide1 .select-text {
	background: url("/img/event/20260128/select_text.png?v1.0.1") no-repeat;
	width: 480px;
	height: 80px;
	margin-bottom: -20px;
}

.server-select {
	background-color: #081348;
	width: 400px;
	height: 80px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.server-select .server {
	width: 380px;
	height: 60px;
	border: 1px solid #717bb9;
	background-color: #0c1349;
	color: #fff;
	font-size: 1.5em;
	padding: 0 20px;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

.server-select::after {
	content: "\f107";
	font-family: "Font Awesome 7 Free";
	font-weight: 700;
	position: absolute;
	right: 230px;
	color: #fff;
	pointer-events: none;
}

.slide1-btns {
	width: 500px;
	display: flex;
	justify-content: space-around;
}

.slide1-btns .btn1 {
	background: url("/img/event/20260128/btn01.png") no-repeat;
	width: 220px;
	height: 60px;
}
.slide1-btns .btn2 {
	background: url("/img/event/20260128/btn02.png") no-repeat;
	width: 220px;
	height: 60px;
}
.slide1-btns .btn1:hover {
	background: url("/img/event/20260128/btn01_on.png") no-repeat;
}
.slide1-btns .btn2:hover {
	background: url("/img/event/20260128/btn02_on.png") no-repeat;
}

.slide1-text,
.slide1-text-m {
	text-align: center;
	font-size: 20px;
	font-weight: 300;
	letter-spacing: 2px;
}

.slide1-text-m {
	display: none;
	color: #7298f2;
}

/* Slide 2 */
.slide2 {
	background: url("/img/event/20260128/bg02.jpg") no-repeat center top;
}

.text-group {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 100%;
}

.text-item {
	opacity: 0;
	transform: translateY(20px);
	margin: 10px 0;
	width: 1100px;
	height: 80px;
}

.text-item.fade-in-bottom,
.continue.fade-in-bottom {
	animation: fade-in-bottom 0.5s ease-in-out forwards;
}

.text-item1.server1 {
	background: url("/img/event/20260128/section02/text01a.png?v1.0.1") no-repeat;
}
.text-item1.server2 {
	background: url("/img/event/20260128/section02/text01b.png?v1.0.1") no-repeat;
}
.text-item2 {
	background: url("/img/event/20260128/section02/text02.png?v1.0.1") no-repeat;
}
.text-item3 {
	background: url("/img/event/20260128/section02/text03.png?v1.0.1") no-repeat;
}
.text-item4 {
	background: url("/img/event/20260128/section02/text04.png?v1.0.1") no-repeat;
}
.text-item5 {
	background: url("/img/event/20260128/section02/text05.png?v1.0.1") no-repeat;
}
.text-item6 {
	background: url("/img/event/20260128/section02/text06.png?v1.0.1") no-repeat;
}

/* Slide 3 */
.slide3 {
	background: url("/img/event/20260128/bg03.jpg") no-repeat center top;
}

.slide3-title {
	background: url("/img/event/20260128/section03/title01.png") no-repeat;
	width: 600px;
	height: 190px;
	position: absolute;
	top: 15px;
}

.slide3-info {
	width: 100%;
	height: 100%;
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
}


/* server1 */
.slide3-info.server1 .slide-content {
	background: url("/img/event/20260128/section03/img01a.png") no-repeat center;
	background-size: 95%;
    width: 1280px;
    height: 620px;
    position: absolute;
    bottom: 140px;
}
.slide3-info.server1 .slide-content::before {
	content: "";
    background: url("/img/event/20260128/section03/server_name01.png") no-repeat;
    width: 400px;
    height: 160px;
    position: absolute;
	top: -50px;
    right: -30px;
    scale: 0.3;
}
.slide3-info.server1 .slide-count {
	background: url("/img/event/20260128/section03/count01a.png?v1.0.1") no-repeat center;
    background-size: 80%;
	width: 400px;
    height: 120px;
    position: absolute;
	bottom: 105px;
}

/* server2 */
.slide3-info.server2 .slide-content {
	background: url("/img/event/20260128/section03/img01b.png") no-repeat center;
	background-size: 95%;
    width: 1280px;
    height: 620px;
    position: absolute;
    bottom: 140px;
}
.slide3-info.server2 .slide-content::before {
	content: "";
    background: url("/img/event/20260128/section03/server_name02.png") no-repeat;
    width: 400px;
    height: 160px;
    position: absolute;
	top: -50px;
    right: -30px;
    scale: 0.3;
}
.slide3-info.server2 .slide-count {
	background: url("/img/event/20260128/section03/count01b.png?v1.0.1") no-repeat center;
    background-size: 80%;
	width: 400px;
    height: 120px;
    position: absolute;
	bottom: 100px;
}

/* Slide 4 */
.slide4 {
	background: url("/img/event/20260128/bg03.jpg") no-repeat center top;
}

.slide4-title {
	background: url("/img/event/20260128/section03/title02.png") no-repeat;
	width: 600px;
	height: 190px;
	position: absolute;
	top: 15px;
}

.slide4-info {
	width: 100%;
	height: 100%;
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
}

/* server1 */
.slide4-info.server1 .slide-content {
	background: url("/img/event/20260128/section03/img02a.png") no-repeat center;
	background-size: 95%;
    width: 1280px;
    height: 620px;
    position: absolute;
    bottom: 140px;
}
.slide4-info.server1 .slide-content::before {
	content: "";
    background: url("/img/event/20260128/section03/server_name01.png") no-repeat;
    width: 400px;
    height: 160px;
    position: absolute;
	top: -50px;
    right: -30px;
    scale: 0.3;
}
.slide4-info.server1 .slide-count {
	background: url("/img/event/20260128/section03/count02a.png?v1.0.1") no-repeat center;
    background-size: 80%;
	width: 400px;
    height: 120px;
    position: absolute;
	bottom: 100px;
}

/* server2 */
.slide4-info.server2 .slide-content {
	background: url("/img/event/20260128/section03/img02b.png") no-repeat center;
	background-size: 95%;
    width: 1280px;
    height: 620px;
    position: absolute;
    bottom: 140px;
}
.slide4-info.server2 .slide-content::before {
	content: "";
    background: url("/img/event/20260128/section03/server_name02.png") no-repeat;
    width: 400px;
    height: 160px;
    position: absolute;
	top: -50px;
    right: -30px;
    scale: 0.3;
}
.slide4-info.server2 .slide-count {
	background: url("/img/event/20260128/section03/count02b.png?v1.0.1") no-repeat center;
	background-size: 80%;
	width: 400px;
	height: 120px;
	position: absolute;
	bottom: 100px;
}

/* Slide 5 */
.slide5 {
	background: url("/img/event/20260128/bg03.jpg") no-repeat center top;
}

.slide5-title {
	background: url("/img/event/20260128/section03/title03.png") no-repeat;
	width: 600px;
	height: 190px;
	position: absolute;
	top: 15px;
}

.slide5-info {
	width: 100%;
	height: 100%;
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
}

/* server1 */
.slide5-info.server1 .slide-content {
	background: url("/img/event/20260128/section03/img03a.png") no-repeat center;
	background-size: 95%;
    width: 1280px;
    height: 620px;
    position: absolute;
    bottom: 140px;
}
.slide5-info.server1 .slide-content::before {
	content: "";
    background: url("/img/event/20260128/section03/server_name01.png") no-repeat;
    width: 400px;
    height: 160px;
    position: absolute;
	top: -50px;
    right: -30px;
    scale: 0.3;
}
.slide5-info.server1 .slide-count {
	background: url("/img/event/20260128/section03/count03a.png?v1.0.1") no-repeat center;
	background-size: 80%;
	width: 400px;
	height: 120px;
	position: absolute;
	bottom: 100px;
}

/* server2 */
.slide5-info.server2 .slide-content {
	background: url("/img/event/20260128/section03/img03b.png") no-repeat center;
	background-size: 95%;
    width: 1280px;
    height: 620px;
    position: absolute;
    bottom: 140px;
}
.slide5-info.server2 .slide-content::before {
	content: "";
    background: url("/img/event/20260128/section03/server_name02.png") no-repeat;
    width: 400px;
    height: 160px;
    position: absolute;
	top: -50px;
    right: -30px;
    scale: 0.3;
}
.slide5-info.server2 .slide-count {
	background: url("/img/event/20260128/section03/count03b.png?v1.0.1") no-repeat center;
	background-size: 80%;
	width: 400px;
	height: 120px;
	position: absolute;
	bottom: 100px;
}

/* Slide 6 */
.slide6 {
	background: url("/img/event/20260128/bg04.jpg") no-repeat center;
}

.slide6-title {
	background: url("/img/event/20260128/section03/title04.png") no-repeat;
	width: 1280px;
	height: 340px;
	position: absolute;
	top: 0;
}

.slide6-info {
	font-size: 30px;
    position: absolute;
    top: 350px;
}

.slide6 .digit {
	margin-top: 50px;
	position: relative;
	justify-content: center;
}

.slide6 .digit::after {
	content: "";
	background: url("/img/event/20260128/section03/light.png") no-repeat center bottom;
	background-size: contain;
	width: 1280px;
	height: 90px;
	position: absolute;
	bottom: -40px;
}

/* Slide 7 */
.slide7 {
	background: url("/img/event/20260128/bg04.jpg") no-repeat center;
}

.slide7-title {
	background: url("/img/event/20260128/section03/title05.png") no-repeat;
	width: 1280px;
	height: 340px;
	position: absolute;
	top: 0;
}

.slide7-info {
	font-size: 30px;
    position: absolute;
    top: 350px;
}

.slide7 .digit {
	margin-top: 50px;
	position: relative;
	justify-content: center;
}

.slide7 .digit::after {
	content: "";
	background: url("/img/event/20260128/section03/light.png") no-repeat center bottom;
	background-size: contain;
	width: 1280px;
	height: 90px;
	position: absolute;
	bottom: -40px;
}

/* Slide 8 */
.slide8 {
	background: url("/img/event/20260128/bg04.jpg") no-repeat center;
}

.slide8-title {
	background: url("/img/event/20260128/section03/title06.png") no-repeat;
	width: 1280px;
	height: 340px;
	position: absolute;
	top: 0;
}

.slide8-info {
	font-size: 30px;
    position: absolute;
    top: 350px;
}

.slide8 .digit {
	margin-top: 50px;
	position: relative;
	justify-content: center;
}

.slide8 .digit::after {
	content: "";
	background: url("/img/event/20260128/section03/light.png") no-repeat center bottom;
	background-size: contain;
	width: 1280px;
	height: 90px;
	position: absolute;
	bottom: -40px;
}

/* Slide 9 */
.slide9 {
	background: url("/img/event/20260128/bg05.jpg") no-repeat center;
}

.slide9-title {
	background: url("/img/event/20260128/section03/title07.png") no-repeat;
	width: 1280px;
	height: 340px;
	position: absolute;
	top: 0;
}

.server1-info,
.server2-info {
	width: 100%;
	height: 100%;
	display: none;
}

.slide9-info {
	font-size: 30px;
    position: absolute;
    top: 0;
    /* display: flex; */
	justify-content: space-evenly;
    align-items: center;
	zoom: 0.8;
}

.slide9 .war-blue,
.slide9 .war-red {
	display: flex;
	justify-content: center;
	flex-direction: column;
	top: 3%;
}

.slide9-info.server1 .server-name,
.slide10.server1 .server-name,
.slide11.server1 .server-name,
.slide13.server1 .server-name,
.slide14.server1 .server-name, 
.slide15.server1 .server-name {
	background: url("/img/event/20260128/section03/server_name01.png") no-repeat center;
	background-size: contain;
}

.slide9-info.server2 .server-name,
.slide10.server2 .server-name,
.slide11.server2 .server-name,
.slide13.server2 .server-name,
.slide14.server2 .server-name, 
.slide15.server2 .server-name {
	background: url("/img/event/20260128/section03/server_name02.png") no-repeat center;
	background-size: contain;
}

.slide9-info.server1 .server-name,
.slide9-info.server2 .server-name,
.slide10.server1 .server-name,
.slide10.server2 .server-name,
.slide11.server1 .server-name,
.slide11.server2 .server-name,
.slide13.server1 .server-name,
.slide13.server2 .server-name,
.slide14.server1 .server-name, 
.slide14.server2 .server-name, 
.slide15.server1 .server-name, 
.slide15.server2 .server-name {
	width: 400px;
	height: 160px;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	opacity: 0;
}

.slide9-info.server1 .server-name::after,
.slide9-info.server2 .server-name::after {
	content: "";
	background: url("/img/event/20260128/section03/icon_winner.png") no-repeat;
	width: 100px;
	height: 80px;
	position: absolute;
    right: -55px;
}

.war-blue-title,
.war-red-title {
	background: url("/img/event/20260128/section03/warTitleBling.webp?v1.0.1") no-repeat center bottom;
	mix-blend-mode: screen;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	position: absolute;
    top: -10%;
}

.war-blue-icon {
	background: url("/img/event/20260128/section03/warBlueIconBling.webp?v1.0.1") no-repeat center;
	width: 523px;
	height: 447px;
}

.war-red-icon {
	background: url("/img/event/20260128/section03/warRedIconBling.webp?v1.0.1") no-repeat center;
	width: 523px;
	height: 447px;
}

.slide9 .digit {
	align-items: center;
	justify-content: center;
	scale: 0.8;
	font-size: 1.5em;
}

.slide9 .digit::after {
	content: "";
	background: url("/img/event/20260128/section03/light.png") no-repeat center bottom;
	background-size: contain;
	width: 1280px;
	height: 90px;
	position: absolute;
	bottom: -40px;
}

/* Slide 10 */
.slide10 {
	background: url("/img/event/20260128/bg05_blue_m.jpg") no-repeat center;
	max-width: 810px;
	width: 100%;
	height: 1254px;
}

.slide10-info {
	display: flex;
	justify-content: center;
	flex-direction: column;
	position: relative;
	align-items: center;
	height: 100%;
	width: 100%;
}

.slide10 .digit {
	scale: 0.5;
	display: flex;
	align-items: center;
	justify-content: center;
}

.slide10 .digit::after {
	content: "";
	background: url("/img/event/20260128/section03/light.png") no-repeat center bottom;
	background-size: contain;
	width: 1280px;
	height: 90px;
	position: absolute;
	bottom: -25px;
}

.slide10-title {
	background: url("/img/event/20260128/section03/title07_m.png") no-repeat center;
	width: 480px;
	height: 200px;
	position: relative;
	top: 0;
}

.slide10.server1 .server-name {
	background: url("/img/event/20260128/section03/server_name01.png") no-repeat;
	width: 400px;
	height: 160px;
	top: -145px;
	scale: 0.4;
}

.slide10.server2 .server-name {
	background: url("/img/event/20260128/section03/server_name02.png") no-repeat;
	width: 400px;
	height: 160px;
	top: 75px;
	scale: 0.4;
}

.slide10 .server-name::after {
	display: none;
}

.slide10 .slide-content,
.slide11 .slide-content {
	position: relative;
}

.war-blue,
.war-red {
	display: flex;
	flex-direction: column;
	align-items: center;
	position: relative;
}

.slide11.server1 .war-red-title::before,
.slide11.server2 .war-red-title::before {
	content: "";
	background: url("/img/event/20260128/section03/icon_winner.png") no-repeat center;
	width: 100px;
	height: 80px;
	position: absolute;
	left: -30px;
    top: -10px;
	transform: rotate(-15deg);
	scale: 0.6;
}


/* Slide 11 */
.slide11 {
	background: url("/img/event/20260128/bg05_red_m.jpg") no-repeat center;
	max-width: 810px;
	width: 100%;
	height: 1254px;
	position: relative;
	top: 0;
}

.slide11-info {
	display: flex;
	justify-content: center;
	flex-direction: column;
	position: relative;
	align-items: center;
	height: 100%;
	width: 100%;
}

.slide11 .digit {
	scale: 0.5;
	display: flex;
	align-items: center;
	justify-content: center;
}

.slide11 .digit::after {
	content: "";
	background: url("/img/event/20260128/section03/light.png") no-repeat center bottom;
	background-size: contain;
	width: 1280px;
	height: 90px;
	position: absolute;
	bottom: -25px;
}

.slide11-title {
	background: url("/img/event/20260128/section03/title07_m.png") no-repeat center;
	width: 480px;
	height: 200px;
	position: relative;
	top: 0;
}

.slide11.server1 .server-name {
	background: url("/img/event/20260128/section03/server_name01.png") no-repeat;
	width: 400px;
	height: 160px;
	top: -145px;
	scale: 0.4;
}

.slide11.server2 .server-name {
	background: url("/img/event/20260128/section03/server_name02.png") no-repeat;
	width: 400px;
	height: 160px;
	top: 75px;
	scale: 0.4;
}

/* Slide 12 */
.slide12 {
	background: url("/img/event/20260128/bg06.jpg") no-repeat center;
}

.slide12 .char {
	background: url("/img/event/20260128/share/char.png") no-repeat center;
	background-size: 93%;
	max-width: 1271px;
    width: 100%;
    height: 1024px;
    position: absolute;
    right: 0;
}

.slide12-info {
	background: url("/img/event/20260128/share/content_bg.png") no-repeat center;
    background-size: 90%;
    width: 1280px;
    height: 620px;
	display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
	z-index: 2;
    position: absolute;
    left: 30px;
    bottom: 80px;
}

.slide12-title {
	background: url("/img/event/20260128/share/title.png") no-repeat center;
	width: 520px;
	height: 100px;
	z-index: 3;
    position: absolute;
    left: 400px;
    top: 175px;
}

.slide12 .slide-content {
	width: 100%;
    height: 55%;
    justify-content: space-evenly;
    position: absolute;
    top: 90px;
    font-size: 30px;
    letter-spacing: 1px;
	text-align: center;
}

.slide12 .sub-title {
	background: url("/img/event/20260128/share/subtitle02.png") no-repeat center;
	width: 380px;
	height: 60px;
}

.slide12 .serial-number {
	font-size: 48px;
    margin: 15px 0;
    font-weight: bold;
}

.slide12-btns {
	width: 60%;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
	position: absolute;
    bottom: 140px;
	opacity: 0;
}

/* Slide 13 */
.slide13 {
	background: url("/img/event/20260128/section04/bg01.jpg") no-repeat center top;
}

.slide13-title {
	background: url("/img/event/20260128/section04/title01.png") no-repeat center;
	background-size: contain;
	max-width: 540px;
	width: 100%;
	height: 140px;
	position: absolute;
	top: 15px;
}

.slide13.server1 .server-name, 
.slide13.server2 .server-name {
    position: absolute;
    top: 100px;
	scale: 0.4;
}

.slide13-info {
	position: absolute;
    top: 190px;
}

.slide13-info .ranking-top3 {
	display: flex;
	align-items: flex-end;
	justify-content: space-evenly;
	width: 100%;
	position: relative;
	scale: 0.9;
}

.slide13-info .ranking-top3 span {
	font-size: 24px;
}

.gold {
	background: url("/img/event/20260128/section04/gold.png") no-repeat center;
	width: 380px;
	height: 491px;
}
.gold::before {
	content: "";
	display: block;
	background: url("/img/event/20260128/section04/gold_back.png") no-repeat center;
	width: 380px;
	height: 491px;
	position: absolute;
	z-index: -1;
}

.silver {
	background: url("/img/event/20260128/section04/silver.png") no-repeat;
	width: 287px;
	height: 410px;
}
.silver::before {
	content: "";
	display: block;
	background: url("/img/event/20260128/section04/silver_back.png") no-repeat center;
	width: 287px;
	height: 410px;
	position: absolute;
	z-index: -1;
}

.bronze {
	background: url("/img/event/20260128/section04/bronze.png") no-repeat;
	width: 287px;
	height: 410px;
}
.bronze::before {
	content: "";
	display: block;
	background: url("/img/event/20260128/section04/bronze_back.png") no-repeat center;
	width: 287px;
	height: 410px;
	position: absolute;
	z-index: -1;
}

.gold,
.silver,
.bronze {
	position: relative;
	display: flex;
    justify-content: center;
}

.gold-score,
.silver-score,
.bronze-score {
    text-align: center;
    position: absolute;
	font-size: 18px;
	letter-spacing: 0.5px;
}

.gold-score {
	bottom: 57px;
}

.silver-score {
	bottom: 60px;
}

.bronze-score {
	bottom: 60px;
}

.player-name1,
.player-name2,
.player-name3 {
	position: absolute;
    text-align: center;
	width: auto;
    bottom: 0;
    font-size: 20px;
    padding: 8px 23px;
	border-radius: 30px;
}

.player-name1 {
	background-color: #3c609a;
}

.player-name2 {
	background-color: #4171cb;
}

.player-name3 {
	background-color: #375d9d;
}

.slide13 .ranking {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2px;
    max-width: 1400px;
	width: 80%;
    margin: 20px auto;
	text-align: center;
	scale: 0.9;
}

.slide13 .ranking-item {
    display: flex;
    align-items: center;
    gap: 2px;
    background: url("/img/event/20260128/section04/result_bg.png?v1.0.1") no-repeat center;
    width: 220px;
	height: 100px;
    border-radius: 10px;
	font-size: 18px;
}

.slide13 .ranking-item:nth-child(-n+7) {
    flex: 0 0 calc(20%);
}

.slide13 .rank-number {
    font-size: 32px;
    font-weight: bold;
    color: #ffd700;
    min-width: 40px;
    text-align: center;
}

.slide13 .player-info,
.slide14 .player-info,
.slide15 .player-info {
    flex: 1;
	font-size: 22px;
}

.slide13 .player-score {
	text-align: left;
    padding: 0 30px 10px;
	text-align: center;
}

/* Slide 14 */
.slide14 {
	background: url("/img/event/20260128/section04/bg02.jpg") no-repeat center top;
}

.slide14-title {
	background: url("/img/event/20260128/section04/title02.png") no-repeat center;
	background-size: contain;
	max-width: 540px;
	width: 100%;
	height: 140px;
	position: absolute;
	top: 15px;
}

.slide14 .slide-content {
	background: url("/img/event/20260128/section04/content_bg02.png") no-repeat center;
	background-size: 100%;
    width: 1220px;
    height: 780px;
    position: relative;
    top: 100px;
	color: #1486b7;
}

.slide14.server1 .server-name, 
.slide14.server2 .server-name {
    position: absolute;
    top: 100px;
	scale: 0.4;
}

.slide14 .ranking {
	display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 12px 0;
    max-width: 1400px;
    width: 67%;
    margin: 10px auto;
    text-align: center;
    position: absolute;
    bottom: 90px;
    left: 140px;
}

.slide14 .ranking-item {
	flex: 0 0 calc(25% - 20px);
    max-width: calc(25% - 20px);
}

/* 上排 3 個 */
.slide14 .ranking-item:nth-child(1),
.slide14 .ranking-item:nth-child(2),
.slide14 .ranking-item:nth-child(3) {
	flex: 0 0 calc(25.01%);
    max-width: calc(25.01%);
	font-size: 20px;
}

/* 下排 4 個 */
.slide14 .ranking-item:nth-child(4),
.slide14 .ranking-item:nth-child(5),
.slide14 .ranking-item:nth-child(6),
.slide14 .ranking-item:nth-child(7) {
    flex: 0 0 calc(25%);
    max-width: calc(25%);
	font-size: 20px;
}

.slide14 .ranking-top3 {
	position: absolute;
    bottom: 240px;
    display: flex;
    width: 77%;
    justify-content: flex-start;
    font-size: 30px;
    font-weight: bold;
}

.slide14 .ranking-top3 span {
	font-size: 24px;
	margin-left: 10px;
}

.slide14 .rank {
	border: 2px solid #1486b7;
    padding: 15px 25px;
    border-radius: 30px;
	margin: 0 10px 0 0;
	display: flex;
    align-items: center;
}

.slide14 .ranking-item span {
	margin-left: 5px;
}

.slide14 .rank1,
.slide14 .rank2,
.slide14 .rank3 {
	flex: 0 0 calc(24%);
	position: relative;
}

.slide14 .rank1::before {
	content: "";
	display: block;
	background: url("/img/event/20260128/section04/icon_gold.png") no-repeat;
	width: 70px;
	height: 45px;
	position: absolute;
    top: -35px;
    left: 0;
}

.slide14 .rank2::before {
	content: "";
	display: block;
	background: url("/img/event/20260128/section04/icon_silver.png") no-repeat;
	width: 70px;
	height: 45px;
	position: absolute;
	top: -35px;
    left: -3px;
}

.slide14 .rank3::before {
	content: "";
	display: block;
	background: url("/img/event/20260128/section04/icon_bronze.png") no-repeat;
	width: 70px;
	height: 45px;
    position: absolute;
    top: -35px;
    left: 0;
}

/* Slide 15 */
.slide15 {
	background: url("/img/event/20260128/section04/bg03.jpg") no-repeat center top;
}

.slide15-title {
	background: url("/img/event/20260128/section04/title03.png") no-repeat center;
	background-size: contain;
	max-width: 540px;
	width: 100%;
	height: 140px;
	position: absolute;
	top: 15px;
}

.slide15.server1 .server-name, 
.slide15.server2 .server-name {
    position: absolute;
    top: 100px;
	scale: 0.4;
}

.slide15-info {
	width: 100%;
    height: 100%;
    position: relative;
	display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.slide15 .slide-content {
	position: absolute;
    bottom: 100px;
}

.slide13 .player-name,
.slide15 .player-name {
	color: #9ce8ff;
	font-size: 23px;
}

.time {
	background: linear-gradient(-181deg, #fff 45%, #dde3ff 85%, #7e828e, #9498a8 100%);
	color: transparent;
	-webkit-background-clip: text;
	background-clip: text;
	filter: drop-shadow(1px 2px 3px #000);
}

.slide15 .ranking {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2px;
    max-width: 1400px;
	width: 77%;
    margin: 20px auto;
	text-align: center;
}

.slide15 .ranking-item {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    gap: 2px;
    background: url("/img/event/20260128/section04/result_bg.png?v1.0.1") no-repeat center;
    width: 220px;
    height: 100px;
    border-radius: 10px;
    font-size: 20px;
}

.slide15 .rank-group {
	display: flex;
    justify-content: space-evenly;
	margin-top: 10px;
}

.slide15 .rank1,
.slide15 .rank2,
.slide15 .rank3 {
	position: relative;
}

.slide15 .rank1::before {
	content: "";
	display: block;
	background: url("/img/event/20260128/section04/icon_gold.png") no-repeat;
	width: 70px;
	height: 45px;
	position: absolute;
    top: -30px;
}

.slide15 .rank2::before {
	content: "";
	display: block;
	background: url("/img/event/20260128/section04/icon_silver.png") no-repeat;
	width: 70px;
	height: 45px;
	position: absolute;
    top: -30px;
}

.slide15 .rank3::before {
	content: "";
	display: block;
	background: url("/img/event/20260128/section04/icon_bronze.png") no-repeat;
	width: 70px;
	height: 45px;
	position: absolute;
    top: -30px;
}

/* Slide 16 */
.slide16 {
	background: url("/img/event/20260128/bg06.jpg") no-repeat center;
}

.slide16 .char {
	background: url("/img/event/20260128/share/char.png") no-repeat center;
	background-size: 93%;
	max-width: 1271px;
    width: 100%;
    height: 1024px;
    position: absolute;
    right: 0;
}

.slide16-info {
	background: url("/img/event/20260128/share/content_bg.png") no-repeat center;
    background-size: 90%;
    width: 1280px;
    height: 620px;
	display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
	z-index: 2;
    position: absolute;
    left: 30px;
    bottom: 80px;
}

.slide16-title {
	background: url("/img/event/20260128/share/title.png") no-repeat center;
	width: 520px;
	height: 100px;
	z-index: 3;
    position: absolute;
    left: 400px;
    top: 175px;
}

.slide16 .slide-content {
	width: 100%;
    height: 55%;
    justify-content: space-evenly;
    position: absolute;
    top: 90px;
    font-size: 30px;
    letter-spacing: 1px;
	text-align: center;
}

.slide16 .sub-title {
	background: url("/img/event/20260128/share/subtitle01.png") no-repeat center;
	width: 380px;
	height: 60px;
}

.slide16 .serial-number {
	font-size: 48px;
    margin: 15px 0;
    font-weight: bold;
}

.slide16-btns {
	width: 60%;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
	position: absolute;
    bottom: 140px;
	opacity: 0;
}

.text-gray {
	font-size: 0.65em;
	color: #838486;
}

.number {
	width: 120px;
	height: 205px;
	opacity: 0;
    transform: translateY(50px);
    animation: fade-in-bottom 0.5s ease-in-out forwards;
	background-size: contain;
}

.num0 {
	background: url("/img/event/20260128/section03/num0.png?v1.0.4") no-repeat;
}
.num1 {
	background: url("/img/event/20260128/section03/num1.png?v1.0.4") no-repeat;
}
.num2 {
	background: url("/img/event/20260128/section03/num2.png?v1.0.4") no-repeat;
}
.num3 {
	background: url("/img/event/20260128/section03/num3.png?v1.0.4") no-repeat;
}
.num4 {
	background: url("/img/event/20260128/section03/num4.png?v1.0.4") no-repeat;
}
.num5 {
	background: url("/img/event/20260128/section03/num5.png?v1.0.4") no-repeat;
}
.num6 {
	background: url("/img/event/20260128/section03/num6.png?v1.0.4") no-repeat;
}
.num7 {
	background: url("/img/event/20260128/section03/num7.png?v1.0.4") no-repeat;
}
.num8 {
	background: url("/img/event/20260128/section03/num8.png?v1.0.4") no-repeat;
}
.num9 {
	background: url("/img/event/20260128/section03/num9.png?v1.0.4") no-repeat;
}

.digit {
    display: flex;
    justify-content: center;
    align-items: center;
	height: 205px;
}

.digit-item {
    width: 140px;
    height: 205px;
    overflow: hidden;
    position: relative;
}

.digit-item ul {
    list-style: none;
    padding: 0;
    margin: 0;
    transition: margin-top 1s ease-in-out;
}

.digit-item ul li {
    height: 205px;
    line-height: 205px;
    text-align: center;
    background-size: contain;
}

/* Navigation */
.homepage-btn {
	position: absolute;
	bottom: 30px;
	right: 40px;
	z-index: 3;
	display: none;
}
.homepage {
	background: url("/img/event/20260128/section03/btn_home.png?v1.0.1") no-repeat center;
	width: 130px;
	height: 130px;
}
.homepage:hover {
	background: url("/img/event/20260128/section03/btn_home_on.png?v1.0.1") no-repeat center;
}

.navigation-btns {
	width: 100%;
	height: 57px;
	justify-content: center;
	position: absolute;
	bottom: 40px;
	z-index: 2;
	display: none;
}

.navigation-btns-2 {
	width: 100%;
	height: 55px;
	justify-content: space-between;
	position: absolute;
	z-index: 4;
	top: 45%;
	opacity: 0.9;
	display: none;
}

.navigation-btns.visible {
	display: flex;
}

#swiper1 .slide-next,
#swiper1 .slide-prev {
	cursor: pointer;
	z-index: 2;
	margin: 0 270px;
}

#swiper1 .navigation-btns .slide-next {
	background: url("/img/event/20260128/section03/btn_next.png") no-repeat center;
	width: 183px;
	height: 57px;
}
#swiper1 .navigation-btns .slide-prev {
	background: url("/img/event/20260128/section03/btn_prev.png") no-repeat center;
	width: 183px;
	height: 57px;
}
#swiper1 .navigation-btns .slide-next:hover {
	background: url("/img/event/20260128/section03/btn_next_on.png") no-repeat center;
}
#swiper1 .navigation-btns .slide-prev:hover {
	background: url("/img/event/20260128/section03/btn_prev_on.png") no-repeat center;
}

#swiper1 .navigation-btns-2 .slide-prev {
    background: url('/img/event/20260128/section04/prev.png') no-repeat center;
	width: 50px;
	height: 50px;
	opacity: 0.8;
}
#swiper1 .navigation-btns-2 .slide-next {
    background: url('/img/event/20260128/section04/next.png') no-repeat center;
	width: 50px;
	height: 50px;
	opacity: 0.8;
}

/* Footer */
.footer-wrapper {
	position: relative;
	color: #fff;
	font-size: 12px;
	text-align: center;
	letter-spacing: 0.2px;
	line-height: 18px;
	background: #212121;
	width: 100%;
	height: 150px;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 1;
}
.footerbox {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-evenly;
	width: 100%;
	max-width: 1920px;
	overflow: hidden;
	padding: 0 160px;
}
.footer-logos {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 530px;
}
.footer-dg {
	background: url("/img/event/20260128/footer/logo_digeam.png") no-repeat;
	width: 251px;
	height: 60px;
}
.footer-est {
	background: url("/img/event/20260128/footer/est.png") no-repeat;
	width: 238px;
	height: 28px;
}
.copyright {
	text-align: left;
	width: 470px;
}
.copyright a {
	color: rgba(42, 188, 214, 1);
	margin-right: 10px;
	text-decoration: underline;
}
.copyright a:hover {
	color: rgb(31, 155, 177);
}
.grade {
	max-width: 440px;
	display: flex;
	align-items: center;
	justify-content: space-around;
}
.grade-icon {
	background: url("/img/event/20260128/footer/icon_15.png") no-repeat;
	width: 71px;
	height: 71px;
}
.grade ul {
	text-align: left;
	margin-left: 10px;
	list-style: none;
}
.grade li:nth-child(4) {
	color: rgba(42, 188, 214, 1);
}
.grade img {
	width: 50px;
	height: 50px;
}

/* Popup */
.mask {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.8);
	z-index: 999;
	position: fixed;
	display: none;
}
.pop {
	background: url("/img/event/20260128/pop_bg.png") no-repeat;
	background-size: contain;
	max-width: 610px;
	width: 100%;
	height: 330px;
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 1000;
	color: #fff;
}

.pop .pop-content {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	flex-direction: column;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.5;
}

.pop .close {
	background: url("/img/event/20260128/close.png") no-repeat;
	width: 30px;
	height: 30px;
	position: absolute;
	top: 15px;
	right: 15px;
	cursor: pointer;
}

.pop.pop-share {
	max-width: 800px;
    height: 600px;
	background: #fff;
    color: #212121;
	border-radius: 10px;
}

.pop.pop-share .close {
	filter: brightness(0);
}

.pop .share-thumbnail {
    width: 100%;
    height: auto;
    margin-bottom: 15px;
    border-radius: 8px;
}

.pop .share-buttons {
	width: 100%;
    display: flex;
    justify-content: space-evenly;
	font-size: 14px;
	position: relative;
    bottom: 0;
}

.pop.pop-share .pop-content {
	justify-content: space-evenly;
}

.pop.pop-share .share-container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.pop .share-btn {
	background-size: contain;
	width: 48px;
	height: 48px;
    font-size: 12px;
}

.copy-link {
	background: url("/img/event/20260128/share/icons8-share-link-48.png") no-repeat center;
}

.fb-share {
	background: url("/img/event/20260128/share/icons8-facebook-48.png") no-repeat center;
}

.x-share {
	background: url("/img/event/20260128/share/icons8-x-48.png") no-repeat center;
}

.line-share {
	background: url("/img/event/20260128/share/icons8-line-48.png") no-repeat center;
}

.threads-share {
	background: url("/img/event/20260128/share/icons8-threads-50.png") no-repeat center;
}

.share-img {
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	max-width: 1200px;
    width: 75%;
	height: 100%;
	pointer-events: none;
	overflow: hidden;
}

.fans-btn,
.continue,
.slide12-download,
.slide12-share,
.slide12-exchange,
.slide16-download,
.slide16-exchange,
.slide16-share {
	width: 150px;
	height: 30px;
	background: linear-gradient(to bottom, #3dd4ff, #1471c8);
	color: #fff;
	border: none;
	border-radius: 25px;
	padding: 10px 20px;
	margin-top: 20px;
	font-weight: bold;
	z-index: 4;
}

.share-dropdown {
	display: none;
    position: absolute;
    top: 100%;
    right: 55px;
    background: #0a0e11;
    border-radius: 4px;
    z-index: 1000;
    padding: 10px 0;
    width: 170px;
	opacity: 0.9;
}

.share-dropdown .dropdown-item {
    display: block;
    width: 100%;
    padding: 10px 15px;
    text-align: center;
    background: none;
    border: none;
    font-size: 16px;
    color: #fff;
    cursor: pointer;
}

.share-dropdown .dropdown-item:hover {
	color: #0a0e11;
    background: rgb(236, 236, 236);
}

.continue {
	position: absolute;
	bottom: 100px;
	font-size: 26px;
	width: 220px;
	height: 60px;
	opacity: 0;
	transform: translateY(20px);
}

.slide12-download,
.slide12-exchange,
.slide12-share,
.slide16-download,
.slide16-exchange,
.slide16-share {
	width: 200px;
    height: 45px;
	font-size: 20px;
}

.continue.fade-in-bottom {
	animation: fade-in-bottom 0.5s ease-in-out forwards;
	animation-delay: 1.5s;
}

.fans-btn:hover,
.continue:hover,
.slide12-download:hover,
.slide12-exchange:hover,
.slide12-share:hover,
.slide16-download:hover,
.slide16-exchange:hover,
.slide16-share:hover {
	background: linear-gradient(to bottom, #a076c7, #a076c7);
}

/*---- Scrollbar ----*/
::-webkit-scrollbar {
	width: 0px;
}

/* Animation */
@keyframes fade-in-bottom {
	0% {
		transform: translateY(50px);
		opacity: 0;
	}
	100% {
		transform: translateY(0);
		opacity: 1;
	}
}

@keyframes fade-in-top {
	0% {
		-webkit-transform: translateY(-50px);
		transform: translateY(-50px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
	}
}
