@charset "UTF-8";
/* CSS Document */


html{
	font-size:62.5%;/*16px62.5%=10px*/
}

	
body::before {
	
	background: url("../../images/oem/img oem backgraund.png") no-repeat center;/* 画像（ここにfixedは入れない） */
	background-size: cover;/* cover指定できる */
	content: "";
	display: block;
	position: fixed;/* 擬似要素ごと固定 */
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;/* 横幅いっぱい */
	height: 100vh;/* 縦幅いっぱい */
	font-family: a-otf-ryumin-pr6n, serif;
	font-style: normal;
	font-weight: 300;
		}	


img{
    max-width: 100%;
    height: 0 auto;
}


p{
	font-family: a-otf-ryumin-pr6n, serif;
	font-style: normal;
	font-weight: 300;
	color: #000000;
}


.header_img_pc{
		display: block;
		box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .1);
	}


	.header_img_sp{
		display: none;
	}

	.pc{
		display: block;
		}	

	.sp{
		display: none;	
		}


	.header{
		position:relative;
	}



	.header-inner{
			font-family: noto-sans-cjk-jp, sans-serif;
			font-style: normal;
			font-weight: 300;
			-webkit-appearance:none;
			-moz-appearance:none;
			appearance:none;
			display: block;
			padding: 40px;
			border: none;
			background-color:#000494;
			color:#fff;
			text-transform: uppercase;
			cursor:pointer;
		}


		.nav{
		color: #FFFFFF;
		}

		.nav-list{
			max-width: 100%;
			display: flex;
			display: -webkit-flex;
			justify-content: flex-end;
			align-items: center;
			list-style: none;
		}


		.nav-item{
			padding-right: 30px;
		}


		.nav-item:last-of-type{
			padding-right: 0px;
		}

		.nav-item>a{
			font-size: 2rem;
			color:#FFFFFF;
			line-height: -2px;
		}


		.sns{
			font-size: 2rem;
			line-height: -2px;

		}


		.bisei_rogo{
			max-width: 160px;
			position: absolute;
			top:30px;
			left: 40px;
		}




		.header_img{
			position:relative;

		}


		.header_text{
			width: 650px;
			position:absolute;
			top:220px;
			right: 200px;
			font-family: a-otf-ryumin-pr6n, serif;
			font-style: normal;
			font-weight: 300;
			font-size: 2.5rem;
			line-height: 2em;
			text-align: center;
		}



/*以下フェードイン表示の指定*/
.fadein {
    opacity: 0;
    animation: fadein 6s ease forwards;
}
@keyframes fadein {
    100% {  opacity: 1;}
}
 
/*以下遅延の指定*/
.txt01 {animation-delay: 1s;
		color: #FFFFFF;
}
.txt02 {animation-delay: 4s;
color: #FFFFFF;
}
.txt03 {animation-delay: 7s;
color: #FFFFFF;
}
.txt04 {animation-delay: 10s;
color: #FFFFFF;
}

.txt05 {animation-delay: 10s;
color: #FFFFFF;
}



	.esthe-irie{
		max-width: 1000px;
		margin: 0 auto;
		display: flex;
		margin-bottom: 150px;
		margin-top: 150px;

	}



	.esthe-irie-01{
		width: 900px;
		font-family: a-otf-ryumin-pr6n, serif;
		font-style: normal;
		font-weight: 300;
		font-size: 1.8rem;
		padding-right: 100px;
		text-align:justify;
		line-height:2em;
	}


	.esthe-irie-02{
		max-width: 200px;
	}



	.name{
		font-family: a-otf-ryumin-pr6n, serif;
		font-style: normal;
		font-weight: 300;
		font-size: 1.5rem;
		padding-top: 15px;
	}





.main_title{
	margin-top: 150px;
	margin-bottom: 150px;
	text-align: center;
	font-size: 3rem;
	line-height: 4.5rem;
	font-feature-settings: "palt";
}




/*section01*****
*******************
********************
*********************
**********************
**********************/


.section01{
	background-color: #000494;
	margin-top: 50px;
	margin-bottom: 150px;
	padding-top: 20px;
	padding-bottom: 20px;
}


.oem_title{
	font-size: 3rem;
	text-align: center;
}

.oem_text{
	color: #FFFFFF;
}


/*section02*****
*******************
********************
*********************
**********************
**********************/

.section02{
	max-width: 900px;
	margin: 0 auto;
	text-align: center;
}

.oem_01{
	padding-bottom: 100px;
}

.oem_01_box{
	padding-bottom: 40px;
}
	

.oem_01_title{
	font-size: 3rem;
		line-height: 2em;

}

.oem_01_text{
	font-size: 2rem;
	line-height: 4em;
}






/******************
***********************
button
**********************
**********************/


.btn{
	margin-bottom: 180px;

}






.btn-item{
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
	display: block;
	width: 500px;
	margin: 0 auto;	
	padding: 30px 15px;
	border: none;
	background-color: #1621A8;
	color:#fff;
	text-transform: uppercase;
	cursor:pointer;
	text-align: center;
}

.btn-text{
	font-family: a-otf-ryumin-pr6n, serif;
	font-style: normal;
	font-weight: 300;
	font-size: 3rem;
	color: #FFFFFF;	
}




/*footer*************
*************************
*************************
**************************
***************************/






.section04{
	max-width: 1000px;
	margin: 0 auto;
	margin-bottom: 150px;

}

.img{
	display: flex;
}

.img_box{
	padding-right: 30px;
}



.img_box:last-of-type{
	padding-right: 0px;
}


/*footer*************
*************************
*************************
**************************
***************************/






.footer{
	margin-top: 170px;
	background-color:#000494;
	text-align: center;
	font-size: 1rem;
	color:#fff;
}



.footer-text-01{
	padding-top: 150px;
	padding-bottom: 10px;
	font-size:2.4rem;
	color:#fff;
}


.footer-text-02{
	padding-bottom: 130px;
	color:#fff;

}


.copyright{
	color:#fff;
	padding-bottom: 30px;
}



















/*sp版  幅が641px以上のscreenの時はこのcssを使用してくださいという指示*/

@media screen and (max-width : 767px ){
	
	
	
html{
	font-size:62.5%;/*16px62.5%=10px*/
}

	
	

a{
	font-family: a-otf-ryumin-pr6n, serif;
	font-style: normal;
	font-weight: 300;
	-webkit-font-smoothing:antiliased;
	color:rgba(255,255,255,1.00);
}

img{
    max-width: 100%;
    height: 0 auto;
	}

	
	

	.pc{
		display: none;
		}	

	.sp{
		display: block;	
		box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .1);

		}
	
	
	/*****ナビゲーション******
	***********************
	***********************
	***********************
	**********************/
	
	
	.header{
		position:relative;
	}



	.header-inner{
			font-family: noto-sans-cjk-jp, sans-serif;
			font-style: normal;
			font-weight: 300;
			-webkit-appearance:none;
			-moz-appearance:none;
			appearance:none;
			display: block;
			padding: 20px;
			border: none;
			background-color:#000494;
			color:#fff;
			text-transform: uppercase;
			cursor:pointer;
		}


		.nav{
			color: #FFFFFF;
			}

		.nav-list{
			margin: 0 auto;
			margin-top: 35px;
			display: none;
			display: -webkit-flex;
			justify-content:space-between;
		}


		.nav-item{
			padding-right: 8px;
		}


		.nav-item:last-of-type{
			padding-right: 0px;
		}

		.nav-item>a{
			font-size: 1.2rem;
			color:#FFFFFF;
			line-height: -2px;
		}


		.sns{
			font-size: 1.2rem;
			line-height: -2px;
		}


		.bisei_rogo{
			max-width: 70px;
			position: absolute;
			top:20px;
			left: 20px;
		}

		.header_img{
			position:static;
		}


	
	
		.header_text{
			display: none;
			width: 500px;
			position:absolute;
			top:210px;
			right: 260px;
			font-family: a-otf-ryumin-pr6n, serif;
			font-style: normal;
			font-weight: 300;
			font-size: 2.5rem;
			line-height: 2em;
			text-align: center;
		}



	.header_text{
		display: none;
		width: 650px;
		position:absolute;
		top:220px;
		right: 200px;
		font-family: a-otf-ryumin-pr6n, serif;
		font-style: normal;
		font-weight: 300;
		font-size: 2.5rem;
		line-height: 2em;
		text-align: center;
		}

	
	.main_title{
		display: none;	
		margin: 0 auto;
		text-align: center;
		font-size: 2.5rem;
		line-height: 4.5rem;
		font-feature-settings: "palt";
		}
	
	
	
	.esthe-irie{
		max-width: 300px;
		margin: 0 auto;
		display: block;
		margin-bottom: 50px;
		margin-top: 50px;

	}



	.esthe-irie-01{
		width: 300px;
		margin: 0 auto;
		margin-bottom: 30px;
		font-family: a-otf-ryumin-pr6n, serif;
		font-style: normal;
		font-weight: 300;
		font-size: 1.5rem;
		padding-right:0px;
		text-align:justify;
		line-height:2em;
	}


	.esthe-irie-02{
		margin: 0 auto;
		max-width: 200px;
	}



	.name{
		font-family: a-otf-ryumin-pr6n, serif;
		font-style: normal;
		font-weight: 300;
		font-size: 1.5rem;
		padding-top: 15px;
	}




	
	
	
	
	
	
	/*section01*****
*******************
********************
*********************
**********************
**********************/


.section01{
	background-color: #000494;
	margin-top: 50px;
	margin-bottom: 50px;
	padding-top: 20px;
	padding-bottom: 20px;
}


.oem_title{
	font-size: 2rem;
	text-align: center;
}

.oem_text{
	color: #FFFFFF;
}


/*section02*****
*******************
********************
*********************
**********************
**********************/

.section02{
	max-width: 800px;
	margin: 0 auto;
	text-align: justify;
	padding-left: 20px;
	padding-right: 20px;

}

.oem_01{
	padding-bottom: 10px;
}

.oem_01_box{
	padding-bottom: 20px;
}
	

.oem_01_title{
	font-size: 1.6rem;
	line-height: 1.5em;

}

.oem_01_text{
	font-size: 1.5rem;
	line-height: 1.8em;
}






/******************
***********************
button
**********************
**********************/


.btn{
	margin-bottom: 180px;

}

.btn-item{
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
	display: block;
	width: 300px;
	margin: 0 auto;	
	padding: 20px 15px;
	border: none;
	background-color: #1621A8;
	color:#fff;
	text-transform: uppercase;
	cursor:pointer;
	text-align: center;
}

.btn-text{
	font-family: a-otf-ryumin-pr6n, serif;
	font-style: normal;
	font-weight: 300;
	font-size: 2rem;
	color: #FFFFFF;	
}



	
	
	
	

/*section04*************
*************************
*************************
**************************
***************************/



.section04{
	max-width: 1000px;
	margin: 0 auto;
	margin-bottom: 50px;

}

.img{
	display: flex;
}

.img_box{
	padding-right: 10px;
}



.img_box:last-of-type{
	padding-right: 0px;
}


	
	
	
	
	
/*footer*************
*************************
*************************
**************************
***************************/






.footer{
	margin-top: 50px;
	background-color:#000494;
	text-align: center;
	font-size: 1rem;
	color:#fff;
}



.footer-text-01{
	padding-top: 80px;
	padding-bottom: 10px;
	font-size:2.4rem;
	color:#fff;
}


.footer-text-02{
	padding-bottom: 80px;
	color:#fff;

}


.copyright{
	color:#fff;
	padding-bottom: 30px;
}




	
	
	
	


	
	
	}