@charset "utf-8";
#hero{
	width: 100%;
	position: relative;
	margin-top: 60px;
	background-color: #000000;
}
#hero .kv{
	height: 754px;
	width: 100%;
	background: url(/wss/wp-content/themes/9rew/images/top/kv2.webp) center no-repeat;
	background-size: cover;
}

#hero .kv h2{
	position: absolute;
	top: 110px;
	left: 8.6%;
	width: 366px;
}

.line1{
	width: 105px;
	margin: 0 auto;
}
.line1 img{
	width: 100%;
}

#about{
	width: 100%;
	background-color: #000000;
	color: #ffffff;
	text-align: center;
	padding: 140px 0;
}
#about h2{
	font-size: 4rem;
	text-align: center;
	display: inline-block;
	color: #ffffff;
	position: relative;
/*
	padding-bottom: 2px;
	border-bottom: solid 1px #ffffff;
*/
}
#about h2::after{
	content: "";
	position: absolute;
	width: 30px;
	height: 3px;
	background-color: #ffffff;
	bottom: -28px;
	left: 50%;
	transform: translateX(-50%);
}
#about p{
	text-align: center;
	font-size: 2.4rem;
	line-height: 2.0em;
	padding: 80px 0 0 20px;
/*	text-indent: 15px;*/
}

#service{
	max-width: 1400px;
	margin: 0 auto;
	color: #333333;
	text-align: center;
	padding: 184px 0 180px 0;
	border-bottom: solid 1px #707070;
}
#service h2{
	font-size: 4rem;
	text-align: center;
	display: inline-block;
	position: relative;
	color: #707070;
/*
	padding-bottom: 2px;
	border-bottom: solid 1px #707070;
*/
}
#service h2::after{
	content: "";
	position: absolute;
	width: 30px;
	height: 3px;
	background-color: #707070;
/*
	bottom: -10px;
	left: 42px;
*/
	bottom: -28px;
	left: 50%;
	transform: translateX(-50%);
}
#service p{
	text-align: center;
	font-size: 2rem;
	line-height: 2.0em;
/*	padding: 80px 0 88px 0;*/
	padding: 80px 0 0 0;
}
#service p span{
	padding-bottom: 1px;
	border-bottom: solid 1px #333333;
}
#service .si1{
	width: 548px;
	margin: 0 auto;
	padding: 80px 0 0 0;
}

#achievements{
	max-width: 1400px;
	margin: 0 auto;
	color: #333333;
	text-align: center;
	padding: 180px 0;
}
#achievements h2{
	font-size: 4rem;
	text-align: center;
	display: inline-block;
	position: relative;
	color: #707070;
/*
	padding-bottom: 2px;
	border-bottom: solid 1px #707070;
*/
}
#achievements h2::after{
	content: "";
	position: absolute;
	width: 30px;
	height: 3px;
	background-color: #707070;
/*
	bottom: -10px;
	left: 36px;
*/
	bottom: -28px;
	left: 50%;
	transform: translateX(-50%);
}
#achievements ul{
	max-width: 1000px;
	margin: 0 auto;
	text-align: center;
	padding: 40px 0;
	overflow: hidden;
}
#achievements ul li{
	width: 96px;
	height: 200px;
	text-align: center;
	color: #BCBCBC;
	margin: 0 50px;
	float: left;
}
#achievements ul li div{
	font-size: 3rem;
	line-height: 1.4em;
	padding-top: 52px;
}

#owner{
	width: 100%;
	background-color: #000000;
	color: #ffffff;
	text-align: center;
	padding: 180px 0 160px 0;
}
#owner h2{
	font-size: 4rem;
	text-align: center;
	display: inline-block;
	color: #ffffff;
	position: relative;
/*
	padding-bottom: 2px;
	border-bottom: solid 1px #ffffff;
*/
}
#owner h2::after{
	content: "";
	position: absolute;
	width: 30px;
	height: 3px;
	background-color: #ffffff;
/*
	bottom: -10px;
	left: 37px;
*/
	bottom: -28px;
	left: 50%;
	transform: translateX(-50%);
}
#owner .profWrap{
	max-width: 1086px;
	margin: 0 auto;
	overflow: hidden;
	padding: 50px 0 0 0;
}
#owner .profWrap .profL{
	width: 41%;
	float: left;
}
#owner .profWrap .profR{
	float: right;
	width: 57%;
	text-align: left;
}
#owner .profWrap .profR h3{
	font-size: 3.2rem;
	padding: 6px 0 18px 0;
}
#owner .profWrap .profR h4{
	font-size: 2.4rem;
	position: relative;
	padding-bottom: 38px;
}
#owner .profWrap .profR p{
	font-size: 1.86rem;
	line-height: 1.9em;
}

#company{
	width: 100%;
	text-align: center;
	padding: 180px 0;
}
#company h2{
	font-size: 4rem;
	text-align: center;
	display: inline-block;
	color: #707070;
	position: relative;
/*
	padding-bottom: 6px;
	border-bottom: solid 1px #707070;
*/
}
#company h2::after{
	content: "";
	position: absolute;
	width: 30px;
	height: 3px;
	background-color: #707070;
/*
	bottom: -14px;
	left: 62px;
*/
	bottom: -30px;
	left: 50%;
	transform: translateX(-50%);
}
#company .comWrap{
	max-width: 1086px;
	margin: 0 auto;
	overflow: hidden;
/*	padding: 60px 0 90px 0;*/
	padding: 60px 0 0 0;
}
#company .comWrap .comL{
	width: 41%;
	float: left;
}
#company .comWrap .comR{
	float: right;
	width: 57%;
	text-align: left;
}
#company .comWrap .comR h3{
	font-size: 3rem;
	position: relative;
	padding: 30px 0 36px 0;
}
#company .comWrap .comR p{
	font-size: 2rem;
	line-height: 2.0em;
}
#company .comWrap .comR p a{
	border-bottom: solid 1px #333333;
}
#company .comWrap .comR p span.pc{
	display: inline-block !important;
}
#company .comWrap .comR p span.sp{
	display: none !important;
}

.anime{
	opacity: 0;
	transform: translateY(50px);
	transition: opacity 1.2s ease, transform 1.5s ease;
}
.is-visible {
    opacity: 1;
    transform: translateY(0);
}


@media screen and (max-width: 860px) {

	#hero{
		margin-top: 50px;
	}
	#hero .kv{
		height: 550px;
		background: url(/wss/wp-content/themes/9rew/images/top/kv2_sp.webp) center no-repeat;
/*		background-size: auto 100%;*/
		background-size: cover;
	}
	#hero .kv h2{
		position: relative;
		top: 60px;
		left: auto;
		width: 58.4%;
		margin: 0 auto;
	}

	#about{
		padding: 68px 0 76px 0;
	}
	#about h2{
		font-size: 3rem;
		margin: 0 0 10px 0;
	}
	#about h2::after{
		height: 2px;
		bottom: -16px;
	}
	#about p{
		font-size: 1.7rem;
		line-height: 2.0em;
		padding: 30px 0 0 16px;
	}

	#service{
		max-width: 84%;
		padding: 70px 0;
		border-bottom: none;
	}
	#service h2{
		font-size: 3rem;
		margin: 0 0 10px 0;
	}
	#service h2::after{
		height: 2px;
		bottom: -16px;
	}
	#service p{
		font-size: 1.5rem;
		padding: 46px 0 0 0;
	}
	#service .si1{
		width: 100%;
		padding: 46px 0 0 0;
	}

	#achievements{
		max-width: 84%;
		padding: 100px 0 60px 0;
	}
	#achievements h2{
		font-size: 3rem;
		margin: 0 0 10px 0;
	}
	#achievements ul{
		width: 100%;
		margin: 0 auto;
		text-align: center;
		padding: 35px 0 30px 0;
		overflow: hidden;
	}
	#achievements ul li{
		width: 19%;
		height: auto;
		display: block;
		text-align: center;
		color: #BCBCBC;
		margin: 0 18% 0 0;
		float: left;
	}
	#achievements ul li:nth-child(3n){
		margin: 0;
	}
	#achievements ul li div{
		font-size: 2.2rem;
		line-height: 1.4em;
		padding: 15px 0;
	}
	
	#owner{
		padding: 68px 0 80px 0;
	}
	#owner h2{
		font-size: 3rem;
		margin: 0 0 10px 0;
	}
	#owner h2::after{
		height: 2px;
		bottom: -16px;
	}
	#owner .profWrap{
		max-width: 84%;
		margin: 0 auto;
		overflow: hidden;
		padding: 26px 0 0 0;
	}
	#owner .profWrap .profL{
		width: 100%;
		float: none;
	}
	#owner .profWrap .profR{
		width: 88%;
		float: none;
		margin: 0 auto;
		text-align: center;
	}
	#owner .profWrap .profR h3{
		font-size: 2.9rem;
		padding: 28px 0 12px 0;
		line-height: 1.1em;
	}
	#owner .profWrap .profR h4{
		font-size: 2rem;
		line-height: 1.2em;
		padding-bottom: 32px;
	}
	#owner .profWrap .profR p{
		font-size: 1.5rem;
		line-height: 1.9em;
		text-align: center;
	}


	#company{
		max-width: 84%;
		margin: 0 auto;
		padding: 70px 0 80px 0;
	}
	#company h2{
		font-size: 3rem;
		margin: 0;
	}
	#company h2::after{
		height: 2px;
		bottom: -16px;
	}
	#company .comWrap{
/*		padding: 30px 0 44px 0;*/
		padding: 30px 0 0 0;
	}
	#company .comWrap .comL{
		width: 100%;
		float: none;
	}
	#company .comWrap .comR{
		width: 100%;
		float: none;
	}
	#company .comWrap .comR h3{
		font-size: 2rem;
		padding: 38px 0 16px 0;
		text-align: center;
	}
/*
	#company .comWrap .comR h3::after{
		bottom: 18px;
		left: 44%;
	}
*/
	#company .comWrap .comR p{
		font-size: 1.5rem;
		line-height: 1.8em;
	}
	#company .comWrap .comR p span{
		margin-top: 8px;
	}
	#company .comWrap .comR p span.pc{
		display: none !important;
	}
	#company .comWrap .comR p span.sp{
		display: block !important;
	}

}

@media screen and (max-width: 360px) {
	#owner .profWrap .profR p{
		font-size: 1.3rem;
	}
}