body {overflow-x: hidden;margin: 0;scroll-behavior: smooth;font-family: "PingFang SC", "Helvetica Neue", Helvetica, Arial, sans-serif;overflow-x: hidden;background: #f7f7f7;background-position: center;background-repeat: no-repeat;background-size: cover;}
html { scroll-behavior: smooth;overflow-x: hidden;}

* { box-sizing: border-box; }

.container{max-width: 1200px;width: 100%;margin: 0 auto;padding: 0;position: relative;}
a {text-decoration: none;}
p, h1, h2, h3, h4{margin: 0;}

ul, li{padding: 0;margin: 0;}
li{list-style: none;}

.hidden{display: none!important;}

header{background-color: #FFFFFF;height: 96px;box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.04);}
header .container{height: 100%;}
header .headerWrap{display: flex;align-items: center;justify-content: space-between;height: 100%;}
header .headerWrap .logoWrap{width: 167px;height: 50px;flex: 0 0 167px;max-width: 167px;}
header .headerWrap .logoWrap img{height: 100%;width: auto;object-fit: cover;object-position: center;}
header .headerWrap .nav-bar{display: flex;align-items: center;column-gap: 68px;}
header .headerWrap .nav-bar a{position: relative;font-size: 18px;color: #4D4D4D;}
header .headerWrap .nav-bar a.active{font-size: 22px;color: #140402;font-weight: bold;margin-top: -4px;}
header .headerWrap .nav-bar a.active::after{content: "";position: absolute;left: 50%;bottom: -6px;transform: translateX(-50%);width: 30px;height: 4px;border-radius: 2px;background: linear-gradient(0deg, #ff763d 0%, #ff543d 100%);}
header .headerWrap .search-wrap{width: 200px;flex: 0 0 200px;max-width: 200px;height: 48px;display: flex;align-items: center;column-gap: 8px;border-radius: 24px;background-color: #f7f7f7;padding: 0 18px;}
header .headerWrap .search-wrap img{width: 19px;height: 19px;object-fit: cover;object-position: center;flex: 0 0 19px;max-width: 19px;margin-top: -4px;}
header .headerWrap .search-wrap input{width: 100%;height: 24px;flex: 1;flex-shrink: 0;background: transparent;border: none;outline: none;font-size: 16px;}

footer{display: flex;flex-direction: column;}
footer .footerTopWrap{background:#262D36;padding: 30px 0 24px;margin-top: 40px;}
footer .footerTopWrap .container{display: flex;align-items: flex-start;justify-content: space-between;}
footer .footerTopWrap .logoWrap{width: 180px;height: 65px;}
footer .footerTopWrap .logoWrap img{height: 100%;width: auto;object-fit: contain;object-position: center;}
footer .footerTopWrap .footer-link-wrap{display: flex;align-items: flex-start;column-gap: 130px;}
footer .footerTopWrap .footer-link-wrap .footer-link-column{display: flex;flex-direction: column;row-gap: 12px;}
footer .footerTopWrap .footer-link-wrap .footer-link-column .link-title{font-size: 18px;font-weight: bold;color: #ffffff;position: relative;padding-bottom: 2px;}
footer .footerTopWrap .footer-link-wrap .footer-link-column .link-title::after{content: "";position: absolute;bottom: 0;left: 0;width: 100%;height: 2px;background-color: #9F9F9F;}
footer .footerTopWrap .footer-link-wrap .footer-link-column .link-list{display: flex;flex-direction: column;row-gap: 10px;}
footer .footerTopWrap .footer-link-wrap .footer-link-column .link-list a{position: relative;padding-left: 14px;font-size: 14px;color:#ffffff;line-height: 20px;}
footer .footerTopWrap .footer-link-wrap .footer-link-column .link-list a::before{content: "";position: absolute;top: 50%;transform: translateY(-50%);left: 0;width: 4px;height: 4px;border-radius: 50%;background-color: #9F9F9F;}
footer .footerBottomWrap{background-color: #1B1B1B;padding: 20px 0;}
footer .footerBottomWrap .container{height: 100%;}
footer .footerBottomWrap .footerWrap{display: flex;flex-direction: column;row-gap: 24px;justify-content: center;height: 100%;align-items: center;}
footer .footerBottomWrap .footerWrap p{font-size: 14px;color: #999999;}
footer .footerBottomWrap .footerWrap img{width: 370px;height: 40px;object-fit: cover;object-position: center;}

.titleWrap{position: relative;display: flex;flex-direction: column;row-gap: 4px;padding-left: 70px;}
.titleWrap h2{font-size: 24px;font-weight: bold;color: #140402;white-space: nowrap;}
.titleWrap > p{font-size: 14px;color: #999999;white-space: nowrap;}
.titleWrap::before{content: "";position: absolute;left: 0;top: 50%;transform: translateY(-50%);background-position: center;background-repeat: no-repeat;background-size: cover;}

.breadcrumb{margin: 20px 0;}
.breadcrumb .container{display: flex;align-items: center;column-gap: 15px;position: relative;padding-left: 20px;}
.breadcrumb .container::before{content: "";position: absolute;left: 0;top: 50%;transform: translateY(-50%);width: 14px;height: 14px;background-image: url(../images/homeIcon.webp);background-position: center;background-repeat: no-repeat;background-size: cover;}
.breadcrumb a{font-size: 14px;color: #999999;white-space: nowrap;line-height: 24px;}
.breadcrumb p.current{font-size: 14px;color: #140402;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-weight: bold;padding-bottom: 4px;position: relative;margin-top: 2px;}
.breadcrumb p.current::after{content: "";position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);width: 60%;height: 2px;border-radius: 1px;background-color: #FF553E;}
.breadcrumb i{width: 1px;height: 14px;background-color: #999999;transform: rotate(25deg);}

.pagination{display: flex;align-items: center;column-gap: 10px;justify-content: center;margin-top: 28px;}
.pagination a{width: fit-content;height: 36px;line-height: 36px;padding: 0 15px;background: #ffffff;border-radius: 6px;text-align: center;font-size: 14px;color: #949799;}
.pagination span{font-size: 14px;color: #949799;margin-top: -10px;padding: 0 10px;}
.pagination a.prev-page, .pagination a.next-page{font-family: cursive;font-weight: bold;}
.pagination a.active{font-weight: bold;color: #ffffff;background: linear-gradient(0deg, #ff763d 0%, #ff543d 100%);}

.error-page .error-wrap{display: flex;flex-direction: column;align-items: center;}
.error-page .error-wrap > img{width: 800px;height: auto;object-fit: cover;object-position: center;margin-bottom: 20px;}
.error-page .error-wrap > p{font-size: 32px;color: #000000;text-align: center;font-weight: 500;margin-bottom: 15px;}
.error-page .error-wrap > span.reminder{font-size: 20px;color: #b1afb1;text-align: center;margin-bottom: 15px;}
.error-page .error-wrap > span#time{font-size: 18px;color: #333333;text-align: center;}
.error-page .error-wrap .buttonWrap{display: flex;align-items: center;justify-content: center;column-gap: 30px;margin-top: 30px;}
.error-page .error-wrap .buttonWrap a{width: 180px;height: 48px;border-radius: 100px;text-align: center;line-height: 46px;box-sizing: border-box;background: transparent;font-size: 20px;color: #000000;border: 2px solid #e8e8e8;}
.error-page .error-wrap .buttonWrap a.backHomeBtn{background: #fe5e39;border: 2px solid #fe5e39;color: #ffffff;}
.error-page .error-wrap .buttonWrap a.backHomeBtn span{position: relative;padding-left: 25px;}
.error-page .error-wrap .buttonWrap a.backHomeBtn span::before{content: "";position: absolute;top: 50%;transform: translateY(-50%);left: 0;width: 20px;height: 20px;background-image: url(../images/backHomeIcon.png);background-position: center;background-repeat: no-repeat;background-size: cover;filter: brightness(0) saturate(100%) invert(95%) sepia(95%) saturate(22%) hue-rotate(322deg) brightness(105%) contrast(105%);}
.error-page .bottom-menu{margin-top: 40px;display: flex;align-items: center;justify-content: center;flex-direction: column;row-gap: 20px;}
.error-page .bottom-menu > p {position: relative;padding: 0 40px;text-align: center;font-size: 28px;color: #000000;width: fit-content;margin: 0 auto;}
.error-page .bottom-menu > p::before{content: "";position: absolute;top: 52%;left: 0;transform: translateY(-50%);width: 24px;height: 24px;background-image: url(../images/titleSideIcon.png);background-position: center;background-repeat: no-repeat;background-size: cover;}
.error-page .bottom-menu > p::after{content: "";position: absolute;top: 48%;right: 0;transform: translateY(-50%) scaleY(-1) scaleX(-1);width: 24px;height: 24px;background-image: url(../images/titleSideIcon.png);background-position: center;background-repeat: no-repeat;background-size: cover;}
.error-page .bottom-menu .bottom-menu-list{display: flex;align-items: center;column-gap: 30px;}
.error-page .bottom-menu .bottom-menu-list a {width: 180px; height: 48px; border-radius: 8px; text-align: center; line-height: 46px; box-sizing: border-box; background: transparent; font-size: 20px; color: #000000; border: 2px solid #e8e8e8;}
.error-page .bottom-menu .bottom-menu-list a span{position: relative;padding-left: 25px;}
.error-page .bottom-menu .bottom-menu-list a span::before{content: "";position: absolute;top: 50%;transform: translateY(-50%);width: 20px;height: 20px;background-position: center;background-repeat: no-repeat;background-size: cover;left: 0;}
.error-page .bottom-menu .bottom-menu-list a.gameNav span::before{background-image: url(../images/home/gameTitleIcon.webp);}
.error-page .bottom-menu .bottom-menu-list a.appNav span::before{background-image: url(../images/home/appTitleIcon.webp);}
.error-page .bottom-menu .bottom-menu-list a.topicNav span::before{background-image: url(../images/home/topicTitleIcon.webp);}
.error-page .bottom-menu .bottom-menu-list a.newsNav span::before{background-image: url(../images/home/newsTitleIcon.webp);}

.floating-bar {position:fixed; bottom:300px; left:50%; transform:translateX(-50%);z-index: 9999;}
.floating-bar .floatingWrap {z-index:9999; right:-140px; position:absolute;}
.floating-bar .floatingWrap #backToTop {display: flex;align-items: center;justify-content: center;width: 65px;height: 65px;border-radius: 50%;background-color: #ffffff;box-shadow: 0px 4px 4px 0px #00000040; cursor: pointer;transform: translateY(500px);transition: transform .3s ease;position: relative;}
.floating-bar .floatingWrap #backToTop.show{transform: translateY(0);}
.floating-bar .floatingWrap #backToTop::before {content:"";position:absolute;width: 15px; height: 15px; border-top: 3px solid #FF5A3D; border-right: 3px solid #FF5A3D; transform: rotate(-45deg) translate(-50%, -50%);top: 41%;left: 57%;}