/* -------------------------------- 公共 --------------------------------------- */
/* @font-face {
  font-family: 'raleway';
  src:  url('../font/raleway.woff2') format('woff2');
} */

@font-face {
  font-family: 'dinneuzeitgroteskltw01-_812426';
  src:  url('../font/dinneuzeitgroteskltw01-_812426.woff2') format('woff2');
}

body { 
  color: var(--bodyColor); 
  transition: all 0.3s ease 0s; 
  font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,apple color emoji,segoe ui emoji,Segoe UI Symbol,noto color emoji; 
  font-size: 14px; 
  background: var(--bodyBgColor);

}



.font-2 { font-family: dinneuzeitgroteskltw01-_812426, sans-serif; }

.mt-55 { margin-top: 55px; }

/* ------------------------------- icon ----------------------------------------- */
[class^="icon-"], [class*=" icon"] { display: inline-block; width: 14px; height: 14px; line-height: 14px; vertical-align: text-top; opacity: 1; background: url("../images/glyphicons-mini.png") no-repeat  14px 14px; }
.icon-large { height: 48px; width: 48px; line-height: 48px; background: url("../images/glyphicons.png") no-repeat  48px 48px; }
.icon-email { background-position: -72px 0; }


/* -------------------------------- btn ------------------------------------ */
.btn { padding: 8px 12px; background-color: #fff; font-size: 16px; cursor: pointer; }
.btn.blue { background-image: linear-gradient(rgb(91, 143, 229), rgb(71, 121, 203) 99%); color: #fff; }
.btn:hover {
  opacity: 0.96;
}
.btn.download-btn { 
  padding: .16rem .32rem; 
  color: #fff; 
  position: relative; 
  font-weight: normal; 
  text-shadow: 0.01333rem 0.02667rem 0.02667rem #b80005; 
  box-shadow: rgb(0 0 0 / 30%) 0px 15px 10px -16px; 
  font-size: .22rem; 
  background: linear-gradient(rgb(231, 62, 75) 0%, rgb(235, 66, 80) 50%), rgb(240, 72, 85) 100%; 
  border-radius: .32rem;
}

/* -------------------------------- header -------------------------------------------- */
.header { height: .72rem; background-color: var(--headerBgColor); width: 100%; z-index: 999; position: fixed; top: 0; }
.header .header-com { height: 100%; margin: 0 auto; padding: 0 .3rem; }
.header-com .logo { height: 100%; }
.header-com .logo a { height: 100%; width: 100%; }
.header-com .logo a img { display: inline-block; max-height: .5rem; width: auto; }

.header h2 { font-size: .72rem; color: var(--headerColor); vertical-align: baseline; letter-spacing: normal; pointer-events: auto; }

.nav { height: .4rem; }
.nav .nav-com { height: 100%; margin: 0 auto; }
.nav .nav-com ul { display: flex; align-items: center; height: .4rem; }
.nav ul li { height: 100%; position: relative; }
.nav ul li a { display: block; height: 100%; line-height: .4rem; padding: 0 .2rem; cursor: pointer; font-size: .14rem; font-weight: normal; color: var(--navColor); }
.nav ul li a:hover, .nav ul li a.active { color: var(--navLiHoverColor); font-weight: 500; }
.nav ul li a::after { content: ""; width: 1px; height: .15rem; background-color: var(--navColor); position: absolute; right: 0; top: 50%; transform: translateY(-50%) skewX(25deg); }


.footer { width: 100%; background-color: var(--footerBgColor);}
.footer .footer-main { width: 100%; max-width: 980px; margin: 0 auto; padding: .4rem .0; text-align: center; }
.footer .footer-main .footer-title { font-size: .22rem; color: var(--footerColor); text-align: center; margin-bottom: .26rem; }
.footer .footer-main .footer-com p { font-size: .14rem; font-weight: 300; margin-bottom: .1rem; }

@media screen and (max-width: 768px) {
  .header .header-com { padding: 0 .2rem; }
  .nav .nav-com { padding: 0 .1rem; }
}