/*********** 一些初始化 *************/
@media screen and (min-width: 320px) {html{font-size:50px;}}
@media screen and (min-width: 360px) {html{font-size:56.25px;}}
@media screen and (min-width: 375px) {html{font-size:58.59375px;}}
@media screen and (min-width: 400px) {html{font-size:62.5px;}}
@media screen and (min-width: 414px) {html{font-size:64.6875px;}}
@media screen and (min-width: 440px) {html{font-size:68.75px;}}
@media screen and (min-width: 480px) {html{font-size:75px;}}
@media screen and (min-width: 520px) {html{font-size:81.25px;}}
@media screen and (min-width: 560px) {html{font-size:87.5px;}}
@media screen and (min-width: 600px) {html{font-size:93.75px;}}
@media screen and (min-width: 640px) {html{font-size:100px;}}
@media screen and (min-width: 680px) {html{font-size:106.25px;}}
@media screen and (min-width: 720px) {html{font-size:112.5px;}}
@media screen and (min-width: 760px) {html{font-size:118.75px;}}
@media screen and (min-width: 800px) and (max-width: 959px){
  html{font-size:125px;}
  .apply-tel { 
    top: 90.3%;
    left: 33.8%;
  }
}
@media screen and (min-width: 960px) and (max-width: 1190px){
  html{font-size:150px;}
  .apply-tel { 
    top: 90.3%;
    left: 36.8%;
  }
}
@media screen and (min-width: 1200px) and (max-width :1550px) {
  html{font-size:187.5px;}
  .apply-tel { 
    top: 90.3%;
    left: 39.8%;
  }
}
@media screen and (min-width: 1200px) {
  html{font-size:187.5px;}
}

/************* 全局的css *******************/
*{
  margin: 0;
  padding: 0;
}
body {
  font-size: 16px !important;
  font-family: 'Microsoft Yahei' !important;
}
.font-15 {
  font-size: 15px;
}
.font-16 {
  font-size: 16px !important;
  line-height: 31px;
}
.font-20 {
  font-size: 20px;
}
.font-24 {
  font-size: 24px !important;
}
.font-30 {
  font-size: 30px;
}
.font-58 {
  font-size: 58px;
}
.font-fff {
  color: #ffffff !important;
}
.background-020b18 {
  background-color: #020b18;
}
.background-44484F {
  background-color: #44484F !important;
}
/* 横线和背景颜色 */
.hr-80 {
  width: 0.4267rem;
  height: 0.0107rem;
  background-color: #e94709;
}
.hr-46 {
  width: 46px;
  height: 0.0107rem;
  background-color: #e94709;
}
.hr-53 {
  width: 53px;
  height: 0.0107rem;
  background-color: #e94709;
}
.hide {
  display: none !important;
}
.display-row {
  display: flex;
  flex-direction: row;
}
.display-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.display-row-center {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.section-content {
  padding: 0.49rem 0 0.534rem 0;
  background-color: #ffffff;
}
.section-content .section-description {
  font-size: 16px;
  color: #333333;
  line-height: 37px;
  font-weight: 400;
  text-indent: 31px;
}
.width-100 {
  width: 100%;
  height: 100%;
}
.height-850 {
  height: 850px;
}
/***** 对齐 *****/
.text-align-right {
  text-align: right;
}
.text-align-center {
  text-align: center;
}
/***** margin & padding *****/
.margin-top-29 {
  margin-top: 29px;
}
.margin-top-35 {
  margin-top: 35px;
}
.margin-top-100 {
  margin-top: 100px;
}
.margin-top-118 {
  margin-top: 118px;
}
.margin-left-14 {
  margin-left: 14px;
}
.padding-top-72 {
  padding-top: 72px;
}
/************** 导航部分 ***********************/
.header {
  position: fixed;
  width: 100%;
  z-index: 100;
  padding: 0;
}
header .nav {
  padding: 0.32% 6.77% 0.32% 6.77% !important;
}
.nav .layui-nav li a {
  padding: 0rem 0.16rem;
  font-size: 0.075rem;
  color: #fff;
}
.nav-hight-light{
  color:#E94609 !important;
  font-weight: bolder;
}
.logo-box {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: center;
  height: 0.32rem;
}
.logo {
  width: 140px;
  height: 45px;
}
.nav .layui-nav .layui-nav-item a:hover {
  color:#E94609 !important;
  transition-duration: 0.5s;
}
.caption {
  font-size: 28px;
  font-weight: bold;
  color: #15233A;
  line-height: 72px;
  position: relative;
  text-align: center;
}
.caption::after {
  position: absolute;
  bottom: 0;
  left: 50%;
  content: '';
  width: 46px;
  height: 2px;
  transform: translate(-50%, -50%);
  background-color: #e94709;
}
/******************* 尾部 ************************/
.footer {
  background-size: 100%, 100%;
  /* background-color: #202732; */
  background: url('../imgs/img-footer-background.png');
  background-repeat: inherit;
  color: #ffffff;
}
.footer .footer-content {
  padding-top: 0.15rem;
}
.footer .footer-title {
  font-size: 20px;
  font-weight: bolder;
  padding-bottom: 0.1333rem;
}
.footer .footer-content div ul {
  padding-top: 0.16rem;
}
.logo-child {
  width: 15%;
  height: 60px;
}
.logo-compony {
  width: 131px;
  height: 45px;
}
.QRcode-part {
  text-align: center;
}
.QRcode-part p {
  margin-bottom: 12px;
}
.QRcode-part .img-qrcode {
  width: 110px;
  height: 110px;
}
.footer .footer-content ul li, .copyright{
  padding-bottom: 28px;
  color: #8392ab;
}
.copyright {
  padding-top: 20px;
}
.copyright a {
  color: #8392ab;
  text-decoration: none;
}
.footer .flex-vertical-center {
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 120px;
}
/********************** 回到顶部 ******************/
.back-to-top {
  border: 1px solid #ffffff;
  display: block;
  position: fixed;
}
/********************* 背景图片 **********************/
.bg-img-1 {
  background: url('../imgs/img-background-8.png');
}
.bg-img-2 {
  background: url('../imgs/img-background-2.jpg');
  height: 100%;
  width: 100%;
}
.bg-img-3 {
  background: url('../imgs/img-background-3.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.bg-img-sports {
  background: url('../imgs/img-background-6.png');
}
.bg-img-fitness {
  background: url('../imgs/img-background-5.png');
}
.bg-img-athletics {
  background: url('../imgs/img-background-7.png');
}
.bg-img-history {
  background: url('../imgs/img-history-bg.png');
}
/********************* 内容 ****************************/
.board {
  height: 4.16rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.board .board-content {
  width: 61%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.carousel-item {
  position: relative;
}
.carousel-item .carousel-content {
  position: absolute;
  width: 61%;
  height: 80%;
  top: 76%;
  left: 50%;
  transform: translate(-50%, -50%); 
}
.carousel-item .title, .board-content .title {
  font-size: 0.27rem;
  line-height: 90px;
  font-weight: bold;
  color: rgba(255, 255, 255, 1);
  text-align: center;
  text-shadow:0px 3px 6px rgba(2,11,24,0.52);
}
.carousel-item .description, .board-content .description {
  font-size: 0.16rem;
  line-height: 0.215rem;
  font-weight: 400;
  color: rgba(255, 255, 255, 1);
  text-align: center;
  padding-top: 0.203rem;
  text-shadow:0px 0px 4px rgba(2,11,24,0.52);
}
.board-content .btn-product-try {
  width: 0.91rem;
  font-size: 0.075rem;
  line-height: 0.25rem;
  color: #FFFFFF;
  font-weight: 400;
  text-align: center;
  background-color: #E9512A;
  border-radius: 5px;
  margin-top: 0.203rem;
}
.board-content .btn-product-try:hover {
  animation: shake 1s cubic-bezier(.36, .07, .19, .97) both;
	transform: translate3d(0, 0, 0);
}
@keyframes shake {
	10%, 90% {
		transform: translate3d(0, -1px, 0);
	}
	20%, 80% {
		transform: translate3d(0, 2px, 0);
	}
	30%, 50%, 70% {
		transform: translate3d(0, -4px, 0);
	}
	40%, 60% {
		transform: translate3d(0, 6px, 0);
	}
}
/*** 产品切换查看详情 ***/
.products-detail-box {
  padding: 0.8rem 0 0.72rem 0;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.products-detail-box .products-box-nav p{
  line-height: 60px;
  background-color: #ECF2F6;
  color: #020C22;
  font-size: 16px;
  width: 260px;
  margin-top: 30px;
  text-align: center;
}
.products-detail-box .products-box-nav p:first-child {
  margin: 0;
}
.products-detail-box .products-box-nav p:hover {
  background-color: #E94609;
  color: #ffffff;
  transition-duration: .3s;
}
.products-box-nav p.nav-active {
  background-color: #E94609;
  color: #ffffff;
}
.products-detail-box .products-box-content .box-detail {
  width: 100%;
  display: flex;
  flex-direction: row;
  height: 377px;
  -moz-box-shadow:0px 1px 4px #969696;/*firefox*/
  -webkit-box-shadow:0px 1px 4px #969696;/*webkit*/
  box-shadow:0px 1px 4px #969696;/*opera或ie9*/
}
.box-detail .box-text{
  width: 60%;
  padding: 56px 50px 0 59px;
  color: #181B3A;
  font-size: 15px;
  font-weight: 400;
  line-height: 30px;
}
.box-detail .box-image{
  width: 40%;
}
.box-text .title {
  color: #E9512A;
  line-height: 30px;
  font-size: 30px;
  margin-bottom: 27px;
  position: relative;
}
.box-text .title::after {
  position: absolute;
  bottom: -27px;
  left: 0;
  content: '';
  width: 46px;
  height: 2px;
  background-color: #E9512A;
}
.box-text .description {
  padding: 17px 0;
}
/****客户案例****/
.customer-case-list {
  padding: 0.27rem 0 0.535rem 0;
  background-color: #F2F6F8;
}