@charset "utf-8";
html{overflow-x:hidden;}
body{ font-size:12px; color:#13CFE8; background: #fc2e2e; 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{color:#000;text-decoration:none;}a:visited{color:#000;text-decoration:none;}a:hover{color:#000;text-decoration:none;}a:active{color:#000;}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;}
em{ font-style: normal;}
/*startdom*/
.main{ width: 640px; margin: 0px auto;}
.contBox{  overflow: hidden;  }
.icon,.showbox .title,.info .info-2,.zmbox .zminput{background: url(../images/s2.png) no-repeat; background-size:640px auto;}
.contBox .icon{ width: 520px; height: 550px; margin:30px auto 25px auto; background-position: 0px -320px;}
.contBox .info{ width: 600px; height: 280px;  margin:0px auto 25px auto; }

.contBox .info .info-1{ width: 475px; margin: 0px auto;   text-align:left; color:#fff;}
.contBox .info .info-2 { width: 471px; height: 128px; display: table; color: #fff; margin: 0px auto; background-position: 0px 0px; 
    overflow: hidden;
}
.contBox .info .info-2 p{  
margin: 3px 10px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
word-wrap:break-word;
word-break: break-all;
}
.contBox .info .info-3{
    height: 60px; 
}
.contBox .info .info-3 .zmbox{width: 600px; height: 60px; margin: 0px auto; position: relative; }
.contBox .info .info-3 .zmbox .zminput{ width: 600px; height: 60px; background-position: 0px -160px; position: relative; }
.contBox .info .info-3 .zmbox .zminput .text{ display: block; width: 280px; font-size: 26px;  height: 45px; line-height: 45px; position: absolute; top: 0px; left: 180px; text-align: center;}
.contBox .info .info-3 .zmbox .zminfo{ display: block; width: 120px; height: 48px; border-radius:30px;  text-align:center; line-height: 37px; color: #333; font-size: 24px; position: absolute; top: 5px; right: 0px; z-index: 12; }
.contBox .info .info-1,.contBox .info .info-2,.contBox .info .info-3{margin-bottom: 25px; font-size: 24px; }


/*.contBox .title{ width: 610px; height: 170px;  background-position: 0px 0px; position: absolute; top: 25px; left: 15px;   }
.contBox .mt{ width: 800px; height: 740px; background: url(../images/mt.png) no-repeat; background-size: 800px auto; position: absolute; top: 265px; left: -135px;  }
.contBox .mtinfo{ width: 310px; height: 220px; position: absolute; left: 310px; top: 210px; background-position: 0px -200px; }
.contBox .mtinfo p{ font-size: 22px; color: #000; padding: 30px 15px 30px 18px; }
.contBox .zmbox{ height: 80px; width: 550px; position: absolute;  left: 45px;  margin-top: 940px; position: relative; margin-left: 45px;}
.contBox .zmbox .zminput{ width: 640px; height: 60px; background-position: 0px -440px; }
.contBox .zmbox .zminput .text{ display: block; width: 338px; font-size: 26px; padding:10px 15px; height: 30px; line-height: 30px; position: absolute; top: 0px; left: 180px;}
.contBox .zmbox .zminfo{ display: block; width: 223px; height: 37px; border-radius:30px; background:#94ddff; text-align:center; line-height: 37px; color: #333; font-size: 24px; position: absolute; top: -52px; right: 0px;}
*/

.ggbox{ height: 80px; position: fixed; left: 0px; bottom: 0px; right: 0px;  z-index: 100;  }
.ggbox .ggcont{ position: relative;}
.ggbox .ggcont .icon{ width: 60px; height: 60px; position: absolute; left: 6px; top: 10px;}
.ggbox .ggcont h1{ padding-left: 80px; font-size: 26px; color: #fff; padding-top: 10px; line-height: 26px;}
.ggbox .ggcont h1 em{ font-size: 18px; }
.ggbox .ggcont .btn{ width: 200px; border: none; height: 60px; line-height: 60px; border-radius: 6px; background: #ffe100; font-size: 30px; color: #893f00; position: absolute; top: 10px; right: 17px; font-weight:bold; display: block; text-align: center;}
.ggmask{ height: 80px; position: fixed; left: 0px; bottom: 0px; right: 0px; background: #333; z-index: 99; opacity: 0.6;  }
.showbox{ width: 600px; height: 860px; margin: 18px auto 0px auto; position: relative;}
.showbox .title{ height: 55px; background-position: 0px -240px; position: initial; margin-left: 25px;}
.showbox .show{ height: 788px;   position: relative; width: 445px; margin: 18px auto; }
.showbox .show-btn-left{ position: absolute; width: 80px; height: 140px; left: -90px; top: 320px; background-position: -440px -200px; }
.showbox .show-btn-right{ position: absolute; width: 80px; height: 140px; right: -90px; top: 320px;  background-position: -540px -200px; }

.swiper-container-h {   height: 100%; width: 100%;   }
.swiper-container-h  .swiper-wrapper{ /* width: 100%; height: 100%; */}
.swiper-container-h  .swiper-wrapper .swiper-slide{ }
.swiper-container-h  .swiper-wrapper .swiper-slide img {    }

.swiper-container {   height: 791px; width: 445px; box-shadow: #333 4px 4px 9px;  }
.swiper-container  .swiper-wrapper{ /* width: 100%; height: 100%; */}
.swiper-container  .swiper-wrapper .swiper-slide{ overflow: hidden; width: 445px;}
.swiper-container  .swiper-wrapper .swiper-slide img { display: block; height: 791px; width: 445px; margin: 0px auto;    }

.popbox{ position: fixed; width: 555px; height: 513px; left: 50%; margin-left: -277.5px; top: 22%; z-index: 199; background:url(../images/popbk_03.png)no-repeat; background-size:555px auto; display:none;  }
.popbox .del{ width: 48px; height: 48px; position: absolute; top: 22px; right: 0px; cursor: pointer;}
.popbox .art{ margin: 135px 20px 0px 20px;}
.popbox .art p{ font-size: 30px; margin-bottom: 35px; color: #fff; }
.popmask{ width: 100%; height: 100%; background: #000; opacity: 0.8; position: fixed; left: 0px; top: 0px; right: 0px; bottom: 0px; z-index: 99; display:none; }

.maskMirco {
    z-index: 3000;
    display: none;
    position: fixed;
    left: 0;
    top: 0;
     width:100%;
    height: 100%;
    background: rgba(0, 0, 0, .5);
    overflow: hidden;
}

.maskMirco span {
    position: absolute;
    color: #333;
    display: block;
    right: 0.25rem;
    top: 1rem;
    padding: 0.5rem 0.5rem;
    background: white;
    border-radius: 3px;
    text-align: center;
    font-size:0.6rem;
}

.maskMirco:after {
    position: absolute;
    right: 0.5rem;
    top: 0.12rem;
    z-index: -1;
    display: block;
    content: "";
    border-width: 0.87rem 0.5rem 0.87rem 0.5rem;
    border-style: solid;
    border-color: transparent #fff transparent transparent;
}


/*enddom*/
.text-no{-webkit-user-select:none;-moz-user-select:none;-o-user-select:none;user-select:none;}
.text-select{-webkit-user-select:text;-moz-user-select:text;-o-user-select:text;user-select:text;}
.anm-bounceInDown{
-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-bounceInLeft{
-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-tada{
-webkit-animation:tada 1s .2s ease both;
-moz-animation:tada 1s .2s 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)}
}