body{
width: 100%;
overflow-x: hidden;
min-height: 100%;
display: flex;
flex-direction: column;
font-family: sans-serif;
}

p{font-size:0.9rem;
text-align:justify;
letter-spacing:0.1rem;
padding-bottom:5%;]
width:80%;
margin:0 5%;
}


/****** ヘッダー *******/

.header{
width:95%;
margin:1% auto;}

.header img{width:95%;}

/****** 内容を書き込むスペースの設定 *******/

.menu{width:95%;
margin:0 auto;}


/****** メニュー *******/


/* メニューを幅95%、３列で改行 */

.menu2 {
  display: grid;
  width: 95%;
margin:auto;
  grid-template-columns: repeat(3, auto);
column-gap: 0.5%;
}

.menu2 ul {
width:100%;
}

/* メニューの装飾設定 */

.menu2 li {
width:100%;
list-style:none;
border:solid 2px #ffffff;
font-size:1.2rem;
height:2rem;
background:#4052fa;
text-align:center;
}


/* メニューのリンクに関する設定 */

.menu2 a{
color:#ffffff;
text-decoration:none;
display:block;}

/* メニューにマウスを載せた時の設定 */

.menu2 a:hover{
color:#ffff33;
text-decoration:none;}

/* そのページを開いている時、メニューの文字が太字になる */

li.current a{font-weight:bold;}


/****** 研究内容をご覧ください、の画像 *******/

.index img{width:95%;
display:block;
margin:2% auto;}

.index2 img{width:50%;
display:block;
margin-left:5%;}


/****** メンバーページ *******/

/* 教員のリスト */

dl.member{margin-left:5%;
display:flex;
flex-wrap: wrap;
width:95%;
margin-bottom:10%;}


/* 役職と氏名を横並び。もしレイアウト崩れたらここの数値を変更してみる */

dl.member dt{	    
width:20%;
font-size:1rem;
}

dl.member dd{
width:80%;
font-size:0.9rem;
}

/* 学生のリスト */

dl.student{margin-left:5%;
width:95%;
display:flex;
flex-wrap: wrap;
}

dl.student dt{	    
width:30%;
font-size:1rem;
}

dl.student dd{
width:100%;
font-size:0.9rem;
margin-bottom:3%;
}

/* 役職や学年の文字の設定 */

span{font-size:1rem;
font-weight:bold;}

span.ss{font-size:1rem;
font-weight:bold;}

/* メンバーページの写真に関する設定 */

.sphoto{
margin-top:5%;}

.sphoto img{width:95%;
display:block;
margin:auto;}

/****** 研究業績 *******/

/* 発表論文、などの文字。他のページもこれ */

p.titles{font-size:1.2rem;
font-weight:bold;
margin-top:2%;
margin-left:5%;
padding-bottom:2%;
}

/* ４年ごとに改行 */

.list{display: grid;
  width: 100%;
margin:auto;
  grid-template-columns: repeat(4, auto);}

ul.list{
width:95%;
margin-left:5%;
line-height:2.5rem;
list-style:none;
font-size:1rem;}


/* 頭に自動で数字がつくリスト */

ol.ltitle{
padding-left:1.5rem;
width:80%;
font-size:0.9rem;
margin:0 5%;}

ol.ltitle li{margin-bottom:2%;}




/****** 研究内容 *******/

p.titler{font-size:1.1rem;
padding-bottom:1%;}


/****** コンタクト *******/

table.contact{width:95%;
padding-top:1%;
margin-left:5%;}

table.contact th{width:30%;
text-align:left;
font-size:1rem;}

table.contact td{width:60%;
padding:1%;
font-size:0.9rem;
}

ul.adress{width:95%;
margin-top:1%;
margin-left:5%;
font-size:1rem;
list-style:none;}


/****** リンク *******/

ul.link{list-style:none;
font-size:1rem;
letter-spacing:0.1rem;
width:95%;
margin-left:5%;}

ul.link li{
    position: relative;
    padding-left: 15px;
padding-bottom:1%;
  }
 
/* 頭に＞をつける */

ul.link li:before {
    content: "";
    position: absolute;
    top: .4em;
    left: 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 7px;
    height: 7px;
    border-top: 2px solid #8b6b4e;
    border-right: 2px solid #8b6b4e;
  }
 
ul.link li a:hover{color:#87ceeb;}