/* CSS Document */

@charset "utf-8";

/*■初期設定*/

body{
	color:#333333;/*通常のテキストカラー*/
	}
a{
	/*color:#FF7933;/*通常のリンクテキストカラー*/
	color:#006499; /*#000080*//*通常のリンクテキストカラー*/
	}
a:hover{
	color:#FF7933;/*マウスが乗った時の通常のリンクテキストカラー*/
	text-decoration:underline;/*マウスが乗った時下線を表示（つけない場合は underline を none へ）*/
	}
html{  
	overflow-y:scroll;  
} 

	/* ウィンドウ幅が0-640pxの場合 */
	@media screen and (max-width:640px){
		body{width: autopx;}
	}

/*■初期設定ここまで*/

*{ margin:0; padding:0;}
img{ border:0;}

table, div {
  margin:auto;
}

table { border-collapse:collapse; border: 1px solid #333333; line-height: 1.5;}
th { border: 1px solid #333333; width: 360px; padding: 10px; font-weight: bold; vertical-align: top; text-align: center;}
td { border: 1px solid #333333; width: 360px; padding: 10px; vertical-align: top; text-align: center;}

/*■フォントサイズ調整*/
body {
    font-size: 12px; /* モダンブラウザ */
    *font-size: small; /* IE 7 */
    *font: x-small; /* IE 6以下 */
	/*font-family:'Yu Gothic';*/
	font-family:'BIZ UDGothic';
	/*font-family:'Yu Gothic', YuGothic, sans-serif;*/
	/*font-family:'Meiryo', Meiryo, Meiryo;*/
  	/*font-family: 'Noto Sans JP', Noto Sans JP, Noto Sans JP;*/
	text-align:center;
}
p {font-size:12px; line-height:2.0em; margin:0px 0px 8px 0px; padding: 0 0 0px 0;}
th,td,li{font-size:12px; line-height:2.0em; margin:0px 0px 0px 0px;}

ul{list-style:none;}

h1{font-size:16pt; color: #0086CC; line-height:1.0em; margin: 2px 0px 2px 0px; padding: 2px 0 2px 0;}
h2{font-size:24pt; color: #0086CC; line-height:1.0em; margin: 2px 0px 2px 0px; padding: 2px 0 2px 0;}
h3{font-size:20pt; color: #0086CC; line-height:2.0em; margin:16px 0px 0px 0px; padding: 16px 0 16px 0;}
h4{font-size:16pt; color: #0086CC; line-height:2.0em; margin:16px 0px 0px 0px; padding: 16px 0 4px 0;}
h5{font-size:12pt; color: #0086CC; line-height:2.0em; margin: 8px 0px 0px 0px; padding: 4px 0 4px 0;}
h6{font-size:10pt; color: #0086CC; line-height:2.0em; margin: 8px 0px 0px 0px; padding: 4px 0 4px 0;}

/* ウィンドウ幅が0-640pxの場合 */
@media screen and (max-width:479px){
	body{ font-size: 12px; }
	p,th,td,li{ font-size: 10px;}
	
	h3{font-size:16pt}
	h4{font-size:14pt}
	h5{font-size:12pt}
	h6{font-size:10pt}
}


/*■基本レイアウト*/

/*共通*/
#container{
	width:960px;
	margin:auto;
	text-align:left;
}

.gallery{
	border: 1px solid white;
	margin: 8px 8px 8px 8px;
	text-align: left;
	width: 100%;
	position: relative;
	/*height: 180px;*/
	/* overflow: hidden; */
	cursor: pointer;
}
.gallery img{
	width: 160px;
	height: 90px;
	margin: 8px 8px 8px 8px;
	object-fit: cover;
	transition-duration: 0.5s;
}
.gallery img:hover{
	/* position: absolute;
	left: 200px;*/

	transform: scale(1.6); /*transform: scale(2.4);*/
	transition-duration: 0.5s;
}

.img1{
	object-fit: cover;
	width: 320px;
	height: 180px;
	margin: 8px 8px 8px 8px;
}
.img2{/*Photoの写真*/
	width: 80px;
}
.img3{ /*3分割 トップページのナノスクライブ用、研究紹介の扉写真*/
	width: 304px;/*640:400=480:300=400:250=320:200=304:190 */
}
.img4{/*分割なし*/
	width:900px
	/*width: 472px;*//*2分割*/
}
.clear{
	clear:both;
}
iframe{/*マップ*/
	width:960px;
	height:480px;
}

/* ウィンドウ幅が0-479pxの場合 */
@media screen and (max-width:640px){
	#container{width:320px;}
	.img3 {width: 200px;}
	.img4 {width: 200px;}
	iframe{width: 320px; height: 320px;}
}

div.imagebox {
	/* border: 1px dashed #0000cc;	/* 枠線 */
	/* background-color: #eeeeff;	/* 背景色 */
	width: 320px;			/* 横幅 */
	float: left;			/* 配置：左 */
	margin: 0px;			/* 周囲の余白 */
}
p.image	{
	text-align: left;		/* 3.中央寄せ */
	margin: 0px;			/* 4.余白・間隔 */
	padding: 0px 0 0 0;
}
p.caption	{
	text-align: left;		/* 3.中央寄せ */
	margin: 0px;			/* 4.余白・間隔 */
	padding: 0;
}
p.clear	{
	clear: both;
}
/* ウィンドウ幅が0-640pxの場合 */
@media screen and (max-width:640px){
	div.imagebox{ width: 320px; margin:0px 0px 0px 0px;}
}


hr	{margin: 0 0 8px 0;
	}

hr.hr1{
	height: 2px;
	text-align: left;
	background-color: #0086CC; /*#000080*/
	border: none; color:#0086CC; /*#000080*/
	animation: nobi 2s ease .1s alternate none running;
}
@keyframes nobi{
	0%{width:0px; animation-timing-fuction:ease-out;}
	100%{width:100%; animation-timing-fuction:ease-out;}
}

hr.hr2	{
	height: 1px;
	background-color: #999999;
	border: none; color:#999999;
}

.highlight{
	font-weight: bold;
	color: #0086CC; /*#000080*/
	background-color:#FFE066;
}

/*ヘッド*/
#head{}
#head_top{
	background-size: 72px,72px;
	background-position:right;
	color: #0086CC; /*#000080*/
	font-size: 48px;
	margin:16px 0 0px 0px;
	background-image:none;
	width:960px;
	height:72px;
}

#head_menu{
	width:960px;
	height:32px;
        /*background-color:#000080;*/
}
#head_menu ul{
}
#head_menu ul li{
	background-color:#0086CC; /*#000080*/;
	letter-spacing:1px;
	float:left;
	width:135px;	/* 960/8-2 = 118,  960/7 = 135*/
	height:30px;
	position:relative;
	border-style: solid;
	border-width: 1px;
	border-color: white;
}
#head_menu ul li a{
	color:#ffffff;
	text-decoration:none;
	display:block;
	width:135px;
	height:30px;
	line-height:32px;
	text-align:center;
}

#head_menu ul li a:hover{
	color:#FFFFFF;
	background-color:#FF7933;/*マウスが乗った時の通常のリンクテキストカラー*/
}
/* ウィンドウ幅が0-640pxの場合 */
@media screen and (max-width:640px){
	#head_top{width: 320px; height: 36px; background-image:none;}
	#head_top h1{color: #0086CC; font-size: 12px; background-image:none;}
	#head_top h2{color: #0086CC; font-size: 20px; background-image:none;}
	#head_menu{ font-size:12px; width:320px; height:36px;margin:16px 0 0 0;}
	#head_menu ul li, #head_menu ul li a{font-size:12px; width:158px; height:36px; float:center; text-align:center; line-height:3; }
}

/*メイン*/
#contents{
	margin:10px 0 0 0;
	clear:left;
}
#contents:after{
	content: "";
	clear: both;
	height: 0;
	display: block;
	visibility: hidden;
}

#foot_up{
	background-color:#0086CC; /*#000080*/;
	clear:both;
	height:15px;
	margin:10px 0 0 0;
}
#copy{
	height:20px;
	text-align:right;
	color:#333333;
	padding:2px;
	margin:4px 0 0 0;
}


/***トップ***/
#top{}
#top_btm{}
#top_btm:after{
	content: "";
	clear:both;
	height:0;
	display:block;
	visibility:hidden;
}

#top div#center{
        float:left;
        width:960px;
}
/* ウィンドウ幅が0-640pxの場合 */
@media screen and (max-width:640px){
	#top,
	#top div#center{ width:320px;}
}
#top div#center h3{
	/*margin:20px 0px 0px 0px*/
	line-height:200%;
	font-weight: bold;
	text-indent:0px;
}
#top div#center p{
	/*margin:10px 0px 10px 0px;*/
	line-height:120%;
}

/* top_video */
#top div#top_video{
	background-color: whitesmoke;
}
#top div#top_video ul{
	margin:0px 0px 0px 0px;
}
#top div#top_video ul li{
	margin:0px 0px 0px 0px; padding: 0px;
}
#top div#top_video ul.tabs a{
	text-decoration:none;
}

#top div#top_video video{
	width: 720px;
}
/* ウィンドウ幅が0-640pxの場合 */
@media screen and (max-width:640px){
	#top div#top_video,
	#top div#top_video video{ margin:5px 5px 5px 5px; width: 300px;}
}

/***その他のページ***/
/**** OtherPage共通 ****/
/**** タイプA ****/
#other_page div.typeA{
}
/* ウィンドウ幅が0-640pxの場合 */
@media screen and (max-width:640px){
	#other_page div.typeA
	{width:320px;margin:0px;float:left;}
}
#other_page div.typeA p{
}
#other_page div.typeA ul{
	list-style-type: disc;
	margin-left: 24px;
	text-align: left;
}


/* copyrights */
#copyright{
	float: right;
}
#copyright a{
    display: inline;
    text-decoration: none;
}
#copyright_box{
	width: 28px;
	height: 11px;
}
#copyright p a{
	background: url(http://pondt.com/img/logo.gif) bottom no-repeat;
	width: 28px;
	float: left;
	text-indent: -9999px;
}
*:first-child+html #copyright_box{
	float:right;
}

/*■トップに戻るボタン*/
#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 77%;
}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 100px;
    padding: 30px 0;
    text-align: center;
    display: block;
    border-radius: 5px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}