@charset "UTF-8";
/*---------------------------------------------------------------------------
reset
---------------------------------------------------------------------------*/
figure {
  margin: 0;
  padding: 0; }

/*--------------------------------------------------------------
sp-size
--------------------------------------------------------------*/
/*--------------------------------------------------------------
Media Queries
--------------------------------------------------------------*/
/*--------------------------------------------------------------
fontsize
--------------------------------------------------------------*/
/*---------------------------------------------------------------------------
font
---------------------------------------------------------------------------*/
@font-face {
  font-family: "YakuHanJP-Light";
  src: url(/sp/common/font/YakuHanJP/YakuHanJP-Light.eot) format("eot"), url(/sp/common/font/YakuHanJP/YakuHanJP-Light.woff) format("woff"); }
html {
  font-size: 100%; }

body {
  font-family: YakuHanJP-Light, "游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro",メイリオ,Meiryo,sans-serif;
  font-size: 1.0rem; }

.en {
  font-family: 'Satisfy', cursive; }

/*---------------------------------------------------------------------------
color
---------------------------------------------------------------------------*/
body {
  color: #000; }

#loading {
  background-color: #fff; }

.header {
  background-color: #fff; }
  .header nav {
    background: #bc2a2a; }

a {
  color: #000; }

#pageTop {
  background-color: #bc2a2a;
  color: #fff;
  line-height: 1.5;
  padding: 5px 10px;
  font-size: 1.5rem; }
  @media screen and (min-width: 600px) {
    #pageTop {
      font-size: 2rem; } }

/*---------------------------------------------------------------------------

common

---------------------------------------------------------------------------*/
body {
  overflow-x: hidden; }

img[src$=".svg"] {
  width: 100%; }

.content {
  padding: 40px 5%; }
  @media screen and (min-width: 600px) {
    .content {
      padding: 5%; } }

@media screen and (min-width: 600px) {
  .flex-wrapper {
    display: flex;
    flex-wrap: wrap; } }

.clf:after {
  content: "";
  clear: both;
  display: block; }

a {
  text-decoration: none; }

.btn {
  text-align: center; }
  .btn a, .btn span {
    font-size: 1.0rem;
    display: inline-block;
    text-align: center;
    font-weight: bold;
    padding: 0;
    margin: 0 auto;
    text-decoration: none;
    border-bottom: 2px solid #000;
    border-radius: 0;
    /*border: 1px solid #000;
    background-color:#000;
    color: #fff;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;*/ }
    .btn a i, .btn span i {
      margin-right: 10px;
      color: #bc2a2a; }
  .btn a:hover {
    color: #bc2a2a;
    text-decoration: none;
    border-color: #bc2a2a; }

.viewPC {
  display: none; }
  @media (min-width: 1000px) {
    .viewPC {
      display: block; } }

.viewS {
  display: block; }
  @media (min-width: 1000px) {
    .viewS {
      display: none; } }

.ttl-style1 {
  font-weight: bold;
  font-size: 1.5rem;
  position: relative;
  margin-bottom: 20px;
  color: #bc2a2a;
  text-align: center; }
  @media screen and (min-width: 600px) {
    .ttl-style1 {
      font-size: 2rem; } }

h2 {
  display: block;
  margin-bottom: 40px;
  text-align: center; }
  h2 a {
    cursor: pointer; }

/*---------------------------------------------------------------------------

loading

---------------------------------------------------------------------------*/
#loading {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 100;
  text-align: center;
  display: table;
  top: 0;
  background-color: #fff; }
  #loading #loadIn {
    display: table-cell;
    text-align: center;
    vertical-align: middle; }
    #loading #loadIn img {
      width: 100%;
      max-width: 90%;
      margin-bottom: 20px; }
      @media screen and (min-width: 480px) {
        #loading #loadIn img {
          width: 400px; } }
    #loading #loadIn i {
      color: #f0acad; }

/*---------------------------------------------------------------------------

mainvisual

---------------------------------------------------------------------------*/
#mainvisual {
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100% auto;
  margin: 0 auto;
  width: 100%;
  height: 144vw;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background-image: url(images/mainvisual_s.jpg); }
  @media screen and (min-width: 600px) {
    #mainvisual {
      max-width: 1424px;
      height: 50.5vw;
      max-height: 720px;
      background-image: url(images/mainvisual_pc.jpg); } }
  @media only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 599px), only screen and (min-resolution: 192dpi) and (max-width: 599px) {
    #mainvisual {
      background-image: url("images/mainvisual_s@2x.jpg"); } }
  @media only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 600px), only screen and (min-resolution: 192dpi) and (min-width: 600px) {
    #mainvisual {
      background-image: url("images/mainvisual_pc@2x.jpg"); } }
  #mainvisual h1 {
    display: block; }

/*---------------------------------------------------------------------------

header

---------------------------------------------------------------------------*/
.header button .fa {
  font-size: 1.5rem;
  line-height: 1.7;
  vertical-align: text-top; }
  @media screen and (min-width: 600px) {
    .header button .fa {
      font-size: 2rem; } }
.header a {
  text-decoration: none; }
.header h1 {
  margin-right: 0; }
.header nav {
  display: none; }
  @media screen and (min-width: 960px) {
    .header nav {
      display: block; } }
@media screen and (min-width: 960px) {
  .header ul {
    margin: 0 auto;
    overflow: hidden;
    display: flex;
    justify-content: center; } }
  @media screen and (min-width: 960px) and (min-width: 600px) {
    .header ul li {
      float: left; } }

@media screen and (min-width: 960px) {
  .header .global {
    width: 100%; } }
@media screen and (min-width: 960px) {
  .header .global li {
    margin-right: 45px;
    margin-top: 3px;
    text-align: center;
    line-height: 1.4; } }
@media screen and (min-width: 960px) {
  .header .global li:last-child {
    margin-right: 0; } }
.header .global li a {
  font-weight: bold; }
  @media screen and (min-width: 960px) {
    .header .global li a {
      color: #fff;
      display: block;
      padding-top: 5px; } }
  .header .global li a .fa {
    margin-right: 10px; }

/*---------------------------------------------------------------------------
drawer
---------------------------------------------------------------------------*/
.drawer--left .drawer-nav {
  left: -15rem; }

.drawer-nav {
  width: 15rem;
  z-index: 51;
  background-color: #f0acad; }

/*---------------------------------------------------------------------------

section

---------------------------------------------------------------------------*/
.bg {
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
  background-position: center top;
  background-repeat: repeat-y;
  background-size: 100% auto;
  background-image: url(images/bg_s.png); }
  @media screen and (min-width: 600px) {
    .bg {
      background-image: url(images/bg.png); } }
  @media only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 599px), only screen and (min-resolution: 192dpi) and (max-width: 599px) {
    .bg {
      background-image: url("images/bg_s@2x.png"); } }
  @media only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 600px), only screen and (min-resolution: 192dpi) and (min-width: 600px) {
    .bg {
      background-image: url("images/bg@2x.png"); } }
  @media screen and (min-width: 1000px) {
    .bg {
      background-size: 1424px; } }
  .bg .content-inner {
    max-width: 1000px;
    margin: 0 auto; }
    .bg .content-inner #nav {
      text-align: center; }
      .bg .content-inner #nav ul {
        margin-bottom: 40px; }
        .bg .content-inner #nav ul li {
          margin: 0 10px;
          display: inline;
          font-weight: bold;
          font-size: 1.0rem; }
          @media screen and (min-width: 600px) {
            .bg .content-inner #nav ul li {
              font-size: 1.25rem;
              margin: 0 20px; } }
  @media screen and (min-width: 600px) and (min-width: 600px) {
    .bg .content-inner #nav ul li {
      font-size: 1.5rem; } }

          .bg .content-inner #nav ul li .fa {
            margin-right: 10px;
            color: #bc2a2a;
            font-weight: bold; }
    .bg .content-inner section {
      /*background: #fff;
      padding: $sp-l;*/
      width: 100%;
      padding-top: 40px; }
      .bg .content-inner section .hall-block {
        margin-bottom: 40px; }
        .bg .content-inner section .hall-block .hall-name {
          font-size: 1.0rem;
          font-weight: bold;
          background: #bc2a2a;
          padding: 5px 10px;
          display: inline-block;
          margin-bottom: 20px;
          color: #fff; }
          @media screen and (min-width: 600px) {
            .bg .content-inner section .hall-block .hall-name {
              margin-left: 20px; } }
        .bg .content-inner section .hall-block ul.event-list {
          width: 100%; }
          @media screen and (min-width: 960px) {
            .bg .content-inner section .hall-block ul.event-list {
              align-items: stretch;
              display: flex; } }
          .bg .content-inner section .hall-block ul.event-list li {
            width: 100%;
            box-sizing: border-box;
            margin-bottom: 20px; }
            @media screen and (min-width: 600px) {
              .bg .content-inner section .hall-block ul.event-list li {
                width: calc(100%/2);
                padding: 0 20px 20px;
                box-sizing: border-box;
                align-items: stretch;
                display: flex; } }
            .bg .content-inner section .hall-block ul.event-list li a {
              text-decoration: none;
              width: 100%;
              display: block;
              background: #fff;
              padding: 20px;
              box-sizing: border-box;
              border: 1px solid #bc2a2a;
              /*align-items: stretch;
              display: flex;
              flex-wrap: wrap;*/ }
              @media screen and (min-width: 960px) {
                .bg .content-inner section .hall-block ul.event-list li a {
                  display: flex;
                  justify-content: space-between; } }
              .bg .content-inner section .hall-block ul.event-list li a:hover {
                background: #f0acad;
                border-color: #f0acad; }
              .bg .content-inner section .hall-block ul.event-list li a figure {
                margin-bottom: 20px; }
                @media screen and (min-width: 960px) {
                  .bg .content-inner section .hall-block ul.event-list li a figure {
                    width: 50%;
                    box-sizing: border-box;
                    padding-right: 10px;
                    margin-bottom: 0; } }
                .bg .content-inner section .hall-block ul.event-list li a figure figcaption {
                  font-size: 0.75rem;
                  margin: 10px 0; }
              @media screen and (min-width: 960px) {
                .bg .content-inner section .hall-block ul.event-list li a .text-block {
                  width: 50%;
                  box-sizing: border-box;
                  padding-left: 10px; } }
              .bg .content-inner section .hall-block ul.event-list li a .text-block h3 {
                margin-bottom: 20px; }
                .bg .content-inner section .hall-block ul.event-list li a .text-block h3 span {
                  font-size: 1.0rem; }
              .bg .content-inner section .hall-block ul.event-list li a .text-block .date {
                margin-bottom: 10px; }
              .bg .content-inner section .hall-block ul.event-list li a .text-block .text-link {
                font-weight: bold; }
                .bg .content-inner section .hall-block ul.event-list li a .text-block .text-link .fa {
                  margin-right: 5px;
                  color: #bc2a2a;
                  font-weight: bold; }
            .bg .content-inner section .hall-block ul.event-list li .nolink {
              pointer-events: none; }

/*---------------------------------------------------------------------------

footer

---------------------------------------------------------------------------*/
footer {
  background-color: #000;
  padding: 20px 0; }
  @media (min-width: 999px) {
    footer {
      padding: 20px; } }
  footer .returnBlock {
    margin-top: 0; }
    footer .returnBlock a {
      color: #fff; }