body {
	background-color: #0c132f;
}

.logo {
	margin-bottom: 84px;
	padding-top: 60px;
	text-align: center;
}

.logo img {
	display: block;
	margin: 0 auto;
}

.main {
	width: 1200px;
	margin: 0 auto;
	overflow: hidden;
}

.main section {
	margin-bottom: 80px;
	clear: both;
}

a:hover {
	cursor: pointer;
}

.header {
	position: relative;
	background: url(/2021/DCICHF/images/header.png?v1=1) no-repeat top center;
	height: 812px;
	min-width: 1200px;
	margin-bottom: 30px;
}

.winner-list {
	width: 960px;
	margin: 0 auto 80px;
	text-align: center;
}

.winner-list img {
	width: 100%;
	max-width: 100%;
}

header a {
	display: block;
	width: 163px;
	height: 53px;
	margin: 0 auto;
	position: relative;
	top: 280px;
	background: url(/2021/DCICHF/images/btn.png) no-repeat top center;
	font-size: 20px;
	color: #ffff;
	text-align: center;
	line-height: 53px;
	text-decoration-line: none;
}

.slogan {
	width: 960px;
	height: 202px;
	margin: 0 auto;
	background: url('/2021/DCICHF/images/theme-title@2x.png') no-repeat 50% 50%;
	background-size: 100% 100%;
}

.container-header-common {
	text-align: center;
	font-size: 35px;
	line-height: 35px;
	color: #1efbff;
	margin-bottom: 60px;
}

.container-header {
	background: url(/2021/DCICHF/images/container-header.png) no-repeat top center;
	height: 70px;
}

.container-footer {
	background: url(/2021/DCICHF/images/container-footer.png) no-repeat top center;
	height: 63px;
}

#introduce .container {
	width: 880px;
	border: 2px solid #22dffc;
	border-top: none;
	border-bottom: none;
	margin: 0 auto;
	padding: 0 35px;
}

#introduce p {
	font-size: 20px;
	color: #c2c7e3;
	line-height: 36px;
	text-indent: 2em;
	text-align: justify;
}

#introduce p + p {
	margin-top: 38px;
}

.plan-title {
	background: url(/2021/DCICHF/images/title-plan.png) no-repeat top center;
	height: 38px;
}

.sign-title {
	background: url(/2021/DCICHF/images/sign-title.png) no-repeat top center;
	height: 35px;
}

.mode-title {
	background: url(/2021/DCICHF/images/mode-title.png) no-repeat top center;
	height: 36px;
}

.org-title {
	background: url(/2021/DCICHF/images/org-title.png) no-repeat top center;
	height: 36px;
}

.contact-title {
	background: url(/2021/DCICHF/images/contact-title.png) no-repeat top center;
	height: 36px;
}

.media-title {
	background: url(/2021/DCICHF/images/media-title.png) no-repeat top center;
	height: 36px;
}

.media-des {
	width: 1200px;
	margin: 0 auto;
	height: 354px;
}

.media-des img {
	width: 100%;
	height: auto;
}

.mode-main {
	float: right;
	width: 50%;
}

.mode-info .title {
	position: relative;
	padding-left: 18px;
}

.mode-info .title::before {
	position: absolute;
	left: 0;
	top: 0;
	width: 6px;
	height: 66px;
	background-color: #21d8ff;
	border-radius: 6px;
	content: '';
}

.mode-info .container {
	margin-bottom: 40px;
	width: 500px;
}

.mode-info h3 {
	font-size: 28px;
	font-weight: bold;
	color: #21d8ff;
	margin-bottom: 14px;
}

.mode-info em {
	font-size: 18px;
	color: #d0f7ff;
}

.mode-main p {
	font-size: 14px;
	line-height: 24px;
	padding-left: 16px;
	color: #d0f7ff;
	margin-top: 25px;
}

.prizes-title {
	background: url(/2021/DCICHF/images/prize-title.png) no-repeat top center;
	height: 36px;
}

.unit {
	padding-left: 120px;
	background: url(/2021/DCICHF/images/icons.png) no-repeat top left;
	height: 84px;
	padding-top: 30px;
	margin-bottom: 35px;
}

.unit h3 {
	font-size: 20px;
	color: #21d8ff;
	margin-bottom: 15px;
}

.unit ul {
	overflow: hidden;
}

.unit li {
	float: left;
	font-size: 14px;
	color: #d0f7ff;
	width: 360px;
	line-height: 24px;
}

.unit2 {
	background-position: 0 -150px;
}

.unit3 {
	background-position: 0 -298px;
}

.unit4 {
	background-position: 0 -445px;
}

.unit5 {
	background-position: 0 -710px;
	width: 600px;
	height: 110px;
	padding-top: 0;
}

.unit6 {
	background-position: 0 -579px;
	padding-top: 0;
	height: 110px;
}

.unit7 {
	background: url(/2021/DCICHF/images/support-unit.png) top left no-repeat;
}

#contact ul {
	display: flex;
	align-items: center;
}

#contact li {
	display: flex;
	align-items: center;
	font-size: 20px;
	line-height: 24px;
	color: #21d8ff;
}

.signup-info {
	position: absolute;
	right: 120px;
	top: 50%;
	transform: translateY(-50%);
	width: 492px;
}

.signup-info > div {
	display: none;
}

.signup-info header {
	height: 30px;
	background: url(/2021/DCICHF/images/bm-bg-header.png) top left no-repeat;
}

.signup-info footer {
	height: 30px;
	background: url(/2021/DCICHF/images/bm-bg-footer.png) top left no-repeat;
}

.signup-info .container {
	background: url(/2021/DCICHF/images/bm-bg-main.png) repeat-y;
	padding: 0 30px;
}

.signup-info .container p {
	text-indent: 2em;
	font-size: 14px;
	line-height: 24px;
	color: #24bbf2;
	padding-bottom: 20px;
}

.signup-info h3 {
	color: #1efcff;
	font-size: 30px;
	font-weight: bold;
	margin-bottom: 20px;
	padding-left: 24px;
}

.signup-list {
	width: 526px;
	height: 504px;
	background: url(/2021/DCICHF/images/earth-bg.png) no-repeat 50% 50%;
	position: relative;
	float: left;
}

.signup-list li {
	display: block;
	width: 173px;
	height: 173px;
	background: url(/2021/DCICHF/images/earth.png) center center no-repeat;
	transition: background-image 0.15s ease-in-out;
	position: absolute;
	text-align: center;
}

.signup-list i {
	display: block;
	width: 50px;
	height: 46px;
	margin: 48px auto 16px;
	background: url('/2021/DCICHF/images/icon2.png') no-repeat 0 0;
}

.signup-list .icon-timer {
	background-position: 0 100%;
}

.signup-list .icon-person {
	background-position: 0 0;
}

.signup-list .icon-team {
	background-position: 0 -178px;
}

.signup-list .icon-introduce {
	background-position: 0 -88px;
}

.signup-list .icon-form {
	background-position: 0 -266px;
}

.signup-list .icon-team-conter {
	background-position: 0 -354px;
}

.signup-list .icon-sign-introduce {
	background-position: 0 -444px;
}

.signup-list .active {
	background-image: url('/2021/DCICHF/images/earch-hover.png');
}

.signup-list a {
	font-size: 16px;
	color: #1efcff;
	font-weight: bold;
	text-decoration: none;
}

.signup-list .person {
	left: 300px;
	top: 16px;
}

.signup-list .introduce {
	right: 50px;
	bottom: 18px;
}

.signup-list .form {
	left: 134px;
	bottom: -20px;
}

.signup-list .team-conter {
	left: 0;
	bottom: 82px;
}

.signup-list .sign-introduce {
	top: 76px;
	left: 0;
}

.signup-list .timer {
	top: -20px;
	left: 140px;
}

.signup-list .team {
	top: 160px;
	right: -30px;
}

.signup-container {
	clear: both;
	position: relative;
}

.plan-container {
	margin-top: -55px;
}

.plan-container img {
	display: block;
	margin: 0 auto;
}

.plan-group {
	display: flex;
	justify-content: space-between;
	width: 926px;
	margin: 16px auto 0;
	color: #1efcff;
}

.plan-item {
	flex-basis: 222px;
	text-align: center;
	line-height: 1.5;
}

footer p {
	font-size: 16px;
	color: #e8fbff;
	background-color: #050a22;
	padding: 24px 0;
	text-align: center;
	min-width: 1200px;
}

.side-nav {
	width: 124px;
	position: fixed;
	right: 10px;
	bottom: 100px;
}

.side-nav li {
	margin-bottom: 10px;
}

.side-nav a {
	display: block;
	width: 102px;
	height: 34px;
	border: 1px solid #078ca1;
	background-color: #192348;
	font-size: 14px;
	line-height: 34px;
	color: #65fcfe;
	text-align: center;
	text-decoration: none;
	margin: 0 auto;
}

.side-nav a:hover {
	border: 1px solid transparent;
	background: url(/2021/DCICHF/images/side-nav-hover.png) center center no-repeat;
	width: 122px;
	height: 34px;
	transition: all 0.1s ease-in-out;
}

.prize-extra {
	font-size: 14px;
	color: #d0f7ff;
	text-align: center;
	display: block;
	position: relative;
	top: -60px;
}

#contact li span {
	padding-left: 58px;
}

.top1_img img {
	width: 100%;
	height: auto;
}

:root {
	--animate-duration: 1s;
	--animate-delay: 1s;
	--animate-repeat: 1;
}

.animate__animated {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-duration: var(--animate-duration);
	animation-duration: var(--animate-duration);
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}

@keyframes zoomInDown {
	0% {
		opacity: 0;
		-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
		transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
		-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
		animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
	}

	60% {
		opacity: 1;
		-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
		transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
		-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
		animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
	}
}

.animate__zoomInDown {
	-webkit-animation-name: zoomInDown;
	animation-name: zoomInDown;
}

@keyframes fadeInUp {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0);
	}

	to {
		opacity: 1;
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
	}
}

.animate__fadeInUp {
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;
}
<!--ºÄÊ±1777225509.9728Ãë-->