@charset UTF-8;

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

    [ index ] 2011.6.22
    
****************************************** */

/* ******************************************
    01. ファミリーネットトップ改訂　2011.7.1以降
****************************************** */
#fn-menu-2011 {
width: 152px;
font-size: 12px;
line-height: 1.2;
}

#fn-menu-2011 a {
padding: 2px;
text-decoration: none;
display: block;
}

/* メニューフレーム設定 */
#menu-magazine,
#menu-site,
#menu-series,
#menu-learning,
#menu-other {
border-radius: 2px; /* CSS3草案 */
-webkit-border-radius: 2px; /* Safari,Google Chrome用 */
-moz-border-radius: 2px; /* Firefox用 */
background-color: #fff;
border: solid 1px #cfcfcf;
margin-bottom: 10px;
}

/* メニューリスト基本設定 */
#fn-menu-2011 ul {
padding: 8px 0 6px;
}

#fn-menu-2011 li {
padding: 0 0 2px 14px;
}

/* ジャンルメニュー */
#menu-genre {
margin-bottom: 6px;
}

#menu-genre ul {
padding: 0;
}

#menu-genre li {
width: 152px;
height: 38px;
padding: 0;
margin-bottom: 4px;
}

#menu-genre li a {
width: 152px;
height: 38px;
padding: 0;
text-indent: -9999px;
display: block;
}

#menu-genre li a:hover {
background-position: bottom;
}

li#m-parents a {
background: transparent url(../img/common/left_menu/btn_parents.gif) 0 0 no-repeat;
}

li#m-kids a {
background: transparent url(../img/common/left_menu/btn_kids.gif) 0 0 no-repeat;
}

li#m-teachers a {
background: transparent url(../img/common/left_menu/btn_teacher.gif) 0 0 no-repeat;
}

/* 雑誌メニュー */
#menu-magazine h3 {
width: 150px;
height: 31px;
background: transparent url(../img/common/left_menu/title_magazine.gif) 0 0 no-repeat;
text-indent: -9999px;
}

#menu-magazine li {
background: transparent url(../img/common/left_menu/mark_magazine.png) 6px 6px no-repeat;
}

#menu-magazine li a {
color: #c41934;
}

#menu-magazine li a:hover {
color: #e66a7e;
background-color: #fff1f3;
}

/* 主要サイトメニュー */
#menu-site ul {
padding: 8px 6px 6px;
}

#menu-site li {
font-size: 10px;
color: #666;
padding: 0 0 8px;
margin-bottom: 8px;
text-align: center;
border-bottom: solid 1px #cfcfcf;
}

#menu-site li a {
text-indent: -9999px;
padding: 0;
margin-bottom: 4px;
}

#menu-site li a:hover {
background-position: bottom;
}

li#m-fch a {
width: 138px;
height: 45px;
background: transparent url(../img/common/left_menu/btn_fch.gif) 0 0 no-repeat;
}

li#m-edu a {
width: 138px;
height: 48px;
background: transparent url(../img/common/left_menu/btn_edu.gif) 0 0 no-repeat;
}

li#m-dakko a {
width: 138px;
height: 28px;
background: transparent url(../img/common/left_menu/btn_dakko.gif) 0 0 no-repeat;
}

li#m-netkun a {
width: 138px;
height: 43px;
background: transparent url(../img/common/left_menu/btn_netkun.gif) 0 0 no-repeat;
}

li#m-odekake a {
width: 138px;
height: 15px;
background: transparent url(../img/common/left_menu/btn_odekake.gif) 0 0 no-repeat;
}

li#m-hotmama a {
width: 138px;
height: 18px;
background: transparent url(../img/common/left_menu/btn_hotmama.gif) 0 0 no-repeat;
}

li#m-hoiku a {
width: 138px;
height: 30px;
background: transparent url(../img/common/left_menu/btn_hoiku.gif) 0 0 no-repeat;
}

li#m-kyogi a {
width: 138px;
height: 24px;
background: transparent url(../img/common/left_menu/btn_kyogi.gif) 0 0 no-repeat;
}

/* 特集・連載メニュー */
#menu-series h3 {
width: 150px;
height: 31px;
background: transparent url(../img/common/left_menu/title_series.gif) 0 0 no-repeat;
text-indent: -9999px;
}

#menu-series li {
background: transparent url(../img/common/left_menu/mark_series.png) 6px 6px no-repeat;
}

#menu-series li a {
color: #106fb9;
}

#menu-series li a:hover {
color: #4f9fdc;
background-color: #edf7ff;
}

/* 学習メニュー */
#menu-learning h3 {
width: 150px;
height: 31px;
background: transparent url(../img/common/left_menu/title_learning.gif) 0 0 no-repeat;
text-indent: -9999px;
}

#menu-learning li {
background: transparent url(../img/common/left_menu/mark_learning.png) 6px 6px no-repeat;
}

#menu-learning li a {
color: #408a13;
}

#menu-learning li a:hover {
color: #6fb643;
background-color: #f1ffe8;
}

/* その他メニュー */
#menu-other li {
background: transparent url(../img/common/left_menu/mark_other.png) 6px 6px no-repeat;
}

#menu-other li a {
color: #d92da2;
}

#menu-other li a:hover {
color: #ee66c3;
background-color: #fff0fa;
}


