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


/* 画面外にいる状態 */
.fadein {
    opacity : 0.1;
    transform : translate(0, 50px);
    transition : all 500ms;
    }
/* 画面内に入った状態 */
.fadein.scrollin {
    opacity : 1;
    transform : translate(0, 0);
    }


body{
	font-family: 'Noto Serif JP', serif;
	font-weight: 300;
	font-size:18px;
	color: #fff;
}

header{width:100%; text-align: left; background: #000;}
header h1{
	margin-left:1em;
	padding:0.6em 0;
	font-family: 'Archivo Black', sans-serif;
	font-weight: 900;
	font-size:36px;
}
#wrap{
	background: url(../images/bg.jpg) no-repeat top center;
	background-size: cover;
	padding-bottom:80px;
}
#company, #about, #contact{padding-top:80px;}
#company h2, #about h2, #contact h2{
	text-align: center;
	font-family: 'Raleway', sans-serif;
	font-weight: 600;
	font-size:28px;
}
#company dl{
	margin:40px auto 0;
	width:600px;
	display:flex;
 	flex-wrap: wrap;
}
#company dt{
  width: 30%;
  padding: 10px;
}
#company dd{
  padding: 10px;
  margin: 0;
  width: 70%;
}
#about{	text-align: center;}
#about h3{
	border-top:2px solid #fff;
	border-bottom:2px solid #fff;
	display: inline-block;
	width:100px;
	margin:40px auto 0;
	padding:0.4em 0;
}
#about p, #contact p{
	text-align: left;
	width:760px;
	margin:30px auto 0;
	line-height: 1.5em;
}
#contact a{
	display: block;
	width:200px;
	text-align: center;
	padding:1em 0;
	margin:60px auto 0;
	border:1px solid #fff;
}
#contact a:hover{
	background-color: hsla(0,0%,100%,0.8);
	transition: 0.5s;
	color: #000;
}
#contact .mail{
	font-size:0.85em;
	text-align: center;
	margin-top:10px;
}
footer{
	font-family: 'Archivo Black', sans-serif;
	font-weight: 600;
	text-align: center;
	padding:2em 0;
	background: #000;
}