@charset "UTF-8";
/*▼▼ リセット**************************************************/
/*▼bootstrap準拠のためreset.cssの一部のみ使用▼*/
/*リセット*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, figcaption, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video {
  /* margin:0; */
  padding: 0;
  /* border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent; */ }

/* body {
  line-height:1;
}

article, aside, dialog, figure, footer, header,
canvas, details, figcaption, menu, summary,
hgroup, nav, section {
  display:block;
}

img {
  border: 0;
  vertical-align: bottom;
} */
nav ul {
  list-style: none; }

ul, ol {
  list-style: none; }

/*blockquote, q {
  quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content:'';
  content:none;
}

 a {
  margin:0;
  padding:0;
  border:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}

ins {
  background-color:#ff9;
  color:#000;
  text-decoration:none;
}

mark {
  background-color:#ff9;
  color:#000;
  font-style:italic;
  font-weight:bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom:1px dotted #000;
  cursor:help;
} */
table {
  border-collapse: collapse;
  border-spacing: 0;
  empty-cells: show; }

/*hr {
    display:block;
    height:1px;
    border:0;
  margin-left: auto;
  margin-right: auto;
    padding:0;
}

input, select {
  vertical-align:middle;
}*/
/*▼bootstrap独自タグ上書き▼*/
.row {
  /*横スク表示　無効*/
  margin-right: 0;
  margin-left: 0; }
  .row > *[class^="col-"] {
    padding: 0 5px; }

header {
  /*ヘッダーは除外*/ }
  header .row {
    margin-right: -15px;
    margin-left: -15px; }
    header .row > *[class^="col-"] {
      padding-right: 15px;
      padding-left: 15px; }

/*★注意
・このCSSはreset.css適用を前提に作成されています。
・目次と汎用クラスを参照し、作成した箇所には目印を入れてください。
・修正/追加の記録を残してください。
*/
/*▼▼大目印*********************************************************/
/*▼中目印
-------------------------------------------*/
/*----- 小目印 -----*/
/*極小目印*/
/*▼修正記録(「MMDD追加or修正」で検索)
-------------------------------------------*/
/*YYMMDD追加… , */
/*180727追加 … .news_jra(JRA発表お知らせ) */
/*190822追加 … .wrap2 .txt2, .topService-new, simple_erea, .forSP(TRY/スマホアプリ)*/
/*200523追加 … .flex*/
/*210617追加 … 縮小時折り返しエラー対応*/
/*220517修正 … 千客バン来終了に伴う関係者インタビュー修正*/
/*240907追加 … お知らせ通知*/
/*250124追加 … データde高さ統一*/
/*▼目次
-------------------------------------------*/
/*
..リセット(bootstrap上書き用。bootstrap未使用時はreset.css読み込み)
0.Sass設定
1.Bootstrapと同じ機能
2.タグそのものに適用(bootstrap使用のため修正)
3.基本構成要素
4.単純な意味のスタイル
5.ヘッダー /　パンくず / 2カラム / 1カラム　/ フッター
6.ページ共通
7.ページ個別
8.外部プラグイン
9.モバイル幅用(CSSスプライト)  →  削除
  【構成】
  横幅767px用(bootstrap準拠へ修正414→767)
*/
/*▼汎用クラス(単体で使用せず個別IDの子として)
-------------------------------------------*/
/*
.day, .ttl, .txt, .pic, .new, .category, .toHead, .toTop, .cls, .selected
.mail, .search, .hint, .down, .detail, .buy, .nx, .dl, .sp, .wrap, .exc
*/
/* @import "../imgs/top/system/*.gif";
@include all-system-sprites; */
/*▼▼ 0.Sass設定**************************************************/
/*ミックスイン*/
/*グラデーション*/
/*グリッド*/
/*変数*/
/*最大横幅*/
/*bootstrap準拠に変更940→1140*/
/*2カラム　サイド*/
/*2カラム　メイン*/
/*1カラム　横余白あり(記事など)*/
/*基本フォント色*/
/*リンクテキスト色*/
/*基本角丸半径*/
/*基本マージン*/
/*マージン 狭い*/
/*基本パディング*/
/*パディング　狭い*/
/*パディング　広い*/
/*▼▼ 1.Bootstrapと同じ機能**************************************************/
/*------ 基本 ------*/
.block-m {
  display: block; }

.none-m {
  display: none; }

/*------ グリッド ------*/
.rows:after {
  display: table;
  clear: both;
  content: ''; }

.col, .col-m-1, .col-m-2, .col-m-3, .col-m-4, .col-m-5, .col-m-6, .col-m-7, .col-m-8, .col-m-9, .col-m-10, .col-m-11, .col-m-12 {
  min-height: 40px;
  margin-bottom: 20px;
  float: left; }

/*片側に配置*/
.col-m-1 {
  /* $num2: ceil(percentage(1 / $num)-5); */
  /*0.4→1.5 for Android4.3*/
  /*for ~Android4.3*/
  width: 7.5%;
  /* width: calc((100% - 20px * 0)/1); */
  width: calc((100% - 20px*11) /12 * 1 - 20px*0*-1 - 0.1px);
  /*IE少数点以下対応-0.1px*/
  /* @if $column2 == "side" {
  	width: calc((100% - (20px*1)) /2 * 1 + 20px*0);
  } */
  margin-right: 20px;
  /* &:nth-child(1n+1) { */ }
  .col-m-1:last-child {
    margin-right: 0;
    float: right; }

.col-m-2 {
  /* $num2: ceil(percentage(1 / $num)-5); */
  /*0.4→1.5 for Android4.3*/
  /*for ~Android4.3*/
  width: 15.5%;
  /* width: calc((100% - 20px * 1)/2); */
  width: calc((100% - 20px*11) /12 * 2 - 20px*1*-1 - 0.1px);
  /*IE少数点以下対応-0.1px*/
  /* @if $column2 == "side" {
  	width: calc((100% - (20px*1)) /2 * 2 + 20px*1);
  } */
  margin-right: 20px;
  /* &:nth-child(2n+2) { */ }
  .col-m-2:last-child {
    margin-right: 0;
    float: right; }

.col-m-3 {
  /* $num2: ceil(percentage(1 / $num)-5); */
  /*0.4→1.5 for Android4.3*/
  /*for ~Android4.3*/
  width: 23.5%;
  /* width: calc((100% - 20px * 2)/3); */
  width: calc((100% - 20px*11) /12 * 3 - 20px*2*-1 - 0.1px);
  /*IE少数点以下対応-0.1px*/
  /* @if $column2 == "side" {
  	width: calc((100% - (20px*1)) /2 * 3 + 20px*2);
  } */
  margin-right: 20px;
  /* &:nth-child(3n+3) { */ }
  .col-m-3:last-child {
    margin-right: 0;
    float: right; }

.col-m-4 {
  /* $num2: ceil(percentage(1 / $num)-5); */
  /*0.4→1.5 for Android4.3*/
  /*for ~Android4.3*/
  width: 32.5%;
  /* width: calc((100% - 20px * 3)/4); */
  width: calc((100% - 20px*11) /12 * 4 - 20px*3*-1 - 0.1px);
  /*IE少数点以下対応-0.1px*/
  /* @if $column2 == "side" {
  	width: calc((100% - (20px*1)) /2 * 4 + 20px*3);
  } */
  margin-right: 20px;
  /* &:nth-child(4n+4) { */ }
  .col-m-4:last-child {
    margin-right: 0;
    float: right; }

.col-m-5 {
  /* $num2: ceil(percentage(1 / $num)-5); */
  /*0.4→1.5 for Android4.3*/
  /*for ~Android4.3*/
  width: 40.5%;
  /* width: calc((100% - 20px * 4)/5); */
  width: calc((100% - 20px*11) /12 * 5 - 20px*4*-1 - 0.1px);
  /*IE少数点以下対応-0.1px*/
  /* @if $column2 == "side" {
  	width: calc((100% - (20px*1)) /2 * 5 + 20px*4);
  } */
  margin-right: 20px;
  /* &:nth-child(5n+5) { */ }
  .col-m-5:last-child {
    margin-right: 0;
    float: right; }

.col-m-6 {
  /* $num2: ceil(percentage(1 / $num)-5); */
  /*0.4→1.5 for Android4.3*/
  /*for ~Android4.3*/
  width: 48.5%;
  /* width: calc((100% - 20px * 5)/6); */
  width: calc((100% - 20px*11) /12 * 6 - 20px*5*-1 - 0.1px);
  /*IE少数点以下対応-0.1px*/
  /* @if $column2 == "side" {
  	width: calc((100% - (20px*1)) /2 * 6 + 20px*5);
  } */
  margin-right: 20px;
  /* &:nth-child(6n+6) { */ }
  .col-m-6:last-child {
    margin-right: 0;
    float: right; }

.col-m-7 {
  /* $num2: ceil(percentage(1 / $num)-5); */
  /*0.4→1.5 for Android4.3*/
  /*for ~Android4.3*/
  width: 57.5%;
  /* width: calc((100% - 20px * 6)/7); */
  width: calc((100% - 20px*11) /12 * 7 - 20px*6*-1 - 0.1px);
  /*IE少数点以下対応-0.1px*/
  /* @if $column2 == "side" {
  	width: calc((100% - (20px*1)) /2 * 7 + 20px*6);
  } */
  margin-right: 20px;
  /* &:nth-child(7n+7) { */ }
  .col-m-7:last-child {
    margin-right: 0;
    float: right; }

.col-m-8 {
  /* $num2: ceil(percentage(1 / $num)-5); */
  /*0.4→1.5 for Android4.3*/
  /*for ~Android4.3*/
  width: 65.5%;
  /* width: calc((100% - 20px * 7)/8); */
  width: calc((100% - 20px*11) /12 * 8 - 20px*7*-1 - 0.1px);
  /*IE少数点以下対応-0.1px*/
  /* @if $column2 == "side" {
  	width: calc((100% - (20px*1)) /2 * 8 + 20px*7);
  } */
  margin-right: 20px;
  /* &:nth-child(8n+8) { */ }
  .col-m-8:last-child {
    margin-right: 0;
    float: right; }

.col-m-9 {
  /* $num2: ceil(percentage(1 / $num)-5); */
  /*0.4→1.5 for Android4.3*/
  /*for ~Android4.3*/
  width: 73.5%;
  /* width: calc((100% - 20px * 8)/9); */
  width: calc((100% - 20px*11) /12 * 9 - 20px*8*-1 - 0.1px);
  /*IE少数点以下対応-0.1px*/
  /* @if $column2 == "side" {
  	width: calc((100% - (20px*1)) /2 * 9 + 20px*8);
  } */
  margin-right: 20px;
  /* &:nth-child(9n+9) { */ }
  .col-m-9:last-child {
    margin-right: 0;
    float: right; }

.col-m-10 {
  /* $num2: ceil(percentage(1 / $num)-5); */
  /*0.4→1.5 for Android4.3*/
  /*for ~Android4.3*/
  width: 82.5%;
  /* width: calc((100% - 20px * 9)/10); */
  width: calc((100% - 20px*11) /12 * 10 - 20px*9*-1 - 0.1px);
  /*IE少数点以下対応-0.1px*/
  /* @if $column2 == "side" {
  	width: calc((100% - (20px*1)) /2 * 10 + 20px*9);
  } */
  margin-right: 20px;
  /* &:nth-child(10n+10) { */ }
  .col-m-10:last-child {
    margin-right: 0;
    float: right; }

.col-m-11 {
  /* $num2: ceil(percentage(1 / $num)-5); */
  /*0.4→1.5 for Android4.3*/
  /*for ~Android4.3*/
  width: 90.5%;
  /* width: calc((100% - 20px * 10)/11); */
  width: calc((100% - 20px*11) /12 * 11 - 20px*10*-1 - 0.1px);
  /*IE少数点以下対応-0.1px*/
  /* @if $column2 == "side" {
  	width: calc((100% - (20px*1)) /2 * 11 + 20px*10);
  } */
  margin-right: 20px;
  /* &:nth-child(11n+11) { */ }
  .col-m-11:last-child {
    margin-right: 0;
    float: right; }

.col-m-12 {
  /* $num2: ceil(percentage(1 / $num)-5); */
  /*0.4→1.5 for Android4.3*/
  /*for ~Android4.3*/
  width: 98.5%;
  /* width: calc((100% - 20px * 11)/12); */
  width: calc((100% - 20px*11) /12 * 12 - 20px*11*-1 - 0.1px);
  /*IE少数点以下対応-0.1px*/
  /* @if $column2 == "side" {
  	width: calc((100% - (20px*1)) /2 * 12 + 20px*11);
  } */
  margin-right: 20px;
  /* &:nth-child(12n+12) { */ }
  .col-m-12:last-child {
    margin-right: 0;
    float: right; }

/* #side .col-m-1 {
	@include cols(1,side);
}
#side .col-m-2 {
	@include cols(2,side);
} */
/*左右均等にマージン*/
/* .col-m2-3 {
	width: 29%;
	width: calc((100% - 20px * 3)/3);
	margin-right: $margin-base/2;
	margin-left: $margin-base/2;
	@extend .col;
	&:after {
		@extend .clearfix:after;
	}
} */
/* .col-m-3 {
	width: 29%;
	width: calc((100% - 20px * 2)/3);
	margin-right: $margin-base;
	@extend .col;
	&:after {
		@extend .clearfix:after;
	}
	&:nth-child(3n+3) {
		margin-right: 0;
		float: right;
	}
} */
/*グリッド確認用*/
/* .col-m2-12 {
	width: calc((100% - 20px * 12)/12);
	margin-right: $margin-base/2;
	margin-left: $margin-base/2;
	@extend .col;
	&:after {
		@extend .clearfix:after;
	}
} */
/*200523追加*/
.flex {
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-start;
  align-items: stretch; }
  .flex > * {
    flex: 0 0 auto; }

/*------ ボタン ------*/
.but, .stepTitle {
  display: inline-block;
  text-decoration: none;
  text-align: center;
  padding: 8px 12px;
  border: 1px solid #ffffff;
  border-radius: 4px; }
  .but > *, .stepTitle > * {
    vertical-align: middle; }
  .but:hover, .stepTitle:hover {
    opacity: 0.7; }

.but-ml {
  font-weight: bold;
  font-size: 16px; }

.but-block {
  display: block; }

.but-shadow {
  /*追加*/
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.3); }

/*種類*/
.but-default {
  /*白*/
  color: #333 !important;
  background-color: #ffffff;
  border-color: #CCCCCC; }

.but-primary {
  /*青*/
  color: #ffffff !important;
  background-color: #0277BD;
  border: none; }

.but-success, .stepTitle {
  /*緑*/
  color: #ffffff !important;
  background-color: #558B2F;
  border: none; }

.but-info {
  /*水色*/
  color: #ffffff !important;
  background-color: #74BFDB;
  border: none; }

.but-warning {
  /*オレンジ*/
  color: #ffffff !important;
  background-color: #FF8F00;
  border: none; }

.but-danger {
  /*赤*/
  color: #ffffff !important;
  background-color: #C96059;
  border: none; }

.but-link {
  /*白+青文字*/
  color: #677EB5 !important;
  background-color: #ffffff;
  border: none; }

.but-guide {
  /*グラデ　追加*/
  color: #333 !important;
  /*IE*/
  -ms-filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#ffffff',EndColorStr='#D8D8D8');
  filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#ffffff',EndColorStr='#D8D8D8');
  /*IE10~,Android4.0~,iOS5.1~*/
  background: -webkit-linear-gradient(top, #ffffff 0%, #D8D8D8 100%);
  /*IE10~,Android4.4~,iOS7~*/
  background: linear-gradient(to bottom, #ffffff 0%, #D8D8D8 100%);
  background-color: #DBDBDB;
  border-color: #cccccc; }

.but-experience {
  /*金色グラデ　追加*/
  color: #ffffff !important;
  /*IE*/
  -ms-filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#B4AF54',EndColorStr='#777015');
  filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#B4AF54',EndColorStr='#777015');
  /*IE10~,Android4.0~,iOS5.1~*/
  background: -webkit-linear-gradient(top, #B4AF54 0%, #777015 100%);
  /*IE10~,Android4.4~,iOS7~*/
  background: linear-gradient(to bottom, #B4AF54 0%, #777015 100%);
  background-color: #777015;
  border-color: #767149;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
  box-shadow: inset 0px 0px 4px rgba(255, 255, 255, 0.5); }
  .but-experience.but-shadow {
    box-shadow: inset 0px 0px 4px rgba(255, 255, 255, 0.5), 0px 2px 6px rgba(0, 0, 0, 0.3); }

/*------ タブ ------*/
.tabPanel .tab {
  /*下に記載*/ }
.tabPanel .tab.pill {
  /*下に記載*/ }

/*------ テーブル ------*/
.tables th,
.tables td {
  padding: 6px;
  border-bottom: 1px solid #DDDDDD; }
.tables tr:last-child th,
.tables tr:last-child td {
  border-bottom: none; }
.tables th {
  white-space: nowrap;
  background-color: #F5F5F5; }
  .tables th[scope="col"] {
    text-align: center;
    padding: 10px; }
.tables.striped tr:nth-child(odd) {
  background-color: #F5F5F5; }
.tables.bordered th,
.tables.bordered td,
.tables.bordered tr:last-child th,
.tables.bordered tr:last-child td {
  border: 1px solid #DDDDDD; }
.tables .responsive {
  /*スマホ幅時に横スクロール表示*/ }

/*▼bootstrap準拠のため修正▼*/
/*▼▼ 2.タグそのものに適用*********************************************/
/*bootstrap未使用*/
/* body {
	font-family: ArialMT, "HiraKakuProN-W3";
	font-size: $font-size-base;
	color: $color-base;
	* {
		line-height: 1.4;
		box-sizing: border-box;
	}
}
h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
}
  a {
	color: #333399;
	text-decoration: underline;
	font-weight: normal;
}
section, article, sub, p {
}
address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal;
}
input {
	height: 1.5em;
	box-sizing: content-box;
}
select {
	height: 2em;
}
p {
	margin: 0 0 7px 0;
} */
/*bootstrap使用*/
body {
  font-size: 14px;
  color: #333; }
  body * {
    box-sizing: border-box; }

h1, h2, h3, h4, h5, h6 {
  font-size: 14px;
  font-weight: normal;
  line-height: 1.4;
  margin: 0; }

a,
a:hover {
  background-position: 0% 0%; }

/*カーソルホバー*/
#contents {
  /*bootstrapヘッダーを除外*/ }
  #contents a:hover,
  #contents a:hover.hover > *,
  #contents a:hover *.hover {
    opacity: 0.7; }

strong, th {
  font-style: normal;
  font-weight: normal; }

p {
  margin: 0 0 7px 0; }

body > header {
  /*bootstrap用ヘッダー*/ }
  body > header h1, body > header h2, body > header h3, body > header h4, body > header h5, body > header h6 {
    line-height: 1.1;
    margin-top: 10px;
    margin-bottom: 10px; }
  body > header h1 {
    font-size: 40px;
    /* font-weight: bold; */ }

/*▼▼ 3.基本構成要素*****************************************************/
/*clearfix*/
.clearfix:after, #contents:after, #side:after, #main:after, #item:after, .tabPanel .tab:after, .tabPanel .tab ~ .pnl > li:after, #topService:after, #topMykeiba ul li:after, #topData:after, #topSpecialMovie:after, .topBanner:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden; }

#contents {
  width: 1140px;
  margin: 0 auto; }

/*カテゴリー内容*/
.cont {
  width: 100%;
  margin: 0 auto; }

#pageTitle {
  font-size: 26px;
  margin: 20px 0;
  padding: 4px 15px;
  border-bottom: solid 5px #E7E7E7; }

.largeTitle {
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  margin: 20px 0 10px 0;
  padding: 10px 15px;
  /* @include linear-gradient(#69A155,#207204); */
  background-color: #2F7C12; }

.cateTitle {
  color: #333;
  font-size: 16px;
  font-weight: bold;
  margin: 20px 0 0 0;
  padding: 10px 15px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border: solid 1px #e0e0e0;
  /*IE*/
  -ms-filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#ffffff',EndColorStr='#dbdbdb');
  filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#ffffff',EndColorStr='#dbdbdb');
  /*IE10~,Android4.0~,iOS5.1~*/
  background: -webkit-linear-gradient(top, #ffffff 0%, #dbdbdb 100%);
  /*IE10~,Android4.4~,iOS7~*/
  background: linear-gradient(to bottom, #ffffff 0%, #dbdbdb 100%);
  background-color: #E6E6E6; }

/*小見出し*/
.subHead {
  font-size: 16px;
  margin: 15px 10px 10px 10px;
  padding-left: 27px;
  background: url(../imgs/top/bg-h3.gif) left center no-repeat; }

/*▼▼ 4.単純な意味のスタイル***********************************************/
/*非表示*/
.hdn {
  visibility: hidden; }

/*存在*/
.block {
  display: block; }

/*消去*/
.none {
  display: none; }

.inline {
  display: inline !important; }

.inBlk {
  display: inline-block; }

/*フォント色*/
.f_white {
  color: #fff; }

.f_gray {
  color: #666; }

.f_lightgray {
  color: #999; }

.f_green {
  color: #217403; }

.f_red {
  color: #FF0000; }

.f_orange {
  color: #FF7C00; }

/*フォント大きさ*/
.f_L {
  font-size: 20px; }

.f_LS {
  font-size: 18px; }

.f_ML {
  font-size: 16px; }

.f_M {
  font-size: 14px; }

.f_MS {
  font-size: 12px; }

.f_S {
  font-size: 10px; }

/*太さ*/
.bold {
  font-weight: bold; }

.normal {
  font-weight: normal; }

/*ボーダー*/
.bdr1 {
  border: 1px solid #DDDDDD; }

.bdrc_gray {
  border-color: #9E9E9E; }

/*リストタイプ*/
.li, .li_dec, .li_disc, .li_cir {
  margin: 1em 0;
  padding-left: 1.5em; }

/*算用数字*/
.li_dec {
  list-style-type: decimal; }

/*黒丸*/
.li_disc {
  list-style-type: disc; }

/*白丸*/
.li_cir {
  list-style-type: circle; }

/*罫線　ドット*/
.li_dot li {
  padding: 8px 12px;
  border-bottom: 1px dotted #46C319; }
  .li_dot li:first-child {
    border-top: 1px dotted #46C319; }

/*もっと見る*/
.more {
  display: block;
  text-align: right; }

#small {
  display: block; }

/*テキスト揃え*/
.center {
  text-align: center; }

.left {
  text-align: left; }

.right {
  text-align: right; }

/*画像*/
/*横幅*/
.width100 {
  width: 100%; }

.width33 {
  width: 33.3%; }

/* .widthSub {
	width: 240px;
	padding-left: 20px;
} */
.seg2 > * {
  width: 50%; }

.seg3 > * {
  width: 33.3%; }

.seg4 > * {
  width: 25%; }

.seg5 > * {
  width: 20%; }

/*マージン*/
.noMargin {
  margin: 0; }

.marginA {
  margin: 0 auto; }

.marginLR {
  margin: 0 10px; }

.marginLR2 {
  margin: 0 20px; }

.marginT {
  margin-top: 10px; }

.marginT2 {
  margin-top: 20px; }

.marginB {
  margin-bottom: 10px; }

.marginB2 {
  margin-bottom: 20px; }

.marginR {
  margin-right: 10px; }

.marginR2 {
  margin-right: 20px; }

.marginL {
  margin-left: 10px; }

.marginL2 {
  margin-left: 20px; }

/*パディング*/
.noPadding {
  padding: 0; }

.padding {
  padding: 10px; }

.paddingTB {
  padding: 14px 0; }

.paddingLR {
  padding: 0 10px; }

.paddingLR2 {
  padding: 0 20px; }

.paddingT {
  padding-top: 10px; }

.paddingT2 {
  padding-top: 50px; }

.paddingB {
  padding-bottom: 10px; }

.paddingB2 {
  padding-bottom: 30px; }

.paddingR {
  padding-right: 10px; }

.paddingR2 {
  padding-right: 20px; }

.paddingL {
  padding-left: 10px; }

.paddingL2 {
  padding-left: 20px; }

/*縦位置*/
.vAlineT * {
  vertical-align: top !important; }

.vAlineM * {
  vertical-align: middle !important; }

/*位置*/
.posRe {
  position: relative; }

.posAb {
  position: absolute; }

/*フロート*/
.floatL {
  float: left; }

.floatR {
  float: right; }

.floatN {
  float: none; }

/*for モバイル*/
/* .mbShow {
	display: none;
} */
/*for PC*/
/* .pcShow {
	display: block;
} */
/*ボタン*/
.btns > a {
  display: block; }

.bg_btn1 > * {
  color: #333;
  font-weight: bold;
  text-shadow: 1px 1px 2px #ffffff;
  padding: 12px;
  border-radius: 4px;
  border: 1px solid #9E9E9E;
  /*IE*/
  -ms-filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#F2F2F2',EndColorStr='#9C9C9C');
  filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#F2F2F2',EndColorStr='#9C9C9C');
  /*IE10~,Android4.0~,iOS5.1~*/
  background: -webkit-linear-gradient(top, #F2F2F2 0%, #9C9C9C 100%);
  /*IE10~,Android4.4~,iOS7~*/
  background: linear-gradient(to bottom, #F2F2F2 0%, #9C9C9C 100%);
  background-color: #DBDBDB;
  box-shadow: inset 0px 0px 4px rgba(255, 255, 255, 0.5); }

/*リンク*/
.link_arrow {
  padding-left: 15px;
  background: url(../imgs/top/blt-01.gif) 2px 2px no-repeat !important; }

.link_q {
  padding-left: 20px;
  background: url(../imgs/top/blt-faq-q.gif) left top no-repeat; }

/*アンダーライン*/
.uLine {
  text-decoration: underline; }

.noUline {
  text-decoration: none; }

/*背景色*/
.bg_white {
  background-color: #fff; }

.bg_lightgray {
  background-color: #F5F5F5; }

.bg_lightbluegray {
  background-color: #ECEFF1; }

.bg_darkgray {
  background-color: #616161; }

.bg_blue {
  background-color: #1E88E5; }

.bg_yellow {
  background-color: #FFEB3B; }

.bg_green {
  background-color: #43A047; }

.bg_red {
  background-color: #EF5350; }

/*画像背景*/
.bg_dot {
  padding: 0 0 4px 0;
  background: url(../imgs/top/dot-03.gif) left bottom repeat-x; }

/*NEWアイコン*/
.new {
  background-color: #FFA000; }

/*------ カテゴリー ------*/
/*更新性のため.bg_cate→.cate*/
/*230804削除*/
/*01コンテンツ*/
/*02JRA*/
/*03製品*/
/*04プレゼント*/
/*05スマホ*/
/*06ケータイ*/
/*07メンテナンス*/
/*.cate01 {
	background-color: #B39DDB;
}
.cate02 {
	background-color: #7CB342;
}
.cate03 {
	background-color: #FF7043;
}
.cate04 {
	background-color: #00BCD4;
}
.cate05 {
	background-color: #64B5F6;
}
.cate06 {
	background-color: #CE93D8;
}
.cate07 {
	background-color: #F48FB1;
}
*/
/*------ SVG ------*/
/*塗りつぶし色*/
.fill_green {
  fill: #00853D; }

.fill_blue {
  fill: #1976D2; }

.fill_white {
  fill: #fff; }

.fill_black {
  fill: #000; }

.fill_gray {
  fill: #666; }

.fill_lightgray {
  fill: #AAAAAA; }

/*サイズ*/
.size_rogo1 {
  width: 192px;
  height: 28px; }

.size_rogo2 {
  width: 384px;
  height: 56px; }

.size_icon0 {
  width: 12px;
  height: 12px; }

.size_icon1 {
  width: 16px;
  height: 16px; }

.size_icon2 {
  width: 20px;
  height: 20px; }

.size_icon3 {
  width: 30px;
  height: 30px; }

.size_icon4 {
  width: 40px;
  height: 40px; }

/*▼▼ 5.ヘッダー /　パンくず / 2カラム / 1カラム　/ フッター *********************************************************/
/*----- ヘッダー -----*/
#header .cont {
  position: relative;
  width: 1140px;
  height: 80px; }
#header h2 {
  font-size: 10px;
  padding: 8px 0 0 0; }
#header .mail {
  position: absolute;
  top: 15px;
  right: 190px;
  display: block;
  width: 318px;
  height: 20px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  background: url(../imgs/top/hdr-contact.gif) center center no-repeat; }
#header .search {
  position: absolute;
  top: 0;
  right: 0;
  width: 180px;
  height: 48px;
  padding: 10px 0 0 0;
  /* background: url(../imgs/top/hdr-search.gif) 10px 10px no-repeat, linear-gradient(to bottom,#ffffff 0%,#DDDDDD 100%); */
  background: url(../imgs/top/hdr-search.gif) 10px 10px no-repeat, url(../imgs/top/hdr-search-bg.gif) left bottom repeat-x;
  background-color: #EEEEEE; }
#header .hint {
  position: absolute;
  top: 34px;
  right: 0;
  display: block;
  width: 170px; }
  #header .hint li {
    display: block;
    margin: 0 10px 0 0;
    float: left; }
  #header .hint a {
    display: block;
    font-size: 11px;
    color: #333; }

#rogo {
  padding: 12px 0 0 0; }

#text {
  width: 78px;
  height: 15px;
  margin: 0 0 0 30px;
  float: left; }

#searchSubmitButton {
  width: 45px;
  height: 20px;
  margin: 0 10px 0 0;
  float: right; }

#user {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 450px;
  height: 30px; }
  #user li {
    display: block;
    margin: 0 15px 0 0;
    padding: 7px 0 0 20px;
    background: url(../imgs/top/icon-hdr-fun.gif) left center no-repeat;
    float: left; }
  #user li:nth-child(2) {
    background-image: url(../imgs/top/icon-hdr-home.gif); }
  #user li:nth-child(3) {
    margin: 0;
    background-image: url(../imgs/top/icon-hdr-login.gif); }

#nav {
  /*IE*/
  -ms-filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#8D8C8D',EndColorStr='#515352');
  filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#8D8C8D',EndColorStr='#515352');
  /*IE10~,Android4.0~,iOS5.1~*/
  background: -webkit-linear-gradient(top, #8D8C8D 0%, #515352 100%);
  /*IE10~,Android4.4~,iOS7~*/
  background: linear-gradient(to bottom, #8D8C8D 0%, #515352 100%);
  /*~IE8はnth-child使用不可*/ }
  #nav .ddBtn {
    display: none; }
  #nav ul {
    width: 1140px;
    height: 45px;
    margin: 0 auto; }
  #nav li a {
    display: block;
    width: 157px;
    height: 45px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background: url(../imgs/top/gnav-all.gif) left top no-repeat;
    float: left; }
  #nav li:first-child a:hover {
    background-position: left -45px; }
  #nav li:first-child + * a {
    background-position: -157px top; }
  #nav li:first-child + * a:hover {
    background-position: -157px -45px; }
  #nav li:first-child + * + * a {
    background-position: -314px top; }
  #nav li:first-child + * + * a:hover {
    background-position: -314px -45px; }
  #nav li:first-child + * + * + * a {
    background-position: -471px top; }
  #nav li:first-child + * + * + * a:hover {
    background-position: -471px -45px; }
  #nav li:first-child + * + * + * + * a {
    width: 156px;
    background-position: -627px top; }
  #nav li:first-child + * + * + * + * a:hover {
    width: 156px;
    background-position: -627px -45px; }
  #nav li:first-child + * + * + * + * + * a {
    width: 156px;
    background-position: -783px top; }
  #nav li:first-child + * + * + * + * + * a:hover {
    width: 156px;
    background-position: -783px -45px; }

html*#nav li {
  /*~IE7*/
  float: left; }

html*#nav li a {
  /*~IE7*/
  float: none; }

#nav li a span {
  /* display: none; */ }

/*----- パンくず -----*/
.breadcrumbs {
  font-size: 12px;
  padding: 8px 0;
  background-color: #F1F1F1; }
  .breadcrumbs .cont {
    width: 1140px;
    padding: 0 0 0 20px; }
  .breadcrumbs li {
    display: inline-block;
    margin: 0 5px 0 0; }
    .breadcrumbs li:after {
      content: "\003E";
      margin: 0 0 0 6px; }
    .breadcrumbs li:last-child:after {
      content: ""; }

/*----- 2カラム -----*/
/*サイドメニュー*/
#side {
  /* width: $width-side; */
  width: 25%;
  /* margin: 20px 20px 0 0; */
  padding-right: 20px;
  float: left; }
  #side nav .ttl {
    height: 40px;
    line-height: 40px;
    color: #fff;
    font-weight: bold;
    margin-top: 20px;
    padding-left: 20px;
    /*IE*/
    -ms-filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#7E807F',EndColorStr='#4C4E4D');
    filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#7E807F',EndColorStr='#4C4E4D');
    /*IE10~,Android4.0~,iOS5.1~*/
    background: -webkit-linear-gradient(top, #7E807F 0%, #4C4E4D 100%);
    /*IE10~,Android4.4~,iOS7~*/
    background: linear-gradient(to bottom, #7E807F 0%, #4C4E4D 100%);
    background-color: #686968; }
  #side nav li a {
    display: block;
    height: 50px;
    line-height: 50px;
    color: #333;
    font-weight: bold;
    text-decoration: none;
    padding-left: 20px;
    border: 1px solid #BDBDBD;
    border-top: 0;
    border-bottom-style: dotted;
    /*IE*/
    -ms-filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#F9F9F9',EndColorStr='#EDEDED');
    filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#F9F9F9',EndColorStr='#EDEDED');
    /*IE10~,Android4.0~,iOS5.1~*/
    background: -webkit-linear-gradient(top, #F9F9F9 0%, #EDEDED 100%);
    /*IE10~,Android4.4~,iOS7~*/
    background: linear-gradient(to bottom, #F9F9F9 0%, #EDEDED 100%);
    background-color: #F3F3F2; }
  #side nav li:last-child a {
    border-bottom-style: solid; }
  #side nav li.selected a {
    color: #fff;
    -ms-filter: none;
    filter: none;
    background-image: none;
    /*gradient打ち消し*/
    background-color: #686968; }

/*メインコンテンツ*/
#main {
  /* width: $width-main; */
  width: 75%;
  float: right; }

/*----- 1カラム -----*/
#item {
  /* width: $width-item; */
  width: 84%;
  margin: 0 auto; }

/*----- フッター -----*/
#footer {
  background: -webkit-gradient(linear, center top, center bottom, from(#E8E7E8), to(#FFFFFF));
  background-color: #F8F8F8; }
  #footer .cont {
    position: relative;
    width: 1140px;
    padding: 30px 0;
    background: -webkit-gradient(linear, center top, center bottom, from(#E8E7E8), to(#FFFFFF));
    background-color: #F8F8F8; }
  #footer .toHead {
    position: absolute;
    top: 0;
    right: 5px;
    font-size: 12px;
    color: #333;
    text-decoration: none;
    padding: 2px 10px 5px 10px;
    background-color: #fff; }
    #footer .toHead:hover {
      color: #217403; }
    #footer .toHead svg {
      display: none; }
  #footer .toTop {
    position: absolute;
    bottom: 30px;
    left: 150px;
    left: 130px\9;
    /*IE8*/
    color: #217403; }
    #footer .toTop:hover {
      color: #333; }
  #footer .ddBtn {
    display: none; }
  #footer ul:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden; }
  #footer li {
    position: relative;
    display: block;
    padding: 0 12px 0 0;
    margin: 0 12px 0 0;
    background: url(../imgs/top/fnav-line.gif) right center no-repeat;
    float: left; }
    #footer li a {
      font-size: 12px;
      color: #666;
      text-decoration: none; }

html*#footer .toTop {
  /*~IE7*/
  left: 130px; }

#small {
  font-size: 12px;
  color: #666;
  text-align: center;
  margin: 20px 0 0 0; }

/*▼▼ 6.ページ共通*********************************************************/
/*ステップ*/
.stepTitle:hover {
  opacity: 1; }

/*擬似テーブル*/
.tbl {
  display: table;
  width: 100%; }
  .tbl > * {
    display: table-cell; }
  .tbl .trow {
    display: table-row; }
    .tbl .trow > * {
      display: table-cell;
      vertical-align: middle; }
  .tbl:after {
    display: none; }

/*----- タブパネル -----*/
/* .tabPanel {
	.tab {
		> li {
			width: 20%;
			border: solid #666 1px;
			border-left: none;
			float: left;
			&:first-child {
				border-left: solid #666 1px;
			}
			a {
				display: block;
				height: 40px;
				line-height: 40px;
				text-align: center;
				&.selected {
					color: #fff;
					background-color: $color-base;
				}
			}
		}
		&:after {
			@extend .clearfix:after;
		}
	}
	.panel > li {
		padding: 15px 10px;
		border: solid #666 1px;
	}
} */
.tabPanel {
  /*タブ*/
  /*色付きタブ*/
  /*パネル*/
  /*色付きタブのパネル*/
  /*後ろの.tab*/
  /*入れ子の.tabPanel(タブではない左右遷移ボタン)*/
  /* .tabPanel {
  	.tab {
  		visibility: hidden;
  		height: 0;
  	}
  	.panel > li {
  		border: none;
  	}
  } */ }
  .tabPanel .tab {
    margin-top: 20px;
    margin-bottom: -1px; }
    .tabPanel .tab > li {
      float: left; }
      .tabPanel .tab > li a {
        display: block;
        padding: 10px 15px;
        text-align: center;
        text-decoration: none;
        border: solid transparent 1px; }
      .tabPanel .tab > li.active a {
        color: #333;
        border: solid #DDDDDD 1px;
        border-bottom: solid #fff 1px;
        border-radius: 4px; }
  .tabPanel .tab.pill > li.active a {
    color: #fff;
    border: solid transparent 1px;
    background-color: #418BCA; }
  .tabPanel .tab ~ .pnl > li {
    padding: 15px 0;
    border-top: solid #DDDDDD 1px;
    border-bottom: solid #DDDDDD 1px; }
  .tabPanel .tab.pill ~ .pnl > li {
    border-top: none;
    border-bottom: none; }
  .tabPanel .pnl ~ .tab {
    margin-top: -1px;
    margin-bottom: 20px; }
    .tabPanel .pnl ~ .tab > li.active a {
      border-top: solid #fff 1px;
      border-bottom: solid #DDDDDD 1px; }

.tabPanel.noTab {
  /*タブなしの左右遷移ボタンなど*/ }
  .tabPanel.noTab .tab {
    visibility: hidden;
    height: 0; }
  .tabPanel.noTab .pnl > li {
    border: none; }

/*----- モーダルウィンドウ -----*/
.mdl {
  /*bootstrap競合のため.modal→.mdl*/
  cursor: pointer; }

#modal {
  position: fixed;
  display: table;
  text-align: center;
  width: 100%;
  height: 100%;
  /*120%*/
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 20; }
  #modal > div {
    display: table-cell;
    vertical-align: middle; }
    #modal > div > div {
      position: relative;
      width: 100%;
      /*JSでimg幅+40に*/
      margin: 0 auto; }
      #modal > div > div > *:not(.cls) {
        /*bootstrap競合のため.close→.cls*/
        margin: 20px 0; }
      #modal > div > div > .cls {
        position: absolute;
        top: 0;
        right: 0;
        width: 30px;
        height: 30px;
        /* border-radius: 15px;
        background-color: #000; */
        line-height: 0;
        /**/
        cursor: pointer;
        /* > img {
        	margin: 8px 0 0 0;
        } */ }

/*----- 背景画像表示 -----*/
.bgimg {
  background-position: left top;
  background-repeat: no-repeat;
  background-size: contain; }

/*▼▼ 7.ページ個別*********************************************************/
/*IE8対応のため不使用に変更　:not()　:nth-child() :last-child() */
/*----- お知らせ通知 -----*/
/*240907追加*/
#TopPage .annc:not(:has(li)) {
  display: none !important; }

#TopPage .annc > * {
  width: 1140px;
  margin: 0 auto;
  padding: 0 0 2px 0; }

#TopPage .annc:not(:has(li:nth-child(2))) > * {
  /*241022追加*/
  padding: 3px 0 2px 0; }
  #TopPage .annc:not(:has(li:nth-child(2))) > * h3 {
    display: none; }
  #TopPage .annc:not(:has(li:nth-child(2))) > * li:before {
    background-color: #4F9E4F;
    color: #fff;
    content: "お知らせ";
    display: inline-block;
    font-size: 11px;
    height: fit-content;
    padding: 2px 6px 1px 6px;
    width: fit-content; }

/*-------- IE8 CSSハック --------*/
#topInfo li + li + li + li + li {
  background: none\9; }

/*JRA発表 お知らせ*/
/*180727追加*/
.news_jra {
  padding: 15px 15px 7px;
  border: 1px solid #ddd; }
  .news_jra li span {
    font-size: 12px;
    margin-right: 15px; }
  .news_jra li em {
    color: #f00; }

/*ニュース速報 と 私の競馬*/
.rows .col-m-6 {
  /*ページ内で.col-m-6が一箇所のため利用*/
  width: 48% \9 ; }

.rows .col-m-6 + .col-m-6 {
  width: 49% \9 ;
  margin-right: 0\9;
  float: right\9; }

/* #topRecommend li {
	width: 270px\9;
}
#topRecommend li + li + li + li {
	margin-right: 0\9;
    float: right\9;
} */
/*200523削除*/
/*----- トップ -----*/
.noMarginB {
  margin-bottom: 0 !important; }

#topService li {
  position: relative;
  display: block;
  width: 380px;
  height: 234px;
  float: left; }
  #topService li a.wrap {
    /* position: static; */
    display: block;
    height: 100%; }
    #topService li a.wrap .txt {
      position: absolute;
      top: 60px;
      left: 25px;
      right: 25px;
      color: #333; }
  #topService li a.wrap2 {
    /*20190822追加*/ }
    #topService li a.wrap2 .txt2 {
      position: absolute;
      top: 60px;
      left: 25px;
      right: 25px;
      color: #333; }
  #topService li a.but, #topService li a.stepTitle {
    font-size: 16px;
    position: absolute;
    /* &.buy {
    	right: 24px;
    	top: 170px;
    	width: 216px;
    } */ }
    #topService li a.but.detail, #topService li a.detail.stepTitle {
      right: 150px;
      top: 182px; }
    #topService li a.but.down, #topService li a.down.stepTitle {
      right: 24px;
      top: 182px; }
  #topService li:first-child {
    /* a.pic {
    	top: 142px;
    	left: 10px;
    	width: 362px;
    	height: 92px;
    	svg {
    		margin: 6px 6px 0 0;
    		float: right;
    	}
    } */ }
    #topService li:first-child a.wrap {
      background: url(../imgs/top/topservice_next.jpg) left top no-repeat; }
  #topService li:first-child + * a.wrap {
    background: url(../imgs/top/topservice_dl.jpg) left top no-repeat; }
  #topService li:first-child + * + * {
    /* a.wrap { */ }
    #topService li:first-child + * + * div.wrap {
      /*20190822修正*/
      /* background: url(../imgs/top/topservice_sp.jpg) left top no-repeat; */
      background: url(../imgs/top/topservice_sp_2.png) left top no-repeat;
      height: 100%; }
  #topService li.forSP {
    /*20190822追加*/ }
    #topService li.forSP a {
      background: url(../imgs/top/topservice_sp_2.png) left top no-repeat; }
      #topService li.forSP a:hover .topService-new-icon {
        opacity: 0.7; }
  #topService li.topService-new {
    /*20190822追加*/
    position: relative; }
    #topService li.topService-new .simple_erea {
      position: absolute;
      text-decoration: none;
      text-align: center;
      bottom: 10px;
      left: 0;
      right: 0;
      margin: 0 auto; }
      #topService li.topService-new .simple_erea .topService-new-try .topService-new-icon {
        display: inline-block;
        position: absolute;
        top: 52%;
        left: 23px;
        width: 42px;
        height: 42px;
        border-radius: 50%;
        background: #ffe012;
        text-align: center;
        line-height: 42px;
        color: #000;
        font-weight: bold;
        font-size: 12px;
        z-index: 15; }

.topMark, #topData li a .new {
  font-size: 11px;
  color: #fff;
  padding: 2px 6px;
  border-radius: 9px; }

.top-but-default, #topInfo .but-default, #topMykeiba .but-default:not(.exc), #topData .but-default, #topSpecialMovie .but-default {
  position: absolute;
  right: 0;
  bottom: -45px; }

#topInfo {
  position: relative;
  display: inline-block;
  min-height: 120px;
  margin: 10px 0 40px 0;
  padding: 10px;
  /* background-color: $background-color-light; */
  border: 1px solid #DDDDDD; }
  #topInfo li {
    position: relative;
    display: block;
    /*width: ($width-fixed - 20px - 2px)/5;*/
    /*210617*/
    /*width: calc((100% - 20px)/5);*/
    width: 20%;
    /*210617*/
    min-height: 100px;
    padding: 4px 6px;
    /* border-right: solid 1px $border-color-base; */
    /*background: url(../imgs/top/topinfo_bg.gif) right top no-repeat;*/
    /*210617*/
    float: left;
    /*> span[class^="cate"] {
    	position: absolute;
    	bottom: 0;
    	right: 6px;
    	@extend .topMark;
    }*/ }
    #topInfo li:after {
      /*210617*/
      position: absolute;
      top: 0;
      right: 0;
      content: " ";
      width: 1px;
      height: 100px;
      border-right: 1px solid #CFCFCF; }
    #topInfo li:last-child {
      /* border-right: 0; */
      /*background: none;*/
      /*210617*/ }
      #topInfo li:last-child:after {
        /*210617*/
        border: none; }
    #topInfo li > span {
      font-size: 12px; }
    #topInfo li h4 {
      /* padding: 4px 0; */
      padding: 4px 0 14px 0; }
    #topInfo li h4 + span {
      /*230804*/
      position: absolute;
      bottom: 0;
      right: 6px;
      display: block;
      min-width: 84px;
      font-size: 11px;
      color: inherit;
      font-weight: bold;
      text-align: center;
      padding: 2px 6px 1px 6px;
      background-color: #ddd; }
  #topInfo .but-default {
    bottom: -46px; }

#topNewsList {
  /* position: relative; */
  /*つけると2重スルロールバー*/
  /*width: 550px;*/
  width: 650px;
  /*220517*/
  height: 280px;
  margin: 20px 0 8px 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch; }
  #topNewsList iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0; }

#topNewsList + .but-default {
  margin: 0 8px 0 0; }

#topMykeiba {
  position: relative;
  /* margin: $margin-base 0 $margin-wide*2 0; */
  margin: 20px 0 10px 0;
  /* &:after {
  	position: absolute;
  	top: -50px;
  	left: -10px;
  	content: "";
  	width: 1px;
  	height: 340px;
  	background: url(../imgs/top/dotted.gif) center center repeat-y;
  } */ }
  #topMykeiba ul {
    margin-bottom: 0; }
    #topMykeiba ul li {
      padding-bottom: 20px; }
      #topMykeiba ul li:last-child {
        /* padding-bottom: 0; */ }
  #topMykeiba .pic {
    /*width: 105px;
    height: 100px;*/
    width: 450px;
    /*220517*/
    height: 192px;
    /*220517*/
    /*float: left;*/
    float: right;
    /*220517*/ }
  #topMykeiba .ttl {
    width: 445px;
    font-size: 16px;
    /*margin: 0 0 0 5px;*/
    margin: 2px 0 0 5px;
    /*220517*/
    float: left; }
    #topMykeiba .ttl a {
      display: block;
      float: left; }
  #topMykeiba .txt {
    width: 445px;
    margin: 5px 0 0 5px;
    padding-left: 15px;
    float: left; }
  #topMykeiba .but-default:not(.exc) {
    bottom: -18px; }

#topData {
  position: relative;
  margin: 10px 0 40px 0; }
  #topData li {
    position: relative;
    width: 24%;
    width: calc((100% - 30px)/4);
    margin: 0 10px 0 0;
    border: solid 1px #CFCFCF;
    border-radius: 4px;
    overflow: hidden;
    float: left; }
    #topData li:last-child {
      margin: 0 0 0 0; }
    #topData li a {
      text-decoration: none; }
      #topData li a .new {
        position: absolute;
        top: 6px;
        right: 6px;
        opacity: 1; }
      #topData li a .ttl {
        min-height: 85px;
        font-size: 12px;
        color: #333;
        line-height: 16px;
        padding: 10px 10px 2px 10px;
        /* a {
        	font-size: 14px;
        	line-height: 20px;
        } */ }
        #topData li a .ttl p {
          padding-bottom: 16px;
          /*250124追加*/
          font-size: 14px;
          color: #0066cc;
          line-height: 20px;
          min-height: 40px;
          /*2行の高さを確保する*/
          /* text-decoration: underline; */ }
        #topData li a .ttl span {
          position: absolute;
          /*250124追加*/
          bottom: 2px;
          /*250124追加*/
          right: 10px;
          /*250124追加*/
          display: block;
          font-size: 11px;
          color: #999;
          text-align: right; }
      #topData li a .pic {
        margin: 0;
        padding: 0 0 0 0;
        text-align: center;
        min-height: 144px;
        /*背景にNoImageを配置するため確保*/
        /*182px→144px(2022/4/12修正)*/
        background: url(../imgs/top/topdata_noimg.gif) center center no-repeat;
        background-size: cover; }
        #topData li a .pic img {
          width: 100%;
          height: auto; }
    #topData li a:hover,
    #topData li a:hover * {
      opacity: 0.7; }

#topSpecialMovie {
  position: relative;
  margin: 10px 0 60px 0;
  /*▼ボタン等削除し通常バナー同様の1毎画像リンクにしたためコメントアウト▼*/
  /* position: relative;
  width: 1140px;
  height: 300px;
  margin-bottom: 60px;
  background-position: center left;
  background-repeat: no-repeat;
  background-size: contain;
  .but {
  	position: absolute;
  	top: 240px;
  	right: 515px;
  	font-size: 18px;
  }
  .pic {
  	position: absolute;
  	top: 20px;
  	right: 20px;
  	width: 260px;
  	overflow: hidden;
  	border-radius: $border-radius-base;
  	.ttl {
  		color: $color-base;
  		font-size: $font-size-base;
  		font-weight: bold;
  		padding: 10px 15px;
  		background-color: #E6E6E6;
  	}
  } */ }
  #topSpecialMovie .but-default {
    bottom: -40px; }

.topBanner {
  margin: 20px 0 20px 0;
  /* li {
  	width: 220px;
  	width: calc((100% - 60px)/4);
  	margin: 0 20px 0 0;
  	float: left;
  	&:last-child {
  		margin: 0 0 0 0;
  	}
  	.ttl {
  		padding: 4px 0;
  	}
  } */
  /* .rows > * {
  	margin-bottom: 0;
  } */
  /* 200523削除 */ }
  .topBanner li {
    width: 270px;
    margin: 0 20px 10px 0;
    /* 200523追加 */ }
    .topBanner li:nth-child(4n) {
      /* 200523追加 */
      margin-right: 0; }
  .topBanner .pic > span {
    display: table-cell;
    vertical-align: middle;
    width: 270px;
    height: 166px; }
    .topBanner .pic > span img {
      width: 100%;
      height: auto; }
  .topBanner a:hover,
  .topBanner a:hover * {
    opacity: 0.7; }

#sns ul {
  /*アイコン5個の場合*/
  width: 530px;
  margin: 30px auto 15px auto; }
  #sns ul li {
    display: block;
    width: 60px;
    margin: 0 23px;
    float: left; }

#topCopy {
  /* width: 680px;
  margin: 30px 30px 0 0;
  float: left; */
  /* width: 74%; */
  height: 140px;
  padding: 20px;
  background-color: #F3F3F3; }

#topSSL {
  /* width: 200px;
  margin: 30px 0 10px 0;
  float: right; */
  /* width: 24%; */
  height: 140px;
  border: 1px solid #DDDDDD; }
  #topSSL #pMark {
    width: 40%;
    padding: 5px 0 0 10px;
    float: left; }
  #topSSL #gSign {
    width: 60%;
    padding: 15px 0 0 0;
    float: right; }
  #topSSL .txt {
    font-size: 12px;
    color: #666;
    margin: 0;
    padding: 3px 10px; }

/*▼▼ 8.外部プラグイン*********************************************************/
/*▼ slick ▼*/
#slickJSBox {
  width: 100%;
  max-width: 1140px;
  /*▼画面幅いっぱい▼*/
  /* width: 100vw;
  width: calc(100vw - 17px);
  max-width: 100vw;
  max-width: calc(100vw - 17px); */
  /*▲画面幅いっぱい▲*/
  margin: 20px 0 0 0; }
  #slickJSBox ul {
    margin-bottom: 0; }
  #slickJSBox.nodots {
    /*Android Ver4.2 エラー対応(JSで.nodots付与)*/ }
    #slickJSBox.nodots .slick-dots li button:before {
      opacity: 0.5 !important; }

#slickJS {
  position: relative; }
  #slickJS:hover .slick-next,
  #slickJS:hover .slick-prev {
    opacity: 1; }

.slider-for {
  /*スライダー*/ }
  .slider-for li {
    /* line-height: 1; */
    /* &.nx {
    	p {
    		a {
    			&.down {
    				left: 165px;
    				top: 180px;
    				font-size: $font-size-xl;
    				padding: 16px 22px;
    			}
    			&.buy {
    				left: 480px;
    				top: 180px;
    				font-size: $font-size-ml;
    				width: 217px;
    			}
    			&.detail {
    				left: 480px;
    				top: 225px;
    				font-size: $font-size-base;
    				width: 217px;
    			}
    		}
    	}
    }
    &.dl {
    	p {
    		a {
    			&.buy {
    				left: 560px;
    				top: 143px;
    				font-size: $font-size-xl;
    				padding: 16px 22px;
    			}
    		}
    	}
    }
    &.sp {
    	p {
    		a {
    			&.detail {
    				left: 228px;
    				top: 180px;
    				font-size: $font-size-xl;
    				padding: 16px 22px;
    			}
    		}
    	}
    } */ }
    .slider-for li p {
      position: relative;
      height: 300px !important;
      color: #333; }
      .slider-for li p a {
        text-decoration: none; }
        .slider-for li p a.test {
          position: absolute;
          bottom: 20px;
          right: 20px;
          width: 100px;
          height: 50px;
          line-height: 50px;
          font-size: 20px;
          color: #333;
          border-radius: 4px;
          background-color: #fff; }
        .slider-for li p a.down, .slider-for li p a.detail, .slider-for li p a.buy {
          position: absolute;
          line-height: 1; }
  .slider-for .slick-slide {
    /*個別(動的生成クラス)*/
    height: 300px !important; }

.slick-slide.slick-center {
  /*中央スライダー(動的生成クラス)*/ }

.slick-slide:not(.slick-center) {
  /*中央を除いたスライダー(動的生成クラス)*/ }

.slick-dotted.slick-slider {
  /*スライダーとドット(動的生成クラス)*/
  margin-bottom: 0 !important; }

.slider-nav {
  /*サムネ*/
  margin-top: 4px;
  /*▼画面幅いっぱい▼*/
  /* width: $width-fixed;
  margin: 0 auto; */
  /*▲画面幅いっぱい▲*/ }
  .slider-nav li {
    height: 80px;
    line-height: 80px;
    font-size: 30px;
    padding: 0 !important;
    /* border: solid 1px #fff; */
    cursor: pointer; }
    .slider-nav li a {
      text-decoration: none; }
    .slider-nav li p {
      margin: 0 2px;
      transition: all 1s ease;
      background-size: cover;
      background-position: center center; }
    .slider-nav li:hover {
      opacity: 0.7; }
    .slider-nav li.slick-current {
      /*中央表示中のサムネ(動的生成クラス)*/ }
      .slider-nav li.slick-current p {
        position: relative;
        /* opacity: 0.7; */
        /* img {
        	opacity: 0.7;
        } */ }
        .slider-nav li.slick-current p:after {
          /*枠線あり*/
          position: absolute;
          top: 0;
          left: 0;
          content: "";
          /* width: 228px;
          height: 80px; */
          width: 100%;
          height: 100%;
          border: 4px solid #00C853; }
  .slider-nav li:first-child p {
    margin: 0 2px 0 0; }
  .slider-nav li:last-child p {
    margin: 0 0 0 2px; }

.slider-arw {
  /*左右ナビ*/ }
  .slider-arw .slick-prev,
  .slider-arw .slick-next {
    /*代替矢印*/
    top: 150px !important;
    width: 50px;
    height: 50px !important;
    opacity: 0;
    transition: all 1s ease;
    /* z-index: 1000; */
    /* img {
    	margin-top: 20px;
    } */ }
    .slider-arw .slick-prev:before,
    .slider-arw .slick-next:before {
      content: "";
      /*標準矢印の非表示*/ }
    .slider-arw .slick-prev p,
    .slider-arw .slick-next p {
      /*クリックエリア背景*/
      height: 100%;
      border-radius: 25px;
      background-color: rgba(255, 255, 255, 0.75); }
    .slider-arw .slick-prev svg,
    .slider-arw .slick-next svg {
      /*代替矢印*/
      margin-top: 6px; }
  .slider-arw .slick-prev {
    left: 4px;
    /*▼画面幅いっぱい▼*/
    /* left: 0px; */
    /*▲画面幅いっぱい▲*/ }
    .slider-arw .slick-prev svg {
      /*代替矢印*/
      /*一部環境で回転エラー → SVG自体で対応*/
      /* -moz-transform-origin: 20px 20px; */
      /*for Firefox*/
      /* -webkit-transform-origin: 20px 20px; */
      /*for iPad*/
      /* transform: rotate(180deg); */
      /* -moz-transform: rotate(90deg); */
      /*for Firefox*/
      /* -webkit-transform: rotate(180deg); */
      /*for iPad*/
      margin-top: 4px; }
  .slider-arw .slick-next {
    right: 4px;
    /*▼画面幅いっぱい▼*/
    /* right: 0px; */
    /*▲画面幅いっぱい▲*/ }

.slick-arrow {
  /*戻る有効化(動的生成クラス)*/
  z-index: 10;
  /* width: 30px !important;
  height: 100px !important; */ }

.slick-dots {
  /*ドット(動的生成クラス)*/
  position: absolute;
  top: 270px; }
  .slick-dots li button:before {
    /*content: '■' !important;*/
    /*形を●以外に変更*/
    font-size: 10px !important;
    /*大きさ*/
    color: #FFF !important;
    /*色*/ }

/*IE9で矢印が背景画像に隠れるエラー対応*/
body:not(:target) .slider-arw .slick-prev {
  /*IE9*/
  /* z-index: 999\9; */
  left: -50px\9;
  opacity: 1\9; }

body:not(:target) .slider-arw .slick-next {
  /*IE9*/
  /* z-index: 999\9; */
  right: -50px\9;
  opacity: 1\9; }

/*▲ slick ▲*/

/*# sourceMappingURL=top.css.map */