@charset "utf-8";

@font-face {
    font-family: hwhp;
    src: url('../font/华文琥珀.woff2');
	font-display: swap;
}

.chaochu{
	width: 100%;
	height: auto;
	overflow: hidden;
	background: url("../images/dong.jpg") no-repeat center bottom;
	background-size:cover;
}

/*头部导航*/
.one_warp{
	width:100%;
	height: 100vh;
	position: relative;
	z-index: 3;
	display: flex;
	justify-content: center;
	flex-direction: column;
}

.one{
	width: 100%;
	height:60%;
	position: relative;
	display: flex;
	justify-content: flex-end;
	flex-direction: column;
}
.one:after{
	content: '';
	width: 89%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: rgba(0,0,0,0.88);
	border: 1px dashed rgba(255,255,255,0.5);
	border-left: none;
	border-top-right-radius: 400px;
	border-bottom-right-radius: 400px;
	
}
.one_typeright{
	width: 100%;
	height:auto;
	font-size: 1.142rem;
	line-height: 1.857rem;
	text-align: right;
	color: #fff;
	font-family: opm;
	position: absolute;
	top: 0;
	right: 5%;
}
.one_all{
	width: 78vw;
    margin: 0 auto;
	height: 100%;
	display: flex;
	justify-content: space-between;
	position: relative;
	z-index: 2;
	overflow: hidden;
}
.one_left{
	height: 100%;
	display: flex;
	justify-content: center;
	flex-direction: column;
}
.one_1{
	width: 100%;
	height:auto;
	font-size: 5.428rem;
	line-height: 7.571rem;
	text-transform: uppercase;
	color: #fff;
	font-family: oph;
}
.one_1 span{
	display: block;
	font-size: 5.714rem;
}

.one_2{
	width:100%;
	height: auto;
	font-size: 3.428rem;
	color: #fff;
	margin-top: 3.142rem;
}
.one_2 span{
	color: #009de1;
	font-weight: bold;
}
.one_right{
	display: flex;
	justify-content: flex-end;
	flex-direction: column;
	margin-right: 12.6%;
	
}
.one_right img{ height: 78%; width: auto;}


.two{
	width: 78%;
	height: auto;
	position: relative;
	z-index: 2;
	margin: 0 auto;
}
.two_tit{
	width:100%;
	height: auto;
	color: #fff;
	font-size: 7.857rem;
	font-family: opm;
}


.two_con{
	width: 100%;
	height:auto;
	position: relative;
	margin-top: 10vh;
}
.two_1{
	width:60%;
	height: auto;
	font-size: 1.285rem;
	color: #fff;
	line-height: 2.714rem;
	position: relative;
	z-index: 2;
	
}

.three_warp{
	width:100%;
	height:  auto;
	position: relative;
	margin-top: 13vh;
	padding-top: 22vh;
}
.three_bg{
	width: 100vw;
	height: 101.6vw;
	position: absolute;
	top: 0;
	left: 0;
	font-size: 0px;
}
.three_bg img{
	width:100%;
	height: auto;
	object-fit: cover;
	object-position: center;
}
.three_img{
	width: 64%;
	height: auto;
	margin: 0 auto;
	font-size: 0px;
	position: relative;
	z-index: 2;
	margin-top: 5.142rem;
}
.three_img img{
	width:100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	border-radius:20px;
}
.three{
	width: 78vw;
	height: auto;
	margin: 0 auto;
	position: relative;
	z-index: 2;
	margin-top: 11vh;
}
.three_all{
	width:100%;
	display: flex;
	justify-content: space-between;
	margin-top: 8.5vh;
}
.three_left{
	position: relative;
	width: 50%;
}
.three_1{
	font-size: 1.142rem;
	color: #fff;
	font-family: oph;
}
.three_2{
	color: #fff;
	font-size: 4.285rem;
	font-family: opb;
	margin-top: 2rem;
}
.three_3{
	font-size: 1.142rem;
	color: #fff;
	font-family: opm;
	margin-top: 2.142rem;
}
.three_6{
	margin-top: 14.5vh;
}
.three_6 img{
	height: 42vh;
	width: auto;
}
.three_4{
	color: #fff;
	font-size: 3.855rem;
	font-family: opb;
	line-height: 5.142rem;
	margin-top: 2.285rem;
}
.three_5{
	color: #fff;
	font-size: 3rem;
	font-family: opb;
	line-height: 3.571rem;
	margin-top: 3.285rem;
}




.love_con{
	width:100%;
	height: auto;
	margin-top: 50vh;
	border: 1px dashed #fff;
}
.love_yan{
	width: 100%;
	height:28vh;
	background: #26499d;
	position: relative;
	padding: 3% 3%;
	display: flex;
	justify-content: space-between;
	flex-direction: column;
}


.love_yan:nth-child(2){background: #00b0ec; height: 19vh;padding: 2% 3% 1% 3%;}
.love_yan:nth-child(2) .love_yan_2{font-size: 5.428rem;}

.love_yan:nth-child(3){background: #051123; height: 16vh;padding: 2% 3% 1% 3%;}
.love_yan:nth-child(3) .love_yan_2{font-size: 4.857rem;}

.love_yan:nth-child(4){background: #f3f3f3; height: 16vh;padding: 2% 3% 1% 3%;}
.love_yan:nth-child(4) .love_yan_2{font-size: 4.857rem; color: #26499d;}
.love_yan:nth-child(4) .love_yan_1{color: #26499d;}

.love_yan:nth-child(5){background: #fff; height: 16vh;padding: 2% 3% 1% 3%;}
.love_yan:nth-child(5) .love_yan_2{font-size: 4.857rem; color: #26499d;}
.love_yan:nth-child(5) .love_yan_1{color: #26499d;}


.love_yan_2{
	color: #fff;
	font-size: 6.285rem;
	font-family: opm;
}
.love_yan_1{
	width:100%;
	display: flex;
	justify-content: space-between;
	color: #fff;
	font-size: 1.428rem;
}

.five_warp{
	width:78%;
	margin: 0 auto;
	height: auto;
	position: relative;
	padding-top: 18vh;
}
.five{
	width: 100%;
	height: auto;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	margin-top: 11vh;
	position: relative;
}
.five:after{
	content: '';
	width: 28.64vw;
	height: 28.64vw;
	background: rgba(0,0,0,0.8);
	border: 1px dashed #fff;
	border-radius:50%;
	position: absolute;
	right: -3rem;
	top: calc(50% - 14.32vw);
}
.five:before{
	content: '';
	width: 28.64vw;
	height: 28.64vw;
	background: rgba(0,0,0,0.8);
	border: 1px dashed #fff;
	border-radius:50%;
	position: absolute;
	left: -3rem;
	bottom: -15vh;
}

.five_en{
	width: 100%;
	height: auto;
	position: absolute;
	top: 0;
	right: 0;
	font-size: 11.285rem;
	font-family: oph;
	-webkit-text-stroke: 1px rgba(255,255,255,0.16);
	color: transparent;
	text-transform: uppercase;
	text-align: right;
	padding-right: 6.6%;
}
.five_en span{
	display: block;
	padding-right: 10%;
}

.five_left{
	width: 46.4%;
	position: relative;
	z-index: 2;
}
.five_img{
	width:100%;
	height: auto;
	font-size: 0px;
	text-align: right;
}
.five_img:nth-child(2){ margin-top: 10vh;}
.five_img img{
	width: 82.47%;
}
.five_right{
	width:46.4%;
	height:auto;
	padding-top: 49vh;
	position: relative;
	z-index: 2;
}
.five_right .five_img{text-align: left;}

.five_con{
	width: 100%;
	height: 9.571rem;
	border-bottom: 1px solid #000;
	display: flex;
	justify-content: space-between;
}
.five_con:last-child{border-bottom: none;}
.five_1{
	color: #000;
	font-size: 1.571rem;
	line-height: 7.142rem;
}
.five_2{
	display: flex;
	align-items: center;
	height: 100%;
	color: #000;
	font-size: 1.571rem;
	line-height: 3.142rem;
}
.five_img{
	width:100%;
	height: auto;
	font-size: 0px;
	overflow: hidden;
}
.five_img img{
	width: 100%;
	height: auto;
}




.kuang{
	width: 78%;
	height: auto;
	margin: 0 auto;
	margin-top:34vh;
	position: relative;
}
.kuang_img{
	width: 100%;
	height: auto;
	font-size: 0px;
	position: relative;
	z-index: 4;
	margin-top: 8vh;
}
.kuang_img img{
	width: 100%;
	height: auto;
}
.alphabet{
	width:78%;
	height:auto;
	margin: 0 auto;
	position: relative;
	padding-top: 14vh;
}
.alphabet_en{
	width: 100%;
	font-size: 13.857rem;
	font-family: hwhp;
	-webkit-text-stroke: 1px rgba(255,255,255,0.3);
	color: rgba(255,255,255,0.01);
	display: flex;
	justify-content: space-between;
	padding-right: 5%;
	letter-spacing: 1rem;
}
.alphabet_en span:nth-child(1){ padding-top: 5.142rem; position: relative;}
.alphabet_en_1{
	width: 1rem;
	height: 1rem;
	border-radius:50%;
	position: absolute;
	right: -3rem;
	bottom: 3.5rem;
	
}
.alphabet_en_1 span:nth-child(1){
	display: block;
	width: 1rem;
	height: 1rem;
	background: #fff;
	border-radius:50%;
	animation: yincang 4s infinite normal ease;
	opacity: 0;
	padding-top: 0;
}
.alphabet_en_1:after{
	content: '';
	background: #fff;
	border: 1px solid #000;
	width: 1rem;
	height: 1rem;
	opacity: 0.6;
	position: absolute;
	left: 0.625rem;
	top: 0;
	border-radius:50%;
	animation: yincang 4s 0.5s infinite normal ease;
}
.alphabet_en_1:before{
	content: '';
	background: #fff;
	border: 1px solid #000;
	width: 1rem;
	height: 1rem;
	opacity: 0.33;
	position: absolute;
	left: 1.375rem;
	top: 0;
	border-radius:50%;
	z-index: 2;
	animation: yincang 4s 1s infinite normal ease;
}

@keyframes yincang {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
.alphabet .two_tit{ text-align: right;}


.alphabet_all{
	width: 78vw;
	margin: 0 auto;
	display: flex;
	justify-content: flex-start;
	position: relative;
	z-index: 2;
	margin-top: 10vh;
}
.alphabet_all:after{
	content: '';
    width: 96vw;
    height: 111vh;
    position: absolute;
    top: 45vh;
    left:-11vw;
    background: rgba(0,0,0,0.88);
    border: 1px dashed rgba(255,255,255,0.5);
    border-left: none;
    border-top-right-radius: 800px;
    border-bottom-right-radius: 800px;
}
.alphabet_ying {
    position: absolute;
	top: 70vh;
	right: -5vw;
    font-size: 16rem;
    color: transparent;
    writing-mode: vertical-lr;
	-webkit-text-stroke: 1px rgba(255,255,255,0.5);
	font-family: oph;
	text-transform: uppercase; 
	z-index: 1;
}

.alphabet_left{
	width:23.33%;
	padding-top: 30vh;
	position: relative;
	z-index: 2;
	margin-right: 8.2vh;
}
.alphabet_left:nth-child(2){ padding-top: 0;}
.alphabet_left:nth-child(3){ padding-top: 18vh;}
.alphabet_1{
	width:100%;
	height: auto;
	font-size: 0;
	overflow: hidden;
}
.alphabet_1 img{
	width: 100%;
	height: auto;
}
.alphabet_1:nth-child(2){ margin-top: 8.2vh;}


.shell{
	width:94%;
	margin: 0 auto;
	position: relative;
	height: auto;
	overflow: hidden;
	font-family: opm;
	font-size: 1.142rem;
	color: #fff;
	line-height: 1.857rem;
	z-index: 2;
	padding-bottom: 14vh;
	text-align: right;
}
.three_bg_yin{ display: none;}
@media screen and (max-width:1599px)and (min-width:1440px){
	.one_1{ font-size: 4.75rem; line-height: 7rem;}
	.one_1 span{ font-size: 5rem;}
	.one_2{ font-size: 3rem;}
	.one_right img { height: 74%;}
	.two_tit{ font-size: 7rem;}
	.three_img{ margin-top: 4rem;}
	.three{ margin-top: 9vh;}
	.three_all{ margin-top: 6.5vh;}
	.three_4{ font-size: 3.625rem; line-height: 5rem;}
	.love_yan:nth-child(3) .love_yan_2,.love_yan:nth-child(4) .love_yan_2,.love_yan:nth-child(5) .love_yan_2 {
		font-size: 4.5rem;
	}
	.alphabet_en{ font-size: 12.25rem;}
	.alphabet_en_1{ right: -1.5rem; bottom: 2rem;}
	.alphabet_ying { font-size: 15rem;}
}
@media screen and (max-width:1439px)and (min-width:1280px){
	.one_right{ margin-right: 10%;}
	.one_1{ font-size: 4.75rem; line-height: 7rem;}
	.one_1 span{ font-size: 5rem;}
	.one_2{ font-size: 3rem;}
	.one_right img { height: 74%;}
	.two_tit{ font-size: 7rem;}
	.three_img{ margin-top: 5.5rem;}
	.three{ margin-top: 9vh;}
	.three_all{ margin-top: 6.5vh;}
	.three_4{ font-size: 3.625rem; line-height: 5rem;}
	.love_yan_2{ font-size: 5.75rem;}
	.love_yan:nth-child(2) .love_yan_2 {
		font-size: 4.5rem;
	}
	.love_yan:nth-child(3) .love_yan_2,.love_yan:nth-child(4) .love_yan_2,.love_yan:nth-child(5) .love_yan_2 {
		font-size: 3.25rem;
	}
	.alphabet_en{ font-size: 11.25rem;}
	.alphabet_en_1{ right: -1.5rem; bottom: 2rem;}
	.alphabet_ying { font-size: 15rem;}
}
@media screen and (max-width:1365px)and (min-width:1280px){
	.three_img {
		margin-top: 4.5rem;
	}
	.three_4 {
		font-size: 3.25rem;
		line-height: 4.5rem;
	}
	.three_5 {
		font-size: 2.5rem;
		line-height: 3rem;
		margin-top: 2.75rem;
	}
	.two_tit {
		font-size: 6.25rem;
	}
	.alphabet_ying { font-size: 14rem;}
}
@media screen and (max-width:1279px)and (min-width:1024px){
	.one:after{ width: 92%;}
	.one_all{ width: 90vw;}
	.one_1{ font-size: 4rem; line-height: 6.5rem;}
	.one_2{ font-size: 3rem;}
	.one_1 span{ font-size: 4.5rem;}
	.one_right{ margin-right: 8%;}
	.one_right img{ height: 70%;}
	.two{ width: 90vw;}
	.two_tit{ font-size: 5rem;}
	.two_con{ margin-top: 8vh;}
	.three_img{ width: 74%; margin-top: -1.5rem;}
	.three{ width: 90vw; margin-top: 4vh;}
	.three .two_tit{ width:90%; margin: 0 auto;}
	.three_all{ width: 90%; margin: 0 auto;margin-top: 5vh;}
	.three_2{ font-size: 3.25rem; margin-top: 0.5rem;}
	.three_3{ margin-top: 1.875rem;}
	.three_4 {
		font-size: 3rem;
		line-height: 3.375rem;
		margin-top: 1.75rem;
	}
	.three_5 {
		font-size: 2rem;
		line-height: 2.571rem;
		margin-top: 2.5rem;
	}
	.love_con{ margin-top: 30vh;}
	.five_warp{ width: 90%; padding-top: 14vh;}
	.five{ margin-top: 8vh;}
	.five_en{ font-size: 10rem;}
	.kuang{ width: 90%; margin-top: 30vh;}
	.kuang_img{ margin-top: 6vh;}
	.alphabet{ width: 90%; padding-top: 10vh;}
	.alphabet_en{ font-size: 11.5rem;}
	.alphabet_en_1{ display: none;}
	.alphabet_all{ width: 90vw;}
	.alphabet_all:after{ width: 98vw;}
	.alphabet_left{ margin-right: 5vh;}
	.alphabet_1:nth-child(2) {
		margin-top: 5vh;
	}
	.alphabet_ying {
		top: 50vh;
		right: -4vw;
		font-size: 13rem;
		color: transparent;
	}
	.shell{ padding-bottom: 10vh;}
}
@media screen and (max-width:1023px)and (min-width:300px){
	/*头部导航*/
	.one_warp{
		height: 50vh;
	}
	.one{
		height:50%;
	}
	.one:after{
		width: 92%;
	}
	.one_typeright{
		font-size: 1rem;
		line-height: 1.5rem;
		right: 2%;
		display: none;
	}
	.one_all{
		width: 92vw;
	}
	.one_1{
		font-size: 2rem;
		line-height: 3.5rem;
	}
	.one_1 span{
		font-size: 2.5rem;
	}
	.one_2{
		font-size: 1.875rem;
		margin-top: 1.5rem;
	}

	.one_right{ display: none;}


	.two{
		width: 92%;
	}
	.two_tit{
		font-size: 3rem;
	}
	.two_con{
		margin-top: 4vh;
	}
	.two_1{
		width:100%;
		font-size: 1.125rem;
		line-height: 2.25rem;
	}

	.three_warp{
		margin-top: 4vh;
		padding-top:12vh;
	}
	.three_img{
		width: 80%;
		margin-top:-2.25rem;
	}
	.three_img img{
		border-radius:7px;
	}
	.three{
		width:92vw;
		height: auto;
		margin: 0 auto;
		position: relative;
		z-index: 2;
		margin-top: 11vh;
	}
	.three_bg .three_bg_xian{ display: none;}
	.three_bg .three_bg_yin{ display: block;}
.three_all{
	justify-content:center;
	flex-direction: column;
	margin-top:4vh;
}
.three_left{
	width: 100%;
}
.three_1{
	font-size: 1rem;
}
.three_2{
	font-size: 2.875rem;
	margin-top: 1rem;
}
.three_3{
	font-size: 1rem;
	margin-top: 1.75rem;
}
	.three_right{ margin-top: 6vh;}
.three_4{
	font-size: 2.75rem;
	line-height: 4rem;
	margin-top: 2rem;
}
.three_5{
	font-size: 2rem;
	line-height: 3rem;
	margin-top: 2.5rem;
}




.love_con{
	margin-top: 10vh;
}
.love_yan{
	height:24vh;
	padding: 3% 3%;
}


.love_yan:nth-child(2){ height: 16vh;}
.love_yan:nth-child(2) .love_yan_2{font-size: 4.5rem;}

.love_yan:nth-child(3){height: 14vh;}
.love_yan:nth-child(3) .love_yan_2{font-size: 3.75rem;}

.love_yan:nth-child(4){ height: 14vh;}
.love_yan:nth-child(4) .love_yan_2{font-size: 3.75rem;}

.love_yan:nth-child(5){ height: 14vh;}
.love_yan:nth-child(5) .love_yan_2{font-size: 3.75rem;}

.love_yan_2{
	font-size: 5rem;
}
.love_yan_1{
	font-size: 1rem;
}

.five_warp{
	width:92%;
	padding-top: 10vh;
}
.five{
	margin-top: 6vh;
}
.five:after{
	width: 40vw;
	height: 40vw;
	right: -2rem;
	top: calc(50% - 20vw);
}
.five:before{
	width: 40vw;
	height: 40vw;
	bottom: -4vh;
	left: -2vw;
}

.five_en{
	font-size: 6rem;
	padding-right: 4%;
}
.five_en span{
	padding-right: 4%;
}
.five_img:nth-child(2){ margin-top:6vh;}
.five_img img{
	width: 85%;
}
.five_right{
	padding-top: 24vh;
}

.kuang{
	width: 90%;
	margin-top:14vh;
}
.kuang_img{
	margin-top: 4vh;
}

.alphabet{
	width:92%;
	padding-top: 8vh;
}
.alphabet_en{
	font-size: 4.75rem;
	padding-right: 0%;
	letter-spacing: 0.25rem;
}
.alphabet_en span:nth-child(1){ padding-top: 2rem;}
.alphabet_en_1{ display: none;}


.alphabet_all{
	width: 92vw;
	margin-top: 4vh;
}
.alphabet_all:after{
    width: 96vw;
    height: 40vh;
    top: 16vh;
    left:-11vw;
}
.alphabet_ying {
	top: 15vh;
	right: -5vw;
    font-size: 8rem;
}

.alphabet_left{
	width:28%;
	padding-top: 16vh;
	margin-right: 3vh;
}
.alphabet_left:nth-child(3){ padding-top:14vh;}
.alphabet_1:nth-child(2){ margin-top: 3vh;}


.shell{
	width:92%;
	font-size: 1rem;
	line-height: 1.5rem;
	padding-bottom: 8vh;
	margin-top: 4vh;
}

	

}