@charset "utf-8";
/* ------------------------------------------------------------ common */

header { padding: 30px 0; }
header h1 { font-size: 28px; color: #707070; padding-left: 5%; }


footer { text-align: center; padding: 50px 0 12px; }
footer h2 { font-family: "Noto-Sans-JP-Bold"; font-size: 24px; margin-bottom: 16px; }
footer p { margin-bottom: 60px; }
footer .bottom { margin-bottom: 0; }


h3 { font-family: 'Noto-Sans-JP-Medium'; font-size: 46px; text-align: center; }
h3 span { display: block; position: relative; font-family: 'Noto-Sans-JP-Medium'; font-size: 28px; margin: 0 auto 30px; }
h3 span::after { content: ''; position: absolute; bottom: -12px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); width: 55px; border: 1px solid #35b47e; }


/* ------------------------------------------------------------ index */

#fv { padding: 452px 0 118px; background: url(../images/fv.jpg) no-repeat center top / cover; }
#fv h2 { font-family: "Noto-Sans-JP-Bold"; font-size: 46px; color: #fff; }
#fv h2 span { display: inline-block; padding: 18px 20px; background: linear-gradient(rgb(80 245 237 / .92) 0%, rgb(83 243 215 / .92) 100%); }

#news { padding: 69px 0 65px; }
#news h3 { margin-bottom: 20px; }
#news .list { border: 1px solid #707070; padding: 30px 44px; }
#news .list dl { display: flex; margin-bottom: 20px; font-size: 20px; }
#news .list dl:last-child { margin-bottom: 0; }
#news .list dl dt { width: 170px; }
#news .list dl dd {  }

#about { position: relative; padding: 65px 0 200px; }
#about::before { content: ''; display: block; width: 100%; height: 89%; position: absolute; bottom: 0; background: url(../images/bg_01.jpg) no-repeat center bottom / cover; }
#about h3 { margin-bottom: 40px; position: relative; z-index: 1; }
#about p { font-size: 20px; line-height: 240%; padding: 0 50px; position: relative; z-index: 1;}

#works { padding: 145px 0 55px; text-align: center; }
#works h3 { margin-bottom: 25px; }
#works p { font-size: 20px; margin-bottom: 50px; }
#works .flex { display: flex; flex-flow: wrap; justify-content: space-between; align-items: flex-start; }
#works .flex .item { width: 520px; margin-bottom: 55px; }
#works .flex .item img { width: 100%; height: auto; margin-bottom: 25px; }
#works .flex .item p { font-size: 28px; margin-bottom: 0; }

#company { padding: 70px 0 20px; background: #27AC71; }
#company h3 { color: #fff; margin-bottom: 60px; }
#company h3 span::after { border: 1px solid #fff; }
#company .table {  }
#company .table dl { display: flex; font-family: "Noto-Sans-JP-Bold"; font-size: 20px; color: #fff; padding: 30px 64px; }
#company .table dl:nth-child(2n+1) { background: #0BD179; }
#company .table dl dt { width: 130px; }
#company .table dl dd {  }



/* ------------------------------------------------------------ mobile ------------------------------------------------------------ */
@media only screen and (max-width: 640px) {

	/* ------------------------------------------------------------ common */
	
	header { padding: 20px 0; }
	header h1 { font-size: 18px;padding-left: 5%; }
	
	
	footer { padding: 30px 0 10px; }
	footer h2 { font-size: 16px; margin-bottom: 12px; }
	footer p { font-size: 12px; margin-bottom: 30px; }
	footer .bottom { margin-bottom: 0; }
	
	
	h3 { font-size: 32px; line-height: 150%; }
	h3 span { font-size: 20px; margin: 0 auto 20px; }
	h3 span::after { bottom: -10px; width: 30px; }
	
	/* ------------------------------------------------------------ index */
	
	#fv { height: 85vh; padding: 60vh 0 0px; }
	#fv h2 { font-size: 30px; }
	#fv h2 span { padding: 12px 14px; }
	
	#news { padding: 35px 0 35px; }
	#news h3 { margin-bottom: 15px; }
	#news .list { padding: 20px 5%; }
	#news .list dl { display: block; margin-bottom: 20px; font-size: 16px; }
	#news .list dl:last-child { margin-bottom: 0; }
	#news .list dl dt { width: auto; margin-bottom: 10px; }
	#news .list dl dd { line-height: 150%; }
	
	#about { position: relative; padding: 35px 0 100px; }
	#about::before { width: 100%; height: 89%; }
	#about h3 { margin-bottom: 10px; }
	#about p { font-size: 16px; line-height: 200%; padding: 0 5%; }
	
	#works { padding: 75px 0 30px; }
	#works h3 { margin-bottom: 25px; }
	#works p { font-size: 16px; line-height: 150%; margin-bottom: 30px; }
	#works .flex { display: flex; flex-flow: wrap; justify-content: space-between; align-items: flex-start; }
	#works .flex .item { width: 520px; margin-bottom: 30px; }
	#works .flex .item img { width: 100%; height: auto; margin-bottom: 15px; }
	#works .flex .item p { font-size: 16px; }
	
	#company { padding: 40px 0 20px; }
	#company h3 { margin-bottom: 30px; }
	#company h3 span::after { border: 1px solid #fff; }
	#company .table {  }
	#company .table dl { display: block; font-size: 16px; padding: 15px 5%; }
	#company .table dl:nth-child(2n+1) { background: #0BD179; }
	#company .table dl dt { width: auto; margin-bottom: 10px; }
	#company .table dl dd { line-height: 130%; }

}