/*infoエリアをはじめは非表示*/
.userwin{
	display: none;
}

/*モーダルの横幅を変更したい場合*/
.modaal-container{
    max-width: 960px;
}

/*モーダルのボタンの色を変更したい場合*/
.modaal-close:after, 
.modaal-close:before{
	background:#ccc;

}

.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before{
	background:#666;
}

.modaal-close {
	width: 60px;
	height: 60px;
}


.modaal-close:before,
.modaal-close:after {
	top: 9px;	/*　hover背景からの位置 */
	left: 28px;	/*　hover背景からの位置 */
	width: 4px;	/* 閉じるの細さ */
	height: 44px;	/* 閉じるのサイズ */
	border-radius: 0px; 
}

/* モーダルウインドウ */
.modaal-container {
/*	border-radius: 10px; */

	
}

.modaal-content-container {	/* ウィンドウinner */
	padding:30px 5%;

}
.modaal-content-container:after {
	content:"";
	display:block;
	clear:both;
}

.modaal-container .anni20thwin_ttl{
	text-align:right;
	border-bottom:1px solid #e5006e;
	padding-bottom:10px;
	margin-bottom:5px;

}
.modaal-container .anni20thwin_memo{
	text-align:right;
	color:#666;
	font-size:80%;
}
.modaal-container .anni20thwin_box01{
	max-width:960px;
	width:100%;
	display:table;
	margin-top:20px;
}

.modaal-container .anni20thwin_box01 .userimg{
	width:30%;
	display:table-cell;
	text-align:left;
	vertical-align:top;
}

.modaal-container .anni20thwin_box01 .usertxt{
	width:70%;
	display:table-cell;
	text-align:left;
	padding-left:20px;
	vertical-align:top;
}



.modaal-container .anni20thwin_box01 .rankico{
	display:inline-block;
	margin-bottom:20px;
}
.modaal-container .anni20thwin_box01 .rankico li{
	display:inline-block;
	padding:5px 10px;
	line-height:1;
	margin-right:4px;
	margin-bottom:4px;

	color:#fff;
}
	@media screen and (max-width: 840px) {
		padding:5px 5px;
	}
.modaal-container .anni20thwin_box01 .rankico li.kyu1{
	background-color:#e72681;
}
.modaal-container .anni20thwin_box01 .rankico li.kyu2{
	background-color:#ef67a9;
}
.modaal-container .anni20thwin_box01 .rankico li.cc{
	background-color:#e5006e;
}
.modaal-container .anni20thwin_box01 .rankico li.ccin{
	background-color:#a53379;
}
.modaal-container .anni20thwin_box01 .rankico li.cw{
	background-color:#ec8800;
}

.modaal-container .anni20thwin_box01 .anni20thwin_usernm{
	font-size:140%;
	font-weight:bold;
	margin-bottom:20px;
}
.modaal-container .anni20thwin_box01 .anni20thwin_usernm .keisyo{
	font-size:60%;
}
.modaal-container .anni20thwin_box01 .anni20thwin_usernm .detail{
	display:block;
	font-size:80%;
	font-weight:normal;
}
.modaal-container .anni20thwin_qa{
	margin-bottom:20px;
	font-size:16px;
}

.modaal-container .anni20thwin_qa .quest{
	color:#e5006e;
	line-height:180%;
	font-size:16px;

}
.modaal-container .anni20thwin_qa .answ{
	line-height:180%;
	font-size:16px;
}

	@media screen and (max-width: 840px) {


		.modaal-container .anni20thwin_box01,
		.modaal-container .anni20thwin_box01 .userimg,
		.modaal-container .anni20thwin_box01 .usertxt{
			display:block;
			width:100%;
			padding:0px;

		}
		.modaal-container .anni20thwin_box01 .userimg{
			float:left;
			width:30%;
		}
		.modaal-container .anni20thwin_box01 .usertxt_sp{
			float:left;
			width:70%;
			padding-left:10px;
		}
		.modaal-container .anni20thwin_qa{
		}
	}



.anni20thwin_box01_outer{
	position:relative;
}


.anni20thwin_box01_outer .anni20thwin_nav_l{
	position:absolute;
/*	top:45%; */
	top:20%;
	left: -28px;
	z-index: 50;
	max-width:14px;

 }


	@media screen and (max-width: 840px) {
		.anni20thwin_box01_outer .anni20thwin_nav_l{
			left: -10px;
		}
	}
.anni20thwin_box01_outer .anni20thwin_nav_l img:hover{
	cursor: pointer;
}
.anni20thwin_box01_outer .anni20thwin_nav_r{
	position:absolute;
/*	top:45%; */
	top:20%;
	right: -28px;
	z-index: 50;
	max-width:14px;
 }
	@media screen and (max-width: 840px) {
		.anni20thwin_box01_outer .anni20thwin_nav_r{
			right: -10px;

		}
	}
.anni20thwin_box01_outer .anni20thwin_nav_r img:hover{
	cursor: pointer;
}