/*!
 * EHI V1.0
 * 2021 The zeta Authors
 * zeta digital lab (http://www.zetalive.com)
 * Licensed under MIT
 */
@charset "utf-8";
/* 全局████████████████████████████████████████████████████████████*/
*,
*::before,
*::after {
  box-sizing: border-box;
}
html {
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
 	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	
}
body {
	margin: 0;
	background-color: #f6f6f6;
	font-family: Helvetica, "Arial", "Microsoft YaHei", "PingFang SC", "SimSun";
	font-size: 14px;
	line-height: 1.5;
	font-weight: 400;
	text-align: justify;
	color: rgba(0,0,0,.5)
}
[tabindex="-1"]:focus:not(:focus-visible) {
  outline: 0 !important;
}
footer, header {
	display: block;
}
article {
	display:inline-block;
	}
a {
	text-decoration: none;
	outline: 0;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	color: inherit;
}
img {
  vertical-align: middle;
  border-style: none;
}
ul, li {
	padding: 0;
	margin: 0;
}
li {
	list-style-type: none;
	padding-top: 4px;
}
hr {
	margin: 16px auto;
	border: 0;
	height: 0;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
}

/* 自定义通用████████████████████████████████████████████████████████████*/
/*字体大小------------------------------------------------------------------*/
.icon_xs {
	background: #ddd;
    width: 24px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    display: inline-block;
	}
/*字体大小------------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
	font-family: inherit;
	font-weight: 500;
	margin: 0;
	color: inherit;
}
h1, .h1 {font-size:2.6rem;}
h2, .h2 {font-size:2.2rem;}
h3, .h3 {font-size:1.8rem;}
h4, .h4 {font-size:1.2rem;}
h5, .h5 {font-size:1rem;}
h6, .h6 {font-size:12px;}
button, button:focus {
	outline: 0!important;
}
.font_xs {
	font-size:12px;
	}
.font_sm {
	font-size:16px;
	}
.font_md {
	font-size:18px;
	}
.font_lg {
	font-size:20px;
	}
/*行高------------------------------------------------------------------*/
.line_xs { line-height:32px;}
.line_sm { line-height:40px;}
.line_md { line-height:48px;}
.line_lg { line-height:56px;}
/*2行文字------------------------------------------------------------------*/
.text_2l {
	text-overflow: -o-ellipsis-lastline;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
/*清除浮动------------------------------------------------------------------*/
.clearfix:after{
display:block;
content:" ";
clear:both;
    }
/* 结束底线------------------------------------------------------------------*/
.end {
	border-top: 1px dashed rgba(0,0,0,.1);
	width: 100%;
	text-align: center;
	font-size: 13px;
	line-height: 40px;
	color: #ccc;
	margin-top: 8px;
	margin-bottom:8px;
}
/* 角标------------------------------------------------------------------*/
.superscript {
	font-size: 12px;
	position: absolute;
	z-index: 9998;
	width: 56px;
	text-align: center;
	padding-top: 3px;
	top: -3px;
	right: -20px;
	transform: rotate(45deg);
	background: #999;
	color: #fff;
	
}
/*圆角------------------------------------------------------------------*/
.rad_sm {
	border-radius:4px;
	overflow:hidden;
	}
.rad_sm_top {
	border-radius:4px 4px 0 0;
	overflow: hidden;
	}
.rad_sm_down {
	border-radius:0 0 4px 4px;
	overflow: hidden;
	}
.rad_sm_left {
	border-radius:4px 0 0 4px
	overflow: hidden;
	}
.rad_sm_right {
	border-radius:0 4px 4px 0;
	overflow: hidden;
	}
.rad {
	border-radius:8px;
	overflow: hidden;
	}
.rad_top {border-radius:8px 8px 0 0;}
.rad_down {border-radius:0 0 8px 8px;}

.rad_md {
	border-radius:16px;
	overflow:hidden;
	}
.rad_lg {
	overflow:hidden;
	display:inline-block;
	
	}
/*布局------------------------------------------------------------------*/
.row:after,
.row_xs:after,
.panel:after,
.panel_con:after,
.panel_sm:after,
.panel_lg:after
{
display:block;
content:" ";
clear:both;
　　}
/*页面整体///////////////////////////////*/
.page {
	padding-left:0;
	padding-right:0;
	}
.page_md {
	padding-left:8px;
	padding-right:8px;
	}
.page_lg {
	padding-left:12px;
	padding-right:12px;
	}
/*区块///////////////////////////////*/
.row_xs {
	margin:0 16px;
	}
.row_sm {
	margin:0 8px;
	}
.row_min {
	margin:0 4px;
	}
.row {
	margin-right: 0;
	margin-left: 0;
}
.row_md {
	margin-right: -4px;
	margin-left: -4px;
}
.row_lg {
	margin-right: -12px;
	margin-left: -12px;
}
/*栅格///////////////////////////////*/
.col_xs, .col_2, .col_3, .col_4, .col_5,
.col_3a, .col_4a, .col_5a, .col_auto {
	float: left;
	position: relative;
	min-height: 1px;
	
}
.col_line  {
	overflow: hidden;
	position: relative;
	min-height: 1px;
	}
.col_xs {
	display:inline-block;
}
.col_5 {
	width: 20%
}
.col_5a {
	width: 80%
}
.col_4 {
	width: 25%
}
.col_4a {
	width: 75%
}
.col_3 {
	width: 33.33333333%
}
.col_3a {
	width: 66.66666666%
}
.col_2 {
	width: 50%
}
.col_1 {
	width: 100%;
	clear:both
}
/*内距///////////////////////////////*/
.panel_o {
	margin:4px;
	background:#f4f4f4;
	overflow:hidden;
	border-radius:4px;
	position: relative;
}
.panel_xs {
	padding:8px;
	}
.panel_sm {
	padding:0px;
	margin-bottom: 8px;
}
.panel_con {
	padding-left:8px;
	padding-right:8px;
	padding-bottom:8px;
	}
.panel {
	padding: 8px;
	margin-bottom: 8px;
}
.panel_md {
	padding: 0px;
	margin-bottom: 16px;
}
.panel_lg {
	padding:16px;
	margin-bottom: 16px;
}
.panel_top { padding-bottom:0; margin-bottom:-16px;}
/*居左右------------------------------------------------------------------*/
.pull_right {
	float: right;
}
.pull_left {
	float: left;
}
/*文本对齐方式------------------------------------------------------------------*/
.text_left {
	text-align:left;
	}
.text_right {
	text-align:right;
	}
.text_center {
	text-align:center;

	}

/*按钮------------------------------------------------------------------*/
.btn {
	display: inline-block;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-appearance: button;
	text-transform: none;
	overflow: visible;
	cursor: pointer;
	color: inherit;
	height: 32px;
	padding: 0 16px;
	border-radius: 2px;
	border: 1px solid rgba(0,0,0,.06);
	background: rgba(0,0,0,.06);
	text-align: center;
	text-decoration: none;
	margin: 4px 2px;
}
/*按钮圆边///////////////////////////////*/
.btn_rad {
	border-radius: 16px;
}
/*按钮大///////////////////////////////*/
.btn_lg {
	height: 40px;
	padding: 0 24px;
	font-size: 1.1rem;
}
/*按钮大圆边///////////////////////////////*/
.btn_lg_rad {
	border-radius: 20px;
}
/*按钮小///////////////////////////////*/
.btn_xs {
	height: 24px;
	padding: 0 12px;
	font-size: 12px;
}
/*按钮小圆边///////////////////////////////*/
.btn_xs_rad {
	border-radius: 12px;
}
/*投影------------------------------------------------------------------*/
.shadow {
 background:background:#0068FF;
	color: #FFF;
	z-index: 9999;
	border: 0px solid #FFF !important;
	box-shadow: 20px 40px 60px -10px rgba(0,104,255,.6);



}
/* 信息提示------------------------------------------------------------------*/
.badge {
	width: 16px;
	height: 16px;
	background: #FF5733;
	color: #FFF;
	position: absolute;
	border-radius: 50%;
	top: -4px;
	right: 12px;
	line-height: 16px;
	text-align: center;
}
/* 自定义组件████████████████████████████████████████████████████████████*/
/* 头部通用===========================================*/
.topbg {
	background: #ededed;
	border-radius: 0 0 0 0;
	position: relative;
	overflow: hidden;
}
.search_box {
	width: 100%;
	padding: 12px;
	padding-top: 0px;
	position: fixed;
	z-index: 9999;
	background: #ededed;
	border-radius: 0 0 8 px 8px;
}
.search {
	width: 100%;
	border: none;
	padding: 0 12px;
	height: 34px;
	border-radius: 17px;
	color: #aaa;
	background: #ddd;
	font-size: 14px;
}
.search_ico {
	position: absolute;
	left: 32%;
	top:1px;
	font-size: 16px !important;
	color: #999;
	padding:8px;
}
/* banner===========================================*/
/* banner圆角///////////////////////////////*/
.banner_rad {
	border-radius: 8px;
	overflow: hidden;
}
/* banner方角///////////////////////////////*/
.banner {
	overflow: hidden;
}
/* 底部导航===========================================*/
.footer {
	width: 100%;
	padding-bottom: 32px;
	position: fixed;
	bottom: 0;
	text-align: center;
	background: #FFF;
	line-height: 1.2;
	z-index: 9999;
	padding-left:16px;
	padding-right:16px;
}
.footer::after {
	content: '';
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	border-top: 1px solid #ddd;
	transform: scaleY(.5) translateZ(0);
}
.footer .row {
	margin-top: 9px;
}
.footer_diy_bg {
	width: 80px;
	position: absolute;
	left: 50%;
	transform: translate(-50%, -70%);
	z-index: 1;
}
.footer_diy_ico {
	width: 40px;
	height: 40px;
	background: #FF5733;
	border-radius: 50%;
	position: absolute;
	left: 50%;
	transform: translate(-50%, -24%);
	z-index: 2;
	line-height: 40px;
	color: #FFF;
	box-shadow: 0 16px 16px -14px #CC4629;
}
/*购买底部------------------------------------------------------------------*/
.payment {
	width:100%;
	height:56px;
	position:fixed;
	bottom:56px;
	background:#f9f9f9;
	line-height:56px;
	padding:0 12px;
	}
.payment:after {
	content: '';
	width: 100%;
	position: absolute;
	top: 0; 
	left: 0;
	border-top:1px solid #ddd;
	transform: scaleY(.5) translateZ(0);
	}
/* 表单组件████████████████████████████████████████████████████████████*/
.form_group {
	position: relative;
	display: inline-block;
}
/*输入框------------------------------------------------------------------*/
.int_control {
    height: 24px;
    text-align: center;
    border: none;
	}
/*复选框------------------------------------------------------------------*/
.int_checkbox {
	display: inline-block;
	width: 20px;
	height: 20px;
	position: relative;
	border: 2px solid #999;
	background: #fff;
	vertical-align: middle;
	border-radius: 50%;
}
.int_checkbox input {
	display: none;
}

.int_checkbox span {
	position: absolute;
	color: #FFF;
	line-height: initial;
	width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    font-size: 14px;
	top: -2px;
    left: -2px;
    background: #FF5733;
	border-radius:50%;
}
label {
	vertical-align: middle;
	padding: 4px 4px 4px 24px;
    margin-left: -24px;
    position: relative;
}
input[type="checkbox"] + span {
	display: none;
}
input[type="checkbox"]:checked + span {
	display: block;
}
/* 产品列表████████████████████████████████████████████████████████████*/
.list_wrapper {
	-moz-column-count: 2;
	-webkit-column-count: 2;
	column-count: 2;
	-moz-column-gap: 0;
	-webkit-column-gap: 0;
	column-gap: 0;
}
.list_box {
	-moz-page-break-inside: avoid;
	-webkit-column-break-inside: avoid;
	break-inside: avoid;
	position: relative;
	overflow: hidden;
	transform: rotate(0deg);
	border:1px solid rgba(0,0,0,0);
}