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

	主要国 WEBサイトの歩き方
	競走馬プロフィールの調べ方

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

#profile ul.step_list > li:last-child {
	width: auto;
	padding-right: 0;
}

#profile ul.step_list > li:last-child > div.step_unit > div.inner {
	display: table;
	table-layout: fixed;
	width: 100%;
}

#profile ul.step_list > li:last-child > div.step_unit > div.inner > div {
	display: table-cell;
	vertical-align: top;
}

#profile ul.step_list > li:last-child > div.step_unit > div.inner > div.img {
	width: 60%;
	width: 540px;
	width: 620px;
}

#profile ul.step_list > li:last-child > div.step_unit > div.inner > div.txt {
	padding-left: 20px;
}


/* --- 検索方法アンカーリンクブロック --- */
ul.method {
	background-color: #ebebeb;
	padding: 5px;
	border-radius: 3px;
}

ul.method > li {
	padding: 5px;
}

ul.method > li > a {
	display: block;
	text-decoration: none;
	color: #333;
	background-color: #fff;
	padding: 10px;
	border-radius: 4px;
	box-shadow: 0 1px 4px rgba(0,0,0,0.1);
	font-weight: bold;
	color: #555;
}

.no-touch ul.method > li > a:hover,
ul.method > li > a:focus {
	background-color: #fff8e1;
}


ul.method > li > a > span.inner {
	display: table;
}

ul.method > li > a > span.inner > span {
	display: table-cell;
}


ul.method>li>a>span.inner>span.num>span {
	background-color: #c50813;
	color: #fff;
	font-weight: bold;
	padding: 4px 0.5em;
	font-size: 1.2rem;
	margin-right: 0.8em;

	border-radius: 2.4em;
	padding: 4px 0.6em;

	padding: 4px 0.5em;
	padding: 4px 6px;

	padding: 0.2em 0.6em;

	padding: 0.2em 0.6em;

	position: relative;
	top: -1px;

	display: block;
}
ul.method > li > a > span.inner > span.txt {
	font-size: 1.4rem;
	padding: 2px 0;
}



/* ----- 検索方法ユニット ----- */

div.method_unit > div.method_header {
	padding-bottom: 5px;
	border-bottom: 1px dotted #ccc;
}

div.method_unit > div.method_header > h4 {
	font-size: 1.6rem;
	font-weight: bold;
	display: table;
}

div.method_unit > div.method_header > h4 > span {
	display: table-cell;
	vertical-align: top;
}

div.method_unit>div.method_header>h4>span.num>span {
	background-color: #c50813;
	color: #fff;
	font-weight: bold;
	padding: 4px 0.5em;
	font-size: 1.2rem;
	margin-right: 0.4em;

	border-radius: 2.4em;
	padding: 4px 0.6em;
	padding: 4px 0.5em;
	padding: 4px 6px;

	padding: 0.2em 0.6em;
	text-align: center;
	display: block;
}

div.method_unit > div.inner > ul:after { content: ''; display: block; clear: both; }


div.method_unit > div.inner > ul > li {
	width: 50%;
	padding: 10px 0;
	float: left;
}

div.method_unit > div.inner > ul > li:nth-child(odd) {
	padding-right: 10px;
}

div.method_unit > div.inner > ul > li:nth-child(even) {
	padding-left: 10px;
}


div.method_unit > div.inner > ul > li > p.img {
	border: 1px solid #ddd;
	padding: 10px;
}

div.method_unit > div.inner > ul > li > p.img img {
	vertical-align: top;
}

div.method_unit > div.inner > ul > li > p.cap {
	margin-top: 5px;
}



/* ----- プロフィール｜過去成績のテーブル ----- */
table.items {
	width: 100%;
	table-layout: fixed;
}

table.items > caption {
	background-color: #eee;
	padding: 10px;
	font-size: 1.3rem;
	text-align: left;
	background-color: #0069a7;
	color: #fff;
	padding: 10px;
	font-weight: bold;
	font-size: 1.3rem;
}


table.items thead tr th {
	background-color: #f3f3f3;
	font-weight: bold;
	font-size: 1.3rem;
	padding: 6px 10px;
	border: 1px solid #ddd;
	text-align: center;
	background-color: #fcdfb9;
	background-color: #F9FBE7;
	background-color: #f4f6e3;
	vertical-align: middle;
}

table.items thead tr th:first-child{
	width: 16%;
}

table.items tbody tr th {
	border: 1px solid #ddd;
	padding: 6px 10px;
	font-size: 1.3rem;
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
	color: #555;

}

table.items tbody tr th span:first-child {
	background-color: #c50813;
	color: #fff;
	padding: 3px 5px;
	display: inline-block;
	min-width: 30px;
	text-align: center;
}

/* オーストラリア　競走馬プロフィールの各項目 */
table.items tbody tr th span:last-child:not([class]):not(:only-child){
	display: inline-block;
	margin-top: 6px;
	font-size: 1.3rem;
	font-weight: normal;
	color: #333333;
}


table.items tbody tr td {
	border: 1px solid #ddd;
	padding: 6px 10px;
	font-size: 1.3rem;
	vertical-align: middle;
	font-size: 1.4rem;
}

table.items tbody tr:nth-child(even) > th,
table.items tbody tr:nth-child(even) > td {
	background-color: #f3f3f3;
}

table.items tbody tr td span {
	font-size: 1.1rem;
}


/* ----- table caption内の項目番号 ---- */
table.items > caption > span.num {
	background-color: #c50813;
	color: #fff;
	padding: 2px 4px;
	display: inline-block;
	text-align: center;
	border: 1px solid #ccc;
	margin-right: 0.7em;
	font-size: 1.1rem;
	line-height: 1.3;
	vertical-align: middle;
}




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

	979px以下

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

	#profile ul.step_list>li:last-child>div.step_unit>div.inner {
		display: block;
	}

	#profile ul.step_list>li:last-child>div.step_unit>div.inner>div {
		display: block;
	}

	#profile ul.step_list>li:last-child>div.step_unit>div.inner>div.img {
		width: auto;
	}

	#profile ul.step_list>li:last-child>div.step_unit>div.inner>div.txt {
		padding-left: 0;
		margin-top: 10px;
	}

	ul.method {
		font-size: 0;
	}

	ul.method>li {
		width: 33.33%;
		display: inline-block;
		font-size: 1.3rem;
	}


	ul.method>li>a>span.inner>span.txt {
		font-size: 1.3rem;
	}

}



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

	767px以下

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

	ul.method>li {
		width: 50%;
	}

	div.method_unit>div.inner>ul>li {
		width: 100%;
		float: none;
	}

	div.method_unit>div.inner>ul>li:nth-child(odd),
	div.method_unit>div.inner>ul>li:nth-child(even) {
		padding-left: 0;
		padding-right: 0;
	}

	div.method_unit>div.inner>ul>li>p.img {
		text-align: center;
	}

}


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

	639px以下

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

	ul.method>li {
		width: 100%;
	}

	table.items tbody tr th {
		font-size: 1.2rem;
	}

	table.items tbody tr td {
		font-size: 1.3rem;
	}

}


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

	table.items thead tr th:first-child {
		width: 50px;
		padding: 6px 0;
	}

	table.items tbody tr td {
		font-size: 1.2rem;
	}

}

