@charset "utf-8";

/* ----- clearfix ----- */
#wordMain,
#wordMain ul,
.indexList,
.pageTop,
.categoryIndex ul,
#top #ranking .hd,
#top #ranking .favRankList,
.cf{ /zoom : 1; }
#wordMain:after,
#wordMain ul:after,
.indexList:after,
.pageTop:after,
.categoryIndex ul:after,
#top #ranking .hd:after,
#top #ranking .favRankList:after,
.cf:after{content:''; display:block; clear:both;}

/* ----- top ----- */
#top h2{
width:230px;
height:20px;
background-repeat:no-repeat;
text-indent:-9999px;
line-height:20px;
}
.animal #top h2{background-image:url(../img/animal/topAnimal.png);}
.plant  #top h2{background-image:url(../img/plant/topPlant.png);}
.astro  #top h2{background-image:url(../img/astro/topAstro.png);}
.pet    #top h2{background-image:url(../img/pet/topPet.png);}
.food   #top h2{background-image:url(../img/food/topFood.png);}
.job    #top h2{background-image:url(../img/job/topJob.png);}


/* wordIndex */
#wordNavi,#wordNavi li,#wordNavi li span,#wordIndex .wordNaviMin a, #wordNaviClose span{
background-image:url(../img/wordAll.png);
background-repeat:no-repeat;
}
#wordNavi .none,#wordNavi .none span,#wordIndex .wordNaviMin, #wordNaviClose{
background-image:url(../img/wordAll2.png);
background-repeat:no-repeat;
}
#wordMain li span,#wordMain li a,.indexList li a{
background-image:url(../img/topBtn.png)\9;
background-repeat:no-repeat;
}
#wordIndex{
margin:0 0 30px;
}
#wordIndex h2{
background-position:left -60px;
margin-bottom:8px;
}
#wordNavi{
background-position:0 -90px;
height:80px;
display:none;
}
.wNaviOn #wordNavi{
display:block;
height:166px;
margin-bottom:-86px;
}
#wordIndex .wordNaviMin, #wordNaviClose{margin-bottom:0;}
#wordNavi li{
float:left;
margin-right:3px;
}
#wordNavi li span{
display:block;
width:92px;
height:75px;
text-indent:-9999px;
overflow:hidden;
cursor:pointer;
}
#wordNavi .cur,#wordNavi .none span{
cursor:default;
}
#wordNavi .wNavi10{
margin-right:0;
}
#wordNavi .wNavi1{padding-bottom:5px;background-color:#006;background-position:left -10px;}
#wordNavi .wNavi10{padding-bottom:5px;background-color:#006;background-position:-95px -10px;}
#wordIndex .wordNaviMin .wNavi1,#wordIndex .wordNaviMin .wNavi10{padding-bottom:0;}
.wNavi1 span ,.wNavi1 a{background-position:  left 0px;}
.wNavi2 span ,.wNavi2 a{background-position: -95px 0px;}
.wNavi3 span ,.wNavi3 a{background-position:-190px 0px;}
.wNavi4 span ,.wNavi4 a{background-position:-285px 0px;}
.wNavi5 span ,.wNavi5 a{background-position:-380px 0px;}
.wNavi6 span ,.wNavi6 a{background-position:-475px 0px;}
.wNavi7 span ,.wNavi7 a{background-position:-570px 0px;}
.wNavi8 span ,.wNavi8 a{background-position:-665px 0px;}
.wNavi9 span ,.wNavi9 a{background-position:-760px 0px;}
.wNavi10 span,.wNavi10 a{background-position:-855px 0px;}
#wordIndex #wordNavi .cur,#wordIndex #wordNavi .cur span, #wordNaviClose .none span{background:none;}

#wordMain{
padding:5px 0 0 9px;
}
*+html #wordMain{padding:15px 0 0 9px;}
#wordMain ul{
clear:both;
margin-bottom:9px;
}
#wordMain .cont1,#wordMain .cont2{
float:left;
width:430px;
}
.wNaviOn #wordMain .cont1,.wNaviOn #wordMain .cont2{
float:none;
}
.wNaviOn #wordMain ul{
display:none;
}
.wNaviOn #wordMain ul, x:-moz-any-link{
margin-top:-10px;
}
.wNaviOn #wordMain .wDispOn{
display:block;
}
#wordMain li{
width:70px;
height:70px;
float:left;
margin-right:7px;
}
#wordMain li a,#wordMain li span{
display:block;
width:70px;
height:70px;
line-height:70px;
font-size:30px;
text-align:center;
}
#wordMain li a{
background-position:-710px -50px;
text-decoration:none;
color:#ffffff;
}
#wordMain li a:visited{color:#ffffff;}
#wordMain li span{
background-position:-780px -50px;
color:#a0a0a0;
}

#wordIndex .wordNaviMin, #wordNaviClose{
height:85px;
}
#wordIndex .wordNaviMin li, #wordNaviClose li{
float:left;
margin-right:3px;
}
#wordIndex .wordNaviMin li,#wordIndex .wordNaviMin li a, #wordNaviClose li, #wordNaviClose li span{
display:block;
width:92px;
height:85px;
text-indent:-9999px;
overflow:hidden;
}
#wordNaviClose li span{cursor:pointer;}
#wordNaviClose .none span{cursor:default;}




/* categoryIndex */
.pet #category1 h2{background-position:left -60px;}
#category1 h2,.pet #category2 h2{background-position:left -80px;}
#category2 h2,.pet #category3 h2{background-position:left -100px;}
#category3 h2,.pet #category4 h2{background-position:left -120px;}
#category4 h2,.pet #category5 h2{background-position:left -140px;}
.pet #category6 h2{background-position:left -160px;}
.categoryIndex .hd,.categoryIndex .cont,.categoryIndex .indexList,ul.classIndex{
background-image:url(../img/cmnPanel.png)\9;
}
.categoryIndex{
margin:5px 0 0;
clear:both;
}
#category1{
margin:0;
}
.categoryIndex .hd{
background-position:-1900px -10px;
background-repeat:no-repeat;
height:35px\9;
}
:root *> .categoryIndex .hd{
height:auto;
}
.categoryIndex .cont{
background-position:left top;
background-repeat:repeat-y;
}
:root *> .categoryIndex .cont{
margin-top:8px;
width:946px;
padding:8px 0 10px;
}
.indexImg{
width:930px;
text-align:center;
margin:0 0 1px 8px;
}
:root *> .indexImg{
margin:0 0 6px 8px;
}
.astro .indexImg{
/*background-color:#000;*/
}
.indexCopy{
padding:2px 10px 0;
font-size:80%;
color:#666;
text-align:center;
}
:root *> .indexCopy{margin:-5px 0 5px;}
.indexList{
background-position:-950px bottom;
background-repeat:no-repeat;
/*padding:0 0 13px 10px\9;*/
padding-left:10px;
padding-bottom:13px\9;
clear:both;
}
:root *> .indexList{
/*padding:0 0 0 10px;*/
padding-bottom:0;
margin-top:-5px;
}
.indexList li{
margin:6px 7px 0 0;
float:left;
}
.indexList li a{
display:block;
width:216px;
height:50px;
padding:0 5px;
text-align:center;
text-decoration:none;
font-size:18px;
line-height:50px;
color:#ffffff;
background-position:-304px 0px;
}
.indexList li a:visited{color:#ffffff;}

.astro #category1 .indexList li a,
.job #category2 .indexList li a{
width:294px;background-position:0px 0px;}
.astro #category2 .indexList li a,
.food #category2 .indexList li a{
width:170px;background-position:-530px 0px;}
.animal #category3 .indexList li a{
width:138px;background-position:-710px 0px;}
.animal #category3 .indexList{padding-left:12px;}
/*.astro #category3 .indexList li a,*/
.job #category2 .indexList li a{font-size:16px;}

:root *> .indexList li a,
:root *> #wordMain li a,
:root *> #wordMain li span{
border-radius:5px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
box-shadow:0px 1px 0px #c6c0bf;
-moz-box-shadow:0px 1px 0px #c6c0bf;
-webkit-box-shadow:0px 1px 0px #c6c0bf;
}
:root *> #contents #top .indexList li a,
:root *> #wordMain li a{
background:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9ImcxODciIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiM2MDRCNDIiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiM2MDRCNDIiIG9mZnNldD0iMC40OTkiLz48c3RvcCBzdG9wLWNvbG9yPSIjNTAzQjMyIiBvZmZzZXQ9IjAuNSIvPjxzdG9wIHN0b3AtY29sb3I9IiM1MDNCMzIiIG9mZnNldD0iMSIvPgo8L2xpbmVhckdyYWRpZW50Pgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2cxODcpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(top,#604B42,#604B42 49.9%,#503B32 50%,#503B32);
background: -webkit-gradient(linear,left top,left bottom,from(#604B42),color-stop(0.499, #604B42),color-stop(0.5, #503B32),to(#503B32));
}
:root *> #wordMain li span{
background:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9ImczMDIiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNFMUUxRTEiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNFMUUxRTEiIG9mZnNldD0iMC40OTkiLz48c3RvcCBzdG9wLWNvbG9yPSIjREREREREIiBvZmZzZXQ9IjAuNSIvPjxzdG9wIHN0b3AtY29sb3I9IiNEREREREQiIG9mZnNldD0iMSIvPgo8L2xpbmVhckdyYWRpZW50Pgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2czMDIpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(top,#e1e1e1,#e1e1e1 49.9%,#dddddd 50%,#dddddd);
background: -webkit-gradient(linear,left top,left bottom,from(#e1e1e1),color-stop(0.499, #e1e1e1),color-stop(0.5, #dddddd),to(#dddddd));
}
.pageTop{
font-size:80%;
padding-right:10px;
margin-top:-4px\9;
}
:root *> .pageTop{
margin-top:0;
}
.pageTop a{
display:block;
float:right;
color:#76554d;
background:url(../img/pageTop.png);
/*padding:7px 0 0;*/
line-height:35px;
width:125px;
/*height:28px;*/
text-align:center;
}
:root *> .pageTop a{
background:#e6e1d3;
background: -moz-linear-gradient(top,#cbc5b7,#e6e1d3 10%,#e6e1d3);
background: -webkit-gradient(linear,left top,left bottom,from(#cbc5b7),color-stop(0.1, #e6e1d3),to(#e6e1d3));
/*padding:5px 10px;*/
padding:0 10px;
width:auto;
height:auto;
border-radius:0 0 5px 5px;
-webkit-border-radius:0 0 5px 5px;
-moz-border-radius:0 0 5px 5px;
}

/* panel */
ul.classIndex{
background-position:-950px bottom;
background-repeat:no-repeat;
padding:0 0 11px\9;
}
:root *> ul.classIndex{
padding:0 0 0 1px;
margin-bottom:-7px;
}
.classIndex li{
float:left;
margin:0 0 4px 4px;
padding:0 2px 2px 0\9;
background:url(../img/indexZukanBg.png) no-repeat left top\9;
}
:root *> .classIndex li{
background:none;
margin:0 0 6px 6px;
padding:0;
box-shadow:1px 1px 2px rgba(0,0,0,0.3);
-moz-box-shadow:1px 1px 2px rgba(0,0,0,0.3);
-webkit-box-shadow:1px 1px 2px rgba(0,0,0,0.3);
}
.classIndex li a{
display:block;
width:150px;
height:150px;
text-indent:-9999px;
overflow:hidden;
}
.animal .classIndex li a{background-image:url(../img/animal/panel_animal.jpg);}
.plant .classIndex li a{background-image:url(../img/plant/panel_plant.jpg);}
.pet .classIndex li a{background-image:url(../img/pet/panel_pet1.jpg);}
.pet #category5 .classIndex li a,.pet #category6 .classIndex li a{background-image:url(../img/pet/panel_pet2.jpg);}
.food .classIndex li a{background-image:url(../img/food/panel_food.jpg);}
.job .classIndex li a{background-image:url(../img/job/panel_job.jpg);}
.animal .classIndex .birds a,.plant .classIndex .summer a,.food .classIndex .seafood a,.job .classIndex .art-expression a,.pet #category1 .classIndex .medium a,.pet #category5 .classIndex .cat a{background-position:-150px 0;}
.animal .classIndex .reptiles a,.plant .classIndex .autumn a,.food .classIndex .meat a,.job .classIndex .sports-play a,.pet #category1 .classIndex .large a,.pet #category5 .classIndex .monkey a{background-position:-300px 0;}
.animal .classIndex .amphibians a,.plant .classIndex .winter a,.food .classIndex .grain a,.job .classIndex .trip-foreign a,.pet #category2 .classIndex .small a,.pet #category5 .classIndex .crustacea a{background-position:-450px 0;}
.plant .classIndex .etc a,.food .classIndex .dairy a,.job .classIndex .life-society a,.pet #category2 .classIndex .medium a,.pet #category5 .classIndex .rat a{background-position:-600px 0;}
.pet #category2 .classIndex .large a,.pet #category5 .classIndex .rabbit a{background-position:-750px 0;}
.animal .classIndex .fish a,.pet #category3 .classIndex .goldfish a,.pet #category5 .classIndex .frog a{background-position:0 -150px;}
.animal .classIndex .insect a,.pet #category3 .classIndex .tropicalfish a,.pet #category5 .classIndex .lizard a{background-position:-150px -150px;}
.animal .classIndex .invertebrate a,.pet #category4 .classIndex .parrot a,.pet #category5 .classIndex .turtle a{background-position:-300px -150px;}
.animal .classIndex .protist a,.pet #category4 .classIndex .finch a,.pet #category5 .classIndex .mole a{background-position:-450px -150px;}
.pet #category4 .classIndex .raptores a,.pet #category5 .classIndex .kangaroo a{background-position:-600px -150px;}
.pet #category4 .classIndex .etc a,.pet #category5 .classIndex .cow a{background-position:-750px -150px;}
.pet #category6 .classIndex .wbeetle a{background-position:0 -300px;}
.pet #category6 .classIndex .jbeetle a{background-position:-150px -300px;}
.pet #category6 .classIndex .wstagbeetle a{background-position:-300px -300px;}
.pet #category6 .classIndex .jstagbeetle a{background-position:-450px -300px;}
.pet #category6 .classIndex .flowerbeetle a{background-position:-600px -300px;}

/* pet */
.pet .categoryIndex .hd,.pet .categoryIndex .cont,.pet .categoryIndex .wordIndexMin{
background-image:url(../img/topPanelPet.png)\9;
}
.pet .categoryIndex h3,.pet .wordIndexMin ul,.pet .wordIndexMin li a{
background-image:url(../img/wordPet.png);
background-repeat:no-repeat;
overflow:hidden;
}
.pet .categoryIndex .hd{background-position:-1900px bottom;}
.pet .categoryIndex .cont{
}
:root *> .pet .categoryIndex .cont{
margin:8px 0 0 3px;
width:943px;
}
.pet .categoryIndex h3{
width:160px;
height:33px;
text-indent:-9999px;
clear:both;
}
:root *> .pet .categoryIndex h3{
position:relative;
left:-3px;
}
.pet .classIndex h3{background-position:0 0;}
.pet .classIndex ul{
margin-bottom:9px;
padding-left:1px;
}
:root *> .pet .classIndex ul{
position:relative;
left:-1px;
}
.pet .wordIndexMin{
background-position:-950px bottom;
background-repeat:no-repeat;
padding:0 0 13px\9;
}
*root *> .pet .wordIndexMin{
padding:0;
}
.pet .wordIndexMin h3{background-position:-160px 0;}
.pet .wordIndexMin ul{
background-position:left -115px;
margin-left:13px;
}
:root *> .pet .wordIndexMin ul{
position:relative;
left:-3px;
}
.pet .wordIndexMin li{
width:86px;
height:80px;
float:left;
margin-right:7px;
}
.pet .wordIndexMin li.none{
text-indent:-9999px;
}
.pet .wordIndexMin li a{
display:block;
width:86px;
height:80px;
text-indent:-9999px;
}
.pet .wNavi1 a{background-position:  left -35px;}
.pet .wNavi2 a{background-position: -93px -35px;}
.pet .wNavi3 a{background-position:-186px -35px;}
.pet .wNavi4 a{background-position:-279px -35px;}
.pet .wNavi5 a{background-position:-372px -35px;}
.pet .wNavi6 a{background-position:-465px -35px;}
.pet .wNavi7 a{background-position:-558px -35px;}
.pet .wNavi8 a{background-position:-651px -35px;}
.pet .wNavi9 a{background-position:-744px -35px;}
.pet .wNavi10 a{background-position:-837px -35px;}



/* ranking */
#top #ranking,#top #ranking .hd,#top #ranking .favRankList{
background-image:url(../img/rankingPanel.png)\9;
}
#top #ranking{
background-position:left top;
background-repeat:repeat-y;
margin:12px 0 10px;
position:relative;
}
:root *> #top #ranking{
margin:12px 3px 33px 3px;
}
#top #ranking .hd{
background-position:-950px top;
background-repeat:no-repeat;
height:58px;
}
:root *> #top #ranking .hd{
background:url(../img/bgAll.png) repeat-x left -163px;
}
#top #ranking h2{
background-position:0 0;
height:58px;
float:left;
}
:root *> #ranking h2{
margin:-3px 0 0 -3px;
}
#top #ranking .favRankUpdate{
position:absolute;
right:10px;
top:20px;
font-size:80%;
}
#top #ranking .favRankList{
clear:both;
background-position:-1900px bottom;
background-repeat:no-repeat;
padding-left:4px\9;
}
:root *>#top #ranking .favRankList{
padding-left:2px;
}
#top #ranking li{
float:left;
}
#top #ranking dl{
width:182px;
padding-left:5px;
position:relative;
_top:58px;
}
#top #ranking .rank{
text-indent:-9999px;
width:36px;
height:36px;
position:absolute;
top:185px;
}
#top #ranking dd{
line-height:1.5;
}
#top #ranking img{
border:1px solid #e6e1d5;
width:180px;
height:180px;
}
#top #ranking .ttl{
font-size:78%;
margin-top:3px;
padding:0 1px 5px 40px;
min-height:36px;
height:auto !important;
height:36px;
}
#ranking .jsoff{
font-size:85%;
padding:20px 10px;
}
#ranking .jsoff .txtB{
font-weight:bold;
margin-bottom:10px;
}
#ranking .favRankError{
font-size:85%;
padding:20px 10px 30px;
font-weight:bold;
text-align:center;
}


:root *> .categoryIndex .cont,
:root *> #top #ranking{
background:#ffffff;
border-radius:5px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
box-shadow:1px 1px 3px rgba(83,72,64,0.2);
-moz-box-shadow:1px 1px 3px rgba(83,72,64,0.2);
-webkit-box-shadow:1px 1px 3px rgba(83,72,64,0.2);
}

@media only screen and (-webkit-min-device-pixel-ratio: 2){
.animal #top h2{background-image:url(../img/animal/topAnimal_2x.png);}
.plant  #top h2{background-image:url(../img/plant/topPlant_2x.png);}
.astro  #top h2{background-image:url(../img/astro/topAstro_2x.png);}
.pet    #top h2{background-image:url(../img/pet/topPet_2x.png);}
.food   #top h2{background-image:url(../img/food/topFood_2x.png);}
.job    #top h2{background-image:url(../img/job/topJob_2x.png);}
.animal #top h2,.astro  #top h2{
-moz-background-size:230px 140px;
-webkit-background-size:230px 140px;
background-size:230px 140px;
}
.plant #top h2,.food #top h2,.job #top h2{
-moz-background-size:230px 120px;
-webkit-background-size:230px 120px;
background-size:230px 120px;
}
.pet #top h2{
-moz-background-size:230px 180px;
-webkit-background-size:230px 180px;
background-size:230px 180px;
}
#wordNavi,#wordNavi li,#wordNavi li span,#wordIndex .wordNaviMin a, #wordNaviClose span{
background-image:url(../img/wordAll_2x.png);
-moz-background-size:950px 260px;
-webkit-background-size:950px 260px;
background-size:950px 260px;
}
#wordNavi .none,#wordNavi .none span,#wordIndex .wordNaviMin, #wordNaviClose{
background-image:url(../img/wordAll2_2x.png);
-moz-background-size:950px 90px;
-webkit-background-size:950px 90px;
background-size:950px 90px;
}
.plant .classIndex li a{background-image:url(../img/plant/panel_plant_2x.jpg);}
.food .classIndex li a{background-image:url(../img/food/panel_food_2x.jpg);}
.job .classIndex li a{background-image:url(../img/job/panel_job_2x.jpg);}
.plant .classIndex li a,.food .classIndex li a,.job .classIndex li a{
-moz-background-size:750px 150px;
-webkit-background-size:750px 150px;
background-size:750px 150px;
}
.animal .classIndex li a{
background-image:url(../img/animal/panel_animal_2x.jpg);
-moz-background-size:600px 300px;
-webkit-background-size:600px 300px;
background-size:600px 300px;
}
.pet .classIndex li a{
background-image:url(../img/pet/panel_pet1_x2.jpg);
-moz-background-size:900px 300px;
-webkit-background-size:900px 300px;
background-size:900px 300px;
}
.pet #category5 .classIndex li a,.pet #category6 .classIndex li a{
background-image:url(../img/pet/panel_pet2_x2.jpg);
-moz-background-size:900px 450px;
-webkit-background-size:900px 450px;
background-size:900px 450px;
}


/* pet */
.pet .categoryIndex h3,.pet .wordIndexMin ul,.pet .wordIndexMin li a{
background-image:url(../img/wordPet_2x.png);
-moz-background-size:930px 195px;
-webkit-background-size:930px 195px;
background-size:930px 195px;
}
:root *> #top #ranking .hd{
background-image:url(../img/bgAll_2x.png);
-moz-background-size:12px 240px;
-webkit-background-size:12px 240px;
background-size:12px 240px;
}
}