@charset "UTF-8";

/* ------------------------------------- base */
body {
  margin: 0;
/*  overflow-x: hidden;*/
}

body {
  font-size: 14px;
}

a {
  text-decoration: none;
}

a:link,
a:visited {
  color: #111;
  text-decoration: none;
}

ul {
  padding-left: 0px;
}

li {
  list-style: none;
}

p {
  margin-top: 0px;
  line-height: 2.0;
}

h2 {
  font-size: 1.7rem;
  margin-bottom: 20px;
}

@media (max-width: 768px) {
  h2 {
    font-size: 1.3rem;
    margin-bottom: 5px;
  }
}


/* ------------------------------------- header */
.header__line {
  width: 100%;
  height: 10px;
  background-color: #111;
}

@media (max-width: 768px) {
  .header__line {
    height: 5px;
  }
}

.header {
  border: 0px solid red;
  width: 100%;
  height: 172px;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 768px) {
  .header {
    height: 75px;
  }
}

@media (max-width: 768px) {

  /* 英語 */
  .header__en {
    height: 85px;
  }
}

.header__inner {
  border: 0px solid red;
  width: 1160px;
  height: 100%;
}

@media (max-width: 768px) {
  .header__inner {
    width: 100%;
  }
}

.header__logo-wrap {
  width: 100%;
  height: 105px;
  display: flex;
  flex-direction: row;
}

@media (max-width: 768px) {
  .header__logo-wrap {
    height: 150px;
    flex-direction: column;
  }
}

.header__logo {
  border: 0px solid red;
  width: 50%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

@media (max-width: 768px) {
  .header__logo {
    width: 100%;
    padding: 5px 0px;
  }
}

/* 英語 */
.header_logo_pc_en {
  height: 90px !important;
  padding: 0px 0px 0px 5px;
}

/* ロゴ画像 */
.header_logo_pc {
  border: 0px solid red;
  height: 60px;
}

@media (max-width: 768px) {
  .header_logo_pc {
    width: 360px;
    display: none;
  }
}

/* ロゴ切り替え */
.header_logo_sp {
  display: none;
}

@media (max-width: 768px) {
  .header_logo_sp {
    display: block;
    width: 210px;
  }
}

/* 英語 */
.header_logo_sp_en {
  width: 280px !important;
  padding: 0px 0px 0px 5px;
}

.header__submenu-wrap {
  border: 0px solid red;
  width: 50%;
  height: 100%;
}

@media (max-width: 768px) {
  .header__submenu-wrap {
    display: none;
  }
}

.header__submenu {
  border: 0px solid red;
  width: 100%;
  height: 50%;
  /*	position: relative;*/
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.header__submenu>ul {
  border: 0px solid red;
  height: 55px;
  /*	position: absolute;
	top: 0;
	right: 0;*/
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
}

.header__submenu>ul>li {
  border: 0px solid red;
  width: 90px;
  height: 100%;
}

.header__submenu>ul>li>a {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ENGLISH */
.header__submenu>ul>li:nth-child(3) {
  background-color: #111;
}

.header__submenu>ul>li:nth-child(3)>a {
  color: #fff;
}

.header__search {
  border: 0px solid red;
  width: 100%;
  height: 50%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-direction: row;
}

/* 入力欄 */
.header__search>input {
  border-top: 1px solid #d6d6d6;
  border-left: 1px solid #d6d6d6;
  border-right: 0px solid #d6d6d6;
  border-bottom: 1px solid #d6d6d6;
  height: 30px;
}

/* ボタン */
.header__search>button {
  border-top: 1px solid #f0f0f0;
  border-left: 0px solid #f0f0f0;
  border-right: 0px solid #f0f0f0;
  border-bottom: 1px solid #f0f0f0;
  width: 55px;
  height: 34px;
  margin-left: 0px;
  position: relative;
}

.header__search>button::after {
  position: absolute;
  font-family: "FontAwesome";
  font-size: 20px;
  content: "\f002";
  top: 10px;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 30px;
  height: 30px;
}


/* -------------------- nav */
.gnav__menu {
  border: 0px solid red;
  width: 100%;
  height: 65px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
}

.gnav__menu>ul {
  height: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
}

@media (max-width: 768px) {
  .gnav__menu>ul {
    flex-direction: column;
  }
}

.gnav__menu>ul>li {
  width: 160px;
  height: 65px;
  border-left: 1px solid #d7d7d7;
  display: flex;
  /*	align-items: center;*/
  justify-content: center;
  flex-direction: column;
}

@media (max-width: 768px) {
  .gnav__menu>ul>li {
    width: 100%;
    border-left: 0px solid #d7d7d7;
    border-top: 0px solid #fff;
  }
}

.gnav__menu>ul>li:nth-child(7) {
  border-right: 1px solid #d7d7d7;
}

@media (max-width: 768px) {
  .gnav__menu>ul>li:nth-child(7) {
    border-right: 0px solid #d7d7d7;
  }
}

.gnav__menu>ul>li>a {
  border: 0px solid red;
  width: 100%;
  height: 99%;
  /* 線位置調整 */
  text-align: center;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: column;
  padding-top: 15px;
}

@media (max-width: 768px) {
  .gnav__menu>ul>li>a {
    align-items: flex-start;
    justify-content: center;
    padding-top: 0px;
    color: #fff;
    border-bottom: 1px solid #fff;
/*    padding-left: 35px;*/
    position: relative;
  }
}

/* 矢印 */
@media (max-width: 768px) {
  .gnav__menu>ul>li>a::after {
    position: absolute;
    font-family: FontAwesome;
    content: '\f054';
    font-size: 12px;
    top: 27px;
    left: 15px;
  }
}

/* 文字位置調整 */
.gnav__menu>ul>li>a>span {
	padding-left: 0px;
}
@media (max-width: 768px) {
.gnav__menu>ul>li>a>span {
	padding-left: 35px;
}
}


/* アクセスとプロフィールはPCではhover表示となる */

#gnav__access,
#gnav__profile {
  position: absolute;
}

@media (max-width: 768px) {

  #gnav__access,
  #gnav__profile {
    position: static;
  }
}

/* access */
#gnav__access {
  border: 0px solid red;
  top: 65px;
  left: 1px;
  z-index: 2;
  width: 160px;
  height: 60px;
  background-color: #fff;
}

@media (max-width: 768px) {
  #gnav__access {
    width: 100%;
    height: 65px;
    background-color: transparent;
  }
}

/* profile */
#gnav__profile {
  border: 0px solid red;
  top: 65px;
  left: 323px;
  z-index: 2;
  width: 160px;
  height: 60px;
  background-color: #fff;
}

@media (max-width: 768px) {
  #gnav__profile {
    width: 100%;
    height: 65px;
    background-color: transparent;
  }
}

/* 制御 */
#gnav__access {
  display: none;
}

@media (max-width: 768px) {
  #gnav__access {
    display: block;
  }
}

#gnav__profile {
  display: none;
}

@media (max-width: 768px) {
  #gnav__profile {
    display: block;
  }
}

/* リンクの英語 */
.gnav__menu>ul>li>a {
  position: relative;
}

/* 共通 */
.gnav__menu>ul>li>a::before {
  border: 0px solid red;
  position: absolute;
  content: "";
  font-size: 0.7rem;
  color: #797979;
  top: 30px;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 150px;
  height: 20px;
}

@media (max-width: 768px) {
  .gnav__menu>ul>li>a::before {
    display: none;
  }
}

/* Home */
.gnav__menu>ul>li:nth-child(1)>a::before {
  content: "Home";
}

/* Access */
.gnav__menu>ul>li:nth-child(2)>a::before {
  content: "Access";
}

/* Research */
.gnav__menu>ul>li:nth-child(3)>a::before {
  content: "Research";
}

/* People */
.gnav__menu>ul>li:nth-child(4)>a::before {
  content: "People";
}

/* Natsuhiko Yoshinaga */
.gnav__menu>ul>li:nth-child(5)>a::before {
  content: "Natsuhiko Yoshinaga";
}

/* Publications */
.gnav__menu>ul>li:nth-child(6)>a::before {
  content: "Publications";
}

/* Opportunity */
.gnav__menu>ul>li:nth-child(7)>a::before {
  content: "Opportunity";
}

/* 英語中央寄せ */
.nav-list_en>li>a {
  padding-top: 0px !important;
  justify-content: center !important;
}

/* 英語spanサブタイトル非表示 */
.nav-list_en>li>a::before {
  display: none !important;
}

/* hoverでサブメニュー */
.gnav__menu>ul>li {
  position: relative;
}

.gnav__menu>ul>li>ul {
  position: absolute;
  z-index: 2;
  top: 65px;
  left: 0;
  height: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
}

/* リスト化絶対位置解除 */
@media (max-width: 768px) {
  .gnav__menu>ul>li>ul {
    position: static;
  }
}

/* スマホメニュー開閉ボタン */


/* ナビ文字中央寄せ */
.nav-list {
  border: 0px solid red;
  margin: 0 auto;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

/* PCホバーメニュー用 */
.nav-list {
  position: relative;
}

.nav-list {
  display: flex;
  list-style: none;
}

/* スマホ開閉ボタン */
.menu-toggle {
  display: none;
  flex-direction: column;
  cursor: pointer;
  position: absolute;
  z-index: 2;
  top: 23px;
  right: 23px;
}

.bar {
  height: 3px;
  width: 25px;
  background-color: #111;
  margin: 4px 0;
  transition: transform 0.3s ease, opacity 0.3s ease;
  /* アニメーションを追加 */
}

/* 英語 */
.menu-toggle_en {
  top: 30px !important;
}

@media (max-width: 768px) {
  .nav-list {
    display: none !important;
    flex-direction: column;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    /* Adjust based on your header height */
    left: 0px;
    z-index: 1;
    padding-top: 65px;

  }

  .nav-list.active {
    display: block !important;
    background-color: rgba(50, 50, 50, 0.9);

  }

  .menu-toggle {
    display: flex;
  }

  .menu-toggle.active .bar:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
    /* 上のバーを回転 */
    margin: 0;
    position: absolute;
    top: 4px;
    background-color: #fff;
  }

  .menu-toggle.active .bar:nth-child(2) {
    opacity: 0;
    /* 中央のバーを非表示 */
  }

  .menu-toggle.active .bar:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
    /* 下のバーを回転 */
    margin: 0;
    position: absolute;
    top: 20px;
    background-color: #fff;
  }
}

/* グローバルメニューホバー色反転 */
.nav-list>li:hover {
  background-color: #111;
  color: #fff;
}

.nav-list>li>a:hover {
  color: #fff;
}

.nav-list>li:hover>a::before {
  color: #fff;
}

.nav-list>li:hover+#gnav__access,
.nav-list>li:hover+#gnav__profile {
  color: #111;
  background-color: #fff;
}

@media (max-width: 768px) {

  .nav-list>li:hover+#gnav__access,
  .nav-list>li:hover+#gnav__profile {
    color: #fff;
    background-color: transparent;
  }
}

#gnav__access:hover,
#gnav__profile:hover {
  color: #fff;
  background-color: #111;
}

/* PCお問い合わせなどの3メニューが非表示、SPでは移動して表示。javascriptと連携 */
.nav-list>li:nth-child(8),
.nav-list>li:nth-child(9),
.nav-list>li:nth-child(10) {
  display: none;
}

@media (max-width: 768px) {

  .nav-list>li:nth-child(8),
  .nav-list>li:nth-child(9),
  .nav-list>li:nth-child(10) {
    display: block;
  }
}

/* 2番目のAccessはPCではhover、SPでは非表示 */
.nav-list>li:nth-child(2) {
  display: block;
}

@media (max-width: 768px) {
  .nav-list>li:nth-child(2) {
    display: none !important;
  }
}

/* メンバーがトグルボタンでなおかつPCではリストのまま */
@media (max-width: 768px) {
  #menu-item02 div {
    display: block;
    /* divを表示 */
    position: absolute;
    right: 0px;
    color: #fff;
  }

  #menu-item02 div a {
    color: #fff;
  }

}

#more-info-button {
  width: 67px;
  height: 62px;
  background-color: rgba(0, 0, 0, 0.5);
  /* 背景を透明に */
  border: 0px solid red;
  /* 枠線をなくす */
  font-size: 15px;
  /* フォントサイズを調整 */
  cursor: pointer;
  /* カーソルをポインターに */
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* プラスボタンをウィンドウサイズを変更で非表示 */
.additional-info {
  display: none;
}

/* SP時、5番目のプロフィールのみインデント */
@media (max-width: 768px) {
  .nav-list>li:nth-child(5)>a {
/*    padding-left: 50px !important;*/
  }
  .nav-list>li:nth-child(5)>a>span {
    padding-left: 50px !important;
  }
}

@media (max-width: 768px) {
  .gnav__menu>ul>li:nth-child(5)>a::after {
    left: 30px;
  }
}


/* ------------------------------------- mv */
.sitetop__mainvisual-wrap {
  border: 0px solid red;
  width: 100%;
  height: 400px;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 50px, rgba(255, 255, 255, 1) 150px);
}

@media (max-width: 768px) {
  .sitetop__mainvisual-wrap {
    border: 0px solid red;
    height: 100%;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 10px, rgba(255, 255, 255, 1) 50px);
  }
}

.sitetop__mainvisual-wrap>div {
  border: 0px solid red;
  position: relative;
  width: 100%;
  max-width: 1160px;
  height: 100%;
  margin: 0 auto;
  background-image: url(../../images/sitetop_mv.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

@media (max-width: 768px) {
  .sitetop__mainvisual-wrap>div {
    height: 150px;
    background-size: cover;
    background-position: top center;
  }
}

/*
.sitetop__mainvisual-wrap > div > div {
	border: 0px solid red;
	position: absolute;
	width: 100%;
	height: 100px;
	top: 0;
	left: 0;
	right: 0px;
	bottom: 0px;
	margin: auto;
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
}
*/


/* ------------------------------------- sitetop */
.sitetop__contents-wrap {
  border: 0px solid red;
  width: 100%;
  height: 100%;
  padding: 50px 0px;
}

@media (max-width: 768px) {
  .sitetop__contents-wrap {
    padding: 0px 0px 20px 0px;
  }
}

.sitetop__contents-inner {
  border: 0px solid red;
  width: 1160px;
  height: 100%;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .sitetop__contents-inner {
    width: 95%;
    padding: 0px 0px;
  }
}

/* about us */
.sitetop__aboutus-wrap {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: row;
  margin-bottom: 20px;
}

@media (max-width: 768px) {
  .sitetop__aboutus-wrap {
    flex-direction: column;
    margin-bottom: 0px;
  }
}

/* 見出し個別調整 */
.sitetop__aboutus-title {
  margin-top: 0px;
}

@media (max-width: 768px) {
  .sitetop__aboutus-title {
    margin-top: 18px;
  }
}

.sitetop__aboutus-wrap-left {
  border: 0px solid red;
  width: 50%;
  height: 100%;
  padding-right: 15px;
  text-align: left;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
}

@media (max-width: 768px) {
  .sitetop__aboutus-wrap-left {
    width: 100%;
    padding-right: 0px;
  }
}

.sitetop__aboutus-wrap-left>h2 {
  width: 100%;
  border-bottom: 2px solid #000;
  line-height: 2.5;
}

.sitetop__aboutus-wrap-left>h2>span {
  margin-left: 30px;
}

.sitetop__aboutus-wrap-right {
  border: 0px solid red;
  width: 50%;
  height: 100%;
  padding-left: 15px;
  text-align: left;
}

@media (max-width: 768px) {
  .sitetop__aboutus-wrap-right {
    width: 100%;
    padding-left: 0px;
  }
}

.sitetop__aboutus-wrap-right>img {
  width: 100%;
}

/* News */
.sitetop__news-wrap {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
}

.sitetop__news-wrap>h2 {
  width: 100%;
  border-bottom: 2px solid #000;
  line-height: 2.5;
}

.sitetop__news-wrap>h2>span {
  margin-left: 30px;
}

.sitetop__news-list {
  width: 100%;
}

.sitetop__news-list>ul {
  width: 100%;
}

.sitetop__news-list>ul>li {
  border-bottom: 1px dotted #c4c4c4;
  width: 100%;
  padding: 20px 0px;
}

.sitetop__news-list>ul>li>dt {
	float: left;
	margin-right: 30px;
}

.sitetop__news-list>ul>li>dd {
  margin-left: 100px;
}


/* 過去のニュース一覧 */
.sitetop__news-wrap {
  position: relative;
}

.sitetop__news-log {
  border: 0px solid red;
  width: 200px;
/*  height: 30px;*/
  text-align: right;
  position: absolute;
  top: 50px;
  right: 0px;
}

@media (max-width: 768px) {
  .sitetop__news-log {
    top: 30px;
    right: 0px;
  }
}

.sitetop__news-log>a {
	border: 0px solid red;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;
}

.sitetop__news-log>a::before {
  font-family: FontAwesome;
  content: '\f054';
  font-size: 12px;
	display: flex;
	align-items: center;
	position: relative;
	left: -5px;
}


/* ------------------------------------- sub_page */
/* サブステージ */
.subpage__substage-wrap {
  border: 0px solid red;
  width: 100%;
  height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  z-index: 0;
}

.subpage__substage-wrap::before {
  content: "";
  background-image: url(../../images/sitetop_mv.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  position: absolute;
  top: -3px;
  bottom: -3px;
  left: -3px;
  right: -3px;
  filter: blur(3px);
  z-index: -1;
}

/* substage title */
.subpage__substage-wrap>div {
  text-align: center;
}

.subpage__substage-wrap>div>h2 {
  color: #fff;
  font-size: 1.5rem;
}

@media (max-width: 768px) {
  .subpage__substage-wrap>div>h2 {
    font-size: 1.3rem;
  }
}

.subpage__substage-wrap>div>h2>span {
  display: block;
  font-size: 1.0rem;
}

@media (max-width: 768px) {
  .subpage__substage-wrap>div>h2>span {
    font-size: 0.8rem;
  }
}

/* inner */
.subpage__contents-wrap {
  border: 0px solid red;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  margin-bottom: 100px;
  overflow-wrap: anywhere; /* URL改行 */
}

@media (max-width: 768px) {
  .subpage__contents-wrap {
    width: 95%;
  }
}

.subpage__contents-inner {
  border: 0px solid red;
  width: 100%;
  max-width: 1160px;
  height: 100%;
  margin: 0 auto;
}

/* パンくずリスト */
.subpage__breadcrumb-wrap {
  border: 0px solid red;
  width: 100%;
  height: 30px;
  text-align: left;
}

.subpage__breadcrumb-wrap>ul {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.subpage__breadcrumb-wrap>ul>li {
  border: 0px solid red;
  padding-left: 10px;
  margin-right: 10px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;
}

.subpage__breadcrumb-wrap>ul>li::before {
  font-family: FontAwesome;
  content: '\f054';
  font-size: 12px;
	display: flex;
	align-items: center;
	position: relative;
	left: -10px;
}

/* 1番目は非表示 */
.subpage__breadcrumb-wrap>ul>li:nth-child(1)::before {
	display: none;
}





/* サブページのコンテンツ内の見出し */
.subpage__title-h2 {
  width: 100%;
  border-bottom: 2px solid #000;
  margin-top: 30px;
  margin-bottom: 30px;
  line-height: 2.5;
}

/* ページ上部打消し */
/*.subpage__title-h2-top {
	margin-top: 0px
}*/

/* サブページのコンテンツ内の見出し、中央寄せ */
.subpage__title-h3-wrap {
  border: 0px solid red;
  width: 100%;
  margin: 0 auto;
  margin-top: 60px;
  margin-bottom: 40px;
  text-align: center;
}

@media (max-width: 768px) {
  .subpage__title-h3-wrap {
    margin-top: 15px;
    margin-bottom: 10px;
  }
}

.subpage__title-h3 {
  width: 300px;
  margin: 0 auto;
  text-align: center;
  border-bottom: 2px solid #000;
  line-height: 2.5;
}

/* コンテンツ配置、横2列 */
.subpage__text-wrap {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  flex-direction: row;
}

@media (max-width: 768px) {
  .subpage__text-wrap {
    justify-content: center;
    flex-direction: column;
  }
}

.subpage__text-wrap>img {
  width: 30%;
  padding: 15px;
}

@media (max-width: 768px) {
  .subpage__text-wrap>img {
    width: 100%;
  }
}

/* メンバー画像回り込み */
.subpage__text-float-wrap {
  border: 0px solid red;
  width: 100%;
  height: 100%;
}

@media (max-width: 768px) {
  .subpage__text-float-wrap {
    text-align: center;
  }
}

.subpage__text-float-wrap>p {
  text-align: left;
}

.subpage__text-float-wrap>img {
  width: 360px;
  height: auto;
  float: right;
  margin: 0px 0px 10px 30px;
  vertical-align: bottom;
}

@media (max-width: 768px) {
  .subpage__text-float-wrap>img {
    width: 340px;
    float: initial;
    margin: 0 auto;
    margin-top: 15px;
    margin-bottom: 15px;
  }
}

.subpage__text-float-wrap::after {
  content: "";
  display: block;
  clear: both;
}

/* 略歴テーブル */
.subpage__list-wrap {
  border: 0px solid red;
  width: 100%;
  height: 100%;
  margin-top: 30px;
}

.subpage__list-wrap>table>tbody>tr>th {
  border: 0px solid red;
  width: 180px;
  padding: 5px 5px 20px 5px;
  font-weight: normal;
  text-align: left;
  vertical-align: top;
  background-color: #f1f1f1;
}

@media (max-width: 768px) {
  .subpage__list-wrap>table>tbody>tr>th {
    padding: 5px 0px 5px 0px;
  }
}

.subpage__list-wrap>table>tbody>tr>td {
  vertical-align: top;
  padding-left: 15px;
}

@media (max-width: 768px) {
  .subpage__list-wrap>table>tbody>tr>td {
    padding: 5px 0px 15px 0px;
  }
}

@media (max-width: 768px) {

  .subpage__list-wrap>table>tbody>tr>th,
  .subpage__list-wrap>table>tbody>tr>td {
    display: block;
    width: 100%;
  }
}

/* 研究成果 */
.subpage__text-underline {
  text-decoration: underline;
}

.subpage__link-underline {
  text-decoration: underline !important;
  color: #1a6fb2 !important;
}

/* 研究内容の小見出し */
.subpage__title-h3-bar {
  font-size: 1.3em;
  margin: 1.5em 0 0.5em 0;
  background-size: 15px;
  background-position: center left;
  padding-left: 1.4em;
  position: relative;
}

@media (max-width: 768px) {
  .subpage__title-h3-bar {
    margin: 1.0em 0 0.5em 0;
  }
}

.subpage__title-h3-bar:before {
  content: "";
  width: 4px;
  height: 25px;
  background-color: #111;
  display: block;
  position: absolute;
  left: 10px;
  bottom: 0px;
}

@media (max-width: 768px) {
  .subpage__title-h3-bar:before {
    top: 0px;
  }
}

/* 研究内容のコンテンツ */
.subpage__research-contents-left {
  width: 65%;
  height: 100%;
}

@media (max-width: 768px) {
  .subpage__research-contents-left {
    width: 100%;
  }
}

.subpage__research-contents-right {
  width: 35%;
  height: 100%;
  text-align: center;
  padding: 15px;
}

@media (max-width: 768px) {
  .subpage__research-contents-right {
    width: 100%;
    padding: 0px;
  }
}

.subpage__research-contents-right>img {
  width: 100%;
}

@media (max-width: 768px) {
  .subpage__research-contents-right>img {
    width: 360px;
    padding: 0px;
  }
}

/* 研究内容のコンテンツ反転 */
.flex-col-reverse {
  margin: 30px 0px;
  align-items: flex-start;
  flex-direction: row;
}

@media (max-width: 768px) {
  .flex-col-reverse {
    flex-direction: column-reverse;
  }
}

/* youtube埋め込み */
.subpage__mov-wrap {
  width: 100%;
  aspect-ratio: 16 / 9;
  margin: 30px 0px;
  padding: 0px 0px 0px 0px;
}

@media (max-width: 768px) {
  .subpage__mov-wrap {
    margin: 15px 0px;
  }
}

.subpage__mov-wrap iframe {
  width: 100%;
  height: 100%;
}


/* ------------------------------ bpts_spacer */
.bpts_spacer_10 {
  height: 10px;
}

.bpts_spacer_20 {
  height: 20px;
}

.bpts_spacer_30 {
  height: 30px;
}

.bpts_spacer_40 {
  height: 40px;
}

.bpts_spacer_50 {
  height: 50px;
}

.bpts_spacer_60 {
  height: 60px;
}

.bpts_spacer_70 {
  height: 70px;
}

.bpts_spacer_80 {
  height: 80px;
}

.bpts_spacer_90 {
  height: 90px;
}

.bpts_spacer_100 {
  height: 100px;
}

.bpts_spacer_110 {
  height: 110px;
}

.bpts_spacer_120 {
  height: 120px;
}


/* ------------------------------ bpts_margin */
.bpts_margin_10 {
  margin-top: 10px;
}

.bpts_margin_20 {
  margin-top: 20px;
}

.bpts_margin_30 {
  margin-top: 30px;
}

.bpts_margin_40 {
  margin-top: 40px;
}

.bpts_margin_50 {
  margin-top: 50px;
}


/* ------------------------------------- footer */
.footer__contents-wrap {
  border: 0px solid red;
  width: 100%;
  height: 100%;
}

.footer__banner-wrap {
  width: 100%;
  height: 100%;
  background-color: #eaeaea;
}

.footer__contents-inner {
  border: 0px solid red;
  width: 1160px;
  height: 100%;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .footer__contents-inner {
    width: 100%;
  }
}

/* バナーリスト */
.footer__banner-list {
  width: 100%;
  max-width: 1160px;
  height: 100%;
  padding: 15px 0px;
  display: flex;
  align-items: center;
  justify-content: center;
}


/*************************************:
justify-contentを諦めてHTMLを複雑にしてやる方法
***************************************/
.flex-margin {
  display: flex;
  flex-wrap: wrap;
  margin-left: 0px;
  margin-right: 0px;
}

.flex-margin-child {
  width: calc(100% / 3);
  padding: 0px 0px 0px 0px;
}

@media (max-width: 768px) {
  .flex-margin-child {
    width: 100%;
  }
}

.flex-content {
  border: 0px solid red;
  padding: 15px 0px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.flex-content>a>img {
  width: 305px;
  height: 70px;
}

.footer__menu-wrap {
  border: 0px solid red;
  width: 100%;
  height: 100%;
  background-color: #393939;
}

.footer__menu-list {
  border: 0px solid red;
  width: 100%;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

@media (max-width: 768px) {
  .footer__menu-list {
    height: 100%;
  }
}

.footer__menu-list>ul {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
}

@media (max-width: 768px) {
  .footer__menu-list>ul {
    width: 100%;
    height: 245px;
    display: block;
    flex-direction: column;
    margin-top: 0px;
  }
}

.footer__menu-list>ul>li {
  width: 160px;
  height: 25px;
  border-right: 1px solid #666;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 768px) {
  .footer__menu-list>ul>li {
    width: 100%;
    height: 50px;
    border-right: 0px solid #666;
    border-bottom: 1px solid #fff;
  }
}

.footer__menu-list>ul>li>a {
  color: #fff;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 768px) {
  .footer__menu-list>ul>li>a {
    justify-content: flex-start;
    padding-left: 15px;
  }
}

.footer__menu-list>ul>li:nth-child(1) {
  border-left: 1px solid #666;
}

@media (max-width: 768px) {
  .footer__menu-list>ul>li:nth-child(1) {
    border-left: 0px solid #666;
  }
}

@media (max-width: 768px) {
  .footer__menu-list>ul>li:nth-child(5) {
    border-bottom: 0px solid #666;
  }
}

/* ロゴと住所 */
.footer__logo-wrap {
  border: 0px solid red;
  width: 100%;
  height: 100%;
}

.footer__logo-signature {
  border: 0px solid red;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
}

@media (max-width: 768px) {
  .footer__logo-signature {
    flex-direction: column;
  }
}

.footer__logo-signature>div {
  width: 50%;
  padding: 30px 0px;
}

@media (max-width: 768px) {
  .footer__logo-signature>div {
    width: 100%;
    padding: 15px 0px 0px 0px;
  }
}

.footer__logo-signature>div:nth-child(1) {
  text-align: left;
}

@media (max-width: 768px) {
  .footer__logo-signature>div:nth-child(1) {
    text-align: center;
  }
}

/* フッターロゴ */
.footer_logo_pc {
  display: block;
  height: 50px;
}

@media (max-width: 768px) {
  .footer_logo_pc {
    display: none;
  }
}

/* 英語 */
.footer_logo_pc_en {
  height: 80px !important;
}

.footer_logo_sp {
  display: none;
}

@media (max-width: 768px) {
  .footer_logo_sp {
    display: block;
    height: 70px;
    margin: 0 auto;
  }
}

/* 英語 */
.footer_logo_sp_en {
  height: 90px !important;
}

.footer__logo-signature>div:nth-child(2) {
  text-align: right;
  font-weight: bold;
}

@media (max-width: 768px) {
  .footer__logo-signature>div:nth-child(2) {
    text-align: center;
  }
}

.footer__copyright {
  width: 100%;
  padding: 30px 0px;
  text-align: center;
}


/* -------------------------------------- add */
/* 上に戻るボタン */
#page_top {
  width: 40px;
  height: 40px;
  position: fixed;
  z-index: 10;
  right: -40px;
  bottom: 15px;
  background-color: #111;
  opacity: 0.9;
  border-radius: 0px;
}

#page_top a {
  position: relative;
  display: block;
  width: 40px;
  height: 15px;
  text-decoration: none;
  border-bottom-width: 0px;
}

#page_top a:hover {
  background-color: transparent;
}

#page_top a::before {
  font-family: FontAwesome;
  content: '\f077';
  font-size: 20px;
  color: #fff;
  position: absolute;
  width: 20px;
  height: 20px;
  top: 18px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}

/* スクロールバー */
::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background-color: #ccc;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(17, 17, 17, 1.0), rgba(150, 150, 150, 1.0));
  border-radius: 2px;
}

/* サブステージ画像アニメーション */
/* 各ページ下部にjs記述 */
/*==================================================
背景色が伸びて出現
===================================*/
/*全共通*/
.bgextend {
  animation-name: bgextendAnimeBase;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  position: relative;
  overflow: hidden;
  /*　はみ出た色要素を隠す　*/
  opacity: 0;
}

@keyframes bgextendAnimeBase {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/*中の要素*/
.bgappear {
  animation-name: bgextendAnimeSecond;
  animation-duration: 1s;
  animation-delay: 0.6s;
  animation-fill-mode: forwards;
  opacity: 0;
}

@keyframes bgextendAnimeSecond {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

/*左から右*/
.bgLRextend::before {
  animation-name: bgLRextendAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: linear-gradient(110deg, rgba(0, 23, 195, 1.0), rgba(0, 139, 158, 1.0));
  /*    background-color: #666;*/
}

@keyframes bgLRextendAnime {
  0% {
    transform-origin: left;
    transform: scaleX(0);
  }

  50% {
    transform-origin: left;
    transform: scaleX(1);
  }

  50.001% {
    transform-origin: right;
  }

  100% {
    transform-origin: right;
    transform: scaleX(0);
  }
}

/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.bgappearTrigger,
.bgLRextendTrigger {
  opacity: 0;
}


/*==================================================
ふわっ
===================================*/
/* fadeUp */
.fadeUp {
  animation-name: fadeUpAnime;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
  opacity: 0;
}

@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}


/* スクロールをしたら出現する要素にはじめに透過0を指定　*/

.fadeUpTrigger {
  opacity: 0;
}