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

/*====================
639以下および全サイズ共通
======================*/
#content .teamkey{
	margin-bottom: 5%;
}
#teamtext{
	margin-bottom:5%;
	padding:0 10px;
	text-align: center;
}

#teamtext h3{
	font-weight: bold;
	margin-bottom: 10px;
	font-size: 1.2em;

}

#purpose{
	width: 90%;
	margin: 0 auto 10%;
	
}


#teamPh{
	width: 90%;
	margin: 0 auto 10%;
}
#teamPh .phcap{
	padding: 10px;
	margin-bottom: 5%;
	text-align: center;
}

#teamPh #team1 .tp{
	width: 40%;
	margin: 0 auto 5px;
}

#teamPh #team2 .tp,
#teamPh #team3 .tp{
	width: 60%;
	margin: 0 auto 5px;
}

#content .link{
	margin-bottom: 50px;
}

#content .link li{
	text-align: right;
	margin-bottom: 10px;
}
#content .link li a{
	color:#b22222;
}

#content .link li a:hover{
	opacity: 0.8;
	text-decoration-line: underline;
}

/*====================
640以上
======================*/
@media screen and (min-width:640px){
#teamtext h3{
	font-size:16px;	
}
	#teamPh{
	padding: 5%;
	}
	#teamPh .phcap{
		font-size:14px;
	}
#teamPh #team1{
	width: 55%;
	float: left;
	margin-bottom: 15px;
}
	#teamPh #team1 .tp{
		width: 75%;
		transform: rotate(-10deg);
		margin-bottom: 20px;
	}
	#teamPh #team2{
	float: right;
	width: 45%;
	}
	#teamPh #team2 .tp{
		width:90%;
		transform: rotate(5deg);
		margin-bottom: 20px;
	}
	
#teamPh #team3{
	width: 50%;
	clear: both;
	}
	
#teamPh #team3 .tp{
		width:90%;
		transform: rotate(5deg);
		margin-bottom: 20px;
	}
	
#content .link{
	margin-bottom: 100px;
}

}

/*====================
960以上
======================*/
@media screen and (min-width:960px){
	#gnav .nav2{
		background: rgba(214,133,255,0.1);
	}

#teamtext h3{
	font-size:18px;
	text-align: center;
	}
#teamtext{
	margin: 5%;
	text-align: left;
	}

#team00{
	position: relative;	
	}		
	
	
#purpose{
	width: 80%;
	margin: 0 auto;
			
	}
	
	#teamPh{
		margin-bottom: 300px;
	}
#teamPh #team1{
	width: 40%;
	float: none;
	position: absolute;
    top: -5%;
    right:2%;
}
#teamPh #team1 .tp{
		width: 70%;
		transform: rotate(-10deg);
		margin-bottom: 10px;
	}

	#teamPh #team2{
	float: none;
	width: 40%;
	position: absolute;
    top: 75%;
    left: 0%;
}
	
	#teamPh #team2 .tp{
		width:65%;
		transform: rotate(5deg);
	}
	
#teamPh #team3{
	width: 20%;
	position: absolute;
    top: 85%;
    right: 5%;
	}
	
#teamPh #team3 .tp{
		width:100%;
		transform: rotate(-5deg);
	}
}