﻿@charset "utf-8";
@font-face {
    font-family: hwhp;
    src: url('../font/华文琥珀.woff2');
	font-display: swap;
}

.chaochu{
	width: 100%;
	height: auto;
	overflow: hidden;
}

/*头部导航*/
.one_warp{
	width:100%;
	height: auto;
	position: relative;
	z-index: 3;
	padding: 14vh 0;
}
.one_bg{
	position: absolute;
	width: 100%;
	height: auto;
	font-size: 0px;
	overflow: hidden;
    top: 0;	
}
.one_bg img{
	width: 100%;
	height: auto;
}

.one{
	width: 90vw;
    margin: 0 auto;
	height:calc(100vw * 1118 / 1920 + 6.428rem);
	position: relative;
}
.one:after{
	content: '';
	width: calc(100vw * 1118 / 1920);
	height: calc(100vw * 1118 / 1920);
	background: #0249b4;
	border-radius:50%;
	position: absolute;
	top: 0;
	left: calc(50% - (100vw * 1118 / 1920 / 2));
}
.one_all{
	width: 100%;
	display: flex;
	justify-content: space-between;
	position: relative;
	z-index: 2;
	padding-top: 7vh;
}
.one_left_1{
	font-size: 3.714rem;
	color: #034998;
	font-family: hwhp;
}
.one_left_1 span{ color: #009ce6;}
.one_left_2{
	font-family: opb;
	color: #002d60;
	text-transform: uppercase; 
	line-height: 5.142rem;
	font-size: 2.857rem;
}
.one_1{
	width: 100%;
	height:auto;
	font-size: 1.142rem;
	line-height: 1.857rem;
	text-align: right;
	padding-top: 0.857rem;
	color: #000000;
	font-family: opm;
}
.one_2{
	width:100%;
	height: auto;
	font-size: 4.571rem;
	color: #002d60;
	font-family: oph;
	margin-top: 1.142rem;
}
.one_tit{
	width:100%;
	text-align: center;
	color: #fff;
	font-size: 1.714rem;
	position: relative;
	z-index: 2;
	margin-top: -5.428rem;
}
.one_con{
	width:100%;
	height: auto;
	display: flex;
	justify-content: center;
	margin-top: 20vh;
	position: relative;
	z-index: 2;
}


.one_logo{
	width: 50%;
	height: auto;
	font-size: 0px;
	padding-right:8vw;
	text-align: right;
	position: relative;
	padding-top: 7.5vh;
}
.one_logo img{
	height: auto;
	width: 8.857rem;
}
.one_logo_en{
	position: absolute;
	top: -220%;
	right: 8vw;
}
.con_nei{
	width: 50%;
	font-size: 1.142rem;
	color: #fff;
	line-height: 2.285rem;
	transform: translateX(-5rem);
}
.con_nei_1{
	width: 25vw;
}
.one_list{
	width:100%;
	height: auto;
	position: relative;
	z-index: 2;
	margin-top: 12vh;
	display: flex;
	justify-content: center;
}
.one_img{
	font-size: 0px;
	overflow: hidden;
	margin: 0px 1.142rem;
	width: 38.6%;
}
.one_img:nth-child(2){
	margin-top: 15.7vh;
}
.one_img img{
	width: 100%;
	height: auto;
}


.two{
	width: 73vw;
    width: var(--mainwidth);
	margin: 0 auto;
	height:auto;
	position: relative;
	display: flex;
	justify-content: space-between;
	z-index: 4;
	padding: 11vh 0 27.5vh 0;
}
.two_1{
	width: 50%;
	height: auto;
	font-size: 0px;
	overflow: hidden;
	display: flex;
	align-items: center;
}
.two_1 img{
	width: 130%;
	height: auto;
	margin-left: -15%;
}

.two_2{
	width: 50%;
	height: auto;
	font-size: 0px;
	overflow: hidden;
	transform: translateX(10%);
}
.two_2 img{
	width: 100%;
	height: auto;
}

.three{
	width:100%;
	height:  auto;
	position: relative;
	overflow: hidden;
}
.three_tit{
	width: 73vw;
    width: var(--mainwidth);
	margin: 0 auto;
	height: calc(100vw * 730 / 1920);
}
.three_tit_1{
	font-size: 19.428rem;
	font-family: opb;
	-webkit-text-stroke: 2px rgba(255,255,255,0.16);
	color: transparent;
	padding-top: 3.571rem;
	padding-left: 5.714rem;
}
.three_tit_2{
	color: #fff;
	font-size: 4.857rem;
	font-family: opb;
	margin-top: -9.428rem;
	position: relative;
	z-index: 2;
	padding-bottom: 3.855rem;
}
.three_se{
	width: 100%;
	height: calc(100vw * 730 / 1920);
	background: #064b99;
	display: flex;
	align-items: flex-end;
	margin-top: calc(-1 * (100vw * 730 / 1920));
}
.three_se_1{
	width: 73vw;
    width: var(--mainwidth);
	margin: 0 auto;
	color: #fff;
	font-size: 10.857rem;
	text-align: right;
	padding-bottom: 4.4vh;
}
.three_all{
	width:100%;
	height: calc(100vw * 500 / 1920);
	display: flex;
	justify-content: space-between;
}
.three_left{
	width: 50%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 3.142rem;
	color: #fff;
	background: #009ce6;
}
.three_right{
	width: 50%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 3.142rem;
	color: #000;
	background: #eef2f8;
}

.love{
	width: 73vw;
    width: var(--mainwidth);
    margin: 0 auto;
	height: auto;
	position: relative;
	margin-top: 13vh;
}
.love .three_tit{ height: auto;}
.love .three_tit_1{    -webkit-text-stroke: 2px rgba(6,75,153,0.21);}
.love .three_tit_2{    color: #000;}

.love_con{
	width:100%;
	height: auto;
	display: flex;
	justify-content: space-between;
	padding-top: 7.5vh;
}
.love_left{
	font-size: 1.285rem;
	color: #000;
	font-family: opm;
}
.love_left span{ font-size: 2.571rem; display: block; font-family:  Arial; line-height: 4.857rem;}
.love_right{
	font-size: 2rem;
	color: #000;
	font-family: opm;
	letter-spacing: 1.285rem;
	line-height: 2.857rem;
	 width: 76%;
}

.love_cona .love_right{ letter-spacing: 0;}
.love_cona .love_right_1 span{ margin-right: 4.285rem;}

.five{
	width: 100vw;
	margin-top: 24vh;
	position: relative;
	z-index: 2;
	 background-attachment: fixed;
	height: calc(100vw * 2432 / 1920);
	background: #0249b4;
}
.five:after{
	content: '';
	width: 100%;
	height: 20%;
	position: absolute;
	top: 0;
	left: 0;
	background-image: linear-gradient(rgba(2,73,180,0.8), rgba(2,73,180,0));
	z-index: 5;
}
.five:before{
	content: '';
	width: 100%;
	height: 20%;
	position: absolute;
	bottom: 0;
	left: 0;
	background-image: linear-gradient(rgba(2,73,180,0), rgba(2,73,180,1));
	z-index: 5;
}



.in_part5{ position: relative; z-index: 1; overflow: hidden; height: 100%;}
.in_part5 .img{position: absolute; left: 0; top: 0; width: 100%; height:100%; overflow: hidden;}
.in_part5 .img ul{ width: 100%; height: 100%;  transform:rotate(0deg);}
.in_part5 .img li{float: left; width: 33.33%; box-sizing: border-box; padding:0 5px; list-style: none;}
.in_part5 .img li img{width: 100%; margin-bottom: 10px;}
.in_part5 .img li:nth-child(2){ margin-top: -100%;}


.teamwork_warp{
	width:100%;
	height: auto;
	background: #0249b4;
	padding: 10vh 0 25vh 0;
}
.teamwork{
	width: 73vw;
    width: var(--mainwidth);
	height: auto;
	margin: 0 auto;
}
.teamwork .three_tit{ height:  auto;}
.teamwork_img{
	width:100%;
	height: auto;
	font-size: 0px;
	overflow: hidden;
	margin-top: 5vh;
}
.teamwork_img img{
	width:100%;
	height: auto;
	border-radius:30px;
}



.alphabet{
	width:100%;
	height:auto;
	position: relative;
	padding-top: 10vh;
}
.alphabet .three_tit{ height: auto;}
.alphabet .three_tit_1{    -webkit-text-stroke: 2px rgba(6,75,153,0.21); padding-top: 0;}
.alphabet .three_tit_2{    color: #000;}

.alphabet_all{
	width: 108%;
	display: flex;
	justify-content: space-between;
	margin-top: 1.428rem;
	margin-left: -4%;
	position: relative;
	z-index: 2;
}
.alphabet_img:nth-child(3){padding-top: 0; width: 19.06%;}
.alphabet_img{
	padding-top: 5.142rem;
	width: 16.89%;
	height: auto;
	font-size: 0px;
	overflow: hidden;
	
}
.alphabet_img img{
	width: 100%;
	height: auto;
}
.alphabet_bg{
	width: 100%;
	height: calc(100vw * 1347 / 1920);
	background: url("../images/yada_02.png") no-repeat left bottom;
	background-size:cover;
	padding-top: calc(100vw * 260 / 1920);
	margin-top: -14.44vh;
	position: relative;
	display: flex;
	justify-content: center;
}

.alphabet_1{
	width:17.7%;
	height: calc(100vw * 0.177 * 688 / 339);
	display: flex;
	font-size: 0;
	overflow: hidden;
	margin-top: 30vh;
	margin-right: 7.9%;
}
.alphabet_1 img{
	width:100%;
	height: auto;
}
.alphabet_2{
	width:17.1857%;
	height: calc(100vw * 0.171857 * 703 / 333);
	display: flex;
	justify-content: center;
	font-size: 0;
	overflow: hidden;
	margin-top: 6vh;
	margin-left: 5.1%;
}
.alphabet_2 img{
	width: 100%;
	height: auto;
}
.alphabet_3{
	position: absolute;
	top: -5vh;
	left: 36.16%;
	width: 7.6%;
	font-size: 0px;
	overflow: hidden;
}
.alphabet_3 img{
	width: 100%;
	height: auto;
}



.shell{
	width:90%;
	margin: 0 auto;
	position: relative;
	height: 16vh;
	overflow: hidden;
	font-family: opm;
	font-size: 1.142rem;
	color: #fff;
	line-height: 1.857rem;
	margin-top: -16vh;
	z-index: 2;
}
@media screen and (max-width:1439px)and (min-width:1280px){
	.one_logo img {
		height: auto;
		width: 7.25rem;
	}
	.three_tit_1{ font-size: 16rem;}
	.three_tit_2{ font-size: 3.857rem; margin-top: -7.75rem;}
	.three_se_1{ font-size: 8.857rem; padding-bottom: 3.4vh;}
}
@media screen and (max-width:1279px)and (min-width:1024px){
	.one_warp{ padding: 10vh 0;}
	.one{ width: 96vw;}
	.one_left_1{ font-size: 3.5rem;}
	.one_left_2{ font-size: 2.5rem; line-height: 5rem;}
	.one_logo{ padding-right: 10vw;}
	.one_logo_en{ right: 10vw;}
	.one_logo img {
		height: auto;
		width: 7.25rem;
	}
	.one_con{ margin-top: 16vh;}
	.con_nei{transform: translateX(-3rem);}
	.one_list{ margin-top: 6vh;}
	.one_img:nth-child(2) {
		margin-top: 8vh;
	}
	.two{ padding: 10vh 0 16vh 0;}
	.two_1 img {
		width: 120%;
		margin-left: -10%;
	}
	.two_2{ text-align: center;}
	.two_2 img{ width: 90%;}
	
	.three_tit_1{ font-size: 12rem;}
	.three_tit_2{ font-size: 3rem; margin-top: -5.25rem;}
	.three_se_1{ font-size:6rem; padding-bottom: 3vh;}
	.three_left,.three_right{ font-size: 2.75rem;}
	.love_right{ letter-spacing: 1rem;}
	.five{ margin-top: 16vh;}
	.teamwork_warp {
		padding: 4vh 0 14vh 0;
	}
	.alphabet{ padding-top: 6vh;}
	.alphabet_bg{ margin-top: -12vh;}
	.alphabet_1{ margin-top: 18vh;}
	.alphabet_2{ margin-top: 4vh;}
}
@media screen and (max-width:1023px)and (min-width:300px){
	.one_warp{
		padding: 10vh 0;
	}
	.one{
		width: 94vw;
		margin: 0 auto;
		height: auto;
	}
	.one:after{
		content: '';
		width: 82vw;
		height: 82vw;
		top: 14vh;
		left: 6vw;
	}
	.one_all{
		padding-top: 0;
	}
	.one_left_1{
		font-size: 2rem;
	}

	.one_left_2{
		line-height: 4rem;
		font-size: 1.857rem;
	}
	.one_1{
		font-size: 1rem;
		line-height: 1.5rem;
		padding-top: 0;
	}
	.one_2{
		font-size: 3rem;
		margin-top: 0.5rem;
	}
	.one_tit{
		font-size: 1.5rem;
		margin-top: 6rem;
	}
	.one_con{
		margin-top:3vh;
	}

	.one_logo{
		display: none;
	}

	.con_nei{
		margin: 0 auto;
		width: 70%;
		font-size: 1rem;
		line-height: 2rem;
		transform: translateX(0);
	}
	.con_nei_1{
		width: 100%;
	}


	.one_list{
		margin-top: 4vh;
	}
	.one_img{
		margin: 0px 1%;
		width: 49%;
	}
	.one_img:nth-child(2){
		margin-top: 5vh;
	}


	.two{
		width:94vw;
		padding: 0 0 8vh 0;
	}

	.three_tit{
		width: 94vw;
		height: calc(100vw * 730 / 1200);
	}
	.three_tit_1{
		font-size: 5rem;
		padding-top: 2rem;
		padding-left: 2rem;
	}
	.three_tit_2{
		font-size: 2rem;
		margin-top: -3.25rem;
		padding-bottom: 2rem;
	}
	.three_se{
		height: calc(100vw * 730 / 1200);
		margin-top: calc(-1 * (100vw * 730 / 1200));
	}
	.three_se_1{
		width: 94vw;
		font-size: 4rem;
		padding-bottom: 2vh;
	}
	.three_all{
		height: calc(100vw * 500 / 1200);
	}
	.three_left{
		font-size: 2rem;
	}
	.three_right{
		font-size: 2rem;
	}

	.love{
		width: 94vw;
		margin-top: 6vh;
	}

	.love_con{
		justify-content: center;
		flex-direction: column;
		padding-top: 4vh;
	}
	.love_left{
		font-size: 1rem;
	}
	.love_left span{ font-size: 2rem;  line-height: 3.25rem;}
	.love_right{
		font-size: 1.375rem;
		letter-spacing: 0.25rem;
		line-height: 2rem;
		 width: 100%;
		margin-top: 1rem;
	}

	.love_cona .love_right_1 span{ margin-right: 3rem;}

	.five{
		margin-top: 10vh;
	}

	.in_part5 .img li{padding:0 3px; }
	.in_part5 .img li img{width: 100%; margin-bottom: 5px;}

	.teamwork_warp{
		padding: 4vh 0 10vh 0;
	}
	.teamwork{
		width: 94vw;
	}
	.teamwork_img{
		margin-top: 3vh;
	}
	.teamwork_img img{;
		border-radius:20px;
	}

	.alphabet{
		padding-top: 6vh;
	}
	.alphabet_all{
		width: 112%;
		margin-top: 1rem;
		margin-left: -6%;
	}
	.alphabet_img{
		padding-top: 2.5rem;

	}

.alphabet_bg{
	height: calc(100vw * 1600 / 1800);
	padding-top: calc(100vw * 260 / 1920);
	margin-top: 2vh;
	background: url(../images/yada_02.png) no-repeat left top;
	background-size:100% auto;
}
	.alphabet_bg:after{
		content: '';
		width: 100%;
		height: 50%;
		position: absolute;
		left: 0;
		bottom: 0;
		background: #0249b4;
	}
	.alphabet_1{
		width:23%;
		height: calc(100vw * 0.23 * 688 / 339);
		margin-top: 8vh;
		margin-right: 5%;
		position: relative;
		z-index: 5;
	}

	.alphabet_2{
		width:22%;
		height: calc(100vw * 0.22 * 703 / 333);
		margin-top: 2vh;
		margin-left: 4%;
		position: relative;
		z-index: 5;
	}



.shell{
	width:100%;
	text-align: center;
	height: 6vh;
	font-size: 1rem;
	line-height: 1.5rem;
	margin-top: -3vh;
	z-index: 2;
	background: #0249b4;
}


}
