/* 思源宋体 Source Han Serif SC */
@font-face {
  font-family: "Source Han Serif SC";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/source-han-serif-sc@1.001/WebFonts/WOFF2/SimplifiedChinese/SourceHanSerifSC-Regular.woff2") format("woff2");
}

@font-face {
  font-family: "Source Han Serif SC";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/source-han-serif-sc@1.001/WebFonts/WOFF2/SimplifiedChinese/SourceHanSerifSC-Medium.woff2") format("woff2");
}

@font-face {
  font-family: "Source Han Serif SC";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/source-han-serif-sc@1.001/WebFonts/WOFF2/SimplifiedChinese/SourceHanSerifSC-Bold.woff2") format("woff2");
}


:root {
  --font-family: "Source Han Serif SC", "思源宋体", "Noto Serif SC", "STSong", "SimSun", "PingFang SC", "Microsoft YaHei", "Arial", "Helvetica",  sans-serif;
  --font-family-medium: "PingFang SC", "Microsoft YaHei", "Arial", "Helvetica", sans-serif;
}

.container {
  margin: 0 auto;
  width: 90%;
  max-width: 1600px;
}

@media (max-width: 1280px) {
  .container {
    width: 90%;
  }
}

html {
  font-size: calc(100vw/19.2);
  font-family: var(--font-family-medium);
}
@media (min-width: 1901px) {
  html {font-size: 100px;}
}
@media (max-width: 1600px) {
  html {font-size: 66px;}
}
@media (max-width: 767px) {
  html {font-size: calc(100vw/7.5);}
}

body {
  min-height: 100%;
  font-family: var(--font-family-medium);
  font-size: 16px;
  line-height: 1.5;
  color: #333;
  background: #fff;
  overscroll-behavior: none;
}

@media (max-width: 1600px) {
  body {font-size: 14px;}
}
@media (max-width: 767px) {
  body {font-size: 0.28rem;}
}




/* 字体大小 */
:root {
  --font12: 12px;
  --font14: 14px;
  --font15: 15px;
  --font16: 16px;
  --font18: 18px;
  --font20: 20px;
  --font22: 22px;
  --font24: 24px;
  --font26: 26px;
  --font28: 28px;
  --font30: 30px;
  --font32: 32px;
  --font34: 34px;
  --font36: 36px;
  --font38: 38px;
  --font40: 40px;
  --font42: 42px;
  --font44: 44px;
  --font46: 46px;
  --font48: 48px;
  --font50: 50px;
  --font52: 52px;
  --font54: 54px;
  --font56: 56px;
  --font60: 60px;
  --font72: 72px;
  --font80: 80px;
}
.tit-12 { font-size: var(--font12); }
.tit-14 { font-size: var(--font14); }
.tit-15 { font-size: var(--font15); }
.tit-16 { font-size: var(--font16); }
.tit-18 { font-size: var(--font18); }
.tit-20 { font-size: var(--font20); }
.tit-22 { font-size: var(--font22); }
.tit-24 { font-size: var(--font24); }
.tit-26 { font-size: var(--font26); }
.tit-28 { font-size: var(--font28); }
.tit-30 { font-size: var(--font30); }
.tit-32 { font-size: var(--font32); }
.tit-34 { font-size: var(--font34); }
.tit-36 { font-size: var(--font36); }
.tit-38 { font-size: var(--font38); }
.tit-40 { font-size: var(--font40); }
.tit-42 { font-size: var(--font42); }
.tit-44 { font-size: var(--font44); }
.tit-46 { font-size: var(--font46); }
.tit-48 { font-size: var(--font48); }
.tit-50 { font-size: var(--font50); }
.tit-52 { font-size: var(--font52); }
.tit-54 { font-size: var(--font54); }
.tit-56 { font-size: var(--font56); }
.tit-60 { font-size: var(--font60); }
.tit-72 { font-size: var(--font72); }
.tit-80 { font-size: var(--font80); }

@media (max-width: 1600px) {
  :root {
    --font12: 10px;
  --font14: 12px;
  --font15: 13px;
  --font16: 14px;
  --font18: 16px;
  --font20: 18px;
  --font22: 20px;
  --font24: 22px;
  --font26: 24px;
  --font28: 26px;
  --font30: 28px;
  --font32: 30px;
  --font34: 30px;
  --font36: 30px;
  --font38: 32px;
  --font40: 32px;
  --font42: 34px;
  --font44: 34px;
  --font46: 36px;
  --font48: 38px;
  --font50: 40px;
  --font52: 42px;
  --font54: 44px;
  --font56: 46px;
  --font60: 48px;
  --font72: 48px;
  --font80: 48px;
}
}

@media (max-width: 1280px) {
  :root {
    --font12: 10px;
  --font28: 24px;
  --font30: 26px;
  --font32: 28px;
  --font34: 28px;
  --font36: 30px;
  --font38: 30px;
  --font40: 30px;
  --font42: 32px;
  --font44: 32px;
  --font46: 36px;
  --font48: 38px;
  --font50: 38px;
  --font52: 44px;
  --font54: 44px;
  --font56: 44px;
  --font60: 44px;
  --font72: 44px;
  --font80: 44px;
  }
}

@media (max-width: 767px) {
  :root {
    --font12: 0.28rem;
  --font14: 0.28rem;
  --font15: 0.28rem;
  --font16: 0.28rem;
  --font18: 0.28rem;
  --font20: 0.3rem;
  --font22: 0.32rem;
  --font24: 0.32rem;
  --font26: 0.32rem;
  --font28: 0.36rem;

  --font30: 0.4rem;
  --font32: 0.4rem;
  --font34: 0.4rem;
  --font36: 0.44rem;
  --font38: 0.44rem;
  --font40: 0.44rem;
  --font42: 0.44rem;
  --font44: 0.44rem;
  --font46: 0.44rem;

  --font48: 0.58rem;
  --font50: 0.58rem;
  --font52: 0.58rem;
  --font54: 0.58rem;
  --font56: 0.58rem;
  --font60: 0.58rem;
  --font72: 0.58rem;
  --font80: 0.58rem;
  }
}
