@charset "UTF-8";
@import url("/dra/css/fontawesome-6.4.2/css/all.min.css");
@import url("/dra/css/oldcms.css");


/* RESET */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline
}
ol, ul { list-style: none }
table { border-collapse: collapse; border-spacing: 0 }
caption, th, td { text-align: left; font-weight: normal; vertical-align: middle }
q, blockquote { quotes: none }
q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none }
a img { border: none }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block }
:root {
	--lightBlue-color: #00a0e6;
  --textBlue-color: #1788af;
	--orange-color: #ef6100;/*元f28700*/
	--red-color: #e5001b;
	--darkRed-color: #b40000;
	--lightRed-color: #ffd9d9;
  --navy-color:#00418e;
  --lightNavy-color:#e8f0ff;
  --green-color: #008ca0;
  --lightGreen-color: #e6f4f3;
  --gray-color:#e0e0e0;
  --appRed-color: #bb0007;/*アプリ：プレミアムガチャで使用*/
}
/* == BASIC ELEMENTS' SETTINGS == */
/*
*タップした際のアウトラインを消します。
*デバイスによってはこのルールが無視されます。
*/
/* html { line-height: 1; -webkit-tap-highlight-color: rgba(255,255,255,0) } */
/* * { outline: none } */
/* デバイスを横にした場合にフォントサイズを自動調整。*/
html { line-height: 1; -webkit-text-size-adjust: auto }
body {
  color: #333;
  font-family: sans-serif;
  vertical-align: baseline;
  font-size: 14px;
  line-height: 1.6;
  position: relative
}
a { color: #36C }
a.noline { text-decoration: none }
pre, code, kbd { font-family: monospace }
b,em,strong { font-weight: 700; font-style: normal }
code {
  color: #666;
  border: 1px solid #DDD;
  padding: 0 4px;
  border-radius: 2px;
  background: #FFF;
  font-size: 12px
}
.dspPC { display: block }
.dspTAB { display: none }
.dspSP { display: none }
p { margin-bottom: 20px }

header {
  overflow: hidden;
  width: 100%;
  box-sizing: border-box;
  position: relative;
}
/*ここから*/
header #logo a { display:flex; justify-content:center; align-items:center }
header #logo img { height:45px }
header .headRight { display:flex; justify-content: flex-end }
header .headRight .service { margin-right:10px }
header .headRight .service a {
  background-color:#FFF;
  border-radius:10px;
  display:flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  width:45px;
  height:40px;
  font-size:10px;
  color: #001850;
  text-decoration: none;
  font-weight: bold;
  line-height: 1.3
}
header .menu { width: 50px; text-align: center }
header .menu .fa { display: block; font-size: 40px; color: #FFF }
header .menu a {
  display: block;
  width: 100%;
  height: auto;
  letter-spacing: -1px;
  color: transparent
}
header .headLinkArea { height: 30px; background-color: #003579; font-size: 12px }
header .headLinkArea a {
  display: block;
  float: right;
  color: #FFF;
  line-height: 30px;
  position: relative;
  z-index: 150;
  text-decoration: none
}
header .headLinkArea a i { margin-right: 3px }
header .headLinkArea a#login { margin-right: 5px }
header .headLinkArea a#ticketBuy { margin-right: 10px }
/*ここまで*/
/*appBnr 25.7.22*/
#headAppArea { background-color: #f2f2f2; height: min(23vw,75px); display: flex; justify-content: center; align-items: center }
#headAppArea button { border:none; color: #c1c1c1; cursor: pointer; background-color: transparent }
#headAppArea button > i { width:min(6.2vw,25px); height:min(6.2vw,25px); font-size: min(6.2vw,25px) }
#headAppArea a { display: flex; align-items: center }
#headAppArea a > div:first-of-type { position: relative }
#headAppArea a > div:last-of-type { padding: 0 min(2vw,20px) 0 min(2.8vw,20px); text-align: center }
#headAppArea img { display: block }
#headAppArea img[src*="appIcon"] { width:min(17vw,65px) }
#headAppArea img[src*="appBadge"] { position: absolute; width:min(5.8vw,20px); top: -4px; right:-8px }
#headAppArea img[src*="appText"] { width:min(50vw,250px); margin: 0 auto min(2vw,10px) }
#headAppArea img[src*="appTitle"] { width:min(30vw,160px) }
#headAppArea img[src*="appDl"] { width:min(28vw,150px) }

/*24.2.6 新ナビ*/
header .headSp {
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: center;
  position: relative;
  width: 100%;
  height: 60px;
  z-index: 100;
  background-color: #00418E
}
header .headSp.fixed { position: fixed; top: 0 }
header .headSp > a { display: flex; align-items: center; height: 60px; position: absolute }
header .headSp > a > img { width:100% }
header .headSp > a:first-of-type { left: 10px; width: min(16vw,55px) }/*プレミアムコンテンツ*/
header .headSp > a:nth-of-type(2) { left:50%; transform:translate(-50%); width: min(24vw,82px) }
header .headSp > a:nth-of-type(3) { right: 55px; width: min(16vw,55px) }/*新規入会ログイン*/
header nav#headMenu { padding:0; height:45px; background-color:#EEE }
header div#cpBnr { padding:20px 10px 10px; margin-top:50px }
header div#cpBnr + nav#headMenu { padding:0 }
header ul.headmenuFlick { padding:0 20px }
header ul.headmenuFlick li { width:calc(100% / 4); height:45px; font-weight:bold }
header ul.headmenuFlick li a { font-size:min(3.4vw,14px); color:#00418E; line-height:1.4; display:grid; place-content:center; place-items: center; height:45px }
header ul.headmenuFlick li span { color:#00418E; width: 100%; text-align: center; font-size:9px; line-height:1 }
/*flickity option*/
header nav#headMenu .flickity-prev-next-button { width:20px; height:45px; border-radius: 0; margin:0!important }
header nav#headMenu .flickity-prev-next-button.previous { left:0 }
header nav#headMenu .flickity-prev-next-button.next { right:0 }
header nav#headMenu .flickity-prev-next-button .flickity-button-icon { margin:0 }

footer { position: relative; padding: 25px 0 20px; background-color: #00418E; text-align:center }
footer .sitename a {
  width: 100%;
  height: 23px;
  background-repeat: no-repeat;
  background-image: url("/dra/image/logo-drajoJP.svg");
  background-size: auto 23px;
  background-position: center;
  display: block;
  margin: 0 auto 8px
}
footer .copyright { color: #FFF; font-size: 10px }

/* TITLE */
.contents .contentTitle {
  margin: 0 0 10px;
  padding: 10px 5px;
  color: #FFF;
  background-color: #1e1d4e;
  text-align: center;
  font-size: 16px;
  font-weight: 900
}
h1, h2, h3, h4, h5 { overflow: hidden }
.contents h1,
h2 {
  font-size: 18px;
  line-height: 1.4;
  font-weight: bold;
  color: #333;
  padding: 15px 5px 10px;
  border-bottom: #E5001B 2px solid;
  margin-bottom: 10px
}
section#otherground h2,
section#schedule h2,
section#grade h2,
section#standings h2 {
  font-size: 15px;
  box-shadow: none;
  margin-bottom: 5px;
  padding: 5px 5px 0;
  border: none;
  background-color: transparent
}
section#schedule h2,
section#grade h2 { border: none; border-bottom: 1px solid #0900A0 }
section#grade h2 span {
  float: right;
  font-size: .71429em;
  line-height: 2.1em;
  font-weight: 400
}
h2.h2-Lline {
  margin: 0 0 15px;
  border-left: 8px solid #00418D;
  border-bottom: none;
  padding: 9px 0 10px 10px;
  font-weight: bold;
  color: #00418D;
  background-color: #EFEFEF
}
h2.h2-bar {
  margin-bottom: 15px;
  padding: 4px 0 5px 7px;
  border-bottom: none;
  box-shadow: none;
  color: #FFF;
  background-color:#00418D;
  font-weight: bold
}
h2.catTopH2 {
  padding: 0;
  border:none;
  box-shadow: none;
  margin-bottom: 10px
}
h2.catTopH2 img { width: 100% }
h3,
h3[class^="h3"] {
  margin: 0 0 10px;
  padding: 2px 0 2px 4px;
  font-size: 125.0%;
  line-height: 1.5;
  position: relative;
  font-weight: bold
}
h3      { color: #00418D; border-left: 6px solid #00418D }
h3.h3B  { color: #06B; border-left: 6px solid #06B }
h3.h3R  { color: #F33; border-left: 6px solid #F33 }
h3.h3P  { color: #FD5C85; border-left: 6px solid #FD5C85 }
h3.h3D  { color: #666; border-left: 6px solid #666 }
h3.h3G  { color: #090; border-left: 6px solid #090 }
h3.h3Y  { color: #F90; border-left: 6px solid #F90 }
h3.h3Or { color: #FF7F00; border-left: 6px solid #FF7F00 }
h3[class^="h3-bar"] { margin: 0 0 10px; padding: 3px 5px; position: relative }
h3.h3-bar   { color: #FFF; border: none; background-color: #00418D }
h3.h3-barB  { color: #FFF; border: none; background-color: #06B }
h3.h3-barR  { color: #FFF; border: none; background-color: #F55 }
h3.h3-barP  { color: #FFF; border: none; background-color: #FD5C85 }
h3.h3-barD  { color: #FFF; border: none; background-color: #666 }
h3.h3-barG  { color: #FFF; border: none; background-color: #35AA35 }
h3.h3-barY  { color: #FFF; border: none; background-color: #FC0 }
h3.h3-barOr { color: #FFF; border: none; background-color: #FF7F00 }
h3[class^="h3-box"] {
  padding:6px 15px;
  margin:0 0 15px;
  color:#333;
  background: none;
  border-style: solid;
  border-width: 2px
}
h3[class^="h3-Lline"] {
  padding:6px 2px 6px 14px;
  margin:0 0 15px;
  color:#333;
  background: none;
  border-left-width: 4px;
  border-left-style: solid;
  border-bottom-width: 1px;
  border-bottom-style: solid
}
h3[class^="h3-line"] {
  padding:6px 0 6px 10px;
  margin:0 0 15px;
  color:#333;
  background: none;
  border-left: none;
  border-bottom-width:2px;
  border-bottom-style:solid
}
h3.h3-line { color:#00418D }
h3.h3-lineB { color:#06B }
h3.h3-lineR { color:#F00 }
h3.h3-lineP { color:#FD5C85 }
h3.h3-lineD { color:#666 }
h3.h3-lineG { color:#35AA35 }
h3.h3-lineY { color:#FC0 }
h3.h3-lineOr { color:#FF7F00 }

h4 { margin: 5px 0; font-size: 16px; font-weight: bold; line-height: 1.5 }
h4[class^="h4-box"] {
  background:none;
  margin:0 0 15px;
  padding:6px 15px;
  border-style: solid;
  border-width: 1px
}
h4[class^="h4-Lline"] {
  background:none;
  margin:0 0 15px;
  padding:6px 0 6px 10px;
  border-left-style: solid;
  border-left-width: 2px;
  border-bottom-style: solid;
  border-bottom-width: 1px
}
h4[class^="h4-line"] {
  font-size:112.5%;
  font-weight:bold;
  background:none;
  margin:0 0 15px;
  padding:6px 0 6px 15px;
  border-bottom-style: double;
  border-bottom-width: 3px
}
h4[class^="h4-Lborder"] {
  font-size:112.5%;
  font-weight: bold;
  background: none;
  padding: 0 0 0 5px;
  border-left-style:solid;
  border-left-width:6px;
  margin-bottom: 15px
}
h4[class^="h4-Lborder"].box {
  border:#CCC 1px solid;
  padding: 4px 7px;
  margin-bottom: 15px
}
h4[class^="h4-Lborder"].box:before {
  content: "　";
  width: 6px;
  display: inline-block;
  margin-right: 5px
}
h4[class^="h4-bar"] {
  margin: 0 0 10px;
  padding: 5px 2px 5px 15px;
  position: relative
}
h4.h4-bar   { color: #FFF; border: none; background-color: #00418D }
h4.h4-barB  { color: #FFF; border: none; background-color: #06B }
h4.h4-barR  { color: #FFF; border: none; background-color: #F55 }
h4.h4-barP  { color: #FFF; border: none; background-color: #FD5C85 }
h4.h4-barD  { color: #FFF; border: none; background-color: #666 }
h4.h4-barG  { color: #FFF; border: none; background-color: #35AA35 }
h4.h4-barY  { color: #FFF; border: none; background-color: #FC0 }
h4.h4-barOr { color: #FFF; border: none; background-color: #FF7F00 }
h4.h4-bar   { color: #FFF; border: none; background-color: #00418D }
h4.h4-barB  { color: #FFF; border: none; background-color: #06B }
h4.h4-barR  { color: #FFF; border: none; background-color: #F55 }
h4.h4-barP  { color: #FFF; border: none; background-color: #FD5C85 }
h4.h4-barD  { color: #FFF; border: none; background-color: #666 }
h4.h4-barG  { color: #FFF; border: none; background-color: #35AA35 }
h4.h4-barY  { color: #FFF; border: none; background-color: #FC0 }
h4.h4-barOr { color: #FFF; border: none; background-color: #FF7F00 }
h3[class^="h3-"],
h4[class^="h4-"] { border-color: #00418D }
h3[class*="B"],
h4[class*="B"] { border-color: #06B }
h3[class*="R"],
h4[class*="R"] { border-color: #F00 }
h3[class*="P"],
h4[class*="P"] { border-color: #FD5C85 }
h3[class*="D"],
h4[class*="D"] { border-color: #666 }
h3[class*="G"],
h4[class*="G"] { border-color: #35AA35 }
h3[class*="Y"],
h4[class*="Y"] { border-color: #FC0 }
h3[class*="Or"],
h4[class*="Or"] { border-color: #FF7F00 }
h4.h4-Lborder.box:before   { background-color: #00418D }
h4.h4-LborderB.box:before  { background-color: #06B }
h4.h4-LborderR.box:before  { background-color: #F00 }
h4.h4-LborderP.box:before  { background-color: #FD5C85 }
h4.h4-LborderD.box:before  { background-color: #666 }
h4.h4-LborderG.box:before  { background-color: #35AA35 }
h4.h4-LborderY.box:before  { background-color: #FC0 }
h4.h4-LborderOr.box:before { background-color: #FF7F00 }
h5 {
  font-size:106.3%;
  font-weight:bold;
  border-bottom:2px solid #999;
  padding:10px 0 5px;
  margin:0 0 10px;
  line-height:18px
}
a[class*="list"]:before { content:'\f0da'; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 3px }
a[class*="list"]:hover:before { text-decoration: none }
a.list:before,a.list.textNv,a.textNv { color: #00418D }
a[class*="Bu"],
a[class*="Bu"]:before { color: #06B }
a[class*="Re"],
a[class*="Re"]:before { color: #F00 }
a[class*="Pi"],
a[class*="Pi"]:before { color: #FD5C85 }
a[class*="Y"],
a[class*="Y"]:before { color: #F0A900 }
a[class*="G"],
a[class*="G"]:before { color: #35AA35 }
a[class*="D"],
a[class*="D"]:before,
a[class*="Gr"],
a[class*="Gr"]:before { color: #666 }
a[class*="Or"],
a[class*="Or"]:before { color: #FF7F00 }

.uline { text-decoration: underline !important }
.ulineNo { text-decoration: none !important }

*[class*="text-icon"]:before { content: "■"; font-size:1.3em; line-height: 1 }
.text-icon:before   { color: #00418D }
.text-iconB:before  { color: #06B }
.text-iconR:before  { color: #F00 }
.text-iconP:before  { color: #FD5C85 }
.text-iconY:before  { color: #FC0 }
.text-iconD:before  { color: #666 }
.text-iconG:before  { color: #35AA35 }
.text-iconOr:before { color: #FF7F00 }

.f70 { font-size: 68.8% }/*11px*/
.f75 { font-size: 75% }/*12px*/
.f80 { font-size: 81.3% }/*13px*/
.f85 { font-size: 87.5% }/*14px*/
.f90 { font-size: 93.8% }/*15px*/
.f100 { font-size: 100% }/*16px*/
.f115 { font-size: 112.5% }/*18px*/
.f125 { font-size: 125% }/*20px*/
.f150 { font-size: 150% }/*24px*/
.f180 { font-size: 187.5% }/*30px*/
.f200 { font-size: 200% }/*32px*/
*[class*="textBo"] { font-weight: bold }
.textRe,.textBoRe { color: #F00 }
.textPi,.textBoPi { color: #FD5C85 }
.textNv,.textBoNv { color: #00418D }
.textBu,.textBoBu { color: #06B }
.textGr,.textBoGr { color: #999 }
.textG,.textBoG { color: #393 }
.textY,.textBoY { color: #F0A900 }
.textOr,.textBoOr { color: #FF7F00 }
.textW,.textBoW { color: #FFF }
.textBl,.textBoBl { color: #333 !important }
.textBoNo { font-weight: normal }
.bold { font-weight: bold }
.Sat { color: #5BE }
.Holi { color: #F66 }

.flexBox { display: flex }
.flexBox.yoko { flex-direction: row }
.flexBox.centerW { justify-content: center }
.flexBox.end { justify-content: flex-end }
.flexBox.wrap { flex-wrap: wrap }
.flexBox.justify { justify-content: space-between }
.flexBox.space { justify-content: space-around }
.flexBox.top { align-items: flex-start }
.flexBox.bottom { align-items: flex-end }
.flexBox.centerH { align-items: center }
.flexBox.stretch { align-items: stretch }
.flexBox img.auto { width: auto; max-width: 100% }

.title {
  background-image: url("/dra/image/2014/bg_title_repeat.png");
  background-size: 17px 50px;
  font-size: 1.42857em;
  line-height: 1.05em;
  position: relative;
  width: 100%;
  height: 50px;
  line-height: 50px;
  background-repeat: repeat-x;
  font-weight: bold;
  color: #003e91
}
.title1 {
  font-size: 1.07143em;
  line-height: 1.4em;
  font-weight: bold;
  color: #666;
  background-color: #DFF;
  line-height: 1.5;
  padding: 5px 10px 3px
}
h3.title1 { margin-left: 0 }
.title2 {
  font-size: 1.07143em;
  line-height: 1.4em;
  font-weight: bold;
  color: #333;
  border-bottom: 1px solid #EEE;
  line-height: 1.5;
  padding: 5px 0 3px;
  margin: 0 0 7px 0
}
.title3,
.subtitle {
  font-size: 1.07143em;
  line-height: 1.4em;
  font-weight: bold;
  color: #555;
  background-color: #BDF;
  padding: 10px
}
.title4,
.subhead { border-left: 5px solid #00418E; margin-bottom: 5px; padding-left: 5px }


/* img */
.full-image img { display: block; width: auto; max-width: 100%; height: auto; margin: 0 auto }

.live-container .row,
.live-container #runner,
.live-container #player_info ul,
.live-container #player_info li,
.live-container .tab-menu,
.contents #regist .playersCat { zoom: 1 }
.live-container .row:before,
.live-container #runner:before,
.live-container #player_info ul:before,
.live-container #player_info li:before,
.live-container .tab-menu:before,
.contents #regist .playersCat:before,
.live-container .row:after,
.live-container #runner:after,
.live-container #player_info ul:after,
.live-container #player_info li:after,
.live-container .tab-menu:after,
.contents #regist .playersCat:after { content: ""; display: table }
.live-container .row:after,
.live-container #runner:after,
.live-container #player_info ul:after,
.live-container #player_info li:after,
.live-container .tab-menu:after,
.contents #regist .playersCat:after { clear: both }

footer .jump a, footer .sitename a,
.live-container #zone .player-shape.right i,
.live-container #zone .player-shape.left i { overflow: hidden; text-indent: -99999px; text-align: left; display: block }

li a,
li a.up,
li a.down,
.inner .linkmemo a { background-size: 21px 15px }
li a { text-decoration: none; color: #333 }
li a:after {
  content: "\f0da";
  display: inline-block;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  position: absolute;
  right: 10px;
  top:calc(50% - 0.5em)
}
nav ul li a:after { display:none }
li a.up:after {content: "\f0d8" }
li a.down:after {content: "\f0d7" }
li.plain,
.plain li,
li a,
.list-item > a,
.list-item > div {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding: 8px 10px;
  min-height: 60px;
  box-sizing: border-box;
  font-size: 1.14286em;
  line-height: 1.3
}
li a { padding-right: 25px; position: relative }
nav li a { padding:inherit; min-height:initial; font-size:initial }
li p,
li div { flex: 1 }
li p { margin-bottom:0 }
li img { display: block; margin-right: 10px }
li span {
  font-size: min(3vw,12px);
  line-height: 1.3;
  display: block;
  color: #888
}
li em {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 26px;
  height: 26px;
  margin: 0 5px 0 0;
  font-size: 1em;
  line-height: 1.5em;
  line-height: 1;
  font-weight: bold;
  color: #333;
  background: white;
  border: 1px solid #888;
  -webkit-border-radius: 3px;
  border-radius: 3px
}
li:first-child { border-top: 1px solid #E0E0E0 }
li.more { border-bottom: none }
li.more a {
  font-size: 0.85714em;
  line-height: 1.75em;
  justify-content: flex-end;
  min-height: 40px
}

a[href^="mailto"],
a[href^="tel"],
a.inline,
a.linkcolor,
.disc li a {
  color: #00418E;
  text-decoration: underline;
  background: none;
  display: inline
}
a[href^="mailto"]:after,
a[href^="tel"]:after,
a.inline:after,
a.linkcolor:after { display: none }

.title i,
.feature-menu i,
.main-menu .list-item i,
.fanclub .list-item i,
.goods .list-item i { font-family: 'Roboto Slab', serif }

div.newsdate {
  margin: 0 20px 10px;
  padding: 0 5px 0;
  font-size: 14px;
  line-height: 20px;
  color: #777
}

.inner,
.top-block,
.sub-block { margin: 10px 20px; padding-bottom: 15px }
.block { padding-bottom:30px }
.inner .content { background: #FFF; padding: 7px 10px; overflow: hidden }
.inner p,
.top-block p,
.sub-block p { padding-bottom:10px }
.inner a.linkcolor { padding: 0 !important }
.inner aside,
.inner .memo {
  border: 2px solid #EFEFEF;
  border-radius: 3px;
  margin-bottom: 7px;
  padding: 10px 10px 3px
}
.inner aside p,
.inner .memo p { font-size: 0.85714em; line-height: 1.75em }
.inner .linkmemo {
  border-radius: 3px;
  border: 1px solid #DEDEDE;
  padding: 3px
}
.inner .linkmemo a {
  padding: 8px 10px 8px 10px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  background-image: url(/dra/image/list_arrow.png);
  background-position: right center;
  background-repeat: no-repeat;
  text-decoration: none;
  color: #333
}
.inner .linkmemo a:after { display: none !important }

.newsmemo { padding: 5px 8px; margin-bottom: 15px }
.memoB { background-color: #F1F9FF; border: 1px dotted #1E9FFF }
.memoBno { background-color: #F1F9FF }
.memoR { background-color: #FEE; border: 1px dotted #F55 }
.memoRno { background-color: #FEE }
.memoY { background-color: #FFFFD9; border: 1px dotted #F0C000 }
.memoYno { background-color: #FFFFD9 }
.memoG { background-color: #ECFFEC; border: 1px dotted #00B000 }
.memoGno { background-color: #ECFFEC }
.memoGr,.memoD { background-color: #F7F7F7; border: 1px dotted #666 }
.memoGrno,.memoDno { background-color: #F7F7F7 }
/* == BG-HORIZON-LIST == */
.bg-horizon-list { clear: both; margin: 5px 0 20px; padding: 0 }
.bg-horizon-list ul { list-style: none;
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-flow: row nowrap
}
.bg-horizon-list ul li { margin-right: 1px; flex-grow: 1 }
.bg-horizon-list ul li:last-child { margin-right: 0 }
.bg-horizon-list ul li a {
  display: block;
  background-color: #00418D;
  color: #FFF;
  text-align: center;
  font-size: 16px;
  line-height: 1.9;
  border-top: #00418D 2px solid;
  border-bottom: #00418D 2px solid
}
.bg-horizon-list.noBg ul li a {
  background-color: transparent;
  color: #00418D;
  border:#00418D 1px solid
}
.bg-horizon-list ul li,
.bg-horizon-list.noBg ul li { border-bottom: none; border-top: none }
.bg-horizon-list ul li a,
.bg-horizon-list.noBg ul li a { padding: 0; min-height: inherit }
.bg-horizon-list ul li a:after,
.bg-horizon-list.noBg ul li a:after { display: none }
.bg-horizon-list ul li a:hover {
  text-decoration: none;
  background-color: #003579;
  border-top-color: #E5001B
}
.bg-horizon-list.noBg ul li a:hover {
  background-color: #00418D;
  color: #FFF;
  border:#00418D 1px solid
}
/* == /BG-HORIZON-LIST/ == */
.movie h2 { color: #333; background: none; margin: 0; padding: 0 }
.movie a,
.movie img,
.movie embed,
.movie video { display: block; margin: 0 auto; position: relative }
.movie .play {
  position: absolute;
  width: 300px;
  height: 225px;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.4) url(/dra/image/movie_play.png) center center no-repeat
}
.f70 { font-size: 75.0% }
.f80 { font-size: 81.3% }
.f90 { font-size: 93.8% }
.f100 { font-size: 100% }
.f115 { font-size: 116% }
.f125 { font-size: 125% }
.f150 { font-size: 150% }
.f180 { font-size: 183% }
.f200 { font-size: 200% }
.textBo { font-weight: bold }
.textRe { color: #F00 }
.textPi { color: #FD5C85 }
.textNv { color: #00418D }
.textBu { color: #06B }
.textGr { color: #999 }
.textG { color: #393 }
.textY { color: #F0A900 }
.textOr { color: #FF7F00 }
.textW { color: #FFF }
.textBl { color: #333 !important }
.textBoNv { font-weight: bold; color: #00418D }
.textBoBu { font-weight: bold; color: #06B }
.textBoRe { font-weight: bold; color: #F00 }
.textBoPi { font-weight: bold; color: #FD5C85 }
.textBoGr { font-weight: bold; color: #999 }
.textBoG { font-weight: bold; color: #393 }
.textBoY { font-weight: bold; color: #F09100 }
.textBoOr { font-weight: bold; color: #FF7F00 }
.textBoW { font-weight: bold; color: #FFF }
.textBoBl { font-weight: bold; color: #333 !important }
.textBoNo { font-weight: normal }
.bold { font-weight: bold }

/* == TICKET-SEASONALITY == */
*[class^="seasonalityBg-"] { display: block; font-weight: bold; letter-spacing: -1px }
.seasonalityBg-pre { background-color: #003378; color: #FFF }
.seasonalityBg-sta { background-color: #FFE000; color: #666 }
.seasonalityBg-val { background-color: #AAA; color: #FFF }
.seasonalityBg-dp { background-color: #CD2910; color: #FFF }
.seasonalityBg-op { background-color: #FF80BF; color: #FFF }
.seasonalityBg-local { background-color: #32AF00; color: #FFF }
/* == /TICKET-SEASONALITY == */
/* clearfix */
.clearfix:after { content: "."; display: block; clear: both; height: 0; visibility: hidden }
.clearfix { min-height: 1px }
* html .clearfix {
  height: 1px;
  /*\*/
  /*/
  height: auto;
  overflow: hidden;
  /**/
}
.clear { float: none; clear: both }
img.pre-icon { padding-right: 4px; vertical-align: middle }
.photo-l,
.photo-r,
.photo-c { display: block; position: relative }
.photo-l >img,
.photo-r >img,
.photo-c >img { display: block; margin: 0 auto; max-width: 100% }
.photo-l > p,
.photo-r > p,
.photo-c > p { display: block; font-size: 0.85714em; line-height: 1.75em; margin: 0 !important; color: #FFF; background: #333; padding: 3px }
.photo-r { float: right; margin: 10px 0 10px 10px }
.photo-l { float: left; margin: 10px 10px 10px 0 }
.photo-c { float: none; margin: 10px auto }
.photo-c img { margin: 0 auto }
ul { overflow: hidden; clear: both }
li { border-bottom: 1px solid #E0E0E0; display: block; line-height: 1.6 }
li.nolink {
  padding: 20px 10px;
  font-size: 1.14286em;
  line-height: 1.3125em;
  color: #888
}
.plain li { padding-top: 8px; padding-bottom: 8px }
.grouped ul {
  margin: 10px;
  border: 1px solid #CCC;
  border-radius: 3px;
  background: #FFF
}
.grouped li:first-child { border-top: none }
.grouped li:last-child { border-bottom: none }
.grouped li a { min-height: 40px }
.grouped li p,
.grouped li div { padding: 10px }
.grouped li img + p,
.grouped li div { padding: 0 }

.segmented { margin: 10px }
.segmented ul {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  overflow: visible
}
.segmented li {
  background-image: linear-gradient(#FFF, #EEE);
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0;
  margin: 0;
  border: 1px solid #CCC;
  border-left: none
}
.segmented li a {
  display: block;
  font-weight: bold;
  white-space: nowrap;
  background: none;
  width: 100%;
  min-height: 40px;
  padding-left: 0;
  padding-right: 0
}
.segmented li a:after { display: none }
.segmented li.on { background: #00418E }
.segmented li.on a { color: #FFF }
.segmented li:first-child {
  border-radius: 3px 0 0 3px;
  border-left: 1px solid #CCC
}
.segmented li:last-child { border-radius: 0 3px 3px 0 }

ul.tabMenu {
  display: table;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  overflow: visible;
  table-layout: fixed;
  width: 100%
}
ul.tabMenu li {
  display: table-cell;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 10px;
  margin: 0;
  border: 1px solid #CCC;
  border-left: none;
  height: 40px;
  min-height: 40px;
  vertical-align: middle;
  font-weight: bold;
  font-size: 1em
}
ul.tabMenu li a {
  display: block;
  font-weight: bold;
  background: none;
  width: 100%;
  min-height: initial;
  padding: 0;
  font-size: 1em
}
ul.tabMenu li a:after { display: none }
ul.tabMenu li.on { background: #00418E; color: #FFF }
ul.tabMenu li.on a { color: #FFF }
ul.tabMenu li:first-child {
  border-radius: 3px 0 0 3px;
  border-left: 1px solid #CCC
}
ul.tabMenu li:last-child { border-radius: 0 3px 3px 0 }
.thumblist li a p {
  font-size: min(4.2vw,16px);
  line-height: 1.6
}
.thumblist a,
.thumblist.noLink li {
  flex: none;
  text-decoration: none;
  color: #333
}
.thumblist.noLink.listBlur li { -ms-filter: blur(7px); filter: blur(7px) }
.thumblist.large a { align-items: flex-start }
.thumblist a > i,
.thumblist.large a > i,
.thumblist.noLink > i {
  width: 75px;
  height: 75px;
  display: flex;
  vertical-align: middle;
  text-align: center;
  border-collapse: separate;
  border-spacing: 2px 0;
  background-color: #DDD;
  justify-content: center;
  align-items: center;
  overflow: hidden
}
.thumblist.large a > i { width:140px; height:105px; align-items: flex-start; position:relative }
.thumblist a > i img,
.thumblist.large a > i img,
.thumblist.noLink i img {
  width: auto;
  height: 100%;
  margin: 0 auto;
  object-fit: cover
}
.thumblist.large a > i img {
  width: 140px;
  height: 105px;
  max-height: initial;
  max-width: initial;
  object-fit: cover;
  object-position: top
}
.thumblist.noLink > i,
.thumblist.noLink > i img { width: auto; min-height: 50px; max-height: 80px }
.thumblist a > i.off,
.thumblist.noLink i.off {
  background-image:url(//d1e44r1kkpuxcb.cloudfront.net/dra/image/2024/noImg16x9.jpg?0001);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover
}
.thumblist.large i.off { background-size:100% auto }
.thumblist a > i.fc,
.thumblist.noLink i.fc {
  background: #DDD url(/dra/image/2017/listImgLogo-fc.png) no-repeat center center;
  background-size: 50px auto
}
.thumblist a > i + p,
.thumblist.noLink i + p { margin-left: 10px }
#newspage .thumblist.noLink li > p,
.thumblist.noLink li > p {
  font-size:inherit;
  margin: inherit;
  padding-bottom: 0;
  display: table-cell;
  vertical-align: middle;
  padding: min(2.5vw,10px);
}
.thumblist.large a span { font-size:min(3vw,12px); margin-bottom:5px }
.thumblist.large a span.movie:after {
  font-family: "Font Awesome 6 Free";
  content:"\f03d";
  font-weight:900;
  padding-left: 5px
}
.thumblist span > i.muryo { display:inline-block; background-color:#c8e4ff; border-radius:5px; padding:2px 5px; box-sizing:border-box; color:#00418e; font-size:10px; margin-left:5px }
/*プッシュ通知リスト背景＆文言*/
@keyframes push {
  0% {opacity: 0;}
  100% {opacity: 1;}
}
.thumblist li.thisP { background-color: #fff8f9 }
.thumblist li.thisP p > span { display: flex; align-items: center }
.thumblist li.thisP p > span:before,
.thumblist li.thisP p > span:after { color: #d22d2a; display: inline-block; font-weight: bold; line-height: 1.2 }
.thumblist li.thisP p > span:before { font-family: 'Material Icons'; content: "\e645"; order: 1; font-size:min(5vw,17px); width:14px; text-align: center; animation: push 0.5s ease-in-out infinite alternate }
.thumblist li.thisP p > span:after { content: "プッシュ通知の記事はこちら"; order: 2; font-size:min(3.5vw,14px) }

.cal .day {
  border: 1px solid #E0E0E0;
  text-align: center;
  margin-right: 10px;
  padding: 0;
  flex: 1
}
.cal .day span {
  display: block;
  font-size: 10px;
  line-height: 1;
  padding: 3px 7px 5px;
  background: #EFEFEF
}
.cal .day p {
  padding: 2px 5px;
  font-size: 1.57143em;
  line-height: 0.95455em;
  line-height: 1
}
.cal .day.saturday span { background: #6CF; color: #FFF }
.cal .day.holiday span { background: #F66; color: #FFF }
.cal ul li p { flex: 5 }

.disc { list-style: disc outside none; padding: 0 0 10px 20px }
.decimal { list-style: decimal outside none; padding: 0 0 10px 20px }
.disc li,.decimal li {
  display: list-item;
  line-height: 1.5;
  border: none;
  font-size: 100%
}
.disc li:first-child,
.disc li:last-child,
.decimal li:first-child,
.decimal li:last-child { border: none }
.disc li span,.decimal li span { font-size: inherit; display: inline; line-height: inherit }
.disc li a,.decimal li a { padding: 0; margin: 0; min-height: 0; line-height: inherit; font-size: inherit }
/* == BUTTON == */
*[class^="button-"],
*[class*="-button"],
*[class*="_button"],
.link,
.button {
  text-align: center;
  margin: 10px auto;
  width: 99%;
  padding: 0;
  border-radius: 3px
}
*[class^="button-"] > a,
*[class*="-button"] > a,
*[class*="_button"] > a,
.link > a,
.button > a {
  font-size: 1.14286em;
  line-height: 1.3125em;
  text-decoration: none;
  display: block;
  color: #FFF;
  padding: 10px 0
}

/*botton circle*/
*[class^="button-"].circle,
.button.circle,
*[class^="button-"].circle > a,
.button.circle > a { border-radius: 50px }
/*botton line*/
*[class^="button-"].line,
.button.line,
*[class^="button-"].line > a,
.button.line > a { background-color: #FFF }
*[class^="button-"].line,
.button.line { border-width: 1px; border-style: solid }
/*botton round*/
*[class^="button-"].round,
.button.round,
*[class^="button-"].round > a,
.button.round > a { border-radius: 10px }
*[class^="button-"].line.round > a,
.button.round > a { border-radius: 9px }


/*botton 各指定*/
.link,
.button {
  background-image: linear-gradient(#FFF, #EEE);
  border: 1px solid #ccc;
  color: #333
}
.link > a,
.button > a { color: #333 }
.button.noLink { background: #EEE; color: #898989; padding: 10px 0; border:none }

.button-blue,.blue-button,.blue_button { border:#00AAEE 1px solid; background-color: #00AAEE }
.button-navy,.navy-button,.navy_button { border:#2743A0 1px solid; background-color: #2743A0 }
.button-red,.red-button,.red_button { border:#ed3f25 1px solid; background-color: #ed3f25 }
.button-appRed,.appRed-button,.appRed_button { border:var(--appRed-color) 1px solid; background-color:var(--appRed-color) }
.button-pink,.pink-button,.pink_button { border:#fd5c85 1px solid; background-color: #fd5c85 }
.button-green,.green-button,.green_button { border:#529d00 1px solid; background-color: #529d00 }
.button-yellow,.yellow-button,.yellow_button { border:#f4aa09 1px solid; background-color: #f4aa09 }
.button-orange,.orange-button,.orange_button { border:#f57800 1px solid; background-color: #f57800 }
.button-gray,.gray-button,.gray_button { border:#888 1px solid; background-color: #888 }
.button-navyBg {
  background-color: #093779;
  border: 2px solid #093779
}

.button-blue.shadow   { box-shadow: 0 3px #0073c5 }
.button-navy.shadow   { box-shadow: 0 3px #001e7b }
.button-red.shadow    { box-shadow: 0 3px #a21500 }
.button-pink.shadow   { box-shadow: 0 3px #d22d58 }
.button-green.shadow  { box-shadow: 0 3px #3e7304 }
.button-yellow.shadow { box-shadow: 0 3px #a77500 }
.button-orange.shadow { box-shadow: 0 3px #bb6612 }
.button-gray.shadow   { box-shadow: 0 3px #676565 }
.button.shadow        { box-shadow: 0 3px #9c9c9c }
.button-navyBg.shadow { box-shadow: 0 3px #001533 }

.button-blue.line   { border-color: #3EADFF; color: #3EADFF }
.button-navy.line   { border-color: #093779; color: #093779 }
.button-red.line    { border-color: #ed3f25; color: #ed3f25 }
.button-appRed.line { border-color:var(--appRed-color); color:var(--appRed-color) }
.button-pink.line   { border-color: #fd5c85; color: #fd5c85 }
.button-green.line  { border-color: #529d00; color: #529d00 }
.button-yellow.line { border-color: #f4aa09; color: #f4aa09 }
.button-orange.line { border-color: #f57800; color: #f57800 }
.button-gray.line   { border-color: #888; color: #888 }
.button.line        { border-color: #9c9c9c; color: #9c9c9c }
.button-navyBg.line { border-color: #001533; color: #001533 }
.button-blue.line > a   { color: #3EADFF }
.button-navy.line > a   { color: #093779 }
.button-red.line > a    { color: #ed3f25 }
.button-appRed.line > a { color:var(--appRed-color) }
.button-pink.line > a   { color: #fd5c85 }
.button-green.line > a  { color: #529d00 }
.button-yellow.line > a { color: #f4aa09 }
.button-orange.line > a { color: #f57800 }
.button-gray.line > a   { color: #888 }
.button.line > a        { color: #9c9c9c }
.button-navyBg.line > a { color: #001533 }

/* == /BUTTON == */
/*ボタン（白）*/
.btnWhiteWrap {
  list-style:none;
  padding-left:0;
  margin-bottom:20px
}
.btnWhiteWrap li {
  margin-left:0;
  float:left;
  width:32%;
  margin-right:2%;
  display:table;
  min-height:40px
}

.btnWhiteWrap li:last-child { margin-right:0 }
.btnWhiteWrap.btnWhiteLiM li { width:48% }
.btnWhiteWrap.btnWhiteLiS li { width:32% }
.btnWhiteWrap li a {
  display:table-cell;
  vertical-align:middle;
  text-align:center;
  color:#36C;
  border:solid 2px #BCDFFB;
  font-weight:bold;
  font-size:100%;
  line-height:1.2;
  letter-spacing:-2px;
  padding: 0
}
.btnWhiteWrap li a:hover { text-decoration:underline }
.btnWhiteWrap li a:after { display: none }

p.q:before {
  content: "Q.";
  color: #00418E;
  font-weight: bold
}
p.a { margin-bottom: 1.5em }
p.a:before { content: "A."; color: #F66; font-weight: bold }
span.q { color: #00418E; font-weight: bold; display: inline-block; font-size: inherit }
span.q:before { content: "Q" }
span.a { color: #F66; font-weight: bold; display: inline-block; font-size: inherit }
span.a:before { content: "A" }

.qr { display: inline }

#map_container { height: 250px }
#map_canvas { width: 100%; height: 100% }

.full-image { width: 100%; box-sizing:border-box }
.wallpaper-sample {
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 300px 230px;
  width: 100%;
  height: 230px
}
.bold { font-weight: bold }
.saturday,
.Sat,
ul.textKome li span.Sat,
li span.saturday,
li span.Sat { color: #5BE }
.holiday,
.Holi,
ul.textKome li span.Holi,
li span.holiday,
li span.Holi { color: #F66 }
.text-l,
.date-l,
.left { text-align: left }
.text-r,
.date-r,
.right { text-align: right }
.text-c,
.date-c,
.center { text-align: center }

.date-l,
.date-r { font-size: 0.85714em; line-height: 1.75em; margin-bottom: 5px }

hr {
  border: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.5);
  box-shadow: rgba(0, 0, 0, 0.1) 0 1px 0
}

.blue-line { border-top: 3px solid #00418E }
.head-banner a,
.head-banner img,
.ad a,
.ad img { display: block }

.ad img { height: auto !important; margin: 0 auto }

.head-banner { position: relative; z-index: 100; max-height: 50px; background: white }
.head-banner img { max-width: 100%; margin: 0 auto }
.head-banner .ad img { width: auto !important; height: auto !important }
.playerphoto_s { margin: auto 10px; text-align: center }

#grade { overflow: hidden }
#grade .playerphoto { margin-top: 2px }
#grade .playerphoto img { display: block; margin: 0 auto }
#grade .parsondate { padding: 0 5px }
#grade .parsondate span { color: #00418E }

*[class*="text-icon"]:before { content: "■"; font-size:1.3em }
.text-icon:before   { color: #00418D }
.text-iconB:before  { color: #1976D2 }
.text-iconR:before  { color: #F00 }
.text-iconP:before  { color: #FD5C85 }
.text-iconY:before  { color: #FC0 }

.text-iconD:before  { color: #666 }
.text-iconG:before  { color: #35AA35 }
.text-iconOr:before { color: #FF7F00 }
.mg0 { margin: 0 !important }
.mg5 { margin: 5px !important }
.mg10 { margin: 10px !important }
.mg15 { margin: 15px !important }
.mg20 { margin: 20px !important }
.mg25 { margin: 25px !important }
.mg30 { margin: 30px !important }
.mg35 { margin: 35px !important }
.mg40 { margin: 40px !important }
.mg50 { margin: 50px !important }
.mg60 { margin: 60px !important }
.mg70 { margin: 70px !important }
.mg80 { margin: 80px !important }
.mg90 { margin: 90px !important }
.mg100 { margin: 100px !important }
.marginbtm0,.mgB0 { margin-bottom: 0 !important }
.marginbtm5,.mgB5 { margin-bottom: 5px !important }
.marginbtm10,.mgB10 { margin-bottom: 10px !important }
.marginbtm15,.mgB15 { margin-bottom: 15px !important }
.marginbtm20,.mgB20 { margin-bottom: 20px !important }
.marginbtm25,.mgB25 { margin-bottom: 25px !important }
.marginbtm30,.mgB30 { margin-bottom: 30px !important }
.marginbtm30,.mgB35 { margin-bottom: 35px !important }
.marginbtm40,.mgB40 { margin-bottom: 40px !important }
.marginbtm50,.mgB50 { margin-bottom: 50px !important }
.mgB60 { margin-bottom: 60px !important }
.mgB70 { margin-bottom: 70px !important }
.mgB80 { margin-bottom: 80px !important }
.mgB90 { margin-bottom: 90px !important }
.mgB100 { margin-bottom: 100px !important }
.mgT0 { margin-top: 0 !important }
.mgT5 { margin-top: 5px !important }
.mgT10 { margin-top: 10px !important }
.mgT15 { margin-top: 15px !important }
.mgT20 { margin-top: 20px !important }
.mgT25 { margin-top: 25px !important }
.mgT30 { margin-top: 30px !important }
.mgT35 { margin-top: 35px !important }
.mgT40 { margin-top: 40px !important }
.mgT50 { margin-top: 50px !important }
.mgT60 { margin-top: 60px !important }
.mgT70 { margin-top: 70px !important }
.mgT80 { margin-top: 80px !important }
.mgT90 { margin-top: 90px !important }
.mgT100 { margin-top: 100px !important }
.mgL0 { margin-left: 0 !important }
.mgL5 { margin-left: 5px !important }
.mgL10 { margin-left: 10px !important }
.mgL15 { margin-left: 15px !important }
.mgL20 { margin-left: 20px !important }
.mgL25 { margin-left: 25px !important }
.mgL30 { margin-left: 30px !important }
.mgL35 { margin-left: 35px !important }
.mgL40 { margin-left: 40px !important }
.mgL50 { margin-left: 50px !important }
.mgL60 { margin-left: 60px !important }
.mgL70 { margin-left: 70px !important }
.mgL80 { margin-left: 80px !important }
.mgL90 { margin-left: 90px !important }
.mgL100 { margin-left: 100px !important }
.mgR0 { margin-right: 0 !important }
.mgR5 { margin-right: 5px !important }
.mgR10 { margin-right: 10px !important }
.mgR15 { margin-right: 15px !important }
.mgR20 { margin-right: 20px !important }
.mgR25 { margin-right: 25px !important }
.mgR30 { margin-right: 30px !important }
.mgR35 { margin-right: 35px !important }
.mgR40 { margin-right: 40px !important }
.mgR50 { margin-right: 50px !important }
.mgR60 { margin-right: 60px !important }
.mgR70 { margin-right: 70px !important }
.mgR80 { margin-right: 80px !important }
.mgR90 { margin-right: 90px !important }
.mgR100 { margin-right: 100px !important }
.pd0 { padding: 0 !important }
.pd5 { padding: 5px !important }
.pd10 { padding: 10px !important }
.pd15 { padding: 15px !important }
.pd20 { padding: 20px !important }
.pd25 { padding: 25px !important }
.pd30 { padding: 30px !important }
.pd35 { padding: 35px !important }
.pd40 { padding: 40px !important }
.pd50 { padding: 50px !important }
.pd60 { padding: 60px !important }
.pd70 { padding: 70px !important }
.pd80 { padding: 80px !important }
.pd90 { padding: 90px !important }
.pd100 { padding: 100px !important }
.pdT0 { padding-top: 0 !important }
.pdT5 { padding-top: 5px !important }
.pdT10 { padding-top: 10px !important }
.pdT15 { padding-top: 15px !important }
.pdT20 { padding-top: 20px !important }
.pdT25 { padding-top: 25px !important }
.pdT30 { padding-top: 30px !important }
.pdT35 { padding-top: 35px !important }
.pdT40 { padding-top: 40px !important }
.pdT50 { padding-top: 50px !important }
.pdT60 { padding-top: 60px !important }
.pdT70 { padding-top: 70px !important }
.pdT80 { padding-top: 80px !important }
.pdT90 { padding-top: 90px !important }
.pdT100 { padding-top: 100px !important }
.pdR0 { padding-right: 0 !important }
.pdR5 { padding-right: 5px !important }
.pdR10 { padding-right: 10px !important }
.pdR15 { padding-right: 15px !important }
.pdR20 { padding-right: 20px !important }
.pdR25 { padding-right: 25px !important }
.pdR30 { padding-right: 30px !important }
.pdR35 { padding-right: 35px !important }
.pdR40 { padding-right: 40px !important }
.pdR50 { padding-right: 50px !important }
.pdR60 { padding-right: 60px !important }
.pdR70 { padding-right: 70px !important }
.pdR80 { padding-right: 80px !important }
.pdR90 { padding-right: 90px !important }
.pdR100 { padding-right: 100px !important }
.pdB0 { padding-bottom: 0 !important }
.pdB5 { padding-bottom: 5px !important }
.pdB10 { padding-bottom: 10px !important }
.pdB15 { padding-bottom: 15px !important }
.pdB20 { padding-bottom: 20px !important }
.pdB25 { padding-bottom: 25px !important }
.pdB30 { padding-bottom: 30px !important }
.pdB35 { padding-bottom: 35px !important }
.pdB40 { padding-bottom: 40px !important }
.pdB50 { padding-bottom: 50px !important }
.pdB60 { padding-bottom: 60px !important }
.pdB70 { padding-bottom: 70px !important }
.pdB80 { padding-bottom: 80px !important }
.pdB90 { padding-bottom: 90px !important }
.pdB100 { padding-bottom: 100px !important }
.pdL0 { padding-left: 0 !important }
.pdL5 { padding-left: 5px !important }
.pdL10 { padding-left: 10px !important }
.pdL15 { padding-left: 15px !important }
.pdL20 { padding-left: 20px !important }
.pdL25 { padding-left: 25px !important }
.pdL30 { padding-left: 30px !important }
.pdL35 { padding-left: 35px !important }
.pdL40 { padding-left: 40px !important }
.pdL50 { padding-left: 50px !important }
.pdL60 { padding-left: 60px !important }
.pdL70 { padding-left: 70px !important }
.pdL80 { padding-left: 80px !important }
.pdL90 { padding-left: 90px !important }
.pdL100 { padding-left: 100px !important }

.w80 { width: 80px }
.w160 { width: 160px }
.w200 { width: 200px }
.w240 { width: 240px }
.w300 { width: 300px }
.w320 { width: 320px }
.vw90 { width: min(90vw,740px) }

.smaller { font-size: 0.85714em !important; line-height: 1.75em !important }
.larger { font-size: 1.14286em !important; line-height: 1.3125em !important }

.f10 { font-size: 0.71429em !important; line-height: 2.1em !important }
.f11 { font-size: 0.78571em !important; line-height: 1.90909em !important }
.f12 { font-size: 0.85714em !important; line-height: 1.75em !important }
.f13 { font-size: 0.92857em !important; line-height: 1.61538em !important }
.f14 { font-size: 1em !important;       line-height: 1.5em !important }
.f15 { font-size: 1.07143em !important; line-height: 1.4em !important }
.f16 { font-size: 1.14286em !important; line-height: 1.3125em !important }
.f17 { font-size: 1.21429em !important; line-height: 1.23529em !important }
.f18 { font-size: 1.28571em !important; line-height: 1.16667em !important }
.f19 { font-size: 1.35714em !important; line-height: 1.10526em !important }
.f20 { font-size: 1.42857em !important; line-height: 1.05em !important }
.f22 { font-size: 1.57143em !important; line-height: 0.95455em !important }
.f24 { font-size: 1.71429em !important; line-height: 0.875em !important }
.lh125 { line-height: 125% !important }
.lh13  { line-height: 130% !important }
.lh14  { line-height: 140% !important }
.lh15  { line-height: 150% !important }
.lh16  { line-height: 160% !important }
.lh17  { line-height: 170% !important }
.lh18  { line-height: 180% !important }
.lh19 { line-height: 19px }
.lh20 { line-height: 20px }
.lh21 { line-height: 21px }
.lh22 { line-height: 22px }
.lh23 { line-height: 23px }
.lh24 { line-height: 24px }
.lh25 { line-height: 25px }
.lh26 { line-height: 26px }
.lh27 { line-height: 27px }
.lh28 { line-height: 28px }
.lh29 { line-height: 29px }
.lh30 { line-height: 30px }
ul.textKome { margin: 0; padding: 0 0 0 1.2em; list-style: none }
ul.textKome li { border:none }
ul.textKome li:before { content: "※"; color: #F00; margin-left: -1.2em; margin-right: 0.2em; display: inline-block }
ul.textKome li span { font-size:inherit; line-height:initial; display:inline; color: #333 }
ul.textKome li.textRe span,
ul.textKome li span.textRe {color:#F00 }
ul.textKome li a { padding: 0; display: inline; min-height: initial; font-size: inherit; line-height: initial; color: #36C }
ul.textKome li a:after { display: none }
ul.noList { margin:0; padding:0; list-style:none }

.row { width: 100%; overflow: hidden }
.row div[class^="col"] {
  box-sizing: border-box;
  display: block;
  float: left;
  background: inherit;
  padding: 0;
  margin: 0
}
.row .col,
.row .col-quarter { width: 25% }
.row .col-two-thirds { width: 66.6% }
.row .col-two-thirds:last-child { width: 66.7% }
.row .col-thirds { width: 33.3% }
.row .col-thirds:last-child { width: 33.4% }
.row .col-half { width: 50% }
.row .col-three-quarter { width: 75% }
.row .col-full { width: 100% }

section.error {
  text-align: center;
  border: 1px solid #CCC;
  border-radius: 3px;
  margin: 20px;
  background-image: linear-gradient(#FFF, #EEE)
}
section.error h2 {
  color: red;
  background: none;
  padding: 50px 0 20px 0;
  margin: 0 10px;
  font-size: 1.28571em;
  line-height: 1.16667em
}
section.error p { padding: 0 10px 50px 10px; text-align: center }

.prettyprint { margin: 10px; font-size: 12px; overflow: auto }

table { width: 100%; border: 1px solid #CCC }
table th, table td { border: 1px solid #CCC; text-align: center; padding: 5px }
table th { background-color: #DEF }
table .bg-red { background-color: #ffdfdf }
table .bg-blue { background-color: #DEF }
table .bg-gray { background-color: #DDD }
table .left { text-align: left }
table .right { text-align: right }
table .soldout { color: red }
table.stripe tr:nth-child(2n) { background-color: #FFF }
table.stripe tr:nth-child(2n+1) { background-color: #E0E0E0 }
table th.top,
table td.top { vertical-align: top }
table th.middle,
table td.middle { vertical-align: middle }
table th.bottom,
table td.bottom { vertical-align: bottom }
table.noBorder { border-collapse:collapse; border:none; border-spacing:0 }
table.noBorder th,table.noBorder td{ border:none }
table.noBorder th.w50,table.noBorder td.w50{ width:50% }
#schedule table { font-size: 1.07143em; line-height: 1.4em }
#schedule table td { padding: 5px 0 5px 0; height: 40px }
#schedule table span {
  margin-top: 2px;
  display: block;
  color: #888;
  font-size: 0.71429em;
  line-height: 2.1em;
  line-height: 10px
}
#schedule table a, #schedule table a:visited { color: #36C; text-decoration: none }

#game .gamedate,
.game .gamedate { line-height: 1.3 }
#game .stop,
.game .stop {
  text-align: center;
  font-size: 1.14286em;
  line-height: 1.3125em;
  font-weight: bold;
  color: #FFF;
  background: red;
  border-radius: 3px;
  padding: 10px
}
#game .versus table,
.game .versus table { margin: 0 auto }
#game .versus th, #game .versus td,
.game .versus th,
.game .versus td { padding: 5px 8px; border: none }
#game .versus th,
.game .versus th { background-color: #FFF; font-size: 1.42857em; line-height: 1.05em }
#game .versus td,
.game .versus td { text-align: left; border: none }
#game .order table,
.game .order table { border: 1px solid #CCC }
#game .order table a,
.game .order table a { color: #36C }
#game .order table a:visited,
.game .order table a:visited { color: #36C }
#game .order th, #game .order td,
.game .order th,
.game .order td { border: 1px solid #CCC; padding: 5px 0 }
#game .order td,
.game .order td { font-size: 1.14286em; line-height: 1.3125em; text-align: left; line-height: 1.7 }
#game .result,
.game .result { padding-right: 0 }
#game .result table,
.game .result table { border: 1px solid #CCC }
#game .result th, #game .result td,
.game .result th,
.game .result td { border: 1px solid #CCC; padding: 5px 2px; text-align: left }
#game .result th, #game .result .score,
.game .result th,
.game .result .score { text-align: center }

.scoreboard { padding-right: 0 }
.scoreboard table { border: none }
.scoreboard th,
.scoreboard td {
  font-size: 0.78571em;
  line-height: 1.90909em;
  text-align: center;
  color: #FFF;
  border: none
}
.scoreboard th:last-child,
.scoreboard td:last-child { border-right: none }
.scoreboard th {
  padding-top: 4px;
  padding-bottom: 5px;
  background-color: #4F4F4F;
  border-right: 1px solid #666
}
.scoreboard td {
  padding-top: 5px;
  padding-bottom: 6px;
  background-color: #000;
  border-top: 1px solid #666;
  border-right: 1px solid #666
}
.scoreboard tr:first-child th:first-child { border-top-left-radius: 3px }
.scoreboard th:last-child { border-top-right-radius: 3px }
.scoreboard tr:last-child td:first-child { border-bottom-left-radius: 3px }
.scoreboard tr:last-child td:last-child { border-bottom-right-radius: 3px }

#menu_layer {
  position: absolute;
  top: -1000px;
  left: 0;
  width: 100%;
  height: auto;
  z-index: -1;
  box-sizing: border-box;
  background: #00418E;
  color: white;
  transition-property: top;
  transition-duration: 0.3s;
  transition-timing-function: ease;
  transition-delay: 0
}
.state-menu-show header .menu { background-color: #00418E }
.state-menu-show header .menu a,
.state-menu-show header .menu i { color: #FFF; text-decoration: none }
.state-menu-show #menu_layer { top: 60px; z-index: 10000 }
.state-menu-hide #menu_layer { top: -1000px; z-index: 200 }
.has-head-banner.state-menu-show #menu_layer { top: 120px !important }
#menu_layer ul { padding:0 0.5em 1em }
#menu_layer ul li a {
  display:flex;
  color:#FFF;
  padding:10px;
  font-weight:bold;
  align-items: center;
  justify-content: space-between;
  box-sizing:border-box;
  border-bottom:#CCC 1px solid
}

.list-group { overflow: hidden }
.list-item > a,
.list-item > div { min-height: 56px; width: 100%; font-size: 14px; position: relative }
.list-item > a > div,
.list-item > div > div { display: flex; flex: 1 }
.planList .list-item a p { display: inline-block; flex: 1 }
.planList .list-item a p > span { font-size: 11px }
.list-item > a span,
.list-item > div span { display: block }
.list-item > a > img,
.list-item > div img { display: block; margin-right: 10px }
.list-item:nth-child(2n) { background: #E8E8E8 }
.list-item a { color: #445066; text-decoration: none }
@-webkit-keyframes top-page-notification {
  0% { text-indent: 120% }
  100% { text-indent: -150% }
}
@keyframes top-page-notification {
  0% { text-indent: 120% }
  100% { text-indent: -150% }
}

.main-information .list-item img { display: block; float: left; margin-right: 5px }

.main-menu .list-item { width: 50%; float: left }
.main-menu .list-item > div,
.main-menu .list-item > a {
  justify-content: center;
  text-align: center;
  background: #ebebeb;
  text-decoration: none
}
.main-menu .list-item:nth-child(4n+1) > div,
.main-menu .list-item:nth-child(4n+1) > a,
.main-menu .list-item:nth-child(4n) > div,
.main-menu .list-item:nth-child(4n) > a { background: white }
.main-menu .list-item i {
  font-size: 0.71429em;
  line-height: 2.1em;
  display: block;
  color: rgba(0, 51, 119, 0.6);
  line-height: 1.2
}
.main-menu.footMenu { border-top:#ebebeb 1px solid; border-bottom:#ebebeb 1px solid }

.playbackgallery { overflow: hidden }
.playbackgallery .list-item { width: 25%; float: left }
.playbackgallery .list-item > a,
.playbackgallery .list-item > div {
  background: #00418E;
  margin-bottom: 2px;
  border-right: 2px solid white;
  justify-content: center;
  text-align: center;
  padding: 8px 4px
}
.playbackgallery .list-item > a > img,
.playbackgallery .list-item > div img { margin: 0 }
.playbackgallery .list-item:nth-child(4n) > div,
.playbackgallery .list-item:nth-child(4n) > a { border-right: none }
.player-movie .list-item:last-child { text-align: center }
.player-movie .list-item img { display: block; float: left; margin-right: 5px }
.player-movie .list-item span { display: block; width: 100% }
.blog .list-item { width: 50%; float: left }
.blog .list-item > a,
.blog .list-item > div { border: 2px solid #CCC }
.blog .list-item:nth-child(2n) > div,
.blog .list-item:nth-child(2n) > a { background: #FFF }
.blog .list-item a[target="_blank"]:after {
  width: 38px;
  height: 38px;
  background-repeat: no-repeat;
  background-image: url("/dra/image/2014/bg_external_gray.png");
  background-size: 38px 38px;
  position: absolute;
  content: "";
  bottom: 0;
  right: 0
}
.page { margin-top: 1px; margin-bottom: 1px }
.page ul { width: 100%; overflow: hidden; clear: both }
.page li {
  border: none;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50%;
  float: left;
  min-height: 40px;
  box-sizing: border-box;
  background: #00418E
}
.page li:first-child,
.page li:last-child { width: 25%; border: none !important }
.page li.info { border-left: 1px solid white; border-right: 1px solid white; color: white }
.page li a {
  display: inline;
  min-height: 1em;
  box-sizing: border-box;
  padding: 0;
  background-repeat: no-repeat;
  background-size: 7.5px 15px;
  color: white
}
.page li a:after { display: none }
.page li:first-child a { background-image: url(/dra/image/arrow_left.png); background-position: left center; padding-left: 12px }
.page li:last-child a { background-image: url(/dra/image/arrow_right.png); background-position: right center; padding-right: 12px }
.page li > span { display: none }
.page li .disable { display: none }
.page li span { font-size: 14px; color: inherit }
.page.pdT15 { padding-top: 0 !important }
.page.pdB15 { padding-bottom: 0 !important }

.top-page-main-photo-carousel .item { position: relative }
.top-page-main-photo-carousel .caption {
  background: rgba(0, 0, 0, 0.6);
  bottom: 0;
  color: white;
  font-size: 12px;
  left: 0;
  padding: 5px 5px 12px 5px;
  position: absolute;
  right: 0;
  text-align: left
}
.top-page-main-photo-carousel .title { margin-bottom: 5px }
.top-page-main-photo-carousel .owl-dots {
  bottom: 4px;
  outline: #f00;
  position: absolute;
  right: 10px
}
.top-page-main-photo-carousel .owl-dot {
  background-color: white;
  float: left;
  height: 6px;
  margin-left: 4px;
  width: 6px
}
.top-page-main-photo-carousel .owl-dot.active { background-color: #17F }

.carousel {
  position: relative;
  margin: 0;
  padding: 0;
  line-height: 1;
  width: 100%;
  overflow: hidden
}

.carousel-inner {
  position: relative;
  width: 100%;
  height: auto;
  transition-duration: 0.3s;
  transition-timing-function: linear;
  overflow: hidden
}
.carousel-inner > .item {
  position: relative;
  display: none;
  top: 0;
  transition-property: left;
  transition-duration: 0.3s;
  transition-timing-function: linear
}
.carousel-inner > .item > a { display: block }
.carousel-inner > .item > img,
.carousel-inner > .item > a > img { height: auto; max-width: 100%; vertical-align: middle; border: 0 }
.carousel-inner > .item .caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  text-align: left;
  background: rgba(0, 0, 0, 0.6);
  color: white;
  padding: 5px 5px 12px 5px;
  font-size: 0.85714em;
  line-height: 1.75em
}
.carousel-inner > .item .caption .title { margin-bottom: 5px }
.carousel-inner > .active,
.carousel-inner > .next,
.carousel-inner > .prev { display: block }
.carousel-inner > .active { left: 0 }
.carousel-inner > .active.left { left: -100% }
.carousel-inner > .active.right { left: 100% }
.carousel-inner > .next,
.carousel-inner > .prev { position: absolute; top: 0; width: 100% }
.carousel-inner > .next { left: 100% }
.carousel-inner > .next.left { left: 0% }
.carousel-inner > .prev { left: -100% }
.carousel-inner > .prev.right { left: 0% }

.carousel-hole {
  position: absolute;
  right: 2%;
  bottom: 0;
  z-index: 10;
  overflow: hidden;
  text-align: center
}
.carousel-hole ol { display: inline-block; overflow: hidden; padding: 2px }
.carousel-hole li {
  width: 6px;
  height: 6px;
  background: white;
  display: block;
  float: left;
  margin: 0 2px;
  border: none
}
.carousel-hole li:first-child { border: none }
.carousel-hole li.active { background: #17F }

.carousel-control {
  position: absolute;
  display: block;
  bottom: 3%;
  font-size: 2.5em;
  width: 1.1em;
  text-align: center;
  background: rgba(0, 20, 50, 0.8);
  border-radius: 8px
}
.carousel-control.prev,
.carousel-control.next { color: white }
.carousel-control.prev { left: 10px }
.carousel-control.next { right: 10px }

.no-transition { transition: none }
.no-transition > .item { transition: none }
.translate-mode { overflow: visible }

/*
 *  Owl Carousel - Animate Plugin
 */
.owl-carousel .animated { animation-duration: 1000ms; animation-fill-mode: both }
.owl-carousel .owl-animated-in { z-index: 0 }
.owl-carousel .owl-animated-out { z-index: 1 }
.owl-carousel .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut }
@-webkit-keyframes fadeOut {
  0% { opacity: 1 }
  100% { opacity: 0 }
}
@keyframes fadeOut {
  0% { opacity: 1 }
  100% { opacity: 0 }
}
/*
 * 	Owl Carousel - Auto Height Plugin
 */
.owl-height { transition: height 500ms ease-in-out }
/*
 *  Core Owl Carousel CSS File
 */
.owl-carousel {
  display: none;
  width: 100%;
  position: relative;
  z-index: 1
}
.owl-carousel .owl-stage {
  position: relative;
  -ms-touch-action: pan-Y
}
.owl-carousel .owl-stage:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0
}
.owl-carousel .owl-stage-outer {
  position: relative;
  overflow: hidden;
  /* fix for flashing background */
  -webkit-transform: translate3d(0px, 0, 0)
}
.owl-carousel .owl-controls .owl-nav .owl-prev,
.owl-carousel .owl-controls .owl-nav .owl-next,
.owl-carousel .owl-controls .owl-dot {
  cursor: pointer;
  cursor: hand;
  user-select: none
}
.owl-carousel.owl-loaded { display: block }
.owl-carousel.owl-loaded img { width: 100%; display: block }
.owl-carousel.owl-loading { opacity: 0; display: block }
.owl-carousel.owl-hidden { opacity: 0 }
.owl-carousel .owl-refresh .owl-item { display: none }
.owl-carousel .owl-item {
  position: relative;
  min-height: 1px;
  float: left;
  -webkit-backface-visibility: hidden;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}
.owl-carousel .owl-item img {
  display: block;
  width: 100%;
  -webkit-transform-style: preserve-3d
}

.owl-carousel.owl-text-select-on .owl-item { user-select: auto }
.owl-carousel .owl-grab {
  cursor: move;
  cursor: -o-grab;
  cursor: -ms-grab;
  cursor: grab
}
.owl-carousel.owl-rtl { direction: rtl }
.owl-carousel.owl-rtl .owl-item { float: right }
/* No Js */
.no-js .owl-carousel { display: block }
/*
 * 	Owl Carousel - Lazy Load Plugin
 */
.owl-carousel .owl-item .owl-lazy { opacity: 0; transition: opacity 400ms ease }
.owl-carousel .owl-item img { transform-style: preserve-3d }
/*
 * 	Owl Carousel - Video Plugin
 */
.owl-carousel .owl-video-wrapper {
  position: relative;
  height: 100%;
  background: #000
}
.owl-carousel .owl-video-play-icon {
  position: absolute;
  height: 80px;
  width: 80px;
  left: 50%;
  top: 50%;
  margin-left: -40px;
  margin-top: -40px;
  background: url("owl.video.play.png") no-repeat;
  cursor: pointer;
  z-index: 1;
  -webkit-backface-visibility: hidden;
  transition: scale 100ms ease
}
.owl-carousel .owl-video-play-icon:hover { transition: scale(1.3, 1.3) }
.owl-carousel .owl-video-playing .owl-video-tn,
.owl-carousel .owl-video-playing .owl-video-play-icon { display: none }
.owl-carousel .owl-video-tn {
  opacity: 0;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: contain;
  background-size: contain;
  transition: opacity 400ms ease
}
.owl-carousel .owl-video-frame { position: relative; z-index: 1 }

@-webkit-keyframes blink {
  0% { opacity: 0 }
  40%, 50%, 60% { opacity: 1 }
  100% { opacity: 0 }
}
@keyframes blink {
  0% { opacity: 0 }
  40%, 50%, 60% { opacity: 1 }
  100% { opacity: 0 }
}

.live-container #scoreboard table,
.live-container #bso table,
.live-container #zone table { border: none; line-height: 1; font-size: 100% }
.live-container #scoreboard td,
.live-container #bso td,
.live-container #zone td,
.live-container #scoreboard th,
.live-container #bso th,
.live-container #zone th { border: none; padding: 0 }

.live-container { color: #333 }
.live-container hr {
  display: block;
  position: relative;
  margin: 0 0 10px 0;
  padding: 10px 0 0 0;
  height: 0;
  width: 100%;
  border: none;
  border-bottom: 1px solid #575757
}
.live-container b { display: block; font-weight: bold }
.live-container .blink {
  color: #FFF82f;
  -webkit-animation-name: "blink";
  -webkit-animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease-in-out;
  -moz-animation-name: "blink";
  -moz-animation-duration: 2s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: ease-in-out
}
.live-container .row { position: relative; margin-bottom: 5px }
.live-container .col { width: 50%; float: left }
.live-container .title {
  font-size: 12px;
  background: none;
  width: auto;
  height: auto;
  line-height: 1.3;
  color: black;
  font-weight: normal
}
.live-container .control { overflow: hidden; margin-bottom: 5px }
.live-container .control a {
  display: block;
  width: 33%;
  margin-right: 0.5%;

  float: left;
  color: white;
  background: #00418E;
  text-align: center;
  padding: 5px 0;
  font-size: 12px
}
.live-container .control a:last-child { margin-right: 0 }
.live-container .control .auto-reload.state-run { background-color: rgba(0, 51, 119, 0.7) }
.live-container .control .auto-reload.state-stop { background-color: #00418E }
.live-container #scoreboard { margin-bottom: 5px }
.live-container #scoreboard th,
.live-container #scoreboard td { color: white; border-left: 1px solid #888; border-bottom: 1px solid #888; font-size: 10.5px }
.live-container #scoreboard th:first-child,
.live-container #scoreboard td:first-child { border-left: none }
.live-container #scoreboard th { background: #666; height: 25px; min-width: 14px }
.live-container #scoreboard td { background: #333; height: 30px }
.live-container #bso { overflow: hidden }
.live-container #bso dl { width: 54px; display: block; float: left }
.live-container #bso dt { padding-left: 9px }
.live-container #bso dd { padding-left: 5px; border-left: 4px solid #CCC; margin-bottom: 4px; line-height: 1 }
.live-container #bso dd:last-child { margin-bottom: 0 }
.live-container #bso .a { border-left-color: white }
.live-container #bso table {
  border-collapse: separate;
  border-spacing: 2px 6px;
  margin-top: -5px;
  width: auto;
  display: block;
  float: left
}
.live-container #bso th { font-weight: bold; font-size: 12px }
.live-container #bso .strike span { background: #F90 }
.live-container #bso .out span { background: red }
.live-container #runner img,
.live-container #runner ul { display: block; float: left }
.live-container #runner ul { clear: none; margin-left: 5px; width: 91px }
.live-container #runner li {
  border: none;
  font-size: 12px;
  white-space: normal;
  display: block;
  line-height: 1.4
}
.live-container #zone { position: relative }
.live-container #zone .player-shape { width: 25%; position: absolute; bottom: 0; height: 79px }
.live-container #zone .player-shape.right { right: 0 }
.live-container #zone .player-shape.right i {
  width: 22px;
  height: 79px;
  background-repeat: no-repeat;
  background-image: url("/dra/image/live/player_r.png");
  -webkit-background-size: 22px 79px;
  background-size: 22px 79px
}
.live-container #zone .player-shape.left { left: 0 }
.live-container #zone .player-shape.left i {
  width: 22px;
  height: 79px;
  background-repeat: no-repeat;
  background-image: url("/dra/image/live/player_l.png");
  -webkit-background-size: 22px 79px;
  background-size: 22px 79px
}
.live-container #zone .player-shape i { display: block; margin: 0 auto }
.live-container #zone table { width: auto; border-collapse: separate; border-spacing: 1px; margin: 0 auto }
.live-container #zone th,
.live-container #zone td { width: 15px; height: 15px; background: #c3c3c3 }
.live-container #zone th.in,
.live-container #zone td.in { background: white }
.live-container #zone th span,
.live-container #zone td span {
  font-family: Helvetica, Arial, sans-serif;
  display: block;
  width: 14px;
  height: 14px;
  text-align: center;
  -webkit-mask-box-image: url(/dra/image/mask_circle.png);
  background: white;
  color: #333;
  font-size: 12px
}
.live-container #player_info { color: white; background: rgba(0, 51, 119, 0.7); font-size: 12px; margin-bottom: 5px }
.live-container #player_info ul,
.live-container #player_info li { border: none }
.live-container #player_info li {
  width: 50%;
  display: block;
  float: left;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 5px
}
.live-container #player_info img {display: block;float: left;margin-right: 5px;margin-top: 2px }
.live-container #player_info .icon,
.live-container #player_info .name,
.live-container #player_info .stat {display: inline-block;color: white;line-height: 1.2 }
.live-container #player_info .icon {text-align: center;background: #0065ec;font-size: 10px;width: 12px;padding: 1px }
.live-container #player_info .name {font-size: 12px }

.live-container #player_info .stat {display: block;font-size: 10px }
.live-container .tab-menu:before,
.live-container .tab-menu:after {content: none;display: table }
.live-container .tab-container {
  box-sizing: border-box;
  font-size: 14px;
  width: 100%;
  padding: 5px;
  margin-bottom: 20px;
  border: 1px solid #00418E
}
.live-container .tab-container .state-show {display: block }
.live-container .tab-container .state-hidden {display: none }
.live-container #order {overflow: hidden }
.live-container #order > div {width: 50%;float: left }
.live-container .data-provider {margin-bottom: 6px;font-size: 10px;text-align: right }

.contents #regist .playersCat { padding-top: 10px }
.contents #regist .playersCat .players { width: 83px; float: left; text-align: center; min-height: 115px }
.contents #regist .playersCat .players p { font-size: 90%; line-height: 1.1em }
#videocontainer,
#videocontainer embed,
#videocontainer video { max-width: 100%; height: auto }
/* カテゴリTOP　2017 */
/* list */
#categoryTop li { border-color: #08214A }
#categoryTop li:first-child { border-top: none }
#categoryTop li a { font-size: 18px }
#categoryTop #newsList ul.thumblist li { border-top:none; border-bottom: #08214A 1px solid }
#categoryTop ul.thumblist a { background: none; padding: 0 }
/*#categoryTop ul.thumblist a:after { display: none }*/
#categoryTop ul.thumblist a > i { background-size:cover }
#categoryTop ul.thumblist a > i + p { font-size: 18px; margin-left: 7px }
/* 画像有り */
#categoryWrap {display: flex;flex-wrap: wrap }
#categoryWrap dl,
#categoryWrap dl dt,
#categoryWrap dl dd { margin: 0; padding: 0 }
#categoryWrap dl { width: 49%; margin-right: 2%; position: relative; overflow: hidden; margin-bottom: 10px }
#categoryWrap dl:nth-child(even) { margin-right: 0 }
#categoryWrap dl a { display: block; width: 100%; height: 100% }
#categoryWrap dl dt img { width: 100%; height: auto; display: block }
#categoryWrap dl dd {
	display: block;
  width: 100%;
	background-color: rgba(0,56,132,0.8);
	font-size: 16px;
  text-align: center;
	color: #FFF;
	text-decoration: none
}
#categoryWrap dl.catList dd { position: absolute; bottom: 0; height: 17.8%; z-index: 1; display: flex; align-items: center; justify-content: center }
#categoryWrap .col2Wrap dl.catList dd { width: 100% }
#categoryWrap .col3Wrap dl.catList dd { width: 100% }

/*一球速報調整*/
.live-container .buttonArea a.std:after,
.live-container .buttonArea span.std:after,
.live-container .buttonArea a.auto-reload-off:after,
.live-container .buttonArea a.manual-reload:after,
.page li a:after,
.live-container .buttonArea a.history:after,
.live-container .buttonArea a.member:after,
.live-container .buttonArea a.other:after,
.live-container .buttonArea a.auto-reload-on:after,
.live-container .buttonArea a.comment:after { display:none }
ul.showhide li a.down,
ul.showhide i a.up,
ul.showhide li a { background: none !important }
ul.showhide li a.up:after {content: "\f0d8" }
ul.showhide li a.down:after {content: "\f0d7" }
.live-container .player_info a dd { color:#333; text-decoration: none }
#contents-top #game-list a { color: #333; text-decoration: none }

/* PHOTO HIGHLIGHT */
#photohighlight dl,#photohighlight dt,#photohighlight dd{ margin:0; padding:0 }
#photohighlight { display:flex; flex-wrap:wrap }
#photohighlight dl {
  display: table;
  float: left;
  width: 32%;
  margin-right: 1%;
  margin-bottom: 1em
}
#photohighlight dl:nth-child(3n) {margin-right: 0 }
#photohighlight dt {
  display: table-row;
  text-align: center;
  vertical-align: middle;
  height: 90px
}
#photohighlight dt a { display: table-cell; height: 90px; vertical-align: middle; width: inherit; text-align: center }
#photohighlight dt img {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 90px;
  vertical-align: middle
}
#photohighlight dd { display: table-row; padding:0 5px }
#photohighlight dd .date { font-size: 10px }
#photohighlight dd .phTitle { font-size: 100%; line-height: 1.2 }

/* DRATICKET */
.guideDraticket table,
.guideDraticket td,
.guideDraticket th { border-spacing: 0; border: none; padding: 0; border-collapse: collapse }
.guideDraticket table { width:100% }
.guideDraticket td { width:49% }
.guideDraticket td:first-child { padding-right: 1% }
.guideDraticket td:last-child { padding-right: 1% }
.guideDraticket .guideDraticketFC { float: left; margin-right: 10px }
.guideDraticket .guideDraticketToroku { float: left }
.draticketBtn300 a {
  width: 300px;
  height: 50px;
  display: block;
  text-indent: -9999px;
  border: #00A5E3 1px solid;
  background:#FFF url(/dra/ticket/sales/image/2017/draticketLogo300.png) no-repeat center center;
  background-size: 250px auto
}
.draticketBtn300 a:hover { background-color: #00A7E3 }
.draticketBtn300.circle a { -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px }
/* /DRATICKET */
/* ======== QandA ======= */
.inner p.qaQ,.qaQ,
.top-block p.qaQ,
.sub-block p.qaQ,
.inner p.qaA,.qaA,
.top-block p.qaA,
.sub-block p.qaA { padding-left: 1.5em; text-indent: -0.1em; line-height: 1.8; padding-bottom: 0 }
.qaQ:before,
.qaA:before { font-weight: bold; margin-left: -1em; font-size: 1.25em }
.qaQ:before { color: #6CF; content: "Q"; padding-right:0.3em }
.qaA:before { color: #F66; content: "A"; padding-right:0.4em }
/* ======== QandA ======= */
/* ======== FUNCLUB ======= */
.executive { background-color: #820000; color: #FFF }
.gold { background-color: #A88E1F; color: #FFF }
.regular { background-color: #0068B7; color: #FFF }
.casual { background-color: #6EBA28; color: #FFF }
.junior { background-color: #34ACBD; color: #FFF }
/* ======== FUNCLUB ======= */
/* ARCHIVE LIST STYLE */
.selectbox {
  width:95%;
  margin:1em auto;
  position:relative
}
.selectbox select {
  -webkit-appearance:none;
  appearance:none;
  width:100%;
  padding:1em 1em;
  box-sizing:border-box;
  font-size:1em;
  border:#ccc 1px solid;
  border-radius:0;
  background:#fff
}
.selectbox::after{
  content:"";
  display:block;
  width:10px;
  height:10px;
  position:absolute;
  right:5%;
  top:35%;
  border-bottom:#333 2px solid;
  border-right:#333 2px solid;
  transform:rotate(45deg)translateY(-30%)
}
/* /ARCHIVE LIST STYLE */
/* ======== SPECIAL ======= */
.special {
  display: flex;
  flex-wrap: wrap
}
.special dl {
  width: 18.8%;
  margin-right: 1.5%;
  margin-bottom: 5%;
  text-align: center;
  border:#CCC 1px solid;
  box-sizing: border-box
}
.special.col2 dl { width: 49.2% }
.special dl.salenow { background-color: #FFFDD2 }
.special dl.salenow dd { font-weight: bold }
.special.col2 dl:nth-child(2n) { margin-right: 0 }
.special dt {
  margin: 0;
  text-align: center
}
/* ======== SPECIAL ======= */

div[class^="article-photo-"] { padding: 7px; margin-top: 0; margin-bottom: 20px }
div.article-photo-l { margin-right: 20px; float: left }
div.article-photo-r { margin-left: 20px; float: right }
div.article-photo-c { margin-left: auto; margin-right: auto }
div[class^="article-photo-"].noBorder { border: none }
div[class^="article-photo-"] p { margin: 0; padding: 8px 0 0; text-align: left }
div[class^="article-photo-"] p.center { text-align: center }
div[class^="article-photo-"] p.right { text-align: right }

.movieWrap { position: relative; width: calc(100% - 10px); max-width: 640px; margin: 0 auto }
.movieWrap > .iframeWrap { height: 0; padding-bottom: 56.25% }
.movieWrap > .iframeWrap > iframe { position: absolute; top: 0; left: 0 }

/* ======== SNS WEBアイコン色 ======= */
i.fa-twitter { color: #1D9BF0 }
i.fa-facebook { color: #1877F2 }
i.fa-line { color: #06C755 }
/* ======== 追従css 2022.10.25 追加 ======= */
.disFix { position: -webkit-sticky; position: sticky; z-index: 999; top: -1px }
.disFix.full { width: 100% }
body.open .disFix { position:static }
/* ======== 閑話休題etc　タイル系リスト 2022.11.7 追加 ======= */
#tileOtherWrap { padding: 5px; background-color: #F7F7F7 }
#tileOtherWrap li { background-color: #FFF }
#tileWrap { border-top:#003579 1px solid }
#tileWrap.flexBox { padding:15px 20px }
#tileWrap.flexBox a { display: block; width: 100%; text-decoration: none; color: #333 }
#tileWrap.flexBox a .date { font-size: 10px }
#tileWrap.flexBox > div { width: 48% }
#tileWrap.flexBox div.entrythum {
  width: 100%;
  height: 150px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  margin: 0 auto 3px
}
#tileWrap.flexBox div.entrythum.movie { height:auto }
#tileWrap.flexBox div.entrythum img { width: auto; max-width: 100%; height: auto; max-height: 150px }
#tileWrap p > span.new {
  display: inline-block;
  background-color: #FF0;
  color: #F00;
  font-size: 12px;
  padding: 1px 5px;
  border-radius: 3px;
  margin-right: 5px;
  font-weight: bold
}
#tileWrap .date > span.muryo,
ul.thumblist li a > p > span > span.muryo {
  display: inline-block;
  background-color: #d9fbee;
  color: #333;
  font-size: 12px !important;
  padding: 1px 3px;
  border-radius: 3px;
  margin-left: 5px
}

/* CMS記事用 */
#cmspageWrap p { margin:10px 20px; overflow-wrap: break-word }
#cmspageWrap h2 {
  font-size: 1.250em;
  color: #333;
  font-weight: 500;
  border-bottom: 4px solid #CDCDCD;
  position: relative;
  margin: 0 20px 1em;
  padding-top: 10px;
  padding-bottom: 5px;
  overflow: inherit;
  background-color: transparent;
  border-left: none
}
#cmspageWrap h2:before {
  content: '';
  display: block;
  width: 189px;
  height: 4px;
  background-color: #003579;
  position: absolute;
  bottom: -4px;
  left: 0
}
#cmspageWrap p { font-size:16px; line-height:1.8 }
#cmspageWrap p.read {
  background-color: transparent;
  border: #99c7ff 3px double;
  padding: 5px 8px;
  margin: 15px 20px
}
#cmspageWrap p.description {
  background-color: #E9E9E9;
  padding: 5px 8px;
  margin: 0 20px 15px
}
#cmspageWrap li p { margin:0 }
#cmspageWrap p.articles-next-page > a {
  text-decoration: none;
  color: #2169c2;
  border: 2px solid #eee;
  padding: 1.5em 1em 0.5em;
  display: block;
  width: 100%;
  margin: 1.5em auto;
  box-sizing: border-box;
}
#cmspageWrap p.articles-next-page > a > span {
  width: 60vw;
  margin: 0 auto 0.5em;
  display: block;
  background: #00418e;
  color: #fff;
  text-align: center;
  padding: 10px 10px 8px;
  font-size:min(4.5vw,18px);
  border-radius: 25px;
}
/* CMS記事用 */

/* 動画用 2023.6.22 And */
#movie h1 { border:none; font-size:16px; padding-top:15px }
#movie h1 > a { color:#333; text-decoration:none }

/*記事下部 PICKUP 2024.1.22 And */
.contPickupArea {
  border-top:#0092CB 2px solid;
  border-bottom:#0092CB 2px solid;
  background-color: #ECFFEC;
  margin: min(11vw,70px) 0 min(3vw,15px);
  padding: 3vw
}
.contPickupArea > .obi {
  margin-top: max(-9vw,-80px);
  border-radius: 50px;
  background: linear-gradient(to right,#0092CB,#001E78);
  font-size: min(5vw,24px);
  line-height: 1;
  color: #FFF;
  font-weight: 900;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: min(3vw,10px) 0 min(1vw,5px);
  margin-bottom: 3vw
}
.contPickupArea > .obi:before {
  content:url(/dra/news/image/icon-pickup.svg);
  padding-right:5px;
  display:block;
  width: min(24vw,180px)
}
.contPickupArea a {
  display: flex;
  color: #333;
  text-decoration: none;
  font-size: min(4vw,18px)
}
.contPickupArea a i {
  min-width: 100px;
  width: min(35vw,200px);
  height: min(25vw,120px);
  align-items: flex-start;
  position: relative;
  margin-right: 3vw
}
.contPickupArea a i img{
  width: 100%;
  height: min(25vw,120px);
  max-height: initial;
  max-width: initial;
  object-fit: cover;
  object-position: top
}
#cmspageWrap .contPickupArea a p { margin-left:0; margin-right:0; font-size:min(3.4vw,13px) }
.contPickupArea a p span { display:block; color:#888; font-size: min(3vw,11px) }
.contPrevNext {
  display: flex;
  justify-content: space-between;
  padding:2em 1em;
  box-sizing: border-box
}
.contPrevNext > div { width:45%; color:#BABABA; font-size: min(3.8vw,17px) }
.contPrevNext > div:nth-of-type(2) { width:2px; background-color:#DDD }
.contPrevNext > div:nth-of-type(3) { text-align:right }
.contPrevNext > div > a {
  display:flex;
  align-items:center;
  color:#333;
  text-decoration:none;
  margin-top:1.5vw;
  text-align:left;
  font-size:min(3.4vw,13px)
}
.contPrevNext > div:nth-of-type(3) > a { justify-content:flex-end }
.contPrevNext > div > a:before {
  font-family: "Font Awesome 5 Free";
  font-weight: 700;
  font-size:min(3vw,30px);
  color: #BABABA;
}
.contPrevNext > div:nth-of-type(1) > a:before { content: "\f053"; padding-right: 1.5vw }
.contPrevNext > div:nth-of-type(3) > a:before { content: "\f054"; order:1; padding-left: 1.5vw }

/*
==================================================
～1040
==================================================
*/
@media screen and ( max-width:1040px) {
  .dspPC { display: none }
  .dspTAB { display: block }
  .dspSP { display: block }
/*～1040 END*/
}

/*
==================================================
～670
==================================================
*/
@media screen and ( max-width:670px ){
  .dspPC { display: none }
  .dspTAB { display: none }
  .dspSP { display: block }
  /*スマホ表示時横スクロールアクション*/
  .scrollWrap { overflow: auto }
  .scrollWrap > table { width: 100%; -webkit-overflow-scrolling: touch; table-layout: auto; margin-bottom: 0 }
  .scrollWrap > table th,
  .scrollWrap > table td { white-space: nowrap }
  .news-list-area .scrollWrap {
    margin: 0 auto;
    padding: 0;
    min-width: 90%;
    overflow-x: auto;
    white-space: nowrap;
    overflow-scrolling: touch;
    -webkit-overflow-scrolling: touch;
  }
  .flexBox.spNoFlex { display: block }
  div[class^="article-photo-"] { float: none; padding: 0; margin-right: auto; margin-left: auto; text-align: center }
  /*～670 END*/
}