/*!
 * author     :zhangshimeng
 * create time:20200426.185124
 */
* {
	margin: 0;
	padding: 0
}

body,html,svg {
	width: 100%;
	height: 100%
}

body,html {
	overflow: hidden;
	font-family: PingFang SC,Helvetica,Arial,Hiragino Sans GB,Microsoft Yahei,STHeiTi,sans-serif
}

#bg_small {
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 0;
	background: #f8f8f8
}

#bg-div,#bg_small {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0
}

#bg-div {
	z-index: 100;
	top: 0;
	display: block
}

.fn-hide {
	display: none!important
}

.anim_title div {
	white-space: nowrap;
	background-color: rgba(0,0,0,.4);
	-webkit-border-radius: 3px;
	border-radius: 3px;
	position: relative;
	left: -50%;
	padding: .3rem .4rem;
	text-align: center;
	color: #fff;
	font-size: .7rem
}

.anim_title {
	display: inline-block;
	position: absolute;
	left: 50%;
	top: -10%
}

#swipe-down {
	background: url(../../img/76b47ab91e4bfb3ed36d576f2a3527f8.png);
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%
}

#swipe-down,#swipe-up {
	position: absolute;
	z-index: 10000;
	left: 5%;
	top: 50%;
	-webkit-transform: translateY(-60%);
	-moz-transform: translateY(-60%);
	-ms-transform: translateY(-60%);
	transform: translateY(-60%);
	width: 6.3rem;
	height: 16.45rem;
	display: none
}

#swipe-up {
	background: url(../../img/03904311f351bdad0c573d4d5552bd6c.png);
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%
}

@media screen and (max-width:960px) {
	#swipe-down,#swipe-up {
		width: 5rem;
		height: 13.15rem
	}
}

#tips-div {
	top: 50%;
	width: 12.6rem;
	height: 10rem;
	-webkit-transform: translate(-50%,-80%);
	-moz-transform: translate(-50%,-80%);
	-ms-transform: translate(-50%,-80%);
	transform: translate(-50%,-80%);
	background: url(../../img/999a82ca9bd9360331e9fe842953c7da.png);
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%
}

#start-help,#tips-div {
	position: absolute;
	z-index: 10000;
	left: 50%;
	display: none
}

#start-help {
	top: 20%;
	margin-left: -6.75rem;
	width: 13.5rem;
	height: 14rem;
	background: url(../../img/2384892b8d4b13293f39f3fcfab6eb83.png);
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%;
	opacity: .5
}

.moveUp-banner {
	bottom: 1.1rem
}

.moveDown-banner {
	bottom: -5rem
}

.default-pre,.line-pre {
	background: url(../../img/fc391ad4bc329208ccf365774786400a.png)
}

.img1-pre {
	background: url(../../img/pre.png)
}

.text-layer .close-text-layer {
	display: none;
	position: absolute;
	top: -5px;
	right: 10px;
	z-index: 2000000000;
	width: 30px;
	height: 30px;
	background: url(../../img/f2855c7c852d0742e6c3955be3344943.png) 0 0 no-repeat;
	-webkit-background-size: 30px 30px;
	background-size: 30px 30px
}

.text-layer .mask {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2000000000;
	background-color: #000;
	opacity: .8
}

.text-layer .text-play-box {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2000000000;
	width: 77.86%;
	max-width: 1180px;
	max-height: 709.75px;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%)
}

.text-layer .text-play-box h4 {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1001;
	width: 100%;
	margin-top: 1.25rem;
	padding: 0 5px;
	font-size: 24px;
	font-weight: 400;
	color: #fff;
	text-align: center;
	line-height: 1;
	-webkit-transform: translateY(-100%);
	-moz-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
	transform: translateY(-100%);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	letter-spacing: 2px
}

.text-layer .text-play-box .text-play {
	position: absolute;
	top: 0;
	color: #fff;
	width: 100%;
	height: 100%
}

@media screen and (orientation:landscape) {
	.text-layer .text-play-box h4 {
		margin-top: 1.25rem
	}

	.text-layer .text-play-box .text-play {
		margin-top: 2.5rem
	}
}

@media screen and (orientation:portrait) {
	.text-layer .text-play-box h4 {
		margin-top: -1.25rem
	}

	.text-layer .text-play-box .text-play {
		margin-top: 1.25rem
	}
}

.video-layer .close-video-layer {
	display: none;
	position: absolute;
	top: 12px;
	right: 10px;
	z-index: 2000000000;
	width: 30px;
	height: 30px;
	background: url(../../img/f2855c7c852d0742e6c3955be3344943.png) 0 0 no-repeat;
	-webkit-background-size: 30px 30px;
	background-size: 30px 30px
}

.video-layer .mask {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2000000000;
	background-color: #000;
	opacity: .8
}

.video-layer .video-play-box {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2000000000;
	width: 77.86%;
	max-width: 1180px;
	max-height: 709.75px;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%)
}

.video-layer .video-play-box h4 {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1001;
	width: 100%;
	margin-top: -5px;
	padding: 0 5px;
	font-size: 20px;
	font-weight: 400;
	color: #fff;
	text-align: center;
	line-height: 1;
	-webkit-transform: translateY(-100%);
	-moz-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
	transform: translateY(-100%);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	letter-spacing: 2px
}

.video-layer .video-play-box .video-play {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%
}

.dialog-toast {
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 2000000000;
	width: 220px;
	height: 110px;
	font-size: 24px;
	font-weight: 400;
	color: #fff;
	text-align: center;
	line-height: 110px;
	background-color: rgba(0,0,0,.7);
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%)
}

.dialog-toast-m {
	width: 110px;
	height: 55px;
	font-size: 16px;
	line-height: 55px
}

#choujiang-div,#feedback-div,#price-div {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2000000000;
	display: none;
	width: 100%;
	height: 100%
}

@media screen and (max-width:960px) {
	.anchor-praise {
		position: absolute;
		right: 10px;
		bottom: 10px;
		z-index: 2000000001;
		width: 80px;
		height: 40px;
		font-size: 16px
	}

	.anchor-praise .img-praise {
		left: 0;
		background-image: url(../../img/5ad2b61a1dbcb51bbe82f9c140ec3f19.png);
		-webkit-background-size: 40px 40px;
		background-size: 40px 40px;
		cursor: pointer
	}

	.anchor-praise .count-praise,.anchor-praise .img-praise {
		position: absolute;
		top: 0;
		z-index: 100001;
		width: 40px;
		height: 40px
	}

	.anchor-praise .count-praise {
		left: 40px;
		line-height: 40px;
		text-align: center;
		color: #fff
	}
}

#bg-div .anim {
	position: absolute;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	z-index: 900;
	width: 100px;
	height: 100px;
	background: url(../../img/81fe8cd87f860f1fbed3abf53e364f90.png);
	-webkit-background-size: 100px 5200px;
	background-size: 100px 5200px;
	background-position: 0 0
}

#bg-div .anim .line {
	position: absolute;
	left: 65px;
	bottom: 65px;
	z-index: 900;
	width: 50px;
	height: 17.5px;
	background: url(../../img/fc391ad4bc329208ccf365774786400a.png);
	-webkit-background-size: 50px 17.5px;
	background-size: 50px 17.5px
}

#bg-div .anim .default {
	position: absolute;
	left: 115px;
	bottom: 30.5px;
	width: 208px;
	height: 104px;
	background: url(../../img/ad00134a1a8cc347b8f77ed900ef0ecf.png);
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%
}

#bg-div .anim .default .text {
	position: absolute;
	left: 24px;
	top: 16px;
	width: 64px;
	height: 72px;
	color: #fff;
	display: table;
	font-size: 14px
}

#bg-div .anim .default .text .content {
	vertical-align: middle;
	display: table-cell;
	padding-left: 5px
}

#bg-div .anim .default .img {
	position: absolute;
	left: 96px;
	top: 16px;
	width: 96px;
	height: 72px;
	border: 1px solid #01ddff;
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%
}

#bg-div .anim .default .img1 {
	z-index: 2;
	left: 108px;
	top: 16px;
	width: 72px;
	height: 72px;
	background: url(../../img/pre.png);background-size: 100% 100%
}

#bg-div .anim .default .img1,#bg-div .anim .volvo1 {
	position: absolute;
	-webkit-background-size: 100% 100%
}

#bg-div .anim .volvo1 {
	left: 115px;
	bottom: 30.5px;
	width: 208px;
	height: 104px;
	background-image: url(../../img/5706fb586756ea803b55995641b2f3e6.png);
	background-size: 100% 100%
}

#bg-div .anim .volvo1 .text {
	position: absolute;
	left: 121.6px;
	top: 16px;
	width: 64px;
	height: 72px;
	color: #fff;
	display: table;
	font-size: 14px
}

#bg-div .anim .volvo1 .text .content {
	vertical-align: middle;
	display: table-cell;
	padding-left: 5px
}

#bg-div .anim .volvo1 .img {
	left: 17.6px;
	width: 96px
}

#bg-div .anim .volvo1 .img,#bg-div .anim .volvo1 .img1 {
	position: absolute;
	top: 16px;
	height: 72px;
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%
}

#bg-div .anim .volvo1 .img1 {
	z-index: 2;
	left: 29.6px;
	width: 72px;
	background-image: url(../../img/pre.png)
}

#title-div {
	position: absolute;
	background: rgba(17,30,54,.4);
	opacity: 1;
	-webkit-border-radius: 16px;
	border-radius: 16px;
	width: auto;
	height: 32px;
	line-height: 32px;
	left: 5rem;
	top: 15px;
	font-weight: blod!important;
	font-style: normal;
	font-size: 12px;
	color: #fff;
	text-align: center
}

#bg-div .banner2 {
	display: none;
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 0;
	z-index: 1000;
	-webkit-transition: .5s;
	-o-transition: .5s;
	-moz-transition: .5s;
	transition: .5s
}

#bg-div .banner2.hidden {
	-webkit-transform: translateX(-200px);
	-moz-transform: translateX(-200px);
	-ms-transform: translateX(-200px);
	transform: translateX(-200px)
}

#bg-div .banner {
	display: none
}

#bg-div .banner .group {
	position: absolute;
	right: 20px;
	right: -webkit-calc(20px + constant(safe-area-inset-bottom));
	right: -moz-calc(20px + constant(safe-area-inset-bottom));
	right: calc(20px + constant(safe-area-inset-bottom));
	right: -webkit-calc(20px + env(safe-area-inset-bottom));
	right: -moz-calc(20px + env(safe-area-inset-bottom));
	right: calc(20px + env(safe-area-inset-bottom));
	top: 20px;
	height: 22px;
	width: 210px;
	z-index: 1000;
	-webkit-transition: .5s;
	-o-transition: .5s;
	-moz-transition: .5s;
	transition: .5s
}

#bg-div .banner .group>div {
	float: right;
	width: 22px;
	height: 22px;
	padding: 10px
}

#bg-div .banner .group .share-btn {
	position: relative
}

#bg-div .banner .group .share-btn div {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 9;
	left: 0;
	top: 0;
	background-color: transparent
}

#bg-div .banner .group .hide-btn {
	-webkit-transition: .5s;
	-o-transition: .5s;
	-moz-transition: .5s;
	transition: .5s;
	background: url(../../img/btnyj0.png) no-repeat 50%;-webkit-background-size: 22px 22px;
	background-size: 22px
}

#bg-div .banner .group.hidden {
	-webkit-transform: translateX(200px);
	-moz-transform: translateX(200px);
	-ms-transform: translateX(200px);
	transform: translateX(200px)
}

#bg-div .banner .group.hidden .hide-btn {
	-webkit-transform: translateX(-200px);
	-moz-transform: translateX(-200px);
	-ms-transform: translateX(-200px);
	transform: translateX(-200px);
	background-image: url(../../img/btnyj1.png)
}

#bg-div .banner .group .askprice-btn {
	width: 79px;
	height: 42px;
	margin-top: 14px;
	position: absolute;
	right: 0;
	background: url(../../img/84bc9ba7ca24c478a30fddb5eb0e1d23.png);
	background-position: -220px 0;
	-webkit-background-size: 299px auto;
	background-size: 299px auto
}

#bg-div .banner .praise-btn {
	position: absolute;
	right: 20px;
	right: -webkit-calc(20px + constant(safe-area-inset-bottom));
	right: -moz-calc(20px + constant(safe-area-inset-bottom));
	right: calc(20px + constant(safe-area-inset-bottom));
	right: -webkit-calc(20px + env(safe-area-inset-bottom));
	right: -moz-calc(20px + env(safe-area-inset-bottom));
	right: calc(20px + env(safe-area-inset-bottom));
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 22px;
	height: 22px;
	padding: 9px;
	-webkit-border-radius: 22px;
	border-radius: 22px;
	background-color: rgba(17,30,54,.75)
}

#bg-div .banner .praise-btn svg {
	width: 22px;
	height: 22px
}

#bg-div .banner .praise-btn .active {
	display: none
}

#bg-div .banner .praise-btn .praise-num {
	position: absolute;
	font-size: 14px;
	white-space: nowrap;
	word-break: keep-all;
	left: 50%;
	color: #fff;
	bottom: -20px;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	font-family: DINAlternate-Bold
}

#bg-div .banner .praise-btn.praise-selected {
	background-color: hsla(0,0%,100%,.75)
}

#bg-div .banner .praise-btn.praise-selected .normal {
	display: none
}

#bg-div .banner .praise-btn.praise-selected .active {
	display: block
}

#back-div {
	cursor: pointer;
	position: absolute;
	width: 22px;
	height: 22px;
	top: 20px;
	left: 40px;
	left: -webkit-calc(40px + constant(safe-area-inset-top));
	left: -moz-calc(40px + constant(safe-area-inset-top));
	left: calc(40px + constant(safe-area-inset-top));
	left: -webkit-calc(40px + env(safe-area-inset-top));
	left: -moz-calc(40px + env(safe-area-inset-top));
	left: calc(40px + env(safe-area-inset-top));
	z-index: 9999;
	display: none
}

.playing #bg-div .banner,.playing #bg-div .banner2,.playing .anim {
	-webkit-transform: translateY(-1000px);
	-moz-transform: translateY(-1000px);
	-ms-transform: translateY(-1000px);
	transform: translateY(-1000px)
}

.playing .anim {
	opacity: 0
}

.playing .ahvp__video__controls {
	display: none
}

.playing .colorBox,.playing .playerBox {
	-webkit-transform: translateY(200%);
	-moz-transform: translateY(200%);
	-ms-transform: translateY(200%);
	transform: translateY(200%);
	opacity: 0
}

.playing .player {
	opacity: 1;
	-webkit-transform: translate3d(-50%,-200%,0);
	-moz-transform: translate3d(-50%,-200%,0);
	transform: translate3d(-50%,-200%,0)
}

.playing #ad-recommond {
	display: none!important
}

.playing #banner {
	z-index: 2000000002
}

.playLoading {
	width: 135px;
	height: 40px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	background-color: rgba(0,0,0,.9);
	top: 0;
	bottom: 0;
	z-index: 999;
	font-size: 14px;
	color: #fff;
	text-align: center;
	padding-top: 60px
}

.playLoading,.playLoading i {
	position: absolute;
	left: 0;
	right: 0;
	margin: auto
}

.playLoading i {
	width: 20px;
	height: 20px;
	background: url(../../img/jiazai.png) 0 0 no-repeat;-webkit-background-size: 100% 100%;
	background-size: 100%;
	top: 30px;
	-webkit-animation: turn .5s linear infinite;
	-moz-animation: turn .5s linear infinite;
	animation: turn .5s linear infinite
}

@-webkit-keyframes turn {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}

	to {
		-webkit-transform: rotate(1turn);
		transform: rotate(1turn)
	}
}

@-moz-keyframes turn {
	0% {
		-moz-transform: rotate(0deg);
		transform: rotate(0deg)
	}

	to {
		-moz-transform: rotate(1turn);
		transform: rotate(1turn)
	}
}

@keyframes turn {
	0% {
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		transform: rotate(0deg)
	}

	to {
		-webkit-transform: rotate(1turn);
		-moz-transform: rotate(1turn);
		transform: rotate(1turn)
	}
}

#banner,.ahvp__video__toast,.ahvp_pip_button-container {
	display: none
}

#banner {
	position: absolute;
	width: 100%;
	left: 0;
	height: 40px;
	bottom: 15px;
	z-index: 99;
	text-align: center;
	white-space: nowrap;
	word-spacing: 0;
	letter-spacing: 0;
	font-size: 0
}

#banner span {
	font-family: PingFangSC-Regular;
	font-weight: 700;
	font-size: 12px;
	color: #fff;
	letter-spacing: 0;
	text-align: left
}

#banner svg {
	float: left;
	width: 16px;
	height: 16px;
	margin-right: 8px;
	position: relative;
	top: -webkit-calc((100% - 16px)/2);
	top: -moz-calc((100% - 16px)/2);
	top: calc((100% - 16px) / 2)
}

.player {
	opacity: 0;
	width: 265px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	height: 100%;
	background: rgba(17,30,54,.75);
	-webkit-border-radius: 4px;
	border-radius: 4px;
	margin: auto;
	position: absolute;
	left: 50%;
	top: 200%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	padding-left: 46px;
	-webkit-transition: .3s ease-out;
	-o-transition: .3s ease-out;
	-moz-transition: .3s ease-out;
	transition: .3s ease-out
}

.player img {
	position: absolute;
	left: 7px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 30px;
	height: 30px;
	float: left;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	border: 1px solid #fff
}

.player .type-list {
	float: left;
	position: relative;
	width: 152px;
	height: 100%;
	padding-left: 16px;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	align-items: center
}

.player .type-list:before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	height: 50%;
	margin: auto;
	-webkit-transform: scaleX(.5);
	-moz-transform: scaleX(.5);
	transform: scaleX(.5);
	border-left: 1px solid hsla(0,0%,100%,.4)
}

.player .type-list div {
	width: 0;
	height: 28px;
	margin-right: 4px;
	background-color: #fff;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-flex: 1;
	-webkit-flex-grow: 1;
	-moz-box-flex: 1;
	-ms-flex-positive: 1;
	flex-grow: 1;
	position: relative;
	text-align: center;
	line-height: 28px;
	color: #fff;
	font-size: 12px;
	cursor: pointer;
	background-color: hsla(0,0%,100%,.4)
}

.player .type-list div.active {
	background-color: #fff;
	color: #111e36
}

.player .type-list div.active span {
	position: absolute;
	left: 4px;
	right: 4px;
	bottom: 3px;
	height: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	overflow: hidden;
	background-color: #c5cad4
}

.player .type-list div.active i {
	display: block;
	width: 0;
	height: 100%;
	background-image: -webkit-gradient(linear,left top,right top,from(#74a0f9),to(#05f));
	background-image: -webkit-linear-gradient(left,#74a0f9,#05f);
	background-image: -moz-linear-gradient(left,#74a0f9 0,#05f 100%);
	background-image: -o-linear-gradient(left,#74a0f9 0,#05f 100%);
	background-image: linear-gradient(90deg,#74a0f9,#05f)
}

.player .type-list div:last-child {
	margin: 0
}

.player .pause-btn {
	width: 18px;
	height: 100%;
	padding: 0 16px;
	position: relative;
	float: left
}

.player .pause-btn:after {
	content: "";
	position: absolute;
	height: 18px;
	width: 18px;
	left: 16px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	background: url(../../img/bofang.png) no-repeat;-webkit-background-size: 100% 100%;
	background-size: 100%
}

.playerBox {
	-webkit-transition: .3s ease-out;
	-o-transition: .3s ease-out;
	-moz-transition: .3s ease-out;
	transition: .3s ease-out
}

.player-content,.playerBox {
	display: inline-block;
	height: 100%;
	vertical-align: top
}

.player-content {
	background: rgba(17,30,54,.75);
	-webkit-border-radius: 4px;
	border-radius: 4px;
	padding-left: 46px;
	position: relative;
	margin-right: 4px
}

.player-content img {
	position: absolute;
	left: 7px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 30px;
	height: 30px;
	float: left;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	border: 1px solid #fff
}

.player-content .player-btn {
	padding: 0 10px;
	height: 100%;
	position: relative
}

.player-content .player-btn:before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	height: 50%;
	margin: auto;
	-webkit-transform: scaleX(.5);
	-moz-transform: scaleX(.5);
	transform: scaleX(.5);
	border-left: 1px solid hsla(0,0%,100%,.4)
}

.player-content .player-btn i {
	float: left;
	width: 14px;
	height: 14px;
	border: 1px solid #fff;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	position: relative;
	margin-right: 8px;
	top: -webkit-calc((100% - 16px)/2);
	top: -moz-calc((100% - 16px)/2);
	top: calc((100% - 16px) / 2)
}

.player-content .player-btn i:after {
	content: "";
	position: absolute;
	left: 4px;
	top: 3px;
	width: 8px;
	height: 8px;
	background: url(../../img/athm-iconpng-v20191225.png) no-repeat -192px -88px;
	-webkit-background-size: 960px auto;
	background-size: 960px auto
}

.askprice-btn {
	font-size: 12px;
	color: #fff;
	text-align: left;
	padding: 0 10px
}

.askprice-btn,.colorBox {
	background: rgba(17,30,54,.75);
	-webkit-border-radius: 4px;
	border-radius: 4px;
	display: inline-block;
	vertical-align: top;
	height: 100%
}

.colorBox {
	position: relative;
	margin-right: 32px;
	-webkit-transition: .3s ease-out;
	-o-transition: .3s ease-out;
	-moz-transition: .3s ease-out;
	transition: .3s ease-out
}

#switchBtn {
	position: relative;
	display: inline-block;
	vertical-align: top;
	z-index: 2;
	padding: 0 10px;
	height: 100%
}

#switchBtn:after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	height: 50%;
	margin: auto;
	-webkit-transform: scaleX(.5);
	-moz-transform: scaleX(.5);
	transform: scaleX(.5);
	border-left: 1px solid hsla(0,0%,100%,.4)
}

#colorScroll {
	position: relative;
	display: inline-block;
	vertical-align: top;
	height: 100%;
	padding-right: 4px
}

#wrapper {
	height: 100%;
	overflow: hidden
}

#scroller,#wrapper {
	position: absolute;
	z-index: 1
}

#scroller {
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-text-size-adjust: none;
	-moz-text-size-adjust: none;
	-ms-text-size-adjust: none;
	-o-text-size-adjust: none;
	text-size-adjust: none;
	-webkit-transition: .2s;
	-o-transition: .2s;
	-moz-transition: .2s;
	transition: .2s
}

#scroller ul {
	list-style: none;
	padding: 0;
	margin: 0;
	width: 100%;
	text-align: center
}

#scroller ul li {
	float: left;
	-webkit-border-radius: 50%;
	border-radius: 50%
}

#scroller ul li:first-of-type {
	margin-left: 0
}

#scroller ul li.active {
	-webkit-animation: clickAnim .2s;
	-moz-animation: clickAnim .2s;
	animation: clickAnim .2s
}

#scroller ul li.active .color-img {
	-webkit-box-shadow: 0 0 0 2px #fff;
	box-shadow: 0 0 0 2px #fff
}

#scroller ul li .color-img {
	-webkit-border-radius: 50%;
	border-radius: 50%
}

@-webkit-keyframes clickAnim {
	0% {
		-webkit-transform: scale(1);
		transform: scale(1)
	}

	50% {
		-webkit-transform: scale(1.2);
		transform: scale(1.2)
	}

	to {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}

@-moz-keyframes clickAnim {
	0% {
		-moz-transform: scale(1);
		transform: scale(1)
	}

	50% {
		-moz-transform: scale(1.2);
		transform: scale(1.2)
	}

	to {
		-moz-transform: scale(1);
		transform: scale(1)
	}
}

@keyframes clickAnim {
	0% {
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		transform: scale(1)
	}

	50% {
		-webkit-transform: scale(1.2);
		-moz-transform: scale(1.2);
		transform: scale(1.2)
	}

	to {
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		transform: scale(1)
	}
}

.colorNameSampleTip {
	position: absolute;
	left: 50%;
	top: 60px;
	-webkit-transform: translate(-50%);
	-moz-transform: translate(-50%);
	-ms-transform: translate(-50%);
	transform: translate(-50%);
	height: 34px;
	background-color: rgba(0,0,0,.9);
	padding: 0 20px;
	z-index: 20000000
}

.colorNameSampleTip .content {
	margin: auto;
	width: 100%;
	height: 100%
}

.colorNameSampleTip .content .text {
	float: left;
	font-size: 14px
}

.colorNameSampleTip .content .text div {
	height: 14px;
	line-height: 14px;
	color: #fff;
	text-align: center;
	margin-top: 10px
}

.messageTips {
	display: none;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	-webkit-transition: .2s;
	-o-transition: .2s;
	-moz-transition: .2s;
	transition: .2s;
	height: 44px;
	background-color: rgba(0,0,0,.9);
	-webkit-border-radius: 10px;
	border-radius: 10px;
	padding: 0 20px
}

.messageTips .content {
	margin: auto;
	height: 100%
}

.messageTips .content .text {
	float: left;
	font-size: 14px
}

.messageTips .content .text div {
	height: 14px;
	line-height: 14px;
	color: #fff;
	text-align: center;
	margin-top: 15px
}

#ad-recommond {
	display: none;
	position: absolute;
	z-index: 100;
	left: 40px;
	left: -webkit-calc(40px + constant(safe-area-inset-top));
	left: -moz-calc(40px + constant(safe-area-inset-top));
	left: calc(40px + constant(safe-area-inset-top));
	left: -webkit-calc(40px + env(safe-area-inset-top));
	left: -moz-calc(40px + env(safe-area-inset-top));
	left: calc(40px + env(safe-area-inset-top));
	top: 75px;
	height: 32px;
	line-height: 32px;
	font-size: 12px;
	text-align: center;
	color: #f9712c;
	cursor: pointer
}

#ad-recommond .tuijian {
	position: absolute;
	width: 30px;
	height: 16px;
	line-height: 16px;
	display: block;
	background: #f9712c;
	-webkit-border-radius: 4px 4px 4px 0;
	border-radius: 4px 4px 4px 0;
	color: #fff;
	font-size: 12px;
	left: 8px;
	top: -12px
}

#ad-recommond .title {
	float: left;
	display: block;
	padding: 0 8px;
	overflow: hidden;
	white-space: nowrap;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	background: #fff;
	-webkit-border-radius: 0 4px 4px 4px;
	border-radius: 0 4px 4px 4px;
	max-width: 106px
}

.threesixty {
	position: relative;
	overflow: hidden;
	margin: 0 auto;
	z-index: 1
}

.threesixty .threesixty_images {
	display: none;
	list-style: none;
	margin: 0;
	padding: 0
}

.threesixty .threesixty_images img {
	position: absolute;
	top: 0;
	width: 100%;
	height: auto
}

.threesixty .threesixty_images img.previous-image {
	visibility: hidden
}

.threesixty .threesixty_images img.current-image {
	visibility: visible
}

.threesixty .spinner {
	position: absolute;
	left: 50%;
	top: 50%;
	margin-top: -15px;
	margin-left: -30px;
	width: 60px;
	display: none;
	height: 30px;
	background: #333;
	background: rgba(0,0,0,.7);
	-webkit-border-radius: 5px;
	border-radius: 5px
}

.threesixty .spinner span {
	font-family: Arial,MS Trebuchet,sans-serif;
	font-size: 12px;
	font-weight: bolder;
	color: #fff;
	text-align: center;
	line-height: 30px;
	display: block
}

@charset "UTF-8";

body,html {
	width: 100%;
	height: 100%
}

.swiper-container {
	margin-left: auto;
	margin-right: auto;
	position: relative;
	overflow: hidden;
	z-index: 1
}

.swiper-container-no-flexbox .swiper-slide {
	float: left
}

.swiper-container-vertical>.swiper-wrapper {
	-webkit-box-orient: vertical;
	-moz-box-orient: vertical;
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	flex-direction: column
}

.swiper-wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	z-index: 1;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-transition-property: -webkit-transform;
	-o-transition-property: -o-transform;
	transition-property: -webkit-transform;
	-o-transition-property: transform;
	-moz-transition-property: transform,-moz-transform;
	transition-property: transform;
	transition-property: transform,-webkit-transform,-moz-transform;
	transition-property: transform,-webkit-transform;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
	-webkit-align-items: center;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	align-items: center
}

.swiper-container-android .swiper-slide,.swiper-wrapper {
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-moz-transform: translateZ(0);
	transform: translateZ(0)
}

.swiper-container-multirow>.swiper-wrapper {
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap
}

.swiper-container-free-mode>.swiper-wrapper {
	-webkit-transition-timing-function: ease-out;
	-o-transition-timing-function: ease-out;
	-moz-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
	margin: 0 auto
}

.swiper-slide {
	-webkit-flex-shrink: 0;
	-ms-flex: 0 0 auto;
	-ms-flex-negative: 0;
	flex-shrink: 0;
	width: 100%;
	height: 100%;
	position: relative
}

.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide {
	height: auto
}

.swiper-container-autoheight .swiper-wrapper {
	-webkit-box-align: start;
	-ms-flex-align: start;
	-webkit-align-items: flex-start;
	-moz-box-align: start;
	align-items: flex-start;
	-webkit-transition-property: -webkit-transform,height;
	-o-transition-property: -o-transform;
	-webkit-transition-property: height,-webkit-transform;
	transition-property: height,-webkit-transform;
	-o-transition-property: height,-o-transform;
	-o-transition-property: transform,height;
	-moz-transition-property: transform,height,-moz-transform;
	transition-property: transform,height;
	transition-property: transform,height,-webkit-transform,-moz-transform;
	transition-property: transform,height,-webkit-transform
}

.swiper-container .swiper-notification {
	position: absolute;
	left: 0;
	top: 0;
	pointer-events: none;
	opacity: 0;
	z-index: -1000
}

.swiper-wp8-horizontal {
	-ms-touch-action: pan-y;
	touch-action: pan-y
}

.swiper-wp8-vertical {
	-ms-touch-action: pan-x;
	touch-action: pan-x
}

.swiper-button-next,.swiper-button-prev {
	position: absolute;
	top: 50%;
	width: 27px;
	height: 44px;
	margin-top: -22px;
	z-index: 10;
	cursor: pointer;
	-webkit-background-size: 27px 44px;
	background-size: 27px 44px;
	background-position: 50%;
	background-repeat: no-repeat
}

.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled {
	opacity: .35;
	cursor: auto
}

.swiper-button-prev,.swiper-container-rtl .swiper-button-next {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z' fill='%23007aff'/%3E%3C/svg%3E");
	left: 0;
	right: auto
}

.swiper-button-prev.swiper-button-black,.swiper-container-rtl .swiper-button-next.swiper-button-black {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z'/%3E%3C/svg%3E")
}

.swiper-button-prev.swiper-button-white,.swiper-container-rtl .swiper-button-next.swiper-button-white {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z' fill='%23fff'/%3E%3C/svg%3E")
}

.swiper-button-next,.swiper-container-rtl .swiper-button-prev {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z' fill='%23007aff'/%3E%3C/svg%3E");
	right: 0;
	left: auto
}

.swiper-button-next.swiper-button-black,.swiper-container-rtl .swiper-button-prev.swiper-button-black {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z'/%3E%3C/svg%3E")
}

.swiper-button-next.swiper-button-white,.swiper-container-rtl .swiper-button-prev.swiper-button-white {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z' fill='%23fff'/%3E%3C/svg%3E")
}

.swiper-pagination {
	position: absolute;
	bottom: 0;
	text-align: center;
	color: #fff;
	font-family: 微软雅黑;
	font-size: 24px;
	letter-spacing: 2px;
	-webkit-transition: .3s;
	-o-transition: .3s;
	-moz-transition: .3s;
	transition: .3s;
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-moz-transform: translateZ(0);
	transform: translateZ(0);
	z-index: 10
}

.swiper-pagination.swiper-pagination-hidden {
	opacity: 0
}

.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction {
	bottom: 10px;
	left: 0;
	width: 100%
}

.swiper-pagination-bullet {
	width: 8px;
	height: 8px;
	display: inline-block;
	-webkit-border-radius: 100%;
	border-radius: 100%;
	background: #000;
	opacity: .2
}

button.swiper-pagination-bullet {
	border: none;
	margin: 0;
	padding: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
	-moz-appearance: none;
	-ms-appearance: none;
	-webkit-appearance: none;
	appearance: none
}

.swiper-pagination-clickable .swiper-pagination-bullet {
	cursor: pointer
}

.swiper-pagination-white .swiper-pagination-bullet {
	background: #fff
}

.swiper-pagination-bullet-active {
	opacity: 1;
	background: #007aff
}

.swiper-pagination-white .swiper-pagination-bullet-active {
	background: #fff
}

.swiper-pagination-black .swiper-pagination-bullet-active {
	background: #000
}

.swiper-container-vertical>.swiper-pagination-bullets {
	right: 10px;
	top: 50%;
	-webkit-transform: translate3d(0,-50%,0);
	-ms-transform: translate3d(0,-50%,0);
	-moz-transform: translate3d(0,-50%,0);
	transform: translate3d(0,-50%,0)
}

.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {
	margin: 5px 0;
	display: block
}

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
	margin: 0 5px
}

.swiper-pagination-progress {
	background: rgba(0,0,0,.25);
	position: absolute
}

.swiper-pagination-progress .swiper-pagination-progressbar {
	background: #007aff;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: scale(0);
	-ms-transform: scale(0);
	-moz-transform: scale(0);
	transform: scale(0);
	-webkit-transform-origin: left top;
	-ms-transform-origin: left top;
	-moz-transform-origin: left top;
	transform-origin: left top
}

.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar {
	-webkit-transform-origin: right top;
	-ms-transform-origin: right top;
	-moz-transform-origin: right top;
	transform-origin: right top
}

.swiper-container-horizontal>.swiper-pagination-progress {
	width: 100%;
	height: 4px;
	left: 0;
	top: 0
}

.swiper-container-vertical>.swiper-pagination-progress {
	width: 4px;
	height: 100%;
	left: 0;
	top: 0
}

.swiper-pagination-progress.swiper-pagination-white {
	background: hsla(0,0%,100%,.5)
}

.swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar {
	background: #fff
}

.swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar {
	background: #000
}

.swiper-container-3d {
	-webkit-perspective: 1200px;
	-o-perspective: 1200px;
	-moz-perspective: 1200px;
	perspective: 1200px
}

.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d
}

.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 10
}

.swiper-container-3d .swiper-slide-shadow-left {
	background-image: -webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),to(transparent));
	background-image: -webkit-linear-gradient(right,rgba(0,0,0,.5),transparent);
	background-image: -o-linear-gradient(right,rgba(0,0,0,.5),transparent);
	background-image: -webkit-gradient(linear,right top,left top,from(rgba(0,0,0,.5)),to(transparent));
	background-image: -moz-linear-gradient(right,rgba(0,0,0,.5),transparent);
	background-image: linear-gradient(270deg,rgba(0,0,0,.5),transparent)
}

.swiper-container-3d .swiper-slide-shadow-right {
	background-image: -webkit-gradient(linear,right top,left top,from(rgba(0,0,0,.5)),to(transparent));
	background-image: -webkit-linear-gradient(left,rgba(0,0,0,.5),transparent);
	background-image: -o-linear-gradient(left,rgba(0,0,0,.5),transparent);
	background-image: -webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),to(transparent));
	background-image: -moz-linear-gradient(left,rgba(0,0,0,.5),transparent);
	background-image: linear-gradient(90deg,rgba(0,0,0,.5),transparent)
}

.swiper-container-3d .swiper-slide-shadow-top {
	background-image: -webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.5)),to(transparent));
	background-image: -webkit-linear-gradient(bottom,rgba(0,0,0,.5),transparent);
	background-image: -o-linear-gradient(bottom,rgba(0,0,0,.5),transparent);
	background-image: -webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.5)),to(transparent));
	background-image: -moz-linear-gradient(bottom,rgba(0,0,0,.5),transparent);
	background-image: linear-gradient(0deg,rgba(0,0,0,.5),transparent)
}

.swiper-container-3d .swiper-slide-shadow-bottom {
	background-image: -webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.5)),to(transparent));
	background-image: -webkit-linear-gradient(top,rgba(0,0,0,.5),transparent);
	background-image: -o-linear-gradient(top,rgba(0,0,0,.5),transparent);
	background-image: -webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.5)),to(transparent));
	background-image: -moz-linear-gradient(top,rgba(0,0,0,.5),transparent);
	background-image: linear-gradient(180deg,rgba(0,0,0,.5),transparent)
}

.swiper-container-coverflow .swiper-wrapper,.swiper-container-flip .swiper-wrapper {
	-ms-perspective: 1200px
}

.swiper-container-cube,.swiper-container-flip {
	overflow: visible
}

.swiper-container-cube .swiper-slide,.swiper-container-flip .swiper-slide {
	pointer-events: none;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
	z-index: 1
}

.swiper-container-cube .swiper-slide .swiper-slide,.swiper-container-flip .swiper-slide .swiper-slide {
	pointer-events: none
}

.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active,.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active {
	pointer-events: auto
}

.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top,.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top {
	z-index: 0;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden
}

.swiper-container-cube .swiper-slide {
	visibility: hidden;
	-webkit-transform-origin: 0 0;
	-ms-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	transform-origin: 0 0;
	width: 100%;
	height: 100%
}

.swiper-container-cube.swiper-container-rtl .swiper-slide {
	-webkit-transform-origin: 100% 0;
	-ms-transform-origin: 100% 0;
	-moz-transform-origin: 100% 0;
	transform-origin: 100% 0
}

.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev {
	pointer-events: auto;
	visibility: visible
}

.swiper-container-cube .swiper-cube-shadow {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background: #000;
	opacity: .6;
	-webkit-filter: blur(50px);
	filter: blur(50px);
	z-index: 0
}

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
	-webkit-transition-timing-function: ease-out;
	-o-transition-timing-function: ease-out;
	-moz-transition-timing-function: ease-out;
	transition-timing-function: ease-out
}

.swiper-container-fade .swiper-slide {
	pointer-events: none;
	-webkit-transition-property: opacity;
	-o-transition-property: opacity;
	-moz-transition-property: opacity;
	transition-property: opacity
}

.swiper-container-fade .swiper-slide .swiper-slide {
	pointer-events: none
}

.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active {
	pointer-events: auto
}

.swiper-zoom-container {
	width: 100%;
	height: 100%;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	text-align: center
}

.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg {
	max-width: 100%;
	max-height: 100%;
	-o-object-fit: contain;
	object-fit: contain
}

.swiper-scrollbar {
	-webkit-border-radius: 10px;
	border-radius: 10px;
	position: relative;
	-ms-touch-action: none;
	background: rgba(0,0,0,.1)
}

.swiper-container-horizontal>.swiper-scrollbar {
	position: absolute;
	left: 1%;
	bottom: 3px;
	z-index: 50;
	height: 5px;
	width: 98%
}

.swiper-container-vertical>.swiper-scrollbar {
	position: absolute;
	right: 3px;
	top: 1%;
	z-index: 50;
	width: 5px;
	height: 98%
}

.swiper-scrollbar-drag {
	height: 100%;
	width: 100%;
	position: relative;
	background: rgba(0,0,0,.5);
	-webkit-border-radius: 10px;
	border-radius: 10px;
	left: 0;
	top: 0
}

.swiper-scrollbar-cursor-drag {
	cursor: move
}

.swiper-lazy-preloader {
	width: 42px;
	height: 42px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -21px;
	margin-top: -21px;
	z-index: 10;
	-webkit-transform-origin: 50%;
	-ms-transform-origin: 50%;
	-moz-transform-origin: 50%;
	transform-origin: 50%;
	-webkit-animation: swiper-preloader-spin 1s steps(12) infinite;
	-moz-animation: swiper-preloader-spin 1s steps(12) infinite;
	animation: swiper-preloader-spin 1s steps(12) infinite
}

.swiper-lazy-preloader:after {
	display: block;
	content: "";
	width: 100%;
	height: 100%;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' stroke='%236c6c6c' stroke-width='11' stroke-linecap='round' d='M60 7v20'/%3E%3C/defs%3E%3Cuse xlink:href='%23a' opacity='.27'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(30 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(60 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(90 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(120 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(150 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.37' transform='rotate(180 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.46' transform='rotate(210 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.56' transform='rotate(240 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.66' transform='rotate(270 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.75' transform='rotate(300 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.85' transform='rotate(330 60 60)'/%3E%3C/svg%3E");
	background-position: 50%;
	-webkit-background-size: 100% 100%;
	background-size: 100%;
	background-repeat: no-repeat
}

.swiper-lazy-preloader-white:after {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' stroke='%23fff' stroke-width='11' stroke-linecap='round' d='M60 7v20'/%3E%3C/defs%3E%3Cuse xlink:href='%23a' opacity='.27'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(30 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(60 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(90 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(120 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(150 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.37' transform='rotate(180 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.46' transform='rotate(210 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.56' transform='rotate(240 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.66' transform='rotate(270 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.75' transform='rotate(300 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.85' transform='rotate(330 60 60)'/%3E%3C/svg%3E")
}

@-webkit-keyframes swiper-preloader-spin {
	to {
		-webkit-transform: rotate(1turn)
	}
}

@-moz-keyframes swiper-preloader-spin {
	to {
		-webkit-transform: rotate(1turn);
		-moz-transform: rotate(1turn);
		transform: rotate(1turn)
	}
}

@keyframes swiper-preloader-spin {
	to {
		-webkit-transform: rotate(1turn);
		-moz-transform: rotate(1turn);
		transform: rotate(1turn)
	}
}

.swiper-container {
	width: 100%;
	height: 100%
}

.swiper-slide {
	text-align: center;
	font-size: 18px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-box;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	-moz-box-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-moz-box-align: center;
	align-items: center;
	pointer-events: none!important
}

.swiper-slide img {
	height: auto;
	width: auto;
	max-height: 100%;
	max-width: 100%
}

.swiper-slide-active img {
	pointer-events: auto
}

.gallery-mask {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 999;
	background-color: rgba(0,0,0,.8)
}

.gallery {
	position: absolute;
	display: inline-block;
	top: 50%;
	left: 50%;
	z-index: 9999;
	pointer-events: none
}

.gallery .swiper-button-next-box,.gallery .swiper-button-prev-box {
	position: absolute;
	top: 0;
	z-index: 10;
	width: 37px;
	height: 100%;
	pointer-events: auto
}

.gallery h4 {
	position: absolute;
	top: 0;
	width: 100%;
	margin: 0;
	text-align: center;
	color: #fff;
	font-family: 微软雅黑;
	font-size: 24px;
	font-weight: 400;
	letter-spacing: 2px;
	-webkit-transition: .3s;
	-o-transition: .3s;
	-moz-transition: .3s;
	transition: .3s;
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-moz-transform: translateZ(0);
	transform: translateZ(0);
	z-index: 10;
	pointer-events: auto
}

.close-gallery-layer {
	display: none;
	position: absolute;
	top: 12px;
	right: 0;
	z-index: 9999;
	width: 30px;
	height: 30px;
	background: url(../../img/f2855c7c852d0742e6c3955be3344943.png) 0 0 no-repeat;
	-webkit-background-size: 30px 30px;
	background-size: 30px 30px;
	-webkit-transform: translate(-10px);
	-ms-transform: translate(-10px);
	-moz-transform: translate(-10px);
	transform: translate(-10px)
}

.gallery-m {
	display: block;
	top: 50%;
	left: 0;
	width: 100%;
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-moz-transform: translateZ(0);
	transform: translateZ(0)
}

.gallery-m .swiper-pagination,.gallery-m h4 {
	-webkit-transform: scale(.75);
	-ms-transform: scale(.75);
	-moz-transform: scale(.75);
	transform: scale(.75)
}

.recordBox {
	vertical-align: top;
	background: rgba(17,30,54,.75);
	-webkit-border-radius: 4px;
	border-radius: 4px
}

.recordBox,.recordBox>div {
	display: inline-block;
	height: 100%
}

.recordBox>div {
	font-size: 12px;
	color: #fff;
	padding: 0 10px;
	position: relative
}

.recordBox i {
	float: left;
	width: 16px;
	height: 16px;
	position: relative;
	margin-right: 8px;
	top: -webkit-calc((100% - 16px)/2);
	top: -moz-calc((100% - 16px)/2);
	top: calc((100% - 16px) / 2)
}

.recordBox i:after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate3d(-50%,-50%,0);
	-moz-transform: translate3d(-50%,-50%,0);
	transform: translate3d(-50%,-50%,0)
}

.recordBox #recordBtn i:after {
	width: 16px;
	height: 16px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background-color: red;
	-webkit-transition: .2s linear;
	-o-transition: .2s linear;
	-moz-transition: .2s linear;
	transition: .2s linear
}

.recordBox #reviewBtn i:after {
	width: 16px;
	height: 16px;
	background: url(../../img/athm-iconpng-v20191225.png) no-repeat -384px -176px;
	-webkit-background-size: 1920px auto;
	background-size: 1920px auto
}

.recordBox #reviewBtn:before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	height: 50%;
	margin: auto;
	-webkit-transform: scaleX(.5);
	-moz-transform: scaleX(.5);
	transform: scaleX(.5);
	border-left: 1px solid hsla(0,0%,100%,.4)
}

.recordBox #recordBtn.current i:after {
	-webkit-border-radius: 4px;
	border-radius: 4px;
	background-color: red;
	width: 12px;
	height: 12px;
	-webkit-animation: heart 1.5s linear infinite;
	-moz-animation: heart 1.5s linear infinite;
	animation: heart 1.5s linear infinite
}

@-webkit-keyframes heart {
	0%,to {
		-webkit-transform: translate3d(-50%,-50%,0) scale(1);
		transform: translate3d(-50%,-50%,0) scale(1)
	}

	40%,60% {
		-webkit-transform: translate3d(-50%,-50%,0) scale(1.15);
		transform: translate3d(-50%,-50%,0) scale(1.15)
	}
}

@-moz-keyframes heart {
	0%,to {
		-moz-transform: translate3d(-50%,-50%,0) scale(1);
		transform: translate3d(-50%,-50%,0) scale(1)
	}

	40%,60% {
		-moz-transform: translate3d(-50%,-50%,0) scale(1.15);
		transform: translate3d(-50%,-50%,0) scale(1.15)
	}
}

@keyframes heart {
	0%,to {
		-webkit-transform: translate3d(-50%,-50%,0) scale(1);
		-moz-transform: translate3d(-50%,-50%,0) scale(1);
		transform: translate3d(-50%,-50%,0) scale(1)
	}

	40%,60% {
		-webkit-transform: translate3d(-50%,-50%,0) scale(1.15);
		-moz-transform: translate3d(-50%,-50%,0) scale(1.15);
		transform: translate3d(-50%,-50%,0) scale(1.15)
	}
}