@charset "UTF-8";
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

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

nav ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

a:visited {
  color: #333;
  text-decoration: none;
}

a:link {
  color: #333;
  text-decoration: none;
}

a img {
  border-width: 0px;
  border-style: none;
  border-color: #fff;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

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

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

ul {
  list-style: none;
}

input,
button,
textarea,
select {
  /* デフォルトスタイルをリセット */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  /* font-familyを継承しないので、継承させる */
  font-family: inherit;
  /* iOSの角丸をリセット */
  border-radius: 0;
  /* box-size */
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  /* 文字の大きさ iOSでズームさせないために16px以上を指定 */
  font-size: 16px;
  /* 文字色を親から継承 */
  color: inherit;
}

body {
  text-rendering: optimizelegibility;
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
          text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
}

.section img {
  width: 100%;
  max-width: 100%;
  height: auto;
  line-height: 1;
  -ms-interpolation-mode: bicubic;
  vertical-align: top;
}

.section .sp-block {
  display: block !important;
}

.section .pc-block {
  display: none !important;
}

.section .sp-inline {
  display: inline !important;
}

.section .pc-inline {
  display: none !important;
}

.section .sp350-block {
  display: none !important;
}

@media screen and (min-width: 769px) {
  .section .sp-block {
    display: none !important;
  }
  .section .pc-block {
    display: block !important;
  }
  .section .sp-inline {
    display: none !important;
  }
  .section .pc-inline {
    display: inline !important;
  }
}
@media screen and (max-width: 350px) {
  .section .sp350-block {
    display: block !important;
  }
}
header {
  position: relative;
}

html {
  height: -webkit-fill-available;
}

body {
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, "Helvetica Neue", Arial, sans-serif;
  font-weight: normal;
  font-style: normal;
  line-height: normal;
  --col-bg-beige: #ffeddf;
  --col-bg-orange: #f19648;
  --col-bg-orange-pale: #fee0c9;
  --col-brown: #796735;
  --col-brown-light: #a49364;
  --col-brown-yellow: #ceb15f;
  --col-brown-deep: #6a5316;
  color: var(--col-brown-deep);
  --col-black: #000;
  --col-orange-deep: #bf6313;
  --col-beige-deep: #a49364;
  --col-orange-light: #ffcea8;
  --col-white-90: #ffffffe6;
  --col-fuji-blue: #718eb2;
  --grd-main: linear-gradient(180deg, #d96628, #330d0c);
  --grd-btn: linear-gradient(180deg, #edbe4a, #d35d33 47%, #a03122);
  --grd-fuji: linear-gradient(180deg, #136aab, #162f56);
  --grd-commonclear-bg: linear-gradient(90deg, #daf3ffe6, #ffcea2e6);
  --grd-fuji-blue-bg: linear-gradient(180deg, #52a4e1, #5d87c9);
  background-attachment: fixed;
  background: var(--col-bg-beige);
  min-height: -webkit-fill-available;
  min-width: 100%;
  position: relative;
}
body:after {
  z-index: 1;
  content: "";
  position: fixed;
  top: calc(100lvh - 128px);
  left: 0;
  width: 100%;
  height: 128px;
  background: url(../_img/bg_pattern-sp@2x.png) center bottom no-repeat;
  background-size: 800px 128px;
  z-index: -10;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
}

.footer footer .s-footer-links {
  background-color: #fff;
}
.footer .s-footer {
  margin-top: 0;
}

header,
.section,
.remodal,
.kaisei {
  font-family: "Kaisei Opti", serif;
  font-weight: 700;
  color: var(--col-blue-dark);
  font-size: 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.gothic {
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, "Helvetica Neue", Arial, sans-serif;
  font-weight: normal;
}

.section *,
.section *::after,
.section *::before {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.section a {
  -webkit-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
}
@media (hover: hover) {
  .section a:hover {
    opacity: 0.7;
    text-decoration: none;
  }
}

.section {
  position: relative;
  padding: 80px 16px;
}
.section .content_wrap {
  width: 100%;
  max-width: 1080px;
  margin: 0 auto;
  text-align: center;
}

/*共通ロゴ*/
header {
  background-color: transparent;
}
header.l-header-wrap {
  z-index: 100;
  position: absolute;
  width: 100%;
}
header.l-header-wrap div {
  margin: 8px 12px 8px;
  text-align: left;
  width: calc(100% - 24px);
  line-height: 1;
}
header.l-header-wrap div img {
  height: auto;
  vertical-align: bottom;
  margin-left: 0;
  max-width: 48px;
}

/*下部バナーエリア*/
#banner-sec {
  padding: 0 16px;
  z-index: 10;
  position: relative;
}
#banner-sec .wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px 0;
  padding: 60px 24px 80px;
}
#banner-sec .wrap a {
  width: 100%;
}
#banner-sec .wrap a img {
  -webkit-transition: opacity 0.2s ease-in;
  transition: opacity 0.2s ease-in;
}
@media (hover: hover) {
  #banner-sec .wrap a:hover {
    opacity: 1;
    background: var(--col-bg-orange);
  }
  #banner-sec .wrap a:hover img {
    opacity: 0.6;
  }
}

/* MV */
#mainvisual {
  padding: 0;
  background-color: var(--col-bg-orange);
  overflow: hidden;
  pointer-events: none;
}
#mainvisual .content_wrap {
  max-width: none;
  aspect-ratio: 375/488;
  position: relative;
}
#mainvisual .content_wrap .series_title {
  position: absolute;
  width: 273px;
  top: 10px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
#mainvisual .content_wrap .visual_wrap {
  position: relative;
  padding-top: 38px;
}
#mainvisual .content_wrap .visual_wrap .main_set {
  position: absolute;
  width: 100%;
  aspect-ratio: 375/420;
  --maxW: 375;
  --maxH: 420;
}
#mainvisual .content_wrap .visual_wrap .main_set .horse_set {
  aspect-ratio: 1/1;
  position: absolute;
  width: calc(var(--partsW) / var(--maxW) * 100%);
  left: calc(var(--partsX) / var(--maxW) * 100%);
  top: calc(var(--partsY) / var(--maxH) * 100%);
  --partsW: 182;
  --partsX: 84.8;
  --partsY: 193.7656;
  z-index: 10;
}
#mainvisual .content_wrap .visual_wrap .main_set .horse_set .horse {
  --maxW: 344;
  --maxH: 344;
  position: absolute;
  width: calc(var(--partsW) / var(--maxW) * 100%);
  left: calc(var(--partsX) / var(--maxW) * 100%);
  top: calc(var(--partsY) / var(--maxH) * 100%);
}
#mainvisual .content_wrap .visual_wrap .main_set .horse_set .horse.body {
  --partsW: 274;
  --partsX: 68;
  --partsY: 13;
  z-index: 2;
}
#mainvisual .content_wrap .visual_wrap .main_set .horse_set .horse.head_white {
  --partsW: 97;
  --partsX: 140;
  --partsY: 1;
  z-index: 1;
  -webkit-transform-origin: 60.824742268% 98.7179487179%;
          transform-origin: 60.824742268% 98.7179487179%;
}
#mainvisual .content_wrap .visual_wrap .main_set .horse_set .horse.tail {
  --partsW: 108;
  --partsX: 1;
  --partsY: 24;
  z-index: 4;
  -webkit-transform-origin: 93.5185185185% 91.3385826772%;
          transform-origin: 93.5185185185% 91.3385826772%;
}
#mainvisual .content_wrap .visual_wrap .main_set .horse_set .horse.head {
  --partsW: 85;
  --partsX: 142;
  --partsY: 4;
  -webkit-transform-origin: 67.0588235294% 98.6666666667%;
          transform-origin: 67.0588235294% 98.6666666667%;
  z-index: 3;
}
#mainvisual .content_wrap .visual_wrap .main_set .title_set {
  aspect-ratio: 482/663;
  position: absolute;
  width: calc(var(--partsW) / var(--maxW) * 100%);
  left: calc(var(--partsX) / var(--maxW) * 100%);
  top: calc(var(--partsY) / var(--maxH) * 100%);
  --partsW: 255;
  --partsX: 60.5;
  --partsY: 25;
  z-index: 10;
}
#mainvisual .content_wrap .visual_wrap .main_set .title_set .title {
  --maxW: 482;
  --maxH: 663;
  position: absolute;
  width: calc(var(--partsW) / var(--maxW) * 100%);
  left: calc(var(--partsX) / var(--maxW) * 100%);
  top: calc(var(--partsY) / var(--maxH) * 100%);
}
#mainvisual .content_wrap .visual_wrap .main_set .title_set .title.realtreasure {
  --partsW: 167.1583;
  --partsX: 155.2597;
  --partsY: -30.7985;
  z-index: 1;
}
#mainvisual .content_wrap .visual_wrap .main_set .title_set .title.title01 {
  --partsW: 238;
  --partsX: 120;
  --partsY: 111;
  z-index: 1;
}
#mainvisual .content_wrap .visual_wrap .main_set .title_set .title.title02 {
  --partsW: 95;
  --partsX: 41;
  --partsY: 111;
  z-index: 2;
}
#mainvisual .content_wrap .visual_wrap .main_set .title_set .title.title03 {
  --partsW: 249;
  --partsX: 118;
  --partsY: 168;
  z-index: 3;
}
#mainvisual .content_wrap .visual_wrap .main_set .title_set .title.title04 {
  --partsW: 405;
  --partsX: 34;
  --partsY: 243;
  z-index: 4;
}
#mainvisual .content_wrap .visual_wrap .main_set .deco_set {
  aspect-ratio: 482/663;
  position: absolute;
  width: calc(var(--partsW) / var(--maxW) * 100%);
  left: calc(var(--partsX) / var(--maxW) * 100%);
  top: calc(var(--partsY) / var(--maxH) * 100%);
  --partsW: 255;
  --partsX: 60.5;
  --partsY: 25;
  z-index: 5;
}
#mainvisual .content_wrap .visual_wrap .main_set .deco_set .deco {
  --maxW: 482;
  --maxH: 663;
  position: absolute;
  width: calc(var(--partsW) / var(--maxW) * 100%);
  left: calc(var(--partsX) / var(--maxW) * 100%);
  top: calc(var(--partsY) / var(--maxH) * 100%);
}
#mainvisual .content_wrap .visual_wrap .main_set .deco_set .deco.circle {
  --partsW: 482;
  --partsX: 0;
  --partsY: 61;
  z-index: 1;
}
#mainvisual .content_wrap .visual_wrap .main_set .deco_set .deco.top {
  --partsW: 205;
  --partsX: 136;
  --partsY: 0;
  z-index: 1;
}
#mainvisual .content_wrap .visual_wrap .main_set .deco_set .deco.fire_right {
  --partsW: 109;
  --partsX: 330;
  --partsY: 316;
  z-index: 1;
}
#mainvisual .content_wrap .visual_wrap .main_set .deco_set .deco.fire_left {
  --partsW: 118;
  --partsX: 113;
  --partsY: 341;
  z-index: 1;
}
#mainvisual .content_wrap .visual_wrap .bg_set {
  position: absolute;
  width: 100%;
  aspect-ratio: 375/420;
  --maxW: 375;
  --maxH: 420;
}
#mainvisual .content_wrap .visual_wrap .bg_set .bg {
  --maxW: 375;
  --maxH: 420;
  position: absolute;
  width: calc(var(--partsW) / var(--maxW) * 100%);
  left: calc(var(--partsX) / var(--maxW) * 100%);
  top: calc(var(--partsY) / var(--maxH) * 100%);
}
#mainvisual .content_wrap .visual_wrap .bg_set .bg.copy_right {
  --partsW: 26;
  --partsX: 315;
  --partsY: 91;
  z-index: 5;
}
#mainvisual .content_wrap .visual_wrap .bg_set .bg.copy_left {
  --partsW: 26;
  --partsX: 33;
  --partsY: 91;
  z-index: 5;
}
#mainvisual .content_wrap .visual_wrap .bg_set .bg.bg_pattern {
  --partsW: 375;
  --partsX: 0;
  --partsY: 0;
}
#mainvisual .content_wrap .texture {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  mix-blend-mode: soft-light;
  opacity: 0.5;
  -webkit-mask-image: url(../_img/mv_mask-sp.svg);
          mask-image: url(../_img/mv_mask-sp.svg);
  -webkit-mask-position: bottom center;
          mask-position: bottom center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
  z-index: 100;
}
#mainvisual .content_wrap .rope {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  background-color: var(--col-bg-beige);
}
#mainvisual + .cloud_wrap {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 1px;
  overflow-x: clip;
  overflow-y: visible;
  position: relative;
  margin-top: -4.8%;
  margin-bottom: 4.8%;
  z-index: 10;
}
#mainvisual + .cloud_wrap .left {
  width: 38.1333333333%;
  margin-left: -1.8666666667%;
}
#mainvisual + .cloud_wrap .right {
  width: 36.5333333333%;
  margin-right: -1.6%;
}

@-webkit-keyframes fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
#mainvisual .content_wrap .visual_wrap .main_set .horse_set {
  opacity: 0;
  -webkit-animation-name: fade_horse, jump_horse;
          animation-name: fade_horse, jump_horse;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.8s, 0.9s;
          animation-duration: 0.8s, 0.9s;
  -webkit-animation-timing-function: ease-out, ease-in-out;
          animation-timing-function: ease-out, ease-in-out;
  -webkit-animation-delay: 1.8s, 1.8s;
          animation-delay: 1.8s, 1.8s;
}
@-webkit-keyframes fade_horse {
  0% {
    -webkit-transform: scale(80%);
            transform: scale(80%);
  }
  100% {
    -webkit-transform: scale(100%);
            transform: scale(100%);
  }
}
@keyframes fade_horse {
  0% {
    -webkit-transform: scale(80%);
            transform: scale(80%);
  }
  100% {
    -webkit-transform: scale(100%);
            transform: scale(100%);
  }
}
@-webkit-keyframes jump_horse {
  0% {
    opacity: 0;
    translate: 0 -10%;
  }
  50% {
    opacity: 1;
    translate: 0 -20%;
  }
  100% {
    opacity: 1;
    translate: 0 0;
  }
}
@keyframes jump_horse {
  0% {
    opacity: 0;
    translate: 0 -10%;
  }
  50% {
    opacity: 1;
    translate: 0 -20%;
  }
  100% {
    opacity: 1;
    translate: 0 0;
  }
}
#mainvisual .content_wrap .visual_wrap .main_set .horse_set .horse.head_white, #mainvisual .content_wrap .visual_wrap .main_set .horse_set .horse.head {
  -webkit-animation-name: horse_head;
          animation-name: horse_head;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 5s;
          animation-duration: 5s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-delay: 2.8s;
          animation-delay: 2.8s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-direction: normal;
          animation-direction: normal;
}
@-webkit-keyframes horse_head {
  0% {
    rotate: 0deg;
    translate: 0 0;
  }
  8% {
    rotate: -15deg;
    translate: 15% 0;
  }
  16% {
    rotate: 0deg;
    translate: 0 0;
  }
  24% {
    rotate: -15deg;
    translate: 15% 0;
  }
  32% {
    rotate: 0deg;
    translate: 0 0;
  }
  100% {
    rotate: 0deg;
    translate: 0 0;
  }
}
@keyframes horse_head {
  0% {
    rotate: 0deg;
    translate: 0 0;
  }
  8% {
    rotate: -15deg;
    translate: 15% 0;
  }
  16% {
    rotate: 0deg;
    translate: 0 0;
  }
  24% {
    rotate: -15deg;
    translate: 15% 0;
  }
  32% {
    rotate: 0deg;
    translate: 0 0;
  }
  100% {
    rotate: 0deg;
    translate: 0 0;
  }
}
#mainvisual .content_wrap .visual_wrap .main_set .horse_set .horse.tail {
  -webkit-transform-origin: 90.7407407407% 91.3385826772%;
          transform-origin: 90.7407407407% 91.3385826772%;
  -webkit-animation-name: horse_tail;
          animation-name: horse_tail;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 8s;
          animation-duration: 8s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-delay: 2.8s;
          animation-delay: 2.8s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-direction: normal;
          animation-direction: normal;
}
@-webkit-keyframes horse_tail {
  0% {
    rotate: 0deg;
  }
  20% {
    rotate: 0deg;
  }
  26% {
    rotate: -6deg;
  }
  32% {
    rotate: 0deg;
  }
  38% {
    rotate: -8deg;
  }
  44% {
    rotate: 0deg;
  }
  50% {
    rotate: -6deg;
  }
  56% {
    rotate: 0deg;
  }
  100% {
    rotate: 0deg;
  }
}
@keyframes horse_tail {
  0% {
    rotate: 0deg;
  }
  20% {
    rotate: 0deg;
  }
  26% {
    rotate: -6deg;
  }
  32% {
    rotate: 0deg;
  }
  38% {
    rotate: -8deg;
  }
  44% {
    rotate: 0deg;
  }
  50% {
    rotate: -6deg;
  }
  56% {
    rotate: 0deg;
  }
  100% {
    rotate: 0deg;
  }
}
#mainvisual .content_wrap .visual_wrap .main_set .horse_set .horse.head_white {
  -webkit-transform-origin: 61.8556701031% 98.7179487179%;
          transform-origin: 61.8556701031% 98.7179487179%;
}
#mainvisual .content_wrap .visual_wrap .main_set .horse_set .horse.head {
  -webkit-transform-origin: 68.2352941176% 135.1351351351%;
          transform-origin: 68.2352941176% 135.1351351351%;
}
#mainvisual .content_wrap .visual_wrap .main_set .title_set .title.realtreasure {
  opacity: 0;
  -webkit-animation-name: fade;
          animation-name: fade;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}
#mainvisual .content_wrap .visual_wrap .main_set .title_set .title.title01 {
  opacity: 0;
  -webkit-animation-name: fade;
          animation-name: fade;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}
#mainvisual .content_wrap .visual_wrap .main_set .title_set .title.title02 {
  opacity: 0;
  -webkit-animation-name: title02_animation;
          animation-name: title02_animation;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease;
          animation-timing-function: ease;
  -webkit-animation-delay: 1.2s;
          animation-delay: 1.2s;
}
@-webkit-keyframes title02_animation {
  0% {
    -webkit-transform: scale(100%);
            transform: scale(100%);
    opacity: 0;
  }
  80% {
    -webkit-transform: scale(125%);
            transform: scale(125%);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(100%);
            transform: scale(100%);
    opacity: 1;
  }
}
@keyframes title02_animation {
  0% {
    -webkit-transform: scale(100%);
            transform: scale(100%);
    opacity: 0;
  }
  80% {
    -webkit-transform: scale(125%);
            transform: scale(125%);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(100%);
            transform: scale(100%);
    opacity: 1;
  }
}
@-webkit-keyframes title03_animation {
  0% {
    -webkit-transform: translateY(10%);
            transform: translateY(10%);
    opacity: 0;
  }
  50% {
    -webkit-transform: translateY(-10%);
            transform: translateY(-10%);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes title03_animation {
  0% {
    -webkit-transform: translateY(10%);
            transform: translateY(10%);
    opacity: 0;
  }
  50% {
    -webkit-transform: translateY(-10%);
            transform: translateY(-10%);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
#mainvisual .content_wrap .visual_wrap .main_set .title_set .title.title03 {
  opacity: 0;
  -webkit-animation-name: title03_animation;
          animation-name: title03_animation;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease;
          animation-timing-function: ease;
  -webkit-animation-delay: 1.5s;
          animation-delay: 1.5s;
}
#mainvisual .content_wrap .visual_wrap .main_set .title_set .title.title04 {
  opacity: 0;
  -webkit-animation-name: title03_animation;
          animation-name: title03_animation;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease;
          animation-timing-function: ease;
  -webkit-animation-delay: 1.5s;
          animation-delay: 1.5s;
}
#mainvisual .content_wrap .visual_wrap .main_set .deco_set {
  opacity: 0;
  -webkit-animation-name: deco_fadezoom;
          animation-name: deco_fadezoom;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
}
@-webkit-keyframes deco_fadezoom {
  0% {
    -webkit-transform: scale(10%);
            transform: scale(10%);
    opacity: 0;
  }
  80% {
    -webkit-transform: scale(105%);
            transform: scale(105%);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(100%);
            transform: scale(100%);
    opacity: 1;
  }
}
@keyframes deco_fadezoom {
  0% {
    -webkit-transform: scale(10%);
            transform: scale(10%);
    opacity: 0;
  }
  80% {
    -webkit-transform: scale(105%);
            transform: scale(105%);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(100%);
            transform: scale(100%);
    opacity: 1;
  }
}
#mainvisual .content_wrap .visual_wrap .main_set .deco_set .deco.top {
  -webkit-animation-name: jump;
          animation-name: jump;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.5s;
          animation-duration: 0.5s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}
@-webkit-keyframes jump {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-12%);
            transform: translateY(-12%);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes jump {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-12%);
            transform: translateY(-12%);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
#mainvisual .content_wrap .visual_wrap .main_set .deco_set .deco.fire_right {
  opacity: 0;
  -webkit-animation-name: fade;
          animation-name: fade;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
  -webkit-animation-timing-function: ease-in;
          animation-timing-function: ease-in;
  -webkit-animation-delay: 2.2s;
          animation-delay: 2.2s;
}
#mainvisual .content_wrap .visual_wrap .main_set .deco_set .deco.fire_left {
  opacity: 0;
  -webkit-animation-name: fade;
          animation-name: fade;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
  -webkit-animation-timing-function: ease-in;
          animation-timing-function: ease-in;
  -webkit-animation-delay: 2.2s;
          animation-delay: 2.2s;
}
@-webkit-keyframes fadeup {
  0% {
    -webkit-transform: translateY(30%);
            transform: translateY(30%);
    opacity: 0;
  }
  50% {
    -webkit-transform: translateY(-10%);
            transform: translateY(-10%);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fadeup {
  0% {
    -webkit-transform: translateY(30%);
            transform: translateY(30%);
    opacity: 0;
  }
  50% {
    -webkit-transform: translateY(-10%);
            transform: translateY(-10%);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
#mainvisual .content_wrap .visual_wrap .bg_set .bg.copy_right {
  opacity: 0;
  -webkit-animation-name: fadeup;
          animation-name: fadeup;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-delay: 1.7s;
          animation-delay: 1.7s;
}
#mainvisual .content_wrap .visual_wrap .bg_set .bg.copy_left {
  opacity: 0;
  -webkit-animation-name: fadeup;
          animation-name: fadeup;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-delay: 1.9s;
          animation-delay: 1.9s;
}
#mainvisual + .cloud_wrap {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 1px;
  overflow-x: clip;
  overflow-y: visible;
  position: relative;
  margin-top: -4.8%;
  margin-bottom: 4.8%;
  z-index: 10;
}
#mainvisual + .cloud_wrap .left {
  width: 38.1333333333%;
  margin-left: -1.8666666667%;
}
#mainvisual + .cloud_wrap .right {
  width: 36.5333333333%;
  margin-right: -1.6%;
}

/* ／ MV */
/*固定ナビ*/
html:has(#nav-sec input#label:checked) {
  -ms-scroll-chaining: none;
      overscroll-behavior: none;
}

body:has(#nav-sec input#label:checked) {
  overflow: hidden;
  -ms-scroll-chaining: none;
      overscroll-behavior: none;
}

.nav_area {
  overflow: clip;
}

#nav-sec {
  position: fixed;
  padding: 0;
  top: 0px;
  width: 100%;
  height: 0;
  margin: auto;
  overflow: visible;
  z-index: 1000;
}
#nav-sec nav {
  position: absolute;
  right: 0;
  overflow: visible;
  height: 0;
}
#nav-sec nav input {
  display: none;
}
#nav-sec nav label {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 100;
  width: 44px;
  height: 44px;
  pointer-events: auto;
  cursor: pointer;
  background: var(--col-orange-deep);
  margin: 8px 8px auto auto;
  border-radius: 50%;
  border: solid transparent 1px;
  -webkit-transition: background-color 0.2s ease-in, border-color 0.2s ease-in;
  transition: background-color 0.2s ease-in, border-color 0.2s ease-in;
}
#nav-sec nav label > .icon {
  display: block;
  position: relative;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  width: 14px;
  height: 9px;
}
#nav-sec nav label > .icon span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 14px;
  height: 1px;
  background: #fff;
  -webkit-transition: background-color 0.2s ease-in-out, opacity 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
  transition: background-color 0.2s ease-in-out, opacity 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
  transition: background-color 0.2s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
  transition: background-color 0.2s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
}
#nav-sec nav label > .icon span:nth-of-type(2) {
  top: calc(50% - 0.5px);
}
#nav-sec nav label > .icon span:nth-of-type(3) {
  top: auto;
  bottom: 0;
}
@media (hover: hover) {
  #nav-sec nav label:hover {
    background: #fff;
    border-color: var(--col-orange-deep);
  }
  #nav-sec nav label:hover > .icon span {
    background: var(--col-orange-deep);
  }
}
#nav-sec nav input + label + .menu {
  pointer-events: all;
  z-index: 1;
  width: 100vw;
  height: 100dvh;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateX(100%);
          transform: translateX(100%);
  -webkit-transition: visibility 0.1s ease-in, opacity 0.1s ease-in-out, background 0.1s ease-in-out, -webkit-transform 0.1s ease-in-out;
  transition: visibility 0.1s ease-in, opacity 0.1s ease-in-out, background 0.1s ease-in-out, -webkit-transform 0.1s ease-in-out;
  transition: transform 0.1s ease-in-out, visibility 0.1s ease-in, opacity 0.1s ease-in-out, background 0.1s ease-in-out;
  transition: transform 0.1s ease-in-out, visibility 0.1s ease-in, opacity 0.1s ease-in-out, background 0.1s ease-in-out, -webkit-transform 0.1s ease-in-out;
  padding: 60px 26px 0;
  margin-top: -52px;
  background-color: transparent;
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto 1fr;
}
#nav-sec nav input:checked + label > .icon span {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  top: calc(50% - 0.5px);
}
#nav-sec nav input:checked + label > .icon span:nth-child(2) {
  -webkit-transform: none;
          transform: none;
  opacity: 0;
}
#nav-sec nav input:checked + label > .icon span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
#nav-sec nav input:checked + label + .menu {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translateX(0%);
          transform: translateX(0%);
  background-color: var(--col-bg-orange);
  -webkit-transition: visibility 0.5s ease-in, opacity 0.5s ease-in-out, background 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out;
  transition: visibility 0.5s ease-in, opacity 0.5s ease-in-out, background 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out;
  transition: transform 0.5s ease-in-out, visibility 0.5s ease-in, opacity 0.5s ease-in-out, background 0.5s ease-in-out;
  transition: transform 0.5s ease-in-out, visibility 0.5s ease-in, opacity 0.5s ease-in-out, background 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out;
}
#nav-sec nav .menu {
  position: relative;
}
#nav-sec nav .menu ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 4px;
}
#nav-sec nav .menu ul li a {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: 54px;
  padding: 0 22px;
  margin: auto;
  font-size: 18px;
  line-height: 1.2;
  color: var(--col-brown-deep);
  background: var(--col-white-90);
  -webkit-transition: background 0.2s ease-in, color 0.2s ease-in;
  transition: background 0.2s ease-in, color 0.2s ease-in;
  -webkit-mask-image: url(../_img/nav_mask_left.svg), url(../_img/nav_mask_center.svg), url(../_img/nav_mask_right.svg);
          mask-image: url(../_img/nav_mask_left.svg), url(../_img/nav_mask_center.svg), url(../_img/nav_mask_right.svg);
  -webkit-mask-position: left center, 18px center, right center;
          mask-position: left center, 18px center, right center;
  -webkit-mask-size: 18px 54px, calc(100% - 36px) 54px, 18px 54px;
          mask-size: 18px 54px, calc(100% - 36px) 54px, 18px 54px;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
}
#nav-sec nav .menu ul li a::after {
  content: "";
  position: absolute;
  top: calc(50% - 5px);
  right: 26px;
  display: block;
  width: 8px;
  height: 10px;
  background: var(--col-brown-light);
  -webkit-mask-image: url(../_img/icon_arrow.svg);
          mask-image: url(../_img/icon_arrow.svg);
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-transition: background 0.2s ease-in;
  transition: background 0.2s ease-in;
}
@media (hover: hover) {
  #nav-sec nav .menu ul li a:hover {
    opacity: 1;
    background-color: var(--col-beige-deep);
    color: #fff;
  }
  #nav-sec nav .menu ul li a:hover::after {
    background: #fff;
  }
  #nav-sec nav .menu ul li a:hover.current {
    color: #fff;
  }
  #nav-sec nav .menu ul li a:hover.current::after {
    background: #fff;
  }
}
#nav-sec nav .menu ul li a.current {
  color: var(--col-bg-orange);
}
#nav-sec nav .menu ul li a.current::after {
  background: var(--col-bg-orange);
}
#nav-sec nav .game_link_wrap {
  position: relative;
  z-index: 10;
  margin-top: 32px;
  margin-inline: -10px;
  margin-bottom: 10px;
}
#nav-sec nav .game_link_wrap .for_pc {
  display: none;
}
#nav-sec nav .deco {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
#nav-sec nav .deco .cloud_left {
  position: absolute;
  bottom: -17px;
  left: -7px;
  width: 143px;
}
#nav-sec nav .deco .cloud_right {
  position: absolute;
  bottom: -15px;
  right: -6px;
  width: 143px;
}
#nav-sec nav .deco .horse {
  position: relative;
  aspect-ratio: 506/368;
  width: auto;
  height: calc(100dvh - 60px - 344px - 32px - 100px - 10px);
  max-height: 184px;
  margin: auto auto 0;
}

/*／固定ナビ*/
/* 謎解きサイトbtn */
.game_link_wrap {
  margin: 40px auto 80px;
}
.game_link_wrap a.game_link {
  width: 100%;
  display: grid;
  place-items: center;
}
.game_link_wrap a.game_link > * {
  grid-area: 1/1;
}
.game_link_wrap a.game_link .text_wrap {
  width: 100%;
  padding: 10px 8px 0;
  position: relative;
  z-index: 5;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  gap: 12px;
}
.game_link_wrap a.game_link .text_wrap .title {
  width: 64.72303207%;
  min-width: 222px;
  margin: auto;
}
.game_link_wrap a.game_link .text_wrap .notes {
  text-align: left;
  font-size: 12px;
  line-height: 1.2;
  color: var(--col-black);
}
.game_link_wrap a.game_link .bg_img {
  width: 100%;
  border-radius: 5px;
  border: solid 2px var(--col-brown-deep);
  overflow: hidden;
  max-height: 100px;
}
.game_link_wrap a.game_link .bg_img img {
  margin: -1px;
}
@media (hover: hover) {
  .game_link_wrap a.game_link:hover {
    opacity: 0.5;
  }
}
.game_link_wrap > .notes {
  font-size: 12px;
  line-height: 1.5;
  text-align: left;
  margin-top: 16px;
}

body.comingsoon .game_link_wrap a.game_link {
  pointer-events: none;
}
body.comingsoon .game_link_wrap a.game_link .text_wrap::before {
  content: "COMING SOON";
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  font-size: 24px;
  color: #fff;
  letter-spacing: 0.05em;
}
body.comingsoon .game_link_wrap a.game_link .text_wrap .title {
  display: none;
}
body.comingsoon .game_link_wrap a.game_link .text_wrap .notes {
  color: #fff;
}
body.comingsoon .game_link_wrap a.game_link .bg_img {
  position: relative;
  -webkit-filter: grayscale(95%) contrast(150%);
          filter: grayscale(95%) contrast(150%);
  border-color: #888;
}

#presents .game_link_wrap {
  margin: 0 auto;
}

/* ／謎解きサイトbtn */
/* 共通 */
.section.orange {
  background: var(--col-bg-orange);
}

.common_joint {
  width: 100%;
  overflow: hidden;
  min-height: 26px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
  bottom: -0.5px;
}
.common_joint:before {
  content: "";
  width: 100%;
  min-width: 375px;
  background: url(../_img/common_joint_top-sp.svg) center center no-repeat;
  background-size: 100% auto;
  aspect-ratio: 375/26;
}
.common_joint.bottom {
  top: -0.5px;
  bottom: auto;
}
.common_joint.bottom:before {
  background: url(../_img/common_joint_bottom-sp.svg) center center no-repeat;
  background-size: 100% auto;
}

.common_title_wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 17px;
}
.common_title_wrap .common_title {
  width: 31px;
}
.common_title_wrap .common_title.animation {
  opacity: 0;
}
.common_title_wrap .common_title.animation.active {
  --transY: 25;
  -webkit-animation-name: fade_up;
          animation-name: fade_up;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 1.2s;
          animation-duration: 1.2s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
}
@-webkit-keyframes fade_up {
  0% {
    opacity: 0;
    -webkit-transform: translateY(calc(var(--transY) * 1px));
            transform: translateY(calc(var(--transY) * 1px));
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes fade_up {
  0% {
    opacity: 0;
    -webkit-transform: translateY(calc(var(--transY) * 1px));
            transform: translateY(calc(var(--transY) * 1px));
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
.common_title_wrap .common_right_content {
  width: calc(100% - 31px - 17px);
}

a.btn_simple {
  cursor: pointer;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.4;
  min-height: 32px;
  padding: 4px 16px;
  background: var(--col-orange-light);
  border: solid 1px transparent;
  border-radius: calc(infinity * 1px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  -webkit-transition: background 0.2s ease-in, color 0.2s ease-in, border-color 0.2s ease-in;
  transition: background 0.2s ease-in, color 0.2s ease-in, border-color 0.2s ease-in;
}
a.btn_simple::after {
  content: "";
  position: absolute;
  top: calc(50% - 7.5px);
  right: 8px;
  display: block;
  width: 10px;
  height: 15px;
  background: var(--col-brown-deep);
  -webkit-mask-image: url(../_img/icon_arrow.svg);
          mask-image: url(../_img/icon_arrow.svg);
  -webkit-mask-position: center center;
          mask-position: center center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-transition: background 0.2s ease-in;
  transition: background 0.2s ease-in;
}
@media (hover: hover) {
  a.btn_simple:hover {
    opacity: 1;
    background: var(--col-brown-deep);
    border-color: #fff;
    color: #fff;
  }
  a.btn_simple:hover::after {
    background: #fff;
  }
}

a.btn_dl {
  font-size: 15px;
  line-height: 1.6;
  text-decoration: underline;
  text-align: left;
  color: var(--col-brown-deep);
}
a.btn_dl::after {
  content: "";
  display: inline-block;
  margin-bottom: -0.25em;
  width: 20px;
  height: 20px;
  background: #e64747;
  -webkit-mask-image: url(../_img/icon_pdf.svg);
          mask-image: url(../_img/icon_pdf.svg);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-transition: background 0.2s ease-in;
  transition: background 0.2s ease-in;
}
@media (hover: hover) {
  a.btn_dl:hover {
    opacity: 0.5;
  }
}

/* ／共通 */
/* top lead */
#top_lead {
  padding: 120px 0;
}
#top_lead .deco {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 40px;
  margin: 0 auto 32px;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
}
#top_lead .deco img {
  width: 27px;
}
#top_lead .text_wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 12px 0;
  font-size: 18px;
  line-height: 1.5;
}
#top_lead .text_wrap p {
  -webkit-filter: drop-shadow(1px 0 0px #fff) drop-shadow(0 1px 0px #fff) drop-shadow(-1px 0 0px #fff) drop-shadow(0 -1px 0px #fff) drop-shadow(1px 0 0px #fff) drop-shadow(0 1px 0px #fff) drop-shadow(-1px 0 0px #fff) drop-shadow(0 -1px 0px #fff);
          filter: drop-shadow(1px 0 0px #fff) drop-shadow(0 1px 0px #fff) drop-shadow(-1px 0 0px #fff) drop-shadow(0 -1px 0px #fff) drop-shadow(1px 0 0px #fff) drop-shadow(0 1px 0px #fff) drop-shadow(-1px 0 0px #fff) drop-shadow(0 -1px 0px #fff);
}
#top_lead .text_wrap p .grd {
  background: var(--grd-main);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#top_lead .text_wrap p .mini {
  font-size: 14px;
}

/* top lead アニメーション */
#top_lead .deco img.animation {
  opacity: 0;
  will-change: transform, opacity, filter;
}
#top_lead .deco img.animation.active {
  -webkit-animation-name: fade, transY, Dshadow;
          animation-name: fade, transY, Dshadow;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.6s, 0.6s, 1.2s;
          animation-duration: 0.6s, 0.6s, 1.2s;
  -webkit-animation-timing-function: ease-in;
          animation-timing-function: ease-in;
  -webkit-animation-delay: 0s, 0s, 0.6s;
          animation-delay: 0s, 0s, 0.6s;
}
@keyframes fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes transY {
  0% {
    -webkit-transform: translateY(10px) translateZ(0);
            transform: translateY(10px) translateZ(0);
  }
  100% {
    -webkit-transform: translateY(0) translateZ(0);
            transform: translateY(0) translateZ(0);
  }
}
@keyframes transY {
  0% {
    -webkit-transform: translateY(10px) translateZ(0);
            transform: translateY(10px) translateZ(0);
  }
  100% {
    -webkit-transform: translateY(0) translateZ(0);
            transform: translateY(0) translateZ(0);
  }
}
@-webkit-keyframes Dshadow {
  0% {
    -webkit-filter: drop-shadow(0 0 1px #efc74f);
            filter: drop-shadow(0 0 1px #efc74f);
  }
  100% {
    -webkit-filter: drop-shadow(0 0 15px #efc74f);
            filter: drop-shadow(0 0 15px #efc74f);
  }
}
@keyframes Dshadow {
  0% {
    -webkit-filter: drop-shadow(0 0 1px #efc74f);
            filter: drop-shadow(0 0 1px #efc74f);
  }
  100% {
    -webkit-filter: drop-shadow(0 0 15px #efc74f);
            filter: drop-shadow(0 0 15px #efc74f);
  }
}
#top_lead .deco img.animation:nth-of-type(2) {
  -webkit-animation-delay: 0.4s, 0.4s, 0.9s;
          animation-delay: 0.4s, 0.4s, 0.9s;
}
#top_lead .deco img.animation:nth-of-type(3) {
  -webkit-animation-delay: 0.7s, 0.7s, 1.2s;
          animation-delay: 0.7s, 0.7s, 1.2s;
}
#top_lead .deco img.animation:nth-of-type(4) {
  -webkit-animation-delay: 1.1s, 1.1s, 1.5s;
          animation-delay: 1.1s, 1.1s, 1.5s;
}
#top_lead .text_wrap.animation {
  opacity: 0;
}
#top_lead .text_wrap.animation.active {
  --time: 1;
  --transY: 10;
  -webkit-animation-name: fade_up;
          animation-name: fade_up;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.5s;
          animation-duration: 0.5s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-delay: calc(var(--time) / 3.5 * 1s);
          animation-delay: calc(var(--time) / 3.5 * 1s);
}
@keyframes fade_up {
  0% {
    opacity: 0;
    -webkit-transform: translateY(calc(var(--transY) * 1px));
            transform: translateY(calc(var(--transY) * 1px));
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

/* ／ top lead */
/* TOP */
#top {
  padding-block: 0;
}
#top .content_wrap .cloud_wrap {
  margin: 0 3px;
  width: calc(100% - 6px);
  height: 433px;
  position: relative;
}
@media (min-width: 500px) {
  #top .content_wrap .cloud_wrap {
    margin: auto;
    width: 100%;
    max-width: 500px;
  }
}
#top .content_wrap .dates,
#top .content_wrap .place,
#top .content_wrap .sp_event {
  position: absolute;
  -webkit-filter: drop-shadow(5px 5px 0 #e1cab8);
          filter: drop-shadow(5px 5px 0 #e1cab8);
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
}
#top .content_wrap .dates dl,
#top .content_wrap .place dl,
#top .content_wrap .sp_event dl {
  display: grid;
  gap: 7.5px;
}
#top .content_wrap .dates dl dt,
#top .content_wrap .place dl dt,
#top .content_wrap .sp_event dl dt {
  font-size: 16px;
  line-height: 1.25;
}
#top .content_wrap .dates dl dd,
#top .content_wrap .place dl dd,
#top .content_wrap .sp_event dl dd {
  font-size: 13px;
}
#top .content_wrap .dates dl dd > em,
#top .content_wrap .place dl dd > em,
#top .content_wrap .sp_event dl dd > em {
  font-size: 18px;
  font-style: normal;
}
#top .content_wrap .dates {
  top: 0;
  left: 0;
  width: 311px;
  height: 197px;
  background: url(../_img/top_cloud01.svg) 0 0 no-repeat;
  background-size: contain;
  z-index: 5;
}
#top .content_wrap .dates dl {
  position: absolute;
  top: 59px;
  left: 64px;
}
#top .content_wrap .dates dl dd {
  line-height: 1.2;
}
#top .content_wrap .place {
  top: 170px;
  right: 0;
  width: 324px;
  height: 189px;
  background: url(../_img/top_cloud02.svg) 0 0 no-repeat;
  background-size: contain;
}
#top .content_wrap .place dl {
  position: absolute;
  top: 53px;
  left: 100px;
}
#top .content_wrap .place dl dd {
  display: grid;
  gap: 2px;
}
#top .content_wrap .sp_event {
  z-index: 5;
  bottom: 0;
  left: 7.1216617211%;
  width: 183px;
  height: 112px;
  background: url(../_img/top_cloud03.svg) 0 0 no-repeat;
  background-size: contain;
}
#top .content_wrap .sp_event p {
  position: absolute;
  top: 38px;
  left: 33.5px;
  font-size: 13px;
  text-align: left;
}
#top .content_wrap .sp_event p .fuji {
  background: var(--grd-fuji);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#top .content_wrap .sp_event p .kyoto {
  background: var(--grd-main);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#top .content_wrap .sp_event p em {
  font-size: 16px;
  font-style: normal;
}

@-webkit-keyframes slidein_cloud {
  0% {
    translate: calc(var(--translateX) * 100%) calc(var(--translateY) * 100%);
  }
  100% {
    translate: 0 0;
  }
}

@keyframes slidein_cloud {
  0% {
    translate: calc(var(--translateX) * 100%) calc(var(--translateY) * 100%);
  }
  100% {
    translate: 0 0;
  }
}
@-webkit-keyframes opacity_cloud {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes opacity_cloud {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fuwafuwa_cloud {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }
  100% {
    -webkit-transform: translate(0, calc(var(--translateY2) * 100%));
            transform: translate(0, calc(var(--translateY2) * 100%));
  }
}
@keyframes fuwafuwa_cloud {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }
  100% {
    -webkit-transform: translate(0, calc(var(--translateY2) * 100%));
            transform: translate(0, calc(var(--translateY2) * 100%));
  }
}
#top .cloud_wrap li.dates.animation {
  --translateX: 0.05;
  --translateY: 0.3;
  --translateY2: 0.08;
  opacity: 0;
}
#top .cloud_wrap li.dates.animation.active {
  -webkit-animation-name: slidein_cloud, opacity_cloud, fuwafuwa_cloud;
          animation-name: slidein_cloud, opacity_cloud, fuwafuwa_cloud;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 1.2s, 0.3s, 1.6s;
          animation-duration: 1.2s, 0.3s, 1.6s;
  -webkit-animation-iteration-count: 1, 1, 6;
          animation-iteration-count: 1, 1, 6;
  -webkit-animation-timing-function: ease-out, ease-in, ease-in-out;
          animation-timing-function: ease-out, ease-in, ease-in-out;
  -webkit-animation-delay: 0.1s, 0.1s, 1.2s;
          animation-delay: 0.1s, 0.1s, 1.2s;
  -webkit-animation-direction: normal, normal, alternate;
          animation-direction: normal, normal, alternate;
}
#top .cloud_wrap li.place.animation {
  --translateX: -0.08;
  --translateY: 0.4;
  --translateY2: -0.08;
  opacity: 0;
}
#top .cloud_wrap li.place.animation.active {
  -webkit-animation-name: slidein_cloud, opacity_cloud, fuwafuwa_cloud;
          animation-name: slidein_cloud, opacity_cloud, fuwafuwa_cloud;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 1.2s, 0.3s, 1.6s;
          animation-duration: 1.2s, 0.3s, 1.6s;
  -webkit-animation-iteration-count: 1, 1, 6;
          animation-iteration-count: 1, 1, 6;
  -webkit-animation-timing-function: ease-out, ease-in, ease-in-out;
          animation-timing-function: ease-out, ease-in, ease-in-out;
  -webkit-animation-delay: 0.5s, 0.5s, 1.7s;
          animation-delay: 0.5s, 0.5s, 1.7s;
  -webkit-animation-direction: normal, normal, alternate;
          animation-direction: normal, normal, alternate;
}
#top .cloud_wrap li.sp_event.animation {
  --translateX: 0.12;
  --translateY: 0.4;
  --translateY2: 0.12;
  opacity: 0;
}
#top .cloud_wrap li.sp_event.animation.active {
  -webkit-animation-name: slidein_cloud, opacity_cloud, fuwafuwa_cloud;
          animation-name: slidein_cloud, opacity_cloud, fuwafuwa_cloud;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 1.5s, 0.3s, 1.6s;
          animation-duration: 1.5s, 0.3s, 1.6s;
  -webkit-animation-iteration-count: 1, 1, 6;
          animation-iteration-count: 1, 1, 6;
  -webkit-animation-timing-function: ease-out, ease-in, ease-in-out;
          animation-timing-function: ease-out, ease-in, ease-in-out;
  -webkit-animation-delay: 0.9s, 0.9s, 2.4s;
          animation-delay: 0.9s, 0.9s, 2.4s;
  -webkit-animation-direction: normal, normal, alternate;
          animation-direction: normal, normal, alternate;
}

/*／TOP*/
/*ストーリー*/
#story {
  position: relative;
  z-index: 10;
  padding-block: 40px;
}
#story .common_right_content {
  position: relative;
}
#story .story_conversation_wrap {
  position: relative;
  height: 500px;
}
@media (max-height: 500px) {
  #story .story_conversation_wrap {
    height: 80svh;
  }
}
#story .story_conversation {
  text-align: left;
  padding-bottom: 65px;
}
#story .story_conversation .story_lead {
  line-height: 1.5;
  margin: 0 auto 16px;
}
#story .story_conversation ul {
  display: grid;
  justify-items: start;
  gap: 8px;
  font-size: 13px;
  line-height: 1.5;
}
#story .story_conversation ul li.talk_wrap {
  background-color: var(--col-orange-deep);
  margin-left: 58px;
  margin-right: auto;
  padding: 8px;
  position: relative;
  border-radius: 8px;
}
#story .story_conversation ul li.talk_wrap::before {
  content: "";
  position: absolute;
  top: calc(50% - 20px);
  left: -58px;
  border-radius: 50%;
  display: block;
  width: 40px;
  height: 40px;
  background: url(../_img/story_chara_question@2x.jpg) center center no-repeat;
  background-size: 40px auto;
}
#story .story_conversation ul li.talk_wrap::after {
  content: "";
  position: absolute;
  top: calc(50% - 5px);
  left: -8px;
  width: 0;
  height: 0;
  border-style: solid;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-right: 8px solid var(--col-orange-deep);
  border-left: 0;
}
#story .story_conversation ul li.talk_wrap.question, #story .story_conversation ul li.talk_wrap.horse {
  background: #fff;
  color: var(--col-brown-deep);
}
#story .story_conversation ul li.talk_wrap.question::after, #story .story_conversation ul li.talk_wrap.horse::after {
  border-right-color: #fff;
}
#story .story_conversation ul li.talk_wrap.you {
  color: #fff;
}
#story .story_conversation ul li.talk_wrap.you::before {
  background-image: url(../_img/story_chara_you@2x.jpg);
}
#story .story_conversation ul li.talk_wrap.horse::before {
  background-image: url(../_img/story_chara_horse@2x.jpg);
}
#story .story_conversation ul li.writing {
  margin-left: 48px;
  padding: 8px 0;
}
#story .fire_btn {
  cursor: pointer;
  position: absolute;
  bottom: -26px;
  right: 0;
  width: 80px;
  height: 119px;
  background: url(../_img/story_btn_bg.svg) center center no-repeat;
  background-size: contain;
  z-index: 1;
  font-size: 12.15px;
  line-height: 1.3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 6.5px 0;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  -webkit-filter: drop-shadow(4px 4px 0 var(--col-orange-deep));
          filter: drop-shadow(4px 4px 0 var(--col-orange-deep));
  -webkit-transition: opacity 0.2s ease-in, color 0.2s ease-in;
  transition: opacity 0.2s ease-in, color 0.2s ease-in;
}
#story .fire_btn .mini {
  font-size: 7.6px;
  list-style: 1;
  display: block;
}
#story .fire_btn::after {
  content: "";
  top: 0;
  left: 0;
  display: block;
  width: 5px;
  height: 7px;
  margin-top: 8px;
  rotate: 90deg;
  background: var(--col-orange-deep);
  -webkit-mask-image: url(../_img/icon_arrow.svg);
          mask-image: url(../_img/icon_arrow.svg);
  -webkit-mask-position: center center;
          mask-position: center center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-transition: background 0.2s ease-in;
  transition: background 0.2s ease-in;
}
@media (hover: hover) {
  #story .fire_btn:hover {
    opacity: 1;
    color: var(--col-orange-deep);
  }
}
#story .fire_btn.scroll_to_top_btn .mini {
  display: inline-block;
}
#story .fire_btn.scroll_to_top_btn::after {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
#story .scroll_to_top_btn {
  -webkit-filter: opacity(0) drop-shadow(4px 4px 0 var(--col-orange-deep));
          filter: opacity(0) drop-shadow(4px 4px 0 var(--col-orange-deep)); /* ← ここ重要 */
  pointer-events: none;
  -webkit-transition: -webkit-filter 0.3s ease;
  transition: -webkit-filter 0.3s ease;
  transition: filter 0.3s ease;
  transition: filter 0.3s ease, -webkit-filter 0.3s ease;
  z-index: 10;
}
#story .scroll_to_top_btn.is-active {
  pointer-events: all;
  -webkit-filter: opacity(1) drop-shadow(4px 4px 0 var(--col-orange-deep));
          filter: opacity(1) drop-shadow(4px 4px 0 var(--col-orange-deep));
}
#story .simple_bar_wrap {
  padding: 0 10px 0 0;
  overflow-y: scroll;
  -ms-overflow-style: none;
  /* IE, Edge 対応 */
  scrollbar-width: scroll;
  /* Firefox 対応 */
}
#story .simple_bar_wrap::-webkit-scrollbar {
  /* Chrome, Safari 対応 */
  display: none;
}
#story .simple_bar_wrap .simplebar-scrollbar::before {
  inset: 0;
  left: 6px;
  background: #bababa;
  border-radius: 2px;
  width: 4px !important;
  margin-left: 0;
  margin-top: 0;
}
#story .simple_bar_wrap .simplebar-scrollbar.simplebar-visible::before {
  opacity: 1;
}
#story .simple_bar_wrap .simplebar-track {
  background: transparent;
  width: 10px !important;
}
#story .simple_bar_wrap {
  cursor: grab;
  cursor: -webkit-grab;
}
#story .simple_bar_wrap:active {
  cursor: grabbing;
  cursor: -webkit-grabbing;
}

#story .horse_illust {
  position: absolute;
  bottom: -18px;
  left: -36px;
  width: 184px;
  -webkit-transform: translate3d(0);
          transform: translate3d(0);
  -webkit-transform-origin: 33.2361516035% 92.8%;
          transform-origin: 33.2361516035% 92.8%;
  rotate: 15deg;
}
#story .horse_illust.animation.active img {
  --jumppx: 12;
  -webkit-animation-name: horse_animation;
          animation-name: horse_animation;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-iteration-count: 2;
          animation-iteration-count: 2;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-delay: 0;
          animation-delay: 0;
  -webkit-animation-direction: alternate;
          animation-direction: alternate;
}
@-webkit-keyframes horse_animation {
  0% {
    translate: 0 0;
  }
  50% {
    translate: 0 calc(var(--jumppx) * 1% * -1 * 0.6);
  }
  70% {
    translate: 0 0;
  }
  100% {
    translate: 0 calc(var(--jumppx) * 1% * -1);
  }
}
@keyframes horse_animation {
  0% {
    translate: 0 0;
  }
  50% {
    translate: 0 calc(var(--jumppx) * 1% * -1 * 0.6);
  }
  70% {
    translate: 0 0;
  }
  100% {
    translate: 0 calc(var(--jumppx) * 1% * -1);
  }
}
#story:has(.is-active) .horse_illust {
  -webkit-animation-name: horse_illust_rotate;
          animation-name: horse_illust_rotate;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 1.4s;
          animation-duration: 1.4s;
  -webkit-animation-iteration-count: 1;
          animation-iteration-count: 1;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s;
  -webkit-animation-direction: normal;
          animation-direction: normal;
}
@-webkit-keyframes horse_illust_rotate {
  0% {
    rotate: 15deg;
  }
  40% {
    rotate: -2deg;
  }
  60% {
    rotate: 10deg;
  }
  80% {
    rotate: -4deg;
  }
  100% {
    rotate: 15deg;
  }
}
@keyframes horse_illust_rotate {
  0% {
    rotate: 15deg;
  }
  40% {
    rotate: -2deg;
  }
  60% {
    rotate: 10deg;
  }
  80% {
    rotate: -4deg;
  }
  100% {
    rotate: 15deg;
  }
}
#story input#scroll_check {
  display: none;
}

/*／ ストーリー*/
/* MAP */
#map {
  --col-walk: #b9a05d;
  --col-train: #9cc761;
  --col-bus: #eabf4f;
}
#map .content_wrap {
  display: grid;
  gap: 32px;
}
#map .map_wrap {
  --maxW: 865;
  --maxH: 955;
  max-width: calc(var(--maxW) * 1px);
  position: relative;
  margin: auto;
}
#map .map_wrap .map_img {
  display: block;
  position: relative;
  z-index: 5;
  pointer-events: none;
}
#map .map_wrap .map_img img {
  border-radius: 4px;
  background: var(--col-white-90);
  border: solid 1px var(--col-beige-deep);
  margin: -1px;
}
#map .map_wrap .deco {
  pointer-events: none;
  --pinW: 230;
  --pinX: 3;
  --pinY: -11;
  position: absolute;
  width: calc(var(--pinW) / var(--maxW) * 100%);
  left: calc(var(--pinX) / var(--maxW) * 100%);
  top: calc(var(--pinY) / var(--maxH) * 100%);
  overflow: hidden;
  z-index: 8;
}
#map .map_wrap .deco.right {
  --pinW: 233;
  --pinX: 629;
  --pinY: 544;
}
#map .map_wrap .spot {
  display: block;
  --pinW: 34;
  --pinH: 26;
  position: absolute;
  width: calc(var(--pinW) / var(--maxW) * 100%);
  height: calc(var(--pinH) / var(--maxH) * 100%);
  left: calc(var(--pinX) / var(--maxW) * 100%);
  top: calc(var(--pinY) / var(--maxH) * 100%);
  z-index: 10;
  pointer-events: all;
}
#map .map_wrap .spot > .icon {
  cursor: pointer;
  -webkit-animation-name: popupEnd;
          animation-name: popupEnd;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-duration: 0.3s;
          animation-duration: 0.3s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  z-index: 10;
  position: relative;
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
}
#map .map_wrap .spot > .name {
  cursor: pointer;
  --nameW: 200;
  --nameH: 44;
  background-color: #fff;
  color: #fff;
  border-radius: calc(infinity * 1px);
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: calc(var(--nameW) / var(--pinW) * 100%);
  height: calc(var(--nameH) / var(--pinH) * 100%);
  font-size: min(15px, 15 / var(--maxW) * 100vw);
  line-height: 1;
  left: calc((var(--nameX) - var(--pinX)) / var(--pinW) * 100%);
  top: calc((var(--nameY) - var(--pinY)) / var(--pinH) * 100%);
  overflow: hidden;
  -webkit-transition: color 0.2s ease-in;
  transition: color 0.2s ease-in;
}
#map .map_wrap .spot > .name > span {
  position: relative;
  z-index: 5;
}
#map .map_wrap .spot > .name .arrow {
  position: absolute;
  top: calc(50% - 12 / var(--nameH) * 100% / 2);
  right: calc(12 / var(--nameW) * 100%);
  width: calc(9 / var(--nameW) * 100%);
  height: calc(12 / var(--nameH) * 100%);
  background: #fff;
  -webkit-mask-image: url(../_img/icon_arrow.svg);
          mask-image: url(../_img/icon_arrow.svg);
  -webkit-mask-position: center center;
          mask-position: center center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-transition: background 0.2s ease-in;
  transition: background 0.2s ease-in;
}
#map .map_wrap .spot > .name::before {
  cursor: pointer;
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  background: var(--grd-btn);
  opacity: 1;
  z-index: 1;
  -webkit-transition: opacity 0.2s ease-in;
  transition: opacity 0.2s ease-in;
}
#map .map_wrap .spot > .name::after {
  cursor: pointer;
  content: "";
  position: absolute;
  inset: 0;
  background: transparent;
  border: solid min(2px, 2 / var(--maxW) * 100vw) transparent;
  z-index: 2;
  border-radius: calc(infinity * 1px);
}
@media (hover: hover) {
  #map .map_wrap .spot:hover {
    opacity: 1;
  }
  #map .map_wrap .spot:hover > .icon {
    -webkit-animation-name: popupStart;
            animation-name: popupStart;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
    -webkit-animation-duration: 0.4s;
            animation-duration: 0.4s;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }
  #map .map_wrap .spot:hover > .name {
    color: var(--col-brown-deep);
  }
  #map .map_wrap .spot:hover > .name .arrow {
    background: var(--col-brown-deep);
  }
  #map .map_wrap .spot:hover > .name::before {
    opacity: 0;
  }
  #map .map_wrap .spot:hover > .name::after {
    border-color: var(--col-brown-deep);
  }
}
@-webkit-keyframes popupEnd {
  0% {
    -webkit-transform: translateZ(0) scale(1.3);
            transform: translateZ(0) scale(1.3);
  }
  100% {
    -webkit-transform: translateZ(0) scale(1);
            transform: translateZ(0) scale(1);
  }
}
@keyframes popupEnd {
  0% {
    -webkit-transform: translateZ(0) scale(1.3);
            transform: translateZ(0) scale(1.3);
  }
  100% {
    -webkit-transform: translateZ(0) scale(1);
            transform: translateZ(0) scale(1);
  }
}
@-webkit-keyframes popupStart {
  0% {
    -webkit-transform: translateZ(0) scale(1);
            transform: translateZ(0) scale(1);
  }
  60% {
    -webkit-transform: translateZ(0) scale(1.6);
            transform: translateZ(0) scale(1.6);
  }
  100% {
    -webkit-transform: translateZ(0) scale(1.3);
            transform: translateZ(0) scale(1.3);
  }
}
@keyframes popupStart {
  0% {
    -webkit-transform: translateZ(0) scale(1);
            transform: translateZ(0) scale(1);
  }
  60% {
    -webkit-transform: translateZ(0) scale(1.6);
            transform: translateZ(0) scale(1.6);
  }
  100% {
    -webkit-transform: translateZ(0) scale(1.3);
            transform: translateZ(0) scale(1.3);
  }
}
#map .map_wrap .spot.spot01 {
  --pinX: 652;
  --pinY: 85.5;
}
#map .map_wrap .spot.spot01 .name {
  --nameX: 649;
  --nameY: 117;
}
#map .map_wrap .spot.spot02 {
  --pinX: 608.5;
  --pinY: 164.5;
}
#map .map_wrap .spot.spot02 .name {
  --nameX: 604;
  --nameY: 198;
}
#map .map_wrap .spot.spot03 {
  --pinX: 508;
  --pinY: 305.5;
}
#map .map_wrap .spot.spot03 .name {
  --nameX: 549;
  --nameY: 298;
}
#map .map_wrap .spot.spot04 {
  --pinX: 516.5;
  --pinY: 833;
}
#map .map_wrap .spot.spot04 .name {
  --nameX: 559;
  --nameY: 822;
}
#map .simplebar-content-wrapper.is-scrollable {
  cursor: grab;
  cursor: -webkit-grab;
}
#map .simplebar-content-wrapper.is-scrollable:active {
  cursor: grabbing;
  cursor: -webkit-grabbing;
}
#map .map_list {
  display: grid;
  gap: 8px;
  margin: 0 auto;
  width: 100%;
}
#map .map_list li {
  width: 100%;
  margin: auto;
}
#map .map_list li a {
  pointer-events: all;
  color: #fff;
  min-height: 44px;
  cursor: pointer;
  line-height: 1.3333333333;
  border-radius: calc(infinity * 1px);
  background: transparent;
  border: solid 0px transparent;
  display: grid;
  place-items: center;
  position: relative;
  overflow: hidden;
  -webkit-transition: background 0.2s ease-in, border-color 0.2s ease-in, color 0.2s ease-in;
  transition: background 0.2s ease-in, border-color 0.2s ease-in, color 0.2s ease-in;
}
#map .map_list li a::before {
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  background: var(--grd-btn);
  z-index: -1;
}
#map .map_list li a::after {
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  border: solid 2px transparent;
  border-radius: calc(infinity * 1px);
  -webkit-transition: border-color 0.2s ease-in;
  transition: border-color 0.2s ease-in;
}
#map .map_list li a .arrow {
  position: absolute;
  top: calc(50% - 7px);
  right: 16px;
  display: block;
  width: 9px;
  height: 14px;
  background: #fff;
  -webkit-mask-image: url(../_img/icon_arrow.svg);
          mask-image: url(../_img/icon_arrow.svg);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-transition: background 0.2s ease-in;
  transition: background 0.2s ease-in;
}
@media (hover: hover) {
  #map .map_list li a:hover {
    opacity: 1;
    color: var(--col-brown-deep);
    border-color: var(--col-brown-deep);
    background: #fff;
  }
  #map .map_list li a:hover .arrow {
    background: var(--col-brown-deep);
  }
  #map .map_list li a:hover::after {
    border-color: var(--col-brown-deep);
  }
}
#map #route {
  width: 100%;
  display: grid;
  gap: 8px 26px;
  grid-template-columns: 50px auto;
  grid-template-rows: auto auto;
}
#map #route h4 {
  grid-column: 1/2;
  grid-row: 1/2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 4px;
}
#map #route h4 img {
  width: 29px;
  margin-top: 0;
}
#map #route h4 img.animation {
  opacity: 0;
}
#map #route h4 img.animation.active {
  --transY: 25;
  -webkit-animation-name: fade_up;
          animation-name: fade_up;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 1.2s;
          animation-duration: 1.2s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
}
@keyframes fade_up {
  0% {
    opacity: 0;
    -webkit-transform: translateY(calc(var(--transY) * 1px));
            transform: translateY(calc(var(--transY) * 1px));
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
#map #route h4 .sub {
  -ms-writing-mode: tb-rl;
  -webkit-writing-mode: vertical-rl;
          writing-mode: vertical-rl;
  font-size: 12px;
  font-weight: bold;
  margin-top: 2px;
  letter-spacing: 0.12em;
}
#map #route .modelroute {
  grid-column: 2/3;
  grid-row: 1/2;
  overflow-x: auto;
  position: relative;
  margin-right: -16px;
}
#map #route .modelroute .scroll_icon {
  position: absolute;
  top: 148px;
  left: calc(50% - 35px);
  width: 70px;
  z-index: 100;
  -webkit-transition: opacity 0.8s ease-in, visibility 1s ease-in;
  transition: opacity 0.8s ease-in, visibility 1s ease-in;
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}
#map #route .modelroute .scroll_icon.active {
  opacity: 0;
  visibility: hidden;
}
#map .route_wrap {
  padding-top: 101px;
  padding-inline: 2px;
  padding-right: 32px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 60px;
}
#map .route_wrap li {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 4px;
  width: 16px;
}
#map .route_wrap li::before {
  content: "";
  display: block;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: var(--col-brown-deep);
}
#map .route_wrap li.station .name, #map .route_wrap li.bus .name {
  width: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  font-size: 16px;
  line-height: 1;
  -ms-writing-mode: tb-rl;
  -webkit-writing-mode: vertical-rl;
          writing-mode: vertical-rl;
}
#map .route_wrap li.spot a {
  position: relative;
  width: 48px;
  padding: 24px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
  -ms-writing-mode: tb-rl;
  -webkit-writing-mode: vertical-rl;
          writing-mode: vertical-rl;
  background: transparent;
  border-radius: calc(infinity * 1px);
  font-size: 18px;
  line-height: 1;
  color: #fff;
  overflow: hidden;
  -webkit-transition: background 0.2s ease-in, color 0.2s ease-in;
  transition: background 0.2s ease-in, color 0.2s ease-in;
}
#map .route_wrap li.spot a .arrow {
  display: block;
  width: 9px;
  height: 14px;
  background: #fff;
  -webkit-mask-image: url(../_img/icon_arrow.svg);
          mask-image: url(../_img/icon_arrow.svg);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center center;
          mask-position: center center;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-transition: background 0.2s ease-in;
  transition: background 0.2s ease-in;
}
#map .route_wrap li.spot a::before, #map .route_wrap li.spot a::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  inset: 0;
  display: block;
  background: var(--grd-btn);
  z-index: -1;
}
#map .route_wrap li.spot a::after {
  background: none;
  border-radius: calc(infinity * 1px);
  border: solid 2px var(--col-brown-deep);
  z-index: 1;
  opacity: 0;
  -webkit-transition: opacity 0.2s ease-in;
  transition: opacity 0.2s ease-in;
}
@media (hover: hover) {
  #map .route_wrap li.spot a:hover {
    opacity: 1;
    background: #fff;
    color: var(--col-brown-deep);
  }
  #map .route_wrap li.spot a:hover .arrow {
    background: var(--col-brown-deep);
  }
  #map .route_wrap li.spot a:hover::after {
    opacity: 1;
  }
}
#map .route_wrap li .route_line {
  position: absolute;
  display: block;
  top: 0;
  left: 8px;
  width: 76px;
  z-index: -1;
}
#map .route_wrap li .route_line.train {
  top: 4px;
  height: 7px;
  border: solid 2px var(--col-train);
  border-left: none;
  border-right: none;
}
#map .route_wrap li .route_line.bus {
  top: 5.5px;
  height: 4px;
  background: var(--col-bus);
}
#map .route_wrap li .route_line.walk {
  top: 3.5px;
  height: 8px;
  background: var(--col-walk);
  -webkit-mask-image: url(../_img/map_bg_walk.svg);
          mask-image: url(../_img/map_bg_walk.svg);
  -webkit-mask-position: center center;
          mask-position: center center;
  -webkit-mask-size: 8px auto;
          mask-size: 8px auto;
}
#map .route_wrap li .route_time {
  position: absolute;
  top: -10px;
  right: -30px;
  width: 5px;
  height: 5px;
  background: var(--col-brown-deep);
  border-radius: 50%;
}
#map .route_wrap li .route_time::after {
  content: "";
  position: absolute;
  top: -15px;
  left: calc(50% - 0.5px);
  display: block;
  width: 1px;
  height: 15px;
  background: var(--col-brown-deep);
}
#map .route_wrap li .route_time .route_time_inner {
  position: absolute;
  top: 0;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  white-space: nowrap;
  font-size: 15px;
  line-height: 1.2;
  translate: -50% calc(-100% - 15px);
  display: grid;
  gap: 3px;
  text-decoration: none;
}
#map .route_wrap li .route_time .route_time_inner:before {
  content: "";
  display: block;
  width: 21px;
  height: 19px;
  margin: auto;
}
#map .route_wrap li .route_time .route_time_inner.train:before {
  background: url(../_img/route_icon_train.svg) center center no-repeat;
}
#map .route_wrap li .route_time .route_time_inner.bus:before {
  background: url(../_img/route_icon_bus.svg) center center no-repeat;
}
#map .route_wrap li .route_time .route_time_inner.walk:before {
  background: url(../_img/route_icon_walk.svg) center center no-repeat;
}
#map .simple_bar_wrap {
  padding: 0 0 10px 0;
  overflow-x: scroll;
  -ms-overflow-style: none;
  /* IE, Edge 対応 */
  scrollbar-width: none;
  /* Firefox 対応 */
}
#map .simple_bar_wrap::-webkit-scrollbar {
  /* Chrome, Safari 対応 */
  display: none;
}
#map .simple_bar_wrap .simplebar-scrollbar::before {
  inset: 0;
  top: 6px;
  background: #bababa;
  border-radius: 2px;
  height: 4px !important;
  margin-left: 0;
  margin-top: 0;
}
#map .simple_bar_wrap .simplebar-scrollbar.simplebar-visible::before {
  opacity: 1;
}
#map .simple_bar_wrap .simplebar-track {
  background: transparent;
  height: 10px !important;
}
#map .annotation {
  grid-column: 1/3;
  grid-row: 2/3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0 auto;
  gap: 4px 24px;
  width: 100%;
  max-width: 294px;
}
#map .annotation li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 8px;
}
#map .annotation li .line {
  width: 20px;
}
#map .annotation li .line.train {
  border: solid 2px var(--col-train);
  border-left: none;
  border-right: none;
  padding: 2px;
}
#map .annotation li .line.bus {
  background-color: var(--col-bus);
  height: 4px;
}
#map .annotation li .line.walk {
  height: 5px;
  position: relative;
}
#map .annotation li .line.walk > span, #map .annotation li .line.walk::before, #map .annotation li .line.walk::after {
  content: "";
  position: absolute;
  top: calc(50% - 2px);
  left: 0;
  display: block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--col-walk);
}
#map .annotation li .line.walk > span {
  left: calc(50% - 2px);
}
#map .annotation li .line.walk::after {
  left: auto;
  right: 0;
}
#map .annotation li img {
  width: 15px;
}
#map .annotation li img.train {
  width: 15.5px;
}
#map .annotation li img.bus {
  width: 20px;
}
#map .annotation li img.walk {
  width: 12px;
}
#map .annotation li p {
  font-size: 15px;
  font-weight: bold;
}
#map .annotation li:nth-child(1) {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
#map .annotation li:nth-child(2) {
  -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
          order: 3;
}
#map .annotation li:nth-child(3) {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}
#map #winter {
  background: var(--col-white-90);
  padding: 32px 16px;
  border-radius: 12px;
  display: grid;
  gap: 32px;
}
#map #winter .inner_wrap {
  display: grid;
  gap: 24px;
}
#map #winter .inner_wrap hgroup.title {
  display: grid;
  gap: 14px;
}
#map #winter .inner_wrap hgroup.title .balloon {
  font-size: 12px;
  font-weight: bold;
  letter-spacing: 0.1em;
  background-color: var(--col-orange-light);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: auto;
  padding: 8px 24px;
  border-radius: calc(infinity * 1px);
  position: relative;
  white-space: nowrap;
}
#map #winter .inner_wrap hgroup.title .balloon::after {
  content: "";
  margin-right: -0.1em;
}
#map #winter .inner_wrap hgroup.title .balloon::before {
  content: "";
  position: absolute;
  bottom: -8px;
  left: calc(50% - 8px);
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 8px solid transparent;
  border-left: 8px solid transparent;
  border-top: 8px solid var(--col-orange-light);
  border-bottom: 0;
}
#map #winter .inner_wrap hgroup.title .main {
  font-size: 24px;
}
#map #winter .inner_wrap .lead {
  text-align: left;
  line-height: 1.8666666667;
}
#map #winter .inner_wrap .lead .color {
  font-style: normal;
  font-weight: bold;
  color: var(--col-orange-deep);
}
#map #winter .inner_wrap .fig_wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 8px;
}
#map #winter .inner_wrap .fig_wrap figure {
  display: block;
  position: relative;
  border-radius: 2.7px;
  overflow: hidden;
}
#map #winter .inner_wrap .fig_wrap figure figcaption {
  position: absolute;
  bottom: 8px;
  right: 8px;
  font-size: 12px;
  font-weight: bold;
  line-height: 1;
  letter-spacing: 0.04em;
  color: var(--col-brown-deep);
  text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.86), -1px 1px 1px rgba(255, 255, 255, 0.86), -1px -1px 1px rgba(255, 255, 255, 0.86), 1px -1px 1px rgba(255, 255, 255, 0.86), 1px 1px 1px rgba(255, 255, 255, 0.86), -1px 1px 1px rgba(255, 255, 255, 0.86), -1px -1px 1px rgba(255, 255, 255, 0.86), 1px -1px 1px rgba(255, 255, 255, 0.86);
}
#map #winter .inner_wrap .fig_wrap .fig_title {
  font-size: 16px;
  line-height: 1.5;
  display: grid;
}
#map #winter .btn_wrap {
  display: grid;
  gap: 16px;
}
#map #winter .btn_wrap .note {
  max-width: 462.5px;
  margin: auto;
  font-size: 13px;
  text-align: left;
}
#map #winter .btn_wrap .note a {
  margin: -2px -3px;
  padding: 2px 3px;
  text-decoration: underline;
  color: var(--col-brown-deep);
  -webkit-transition: opacity 0.2s ease-in;
  transition: opacity 0.2s ease-in;
}
#map #winter .btn_wrap .note a:hover {
  opacity: 0.5;
}
#map #winter .btn {
  position: relative;
  width: 100%;
  max-width: 462.5px;
  min-height: 44px;
  margin: auto;
  height: auto;
  font-size: 15px;
  line-height: 1;
  color: #fff;
  border-radius: calc(infinity * 1px);
  background: #fff;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: background 0.2s ease-in, color 0.2s ease-in;
  transition: background 0.2s ease-in, color 0.2s ease-in;
}
#map #winter .btn > span {
  display: block;
  width: 100%;
  position: relative;
}
#map #winter .btn > span::after {
  content: "";
  position: absolute;
  top: calc(50% - 7px);
  right: 16px;
  display: block;
  width: 9px;
  height: 14px;
  background-color: #fff;
  -webkit-mask-image: url(../_img/icon_arrow.svg);
          mask-image: url(../_img/icon_arrow.svg);
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center center;
          mask-position: center center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-transition: background 0.2s ease-in;
  transition: background 0.2s ease-in;
}
#map #winter .btn::before {
  content: "";
  position: absolute;
  display: block;
  inset: 0;
  background: var(--grd-btn);
  opacity: 1;
  -webkit-transition: opacity 0.2s ease-in;
  transition: opacity 0.2s ease-in;
}
#map #winter .btn::after {
  content: "";
  position: absolute;
  display: block;
  inset: 0;
  border: solid 2px var(--col-brown-deep);
  border-radius: calc(infinity * 1px);
  opacity: 0;
  -webkit-transition: opacity 0.2s ease-in;
  transition: opacity 0.2s ease-in;
}
@media (hover: hover) {
  #map #winter .btn:hover {
    opacity: 1;
    color: var(--col-brown-deep);
  }
  #map #winter .btn:hover > span::after {
    background-color: var(--col-brown-deep);
  }
  #map #winter .btn:hover::before {
    opacity: 0;
  }
  #map #winter .btn:hover::after {
    opacity: 1;
  }
}

/* ／ MAP */
/* 遊び方 */
#howto .content_wrap .common_right_content > ul {
  display: grid;
  gap: 36px;
}
#howto .content_wrap .common_right_content > ul > li {
  position: relative;
  background: var(--col-white-90);
  border-radius: 12px;
  padding: 24px;
  display: grid;
  gap: 16px;
}
#howto .content_wrap .common_right_content > ul > li .num {
  position: absolute;
  top: -8px;
  left: -8px;
  width: 60px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 18px;
  line-height: 1.6666666667;
  background: var(--col-orange-deep);
}
#howto .content_wrap .common_right_content > ul > li > img {
  width: 60px;
  margin: auto;
}
#howto .content_wrap .common_right_content > ul > li .text_wrap {
  display: grid;
  gap: 8px;
}
#howto .content_wrap .common_right_content > ul > li .text_wrap h4 {
  font-size: 18px;
  line-height: 1.5555555556;
}
#howto .content_wrap .common_right_content > ul > li .text_wrap .lead {
  line-height: 1.8666666667;
  text-align: left;
}
#howto .content_wrap .common_right_content > ul > li .text_wrap .lead em {
  font-style: normal;
  font-weight: bold;
}
#howto .content_wrap .common_right_content > ul > li:not(:last-child)::after {
  content: "";
  position: absolute;
  bottom: -26px;
  left: calc(50% - 22px);
  display: block;
  width: 44px;
  height: 16px;
  background: #fff;
  opacity: 0.5;
  -webkit-mask-image: url(../_img/howto_arrow.svg);
          mask-image: url(../_img/howto_arrow.svg);
  -webkit-mask-position: center top;
          mask-position: center top;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
}
#howto .content_wrap a.btn_dl {
  margin-top: 8px;
}

#howto .common_right_content > ul li.animation {
  opacity: 0;
}
#howto .common_right_content > ul li.animation .num {
  opacity: 0;
}
#howto .common_right_content > ul li.animation.active {
  -webkit-animation-name: fadeup;
          animation-name: fadeup;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.5s;
          animation-duration: 0.5s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
}
@keyframes fadeup {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
#howto .common_right_content > ul li.animation.active .num {
  -webkit-animation-name: pop;
          animation-name: pop;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.5s;
          animation-duration: 0.5s;
  -webkit-animation-timing-function: ease-in;
          animation-timing-function: ease-in;
}
@-webkit-keyframes pop {
  0% {
    opacity: 0;
    -webkit-transform: scale(80%);
            transform: scale(80%);
  }
  80% {
    opacity: 1;
    -webkit-transform: scale(110%);
            transform: scale(110%);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(100%);
            transform: scale(100%);
  }
}
@keyframes pop {
  0% {
    opacity: 0;
    -webkit-transform: scale(80%);
            transform: scale(80%);
  }
  80% {
    opacity: 1;
    -webkit-transform: scale(110%);
            transform: scale(110%);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(100%);
            transform: scale(100%);
  }
}

/* ／ 遊び方 */
/*豪華賞品*/
#presents .content_wrap .common_right_content {
  display: grid;
  gap: 24px;
  margin: 0 auto 80px;
}
#presents .content_wrap .wrap {
  margin: auto;
  padding: 24px 16px;
  width: 100%;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 10px;
  text-align: left;
  position: relative;
}
#presents .content_wrap .wrap .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
  background: var(--grd-main);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 24px;
}
#presents .content_wrap .wrap .title > img {
  width: 44px;
  -webkit-filter: drop-shadow(1px 1px 10px rgba(0, 0, 0, 0.1019607843));
          filter: drop-shadow(1px 1px 10px rgba(0, 0, 0, 0.1019607843));
}
#presents .content_wrap .wrap .title_lead {
  font-size: 18px;
  line-height: 1.5555555556;
  font-weight: bold;
}
#presents .content_wrap .wrap .title_lead .color {
  font-style: normal;
  color: var(--col-orange-deep);
}
#presents .content_wrap .wrap ul.list {
  font-size: 12px;
}
#presents .content_wrap .wrap ul.dates_list {
  padding-left: 1em;
}
#presents .content_wrap #kyoto_prize {
  display: grid;
  gap: 32px;
  --grid: 32;
}
#presents .content_wrap #kyoto_prize .text_wrap {
  display: grid;
  gap: 12px;
}
#presents .content_wrap #kyoto_prize .prize_img {
  border-radius: 4px;
  overflow: hidden;
}
#presents .content_wrap #kyoto_prize .exchange_wrap {
  margin: calc(24 - var(--grid) * 1px) auto 0;
  background: var(--col-bg-beige);
  padding: 24px 16px;
  display: grid;
  gap: 24px;
  border-radius: 12px;
}
#presents .content_wrap #kyoto_prize .exchange_wrap .exchange_title {
  font-size: 18px;
  text-align: center;
}
#presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 16px;
}
#presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 2px;
  border-radius: 4px;
  overflow: hidden;
}
#presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl dt {
  padding: 4px 0;
  line-height: 1.75;
  font-weight: bold;
  text-align: center;
  background: var(--col-orange-light);
}
#presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl dd {
  padding: 8px;
  margin-top: -2px;
  background: #fff;
  line-height: 1.8666666667;
  display: grid;
  gap: 10px;
}
#presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl dd .kome {
  display: block;
  font-size: 12px;
  line-height: 1.5;
}
#presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl.exchange_img dt {
  background: #fff;
  padding: 12px 0;
}
#presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl.exchange_img dd {
  padding: 0;
}
#presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl.exchange_img dd a.zoom_link {
  display: block;
  cursor: pointer;
  position: relative;
}
#presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl.exchange_img dd a.zoom_link .zoom_mark {
  position: absolute;
  bottom: 6px;
  right: 6px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 2px;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  font-size: 10px;
  line-height: 1;
  border: solid 1px var(--col-bg-orange);
  background: var(--col-bg-orange);
  color: #fff;
  -webkit-transition: background 0.2s ease-in, color 0.2s ease-in;
  transition: background 0.2s ease-in, color 0.2s ease-in;
}
#presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl.exchange_img dd a.zoom_link .zoom_mark::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background: #fff;
  -webkit-mask-image: url(../_img/icon_zoom_in.svg);
          mask-image: url(../_img/icon_zoom_in.svg);
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-transition: background 0.2s ease-in;
  transition: background 0.2s ease-in;
}
#presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl.exchange_img dd a.zoom_link img {
  opacity: 1;
  -webkit-transition: opacity 0.2s ease-in;
  transition: opacity 0.2s ease-in;
}
#presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl.exchange_img dd a.zoom_link .zoom2_img {
  width: 45.8874458874%;
  margin: 0 auto 12px;
  border: solid 1px var(--col-orange-light);
  border-radius: 6px;
  overflow: hidden;
}
@media (hover: hover) {
  #presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl.exchange_img dd a.zoom_link:hover {
    opacity: 1;
  }
  #presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl.exchange_img dd a.zoom_link:hover .zoom_mark {
    background: #fff;
    color: var(--col-bg-orange);
  }
  #presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl.exchange_img dd a.zoom_link:hover .zoom_mark::before {
    background: var(--col-bg-orange);
  }
  #presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl.exchange_img dd a.zoom_link:hover img {
    opacity: 0.5;
  }
}
#presents .content_wrap #shinkansen_prize {
  display: grid;
  gap: 32px;
  --grid: 32;
}
#presents .content_wrap #shinkansen_prize .text_wrap {
  display: grid;
  gap: 24px;
  --grid: 24;
}
#presents .content_wrap #shinkansen_prize .text_wrap .title {
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
}
#presents .content_wrap #shinkansen_prize .text_wrap .title_lead {
  margin-top: calc((var(--grid) - 8) * -1px);
}
#presents .content_wrap #shinkansen_prize .text_wrap .btn_dl {
  margin-top: calc((var(--grid) - 12) * -1px);
}
#presents .content_wrap #shinkansen_prize .prize_img {
  border-radius: 4px;
  overflow: hidden;
}
#presents .content_wrap #shinkansen_prize .list {
  margin-top: calc((var(--grid) - 24) * -1px);
}
#presents .content_wrap #common_prize {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  padding-bottom: 32px;
  display: grid;
  gap: 32px;
  --gap: 32;
}
#presents .content_wrap #common_prize .common_top_wrap {
  display: grid;
  gap: 16px;
  --gap: 16;
}
#presents .content_wrap #common_prize .common_top_wrap hgroup {
  display: grid;
  gap: 4px;
}
#presents .content_wrap #common_prize .common_top_wrap hgroup .title_sub {
  font-size: 15px;
  background: var(--grd-main);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#presents .content_wrap #common_prize .common_top_wrap .lead {
  margin-top: calc((var(--gap) - 8) * -1px);
}
#presents .content_wrap #common_prize .common_top_wrap .lead em {
  font-style: normal;
  font-weight: bold;
  color: var(--col-orange-deep);
}
#presents .content_wrap #common_prize .common_bnr_wrap {
  margin-top: calc((var(--gap) - 24) * -1px);
  position: relative;
  display: grid;
  gap: 16px;
}
#presents .content_wrap #common_prize .common_bnr_wrap::before, #presents .content_wrap #common_prize .common_bnr_wrap::after {
  content: "";
  position: absolute;
  top: calc(50% - 1.5px);
  left: calc(50% - 27.5px);
  display: block;
  width: 55px;
  height: 3px;
  background: var(--col-brown-deep);
  rotate: 45deg;
}
#presents .content_wrap #common_prize .common_bnr_wrap::after {
  rotate: -45deg;
}
#presents .content_wrap #common_prize .common_bnr_wrap img {
  border-radius: 12px;
}
#presents .content_wrap #common_prize .common_middle_wrap {
  display: grid;
  gap: 24px;
  --gap: 24;
}
#presents .content_wrap #common_prize .common_middle_wrap .list {
  margin-top: calc((var(--gap) - 8) * -1px);
}
#presents .content_wrap #common_prize .common_middle_wrap .prize_img {
  overflow: hidden;
  border-radius: 4px;
}
#presents .content_wrap #common_prize .common_bottom_wrap {
  display: grid;
  gap: 8px;
}
#presents .content_wrap #common_prize .common_bottom_wrap ul {
  display: grid;
  gap: 4px;
}
#presents .content_wrap #common_prize .common_bottom_wrap ul li {
  background: var(--col-white-90);
  border-radius: 4px;
  display: grid;
  gap: 8px;
  padding: 8px 16px;
}
#presents .content_wrap #common_prize .common_bottom_wrap ul li .num {
  width: 34px;
  height: 34px;
  font-size: 14px;
  color: #fff;
  display: grid;
  place-items: center;
  background: var(--col-bg-orange);
  border-radius: 50%;
  margin: auto;
}
#presents .content_wrap #common_prize .common_bottom_wrap ul li p {
  line-height: 1.8666666667;
}
#presents .content_wrap #common_prize .common_bottom_wrap ul li p em {
  font-style: normal;
  font-weight: bold;
}
#presents .content_wrap #common_prize .horse {
  position: absolute;
  width: 95px;
  height: auto;
  top: -24px;
  right: -16px;
}
#presents .content_wrap #common_prize.animation {
  background: -webkit-gradient(linear, left top, right top, from(rgba(218, 243, 255, 0.9019607843)), color-stop(rgba(255, 206, 162, 0.9019607843)), color-stop(rgba(255, 206, 162, 0.9019607843)), color-stop(rgba(218, 243, 255, 0.9019607843)), color-stop(rgba(218, 243, 255, 0.9019607843)), color-stop(rgba(255, 206, 162, 0.9019607843)), color-stop(rgba(255, 206, 162, 0.9019607843)), to(rgba(218, 243, 255, 0.9019607843)));
  background: linear-gradient(90deg, rgba(218, 243, 255, 0.9019607843), rgba(255, 206, 162, 0.9019607843), rgba(255, 206, 162, 0.9019607843), rgba(218, 243, 255, 0.9019607843), rgba(218, 243, 255, 0.9019607843), rgba(255, 206, 162, 0.9019607843), rgba(255, 206, 162, 0.9019607843), rgba(218, 243, 255, 0.9019607843));
  background-size: 800%;
  background-position: top right;
}
#presents .content_wrap #common_prize.animation.active {
  -webkit-animation-name: common_prize_animation, common_fadeup;
          animation-name: common_prize_animation, common_fadeup;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 5s, 0.5s;
          animation-duration: 5s, 0.5s;
  -webkit-animation-iteration-count: 1;
          animation-iteration-count: 1;
  -webkit-animation-timing-function: ease-in-out, ease-out;
          animation-timing-function: ease-in-out, ease-out;
  -webkit-animation-delay: 0.1s, 0;
          animation-delay: 0.1s, 0;
}
@-webkit-keyframes common_prize_animation {
  0% {
    background-position: top right;
  }
  100% {
    background-position: top left;
  }
}
@keyframes common_prize_animation {
  0% {
    background-position: top right;
  }
  100% {
    background-position: top left;
  }
}
#presents .content_wrap #fujisan {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  background: var(--grd-fuji-blue-bg);
  margin-top: -24px;
  display: grid;
  gap: 16px;
  position: relative;
}
#presents .content_wrap #fujisan .title {
  color: #fff;
  background: none;
  background-clip: unset;
  -webkit-text-fill-color: unset;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 0;
}
#presents .content_wrap #fujisan .detail {
  line-height: 1.8666666667;
  color: #fff;
  display: grid;
  gap: 8px;
}
#presents .content_wrap #fujisan .detail dt {
  font-weight: bold;
  text-align: center;
  border-top: solid 1px #fff;
  border-bottom: solid 1px #fff;
  padding: 2px 0;
}
#presents .content_wrap #fujisan .detail dd:nth-of-type(1) {
  margin-bottom: 8px;
}
#presents .content_wrap #fujisan a.btn_simple.btn_blue {
  color: var(--col-fuji-blue);
  line-height: 1.6;
  padding: 2px 16px;
  background: #fff;
}
#presents .content_wrap #fujisan a.btn_simple.btn_blue::after {
  background: var(--col-fuji-blue);
}
@media (hover: hover) {
  #presents .content_wrap #fujisan a.btn_simple.btn_blue:hover {
    background: var(--col-fuji-blue);
    color: #fff;
  }
  #presents .content_wrap #fujisan a.btn_simple.btn_blue:hover::after {
    background: #fff;
  }
}
#presents .content_wrap #fujisan .horse {
  position: absolute;
  width: 95px;
  height: auto;
  top: -32px;
  left: -64px;
}
#presents .content_wrap .horse.animation {
  display: block;
  --jumppx: 12;
}
#presents .content_wrap .horse.animation.active {
  -webkit-animation-name: horse_animation;
          animation-name: horse_animation;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-iteration-count: 2;
          animation-iteration-count: 2;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-delay: 0;
          animation-delay: 0;
  -webkit-animation-direction: alternate;
          animation-direction: alternate;
}
@keyframes horse_animation {
  0% {
    translate: 0 0;
  }
  50% {
    translate: 0 calc(var(--jumppx) * 1% * -1 * 0.6);
  }
  70% {
    translate: 0 0;
  }
  100% {
    translate: 0 calc(var(--jumppx) * 1% * -1);
  }
}

/*／ 豪華賞品*/
/* 開催要項 */
#details .content_wrap {
  position: relative;
}
#details .content_wrap .wrap {
  width: 100%;
  margin: auto;
  text-align: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 24px;
}
#details .content_wrap .wrap h3 {
  color: #fff;
  font-size: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
  margin-bottom: -8px;
  position: relative;
  display: flex;
  -ms-flex-line-pack: center;
      align-content: center;
  gap: 12px;
}
#details .content_wrap .wrap h3::before {
  content: "";
  display: block;
  width: 22px;
  height: 15px;
  background: url(../_img/icon_ohgi@2x.png) center center no-repeat;
  background-size: contain;
}
#details .content_wrap .wrap ul,
#details .content_wrap .wrap dl {
  padding: 16px;
  font-size: 15px;
  line-height: 1.87;
  border-radius: 8px;
}
#details .content_wrap .wrap dl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 2px;
  padding: 0;
}
#details .content_wrap .wrap dl dt {
  padding: 4px 16px;
  font-weight: bold;
  line-height: 1.75;
  width: 100%;
  background-color: var(--col-bg-orange-pale);
}
#details .content_wrap .wrap dl dt:first-child {
  border-radius: 8px 8px 0 0;
}
#details .content_wrap .wrap dl dd {
  padding: 8px 16px;
  position: relative;
  width: 100%;
  background: var(--col-white-90);
  margin-top: -2px;
}
#details .content_wrap .wrap dl dd .kome {
  display: block;
  padding-left: 1em;
  text-indent: -1em;
}
#details .content_wrap .wrap dl dd:last-child {
  border-radius: 0 0 8px 8px;
}
#details .content_wrap .wrap .nakaguro {
  background: var(--col-white-90);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 4px;
}
#details .content_wrap .wrap .nakaguro li {
  padding-left: 1em;
  position: relative;
  line-height: 1.8666666667;
}
#details .content_wrap .wrap .nakaguro li::before {
  content: "";
  position: absolute;
  top: calc(0.5em + 3px);
  left: 0;
  display: block;
  width: 6px;
  height: 6px;
  background-color: var(--col-brown-deep);
  border-radius: 50%;
}
#details .content_wrap .sponsored {
  font-size: 15px;
  line-height: 1.6;
  color: var(--col-white-90);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 4px;
  margin-top: 24px;
}
#details .content_wrap .sponsored > span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#details .content_wrap .sponsored > span > span:first-child {
  width: 6em;
}
#details .content_wrap .sponsored > span .img {
  max-width: 246px;
  width: calc(100% - 6em);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

/*／ 開催要項 */
/* おすすめ情報 */
#recommend .content_wrap h3 {
  margin: 0 auto 32px;
  width: 149.52px;
}
#recommend .content_wrap .bnr_wrap {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 16px;
}
#recommend .content_wrap .bnr_wrap a {
  margin: auto;
  width: 100%;
  max-width: 725px;
  border-radius: 4px;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #bdbdbd;
  -webkit-transition: opacity 0.2s ease-in;
  transition: opacity 0.2s ease-in;
}
@media (hover: hover) {
  #recommend .content_wrap .bnr_wrap a:hover {
    opacity: 0.8;
  }
}
#recommend .content_wrap .notes {
  width: 100%;
  font-size: 13px;
  line-height: 1.2;
  margin: 32px auto 0;
}
#recommend .content_wrap .notes p {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 0 0 auto;
}

/* ／ おすすめ情報 */
.remodal-wrapper {
  padding: 16px 16px 0;
}

/*ZOOMモーダル*/
.modal_zoom {
  padding: 0 !important;
  max-width: 600px;
  overflow: hidden;
  border-radius: 12px;
}
.modal_zoom .content_wrap {
  padding: 24px;
}
.modal_zoom .content_wrap h3 {
  font-size: 24px;
  margin: 0 auto 24px;
  font-weight: bold;
}
.modal_zoom .content_wrap .wrap {
  margin: 0 auto 32px;
}
.modal_zoom .content_wrap .wrap figure {
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  margin: auto;
}
.modal_zoom .content_wrap .wrap figure.place {
  max-width: 745px;
}
.modal_zoom .content_wrap .wrap figure.screen {
  max-width: 338px;
}

/*／ ZOOMモーダル*/
/*／ 豪華賞品*/
#shinkansen-nazo {
  max-width: 600px;
  padding: 0;
  border-radius: 12px;
  overflow: hidden;
}
#shinkansen-nazo .content_wrap {
  background: #fff;
  padding: 32px 24px;
}
#shinkansen-nazo .content_wrap h3.common_title {
  font-size: 24px;
  line-height: 1.5;
  margin: 0 auto 24px;
  display: grid;
  gap: 8px;
  letter-spacing: 0.04em;
}
#shinkansen-nazo .content_wrap h3.common_title img {
  width: 57px;
  margin: auto;
}
#shinkansen-nazo .content_wrap .wrap {
  text-align: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 16px;
  margin-bottom: 24px;
}
#shinkansen-nazo .content_wrap .wrap .bigger {
  font-size: 15px;
  line-height: 1.8666666667;
}
#shinkansen-nazo .content_wrap .wrap .bigger .color {
  font-weight: bold;
  color: var(--col-orange-deep);
}
#shinkansen-nazo .content_wrap .wrap .kome li {
  position: relative;
  font-size: 12px;
  line-height: normal;
  padding-left: 1em;
}
#shinkansen-nazo .content_wrap .wrap .kome li::before {
  content: "※";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 1em;
  height: 1em;
}

.remodal.section .content_wrap .btn {
  cursor: pointer;
  width: 100%;
  height: 44px;
  border: solid 1px var(--col-brown-deep);
  background: #fff;
  font-size: 15px;
  line-height: 1;
  color: var(--col-brown-deep);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: auto;
  border-radius: calc(infinity * 1px);
  -webkit-transition: color 0.2s ease-in, background 0.2s ease-in, border-color 0.2s ease-in;
  transition: color 0.2s ease-in, background 0.2s ease-in, border-color 0.2s ease-in;
}
@media (hover: hover) {
  .remodal.section .content_wrap .btn:hover {
    opacity: 1;
    color: #fff;
    background-color: var(--col-brown-deep);
    border-color: #fff;
  }
}

/*紹介スポットモーダル*/
.remodal-wrapper:has(.modal_map) {
  padding-block: 30px;
}

.modal_map {
  padding: 16px 16px 24px;
  width: 100%;
  border-radius: 12px;
  position: relative;
  background: #fff;
  /* 楽しもうコンテンツ */
}
.modal_map > .close_btn {
  overflow: hidden;
  text-indent: -1000em;
  position: absolute;
  top: -24px;
  right: -11px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: solid 2px var(--col-brown-deep);
  background: var(--col-brown-deep);
  -webkit-transition: background 0.2s ease-in;
  transition: background 0.2s ease-in;
}
.modal_map > .close_btn::before, .modal_map > .close_btn::after {
  content: "";
  position: absolute;
  top: calc(50% - 0.5px);
  left: calc(50% - 12px);
  display: block;
  width: 24px;
  height: 2px;
  background: #fff;
  border-radius: 1px;
  rotate: 45deg;
  -webkit-transition: background 0.2s ease-in;
  transition: background 0.2s ease-in;
}
.modal_map > .close_btn::after {
  rotate: 135deg;
}
@media (hover: hover) {
  .modal_map > .close_btn:hover {
    opacity: 1;
    background: #fff;
  }
  .modal_map > .close_btn:hover::before, .modal_map > .close_btn:hover::after {
    background: var(--col-brown-deep);
  }
}
.modal_map .header {
  text-align: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 16px;
  margin: 0 auto 16px;
}
.modal_map .header .figure_wrap {
  position: relative;
  max-width: 375px;
  margin: auto;
}
.modal_map .header .figure_wrap figure.main_img {
  border-radius: 10px;
  overflow: hidden;
  position: relative;
  display: block;
  width: 100%;
}
.modal_map .header .figure_wrap figure.main_img figcaption {
  position: absolute;
  bottom: 4px;
  right: 8px;
  color: #fff;
  font-size: 9px;
  font-weight: bold;
  line-height: 1;
  --col-shadow: rgba(0, 0, 0, 0.2);
  text-shadow: 1px 1px 1px var(--col-shadow), -1px -1px 1px var(--col-shadow), 1px -1px 1px var(--col-shadow), -1px 1px 1px var(--col-shadow);
}
.modal_map .header h3 {
  font-size: 26px;
  line-height: 1.5;
  color: var(--col-brown-deep);
  margin: auto;
  letter-spacing: 0.04em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.modal_map .header h3::after {
  content: "";
  margin-left: -0.04em;
}
.modal_map .header h3 .note {
  display: block;
  margin-top: 4px;
  font-size: 13px;
}
.modal_map .header .time {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: auto;
  font-weight: bold;
  font-size: 15px;
  line-height: 1.75;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0 8px;
}
.modal_map .header .time dt {
  padding: 4px 16px 4px 36px;
  background: var(--col-bg-orange-pale) url(../_img/modal_map_icon_timemini.svg) left 16px center no-repeat;
  background-size: 16px auto;
  border-radius: calc(infinity * 1px);
  white-space: nowrap;
}
.modal_map .header .time dd {
  padding: 10px 0 8px;
}
.modal_map .header .memo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-line-pack: center;
      align-content: center;
  margin: 0 auto 0;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  font-size: 12px;
  line-height: normal;
  gap: 1px;
}
.modal_map .header .memo li {
  text-indent: -1em;
  padding-left: 1em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: auto;
}
.modal_map .know {
  text-align: left;
  margin-bottom: 16px;
}
.modal_map .know h4,
.modal_map .know h5 {
  font-size: 20px;
  line-height: 1.5;
  letter-spacing: 0.04em;
  margin-bottom: 8px;
  padding: 0 0 4px 32px;
  border-bottom: 1px solid var(--col-brown-light);
  background: url(../_img/modal_map_icon_know.svg) top 2px left no-repeat;
  background-size: 24px auto;
}
.modal_map .know h5 {
  margin-top: 16px;
}
.modal_map .know h5.price {
  background-image: url(../_img/modal_map_icon_price.svg);
}
.modal_map .know h5.time {
  background-image: url(../_img/modal_map_icon_time.svg);
}
.modal_map .know h5.access {
  background-image: url(../_img/modal_map_icon_access.svg);
}
.modal_map .know > .lead, .modal_map .know > .detail {
  margin: 0 auto 16px;
  font-size: 15px;
  line-height: 1.8666666667;
}
.modal_map .know > .lead em, .modal_map .know > .detail em {
  font-style: normal;
  font-weight: bold;
}
.modal_map .know h5.time + .detail {
  line-height: 1.75;
}
.modal_map .know ul.detail {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 2px;
}
.modal_map .know ul.detail li {
  padding-left: 1.2em;
  position: relative;
}
.modal_map .know ul.detail li::before {
  content: "・";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 1.5em;
  height: 1.5em;
  color: var(--col-brown-deep);
}
.modal_map .know ul.list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 2px;
}
.modal_map .know ul.list li {
  padding-left: 20px;
  line-height: 1.6;
  position: relative;
}
.modal_map .know ul.list li.address {
  padding-left: 20px;
}
.modal_map .know ul.list li.address::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  display: block;
  width: 16px;
  height: 16px;
  background: url(../_img/icon_address.svg) center center no-repeat;
  background-size: 16px auto;
}
.modal_map .know ul.list li.kuromaru {
  padding-left: 20px;
}
.modal_map .know ul.list li.kuromaru::before {
  content: "";
  position: absolute;
  top: calc(50% - 2px);
  left: 8px;
  display: block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--col-brown-deep);
}
.modal_map .know .info {
  margin: -8px auto 0;
  padding: 4px 8px;
  width: 100%;
  background: #f4f4f4;
  border-radius: 4px;
}
.modal_map .know .info dl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  line-height: 1.5;
  gap: 1em;
}
.modal_map .know .info dl dt {
  position: relative;
  padding-left: 26px;
}
.modal_map .know .info dl dt::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  display: block;
  width: 18px;
  height: 18px;
  background: url(../_img/icon_info.svg) center center no-repeat;
}
.modal_map .know .info dl dt::after {
  content: "：";
  position: absolute;
  top: 0;
  right: -1em;
  display: block;
  width: 1em;
  height: 1.5em;
}
.modal_map .know .info dl dd em {
  font-weight: bold;
  font-style: normal;
}
.modal_map .btn_wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-line-pack: center;
      align-content: center;
  gap: 8px 16px;
}
.modal_map .btn {
  position: relative;
  width: 100%;
  min-height: 44px;
  height: auto;
  padding: 12px 25px;
  font-size: 15px;
  line-height: 1;
  color: #fff;
  font-weight: bold;
  border-radius: calc(infinity * 1px);
  background: #fff;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 4px 1em;
  border: solid 2px transparent;
  -webkit-transition: background 0.2s ease-in, color 0.2s ease-in;
  transition: background 0.2s ease-in, color 0.2s ease-in;
}
.modal_map .btn > span {
  position: relative;
}
.modal_map .btn::before {
  content: "";
  position: absolute;
  display: block;
  inset: 0;
  background: var(--grd-btn);
  opacity: 1;
  -webkit-transition: opacity 0.2s ease-in;
  transition: opacity 0.2s ease-in;
}
.modal_map .btn::after {
  content: "";
  position: absolute;
  top: calc(50% - 7px);
  right: 16px;
  display: block;
  width: 9px;
  height: 14px;
  background-color: #fff;
  -webkit-mask-image: url(../_img/icon_arrow.svg);
          mask-image: url(../_img/icon_arrow.svg);
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center center;
          mask-position: center center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-transition: background 0.2s ease-in;
  transition: background 0.2s ease-in;
}
@media (hover: hover) {
  .modal_map .btn:hover {
    opacity: 1;
    color: var(--col-brown-deep);
    border-color: var(--col-brown-deep);
  }
  .modal_map .btn:hover::before {
    opacity: 0;
  }
  .modal_map .btn:hover::after {
    background-color: var(--col-brown-deep);
  }
}
.modal_map .enjoy_wrap {
  display: grid;
  gap: 16px;
  margin-bottom: 24px;
}
.modal_map .enjoy_wrap .enjoy {
  background: var(--col-bg-beige);
  border-radius: 12px;
  padding: 24px 16px;
  display: grid;
  gap: 16px;
}
.modal_map .enjoy_wrap .enjoy hgroup {
  display: grid;
  gap: 12px;
}
.modal_map .enjoy_wrap .enjoy hgroup .balloon {
  font-size: 12px;
  font-weight: bold;
  width: 206px;
  height: 30px;
  display: grid;
  place-items: center;
  position: relative;
  margin: auto;
  background: var(--col-orange-light);
  border-radius: calc(infinity * 1px);
}
.modal_map .enjoy_wrap .enjoy hgroup .balloon::after {
  content: "";
  position: absolute;
  bottom: -8px;
  left: calc(50% - 8px);
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 8px solid transparent;
  border-left: 8px solid transparent;
  border-top: 8px solid var(--col-orange-light);
  border-bottom: 0;
}
.modal_map .enjoy_wrap .enjoy hgroup h4 {
  font-size: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  letter-spacing: 0.04em;
}
.modal_map .enjoy_wrap .enjoy hgroup h4 .main {
  width: 100%;
}
.modal_map .enjoy_wrap .enjoy hgroup h4 .sub {
  font-size: 15px;
  line-height: 1.5;
}
.modal_map .enjoy_wrap .enjoy .enjoy_img {
  border-radius: 4px;
  overflow: hidden;
}
.modal_map .enjoy_wrap .enjoy .enjoy_detail_wrap {
  display: grid;
  gap: 8px;
}
.modal_map .enjoy_wrap .enjoy .enjoy_detail_wrap .enjoy_lead {
  line-height: 1.8666666667;
  text-align: left;
}
.modal_map .enjoy_wrap .enjoy .enjoy_detail_wrap .enjoy_lead .kome {
  font-size: 12px;
}
.modal_map .enjoy_wrap .enjoy .enjoy_detail_wrap > dl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 4px 8px;
  line-height: 1.8666666667;
}
.modal_map .enjoy_wrap .enjoy .enjoy_detail_wrap > dl dt {
  width: 76px;
  border: solid 1px var(--col-brown-deep);
  border-top: none;
  border-bottom: none;
  font-weight: bold;
  display: grid;
  place-items: center;
}
.modal_map .enjoy_wrap .enjoy .enjoy_detail_wrap > dl dd {
  width: calc(100% - 76px - 8px);
  text-align: left;
}
.modal_map .enjoy_wrap .enjoy .enjoy_btn_wrap {
  display: grid;
  gap: 8px;
}
.modal_map .enjoy_wrap .enjoy .enjoy_btn {
  width: 100%;
  height: 44px;
  border-radius: calc(infinity * 1px);
  display: grid;
  place-items: center;
  color: var(--col-brown-deep);
  border: solid 1px var(--col-brown-deep);
  background: transparent;
  -webkit-transition: background 0.2s ease-in, border-color 0.2s ease-in, color 0.2s ease-in;
  transition: background 0.2s ease-in, border-color 0.2s ease-in, color 0.2s ease-in;
}
@media (hover: hover) {
  .modal_map .enjoy_wrap .enjoy .enjoy_btn:hover {
    opacity: 1;
    color: #fff;
    border-color: #fff;
    background: var(--col-brown-deep);
  }
}

/*／ 紹介スポットモーダル*/
.animation.common_fadeup {
  opacity: 0;
}
.animation.common_fadeup.active {
  -webkit-animation-name: common_fadeup;
          animation-name: common_fadeup;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 0.5s;
          animation-duration: 0.5s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
}
@-webkit-keyframes common_fadeup {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes common_fadeup {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

@media screen and (min-width: 769px) {
  body {
    min-width: 768px;
    background: var(--col-bg-beige) url(../_img/bg_pattern@2x.png) center bottom no-repeat;
    background-size: 3000px 158px;
    background-attachment: fixed;
  }
  body::after {
    display: none;
  }
  footer .s-paegtop {
    z-index: 1000;
  }
  footer .s-footer .inner {
    max-width: 1080px !important;
    width: 100% !important;
  }
  footer .s-footer-links .inner {
    max-width: 1080px !important;
    width: 100% !important;
  }
  .section {
    padding: 120px 16px;
  }
  /*共通ロゴ*/
  header.l-header-wrap div {
    width: 100%;
    max-width: 1080px;
    margin: 16px auto;
  }
  header.l-header-wrap div img {
    margin-left: 12px;
    max-width: 60px;
  }
  /*／共通ロゴ*/
  /*下部バナーエリア*/
  #banner-sec {
    padding-block: 0 80px;
  }
  #banner-sec .wrap {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 0 8px;
  }
  #banner-sec .wrap a {
    max-width: 245px;
  }
  /*MV*/
  #mainvisual {
    padding: 0;
  }
  #mainvisual .content_wrap {
    max-width: none;
    aspect-ratio: unset;
    padding-top: 54px;
  }
  /*／MV*/
  /*固定ナビ*/
  /*／固定ナビ*/
  /* 謎解きサイトbtn */
  /* 共通 */
  /* ／共通 */
  /* top lead */
  /* ／ top lead */
  /* TOP */
  /*／TOP*/
  /*ストーリー*/
  /* MAP */
  /* ／ MAP */
  /* 遊び方 */
  /* ／ 遊び方 */
  /*豪華賞品*/
  /*／ 豪華賞品*/
  /* 開催要項 */
  /* ／ 開催要項 */
  /* おすすめ情報 */
  /* ／ おすすめ情報 */
  /*ZOOMモーダル*/
  /*／ ZOOMモーダル*/
  /* モーダル新幹線 */
  /* ／ モーダル新幹線 */
  /*紹介スポットモーダル*/
  /*／ 紹介スポットモーダル*/
  /* ／pc end */
}
@media screen and (min-width: 769px) and (min-width: 982px) {
  #mainvisual .content_wrap {
    aspect-ratio: 1400/896;
  }
}
@media screen and (min-width: 769px) {
  #mainvisual .content_wrap .series_title {
    width: 332px;
    margin-left: -10px;
    top: 16px;
  }
  #mainvisual .content_wrap .visual_wrap {
    position: relative;
    padding-top: 0;
    margin: auto;
    aspect-ratio: 982/721;
    width: 100%;
    z-index: 2;
  }
}
@media screen and (min-width: 769px) and (min-width: 982px) {
  #mainvisual .content_wrap .visual_wrap {
    width: auto;
    height: 721px;
  }
}
@media screen and (min-width: 769px) and (min-width: 1400px) {
  #mainvisual .content_wrap .visual_wrap {
    width: 70.1428571429%;
  }
}
@media screen and (min-width: 769px) {
  #mainvisual .content_wrap .visual_wrap .main_set {
    aspect-ratio: 982/721;
    --maxW: 982;
    --maxH: 721;
  }
  #mainvisual .content_wrap .visual_wrap .main_set .horse_set {
    --partsW: 344;
    --partsX: 287;
    --partsY: 365;
  }
  #mainvisual .content_wrap .visual_wrap .main_set .title_set {
    --partsW: 482;
    --partsX: 241;
    --partsY: 46;
  }
  #mainvisual .content_wrap .visual_wrap .main_set .deco_set {
    --partsW: 482;
    --partsX: 241;
    --partsY: 46;
  }
  #mainvisual .content_wrap .visual_wrap .bg_set {
    aspect-ratio: 982/721;
    --maxW: 982;
    --maxH: 721;
  }
  #mainvisual .content_wrap .visual_wrap .bg_set .bg {
    --maxW: 982;
    --maxH: 721;
  }
  #mainvisual .content_wrap .visual_wrap .bg_set .bg.copy_right {
    --partsW: 50;
    --partsX: 47;
    --partsY: 170;
  }
  #mainvisual .content_wrap .visual_wrap .bg_set .bg.copy_left {
    --partsW: 49;
    --partsX: 886;
    --partsY: 170;
  }
  #mainvisual .content_wrap .visual_wrap .bg_set .bg.bg_pattern {
    --partsW: 982;
    --partsX: 0;
    --partsY: 0;
  }
  #mainvisual .content_wrap .texture {
    -webkit-mask-image: url(../_img/mv_mask.svg);
            mask-image: url(../_img/mv_mask.svg);
    -webkit-mask-size: max(1400px, 100%) auto;
            mask-size: max(1400px, 100%) auto;
  }
  #mainvisual .content_wrap .texture img {
    -o-object-fit: cover;
       object-fit: cover;
    height: 100%;
  }
  #mainvisual .content_wrap .rope {
    position: relative;
    margin-top: 16px;
    min-height: 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    z-index: 1;
  }
}
@media screen and (min-width: 769px) and (min-width: 1400px) {
  #mainvisual .content_wrap .rope {
    margin-top: 0;
    position: absolute;
  }
}
@media screen and (min-width: 769px) {
  #mainvisual .content_wrap .rope img {
    min-width: 1400px;
  }
  #mainvisual + .cloud_wrap {
    margin-top: -64px;
    margin-bottom: 64px;
  }
  #mainvisual + .cloud_wrap .left {
    width: 306px;
    margin-left: -15px;
  }
  #mainvisual + .cloud_wrap .right {
    width: 294px;
    margin-right: -14px;
  }
  body:has(#nav-sec nav input:checked) {
    overflow: auto;
  }
  #nav-sec {
    position: -webkit-sticky;
    position: sticky;
    top: 8px;
  }
  #nav-sec nav input,
  #nav-sec nav label {
    display: none;
  }
  #nav-sec nav input + label + .menu {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
    background-color: transparent;
    width: 148px;
    height: calc(100vh - 8px);
    padding: 0;
    margin: 0 0 0 auto;
    pointer-events: none;
  }
  #nav-sec nav .menu ul {
    gap: 2px;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
  }
  #nav-sec nav .menu ul li {
    width: 100%;
  }
  #nav-sec nav .menu ul li a {
    pointer-events: all;
    font-size: 16px;
    color: #fff;
    background: var(--col-brown);
    left: 0;
    -webkit-transition: background 0.2s ease-in, color 0.2s ease-in, left 0.35s ease-in-out, width 0.35s ease-in-out;
    transition: background 0.2s ease-in, color 0.2s ease-in, left 0.35s ease-in-out, width 0.35s ease-in-out;
    -webkit-mask-image: url(../_img/nav_mask_left.svg), url(../_img/nav_mask_center.svg);
            mask-image: url(../_img/nav_mask_left.svg), url(../_img/nav_mask_center.svg);
    -webkit-mask-position: left center, 18px center;
            mask-position: left center, 18px center;
    -webkit-mask-size: 18px 54px, calc(100% - 18px) 54px;
            mask-size: 18px 54px, calc(100% - 18px) 54px;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
  }
  #nav-sec nav .menu ul li a::after {
    right: 8px;
  }
  #nav-sec nav .menu ul li a:hover {
    opacity: 1;
    background: var(--col-brown);
    width: calc(100% + 20px);
    left: -20px;
  }
  #nav-sec nav .menu ul li a:hover::after {
    background: var(--col-brown-light);
  }
  #nav-sec nav .menu ul li a.current {
    color: var(--col-brown-deep);
    background: var(--col-brown-yellow);
  }
  #nav-sec nav .menu ul li a.current::after {
    background: var(--col-brown-deep);
  }
  #nav-sec nav .game_link_wrap {
    width: 346px;
    position: fixed;
    background-color: #fff;
    border-radius: 12px 0 0 12px;
    right: 0;
    bottom: 64px;
    z-index: 10;
    margin: 0;
    padding: 16px;
  }
  #nav-sec nav .game_link_wrap .game_link {
    pointer-events: all;
  }
  #nav-sec nav .game_link_wrap .game_link::before {
    content: "";
    position: absolute;
    inset: 0;
    display: block;
    background: var(--grd-btn);
    border-radius: 12px 0 0 12px;
    z-index: 1;
    -webkit-transition: opacity 0.2s ease-in;
    transition: opacity 0.2s ease-in;
  }
  #nav-sec nav .game_link_wrap .game_link:hover {
    opacity: 1;
  }
  #nav-sec nav .game_link_wrap .game_link:hover::before {
    opacity: 0;
  }
  #nav-sec nav .game_link_wrap .game_link:hover .for_pc p {
    background: var(--grd-main);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  #nav-sec nav .game_link_wrap .game_link:hover .for_pc .horse {
    -webkit-transform: rotate(-10deg);
            transform: rotate(-10deg);
  }
  #nav-sec nav .game_link_wrap .text_wrap,
  #nav-sec nav .game_link_wrap .bg_img {
    display: none;
  }
  #nav-sec nav .game_link_wrap .for_pc {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 12px;
    width: 346px;
    z-index: 1;
  }
  #nav-sec nav .game_link_wrap .for_pc .line {
    width: 51px;
  }
  #nav-sec nav .game_link_wrap .for_pc p {
    font-size: 24px;
    line-height: 1.1666666667;
    color: #fff;
  }
  #nav-sec nav .game_link_wrap .for_pc p .mini {
    font-size: 20px;
  }
  #nav-sec nav .game_link_wrap .for_pc p .ls02 {
    letter-spacing: -0.02em;
  }
  #nav-sec nav .game_link_wrap .for_pc p .ls07 {
    letter-spacing: -0.07em;
  }
  #nav-sec nav .game_link_wrap .for_pc p .ls12 {
    letter-spacing: -0.12em;
  }
  #nav-sec nav .game_link_wrap .for_pc p .ls13 {
    letter-spacing: -0.13em;
  }
  #nav-sec nav .game_link_wrap .for_pc p .ls16 {
    letter-spacing: -0.16em;
  }
  #nav-sec nav .game_link_wrap .for_pc p .ls18 {
    letter-spacing: -0.18em;
  }
  #nav-sec nav .game_link_wrap .for_pc p .ls22 {
    letter-spacing: -0.22em;
  }
  #nav-sec nav .game_link_wrap .for_pc .horse {
    position: absolute;
    right: 9px;
    bottom: 0px;
    width: 114px;
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.68, -0.6, 0.32, 1.6);
    transition: -webkit-transform 0.5s cubic-bezier(0.68, -0.6, 0.32, 1.6);
    transition: transform 0.5s cubic-bezier(0.68, -0.6, 0.32, 1.6);
    transition: transform 0.5s cubic-bezier(0.68, -0.6, 0.32, 1.6), -webkit-transform 0.5s cubic-bezier(0.68, -0.6, 0.32, 1.6);
  }
  #nav-sec nav .deco {
    display: none;
  }
  body.comingsoon #nav-sec nav .game_link_wrap {
    display: none;
  }
  .game_link_wrap {
    margin: 200px auto 200px;
  }
  .game_link_wrap a.game_link {
    max-width: 804px;
    margin-inline: auto;
  }
  .game_link_wrap a.game_link .text_wrap {
    width: 100%;
    padding: 27px 8px 0;
    gap: 16px;
  }
  .game_link_wrap a.game_link .text_wrap .title {
    width: 467px;
  }
  .game_link_wrap a.game_link .text_wrap .notes {
    font-size: 15px;
    line-height: 1.6;
  }
  .game_link_wrap a.game_link .bg_img {
    border-radius: 12px;
    border: solid 4px var(--col-brown-deep);
    max-height: none;
  }
  .game_link_wrap a.game_link .bg_img img {
    margin: -2px;
  }
  .game_link_wrap > .notes {
    max-width: none;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
    text-align: center;
    font-size: 15px;
    line-height: 1.6;
    margin-top: 22px;
  }
  body.comingsoon .game_link_wrap a.game_link {
    pointer-events: none;
  }
  body.comingsoon .game_link_wrap a.game_link .text_wrap::before {
    font-size: 48px;
  }
  .common_joint {
    min-height: 96px;
  }
  .common_joint:before {
    min-width: 1400px;
    background: url(../_img/common_joint_top.svg) center center no-repeat;
    background-size: 100% auto;
    aspect-ratio: 1400/96;
  }
  .common_joint.bottom:before {
    background: url(../_img/common_joint_bottom.svg) center center no-repeat;
    background-size: 100% auto;
  }
  .common_title_wrap {
    gap: 146px;
  }
  .common_title_wrap .common_title {
    width: 70px;
  }
  .common_title_wrap .common_right_content {
    width: calc(100% - 216px);
  }
  a.btn_simple {
    font-size: 15px;
    line-height: 1.6;
    min-height: 40px;
    padding: 8px 40px 8px 24px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }
  a.btn_simple::after {
    right: 24px;
  }
  a.btn_simple:hover {
    opacity: 1;
    background: var(--col-brown-deep);
    border-color: #fff;
    color: #fff;
  }
  a.btn_simple:hover::after {
    background: #fff;
  }
  #top_lead {
    padding: 200px 0 260px;
  }
  #top_lead .deco {
    margin-bottom: 56px;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 365px;
  }
  #top_lead .deco img {
    width: 37px;
  }
  #top_lead .text_wrap {
    width: 600px;
    margin: auto;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 24px 0;
    font-size: 24px;
  }
  #top_lead .text_wrap p .mini {
    font-size: 18px;
  }
  @-webkit-keyframes Dshadow {
    0% {
      -webkit-filter: drop-shadow(0 0 1px #efc74f);
              filter: drop-shadow(0 0 1px #efc74f);
    }
    100% {
      -webkit-filter: drop-shadow(0 0 20px #efc74f);
              filter: drop-shadow(0 0 20px #efc74f);
    }
  }
  @keyframes Dshadow {
    0% {
      -webkit-filter: drop-shadow(0 0 1px #efc74f);
              filter: drop-shadow(0 0 1px #efc74f);
    }
    100% {
      -webkit-filter: drop-shadow(0 0 20px #efc74f);
              filter: drop-shadow(0 0 20px #efc74f);
    }
  }
  #top_lead .text_wrap.animation.active {
    --transY: 15;
  }
  #top {
    padding-block: 0;
  }
  #top .content_wrap .cloud_wrap {
    margin: auto;
    width: 100%;
    max-width: 989px;
    height: 467px;
    position: relative;
  }
  #top .content_wrap .dates,
  #top .content_wrap .place,
  #top .content_wrap .sp_event {
    -webkit-filter: drop-shadow(8px 8px 0 #e1cab8);
            filter: drop-shadow(8px 8px 0 #e1cab8);
  }
  #top .content_wrap .dates dl,
  #top .content_wrap .place dl,
  #top .content_wrap .sp_event dl {
    gap: 12px;
  }
  #top .content_wrap .dates dl dt,
  #top .content_wrap .place dl dt,
  #top .content_wrap .sp_event dl dt {
    font-size: 26px;
    line-height: 1.3076923077;
  }
  #top .content_wrap .dates dl dd,
  #top .content_wrap .place dl dd,
  #top .content_wrap .sp_event dl dd {
    font-size: 20px;
  }
  #top .content_wrap .dates dl dd > em,
  #top .content_wrap .place dl dd > em,
  #top .content_wrap .sp_event dl dd > em {
    font-size: 30px;
    font-style: normal;
  }
  #top .content_wrap .dates {
    width: 507px;
    height: 321px;
  }
  #top .content_wrap .dates dl {
    top: 96px;
    left: 111px;
  }
  #top .content_wrap .place {
    top: 135px;
    width: 528px;
    height: 308px;
    z-index: 5;
  }
  #top .content_wrap .place dl {
    top: 86px;
    left: 170px;
  }
  #top .content_wrap .place dl dd {
    gap: 4px;
  }
  #top .content_wrap .sp_event {
    left: 200px;
    width: 299px;
    height: 183px;
  }
  #top .content_wrap .sp_event p {
    top: 61px;
    left: 58px;
    font-size: 20px;
  }
  #top .content_wrap .sp_event p em {
    font-size: 26px;
    font-style: normal;
  }
  #top .cloud_wrap li.dates.animation {
    --translateY2: 0.04;
  }
  #top .cloud_wrap li.dates.animation.active {
    -webkit-animation-duration: 1.2s, 0.3s, 1.8s;
            animation-duration: 1.2s, 0.3s, 1.8s;
  }
  #top .cloud_wrap li.place.animation {
    --translateY2: -0.04;
  }
  #top .cloud_wrap li.place.animation.active {
    -webkit-animation-duration: 1.2s, 0.3s, 1.8s;
            animation-duration: 1.2s, 0.3s, 1.8s;
  }
  #top .cloud_wrap li.sp_event.animation {
    --translateY2: 0.08;
  }
  #top .cloud_wrap li.sp_event.animation.active {
    -webkit-animation-duration: 1.5s, 0.3s, 2.1s;
            animation-duration: 1.5s, 0.3s, 2.1s;
  }
  #story {
    padding-block: 100px;
  }
  #story .content_wrap {
    position: relative;
  }
  #story .story_conversation {
    padding-bottom: 150px;
  }
}
@media screen and (min-width: 769px) and (min-width: 920px) {
  #story .story_conversation {
    padding-bottom: 0;
  }
}
@media screen and (min-width: 769px) {
  #story .story_conversation .story_lead {
    font-size: 24px;
    line-height: 2;
    margin: 0 auto 40px;
  }
  #story .story_conversation ul {
    gap: 32px;
    font-size: 16px;
    line-height: 1.5;
  }
  #story .story_conversation ul li.talk_wrap {
    margin-left: 86px;
    padding: 10px 20px;
    border-radius: 12px;
  }
  #story .story_conversation ul li.talk_wrap::before {
    top: calc(50% - 30px);
    left: -78px;
    width: 60px;
    height: 60px;
    background-size: 60px auto;
  }
  #story .story_conversation ul li.writing {
    margin-left: 76px;
    padding: 8px 0;
  }
  #story .story_conversation ul li.writing.last {
    margin-left: 0;
    font-size: 24px;
    line-height: 2;
  }
  #story .fire_btn {
    bottom: -19px;
    right: 0;
    width: 158px;
    height: 235px;
    font-size: 24px;
    line-height: 1.2;
    gap: 0;
    padding: 0px 15px 28px;
    -webkit-filter: drop-shadow(8px 8px 0 var(--col-orange-deep));
            filter: drop-shadow(8px 8px 0 var(--col-orange-deep));
  }
  #story .fire_btn .mini {
    display: inline-block;
    font-size: 15px;
  }
  #story .fire_btn::after {
    width: 85px;
    height: 12px;
    margin-top: 12px;
  }
  #story .fire_btn.scroll_to_top_btn .mini {
    display: inline-block;
  }
  #story .scroll_to_top_btn {
    -webkit-filter: opacity(0) drop-shadow(8px 8px 0 var(--col-orange-deep));
            filter: opacity(0) drop-shadow(8px 8px 0 var(--col-orange-deep)); /* ← ここ重要 */
  }
  #story .scroll_to_top_btn.is-active {
    -webkit-filter: opacity(1) drop-shadow(8px 8px 0 var(--col-orange-deep));
            filter: opacity(1) drop-shadow(8px 8px 0 var(--col-orange-deep));
  }
  #story .horse_illust {
    bottom: -115px;
    left: -160px;
    width: 307px;
  }
  #story:has(.is-active) .horse_illust {
    -webkit-animation-name: horse_illust_rotate;
            animation-name: horse_illust_rotate;
    -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
    -webkit-animation-duration: 1.4s;
            animation-duration: 1.4s;
    -webkit-animation-iteration-count: 1;
            animation-iteration-count: 1;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
    -webkit-animation-delay: 0.1s;
            animation-delay: 0.1s;
    -webkit-animation-direction: normal;
            animation-direction: normal;
  }
  @-webkit-keyframes horse_illust_rotate {
    0% {
      rotate: 15deg;
    }
    40% {
      rotate: -10deg;
    }
    60% {
      rotate: 0deg;
    }
    80% {
      rotate: -10deg;
    }
    100% {
      rotate: 15deg;
    }
  }
  @keyframes horse_illust_rotate {
    0% {
      rotate: 15deg;
    }
    40% {
      rotate: -10deg;
    }
    60% {
      rotate: 0deg;
    }
    80% {
      rotate: -10deg;
    }
    100% {
      rotate: 15deg;
    }
  }
  #map {
    padding-block: 110px 220px;
  }
  #map .map_wrap .map_img img {
    border-radius: 12px;
    border: solid 3px var(--col-beige-deep);
    margin: -3px;
  }
  #map .map_list {
    display: none;
  }
  #map #route {
    max-width: 1080px;
    margin: auto;
    gap: 8px 54px;
    grid-template-columns: 80px auto;
  }
  #map #route h4 {
    gap: 4px;
  }
  #map #route h4 img {
    width: 50px;
  }
  #map #route h4 .sub {
    font-size: 16px;
  }
}
@media screen and (min-width: 769px) and (min-width: 1115px) {
  #map #route .modelroute {
    margin-right: 0;
  }
  #map #route .modelroute .scroll_icon {
    display: none;
  }
  #map #route .modelroute .route_wrap {
    padding-right: 0;
  }
}
@media screen and (min-width: 769px) {
  #map .annotation {
    margin: 0 auto;
  }
  #map .annotation li:nth-child(1) {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  #map .annotation li:nth-child(2) {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  #map .annotation li:nth-child(3) {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }
  #map #winter {
    padding: 32px 56px 56px;
    max-width: 1080px;
    margin: auto;
  }
  #map #winter .inner_wrap {
    gap: 12px;
  }
  #map #winter .inner_wrap hgroup.title {
    gap: 18px;
  }
  #map #winter .inner_wrap hgroup.title .balloon {
    font-size: 18px;
  }
  #map #winter .inner_wrap hgroup.title .main {
    font-size: 42px;
  }
  #map #winter .inner_wrap .lead {
    text-align: center;
  }
  #map #winter .inner_wrap .fig_wrap {
    gap: 16px;
  }
  #map #winter .inner_wrap .fig_wrap figure {
    border-radius: 4px;
    overflow: hidden;
  }
  #map #winter .inner_wrap .fig_wrap figure figcaption {
    bottom: 12px;
    right: 12px;
    font-size: 16px;
  }
  #map #winter .inner_wrap .fig_wrap .fig_title {
    font-size: 18px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 0 0.5em;
  }
  #map #winter .inner_wrap .fig_wrap .fig_title > span:first-child {
    width: 100%;
  }
  #map #winter .inner_wrap:nth-child(2) {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 40px;
  }
  #map #winter .inner_wrap:nth-child(2) .fig_wrap {
    width: 50%;
  }
  #map #winter .btn_wrap {
    gap: 24px;
  }
  #map #winter .btn {
    min-height: 60px;
    font-size: 20px;
  }
  #map #winter .btn > span::after {
    right: 24px;
  }
  #howto .content_wrap .common_right_content > ul {
    gap: 42px;
  }
  #howto .content_wrap .common_right_content > ul > li {
    padding: 40px 24px 40px 80px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
  }
  #howto .content_wrap .common_right_content > ul > li .num {
    position: absolute;
    top: calc(50% - 40px);
    left: -40px;
    width: 80px;
    font-size: 24px;
  }
  #howto .content_wrap .common_right_content > ul > li > img {
    width: 120px;
  }
  #howto .content_wrap .common_right_content > ul > li .text_wrap {
    gap: 14px;
  }
  #howto .content_wrap .common_right_content > ul > li .text_wrap h4 {
    font-size: 24px;
    line-height: 1.1666666667;
    text-align: left;
  }
  #howto .content_wrap .common_right_content > ul > li:not(:last-child)::after {
    bottom: -32px;
    left: calc(50% - 30px);
    display: block;
    width: 60px;
    height: 22px;
  }
  #howto .content_wrap a.btn_dl {
    margin-top: 2px;
  }
  #presents .content_wrap .common_right_content {
    gap: 32px;
    margin: 0 auto 120px;
  }
  #presents .content_wrap .wrap {
    margin: auto;
    padding: 56px 64px;
    border-radius: 12px;
  }
  #presents .content_wrap .wrap .title {
    font-size: 36px;
  }
  #presents .content_wrap .wrap .title_lead {
    font-size: 20px;
    line-height: 1.8;
  }
  #presents .content_wrap #kyoto_prize {
    grid-template-columns: 344px 1fr;
    grid-template-rows: auto auto;
  }
  #presents .content_wrap #kyoto_prize .text_wrap {
    grid-column: 1/2;
    grid-row: 1/2;
  }
  #presents .content_wrap #kyoto_prize .prize_img {
    grid-column: 2/3;
    grid-row: 1/2;
  }
  #presents .content_wrap #kyoto_prize .exchange_wrap {
    grid-column: 1/3;
    grid-row: 2/3;
    margin-top: 0;
    padding: 24px;
    gap: 32px;
  }
  #presents .content_wrap #kyoto_prize .exchange_wrap .exchange_title {
    font-size: 24px;
  }
}
@media screen and (min-width: 769px) and (min-width: 1000px) {
  #presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }
  #presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl.exchange_detail {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 2px 0;
    width: calc(100% - 262px - 16px);
  }
  #presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl.exchange_detail dt {
    width: 33.1707317073%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 0;
  }
  #presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl.exchange_detail dd {
    margin-top: 0;
    width: 66.8292682927%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  #presents .content_wrap #kyoto_prize .exchange_wrap .exchange_inner_wrap dl.exchange_img {
    width: 262px;
  }
}
@media screen and (min-width: 769px) and (max-width: 920px) {
  #presents .content_wrap #kyoto_prize {
    grid-template-columns: auto;
    grid-template-rows: auto auto auto;
  }
  #presents .content_wrap #kyoto_prize .text_wrap {
    grid-column: 1/2;
    grid-row: 1/2;
  }
  #presents .content_wrap #kyoto_prize .prize_img {
    grid-column: 1/2;
    grid-row: 2/3;
  }
  #presents .content_wrap #kyoto_prize .exchange_wrap {
    grid-column: 1/2;
    grid-row: 3/4;
  }
}
@media screen and (min-width: 769px) {
  #presents .content_wrap #shinkansen_prize {
    grid-template-columns: 344px 1fr;
    grid-template-rows: auto auto;
  }
  #presents .content_wrap #shinkansen_prize .text_wrap {
    grid-column: 1/2;
    grid-row: 1/2;
  }
  #presents .content_wrap #shinkansen_prize .text_wrap .title_lead {
    margin-right: -40px;
    letter-spacing: -0.02em;
  }
  #presents .content_wrap #shinkansen_prize .text_wrap .title_lead .ls07 {
    letter-spacing: -0.07em;
  }
  #presents .content_wrap #shinkansen_prize .prize_img {
    grid-column: 2/3;
    grid-row: 1/2;
  }
  #presents .content_wrap #shinkansen_prize .list {
    grid-column: 1/3;
    grid-row: 2/3;
    margin-top: 0;
  }
}
@media screen and (min-width: 769px) and (max-width: 920px) {
  #presents .content_wrap #shinkansen_prize {
    grid-template-columns: auto;
    grid-template-rows: auto auto auto;
  }
  #presents .content_wrap #shinkansen_prize .text_wrap {
    grid-column: 1/2;
    grid-row: 1/2;
  }
  #presents .content_wrap #shinkansen_prize .prize_img {
    grid-column: 1/2;
    grid-row: 2/3;
  }
  #presents .content_wrap #shinkansen_prize .list {
    grid-column: 1/2;
    grid-row: 3/4;
  }
}
@media screen and (min-width: 769px) {
  #presents .content_wrap #common_prize {
    padding-bottom: 40px;
    display: grid;
    gap: 32px;
    --gap: 32;
  }
  #presents .content_wrap #common_prize .common_top_wrap hgroup .title_sub {
    font-size: 28px;
  }
  #presents .content_wrap #common_prize .common_bnr_wrap {
    grid-template-columns: 1fr 1fr;
  }
  #presents .content_wrap #common_prize .common_middle_wrap {
    grid-template-columns: 344px 1fr;
    grid-template-rows: auto auto;
    gap: 8px 24px;
    --gap: 24;
  }
  #presents .content_wrap #common_prize .common_middle_wrap .title_lead {
    grid-column: 1/2;
    grid-row: 1/2;
  }
  #presents .content_wrap #common_prize .common_middle_wrap .list {
    margin-top: 0;
    grid-column: 1/2;
    grid-row: 2/3;
  }
  #presents .content_wrap #common_prize .common_middle_wrap .prize_img {
    grid-column: 2/3;
    grid-row: 1/3;
    overflow: hidden;
    border-radius: 4px;
  }
}
@media screen and (min-width: 769px) and (max-width: 920px) {
  #presents .content_wrap #common_prize .common_middle_wrap {
    grid-template-columns: auto;
    grid-template-rows: auto auto auto;
    gap: 24px;
    --gap: 24;
  }
  #presents .content_wrap #common_prize .common_middle_wrap .title_lead {
    grid-column: 1/2;
    grid-row: 1/2;
  }
  #presents .content_wrap #common_prize .common_middle_wrap .list {
    grid-column: 1/2;
    grid-row: 2/3;
    margin-top: calc((var(--gap) - 8) * -1px);
  }
  #presents .content_wrap #common_prize .common_middle_wrap .prize_img {
    grid-column: 1/2;
    grid-row: 3/4;
  }
}
@media screen and (min-width: 769px) {
  #presents .content_wrap #common_prize .common_bottom_wrap {
    display: grid;
    gap: 8px;
  }
  #presents .content_wrap #common_prize .common_bottom_wrap h5 {
    font-size: 18px;
    line-height: 1.8;
  }
  #presents .content_wrap #common_prize .common_bottom_wrap ul li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  #presents .content_wrap #common_prize .common_bottom_wrap ul li span {
    display: block;
  }
  #presents .content_wrap #common_prize .common_bottom_wrap ul li p {
    width: calc(100% - 34px - 8px);
  }
  #presents .content_wrap #common_prize .horse {
    width: 343px;
    top: -77px;
    right: -144px;
  }
  #presents .content_wrap #fujisan {
    margin-top: -32px;
    padding: 24px 62px 32px;
    gap: 24px;
  }
  #presents .content_wrap #fujisan .title {
    font-size: 32px;
    line-height: 1.8;
    margin-bottom: -16px;
  }
  #presents .content_wrap #fujisan .detail {
    display: grid;
    grid-template-columns: 76px 1fr;
    grid-template-rows: auto auto;
    gap: 8px;
  }
  #presents .content_wrap #fujisan .detail dt {
    border-top: none;
    border-bottom: none;
    border-left: solid 1px #fff;
    border-right: solid 1px #fff;
    padding: 0;
    display: grid;
    place-items: center;
  }
  #presents .content_wrap #fujisan .detail dd:nth-of-type(1) {
    margin-bottom: 0;
  }
  #presents .content_wrap #fujisan a.btn_simple.btn_blue {
    width: 184px;
    margin: auto;
    padding-inline: 24px 0;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
  #presents .content_wrap #fujisan a.btn_simple.btn_blue::after {
    right: 12.5px;
  }
  #presents .content_wrap #fujisan .horse {
    width: 299px;
    top: -96.5px;
    left: -247.5px;
  }
  #details .content_wrap .wrap {
    gap: 35px;
  }
  #details .content_wrap .wrap h3 {
    font-size: 28px;
    gap: 12px;
    margin-bottom: -19px;
  }
  #details .content_wrap .wrap h3::before {
    width: 44px;
    height: 30px;
  }
  #details .content_wrap .wrap ul,
  #details .content_wrap .wrap dl {
    border-radius: 16px;
  }
  #details .content_wrap .wrap ul {
    padding: 32px;
  }
  #details .content_wrap .wrap dl {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    gap: 1px 0;
  }
  #details .content_wrap .wrap dl dt {
    width: 140px;
    margin-bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  #details .content_wrap .wrap dl dt:first-child {
    border-radius: 16px 0 0 0;
  }
  #details .content_wrap .wrap dl dt:nth-child(7) {
    border-radius: 0 0 0 16px;
  }
  #details .content_wrap .wrap dl dd {
    padding: 16px 16px;
    margin-top: 0;
    width: calc(100% - 140px);
  }
  #details .content_wrap .wrap dl dd:nth-child(2) {
    border-radius: 0 16px 0 0;
  }
  #details .content_wrap .wrap dl dd:last-child {
    border-radius: 0 0 16px 0;
  }
  #details .content_wrap .sponsored {
    margin-top: 35px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 16px;
  }
  #recommend .content_wrap h3 {
    width: 356px;
  }
  #recommend .content_wrap .bnr_wrap {
    gap: 32px;
  }
  #recommend .content_wrap .notes {
    max-width: 1016px;
    font-size: 15px;
    margin: 48px auto 0;
  }
  .modal_zoom .content_wrap {
    padding: 40px;
  }
  .modal_zoom .content_wrap h3 {
    font-size: 26px;
  }
  #shinkansen-nazo .content_wrap {
    padding: 40px;
  }
  .modal_map {
    max-width: 840px;
    padding: 37px;
    margin: auto;
    /* 楽しもうコンテンツ */
  }
  .modal_map > .close_btn {
    top: 9px;
    right: 9px;
  }
  .modal_map .header {
    margin-bottom: 24px;
    gap: 16px;
  }
  .modal_map .header .figure_wrap figure.main_img {
    border-radius: 16px;
  }
  .modal_map .header h3 {
    font-size: 32px;
    line-height: 1.5;
  }
  .modal_map .know {
    text-align: left;
    margin-bottom: 40px;
  }
  .modal_map .know h4,
  .modal_map .know h5 {
    font-size: 20px;
    margin-bottom: 8px;
    padding: 0 0 4px 32px;
    background: url(../_img/modal_map_icon_know.svg) top 1px left no-repeat;
    background-size: 24px auto;
  }
  .modal_map .know h6 {
    margin-top: 8px;
  }
  .modal_map .btn {
    max-width: 300px;
    min-height: 60px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }
  .modal_map .enjoy_wrap {
    margin-bottom: 40px;
  }
  .modal_map .enjoy_wrap .enjoy {
    padding: 32px;
    display: grid;
    grid-template-columns: 280px 1fr;
    grid-template-rows: auto auto auto;
    gap: 24px;
  }
  .modal_map .enjoy_wrap .enjoy hgroup {
    grid-column: 1/3;
    grid-row: 1/2;
  }
  .modal_map .enjoy_wrap .enjoy hgroup .balloon {
    font-size: 13px;
    width: 219px;
    height: 32px;
  }
  .modal_map .enjoy_wrap .enjoy hgroup h4 {
    font-size: 22px;
    text-align: 1.5;
  }
  .modal_map .enjoy_wrap .enjoy hgroup h4 .sub {
    font-size: 18px;
    line-height: 1.5;
  }
  .modal_map .enjoy_wrap .enjoy .enjoy_img {
    grid-column: 1/2;
    grid-row: 2/3;
  }
  .modal_map .enjoy_wrap .enjoy .enjoy_detail_wrap {
    grid-column: 2/3;
    grid-row: 2/3;
  }
  .modal_map .enjoy_wrap .enjoy .enjoy_btn_wrap {
    grid-column: 1/3;
    grid-row: 3/4;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 16px;
  }
  .modal_map .enjoy_wrap .enjoy .enjoy_btn {
    max-width: 200px;
  }
  .remodal.section .content_wrap .btn {
    max-width: 200px;
  }
}/*# sourceMappingURL=style.css.map */