@charset "utf-8";
html{overflow-x:hidden;}
body{ font-size:12px; color:#505972; background: #fee673; vertical-align:top;margin:0;padding:0;font-family:"Microsoft YaHei","SimSun","SimHei",Arial,Tahoma,Helvetica;-webkit-text-size-adjust:none;}h1,h2,h3,h4,h5,h6,u,i,div,font,span,table,tr,td,dl,dd,dt,ul,ol,li,pre,form,fieldset,input,textarea,blockquote{margin:0px;padding:0px;}ol,ul,li{list-style:none;margin:0px;padding:0px;vertical-align:top;}dl,dt,dd{list-style:none;margin:0px;padding:0px;vertical-align:top;}font{margin:0px;padding:0px;font:normal;font-weight:normal;}p{margin:0px;padding:0px;}img{vertical-align:top;border:0;}h1,h2,h3,h4,h5,h6{margin:0px;padding:0px;font-size:12px;font-weight:normal;line-height:normal;}form{margin:0px;padding:0px;}abbr,acronym{border:0;}address,caption,cite,code,dfn,th,var{font-weight:normal;font-style:normal;}a{-webkit-text-size-adjust:none; -webkit-user-select: none;-webkit-tap-highlight-color: rgba(255, 255, 255, 0);-webkit-font-smoothing: antialiased;}a:link{text-decoration:none;}a:visited{text-decoration:none;}a:hover{text-decoration:none;}a:active{}a:focus,input{outline:none;}.clear:before,.clear:after{content:"";clear:both;display:block;height:0;visibility:hidden;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none;}input,textarea{background:none;border:0px none;margin:0;padding:0;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block; margin:0; padding:0;}.foAr{font-family:Arial,"Microsoft YaHei","SimSun";}html{overflow-x:hidden;}.fl{float:left;}.fr{float:right;}.show{display:block;}.hide{display:none;}.fontBankGothic{font-family:BankGothic,Arial;}
@font-face {
      font-family: "hbt";
      src: url(hbt.ttc);
}
/*@font-face {
      font-family: "bdt";
      src: url(bdt.ttc);
}*/
.hbt{ font-family: hbt,"SimSun","宋体";}
.bdt{ font-family: "Microsoft Yahei","微软雅黑",arial,"\5b8b\4f53";}

/*   font-family: "Inconsolata"; src: local("Inconsolata") url("Inconsolata.ttf"); */

em{ font-style: normal;}
.none{ display: none;}
.lf{ float: left;}
.rt{ float: right;}
/*横屏处理*/
.screen_note {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index: 999999;
    display: none;
}
.screen_note p {
    position: absolute;
    width: 100%;
    font-size: 40px;
    height: 60px;
    line-height: 60px;
    top: 40%;
    left: 0;
    color: #fff;
    text-align: center;
}
/*startdom*/

.anm_leaf{
     -webkit-animation: leafAuto 1s ease-in infinite alternate;
}
@-webkit-keyframes leafAuto{
0%{
        -webkit-transform:translate(10px,0px);
        -moz-transform:translate(10px,0px);
    }
100%{
              -webkit-transform:translate( -10px,0px);
        -moz-transform:translate(-10px,0px);
    }
}
.anm_autoR{
-webkit-animation:shakeR 1s  ease infinite both;
-moz-animation:shakeR 1s ease infinite both;}
@-webkit-keyframes shakeR{
    0%{-webkit-transform:translateX(0px);}
    100%{-webkit-transform:translateX(10px);}
}
@-moz-keyframes shakeR{
    0%{-moz-transform:translateX(0px);}
    100%{-moz-transform:translateX(10px);}
}
.anm_autoL{
-webkit-animation:shakeL 1s ease infinite both;
-moz-animation:shakeL 1s ease infinite both;}
@-webkit-keyframes shakeL{
    0%{-webkit-transform:translateX(0px);}
    100%{-webkit-transform:translateX(-10px);}
}
@-moz-keyframes shakeL{
    0%{-moz-transform:translateX(0px);}
    100%{-moz-transform:translateX(-10px);}
}


.section{ background: url(../images/bg01.jpg)no-repeat; background-size: 800px auto; overflow: hidden;}
.logo,.pp1,.pp2,.pp3,.tl,
.bt .topui,
.bt .btmui,
.sub,
.btns,
.content  .btns.btnaddpeo
{background: url(../images/s1.png)no-repeat; background-size: 640px auto }
.logo,.fz01,.fz02,.pp1,.pp2,.pp3,.tl,.bt,
.bt .topui,
.bt .btmui,
.sub,
.cont2 .corner
{ position: absolute; display: block;}
/**s1**/
.section{ width: 640px; height: 1096px; margin:0px auto; background-position: -80px 0px; position: relative; }
.logo{ width: 175px; height: 188px;  background-position: 0px 0px; left: 230px; top: 45px;  }
.fz01{ width: 210px; height: 229px; background:url(../images/fz01.jpg) no-repeat; left:0px; top: 95px; background-size: 210px auto; }
.fz02{ width: 125px; height: 123px; background:url(../images/fz02.jpg) no-repeat; left:485px; top: 380px; background-size: 125px auto; }
.pp1{ width: 289px; height: 299px ; background-position: 0px -200px; left: -50px; top: 453px;  display: none; }
.pp2{ width:146px; height: 125px ; background-position: -213px 0px; left: 435px; top: 465px;  display: none;   }
.pp3{ width: 256px; height: 254px; background-position: -320px -140px; left: 418px; top: 468px;  display: none; }
.tl{ width: 81px; height: 73px; background-position: -22px -520px; left: 63px; top: 760px; display: none; }
.bt{ width: 377px; height:600px; top: 255px; left: 130px; display: none;
/*-webkit-transform:scale(0.5); 
-moz-transform:scale(0.5); 
-o-transform:scale(0.5); */
 }
 .btback{
     background:url(../images/hbk01.png) no-repeat; background-position: 50px 20px;  background-size: 280px 550px;
 }
.bt .nr{ width: 280px; margin:30px auto; position: relative;}
.bt .topui{ width: 377px; height: 62px;  position: absolute; background-position:  -240px -510px; left: 0px; top: 0px; }
.bt .btmui{ width: 377px; height: 62px; position: absolute; background-position:  -240px -592px; left: 0px; bottom: 0px; }
.bt p{ font-size: 36px; color: #ffea60; text-shadow:#000 2px 2px 2px; display: block; height: 590px; position: absolute; width: 50px; top: 50px; line-height:38px; }
.bt .p1{ left: 190px; }
.bt .p2{ left: 130px;}
.bt .p3{ left: 65px;}
.btns{ width: 266px; height: 85px; display: block; background-position: -360px 0px; color: #951e00;  font-size: 32px; text-align: center; line-height: 85px;  }
.sub{ width: 266px; height: 85px; background-position: -360px 0px; left: 185px; bottom: 50px; color: #951e00;  font-size: 32px; text-align: center; line-height: 85px; display: none; }

/**s2**/
.cont2{ width: 640px; margin: 0px auto;  background: url(../images/se2/se2_06.jpg) 5px 0px repeat-y; background-size:640px auto; }
.cont2 .backtop{ width: 640px; height: 61px;  background: url(../images/se2/se2_03.png) no-repeat; background-size:640px auto; position: absolute; top: 0px; left: 0px; }
.cont2 .backbtm{ width: 640px; height: 66px;  background: url(../images/se2/se2_08.png) no-repeat; background-size:640px auto; position: absolute; bottom: 0px; left: 0px; }
.cont2 .corner{ width: 82px; height: 86px;   }
.cont2 .corner.crr1{ left: 68px; top: 78px; background: url(../images/se2/ui1_03.png) no-repeat; background-size:82px auto;}
.cont2 .corner.crr2{ right: 68px; top: 78px; background: url(../images/se2/ui1_05.png) no-repeat; background-size:82px auto;}
.cont2 .corner.crr3{ left: 68px; bottom: 78px;background: url(../images/se2/ui1_09.png) no-repeat; background-size:82px auto; }
.cont2 .corner.crr4{ right: 68px; bottom: 78px; background: url(../images/se2/ui1_10.png) no-repeat; background-size:82px auto;}
.content{ width: 478px; margin: 0px auto 0px auto; padding-top: 100px; }
.content h1{ font-size: 44px; color: #ffea60; text-shadow:#000 2px 2px 2px; text-align: center; font-family: "宋体"; margin-bottom: 15px;}
.content h2{ font-size: 30px; color: #ffea60; text-shadow:#000 2px 2px 2px; text-align: center; font-family: "宋体"; margin-bottom: 10px;}
.content h3{ font-size: 22px; color: #ffea60; text-shadow:#000 2px 2px 2px; text-align: center; font-family: "宋体"; margin-bottom: 10px;}
.content .nts{ font-size: 28px; color: #ffea60; text-shadow:#000 2px 2px 2px; text-align: center; font-family: "宋体"; margin-bottom: 15px; }
.content .focusImg{ width: 478px; height: 306px; position: relative; }
.content .focusImg img{  width: 478px; height: 306px;}
.content .focusImg .swiper-button-prev{ left: -60px; width: 46px; height: 76px; background: url(../images/se2/ui2_03.png) no-repeat; background-size: 34px auto; background-position: 10px 15px; }
.content .focusImg .swiper-button-next{ right: -60px; width: 46px; height: 76px; background: url(../images/se2/ui2_05.png) no-repeat; background-size: 34px auto; background-position: 0px 15px; }
.content .hr{  margin:40px auto 20px auto; height: 1px;  width: 465px; background: #550e00;}
.content .focusImg2{ width: 478px; height: 96px; position: relative; margin-bottom: 15px;}
.content .focusImg2 img{  width: 147px; height: 94px; border: 1px solid #c03200;}
.content .focusImg2 img.on{ border: 1px solid #ffea60;}
.content .focusImg2 .swiper-button-prev{ left: -60px; width: 46px; height: 76px; background: url(../images/se2/ui2_03.png) no-repeat; background-size: 34px auto; background-position: 10px 15px; }
.content .focusImg2 .swiper-button-next{ right: -60px; width: 46px; height: 76px; background: url(../images/se2/ui2_05.png) no-repeat; background-size: 34px auto; background-position: 0px 15px; }
.content .btnBox{ height: 75px; position: relative;}
.content .btnBox .btns{ margin: 0px auto; display: block; margin-bottom: 10px;}
.content .btnBox .btnprev{ width: 266px; height: 35px; line-height: 35px; background:none; color: #fff; text-decoration: underline;  }
/**s3**/
.ctt2 { padding-top: 80px;}
.ctt2 .nts.ft18{ font-size:18px; }
.ctt2 .btns.btnaddpeo{ width: 310px; height: 52px; background-position: 0px -680px; margin: 0px auto; }
#bgcheck1{ margin-bottom: 10px;}
.ctt2 .hr2{  margin:10px auto 10px auto; height: 1px;  width: 465px; background: #550e00;}
.ctt2  h1{ margin-bottom: 10px;}
.ctt2  .nts{ margin-bottom: 10px;}
#bgcheck1{ overflow: hidden;}
#bgcheck1 .imgbox{ position: absolute; left: 0px; top: 0px; width: 478px; height: 306px; border:1px dashed #000; }
#bgcheck1 .imgbox img{ width: 100%;}
#bgcheck1 .imgbox .del{ width: 30px; height: 30px;  position: absolute; display: block; top: 0px; right: 0px; background: #000; color: #fff; text-align:center; line-height: 30px; font-size: 18px;}
/**s4**/
#bgcheck2 .imgbox{ position: absolute; left: 0px; top: 0px; width: 478px; height: 306px; border:1px dashed #000; }
#bgcheck2 .imgbox img{ width: 100%;}
#bgcheck2 .imgbox .del{ width: 30px; height: 30px;  position: absolute; display: block; top: 0px; right: 0px; background: #d1d1d1; text-align:center; line-height: 30px; font-size: 18px;}
#bgcheck2 .txtbox{ position: absolute; left: 0px; top: 0px; padding-right: 35px; font-size: 28px; width: 478px;}
#bgcheck2 .txtbox .del{ width: 30px; height: 30px;  position: absolute; display: block; bottom:-30px; left: 0px; color:#000; background: #d1d1d1; text-align:center; line-height: 30px; font-size: 18px;}

.sec4 .focusImg{ margin-bottom: 10px; overflow: hidden;}
.sec4 .inputBox{ height: 59px; width:478px; position: relative; margin-bottom: 10px; }
.sec4 .inputBox .txt{ display: block; height: 18px; padding: 18px 5px; text-indent: 0.5em; font-size: 24px; border-radius: 30px; background: #fff; position: absolute; left: 0px; top: 0px; width: 250px;}
.sec4 .inputBox .btntxt{  border-radius: 30px;  position: absolute; top: -12px; right: -29px; transform:scale(0.7);   }
.sec4 .fontBox{ height: 55px; margin-bottom: 10px;}
.sec4 .fontBox ol{ width: 410px;  margin:0px auto;}
.sec4 .fontBox ol li{ height: 47px; width: 170px; border: 1px solid #9c2200; }
.sec4 .fontBox ol li img{ width: 170px; height: 47px;}
.sec4 .fontBox ol li.on{ border: 2px solid #000;}
.sec4 .colorBox{ height: 52px; margin-bottom: 10px; }
.sec4 .colorBox ol li{ width: 50px; height: 51px; float: left; border: 2px solid #fff; margin-right: 15px;}
.sec4 .colorBox ol li.br{ margin-right: 0px;}
.sec4 .colorBox ol li.on{ border: 2px solid #000;}
.sec4 .colorBox ol li.color1{ background: #000000; }
.sec4 .colorBox ol li.color2{ background: #a0a0a0; }
.sec4 .colorBox ol li.color3{ background: #ffffff; }
.sec4 .colorBox ol li.color4{ background: #fb0400; }
.sec4 .colorBox ol li.color5{ background: #01e9fd; }
.sec4 .colorBox ol li.color6{ background: #fecb00; }
.sec4 .colorBox ol li.color7{ background: #adff00; }

.ctt3{ padding-top: 120px;}
.facebox{ height: 125px; width: 310px; margin: 0px auto; position: relative;}
.facebox .face{ width: 100px; height: 100px; position: absolute; left: 0px; top: 0px; border-radius: 50%; border: 11px solid #470c00;}
.facebox p{ width: 180px; float: right; word-wrap:break-word; word-break:break-all; font-size: 30px; color: #ffea60; text-shadow:#000 2px 2px 2px; padding-top: 15px;  }
.ctt3 h3{ font-size: 22px;}

#btnfenxiang { line-height: 25px;}
#btnfenxiang span{ display: block;}
#btnfenxiang span.f1{ font-size: 28px; padding-top: 15px;}
#btnfenxiang span.f2{ font-size: 18px;}
#bgcheck3{ margin-bottom: 10px;}

.mask{ width: 100%; height: 100%; position: fixed; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: 300; background: #000; opacity: 0.8; background: rgba(0,0,0,0.8); display: none;}
.popbox{ width: 550px; height: 540px; position: fixed; z-index: 310; top: 210px; left: 50%; margin-left: -275px;display: none; }
.popbox .facebox{ margin-bottom: 50px;}
.popbox .hd{ width: 65px; height: 67px; position: absolute; left: 248px; bottom: -26px;}


/*enddom*/
.rtt90{
    display: table;
    -webkit-transform: rotate(90deg);    /* for Chrome || Safari */
 -moz-transform: rotate(90deg);       /* for Firefox */
-ms-transform: rotate(90deg);        /* for IE */
 -o-transform: rotate(90deg);         /* for Opera */
}

.anm_fdauto{
    -webkit-animation:fadeAuto 2s  ease infinite both;
    -moz-animation:fadeAuto 2s  ease infinite both;
}
@-webkit-keyframes fadeAuto{
    0%{opacity:0.6}
    100%{opacity:1}
}
@-moz-keyframes fadeAuto{
    0%{opacity:0.6}
    100%{opacity:1}
}

.anm_rtin{
-webkit-animation:rotateIn 1s .2s ease both;
-moz-animation:rotateIn 1s .2s ease both;}
@-webkit-keyframes rotateIn{
0%{-webkit-transform-origin:center center;
-webkit-transform:rotate(-200deg);
opacity:0}
100%{-webkit-transform-origin:center center;
-webkit-transform:rotate(0);
opacity:1}
}
@-moz-keyframes rotateIn{
0%{-moz-transform-origin:center center;
-moz-transform:rotate(-200deg);
opacity:0}
100%{-moz-transform-origin:center center;
-moz-transform:rotate(0);
opacity:1}
}

.anm_lin{
-webkit-animation:bounceInLeft 1s .2s ease both;
-moz-animation:bounceInLeft 1s .2s ease both;}
@-webkit-keyframes bounceInLeft{
0%{opacity:0;
-webkit-transform:translateX(-2000px)}
60%{opacity:1;
-webkit-transform:translateX(30px)}
80%{-webkit-transform:translateX(-10px)}
100%{-webkit-transform:translateX(0)}
}
@-moz-keyframes bounceInLeft{
0%{opacity:0;
-moz-transform:translateX(-2000px)}
60%{opacity:1;
-moz-transform:translateX(30px)}
80%{-moz-transform:translateX(-10px)}
100%{-moz-transform:translateX(0)}
}

.anm_rin{
-webkit-animation:bounceInRight 1s .2s ease both;
-moz-animation:bounceInRight 1s .2s ease both;}
@-webkit-keyframes bounceInRight{
0%{opacity:0;
-webkit-transform:translateX(2000px)}
60%{opacity:1;
-webkit-transform:translateX(-30px)}
80%{-webkit-transform:translateX(10px)}
100%{-webkit-transform:translateX(0)}
}
@-moz-keyframes bounceInRight{
0%{opacity:0;
-moz-transform:translateX(2000px)}
60%{opacity:1;
-moz-transform:translateX(-30px)}
80%{-moz-transform:translateX(10px)}
100%{-moz-transform:translateX(0)}
}

.anm_tin{
-webkit-animation:bounceInDown 1s .2s ease both;
-moz-animation:bounceInDown 1s .2s ease both;}
@-webkit-keyframes bounceInDown{
0%{opacity:0;
-webkit-transform:translateY(-2000px)}
60%{opacity:1;
-webkit-transform:translateY(30px)}
80%{-webkit-transform:translateY(-10px)}
100%{-webkit-transform:translateY(0)}
}
@-moz-keyframes bounceInDown{
0%{opacity:0;
-moz-transform:translateY(-2000px)}
60%{opacity:1;
-moz-transform:translateY(30px)}
80%{-moz-transform:translateY(-10px)}
100%{-moz-transform:translateY(0)}
}

.anm_rotateIn{
-webkit-animation:anm_rotateIn 1s .2s ease both;
-moz-animation:anm_rotateIn 1s .2s ease both;}
@-webkit-keyframes anm_rotateIn{
    0%{ 
      -webkit-transform:rotate(0deg);
   }
    100%{
         -webkit-transform:rotate(360deg);
    }
}
@-moz-keyframes anm_rotateIn{
    0%{ 
      -moz-transform:rotate(0deg);
   }
    100%{
         -moz-transform:rotate(360deg);
    }
}


.anm_bounceIn{
-webkit-animation:bounceIn 1s .2s ease both;
-moz-animation:bounceIn 1s .2s ease both;}
@-webkit-keyframes bounceIn{
0%{opacity:0;
-webkit-transform:scale(.3)}
50%{opacity:1;
-webkit-transform:scale(1.05)}
70%{-webkit-transform:scale(.9)}
100%{-webkit-transform:scale(1)}
}
@-moz-keyframes bounceIn{
0%{opacity:0;
-moz-transform:scale(.3)}
50%{opacity:1;
-moz-transform:scale(1.05)}
70%{-moz-transform:scale(.9)}
100%{-moz-transform:scale(1)}
}

.anm_tada{
-webkit-animation:tada 1s 1.5s ease  both;
-moz-animation:tada 1s 1.5s ease  both;}
@-webkit-keyframes tada{
0%{-webkit-transform:scale(1)}
10%,20%{-webkit-transform:scale(0.9) rotate(-3deg)}
30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg)}
40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg)}
100%{-webkit-transform:scale(1) rotate(0)}
}
@-moz-keyframes tada{
0%{-moz-transform:scale(1)}
10%,20%{-moz-transform:scale(0.9) rotate(-3deg)}
30%,50%,70%,90%{-moz-transform:scale(1.1) rotate(3deg)}
40%,60%,80%{-moz-transform:scale(1.1) rotate(-3deg)}
100%{-moz-transform:scale(1) rotate(0)}
}

.anm_rotatesw{
    -webkit-animation:rotatesw 2s 1.5s ease infinite both;
    -moz-animation:rotatesw 2s 1.5s ease infinite both;
}
@-webkit-keyframes rotatesw{
    0%{-webkit-transform:rotate(0deg) }
    50%{-webkit-transform:rotate(5deg) }
    80%{-webkit-transform:rotate(0deg) translateX(-5px) }
    100%{-webkit-transform:translateX(0px)}
}
@-moz-keyframes rotatesw{
    0%{-moz-transform:rotate(0deg)}
    50%{-moz-transform:rotate(5deg)}
    100%{-moz-transform:translateX(-5px)}
}

.anm_flash{
-webkit-animation:flash 1s .2s ease infinite both;
-moz-animation:flash 1s .2s ease infinite both;}
@-webkit-keyframes flash{
0%,50%,100%{opacity: 1;}
25%,75%{opacity: 0;}
}
@-moz-keyframes flash{
0%,50%,100%{opacity: 1;}
25%,75%{opacity: 0;}
}
