@charset "UTF-8";


body {
	margin-left: auto;
	margin-right: auto;
	width: 92%;
	max-width: 960px;
	padding-left: 2.275%;
	padding-right: 2.275%;
	background: white;

}


#title{
	font-family: Arial;
	font-weight: bold;
	font-size: 105px;
	line-height: 105px;
	text-align: left;
	color: #f00;
	position:fixed;
	top:0px;
	left:10px;
	margin: 0;
	z-index: 2;
	}

#works{
	font-family: Arial;
	font-weight: bold;
	font-size: 50px;
	line-height: 50px;
	text-align: left;
	color: #f00;
	position:fixed;
	top:222px;
	left:15px;
	margin: 0;
	z-index: 2;
	}

#bio{
	font-family: Arial;
	font-weight: bold;
	font-size: 50px;
	line-height: 50px;
	text-align: left;
	color: #f00;
	position:fixed;
	top:222px;
	left:190px;
	margin: 0;
	z-index: 2;
	}

#contact{
	font-family: Arial;
	font-weight: bold;
	font-size: 50px;
	line-height: 50px;
	text-align: left;
	color: #f00;
	position:fixed;
	top:222px;
	left:295px;
	margin: 0;
	z-index: 2;
	}


a {
	color:#F00;
	text-decoration:none;
}

ul {
	list-style-type: none;
 	background-color: none; 
}

/*
.context{   BIOのページ 
	font-family: Arial;
	font-weight: bold;
	font-size: 40px;
	line-height: 45px;
	text-align: left;
	/*width: 1529px;
	height: 788px;
	background: transparent;
	position:absolute;
	top:250px;
	left:15px;
	margin: 0;
	}*/

	.context1{  /* BIOのページ */
	font-family: Arial;
	font-weight: bold;
	font-size: 40px;
	line-height: 45px;
	text-align: left;
	background: transparent;
	position:absolute;
	top:360px;
	left:15px;
	margin: 0;
	}
	.context2{  /* BIOのページ */
	font-family: Arial;
	font-weight: bold;
	font-size: 40px;
	line-height: 40px;
	text-align: left;
	background: transparent;
	position:absolute;
	top:444px;
	left:15px;
	margin: 0;
	}
	.context3{  /* BIOのページ */
	font-family: Arial;
	font-weight: bold;
	font-size: 32px;
	line-height: 32px;
	text-align: left;
	background: transparent;
	position:absolute;
	top:488px;
	left:15px;
	margin: 0;
	}
	.context4{  /* BIOのページ */
	font-family: Arial;
	font-weight: bold;
	font-size: 40px;
	line-height:45px;
	text-align: left;
	background: transparent;
	position:absolute;
	top:609px;
	left:15px;
	margin: 0;
	}
	.context5{  /* BIOのページ */
	font-family: Arial;
	font-weight: bold;
	font-size: 32px;
	line-height:32px;
	text-align: left;
	background: transparent;
	position:absolute;
	top:653px;
	left:15px;
	margin: 0;
	}
	.context6{  /* BIOのページ */
	font-family: Arial;
	font-weight: bold;
	font-size: 45px;
	line-height:40px;
	text-align: left;
	background: transparent;
	position:absolute;
	top:782px;
	left:15px;
	margin: 0;
	
}
	.context7{  /* BIOのページ */
	font-family: Arial;
	font-weight: bold;
	font-size: 32px;
	line-height:32px;
	text-align: left;
	background: transparent;
	position:absolute;
	top:826px;
	left:15px;
	margin: 0;
	padding-bottom: 125px; /*下の余白*/
}


#FaceBook{
	font-family: Arial;
	font-weight: bold;
	font-size: 45px;
	line-height: 45px;
	text-align: left;
	color: #f00;
	position:fixed;
	top:780px;
	left:426px;
	margin: 0;
	}

#slash{
	font-family: Arial;
	font-weight: bold;
	font-size: 45px;
	line-height: 45px;
	text-align: left;
	color: #f00;
	position:fixed;
	top:735px;
	left:735px;
	margin: 0;
	}

#Instagram{
	font-family: Arial;
	font-weight: bold;
	font-size: 45px;
	line-height: 45px;
	text-align: left;
	color: #f00;
	position:fixed;
	top:780px;
	left:852px;
	margin: 0;
	}

#credit{
	font-family: Arial;
	font-size: 11px;
	line-height: 11px;
	position:fixed;
	top:795px;
	left:1205px;
	margin: 0;
	}



/* Media query for Mobile devices*/
@media only screen and (min-width : 285px) and (max-width : 480px) {
	
	.header,.main,.footer,img {
		width: 100%;
		}body{margin: 0;}
	
	
	#title{
		font-family: Arial;
		font-weight: bold;
		font-size: 75px;
		line-height: 75px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:5px;
		left:5px;
		margin: 0;
		z-index: 2;
		}
	#works{
		font-family: Arial;
		font-weight: bold;
		font-size: 40px;
		line-height: 40px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:150px;
		left:5px;
		margin: 0;
		z-index: 2;		
		}
	#bio{
		font-family: Arial;
		font-weight: bold;
		font-size: 40px;
		line-height: 40px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:150px;
		left:136px;
		margin: 0;
		z-index: 2;
		}
	#contact{
		font-family: Arial;
		font-weight: bold;
		font-size: 40px;
		line-height: 40px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:222px;
		left:295px;
		margin: 0;
		z-index: 2;
		}


	a {
		color:#F00;
		text-decoration:none;
		}
	ul {
		list-style-type: none;
		background-color: none; 
		}
	


	#FaceBook{
		font-family: Arial;
		font-weight: bold;
		font-size: 30px;
		line-height: 30px;
		text-align: left;
		color: #f00;
		position:fixed;
		top: 90%;
		left:4.26%;
		margin: 0;
		}
	#slash{
		font-family: Arial;
		font-weight: bold;
		font-size: 30px;
		line-height: 30px;
		text-align: left;
		color: #f00;
		position:fixed;
		top: 85%;
		left: 48.72%;
		margin: 0;
		
}
	#Instagram{
		font-family: Arial;
		font-weight: bold;
		font-size: 30px;
		line-height: 30px;
		text-align: left;
		color: #f00;
		position:fixed;
		top: 90%;
		left:57.87%;
		margin: 0;
		}
	#credit{
		font-family: Arial;
		font-size: 6px;
		line-height: 6px;
		position:fixed;
		color: #f00;
		top: 95%;
		left: 63%;
		margin: 0;
		}	
	
	
	.context1{  /* BIOのページ */
	font-family: Arial;
	font-weight: bold;
	font-size: 25px;
	line-height: 25px;
	text-align: left;
	background: transparent;
	position:absolute;
	top:230px;
	left:3px;
	margin: 0;
	}
	.context2{  /* BIOのページ */
	font-family: Arial;
	font-weight: bold;
	font-size: 25px;
	line-height: 25px;
	text-align: left;
	background: transparent;
	position:absolute;
	top:283px;
	left:3px;
	margin: 0;
	}
	.context3{  /* BIOのページ */
	font-family: Arial;
	font-weight: bold;
	font-size: 15px;
	line-height: 15px;
	text-align: left;
	background: transparent;
	position:absolute;
	top:315px;
	left:3px;
	margin: 0;
	}
	.context4{  /* BIOのページ */
	font-family: Arial;
	font-weight: bold;
	font-size: 25px;
	line-height:25px;
	text-align: left;
	background: transparent;
	position:absolute;
	top:411px;
	left:3px;
	margin: 0;
	}
	.context5{  /* BIOのページ */
	font-family: Arial;
	font-weight: bold;
	font-size: 15px;
	line-height:15px;
	text-align: left;
	background: transparent;
	position:absolute;
	top:443px;
	left:3px;
	margin: 0;
	}
	.context6{  /* BIOのページ */
	font-family: Arial;
	font-weight: bold;
	font-size: 25px;
	line-height:25px;
	text-align: left;
	background: transparent;
	position:absolute;
	top:503px;
	left:3px;
	margin: 0;
	}
	.context7{  /* BIOのページ */
	font-family: Arial;
	font-weight: bold;
	font-size: 15px;
	line-height:15px;
	text-align: left;
	background: transparent;
	position:absolute;
	top:535px;
	left:3px;
	margin: 0;
	padding-bottom: 125px; /*下の余白*/
	

}
	
	
}



/* Media Query for Tablets */
@media only screen and (min-width : 481px) and (max-width : 1279px) {
	
	.header,.main,.footer,img {
		width: 100%;
		}body{margin: 0;}
	
	#title{
		font-family: Arial;
		font-weight: bold;
		font-size: 105px;
		line-height: 105px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:0px;
		left:10px;
		margin: 0;
		z-index: 2;
		}

	#works{
		font-family: Arial;
		font-weight: bold;
		font-size: 50px;
		line-height: 50px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:222px;
		left:15px;
		margin: 0;
		z-index: 2;
		}

	#bio{
		font-family: Arial;
		font-weight: bold;
		font-size: 50px;
		line-height: 50px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:222px;
		left:190px;
		margin: 0;
		z-index: 2;
		}

	#contact{
		font-family: Arial;
		font-weight: bold;
		font-size: 50px;
		line-height: 50px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:222px;
		left:295px;
		margin: 0;
		z-index: 2;
		}


	a {
		color:#F00;
		text-decoration:none;
		}

	ul {
		list-style-type: none;
		background-color: none; 
		}
	


	#FaceBook{
		font-family: Arial;
		font-weight: bold;
		font-size: 45px;
		line-height: 45px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:90%;
		left:12.5%;
		margin: 0;
		}

	#slash{
		font-family: Arial;
		font-weight: bold;
		font-size: 45px;
		line-height: 45px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:85%;
		left:50.91%;
		margin: 0;
		
}


	#Instagram{
		font-family: Arial;
		font-weight: bold;
		font-size: 45px;
		line-height: 45px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:90%;
		left:63.67%;
		margin: 0;
		}

	#credit{
		font-family: Arial;
		font-size: 11px;
		line-height: 11px;
		position:fixed;
		color: #f00;
		top:95%;
		left:60.02%;
		margin: 0;
		
}
		
	.context1, .context2, .context3, .context4, .context5, .context6, .context7{z-index: 5;}

}


/* Desktops and laptops  */
@media only screen and (min-width:1280px) {
	
	.header,.main,.footer,img {
		width: 100%;
		}body{margin: 0;}
	
	#title{
		font-family: Arial;
		font-weight: bold;
		font-size: 105px;
		line-height: 105px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:0px;
		left:10px;
		margin: 0;
		
		}

	#works{
		font-family: Arial;
		font-weight: bold;
		font-size: 50px;
		line-height: 50px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:222px;
		left:15px;
		margin: 0;
		
		}

	#bio{
		font-family: Arial;
		font-weight: bold;
		font-size: 50px;
		line-height: 50px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:222px;
		left:190px;
		margin: 0;
		}

	#contact{
		font-family: Arial;
		font-weight: bold;
		font-size: 50px;
		line-height: 50px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:222px;
		left:295px;
		margin: 0;
		}


	a {
		color:#F00;
		text-decoration:none;
	}

	ul {
		list-style-type: none;
		background-color: none; 
	}
	


	#FaceBook{
		font-family: Arial;
		font-weight: bold;
		font-size: 45px;
		line-height: 45px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:89%;
		left:26.25%;
		margin: 0;
		}

	#slash{
		font-family: Arial;
		font-weight: bold;
		font-size: 45px;
		line-height: 45px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:83.5%;
		left:49.21%;
		margin: 0;
		}


	#Instagram{
		font-family: Arial;
		font-weight: bold;
		font-size: 45px;
		line-height: 45px;
		text-align: left;
		color: #f00;
		position:fixed;
		top:89%;
		left:56.95%;
		margin: 0;
		}

	#credit{
		font-family: Arial;
		font-size: 11px;
		line-height: 11px;
		position:fixed;
		color: #f00;
		top:95%;
		left:55.85%;
		margin: 0;
		}
	
	
	.context1, .context2, .context3, .context4, .context5, .context6, .context7{z-index: 5;}
}