@charset "utf-8";

.topBox {
	padding: 96px 0 0;
	background: url("../images/index/top_bg.png") no-repeat center top;
}
.topBox .info {
	width: 1420px;
	margin: 0 auto;
	padding: 65px 0 0;
	display: flex;
	justify-content: space-between;
}
.topBox .textBox {
	margin-top: 210px;
}
.topBox .textBox .title {
	margin-bottom: 20px;
	font-family: 'D-DIN-PRO-600-SemiBold';
	font-size: 70px;
	color: #FFFFFF;
	line-height: 100px;
}
.topBox .textBox .title span {
	color:#FF5050;
}
.topBox .textBox .text {
	font-size: 32px;
	color: #FFFFFF;
	line-height: 44px;
}
.topBox .textBox .arrow {
	margin-top: 50px;
	animation: myarrow 0.8s linear infinite;
	-webkit-animation:myarrow 0.8s linear infinite; /*Safari and Chrome*/
	animation-direction:alternate;
}
@keyframes myarrow
{
from {
	margin-top: 50px;
}
to {
	margin-top: 60px;
}
}
@-webkit-keyframes myarrow /*Safari and Chrome*/
{
from {
	margin-top: 50px;
}
to {
	margin-top: 60px;
}
}
.main {
	background: url(../images/index/bg01.png) no-repeat center top;
}
.section01 {
	margin-top: -141px;
	padding: 240px 0 220px;
	background: url(../images/index/bg02.png) no-repeat center top;
}
.section01 .wrap {
	display: flex;
	justify-content: space-between;
	background: linear-gradient( 180deg, #222222 0%, #090909 100%);
}
.section01 .ulList:first-child {
	width: 350px;

}
.section01 .ulList:first-child li a {
	width: 350px;
	display: block;
	text-align: center;
	height: 456px;
	padding: 170px 0 0;
	box-sizing: border-box;
}
.section01 .ulList:last-child li {
	width: 350px;
	height: 228px;
}
.section01 .ulList {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.section01 .ulList li a {
	height: 228px;
	padding: 60px 0 0;
	box-sizing: border-box;
	display: block;
	text-align: center;
	border-left: 1px solid #141E28;
	border-bottom: 1px solid #141E28;
	transition: all 0.3s;
}
.section01 .ulList li a:hover {
	background: linear-gradient( 180deg, #FF5050 0%, #DB1B1B 100%);
}
.section01 .ulList:last-child li:nth-child(6) a,
.section01 .ulList:last-child li:nth-child(5) a,
.section01 .ulList:last-child li:nth-child(4) a {
	border-bottom: none;
}
.section01 .ulList li a .img {
	margin: 0 auto 16px;
	display: block;
	width: 60px;
	height: 60px;
}
.section01 .ulList li a .img01 {background: url(../images/index/img01.png) no-repeat;}
.section01 .ulList li a:hover .img01 {background: url(../images/index/img01_on.png) no-repeat;}
.section01 .ulList li a .img02 {background: url(../images/index/img02.png) no-repeat;}
.section01 .ulList li a:hover .img02 {background: url(../images/index/img02_on.png) no-repeat;}
.section01 .ulList li a .img03 {background: url(../images/index/img03.png) no-repeat;}
.section01 .ulList li a:hover .img03 {background: url(../images/index/img03_on.png) no-repeat;}
.section01 .ulList li a .img04 {background: url(../images/index/img04.png) no-repeat;}
.section01 .ulList li a:hover .img04 {background: url(../images/index/img04_on.png) no-repeat;}
.section01 .ulList li a .img05 {background: url(../images/index/img05.png) no-repeat;}
.section01 .ulList li a:hover .img05 {background: url(../images/index/img05_on.png) no-repeat;}
.section01 .ulList li a .img06 {background: url(../images/index/img06.png) no-repeat;}
.section01 .ulList li a:hover .img06 {background: url(../images/index/img06_on.png) no-repeat;}
.section01 .ulList li a .img07 {background: url(../images/index/img07.png) no-repeat;}
.section01 .ulList li a:hover .img07 {background: url(../images/index/img07_on.png) no-repeat;}
.section01 .ulList li a .txt {
	font-size: 24px;
}
.section02 {
	width: 1400px;
	margin: 0 auto;
}
.section02 .imgBox {
	margin-bottom: 200px;
	display: flex;
	justify-content: space-between;
}
.section02 .imgBox .textBox {
	margin-top: 20px;
	width: 640px;
	position: relative;
}
.section02 .imgBox .textBox .top {
	margin-bottom: 40px;
}
.section02 .imgBox .textBox .title {
	margin-bottom: 20px;
	font-size: 60px;
	color: #FFFFFF;
	line-height: 72px;
	font-family: 'D-DIN-PRO-600-SemiBold';
}
.section02 .imgBox .textBox .title span {
	color:#FF5050;
}
.section02 .imgBox .textBox .text {
	margin-bottom: 60px;
	font-size: 24px;
	color: #FFFFFF;
	line-height: 36px;
	opacity: 0.6;
}
.section02 .imgBox .textBox .btn a {
	display: block;
	text-align: center;
	font-size: 20px;
	line-height: 80px;
	color:#fff;
	width: 240px;
	height: 80px;
	background: linear-gradient(#DB1B1B 0%, #FF5050 100%);
	border-radius: 40px;
	transition: all 0.3s;
}
.section02 .imgBox .textBox .btn a:hover {
	margin-left: 10px;
}
.section02 .imgBox .textBox .num {
	position: absolute;
	bottom: 150px;
	right:0;
}