@charset "UTF-8";
/* CSS Document */

/*####################################

structure

####################################*/

body{font-size:14px; line-height:1.7; background-color:#FFF; margin:0; padding:0;}

div#g_head{ width:100%; padding-bottom:5px; border-bottom:3px solid #84ab19; background-color:#FFF;}
div#g_foot{ width:100%; padding-bottom:5px; border-top:3px solid #84ab19; background-color:#FFF;}
	 
div#wrapper{width: 941px; margin: 0 auto;}

/*####################################

head

####################################*/

div#head{width: 941px; height:335px; margin: 0 auto; position:relative;}

div#head h1{ width:917px; height:212px; position:absolute; top:0; left:10px; background:url(../images/title.gif) no-repeat; text-indent:-9999px;}

div#head ul{ position:absolute; top:240px; left:20px;}
div#head ul li{ float:left;}

div#head a#gnavi01{ width:169px; height:105px; display:block; background:url(../images/navi_01.gif) no-repeat 0 0; text-indent:-9999px; margin-right:15px;}
div#head a#gnavi01:hover{ background:url(../images/navi_01.gif) no-repeat 0 -105px;}
div#head a#gnavi02{ width:169px; height:105px; display:block; background:url(../images/navi_02.gif) no-repeat 0 0; text-indent:-9999px;}
div#head a#gnavi02:hover{ background:url(../images/navi_02.gif) no-repeat 0 -105px;}

/*####################################

timetable

####################################*/

div#timetable{ width:941px; margin:10px auto 20px auto; }

div#timetable h2{ width:941px; height:62px; background:url(../images/timetable_midashi.jpg) no-repeat; text-indent:-9999px; margin-bottom:0; padding-bottom:0;}
div#timetable_main{ background:url(../images/timetable_bg-middle.jpg) repeat-y;}
div#timetable_bottom{ width:941px; height:10px; background:url(../images/timetable_bg-bottom.jpg) no-repeat;}

div#timetable_left{ width:425px; float:left; margin-left:20px; _margin-left:10px;}
div#timetable_left h3{ width:377px; height:53px; background:url(../images/timetable_komidashi_01.jpg) no-repeat; text-indent:-9999px; margin:0 0 20px 30px;}

div#timetable_right{ width:425px; float:right; margin-right:20px; _margin-right:10px;}
div#timetable_right h3{ width:377px; height:53px; background:url(../images/timetable_komidashi_02.jpg) no-repeat; text-indent:-9999px; margin:0 0 20px 30px;}

div#timetable_main table{ border-collapse:collapse; width:425px;}
div#timetable_main th,div#timetable_main td{ padding:5px; border:1px solid #fff; text-align:center;}

div#timetable_main th{ background-color:#9cd600; color:#FFF;}
div#timetable_main td.time{ background-color:#e6fbac;}
div#timetable_main td.english{ background-color:#f7adaf;font-size:12px;}
div#timetable_main td.math{ background-color:#81dbf5;font-size:12px;}
div#timetable_main td.japanese{ background-color:#f7eaad;font-size:12px;}

p#timetable_cap{ padding:10px 0 5px 15px; clear:both; margin:0;}

a.btn_record{ width:105px; height:28px; background:url(../images/btn_record.png) no-repeat 0 0; text-indent:-9999px; display:block; margin:3px auto 0 auto;}
a.btn_record:hover{ width:105px; height:28px; background:url(../images/btn_record.png) no-repeat 0 -28px; text-indent:-9999px; display:block; margin:3px auto 0 auto;}
span.btn_record{ width:105px; height:28px; background:url(../images/btn_record.png) no-repeat center bottom; text-indent:-9999px; display:block; margin:3px auto 0 auto;}

/*####################################

about

####################################*/

div#about{ width:941px; margin:10px auto 20px auto;background:url(../images/about_bg-middle.jpg) repeat-y;}

div#about h2{ width:941px; height:62px; background:url(../images/about_midashi.jpg) no-repeat; text-indent:-9999px; margin-bottom:0; padding-bottom:0;}
div#about_main{ background:url(../images/about_ph.jpg) no-repeat 600px 70px;}
div#about_bottom{ width:941px; height:10px; background:url(../images/about_bg-bottom.jpg) no-repeat;}

div.line{ margin:10px auto; text-align:center;}

div#about_main p{ width:510px; margin-left:50px;}


/*####################################

tw_area

####################################*/

div#tw_area{ width:912px; height:47px; background:url(../images/tweet_bg.jpg) no-repeat; margin:0 auto; padding:0; margin-bottom:0px;}
div#tweet{ width:690px; padding:15px 0 0 205px}

/*####################################

contents

####################################*/

div#contents{ width:910px; margin:10px auto 0 auto;}

div#ust_area{ width:610px; float:left;}
div#interactive_area{ width:290px; float:right;}

div#attention{ width:607px; height:149px; background:url(../images/attention.jpg) no-repeat; text-indent:-9999px; margin-top:10px;}

/*####################################

archive_area

####################################*/

div#archive_area{ width:903px; height:64px; margin:10px auto 0 auto; padding-bottom:10px; background:url(../images/arc_bg.gif) no-repeat; position:relative;}
div#archive_area h3{ width:403px; height:43px; background:url(../images/arc_midashi.png) no-repeat; text-indent:-9999px; position:absolute; top:10px; left:60px; margin:0; padding:0;}

div#archive_area ul{ position:absolute; top:8px; left:490px; margin:0; padding:0;}
div#archive_area li{ float:left; margin-right:10px;}

a#archive_01{ width:117px; height:51px; display:block; background:url(../images/arc_english.png) no-repeat 0 0; text-indent:-9999px;}
a#archive_01:hover{ background:url(../images/arc_english.png) no-repeat 0 -51px;}
a#archive_02{ width:117px; height:51px; display:block; background:url(../images/arc_math.png) no-repeat 0 0; text-indent:-9999px;}
a#archive_02:hover{ background:url(../images/arc_math.png) no-repeat 0 -51px;}
a#archive_03{ width:117px; height:51px; display:block; background:url(../images/arc_japanese.png) no-repeat 0 0; text-indent:-9999px;}
a#archive_03:hover{ background:url(../images/arc_japanese.png) no-repeat 0 -51px;}

/*####################################

foot

####################################*/

div#foot{ width:940px; text-align:right; margin:0 auto; padding:0 0 15px 0;}

/*####################################

answer

####################################*/

div#answer{ width:315px; margin:0 auto; padding:0; height:230px; background:url(../images/answer_bg.jpg) no-repeat; overflow:hidden;}
div#answer h3{ margin:0 auto; text-align:center; padding: 0;}
div#answer h4{ margin:0 auto; text-align:center; padding: 5px;}

div#answer_btn{ width:63px; float:left; text-align:center; margin-left:15px; margin-top:36px; display:inline;}
div#answer_graph{ width:220px; float:left; text-align:left; margin-left:13px; margin-top:35px; display:inline;}

div#answer_graph ul{ margin:10px 0 0 0;}
div#answer_graph li{ height:35px;}

*:first-child+html div#answer_graph li{ height:29px;}

div#answer_graph li .left { float:left; display:inline;}
div#answer_graph li .right { float:right; display:inline; font-weight:bold; font-size:110%; width:40px; text-align:left;}
*:first-child+html div#answer_graph li .right { float:right; display:inline; font-weight:bold; font-size:110%; width:40px; text-align:left; padding-top:1px;}

div#answer_graph li .right .bar01{ color:#77D6E8;}
div#answer_graph li .right .bar02{ color:#B9DD7D;}
div#answer_graph li .right .bar03{ color:#FDBC62;}
div#answer_graph li .right .bar04{ color:#E9A1D3;}
div#answer_graph li .right .bar05{ color:#9997FF;}

div#answer_btn ul{ padding-top:7px;}
div#answer_btn li{ margin-bottom:0; height:35px; /height:29px; float:left;}

/*####################################

gochat

####################################*/

div#gochat{ width:315px; margin:0 auto; height:155px; background: url(../images/mail_bg.jpg) no-repeat; position:relative;}

div#gochat h3{ margin:2px auto;}
div#gochat select{ position:absolute; top:44px; left:8px;}
div#gochat h3{ position:absolute; top:3px; left:8px;}

div#gochat select{ width:135px; font-size:12px;}
div#gochat input#name_box{ position:absolute; top:39px; left:23px; width:137px; background:none; border:none; height:20px; color:#666 }
div#gochat input#mes_box{ position:absolute; top:71px; left:23px; width:204px; background:none; border:none; height:20px; color:#666 }

div#btn_mes{ position:absolute; bottom:61px; right:14px; }

div#btn_mes a:link,div#btn_mes a:visited{ width:59px; height:26px; background:url(../images/mail_btn_send.jpg) no-repeat 0 0; text-indent:-9999px; display:block;}
div#btn_mes a:hover{ width:59px; height:26px; background:url(../images/mail_btn_send-over.jpg) no-repeat 0 0; text-indent:-9999px; display:block;}

/*####################################

anq_area

####################################*/

div#anq_area{ width:292px;}
div#anq_area li{ float:left; text-indent:-9999px;}

div#anq_area a#btn_anq_01{ width:146px; height:54px; display:block; background:url(../images/btn_anq.jpg) no-repeat 0 0;}
div#anq_area a#btn_anq_01:hover{ background:url(../images/btn_anq.jpg) no-repeat 0 -54px;}
div#anq_area a#btn_anq_02{ width:146px; height:54px; display:block; background:url(../images/btn_anq.jpg) no-repeat -146px 0;}
div#anq_area a#btn_anq_02:hover{ background:url(../images/btn_anq.jpg) no-repeat -146px -54px;}

/*####################################

faq_area

####################################*/

div#faq_area{ width:292px; text-align:center;}

a#btn_faq{ width:290px; height:49px; display:block; background:url(../images/btn_faq.jpg) no-repeat 0 0; text-indent:-9999px;}
a#btn_faq:hover{ background:url(../images/btn_faq.jpg) no-repeat 0 -49px; }

/*####################################

adv_area

####################################*/

div#adv_area{ width:292px; text-align:center; margin-top:3px;}

a#btn_adv{ width:291px; height:54px; display:block; background:url(../images/btn_adv.jpg) no-repeat 0 0; text-indent:-9999px;}
a#btn_adv:hover{ background:url(../images/btn_adv.jpg) no-repeat 0 -54px; }

/*####################################

main_contents

####################################*/

div#main_contents{ width:941px; margin:15px auto 0 auto;}
div#main_contents_head{ width:941px; height:10px; background:url(../images/contents_bg-top.jpg) no-repeat;}
div#main_contents_middle{ width:941px; background:url(../images/contents_bg-middle.jpg) repeat-y;}
div#main_contents_bottom{ width:941px; height:10px; background:url(../images/contents_bg-bottom.jpg) no-repeat;}