@charset "euc-jp";

#page{
position:relative;
width:1022px;
margin:0 auto;
text-align:left;
}

#headerArea{
width:1022px;
}

#bodyArea{
clear:both;
width:1022px;
padding:5px 0;
}

.bodyAreaInner{
width:945px;
margin-right:auto;
margin-left:auto;
}

#bodyMainArea{
float:left;
width:716px;
padding-left:0 !important;
}

#bodyMainArea02{
float:left;
width:712px;
padding-left:0 !important;
}

#bodyMainArea #bodyMainAreaSub{
float:left;
width:165px;
}

#bodyMainArea #bodyMainAreaMain{
float:right;
width:546px;
}

#bodyMainArea.withoutBodySub{
float:none !important;
margin-left:auto;
margin-right:auto;
}

#bodySide{
float:left;
width:270px;
padding-right:5px;
}

#bodySide01{
float:left;
clear:both;
width:270px;
padding-right:10px;
}

#bodySide02{
float:left;
clear:both;
width:220px;
padding-right:10px;
}

#bodyContents{
float:right;
width:441px;
}

#bodyContents01{
float:left;
width:431px;
}

#bodyContents02{
float:left;
width:482px;
}

#bodySub{
float:right;
width:300px;
}

#bodySub02{
float:right;
width:300px;
}

#bodyClear{
clear:both;
height:0;
}

#footerArea{
clear:both;
width:1022px;
}

/*popup*/
#popupHeaderArea{
width:716px;
height:51px;
margin:0 12px !important;
background:url(/img/basic/common/mixi_logo_medium001.gif) no-repeat 10px 17px;
}

#popupHeaderArea h1{
text-indent:-9999px;
}

body.popup #bodyMainArea{
float:none;
margin:0 12px !important;
text-align:left;
}

body.popup #footerArea{
width:716px;
margin:0 12px !important;
padding-top:27px;
}

body.popup #footerArea address{
padding-top:12px;
background:url(/img/basic/common/dotline_horizontal002.gif) repeat-x left top;
}


/*topSlider*/
.topSlider{
*position:relative;
z-index:1;
}

.topSlider .bx-wrapper{
margin:0;
border-width:0;
}

.topSlider .bx-wrapper .bx-viewport ul li a{
display:block;
min-width:1022px;
height:0;
padding-top:350px;
overflow:hidden;
background-repeat:no-repeat;
background-position:center 0;
}

.topSlider .bx-controls .bx-pager{
position:absolute;
bottom:-36px;
left:50%;
width:1022px;
margin-left:-511px;
padding:0;
text-align:center;
z-index:10;
}

.topSlider .bx-controls .bx-pager .bx-pager-item{
margin:0 2px;
}

.topSlider .bx-controls .bx-pager .bx-pager-item a{
overflow:hidden;
width:12px;
height:0;
padding-top:12px;
background:url(/img/basic/game/icon_pager002.png) no-repeat 0 0;
}

.topSlider .bx-controls .bx-pager .bx-pager-item a:hover,
.topSlider .bx-controls .bx-pager .bx-pager-item .active{
background-position:0 -12px;
}


/*container*/
#container{
font-family:"¥á¥¤¥ê¥ª",Meiryo,"¥Ò¥é¥®¥Î³Ñ¥´ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"£Í£Ó £Ð¥´¥·¥Ã¥¯","MS PGothic",sans-serif;
}

#container .newBlock .inner{
position:relative;
z-index:1;
margin:0 auto;
padding:40px 0 30px;
width:1022px;
background-color:#fff;
}

#container .newBlock .inner .content{
position:relative;
overflow:hidden;
margin-bottom:10px;
padding:20px;
text-align:left;
}

#container .newBlock .inner .content .image{
float:left;
width:550px;
}

#container .newBlock .inner .content .detail{
float:right;
width:412px;
}

#container .newBlock .inner .content .detail .head{
overflow:hidden;
margin-bottom:10px;
}

#container .newBlock .inner .content .detail .head .flag{
float:left;
margin-right:20px;
width:80px;
height:50px;
background:url(/img/basic/game/icon_banner001.png) no-repeat 0 bottom;
color:#fff;
text-align:center;
font-weight:bold;
font-size:133%;
line-height:40px;
}

#container .newBlock .inner .content .detail .head .flag01{background-color:#ea6153;}
#container .newBlock .inner .content .detail .head .flag02{background-color:#1797ed;}

#container .newBlock .inner .content .detail .head .title02 h2{
margin-bottom:4px;
font-size:133%;
}

#container .newBlock .inner .content .detail .head .title02 h2 a{
color:#333;
text-decoration:none;
font-weight:bold;
}

#container .newBlock .inner .content .detail .head .title02 .category a{
padding:0 8px;
color:#fff;
text-decoration:none;
}

#container .newBlock .inner .content .detail .head .title02 .categoryRpg a{background-color:#4DCAC0;}
#container .newBlock .inner .content .detail .head .title02 .categoryTraining a{background-color:#89B556;}
#container .newBlock .inner .content .detail .head .title02 .categoryCardBattle a{background-color:#3179C1;}
#container .newBlock .inner .content .detail .head .title02 .categorySports a{background-color:#E94E4E;}
#container .newBlock .inner .content .detail .head .title02 .categorySimulation a{background-color:#FC7337;}
#container .newBlock .inner .content .detail .head .title02 .categoryLove a{background-color:#E982B7;}
#container .newBlock .inner .content .detail .head .title02 .categoryEntertainment a{background-color:#518C55;}
#container .newBlock .inner .content .detail .head .title02 .categoryMiniGames a{background-color:#5AAFE8;}
#container .newBlock .inner .content .detail .head .title02 .categoryCommunication a{background-color:#E0B32C;}
#container .newBlock .inner .content .detail .head .title02 .categoryDiacrisis a{background-color:#B268D0;}
#container .newBlock .inner .content .detail .head .title02 .categoryEducation a{background-color:#6A64A6;}
#container .newBlock .inner .content .detail .head .title02 .categoryUtilities a{background-color:#539097;}

#container .newBlock .inner .content .detail p{
font-size:116%;
line-height:24px;
}

#container .newBlock .inner .content .detail .button{
position:absolute;
right:20px;
bottom:20px;
overflow:hidden;
padding:0 2px 2px 0;
}

#container .newBlock .inner .content .detail .button a{
display:block;
float:right;
width:240px;
height:50px;
background-color:#06be88;
-webkit-box-shadow:1px 1px 0 #05855f,2px 2px 0 #05855f;
-moz-box-shadow:1px 1px 0 #05855f,2px 2px 0 #05855f;
-ms-box-shadow:1px 1px 0 #05855f,2px 2px 0 #05855f;
-o-box-shadow:1px 1px 0 #05855f,2px 2px 0 #05855f;
box-shadow:1px 1px 0 #05855f,2px 2px 0 #05855f;
color:#fff;
text-align:center;
text-decoration:none;
font-weight:bold;
font-size:150%;
line-height:50px;
}

#container .newBlock .inner .content .detail .button a span{
padding-right:16px;
background:url(/img/basic/game/icon_button001.png) no-repeat right center;
}

#container .newBlock .inner .more01{
margin-top:20px;
}

#container .newBlock .inner .more01 a{
display:block;
margin:0 auto;
width:518px;
height:72px;
border:4px solid #3399cc;
color:#3399cc;
text-decoration:none;
font-weight:bold;
font-size:200%;
line-height:72px;
}

#container .newBlock .inner .more01 a span{
padding-right:30px;
background:url(/img/basic/game/icon_more001.png) no-repeat right center;
}
