@charset "utf-8";
#wrap{background: #fff;}

#banner{width: 100%;min-width: 1200px;height: 500px;position: relative;overflow: hidden;}
#banner .banner-bg{	position: fixed;z-index: 1;width: 100%;	height: 100%;overflow: hidden;}
#banner .banner-bg div{position: relative;width: 100%;height: 100%;	background-repeat: no-repeat; background-size:100%; background-position: center top;}
#banner .textCon{position: relative;z-index: 2;width: 1200px;margin: 250px auto 0;text-align: right; text-shadow: 0 0 10px rgba(15,60,125,0.6);}
#banner .textCon h1{ font-size: 46px; display: block; line-height: 50px; color: #fff; padding: 20px 0 10px 0;} 
#banner .textCon p{ color: #fff; font-size: 32px; padding-left: 10%; font-weight: normal; margin-bottom: 15px;} 
#banner .textCon.text-left{text-align: left;}
#banner .textCon.text-left h1{ padding: 20px 0 10px 0;} 
#banner .textCon.text-left p{ padding-left: 0; padding-right: 10%;} 

#nav{ height: 70px; background: #3c6bc6; position: relative; z-index: 2;}
#nav ul{text-align: right; width: 1220px; margin: 0 auto; display: flex; justify-content: flex-end;}
#nav ul li{display: block;  }
#nav ul li a{ display: block; height: 70px; border-right: 1px solid #7299d9; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;}
#nav ul li a:hover{background: #3062b3;}
#nav ul li a span{display: block; padding: 12px 35px 0px; text-align: center; font-size: 16px; color: #fff;}
#nav ul li a i{display: block; text-align: center; padding: 0px 10px; font-size: 13px; opacity: .6; font-style: normal; color: #fff;}

.page-title{position: relative;}
.page-title h1{ font-size: 40px; color: #fff; text-transform: Uppercase; margin: 10px 0 30px; font-weight: normal;}

.breadcrumb ,
.breadcrumb a,
.breadcrumb span{color: #fff; font-size: 14px;}
.breadcrumb a:hover{color: #fff;}

#main{ padding: 0 0 0px 0; position: relative; z-index: 2; overflow: hidden; background:#d8e7ff url(../img/research-missions-bg.jpg) no-repeat center top; }
#main .mainBox{overflow: hidden;}
#main .box{
	position: relative;
	margin: 100px auto 50px;
	height: 906px;
}
#main .box .link{
	position: relative;
	right: 0;
	top: 0;
}
#main .box .link a.link-01{
	position: absolute;
	top: 28px;
	left: 50%;
	margin-left: -184px;
	display: block;
	width: 348px;
	height: 348px;
	border-radius: 100%;
	text-indent: -999em;
	overflow: hidden;
}
#main .box .link .link-02{
	position: absolute;
	top: 476px;
	left: 160px;
	display: block;
	width: 348px;
	height: 348px;
	border-radius: 100%;
	padding-top: 100px;
	overflow: hidden;
	opacity: 0;
	background-color: rgba(38,72,132,.8);
	-webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;
}
#main .box .link .link-02:hover{
	opacity: 1;
}
#main .box .link .link-02 a{
	font-size: 20px;
	font-weight: bold;
	color: #fff;
	display: block;
	left: 0;
	margin: 18px 50px 0 50px;
	position: relative;
	-webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;
}
#main .box .link .link-02 a:hover{
	left: 10px;
}
#main .box .link a.link-03{
	position: absolute;
	top: 476px;
	left: 672px;
	display: block;
	width: 348px;
	height: 348px;
	border-radius: 100%;
	text-indent: -999em;
	overflow: hidden;
}