html,
body {
	padding    : 0;
	margin     : 0;
	line-height: 1;
}

.shdow {
	position        : fixed;
	top             : 0;
	bottom          : 0;
	left            : 0;
	right           : 0;
	background-color: rgba(0, 0, 0, 0.5);
	z-index         : 999;
	display         : none;
}

/*分发页面*/
.distribute-header {
	background     : url(../images/distribute-bg.png) no-repeat center;
	background-size: cover;
	height         : 150px;
}

.distribute-content .cont {
	margin-top         : -110px;
	padding            : 0;
	text-align         : center;
	/* background-color: #8fa19e; */
}

.distribute-content .cont .name-info {
	font-size  : 14px;
	line-height: 1.4;
	color      : #999;
}

.icon-wrap {
	background-color: #fff;
	width           : 160px;
	height          : 160px;
	border-radius   : 25px;
	box-shadow      : 0 0 10px rgba(0, 0, 0, .2);
	display         : flex;
	align-items     : center;
	margin          : 0 auto;
}

.icon-wrap img {
	width           : 120px;
	height          : 112px;
	border-radius   : 24px;
	/* border       : 1px solid #e5e5e5; */
	margin          : 0 auto;
}

.distribute-content {
	margin-bottom: 30px;
}

.container {
	max-width: 820px;
	margin   : 0 auto;
}

.distribute-content .name {
	font-size    : 18px;
	margin-bottom: 10px;
	margin-top   : 15px;
	word-break   : break-all;
	white-space  : pre-wrap;
	font-weight  : normal;
}

.btn-main {
	color     : #fff;
	background: #4455E6;
	border    : 1px solid #4455E6;
}

.appMetaWrap {
	display        : flex;
	justify-content: space-between;
	align-items    : center;
	gap            : 10px;
	flex           : 1;
	min-width      : 0;
}

.appMeta {
	display       : flex;
	flex-direction: column;
	align-items   : flex-start;
	gap           : 8px;
	font-size     : 14px;
	text-align    : left;
	flex          : 1;
	min-width     : 0;
}

.appTitle {
	font-size  : 18px;
	font-weight: 700;
	color      : #111827;
}

.appDesc {
	line-height: 1.6;
	color      : #4b5563;
}

.downloadCountBox {
	display       : flex;
	flex-direction: column;
	align-items   : center;
	gap           : 4px;
	font-size     : 14px;
	color         : #4b5563;
	white-space   : nowrap;
}

.downloadCountBox #download_count {
	font-size  : 18px;
	font-weight: 700;
	color      : #111827;
}

@media (max-width: 640px) {
	.distribute-header {
		height: 120px;
	}

	.distribute-content .cont {
		margin-top: -80px;
	}

	.appBox {
		display       : flex;
		flex-direction: column;
		align-items   : center;
		margin-top    : 100px;
	}

	.appMetaWrap {
		width          : 100%;
		flex-direction : column;
		align-items    : stretch;
		text-align     : center;
	}

	.appMeta {
		align-items: center;
		text-align : center;
	}

	.appTitle,
	.appDesc {
		width: 100%;
	}

	.downloadCountBox {
		padding-top: 4px;
	}

	.distribute-content .download .download-btn {
		width       : calc(100% - 24px);
		padding     : 0 20px;
		margin-top  : 14px;
		box-sizing  : border-box;
		font-size   : 15px;
	}

	.swiper-container {
		width : calc(100% - 20px);
		margin: 30px auto 20px;
	}

	.site-footer {
		padding: 0 12px;
		font-size: 11px;
	}

	.site-footer .footer-links,
	.site-footer .footer-row {
		gap: 4px 8px;
	}
}

@media (max-width: 420px) {
	.distribute-header {
		height: 100px;
	}

	.appImg {
		width : 4rem;
		height: 4rem;
	}

	.appTitle {
		font-size: 16px;
	}

	.appDesc,
	.site-footer {
		font-size: 12px;
	}

	.site-footer .footer-item {
		width: 100%;
		justify-content: center;
	}
}

.distribute-content .download .download-btn {
	height       : 48px;
	padding      : 0 50px;
	line-height  : 48px;
	font-size    : 16px;
	margin-top   : 16px;
	width        : calc(100% - 32px);
	display      : inline-block;
	border-radius: 25px;
}

.distribute-content .download .clicked-download {
	display: inline-block;
	margin : 15px 0;
}

.distribute-content .download .system {
	font-size : 14px;
	color     : #666;
	text-align: center;
}

.swiper-container {
	width   : 90%;
	height  : 100%;
	overflow: hidden;
	margin  : 50px auto;
}

.swiper-slide {
	display        : flex;
	align-items    : center;
	justify-content: center;
	border-radius  : 18px;
	font-size      : 22px;
	font-weight    : bold;
	color          : #fff;
}

.swiper-container img {
	width        : 100%;
	height       : 100%;
	border-radius: 20px;
}

.swiper-3d .swiper-slide-shadow {
	/* background: none; */
}

.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top {
	width: auto;
}

.swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
	bottom: auto !important;
}

.carousel {
	margin-bottom: 15px;
	width        : 100%;
	height       : 450px;
	overflow     : hidden;
}

.scrollBox {
	position           : relative;
	width              : 100%;
	height             : 100%;
	overflow-x         : auto;
	/* background-color: #947878; */
}

.showBox {
	position        : absolute;
	top             : 0%;
	left            : 50%;
	transform       : translate(-50%, 0%);
	transition      : all 800ms;
	display         : flex;
	justify-content : center;
	align-items     : center;
	width           : 184px;
	height          : 25rem;
	border-radius   : 20px;
	flex-shrink     : 0;
	overflow        : hidden;
	background-color: #e7e7e7;
}

.showBox img {
	max-height   : calc(100% - 1rem);
	border-radius: 15px;
}

.markerBox {
	position           : absolute;
	bottom             : 0;
	display            : flex;
	justify-content    : center;
	align-items        : center;
	width              : 100%;
	height             : 50px;
	/* background-color: skyblue; */
}

.marker {
	margin          : 0 10px;
	width           : 16px;
	height          : 16px;
	border-radius   : 50%;
	background-color: #e7e7e7;
	transition      : all 800ms;
}

.markerOn {
	background-color: #08c1a0;
}

.info {
	margin-bottom      : 16px;
	font-size          : 14px;
	color              : #747d8c;
	/* background-color: #4455E6; */
}

.site-footer {
	margin           : 18px auto 30px;
	padding          : 0 16px;
	color            : #667085;
	font-size        : 12px;
	line-height      : 1.8;
	text-align       : center;
	letter-spacing   : 0.2px;
}

.site-footer a {
	color          : #3d4ea6;
	text-decoration: none;
}

.site-footer a:hover {
	text-decoration: underline;
}

.site-footer .footer-links,
.site-footer .footer-row {
	display       : flex;
	justify-content: center;
	align-items   : center;
	flex-wrap     : wrap;
	gap           : 6px 10px;
	margin        : 0;
}

.site-footer .footer-links {
	margin-bottom: 8px;
	color        : #4b5563;
	font-size    : 13px;
}

.site-footer .split {
	color:#a7acb8;
}

.site-footer .footer-item {
	display    : inline-flex;
	align-items: center;
	gap        : 4px;
}

.site-footer .footer-item img {
	vertical-align: middle;
}

.site-footer .footer-contact {
	margin-top: 6px;
}

.appBox {
	display            : flex;
	margin-left        : 16px;
	width              : calc(100% - 32px);
	font-size          : 0.6rem;
	margin-top         : 130px;
    gap: 10px;
	/* background-color: pink; */
}

.appImg {
	display         : flex;
	justify-content : center;
	align-items     : center;
	width           : 4.5rem;
	height          : 4.5rem;
	border-radius   : 10px;
	/* background-color: #111111; */
	box-shadow      : rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}

.appImg img {
	max-width: 80%;
}

.appInfo {
	flex               : 1;
	display            : flex;
	flex-direction     : column;
	justify-content    : space-between;
	align-items        : start;
	padding-left       : 0.5rem;
	/* background-color: #4455E6; */
}

.appName {
	color              : #000;
	font-size          : 1rem;
	font-weight        : 700;
	position           : relative;
	top                : .5rem;
	/* background-color: #fff; */
}

.introduced {
	font-size          : 0.8rem;
	/* background-color: #fff; */
}

.numLeft {
    text-align: left;
}

.number {
	font-size          : 0.8rem;
	display            : flex;
	justify-content    : space-between;
	width              : 100%;
	position           : relative;
	top                : -.5rem;
	/* background-color: #fff; */
}

.distribute-content .desc {
	width           : calc(100% - 32px);
	margin          : 0 auto;
	padding         : 10px;
	background-color: #fff;
	text-align      : left;
	font-size       : 14px;
	line-height     : 1.4;
	box-sizing      : border-box;
	color           : #707070;
	font-weight     : 600;
	max-width       : 640px;
}

.distribute-content .desc .title {
	display    : block;
	font-size  : 18px;
	line-height: 1.4;
}

.distribute-content .download-code {
	color     : #666;
	width     : 160px;
	overflow  : hidden;
	margin    : 35px auto 0;
	text-align: center;
}

.distribute-content .download-code img {
	width : 146px;
	height: 146px;
}

.distribute-content .download-code p {
	margin-top: 10px;
}

.distribute-content .tip {
	font-size : 14px;
	color     : #666;
	text-align: center;
	margin-top: 5px;
}

#mask-tip {
	width   : 92%;
	margin  : 5px 4%;
	opacity : 1;
	z-index : 1060;
	position: relative;
}

.modal {
	width           : 92%;
	max-width       : 690px;
	margin          : 120px auto;
	z-index         : 1060;
	background-color: #FFF;
	border-radius   : 10px;
	padding         : 20px 0;
	box-sizing      : border-box;
}

.modal-head {
	text-align   : center;
	border-bottom: 1px solid #efefef;
	font-size    : 22px;
	color        : #666;
}

.modal-head p {
	margin-top: 0;
}

.modal-body {
	padding  : 0 15px;
	font-size: 14px;
}

.modal-body p {
	margin: 30px 0;
}

.modal-btn-wrap {
	text-align: center;
}

.modal-btn-wrap .btn {
	width        : 82px;
	padding      : 6px 12px;
	border-radius: 4px;
}

.btn-bor {
	color     : #08c1a0;
	background: transparent;
	border    : 1px solid #08c1a0;
}

.modal-btn-wrap .btn-bor {
	margin-right: 30px;
}

.btn-main {
	color     : #fff;
	background: #161616;
	border    : 1px solid #2d2d2d;
}

.swiper-scrollbar {
	background: transparent !important;
}