@charset "utf-8";

/* =resetForm */
.button--primary { border: none !important; }
.block-irregular { background: none !important; box-shadow: none !important; }
.block-irregular__inner-narrow { padding: 0 !important; max-width: 100% !important; margin: 0 !important; }
.block-irregular .form__row, .block-irregular__color-block .form__row { max-width: 100% !important; }
.form__content { margin: 0 !important; display: block !important; border-spacing: 0 !important; width: 100% !important; }
.form__cell { display: block !important; }
.block-irregular .buttons:not(:first-child), .block-irregular__color-block .buttons:not(:first-child) { margin-top: 0 !important; }
.block-irregular .buttons, .block-irregular__color-block .buttons { max-width: 100% !important; }
.block-irregular, .block-irregular__color-block { padding: 0 !important; margin: 0 !important; }
.section--divider:not(:first-child), .block-irregular__line-dashed:not(:first-child) {margin-top: 0 !important; padding-top: 0 !important; border-top: none !important; }
.form__caution, .form__error { margin-top: 0; margin-bottom: 1em; font-weight: bold; }
.button { border-radius: 0; display: block; padding: 0; line-height: 1; font-size: 14px; width: 100%; vertical-align: middle; text-align: center; white-space: nowrap; font-weight: normal; }

/* =reset
------------------------------------------------------------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
pre,form,fieldset,input,textarea,p,blockquote,th,td,header, section, article, footer, article, aside, time ,nav,a{
margin:0;
padding:0;
}

fieldset,img{
  border:0;
}
address,caption,cite,code,dfn,em,th,var{
font-style:normal;
font-weight:normal;
}
ol,ul{
list-style:none;
}
caption,th{
text-align:left;
}
h1,h2,h3,h4,h5,h6{
font-size:100%;
font-weight:normal;
}
q:before,q:after{
content:'';
}
abbr,acronym{
border:0;
}
p{
text-justify:inter-ideograph;
margin: 0;
}

header, section, article, footer, article, aside, time ,nav { display: block; }

ul{
-webkit-margin-before: 0;
-webkit-margin-after: 0;
-webkit-margin-start: 0;
-webkit-margin-end: 0;
-webkit-padding-start: 0;
}
figure {
display: block;
-webkit-margin-before: 0;
-webkit-margin-after: 0;
-webkit-margin-start: 0;
-webkit-margin-end: 0;
}

button{
background-color: transparent;
border: none;
cursor: pointer;
outline: none;
padding: 0;
appearance: none;
}

/* =base
------------------------------------------------------------------------------------------*/
* { box-sizing: border-box; }
body { background: #E6E6E6; color: #000; counter-reset: number 0; font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif; font-size: 16px; line-height: 1.6em; }
img { vertical-align: bottom; }
a { color: #f27900; text-decoration: underline; outline: none; }
a:hover { color: #f27900; text-decoration: none; }
a:hover img { opacity: 0.8; filter: alpha(opacity=80); }

/* =header
------------------------------------------------------------------------------------------*/
header {  position: relative; top: 0; width: 100%; z-index: 1; }
header h1 {max-width: 1280px; width: 100%; margin: 0 auto; }
header h1 img{ width: 100%;}


/* =foot
-----------------------------------------------------------------------------------------*/
footer { background: #fff; color: #000; text-align: center; width: 100%; }
footer .section-wrap { margin: 0 auto; padding: 2.5vw 0; }
footer p { font-size: 12px; margin-bottom: .6em; }
footer .miku { width: 157px; }
footer .eplus { width: 41px; }
footer i { display: inline-block; margin-top: -8px; }
footer .table-box .box02:first-child { text-align: right; width: 41%; }
footer .table-box .box02:last-child { padding-left: 1%; text-align: left; width: 59%; }

/* =to page top
------------------------------------------------------------------------------------------*/
.page_top { margin: 0; position: fixed; right: 100px; bottom: 50px; text-align: center; z-index: 10; }
.page_top a {text-decoration: none; background: rgba(255,255,255,.8); border: 1px solid #ccc; border-radius: 40px; color: #000; display: block; font-family: 'Oswald',"Meiryo","MS PGothic","Osaka",Arial,sans-serif; font-size: 11px; height: 80px; line-height: 80px; transition: all .2s; width: 80px; }

/* = sp nav
------------------------------------------------------------------------------------------*/
.sp-nav { display: none; }

/* = breadcrumb
------------------------------------------------------------------------------------------*/
.breadcrumb { margin: 0 auto 3vw; max-width: 1280px; width: 92%; }
.breadcrumb li { color: #696969; display: inline; }
.breadcrumb li a { font-size: 14px; line-height: 1.2em; text-decoration: underline; }
.breadcrumb li:not(:last-child)::after { content: " > "; color: #696969; }

/* = parts
------------------------------------------------------------------------------------------*/
.pc-none { display: none; }
.sp-none { display: block; }

/* box */
.clearfix::after,
.float-box::after { content: ""; clear: both; display: block; }
.float-box { width: 102%; }
.float-box .box01 { width: 98%; }
.float-box .box02,
.float-box .box03,
.float-box .box04 { float: left; margin: 0 2% 5% 0; }
.float-box .box02 { width: 48%; }
.float-box .box03 { width: 31.3%; }
.float-box .box04 { width: 23%; }
.float-box .box01 img,
.float-box .box02 img,
.float-box .box03 img,
.float-box .box04 img { width: 100%; }
.table-box { display: table; width: 100%; }
.table-box .box02,
.table-box .box03,
.table-box .box04 { display: table-cell; vertical-align: middle; }
.table-box .box02 { width: 50%; }
.table-box .box03 { width: 33.3%; }
.table-box .box04 { width: 25%; }
.table-box .box02 img,
.table-box .box03 img,
.table-box .box04 img { width: 100%; }

/* font */
.moreless { font-size: .8em; line-height: 1.4em; }
.less { font-size: .9em; line-height: 1.4em; }
.mid { font-size: 1.1em; line-height: 1em; }
.big { font-size: 1.2em; line-height: 1em; }
.bigger { font-size: 1.3em; line-height: 1em; }
.biggest { font-size: 1.5em; line-height: 1em; }
.font-bold { font-weight: bold; }
.font-normal { font-weight: normal; }
.font-minchou,
.font-yu-minchou { font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif; font-weight: normal; }
.font-italic { font-style: italic; }
.copyright { font-size: 12px; }

/* textColor */
.text-red { color: #cc0000; }
.text-white { color: #fff; }
.text-black { color: #000; }
.sat { color: #0b5792; }
.sun { color: #a63646; }

/* textAlign */
.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }

/* margin */
.mb-05vw { margin-bottom: .5vw !important; }
.mb-1vw { margin-bottom: 1vw !important; }
.mb-2vw { margin-bottom: 2vw !important; }
.mb-3vw { margin-bottom: 3vw !important; }
.mb-4vw { margin-bottom: 4vw !important; }
.mb-5vw { margin-bottom: 5vw !important; }
.mb-6vw { margin-bottom: 6vw !important; }
.mb-7vw { margin-bottom: 7vw !important; }
.mb-8vw { margin-bottom: 8vw !important; }
.mb-9vw { margin-bottom: 9vw !important; }
.mb-10vw { margin-bottom: 10vw !important; }
.mb-01em { margin-bottom: .1em !important; }
.mb-02em { margin-bottom: .2em !important; }
.mb-03em { margin-bottom: .3em !important; }
.mb-04em { margin-bottom: .4em !important; }
.mb-05em { margin-bottom: .5em !important; }
.mb-06em { margin-bottom: .6em !important; }
.mb-07em { margin-bottom: .7em !important; }
.mb-08em { margin-bottom: .8em !important; }
.mb-09em { margin-bottom: .9em !important; }
.mb-1em { margin-bottom: 1em !important; }
.mb-2em { margin-bottom: 2em !important; }

/* 16:9 wrap(youteube) */
.video-outer-wrap { margin: 0 auto 3vw; width: 60%; }
.video-wrap { overflow: hidden; padding-bottom: 56.25%; position: relative; height: 0px; width: 100%; }
.video-wrap iframe { position: absolute; top: 0; left: 0; height: 100%; width: 100%; }
.video-wrap img { position: absolute; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); width: 100%; }

/* playButton */
.play-button::before { content: ""; border: 3px solid rgba(255,255,255,.5); border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate3d(-50%,-50%,0); width: 75px; height: 75px; transition: .15s; z-index: 1; }
.play-button::after { content: ""; border: 23px solid transparent; border-left: 35px solid rgba(255,255,255,.5); position: absolute; top: 50%; left: calc(50% + 17px); transform: translate3d(-50%,-50%,0);transition: .15s;  }
.play-button:hover::before { border: 3px solid rgba(255,255,255,1); }
.play-button:hover::after {  border-left: 35px solid rgba(255,255,255,1); }

/* periodBox */
.period-box { background: #f8f8f8; box-sizing: border-box; color: #cc0000; font-size: 24px; font-weight: bold; line-height: 1.4em; margin: 0 auto 2vw; padding: 1em .5em; text-align: center; width: 100%; }

/* bottomLineBased */
.solid-line { border-bottom: 1px solid #fff; }
.dotted-line { border-bottom: 1px dotted #fff; }
.dashed-line { border-bottom: 1px dashed #fff; }

/* bottomLinePadding */
.solid-line,
.dotted-line,
.dashed-line { padding-bottom: 1em; }

/* textList(wrap by div) */
p.text-list,
.text-list ul li { font-size: 14px; line-height: 1.6em; padding: 0 0 .3em 1.1em; position: relative; }
p:not(:last-of-child).text-list { margin-bottom: 1em; }
.text-list ul li:not(:last-of-child) { margin-bottom: .4em; }
p.text-list::before,
.text-list ul li::before { content: "※"; position: absolute; left: 0; }
p.text-list-dotted::before,
.text-list-dotted ul li::before { content: "・"; }
p.text-list-circle::before,
.text-list-circle ul li::before { content: "●"; }
p.text-list-square::before,
.text-list-square ul li::before { content: "■"; }
p.text-list-square02::before,
.text-list-square02 ul li::before { content: "◆"; }
p.text-list-counter,
.text-list-counter ul li { padding-left: 5.1em; }
p.text-list-counter::before,
.text-list-counter ul li::before { counter-increment: number 1; content: "" counter(number) ""; }

/* linkOff */
.link-off a { background: #ccc; border: none; box-shadow: none; pointer-events: none; }
.link-off a::after { display: none !important; }

/* smartphone
------------------------------------------------------------------------------------------*/
@media screen and (max-width: 768px){
  /* =base
  ------------------------------------------------------------------------------------------*/
  body { font-size: 14px; line-height: 1.4em; }

  /* =header
  ------------------------------------------------------------------------------------------*/
  header {  }

  /* =pagetop
  ------------------------------------------------------------------------------------------*/
  .page_top{ display: none; }

  /* = mainImage
  ------------------------------------------------------------------------------------------*/
  #main-img { background-image: none; }

  /* = wrap
  ------------------------------------------------------------------------------------------*/
  /* main wrap */
  .main-wrap { padding: 7vw 0; width: 100%; }

  /* section wrap */
  .section-wrap { margin: 0 auto 16vw; width: 92%; }

  /* content wrap */
  .content-wrap { margin-bottom: 13vw;  }

  /* = parts
  ------------------------------------------------------------------------------------------*/
  .pc-none { display: block; }
  .sp-none { display: none; }

  /* box */
  .float-box,
  .float-box .box01,
  .float-box .box02,
  .float-box .box03 { width: 100%; }
  .float-box .box02,
  .float-box .box03 { float: none; margin: 0 0 5% 0; }
  .float-box .box04 { width: 48%; }
  .table-box .box02,
  .table-box .box03 { display: block; width: 100%; }
  .table-box .box04 { width: 50%; }

  /* textAlign */
  .sp-text-left { text-align: left; }
  .sp-text-right { text-align: right; }
  .sp-text-center { text-align: center; }

  /* margin */
  .sp-mb-05vw { margin-bottom: .5vw !important; }
  .sp-mb-1vw { margin-bottom: 1vw !important; }
  .sp-mb-2vw { margin-bottom: 2vw !important; }
  .sp-mb-3vw { margin-bottom: 3vw !important; }
  .sp-mb-4vw { margin-bottom: 4vw !important; }
  .sp-mb-5vw { margin-bottom: 5vw !important; }
  .sp-mb-6vw { margin-bottom: 6vw !important; }
  .sp-mb-7vw { margin-bottom: 7vw !important; }
  .sp-mb-8vw { margin-bottom: 8vw !important; }
  .sp-mb-9vw { margin-bottom: 9vw !important; }
  .sp-mb-10vw { margin-bottom: 10vw !important; }

  /* linkButton */
  .link-button { font-size: 22px; text-decoration: none; width: 90%; }

  /* 16:9 wrap(youteube) */
  .video-outer-wrap { width: 92%; }

  /* periodBox */
  .period-box { font-size: 18px; line-height: 1.2em; margin-bottom: 4vw; padding: .6em 0; width: 90%; }

  /* textList(wrap by div) */
  .text-list p,
  .text-list ul li { padding-bottom: .3em; }
}

/* = mainImage */
#main-img { background: /*url(../images/main_background.jpg) center top no-repeat*/ #cacaca; width: 100%; }
#main-img h1 { margin: 0 auto; max-width: 1000px; width: 100%; }
#main-img img { width: 100%; }

/* = wrap */
/* whole wrap */
main.container{max-width: 1280px; width: 100%; margin:0 auto 1vw; background: #fff; display: block; padding: 5vw 0 0 0 !important; }
/* mainwrap */
.main-wrap { background: #fff; display: block; margin: 0 auto ; padding: 0 0 1vw; max-width: 1000px; width: 92%; }

/* section wrap */
.section-wrap { margin: 0 auto 80px; width: 100%; }
/*.section-wrap:not(:last-of-type) { margin-bottom: 3vw; }*/
.section-wrap img { vertical-align: bottom; }
.section-wrap p:not(:last-of-type) { margin-bottom: 1em; }

/* content wrap */
.content-wrap { margin-bottom: 60px; }

/* linkButtonBased */
button.link-button {text-decoration: none; padding: 1em .5em;box-sizing: border-box; display: block; border-radius: 50px; font-size: 26px; font-weight: bold; line-height: 1em; margin: 0 auto; position: relative; text-align: center; transition: .1s; width: 50%; }
.link-button {text-decoration: none;box-sizing: border-box; display: block; border-radius: 50px; font-size: 26px; font-weight: bold; line-height: 1em; margin: 0 auto; position: relative; text-align: center; transition: .1s; width: 50%; }
.link-button:hover { text-decoration: none; }
.link-button:active { box-shadow: none;}
.spice-button a { background: #cc0000; box-shadow: 4px 4px 0 rgba(153,0,0,1); font-size: 26px; }
.spice-button a:hover { color: #cc0000; }

/* linkButtonColor */
.link-button { background: #f27900; color: #fff; }
.link-button:hover { opacity: .7;}
.link-button:active { }

.pc-only{}
.sp-only{display: none;}

.color-g{color:#F27900;}
.caution-box{background-color: #f0f0f0; padding: 40px 30px;margin-bottom: 30px;}
.caution-box.red-box{background-color: #ffefef;}
.caution-box p.caution-heading{font-weight: bold; font-size: 20px; line-height: 1em; margin-bottom: 25px; text-align: center;}

#detail h2,
#schedule h2,
#step h2,
#about h2 { font-size: 32px; font-weight: bold; line-height: 1em; margin-bottom: 80px; position: relative; }

#detail h2::before,
#schedule h2::before,
#step h2::before,
#about h2::before,
#detail h2::after,
#schedule h2::after,
#step h2::after,
#about h2::after { position: absolute; content: ""; bottom: -25px; }

#detail h2::before,
#schedule h2::before,
#step h2::before,
#about h2::before { border-bottom: 5px solid #f27900; width: 20%; left: 0; }

#detail h2::after,
#schedule h2::after,
#step h2::after,
#about h2::after { border-bottom: 5px solid #f0f0f0; width: 80%; right: 0; }

#first-text{ background: #ffefef; padding: 30px 60px; width: 100%; max-width: 1000px; }
#first-text p.first-ttl{color: #ff0000; text-align: center; font-weight: bold; margin-bottom: 1em; font-size: 16px; line-height: 1.6em;}
#first-text p.comment{font-size: 16px; line-height: 1.6em;}

#second-text { background: #fffbef; padding: 90px 0; width: 100%; }
#second-text .inner-wrap { margin: 0 auto; padding: 0 20px; width: 100%; max-width: 1000px; }
#second-text h2 { font-size: 14px; font-weight: bold; line-height: 1.4em; margin-bottom: 42px; text-align: center; }
#second-text h2 span { color: #ee7600; font-size: 48px; display: block; margin-top: 16px; padding-top: 16px; }

#detail .detail-wrap dl { border-bottom: 1px dotted #b5b5b5; display: table; margin-bottom: 1em; padding-bottom: 1em; width: 100%; }
#detail .detail-wrap dl dt,
#detail .detail-wrap dl dd { display: table-cell; font-size: 18px; line-height: 1.4em; vertical-align: top; }
#detail .detail-wrap dl dt { font-weight: bold; width: 18%; min-width: 180px; position: relative; padding-right: 1em;}
#detail .detail-wrap dl dt::after {  content: "ﾂ："; position: absolute; right: 0; top: 0; }
#detail .detail-wrap dl dd { padding-left: 1em; position: relative; width: 92%; }
/*#detail .detail-wrap dl dd::before { content: "F"; position: absolute; left: 0; top: 0; }*/
#detail .detail-wrap ul li { border-bottom: 1px dotted #b5b5b5; font-size: 18px; line-height: 1.4em; padding-bottom: 1em; width: 100%; }
#detail .detail-wrap ul li:not(:last-of-type) { margin-bottom: 1em; }
#detail .detail-wrap table { width: 100%; border-collapse: collapse; }
#detail .detail-wrap table tr th,
#detail .detail-wrap table tr td{ border: 1px solid #d9d9d9;}
#detail .detail-wrap table tr th{background-color: #f27900; color: #fff; text-align:center; font-weight: bold; padding: 10px 0; width: 25%;}
#detail .detail-wrap table tr th:first-child { width: 50%; }
#detail .detail-wrap table tr td{background-color: #fffcef; padding: 15px 7px 15px 7px;}
#detail .detail-wrap .seat-map {max-width: 1000px; margin: 0 auto 3vw; }
#detail .detail-wrap .seat-map img { width: 100%; }
#detail .detail-wrap .seat-map h3 {border-bottom: 3px solid #f0f0f0; color: #242424; font-weight: bold; text-align: center; padding-bottom: .6em; }
#detail .uniform-wrap h3 { position: relative; font-weight: bold; margin-bottom: .3em; padding-left: 1.1em; }
#detail .uniform-wrap h3::before { content: "ﾂﾂ｡"; position: absolute; left: 0; top: 0; }
#detail .uniform-wrap .uniform-img { width: 100%; max-width: 740px; }
#detail .uniform-wrap .uniform-img img { width: 100%; }

#schedule table{ width: 100%; border-collapse: collapse;}
#schedule tr{}
#schedule th,
#schedule td{ border: 1px solid #d9d9d9;}
#schedule th.ippan{width: 12%;}
#schedule th.match-card{width: 11%;}
#schedule th{background-color: #f27900; color: #fff; text-align:center; font-weight: bold; padding: 10px 0; width: 15.4%;}
#schedule td{background-color: #fffcef; padding: 15px 7px 15px 7px;}
#schedule tr td.bg-gray{background-color: #f0f0f0; text-align:center; }
#schedule tr td.bg-white{background-color:#fff;  text-align:center;}
#schedule img { width: 100%; }

/* parts */
.text-key { color: #f27900; }
.flex-box { display: flex; flex-direction: row; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-start; width: 105%; margin-bottom: -5%; }
.flex-box .box02 { flex-grow: 1; flex-basis: 45%; flex-shrink: 0; max-width: 45%; margin: 0 5% 5% 0; }
#step .inner-heading{font-weight: bold; font-size: 16px; line-height: 1em; margin-bottom: 10px;}
#step .inner-heading-big{font-size: 24px; line-height: 1.4em; font-weight: bold; margin-bottom: 1em;}
#step .text-list{font-size: .9em; line-height: 1.4em;}

/* step free text */
#step .free-text{font-size: 14px; line-height: 1.6em; margin-bottom: 1em;}
#step .free-mid-text{font-size: 18px; line-height: 1.4em; margin-bottom: 40px;}

/* step heading */
#step .step-box{position: relative; z-index: 0;}
#step .step-box:not(:last-of-type)::before {position: absolute; content: ""; border-left:3px solid #f27900; left: 46px; height: calc(100% + 60px); z-index: -1;}
#step .heading-box{display: table; border: 1px solid #F27900; margin-bottom: 40px; width: 100%;}
#step .heading-box .h-beforebox{display: table-cell; text-align: center; background-color: #f27900; color: #fff; width: 8%; vertical-align: middle; padding: 0px 0px 7px; min-width: 94px;}
#step .heading-box .h-beforebox span.moreless{ font-size: 0.6em; line-height: 1.4em; letter-spacing: 2px;}
#step .heading-box span.before-text{font-size: 32px; line-height: 1em; font-weight: bold; font-family: 'Oswald', sans-serif; display: inline-block;}
#step .heading-box .h-beforebox .heading-number-box{position: relative; display: inline-block; height: 35px; width: 100%;}
#step .heading-box .h-beforebox .heading-number-box::before{counter-increment: number 1; content: "" counter(number) ""; position: absolute; top: 50%; left: 50%; transform: translate3d(-50%,-50%,0); transform: translate3d(-50%,calc(-50% + 2px),0); z-index: 5;}
#step .heading-box h3{ font-weight: bold; display: table-cell; vertical-align: middle; font-size: 26px; line-height: 1.2em; padding: .8em;}

/* step inner wrap */
#step .inner-wrap{ width: 92%; margin-left: auto;}

/* step dl dt dd */
#step .list { margin-bottom: 22px; padding-left: 12px; }
#step .list dt { font-weight: bold; margin-bottom: .6em; position: relative; }
#step .list dt::before { content: "-"; position: absolute; left: -10px; top: 0; }
#step .period { font-weight: bold; color: #ff0000; font-size: 18px; line-height: 1.4em; }
#step .flex-box { margin-bottom: 0; }
#step .link-button a { font-size: 16px; line-height: 1em; padding: .8em 0 .7em; width: 64%; border-radius: 50px; }
#step .link-button a:not(:last-of-type) {margin-bottom: 1em; }

/* step comment */
#step .comment:not(:last-of-type) { margin-bottom: 2.5vw; }
#step .comment { position: relative; padding-left: 131px;}
#step .comment::before { content: ""; position: absolute; top: 50%; left: 0; transform: translate3d(0,-50%,0); }
#step .comment.icon-mail-send::before { background: url(../images/icon_mail_send.jpg) center no-repeat; background-size: contain; width: 116px; height: 67px; }
#step .comment.icon-check-mark::before { background: url(../images/icon_check_mark.jpg) center no-repeat; background-size: contain; width: 67px; height: 67px;left: 30px; }
#step .comment.icon-mail-post::before { background: url(../images/icon_mail_post.jpg) center no-repeat; background-size: contain; width: 67px; height: 70px; left: 30px;}
#step .comment.icon-exclamation::before { background: url(../images/icon_exclamation.png) center no-repeat; background-size: contain; width: 67px; height: 67px; left: 30px; }
#step .comment.icon-delivery::before { background: url(../images/icon_delivery.jpg) center no-repeat; background-size: contain; width: 101px; height: 65px;}
#step .comment.icon-exclamation p { font-size: 18px; font-weight: bold; line-height: 1.4em; color: #ff0000; }

/* step notes */
.note-box,
#step .step-note-box{background-color: #f0f0f0; padding: 25px 30px;}
/*#step .step-note-box p.step-note-heading{font-weight: bold; font-size: 16px; line-height: 1em; margin-bottom: 10px;}*/

/* step detail list */
#step .detail-box{border: 3px solid #ffe2c4; margin-bottom: 30px;}
#step .detail-box .detail-inner-wrap{padding: 35px 45px 35px 45px;}
#step .detail-box h4{ font-size: 20px; background-color: #ffe2c4; line-height: 1em; font-weight: bold; padding: 20px 0 20px 35px;}

/* step payment */
#step .card-box{text-align: center;margin-bottom: 10px;}
#step .card-box img{width: 100%;}
#step .saison,
#step .visa,
#step .master,
#step .jcb,
#step .dinner,
#step .dc,
#step .uc{display: inline-block; vertical-align: middle;}
#step .saison{width: 131px;}
#step .visa{width: 85px;}
#step .master{width: 85px;}
#step .jcb{width: 79px;}
#step .dinner{width: 145px;}
#step .dc{width: 94px;}
#step .uc{width: 143px;}
#step .detail-inner-wrap p:not(:last-of-type){margin-bottom: .2em;}
#step .detail-inner-wrap p.text-list{margin-bottom: 1em;}
#step .detail-inner-wrap .step-note-box p.text-list{margin-bottom: 0;}

/* step */
#step .detail-box .process .box03{width: 29%; margin-right: 4.33%;position: relative;}
#step .detail-box .process p{padding: 0 20px 0 0;}
#step .detail-box .process .icon-choice,
#step .detail-box .process .icon-page,
#step .detail-box .process .icon-store{width: 100%; margin:0 auto 15px; }
#step .detail-box .process .icon-choice{ max-width:162px ;}
#step .detail-box .process .icon-page{ max-width: 91px;}
#step .detail-box .process .icon-store{ max-width: 101px;}
#step .detail-box .process .process-img img{width: 100%;}
#step .detail-box .process .box03:not(:last-of-type)::before,
#step .detail-box .process .box03:not(:last-of-type)::after{content: ""; position: absolute;}
#step .detail-box .process .box03:not(:last-of-type)::before{width: 30px; height: 30px; background-color: #f27900; right: -16px; border-radius: 20px; top: 50%; transform: translate3d(0,-50%,0);}
#step .detail-box .process .box03:not(:last-of-type)::after{right: -6px; width: 10px; height: 10px; border-top:4px solid #fff; border-right: 4px solid #fff; -webkit-transform: rotate(45deg); transform: translate3d(0,-50%,0) rotate(45deg); top: 50%;}

#step .process-detail-box{background-color: #fff5eb; padding: 25px 30px;}
#step .process-detail-box:not(:last-of-type){  margin-bottom: 30px;}
#step .process-detail-box h5{font-size: 18px; line-height: 1em; font-weight: bold; margin-bottom: .8em; padding-left: 1.4em; position: relative;}
#step .process-detail-box h5::before{position: absolute; content: "■"; color: #f27900; font-size: 24px; left: 0;}
#step .process-detail-box .process-detail-list {counter-reset: number;}
#step .process-detail-box .process-detail-list-wrap:not(:last-of-type) {margin-bottom: 30px;}
#step .process-detail-box .process-detail-list .step-number{font-size: 16px; line-height: 1.4em; position: relative;}
#step .process-detail-box .process-detail-list .step-number:not(:last-of-type){}
#step .process-detail-box .process-detail-list .step-number .number-box{display: inline-block; position: absolute; top: 50%; transform: translate3d(0,-50%,0); content: ""; left: 0; background-color: #f27900; width: 30px; height: 30px; z-index: 1;}
#step .process-detail-box .process-detail-list .step-number .number-box::before{counter-increment: number 1; content: "" counter(number) ""; position: absolute; top: 50%; left: 50%; transform: translate3d(-50%,-50%,0);color: #fff; font-size: 18px; font-weight: bold; z-index: 5; }
#step .process-detail-box .process-detail-list .step-number dd{display: inline-block; position: relative;padding-left: 3em;}

/* step guide */
#step .guide{ margin-top:1em;}
#step .guide ul{background-color: #fff; display: flex; width: 100%;}
#step .guide li{ position: relative; font-size: 12px; line-height: 1.4em; z-index: 99; padding: 10px 35px 10px 15px; flex-grow: 0; flex-shrink: 1;}
#step .guide li:not(:last-of-type){background-image: url(../images/arrow.png); background-repeat: no-repeat; background-size: contain; background-position: top right;}
/* step guide box */
#step .guide li.box01{flex-basis: 100%; max-width: 100%;}
#step .guide li.box02{flex-basis: 50%; max-width: 50%;}
#step .guide li.box03{flex-basis: 33.3%; max-width: 33.3%;}
#step .guide li.box04{flex-basis: 25%; max-width: 25%;}
#step .guide li.box05{flex-basis: 20%; max-width: 20%;}

/* */
.modal-wrap { display: none; }
#howto p { padding: 0 1em 1em; }

/* */
#notes { background: #f0f0f0; padding: 30px; text-align: center; }
#notes h2 { font-size: 18px; font-weight: bold; line-height: 1em; margin-bottom: .5em; }

#bottom-caution .caution-box .text-list{margin-bottom: 1em;}
#bottom-caution p.indent-text{padding-left: 1.1em;}

.seat-caution .head{background-color: #fcefef; font-weight: bold; text-align: center; font-size: 18px; line-height: 1.4em; padding: 10px 7px; margin-bottom: 0!important;}
.seat-caution .bottom{ border: 3px solid #fcefef; border-top:none; padding: 15px 20px;}

@media screen and (max-width: 768px){
.main-wrap { margin-bottom: 4vw; width: 92%; }
.section-wrap { margin-bottom: 9vw; }

.pc-only{display: none;}
.sp-only{display: block;}
.container{}

.color-g{color:#F27900;}
.caution-box{ padding: 20px 15px;}
.caution-box.red-box{}
.caution-box p.caution-heading{line-height: 1.4em;}

#detail h2,
#schedule h2,
#step h2,
#about h2{font-size: 20px; line-height: 1.4em; margin-bottom: 40px;}

#schedule h2::before,
#step h2::before,
#about h2:before,
#schedule h2::after,
#step h2::after,
#about h2::after{bottom: -15px;}

#detail h2::before,
#schedule h2::before,
#step h2::before,
#about h2::before{width: 30%;}

#detail h2::after,
#schedule h2::after,
#step h2::after,
#about h2::after{width: 70%;}

#first-text{ padding: 20px 15px; margin-bottom: 7vw;}
#first-text p.first-ttl{text-align:left; margin-bottom: 3vw;}
#first-text p.comment{font-size: 14px;}

#second-text { margin-bottom: 7vw; padding: 20px 15px; }
#second-text .inner-wrap { padding: 0; }
#second-text h2 { margin-bottom: 7vw; }
#second-text h2 span { font-size: 6vw; margin-top: 0; padding-top: 7vw; line-height: 1.2em; }

#schedule table.sp-table{ }
#schedule table.sp-table:not(:last-of-type){margin-bottom: 7vw; }
#schedule table.sp-table tr{}
#schedule table.sp-table th,
#schedule table.sp-table td{ }
#schedule table.sp-table th.sp-date{width: 50%;}
#schedule table.sp-table th.sp-match-card{width: 50%;}
#schedule table.sp-table th{}
#schedule table.sp-table td{}
#schedule table.sp-table td dl{display: table; width: 100%;}
#schedule table.sp-table td dt,
#schedule table.sp-table td dd{display: table-cell;vertical-align: middle;}
#schedule table.sp-table td dt{width: 25%; border-right: 1px dotted #d6d4d4; }
#schedule table.sp-table td dd{padding-left: 5%;}

#detail .detail-wrap dl { display: block; width: 100%; }
#detail .detail-wrap dl dt,
#detail .detail-wrap dl dd { display: block; min-width: unset; width: 100%; padding: 0 0 0 0;}
#detail .detail-wrap dl dt::after { right: auto;}
#detail .detail-wrap ul li { font-size: 16px; }

/* parts */
.biggest { font-size: 1.3em; line-height: 1.2em; }
.flex-box { width: 100%; margin-bottom: -5%; }
.flex-box .box02 { flex-grow: 1; flex-basis: 100%; flex-shrink: 0; max-width: 100%; margin: 0 0 8% 0; }
#step .inner-heading{}
#step .inner-heading-big{font-size: 18px; }


/* */
#step h2 { font-size: 24px; }
#step h2::before,
#step h2::after{bottom: -15px;}


/* */
#step .free-text{}
#step .free-mid-text{ font-size: 16px; line-height: 1.4em; margin-bottom: 20px;}

/* */
#step .step-box:not(:last-of-type)::before{display: none;}
#step .heading-box span.before-text{font-size: 26px;}
#step .heading-box{margin-bottom: 7vw;}
#step .heading-box h3{font-size: 20px; }
#step .heading-box .h-beforebox{width: 20%;min-width: auto;}

/* */
#step .inner-wrap{width: 100%;}

/* */
#step .link-button a{width: 74%;}

/* */
#step .comment{padding-left: 100px;}
#step .comment.icon-mail-send::before { width: 80px; height: 46px; }
#step .comment.icon-check-mark::before,
#step .comment.icon-exclamation::before { width: 46px; height: 46px; left: 20px; }
#step .comment.icon-mail-post::before{width: 56px; height: 59px;left:20px;}
#step .comment.icon-delivery::before{width: 80px; height: 52px;}
#step .comment.icon-exclamation p { font-size: 16px; }

/* */
#step .step-note-box{padding: 20px 20px 15px;}

/* */
#step .detail-box:not(:last-of-type){margin-bottom: 5vw;}
#step .detail-box .detail-inner-wrap{padding: 20px 15px 15px;}

/* */
#step .detail-box h4{ font-size: 18px; padding: 10px 5px 10px 15px; line-height: 1.4em;}

/* */
#step .card-box{margin-bottom: 5vw;}

/* */
#step .detail-box .process .box03{width: 100%; margin:0 0 5vw 0;}
#step .detail-box .process .box03:not(:last-of-type){margin-bottom: 60px;}
#step .detail-box .process p{padding: 0 0 0 0;}
#step .detail-box .process .icon-choice,
#step .detail-box .process .icon-page,
#step .detail-box .process .icon-store{ margin-bottom: 3vw;}
#step .detail-box .process .box03:not(:last-of-type)::before{transform: translate3d(0,0,0); top: unset; bottom: -45px; left: 0; right: 0; margin: auto;}
#step .detail-box .process .box03:not(:last-of-type)::after{top: unset; transform: translate3d(0,0,0) rotate(135deg); bottom: -35px; right: 0; left: 0; margin: auto;}
/* */
#step .process-detail-box{padding: 20px 20px 15px; }
#step .process-detail-box:not(:last-of-type){margin-bottom: 5vw;}
#step .process-detail-box h5{font-size: 16px; line-height: 1.4em; }
#step .process-detail-box h5::before{ font-size: 20px;}
#step .process-detail-box .process-detail-list .step-number:not(:last-of-type){}
#step .process-detail-box .process-detail-list-wrap:not(:last-of-type) {margin-bottom: 7vw;}
#step .process-detail-box .process-detail-list .step-number dd p{ }
/* */
#step .guide ul{ display: block; }
#step .guide li{ display: block; font-size: 14px; line-height: 1.4em; padding: 7vw 15px 6vw 15px;position: relative; z-index: 5;}
#step .guide li:not(:last-of-type){background-image: none;}
#step .guide li:not(:last-of-type)::after{position: absolute;content: ""; background-image: url(../images/arrow_sp.png); background-repeat: no-repeat; background-size: contain; left: 0; right: 0; margin: auto; width: 100%; height: 9vw; bottom:-5vw; z-index: -1;}
/* */
#step .guide li.box01,
#step .guide li.box02,
#step .guide li.box03,
#step .guide li.box04,
#step .guide li.box05{flex-basis: 100%; max-width: 100%;}

.link-button { width: 92%; }
}

/* form */
.form p.form-text{text-align: center; font-size: 16px; line-height: 1em; font-weight: bold; margin-bottom: 20px;}
.form form { text-align: center; }
.form .form-id {padding:10px 10px; font-size: 18px; margin: 0 auto 50px auto; width: 44%; border: 1px solid #95989a; background-color: #fff; outline: none; transition: 0.12s; }
.form .form-id:focus{background-color: #fff;}

@media screen and (max-width: 768px){
.form p.form-text{text-align: center;line-height: 1.4em;}
.form form { text-align: center; }
.form .form-id { font-size: 18px; width: 90%;}
.form .form-id:focus{background-color: #fff;}
}

/*add*/
.common-box { background: #fff; border-radius: 6px; margin-bottom: 5%; padding: 4% 10%; position: relative; }
.common-box.information-box { padding: 0; }
.common-box.box-type02 { padding: 0 0 2%; }
.common-box.box-type02 h3 { background: #9f2429; border-radius: 6px 6px 0 0; color: #fff; font-weight: bold; line-height: 1.2em; margin-bottom: 2%; padding: 1em; text-align: center; }
.common-box.box-type02 h3 + p { padding: 2% 4% 4%; }
.information-box h3 { border-radius: 6px 6px 0 0; color: #fff; font-weight: bold; line-height: 1.2em; padding: 1.2em 1em 1em; text-align: center; }
.information-box#number-one h3 { background: #9f2427; }
.information-box#number-two h3 { background: #cab387; }
.information-box h3 span { font-size: 24px; }
.information-box .inner-box { display: flex; flex-direction: row; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; padding: 1% 0 1%; }
.information-box .inner-box:not(:last-of-type) { position: relative; }
.information-box .inner-box:not(:last-of-type)::after { border-bottom: 1px solid #ccc; content: ""; position: absolute; left: 2.5%; bottom: 0; width: 95%; }
.information-box dl { flex-grow: 1; flex-basis: 33.3%; flex-shrink: 0; max-width: 33.3%; padding: 2% 3%; }
.information-box dl:not(:last-of-type) { border-right: 1px solid #ccc; }
.information-box dl dt,
.information-box dl dd { text-align: center; }
.information-box dl dt { font-size: 16px; margin-bottom: 1.2em; }
.information-box dl dd { font-size: 18px; font-weight: bold; line-height: 1.6em; }
.form .link-button a{color: #fff; text-decoration: none;padding: 1em 0 1.1em; width: 100%; display: block;}
#refund .inner-heading { font-size: 20px; font-weight: bold; line-height: 1.2em; text-align: center; margin-bottom: 1.6em; }
#refund .content-wrap:not(:last-of-type) { border-bottom: 1px solid #9c9c9c; margin-bottom: 30px; padding-bottom: 30px; }
#refund .content-wrap .content-heading { font-size: 18px; font-weight: bold; line-height: 1.2em; margin-bottom: 1em; padding-left: 1.1em; position: relative; }
#refund .content-wrap .content-heading::before { content: "●"; color: #9c9c9c; position: absolute; top: 0; left: 0; }
#refund .content-wrap .period-box { background: #f0f0f0; color: #000; font-size: 18px; font-weight: bold; line-height: 1.4em; padding: 1.2em .8em 1.1em; }
#after-ticketing .inner-wrap { border-bottom: 1px dotted #ddd; margin-bottom: 30px; padding-bottom: 30px;}



@media screen and (max-width: 768px){
  .section-wrap h2 { font-size: 22px; }
  .information-box .inner-box { padding: 9% 0; }
  .information-box dl { flex-basis: 100%; max-width: 100%; padding: 0; }
  .information-box dl dt { margin-bottom: .5em; }
  .information-box dl:not(:last-of-type) { padding: 0 4%; margin-bottom: 7%; border-right: none; }
  .common-box { padding: 9% 6%; }
  #refund .inner-heading { font-size: 5vw; }
  #refund .content-wrap .period-box { text-align: left; width: 100%; }
  .caution-box p.caution-heading { margin-bottom: 10px; }


}

/* フォーム */
.form p.form-text{text-align: center; font-size: 16px; line-height: 1em; font-weight: bold; margin-bottom: 20px;}
.form form { text-align: center; }
.form .form-id {padding:10px 10px; font-size: 18px; margin: 0 auto 50px auto; width: 44%; border: 1px solid #95989a; background-color: #fff; outline: none; transition: 0.12s; }
.form .form-id:focus{background-color: #fff;}

@media screen and (max-width: 768px){
.form p.form-text{text-align: center;line-height: 1.4em;}
.form form { text-align: center; }
.form .form-id { font-size: 18px; width: 90%;}
.form .form-id:focus{background-color: #fff;}
}