.swiper-slide img{width:100%;}
.swiper-container{width:100%;height:100%;}
.swiper-slide{text-align:center;font-size:18px;background:#fff;/* Center slide text vertically */
 display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;}
.header {max-width: 768px;width: 100%;text-align: center;background-image: url('../bg_pic.png');background-color: #3285ff;background-size: auto;border-top: none;color: #fff;position: relative;}
.company_logo{margin:0.12rem 0.2rem;max-height: 45px;display: inline-block;vertical-align: middle;}
.company_name{display: inline-block;vertical-align: middle; overflow: hidden;text-overflow: ellipsis;color: #fff;font-size: 0.35rem;}
.nav_button {position: fixed;text-decoration: none;bottom: 1.5rem;border-radius: 1rem;height: 1rem;width: 1rem;background: 0 0;padding: 0;line-height: 1.4rem;text-align: center;z-index: 99;margin-left:0.4rem;background: #3285ff url('../icon_menu.png') no-repeat center center;border: 2px solid #fff;-webkit-box-shadow: 0 0 2px rgba(0,0,0,.3);-ms-box-shadow: 0 0 2px rgba(0,0,0,.3);-o-box-shadow: 0 0 2px rgba(0,0,0,.3);box-shadow: 0 0 2px rgba(0,0,0,.3);}
.mark{ width: 100%;height: 100%;position: fixed;left:0;top:0;background: rgba(0,0,0,.4);}
.nav_page{display: none;width: 100%; height: 100%;position: fixed;left:0%;top:0;background: rgba(0,0,0,.7);z-index: 80;-width: 7.5rem;}
.nav_list{width: 7.5rem; position:fixed;left:50%;top: 50%;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);}
.nav_list li{width: 31.33%;margin: 1%; float: left;}
.nav_list li a{display: block;}
.nav_list li a .icon_nav{width: 1.3rem;height: 1.3rem;margin: 0 auto; border-radius: 50%;background-color:#3285ff ;border: 2px solid #ffffff;background-size: 0.6rem; background-repeat: no-repeat;background-position: center center;}
.icon_index{background-image:url('../icon_i.png');}
.icon_js{background-image:url('../icon_js.png');}
.icon_wx{background-image:url('../icon_wx.png');}
.icon_px{background-image:url('../icon_px.png');}
.icon_zl{background-image:url('../icon_zl.png');}
.nav_list li.active .icon_nav{background-color: #ffffff;border: 2px solid #3285ff;}
.nav_list li.active .icon_index{background-image:url('../icon_ia.png');}
.nav_list li.active .icon_js{background-image:url('../icon_jsa.png');}
.nav_list li.active .icon_wx{background-image:url('../icon_wxa.png');}
.nav_list li.active .icon_px{background-image:url('../icon_pxa.png');}
.nav_list li.active .icon_zl{background-image:url('../icon_zla.png');}

.nav_name{font-size: 0.32rem;color: #ffffff;text-align: center;margin-top: 10px; margin-bottom: 10px;}


.banner{width: 100%;}
.banner_swiper .swiper-slide,.banner_swiper .swiper-slide img{width: 100%; width: 7.5rem;}
.index_block{padding:0.4rem 0 0.2rem 0;}
.index_block_title{width: 100%; padding-bottom: 0.15rem;border-bottom: 2px solid #3285ff;padding-left:0.2rem;}
.index_block_title a{color: #3285ff;font-size: 0.32rem;}
.index_block_title a.more{color: #666;font-size: 0.28rem;float: right;padding-top: 0.03rem; display: inline-block;vertical-align: middle;}
.index_block_con{padding:0.2rem 0;}
.index_block_con .block_img{width: 50%;float: right;padding-left: 2%;}
.index_block_con .block_img img{width: 100%;}
.index_block_con .block_txt{color:#666666;font-size: 0.28rem;line-height: 1.5;}
.case_list{width: 100%;font-size: 0;text-align: left;}
.case_item{width: 48%;margin:1%;display: inline-block;vertical-align: top;}
.case_item img{width: 100%;}
.case_item .case_name {display: block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-size: 0.28rem;color: #666666;padding-top: 0.02rem;text-align: left;}
.course_swiper .swiper-slide{border:1px solid #cccccc;}
.course_item{font-size: 0.24rem;color: #666666;  padding: 0.15rem 0.1rem 0.15rem;background-color: #ffffff;text-align: center;}
.article_item{width: 100%;padding: 0.12rem 0.6rem 0.12rem 0.1rem; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;border-bottom: 1px solid #cccccc; background:url('../icon_right.png') no-repeat right center;background-size: 0.4rem;}
.tips{color:#b30e0e;font-size: 0.24rem;margin-right: 0.05rem}

/* 底部 */
.footer{padding-bottom:1.5rem;}
.totop{cursor: pointer; height: 0.8rem;line-height: 0.8rem;text-align: right;color: #ffffff;font-size: 0.35rem;padding-right: 0.7rem;background:#3285ff url('../icon_totop.png') no-repeat 98% center;background-size: 0.4rem;}
.copyright{text-align: center;color: #666666;font-size: 0.28rem;padding-top: 0.5rem;}
.fixed_bottom{z-index: 98; position: fixed;bottom: 0;left:50%;width: 7.5rem;margin-left: -3.75rem;   display:-webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex width: 100%;background: #3285ff; padding:0.16rem 0;text-align: center;}
.fixed_bottom a{color: #ffffff;display: block;width: 100%; font-size: 0.3rem;height: 0.8rem;line-height:0.8rem;}
.ftab_item{box-flex:1;-webkit-box-flex:1;-moz-box-flex:1;flex:1;-webkit-flex:1; height: 0.8rem;line-height:0.8rem;border-right: 1px solid #ffffff;box-sizing: border-box;}
.ftab_item:last-of-type{border-right: 0;}
.item_message{background-position: 0 0;}
.item_tel{background-position: 0 -35px;}
.item_index{background-position: 0 -35px;}
.icon_fb{display: inline-block;height: 0.4rem; margin-right: 0.2rem;vertical-align: middle;}

/* 分页 */
.page{width: 74%;padding:0.2rem 0;margin:0 auto; text-align: center;}
.page a{display: inline-block;padding:0.05rem 0.25rem;border:1px solid #3285ff;color: #3285ff;}
.page a:hover{color: #ffffff;background:#3285ff;}

.onepage{min-height: 10rem;background: #f0f0f0;padding-top:0.2rem;padding-bottom: 0.2rem;}
.onepage_con{background:#ffffff;padding-bottom:0.4rem;padding-top:0.4rem;}
.onepage_con img{display: block;width: 100%;}
.onepage_txt{padding:0.1rem;}
.section_block{margin-bottom: 0.2rem;background:#ffffff;padding-top: 0.2rem;}
.section_con{padding:0.1rem;}
#lightgallery{font-size: 0;}
#lightgallery a{display: inline-block;width: 48%;margin:1%;vertical-align: top;}
#lightgallery a img{width: 100%;}

.product_list{width: 100%;}
.product_item{width: 100%;padding:0.2rem 0;border-bottom: 1px solid #cccccc;}
.product_item a{display: block;width: 100%;}
.product_item .pro_img{width: 30%;float: left;}
.product_item .pro_img img{display: block; width: 100%;}
.product_item .pro_txt{width: 68%;margin-left: 2%;float: left;}
.product_item .pro_title{color: #333333;font-size: 0.3rem;margin-bottom: 0.1rem; display: block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.product_item .pro_ps{color: #666666;font-size: 0.28rem;display: block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.product_detail_Img{width: 100%;position:relative;}
.addBgcolor{background: rgba(255, 255, 255, 0.137);}

.backto_history,.news_share{width: 0.6rem;height: 0.6rem;border-radius: 50%;}
.backto_history{background:rgba(255,255,255,.7) url('../icon_back.png') no-repeat center center;background-size: 0.4rem;}
.news_share{background:rgba(255,255,255,.7) url('../icon_share.png') no-repeat center center;background-size: 0.3rem; }
.product_detail_page{width: 7.5rem;margin:0 auto;}
.pro_swiper{width: 100%;}
.pro_swiper .swiper-slide,.pro_swiper .swiper-slide img{width: 100%;}
.product_detail_head{position: fixed;top:0;left: 50%;-webkit-transform: translateX(-50%);transform: translateX(-50%); width: 100%;padding:0.2rem;z-index: 22;max-width:7.5rem;margin:0 auto;}
.product_detail_main .pro_name{padding:0.3rem 0.2rem;font-size: 0.34rem;}

.product_detail_select{width: 100%;}
.product_detail_select .select_tab{margin-bottom: 20px;}
.product_detail_select .select_tab_item{position: relative; width:50%;float: left;padding-bottom: 0.2rem;border-bottom: 1px solid #cccc;color: #666666;font-size: 0.34rem;text-align: center;}
.product_detail_select .select_tab_item.active:before{content: '';width: 100%;height: 3px;position: absolute;bottom:-2px;left: 0;background: #3285ff;}
.product_detail_select .select_tab_item.active{color: #3285ff;}

.select_content{display: none;min-height:6rem;}

.produce_pro{margin:0.4rem 0;border-top:1px solid #cccccc;}
.produce_pro_title{padding:0.2rem 0;color: #333333;font-size: 0.3rem;}
.produce_pro .swiper-slide{position:relative;}
.produce_proname{padding:0.04rem 0.1rem;width: 100%; font-size: 0.24rem; background: rgba(0,0,0,0.4);color: #ffffff;position:absolute;left: 0;bottom: 0;display: block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}


/* 留言板 */
.form_box{padding:0.25rem;}
.form_group{width: 100%;}
.form_group input[type="text"],.form_group textarea{width: 100%;padding: 0.25rem 0.4rem 0.25rem 0.7rem;border: 0; border-bottom: 1px solid #e3e3e3;font-size: 0.24rem;}
.form_group textarea{resize: none; outline: 0;}
.icon_user{background:url('../icon_user.png') no-repeat 0.1rem 0.25rem;}
.icon_yx{background:url('../icon_yx.png') no-repeat 0.1rem 0.25rem;}
.icon_dh{background:url('../icon_dh.png') no-repeat 0.1rem 0.25rem;}
.icon_xx{background:url('../icon_xx.png') no-repeat 0.1rem 0.25rem;}
.icon_form{background-size: 0.38rem}
.btn_submit{margin: 0.4rem 0;border: 0; width: 100%;text-align: center;height: 0.8rem;line-height: 0.8rem;background-color: #3285ff;border-radius:2px;color: #ffffff;font-size: 0.35rem;}


@-webkit-keyframes bounceInUp {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
            transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
            transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
            transform: translate3d(0, -5px, 0);
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInUp {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
            transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
            transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
            transform: translate3d(0, -5px, 0);
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
          animation-name: bounceInUp;
}
.animated {
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}
