img{ width: 100%; display: block;}
div,a,span:focus{ outline:none; border:none; background:none; -webkit-tap-highlight-color: rgba(255, 255, 255, 0);}
.wraps{ width: 100%; height: 100vh; overflow: hidden;}
.mainContent{ width: 100%; height: 100%;}
body{ background: #000;margin:0;}
.contbg{ width: 100%; position: relative; top: 50%; transform: translate(0,-50%);}
.mainpage{ width: 100%; height: 8.4rem; position: absolute; top:0; left: 0; transform: translate(0,0%); z-index: 1;}
.swiper-slide{ overflow: hidden;}
.pagebottom:before{ content:""; display: block; width: 100%; height: 1.5rem; z-index: 10; background: linear-gradient(to top, rgba(0,0,0,1.0),rgba(0,0,0,0.6), rgba(0,0,0,0) );  position: absolute;pointer-events:none; bottom: 0; left: 0;}
div{
	-moz-user-select: none; 
	-webkit-user-select: none; 
	-ms-user-select: none; 
	-khtml-user-select: none; 
	user-select: none;	
}



.loading{ width: 100%; height: 100%; background: linear-gradient(141deg,#0b0b0e 0%,#0a0919 51%,#01002a 75%); position: fixed; z-index: 9999; top: 0; left: 0;}
.circle-opacity {
	width:75px;
	height:75px;
	margin:auto;
	position:relative;
}
.circle-opacity .child {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
.circle-opacity .child:before {
	content:"";
	display:block;
	margin:0 auto;
	width:15%;
	height:15%;
	background-color:#fff;
	border-radius:100%;
	animation:circle-opacity 1.2s infinite ease-in-out;
}
.circle-opacity .circle-2 {
	transform:rotate(30deg);
}
.circle-opacity .circle-2:before {
	animation-delay:-1.1s;
}
.circle-opacity .circle-3 {
	transform:rotate(60deg);
}
.circle-opacity .circle-3:before {
	animation-delay:-1.0s;
}
.circle-opacity .circle-4 {
	transform:rotate(90deg);
}
.circle-opacity .circle-4:before {
	animation-delay:-0.9s;
}
.circle-opacity .circle-5 {
	transform:rotate(120deg);
}
.circle-opacity .circle-5:before {
	animation-delay:-0.8s;
}
.circle-opacity .circle-6 {
	transform:rotate(150deg);
}
.circle-opacity .circle-6:before {
	animation-delay:-0.7s;
}
.circle-opacity .circle-7 {
	transform:rotate(180deg);
}
.circle-opacity .circle-7:before {
	animation-delay:-0.6s;
}
.circle-opacity .circle-8 {
	transform:rotate(210deg);
}
.circle-opacity .circle-8:before {
	animation-delay:-0.5s;
}
.circle-opacity .circle-9 {
	transform:rotate(240deg);
}
.circle-opacity .circle-9:before {
	animation-delay:-0.4s;
}
.circle-opacity .circle-10 {
	transform:rotate(270deg);
}
.circle-opacity .circle-10:before {
	animation-delay:-0.3s;
}
.circle-opacity .circle-11 {
	transform:rotate(300deg);
}
.circle-opacity .circle-11:before {
	animation-delay:-0.2s;
}
.circle-opacity .circle-12 {
	transform:rotate(330deg);
}
.circle-opacity .circle-12:before {
	animation-delay:-0.1s;
}
@keyframes circle-opacity {
	0% {
	opacity:0;
}
40% {
	opacity:1;
}
80% {
	opacity:0;
}
100% {
	opacity:0;
}
}
.loadingCircle{ width: 100%; position: absolute; top: 50%; transform: translate(0,-50%);}
.loading_txt{ color: #fff; font-size: 22px; text-align: center; margin-top: 20px; letter-spacing: 2px;}

.header_parts { width:100%; height:68px; position:fixed;  z-index:99; top:0; left:0; overflow:hidden; }
.sony_header { width:1920px; position:absolute; top:-68px; left:50%; transition:all 0.4s ease; margin-left:-960px; min-width:1200px; }
.header_parts:hover .sony_header{ top:0; transition:all 0.4s ease;}

.bg1{ background: url(../images/pvm.jpg) no-repeat top center; background-size: 100% auto; width: 100%; height: 100%;}
.bg2{ background: url(../images/photography.jpg) no-repeat top center; background-size: 100% auto; width: 100%; height: 100%;}
.bg3{ background: url(../images/game.jpg) no-repeat top center; background-size: 100% auto; width: 100%; height: 100%;}
.bg4{ background: url(../images/music.jpg) no-repeat top center; background-size: 100% auto; width: 100%; height: 100%;}

.leftbars{ width: 0.62rem; height: 7.77rem;position: fixed; z-index: 999; top:3.2rem; left:0.5rem;}
.navbg{ background:#fff; background-size: 100% auto;width:0.2rem; height: 0.2rem;border-radius:0.2rem;display: block;margin: 0.2rem;}
.navbg.act{ background: #007aff; background-size: 100% auto;}

.qrcode{width:1.5rem;top: 7.0rem;right:1rem;position: fixed; z-index: 999;}

.p1_title{ width: 10.61rem;height: 3.12rem; position: absolute; top: 4.82rem; left: 0rem;background:rgba(239,190,214,0.4); background-size: 100% auto;z-index: 999;}
.p1_title img{width: 8.66rem;height: 2.02rem;margin-left:1.23rem;margin-top:0.53rem; }
.videocop{ width: 6rem;height: 3.37rem;border:0.1rem solid #fff; position: absolute;top: 5.3rem;left:1.2rem;background:rgba(0,0,0,0.3)}
.videocop img{width:6rem;height: 3.37rem;}
.videocop a{display: block;width: 100%;height: 100%;top: 0.7rem;left:1.5rem;text-align: center;position:absolute;z-index:22;}
.videocop a img{width:1rem;height: 1rem;margin:0.5rem 1rem;}

.p2_title{ width:3.01rem;height: 1.38rem; position: absolute; top: 2.21rem; left: 1.5rem;}
.p2_des{ width: 7.09rem;height: 3.79rem; position: absolute; top: 3.84rem; left: 1.35rem;}

.p3_title{ width:6.23rem;height: 1.39rem; position: absolute; top: 1.58rem; left: 1.4rem;}
.p3_des{ width: 7.4rem;height: 2.01rem; position: absolute; top: 3.03rem; left: 1.25rem;}

.p4_title{ width: 7.04rem;height: 1.78rem; position: absolute; top: 1.65rem; left: 1.49rem;}
.p4_des{ width: 6.87rem;height: 3.57rem;position: absolute; top: 3.69rem; left: 1.34rem;}

.ani{ opacity: 0;}

.details {
	transition:border-color 250ms ease-in-out,opacity 250ms ease-in-out,visibility 250ms ease-in-out;
	-webkit-transform:translateX(-1rem) translateY(-1rem);
	transform:translateX(-1rem) translateY(-1rem);
	padding:0;
	width:0.6rem;
	height:0.6rem;
	border:2px solid transparent;
	position:absolute;
	background:rgba(0,0,0,0.2);
	opacity: 1;
	visibility: visible;
	border-radius:64px;
	line-height:.5;
	display:flex;
	align-items:center;
	justify-content:center;
	z-index: 9999;
}



.details:hover {
	opacity: 1;
	background:rgba(0,0,0,0.1);
	border: 2px #fff solid;
}



.details::after {
	content:"";
	transition:-webkit-transform 250ms ease-in-out;
	transition:transform 250ms ease-in-out;
	transition:transform 250ms ease-in-out, -webkit-transform 250ms ease-in-out;
	position:relative;
	display:block;
	background:#fff;
	box-shadow:0 1px 4px rgba(0,0,0,0.55);
	width:.3rem;
	height:.3rem;
	border-radius:.3rem;
}

.details:hover::after {
	transform:scale(0.5,0.5);
}

.details::before {
	content:"";position:absolute;top:-.5rem;left:-.5rem;right:-.5rem;bottom:-.5rem;display:block;
}

.details:hover::before {
	content:"";position:absolute;top:-.5rem;left:-.5rem;right:-.5rem;bottom:-.5rem;display:block;
}

.details .des{width:max-content;position:absolute;left: 0.8rem;color:#fff;background: rgba(0,0,0,0.4);padding: 0.1rem;border-radius: 0.04rem;opacity: 0;
	transition: all 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;}
.details:hover .des {
	opacity: 1;
}
.details .des h3{font-size: 0.22rem;margin:0.15rem 0;font-weight:500;}
.details .des p{font-size: 0.18rem;}

/*蓝牙耳机*/
.page1_a{top: 5.5rem;left: 7.3rem;}
/*手机*/
.page1_b{top: 4.0rem;left: 11.4rem;}
/*相机*/
.page1_c{top: 6.1rem;left: 15.5rem;}
/*镜头*/
.page1_d{top: 8rem;left: 10rem;}
/*播放器*/
.page1_e{top: 2.5rem;left: 15.4rem;}

/*蓝牙耳机*/
.page2_a{top: 3.3rem;left: 6.3rem;}
/*手机*/
.page2_b{top: 3.48rem;left: 11.4rem;}
/*相机*/
.page2_c{top: 6.1rem;left: 15.5rem;}
/*稳定器*/
.page2_d{top: 5.48rem;left: 8.4rem;}


/*手机*/
.page3_b{top: 6.48rem;left: 11.4rem;}
/*相机*/
.page3_c{top: 1.5rem;left: 11.5rem;}
/*镜头*/
.page3_d{top: 3.48rem;left: 6.4rem;}

/*手机*/
.page4_b{top: 5.48rem;left: 12.4rem;}
/*蓝牙耳机*/
.page4_c{top: 1.5rem;left: 14.2rem;}
/*立体声耳机*/
.page4_d{top: 7.48rem;left: 8.4rem;}