@charset "utf-8";
/*------------------------------------------------------------
	トープページ
------------------------------------------------------------*/
body{background: url(../img/common/bg05.jpg) repeat left top;}

#main{
	padding: 100px 20px 90px;
	margin: 0 auto;
	max-width: 1270px;
	position: relative;
}

#main h1{
	margin-bottom: 60px;
	font-size: 45px;
	color: #fff;
	letter-spacing: 10px;
}

#main .text p{
	margin-bottom: 25px;
	max-width: 880px;
	font-size: 19px;
	color: #fff;
	text-indent: 1.8em;
	line-height: 1.9;
	letter-spacing: 1.5px;
	position: relative;
}



@media all and (min-width: 0px) and (max-width: 767px){
	#main{padding: 42px 20px;}

	#main h1{
		margin: 0 0 35px 5px;
		font-size: 12px;
		letter-spacing: 1px;
	}

	#main .text p{
		margin-bottom: 20px;
		font-size: 9px;
		text-indent: 1.5em;
	}

	#main .photo{margin: 57px 12px 20px;}
	#main .photo img{
		width:100%;
		height:auto;
	}
}

@media all and (min-width: 768px) and (max-width: 1024px){
	#main .photo{margin-top: -50px;}
}


@media all and (min-width: 768px){
	#main .photo{
		margin: -160px auto 0;
		width:1343px;
		height:1520px;
		background:url(../img/ability/photo_bg.png) no-repeat 0 0;
	}
	#main .photo .pc{position:relative;}
	#main .photo .pc p{
		position:absolute;
		top:0;
		left:0;
	}
	#main .photo .pc p.photo_proposal{
		width:160px;
		height:159px;
		top:220px;
		left:731px;
	}
	#main .photo .pc p.photo_research{
		width:171px;
		height:170px;
		top:434px;
		left:437px;
	}
	#main .photo .pc p.photo_analysis{
		width:156px;
		height:157px;
		top:505px;
		left:1135px;
	}
	#main .photo .pc p.photo_co_creation{
		width:156px;
		height:156px;
		top:577px;
		left:15px;
	}
	#main .photo .pc p.photo_lead{
		width:156px;
		height:156px;
		top:1001px;
		left:17px;
	}
	#main .photo .pc p.photo_action{
		width:156px;
		height:156px;
		top:1146px;
		left:445px;
	}
	#main .photo .pc p.photo_creation{
		width:156px;
		height:156px;
		top:950px;
		left:883px;
	}
	#main .photo .pc p{
		display:block;
		-webkit-transition:1.5s all linear;
		-moz-transition:1.5s all linear;
		transition:1.5s all linear;
		-webkit-transform:rotateZ(0deg);
		-moz-transform:rotateZ(0deg);
		transform:rotateZ(0deg);
		margin:0;
		padding:0;
	}
	#main .photo .pc p:hover{
		-webkit-transform:rotateZ(360deg);
		-moz-transform:rotateZ(360deg);
		transform:rotateZ(360deg);
	}
}