@charset "utf-8";

@font-face {
    font-family: pmzd;
    src: url('../font/pmzd.woff2');
	font-display: swap;
}
/*头部导航*/
.ying_bg{
	width:100%;
	height: auto;
	background: url( "../images/ying2_02.jpg") repeat-y;
}
.one_warp{
	width: 100%;
	height: 100vh;
	position: relative;
	background: url("../images/ying2_01.png") no-repeat left top;
	background-size:cover;
	z-index: 2;
}
.one_bg{
	position: absolute;
	bottom:0;
	right: 1.56%;
	width:43.75%;
	height: calc(100vw * 0.4375 * 756 / 840);
	font-size: 0px;
	overflow: hidden;
	 
}


.one_bg1{
	position: absolute;
	top: 30%;
	right: 4.58%;
	width:48.7%;
	height: calc(100vw * 0.487 * 2475 / 935);
	font-size: 0px;
}
.one_bg1_1{
	position:absolute;
	color:#fff;
	font-size: 1.125rem;
	top: -4.75rem;
	left: 4.5rem;
	line-height: 2rem;
	text-align: right;
}
.one_bg1_1 span{
	font-size: 1rem;
	text-transform: uppercase; 
	letter-spacing: 0.5rem;
}
.one_bg1_1 span:first-child{
	letter-spacing: 0;
	padding-right: 0.5rem;
}

.one_bg img,.one_bg1 img{
	width:100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
.one_bg2{
	position: absolute;
	top:11vh;
	right: 45.15%;
	overflow: hidden;
	writing-mode: vertical-lr;
	font-size: 6.25rem;
	color: transparent;
	text-transform: uppercase;
    background-image: -webkit-linear-gradient(top, #f5e5bb, #c5a578);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
	font-family: Gotham;
}
.one{
	width: 83vw;
	margin: 0 auto;
	height:100%;
	position: relative;
	z-index: 2;
	display: flex;
	justify-content: center;
	flex-direction: column;
}
.one_1{
	width:100%;
	height: auto;
	color: #fff;
	font-family: oppo_b;
	text-transform: uppercase; 
	font-size: 2.875rem;
	position: relative;
}
.one_1_1{
	width: 21.75rem;
	height: 31.25rem;
	position: absolute;
	top: -4.25rem;
	left: 3.5rem;
	z-index: -1;
	display: flex;
	justify-content: space-between;
}
.one_1_1_1{
	width: 4.625rem;
	height: 22.625rem;
	background: rgba(255,255,255,0.25);
	margin-top: 5.75rem;
	animation: chang 2s infinite normal ease;
	transform: scale(1,1);
}
.one_1_1_1:nth-child(2){ margin-top: 0; animation-delay: 0.5s;} 
.one_1_1_1:nth-child(3){ margin-top: 8.5rem; animation-delay: 1s;} 
.one_1_1_1:nth-child(4){ margin-top: 4.25rem; animation-delay: 1.5s;} 

@keyframes chang {
    0% {
        transform: scale(1,1);
    }
    50% {
        transform: scale(1,1.1);
    }
	100% {
        transform: scale(1,1);
    }
}



.one_2{
	width:100%;
	height: auto;
	color: #fff;
	font-family: oppo_b;
	font-size: 4.3125rem;
	margin-top: 4.5rem;
}
.one_3{
	width:100%;
	height: auto;
	color: #3a1d00;
	font-family: oppo_b;
	text-transform: uppercase; 
	font-size: 4.5rem;
	-webkit-text-stroke: 1px #dfb4a6;
}


.two{
	width:83vw;
	margin: 0 auto;
	height:auto;
	position: relative;
	padding: 10vh 0 24vh 0;
}
.two_1{
	font-size: 4.375rem;
	color: #2f3030;
	font-family: pmzd;
	
}
.two_1 span{position: relative;}

.two_1 span:after{
	content: '';
	background: url("../images/ying_11.png") no-repeat left;
	background-size:2.5rem;
	position: absolute;
	bottom: 0.875rem;
	right: -3.125rem;
	width: 2.5rem;
	height: 1.5rem;
}
.two_2{
	width:100%;
	color: #af725f;
	font-size: 2.875rem;
	line-height: 5.375rem;
}
.two_3{
	width: 40%;
	height: auto;
	font-size: 1rem;
	color: #010100;
	line-height: 2rem;
	margin-top: 4.5rem;
}


.three_warp{
	width:100%;
	height: auto;
	position:relative;
	padding:2vh 0 10vh 0;
}
.three_bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	background: #faf6f5;
    font-size: 0px;
    overflow: hidden;
	transform: skewY(10deg);
}
.three_bg1{
    position: absolute;
    bottom: -20vh;
    left: 0;
    width: 100%;
    height: 50%;
	background: #faf6f5;
    overflow: hidden;
}
.three{
	width: 83vw;
	height: auto;
	margin: 0 auto;
	position: relative;
	z-index: 2;
}
.three_tit{
	width:100%;
	display:flex;
	align-items: center;
	color: #53352b;
	font-family: oppo_b;
	font-size: 1.75rem;
	height: 8.125rem;
	position: relative;
}
.three_tit span{ position: relative; z-index: 2; color: #e1d2cd; font-size: 1.125rem;text-transform: uppercase; padding-left: 2rem;}
.three_tit span:after{
	content:'';
	width: 2px;
	height: 0.875rem;
	position: absolute;
	left: 1rem;
	top: calc(50% - 0.4375rem);
	background: #e1d2cd;
}
.three_list{
	width:40%;
	height: auto;
	display: flex;
	justify-content: space-between;
	margin-top: 1.5rem;
	padding-bottom: 4rem;
}
.three_con{
	-webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
}
.three_con:hover{transform: translateY(-10px);}

.three_con:nth-child(2) .three_con_1{ border: 1.5rem solid #2d2c2a;}
.three_con:nth-child(3) .three_con_1{ border: 1.5rem solid #e4d8cb;}
.three_con:nth-child(4) .three_con_1{ border: 1.5rem solid #f5f5f5;}
.three_con_1{
	border-radius:50%;
	border: 1.5rem solid #a67d4f;
	width: 7.125rem;
	height: 7.125rem;
}
.three_con_2{
	width:100%;
	text-align: center;
	font-size: 1.125rem;
	color: #53352b;
	line-height: 3.5rem;
}

.three_nei{
	width:40%;
	height: auto;
	margin-top: 1.5rem;
	display: flex;
	justify-content: space-between;
}
.three_zi{
	color: #feffff;
	font-size: 17rem;
	-webkit-text-stroke: 1px #dfb4a6;
	font-family: Gotham;
	text-transform: uppercase; 
	position: relative;
	
}
.three_zi_1{
	color: #e2bbaf;
	font-size: 17rem;
	font-family: Gotham;
	text-transform: uppercase; 
	position: absolute;
	top: -0.75rem;
	left: -0.75rem;
	animation: yanse 5s infinite normal ease;

}
@keyframes yanse {
    0% {
        color: #e2bbaf;
    }
    25% {
        color: #f0e6e4;
    }
	50% {
        color: #e8ddda;
    }
	75% {
        color: #ccb9b4;
    }
	100% {
       color: #e2bbaf;
    }
}


.three_right{
	
}
.three_1{
	width:100%;
	font-size: 1rem;
	color: #53352b;
	position: relative;
	height: 2.625rem;
	display: flex;
	align-items: center;
	padding-right: 0.875rem;
	justify-content: flex-end;
}
.three_1:after{
	content: '';
	border-radius:7px;
	position: absolute;
	top:0;
	right: 0;
	background: #f0e6e4;
	z-index: -1;
	width: 11.125rem;
	height: 100%;
}
.three_2{
	width:100%;
	font-size: 0.875rem;
	color: #53352b;
	text-align: right;
	padding-right: 0.875rem;
	height: 3rem;
	line-height: 2rem;
}
.three_right_con:nth-child(2) .three_1:after{
	background: #e8ddda;
	width: 13.25rem;
}
.three_right_con:nth-child(3) .three_1:after{
	background: #ccb9b4;
	width: 15.375rem;
}
.three_right_con:nth-child(4) .three_1:after{
	background: #b4a09b;
	width: 18.5rem;
}

.four_warp{
	width:100%;
	height: calc(100vw * 1534 / 1920);
	background: url("../images/ying_14.png") no-repeat center top;
	background-size:cover;
	position: relative;
	z-index: 2;
	margin-top: 6vh;
}
.four{
	width:100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.four .two_1{ width:83%; margin: 0 auto; color: #5d3124;}
.four .two_1 span:after{background: url(../images/ying1_07.png) no-repeat left;}
.four .two_2{ width:83%; margin: 0 auto; color: #fff;}

.four_img{
	width:100%;
	height: calc(100vw * 866 / 1917);
	font-size: 0px;
	overflow: hidden;
	margin-top: 2rem;
}
.four_img img{
	width:100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}


.alphabet{
	width:83%;
	height:auto; 
	overflow:hidden; 
	margin:0 auto;
	padding-top: 10vh;
	position: relative;
}
.alphabet_con{
	width:100%;
	height: auto;
	display: flex;
	justify-content: space-between;
	margin-top: 10vh;
	padding: 0px 9.4%;
	position: relative;
}
.alphabet_left{
	position: relative;
}
.alphabet_left:after{
	content: '';
	background: #af725f;
	width: 18.875rem;
	height: 24.125rem;
	position: absolute;
	left: calc(-1 * 83vw * 0.094);
	bottom: 3.75rem;
}
.alphabet_left:first-child .alphabet_img:nth-child(2){
	height: calc(83vw * 0.3622 * 783 / 577);
	margin-top: 4.125rem;
}

.alphabet_img{
	width:calc(83vw * 0.3622);
	height: calc(83vw * 0.3622 * 925 / 577);
	font-size: 0px;
	overflow: hidden;
	border-radius:30px;
	position: relative;
	z-index: 2;
}
.alphabet_img img{
	width:100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.alphabet_left:last-child .alphabet_img{
	height: calc(83vw * 0.3622 * 830 / 578);
	margin-top: 27.5rem;
}
.alphabet_left:last-child:after{

	width: 18.875rem;
	height: 24.125rem;
	position: absolute;
	left:inherit;
	right: calc(-1 * 83vw * 0.094);
	bottom: 23.5rem;
}
.alphabet_logo{
	position: absolute;
	bottom: 0;
	right: 0;
}
.alphabet_logo img{
	height: 4rem;
	width: auto;
}
.alphabet_en{
	position: absolute;
	top: 42vh;
	color: #af725f;
	opacity: 0.12;
	font-size: 9.875rem;
	line-height: 10.375rem;
	font-family: pmzd;
	text-transform: uppercase; 
	right: 8.5%;
	text-align: right;
	animation: go 1s ease-in-out alternate infinite;
	
}
@keyframes go {
   0% {
       -webkit-transform: rotate(5deg);
       -webkit-transform-origin: top center;
       -moz-transform: rotate(5deg);
       -moz-transform-origin: top center;
       transform: rotate(5deg);
       transform-origin: top center;
    }
    100% {
       -webkit-transform: rotate(-5deg);
       -webkit-transform-origin: top center;
       -moz-transform: rotate(-5deg);
       -moz-transform-origin: top center;
       transform: rotate(-5deg);
       transform-origin: top center;
    }
}

.alphabet_en span{
	padding-right: 7.5rem;
}


.five_warp{
	width: 100%;
	height: auto;
	position: relative;
	padding: 10vh 0;
	margin-top: 10vh;
}
.five_bg{
	width:100%;
	background: url("../images/ying1_14.png") no-repeat center;
	background-size:cover;
	height:calc(100vw * 1213 / 1920);
	position: absolute;
	top: 0;
	left: 0;
}
.five_zi {
    position: absolute;
    bottom: 53vh;
    color: #af725f;
    opacity: 0.12;
    font-size: 9.875rem;
    line-height: 10.375rem;
    font-family: pmzd;
    text-transform: uppercase;
    left:0;
	animation: go 1s ease-in-out alternate infinite;
}
.five_zi span{    padding-left: 7.5rem;}

.five{
	width:83%;
	height: auto;
	position: relative;
	margin: 0 auto;
	z-index: 2;
}

.five_list{
	width:100%;
	height: auto;
	display: flex;
	justify-content: flex-end;
	margin-top: 1.125rem;
}
.five_list div{ margin-left: 3.375rem; width: 21.56%; margin-top: 6rem;}
.five_list div:nth-child(1){ margin-top: 20.5rem; width: 23.25%;transform: translateX(6.625rem); z-index: 3;}
.five_list div:nth-child(2){ margin-top: 4rem; margin-left: -2rem;}
.five_list div:nth-child(3){ margin-top: 0px;}

.five_img{
	width:100%;
	height: calc(73vw * 656 / 1400);
	height: calc(var(--mainwidth) * 656 / 1400);
	font-size: 0px;
	overflow: hidden;
	border-radius: 50px;
	margin-top: 10vh;
}
.five_list div img{
	width:100%;
	height: auto;
	object-fit: cover;
	object-position: center;
}

.five_type{
	width: 100%;
	height: auto;
	font-size: 1.125rem;
	color: #000;
	
}


@media screen and (max-width:1023px)and (min-width:300px){

	.one_warp{
		height: auto;
		background: #af725f;
		padding-bottom: 4vh;
	}
	.one_bg{
		display: none;
	}
	.one_bg1{
		position: relative;
		width: 100%;
		height: auto;
		margin-top: 6vh;
		top: 0%;
    	right: 0%;
	}
	.one_bg1_1{
		display: none;
	}

	.one{
		width: 96vw;
		height:auto;
		padding-top: 8vh;
	}
	.one_1{
		text-align: center;
		font-size:1.625rem;
		padding-top: 10vh;
	}
	.one_1_1{
		width: 12.5rem;
		height: 17.9375rem;
		top: 2.5rem;
		left:calc(50% - 6.25rem);
	}
.one_1_1_1{
	width: 2.5rem;
	height: 13rem;
	margin-top: 4rem;
	background: rgba(255,255,255,0.1);
}
.one_1_1_1:nth-child(3){ margin-top: 6.5rem;} 
.one_1_1_1:nth-child(4){ margin-top: 3rem;} 

	
	

	.one_2{
		font-size: 2rem;
		margin-top: 2.5rem;
		text-align: center;
	}
	.one_3{
		text-align: center;
		font-size: 2.5rem;
	}


	.two{
		width:96vw;
		padding: 8vh 0 14vh 0;

	}
	.two_1{
		font-size: 2.25rem;
		text-align: center;
		text-transform: uppercase;
	}
	.two_1 span:after{
		display: none;
	}
	.two_2{
		font-size: 1.875rem;
		line-height: 3.375rem;
		text-align: center;

	}
	.two_3{
		width: 100%;
		font-size: 1.125rem;
		line-height: 2rem;
		margin-top: 3vh;
		text-align: center;
	}


	.three_warp{
		padding:4vh 0 4vh 0;
	}
	.three_bg {
		transform: skewY(6deg);
	}
	.three_bg1{
		bottom: -10vh;
	}
	.three{
		width: 96vw;
	}
	.three_tit{
		font-size: 1.375rem;
		height: 6.125rem;
		justify-content: center;
	}

	.three_list{
		width:100%;
		margin-top:2vh;
		padding-bottom: 4vh;
	}
	.three_con:nth-child(2) .three_con_1{ border: 10px solid #2d2c2a;}
	.three_con:nth-child(3) .three_con_1{ border: 10px solid #e4d8cb;}
	.three_con:nth-child(4) .three_con_1{ border: 10px solid #f5f5f5;}
	.three_con_1{
		border: 10px solid #a67d4f;
		width: 5.125rem;
		height: 5.125rem;
	}


	.three_nei{
		width:100%;
		margin-top: 2rem;
	}
	.three_zi{
		font-size: 16rem;

	}
	.three_zi_1{
		font-size: 16rem;
	}


	.four_warp{
		width:100%;
		height:auto;
		margin-top: 6vh;
		padding:10vh 0 6vh 0;
	}
	.four{
		width:100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.four .two_1{ width:96%;}
	.four .two_2{ width:96%;}

	.four_img{
		margin-top: 2vh;
	}



	.alphabet{
		width:96%;
		padding-top: 6vh;
	}
	.alphabet_con{
		margin-top: 6vh;
		padding: 0px 5%;
	}

	.alphabet_left:after{
		width: 10rem;
		height: 12.125rem;
		position: absolute;
		left: calc(-1 * 96vw * 0.094);
		bottom: 2.75rem;

	}
	.alphabet_left:first-child .alphabet_img:nth-child(2){
		height: calc(96vw * 0.42 * 783 / 577);
		margin-top: 4.125rem;
	}

	.alphabet_img{
		width:calc(96vw * 0.42);
		height: calc(96vw * 0.42 * 925 / 577);
		border-radius:10px;
	}

	.alphabet_left:last-child .alphabet_img{
		height: calc(96vw * 0.42 * 830 / 578);
		margin-top: 10rem;
	}
	.alphabet_left:last-child:after{

		width: 12rem;
		height: 9.125rem;
		right: calc(-1 * 96vw * 0.094);
		bottom:10rem;
	}
		.alphabet_logo img {
		height: 3rem;
		width: auto;
	}


	.alphabet_en{
		top: 22vh;
		font-size: 4rem;
		line-height: 4.375rem;
		right: 5%;
	}
	.alphabet_en span{
		padding-right: 7.5rem;
	}


	.five_warp{
		padding: 8vh 0;
		margin-top: 4vh;
	}

	.five_zi {
		bottom: 13vh;
		font-size: 4rem;
		line-height: 4.375rem;
	}

	.five{
		width:96%;
	}

	.five_list{
		margin-top: 2vh;
	}
.five_list div{ margin-left: 2%; width: 25%; }
.five_list div:nth-child(1){ margin-top: 10.5rem; width: 24%;transform: translateX(9%);}


.five_img{
	width:100%;
	height: calc(96vw * 656 / 1400);
	border-radius: 10px;
	margin-top: 10vh;
}

}