
html,
body,
div,
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
dl,
dt,
dd,
ol,
form,
input,
textarea,
th,
td,
select {
		margin: 0;
		padding: 0
}

* {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box
}

html,
body {
		min-height: 100%
}

body {
		font-family: Helvetica, Pingfang SC, Microsoft YaHei, STHeiti, Verdana, Arial, Tahoma, sans-serif;
		font-size: 14px;
		color: #333;
		background: #fff;
		position: relative
}

h1,
h2,
h3,
h4,
h5,
h6 {
		font-weight: normal
}

ul,
ol {
		list-style: none
}

img {
		border: none;
		vertical-align: middle
}

a {
		text-decoration: none
}

a:visited {
		text-decoration: none
}

a:hover {
		text-decoration: none
}

a:active {
		text-decoration: none
}

table {
		border-collapse: collapse;
		table-layout: fixed
}

input,
textarea {
		outline: none;
		border: none
}

textarea {
		resize: none;
		overflow: auto
}

.clearfix {
		zoom: 1
}

.clearfix:after {
		content: ".";
		width: 0;
		height: 0;
		visibility: hidden;
		display: block;
		clear: both;
		overflow: hidden
}

/* 本案例CSS*/
header {
		position: relative;
		z-index: 999;
		border-bottom: 1px solid #8970b8;
		height: auto;
		box-sizing: border-box;

	white-space: nowrap;
  
   /* 隐藏滚动条 */
   scrollbar-width: none; /* firefox */
   -ms-overflow-style: none; /* IE 10+ */
}

header::-webkit-scrollbar {
	display: none; /* Chrome Safari */
}



.wrap {
		width: auto;
		margin: 0 auto;
}

#nav {
		display: flex;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		flex-wrap: wrap;
}

.logo {
		width: 230px;
		overflow: hidden;
}

.logo a {
		display: block;
}

.logo a img {
		max-width: 100%;
}

ul.nav {
		display: inline-flex;
		flex: 1;
		padding-left: 50px;
		justify-content: flex-end;
}

li.nav-item {
		flex: 1;
}

li.nav-item>a {
		display: block;
		text-align: center;
		line-height: 100px;
		font-size: 16px;
		position: relative;
}

li.nav-item>a::before {
		display: none;
		content: '';
		position: absolute;
		left: 50%;
		bottom: 0;
		transform: translateX(-50%);
		border-width: 0 10px 10px;
		border-style: solid;
		border-color: transparent transparent #119f0f;
		position: absolute;
}

li.nav-item:hover>a,
li.nav-item.active>a {
		color: #119f0f;
}

li.nav-item:hover>a::before,
li.nav-item.active>a::before {
		display: block;
}

/* 二级菜单 */
.subMenu {
	position: relative;
		display: none;
		position: absolute;
		top: 80px;
		left: 0;
		width: 100%;
		height: auto !important;
		overflow-x: auto;
		background: linear-gradient(to right top, #bf4fb0fa 0%, #1fa8c4 100%);
}

.subMenu>ul {
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		justify-content: center;
	margin-top: 10px;
}

.subMenu>ul>li>a {
	display: block;
	padding: 0 15px;
	text-align: center;
	line-height: 50px;
	color: #fff;
	font-size: 1.4em;
}

.nav {
	height: auto;
	background: transparent;
}

.nav .active::after {
	content: none;
}

.menu-all {
	height: 80px;
	line-height: 80px;
}

.menu-all a,
.menu-all font {
	padding: .75rem 2rem;
    font-size: 1.52em;
    line-height: 2rem;
		color: #fff;
		font-family: balboa, sans-serif;
		font-weight: bold;
		letter-spacing: 1px;
}

.menu-all a,
.menu-all font {
	-webkit-transition: background-color 0.3s;
}



.menu-all:hover {
	background-color: rgba(255, 255, 255, .2);
}

.content-html {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	max-width: 1200px;
	margin: 0px auto;
}

.content-html .gradHtml {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 15px;
}

.content-html .gradUrl {
	width: 100px;
	height: 100px;
	display: block;
}

.show-hover {
	background-color: rgb(246 243 243 / 91%);
	border-radius: 14px;
	border: 1px solid #0776f6ba;
	font-weight: 800;
}

.fir {
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	-webkit-background-size: 200% 100%;
	-webkit-animation: masked-animation 4s liner infinite;
	font-size: 80px;
  font-family: fantasy;
}

.text1 {
  background-image: -webkit-linear-gradient(left,blue,#0c2c2c 10%,#a40922 20% ,#911d91 30%, #0c4860 40%,#b42495 50%,#000 60%,#490c7d 70% ,#1036cf 80%,#505 90%,#0fee0f 100%);
}

.content-html .sons {
	margin-top: 8px;
	text-shadow: 1px 1px 0 #1912c0, 1px 1px 0 blue, 1px 1px red, 1px 3px 0 black;
}

.content-html a:hover {
	background: #9ac6fa;
	color: #8229c9 !important;
	font-weight: bold;
	border-radius: 8px;
}

/*  */
.form-control {
	border: 1px solid #eaeaea;
	font-weight: 300;
	outline: none;
	box-shadow: none;
	height: 40px;
}

#message {
	height: 110px;
	resize: none;
}

.btn-submit {
	width: 100%;
	background-color: #5697e3;
	color: #fff;
	font-size: 26px;
	font-family: balboa,sans-serif;
	font-weight: 300;
	letter-spacing: 2px;
	text-transform: uppercase;
	border-radius: 3px;
	margin-top: 5px;
	border-bottom: 1px solid #2f9697;
	box-shadow: none;
}

@media (max-width: 720px) {
	.subMenu {
		top: 127px;
	}

	.subMenu>ul>li>a{
		display: block;
		padding: 0 10px;
		text-align: center;
		line-height: 35px;
		color: #fff;
		font-size: 0.9em;
	}

	.content-html .sons{
		margin-top: 2px;
	}
}
