@charset "UTF-8";
@media only screen and (max-width: 767px) {
  /************************************************
***   basic
************************************************/
  html {
    font-size: 62.5%; }
  body {
    font-family: Helvetica, Arial, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "モリサワ 新ゴ R", "Droid Sans", "メイリオ", sans-serif;
    word-wrap: break-word;
    overflow-wrap: break-word;
    overflow-x: hidden;
    width: 100%;
    height: 100%; }
  img {
    width: 100%;
    height: auto; }
  * {
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    zoom: 1; }
  a {
    outline: none; }
  .pc_n {
    display: none; }
  .pc_b {
    display: none; }
  .pc_i {
    display: none; }
  .pc_ib {
    display: none; }
  .sp_n {
    display: none; }
  .sp_b {
    display: block; }
  .sp_i {
    display: inline; }
  .sp_ib {
    display: inline-block; }
  .clearfix:after, header nav ul:after, footer .archive:after, footer .copyright:after, footer .copyright ul:after {
    display: block;
    clear: both;
    content: ""; }
  .inner {
    margin: 0 auto; }
  /************************************************
***   wrapper
************************************************/
  #wrapper {
    background: #000; }
  /************************************************
***   mainvisual
************************************************/
  #mainvisual {
    padding: 8% 0 8% 0;
    position: relative;
    background: url("../images/sp/mainvisual/bg.jpg") 50% 0 #fff no-repeat;
    background-size: cover;
    text-align: center; }
    #mainvisual h1 {
      width: 95%;
      margin: 0 auto 0 auto; }
    #mainvisual p:nth-of-type(1) {
      width: 92.96875%;
      margin: 0 auto 5% auto; }
    #mainvisual p:nth-of-type(2) {
      width: 90.625%;
      margin: 0 auto 0 auto; }
    #mainvisual p:nth-of-type(3) {
      width: 17.96875%;
      margin: 0 0 0 0;
      position: absolute;
      top: 2%;
      left: 3%; }
      #mainvisual p:nth-of-type(3) a {
        transition: 0.3s; }
  /************************************************
***   header
************************************************/
  header {
    width: 100%;
    padding: 0 3.125%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1; }
    header .btn-hamburger {
      width: 25px;
      height: 20px;
      margin: 10px 0 0 0;
      z-index: 1;
      float: right;
      position: relative;
      right: 0; }
      header .btn-hamburger span {
        width: 100%;
        height: 2px;
        margin: 0 auto;
        display: inline-block;
        transition: 0.4s;
        box-sizing: border-box;
        position: absolute;
        right: 0;
        left: 0;
        background-color: #000; }
        header .btn-hamburger span:nth-of-type(1) {
          top: 0px; }
        header .btn-hamburger span:nth-of-type(2) {
          top: 50%;
          -webkit-transform: translateY(-50%);
              -ms-transform: translateY(-50%);
                  transform: translateY(-50%); }
        header .btn-hamburger span:nth-of-type(3) {
          bottom: 0px; }
      header .btn-hamburger:after {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
                transform: translateY(-50%);
        left: -35px;
        content: 'MENU';
        color: #000;
        font-size: 10px;
        font-size: 1.0rem;
        font-weight: bold;
        text-decoration: none;
        text-align: center;
        transition: all .4s; }
    header .btn-hamburger.active {
      z-index: 3; }
      header .btn-hamburger.active span:nth-of-type(1) {
        top: 50%;
        -webkit-transform: translateY(-50%) rotate(-45deg);
            -ms-transform: translateY(-50%) rotate(-45deg);
                transform: translateY(-50%) rotate(-45deg);
        box-shadow: none; }
      header .btn-hamburger.active span:nth-of-type(2) {
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
      header .btn-hamburger.active span:nth-of-type(3) {
        bottom: 50%;
        -webkit-transform: translateY(50%) rotate(45deg);
            -ms-transform: translateY(50%) rotate(45deg);
                transform: translateY(50%) rotate(45deg);
        box-shadow: none; }
    header nav {
      width: 100%;
      height: 100%;
      position: fixed;
      top: 0;
      left: 0;
      background: #fff;
      display: none; }
      header nav ul {
        width: 93.75%;
        margin: 49px auto 0 auto; }
        header nav ul li {
          background: #02004B; }
          header nav ul li a {
            padding: 5%;
            font-size: calc(12px + 10 * ((100vw - 320px) / 447));
            font-weight: 600;
            font-family: 'Dosis', sans-serif;
            color: #fff;
            letter-spacing: 2px;
            display: block;
            text-decoration: none;
            position: relative;
            z-index: 1;
            text-align: center; }
            header nav ul li a:after {
              content: "";
              width: 2%;
              padding: 2% 0 0 0;
              border-top: 1px solid #fff;
              border-right: 1px solid #fff;
              position: absolute;
              top: 50%;
              -webkit-transform: translate(0, -50%) rotate(45deg);
                  -ms-transform: translate(0, -50%) rotate(45deg);
                      transform: translate(0, -50%) rotate(45deg);
              right: 5%; }
        header nav ul li + li {
          margin: 1px 0 0 0; }
  /************************************************
***   main
************************************************/
  main {
    display: block; }
    main .outline,
    main .booth,
    main .terrace,
    main .access {
      padding: 5% 0 8% 0; }
      main .outline .inner,
      main .booth .inner,
      main .terrace .inner,
      main .access .inner {
        width: 93.75%;
        margin: 0 auto; }
        main .outline .inner h2,
        main .booth .inner h2,
        main .terrace .inner h2,
        main .access .inner h2 {
          margin: 0 0 4% 0;
          padding: 0 0 3% 0;
          font-size: 18px;
          font-size: 1.8rem;
          line-height: 1.2;
          font-family: 'Open Sans', sans-serif;
          font-weight: 700;
          letter-spacing: 3px; }
  /************************************************
***   outline
************************************************/
  #outline {
    background: url("../common/images/outline/bg.jpg");
    background-size: 10%;
    position: relative; }
    #outline .inner {
      width: 87.5%;
      position: relative; }
      #outline .inner h2 {
        color: #02004b;
        border-bottom: 1px solid #02004b; }
      #outline .inner article {
        margin: 0 0 0 0; }
        #outline .inner article h3 {
          margin: 0 0 5% 0;
          font-size: 16px;
          font-size: 1.6rem;
          line-height: 1.6;
          color: #02004b;
          letter-spacing: 1.6px; }
          #outline .inner article h3 span {
            font-family: 'Open Sans', sans-serif;
            font-weight: 700; }
        #outline .inner article p {
          font-size: 12px;
          font-size: 1.2rem;
          line-height: 1.8;
          color: #02004b;
          letter-spacing: 2px; }
          #outline .inner article p a {
            color: #1da1f2;
            font-weight: bold;
            text-decoration: none; }
            #outline .inner article p a:hover {
              text-decoration: underline; }
        #outline .inner article p + p {
          margin: 5% 0 0 0; }
      #outline .inner .twitter {
        margin: 5% 0 0 0;
        text-align: center; }
        #outline .inner .twitter iframe {
          width: 300px !important;
          height: 250px !important; }
  /************************************************
***   booth
************************************************/
  #booth {
    background: url("../common/images/booth/bg.jpg");
    background-size: 10%;
    position: relative;
    overflow: hidden; }
    #booth .inner {
      width: 87.5%; }
      #booth .inner h2 {
        color: #000;
        border-bottom: 1px solid #000; }
        #booth .inner h2 span {
          font-size: 16px;
          font-size: 1.6rem; }
      #booth .inner > p {
        font-size: 12px;
        font-size: 1.2rem;
        line-height: 1.8;
        letter-spacing: 2px; }
      #booth .inner .dekaslot {
        width: 104.1%;
        margin: 3% 0 0 0;
        padding: 130.4279365079365% 0 0 0;
        background: url("../common/images/booth/img_dekaslot.png") 0 0 no-repeat;
        background-size: contain; }
      #booth .inner .instagram-campaign {
        margin: 5% 0 0 0;
        padding: 8% 5% 10%;
        border: 5px solid #ce2f7b;
        background: #fff;
        background-size: 80%; }
        #booth .inner .instagram-campaign h3 {
          width: 96.6%;
          margin: 0 auto 5% auto;
          text-align: center; }
        #booth .inner .instagram-campaign .overview {
          margin: 0 0 3% 0;
          font-size: 12px;
          font-size: 1.2rem;
          line-height: 1.8;
          letter-spacing: 2px; }
        #booth .inner .instagram-campaign .campaign {
          margin: 0 auto;
          padding: 6% 5%;
          background: rgba(255, 248, 147, 0.7); }
          #booth .inner .instagram-campaign .campaign h4 {
            margin: 0 0 6% 0;
            font-size: 16px;
            font-size: 1.6rem;
            line-height: 1.4;
            letter-spacing: 1.6px;
            color: #ce2f7b;
            text-align: center; }
          #booth .inner .instagram-campaign .campaign p {
            font-size: 14px;
            font-size: 1.4rem;
            line-height: 1.6;
            text-align: center;
            color: #ff0000; }
          #booth .inner .instagram-campaign .campaign ol li dl {
            display: table; }
            #booth .inner .instagram-campaign .campaign ol li dl dt {
              margin: 0 5% 0 0; }
              #booth .inner .instagram-campaign .campaign ol li dl dt span {
                padding: 5px 8px;
                font-size: 10px;
                font-size: 1.0rem;
                background: #fff;
                border: 1px solid #000;
                border-radius: 100px;
                letter-spacing: 0.6px;
                word-break: keep-all;
                display: table-cell; }
            #booth .inner .instagram-campaign .campaign ol li dl dd {
              padding: 0 0 0 5%;
              display: table-cell;
              font-size: 12px;
              font-size: 1.2rem;
              line-height: 1.8; }
              #booth .inner .instagram-campaign .campaign ol li dl dd a {
                color: #0094cd; }
          #booth .inner .instagram-campaign .campaign ol li + li {
            margin: 5% 0 0 0; }
        #booth .inner .instagram-campaign .campaign-01 ol {
          margin: 5% 0 3% 0; }
      #booth .inner .twitter-campaign {
        margin: 5% 0 0 0;
        padding: 8% 5% 10%;
        border: 5px solid #00acee;
        background: url("../common/images/booth/bg_twitter-campaign.png") 50% 20px no-repeat #fff;
        background-size: 80%; }
        #booth .inner .twitter-campaign h3 {
          width: 80%;
          margin: 0 auto 5% auto;
          text-align: center; }
        #booth .inner .twitter-campaign .overview {
          margin: 0 0 3% 0;
          font-size: 12px;
          font-size: 1.2rem;
          line-height: 1.8;
          letter-spacing: 2px; }
        #booth .inner .twitter-campaign .campaign {
          margin: 0 auto;
          padding: 6% 5%;
          background: rgba(255, 248, 147, 0.7); }
          #booth .inner .twitter-campaign .campaign h4 {
            margin: 0 0 6% 0;
            font-size: 16px;
            font-size: 1.6rem;
            line-height: 1.4;
            letter-spacing: 1.6px;
            color: #00acee;
            text-align: center; }
          #booth .inner .twitter-campaign .campaign p {
            font-size: 14px;
            font-size: 1.4rem;
            line-height: 1.6;
            text-align: center;
            color: #ff0000; }
          #booth .inner .twitter-campaign .campaign ol li dl {
            display: table; }
            #booth .inner .twitter-campaign .campaign ol li dl dt {
              margin: 0 5% 0 0; }
              #booth .inner .twitter-campaign .campaign ol li dl dt span {
                padding: 5px 8px;
                font-size: 10px;
                font-size: 1.0rem;
                background: #fff;
                border: 1px solid #000;
                border-radius: 100px;
                letter-spacing: 0.6px;
                word-break: keep-all;
                display: table-cell; }
            #booth .inner .twitter-campaign .campaign ol li dl dd {
              padding: 0 0 0 5%;
              display: table-cell;
              font-size: 12px;
              font-size: 1.2rem;
              line-height: 1.8; }
              #booth .inner .twitter-campaign .campaign ol li dl dd a {
                color: #0094cd; }
          #booth .inner .twitter-campaign .campaign ol li + li {
            margin: 5% 0 0 0; }
        #booth .inner .twitter-campaign .campaign + .campaign {
          margin: 5% 0 0 0; }
        #booth .inner .twitter-campaign .campaign-01 ol {
          margin: 5% 0 3% 0; }
        #booth .inner .twitter-campaign .campaign-02 ol {
          margin: 5% 0 0 0; }
        #booth .inner .twitter-campaign .chance {
          margin: 7.5% 0 0 0;
          font-size: 12px;
          font-size: 1.2rem;
          line-height: 1.6;
          color: #f00;
          text-align: center; }
          #booth .inner .twitter-campaign .chance span {
            position: relative;
            display: inline-block; }
        #booth .inner .twitter-campaign .btn {
          margin: 5% auto 0;
          text-align: center; }
          #booth .inner .twitter-campaign .btn a {
            width: 220px;
            margin: 0 auto;
            padding: 15px 0 15px 0;
            display: block;
            border-radius: 100px;
            font-size: 14px;
            font-size: 1.4rem;
            font-weight: bold;
            line-height: 1;
            background: #00acee;
            color: #fff;
            text-decoration: none;
            box-shadow: 0 6px 0 #0094cd;
            position: relative;
            letter-spacing: 2px; }
            #booth .inner .twitter-campaign .btn a:hover {
              top: 5px;
              box-shadow: none;
              text-decoration: none; }
            #booth .inner .twitter-campaign .btn a:after {
              content: "";
              width: 5px;
              height: 5px;
              border-top: 2px solid #fff;
              border-right: 2px solid #fff;
              position: absolute;
              top: 48%;
              -webkit-transform: rotate(45deg) translateY(-50%);
                  -ms-transform: rotate(45deg) translateY(-50%);
                      transform: rotate(45deg) translateY(-50%);
              right: 7.5%; }
        #booth .inner .twitter-campaign .coming {
          margin: 5% auto 0;
          text-align: center; }
          #booth .inner .twitter-campaign .coming a {
            width: 220px;
            margin: 0 auto;
            padding: 15px 0 15px 0;
            display: block;
            border-radius: 100px;
            font-size: 14px;
            font-size: 1.4rem;
            font-weight: bold;
            line-height: 1;
            background: #00acee;
            color: #fff;
            text-decoration: none;
            box-shadow: 0 6px 0 #0094cd;
            position: relative;
            letter-spacing: 2px; }
  /************************************************
***   terrace
************************************************/
  #terrace {
    background: url("../common/images/terrace/bg.jpg");
    background-size: cover;
    position: relative; }
    #terrace .inner {
      width: 87.5%; }
      #terrace .inner h2 {
        color: #000;
        border-bottom: 1px solid #000; }
      #terrace .inner h3 {
        margin: 0 0 3% 0;
        font-size: 16px;
        font-size: 1.6rem; }
      #terrace .inner p {
        font-size: 12px;
        font-size: 1.2rem;
        line-height: 1.8;
        letter-spacing: 2px; }
      #terrace .inner ul {
        margin: 3% 0 0 0; }
        #terrace .inner ul li + li {
          margin: 3% 0 0 0; }
  /************************************************
***   access
************************************************/
  #access {
    background: url("../images/pc/access/bg.png") 0 0 no-repeat #110e50;
    background-size: contain; }
    #access .inner {
      width: 87.5%; }
      #access .inner h2 {
        color: #fff;
        border-bottom: 1px solid #fff; }
      #access .inner .information h3 {
        margin: 0 0 5% 0;
        padding: 6px 0;
        font-size: 14px;
        font-size: 1.4rem;
        line-height: 1.4;
        color: #02004b;
        background: #ffff66;
        text-align: center;
        letter-spacing: 3px; }
      #access .inner .information .left + .right {
        margin: 3% 0 0 0; }
      #access .inner .information dl {
        margin: 0 0 0 0;
        letter-spacing: 2px; }
        #access .inner .information dl dt {
          width: 80px;
          margin: 0 0 3% 0;
          font-size: 10px;
          font-size: 1.0rem;
          color: #0a125c;
          text-align: center;
          display: inline-block;
          vertical-align: top; }
          #access .inner .information dl dt span {
            width: 80px;
            padding: 8px 10px;
            background: #fff;
            display: block; }
        #access .inner .information dl dd {
          width: calc(100% - 100px);
          padding: 5px 3% 0 3%;
          font-size: 12px;
          font-size: 1.2rem;
          line-height: 1.6;
          color: #fff;
          display: inline-block;
          vertical-align: top; }
          #access .inner .information dl dd a {
            color: #fff; }
      #access .inner .information dl + dl {
        margin: 3% 0 0 0; }
      #access .inner .information .map {
        margin: 5% 0 0 0; }
        #access .inner .information .map iframe {
          width: 100%;
          height: 200px; }
      #access .inner .information .caution {
        margin: 5% 0 0 0; }
        #access .inner .information .caution p {
          font-size: 11px;
          font-size: 1.1rem;
          line-height: 1.6;
          color: #fff; }
  /************************************************
***   footer
************************************************/
  footer {
    background: #c4000f; }
    footer .archive {
      width: 93.75%;
      margin: 0 auto;
      padding: 5% 0 3% 0; }
      footer .archive p {
        margin: 0 0 5% 0;
        font-size: 10px;
        font-size: 1.0rem;
        color: #fff;
        letter-spacing: 2px; }
        footer .archive p span {
          padding: 5px 8px;
          border: 1px solid rgba(255, 255, 255, 0.5); }
      footer .archive ul {
        padding: 0 0 0 3%; }
        footer .archive ul li {
          position: relative; }
          footer .archive ul li a {
            font-size: 11px;
            font-size: 1.1rem;
            color: #fff;
            letter-spacing: 2px;
            text-decoration: none; }
            footer .archive ul li a:hover {
              text-decoration: underline; }
        footer .archive ul li + li {
          margin: 3% 0 0 0; }
    footer .copyright {
      padding: 8% 0 8%;
      border-top: 1px solid rgba(255, 255, 255, 0.5); }
      footer .copyright p {
        font-size: 10px;
        font-size: 1.0rem;
        color: #fff;
        letter-spacing: 1.2px;
        line-height: 1.4;
        text-align: center; }
      footer .copyright ul {
        margin: 5% 0 0 0;
        text-align: center; }
        footer .copyright ul li {
          display: inline-block;
          position: relative; }
          footer .copyright ul li a {
            font-size: 11px;
            font-size: 1.1rem;
            color: #fff;
            letter-spacing: 2px;
            text-decoration: none; }
            footer .copyright ul li a:hover {
              text-decoration: underline; }
        footer .copyright ul li + li {
          margin: 0 0 0 3%; }
  .btn-top {
    width: 8%;
    position: fixed;
    right: 3%;
    bottom: 1.5%; } }
