/*公用类的样式*/
*,li,ul,dl,dt,dd,h1,h2,h3,p{margin:0;padding:0;}
li,ol,ul,dl,dt,dd{list-style:none;list-style-type:none}
a,h1,img,p{border:0}
cite,em,i{font-style:normal;}
input:focus{outline:none;}
a{color:#666;text-decoration:none;}
a:hover{text-decoration:none;}/*鼠标悬停时*/
.clearfix{display:block}
* html .clearfix{height:1%}
.clearfix:after{display:block;visibility:hidden;clear:both;height:0;content:'\20'}
.mt10{margin-top:0.1rem}
.mt20{margin-top:0.2rem}
.mt30{margin-top:0.3rem}
.blue{color:#00b9ef}
.gray{ color:#9b9b9b}
.red{ color: red}
.oran{color:#ff7b1a}
.bg-w{ background: #fff}
.clear{clear:both}
.center{text-align:center}
.none{display:none}
.fl{float:left;}
.fr{float:right}
.mid{ float: left}
.ta-r{ text-align: right}
.pd10{ padding:0.1rem}
.pt39{ padding-top:39px;}
input[type="text"],input[type="password"],input[type="button"]{-webkit-appearance: none;}
html.with-statusbar-overlay body {padding-top:0px;}
body{font-family:'Helvetica Neue', 'Hiragino Sans GB', 'Microsoft YaHei', u9ed1u4f53, Arial, sans-serif;font-size: 0.14rem;}

.spinner {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  margin: auto;
  width: 70px;
  height: 20px;
  text-align: center;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}
.spinner > div {
  width: 19px;
  height: 19px;
  background-color: #3cbaff;
  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}
.spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0) }
  40% { -webkit-transform: scale(1.0) }
}
@keyframes sk-bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  } 40% {
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}

.appTop{ background: #2A323D; padding:.1rem;}
.appTop a{ display: block; width: 100%; height: 100%}
.appTop .logo{ width: 101px; height: 26px; background: url('../fonts/logo.svg') no-repeat center;background:cover;float: left}
.appTop .appTopRight{ float: right; }
.appTop .appTopRight #user{ float:left;width: 26px; height: 26px; background: url('../fonts/user.svg') no-repeat center;}
.appTop .appTopRight #userLogined{float:left;height: 26px; line-height: 26px;}
.appTop .appTopRight #userLogined a{ color: #fff;}
.appTop .appTopRight #nav{ float:left;  margin-left:.2rem;width: 26px; height: 26px; background: url('../fonts/nav.svg') no-repeat center;}
.navCon {font-size: 14px;position:fixed; z-index:9091;color: #222;height: 100%; background: #fff; top:0; left:0; width: 71%; margin-left: -91%;transition:.6s;}
.navCon.navActive{margin-left: 0px;}
.navCon .navCon-wrapper > ul{padding-left: 0;margin-bottom: 20px; }
.navCon .navCon-wrapper > ul.pull-right{float: none !important; }
.navCon ul {list-style: none;padding-left: 20px;cursor: pointer; }
.navCon ul > li {line-height: 36px;min-width: 140px; position: relative;}
.navCon ul > li > a { display: block; margin-left: .2rem}
.navCon ul > li > a span{margin-right: .1rem}
.navCon ul > li span.indicator {
	position: absolute;
	color: #bababa;
	top: 0;
	right: 0;
	font-size: 14px;
	-webkit-transition: color 0.2s linear;
	-moz-transition: color 0.2s linear;
	-o-transition: color 0.2s linear;
	transition: color 0.2s linear;
	padding-right: 6px; 
}
.navCon li > ul {display: none;border-top: 1px solid #eee; }
.navCon li > ul > li {float: none;position: relative;min-width: 140px; }
.navCon li > ul > li:hover {background-color: #FFFFFF; }
.navCon .nav-border > ul {border: 1px solid #eee;border-radius: 4px; }
.navCon .nav-border.nav-line li {border-bottom: 1px solid #eee; }
.navCon .nav-border.nav-line li:last-child {border-bottom: none; }
.nav-mask {
  display: block;
  position: fixed;
  top: -50%;
  left: -50%;
  z-index: 9090;
  width: 200%;
  height: 200%;
  background-color: rgba(0, 0, 0, 0.8);
  visibility: visible;
  opacity: 0.6; 
  -webkit-transition: opacity 1s,visibility 1s;
  transition: opacity 1s,visibility 1s;
  display: none;
}
.appBottom{background: #2A323D; color: #AAADB1; font-size: .12rem; padding: .2rem}
.appBottom ul li a{font-size: .12rem;color: #fff; }
.appBottom ul li{ padding: .1rem 0}
.appBottom ul li:nth-child(1) a{ margin-left: .1rem }
.appBottom ul li:nth-child(1) a:nth-child(2){ color: #0073FF }
.appBottom ul li:nth-child(1){border-bottom:#40474f 1px solid;}
.appBottom ul li:nth-child(2) a,.appBottom ul li:nth-child(3) a{ display: block; text-align: center; border: #fff 1px solid;padding: .1rem; font-size: .14rem}
.appBottom ul li:nth-child(4) img{ width: 161px; height: auto }
.closePopover{ position: absolute;top:3px; right:3px;}
.indexBannerArea{ min-height:2.5rem; position: relative;}
.indexBannerArea .spinner{ z-index: -1}
#indexBannerCon{ min-height: 1.76rem }
.indexBanner img{ width: 100%; height: auto}
.indexSubBanner ul{ display: flex }
.indexSubBanner ul li,.indexSubBanner ul li a{ font-size:.12rem; }
.indexSubBanner ul li{ position: relative;flex:1; padding-bottom: .1rem}
.indexSubBanner ul li span{ padding:11px; position: absolute; right:0; top:0;background-size: 21px;}
.indexSubBanner ul li:nth-child(1){background:#F2F5F7  }
.indexSubBanner ul li:nth-child(1) span{background:url('../images/image.png') no-repeat -39px -104px ;}
.indexSubBanner ul li:nth-child(2){background:#EAEFF3 }
.indexSubBanner ul li:nth-child(2) span{background:url('../images/image.png') no-repeat -101px -104px ;}
.indexSubBanner ul li:nth-child(3){background:#F2F5F7; }
.indexSubBanner ul li{ text-indent: .2rem }
.indexSubBanner ul li dt{ margin: .1rem 0;font-weight: bold; }
.indexProduct div{ text-align: center; padding: .39rem 0;overflow: hidden;}
.indexProduct div dl dt{ font-size: .2rem;font-weight: bold; margin-bottom: .1rem}
.indexProduct div dl dd{ font-size: .12rem; line-height: .22rem }
.indexProduct div:nth-child(1){padding-top: .29rem}
.indexProduct div:nth-child(2){ background: #5c92ff; color: #fff;}
.indexProduct div:nth-child(4){ background: #f67a49;color: #fff }
.indexProduct div:nth-child(6){ background: #00d3a9 ;color: #fff}
.indexProduct div:nth-child(odd) p{transform:translate(-600px);}
.indexProduct div:nth-child(even) p{transform:translate(600px);}
.indexProduct div:nth-child(1) p{transform:translate(0);}
.indexProduct div p.leftInOut{-webkit-animation:leftInOut .3s ease forwards;-moz-animation:leftInOut .3s ease forwards;animation:leftInOut .3s ease  forwards;}
.indexProduct div p.rightInOut{-webkit-animation:rightInOut .3s ease forwards;-moz-animation:rightInOut .3s ease forwards;animation:rightInOut .3s ease  forwards;}
.indexProduct p{ margin-top: .21rem }
.indexProduct p img{ width: 201px; height: auto;}
.indexChooseJdy h3{ text-align: center;font-size: .16rem;margin:.39rem 0;}
.indexChooseJdy ul{ padding: .1rem; }
.indexChooseJdy li{ width: 50%; float: left; text-align: center;color: #0073FF; padding-bottom: 21px;}
.indexChooseJdy ul li:nth-child(1){ border-right: #f2f5f7 1px solid;border-bottom: #f2f5f7 1px solid }
.indexChooseJdy ul li:nth-child(2){border-bottom: #f2f5f7 1px solid }
.indexChooseJdy ul li:nth-child(3){ border-right: #f2f5f7 1px solid; }
.indexChooseJdy ul li span{ 
  display: block; 
  width: 65px; 
  height: 65px;
  margin:21px auto;
  background-image: url('../images/image.png');
  background-repeat: no-repeat;
}
.indexChooseJdy ul li:nth-child(1) span{ background-position:-39px  -163px}
.indexChooseJdy ul li:nth-child(2) span{ background-position:-141px  -163px}
.indexChooseJdy ul li:nth-child(3) span{ background-position:-39px  -267px}
.indexChooseJdy ul li:nth-child(4) span{ background-position:-141px  -267px}
.indexCustom{ padding:.3rem; background: url('../images/custom.png') no-repeat center; background-size:cover;}
.indexCustom dt{ text-align: center; margin-bottom: .2rem;font-size: .16rem;font-weight: bold;}
.indexCustom dd{ text-indent: .26rem; font-size: .12rem}
.indexCustom p{text-align: right; margin-top: .2rem;font-size: .12rem}
.indexPhone{ 
	position: fixed; 
	top: 50%;
	right:0; 
	width:51px;
	height: 51px;
	background:#0073ff url('../images/tel.svg') no-repeat center;
	box-shadow:0px 0px 10px #0073ff;
}

.indexPhone {-webkit-animation:rightInOut 1s ease forwards;-moz-animation:rightInOut 1s ease forwards;animation:rightInOut 1s ease forwards;}
.indexPhone a{ display: block; width: 100%; height: 100%;}
@-webkit-keyframes leftInOut {
    from{
      -webkit-transform:translate(-600px);
    }
    to{
      -webkit-transform:translate(0px);
    }
}
@-moz-keyframes leftInOut {
    from{
      -moz-transform:translate(-600px);
    }
    to{
      -moz-transform:translate(0px);
    }
}
@keyframes leftInOut {
    from{
      transform:translate(-600px);
    }
    to{
      transform:translate(0px);
    }
}
@-webkit-keyframes rightInOut {
    from{
      -webkit-transform:translate(600px);
    }
    to{
      -webkit-transform:translate(0px);
    }
}
@-moz-keyframes rightInOut {
    from{
      -moz-transform:translate(600px);
    }
    to{
      -moz-transform:translate(0px);
    }
}
@keyframes rightInOut {
    from{
      transform:translate(600px);
    }
    to{
      transform:translate(0px);
    }
}
@-webkit-keyframes scaleInOut {
    from,50%,to{
      -webkit-transform:scale(1);
    }
    29%,76%{
      -webkit-transform:scale(1.1);
    }
}
@-moz-keyframes scaleInOut {
    from,50%,to{
      -moz-transform:scale(1);
    }
    29%,76%{
      -moz-transform:scale(1.1);
    }
}
@keyframes scaleInOut {
    from,50%,to{
      transform:scale(1);
    }
    29%,76%{
      transform:scale(1.1);
    }
}
.indexChooseJdy li{
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  transform: scale(0);
}
.indexChooseJdy li.animate {
	-webkit-animation: scaleUp 1s ease-in-out forwards;
	-moz-animation: scaleUp 1s ease-in-out forwards;
	animation: scaleUp 1s ease-in-out forwards;
}
@-webkit-keyframes scaleUp {
  0% {-webkit-transform: scale(0);}
	100% { -webkit-transform: scale(1); opacity: 1; }
}
@-moz-keyframes scaleUp {
  0% {-moz-transform: scale(0);}
	100% { -moz-transform: scale(1); opacity: 1; }
}
@keyframes scaleUp {
  0% {transform: scale(0);}
	100% { transform: scale(1); opacity: 1; }
}