@charset "UTF-8";

:root {
  --color-monotone-900: #000;
  --color-monotone-800: #333;
  --color-monotone-700: #999;
  --color-monotone-600: #a3a3a3;
  --color-monotone-500: #d6d6d6;
  --color-monotone-400: #e5e5e5;
  --color-monotone-300: #eee;
  --color-monotone-200: #f1f1f1;
  --color-monotone-100: #f7f7f7;
  --color-monotone-0: #fff;
  --color-green-600: #479959;
  --color-green-500: #4db477;
  --color-green-100: #ecf8f1;
  --color-cyan-900: #036;
  --color-cyan-600: #4e9cb6;
  --color-cyan-500: #2aaeda;
  --color-cyan-100: #e5f5fa;
  --color-purple-900: #50003d;
  --color-purple-600: #8261ac;
  --color-purple-500: #9674e0;
  --color-purple-100: #f2edf9;
  --color-lime-500: #28ba00;
  --color-lime-400: #72b200;
  --color-lime-200: #aad763;
  --color-blue-600: #0086fa;
  --color-blue-500: #299bfc;
  --color-gold-600: #a77601;
  --color-gold-500: #cb8b0e;
  --color-gold-400: #d69e00;
  --color-gold-100: #fef1e9;
  --color-orange-700: #ff5200;
  --color-orange-500: #f07800;
  --color-orange-400: #ff8400;
  --color-orange-300: #f90;
  --color-red-900: #ba3131;
  --color-red-700: #cc0621;
  --color-red-650: #e60012;
  --color-red-600: #ef3639;
  --color-red-500: #dd654b;
  --color-red-400: #ef7777;
  --color-red-350: #f4907d;
  --color-red-300: #f0bdc4;
  --color-red-200: #fdecec;
  --color-red-100: #ffefec;
  --color-pink-500: #f428cc;
  --theme-text-default: var(--color-monotone-800);
  --theme-surface-default: var(--color-monotone-0);
  --theme-list-divider: var(--color-monotone-300);
  --theme-op-600: var(--color-gold-600);
  --theme-op-500: var(--color-gold-500);
  --theme-op-100: var(--color-gold-100);
  --theme-keiba-600: var(--color-green-600);
  --theme-keiba-500: var(--color-green-500);
  --theme-keiba-100: var(--color-green-100);
  --theme-keirin-900: var(--color-cyan-900);
  --theme-keirin-600: var(--color-cyan-600);
  --theme-keirin-500: var(--color-cyan-500);
  --theme-keirin-100: var(--color-cyan-100);
  --theme-autorace-900: var(--color-purple-900);
  --theme-autorace-600: var(--color-purple-600);
  --theme-autorace-500: var(--color-purple-500);
  --theme-autorace-100: var(--color-purple-100);
  --theme-loto-600: var(--color-red-500);
  --theme-loto-500: var(--color-red-400);
  --theme-loto-100: var(--color-red-100);
  --theme-vote: var(--color-orange-400);
  --theme-beginner: var(--color-lime-200);
  --theme-grade-graded: var(--color-gold-400);
  --theme-grade-gp: var(--color-orange-500);
  --theme-grade-open: var(--color-monotone-700);
  --theme-grade-jpn1: var(--color-red-600);
  --theme-grade-jpn2: var(--color-blue-500);
  --theme-grade-jpn3: var(--color-lime-500);
  --theme-grade-g1: var(--color-orange-700);
  --theme-grade-g2: var(--color-blue-600);
  --theme-grade-g3: var(--color-lime-400);
  --theme-grade-f1: var(--color-orange-300);
  --theme-grade-f2: var(--color-monotone-600);
  --theme-grade-sg: var(--color-pink-500);
}

section.op-main {
  width: unset;
  float: unset;
  background-color: var(--theme-surface-default);
  color: var(--theme-text-default);
  font-family:
    "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
  font-size: 14px;
  line-height: 1.6;
}

section.op-main a:link,
section.op-main a:visited,
section.op-main a:active,
section.op-main a:hover {
  color: var(--theme-text-default);
}

section.op-main::after {
  float: unset;
}

section.op-main > * {
  float: unset;
}

section.op-main > *::after {
  content: '';
  clear: both;
}

section.op-main > * > * {
  float: unset;
}

section.op-main > * > *::after {
  content: '';
  clear: both;
}

section.op-main h2.title,
section.op-main h3.title {
  width: unset;
  height: unset;
  float: unset;
  clear: unset;
  color: unset;
  text-align: unset;
}

section.op-main h2.title::after,
section.op-main h3.title::after {
  content: '';
  clear: both;
}

section.op-main h2.title.ST {
  display: grid;
  grid-template-columns: 1fr 24px;
  align-items: center;
  justify-content: space-between;
  padding: 11px 16px 8px;
  column-gap: 8px;
  background-color: var(--color-monotone-700);
  background-image: unset;
  color: var(--color-monotone-0);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  text-align: unset !important;
}

section.op-main h2.title.ST .ico-openclose {
  display: grid;
  position: unset;
  width: 24px;
  height: 24px;
  border-radius: 4px;
  background: unset;
  background-color: var(--color-monotone-0);
  place-items: stretch;
}

section.op-main h2.title.ST .ico-openclose span {
  color: unset !important;
  font-size: 0;
}

section.op-main h2.title.ST .ico-openclose span::before,
section.op-main h2.title.ST .ico-openclose span::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  transition: opacity 0.15s cubic-bezier(0.23, 1, 0.32, 1);
  border-radius: 3px;
  background-color: var(--theme-text-default);
}

section.op-main h2.title.ST .ico-openclose span::before {
  width: 14px;
  height: 2px;
}

section.op-main h2.title.ST .ico-openclose span::after {
  width: 2px;
  height: 14px;
}

section.op-main h2.title.ST .ico-openclose span.close::after {
  opacity: 0;
}

section.op-main h3.title {
  padding: 6px 10px;
  column-gap: 2px;
  border-top: var(--color-monotone-700) solid 1px;
  background: unset;
  background-color: var(--color-monotone-300);
  font-weight: 400;
  line-height: 1.4;
}

section.op-main h3.title span {
  color: var(--color-red-700);
  font-weight: 700;
}

section.op-main h3.title span:first-child {
  padding-right: 0.45em;
}

section.op-main input,
section.op-main textarea,
section.op-main select {
  font-family: inherit;
}

section.op-main ul {
  border-radius: 0;
  font-family:
    "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
  font-weight: 400;
}

section.op-main ul li {
  border-radius: 0;
}

section.op-main em {
  font-style: normal;
  font-weight: 700;
}

section.op-main article {
  width: unset;
}

section.op-main .op-main-hidden-title {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

section.op-main .op-main-section {
  float: unset;
}

section.op-main .op-main-section-inner {
  padding: 16px;
  float: unset;
}

section.op-main .op-main-section-inner > *:last-child {
  margin-bottom: 0;
}

section.op-main .op-main-section-inner--pa0 {
  padding: 0;
}

section.op-main .op-main-section-inner--px0 {
  padding-right: 0;
  padding-left: 0;
}

section.op-main .op-main-section-inner--pt0 {
  padding-top: 0;
}

section.op-main .op-main-section-inner--pt1 {
  padding-top: 8px;
}

section.op-main .op-main-section-inner--pb0 {
  padding-bottom: 0;
}

section.op-main .op-main-section-inner--py0 {
  padding-top: 0;
  padding-bottom: 0;
}

section.op-main .op-main-section-inner--mx-1 {
  width: auto;
  margin-right: -8px;
  margin-left: -8px;
}

section.op-main .op-main-section-inner--mx-2 {
  width: auto;
  margin-right: -16px;
  margin-left: -16px;
}

section.op-main .op-main-section-inner:last-child {
  padding-bottom: 32px;
}

section.op-main .op-main-section-inner:has(+ .op-main-section-inner) {
  padding-bottom: 0;
}

section.op-main .op-main-section-inner2 {
  padding: 16px;
  float: unset;
}

section.op-main .op-main-section-inner2 > *:last-child {
  margin-bottom: 0;
}

section.op-main .op-main-section-inner2--pa0 {
  padding: 0;
}

section.op-main .op-main-section-inner2--px0 {
  padding-right: 0;
  padding-left: 0;
}

section.op-main .op-main-section-inner2--pt0 {
  padding-top: 0;
}

section.op-main .op-main-section-inner2--pt1 {
  padding-top: 8px;
}

section.op-main .op-main-section-inner2--pb0 {
  padding-bottom: 0;
}

section.op-main .op-main-section-inner2--py0 {
  padding-top: 0;
  padding-bottom: 0;
}

section.op-main .op-main-section-inner2--mx-1 {
  width: auto;
  margin-right: -8px;
  margin-left: -8px;
}

section.op-main .op-main-section-inner2--mx-2 {
  width: auto;
  margin-right: -16px;
  margin-left: -16px;
}

section.op-main .op-main-section-inner2:last-child {
  padding-bottom: 24px;
}

section.op-main .op-main-section-inner2:has(+ .op-main-section-inner2) {
  padding-bottom: 0;
}

.sp-content:has(.op-footer) footer {
  margin-top: 0;
}

section.op-main .op-page-heading {
  padding: 12px 16px;
  float: unset;
  background-color: var(--color-monotone-300);
  text-shadow: unset;
}

section.op-main .op-page-heading__text {
  display: block;
  color: var(--color-monotone-800);
  font-size: 14px;
}

section.op-main .op-content-heading {
  float: unset;
  text-shadow: unset;
}

section.op-main .op-content-heading--level1 {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  justify-content: space-between;
  padding: 8px 16px;
  background-color: var(--color-monotone-800);
  color: var(--color-monotone-0);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
}

section.op-main .op-content-heading--level1 .op-content-heading__text {
  display: grid;
  align-items: center;
  min-height: 24px;
  padding-top: 0.2em;
  font-weight: 700;
}

section.op-main .op-content-heading a {
  display: block;
  color: var(--theme-text-default);
}

section.op-main .op-icon-wrapper {
  display: grid;
  place-items: center;
}

section.op-main .op-icon-wrapper::after {
  display: none;
}

section.op-main .op-icon-wrapper--md {
  width: 24px;
  height: 24px;
}

section.op-main .op-icon-wrapper--lg {
  width: 32px;
  height: 32px;
}

section.op-main .op-icon-wrapper--squared,
section.op-main .op-icon-wrapper--rounded {
  background-color: var(--theme-surface-default);
}

section.op-main .op-icon-wrapper--squared {
  border-radius: 4px;
}

section.op-main .op-icon-wrapper--rounded {
  padding-top: 1px;
  border-radius: 100px;
}

section.op-main .op-button-wrapper {
  display: grid;
  align-items: center;
  justify-content: center;
  float: unset;
}

section.op-main .op-button {
  display: inline-flex;
  position: relative;
  min-width: 168px;
  max-width: 100%;
  min-height: 56px;
  padding: 16px;
  border: 1px solid var(--theme-text-default);
  border-radius: 6px;
  background-color: var(--theme-surface-default);
  box-shadow: 0 1px 4px 1px #00000040;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  appearance: none;
  place-items: center;
  place-content: center;
  gap: 8px;
}

section.op-main .op-button--fluid {
  min-width: 100%;
}

section.op-main .op-button--sm {
  min-height: 40px;
  padding-top: 9px;
  padding-bottom: 7px;
  border-radius: 4px;
  font-size: 14px;
}

section.op-main .op-button--sm .op-button-label {
  line-height: 1.3;
}

section.op-main .op-button--sm .op-button-icon {
  color: var(--color-monotone-500);
}

section.op-main .op-button--sm .op-button-icon svg {
  width: 14px;
  height: 14px;
}

section.op-main .op-button-icon {
  display: grid;
  align-items: center;
  justify-content: center;
}

section.op-main .op-banner-button {
  display: grid;
  position: relative;
  grid-template-columns: 1fr auto;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  padding: 10px 10px 10px 12px;
  gap: 4px 4px;
  border-radius: 6px;
  background-color: var(--color-monotone-800);
  box-shadow: 0 2px 4px #0000001a;
  font-weight: 700;
  appearance: none;
}

section.op-main .op-banner-button:link,
section.op-main .op-banner-button:visited,
section.op-main .op-banner-button:active,
section.op-main .op-banner-button:hover {
  color: var(--color-monotone-0);
}

section.op-main .op-banner-button-content {
  display: grid;
  align-items: center;
  row-gap: 6px;
}

.sp-content li.newsDate{
  background:#fff;
  padding-left:15px;
  margin-top: 5px!important;
}

.sp-content .u-news .btn-txt-link{
  border-bottom:1px solid #eee;
}

section.op-main .op-banner-button-head {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  justify-content: flex-start;
  column-gap: 8px;
}

section.op-main .op-banner-button-title {
  font-size: 16px;
  line-height: 1.3;
}

section.op-main .op-banner-button-description {
  font-size: 12px;
  letter-spacing: -0.01em;
  line-height: 1.4;
}

section.op-main .op-banner-button-icon {
  display: grid;
  align-items: center;
  justify-content: center;
}

section.op-main .op-banner-button-chevron {
  display: grid;
  align-items: center;
  justify-content: center;
  opacity: 0.4;
}

section.op-main .op-tag {
  display: inline-grid;
  min-width: 36px;
  min-height: 20px;
  padding: 2px 6px;
  border-radius: 4px;
  background-color: var(--color-monotone-900);
  color: var(--color-monotone-0);
  font-size: 12px;
  line-height: 1;
  place-items: center;
}

section.op-main .op-tag--new {
  background-color: var(--color-red-650);
  color: var(--color-monotone-0);
}

section.op-main .op-grade {
  display: inline-grid;
  min-width: 36px;
  min-height: 16px;
  padding: 2px 4px;
  border-radius: 2px;
  background-color: var(--color-monotone-900);
  color: var(--color-monotone-0);
  font-size: 11px;
  font-weight: 700;
  line-height: 0.9;
  place-items: center;
}

section.op-main .op-grade.op-grade--graded {
  background-color: var(--theme-grade-graded);
}

section.op-main .op-grade.op-grade--graded::after {
  content: '\91cd\8cde';
}

section.op-main .op-grade.op-grade--gp {
  background-color: var(--theme-grade-gp);
}

section.op-main .op-grade.op-grade--gp::after {
  content: 'GP';
}

section.op-main .op-grade.op-grade--open {
  background-color: var(--theme-grade-open);
}

section.op-main .op-grade.op-grade--open::after {
  content: '\958b\50ac';
}

section.op-main .op-grade.op-grade--jpn1 {
  background-color: var(--theme-grade-jpn1);
}

section.op-main .op-grade.op-grade--jpn1::after {
  content: 'JpnI';
}

section.op-main .op-grade.op-grade--jpn2 {
  background-color: var(--theme-grade-jpn2);
}

section.op-main .op-grade.op-grade--jpn2::after {
  content: 'JpnII';
}

section.op-main .op-grade.op-grade--jpn3 {
  background-color: var(--theme-grade-jpn3);
}

section.op-main .op-grade.op-grade--jpn3::after {
  content: 'JpnIII';
}

section.op-main .op-grade.op-grade--g1 {
  background-color: var(--theme-grade-g1);
}

section.op-main .op-grade.op-grade--g1::after {
  content: 'GI';
}

section.op-main .op-grade.op-grade--g2 {
  background-color: var(--theme-grade-g2);
}

section.op-main .op-grade.op-grade--g2::after {
  content: 'GII';
}

section.op-main .op-grade.op-grade--g3 {
  background-color: var(--theme-grade-g3);
}

section.op-main .op-grade.op-grade--g3::after {
  content: 'GIII';
}

section.op-main .op-grade.op-grade--f1 {
  background-color: var(--theme-grade-f1);
}

section.op-main .op-grade.op-grade--f1::after {
  content: 'FI';
}

section.op-main .op-grade.op-grade--f2 {
  background-color: var(--theme-grade-f2);
}

section.op-main .op-grade.op-grade--f2::after {
  content: 'FII';
}

section.op-main .op-grade.op-grade--sg {
  background-color: var(--theme-grade-sg);
}

section.op-main .op-grade.op-grade--sg::after {
  content: 'SG';
}

section.op-main .op-tab-list {
  float: unset;
}

section.op-main .op-tab-list .tab-list {
  float: unset;
}

section.op-main .op-tab-list :where(.tab-list > ul, .op-tab-list-inner) {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: unset;
  height: unset;
  margin: 0;
  float: unset;
  column-gap: 1px;
  border-top: 1px solid var(--color-monotone-500);
  border-bottom: unset;
  background-color: var(--color-monotone-500);
}

section.op-main .op-tab-list :where(.tab-list > ul, .op-tab-list-inner) > li {
  display: grid;
  align-items: stretch;
  width: unset;
  margin: 0;
  float: unset;
  border-bottom: 1px solid var(--color-monotone-500);
}

section.op-main
  .op-tab-list
  :where(.tab-list > ul, .op-tab-list-inner)
  > li:has(a.current, input[type='radio']:checked) {
  border-bottom-color: var(--theme-surface-default);
}

section.op-main
  .op-tab-list
  :where(.tab-list > ul, .op-tab-list-inner)
  > li
  :where(a, label) {
  display: grid;
  width: unset;
  height: unset;
  min-height: 52px;
  padding: 6px 4px;
  background-color: var(--color-monotone-300);
  color: var(--theme-text-default);
  line-height: 1.2;
  place-items: center;
}

section.op-main
  .op-tab-list
  :where(.tab-list > ul, .op-tab-list-inner)
  > li
  :where(a, label)
  span {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: unset;
  column-gap: 4px;
}

section.op-main .op-tab-content {
  padding: 16px 16px 32px;
  float: unset;
}

section.op-main .op-tab-content::after {
  content: '';
  clear: both;
}

section.op-main .op-tab-content .tab-content {
  margin: 0;
  padding: 0;
  float: unset;
}

section.op-main .op-tab-content .tab-content::after {
  content: '';
  clear: both;
}

section.op-main .op-tab-content .tab-content > .day {
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 10px;
  float: unset;
  gap: 20px 8px;
}

section.op-main .op-tab-content .tab-content > .day h3 {
  width: 100%;
  margin-bottom: -10px;
  font-size: 16px;
}

section.op-main .op-tab-content .tab-content > .day > a {
  margin: 0;
  padding-top: 10px;
  float: unset;
}

section.op-main .op-tab-content .tab-content > .day + .day {
  margin-top: 24px;
}

section.op-main .op-breaking--keirin > marquee {
  background-color: var(--theme-keirin-900);
}

section.op-main .op-breaking--autorace > marquee {
  background-color: var(--theme-autorace-900);
}

section.op-main .op-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  color: var(--color-monotone-900);
}

section.op-main .op-pagination:last-child {
  padding-bottom: 32px;
}

section.op-main .op-pagination:not(:last-child) {
  margin-bottom: 32px;
}

section.op-main .op-pagination--detail:last-child {
  padding-bottom: 40px;
}

section.op-main .op-pagination--detail .op-pagination-prev,
section.op-main .op-pagination--detail .op-pagination-next {
  font-size: 14px;
}

section.op-main .op-pagination--detail .op-pagination-prev .op-icon,
section.op-main .op-pagination--detail .op-pagination-next .op-icon {
  width: 24px;
  height: 24px;
}

section.op-main .op-pagination-prev,
section.op-main .op-pagination-next {
  display: flex;
  font-size: 12px;
  font-weight: 700;
}

section.op-main .op-pagination-prev--disabled > a,
section.op-main .op-pagination-next--disabled > a {
  color: var(--color-monotone-500);
  pointer-events: none;
}

section.op-main .op-pagination-prev--disabled > a .op-icon,
section.op-main .op-pagination-next--disabled > a .op-icon {
  color: var(--color-monotone-300);
}

section.op-main .op-pagination-prev > a,
section.op-main .op-pagination-next > a {
  display: grid;
}

section.op-main .op-pagination-prev__inner,
section.op-main .op-pagination-next__inner {
  display: flex;
  align-items: center;
}

section.op-main .op-pagination-prev__inner .op-icon,
section.op-main .op-pagination-next__inner .op-icon {
  width: 16px;
  height: 16px;
  color: var(--color-monotone-500);
}

section.op-main .op-pagination-prev {
  justify-content: flex-start;
}

section.op-main .op-pagination-next {
  justify-content: flex-end;
}

section.op-main .op-pagination-navigation {
  display: flex;
  align-items: center;
}

section.op-main .op-pagination-leader {
  display: grid;
  place-items: center;
  margin-right: -3px;
  margin-left: -3px;
  color: var(--color-monotone-900);
}

section.op-main .op-pagination-leader .op-icon {
  width: 12px;
  height: 12px;
}

section.op-main .op-pagination-numbers {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 6px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
}

section.op-main .op-pagination-number {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--color-monotone-500);
  border-radius: 4px;
  background-color: var(--color-monotone-0);
  color: var(--color-monotone-900);
}

section.op-main .op-pagination-number--disabled {
  background-color: var(--color-monotone-300);
}

section.op-main .op-pagination-list {
  display: grid;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
}

section.op-main .op-backnumbers {
  position: relative;
  float: unset;
  overflow: hidden;
  border: 1px solid var(--color-monotone-500);
  border-radius: 4px;
  background-color: var(--color-monotone-0);
  box-shadow: 0 2px 4px 0 var(--color-monotone-400);
}

section.op-main .op-backnumbers > select {
  position: relative;
  z-index: 1;
  width: 100%;
  margin: 0;
  padding: 16px;
  border: none;
  outline: none;
  background-color: transparent;
  color: var(--color-monotone-700);
  line-height: 1;
  appearance: none;
}

section.op-main .op-backnumbers-icon {
  position: absolute;
  z-index: 0;
  top: 50%;
  right: 16px;
  width: 16px;
  height: 16px;
  transform: translateY(-42%);
  color: var(--color-monotone-500);
}

section.op-main .op-backnumbers-icon .op-icon {
  width: 16px;
  height: 16px;
}

section.op-main .op-carousel {
  float: unset;
}

section.op-main .op-carousel::after {
  content: '';
  clear: both;
}

section.op-main .op-carousel .swiper .swiper-button-prev,
section.op-main .op-carousel .swiper .swiper-button-next {
  position: relative;
  width: unset;
  height: unset;
  padding: 16px;
  float: unset;
  color: var(--color-monotone-500);
}

section.op-main .op-carousel .swiper .swiper-button-prev::after,
section.op-main .op-carousel .swiper .swiper-button-next::after {
  content: '';
  clear: both;
}

section.op-main .op-carousel .swiper .swiper-button-prev::after,
section.op-main .op-carousel .swiper .swiper-button-next::after {
  display: none;
}

section.op-main .op-carousel .swiper .swiper-button-prev {
  left: unset;
}

section.op-main .op-carousel .swiper .swiper-button-next {
  right: unset;
}

section.op-main .op-carousel .swiper .swiper-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  float: unset;
  column-gap: 4px;
  font-size: 14px;
  line-height: 1.2;
}

section.op-main .op-carousel .swiper .swiper-pagination::after {
  content: '';
  clear: both;
}

section.op-main .op-carousel .op-carousel-navigation {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  justify-content: space-between;
  float: unset;
}

section.op-main .op-carousel .op-carousel-navigation::after {
  content: '';
  clear: both;
}

section.op-main .op-announce-wrapper {
  padding: 0 16px 16px;
}

section.op-main .op-announce {
  display: grid;
  align-items: center;
  justify-content: stretch;
  width: unset;
  max-width: calc(100vw - 32px);
  float: unset;
  overflow: hidden;
  border: 1px solid var(--color-red-700);
  border-radius: 4px;
  background-color: var(--color-red-700);
  color: var(--color-monotone-0);
  row-gap: 1px;
}

section.op-main .op-announce-list {
  width: unset;
  float: unset;
}

section.op-main .op-announce-title {
  display: grid;
  align-items: center;
  justify-content: center;
  padding: 6px 8px 4px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
}

section.op-main .op-announce-card {
  float: unset;
  background-color: var(--color-red-200);
  letter-spacing: -0.001em;
  line-height: 1.5;
}

section.op-main .op-announce-card a:link,
section.op-main .op-announce-card a:visited,
section.op-main .op-announce-card a:active,
section.op-main .op-announce-card a:hover {
  color: var(--color-red-700);
}

section.op-main .op-announce-card:not(:last-child) {
  border-bottom: 1px solid var(--color-red-700);
}

section.op-main .op-announce-card:last-child {
  border-end-start-radius: 3px;
  border-end-end-radius: 3px;
}

section.op-main .op-announce-card__anchor {
  display: grid;
  grid-template-columns: 1fr 16px;
  align-items: center;
  justify-content: space-between;
  padding: 8px 4px 8px 8px;
  overflow: visible;
  column-gap: 8px;
  text-overflow: unset;
  white-space: unset;
}

section.op-main .op-announce-card__title {
  display: block;
}

section.op-main .op-announce-card__icon {
  color: var(--color-red-300);
}

section.op-main .op-announce-card__icon .op-icon {
  width: 16px;
  height: 16px;
}

section.op-main .op-beginner-buttons {
  padding: 16px 12px;
}

section.op-main .op-beginner-buttons-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  float: unset;
  column-gap: 16px;
  justify-items: stretch;
}

section.op-main .op-beginner-buttons-item {
  border-radius: 2vw;
  box-shadow: 0 1px 4px 1px #00000040;
  font-size: 0;
  line-height: 1;
}

section.op-main .op-beginner-buttons-item a {
  display: block;
}

section.op-main .op-beginner-buttons-item img {
  aspect-ratio: 167/56;
  width: 100%;
}

section.op-main .op-2columns-list {
  display: grid;
  position: relative;
  grid-template-columns: repeat(2, 1fr);
  width: 100vw;
  float: unset;
  border: 1px solid var(--color-monotone-500);
  border-width: 1px 0 0;
  font-size: 14px;
}

section.op-main .op-2columns-list::after {
  content: '';
  clear: both;
}

section.op-main .op-2columns-list::after {
  content: '';
  display: block;
  position: absolute;
  bottom: 0;
  width: 100vw;
  height: 1px;
  margin-top: -1px;
  background-color: var(--color-monotone-500);
}

section.op-main .op-2columns-list-item {
  display: grid;
  border: 1px solid var(--color-monotone-500);
  border-width: 0 0 1px;
  line-height: 1.4;
}

section.op-main .op-2columns-list-item:nth-child(odd) {
  border-right: 1px solid var(--color-monotone-500);
}

section.op-main .op-2columns-list-item a {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: flex-start;
  justify-content: space-between;
  min-height: 56px;
  padding: 18px 16px;
  column-gap: 8px;
  color: var(--theme-text-default);
}

section.op-main .op-2columns-list-item--sm {
  letter-spacing: -0.01em;
}

section.op-main .op-2columns-list-item--sm a {
  align-items: center;
  padding: 8px 16px;
  column-gap: 4px;
}

section.op-main .op-2columns-list-label {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  column-gap: 4px;
}

section.op-main .op-2columns-list-icon {
  display: grid;
  align-items: center;
  justify-content: flex-end;
  color: var(--color-monotone-500);
}

section.op-main .op-2columns-list-icon .op-icon {
  width: 16px;
  height: 16px;
}

section.op-main .op-payment-buttons {
  padding: 20px 16px;
  float: unset;
  background-color: var(--color-monotone-200);
}

section.op-main .op-payment-buttons-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  justify-content: stretch;
  float: unset;
  column-gap: 8px;
}

section.op-main .op-article-list {
  margin-bottom: 32px;
  padding: 0 16px;
  float: unset;
  border-radius: 0;
}

section.op-main .op-article-card {
  float: unset;
  line-height: 1.3;
}

section.op-main .op-article-card:not(:last-child) {
  border-bottom: 1px solid var(--theme-list-divider);
}

section.op-main .op-article-card__anchor {
  display: grid;
  grid-template-columns: 1fr 16px;
  align-items: center;
  justify-content: space-between;
  padding: 16px 0;
  overflow: visible;
  column-gap: 16px;
  text-overflow: unset;
  white-space: unset;
}

section.op-main .op-article-card__date {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 6px;
  column-gap: 8px;
  font-size: 12px;
  line-height: 1.6;
}

section.op-main .op-article-card__title {
  display: block;
  line-height: 1.5;
}

section.op-main .op-article-card__icon {
  color: var(--color-monotone-500);
}

section.op-main .op-article-card__icon .op-icon {
  width: 16px;
  height: 16px;
}

section.op-main .op-race-list {
  padding: 0 16px;
  float: unset;
}

section.op-main .op-race-card {
  float: unset;
  line-height: 1.3;
}

section.op-main .op-race-card:not(:last-child) {
  border-bottom: 1px solid var(--theme-list-divider);
}

section.op-main .op-race-card__anchor {
  display: grid;
  grid-template-columns: 1fr 16px;
  align-items: center;
  justify-content: space-between;
  padding: 16px 0;
  overflow: visible;
  column-gap: 8px;
  text-overflow: unset;
  white-space: unset;
}

section.op-main .op-race-card__content {
  display: inline;
  float: unset;
}

section.op-main .op-race-card__category {
  display: inline-block;
  bottom: -0.45em;
  margin-top: -0.45em;
  margin-right: 4px;
  line-height: 1;
}

section.op-main .op-race-card__place {
  display: inline-block;
  margin-right: 8px;
  font-weight: 700;
  line-height: 1;
}

section.op-main .op-race-card__grade {
  display: inline-block;
  top: -0.09em;
  margin-right: 8px;
}

section.op-main .op-race-card__title {
  display: inline;
  line-height: 1.5;
}

section.op-main .op-race-card__icon {
  color: var(--color-monotone-500);
}

section.op-main .op-race-card__icon .op-icon {
  width: 16px;
  height: 16px;
}

section.op-main .op-forecast-list {
  float: unset;
}

section.op-main .op-forecast-list:first-child {
  padding-top: 4px;
}

section.op-main .op-forecast-list:not(:first-child) {
  border-top: 1px solid var(--color-monotone-500);
}

section.op-main
  .op-forecast-list:not(
    section.op-main .op-forecast-list:has(+ .op-forecast-list)
  ) {
  border-bottom: 1px solid var(--theme-list-divider);
}

section.op-main .op-forecast-list-title {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 6px 10px;
  column-gap: 8px;
  background-color: var(--color-monotone-300);
  font-size: 14px;
  line-height: 1.2;
}

section.op-main .op-forecast-list-item {
  float: unset;
  line-height: 1.3;
}

section.op-main .op-forecast-list-item:not(:last-child) {
  border-bottom: 1px solid var(--theme-list-divider);
}

section.op-main .op-forecast-list-item a {
  display: grid;
  grid-template-columns: 1fr 16px;
  align-items: center;
  justify-content: space-between;
  padding: 16px;
  overflow: visible;
  column-gap: 16px;
  text-overflow: unset;
  white-space: unset;
}

section.op-main .op-forecast-list-item-title {
  font-weight: 700;
}

section.op-main .op-forecast-list-item-icon {
  color: var(--color-monotone-500);
}

section.op-main .op-forecast-list-item-icon .op-icon {
  width: 16px;
  height: 16px;
}

section.op-main .op-blog-latest-list {
  padding: 8px 16px;
  float: unset;
}

section.op-main
  .op-blog-latest-list:not(:last-child, :has(+ .op-main-section-inner)) {
  border-bottom: 1px solid var(--theme-list-divider);
}

section.op-main
  .op-blog-latest-list:first-of-type:has(
    .op-blog-latest-list-title:last-child
  ) {
  margin-top: 8px;
}

section.op-main .op-blog-latest-list-title {
  display: grid;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
}

section.op-main .op-blog-latest-list-title:not(:last-child) {
  border-bottom: 1px solid var(--theme-list-divider);
}

section.op-main .op-blog-latest-list-title:last-child a {
  padding-top: 0;
  padding-bottom: 0;
}

section.op-main .op-blog-latest-list-title a {
  display: grid;
  grid-template-columns: 1fr 16px;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0;
  overflow: visible;
  column-gap: 16px;
  text-overflow: unset;
  white-space: unset;
}

section.op-main .op-blog-latest-list-title__inner {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  justify-content: flex-start;
  column-gap: 8px;
}

section.op-main .op-blog-latest-list-title__thumbnail {
  font-size: 0;
}

section.op-main .op-blog-latest-list-title__thumbnail img {
  aspect-ratio: 1/1;
  width: 24px;
}

section.op-main .op-blog-latest-list-title__icon {
  display: grid;
  align-items: center;
  color: var(--color-monotone-500);
}

section.op-main .op-blog-latest-list-title__icon .op-icon {
  width: 16px;
  height: 16px;
}

section.op-main .op-blog-latest-list-title__text .op-tag {
  top: -0.15em;
  margin-left: 4px;
}

section.op-main .op-blog-latest-list-item {
  float: unset;
  line-height: 1.3;
}

section.op-main .op-blog-latest-list-item:not(:last-child) {
  border-bottom: 1px solid var(--theme-list-divider);
}

section.op-main .op-blog-latest-list-item a {
  display: grid;
  grid-template-columns: 1fr 16px;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0;
  overflow: visible;
  column-gap: 16px;
  text-overflow: unset;
  white-space: unset;
}

section.op-main .op-blog-latest-list-item-title {
  line-height: 1.4;
}

section.op-main .op-blog-latest-list-item-icon {
  display: grid;
  align-items: center;
  color: var(--color-monotone-500);
}

section.op-main .op-blog-latest-list-item-icon .op-icon {
  width: 16px;
  height: 16px;
}

section.op-main .op-info-tab-title {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

section.op-main .op-info-tab {
  float: unset;
}

section.op-main .op-info-tab::after {
  content: '';
  clear: both;
}

section.op-main
  .op-info-tab:has(#opInfoTabInfo:checked)
  .op-tab-content:has(#opInfoTabInfoContents) {
  display: block;
}

section.op-main
  .op-info-tab:has(#opInfoTabPickup:checked)
  .op-tab-content:has(#opInfoTabPickupContents) {
  display: block;
}

section.op-main .op-info-tab-group {
  float: unset;
}

section.op-main .op-info-tab-group::after {
  content: '';
  clear: both;
}

section.op-main .op-info-tab-group .op-tab-list-inner {
  grid-template-columns: repeat(2, 1fr);
}

section.op-main .op-info-tab-label__text {
  font-size: 14px;
}

section.op-main .op-info-tab-radio {
  position: absolute;
  width: 100%;
  height: 100%;
  margin: unset;
  border-radius: 0;
  background-color: var(--color-monotone-300);
  font-size: unset;
  appearance: none;
}

section.op-main .op-info-tab-radio:checked {
  background-color: var(--theme-surface-default);
}

section.op-main .op-info-tab-contents {
  width: auto;
  float: unset;
}

section.op-main .op-info-tab-contents::after {
  content: '';
  clear: both;
}

section.op-main .op-info-tab-contents__inner {
  float: unset;
}

section.op-main .op-info-tab-contents__inner::after {
  content: '';
  clear: both;
}

section.op-main .op-info-tab-contents__inner > *:last-child {
  padding-bottom: 0;
}

section.op-main .op-info-tab-contents .op-tab-content {
  display: none;
  padding-top: 0;
  padding-right: 0;
  padding-left: 0;
}

section.op-main .op-forecast-tab-title {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

section.op-main .op-forecast-tab {
  float: unset;
}

section.op-main .op-forecast-tab::after {
  content: '';
  clear: both;
}

section.op-main
  .op-forecast-tab:has(#opForecastTabKeiba:checked)
  .op-tab-content:has(#opForecastTabKeibaContents) {
  display: block;
}

section.op-main
  .op-forecast-tab:has(#opForecastTabKeirin:checked)
  .op-tab-content:has(#opForecastTabKeirinContents) {
  display: block;
}

section.op-main
  .op-forecast-tab:has(#opForecastTabAutorace:checked)
  .op-tab-content:has(#opForecastTabAutoraceContents) {
  display: block;
}

section.op-main .op-forecast-tab-group {
  float: unset;
}

section.op-main .op-forecast-tab-group::after {
  content: '';
  clear: both;
}

section.op-main .op-forecast-tab-group .op-tab-list-inner {
  grid-template-columns: repeat(3, 1fr);
}

section.op-main .op-forecast-tab-label__text {
  font-size: 14px;
}

section.op-main .op-forecast-tab-radio {
  position: absolute;
  width: 100%;
  height: 100%;
  margin: unset;
  border-radius: 0;
  background-color: var(--color-monotone-300);
  font-size: unset;
  appearance: none;
}

section.op-main .op-forecast-tab-radio:checked {
  background-color: var(--theme-surface-default);
}

section.op-main .op-forecast-tab-contents {
  width: auto;
  float: unset;
}

section.op-main .op-forecast-tab-contents::after {
  content: '';
  clear: both;
}

section.op-main .op-forecast-tab-contents__inner {
  float: unset;
}

section.op-main .op-forecast-tab-contents__inner::after {
  content: '';
  clear: both;
}

section.op-main .op-forecast-tab-contents__inner > *:last-child {
  padding-bottom: 0;
}

section.op-main .op-forecast-tab-contents .op-tab-content {
  display: none;
  padding: 0;
}

section.op-main .op-youtube-banner {
  display: block;
}

section.op-main .op-youtube-banner img {
  display: block;
  aspect-ratio: 145/51;
  width: 100%;
}

section.op-main .op-button-list {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 8px;
  width: unset;
  height: unset;
  float: unset;
  clear: unset;
  list-style: none;
}

section.op-main .op-button-list-item {
  float: unset;
  line-height: 1.3;
}

section.op-main .op-button-list-item a {
  display: block;
  width: unset;
  padding: 15px 16px;
  overflow: hidden;
  border: var(--color-monotone-500) 1px solid;
  border-radius: 8px;
  background-color: var(--theme-surface-default);
  box-shadow: 0 1px 4px 1px #00000040;
}

section.op-main .op-info-list .op-article-list {
  position: relative;
}

section.op-main .op-info-list .op-article-list::after {
  content: '';
  display: block;
  bottom: 0;
  height: 1px;
  background-color: var(--color-monotone-100);
}

section.op-main .op-info-backnumbers {
  width: unset;
  margin: 0 16px;
}

section.op-main .op-info-backnumbers:last-child {
  padding-bottom: 32px;
}

section.op-main .op-info-backnumbers:not(:last-child) {
  margin-bottom: 32px;
}

section.op-main .op-info-backnumbers-title {
  width: unset;
  margin-right: 16px;
  margin-left: 16px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
}

section.op-main .op-info-backnumbers-title:not(:first-child) {
  margin-bottom: 12px;
}

section.op-main .op-info-detail {
  padding: 20px 16px 32px;
}

section.op-main .op-info-detail-title {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
}

section.op-main .op-info-detail-title:not(:last-child) {
  margin-bottom: 8px;
}

section.op-main .op-info-detail-date {
  display: block;
  font-size: 15px;
  line-height: 1.3;
  text-align: right;
}

section.op-main .op-info-detail-date:not(:first-child) {
  margin-bottom: 16px;
}

section.op-main .op-info-detail-content {
  font-size: 14px;
  line-height: 1.9;
}

section.op-main .op-info-detail-content p:not(:last-child) {
  margin-bottom: 18px;
}

.sp-content:has(.op-main) .op-breadcrumb {
  padding: 16px 12px;
  float: unset;
  background-color: var(--color-monotone-200);
  font-size: 14px;
  line-height: 1.25;
}

.sp-content:has(.op-main) .op-breadcrumb::after {
  content: '';
  clear: both;
}

.sp-content:has(.op-main) .op-breadcrumb a:link,
.sp-content:has(.op-main) .op-breadcrumb a:visited,
.sp-content:has(.op-main) .op-breadcrumb a:active,
.sp-content:has(.op-main) .op-breadcrumb a:hover {
  color: var(--theme-text-default);
}

.sp-content:has(.op-main) .op-breadcrumb a {
  display: inline;
}

.sp-content:has(.op-main) .op-breadcrumb-list {
  display: inline;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  float: unset;
  column-gap: 4px;
  font-family:
    "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
  font-size: 14px;
  font-weight: 400;
}

.sp-content:has(.op-main) .op-breadcrumb-list::after {
  content: '';
  clear: both;
}

.sp-content:has(.op-main) .op-breadcrumb-list-item {
  display: inline;
  color: var(--theme-text-default);
}

.sp-content:has(.op-main)
  .op-breadcrumb-list-item:not(:last-child)
  .op-breadcrumb-list-item__text {
  display: inline;
}

.sp-content:has(.op-main)
  .op-breadcrumb-list-item:not(:last-child)
  .op-breadcrumb-list-item__text::after {
  content: '>';
  display: inline-block;
  position: relative;
  top: -0.1em;
  padding: 0 4px;
  font-family:
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
  font-size: 12px;
}

.sp-content:has(.op-main) .op-breadcrumb-list-item__text {
  display: inline;
}

.sp-content:has(.op-main) .op-member-status {
  padding: 24px 16px;
  float: unset;
  border-bottom: 1px solid var(--color-monotone-500);
  background-color: var(--color-monotone-200);
  font-size: 14px;
  line-height: 1.3;
  row-gap: 8px;
}

.sp-content:has(.op-main) .op-member-status::after {
  content: '';
  clear: both;
}

.sp-content:has(.op-main) .op-member-status-card {
  display: grid;
  align-items: center;
  justify-content: stretch;
  overflow: hidden;
  border-radius: 8px;
  row-gap: 1px;
}

.sp-content:has(.op-main) .op-member-status-card a:link,
.sp-content:has(.op-main) .op-member-status-card a:visited,
.sp-content:has(.op-main) .op-member-status-card a:active,
.sp-content:has(.op-main) .op-member-status-card a:hover {
  color: var(--theme-text-default);
}

.sp-content:has(.op-main) .op-member-status-card--mypage-button {
  margin-top: 16px;
  font-weight: 700;
}

.sp-content:has(.op-main) .op-member-status-card--mypage-button a:link,
.sp-content:has(.op-main) .op-member-status-card--mypage-button a:visited,
.sp-content:has(.op-main) .op-member-status-card--mypage-button a:hover,
.sp-content:has(.op-main) .op-member-status-card--mypage-button a:active {
  padding-top: 12px;
  padding-bottom: 12px;
  color: var(--theme-op-600);
}

.sp-content:has(.op-main) .op-member-status-card:has(+ .op-member-status-card) {
  margin-bottom: 8px;
}

.sp-content:has(.op-main)
  .op-member-status-card
  :where(.op-member-status-card-title, .op-member-status-card-description) {
  min-height: 32px;
  background-color: var(--theme-surface-default);
}

.sp-content:has(.op-main)
  .op-member-status-card
  :where(.op-member-status-card-title, .op-member-status-card-description):not(
    :has(a)
  ) {
  display: grid;
  align-items: center;
  padding: 8px 16px;
}

.sp-content:has(.op-main)
  .op-member-status-card
  :where(.op-member-status-card-title, .op-member-status-card-description)
  a {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  justify-content: space-between;
  padding: 8px 16px;
  column-gap: 8px;
  text-align: center;
}

.sp-content:has(.op-main) .op-member-status-card-title__text {
  display: grid;
  align-items: center;
  padding-top: 1px;
  font-weight: 700;
}

.sp-content:has(.op-main)
  .op-member-status-card-description
  em:not(.op-member-status-card-description__number) {
  padding-top: 4px;
  color: var(--color-red-650);
}

.sp-content:has(.op-main) .op-member-status-card-description__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 2px;
}

.sp-content:has(.op-main) .op-member-status-card-description__number {
  font-size: 16px;
  line-height: 1.2;
}

.sp-content:has(.op-main) .op-member-status-card-description__text {
  display: grid;
  align-items: center;
  line-height: 1.2;
}

.sp-content:has(.op-main) .op-member-status-card-description__icon {
  display: grid;
  top: -1px;
  align-items: center;
}

.sp-content:has(.op-main) .op-member-status-card-icon {
  display: grid;
  align-items: center;
  color: var(--color-monotone-500);
}

.sp-content:has(.op-main) .op-member-status-card-icon .op-icon {
  width: 16px;
  height: 16px;
}

section.op-main .op-info-detail table tr {  border:1px solid #333333;  padding:2px;}
section.op-main .op-info-detail table th {  border:1px solid #333333;  padding:2px;}