@charset "utf-8";



body{
	font-family: "MS PGothic", sans-serif;
	text-align:center;
	background-color:#fff;
	color:#333;
	margin:0px;
	font-size:14px;
}

.clear{
	clear:both;
}

img{
	border:0;
}

a{
	color:#33c;
	text-decoration:none;
}
a:hover{
	color:#FF3399;
	text-decoration:none;
}
p {
	margin: 0;
}
h1, h2, h3, h4, h5, h6{
	margin:0px;
	padding:0px;
}
#header{
	margin: 0 auto;
	background: url(/img/index/bg_top.gif) no-repeat;
	width: 1048px;
	height: 100px;
	margin-bottom: 15px;

}
#header #headerImage{
	float:left;
	margin-top:5px;
	margin-left:20px;
}

#header h1{
	position:absolute;
	color: #333;
	margin-left: 75px;
	margin-top: 9px;
	font-size:16px;
	float:left;
	z-index:100;
	vertical-align:baseline;
}
#header h1 .point{
   color:#FE3BE5;
}

#toolArea{
	text-align:right;
}

#tool{
	width:1048px;
	margin-top:0px;
}

#tool #typingSearch{
	float:left;
	width:260px;
	margin:0;
	padding-left:40px;
}
#tool #typingSearchInput{
	float:left;
	margin:0px;
	border: 1px solid #617BE3;
	width:150px;
	font-size:14px;
	padding: 5px;
	color: #336;
	background: #fff;

	border-radius: 5px;
	/* Webkit */
	background: -webkit-gradient(linear, left top, left bottom, from(#eee),
		to(#fff) );
	-webkit-border-radius: 5px;
	/* Firefox */
	background: -moz-linear-gradient(top, #eee, #fff);
	-moz-border-radius: 5px;
	/* IE */
	filter: progid :   DXImageTransform.Microsoft.gradient (startColorstr = #ffeeeeee, endColorstr =   #ffffffff );
	zoom: 1;
}

#tool #typingSearch input{
	margin-top:1px;
}
#tool #typingSearch a{
	position:relative;
	display: inline-block;
	width: 76px;
	height: 30px;
	overflow: hidden;
	float:left;
	margin-left:8px;
}
#tool #typingSearch a img{
	display: inline-block;
	position: absolute;
	top: 0;
	left: -450px;
}
#tool #typingSearch a:hover img{
	top: -30px;
}
#tool #menu{
	width:360px;
	margin-right:20px;
	float:right;
}
#tool #menu a{
	position:relative;
	display: inline-block;
	width: 90px;
	height: 30px;
	overflow: hidden;
}
#tool #menu a img{
	display: inline-block;
	position: absolute;
	top: 0;
}
#tool #menu a:hover img{
	top: -30px;
}
#menuTop{
	left: 0px;
}
#menuMake{
	left: -90px;
}
#menuAbout{
	left: -180px;
}
#menuLogin{
	left: -270px;
}
#menuLogout{
	left: -360px;
}
#tool #menu a img#menuBookmark{
	left: -638px;
	top: -125px;
}
#tool #menu a:hover img#menuBookmark{
	top: -155px;
}


#contents{
	text-align:center;
}
#footter{
	font-size:12px;
	margin:20px 0;
	font-family:monospace;
	line-height:150%;
	text-align: center;
}

#mainArea{
	margin:15px auto 0px;
	padding:0px;
	width: 1048px;
	background-color:#fff;
}

#listArea {
	float:left;
	width:728px;
	text-align: left;
	margin-right:20px;
	background-color:#fff;
}
#listArea .box {
	width: 728px;
	margin-bottom: 20px;
}
#listArea h1{
	width: 696px;
	height:32px;
	font-size:23px;
	padding-top:8px;
	padding-left:32px;
	margin-bottom:5px;
}
#listArea .h1Yellow{
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	width: 696px;
	height: 32px;
	background-position: 0 -185px;
	color:#555;
}
#listArea .h1Blue{
	background: url(/img/index/title_blue.gif) no-repeat;
	color:#fff;
}
#listArea .relations{
	margin-top:10px;
}
#listArea .relationTitle{
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	width: 698px;
	height:24px;
	background-position: 0 -225px;
	color:#555;
	padding-top:6px;
	padding-left:30px;
	font-size:18px;
}

.largeMoreButton {
	text-align: right;
}
.largeMoreButton a{
	position:relative;
	display: inline-block;
	width: 144px;
	height: 48px;
	overflow: hidden;
}
.largeMoreButton a img{
	display: inline-block;
	position: absolute;
	left:-300px;
	top: -60px;
}
.largeMoreButton a:hover img{
	left:-444px;
}
.moreButton {
	text-align: right;
}
.moreButton a{
	position:relative;
	display: inline-block;
	width: 104px;
	height: 28px;
	overflow: hidden;
}
.moreButton a img{
	display: inline-block;
	position: absolute;
	left:-588px;
	top: -49px;
}
.moreButton a:hover img{
	top: -77px;
}


.moreButtonYellow {
	text-align: right;
	margin-right:18px;
	margin-bottom:10px;
}
.moreButtonYellow a{
	position:relative;
	display: inline-block;
	width: 87px;
	height: 17px;
	overflow: hidden;
}
.moreButtonYellow a img{
	display: inline-block;
	position: absolute;
	left:-300px;
	top: -156px;
}
.moreButtonYellow a:hover img{
	left: -387px;
}
.toTop a{
	position:relative;
	display: inline-block;
	width: 144px;
	height: 48px;
	overflow: hidden;
}
.toTop a img{
	display: inline-block;
	position: absolute;
	left:-300px;
	top: -108px;
}
.toTop a:hover img{
	left:-444px;
}


#sideArea {
	float:left;
	text-align:left;
	font-size: 14px;
	background-color:#fff;
}
#sideArea ul{
	padding: 0;
	margin: 0;
	margin-top:2px;
	margin-bottom: 2px;
	list-style-type: none;
	list-style-position: outside;
}
#sideArea li{
	padding: 0;
	margin: 0;
	margin-left:3px;
	font-weight:normal;
	line-height:150%;
}
#sideArea li .miniThumbnail{
	margin-right:3px;
	margin-bottom:3px;
}

#sideArea .boxTop{
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	font-size:14px;
	padding:8px 0 0 28px;
	font-weight: bold;
	color: #05f;
	width: 272px;
	height: 22px;
}
#sideArea .titleImage{
	background-position: -300px -325px;
	position:relative;
	padding-left:30px;
	width: 270px;
}
#sideArea .titleImage img{
	position:absolute;
	bottom:5px;
	left:7px;
}
#sideArea .titleIndex{
	background-position: 0 -60px;
}
#sideArea .titlePopular1 {
	background-position: 0 -150px;
}
#sideArea .titlePopular2 {
	background-position: 0 -120px;
}
#sideArea .titleNew {
	background-position: 0 -90px;
}
#sideArea .titleNote {
	background-position: 0 -60px;
}
#sideArea .titleBookmark {
	background-position: 0 -325px;
}
#sideArea .boxBottom {
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	background-position: -300px -175px;
	width:300px;
	height:10px;
	margin-bottom: 15px;
}
#sideArea .box {
	border-left: solid 1px #617BE3;
	border-right: solid 1px #617BE3;
	padding: 3px 5px 2px 3px;
	width: 290px;
}

#sideArea .keywords {
	line-height:170%;
	padding: 0 5px;
}
#sideArea .keyword {
	margin-right:5px;
	text-decoration:underline;
}
#sideArea .keywords .moreButton{
	margin-top:5px;
}

#sideArea .adArea {
	padding-left: 20px;
}




#sideArea .rankingTable {
	width:100%;
	border-collapse: collapse;
    line-height: 23px;
}
#sideArea .rankingTable td{
padding:0;
}
#sideArea .rankingTable .rank{
	text-align:center;
	font-weight:bold;
	font-size:13px;
	color:#666;
	width:32px;
}
#sideArea .rankingTable .rankTop{
	color:#555;
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	width:26px;
	height:23px;
	margin-left:2px;
	padding-top:2px;
}
#sideArea .rankingTable .rank1{
	background-position: -728px -110px;
}
#sideArea .rankingTable .rank2{
	background-position: -728px -133px;
}
#sideArea .rankingTable .rank3{
	background-position: -728px -156px;
}
#sideArea .rankingTable .prize{
	height:23px;
}

#sideArea .rankingTable .word{
	padding-left:6px;
	text-decoration: underline;
}
#sideArea .rankingTable .point{
	text-align:right;
	width:70px;
	display:none;
}


#listArea #keywordList{
	margin-top:20px;
    background-color: #ffd;
    border: solid 2px #fa0;
    border-radius: 20px;
    color: #333;
}
#listArea #keywordList h2{
    border-bottom: solid 2px #fa0;
    background-color: #FAC300;
    border-radius: 18px 18px 0px 0px;
	color:#555;

    font-size: 16px;
    font-weight: bold;
    padding-left: 10px;
    padding-top: 5px;

}

#listArea #keywordList ul{
	float:left;
	width:151px;
	padding-left:30px;
	line-height:150%;
	margin-top:10px;
	margin-bottom:10px;

}
#listArea #keywordList li{
    list-style-type: circle;
}



#footter{
	font-size:12px;
}
#footter a{
	color:#339;
}
#footter a:hover{
	color:#33f;
	text-decoration:underline;
}

.button{
	cursor:pointer;
}


/* エラー系 */
#errorArea{
	margin:0 auto;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	background: #fff;
	padding:20px;
	margin-bottom:20px;
}

#errorMessages{
	text-align:left;
	width: 460px;
	color:#ff3333;
	margin: 10px auto;
	font-size:12px;
	padding:10px;
	background: #ffc;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
}
.errorItem{
	color:#ff3333 !important;
	font-weight:bold !important;
}

.space{
	display:inline-block;
	width:0.5em;
}

/* ページング系 */
.pageControl{
	margin-top:20px;
	text-align:center;
}
.pageControl .pageNo{
	float:left;
	width:30px;
	font-size:20px;
	font-weight:bold;
	padding-top:4px;
	padding-bottom:4px;
	text-decoration:none;
}
.pageControl .pageNoSmall{
	float:left;
	width:40px;
	font-size:18px;
	font-weight:bold;
	padding-top:6px;
	padding-bottom:6px;
	text-decoration:none;
}
.pageControl .currentPage{
	float:left;
	width:30px;
	font-size:20px;
	padding-top:4px;
	padding-bottom:4px;
	font-weight:bold;
	color:#333;
}
.pageControl .currentPageSmall{
	float:left;
	width:40px;
	font-size:18px;
	padding-top:6px;
	padding-bottom:6px;
	font-weight:bold;
	color:#333;
}
.pageControl .box {
	margin:0 auto;
}
.pageControl .prevButton {
	margin-right:3px;
	width:52px;
	float:left;
}
.pageControl .nextButton {
	margin-left:3px;
	width:52px;
	float:left;
}
.pageControl .paginatorPrevButton{
	position:relative;
	display: inline-block;
	width: 32px;
	height: 32px;
	overflow: hidden;
}
.pageControl .paginatorPrevButton img{
	position: absolute;
	left:-526px;
	top: -17px;
}
.pageControl .paginatorPrevButton:hover img{
	left:-558px;
}
.pageControl .paginatorNextButton{
	position:relative;
	display: inline-block;
	width: 32px;
	height: 32px;
	overflow: hidden;
}
.pageControl .paginatorNextButton img{
	position: absolute;
	left:-622px;
	top: -17px;
}
.pageControl .paginatorNextButton:hover img{
	left:-654px;
}
.pageControl .paginatorDisabledPrevButton{
	display: inline-block;
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	width: 32px;
	height: 32px;
	background-position: -590px -17px;
}
.pageControl .paginatorDisabledNextButton{
	display: inline-block;
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	width: 32px;
	height: 32px;
	background-position: -686px -17px;
}


/* アイコン */
#listArea .title .iconRound{
	margin:0px 5px 1px 2px;
}

.logoutBox {
	background-color: #fff;
	width: 300px;
	padding: 20px;
	margin:0 auto;
	border-radius: 20px;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	margin-bottom: 20px;
}


/* ソーシャルボタン */
#twitterSocialButton {
	width:60px;
	padding-right:4px;
}
#socialButtons {
	width:300px;
	margin-bottom:10px;
}
#socialButtons .socialButton {
	float: left;
	margin-right: 5px;
}
#googleSocialButton {
}
/* 広告 */
.prLabel{
	padding:2px;
	padding-left:5px;
}
#sideArea .pr {
	margin-bottom: 15px;
}
.prDammy{
	text-align:center;
}
.prDammy p{
	background-color:#e6e6fa;
	font-size:24px;
	color:#4169e1;
	margin:0 auto;
}

#header #loginUser{
	height:30px;
	margin-bottom:20px;
}
#header #loginUserMain{
	float:right;
	text-align:left;
	height:30px;
	background: #fff;
	padding: 0px;
}
#header #loginUserLeft{
	float:right;
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	height: 30px;
	width: 10px;
	background-position: -588px -105px;
}
#header #loginUserRight{
	float:right;
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	height: 30px;
	width: 10px;
	margin-right:20px;
	background-position: -598px -105px;
}


#header #loginUser .image{
	float:left;
	margin-right:10px;
	margin-top:2px;
}
#header #loginUser .image img{
	width:24px;
	height:24px;
}
#header #loginUser .userInfo{
	float:left;
	padding-top:5px;
}
#header #loginUser .userInfo .name a{
	font-size:13px;
}
#header #loginUser .userInfo .name a:hover{
	text-decoration:underline;
}




/**
 * ユーザー入力全般
 *
 * For UserControllerAbstract
 */
.userInputArea{
	text-align:left;
	color:#333;
	margin: 10px auto;
	font-size:12px;
/*	border:1px solid #617BE3;*/
	background-color: #CFE3FA;
	padding: 10px;
	border-radius: 20px;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	line-height:150%;
}
.userInputArea .formTitle{
	display:inline;
    border-radius: 5px;
    color: #0055FF;
    padding: 5px;
    margin-right:2px;
    font-weight:bold;
    font-size: 14px;

}
.userInputArea .userInputBox{
	background-color: #FFF;
	padding: 10px;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	margin: 10px;
}
.userInputArea .title{
	font-size:16px;
	font-weight:bold;
	color:#003399;
}
.userInputArea label{
	font-size:12px;
}
.userInputArea .detail{
	margin-top:5px;
	margin-left:10px;
}
.userInputArea .note{
	font-size:12px;
}
.userInputTable .note a{
	color:#009900;
	font-weight:bold;
}
.userInputArea .explain strong{
	color:#617BE3;
}
.userInputArea .submitDiv{
	margin-left:50px;
	margin-top:15px;
	margin-bottom:15px;
}
.userInputTable{
	margin-bottom:5px;
}
.userInputTable th{
	border: 1px solid #5B9FFF;
	color: #0055FF;
	background-color: #CFE3FA;
	border-radius: 5px;
	padding:5px;
}
.userInputTable td{
	padding:3px 0;
	vertical-align:middle;
}
.userInputTable .note{
	font-size:12px;
	color:#6666ff;
	padding-left:10px;
}
.userInputTable .leftNote{
	font-size:12px;
	color:#6666ff;
	padding-left:2px;
}
.userInputTable .textareaTd textarea{
	float:left;
}
.userInputTable .textareaTd .note{
	float:left;
	margin-top:7px;
}
.userInputTable .submitTd{
	padding-top:10px;
}

.userInputTable td.subTitleTd {
	border: 1px solid #5B9FFF;
	background-color: #E6F0FB;
	border-radius: 5px;
	width:100px;
}
.userInputTable td.subTitleTd div{
	padding-left:8px;
}
.userInputTable td.subTitleTh{
	color: #0055FF;
	padding-left:7px;
}
.radiusFormText {
	border: 1px solid #5B9FFF;
	font-size:14px;
	padding: 5px;
	color: #336;
	background: #fff;
	overflow:hidden;

	border-radius: 5px;
	/* Webkit */
	background: -webkit-gradient(linear, left top, left bottom, from(#eee),
		to(#fff) );
	-webkit-border-radius: 5px;
	-webkit-box-shadow: 1px 1px 1px #ddf;
	/* Firefox */
	background: -moz-linear-gradient(top, #eee, #fff);
	-moz-border-radius: 5px;
	-moz-box-shadow: 1px 1px 1px #ddf;
	/* IE */
	filter: progid :   DXImageTransform.Microsoft.gradient (startColorstr = #ffeeeeee, endColorstr =   #ffffffff );
	zoom: 1;
}
.userInputArea .disabled{
	background:#ddd !important;
	border: 1px solid #666;
}

.userInputArea .submit, .userInputSubmit{
	border: 1px solid #5B9FFF;
	padding: 5px 15px;
	color: #036;
	font-weight: bold;
	cursor: pointer;
	background: #CFE3FA;
	border-radius: 5px;
	background-image: url("/img/index/btn_bk_submit.gif");
	zoom: 1;
}
.userInputArea .submit:hover, .userInputSubmit:hover{
	border: 1px solid #FF3399;
	color: #933;
	background-image: url("/img/index/btn_bk_submit_hover.gif");
}
.userInputArea .submit:disabled, .userInputSubmit:disabled{
    border: 1px solid #999 !important;
    background: #eee !important;
    color: #999 !important;
}


/**
 * サインイン
 *
 * For UserControllerAbstract
 */
#loginArea{
	text-align:left;
	width: 700px;
	color:#333;
	margin: 10px auto;
	font-size:12px;
	background-color: #CFE3FA;
	padding: 10px;
	border-radius: 20px;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	line-height:150%;
}
#loginArea .login{
	background-color: #FFF;
	padding: 10px;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	margin: 10px;
	float:left;
	width: 300px;
}
#loginArea .loginTwitter .options{
	margin-top:5px;
}
#loginArea .loginFacebook .options{
	margin-top:5px;
}
#loginArea .saveUser{
	vertical-align:bottom;
	margin-top:2px;
	margin-right:3px;
}
#loginArea .logout{
	background-color: #FFF;
	padding: 10px;
	border-radius: 20px;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	margin: 10px;
	text-align:center;
}
#loginArea .regist{
	background-color: #FFF;
	padding: 10px;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	margin: 10px;
	float:left;
	width: 310px;
}
#loginArea .regist .title{
	color:#FF3399;
}
#loginArea .loginTwitter{
	margin-top:20px;
}
#loginArea .loginTwitter .button{
	margin-top:5px;
	margin-bottom:5px;
}
#loginArea .loginFacebook{
	margin-top:20px;
}
#loginArea .loginFacebook .button{
	margin-top:5px;
	margin-bottom:5px;
}
#loginArea .regist .registMail{
	padding:10px 0;
	text-align:center;
}
#loginArea .forgetPass{
	margin-top:10px;
	text-align:center;
}
#loginArea em{
	font-style:normal;
	color: #009900;
	font-weight: bold;
}
#loginArea .note{
	color: #FF3399;
	font-size: 12px;
	margin: 5px;
}

#messageArea{
	width: 480px;
	margin:20px auto;
	text-align:left;
}
#messageArea strong {
	color: #f33;
}
#listArea #messageArea{
	width: 480px;
	text-align:left;
	margin: 0px;
	margin-left: 10px;
	margin-bottom: 20px;
}
#messageArea .title{
	font-size:16px;
	font-weight:bold;
	color:#003399;
}
#messageArea .detail{
	background: url(/img/index/hiyoko_blue_mini.gif) no-repeat;
	background-color: #FFF;
	font-size:14px;
	margin-top:5px;
	padding-left:30px;
	line-height:150%;
	min-height:32px;
}
#messageArea .detail .additionalInfo{
	margin:10px;
}
.box .boxDetail{
	margin-left:10px;
}

.userThumbnail{
	width:48px;
	height:48px;
}

.reviewRate .rateStar{
	display: inline-block;
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	width: 18px;
	height: 17px;
}
.reviewRate .rateStar0{
	background-position: -526px 0;
}
.reviewRate .rateStar1{
	background-position: -544px 0;
}
.reviewRate .rateStar2{
	background-position: -562px 0;
}
.reviewRate .rateStar3{
	background-position: -580px 0;
}
.reviewRate .rateStar4{
	background-position: -598px 0;
}
.reviewRate .rateStar5{
	background-position: -616px 0;
}
.reviewRate .rateStar6{
	background-position: -634px 0;
}
.reviewRate .rateStar7{
	background-position: -652px 0;
}
.reviewRate .rateStar8{
	background-position: -670px 0;
}
.reviewRate .rateStar9{
	background-position: -688px 0;
}
.reviewRate .rateStar10{
	background-position: -706px 0;
}
.reviewRate .rateNumber{
	padding-left:3px;
	font-size:14px;
	position:relative;
	bottom:3px;

}
.reviewRateOne{
	display: inline-block;
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	width: 18px;
	height: 17px;
	background-position: -706px 0;
	vertical-align:middle;
	position:relative;
	overflow: hidden;
	top:-3px;
	margin-right:3px;
}

#listArea .message{
	margin:10px 0px 30px 10px;
}

#listArea .gameListTable{
	font-size:12px;
	line-height:150%;
}
#listArea .gameListTable td{
	vertical-align:top;
	padding:3px;
}
#listArea .gameListTable h2{
	font-size:16px;
	font-weight:bold;
	margin:0;
	padding:0;
	margin-bottom:2px;
}
#listArea .gameListTable .gameInfo{
	width:260px;
}
#listArea .gameListTable .gameSpecialty{
	margin-top:2px;
}
#listArea .gameListTable .gameInfo .label{
	margin-right:4px;
	margin-bottom:1px;
}
#listArea .gameListTable .gameSpecialty .label{
	margin-left:4px;
	margin-bottom:4px;
}
/*
#listArea .gameListTable .gameInfo .miniRankingButton{
	vertical-align:middle;
	margin-bottom:1px;
}
*/
.miniRankingButton{
	vertical-align:middle;
	margin-bottom:1px;
	position:relative;
	display: inline-block;
	width: 18px;
	height: 18px;
	overflow: hidden;
}
.miniRankingButton img{
	position: absolute;
	left:-692px;
	top: -85px;
}
.miniRankingButton:hover img{
	left:-710px;
}

.pr728x90_top{
	margin-bottom:15px;
}
.pr728x90_middle{
	margin-top:15px;
	margin-bottom:15px;
}

a.tagName{
	background-color: #6699FF;
	border-radius: 5px;
	color: #fff;
	font-size: 14px;
	padding: 3px 5px;
}
a.tagName:hover{
	background-color: #FF3388;
	border-radius: 5px;
	color: #fff;
	font-size: 14px;
	padding: 3px 5px;
}
a.relationTagName{
	background-color: #49C185;
	border-radius: 5px;
	color: #fff;
	font-size: 14px;
	padding: 3px 5px;
}
a.relationTagName:hover{
	background-color: #FF3388;
	border-radius: 5px;
	color: #fff;
	font-size: 14px;
	padding: 3px 5px;
}
.selectedTagName{
	background-color: #999999;
	border-radius: 5px;
	color: #fff;
	font-size: 14px;
	padding: 3px 5px;
}
.tagNames .textButton{
	font-weight:normal;
	padding: 3px 5px 2px  5px;
	font-size: 12px;
}

.label{
	vertical-align:middle;
}
.miniThumbnail{
	width:20px;
	height:20px;
	vertical-align:middle;
}
.middleThumbnail{
	width:40px;
	height:40px;
	vertical-align:middle;
}
.textButton{
	background-image:url("/img/index/btn_bk_white.gif");
	background-repeat: repeat-x;
	background-color: #C6D0DC;
	border:1px solid #617BE3;
	color: #003366;

	border-radius: 5px;
	font-size: 12px;
	padding: 3px 5px;
	font-weight:bold;

	cursor:pointer;
}

.textButton:hover, .textButtonGray:hover{
	background-image:url("/img/index/btn_bk_pink.gif");
	background-repeat: repeat-x;
	background-color: #FF3388;
	border:1px solid #f00;
	color: #fff;
}

.textButtonGray{
	background-color: #eee;
	border:1px solid #666;
	color: #666;

	border-radius: 5px;
	font-size: 12px;
	padding: 3px 5px;
	font-weight:bold;

	cursor:pointer;
}
.textButtonDisabled{
	background-color: #eee;
	border:1px solid #666;
	color: #666;

	border-radius: 5px;
	font-size: 12px;
	padding: 3px 5px;
	font-weight:bold;
}


.mark{
	vertical-align:middle;
	margin-right:4px;
	position:relative;
	top: -3px;
	display: inline-block;
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	width: 18px;
	height: 18px;
}
.markBlue{
	background-position: -692px -49px;
}
.markLightBlue{
	background-position: -692px -67px;
}
.markPink{
	background-position: -710px -49px;
}
.markYellow{
	background-position: -710px -67px;
}

.markLarge{
	vertical-align:middle;
	margin-right:4px;
	position:relative;
	top: -3px;
	display: inline-block;
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	width: 29px;
	height: 29px;
}
.markLargeBlue{
	background-position: -609px -125px;
}
.markLargeLightBlue{
	background-position: -609px -154px;
}
.markMiddle{
	vertical-align:middle;
	margin-right:4px;
	position:relative;
	top: -3px;
	display: inline-block;
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	width: 22px;
	height: 22px;
}
.markMiddleBlueStar{
	background-position: -728px 0px;
}
.markMiddleRedStar{
	background-position: -728px -22px;
}
.markMiddleOrangeStar{
	background-position: -728px -44px;
}
.markMiddleGreenStar{
	background-position: -728px -66px;
}
.markMiddleLightBlueStar{
	background-position: -728px -88px;
}
.titleMiddle{
	font-size: 20px;
	font-weight: bold;
	color: #fff;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	line-height: 150%;
	padding-left:10px;
}
.backGroundBlue{
	background-color: #617BE3;
}
.backGroundRed{
	background-color: #ff578b;
}
.backGroundOrange{
	background-color: #ffad45;
}
.backGroundGreen{
	background-color: #67dc6d;
}
.backGroundLightBlue{
	background-color: #57b9ff;
}
/* サイドエリアを左に持ってくる場合 #content あたりで .contentLeft を加える */
.contentLeft #listArea{
	margin-left:20px;
	margin-right:0px;
	float:right;
}
.contentLeft #sideArea{
	float:right;
}
#linkToSp{
	text-align:center;
	padding-bottom:25px;
	width: 1048px;
	margin:0px auto;
}
#linkToSp a{
	display:block;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	background-color: #5B9FFF;
	background: -webkit-gradient(linear, left top, left bottom, from(#ccccff), to(#5B9FFF));
	width: 1028px;
	margin:15px auto;
	font-size: 64px;
	font-weight: bold;
	line-height: 150%;
	text-shadow: -1px -1px 0 rgba(150, 150, 150, 0.3);
	padding-top: 10px;
	padding-bottom: 10px;
	text-align: center;
	color: #fff;
	text-decoration: none;

}
#linkToSp a:hover{
	color: #fff;
	text-decoration: underline;
}

.banner300{
	margin-bottom:15px;
}
.banner300 a{
	position:relative;
	display: inline-block;
	width: 300px;
	height: 80px;
	overflow: hidden;
}
.banner300 a img{
	position: absolute;
	left: 0;
}
.banner300 a:hover img{
	left: -300px;
}

#pleaseJoin a img{
	top: -80px;
}
#pleaseJoin2 a img{
	top: -160px;
}

#campaignBanner a img{
	top: 0;
}

#lineStickerBanner a img{
	top: -240px;
}

#importantMessage{
	border:double 5px #f9c;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	margin:10px auto 20px auto;
	background-color: #ffeff9;
	width: 1038px;
	font-size: 18px;
	font-weight: bold;
	line-height: 150%;
	padding-top: 10px;
	padding-bottom: 10px;
	text-align: center;
	color: #333;
	text-decoration: none;
	display:block;
}
#importantMessage .entry{
	color:#f00;
}
#attentionMessage{
	margin:10px auto 20px auto;
	width: 1038px;
	font-size: 14px;
	line-height: 150%;
	text-align: center;
	color: #333;
	text-decoration: none;
	display:block;
}
#attentionMessage .entry{
	color:#009;
}

.layerBackground{
	position:fixed;
	width:100%;
	height:100%;
	left:0;
	top:0;
	background:rgba(255,255,255,0.6);
	z-index:100;
	text-align:center;
}
.layerBox{
	background-color: #F0F8FF;
	border: 1px solid #5B9FFF;
	border-radius: 10px;
	box-shadow: 1px 1px 1px #DDDDFF;
	padding: 10px;
	margin:0px auto;
	margin-top:120px;
	width: 640px;
}

/**
 * LabelSprite
 */
.labelSprite{
	display: inline-block;
	background: url(/img/index/label_sprite.png?v=37) no-repeat;
	vertical-align:middle;
	margin:0px 3px 3px;
}
.labelComposer{
	width: 40px;
	height: 16px;
	background-position: 0 0;
}
.labelWriter{
	width: 40px;
	height: 16px;
	background-position: -40px 0;
}
.labelSinger{
	width: 40px;
	height: 16px;
	background-position: -80px 0;
}
.labelSong{
	width: 40px;
	height: 16px;
	background-position: -120px 0;
}
.labelNew{
	width: 40px;
	height: 16px;
	background-position: -203px -16px;
}
.labelTopLevel{
	width: 75px;
	height: 16px;
	background-position: 0 -16px;
}
.labelRank{
	width: 53px;
	height: 16px;
	background-position: -75px -16px;
}
.labelPlay{
	width: 75px;
	height: 16px;
	background-position: -128px -16px;
}
.labelUrl{
	width: 60px;
	height: 18px;
	background-position: 0 -32px;
}
.labelTag{
	width: 57px;
	height: 18px;
	background-position: -60px -32px;
}
.labelRelationTag{
	width: 82px;
	height: 18px;
	background-position: 0 -118px;
}
.labelNarrowTag{
	width: 82px;
	height: 18px;
	background-position: -82px -118px;
}
.labelAdvice{
	width: 57px;
	height: 18px;
	background-position: -117px -32px;
}
.labelGameRank{
	width: 57px;
	height: 18px;
	background-position: -174px -32px;
}
.labelOwner{
	width: 70px;
	height: 18px;
	background-position: 0 -50px;
}
.labelMusic{
	width: 82px;
	height: 18px;
	background-position: -70px -50px;
}
.labelGamePlay{
	width: 82px;
	height: 18px;
	background-position: -152px -50px;
}
.labelWord{
	width: 64px;
	height: 16px;
	background-position: -160px 0;
}
.labelGameBookmark{
	width: 93px;
	height: 18px;
	background-position: 0 -68px;
}
.labelDifficulty{
	width: 72px;
	height: 18px;
	background-position: -93px -68px;
}
.labelGameView{
	width: 82px;
	height: 18px;
	background-position: -165px -68px;
}
.labelBookmark{
	width: 86px;
	height: 16px;
	background-position: -120px -86px;
}
.labelView{
	width: 75px;
	height: 16px;
	background-position: -160px -102px;
}
.gameListTable .labelSong{
	margin-bottom:2px;
}
#marks{
	text-align:center;
}
#jasracMark{
	text-align:center;
	width:160px;
	margin:0 auto;
}
#jasracMark #jasracBanner{
	background: url(/img/index/index_sprite2.png) no-repeat;
	width: 64px;
	height: 64px;
	background-position: 0 -404px;
	margin:0 auto;
}
#jasracMark #jasracPermissionNo{
	margin-top:2px;
	font-size:10px;
}

.doublePr300x250_bottom{
	width:620px;
	text-align:center;
	margin:0 auto;
}
.doublePr300x250_bottom .pr300x250_bottom{
	float:left;
	width:300px;
	margin-left:10px;
}
.difficultyMeter{
	position:relative;
	top:3px;
}
.difficultyMeter .meter{
	display: inline-block;
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	width: 18px;
	height: 13px;
}
.difficultyMeter .v0{
	background-position: -728px -179px;
}
.difficultyMeter .v1{
	background-position: -728px -192px;
}
.difficultyMeter .v2{
	background-position: -728px -205px;
}
.difficultyMeter .v3{
	background-position: -728px -218px;
}
.difficultyMeter .v4{
	background-position: -728px -231px;
}
.difficultyMeter .v5{
	background-position: -728px -244px;
}
.difficultyMeter .v6{
	background-position: -728px -257px;
}
.difficultyMeter .v7{
	background-position: -728px -270px;
}
.difficultyMeter .v8{
	background-position: -728px -283px;
}
.difficultyMeter .v9{
	background-position: -728px -296px;
}
.difficultyMeter .v10{
	background-position: -728px -309px;
}
.difficultyMeter .key2{
	position:relative;
	left:-2px;
}
.difficultyMeter .key3{
	position:relative;
	left:-4px;
}
.difficultyMeter .key4{
	position:relative;
	left:-6px;
}
.difficultyMeter .key5{
	position:relative;
	left:-8px;
}
.difficultyMeter .number{
	position:relative;
	left:-4px;
	bottom:2px;
}
.labelQsp1{
	width: 40px;
	height: 16px;
	background-position: 0 -86px;
}
.labelQsp2{
	width: 40px;
	height: 16px;
	background-position: -40px -86px;
}
.labelQsp3{
	width: 40px;
	height: 16px;
	background-position: -80px -86px;
}
.labelCsp1{
	width: 40px;
	height: 16px;
	background-position: 0 -102px;
}
.labelCsp2{
	width: 40px;
	height: 16px;
	background-position: -40px -102px;
}
.labelCsp3{
	width: 40px;
	height: 16px;
	background-position: -80px -102px;
}
.labelCsp4{
	width: 40px;
	height: 16px;
	background-position: -120px -102px;
}
.gameSpecialty .labelSprite{
	margin:0;
	margin-right:3px;
}

#difficultyBanners a{
	position:relative;
	display: inline-block;
	width: 142px;
	height: 40px;
	overflow: hidden;
	margin-left:4px;

}
#difficultyBanners a:first-child{
	margin-left:1px;
}
#difficultyBanners img{
	position: absolute;
	left: -600px;
	top:0;
}
#difficultyBanners .easy{
	top:-40px;
}
#difficultyBanners .normal{
	top:-80px;
}
#difficultyBanners .hard{
	top:-120px;
}
#difficultyBanners .veryHard{
	top:-160px;
}
#difficultyBanners img:hover{
	left: -742px !important;
}
#difficultyBanners{
	margin-bottom:15px;
}
#difficultyBanners h2{
	font-size:14px;
}

#parentGame {
	text-align: left;
	margin: 5px;
	background-color: #EEEEFF;
	border: 1px solid #617BE3;
	border-radius: 10px;
	line-height: 150%;
	padding: 10px;
	padding-top:10px;
	text-align: left;
	position:relative;
}
#parentGame .parentGameThumbnail {
	float:left;
	margin-left:0px;
}
#parentGame .parentGameThumbnail img{
	border-radius: 10px;
	border: 1px solid #617BE3;
	width:160px;
	height:160px;
}
#parentGame .parentGameInfo {
	float:left;
	margin-left:10px;
	width:520px;
}
#parentGame .parentGameInfo .detail{
	margin-bottom:35px;
}
#parentGame .parentGameInfoTail {
	font-size: 14px;
	line-height: 100%;
	text-align: right;
	margin:10px 5px 10px 0;
	position:absolute;
	width:525px;
	bottom:10px;
}
.gameListTable .newUpdateDate{
	color:#f69;
	font-weight:bold;
	font-size: 12px;
	font-family:monospace;
	line-height: 120%;
}
.gameListTable .newPickupDate{
	color:#f69;
	font-weight:bold;
	font-size: 12px;
	font-family:monospace;
	line-height: 120%;
}

#questionnaireRight .title{
	margin:5px 3px 10px;
	font-weight:bold;
	color:#339;
}
#questionnaireRight .choice{
	background-color: #fff;
	border-top: 1px solid #5B9FFF;
	margin:0;
	padding:3px 5px;
	cursor:pointer;
}
#questionnaireRight .choiceList{
	border-bottom: 1px solid #5B9FFF;
	margin:0 10px;
}
#questionnaireRight .choice.selected{
	background-color:#fde;
}
#questionnaireRight.disabled .choice{
	color:#666;
	cursor:auto;
}
#questionnaireRight.disabled .comment{
	border: 1px solid #999;
}
#questionnaireRight .choiceControl{
	text-align:right;
	margin:5px 5px 0 5px;
}
#questionnaireRight .commentArea{
	margin-bottom:5px;
}
#questionnaireRight .choiceControl .label{
    color: #0055FF;
    font-weight: bold;
    display: inline-block;
    position: relative;
    top: -2px;
    font-size:12px;
}
#questionnaireRight .choiceControl .comment{
	width:180px;
}

#sideArea .boxTopNavy{
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	font-size:14px;
	padding:8px 0 0 28px;
	font-weight: bold;
	color: #33f;
	width: 272px;
	height: 22px;
}
#sideArea .titleQuestionnaire {
	background-position: 0 -355px;
}
#sideArea .boxBottomNavy {
	background: url(/img/index/menu_sprite.png?v=47) no-repeat;
	background-position: -300px -355px;
	width:300px;
	height:10px;
	margin-bottom: 15px;
}
#sideArea .boxNavy {
	border-left: solid 1px #617bE3;
	border-right: solid 1px #617bE3;
	padding: 3px 5px 2px 3px;
	width: 290px;
}
#sideArea .choiceControl .note{
	font-size:12px;
	color:#6666ff;
	line-height: 150%;
	margin:0;
}