@charset "utf-8";
/* CSS Document */

/*--------------------------------------------------------------
# setting:index20241130.html
--------------------------------------------------------------*/
#home.nov header article section div{ position: relative; background: rgba(0,0,0,0.64); width: 90%; margin: 0px auto; padding: 2.0em 0;}
#home.nov header article section div h1{ margin-top: 0.6em}
#home.nov header article section div h4.alerts{ font-size: 3.2rem; line-height: 1.0em; font-weight: 600; color: #FFF; border: solid 2px #FFF; background: rgba(0,0,0,0.4); padding: 0.8em 0; text-align: center; width: 80%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 1000;}
#home.nov header article section div h1,
#home.nov header article section div h2,
#home.nov header article section div p,
#home.nov header article section div h3,
#home.nov header article section div dl dt,
#home.nov header article section div dl dd{ opacity: 0.4;}
#home.nov article.contents.about p.button{ display: block !important; width: 64%; margin: 3.2em auto 0;}
#home.nov .terms .consent,
#home.nov .terms button{ display: none;}

/*--------------------------------------------------------------
# setting:index20241216.html
--------------------------------------------------------------*/
#home.dec header{ width: 100%; padding: 4.8em 1.6em;}
#home.dec header article section div{ position: relative; background: rgba(0,0,0,0.64); width: 90%; margin: 0px auto; padding: 2.0em 0;}
#home.dec header article section div h4.alerts{ font-size: 3.2rem; line-height: 1.0em; font-weight: 600; color: #FFF; border: solid 2px #FFF; background: rgba(0,0,0,0.4); padding: 0.8em 0; text-align: center; width: 80%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 1000;}
#home.dec header article section div h1,
#home.dec header article section div h2,
#home.dec header article section div p,
#home.dec header article section div h3,
#home.dec header article section div dl dt,
#home.dec header article section div dl dd{ opacity: 0.4;}
#home.dec header article section div h1{ margin-top: 0px;}
#home.dec article.contents.about p.button{ display: block !important; width: 64%; margin: 3.2em auto 0;}
#home.dec .terms .consent,
#home.dec .terms button{ display: none;}

/*--------------------------------------------------------------
# Layouts : index
--------------------------------------------------------------*/
#wrapper{ width: 100%; margin: 0px auto; position: relative; overflow: hidden;}

/* header
--------------------------------------------------------------*/
#home header{ width: 100%; background: url("../../images/promo_pc.webp") no-repeat center top; background-size: 220%; position: relative; padding: 3.2em 1.6em;}
#home header:before{ content: ""; width: 100%; height: 100%; background: rgba(0,0,0,0.8); position: absolute; top: 0; left: 0; z-index: 1;}
#home header article{ position: relative; z-index: 100;}
#home header article section{ width: 100%; position: relative; z-index: 100; top: 0; left: 0; transform: translate(0,0);}
#home header article section ul{ width: 80%; margin: 0px auto; display: flex; justify-content: space-between; flex-wrap: wrap; align-items: flex-end; position: relative;}
#home header article section ul:after{ content: "※画像はイメージです。"; font-size: 1.2rem; line-height: 1.2em; position: absolute; bottom: -3.2em; right: 0;}
#home header article section ul li{}
#home header article section ul li img{ width: 100%; height: auto;}
#home header article section ul li:nth-child(1){ width: 75%;}
#home header article section ul li:nth-child(2){ width: 30%; position: absolute; bottom: 0; right: 0; z-index: 10; transform: rotate(10deg);}
#home header article section h1{ font-size: 3.2rem; line-height: 1.4em; font-weight: 900; text-align: center; margin-top: 1.6em;}
#home header article section h1 span{ display: block; font-size: 4.8rem; text-align: center;}
#home header article section h2{ text-align: center; font-size: 4.0rem; line-height: 1.4em; font-weight: 600; color: #ffff24; margin-top: 0.5em;}
#home header article section p{ text-align: center; font-size: 2.4rem; line-height: 1.6em; font-weight: 900; margin-top: 1.0em;}
#home header article section p span{ color: #ffff24;}
#home header article section p span strong{ font-size: 4.0rem; position: relative; top: 0.1em;}
#home header article section h3{ text-align: center; font-size: 2.0rem; line-height: 1.4em; font-weight: 900; margin-top: 1.0em;}
#home header article section h3 strong{ font-size: 3.2rem;}
#home header article section h3:before{ content: "応募受付期間"; border: solid 1px #FFF; font-size: 1.6rem; line-height: 1.2em; letter-spacing: 0; padding: 0.25em 0.64em 0.35em; margin-right: 1.0em; position: relative; top: -0.5em;}
#home header article section dl{ display: flex; justify-content: center; flex-wrap: wrap; align-items: center; margin-top: 2.0em;}
#home header article section dl dt{ line-height: 1.2em; margin-right: 1.0em;}
#home header article section dl dd{ line-height: 1.4em;}

br.spbr{ display: none;}

/* main
--------------------------------------------------------------*/
article.contents{ width: 100%; padding: 8.0rem 0; position: relative;}
article.contents section{ width: 90%; margin: 0px auto;}

/*---------- terms ----------*/
article.contents.terms{}
article.contents.terms h2{ font-size: 4.0rem; line-height: 102px; letter-spacing: 0.24em; font-weight: 900; text-align: center; background: url("../../images/title_terms.webp") no-repeat center center; background-size: contain;}
article.contents.terms div.rule{ width: 80%; height: 400px; padding: 1.6em; margin: 2.0em auto 0; background: #FFF; overflow-y: auto;}
article.contents.terms div.rule p{ color: #333;}
article.contents.terms div.rule dl{}
article.contents.terms div.rule dl dt{ color: #333; font-weight: 500; margin-top: 1.6em;}
article.contents.terms div.rule dl dd{ color: #333;}
article.contents.terms div.rule dl dd ul{}
article.contents.terms div.rule dl dd ul li{ padding-left: 1.0em; position: relative;}
article.contents.terms div.rule dl dd ul li:before{ content: "・"; position: absolute; top: 0; left: 0;}
article.contents.terms div.rule a{ color: #333; text-decoration: underline;}
article.contents.terms div.rule a:hover{ text-decoration: none;}
article.contents.terms form{ text-align: center;}
article.contents.terms form div.consent{ display: flex; justify-content: center; margin: 1.6em auto;}
article.contents.terms form div.consent label{ order: 2; font-size: 2.4rem; line-height: 1.2em; font-weight: 500; cursor: pointer;}
article.contents.terms form div.consent input[type="checkbox"]{ order: 1; transform: scale(1.8); margin-right: 1.0em; cursor: pointer;}
article.contents.terms form button{ width: 60%; padding:0; margin:0; background:none; border:0; font-size:0; line-height:0; overflow:visible; cursor:pointer; appearance: none; -webkit-appearance: none;}
article.contents.terms form button img{ width: 100%; height: auto;}

/*---------- about ----------*/
article.contents.about{ background: url("../../images/background_about_pc.webp") no-repeat center center; background-size: 150%;}
article.contents.about h2{ width: 100%x; margin: 0px auto;}
article.contents.about h2 img{ width: 100%; height: auto;}
article.contents.about p.description{ font-size: 2.4rem; line-height: 1.4em; font-weight: 600; text-align: center; color: #ffffaa; text-shadow: 0 0 8px rgba(0,0,0,0.24);}
article.contents.about h3{ text-align: center; margin: 2.4em auto 0;}
article.contents.about h3 span{ display: inline-block; font-size: 2.4rem; line-height: 1.2em; font-weight: 600; border: solid 1px #FFF; padding: 0.25em 1.6em; border-radius: 100px;}
article.contents.about p.download{ text-align: center; margin-top: 1.0em;}
article.contents.about p.button{ display: none; /* width: 64%; margin: 3.2em auto 0;*/}
article.contents.about p.button a{ display: block; font-size: 2.4rem; line-height: 1.2em; font-weight: 900; color: #111; text-decoration: none; padding: 0.5em 0; text-align: center; border-radius: 100px; background: #ffff00;}
article.contents.about p.button a span{ display: inline-block; padding-right: 1.0em; position: relative;}
article.contents.about p.button a span:after{ content: "\f0da"; font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; top: 55%; transform: translateY(-50%); right: 0; transition: all 0.3s ease 0s;}
article.contents.about p.button a:hover span:after{ right: 0.16em;}
article.contents.about p.button a:hover{}
article.contents.about dl{ width: 100%; margin: 3.2em auto 0; padding-top: 1.0em; border-top: solid 1px #FFF; position: relative; padding-left: 32.0rem;}
article.contents.about dl:before{ content: ""; width: 300px; height: 200px; background: url("../../images/silhouette.webp") no-repeat; background-size: contain; position: absolute; top: -2.0rem; left: 0; z-index: 10;}
article.contents.about dl dt{ font-size: 2.0rem;}
article.contents.about dl dd{}

/*---------- spat4 ----------*/
article.contents.spat4{}
article.contents.spat4 h2{ font-size: 2.4rem; line-height: 1.4em; font-weight: 600; text-align: center; color: #ffffaa;}
article.contents.spat4 ul{ display: flex; justify-content: center; flex-wrap: wrap; width: 80%; margin: 2.4em auto 0;}
article.contents.spat4 ul li{ width: 48%;}
article.contents.spat4 ul li:nth-child(n+2){ margin-left: 4%;}
article.contents.spat4 ul li img{ width: 100%; height: auto;}
article.contents.spat4 ul li a{ display: block; border: solid 1px #003285; border-radius: 16px; box-shadow: 0 4px 0 #003285; overflow: hidden; position: relative; top: 0;}
article.contents.spat4 ul li a:hover{ box-shadow: none; top: 4px;}
article.contents.spat4 p{ text-align: center; width: 80%; margin: 4.0rem auto 0;}

/*---------- faq ----------*/
.faq{ width: 80%; height: 700px; padding: 1.6em; margin: 4.0rem auto 0; border: solid 1px #FFF; border-radius: 16px; overflow-y: auto;}
.faq h3{ font-size: 2.4rem; line-height: 1.2em; text-align: center; font-weight: 600;}
.faq dl{}
.faq dl dt{ font-size: 2.0rem; line-height: 1.4em; font-weight: 600; margin-top: 1.6em; padding-left: 1.5em; position: relative;}
.faq dl dt:before{ content: "Q"; position: absolute; top: 0; left: 0;}
.faq dl dd{ font-size: 2.0rem; line-height: 1.6em; margin-top: 0.5em; padding-left: 1.5em; padding-bottom: 1.6em; border-bottom: solid 1px #FFF; position: relative;}
.faq dl dd:before{ content: "A"; position: absolute; top: 0; left: 0;}
.faq dl dd:last-child{ padding-bottom: 0; border-bottom: none;}

/* footer
--------------------------------------------------------------*/
#home ooter{}
#home #footerInfo{ background: #9b7e00; padding: 4.8rem 0;}
#home #footerInfo section{ width: 100%; margin: 0px auto; text-align: center;}
#home #footerInfo section h2{ font-size: 3.2rem; line-height: 1.2em; text-align: center; font-weight: 600;}
#home #footerInfo section h3{ font-size: 2.0rem; line-height: 1.2em; text-align: center; margin-top: 1.6rem;}
#home #footerInfo section dl{ margin-top: 1.0em;}
#home #footerInfo section dl dt{ text-align: center;}
#home #footerInfo section dl dd{ text-align: center;}

#copyright{ padding: 1.6rem 0;}
#copyright p{ text-align: center; line-height: 1.2em;}


/*--------------------------------------------------------------
# Layouts : download
--------------------------------------------------------------*/

/* header : download
--------------------------------------------------------------*/
#download header{ width: 100%; padding-bottom: 55%; background: url("../../images/download_promo.webp") no-repeat center center; background-size: 150%; position: relative;}
#download header article{ width: 90%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 100;}
#download header article section{ position: relative;}
#download header article section h1{ width: 75%; margin-bottom: 1.4em; position: relative; left: -5%;}
#download header article section h1 img{ width: 100%; height: auto;}
#download header article section ul:after{ content: "※画像はイメージです。"; font-size: 1.0rem; line-height: 1.2em; position: absolute; bottom: 0; right: 0; z-index: 100;}
#download header article section ul li{ position: absolute; bottom: 0; right: 12%; width: 22%; z-index: 100;}
#download header article section ul li:nth-child(2){ top: 0; right: 0; z-index: 99;}
#download header article section ul li img{ width: 100%; height: auto; box-shadow: 0 8px 16px rgba(0,0,0,0.32);}
#download header article section h2{ width: 65%; font-size: 2.8rem; line-height: 1.6em; font-weight: 900; color: #ffffaa; display: inline; background:linear-gradient(transparent 95%, rgba(255,255,170,0.6) 0%);}
#download header article section p{ width: 65%; font-size: 1.6rem; line-height: 1.6em; margin-top: 1.0em;}
#download header article section p br{ display: none;}
#download header article section h3{ margin-top: 1.0em;}
#download header article section h3 span{ display: inline-block; font-size: 2.0rem; font-weight: 700; color: #FFF; border: solid 1px #FFF; border-radius: 100px; padding: 0.32em 2.4em;}

@media screen and (min-width:768px) and (max-width:1024px) {
#download header{ width: 100%; padding-bottom: 150%; background: url("../../images/download_promo_sp.webp") no-repeat center top #000; background-size: 100%; position: relative;}
#download header article{ width: 90%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 100;}
#download header article section{ position: relative; text-align: center;}
#download header article section h1{ width: 90%; margin: 0 auto 1.0em;}
#download header article section h1 img{ width: 100%; height: auto;}
#download header article section ul{ width: 80%; margin: 4.0rem auto 8.0rem; position: relative; z-index: 100;}
#download header article section ul:after{ content: "※画像はイメージです。"; font-size: 1.2rem; line-height: 1.2em; position: absolute; top: 105%; left: 0; z-index: 100;}
#download header article section ul li{ width: 55%; position: relative; z-index: 100; bottom: 0; right: 0;}
#download header article section ul li:nth-child(2){ position: absolute; top: 10%; right: 0; z-index: -1;}
#download header article section ul li img{ width: 100%; height: auto; box-shadow: 0 8px 16px rgba(0,0,0,0.32);}
#download header article section h2{ width: 100%; font-size: 3.2rem; line-height: 1.6em; font-weight: 900; color: #ffffaa; display: inline; background:linear-gradient(transparent 95%, rgba(255,255,170,0.6) 0%);}
#download header article section p{ width: 100%; font-size: 2.0rem; line-height: 1.8em; margin-top: 1.0em; text-align: center;}
#download header article section p br{ display: none;}
#download header article section h3{ margin-top: 1.0em; text-align: center;}
#download header article section h3 span{ display: inline-block; font-size: 2.0rem; font-weight: 700; color: #FFF; border: solid 1px #FFF; border-radius: 100px; padding: 0.32em 2.4em;}
}

/* main : download
--------------------------------------------------------------*/
#download main{ background: linear-gradient(#f4e9d4, #603813);}

/*---------- intro ----------*/
article.contents.intro{ background: url("../../images/download_texture.webp") no-repeat center top; background-size: 100%;}
article.contents.intro p{ font-size: 2.4rem; line-height: 1.4em; text-align: center; font-weight: 600; color: #111;}
article.contents.intro .btnList{ width: 80%; margin: 4.0rem auto 0; display: flex; justify-content: space-between; flex-wrap: wrap;}
article.contents.intro .btnList li{ width: 48.5%;}
article.contents.intro .btnList li:nth-child(n+3){ margin-top: 2.4rem;}
article.contents.intro .btnList li a{ display: block; font-size: 2.0rem; line-height: 1.2em; font-weight: 700; text-decoration: none; color: #FFF; background: #333; border-radius: 8px; padding: 1.2em 0; text-align: center;}
article.contents.intro .btnList li:nth-child(1) a{ background: rgba(2,0,134,1);}
article.contents.intro .btnList li:nth-child(1) a:hover{ background: rgba(2,0,134,0.6);}
article.contents.intro .btnList li:nth-child(2) a{ background: rgba(0,141,0,1);}
article.contents.intro .btnList li:nth-child(2) a:hover{ background: rgba(0,141,0,0.6);}
article.contents.intro .btnList li:nth-child(3) a{ background: rgba(208,2,1,1);}
article.contents.intro .btnList li:nth-child(3) a:hover{ background: rgba(208,2,1,0.6);}
article.contents.intro .btnList li:nth-child(4) a{ background: rgba(59,142,255,1);}
article.contents.intro .btnList li:nth-child(4) a:hover{ background: rgba(59,142,255,0.6);}

@media screen and (min-width:768px) and (max-width:1024px) {
article.contents.intro .btnList{ width: 100%;}
}

/*---------- modal ----------*/
.modal-open{ color: #fff !important; font-size: 2.0rem; line-height: 1.0em; font-weight: 700; background: #d00201; padding: 1.0em 3.0em; border-radius: 100px; width: 80%; margin: 1.0em auto 0; cursor: pointer; position: relative; transition: all 0.3s ease 0s;}
.modal-open:after{ content: "\f04b"; font-family: "Font Awesome 6 Free"; font-weight: 600; position: absolute; top: 50%; right: 1.5em; transform: translateY(-50%);}
.modal-open:hover{ color: #FFF; background: #B40201;}
.modal{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; text-align: center; background: rgba(0,0,0,0.8); padding: 0; overflow: auto; opacity: 0; visibility: hidden; transition: .3s; box-sizing: border-box;z-index: 9999;}
.modal:before{ content: ""; display: inline-block; vertical-align: middle; height: 100%; margin-left: -0.2em;}
.modal.is-active{ opacity: 1; visibility: visible;}
.modal-container{ position: relative; display: inline-block; vertical-align: middle; max-width: 1200px; width: 90%;}
.modal-close{ position: absolute; top: -80px; right: 0; width: 60px; height: 60px; cursor: pointer;}
.modal-close img{ width: 100%; height: auto;}
.modal-content{ background: #fff; padding: 2.0em; text-align: center;}
.modal-content h3{ width: 70%; margin: 0px auto;}
.modal-content h3 img{ width: 100%; height: auto;}
.modal-content h5{ font-size: 2.4rem; line-height: 1.2em; font-weight: 700; color: #754c24; padding-left: 131px; position: relative; margin-top: 2.0em; display: inline-block;}
.modal-content h5:before{ content: ""; width: 121px; height: 49px; background: url("../../images/modal/modal_silhouette.png") no-repeat; background-size: contain; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.modal-content .clm{ display: flex; justify-content: space-between; flex-wrap: wrap;}
.modal-content .clm .racecourse{ width: 48%; display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 2.0em;}
.modal-content .clm .racecourse h4{ font-size: 2.4rem; line-height: 1.2em; text-align: center; font-weight: 700; width: 100%; padding-bottom: 0.5em; margin-bottom: 0.25em;}
.modal-content .clm .racecourse .rnk01,
.modal-content .clm .racecourse .rnkList{ width: 48%;}

.modal-content .clm .racecourse .rnk01 .image{ position: relative; display: block;}
.modal-content .clm .racecourse .rnk01 .image:before{ content: ""; width: 40px; height: 40px; background: url("../../images/modal/modal_no_01.png") no-repeat; background-size: contain; position: absolute; top: -1.6rem; left: -1.6rem; z-index: 10;}
.modal-content .clm .racecourse .rnk01 .image img{ width: 100%; height: auto;}
.modal-content .clm .racecourse .rnk01 dl{ margin-top: 0.5em;}
.modal-content .clm .racecourse .rnk01 dl dt{ font-size: 2.0rem; line-height: 1.2em; text-align: center; font-weight: 700; color: #333;}
.modal-content .clm .racecourse .rnk01 dl dd{ font-size: 2.0rem; line-height: 1.2em; text-align: center; font-weight: 700; color: #333;}

.modal-content .clm .racecourse .rnkList dl{ padding-left: 3.2rem; position: relative;}
.modal-content .clm .racecourse .rnkList dl + dl{ margin-top: 1.0em;}
.modal-content .clm .racecourse .rnkList dl dt,
.modal-content .clm .racecourse .rnkList dl dd{ font-size: 1.4rem; line-height: 1.2em; font-weight: 700; color: #333;}
.modal-content .clm .racecourse .rnkList dl dt br{ display: none;}
.modal-content .clm .racecourse .rnkList dl:nth-child(1):before{ content: ""; width: 24px; height: 24px; background: url("../../images/modal/modal_no_02.png") no-repeat; background-size: contain; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.modal-content .clm .racecourse .rnkList dl:nth-child(2):before{ content: ""; width: 24px; height: 24px; background: url("../../images/modal/modal_no_03.png") no-repeat; background-size: contain; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.modal-content .clm .racecourse .rnkList dl:nth-child(3):before{ content: ""; width: 24px; height: 24px; background: url("../../images/modal/modal_no_04.png") no-repeat; background-size: contain; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}

.modal-content .clm .racecourse.urawa h4{ background: url("../../images/modal/modal_head_bg_01.png") no-repeat center bottom; background-size: contain;}
.modal-content .clm .racecourse.funabashi h4{ background: url("../../images/modal/modal_head_bg_02.png") no-repeat center bottom; background-size: contain;}
.modal-content .clm .racecourse.oi h4{ background: url("../../images/modal/modal_head_bg_03.png") no-repeat center bottom; background-size: contain;}
.modal-content .clm .racecourse.kawasaki h4{ background: url("../../images/modal/modal_head_bg_04.png") no-repeat center bottom; background-size: contain;}

.modal-content .clm .racecourse.urawa h4{ color: #020086;}
.modal-content .clm .racecourse.funabashi h4{ color: #0d950d;}
.modal-content .clm .racecourse.oi h4{ color: #e60000;}
.modal-content .clm .racecourse.kawasaki h4{ color: #008dff;}

/*---------- select ----------*/
article.contents.select{ padding: 0;}
article.contents.select section{ background: #FFF; padding: 4.0rem;}
article.contents.select h2{ width: 70%; margin: 0px auto; position: relative;}
article.contents.select h2:after{ content: ""; width: 160px; height: 97px; background: url("../../images/select_icon.webp") no-repeat; background-size: contain; position: absolute; top: 90%; right: -10%;}
article.contents.select h2 img{ width: 100%; height: auto;}
article.contents.select p{ text-align: center; color: #111; line-height: 1.6em; margin-top: 1.0em; font-weight: 600;}
article.contents.select section > h4{ text-align: center; font-size: 2.4rem; line-height: 1.2em; font-weight: 700; color: #754c24; margin-top: 1.0em; display: none;}
article.contents.select .block{ margin-top: 4.0rem; background: #fff6d6; display: flex; justify-content: space-between; flex-wrap: wrap;}
article.contents.select .block h3{ width: 10%; display: flex; justify-content: center; flex-wrap: wrap; align-items: center; background: #754c24;}
article.contents.select .block h3 span{ font-size: 3.2rem; line-height: 1.2em; color: #FFF; font-weight: 900;}
article.contents.select .block .column{ width: 90%; overflow: auto;}
article.contents.select .block .column .scrool{ display: flex; justify-content: space-between; flex-wrap: wrap; padding: 1.6em;}
article.contents.select .block .column .scrool .inner{ width: 23.5%;}
article.contents.select .block .column .scrool .inner .image{ margin-top: 0;}
article.contents.select .block .column .scrool .inner .image img{ width: 100%; height: auto;}
article.contents.select .block .column .scrool .inner dl{ margin-top: 1.0em;}
article.contents.select .block .column .scrool .inner dl dt{ text-align: center; font-size: 1.6rem; line-height: 1.2em; font-weight: 700; color: #111;}
article.contents.select .block .column .scrool .inner dl dt label{ cursor: pointer;}
article.contents.select .block .column .scrool .inner dl dt input{ margin-right: 0.5em;}
article.contents.select .block .column .scrool .inner dl dd{}
article.contents.select .block .column .scrool .inner dl dd ul{ margin-top: 1.0em;}
article.contents.select .block .column .scrool .inner dl dd ul li{ font-size: 1.4rem; line-height: 1.4em; margin-top: 0.5em; position: relative; color: #111; font-weight: 600;}
article.contents.select .block .column .scrool .inner dl dd ul li:nth-child(1){ padding-left: 5.5em;}
article.contents.select .block .column .scrool .inner dl dd ul li:nth-child(2){ padding-left: 5.5em;}
article.contents.select .block .column .scrool .inner dl dd ul li:nth-child(1):before{ content: "レース名："; position: absolute; top: 0; left: 0; text-align-last:justify; text-align:justify; width: 5.5em;}
article.contents.select .block .column .scrool .inner dl dd ul li:nth-child(2):before{ content: "優勝馬："; position: absolute; top: 0; left: 0; text-align-last:justify; text-align:justify; width: 5.5em;}

@media screen and (min-width:768px) and (max-width:1024px) {
article.contents.select h2:after{ content: none !important;}
article.contents.select .block h3{ width: 20%; display: flex; justify-content: center; flex-wrap: wrap; align-items: center; background: #754c24;}
article.contents.select section > h4{ text-align: center; font-size: 2.4rem; line-height: 1.2em; font-weight: 700; color: #754c24; margin-top: 1.0em; display: block !important;}
article.contents.select .block .column{ width: 80%; overflow: auto;}
article.contents.select .block .column .scrool{ display: flex; justify-content: space-between; flex-wrap: wrap; padding: 1.6em; width: 200%;}
}

article.contents.select .block.sup01,
article.contents.select .block.sup02{ position: relative;}
article.contents.select .block.sup01:after{ content: "※JBCクラシック以外の写真は2023年のレース写真です。2025年1月下旬に2024年のレース写真へ更新予定です。"; font-size: 1.2rem; line-height: 1.2em; position: absolute; top: 102%; left: 0; color: #111;}
article.contents.select .block.sup02:after{ content: "※写真は2023年のレース写真です。2025年1月下旬に2024年のレース写真へ更新予定です。"; font-size: 1.2rem; line-height: 1.2em; position: absolute; top: 102%; left: 0; color: #111;}

/*---------- button ----------*/
.dlBtn{ text-align: center;}
.dlBtn button{ border: none; padding: 0; margin: 0; background: none; cursor: pointer;}
.dlBtn button img{ width: 100%; height: auto;}

/*---------- Application Terms ----------*/
.applicationTerms{ width: 100%; margin: 8.0rem auto 0;}
.applicationTerms h4{ font-size: 4.0rem; line-height: 1.2em; font-weight: 700; color: #FFF; letter-spacing: 0.2em; text-align: center;}
.applicationTerms .inner{ background: #FFF; overflow: auto; padding: 2.0em; height: 400px; margin-top: 1.0em;}
.applicationTerms .inner p{ color: #333;}
.applicationTerms .inner p + p{ margin-top: 1.6em;}
.applicationTerms .inner dl dt{ font-weight: 700; margin-top: 1.6em; color: #333;}
.applicationTerms .inner dl dd{ color: #333; margin-top: 0.48em;}
.applicationTerms .inner dl dd ul{ padding-left: 1.6em;}
.applicationTerms .inner dl dd ul li{ position: relative; list-style-type: decimal-leading-zero; list-style-position: outside;}

/* footer : download
--------------------------------------------------------------*/
#download footer{}
#download #footerInfo{ padding: 8.0rem 0 4.0rem 0;}
#download #footerInfo section{ width: 90%; margin: 0px auto;}
#download #footerInfo section h2{ width: 45%; margin: 0px auto;}
#download #footerInfo section h2 img{ width: 100%; height: auto;}
#download #footerInfo section h3{ width: 45%; margin: 1.0em auto 0; display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center;}
#download #footerInfo section h3 span{ font-size: 2.4rem; line-height: 1.2em; font-weight: 700;}
#download #footerInfo section ul.partner{ display: flex; justify-content: center; flex-wrap: wrap; align-items: center; margin-top: 4.0rem;}
#download #footerInfo section ul.partner li:nth-child(n+2){ margin-left: 2.4em;}
#download #footerInfo section .partnerList{ display: flex; justify-content: center; flex-wrap: wrap; align-items: center; margin-top: 4.0rem;}
#download #footerInfo section .partnerList h4{ font-weight: 700; font-size: 2.4rem;}
#download #footerInfo section .partnerList ul{ display: flex; justify-content: space-between; flex-wrap: wrap; margin-left: 4.0em;}
#download #footerInfo section .partnerList ul li{ font-size: 2.4rem;}
#download #footerInfo section .partnerList ul li:nth-child(n+2){ margin-left: 2.0em;}
#download #footerInfo section h5{ font-size: 2.4rem; line-height: 1.2em; font-weight: 700; text-align: center; margin-top: 4.0rem;}
#download #footerInfo section dl{}
#download #footerInfo section dl dt{ text-align: center; margin-top: 1.0em;}
#download #footerInfo section dl dd{ text-align: center;}

@media screen and (min-width:768px) and (max-width:1024px) {
#download footer{}
#download #footerInfo{ padding: 8.0rem 0 4.0rem;}
#download #footerInfo section{ width: 90%; margin: 0px auto;}
#download #footerInfo section h2{ width: 80%; margin: 0px auto;}
#download #footerInfo section h2 img{ width: 100%; height: auto;}
#download #footerInfo section h3{ width: 80%; margin: 1.0em auto 0; display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center;}
#download #footerInfo section h3 span{ font-size: 2.4rem; line-height: 1.2em; font-weight: 700;}
#download #footerInfo section ul.partner{ display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; width: 60%; margin: 2.4rem auto 0;}
#download #footerInfo section ul.partner li{ width: 20%; margin: 0 !important;}
#download #footerInfo section ul.partner li img{ width: 100%; height: auto;}
#download #footerInfo section .partnerList{ margin-top: 2.4rem;}
#download #footerInfo section .partnerList h4{ font-weight: 700; font-size: 2.0rem; text-align: center;}
#download #footerInfo section .partnerList ul{ display: flex; justify-content: center; flex-wrap: wrap; width: 80%; margin: 1.0em auto;}
#download #footerInfo section .partnerList ul li{ font-size: 2.0rem; width: 25%; text-align: center; margin: 0 !important;}
#download #footerInfo section h5{ font-size: 2.0rem; line-height: 1.2em; font-weight: 700; text-align: center; margin-top: 4.0rem;}
#download #footerInfo section dl{}
#download #footerInfo section dl dt{ text-align: center; margin-top: 0.5em; font-size: 1.4rem;}
#download #footerInfo section dl dd{ text-align: center; font-size: 1.4rem;}
}