@charset "utf-8";

/* sprite */
div.main-body ul.btn-list li input.login,
div.main-body ul.btn-list li input.send,
div.main-body ul.btn-list-02 li input.signup,
div.main-body ul.btn-list-02 li input.back,
div#member a,
div#ballon,
div#box-text-center div#box-btn a#btn-shop,
div#box-text-center div#box-btn a#btn-star,
div.main-body ul.btn-list li input.next,
form#mail-form input[type="submit"],
#UserLoginForm .submit,
input#btn-check{
	background: url(../img/signup/sprite_signup.png) no-repeat;
}

/* main-body */
div.main-body{
	margin: 0 65px 20px;
}

	div.main-body p.info-02{
		margin-bottom: 20px;
		text-align: center;
	}

/* form */
div.main-body table.input-form{
	width: 100%;
	margin-bottom: 30px;
}

	div.main-body table.input-form th{
		width: 180px;
		padding: 5px 0 10px 20px;
		background: url(../img/signup/icon_circle_a.gif) no-repeat;
		background-position: 0 10px;
		color: #888;
		font-weight: normal;
	}

	/*div.main-body table.input-form td{
		padding: 5px 0 10px;
	}*/

	div.main-body table.input-form td select,
	div.main-body table.input-form td input{
		border: 1px solid #dddddd;
		width: 100%;
		margin: 5px 0 0 0;
	}

	div.main-body table.input-form td input[type="checkbox"]{
		width: auto;
		margin: 8px 0 0 0;
	}

	div.main-body ul.btn-list,
	div.main-body ul.btn-list-02{
		text-align: center;
		margin: 0 auto 15px;
	}

	div.main-body ul.btn-list{
		width: 130px;
	}

	div.main-body ul.btn-list-02{
		width: 240px;
	}

	div.main-body ul.btn-list li input,
	div.main-body ul.btn-list-02 li input{
		height: 24px;
		width: 130px;
		display: block;
		border: none;
		text-indent: -9999px;
		cursor: pointer;
	}

	div.main-body ul.btn-list,
	div.main-body ul.btn-list-02{
		text-align: center;
		margin: 10px auto;
		overflow: hidden;
		zoom: 1;
	}

	div.main-body ul.btn-list-02 li{
		float: left;
		width: 110px;
	}

	div.main-body ul.btn-list li input.login{background-position: -323px 0 !important;}
	div.main-body ul.btn-list li input.login:hover{background-position: -323px -24px !important;}

	div.main-body ul.btn-list li input.send{background-position: -130px -412px !important;}
	div.main-body ul.btn-list li input.send:hover{background-position: -130px -436px !important;}

	div.main-body ul.btn-list-02 li input.signup{background-position: -479px -84px !important;}
	div.main-body ul.btn-list-02 li input.signup:hover{background-position: -479px -108px !important;}

	div.main-body ul.btn-list-02 li input.back{background-position: -213px 0 !important;}
	div.main-body ul.btn-list-02 li input.back:hover{background-position: -213px -24px !important;}

div.main-body .links{
	display: block;
	margin-bottom: 20px;
}

div#member{
	margin: 0 0 50px;
}

div#member a{
	display: block;
	width: 550px;
	height: 56px;
	background-position: 0 -300px !important;
	text-indent: -9999px;
	margin: 0 auto;
}

div#member a:hover{
	background-position: 0 -356px !important;
}

/* スター購入系ページ */
div#box-f .inner{
	width: 642px;
	margin: 0 auto 30px;
	overflow: hidden;
}

img#logo{
	margin-bottom: 10px;
}

img#flow{
	margin-bottom: 30px;
}

h4{
	margin-bottom: 20px;
	padding: 7px 0 0 20px;
	height: 25px;
	background: url(../img/signup/bg_h4.gif) repeat-x;
	color: #ff2b66;
	font-weight: bold;
}
	fieldset h4 {
		line-height: 1.5;
	}

p.box-message{
	margin: 0 30px 20px;
}

div#box-text-left{
	float: left;
	margin-left: 30px;
	width: 378px;
}
	div#box-text-left .radio-area{
		padding: 20px;
		border: 1px solid #dddddd;
		line-height: 1.6;
	}
		div#box-text-left .radio-area input{
			margin: 2px 10px 0 0;
		}
		div#box-text-left .radio-area .footnote{
			color: #777;
			font-size: 11px;
			margin-top: 5px;
		}

div#box-text-left .btn-confirm{
	margin-top: 20px;
	margin-left: 102px;
	border: none;
	cursor: pointer;
}
	div#box-text-left .btn-confirm:hover{
		opacity: 0.7;
		filter: alpha( opacity=70 );
	}

div#ballon{
	float: right;
	width: 203px;
	height: 261px;
	background-position: 0 0 no-repeat;
}

	div#ballon p{
		margin: 19px 20px;
		color: #777;
	}

div#box-text-center ul{
	padding: 20px;
	margin: 0 30px 20px;
	border: 1px solid #dddddd;
	line-height: 2.0;
}

	div#box-text-center ul li span{
		margin-right: 20px;
		color: #777;
		font-weight: bold;
	}

div#box-text-center div#box-btn{
	width: 372px;
	margin: 0 auto;
	overflow: hidden;
}

	div#box-text-center div#box-btn a#btn-shop{
		width: 176px;
		height: 42px;
		display: block;
		float: left;
		margin-right: 20px;
		text-indent: -9999px;
		background-position: -503px 0 !important;
	}

	div#box-text-center div#box-btn a#btn-shop:hover{
		background-position: -503px -42px !important;
	}

	div#box-text-center div#box-btn a#btn-star{
		width: 176px;
		height: 42px;
		display: block;
		float: right;
		text-indent: -9999px;
		background-position: -479px -132px !important;
	}

	div#box-text-center div#box-btn a#btn-star:hover{
		background-position:  -479px -174px !important;
	}

input#btn-buy-webmoney-id,
input#btn-buy-credit-id{
	border: none;
	cursor: pointer;
	width: 276px;
	margin: 0 auto 8px;
	display: block;
}

input#btn-buy-webmoney-id:hover,
input#btn-buy-credit-id:hover{
	background-position: -203px -174px !important;
}

input#btn-buy-webmoney-id:hover,
input#btn-buy-credit-id:hover{
	opacity: 0.7;
	filter: alpha( opacity=70 );
}

span#sending{
	display: block;
	color: #ff2b66;
	text-align: center;
}

span#supple{
	display: block;
	color: #777;
	text-align: center;
}

/* docomo */
form#mail-form{
	vertical-align: top;
}

form#mail-form input[type="text"]{
	border: 1px solid #ddd;
}

form#mail-form input[type="submit"]{
	border: none;
	width: 50px;
	height: 21px;
	display: inline-block;
	background-position: -453px 0 !important;
	text-indent: -9999px;
	cursor: pointer;
}

form#mail-form input[type="submit"]:hover{
	background-position: -453px -21px !important;
}

input#btn-check{
	display: block;
	margin-top: 20px;
	margin-left: 102px;
	width: 176px;
	height: 42px;
	background-position: -203px -216px !important;
	text-indent: -9999px;
	overflow: hidden;
	border: none;
	cursor: pointer;
}

input#btn-check:hover{
	background-position: -203px -258px !important;
}

img#qrCode{
	display: block;
	margin: 0 auto 17px;
}

div#box-text-center p{
	margin: 0 30px;
}

form#mail-form{
	text-align: center;
	font-size: 15px;
	margin-top: 20px;
}

input#HiddenMailaddress {
	border: 1px solid #dddddd;
	vertical-align: middle;
	border-radius: 5px;
	padding: 5px;
}

form#HiddenOrderForm {
	margin-top: 20px;
	*width: 300px;
   *margin: 35px auto;
}

form#HiddenOrderForm input#HiddenMailaddress {
		border: 1px solid #ddd;
		padding: 5px;
		border-radius: 5px;
	}
	form#HiddenOrderForm div.input.text{
		display: inline-block;
		*float: left;
		*margin-right: 10px;
	}
	form#HiddenOrderForm span{
		display: inline-block;
		*display: block;
		*float: left;
		*margin-right: 10px;
	}
	form#HiddenOrderForm div.submit{
		display: inline-block;
		border: none;
		cursor: pointer;
	}
		form#HiddenOrderForm div.submit:hover {
			opacity: 0.7;
			filter: alpha( opacity=70 );
		}

p.box-message.docomo {
	text-align: center;
}


/* error message */
.inner > .error-message {
	margin: 0 auto 20px;
	text-align: center;
}

	.error-message {
		color: #ff6f97;
		margin: 6px 0 15px 177px;
		line-height: 1.3;
	}

/* logout */
p.finish{
	text-align: center;
	font-weight: bold;
	margin: 50px 0 10px 0;
}

	p.finish{
		text-align: center;
		font-weight: bold;
		margin: 50px 0 10px 0;
	}

	p.finish.space{
		margin: 10px 0 500px 0;
	}


/* 会員登録ページ */
p.notice{
	margin: 0 0 20px;
	text-align: left;
	line-height: 1.3;
}

.img-sample{
	width: 442px;
	margin: 0 auto;
}

.notice b,
.notice-list b{
	color: #fe8c9a;
}

#flow-regi{
	width: 512px;
	display: block;
	margin: 0 auto 30px;
}

/* 登録フォーム */
div.main-body table.input-form td p.caption{
	color: #888;
	font-size: 90%;
}

	div.main-body table.input-form tr.birth select,
	div.main-body table.input-form tr.birth input{
		width: auto;
	}

	div.main-body table.input-form tr.sex td{
		width: 193px;
		border: 1px solid #dddddd;
		vertical-align: middle;
		padding: 5px;
		text-align: center;
	}

	div.main-body table.input-form tr.sex td input{
		width: auto;
		border: none;
	}

	div.main-body table.input-form td p.caption-02{
		color: #f52525;
		font-size: 90%;
	}

	div.main-body table.input-form td dl dt{
		clear: both;
		width: 100px;
		float: left;
		padding: 3px 0;
		color: #888;
	}

	div.main-body table.input-form td dl dd select,
	div.main-body table.input-form td dl dd input{
		width: 295px;
	}

div.main-body div.box-purpose{
	margin-bottom: 25px;
	display: block;
	line-height: 1.5;
}

div.main-body textarea.box-rules{
	width: 490px;
	height: 150px;
	display: block;
	border: 1px solid #dddddd;
	padding: 10px;
}

div.main-body span.red{
	color: #ff6f97;
	display: block;
	margin: 10px 0 15px;
	text-align: center;
}

	div.main-body span.text-01{
		display: block;
		text-align: center;
		font-weight: bold;
		margin-bottom: 10px;
	}

div.main-body ul.rules{
	text-align: center;
	margin: 10px auto;
}

	div.main-body ul.rules li{
		display: inline;
		margin: 0 10px;
}

div.main-body .agreement-area{
	background: #f5f5f5;
	padding: 20px 0;
	text-align: center;
}

div.main-body ul.btn-list li input.next{background-position: -379px -216px !important;}
div.main-body ul.btn-list li input.next:hover{background-position: -379px -240px !important;}


div.main-body fieldset input[type="radio"]{
	margin-right: 5px;
}

div.main-body fieldset > fieldset{
	position: relative;
	*margin-left: -7px;
}

div.main-body fieldset > fieldset > input[type="radio"],
span.female,
span.male{
	*position: absolute;
}

	/* 性別 */
	input#UserProfileGender2{*top:3px;*left:178px}
	input#UserProfileGender1{*top:3px;*left:238px}
	span.female{*top:2px;*left:200px}
	span.male{*top:2px;*left:261px}

div.main-body label{
	margin-right: 10px;
}

/* 登録フォームエラー */
ul.error li {
	width: 550px;
	height: 64px;
	display: block;
	background: url(../img/common/bg_error_w550.gif) no-repeat;
	margin: 0 auto 30px;
}

ul.error li span {
	color: #ffffff;
	line-height: 75px;
	background: url(../img/common/icon_error.gif) no-repeat;
	background-position: 0 center;
	padding-left: 26px;
	display: inline-block;
	margin-left: 40px;
}

/* 確認する */
div.main-body div.submit {
	width: 110px;
	margin: 40px auto 0;
}
div.main-body div.submit:hover {
	opacity: 0.7;
	filter: alpha( opacity=70 );
}

/* lopgin */
#UserLoginForm fieldset{
	width: 100%;
	margin-bottom: 30px;
}

	#UserLoginForm .input{
		margin-bottom: 20px;
	}

	#UserLoginForm .input label{
		width: 180px;
		float: left;
	}

	#UserLoginForm .input input{
		border: 1px solid #dddddd;
	}

	#UserLoginForm .input input[type="checkbox"]{
		*border: none;
		*position: absolute;
	}

	#UserLoginForm .input input#UserEmail,
	#UserLoginForm .input input#UserPassword{
		width: 230px;
	}

	div.input.email.required,
	div.input.password.required,
	div.input.checkbox{
		background: none !important;
	}

	#UserLoginForm .submit{
		height: 24px;
		width: 130px;
		margin: 0 auto;
		display: block;
		border: none;
		cursor: pointer;
		background-position: -323px 0 !important;
	}

	#UserLoginForm .submit:hover{
		background-position: -323px -24px !important;
	}

	#UserLoginForm .submit input {
		width: 130px;
		height: 24px;
		background: none;
		border: none;
		cursor: pointer;
		color: #ffffff;
		font-weight: bold;
	}

/* 利用規約 */
div.box-rules {
	height: 200px;
	overflow-y: scroll;
	margin-bottom: 40px;
	border: 1px solid #dddddd;
	padding: 15px 20px;
	line-height: 1.5;
}

/* 登録フォーム */
div.input {
	margin-bottom: 20px;
}

div.input label {
	background: url(../img/common/icon_list.gif) no-repeat;
	background-position: 0 7px;
	padding: 2px 0 0 20px;
	color: #888888;
	display: inline-block;
	width: 145px;
	*width: auto;
}

div.input.password.required,
div.input.text.required,
div.input.select.required{
	margin-bottom: 5px;
	*margin-bottom: 20px;
}

p.caption {
	margin: 0 0 20px 177px;
	line-height: 1.5;
	color: #888888;
	clear: both;
	font-size: 90%;
}

label.birth {
	display: inline-block;
	clear: both;
	margin-bottom: 25px;
}

fieldset fieldset legend {
	float: left;
	margin-right: 10px;
}

label.birth,
fieldset fieldset legend {
	color: #888888;
	width: 150px;
	background: url(../img/common/icon_list.gif) no-repeat;
	background-position: 0 4px;
	padding-left: 17px;
}

label.birth {
	margin-right: 4px !important;
}

fieldset fieldset label{
	color: #888888;
}

input#UserEmail,
input#UserPassword,
input#UserPasswordConfirm,
input#UserUsername,
input#UserNickname,
input#UserSecretAnswer{
	width: 315px;
	border: 1px solid #ddd;
	height: 15px;
	vertical-align: baseline;
	*vertical-align: middle;
	border-radius: 5px;
	padding: 5px;
}

input#UserPasswordConfirm {
	margin-bottom: 20px;
	*margin-bottom: 0;
}

select#UserProfileBirthdayYear,
select#UserProfileBirthdayMonth,
select#UserProfileBirthdayDay,
select#UserSecretQuestionId{
	margin: 0 5px;
	border: 1px solid #ddd;
	vertical-align: top;
}

select#UserSecretQuestionId,
select#UserProfileBirthdayYear {
	margin-left: 0;
}

fieldset > div{
	clear: both;
}

/* 確認 */
div.main-body dl{
	margin-left: 50px;
}

div.main-body dt{
	float: left;
	width: 180px;
}

dt, dd{
	margin-bottom: 15px;
	color: #888888;
}

dd{
	display: list-item;
	list-style-image: url(../img/profile/list_style.gif)
}

/* ログイン画面 */
form#UserLoginForm {
	width: 460px;
	margin: 0 auto 10px;
}

/* ログイン画面エラーメッセージ */
div.message-area {
	width: 453px;
	height: 64px;
	display: block;
	background: url(../img/common/bg_error.gif) no-repeat;
	margin: 0 auto 30px;
	text-align: center;
}

div.message-area.without{
	display: none;
}

div#authMessage {
	color: #ffffff;
	line-height: 75px;
	background: url(../img/common/icon_error.gif) no-repeat;
	background-position: 0 center;
	padding-left: 26px;
	display: inline-block;
	*display: inline;
	*zoom: 1;
}

/* #kisekae  */
section#kisekae {
	position: relative;
	height: 220px;
	margin: 0 0 40px;
}

div#box-f h3{
	background: none;
	height: auto;
	color: #ff5696;
	font-size: 17px;
	width: auto;
}

section#kisekae p {
	position: relative;
	z-index: 1;
	font-size: 12px;
	line-height: 1.75;
}

section#kisekae .chara-all {
	width: 358px;
	height: 96px;
	display: block;
	position: absolute;
	top: 120px;
	left: 0;
	z-index: 1;
	background: url(../img/top_logout/sprite_top_logout.png) no-repeat;
	background-size: 704px 1145px;
	background-position: 0 -282px;
}

section#kisekae .kokedama {
	width: 186px;
	height: 146px;
	display: block;
	position: absolute;
	top: 11px;
	left: 381px;
	background: url(../img/top_logout/sprite_top_logout.png) no-repeat;
	background-position: -313px -425px;
	background-size: 605px 985px;
}

/* no-regi */
section#no-regi {
	margin: 0 0 40px;
}

section#no-regi .ttl {
	background: url(../img/top_logout/sprite_top_logout.png) no-repeat;
	height: 60px;
	width: 100%;
	background-position: 0 -739px;
	text-indent: -9999px;
	background-size: 608px 989px;
	margin: 0 0 15px;
}

section#no-regi ul {
	height: 199px;
}

section#no-regi ul li {
	width: 160px;
	height: 164px;
	position: relative;
	margin-right: 45px;
	float: left;
	background: url(../img/top_logout/sprite_top_logout.png) no-repeat;
	background-size: 689px 1120px;
}

section#no-regi ul li.info {
	background-position: 0 -908px;
}

section#no-regi ul li.vote {
	background-position: -168px -908px;
}

section#no-regi ul li.manual {
	background-position: -332px -908px;
	margin: 0;
}

section#no-regi ul li a {
	width: 160px;
	height: 45px;
	display: block;
	position: absolute;
	bottom: -25px;
	text-indent: -9999px;
	background: url(../img/top_logout/sprite_top_logout.png) no-repeat;
	background-size: 455%;
}

section#no-regi ul li a:hover{
	bottom: -20px;
}

section#no-regi ul li.info a {
	background-position: -524px -1002px;
}

section#no-regi ul li.vote a {
	background-position: -524px -1048px;
}

section#no-regi ul li.manual a {
	background-position: -524px -1095px;
}