@charset  "utf-8";
* { margin: 0; padding: 0; box-sizing: border-box;}
body { background:#ccc;}
html { font-family: sans-serif; }
ul, ol { list-style: none;}
ul, ol { margin:0; padding:0;}
ul, li { margin:0; padding:0;}
a:link { color: #333; text-decoration: underline;}
h1, h2, h3, h4, h5, h6 { margin:0; padding:0;}
h1 { font-size: 130%; font-weight: bold; line-height: 100%; 
	 margin-top:15px; }
h2 { font-size:120%; position: relative; border-bottom: 3px solid #ccc; 
	font-weight:bold; z-index: 0; }
h2::after { position: absolute; bottom: -3px; left:0; z-index: 2;
	content: '';  width: 20%;  height: 3px; background-color: #cf0027; }
h3{ font-size:120%; margin-bottom:10px;}
h3:after  { content: ""; display: block; height: 2px;
    background: -webkit-linear-gradient(to right, rgb(207, 0, 39), transparent);
    background: linear-gradient(to right, rgb(207, 0, 39), transparent);}

h3:before { content: "■" "\0020"; color: #cf0027; padding-right:5px; /*font-size: 12px;*/	}

h4{ font-size:110%; margin:10px 0 0 0;
	border-bottom: 1px solid #002d40; }	
h4:before {
  content: "\25A0" "\0020";
  color: #002d40;        /* 好きな色に変更可能 */
  font-size: 90%;        /* 必要に応じてサイズ調整 */
}		
h5 { border-left:3px groove #ccc; border-bottom: 1px solid #ccc; 
	padding: 0 0 0 8px; font-weight:bold; margin:20px 10px 10px 0; 
	font-size:110%; color:#616371;} 
h6 {font-size:1em; color: #333; margin-bottom:5px;}
h6:before { content: "■"; color: #333; padding-right:5px;}
#skip-link { position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0, 0, 0, 0); white-space: nowrap;
  border-width: 0;}
#skip-link:focus { position: unset;}	
#wrapper { background:#fff; max-width:1000px; margin:0 auto;
	overflow: hidden; /* heightを戻す */}
/*----　 ヘッダー  ----*/
#header-logo { padding:0 10px 0 5px; height:70px;}	
#header-logo-e { padding:0 10px 0 5px; height:85px;}
#header-aist-e { font-size:90%; position:absolute; top:5px; right:45px; 
	width: calc(100% - 190px); text-align:right; 
	line-height:0.8; } 
#hdr-left2 { display:none; }	
#hdr-left3 { display:block; position:absolute;  
	width:150px; height:45px; top:10px; left:10px; 	
	background-image:url(img/logo-150.png);
	background-repeat:no-repeat;}	
#hdr-center { display:none;}
#hdr-center-e { display:none; }
#hdr-name { display:block; font-size:0.9em; font-weight:bold; 
	position:absolute; top:55px; left:10px;} 
#hdr-name-e { display:block; font-size:0.9em; font-weight:bold; 
	position:absolute; top:55px; left:5px; 
	line-height:0.85; margin-right:120px;} 
#hdr-right { display:block; width:120px;	
		position:absolute; top:45px; right:10px; }			
#hdr-right-e { display:block; width:120px; 
		position:absolute; top:50px; right:10px; } 
#hdr-left-e2 { display:none; }
#hdr-left-e3 { display:block; position:absolute; top:5px; left:10px;  
	width:150px; height:45px;  		
	background-image:url(img/logo-150.png);
	background-repeat:no-repeat;}
#hdr-name-j-e { display:block; padding-left:5px; 
	line-height:0.9; font-size:50%;}
@media screen and (min-width:350px){
#header-logo-e { height:75px;}	
}
@media screen and (min-width:550px){
#header-logo { display:flex; justify-content:space-between; 
	 align-items:center; height:auto; padding:0;}
#header-logo-e { display:flex; justify-content:space-between; 
	 align-items:center; height:auto; padding:0;}
#hdr-left2 { display:block; position:relative; 
	height:60px; width:200px; margin:5px 0 0 10px;
	background-image:url(img/logo-200.png); 
	background-repeat:no-repeat;}
#hdr-left-e2 { display:block; position:relative; 
	background-image:url(img/logo-200.png); margin-left:10px;
	background-repeat:no-repeat; height:60px; width:200px;}
#hdr-left3 { display:none;}
#hdr-left-e3 { display:none;}
#header-aist-e { width: calc(100% - 240px);	line-height:0.9; }
#hdr-name { display:none;}
#hdr-name-e { display:none;}
#hdr-center { display:inline; position:relative; 
	width: calc(100% - 330px); font-weight:bold; 
	text-align:center; font-size:1.24em; }
#hdr-center-e { display:block; position:relative; 
	width: calc(100% - 330px); font-weight:bold; line-height:0.9;
	text-align:center; font-size:1.2em; padding-top:35px;}	
	
#hdr-right { display:block;	position:relative; height:30px;
	width:120px; top:25px; right:10px;}
#hdr-right-e { display:block; position:relative; height:30px;
	width:120px; top:20px; right:10px;}
}
@media screen and (min-width:600px){
#hdr-center {font-size:1.5em; }	
}
@media screen and (min-width:650px){ 
#menu-bk { display:block; background:url(img/bk_black3.png) repeat-x;}
#menu-bk-e { background:url(img/bk_black.png) repeat-x;}
#hdr-left2 { margin-top:10px;}
#hdr-center	{font-size:1.6em; margin-top:10px;}	
#hdr-center-e { font-size:1.24em; line-height:1;
	 margin-top:10px; padding-top:0;}
#header-aist-e { position:relative; width:100%; right:0; top:0;
	 text-align:right; line-height:1; padding:10px 10px 0 0;}
#hdr-right-e { top:0; right:10px;}
}

@media screen and (min-width:750px){
#hdr-center  { max-width:430px; font-size:2.2em; }
#hdr-center-e { max-width:430px; font-size:1.6em; line-height:1.1;}
}
@media screen and (min-width:762px){
#hdr-center	{ margin-top:20px;}	
}
@media screen and (min-width:926px) {
#menu-bk { background:url(img/bk_black.png) repeat-x;}	
}

img { display:  block;  
	max-width:  100%;  /*画像を画面幅に合わせて自動で幅を調節*/  
	height:  auto;/*縦横比を保持したまま調節*/  }
/*=================================================
  main
  =================================================*/
#mainBody{ max-width:1000px; margin:0  auto; 
	padding: 0 10px; }
.cont { padding: 0; margin:0 5px 10px 5px; }
.construction { margin-top:50px; margin-bottom:50px;
	text-align:center; font-size:150%;}
/*========================================================
  Whats  New　説明リスト
  ========================================================*/
#news { height: 600px; width:100%; margin:0 auto; font-size:1em;
	overflow-y: scroll; margin-bottom:20px; padding: 0 10px; }
#news dl{ display: block; margin-bottom:20px;  padding:0;}
#news dt { align-items: center; width:5.5em; padding: 5px 0 5px 5px; }
#news dd { border-bottom: 1px solid #ddd;}
#news .news-fig { width:100px; }
#news .news-fig2 ul{ list-style:none;  }
#news .news-fig2 li{ width:100px; display:inline-block; margin:5px 0 0 0; }

#news .news-cont { width:100%; padding:5px 0 5px 5px;}
#news ul, li{margin:0; padding:0; }
#news ul { border-bottom:none; margin-left:20px; }
#news ul li{ list-style-image: url(img/disc2.png); 
	    padding:5px  0  0  0; }  
#news dt{ font-size:0.9em;}
#news dd:first-of-type{ justify-content:center; font-size:0.9em;}
#news .news-info { padding:10px 0;} 

#news2 { height: 600px; width:100%; margin:0 auto; font-size:1em;
	overflow-y: scroll; margin-bottom:20px; padding: 0 10px; }
#news2 dl{ display: block; margin-bottom:20px;  padding:0;}
#news2 dt { width:5em; padding: 5px 0 5px 5px; border-bottom: 1px solid #ddd;}
#news2 dd { border-bottom: 1px solid #ddd;}
#news2 .cnt-fig dd:nth-of-type(2) { max-width:7em;}
#news2 .cnt-fig dd:nth-of-type(2) li{ list-style:none; }

@media screen and (min-width:480px) {
#news2 dl{ display: flex; flex-wrap: wrap; width:100%;}
#news2 dt { width:6em; font-size:0.9em; }
#news2 .cnt-fig { display: flex; margin-left: 0; padding: 5px 0 5px 5px;  
	width:100%; }
#news2 .cnt-fig dd:nth-of-type(1) { width: calc(100% - 7em); }
#news2 .cnt-fig dd:nth-of-type(2) { width:7em; } 
#news2 .cnt	{ width: calc(100% - 5.5em); }
#news2 ul, li{margin:0; padding:0; }
#news2 ul { border-bottom:none; margin-left:20px; }
#news2 ul li{ list-style-image: url(img/disc2.png); 
	    padding:5px  0  0  0; }  
}

@media screen and (min-width:480px) {
#news dl{ display: flex; flex-wrap: wrap; width:100%;}
#news dd { display: flex; margin-left: 0; padding: 5px 0 5px 5px;  
	width:  calc(100% - 7em); border-bottom: 1px solid #ddd;}
#news .news-cnt { width: calc(100% - 110px);}
#news dt { border-bottom: 1px solid #ddd;}
 
#news .news-fig2 { width:14em; }
#news .news-fig2 ul{ list-style:none; margin:5px 0 5px 0; }
#news .news-fig2 li{ width:100px; display:inline-block; margin:0; padding:0; }
#news .news-cnt2 { width: calc(100% - 14.5em); padding:5px; }
}
/*  更新履歴  */
#update { text-align:right; padding-right:10px; font-size:0.9em; 
	margin-bottom:10px;}
#update #news{ height:100%;} 
.nendo { font-size:110%; color:#333; margin: 10px 0 5px 5px; 
		border-left:4px double #333; padding-left:5px;
		line-height:1.2; font-weight:bold;}
/*--------------------------------------------*/
/*  組織 　*/
/*--------------------------------------------*/
#org { margin:0;}
.orgz { display:flex; flex-flow: row wrap; 
	align-items: flex-start; justify-content: center;
	border:3px solid #eee; margin:10px 0; }
.orgz-cnt { width:225px; padding:10px 5px 0 10px;}
.orgz-box { display:flex; flex-flow: row wrap;
	background:#eee; border-radius:10px; margin:5px 2px;}
/*  組織 　 グループ　　*/	
.orgz-grp_box { width:400px;background:#eee; 
	border-radius:10px; margin:5px 2px;}
.orgz-grp { padding:10px 5px 0 10px;}
.orgz-box2 { display:flex; flex-flow: row wrap;	}	
.orgz-cnt2 { width:225px; padding:10px 5px 0 10px;}
/*.orgz-name { font-size:0.9em;}　*/	
.orgz img { width:110px; margin:0 auto; margin:5px 2px;
	border-radius:20px; } 
/*  組織 　 研究部門付き 連携研究室 連携大学院　　*/	
.orgz dl{ display:flex; flex-wrap: wrap; 
	text-align: left; }
.orgz dt{background: #eee; width: 10em; padding: 10px;
    border-bottom: 1px solid #ddd; border-right: none;	 }
.orgz dd{ padding: 10px 20px 10px 10px; width:calc(100% - 10em);
	border-bottom: 1px solid #ddd;}	
/*  コンソーシアム 　*/	
#org .org-cons { margin:0 0 20px 10px; }

@media screen and (min-width:520px) {
.orgz-box { margin:5px 5px;}
}
@media screen and (min-width:600px) {
.orgz .org-cons { margin:0 20px;} 
}
@media screen and (min-width:900px) {
.orgz-box { margin:5px 10px;}
.orgz-cnt { width:270px;}
.orgz-cnt2 { width:270px;}
.orgz { margin: 10px; }	
}

/*--------------------------------------------*/
/*   　about*/
/*--------------------------------------------*/
#about { margin:20px 10px 20px 10px; }
#about .abt-cnt { margin:0 0 0 10px;} 
#about .abt-fig { width:100px; margin:0 auto; text-align:center;
	padding-top:50px; }
#about p {padding-bottom:10px;}
#about .img-600 {max-width:600px; margin:0 auto; 
	clear:both; padding-top:20px;}
@media screen and (min-width:600px) {
#about .abt-cnt { margin:0 20px;} 
}
/*--------------------------------------------*/
/*   　研究グループ*/
/*--------------------------------------------*/
#grop {margin:20px 0;}
.gr-cont { margin:10px;}
/*--------------------------------------------*/
/*   　　SVART 
/*--------------------------------------------*/
.svart-fig800 { max-width:800px; margin:0 auto; }
.svart-fig640 { max-width:640px; margin:0 auto; }
/*-----   　　SVART メンバー -----*/ 

.memfnt {font-size: 0.9em; }
.memfnt2 {font-size: 0.8em; }
.svart dl{ display: flex; flex-wrap: wrap; border: 1px solid #ddd; border-bottom:none;}
.svart dt, .svart dd  { margin:0; padding:0;}
.svart dt { display: flex; align-items: center; width:4em; font-size: 0.9em; 
  padding: 5px; border-bottom: 1px solid #ddd; border-right: dashed 1px #ddd;}
.svart dd { display: flex; align-items: center; width: calc(100% - 4em);
	  margin:0; padding:0; border-bottom: 1px solid #ddd;}	  
.svart .name { width:8em; padding:5px; border-right: dashed 1px #ddd;} 
.svart .mail { width:9.5em; font-size:0.8em; padding:5px 5px 5px 3px; border-right: dashed 1px #ddd; } 
.svart .s-field { width:12em; padding:5px; border-right: dashed 1px #ddd;}
.svart .i-field { width: calc(100% - 29.5em); padding:5px;}
.svart img {display:inline;} 
.svart-mem { display: flex; flex-wrap: wrap; justify-content:flex-start;
	margin:20px 30px 30px 30px;} /*  Jap. 客員研究員 */ 
.svart-mem-e { margin:20px 40px 30px 40px;}
.sv-mem { padding:5px 20px 5px 0;}
.svart ul{ margin:0; padding:0;}
.svart li{ margin:0 0 5px 0; padding:0; text-indent:-1em; 
	padding-left:1em;/*テキスト頭揃え*/}	
.svart p {font-size:110%; font-weight:bold; padding-left: 5px;
	border-left:3px double #000f15; margin: 0 0 15px 0; } 
@media screen and (max-width:750px) {
.svart .s-field { width:8em;  }
.svart .i-field { width: calc(100% - 25em); }
.svart-cnt{ padding:0 20px; }
}
@media screen and (max-width:650px) {
.svart .s-field { width:6em;  }
.svart .i-field { width: calc(100% - 23em); }	
.svart-cnt{ padding:0 10px; }
.sub-title-mem { margin:30px 10px 10px 0px;}
.svart-mem { margin:20px 10px 20px 10px;}
.svart-mem-e { margin:20px 10px 20px 10px;} 
}
@media screen and (max-width:600px) {
.svart {  margin:0 5px 10px 5px;}
}
@media screen and (max-width:570px) {
.svart .name { width:6em; font-size:0.9em;} 
.svart .s-field { width:7em; font-size:0.9em; }
.svart .i-field { width: calc(100% - 22em); font-size:0.9em;}
.svart-mem { margin:20px 0 20px 0;}
.svart-mem-e{ margin:20px 0 20px 0;} 
}
/*表示画面サイズ520px以下の場合*/
@media screen and (max-width:520px) {
.svart dl{ display: block; width: 100%;}
.svart dt{ border: none; padding:0; }
.svart dd { width: 100%; border-top: 1px solid #ddd;}	  
.svart .s-field { width:9em; }
.svart .i-field { width: calc(100% - 24em); }
.svart ul { margin:0 5px 10px 5px; }
.sub-title-mem { margin:10px 5px 10px 5px;  }
.svart-mem4 {width:100%; margin:0 10px 20px 10px; }
.sv-mem { padding:5px 10px 5px 5px;}
}
/*--------------------------------------------*/
/*   　event*/
/*--------------------------------------------*/
#event { margin:0; padding:0;}
#event dl { margin:0; display:flex; flex-wrap: wrap; width:100%;
	text-align: left; font-size:85%; padding:0 0 20px 0; }
#event dt{background: #eee; width: 6em; padding: 10px;
    border: 1px solid #ccc; 
	border-right: none;	border-bottom: none; }
#event dd{margin: 0; padding: 10px 20px 10px 10px; 
	border: 1px solid #ccc; width:calc(100% - 7em);
	border-bottom: none;}
#event dt:last-of-type {border-bottom:1px solid #ccc;}
#event dd:last-of-type {border-bottom:1px solid #ccc;}
#event ul { margin:10px 15px 30px 10px; border: 1px solid #ccc; }
#event  li { margin:0; list-style:none; padding: 10px 0;
	border-bottom: 1px solid #ccc; }
#event  li:last-child {border-bottom:none;}
.evt-title{ padding:5px; font-size:100%;
	text-align:center; font-weight:bold; text-decoration:underline;}
#event a:link,a:visited { color:#003d55;}
.evt-cont { padding: 10px 0; text-align:center;}
.evt-img {width:100px; margin:0 auto; padding-bottom:20px;}
#event .nendo-evt {font-size:110%; font-weight:bold; color:#003d55;
	border-left:3px double #003d55; padding: 5px 0 5px 25px; }
@media screen and (min-width:520px){
#event ul { margin:20px 15px 20px 10px; }
.evt-title { margin:5px 0; padding:5px 20px; }
}
@media screen and (min-width:640px){
#event {margin:0 10px 10px 10px; padding:0 10px;}
#event dl{ display:flex; flex-wrap: wrap; font-size:100%;}
}
#cc-plat { margin:10px 10px 10px 0; }
#cc-plat .cc-plat-cnt { padding:0 10px 0 35px;}
#cc-plat h3:before { content: "■" "\0020"; color: #cf0027; font-size:1.1em;}
#cc-plat h3 { margin-top:20px;}
#cc-plat h3:after {content:none;}
#cc-plat h6:before { content: "■"; color: #333; padding-right:5px;}
#cc-plat h6 {margin:10px 0 0 20px;}
#facility { margin:10px 10px 10px 0; }
#facility .facility-cnt { padding:0 10px 0 35px;}
#facility h3 { margin-top:20px;}
#facility h3:before { content: "■" "\0020"; color: #cf0027; font-size:1.1em;}
#facility h3:after {content:none;}
#facility h6:before { content: "■"; color: #333; padding-right:5px;}
#facility h6 {margin:10px 0 0 20px;}
/*=================================================
  3画像　横並び
  =================================================*/
#act-exm { display:flex; flex-wrap: wrap; margin:0 10px;
	padding:0 0 20px 0; justify-content: center; }
.act-exm3 {max-width:200px; margin:0; padding:0 10px 10px 10px;}	
@media screen and (min-width:640px) {
.act-exm3 { padding:0 5px 0 5px; }
}
@media screen and (min-width:850px){
.act-exm { margin:0 50px;}
.act-exm3 { padding:0 10px 0 10px; }	
}

/*=================================================
  　youtube
  =================================================*/
#video { max-width:560px; margin:0 auto; padding:0 0 30px 0; 
	text-align: center; }

/*=================================================
  アクセス
  =================================================*/
#access{ margin:20px 10px 0 10px; line-height:1.5; }
.access-rihsa {display:block; width:100%;}
.access-title{ margin:20px 0 10px 0; padding-left:10px;
	font-size:110%; font-weight:bold; 
	border-left:5px double #333; }
.access-cont {margin:5px 0 10px 10px;}
.access-map { width:180px; margin:20px auto 50px; 
	height:40px; line-height:40px; text-align: center; 
	border:2px solid #0027cf; border-radius: 10px;
	font-size:100%;	font-weight:bold; }
.access-map a{ color:#0027cf!important; text-decoration:none;}
.access-map a:hover { text-decoration: underline; }
#access h5 { font-size: 110%; border-bottom:1px solid #333;
	margin:0 20px 10px 0; color:#333; font-weight:bold;
	border-left:none;}
#access h5:before { content: "\2606" "\0020"; }
@media screen and (min-width:480px){
#access{ margin:30px;}
.access-rihsa {display:flex; margin:0; 
	padding-bottom:30px; justify-content: space-between;}
.access-left {width:50%; }
.access-riht {width:50%; margin-left:10px; }				
}
/*=================================================
  inquiry
  =================================================*/
#inquiry { margin:20px 10px 30px 0; line-height:1.5; }
#inquiry h5 {font-size: 110%; margin:20px 20px 5px 0; 
	color:#333; font-weight:bold; border:none; }
#inquiry .cont{ margin:0; padding:10px 0 10px 10px;}
@media screen and (min-width:480px){
#inquiry { margin:20px 20px 50px 20px;}	
}
/*--------------------------------------------*/  
/*      サイトマップ　*/
/*--------------------------------------------*/
#sitemap { margin:0 0 20px 0; }
#sitemap ul { padding-left: 10px;}
#sitemap ul li { list-style-image: url(img/square.png);	
	 padding-top:10px;
	list-style-position: inside; text-indent:-1em;}
#sitemap ul ul { margin-bottom:10px;}
#sitemap ul ul li { list-style-image: url(img/disc2.png);
	text-indent:-1em; padding-left:1em; }
#sitemap p { font-weight:normal;}
#sitemap .stm-title:before { content:"\02022" "\0020" ;} 
#sitemap .stm-title	{padding-left:10px; margin-top:10px;} 

@media screen and (min-width:495px){
#sitemap ul { padding-left: 20px;}
#sitemap ul ul { padding-left:20px;}
#sitemap ul ul li{ padding-left:20px;}				
}
@media screen and (min-width:700px){
#sitemap { padding-left: 20px;}
#sitemap ul { padding-left: 40px;}
#sitemap ul ul { padding-left:40px;}
#sitemap ul ul li{ padding-left:40px;}		
}

/*--------------------------------------------*/  
/*      viewer　*/
/*--------------------------------------------*/
#viewer-back { background: url(img/slide/back01.png);}
.viewer { display:none;} 
@media screen and (min-width:520px){ 
.viewer{ display:block; width:502px; margin:0 auto; }
.viewer ul { margin: 0 auto; width: 500px; height: 140px;
	overflow: hidden;	position: relative; z-index:0;}
.viewer li { width: 500px; height: 140px;	display: none;
	position: absolute; text-align:center; } 
.viewer-back { background: url(img/slide/back01.png);}	
}
.anchor {
  padding-top: 100px;
  margin-top: 100px;
}
/*   拡張テレワークとその展望　*/
.telwk { padding:0 5px 10px  5px; }
.telwk img { border: 1px solid #ddd;}
.telwk-img { max-width:700px; margin:0 auto;} 
.telwk-img2 { max-width:150px; margin:0 auto; }
@media screen and (min-width:520px){
.telwk { padding:0 40px 30px  40px;}
}
/*--------------------------------------------*/  
/* コマツ-産総研
/*--------------------------------------------*/
#kmt { padding:0;}
.cnt-kmt { padding:0 5px 20px 5px;}
#kmt dl{ margin:0; padding:0;}
#kmt dt{ float: left; clear: left; width:15em; padding:5px 0 10px 5px;}
#kmt dd { padding:5px 0 10px 16em; }  
#kmt ul { padding:5px 20px 0 10px;}
#kmt ul li { text-indent:-1em; padding-left:1em;}
#kmt ul li:before {content: "\02022""\0020"; color: #001e2a;}
#kmt h5{ margin:10px 0 5px 0;   font-size:1em; font-weight:bold;
 	border-left: solid #002d40; padding-left: 5px;}
.kmt-ttl { font-size:80%; }
.kmt-fig { width:713px; margin:0 auto;}
@media screen and (min-width:520px){
#kmt { padding:0  30px;}
.cnt-kmt { padding:10px 5px 20px 20px;}
}
@media screen and (min-width:715px){
#kmt dt { width:200px;}
#kmt dd { padding: 5px 0 10px 210px;  }
}

#footer { max-width:1000px;  color:#fff;  margin:0  auto;
	 background:#474747; padding:10px; font-size:12px; }
#footer  .f-lr { display: flex; flex-wrap: wrap; align-items: center; 
	justify-content: center;}	
#footer  .f-left {width:9em; padding-bottom:10px; }
#footer  .f-right { padding:10px 0; }	
#footer  a { color:#fff;}
#f-banr{ display:flex; flex-flow: row wrap; 
	/* align-items: flex-start;  */
	justify-content: space-around; /*space-evenly space-between space-around ;*/ }	
.f-bnr img { padding:5px 0; }
/*--------------------------------------------*/
/*  breadcrumbs  
----------------------------------------------*/
#breadcrumbs  { max-width: 1000px; margin: 0 auto; background:#fff;    
	padding: 5px 0 0 5px; text-align: left;
	background:url(img/bk_red.png) repeat-x; line-height:1.5;
	margin: 5px 0 5px 0;}
#breadcrumbs a { color: #444; text-decoration: none;}
#breadcrumbs a:hover { text-decoration:underline; }
#breadcrumbs ol {margin-top:3px;}
#breadcrumbs li {display: inline; font-size: 85%;}	
#breadcrumbs li:after { content:" \03e";} 
#breadcrumbs li:last-child:after { content:none;} 
.grayLineBox h2 { margin: 0 0 10px 0; font-size:1em; color:#333; 
	background: #f3f3f3;  border-left: #dc2f3d solid 1px;
	text-align:left;} 
.grayLineBox h2:before {display:none;}	
.grayLineBox h2:after {display:none;}
.grayLineBox h3 { margin: 0; padding-bottom:8px; font-size:1em; }
.grayLineBox h3:before {display:none;}
.grayLineBox h3:after { display:none;}
.grayLineBox { margin-bottom:10px;}
.grayLineBox p { line-height:140%; font-size: 90%;}
/*========================================================
  pagetop
  ========================================================*/
.pagetop  {position:fixed; bottom:25px; right:20px;
	color:#666; font-size:  85%;
	text-decoration:none; background:#fff;opacity: 0.9;
	border:1px solid #cf0027; 
border-radius:20%;/*角丸*/ padding:10px;}
.pagetop  a,
.pagetop  a:link,
.pagetop  a:visited  {
    font-size:  85%;
    color:  #666;
    width:  85px;
    height:  48px;
    text-decoration:  none;
}
.pagetop a:hover,
.pagetop a:active { color: #666; text-decoration: none;
	 opacity: 1;}


/* ---------------------------------------- */
/* PAGE内 メニュー */
/* ---------------------------------------- */
#p-menu { padding:0; text-align:center;
	max-width:850px; margin:20px auto; }
.p-menu-radius {border-radius:10px;}
#p-menu ul, li { margin:0; padding:0;}
#p-menu ul { background:#eee; padding:0 20px 10px 20px;}
#p-menu ul li { font-size:0.9em; padding:0 10px;    
   display: inline-block; list-style-type: none; position: relative;    
   color:#616371;; }
#p-menu ul li a { padding-top:10px; text-align: center; text-decoration: none;   
   color:#616371;; display: block; }
#p-menu ul li a:hover { text-decoration:underline; }
@media screen and (max-width:320px) {  
#news dl{ display: block;}
}
@media screen and (max-width:520px){ 
#p-menu { font-size:0.95em;}
#p-menu ul { padding:0 10px 10px 10px;}
#p-menu ul li { padding:0 4px; } 
}
@media screen and (min-width:650px){
#mainBody{padding: 0 20px; }
h1 { font-size: 150%; padding-left: 10px;}
h2 { font-size: 150%; margin:10px 50px 10px 10px; 
	text-align: center; padding:10px 0;}
h3 { font-size: 130%; margin:10px 50px 10px 10px;}
h4 { font-size: 120%; margin:10px 50px 10px 10px;}
h5 { margin:30px 10px 10px 0;} 
#org { margin:0 20px;}
.nendo { font-size:110%; margin-left:10px; }
#event dl { width:90%; margin:0 auto; }
#event ul { margin:10px 15px 30px 10px; }
.evt-title { margin:10px 0; font-size:120%;}
#grop {margin:30px 0;}
.gr-cont { margin:20px;}	
.bigimg{ display: block; }
.minimg  { display: none; }
}
@media screen and (min-width:800px){
#mainBody{padding: 0 30px; }
#grop {margin:30px 0;}
.gr-cont { margin:30px;}	
}	



.bold { font-weight:bold;}
.center  { text-align: center;}
.pad-l5 { padding-left:5px;}
.pad-l10 { padding-left:10px;}
.pad-l20 { padding-left:20px;}
.pad-b10 { padding-bottom:10px;}
.img-bo  { border:1px solid #666;}
.pad-btm20 { padding-bottom:20px;}
.pad-top10 { padding-top:10px;}
.pad-top20 { padding-top:20px;}
.mrg-l20 { margin-left:20px;}
.mrg-top30 { margin-top:30px;}
.mrg-top20 { margin-top:20px;}
.mrg-top10 { margin-top:10px;}
.mrg-btm20 { margin-bottom:20px;}
.mrg-btm30 { margin-bottom:30px;}
.bo-g { border:1px solid #ddd;}
/* ベーススタイル */
.responsive-table {
  width: 100%;
  border-collapse: collapse;
  font-family: "Helvetica Neue", sans-serif;
  box-shadow: 0 2px 10px rgba(0,0,0,0.1);
  border-radius: 8px;
  overflow: hidden;
}

.responsive-table thead {
  background-color: #003366;
  color: #fff;
}

.responsive-table th, .responsive-table td {
  padding: 1rem;
  text-align: left;
  border-bottom: 1px solid #ddd;
}

.member-table {
  width: 100%;
  border-collapse: collapse;
  font-family: 'Helvetica Neue', sans-serif;
  font-size: 14px;
}

.member-table th,
.member-table td {
  border: 1px solid #ddd;
  padding: 8px;
  vertical-align: top;
  word-break: break-word;
}

.member-table th {
  background-color: #f9f9f9;
  text-align: left;
}

.member-photo {
  width: 64px;
  height: auto;
  border-radius: 6px;
}

.mem-role {
  font-weight: bold;
  display: block;
  margin-bottom: 4px;
  color: #333;
}

/* モバイル対応 */
@media (max-width: 768px) {
  .member-table,
  .member-table thead,
  .member-table tbody,
  .member-table th,
  .member-table td,
  .member-table tr {
    display: block;
    width: 100%;
  }

  .member-table thead {
    display: none;
  }

  .member-table tr {
    margin-bottom: 15px;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
  }

  .member-table td {
    position: relative;
    padding-left: 50%;
    border: none;
    border-bottom: 1px solid #eee;
  }

  .member-table td:before {
    position: absolute;
    left: 10px;
    top: 8px;
    width: 45%;
    white-space: nowrap;
    font-weight: bold;
    color: #555;
  }

  .member-table td:nth-of-type(1):before { content: "顔写真"; }
  .member-table td:nth-of-type(2):before { content: "役職・名前"; }
  .member-table td:nth-of-type(3):before { content: "メール+@aist.go.jp"; }
  .member-table td:nth-of-type(4):before { content: "専門分野"; }
  .member-table td:nth-of-type(5):before { content: "産業分野"; }
}
.gr-cont {
  max-width: 900px;     /* 適度な最大幅に調整 */
  margin: 0 auto;        /* 中央に配置 */
  padding: 0 15px;       /* 左右に余白を持たせる */
  box-sizing: border-box;/* パディング込みの幅管理 */
}