.layout {
	width:200rem;
	height:112.5rem;
	position:relative;
	overflow:hidden;
}
.layout .ubtn li {
	position:absolute;
	z-index:30;
}
.layout .ubtn li:hover img {
	transform:scale(1.1);
}
.layout .ubtn li img {
	width:100%;
	display:block;
	position:relative;
	z-index:3;
	cursor:pointer;
	transition:all 0.3s;
	-ms-transition:all 0.3s;
	-moz-transition:all 0.3s;
	-webkit-transition:all 0.3s;
	-o-transition:all 0.3s;
}
.layout .ubtn li:nth-child(1) {
	width:32.60416666666667rem;
	left:15.3125rem;
	top:39.47916666666667rem;
}
.layout .ubtn li:nth-child(2) {
	width:32.60416666666667rem;
	left:44.114583333333336rem;
	top:23.489583333333336rem;
}
.layout .ubtn li:nth-child(3) {
	width:32.60416666666667rem;
	left:44.114583333333336rem;
	top:58.90625rem;
}
.layout .ubtn li:nth-child(4) {
	width:48.177083333333336rem;
	left:37.34375rem;
	top:70.05208333333334rem;
	z-index:35;
}
.layout .ubtn li:nth-child(5) {
	width:44.63541666666667rem;
	left:99.375rem;
	top:1.5625rem;
}
.layout .ubtn li:nth-child(6) {
	width:33.645833333333336rem;
	left:94.94791666666667rem;
	top:28.177083333333336rem;
	z-index:35;
}
.layout .ubtn li:nth-child(7) {
	width:35.88541666666667rem;
	left:95.52083333333334rem;
	top:93.85416666666667rem;
}
.layout .ubtn li:nth-child(8) {
	width:37.34375rem;
	left:128.90625rem;
	top:33.177083333333336rem;
	z-index:34;
}
.layout .ubtn li:nth-child(9) {
	width:36.97916666666667rem;
	z-index:32;
	left:150.20833333333334rem;
	top:49.63541666666667rem;
}
.layout .ubtn li:nth-child(10) {
	width:39.114583333333336rem;
	left:143.80208333333334rem;
	top:65.88541666666667rem;
}
.layout .ubtn li:nth-child(11) {
	width:39.270833333333336rem;
	left:149.58333333333334rem;
	top:81.35416666666667rem;
}
.layout .ubtn li:before {
	content:"";
	position:absolute;
}
.layout .ubtn li:nth-child(2):before {
	top:-16.875rem;
	width:41.66666666666667rem;
	height:23.4375rem;
	left:23.90625rem;
	background:url(../images/l15.png) no-repeat center top / 100% auto;
}
@keyframes heart-burst3 {
	0% {
	background-position:0% 0;
}
100% {
	background-position:0% 100%;
}
;}
.video {
	position:absolute;display: block;
	inset:0;width: 100%;
}
.layout .ubtn li:nth-child(2):hover:before {
	animation:heart-burst3 2s steps(29) infinite;
	background-size:100% 3000%;
	animation-play-state:running;
}
.layout .ubtn li:nth-child(1):hover:before {
	animation:heart-burst3 2s steps(24) infinite;
	background-size:100% 2500%;
	animation-play-state:running;
}
.layout .ubtn li:nth-child(1):before {
	top:-15rem;
	width:41.66666666666667rem;
	height:23.4375rem;
	left:20.104166666666668rem;
	background:url(../images/l14.png) no-repeat center top / 100% auto;
}
.layout .ubtn li:nth-child(3):hover:before {
	animation:heart-burst3 2s steps(29) infinite;
	background-size:100% 3000%;
	animation-play-state:running;
}
.layout .ubtn li:nth-child(3):before {
	top:-14.270833333333334rem;
	width:26.041666666666668rem;
	height:23.4375rem;
	left:-16.09375rem;
	background:url(../images/l13.png) no-repeat center top / 100% auto;
}
.layout .ubtn li:nth-child(3) {
	z-index:99;
}
.layout .ubtn li:nth-child(4):hover:before {
	animation:heart-burst3 2s steps(24) infinite;
	background-size:100% 2500%;
	animation-play-state:running;
}
.layout .ubtn li:nth-child(4):before {
	top:-11.145833333333334rem;
	width:26.041666666666668rem;
	height:26.041666666666668rem;
	left:16.09375rem;
	background:url(../images/l12.png) no-repeat center top / 100% auto;
}
.layout .ubtn li:nth-child(4):hover::after {
	animation:heart-burst3 2s steps(24) infinite;
	background-size:26.041666666666668rem 2500%;
	animation-play-state:running;
}
.layout .ubtn li:nth-child(4):after {
	top:2.604166666666667rem;
	content:"";
	width:16.666666666666668rem;
	position:absolute;
	height:15.625rem;
	left:42.708333333333336rem;
	background:url(../images/l10.png) no-repeat left top / 26.041666666666668rem auto;
}
.layout .ubtn li:nth-child(6):hover:before {
	animation:heart-burst3 2s steps(29) infinite;
	background-size:100% 3000%;
	animation-play-state:running;
}
.layout .ubtn li:nth-child(6):before {
	top:-12.708333333333334rem;
	width:23.4375rem;
	height:18.229166666666668rem;
	left:23.489583333333336rem;
	background:url(../images/l1.png) no-repeat center top / 100% auto;
}
.layout .ubtn li:nth-child(7):hover:before {
	animation:heart-burst3 2s steps(29) infinite;
	background-size:100% 3000%;
	animation-play-state:running;
}
.layout .ubtn li:nth-child(7):before {
	top:-12.708333333333334rem;
	width:41.66666666666667rem;
	height:26.041666666666668rem;
	left:-35.989583333333336rem;
	background:url(../images/l11.png) no-repeat center top / 100% auto;
}
.layout .ubtn li:nth-child(7):hover::after {
	animation:heart-burst3 2s steps(29) infinite;
	background-size:100% 3000%;
	animation-play-state:running;
}
.layout .ubtn li:nth-child(7):after {
	top:-5.416666666666667rem;
	position:absolute;
	content:"";
	width:41.66666666666667rem;
	height:23.4375rem;
	left:28.697916666666668rem;
	background:url(../images/l9.png) no-repeat center top / 100% auto;
}
.layout .ubtn li:nth-child(8):hover:before {
	animation:heart-burst3 2s steps(29) infinite;
	background-size:100% 3000%;
	animation-play-state:running;
}
.layout .ubtn li:nth-child(8):before {
	top:-6.510416666666667rem;
	width:33.85416666666667rem;
	height:23.4375rem;
	left:-28.4375rem;
	background:url(../images/l2.png) no-repeat center top / 100% auto;
}
.layout .ubtn li:nth-child(8):hover::after {
	/* animation:heart-burst3 2s steps(29) infinite;
	background-size:100% 3000%;
	animation-play-state:running;*/;
}
.layout .ubtn li:nth-child(8)::after {
	top:7.552083333333334rem;
	position:absolute;
	width:23.4375rem;
	content:'';
	height:23.4375rem;
	left:-7.604166666666667rem;
	background:url(../images/l3.png) no-repeat center top / 100% auto;
}
.layout .ubtn li:nth-child(9):hover:before {
	animation:heart-burst3 2s steps(29) infinite;
	background-size:100% 3000%;
	animation-play-state:running;
}
.layout .ubtn li:nth-child(9):before {
	top:-13.333333333333334rem;
	width:26.041666666666668rem;
	height:23.4375rem;
	left:4.166666666666667rem;
	background:url(../images/l4.png) no-repeat center top / 100% auto;
}
.layout .ubtn li:nth-child(9)::after {
	top:6.458333333333334rem;
	position:absolute;
	width:26.041666666666668rem;
	content:"";
	height:10.416666666666668rem;
	left:-21.09375rem;
	background:url(../images/l7.png) no-repeat center top / 100% auto;
}
.layout .ubtn li:nth-child(10):hover:before {
	animation:heart-burst3 2s steps(24) infinite;
	background-size:100% 2500%;
	animation-play-state:running;
}
.layout .ubtn li:nth-child(10):before {
	top:-9.166666666666668rem;
	width:26.041666666666668rem;
	height:18.229166666666668rem;
	left:5.729166666666667rem;
	background:url(../images/l6.png) no-repeat center top / 100% auto;
}
.layout .ubtn li:nth-child(10):hover::after {
	/* animation:heart-burst2 2s steps(24) infinite;
	background-size:26.041666666666668rem 2500%;
	animation-play-state:running;*/;
}
.layout .ubtn li:nth-child(10):after {
	top:7.8125rem;
	position:absolute;
	width:19.791666666666668rem;
	content:"";
	height:10.416666666666668rem;
	left:-10.572916666666668rem;
	background:url(../images/l8.png) no-repeat right top / 26.041666666666668rem auto;
}
@keyframes heart-burst2 {
	0% {
	background-position:-6.25rem 0;
}
100% {
	background-position:-6.25rem 100%;
}
;}.layout .ubtn li:nth-child(11):hover:before {
	animation:heart-burst3 2s steps(29) infinite;
	background-size:100% 3000%;
	animation-play-state:running;
}
.layout .ubtn li:nth-child(11):before {
	top:-23.020833333333336rem;
	width:26.041666666666668rem;
	height:31.25rem;
	left:21.40625rem;
	background:url(../images/l5.png) no-repeat center top / 100% auto;
}
.mask {
	position:fixed;
	left:0;
	right:0;
	top:0;
	bottom:0;
	z-index:9998;
	background:rgba(0,0,0,0.7);
	display:none;
}
.mkvideo {
	position:fixed;
	left:0;
	right:0;
	top:10%;
	z-index:9999;
	max-width:70%;
	margin:0 auto;
	display:none;
	background: url(../images/videobg.png) no-repeat center/100% 100%;
	padding: 6rem 5.8rem;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}
.mkvideo video {
	width:100%;margin-left: -0.1rem;
}
.mkvideo .icos {
	position:absolute;
	width:5.0833333333333335rem;
	height:5.0833333333333335rem;
	right:-5.604166666666667rem;
	top:-5.604166666666667rem;
	cursor:pointer;
	background:url(../images/ss1.png) no-repeat center/cover;
	z-index:9;
	transition:all 0.3s;
	-ms-transition:all 0.3s;
	/* IE 9*/
    -moz-transition:all 0.3s;
	/* Firefox*/
    -webkit-transition:all 0.3s;
	/* Safari 鍜� Chrome*/
    -o-transition:all 0.3s;
}
.mkvideo .icos:hover {
	transform:rotate(720deg);
	-ms-transform:rotate(720deg);
	/* IE 9*/
    -moz-transform:rotate(720deg);
	/* Firefox*/
    -webkit-transform:rotate(720deg);
	/* Safari 鍜� Chrome*/
    -o-transform:rotate(720deg);
}
.mkvideo {
	display:none;
	transition:all 0.2s ease;
}
.layout .ubtn li:nth-child(12){
	width: 63.385417rem;
	    position: absolute;
	    left: 85rem;
	    top: 78rem;z-index: 39;
}