@charset "utf-8";
.section01, .section02, .section03, .section04, .section05, .section06 {
	background-color: rgb(34,34,34);
}
.sec-main {
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	position: relative;
	overflow: hidden;
	transform: scale(0.4);
	opacity: 0.5;
	transition: all 0.8s cubic-bezier(0.445, 0.145, 0.355, 1) 0s;
-webkit-transition: transition: all 0.8s cubic-bezier(0.445, 0.145, 0.355, 1) 0s;
}
.section.active .sec-main {
	transform: translate(0px, 0px) scale(1);
	transition: all 0.6s cubic-bezier(0.445, 0.145, 0.355, 1) 0s;
-webkit-transition: transition: all 0.6s cubic-bezier(0.445, 0.145, 0.355, 1) 0s;
	opacity: 1;
}
.section01 .sec-main {
   position:relative;
}

.section01 img{ position:absolute; height:100%; width:auto;}


.section02 .sec-main {
	background-image: url(../images/index02.jpg);
}
.section03 .sec-main {
	background-image: url(../images/index03.jpg);
}
.section04 .sec-main {
	background-image: url(../images/index04.jpg);
}
.section05 .sec-main {
	background-image: url(../images/index05.jpg);
}
.section06 .sec-main {
	background-image: url(../images/index06.jpg);
}
.section01 .sec-main {
	visibility: visible !important;
	-webkit-animation: scaleUpDown 6s forwards cubic-bezier(0.250, 0.460, 0.450, 0.940);
	animation: scaleUpDown 6s forwards cubic-bezier(0.250, 0.460, 0.450, 0.940);
	opacity: 1;
}
 @-webkit-keyframes scaleUpDown {
 from {
-webkit-transform: scale(1.08);
transform: scale(1.08);
}
 to {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
}
 @keyframes scaleUpDown {
 from {
-webkit-transform: scale(1.08);
transform: scale(1.08);
}
 to {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
}
.section01.active .sec-main {
	visibility: visible !important;
	-webkit-animation: scaleUpDown2 6s forwards cubic-bezier(0.250, 0.460, 0.450, 0.940);
	animation: scaleUpDown2 6s forwards cubic-bezier(0.250, 0.460, 0.450, 0.940);
}
 @-webkit-keyframes scaleUpDown2 {
 from {
-webkit-transform: scale(1.08);
transform: scale(1.08);
}
 to {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
}
 @keyframes scaleUpDown2 {
 from {
-webkit-transform: scale(1);
transform: scale(1);
}
 to {
opacity: 1;
-webkit-transform: scale(1.08);
transform: scale(1.08);
}
}
.section02 .sec-main {
	-webkit-transform: perspective(300px) rotateX(-50deg);
	transform: perspective(300px) rotateX(-50deg);
	-webkit-transform-origin: center top 0;
	transform-origin: center top 0;
	transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
	-webkit-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
}
.section02.active .sec-main {
	-webkit-transform: perspective(300px) rotateX(0deg);
	transform: perspective(300px) rotateX(0deg);
	-webkit-transform-origin: center top 0;
	transform-origin: center top 0;
}
.section06 .sec-main {
	-webkit-transform: scale(1);
	transform: scale(1);
}
.section05 .btn {
	display: block;
}
.section02 .pro{
	visibility: hidden;
	opacity: 0;
	-webkit-transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 480ms, -moz-transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 480ms;
	transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 480ms, -moz-transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 480ms;
}
.section h1, .section02 .pro-summary, .section02 .text h2, .section02 .text p, .section02 .pic, .section03 .text, .section04 .text, .section04 .store span {
	opacity: 0;
	transform: translate(0px, 50px);
	-webkit-transform: translate(0px, 50px);
*overflow: hidden;
}
.section.active h1{
	transition: 300ms ease 500ms;
	-webkit-transition: 300ms ease 500ms;
}
.section02.active .pro-summary, .section03 .text, .section04 .text{
	transition: 300ms ease 700ms;
	-webkit-transition: 300ms ease 700ms;
}
.section02.active .text h2 {
	transition: 400ms ease 900ms;
	-webkit-transition: 400ms ease 900ms;
}
.section02.active .text p, .section04 .store span {
	transition: 400ms ease 1100ms;
	-webkit-transition: 400ms ease 1100ms;
}
.section02.active .text:after {
	transition: 500ms ease 1300ms;
	-webkit-transition: 500ms ease 1300ms;
}
.section02.active .pic {
	transition: 500ms ease 1500ms;
	-webkit-transition: 500ms ease 1500ms;
}
.section02.active .pro, .section05.active .custom-con {
	visibility: visible;
	opacity: 1;
}


.section03 .brand li{transform: rotateY(90deg); -webkit-transform: rotateY(90deg); }
.section03.active .brand li{transform: rotateY(0); -webkit-transform: rotateY(0);}
.section05 .custom-con{transform: rotateY(180deg) scale(0); -webkit-transform:rotateY(180deg) scale(0);}
.section05.active .custom-con{transform:rotateY(0) scale(1); -webkit-transform:rotateY(0) scale(1);}
.section.active h1, .section02.active .pro-summary, .section02.active .text h2, .section02.active .text p, .section02.active .text:after, .section02.active .pic, .section03.active .text, .section04.active .text, .section04.active .store span, .section06.active .circle{
	opacity: 1;
	-webkit-transform: translate(0px, 0px);
	transform: translate(0px, 0px);
}

.section06 .circle {opacity: 0.5;}
.section06 .click01{transform: rotateX(90deg); -webkit-transform: rotateX(90deg); transform-origin: 50% 100% 0px; }
.section06 .click02{transform: rotateY(-90deg); -webkit-transform: rotateY(-90deg); transform-origin: 0 50% 0; }
.section06 .click03{transform: rotateY(90deg); -webkit-transform: rotateY(90deg); transform-origin: 100% 50% 0; }
.section06 .click04{transform: rotateX(90deg); -webkit-transform: rotateX(90deg); transform-origin: 50% 0 0; }
.section06 .click05{transform: rotateX(-90deg); -webkit-transform: rotateX(-90deg); transform-origin: 50% 100% 0; }

.section06 .click01{-webkit-transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 280ms, -webkit-transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 280ms; transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 280ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 280ms; }
.section06.active .click02,.section03.active .brand li:first-child{-webkit-transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 560ms, -webkit-transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 560ms; transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 560ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 560ms; }
.section06.active .click03,.section03.active .brand li:nth-child(2),.section05.active .custom-con{-webkit-transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 840ms, -webkit-transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 840ms; transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 840ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 840ms; }
.section06.active .click04,.section03.active .brand li:nth-child(3){-webkit-transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1120ms, -webkit-transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1120ms; transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1120ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1120ms; }
.section06.active .click05,.section03.active .brand li:last-child{-webkit-transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1400ms, -webkit-transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1400ms; transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1400ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1400ms; }
.section06.active .circle{opacity:1;}



/*.section06 .click01 {
	-webkit-transform: translate(0, -100px);
	transform: translate(0, -100px);
}
.section06 .click02 {
	-webkit-transform: translate(-120px, 0);
	transform: translate(-120px, 0);
}
.section06 .click03 {
	-webkit-transform: translate(120px, 0);
	transform: translate(120px, 0);
}
.section06 .click04 {
	-webkit-transform: translate(-100px, 0);
	transform: translate(-100px, 0);
}
.section06 .click05 {
	-webkit-transform: translate(100px, 0);
	transform: translate(100px, 0);
}*/





#fp-nav li:first-child, #fp-nav li:last-child {
	display: none;
}

.header-fix{ position:fixed; width:100%; z-index:9999; top:-70px; background:rgba(255,255,255,.3); -webkit-box-shadow:0 0 5px rgba(0,0,0,.2); box-shadow:0 0 5px rgba(0,0,0,.2);}
.header-fix-show{top:0;}
.header-fix .pn-list a{color:#000;}
.header-fix .language{padding:23px 10px 22px 20px;}
.header-fix .lan_select{top:70px;}



.bg-music{ display:none;}