*{box-sizing:border-box;}
:after,:before{box-sizing:border-box;}
*,:after,:before{-webkit-tap-highlight-color:transparent;}
*{-webkit-outline: 0; outline:0;}
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote,dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td  { margin: 0; padding: 0;}
html,body{ height: 100%;}
body, button, input, select, textarea { font: 12px/1.5 'PingFang SC','Helvetica Neue','Microsoft YaHei UI','Microsoft YaHei','Noto Sans CJK SC',Sathu,EucrosiaUPC,Arial,Helvetica,sans-serif; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal;}
address, cite, dfn, em, var { font-style: normal; }
code, kbd, pre, samp { font-family: courier new, courier, monospace; }
small { font-size: 12px; }
ul, ol { list-style: none; }
a, a:hover, a:focus, a:active { display: block; color: inherit; text-decoration: none; cursor: pointer; }
a, a:focus, a:active, input, button, select, textarea { outline: none; }
img, video {width: 100%; height: 100%; object-fit: fill;}
sup { vertical-align: text-top; }
sub { vertical-align: text-bottom; }
legend { color: #000; }
fieldset, img { border: 0; }
button, input, select, textarea { font-size: 100%; }
table { border-collapse: collapse; border-spacing: 0; }
article, aside, details, figcaption, figure, footer,header, hgroup, menu, nav, section,
summary, time, mark, audio, video { display: block; margin: 0; padding: 0; }
mark { background: #ff0; }

/*
 * 通用CSS 调用class
 */

.fontSize22-white { color: #fff; font-size: 0.22rem; }
.fontSize24-white { color: #fff; font-size: 0.24rem; }
.fontSize28-white { color: #fff; font-size: 0.28rem; }
.fontSize30-white { color: #fff; font-size: 0.3rem; line-height: 1; }
.fontSize32-white { color: #fff; font-size: 0.32rem; }
.fontSize38-white { color: #fff; font-size: 0.38rem; }
.fontSize40-white { color: #fff; font-size: 0.4rem; line-height: 1; }
.fontSize50-white { color: #fff; font-size: 0.5rem; line-height: 1; }
.fontSize60-white { color: #fff; font-size: 0.6rem; line-height: 1; }
.fontSize80-white { color: #fff; font-size: 0.8rem; line-height: 1; }
.fontSize100-white { color: #fff; font-size: 1rem; line-height: 1; }
.fontSize102-white { color: #fff; font-size: 1.02rem; line-height: 1; }
.fontSize104-white { color: #fff; font-size: 1.04rem; line-height: 1; }

.txtCen { text-align: center; }
.flexCen { display: flex; flex-direction: column; justify-content: center; align-items: center; left: 0; right: 0; }

/*
 * 头部导航
 */
#head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 200;
	width: 100%;
	height: 0.7rem;
	padding-left: 0.7rem;
	padding-right: 0.4rem;
	background: linear-gradient(to left, rgba(56, 54, 72, 0.8), rgba(56, 54, 72, 0));
}
.head-logo {
	width: 2.43rem;
	height: 0.45rem;
}
.head-nav {
	display: flex;
	align-items: center;
	height: 0.7rem;
}
.head-nav:hover .head-nav-menu-list{
	left: 0;
	opacity: 1;
}
.head-nav-menu {
	display: flex;
	align-items: center;
	position: relative;
	z-index: 10;
	color: #fff;
	font-size: 0.28rem;
	font-weight: bold;
	line-height: 1;
	cursor: pointer;
}
.head-nav-menu:hover { color: #fff; }
.head-nav-menu-list { display: flex; position: relative; left: 6.6rem; opacity: 0; transition: left 1s linear, opacity 1s 300ms linear;}

.head-nav-menu-list > a {
	position: relative; 
	margin-right: 0.2rem; 
	color: #fff; 
	font-size: 0.2rem; 
	font-weight: lighter;
	border-bottom: 2px solid transparent;
}

.head-nav-menu-list > a:hover {
	border-bottom-color: #fff;
}
.head-nav-menu-list > .active:after {
	content: "";
	position: absolute;
	bottom: -2px;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 2px;
	background-color: #fff;
}

.head-nav-menu > .nav-icon {
	width: 0.37rem; 
	height: 0.22rem; 
	margin-right: 0.2rem; 
	background: url(../images/head_icon2.png) left center no-repeat; 
	background-size: 100% 100%;
	animation: rebound 1s linear infinite alternate forwards;
}
@keyframes rebound {
	from { transform: translateX(0.1rem); }
	to { transform: translateX(0); }
} 

/*
 * 底部
 */

.footer, .home-footer { display: flex; justify-content: space-between; align-items: center; width: 100%; height: 0.95rem; padding: 0 0.62rem; background-color: #48485C; }
.home-footer { position: absolute; bottom: 0; left: 0; z-index: 1; }
.footer-txt { color: #fff; font-size: 0.16rem; text-align: center; }
.footer-txt a { display: inline-block; }
.footer-txt a:hover { text-decoration: underline; }
.footer-code { display: flex; align-items: center; text-align: center; }
.footer-code img { width: 0.62rem; height: 0.62rem; }
.footer-code p { color: #fff; font-size: 0.12rem; text-align: center; line-height: 1; }
.footer-code .webo { margin-left: 0.3rem; }