.sub .key1	{
	position: relative;
	background-image: url(images/project_key.jpg);
	background-size: cover;
	height: 100vh;
	z-index: 3;
}

.sub .key1 .inner	{
	width: 40%;
}

.sub .key1 .inner img	{
	width: 33%;
}

.sub .key1 .inner h1 span	{
	background-color: rgba(255,255,255,.9);
	display: block;
	font-weight: normal;
	font-size: 2.5vw;
	padding-left:15px;
}

.sub .sec1	{
	margin-top: 50px;
}
.sub .sec1 p	{
	line-height: 240%;
}
.sub .sec1 .col3plus	{
	display: flex;
}
.sub .sec1 .col3plus .titlecol	{
	width: 25%;
}
.sub .sec1 .col3plus .titlecol img	{
	height: 10vw;
	margin-bottom: 50px;
	margin-left: 27.5px;
}

.sub .sec1 .col3plus .col3	{
	margin-top: 3.75vw;
	width: 72.5%;
	margin-right: 0;
	margin-left: auto;
	flex-wrap: wrap;
	align-content: space-between;
}

.sub .sec1 .col3plus .col3 .col	{
	width: calc(33% - 7.5px);
	margin-bottom: 10px;
}

.sub .titlebar	{
	text-align:center;
	color: white;
	font-weight: normal;
	font-size: 2.3vw;
	padding: 3vw 0;
	background-size: 100% auto;
	background-repeat: no-repeat;
	background-position: center center;
	}

.sub .titlebar p { margin-left:25%; font-size: 2.4vw; color: white; padding: 3vw 0; }

.sub .sec2 .titlebar	{
	background-image: url(images/sec2_title.svg);
}

.sub .sec3 .titlebar	{
	background-image: url(images/sec3_title.svg);
}

.sub .sec4 .titlebar	{
	background-image: url(images/sec4_title.svg);
}

.sec2	{
	position: relative;
}
.sec2 .col2 .col img.p2_1	{
	position: absolute;
	left: 0;
	width: 50vw;
}
.sec2 .col2 .col.pcol	{
	position: relative;
}
.sec2 .col2 .col p	{
	padding: 0 30px 30px;
	box-sizing: border-box;
}
.sec3 .col2	{
	margin-bottom: 50px;
}
.sec3 .col2 .col img	{
	width: 50vw;
}
.sec3 .inner .col2	{
	margin-bottom: 50px;
}
.sec3 .inner .col2 .col:first-child	{
	padding: 0 15px 0 30px;
}
.sec3 .inner .col2 .col:last-child p	{
	padding: 0 30px 0 15px;
}

.sec4 .inner .col2	{
	margin-top: 0;
	}

.sec4 .col2 .col img	{
	position: absolute;
	right: 0;
	width: 50vw;
}

.sec4 .col2 .col p	{
	padding: 0 30px 30px;
}
	
.sec5 .col .col p	{
	padding:30px 0 30px 30px;
}

.ml30	{
	margin-left: 30px !important;
	}

.keiseiji { margin:40px 0 0 50px; font-size:1.0vw; }

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

	.sub .titlebar p { text-align:left; margin:10px 0 0 20px; font-size: 5vw; color: white; padding: 3vw 0; }
	
	.sub .key1	{
		position: relative;
		background-image: url(images/project_key_sp.jpg);
	}
	.sub .key1 .inner	{
		width: 80%;
	}
	.sub .key1 .inner img	{
		width: 40vw;
		margin-bottom: 5px;
	}
	
	.sub .key1 .inner h1 span	{
		font-size: 5.7vw;
	}
	
	.sub .inner.vmiddle	{
		top: 80%;
	}
	
	.sub .sec1 p	{
		line-height: 240%;
		font-size: 4vw;
	}
	
	.sub .sec1 .col3plus	{
		flex-direction: column;
	}
	
	.sub .sec1 .col3plus .titlecol	{
		width: 100%;
	}
	
	.sub .sec1 .col3plus .titlecol img	{
		height: 25vw;
		margin-bottom: 30px;
		margin-left: 0;
	}
	.sub .sec1 .col3plus .col3	{
		width: 100%;
		margin-top: 0;
		margin-bottom: 50px;
	}
	
	.sub .sec1 .col3plus .col3 .col	{
		width: 49%;
	}
	
	.sub .titlebar	{
		text-align:center;
		color: white;
		font-weight: normal;
		font-size: 5vw;
		padding: 30vw 0 5vw;
		background-size: 100% auto;
		background-repeat: no-repeat;
		background-position: center center;
	}
	
	.sub .sec2 .titlebar	{
		background-image: url(images/sec2_title_sp.svg);
	}
	
	.sub .sec3 .titlebar	{
		background-image: url(images/sec3_title_sp.svg);
	}
	
	.sub .sec4 .titlebar	{
		background-image: url(images/sec4_title_sp.svg);
	}
	
	.col2	{
		flex-direction: column;
		width: 100vw;
		margin-left: -25px;
	}
	.col2 .col	{
		width: 100%;
		margin-bottom: 30px;
	}
	.sec2 .col2 .col img.p2_1	{
		position: relative;
		width: 100vw;
	}
	.sec2 .col2 .col img.p2_2	{
		width: calc(100% - 50px);
		margin-left: 25px;
	}
	.sec2 .col2 .col p	{
		position: static;
		transform: none;
		padding: 30px 30px 0;
	}
	
	.sec3 .inner .col2 .col:first-child	{
		padding: 0;
		margin-bottom: 0;
	}
	.sec3 .col2	{
		margin-left: 0;
		margin-left: -25px;
	}
	
	.sec3 .col2.imgcol	{
		margin-left: 0;
	}
	
	.sec3 .col2.imgcol .col	{
		margin-bottom: 0;
	}
	.sec3 .inner .col2 .col p	{
		padding: 30px 30px 0 !important;
		margin-bottom: 0;
	}
	
	.sec3 .inner .col2 .col:last-child p	{
		padding: 0 30px !important;
	}
	
	.sec4 .inner .col2	{
	margin-top: 50px;
	}
	
	.sec4 .col2 .col img	{
		width: 100vw;
	}
	
	.sec3 .col2 .col img	{
		width: 100vw;
	}
	.sec4 .col2 .col	{
		margin-bottom: 0;
	}
	.sec4 .col2 .col img	{
		position: relative;
	}
	
	.sec5 .col .col p	{
		padding:30px 0 0 0;
	}

	.ml30	{
	margin-left: 0 !important;
	}

	.keiseiji { margin:40px 0 0 30px; font-size:3.0vw; }
}