/* ========== 全局重置 ========== */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html, body {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
}

a {
  text-decoration: none;
}

/* ========== 页面容器 ========== */
.page-container {
  width: 100%;
  height: 100%;
  position: relative;
}

/* ========== 滑动容器 ========== */
.swiper-container {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}

/* ========== 每一页 ========== */
.swiper-page {
  width: 100%;
  height: 100%;
  padding: 2%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: center;
  cursor: default;
  position: absolute;
  top: 0;
  left: 0;
  transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* 页面位置偏移 */
.swiper-page[data-index="0"] { transform: translateY(0); }
.swiper-page[data-index="1"] { transform: translateY(100%); }
.swiper-page[data-index="2"] { transform: translateY(100%); }

/* ========== 背景图 ========== */
.page_bg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
}

/* ========== 内容区 ========== */
.content_box {
  width: 100%;
  max-width: 1280pt;
  min-width: 1000pt;
  height: 100%;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

/* ========== Logo 区 ========== */
.logo_box {
  width: 80%;
  margin: 0 auto 0 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  align-content: center;
}

.logo_box > img {
  width: 10%;
  border-radius: 2rem;
}

.logo_box p {
  color: #FFFFFF;
  font-size: 3rem;
  padding-left: 1rem;
}

/* ========== 页面内容布局 ========== */
.page_content {
  width: 84%;
  height: 85%;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  align-content: center;
  position: relative;
  z-index: 1;
}

.page_content img {
  width: 100%;
  height: 100%;
  display: block;
}

/* ========== 左右列 ========== */
.content_right,
.content_left {
  width: 50%;
}

.content_right {
  height: 75%;
}

.content_left img {
  border-radius: .5rem;
  border: .0625rem solid white;
  overflow: hidden;
}

.content_right img {
  margin: 0 auto;
  border-radius: .5rem;
  border: .0625rem solid white;
}

.content_left_box {
  width: 70%;
  margin: 0 auto;
}

/* ========== 下载按钮(已注释) ========== */
.download_btn {
  width: 40%;
  height: 3rem;
  background: white;
  border-radius: 2rem;
  text-align: center;
  line-height: 3rem;
  margin-top: 2rem;
  font-weight: bold;
  font-size: 1.8rem;
  color: #F16243;
}

.download_btn a {
  color: #F16243;
  font-weight: bold;
  font-size: 1.8rem;
}

/* ========== 全局图片 ========== */
.swiper-page img {
  display: block;
  cursor: default;
}

/* ========== 箭头动画 ========== */
.jiantou {
  margin: 0 auto;
  position: absolute;
  width: 48pt;
  height: 28pt;
  z-index: 2;
  cursor: pointer;
  animation: movepoint 0.5s infinite;
  animation-direction: alternate;
  animation-play-state: running;
  animation-timing-function: linear;
  bottom: 1.7rem;
}

@keyframes movepoint {
  0%   { bottom: 0.8rem; }
  100% { bottom: 1.7rem; }
}

/* ========== 信息文本 ========== */
.info_box > p:first-child {
  font-size: 4rem;
}

.info_box > p {
  margin-bottom: 1rem;
  font-size: 2rem;
  color: white;
}

/* ========== ICP 底部信息区 ========== */
.icp_box {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 8pt;
  text-align: center;
  background-color: #121314;
  font-size: 12pt;
  color: #888989;
  z-index: 2;
}

.icp_box > p {
  margin: 2px 0;
}

.icp_box > p > a {
  color: #888989;
}

/* ========== 微信提示遮罩 ========== */
.tip_box {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
}

.tip_box img {
  display: block;
  width: 20%;
  height: 150px;
  padding-right: 0.5rem;
  float: right;
}

.tip_box p {
  margin-top: 90px;
  color: #FFFFFF;
  text-align: right;
  float: left;
  width: 80%;
  padding-right: 1rem;
}

/* ========== 响应式：小屏设备 ========== */
@media (max-width: 768px) {
  .content_box {
    min-width: unset;
    max-width: unset;
  }

  .logo_box {
    width: 90%;
  }

  .logo_box > img {
    width: 18%;
  }

  .logo_box p {
    font-size: 1.5rem;
  }

  .page_content {
    width: 92%;
    height: 80%;
    flex-direction: column;
  }

  .content_right,
  .content_left {
    width: 100%;
    height: auto;
  }

  .content_right {
    order: 1;
    display: flex;
    justify-content: center;
    margin-bottom: 1rem;
  }

  .content_left {
    order: 2;
  }

  .content_left_box {
    width: 90%;
    text-align: center;
  }

  .info_box > p:first-child {
    font-size: 1.6rem;
  }

  .info_box > p {
    font-size: 1rem;
    margin-bottom: 0.5rem;
  }

  .jiantou {
    width: 32pt;
    height: 18pt;
  }

  @keyframes movepoint-resp {
    0%   { bottom: 0.4rem; }
    100% { bottom: 1rem; }
  }

  .jiantou {
    animation-name: movepoint-resp;
    bottom: 1rem;
  }

  .icp_box {
    font-size: 10pt;
    padding: 4pt;
  }

  .tip_box img {
    width: 30%;
    height: 100px;
  }

  .tip_box p {
    width: 70%;
    margin-top: 60px;
    font-size: 0.9rem;
  }
}
