/* ----------------------------------------------------------------------
	
	競馬場・ウインズ等 - ウインズ・エクセル トップ
	
---------------------------------------------------------------------- */

/*--20200227追記　緊急エリア用--*/
#emergency {
/*    margin-top: 20px;*/
    max-width: 940px;
    }
#emergency > .title { width: 100%; }
#emergency > .content { width: 100%; }


/* - JRAアプリ対応
------------------------------------------------------------ */
.jra-app .hero_area { display: none; }
.jra-app .f_tab { display: none; }


/* - エリアで絞り込む
------------------------------------------------------------ */
.area_block {
	width: 100%;
	display: table;
}

.area_block > .area_list_block {
	width: 630px;
	display: table-cell;
	vertical-align: top;
}


/* ----- 地区を選択 ＞ 地区名ボタン ----- */
.area_list {
	margin-top: 20px;
	background-color: #ebebeb;
	padding: 10px 5px;
}

.area_list > ul {
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
	/zoom : 1;
}

.area_list > ul:after {
	content: '';
	display: block;
	clear: both;
}

.area_list > ul > li {
	width: 300px;
	box-sizing: border-box;
	float: left;
	width: 25%;
	padding: 5px;
}

.area_list > ul > li > a {
	text-decoration: none;
	display: block;
	
	background-color: #fff;
	border-radius: 4px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.1);
	
	padding: 10px;
	text-align: center;
	font-size: 1.8rem;
	font-weight: bold;
	
	height: 72px;
	line-height: 5.2rem;
	color: #555;
}

.area_list > ul > li > a:hover { background-color: #f1f8e9; }

.area_list > ul > li div.content {  }

.area_list > ul > li.current > a { background-color: #f1f8e9; }

.area_list > ul > li div.content > span {
	font-size: 1.4rem;
	margin-left: 0.5rem;
}

.area_list > ul > li div.content > i {
	margin-right: 0.4rem;
	color: #188542;
}




/* --- 地区選択リセットボタン --- */
/*
.area_list_block > div.area_list_reset {
	box-sizing: border-box;
	padding: 10px;
	background-color: #ebebeb;
}

.area_list_block > div.area_list_reset > div.btn > a {
	text-decoration: none;
	display: block;
	
	background-color: #fff;
	border-radius: 4px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.1);
	
	padding: 10px;
	text-align: center;
	font-size: 1.8rem;
	font-weight: bold;
	
	height: 52px;
	line-height: 5.2rem;
	color: #555;
	
	font-size: 1.4rem;
	line-height: 4rem;
	height: 40px;
}

.area_list_block > div.area_list_reset > div.btn > a:hover {
	background-color: #f1f8e9;
}

.area_list_block > div.area_list_reset > div.btn i {
	margin-right: 0.4rem;
	color: #188542;
}
*/




/* - ウインズ・エクセル一覧
------------------------------------------------------------ */

.area_unit_list_block > div.block_header {  }

.area_unit_list_block .area_unit { margin-top: 40px; }
.area_unit_list_block .area_unit.first { margin-top: 20px; }

.area_unit_list_block .area_unit > .header {
	background-color: #1b521f;
	/*display: table;
	width: 100%;*/
	padding: 10px;
}

.area_unit_list_block .area_unit > .header > h4 {
	font-weight: bold;
	font-size: 1.8rem;
	color: #fff;
}




/*
.area_unit_list_block .area_unit > .header > .title {
	display: table-cell;
	color: #fff;
	vertical-align: middle;
	padding: 10px;
}

.area_unit_list_block .area_unit > .header > .title h4 {
	font-weight: bold;
	font-size: 1.8rem;
}

.area_unit_list_block .area_unit > .header > .title > .inner {
	position: relative;
}

.area_unit_list_block .area_unit > .header > .title div.icon {
	position: absolute;
	left: 0;
	top: -30px;
	background-color: #b9f5fd;
	border: 4px solid #fff;
	box-shadow: 0 1px 4px rgba(0,0,0,0.2);
	border-radius: 4px;
}

.area_unit_list_block .area_unit > .header > .title div.icon img {
	vertical-align: top;
}
*/

.area_unit_list_block .area_unit > .content {
	border: 1px solid #ddd;
	border-top: none;
	padding: 20px;
}


/* ----- 都道府県ユニット ----- */
.region_unit {  }

.region_unit > h5 {
	font-size: 1.6rem;
	font-weight: bold;
	padding-bottom: 0.4rem;
	border-bottom: 1px dotted #d0d0d0;
}

/* ----- 都道府県ユニット リンクボタンリスト ----- */
.region_unit div.link_list { background-color: #ebebeb; }

.region_unit div.link_list {
	background-color: #eaeaea;
	padding: 10px;
}

.region_unit div.link_list > ul {
	width: auto;
	overflow: hidden;
	/zoom : 1;
}

.region_unit div.link_list > ul:after {
	content: '';
	display: block;
	clear: both;
}

.region_unit div.link_list > ul > li {
	float: left;
	width: 25%;
	padding: 5px;
	margin: 0;
	box-sizing: border-box;
}

.region_unit div.link_list > ul.col3 > li {
	width:33.33%;
	
}

.region_unit div.link_list > ul > li > a {
	display: block;
	padding: 10px;
	text-decoration: none;
	background-color: #fff;
	border-radius: 4px;
	box-shadow: 0 1px 4px 0 rgba(0,0,0,0.1);
	color: #0069a8;
	font-size: 1.4rem;
	font-weight: bold;
	text-align: center;
	padding: 15px 10px;
}

.region_unit div.link_list > ul > li > a:hover { background-color: #fff8e1; }

.region_unit div.link_list > ul > li > a > i {
	color: #188542;
	margin-right: 0.4rem;
}


p.attention {
	font-weight:bold;
	color:#c00;
}

.region_unit div.link_list > ul > li > a > span.tx-sm {
	font-size:1.1rem;
}

.region_unit div.link_list > ul > li > a > span.block {
	display:block;
}

strong.red {
	color:#c00;
	font-weight:bold;
}



/* ------------------------------------------------------------

	979px以下

------------------------------------------------------------ */
@media screen and ( max-width : 979px ) {
	
	/* ----- 地区を選択ブロック ----- */
	#wins_select_area {  }
	
	.area_block > .area_list_block { width: auto; }
	
	.area_list > ul {
		width: auto;
		padding: 0 5px;
	}
	
	.area_list > ul > li {
		width: 50%;
		box-sizing: border-box;
		margin: 0;
		padding: 5px;
	}
	
	.area_list > ul > li > a {
		font-size: 1.5rem;
		padding: 10px 5px;
	}
	
	.area_list > ul > li div.content {  }
	.area_list > ul > li div.content > span { font-size: 1.2rem; }
	
	
	/* ----- ウインズ・エクセル一覧 リンクボタンリスト ----- */
	.region_unit div.link_list { padding: 5px; }
	
	.region_unit div.link_list > ul { margin: 0; }
	
	.region_unit div.link_list > ul > li {
		margin: 0;
		width: 33.33%;
		padding: 5px;
		box-sizing: border-box;
	}
	
}


/* ------------------------------------------------------------

	767px以下

------------------------------------------------------------ */
@media screen and ( max-width : 767px ) {
	
	/* ----- 地区を選択ブロック ----- */
	.area_block { display: block; }
	
	.area_block > .area_list_block {
		display: block;
		width: auto;
	}
	
	.area_unit_list_block .area_unit > .content { padding: 10px; }
	
}


/* ------------------------------------------------------------

	639px以下

------------------------------------------------------------ */
@media screen and ( max-width : 639px ) {

    /*--20200227追記　緊急エリア用--*/
    #emergency > .title { font-size: 1.8rem; }
	
	/* ----- ウインズ・エクセル一覧 リンクボタンリスト ----- */
	.region_unit div.link_list > ul > li { width: 50%; }
	.region_unit div.link_list > ul.col3 > li { width: 50%; }
	
}


/* ------------------------------------------------------------

	479px以下

------------------------------------------------------------ */
@media screen and ( max-width : 479px ) {
	
	
	/* - 地区を選択
	------------------------------------------------------------ */
	.area_list > ul > li {
		width: 100%;
		float: none;
	}
	
	.area_list > ul > li > a {
		font-size: 1.8rem;
		padding: 10px 5px;
		padding: 5px;
		height: 62px;
	}
	
	.area_list > ul > li div.content {  }
	
	.area_list > ul > li div.content > span { font-size: 1.4rem; }
	
	/* - ウインズ・エクセル一覧
	------------------------------------------------------------ */
	/* ----- リンクボタンリスト ----- */
	.region_unit div.link_list > ul > li { width: 100%; }
	.region_unit div.link_list > ul.col3 > li { width: 100%; }
	
}


/* ------------------------------------------------------------

	359px以下

------------------------------------------------------------ */
@media screen and ( max-width : 359px ) {
	/* - ウインズ・エクセル一覧
	------------------------------------------------------------ */
	.area_unit_list_block .area_unit > .header h4 { font-size: 1.4rem; }
	
}