div {
	box-sizing: border-box;
}

body {
	margin: 0;
	color: #333333;
	font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
}

#app {
	width: 100%;
	height: 100%;
}

[v-cloak] {
	display: none;
}

.adaptable-container {
	width: 100%;
	/* display: flex;
	justify-content: center; */
	overflow: hidden;
}

.adaptable-content {
	width: 1200px;
	margin: 0 auto;
	/* flex: 1;
	max-width: 1600px;
	min-width: 720px; */
}

.top-container {
	width: 100%;
	height: 804px;
	position: relative;
	margin-bottom: 24px;
}

.top-logo-nav-container {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	color: #FFFFFF;
	z-index: 1;
	overflow: visible;
}

.top-logo-nav {
	display: flex;
	padding-top: 30px;
}

.nav-logo-container {
	margin-right: 42px;
}

.nav-logo-content {
	width: 98px;
	height: 70px;
	margin: 0 40px 20px 0;
}

.nav-logo {
	display: block;
	width: 100%;
	height: 100%;
	cursor: pointer;
}

.stock-code {
	font-size: 16px;
}

.top-nav-container {
	flex: 1;
	position: relative;
}

.top-bar {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

.top-bar-text-a {
	font-size: 14px;
}

/* 
.top-search-bar {
	width: 18.59vw;
	border-radius: 0.52vw;
	border: 0.1vw solid #FFFFFF;
	margin-left: 2.03vw;
	padding: 0.36vw .78vw 0.36vw 1.51vw;
	display: flex;
	align-items: center;
}

.search-input-container {
	flex: 1;
	display: flex;
	align-items: center;
	overflow: hidden;
	border-right: 0.1vw solid #FFFFFF;
	padding-right: .52vw;
}

.search-input {
	display: block;
	flex: 1;
	font-size: 1.04vw;
	color: #FFFFFF;
	background-color: transparent;
	border: none;
}

.search-input:focus {
	outline: none;
}

.search-input::-webkit-input-placeholder {
	color: #F0F0F0;
}

.search-input::-moz-placeholder {
	color: #F0F0F0;
}

.search-input:-moz-placeholder {
	color: #F0F0F0;
}

.search-input:-ms-input-placeholder {
	color: #F0F0F0;
}

.search-icon-container {
	flex: none;
	padding-left: .52vw;
	cursor: pointer;
}

.search-icon-container .icon-search {
	font-size: 1.56vw;
	color: #FFFFFF;
}
 */
.nav-bar {
	margin-top: 32px;
	width: 100%;
	display: flex;
	align-items: center;
}

.nav-list {
	flex: 1;
	display: flex;
	align-items: baseline;
}

.nav-item {
	margin-right: 34px;
	height: 100%;
	font-size: 18px;
	padding-bottom: 6px;
	display: flex;
	align-items: center;
	position: relative;
	cursor: pointer;
}

.nav-item:hover,
.active-nav {
	font-weight: bold;
	border-bottom: 4px solid #FFFFFF;
}

.first-nav {
	/* font-size: 1.67vw;
	font-weight: bold;
	padding-bottom: 0.74vw; */
}

.nav-subs {
	position: absolute;
	top: calc(100% + 14px);
	left: -30px;
	padding: 16px 30px 0;
	background: rgba(0, 0, 0, .4);
	/* transform: translateX(-50%); */
	display: flex;
	flex-direction: column;
	/* align-items: center; */
	cursor: initial;
	font-weight: initial;
}

.slide-fade-enter-active,
.slide-fade-leave-active {
	transition: all .3s ease;
}

.slide-fade-enter,
.slide-fade-leave-to {
	transform: translateY(10%);
	opacity: 0;
}

.nav-subs-item {
	width: max-content;
	margin-bottom: 20px;
	/* padding: 8px 0;
	text-align: center;
	background: rgba(51, 51, 51, 0.6);
	border: 1px solid #FFFFFF; */
	font-size: 16px;
	cursor: pointer;
}

.sub-list {
	margin-top: 10px;
	width: 100%;
	padding: 26px 0 2px;
	display: flex;
	flex-wrap: wrap;
	background: rgba(0, 0, 0, .4);
}

.sub-list-item {
	/* flex: none; */
	width: 20%;
	margin: 0 8px 24px 8px;
	/* padding: 8px 0; */
	text-align: center;
	/* background: rgba(51, 51, 51, 0.6);
	border: 1px solid #FFFFFF; */
	font-size: 16px;
	cursor: pointer;
}

.sub-list-item:hover,
.nav-subs-item:hover {
	font-weight: bold;
	/* color: #333; */
	/* background: rgba(255, 255, 255, 0.6); */
}

.banner-container {
	max-width: 100%;
	min-width: 1200px;
	height: 100%;
	position: relative;
}

.module-banner {
	height: 460px;
}

.swiper-banner,
.swiper-img-text,
.swiper-banner-item {
	width: 100%;
	height: 100%;
}

.swiper-banner-item {
	display: flex;
	align-items: center;
	background-color: #F4F4F4;
	position: relative;
}

.banner-img {
	width: 100%;
	height: 100%;
	background-position: center;
	background-size: cover;
}

.banner-mask {
	position: absolute;
	top: 0;
	height: 30%;
	left: 0;
	right: 0;
	background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
	z-index: 1;
}

.banner-msg {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 16px 30px;
	font-size: 18px;
	color: #FFFFFF;
	background: rgba(0, 0, 0, 0.4);
	z-index: 1;
}

.banner-info-container {
	position: absolute;
	top: 0;
	bottom: 0;
}

.banner-info {
	height: 100%;
	padding: 80px 0;
	display: flex;
}

.LC, .RC, .CC {
	align-items: center;
}

.LB, .RB, .CB {
	align-items: flex-end;
}

.CT, .CB, .CC {
	justify-content: center;
}

.RT, .RB, .RC {
	justify-content: flex-end;
}

.RT .banner-info-content, .RB .banner-info-content, .RC .banner-info-content {
	align-items: flex-end;
}

.banner-info-content {
	width: 488px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.CT .banner-title, .CB .banner-title, .CC .banner-title {
	text-align: center;
}

.banner-title,
.banner-rich-text {
	width: 100%;
}

.banner-title {
	font-size: 20px;
	font-weight: bold;
	color: #FFFFFF;
}

.banner-rich-text {
	margin: 10px 0 30px;
}

.banner-btn {
	padding: 0 10px;
	background: #FFFFFF;
	border-radius: 4px;
	border: 1px solid #007AFF;
	font-size: 14px;
	font-weight: bold;
	color: #007AFF;
}

/* 
.swiper-banner-bullet {
	width: 0.1vw;
	height: 0.1vw;
}

.swiper-banner-bullet {
	width: 0.1vw;
	height: 0.1vw;
	display: inline-block;
	border-radius: 100%;
	margin: 0 0.06vw;
	cursor: pointer;
	background: rgba(255, 255, 255, .5);
}

.swiper-banner-bullet-active {
	background: #002349;
}
 */
.swiper-button-next,
.swiper-button-prev {
	padding: 40px;
	border-radius: 50%;
	background: rgba(51, 51, 51, 0.4);
	color: #FFFFFF;
}

/* 
.swiper-button-next:after,
.swiper-button-prev:after {
	font-size: 70px;
}
 */

.top-container-a {
	width: 100%;
	position: relative;
	/* margin-bottom: 50px; */
	z-index: 2;
}

.top-logo-nav-container-a {
	width: 100%;
	overflow: visible;
}

.top-logo-nav-a {
	display: flex;
	padding-top: 30px;
}

.nav-logo-container-a {
	margin-right: 42px;
}

.nav-logo-content-a {
	width: 98px;
	height: 70px;
	margin: 0 40px 20px 0;
}

.nav-logo-a {
	display: block;
	width: 100%;
	height: 100%;
	cursor: pointer;
}

.stock-code-a {
	font-size: 16px;
}

.top-nav-container-a {
	flex: 1;
	position: relative;
}

.top-bar-a {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

.top-bar-text-a {
	font-size: 14px;
}

/* 
.top-search-bar {
	width: 18.59vw;
	border-radius: 0.52vw;
	border: 0.1vw solid #0D1540;
	margin-left: 2.03vw;
	padding: 0.36vw .78vw 0.36vw 1.51vw;
	display: flex;
	align-items: center;
}

.search-input-container {
	flex: 1;
	display: flex;
	align-items: center;
	overflow: hidden;
	border-right: 0.1vw solid #0D1540;
	padding-right: .52vw;
}

.search-input {
	display: block;
	flex: 1;
	font-size: 1.04vw;
	background-color: transparent;
	border: none;
	line-height: initial;
}

.search-input:focus {
	outline: none;
}

.search-icon-container {
	flex: none;
	padding-left: .52vw;
	line-height: initial;
}

.search-icon-container .icon-search {
	font-size: 1.56vw;
}
 */
.nav-bar-a {
	margin-top: 32px;
	width: 100%;
	display: flex;
	align-items: center;
}

.nav-list-a {
	flex: 1;
	display: flex;
	align-items: baseline;
}

.nav-item-a {
	margin-right: 34px;
	height: 100%;
	font-size: 18px;
	padding-bottom: 6px;
	display: flex;
	align-items: center;
	position: relative;
	cursor: pointer;
	border-bottom: 4px solid #FFFFFF;
}

.nav-item-a:hover,
.active-nav-a {
	color: #007AFF;
	border-bottom: 4px solid #007AFF;
}

.nav-subs-a {
	position: absolute;
	top: calc(100% + 5px);
	left: -20px;
	padding: 26px 20px 4px;
	background: rgba(255, 255, 255, 1);
	/* transform: translateX(-50%); */
	display: flex;
	flex-direction: column;
	/* align-items: center; */
	cursor: initial;
	color: #333333;
	box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.3);
}

.nav-subs-item-a {
	width: max-content;
	margin-bottom: 22px;
	/* padding: 8px 0;
	text-align: center;
	background: rgba(51, 51, 51, 0.6);
	border: 1px solid #FFFFFF; */
	font-size: 16px;
	cursor: pointer;
}

.sub-list-a {
	position: absolute;
	top: 67px;
	/* right: -1000px;
	padding: 26px 1000px 2px; */
	width: 100%;
	padding: 26px 0 2px;
	box-sizing: content-box;
	display: flex;
	flex-wrap: wrap;
	background: rgba(255, 255, 255, 1);
	box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.3);
}

.sub-list-item-a {
	/* flex: none; */
	width: calc(20% - 16px);
	margin: 0 8px 24px 8px;
	/* padding: 8px 0; */
	text-align: center;
	/* background: rgba(51, 51, 51, 0.6);
	border: 1px solid #FFFFFF; */
	font-size: 16px;
	cursor: pointer;
}

.sub-list-item-a:hover,
.nav-subs-item-a:hover {
	color: #007AFF;
	/* background: rgba(255, 255, 255, 0.6); */
}

.module-container {
	width: 100%;
	margin-bottom: 26px;
}

.no-module {
	height: 800px;
}

.module-title {
	margin-top: 24px;
	display: flex;
	align-items: center;
	font-size: 28px;
	font-weight: bold;
}

/* 
.left-title-left-line {
	width: 0.42vw;
	height: 3.44vw;
	display: block;
	margin-right: 1.35vw;
}

.left-title-right-line {
	height: 1.87vw;
	display: block;
	margin-left: 0.83vw;
}
 */
.center-title {
	justify-content: center;
}

/* 
.center-title-left-line {
	height: 1.87vw;
	display: block;
	margin-right: 0.83vw;
	transform: rotateY(180deg);
}

.center-title-right-line {
	height: 1.87vw;
	display: block;
	margin-left: 0.83vw;
}
 */
.right-title {
	justify-content: flex-end;
}

/* 
.right-title-left-line {
	height: 1.87vw;
	display: block;
	margin-right: 0.83vw;
	transform: rotateY(180deg);
}

.right-title-right-line {
	width: 0.42vw;
	height: 3.44vw;
	display: block;
	margin-left: 1.35vw;
	transform: rotateY(180deg);
}
 */
.img-table-container {
	overflow: visible;
}

.img-table {
	display: flex;
	flex-wrap: wrap;
}

.img-table-item {
	width: 25%;
	margin-bottom: 8px;
	padding: 0 8px;
}

.img-table-item-content {
	width: 100%;
	padding-top: 56.25%;
	height: 0;
	position: relative;
	background-position: center;
	background-size: cover;
	cursor: pointer;
	transition: all ease .5s;
}

.img-table-item-content:hover {
	transform: scale(1.28);
	box-shadow: 0 0 0.41vw 0.41vw rgba(0, 0, 0, 0.2), 0 0.05vw 0.15vw 0 rgba(0, 0, 0, 0.5);
	z-index: 1;
}

.img-text-table {
	display: flex;
	padding: 16px 0;
	/* 显示卡片阴影 */
}

.swiper-img-text {
	overflow: visible;
}

.img-text-table-item {
	width: 33.33%;
	/* padding: 0 4px; */
	padding: 8px;
	flex: none;
	transition: all .5s ease;
	cursor: pointer;
}

.img-text-table-item:hover {
	/* transform: scale(1.28); */
	z-index: 1;
}

.img-text-table-item-content,
.img-text-table-item-content-a {
	width: 100%;
	border: 1px solid #EEEEEE;
	overflow: hidden;
	transition: all .3s ease;
}

.img-text-table-item-content-a {
	border-radius: 20px;
}

.img-text-table-item:hover .img-text-table-item-content,
.img-text-table-item:hover .img-text-table-item-content-a {
	/* border: none; */
	box-shadow: 0px 0px 8px 8px rgba(0, 0, 0, 0.2), 0px 1px 3px 0px rgba(0, 0, 0, 0.5);
}

.img-text-table-item-img,
.img-text-table-item-img-a {
	width: 100%;
	padding-top: 74%;
	background-position: center;
	background-size: cover;
}

.img-text-table-item-img-a {
	padding-top: 60%;
}

.img-text-table-item-title,
.img-text-table-item-title-a {
	width: 100%;
	padding: 20px 0;
	font-size: 22px;
	color: #333333;
	text-align: center;
	transition: all .5s ease;
}

.img-text-table-item:hover .img-text-table-item-title,
.img-text-table-item:hover .img-text-table-item-title-a {
	color: #FFFFFF;
	background-color: #2DA9E5;
	font-weight: bold;
}

.icon-table-container {
	width: 100%;
	/* padding-top: 27%; */
	/* height: 26.77vw; */
	background-position: center;
	background-size: cover;
	background-image: url(../img/test.jpg);
	position: relative;
	overflow: visible;
}

.icon-table-container-mask {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	align-items: center;
	background: rgba(0, 0, 0, 0.5);
}

.icon-table {
	padding: 50px 0;
	flex: none;
	display: flex;
	flex-wrap: wrap;
}

.img-text-container {
	/* padding: 5.2vw 0;
	background-color: #F4F4F4; */
}

/* .img-text-content {
	transition: all .5s ease-out;
}

.img-text-content:hover {
	box-shadow: 0 0 0.42vw 0.42vw rgba(0, 0, 0, 0.2);
} */

.img-text-content-img {
	width: 100%;
	padding-top: 22%;
	background-position: center;
	background-size: cover;
	background-image: url(../img/test.jpg);
}

.img-text-content-text-container {
	width: 100%;
	/* padding: 1.56vw 1.56vw;
	background-color: #FFFFFF; */
}

.bottom-container {
	padding: 50px 0 30px;
	background-color: #000000;
	overflow: visible;
}

.service-guide-container {
	width: 100%;
	display: flex;
}

.service-container {
	flex: none;
	margin-right: 30px;
}

.logo-code-container,
.link-address-container {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.logo-img,
.code-img {
	display: block;
	width: 88px;
	margin-bottom: 22px;
}

.link-container {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.phone-address-text {
	font-size: 16px;
	color: #FFFFFF;
	margin-bottom: 22px;
	max-width: 460px;
	text-align: center;
}

.link-item {
	position: relative;
}

.link-icon {
	display: block;
	width: 56px;
	height: 56px;
}

.link-icon-hover-img {
	display: none;
	position: absolute;
	bottom: 110%;
	left: 50%;
}

.link-item:hover .link-icon-hover-img {
	display: block;
}

.guide-container {
	display: flex;
}

.guide-list {
	width: 240px;
}

.guide-title {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 16px;
	color: #FFFFFF;
}

.guide-item {
	font-size: 14px;
	margin-bottom: 14px;
	color: #999999;
	max-width: 100%;
	width: fit-content;
}

.guide-item:hover {
	cursor: pointer;
	color: #FFFFFF;
}

.bottom-footer {
	margin: 50px auto 0;
	border-top: 1px solid rgba(255, 255, 255, .2);
	padding-top: 30px;
}

.copyright,
.technical-support {
	display: flex;
	justify-content: center;
	align-items: center;
	padding-bottom: 14px;
	font-size: 12px;
	color: #DDDDDD;
}

.security-record-icon {
	height: 100%;
	margin-left: 14px;
}

.security-record {
	cursor: pointer;
}

.security-record:hover,
.technical-support:hover {
	color: #FFFFFF;
}

.technical-support {
	padding-bottom: 0;
	cursor: pointer;
}

.float-button-container {
	position: fixed;
	bottom: 200px;
	right: 0;
	cursor: pointer;
	z-index: 2;
}

.float-button {
	width: 45px;
	height: 45px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background-color: #FFFFFF;
	position: relative;
}

.float-button:hover {
	background-color: #343434;
}

.float-button-icon {
	color: #343434;
	font-size: 26px;
}

.float-button:hover .float-button-icon {
	color: #FFFFFF;
}

.float-button-tip {
	display: none;
	position: absolute;
	top: 50%;
	right: calc(100% + 4px);
	transform: translateY(-50%);
}

.float-button-phone {
	height: 100%;
	padding: 0 30px;
	align-items: center;
	background-color: #343434;
	color: #FFFFFF;
	font-size: 18px;
	white-space: nowrap;
}

.float-button-code {
	width: 96px;
	height: 96px;
}

.float-button-code-img {
	display: block;
	width: 100%;
	height: 100%;
}

.float-button:hover .float-button-tip {
	display: flex;
}

.to-top-button {
	background-color: #343434;
	color: #FFFFFF;
	font-size: 14px;
}
