/*-----------------------
		メイン画面 
 -----------------------*/
#DivCenterContent {
	/*width: 100%;
	min-height: 86%;
	display: grid;*/
}
/* ページタイトル */
.page-title {
	margin-bottom: 10vw;
}
/*-- アバウトエリア --*/
#DivMainContent {
	width: 100%;
	min-height: 100%;
	display: grid;
	grid-template-rows:10% 70% 20%;
}
.category {
	margin: 7vw 4vw;
}
.category.center{
	text-align:center;
}
.contents.center {
	font-size: 2.8vw;
	text-align: center;
	margin-top: 4vw;
	color: #c7c7c7;
}
.contents.left{
	margin-top:2vw;
}
.contents.right {
	text-align:right;
	margin-top: 2vw;
}
/* スクロール */
.scrolldown	{
	position: absolute;
	text-align: center;
	left:50%;
	height:5%;
}
.scrolldown a{
	position: absolute;
	left:-18px;
	bottom:35px;
	font-size:3vw;
}

/* 線の描写 */
.scrolldown::after {
	content: "";
	position: absolute;
	top: 15px;
	width: 1px;
	background: #999398;
	animation: pathmove 1.4s ease-in-out infinite;
	opacity: 0;
}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove{
  0%{
    top:10px;
    opacity: 0;
  }
  30%{
    height:30px;
    opacity: 1;
  }
  100%{
    height:0;
    top:50px;
    opacity: 0;
  }
}
/*-- サービスエリア --*/
#DivService {
	margin-top: 20%;
	margin-left: 5%;
	min-height: 88%;
}
/* タイトル */
.sub-title {
	color: #c7c7c7;
	font-size: 3.5vw;
}
/* 内容 */
.sub-category {
	/*margin-left: 2vw;*/
	margin-top:2vw;
}
/* サブ内容 */
.sub-contents {
	margin-top: 1vw;
}
/*　サブリンク　*/
.sub-title {
	color: #c7c7c7;
}
.service-title {
	color: #c7c7c7;
	position: relative;
	display: inline-block;
	padding-left: 4vw;
	font-size:3.5vw;
}
.service-title::before{
	content: '';
	position: absolute;
	left:0;
	top: 55%;
	display: inline-block;
	width: 3.5vw;
	height: 1px;
	background-color: #999398;
	-webkit-transform: rotate(-60deg);
	transform: rotate(-60deg);
}
.service-title a img{
	width:3vw;
	height:auto;
	margin-left:1vw;
}
/*---------------------------------------*/
/*               スマホ　     　　       */
/*---------------------------------------*/
@media screen and (min-width:360px) {
}
/*---------------------------------------*/

/*               PC　     　　       */

/*---------------------------------------*/
@media screen and (min-width: 960px) {

	
	.page-title {
		margin-bottom: 0;
	}
	.scrolldown a{
		bottom:unset;
		left:-32px;
		font-size:1vw;
	}

	/*-- アバウトエリア --*/
	#DivMainContent {
		width: 100%;
		min-height: 100%;
		display: grid;
		grid-template-rows: 5% 75% 20%;
	}
	.contents.center {
		font-size: 1vw;
	}
	.contents.left {
		margin-top: 1vw;
	}
	.category {
		text-align: center;
		margin: 2vw 4vw;
	}


	/*-- サービスエリア --*/
	#DivService {
		margin-top: 5vw;
		margin-left:unset;
		height: 120%;
	}
	.service-title{
		padding-left:2vw;
	}
	.service-title::before {
		width: 1.5vw;
		top:55%;
	}
	.service-title a img {
		width: 1vw;
	}
	.sub-title{
		font-size:1.2vw;
	}
	.sub-category {
		margin-left: unset;
		margin-top: 2vw;
	}
	.service-title {
		font-size: 1.2vw;
	}
	.link {
		font-size: 1vw;
		transition: 0.5s;
	}
	.link:hover {
		color: #f8f8f8;
	}
}