/* ----------------------------------------------------------------------
	
	72.競走馬情報（競走馬詳細）
	73.産駒一覧（競走馬詳細）
	
---------------------------------------------------------------------- */

/* - 戻るボタン
--------------------------------------------------*/
#keiba_related_menu { margin-bottom: 15px; }
div.header_line { margin-bottom: 15px; }

.nav_back_area { text-align: right; }

.nav_back_area + #horse_detail,
.nav_back_area + #horse_sanku { margin-top: 15px; }


/* - 放牧表示
--------------------------------------------------*/
div.header_line > div.content > h1 > span.inner > span.txt span.horse_icon {
    vertical-align: middle;
    position: relative;
    top: -2px;
    margin-right: 4px;
}

div.header_line > div.content > h1 > span.inner > span.txt span.rest {
    margin-left: 1em;
    display: inline-block;
    background-color: #fff;
    color: #333;
    padding: 3px 6px;
    position: relative;
    top: -1px;
    
    font-size: 1.3rem;
    border-radius: 2px;
}


/* - 馬記号
--------------------------------------------------*/
div.header_line > div.content > h1 > span.inner > span.txt span.horse_icon > img {
    max-width: 20px;
    max-width: 18px;
}


/* - 英語名表示
--------------------------------------------------*/
div.header_line > div.content > h1 > span.inner > span.txt span.name_en {
    margin-left: 0.8em;
    font-size: 1.4rem;
}

div.header_line > div.content > h1 > span.inner > span.txt span.country {
/*    margin-left: 0.8em;*/
    font-size: 1.2rem;
}

/* - 抹消年月日
--------------------------------------------------*/
div.header_line > div.content > h1 > span.inner {
    width: 100%;
}

div.header_line > div.content > h1 > span.inner > span.icon { width: 40px; }

div.header_line > div.content > h1 > span.inner > span.txt { text-align: left; }

div.header_line > div.content > h1 > span.inner > span.opt {
    font-size: 1.3rem;
    text-align: right;
    vertical-align: bottom;
}


/* - 産駒一覧ボタン・競走馬一覧ボタン
--------------------------------------------------*/

/* --- オプション有り --- */
.contents_header.opt2 { /*position: relative;*/ }

.contents_header.opt2 > .inner {
	display: table;
	width: 100%;
}

.contents_header.opt2 > .inner > div {
	display: table-cell;
	vertical-align: middle;
}

.contents_header.opt2 > .inner > div.main > h2 {
	font-size: 1.6rem;
	font-weight: bold;
	color: #444;
	padding: 12px 0 12px 8px; /* 右余白ゼロに変更 */
}

.contents_header.opt2 > .inner > div.opt2 {
	text-align: right;
	/* padding-right: 8px; 右余白ゼロに変更 */
}

.contents_header.opt2 > .inner > div.opt2.nowrap { white-space: nowrap; }


.contents_header.opt2 > .inner > div.opt2 > a > i {
	margin-right: 0.4em;
	color: #188542;
}


/* ------------------------------------------------------------
    6：ボタングループ
------------------------------------------------------------ */
.btn-group2 {
	display: inline-block;
	vertical-align: middle;
}

.btn-group2.block { display: block; }

.btn-group2 > .btn-def {
	color: #06a;
	padding: 8px 50px;
	display: inline-block;
	font-size: 1.3rem;
	margin-left: -1px;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 2px rgba(0, 0, 0, .075);
	line-height: 1.4;
}

.btn-group2 > .btn-def:focus {
    position: relative;
    z-index: 15;
}


/* - プロフィール
--------------------------------------------------*/

div.profile {  }

div.data {  }

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

div.data > ul > li {
	width: 100%;
	float: left;
	border-bottom: 1px solid #fff;
}

div.data > ul > li.data_col1 { width: 35%; }
div.data > ul > li.data_col2 { width: 25%; }
div.data > ul > li.data_col3 { width: 40%; }
div.data > ul > li.data_col1and2 { width: 60%; }

div.data > ul > li.div2 { width: 50%; }
div.data > ul > li.div3 { width: 33.3%; }
div.data > ul > li.div4 { width: 25%; }

div.data > ul > li > dl {
	display: table;
	width: 100%;
}

div.data > ul > li > dl > dt {
	display: table-cell;
	vertical-align: middle;
	width: 6em;
    width: 68px;
	
	background-color: #eaeade;
	padding: 6px 8px;
	font-weight: bold;
	line-height: 1.5;
	padding: 8px;
    
    font-size: 1.2rem;
}

div.data > ul > li > dl  > dd {
	display: table-cell;
	vertical-align: middle;
	background-color: #f3f3f3;
	line-height: 1.5;
	padding: 8px;
    
    word-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-all;
}


/* - 母馬および母母の産駒リンク
--------------------------------------------------*/
div.data > ul > li > dl  > dd  > span.sanku {
    float: right;
    min-width: 2.5em;
    text-align: right;
}

div.data.race > ul > li > dl > dd { font-size: 0; }

div.data.race > ul > li > dl > dd ul {
    display: inline-block;
}

div.data > ul > li > dl > dd ul li {
    display: table;
    border: 1px solid #dfdfdf;
    font-size: 1.2rem;
}

div.data > ul > li > dl > dd ul li:first-child { border-bottom: none; }
div.data > ul > li > dl > dd ul li:last-child { border-bottom: 1px solid #dfdfdf; }

div.data > ul > li > dl  > dd ul li span {
    display: table-cell;
    padding: 6px;
    vertical-align: top;
    
}

div.data > ul > li > dl  > dd ul li span.year {
/*    width: 68px;*/
    background-color: #fefefe;
    background-color: #eceff1;
    border-right: 1px dashed #ddd;
    white-space: nowrap;
}

div.data > ul > li > dl  > dd ul li span.race {
    background-color: #fff;
    width: 100%;
}


/* - レーティング
--------------------------------------------------*/
div.rating > .line {
    display: flex;
    align-items: center;
}

div.rating > .line > .cell {
    width: 50%;
}

div.rating > .line > .cell + .cell {
    margin-left: 2px;
}

div.rating > .line > .cell dl {
    /*display: flex;
    align-items: center;
    width: 100%;
    background-color: #eaeade;
    */

    display: table;
    width: 100%;
}

div.rating > .line > .cell dl > dt {
    display: table-cell;
    vertical-align: middle;
    background-color: #e2e2bd;
    background-color: #eaeade;
    padding: 8px;
    font-weight: bold;
    width: 156px;
    font-size: 1.2rem;
    white-space: nowrap;
}

div.rating > .line > .cell dl > dt span.year {
    font-size: 1rem;
    margin-left: 0.5em;
}

div.rating > .line > .cell dl > dd {
    display: table-cell;
    vertical-align: middle;
    background-color: #f3f3f3;
    padding: 8px;
    flex-grow: 1;
}

/* - 賞金
--------------------------------------------------*/
div.prize div.grid {
    display: table;
    width: 100%;
}

div.prize div.grid div {
    display: table-cell;
    vertical-align: middle;
}

div.prize .header {
    width: 68px;
    background-color: #eceff1;
    background-color: #eaeade;
    background-color: #e2e2bd;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}

div.prize h3 {
    font-weight: bold;
    text-align: center;
}

div.prize div.data > ul > li > dl > dt { width: 120px; }

div.prize div.data > ul > li > dl dd { text-align: right; }

div.prize div.data > ul > li > dl dd span {
	font-size: 1.1rem;
	margin-left: 0.2em;
}

div.layout_grid {
    display: table;
    width: 100%;
}

div.layout_grid > div.cell {
    display: table-cell;
    vertical-align: top;
    width: 50%;
}

div.layout_grid > div.cell.left {
    padding-right: 10px;
}

div.layout_grid > div.cell.right {
    padding-left: 10px;
}


/* - タブ
--------------------------------------------------*/

ul.unit_list > li { display:none; }

/*
ul.unit_list > li:first-child {
	display:block;
}*/

ul.unit_list > li.no_js { display: block; }

ul.unit_list > li.on {
    display: block;
    animation: obj_fade_in 0.2s ease-in-out;
}

@keyframes obj_fade_in {
    from{ opacity: 0; }
    to{ opacity: 1; }
}


/* - 表内の略称
--------------------------------------------------*/
.abbr_area { text-align: right; }


/* - レース成績・
--------------------------------------------------*/

caption.simple > .inner > div.main { font-size: 1.4rem; }

div.race_data table.basic > thead > tr > th {
	font-size: 1.2rem;
}

div.race_data table.basic > tbody > tr > td {
	text-align: right;
}

div.race_detail table.basic tbody > tr > td span.addition {
    font-size: 1.1rem;
    margin-left: 0.2em;
    font-weight: normal;
}


/* --- 該当データなし --- */
.caution.no_data {
    min-height: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    
    margin: 5px;
}

.caution.no_data p strong { font-size: 1.4rem; }

.race_data .caution.no_data,
.condtion_data .caution.no_data { margin: 5px 0; }


/* - 条件別成績
--------------------------------------------------*/

div.conditions_data table.basic > thead > tr > th > span.unit {
    display: block;
    font-size: 1rem;
/*
    margin-left: 0.1em;
    line-height: 1;
*/
}

div.conditions_data table.basic > tbody > tr > th {
	font-size: 1.2rem;
	padding: 5px;
}

div.conditions_data table.basic > thead > tr > th {
	font-size: 1.2rem;
}

div.conditions_data table.basic > tbody > tr > td {
	text-align: right;
	padding: 5px;
}

div.conditions_data table.basic > tbody > tr > th > span.from {
/*    display: block;*/
    font-size: 1rem;
/*    margin-top: 0.3em;*/
}

div.conditions_data table.basic > tbody > tr > th > span.lessthan {
    font-size: 1rem;
    margin-left: 0.2em;
}


/* - 出走・出馬投票履歴
--------------------------------------------------*/

/* - テーブルの上下間隔を調整 - */
#horse_detail table.basic.simple.narrow-xy.short { margin: 10px 0 -5px; }

/* - テーブルのキャプションを非表示に - */
#horse_detail table.basic caption.simple.hidden { color: transparent; height: 0; }


/*div.race_history > table.basic thead > tr > th { width: 12.5%; }*/

#horse_detail div.race_history > table.basic tbody > tr > td { font-size: 1.2rem; }

div.race_history > table.basic tbody > tr > td span { font-size: 1.0rem; }



/* - 出走レース
--------------------------------------------------*/

div.race_detail table.basic tbody > tr > td {
    font-size: 1.2rem;
}


/* - テーブル - */
div.race_detail thead > tr > th { font-size: 1.2rem; }

div.race_detail thead > tr > th.date { width: 112px; }
div.race_detail thead > tr > th.course { width: 40px; }
div.race_detail thead > tr > th.race { /*width: 160px;*/ }
div.race_detail thead > tr > th.name { width: 140px; }
div.race_detail thead > tr > th.dist { width: 70px; }
div.race_detail thead > tr > th.dist span.unit {
    display: block;
    font-size: 1rem;
}
div.race_detail thead > tr > th.baba { width: 66px; }
div.race_detail thead > tr > th.num { width: 36px; }
div.race_detail thead > tr > th.pop { width: 36px; }
div.race_detail thead > tr > th.place { width: 60px; }
div.race_detail thead > tr > th.jockey { width: 105px; }
div.race_detail thead > tr > th.weight { width: 40px; }
div.race_detail thead > tr > th.h_weight { width: 48px; }
div.race_detail thead > tr > th.time { width: 54px; }
div.race_detail thead > tr > th.horse { width: 140px; }

div.race_detail thead > tr > th.course { width: 36px; padding: 5px 2px; }
div.race_detail thead > tr > th.jockey { width: 94px; }
div.race_detail thead > tr > th.rate { width: 32px; }
div.race_detail thead > tr > th.horse { width: 132px; }

div.race_detail tbody > tr > td { font-size: 1.2rem; }

div.race_detail tbody > tr > td.date,
div.race_detail tbody > tr > td.race,
div.race_detail tbody > tr > td.jockey,
div.race_detail tbody > tr > td.horse,
div.race_detail tbody > tr > td.move { text-align: left; }

div.race_detail table.basic tbody > tr > td.horse { font-size: 1.1rem; }
div.race_detail table.basic tbody > tr > td.rate { font-size: 1.1rem; padding: 5px 2px; }


div.race_detail tbody > tr > td.move,
div.race_detail tbody > tr > td.red,
div.race_detail tbody > tr > td.blue,
div.race_detail tbody > tr > td.green {
	font-weight: bold;
}


/* - caution ブロック
--------------------------------------------------*/
#horse_detail div.caution > h3.block_header_line {
    font-size: 1.3rem;
	padding: 3px 0;
	margin-bottom: 5px;
}



/* - 産駒一覧
---------------------------------------------------------------------- */


/* ----- 表内の説明 ----- */


caption div.opt div.content_group { 
	display: inline-block;
    vertical-align: middle;
    /*font-size: 0;*/
}

caption div.opt div.content_group > div.content ul { display: table; }

caption div.opt div.content_group > div.content ul li {
    display: table-cell;
/*	vertical-align: middle;*/
	padding-left: 20px;
}

caption div.opt div.content_group > div.content ul li:first-child { padding-left: 0; }


/* ----- 「抹消」の説明 ----- */
div.cell ul.icon_list > li > dl {
    display: table;
}

caption div.content_group ul.icon_list > li > dl > dt {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

caption div.content_group ul.icon_list > li > dl > dt.deregist span {
    font-size: 1.2rem;
    padding: 3px 4px;
    font-weight: bold;
    text-align: center;
    border-radius: 2px;
    top: -1px;
    background-color: #d7ecf6;
    border: 1px dashed #ddd;
    border: 1px dotted #ccc;
    background-color: #f9f5de;
    color: #333;
}


caption div.content_group ul.icon_list > li > dl > dd {
    display: table-cell;
    vertical-align: middle;
}

/* ----- 「馬名太字」の説明 ----- */

caption div.content_group ul.icon_list > li.boldface > dl > dt {
	font-size: 1.3rem;
    font-weight: bold;
	padding-right: 0;
}

/*caption div.content_group ul.icon_list > li.boldface > dl > dd {
	padding: 0;
}*/


/* - 種牡馬成績ページ
--------------------------------------------------*/

/*2歳・全馬 リンクボタン*/

ul.nav.pills > li a i.fa-chevron-circle-down { display: none; }
ul.nav.pills > li.current > a i.fa-chevron-circle-right { display: none; }
ul.nav.pills > li.current > a i.fa-chevron-circle-down { display: inline-block; }

/*2歳・全馬 切替え関連*/
div.race_year > div.horse_block { display: none; }
div.race_year > div.horse_block:first-child { display:block; }

/* 2歳・全馬 テーブル */
table.basic > caption { margin-bottom: 10px; }

div.horse_block > table.basic thead tr th.year { width: 62px; }
div.horse_block > table.basic thead tr th.horse_num { width: 54px; }
div.horse_block > table.basic thead tr th.winner { width: 54px; }
div.horse_block > table.basic thead tr th.race_num { width: 54px; }
div.horse_block > table.basic thead tr th.win_num { width: 54px; }
div.horse_block > table.basic thead tr th.prize { width: 166px; }
div.horse_block > table.basic thead tr th.prize span { display: block; }
div.horse_block > table.basic thead tr th.place { width: 64px; }
div.horse_block > table.basic thead tr th.prize_one { width: 140px; }
div.horse_block > table.basic thead tr th.rate { width: 64px; }
div.horse_block > table.basic thead tr th.ei {
    font-size: 1.2rem;
    width: 88px;
}

div.horse_block > table.basic thead tr th span { font-size: 1.2rem; }

div.horse_block > table.basic tbody tr td { text-align: right; }

div.horse_block > table.basic tbody tr td.place,
div.horse_block > table.basic tbody tr td.rate { text-align: center; }

div.horse_block > table.basic tbody tr td.red,
div.horse_block > table.basic tbody tr td.blue,
div.horse_block > table.basic tbody tr td.green { font-weight: bold; }

div.race_year table.basic tbody > tr > th.year { }

div.race_year table.basic tbody > tr > td > span.yen {
	font-size: 1.1rem;
    margin-left: 0.2em;
}


/* - 産駒一覧　テーブル
--------------------------------------------------*/

#horse_sanku table.basic thead > tr > th.name { min-width: 166px; }
#horse_sanku table.basic thead > tr > th.gender { width: 48px; }
#horse_sanku table.basic thead > tr > th.date { width: 132px; }
#horse_sanku table.basic thead > tr > th.trainer { min-width: 158px; }
#horse_sanku table.basic thead > tr > th.prize { width: 140px; }

#horse_sanku table.basic tbody > tr > th { text-align: left; }

#horse_sanku table.basic tbody > tr > td.sire,
#horse_sanku table.basic tbody > tr > td.trainer {
    text-align: left;
    
    word-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-all;
}

#horse_sanku table.basic tbody > tr > td.prize {
    text-align: right;
}

#horse_sanku table.basic tbody > tr > td.prize > span {
	font-size: 1rem;
    margin-left: 0.2em;
}

/* ----- テーブル内「抹消」のアイコン ----- */
#horse_sanku table.basic tbody > tr > th > span.icon {
/*
    font-size: 1.1rem;
    background-color: #d7ecf6;
    background-color: #f9f5de;
    padding: 4px;
    margin-right: 4px;
    font-weight: bold;
    vertical-align: middle;
    border: 1px dashed #baccd5;
    border: 1px dashed #ddd;
    color: #666;
    padding: 3px;
*/
}

#horse_sanku table.basic tbody > tr > th > span.icon {
    background-color: #f9f5de;
    border: 1px dotted #ccc;
    color: #333;
    margin-right: 4px;
    padding: 2px 4px;
    border-radius: 2px;
    font-size: 1.1rem;
    font-weight: bold;
    position: relative;
    top: -1px;
}


/* - caution ブロック
--------------------------------------------------*/

div.caution span.deregist {
    background-color: #d7ecf6;
    border: 1px dashed #ddd;
    border: 1px dotted #ccc;
    background-color: #f9f5de;
    color: #333;
	font-size: 1.1rem;
    padding: 2px 4px;
    font-weight: bold;
    vertical-align: middle;
    text-align: center;
	position: relative;
    top: -1px;
	margin-right: 0.3em;
}