*{
  /*border:0.1px solid rgb(206, 206, 206);*/
  margin:0px; padding:0px;
  background-color: transparent;
}

body{
  font-size:16px;
  font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
  color:rgb(30,30,30); 
  /*background:linear-gradient(0deg, rgb(232, 220, 184), rgb(145, 129, 74));*/
  background-color: rgb(243, 243, 243);
}

h1, h2, h3, h4{
  margin:1rem 0;
}

h1{
  text-align:center;
  font-size:3rem;
  color:white; text-shadow:5px 5px 3px black;
}

h2{
  margin:0;margin-bottom:1rem;
  padding:1rem;
  text-align:center; font-size:1.6rem;
  color: #423b34;
  /*color: #296214;*/
  background-color: #e3ddcb;
  border-bottom: 3px solid #94949450;
  border-radius:10px 10px 0 0;
}

h3{
  text-align:center; font-size: 1.3rem;
  color:cadetblue;
}

h4{
  text-align:center; font-size:16px;
}


li{
  margin:0.5em;margin-left:2em;
  list-style: none;
}

li::before{
  margin-left: -1em;
  width: 1em;
  display: inline-block;
  content: "\2022";
  color: rgb(162, 191, 182);
}

/**見出し**/

.staff h3, .staff h4, .presen h3, .presen h4, .thesis_title h3, .thesis_title h4{
  margin-left:1rem;margin-top:1rem;
  padding:0;
  text-align:left;
}

img.h2-icon{
  margin-right:1rem;
  height:2rem;
}

/**div header**/

.sub-title{
  color:white;
  text-align: center;
  font-size:0.8rem;
}

.header_title{
  padding:1rem;
  /*background: linear-gradient(0deg, rgba(214, 255, 253, 0.8), rgba(97, 205, 255, 0.694)) ;*/
  background:rgb(115, 85, 38)
}

.header_menu{
  padding:1rem;
  /*background: linear-gradient(0deg, rgba(99, 195, 137, 0.8), rgba(169, 230, 169, 0.694)) ;*/
  background:rgb(102, 182, 126)
}

ul.menu_list{
  padding:0;
}
li.menu_list{
  display:inline-block;
  list-style:none;
  margin:0 0.5rem;
}
li.menu_list::before{
  margin-left:0em;
  width:0em;
  content:"";
}

/**全体の箱**/

.container{
  min-width:400px;
}

/**強調**/

.str{
  background:linear-gradient(transparent 50%, rgb(212, 242, 235) 50%);
}

/**メニュー インライン化**/

ul.menu_list{
  text-align: center;
  color:#ffffff;
}
.menu_list a{
  color:#ffffff;
}

/**ホーム位置に戻る**/

.to_home{
  margin:0 2rem;
  text-align:right;
}
.to_home a{
  color:rgb(82, 82, 82);
}

/**コンテンツ**/

.chapter{
  margin:1rem;
  padding-bottom:1rem;
  background-color: rgba(246, 245, 239, 0.95);
  border: 1px solid #b0b0b0;
  border-radius:10px;
  box-shadow:5px 5px 5px rgba(0, 0, 0, 0.5);
  opacity:0;
  transform:translate(10px,30px);
}

.huwa {  
  animation:huwa 0.6s ease forwards;
}
  
@keyframes huwa {  
  to { 
    opacity:1;
    transform:translate(0%, 0%);
  }
}

.item{
  display:block;
  margin-bottom:2rem;
  padding-bottom:3rem;
  border-bottom:5px solid rgb(229, 229, 229);
}

.item-balloon{
  margin-bottom:2rem;
  padding-bottom:0;
  text-align: center;
  border-bottom: none;
}
.item-balloon p{
  margin:1rem auto;
}

.child-1{order:1;}
.child-2{order:2;}

.research_txt{
  margin:1em auto;
}

.outline_img{
  margin:auto;
}

.outline_img img{
  margin:auto;
  display:block;
  width:min(100%, 800px);
  aspect-ratio: 16/9;
}

.research_img{
  margin:auto;
}

.research_img img{
  margin:auto;
  display:block;
  width:min(100%, 400px);
  aspect-ratio: 4/3;
}

.box_text{
  margin:1em auto;
  padding:1em;
  max-width:600px;
  background-color: rgb(255, 255, 255);
  border:0.5px solid rgba(120, 120, 120, 0.8);
}

/**
吹き出し
https://saruwakakun.com/html-css/reference/speech-bubble
**/

.balloon-color{
  color: #ffffff;
  background: #2197b8;
}

.balloon-left-bottom {
  position: relative;
  display: inline-block;
  margin: 1.5em 0;
  padding: 7px 10px;
  min-width: 120px;
  max-width: 100%;
  border:0;
  border-radius: 10px;
}

.balloon-left-bottom:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #2197b8;
}

.balloon-right-bottom {
  position: relative;
  display: inline-block;
  margin: 1.5em 0;
  padding: 7px 10px;
  min-width: 120px;
  max-width: 100%;
  font-size: 16px;
  border:0;
  border-radius: 10px;
}

.balloon-right-bottom:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #2197b8;
}

/**論文リストのぶら下げインデント**/

ul.references_list {
  list-style: none;
  padding-left: 0;
}

.references_list li {
  padding-left: 2em;
  text-indent: -2em;  /* 1行目を左に戻す */
}
.references_list li::before{
  text-indent: 0;
}
.references_list a{
  color: #31749d
}

/**フッター**/

footer{
  margin:1em;margin-bottom:0;
  padding:2em;
  background-color: rgb(223, 223, 223);
  display: flex;
  flex-wrap: wrap;
  font-size: 0.9rem;
}
footer div{
  margin: 1rem;
  width:250px;
}
footer h2{
  font-size:1rem;color:gray;
  margin:0;
  padding:0;
  border:0;
  text-align:left;
  background-color: rgba(0,0,0,0);
}
footer ul{
  margin:0;
}

/**
PC画面サイズ用 1000px以上、item内の要素を横並びにする。
**/

@media only screen and (min-width: 1000px) {
  h1{
    font-size:3rem;
  } 
.staff h3, .staff h4, .presen h3, .presen h4, .thesis_title h3, .thesis_title h4{
  margin-left: 3rem;margin-top:1rem;
  padding:0;
  text-align:left;
}
  .container{
    margin:0 auto;
    width:980px;
  }
  .item{
    display: flex;
    justify-content: center;
    align-items: flex-start;
  }
  .research_txt{
    margin:1rem;margin-top:0;
    width:500px;
  }
  .research_txt h3{
    margin-top:0;
  }
  .research_img{
    margin:0.2rem;
  }
  .research_img img{
    width:400px;
    aspect-ratio: 4/3;
  }
  ul{
    margin:0 2em;
  }
  li.menu_list{
    display:inline;
    list-style:none;
  }
  li.menu_list::before{
    margin-left:0em;
    width:0em;
    content:"";
  }
  li.list_member{
    text-align:center;
    display:inline;
  }
  li.list_member::before{
    margin-left:0em;
    width:0em;
    content:"";
  }

  .balloon-left-bottom {
    position: relative;
    display: inline-block;
    margin: 1.5em 0 1.5em 15px;
    padding: 7px 10px;
    min-width: 120px;
    max-width: 100%;
    font-size: 16px;
    border-radius: 10px;
  }
  .balloon-left-bottom:before {
    content: "";
    position: absolute;
    top: 50%;
    left: -30px;
    margin-top: -15px;
    margin-left:0px;
    border: 15px solid transparent;
    border-right: 15px solid #2197b8;
  }
  
  .balloon-right-bottom {
    position: relative;
    display: inline-block;
    margin: 1.5em 15px 1.5em 0;
    padding: 7px 10px;
    min-width: 120px;
    max-width: 100%;
    font-size: 16px;
    border-radius: 10px;
  }
  .balloon-right-bottom:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 100%;
    margin-top: -15px;
    margin-left:0px;
    border: 15px solid transparent;
    border-left: 15px solid #2197b8;
  }
}