﻿@charset "utf-8";
@font-face{ font-family:'mont'; src:url('../font/MONT.woff2');}

.chaochu{
	width: 100%;
	height: auto;
	overflow: hidden;
}

/*头部导航*/
.one_warp{
	width:100%;
	height: 160vh;
	position: relative;
	z-index: 3;
}

.one_bg{
	position: absolute;
	left: 0;
	top: 0;
	width:100%;
	height: 100%;
	font-size: 0px;
	overflow: hidden;
}
.one_bg img{
	width:100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
.one{
	width: 90vw;
    margin: 0 auto;
	height:100%;
	position: relative;
	padding-top: 4.285rem;
}
.one_1{
	width: 100%;
	height:13vh;
	display: flex;
	justify-content: space-between;
	border-bottom: 1px solid #fff;
	align-items: center;
}
.one_1_1{
	font-size: 3.285rem;
	 color: #fff;
	font-family: mont;
}
.one_1_2{
	color: #fff;
	font-size: 1.285rem;
	display: flex;
	justify-content: flex-end;
}
.one_1_2 span{ margin-left: 2.571rem;}


.one_2{
	width:100%;
	height: auto;
	font-size: 8.5rem;
	color: #fff;
	font-family: opm;
	margin-top: 45vh;
}
.one_3{
	width: 42%;
	height: auto;
	font-size: 1.571rem;
	color: #fff;
	line-height: 2.571rem;
	margin-top: 2.714rem;
}
.one_3 span{
	display: block;
	text-transform: uppercase; 
}

.one_logo{
	width: 100%;
	height: auto;
	position: absolute;
	bottom: 0;
	z-index: 3;
	right: 0;
	display: flex;
	justify-content: center;
	transform: translateY(50%);
}
.one_logo img{
	height: 17vw;
	width: 17vw;
	border-radius:50%;
	overflow: hidden;
	border: 3.428rem solid #fff;
}




.two_warp{
	width: 100%;
	height: auto;
	position: relative;
	z-index: 2;
	padding-top: 39vh
}

.two{
	width: 90vw;
	margin: 0 auto;
	height:auto;
	position: relative;
}
.two_img{
	width:100%;
	height: auto;
	overflow: hidden;
	position: relative;
	z-index: 2;
}
.two_img img{
	width: 100%;
	height: auto;
}
.two_con{
	margin: 0 auto;
	width: 94%;
	height: auto;
	margin-top: 5.142rem;
}
.two_en{
	width: 100%;
	height: auto;
	position: absolute;
	top: 67.5vh;
	left: 0;
}
.two_en_1{
	font-size: 18.214rem;
	font-family: Arial;	
	font-weight: bold; 
	line-height: 17.714rem;
}
.two_en_1:nth-child(2){ text-align: right;}
.two_en_1 span{background-image: linear-gradient(to right, #eeeeee , #cfd9e7 , #eeeeee);text-transform: uppercase; 
	    -webkit-text-fill-color: transparent;
	    -webkit-background-clip: text;}


.three_warp{
	width:100%;
	height:  auto;
	position: relative;
	overflow: hidden;
	margin-top: 14vh;
}
.three{
	position: relative;
	z-index: 2;
	width: 90%;
	margin: 0 auto;
}

.four_en{
	width: 100%;
	height: 20.142rem;
	display: flex;
	justify-content:space-between;
	position: relative;
	overflow: hidden;
}
.four_en:after{
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	bottom:0;
	left: 0;
	border-bottom: 0.857rem double #000;
	z-index: 2;
}
.four_en:before{
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	bottom:0;
	left: 0;
	border-bottom: 0.857rem double #004db7;
	z-index: 3;
	animation: aloop 4s linear infinite;
}
@-webkit-keyframes aloop {
    from {
        left:-100%;
    }

    to {
        left:0;
    }
}


.four_en_1{
	height: auto;
	text-transform: uppercase;
	color: rgba(0,0,0,0.7);
	font-size: 3.285rem;
	line-height: 3.855rem;
	font-family: mont;
	margin-left: 9.3%;
	padding-top: 6.857rem;
}
.four_en_2{
	line-height: 6.857rem;
	color: #000;
	font-size: 5.857rem;
	text-align: right;
}
.four_con{
	width:100%;
	height: 50.285rem;
	display: flex;
	justify-content: space-between;
	margin-top: 11.77vh;
}
.four_left{
	width: 50%;
	display: flex;
	justify-content: space-between;
	flex-direction: column;
}


.four_tit{
    font-size: 18.571rem;
    line-height: 18.571rem;
    font-family: mont;
    color: #000;
	text-transform: uppercase; 
	margin-top: -1rem;
}
.four_come_1{
	width: auto;
	color: #000;
	font-size: 2.5rem;
	font-family: mont;
	text-transform: uppercase; 
	letter-spacing: 1rem;
	line-height: 4.285rem;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

.four_right{
	width: 50%;
	position: relative;
}
.four_right_1{
	position: absolute;
	left: 0;
	top: 0;
	color: #000;
	font-family: mont;
	font-size: 4.571rem;
}
.four_come_2{
	width: 100%;
    font-size: 68.785rem;
    line-height: 42.785rem;
    font-family: mont;
    color: #fff;
    -webkit-text-stroke: 2px #000;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content:center;
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: 2;
	transform: translateX(10%);
}
.four_come_2a{
	color: #fcfcfc;
	-webkit-text-stroke: 2px #dfdfdf;
	right: 18%;
	z-index: 1;
	animation: right 8s linear infinite;
}
@-webkit-keyframes right {
    0 {
        right: 18%;
    }
    50% {
        right: 0%;
    }
	100% {
       right: 18%;
    }
}





.four_xian{
	width:100%;
	border-top: 0.857rem double #000;
	border-bottom: 0.857rem double #000;
	height: auto;
	margin-top: 17vh;
	padding: 12vh 0 7vh 0;
}
.four_list{
	width: 100%;
	height: auto;
	display: flex;
	justify-content: flex-end;
}
.four_list:nth-child(2){ justify-content: flex-start; margin-top: 22vh;}
.four_list:nth-child(2) .four_nei{ margin-left: 0rem;margin-right: 10rem;}

.four_nei{
	margin-left: 10rem;
}
.four_1{
	font-size: 2.714rem;
	font-family: opm;	
	color: #000;
}
.four_2{
	font-size: 14.28rem;
	font-family:  Arial;	
	color: #000;
	margin-top: 0.714rem;
}



.love_warp{
	width: 100%;
	height: calc(100vw * 1008 / 1920);
	margin-top: 23.5vh;
}
.love{
	width: 100%;
	height: 100%;
	margin: 0 auto;
	position: relative;
}
.love_img{
	width: 100%;
	height: 100%;
	overflow: hidden;
	font-size: 0;
	position: absolute;
	top: 0;
	left: 0;
}
.love_img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
.love .one_1{
	width: 90vw;
	height: calc(13vh + 5.857rem);
	margin: 0 auto;
	position: relative;
	z-index: 2;
	border-bottom: 4px solid #fff;
	padding-top: 5.857rem;
}
.love .one_1_2{ font-size: 2.857rem;text-transform: uppercase;}
.five{
	width:100%;
	height: 100vh;
	display: flex;
	justify-content: space-between;
	position: relative;
	z-index: 2;
}

.five_left{
	width: 50%;
	height: 100%;
}
.five_con{
	width: 100%;
	height: 100%;
	background: #004db7;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}
.five_1{
	color: #fff;
	font-size: 2.142rem;
	font-family: mont;
	padding-left: 5vw;
	padding-bottom: 3.571rem;
}

.five_right{
	width:50%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.five_right .five_con{ background: #ebebeb; height: 50%;}
.five_right .five_1{    padding-left:3.571rem; padding-bottom: 2.857rem; font-size: 2.142rem; color: #000;}

.five_list{
	width: 100%;
	height: 50%;
	display: flex;
	justify-content: flex-start;
}
.five_list .five_con{
	width: calc(100% / 3);
	height: 100%;
	background: #333;
	color: #fff;
}
.five_list .five_con:nth-child(2){background: #2ea9e2;}
.five_list .five_con:nth-child(3){background: #001e48;}
.five_list .five_1{    padding-left:3.571rem; padding-bottom: 2.857rem; font-size: 2.142rem; color: #fff;}




.pic_warp{
	width:100%;
	height: auto;
	background: #fff;
	padding-top: 46vh;
}
.pic{
	width: 100vw;
	height: auto;
	font-size: 0px;
	overflow: hidden;
}
.pic img{
	width: 100%;
	height: auto;
}

.teamwork{
	width:100%;
	height: auto;
	padding-top: 36vh;
}
.teamwork_tit{
	width:90vw;
	height: auto;
	margin: 0 auto;
	font-size: 4.714rem;
	color: #000;
	line-height: 5.428rem;	
	font-family: opm;
	position: relative;
}
.teamwork_tit:after{
	content: '';
	background: url("../images/feng_16.png") no-repeat center;
	background-size:cover;
	width: 16.714rem;
	height: 14.857rem;
	position: absolute;
	right: 0;	
	top: -10.571rem;
}
.teamwork_img{
	width:100%;
	height: calc(100vw * 1783 / 1920);
	font-size: 0px;
	overflow: hidden;
	margin-top: 12.6vh;
}
.teamwork_img img{
	width:100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	-webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
}
.teamwork_con{
	width: 100%;
	height: auto;
	background: #004db7;
	padding:36vh 2.5vw 30vh 5vw; 
}
.teamwork_list{
	width:100%;
	height: auto;
	display: flex;
	justify-content: space-between;
}
.teamwork_tu{
	width:32%;
	height: auto;
	font-size: 0px;
	overflow: hidden;
}
.teamwork_tu:nth-child(1),.teamwork_tu:nth-child(3){ margin-top: 32vh;}
.teamwork_tu img{
	width:100%;
	height: auto;
	border-radius: 20px;
	overflow: hidden;
	object-fit: cover;
	object-position: center;
	-webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
}




.alphabet{
	width:100%;
	height:auto;
	position: relative;
	padding-top: 24vh;
	background: #d2d2d2;
}
.alphabet_zi{
	width: 100%;
	height: auto;
	text-align: center;
	
}
.alphabet_zi img{
	width: 40%;
	height: auto;
}

.alphabet_img{
	width:100%;
	height: calc(100vw * 1494 / 1920);
	font-size: 0px;
	overflow: hidden;
	margin: 0 auto;
	margin-top: -32vh;
	
}
.alphabet_img img{
	width:100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
.shell{
	width:100%;
	position: relative;
	height: auto;
	overflow: hidden;
}
.shell_2{
	width:100%;
	text-align: center;
	color: #000;
	font-size: 2.5rem;
	font-family:Arial;
	margin-top: 14vh;
}
.shell_3{
	width:100%;
	text-align: center;
	font-size: 2.25rem;
	color: #000;
	letter-spacing: 1.5rem;
	line-height: 4.75rem;
}
.shell_4{
	width:100%;
	height: auto;
	font-size: 1.125rem;
	color: rgba(0,0,0,0.43);
	text-align: center;
	margin-top: 4.25rem;
	padding-bottom: 15vh;
}
@media screen and (max-width:1439px)and (min-width:1280px){
	.one_2{ font-size: 7.5rem;}
	.one_3{ width: 46%;}
	.one_logo img { border: 3rem solid #fff;}
	.four_con{ height: 46rem;}
	.four_tit{ font-size: 15rem; line-height: 15rem;}
	.four_come_2{    font-size: 60.785rem;transform: translateX(14%);}
	.four_right_1{ font-size: 3.571rem;}
	.four_1{ font-size: 2rem;}
	.four_2{ font-size: 12rem;}
	.four_list:nth-child(2){ margin-top: 18vh;}
	
}
@media screen and (max-width:1279px)and (min-width:1024px){
	.one_2{ font-size: 7.5rem;}
	.one_3{ width: 46%;}
	.one_logo img { border: 2.5rem solid #fff;}
	.two_warp{ padding-top: 30vh;}
	.two_en{ top: 23.5vh;}
	.two_en_1{ font-size: 15rem; line-height: 15rem;}
	.four_en{ height: 18rem;    border-bottom: 0.5rem double #000;}
	.four_en_1{ margin-left: 6%; font-size: 2.75rem; line-height: 3.25rem; padding-top: 6rem;}
	.four_en_2 {
		line-height: 6rem;
		font-size: 4.75rem;
	}
	.four_xian {
		border-top: 0.5rem double #000;
		border-bottom: 0.5rem double #000;
		margin-top: 12vh;
		padding: 10vh 0 7vh 0;
	}
	.four_con{ height: 36rem;}
	.four_tit{ font-size: 12rem; line-height: 12rem;}
	.four_come_1{font-size: 2rem; letter-spacing: 0.75rem; line-height: 3.5rem;}
	.four_come_2{    font-size: 50.785rem;transform: translateX(14%);line-height: 31.785rem}
	.four_right_1{ font-size: 3rem;}
	.four_1{ font-size: 1.5rem;}
	.four_2{ font-size: 10rem;}
	.four_list:nth-child(2){ margin-top: 15vh;}
	.four_list:nth-child(2){ margin-top: 15vh;}
	
	.love_warp{ margin-top: 18vh;}
	.five{ height: 80vh;}
	.pic_warp{ padding-top: 30vh;}
	.teamwork{ padding-top: 26vh;}
	.teamwork_tit{ font-size: 4rem; line-height: 4.75rem;}
	.teamwork_tit:after{top: -8rem;}
	.teamwork_con {
		padding: 16vh 2.5vw 12vh 5vw;
	}
	.alphabet{ padding-top: 18vh;}
	.alphabet_img{ margin-top: -24vh;}
	.shell_2{ margin-top: 12vh;}
	.shell_4{ padding-bottom: 10vh;}
}
@media screen and (max-width:1023px)and (min-width:300px){
	.one_warp{height: 100vh;}
	.one{
		width: 94vw;
		padding-top: 4vh;
	}
	.one_1{
		height:10vh;
	}
	.one_1_1{
		font-size: 2.25rem;
	}
	.one_1_2{
		font-size: 1rem;
	}
	.one_1_2 span{ margin-left: 0.75rem;}
	.one_2{
		font-size: 3rem;
		margin-top: 20vh;
		text-align: center;
	}
	.one_3{
		width: 100%;
		font-size: 1.25rem;
		line-height: 2.25rem;
		margin-top: 2rem;
	}
	.one_logo img{
		height: 24vw;
		width: 24vw;
		border: 0.5rem solid #fff;
	}

	.two_warp{
		padding-top: 20vh;
	}

	.two{
		width: 100vw;
	}
	.two_en{
		top: 15vh;
	}
	.two_en_1{
		font-size: 6rem;
		line-height: 6rem;
	}

	.three_warp{
		margin-top: 8vh;
	}
	.three{
		width: 94%;
	}

	.four_en{
		width: 100%;
		height: auto;
		justify-content:center;
		flex-direction: column-reverse;
		padding-bottom: 3vh;
	}
	.four_en:after {
		border-bottom: 3px double #000;
	}
	.four_en:before {
		display: none;
	}
	
	.four_en_1{
		font-size: 1.125rem;
		line-height: 1.25rem;
		margin-left: 0%;
		padding-top: 0rem;
		text-align: center;
		margin-top: 1rem;
	}
	.four_en_1 span{ display: none;}
	.four_en_2{
		line-height: 3rem;
		font-size: 2.5rem;
		text-align: center;
		width: 100%;
	}
	.four_en_2 span{ display: none;}	

	.four_con{
		height: auto;
		display: flex;
		justify-content:center;
		flex-direction: column;
		margin-top: 4vh;
	}
	.four_left{
		width: 100%;
	}
	.four_tit{
		width: 100%;
		text-align: center;
		font-size:7rem;
		line-height: 7rem;
		margin-top: 0;
	}
	.four_come_1{
		font-size: 1.5rem;
		letter-spacing: 0.5rem;
		line-height: 3.285rem;
		width: 80%;
		margin: 0 auto;
		margin-top: 4vh;
	}

	.four_right{
		width: 100%;
		position: relative;
		margin-top: 6vh;
	}
	.four_right_1{
		font-size: 2rem;
		position: absolute;
		}
	.four_come_2{
		position: relative;
		width: 100%;
		font-size: 32rem;
		line-height: 22rem;
		-webkit-text-stroke: 1px #000;
		transform: translateX(16%);
	}
	.four_come_2a{
		position: absolute;
		-webkit-text-stroke: 1px #dfdfdf;
		right: 14%;
	}

	.four_xian{
		border-top: 3px double #000;
		border-bottom: 3px double #000;
		height: auto;
		margin-top: 6vh;
		padding: 6vh 0 4vh 0;
	}
	.four_list:nth-child(2){ margin-top:6vh;}
	.four_list:nth-child(2) .four_nei{ margin-left: 0rem;margin-right: 2rem;}

	.four_nei{
		margin-left: 2rem;
	}
	.four_1{
		font-size: 1.25rem;
	}
	.four_2{
		font-size: 6rem;
		margin-top: 0.5rem;
	}

	.love_warp{
		width: 100%;
		height: calc(100vw * 1008 / 1920);
		margin-top: 6vh;
	}

	.love .one_1{
		width: 94vw;
		height:10vh;
		padding-top: 1rem;
		border-bottom: 2px solid #fff;
	}
	.love .one_1_2{ font-size: 1.25rem;}
	.five{
		height: 40vh;
	}

	.five_left{width: 30%;}

	.five_1{
		font-size: 1.5rem;
		padding-left: 2vw;
		padding-bottom: 1.5rem;
	}

	.five_right{
		width:70%;
	}
	.five_right .five_1{    padding-left:2vw; padding-bottom: 1.5rem; font-size: 1.5rem;}
	.five_list .five_1{    padding-left:2vw; padding-bottom: 1.5rem; font-size: 1.25rem; }

	.pic_warp{padding-top: 12vh;}
	.teamwork{
		padding-top: 10vh;
	}
	.teamwork_tit{
		width:94vw;
		font-size: 2rem;
		line-height: 3rem;	
		text-align: center;
	}
	.teamwork_tit:after{
		display: none;
	}
	.teamwork_img{
		margin-top: 4vh;
	}
	.teamwork_con{
		padding:6vh 2vw 6vh 2.5vw; 
	}
	.teamwork_list{
		width:100%;
		height: auto;
		display: flex;
		justify-content: space-between;
	}
	.teamwork_tu:nth-child(1),.teamwork_tu:nth-child(3){ margin-top: 10vh;}
	.teamwork_tu img{
		border-radius: 7px
	}

	.alphabet{
		padding-top: 8vh;
	}
	.alphabet_zi img{
		width:40%;
		height: auto;
	}

	.alphabet_img{
		margin-top: -12vh;	
	}
	.shell_2{
		font-size: 1.5rem;
		margin-top:8vh;
	}
	.shell_3{
		font-size: 1.5rem;
		letter-spacing: 0.25rem;
		line-height: 3.75rem;
	}
	.shell_4{
		font-size: 1rem;
		margin-top: 2.5rem;
		padding-bottom:5vh;
	}

}
