@charset "utf-8";
@import url(cmn.css);
@import url(base.css);
@import url('https://fonts.googleapis.com/css2?family=Tomorrow:wght@500&display=swap');

header nav ul li:nth-of-type(2) a{
	color: #6d6d6d !important;
}

main .material-icons{
	padding-left: 5px;
}

#lv .lv_bg img{
	object-position: 70% 50%;
	font-family: "object-position: 70% 50%;";
}


/*--------------sanyu--------------*/

#sanyu h2{
	max-width: 1200px;
}
#sanyu .wrapper{
	width: 100%;
	max-width: none;
	padding-right: 0;
}

#sanyu .flex{
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
}
#sanyu h2.fadeinup{
	animation-delay: 1s;
	animation-duration: 2s;
}
#sanyu p.fadeinup{
	animation-delay: 1s;
	animation-duration: 2s;
}
#sanyu figure{
	flex-basis: 50%;
	max-width: 50%;
}
#sanyu figure img{
	object-fit: cover;
	width: 100%;
	height: 630px;
	object-position: 75% 50%;
	font-family: 'object-fit: cover; object-position: 75% 50%;';
}
#sanyu .inner{
	padding-left: calc(5% + 130px);
	width: 50%;
	padding-right: 40px;
	padding-top: 0px;
}

#sanyu .inner p{
	margin-bottom: 20px;
}
@media screen and (max-width: 1200px){
	#sanyu .wrapper{
		padding-right: 20px;
	}
	#sanyu .flex{
		display: block;
	}
	#sanyu figure{
		max-width: 100%;
		text-align: center;
	}
	#sanyu figure img{
		height: auto;
		width: auto;
	}
	#sanyu .inner{
		width: 100%;
		margin-bottom: 60px;
		padding-right:0;
	}
	#sanyu .inner br{
		display: none;
	}
}
@media screen and (max-width: 950px){
	#sanyu .inner{
		padding-left: 0;
		margin-top: 100px;
	}
}

/*--------------iine--------------*/
#iine{
	background: #e5e4e4;
	margin-top: 40px;
	padding-top: 150px;
	padding-bottom: 100px;
}
#iine .wrapper{
	max-width: 1300px;
}

#iine .flex{
	display: flex;
	flex-wrap: nowrap;
	position: relative;
	margin-bottom: 130px;
}
#iine .flex:nth-of-type(even){
	flex-direction: row-reverse;
}
#iine .flex figure{
	width: 50%;
	z-index: 1;
	margin-top: -50px;
	margin-bottom: 50px;
}
#iine .flex div{
	padding: 70px 60px;
	width: 50%;
	z-index: 1;
}
#iine .flex:before{
	content: "";
	display: block;
	width: 90%;
	height: 100%;
	background: #fff;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 0;
}
#iine .flex:nth-of-type(even):before{
	left: 0;
}
#iine .flex:after{
	content: "01";
	display: block;
	width: 120px;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
	font-family: 'Tomorrow', sans-serif;
	font-size: 4.8rem;
	color: #494949;
	text-align: center;
}
#iine .flex:nth-of-type(even):after{
	left:0;
}
#iine .flex:nth-of-type(2):after{
	content: "02";
}
#iine .flex:nth-of-type(3):after{
	content: "03";
}
#iine .flex:nth-of-type(4):after{
	content: "04";
}
#iine .flex:nth-of-type(5):after{
	content: "05";
}
#iine .flex:nth-of-type(6):after{
	content: "06";
}
#iine .flex:last-child{
	margin-bottom: 0px;
}
@media screen and (max-width: 1100px){
	#iine .flex div{
		padding: 50px 40px;
	}
	#iine .flex:after{
		font-size: 3.6rem;
		width: 80px;
	}
}
@media screen and (max-width: 1000px){
	#iine .material-icons{
		font-size: 18px;
	}
}
@media screen and (max-width: 950px){
	#iine{
		padding: 120px 0;
		margin-top: 0px;
	}
	#iine .flex{
		flex-wrap: wrap;
		margin-bottom: 80px;
	}
	#iine .flex:nth-of-type(even){
		flex-direction: row-reverse;
	}
	#iine .flex figure{
		width: 85%;
		margin-bottom: 0;
	}
	#iine .flex div{
		width: 100%;
		padding: 40px calc(20px + 5%) 40px calc(20px + 10%);
	}
	#iine .flex:nth-of-type(even) div{
		padding: 40px calc(20px + 10%) 40px calc(20px + 5%);
	}
	#iine .flex:before{
		width: 95%;
	}
	#iine .flex:after{
		width: 15%;
		top: 20px;
	}
}
@media screen and (max-width: 600px){
	#iine{
		padding: 100px 0;
	}
	#iine .flex div{
		padding: 40px calc(20px + 3%) 40px calc(20px + 6%);
	}
	#iine .flex:nth-of-type(even) div{
		padding: 40px calc(20px + 6%) 40px calc(20px + 3%);
	}
}
