/* ランキング */
#ranking {
	background-color:#F2F2F2;
	border-radius:4px;
	padding:5px;
	color: #666;
	}

.ranking-header {
	background-color:#ffffff;
	border-radius:4px;
	padding:5px;
	}

.ranking-header {
	margin-bottom:5px;
	}

.ranking-header .ranking-game-title {
	font-size: 16px;
    font-weight: bold;
	}

.ranking-header .ranking-play-count {
	font-size:11px;
	margin:10px auto;
	}

.ranking-header .login_time {
	padding:5px;
	}

.ranking-header .login_time .user_nickname {
	font-size:14px;
	font-weight:bold;
	}

.ranking-header .login_time .record {
	margin:10px 0;
	}

.ranking-header .login_time .record .ranking-score {
	margin-right:30px;
	}

.ranking-header .login_time .reload {
	text-align:center;
	color:#fff;
	font-weight:bold;
	padding:5px 0;
	border-radius:4px;
	background: -moz-linear-gradient(top, #F3C35D, #E9A719);
	background: -webkit-linear-gradient(top, #F3C35D, #E9A719);
	background: -o-linear-gradient(top, #F3C35D, #E9A719);
	background: linear-gradient(to bottom, #F3C35D, #E9A719);
	box-shadow: 0 3px 0 rgba(170,122,17,1);
	border:none;
	cursor:pointer;
	}

.loginform .input_box input {
	border-radius:4px;
	background-color:#FAF8F8;
	padding: 3px;
    font-size: 10px;
	width: 60%;
	}

.loginform .input_box {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content:space-between;
	-webkit-align-items: center;
	align-items:center;
	margin-bottom:5px;
	}

.loginform .input_box .input_left {
	display:block;
	margin:0 auto;
	}

.loginform .user-config {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content:space-between;
	-webkit-align-items: center;
	align-items:center;
	}

.loginform .user-config button {
	width:49%;
	color:#fff;
	font-weight:bold;
	padding:5px 0;
	border-radius:4px;
	background: -moz-linear-gradient(top, #F3C35D, #E9A719);
	background: -webkit-linear-gradient(top, #F3C35D, #E9A719);
	background: -o-linear-gradient(top, #F3C35D, #E9A719);
	background: linear-gradient(to bottom, #F3C35D, #E9A719);
	box-shadow: 0 3px 0 rgba(170,122,17,1);
	border:none;
	}
/*
background: -moz-linear-gradient(top, #8FD654, #70B724);
background: -webkit-linear-gradient(top, #8FD654, #70B724);
background: -o-linear-gradient(top, #8FD654, #70B724);
background: linear-gradient(to bottom, #8FD654, #70B724);
*/
.loginform .user-config button.register {
	background: -moz-linear-gradient(top, #8FD654, #70B724);
	background: -webkit-linear-gradient(top, #8FD654, #70B724);
	background: -o-linear-gradient(top, #8FD654, #70B724);
	background: linear-gradient(to bottom, #8FD654, #70B724);
	box-shadow: 0 3px 0 rgba(83,140,23,1);
	}

.record .ranking_today,
.record .ranking_total {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content:space-between;
	-webkit-align-items: center;
	align-items:center;
	}

.ranking_bottom {
	border-radius:4px;
	}

.ranking-tab-frame {
    width: 100%;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content:space-between;
	-webkit-align-items: center;
	align-items:center;
	}

.ranking-tab-frame .ranking-tab {
    text-align: center;
    width: 49%;
    color:#fff;
	padding: 5px 0;
	background: -moz-linear-gradient(top, #F3C35D, #E9A719);
	background: -webkit-linear-gradient(top, #F3C35D, #E9A719);
	background: -o-linear-gradient(top, #F3C35D, #E9A719);
	background: linear-gradient(to bottom, #F3C35D, #E9A719);
    cursor: pointer;
	font-size: 17px;
    font-weight: bold;
	border-radius:4px 4px 0 0;
	}

.ranking-tab-frame .active {
    padding: 5px 0;
    background:#fff;
	color:#666;
	border-radius:4px 4px 0 0;
	}

#ranking-ranking{
    background-color:#FFF;
	padding:10px;
    min-height: 300px;
	border-radius:0 0 4px 4px;
	}

.ranking-ranking-each {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content:space-between;
	-webkit-align-items: center;
	align-items:center;
	}

/* ranking 1,2,3 */

.ranking-ranking-each:nth-child(-n+3) {
    width:100%;
    padding:0px;
	border-bottom: dashed 1px #666;
	}

.ranking-ranking-num {
	width:30px;
	height:30px;
	line-height: 30px;
	text-align:center;
	}

.ranking-ranking-each:nth-child(-n+3) .ranking-ranking-num {
    border: 0;
    color: rgba(0,0,0,0);
	}

.ranking-ranking-each:nth-child(1) .ranking-ranking-num {
    background: url(../../../images/site/game/star-1.png) no-repeat;
	background-size:contain;
	width:30px;
	height:30px;
	}

.ranking-ranking-each:nth-child(2) .ranking-ranking-num {
    background: url(../../../images/site/game/star-2.png) no-repeat;
	background-size:contain;
	width:30px;
	height:30px;
	}

.ranking-ranking-each:nth-child(3) .ranking-ranking-num {
    background: url(../../../images/site/game/star-3.png) no-repeat;
	background-size:contain;
	width:30px;
	height:30px;
	}

.ranking-ranking-each .ranking-ranking-each-name {
	width:40%;
	}

.ranking-ranking-each:nth-child(1) .ranking-ranking-each-name {
    color:#f57c00;
	font-size:14px;
	font-weight:bold;
	}

.ranking-ranking-each:nth-child(1) .number_th,
.ranking-ranking-each:nth-child(2) .number_th,
.ranking-ranking-each:nth-child(3) .number_th {
	display:none;
	}

.ranking-ranking-each:nth-child(2) .ranking-ranking-each-name {
    color:#5c6bc0;
	font-weight:bold;
	}

.ranking-ranking-each:nth-child(3) .ranking-ranking-each-name {
    color:#e53935;
	font-weight:bold;
	}

.ranking-ranking-each:nth-child(-n+3) .ranking-ranking-each-score {
    color:#666;
	}

.font_color_red {
	color:#EC0D10;
	}

/*
#ranking-game-frame {
}

.ranking_area

.ranking-game{
    width:100%;
    border-bottom:2px solid #b6b6b6;
}


.ranking-game-title{
    color:#4c4c4c;
    font-size:16px;
    padding-top:18px;
}

.total-value {
    height:1em;
    display: inline-block;
    text-align: right;
}

.record{
}

.ranking-each{
    display: inline-block;
}

.ranking-score{
    display: inline-block;
    text-align: right;
}

.reload{
    text-align:center;
}

.reload-arrow{
    float:right;
    padding-top:49px;
    padding-right:28px;
}

.ranking-tab-frame {
    width: 100%;
    background-color: #0091ea;
    border-left: 2px solid #b6b6b6;
    border-right: 2px solid #b6b6b6;
    border-top: 2px solid #b6b6b6;
}

.ranking-tab-frame .ranking-tab {
    text-align: center;
    float: left;
    width: 50%;
    color:#000;
    background-color: #ebeff2;
    border-bottom: 2px solid #b6b6b6;
    cursor: pointer;
}

.ranking-tab-frame .active {
    padding:0px;
    background-color:#0091ea;
    border-bottom: 2px solid #0091ea;
    color:#fff;
}

#ranking-ranking{
    clear: both;
    background-color:#FFF;
    min-height: 300px;
}

.ranking-ranking-each {
    width:100%;
    border:2px solid #b6b6b6;
    padding:0px;
}
*/
/* ranking 4,5,6 */
/*
.ranking-ranking-each .ranking-ranking-num {
    float:left;
    text-align: center;
}
.ranking-ranking-each:nth-child(4) .ranking-ranking-num,
.ranking-ranking-each:nth-child(5) .ranking-ranking-num,
.ranking-ranking-each:nth-child(6) .ranking-ranking-num {
    background-color:#c6eaee;
}
*/
/* ranking 7,8,9,10 */
/*
.ranking-ranking-each:nth-child(7) .ranking-ranking-num,
.ranking-ranking-each:nth-child(8) .ranking-ranking-num,
.ranking-ranking-each:nth-child(9) .ranking-ranking-num,
.ranking-ranking-each:nth-child(10) .ranking-ranking-num {
    background-color:#e1e7ef;
}

.ranking-ranking-nth {
}

.ranking-ranking-each-name {
}

.ranking-ranking-each-score {
    color:#727272;
}

*/

/* jsゲーム用インステージ広告 20160616 渡辺追加 */

#ad_block2 {
	width: 645px;
    height: 480px;
    position: absolute;
	background-color: rgba(0,0,0,0.5);
	display: -webkit-flex;
    -webkit-justify-content: center;
    justify-content: center;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
}


/* jsゲーム用インステージ広告 20160616 渡辺追加 end*/

/* jsゲーム用インステージログインフォーム 201606 渡辺追加 */
#login_form {
	/*width: 640px;
    height: 480px;*/
    width: 100%;
    height: 100%;
    position: absolute;
	background-color: rgba(0,0,0,0.5);
	display: -webkit-flex;
    -webkit-justify-content: center;
    justify-content: center;
    display: none;
    /*display: flex;*/
    -webkit-align-items: center;
    align-items: center;

	top:0px;
	/*left: -650px;*/
	}

#login_form .form_body {
	width:80%;
	height:95%;
	background-color:#fff;
	border-radius:25px;
	border:7px solid #30A8CF;
	padding: 5px;
	margin: 0 auto;
	position: relative;
	}

#login_form .form_body .color_blue {
	color:#51B8E9;
	}

#login_form .form_body .form_head {
	font-size:24px;
	font-weight:bold;
	line-height: 1.2;
	color:#FF8901;
	margin:15px 0 10px;
	}

/* form_body_left */
#login_form .form_body .form_body_left {
	width:60%;
	float: left;
	}

#login_form .form_body .form_body_left .left_head {
	font-size:15px;
	font-weight:bold;
	margin-bottom: 10px;
	}

#login_form .form_body .form_body_left table {
	table-layout:fixed;
	width:95%;
	}

#login_form .form_body .form_body_left table tr {
	display: -webkit-flex;
    -webkit-justify-content: center;
    justify-content: center;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
	}

#login_form .form_body .form_body_left table tr:not(:last-child) {
	margin-bottom:5px;
	}

#login_form .form_body .form_body_left table td {
	display:block;
	font-size:12px;
	padding: 5px 0;
	}

#login_form .form_body .form_body_left table .input_title {
	width:40%;
	text-align:right;
	}

#login_form .form_body .form_body_left table .input_body {
	width:60%;
	}

#login_form .form_body .form_body_left table .input_body input {
	width:100%;
	}

#login_form .form_body .form_body_left table .input_birth .year {
	width:40px;
	}

#login_form .form_body .form_body_left table .input_birth .month_day {
	width:20px;
	}

#login_form .form_body .form_body_left table .input_birth .birth {
	margin-right:5px;
	}

#login_form .form_body .form_body_left table .check_box {
	display: -webkit-flex;
    -webkit-justify-content: center;
    justify-content: center;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
	}

#login_form .form_body .form_body_left table .check_box input {
	width:25px;
	margin: 3px 2px 3px 0;
	}

#login_form .form_body .form_body_left table .check_box .check_text {
	width:100%;
	}

#login_form .form_body .form_body_left .form_button input {
	display:block;
	margin:0 auto;
	}

/* form_body_right */
#login_form .form_body .form_body_right {
	float: right;
	width: 38%;
	/*margin-top:2.5em;*/
	}

#login_form .form_body .form_body_right .right_head {
	font-size:14px;
	font-weight:bold;
	}

#login_form .form_body .form_body_right ul li {
	font-size:11px;
	display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
	margin-top:15px;
	text-align: left;
	}

/* button */

#login_form form .bottom_button {
	clear:both;
	display: -webkit-flex;
    -webkit-justify-content: center;
    justify-content: center;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
	padding-top:20px;
	}

#login_form form .bottom_button button,
#login_form form .bottom_button a {
	font-size:14px;
	display: block;
    text-align: center;
    line-height: 1.5;
	border:1px solid #333333;
	text-decoration:none;
	color:#333333;
	width:200px;
	border-radius:4px;
	padding: 5px 0;
	}

#login_form form .bottom_button button:hover,
#login_form form .bottom_button a:hover {
	background-color:#666;
	color:#fff;
	transition: 0.5s;
	}

#login_form form .bottom_button button {
	margin-right:10px;
	}

#login_form form .bottom_button a {
	margin-left:10px;
	}

	/* sns button */
	
	#login_form .bottom_button_sns {
		clear:both;
		display: -webkit-flex;
	    -webkit-justify-content: center;
	    justify-content: center;
	    display: flex;
	    -webkit-align-items: center;
	    align-items: center;
		padding-top:20px;
		}
	
	#login_form .bottom_button_sns .sns_login_tw,
	#login_form .bottom_button_sns .sns_login_fb {
		font-size:14px;
		display: block;
	    text-align: center;
	    line-height: 1.5;
		border:1px solid #333333;
		text-decoration:none;
		color:#ffffff;
		width:200px;
		border-radius:4px;
		padding: 5px 0;
		color: #ffffff !important;
		}
	
	#login_form .bottom_button_sns .sns_login_tw:hover,
	#login_form .bottom_button_sns .sns_login_fb:hover {
		transition: 0.5s;
		color: #ffffff !important;
		}
	
	#login_form .bottom_button_sns .sns_login_tw {
		margin-right:10px;
		background-color: #ffffff;
		border:2px solid #2FA5DE;
		color: #ffffff !important;
		}
	
	#login_form .bottom_button_sns .sns_login_fb {
		margin-left:10px;
		border:2px solid #2E5095;
		background-color: #ffffff;
		color: #ffffff !important;
		}

/*
#login_form .form_body .form_body_right .right_button a,
#login_form .form_body .form_body_left .form_button button {
	display:block;
	position: absolute;
    bottom: 30px;
	font-size:14px;
	border:1px solid #333333;
	text-decoration:none;
	color:#333333;
	width:200px;
	border-radius:4px;
	padding: 5px 0;
	}

#login_form .form_body .form_body_left .form_button button:hover,
#login_form .form_body .form_body_right .right_button a:hover {
	background-color:#666;
	color:#fff;
	transition: 0.5s;
	}

#login_form .form_body .form_body_left .form_button button {
    left: 130px;
    line-height: 1.5;
	}

#login_form .form_body .form_body_right .right_button a {
    left: 350px;
	text-align: center;
	}
*/
#login_form .login_body .form_button {
	text-align:center;
	margin-top: 20px;
	}

#login_form .login_body .form_button button {
	font-size:14px;
	border:1px solid #333333;
	text-decoration:none;
	color:#333333;
	width:150px;
	border-radius:4px;
	padding: 5px 0;
	}

#login_form .login_body .form_button button:hover {
	background-color:#666;
	color:#fff;
	transition: 0.5s;
	}

#login_form .login_body .form_button .register {
	margin-right:5px;}

#login_form .login_body .form_button .button_right {
	margin-left:5px;}

/* 閉じるボタン */
#login_form .form_body .close_button button {
	position:absolute;
	background: none;
    border: none;
	margin: 0;
    padding: 0;
	top: 15px;
    right: 70px;
	}

#login_form .form_body#show_signup_form .close_button button {
	top: 5px;
	right: 5px;
}

#login_form .form_body#show_confirm_form .close_button button {
	top: 5px;
	right: 5px;
}
#login_form .form_body#show_login_form .close_button button {
	top: 5px;
	right: 5px;
}

#login_form .form_body .close_button button img {
	width:30px;
	height:30px;
	}

#login_form .login_body .close_button button {
	top: 110px;;
    right: 140px;
	}

/* ログインフォーム */
#login_form .login_body {
	width:60%;
	height:60%;
	padding:0;
	position: relative;
	margin-top: 10%;
	}

#login_form .login_body .form_head {
	border-bottom:4px solid #FFCC1B;
	padding-bottom:10px;
	margin:15px 0 0;}

#login_form .login_body .input_box {
	text-align: center;
	margin-top: 15px;
	}

#login_form .login_body .input_box .input_left {
    width: 30%;
    text-align: right;
    margin-right: 5px;
    display: inline-block;
	}

#login_form .login_body .input_box input {
    width: 30%;
	padding: 3px;
    margin-left: 5px;
    display: inline-block;
	}

/* 新規登録 内容確認画面 */
#login_form .form_body form.form_confirm {
	margin-top:70px;
	}

#login_form .form_body form.form_confirm .form_body_right {
	margin-top:0;
	}

#login_form .form_body form.form_confirm .form_body_left table .check_box {
	display:block;
	}

/* エラーメッセージ */
#login_form .error p {
	font-size: 8px;
    color: red;}

#login_form .bottom_error {
	line-height:1;}

#login_form .bottom_error p {
	text-align:center;
	font-size: 12px;
    color: red;}
/* jsゲーム用インステージログインフォーム 201606 渡辺追加 end*/
/* ローディング中メッセージ */
.p-game-fw-loading {
	top:0;
	bottom:0;
	right:0;
	left:0;
    width: 640px;
    height: 480px;
	}

.p-game-fw-loading .message p {
	font-size:24px;}

/* ローディング中メッセージ end */