@charset "utf-8";

/* --- background, text --- */
body {
/* margin: 0; */
/* padding: 0; */
/*background-color: #ffffff; */
background-color: rgba(22,94,131,2.0); 
color: #000000; /* font color */
/* font-size: 100%; */
background: url(head2.jpg); 
background-size: cover; 
}




/*
a:link { color: #0000ff; }
a:visited { color: #800080; }
a:hover { color: #ff0000; }
a:active { color: #ff0000; }
*/

article {
max-width: 800px;
padding: 20px;
margin: 0 auto;
}

#container {
width: 1040px;
margin: 0 auto;
background-color: #ffffff; /* メインカラムの背景色 */
border: 1px solid #c0c6c9;
border-radius: 15px;
margin-top: 10px;
margin-bottom: 10px;
box-shadow: inset 0 0 5px 5px #c0c6c9;
}

/* --- ヘッダ --- */
#header {
width: 1000px;
margin: 0 auto;
background-color: #ffe080; /* ヘッダの背景色 */
background: url(head3.jpg); 
background-size: cover;
color: white;
}

#header h1 {
 font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "Yu Gothic" , "YuGothic" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , Meiryo ,"MS PGothic" , sans-serif;
    font-size: 30px;
    background: rgba(0,0,0,0.5);
    background: -moz-linear-gradient(left, rgba(22,94,131,2.0), rgba(0,0,0,0));
    background: -webkit-linear-gradient(left,rgba(22,94,131,2.0),rgba(0,0,0,0));
    padding: 100px 20px 20px 40px;
    }

#header img {background: white;}



/* --- ナビゲーション --- */
#nav {
float: left;
width: 200px; /* サイドバーの幅 */
}

#nav ul li {
color: #404040;
border-right: solid 2px #dadada;/*左側の線*/
border-bottom: solid 2px #dadada;/*下に灰色線*/
background: rgba(22,94,131,1.0); 
margin-bottom: 3px;/*下のバーとの余白*/
/* line-height: 1.5; */
/* padding: 10px 10px 10px 10px; */
list-style-type: none!important;/*ポチ消す*/
/*  font-weight: bold; */
display: block;
font-size:  13px; /* Main font-size */
}


#nav a:link {
color: white;
text-decoration: none;
display: block;
width: 150px;
padding: 10px 10px 10px 10px;
}
#nav a:visited {
color: #ffea00;
text-decoration: none;
display: block;
}
#nav li:hover {
background: #918754;
color: #ebd842;
text-decoration: none;
bottom: 10px;
display: block;
 -moz-transition-property: all;
 -moz-transition-duration: 0.1s;
  -moz-transition-timing-function: linear;
  -webkit-transition: all 0.1s linear 0;
}

@media screen and (max-width: 500px)
 {
#nav {
float: left;
width: 220px; /* サイドバーの幅 */
}

#nav ul li {
color: #404040;
border-right: solid 2px #dadada;/*左側の線*/
border-bottom: solid 2px #dadada;/*下に灰色線*/
background: rgba(22,94,131,1.0); 
margin-bottom: 3px;/*下のバーとの余白*/
/* line-height: 1.5; */
/* padding: 10px 10px 10px 10px; */
list-style-type: none!important;/*ポチ消す*/
/*  font-weight: bold; */
display: block;
font-size:  23px; /* Main font-size */
}

#nav a:link {
color: white;
text-decoration: none;
display: block;
width: 210px;
padding: 10px 10px 10px 10px;
}
#nav a:visited {
color: #ffea00;
text-decoration: none;
display: block;
}
#nav li:hover, li:active, li:focus {
background: #918754;
color: #ebd842;
text-decoration: none;
bottom: 10px;
display: block;
 -moz-transition-property: all;
 -moz-transition-duration: 0.1s;
  -moz-transition-timing-function: linear;
  -webkit-transition: all 0.1s linear 0;
}

}





/* --- メインカラム --- */
#content {
float: left;
width: 780px; /* メインカラムの幅 */
}

#content a:link {color: #0000ff; text-decoration: none;}
#content a:visited { color: #800080;}
#content a:hover { color: #ff0000; }
#content a:active { color: #ff0000; }

#content h1 {
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "Yu Gothic" , "YuGothic" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , Meiryo ,"MS PGothic" , sans-serif;
font-size:  25px;
padding: 0px 0px 0px 50px;
color: rgb(22,94,131); 
}

#content h2 {
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "Yu Gothic" , "YuGothic" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , Meiryo ,"MS PGothic" , sans-serif;
font-size:  22px;
padding: 0px 0px 0px 50px;
color: rgb(22,94,131); 
}

#content h3 {
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "Yu Gothic" , "YuGothic" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , Meiryo ,"MS PGothic" , sans-serif;
font-size:  19px;
padding: 0px 0px 0px 50px;
color: rgb(22,94,131); 
}

#content h4 {
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "Yu Gothic" , "YuGothic" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , Meiryo ,"MS PGothic" , sans-serif;
font-size:  17px;
padding: 0px 0px 0px 50px;
color: rgb(22,94,131); 
}

#content p, ul {
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "Yu Gothic" , "YuGothic" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , Meiryo ,"MS PGothic" , sans-serif;
font-size:  15px; /* Main font-size */
color: #2d2d2d; /* Main font-color */
padding: 0px 0px 0px 50px;
}

#content ul {
padding: 0px 0px 0px 70px;
}

#content table { 
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "Yu Gothic" , "YuGothic" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , Meiryo ,"MS PGothic" , sans-serif;
font-size:  15px; /* Main font-size */
color: #2d2d2d; /* Main font-color */
padding: 0px 0px 20px 50px;
}

#content form {
padding: 10px 0px 50px 50px;
}


/* --- フッタ --- */
#footer {
width: 1000px;
margin: 0 auto;
clear: left; /* フロートのクリア */
background-color: #ffe080; /* フッタの背景色 */
background: url(head3.jpg); 
background-size: cover;
font-family: 'Kite One', sans-serif;
color: white;
}

#footer p {
background: rgba(0,0,0,0.5); 
background: -moz-linear-gradient(left, rgba(22,94,131,1.0), rgba(0,0,0,0));
background: -webkit-linear-gradient(left,rgba(22,94,131,1.0),rgba(0,0,0,0));
padding: 20px;}

#footer img {background: white;}


#slideshow {
   position: relative; 
   width:  750px;
   height: 220px;
}
#slideshow div {
   position: absolute; 
   top: 20px;
   left:40px;
   z-index: 8;
   opacity: 0.0;
   margin: 0;
   background-color: white;
   height: 200px;
}
#slideshow div.active {
   z-index: 10;
   opacity: 1.0;
}
#slideshow div.last-active {
    z-index: 9;
}

#slideshow div img {
   width:  750px;
   height: 220px;
   display: inline-block;
   border: 0;
/*   margin-bottom: 10px; */
}


table.sprogram         { 
width: 100%; border: 1px ; 
border-collapse: separate; 
margin-top: 10px; 
margin-bottom: 0px;
}

.sprogram td           { 
padding: 7px;
vertical-align: middle;
text-align: center;
border-bottom: #999 1px solid; 
}

.sprogram .coffee           {
/*font-size:95%; */
background-color: rgba(141,100,73,0.5)
}

.sprogram .talk  { 
background: #bbc8e6;
}

.sprogram .post  { 
background: #e8d3d1;
}

.sprogram .brk  { 
border-bottom: 1px solid; 
}

.sprogram .brkk  { 
border-bottom: 0px solid; 
}

.sprogram .free  {
/*font-size:110%; */
background-color: #d8e698;
}

.sprogram .time  { 
border-bottom: 0px solid;
width: 1%; 
padding: 0px; 
}

.sprogram .fl  { 
border-bottom: 0px solid; 
text-align: left;
}

.sprogram .sympo  { 
background: #dbd0e6;
}

.sprogram .lecture  { 
/*border: 1px solid #000000; */
background: #dbd0e6;
}

/*
.sprogram .date     { border: 1px solid #000000; width: 10%; padding: 7px;
                       background: #c0c6c9;}
*/

.sprogram .date     { 
border: 1px solid #000000; 
width: 10%; padding: 7px;
background: #c0c6c9;
background: -moz-linear-gradient(bottom, rgba(192,198,201,0.7), rgba(192,198,201,0.1));
background: -webkit-linear-gradient(bottom,rgba(192,198,201,0.7),rgba(192,198,201,0.1));
		    }
table.poster {width: 95%; margin-left:20px; margin-bottom:40px;}
.poster td { text-align: left; vertical-align: top; padding:10px;}
.poster .title { font-style: normal; margin-bottom: 10px;}


.error_list {	
padding: 50px 50px 50px 50px;	
color: #ff2e5a;	
font-size: 86%;	
text-align: left;	
border: 1px solid #ff2e5a;	
border-radius: 5px;
}