@charset "UTF-8";

html { font-size: 62.5%; /* sets the base font to 10px for easier math */ }
body {
font-size: 13px;
font-size: 1.3rem;
line-height:1.7;
/* sets the default sizing to make sure nothing is actually 10px */
}
body * { box-sizing:border-box; }

p,h1,h2,h3,h4,h5,h6,ul,li,small  { color: #333; }

a {
color: #222;
outline: none;
}
hr {
margin: 1.5em 0;
padding: 0;
height: 0;
border: 0;
border-top: 1px solid #bbb;
}
.fm { font-weight: 500; }
.fb { font-weight: 700; }
.fu { text-decoration: underline; }
.co1 { color: #fa0000; }
.co2 { color: #ff6c00; }

.f333 { color: #333; }
.f666 { color: #666; }
.f12 { font-size: 1.2rem; }
.f13 { font-size: 1.3rem; }
.f14 { font-size: 1.4rem; }
.f15 { font-size: 1.5rem; }
.f16 { font-size: 1.6rem; }
.f18 { font-size: 1.8rem; }
.f20 { font-size: 2rem; }
.f22 { font-size: 2.2rem; }
.f24 { font-size: 2.4rem; }
.f26 { font-size: 2.6rem; }
.f28 { font-size: 2.8rem; }
.f30 { font-size: 3rem; }

.mt30 { margin-top: 30px; }

.pt5 { padding-top: 5px; }
.pt10 { padding-top: 10px; }
.pt20 { padding-top: 20px; }
.pb20 { padding-bottom: 20px; }

.ac { text-align: center; }


/* #gotop */
#gotop {
z-index:2;
_display:none;
position:fixed;
bottom:0;
margin: 0;
padding: 0;
left: auto;
right:10px;
line-height: 1;
}
#gotop a {
width:40px;
display: block;
}
#gotop a img {
width: 100%;
height: auto;
}
@media screen and ( min-width: 1000px ) {
#gotop {
left:50%;
right: 0;
margin-left:450px;
}
#gotop a { width:50px; }
}



/*   ボタン -------------------------------------------    */
.btn1 a {
padding:3px 15px;
border-radius:15px;
background-color:#e8e8e8;
font-size:1.1rem;
line-height:1.1;
text-align:center;
color:#333;
text-decoration:none;
}
.btn1 a:after {
padding-left:8px;
font-family: 'FontAwesome';
content: "\f105";
}
.btn1 a:hover { background-color:#ccc; }

.btn2 {
float:right;
margin-top:-3px;
}
.btn2 a {
padding:3px 15px;
border-radius:15px;
background:rgba(255,255,255,.1);
color:#FFF;
font-size:1.2rem;
line-height:1;
text-align:center;
text-decoration:none;
}

.btn2 a:after {
padding-left:8px;
font-family: 'FontAwesome';
content: "\f105";
}
.btn2 a:hover {
background:rgba(255,255,255,.3);
}

.btn3 a {
padding:3px 15px;
border-radius:15px;
background-color:#e8e8e8;
font-size:1.1rem;
line-height:1.1;
text-align:center;
color:#333;
text-decoration:none;
}
.btn3 a:before {
padding-right:8px;
font-family: 'FontAwesome';
content: "\f104";
}
.btn3 a:hover { background-color:#ccc; }





/*   Header -------------------------------------------    */
header {
z-index: 10;
position: fixed;
top: 0;
left: 0;
width: 100%;
border-bottom: solid 6px #6e559a;
background:rgba(255,255,255,.95);
}
header #header {
margin: 0 auto;
width: 95%;
max-width: 1000px;
}

header h1 {
margin: 0;
padding: 2% 0;
width: 80%;
max-width: 535px;
text-align: center;
line-height: 1;
}
header h1 a {
width: 43%;
display: inline-block;
}
header h1 a + a {
margin-left: 3%;
border-left: solid 1px #d9d9d9;
padding-left: 3%;
width: 52%;
}
header img {
width: 100%;
height: auto;
}
header #language { display: none; }
header #language.btn1 {
float:right;
margin-top: 3%;
}
header #language.btn1 a {
padding: 6px 20px;;
font-size:1.3rem;
line-height:1;
font-weight: 700;
color: #666;
}

header nav ul {
border-bottom: solid 1px #45434c;
}
header nav ul li {
display: block;
letter-spacing: 1px;
font-weight: 400;
border-bottom: solid 1px #45434c;
text-align: center;
}
header nav ul li a {
display: block;
padding: 4% 0;
font-size: 1.7rem;
text-decoration: none;
color: #fff;
background:rgba(31,23,49,.95);
}
header nav ul li.visit a {
background:rgba(31,23,49,.85);
}
header nav ul li a:hover {
background:rgba(31,23,49,1);
}

@media screen and ( min-width: 769px ) {

header {
position:relative;
border-bottom: none;
}
header #header {
overflow: hidden;
}
header h1 {
padding: 1% 0;
float: left;
width: 535px;
}

header #language {
display: block;
float: right;
}

header nav {
border-top: solid 3px #6e559a;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.25, #1f1730), color-stop(0.00, #161022));
background: -webkit-linear-gradient(top, #161022 0%, #1f1730 25%);
background: -moz-linear-gradient(top, #161022 0%, #1f1730 25%);
background: -o-linear-gradient(top, #161022 0%, #1f1730 25%);
background: -ms-linear-gradient(top, #161022 0%, #1f1730 25%);
background: linear-gradient(to bottom, #161022 0%, #1f1730 25%);
}
header nav ul {
margin: 0px auto;
padding: 10px 0;
list-style-type: none;
text-align: center;
}
header nav ul li {
display: inline-block;
padding: 0px 20px;
font-weight: 700;
letter-spacing: 0;
border-bottom: none;
border-right: solid 1px #45434c;
}
header nav ul li:first-child {
border-left: solid 1px #45434c;
}
header nav ul li a {
display: block;
padding: 15px 10px 10px;
text-decoration: none;
font-size: 1.4rem;
color: #fff;
	-webkit-transition : color 0.3s ease ;
	transition : color 0.3s ease ;
 border-bottom: solid 5px #1f1830;
}
header nav ul li.visit a {
border-bottom: solid 5px #685884;
}
header nav ul li a:hover {
color: #a8a3b2;
}

header nav ul li.language {
display:none;
}

header .fixed {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 1000;
}

}





/*   Main -------------------------------------------    */
main {
margin:14% auto 0;
width: 100%;
z-index: 1;
overflow: hidden;
}
main div.inner {
margin-top: 20px;
overflow: hidden;
}
#home main div.inner {
margin-top: 0;
}

main .BreadcrumbList {
list-style-type: none;
margin: 20px auto 0;
padding: 0;
max-width: 1000px;
width: 95%;
}
main .BreadcrumbList li {
display: inline;
}
main .BreadcrumbList li:before {
content: " ＞ ";
}
main .BreadcrumbList li:first-child:before {
content:"";
}
main .BreadcrumbList li a {
padding: 5px 10px;
text-decoration: none;
}

main .BreadcrumbList li:first-child a {
padding-left: 0;
}


main article {
margin:0 auto 30px;
width: 95%;
}


main article h2 {
padding-bottom: 25px;
font-size:3rem; 
font-weight: 700;
line-height: 1.4;
background: url(../img/banner_bg.png) repeat-x center bottom;
}
main article h3 {
margin-bottom:20px;
padding:17px 20px;
font-size:1.6rem;
font-weight:700;
line-height:1;
color:#FFFFFF;
background:rgba(89,77,112,1);
}


#research main article section ,
#projects main article section ,
#publications main article section ,
#members main article section ,
#news main article section {
margin:30px auto 0;
}

main article .ListBox ,
main article .ListBox2 {
clear:both;
overflow: hidden;
position: relative;
margin-top:10px;
border:solid 1px #ccc;
padding:10px;
background-color:rgba(255,255,255,0.5);
}


main article .linkbox:hover {
border:solid 1px #e6e6e6;
background-color:rgba(230,230,230,0.5);
cursor: pointer;
}

main article .linkbox:hover p.btn1 a { background-color:#ccc; }

main article .ListBox .ImgBox ,
main article .ListBox2 .ImgBox {
float:left;
margin-right:20px;
width:120px;
font-size:0;
text-align: center;
}

main article .ListBox .ImgBox2 ,
main article .ListBox2 .ImgBox2 {
float:right;
margin-left:20px;
width:300px;
font-size:0;
text-align: center;
}
main article .ListBox .ImgBox > img ,
main article .ListBox .ImgBox2 > img ,
main article .ListBox2 .ImgBox > img ,
main article .ListBox2 .ImgBox2 > img {
width:100%;
height:auto;
}
main article .ListBox .ImgBox > img + img ,
main article .ListBox .ImgBox2 > img + img ,
main article .ListBox2 .ImgBox > img + img ,
main article .ListBox2 .ImgBox2 > img + img {
	margin-top:10px;
}

main article .ListBox .TextBox ,
main article .ListBox2 .TextBox { width:100%; }
main article .ListBox .ImgBox + .TextBox {
}

main article .ListBox .TextBox p ,
main article .ListBox2 .TextBox p {
line-height: 1.4;
margin-bottom:.5em;
}
main article .ListBox .TextBox p.Date ,
main article .ListBox2 .TextBox p.Date {
font-size: 1.1rem;
}
main article .ListBox .TextBox p.Main ,
main article .ListBox2 .TextBox p.Main {
font-size: 1.5rem;
font-weight: 700;
}
main article .ListBox .TextBox p.Sub ,
main article .ListBox2 .TextBox p.Sub {
font-size: 1.3rem;
}

main article .ListBox p.btn1 ,
main article .ListBox2 p.btn1 {
/*
position: absolute;
right: 10px;
bottom: 10px;
*/
float:right;
margin-top: 5px;
}

main article #News .ListBox ,
main article #News .ListBox2 {
}

main article #Publications .ListBox .TextBox p.Main ,
main article #Publications .ListBox2 .TextBox p.Main {
font-size: 1.3rem;
}

main article #Publications .ListBox .TextBox p.Sub ,
main article #Publications .ListBox2 .TextBox p.Sub {
font-size: 1.1rem;
}

main article + article { display: none; }

main article + article img {
width: 100%;
height: auto;
	-webkit-transition : opacity 0.3s ease ;
	transition : opacity 0.3s ease ;
}
main article + article a {
text-decoration: none;
}
main article + article ul li {
padding: 15px 20px 30px;
background: url(../img/r_bg.png) repeat-x center bottom;
}
main article + article ul li p {
padding: .3em 0;
line-height: 1.4;
}
main article + article ul li p.title {
font-size: 1.5rem;
font-weight: 700;
color: #332e3d;
}

main article + article ul li p.title::after {
float: right;
font-family: 'FontAwesome';
content: "\f105";
}
main article + article ul li a:hover img { opacity: .8; }



@media screen and ( min-width: 769px ) {
main { margin-top:0; }
main div.inner {
display: table;
margin-right: auto;
margin-left: auto;
width: 95%;
max-width: 1000px;
}
main article {
display: table-cell;
padding-right: 50px;
width: auto;
}
main article + article {
display: table-cell;
padding-right: 0;
width: 250px;
background-color: #f6f5f8;
}

}





/*   Footer -------------------------------------------    */
footer { width: 100%; }

footer ul#banner {
width: 100%;
margin-top: 20px;
padding: 45px 0 20px;
text-align: center;
background: url(../img/banner_bg.png) repeat-x center top;
}
footer ul#banner li {
display: inline-block;
margin: 0 5px;
width: 40%;
max-width: 190px;
}
footer ul#banner li img {
width: 100%;
height: auto;
}

footer nav {
background:rgba(89,77,112,1);
}
footer nav ul {
list-style-type: none;
text-align: center;
}
footer nav ul li {
font-weight: 700;
line-height: 1;
border-top: solid 1px #73648d;
}
footer nav ul li:first-child {
border-top: none;
}
footer nav ul li a {
display: block;
padding: 15px 5px;
text-decoration: none;
color: #fff;
	-webkit-transition : color 0.3s ease ;
	transition : color 0.3s ease ;
}
footer nav ul li a:hover { color: #a8a3b2; }

footer nav + p {
padding: 20px 0;
text-align: center;
color: #fff;
font-size: 1.2rem;
line-height: 1.4;
background:rgba(31,23,49,1);
}
footer nav + p small {
color: #fff;
}


@media screen and ( min-width: 769px ) {

footer {}
footer nav {
display: block;
margin: 0 auto;
padding: 20px 0;
width: 100%;
overflow: hidden;
}
footer nav ul li {
display: inline-block;
border-top: none;
border-right: solid 1px #73648d;
}
footer nav ul li:first-child a {
border-left: solid 1px #73648d;
}
footer nav ul li a { padding: 15px; }
footer nav + p small br { display: none; }

}









#publications main article p {
margin-bottom: 1em;
}


/*   研究課題 -------------------------------------------    */

#projects main article p {
margin-bottom: 1em;
}

#projects main article img {
width: 100%;
height: auto;
}


/*   メンバー紹介 -------------------------------------------    */

#members main article p { margin-bottom: 1em; }
#members main article img {
width: 100%;
height: auto;
}

#members main article .tbl1 { width: 100%; }
#members main article .tbl1 th ,
#members main article .tbl1 td {
padding:2% 0 2% 2%;
line-height:1.5;
text-align: left;
vertical-align: middle;
}
#members main article .tbl1 th { width: 40%; }
#members main article .tbl1 th a {
cursor: pointer;
color: #594d70;
text-decoration: underline;
}

#members main article .tbl1 .odd th { background:rgba(89,77,112,.2); }
#members main article .tbl1 .odd td { background:rgba(89,77,112,.1); }
#members main article .tbl1 .even th { background:rgba(89,77,112,.3); }
#members main article .tbl1 .even td { background:rgba(89,77,112,.2); }

#members main article .tbl1 th span ,
#members main article .tbl1 td span {
display:block;
margin-right: 1em;
white-space: nowrap;
}

#members main article .tbl1 th span + span ,
#members main article .tbl1 td span + span { margin-left: 0; }

#members main article .tbl1 th span { font-size: 1.8rem;  font-weight: 500; }
#members main article .tbl1 th span + span { font-size: 1.1rem; }
#members main article .tbl1 td span { font-size: 1.4rem;}
#members main article .tbl1 td span + span { font-size: 1.1rem; }

.moda {
overflow: hidden;
text-align: left;
}
.moda .fl {
text-align: center;
}
.moda .fl img {
margin: 0 auto 10px;
width:70%;
height: auto;
}
.moda .fr {
}

.moda h3 {
margin-bottom:20px;
padding:10px 20px;
font-size:1.6rem;
font-weight:700;
line-height:1;
color:#FFFFFF;
background:rgba(89,77,112,1);
}
.moda .title {
margin:10px 0 5px;
padding:5px;
line-height:1;
background:rgba(89,77,112,.1);
}



@media screen and ( min-width: 450px ) {
.moda .fl {
float: left;
width: 30%;
}
.moda .fl img { width:100%; }
.moda .fr {
float: right;
width:65%;
}
}

@media screen and ( min-width: 769px ) {
#members main article .tbl1 th span ,
#members main article .tbl1 td span {
display:inline-block;
}
}



/*   研究目的 -------------------------------------------    */

#research main article p { margin-bottom: 1em; }
#research main article img {
width: 100%;
height: auto;
}
#research main article h3 {
padding: 0;
font-size:3rem; 
font-weight: 700;
line-height: 1.4;
color: #333;
background: none;
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", serif;
}
#research main article .midashi {
margin:2em 0;
padding:1em;
font-weight: 500;
line-height: 1;
background-color: rgba(0,0,0,.1);
}

#research main article section ul {
margin-bottom: 2em;
padding-left:2em;
}

#research main article section ul li {
padding: 1em 0;
border-bottom: solid 1px #ddd;
line-height: 1.7em;
list-style: decimal outside;
font-size: 1.5rem;
font-weight: 500;
}







/*   最新のお知らせ -------------------------------------------    */

#news main article .ListBox2 .TextBox p { margin-bottom: 2em; }
#news main article img {
width: 100%;
height: auto;
}
#news main article .ListBox2 h3 {
line-height:1.4;
}
#news main article .ListBox2 h4 {
margin: 1em 0;
padding: .8em;
font-weight: 500;
line-height:1.1;
background-color: #f6f5f8;
}
#news main article .ListBox2 h5 {
margin: 1em 0;
font-size: 1.6rem;
font-weight: 700;
line-height: 1.4;
}
#news main article .ListBox2 .image {
margin-left: 2em;
float: right;
width: 30%;
}






/*   お問い合わせ -------------------------------------------    */

#contact main article p { margin-bottom: 1em; }
#contact main article img {
width: 100%;
height: auto;
}

#contact main article .tbl1 { width: 100%; }
#contact main article .tbl1 th ,
#contact main article .tbl1 td {
padding:2% 0 2% 2%;
line-height:1.5;
text-align: left;
vertical-align: middle;
}
#contact main article .tbl1 th { width: 40%; }
#contact main article .tbl1 td a {
cursor: pointer;
color: #594d70;
text-decoration: underline;
}

#contact main article .tbl1 .odd th { background:rgba(89,77,112,.2); }
#contact main article .tbl1 .odd td { background:rgba(89,77,112,.1); }
#contact main article .tbl1 .even th { background:rgba(89,77,112,.3); }
#contact main article .tbl1 .even td { background:rgba(89,77,112,.2); }

#contact main article .tbl1 th span ,
#contact main article .tbl1 td span {
display:block;
margin-right: 1em;
white-space: nowrap;
}

#contact main article .tbl1 th span + span ,
#contact main article .tbl1 td span + span { margin-left: 0; }

#contact main article .tbl1 th span { font-size: 1.4rem; }
#contact main article .tbl1 th span + span { font-size: 1.1rem; }
#contact main article .tbl1 td span { font-size: 1.8rem; font-weight: 500; }
#contact main article .tbl1 td span + span { font-size: 1.1rem; }


@media screen and ( min-width: 450px ) {
}

@media screen and ( min-width: 769px ) {
#contact main article .tbl1 th span ,
#contact main article .tbl1 td span {
display:inline-block;
}
}