@charset "utf-8";
/* ========================================================
	/special/index.css => 特設サイト
======================================================== */




.br_pc{
    display: inline;
}
.br_no_pc{
    display: none;
}


.nav-tabs {
  border-bottom:none;
}



.nav-tabs .nav-link.active {
  background-color:#e2e2e2;
  border-bottom:#e2e2e2;
  font-weight: bold;
}

.tab-pane.active .tab-pane-header {
  padding:2rem;
  background-color:#e2e2e2;
  border-top-right-radius: .5rem;
  border-top-left-radius: .5rem;
  margin-bottom:1rem;
}

.tab-pane:first-child .tab-pane-header {
  border-top-left-radius: 0;
}

#zensanso{
	font-size: 1rem;
}


.w {
    text-align: center;
}

.chushaku {
    text-align: left;
    font-size: 14px;
    font-weight: bold;
    color: red;
    line-height: 1.5;
    /* display: none; */
}

.R_button{
    display: inline-block;
    margin-bottom: 15px;
}
.R_button label{
    display: inline-block;
    width: 49px;
    height: 37px;
    cursor: pointer;
    /* border: 1px solid #353535; */
    /* box-shadow: 0px 2px #353535; */
    /* background-color: #def0fe; */
    color: #000000;
    box-sizing: border-box;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    /* margin-right: 1px; */
    margin: 2px 0 8px 0;
}
.R_button label:hover {
    /* background-color: #0070df; */
    color: #ffffff;
}
/* .R_button input:checked+label:hover {
    box-shadow: 0px 2px #353535;
} */
.R_button input:checked+label{
    /* background-color: #0070df; */
    color: #ffffff;
}

.R_button input{
    display: none;
}
.r01,.r02,.r03,.r04,.r05,.r06,.r07,.r08,.r09,.r10,.r11,.r12{
    position: relative;
    top: 4px;
}

.P_button{
    display: inline-block;
    margin-bottom: 5px;
}
.P_button label{
    display: inline-block;
    width: 317px;
    height: 37px;
    cursor: pointer;
    /* border: 1px solid #353535; */
    /* box-shadow: 0px 2px #353535; */
    background-color: #def0fe;
    color: #000000;
    box-sizing: border-box;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    margin-right: 1px;
}
.P_button label:hover {
    background-color: #0070df;
    color: #ffffff;
}
/* .P_button input:checked+label:hover {
    box-shadow: 0px 2px #353535;
} */
.P_button input:checked+label{
    background-color: #0070df;
    color: #ffffff;
}
.P_button input{
    display: none;
}
.p01,.p02{
    position: relative;
    top: 4px;
}


.live1,.live2 {
    width: 319px;
    height: 40px;
    font-size: 25px;
    font-weight: bold;
    bottom: 391px;
    background-color: #def0fe;
    color: #000000;
    border: 1px solid #172330;
}
.live1 {
    margin-right: 1px;
    position: absolute;
    left: 0px;
}
.live2 {
    margin-left: 1px;
    position: absolute;
    right: 0px;
}
/* .live1:hover,.live2:hover {
} */
.live1:active,.live2:active {
    background-color: #0070df;
    color: #ffffff;
}

.keibabook {
    background-color: #ff5555;
}
.hanro {
    background-color: #ffee55;
}

.keibabook_img,.hanro_img,.haraimodoshi_img,.daibunseki_img {
    width: 48%;
    margin: 5px 5px 0 5px;
}

.raceinfo_under_block>header .has_couse .title{
    padding-top: 0;
}

.raceinfo_under_block>header h1 {
    margin-bottom: 0;
    /* font-size: 1.5rem; */
}

.touhyo {
    background-image: linear-gradient(135deg, #5588df 10%, #1054a3 100%);
    font-size: 26px;
    font-weight: bold;
    color: #ffffff;
    padding: 0;
    width: 370px;
    border-radius: 10px;
}

.raceinfo_under_block {
    margin-top: 5px;
    background-color: #ffffff;
}

.raceinfo_under_block>header {
    margin-bottom: 10px;
    padding: 2px 0;
}

.banner table{
	text-align: center;
}
.banner td{
    padding: 40px;
    background-color: #ffddaa;
}
.banner img{
    max-width: 100%;
}

#frame_odds {
    /* margin: 50px 0 0 0; */
    height: 100%;
}
.raceinfo_under_block table.uma_t tbody th, .raceinfo_under_block table.uma_t tbody td{
    padding: 10px 0;
}
.raceinfo_under_block table tbody th, .raceinfo_under_block table tbody td {
    padding: 8px 10px;
}
.raceinfo_under_block table {
    margin-bottom: 0;
}


#frame_syuso {
    /* margin: 50px 0 50px 0; */
    margin: 0 0 0 0;
}

.sec1 {
    /* float: left; */
    width: 640px;
    /* zoom: 900%; */
    /* height: 465px; */
    transform: scale(0.8);
    margin: calc(465px *0.2 *0.5 * -1) calc(640px *0.2 *0.5 * -1);
    /* float: left; */
    /* width: 40%; */
    display: inline-block;
}
.sec2 {
    position: relative;
    /* top: -75px; */
    /* top: 7px; */
    /* top: -264px; */
    /* top: -305px; */
    /* top: -105px; */
    top: -92px;
    /*  float: left; */
    width: 880px;
    /* zoom: 900%; */
    /* height: 673px; */
    height: 760px;
    transform: scale(0.73);
    margin: calc(673px *0.27 *0.5 * -1 *2) calc(880px *0.27 *0.5 * -1);
    padding: 0 0 0 20px;
    display: inline-block;
}

.sec2 .bnr{
    display: none;
}

#frame_odds::-webkit-scrollbar { 
  display: none;
}



.tit {
    /*  background: #4466ff; */
    background-image: linear-gradient(135deg, #5588df 10%, #1054a3 100%);
    font-size: 26px;
    font-weight: bold;
    color: #ffffff;
    padding: 10px 0;
}
.tit_img {
    width: 100%;
}

.sec0 {
    margin: 0 0 50px 0;
}
.sec9 {
    margin: 0 0 50px 0;
}

.nashi {
    /*  background: #4466ff; */
    /*  background-image: linear-gradient(135deg, #dddddd 10%, #888888 100%); */
	background-image: url(../images/nashi.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
    font-size: 26px;
    font-weight: bold;
    color: #ffffff;
    padding: 200px 0;
}

.sec12 {
    text-align: center;
    width: 100%;
    /*  height: 500px; */
    height: 575px;
    /*  margin: 0 0 50px 0; */
    margin: 0 0 120px 0;
    white-space: nowrap;
}

.sec3a {
    font-size: 26px;
    font-weight: bold;
    /* padding: 50px 0 0 0; */
    margin: 80px 600px 5px 600px;
    background-image: linear-gradient(135deg, #eeccaa 10%, #ccaa88 100%);
}

.sec3b {
    margin: 0 0 40px 0;
    height: 50px;
}

.sec33 {
    text-align: center;
    width: 100%;
    margin: 0 0 50px 0;
}
.sec3 {
    /* margin: 0 0 50px 0; */
    /* width: 1230px; */
    width: 1230px;
    position: relative;
    display: inline-block;
}

/*.sec3 main#container > section.w{*/
main#container>section.w{
    max-width: auto;
}
/*
.sec3 main#container {
    padding-top: 0;
}
main#container.mw {
    padding-top: 0;
}
#container {
    padding-top: 0;
}
main.mw {
    padding-top: 0;
}
.mw {
    padding-top: 0;
}
.sec3 body main{
    padding-top: 0;
}
.sec3 body {
    padding-top: 0;
}
*/


#frame_syuso body{
    background-image: linear-gradient(135deg, #eeccaa 10%, #ccaa88 100%);
}

/*
.sec12 section.sec2 { 
    background-image: linear-gradient(135deg, #eeccaa 10%, #ccaa88 100%);
}
header.sp_pd { 
  display: none;
}
#frame_odds body.page-raceinfo{ 
    background-image: linear-gradient(135deg, #eeccaa 10%, #ccaa88 100%);
}
body.page-raceinfo header.sp_pd{ 
    background-image: linear-gradient(135deg, #eeccaa 10%, #ccaa88 100%);
}
*/
header.sp_pd { 
  display: none;
}
header.sp_pd2 { 
  display: block;
}

.sec12 section.sec2 header.sp_pd { 
  display: none;
}

body.page-raceinfo {
    width: 99.7%;
    /* width: 99.7%; */
}



.odds_table_header p .reload {
    visibility: hidden;
}


@media screen and (min-width: 900px), print {
/*
																	body.page-raceinfo .sp_fix_table {
																	    overflow-x: scroll;
																	}
*/
}



@media screen and (min-width: 640px) and (max-width: 899px) {/* ------------------------------- 横スマホ ------------------------------- */



.br_sp1{
    display: inline;
}
.br_no_sp1{
    display: none;
}

/*
.raceinfo_under_block>header h1 {
    font-size: 1.5rem;
}
*/

.R_button label{
    /*     width: 88px; */
    /* height: 50px; */
    padding: 10px 0 0 0;
    /* margin: 5px; */
}

.P_button label{
    height: 50px;
    padding: 10px 0 0 0;
}

.sec0 {
    margin: 0 0 10px 0;
}

.sec12 {
    /* height: auto; */
    height: 440px;
    white-space: normal;
    /* scale: 0.55; */
    /* margin: calc(400px *0.45 *0.5 * -1 *2) calc(620px *0.45 *0.5 * -1); */
    /* width: 620px; */
    width: 100%;
    margin-top: -70px;
    /* margin-bottom: 30px; */
    /* margin-bottom: 90px; */
    margin-bottom: 70px;
}

.sec1 {
transform: scale(0.51);
margin: calc(465px *0.49 *0.5 * -1) calc(640px *0.49 *0.5 * -1);
    /*     transform: scale(0.58); */
    /* margin: calc(465px *0.42 *0.5 * -1) calc(640px *0.42 *0.5 * -1); */
    vertical-align: middle;
}

.sec2 {
    /* top: 150px; */
    /* top: 0; */
    /* top: 72px; */
    /* top: 34px; */
    /* top: 33px; */
    top: 202px;
    /* height: 1150px; */
    /* height: 910px; */
    height: 1040px;
    padding: 0;
    transform: scale(0.32);
    margin: calc(673px *0.68 *0.5 * -1 *2) calc(880px *0.68 *0.5 * -1);
}
/*
body.page-raceinfo {
    overflow-x: scroll;
}
*/

#frame_odds .sp_fix_table {
}

.sec33 {
    /* width: 749px; */
    width: 100%;
    /* max-width: 749px; */
    /* overflow-x: scroll; */
    /* margin-top: 200px; */
    margin: 0 0 50px 0;
}

.sec3 {
    /* max-width: 749px; */
    transform: scale(0.50);
    /* margin: -80px calc(1230px *0.2 *0.5 * -1) calc(2012px *0.2 *0.5 * -1) calc(1230px *0.2 *0.5 * -1); */
    /* margin: -250px calc(1230px *0.7 *0.5 * -1); */
    /* margin: -550px calc(1230px *0.7 *0.5 * -1); */
    margin: -550px calc(1230px *(1 - 0.50) *0.5 * -1);
    overflow: hidden;
}

.sec3b {
    margin: 0 0 5px 0;
}

.touhyo {
    font-size: 16px;
    width: 250px;
}

.banner td{
    padding: 5px;
}

.nashi {
    padding: 20% 0;
}

.nashi0 {
    margin: 0 0 50px 0;
}



}



@media screen and (max-width: 639px) {/* ------------------------------- 縦スマホ ------------------------------- */



.br_sp2{
    display: inline;
}
.br_no_sp2{
    display: none;
}


.tit_img {
    width: 370px;
}

/*
.raceinfo_under_block>header h1 {
    font-size: 1.5rem;
}
*/

.R_button label{
    /* width: 88px; */
    width: 38px;
    /* height: 50px; */
    height: 35px;
    padding: 10px 0 0 0;
    /* margin: 5px; */
}

.P_button label{
    height: 50px;
    padding: 10px 0 0 0;
}

.sec0 {
    margin: 0 0 10px 0;
    /* position: fixed; */
    position: absolute;
    z-index: 100;
    top: 0px;
    width: 100%;
}

.sec12 {
    height: auto;
    white-space: normal;
    /* scale: 0.55; */
    /* margin: calc(400px *0.45 *0.5 * -1 *2) calc(620px *0.45 *0.5 * -1); */
    margin: -40px 0 0 0;
   /* width: 620px; */
    width: 100%;
    vertical-align: top;
}

.sec1 {
    transform: scale(0.56);
    /* margin: calc(465px *0.44 *0.5 * -1) calc(640px *0.44 *0.5 * -1); */
    margin: calc(465px *0.44 *0.5 * -1) calc(666px *0.44 *0.5 * -1);
    vertical-align: top;
    /* position: fixed; */
    position: absolute;
    z-index: 99;
    padding-top: 146px;
    width: 661px;
    background-color: #ffffff;
}

.sec1 .bnr{
    /* visibility: hidden; */
    display: none;
}
.sec1 .w{
    /* left: 10px; */
}

.sec2 {
    /* top: 150px; */
    top: 30px;
    padding: 0;
    transform: scale(0.42);
    margin: calc(673px *0.58 *0.5 * -1 *2) calc(880px *0.58 *0.5 * -1);
    vertical-align: top;
}

.sec2 .bnr{
    display: block;
}

/*
body.page-raceinfo {
    overflow-x: scroll;
}
*/

#frame_odds .sp_fix_table {
}

.sec33 {
    /* width: 749px; */
    width: 100%;
    max-width: 749px;
    /* overflow-x: scroll; */
    /* margin-top: 200px; */
    /* margin: 200px 0 30px 0; */
    /* margin: 0 0 30px 0; */
    margin: -80px 0 30px 0;
}

.sec3 {
    /* max-width: 749px; */
    transform: scale(0.3);
    /* margin: -80px calc(1230px *0.2 *0.5 * -1) calc(2012px *0.2 *0.5 * -1) calc(1230px *0.2 *0.5 * -1); */
    /* margin: -250px calc(1230px *0.7 *0.5 * -1); */
    /* margin: -550px calc(1230px *0.7 *0.5 * -1); */
    margin: calc(1550px *0.7 *0.5 * -1) calc(1230px *0.7 *0.5 * -1);
    overflow: hidden;
}

.sec3b {
    /* margin: 0 0 22px 0; */
    margin: 0 0 4px 0;
}

.sec2 div.w{
    margin-top: 20px;
}

.touhyo {
    font-size: 16px;
    width: 250px;
}

.banner td{
    padding: 5px;
}

.nashi {
    padding: 20% 0;
    /* margin-top: 80px; */
    margin-top: 20px;
}

.nashi0 {
	position: static;
    margin: 0 0 50px 0;
}

.nashi_img {
    width: 100%;
}

#kotei {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	height: 100%;
}



}

@media screen and (max-width: 882px) {

.raceinfo_under_block>header h1 {
    /* font-size: 1.5rem; */
}

}





/* halon_bar
============================================================================================================ */
.halon_bar {
	/* width: 882px; */
	width: auto;
	margin: auto;
	padding-top: 40px;
	padding-bottom: 10px;
}
.halon_bar li {
	position: relative;
	float: left;
	width: 46px;
}
	.halon_bar li:nth-child(1){
	    margin-left: 0px;
	}
.halon_bar li a {
	display: block;
	padding-bottom: 36px;
	text-decoration: none;
	color: #333333;
	background: url(../images/halon_bar_bar.png) no-repeat 50% 60%;
	-webkit-background-size: 16px;
	background-size: 16px;
}
.halon_bar li .box {
	position: relative;
	display: block;
	height: 46px;
	padding-top: 10px;
	background-color: #fff;
	border: 2px solid #333333;
	border-radius: 100%;
	text-align: center;
	font-size: 1.3rem;
	line-height: 1;
	-webkit-transition: all .2s;
	-o-transition: all .2s;
	transition: all .2s;
	z-index: 3;
	top: -10px;
}
.halon_bar li.now::after {
	content: "";
	position: absolute;
	top: -28px;
	left: 5px;
	width: 50px;
	height: 34px;
	background: url(../images/halon_bar_on.png) no-repeat;
	-webkit-background-size: 100%;
	background-size: 100%;
	-webkit-transition: opacity .2s;
	-o-transition: opacity .2s;
	transition: opacity .2s;
}

.halon_bar li .box::before {
	content: "";
	position: absolute;
	top: -3px;
	right: -3px;
	left: -3px;
	bottom: -3px;
	border-radius: 100%;
	background-color: #0063c5;
	-webkit-transition: opacity .2s;
	-o-transition: opacity .2s;
	transition: opacity .2s;
	opacity: 0;
	z-index: -1;
}
.halon_bar li .num {
	font-size: 2.3rem;
}
.halon_bar li + li {
	/* margin-left: 30px; */
	/* margin-left: 27px; */
	margin-left: 23px;
}
.halon_bar li + li::before {
	/* content: ""; */
	content: none;
	position: absolute;
	top: 18px;
	left: -15px;
	margin-left: -6px;
	width: 12px;
	height: 12px;
	background-color: #333333;
	border-radius: 100%;
	pointer-events: none;
}

.halon_bar li.current .box {
	background-color: #0063c5;
	border-color: #0063c5;
	color: #fff;
}
.halon_bar li.current .box::before,
.halon_bar li.current::after {
	opacity: 1;
}

.halon_bar.hmin li > a {
	padding-bottom: 13px;
	background-position: 50% 30px;
}

.halon_bar li.househead {
	/* position: absolute; */
    position: relative;
    padding-top: 34px;
    padding-bottom: 3px;
	/* top: -28px; */
	top: -34px;
	left: 5px;
	width: 50px;
	height: 34px;
	background: url(../images/halon_bar_on.png) no-repeat;
	background-size: cover;
}

/*
	.R_button input:checked+label zzzz{
	    background-color: #0070df;
	    color: #ffffff;
	}
*/

@media screen and (min-width: 640px) and (max-width: 899px) {/* ------------------------------- 横スマホ ------------------------------- */
	.halon_bar li{
	    margin-top: 0px;
	}
	.halon_bar li:nth-child(6n+1){
	    /* margin-left: 27px; */
	    /* margin-left: 23px; */
	}
	.halon_bar li.househead {
	    padding-top: 23px;
	    padding-bottom: 14px;
	    top: -23px;
	}
}
@media screen and (max-width: 639px) {/* ------------------------------- 縦スマホ ------------------------------- */
	.halon_bar li{
	    margin-top: 0px;
	}
	.halon_bar li:nth-child(6n+1){
	    /* margin-left: 27px; */
	    /* margin-left: 23px; */
	}
	.halon_bar li.househead {
	    padding-top: 23px;
	    padding-bottom: 14px;
	    top: -23px;
	}
}

/* @media screen and (min-width: 640px), print { */
@media screen and (min-width: 0px), print {
	.halon_bar li:hover .box ,
	.R_button input:checked+label .box
	{
		background-color: #0063c5;
		border-color: #0063c5;
		color: #fff;
	}
	.halon_bar li:hover .box::before,
	.halon_bar li:hover::after {
		opacity: 1;
	}
}
@media screen and (max-width: 639px) {
	.halon_bar {
	/* width: 286px; */
		padding-top: 0;
	}
	.halon_bar li {
		margin-top: 20px;
		width: 36px;
	}
	.halon_bar li > a {
		padding-bottom: 20px;
		-webkit-background-size: 10px;
		background-size: 10px;
	}
	.halon_bar li.now::after {
		top: -24px;
		right: -4px;
		width: 40px;
	}
	.halon_bar li .box {
		height: 36px;
		padding-top: 7px;
		font-size: 1rem;
	}
	.halon_bar li .num {
		font-size: 1.8rem;
	}
	.halon_bar li + li {
		/* margin-left: 14px; */
	}
	.halon_bar li + li::before {
		top: 15px;
		left: -7px;
		margin-left: -3px;
		width: 6px;
		height: 6px;
	}
	.halon_bar li:nth-child(6n+1) {
	/* margin-left: 0; */
	}
	.halon_bar li:nth-child(6n+1)::before {
		content: none;
	}

	.halon_bar.hmin li > a {
		padding-bottom: 10px;
		background-position: 50% 28px;
	}
}
