@charset "utf-8";

/* ---------------------------------------------------------- */
/*    index.html   */
/* ---------------------------------------------------------- */


/*　.mainblock
-----------------------------------*/
#contents .mainblock {
	float:left;
	height: 509px;
	position:relative;
	width: 450px;
	overflow: hidden;
}
#contents .mainblock .maintext {
	background: url(../img_index/bg_index.png) repeat;
	bottom:0;
	padding: 14px 10px;
	position:absolute;
	width: 430px;
}
#contents .mainblock div.name {
	/* font-weight:bold; */
	font-size: 120%;
	padding: 0 0 18px 0;
}
#contents .mainblock div.name_en{
	font-weight:bold;
	font-size: 140%;
}

#contents .mainblock div.affiliation {
	background: url(../img_index/line.gif) repeat-x bottom;
	font-size:100%;
	line-height: 1.2em;
	padding: 0 0 8px 0;
	margin: 0 0 8px 0;
}
#contents .mainblock div.other {
	font-size:95%;
	line-height: 1.3em;
}
#contents .mainblock div.name span {
	font-size: 55%;
}
#contents .mainblock .maintext.en div.other {
	font-size:95%;
}


/*　.block
-----------------------------------*/
#contents ul.block {
	float:right;
	width: 520px;
}
#contents ul.block li {
	background: #FFF;
	height: 220px;
	margin-bottom: 10px;
	width: 255px;
}
#contents ul.block li.career {
	float:left;
}
#contents ul.block li.research {
	float:right;
}
#contents ul.block li.work {
	float:left;
}
#contents ul.block li.video {
	float:right;
}
#contents ul.block li a:hover img {
     filter: alpha(opacity=80);
    -moz-opacity:0.8;
    opacity:0.8;
}


/*　.other
-----------------------------------*/
#contents ul.other {
	background: url(../img_index/bg_index_other.png) no-repeat top left;
	float:right;
	height: 20px;
	padding: 15px 0 14px 20px;
	width: 500px;
}
#contents ul.other li {
	float:left;
	margin-right: 30px;
}
#contents ul.other li a:hover img {
     filter: alpha(opacity=70);
    -moz-opacity:0.7;
    opacity:0.7;
}
/* ---------------------------------------------------------- */
/*     PC調整   */
/* ---------------------------------------------------------- */
@media screen and (min-width: 769px) {
	#contents ul.block .software,
	#contents ul.block .press {
		display: none;
	}
}
/* ---------------------------------------------------------- */
/*     TB,SP共通   */
/* ---------------------------------------------------------- */
@media screen and (max-width: 768px) {
	img {
		max-width: 100%;
	}
	#contents .mainblock {
		float: none;
		width: 100%;
		height: auto;
	}
	#contents .mainblock > img {
		width: 100%;
		height: auto;
	}
	#contents .mainblock .maintext {
		width: calc(100% - 20px);
		padding: 15px 20px;
	}
	#contents ul.block {
		float: none;
		width: calc( 100% - 8px );
		display: flex;
		flex-wrap: wrap;
		margin: 4px;
	}
	#contents ul.block li {
		width: 50%;
		height: 42vw;
		margin-bottom: 0;
	}
	#contents ul.block li a {
		display: block;
		margin: 0 4px;
	}

	#contents ul.other {
		float: none;
		width: 100%;
		padding: 0 ;
	}
	#contents ul.other li {
		padding: 0 10px;
	}
	#contents ul.other li:not(:last-child) {
		display: none;
	}
}
/* ---------------------------------------------------------- */
/*     TBのみ   */
/* ---------------------------------------------------------- */
@media only screen and (min-width: 481px) and (max-width: 768px) {
	#contents ul.block li {
		width: 33.33333%;
		height: 28vw;
	}

}