*{margin:0;padding:0;box-sizing:border-box}
ul{list-style:none}
ul,ol,li{list-style:none;margin:0;padding:0}
h1,h2,h3,h4,h5,h6{font-weight:normal}
button{border:none;outline:none}
a{margin:0;padding:0;border:0;text-decoration:none;outline:none;border:none}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic}
del{text-decoration:line-through}
input,select,textarea{vertical-align:middle;border:none;margin:0;padding:0;outline:none}
input:focus,.select:focus,textarea:focus{outline:none}
textarea,select,input{-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;-ms-appearance:none;appearance:none}
em{font-style:normal}
.hidden{display:none}
hr{line-height:1;height:1px;background:none;border-top:1px dashed #9F9F9F;border-bottom:1px dashed #fff}
img{border:0;margin:0;padding:0}
html{min-height:100%;overflow:auto;position:relative;z-index:1;background:#fff;font-family:"微软雅黑";-webkit-overflow-scrolling: touch;}
a{text-decoration:none;cursor:pointer}
.clearfix:before,.clearfix:after{display:table;content:""}
.clearfix:after{clear:both}

h2.mr_4{margin-bottom:40px}
input::-webkit-input-placeholder{color:#b57a65}
input::-moz-placeholder{color:#b57a65}
input:-moz-placeholder{color:#b57a65}
input:-ms-input-placeholder{color:#b57a65}
input[type=number]{-moz-appearance:textfield}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}
a:hover{color:#f00}
body{position:relative;-webkit-text-size-adjust:none;color:#fff;font-size:24px;padding-bottom: env(safe-area-inset-bottom);}
html,body{-webkit-tap-highlight-color:transparent;width:100%;height:100%;overflow-x:hidden}
.hand{cursor:pointer;transition:all .6s}


@font-face{font-family:AngThongBold;src:url(../font/AngThongBold.woff) format('truetype');font-weight:400;font-style:normal}
@font-face{font-family:SiYuan_Regular;src:url(../font/SourceHanSans-Regular.woff) format('truetype');font-weight:400;font-style:normal}
@font-face{font-family:SiYuan_Bold;src:url(../font/SourceHanSans-Regular.woff) format('truetype');font-weight:400;font-style:normal}
.AngThongBold{font-family:AngThongBold}
.SiYuan_Bold{font-family:SiYuan_Bold}
.SiYuan_Regular{font-family:SiYuan_Regular}

/*common*/
.swiper-fullscreen{width:100%;height:100%}
.swiper-fullscreen >.swiper-wrapper>.swiper-slide{width:100%;height:100%;background-repeat:no-repeat;
  background-position:center center;background-size:cover;position:relative}
.swiper-fullscreen .part_slide1{background-image:url(../images/part1_bg.jpg)}
.swiper-fullscreen .part_slide2{background-image:url(../images/part3_fire_dragon.jpg)}
.swiper-fullscreen .part_slide3{background-image:url(../images/part3_bg.jpg)}
.swiper-fullscreen .part_slide4{background-image:url(../images/part4_bg.jpg)}
.swiper-fullscreen .part_slide5{height:2.18rem;background-image:url(../images/part5_bg.jpg)}





/*导航栏*/
.nav_box{z-index:33333;width:4.73rem;height:6rem;display:flex;flex-flow:column nowrap;justify-content:space-between;align-items:center;position:fixed;color:#fff;top:0rem;right:0;display:none;text-align:center;z-index:999999999;-webkit-transition:all 1s ease-in-out;transition:all 1s ease-in-out}
.nav_box_main{width:4.73rem;margin:0 auto}
.nav_top{width:4.73rem;height:1.04rem;position:relative;background:#181818}
.nav_box .closed{width:0.47rem;height: 0.47rem;  cursor:pointer;position:absolute;top:0.3rem;right:0;transition:all 0.3s;float:right;margin-right:0.2rem;cursor:pointer;background-image:url(../images/menu_closed.png);background-size: 100% 100%;}
.nav_box .closed:hover{transform:rotate(90deg)}
.nav_box.active{display:block}

.nav_btn{position:absolute;top:1.04rem;width:4.73rem;margin:0 auto;right:0rem}
.nav_btn div.active a{color:#ffdb86}
.nav_btn div a{color:#7f8c9d;font-size:0.38rem}
.nav_link .link.active{display:block;background:rgb(0,0,0,0.9);width:4.73rem;height:1.1rem}
.nav_link .link a{color:#a9977c;font-family:'AngThongBold','Microsoft YaHei',sans-serif,'Times New Roman';}
.nav_link .link{height:1.1rem;border-top:0.01rem solid #616b6f;background:rgb(0,0,0,0.8);line-height:1rem;padding-left:0.64rem;cursor:pointer;font-size:0.4rem;text-align:left;width:100%;-webkit-animation-duration:1.0s;animation-duration:1.0s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-name:fadeInUp;animation-name:fadeInUp}

.nav_line{width:100%;height:0.01rem;background:#31343c}
.link_ico{display: flex;  padding-top: 0.1rem;}
.link_ico img{margin-right: 0.4rem;height:0.89rem;width:auto;}

.header_right{display:flex;height:100%;align-items:center;justify-content:flex-end;}
.lang_en{position:absolute;left:0.5rem;top:0.3rem;width:2.15rem;height:0.6rem;background: #181818;border:1px solid #333643;}
.area{height:0.6rem;line-height:0.6rem;position:relative;cursor:pointer;position:relative}
.area span{color:#fff;font-size:0.36rem;display:block;float:left;width:1.55rem;height:0.6rem;text-align:center;
  line-height:0.6rem;font-family:'AngThongBold','Microsoft YaHei',sans-serif,'Times New Roman';}
.area i{position:absolute;top:0.2rem;right:0.2rem;width:0.24rem;height:0.21rem;display:inline-block;background:url(../images/row_up.png) no-repeat;background-size:0.24rem 0.21rem}
.area ul{position:absolute;left:-0.01rem;top:0.6rem;border:0.01rem solid #333643;background-color:#181818;width:2.15rem;cursor:default;display:none;border-top: none;}
.area:hover ul{display:block;z-index:3}
.area:hover i{width:0.24rem;height:0.21rem;display:inline-block;background:url(../images/row_down.png) no-repeat;background-size:0.24rem 0.21rem}
.area ul li{height:0.6rem;line-height:0.6rem;cursor:pointer;text-align:center;font-size:0.36rem;font-family:'AngThongBold','Microsoft YaHei',sans-serif,'Times New Roman';}
.area ul li.line{height:1px;margin:11px 0;padding:0;background-color:#373d41;margin-top:8px;margin-bottom:8px}
.area ul li a{display:block;height:100%;white-space:nowrap;color:#a4a5a5;font-size:0.36rem}
.area ul li a:hover{color:#fff}
.area ul li a span{display:inline-block;width:1.02rem;}
.ico_bg{background:#333643;width: 0.6rem;height: 0.6rem; position: absolute;right:0;}
/*公共的menu*/
.common_menu{position:fixed;top:0.24rem;right:1.18rem;width:0.9rem;height:0.9rem;z-index:100;}
.common_menu img{width:0.9rem;height:0.9rem;}

.common_share{position:fixed;top:0.2rem;right:0rem;width:1.18rem;height:0.93rem;z-index:100;}
.common_share img{width:0.9rem;height: 0.9rem;}
.common_share a{display: flex; justify-content: center;}


.common_share a.a_share{background:url(../images/share.png) no-repeat;background-size:100% 100%;width:1.18rem;height: 0.93rem;}
.common_share a.active.a_share{width:1.18rem;height:0.93rem; display: inline-block;background:url(../images/share_hover.png) no-repeat;background-size:100% 100%;width:1.18rem;height: 0.93rem;}
 .common_share .share_ico.active1{background-color: #181818;width:1.18rem;height:0.93rem; display: inline-block;}

 .footer_share {
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    width: 100%;
    background-color: rgba(0, 0, 0, .8); padding-bottom:0;
    opacity: 0; display: flex; flex-direction: column; justify-content: center; align-items: center;
  transition: opacity 0.3s, width 0.3s;

}

.footer_share img{width:0.66rem;height: 0.66rem;margin-top: 0.25rem;margin-bottom: 0.25rem;}
.footer_share a{    display: flex;margin-bottom: 0.1rem; transition: all 0.3s;
    align-items: center;
    justify-content: center;}

    .footer_share a.one{border-bottom: 0.01rem solid #5a5a5a;}

.common_share:hover .footer_share   {
   opacity: 1;
}
.footer_share a:hover{transform:scale(1.1,1.1);-ms-transform:scale(1.1,1.1);-moz-transform:scale(1.1,1.1);-webkit-transform:scale(1.1,1.1);-o-transform:scale(1.1,1.1);z-index:2}





/*part1*/
.main_show{width:7.5rem;position:relative;height:100%;margin:0 auto;overflow: hidden;}
.video_play{position:relative;width:1.19rem;height:1.19rem;display:flex;justify-content:center;margin-bottom:0.3rem;position:absolute;left:50%;margin-left:-0.72rem;top:4rem;z-index:5}
.video_paly_one{width:1.19rem;height:1.19rem;overflow:hidden;cursor:pointer;position:absolute;z-index:100}
.video_paly_one span{display:block;width:1.19rem;height:1.19rem;background:url(../images/part1_video_bg.png) no-repeat center center;background-size:100% 100%;-webkit-animation:circle 5s infinite linear;animation:circle 5s infinite linear}
.video_paly_one strong{display:block;width:1.19rem;height:1.19rem;background:url(../images/part1_video_play_bg.png) no-repeat center center;background-size:100% 100%;position:absolute;top:0;left:0}
.part1_logo{z-index:2;width:7.5rem;height:2.25rem; position: absolute; top:1.2rem; z-index: 5;  animation: scaleA 1s .2s ease both;
    -webkit-animation: scaleA 1s .2s ease both;background:url(../images/part1_solgen_en.png) no-repeat center center;background-size:100% 100%;
    -ms-animation: scaleA 1s .2s ease both;
    -moz-animation: scaleA 1s .2s ease both;
    -o-animation: scaleA 1s .2s ease both}
.part1_logo img{width:7.5rem;height:2.25rem;}
.part1_down{position:absolute;left:50%;margin-left:-0.6rem;display: flex; justify-content: center;z-index:8;background:url(../images/part1_down_row.png) no-repeat center center;background-size:100% 100%;width:1.19rem;height:0.69rem;bottom: 0.2rem; animation: arrowAn 0.8s infinite;}
@keyframes circleAn{100%{transform:rotate(720deg)}}
.part_four_btn{position: absolute; bottom:1.2rem;z-index:5;}
.part_four_btn img{height:0.95rem;width:auto;margin-right: 0.2rem; transition: all 0.3s;}
.part1_btn{width:7.5rem;display:flex;justify-content:center}



/*视听中心弹窗*/
.masked{background: rgba(0,0,0,0.8);position: fixed; width:100%;height:100%;left:0;top:0; z-index:111;}
.maskbg{background:rgba(0,0,0,0.8);position:absolute;width:100%;height:100%;left:0;top:0}
/*弹窗*/
    /*视频弹窗*/
	.pop_fixed {display:none;position:fixed;width:100%;height:100%;left:0;top:0;background:rgba(0,0,0,0.8);z-index:100;}
	.pop_fixed.active,.role_box.active {display:block;}
	.pop_video_cont {position:absolute;width:7.5rem;height:4.35rem;left:50%;top:50%;margin:-2.175rem 0 0 -3.75rem;background-image:url(../images/tc_video_bg.png);background-size:100% 100%;}
    .icon_close ,.pic_closed{position: absolute;  width: 0.98rem; height: 1.38rem;left: 50%;bottom: -1.3rem;margin-left: -0.49rem; cursor: pointer;}
    .icon_close img,.pic_closed img{ width:0.98rem;  height:  1.38rem;transition: all 0.3s; }
    .icon_close img:hover,.pic_closed img:hover,.rule_closed img:hover{transform:translateY(-0.1rem);}
    .pop_v_box,.pop_v_box video {width:96%;height:96%;overflow:hidden;}
    .pop_v_box{   position: absolute; left: 0.28rem;top: 0.17rem;}
    /*视听中心弹窗*/
    /* .maskbg{background:rgba(0,0,0,0.8);position:absolute;width:100%;height:100%;left:0;top:0}
	.video_play{width:1.19rem;height:1.19rem;position: absolute;left:0.6rem;top:3.75rem;z-index: 2;}
	.video_paly_one{width:1.19rem;height:1.19rem;overflow:hidden;cursor:pointer;z-index:2;background:url(../images/part1_video_play_bg.png);}
	.video_paly_one:hover{width:1.19rem;height:1.19rem;overflow:hidden;cursor:pointer;z-index:2;background:url(../images/part1_video_play_bg.png);}
	.video_paly_one span{display:block;width:1.19rem;height:1.19rem;background:url(../images/part1_video_bg.png);-webkit-animation:circle 5s infinite linear}
	@-webkit-keyframes circle{0%{ transform:rotate(0deg); }100%{ transform:rotate(360deg); }}
	@keyframes circle{0%{ transform:rotate(0deg); }100%{ transform:rotate(360deg); }}
 */


/*part2---龙*/
  /*底部背景切换*/
  .part_games_introduce{background-image:url(../images/part3_fire_dragon.jpg);position:absolute;bottom:0;right:0;width:100%;height:100%;margin:0;padding:0;background-position:center center;background-size:100% 100%;}
  .part3_wind_dragon{background-image:url(../images/part3_wind_dragon.jpg);position:absolute;bottom:0;right:0;width:100%;height:100%;margin:0;padding:0;background-position:center center;background-size:100% 100%;}
  .part3_ice_dragon{background-image:url(../images/part3_ice_dragon.jpg);position:absolute;bottom:0;right:0;width:100%;height:100%;margin:0;padding:0;background-position:center center;background-size:100% 100%;}
  .part3_earth_dragon{background-image:url(../images/part3_earth_dragon.jpg);position:absolute;bottom:0;right:0;width:100%;height:100%;margin:0;padding:0;background-position:center center;background-size:100% 100%;}
  .part3_fire_dragon{background-image:url(../images/part3_fire_dragon.jpg);position:absolute;bottom:0;right:0;width:100%;height:100%;margin:0;padding:0;background-position:center center;background-size:100% 100%;}
  .part3_purple_dragon{background-image:url(../images/part3_purple_dragon.jpg);position:absolute;bottom:0;right:0;width:100%;height:100%;margin:0;padding:0;background-position:center center;background-size:100% 100%;}
  .part3_change_bg div{display:none}

  /*侧边主导航*/
.slide_left_nav{width:7.5rem;height:1.1rem;bottom:0rem;position:absolute;display:flex;align-items:center}
.slide_picture_top{width:7.5rem;height:1.1rem;background-image:url(../images/part3_tab1.png);cursor:pointer;background-size:100% 100%;position:relative;z-index:1000;}
.menu_title li{height:1.96rem;margin-right:0.18rem;background-repeat:no-repeat;width:2.13rem;font-size:0.12rem}
.menu_title li{display:inline-block;width:4rem;height:8rem;position:absolute}
.menu_title li.meau01{left:0rem;top:0;position:absolute;width:1.69rem;height:1.11rem}
.menu_title li.menu_acitve.meau01{left:0rem;top:0;background:url(../images/part3_tab_hover_wind.jpg);background-size:100% 100%;transform:rotate(0deg)}
.menu_title li.meau02{left:1.69rem;top:0;position:absolute;width:1.69rem;height:1.11rem}
.menu_title li.menu_acitve.meau02{left:1.39rem;top:0;background:url(../images/part3_tab_hover_ice.jpg);background-size:100% 100%;transform:rotate(0deg)}
.menu_title li.meau03{left:3rem;top:0;position:absolute;width:1.69rem;height:1.11rem}
.menu_title li.menu_acitve.meau03{left:3rem;top:0;background:url(../images/part3_tab_hover_fire.jpg);background-size:100% 100%;transform:rotate(0deg)}
.menu_title li.meau04{left:4.3rem;top:0.;position:absolute;width:1.69rem;height:1.11rem}
.menu_title li.menu_acitve.meau04{left:4.3rem;top:0.;background:url(../images/part3_tab_hover_earth.jpg);background-size:100% 100%;transform:rotate(0deg)}
.menu_title li.meau05{left:5.8rem;top:0;position:absolute;width:1.69rem;height:1.11rem}
.menu_title li.menu_acitve.meau05{left:5.8rem;top:0;background:url(../images/part3_tab_hover_dark.jpg);background-size:100% 100%;transform:rotate(0deg)}
.no{display:none}

  /*主要龙*/
.slide_picture{width:100%;margin:0 auto;height:100%;position:relative;display:flex;}

.slide_picture_bottom_content{width:100%;height:100%;position:relative}
.game_roles{height:100%;position:relative;width:7.5rem}


.role_left{width:7.5rem;height:10.04rem;position:absolute;left:0rem;z-index:2;left:0rem;top:5%;}
.role_left img{width:7.5rem;height:10.04rem;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.2));
}
.role_left{-webkit-transform:translateX(-1rem);-ms-transform:translateX(-1rem);transform:translateX(-1rem);pointer-events:none;visibility:hidden;opacity:0;-webkit-transition:visibility 1s,opacity .6s,-webkit-transform .6s ease-out;transition:visibility 1s,opacity .6s,-webkit-transform .6s ease-out;-o-transition:visibility 1s,opacity .6s,transform .6s ease-out;transition:visibility 1s,opacity .6s,transform .6s ease-out;transition:visibility 1s,opacity .6s,transform .6s ease-out,-webkit-transform .6s ease-out;}
.game_roles .swiper-slide-active .role_left,.game_roles0 .swiper-slide-active .role_left,.game_roles1 .swiper-slide-active .role_left,.game_roles2 .swiper-slide-active .role_left,.game_roles3 .swiper-slide-active .role_left{opacity:1;visibility:visible;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}



.right_tab{visibility:hidden;opacity:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;z-index:10;-ms-flex-direction:column;flex-direction:column;-webkit-transform:translateX(1rem);-ms-transform:translateX(1rem);transform:translateX(1rem);-webkit-transition:visibility 1s,opacity .6s,-webkit-transform .6s ease-out;transition:visibility 1s,opacity .6s,-webkit-transform .6s ease-out;-o-transition:visibility 1s,opacity .6s,transform .6s ease-out;transition:visibility 1s,opacity .6s,transform .6s ease-out;transition:visibility 1s,opacity .6s,transform .6s ease-out,-webkit-transform .6s ease-out}
.game_roles .swiper-slide-active .right_tab,.game_roles0 .swiper-slide-active .right_tab,.game_roles1 .swiper-slide-active .right_tab,.game_roles2 .swiper-slide-active .right_tab,.game_roles3 .swiper-slide-active .right_tab{opacity:1;pointer-events:auto;visibility:visible;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}


.game_roles .swiper_dock_list li,.game_roles0 .swiper_dock_list0 li,.game_roles1 .swiper_dock_list1 li,.game_roles2 .swiper_dock_list2 li,.game_roles3 .swiper_dock_list3 li{width:1rem;height:1.02rem;cursor:pointer;transition:all 0.3s;margin-right:0.15rem;filter:grayscale(100%);-webkit-filter:grayscale(100%)}
.game_roles .swiper_dock_list li:nth-child(1).on,.game_roles .swiper_dock_list li:nth-child(2).on,.game_roles .swiper_dock_list li:nth-child(3).on,.game_roles0 .swiper_dock_list0 li:nth-child(1).on,.game_roles0 .swiper_dock_list0 li:nth-child(2).on,.game_roles0 .swiper_dock_list0 li:nth-child(3).on,.game_roles1 .swiper_dock_list1 li:nth-child(1).on,.game_roles1 .swiper_dock_list1 li:nth-child(2).on,.game_roles1 .swiper_dock_list1 li:nth-child(3).on,.game_roles2 .swiper_dock_list2 li:nth-child(1).on,.game_roles2 .swiper_dock_list2 li:nth-child(2).on,.game_roles2 .swiper_dock_list2 li:nth-child(3).on,.game_roles3 .swiper_dock_list3 li:nth-child(1).on,.game_roles3 .swiper_dock_list3 li:nth-child(2).on,.game_roles3 .swiper_dock_list3 li:nth-child(3).on{width:1rem;height:1.02rem;transform:scale(1.1);filter:grayscale(0%);-webkit-filter:grayscale(0%)}
.swiper_list,.swiper_list0,.swiper_list1,.swiper_list2,.swiper_list3{position:absolute;width:4.43rem;height:1.62rem;left:0;bottom:40%;display:flex;background:url(../images/part2_swiper_dock_list_tab.png);background-size:100% 100%;
z-index: 10;pointer-events:auto;}
.swiper_dock_list,.swiper_dock_list0,.swiper_dock_list1,.swiper_dock_list2,.swiper_dock_list3{width:4.43rem;height:1.62rem;position:relative;top:0.1rem;left:0.16rem;display:flex;justify-content:center;align-items:center}
.roles_wrap1 .swiper-slide-active .role_left,.roles_wrap2 .swiper-slide-active .role_left,.roles_wrap3 .swiper-slide-active .role_left{opacity:1;pointer-events:auto;visibility:visible;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}
.game_roles .swiper_dock_list li:nth-child(1){background:url(../images/part3_wind_tab_03.png);background-size:100% 100%;width:1rem;height:1.02rem}
.game_roles .swiper_dock_list li:nth-child(2){background:url(../images/part3_wind_tab_02.png);background-size:100% 100%;width:1rem;height:1.02rem}
.game_roles .swiper_dock_list li:nth-child(3){background:url(../images/part3_wind_tab_01.png);background-size:100% 100%;width:1rem;height:1.02rem}
.game_roles0 .swiper_dock_list0 li:nth-child(1){background:url(../images/part3_ice_tab_01.png);background-size:100% 100%;width:1rem;height:1.02rem}
.game_roles0 .swiper_dock_list0 li:nth-child(2){background:url(../images/part3_ice_tab_02.png);background-size:100% 100%;width:1rem;height:1.02rem}
.game_roles0 .swiper_dock_list0 li:nth-child(3){background:url(../images/part3_ice_tab_03.png);background-size:100% 100%;width:1rem;height:1.02rem}
.game_roles1 .swiper_dock_list1 li:nth-child(1){background:url(../images/part3_tu_tab_01.png);background-size:100% 100%;width:1rem;height:1.02rem}
.game_roles1 .swiper_dock_list1 li:nth-child(2){background:url(../images/part3_tu_tab_02.png);background-size:100% 100%;width:1rem;height:1.02rem}
.game_roles1 .swiper_dock_list1 li:nth-child(3){background:url(../images/part3_tu_tab_03.png);background-size:100% 100%;width:1rem;height:1.02rem}
.game_roles2 .swiper_dock_list2 li:nth-child(1){background:url(../images/part3_fire_tab_01.png);background-size:100% 100%;width:1rem;height:1.02rem}
.game_roles2 .swiper_dock_list2 li:nth-child(2){background:url(../images/part3_fire_tab_02.png);background-size:100% 100%;width:1rem;height:1.02rem}
.game_roles2 .swiper_dock_list2 li:nth-child(3){background:url(../images/part3_fire_tab_03.png);background-size:100% 100%;width:1rem;height:1.02rem}
.game_roles3 .swiper_dock_list3 li:nth-child(1){background:url(../images/part3_purple_tab_01.png);background-size:100% 100%;width:1rem;height:1.02rem}
.game_roles3 .swiper_dock_list3 li:nth-child(2){background:url(../images/part3_purple_tab_02.png);background-size:100% 100%;width:1rem;height:1.02rem}
.game_roles3 .swiper_dock_list3 li:nth-child(3){background:url(../images/part3_purple_tab_03.png);background-size:100% 100%;width:1rem;height:1.02rem}
  /*龙介绍*/

.role_title h3{text-transform: uppercase;text-align: center;font-size:0.6rem;position:absolute;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;
  left:0rem;top:1.2rem;width:4rem;font-family:'AngThongBold','Microsoft YaHei',sans-serif,'Times New Roman';opacity:unset !important;background:linear-gradient(180deg,#edc876 0%,#F3EBD3 100%);-webkit-background-clip:text;
  background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 4px black)}
h3.role_title_samll{font-size: 0.44rem;margin-top: 0.1rem;}

.role_wind_title_tip{background:url(../images/part3_role_wind_bg.png);background-size:100% 100%;width:1.84rem;height:0.52rem;position:relative;font-size:0.22rem;position:absolute;line-height:0.52rem;left:0.4rem;top:2.2rem;padding-left: 0.52rem;}
.role_blue_title_tip{background:url(../images/part3_role_ice_bg.png);background-size:100% 100%;width:1.84rem;height:0.52rem;position:relative;font-size:0.22rem;position:absolute;line-height:0.52rem;left:0.4rem;top:2.2rem;padding-left: 0.5rem;}
.role_tu_title_tip{background:url(../images/part3_role_tu_bg.png);background-size:100% 100%;width:1.84rem;height:0.52rem;position:relative;font-size:0.22rem;position:absolute;line-height:0.52rem;left:0.4rem;top:2.2rem;padding-left: 0.58rem;}
.role_fire_title_tip{background:url(../images/part3_role_fire_bg.png);background-size:100% 100%;width:1.84rem;height:0.52rem;position:relative;font-size:0.22rem;position:absolute;line-height:0.52rem;left:0.4rem;top:2.2rem;padding-left: 0.58rem;}
.role_purple_title_tip{background:url(../images/part3_role_purple_bg.png);background-size:100% 100%;width:1.84rem;height:0.52rem;position:relative;font-size:0.22rem;position:absolute;line-height:0.52rem;left:0.4rem;top:2.2rem; padding-left: 0.58rem;}
.role_wind_title_tip p{background-image:linear-gradient(to right,#618f5c,#96ba92);text-align:center;-webkit-background-clip:text;color:transparent;background-clip:text;font-family: 'SiYuan_Regular', sans-serif, Times New Roman;text-align: center; width: 1.2rem; overflow: hidden; height: 0.52rem;white-space:nowrap;font-weight: bold; }
.role_blue_title_tip p{background-image:linear-gradient(to right,#4d97b4,#a1ccdb);text-align:center;-webkit-background-clip:text;color:transparent;background-clip:text;font-family: 'SiYuan_Regular', sans-serif, Times New Roman;text-align: center;   width: 1.2rem; overflow: hidden; height: 0.52rem;white-space:nowrap; font-weight: bold; }
.role_tu_title_tip p{background-image:linear-gradient(to right,#978369,#bab1a3);text-align:center;-webkit-background-clip:text;color:transparent;background-clip:text;font-family: 'SiYuan_Regular', sans-serif, Times New Roman;text-align: center;   width: 1.2rem; overflow: hidden; height: 0.52rem;white-space:nowrap;font-weight: bold;  }
.role_fire_title_tip p{background-image:linear-gradient(to right,#d66b5a,#da9a8e);text-align:center;-webkit-background-clip:text;color:transparent;background-clip:text;font-family: 'SiYuan_Regular', sans-serif, Times New Roman;text-align: center;   width: 1.2rem; overflow: hidden; height: 0.52rem;white-space:nowrap; font-weight: bold; }
.role_purple_title_tip p{background-image:linear-gradient(to right,#9753b8,#cca0e3);text-align:center;-webkit-background-clip:text;color:transparent;background-clip:text;font-family: 'SiYuan_Regular', sans-serif, Times New Roman;text-align: center;   width: 1.2rem; overflow: hidden; height: 0.52rem;white-space:nowrap; font-weight: bold; }


/*part3---特色*/
.inner_center{top:50%;transform:translateY(-50%);position:absolute;width:100%}
.news_content_title{width:8rem;height:3rem;margin:0 auto;position:relative;display:flex;justify-content:center;background:url(../images/part2_title_bg.png);background-size:100% 100%;align-items:center; position:relative; top:-0.3rem;}
.news_content_title h4{font-size:0.6rem;align-items:center;margin-bottom:0.05rem;display:flex;justify-content:center;color:#d8e5e4;opacity:unset !important;white-space:nowrap;
  background:linear-gradient(180deg,#edc876 0%,#F3EBD3 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 4px black);font-family:'AngThongBold','Microsoft YaHei',sans-serif,'Times New Roman';
}
.news_content_title h4::before,.news_content_title h4::after{content:'';width:1.91rem;height:0.26rem;background:url(../images/part2_left_ico_03.png);background-size:100% 100%}
.news_content_title h4::after{transform:rotate(180deg)}
.news_content_title h4 span{text-align:center;display: inline-block;display: flex;flex-direction: column;line-height: 0.8rem;}
/*.news_content_title h4 span strong{margin-bottom: -0.3rem; }*/

.part_new_banner{width:7.06rem;height:6rem;margin:0 auto;margin-bottom:0.5rem}
.part_new_banner .swiper-container{width: 7.06rem;height: 6rem; position: relative;}
.part_new_banner .swiper-slide{width:7.06rem;;height:4.01rem; position: relative;}
.part_new_banner .swiper-slide img{width:7.06rem;height:4.01rem}

.part_new_features_banner_swiper .swiper-button-prev:after,.part_new_features_banner_swiper .swiper-button-next:after{content:''}
.part_new_features_banner_swiper .swiper-button-prev{left:0;top:5rem;width:1.06rem;height:1.06rem;background:url(../images/part5_left_row.png) no-repeat;background-position:0 0;background-size:100% 100%}
.part_new_features_banner_swiper .swiper-button-next{right:0;top:5rem;width:1.06rem;height:1.06rem;background:url(../images/part5_left_row.png) no-repeat;background-position:0 0;background-size:100% 100%;transform:rotate(180deg)}
.part_new_features_banner_swiper .part2_pagination{height:0.64rem;z-index:10;position:absolute;top:4.8rem;width:3.6rem;left:50%;margin-left:-1.8rem;display:flex;justify-content:space-between;align-items:center}
.part2_pagination  .swiper-pagination-bullet{background:url(../images/part5_pag.png) no-repeat;background-size:100% 100%;position:relative;width:0.24rem;height:0.64rem;opacity:1}
.part2_pagination  .swiper-pagination-bullet-active{background:url(../images/part5_pag_hover.png) no-repeat;background-size:100% 100%;width:0.9rem;height:0.64rem;opacity:1}



/*part4---news*/
.part_new_banner1 .swiper-container{width: 7.06rem;height: 4.31rem; position: relative;}
.part_new_banner1{position:relative; top: -1rem;}
.news_banner img{width:7.06rem;height:4.31rem;position:relative;}
.part_new_banner_swiper{width:7.06rem;height:4.5rem;}
.part_new_banner_swiper  .part3_pagination{width:7.06rem;    transform: translate3d(0,-0.01rem,0);height:0.22rem;bottom:0.4rem;position:absolute;right:0.3rem;display:flex;justify-content:flex-end;align-items:center;z-index:10;}
.part3_pagination .swiper-pagination-bullet{margin:0 0.2rem;background:url(../images/part2_banner_ico.png);position:relative;width:0.21rem;height:0.22rem;opacity:1;background-size:100% 100%;}
.part3_pagination .swiper-pagination-bullet-active{background:url(../images/part2_banner_ico_hover.png);width:0.21rem;height:0.22rem;opacity:1;background-size:100% 100%;}
.part_new_banner_swiper .swiper-pagination-bullets .swiper-pagination-bullet{margin-right:0.15rem}


.conNews{width:7.06rem;height:4.31rem;background:url(../images/part4_news_bg.png) no-repeat;background-size:100% 100%;margin:0 auto; position: relative;margin-bottom: 0.15rem; top:-0.8rem}
.conNews h3{background:url(../images/news_content_title.jpg) no-repeat;background-size:100% 100%;width: 7.06rem;height:0.77rem;position:relative;color:#48422f;font-size:0.36rem;text-transform:uppercase;line-height:0.77rem;padding-left:1.15rem;
  display:flex;align-items:center;font-family:'AngThongBold','Microsoft YaHei',sans-serif,'Times New Roman';}
.conText ul li.part2_news_text a{display:block;width:4.2rem;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;color:#d7d7d7;font-size:0.22rem;}
.conText ul li.part2_news_text a:hover{color:#fff;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}
.conText ul li.part2_news_text{width:6.5rem;height:0.84rem;line-height:0.84rem;font-size:0.16rem;color:#eaeaea;display:flex;justify-content:space-between;position:relative;font-family: 'SiYuan_Regular', sans-serif, Times New Roman;}
.conText ul li.part2_news_text::after{content:'';position:absolute;background:url(../images/part3_news_line.png);background-size:100% 100%;left:0;bottom:0;width:6.54rem;height:0.02rem}
.conText ul li.part2_news_line{width:6.5rem;height:0.08rem;display:flex}
.conText ul li.part2_news_line img{width:6.5rem;height:0.08rem}
.conText ul li.part2_news_text:hover{width:6.5rem;height:0.84rem;line-height:0.84rem;font-size:0.16rem;color:#eaeaea;background:url(../images/part2_news_list_hover.png);background-size:100% 100%;display:flex;justify-content:space-between}

.conText ul{margin-left:0.28rem}
.part2_news_text span{color:#6d6f74;font-size: 0.22rem;display: inline-block; overflow: hidden;}
.news_more{width:1.05rem;height:0.34rem;position:absolute;bottom:0.2rem;right:0.2rem}
.news_more a:hover,.flower_more_ico a:hover,.video_more a:hover{transform:translateY(-0.1rem)}
.conText{width:7.06rem;position:absolute;height:3rem;left:0;font-size:0.2rem}
.conText p{line-height:0.26rem}
.conText p span{float:right}
.conText p a{display:inline-block;margin:0 0.05rem 0 0}
.abs{width:100%;text-align:left;background:rgba(0,0,0,0.8);bottom:0;left:0;position:absolute;color:#fff;font-size:0.20rem;padding:0.1rem 0.20rem;transition:transform 0.3s;height:0.6rem}
.abs h2{font-size:0.30rem}
.ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.part2_news_more{width:3.54rem;height:0.83rem;background:url(../images/part2_news_more.jpg);transition:all 0.3s; background-size: 100% 100%;margin:0 auto;  position: relative; top: -0.5rem;}
.part2_news_more a{display: block;width:3.54rem;height:0.83rem;}

/* .part4_logo{width:7.5rem;height:1.9rem;background:url(../images/part4_logo.png);transition:all 0.3s; background-size: 100% 100%;margin:0 auto;position:relative;top: -1rem;}

 */


.inner{z-index:2;position:relative;height:100vh;height:100dvh;display:-webkit-box;display:-ms-flexbox;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;margin:0 auto;}
.inner .inner_content{position:relative;display:flex;align-items:center;flex-direction:column}






/*part5---footer*/
.footer_content{width:4rem;margin:0 auto;display:flex;justify-content:space-between;align-items:center;height:2.18rem}
.footer_yt{width:0.97rem;height:0.97rem;background:url(../images/footer_yt.png) no-repeat;background-size:100% 100%}
.footer_fb{width:0.97rem;height:0.97rem;background:url(../images/footer_fb.png) no-repeat;background-size:100% 100%}
.footer_play{width:0.97rem;height:0.97rem;background:url(../images/footer_play.png) no-repeat;background-size:100% 100%}












.role_right1_zhi{position:absolute;width:7.5rem;height:100%;left:0;bottom:0;}
.slide_picture_bottom{height:100vh;height:100dvh;width:7.5rem;position:absolute;left:50%;top:50%;transform: translate(-50%, -50%);
 }
  .role_title{background:url(../images/part3_role_title.png);background-size:100% 100%;width:3.8rem;height:3.3rem;position:relative;margin-bottom:0.3rem;position:absolute;top:10%;}
.game_roles .swiper-slide,.game_roles0 .swiper-slide,.game_roles1 .swiper-slide,.game_roles2 .swiper-slide,.game_roles3 .swiper-slide{width:7.5rem;height:100vh;height:100dvh;position: relative; }


.ing{animation:circleAn 3s infinite linear}
@keyframes circleAn{100%{transform:rotate(720deg)}}
@-webkit-keyframes circle{0%{transform:rotate(0deg)}
100%{transform:rotate(360deg)}
}@keyframes circle{0%{transform:rotate(0deg)}
100%{transform:rotate(360deg)}
}
.register_btn  img{-webkit-animation:magnify .6s linear infinite alternate;-moz-animation:magnify .6s linear infinite alternate;animation:magnify .6s linear infinite alternate}
@-webkit-keyframes magnify{0%{-webkit-transform:scale(0.96)}
100%{-webkit-transform:scale(1)}
}@-moz-keyframes magnify{0%{-moz-transform:scale(1)}
100%{-moz-transform:scale(0.96)}
}@keyframes magnify{0%{transform:scale(1)}
100%{transform:scale(0.96)}
}


.hover-shadow:hover{box-shadow:0 0.04rem 0.08rem 0 rgba(0,0,0,0.2),0 0.06rem 0.2rem 0 rgba(0,0,0,0.19)}
img.hover-shadow{transition:0.3s}
.closed img:hover{transform:rotate(90deg)}
 .part1_btn img:hover,.footer_btn img:hover{transform:scale(1.1,1.1);filter:drop-shadow(0px 0px 0.1rem #000);-ms-transform:scale(1.1,1.1);-moz-transform:scale(1.1,1.1);-webkit-transform:scale(1.1,1.1);-o-transform:scale(1.1,1.1)}
.scale-up-center{-webkit-animation:scale-up-center 0.4s cubic-bezier(0.390,0.575,0.565,1.000) both;animation:scale-up-center 0.4s cubic-bezier(0.390,0.575,0.565,1.000) both}


@-webkit-keyframes scale-up-center{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}
100%{-webkit-transform:scale(1);transform:scale(1)}
}@keyframes scale-up-center{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}
100%{-webkit-transform:scale(1);transform:scale(1)}
}
 @keyframes arrowAn{0%,100%{opacity:0;transform:translateY(0.1rem)}
50%{opacity:1;transform:translateY(0)}
}


/*slogen*/
@keyframes scaleA{0%{opacity:0;-webkit-transform:scale(2,2)}
80%{-webkit-transform:scale(.9,.9)}
100%{opacity:1;-webkit-transform:scale(1,1)}
}
@-webkit-keyframes scaleA{0%{opacity:0;-webkit-transform:scale(2,2)}
80%{-webkit-transform:scale(.9,.9)}
100%{opacity:1;-webkit-transform:scale(1,1)}
}
@-ms-keyframes scaleA{0%{opacity:0;-ms-transform:scale(2,2)}
80%{-ms-transform:scale(.9,.9)}
100%{opacity:1;-ms-transform:scale(1,1)}
}
@-moz-keyframes scaleA{0%{opacity:0;-moz-transform:scale(2,2)}
80%{-moz-transform:scale(.9,.9)}
100%{opacity:1;-moz-transform:scale(1,1)}
}
@-o-keyframes scaleA{0%{opacity:0;-o-transform:scale(2,2)}}



h3.small_fz{font-size: 0.4rem; top: 1.4rem; width: 6.5rem;}


 .tooltip-container {
   position:absolute;bottom:20%;left:50%;margin-left:-3.53rem;width:7.06rem;height:2.37rem;
      display: inline-block;font-size:0.28rem;pointer-events:auto !important; z-index: 11;

    }


    .role_des{color:#a9a297;width:7.06rem;height:2.37rem;background:url(../images/part2_text_bg.png) no-repeat;background-size:100% 100%;padding:0.26rem;
  font-family: 'SiYuan_Regular', sans-serif, Times New Roman; display: -webkit-box; /* 必须结合WebKit的私有属性使用 */
    -webkit-box-orient: vertical; /* 设置或检索伸缩盒对象的子元素的排列方式 */
    -webkit-line-clamp: 5; /* 限制在一个块元素显示的文本的行数 */
    overflow: hidden;}
.role_des p{ display: -webkit-box;
  -webkit-box-orient: vertical; line-height: 0.65rem;
  -webkit-line-clamp:3;  /* 控制行数 */height: calc(3 * 0.65rem);
  overflow: hidden;
  text-overflow: ellipsis;  width:100%;}

    .full-text {
      visibility: hidden;
      width: 7rem;
      background-color: #333;pointer-events:auto !important;z-index: 11;
      color: #fff;
      text-align: center;
      padding: 0.05rem;
      position: absolute;
      z-index: 1;
       bottom: 100%;
      left: 50%;
      margin-left: -3.5rem;
      opacity: 0;
      transition: all 0.3s;font-size: 0.24rem;
    }

    .full-text::after {
      content: "";
      position: absolute;
      top: 100%;
      left: 50%;
      margin-left: -0.05rem;
      border-width: 0.2rem;
      border-style: solid;
      border-color: #F3EBD3 transparent transparent transparent;
    }

 .tooltip-container .full-text.active { z-index: 3;border: 1px solid #F3EBD3;
      visibility: visible !important; width: 7rem; height: auto; z-index: 11;
      opacity: 1 !important;pointer-events:auto !important;
    }

.active1{    z-index: 0; pointer-events: none;}