@charset "Shift-Jis";
/* CSS Document */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
pre,form,fieldset,input,textarea,p,blockquote,th,td,header,section,aside,header nav,footer,hgroup,section{
margin:0;
padding:0;
}

header,article,aside,header nav,footer,hgroup,section{
display:block;
}

fieldset,img {
border:0;
vertical-align:top;
}

address,strong,caption,cite,code,dfn,em,th,var {
font-style:normal;
font-weight:normal;
}

ol,ul {
list-style:none;
}
caption,th {
text-align:left;
}

h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:normal;
}

q:before,
q:after {
content:'';
}

abbr,acronym{
border:0;
}

.f-left{
display:inline !important;
float:left;
}

.f-right{
display:inline !important;
float:right;
}

.f-bold{
font-weight:bold;
}
.notbold{
font-weight:normal !important;
}

.clear:after{  
visibility:hidden;
display:block;
font-size:0;
content:" ";
clear:both;
height:0;}
.clear{
_zoom: 1;}


input,select,textarea{
font-size:100%;
padding:0.2em;
border:1px solid #ccc;
vertical-align:middle;
}
input{
vertical-align:baseline;}
input[type="checkbox"]{
margin-right:0.25em;}
input[type="radio"]{
border:none;}
input[type="submit"],
input[type="reset"],
input[type="button"]{
padding:10px 30px;
margin:0 10px;
vertical-align:top;

font-weight: bold;
cursor: pointer;
color: #fff;
border:none;

background:#333;}
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover{
background:#F15A24;
}
body.e input[type="submit"]:hover,
body.e input[type="reset"]:hover,
body.e input[type="button"]:hover{
background:#ABD408;
}
div.buttonbox{
margin:2em auto;
padding:0;

text-align:center;
}

div.center,
img.center{
display:block;
margin:0 auto;
}

.clear{
clear:both;
}

/*------------*/

html {
width:100%;
height:100%;
overflow-y:scroll;
background:#ffffff;
}

body{
position: absolute;
width:100%;
min-width:1000px;
margin:0 auto;
font-size:15px;
line-height:1.618;
font-family:'メイリオ','HiraMaruPro-W4',Meiryo,'ヒラギノ角ゴ Pro W3',Osaka;
}

.red {
color: #cc0000;
font-weight:bold;
}

/*------header------*/

header{
position: relative;
display: block;
width: auto;
height: 450px;
margin: 0 auto;
background: url(../img/topbg.png) repeat-x;
}

#class header{
position: relative;
display: block;
width: auto;
height: 260px;
margin: 0 auto;
background: url(../img/topbg.png) repeat-x;
}

#teachers header{
position: relative;
display: block;
width: auto;
height: 260px;
margin: 0 auto;
background: url(../img/topbg.png) repeat-x;
}

#voice header{
position: relative;
display: block;
width: auto;
height: 260px;
margin: 0 auto;
background: url(../img/topbg.png) repeat-x;
}

#map header{
position: relative;
display: block;
width: auto;
height: 260px;
margin: 0 auto;
background: url(../img/topbg.png) repeat-x;
}

header #top{
position: relative;
display: block;
margin: 0 auto;
width: 1000px;
height: 110px;
margin: 0 auto;
}

header h2{
position: absolute;
top: 0;
left: 0;
margin-top: 10px;
font-size: 70%;
color: #999999;
}

header h1{
position: absolute;
bottom: 0;
left: 0;
}

header ul li{
display: block;
padding: 4px 0 0 20px;
float: right;
}

header #top nav ul li{
float: left;
padding: 0;
}

header #top nav{
position: absolute;
width: 598px;
height: 51px;
bottom: 0;
right: 0;
text-indent:-9999px;
}

header #top nav .home a{
display: block;
width: 62px;
height: 51px;
background: url(../img/navbutton.png) no-repeat;
}

#home header #top nav .home a{
display: block;
width: 62px;
height: 51px;
background: url(../img/navbutton.png) 0 -51px no-repeat;
}

header #top nav .home a:hover{
width: 62px;
height: 510px;
background-position: 0 -51px;
}

header #top nav .class a{
display: block;
width: 83px;
height: 51px;
background: url(../img/navbutton.png)-62px 0 no-repeat;
}

#class header #top nav .class a{
display: block;
width: 83px;
height: 51px;
background: url(../img/navbutton.png) -62px -51px no-repeat;
}

header #top nav .class a:hover{
width: 83px;
height: 51px;
background-position: -62px -51px;
}

header #top nav .teachers a{
display: block;
width: 115px;
height: 51px;
background: url(../img/navbutton.png) -145px 0 no-repeat;
}

#teachers header #top nav .teachers a{
display: block;
width: 115px;
height: 51px;
background: url(../img/navbutton.png) -145px -51px no-repeat;
}

header #top nav .teachers a:hover{
width: 115px;
height: 51px;
background-position: -145px -51px;
}

header #top nav .voice a{
display: block;
width: 165px;
height: 51px;
background: url(../img/navbutton.png)-260px 0 no-repeat;
}

#voice header #top nav .voice a{
display: block;
width: 165px;
height: 51px;
background: url(../img/navbutton.png) -260px -51px no-repeat;
}

header #top nav .voice a:hover{
width: 165px;
height: 51px;
background-position: -260px -51px;
}

header #top nav .map a{
display: block;
width: 171px;
height: 51px;
background: url(../img/navbutton.png)-427px 0 no-repeat;
}

#map header #top nav .map a{
display: block;
width: 171px;
height: 51px;
background: url(../img/navbutton.png) -427px -51px no-repeat;
}

header #top nav .map a:hover{
width: 171px;
height: 51px;
background-position: -427px -51px;
}

header .snsfb{
margin-top: 6px;
margin-right: 10px;
padding: 0;
width: 80px!important;
}

header .snstw{
margin-top: 8px;
margin-right: 10px;
padding: 0;
width: 90px!important;
}

header .snsg{
margin-top: 8px;
margin-right: 10px;
padding: 0;
width: 70px!important;
}

header .snshatena{
margin-top: 8px;
margin-right: 10px;
padding: 0;
width:60px!important;
}

header .snsen{
margin-top: 10px;
padding: 0;
width: 50px!important;
}

header #slideimg{
position:absolute;
display:block;
width:1000px;
height:340px;
top:110px;
}

header #topimg{
position:absolute;
display:block;
width:1000px;
height:150px;
top:110px;
}

a,
a:link,
a:visited{
color: #336699;
}
a:hover{
color: #336699;
}

body.e a:hover{
color: #336699;
}

a:hover img{
opacity:0.7;
filter: alpha(opacity=70);
-ms-filter: alpha( opacity=70 );
}

/*------main------*/

#wrapper {
position: relative;
width: 1000px;
margin: 0 auto;
background: #ffffff;
}

#wrapper #content {
float: left;
width: 680px;
margin: 40px 40px 20px 20px;
}

#wrapper #side {
float: right;
width: 240px;
margin: 40px 20px 20px 0;
}

#wrapper #side img {
margin-bottom: 10px;
}

/*------footer------*/
footer{
position:relative;
margin: 0 auto;
height: 238px;
background: url(../img/footerbg.png) repeat-x;
font-size: 13px;
}

footer:before{
display:block;
font-size:0;
content:" ";
position:absolute;
}

footer #footer-wrap{
position:relative;
width:1000px;
height: 198px;
margin:0 auto;
padding-top:30px;
}

footer #box1 {
position:relative;
float: left;
width: 210px;
height:188px;
padding: 0 20px;
min-height: 158px;
text-align: center;
background: url(../img/footer_line.png) no-repeat;
}

footer #box2, #box3 {
position:relative;
float: left;
width: 210px;
height:188px;
padding: 0 20px;
min-height: 158px;
background: url(../img/footer_line.png) no-repeat;
}

footer #box4 {
position:relative;
float: left;
width: 210px;
height:188px;
padding: 0 20px;
min-height: 158px;
background: url(../img/footer_line2.png) no-repeat;
}

footer ul {
margin:0; padding:0 10px;
}

footer li {
list-style:none;  
padding-left: 20px;  
background:url(../img/footer_point.png) left no-repeat;
line-height: 2em;
}

footer #box1 .logo {
margin-bottom:20px;
}

footer #box4 .last {
margin-top:20px;
}

footer #footer-wrap .footer-copy{
font-size: 10px;
color:#ffffff;
}