@charset "UTF-8";
/* 枠番カラー */
/*
 * HOME画面などの、タイトルバー、インジケーター、メニューとなる構成の画面
 */
/*
 * レース結果内のペースプロットテーブル
 */
/* 脚質傾向 */
/* 結果内、コーナー順 */
/*
 * 利用権アイコン
 */
/*
 * 単複ころがし
 */
/*
 * 開催一覧でのレース成績表示
 */
/*
 * 開催日レース一覧での傾向
 */
/*
 * レース一覧、傾向脚質での競馬場情報部分
 */
/*
 * 馬場推移ブロック(レース詳細、傾向・馬場・脚質)
 */
/*
 * 脚色傾向(レース詳細、傾向・馬場・脚質)
 */
/*
 * 利用権状況
 */
/*
 * レース詳細、メイン、注目馬での発走までの残り時間
 */
/*
 * スクロールによる、ショートカットメニューの出し入れ
 */
/*
 * Zランクの色
 */
/*
 * まんが道場ボタン
 */
/*
 * TOP画面ボタン群
 */
/*
 * LINEサインインボタン
 */
/*
 * twitterログインボタン
 */
/*
 * Sign in with Apple ログインボタン
 */
/*
 * Sign in with Apple ボタン配置により定義を更新
 */
/*
 * 月額固定プラン有効期限、レースチケット保有残高
 */
/*
 * チケット保有残高
 */
/*
 * レース注目馬リストでの疑問ありラベル
 */
/*
 * パスコード入力
 */
/*
 * チケット購入と同時使用
 */
/* まんがエピソードボタン */
.fontbold {
  font-weight: bold; }

.fontnormal {
  font-weight: normal; }

span.colGradeA {
  color: #800;
  font-weight: bold; }

.cssDarkRedColor {
  color: #a22; }

/* ボタンアイコン */
/* ボタン無効 */
.cssButtonDisabled {
  opacity: 0.4;
  pointer-events: none; }

/* ボタン基本 */
/*ボタン・青*/
/*ボタン・青*/
.cssButtonFlat {
  display: block;
  position: relative;
  box-sizing: border-box;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  text-decoration: none;
  border-radius: 2px;
  text-align: center;
  cursor: pointer;
  margin: 0;
  padding: 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  line-height: 38px;
  height: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #efefff;
  background: #f7f7ff;
  color: #000;
  box-shadow: 2px 2px 3px -1px #aaa; }
  .cssButtonFlat .cssIcon {
    margin-right: 8px; }
    .cssButtonFlat .cssIcon svg {
      width: 24px;
      height: 24px;
      vertical-align: top;
      position: relative;
      top: 50%;
      margin-top: -12px; }
      .cssButtonFlat .cssIcon svg path {
        fill: #7f7f7f; }
  .cssButtonFlat:hover .cssIcon svg path {
    fill: #000; }
  .cssButtonFlat:active .cssIcon svg path {
    fill: #fff; }
  .cssButtonFlat:hover {
    background: #e9e9ff;
    border: 1px solid #bfbfff; }
  .cssButtonFlat:active {
    background: #7f7fff;
    border: 1px solid #bfbfff;
    color: #fff; }

.cssButtonFlatL {
  display: block;
  position: relative;
  box-sizing: border-box;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  text-decoration: none;
  border-radius: 2px;
  text-align: center;
  cursor: pointer;
  margin: 0;
  padding: 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  line-height: 38px;
  height: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #efefff;
  background: #f7f7ff;
  color: #000;
  box-shadow: 2px 2px 3px -1px #aaa;
  padding: 8px 0;
  line-height: inherit;
  height: auto; }
  .cssButtonFlatL .cssIcon {
    margin-right: 8px; }
    .cssButtonFlatL .cssIcon svg {
      width: 24px;
      height: 24px;
      vertical-align: top;
      position: relative;
      top: 50%;
      margin-top: -12px; }
      .cssButtonFlatL .cssIcon svg path {
        fill: #7f7f7f; }
  .cssButtonFlatL:hover .cssIcon svg path {
    fill: #000; }
  .cssButtonFlatL:active .cssIcon svg path {
    fill: #fff; }
  .cssButtonFlatL:hover {
    background: #e9e9ff;
    border: 1px solid #bfbfff; }
  .cssButtonFlatL:active {
    background: #7f7fff;
    border: 1px solid #bfbfff;
    color: #fff; }

/*ボタン・赤*/
.cssButtonFlatRed {
  display: block;
  position: relative;
  box-sizing: border-box;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  text-decoration: none;
  border-radius: 2px;
  text-align: center;
  cursor: pointer;
  margin: 0;
  padding: 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  line-height: 38px;
  height: 40px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #ffefef;
  background: #fff7f7;
  color: #000;
  box-shadow: 2px 2px 3px -1px #aaa; }
  .cssButtonFlatRed .cssIcon {
    margin-right: 8px; }
    .cssButtonFlatRed .cssIcon svg {
      width: 24px;
      height: 24px;
      vertical-align: top;
      position: relative;
      top: 50%;
      margin-top: -12px; }
      .cssButtonFlatRed .cssIcon svg path {
        fill: #7f7f7f; }
  .cssButtonFlatRed:hover .cssIcon svg path {
    fill: #000; }
  .cssButtonFlatRed:active .cssIcon svg path {
    fill: #fff; }
  .cssButtonFlatRed:hover {
    background: #ffdfdf;
    border: 1px solid #ffbfbf; }
  .cssButtonFlatRed:active {
    background: #ff7f7f;
    border: 1px solid #ff6767;
    color: #fff; }

/*ボタン・白*/
.cssButtonFlatWhite {
  display: block;
  position: relative;
  box-sizing: border-box;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  text-decoration: none;
  border-radius: 2px;
  text-align: center;
  cursor: pointer;
  margin: 0;
  padding: 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  line-height: 38px;
  height: 40px;
  font-size: 14px;
  font-weight: bold;
  box-shadow: none;
  border: 1px solid #efefef;
  background: #fff;
  color: #000; }
  .cssButtonFlatWhite .cssIcon {
    margin-right: 8px; }
    .cssButtonFlatWhite .cssIcon svg {
      width: 24px;
      height: 24px;
      vertical-align: top;
      position: relative;
      top: 50%;
      margin-top: -12px; }
      .cssButtonFlatWhite .cssIcon svg path {
        fill: #7f7f7f; }
  .cssButtonFlatWhite:hover .cssIcon svg path {
    fill: #000; }
  .cssButtonFlatWhite:active .cssIcon svg path {
    fill: #fff; }
  .cssButtonFlatWhite:hover {
    background: #e7e7e7;
    border: 1px solid #cfcfcf; }
  .cssButtonFlatWhite:active {
    background: #9f9f9f;
    border: 1px solid #cfcfcf;
    color: #fff; }
  .cssButtonFlatWhite:hover {
    box-shadow: 2px 2px 3px -1px #aaa; }
  .cssButtonFlatWhite:active {
    box-shadow: 2px 2px 3px -1px #aaa; }

.cssButtonFlatWhiteL {
  display: block;
  position: relative;
  box-sizing: border-box;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  text-decoration: none;
  border-radius: 2px;
  text-align: center;
  cursor: pointer;
  margin: 0;
  padding: 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  line-height: 38px;
  height: 40px;
  font-size: 14px;
  font-weight: bold;
  box-shadow: none;
  border: 1px solid #efefef;
  background: #fff;
  color: #000;
  padding: 8px 0;
  line-height: inherit;
  height: auto; }
  .cssButtonFlatWhiteL .cssIcon {
    margin-right: 8px; }
    .cssButtonFlatWhiteL .cssIcon svg {
      width: 24px;
      height: 24px;
      vertical-align: top;
      position: relative;
      top: 50%;
      margin-top: -12px; }
      .cssButtonFlatWhiteL .cssIcon svg path {
        fill: #7f7f7f; }
  .cssButtonFlatWhiteL:hover .cssIcon svg path {
    fill: #000; }
  .cssButtonFlatWhiteL:active .cssIcon svg path {
    fill: #fff; }
  .cssButtonFlatWhiteL:hover {
    background: #e7e7e7;
    border: 1px solid #cfcfcf; }
  .cssButtonFlatWhiteL:active {
    background: #9f9f9f;
    border: 1px solid #cfcfcf;
    color: #fff; }
  .cssButtonFlatWhiteL:hover {
    box-shadow: 2px 2px 3px -1px #aaa; }
  .cssButtonFlatWhiteL:active {
    box-shadow: 2px 2px 3px -1px #aaa; }

.cssButtonFlatWhiteShadow {
  display: block;
  position: relative;
  box-sizing: border-box;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  text-decoration: none;
  border-radius: 2px;
  text-align: center;
  cursor: pointer;
  margin: 0;
  padding: 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  line-height: 38px;
  height: 40px;
  font-size: 14px;
  font-weight: bold;
  box-shadow: none;
  border: 1px solid #efefef;
  background: #fff;
  color: #000;
  box-shadow: 2px 2px 3px -1px #aaa; }
  .cssButtonFlatWhiteShadow .cssIcon {
    margin-right: 8px; }
    .cssButtonFlatWhiteShadow .cssIcon svg {
      width: 24px;
      height: 24px;
      vertical-align: top;
      position: relative;
      top: 50%;
      margin-top: -12px; }
      .cssButtonFlatWhiteShadow .cssIcon svg path {
        fill: #7f7f7f; }
  .cssButtonFlatWhiteShadow:hover .cssIcon svg path {
    fill: #000; }
  .cssButtonFlatWhiteShadow:active .cssIcon svg path {
    fill: #fff; }
  .cssButtonFlatWhiteShadow:hover {
    background: #e7e7e7;
    border: 1px solid #cfcfcf; }
  .cssButtonFlatWhiteShadow:active {
    background: #9f9f9f;
    border: 1px solid #cfcfcf;
    color: #fff; }
  .cssButtonFlatWhiteShadow:hover {
    box-shadow: 2px 2px 3px -1px #aaa; }
  .cssButtonFlatWhiteShadow:active {
    box-shadow: 2px 2px 3px -1px #aaa; }

.cssButtonFlatWhiteShadowL {
  display: block;
  position: relative;
  box-sizing: border-box;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  text-decoration: none;
  border-radius: 2px;
  text-align: center;
  cursor: pointer;
  margin: 0;
  padding: 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  line-height: 38px;
  height: 40px;
  font-size: 14px;
  font-weight: bold;
  box-shadow: none;
  border: 1px solid #efefef;
  background: #fff;
  color: #000;
  box-shadow: 2px 2px 3px -1px #aaa;
  padding: 8px 0;
  line-height: inherit;
  height: auto; }
  .cssButtonFlatWhiteShadowL .cssIcon {
    margin-right: 8px; }
    .cssButtonFlatWhiteShadowL .cssIcon svg {
      width: 24px;
      height: 24px;
      vertical-align: top;
      position: relative;
      top: 50%;
      margin-top: -12px; }
      .cssButtonFlatWhiteShadowL .cssIcon svg path {
        fill: #7f7f7f; }
  .cssButtonFlatWhiteShadowL:hover .cssIcon svg path {
    fill: #000; }
  .cssButtonFlatWhiteShadowL:active .cssIcon svg path {
    fill: #fff; }
  .cssButtonFlatWhiteShadowL:hover {
    background: #e7e7e7;
    border: 1px solid #cfcfcf; }
  .cssButtonFlatWhiteShadowL:active {
    background: #9f9f9f;
    border: 1px solid #cfcfcf;
    color: #fff; }
  .cssButtonFlatWhiteShadowL:hover {
    box-shadow: 2px 2px 3px -1px #aaa; }
  .cssButtonFlatWhiteShadowL:active {
    box-shadow: 2px 2px 3px -1px #aaa; }

/*
 * TOP用ボタン
 */
.cssTopButton {
  display: block;
  position: relative;
  box-sizing: border-box;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  text-decoration: none;
  border-radius: 2px;
  text-align: center;
  cursor: pointer;
  margin: 0;
  padding: 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  line-height: 38px;
  height: 40px;
  font-size: 14px;
  font-weight: bold;
  box-shadow: none;
  border: 1px solid rgba(240, 240, 240, 0.5);
  background: rgba(255, 255, 255, 0.5);
  color: #000;
  box-shadow: 2px 2px 3px -1px #aaa; }
  .cssTopButton .cssIcon {
    margin-right: 8px; }
    .cssTopButton .cssIcon svg {
      width: 24px;
      height: 24px;
      vertical-align: top;
      position: relative;
      top: 50%;
      margin-top: -12px; }
      .cssTopButton .cssIcon svg path {
        fill: #7f7f7f; }
  .cssTopButton:hover .cssIcon svg path {
    fill: #000; }
  .cssTopButton:active .cssIcon svg path {
    fill: #fff; }
  .cssTopButton:hover {
    background: #e7e7e7;
    border: 1px solid rgba(207, 207, 207, 0.5); }
  .cssTopButton:active {
    background: #9f9f9f;
    border: 1px solid rgba(207, 207, 207, 0.5);
    color: #fff; }
  .cssTopButton:hover {
    box-shadow: 2px 2px 3px -1px #aaa; }
  .cssTopButton:active {
    box-shadow: 2px 2px 3px -1px #aaa; }
  @media print, screen and (max-width: 375px) {
    .cssTopButton.sizeX {
      height: 52px;
      line-height: 50px; } }

/*
 * テキスト入力
 */
.cssInputText {
  border: solid 1px #eee;
  line-height: 1;
  padding: 4px;
  border-radius: 3px;
  width: 100%;
  box-sizing: border-box;
  font-size: 16px;
  height: 30px; }

/*
 * キャンセルとOKボタン
 */
.cssCmdOkCancel {
  position: relative;
  display: flex; }
  .cssCmdOkCancel a:first-child {
    width: 33%; }
  .cssCmdOkCancel a:last-child {
    width: 65%;
    margin-left: 16px; }

/*
  * 必須と任意ラベル
  */
.cssLabelHissu {
  background-color: #e44;
  color: #fff;
  border-radius: 2px;
  padding: 1px 4px;
  font-size: 12px; }

.cssLabelNini {
  background-color: #44e;
  color: #fff;
  border-radius: 2px;
  padding: 1px 4px;
  font-size: 12px; }

/*
 * dlを利用した入力ブロック
 */
.cssInputDl {
  border: solid 1px #ccc;
  margin-bottom: 1em;
  margin-bottom: 1em; }
  .cssInputDl dt {
    position: relative;
    padding: 6px;
    font-size: 14px;
    font-weight: bold;
    background-color: #eee; }
  .cssInputDl dd {
    position: relative;
    padding: 6px;
    font-size: 14px; }
  .cssInputDl dt .icon {
    margin-right: 8px; }
    .cssInputDl dt .icon svg {
      width: 24px;
      height: 24px;
      vertical-align: middle;
      position: relative;
      margin-top: -3px; }
      .cssInputDl dt .icon svg path {
        fill: #7f7f7f; }
  .cssInputDl dd {
    font-size: 16px; }
    .cssInputDl dd .inputtext {
      display: inline-block;
      font-size: 14px;
      padding: 8px 4px;
      line-height: 1;
      height: 30px;
      box-sizing: border-box; }
    .cssInputDl dd.pwd {
      position: relative;
      padding-right: 120px; }
      .cssInputDl dd.pwd .ui_btn {
        position: absolute;
        right: 1px;
        height: 30px;
        width: 108px;
        margin: 0 5px 0 0;
        font-size: 12px;
        padding: 2px 8px 2px;
        line-height: inherit; }

.cssInfoDl {
  border: solid 1px #ccc;
  margin-bottom: 1em;
  margin-bottom: 1em; }
  .cssInfoDl dt {
    position: relative;
    padding: 6px;
    font-size: 14px;
    font-weight: bold;
    background-color: #eee; }
  .cssInfoDl dd {
    position: relative;
    padding: 6px;
    font-size: 14px; }
  .cssInfoDl dt {
    background-color: #4f7fb9;
    color: #fff; }
    .cssInfoDl dt .icon {
      margin-right: 8px; }
      .cssInfoDl dt .icon svg {
        width: 24px;
        height: 24px;
        vertical-align: middle;
        position: relative;
        margin-top: -3px; }
        .cssInfoDl dt .icon svg path {
          fill: #fff; }
  .cssInfoDl dd {
    font-size: 16px; }
    .cssInfoDl dd .inputtext {
      display: inline-block;
      font-size: 14px;
      padding: 8px 4px;
      line-height: 1;
      height: 30px;
      box-sizing: border-box; }

/*
 * dlを利用したcaution表示
 */
.cssCautionDl {
  margin-top: 8px;
  margin-bottom: 8px;
  margin-bottom: 15px;
  border: solid 1px #cc4444; }
  .cssCautionDl dt {
    position: relative;
    margin: 0;
    padding: 4px;
    background-color: #4F7FB9;
    line-height: 20px;
    height: 20px;
    font-size: 14px;
    color: #fff;
    text-shadow: 0 0 0 #fff; }
  .cssCautionDl dd {
    font-size: 14px;
    margin: 0;
    padding: 4px;
    border: solid 1px #4F7FB9; }
  .cssCautionDl dt {
    text-align: center;
    background-color: #cc4444;
    color: #fff;
    font-weight: bold; }
  .cssCautionDl dd {
    padding: 10px;
    line-height: 23px;
    list-style: inside;
    border: none; }
    .cssCautionDl dd li {
      font-size: 14px; }

/*
 * アイコンボタン
 */
.cssIconButtonGray .iconbutton svg {
  position: absolute;
  left: 5px;
  top: 5px;
  width: 30px;
  height: 30px; }
  .cssIconButtonGray .iconbutton svg rect,
  .cssIconButtonGray .iconbutton svg path {
    fill: #bfbfbf; }

.cssIconButtonGray:hover .iconbutton svg rect,
.cssIconButtonGray:hover .iconbutton svg path {
  fill: white; }

.cssIconButtonGray:active .iconbutton svg rect,
.cssIconButtonGray:active .iconbutton svg path {
  fill: #9fffff; }

.cssIconButtonBlack .iconbutton svg {
  position: absolute;
  left: 5px;
  top: 5px;
  width: 30px;
  height: 30px; }
  .cssIconButtonBlack .iconbutton svg rect,
  .cssIconButtonBlack .iconbutton svg path {
    fill: #bfbfbf; }

.cssIconButtonBlack .iconbutton svg rect,
.cssIconButtonBlack .iconbutton svg path {
  fill: #7f7f7f; }

.cssIconButtonBlack:hover .iconbutton svg rect,
.cssIconButtonBlack:hover .iconbutton svg path {
  fill: black; }

.cssIconButtonBlack:active .iconbutton svg rect,
.cssIconButtonBlack:active .iconbutton svg path {
  fill: white; }

.cssIconButtonBlack .iconbutton.selected svg rect,
.cssIconButtonBlack .iconbutton.selected svg path {
  fill: white; }

.cssIconButtonBlackJustHover .iconbutton svg {
  position: absolute;
  left: 5px;
  top: 5px;
  width: 30px;
  height: 30px; }
  .cssIconButtonBlackJustHover .iconbutton svg rect,
  .cssIconButtonBlackJustHover .iconbutton svg path {
    fill: #bfbfbf; }

.cssIconButtonBlackJustHover .iconbutton svg rect,
.cssIconButtonBlackJustHover .iconbutton svg path {
  fill: #7f7f7f; }

.cssIconButtonBlackJustHover .iconbutton:hover svg rect,
.cssIconButtonBlackJustHover .iconbutton:hover svg path {
  fill: black; }

.cssIconButtonBlackJustHover:active .iconbutton svg rect,
.cssIconButtonBlackJustHover:active .iconbutton svg path {
  fill: white; }

.cssIconButtonBlackJustHover .iconbutton.selected svg rect,
.cssIconButtonBlackJustHover .iconbutton.selected svg path {
  fill: white; }

/*
 * ブロック開閉
 */
.cssCollapseRoot {
  margin: 8px 0;
  padding: 0;
  background-color: #fff;
  border-radius: 4px;
  box-shadow: 0 0 8px -3px #aaa; }

.cssCollapseHeader {
  cursor: pointer;
  position: relative;
  margin: 0;
  padding: 0;
  font-size: 16px;
  line-height: 32px;
  background-color: #dfdfdf;
  text-align: center;
  font-weight: bold;
  border-radius: 4px 4px 0 0; }
  .cssCollapseHeader .cssOpenerMark,
  .cssCollapseHeader .cssCloserMark {
    position: absolute;
    right: 4px;
    background-color: #fff;
    width: 18px;
    height: 18px;
    border-radius: 9px;
    top: 50%;
    margin-top: -9px;
    box-sizing: border-box;
    border: solid 1px #eee;
    transition-property: background-color;
    transition-duration: 0.2s; }
    .cssCollapseHeader .cssOpenerMark::after,
    .cssCollapseHeader .cssCloserMark::after {
      content: '';
      position: absolute;
      right: 5px;
      width: 0;
      height: 0;
      top: 50%;
      margin-top: -2px; }
  .cssCollapseHeader .cssOpenerMark::after {
    border-bottom: none;
    border-top: solid 5px #000;
    border-left: solid 3px transparent;
    border-right: solid 3px transparent; }
  .cssCollapseHeader .cssCloserMark::after {
    border-top: none;
    border-bottom: solid 5px #000;
    border-left: solid 3px transparent;
    border-right: solid 3px transparent;
    margin-top: -3px; }
  .cssCollapseHeader:hover .cssOpenerMark,
  .cssCollapseHeader:hover .cssCloserMark {
    border-color: #cfcfcf;
    background-color: #e7e7e7; }
  .cssCollapseHeader:active .cssOpenerMark,
  .cssCollapseHeader:active .cssCloserMark {
    border-color: #cfcfcf;
    background-color: #9f9f9f; }

.cssCollapseContents {
  padding: 4px;
  font-size: 12px; }

.cssFlatCollapseRoot {
  margin: 0;
  padding: 0;
  background-color: #fff;
  border: solid 1px #ccc; }
  .cssFlatCollapseRoot + .cssFlatCollapseRoot {
    border-top: none; }

.cssFlatCollapseHeader {
  cursor: pointer;
  position: relative;
  margin: 0;
  padding: 0;
  padding: 8px 4px;
  font-size: 16px;
  line-height: 20px;
  text-align: left;
  font-weight: normal; }
  .cssFlatCollapseHeader .cssOpenerMark,
  .cssFlatCollapseHeader .cssCloserMark {
    position: absolute;
    right: 4px;
    background-color: #fff;
    width: 18px;
    height: 18px;
    border-radius: 9px;
    top: 50%;
    margin-top: -9px;
    box-sizing: border-box;
    border: solid 1px #eee;
    transition-property: background-color;
    transition-duration: 0.2s; }
    .cssFlatCollapseHeader .cssOpenerMark::after,
    .cssFlatCollapseHeader .cssCloserMark::after {
      content: '';
      position: absolute;
      right: 5px;
      width: 0;
      height: 0;
      top: 50%;
      margin-top: -2px; }
  .cssFlatCollapseHeader .cssOpenerMark::after {
    border-bottom: none;
    border-top: solid 5px #000;
    border-left: solid 3px transparent;
    border-right: solid 3px transparent; }
  .cssFlatCollapseHeader .cssCloserMark::after {
    border-top: none;
    border-bottom: solid 5px #000;
    border-left: solid 3px transparent;
    border-right: solid 3px transparent;
    margin-top: -3px; }
  .cssFlatCollapseHeader:hover .cssOpenerMark,
  .cssFlatCollapseHeader:hover .cssCloserMark {
    border-color: #cfcfcf;
    background-color: #e7e7e7; }
  .cssFlatCollapseHeader:active .cssOpenerMark,
  .cssFlatCollapseHeader:active .cssCloserMark {
    border-color: #cfcfcf;
    background-color: #9f9f9f; }

.cssFlatCollapseContents {
  padding: 4px;
  font-size: 12px; }

.cssRaceCollapseRoot {
  margin: 8px 0; }

.cssRaceCollapseHeader {
  cursor: pointer;
  background-color: #eee;
  font-weight: bold;
  color: #303030;
  padding: 0.4em 0;
  line-height: 1.1;
  border-top: solid 2px #ccc; }
  .cssRaceCollapseHeader.dirt {
    border-top: solid 2px #e5c963; }
  .cssRaceCollapseHeader.turf {
    border-top: solid 2px #6bc259; }
  .cssRaceCollapseHeader .cssOpenerMark,
  .cssRaceCollapseHeader .cssCloserMark {
    position: absolute;
    right: 4px;
    background-color: #fff;
    width: 18px;
    height: 18px;
    border-radius: 9px;
    top: 50%;
    margin-top: -9px;
    box-sizing: border-box;
    border: solid 1px #eee;
    transition-property: background-color;
    transition-duration: 0.2s; }
    .cssRaceCollapseHeader .cssOpenerMark::after,
    .cssRaceCollapseHeader .cssCloserMark::after {
      content: '';
      position: absolute;
      right: 5px;
      width: 0;
      height: 0;
      top: 50%;
      margin-top: -2px; }
  .cssRaceCollapseHeader .cssOpenerMark::after {
    border-bottom: none;
    border-top: solid 5px #000;
    border-left: solid 3px transparent;
    border-right: solid 3px transparent; }
  .cssRaceCollapseHeader .cssCloserMark::after {
    border-top: none;
    border-bottom: solid 5px #000;
    border-left: solid 3px transparent;
    border-right: solid 3px transparent;
    margin-top: -3px; }
  .cssRaceCollapseHeader:hover .cssOpenerMark,
  .cssRaceCollapseHeader:hover .cssCloserMark {
    border-color: #cfcfcf;
    background-color: #e7e7e7; }
  .cssRaceCollapseHeader:active .cssOpenerMark,
  .cssRaceCollapseHeader:active .cssCloserMark {
    border-color: #cfcfcf;
    background-color: #9f9f9f; }

.cssRaceCollapseContents {
  padding: 4px;
  font-size: 12px; }

.cssOpenerCloserBox {
  width: 18px;
  height: 18px;
  position: relative; }
  .cssOpenerCloserBox.cssOpenerCloser .cssOpenerCloserMarkCircle {
    right: auto; }

.cssOpenerCloser .cssOpenerCloserMark {
  position: relative; }
  .cssOpenerCloser .cssOpenerCloserMark::after {
    content: '';
    position: absolute;
    right: 0;
    width: 0;
    height: 0;
    top: 0;
    margin-top: -2px; }

.cssOpenerCloser .cssOpenerCloserMark::after {
  border-bottom: none;
  border-top: solid 5px #000;
  border-left: solid 3px transparent;
  border-right: solid 3px transparent; }

.cssOpenerCloser.open .cssOpenerCloserMark::after {
  border-top: none;
  border-bottom: solid 5px #000;
  border-left: solid 3px transparent;
  border-right: solid 3px transparent;
  margin-top: -3px; }

.cssOpenerCloser .cssOpenerCloserMarkCircle {
  position: absolute;
  right: 4px;
  background-color: #fff;
  width: 18px;
  height: 18px;
  border-radius: 9px;
  top: 50%;
  margin-top: -9px;
  box-sizing: border-box;
  border: solid 1px #eee;
  transition-property: background-color;
  transition-duration: 0.2s; }
  .cssOpenerCloser .cssOpenerCloserMarkCircle::after {
    content: '';
    position: absolute;
    right: 5px;
    width: 0;
    height: 0;
    top: 50%;
    margin-top: -2px; }
  .cssOpenerCloser .cssOpenerCloserMarkCircle::after {
    border-bottom: none;
    border-top: solid 5px #000;
    border-left: solid 3px transparent;
    border-right: solid 3px transparent; }

.cssOpenerCloser.open .cssOpenerCloserMarkCircle::after {
  border-top: none;
  border-bottom: solid 5px #000;
  border-left: solid 3px transparent;
  border-right: solid 3px transparent;
  margin-top: -3px; }

.cssOpenerCloser:hover .cssOpenerCloserMarkCircle {
  border-color: #cfcfcf;
  background-color: #e7e7e7; }

.cssOpenerCloser:active .cssOpenerCloserMarkCircle {
  border-color: #cfcfcf;
  background-color: #9f9f9f; }

/*
 * 曜日カラー
 */
.colBgWeek1 {
  color: #00f; }

.colBgWeek2 {
  color: #f00; }

.colBgWeek3 {
  color: #f00; }

.colLightBgWeek1 {
  color: #0ff; }

.colLightBgWeek2 {
  color: #ff9fff; }

.colLightBgWeek3 {
  color: #ff9fff; }

.color_male {
  color: #d22; }

.cssBaban {
  position: relative;
  display: inline-block;
  width: 20px;
  height: 20px;
  font-size: 14px;
  line-height: 20px;
  text-align: center;
  border: solid 1px #ccc; }
  .cssBaban.colWaku0 {
    background-color: #fff;
    color: #aaa; }
    .cssBaban.colWaku0.colWakuImportant {
      background-color: #fff !important;
      color: #aaa !important; }
  .cssBaban.colWaku1 {
    background-color: #f0f0f0;
    color: #000; }
    .cssBaban.colWaku1.colWakuImportant {
      background-color: #f0f0f0 !important;
      color: #000 !important; }
    .cssBaban.colWaku1.colWakuBImportant {
      background-color: #eee !important;
      color: #000 !important; }
    .cssBaban.colWaku1.old {
      background-color: #eee;
      color: #000; }
    .cssBaban.colWaku1.light {
      background-color: #f8f8f8;
      color: #888; }
    .cssBaban.colWaku1.ichiwhite {
      background-color: #fff; }
  .cssBaban.colWaku2 {
    background-color: #7c7c7c;
    color: #fff; }
    .cssBaban.colWaku2.colWakuImportant {
      background-color: #7c7c7c !important;
      color: #fff !important; }
    .cssBaban.colWaku2.colWakuBImportant {
      background-color: #000 !important;
      color: #fff !important; }
    .cssBaban.colWaku2.old {
      background-color: #7c7c7c;
      color: #fff; }
    .cssBaban.colWaku2.light {
      background-color: silver; }
  .cssBaban.colWaku3 {
    background-color: #ff8080;
    color: #fff; }
    .cssBaban.colWaku3.colWakuImportant {
      background-color: #ff8080 !important;
      color: #fff !important; }
    .cssBaban.colWaku3.colWakuBImportant {
      background-color: #f00 !important;
      color: #fff !important; }
    .cssBaban.colWaku3.old {
      background-color: #ff8080;
      color: #fff; }
    .cssBaban.colWaku3.light {
      background-color: #ffc0c0; }
  .cssBaban.colWaku4 {
    background-color: #7c7cfb;
    color: #fff; }
    .cssBaban.colWaku4.colWakuImportant {
      background-color: #7c7cfb !important;
      color: #fff !important; }
    .cssBaban.colWaku4.colWakuBImportant {
      background-color: #00f !important;
      color: #fff !important; }
    .cssBaban.colWaku4.old {
      background-color: #7c7cfb;
      color: #fff; }
    .cssBaban.colWaku4.light {
      background-color: #c0c0ff; }
  .cssBaban.colWaku5 {
    background-color: #ffff80;
    color: #000; }
    .cssBaban.colWaku5.colWakuImportant {
      background-color: #ffff80 !important;
      color: #000 !important; }
    .cssBaban.colWaku5.colWakuBImportant {
      background-color: #ff0 !important;
      color: #000 !important; }
    .cssBaban.colWaku5.old {
      background-color: #ffff80;
      color: #808080; }
    .cssBaban.colWaku5.light {
      background-color: #ffffc0;
      color: silver; }
  .cssBaban.colWaku6 {
    background-color: #80ff80;
    color: #000; }
    .cssBaban.colWaku6.colWakuImportant {
      background-color: #80ff80 !important;
      color: #000 !important; }
    .cssBaban.colWaku6.colWakuBImportant {
      background-color: #0f0 !important;
      color: #000 !important; }
    .cssBaban.colWaku6.old {
      background-color: #80ff80;
      color: #808080; }
    .cssBaban.colWaku6.light {
      background-color: #c0ffc0;
      color: silver; }
  .cssBaban.colWaku7 {
    background-color: #ffcc80;
    color: #000; }
    .cssBaban.colWaku7.colWakuImportant {
      background-color: #ffcc80 !important;
      color: #000 !important; }
    .cssBaban.colWaku7.colWakuBImportant {
      background-color: #f90 !important;
      color: #000 !important; }
    .cssBaban.colWaku7.old {
      background-color: #ffcc80;
      color: #808080; }
    .cssBaban.colWaku7.light {
      background-color: #ffe0c0;
      color: silver; }
  .cssBaban.colWaku8 {
    background-color: #ffb3ff;
    color: #000; }
    .cssBaban.colWaku8.colWakuImportant {
      background-color: #ffb3ff !important;
      color: #000 !important; }
    .cssBaban.colWaku8.colWakuBImportant {
      background-color: #f6f !important;
      color: #fff !important; }
    .cssBaban.colWaku8.old {
      background-color: #ffb3ff;
      color: #fff; }
    .cssBaban.colWaku8.light {
      background-color: #ffd9ff; }
  .cssBaban > span.goalrank {
    position: absolute;
    left: -6px;
    top: -6px;
    display: block;
    width: 10px;
    height: 10px;
    line-height: 10px;
    font-size: 8px;
    border-radius: 6px;
    text-align: center;
    color: #888;
    background-color: #fff;
    border: solid 1px #ddd; }
    .cssBaban > span.goalrank.rank1 {
      background-color: #f00;
      color: #fff; }
    .cssBaban > span.goalrank.rank2 {
      background-color: #f80;
      color: #fff; }
    .cssBaban > span.goalrank.rank3 {
      background-color: #0af;
      color: #fff; }
    .cssBaban > span.goalrank.rank4, .cssBaban > span.goalrank.rank5 {
      color: #000; }
  .cssBaban.grayFrame {
    border: solid 1px #ccc; }
  .cssBaban.colWakuLight1 {
    background-color: #f0f0f0;
    color: #808080; }
  .cssBaban.colWakuLight2 {
    background-color: #7c7c7c; }
  .cssBaban.colWakuLight3 {
    background-color: #ff8080; }
  .cssBaban.colWakuLight4 {
    background-color: #7c7cfb; }
  .cssBaban.colWakuLight5 {
    background-color: #ffff80;
    color: #808080; }
  .cssBaban.colWakuLight6 {
    background-color: #80ff80;
    color: #808080; }
  .cssBaban.colWakuLight7 {
    background-color: #ffcc80;
    color: #808080; }
  .cssBaban.colWakuLight8 {
    background-color: #ffb3ff;
    color: #808080; }
  .cssBaban.colWakuDLightText1 {
    color: #404040; }
  .cssBaban.colWakuDLightText2 {
    color: #fff; }
  .cssBaban.colWakuDLightText3 {
    color: #fff; }
  .cssBaban.colWakuDLightText4 {
    color: #fff; }
  .cssBaban.colWakuDLightText5 {
    color: #404040; }
  .cssBaban.colWakuDLightText6 {
    color: #404040; }
  .cssBaban.colWakuDLightText7 {
    color: #404040; }
  .cssBaban.colWakuDLightText8 {
    color: #404040; }

.colWaku {
  position: relative; }
  .colWaku.colWaku0 {
    background-color: #fff;
    color: #aaa; }
    .colWaku.colWaku0.colWakuImportant {
      background-color: #fff !important;
      color: #aaa !important; }
  .colWaku.colWaku1 {
    background-color: #f0f0f0;
    color: #000; }
    .colWaku.colWaku1.colWakuImportant {
      background-color: #f0f0f0 !important;
      color: #000 !important; }
    .colWaku.colWaku1.colWakuBImportant {
      background-color: #eee !important;
      color: #000 !important; }
    .colWaku.colWaku1.old {
      background-color: #eee;
      color: #000; }
    .colWaku.colWaku1.light {
      background-color: #f8f8f8;
      color: #888; }
    .colWaku.colWaku1.ichiwhite {
      background-color: #fff; }
  .colWaku.colWaku2 {
    background-color: #7c7c7c;
    color: #fff; }
    .colWaku.colWaku2.colWakuImportant {
      background-color: #7c7c7c !important;
      color: #fff !important; }
    .colWaku.colWaku2.colWakuBImportant {
      background-color: #000 !important;
      color: #fff !important; }
    .colWaku.colWaku2.old {
      background-color: #7c7c7c;
      color: #fff; }
    .colWaku.colWaku2.light {
      background-color: silver; }
  .colWaku.colWaku3 {
    background-color: #ff8080;
    color: #fff; }
    .colWaku.colWaku3.colWakuImportant {
      background-color: #ff8080 !important;
      color: #fff !important; }
    .colWaku.colWaku3.colWakuBImportant {
      background-color: #f00 !important;
      color: #fff !important; }
    .colWaku.colWaku3.old {
      background-color: #ff8080;
      color: #fff; }
    .colWaku.colWaku3.light {
      background-color: #ffc0c0; }
  .colWaku.colWaku4 {
    background-color: #7c7cfb;
    color: #fff; }
    .colWaku.colWaku4.colWakuImportant {
      background-color: #7c7cfb !important;
      color: #fff !important; }
    .colWaku.colWaku4.colWakuBImportant {
      background-color: #00f !important;
      color: #fff !important; }
    .colWaku.colWaku4.old {
      background-color: #7c7cfb;
      color: #fff; }
    .colWaku.colWaku4.light {
      background-color: #c0c0ff; }
  .colWaku.colWaku5 {
    background-color: #ffff80;
    color: #000; }
    .colWaku.colWaku5.colWakuImportant {
      background-color: #ffff80 !important;
      color: #000 !important; }
    .colWaku.colWaku5.colWakuBImportant {
      background-color: #ff0 !important;
      color: #000 !important; }
    .colWaku.colWaku5.old {
      background-color: #ffff80;
      color: #808080; }
    .colWaku.colWaku5.light {
      background-color: #ffffc0;
      color: silver; }
  .colWaku.colWaku6 {
    background-color: #80ff80;
    color: #000; }
    .colWaku.colWaku6.colWakuImportant {
      background-color: #80ff80 !important;
      color: #000 !important; }
    .colWaku.colWaku6.colWakuBImportant {
      background-color: #0f0 !important;
      color: #000 !important; }
    .colWaku.colWaku6.old {
      background-color: #80ff80;
      color: #808080; }
    .colWaku.colWaku6.light {
      background-color: #c0ffc0;
      color: silver; }
  .colWaku.colWaku7 {
    background-color: #ffcc80;
    color: #000; }
    .colWaku.colWaku7.colWakuImportant {
      background-color: #ffcc80 !important;
      color: #000 !important; }
    .colWaku.colWaku7.colWakuBImportant {
      background-color: #f90 !important;
      color: #000 !important; }
    .colWaku.colWaku7.old {
      background-color: #ffcc80;
      color: #808080; }
    .colWaku.colWaku7.light {
      background-color: #ffe0c0;
      color: silver; }
  .colWaku.colWaku8 {
    background-color: #ffb3ff;
    color: #000; }
    .colWaku.colWaku8.colWakuImportant {
      background-color: #ffb3ff !important;
      color: #000 !important; }
    .colWaku.colWaku8.colWakuBImportant {
      background-color: #f6f !important;
      color: #fff !important; }
    .colWaku.colWaku8.old {
      background-color: #ffb3ff;
      color: #fff; }
    .colWaku.colWaku8.light {
      background-color: #ffd9ff; }
  .colWaku > span.goalrank {
    position: absolute;
    left: -6px;
    top: -6px;
    display: block;
    width: 10px;
    height: 10px;
    line-height: 10px;
    font-size: 8px;
    border-radius: 6px;
    text-align: center;
    color: #888;
    background-color: #fff;
    border: solid 1px #ddd; }
    .colWaku > span.goalrank.rank1 {
      background-color: #f00;
      color: #fff; }
    .colWaku > span.goalrank.rank2 {
      background-color: #f80;
      color: #fff; }
    .colWaku > span.goalrank.rank3 {
      background-color: #0af;
      color: #fff; }
    .colWaku > span.goalrank.rank4, .colWaku > span.goalrank.rank5 {
      color: #000; }
  .colWaku.grayFrame {
    border: solid 1px #ccc; }
  .colWaku.colWakuLight1 {
    background-color: #f0f0f0;
    color: #808080; }
  .colWaku.colWakuLight2 {
    background-color: #7c7c7c; }
  .colWaku.colWakuLight3 {
    background-color: #ff8080; }
  .colWaku.colWakuLight4 {
    background-color: #7c7cfb; }
  .colWaku.colWakuLight5 {
    background-color: #ffff80;
    color: #808080; }
  .colWaku.colWakuLight6 {
    background-color: #80ff80;
    color: #808080; }
  .colWaku.colWakuLight7 {
    background-color: #ffcc80;
    color: #808080; }
  .colWaku.colWakuLight8 {
    background-color: #ffb3ff;
    color: #808080; }
  .colWaku.colWakuDLightText1 {
    color: #404040; }
  .colWaku.colWakuDLightText2 {
    color: #fff; }
  .colWaku.colWakuDLightText3 {
    color: #fff; }
  .colWaku.colWakuDLightText4 {
    color: #fff; }
  .colWaku.colWakuDLightText5 {
    color: #404040; }
  .colWaku.colWakuDLightText6 {
    color: #404040; }
  .colWaku.colWakuDLightText7 {
    color: #404040; }
  .colWaku.colWakuDLightText8 {
    color: #404040; }

.cssColWaku.colWaku0 {
  background-color: #fff;
  color: #aaa; }
  .cssColWaku.colWaku0.colWakuImportant {
    background-color: #fff !important;
    color: #aaa !important; }

.cssColWaku.colWaku1 {
  background-color: #f0f0f0;
  color: #000; }
  .cssColWaku.colWaku1.colWakuImportant {
    background-color: #f0f0f0 !important;
    color: #000 !important; }
  .cssColWaku.colWaku1.colWakuBImportant {
    background-color: #eee !important;
    color: #000 !important; }
  .cssColWaku.colWaku1.old {
    background-color: #eee;
    color: #000; }
  .cssColWaku.colWaku1.light {
    background-color: #f8f8f8;
    color: #888; }
  .cssColWaku.colWaku1.ichiwhite {
    background-color: #fff; }

.cssColWaku.colWaku2 {
  background-color: #7c7c7c;
  color: #fff; }
  .cssColWaku.colWaku2.colWakuImportant {
    background-color: #7c7c7c !important;
    color: #fff !important; }
  .cssColWaku.colWaku2.colWakuBImportant {
    background-color: #000 !important;
    color: #fff !important; }
  .cssColWaku.colWaku2.old {
    background-color: #7c7c7c;
    color: #fff; }
  .cssColWaku.colWaku2.light {
    background-color: silver; }

.cssColWaku.colWaku3 {
  background-color: #ff8080;
  color: #fff; }
  .cssColWaku.colWaku3.colWakuImportant {
    background-color: #ff8080 !important;
    color: #fff !important; }
  .cssColWaku.colWaku3.colWakuBImportant {
    background-color: #f00 !important;
    color: #fff !important; }
  .cssColWaku.colWaku3.old {
    background-color: #ff8080;
    color: #fff; }
  .cssColWaku.colWaku3.light {
    background-color: #ffc0c0; }

.cssColWaku.colWaku4 {
  background-color: #7c7cfb;
  color: #fff; }
  .cssColWaku.colWaku4.colWakuImportant {
    background-color: #7c7cfb !important;
    color: #fff !important; }
  .cssColWaku.colWaku4.colWakuBImportant {
    background-color: #00f !important;
    color: #fff !important; }
  .cssColWaku.colWaku4.old {
    background-color: #7c7cfb;
    color: #fff; }
  .cssColWaku.colWaku4.light {
    background-color: #c0c0ff; }

.cssColWaku.colWaku5 {
  background-color: #ffff80;
  color: #000; }
  .cssColWaku.colWaku5.colWakuImportant {
    background-color: #ffff80 !important;
    color: #000 !important; }
  .cssColWaku.colWaku5.colWakuBImportant {
    background-color: #ff0 !important;
    color: #000 !important; }
  .cssColWaku.colWaku5.old {
    background-color: #ffff80;
    color: #808080; }
  .cssColWaku.colWaku5.light {
    background-color: #ffffc0;
    color: silver; }

.cssColWaku.colWaku6 {
  background-color: #80ff80;
  color: #000; }
  .cssColWaku.colWaku6.colWakuImportant {
    background-color: #80ff80 !important;
    color: #000 !important; }
  .cssColWaku.colWaku6.colWakuBImportant {
    background-color: #0f0 !important;
    color: #000 !important; }
  .cssColWaku.colWaku6.old {
    background-color: #80ff80;
    color: #808080; }
  .cssColWaku.colWaku6.light {
    background-color: #c0ffc0;
    color: silver; }

.cssColWaku.colWaku7 {
  background-color: #ffcc80;
  color: #000; }
  .cssColWaku.colWaku7.colWakuImportant {
    background-color: #ffcc80 !important;
    color: #000 !important; }
  .cssColWaku.colWaku7.colWakuBImportant {
    background-color: #f90 !important;
    color: #000 !important; }
  .cssColWaku.colWaku7.old {
    background-color: #ffcc80;
    color: #808080; }
  .cssColWaku.colWaku7.light {
    background-color: #ffe0c0;
    color: silver; }

.cssColWaku.colWaku8 {
  background-color: #ffb3ff;
  color: #000; }
  .cssColWaku.colWaku8.colWakuImportant {
    background-color: #ffb3ff !important;
    color: #000 !important; }
  .cssColWaku.colWaku8.colWakuBImportant {
    background-color: #f6f !important;
    color: #fff !important; }
  .cssColWaku.colWaku8.old {
    background-color: #ffb3ff;
    color: #fff; }
  .cssColWaku.colWaku8.light {
    background-color: #ffd9ff; }

.cssColWaku > span.goalrank {
  position: absolute;
  left: -6px;
  top: -6px;
  display: block;
  width: 10px;
  height: 10px;
  line-height: 10px;
  font-size: 8px;
  border-radius: 6px;
  text-align: center;
  color: #888;
  background-color: #fff;
  border: solid 1px #ddd; }
  .cssColWaku > span.goalrank.rank1 {
    background-color: #f00;
    color: #fff; }
  .cssColWaku > span.goalrank.rank2 {
    background-color: #f80;
    color: #fff; }
  .cssColWaku > span.goalrank.rank3 {
    background-color: #0af;
    color: #fff; }
  .cssColWaku > span.goalrank.rank4, .cssColWaku > span.goalrank.rank5 {
    color: #000; }

.cssColWaku.grayFrame {
  border: solid 1px #ccc; }

.cssColWaku.colWakuLight1 {
  background-color: #f0f0f0;
  color: #808080; }

.cssColWaku.colWakuLight2 {
  background-color: #7c7c7c; }

.cssColWaku.colWakuLight3 {
  background-color: #ff8080; }

.cssColWaku.colWakuLight4 {
  background-color: #7c7cfb; }

.cssColWaku.colWakuLight5 {
  background-color: #ffff80;
  color: #808080; }

.cssColWaku.colWakuLight6 {
  background-color: #80ff80;
  color: #808080; }

.cssColWaku.colWakuLight7 {
  background-color: #ffcc80;
  color: #808080; }

.cssColWaku.colWakuLight8 {
  background-color: #ffb3ff;
  color: #808080; }

.cssColWaku.colWakuDLightText1 {
  color: #404040; }

.cssColWaku.colWakuDLightText2 {
  color: #fff; }

.cssColWaku.colWakuDLightText3 {
  color: #fff; }

.cssColWaku.colWakuDLightText4 {
  color: #fff; }

.cssColWaku.colWakuDLightText5 {
  color: #404040; }

.cssColWaku.colWakuDLightText6 {
  color: #404040; }

.cssColWaku.colWakuDLightText7 {
  color: #404040; }

.cssColWaku.colWakuDLightText8 {
  color: #404040; }

.cssGrade {
  margin-left: 0.5em;
  vertical-align: middle;
  display: inline-block;
  width: 26px;
  line-height: 15px;
  font-size: 12px;
  text-align: center;
  border: solid 1px #333; }
  .cssGrade.gradeGI, .cssGrade.gradeJGI, .cssGrade.gradeJpnI {
    color: #fff;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f00), to(#9c1034));
    background-image: -webkit-linear-gradient(#f00, #9c1034);
    background-image: -moz-linear-gradient(#f00, #9c1034);
    background-image: -ms-linear-gradient(#f00, #9c1034);
    background-image: -o-linear-gradient(#f00, #9c1034);
    background-image: linear-gradient(#f00, #9c1034); }
  .cssGrade.gradeGII, .cssGrade.gradeJGII, .cssGrade.gradeJpnII {
    color: #fff;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#0f0), to(#00a93a));
    background-image: -webkit-linear-gradient(#0f0, #00a93a);
    background-image: -moz-linear-gradient(#0f0, #00a93a);
    background-image: -ms-linear-gradient(#0f0, #00a93a);
    background-image: -o-linear-gradient(#0f0, #00a93a);
    background-image: linear-gradient(#0f0, #00a93a); }
  .cssGrade.gradeGIII, .cssGrade.gradeG, .cssGrade.gradeJGIII, .cssGrade.gradeJpnIII {
    color: #fff;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#00f), to(#009fa8));
    background-image: -webkit-linear-gradient(#00f, #009fa8);
    background-image: -moz-linear-gradient(#00f, #009fa8);
    background-image: -ms-linear-gradient(#00f, #009fa8);
    background-image: -o-linear-gradient(#00f, #009fa8);
    background-image: linear-gradient(#00f, #009fa8); }

/*
 * リスト表示
 */
.cssListItem {
  display: block;
  position: relative;
  margin: 0;
  padding: 5px 0;
  line-height: 20px;
  box-sizing: border-box;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  border: solid 1px #ccc;
  border-bottom: none; }
  .cssListItem:last-child {
    border-bottom: solid 1px #ccc; }

/*
 * 着順色
 */
.colGoalRank {
  color: #ccc; }

.colGoalRank1 {
  color: #f00; }

.colGoalRank2 {
  color: #f80; }

.colGoalRank3 {
  color: #0af; }

.colGoalRank4 {
  color: #000; }

.colGoalRank5 {
  color: #000; }

.colBoxGoalRank {
  color: #ccc; }
  .colBoxGoalRank.colBoxGoalRank1 {
    background-color: #f00;
    color: #fff; }
  .colBoxGoalRank.colBoxGoalRank2 {
    background-color: #f80;
    color: #fff; }
  .colBoxGoalRank.colBoxGoalRank3 {
    background-color: #0af;
    color: #fff; }
  .colBoxGoalRank.colBoxGoalRank4, .colBoxGoalRank.colBoxGoalRank5 {
    color: #000; }

/*
 * 分類文字列
 */
.colBunrui {
  color: #777777; }

.colBunrui5,
.colBunrui6,
.colBunrui7 {
  color: #9f0000; }

/*
 * タブ
 */
.cssTabGroup {
  position: relative;
  display: flex; }
  .cssTabGroup:after {
    content: "";
    display: block;
    width: 100%;
    border-bottom: solid 1px #7f7f7f;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2; }

.cssTab {
  position: relative;
  z-index: 1;
  border-radius: 4px 4px 0 0;
  border: 1px solid #7f7f7f;
  border-bottom: none;
  background-color: #f7f7ff;
  color: #000;
  font-size: 12px;
  line-height: 3;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  display: inline-block;
  width: 100%;
  margin: 0 8px; }
  .cssTab:hover {
    background-color: #e9e9ff;
    z-index: 3; }
  .cssTab.active {
    background-color: #7f7fff;
    color: #fff;
    z-index: 3; }
    .cssTab.active svg#check_svg {
      display: block; }
  .cssTab svg#check_svg {
    width: 18px;
    height: 18px;
    display: none;
    position: absolute;
    left: 10px;
    top: 50%;
    margin-top: -9px; }
    .cssTab svg#check_svg polygon {
      fill: #fff; }
  .cssTab.cssTabLightActive:hover {
    background-color: #e9e9ff;
    z-index: 3; }
  .cssTab.cssTabLightActive.active {
    background-color: #9f9fff;
    color: #fff;
    z-index: 3; }
  .cssTab.cssTabEmpty {
    visibility: hidden; }
  .cssTab.cssTabDisabled {
    opacity: 0.5;
    pointer-events: none; }

/*
 * 馬単などでの右矢印
 */
.cssRightTriangle {
  display: inline;
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 6px solid #000;
  border-right: 0px solid transparent;
  font-size: 0;
  position: relative; }

/*
 * 馬連などのハイフン
 */
.cssStraight {
  display: inline;
  width: 0;
  height: 0;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  border-left: 3px solid #000;
  border-right: 3px solid #000;
  font-size: 0;
  position: relative; }

/*
 * 開閉ミニブロック矢印
 */
.cssMiniDownMark:before {
  content: "";
  position: absolute;
  right: 0;
  background-color: #fff;
  width: 18px;
  height: 18px;
  border-radius: 9px;
  top: 50%;
  margin-top: -9px;
  box-sizing: border-box;
  border: solid 1px #eee;
  transition-property: background-color;
  transition-duration: 0.2s; }

.cssMiniDownMark:hover:before {
  border-color: #cfcfcf;
  background-color: #e7e7e7; }

.cssMiniDownMark:active:before {
  border-color: #cfcfcf;
  background-color: #9f9f9f; }

.cssMiniDownMark:after {
  content: "";
  position: absolute;
  right: 6px;
  top: 50%;
  display: inline;
  width: 0;
  height: 0;
  font-size: 0;
  margin-top: -2px; }

.cssMiniDownMark:after {
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-top: 5px solid #000;
  border-bottom: 0px solid transparent; }

.cssMiniUpMark:before {
  content: "";
  position: absolute;
  right: 0;
  background-color: #fff;
  width: 18px;
  height: 18px;
  border-radius: 9px;
  top: 50%;
  margin-top: -9px;
  box-sizing: border-box;
  border: solid 1px #eee;
  transition-property: background-color;
  transition-duration: 0.2s; }

.cssMiniUpMark:hover:before {
  border-color: #cfcfcf;
  background-color: #e7e7e7; }

.cssMiniUpMark:active:before {
  border-color: #cfcfcf;
  background-color: #9f9f9f; }

.cssMiniUpMark:after {
  content: "";
  position: absolute;
  right: 6px;
  top: 50%;
  display: inline;
  width: 0;
  height: 0;
  font-size: 0;
  margin-top: -2px; }

.cssMiniUpMark:after {
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-bottom: 5px solid #000;
  border-top: 0px solid transparent;
  margin-top: -3px; }

/*
 * クリアフィクス
 */
.cssClearfix:after {
  clear: both;
  content: ".";
  visibility: hidden;
  display: block;
  height: 0; }

.textAlignRight {
  text-align: right; }

.textAlignLeft {
  text-align: left; }

.textAlignCenter {
  text-align: center; }

.RelativeBlock,
.cssRelativeBlock {
  position: relative; }

/*
 * ツールチップ
 * MAJIからそのまま流用
 */
/* ツールチップ */
.tooltipOpener {
  position: relative; }

.tooltipOpener .tooltip {
  display: none;
  border-radius: 4px;
  position: absolute;
  margin: 0;
  padding: 4px;
  background-color: #ffb;
  z-index: 2;
  border: solid 1px #ccc;
  line-height: 14px; }

.tooltipOpener.openTooltip .tooltip,
.tooltipOpener:hover .tooltip {
  display: block; }

.eva_item_goto tr.open .tooltipOpener:hover .tooltip {
  display: none; }

.tooltipOpener .tooltip.bottom:before {
  top: 28px; }

.tooltipOpener .tooltip.bottom:before {
  content: "";
  position: absolute;
  top: -8px;
  left: 20px;
  margin-left: -9px;
  display: block;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 0 9px 9px 9px;
  border-color: transparent transparent #ffb transparent;
  z-index: 2; }

.tooltipOpener .tooltip.bottom.arrowlong:before {
  border-width: 0 9px 18px 9px;
  top: -18px; }

.tooltipOpener .tooltip.bottom.bottomright:before {
  left: auto;
  right: 20px;
  margin-left: 0;
  margin-right: -9px; }

.tooltipOpener .tooltip.bottom:after {
  content: "";
  position: absolute;
  top: -10px;
  left: 20px;
  margin-left: -10px;
  display: block;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 0 10px 10px 10px;
  border-color: transparent transparent #ccc transparent;
  z-index: 1; }

.tooltipOpener .tooltip.bottom.arrowlong:after {
  border-width: 0 10px 20px 10px;
  top: -20px; }

.tooltipOpener .tooltip.bottom.bottomright:after {
  left: auto;
  right: 20px;
  margin-left: 0;
  margin-right: -10px; }

.tooltipOpener .tooltip.bottom:before {
  bottom: 28px; }

.tooltipOpener .tooltip.top:before {
  content: "";
  position: absolute;
  bottom: -8px;
  left: 20px;
  margin-left: -9px;
  display: block;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 9px 9px 0 9px;
  border-color: #ffb transparent transparent transparent;
  z-index: 2; }

.tooltipOpener .tooltip.top.arrowlong:before {
  border-width: 18px 9px 0 9px;
  bottom: -18px; }

.tooltipOpener .tooltip.top.arrowmini:before {
  border-width: 9px 5px 0 5px; }

.tooltipOpener .tooltip.top.topright:before {
  left: auto;
  right: 20px;
  margin-left: 0;
  margin-right: -9px; }

.tooltipOpener .tooltip.top:after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 20px;
  margin-left: -10px;
  display: block;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 10px 10px 0 10px;
  border-color: #ccc transparent transparent transparent;
  z-index: 1; }

.tooltipOpener .tooltip.top.arrowlong:after {
  border-width: 20px 10px 0 10px;
  bottom: -20px; }

.tooltipOpener .tooltip.top.arrowmini:after {
  border-width: 10px 6px 0 6px; }

.tooltipOpener .tooltip.top.topright:after {
  left: auto;
  right: 20px;
  margin-left: 0;
  margin-right: -10px; }

/*
 * 率などのランク
 */
.cssColRank1 {
  background-color: #f00;
  color: #fff; }

.cssColRank2 {
  background-color: #f80;
  color: #fff; }

.cssColRank3 {
  background-color: #0af;
  color: #fff; }

.cssColRank4 {
  color: #000; }

.cssColRank5 {
  color: #000; }

/*
 * 縦書き関連
 */
.tateLine {
  position: relative;
  display: block;
  margin: 0;
  padding: 0;
  width: 1em;
  line-height: 1em;
  word-wrap: break-word;
  word-break: break-all; }
  .tateLine.kt {
    position: relative;
    right: -0.1em; }

.tategaki {
  -webkit-text-stroke-width: 0.1px;
  letter-spacing: 0.5em; }

.font_mjka {
  font-family: 'mjka', 'Noto Sans', 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif; }

/*
 * 馬柱内の相対差グラフ
 */
.soutaisa_vbar_graph {
  position: relative; }
  .soutaisa_vbar_graph ul {
    width: 100%;
    margin: 6px 0 0;
    padding: 0;
    list-style-type: none; }
    .soutaisa_vbar_graph ul li {
      border-top: 1px #ddd solid;
      padding: 0;
      margin: 0;
      height: 19px;
      height: 9px; }
      .soutaisa_vbar_graph ul li.zero {
        border-color: #bbb; }
  .soutaisa_vbar_graph .vbar {
    display: block;
    position: absolute;
    z-index: 6;
    bottom: 0;
    height: 0;
    width: 16px;
    left: 50%;
    margin-left: -8px;
    background-color: #bfbfff; }
    .soutaisa_vbar_graph .vbar.pl {
      background-color: #ffbfbf; }
  .soutaisa_vbar_graph .valtext {
    display: block;
    position: absolute;
    z-index: 8;
    left: 0;
    width: 100%;
    text-align: center; }
  .soutaisa_vbar_graph .closebtn {
    display: block;
    position: absolute;
    z-index: 10;
    top: -8px;
    left: 50%;
    margin-left: -0.5em;
    width: 1em;
    text-align: center;
    cursor: pointer; }
  .soutaisa_vbar_graph .minbar,
  .soutaisa_vbar_graph .maxbar {
    display: block;
    position: absolute;
    width: 16px;
    height: 0;
    left: 50%;
    margin-left: -8px;
    z-index: 9; }
  .soutaisa_vbar_graph .minbar {
    border-top: dotted 2px #00f;
    top: 0; }
  .soutaisa_vbar_graph .maxbar {
    border-bottom: dotted 2px #f00;
    bottom: 0; }
  .soutaisa_vbar_graph .srank {
    display: block;
    position: absolute;
    z-index: 10;
    top: 2px;
    left: 50%;
    margin-left: -2em;
    width: 4em;
    text-align: center; }

th .soutaisa_vbar_graph ul li {
  border: none;
  position: relative;
  top: -8px;
  color: #ddd;
  text-align: left;
  padding-left: 2px;
  height: 10px; }

/*
 * 馬柱での開閉制御
 */
.batyuShowHider:hover .hover_caption,
.batyuOpener:hover .hover_caption {
  color: #f00; }

.batyuShowHider .openclosemark:before,
.batyuOpener .openclosemark:before {
  content: "";
  position: absolute;
  right: 0;
  background-color: #fff;
  width: 18px;
  height: 18px;
  border-radius: 9px;
  top: 50%;
  margin-top: -9px;
  box-sizing: border-box;
  border: solid 1px #eee;
  transition-property: background-color;
  transition-duration: 0.2s; }

.batyuShowHider .openclosemark:hover:before,
.batyuOpener .openclosemark:hover:before {
  border-color: #cfcfcf;
  background-color: #e7e7e7; }

.batyuShowHider .openclosemark:active:before,
.batyuOpener .openclosemark:active:before {
  border-color: #cfcfcf;
  background-color: #9f9f9f; }

.batyuShowHider .openclosemark:after,
.batyuOpener .openclosemark:after {
  content: "";
  position: absolute;
  right: 6px;
  top: 50%;
  display: inline;
  width: 0;
  height: 0;
  font-size: 0;
  margin-top: -2px; }

.batyuShowHider .openclosemark:before,
.batyuOpener .openclosemark:before {
  content: none; }

.batyuShowHider .openclosemark:after,
.batyuOpener .openclosemark:after {
  top: 8px;
  right: 2px;
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-top: 5px solid #000;
  border-bottom: 0px solid transparent; }

.batyuShowHider.open .openclosemark:after,
.batyuOpener.open .openclosemark:after {
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-bottom: 5px solid #000;
  border-top: 0px solid transparent;
  margin-top: -3px; }

.batyuShowHider .defClose,
.batyuOpener .defClose {
  display: none; }

.batyuShowHider .open.defClose,
.batyuOpener .open.defClose {
  display: block; }

.batyuShowHider .open.defShow,
.batyuOpener .open.defShow {
  display: none; }

.batyuOpenerL2:hover .hover_caption {
  color: #f00; }

.batyuOpenerL2 .openclosemark:before {
  content: "";
  position: absolute;
  right: 0;
  background-color: #fff;
  width: 18px;
  height: 18px;
  border-radius: 9px;
  top: 50%;
  margin-top: -9px;
  box-sizing: border-box;
  border: solid 1px #eee;
  transition-property: background-color;
  transition-duration: 0.2s; }

.batyuOpenerL2 .openclosemark:hover:before {
  border-color: #cfcfcf;
  background-color: #e7e7e7; }

.batyuOpenerL2 .openclosemark:active:before {
  border-color: #cfcfcf;
  background-color: #9f9f9f; }

.batyuOpenerL2 .openclosemark:after {
  content: "";
  position: absolute;
  right: 6px;
  top: 50%;
  display: inline;
  width: 0;
  height: 0;
  font-size: 0;
  margin-top: -2px; }

.batyuOpenerL2 .openclosemark:before {
  content: none; }

.batyuOpenerL2 .openclosemark:after {
  top: 8px;
  right: 2px;
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-top: 5px solid #000;
  border-bottom: 0px solid transparent; }

.batyuOpenerL2.open2 .openclosemark:after {
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-bottom: 5px solid #000;
  border-top: 0px solid transparent;
  margin-top: -3px; }

.batyuOpenerL2 .defClose {
  display: none; }

.batyuOpenerL2 .open2.defClose {
  display: block; }

.batyuOpenerL2 .open2.defShow {
  display: none; }

/*
 * mini出走表
 */
.miniRaceContent {
  position: absolute;
  z-index: 99999;
  background-color: #fff;
  font-size: 10px;
  margin: 0;
  padding: 0;
  border: solid 1px #aaa;
  width: 455px;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none; }
  .miniRaceContent.lowprio {
    z-index: 9; }

.miniRaceContent tr.nextTrOpener.close svg {
  -webkit-transform: scaleY(-1);
  -o-transform: scaleY(-1);
  -moz-transform: scaleY(-1);
  transform: scaleY(-1);
  filter: FlipV;
  -ms-filter: "FlipV"; }

.miniRaceContent tr.nextTrOpener.close + tr {
  display: none; }

.miniRaceContent .row {
  margin: 2px 0;
  padding: 0 2px;
  line-height: 14px; }

.miniRaceContent > .row.title {
  position: relative;
  font-size: 12px;
  background-color: #aaa;
  padding: 2px 2px;
  margin-top: 0;
  margin-bottom: 0;
  height: 18px;
  line-height: 18px;
  cursor: pointer; }

.onDrag .miniRaceContent > .row.title {
  cursor: move; }

.miniRaceContent > .row.title.turf {
  background-color: #dfd; }

.miniRaceContent > .row.title.dirt {
  background-color: #ffc; }

.miniRaceContent > .row.title span.year {
  display: inline-block;
  font-size: 10px;
  width: 24px;
  margin: 0 0 0 4px; }

.miniRaceContent > .row.title span.monthdate {
  font-weight: bold; }

.miniRaceContent > .row.title span.week {
  font-weight: bold;
  margin-right: 6px;
  margin-left: 3px; }

.miniRaceContent > .row.title span.ground {
  font-weight: bold; }

.miniRaceContent > .row.title span.raceno {
  font-weight: bold;
  margin-right: 4px; }

.miniRaceContent > .row.title span.racename {
  font-weight: bold; }

.miniRaceContent > .row.title span.grade {
  font-weight: bold; }

.miniRaceContent > .row.title button.close {
  position: absolute;
  top: 4px;
  right: 4px;
  display: block;
  width: 14px;
  height: 14px;
  line-height: 14px;
  margin: 0;
  padding: 0;
  border: solid 1px #aaa;
  background-color: #fff; }

.miniRaceContent > .row.title button.close svg {
  position: absolute;
  top: 2px;
  left: 2px; }

.miniRaceContent > .row.title button.close svg path.close {
  stroke-width: 10;
  stroke: #000; }

.miniRaceContent > .row.title button.close:hover {
  border-color: #f00; }

.miniRaceContent ul.raceinfo {
  margin: 0;
  padding: 0;
  list-style-type: none; }

.miniRaceContent ul.raceinfo li {
  display: inline-block;
  height: 60px;
  border-top: solid 1px #aaa;
  border-bottom: solid 1px #aaa;
  border-left: solid 1px #aaa;
  vertical-align: top; }

.miniRaceContent ul.raceinfo li:first-child {
  border-left: none; }

.miniRaceContent ul.raceinfo.turf li {
  border-color: #090; }

.miniRaceContent ul.raceinfo.dirt li {
  border-color: #af6f00; }

.miniRaceContent ul.raceinfo.raceinfoext li {
  border-top: none;
  height: 20px;
  line-height: 20px; }

.miniRaceContent ul.raceinfo li.info {
  width: 227px; }

.miniRaceContent ul.raceinfo li.info .onerow {
  display: block;
  margin: 0;
  padding: 0;
  line-height: 19px;
  height: 19px;
  padding-left: 4px; }

.miniRaceContent ul.raceinfo li.info .onerow {
  border-top: solid 1px #aaa; }

.miniRaceContent ul.raceinfo li.info .onerow:first-child {
  border-top: none; }

.miniRaceContent ul.raceinfo.turf li.info .onerow {
  border-color: #090; }

.miniRaceContent ul.raceinfo.dirt li.info .onerow {
  border-color: #af6f00; }

.miniRaceContent ul.raceinfo li.coursegraph {
  position: relative;
  width: 176px;
  text-align: center; }

.miniRaceContent ul.raceinfo li.coursegraph .track_distance {
  position: absolute;
  left: 2px;
  top: 2px;
  font-size: 12px;
  font-weight: bold; }

.miniRaceContent ul.raceinfo li.coursegraph img {
  vertical-align: bottom; }

.miniRaceContent ul.raceinfo li.weatherbaba {
  width: 50px;
  text-align: center; }

.miniRaceContent ul.raceinfo li.weatherbaba span.weather {
  display: block;
  height: 20px;
  line-height: 20px; }

.miniRaceContent ul.raceinfo li.weatherbaba span.weather img {
  width: 12px;
  height: 12px;
  vertical-align: top;
  margin-right: 0.8em;
  margin-top: -1px;
  position: relative;
  top: 5px; }

.miniRaceContent ul.raceinfo li.weatherbaba span.baba {
  display: block;
  line-height: 20px;
  height: 40px; }

.miniRaceContent ul.raceinfo li.captionbasetimeA {
  width: 67px;
  text-align: center;
  background-color: #eee; }

.miniRaceContent ul.raceinfo li.basetimeA {
  width: 108px;
  text-align: center; }

.miniRaceContent ul.raceinfo li.basesi {
  width: 50px;
  text-align: center; }

.miniRaceContent ul.raceinfo li.captionbasetimeB {
  width: 67px;
  text-align: center;
  background-color: #eee; }

.miniRaceContent ul.raceinfo li.basetimeB {
  width: 108px;
  text-align: center; }

.miniRaceContent ul.payback {
  margin: 0;
  padding: 0;
  list-style-type: none; }

.miniRaceContent ul.payback li {
  display: inline-block;
  vertical-align: top;
  padding: 0;
  margin: 0; }

.miniRaceContent ul.payback li:first-child {
  margin-right: 4px; }

.miniRaceContent table.payback {
  border-collapse: collapse;
  border: solid 1px #aaa; }

.miniRaceContent table.payback th,
.miniRaceContent table.payback td {
  border: solid 1px #aaa; }

.miniRaceContent table.payback th {
  background-color: #eee;
  font-weight: normal;
  width: 41px;
  text-align: center; }

.miniRaceContent table.payback td.no {
  width: 58px;
  text-align: center; }

.miniRaceContent table.payback td.money {
  width: 77px;
  text-align: right;
  border-right: none; }

.miniRaceContent table.payback td.vogue {
  width: 43px;
  text-align: center;
  border-left: none; }

.miniRaceContent table.horse {
  border-collapse: collapse;
  border: solid 1px #aaa;
  margin-left: 0; }

.miniRaceContent table.horse td.colWaku {
  position: static; }

.miniRaceContent table.horse tr.grayed td {
  color: #aaa; }

.miniRaceContent table.horse tr.grayed td.otherrace {
  color: #888; }

.miniRaceContent table.horse tr.hilight td {
  background-color: #eef8ff; }

.miniRaceContent table.horse tr.hilight2 td {
  background-color: #eef8ff;
  color: #aaa; }

.miniRaceContent table.horse tr.kakuteimae {
  cursor: pointer; }

.miniRaceContent table.horse tr.kakuteimae td {
  color: #888; }

.miniRaceContent table.horse tr.kakuteimae td svg {
  position: absolute;
  top: 2px;
  right: 2px; }

.miniRaceContent table.horse.closeKakuteimae tr.kakuteimae td svg {
  -webkit-transform: scaleY(-1);
  -o-transform: scaleY(-1);
  -moz-transform: scaleY(-1);
  transform: scaleY(-1);
  filter: FlipV;
  -ms-filter: "FlipV"; }

.miniRaceContent table.horse.closeKakuteimae tr.kakuteimaeinfo {
  display: none; }

.miniRaceContent table.horse.closeKakuteimae tr.kakuteimaeinfo.hilight {
  display: table-row; }

.miniRaceContent table.horse tr.kakuteimaeinfo td a {
  color: #888;
  text-decoration: none; }

.miniRaceContent table.horse tr.kakuteimaeinfo td a:hover {
  color: #f00; }

.miniRaceContent table.horse th,
.miniRaceContent table.horse td {
  border: solid 1px #aaa;
  padding: 1px; }

.miniRaceContent table.horse th {
  background-color: #eee;
  font-weight: normal; }

.miniRaceContent table.horse td.grank {
  width: 16px;
  text-align: center; }

.miniRaceContent table.horse td.baban {
  width: 16px;
  text-align: center; }

.miniRaceContent table.horse td.name {
  width: 100px;
  text-align: left;
  /*overflow: hidden;*/
  white-space: nowrap;
  /*text-overflow: ellipsis;*/ }

.miniRaceContent table.horse td.sex {
  width: 22px;
  text-align: center; }

.miniRaceContent table.horse tr.grayed td.sex .color_male {
  color: #aaa; }

.miniRaceContent table.horse td.weight {
  width: 22px;
  text-align: center; }

.miniRaceContent table.horse td.jockey {
  width: 46px;
  text-align: left; }

.miniRaceContent table.horse td.time {
  width: 32px;
  text-align: right;
  padding-right: 4px; }

.miniRaceContent table.horse td.timesa {
  width: 34px;
  text-align: center; }

.miniRaceContent table.horse td.l3f {
  width: 24px;
  text-align: center; }

.miniRaceContent table.horse td.l3f.rank1 {
  color: #66f; }

.miniRaceContent table.horse tr.hilight td.l3f.rank1 {
  color: #00f; }

.miniRaceContent table.horse td.ashi {
  width: 16px;
  text-align: center; }

.miniRaceContent table.horse td.sp {
  width: 32px;
  padding-right: 2px;
  padding-left: 0;
  text-align: right; }

.miniRaceContent table.horse td.odds span.winodds {
  display: inline-block;
  width: 27px;
  text-align: right; }

.miniRaceContent table.horse td.odds span.winvogue {
  display: inline-block;
  width: 24px;
  text-align: center; }

.miniRaceContent table.horse td.odds span.winodds.winvogue {
  display: inline-block;
  width: 51px;
  text-align: center; }

.miniRaceContent table.footer {
  border-collapse: collapse;
  border: solid 1px #aaa;
  width: 451px; }

.miniRaceContent table.footer th,
.miniRaceContent table.footer td {
  border: solid 1px #aaa;
  padding: 1px; }

.miniRaceContent table.footer td.laptime {
  border-bottom: none;
  padding-bottom: 2px; }

.miniRaceContent table.footer td.laptime svg {
  position: absolute;
  top: 2px;
  left: 10px; }

.miniRaceContent table.footer td.laptime table.laptime {
  border-collapse: collapse;
  margin: 1px 1px 0 auto; }

.miniRaceContent table.footer td.laptime table.laptime td {
  border: solid 1px #ccc;
  line-height: 10px;
  height: 10px;
  padding: 2px 0;
  width: 22px;
  text-align: center; }

.miniRaceContent table.footer td.laptime table.laptime td.f3 {
  background-color: #f7f7f7; }

.miniRaceContent table.footer td.lapchart {
  border-top: none; }

.miniRaceContent table.footer td.lapchart .courseGraphBlock {
  text-align: right; }

.miniRaceContent table.footer td.lapchart .lapavecaution {
  text-align: left;
  padding-left: 32px;
  color: #888; }

.miniRaceContent table.footer th {
  background-color: #eee;
  font-weight: normal;
  width: 30px;
  vertical-align: top; }

.miniRaceContent table.footer .courseGraphBlock canvas {
  vertical-align: bottom; }

.miniRaceContent table.footer span.laptime {
  width: 24px;
  text-align: center; }

.miniRaceContent table.footer table.laptime td.slow,
.miniRaceContent table.footer span.pace.slow {
  color: #f00; }

.miniRaceContent table.footer table.laptime td.fast,
.miniRaceContent table.footer span.pace.fast {
  color: #00f; }

.miniRaceContent table.footer span.pcap {
  display: inline-block;
  width: 28px;
  text-align: right; }

.miniRaceContent table.footer span.pace {
  display: inline-block;
  width: 28px;
  text-align: left; }

.miniRaceContent table.footer tr.doubleEmpty th,
.miniRaceContent table.footer tr.doubleEmpty td {
  padding: 0;
  height: 1px; }

.miniRaceContent table.footer td.corner {
  padding-left: 2px; }

.miniRaceContent table.footer td.corner span.rankover {
  color: #aaa; }

.miniRaceContent table.footer td.corner span.rank1,
.miniRaceContent table.footer td.corner span.rank2,
.miniRaceContent table.footer td.corner span.rank3,
.miniRaceContent table.footer td.corner span.rank4 {
  color: #fff;
  display: inline-block;
  padding-left: 3px;
  padding-right: 3px; }

.miniRaceContent table.footer td.corner span.rank1 {
  background-color: #f00; }

.miniRaceContent table.footer td.corner span.rank2 {
  background-color: #f80; }

.miniRaceContent table.footer td.corner span.rank3 {
  background-color: #0af; }

.miniRaceContent table.footer tr.movie td {
  padding: 1px 0 1px 2px;
  height: 23px; }

.miniRaceContent table.footer tr.movie span.movielink {
  display: inline-block;
  height: 23px;
  padding: 0;
  margin: 0; }

/*
 * mini履歴リスト
 */
.miniHorseSummaryContent {
  position: absolute;
  z-index: 99999;
  background-color: #fff;
  font-size: 10px;
  margin: 0;
  padding: 0;
  border: solid 1px #aaa;
  width: 922px;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none; }
  .miniHorseSummaryContent.lowprio {
    z-index: 9; }

.miniHorseSummaryContent .row {
  margin: 0;
  padding: 2px;
  line-height: 14px; }

.miniHorseSummaryContent .row_title {
  font-size: 14px;
  border-bottom: solid 1px #aaa;
  cursor: pointer; }

.onDrag .miniHorseSummaryContent .row_title {
  cursor: move; }

.miniHorseSummaryContent .row_title .waku {
  margin: -2px 0 -2px -2px;
  display: inline-block;
  width: 18px;
  text-align: center;
  line-height: 18px;
  border-right: 1px solid #aaa; }

.miniHorseSummaryContent .row_title .waku + span {
  margin-left: 4px; }

.miniHorseSummaryContent .row_title button.close {
  position: absolute;
  top: 2px;
  right: 4px;
  display: block;
  width: 14px;
  height: 14px;
  line-height: 14px;
  margin: 0;
  padding: 0;
  border: solid 1px #aaa;
  background-color: #fff; }

.miniHorseSummaryContent .row_title button.close svg {
  position: absolute;
  top: 2px;
  left: 2px; }

.miniHorseSummaryContent .row_title button.close svg path.close {
  stroke-width: 10;
  stroke: #000; }

.miniHorseSummaryContent .row_title button.close:hover {
  border-color: #f00; }

.miniHorseSummaryContent table.tyakudo {
  margin: 0;
  padding: 0;
  font-size: 10px;
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse; }

.miniHorseSummaryContent table.tyakudo.tyakudoClass,
.miniHorseSummaryContent table.tyakudo.tyakudoTrack,
.miniHorseSummaryContent table.tyakudo.tyakudoKonso {
  margin-bottom: 4px; }

.miniHorseSummaryContent table.tyakudo th {
  background-color: #eee;
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
  border-left: solid 1px #ccc;
  text-align: center;
  font-weight: normal;
  line-height: 12px;
  height: 12px; }

.miniHorseSummaryContent table.tyakudo td {
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
  border-right: solid 1px #ccc;
  padding-left: 2px;
  line-height: 12px;
  height: 12px;
  text-align: center; }

.miniHorseSummaryContent table.tyakudo td span.tyaku {
  display: inline-block;
  width: 19px;
  margin-left: 2px;
  margin-right: 2px;
  text-align: center; }

.miniHorseSummaryContent table.tyakudo.tyakudoPace td span.tyaku {
  width: 18px;
  margin-left: 1px;
  margin-right: 1px; }

.miniHorseSummaryContent div.row.blood {
  margin: 4px 0 0; }

.miniHorseSummaryContent table.tenkyu,
.miniHorseSummaryContent table.blood {
  padding: 0;
  font-size: 10px;
  width: 100%;
  table-layout: fixed;
  border: solid 1px #ccc;
  border-collapse: collapse; }

.miniHorseSummaryContent table.tenkyu th,
.miniHorseSummaryContent table.blood th {
  background-color: #eee;
  width: 44px;
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
  border-left: solid 1px #ccc;
  text-align: center;
  font-weight: normal;
  line-height: 12px;
  height: 12px; }

.miniHorseSummaryContent table.tenkyu td,
.miniHorseSummaryContent table.blood td {
  width: 129px;
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
  border-right: solid 1px #ccc;
  padding-left: 2px;
  line-height: 12px;
  height: 12px; }

.miniHorseSummaryContent table.tenkyu td.tenkyu,
.miniHorseSummaryContent table.blood td.family {
  width: auto; }

.miniHorseSummaryContent .row_summary {
  margin-bottom: 8px; }

.miniHorseSummaryContent .summaryContent .wrapper {
  /*max-height: 470px;*/
  overflow: hidden;
  position: relative;
  z-index: 1;
  margin-top: -1px; }

.miniHorseSummaryContent .summaryContent .ViewWrapper > .csv_downbutton,
.miniHorseSummaryContent .summaryContent .ViewWrapper > .csv_upbutton {
  height: 19px; }

.miniHorseSummaryContent .summaryContent .wrapper .underBorder {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background-color: #ccc;
  z-index: 9; }

.miniHorseSummaryContent .summaryContent.bottomHoverSelectFrame .underBorder,
.miniHorseSummaryContent .summaryContent.bottomSelectFrame .underBorder {
  background-color: #f00; }

.miniHorseSummaryContent .summaryContent.topHoverSelectFrame thead tr:last-child td,
.miniHorseSummaryContent .summaryContent.topSelectFrame thead tr:last-child td {
  border-bottom-color: #f00; }

.miniHorseSummaryContent .summaryContent .wrapper table {
  position: absolute;
  left: 0;
  top: 0; }

.miniHorseSummaryContent .summaryContent table {
  position: relative;
  z-index: 1;
  border-collapse: collapse; }

.miniHorseSummaryContent .summaryContent table.summaryCaption {
  position: relative;
  z-index: 9; }

.miniHorseSummaryContent .summaryContent table.summaryCaption th {
  background-color: #eee;
  font-weight: normal; }

.miniHorseSummaryContent .summaryContent table.summaryCaption thead td {
  color: #000;
  background-color: #eee; }

.miniHorseSummaryContent .summaryContent table tr.yasumiAke td {
  height: 2px;
  padding: 0;
  text-align: center; }

.miniHorseSummaryContent .summaryContent table th,
.miniHorseSummaryContent .summaryContent table td {
  border: solid 1px #ccc;
  border-bottom: none; }

.miniHorseSummaryContent .summaryContent table td.colWaku {
  position: static; }

.miniHorseSummaryContent .summaryContent table tr:last-child th,
.miniHorseSummaryContent .summaryContent table tr:last-child td {
  border-bottom: solid 1px #ccc; }

.miniHorseSummaryContent .summaryContent table thead.afHidden tr th {
  border-bottom: none; }

.miniHorseSummaryContent .summaryContent table thead.afHidden tr td {
  border-top: none;
  height: 0px;
  line-height: 0;
  font-size: 0;
  padding-top: 0;
  padding-bottom: 0;
  pointer-events: none; }

.miniHorseSummaryContent .summaryContent table thead.afHidden tr td * {
  display: none; }

.miniHorseSummaryContent .summaryContent table tbody tr.selected td {
  background-color: #eef8ff; }

/*.miniHorseSummaryContent .summaryContent table tr.selecter:hover td,
			.miniHorseSummaryContent .summaryContent table tr.selectFrame td {
				border-top-color: #f00;
				border-bottom-color: #f00;
			}
				.miniHorseSummaryContent .summaryContent table tr.selecter:hover td:first-child,
				.miniHorseSummaryContent .summaryContent table tr.selectFrame td:first-child {
					border-left-color: #f00;
				}
				.miniHorseSummaryContent .summaryContent table tr.selecter:hover td:last-child,
				.miniHorseSummaryContent .summaryContent table tr.selectFrame td:last-child {
					border-right-color: #f00;
				}
				.miniHorseSummaryContent .summaryContent table tr.selecter:hover + tr td,
				.miniHorseSummaryContent .summaryContent table tr.selectFrame + tr td {
					border-top-color: #f00;
				}*/
.miniHorseSummaryContent .summaryContent table td {
  padding: 1px 2px;
  color: #888; }
  .miniHorseSummaryContent .summaryContent table td.jyokenclass {
    max-width: 64px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }

.miniHorseSummaryContent .summaryContent table td.jockey .change {
  color: #a44; }

.miniHorseSummaryContent .summaryContent table td.weather {
  line-height: 12px; }

.miniHorseSummaryContent .summaryContent table td.weather img {
  width: 12px;
  height: 12px;
  vertical-align: bottom; }

.miniHorseSummaryContent .summaryContent table tr td.fastl3f {
  color: #00f; }

.miniHorseSummaryContent .summaryContent table tr td.rank1 {
  background-color: #f00 !important;
  color: #fff; }

.miniHorseSummaryContent .summaryContent table tr td.rank2 {
  background-color: #f80 !important;
  color: #fff; }

.miniHorseSummaryContent .summaryContent table tr td.rank3 {
  background-color: #0af !important;
  color: #fff; }

.miniHorseSummaryContent .summaryContent table tr td.rank4,
.miniHorseSummaryContent .summaryContent table tr td.rank5 {
  color: #000; }

.miniHorseSummaryContent .summaryContent table td.track.turf.konso {
  color: #009900; }

.miniHorseSummaryContent .summaryContent table td.track.dirt.konso {
  color: #af7f00; }

.miniHorseSummaryContent .summaryContent table tbody tr.selected .konso,
.miniHorseSummaryContent .summaryContent table tbody .konso {
  background-color: #fee; }

.miniHorseSummaryContent .summaryContent table td.hingen {
  width: 10px;
  border-right: none; }

.miniHorseSummaryContent .summaryContent table td.handi {
  width: 10px;
  border-left: none; }

.miniHorseSummaryContent .summaryContent table .konsoRed {
  color: #7f0000; }

.miniHorseSummaryContent .summaryContent table thead .konsoRed {
  color: #d22; }

.miniHorseSummaryContent .summaryContent table td.rightBorderWhite {
  border-right-color: #fff; }

.miniHorseSummaryContent .summaryContent table td.leftBorderWhite {
  border-left-color: #fff; }

.miniHorseSummaryContent .summaryContent table td.minw2 {
  min-width: 20px; }

.miniHorseSummaryContent .summaryContent table td.minw5 {
  min-width: 50px; }

.miniHorseSummaryContent .summaryContent table td.minw6 {
  min-width: 60px; }

.miniHorseSummaryContent .summaryContent table td span.minh2 {
  display: inline-block;
  min-width: 1em;
  overflow: visible;
  white-space: nowrap; }

.miniHorseSummaryContent .summaryContent table td span.minh4 {
  display: inline-block;
  min-width: 2em;
  overflow: visible;
  white-space: nowrap; }

.miniHorseSummaryContent .summaryContent table td span.minh5 {
  display: inline-block;
  min-width: 2.5em;
  overflow: visible;
  white-space: nowrap; }

.miniHorseSummaryContent .summaryContent table td.jockey {
  font-size: 9px; }

.miniHorseSummaryContent .summaryContent table td .cancelRace {
  position: relative;
  left: -8px; }

.miniHorseSummaryContent .summaryContent table td .trouble {
  font-size: 8px; }

.miniHorseSummaryContent .summaryContent table td.odds {
  font-size: 8px; }

.miniHorseSummaryContent .summaryContent table td span.corner {
  display: inline-block;
  box-sizing: border-box;
  min-width: 10px;
  font-size: 8px;
  text-align: center; }

/*
 * 騎手・厩舎成績
 */
.miniTrainerSummaryContent,
.miniJockeySummaryContent {
  position: absolute;
  z-index: 99999;
  background-color: #fff;
  font-size: 10px;
  margin: 0;
  padding: 0;
  border: solid 1px #aaa;
  width: 982px;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none; }

.miniTrainerSummaryContent table.personlist,
.miniJockeySummaryContent table.personlist {
  font-size: 10px; }

.miniTrainerSummaryContent .row,
.miniJockeySummaryContent .row {
  margin: 0;
  padding: 2px;
  line-height: 14px; }

.miniTrainerSummaryContent .row_title,
.miniJockeySummaryContent .row_title {
  font-size: 14px;
  border-bottom: solid 1px #aaa;
  cursor: pointer; }

.miniTrainerSummaryContent .row_title span.minari,
.miniJockeySummaryContent .row_title span.minarai {
  display: inline-block;
  width: 1em;
  margin-left: 1em; }

.onDrag .miniTrainerSummaryContent .row_title,
.onDrag .miniJockeySummaryContent .row_title {
  cursor: move; }

.miniTrainerSummaryContent .row_title button.close,
.miniJockeySummaryContent .row_title button.close {
  position: absolute;
  top: 2px;
  right: 4px;
  display: block;
  width: 14px;
  height: 14px;
  line-height: 14px;
  margin: 0;
  padding: 0;
  border: solid 1px #aaa;
  background-color: #fff; }

.miniTrainerSummaryContent .row_title button.close svg,
.miniJockeySummaryContent .row_title button.close svg {
  position: absolute;
  top: 2px;
  left: 2px; }

.miniTrainerSummaryContent .row_title button.close svg path.close,
.miniJockeySummaryContent .row_title button.close svg path.close {
  stroke-width: 10;
  stroke: #000; }

.miniTrainerSummaryContent .row_title button.close:hover,
.miniJockeySummaryContent .row_title button.close:hover {
  border-color: #f00; }

/* 縦・横スクロールエリア関連 */
.ViewWrapper {
  position: relative;
  overflow: hidden; }

.ViewWrapper > .ViewContainer {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 5; }

.ViewWrapper > .csv_upbutton,
.ViewWrapper > .csv_downbutton,
.ViewWrapper > .csv_leftbutton,
.ViewWrapper > .csv_rightbutton {
  position: absolute;
  z-index: 10;
  font-size: 12px;
  margin: 0;
  padding: 0;
  line-height: 18px;
  background-color: rgba(0, 0, 0, 0.25);
  color: #fff;
  text-align: center;
  text-decoration: none;
  opacity: 0; }

.ViewWrapper > .csv_upbutton.off,
.ViewWrapper > .csv_downbutton.off,
.ViewWrapper > .csv_leftbutton.off,
.ViewWrapper > .csv_rightbutton.off {
  display: none; }

.ViewWrapper > .csv_upbutton,
.ViewWrapper > .csv_downbutton {
  width: 100%;
  height: 18px; }

.ViewWrapper > .csv_leftbutton,
.ViewWrapper > .csv_rightbutton {
  top: 0;
  height: 100%;
  width: 18px; }

.ViewWrapper > .csv_leftbutton svg,
.ViewWrapper > .csv_rightbutton svg {
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -5px; }

.ViewWrapper > .csv_upbutton:hover,
.ViewWrapper > .csv_downbutton:hover,
.ViewWrapper > .csv_leftbutton:hover,
.ViewWrapper > .csv_rightbutton:hover {
  opacity: 1; }

.ViewWrapper > .csv_upbutton {
  top: 0; }

.ViewWrapper > .csv_downbutton {
  bottom: 0; }

.ViewWrapper > .csv_leftbutton {
  left: 0; }

.ViewWrapper > .csv_rightbutton {
  right: 0; }

/*
 * 角丸グレーの見出し
 */
.cssLabelGrayed {
  background-color: #eee;
  color: #000;
  font-size: 12px;
  line-height: 20px;
  padding-left: 14px;
  padding-right: 14px;
  border-radius: 4px;
  display: inline-block;
  font-weight: normal; }

/*
 * ページタイトル（コンテンツ内に配置）
 */
.cssPageTitle {
  font-size: 16px;
  line-height: 2.4;
  margin: 4px 0;
  border-top: solid 1px #eee;
  border-bottom: solid 1px #eee;
  text-align: center; }

/*
 * ホームでの白ボタン影なしのデザイン
 */
.cssFlatWhite {
  display: block;
  position: relative;
  box-sizing: border-box;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  text-decoration: none;
  border-radius: 2px;
  box-shadow: none;
  border: 1px solid #efefef;
  border-bottom: none;
  background: #fff;
  color: #000; }
  .cssFlatWhite .cssIcon {
    margin-right: 8px; }
    .cssFlatWhite .cssIcon svg {
      width: 24px;
      height: 24px;
      vertical-align: top;
      position: relative;
      top: 50%;
      margin-top: -12px; }
      .cssFlatWhite .cssIcon svg path {
        fill: #7f7f7f; }
  .cssFlatWhite:hover .cssIcon svg path {
    fill: #000; }
  .cssFlatWhite:active .cssIcon svg path {
    fill: #fff; }
  .cssFlatWhite:last-child {
    border-bottom: 1px solid #efefef; }

/*
 * ホームでの白ボタン影有のデザイン
 */
.cssFlatWhiteShadow {
  display: block;
  position: relative;
  box-sizing: border-box;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  text-decoration: none;
  border-radius: 2px;
  box-shadow: none;
  border: 1px solid #efefef;
  border-bottom: none;
  background: #fff;
  color: #000;
  box-shadow: 2px 2px 3px -1px #aaa; }
  .cssFlatWhiteShadow .cssIcon {
    margin-right: 8px; }
    .cssFlatWhiteShadow .cssIcon svg {
      width: 24px;
      height: 24px;
      vertical-align: top;
      position: relative;
      top: 50%;
      margin-top: -12px; }
      .cssFlatWhiteShadow .cssIcon svg path {
        fill: #7f7f7f; }
  .cssFlatWhiteShadow:hover .cssIcon svg path {
    fill: #000; }
  .cssFlatWhiteShadow:active .cssIcon svg path {
    fill: #fff; }
  .cssFlatWhiteShadow:last-child {
    border-bottom: 1px solid #efefef; }

.cssFlatWhiteHover {
  cursor: pointer; }
  .cssFlatWhiteHover:hover {
    background: #e7e7e7; }
  .cssFlatWhiteHover.nothover:hover {
    background: #fff; }
  .cssFlatWhiteHover:active {
    background: #9f9f9f;
    color: #fff; }
  .cssFlatWhiteHover.nothover:active {
    background: #fff;
    color: #000; }

/*
 * プランアイコン
 */
.cssPlanIcon {
  display: block;
  padding: 0;
  margin: 0;
  background-color: #eee;
  color: #fff;
  border-radius: 8px;
  font-size: 11px;
  line-height: 15px;
  width: 15px;
  height: 15px;
  text-align: center;
  white-space: nowrap; }
  .cssPlanIcon.cssPlanS {
    background-color: #007fff; }
  .cssPlanIcon.cssPlanB {
    background-color: #007f00; }
  .cssPlanIcon.cssPlanC {
    background-color: #bf0000; }

/*
 * 的中額バッジ
 */
.cssHitBadge {
  display: inline-block;
  font-size: 12px;
  line-height: 18px;
  border-radius: 8px;
  color: #fff;
  background-color: #f00;
  padding: 0 5px;
  min-width: 40px;
  box-sizing: border-box;
  text-align: center; }
  .cssHitBadge.cssHitBadge2 {
    background-color: #ff5f00; }
  .cssHitBadge.cssHitBadge3 {
    background-color: #9f9f9f; }

/*
 * 着順バッジ
 */
.cssRankBadge {
  display: inline-block;
  font-size: 12px;
  line-height: 18px;
  border-radius: 8px;
  color: #ccc;
  background-color: transparent;
  padding: 0 5px;
  min-width: 40px;
  box-sizing: border-box;
  text-align: center; }
  .cssRankBadge.cssRankBadge1 {
    color: #fff;
    background-color: #f00; }
  .cssRankBadge.cssRankBadge2 {
    color: #fff;
    background-color: #f80; }
  .cssRankBadge.cssRankBadge3 {
    color: #fff;
    background-color: #0af; }
  .cssRankBadge.cssRankBadge4, .cssRankBadge.cssRankBadge5 {
    color: #000; }

.cssRankGimonBadge {
  display: inline-block;
  font-size: 12px;
  line-height: 18px;
  border-radius: 8px;
  color: #fff;
  background-color: #000;
  padding: 0 5px;
  min-width: 40px;
  box-sizing: border-box;
  text-align: center; }
  .cssRankGimonBadge.cssRankBadge1 {
    color: #f00;
    background-color: transparent; }
  .cssRankGimonBadge.cssRankBadge2 {
    color: #f80;
    background-color: transparent; }
  .cssRankGimonBadge.cssRankBadge3 {
    color: #0af;
    background-color: transparent; }

/*
 * ログインなどでのインプットフォームの前へのエラーメッセージ
 */
.cssCautionMsg {
  margin: 8px;
  background-color: #9c1034;
  border-radius: 4px;
  padding: 4px;
  color: #fff;
  text-shadow: none;
  font-weight: bold;
  font-size: 12px; }

/*
 * 競馬場背景色
 */
.colBgGround01 {
  background-color: #e56699; }

.colBgGround02 {
  background-color: #661919; }

.colBgGround03 {
  background-color: #0099ff; }

.colBgGround04 {
  background-color: #3399b2; }

.colBgGround05 {
  background-color: #3366cc; }

.colBgGround06 {
  background-color: #cc0033; }

.colBgGround07 {
  background-color: #664c99; }

.colBgGround08 {
  background-color: #006600; }

.colBgGround09 {
  background-color: #7f007f; }

.colBgGround10 {
  background-color: #e57f00; }

.colLtBgGround01 {
  background-color: #ffd1e5; }

.colLtBgGround02 {
  background-color: #e5cccc; }

.colLtBgGround03 {
  background-color: #b2ffff; }

.colLtBgGround04 {
  background-color: #cce5ff; }

.colLtBgGround05 {
  background-color: #b2ccff; }

.colLtBgGround06 {
  background-color: #ffb2cc; }

.colLtBgGround07 {
  background-color: #e5cce5; }

.colLtBgGround08 {
  background-color: #b2e5b2; }

.colLtBgGround09 {
  background-color: #e5b2e5; }

.colLtBgGround10 {
  background-color: #ffe5b2; }

/*
 * 競馬場背景色(地方)
 */
.colBgGround30 {
  background-color: #fe0000; }

.colBgGround35 {
  background-color: #1d791d; }

.colBgGround36 {
  background-color: #4f4fff; }

.colBgGround42 {
  background-color: #0a3382; }

.colBgGround43 {
  background-color: #008c3e; }

.colBgGround44 {
  background-color: #de151d; }

.colBgGround45 {
  background-color: #007a8f; }

.colBgGround46 {
  background-color: #da7212; }

.colBgGround47 {
  background-color: #001dcc; }

.colBgGround48 {
  background-color: #e9a200; }

.colBgGround50 {
  background-color: #630f0e; }

.colBgGround51 {
  background-color: #ff3f5f; }

.colBgGround54 {
  background-color: #ff3300; }

.colBgGround55 {
  background-color: #00633b; }

.colLtBgGround30 {
  background-color: #ffb3b3; }

.colLtBgGround35 {
  background-color: #bcd7bc; }

.colLtBgGround36 {
  background-color: #cbcbff; }

.colLtBgGround42 {
  background-color: #b6c2da; }

.colLtBgGround43 {
  background-color: #b3ffc7; }

.colLtBgGround44 {
  background-color: #f8babc; }

.colLtBgGround45 {
  background-color: #b3d9df; }

.colLtBgGround46 {
  background-color: #f6d6b9; }

.colLtBgGround47 {
  background-color: #b3bdf6; }

.colLtBgGround48 {
  background-color: #f8e3b3; }

.colLtBgGround50 {
  background-color: #d1b7b7; }

.colLtBgGround51 {
  background-color: #ffc6cf; }

.colLtBgGround54 {
  background-color: #ffc2b3; }

.colLtBgGround55 {
  background-color: #b3d1c5; }

.colBgturf {
  background-color: #dfd; }

.colBgDarkturf {
  background-color: #ddffdd; }

.colBgO2turf {
  background-color: #f8fff8; }

.colBgdirt {
  background-color: #ffc; }

.colBgO2dirt {
  background-color: #fffff5; }

.colBgDarkdirt {
  background-color: #ffffcc; }

.colBgsand {
  background-color: #ffc; }

.colBgO2sand {
  background-color: #fffff5; }

.colBgDarksand {
  background-color: #b37f00; }

.colBgsyogai {
  background-color: #eee; }

.colBgO2syogai {
  background-color: #fbfbfb; }

.colBgDarksyogai {
  background-color: #b3b3b3; }

.colBgturfLight {
  background-color: #edffed; }

.colBgdirtLight {
  background-color: #ffffe5; }

.colBgsandLight {
  background-color: #ffffe5; }

.colBgsyogaiLight {
  background-color: #f5f5f5; }

/*
 * ヘルプポップアップ
 */
#helpPopup {
  position: absolute;
  z-index: 99999;
  left: 0;
  top: 0; }
  #helpPopup .helpPopupContent {
    position: absolute;
    display: none;
    z-index: 99999;
    background-color: #fff;
    font-size: 10px;
    margin: 0;
    padding: 0;
    border: solid 1px #aaa;
    width: 508px;
    max-height: 600px;
    box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);
    /* 吹き出しSVG */ }
    @media print, screen and (max-width: 375px) {
      #helpPopup .helpPopupContent {
        width: 368px; } }
    #helpPopup .helpPopupContent svg.fukilr {
      position: absolute;
      display: none;
      z-index: 100000;
      width: 20px;
      height: 10px; }
      #helpPopup .helpPopupContent svg.fukilr.aleft {
        left: 0;
        top: 0;
        margin-left: -20px; }
      #helpPopup .helpPopupContent svg.fukilr.aright {
        position: absolute;
        right: 0;
        top: 0;
        margin-right: -20px; }
    #helpPopup .helpPopupContent svg.fukiud {
      position: absolute;
      display: none;
      z-index: 100000;
      width: 10px;
      height: 20px; }
    #helpPopup .helpPopupContent.uparrow svg.fukiud.aup,
    #helpPopup .helpPopupContent.downarrow svg.fukiud.adown,
    #helpPopup .helpPopupContent.rightarrow svg.fukilr.aright,
    #helpPopup .helpPopupContent.leftarrow svg.fukilr.aleft {
      display: block; }
    #helpPopup .helpPopupContent.keywordlink svg.fukiud.aup,
    #helpPopup .helpPopupContent.keywordlink svg.fukiud.adown,
    #helpPopup .helpPopupContent.keywordlink svg.fukilr.aright,
    #helpPopup .helpPopupContent.keywordlink svg.fukilr.aleft {
      display: none; }
    #helpPopup .helpPopupContent svg.fukiud polygon,
    #helpPopup .helpPopupContent svg.fukilr polygon {
      fill: #fff;
      stroke: transparent;
      stroke-width: 0; }
    #helpPopup .helpPopupContent svg.fukiud path,
    #helpPopup .helpPopupContent svg.fukilr path {
      fill: transparent;
      stroke: #999;
      stroke-width: 1; }
  #helpPopup.open .helpPopupContent {
    display: block; }
    #helpPopup.open .helpPopupContent.fixedpopup {
      position: fixed; }

.helpPopupContent svg.fukiud.aup {
  left: 0;
  top: 0;
  margin-top: -20px; }

.helpPopupContent svg.fukiud.adown {
  position: absolute;
  left: 0;
  bottom: 0;
  margin-bottom: -20px; }

.helpPopupContent .row {
  margin: 2px 0;
  padding: 0 2px;
  line-height: 14px; }

.helpPopupContent .row.title {
  position: relative;
  font-size: 12px;
  background-color: #eee;
  padding: 2px 2px;
  margin-top: 0;
  margin-bottom: 0;
  min-height: 18px;
  line-height: 18px; }

.helpPopupContent .row.title span.icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  background-image: url(http://zipang-keiba.jp/images/hatena.svg);
  background-size: cover;
  vertical-align: top; }

.helpPopupContent .row.title span.title {
  display: inline-block;
  margin-left: 4px;
  width: 460px;
  vertical-align: top; }
  @media print, screen and (max-width: 375px) {
    .helpPopupContent .row.title span.title {
      width: 320px; } }

.helpPopupContent .row.title span.helpid {
  font-size: 10px;
  color: #bbb; }

.helpPopupContent .row.title button.close {
  position: absolute;
  top: 4px;
  right: 4px;
  display: block;
  width: 14px;
  height: 14px;
  line-height: 14px;
  margin: 0;
  padding: 0;
  border: solid 1px #aaa;
  background-color: #fff; }

.helpPopupContent .row.title button.close svg {
  position: absolute;
  top: 2px;
  left: 2px; }

.helpPopupContent .row.title button.close svg path.close {
  stroke-width: 10;
  stroke: #000; }

.helpPopupContent .row.title button.close:hover {
  border-color: #f00; }

.helpPopupContent .helpBodyWrapper {
  position: relative;
  margin: 0;
  padding: 0;
  overflow: hidden; }

.helpPopupContent .helpBody {
  position: absolute;
  width: 500px;
  margin: 0;
  padding: 0 4px;
  top: 0;
  left: 0;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none; }
  @media print, screen and (max-width: 375px) {
    .helpPopupContent .helpBody {
      width: 360px; } }

.helpPopupContent .helpBody .onehelp {
  margin: 0;
  padding: 4px 0 4px;
  border: none; }

.helpPopupContent .ScrollCtrl {
  opacity: 0.5; }

.helpPopupContent .ScrollCtrl:hover {
  opacity: 1; }

.helpPopupContent .row.navi {
  position: relative;
  height: 20px;
  margin: 0;
  padding: 4px;
  display: none; }

.helpPopupContent .row.navi.open {
  display: block; }

.helpPopupContent .row.navi .navilink {
  display: inline-block;
  box-sizing: border-box;
  width: 248px;
  line-height: 20px;
  height: 20px;
  text-align: center;
  vertical-align: top;
  background-color: #fff;
  border: solid 1px #aaa; }
  @media print, screen and (max-width: 375px) {
    .helpPopupContent .row.navi .navilink {
      width: 178px; } }

.helpPopupContent .row.navi .navilink.next {
  margin-left: 4px; }

.helpPopupContent .row.navi .navilink.on {
  cursor: pointer; }

.helpPopupContent .row.navi .navilink.on:hover {
  border-color: #f00; }

.helpPopupContent .row.navi .navilink .mark {
  display: none;
  vertical-align: top; }

.helpPopupContent .row.navi .navilink.prev .mark {
  margin-right: 3px; }

.helpPopupContent .row.navi .navilink.next .mark {
  margin-left: 3px; }

.helpPopupContent .row.navi .navilink.on .mark {
  display: inline; }

.helpPopupContent .row.navi .navilink .captitle {
  display: inline-block;
  max-width: 200px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  vertical-align: top; }

/*
 * ヘルプ
 */
.helpContent .row {
  margin-bottom: 6px; }

.helpContent .onehelp {
  float: left;
  padding: 1px;
  border: solid 1px #ddd;
  margin: 0 6px 0 0; }

.helpContent .onehelp:first-child {
  margin: 0 4px 0 6px; }

.helpContent .onehelp h2 {
  position: relative;
  font-size: 12px;
  line-height: 24px;
  font-weight: normal;
  background-color: #ddd;
  margin: -1px -1px 0;
  padding: 0 0 0 4px; }

.helpContent .onehelp h2 span.helpid {
  position: absolute;
  font-size: 10px;
  color: #bbb;
  right: 2px; }

.helpContent .onehelp .imagecenter {
  text-align: center; }

.helpContent .onehelp .imagefloat img {
  float: left;
  margin: 0;
  margin-right: 4px;
  margin-bottom: 4px; }

.helpContent .onehelp img {
  max-width: 500px; }
  @media print, screen and (max-width: 640px) {
    .helpContent .onehelp img {
      max-width: 250px; } }

.helpContent .onehelp .desc {
  font-size: 12px;
  line-height: 18px;
  margin-bottom: 18px;
  padding: 0 4px;
  color: #888; }

.helpContent .onehelp .desc:last-child {
  margin-bottom: 6px; }

.helpContent .onehelp .desc a.kw {
  color: inherit;
  text-decoration: none;
  display: inline-block;
  border-bottom: solid 1px #00f;
  padding: 0;
  line-height: 1; }

.helpContent .onehelp .desc a.kw:hover {
  color: #f00;
  border-bottom-color: #f00; }

.helpContent .onehelp .desc strong {
  font-weight: bold;
  color: #800;
  font-style: normal; }

.helpContent .onehelp .desc em {
  font-weight: normal;
  color: #000;
  font-style: normal; }

/*
 * ヘルプアイコン
 */
/* ヘルプポップアップ */
.cssHelpPopupMj {
  position: relative;
  display: inline-block;
  margin: 0;
  padding: 0;
  width: 14px;
  height: 14px;
  vertical-align: middle;
  cursor: pointer; }
  .cssHelpPopupMj svg {
    width: 100%;
    height: 100%;
    vertical-align: top; }
    .cssHelpPopupMj svg circle {
      fill: #ddd; }
    .cssHelpPopupMj svg path {
      fill: #999; }
  .cssHelpPopupMj.empty {
    visibility: hidden; }
  .cssHelpPopupMj.white circle {
    fill: #fff; }
  .cssHelpPopupMj.white path {
    fill: #999; }
  .cssHelpPopupMj:hover svg circle {
    fill: #faa; }
  .cssHelpPopupMj:hover svg path {
    fill: #f66; }

/* スクロールコントロール */
.ScrollCtrl {
  position: absolute;
  display: block;
  z-index: 90;
  font-size: 12px;
  margin: 0px;
  padding: 0px;
  line-height: 18px;
  border: none;
  background-color: rgba(0, 0, 0, 0.25);
  color: #FFF;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  opacity: 0; }

.ScrollCtrl.up {
  top: 0;
  left: 0;
  width: 100%;
  height: 18px; }

.ScrollCtrl.down {
  bottom: 0;
  left: 0;
  width: 100%;
  height: 18px; }

.ScrollCtrl.left {
  top: 0;
  left: 0;
  height: 100%;
  width: 18px; }

.ScrollCtrl.right {
  top: 0;
  right: 0;
  height: 100%;
  width: 18px; }

.ScrollCtrl:hover {
  opacity: 1; }

.ScrollCtrl.disabled {
  display: none; }

/*
 ローディングスピナー
 */
@-moz-keyframes refreshing-loader {
  0% {
    -moz-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -moz-transform: rotate(360deg);
    transform: rotate(360deg); } }

@-webkit-keyframes refreshing-loader {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

@keyframes refreshing-loader {
  0% {
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

/* :not(:required) hides this rule from IE9 and below */
.refreshing-loader:not(:required) {
  -moz-animation: refreshing-loader 1000ms infinite linear;
  -webkit-animation: refreshing-loader 1000ms infinite linear;
  animation: refreshing-loader 1000ms infinite linear;
  -moz-border-radius: 2.4em;
  -webkit-border-radius: 2.4em;
  border-radius: 2.4em;
  border: 0.4em solid #9ac;
  border-left-color: transparent;
  color: transparent;
  display: inline-block;
  font-size: 10px;
  line-height: 1.2;
  width: 3em;
  height: 3em;
  text-indent: 100%;
  box-sizing: border-box; }

.refreshing-loader:not(:required):after {
  display: block;
  border: 0.5em solid transparent;
  border-top-color: #9ac;
  border-left-color: #9ac;
  content: '';
  width: 0;
  height: 0;
  overflow: hidden;
  margin-left: -0.2em;
  margin-top: 1em;
  position: absolute;
  top: 4px; }

/*
 * コースグラフ凡例
 */
.cssCourseGraphHanrei {
  position: absolute;
  right: 0;
  top: 0;
  padding: 2px;
  text-align: right;
  vertical-align: middle; }
  .cssCourseGraphHanrei .hanreiline {
    position: relative;
    display: inline-block;
    margin-right: 1px;
    width: 13px;
    height: 1px;
    vertical-align: middle; }
    .cssCourseGraphHanrei .hanreiline:before {
      content: "";
      position: absolute;
      width: 5px;
      height: 5px;
      border-radius: 3px;
      left: 4px;
      margin-top: -2px;
      background-color: inherit; }
    .cssCourseGraphHanrei .hanreiline.konso {
      background-color: #090; }
    .cssCourseGraphHanrei .hanreiline.sample {
      margin-left: 8px;
      background-color: #6f6f6f; }
  .cssCourseGraphHanrei .hanreibar {
    display: inline-block;
    width: 16px;
    height: 0px;
    border-top: solid 4px #aeadfa;
    border-bottom: solid 4px #fbadad;
    vertical-align: middle;
    margin-left: 1px;
    margin-right: 1px; }

/*
 * サブスクプラン
 */
.cssSubSucBox {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-left: 4px;
  margin-right: 4px;
  padding: 0;
  line-height: 20px;
  text-align: center;
  border-radius: 4px;
  color: #fff;
  vertical-align: middle;
  position: relative;
  font-weight: bold;
  top: -1px;
  opacity: 0.1; }
  .cssSubSucBox.active {
    opacity: 1; }

.cssSubSucBox + span {
  opacity: 0.1; }

.cssSubSucBox.active + span {
  opacity: 1; }

.cssSubSucPlanJ {
  background-color: #438023; }

.cssSubSucPlanA {
  background-color: #bf0000; }