ul, li {
    list-style: none;
    line-height: 0px;
}

body, div, ul, li, img, p, a, h1, h2, h3 {
    margin: 0px;
    padding: 0px;
    border: 0px;
}

html, body {
    width: 100%;
    height: 100%;
    background: #ffffff;
    color: #ffffff;
    font-family: "微软雅黑", "黑体", Helvetica, Verdana, sans-serif;
    font-size: 14px;
    overflow: hidden;
}
.fl{float:left}
.fr{float:right}
.cl{clear:both}
.clear{clear:both}
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clearfix {*zoom:1;}
div {background-repeat: no-repeat;}

.border-box{
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}

img{display: block;}
.mainbox{width: 100%;height: 100%;max-width: 750px;margin: 0 auto;overflow: hidden;position: relative;}
@keyframes animation-rotate {
  from {transform: rotate(0deg);-webkit-transform: rotate(0deg);}
  to {transform: rotate(360deg);-webkit-transform: rotate(360deg);}
}
@-webkit-keyframes animation-rotate {
  from {transform: rotate(0deg);-webkit-transform: rotate(0deg);}
  to {transform: rotate(360deg);-webkit-transform: rotate(360deg);}
}

@keyframes animation-rotate-un {
  from {transform: rotate(0deg);-webkit-transform: rotate(0deg);}
  to {transform: rotate(-360deg);-webkit-transform: rotate(-360deg);}
}
@-webkit-keyframes animation-rotate-un {
  from {transform: rotate(0deg);-webkit-transform: rotate(0deg);}
  to {transform: rotate(-360deg);-webkit-transform: rotate(-360deg);}
}

.loading_bg{
	position:absolute;top:0;left:0;z-index:1000;width:100%;height:100%;background-color:#fff;
  background-color: #ebebeb;
  text-align: center;
  /* Center 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;
	}
.loading_bg .loading-anm {width:100%;height: 100%;}
.loading_bg .loading_logo{position:absolute;width: 100px; top:40%;left:50%;margin-left: -50px; margin-top:0%;}
.loading_bg .loading_logo img{width:100%;height: 100%; }
.loading_bg .content .logo {
  width: 40px;
  line-height: 0;
  font-size: 0;
  text-align: center;
  display: inline-block;
  animation: animation-rotate-un 1600ms linear infinite normal forwards;
  -webkit-animation: animation-rotate-un 1600ms linear infinite normal forwards;
  transform-origin: center center;
  -webkit-transform-origin: center center;
}
.loading_bg .loading_text{position:absolute;top:57%;left:0;width:100%;height:0.2rem;color:#252525;text-align:center;font-size:16px}

@keyframes eatz {
  0%,100% {transform: rotate(0deg);-webkit-transform: rotate(0deg);}
  50% {transform: rotate(-3deg);-webkit-transform: rotate(-3deg);}
}
@-webkit-keyframes eatz {
  0%,100% {transform: rotate(0deg);-webkit-transform: rotate(0deg);}
  50% {transform: rotate(-3deg);-webkit-transform: rotate(-3deg);}
}

.disabled { pointer-events: none; } 

#swiper,.page{width:100%;height: 100%;}
.page img{width: 100%;}

.page1{background: url(//x0.ifengimg.com/cmpp/2019/51/b408ee37528642c/p1_bg.jpg) no-repeat 0 0;background-size: 100% auto;}
.page1 .p1_logo{position: absolute;left: 13%;bottom: 9.4%;width: 75%;max-width: 543px;}
.page1 .p1_btns{position: absolute;left: 33%;bottom: 25%;width: 40%;max-width: 345px;}
.page1 .p1_btns .P1_zi{position: absolute;left: 10%;bottom: -19%;width: 80%;max-width: 254px;}
.page1 .p1_biaoti{position: absolute;left: 13%;top: 22%;width: 75%;max-width: 625px;}
.page1 .p1_text{position: absolute;left: 0%;top: 38%;width: 100%;text-align: center;line-height: 1.8;font-size: 16px;color: #343434;}

.page2 .pcont{width: 100%;height: 100%;}
.page2 .p2_bottom,.page2 .p2_middle,.page2 .p2_top,.page2 .p2_lay,.page2 .p2_bottomhl {position: absolute;left: 0;top: 0;width: 100%;height: 100%;}
.page2 .p2_bottom .p2_bottomhl{}
.page2 .p2_top .p2_lay{background: rgba(0,0,0,0.8);}
.page2 .p2_top .p2_tipbox{position: absolute;left: 10%;top: 20%;width: 80%;max-width: 525px;}
.page2 .p2_top .p2_tipbox .p2_textbox{position: absolute;left: 14%;bottom: 7%;width: 72%;max-width: 368px;}
.page2 .p2_top .p2_tipbox .p2_textbox p{line-height: 1.8;font-size: 16px;color: #343434;margin: 5% 0;}
.page2 .p2_top .p2_tipbox .p2_textbox .p2_btn{width: 57%;max-width: 214px;margin: 0 auto;}
.page2 .p2_top .p2_hands{position: absolute;left: 10%;bottom: 0%;width: 80%;height: 40%;max-width: 525px;display: none;}
.page2 .p2_top .p2_hands .p2_shou{position: absolute;right: 12%;bottom: 30%;width: 21%;max-width: 80px;}
.page2 .p2_middle{overflow: hidden;}
.page2 .p2_middle .p2_mimi{position: absolute;left: 0%;bottom: 0%;width: 100%;max-width: 750px;/* display: none; */}
.page2 .p2_middle .p2_mimi .p2_t{position: absolute;left: 36%;top: 13%;width: 30%;max-width: 213px;}
.page2 .water{position: absolute;left: -50%;top: 50%;width: 200%;height: 200%;/* background-color: #fff; */}
.page2 .water{
	transform-origin: center top;
  	-webkit-transform-origin: center top;
}


@keyframes move_wave {
    0%,100%{transform: translateX(0) translateY(0px)}
    50% {transform: translateX(-5%) translateY(10px)}
}
@-webkit-keyframes move_wave {
    0%,100%{transform: translateX(0) translateY(0px)}
    50% {transform: translateX(-5%) translateY(10px)}
}
.waterbgbox{width: 100%;height: 100%;}
.waterbg {
    position: absolute;
    left: 0;
    top: -5%;
    width: 100%;
    height: 50%;
    background-repeat: repeat no-repeat;
    background-position: 0 top;
    transform-origin: center top;
}
.waterTop {
	background-image: url(//x0.ifengimg.com/cmpp/2019/51/b408ee37528642c/P2_shuiqian.png);
	/* background-size: 100% 100%; */
}
.waterTop {
  animation: move_wave 3s linear infinite;
}
.waterMiddle {
	background-image: url(//x0.ifengimg.com/cmpp/2019/51/b408ee37528642c/P2_shuishen.png);
	background-size: 100% 100%;
}
.waterMiddle {
    animation: move_wave 3s linear infinite;
}
.waterBottom {
	background-image: url(//x0.ifengimg.com/cmpp/2019/51/b408ee37528642c/P2_shuiqian.png);
	top: -8%;
	background-size: 100% 100%;
}
.waterBottom {
    animation: move_wave 5s linear infinite;
}



@keyframes p3_scla {
  0%{transform: scale(0.3);-webkit-transform: scale(0.3);}
  100%{transform: scale(1);-webkit-transform: scale(1);}
}
@-webkit-keyframes p3_scla {
  0%{transform: scale(0.3);-webkit-transform: scale(0.3);}
  100%{transform: scale(1);-webkit-transform: scale(1);}
}

.page3 {overflow: hidden;}
.page3 .p3_scla{position: absolute;left: 0%;top: 0%;width: 100%;height: 100%;-webkit-transform: scale(0.3);transform: scale(0.3);}
.page3 .p3_scla.on{
  animation: p3_scla 2s 0.5s linear normal forwards;
  -webkit-animation: p3_scla 2s 0.5s linear normal forwards;
}
.page3 .p3_yuanbox{position: absolute;left: -45%;top: -2%;width: 190%;}
.page3 .p3_yuanbox .p3_guang{position: absolute;left: 0%;top: 0%;width: 100%;}
.page3 .p3_logo{position: absolute;left: 13%;top: 5%;width: 75%;max-width: 543px;}
.page3 .p3_textbox{position: absolute;left: 14%;top: 23%;width: 72%;max-width: 368px;}
.page3 .p3_textbox p{margin-top: 4%;line-height: 1.8;font-size: 16px;color: #5d2f0d;}
.page3 .p3_textbox p span{color: #fff;background-color: #5c8d94;padding: 2px 4px;border-radius: 3px;}
.page3 .p3_textbox p.p3_email span{display: block;font-size: 14px;text-align: center;padding: 5px 4px;margin-top: 6%;}
.page3 .p3_textbox .p4_btn{width: 57%;max-width: 214px;margin: 5% auto 0;}


.music{position:absolute;right: 0.3rem;top:0.3rem;width:30px;height:30px;background:url(//x0.ifengimg.com/cmpp/2019/51/b408ee37528642c/music.png) no-repeat center left;background-size:cover;z-index: 1000;display:none;}
.music.pause{background:url(//x0.ifengimg.com/cmpp/2019/51/b408ee37528642c/music_pause.png) no-repeat;background-size:cover;}
/* ==========================================================================
Animations
========================================================================== */

a,.music{outline: none;-webkit-tap-highlight-color: transparent;-webkit-touch-callout: none;-webkit-user-select: none;}



.share {
    width: 100%;
    height: 100%;
    display: none;
    background-color: rgba(0, 0, 0, 0.5);
    position: fixed;
    top: 0;
    left: 0;
    text-align: right;
    z-index: 1100;
}
.share img {
	display: inline-block;
    width: 70%;
}

@media only screen and (max-width: 320px){
	
}

@media (min-width:320px) and (max-width:375px) {
	
}