

/* init */
*{
  font-family:PingFang SC;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 400
}

h1 {
  font-size: 40px;
  font-weight: 800;
  color: #000000;
  line-height: 44px;
  text-align: center;
}

h2 {
  font-size: 32px;
  font-weight: bold;
  color: #000000;
  line-height: 36px;
  text-align: center;
}

h6 {
  font-size: 16px;
  font-weight: 400;
  color: #000000;
  line-height: 20px;
  text-align: center;
}

.fl {
  float: left;
}

.fr {
  float: right;
}

.fr {
  float: middle;
}

.clear {
  clear: both;
  height: 0;
  font-size: 1px;
  line-height: 0;
}

.clearfix:after {
  content: ".";
  height: 0;
  display: block;
  visibility: hidden;
  clear: both;
}


/*-------- 间距 --------*/

.ml20 {
  margin-left: 20px;
}

.mr20 {
  margin-right: 20px;
}

.mr30 {
  margin-right: 30px;
}

.mr32 {
  margin-right: 32px;
}

.mr50{
  margin-right: 50px;
}

.mt20 {
  margin-top: 20px;
}

.mt24 {
  margin-top: 24px;
}

.mt30 {
  margin-top: 30px;
}

.mt40 {
  margin-top: 40px;
}

.mt60 {
  margin-top: 60px;
}

.mt80 {
  margin-top: 80px;
}

.mb16 {
  margin-bottom: 16px;
}

.mb20 {
  margin-bottom: 20px;
}

.mb30 {
  margin-bottom: 32px;
}

.mb32 {
  margin-bottom: 32px;
}

.mb60 {
  margin-bottom: 60px;
}

.mb80 {
  margin-bottom: 80px;
}

.pd40 {
  padding: 40px 0px;
}

.pd60 {
  padding: 60px 0px;
}

.pd80 {
  padding: 80px 0px;
}

.w12 {
  width: 1200px;
  height: auto;
  margin: 0 auto;
  overflow: inherit;
}

.transition,
.header .head_tool .btn,
.banner .btn,
.ind_banner .btn,
.min_banner .btn {
  transition: .5s all;
  -webkit-transition: .5s all;
  -moz-transition: .5s all;
  -o-transition: .5s all;
}


.mobilephone{
  font-size: 16px;
  font-weight: bold;
  color: #5333FF;
  line-height: 64px;
}

.mobilephone img{
  width: 14px;
  height: 20px;
  float: left;
  margin-right: 8px;
  margin-top: 22px;
}
/* ------------------- fr_contact ------------------- */

.fr_contact{
  width: 70px;
  height: auto;
  background: #1A7AF8;
  position: fixed;
  right: 10px;
  bottom: 160px;
  text-align: center;
  z-index: 10000;
  border-radius: 4px;
}

.fr_contact li{
  padding: 20px 10px 0px 10px;
  height: 92px;
  cursor: pointer;
}

.fr_contact li .inner{
  width: 50px;
  height: 72px;
  display: block;
  border-bottom: 1px solid #4794F9;
}

.fr_contact img{
  width: 24px;
  height: 24px;
  display: inline-block;
  margin-bottom: 12px;
}

.fr_contact span{
  width: 100%;
  font-size: 12px;
  font-weight: 500;
  color: #FFFFFF;
  line-height: 12px;
  display: block;
}

.contact_content{
  visibility: hidden;
  position: absolute;
  font-size: 16px;
  font-weight: 800;
  color: #1A7AF8;
  line-height: 20px;
  text-align: left;
  cursor: default;
}

.fr_contact li:hover .contact_content{
  visibility: visible;
}

.contact_content01{
  width: 250px;
  height: 124px;
  top: 0px;
  left: -240px;
  padding-left: 36px;
  padding-top: 30px;
  background: url("../static/vipcardcloudpc_fr_box01@2x.png") center no-repeat;
  background-size: 250px 124px;
}

.contact_content02{
  width: 250px;
  height: 92px;
  top: 108px;
  left: -240px;
  padding-left: 36px;
  padding-top: 34px;
  background: url("../static/vipcardcloudpc_fr_box02@2x.png") center no-repeat;
  background-size: 250px 92px;
}

.contact_content03{
  width: 160px;
  height: 152px;
  top: 185px;
  left: -150px;
  padding-left: 26px;
  padding-top: 24px;
  background: url("../static/vipcardcloudpc_fr_box03@2x.png") center no-repeat;
  background-size: 160px 152px;
}

.contact_content03 img{
  width: 100px;
  height: 100px;
}


/* ------------------- top_nav ------------------- */

.header {
  width:100%;
  height:64px;
  background:rgba(255,255,255,1);
  box-shadow: 0px 8px 32px -8px rgba(47, 56, 111, 0.08);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 200;
}

.navbar {
  width:1200px;
  height:64px;
  margin: 0 auto;
}

.logo img{
  width: 200px;
  margin-top:15px;
}

.top_nav{
  margin: 0 auto;
  line-height: 64px;
}

.top_nav a{
  font-size: 16px;
  color: #333333;
  margin-right: 50px;
}

.top_nav a:hover{
  color: #4772FF;
}


.top_nav .current{
  color: #1A7AF8;
}

.login{
  font-size: 14px;
  font-weight: bold;
  color: #1A7AF8;
  line-height: 64px;
}

.register {
  width:88px;
  height:32px;
  margin-top: 16px;
  background: linear-gradient(180deg, #3899FC 0%, #1A7AF8 100%);
  box-shadow: 0px 8px 24px -4px rgba(26, 122, 248, 0.3);
  border-radius:16px;
  color: #fff;
  display: block;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  line-height: 32px;
  text-decoration: none;
  display: inline-block;
}

.register:hover {
  transition: background-color .3s linear;
  background: #1A7AF8;
  transition: box-shadow 0.4s;
  -moz-transition: box-shadow 0.4s; /* Firefox 4 */
  -webkit-transition: box-shadow 0.4s; /* Safari 和 Chrome */
  -o-transition: box-shadow 0.4s; /* Opera */
}



/*-------------------------------------------------------------------------------- home --------------------------------------------------------------------------------*/



/*-------- home_banner --------*/

.bannerbox {
  height: 440px;
  width: 100%;
  margin-top: 80px;
  overflow: hidden;
  position: relative;
}

.containt-div {
  width: 1200px;
  position: relative;
  height: 440px;
  margin: 0 auto;
}

.bannerbox ul {
  position: relative;
}

.bannerbox ul li {
  list-style: none;
  width: 100%;
  height: 440px;
  position: absolute;
  left: 0;
  top: 0;
}

.bannerbox ul li.fst-li {
  background: url("../static/vipcardcloudpc_banner01_bg@2x.png") center no-repeat;
  background-size: cover;
}

.bannerbox ul li.sec-li {
  background: url("../static/vipcardcloudpc_banner02_bg@2x.png") center no-repeat;
  background-size: cover;
}

.bannerbox ul li.third-li {
  background: url("../static/vipcardcloudpc_banner03_bg@2x.png") center no-repeat;
  background-size: cover;
}

.bannerbox ul li .img1 {
  position: absolute;
}

.banner-01-a, .banner-02-a, .banner-03-a {
  width: 415px;
  height: 253px;
  position: absolute;
  top: 100px;
  left: 50%;
  margin-left: -600px;
  filter:alpha(opacity=0);
  -moz-opacity:0;
  -khtml-opacity: 0;
  opacity: 0;
}

.banner-01-a img, .banner-02-a img, .banner-03-a img {
  width: 415px;
  height: 253px;
  cursor: pointer;
}

.banner-01-b, .banner-02-b, .banner-03-b {
  width: 790px;
  height: 440px;
  cursor: pointer;
  top: 0px;
  right: 50%;
  position: absolute;
  margin-right: -600px;
  filter:alpha(opacity=0);
  -moz-opacity:0;
  -khtml-opacity: 0;
  opacity: 0;
}

.banner-01-b img, .banner-02-b img, .banner-03-b img {
  width: 790px;
  height: 440px;
}

.nav {
  width:160px;
  height:14px;
  position:absolute;
  bottom:10px;
  right:20px;
  z-index: 2;
  left: 50%;
  margin-left: -50px
}

.nav dl dd {
  width:32px;
  height:8px;
  float: left;
  background:rgba(0,0,0,0.1);
  border-radius:4px;
}

.nav dl .bg {
  width:32px;
  height:8px;
  background:#1A7AF8;
  border-radius:4px;
}



/*-------- home_questions --------*/

.questions {
  width: 100%;
  height: 570px;
  background: #ffffff;
}

.questions li{
  width: 380px;
  height: 124px;
  float: left;
  margin-right: 30px;
  border-radius: 4px;
  background: #FFFFFF;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.04);
  padding: 30px;
  margin-top: 30px;
}

.questions li:hover{
  transition:all .5s ease;
  -webkit-box-shadow:0 30px 36px -12px rgba(12,21,35,0.06);
  box-shadow:0 30px 36px -12px rgba(12,21,35,0.06)
}

.questions li:hover img, .questions li:hover span{
  transition:all .5s ease;
  -webkit-transform:translateY(-8px);
  transform:translateY(-8px);
}

.questions li:nth-child(3n+3) {
    margin-right: 0;
}

.questions li img{
  width: 64px;
  height: 64px;
}

.questions li span{
  font-size: 20px;
  font-weight: bold;
  color: #333333;
  line-height: 64px;
  display: block;
}



/*-------- home_system --------*/

.system{
  width: 100%;
  height: 886px;
  background: #F6F9FF;
}

.system img{
  width: 600px;
  height: 488px;
  margin: 60px auto;
}

.system a {
  width:156px;
  height:44px;
  margin: 0 auto;
  background: linear-gradient(180deg, #3899FC 0%, #1A7AF8 100%);
  box-shadow: 0px 8px 24px -4px rgba(26, 122, 248, 0.3);
  border-radius:22px;
  color: #fff;
  display: block;
  text-align: center;
  font-size: 18px;
  font-weight: 600;
  line-height: 44px;
}

.system a:hover {
  transition: background-color .3s linear;
  background: #1A7AF8;
  transition: box-shadow 0.4s;
  -moz-transition: box-shadow 0.4s; /* Firefox 4 */
  -webkit-transition: box-shadow 0.4s; /* Safari 和 Chrome */
  -o-transition: box-shadow 0.4s; /* Opera */
}

/*-------- home_advantages --------*/

.advantages{
  width: 100%;
  height:942px;
  background:#ffffff;
  background: url("../static/vipcardcloudpc_home_bg_advantages@2x.png") bottom no-repeat;
  background-size: 100% 400px;
}

.advantages ul{
  width: 540px;
  height: 630px;
  background: rgba(255, 255, 255, 0.6);
  border: 4px solid #EDEDED;
  padding: 0px 40px 0px 40px;
}

.tradition{
  margin-right: 10px;
  border-radius: 8px 40px 8px 40px;
  border: 4px solid #EDEDED;
  box-shadow: 0px 8px 24px -4px rgba(0, 0, 0, 0.04);
}

.vipcard_system{
  margin-left: 10px;
  border-radius: 40px 8px 40px 8px;
  border: 4px solid #DFEAF8;
  box-shadow: 0px 8px 24px -4px rgba(26, 122, 248, 0.1);
}

.advantages li{
  margin-bottom: 32px;
}

.advantages h3{
  display: block;
  font-size: 24px;
  line-height: 60px;
  margin: 0 auto;
  background-size: cover;
  text-align: center;
  color: #FFFFFF;
  position: relative;
  top: -30px;
}

.tradition h3{
  background: url("../static/vipcardcloudpc_img_tradition@2x.png") center no-repeat;
  background-size:300px 60px;
}

.vipcard_system h3{
  background: url("../static/vipcardcloudpc_img_vipsystem@2x.png") center no-repeat;
  background-size:300px 60px;
}

.advantages li img{
  width: 40px;
  height: 40px;
}

.advantages li p{
  font-size: 16px;
  font-weight: 500;
  color: #666666;
  line-height: 28px;
  padding-left: 60px;
}

.tradition li p, .vipcard_system li p{
  color: #666666;
}

.advantages .contrast_object span{
  width: 100px;
  height: 44px;
  display: block;
  background: #1A7AF8;
  box-shadow: 0px 4px 8px -2px rgba(26, 122, 248, 0.2);
  border-radius: 24px;
  font-size: 16px;
  font-weight: bold;
  color: #FFFFFF;
  text-align: center;
  line-height: 44px;
}

.contrast_object span:nth-child(1){
  margin-top: 66px;
}

.contrast_object span:nth-child(2){
  margin-top: 44px;
}

.contrast_object span:nth-child(3){
  margin-top: 72px;
}

.contrast_object span:nth-child(4){
  margin-top: 44px;
}

.contrast_object span:nth-child(5){
  margin-top: 44px;
}

.contrast_object span:nth-child(6){
  margin-top: 44px;
}



/*-------- industry --------*/

.industry{
  background: #F6F9FF;
  height: auto;
  overflow: hidden;
}

.industry_inner{
  width: 1200px;
  height: auto;
  margin: 0 auto;
}

.industry_lists li{
  cursor: pointer;
  float: left;
  margin-right: 20px;
  margin-bottom: 20px;
  width: 285px;
  height: 200px;
  border-radius: 16px;
}

.industry_lists li:hover{
  transition:all .8s ease;
  transform: scale(1.1);
  -ms-transform: scale(1.1);
}

.industry_lists li:nth-child(4n+4){
  margin-right: 0px;
}

.industry_lists li:nth-child(1){
  background: url(../static/vipcardcloudpc_home_img_industry01@2x.png) center no-repeat;
  background-size:285px 200px;
}

.industry_lists li:nth-child(2){
  background: url(../static/vipcardcloudpc_home_img_industry02@2x.png) center no-repeat;
  background-size:285px 200px;
}

.industry_lists li:nth-child(3){
  background: url(../static/vipcardcloudpc_home_img_industry03@2x.png) center no-repeat;
  background-size:285px 200px;
}

.industry_lists li:nth-child(4){
  background: url(../static/vipcardcloudpc_home_img_industry04@2x.png) center no-repeat;
  background-size:285px 200px;
}

.industry_lists li:nth-child(5){
  background: url(../static/vipcardcloudpc_home_img_industry05@2x.png) center no-repeat;
  background-size:285px 200px;
}

.industry_lists li:nth-child(6){
  background: url(../static/vipcardcloudpc_home_img_industry06@2x.png) center no-repeat;
  background-size:285px 200px;
}

.industry_lists li:nth-child(7){
  background: url(../static/vipcardcloudpc_home_img_industry07@2x.png) center no-repeat;
  background-size:285px 200px;
}

.industry_lists li:nth-child(8){
  background: url(../static/vipcardcloudpc_home_img_industry08@2x.png) center no-repeat;
  background-size:285px 200px;
}

.industry_lists li span{
  width: 100px;
  height: 100px;
  margin: 50px auto;
  border-radius: 50px;
  font-size: 18px;
  display: block;
  border: 4px solid rgba(255, 255, 255, 0.4);
  color: #FFFFFF;
  text-align: center;
  line-height: 92px;
}

.industry_lists li:hover span{
  background: linear-gradient(-30deg, #9b1aff 0%, #4a2bff 100%);
  opacity: 0.8;
  border: none;
  line-height: 100px;
  transition:all .8s ease;
}



/*-------- home_process --------*/

.process{
  background: url(../static/vipcardcloudpc_bg_process@2x.png) bottom no-repeat;
  background-size:cover;
}

.process ul{
width: 100%;
height: auto;
overflow: hidden;
}

.process .arrow_down{
  width: 22px;
  height: 10px;
  margin: 15px 76px;
}

.process h4{
  width: 172px;
  height: 100px;
  border-radius: 8px;
  text-align: center;
  font-size: 20px;
  font-weight: 800;
  color: #FFFFFF;
  line-height: 100px;
  margin-right: 32px;
}

.process01 h4{
  background: url(../static/vipcardcloudpc_home_img_process01@2x.png) center no-repeat;
  background-size:172px 100px;
}

.process02 h4{
  background: url(../static/vipcardcloudpc_home_img_process02@2x.png) center no-repeat;
  background-size:172px 100px;
}

.process03 h4{
  background: url(../static/vipcardcloudpc_home_img_process03@2x.png) center no-repeat;
  background-size:172px 100px;
}

.process li{
  height: 48px;
  background: #FFFFFF;
  padding: 0px 16px;
  box-shadow: 0px 2px 16px 0px rgba(26, 122, 248, 0.1);
  border-radius: 24px;
  border: 1px dashed #BDD6FF;
  line-height: 48px;
  margin-top: 26px;
  font-weight: 800;
}

.process img{
  width: 20px;
  height: 12px;
  margin-top: 44px;
}



/*-------- home_system_display --------*/

.system_display{
  width: 100%;
  height: auto;
  overflow: hidden;
}
.bg_duan{
  overflow: hidden;
  height:212px;
  background:url(../static/vipcardcloudpc_home_bg_systemdisplay@2x.png) center no-repeat;
  background-size: cover;
}



.terminal {
  cursor: pointer;
  font-size: 20px;
  line-height: 60px;
  color: #fff;
  width:200px;
  height:60px;
  width:200px;
  border-radius:20px 20px 0px 0px;
  font-weight: 600;
  text-align: center;
}

.terminal:nth-child(3) {
  padding-right: 0
}

.terminal.active {
  color: #1A7AF8;
  transition: background-color 1s;
  -moz-transition: background-color 1s; /* Firefox 4 */
  -webkit-transition: background-color 1s; /* Safari 和 Chrome */
  -o-transition: background-color 1s; /* Opera */
}

.display_area{
  width: 100%;
  height: 618px;
  overflow: hidden;
  background: linear-gradient(180deg, #FFFFFF 0%, #F5F9FF 100%);
}

.case-panel {
  position: absolute;
  width: 1200px;
  z-index: 1;
  opacity: 0;
  height: auto;
  overflow: hidden;
}

.case-panel.active {
  z-index: 100;
  opacity: 1;
  -webkit-transition: all .2s ease-out .1s;
  transition: all .2s ease-out .1s
}


.system_display li{
  width: 285px;
  height: 518px;
  overflow: hidden;
}

.system_display .tab-1 li:nth-child(1){
  background: url("../static/vipcardcloudpc_home_img_systemdisplay01@2x.png") center no-repeat;
  background-size:285px 518px;
}

.system_display .tab-1 li:nth-child(2){
  background: url("../static/vipcardcloudpc_home_img_systemdisplay02@2x.png") center no-repeat;
  background-size:285px 518px;
}

.system_display .tab-1 li:nth-child(3){
  background: url("../static/vipcardcloudpc_home_img_systemdisplay03@2x.png") center no-repeat;
  background-size:285px 518px;
}

.system_display .tab-1 li:nth-child(4){
  background: url("../static/vipcardcloudpc_home_img_systemdisplay04@2x.png") center no-repeat;
  background-size:285px 518px;
}

.system_display .tab-2 li:nth-child(1){
  background: url("../static/vipcardcloudpc_home_img_systemdisplay05@2x.png") center no-repeat;
  background-size:285px 518px;
}

.system_display .tab-2 li:nth-child(2){
  background: url("../static/vipcardcloudpc_home_img_systemdisplay06@2x.png") center no-repeat;
  background-size:285px 518px;
}

.system_display .tab-2 li:nth-child(3){
  background: url("../static/vipcardcloudpc_home_img_systemdisplay07@2x.png") center no-repeat;
  background-size:285px 518px;
}

.system_display .tab-2 li:nth-child(4){
  background: url("../static/vipcardcloudpc_home_img_systemdisplay08@2x.png") center no-repeat;
  background-size:285px 518px;
}

.system_display .tab-3 li{
  background: url("../static/vipcardcloudpc_home_img_systemdisplay09@2x.png") center no-repeat;
  background-size:1200px 490px;
}

.system_display .title02{
  width: 158px;
  height: 88px;
  margin: 0 auto;
  color: #ffffff;
  text-align: center;
  background: url("../static/vipcardcloudpc_home_box_systemdisplay@2x.png") center no-repeat;
  background-size:158px 88px;
  margin-bottom: 10px;
  line-height: 66px;
}

.system_display li img{
  width: 285px;
  height: auto;
  overflow: hidden;
}

.system_display ul{
  width: 1200px;
  height: auto;
  overflow: hidden;
}

/*-------- home_contact_us --------*/

.contact_us{
  width: 100%;
  height:auto;
  background:#ffffff;
  overflow: hidden;
  background: url("../static/vipcardcloudpc_img_bottom@2x.png") right top no-repeat;
  background-size:480px 418px;
}

.contact_us_l, .contact_us_m, .contact_us_r{
  width: 400px;
  height: auto;
  text-align: center;
  overflow: hidden;
}

.contact_us_l, .contact_us_r{
  margin-top: 30px;
}

.contact_us h5{
  font-size:16px;
  font-weight:600;
  color:rgba(0,0,0,1);
  line-height:20px;
  margin-bottom: 20px;
}

.contact_us .description{
  font-size:14px;
  font-weight:400;
  color:rgba(102,102,102,1);
  line-height:18px;
  margin-bottom: 32px;
}

.contact_us_num{
  width:200px;
  height:40px;
  margin: 0 auto;
  line-height: 40px;
  font-size:16px;
  font-weight:600;
  color:#1A7AF8;
  background:#EAF2FF;
  border-radius:20px;
}

.contact_us img.erweima{
  width: 100px;
  height: 100px;
  display: block;
  margin:0 auto 20px auto;
}



/*-------------------------------------------------------------------------------- footer--------------------------------------------------------------------------------*/

.footer{
  width:100%;
  overflow: hidden;
  color: #fff;
  text-align: center;
  line-height: 30px;
  background:#1A7AF8;
  padding:30px 0;
}
.footer a{color:#fff;font-size:14px;}

.footer .footer_nav{width:100%;padding:10px 0;text-align:center;color:#c6dfff;font-size:12px;}
.footer .footer_nav a{color:#c6dfff;font-size:14px;}



/*-------------------------------------------------------------------------------- agent --------------------------------------------------------------------------------*/



/*-------- agent_banner --------*/

.agent_banner{
  width: 100%;
  height: 384px;
  background: url("../static/vipcardcloudpc_agent_bg_banner@2x.png") center no-repeat;
  background-size: cover;
  padding-top: 80px;
}

.apply_btn{
  width: 294px;
  height: 44px;
  margin: 80px auto;
}

.agent_banner a, .apply_btn button{
  width:132px;
  height:44px;
  border-radius:22px;
  color: #fff;
  display: block;
  text-align: center;
  font-size: 18px;
  font-weight: 800;
  line-height: 44px;
}

.agent_banner a.apply_agent{
  background: linear-gradient(180deg, #3899FC 0%, #1A7AF8 100%);
  box-shadow: 0px 8px 24px -4px rgba(26, 122, 248, 0.3);
}

.agent_banner .apply_btn button{
  background: linear-gradient(180deg, #6091FF 0%, #5E40FF 100%);
  box-shadow: 0px 8px 24px -4px rgba(74, 43, 255, 0.3);
  border: none;
}

.agent_banner a.apply_agent:hover {
  transition: background-color .3s linear;
  background: #1A7AF8;
  box-shadow: 0px 8px 24px -4px rgba(26, 122, 248, 0.3);
  transition: box-shadow 0.4s;
  -moz-transition: box-shadow 0.4s; /* Firefox 4 */
  -webkit-transition: box-shadow 0.4s; /* Safari 和 Chrome */
  -o-transition: box-shadow 0.4s; /* Opera */
}

.agent_banner .apply_btn button:hover {
  transition: background-color .3s linear;
  background: #5E40FF;
  box-shadow: 0px 8px 24px -4px rgba(74, 43, 255, 0.3);
  transition: box-shadow 0.4s;
  -moz-transition: box-shadow 0.4s; /* Firefox 4 */
  -webkit-transition: box-shadow 0.4s; /* Safari 和 Chrome */
  -o-transition: box-shadow 0.4s; /* Opera */
}

.black_overlay{
  display: none;
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
  background-color: black;
  z-index:1001;
  -moz-opacity: 0.6;
  opacity:.60;
  filter: alpha(opacity=60);
}

.white_content {
  display: none;
  position: absolute;
  top: 200px;
  left: 38%;
  width:24%;
  min-width: 400px;
  height: 420px;
  background-color: white;
  z-index:1002;
  overflow: auto;
  border-radius: 16px;
  text-align: center;
}

.close_r span{
  width: 40px;
  height: 40px;
  border-radius: 20px;
  color: #FFFFFF;
  background: rgba(0, 0, 0, 0.6);
  text-align: center;
  position: absolute;
  top: 10px;
  right: 10px;
  line-height: 40px;
}

.white_content h2{
  margin-top: 30px;
  font-size: 24px;
}

.white_content img{
  width: 200px;
  height: 200px;
  margin: 24px auto;
}

.white_content p{
  font-size: 16px;
  font-weight: 800;
  color: #1A7AF8;
  line-height: 20px;
  text-align: center;
  margin-bottom: 20px;
}

/*-------- agent_advantages --------*/

.agent_advantages{
  width: 100%;
  height: 486px;
  background: url("../static/vipcardcloudpc_img_circle@2x.png") left 40px no-repeat;
  background-size: 200px 200px;
}

.agent_advantages01{
  width: 380px;
  height: 310px;
  background: #FFFFFF;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.04);
  border-radius: 8px;
  margin-right: 30px;
  text-align: center;
  padding: 71px 30px;
}

.agent_advantages01:hover, .agent_advantages li:hover{
  transition:all .5s ease;
  -webkit-box-shadow:0 30px 36px -12px rgba(12,21,35,0.06);
  box-shadow:0 30px 36px -12px rgba(12,21,35,0.06)
}

.agent_advantages01:hover img, .agent_advantages01:hover p, .agent_advantages li:hover img, .agent_advantages li:hover span{
  transition:all .5s ease;
  -webkit-transform:translateY(-8px);
  transform:translateY(-8px);
}

.agent_advantages01 img{
  display: block;
  margin:0px auto 42px auto;
}

.agent_advantages ul{
  width: 790px;
  height: 310px;
}

.agent_advantages li{
  width: 380px;
  height: 140px;
  background: #FFFFFF;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.04);
  border-radius: 8px;
  padding: 30px;
  overflow: hidden;
}

.agent_advantages span{
  width: 210px;
  font-size: 16px;
  color: #333333;
  line-height: 24px;
}

.agent_advantages img{
  width: 80px;
  height: 80px;
}

.agent_advantages li img{
  float: right;
}

/*-------- agent_condition --------*/

.agent_condition{
  width: 100%;
  height:464px;
}

.agent_condition ul{
  width: 100%;
  height:auto;
}

.agent_condition li{
  width: 224px;
  height: 208px;
  background: #FFFFFF;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.04);
  border-radius: 8px;
  float: left;
}

.agent_condition li:hover{
  transition:all .5s ease;
  -webkit-box-shadow:0 30px 36px -12px rgba(12,21,35,0.06);
  box-shadow:0 30px 36px -12px rgba(12,21,35,0.06)
}

.agent_condition li:nth-child(1), .agent_condition li:nth-child(2), .agent_condition li:nth-child(3), .agent_condition li:nth-child(4){
  margin-right: 20px
}

.hr01, .hr02, .hr03, .hr04, .hr05{
  width: 224px;
  height: 6px;
  border-radius: 8px 8px 0px 0px;
}

.agent_condition .hr01{
  background: linear-gradient(270deg, #8776FF 0%, #6091FF 100%);
}

.agent_condition .hr02{
  background: linear-gradient(270deg, #FF8159 0%, #FFB82D 100%);
}

.agent_condition .hr03{
  background: linear-gradient(90deg, #1A7AF8 0%, #00A1FF 100%);
}

.agent_condition .hr04{
  background: linear-gradient(270deg, #97CC14 0%, #00C657 100%);
}

.agent_condition .hr05{
  background: linear-gradient(270deg, #7AD880 0%, #1DC6D7 100%);
}

.agent_condition h5{
  width: 224px;
  height: 70px;
  font-size: 18px;
  font-weight: 600;
  line-height: 70px;
  text-align: center;
}

.agent_condition .h501{
  background: #F9FBFF;
  color: #8776FF;
}

.agent_condition .h502{
  background: #FFFCF7;
  color: #FF8159;
}

.agent_condition .h503{
  background: #F6FAFF;
  color: #1A7AF8;
}

.agent_condition .h504{
  background: #F6FDF9;
  color: #00C657;
}

.agent_condition .h505{
  background: #F7FDFE;
  color: #1CC7D5;
}

.agent_condition p{
  font-size: 16px;
  font-weight: 400;
  color: #666666;
  line-height: 28px;
  padding:20px 24px;
}

.agent_condition li:hover h5, .agent_condition li:hover p{
  transition:all .5s ease;
  -webkit-transform:translateY(-8px);
  transform:translateY(-8px);
}

/*-------- agent_condition --------*/

.agent_process{
  width: 100%;
  height: 438px;
  background: #F6F9FF;
}

.agent_process ul{
  margin-left: 80px;
}

.agent_process li .process_img{
  width: 140px;
  height: 140px;
  background: #FFFFFF;
  border-radius: 70px;
  padding: 38px;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.02);
}

.agent_process li:hover .process_img, .agent_process li:hover p{
  transition:all .5s ease;
  -webkit-transform:translateY(-8px);
  transform:translateY(-8px);
}

.agent_process li .process_img img{
  width: 64px;
  height: 64px;
}

.agent_process li p{
  width: 140px;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  color: #333333;
  line-height: 22px;
  margin-top: 20px;
}

.agent_process .arrow{
  width: 20px;
  height: 38px;
  margin: 51px 70px;
}

/*-------- agent_apply --------*/

.apply{
  width: 1200px;
  height: 100px;
  margin: 80px auto 0 auto;
  border-radius: 8px;
  padding: 26px 410px;
  background: url(../static/vipcardcloudpc_agent_bg_apply@2x.png) center no-repeat;
  background-size: 1200px 100px;
}

.apply span{
  font-size: 24px;
  font-weight: 600;
  color: #FFFFFF;
  line-height: 48px;
  float: left;
}

.apply a{
  display: block;
  width: 140px;
  height: 48px;
  margin-left: 24px;
  background: #FFFFFF;
  border-radius: 24px;
  font-size: 20px;
  font-weight: 600;
  color: #1A7AF8;
  line-height: 48px;
  float: left;
  text-align: center;
}

.apply a:hover{
  background: #FFFFFF;
  opacity: 0.6;
}



/*-------------------------------------------------------------------------------- news --------------------------------------------------------------------------------*/

.news_banner{
  width: 100%;
  height: 180px;
  background: url("../static/vipcardcloudpc_news_banner@2x.png") center no-repeat;
  background-size: cover;
  padding-top: 40px;
}

.news_lists{
  width: 1200px;
  height: auto;
}

.news_lists li{
  width: 400px;
  float: left;
}

.news_lists li a{
  width: 380px;
  height: 425px;
  padding: 20px;
  display: block;
  margin-right: 30px;
  margin-bottom: 30px;
  background: #FFFFFF;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.04);
  border-radius: 8px;
  overflow: hidden;
}

.news_lists li a:hover{
  transition:all .5s ease;
  -webkit-box-shadow:0 30px 36px -12px rgba(12,21,35,0.06);
  box-shadow:0 30px 36px -12px rgba(12,21,35,0.06)
}

.news_lists li a:nth-child(3n+3) {
  margin-right: 0;
}

.news_lists li img{
  width: 340px;
  height: 340px;
  border-radius: 4px;
  transition: all 0.6s;
  -ms-transition: all 0.8s;
}

.news_lists li a:hover h4{
  color: #1A7AF8;
}

.news_lists li img:hover{
  transform: scale(1.2);
  -ms-transform: scale(1.2);
}

.news_lists li h4{
  font-size: 16px;
    font-weight: bold;
    color: #333333;
    line-height: 22px;
    margin-top: 20px;
    text-align: center;
    margin-bottom: 16px;
}

.news_lists li p{
  font-size: 14px;
  width: 340px;
  height: 40px;
  overflow: hidden;
  font-weight: 400;
  color: #999999;
  line-height: 20px;
}

.view-more{
  width: 1200px;
  height: 50px;
  overflow: hidden;
  text-align: center;
}

.view-more .more a {
    display: inline-block;
    width: 200px;
    height: 50px;
    line-height: 50px;
    color: #1A7AF8;
    border: 1px solid #1A7AF8;
    font-size: 18px;
    border-radius: 3px;
}

.view-more .more a:hover {
    color: #FFFFFF;
    background: #1A7AF8;
}



/*-------------------------------------------------------------------------------- news_details --------------------------------------------------------------------------------*/

.content_area {
    max-width: 1000px;
    margin: 0 auto;
}

.site_main {
    min-height: 50%;
}

.site_main a{
  font-size: 16px;
  font-weight: bold;
  color: #000000;
  line-height: 22px;
}
.site_main span{
  font-size: 16px;
  font-weight: bold;
  color: #1A7AF8;
  line-height: 22px;
}


.site_main .time{
  width: 1000px;
  display: block;
  margin: 24px auto;
  font-size: 14px;
  font-weight: 400;
  color: #333333;
  line-height: 20px;
  text-align: center;

}

.news_des hr{
  margin-top: 40px;
  margin-bottom: 40px;

}

.article_content {
    max-width: 1000px;
    margin: 50px auto 0;
}

.article_title {
  width: 1000px;
  text-align: center;
  font-size: 26px;
  font-weight: 600;
  color: #333333;
  line-height: 37px;

}

article{
  margin-top: 40px;
}

.news_des img {
  margin:0 auto;
}

.news_des p {
  margin-top: 20px;
  font-size: 16px;
  color: #808080;
  line-height: 23px;
  margin-bottom: 35px;
}



/*-------------------------------------------------------------------------------- help_center --------------------------------------------------------------------------------*/

.help_banner{
  width: 100%;
  height: 180px;
  background: url("../static/vipcardcloudpc_helpcenter_banner@2x.png") center no-repeat;
  background-size: cover;
  padding-top: 40px;
}

.main-app {
  width: 1200px;
  margin: 0 auto;
  margin-top: 40px;
  margin-bottom: 80px;
  overflow: hidden;
  min-height: 500px;
}

.main-app label {
  font-size: 16px;
}

.main-app a {
  outline: 0;
  text-decoration: none;
  color: #333;
}

.main-app a:hover {
  color: #333;
}

.sidebar {
  width: 200px;
  padding: 10px 0;
  color: #333;
  background: #f8f9fd;
  text-align: center;
  font-size: 16px;
  float: left;
  min-height: 470px;
  border-radius: 0px;
  height: auto;
  overflow: hidden;
}


/* 变量 */
.list-item {
  position: relative;
  font-size: 16px;
  text-align: left;
  cursor: pointer;
  font-weight: 600;
}

.list-item.open .sub-list {
  display: block;
}

.list-item.open .cat-name {
  color: #1A7AF8;
}

.list-item.open .cat-name:before {
  border-left: 12px solid #1A7AF8;
}

.list-item .cat-name {
  position: relative;
  padding-left: 60px;
  line-height: 64px;
  cursor: pointer;
  white-space: nowrap;
}

.list-item .cat-name:before {
  position: absolute;
  left: 30px;
  top: 50%;
  margin-top: -8px;
  content: '';
  border: 8px solid transparent;
  border-left: 12px solid #c0c8d8;
}

.list-item .cat-name:hover {
  color: #1A7AF8;
}

.list-item .cat-name:hover:before {
  border-left: 12px solid #1A7AF8;
}

.list-item .sub-list {
  cursor: pointer;
  margin-left: 20px;
  font-size: 14px;
  display: none;
}

.list-item .sub-list li {
  width: 160px;
  height: 40px;
}

.list-item .sub-list li a{
  display: block;
  font-size: 14px;
  line-height: 40px;
  border-radius: 3px;
  padding-left: 10px;
  white-space: nowrap;
  color: #333333;
}


.list-item .sub-list li a:hover {
  background: #ebf0f6;
}

.list-item .sub-list li a.list_active {
  background: #ebf0f6;
}

.main_content {
  width: 940px;
  padding: 0px 60px;
}

.help-list{
  width: 940
  visibility:hidden;
}

.con_active{
  visibility:visible;
}

.help-list h3.help_title{
  font-size: 24px;
  font-weight: 600;
  color: #000000;
  line-height: 28px;
  margin-bottom: 16px;
}

.help-list p.time{
  font-size: 12px;
  font-weight: 400;
  color: #999999;
  line-height: 16px;
}

.help_content{
  width: 100%;
  margin-top: 32px;
}

.help_content p{
  font-size: 14px;
  font-weight: 400;
  color: #000000;
  line-height: 18px;
  margin-bottom: 24px;
}

.help_content img{
  margin-bottom: 24px;
  width: 100%;
}




/*-------------------------------------------------------------------------------- about_us --------------------------------------------------------------------------------*/

.about_us{
  width: 100%;
  height: 560px;
  margin-top: 64px;
  background: linear-gradient(360deg, #FFFFFF 0%, #1A7AF8 100%);
}

.about_us_title{
  width: 400px;
  margin-bottom: 60px
}

.about_us_title h1{
  width: 100%;
  text-align: center;
  color: #ffffff;
  margin-bottom:24px;
}

.about_us_title h6{
  width: 100%;
  text-align: center;
  color:#ffffff;
}

.top_con img{
  width: 400px;
  height: 172px;
  margin-top: -20px;
}

.company{
  height: 548px;
  background: #FFFFFF;
  border-radius: 40px 40px 0px 0px;
  padding: 60px 40px;
  overflow: hidden;
  margin-top: -330px;

}

.company_title, .contact_title, .culture_title{
  width: 176px;
  height: 36px;
  margin:0 auto;
}

.company_title img, .contact_title img, .our_culture img{
  width: 32px;
  height: 32px;
  margin-right: 16px;
}

.company_intro {
  font-size: 16px;
  font-weight: 400;
  color: #666666;
  line-height: 28px;
}

.company_intro span {
  font-size: 20px;
  font-weight: 800;
  color: #1A7AF8;
  line-height: 28px;
}

.company_intro p {
  margin-top: 24px;
}

.our_target li{
  width: 360px;
  height: 120px;
  padding: 20px;
  border-radius: 8px;
}

.our_target li:hover img{
  transition:all .5s ease;
  -webkit-transform:translateY(-8px);
  transform:translateY(-8px);
}

.our_target li:nth-child(1){
 background: url("../static/vipcardcloudpc_about_bg_about01@2x.png") center no-repeat;
 background-size: cover;
}

.our_target li:nth-child(2){
 background: url("../static/vipcardcloudpc_about_bg_about02@2x.png") center no-repeat;
 background-size: cover;
}

.our_target li:nth-child(3){
 background: url("../static/vipcardcloudpc_about_bg_about03@2x.png") center no-repeat;
 background-size: cover;
}

.our_target li span{
  font-size: 16px;
  font-weight: 400;
  color: #FFFFFF;
  line-height: 80px;
  margin-left: 20px;
}


.our_target li img{
  width: 80px;
  height: 80px;
}

.contact{
  padding: 80px 0;
}

.contact_con{
  width: 1200px;
  height: 320px;
  background: #FFFFFF;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.04);
  margin-top: 60px;
}

.contact .contact_erweima{
  width: 320px;
  height: 320px;
  overflow: hidden;
  border-right: 1px solid #EDEDED;
  text-align:center;
}

.contact .contact_erweima img{
  width: 120px;
  height: 120px;
  margin-top: 60px;
  display: inline-block;
  margin-bottom: 40px;
}

.contact .contact_erweima p{
  font-size: 20px;
  font-weight: 400;
  color: #000000;
  line-height: 24px;
}

.contact ul{
  width: 880px;
  height: 320px;
  overflow: hidden;
}

.contact ul li{
  width: 880px;
  height: 80px;
  padding: 24px 40px;
  border-bottom: 1px solid #EDEDED;
}

.contact ul li:nth-child(4){
  border-bottom: none;
}

.contact_con ul li img{
  width: 24px;
  height: 24px;
  float: left;
  margin-top: 4px;
}

.contact_con .span_l{
  font-weight: 400;
  color: #000000;
  line-height: 32px;
  font-size: 16px;
  margin-left: 16px;
}

.contact_con .span_r{
  background: #F2F7FF;
  width: 80px;
  height: 32px;
  border-radius: 3px;
  font-size: 14px;
  font-weight: 500;
  color: #666666;
  line-height: 32px;
  text-align: center;
}

.our_culture{
  width: 100%;
  height:500px;
  background: url("../static/vipcardcloudpc_about_bg_bottom@2x.png") center no-repeat;
  background-size: cover;
}

.culture_title{
  margin-bottom: 60px;
}

.our_culture li{
  width: 240px;
  height: 326px;
  background: #FFFFFF;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.04);
  border-radius: 8px;
  text-align: center;
}

.our_culture li:hover{
  transition:all .5s ease;
  transform: scale(1.1);
  -ms-transform: scale(1.1);
  -webkit-box-shadow:0 30px 36px -12px rgba(12,21,35,0.06);
  box-shadow:0 30px 36px -12px rgba(12,21,35,0.06)
}

.our_culture li:nth-child(1), .our_culture li:nth-child(2), .our_culture li:nth-child(3), .our_culture li:nth-child(4){
  margin-right: 60px;
}

.our_culture li h3{
  font-size: 24px;
  font-weight: 600;
  color: #333333;
  line-height: 28px;
  width: 100%;
  margin-top: 40px;
  margin-bottom: 40px;
}

.our_culture li img{
  width: 94px;
  height: 94px;
  margin-right: 0;
  display: inline-block;
  margin-bottom: 20px;
}

.our_culture li span{
  padding: 0 8px;
  font-size: 18px;
  font-weight: 500;
  color: #848CA6;
  line-height: 36px;
}

.top_nav{
  height: 64px;
}

.top_nav li{
  height: 64px;
  color: #333333;
}

.top_nav a.nav_item{
  line-height: 36px;
  margin-top: 14px;
  display: block;
  float: left;
}

.top_nav a.current{
  color: #4772FF;
  border-bottom: 4px solid #4772FF;
}

.top_nav a.nav_item:hover{
  transition:all .3s ease;
  color: #4772FF;
  border-bottom: 4px solid #4772FF;
}

.top_nav .solution_con{
  display: none;
  position: fixed;
  left: 50%;
  margin-left: -600px;
  top: 64px;
  width: 1200px;
  height: auto;
  overflow: hidden;
  padding: 20px 20px 10px 20px;
  background: #FFFFFF;
  box-shadow: 0px 8px 24px -4px rgba(0, 0, 0, 0.03);
  border-radius: 0px 0px 8px 8px;
  cursor: default;
  z-index: 1;
}

.top_nav li.solution:hover .solution_con{
  display: block;
}

.solution_con a{
  width: 380px;
  height: 88px;
  background: rgb(71,114,255,0.04);
  border-radius: 4px;
  display: block;
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
  padding: 20px;
}

.solution_con a:hover{
  background: #FFFFFF;
  box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.04);
  transition:all .5s ease;
  -webkit-transform:translateY(-8px);
  transform:translateY(-8px);
}

.solution_con a:nth-child(3n+3){
  margin-right: 0px;
}

.solution_con a h5{
  font-size: 16px;
  font-weight: 400;
  color: #232529;
  line-height: 20px;
  margin-bottom: 12px;
}

.solution_con a:hover h5{
  color: #4772FF;
}

.solution_con a p{
  font-size: 12px;
  font-weight: 400;
  color: #A6AEC2;
  line-height: 16px;
}

.solution_con a i{
  width: 48px;
  height: 48px;
  margin-right: 12px;
  display: inline-block;
  background-size: cover;
}

.solution_icon01{
  background: url(../static/icon_industry_plan01@3x.png) center no-repeat;
}

.solution_icon02{
  background: url(../static/icon_industry_plan02@3x.png) center no-repeat;
}

.solution_icon03{
  background: url(../static/icon_industry_plan03@3x.png) center no-repeat;
}

.solution_icon04{
  background: url(../static/icon_industry_plan04@3x.png) center no-repeat;
}

.solution_icon05{
  background: url(../static/icon_industry_plan05@3x.png) center no-repeat;
}

.solution_icon06{
  background: url(../static/icon_industry_plan06@3x.png) center no-repeat;
}

.solution_icon07{
  background: url(../static/icon_industry_plan07@3x.png) center no-repeat;
}

.solution_icon08{
  background: url(../static/icon_industry_plan08@3x.png) center no-repeat;
}
.solution_icon09{
  background: url(../static/icon_industry_plan09@3x.png) center no-repeat;
}
.solution_icon10{
  background: url(../static/icon_industry_plan10@3x.png) center no-repeat;
}
.solution_icon11{
  background: url(../static/icon_industry_plan11@3x.png) center no-repeat;
}
.solution_icon12{
  background: url(../static/icon_industry_plan12@3x.png) center no-repeat;
}
.solution_icon13{
  background: url(../static/icon_industry_plan13@3x.png) center no-repeat;
}
.solution_icon14{
  background: url(../static/icon_industry_plan14@3x.png) center no-repeat;
}
.solution_icon15{
  background: url(../static/icon_industry_plan15@3x.png) center no-repeat;
}

.saoma{
  width: 100px;
  height: 32px;
  font-size: 14px;
  font-weight: bold;
  color: #FFFFFF;
  line-height: 32px;
  background: #4772FF;
  border-radius: 4px;
  margin-top: 16px;
  position: relative;
}

.saoma a{
  width: 100px;
  height: 32px;
  display: block;
  color: #FFFFFF;
  position: relative;
}

.saoma a:hover {
  transition: background-color .3s linear;
  background: #2E5FFF;
  border-radius: 4px;
  transition: box-shadow 0.4s;
  -moz-transition: box-shadow 0.4s; /* Firefox 4 */
  -webkit-transition: box-shadow 0.4s; /* Safari 和 Chrome */
  -o-transition: box-shadow 0.4s; /* Opera */
}

.saoma a img{
  width: 14px;
  height: 14px;
  float: left;
  margin: 9px 6px 9px 12px;
  margin-right: 8px;
  margin-top: 9px;
}

.saoma_con{
  display: none;
  position: absolute;
  right: 0px;
  top: 48px;
  width: 140px;
  height: auto;
  background: #FFFFFF;
  padding: 10px;
  box-shadow: 0px 8px 32px 0px rgba(47, 56, 111, 0.08);
  border-radius: 0px 0px 8px 8px;
  text-align: center;
}

.saoma:hover .saoma_con{
  display: block;
}

.saoma_con img{
  width: 100px;
  height: 100px;
  display: inline-block;
}

.saoma_con p{
  font-size: 14px;
  font-weight: 400;
  color: #565A66;
  line-height: 18px;
}


.contact_content{
  visibility: hidden;
  position: absolute;
  font-size: 16px;
  font-weight: 800;
  color: #4772FF;
  line-height: 20px;
  text-align: left;
  cursor: default;
}


/*-------------------------------------------------------------------------------- industry common --------------------------------------------------------------------------------*/

.solution_banner{
  width: 100%;
  height: 480px;
  margin-top: 64px;
  padding-top: 80px;
}

.solution_banner h1{
  font-size: 40px;
  font-weight: 800;
  line-height: 44px;
  text-align: left;
  margin-bottom: 32px;
}

.solution_banner h6{
  font-size: 24px;
  font-weight: 400;
  line-height: 28px;
  margin-bottom: 60px;
  text-align: left;
}

.solution_banner a.experience_demo{
  width: 160px;
  height: 48px;
  border-radius: 8px;
  padding: 14px 32px;
  display: block;
  margin-top: 30px;
}

.solution_banner .saoma_experience{
  border-radius: 8px;
  margin-right: 40px;
}

.solution_banner a.experience_demo img{
  width: 20px;
  height: 20px;
  margin-right: 10px;
}

.solution_banner a.experience_demo span{
  font-size: 16px;
  color: #FFFFFF;
}

.solution_banner p.call{
  font-weight: 400;
  line-height: 20px;
  margin-top: 16px;
}

.solution_con{
  width: 100%;
  height: auto;
  overflow: hidden;
}

.solution_con .font440{
  width: 440px;
}

.circle_l,
.circle_r,
.circle_t
{
  width: 260px;
  height: 260px;
  position: absolute;
}

.circle_l {
  top: 60px;
  left: -80px;
}

.circle_r {
  top: 60px;
  right: 80px;
}

.circle_t {
  top: -80px;
  left: 50%;
  margin-left: -130px;
}


/*-------- system_display --------*/


.system_display{
  width: 100%;
  height: auto;
  overflow: hidden;
  background: #FAFFFC;
}

.duan {
  width: 1200px;
  height: 60px;
  margin: 60px auto 0px auto;
  white-space: nowrap;
  border-bottom: 1px solid #EBEDF5;
}

.duan_inner{
  width: 620px;
  margin: 0 auto;
}

.terminal {
  cursor: pointer;
  font-size: 20px;
  line-height: 60px;
  color: #666;;
  height:60px;
  font-weight: 600;
  text-align: center;
}

.terminal:nth-child(3) {
  padding-right: 0
}

.terminal.active {
  color: #000000;
  border-bottom: 4px solid #000000;
  transition: background-color 1s;
  -moz-transition: background-color 1s; /* Firefox 4 */
  -webkit-transition: background-color 1s; /* Safari 和 Chrome */
  -o-transition: background-color 1s; /* Opera */
  transition:all .5s ease;
}

.display_area{
  width: 100%;
  height: 682px;
  padding: 60px 0 100px 0px;
}

.case-panel {
  position: absolute;
  width: 1200px;
  z-index: 1;
  opacity: 0;
  height: auto;
}

.case-panel.active {
  z-index: 100;
  opacity: 1;
  -webkit-transition: all .2s ease-out .1s;
  transition: all .2s ease-out .1s
}

.system_display li{
  width: 285px;
  height: 582px;
}

.system_display li img{
  width: 285px;
  height: auto;
  overflow: hidden;
}

.system_display ul{
  width: 1200px;
  height: auto;
  overflow: hidden;
}

/*-------- mall_display --------*/

.mall_display .tab-1 li:nth-child(1){
  background: url("../static/mall_img_user_display01@2x.png") center no-repeat;
  background-size:281px 582px;
}

.mall_display .tab-1 li:nth-child(2){
  background: url("../static/mall_img_user_display02@2x.png") center no-repeat;
  background-size:281px 582px;
}

.mall_display .tab-1 li:nth-child(3){
  background: url("../static/mall_img_user_display03@2x.png") center no-repeat;
  background-size:281px 582px;
}

.mall_display .tab-1 li:nth-child(4){
  background: url("../static/mall_img_user_display04@2x.png") center no-repeat;
  background-size:281px 582px;
}

.mall_display .tab-2 li:nth-child(1){
  background: url("../static/mall_img_staff_display01@2x.png") center no-repeat;
  background-size:281px 582px;
}

.mall_display .tab-2 li:nth-child(2){
  background: url("../static/mall_img_staff_display02@2x.png") center no-repeat;
  background-size:281px 582px;
}

.mall_display .tab-2 li:nth-child(3){
  background: url("../static/mall_img_staff_display03@2x.png") center no-repeat;
  background-size:281px 582px;
}

.mall_display .tab-2 li:nth-child(4){
  background: url("../static/mall_img_staff_display04@2x.png") center no-repeat;
  background-size:281px 582px;
}

.mall_display .tab-3 li{
  background: url("../static/mall_img_admin_display@2x.png") center no-repeat;
  background-size:1200px 484px;
}

/*-------- maternal_stores_display --------*/

.maternal_stores_display .tab-1 li:nth-child(1){
  background: url("../static/maternal_stores_img_user_display01@2x.png") center no-repeat;
  background-size:281px 582px;
}

.maternal_stores_display .tab-1 li:nth-child(2){
  background: url("../static/maternal_stores_img_user_display02@2x.png") center no-repeat;
  background-size:281px 582px;
}

.maternal_stores_display .tab-1 li:nth-child(3){
  background: url("../static/maternal_stores_img_user_display03@2x.png") center no-repeat;
  background-size:281px 582px;
}

.maternal_stores_display .tab-1 li:nth-child(4){
  background: url("../static/maternal_stores_img_user_display04@2x.png") center no-repeat;
  background-size:281px 582px;
}

.maternal_stores_display .tab-2 li:nth-child(1){
  background: url("../static/maternal_stores_img_staff_display01@2x.png") center no-repeat;
  background-size:281px 582px;
}

.maternal_stores_display .tab-2 li:nth-child(2){
  background: url("../static/maternal_stores_img_staff_display02@2x.png") center no-repeat;
  background-size:281px 582px;
}

.maternal_stores_display .tab-2 li:nth-child(3){
  background: url("../static/maternal_stores_img_staff_display03@2x.png") center no-repeat;
  background-size:281px 582px;
}

.maternal_stores_display .tab-2 li:nth-child(4){
  background: url("../static/maternal_stores_img_staff_display04@2x.png") center no-repeat;
  background-size:281px 582px;
}

.maternal_stores_display .tab-3 li{
  background: url("../static/maternal_stores_img_admin_display@2x.png") center no-repeat;
  background-size:1200px 484px;
}

/*-------- petshop_display --------*/

.petshop_display .tab-1 li:nth-child(1){
  background: url("../static/petshop_img_user_display01@2x.png") center no-repeat;
  background-size:281px 582px;
}

.petshop_display .tab-1 li:nth-child(2){
  background: url("../static/petshop_img_user_display02@2x.png") center no-repeat;
  background-size:281px 582px;
}

.petshop_display .tab-1 li:nth-child(3){
  background: url("../static/petshop_img_user_display03@2x.png") center no-repeat;
  background-size:281px 582px;
}

.petshop_display .tab-1 li:nth-child(4){
  background: url("../static/petshop_img_user_display04@2x.png") center no-repeat;
  background-size:281px 582px;
}

.petshop_display .tab-2 li:nth-child(1){
  background: url("../static/petshop_img_staff_display01@2x.png") center no-repeat;
  background-size:281px 582px;
}

.petshop_display .tab-2 li:nth-child(2){
  background: url("../static/petshop_img_staff_display02@2x.png") center no-repeat;
  background-size:281px 582px;
}

.petshop_display .tab-2 li:nth-child(3){
  background: url("../static/petshop_img_staff_display03@2x.png") center no-repeat;
  background-size:281px 582px;
}

.petshop_display .tab-2 li:nth-child(4){
  background: url("../static/petshop_img_staff_display04@2x.png") center no-repeat;
  background-size:281px 582px;
}

.petshop_display .tab-3 li{
  background: url("../static/petshop_img_admin_display@2x.png") center no-repeat;
  background-size:1200px 484px;
}

/*-------- beauty_display --------*/

.beauty_display .tab-1 li:nth-child(1){
  background: url("../static/beauty_img_user_display01@2x.png") center no-repeat;
  background-size:281px 582px;
}

.beauty_display .tab-1 li:nth-child(2){
  background: url("../static/beauty_img_user_display02@2x.png") center no-repeat;
  background-size:281px 582px;
}

.beauty_display .tab-1 li:nth-child(3){
  background: url("../static/beauty_img_user_display03@2x.png") center no-repeat;
  background-size:281px 582px;
}

.beauty_display .tab-1 li:nth-child(4){
  background: url("../static/beauty_img_user_display04@2x.png") center no-repeat;
  background-size:281px 582px;
}

.beauty_display .tab-2 li:nth-child(1){
  background: url("../static/beauty_img_staff_display01@2x.png") center no-repeat;
  background-size:281px 582px;
}

.beauty_display .tab-2 li:nth-child(2){
  background: url("../static/beauty_img_staff_display02@2x.png") center no-repeat;
  background-size:281px 582px;
}

.beauty_display .tab-2 li:nth-child(3){
  background: url("../static/beauty_img_staff_display03@2x.png") center no-repeat;
  background-size:281px 582px;
}

.beauty_display .tab-2 li:nth-child(4){
  background: url("../static/beauty_img_staff_display04@2x.png") center no-repeat;
  background-size:281px 582px;
}

.beauty_display .tab-3 li{
  background: url("../static/beauty_img_admin_display@2x.png") center no-repeat;
  background-size:1200px 484px;
}

/*-------- petshop_display --------*/

.yoga_fitness_display .tab-1 li:nth-child(1){
  background: url("../static/yoga_fitness_user_display01@2x.png") center no-repeat;
  background-size:281px 582px;
}

.yoga_fitness_display .tab-1 li:nth-child(2){
  background: url("../static/yoga_fitness_user_display02@2x.png") center no-repeat;
  background-size:281px 582px;
}

.yoga_fitness_display .tab-1 li:nth-child(3){
  background: url("../static/yoga_fitness_user_display03@2x.png") center no-repeat;
  background-size:281px 582px;
}

.yoga_fitness_display .tab-1 li:nth-child(4){
  background: url("../static/yoga_fitness_user_display04@2x.png") center no-repeat;
  background-size:281px 582px;
}

.yoga_fitness_display .tab-2 li:nth-child(1){
  background: url("../static/yoga_fitness_img_staff_display01@2x.png") center no-repeat;
  background-size:281px 582px;
}

.yoga_fitness_display .tab-2 li:nth-child(2){
  background: url("../static/yoga_fitness_img_staff_display02@2x.png") center no-repeat;
  background-size:281px 582px;
}

.yoga_fitness_display .tab-2 li:nth-child(3){
  background: url("../static/yoga_fitness_img_staff_display03@2x.png") center no-repeat;
  background-size:281px 582px;
}

.yoga_fitness_display .tab-2 li:nth-child(4){
  background: url("../static/yoga_fitness_img_staff_display04@2x.png") center no-repeat;
  background-size:281px 582px;
}

.yoga_fitness_display .tab-3 li{
  background: url("../static/yoga_fitness_img_admin_display@2x.png") center no-repeat;
  background-size:1200px 484px;
}



/*-------------------------------------------------------------------------------- mall --------------------------------------------------------------------------------*/

.mall_banner{
  background: url(../static/industry_plan01_banner_bg@2x.png) center no-repeat;
  background-size: auto;
  background-size: cover;
}

.mall_banner h1{
  color: #00BA26;
}

.mall_banner h6{
  color: #00BA26;
}

.mall_banner a.experience_demo{
  background: #00BA26;
  box-shadow: 0px 4px 16px -4px rgba(0, 186, 38, 0.3);
}

.mall_banner a.experience_demo:hover{
  transition:all .5s ease;
  -webkit-box-shadow:0px 8px 16px -2px rgba(0, 186, 38, 0.3);
  box-shadow: 0px 8px 16px -2px rgba(0, 186, 38, 0.3);
  -webkit-transform:translateY(-8px);
  transform:translateY(-8px);
}

.mall_banner p.call{
  color: #00BA26;
}


.mall_con li{
  width: 100%;
}

.mall_con li:nth-child(1),
.mall_con li:nth-child(3),
.mall_con li:nth-child(5),
.mall_con li:nth-child(7)
{
  height: 640px;
  background: #FAFFFC;
  position: relative;
}

.mall_con li:nth-child(2),
.mall_con li:nth-child(4),
.mall_con li:nth-child(6)
{
  height: 640px;
  background: #FFFFFF;
  position: relative;
}

.mall_con li:nth-child(8){
  height: 740px;
  background: #FFFFFF;
  position: relative;
  padding-top: 120px;
  z-index: -2;
}

.mall_con li:nth-child(9){
  height: 740px;
  background: #FAFFFC;
  position: relative;
  padding-top: 120px;
}

.mall_con li:nth-child(10)
{
  height: 740px;
  background: #FFFFFF;
  position: relative;
  padding-top: 120px;
}

.mall_con li .inner{
  position: relative;
}

.mall_con li:nth-child(1) img.img_l{
  height: 560px;
  position: absolute;
  left: -24px;
  top: 40px;
}

.mall_con li:nth-child(2) img.img_r{
  height: 640px;
  position: absolute;
  right: -31px;
  top: 0px;
}

.mall_con li:nth-child(3) img.img_l{
  height: 560px;
  position: absolute;
  left: 0px;
  top: 40px;
}

.mall_con li:nth-child(4) img.img_r{
  height: 640px;
  position: absolute;
  right: 0px;
  top: 0px;
}

.mall_con li:nth-child(5) img.img_l{
  height: 560px;
  position: absolute;
  left: 0px;
  top: 40px;
}

.mall_con li:nth-child(6) img.img_r{
  height: 560px;
  position: absolute;
  right: -20px;
  top: 40px;
}

.mall_con li:nth-child(7) img.img_l{
  height: 560px;
  position: absolute;
  left: 0px;
  top: 40px;
}

.mall_con li:nth-child(8) img.img_m,
.mall_con li:nth-child(9) img.img_m,
.mall_con li:nth-child(10) img.img_m
{
  height: 488px;
  display: block;
  margin: 24px auto 0px auto;
  z-index: 1;
}

.mall_con li:nth-child(8) img.img_bg{
  width: 100%;
  position: absolute;
  bottom: 0;
  z-index: -1;
}

.mall_con li:nth-child(1) .font_r,
.mall_con li:nth-child(3) .font_r,
.mall_con li:nth-child(5) .font_r,
.mall_con li:nth-child(7) .font_r
{
  position: absolute;
  top: 160px;
  right: 0px;
}

.mall_con li:nth-child(2) .font_l,
.mall_con li:nth-child(4) .font_l,
.mall_con li:nth-child(6) .font_l
{
  position: absolute;
  top: 160px;
  left: 0px;
}

.mall_con li:nth-child(2) .font_l img{
  width: 454px;
  height: 214px;
  margin-left: -12px;
  margin-top: 48px;
}

.mall_con li:nth-child(3) .font_r img{
  width: 454px;
  height: 214px;
  margin-top: 48px;
}

.mall_con li:nth-child(5) .font_r img,
.mall_con li:nth-child(6) .font_l img,
.mall_con li:nth-child(7) .font_r img
{
  width: 140px;
  height: 140px;
  margin-top: 48px;
  box-shadow: 0px 12px 48px -6px rgba(0, 0, 0, 0.04);
  border-radius: 32px;
}

.mall_con li:nth-child(1) span,
.mall_con li:nth-child(2) span,
.mall_con li:nth-child(3) span,
.mall_con li:nth-child(4) span,
.mall_con li:nth-child(5) span,
.mall_con li:nth-child(6) span,
.mall_con li:nth-child(7) span
{
  width: 8px;
  height: 36px;
  background: #00BA26;
  display: block;
  margin-right: 12px;
  float: left;
}

.mall_con li:nth-child(1) h2,
.mall_con li:nth-child(2) h2,
.mall_con li:nth-child(3) h2,
.mall_con li:nth-child(4) h2,
.mall_con li:nth-child(5) h2,
.mall_con li:nth-child(6) h2,
.mall_con li:nth-child(7) h2{
  font-size: 32px;
  font-weight: 800;
  color: #000000;
  line-height: 36px;
  margin-bottom: 32px;
  text-align: left;
}

.mall_con li .font_m h2{
  font-size: 32px;
  font-weight: 800;
  color: #000000;
  line-height: 36px;
  margin-bottom: 32px;
  text-align: center;
}

.mall_con li:nth-child(1) p,
.mall_con li:nth-child(2) p,
.mall_con li:nth-child(3) p,
.mall_con li:nth-child(4) p,
.mall_con li:nth-child(5) p,
.mall_con li:nth-child(6) p,
.mall_con li:nth-child(7) p
{
  font-size: 18px;
  font-weight: 400;
  color: #656A75;
  line-height: 36px;
}

.mall_con li .font_m p{
  font-size: 18px;
  font-weight: 400;
  color: #656A75;
  line-height: 36px;
  text-align: center;
}





/*-------------------------------------------------------------------------------- maternal_stores --------------------------------------------------------------------------------*/

.maternal_stores_banner{
  background: url(../static/industry_plan02_banner_bg@2x.png) center no-repeat;
  background-size: auto;
  background-size: cover;
}

.maternal_stores_banner h1{
  color: #FF73AE;
}

.maternal_stores_banner h6{
  color: #FF73AE;
}

.maternal_stores_banner a.experience_demo{
  background: #FF73AE;
  box-shadow: 0px 4px 16px -4px rgba(255, 115, 274, 0.3);
}

.maternal_stores_banner a.experience_demo:hover{
  transition:all .5s ease;
  -webkit-box-shadow:0px 8px 16px -2px rgba(255, 115, 274, 0.3);
  box-shadow: 0px 8px 16px -2px rgba(255, 115, 274, 0.3);
  -webkit-transform:translateY(-8px);
  transform:translateY(-8px);
}

.maternal_stores_banner p.call{
  color: #FF73AE;
}

.maternal_stores_con li{
  width: 100%;
}

.maternal_stores_con li:nth-child(1),
.maternal_stores_con li:nth-child(3)
{
  height: 640px;
  background: #FFFFFF;
  position: relative;
}

.maternal_stores_con li:nth-child(2),
.maternal_stores_con li:nth-child(4)
{
  height: 640px;
  background: #FFFAFC;
  position: relative;
}

.maternal_stores_con li .inner{
  position: relative;
}

.maternal_stores_con li:nth-child(1) img.img_l{
  height: 640px;
  position: absolute;
  left: -24px;
  top: 0px;
}

.maternal_stores_con li:nth-child(2) img.img_r{
  height: 640px;
  position: absolute;
  right: -31px;
  top: 0px;
}

.maternal_stores_con li:nth-child(3) img.img_l{
  height: 560px;
  position: absolute;
  left: 0px;
  top: 40px;
}

.maternal_stores_con li:nth-child(4) img.img_r{
  height: 560px;
  position: absolute;
  right: 0px;
  top: 40px;
}

.maternal_stores_con li:nth-child(1) .font_r,
.maternal_stores_con li:nth-child(3) .font_r
{
  position: absolute;
  top: 160px;
  right: 0px;
}

.maternal_stores_con li:nth-child(2) .font_l,
.maternal_stores_con li:nth-child(4) .font_l
{
  position: absolute;
  top: 160px;
  left: 0px;
}

.maternal_stores_con li:nth-child(2) .font_l img{
  width: 454px;
  height: 214px;
  margin-left: -12px;
  margin-top: 48px;
}

.maternal_stores_con li:nth-child(3) .font_r img{
  width: 454px;
  height: 214px;
  margin-top: 48px;
}

.maternal_stores_con li span{
  width: 8px;
  height: 36px;
  background: #FF73AE;
  display: block;
  margin-right: 12px;
  float: left;
}

.maternal_stores_con li:nth-child(1) h2,
.maternal_stores_con li:nth-child(2) h2,
.maternal_stores_con li:nth-child(3) h2,
.maternal_stores_con li:nth-child(4) h2
{
  font-size: 32px;
  font-weight: 800;
  color: #000000;
  line-height: 36px;
  margin-bottom: 32px;
  text-align: left;
}

.maternal_stores_con li:nth-child(5){
  height: 1040px;
  overflow: inherit;
  background: #FFFFFF;
  position: relative;
  padding-top: 120px;
  padding-bottom: 100px;
}

.maternal_stores_con li .font_m h2{
  font-size: 32px;
  font-weight: 800;
  color: #000000;
  line-height: 36px;
  margin-bottom: 32px;
  text-align: center;
}

.maternal_stores_con li:nth-child(1) p,
.maternal_stores_con li:nth-child(2) p,
.maternal_stores_con li:nth-child(3) p,
.maternal_stores_con li:nth-child(4) p
{
  font-size: 18px;
  font-weight: 400;
  color: #656A75;
  line-height: 36px;
}

.maternal_stores_con li .font_m p{
  font-size: 18px;
  font-weight: 400;
  color: #656A75;
  line-height: 36px;
  text-align: center;
}

.function_lists{
  width: 100%;
  height: auto;
  overflow: inherit;
  margin-top: 40px;
}

.function_lists .function_li{
  width: 285px;
  height: 208px;
  float: left;
  margin-top: 20px;
  background: #FFFFFF;
  box-shadow: 0px 12px 48px -6px rgba(0, 0, 0, 0.04);
  border-radius: 8px;
  text-align: center;
  padding: 24px 0px;
}

.function_lists .function_li:hover{
  transition:all .5s ease;
  -webkit-box-shadow:0 30px 36px -12px rgba(12,21,35,0.06);
  box-shadow: 0px 24px 48px 8px rgb(0 0 0 / 6%);
  -webkit-transform:translateY(-8px);
  transform:translateY(-8px);
}

.function_lists .function_li img{
  width: 85px;
  height: 85px;
  display: inline-block;
}

.function_lists .function_li h3{
  font-size: 20px;
  font-weight: 400;
  color: #232529;
  line-height: 24px;
  margin-top: 20px;
}

.function_lists .function_li p{
  font-size: 14px;
  font-weight: 400;
  color: #A6AEC2;
  line-height: 20px;
  margin-top: 12px;
}



/*-------------------------------------------------------------------------------- beauty --------------------------------------------------------------------------------*/

.beauty_banner{
  background: url(../static/industry_plan03_banner_bg@2x.png) center no-repeat;
  background-size: auto;
  background-size: cover;
}

.beauty_banner h1{
  color: #FC5C91;
}

.beauty_banner h6{
  color: #FC5C91;
}

.beauty_banner a.experience_demo{
  background: #FC5C91;
  box-shadow: 0px 4px 16px -4px rgba(252, 92, 145, 0.3);
}

.beauty_banner a.experience_demo:hover{
  transition:all .5s ease;
  -webkit-box-shadow: 0px 8px 16px -2px rgba(252, 92, 145, 0.3);
  box-shadow: 0px 8px 16px -2px rgba(252, 92, 145, 0.3);
  -webkit-transform:translateY(-8px);
  transform:translateY(-8px);
}

.beauty_banner p.call{
  color: #FC5C91;
}

.beauty_characteristics{
  width: 100%;
  height: 392px;
  background: #FFFFFF;
  padding: 80px 0px;
}

.beauty_characteristics li{
  width: 400px;
  text-align: center;
}

.beauty_characteristics li img{
  width: 100px;
  height: 100px;
  display: inline-block;
}

.beauty_characteristics li h5{
  font-size: 24px;
  font-weight: bold;
  color: #000000;
  line-height: 28px;
  margin-top: 24px;
  margin-bottom: 16px;
}

.beauty_characteristics li p{
  font-size: 16px;
  font-weight: 400;
  color: #656A75;
  line-height: 20px;
  margin-bottom: 12px;
}

.beauty_con li{
  width: 100%;
}

.beauty_con li .inner{
  position: relative;
}

.beauty_con li:nth-child(1),
.beauty_con li:nth-child(3),
.beauty_con li:nth-child(5)
{
  height: 640px;
  background: #FFFCFD;
  position: relative;
}

.beauty_con li:nth-child(2),
.beauty_con li:nth-child(4)
{
  height: 640px;
  background: #FFFFFF;
  position: relative;
}

.beauty_con li:nth-child(6){
  height: 846px;
  background: #2D3450;
  position: relative;
  padding-top: 160px;
}

.beauty_con li:nth-child(7){
  height: 1040px;
  background: #FFFCFD;
  position: relative;
  padding-top: 160px;
}


.beauty_con li:nth-child(1) img.img_r{
  height: 560px;
  position: absolute;
  right: -24px;
  top: 60px;
}

.beauty_con li:nth-child(2) img.img_l{
  height: 640px;
  position: absolute;
  left: -31px;
  top: 0px;
}

.beauty_con li:nth-child(3) img.img_r{
  height: 640px;
  position: absolute;
  right: 0px;
  top: 0px;
}

.beauty_con li:nth-child(4) img.img_l{
  height: 560px;
  position: absolute;
  left: 0px;
  top: 40px;
}

.beauty_con li:nth-child(5) img.img_r{
  height: 560px;
  position: absolute;
  right: 0px;
  top: 40px;
}

.beauty_con li:nth-child(1) .font_l,
.beauty_con li:nth-child(3) .font_l,
.beauty_con li:nth-child(5) .font_l
{
  position: absolute;
  top: 160px;
  left: 0px;
}

.beauty_con li:nth-child(2) .font_r,
.beauty_con li:nth-child(4) .font_r
{
  position: absolute;
  top: 160px;
  right: 0px;
}

.beauty_con li span{
  width: 8px;
  height: 36px;
  background: #FC5C91;
  display: block;
  margin-right: 12px;
  float: left;
}

.beauty_con li:nth-child(1) h2,
.beauty_con li:nth-child(2) h2,
.beauty_con li:nth-child(3) h2,
.beauty_con li:nth-child(4) h2,
.beauty_con li:nth-child(5) h2
{
  font-size: 32px;
  font-weight: 800;
  color: #000000;
  line-height: 36px;
  margin-bottom: 32px;
  text-align: left;
}

.beauty_con li .font_m h2{
  font-size: 32px;
  font-weight: 800;
  color: #000000;
  line-height: 36px;
  margin-bottom: 32px;
  text-align: center;
}

.beauty_con li:nth-child(1) p,
.beauty_con li:nth-child(2) p,
.beauty_con li:nth-child(3) p,
.beauty_con li:nth-child(4) p,
.beauty_con li:nth-child(5) p
{
  font-size: 18px;
  font-weight: 400;
  color: #656A75;
  line-height: 36px;
}

.beauty_con li .font_m p{
  font-size: 18px;
  font-weight: 400;
  color: #656A75;
  line-height: 36px;
  text-align: center;
}

.beauty_con .applicable_scenario_lists{
  margin-top: 48px;
}

.applicable_scenario_li{
  margin-bottom: 30px;
  width: 380px;
  height: 200px;
  text-align: center;
  border-radius: 12px;
}

.applicable_scenario_li:hover{
  transition:all .5s ease;
  -webkit-transform:translateY(-8px);
  transform:translateY(-8px);
}

.applicable_scenario_li:hover .mask{
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.2);
  border-radius: 12px;
  transition: all .3s;
}

.applicable_scenario_li .mask{
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.5);
  border-radius: 12px;
  transition: all .3s;
}

.applicable_scenario_li:nth-child(1){
  background: url(../static/beauty_img_cate01@2x.png) center no-repeat;
  background-size: auto;
  background-size: cover;
}

.applicable_scenario_li:nth-child(2){
  background: url(../static/beauty_img_cate02@2x.png) center no-repeat;
  background-size: auto;
  background-size: cover;
}

.applicable_scenario_li:nth-child(3){
  background: url(../static/beauty_img_cate03@2x.png) center no-repeat;
  background-size: auto;
  background-size: cover;
}

.applicable_scenario_li:nth-child(4){
  background: url(../static/beauty_img_cate04@2x.png) center no-repeat;
  background-size: auto;
  background-size: cover;
}

.applicable_scenario_li:nth-child(5){
  background: url(../static/beauty_img_cate05@2x.png) center no-repeat;
  background-size: auto;
  background-size: cover;
}

.applicable_scenario_li:nth-child(6){
  background: url(../static/beauty_img_cate06@2x.png) center no-repeat;
  background-size: auto;
  background-size: cover;
}

.applicable_scenario_li img{
  width: 60px;
  height: 60px;
  display: inline-block;
  margin-bottom: 24px;
  margin-top: 36px;
}

.applicable_scenario_li h3{
  font-size: 20px;
  font-weight: 400;
  color: #FFFFFF;
  line-height: 24px;
  margin-bottom: 18px;
}

.applicable_scenario_li .line_bottom{
  width: 60px;
  height: 2px;
  background: #FFFFFF;
  margin: 0 auto;
}

/*-------------------------------------------------------------------------------- yoga_fitness --------------------------------------------------------------------------------*/

.yoga_fitness_banner{
  background: url(../static/industry_plan04_banner_bg@2x.png) center no-repeat;
  background-size: auto;
  background-size: cover;
}

.yoga_fitness_banner h1{
  color: #7593FF;
}

.yoga_fitness_banner h6{
  color: #7593FF;
}

.yoga_fitness_banner a.experience_demo{
  background: #7593FF;
  box-shadow: 0px 4px 16px -4px rgba(117, 147, 255, 0.3);
}

.yoga_fitness_banner a.experience_demo:hover{
  transition:all .5s ease;
  -webkit-box-shadow: 0px 8px 16px -2px rgba(117, 147, 255, 0.3);
  box-shadow: 0px 8px 16px -2px rgba(117, 147, 255, 0.3);
  -webkit-transform:translateY(-8px);
  transform:translateY(-8px);
}

.yoga_fitness_banner p.call{
  color: #7593FF;
}

.yoga_fitness_con li{
  width: 100%;
  height: auto;
  padding-top: 100px;
}


.yoga_fitness_con li:nth-child(2){
  background: #FAFBFF;
  height: 808px;
}

.yoga_fitness_con li:nth-child(3){
  background: #EAEFF3;
}

.yoga_fitness_con li .font_m h2{
  font-size: 36px;
  font-weight: 800;
  color: #000000;
  line-height: 40px;
  text-align: center;
  margin-bottom: 32px;
}

.yoga_fitness_con li .font_m p{
  font-size: 18px;
  font-weight: 400;
  color: #656A75;
  line-height: 36px;
  text-align: center;
}

.yoga_fitness_con li:nth-child(1) .inner img.img_m{
  height: 518px;
  margin: 48px auto 0 auto;
  display: block;
}

.yoga_fitness_con li:nth-child(2) .function_li{
  width: 200px;
  text-align: center;
  margin-bottom: 40px;
}

.yoga_fitness_con li:nth-child(2) .function_li img{
  width: 80px;
  height: 80px;
  display: inline-block;
}
.yoga_fitness_con li:nth-child(2) .function_li h3{
  font-size: 20px;
  font-weight: 400;
  color: #232529;
  line-height: 24px;
  margin-top: 16px;
  text-align: center;
}

.yoga_fitness_con li:nth-child(3) .inner img.img_m{
  height: 643px;
  margin: 48px auto 0 auto;
  display: block;
}

.yoga_fitness_con li:nth-child(4) .inner img.img_m{
  height: 532px;
  margin: 48px auto 0 auto;
  display: block;
}

.yoga_fitness_con li:nth-child(1) img.img_bg{
  width: 100%;
  position: absolute;
  bottom: 0;
  z-index: -1;
}




/*-------------------------------------------------------------------------------- petshop --------------------------------------------------------------------------------*/

.petshop_banner{
  background: url(../static/industry_plan05_banner_bg@2x.png) center no-repeat;
  background-size: auto;
  background-size: cover;
}

.petshop_banner h1{
  color: #FEB820;
}

.petshop_banner h6{
  color: #FEB820;
}

.petshop_banner a.experience_demo{
  background: #FEB820;
  box-shadow: 0px 4px 16px -4px rgba(254, 184, 32, 0.3);
}

.petshop_banner a.experience_demo:hover{
  transition:all .5s ease;
  -webkit-box-shadow:0px 8px 16px -2px rgba(254, 184, 32, 0.3);
  box-shadow: 0px 8px 16px -2px rgba(254, 184, 32, 0.3);
  -webkit-transform:translateY(-8px);
  transform:translateY(-8px);
}

.petshop_banner p.call{
  color: #FEB820;
}

.petshop_con li{
  width: 100%;
}

.petshop_con li:nth-child(1){
  height: 660px;
  background: #FFFFFF;
  position: relative;
}

.petshop_con li:nth-child(2){
  height: 667px;
  background: #FFFFFF;
  position: relative;
}

.petshop_con li:nth-child(3){
  height: 684px;
  background: #FFFFFF;
  position: relative;
}

.petshop_con li:nth-child(4){
  height: 636px;
  background: #F7F8FA;
  position: relative;
  padding-top: 100px;
}

.petshop_con li .inner{
  position: relative;
}

.petshop_con li:nth-child(1) img.img_l{
  height: 660px;
  position: absolute;
  left: -26px;
}

.petshop_con li:nth-child(1) img.img_l{
  height: 660px;
  position: absolute;
  left: -26px;
}


.petshop_con li:nth-child(2) img.img_r{
  height: 587px;
  position: absolute;
  right: -26px;
  top: 80px;
}

.petshop_con li:nth-child(3) img.img_l{
  height: 544px;
  position: absolute;
  left: 0px;
  top: 40px;
}

.petshop_con li:nth-child(1) .font_r,
.petshop_con li:nth-child(3) .font_r
{
  position: absolute;
  top: 160px;
  right: 0px;
}

.petshop_con li:nth-child(2) .font_l{
  position: absolute;
  top: 160px;
  left: 0px;
}

.petshop_con li:nth-child(1) .font_r img{
  width: 80px;
}

.petshop_con li:nth-child(1) .font_r h4{
  font-size: 24px;
  font-weight: 600;
  color: #232529;
  line-height: 28px;
  margin-bottom: 8px;
}

.petshop_con li span{
  width: 8px;
  height: 36px;
  background: #FEB820;
  display: block;
  margin-right: 12px;
  float: left;
}

.petshop_con li:nth-child(1) h2,
.petshop_con li:nth-child(2) h2,
.petshop_con li:nth-child(3) h2
{
  font-size: 32px;
  font-weight: 800;
  color: #000000;
  line-height: 36px;
  margin-bottom: 32px;
  text-align: left;
}

.petshop_con li .font_m h2{
  font-size: 32px;
  font-weight: 800;
  color: #000000;
  line-height: 36px;
  margin-bottom: 32px;
  text-align: center;
}

.petshop_con li:nth-child(1) p,
.petshop_con li:nth-child(2) p,
.petshop_con li:nth-child(3) p
{
  font-size: 18px;
  font-weight: 400;
  color: #656A75;
  line-height: 36px;
}

.petshop_con li .font_m p{
  font-size: 18px;
  font-weight: 400;
  color: #656A75;
  line-height: 36px;
  text-align: center;
}

.petshop_con li:nth-child(4) .function_li{
  width: 200px;
  text-align: center;
  margin-bottom: 40px;
}

.petshop_con li:nth-child(4) .function_li img{
  width: 80px;
  height: 80px;
  display: inline-block;
}
.petshop_con li:nth-child(4) .function_li h3{
  font-size: 20px;
  font-weight: 400;
  color: #232529;
  line-height: 24px;
  margin-top: 16px;
  text-align: center;
}




/*-------------------------------------------------------------------------------- experince --------------------------------------------------------------------------------*/

.experience{
  width: 100%;
  height: auto;
  overflow: hidden;
  background: #2D3450;
  padding-top: 124px;
  padding-bottom: 60px;
  position: relative;
}

.experience_left, .experience_right{
  width: 580px;
  height: 540px;
  position: relative;
  background: #FFFFFF;
  box-shadow: 0px 12px 48px -6px rgba(0, 0, 0, 0.04);
  border-radius: 16px;
  padding: 60px 40px;
  z-index: 1;
}

.experience_left h1, .experience_right h1{
  font-size: 32px;
  font-weight: 600;
  color: #323C55;
  line-height: 36px;
  margin-top: 20px;
  margin-bottom: 40px;
  text-align: left;
}

.experience_left li, .experience_right li{
  margin-bottom: 24px;
}

.experience_left li img, .experience_right li img{
  width: 16px;
  height: 16px;
  margin-right: 10px;
}

.experience_left li span, .experience_right li span{
  font-size: 18px;
  font-weight: 400;
  color: #656A75;
  line-height: 22px;
}

.experience_left a.see_demo, .experience_right a.see_demo{
  width: 160px;
  height: 48px;
  background: #4772FF;
  border-radius: 24px;
  display: block;
  padding: 14px 32px;
  margin-top: 56px;
}

.experience_left a.see_demo:hover, .experience_right a.see_demo:hover{
  transition:all .5s ease;
  -webkit-box-shadow:0px 8px 16px -2px rgba(71, 114, 255, 0.3);
  box-shadow: 0px 8px 16px -2px rgba(71, 114, 255, 0.3);
  -webkit-transform:translateY(-8px);
  transform:translateY(-8px);
}

.experience_left a.see_demo img, .experience_right a.see_demo img, .experience_left a.installation img, .experience_right a.installation img{
  width: 20px;
  height: 20px;
  margin-right: 10px;
  display: inline-block;
}

.experience_left a.see_demo span, .experience_right a.see_demo span{
  font-size: 16px;
  color: #FFFFFF;
}

.experience_left a.installation, .experience_right a.installation{
  width: 160px;
  height: 48px;
  background: #FFFFFF;
  border-radius: 24px;
  border: 1px solid #4772FF;
  display: block;
  padding: 14px 32px;
  margin-top: 24px;
  cursor: pointer;
}

.experience_left a.installation:hover, .experience_right a.installation:hover{
  transition:all .5s ease;
  -webkit-box-shadow:0px 8px 16px -2px rgba(71, 114, 255, 0.3);
  box-shadow: 0px 8px 16px -2px rgba(71, 114, 255, 0.3);
  -webkit-transform:translateY(-8px);
  transform:translateY(-8px);
}

.experience_left a.installation span, .experience_right a.installation span{
  font-size: 16px;
  color: #4772FF;
}

.experience_left img.top_right{
  width: 66px;
  height: 95px;
  position: absolute;
  right: 0px;
  top: 24px;
}

.experience_left img.bottom_right{
  width: 359px;
  height: 304px;
  position: absolute;
  right: 0px;
  bottom: 0px;
}

.experience_right img.top_left{
  width: 80px;
  height: 80px;
  position: absolute;
  left: 0px;
  top: 0px;
}

.experience_right img.top_right{
  width: 81px;
  height: 78px;
  position: absolute;
  right: 0px;
  top: 12px;
}

.experience_right img.bottom_right{
  width: 343px;
  height: 296px;
  position: absolute;
  right: 0px;
  bottom: 0px;
}

.product_experience_img_l{
  width: 282px;
  height: 244px;
  position: absolute;
  left: 1%;
  bottom: 10px;
  z-index: -1;
}

.product_experience_img_r{
  width: 200px;
  height: 200px;
  position: absolute;
  right: 2%;
  top: 0px;
  z-index: -1;
}
.saoma_experience{
  width: 140px;
  height: auto;
  background: #FFFFFF;
  padding: 10px;
  box-shadow: 0px 8px 32px 0px rgba(47, 56, 111, 0.08);
  border-radius: 0px 0px 8px 8px;
  text-align: center;
}

.saoma_experience img{
  width: 100px;
  height: 100px;
  display: inline-block;
}

.saoma_experience p{
  font-size: 14px;
  font-weight: 400;
  color: #565A66;
  line-height: 18px;
}

.navbar{position:relative;}
.news-widnows{position: absolute;top:50px;right:-455px;width: 300px;z-index:999;text-align:center;}
.news-widnows img{margin:0 auto;}
.news-widnows-list{width:100%;background:#fff;padding:5px 15px;box-shadow:1px 0px 15px rgba(0, 0, 0, .15);border-radius:10px;}
.news-widnows-list a{padding:3% 0;text-align:left;display:block;font-size:14px;}
.news-widnows-list label{font-size:16px;}
.news-widnows-title{text-align:center;padding:5px;font-size:16px;font-weight:bold;}
