@charset "utf-8";
/* Copyright 2023 FSFIELD All Rights Reserved. */

/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

PC、タブレット、スマートフォン共通

_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

/* ------------------------------------------------------------

研究者一覧

------------------------------------------------------------ */
/* アルファベット検索
---------------------------------------------- */
.heading01 img {
	margin-right: 2rem;
}
.ttl01 {
	display:flex;
}
.ttl01_1,
.ttl01_2 {
	display: flex; 
	padding: 2rem 4rem;
}
.ttl01_1 img {
	margin-right: 2rem;

}
.ttl01_1 .txt {
	display: inline-block;
	font-size: 1.5em;
}
.selectbutton {
	display: inline-block;
	padding: 4px 10px;
	margin: 4px 2px;
	font-size: 16px;
	font-weight: 500;
	border-radius: 6px;
	box-shadow: 0 2px 4px rgba(0,0,0,0.2);
	white-space: nowrap;
}
.btn01 {
	color: #fff;
	background-color: #2589d0;
}
.btn02 {
	color: #333;
	background-color: #ffffcc;
}

/* タブ */
.tab-1,
.tab-2 {
	display: flex; 
	flex-wrap: wrap;
	gap: 0 10px;
	max-width: 1000px;
	margin: 0 auto;
	padding-bottom: 1rem;
}

.tab-1 > label,
.tab-2 > label {
    flex: 1 1;
    order: -1;
    opacity: .5;
    min-width: 70px;
    padding: .6em 1em;
    border-radius: 5px 5px 0 0;
    background-color: #2589d0;
    color: #fff;
    font-size: .9em;
    text-align: center;
    cursor: pointer;
}

.tab-1 > label:hover,
.tab-2 > label:hover {
    opacity: .8;
}

.tab-1 input,
.tab-2 input {
    display: none;
}

.tab-1 > div,
.tab-2 > div {
    display: none;
    width: 100%;
    padding: 1.5em 1em;
    background-color: #fff;
}

.tab-1 label:has(:checked),
.tab-2 label:has(:checked) {
    opacity: 1;
}

.tab-1 label:has(:checked) + div,
.tab-2 label:has(:checked) + div {
    display: block;
}

.list-12 {
    list-style-type: none;
    padding: 1em;
    border: 2px solid #2589d0;
}

.list-12 li {
    display: flex;
    align-items: center;
    gap: 0 10px;
    position: relative;
    padding: .3em .3em .3em 1.5em;
}

.list-12 li::before,
.list-12 li::after {
    position: absolute;
    content: '';
}

.list-12 li::before {
    left: 0;
    width: 1.2em;
    height: 1.2em;
    border-radius: 50%;
    background-color: #2589d0;
}

.list-12 li::after {
    left: .6em;
    transform: translateX(-75%) rotate(-45deg);
    width: .3em;
    height: .3em;
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
}
	.researcherList2 {
		padding: 1rem;
	}

/* ------------------------------------------------------------

研究者紹介

------------------------------------------------------------ */
/* 名前 */
.heading_name {
	margin-bottom: 3rem;
	font-size: 4rem;
	line-height: 1.2;
	font-weight: bold;
	color:#35588B;

}
.heading_name span {
	font-size: 3rem;
}

/* ユニット・グループ */
.container_tab01 {
	border-top: 1px solid #C4C7CD;
	border-bottom: 1px solid #C4C7CD;
	padding: 0 4rem;
	margin-bottom: 4rem;
}
.container_tab01 .inner {
	max-width: 1120px;
	margin: 0 auto;
	border-left: 1px solid #C4C7CD;
	border-right: 1px solid #C4C7CD;
	background-color: rgba(255,255,255,0.5);
}
.container_tab01 .inner .ttl {
	border-left: 4px solid #D16C98;
	padding: 1rem 4rem;
}
.container_tab01 .inner .ttl .txt {
	font-size: 2.5rem;
	line-height: 1.2;
	font-weight: bold;
} 

.affiliation {
	border-left: 4px solid #D16C98;
	padding: 1rem 4rem;
}

.affiliation .unit {
	font-size: 2.5rem;
	font-weight: bold;
}
.affiliation .group {
	font-weight: bold;
}

/* 研究・技術内容 */
.container_type02 .inner,
.container_type01 .inner {
	padding:0;
}
.research_cont {
	margin: 0 auto;
	padding: 1rem;
	background-color: #fff;
}

.research_cont .item {
	margin: 1rem;
	padding: 2rem;
}

.research_cont .item>div .ico_arrow {
	display: inline-block;
	width: 1.8rem;
	height: 1.8rem;
	border-radius: 50%;
	fill: #FFF;
	margin: 0.2rem 0.6rem 0 0;
	flex: none;
}
.research_cont .item_ttl#ttl01 .ico_arrow {
	background: #CB4149;
}
.research_cont .item_ttl#ttl02 .ico_arrow {
	background: #75A03F;
}
.research_cont .item_ttl#ttl03 .ico_arrow {
	background: #2A589D;
}
.item_ttl .ttl_txt {
	font-size: 2rem;
	font-weight: bold;
}

.ttl_list {
	padding-left: 2rem;
}
.research_cont .ttl_list ul {
	list-style-type: disc;
}
.research_cont .ttl_list ul li {
	padding: 0.5rem 0;
	font-size: 2rem;
	line-height: 1.2;
	font-weight: bold;
	color:#336699;
	text-align:justify;
}

.research_cont .item_contents {
	padding: 0 1rem;
}

.research_cont .item_img {
	float: right;
	padding: 1rem 2rem;
}
/*.research_cont .item_img img {
 width: 400px;
}*/

.research_cont .item_txt p {
	text-align:justify;
}
.clearfix {
	clear: both;
}
.tech_ttl .txt {
	padding: 1rem 2rem;
	font-size: 2.5rem;
	line-height: 1.2;
	font-weight: bold;
	color:#336699;
}

.evi_list {
	padding-left: 2rem;
}
.research_cont .evi_list ul {
	list-style-type: disc;
}
.research_cont .evi_list ul li {
	padding: 0.5rem 0;
	/*text-align:justify;*/
}

/* タブ全体 */
.content-block {
	max-width: 1120px;
	margin: 0 auto;
	padding: 0;
}
.tabs {
	display: flex;
	gap: 0.2em;
	border-bottom: 0.2em solid #b0c4de;
}

/* 各タブボタン */
.tab {
  /*flex: 1;*/
	width:calc((100% - 0px) / 3);
  font-size: 1.2em;
  text-align: center;
  padding: 0.6em 1em;
  border-radius: 8px 8px 0 0;
  background: #b0c4de;
  color: #fff;
  text-decoration: none;
  transition: background 0.3s, transform 0.2s;
}

/* ホバー */
.tab:hover {
  transform: translateY(-2px);
  box-shadow: 0 2px 5px rgba(0,0,0,0.5);
}

/* アクティブタブ */
.tab.active {
  background-color: #1b6fa8;
  box-shadow: 0 4px 8px rgba(0,0,0,0.3);
}

.tab::after {
  content: '';
  display: block;
  height: 3px;
  width: 0;
  background-color: #ffeb3b;
  margin-top: 4px;
  transition: width 0.3s;
}

.tab.active::after,
.tab:hover::after {
  width: 100%;
}

.tab:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

.button-like {
  display: inline-block;
  padding: 4px 10px;
  margin: 4px 2px;
  font-size: 16px;
  font-weight: 500;
  border-radius: 6px;
  color: #333;
  background-color: #ffffcc;
  box-shadow: 0 2px 4px rgba(0,0,0,0.2);
  white-space: nowrap;
  /*cursor: pointer;*/
  transition: none;  /* ホバーアニメーションを無効化 */
}

.button-like:last-child {
  margin-right: 0;
}

.button-like:hover {
  transform: none;              /* 動かさない */
  box-shadow: 0 2px 4px rgba(0,0,0,0.2); /* 元の影を維持 */
  background-color: #ffffcc;    /* 元の背景色を維持 */
}


@media only screen and (max-width:1024px) {
	/* 表示領域が1024px以下の場合に適用するスタイル */

	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	タブレット

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

	/* ------------------------------------------------------------
	
	/* --.GoogleSearch-- */
	.GoogleSearch {
		display: contents;
	}

	------------------------------------------------------------ */


	/* 
	---------------------------------------------- */

  	
}

/*--@media--*/


@media only screen and (max-width:767px) {
	/* 表示領域が767px以下の場合に適用するスタイル */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	スマートフォン（iPhone,Android)

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

	/* ------------------------------------------------------------

	研究者一覧

	------------------------------------------------------------ */
	/* アルファベット検索
	---------------------------------------------- */
	.heading01 .txt {
		font-size: 2rem;
	}
	.ttl01 {
		display:block;
	}
	.ttl01_1,
	.ttl01_2 {
		padding: .5rem 4rem;
	}

	.researcherList {
		padding: 0rem 1rem;
	}


	/* ------------------------------------------------------------

	研究者紹介

	------------------------------------------------------------ */
	/* 名前 */
	.heading_name {
		font-size: 3rem;
	}
	.heading_name span{
		font-size: 2rem;
	}

	/* ユニット・グループ */
	.container_tab01, 
	.container_tab02 {
		padding: 0 1.5rem;
	}

	.container_tab01 .inner .ttl {
		padding: 1rem 2rem;
	}

	.affiliation {
		padding: 1rem 2rem;
	}
	.affiliation .unit {
		font-size: 1.7rem;
	}
	.affiliation .unit_en {
		line-height: 1.2;
	}

	/* 研究・技術内容 */
	.ttl_list {
		font-size: 1.7rem;
	}

	.research_cont {
		margin: 0;
		padding: 0;
	}
	.research_cont .item {
		margin: 0;
		padding: 0.5rem 1rem;
	}
	.research_cont .item_contents {
		display: flex;
		flex-direction: column-reverse;
	}
	.research_cont .item_img {
		padding: 1.5rem 0;
	}
	.research_cont .item_img img{
		width:100%;
	}
	.tab {
  		padding: 0.3em 0.6em;
	}

}

/*--@media--*/