body,dl,dd,h1,h2,h3,h4,h5,h6,p,span{margin:0;padding:0px;}
body{font:12px/1.5 tahoma,simsun,Microsoft YaHei,sans-serif;color:#1a5e77;-webkit-tap-highlight-color: rgba(0,0,0,0)}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
img{border: none;padding: 0;margin:0;}
em,i,b{font-style:normal}
ul,ol{list-style:none;margin:0;padding:0;}
a{text-decoration:none}
a:hover{text-decoration:none}
table{border-collapse:collapse;border-spacing:0}
input,select,option{outline:none}
body{background-color: #33343b;}
.main img{ display: none;}
.sec1-show .sec1 img,
.sec2-show .sec2 img,
.sec3-show .sec3 img,
.sec4-show .sec4 img,
.sec5-show .sec5 img,
.sec6-show .sec6 img,
.sec7-show .sec7 img,
.sec8-show .sec8 img,
.sec9-show .sec9 img{ display:block;}
.wrap{width: 100%;height:100%;overflow: hidden;}
.content{width: 100%;height:100%;position: relative;}
.main{width: 100%;-webkit-transition:all 0.3s linear;-webkit-transform:translateY(0px);transition:all 0.3s linear;transform:translateY(0px);-webkit-backface-visibility:hidden; height: 100%; position: relative;}
.sec{ width: 100%; height: 100%; margin: 0 auto; position: relative;}
.sec a img{ position: relative; display: block; width: 100%;}
.next{ position:absolute;left: 46.9%; bottom: 3.6%; z-index: 100;}
.sec1{ background: url(../images/page1_bg_02.jpg) no-repeat; background-size: 100% 100%;}
.sec2{ background: url(../images/page2_bg_02.jpg) no-repeat; background-size: 100% 100%;}
.sec3{ background:url(../images/page3_bg_02.jpg) no-repeat; background-size: 100% 100%;}
.sec4{ background:url(../images/page4_bg_02.jpg) no-repeat #a782f9; background-size: 100% 100%;}
.sec5{ background:url(../images/page5_bg_02.jpg) no-repeat #fb5e64; background-size: 100% 100%;}
.sec6{ background: url(../images/page6_bg_02.jpg) no-repeat #34c3fa; background-size: 100% 100%;}
.sec7{ background: url(../images/page7_bg_02.jpg) no-repeat #34c3fa; background-size: 100% 100%;}
.sec8{ background: url(../images/page8_bg_02.jpg) no-repeat #34c3fa; background-size: 100% 100%;}
.sec9{ background: url(../images/page9_bg_02.jpg) no-repeat #34c3fa; background-size: 100% 100%;}
.more{ top: 2.3%; right: 5.8%; width: 15.3%;}
.p1-box1{position: absolute;
    width:70.15%;
    background-size: 100% 100%;
    padding-bottom:135%;
    overflow: hidden;
    left:15.15%;
    top:19.58%;
    z-index: 10;}
.p2-box1{
    background-size: 100% 100%;
    overflow: hidden;
    position: absolute;
    width:78.90%;
    top:0%;
    left:8.59%;
    z-index: 10;height:auto;padding-bottom:80%;
}
.p3-box1{
    background-size: 100% 100%;
    overflow: hidden;
    position: absolute;
    width:82.5%;
    top:37.58%;
    left:8.28%;
    z-index: 10;height:auto;
}
.p4-box1{
    background-size: 100% 100%;
    overflow: hidden;
    position: absolute;
    width:100%;
    top:12.58%;
    left:0%;
    z-index: 10;height:auto;padding-bottom:80%;
}
.p6-box1{
    background-size: 100% 100%;
    overflow: hidden;
    position: absolute;
    width:89.37%;
    top:11.58%;
    left:10.62%;
    z-index: 10;height:auto;padding-bottom:80%;
}
.p7-box1{
    background-size: 100% 100%;
    overflow: hidden;
    position: absolute;
    width:72.65%;
    top:10.58%;
    left:9.37%;
    z-index: 10;height:auto;padding-bottom:80%;
}
.p8-box1{
    background-size: 100% 100%;
    overflow: hidden;
    position: absolute; padding-bottom:125%;
    width:85.93%;
    top:0%;
    left:7.5%;
    z-index: 10;height:auto;
}
.p9-box1{
    background-size: 100% 100%;
    overflow: hidden;
    position: absolute; padding-bottom:125%;
    width:73.43%;
   top:10.58%;
    left:13.28%;
    z-index: 10;height:auto;
}
.p10-box1{
    background-size: 100% 100%;
    overflow: hidden;
    position: absolute;
    width:90.93%;
   top:10.58%;
    left:9.21%;
    z-index: 10;height:auto;
}
/* section1 */
.p1-logo1{ margin:0;}
/* section2 */
.p2-border1{ margin:17% 0 0 0;}
.p2-pic1{margin:4.82% 0 0 0%;}
.p2-pic2{margin:2% 0 0 0%;}
/* section3 */
.p3-border1{ margin:0;}
.p3-pic1{margin:3.28% 0 0 0%;}

/* section4 */
.p4-border1{ margin:0 0 0 19.84%;}
.p4-pic1{margin:4% 0 0 19.84%;}
.p4-pic2{margin:2% 0 0 19.84%;}
/* section5 */
.p6-border1{ margin:0;}
.p6-pic1{margin:3.27% 0 0 0%;}
/* section6 */
.p7-border1{margin:0;}
.p7-pic0{margin:4.37% 0 0 0%;}
.p7-pic2{margin:5.5% 0 0 0%;}
/* section7 */
.p8-border1{margin:20% 0 0 0;}
.p8-pic1{margin:4.37% 0 0 0%;}
.p8-pic2{margin:4.5% 0 0 0%;}
/* section8 */
.p9-border1{margin:0% 0 0 0;}
.p9-pic1{margin:4.0% 0 0 24.68%;}
.p9-pic2{margin:1.2% 0 0 24.68%;}
.p9-box1 .p9-link{ position:absolute; left:24.68%; top:26.5%; width:50%; height:5%;}
/* section9 */
.p10-border1{margin:0% 0 0 0;}
.p10-pic1{margin:4.0% 0 0 0%;}
.p10-pic2{margin:80% 0 0 0%; opacity:0;}
.p10-pic3{margin:2.5% 0 0 0%;opacity:0;}
.p10-box1 .p10-link{ position:absolute; left:0%; top:73%; width:100%; height:15%; z-index:20;}
.p10-box1 .p10-link1{ position:absolute; left:0%; top:88%; width:100%; height:15%;z-index:20; }
.p10-box1 .p10-link2{ position:absolute; left:0%; top:0%; width:25.80%; height:5%;z-index:20; }
/* anim */
.pt-page-moveIcondown {
    -webkit-animation: moveIcondown ease 1.5s both infinite;
    animation: moveIcondown ease 1.5s both infinite;
}
@-webkit-keyframes moveIcondown {
    0% { -webkit-transform: translateY(-100%); opacity:0;}
    50% { -webkit-transform: translateY(0%); opacity:1;}
    100% { -webkit-transform: translateY(100%); opacity:0;}
}
@keyframes moveIcondown {
    0% { -webkit-transform: translateY(-100%); transform: translateY(100%); opacity:0;}
    50% { -webkit-transform: translateY(0%); transform: translateY(0%); opacity:1;}
    100% { -webkit-transform: translateY(100%); transform: translateY(-100%); opacity:0;}
}
.pt-page-moveIconUp {
	-webkit-animation: moveIconUp ease 1.5s both infinite;
	animation: moveToBottom ease 1.5s both infinite;
}
@-webkit-keyframes moveIconUp {
	0% { -webkit-transform: translateY(100%); opacity:0;}
	50% { -webkit-transform: translateY(0%); opacity:1;}
	100% { -webkit-transform: translateY(-100%); opacity:0;}
}
.rubberBand {
  -webkit-animation:moveFromsoso 1.5s ease both;
    -moz-animation:moveFromsoso 1.5s ease both;
}
@-webkit-keyframes moveFromsoso {
	from { -webkit-transform: translateY(100%) scale(0); opacity:0;}
	to{-webkit-transform: translateY(0) scale(1);opacity:1;}
}
/* anim end*/
.sec2-show .fadein-up1 {
  -webkit-animation:moveFromsoso1 1.2s ease both;
    -moz-animation:moveFromsoso1 1.2s ease both;
}
@-webkit-keyframes moveFromsoso1 {
	0% { -webkit-transform: translateY(-100%) scale(1); opacity:0;}
	 70%,90%{ -webkit-transform: translateY(-10%) scale(1); opacity:1;}
	60%,80%,100%{-webkit-transform: translateY(0) scale(1);opacity:1;}
}
	
.sec2-show .scale-show1{-webkit-animation:fadeInshow .8s 1s ease both;
    -moz-animation:fadeInshow .8s 1s ease both;}
.sec2-show .scale-show2{-webkit-animation:fadeInshow .8s 1.6s ease both;
    -moz-animation:fadeInshow .8s 1.6s ease both;}
	@-webkit-keyframes fadeInshow{
   0%{opacity:0;-webkit-transform:scale(1);}
    100%{opacity:1;-webkit-transform:scale(1);}
}	
.sec3-show .fadein-up1{-webkit-animation:moveFromsole .8s ease both;
    -moz-animation:moveFromsole .8s ease both;}
@-webkit-keyframes moveFromsole {
	0%% { -webkit-transform:scale(0);opacity:0;}
	15%,75% { -webkit-transform: scale(0.5);opacity:0.5;}
	30%,60% { -webkit-transform: scale(0.8);opacity:0.8;}
	45%,100% { -webkit-transform:scale(1);opacity:1;}
}
.sec3-show .scale-show1{-webkit-animation:moveFromsoline .8s .7s ease both;
    -moz-animation:moveFromsoline .8s .7s ease both;}
@-webkit-keyframes moveFromsoline {
	from { -webkit-transform: translateY(-100%) scale(1,0.0001); opacity:0;}
	to{-webkit-transform: translateY(0) scale(1,1);opacity:1;}
}
.sec4-show .fadein-up1{-webkit-animation:moveFromup .8s ease both;
    -moz-animation:moveFromup .8s ease both;}
@-webkit-keyframes moveFromup {
	from { -webkit-transform: translateY(100%);opacity:0; }
	to{-webkit-transform: translateY(0); opacity:1;}
}
.sec4-show .scale-show1{-webkit-animation:moveFromsoli1 .8s .7s ease both;
    -moz-animation:moveFromsoli1 .8s .7s ease both;}
@-webkit-keyframes moveFromsoli1 {
	from { -webkit-transform: translate(100%,100%); opacity:0;}
	to{-webkit-transform: translate(0);opacity:1;}
}		
.sec4-show .scale-show2{-webkit-animation:moveFromsoli .8s 1.4s ease both;
    -moz-animation:moveFromsoli .8s 1.4s ease both;}
@-webkit-keyframes moveFromsoli {
	from { -webkit-transform: translate(-100%,-100%);opacity:0;}
	to{-webkit-transform: translate(0);opacity:1;}
}
.sec5-show .fadein-up1{-webkit-animation:moveFromright .8s ease both;
    -moz-animation:moveFromright .8s ease both;}
	
@-webkit-keyframes moveFromright {
	from { -webkit-transform: translateX(100%);opacity:0; }
	to{-webkit-transform: translateX(0); opacity:1;}
}	
.sec5-show .scale-shows{-webkit-animation:moveFromsoline1 1.2s .8s ease both;
    -moz-animation:moveFromsoline1 1.2s .8s ease both;}
@-webkit-keyframes moveFromsoline1 {
	from { -webkit-transform: translateY(100%) scale(1,0.0001); opacity:0;}
	to{-webkit-transform: translateY(0) scale(1,1);opacity:1;}
}
	
	
/*	
@-webkit-keyframes moveFromsoright {
	from { -webkit-transform: translateX(100%) scale(0.0001,1); opacity:0;}
	to{-webkit-transform: translateX(0) scale(1,1);opacity:1;}
}	
@-webkit-keyframes moveFromsoleft {
	from { -webkit-transform: translateX(-100%) scale(0.0001,1); opacity:0;}
	to{-webkit-transform: translateX(0) scale(1,1);opacity:1;}
}
@-webkit-keyframes moveFrombig {
	 0%{opacity:0;-webkit-transform:scale(0.3);
        }
		70%{opacity:1;-webkit-transform:scale(1.2);
        }
    100%{opacity:1;-webkit-transform:scale(1);
        }
}		


	
	@-webkit-keyframes fadeInline{
   0%{opacity:1;-webkit-transform:scale(0.0001,1);}
    100%{opacity:1;-webkit-transform:scale(1,1);}
}

*/



.sec6-show .fadein-up1{-webkit-animation:moveFromsorig .8s ease both;
    -moz-animation:moveFromsorig .8s ease both;}
@-webkit-keyframes moveFromsorig {
	from { -webkit-transform:scale(0); opacity:0;}
	to{-webkit-transform:scale(1);opacity:1;}
}	
.sec6-show .scale-show1{-webkit-animation:moveFromright .8s .7s ease both;
    -moz-animation:moveFromright .8s .7s ease both;}

.sec6-show .scale-show2{-webkit-animation:moveFromleft .8s 1.4s ease both;
    -moz-animation:moveFromleft .8s 1.4s ease both;}		
@-webkit-keyframes moveFromleft {
	from { -webkit-transform: translateX(-100%);opacity:0; }
	to{-webkit-transform: translateX(0); opacity:1;}
}
.sec7-show .fadein-up1{-webkit-animation:moveFromdown .8s ease both;
    -moz-animation:moveFromdown .8s ease both;}
@-webkit-keyframes moveFromdown {
	from { -webkit-transform: translateY(-100%);opacity:0; }
	to{-webkit-transform: translateY(0); opacity:1;}
}
.sec7-show .scale-show1{-webkit-animation:moveFromup .8s .7s ease both;
    -moz-animation:moveFromup .8s .7s ease both;}

.sec7-show .scale-show2{-webkit-animation:moveFromup .8s 1.4s ease both;
    -moz-animation:moveFromup .8s 1.4s ease both;}
.sec8-show .fadein-up1{-webkit-animation:fadeInline1 .8s ease both;
    -moz-animation:fadeInline1 .8s ease both;}	
@-webkit-keyframes fadeInline1{
   0%{opacity:1;-webkit-transform:scale(0.0001,1);}
    100%{opacity:1;-webkit-transform:scale(1,1);}
}
.sec8-show .scale-show1{
  -webkit-animation:rubberBand 1.5s .8s ease both;
    -moz-animation:rubberBand 1.5s .8s ease both;
}
@-webkit-keyframes rubberBand {
  0% {
  	-webkit-opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  30% {
    -webkit-transform: scaleX(1.25) scaleY(0.75);
    transform: scaleX(1.25) scaleY(0.75);
  }

  40% {
    -webkit-transform: scaleX(0.75) scaleY(1.25);
    transform: scaleX(0.75) scaleY(1.25);
  }

  60% {
    -webkit-transform: scaleX(1.15) scaleY(0.85);
    transform: scaleX(1.15) scaleY(0.85);
  }

  100% {
  	-webkit-opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.sec8-show .scale-show2{-webkit-animation:fadeInshow .8s 1.4s ease both;
    -moz-animation:fadeInshow .8s 1.4s ease both;}	
.sec9-show .fadein-up1{-webkit-animation:moveFromdown .8s ease both;
    -moz-animation:moveFromdown .8s ease both;}	
.sec9-show .scale-show1{-webkit-animation:moveFromsmal .8s .7s ease both;
    -moz-animation:moveFromsmal .8s .7s ease both;}	
@-webkit-keyframes moveFromsmal {
	 0%{opacity:1;-webkit-transform:scale(0.5);
        }	
   
		100%{opacity:1;-webkit-transform:scale(1);
        }
}		
.scale {
	-webkit-animation: moveFromsmall ease 1.5s 1.1s both infinite;
	animation: moveFromsmall ease 1.5s both 1.1s infinite;
}
.scale1 {
	-webkit-animation: moveFromsmall ease 1.5s 1.5s both infinite;
	animation: moveFromsmall ease 1.5s both 1.5s infinite;
}
@-webkit-keyframes moveFromsmall {
	 0%,100%{opacity:0.2;-webkit-transform:scale(1);
        }
	 20%,80%{opacity:0.4;-webkit-transform:scale(1);
        }	
	 40%,70%{opacity:0.6;-webkit-transform:scale(1);
        }		
    50%{opacity:0.8;-webkit-transform:scale(1);
        }
}

/*loading*/
.mui-act-loading{
    width:100%;
    height: 100%;
}
.mui-act-loading .load-mask{
    width: 100%;
    height: 100%;
    background: #000000;
    opacity: 0.8;
}
.loading{
    width: 12px;
    height: 12px;
    position: fixed;
    left: 50%;
    top: 50%;
    z-index: 100;
    margin: -6px 0 0 -6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    overflow: hidden;
    -webkit-animation: loading 1.1s ease infinite;
    animation: loading 1.1s ease infinite;
}
.u-audio {
	position: absolute;
	bottom:8%;
	left:6.0%;
	width:8.43%;
	height:5.24%;
	z-index: 200;
}
/*loading animate*/
@-webkit-keyframes loading{
    0%,100%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,0.1),
        0 24px 0 rgba(218,218,218,0.25),
        -17px 17px 0 rgba(218,218,218,0.3),
        -24px 0 0 rgba(218,218,218,0.4),
        -17px -17px 0 rgba(218,218,218,0.5),
        0 -24px 0 rgba(218,218,218,0.6),
        17px -17px 0 rgba(218,218,218,0.7),
        24px 0 0 rgba(218,218,218,1);
    }
    12.5%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,1),
        0 24px 0 rgba(218,218,218,0.1),
        -17px 17px 0 rgba(218,218,218,0.25),
        -24px 0 0 rgba(218,218,218,0.3),
        -17px -17px 0 rgba(218,218,218,0.4),
        0 -24px 0 rgba(218,218,218,0.5),
        17px -17px 0 rgba(218,218,218,0.6),
        24px 0 0 rgba(218,218,218,0.8);
    }
    25%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,0.7),
        0 24px 0 rgba(218,218,218,1),
        -17px 17px 0 rgba(218,218,218,0.1),
        -24px 0 0 rgba(218,218,218,0.25),
        -17px -17px 0 rgba(218,218,218,0.3),
        0 -24px 0 rgba(218,218,218,0.4),
        17px -17px 0 rgba(218,218,218,0.5),
        24px 0 0 rgba(218,218,218,0.7);
    }
    37.5%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,0.6),
        0 24px 0 rgba(218,218,218,0.7),
        -17px 17px 0 rgba(218,218,218,1),
        -24px 0 0 rgba(218,218,218,0.1),
        -17px -17px 0 rgba(218,218,218,0.25),
        0 -24px 0 rgba(218,218,218,0.3),
        17px -17px 0 rgba(218,218,218,0.4),
        24px 0 0 rgba(218,218,218,0.6);
    }
    50%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,0.5),
        0 24px 0 rgba(218,218,218,0.6),
        -17px 17px 0 rgba(218,218,218,0.7),
        -24px 0 0 rgba(218,218,218,1),
        -17px -17px 0 rgba(218,218,218,0.1),
        0 -24px 0 rgba(218,218,218,0.25),
        17px -17px 0 rgba(218,218,218,0.3),
        24px 0 0 rgba(218,218,218,0.5);
    }
    62.5%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,0.4),
        0 24px 0 rgba(218,218,218,0.5),
        -17px 17px 0 rgba(218,218,218,0.6),
        -24px 0 0 rgba(218,218,218,0.7),
        -17px -17px 0 rgba(218,218,218,1),
        0 -24px 0 rgba(218,218,218,0.1),
        17px -17px 0 rgba(218,218,218,0.25),
        24px 0 0 rgba(218,218,218,0.4);
    }
    75%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,0.3),
        0 24px 0 rgba(218,218,218,0.4),
        -17px 17px 0 rgba(218,218,218,0.5),
        -24px 0 0 rgba(218,218,218,0.6),
        -17px -17px 0 rgba(218,218,218,0.7),
        0 -24px 0 rgba(218,218,218,1),
        17px -17px 0 rgba(218,218,218,0.1),
        24px 0 0 rgba(218,218,218,0.3);
    }
    87.5%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,0.25),
        0 24px 0 rgba(218,218,218,0.3),
        -17px 17px 0 rgba(218,218,218,0.4),
        -24px 0 0 rgba(218,218,218,0.5),
        -17px -17px 0 rgba(218,218,218,0.6),
        0 -24px 0 rgba(218,218,218,0.7),
        17px -17px 0 rgba(218,218,218,1),
        24px 0 0 rgba(218,218,218,0.2);
    }
}
@keyframes loading{
    0%,100%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,0.1),
        0 24px 0 rgba(218,218,218,0.25),
        -17px 17px 0 rgba(218,218,218,0.3),
        -24px 0 0 rgba(218,218,218,0.4),
        -17px -17px 0 rgba(218,218,218,0.5),
        0 -24px 0 rgba(218,218,218,0.6),
        17px -17px 0 rgba(218,218,218,0.7),
        24px 0 0 rgba(218,218,218,1);
    }
    12.5%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,1),
        0 24px 0 rgba(218,218,218,0.1),
        -17px 17px 0 rgba(218,218,218,0.25),
        -24px 0 0 rgba(218,218,218,0.3),
        -17px -17px 0 rgba(218,218,218,0.4),
        0 -24px 0 rgba(218,218,218,0.5),
        17px -17px 0 rgba(218,218,218,0.6),
        24px 0 0 rgba(218,218,218,0.8);
    }
    25%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,0.7),
        0 24px 0 rgba(218,218,218,1),
        -17px 17px 0 rgba(218,218,218,0.1),
        -24px 0 0 rgba(218,218,218,0.25),
        -17px -17px 0 rgba(218,218,218,0.3),
        0 -24px 0 rgba(218,218,218,0.4),
        17px -17px 0 rgba(218,218,218,0.5),
        24px 0 0 rgba(218,218,218,0.7);
    }
    37.5%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,0.6),
        0 24px 0 rgba(218,218,218,0.7),
        -17px 17px 0 rgba(218,218,218,1),
        -24px 0 0 rgba(218,218,218,0.1),
        -17px -17px 0 rgba(218,218,218,0.25),
        0 -24px 0 rgba(218,218,218,0.3),
        17px -17px 0 rgba(218,218,218,0.4),
        24px 0 0 rgba(218,218,218,0.6);
    }
    50%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,0.5),
        0 24px 0 rgba(218,218,218,0.6),
        -17px 17px 0 rgba(218,218,218,0.7),
        -24px 0 0 rgba(218,218,218,1),
        -17px -17px 0 rgba(218,218,218,0.1),
        0 -24px 0 rgba(218,218,218,0.25),
        17px -17px 0 rgba(218,218,218,0.3),
        24px 0 0 rgba(218,218,218,0.5);
    }
    62.5%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,0.4),
        0 24px 0 rgba(218,218,218,0.5),
        -17px 17px 0 rgba(218,218,218,0.6),
        -24px 0 0 rgba(218,218,218,0.7),
        -17px -17px 0 rgba(218,218,218,1),
        0 -24px 0 rgba(218,218,218,0.1),
        17px -17px 0 rgba(218,218,218,0.25),
        24px 0 0 rgba(218,218,218,0.4);
    }
    75%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,0.3),
        0 24px 0 rgba(218,218,218,0.4),
        -17px 17px 0 rgba(218,218,218,0.5),
        -24px 0 0 rgba(218,218,218,0.6),
        -17px -17px 0 rgba(218,218,218,0.7),
        0 -24px 0 rgba(218,218,218,1),
        17px -17px 0 rgba(218,218,218,0.1),
        24px 0 0 rgba(218,218,218,0.3);
    }
    87.5%{
        box-shadow:
        17px 17px 0 rgba(218,218,218,0.25),
        0 24px 0 rgba(218,218,218,0.3),
        -17px 17px 0 rgba(218,218,218,0.4),
        -24px 0 0 rgba(218,218,218,0.5),
        -17px -17px 0 rgba(218,218,218,0.6),
        0 -24px 0 rgba(218,218,218,0.7),
        17px -17px 0 rgba(218,218,218,1),
        24px 0 0 rgba(218,218,218,0.2);
    }
}
.p2-border2{ width:32.67%; 
    position:absolute; top:43%; left:35.40%;  }
.p2-border3{ width:32.67%; height:5%; z-index:2; 
  position:absolute; top:43%; left:35.40%; }
.sec2-show .fadein0{-webkit-animation:fadein01 1s .9s ease both;}
  .p3-border2{ width:25.78%;position:absolute; top:41%; left:37.40%;  }
.p3-border3{ width:25.78%; height:5%; z-index:2; 
  position:absolute; top:41%; left:37.40%;  } 
   .p4-border2{ width:28.99%;position:absolute; top:47%; left:25%;  }
.p4-border3{ width:28.99%;height:5%; z-index:2; 
  position:absolute; top:47%; left:35%;  }  
   .p5-border2{ width:35.86%;position:absolute; top:39%; left:3%;  }
.p5-border3{ width:35.86%;height:5%; z-index:2; 
  position:absolute; top:39%; left:3%;  } 
     .p6-border2{ width:30%;position:absolute; top:34%; left:3%;  }
.p6-border3{ width:30%;height:5%; z-index:2; 
  position:absolute; top:34%; left:3%;  } 
.sec2-show .fadein0{-webkit-animation:fadein01 1s .9s ease both;}
.sec4-show .fadein0,.sec5-show .fadein0,.sec6-show .fadein0{-webkit-animation:fadein01 1s 1.2s ease both;}
.sec7-show .fadein0{-webkit-animation:fadein01 1s 1.5s ease both;}
  @-webkit-keyframes fadein01{
   0%{opacity:0;-webkit-transform: scale(0,0);}
    100%{opacity:1;-webkit-transform: scale(1,1);}
}