@charset "UTF-8";

/*
**********************************************************************

* top.css

* site name   : http://holon-tierra.com/
* description : Top Page styles
* since       : 2008-06-09
* editor      : Tooru Ehara 
* modified    : 
* editor      :

*********************************************************************
*/



/*
===== CONTENTS ===========================================

  1: Main Body styles

==========================================================
*/

/*
*********************************************************************

* 1:Main Body styles

*********************************************************************
*/
div#Contents{
background:none;
}
div#Contents h2{
text-indent:-999em;
height:25px;
margin:0 0 10px;
}
div#Contents h2 a{
display:block;
overflow:hidden;
width:100%;
height:100%;
}
h2#KeyVisual{
text-indent:0;
margin-bottom:20px;
height:auto;
}
div#Contents div.system h2{
background:url("../img/top/ttl_system.jpg") 0 0 no-repeat;
}
div#Contents div.system h4{
background:url("../img/top/img_system_deital.jpg") 0 0 no-repeat;
text-indent:-999em;
height:87px;
}
div#Team{
position:relative;
width:100%;
}
div#Team p.detail{
text-indent:-999em;
position:absolute;
top:60px;
left:318px;
width:117px;
height:16px;
}
div#Contents div.system p.detail a{
background:url("../img/top/btn_system_detail.gif") 0 0 no-repeat;
display:block;
overflow:hidden;
width:100%;
height:100%;
}
div#Contents div.system p.detail a:hover{
background-position:0 -16px;
}
div#Contents div.system ol{
position:relative;
width:100%;
height:65px;
margin-bottom:10px;
}
div#Contents div.system ol li{
position:absolute;
height:13px;
}
div#Contents div.system ol li.system_01{
top:10px;
left:10px;
}
div#Contents div.system ol li.system_02{
top:30px;
left:10px;
}
div#Contents div.system ol li.system_03{
top:48px;
left:10px;
}
div#Contents div.system ol li.system_04{
top:10px;
left:260px;
}
div#Contents div.system ol li.system_05{
top:30px;
left:260px;
}
div#Contents div.system ol li.system_06{
top:48px;
left:260px;
}

div#Contents div.grade{
margin-bottom:10px;
}
div#Contents div.grade h2{
background:url("../img/top/ttl_grade.jpg") 0 0 no-repeat;
}
div#Contents div.grade div#Primary{
background:url("../img/top/bg_grade.gif") 0 100% no-repeat;
float:left;
width:186px;
padding-right:3px;
}
div#Contents div.grade div#Junior{
background:url("../img/top/bg_grade.gif") 0 100% no-repeat;
float:left;
width:186px;
}
div#Contents div.grade div#High{
background:url("../img/top/bg_grade.gif") 0 100% no-repeat;
float:right;
width:186px;
}
div#Contents div.grade h4{
text-indent:-999em;
height:29px;
margin-bottom:7px;
}
div#Contents div.grade h4 a{
display:block;
overflow:hidden;
width:100%;
height:100%;
}
div#Contents div.grade div#Primary h4{
background:url("../img/top/ttl_primary.gif") 0 0 no-repeat;
}
div#Contents div.grade div#Junior h4{
background:url("../img/top/ttl_junior.gif") 0 0 no-repeat;
}
div#Contents div.grade div#High h4{
background:url("../img/top/ttl_high.gif") 0 0 no-repeat;
}
div#Contents div.grade ul{
padding-left:15px;
}
div#Contents div.grade ul li a{
font-weight:bold;
}
div#Contents div.grade div#Primary ul{
margin-bottom:30px;
}
div#Contents div.grade div#Junior ul{
margin-bottom:10px;
}
div#Contents div.grade div#High ul{
margin-bottom:49px;
}
* html div#Contents div.grade div#High ul{
margin-bottom:49px;
}
div#Contents div.grade p{
text-indent:-999em;
font-size:1%;
width:170px;
height:18px;
margin:0 auto 10px;
}
div#Contents div.grade p a{
display:block;
overflow:hidden;
width:100%;
height:100%;
}
div#Contents div.grade div#Primary p a{
background:url("../img/top/btn_primary.gif") 0 0 no-repeat;
}
div#Contents div.grade div#Junior p a{
background:url("../img/top/btn_junior.gif") 0 0 no-repeat;
}
div#Contents div.grade div#High p a{
background:url("../img/top/btn_high.gif") 0 0 no-repeat;
}
div#Contents div.grade div#Primary p a:hover,
div#Contents div.grade div#Junior p a:hover,
div#Contents div.grade div#High p a:hover{
background-position:0 -18px;
}


/*topics
--------------------------------------------------------------*/
div#Contents div.topics h2{
background:url("../img/top/ttl_topics.jpg") 0 0 no-repeat;
}
div#Contents div.topics dl{
padding-left:10px;
}
div#Contents div.topics dt{
float:left;
clear:left;
width:100px;
}
div#Contents div.topics dd{
margin-left:100px;
}
div#Contents ul.banner{
margin-bottom:10px;
}
div#Contents ul.banner li.former{
float:left;
}
div#Contents ul.banner li.latter{
float:right;
}

/*information
--------------------------------------------------------------*/
div.information{
margin-bottom:10px;
}
div.information h2{
background:url("../img/top/ttl_information.jpg") 0 0 no-repeat;
}
div.information dt img{
float:left;
width:42px;
padding-right:10px;
}
div.information dt{
font-weight:bold;
}
div.information dt.longer{
font-size:90%;
}
div.information dl{
float:left;
width:277px;
margin-bottom:10px;
}
div.information dl.even{
float:right;
}
div.information dd{
font-size:90%;
margin-left:50px;
}
div.information dd.rows{
font-size:85%;
}
* html div.information dd.rows{
font-size:10px;
}
div.information dl.longer{
width:548px;
}
div.information p.news{
background:#FFF9F4;
border:1px solid #FF3300;
padding:7px;
font-weight:bold;
margin-bottom:20px;
}
div.information .news dd{
margin-right:10px;
margin-left:10px;
}

/*seminar
--------------------------------------------------------------*/
div#Contents div.winter h2{
background:url("../img/seminar/ttl_winter.jpg") 0 0 no-repeat;
}
div#Contents div.winter{
margin-bottom:20px;
}

/*ex
--------------------------------------------------------------*/
div#Contents div.ex h2{
background:url("../img/top/ttl_ex.jpg") 0 0 no-repeat;
}
div#Contents div.ex{
margin-bottom:20px;
}

/*kokutore
--------------------------------------------------------------*/
div#Contents #kokutore{
margin-bottom:20px;
}

div#Contents #kokutore h2{
background:url("../img/top/ttl_kokutore.jpg") 0 0 no-repeat;
}

div#Contents #kokutore li{
float:left;
font-size:85%;
line-height:120%;
width:33%;
padding:7px 0;
}

div#Contents #kokutore li img{
float:left;
padding-right:5px;
}

div#Contents #kokutore li a{
font-size:110%;
font-weight:bold;
display:block;
margin-left:47px;
}

div#Contents #kokutore li.speed_reading{
color:#f6ab5c;
}

div#Contents #kokutore li.speed_reading:hover{
background-color:#ffedda;
}

div#Contents #kokutore li.speed_reading a{
color:#eb6100;
}

div#Contents #kokutore li.reading_comprehension{
color:#6fbd67;
}

div#Contents #kokutore li.reading_comprehension:hover{
background-color:#ebfee9;
}

div#Contents #kokutore li.reading_comprehension a{
color:#14a83b;
}

div#Contents #kokutore li.motivation_up{
color:#eb6f92;
}

div#Contents #kokutore li.motivation_up:hover{
background-color:#ffeff4;	
}

div#Contents #kokutore li.motivation_up a{
color:#e50065;
}

div#note{
background:#ffffee;
border:1px solid #ffc7ba;
padding:10px;
margin-bottom:20px;
}

div#note h3{
background:url("../img/top/icn_note.gif") 0 50% no-repeat;
font-weight:bold;
font-size:1.1em;
text-indent:0;
color:#fa6745;
height:24px;
margin:0 0 7px;
padding-left:30px;
}
/*gallery style
------------------------------------------------------------------*/
#events{
margin-bottom:20px !important;
overflow:hidden;
width:564px;
height:170px;
}
.filmstrip img{
border:1px solid #d0d0d0 !important;
}