﻿@charset "UTF-8";

ul, li, p, h1, h2, h3, h4, h5, h6, article, section, nav, header, footer, aside, body{margin: 0; padding: 0}
h1, h2, h3{color: #000000;}
h4, h5, h6{font-weight: normal;}
img{border-style: none;}
ul, li{list-style-type: none;}
a:link{color: #767676;}
a:visited{color: #767676;}
hr{border: none; height: 2px; border-top: #CCCCCC solid 1px;}

.clear{clear: both;}
.clear hr{display: none;}
.center{text-align: center;}
.right{text-align: right;}
.sppl{font-size: 80%; text-align: left;}

h1{color: #000000; margin: 25px; font-size: 120%; text-align: center;}
h2{color: #000000; margin: 0px; font-size: 120%; font-weight: normal; text-align: center;}
h3{color: #000000; margin: 10px 10px 0px 20px; font-size: 100%; font-weight: bold;}
h4{margin: 1px 10px 0px 20px;}
h5{margin: 1px 10px 10px 20px;}
p{margin: 10px 15px; font-size: 100%; line-height: 1.4em;}
table{
	text-align: center;
	margin: 25px;
	border: 1px solid #AAAAAA;
	border-collapse: collapse;
	border-spacing: 0px;
    font-size: 100%;
    color: #565656;
}
table td{
	padding: 6px 10px;
	border: solid #AAAAAA;
	border-width: 0 0 1px 1px;
	text-align: center;
}

body{
    background-color: #F2F2F2;
    font-size: 100%;
    font-family: 'Lucida Sans', 'Hiragino Kaku Gothic ProN', Meiryo, メイリオ, sans-serif;
    color: #767676;
    text-align: center;
    width: 980px;
    margin: 0px auto;
}

/* For index.html */
body#index{background-color: #FFFFFF; width: 980px;}
#mainimage{
    margin: 0px;
    width: 980px;
    height: 580px; 
    position: relative;
    background-image: url(../img/main.jpg);
    background-repeat: no-repeat;
    }
#mainimage nav{position: absolute; top: 0px; left: 0px;}
#mainimage .logo{position: absolute; top: 100px; left: 0px;}
footer .language {text-align: right; margin-top: -70px; }
/* #whatsnew{margin: 0px auto 5px auto; padding: 0px 0px; width: 980px; text-align: left; background-color: #F2F2F2; border-radius: 3px; box-shadow: 2px 2px 3px #AAAAAA;} */
#whatsnew{
    width: 530px;
    position: absolute;
    top: 510px;
    left: 430px;
    margin: 0px auto 5px auto;
    padding: 0px 0px;
    text-align: left;
    color: #FFFFFF;
    background-color: transparent;
    border-radius: 3px;
    border: 2px solid #CCCCCC;
    background-color: rgba(255,255,255,0.5);
} 
#whatsnew a:link{color: #232323;}
#whatsnew a:visited{color: #232323;}
#whatsnew p{float: left; width: 100px; font-size: 110%; line-height: 30px; font-weight: bold;}
#whatsnew ul{float: right; padding: 5px; width: 370px; height: 43px;}
#whatsnew li{line-height: 15px; color: #121212; font-weight: bold;}
#subimage{margin: 0px auto; padding: 0px; width: 980px; height: 200px; text-align: center;}
#subimage li{width: 245px; height: 200px; float: left; margin: 0px 0px;}

/* whitebox */
.whitebox{
    margin: 12px 0px;
    background-color: #FFFFFF;
    width: 980px;
    float: left;
    border-radius: 3px;
    box-shadow: 2px 2px 3px #AAAAAA;
    text-align: left;
    overflow: hidden;
}
.whitebox h2{width: 980px; height: 50px; line-height: 50px; border-bottom: 1px solid #DADADA;}
.whitebox p{margin: 15px 25px 20px 25px;  font-size: 100%; color: #565656;}
.whitebox img{margin: 10px 5px 5px 5px;}
.whitebox img.left{float: left; margin: 8px;}
.whitebox ul{text-align: left; margin: 25px 15px;}
.whitebox li{margin: 5px 0px; line-height: 1.5em;}
.whitebox li img{margin: 0px;}

.whitebox .divide{
    float: left;
    border-right: 1px solid #DADADA;
    border-bottom: 1px solid #DADADA;
    margin: 0px -1px -1px 0px;
}
.m2{width: 490px; height: 320px; text-align: center;}
.m3{width: 326px; height: 280px; text-align: center;}
.k2s{width: 490px; height: 380px; text-align: left;}
.k2m{width: 490px; height: 450px; text-align: left;}
.m2 h3, .m3 h3, .m2 a, .m3 a{font-weight: normal; margin-top: 5px; color: #000000;}
.m2 p, .m3 p{font-size: 80%; color: #767676; margin-top: 5px;} 
.e2{width: 490px; height: 500px;}
.e2 p, .e1 p {margin: 5px 15px; font-size: 80%; color: #767676; line-height: 1.2em;}
.e2 h4, .e1 h4{font-size: 80%;}
.e2 h5, .e1 h5{font-size: 70%;}
.info p{margin: 25px 40px; color: #565656;}
.info img{float: right; margin: 25px 25px 10px 25px;}

/* linkbox */
.linkbox{
    margin: 12px;
    background-color: #FFFFFF;
    float: left;
    width: 300px;
    border-radius: 3px;
    box-shadow: 2px 2px 3px #AAAAAA;
}
.linkbox a{text-decoration: none;}
.linkbox a:hover {text-decoration: underline;}
.linkbox h2{font-size: 100%;  margin: 10px; font-weight: normal;}
.linkbox img{border: 1px solid #AAAAAA;}
.linkbox ul{text-align: left;}
.linkbox li{margin: 20px;}
.linkbox p, li{font-size: 80%;}

/* Navi */
nav{
    margin: 20px auto;
    padding: 0;
    width: 881px;
    height: 37px;
    left: 50;
    right: 0;
    overflow: hidden;
    background-image: url(../img/menubar.png);
    background-position: center;
    background-repeat: no-repeat;
}
nav li{
    float: left;
    width: 102px;
    text-indent: -9999px;
}
nav a{
    display: block;
    width: 102px;
    height: 37px;  
    background-repeat: no-repeat;
    background-position: top left;
}
#menu1 a{background-image: url(../img/b-index.png); background-position: top;}
#menu2 a{background-image: url(../img/b-info.png); background-position: top;}
#menu3 a{background-image: url(../img/b-member.png); background-position: top;}
#menu4 a{background-image: url(../img/b-research.png); background-position: top;}
#menu5 a{background-image: url(../img/b-oktavian.png); background-position: top;}
#menu6 a{background-image: url(../img/b-lecture.png); background-position: top;}
#menu7 a{background-image: url(../img/b-photo.png); background-position: top;}
#menu8 a{background-image: url(../img/b-access.png); background-position: top;}
#menu9 a{background-image: url(../img/b-link.png); background-position: top;}
#menus1 a{background-image: url(../img/b-index.png); background-position: bottom;}
#menus2 a{background-image: url(../img/b-info.png); background-position: bottom;}
#menus3 a{background-image: url(../img/b-member.png); background-position: bottom;}
#menus4 a{background-image: url(../img/b-research.png); background-position: bottom;}
#menus5 a{background-image: url(../img/b-oktavian.png); background-position: bottom;}
#menus6 a{background-image: url(../img/b-lecture.png); background-position: bottom;}
#menus7 a{background-image: url(../img/b-photo.png); background-position: bottom;}
#menus8 a{background-image: url(../img/b-access.png); background-position: bottom;}
#menus9 a{background-image: url(../img/b-link.png); background-position: bottom;}
#menu1 a:hover{background-position: center;}
#menu2 a:hover{background-position: center;}
#menu3 a:hover{background-position: center;}
#menu4 a:hover{background-position: center;}
#menu5 a:hover{background-position: center;}
#menu6 a:hover{background-position: center;}
#menu7 a:hover{background-position: center;}
#menu8 a:hover{background-position: center;}
#menu9 a:hover{background-position: center;}
#menus2 a:hover{background-position: bottom;}
#menus3 a:hover{background-position: bottom;}
#menus4 a:hover{background-position: bottom;}
#menus5 a:hover{background-position: bottom;}
#menus6 a:hover{background-position: bottom;}
#menus7 a:hover{background-position: bottom;}
#menus8 a:hover{background-position: bottom;}
#menus9 a:hover{background-position: bottom;}

/* footer */
footer{margin-top: 20px;}
footer p{text-align: left; margin: 0px 20px 5px 20px; font-size: 80%;}


/* lightbox */
#lightbox {
	background-color: #eee;
	padding: 10px;
	border-bottom: 1px solid #666;
	border-right: 1px solid #666;
}
#lightboxCaption {
	color: #333;
	background-color: #eee;
	font-size: 90%;
	text-align: center;
	border-bottom: 1px solid #666;
	border-right: 1px solid #666;
}
#lightboxIndicator {
	border: 1px solid white;
}
#lightboxOverallView,
#overlay {
	background-color: #000;
	opacity: 0.5;
}
* html #lightboxOverallView,
* html #overlay {
	background-color: #000;
	filter: Alpha(opacity=50);
}



