/*body {
	
}

.box {
	width: 100%;
	height: 960px;
	overflow: hidden;
	position: relative;
}

.main {
	width: 4000px;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	position: absolute;
	top: calc(-50%);
	left: calc(-60% + 40px)
}

.main .l {
	width: 2000px;
	background-color: black;
	transform: rotate(18deg) translateX(-0%);
	height: 2000px;
	position: relative;
}

.main .r {
	width: 2000px;
	background-color: red;
	transform: rotate(18deg) translateX(98px);
	height: 2000px;
	position: relative;
}

.main .r .pic {
	transform: rotate(-18deg);
	position: absolute;
	bottom: 400px;
	left: -200px;
	transition: 0.5s;
}

.main .l .pic {
	transform: rotate(-18deg);
	position: absolute;
	top: 200px;
	right: -190px;
	transition: 0.5s;
}

.main .l:hover .pic.p1 {
	opacity: 0;
}

.main .r:hover .pic.p1 {
	opacity: 0;
}*/

.main {
	position: relative;
	width: 100%;
	overflow: hidden;
}

.main .l,
.main .r {
	height: 100%;
	position: absolute;
	top: 0px;
}

.main .l {
	left: 0px;
	width: calc((1129 / 1920) * 100%);
}

.main .r {
	width: calc((1138 / 1920) * 100%);
	right: 0px;
}

.main .l .pic,
.main .r .pic {
	position: absolute;
	left: 0;
	top: 0;
	transition: 0.5s;
}

.main .l .pic img,
.main .r .pic img {
	display: block;
	width: 100%;
}

.main .l:hover .pic.p1 {
	opacity: 0;
}

.main .r:hover .pic.p1 {
	opacity: 0;
}

.main .l .logo,
.main .r .logo {
	position: relative;
	z-index: 3;
	width: 100%;
	height: 100%;
	
}

.main .l .logo img,
.main .r .logo img {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
}

#wap {
	display: none;
}

#wap .top,
#wap .bottom {
	height: 50%;
	width: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	position: relative;
}

#wap .top {
	background-image: url(../images/wap_i_p1.jpg);
}

#wap .bottom {
	background-image: url(../images/wap_i_p2.jpg);
}

#wap .logo img {
	width: 50%;
	display: block;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
}

@media screen and (max-width: 550px ) {
	
	.main {
		display: none;
	}
	
	#wap {
		display: block;
	}
	
	
}