@charset "utf-8";

/* ------------ スライダー ---------------------------------------------------------- */
.wrap_slider {
	width:calc(100vw - 430px);
	margin:0 auto 20px;
}
@media screen and (max-width:1400px) {
.wrap_slider {
	width:100%;
}}/* スライダー枠設定 */

.slider_spacer {
	margin-bottom: 80px;
}
@media screen and (max-width:768px) {
.slider_spacer {
	margin-bottom: 30px;
}}/* 研究テーマの下，装置の上　スライダー余白調整 */

.slick-slide {
	height: auto!important;
}/* ガタツキ防止 */

/* ------------カルーセル（連続移動）------------- */
.slider {
	width: 100%;
}/* スライダー枠設定 */
	  
.slider div {
	margin-right: 2px;
	margin-left: 2px;
}/* スライダー画像間マージン設定 */
	  
.slider img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}/* スライダー画像設定 */




/* ----------- 研究概要 ----------------------------------------------------------- */
.column {
	margin:20px 15px 50px;
	column-count:2;
	column-rule:1px dashed #999;
	column-gap:5%;
}
@media screen and (max-width:768px) {
.column {
	column-count:1;
	margin:10px 5px 30px;
}}/*カラム設定*/

.column p {
	text-indent: 1em;
	font-size:2rem;
	line-height: 1.9;
	text-align:justify;
	text-justify:inter-character;
	line-break:strict;
}
@media screen and (max-width:768px) {
.column p {
	font-size:1.7rem;
	line-height: 1.6;
}}/*カラム書式*/

/* ----------- 図の設定 ------------------ */
.tcrg_figure {
	width:100%;
	margin:20px auto 0;
}/* 研究概略図枠設定 */

.tcrg_figure img {
	width:100%;
	cursor: zoom-in;
}/* 研究概略図 */
	
.tcrg_figure figcaption {
	text-align:center;
	margin-top:15px;
	text-indent:0;
	font-weight: 500;
}
@media screen and (max-width:768px) {
.tcrg_figure figcaption {
	font-size:1.6rem;
}}/* 図キャプション書式*/

.tcrg_figure figcaption span {
	display:inline-block;
	text-align:justify;
	text-justify:inter-character;
	line-break:strict;
}/* 図キャプションが2段になるとき<sapn>で挟む・・・両端ぞろえにする書式 */

.tcrg_figure label.img_switch img {
	transition:0.2s ease-in all;
}/* 元画像ホバー時の変化設定 */

.tcrg_figure label.img_switch:hover img {
    opacity: 0.8;
	transform: scale(1.05);
}/* 元画像ホバー時の変化 */

.highlight {
	font-weight: 700;
  	background: linear-gradient(transparent 55%, yellow 10%);
}/* ハイライト */

/* ----------- モーダル設定 --------------------------------- */
.tcrg_figure input {
    display: none;
}/* input（研究概要）チェックボックス非表示 */

#overlay {
    visibility: hidden;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 70;
    width: 100%;
    height: 100%;
}/* ポップアップwindow部分(初期は非表示) */

#bg_grayout {
    background: rgba(0,0,0,0.7);
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 80;
}/* ポップアップ表示の暗転背景 */

#window {
	width: calc(95vh * 1158 / 1372);
	max-height: 95vh;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background: #fff;
    border-radius: 10px;
    box-shadow: 0px 0px 20px -6px rgba(0,0,0,0.6);
    z-index: 90;
    opacity: 0;
}
@media screen and (max-width:768px) {
#window {
    width:90vw;
	height:calc(90vw * 1372 / 1158);
}}/* モーダルウィンドウ表示部分 */

div.pop_img {
	padding:5px;
}/* ポップアップイメージ枠 */

div.pop_img img {
	height:100%;
	max-height: 93vh;
	display: block;
	cursor: default;
}/* ポップアップイメージ大きさ設定 */

#btn_close {
    position: absolute;
    top: 2px;
    right: 8px;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #d63838;
	color: #fff;
	border:2px solid #fff;
    border-radius: 5px;
    z-index: 100;
    cursor: pointer;
	opacity:0.7;
	transition:0.5s ease-in-out;
}
@media screen and (max-width:768px) {
#btn_close {
    right: 3px;
    width: 25px;
    height: 25px;
}}/* 閉じるボタン背景と位置 */

#btn_close:hover {
    opacity: 1;
	border-radius: 50%;
	transform: rotate(360deg);
}/* 閉じるボタンホバー時の変化 */

#popup:checked ~ #overlay {
    visibility: visible;
}/* クリックでポップアップ表示 */

#popup:checked ~ #overlay #window {
    animation: fadein 0.5s forwards;
}
@keyframes fadein {
    0%{opacity:0;}
	100% {opacity: 1;}
}/* ポップアップ表示時のフェードイン設定 */



/* ----------- 研究プロジェクト ----------------------------------------------------------------------------------------- */
/* --------- 全研プロジェクト枠とdetailsの設定 ------------------ */
.wrap_projects {
	display: flex;
	flex-direction: column;
	margin:30px 35px;
}
@media screen and (max-width:768px) {
.wrap_projects {
	width:100%;
    margin:0 auto;
}}/* 全研究プロジェクト大枠設定 */

/* ---------- detailsの設定 ----------------------------------- */
.wrap_projects details:not(:last-child) {
	margin-bottom: 20px;
}
@media screen and (max-width:768px) {
.wrap_projects details:not(:last-child) {
	margin-bottom: 5px;
}}/* 研究プロジェクト枠設定 */

.wrap_projects summary {
	display: block; /* summary三角印を消す */
	padding-left:70px;
	border:1px solid #999;
	border-radius: 8px;
	background: linear-gradient(#FEFEFE, #F3F5F5);
	box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
  	color:#003;
	font-weight: 600;
	font-size:2.1rem;
	line-height: 2.4;
	position: relative;
	overflow: hidden;
	cursor: pointer;
}
@media screen and (max-width:768px) {
.wrap_projects summary {
	padding-left:35px;
	border-radius: 4px;
    font-size:1.65rem;
	line-height: 2;
}}/* summaryの設定(含む:三角印を消す) */

.wrap_projects summary::-webkit-details-marker {
	display: none; 
}/* summaryの三角印を消す（Chrome_Safari) */

.wrap_projects details[open] summary {
	border-radius: 8px 8px 0 0;
	transition:0.5s;
}
@media screen and (max-width:768px) {
.wrap_projects details[open] summary {
	border-radius: 4px 4px 0 0;
}}/* detailsがopenになった時のsummaryの角丸 */

.wrap_projects summary span {
	width:50px;
	height:100%;
	background:#1e5799;
	font-size:2.1rem;
	line-height: 2.4;
	font-family: "Cinzel Decorative", serif;
	font-weight: 700;
	color:#fff;
	text-align: center;
	position: absolute;
	top:0;
	left:0;
}
@media screen and (max-width:768px) {
.wrap_projects summary span {
	font-size:1.6rem;
	line-height: 2;
	width:30px;
}}/* summaryの設定(カテゴリー：(A) */
	
.wrap_projects details summary:hover {
	background: linear-gradient(#F3F5F5,#FEFEFE );
}/* summaryのホバー時設定 */

.wrap_projects details summary::after {
	font-family: "Font Awesome 7 Free";
	content: "\f0fe";
	font-weight: 900;
	font-size: 1.8rem;
	color:#1e5799;
	position: absolute;
	top:5px;
	right:15px;
	transition:0.5s ease;
}
@media screen and (max-width:768px) {
.wrap_projects details summary::after {
	font-size:1.6rem;
	top:1px;
	right:8px;
}}/* summaryの開く印（+）設定 */

.wrap_projects details[open] summary::after {
	content: "\f146";
	transform:rotate(180deg);
}/* summarの閉じる印（-）設定 */

.wrap_projects details:not([open])::details-content {
    opacity: 0;
	block-size: 0;
	background-color: #deecff;
}/* details開閉時のアニメーション設定（閉じているとき）*/

.wrap_projects details::details-content {
	overflow: clip;
	transition-duration: 0.5s;
    transition-property: content-visibility, opacity, block-size, background-color;
	transition-behavior: allow-discrete;
}/* details開閉時のアニメーション設定（開くとき）*/


/* ----------- 各研究プロジェクト設定 ------------------ */
.wrap_project {
	width:100%;
	border:1px solid #999;
	border-top:none;
	padding:25px;
	display: flex;
	flex-direction: column;
	gap:30px;
	border-radius: 0 0 8px 8px;
}
@media screen and (max-width:768px) {
.wrap_project {
	padding:5px;
}}/* 各研究プロジェクト大枠設定 */

.research_section {
	width:100%;
	display: flex;
	flex-direction: column;
	gap:15px;
}/* 研究テーマ枠設定 */

.research_info {
	display:flex;
	flex-direction:row;
	flex-wrap: wrap;
	gap:50px;
}
@media screen and (max-width:1050px) {
.research_info {
	flex-direction:column;
	gap:25px;
}}/* (説明 + 写真)枠設定 */

.research_info > div {
	flex:1.5;
	display: flex;
	flex-direction: column;
	gap:20px;
}/* (説明 + 写真)設定 */

.research_info > div > div:first-child {
	height:50px;
	line-height: 50px;
	font-size:2rem;
	font-weight: 600;
	transform:skew(-5deg);
	position: relative;
	z-index: 0;
}
@media screen and (max-width:768px) {
.research_info > div > div:first-child {
	height:30px;
	line-height: 30px;
	font-size:1.7rem;
}}/* 研究テーマタイトル枠 */

.research_info > div > div:first-child span {
	border:1px solid #036;
	background: #FEFEFE;
	box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
	padding: 8px 25px;
	border-radius: 4px;
}
@media screen and (max-width:768px) {
.research_info > div > div:first-child span {
	padding: 2px 10px;
}}/* 研究テーマタイトル書式 */

.research_info > div > div:first-child::after {
	content:"";
	width:60%;
	height: 100%;
	background-image: linear-gradient(90deg, rgba(255, 255, 255, 1), rgba(243, 243, 243, 1));
	position: absolute;
	top:0;
	right:0;
	z-index: -1;
}/*タイトルバーの飾り*/

.research_info p {
	text-indent: 1em;
	font-size:1.9rem;
	line-height: 1.7;
	text-align:justify;
	text-justify:inter-character;
	line-break:strict;
}
@media screen and (max-width:768px) {
.research_info p {
	font-size:1.7rem;
	line-height: 1.6;
}}/* 研究テーマ説明書式 */

.research_figure {
	flex:1;
	display: flex;
	flex-direction: column;
	justify-content: center;
}/* 写真枠設定 */
@media screen and (max-width:1050px) {
.research_figure {
	width:80%;
	margin:0 auto;
}}/* (説明 + 写真)枠設定 */

.research_figure img {
	width:100%;
	border-radius: 4px;
	box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
}/* 写真設定 */

.research_figure figcaption {
	font-size: 1.5rem;
	text-align: center;
	line-height:1.5;
	padding:5px 0;
}/* 写真のキャプション */

.btn_work {
	width:150px;
	height:40px;
	font-size: 1.5rem;
	line-height: 1.5;
	margin:0 auto;
}/* 過去の研究紹介ボタンの設定(a.btn_linkとの差) */




/* ----------- 卒論・修論のテーマ ---------------- */
/* ----------- 領域レイアウト ---------------- */
.titles {
	width:100%;
	margin:10px 0 30px;
	display: flex;
	flex-direction: row;
	gap:10px;
}
@media screen and (max-width:768px) {
.titles {
	flex-direction: column;
}}/* 卒論・修論のテーマ大枠 */

.titles_selector {
	width:200px;
	display: flex;
	flex-direction: column;
	align-items: center;
    margin: 0 auto;
}
@media screen and (max-width:768px) {
.titles_selector {
	width:100%;
	flex-direction: row;
	margin-bottom:10px;
}}/* 選択欄大枠 */

.research_topics {
	flex:1;
}/* テーマ大枠 */

/* ----------- 選択欄設定---------------- */
.titles_selector div {
	width:100%;
}/* 選択欄枠 */

.titles_selector label {
	width:100%;
	text-align: center;
	display: block;
	cursor: pointer;
	border:2px solid #fff;
	background: linear-gradient(#FEFEFE, #F3F5F5);
	box-shadow:1px 1px 3px #666;
	font-weight: 500;
	padding:3px 0;
	color:#036;
	transition: 0.1s;
	position: relative;
}
@media screen and (max-width:768px) {
.titles_selector label {
	font-size:1.3rem;
	white-space: nowrap;
	overflow: hidden;
}}/* ボタン設定 */

.titles_selector label:hover {
	background: linear-gradient(#F3F5F5,#FEFEFE );
	font-weight: 700;
}/* ボタン設定（ホバー時）*/

.titles_selector label span {
	position: absolute;
	top:3px;
	left:10px;
}
@media screen and (max-width:768px) {
.titles_selector label span {
	display: none;
}}/* (A)位置調整 */

.titles_selector input[type=radio] {
	display:none;
}/* 元々のラジオボタンを表示させない */

.titles_selector input[type=radio]:checked + label {
    color: white;
	font-weight: bold;
    background: #1e5799;
	border:2px solid #fff;
}/* チェックされた項目設定 */

.titles_content {
    transition: opacity 0.1s;
}/* リストが切り替わるときの変化設定 */

.titles:has(#titles-A:checked) .A, .titles:has(#titles-B:checked) .B,
.titles:has(#titles-C:checked) .C, .titles:has(#titles-D:checked) .D {
	background: linear-gradient(#F3F5F5,#FEFEFE);
    box-shadow: 0 0 3px 0 rgb(77, 166, 255);
}/*　checkされた項目の表示設定　*/

.titles:has(#titles-A:checked) .titles_content:not(.A),
.titles:has(#titles-B:checked) .titles_content:not(.B),
.titles:has(#titles-C:checked) .titles_content:not(.C),
.titles:has(#titles-D:checked) .titles_content:not(.D) {
    opacity: 0.3;
    filter: blur(1px);
}/*　checkされた項目以外の表示設定　*/ 
@media screen and (max-width:768px) {
.titles:has(#titles-A:checked) .titles_content:not(.A),
.titles:has(#titles-B:checked) .titles_content:not(.B),
.titles:has(#titles-C:checked) .titles_content:not(.C),
.titles:has(#titles-D:checked) .titles_content:not(.D) {
	display: none;
}}/* checkされた項目以外の表示設定 */ 

/* ------------------ テーマ ---------------- */
.research_topics > ul {
	list-style-type:none; 
	margin:0 10px 0;
}
@media screen and (max-width:768px) {
.research_topics > ul {
	margin:0;
}}/* 研究リスト枠 */

.research_topics > ul > li {
	font-weight:700;
	padding-left:5px;
	margin:0;
}/* 修論・卒論の文字 */

.research_topics ul li:not(:last-child) ul {
	margin:10px 0 20px;
}/* 修論・卒論間の余白 */

.research_topics ul li ul li {
	font-weight:normal;
	list-style-type:none;
	margin-left:15px;
	padding:2px 10px 2px 15px;
	border:1px solid #fff;
	background: linear-gradient(#FEFEFE, #F3F5F5);
    box-shadow: 0 0 3px 0 rgb(0 0 0 / .2);
}
@media screen and (max-width:768px) {
.research_topics ul li ul li {
	font-size:1.6rem;
	margin-left:0;
	padding:2px 5px;
	border: none !important;
}}/* テーマリスト */

.research_topics span.grade {
	color:#036;
	font-weight: 700;
	text-shadow: 1px 3px 2px rgba(0,0,0,0.2), 0px -2px 5px rgba(255,255,255,0.3);
	background: linear-gradient(#FEFEFE, #F3F5F5);
	padding:0 15px 3px;
	border-radius: 50px;
	border:1px solid rgb(77, 166, 255);
	box-shadow: 0 0 5px 0 rgb(0 0 0 / .2);
}/* 修士論文・卒業論文書式 */




/* ----------- 実験装置 ------------------------------------------------------ */
/* ---------- 共通設定 --------- */
.photo_frame_A, .photo_frame_B {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	gap:25px 0;
	width:100%;
	margin:0 auto 80px;
}
@media screen and (max-width:768px) {
.photo_frame_A, .photo_frame_B {
	margin:0 auto 30px;
}}/* 写真大枠設定 A:共同利用　B：研究室 */

.photo_frame_A > figure {
	width:49%;
	border:1px solid #999;
	overflow: hidden;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}/* 共同利用機器写真枠設定 */

.photo_frame_B > figure {
	width:calc((100% - 20px) / 3);
	border:1px solid #999;
	overflow: hidden;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
	}
@media screen and (max-width:768px) {
.photo_frame_B > figure {
	width:calc((100% - 10px) / 2);
}}/* 研究室機器写真枠設定 */

.photo_frame_A > figure img, .photo_frame_B > figure img {
	width:100%;
	display:block;
	}/* 写真の大きさ */

/* ------------------- 共同利用機器　------------------- */
.photo_frame_A figcaption {
	position: relative;
	text-align: center;
	background: linear-gradient(#FFFFFF, #F5F5F5);
	line-height: 54px;
	font-weight: 700;
	color: #333;
}/* 装置名＋機種名枠 */

.photo_frame_A figcaption p:first-child {
	background-color:#004789;
	border-radius: 50px;
	color: #fff;
	padding: 0 15px;
	font-size:1.5rem;
	line-height: 1.5;
	text-align: center;
	border:1px solid #fff;
	box-shadow: 0 0 0 2px #004789;
	position:absolute;
	top: -14px;
	right: 10px;
}
@media screen and (max-width:768px) {
.photo_frame_A figcaption p:first-child {
	margin-left:28px;
	padding: 0 5px;
	font-size: 1.3rem;
	line-height:25px;
	background-color:transparent;
	border-radius: 0;
	color: #333;
	box-shadow: none;
	position:inherit;
	top:0;
	left:0;
}}/* 装置名(EPMAなど)設定 */

.photo_frame_A figcaption::before {
	font-family: "Font Awesome 7 Free";
	content: "\e4e5";
	font-weight: 700;
	font-size: 2.8rem;
	color: white;
	background: #004789;
	width: 50px;
	height: 46px;
	line-height: 45px;
	display: inline-block;
	position: absolute;
	text-align: center;
	left: 4px;
	top: 4px;
	border:1px solid #fff;
}
@media screen and (max-width:768px) {
.photo_frame_A figcaption::before {
	font-size: 1.8rem;
	width: 25px;
	height: 25px;
	line-height: 25px;
	left:1px;
	z-index: 1;
	top:1px;
}}/* 写真のアイコン書式 */

.photo_frame_A figcaption p:nth-child(2) {
	text-align: center;
	margin-left:58px;
}
@media screen and (max-width:768px) {
.photo_frame_A figcaption p:nth-child(2) {
	display: none;
}}/* 機種名（spは2行目なし）*/

/* -------------------- 研究室の機器 ------------------- */
.photo_frame_B figcaption {
	background: linear-gradient(#FFFFFF, #F5F5F5);
	text-align: center;
	font-size:1.42rem;
	font-weight: 700;
	color: #333;
	position: relative;
}
@media screen and (max-width:768px) {
.photo_frame_B figcaption {
	font-size:1.25rem;
}}/* 写真のキャプション枠設定 */

.photo_frame_B figcaption p {
	text-align: center;
	margin-left:38px;
	line-height:38px;
}
@media screen and (max-width:768px) {
.photo_frame_B figcaption p {
	margin-left:28px;
	line-height:25px;
}
.photo_frame_B figcaption p span {
	letter-spacing: -0.15em;
}}/* 写真のキャプション余白設定 */

.photo_frame_B figcaption::before {
	font-family: "Font Awesome 7 Free";
	content: "\f51c";
	font-weight: 700;
	font-size: 2rem;
	color: white;
	background: #004789;
	width: 32px;
	height: 32px;
	line-height: 32px;
	display: inline-block;
	position: absolute;
	text-align: center;
	left: 3px;
	top: 3px;
}
@media screen and (max-width:768px) {
.photo_frame_B figcaption::before {
	font-size: 1.8rem;
	width: 25px;
	height: 25px;
	line-height: 25px;
	left:1px;
	z-index: 1;
	top:1px;
}}/* 写真のアイコン書式 */




/* ----------- 研究内容 -------------------------------------------------------------------------------------------------------------------------- */
/* ----------- 研究紹介のINDEX ---------------------- */
.wrap_index {
	width:80%;
	margin:50px auto 80px;
	}
@media screen and (max-width:768px) {
.wrap_index {
	width:98%;
	margin:20px auto 30px;
}}/* index枠設定 */

.wrap_index details summary {
	display: block; /*三角印を消す*/
	cursor: pointer;
	position: relative;
	font-family: "Times New Roman", "Times", serif;
	font-weight: bold;
	font-size:2.3rem;
	letter-spacing: 0.2rem;
	text-align: center;
	border-radius: 8px;
	margin-bottom: 15px;
	width: 100%;
	color:#fff;
	box-shadow: 1px 1px 3px #666;
	background:#1e5799;
}
@media screen and (max-width:768px) {
.wrap_index details summary {
	font-size:1.8rem;
}}/* index文字設定 */

.wrap_index details summary::-webkit-details-marker {
	display: none; 
}/* summaryの三角印を消す（index内全て，Chrome_Safari) */

.wrap_index details summary::after {
	content: '\f0fe';
	font-family: 'Font Awesome 7 Free';
	font-weight: 400;
	font-size:1.6rem;
	position: absolute;
	top: 6px;
	right: 20px;
	transition:0.3s;
}
@media screen and (max-width:768px) {
.wrap_index details summary::after {
	font-size:1.4rem;
	top: 6px;
	right: 15px;
}}/* 疑似要素で右側に開アイコン（+）を表示 */

.wrap_index details[open] summary::after {
	content: '\f146';
	transform: rotate(180deg);
}
@media screen and (max-width:768px) {
.wrap_index details[open] summary::after {
	top: 6px;
}}/* 疑似要素を閉アイコン（-）に変更 */

.wrap_index details summary:hover {
	opacity:0.9;
}/* 各項目ホバー時の設定 */

/* ----------- details::content設定 -------------------- */
.wrap_index details:not([open])::details-content {
    opacity: 0;
	block-size: 0;
}/* details開閉時のアニメーション設定（閉じているとき）*/

.wrap_index details::details-content {
	overflow: clip;
	transition-duration: 0.5s;
    transition-property: content-visibility, opacity, block-size;
	transition-behavior: allow-discrete;
	background-color: #FEFEFE;
	padding:15px 0;
	border:1px solid #999;
	box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}/* details開閉時のアニメーション設定（開くとき）*/

/* ----------- コンテンツ内容 -------------------- */
.wrap_index details p {
	font-size: 1.6rem;
	line-height: 1.6;
	margin:0 25px 15px;
}/* index文字下，「一部ですが．．．」設定 */

.wrap_index details ul {
	list-style-type: none;
}/* リストマーカーなし */

.wrap_index details > ul {
	width:90%;
	margin:0 auto;
	font-size: 1.9rem;
	font-weight: 600;
}
@media screen and (max-width:768px) {
.wrap_index details > ul {
	font-size: 1.8rem;
	width:95%;
}}/* 研究プロジェクト4項目 */

.wrap_index details > ul ul {
	margin-left:2em;
	font-size:1.8rem;
	font-weight: normal;
}/* 研究題目リスト設定 */

.wrap_index details > ul ul li:not(:first-child) {
	padding-left:1em;
}/* 研究題目リスト＜概要＞余白設定 */

.wrap_index a {
	display: block;
	text-decoration: none;
	color:#333;
	font-weight: 400;
	position: relative;
	}/*研究題目リンク設定*/

.wrap_index a:hover {
	font-weight:500;
	color:#036;
	transition:all 0.1s;
	}/*研究題目リンクマウスオーバー時設定*/

	

/*-----------------研究紹介の概略書式---------------*/
.introduction {
	margin:30px auto 50px;
	width: 80%;
	font-size: 1.7rem;
	text-align:justify;
	text-justify:inter-character;
	line-break:strict;
	text-indent:0;
	}
@media screen and (max-width:768px) {
.introduction {
	margin:20px auto 30px;
	width: 90%;
	font-size:1.6rem;
}}/* 概略枠設定 */

/* -- column設定は共有 l.41 -- */
/* -- 図の設定  -------------- */
.work figure {
	width:80%;
	margin:20px auto 10px;
}/* 図枠設定 */

.work img {
	width:100%;
}/* 図の大きさ */
	
.work figcaption {
	text-align:center;
	line-height: 1.3;
	margin-top:15px;
	text-indent:0;
	font-weight: 500;
}
@media screen and (max-width:768px) {
.work figcaption {
	font-size:1.6rem;
}}/* 図キャプション書式*/

.work figcaption span {
	display:inline-block;
	text-align:justify;
	text-justify:inter-character;
	line-break:strict;
}/* 図キャプションが2段になるとき<sapn>で挟む・・・両端ぞろえにする書式 */



/* ----------- 研究成果 ------------------------------------------------------------------------- */
.publication_year {
	font-size:2.2rem;
	font-weight: 700;
	padding:5px 0 5px 25px;
}
@media screen and (max-width:768px) {
.publication_year {
	font-size:1.7rem;
	padding-left:15px;
}}/* 発行年見出し設定 */

.year p {
	font-weight:500;
	margin-bottom:10px;
	padding-left:20px;
	font-size: 1.8rem;
	display: flex;
	align-items: center;
}
@media screen and (max-width:768px) {
.year p, .year select {
	font-size:1.6rem;
}}/* 発表年 */

.year select {
	width:100px;
	margin-left:30px;
	font-size: 1.8rem;
}/* 発表年（枠）*/

.paper,.database {
	width:100%;
	height:100vh;
	border:1px solid #036;
	box-shadow: 1px 1px 3px #333;
}/* pdf枠の設定 */

/* -----------データベース（tab設定）---------- */
.tab-container ul {
	width:100%;
  	margin-top: 30px;
  	padding: 0;
  	list-style: none;
  	display: flex;
  	border-bottom: none;
}/* タブ大枠設定 */

.tab-container ul li {
  	flex: 1;
 	cursor: pointer;
  	transition: all 0.3s ease;
  	position: relative;
  	color: #333;
  	font-weight: 500;
	line-height: 1.3;
	padding:5px;
	border:2px solid #fff;
  	border-radius: 4px;
	text-align: center;
  	display: flex;
  	align-items: center;
  	justify-content: center;
	background: #f3f5f5;
}
@media screen and (max-width:768px) {
.tab-container ul li {
	font-size:1.7rem;
}}/* タブ見出し枠設定 */

.tab-container ul li.selected {
  	color: #fff;
  	font-weight: 700;
  	background-color: #1E5799;
}/* タブ見出し枠(選択)設定 */

.tab-container ul li:not(.selected):hover {
  	color: #333;
  	background: #EBF4FD;
}/* タブ見出し枠(選択外ホバー)設定 */

.tab-container .tab-content {
  display: none;
}/* タブ内容設定（初期非表示） */

.tab-container .tab-content.selected {
  display: block;
  animation: fadeIn 0.3s ease;
}/* タブ内容設定（選択時表示） */

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}/* タブ内容表示時の変化設定 */