/* å…¨å±€åˆå§‹åŒ– */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent; /* ç§»é™¤ç‚¹å‡»é«˜äº® */
}

body {
  line-height: 1;
  font-family: Arial, sans-serif;
  overflow-x: hidden; /* å…¨å±€ç¦æ­¢æ¨ªå‘æ»šåŠ¨ */
}

/* åŸºç¡€æ ·å¼ï¼ˆä¿æŒä¸å˜ï¼‰ */
body,
ol,
ul,
h1,
h2,
h3,
h4,
h5,
h6,
p,
th,
td,
dl,
dd,
form,
fieldset,
legend,
input,
textarea,
select,
header,
footer,
div {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  line-height: 1;
  background: #fff;
  -webkit-text-size-adjust: 100%;
  color: #1e1e1e;
  font-family: Arial;
}
input[type='text'],
input[type='button'],
input[type='submit'],
input[type='reset'],
select,
textarea,
button {
  -webkit-appearance: none;
}
input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 100px white inset;
}
a {
  color: #1e1e1e;
  text-decoration: none!important;
}
a:hover {
  text-decoration: none!important;
}
em {
  font-style: normal;
}
li {
  list-style: none;
}
img {
  border: 0;
  vertical-align: middle;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
p {
  word-wrap: break-word;
}
.fontB {
  text-transform: uppercase;
}
.line1, .line2, .line3 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}
.line1 { -webkit-line-clamp: 1; }
.line2 { -webkit-line-clamp: 2; }
.line3 { -webkit-line-clamp: 3; }
.flex {
  display: flex;
  align-items: center;
}
@media screen and (min-width: 1680px) { html { font-size: 16px; } }
@media screen and (max-width: 1679px) and (min-width: 1440px) { html { font-size: 14px; } }
@media screen and (max-width: 1439px) and (min-width: 1360px) { html { font-size: 13px; } }
@media screen and (max-width: 1359px) { html { font-size: 12px; } }
@media screen and (min-width: 1000px) { .pc-hide { display: none!important; } }
@media screen and (max-width: 540px) { html { font-size: 72px; } }
@media screen and (max-width: 480px) { html { font-size: 64px; } }
@media screen and (max-width: 414px) { html { font-size: 55.2px; } }
@media screen and (max-width: 375px) { html { font-size: 50px; } }
@media screen and (max-width: 360px) { html { font-size: 48px; } }
@media screen and (max-width: 320px) { html { font-size: 42.6px; } }
.container {
  width: 100%;
  padding: 5rem 0;
  padding-left: 12%;
  padding-right: 12%;
}

/* å¤´éƒ¨å¯¼èˆªï¼ˆPCç«¯ï¼‰ */
header {
  background: #fff;
  padding: 0 1.875rem;
}
header .down_box {
  position: relative;
}

header .down2 {
    position: absolute;
    left: -300%;
    margin-left: 35rem;
    width: 26rem;
    bottom: -25.8375rem;
    padding: 1.875rem 1.875rem 1.875rem 1.875rem;
    background: #fff;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    transition: all 0.36s;
    z-index: 10000;
    border-top: 1px solid #13115c;
    opacity: 0;
    visibility: hidden;
    flex-wrap: wrap;
    flex-direction: column;
    align-content: space-between;
}
header .down2 a {
  font-size: 1.2rem;
  color: #13115c;
  white-space: nowrap;
  padding: 0.5rem 1.875rem;
}

header .a_box:hover .down2 {
  opacity: 1;
  visibility: visible;
}



header .down {
position: absolute;
    left: -300%;
    margin-left: 0rem;
    width: 14rem;
    bottom: -21.4rem;
    padding: 1.875rem 1.875rem 1.875rem 1.875rem;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    transition: all 0.36s;
    z-index: 10000;
    border-top: 1px solid #13115c;
    opacity: 0;
    visibility: hidden;
    flex-wrap: wrap;
    flex-direction: column;
    align-content: space-between;
}
header .down a {
  font-size: 1.2rem;
  color: #13115c;
  white-space: nowrap;
  padding: 0.5rem 1.875rem;
}
header .down.active {
  opacity: 1;
  visibility: visible;
}
header .left {
  width: 70%;
  justify-content: space-between;
}
header .logo img {
  width: 10.5rem;
  height: auto;
}
header nav {
  flex: 1;
  padding-left: 26%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
header .a_box:hover .down {
  opacity: 1;
  visibility: visible;
  left: 0; /* ç¡®ä¿é¼ æ ‡æ‚¬åœæ—¶æ˜¾ç¤ºåœ¨æ­£ç¡®ä½ç½® */
}

header nav .a_box > a {
  padding: 0 2.5rem;
  height: 7.5rem;
  transition: all 0.36s;
  position: relative; /* ç¡®ä¿ a å…ƒç´ ä¸ºå®šä½å…ƒç´  */
}
header nav .a_box > a:hover {
  background: #13115c;
}
header nav .a_box > a:hover em {
  color: #fff;
}
header nav .a_box > a:hover path {
  fill: #fff;
}
header nav svg {
  width: 1.875rem;
  height: 1.875rem;
}
header nav em {
  font-size: 1.2rem;
  color: #13115c;
}

/* ç§»åŠ¨ç«¯å¯¼èˆª */
.mobile-header {
  display: none;
  justify-content: space-between;
  align-items: center;
  padding: 1rem;
  width: 100%;
  box-sizing: border-box;
  background: #fff;
  position: sticky;
  top: 0;
  z-index: 1000;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
.mobile-logo img {
  width: 8rem;
}
.mobile-menu-btn {
  font-size: 2rem;
  color: #13115c;
}
.mobile-nav {
  display: none;
  flex-direction: column;
  gap: 1rem;
  padding: 1rem;
  background: #fff;
  width: 100%;
  box-sizing: border-box;
}
.mobile-nav a {
  display: block;
  padding: 1.2rem 1.5rem;
  font-size: 1.4rem;
  color: #13115c;
  border-bottom: 1px solid #e6e7e9;
}

/* äº§å“åˆ—è¡¨ï¼ˆPCç«¯4åˆ—ï¼‰ */
.home_banner {
  margin-bottom: 3.75rem;
  overflow: hidden; /* ç¡®ä¿bannerä¸æº¢å‡º */
}
.home_banner img {
  width: 100%;
  height: auto;
  max-width: 100%; /* é˜²æ­¢å›¾ç‰‡å®½åº¦è¶…å‡ºå®¹å™¨ */
}
.home_server {
  width: 100%;
  padding-left: 12%;
  padding-right: 12%;
}
.home_server .worp a {
  width: calc(25% - calc(3 / 4 * 20px));
  margin-right: 20px;
  overflow: hidden;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  transition: all 0.36s;
}
.home_server .worp a:nth-child(4n) {
  margin-right: 0;
}
.home_server .worp a:hover {
  box-shadow: 0 0 10px rgba(19, 17, 92, 0.5);
}
.home_server .worp a > img {
  width: 100%;
  height: 11.125rem;
  object-fit: cover;
}
.home_server .worp a .text_box {
  padding: 1.625rem;
}
.home_server .worp a .text_box .h {
  color: #13115c;
  font-size: 1rem;
  font-weight: bold;
  margin-bottom: 1.375rem;
}
.home_server .worp a .text_box .p {
  color: #414141;
  font-size: 0.875rem;
  line-height: 1.6;
}
.home_server .worp a .text_box .more {
  display: flex;
  align-items: center;
  margin-top: 1.625rem;
}
.home_server .worp a .text_box .more img {
  width: 1.25rem;
  height: auto;
}
.home_server .worp a .text_box .more span {
  color: #13115c;
  font-size: 0.875rem;
  margin-left: 0.625rem;
}

/* å…¶ä»–é¡µé¢å…ƒç´  */
.home_line {
  width: 100%;
  height: 1px;
  background: #e6e7e9;
  margin-bottom: 5.25rem;
  margin-top: 4rem;
}
.home_about {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 4.375rem;
  background-position: 83% -38% !important;
  background-size: 30%!important;
}
.home_about .h {
  font-size: 2rem;
  color: #13115c;
}
.home_about .p {
  width: 30%;
  text-align: center;
  margin-top: 1.875rem;
  margin-bottom: 2.5rem;
}
.home_about .p p {
  font-size: 0.9375rem;
  color: #414141;
  line-height: 1.6;
}
.home_about .img {
  width: 30%;
  height: auto;
}
.home_contact {
  background: #f1f3f6;
  flex-direction: column;
  padding-top: 5.625rem;
  padding-bottom: 4.6875rem;
}
.home_contact .h {
  text-align: center;
  font-size: 1.625rem;
  color: #13115c;
  margin-bottom: 2.125rem;
  line-height: 1.4;
}
.home_contact p {
  font-size: 1rem;
  color: #414141;
  line-height: 1.6;
}
.home_contact p em {
  color: #e80e0d;
}
.home_contact a {
  margin-top: 2.8125rem;
  width: 23.5625rem;
  height: 4.625rem;
  line-height: 4.625rem;
  background: #e80e0d;
  color: #fff;
  font-size: 1.125rem;
  text-align: center;
  border-radius: 3.125rem;
  transition: all 0.36s;
}
.home_contact a:hover {
  background: #13115c;
}
footer {
  background: #0d0a2c;
  padding: 3.125rem 0;
}
footer .worp {
  justify-content: center;
}
footer .worp .list {
  padding: 0 8%;
}
footer .worp p {
  color: #80809c;
  font-size: 14px;
  text-align: center;
  line-height: 1.6;
}

/* æ‚¬æµ®çª—æ ·å¼ */
.floating-icons {
  position: fixed;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  z-index: 1000;
}
.icons {
  width: 60px;
  height: 60px;
  background-color: red;
  color: white;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 10px;
  cursor: pointer;
  transition: background-color 0.3s;
  border-radius: 50%;
}
.icons:hover {
  background-color: darkred;
}
.hidden-content {
  position: absolute;
  right: calc(100% + 10px);
  top: 50%;
  transform: translateY(-50%);
  background-color: white;
  padding: 15px;
  border: 1px solid #ccc;
  display: none;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  min-width: 150px;
  text-align: center;
  border-radius: 8px;
}
.icons:hover + .hidden-content {
  display: block;
}
.custom-qrcode {
  width: 30px;
  height: 30px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, 1fr);
  gap: 2px;
}
.custom-qrcode div {
  background-color: #13115c;
}
.custom-qrcode div:nth-child(1),
.custom-qrcode div:nth-child(3),
.custom-qrcode div:nth-child(7),
.custom-qrcode div:nth-child(9) {
  background-color: transparent;
}
@media (max-width: 768px) {
  .floating-icons { display: none; }
}

/* ç§»åŠ¨ç«¯å“åº”å¼æ ·å¼ï¼ˆä¿®å¤æ¨ªå‘æ»‘åŠ¨é—®é¢˜ï¼‰ */
@media (max-width: 768px) {
  header { display: none; }
  .mobile-header { display: flex; }
  
  /* ç¦æ­¢banneråŒºåŸŸçš„è§¦æ‘¸æ»‘åŠ¨ */
  .home_banner {
    touch-action: none;
    -ms-touch-action: none;
    overflow: hidden;
  }
  
  /* ä¿®å¤äº§å“åˆ—è¡¨æº¢å‡º */
  .home_server {
    padding-left: 5%;
    padding-right: 5%;
    width: 100%!important;
    box-sizing: border-box;
  }
  .home_server .worp {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    margin: 0;
  }
  .home_server .worp a {
    width: 100%!important;
    margin: 0!important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    border-radius: 10px;
  }
  .home_server .worp a > img {
    height: 8rem;
  }
  
  /* ä¿®å¤åº•éƒ¨å†…å®¹æº¢å‡º */
  footer .worp {
    flex-direction: column;
    text-align: center;
    gap: 2rem;
    padding: 0 1rem;
    width: 100%;
    box-sizing: border-box;
  }
  footer .list {
    width: 100%!important;
    max-width: 600px;
    margin: 0 auto;
    padding: 0!important;
  }
  
  /* å…¶ä»–ç§»åŠ¨ç«¯æ ·å¼ */
  .home_about {
    background-size: 60%!important;
    background-position: center 70%!important;
  }
  .home_about .p {
    width: 90%!important;
    font-size: 0.9rem!important;
  }
  .home_contact a {
    width: 100%!important;
    max-width: 28rem;
    font-size: 1rem!important;
  }
  html { font-size: 50%; }
  
  /* ä¿®å¤bodyæ»šåŠ¨é—®é¢˜ */
  body {
    position: relative;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* ä¿®å¤PCç«¯å­—ä½“å¤§å° */
@media (min-width: 769px) {
  html {
    font-size: 100%; /* ç¡®ä¿PCç«¯å­—ä½“æ­£å¸¸ */
  }
}