@charset "utf-8";
*{margin:0; padding:0; list-style:none}
*, *:before, *:after {box-sizing:inherit;}
a{color:#000; text-decoration:none; outline:none;}
a:hover{color:#000; text-decoration:underline; outline:none;}
*:not(input):not(textarea) {
  -webkit-touch-callout:none;/* 禁用系统默认菜单 */
	-webkit-user-select:none;/* 禁用选择复制 */
  user-select:none;
}
.wow{visibility: hidden;}
.none{display:none;}

body{
	width:100%;
  overflow:hidden;
  overflow-y: auto;
	font:100%/1.5 Helvetica,sans-serif;
	color:#333;
	background:#fff;
}

#pageContain{
	overflow:hidden;
	display:none;
}
.page{
  position:absolute;
	width:100%;
	height:100%;
	overflow:hidden;
}
.contain{
  position:relative;
	width:100%;
	height:100%;
	overflow:hidden;
  display:none;
}
.contain ul {position:absolute; width:100%; height:100%; margin:0; padding:0;}
.contain ul li img{position:absolute; z-index:10;}
.contain ol img{position:absolute; z-index:10;}
.current .contain,.slide .contain{
	display:block;
}
.current {
	display:block;
	z-index:1;
}
.slide {
	display:block;
	z-index:2;
}
.swipe {
	display:block;
	z-index:3;
	-webkit-transition-duration:0ms !important;
  transition-duration:0ms !important;
}

/* 页面导航 */
/*#navBar {
	z-index:3;
	position:absolute;
	top:10%;
	right:3%;
}
#navBar .active {
	background:#ccc;
}
#navBar li {
	cursor:pointer;
	margin-bottom:10px;
	transition:all .7s ease;
	border-radius:50%;
	line-height:0.3rem;
	text-align:center;
	width:0.3rem;
	height:0.3rem;
}

#prev,#next {
	z-index:4;
	text-align: center;
	line-height:1rem;
	position: absolute;
	width:1rem;
	height:1rem;
	top:50%;
	cursor:pointer;
	margin-top:-0.5rem;
	font-size:1rem;
	color:rgba(255,255,255,0.5);
}
#prev {
	left:0
}
#next {
	right:0
}*/

/* 页面背景 */
.page2,.page3,.page4,.page5,.page6,.page7,.page8,.page9{background:url('../images/002.jpg') no-repeat 50%;}
.page1,.page2,.page3,.page4,.page5,.page6,.page7,.page8,.page9{
  -webkit-background-size:cover;
  -moz-background-size:cover;
  -ms-background-size:cover;
  -o-background-size:cover;
  background-size:cover;
}
/* .page1,.page2,.page3,.page4,.page5,.page6,.page7,.page8,.page9{
  filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale')";
  -webkit-background-size:100% 100%;
  -moz-background-size:100% 100%;
  -ms-background-size:100% 100%;
  -o-background-size:100% 100%;
  background-size:100% 100%;
} */

.page1{
  height: 271.63rem;
  background-image: url('../images/bg_1.jpg'),url('../images/bg_2.jpg'),url('../images/bg_3.jpg'),url('../images/bg_4.jpg');
  background-position: center top, center 68.06rem, center 130rem, center 193.47rem;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.page2{
  display: none;
  height: 100%;
}

/* 动图上下边缘雾化：渐变透明融入下层背景，消除拼接硬边；
   mask 纯视觉不影响事件，旧浏览器不支持时自动保持现状 */
.dh img{
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 0.2rem, #000 calc(100% - 0.2rem), transparent 100%);
          mask-image: linear-gradient(180deg, transparent 0, #000 0.2rem, #000 calc(100% - 0.2rem), transparent 100%);
}

/* 新闻容器 */
.xw iframe{
  z-index: 20;
  position:absolute;
  left:0.5rem;
  width:6.53rem;
  height:6.55rem;
  background:#fff url('../images/xw_bg.png') no-repeat 50%;
  background-size:100% 100%;
  padding:0.2rem;
}

/* 弹窗 */
.pop_img{
  z-index: 99;
  position: fixed;
  width: 100%;
  box-sizing: border-box;

  display: none;
}
.pop_img img{
  position: absolute;
  width: 100%;
}

/* 自适应框架（设计图宽度） */
body {
	max-width:7.5rem;
	margin:0 auto;
}
body * {
	max-width:7.5rem;
}

/* 启动页 */
#index{
  z-index:99;
	position:absolute;
	width:100%;
	height:100%;
  overflow:hidden;
	background-image:url('../images/bg_0.jpg');
  background-repeat: no-repeat;
  background-position: center top;
	background-size:100% auto;
	display:none;
}
#index img{position:absolute;}

/* 延迟显示的元素（点击 btn_next 后才出现） */
.late-show { display: none; }

/* 封面底图：000-0 静态 png，遮盖期间唯一显示的内容图；
   手指放开后由 main.js 把 src 切换为动画 webp（data-anim-src，尺寸与原图 320:568 一致） */
.index-cover {
  position: absolute;
  width: 3.07rem;
  height: 5.45rem;
  top: 2.27rem;
  left: 2rem;
}

/* 封面其余图片列表：遮盖期间整体隐藏，手指放开后由 main.js 显示并触发 wow 动画 */
.index-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: none;
}
.index-list.show { display: block; }

/* 启动页黑色遮罩 + 透明圆环洞 */
.reveal-mask {
  z-index: 999;
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: #000;
  /* 初始圆环在左上角（边缘羽化 0.5rem，与 main.js 中 RING_FEATHER 一致） */
  -webkit-mask-image: radial-gradient(circle at 1rem 1rem, transparent 0, transparent 1.8rem, rgba(0,0,0,0.12) 1.925rem, rgba(0,0,0,0.35) 2.05rem, rgba(0,0,0,0.7) 2.175rem, black 2.3rem);
          mask-image: radial-gradient(circle at 1rem 1rem, transparent 0, transparent 1.8rem, rgba(0,0,0,0.12) 1.925rem, rgba(0,0,0,0.35) 2.05rem, rgba(0,0,0,0.7) 2.175rem, black 2.3rem);
  -webkit-mask-size: 100% 100%;
          mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-tap-highlight-color: transparent;
  pointer-events: none;
}

/* 圆环拖动提示图（背景图 + 闪烁动画，按住圆环后由 JS 隐藏） */
.drag-hint {
  z-index: 1000;
  position: absolute;
  width: 2.84rem;
  height: 2.13rem;
  background: url('../images/arrow_ss.png') no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
  -webkit-animation: blink-arrow 1s ease-in-out infinite;
          animation: blink-arrow 1s ease-in-out infinite;
}

/* 按钮右下角提示箭头（闪烁动画，点击按钮后由 JS 隐藏） */
.btn-arrow {
  z-index: 10;
  position: absolute;
  width: 1.69rem;
  height: 2.21rem;
  background: url('../images/arrow_s.png') no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
  -webkit-animation: blink-arrow 1s ease-in-out infinite;
          animation: blink-arrow 1s ease-in-out infinite;
}

@-webkit-keyframes blink-arrow {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.15; }
}

@keyframes blink-arrow {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.15; }
}

/* 路线图（占位 img / 替换后的 SVG 同用），层序与原 img 一致 */
.route-track { position:absolute; z-index:10; pointer-events:none;}

/* 内嵌外联文章弹窗 */
#pop_iframe{
  z-index:100;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
  overflow:hidden;
	background:rgba(0, 0, 0, 0.7);
	display:none;
}
#pop_iframe .close{
	position:absolute;
	top:0.3rem;
	left:50%;
	transform:translateX(-50%);
  color:#fff;
  font-size:10vmin;
	cursor:pointer;
}
#pop_iframe iframe{
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	height:90%;
}

/* 箭头 */
.arrow_u {
  display: none;
  z-index:9999;
  position:fixed;
  bottom:0.2rem;
  left:50%;
  width:0.5rem;
  height:0.25rem;
  background-image:url("../images/arrow_u.png");
  background-size:100%;
  -webkit-transform:translateX(-50%);
  transform:translateX(-50%);
  -webkit-animation:arrow_u 1s linear 0s infinite alternate;
  animation:arrow_u 1s linear 0s infinite alternate;
}
@-webkit-keyframes arrow_u {
  from {bottom:0.1rem;}
  to {bottom:0.3rem;}
}
@keyframes arrow_u {
  from {bottom:0.1rem;}
  to {bottom:0.3rem;}
}

/*微信分享*/
#mcover{
  position:fixed;
  width:100%;
  height:100%;
  background:rgba(0, 0, 0, 0.7);
  z-index:10000;

  display:none;
}
#mcover img{
  position:fixed;
  top:0.1rem;
  width:100%;
  height:auto;
  z-index:10001;
}
.wx_btn{position:relative; z-index:9999; cursor:pointer;}

.btn_go,.btn_next,.btn_prev,.btn_end,.btn_url{cursor:pointer;}

/* 移动端自适应 */
@media screen and (max-aspect-ratio: 9/16.11111) {
  /* .contain{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    height:auto;
    aspect-ratio: 9/16;
  } */
}
