@import url("/js/slick/slick.css");
@import url("/js/slick/slick-theme.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');

body { background-color: #000; }
main { font-family: 'Noto Sans JP', sans-serif; font-weight: 500; font-style: normal; }
figure { margin: 0; }
.pcOn { display: block; }
.spOn { display: none; }
.date { padding: 0; text-align: left; }

/* header */
div.spHeader > h1 { background-image: url(../image/mainView.jpg); }

/* contents */
article {
  position: relative;
  padding-top: 100px;
  padding-bottom: 100px;
}
.content { position: relative; max-width: 1000px; margin: 0 auto; padding: 2%; font-size: 16px; line-height: 2.2; background-color: #FFF; box-sizing: border-box; }
.topToFix { background-color: #341298; }
.memoBno { background-color: #D2DFFC; }
a.btnLink { background-color: #2743A0; border-radius: 3px;display:block;text-align:center;color:#FFF;padding:20px 0;font-size:20px; box-sizing: border-box;margin:10px auto; border: #FFF 2px solid; }
a.btnLink:hover { text-decoration:none; background-color: #FFF; color: #2743A0; border: #2743A0 2px solid; }
.w600 { max-width: 600px; margin: auto; }
.w800 { max-width: 800px; margin: auto; }
.full-image img { width: auto; max-width: 100%; }

/* TITLE  */
.titleA {
  width: auto;
  max-width: 1000px;
  margin: 0 auto;
  color: #FFF;
  font-size: 5vw;
  font-family: neue-aachen-pro, sans-serif;
}
.titleA > span {
  display: inline-block;
  padding-right: 80px;
  padding-bottom: 20px;
  background-image: url(../image/titleBg.png);
  background-repeat: no-repeat;
  background-position: right bottom 20px;
  background-size: auto 70%;
}
.titleB {
  background: #00befd;
  background: -moz-linear-gradient(left,  #00befd 1%, #ac00d0 100%);
  background: -webkit-linear-gradient(left,  #00befd 1%,#ac00d0 100%);
  background: linear-gradient(to right,  #00befd 1%,#ac00d0 100%);
  padding: 6px 0;
  margin-bottom: 20px;
}
.titleB > span {
  display: block;
  padding: 5px 0;
  background-color: rgba(0, 0, 0, 0.5);
  color: #FFF;
  font-size: 2vw;
  line-height: 1.2;
  font-weight: 700;
}

/* スケジュール */
table.schedule-mb { width: 100% }
table.schedule-mb,td,th { border-spacing: 0px; border: none; padding: 0; border-collapse: collapse; }
table.schedule-mb th,
table.schedule-mb td { background-color: #FFF; border:none; width: auto; padding:3px; font-size: 100%; }
table.schedule-mb tr:nth-child(even) th,
table.schedule-mb tr:nth-child(even) td { border-top: #ccc 1px dotted; border-bottom: #ccc 1px dotted; }
table.schedule-mb thead th { background-color: #EEE; }
table.schedule-mb td:first-child { width: 10%; }
table.schedule-mb td:nth-of-type(2) { text-align: left; width: 19%; }
table.schedule-mb td:last-child { width: 40%; text-align: center; }
table.schedule-mb td:last-child > div.center { float: left; margin-top: 15px; }
table.schedule-mb td:nth-of-type(5) { text-align: left; }
table.schedule-mb *[class^="button-"] { width: 110px; float: right; }
table.schedule-mb td img { width: auto; max-width: 30%; }


/* INFO */
#info table.tableB th { width:14%; }

/* TICKET */
.seatmapBg {
  margin: 2%; padding:12% 1% 17%; text-align: center;
  background-image: url("/ticket/sales/image/2021/seatmapBg.svg");
  background-position: center;
  background-size: 100% auto;
  background-repeat: no-repeat;
  box-sizing: border-box;
}
.seatmapBg img { width: 88%; }
table.seatPriceTable { border-collapse: collapse; border-spacing: 0; width: 100%; margin-bottom: 20px; }
/*(対巨人・阪神・広島・千葉ロッテ)*/
.seatNameBox .exTxt{ display:inline-block; font-size:80%; }
/*マウスオーバー時*/
.seatNameBox:not(:empty):hover{ border:2px solid #b2b2b2; cursor: pointer; }
.seatNameBox{ vertical-align: middle; overflow: hidden; border:2px solid #fff; box-sizing: border-box; }
.seatNameBox .seatNumBox{ height:30px; width:30px; display:table-cell; vertical-align: middle; text-align:center; }
/*エグゼクティブ*/
.seatNameBox.coE1,.seatName.coE1{background-color:rgba(183,182,182, 0.3);}  .seatNameBox.coE1 .seatNumBox,.seatNumBox.coE1,#seatInfoWrap #coE1 h3{background-color:rgba(183,182,182, 1);}/*メンバーズS*/
.seatNameBox.coE2,.seatName.coE2{background-color:rgba( 26,108, 80, 0.3);}  .seatNameBox.coE2 .seatNumBox,.seatNumBox.coE2,#seatInfoWrap #coE2 h3{background-color:rgba( 26,108, 80, 1);}/*メンバーズA*/
.seatNameBox.coE3,.seatName.coE3{background-color:rgba(123,197,166, 0.3);}  .seatNameBox.coE3 .seatNumBox,.seatNumBox.coE3,#seatInfoWrap #coE3 h3{background-color:rgba(123,197,166, 1);}/*バラエティー・テラスシート*/
.seatNameBox.coE4,.seatName.coE4{background-color:rgba(128, 27,116, 0.3);}  .seatNameBox.coE4 .seatNumBox,.seatNumBox.coE4,#seatInfoWrap #coE4 h3{background-color:rgba(128, 27,116, 1);}/*メンバーズペア*/
/*スタンド下段1～10*/
.seatNameBox.co01,.seatName.co01{background-color:rgba(231, 56, 53, 0.3);}  .seatNameBox.co01 .seatNumBox,.seatNumBox.co01,#seatInfoWrap #co01 h3{background-color:rgba(231, 56, 53, 1);}/*内野SS*/
.seatNameBox.co02,.seatName.co02{background-color:rgba(233,191, 39, 0.3);}  .seatNameBox.co02 .seatNumBox,.seatNumBox.co02,#seatInfoWrap #co02 h3{background-color:rgba(233,191, 39, 1);}/*内野S*/
.seatNameBox.co03,.seatName.co03{background-color:rgba(227,122, 37, 0.3);}  .seatNameBox.co03 .seatNumBox,.seatNumBox.co03,#seatInfoWrap #co03 h3{background-color:rgba(227,122, 37, 1);}/*内野A*/
.seatNameBox.co04,.seatName.co04{background-color:rgba( 22,103,170, 0.3);}  .seatNameBox.co04 .seatNumBox,.seatNumBox.co04,#seatInfoWrap #co04 h3{background-color:rgba( 22,103,170, 1);}/*内野B*/
.seatNameBox.co05,.seatName.co05{background-color:rgba( 16, 51,128, 0.3);}  .seatNameBox.co05 .seatNumBox,.seatNumBox.co05,#seatInfoWrap #co05 h3{background-color:rgba( 16, 51,128, 1);}/*ドラゴンズ内野応援*/
.seatNameBox.co06,.seatName.co06{background-color:rgba(102,195,207, 0.3);}  .seatNameBox.co06 .seatNumBox,.seatNumBox.co06,#seatInfoWrap #co06 h3{background-color:rgba(102,195,207, 1);}/*ビジター内野応援*/
.seatNameBox.co07,.seatName.co07{background-color:rgba( 80, 70,154, 0.3);}  .seatNameBox.co07 .seatNumBox,.seatNumBox.co07,#seatInfoWrap #co07 h3{background-color:rgba( 80, 70,154, 1);}/*フィールドシート1*/
.seatNameBox.co08,.seatName.co08{background-color:rgba( 80, 70,154, 0.3);}  .seatNameBox.co08 .seatNumBox,.seatNumBox.co08,#seatInfoWrap #co08 h3{background-color:rgba( 80, 70,154, 1);}/*フィールドシート3*/
/*スタンド下段11～20*/
.seatNameBox.co11,.seatName.co11{background-color:rgba( 95,115,176, 0.3);}  .seatNameBox.co11 .seatNumBox,.seatNumBox.co11,#seatInfoWrap #co11 h3{background-color:rgba( 95,115,176, 1);}/*ドラゴンズ外野応援(ライト)*/
.seatNameBox.co12,.seatName.co12{background-color:rgba( 83, 84,137, 0.3);}  .seatNameBox.co12 .seatNumBox,.seatNumBox.co12,#seatInfoWrap #co12 h3{background-color:rgba( 83, 84,137, 1);}/*ドラゴンズ外野応援(レフト)*/
.seatNameBox.co13,.seatName.co13{background-color:rgba(218,189, 81, 0.3);}  .seatNameBox.co13 .seatNumBox,.seatNumBox.co13,#seatInfoWrap #co13 h3{background-color:rgba(218,189, 81, 1);}/*レフト側外野応援*/
.seatNameBox.co14,.seatName.co14{background-color:rgba(161,123, 64, 0.3);}  .seatNameBox.co14 .seatNumBox,.seatNumBox.co14,#seatInfoWrap #co14 h3{background-color:rgba(161,123, 64, 1);}/*ビジター外野応援*/
/*スタンド下段21～30*/
.seatNameBox.co21,.seatName.co21{background-color:rgba(  0, 56,147, 0.3);}  .seatNameBox.co21 .seatNumBox,.seatNumBox.co21,#seatInfoWrap #co21 h3{background-color:rgba(  0, 56,147, 1);}/*ドアラ・テラスシート*/
.seatNameBox.co22,.seatName.co22{background-color:rgba(204, 94, 18, 0.3);}  .seatNameBox.co22 .seatNumBox,.seatNumBox.co22,#seatInfoWrap #co22 h3{background-color:rgba(204, 94, 18, 1);}/*でら楽ペアシートS*/
.seatNameBox.co23,.seatName.co23{background-color:rgba(225,170, 99, 0.3);}  .seatNameBox.co23 .seatNumBox,.seatNumBox.co23,#seatInfoWrap #co23 h3{background-color:rgba(225,170, 99, 1);}/*でら楽ペアシート1*/
.seatNameBox.co24,.seatName.co24{background-color:rgba(195, 51, 30, 0.3);}  .seatNameBox.co24 .seatNumBox,.seatNumBox.co24,#seatInfoWrap #co24 h3{background-color:rgba(195, 51, 30, 1);}/*でら楽ペアシート3*/
.seatNameBox.co25,.seatName.co25{background-color:rgba(141, 58, 52, 0.3);}  .seatNameBox.co25 .seatNumBox,.seatNumBox.co25,#seatInfoWrap #co25 h3{background-color:rgba(141, 58, 52, 1);}/*ゆったりボックス3*/
.seatNameBox.co26,.seatName.co26{background-color:rgba(170,151,199, 0.3);}  .seatNameBox.co26 .seatNumBox,.seatNumBox.co26,#seatInfoWrap #co26 h3{background-color:rgba(170,151,199, 1);}/*リビングボックス*/
/*車椅子*/
.seatNameBox.co31,.seatName.co31{background-color:rgba(220, 98,118, 0.3);}  .seatNameBox.co31 .seatNumBox,.seatNumBox.co31,#seatInfoWrap #co31 h3{background-color:rgba(220, 98,118, 1);}/*車椅子席・介添席*/
.seatNameBox.co32,.seatName.co32{background-color:rgba(  7,  8, 11, 0.3);}  .seatNameBox.co32 .seatNumBox,.seatNumBox.co32,#seatInfoWrap #co32 h3{background-color:rgba(  7,  8, 11, 1);}/*車椅子・グループボックス*/
/*スタンド上段41～50*/
.seatNameBox.co41,.seatName.co41{background-color:rgba(230, 40, 90, 0.3);}  .seatNameBox.co41 .seatNumBox,.seatNumBox.co41,#seatInfoWrap #co41 h3{background-color:rgba(230, 40, 90, 1);}/*パノラマDP1*/
.seatNameBox.co42,.seatName.co42{background-color:rgba(209, 63,176, 0.3);}  .seatNameBox.co42 .seatNumBox,.seatNumBox.co42,#seatInfoWrap #co42 h3{background-color:rgba(209, 63,176, 1);}/*パノラマDP3*/
.seatNameBox.co43,.seatName.co43{background-color:rgba(243,168,180, 0.3);}  .seatNameBox.co43 .seatNumBox,.seatNumBox.co43,#seatInfoWrap #co43 h3{background-color:rgba(243,168,180, 1);}/*パノラマA*/
.seatNameBox.co44,.seatName.co44{background-color:rgba(255,240,  0, 0.3);}  .seatNameBox.co44 .seatNumBox,.seatNumBox.co44,#seatInfoWrap #co44 h3{background-color:rgba(255,240,  0, 1);}/*パノラマB*/
.seatNameBox.co45,.seatName.co45{background-color:rgba(174, 48, 46, 0.3);}  .seatNameBox.co45 .seatNumBox,.seatNumBox.co45,#seatInfoWrap #co45 h3{background-color:rgba(174, 48, 46, 1);}/*パノラマわいわいテラス10*/
.seatNameBox.co46,.seatName.co46{background-color:rgba(246,184,117, 0.3);}  .seatNameBox.co46 .seatNumBox,.seatNumBox.co46,#seatInfoWrap #co46 h3{background-color:rgba(246,184,117, 1);}/*パノラマパーティテラス12*/
/*スタンド中段51～60*/
.seatNameBox.co51,.seatName.co51{background-color:rgba(118, 29,126, 0.3);}  .seatNameBox.co51 .seatNumBox,.seatNumBox.co51,#seatInfoWrap #co51 h3{background-color:rgba(118, 29,126, 1);}/*プライム・ツインS*/
.seatNameBox.co52,.seatName.co52{background-color:rgba(214, 91,146, 0.3);}  .seatNameBox.co52 .seatNumBox,.seatNumBox.co52,#seatInfoWrap #co52 h3{background-color:rgba(214, 91,146, 1);}/*プライム・ツインA*/
.seatNameBox.co53,.seatName.co53{background-color:rgba(123,169, 24, 0.3);}  .seatNameBox.co53 .seatNumBox,.seatNumBox.co53,#seatInfoWrap #co53 h3{background-color:rgba(123,169, 24, 1);}/*プライム・ツインB*/
.seatNameBox.co54,.seatName.co54{background-color:rgba( 68, 89, 43, 0.3);}  .seatNameBox.co54 .seatNumBox,.seatNumBox.co54,#seatInfoWrap #co54 h3{background-color:rgba( 68, 89, 43, 1);}/*プライム・ツインB車椅子席*/
.seatNameBox.co55,.seatName.co55{background-color:rgba( 62,150,203, 0.3);}  .seatNameBox.co55 .seatNumBox,.seatNumBox.co55,#seatInfoWrap #co55 h3{background-color:rgba( 62,150,203, 1);}/*プライム・ボックス*/
.seatNameBox.co56,.seatName.co56{background-color:rgba( 36,171,143, 0.3);}  .seatNameBox.co56 .seatNumBox,.seatNumBox.co56,#seatInfoWrap #co56 h3{background-color:rgba( 36,171,143, 1);}/*レストランカウンター*/
.seatNameBox.co57,.seatName.co57{background-color:rgba( 36,171,143, 0.3);}  .seatNameBox.co57 .seatNumBox,.seatNumBox.co57,#seatInfoWrap #co57 h3{background-color:rgba( 36,171,143, 1);}/*レストランテーブル*/
/*ナンバリング*/
.seatNameBox.co44 .seatNum,.seatNumBox.co44 .seatNum{color: #666;border-color: #666}/*パノラマB*/

.seatPriceTable{ margin:0 auto; font-size:100%; border:1px solid #727272; }
.seatPriceTable th{ font-size:86%; border:1px solid #727272; }
.seatPriceTable th:not(:first-child){ border-left:1px solid #727272; }
.seatPriceTable th:not(:last-child){ border-right:1px solid #727272; }

/* バリアブルプライス色分け */
.seatPriceTable th.catPre{ background-color: #003378; color: #FFF; }
.seatPriceTable th.catPreThin,
.seatPriceTable td.catPreThin{ background-color: #DDEEFF; color: #666; }
.seatPriceTable th.catSta{ background-color: #FFE000; color: #666; }
.seatPriceTable th.catStaThin,
.seatPriceTable td.catStaThin{ background-color: #FFEEAA; color: #666; }
.seatPriceTable th.catVal{ background-color: #AAA; color: #FFF; }
.seatPriceTable th.catValThin,
.seatPriceTable td.catValThin{ background-color: #EFEFEF; color: #666; }
.seatPriceTable th.catThk{ background-color: #1271ff; color: #FFF; }
.seatPriceTable th.catThkThin,
.seatPriceTable td.catThkThin{ background-color: #edf6ff; color: #666; }
.seatPriceTable td{ border:1px solid #e3e3e3; padding:4px 4px; font-size:86%; }
.seatPriceTable td:first-child{ border-left:1px solid #727272; }
.seatPriceTable td:last-child{ border-right:1px solid #727272; }
.seatPriceTable tbody:last-child tr:last-child td{ border-bottom:1px solid #727272; }
.seatPriceTable th.seatName{
  border-right:0;
  border-left:0;
  text-align:left;
  padding-left:30px;
}
/*tablet*/
@media screen and (max-width: 767px){
  .seatPriceTable th.seatName{ padding-left:15px; }
}

/* NEWS */
#news ul li { font-size: 128.6%; border-bottom: #15168C 1px solid }
#news ul li a { color: #333 }
#news ul li a:before { font-size: 23px; content: "\f0da"; color: #15168C; }

/* FONT */
/*Neue Aachen Pro*/
.neue-aachen-pro { font-family: neue-aachen-pro, sans-serif; font-style: normal; }
/*Neue Aachen Pro Light*/
.neue-aachen-pro.ligh { font-weight: 300; }
/*Neue Aachen Pro Regular*/
.neue-aachen-pro.regu { font-weight: 400; }
/*Neue Aachen Pro Bold*/
.neue-aachen-pro.bold { font-weight: 700; }



/*
==================================================
671～1040
==================================================
*/
@media screen and (min-width:671px) and ( max-width:1040px) {
.pcOn { display: none; }
.spOn { display: block; }
.pcFlex { display: block; }
.pcFlex ul.textKome { width: auto; }
/* TITLE  */
.titleA { font-size: 7vw; }
.titleB > span { font-size: 3vw; }
/* スケジュール */
table.schedule-mb td { font-size: 90%; }
table.schedule-mb td:nth-of-type(2) { text-align: center; }
table.schedule-mb td:nth-of-type(2) span { display: none; }
table.schedule-mb td img { max-width: 40%; }
/*671～1039 END*/
}
/*
==================================================
～670
==================================================
*/
@media screen and ( max-width:670px ){
.pcOn { display: none; }
.spOn { display: block; }
.pcFlex { display: block; }
.pcFlex ul.textKome { width: auto; }
/* header */
div.spHeader > h1 { background-image: url(../image/mainView_sp.jpg); }
/* CONTENTS */
section { padding-top: 20px }
article { padding-top: 50px; padding-bottom: 50px; }
/* TITLE  */
.titleA { font-size: 10vw; }
.titleB > span { font-size: 5.2vw; }
h2.h2-bar { font-size: 110%; }
/* スケジュール */
table.schedule-mb td { padding: 2px 0; font-size: 80%; }
table.schedule-mb td:nth-of-type(2) { text-align: center; }
table.schedule-mb td:nth-of-type(2) span { display: none; }
table.schedule-mb td:nth-of-type(3) { display: none; }
table.schedule-mb td:last-child { width: 40%; font-size: 80%; }
table.schedule-mb td:last-child > div.center { float: none; margin-top: 0; }
table.schedule-mb td:last-child > div:last-child { margin: 0 auto; float: none; }
table.schedule-mb td img { width: auto; max-width: 70%; }
/* INFO */
#info table.tableB th,
#info table.tableB td { width:auto; display: block; border: none; }
/*チケット*/
#ticket table.tableB th, #ticket table.tableB td { padding: 3px; }
#ticket table.tableB th:nth-of-type(5) { width: 50%; padding: 0; }
#ticket table.tableB th:nth-of-type(4),
#ticket table.tableB td:nth-of-type(4),
#ticket table.tableB th:nth-of-type(6),
#ticket table.tableB td:nth-of-type(6) { display: none; }
#ticket .pre-icon { width: 30px; }
#ticket table.tableE td { display: block; font-size: 80%; text-align: center !important; }
.scroll{ overflow: auto; white-space: nowrap; }
.scroll::-webkit-scrollbar{ height: 5px; }/*tableにスクロールバーを追加*/
.scroll::-webkit-scrollbar-track{ background: #FFF; }/*tableにスクロールバーを追加*/
.scroll::-webkit-scrollbar-thumb { background: #CDCDCD;}/*tableにスクロールバーを追加*/
/*MEWS*/
article#news { padding: 0 }
/*～670 END*/
}

/* ========== Zindex ========== */
nav { z-index: 1000 }
nav #navBtn { z-index: 3000 }
article:before,article:after { z-index: 50; }
section { z-index: 100; }
.contWrap { z-index: 10 }
.topToFix { z-index: 100 }
