body,dl,dd,ul,ol,h1,h2,h3,h4,h5,h6,p,form,header,section,article,footer { margin: 0; } 
body,button,input,select,textarea { font: 12px/1.5 tahoma,'\5FAE\8F6F\96C5\9ED1',sans-serif } 
h1,h2,h3,h4,h5,h6 { font-size: 100% } 
em,b { font-style: normal } 
a { text-decoration: none; color: inherit; outline: 0 none; } 
a:hover { text-decoration: none; outline: 0 none; } 
img { border: 0; vertical-align: top; } 
body { padding-top: 42px; background: #000000; font-family: Arial, Helvetica, sans-serif; } 
button,input,select,textarea { font-size: 100%; outline: none } 
table { border-collapse: collapse; border-spacing: 0 } 
td,th,ul,ol { padding: 0 } 
.fl { float: left } 
.fr { float: right } 
.pr { position: relative; } 
.pa { position: absolute; } 
ul,li { list-style: none; } 
.clearfix:after { content: ""; display: block; visibility: hidden; height: 0; clear: both; } 
.clearfix { zoom: 1; } 
.wrap { max-width: 2560px; min-width: 1200px; margin: 0 auto; position: relative; } 
audio,canvas,video { display: inline-block; *display: inline; *zoom: 1; } 
html, body { -webkit-user-select: none; /* 禁止选中文本（如无文本选中需求，此为必选项） */
 user-select: none; height: 100vh; position: relative; background: #000000; } 
/*footer*/
#afooter { height: 120px; padding: 1px 0 0 0; background-color: #000; color: #ffffff; display: none;} 
#afooter .wrap_ieg { padding: 10px 0 0 0; margin-top: 10px; text-align: center; color: #ffffff; font-size: 14px; line-height: 22px; } 
#afooter a { color: #ffffff; } 
#afooter p.e { margin: 5px 0; font-size: 14px; font-family: "Tahoma"; } 
#_overlay_ { min-width: 1200px !important; } 

.bgscreen {background: transparent; background-size: 100%; width: 100%; height: 100%; } 

body { padding-top:42px; overflow-x:hidden; /* background: #000; */ width: 100%; height: 100%; overflow: hidden; min-width: 1366px; } 
.wraps { position: relative; width: 100%; min-width: 1366px; height: calc(100vh - 42px); } 
.w1200 { width:1200px; height: 100%; position:relative; margin:0 auto; z-index: 2; transform: scale(1); transform-origin: center center; } 

@keyframes anitop { 
    0% { transform:translate(0,20px); opacity:0; } 
    100% { transform:translate(0,0); opacity:1; } 
}
@keyframes anitop1 { 
    0% { transform:translate(0,-20px); opacity:0; } 
    100% { transform:translate(0,0); opacity:1; } 
} 
@keyframes revealFromLeft {
    from {
        clip-path: inset(0 100% 0 0);
    }
    to {
        clip-path: inset(0 0 0 0);
    }
}
.picrefse{ clip-path: inset(0 100% 0 0);}
.picrefse1{ clip-path: inset(0 100% 0 0);}
.ani-slide .picrefse { animation:revealFromLeft 1.2s 0.6s ease forwards; } 
.ani-slide .picrefse1 { animation:revealFromLeft 1.2s 1s ease forwards; } 

.zompic{ transform: scale(3); opacity: 0;}
@keyframes zompic {
    from {
        transform: scale(3);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}
.ani-slide .zompic { animation:zompic 0.3s 0.2s ease-in-out forwards; } 


.ani1,.ani2,.ani3,.ani4,.ani5,.ani6,.ani7,.ani8,.ani9 { transform:translate(0,20px); opacity:0; } 
.ani-slide .ani1 { animation:anitop 0.4s 0.5s ease forwards; } 
.ani-slide .ani2 { animation:anitop 0.4s 0.7s ease forwards; } 
.ani-slide .ani3 { animation:anitop 0.4s 0.9s ease forwards; } 
.ani-slide .ani4 { animation:anitop 0.4s 1.1s ease forwards; } 
.ani-slide .ani5 { animation:anitop 0.4s 1.3s ease forwards; } 
.ani-slide .ani6 { animation:anitop 0.4s 1.5s ease forwards; } 
.ani-slide .ani7 { animation:anitop 0.4s 1.7s ease forwards; } 
.ani-slide .ani8 { animation:anitop 0.4s 1.9s ease forwards; } 
.ani-slide .ani9 { animation:anitop 0.4s 2.1s ease forwards; } 

.fadsin{ opacity: 0; transition:  all 0.4s ease;}
.ani-slide .fadsin { opacity: 1; } 

.scaver{ transform: translate(60px,-70px); opacity: 0;}
@keyframes scaver { 
    0% { transform:scaver(60px,-70px); opacity:0; } 
    100% { transform:translate(0,0); opacity:1; } 
} 
.ani-slide .scaver { animation:scaver 0.4s 0.8s ease forwards; } 

.zanlefts1,.zanlefts2,.zanlefts3{ transform: translate(-60px,0); opacity: 0;}
@keyframes claers { 
    0% { transform:scaver(-60px,0); opacity:0; } 
    100% { transform:translate(0,0); opacity:1; } 
} 
.ani-slide .zanlefts1 { animation:claers 0.4s 0.5s ease forwards; } 
.ani-slide .zanlefts2 { animation:claers 0.4s 1s ease forwards; } 
.ani-slide .zanlefts3 { animation:claers 0.4s 1.5s ease forwards; } 


.anivs1,.anivs2,.anivs3{ transform:translate(0,20px); opacity:0; }
.anims .anivs1 { animation:anitop 0.4s 0.5s ease forwards; } 
.anims .anivs2 { animation:anitop 0.4s 0.7s ease forwards; } 
.anims .anivs3 { animation:anitop 0.4s 0.9s ease forwards; } 

.swiper-container { width: 100%; height:100%; margin: 0; overflow: hidden; position: relative; } 
.swiper-container.swiper-container_page { width: 100%; height:100%; margin: 0; overflow: hidden; position: relative; } 
.swiper-slide { /* Center slide text vertically */
 overflow: hidden; } 
.w_ani { opacity: 0; transition:all 0.6s 0s ease; transform: scale(1.1); } 
.ani-slide .w_ani { opacity: 1; transform: scale(1); } 
.imgcenter img { display: block; margin: 0 auto; } 

.part_cont { width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } 

.bg000{ background: #000;}

.videomatop{ margin-top: -44px;}
video{ width: 100%; display: block;}
.index_video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; z-index: 999; } 
.pa_cent1 { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 1200px;} 
.pa_cent1 img{ width: 100%; display: block;}

.kv_video_bg { width: 100%; height: 100%; position: absolute; left: 0; bottom: 0; display: block; overflow: hidden; } 
.kv_video_bg video { display: block; position: absolute; left: 50%; top: 0; min-width: 100vw; min-height: 100vh; width: auto; height: auto; transform: translate(-50%, 0); object-fit: cover;} 
.index_video video { display: block; position: absolute; left: 50%; top: 0; min-width: 100vw; min-height: 100vh; width: auto; height: auto; transform: translate(-50%, 0); object-fit: cover;} 
.picbgContent{ position: absolute; left: 50%; top: 50%; min-width: 100vw; min-height: 100vh; width: auto; height: auto; transform: translate(-50%, -50%); object-fit: cover;}

.kv_video_bg>img { display: block; position: absolute; left: 50%; top: 50%; min-width: 100vw; min-height: 100vh; width: auto; height: auto; transform: translate(-50%, -50%); object-fit: cover;} 


.p1_t1{ width: 100%; position: relative; margin: 0 auto -16%; z-index: 6;}
.p1_t2{ width: 50%; position: relative; margin: 0 auto 3%; z-index: 6; }
.p1_t2>img{ clip-path: inset(0 0 100% 0);}
@keyframes revealTopToBottom {
  from {
    /* 开始：裁剪掉底部100%，即不可见 */
    clip-path: inset(0 0 100% 0);
  }
  to {
    /* 结束：无裁剪，完全显示 */
    clip-path: inset(0 0 0 0);
  }
}
.ani-slide .p1_t2>img{ animation: revealTopToBottom 0.8s 0.6s ease forwards; }
.p1_t3{ width: 100%; position: absolute; top: 0; left: 0; z-index: 5;}

.p2_t1{ width: 70%; position: relative; margin: -6% auto -3%; z-index: 6;}
.animate-contbox canvas{ width: 100% !important; height: auto !important;}
.animate-contbox{ width: 100%; position: relative;}
.p2_t2{ width: 58%; position: absolute; left: -10%; top: 3%;}
.p2_t3{ width: 65%; position: absolute; left: 18%; top: -14%;}
.p2_t4{ width: 58%; position: absolute; left: 53%; top: 3%;}
.vid-txts{ width: 40%; position: absolute; top: 46%; left: 30%; z-index: 5;}
.rev-tst{ font-size: 0.8vw; color: #a0857b; text-align: center; position: absolute; bottom: 8%; left: 0; width: 100%; z-index: 20;}

.p3_t1{ width: 80%; position: relative; margin: -0 auto 36vh; z-index: 6;}
.p_tbox{width: 100%; position: relative; margin: 0 auto; z-index: 6;}
.p_tbox>img{ clip-path: inset(0 0 100% 0);}
.ani-slide .p_tbox>img{ animation: revealTopToBottom 0.8s 0.8s ease forwards; }
.rebpop{ width: 100%; position: absolute; top: 0; left: 0; z-index: 5;}
.animatebg{ transform: scale(1.4); transform-origin: center top;}
@keyframes scaleIn {
    0% {
        transform: scale(1.4)
    }

    to {
        transform: scale(1)
    }
}
.ani-slide .animatebg{ animation: scaleIn 8s linear forwards; }
.kv1vbg:after{
    content:"";
    display: block;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.2);
    position: absolute;
    top: 0;
    left: 0;
}
.cpys{ width: 18%; margin: -4% auto 0;}


.arrbtm{ width: 2%; position: absolute; z-index: 10; bottom: 2%; left: 50%; margin-left: -1%; cursor: pointer;}
.arrbtm img{ width: 100%; display: block; animation: arrowSpin 3s ease-out infinite;}
@keyframes arrowSpin {
    0%,30% {
        transform: translateY(0) rotateY(0deg)
    }

    80% {
        transform: translateY(-10px) rotateY(45deg)
    }

    to {
        transform: translateY(0) rotateY(540deg)
    }
}

.leftbars{ position: absolute; z-index: 80; top: 50%; left: 0; transform: translate(0,-50%);}
.leftbars a{ color: #6e6255; font-size: 16px; padding-left: 62px; position: relative; margin-bottom: 10px; display: flex; transition: all 0.4s ease;}
.leftbars a.current{ color: #e3aa84 !important;}
.leftbars a:hover{ color: #e3aa84 !important;}
.leftbars a.navhreds{ font-size: 18px; color: #6e6255; padding-left: 62px; position: relative;}
.leftbars a.navhreds:after{ content: ""; display: block; width: 120%; height: 272%; background: url(//game.gtimg.cn/images/tiantang2/cp/a20260713jtsd/navbgs.png) no-repeat center; background-size: 100% auto; position: absolute; top: -107%; left: 0; z-index: -1; opacity: 0; transform: translate(-110%,0); transition: all 0.4s ease; pointer-events: none;}
.leftbars a.navhreds.sectionCurrent:after{ transform: translate(0,0); opacity: 1;}
.leftbars a.navhreds:before{
    content:"";
    display: block;
    width: 41px;
    height: 38px;
    background: url(//game.gtimg.cn/images/tiantang2/cp/a20260713jtsd/navlight.png) no-repeat center; 
    background-size: 100% auto; 
    position: absolute;
    top: -6px;
    left: 14px;
}

.navlights{ pointer-events: none; width: 72px; height: 98px; background: url(//game.gtimg.cn/images/tiantang2/cp/a20260713jtsd/nav_l_light.png) no-repeat; position: absolute; top: -38px; left: -6px; opacity: 0; transition: all 0.4s ease;}
.leftbars a.navhreds.sectionCurrent .navlights{ opacity: 1;}

.leftbars:after{
    content: "";
    display: block;
    width: 1px;
    height: 100%;
    background: linear-gradient(
    to bottom,
    rgba(65, 57, 52, 0) 0%,
    rgba(65, 57, 52, 1) 10%,
    rgba(65, 57, 52, 1) 90%,
    rgba(65, 57, 52, 0) 100%);
    position: absolute;
    top: 0;
    left: 33px;
    z-index: -1;
}



@media screen and (max-width: 1920px){
    .w1200 { transform: scale(.9); transform-origin: center center; } 
}
@media screen and (max-width: 1800px){
    .bgscreen { background-size: 1800px; } 
    .w1200 { transform: scale(.9); transform-origin: center center; } 
}

@media screen and (max-width: 1600px){
    .w1200 { transform: scale(.7); transform-origin: center center; } 
    .leftbars{ transform: scale(0.8) translate(0,-60%); transform-origin: left center;}
} 
 @media screen and (max-width: 1400px){
    .bgscreen { background-size: 1400px; } 
}