* { margin: 0; padding: 0;}
html,body{height:100%; text-align: center;}
body>img{width: 0px; height: 0px; display: none; position: absolute;}
a{-webkit-tap-highlight-color: transparent;-webkit-touch-callout: none;-webkit-user-select: none; color: #FFF;}
Section{overflow: hidden; min-height: 600px;  max-height: 672px;   height: 100%;  width: 414px; position: absolute; margin: auto;}

.musicBtn{width: 40px; height: 40px; display: block; position: absolute; right: 20px; top: 20px;background:url(../images/soundBtn.png) center center no-repeat; display: none;}
.shake{-webkit-animation: shakeAni 1000ms linear infinite;}
@-webkit-keyframes shakeAni{

	25%{right: 23px;transform:rotate(-5deg);}
	75%{right: 18px;transform:rotate(5deg);}

}
.logo{ width: 171px; height: 20px; left: 19px; top: 23px; position: absolute; background: url(../images/logo.png);background-size: cover;}
#loadingSection{background: #A00606;  }
#loadingSection .loadingMoBox{ width: 272px; height: 232px; left: 70px; top: 284px; background: url(../images/loadingRayBg.jpg) ; position: absolute;}/* radial-gradient(ellipse, #ff0000 30%, #A00606 65%) */
.loadingMo1{ width: 97px; height:109px ; left: 51px; top: 61px; position: absolute; background:url(../images/loadingMo1.png);
	-webkit-animation-name: Mo1Ani;
    -webkit-animation-duration: 2000ms;
    -webkit-animation-iteration-count: infinite;
    /* -webkit-animation-timing-function: step-start; */
}
.loadingMo2{ width: 84px; height:112px ; left: 136px; top: 61px; position: absolute; background:url(../images/loadingMo2.png);
	-webkit-animation-name: Mo1Ani;
    -webkit-animation-duration: 2000ms;
    -webkit-animation-iteration-count: infinite;
    /* -webkit-animation-timing-function: step-start; */
}
@-webkit-keyframes Mo1Ani{
    0%{transform:rotate(-10deg);}
    50%{transform:rotate(10deg);}
    100%{transform:rotate(-10deg);}
}
@-webkit-keyframes Mo2Ani{
    0%{transform:rotate(-3deg);}
    50%{transform:rotate(3deg);}
    100%{transform:rotate(-3deg);}
}
@-webkit-keyframes Mo3Ani{
    0%{left: 118px;transform:rotate(-3deg);}
    50%{left: 108px;transform:rotate(3deg);}
    100%{left: 118px;transform:rotate(-3deg);}
}
/* blinks */
.homeDeerBlink{width: 22px;height: 10px; position: absolute;left: 43px;top: 60px; background: url(../images/blinkHomeDeerEye.png); -webkit-animation: homeDeerBlinkAni 3000ms infinite step-start;}
@-webkit-keyframes homeDeerBlinkAni{
    5%{background-position-y: -10px;}
    10%{background-position-y: 0px;}
    15%{background-position-y: 0px;}
    20%{background-position-y: -10px;}
    25%{background-position-y: 0px;}
}
.homeSantaBlink{width: 25px;height: 10px; position: absolute;left: 22px;top: 57px; background: url(../images/blinkHomeSanataEye.png); -webkit-animation: homeSantaBlinkAni 3000ms infinite step-start;}
@-webkit-keyframes homeSantaBlinkAni{
	50%{background-position-y: 0px;}
    55%{background-position-y: -10px;}
    60%{background-position-y: 0px;}
    65%{background-position-y: 0px;}
    70%{background-position-y: -10px;}
    75%{background-position-y: 0px;}
}
.snowManBlink{width: 18px;height: 8px; position: absolute;left: 18px;top: 26px; background: url(../images/snowManEyes.png); -webkit-animation: snowManBlinkAni 3000ms infinite step-start;}
@-webkit-keyframes snowManBlinkAni{
	5%{background-position-y: -8px;}
    10%{background-position-y: 0px;}
    15%{background-position-y: -8px;}
    20%{background-position-y: 0px;}
    25%{background-position-y: -8px;}
    30%{background-position-y: 0px;}
}
.sec3DeerBlink{width: 15px;height: 8px; position: absolute;left: 42px;top: 47px; background: url(../images/blinkSec3Deer.png); -webkit-animation: sec3DeerBlinkAni 3000ms infinite step-start;}
@-webkit-keyframes sec3DeerBlinkAni{
    5%{background-position-y: -8px;}
    10%{background-position-y: 0px;}
    15%{background-position-y: 0px;}
    20%{background-position-y: -8px;}
    25%{background-position-y: 0px;}
}
.sec3SantaBlink{width: 18px;height: 7px; position: absolute;left: 29px;top: 49px; background: url(../images/blinkSec3Santa.png); -webkit-animation: sec3SantaBlinkAni 3000ms infinite step-start;}
@-webkit-keyframes sec3SantaBlinkAni{
	50%{background-position-y: 0px;}
    55%{background-position-y: -7px;}
    60%{background-position-y: 0px;}
    65%{background-position-y: 0px;}
    70%{background-position-y: -7px;}
    75%{background-position-y: 0px;}
}
.treeDeerBlink{width: 21px;height: 9px; position: absolute;left: 64px;top: 44px; background: url(../images/blinkTreeSectionDeer.png); -webkit-animation: treeDeerBlinkAni 3000ms infinite step-start;}
@-webkit-keyframes treeDeerBlinkAni{
    5%{background-position-y: -9px;}
    10%{background-position-y: 0px;}
    15%{background-position-y: 0px;}
    20%{background-position-y: -9px;}
    25%{background-position-y: 0px;}
}
.treeSantaBlink{width: 21px;height: 11px; position: absolute;left: 125px;top: 54px; background: url(../images/blinkTreeSectionSanta.png); -webkit-animation: treeSantaBlinkAni 3000ms infinite step-start;}
@-webkit-keyframes treeSantaBlinkAni{
	50%{background-position-y: 0px;}
    55%{background-position-y: -11px;}
    60%{background-position-y: 0px;}
    65%{background-position-y: 0px;}
    70%{background-position-y: -11px;}
    75%{background-position-y: 0px;}
}
.st01DeerBlink{width: 21px;height: 11px; position: absolute;left: 49px;top: 61px; background: url(../images/blinkSt1Deer.png); -webkit-animation: st01DeerBlinkAni 3000ms infinite step-start;}
@-webkit-keyframes st01DeerBlinkAni{
    5%{background-position-y: -11px;}
    10%{background-position-y: 0px;}
    15%{background-position-y: 0px;}
    20%{background-position-y: -11px;}
    25%{background-position-y: 0px;}
}
.st01SantaBlink{width: 28px;height: 10px; position: absolute;left: 27px;top: 69px; background: url(../images/blinkSt1Santa.png); -webkit-animation: st01SantaBlinkAni 3000ms infinite step-start;}
@-webkit-keyframes st01SantaBlinkAni{
	50%{background-position-y: 0px;}
    55%{background-position-y: -10px;}
    60%{background-position-y: 0px;}
    65%{background-position-y: 0px;}
    70%{background-position-y: -10px;}
    75%{background-position-y: 0px;}
}
.st02SantaBlink{width: 30px;height: 15px; position: absolute;left: 37px;top: 50px; background: url(../images/blinkSt2Santa.png);background-position-y: -15px; -webkit-animation: st02SantaBlinkAni 6000ms infinite step-start;}
@-webkit-keyframes st02SantaBlinkAni{
	50%{background-position-y: 0px;}

    100%{background-position-y: -15px;}
}
/* blinks end */


.loadingPre{width: 46px; height: 35px; position: absolute; left: 117px; top: -9px; background: url(../images/loadingPer.png); font-size: 14px; color: #FFF; padding-top: 9px; background-size: cover;}
.loadingTxt{width: 240px; height: 90px; position: absolute; left: 86px; top: 151px; background: url(../images/loadingTxt.jpg);background-size: cover;}

.homeSection{background: #A00606;  }
.homeSection .homeBg{ width: 414px; height: 343px; position: absolute; bottom: 73px; background: url(../images/homeBg.jpg);}
.nextBtn{width:164px; height: 77px; left: 500px; bottom: 27px; position: absolute; transition: all 800ms;}
.nextBtn .btnBg{ width:164px; height: 77px; background:url(../images/nextBtn.png); -webkit-animation: btnBrAni 1600ms infinite;}
.swiper-slide-active .nextBtn{left: 128px;}/* -webkit-animation: btnInAni 800ms; */
@-webkit-keyframes btnInAni{
	0%{left:1000px;}
    75%{left: 116px;}
    92%{left: 130px;}
    100%{left: 128px;}
}
@-webkit-keyframes btnBrAni{
    0%{-webkit-transform:scale(1,1);  }
    10%{-webkit-transform:scale(1.05,1.05);}
    20%{-webkit-transform:scale(0.98,0.98);  }
    30%{-webkit-transform:scale(1,1);  }
}


.homeSection .santaBody{width: 414px;height: 343px; position: absolute; bottom: 72px; background: url(../images/body.png);}
.homeSection .deerHead{ width: 97px; height:109px ; left: 108px; bottom: 224px; position:absolute; background:url(../images/loadingMo1.png);
	-webkit-animation-name: Mo2Ani;
    -webkit-animation-duration: 2000ms;
    -webkit-animation-iteration-count: infinite;
    /* -webkit-animation-timing-function: step-start; */
}
.homeSection .santaHead{width: 84px; height:112px ; left: 201px; bottom: 220px; position: absolute; background:url(../images/loadingMo2.png);
	-webkit-animation-name: Mo2Ani;
    -webkit-animation-duration: 2000ms;
    -webkit-animation-iteration-count: infinite;
    /* -webkit-animation-timing-function: step-start; */
}
.homeSection .mapLayer{width: 192px; height:126px ; left: 128px; bottom: 149px; position: absolute; background:url(../images/map.png);
	-webkit-animation-name: Mo3Ani;
    -webkit-animation-duration: 2000ms;
    -webkit-animation-iteration-count: infinite;
    /* -webkit-animation-timing-function: step-start; */
}
.homeSection .mainSectionTxt{ width: 333px; height: 172px; position: absolute; left: 48px; top: 65px; background: url(../images/mainSectionTxt.png);}
.homeSection .mainSectionTxt .mainSectionFlower{width: 64px;height: 53px; position: absolute; top: 49px; right: 0; background: url(../images/mainSectionFlower.png);-webkit-animation: flowerAni 2000ms infinite;}
@-webkit-keyframes flowerAni{
    0%{transform:rotate(-10deg);}
    50%{transform:rotate(10deg);}
    100%{transform:rotate(-10deg);}
}
.homeSection .snowMan{width: 47px;height: 112px; position: absolute; top: 108px; right: 134px; background: url(../images/snowMan.png) no-repeat;-webkit-animation: snowManAni 10000ms infinite;}

@-webkit-keyframes snowManAni{
    5%{top: 68px;}
	15%{top: 68px;transform:rotate(3deg);}
	20%{top: 68px;transform:rotate(-3deg);}
	25%{top: 68px;transform:rotate(3deg);}
	30%{top: 68px;transform:rotate(-3deg);}
	35%{top: 68px;transform:rotate(3deg);}
	40%{top: 68px;transform:rotate(0deg);}
	80%{top: 108px;}
}
.homeSection .mainSectionTxt1{width: 152px; height: 50px; left: 200px; top: 213px; position: absolute; background: url(../images/mainSectionTxt1.png);
	-webkit-animation-name: txt1Ani;
    -webkit-animation-duration: 4000ms;
    -webkit-animation-iteration-count: infinite;
}
@-webkit-keyframes txt1Ani{
    25%{left: 210px;transform:rotate(3deg);}
    50%{left: 200px;transform:rotate(0deg);}
    75%{left: 210px;transform:rotate(3deg);}
    100%{left: 200px;transform:rotate(0deg);}

}
.homeSection .mainSectionTxt2{width: 248px; height: 77px; left: 90px; top: 148px; position: absolute; background: url(../images/mainSectionTxt2.png);
	-webkit-animation-name: txt2Ani;
    -webkit-animation-duration: 2000ms;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: step-start;
}
@-webkit-keyframes txt2Ani{
    50%{background-position-y: 0px;}
    100%{background-position-y: -77px;}
}
.btnArraw{width: 113px;height: 36px; left: 26px; top: 20px; position: absolute; background: url(../images/btnArraw.png);
	-webkit-animation-name: btnArrAni;
    -webkit-animation-duration: 4000ms;
    -webkit-animation-iteration-count: infinite;
}
@-webkit-keyframes btnArrAni{
    5%{left: 32px;}
    10%{left: 26px;}
    15%{left: 32px;}
    20%{left: 26px;}
}
.snowLayer{position: absolute;}
.snow{ width: 85px; height: 94px; position: absolute; top:-100px; background: url(../images/snow.png);}

.st01Section{background: url(../images/st01SectionBg.jpg) bottom center no-repeat #2A2750;}

.st01Section .st01DeerHead{width: 95px;height: 110px; position: absolute; left: 97px; bottom: 336px; background: url(../images/st01DeerHead.png); -webkit-animation: Mo2Ani 2000ms infinite;}
.st01Section .st01SantaHead{width: 99px;height: 134px; position: absolute; left: 176px; bottom: 319px; background: url(../images/st01SantaHead.png); -webkit-animation: Mo2Ani 2000ms infinite;}
.st01Section .st01SantaHand{width: 325px;height: 157px; position: absolute; left: 14px; bottom: 246px; background: url(../images/st01SantaHand.png); -webkit-animation: st1SantaHandAni 2000ms infinite;}
@-webkit-keyframes st1SantaHandAni{
    0%{transform:rotate(-3deg);}
    50%{transform:rotate(3deg);}
    100%{transform:rotate(-3deg);}
}
.st01Section .st01SectionTxt{width: 308px; height: 131px; position: absolute;left: 54px; top: 64px; background: url(../images/st1SectionTxt.png);}
.st01Section .st01SectionTxt1{width: 278px; height: 71px; position: absolute; left: 72px; top: 105px; background: url(../images/st1SectionTxt1.png); -webkit-animation: st1txt1Ani 2000ms infinite step-start;}
@-webkit-keyframes st1txt1Ani{
    50%{background-position-y: 0px;}
    100%{background-position-y: -71px;}
}
.st01Section .st01SectionTxt2{width: 152px;height: 28px; position: absolute;left:145px; top: 187px; background: url(../images/st1SectionTxt2.png); -webkit-animation: sec01txt2Ani 4000ms infinite;}
@-webkit-keyframes sec01txt2Ani{
    25%{left: 151px;transform:rotate(3deg);}
    50%{left: 145px;transform:rotate(0deg);}
    75%{left: 151px;transform:rotate(3deg);}
    100%{left: 145px;transform:rotate(0deg);}
}

.st02Section{background: url(../images/st02SectionBg.jpg) bottom center no-repeat #2A2750;}
.st02Section .st02Table{ width: 275px;height: 275px; position: absolute; left:95px ; bottom: 71px; background: url(../images/st02Table.png);}
.st02Section .st02Table .cafeDeerHead{ width: 249px;height: 207px;position: absolute; left: -72px; top: 0px; background: url(../images/cafeDeerHead.png) no-repeat;  -webkit-animation: cafeDeerHeadAni 2000ms infinite;}
@-webkit-keyframes cafeDeerHeadAni{
    0%{transform:rotate(-3deg);}
    50%{transform:rotate(3deg);}
    100%{transform:rotate(-3deg);}
}
.st02Section .st02Table .cafeSantaHead{width: 106px;height: 120px; position: absolute; right: 50px; top: -64px; background: url(../images/cafeSantaHead.png);-webkit-animation: cafeDeerHeadAni 2000ms infinite;}
.st02Section .cafeSmokeBox1{width: 58px; height: 63px; position: absolute; left: 162px; bottom: 241px;}
.st02Section .cafeSmokeBox2{width: 58px; height: 63px; position: absolute; left: 217px; bottom: 272px;}

.cafeSmok1{width: 58px; height: 63px; position: absolute; background: url(../images/cafeSmoke.png);}
.cafeSmok2{width: 58px; height: 63px; position: absolute; background: url(../images/cafeSmoke.png);}
.cafeSmokeBox1 .cafeSmok1{ opacity: 0; background-position-x:-58px ; -webkit-animation: smoke2Ani 2200ms infinite;}
.cafeSmokeBox1 .cafeSmok2{ -webkit-animation: smoke1Ani 2200ms infinite;}
.cafeSmokeBox2 .cafeSmok1{ opacity: 1; background-position-x:-58px ; -webkit-animation: smoke1Ani 3200ms infinite;}
.cafeSmokeBox2 .cafeSmok2{ opacity: 0;  -webkit-animation: smoke2Ani 3200ms infinite;}
.st02Section .st02SectionTxt{width: 309px; height: 132px; position: absolute;left: 54px; top: 64px; background: url(../images/st02SectionTxt.png);}
.st02Section .st02SectionTxt1{width: 285px; height: 70px; position: absolute; left: 11px; top: 41px; background: url(../images/st02SectionTxt1.png); -webkit-animation: st1txt1Ani 2000ms infinite step-start;}
@-webkit-keyframes st1txt1Ani{
    50%{background-position-y: 0px;}
    100%{background-position-y: -70px;}
}
.st02Section .st02SectionTxt2{width: 107px;height: 41px; position: absolute;left:229px; top: 209px; background: url(../images/st02SectionTxt2.png); -webkit-animation: sec02txt2Ani 4000ms infinite;}
@-webkit-keyframes sec02txt2Ani{
    25%{left: 249px;transform:rotate(3deg);}
    50%{left: 229px;transform:rotate(0deg);}
    75%{left: 249px;transform:rotate(3deg);}
    100%{left: 229px;transform:rotate(0deg);}
}

.st03Section{background: url(../images/st03SectionBg.jpg) top center no-repeat #FFF;}
.st03Section .st03SectionTxt{width: 309px; height: 132px; position: absolute;left: 54px; top: 64px; background: url(../images/st03SectionTxt.png);}
.st03Section .snowMan{width: 47px;height: 112px; position: absolute; top: 383px; left: 97px; background: url(../images/snowMan.png) no-repeat;-webkit-animation: snowManInCarAni 2000ms infinite;}
@-webkit-keyframes snowManInCarAni{
    0%{transform:rotate(-5deg);}
    50%{transform:rotate(5deg);}
    100%{transform:rotate(-5deg);}
}
.st03Section .deerIncar{width: 43px;height: 56px;position: absolute;left: 131px;top: 393px;background: url(../images/deerBodyInCar.png);}
.st03Section .deerIncar .deerHeadInCar{width: 80px;height: 87px; position: absolute;left: -15px; top: -74px; background: url(../images/deerHeadInCar.png); -webkit-animation: Mo2Ani 2000ms infinite;}
.st03Section .santaIncar{width: 105px;height: 114px;position: absolute;left: 191px;top: 371px;background: url(../images/santaInCar.png);}
.st03Section .santaIncar .santaHeadInCar{width: 66px;height: 94px; position: absolute;left: 30px; top: -50px; background: url(../images/santaHeadInCar.png); -webkit-animation: Mo2Ani 2000ms infinite;}
.carBorder{width:317px;height:324px; position: absolute; top: 297px;left: 36px;  background: url(../images/carBorder.png);}
.santaArmBox{width: 174px;height: 100px; position: absolute; top: 50%; right: 47px; margin-top: 17px; z-index: -1;}
.st03Section .santaArm{position: absolute;width: 174px;height: 100px; left:2px; top:-25px;background: url(../images/santaArm.png);
	-webkit-animation-name: ArmAni;
    -webkit-animation-duration: 2000ms;
    -webkit-animation-iteration-count: infinite;
    /* -webkit-animation-timing-function: step-start; */
}
@-webkit-keyframes ArmAni{
    0%{transform:rotate(-10deg);}
    50%{transform:rotate(10deg);}
    100%{transform:rotate(-10deg);}
}
.st03Section .st03SectionTxt1{width: 276px; height: 72px; left: 73px; top: 104px; position: absolute; background: url(../images/st03SectionTxt1.png);
	-webkit-animation-name: txt21Ani;
    -webkit-animation-duration: 2000ms;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: step-start;
}
@-webkit-keyframes txt21Ani{
    50%{background-position-y: 0px;}
    100%{background-position-y: -72px;}
}
.st03Section .st03SectionTxt2{width: 151px;height: 47px; position: absolute;left:125px; top: 244px; background: url(../images/sec03SectionTxt2.png); -webkit-animation: sec03txt2Ani 4000ms infinite;}

@-webkit-keyframes sec03txt2Ani{
    25%{left: 145px;transform:rotate(3deg);}
    50%{left: 125px;transform:rotate(0deg);}
    75%{left: 145px;transform:rotate(3deg);}
    100%{left: 125px;transform:rotate(0deg);}
}
.st03Section .ballbox{width: 228px; height: 236px; position: absolute; top: 175px; left: 15px;}
@-webkit-keyframes ballBoxAni{
    0%{margin-top: -146px;transform:rotate(0deg);}
    50%{margin-top: -136px;transform:rotate(0deg);}
    100%{margin-top: -146px;transform:rotate(0deg);}
}
.st03Section .ball{width: 228px; height: 236px; position: absolute;  background: url(../images/ball.png);
	-webkit-animation-name: ballFlashAni;
    -webkit-animation-duration: 2000ms;
    -webkit-animation-iteration-count: infinite;
}
.st03Section .ball1_1{width: 228px; height: 236px; position: absolute;  background: url(../images/ball.png); background-position-x: -228px;opacity: 0;
	-webkit-animation-name: ballFlashAni2;
    -webkit-animation-duration: 2000ms;
    -webkit-animation-iteration-count: infinite;
}


.treeSection{background: url(../images/treeSectionBg.jpg) bottom center no-repeat #120D24;}
.treeSection .smokeBox{width: 68px;height: 152px; position: absolute; left: 44px; bottom: 336px;}
.treeSection .smoke1{width: 68px;height: 152px; position: absolute; background: url(../images/smoke.png); -webkit-animation: smoke1Ani 1200ms infinite;}
.treeSection .smoke2{width: 68px;height: 152px; position: absolute; background: url(../images/smoke.png); background-position-x:-68px ; opacity: 0; -webkit-animation: smoke2Ani 1200ms infinite;}
@-webkit-keyframes smoke1Ani{
	0%{opacity: 1;}
    50%{opacity: 0;}
    100%{opacity: 1;}
}
@-webkit-keyframes smoke2Ani{
	0%{opacity: 0;}
    50%{opacity: 1;}
    100%{opacity: 0;}
}
.treeSection .ball2box{width: 269px; height: 335px; position: absolute; left: 93px; bottom: 204px;}
.treeSection .ball2{width: 269px; height: 335px; position: absolute; background:url(../images/ball2.png);
	-webkit-animation-name: ballFlashAni;
    -webkit-animation-duration: 2000ms;
    -webkit-animation-iteration-count: infinite;
}
@-webkit-keyframes ballFlashAni{
    50%{opacity: 0;}
    100%{opacity: 1;}
}
.treeSection .ball2_1{width: 269px; height: 335px; position: absolute; background:url(../images/ball2.png);background-position-x: -269px;opacity: 0;
	-webkit-animation-name: ballFlashAni2;
    -webkit-animation-duration: 2000ms;
    -webkit-animation-iteration-count: infinite;
}
@-webkit-keyframes ballFlashAni2{
    50%{opacity: 1;}
    100%{opacity: 0;}
}
.santaShadow{width: 247px;height: 142px; position:absolute; bottom: 0; right: 10px; background: url(../images/santaShadow.png);z-index: 2100;}
.santaPhoto{width: 245px;height: 158px; position:absolute; bottom: 0; right: 0; background: url(../images/santaPhoto.png);z-index: 2100;}
.santaPhotoRay{width: 245px;height: 158px; position: absolute; bottom: 0; right: 0; background: url(../images/santaPhotoRay.png);opacity: 0;
	-webkit-animation: photoRayAni 3000ms infinite;6ufg
}
@-webkit-keyframes photoRayAni{
    0%{opacity: 1;}
    5%{opacity: 1;}
    30%{opacity: 0;}
}
.treeSectionTxt{width: 168px;height: 99px; position: absolute;top: 65px; background: url(../images/treeSectionTxt.png);}
.treeSectionTxt1{width: 143px; height: 78px; left: 5px; top: 12px; position: absolute; background: url(../images/treeSectionTxt1.png);
	-webkit-animation-name: txtTreeAni;
    -webkit-animation-duration: 2000ms;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: step-start;
}
@-webkit-keyframes txtTreeAni{
    50%{background-position-y: 0px;}
    100%{background-position-y: -78px;}
}
.treeSection .treeSectionTxt2{width: 106px; height: 52px; right: 17px; top: 219px; position: absolute; background: url(../images/treeSectionTxt2.png);
	-webkit-animation-name: txtTree2Ani;
    -webkit-animation-duration: 2000ms;
    -webkit-animation-iteration-count: infinite;
}
@-webkit-keyframes txtTree2Ani{
    5%{right: 20px; top: 222px;transform:rotate(0deg);}
    10%{right: 17px; top: 219px;transform:rotate(0deg);}
    15%{right: 20px; top: 222px;transform:rotate(0deg);}
    20%{right: 17px; top: 219px;transform:rotate(0deg);}
}
.treeSection .btn1{ width: 76px;height: 71px;position: absolute; left: 145px; bottom: 456px; background:url(../images/btn1.png);
-webkit-animation: btnrollAni2 1000ms infinite;
}
.treeSection .btn2{ width: 77px;height: 84px;position: absolute; left: 149px; bottom: 375px; background:url(../images/btn2.png);
-webkit-animation: btnrollAni 1000ms infinite;
}
.treeSection .btn3{ width: 71px;height: 72px;position: absolute; left: 219px; bottom: 334px; background:url(../images/btn3.png);
-webkit-animation: btnrollAni2 1000ms infinite;
}
.treeSection .btn4{ width: 72px;height: 76px;position: absolute; left: 107px; bottom: 295px; background:url(../images/btn4.png);
-webkit-animation: btnrollAni 1000ms infinite;
}
.treeSection .btn5{ width: 66px;height: 68px;position: absolute; left: 144px; bottom: 223px; background:url(../images/btn5.png);
-webkit-animation: btnrollAni2 1000ms infinite;
}
.treeSection .btn6{ width: 76px;height: 72px;position: absolute; left: 269px; bottom: 171px; background:url(../images/btn7.png);
-webkit-animation: btnrollAni 1000ms infinite;
}
.treeSection .btn7{ width: 75px;height: 79px;position: absolute; left: 122px; bottom: 140px; background:url(../images/btn8.png);
-webkit-animation: btnrollAni2 1000ms infinite;
}

@-webkit-keyframes btnrollAni{
	0%{transform:rotate(-20deg);}
    50%{transform:rotate(20deg);}
    100%{transform:rotate(-20deg);}
}
@-webkit-keyframes btnrollAni2{
	0%{transform:rotate(20deg);}
    50%{transform:rotate(-20deg);}
    100%{transform:rotate(20deg);}
}



/* popup */
.popbox{position: absolute;}
.md-modal {
	position: fixed;
	width: 100%;height: 100%; 
	z-index: 2000;
	visibility: hidden;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;

}

.md-show {
	visibility: visible;
}

.md-overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	visibility: hidden;
	top: 0;
	left: 0;
	z-index: 1000;
	opacity: 0;
	background: rgba(158,17,27,0.8);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show ~ .md-overlay {
	opacity: 1;
	visibility: visible;
}

/* Content styles */
.md-content {
	color: #fff;
	background: #e74c3c;
	border-radius: 3px;
	margin: 0 auto;
	position: absolute;
	
}
.md-content h3 {
	margin: 0;
	padding: 0.4em;
	text-align: center;
	font-size: 1em;
	color: #000;
}
.md-content p {
color: #000;
}
.md-effect-3 .md-content {
	top:50%;
	left: 40px;
	opacity: 0;
	-webkit-transition: all 0.3s;
	margin-top: 0px;
}
.md-show.md-effect-3 .md-content {
	margin-top: -220px;
	opacity: 1;
}
.popup{width: 334px; height: 425px; background:url(../images/popBg.png);padding-top: 30px;}
.popup .md-close{ width: 53px; height: 55px; position: absolute; display: block; right: 2px; top:-56px; background:url(../images/popClose.png);}


.swiper-wrapper {
    -webkit-perspective: 1200px;
    -moz-perspective: 1200px;
    -ms-perspective: 1200px;
    perspective: 1200px;
}
.swiper-slide {
    position: relative;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
   background-size:100% auto;
   overflow:hidden;
   text-align:center;
}
.swiper-slide img{
	max-width:100%;
}


.modalImg img{padding-top: 20px;}