@charset "UTF-8";
/*-----------------------------------
    ブレイクポイント
-----------------------------------*/
/*$tablet: "only screen and (max-width:959px)";*/
/*-----------------------------------
    カラー
-----------------------------------*/
/*-----------------------------------
    フォント
-----------------------------------*/
/*
  1. より直感的なボックスサイズのモデルを使用
*/
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;700&display=swap");
*, *::before, *::after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

/*
  2. デフォルトのマージンを削除
*/
* {
  margin: 0; }

/*
  3. 高さは%ベースを使用
*/
html, body {
  height: 100%; }

/*
  タイポグラフィの微調整
  4. アクセシブルなline-heightを追加
  5. テキストのレンダリングを改善
*/
body {
  font-family: 'Noto Sans JP','Roboto', "游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
  /*font-family:"Roboto","游ゴシック",YuGothic,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif;*/
  /*font-family:'Roboto','Noto Sans JP', "游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;*/
  font-size: 16px;
  line-height: 1.7em;
  -webkit-font-smoothing: antialiased; }

/*
  6. メディア要素のデフォルトを改善
*/
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%; }

/*
  7. フォームのfontに関するデフォルトを削除
*/
input, button, textarea, select {
  font: inherit; }

/*
  8. テキストのオーバーフローを回避
*/
p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word; }

/*
  9. ルートのスタックコンテキストを作成
*/
#root, #__next {
  isolation: isolate; }

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, input, textarea, p, th, td {
  margin: 0;
  padding: 0; }

address, caption, em, strong, th {
  font-style: normal; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

object, embed {
  vertical-align: top; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%; }

img, abbr {
  border: 0;
  vertical-align: bottom; }

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

ol, ul {
  list-style: none; }

.spOnly {
  display: none; }
  @media only screen and (max-width: 599px) {
    .spOnly {
      display: block; } }

@media only screen and (max-width: 599px) {
  .spNone {
    display: none; } }

@media only screen and (max-width: 1099px) {
  .pcOnly {
    display: none; } }

@media only screen and (min-width: 1100px) {
  .pcNone {
    display: none; } }

br .spOnly {
  display: none; }
  @media only screen and (max-width: 599px) {
    br .spOnly {
      display: inline-block; } }

@media only screen and (max-width: 599px) {
  br .spNone {
    display: none; } }

.spOnly {
  display: none; }
  @media only screen and (max-width: 599px) {
    .spOnly {
      display: block; } }

@media only screen and (max-width: 599px) {
  .spNone {
    display: none; } }

@media only screen and (max-width: 1099px) {
  .pcOnly {
    display: none; } }

@media only screen and (min-width: 1099px) {
  .pcNone {
    display: none; } }

.junbi {
  width: 100%;
  padding: 100px 0 0 0;
  text-align: center; }
  .junbi img {
    width: 700px;
    height: auto;
    display: block;
    margin: 0 auto; }
    @media only screen and (max-width: 599px) {
      .junbi img {
        width: 70%;
        height: auto; } }

/*スムーズスクロール*/
html {
  scroll-behavior: smooth; }

/*PC用 背景・右メニュー*/
.bg-back {
  background: url("/festival/files/img/bg_pc2.jpg") center no-repeat;
  background-attachment: scroll;
  /*background-size: auto;*/
  background-size: cover;
  position: fixed;
  height: 100vh;
  width: 100%;
  /*background-attachment: fixed;*/
  z-index: -1; }

header.header {
  position: fixed;
  top: 50%;
  left: calc(1045/1440 * 100vw);
  z-index: 1;
  -webkit-transform: translateX(0) translateY(-50%);
  -ms-transform: translateX(0) translateY(-50%);
  transform: translateX(0) translateY(-50%); }
  header.header .nav_point {
    position: absolute;
    top: -25px;
    right: -17px;
    width: 90px;
    height: auto; }
  header.header .header_bg {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 20px 0 20px 0;
    padding: 50px 30px 20px;
    width: 240px; }
    header.header .header_bg nav ul li {
      margin: 0 0 20px; }
      header.header .header_bg nav ul li a {
        color: #333;
        text-decoration: none;
        padding: 5px;
        -webkit-transition: 0.5s;
        -o-transition: 0.5s;
        transition: 0.5s; }
        header.header .header_bg nav ul li a.active {
          color: #2088ca !important;
          background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #fffb7b));
          background: -webkit-linear-gradient(transparent 60%, #fffb7b 60%);
          background: -o-linear-gradient(transparent 60%, #fffb7b 60%);
          background: linear-gradient(transparent 60%, #fffb7b 60%); }
        header.header .header_bg nav ul li a:hover {
          color: #2088ca; }
    header.header .header_bg .nav_ouboinfo {
      text-align: center;
      margin: 40px 0 0 0; }
      header.header .header_bg .nav_ouboinfo p {
        font-size: 18px;
        margin: 0 0 10px;
        line-height: 1.3em; }
        header.header .header_bg .nav_ouboinfo p span {
          font-size: 14px;
          color: #2088ca;
          background: #caf1f9;
          padding: 3px 0;
          line-height: 1em;
          display: block;
          margin: 0 0 8px; }
  header.header .header_oubobtn {
    margin: 30px 0 0 0; }
    header.header .header_oubobtn a {
      background: url("../img/btn_Bg.png") no-repeat center center;
      background-size: 300px auto;
      color: #fff;
      font-weight: bold;
      font-size: 22px;
      padding: 25px 0;
      letter-spacing: 2px;
      display: block;
      text-align: center;
      text-decoration: none;
      border-radius: 140px;
      -webkit-transition: 3s;
      -o-transition: 3s;
      transition: 3s;
      border: 1px solid #85005d; }
      header.header .header_oubobtn a span {
        display: block;
        font-size: 12px;
        line-height: 12px;
        font-weight: lighter;
        text-align: center;
        margin: 0 0 8px; }
      header.header .header_oubobtn a:hover {
        -webkit-filter: hue-rotate(345deg);
        filter: hue-rotate(345deg); }

/*SP用 ヘッダー・メニュー*/
@media only screen and (max-width: 599px) {
  header {
    position: fixed;
    bottom: 0;
    background: white;
    width: 100%;
    height: 70px;
    z-index: 80;
    background: url("../img/header_bg.png") no-repeat center top;
    background-size: 100% auto;
    text-align: center; }
    header .header_logo {
      width: auto;
      height: 40px;
      display: block;
      margin: 15px 0 15px 130px; }
    header .header_oubo {
      display: block;
      width: 65%;
      height: 54px;
      line-height: 46px;
      background: url("../img/btn_Bg.png") no-repeat center center;
      background-size: 100% auto;
      color: #fff;
      font-size: 20px;
      font-weight: bold;
      text-align: center;
      margin: 10px 0 10px 105px;
      text-decoration: none;
      letter-spacing: 3px;
      border-radius: 10px;
      border: 2px solid #060d27;
      border-bottom: 4px solid #060d27; }
    header .menu-btn {
      position: fixed;
      bottom: 0;
      left: 0;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      height: 70px;
      width: 70px;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      z-index: 90;
      background-color: #060d27; }
      header .menu-btn span {
        content: '';
        display: block;
        height: 3px;
        width: 25px;
        border-radius: 3px;
        background-color: #ffffff;
        position: absolute;
        -webkit-transition: 0.5s;
        -o-transition: 0.5s;
        transition: 0.5s; }
        header .menu-btn span:before {
          content: '';
          display: block;
          height: 3px;
          width: 25px;
          border-radius: 3px;
          background-color: #ffffff;
          position: absolute;
          bottom: 8px;
          -webkit-transition: 0.5s;
          -o-transition: 0.5s;
          transition: 0.5s; }
        header .menu-btn span:after {
          content: '';
          display: block;
          height: 3px;
          width: 25px;
          border-radius: 3px;
          background-color: #ffffff;
          position: absolute;
          top: 8px;
          -webkit-transition: 0.5s;
          -o-transition: 0.5s;
          transition: 0.5s; }
    header .menu-content {
      width: 60%;
      height: calc(55% - 70px);
      position: fixed;
      bottom: 70px;
      left: -100%;
      /*leftの値を変更してメニューを画面外へ*/
      z-index: 80;
      background-color: #060d27;
      -webkit-transition: all 0.5s;
      -o-transition: all 0.5s;
      transition: all 0.5s;
      /*アニメーション設定*/ }
      header .menu-content ul {
        padding: 15px; }
        header .menu-content ul li {
          list-style: none; }
          header .menu-content ul li a {
            display: block;
            width: 100%;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            color: #fff;
            text-decoration: none;
            padding: 9px 15px 10px 0;
            position: relative;
            text-align: left; }
            header .menu-content ul li a::before {
              content: "";
              width: 7px;
              height: 7px;
              border-top: solid 2px #ffffff;
              border-right: solid 2px #ffffff;
              -webkit-transform: rotate(45deg);
              -ms-transform: rotate(45deg);
              transform: rotate(45deg);
              position: absolute;
              right: 11px;
              top: 16px; } }

#menu-btn-check:checked ~ .menu-btn span {
  background-color: rgba(255, 255, 255, 0);
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
  /*メニューオープン時は真ん中の線を透明にする*/ }

#menu-btn-check:checked ~ .menu-btn span::before {
  bottom: 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s; }

#menu-btn-check:checked ~ .menu-btn span::after {
  top: 0;
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s; }

#menu-btn-check {
  display: none; }

/*checkbox隠し*/
#menu-btn-check:checked ~ .menu-content {
  left: 0;
  /*メニューを画面内へ*/ }

/*メインコンテンツ*/
.content {
  width: 400px;
  margin: 0 auto;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  background: #fff;
  -webkit-box-shadow: 0px 0px 20px 3px rgba(35, 111, 175, 0.3);
  box-shadow: 0px 0px 20px 3px rgba(35, 111, 175, 0.3);
  /*& #application{
		padding: 0 25px;
	}
	& #caution{
		padding: 0 25px;
	}
	& #today{
		padding: 0 25px;
	}*/ }
  @media only screen and (max-width: 599px) {
    .content {
      width: auto;
      border: none;
      -webkit-box-shadow: none;
      box-shadow: none;
      /*margin: 0 15px;*/ } }
  .content #about, .content #application, .content #caution, .content #today, .content #gallery {
    padding: 0 25px; }
    @media only screen and (max-width: 599px) {
      .content #about, .content #application, .content #caution, .content #today, .content #gallery {
        padding: 0 15px; } }
  .content .title_set {
    margin: 100px 0 40px; }
    .content .title_set img {
      width: 230px;
      height: auto;
      display: block;
      margin: 0 auto; }
  .content .f18 {
    font-size: 18px;
    line-height: 1.5em; }
  .content .f14 {
    font-size: 14px;
    line-height: 1.5em; }
  .content .f12 {
    font-size: 12px;
    line-height: 1.5em; }
  .content .bold {
    font-weight: bold; }
  .content .mv {
    position: relative;
    background: url("../img/bg_pc.jpg") no-repeat center top;
    background-size: auto 100%;
    -o-object-fit: cover;
    object-fit: cover;
    text-align: center; }
    .content .mv img.point_6 {
      position: absolute;
      left: 0;
      top: 0;
      width: 200px;
      height: auto; }
    .content .mv img.logo {
      width: 265px;
      height: auto;
      display: block;
      margin: 0 auto;
      padding: 80px 0 10px; }
    .content .mv img.mv_info {
      width: 350px;
      height: auto;
      display: block;
      margin: 0 auto;
      padding: 0 0 50px 0; }
    .content .mv::before {
      content: '';
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background-color: #fff;
      -webkit-transform: skewY(-7deg) translateY(760px);
      -ms-transform: skewY(-7deg) translateY(760px);
      transform: skewY(-7deg) translateY(760px);
      z-index: 79;
      height: 70px; }
  .content .photo_1 {
    position: relative;
    height: 480px;
    margin: 0 0 50px; }
    .content .photo_1 img.main {
      border-radius: 10px 0 10px 0;
      width: 100%;
      height: auto; }
    .content .photo_1 .photo_txt {
      position: absolute;
      top: 170px;
      left: 0;
      width: 70%;
      background: #fff;
      padding: 15px 15px 15px 0;
      font-size: 16px;
      letter-spacing: 0.5px; }
    .content .photo_1 img.point_1 {
      position: absolute;
      bottom: 0;
      right: 0;
      width: 110px;
      height: auto; }
    .content .photo_1 img.point_2 {
      position: absolute;
      top: 150px;
      right: 50px;
      width: 110px;
      height: auto; }
  .content .photo_2 {
    position: relative;
    height: 500px;
    margin: 0 0 50px; }
    .content .photo_2 img.main {
      border-radius: 0 10px 0 10px;
      width: 100%;
      height: auto; }
    .content .photo_2 .photo_txt {
      position: absolute;
      top: 180px;
      right: 0;
      width: 70%;
      background: #fff;
      padding: 15px 0 15px 15px;
      font-size: 16px;
      letter-spacing: 1px; }
    .content .photo_2 img.point_3 {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 170px;
      height: auto; }
    .content .photo_2 img.point_4 {
      position: absolute;
      top: 130px;
      left: -20px;
      width: 180px;
      height: auto; }
  .content .photo_3 {
    position: relative;
    height: 450px;
    margin: 0 0 50px; }
    .content .photo_3 img.main {
      border-radius: 10px;
      width: 400px;
      height: 450px;
      -o-object-fit: cover;
      object-fit: cover; }
    .content .photo_3 .photo_txt {
      position: absolute;
      -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
      writing-mode: vertical-rl;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      width: 110px;
      height: 290px;
      background: #fff;
      padding: 15px;
      font-size: 16px;
      letter-spacing: 1px; }
    .content .photo_3 img.point_5 {
      position: absolute;
      top: -70px;
      right: -10px;
      width: 130px;
      height: auto; }
  .content .info_oubo dt {
    text-align: center;
    letter-spacing: 5px;
    background: #162850;
    color: #fff;
    margin: 0 0 10px; }
  .content .info_oubo dd {
    margin: 0 0 20px; }
    .content .info_oubo dd.center {
      text-align: center; }
    .content .info_oubo dd .oubo_atte {
      background: #FFE1E2;
      display: block;
      color: #D30003;
      padding: 10px 5px;
      margin: 0 0 20px;
      font-size: 14px;
      line-height: 1.3em; }
    .content .info_oubo dd .oubo_day {
      margin: 0 0 20px;
      font-size: 18px;
      font-weight: bold; }
      .content .info_oubo dd .oubo_day span {
        font-size: 16px; }
    .content .info_oubo dd .oubo_op {
      text-align: left; }
  .content .pickup_photo {
    border: 5px solid #eee;
    padding: 15px;
    margin: 0 0 20px; }
    .content .pickup_photo .title {
      position: relative;
      display: block;
      text-align: center;
      font-size: 18px;
      font-weight: bold;
      padding: 20px 0 0 0;
      margin: 0 0 10px; }
      .content .pickup_photo .title:before {
        content: '';
        background: url("../img/icon_camera.png") no-repeat;
        background-size: 28px;
        position: absolute;
        top: -5px;
        display: inline-block;
        width: 30px;
        height: 30px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%); }
  .content .pickup_app {
    background: url("../img/line_a.png") no-repeat;
    background-size: 400px 17px;
    margin: 30px 0;
    padding: 30px 0 50px;
    position: relative; }
    .content .pickup_app:after {
      content: "";
      background: url("../img/line_a.png") no-repeat;
      background-size: 400px 17px;
      width: 100%;
      height: 17px;
      position: absolute;
      bottom: 0;
      left: 0; }
    .content .pickup_app .title {
      position: relative;
      display: block;
      text-align: center;
      font-size: 18px;
      font-weight: bold;
      padding: 40px 0 0 0;
      margin: 0 0 10px; }
      .content .pickup_app .title:before {
        content: '';
        background: url("../img/icon_sp.png") no-repeat;
        background-size: 28px;
        position: absolute;
        top: 10px;
        display: inline-block;
        width: 30px;
        height: 30px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%); }
    .content .pickup_app .day {
      background: #cef3fa;
      text-align: center;
      padding: 15px;
      display: block;
      font-weight: bold;
      font-size: 18px;
      margin: 10px 0; }
    .content .pickup_app .btn_app {
      display: block;
      text-align: center;
      font-weight: bold;
      background: url("../img/btn_app.png") no-repeat;
      background-size: 300px 57px;
      margin: 20px auto;
      width: 300px;
      height: 57px;
      color: #000;
      text-decoration: none;
      line-height: 57px;
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
      .content .pickup_app .btn_app:hover {
        color: #329fcf; }
    .content .pickup_app .error_txt {
      margin: 30px 0 0 0;
      font-size: 12px;
      line-height: 1.7em;
      display: block; }

footer {
  text-align: center; }
  @media only screen and (max-width: 599px) {
    footer {
      padding: 0 0 70px; } }
  footer .official_logo img {
    width: 60%;
    height: auto;
    display: block;
    margin: 0 auto 30px; }
  footer ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 0 auto 30px;
    width: 90%; }
    footer ul li {
      margin: 0 10px; }
  footer .contact {
    color: cornflowerblue;
    font-size: 12px;
    padding: 5px 0; }
  footer .copyright {
    background: #f2f2f2;
    color: #666;
    font-size: 12px;
    padding: 3px 0; }

.enki {
  font-size: 16px;
  line-height: 1.8em;
  padding: 20px;
  background: #FFF0F1; }
  .enki .title {
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    margin: 0 0 10px; }
  .enki span {
    color: #DB0003;
    font-weight: bold;
    text-decoration: underline; }

.gallery_list img {
  display: block;
  border-radius: 10px 0 10px 0;
  margin: 0 0 10px; }