html,body {
  width: 100%;
  min-height: 100%;
}
body {
  position: relative;
  background: #fff url(../img/bg.png) no-repeat 6.2rem -4.2rem;
}
/* 动画 start*/
/* 小幅度绽放动画 */
.scalePTS{
  animation: scalePTS 1.6s linear infinite;
  -webkit-animation: scalePTS 1.6s linear infinite;
}
@keyframes scalePTS {
  0% {
    transform: scale(0.94);
  }
  50% {
    transform: scale(1);
  }
  100% {
    transform: scale(0.94);
  }
}
@-webkit-keyframes scalePTS {
  0% {
    transform: scale(0.94);
  }
  50% {
    transform: scale(1);
  }
  100% {
    transform: scale(0.94);
  }
}
/* 绽放动画 */
.scalePT{
  animation: scalePT 1.8s linear infinite;
  -webkit-animation: scalePT 1.8s linear infinite;
}
@keyframes scalePT {
  0% {
    transform: scale(0.9);
  }
  50% {
    transform: scale(1);
  }
  100% {
    transform: scale(0.9);
  }
}
@-webkit-keyframes scalePT {
  0% {
    transform: scale(0.9);
  }
  50% {
    transform: scale(1);
  }
  100% {
    transform: scale(0.9);
  }
}
/* 抖动动画 */
.shake{
  animation: shake .4s linear;
  -webkit-animation: shake .4s linear;
}
@-webkit-keyframes shake {
	10%{
		transform: translate3d(0, 0px, 0);
	}
	60% {
		transform: translate3d(0, -40px, 0);
	}
  100%{
		transform: rotate(-36deg);
	}
}
@keyframes shake {
  10%{
		transform: translate3d(0, 0px, 0);
	}
	60% {
		transform: translate3d(0, -40px, 0);
	}
  100%{
		transform: rotate(-36deg);
	}
}
/* 绽放+抖动动画 */
.bouncemidd{
  animation: bouncemidd 2.4s linear infinite;
  -webkit-animation: bouncemidd 2.4s linear infinite;
}
@-webkit-keyframes bouncemidd {
  0%{
		transform: scale(1);
	}
	10%{
		transform: scale(0.95);
	}
	30%{
		transform: scale(1);
	}
	50% {
		transform: scale(0.95);
  }
  70% {
		transform: scale(1);
	}
	80%{
		transform:rotate(-8deg);
	}
	90%{
		transform:rotate(0deg);
	}
	100%{
		transform:rotate(8deg);
	}
}
@keyframes bouncemidd {
  0%{
		transform: scale(1);
	}
  10%{
		transform: scale(0.95);
	}
	30%{
		transform: scale(1);
	}
	50% {
		transform: scale(0.95);
  }
  70% {
		transform: scale(1);
	}
	80%{
		transform:rotate(-8deg);
	}
	90%{
		transform:rotate(0deg);
	}
	100%{
		transform:rotate(8deg);
	}
}
/* 动画 end*/

.mainBar{
  max-width: 10rem;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
}
.container{
  padding: 0 0.48rem;
  width: 100%;
  box-sizing: border-box;
}
header{
  padding: 0.86rem 0 0.6rem;
  overflow: hidden;
  line-height: 1.2;
}
header h3{
  font-size: 0.64rem;
  font-weight: 600;
  margin-bottom: 0.16rem;
}
header p{
  font-size: 0.346rem;
  color: #83878c;
}
.company-infoBar{
  overflow: hidden;
  box-shadow: 0 0.08rem 0.18rem rgba(53,53,84,0.08);
  position: relative;
  padding: 0 0.24rem 0.48rem;
  background: url(../img/img_bg.png) no-repeat center bottom;
  background-size: 100% auto;
}
.company-infoBar .comp_bg{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0.08rem;
}
.company-infoBar .comp_info{
  padding: 0.24rem 0.24rem 0;
}
.company-infoBar .comp_info_bar{
  overflow: hidden;
  border-radius: 0.38rem 0.38rem 0 0;
  box-shadow: 0 -0.1rem 0.18rem rgba(53,53,84,0.15);
}
.company-infoBar .comp_info .infoBar{
  background: linear-gradient(to left top, #211e39, #4b4c69);
  overflow: hidden;
}
.company-infoBar .comp_info .infoBar .infoBar_ove{
  padding: 0.38rem 0.8rem 0.54rem;
  overflow: hidden;
  display: flex;
  display: -webkit-flex;
  justify-content: space-between;
  align-items: center;
  background: url(../img/card_bg.png) no-repeat right center;
  background-size: 60% auto;
}
.company-infoBar .comp_info .logo_bar{
  width: calc(100% - 3.8rem);
  overflow: hidden;
}
.company-infoBar .info_btn{
  margin-right: -0.2rem;
  width: 2.3rem;
  box-sizing: border-box;
  text-align: center;
  border-radius: 0.21rem;
  overflow: hidden;
}
.company-infoBar .info_btn .btns{
  display: block;
  color: #3c3429;
  font-size: 0.336rem;
  font-weight: 600;
  padding: 0.213rem 0.05rem 0.213rem 0.35rem;
  background: linear-gradient(to left top, #f8e1b4, #fdf2d5);
  display: flex;
  display: -webkit-flex;
  justify-content: center;
  align-items: center;
}
.company-infoBar .info_btn .btns .icon_arr{
  display: block;
  width: 0.4rem;
  position: relative;
  left: -0.04rem;
}
.btn_group{
  padding: 0.8rem 0 0.76rem;
  overflow: hidden;
}
.btn_group ul{
  width: 100%;
  overflow: hidden;
  display: flex;
  display: -webkit-flex;
  justify-content: space-between;
  align-items: center;
}
.btn_group li{
  margin-right: 0.36rem;
  overflow: hidden;
  /* min-width: calc((100% - 0.72rem) / 3); */
  flex-grow: 1;
}
.btn_group li:last-of-type{
  margin-right: 0;
}
.btn_group li .btns{
  display: block;
  border-radius: 2rem;
  overflow: hidden;
  background-color: #678afe;
  display: flex;
  display: -webkit-flex;
  justify-content: center;
  align-items: center;
  padding: 0.36rem 0.16rem;
  color: #fff;
  font-size: 0.42rem;
  font-weight: 600;
}
.btn_group li .icon_li{
  width: 0.52rem;
  margin-right: 0.08rem;
}
.btn_group li.on .btns{
  background-color: #f74c3a;
}

.product_itemBar{
  padding-bottom: 0.5rem;
}
.sec_titleBar{
  margin-bottom: 0.48rem;
}
.sec_titleBar h3{
  font-size: 0.46rem;
  font-weight: 600;
  line-height: 1;
}
.product_itemBar .pro_li{
  overflow: hidden;
  width: 100%;
}
.pro_li dl{
  overflow: hidden;
  margin-bottom: 0.4rem;
}
.pro_li dl dt{
  position: relative;
  border-radius: 0.24rem;
  overflow: hidden;
}
.pro_li dl dt .saleTag{
  position: absolute;
  border-radius: 0 1rem 1rem 0;
  overflow: hidden;
  top: 0.24rem;
}
.pro_li dl dt .saleTag i{
  display: block;
  color: #fff;
  background: linear-gradient(to left top, #ff3c3c, #e27676);
  font-size: 0.32rem;
  font-weight: 600;
  padding: 0.09rem 0.36rem 0.1rem 0.3rem;
}
.pro_li dl dd{
  padding-top: 0.2rem;
}
.pro_li dl dd h3{
  font-size: 0.41rem;
  font-weight: 600;
  margin-bottom: 0.1rem;
}
.pro_li dl dd p{
  font-size: 0.33rem;
  color: #83878c;
}