*{
	padding:0;
	margin:0;
	/*box-sizing: border-box;*/
}
html,
body,
ul,
ol,
div {
    margin: 0;
    padding: 0;
	transform-origin: 0 0; /* 缩放基准点设为左上角 */
}

li {
    list-style: none;
}

a {
    text-decoration: none;
}

img {
    border: 0;
}

.app-container {
	background-color: #fff;/*#0e0e0e;*/
	display: flex;
	flex-direction: column;
	min-height: 100vh; 
}

/*header部分*/
.header-container {
  height:60px;
  width:100%;
  background-color: #ffffff;
  overflow-x: visible; /* 禁止隐藏溢出 */
}
.header-main{
	margin:0 auto;
    width:1280px;
    height: 100%;
	position: relative;
}

.header-logo{
	width:400px;
	float:left;
}
.header-navigate{
	width:130px;
	height:100%;
	display: flex;
	float:right;
	text-align: right;
	align-items: center; 
}
.header-navigate a{
	font-weight:400;
	color:#2aa0fe;
	font-size:18px;
	margin-left:20px;
	text-decoration: none;
}
.header-navigate a:hover{
	text-decoration: underline;
}

/**主要部分和顶部导航**/
.game-main {
	margin:0 auto;
	background-image: url("../images/main_backgroud.jpg");
	width:1920px;
	height:1033px;
}

.game-main-navigate-contaier{
	position: relative;
	width:1280px;
	height:300px;
	margin:0 auto;
}

.game-main-navigate{
	position: absolute;
	width:640px;
	heiht:300px;
	right:0px;
	top:0px;
	/*
	border:1px solid red;
	*/
}

.game-main-navigate ul{
	display: flex;
	flex-wrap: wrap; /* 允许换行 */
	gap: 15px;      /* 可选：设置图片间距 */
	padding: 0;     /* 清除默认内边距 */
	margin: 0;      /* 清除默认外边距 */
	list-style: none; /* 清除列表默认样式 */
	width: calc(6 * 100px + 5 * 15px); /* 4列宽度 + 3个间隙（如果设置了gap） */
	font-size:20px; /* 增大符号大小 */
}

.game-main-navigate ul li {
	  display: list-item; /* 默认值，显示为列表项 */
	  margin: 10px 15px;       /* 外边距 */
	  padding:0px;
}
.game-main-navigate a{
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
	text-decoration: none;
	font-size:22px;
	font-weight:600;
	color:#000000;
}
.game-main-navigate a:hover{
	color:#884d2f;
	text-decoration: underline;
}

.game-main-navigate .active{
	list-style-type: disc;
	color:#884d2f;
}
.game-main-navigate .active a{
	color:#884d2f;
}


.game-display{
	position: relative;
	background-color:transparent;
	width:1230px;
	height:450px;
	margin:0 auto;
	margin-top:430px;
}

.game-display-container{
	
}

.game-display-main{
	width:1230px;
	height:450px;
	margin-left:45px;
	display: flex;
	flex-direction: row; 
	gap: 3px; /* 子div间距 */
}

.game-display-download{
	background-image: url("../images/background_donwload.png");
	width:252px;
	height:445px; /* 填满父容器高度 */
}

.game-display-wechat{
	padding-top:0px;
	width:252px;
	text-align: center;
}
.game-display-wechat-title{
	margin-top:15px;
	padding-bottom:5px;
	font-weight:500;
	font-size:22px;
}


.game-display-wechat-image{
	margin-top:0px;
	width:192px;
	height:192px;
}

.game-display-download-button-list{
	width:252px;
	text-align: center;
	margin:0 auto;
	padding-top:10px;
}

.game-display-download-button-list img{
	width:195px;
	height:49px;
	margin-top:3px;
}

.game-display-scroll-news{
	width:465px;
	height:310px;
	/*border: 1px solid red;*/
}

.game-display-abs-news{
	background-image: url("../images/abs_news.png");
	width:418px;
	height:307px;
	/*border: 1px solid blue;*/
}

.abs-news-navigate{
	margin-top:10px;
	margin-left:35px;
	padding:2px 5px;
	display:flex;
	justify-content:space-between;
	gap: 10px;
	width:335px;
	height:60px;
	border-bottom:1px solid #541e16;
}
.abs-news-navigate-title{
	width:60px;
	height:60px;
	display: flex;
	justify-content: flex-end; /* 水平方向靠右 */
	align-items: flex-end;     /* 垂直方向靠下 */
}
.abs-news-navigate-title .link{
	font-size:28px;
	color:#5c3c25;
	font-weight:500;
	cursor: pointer;
	text-decoration: none;
}
.abs-news-navigate-title .link:hover{
	color:#000000;
}
.abs-news-navigate-title .link.active {
	color:#000000;
}
.abs-news-navigate-more{
	flex:1;
	width:60px;
	height:60px;
	display: flex;
	justify-content: flex-end; /* 水平方向靠右 */
	align-items: flex-end;     /* 垂直方向靠下 */
}
.abs-news-navigate-more .link-more{
	color:#000000;
	text-decoration: none;
	cursor: pointer;
	font-size:12px;
}

.abs-news-list{
	margin-top:10px;
	margin-left:35px;
	padding:2px 5px;
	width:335px;
	height:190px;
}
.abs-news-row{
	display: flex;
	justify-content:space-between;
	gap: 5px;
	margin:10px 0px;
}
.abs-news-date{
	text-align: right;
	width:50px;
	color:#000;
	font-size:16px;
}
.abs-news-title{
	flex:1;
	color:#000;
}
.abs-news-title a{
	font-size:16px;
	color:#000;
	text-decoration: none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.abs-news-title a:hover{
	text-decoration: underline;
}
.game-display-age-icon{
	flex:1;
	width:70px;
	height:100%
}
.game-display-age-icon img{
	width:70px;
	cursor: pointer;
}
.game-age-tips{
	background-image: url("../images/game_age_tips_background.png");
	width:682px;
	height:877px;
}

.game-display-intro{
	position: absolute;
	right: 20px;
	bottom:0;
	width: 900px;
	height:135px;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	gap: 10px; /* 子div间距 */
}


.game-display-intro1{
	background-image: url("../images/game_intro_1.jpg");
	background-repeat: no-repeat;
	width:202px;
	height:132px;
	margin-right:10px;
	cursor: pointer;
}
.game-display-intro1:hover{
	background-image: url("../images/game_intro_1_selected.jpg");
	background-repeat: no-repeat;
	width:202px;
	height:132px;
	margin-right:10px;
	cursor: pointer;
}
.game-display-intro2{
	background-image: url("../images/game_intro_2.jpg");
	width:202px;
	height:132px;
	margin-right:10px;
	cursor: pointer;
}
.game-display-intro2:hover{
	background-image: url("../images/game_intro_2_selected.jpg");
	width:202px;
	height:132px;
	margin-right:10px;
	cursor: pointer;
}
.game-display-intro3{
	background-image: url("../images/game_intro_3.jpg");
	width:202px;
	height:132px;
	margin-right:10px;
	cursor: pointer;
}
.game-display-intro3:hover{
	background-image: url("../images/game_intro_3_selected.jpg");
	width:202px;
	height:132px;
	margin-right:10px;
	cursor: pointer;
}
.game-display-intro4{
	background-image: url("../images/game_intro_4.jpg");
	width:202px;
	height:132px;
	margin-right:10px;
	cursor: pointer;
}
.game-display-intro4:hover{
	background-image: url("../images/game_intro_4_selected.jpg");
	width:202px;
	height:132px;
	margin-right:10px;
	cursor: pointer;
}

.game-role {
  margin:0 auto;
  width: 1920px;
  background-color:#3e281b;
}

.game-role-backgroud{
	margin:0 auto;
	margin-top:210px;
	background-image: url("../images/game-role-background.jpg");
	width:1920px;
	height:810px;
}

.game-role-container{
	/*border:1px solid gray;*/
	margin:0 auto;
	width:1280px;
	height:100%;
	position: relative;
}

.game-role-display {
	width:824px;
	height:700px;
}

.game-role-display img{
	margin-top:50px;
	width:824px;
	height:588px;
}

.game-role-list{
	padding-top:50px;
	width:520px;
	position: absolute;
	right:0;
	top:0;
	z-index: 1001;
}

.game-role-detail{
	padding:20px;
	height:100px;
	color:#d4bc96;
	font-size:14px;
	font-weight:bold;
	line-height:1.7;
	text-indent: 2em;
	letter-spacing: 0.1em;
	text-shadow: 
	-1px -1px 0 #000,
	1px -1px 0 #000,
	-1px 1px 0 #000,
	1px 1px 0 #000;
	
}

.game-role-select{
	margin-top:10px;
	margin-left:15px;
}
.game-role-select-ul {
  display: flex;
  flex-wrap: wrap; /* 允许换行 */
  gap: 20px;      /* 可选：设置图片间距 */
  padding: 0;     /* 清除默认内边距 */
  margin: 0;      /* 清除默认外边距 */
  list-style: none; /* 清除列表默认样式 */
  width: calc(4 * 104px + 3 * 20px); /* 4列宽度 + 3个间隙（如果设置了gap） */
}
.game-role-select-ul li{
	width:104px;
	height:104px;
	background-image: url("../images/role_mini_unselect.png");
	position: relative; /* 确保子元素定位基准 */
	display: flex; /* 让 img 居中 */
	justify-content: center;
	align-items: center;
	padding: 5px; /* 可选：给 li 一点内边距，防止 img 贴边 */
	box-sizing: border-box; /* 确保 padding 不影响 li 的总尺寸 */
}
.game-role-select-ul .active{
	width:104px;
	height:104px;
	background-image: url("../images/role_mini_selected.png");
}
.game-role-select-ul .active img{
	width:85px;
	height:85px;
	display: block;
	box-sizing: border-box; /* 确保 padding 不影响整体尺寸 */
	background-color: #f2540b;
	border-radius: 13px; /* 可选：给 img 背景色加圆角 */
	cursor: pointer;
}
.game-role-select-ul>li>img{
	width:86px;
	height:86px;
	display: block;
	box-sizing: border-box; /* 确保 padding 不影响整体尺寸 */
	background-color: #715b34;
	border-radius: 13px; /* 可选：给 img 背景色加圆角 */
	cursor: pointer;
}

.game-intro{
	margin:0 auto;
	background-image:url("../images/game_intro_backgroud.jpg");
	width:1920px;
	height:1440px;
}

.game-intro-main{
	margin:0 auto;
	width:1220px;
	height:280px;
	display: flex;
	justify-content: space-between;
	gap:10px
}

.game-intro-column{
  box-sizing: border-box; /* 确保 padding 和 border 不影响宽度计算 */
  background-image: url("../images/game_intro_title_background.jpg");
  width:395px;
  height:276px;
  cursor: pointer;
  color:#ae997b;
  font-size:26px;
  font-weight:500;
}

.game-intro-column:hover{
	color:#ff9400;
}

.game-intro-column.active{
	color:#ff9400;
}

.game-intro-img {
	margin-top:23px;
	margin-left:18px;
	width:362px;
	height:204px;
	border-radius: 12px;
}

.game-intro-navigate{
	margin:0 auto;
	width:1000px;
	height:160px;
	display: flex;
	justify-content: space-between;
	gap:10px;
}

.game-intro-navigate-column{
	margin-top:20px;
	width:260px;
	height:70px;
	border-left:1px solid #edd9b7;
	box-sizing: border-box; 
}
.game-intro-navigate-column ul{
	list-style: none;
	color:#ecd8b5;
}
.game-intro-navigate-column ul>li{
	padding:2px;
	margin-left:5px;
	height:40px;
}

.game-intro-navigate-column ul>li>a{
	color:#ecd8b5;
	text-decoration: none;
}
.game-intro-navigate-column ul>li>a:hover{
	color:#ecd8b5;
	text-decoration: underline;
}

.game-intro-navigate.hide{
	display:none;
}

.game-photo{
	margin:0 auto;
	width:1280px;
	height:720px;
}

.game-photo-title{
	margin:0 auto;
	width:564px;
	height:136px;
}

.game-photo-display{
	margin:0 auto;
	width:1280px;
	height:720px;
}

.game-photo-maps{
	width:1280px;
	height:550px;
	position: relative;
	/*border:1px solid red;*/
}

.game-photo-maps-left{
	position: absolute;
	top:13%;
	left:30px;
	width:605px;
	height:364px;
	z-index: 1001;
}
.game-photo-maps-right{
	position: absolute;
	right:30px;
	top:13%;
	width:605px;
	height:364px;
	z-index: 1001;
}
.swiper-photo-frame{
	background-image: url("../images/game_photo_column_background.png");
	background-repeat: no-repeat;
	background-size: contain;
	width:605px;
	height:364px;
}
.swiper-photo-frame img{
	margin-top:35px;
	margin-left:40px;
	width:525px;
	height:295px;
	border-radius: 10px;
}

.game-photo-maps-center{
	width:865px;
	height:519px;
	position: absolute;
	left: 17%;
	background-size: contain; /* 确保背景图正确显示 */
	background-repeat: no-repeat;
	z-index: 1003;
}
.swiper-photo-main-frame{
	background-image: url("../images/game_photo_column_background.png");
	background-repeat: no-repeat;
	background-size: contain;
	width:865px;
	height:519px;
}
.swiper-photo-main-frame img{
	margin-top:50px;
	margin-left:55px;
	width:753px;
	height:420px;
	border-radius: 10px;
}



.game-photo-list{
	width:1280px;
	height:720px;
	position: relative;
}

.game-photo-btn-left{
	background-image: url("../images/arrow_left.png");
	width:112px;
	height:105px;
	position: absolute;
	top:36%;
	left:30px;
	z-index:1005;
	cursor: pointer;
}
.game-photo-btn-left:hover{
	transform: translateY(-2px);
}
.game-photo-btn-right{
	background-image: url("../images/arrow_right.png");
	width:112px;
	height:105px;
	position: absolute;
	top:36%;
	right:30px;
	z-index:1005;
	cursor: pointer;
}
.game-photo-btn-right:hover{
	transform: translateY(-2px);
}

.game-photo-column{
	background-image: url("../images/game_photo_column_background.png");
	width:865px;
	height:519px;
	position: absolute;
	background-size: contain; /* 确保背景图正确显示 */
	background-repeat: no-repeat;
}
	
.float-left{
	left: 0px;
	top: 80px;
	transform: scale(0.7);
	transform-origin: 0 0;
	z-index: 1001;	
}

.float-right{
	right: 0px;
	top: 80px;
	transform: scale(0.7);
	transform-origin: 100% 0; /* 设置缩放基点 */
	z-index: 1002;
}
.float-center{
	left: 16%;
	transform: scale(1.0);
	z-index: 1003;
}

.float-left-image{
	margin-top:50px;
	margin-left:54px;
	border-radius: 10px;
	width:745px;
	height:420px;
}
.float-right-image{
	margin-top:50px;
	margin-left:62px;
	border-radius: 10px;
	width:745px;
	height:420px;
}

.float-center-image{
	margin-top:50px;
	margin-left:56px;
	width:750px;
	height:420px;
	border-radius: 10px;
}

.game-contact{
	margin: 0 auto;
	width:1280px;
	height:250px;
	display: flex;
	justify-content: space-between;
	gap:10px;
	background-image:transparent;
	/*border:1px solid red;*/
}
.game-contact-wechat {
  width: 240px;
  height: 240px;
}
 
.game-contact-detail {
	width: 280px; /* 固定宽度 */
	color:#baaf7e;
	padding:0px 20px;
}
.game-contact-detail .p1{
	border-bottom:1px solid #baaf7e;
	font-size:28px;
	font-weight:400;
	text-align: center;
	padding:10px;
}
.game-contact-detail .p2{
	font-size:28px;
	font-weight:400;
	text-align: center;
	padding:5px;
}
.game-contact-detail .p3{
	font-size:20px;
	font-weight:400;
	text-align: center;
	padding:5px;
}

.game-contact-phone {
	flex: 1; /* 自动填充剩余空间 */
	border:1px solid #baaf7e;
	border-radius: 20px;
	display: flex;
	justify-content: space-between;
	gap:10px;
	height:250px;
}

.game-contact-phone-left{
	width:280px;
	text-align: center;
	display: flex;
	justify-content: center; /* 水平居中（Flexbox 方式） */
	align-items: center;     /* 垂直居中 */
	color:#baaf7e;
	font-size:36px;
	font-weight:400;
}


.game-contact-phone-right{
	flex:1;
	
}

.game-contact-phone-right-detail{
	color:#baaf7e;
	font-size:32px;
	font-weight:400;
	margin:25px;
	height:200px;
	border-left: 1px solid #baaf7e;
	display: flex;
	flex-direction: column; /* 垂直排列子项 */
	justify-content: center; /* 垂直居中 */
	align-items: center;     /* 水平居中 */
}
.game-contact-phone-right-detail .row{
	display: flex;
	align-items: center; /* 水平 + 垂直居中（适用于行内元素） */
	margin: 5px 0; /* 可选：调整行间距 */
}

.game-contact-phone-right-detail .row a{
	margin-left: 5px; /* 可选：调整链接与文字的间距 */
	color:#5cc8f8;
}
.game-contact-phone-right-detail .row a:hover {
	color:#de6023;
}

.footer-container{
	margin:0 auto;
	background-color: #26130c;
	height:130px;
	width:1920px;
}


.footer-main{
	margin:0 auto;
	width:1280px;
	height:130px;
	display: flex;
	justify-content: space-between;
	gap:10px;
}

.footer-company{
	margin:20px 0;
	width:420px;
	height:100px;
	border-left:2px solid #ffffff;
}

.footer-company-link {
	padding:0px 20px;
	font-weight:600;
	font-size:14px;
	color:#ffffff;
}

.footer-company-link a{
	font-weight:600;
	font-size:14px;
	color:#ffffff;
	text-decoration: none;
}
.footer-company-link a:hover{
	text-decoration: underline;
}

.footer-company-link .row-link{
	margin-top:5px;
}
.footer-company-link .row-title{
	margin-top:15px;
}

.footer-copyright{
	flex:1;
	margin:20px 0;
	height:100px;
	border-left:2px solid #ffffff;
}

.footer-copyright-title{
	padding:0px 20px;
	font-size:14px;
	color:#ffffff;
	font-weight:600;
}
.footer-copyright-title .row-title{
	margin-top:5px;
}
.footer-copyright-title .row-title2{
	margin-top:15px;
}
.row-copyright{
	display: flex;
	justify-content: space-between;
	gap:10px;
	margin-top:15px;
}
.row-copyright-left{
	width:300px;

}
.row-copyright-right{
	flex:1;
}