@charset "UTF-8";

/*★・・・・・・★・・・・・・★・・・・・・★・・・・・・★
　　タブレット
★・・・・・・★・・・・・・★・・・・・・★・・・・・・★*/ 
@media screen and (min-width: 600px) and (max-width: 959px) {
#mainImage img{
	display: block;
	margin: 0 auto;
	width: 100%;
	height: auto;
	padding: 0;
}
/*---------- link.html ---------------*/
ul.link {
	width: 90%;
	margin: 1rem auto 3rem auto;
}
/*----------- labo.html ----------------*/
.illust p {
	margin: 3rem auto 0 2%;
	font-size: 1.2rem;
}		
.illust img {
	width: 68rem;
	margin: 3rem auto 0;
}
#image {
	width: 100%;
	margin: 1rem auto;
}	
/*----------- staff.html ----------------*/
dl.staff { 
	width: 100%;
}
/*---------- hemocatharsis.html, endocrine.html, kidney.html ------*/
.year {
	width: 90%;
	display: block;
	margin: 0 auto;
}
.year li {
	display: inline;
	margin-right: 2rem;
	font-size: 1.8rem;
}
/*--------- class.html ----------*/
.illust { /*class.html, labo.html 共通*/
	margin-top: 2rem;
	margin: 0 auto;
	width: 90%;
}
.illust img {
	width: 90%;
	margin: 3rem auto 0;
}
.photo-class {
	width: 90%;
	margin: 0 auto;
}
.photo-class p{
	display: inline-block;
	width: 48%;
	height: 22rem;
	overflow: hidden;
	margin-right: 1rem;
}
/*-------- greeting.html ----------*/
#profile img {
	width: 18rem;
 	margin: 0 0 1rem 10%;
 }
p#name {
	width: 54%;
	margin: 8rem 4rem 0  0;
}
#profile p.clearfix {
	width: 80%;
 }
}  
/* ・・・・・・タブレットここまで・・・・・・*/


/*★・・・・・・★・・・・・・★・・・・・・★・・・・・・★
　　スマホ
★・・・・・・★・・・・・・★・・・・・・★・・・・・・★*/ 
@media screen and (max-width: 599px) {
	
/*--------- メイン画像 home以外のページ----------*/
#mainImage img {
	display: block;
	margin: 7rem auto 0;
	width: 100%;
	height: auto;
	padding: 0;
}
/*-------- class.html ----------*/
.illust img {
	width: 100%;
	margin: 3rem auto 0;
}
.illust img#graph{
	box-shadow:3px 2px 6px 0px #f7f7f7;
}
/*-------- greeting.html ----------*/
#profile img {
	width: 10rem;
	height: 12.1rem;
	display: inline;
 	float: left;
 	margin: 0 1rem 1rem 1rem;
 }
p#name {
	width:  40%;
	height: auto;
	display: inline;
	float: none;
	margin: 1rem auto;
}
#profile p.clearfix {
	width: 90%;
	height: auto;
	display: block;
 	clear: both;
 	margin: 0 auto;
 }
/*----------- labo.html ----------------*/
#image { 
	display: block;
	width: 70%;
	height: auto;
	float: none;
	margin: 1rem auto;
	background-color: #fff;
}
button#kidney,button#hemocatharsis,button#endocrine {
	display: block;
	width: 100%;
	height: auto;
	margin: 0.6rem auto;
	padding: 0;
}
#image button#kidney { 
	margin-left: auto;
}	
#image button a{
  padding: 1rem 0;
  width: 100%;  
  height: auto;
  margin-left: 0;
}
/*------------------------ staff.html ------------------------------*/
dl.staff { 
	width: 100%;
	padding-bottom: 2rem;
}
.staff dd.introduction {
	width: 90%;
}
/* ・・・・・・  スマホここまで  ・・・・・・*/