/* Global
------------------------------------------*/
* { margin: 0; padding: 0; }
html { height: 100%; overflow-y: scroll; }
ul,li,dl,dt,dd { list-style:none; }
img { vertical-align: top; }
a img { border: none; }
body { 
text-align: center;
font-family: arial, helvetica, hirakakupro-w3, osaka, "ms pgothic", sans-serif;
font-size: 12px;
color: #888888;
line-height: 20px;
background: #eee;
}
a:link,a:visited { color: #09f; text-decoration: underline; }
a:hover { color: #f90; text-decoration: underline; }
hr {
height: 1px;
border-style: solid;
border-width: 1px 0 0;
border-color: #ccc;
margin: 5px 0;
}
.clear { clear:both; }  


/* Base
------------------------------------------*/
.MgT10 { margin-top:10px; }
.MgB5 { margin-bottom:5px; }
.MgB10 { margin-bottom:10px; }
.MgB15 { margin-bottom:15px; }
.MgB20 { margin-bottom:20px; }
.MgB25 { margin-bottom:25px; }
.MgB30 { margin-bottom:30px; }
.Fs10 { font-size:10px;}
.Fs12 { font-size:12px;}
.Fs14 { font-size:14px;}
.Fs16 { font-size:16px;}
.Fs18 { font-size:18px;}
.FwB { font-weight:bold;}
.Green {color:#690;}
.Orange {color:#f90;}
.TaL { text-align:left; }
.TaC { text-align:center; }
.TaR { text-align:right; }
.BG_fafafa { background-color:#fafafa; }
.BG_eeeeee { background-color:#eee; }

.title {
padding-bottom:5px;
margin-bottom:10px;
border-bottom: #960 1px solid;
color:#960;
font-size:16px;
font-weight:bold;
letter-spacing:10px;
}
.title_news_l {
font-weight:bold;
letter-spacing:3px;
color:#690;
}
table.webpage {
border-collapse: collapse;
}
table.webpage tr td {
border:#ccc 1px solid;
padding:5px;
}
ul.circle li {
list-style: disc outside;
margin-left:20px;
}


/* Top Area
------------------------------------------*/
#wrapper_menu {
width:100%;
margin:0 auto;
background:#ccc url(../images/top_bg.jpg) repeat-x center top;
}
#menu {
margin:0 auto;
width:900px;
height:150px;
background: #ccc url(../images/menu_bg.jpg) no-repeat center top;
}
#home_btn a {
display:block;
width:388px;
height:100px;
text-indent: -9999px;
overflow:hidden;
background-image: url(../images/menu_bg.jpg);
background-position: -20px 0px;
margin-left:20px;
float:left;
}
#catch_btn a {
float:right;
margin-right:20px;
display:block;
width:50px;
height:100px;
text-indent: -9999px;
overflow:hidden;
background-image: url(../images/menu_bg.jpg);
background-position: -830px 0px;
}
#menu ul {
list-style: none;
margin-left:20px;
}
#menu ul li { display: inline;}
#menu ul li a {
display: block;
float: left;
height: 40px;
width:172px;
text-indent: -9999px;
overflow:hidden;
background-image: url(../images/menu.jpg);
}
li#nav01 a { background-position: 0 40px; }
li#nav01 a:hover { background-position: 0 -40px; }
li#nav02 a { background-position: -172px 40px; }
li#nav02 a:hover { background-position: -172px -40px; }
li#nav03 a { background-position: -344px 40px; }
li#nav03 a:hover { background-position: -344px -40px; }
li#nav04 a { background-position: -516px 40px; }
li#nav04 a:hover { background-position: -516px -40px; }
li#nav05 a { background-position: -688px 40px; }
li#nav05 a:hover { background-position: -688px -40px; }
li#nav01on a { background-position: 0 0px; }
li#nav02on a { background-position: -172px 0px; }
li#nav03on a { background-position: -344px 0px; }
li#nav04on a { background-position: -516px 0px; }
li#nav05on a { background-position: -688px 0px; }

/* Wrapper
------------------------------------------*/
#wrapper {
margin:0 auto;
width:100%;
background-color:#fff;
}
#wrapper_inner {
margin:0 auto;
width:900px;
}
#wrap_main {
margin:0 auto;
text-align: left;
width:860px;
background-color:#fff;
padding-top:20px;
padding-bottom:50px;
}
#wrap_left {
float:left;
width:200px;
}
#wrap_right {
float:right;
width:600px;
}


/* Home Links
------------------------------------------*/
#links {
margin-bottom:30px;
font-size:10px;
}
#links ul { margin-bottom:10px; }
#links ul li { margin-bottom:2px; }


/* Left Menu
------------------------------------------*/
#left_menu { margin-bottom:30px; }
#left_menu ul {
margin-bottom:25px;
}
#left_menu ul li {
display: inline-block;
list-style: none;
width:200px;
border-bottom: #ccc 1px dashed;
}
#left_menu ul li a {
display: inline-block;
width:180px;
padding:10px;
background-color:#fff;
}
#left_menu ul li a:hover {
display: inline-block;
background-color:#fafafa;
}


/* Footer Area
------------------------------------------*/
#footer {
width:860px;
text-align: left;
margin:0 auto;
font-size:10px;
padding-top:20px;
padding-bottom:40px;
color:#999;
}


/* NEWS (List)
------------------------------------------*/
#news_list {
width:600px;
margin-bottom:15px;
}
#news_list h3 {
font-size:14px;
line-height: 24px;
margin-bottom:5px;
}
#news_list #news_sub {
margin-bottom:5px;
}
#news_list #news_sub span {
color:#960;
font-weight:bold;
}
#news_list #news_sub a:link,
#news_list #news_sub a:visited { color: #888888; text-decoration: none; }
#news_list #news_sub a:hover { color: #888888; text-decoration: underline; }
#readmore a {
display:block;
width:120px;
height:24px;
text-indent: -9999px;
overflow:hidden;
background-image: url(../images/readmore.gif);
background-position: 0 -24px;
margin-top:5px;
margin-left:480px;
}
#readmore a:hover { background-position: 0 0; }


/* NEWS (Post)
------------------------------------------*/
h1.newstitle {
font-size:16px;
color:#f90;
margin-bottom:10px;
line-height: 24px;
}
#news_post {
width:600px;
margin-bottom:30px;
}
#news_post #news_sub {
margin-bottom:15px;
}
#news_post #news_sub span {
color:#960;
font-weight:bold;
}


/* NEWS (Pager)
------------------------------------------*/
#pager {
padding:5px;
margin-top:20px;
background-color:#fafafa;
}
#pager_left { width:260px; float: left; }
#pager_right { width:260px; float: right; text-align:right; }

#pager_list { padding-top:30px; }
ul.pager { margin: 0px; padding: 0px; }
ul.pager li { display: inline; float: left; margin-right: 5px; }
ul.pager li span {
display: inline-block;
padding: 2px 8px;
color: #fff;
background-color: #ff9224;
text-decoration: none;
border:#f90 1px solid;
}
ul.pager li a {
display: inline-block;
padding: 2px 8px;
color: #09f;
text-decoration: none;
border:#09f 1px solid;
}
ul.pager li a:hover {
color: #f90;
background-color: #ffe4b1;
text-decoration: none;
border:#f90 1px solid;
}


/*Lesson
------------------------------------------*/
#wschool {
padding:5px;
background-color:#eee;
margin-top:3px;
}
#person {
background:url('../images/person_bg.jpg') no-repeat top center;
}
#person dl {
width:600px;
}
#person dl dt {
float:left;
width:150px;
margin-top:15px;
margin-left:15px;
margin-bottom:30px;
border:1px #eee solid;
}
#person dl dd {
float:right;
margin-top:15px;
margin-right:15px;
width:390px;
margin-bottom:30px;
}


/*Contact
------------------------------------------*/
#campaign {
width:580px;
border:1px #cc9 solid;
background-color:#f7f7c8;
padding:10px;
margin-bottom:20px;
}

#contact_head { margin-bottom:30px; }
#mf_wrapper {
width: 600px;
text-align: left;
margin: 0px auto 0px auto;
}
form#mailform { padding: 0px; }
table.mailform { width: 100%; }
table.mailform tr th,
table.mailform tr td {
text-align: left;
font-weight: normal;
font-size: 12px;
border-top: solid 1px #eee;
padding: 10px;
}
table.mailform tr th { width: 200px; }
table.mailform tr th span {
color: #f00;
font-size: 18px;
font-weight: bold;
}
table.mailform tr td textarea {
border:1px solid #ccc;
width: 100%;
height: 120px;
}
table.mailform tr td .arealooks {
border:1px solid #ccc;
height: 20px;
}
table.mailform tr td hr {
border:1px solid #ccc;
margin-bottom:5px;
}