@charset "utf-8";
#main ul {
	/*width:200px;*/
}
/*----------------------------------------------------
	login
----------------------------------------------------*/
.accont-box{
	float:left;
	margin-top:8px;
}
.list-account-head{
	width: 148px;
	margin: 0 0 8px 0;
	padding: 6px 16px;
	border: 1px solid #98CB66;
	/*border-radius: 6px;*/
}
.list-account-head span{
	color: #98CB66;
	font-size: 12px;
	margin-left:8px;
}
#main .list-account{
	width:180px;
}

#main .list-account a{
	display:block;
	width:100%;
}
#main .list-account span{
	color: #98CB66;
	font-size: 8px;
}
#main .list-account li{
	width:148px;
	margin: 0 0 8px 0; 
	padding: 6px 16px;
	background: #d9d9d9;
	border-radius: 6px;
}
#main .list-account li:hover{
	color: #fff;
	background: #6b6b6b;
	cursor: pointer;
}
.ch{
	margin-bottom:32px;
}
.ch-txt{
	float:left;
	width: 616px;
	margin:0 0 0 24px;
}
.ch-txt h3{
	margin-top: 0;
	background:#F3F3F3;
	/*border-left: 7px solid #98CB66;*/
	font-size: 20px;
	font-weight:normal;
}
.ch-txt h3 div{
	padding: 6px 10px;
}
.ch-txt p{
	margin:0;
}
.info-img{
	float:left;
}


#main .accont-content {
	float:left;
}



.profileEditLink {
	text-align:right;
}


/*ランク*/
.mp-rank{
	position: relative;
	/*padding: 16px 0; */
	text-align: center;
}
.title,
.rank-btn,
.mp-rank{
	box-sizing: border-box;
}
.mp-rank  .title{
	padding: 8px;
	color: #fff;
	font-weight: bold;
}
.mp-rank .rank-btn{
	padding: 8px;
	border-top: 1px dotted #aaa;
}
.mp-rank .rank-btn a{
	text-decoration: underline;
}
/*レギュラー会員*/
.regular .title,
.regular .rank-btn{
	background: #b7dde0;
}
.regular .title{
	border: 2px solid #b7dde0;
	border-bottom: none;
}
.regular .rank-btn{
	border: 2px solid #b7dde0;
	border-top: 1px dotted #aaa;
}
.now-rank .rank-btn:after,
.platinum .rank-btn:before,
.gold .rank-btn:before,
.shilver .rank-btn:before,
.regular .rank-btn:before {
	content: "";
	border: 48px solid transparent;
	border-bottom: 28px solid transparent;
	position: absolute;
	left: 1px;
	bottom: -54px;
	z-index: 9999;
}
.regular .rank-btn:before {
	border-top: 28px solid #b7dde0;
}

/*シルバー会員*/
.shilver .title{
	border: 2px solid #ddd;
	border-bottom: none;
}
.shilver .rank-btn{
	border: 2px solid #ddd;
	border-top: 1px dotted #aaa;
}
.shilver .title,
.shilver .rank-btn{
	background: #ddd;
}
.shilver .rank-btn:before {
	border-top: 28px solid #ddd;
}

/*ゴールド会員*/
.gold .title{
	border: 2px solid #d1c8a9;
	border-bottom: none;
}
.gold .rank-btn{
	border: 2px solid #d1c8a9;
	border-top: 1px dotted #aaa;
}
.gold .title,
.gold .rank-btn{
	background: #d1c8a9;
}
.gold .rank-btn:before {
	border-top: 28px solid #d1c8a9;
}

/*プラチナ会員*/
.platinum .title{
	border: 2px solid #d5cde2;
	border-bottom: none;
}
.platinum .rank-btn{
	border: 2px solid #d5cde2;
	border-top: 1px dotted #aaa;
}
.platinum .title,
.platinum .rank-btn{
	background: #d5cde2;
}
.platinum .rank-btn:before {
	border-top: 28px solid #d5cde2;
}

/*ダイヤモンド会員*/
.diamond .title{
	border: 2px solid #9fc2ea;
	border-bottom: none;
}
.diamond .rank-btn{
	border: 2px solid #9fc2ea;
	border-top: 1px dotted #aaa;
}
.diamond .title,
.diamond .rank-btn{
	background: #9fc2ea;
}

/*現在のランク*/
.now-rank .title{
	border: 2px solid #999;
	border-bottom: none;
}
.now-rank .rank-btn{
	border: 2px solid #999;
	border-top: 1px dotted #666;
}
.now-rank .rank-btn:after {
	border-top: 28px solid #999;
	bottom: -56px;
	z-index: 9980;
}
.diamond .rank-btn:after {
	content: "";
	border: none;
	right: -28px;
	bottom: 1px;
	z-index: 0;
}
.rank-btn span{
	font-size: 80%;
}
.rank-btn .no-span{
	color: #b7dde0;
}
/*ランクここまで*/
.now-rank .title div{
	margin-right: 8px;
	background: url(../img/ougi-icon.png) no-repeat right center;
	background-size: auto 24px;
}
@media only screen and (min-width: 600px) {
	.now-rank .title div{
		background: none;
	}
#main	.accont-content{
	margin-left: 32px;
	width:460px;
	}
/*ランク*/
.mp-rank{
	position: relative;
	float: left;
	width: 20%;
	margin-bottom: 16px;
	/*padding: 16px 0; */
	text-align: center;
}
.title,
.rank-btn,
.mp-rank{
	box-sizing: border-box;
}
.mp-rank  .title{
	padding: 16px 8px;
	color: #fff;
	font-weight: bold;
}
.mp-rank .rank-btn{
	padding: 16px 8px;
	border-top: 1px dotted #aaa;
}
.mp-rank .rank-btn a{
	text-decoration: underline;
}
/*レギュラー会員*/
.regular .title,
.regular .rank-btn{
	background: #b7dde0;
}
.regular .title{
	border: 2px solid #b7dde0;
	border-bottom: none;
}
.regular .rank-btn{
	border: 2px solid #b7dde0;
	border-top: 1px dotted #aaa;
}
.now-rank .rank-btn:after,
.platinum .rank-btn:before,
.gold .rank-btn:before,
.shilver .rank-btn:before,
.regular .rank-btn:before {
	content: "";
	border: 28px solid transparent;
	border-right: 14px solid transparent;
	position: absolute;
	left: auto;
	right: -26px;
	bottom: 1px;
	z-index: 9999;
}
.regular .rank-btn:before {
	border-left: 14px solid #b7dde0;
}
.regular .rank-margin{
	/*height: 96px;*/
	height: 128px;
}
/*シルバー会員*/
.shilver .title{
	padding: 28px 8px;
	border: 2px solid #ddd;
	border-bottom: none;
}
.shilver .rank-btn{
	border: 2px solid #ddd;
	border-top: 1px dotted #aaa;
}
.shilver .title,
.shilver .rank-btn{
	background: #ddd;
}
.shilver .rank-btn:before {
	border-left: 14px solid #ddd;
}
.shilver .rank-margin{
	/*height: 72px;*/
		height: 104px;
}
/*ゴールド会員*/
.gold .title{
	padding: 40px 8px;
	border: 2px solid #d1c8a9;
	border-bottom: none;
}
.gold .rank-btn{
	border: 2px solid #d1c8a9;
	border-top: 1px dotted #aaa;
}
.gold .title,
.gold .rank-btn{
	background: #d1c8a9;
}
.gold .rank-btn:before {
	border-left: 14px solid #d1c8a9;
}
.gold .rank-margin{
	/*height: 48px;*/
		height: 80px;
}
/*プラチナ会員*/
.platinum .title{
	padding: 52px 8px;
	border: 2px solid #d5cde2;
	border-bottom: none;
}
.platinum .rank-btn{
	border: 2px solid #d5cde2;
	border-top: 1px dotted #aaa;
}
.platinum .title,
.platinum .rank-btn{
	background: #d5cde2;
}
.platinum .rank-btn:before {
	border-left: 14px solid #d5cde2;
}
.platinum .rank-margin{
	height: 56px;/*24*//*66*/
}
/*ダイヤモンド会員*/
.diamond .title{
	padding: 64px 8px;
	border: 2px solid #9fc2ea;
	border-bottom: none;
}
.diamond .rank-btn{
	border: 2px solid #9fc2ea;
	border-top: 1px dotted #aaa;
}
.diamond .title,
.diamond .rank-btn{
	background: #9fc2ea;
}
.diamond .rank-margin{
	/*height: 0;*/
		height: 32px;

}
/*現在のランク*/
.now-rank .title{
	border: 2px solid #999;
	border-bottom: none;
}
.now-rank .rank-btn{
	border: 2px solid #999;
	border-top: 1px dotted #666;
}
.now-rank .rank-btn:after {
	border-left: 14px solid #999;
	right: -28px;
	z-index: 9980;
}
.now-rank .rank-margin{
	background: url(../img/ougi-icon.png) no-repeat center bottom;
	background-size: auto 24px;
	background-position: bottom 8px;
}
.rank-margin{
	margin-bottom: 8px;
}
.diamond .rank-btn:after {
	content: "";
	border: none;
	right: -28px;
	bottom: 1px;
	z-index: 0;
}
/*ランクここまで*/

}
@media only screen and (min-width: 960px) {
#main	.accont-content{
	width:716px;
}
.platinum .rank-btn:before,
.gold .rank-btn:before,
.shilver .rank-btn:before,
.regular .rank-btn:before {
	border: 28px solid transparent;
	border-right: 28px solid transparent;
	right: -54px;
}
.regular .rank-btn:before {
	border-left: 28px solid #b7dde0;
}
.shilver .rank-btn:before{
	border-left: 28px solid #ddd;
}
.gold .rank-btn:before{
	border-left: 28px solid #d1c8a9;
}
.platinum .rank-btn:before{
	border-left: 28px solid #d5cde2;
}
.now-rank .rank-btn:after {
	border-left: 28px solid #999;
	right: -42px;
	z-index: 9980;
}
}