﻿* {margin: 0; padding: 0; box-sizing: border-box;}
html, body {width: 100%; height: auto; min-width: 1280px;}
body {background-color: #171334;}
::-webkit-scrollbar {width: 5px;height: 5px;}
::-webkit-scrollbar-track {background: #051323;}
::-webkit-scrollbar-thumb {background: #771d26;}
/**首页样式**/
.page-bg {width: 100%; min-width: 1280px; height: 1080px; background: url("bg.jpg") no-repeat center top; position: absolute; top: 0; left: 0; z-index: -1;}
.container {width: 1280px; margin: 0 auto; position: relative;}
.logo-box {width: 175px; height: 88px; margin: 20px 0 0 0; background: url("logo.png") no-repeat left center; animation: logoFlash 0.8s ease forwards;}
@keyframes logoFlash {0% {opacity: 0; transform: scale(0.9);} 50% {opacity: 1; transform: scale(1.05);} 100% {opacity: 1; transform: scale(1);}}
.title-box {width: 1273px; height: 230px; margin: 270px auto 0; background: url("title.png") no-repeat center; animation: breathe 2.6s infinite ease-in-out;}
.title-box2 {width: 1273px; height: 230px; margin: 360px auto 0; background: url("title.png") no-repeat center; animation: breathe 2.6s infinite ease-in-out;}
@keyframes breathe {0% {transform: scale(1); opacity: 1;} 50% {transform: scale(1.04); opacity: 0.92;} 100% {transform: scale(1); opacity: 1;}}
.btn-wrap {width: 93%; margin: 0 auto 0; margin-bottom:26px;display: flex; justify-content: space-between;}
.btn-item {display: block; width: 146px; height: 445px; background-repeat: no-repeat; background-position: center; cursor: pointer; transition: filter 0.2s ease; text-decoration: none;}
.btn1 {background-image: url("btn_1.png");}
.btn2 {background-image: url("btn_2.png");}
.btn3 {background-image: url("btn_3.png");}
.btn4 {background-image: url("btn_4.png");}
.btn5 {background-image: url("btn_5.png");}
.btn6 {background-image: url("btn_6.png");}
.btn7 {background-image: url("btn_7.png");}
.btn8 {background-image: url("btn_8.png");}
.btn-item:hover {animation: shake 0.28s ease-in-out; filter: brightness(1.25);}
@keyframes shake {0% {transform: translateY(0);} 25% {transform: translateY(-4px);} 50% {transform: translateY(3px);} 75% {transform: translateY(-2px);} 100% {transform: translateY(0);}}
.page-bg2 {width: 100%; min-width: 1280px; height: 873px; background: url("bg2.jpg") no-repeat center top; position: absolute; top: 0; left: 0; z-index: -1;}
.container {width: 1280px; margin: 0 auto; position: relative;}
.logo-box {width: 175px; height: 88px; margin: 20px 0 0 0; background: url("logo.png") no-repeat left center; animation: logoFlash 0.8s ease forwards;}
@keyframes logoFlash {0% {opacity: 0; transform: scale(0.9);} 50% {opacity: 1; transform: scale(1.05);} 100% {opacity: 1; transform: scale(1);}}
.top-btn-wrap {position: absolute; top:0px; right: 0; display: flex; gap: 12px; z-index: 99;}
.top-btn {display: block; width: 79px; height: 14px; transition: filter 0.2s ease; text-decoration: none;}
.top-btn:hover {filter: brightness(1.2);}
.top-btn1 {background: url("top_btn1.png") no-repeat center;}
.top-btn2 {background: url("top_btn2.png") no-repeat center;}
.btn-wrap2 {width: 1237px; height: 110px; margin: 10px auto 0; position: relative; z-index: 2;}
.btn-wrap2 .btn-items {position: absolute;top: 0;height: 110px; background: url("btn_bar.png") no-repeat;text-decoration: none;}
.btn-wrap2 .btn-item1 {width:228px;left: 0; background-position: 0 0;}
.btn-wrap2 .btn-item2 {width:133px;left:228px; background-position: -228px 0;}
.btn-wrap2 .btn-item3 {width:134px;left: 361px; background-position: -361px 0;}
.btn-wrap2 .btn-item4 {width:133px;left: 495px; background-position: -495px 0;}
.btn-wrap2 .btn-item5 {width:133px;left: 628px; background-position: -628px 0;}
.btn-wrap2 .btn-item6 {width:134px;left: 761px; background-position: -761px 0;}
.btn-wrap2 .btn-item7 {width:133px;left: 895px; background-position: -895px 0;}
.btn-wrap2 .btn-item8 {width:209px;left: 1028px; background-position: -1028px 0;}
.content-area {width: 100%; position: relative; z-index: 1;}
.content-bg-1 {width: 1280px; margin: 50px auto; background: url("01.png") no-repeat center top;}
.content-box-1 {width: 1280px; height: 1580px; margin: 0 auto; position: relative;}
.act-btn-1 {position: absolute; width:147px;height:41px;transition: filter 0.2s ease;right:90px;top:726px;text-decoration: none;}
.content-bg-2 {width: 1280px; margin: 50px auto; background: url("02.png") no-repeat center top;}
.content-box-2 {width: 1280px; height: 2621px; margin: 0 auto; position: relative;}
.content-bg-3 {width: 1280px; margin: 50px auto; background: url("03.png") no-repeat center top;}
.content-box-3 {width: 1280px; height: 1941px; margin: 0 auto; position: relative;}
.act-btn-3 {position: absolute; width:147px;height:41px;transition: filter 0.2s ease;right:90px;top:456px;text-decoration: none;}
.act-btn-4 {position: absolute; width:147px;height:41px;transition: filter 0.2s ease;right:90px;top:1408px;text-decoration: none;}
.content-bg-4 {width: 1280px; margin: 50px auto; background: url("04.png") no-repeat center top;}
.content-box-4 {width: 1280px; height: 3900px; margin: 0 auto; position: relative;}
.act-btn-5 {position: absolute; width:147px;height:41px;transition: filter 0.2s ease;right:90px;top:726px;text-decoration: none;}
.act-btn-6 {position: absolute; width:147px;height:41px;transition: filter 0.2s ease;right:90px;top:1330px;text-decoration: none;}
.act-btn-7 {position: absolute; width:147px;height:41px;transition: filter 0.2s ease;right:90px;top:1613px;text-decoration: none;}
.content-bg-5 {width: 1280px; margin: 50px auto; background: url("05.png") no-repeat center top;}
.content-box-5 {width: 1280px; height: 780px; margin: 0 auto; position: relative;}
.act-btn-8 {position: absolute; width:147px;height:41px;transition: filter 0.2s ease;right:90px;top:287px;text-decoration: none;}
.content-bg-6 {width: 1280px; margin: 50px auto; background: url("06.png") no-repeat center top;}
.content-box-6 {width: 1280px; height: 1300px; margin: 0 auto; position: relative;}
.act-btn-9 {position: absolute; width:147px;height:41px;transition: filter 0.2s ease;right:90px;top:408px;text-decoration: none;}
.content-bg-7 {width: 1280px; margin: 50px auto; background: url("07.png") no-repeat center top;}
.content-box-7 {width: 1280px; height: 3660px; margin: 0 auto; position: relative;}
.act-btn-10 {position: absolute; width:147px;height:41px;transition: filter 0.2s ease;right:136px;top:172px;text-decoration: none;}
.content-bg-8 {width: 1280px; margin: 50px auto; background: url("08.png") no-repeat center top;}
.content-box-8 {width: 1280px; height: 4420px; margin: 0 auto; position: relative;}
.diamond-btn {position: absolute;width: 123px;height: 123px;background: transparent;cursor: pointer;text-decoration: none;transform: rotate(45deg);}
.diamond-btn-1 {top: 2100px; left: 229px;}
.diamond-btn-2 {top: 2005px; left: 329px;}
.diamond-btn-3 {top: 2100px; left: 430px;}
.diamond-btn-4 {top: 2005px; left: 530px;}
.diamond-btn-5 {top: 2100px; left: 630px;}
.diamond-btn-6 {top: 2005px; left: 731px;}
.diamond-btn-7 {top: 2100px; left: 831px;}
.mask {display:none; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.9); z-index:9999999;}
.pop {display:none; position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); z-index:99999999;}
.close {position: absolute; right:-30px; top:0px; width: 36px; height: 27px; background: url("close.png") no-repeat center; cursor: pointer; z-index: 999999999;}
.pop1 {width:397px; height:381px;}
.pop2 {width:577px; height:711px;}
.pop3 {width:987px; height:381px;}
.pop4 {width:987px; height:381px;}
.pop5 {width:697px; height:931px;}
.pop6 {width:697px; height:931px;}
.pop5 {width:697px; height:931px;}
.pop6 img {width:100%}
.page-box {width:100%; height:100%; position:relative;}
.page-item {display:none; width:100%; height:100%;}
.page-item.active {display:block;}
.page-nav {position:absolute;bottom:20px;left:0;width:100%;text-align:center;font-size:12px;color:#fff;z-index:10;}
.page-nav span {display:inline-block;padding:2px 14px;margin:0 6px;background:rgba(0,0,0,0.5);border:1px solid #fff;cursor:pointer;border-radius:4px;}
.page-nav span:hover {background:rgba(255,255,255,0.2);}
.no-scroll {overflow:hidden; height:100vh;}