/* ==========================================================================
   Main Contents
   ========================================================================== */

@media ( max-width : 599px) {
	#main_contents {
		height: calc(100% - 70px);
	}
}


/* ==========================================================================
   Map Main
   ========================================================================== */

.map_select_txt {
	font-size: 182%;
	color: #333;
	margin: 0 auto;
	padding: 30px 80px 15px;
}

@media ( max-width : 750px) {
	.map_select_txt {
		padding-left: 10px;
		padding-right: 10px;
	}
}

@media ( max-width : 599px) {
	.map_select_txt {
		font-size: 167%;
		letter-spacing: 0;
		padding-bottom: 30px;
	}
}

@media ( max-width : 374px) {
	.map_select_txt {
		font-size: 153.9%;
		letter-spacing: 0;
	}
}

#map_main {
	max-width: 730px;
	margin: 0 auto;
	position: relative;
}

@media ( max-width : 750px) {
	#map_main {
		padding: 0 10px;
	}
}

.pref_active {
	cursor: pointer;
}

.pref_active:hover {
	opacity: 0.6;
}

.map_area {
	fill: #666;
}

.pref_active .map_area {
	fill: #DE8918;
}

.map_area_kanagawa {
	fill: none;
	stroke: #666;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 6.25px;
}

.pref_active .map_area_kanagawa {
	stroke: #DE8918;
}

.map_area_border {
	fill: #666;
}

.map_text {
	fill: #fff;
}


/* ==========================================================================
   Access Ranking Button
   ========================================================================== */

.ranking_btn_block {
	margin: 0 auto;
	padding: 35px 80px 50px;
	text-align: center;
}

@media ( max-width : 750px) {
	.ranking_btn_block {
		padding: 35px 10px 10px;
	}
}

.ranking_btn {
	width: 176px;
	font-family: 'Noto Serif JP', serif;
	font-size: 131%;
	color: #333;
	padding: 5px 0 6px;
	background-color: #fff;
	border: 1px solid #838383;
	cursor: pointer;
}

.ranking_btn:hover {
	opacity: 0.6;
}

.ranking_btn_date {
	width: 176px;
	font-size: 93%;
	color: #333;
	padding: 5px 0 0;
}


/* ==========================================================================
   Access Ranking
   ========================================================================== */

#ranking_layer {
	width:100%;
	height: 100%;
	background: rgba(255,255,255,0.5);
	position: absolute;
	left: 0;
	top: 0;
	z-index: 10;
	display: none;
}

.ranking_list{
	width: 540px;
	color: #262626;
	background-color: #fff;
	border: 1px solid #262626;
	position: absolute;
	left: calc(50% - 270px);
	top: 90px;
}

@media ( max-width : 599px) {
	.ranking_list{
		height: calc(100% - 20px);
		margin: 10px auto;
		position: relative;
		left: 0;
		top: 0;
	}
}

@media ( max-width : 560px) {
	.ranking_list{
		width: calc(100% - 20px);
		margin: 10px 10px 0;
	}
}

.ranking_close_block {
	background-color: #fff;
}

.ranking_close {
	font-size:138.5%;
	margin: 10px 18px;
	float: right;
	cursor: pointer;
}

@media ( max-width : 560px) {
	.ranking_close {
		margin: 10px 10px;
	}
}

.ranking_close:hover {
	opacity: 0.6;
}


.ranking_list_block_wrapper {
	height: calc(100% - 45px);
	padding: 0 18px;
	overflow-y: scroll;
}

@media ( max-width : 560px) {
	.ranking_list_block_wrapper {
		padding: 0 10px;
	}
}

.ranking_list_block {
	margin-bottom: 10px;
	padding: 5px 0;
	border: 1px solid #262626;
	cursor: pointer;
}

.ranking_close_block + .ranking_list_block {
	margin-top: 45px;
}

.ranking_list_block.rank1 ,
.ranking_list_block.rank2 ,
.ranking_list_block.rank3 {
	padding: 15px 0;
}

.ranking_list_block:hover {
	color: rgba(38,38,38,0.6);
}

.ranking_list_num {
	width: 80px;
	font-size:276.9%;
	font-weight: 500;
	text-align: center;
	float: left;
}

@media ( max-width : 560px) {
	.ranking_list_num {
		font-size:230.7%;
		width: 50px;
	}
}

.ranking_list_block.rank1 .ranking_list_num ,
.ranking_list_block.rank2 .ranking_list_num ,
.ranking_list_block.rank3 .ranking_list_num {
	margin-top: 5px;
	padding-top: 10px;
	background-position: top center;
	background-repeat: no-repeat;
}

.ranking_list_block.rank1 .ranking_list_num {
	background-image: url('../img/rank-crown1.png');
}

.ranking_list_block.rank2 .ranking_list_num {
	background-image: url('../img/rank-crown2.png');
}

.ranking_list_block.rank3 .ranking_list_num {
	background-image: url('../img/rank-crown3.png');
}

.ranking_list_txt {
	width: calc(100% - 100px);
	float: left;
}

@media ( max-width : 560px) {
	.ranking_list_txt {
		width: calc(100% - 50px);
		padding-right: 5px;
	}
}

.ranking_list_class {
	font-size:138.5%;
}

@media ( max-width : 560px) {
	.ranking_list_class {
		font-size:123.1%;
	}
}

.ranking_list_block.rank1 .ranking_list_class ,
.ranking_list_block.rank2 .ranking_list_class ,
.ranking_list_block.rank3 .ranking_list_class {
	font-size:182%;
	margin-bottom: 5px;
}

@media ( max-width : 560px) {
	.ranking_list_block.rank1 .ranking_list_class ,
	.ranking_list_block.rank2 .ranking_list_class ,
	.ranking_list_block.rank3 .ranking_list_class {
		font-size:153.9%;
	}
}

.ranking_list_group {
	font-size:138.5%;
	font-weight: 500;
}

@media ( max-width : 560px) {
	.ranking_list_group {
		font-size:123.1%;
	}
}

.ranking_list_block.rank1 .ranking_list_group ,
.ranking_list_block.rank2 .ranking_list_group ,
.ranking_list_block.rank3 .ranking_list_group {
	font-size:182%;
}

@media ( max-width : 560px) {
	.ranking_list_block.rank1 .ranking_list_group ,
	.ranking_list_block.rank2 .ranking_list_group ,
	.ranking_list_block.rank3 .ranking_list_group {
		font-size:153.9%;
	}
}


/* ==========================================================================
   Prefecuture List
   ========================================================================== */

#pref_list_layer {
	width:100%;
	height: 100%;
	background: rgba(255,255,255,0.5);
	position: absolute;
	left: 0;
	top: 0;
	z-index: 10;
	display: none;
}

.pref_list{
	width: 280px;
	color: #262626;
	background-color: #fff;
	border: 1px solid #262626;
	position: absolute;
	right: 60px;
	top: 90px;
	display: none;
}

@media ( max-width : 750px) {
	.pref_list{
		right: 10px;
	}
}

@media ( max-width : 599px) {
	.pref_list{
		height: calc(100% - 20px);
		top: 10px;
	}
}

.pref_list_pref {
	font-size: 153.9%;
	font-weight: 500;
	background-color: #e4f5f8;
	padding: 10px 5px 10px;
	text-align: center;
	position: relative;
}

.pref_list_close {
	position: absolute;
	right: 10px;
	top: 10px;
	cursor: pointer;
}

.pref_list_close:hover {
	opacity: 0.6;
}

.pref_list_block_wrapper {
	height: calc(100% - 45px);
	padding: 0 14px;
	overflow-y: scroll;
}


.pref_list_block {
	padding: 15px 2px;
	border-bottom: 1px solid #262626;
	cursor: pointer;
}

.pref_list_block_wrapper .pref_list_block:last-child {
	border-bottom: none;
}

.pref_list_block:hover {
	color: rgba(38,38,38,0.6);
}

.pref_list_place ,
.pref_list_school {
	font-size: 123.1%;
	padding-bottom: 5px;
}

.pref_list_group {
	font-size: 138.5%;
	font-weight: 500;
}
