@charset "UTF-8";
/* CSS Document */
body{ font:12px/24px "Hiragino Sans GB","MicroSoft YaHei",Arial,sans-serif; overflow-x: hidden; color: #333;}
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, select, textarea, th, td{ margin: 0; padding: 0; }
img{ border:none; max-width:100%;}
a{ color:#333; text-decoration:none;}
a:hover{color: #97ddff;text-decoration:none;}
a,area{ blur:expression(this.onFocus=this.blur()) }
ul, li{ list-style:none;}
table{ border-collapse:collapse;border-spacing:0; max-width:100%;}
input{ outline:0;}
input[type="button"], input[type="submit"], input[type="reset"] {-webkit-appearance: none;}
:focus{ outline: none;}
.mr0{ margin-right:0;}
.fl{float:left;}
.fr{float:right;}
.clearfix:after{ display:block;content: ''; clear: both;}
.clearfix{ zoom: 1;}
.clear{ height:0; width:100%; font-size:1px; line-height:0; visibility:hidden; overflow:hidden;}
.Width{ width:1200px; margin:0 auto;}
.hide{ display:none;}
.onlymob{ display:none;}
.pointer{ cursor:pointer;}
.por{ position: relative;}
.poa{ position: absolute;}


.table1{border-collapse:collapse; color:#666;text-align:center; background:#138d8c;;line-height:36px; width:960px; margin:0 auto;}
.table1 th{background:#fff;font:bold 16px/30px "微软雅黑";color:#000;  border:1px solid #333;}
.table1 td{border:1px solid #fff; color:#fff;  font-size:14px; line-height:20px;    }

.table2{border-collapse:collapse; color:#666;text-align:center; background:#fff;line-height:36px; width:850px; margin:0 auto;}
.table2 th{background:#305496;font:bold 16px/30px "微软雅黑";color:#fff; padding:4px 10px; border:1px solid #000;}
.table2 td{border:1px solid #000;  color:#000; font-size:14px; line-height:20px;}

.table3{border-collapse:collapse; color:#666;text-align:center; background:#fff;line-height:36px; width:850px; margin:0 auto;}
.table3 th{background:#19b955;font:bold 16px/30px "微软雅黑";color:#fff; padding:4px 10px; border:1px solid #000;}
.table3 td{border:1px solid #000; color:#000; font-size:14px; line-height:20px;}

.table4{border-collapse:collapse; color:#666;text-align:center; background:#fff;line-height:36px; width:850px; margin:0 auto;}
.table4 th{background:#ffcf09;font:bold 16px/30px "微软雅黑";color:#fff; padding:4px 10px; border:1px solid #000;}
.table4 td{border:1px solid #000; color:#000; font-size:14px; line-height:20px;}

.table5{border-collapse:collapse; color:#666;text-align:center; background:#fff;line-height:36px; width:850px; margin:0 auto;}
.table5 th{background:#0294fa;font:bold 16px/30px "微软雅黑";color:#fff; padding:4px 10px; border:1px solid #000;}
.table5 td{border:1px solid #000;  color:#000; font-size:14px; line-height:20px;}

.table6{border-collapse:collapse; color:#666;text-align:center; background:#fff;line-height:36px; width:850px; margin:0 auto;}
.table6 th{background:#269400;font:bold 16px/30px "微软雅黑";color:#fff; padding:4px 10px; border:1px solid #000;}
.table6 td{border:1px solid #000; color:#000; font-size:14px; line-height:20px;}


/* ������ʽ */
.banner{ width: 100%; height: 656px; background: url(../images/banner_bg.png) no-repeat; background-position: center center; background-size: auto 100%;}
.banner_txt img{ top:140px; left: 10px;}
.banner_txt p{ top:400px; left: 10px; font-size: 20px; line-height: 34px; color: #888; width: 580px;     animation-delay: 1s; -webkit-animation-delay: 1s;}

.bt{ font-family: "MicroSoft YaHei",Arial,sans-serif; font-size: 50px; line-height: 70px; font-weight: bold; text-align: center; width: 1200px; height: 88px; background:url(../images/bt_bg.png) no-repeat; margin: 60px 0 0px 0;}
h2{ width: 900px; margin: 0 auto; font-size: 20px; line-height: 30px; text-align: center; color: #666; font-weight: normal;}
.main01 .pone{ display: none;}

.m02_box{ width: 1200px; height: 840px; margin: 0 auto; background:url(../images/main_boxbg.jpg) no-repeat; overflow: hidden;}
.m02_box_t{ width: 460px; height: 200px; margin: 200px 60px 0 76px; float: left;}
.m02_box_t h3{ font-size: 30px; line-height: 50px;}
.m02_box_t p{ font-size: 20px; line-height: 30px; color: #888;}
.zixun{ font-size: 30px; line-height: 35px; text-align: center;}
.zixun a{ width: 230px; height: 88px; background:url(../images/con_button.png) no-repeat; font-size: 28px; line-height: 88px; font-weight: bold; color: #fff; display: block; margin: 10px auto 0; transition: transform .5s ease-out;}
.zixun a:hover{ color: #faff75; background:url(../images/cons_button_hover.png) no-repeat; transform: translateY(-5px);}

.main03{ width: 100%; background: #e4f3ff; margin-top: 60px; padding-bottom: 50px; overflow: hidden;}
.main03 ul{ margin-top: 25px;}
.main03 ul li{ float: left; margin: 0 4px 0 26px;}
.main03 li.m3_L{ width: 330px; height: 210px; padding: 50px 0 0 230px; background:url(../images/main3_l_box.png) no-repeat;}
.main03 li.m3_R{ width: 330px; height: 210px; padding: 50px 0 0 230px; background:url(../images/main3_r_box.png) no-repeat;}
.main03 ul li h4{ font-size: 30px; line-height: 34px;}
.main03 ul li p{ font-size: 20px; line-height: 30px; margin-top: 10px; width: 284px;}

.main04 .lb_pone{ display: none;}
.main04 .lb_pc{ margin:20px auto 0; display: block;}
.main04 .h_pc{ display: block;}
.main04 .h_pone{ display: none;}
.m4_buy{ margin-top: 10px;}
.m4_buy a{ width: 230px; height: 88px; margin: 0 auto; color: #fff; font-size: 28px; line-height: 88px; text-align: center; font-weight: bold; background:url(../images/buy_button.png) no-repeat; display:block; transition: transform .5s ease-out;}
.m4_buy a:hover{ color: #faff75; background:url(../images/buy_button_hover.png) no-repeat; transform: translateY(-5px);}

.main05{width: 100%; background: #e4f3ff; padding-bottom: 50px; overflow: hidden;}
.main05 .mmc_pone{ display: none;}
.main05 .mmc_pc{ margin:20px auto 0; display: block;}

.box{ height: 470px; overflow: hidden; width: 1200px; position: relative;}
#roll{ width: 200%;}
#roll dd{ width: 330px; height: 470px; float: left; margin: 0 32px 0 36px;}
.box span{position: absolute; bottom: 35%; display: inline-block;width: 34px; height:150px; text-align: center;cursor: pointer; z-index: 90; color: #fff;}
.box .next{right: 0;}
#roll dd.ke1{ width: 330px; height: 470px; background:url(../images/main6_boxbg1.png) no-repeat;}
#roll dd.ke2{ width: 330px; height: 470px; background:url(../images/main6_boxbg2.png) no-repeat;}
#roll dd.ke3{ width: 330px; height: 470px; background:url(../images/main6_boxbg3.png) no-repeat;}
#roll dd div.ban{ width: 300px; height: 140px; margin: 40px auto 0; font-size: 36px; line-height: 46px; color: #fff; text-align: center;}
#roll dd div.ban h5{ font-weight: bold; color: #fff; text-align: center;}
#roll dd div.b_con{ font-size: 24px; line-height: 44px; text-align: center;}
#roll dd div.b_con p{ width: 250px; height: 60px; margin: 5px auto 0; font-size: 16px; line-height: 30px; text-align: left;}
#roll dd a{ font-size: 20px; line-height: 54px; text-align: center; color: #fff; font-weight: bold; width: 170px; height: 54px; background:url(../images/main6_box_button.jpg) no-repeat; margin: 15px auto 0; display: block; transition: transform .5s ease-out;}
#roll dd a:hover{ color: #faff75; background:url(../images/main6_box_button_hover.jpg) no-repeat; transform: translateY(-5px);}
.xgke a{ font-size: 28px; line-height: 58px; color: #fff; text-align: center; width: 250px; height: 58px; margin: 30px auto 0; background: #c8c8c8; display: block; border-radius:58px; transition: transform .5s ease-out;}
.xgke a:hover{ background: #555; transform: translateY(-5px);}

.main07{width: 100%; background: #e4f3ff; margin-top: 60px; padding-bottom: 50px; overflow: hidden;}
.main07 .mmc_pone{ display: none;}
.main07 .mmc_pc{ margin:20px auto 0; display: block;}

.main08 .lb_pone{ display: none;}
.main08 .lb_pc{ margin:20px auto 0; display: block;}
.main08 .ggt_pone{ display: none;}
.main03 .ggt_pone {
    display: none;
}
.main08 .ggt_pc{ margin:40px auto 0; display: block;}

.fh_db  a,.foot li a{ color: #fff;  transition:transform .5s ease-out;}
.foot li,.foot div{ display: inline-block; color: #fff;}
.foot{ width: 100%; height: 88px; background: #252525; padding: 34px 0 0 0; font-size: 14px; line-height: 28px; text-align: center;}
.foot li a:hover{ color: #888; transform: translateY(-5px);}
.foot_ble{ display: none;}
.xfk{position: fixed; top: 80px; right:10px; width: 120px; height: 255px; background: url("../images/xfk.png") no-repeat;}
.xfk_box{ width: 100%; position: relative;}
.xfk_box ul{ position: absolute; top: 57px; left: 30px; }
.xfk_box ul li a{ font-size: 16px; color: #fff; line-height: 42px; text-align: center;}
.xfk_box ul li a:hover{ color: #faff75;}

@media only all and (max-width:1200px){
  .onlymob { display:block;}
  html{ font-size:20px;}
  body{ font: 0.7rem/1.2rem "Hiragino Sans GB","\5FAE\8F6F\96C5\9ED1","\9ED1\4F53",Arial,sans-serif;}
  html,body{ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
  .Width{ width: 18rem;}
  /* ����Ԫ�� */
  .ht_top .topnav a:nth-child(n+2),.footer p,.pc,.onlypc{ display: none;}

    .banner{ width: 100%; height: 15rem; background: url(../images/banner_bg_ble.png) no-repeat; background-size: 100% 100%;}
    .banner_txt img{ top: 3.5rem; left: 0.3rem; width: 13rem; background-size: contain;}
    .banner_txt p{ top:8.8rem; left: 0.3rem; font-size: 0.6rem; line-height: 1rem; width: 12rem;}

    .bt{ font-size: 1.2rem; line-height: 4rem; width: 100%; height: 4rem; background: url(../images/bt_bg_ble.png) no-repeat; background-position: center center; margin: 0; background-size: contain;}
    h2{ width: 15.9rem; font-size: 0.7rem; line-height: 1rem;}
    .main01 .pone{ display: block; width:100%;}
    .main01 .pc{ display: none;}

    .m02_box{ width: 100%; height: 29rem; background:url(../images/main_boxbg_ble.jpg) no-repeat; background-size: contain; margin-top: 0.5rem;}
    .m02_box_t{ width: 7rem; height: 8.6rem; margin: 4.6rem 0.8rem 0 1.1rem;}
    .m02_box_t h3{ font-size: 0.7rem; line-height: 1.4rem;}
    .m02_box_t p{ font-size: 0.6rem; line-height: 1rem;}
    .zixun{ font-size: 0.7rem; line-height: 1rem;}
    .zixun a{ width: 8rem; height: 3rem; font-size: 0.8rem; line-height: 3rem; margin: 0.2rem auto 0; background-size: contain;}
    .zixun a:hover{ width: 8rem; height: 3rem; background-size: contain;}

    .main03{ margin-top: 0.6rem; padding-bottom: 1.2rem;}
    .main03 ul{ margin-top: 0.2rem;}
    .main03 ul li{ float: left; margin: 0 0.4rem 0 0.2rem;}
    .main03 li.m3_L,.main03 li.m3_R{ width: 11rem; height: 6.5rem; padding: 1.7rem 0 0 7.8rem; background-size: contain;}
    .main03 ul li h4{ font-size: 1rem; line-height: 1.1rem;}
    .main03 ul li p{ font-size: 0.6rem; line-height: 0.9rem; margin-top: 0.4rem; width: 8.6rem;}

    .main04 .lb_pone{ margin-top: 0.5rem; display: block; width:100%;}
    .main04 .lb_pc{ display: none;}
    .main04 .h_pone{ margin-top: 0.5rem; display: block; width:100%;}
    .main04 .h_pc{ display: none;}
    .m4_buy{ margin-top: 0.5rem;}
    .m4_buy a{ width: 8rem; height: 3rem; font-size: 0.8rem; line-height: 3rem; margin: 0.2rem auto 0; background-size: contain;}
    .m4_buy a:hover{ width: 8rem; height: 3rem; background-size: contain;}

    .main05{ margin-top: 0.6rem; padding-bottom: 1.2rem;}
    .main05 .mmc_pone{ margin-top: 0.5rem; display: block; width:100%;}
    .main05 .mmc_pc{ display: none;}

  .box{ width: 100%; height: 11.7rem; background-size: contain;}
  #roll dd{ width: 3rem; height: 2rem; margin: 0 0.08rem 0 0.65rem; background-size: contain;}
  .box span{ bottom: 30%; width: 0.7rem; height:3.6rem; background-size: contain;}
  #roll dd.ke1{ width: 8rem; height: 11.6rem; background:url(../images/main6_boxbg1.png) no-repeat; background-size: contain;}
  #roll dd.ke2{ width: 8rem; height: 11.6rem; background:url(../images/main6_boxbg2.png) no-repeat; background-size: contain;}
  #roll dd.ke3{ width: 8rem; height: 11.6rem; background:url(../images/main6_boxbg3.png) no-repeat; background-size: contain;}
  #roll dd div.ban{ width: 7rem; height: 3rem; margin: 1.2rem auto 0; font-size: 1rem; line-height: 1.1rem; background-size: contain;}
  #roll dd div.b_con{ font-size: 0.7rem; line-height: 1.2rem; background-size: contain;}
  #roll dd div.b_con p{ width: 6rem; height: 1.6rem; margin: 0.2rem auto 0; font-size: 0.6rem; line-height: 0.8rem; overflow: hidden; background-size: contain;}
  #roll dd a{ font-size: 0.6rem; line-height: 1.28rem; width: 4rem; height: 1.3rem; margin: 0.2rem auto 0; background-size: contain;}
  #roll dd a:hover{ width: 4rem; height: 1.3rem; background-size: contain;}
  .xgke a{ font-size: 0.8rem; line-height: 1.8rem; width: 7rem; height: 1.8rem; margin: 0.8rem auto 0; border-radius: 6rem; background-size: contain;}
  .xgke a:hover{ width: 7rem; height: 1.8rem; background-size: contain;}

  .main07{ margin-top: 0.6rem; padding-bottom: 1.2rem;}
  .main07 .mmc_pone{ margin-top: 0.5rem; display: block; width:100%;}
  .main07 .mmc_pc{ display: none;}

  .main08 .lb_pone{ margin-top: 0.5rem; display: block; width:100%;}
  .main08 .lb_pc{ display: none;}
  .main08 .ggt_pone{ margin-top: 0.6rem; display: block; width:100%;}
  .main08 .ggt_pc{ display: none;}

    .main03 .ggt_pone{ margin-top: 0.6rem; display: block; width:100%;}
  .main03 .ggt_pc{ display: none;}

    .foot{ height: 2rem; font-size: 0.6rem; line-height: 2rem; padding: 0; margin: 1.2rem 0 0 0;}
    .foot ul,.foot .foot_pc{ display: none;}
    .foot .foot_ble{ display: block;}

    .xfk{ display: none;}
  /* �������� */
  {transition:width 2s; /* W3C */
   -moz-transition:width 2s; /* Firefox 4 */
   -webkit-transition:width 2s; /* Safari and Chrome */
   -o-transition:width 2s;} /* Opera */

}
/*ͨ���ƶ��˽���*/

@media (device-height:480px) and (-webkit-min-device-pixel-ratio:2){/* ����iphone4/4s */
}
@media (device-height:568px) and (-webkit-min-device-pixel-ratio:2){/* ����iphone5 */
}

@media (device-height:667px) and (-webkit-min-device-pixel-ratio:2){/* ����iphone6 */
}
@media (device-height:736px) and (-webkit-min-device-pixel-ratio:2){/* ����iphone6 Plus */
}