/* ===================================================================
   职业展示页样式
   规则按 HTML 结构顺序归类：
   1.基础重置  2.全局布局  3.首页头部/KV  4.职业屏(.part)共享结构
   5.各职业专属背景与图  6.男女切换按钮  7.左侧竖排导航
   8.向下切换箭头  9.了解更多弹窗  10.视频弹窗  11.动画关键帧
   12.隐藏元素与滚动锁定
   =================================================================== */

/* ============ 1. 基础重置 ============ */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,code,del,dfn,em,img,q,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	padding: 0;
	vertical-align: baseline
}

:focus {
	outline: 0
}

ol,ul,li {
	list-style: none
}

i,em {
	font-style: normal
}

img {
	vertical-align: top
}

table {
	border-collapse: collapse;
	border-spacing: 0
}

article,aside,audio,bdi,canvas,command,datalist,details,figcaption,figure,footer,header,hgroup,keygen,mark,meter,nav,output,progress,rp,rt,ruby,section,source,summary,time,track,vedio {
	display: block
}

a {
	text-decoration: none;
	outline: 0
}

a:hover {
	text-decoration: underline;
	color: #e1b858
}

h1 {
	display: none
}

.clearfix:after {
	clear: both;
	content: '\0020';
	display: block;
	visibility: hidden;
	height: 0
}

.clearfix {
	zoom: 1
}

.hide {
	display: none
}

/* ============ 2. 全局布局 / 滚动条 ============ */
html {
	overflow-x: hidden;
	overflow-y: scroll;
	scrollbar-width: none
}

html::-webkit-scrollbar {
	width: 0;
	display: none
}

body {
	color: #000;
	font: 12px/170% simsun,arial,"Lucida Grande","Lucida Sans Unicode";
	position: relative;
	overflow-x: hidden;
	margin: 0;
	padding: 0
}

.wrap {
	width: 100%;
	min-width: 1200px;
	max-width: 1920px;
	margin: 0 auto;
	font-family: "Microsoft YaHei";
	height: 100%;
	position: relative;
	overflow: hidden
}

.main {
	margin: 0 auto;
	min-width: 1200px;
	max-width: 1920px;
	height: 100%
}

/* ============ 3. 首页头部 / KV ============ */
.header {
	display: none;
	width: 100%;
	height: 100%;
	transition: opacity .55s ease, transform .55s cubic-bezier(.22,.8,.32,1);
	backface-visibility: hidden
}

.header.show {
	display: block
}

.header.hide-transition {
	opacity: 0 !important;
	transform: translateY(-30px) scale(1.02)
}

.header.entry-anim {
	animation: bounceInDown .85s cubic-bezier(.22,.8,.32,1) both
}

.kv {
	background: url(../images/kv_0287ea6.jpg) no-repeat center top;
	width: 100%;
	height: 1025px;
	position: relative;
	margin: 0 auto
}

.kv .yun-l {
	background: url(../images/yun-l_d7b2c9e.png) no-repeat center top;
	width: 960px;
	height: 1025px;
	position: absolute;
	left: 50%;
	margin-left: -960px;
	top: 0;
	z-index: 2;
	animation: fadeOutLeft 10s ease infinite
}

.kv .yun-r {
	background: url(../images/yun-r_5d22559.png) no-repeat center top;
	width: 960px;
	height: 1025px;
	position: absolute;
	right: 50%;
	margin-right: -960px;
	top: 0;
	z-index: 2;
	animation: fadeOutRight 10s ease infinite
}

.kv .kv-text {
	width: 692px;
	height: 261px;
	position: absolute;
	left: 50%;
	margin: 0 0 0 -377px;
	top: 520px;
	background: url(../images/kv-text_0730cab.png) no-repeat center top
}

.header.show .kv-text {
	animation: fadeInUp 2.5s forwards
}

.kv .kv-btn {
	background: url(../images/kv-btn_80099e8.png) no-repeat center top;
	width: 554px;
	height: 51px;
	position: absolute;
	left: 50%;
	margin: 0 0 0 -297px;
	top: 715px;
	cursor: pointer;
	z-index: 20
}

.kv .kv-btn:hover {
	background: url(../images/kv-btn-h_60d2989.png) no-repeat center top
}

.header.show .kv-btn {
	animation: bounceInDown 2.2s forwards
}

/* 通用 logo（头部与各职业屏共用） */
.logo {
	width: 250px;
	height: 112px;
	position: absolute;
	left: 32px;
	top: 20px;
	z-index: 10;
	background: url(../images/logo.png) no-repeat center top
}

/* ============ 4. 职业屏(.part)共享结构 ============ */
.part {
	width: 100%;
	height: 1025px;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
	display: none;
	background-color: #eaf2fa;
	transition: opacity .45s ease, transform .5s cubic-bezier(.22,.8,.32,1);
	opacity: 0;
	transform: translate3d(0,14px,0)
}

.part.show {
	display: block;
	opacity: 1;
	transform: translate3d(0,0,0);
	animation: fadeInUp .55s cubic-bezier(.22,.8,.32,1) both
}

/* 男女两套职业页（每个 part 内两个 part-tab） */
.part .part-tab {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	opacity: 0;
	background-repeat: no-repeat;
	background-position: center top;
	transition: opacity .5s ease
}

.part .part-tab.show {
	z-index: 1;
	opacity: 1;
	animation: bgSlideInRight .75s cubic-bezier(.22,.8,.32,1) both
}

/* 职业屏元素入场动画 */
.part.show a {
	animation: fadeInLeft 2s forwards
}

.part.show .name {
	animation: fadeInDown 1.8s forwards
}

.part.show .text {
	animation: fadeInUp 2.5s forwards
}

.part.show .dingwei {
	animation: fadeInUp 2.4s forwards
}

.part.show .btns {
	animation: fadeInUp 1.8s forwards
}

.part.show .btn {
	animation: fadeInUp 1.8s forwards
}

/* 职业名称图 */
.part .name {
	margin: 0 0 0 -522px;
	position: absolute;
	left: 50%;
	top: 159px
}

/* 职业描述图 */
.part .text {
	width: 400px;
	height: 101px;
	margin: 0 0 0 -532px;
	position: absolute;
	left: 50%;
	top: 359px
}

/* 攻击类型 / 职业定位 */
.part .dingwei {
	width: 380px;
	height: 80px;
	margin: 0 0 0 -522px;
	position: absolute;
	left: 50%;
	top: 497px;
	font-size: 16px;
	line-height: 27px;
	color: #434850
}

.part .dingwei span {
	display: block;
	background: url(../images/text-box1_6a5b473.png) no-repeat center top;
	width: 87px;
	height: 28px;
	text-align: center;
	margin-bottom: 15px;
	float: left
}

.part .dingwei p {
	float: left;
	margin: 0 0 0 15px
}

.part .zhiye {
	top: 540px
}

/* 四个圆形操作按钮 */
.part .btns {
	width: 342px;
	height: 288px;
	position: relative;
	left: 50%;
	top: 520px;
	margin: 0 0 0 -275px;
	z-index: 11
}

.part .btns .btn {
	width: 165px;
	height: 165px;
	position: absolute;
	color: #fff;
	font-size: 16px;
	line-height: 18px;
	font-weight: 700;
	text-align: center
}

.part .btns .btn:hover {
	text-decoration: none
}

.part .btns .btn p {
	margin-top: 96px
}

.part .btns .play {
	background: url(../images/btn-top_79e7a36.png) no-repeat center top;
	top: 0;
	left: 88px;
	z-index: 16
}

.part .btns .play:hover {
	background: url(../images/btn-top-h_883e720.png) no-repeat center top
}

.part .btns .play.female {
	background: url(../images/btn-top-h_883e720.png) no-repeat center top
}

.part .btns .play.female:hover {
	background: url(../images/btn-top_79e7a36.png) no-repeat center top
}

.part .btns .left {
	background: url(../images/btn-left_28fd7c5.png) no-repeat center top;
	left: 0;
	top: 88px
}

.part .btns .left:hover {
	background: url(../images/btn-left-h_1e79460.png) no-repeat center top
}

.part .btns .left.female {
	background: url(../images/btn-left-h_1e79460.png) no-repeat center top
}

.part .btns .left.female:hover {
	background: url(../images/btn-left_28fd7c5.png) no-repeat center top
}

.part .btns .right {
	background: url(../images/btn-right_31c3248.png) no-repeat center top;
	right: 0;
	top: 88px
}

.part .btns .right:hover {
	background: url(../images/btn-right-h_c19ca16.png) no-repeat center top
}

.part .btns .right.female {
	background: url(../images/btn-right-h_c19ca16.png) no-repeat center top
}

.part .btns .right.female:hover {
	background: url(../images/btn-right_31c3248.png) no-repeat center top
}

.part .btns .bottom {
	background: url(../images/btn-bottom_467aae8.png) no-repeat center top;
	width: 140px;
	height: 109px;
	bottom: 0;
	left: 102px;
	padding: 0;
	text-indent: -9999px;
	z-index: 14;
	opacity: .8
}

.part .btns .bottom:hover {
	opacity: 1
}

/* 底部云纹装饰 */
.part .yun {
	width: 1920px;
	height: 437px;
	background: url(../images/yun_437844c.png) no-repeat center;
	position: absolute;
	bottom: 20px;
	left: 50%;
	margin-left: -960px;
	animation: fadeOutLeft 6s ease infinite
}

/* ============ 5. 各职业专属背景与图（按 HTML 顺序） ============ */
/* -- 武术（凌云寨） -- */
.wushu-wrap {
	background: url(../images/rolelyh_0c2f862.jpg) no-repeat center top
}

.wushu02-wrap {
	background: url(../images/rolelyh_nan_d01ba63.jpg) no-repeat center top
}

.part .wushu-name {
	width: 280px;
	height: 175px;
	background: url(../images/name1.png) no-repeat center
}

.part .wushu-text {
	width: 487px;
	height: 101px;
	background: url(../images/text10_6767b7e.png) no-repeat center
}

/* -- 射术（百花医） -- */
.sheshu-wrap {
	background: url(../images/role3_9cc60bb.jpg) no-repeat center top
}

.sheshu02-wrap {
	background: url(../images/role3_nan_0fe6077.jpg) no-repeat center top
}

.part .sheshu-name {
	width: 280px;
	height: 175px;
	background: url(../images/name2.png) no-repeat center
}

.part .sheshu-text {
	background: url(../images/text3_a651f3b.png) no-repeat center
}

/* -- 仙术（灵宿） -- */
.xianshu-wrap {
	background: url(../images/role10_5d28036.jpg) no-repeat center top
}

.xianshu02-wrap {
	background: url(../images/role3_nan_0fe6077.jpg) no-repeat center top
}

.part .xianshu-name {
	width: 280px;
	height: 175px;
	background: url(../images/name3.png) no-repeat center
}

.part .xianshu-text {
	background: url(../images/text9_33a998b.png) no-repeat center
}

/* -- 法术（寒冰） -- */
.fashu-wrap {
	background: url(../images/role8_5ea7416.jpg) no-repeat center top
}

.fashu02-wrap {
	background: url(../images/role5_nan_3f7962a.jpg) no-repeat center top
}

.part .fashu-name {
	width: 280px;
	height: 175px;
	background: url(../images/name4.png) no-repeat center
}

.part .fashu-text {
	background: url(../images/text8_2ed67e1.png) no-repeat center
}

/* -- 召唤（侠隐） -- */
.zhaohuan-wrap {
	background: url(../images/role1_4112159.jpg) no-repeat center top
}

.zhaohuan02-wrap {
	background: url(../images/role9_1a2673e.jpg) no-repeat center top
}

.part .zhaohuan-name {
	width: 280px;
	height: 175px;
	background: url(../images/name5.png) no-repeat center
}

.part .zhaohuan-text {
	width: 414px;
	height: 101px;
	background: url(../images/text1_a07b3d2.png) no-repeat center
}

/* -- 刺客（少林） -- */
.cike-wrap {
	background: url(../images/role6_565f70e.jpg) no-repeat center top
}

.cike02-wrap {
	background: url(../images/rolelyh_nan_d01ba63.jpg) no-repeat center top
}

.part .cike-name {
	width: 280px;
	height: 175px;
	background: url(../images/name6.png) no-repeat center
}

.part .cike-text {
	background: url(../images/text6_3be9ba3.png) no-repeat center
}

/* -- 卫士（天煞） -- */
.weishi-wrap {
	background: url(../images/role2_312b8d9.jpg) no-repeat center top
}

.weishi02-wrap {
	background: url(../images/role7_6cceef9.jpg) no-repeat center top
}

.part .weishi-name {
	width: 280px;
	height: 175px;
	background: url(../images/name7.png) no-repeat center
}

.part .weishi-text {
	width: 414px;
	height: 101px;
	background: url(../images/text2_09bab15.png) no-repeat center
}

/* -- 枪术（蜀山） -- */
.qiangshu-wrap {
	background: url(../images/role7_6cceef9.jpg) no-repeat center top
}

.qiangshu02-wrap {
	background: url(../images/role9_1a2673e.jpg) no-repeat center top
}

.part .qiangshu-name {
	width: 280px;
	height: 175px;
	background: url(../images/name8.png) no-repeat center
}

.part .qiangshu-text {
	background: url(../images/text7_fec0ef0.png) no-repeat center
}

.part .qiangshu02-text {
	background: url(../images/text7_fec0ef0.png) no-repeat center
}

/* ============ 6. 男女切换菱形按钮 ============ */
.part .sex-switch {
	position: absolute;
	left: 50%;
	margin-left: -455px;
	top: 595px;
	z-index: 12;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 20px;
	width: 130px;
	height: 60px
}

.part .sex-switch .sex-btn {
	width: 55px;
	height: 55px;
	flex: 0 0 55px;
	display: block;
	padding: 0;
	border: 0;
	box-sizing: content-box;
	position: relative;
	background-color: rgba(150,175,205,.9);
	background-image: none;
	clip-path: polygon(50% 0%,100% 50%,50% 100%,0% 50%);
	cursor: pointer;
	opacity: .35;
	filter: grayscale(.75);
	animation: none;
	transition: opacity .22s ease, filter .22s ease
}

/* 内层菱形：端正的文字图，inset 2px 露出外层菱形边 */
.part .sex-switch .sex-btn::before {
	content: "";
	position: absolute;
	left: 2px;
	top: 2px;
	right: 2px;
	bottom: 2px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	clip-path: polygon(50% 0%,100% 50%,50% 100%,0% 50%)
}

.part .sex-switch .sex-nv {
	z-index: 2
}

.part .sex-switch .sex-nv::before {
	background-image: url(../images/sex-nv.png)
}

.part .sex-switch .sex-nan::before {
	background-image: url(../images/sex-nan.png)
}

.part .sex-switch .sex-btn:hover {
	opacity: .8;
	filter: grayscale(.15)
}

.part .sex-switch .sex-btn.active {
	opacity: 1;
	background-color: #ffd76a;
	/* drop-shadow 跟随 clip-path 菱形轮廓形成外发光（box-shadow 会被裁剪） */
	filter: grayscale(0) drop-shadow(0 0 5px rgba(255,200,90,.9));
	z-index: 3
}

/* ============ 7. 左侧竖排导航 ============ */
.slide-nav {
	display: none;
	width: 130px;
	height: 680px;
	min-height: 680px;
	position: absolute;
	left: 50%;
	top: 55%;
	margin: -380px 0 0 -635px;
	overflow: visible;
	background: none;
	z-index: 10
}

.slide-nav a {
	box-sizing: content-box;
	/* 左侧虚线（由逐职业背景图保留规则的层叠关系，以下 background 属性需 !important 保证虚线生效） */
	background-color: transparent;
	background-image: linear-gradient(to bottom, rgba(180,160,120,.7) 0, rgba(180,160,120,.7) 4px, transparent 4px, transparent 8px) !important;
	background-size: 1px 8px !important;
	background-repeat: repeat-y !important;
	background-position: 0 0 !important;
	background-clip: border-box;
	background-origin: border-box;
	color: #333;
	font-size: 18px;
	font-family: "Microsoft YaHei","微软雅黑",sans-serif;
	font-weight: 600;
	text-align: left;
	line-height: 50px;
	height: 50px;
	width: 90px;
	margin: 0;
	padding: 8px 0 8px 34px;
	border: 0;
	display: block;
	position: relative;
	text-decoration: none;
	opacity: .95;
	letter-spacing: 2px;
	white-space: nowrap;
	text-shadow: 0 1px 2px rgba(255,255,255,.65), 0 0 1px rgba(51,51,51,.35);
	transition: all .22s ease
}

.slide-nav a:hover,.slide-nav a.active {
	background-image: linear-gradient(to bottom, rgba(13,91,71,.95) 0, rgba(13,91,71,.95) 4px, transparent 4px, transparent 8px) !important;
	background-size: 1px 8px !important;
	background-repeat: repeat-y !important;
	background-position: 0 0 !important;
	color: #0d5b47;
	font-weight: 800;
	opacity: 1;
	text-shadow: 0 0 6px rgba(13,91,71,.55), 0 1px 2px rgba(0,0,0,.4);
	text-decoration: none
}

/* 小菱形指示器：对准左侧虚线中心 */
.slide-nav a:hover::before,.slide-nav a.active::before {
	content: "";
	display: block;
	width: 12px;
	height: 12px;
	background: #0d5b47;
	transform: rotate(45deg);
	position: absolute;
	left: -5.5px;
	top: 33px;
	margin-top: -6px;
	box-shadow: 0 0 4px rgba(13,91,71,.7);
	z-index: 2
}

/* hover tooltip */
.slide-nav a::after {
	display: none;
	content: attr(title);
	position: absolute;
	left: 100%;
	top: 50%;
	margin: -18px 0 0 2px;
	padding: 6px 14px;
	background: rgba(0,0,0,.78);
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 1px;
	white-space: nowrap;
	border: 1px solid rgba(13,91,71,.45);
	border-radius: 3px;
	z-index: 99999;
	text-shadow: none;
	line-height: 1.4;
	box-shadow: 0 2px 10px rgba(0,0,0,.6);
	pointer-events: none
}

.slide-nav a:hover::after {
	display: block
}

/* ---- 原各职业导航点背景图（已被上方虚线 gradient 覆盖，保留备查） ---- */
.slide-nav .wushu {
	background: url(../images/ts_dbec2b8.png) no-repeat center
}

.slide-nav .wushu:hover,.slide-nav .wushu.active {
	background: url(../images/ts-h_a08cffc.png) no-repeat center
}

.slide-nav .sheshu {
	background: url(../images/ls_9a96635.png) no-repeat center
}

.slide-nav .sheshu:hover,.slide-nav .sheshu.active {
	background: url(../images/ls-h_5f0702d.png) no-repeat center
}

.slide-nav .xianshu {
	background: url(../images/ls_9a96635.png) no-repeat center
}

.slide-nav .xianshu:hover,.slide-nav .xianshu.active {
	background: url(../images/ls-h_5f0702d.png) no-repeat center
}

.slide-nav .fashu {
	background: url(../images/hb_76c45fb.png) no-repeat center
}

.slide-nav .fashu:hover,.slide-nav .fashu.active {
	background: url(../images/hb-h_1a44ff3.png) no-repeat center
}

.slide-nav .zhaohuan {
	background: url(../images/yx_58499bb.png) no-repeat center
}

.slide-nav .zhaohuan:hover,.slide-nav .zhaohuan.active {
	background: url(../images/yx-h_4bd874b.png) no-repeat center
}

.slide-nav .cike {
	background: url(../images/sl_09622bf.png) no-repeat center
}

.slide-nav .cike:hover,.slide-nav .cike.active {
	background: url(../images/sl-h_d569f2b.png) no-repeat center
}

.slide-nav .weishi {
	background: url(../images/ts_dbec2b8.png) no-repeat center
}

.slide-nav .weishi:hover,.slide-nav .weishi.active {
	background: url(../images/ts-h_a08cffc.png) no-repeat center
}

.slide-nav .qiangshu {
	background: url(../images/ss_a1a4042.png) no-repeat center
}

.slide-nav .qiangshu:hover,.slide-nav .qiangshu.active {
	background: url(../images/ss-h_845e4a4.png) no-repeat center
}

.slide-nav .home {
	background: url(../images/ls-h_5f0702d.png) no-repeat center
}

.slide-nav .home:hover,.slide-nav .home.active {
	background: url(../images/hb-h_1a44ff3.png) no-repeat center
}

/* ============ 8. 向下切换箭头 ============ */
.down {
	background: url(../images/down_d22ee42.png) no-repeat center top;
	width: 151px;
	height: 126px;
	position: fixed;
	left: 50%;
	margin-left: -75px;
	bottom: -45px !important;
	cursor: pointer;
	z-index: 22;
	transform: translate3d(0,0,0);
	backface-visibility: hidden;
	animation: fd 1.8s infinite ease
}

.down:hover {
	filter: brightness(1.2) drop-shadow(0 0 8px rgba(255,255,255,.6))
}

/* ============ 9. 了解更多弹窗（#popCode） ============ */
.js-pop {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	width: 100vw !important;
	height: 100vh !important;
	z-index: 99999 !important;
	background: transparent !important;
	font-family: "Microsoft YaHei"
}

.js-pop .shade {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	width: 100vw !important;
	height: 100vh !important;
	z-index: 999999;
	background-color: rgba(0,0,0,.68) !important;
	filter: none !important
}

.js-pop .content {
	position: fixed;
	z-index: 1000000;
	width: 918px;
	height: 518px;
	background: url(../images/pop-bg_f3743b5.png) no-repeat center;
	left: 50%;
	margin-left: -459px;
	top: 50%;
	margin-top: -259px
}

.js-pop .close {
	width: 48px;
	height: 48px;
	position: absolute;
	left: 50%;
	margin-left: 475px;
	top: 0;
	z-index: 9999;
	background: url(../images/close_ccab1cf.png) no-repeat center;
	cursor: pointer;
	transition: transform ease-in-out .5s
}

.js-pop .close:hover {
	transform: rotate(360deg)
}

.js-pop .content .pop-title {
	margin: 57px 0 0 58px
}

.js-pop .content .txt {
	display: none;
	width: 802px;
	height: auto;
	text-align: left;
	color: #333;
	line-height: 25px;
	font-size: 16px;
	margin: 45px auto 0;
	text-indent: 18px
}

.js-pop .content .txt.show {
	display: block
}

.js-pop .content .txt p {
	margin: 0 0 8px;
	padding: 0
}

.js-pop .content .txt p:last-child {
	margin-bottom: 0
}

.js-pop .content .txt br {
	display: none
}

/* ============ 10. 视频弹窗（#popVideo） ============ */
#popVideo {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	width: 100vw !important;
	height: 100vh !important;
	z-index: 99999 !important;
	background: transparent !important;
	font-family: "Microsoft YaHei"
}

#popVideo .shade {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	width: 100vw !important;
	height: 100vh !important;
	z-index: 999999;
	background-color: rgba(0,0,0,.68) !important;
	filter: none !important
}

#popVideo .content {
	position: fixed !important;
	top: 50% !important;
	left: 50% !important;
	margin-left: -459px !important;
	margin-top: -323.5px !important;
	width: 918px !important;
	height: 647px !important;
	background: url(../images/pop-bg2_1813ac9.png) no-repeat center !important;
	z-index: 1000000 !important;
	overflow: visible !important
}

#popVideo .close {
	width: 48px;
	height: 48px;
	position: absolute !important;
	top: 0 !important;
	left: 100% !important;
	right: auto !important;
	bottom: auto !important;
	margin: 0 !important;
	z-index: 99999 !important;
	background: url(../images/close_ccab1cf.png) no-repeat center;
	cursor: pointer;
	transition: transform ease-in-out .5s
}

#popVideo .close:hover {
	transform: rotate(360deg)
}

#popVideo .title {
	margin: 60px auto 0 !important;
	width: 802px !important;
	height: 36px !important;
	line-height: 36px !important;
	text-align: center !important;
	display: block !important;
	color: #ffd272 !important;
	font-size: 24px !important;
	font-weight: 600 !important;
	font-family: "Microsoft YaHei","微软雅黑",sans-serif !important;
	letter-spacing: 2px !important;
	text-shadow: 0 2px 6px rgba(0,0,0,.9), 0 0 12px rgba(255,190,80,.4) !important;
	position: relative !important
}

/* 标题下金色渐变细线 */
#popVideo .title::after {
	content: "" !important;
	display: block !important;
	position: absolute !important;
	left: 50% !important;
	margin-left: -351px !important;
	bottom: -20px !important;
	width: 702px !important;
	height: 1px !important;
	background: linear-gradient(to right, transparent 0%, rgba(255,210,114,.3) 15%, rgba(255,210,114,.8) 50%, rgba(255,210,114,.3) 85%, transparent 100%) !important;
	box-shadow: 0 0 6px rgba(255,210,114,.5) !important
}

#popVideo .content .m-video-con {
	width: 890px !important;
	height: 430px !important;
	margin: 40px auto 0 !important;
	background: #000 !important;
	overflow: hidden !important;
	text-align: center !important
}

#popVideo .content .m-video-con video {
	width: 890px !important;
	height: 430px !important;
	margin: 0 auto !important;
	padding: 0 !important;
	display: block !important;
	border: 0 !important;
	background: #000 !important
}

/* ============ 11. 动画关键帧（每套仅一份） ============ */
@keyframes bounceInDown {
	0% {
		opacity: 0;
		transform: translate3d(0,-100%,0)
	}

	60% {
		opacity: 1;
		transform: translate3d(0,8%,0)
	}

	75% {
		transform: translate3d(0,-5%,0)
	}

	90% {
		transform: translate3d(0,2.5%,0)
	}

	100% {
		transform: translate3d(0,0,0)
	}
}

@keyframes fadeInUp {
	0% {
		opacity: 0;
		transform: translate3d(0,20px,0)
	}

	100% {
		opacity: 1;
		transform: none
	}
}

@keyframes fadeInLeft {
	0% {
		opacity: 0;
		transform: translate3d(-100px,0,0)
	}

	100% {
		opacity: 1;
		transform: none
	}
}

@keyframes fadeInRight {
	0% {
		opacity: 0;
		transform: translate(100px,0)
	}

	100% {
		opacity: 1;
		transform: none
	}
}

@keyframes fadeInDown {
	0% {
		opacity: 0;
		transform: translate3d(0,-100%,0)
	}

	100% {
		opacity: 1;
		transform: none
	}
}

@keyframes fadeOutLeft {
	0% {
		opacity: 1;
		transform: translate3d(100px,0,0)
	}

	50% {
		opacity: 0;
		transform: translate3d(-100px,0,0)
	}

	100% {
		opacity: 1;
		transform: translate3d(100px,0,0)
	}
}

@keyframes fadeOutRight {
	0% {
		opacity: 1;
		transform: translate3d(100px,0,0)
	}

	50% {
		opacity: 0;
		transform: translate3d(-100px,0,0)
	}

	100% {
		opacity: 1;
		transform: translate3d(100px,0,0)
	}
}

@keyframes fd {
	0% {
		transform: translateY(0);
		opacity: 1
	}

	40% {
		transform: translateY(18px);
		opacity: .55
	}

	80% {
		transform: translateY(0);
		opacity: 1
	}

	100% {
		transform: translateY(0);
		opacity: 1
	}
}

/* 职业背景大图：从右向左滑入（仅移动背景，内容保持原位） */
@keyframes bgSlideInRight {
	0% {
		background-position: calc(50% + 700px) top
	}

	100% {
		background-position: center top
	}
}

/* ============ 12. 隐藏元素与滚动锁定 ============ */
#NIE-topBar {
	display: none !important;
	height: 0 !important
}

.share,#NIE-share,.NIE-share,#NIE-copyRight {
	display: none !important;
	width: 0 !important;
	height: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	overflow: hidden !important;
	visibility: hidden !important;
	opacity: 0 !important;
	pointer-events: none !important
}