@charset "UTF-8";
.popup .panel .inner {
  scrollbar-width: none;
}
.popup .panel .inner::-webkit-scrollbar {
  display: none;
}

.main .mainVisual {
  position: relative;
}
.main .mainVisual .pager {
  display: flex;
  justify-content: center;
  gap: min(10px, 100cqw * 10 / 1400);
  width: 100%;
  padding: 0 0 min(40px, 100cqw * 40 / 1400);
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
}
@media screen and (max-width: 750px) {
  .main .mainVisual .pager {
    justify-content: flex-start;
    gap: 2.6666666667vw;
    padding: 0 5.3333333333vw 5.3333333333vw;
  }
}
.main .mainVisual .pager .swiper-pagination-bullet {
  width: min(24px, 100cqw * 24 / 1400);
  height: min(10px, 100cqw * 10 / 1400);
  margin: 0;
  background: #fff;
  border-radius: min(5px, 100cqw * 5 / 1400);
  opacity: 1;
}
@media screen and (max-width: 750px) {
  .main .mainVisual .pager .swiper-pagination-bullet {
    width: 6.4vw;
    height: 2.6666666667vw;
    border-radius: 1.3333333333vw;
  }
}
.main .mainVisual .pager .swiper-pagination-bullet-active {
  background: #FAEE00;
}
.main .topic {
  border-top: min(4px, 100cqw * 4 / 1400) solid currentColor;
  border-bottom: min(4px, 100cqw * 4 / 1400) solid currentColor;
  padding: min(36px, 100cqw * 36 / 1400) 0;
  background: #fff;
}
@media screen and (max-width: 750px) {
  .main .topic {
    border-top-width: 1.0666666667vw;
    border-bottom-width: 1.0666666667vw;
    padding: 4.2666666667vw 0;
  }
}
.main .topic .wrap {
  display: grid;
  align-items: center;
  grid-template-columns: auto 1fr;
  gap: 0 min(80px, 100cqw * 80 / 1400);
}
@media screen and (max-width: 750px) {
  .main .topic .wrap {
    display: block;
  }
}
.main .topic .title {
  grid-row: 1/2;
  grid-column: 1/2;
  font-size: min(20px, 100cqw * 20 / 1400);
  font-weight: 900;
  line-height: 1.44;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 750px) {
  .main .topic .title {
    font-size: 4.2666666667vw;
    line-height: 1.24;
  }
}
.main .topic .topic-inner {
  grid-row: 1/2;
  grid-column: 2/3;
}
@media screen and (max-width: 750px) {
  .main .topic .lead {}
}
.main .topic .list {
  display: grid;
  align-items: center;
  grid-template-columns: auto 1fr;
  gap: 0 min(20px, 100cqw * 20 / 1400);
}
@media screen and (max-width: 750px) {
  .main .topic .list {
    grid-template-columns: 1fr;
    margin: 2.6666666667vw 0 0;
    gap: 0 2.6666666667vw;
  }
}
.topic-inner .list:nth-child(n+2) {
  margin-top: 12px;
}
.main .topic .list dt {
  /* grid-row: 1/2;
  grid-column: 1/2; */
  font-size: min(14px, 100cqw * 14 / 1400);
  font-weight: 500;
  line-height: 1.2142857143;
}
@media screen and (min-width: 751px) {
  .main .topic .list dt {
    grid-row: 1/2;
    grid-column: 1/2;
  }
}
@media screen and (max-width: 750px) {
  .main .topic .list dt {
    font-size: 3.7333333333vw;
  }
}
.main .topic .list dd {
  /* grid-row: 1/2;
  grid-column: 2/3; */
  font-size: min(16px, 100cqw * 16 / 1400);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.05em;
  /* overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; */
}
@media screen and (min-width: 751px) {
  .main .topic .list dd {
    grid-row: 1/2;
    grid-column: 2/3;
  }
}
@media screen and (max-width: 750px) {
  .main .topic .list dd {
    /* grid-row: 2/3; */
    font-size: 4.2666666667vw;
  }
}
.main .topic .list a {
  color: inherit;
}
.main .lead {
  background: linear-gradient(178deg, #FAC03D 16.09%, rgba(250, 192, 61, 0) 52.19%), linear-gradient(184deg, rgba(250, 192, 61, 0) 19.73%, #FAC03D 76.26%), #FFC341;
}
.main .lead .wrap {
  padding-top: min(80px, 100cqw * 80 / 1400);
  padding-bottom: min(116px, 100cqw * 116 / 1400);
  position: relative;
}
@media screen and (max-width: 750px) {
  .main .lead .wrap {
    padding-top: 10.6666666667vw;
    padding-bottom: 42.6666666667vw;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .main .lead .catch,
.main .lead .line {
    opacity: 0;
    -webkit-clip-path: inset(0 calc(100% - 1px) 0 0);
            clip-path: inset(0 calc(100% - 1px) 0 0);
    transition: -webkit-clip-path 1.6s cubic-bezier(0.22, 1, 0.36, 1);
    transition: clip-path 1.6s cubic-bezier(0.22, 1, 0.36, 1);
    transition: clip-path 1.6s cubic-bezier(0.22, 1, 0.36, 1), -webkit-clip-path 1.6s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .main .lead .catch.scrollIn,
.main .lead .line.scrollIn {
    opacity: 1;
    -webkit-clip-path: inset(0 0 0 0);
            clip-path: inset(0 0 0 0);
  }
}
.main .lead .catch {
  width: min(810px, 100cqw * 810 / 1400);
}
@media screen and (max-width: 750px) {
  .main .lead .catch {
    width: 74.2666666667vw;
  }
}
.main .lead .text {
  margin: min(80px, 100cqw * 80 / 1400) 0 0;
  font-size: min(36px, 100cqw * 36 / 1400);
  font-weight: 900;
  line-height: 1.8;
  letter-spacing: 0.05em;
  white-space: nowrap;
}
@media screen and (max-width: 750px) {
  .main .lead .text {
    margin: 8vw 0 0;
    font-size: 4.8vw;
  }
}
.main .lead .text .group {
  margin: min(40px, 100cqw * 40 / 1400) 0 0;
}
@media screen and (max-width: 750px) {
  .main .lead .text .group {
    margin: 5.3333333333vw 0 0;
  }
}
.main .lead .text .group--02 strong, .main .lead .text .group--03 strong {
  display: block;
  padding: min(10px, 100cqw * 10 / 1400);
  background: #fff;
  font-weight: inherit;
}
@media screen and (max-width: 750px) {
  .main .lead .text .group--02 strong, .main .lead .text .group--03 strong {
    padding: 0 1.3333333333vw;
  }
}
.main .lead .text .group--04 strong, .main .lead .text .group--06 strong {
  font-size: min(48px, 100cqw * 48 / 1400);
  font-weight: inherit;
}
@media screen and (max-width: 750px) {
  .main .lead .text .group--04 strong, .main .lead .text .group--06 strong {
    font-size: inherit;
  }
}
.main .lead .text .group--02 {
  line-height: 1.44;
}
.main .lead .text .group--02 .line--02 {
  display: flex;
  align-items: center;
  gap: min(20px, 100cqw * 20 / 1400);
  margin: min(8px, 100cqw * 8 / 1400) 0 0;
}
@media screen and (max-width: 750px) {
  .main .lead .text .group--02 .line--02 {
    gap: 1.3333333333vw;
    margin: 2.1333333333vw 0 0;
  }
}
.main .lead .text .group--03 .line--03 {
  display: flex;
  align-items: center;
  gap: min(20px, 100cqw * 20 / 1400);
  line-height: 1.44;
}
@media screen and (max-width: 750px) {
  .main .lead .text .group--03 .line--03 {
    gap: 1.3333333333vw;
    margin: 2.1333333333vw 0 0;
  }
}
.main .lead .text .group--06 {
  font-size: min(40px, 100cqw * 40 / 1400);
}
@media screen and (max-width: 750px) {
  .main .lead .text .group--06 {
    font-size: inherit;
  }
}
.main .lead .text .line {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.main .lead .blt {
  width: min(142px, 100cqw * 142 / 1400);
  position: absolute;
  right: min(90px, 100cqw * 90 / 1400);
  bottom: min(210px, 100cqw * 210 / 1400);
}
@media screen and (max-width: 750px) {
  .main .lead .blt {
    width: 11.2vw;
    right: 12.8vw;
    bottom: 18.6666666667vw;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .main .lead .blt {
    scale: 0;
    transform-origin: 50% 100%;
    transition: scale 1s cubic-bezier(0.34, 1.56, 0.64, 1);
  }
  .main .lead .blt.scrollIn {
    scale: 1;
  }
}
.main .movie {
  padding: min(120px, 100cqw * 120 / 1400) 0 min(64px, 100cqw * 64 / 1400);
  background: #fff;
  font-weight: 900;
  letter-spacing: 0.05em;
  line-height: 1.44;
  text-align: center;
}
@media screen and (max-width: 750px) {
  .main .movie {
    padding: 10.6666666667vw 0 13.3333333333vw;
    position: relative;
    z-index: 1;
  }
}
.main .movie .wrap {
  padding-bottom: min(57px, 100cqw * 57 / 1400);
  background-image: url(https://yonasato.com/cms/img/yonayona_beerise2606/top/img10_sp.jpg), url(https://yonasato.com/cms/img/yonayona_beerise2606/top/img11_sp.png);
  background-position: calc(50% + min(428px, 100cqw * 428 / 1400)) min(129px, 100cqw * 129 / 1400), calc(50% + max(-410px, 100cqw * -410 / 1400)) 100%;
  background-size: min(91px, 100cqw * 91 / 1400) auto, min(206px, 100cqw * 206 / 1400) auto;
  background-repeat: no-repeat;
}
@media screen and (max-width: 750px) {
  .main .movie .wrap {
    padding-bottom: 0;
    background-image: url(https://yonasato.com/cms/img/yonayona_beerise2606/top/img10_sp.jpg);
    background-position: calc(100% - 5.3333333333vw) 24vw;
    background-size: 12.2666666667vw auto;
    position: relative;
  }
  .main .movie .wrap::after {
    content: "";
    display: block;
    width: 24.2666666667vw;
    aspect-ratio: 183/215;
    position: absolute;
    bottom: -20.8vw;
    left: 4.5333333333vw;
    background: url(https://yonasato.com/cms/img/yonayona_beerise2606/top/img11_sp.png) center/contain no-repeat;
  }
}
.main .movie .title {
  font-size: min(48px, 100cqw * 48 / 1400);
  font-weight:bold;
}
@media screen and (max-width: 750px) {
  .main .movie .title {
    font-size: 8.5333333333vw;
  }
}
.main .movie .text {
  margin: min(20px, 100cqw * 20 / 1400) 0 0;
  font-size: min(24px, 100cqw * 24 / 1400);
  font-weight:bold;
}
@media screen and (max-width: 750px) {
  .main .movie .text {
    margin: 5.3333333333vw 0 0;
    font-size: 4.8vw;
  }
}
.main .movie .video {
  width: min(640px, 100cqw * 640 / 1400);
  margin: min(50px, 100cqw * 50 / 1400) auto 0;
  aspect-ratio: 16 / 9;
}
@media screen and (max-width: 750px) {
  .main .movie .video {
    width: auto;
    margin: 10.6666666667vw 0 0;
  }
}
.main .movie .video iframe {
  width: 100%;
  height: 100%;
  border-radius: 20px;
}
.main .facility .text,
.main .experience .text,
.main .tour .text {
  font-weight: 900;
  line-height: 1.44;
}
.main .facility .text .title,
.main .experience .text .title,
.main .tour .text .title {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 min(10px, 100cqw * 10 / 1400);
  background: #FFC341;
  font-size: min(24px, 100cqw * 24 / 1400);
  letter-spacing: 0.05em;
}
@media screen and (max-width: 750px) {
  .main .facility .text .title,
.main .experience .text .title,
.main .tour .text .title {
    padding: 0 2.6666666667vw;
    font-size: 5.3333333333vw;
  }
}
.main .facility .text .catch,
.main .facility .text p,
.main .experience .text .catch,
.main .experience .text p,
.main .tour .text .catch,
.main .tour .text p {
  margin: min(20px, 100cqw * 20 / 1400) 0 0;
  color: #FFF;
  text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
}
@media screen and (max-width: 750px) {
  .main .facility .text .catch,
.main .facility .text p,
.main .experience .text .catch,
.main .experience .text p,
.main .tour .text .catch,
.main .tour .text p {
    margin: 4vw 0 0;
  }
}
.main .facility .text .catch,
.main .experience .text .catch,
.main .tour .text .catch {
  font-size: min(40px, 100cqw * 40 / 1400);
}
@media screen and (max-width: 750px) {
  .main .facility .text .catch,
.main .experience .text .catch,
.main .tour .text .catch {
    font-size: 8.5333333333vw;
    white-space: nowrap;
  }
}
.main .facility .text p,
.main .experience .text p,
.main .tour .text p {
  font-size: min(18px, 100cqw * 18 / 1400);
  letter-spacing: 0.05em;
}
@media screen and (max-width: 750px) {
  .main .facility .text p,
.main .experience .text p,
.main .tour .text p {
    font-size: 4.8vw;
  }
}
.main .facility .bg,
.main .experience .bg {
  display: grid;
}
.main .facility .bg video,
.main .facility .bg picture,
.main .experience .bg video,
.main .experience .bg picture {
  grid-area: 1/1;
}
.main .facility .bg img,
.main .experience .bg img {
  height: min(700px, 100cqw * 700 / 1400);
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 750px) {
  .main .facility .bg img,
.main .experience .bg img {
    height: auto;
  }
}
.main .facility .bg video,
.main .experience .bg video {
  -o-object-fit: cover;
     object-fit: cover;
  display: none;
}
.main .facility .bg video.pc,
.main .experience .bg video.pc {
  height: min(700px, 100cqw * 700 / 1400);
}
.main .facility .bg video.sp,
.main .experience .bg video.sp {
  height: 177.8666666667vw;
}
@media screen and (min-width: 751px) {
  .main .facility .bg video:is(body.movieActive *).pc,
.main .experience .bg video:is(body.movieActive *).pc {
    display: block;
  }
}
@media screen and (max-width: 750px) {
  .main .facility .bg video:is(body.movieActive *).sp,
.main .experience .bg video:is(body.movieActive *).sp {
    display: block;
  }
}
.main .facility .bg video:is(body.movieActive *) ~ picture,
.main .experience .bg video:is(body.movieActive *) ~ picture {
  display: none;
}
.main .facility {
  display: grid;
  padding: min(5px, 100cqw * 5 / 1400) 0 0;
}
.main .facility .bg {
  grid-area: 1/1;
  display: grid;
}
.main .facility .bg video,
.main .facility .bg picture {
  grid-area: 1/1;
}
.main .facility .bg img {
  height: min(700px, 100cqw * 700 / 1400);
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 750px) {
  .main .facility .bg img {
    height: auto;
  }
}
.main .facility .bg video {
  -o-object-fit: cover;
     object-fit: cover;
  display: none;
}
.main .facility .bg video.pc {
  height: min(700px, 100cqw * 700 / 1400);
}
.main .facility .bg video.sp {
  height: 177.8666666667vw;
}
@media screen and (min-width: 751px) {
  .main .facility .bg video:is(body.movieActive *).pc {
    display: block;
  }
}
@media screen and (max-width: 750px) {
  .main .facility .bg video:is(body.movieActive *).sp {
    display: block;
  }
}
.main .facility .bg video:is(body.movieActive *) ~ picture {
  display: none;
}
.main .facility .bg:is(body.movieActive *)::after {
  grid-area: 1/1;
  content: "";
  display: block;
  background: rgba(0, 0, 0, 0.1);
}
.main .facility .wrap {
  grid-area: 1/1;
  padding-top: min(110px, 100cqw * 110 / 1400);
  position: relative;
}
@media screen and (max-width: 750px) {
  .main .facility .wrap {
    padding-top: 26.6666666667vw;
  }
}
.main .facility .btn--detail {
  margin: min(167px, 100cqw * 167 / 1400) 0 0 auto;
}
@media screen and (max-width: 750px) {
  .main .facility .btn--detail {
    margin: 60vw auto 0;
  }
}
.main .experience {
  display: grid;
  grid-template-rows: auto auto;
  background: #FFC341;
  overflow: hidden;
}
.main .experience .bg {
  grid-row: 1/2;
  grid-column: 1/2;
  position: relative;
}
.main .experience .bg::after,
.main .experience .bg:is(body.movieActive *)::after {
  grid-area: 1/1;
  position: absolute;
  content: '';
  bottom: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  display: block;
  background: rgba(0, 0, 0, 0.1) linear-gradient(transparent, transparent 64%, #FAC03D);
}
.main .experience .wrap {
  grid-row: 1/2;
  grid-column: 1/2;
  padding-top: min(100px, 100cqw * 100 / 1400);
  position: relative;
}
@media screen and (max-width: 750px) {
  .main .experience .wrap {
    padding-top: 21.3333333333vw;
  }
}
.main .experience .list {
  grid-row: 2/3;
  grid-column: 1/2;
  display: flex;
  flex-direction: column;
  gap: min(162px, 100cqw * 162 / 1400);
  width: 100%;
  margin-top: max(-55px, 100cqw * -55 / 1400);
  padding-bottom: min(162px, 100cqw * 162 / 1400);
  font-weight: 900;
  line-height: 1.44;
  letter-spacing: 0.05em;
  text-align: center;
}
@media screen and (max-width: 750px) {
  .main .experience .list {
    gap: 18.6666666667vw;
    margin-top: 1.8666666667vw;
    padding-bottom: 9.0666666667vw;
  }
}
.main .experience .list .slider {
  position: relative;
  width: min(1698px, 100cqw * 1698 / 1400);
  height: min(582px, 100cqw * 582 / 1400);
  margin: 0 calc(50cqw - min(849px, 100cqw * 849 / 1400));
}
@media screen and (max-width: 750px) {
  .main .experience .list .slider {
    width: auto;
    height: 77.3333333333vw;
    margin: 0;
  }
}
.main .experience .list .slider .legend {
  width: min(152px, 100cqw * 152 / 1400);
  height: min(107px, 100cqw * 107 / 1400);
  padding: min(15px, 100cqw * 15 / 1400) 0 0;
  position: absolute;
  top: max(-102px, 100cqw * -102 / 1400);
  left: calc(50% - min(76px, 100cqw * 76 / 1400));
  z-index: 2;
  background: url(https://yonasato.com/cms/img/yonayona_beerise2606/top/balloon01.svg) 50% 0/contain no-repeat;
  font-size: min(36px, 100cqw * 36 / 1400);
}
@media screen and (max-width: 750px) {
  .main .experience .list .slider .legend {
    width: 30.6666666667vw;
    height: 20vw;
    padding: 4vw 0 0;
    top: -14.6666666667vw;
    left: calc(50% - 15.3333333333vw);
    background-image: url(https://yonasato.com/cms/img/yonayona_beerise2606/top/balloon01_sp.svg);
    font-size: 6.4vw;
  }
}
.main .experience .list .slider .swiper {
  overflow: visible;
}
@media screen and (max-width: 750px) {
  .main .experience .list .slider .swiper {
    width: 64vw;
  }
}
.main .experience .list .slider .swiper .swiper-slide {
  width: min(566px, 100cqw * 566 / 1400);
  padding: 0 min(30px, 100cqw * 30 / 1400);
  transition: 0.4s;
  transition-property: translate, rotate;
  translate: 0 min(20px, 100cqw * 20 / 1400) 0;
  rotate: -5deg;
}
@media screen and (max-width: 750px) {
  .main .experience .list .slider .swiper .swiper-slide {
    width: 64vw;
    padding: 0 2.6666666667vw;
    translate: 0 5.3333333333vw 0;
  }
}
.main .experience .list .slider .swiper .swiper-slide .image video {
  aspect-ratio: 506/460;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: min(20px, 100cqw * 20 / 1400);
  display: none;
}
@media screen and (max-width: 750px) {
  .main .experience .list .slider .swiper .swiper-slide .image video {
    border-radius: 5.3333333333vw;
  }
}
.main .experience .list .slider .swiper .swiper-slide .image video:is(body.movieActive *) {
  display: block;
}
.main .experience .list .slider .swiper .swiper-slide .image video:is(body.movieActive *) + img {
  display: none;
}
.main .experience .list .slider .swiper .swiper-slide .image img {
  border-radius: min(20px, 100cqw * 20 / 1400);
}
@media screen and (max-width: 750px) {
  .main .experience .list .slider .swiper .swiper-slide .image img {
    border-radius: 5.3333333333vw;
  }
}
.main .experience .list .slider .swiper .swiper-slide .image figcaption {
  margin: min(10px, 100cqw * 10 / 1400) 0 0;
  color: #000;
  font-size: min(24px, 100cqw * 24 / 1400);
}
@media screen and (max-width: 750px) {
  .main .experience .list .slider .swiper .swiper-slide .image figcaption {
    margin: 2.6666666667vw 0 0;
    font-size: 4.8vw;
  }
}
.main .experience .list .slider .swiper .swiper-slide-active {
  translate: 0 0 0;
  rotate: 0deg;
}
.main .experience .list .slider .swiper .swiper-slide-active ~ .swiper-slide {
  translate: 0 min(20px, 100cqw * 20 / 1400) 0;
  rotate: 5deg;
}
@media screen and (max-width: 750px) {
  .main .experience .list .slider .swiper .swiper-slide-active ~ .swiper-slide {
    translate: 0 5.3333333333vw 0;
  }
}
.main .experience .list .slider .prev,
.main .experience .list .slider .next {
  width: min(40px, 100cqw * 40 / 1400);
  height: min(40px, 100cqw * 40 / 1400);
  border: none;
  padding: 0;
  position: absolute;
  top: min(196px, 100cqw * 196 / 1400);
  z-index: 1;
  background: url(https://yonasato.com/cms/img/yonayona_beerise2606/arw02.svg) center/contain no-repeat;
}
@media (prefers-reduced-motion: no-preference) {
  .main .experience .list .slider .prev,
.main .experience .list .slider .next {
    transition: opacity 0.4s;
  }
}
.main .experience .list .slider .prev.swiper-button-disabled,
.main .experience .list .slider .next.swiper-button-disabled {
  pointer-events: none;
  opacity: 0;
}
@media screen and (max-width: 750px) {
  .main .experience .list .slider .prev,
.main .experience .list .slider .next {
    width: 10.6666666667vw;
    height: 10.6666666667vw;
    top: 26.1333333333vw;
  }
}
.main .experience .list .slider .prev {
  scale: -1 1;
  right: calc(50% + min(270px, 100cqw * 270 / 1400));
}
@media screen and (max-width: 750px) {
  .main .experience .list .slider .prev {
    right: auto;
    left: 7.4666666667vw;
  }
}
.main .experience .list .slider .next {
  left: calc(50% + min(270px, 100cqw * 270 / 1400));
}
@media screen and (max-width: 750px) {
  .main .experience .list .slider .next {
    right: 7.4666666667vw;
    left: auto;
  }
}
.main .tour {
  display: grid;
}
.main .tour .bg {
  grid-area: 1/1;
}
.main .tour .bg img {
  width: 100%;
  height: min(726px, 100cqw * 726 / 1400);
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 750px) {
  .main .tour .bg img {
    height: auto;
  }
}
.main .tour .wrap {
  grid-area: 1/1;
  padding-top: min(100px, 100cqw * 100 / 1400);
  position:relative;
}
@media screen and (max-width: 750px) {
  .main .tour .wrap {
    padding-top: 87.4666666667vw;
  }
}
.main .tour .btn--detail {
  margin: min(208px, 100cqw * 208 / 1400) 0 0 auto;
}
@media screen and (max-width: 750px) {
  .main .tour .btn--detail {
    margin: 5.3333333333vw auto 0;
  }
}
.main .tour .wave::before {
  background-image: url(https://yonasato.com/cms/img/yonayona_beerise2606/wave_y.svg);
}
.main .gallery {
  padding: min(80px, 100cqw * 80 / 1400) 0 min(188px, 100cqw * 188 / 1400);
  background: #FFC341;
  letter-spacing: 0.05em;
  line-height: 1.44;
}
@media screen and (max-width: 750px) {
  .main .gallery {
    padding: 14.4vw 0 32vw;
    overflow: hidden;
  }
}
.main .gallery .title {
  font-size: min(48px, 100cqw * 48 / 1400);
  font-weight: 900;
  text-align: center;
}
@media screen and (max-width: 750px) {
  .main .gallery .title {
    font-size: 8.5333333333vw;
  }
}
.main .gallery .text {
  margin: min(20px, 100cqw * 20 / 1400) 0 0;
  font-size: min(20px, 100cqw * 20 / 1400);
  font-weight: 900;
  text-align: center;
}
@media screen and (max-width: 750px) {
  .main .gallery .text {
    margin: 5.3333333333vw 0 0;
    font-size: 4.8vw;
  }
}
.main .gallery .slider {
  margin: min(50px, 100cqw * 50 / 1400) 0 0;
}
@media screen and (max-width: 750px) {
  .main .gallery .slider {
    margin: 8vw -5.3333333333vw 0;
  }
}
.main .gallery .slider .inner {
  display: flex;
  justify-content: space-between;
  width: min(3720px, 100cqw * 3720 / 1400);
  padding-right: min(40px, 100cqw * 40 / 1400);
  -webkit-animation: ticker 20s linear infinite;
          animation: ticker 20s linear infinite;
}
.main .gallery .slider .inner:hover {
  -webkit-animation-play-state: paused;
          animation-play-state: paused;
}
@media screen and (max-width: 750px) {
  .main .gallery .slider .inner {
    width: 768vw;
    padding-right: 5.3333333333vw;
  }
}
.main .gallery .slider .slide {
  width: min(270px, 100cqw * 270 / 1400);
}
@media screen and (max-width: 750px) {
  .main .gallery .slider .slide {
    width: 58.6666666667vw;
  }
}
.main .gallery .slider .image {
  display: grid;
}
.main .gallery .slider .image img {
  grid-area: 1/1;
  border-radius: min(20px, 100cqw * 20 / 1400);
}
@media screen and (max-width: 750px) {
  .main .gallery .slider .image img {
    border-radius: 5.3333333333vw;
  }
}
.main .gallery .slider .image figcaption {
  grid-area: 1/1;
  align-self: end;
  padding: min(20px, 100cqw * 20 / 1400);
  color: #FFF;
  font-size: min(16px, 100cqw * 16 / 1400);
  position:relative;
}
@media screen and (max-width: 750px) {
  .main .gallery .slider .image figcaption {
    padding: 5.3333333333vw;
    font-size: 4.2666666667vw;
  }
}
.main .gallery .wave::before {
  background-image: url(https://yonasato.com/cms/img/yonayona_beerise2606/wave_bk.svg);
}
.main .access {
  padding: min(58px, 100cqw * 58 / 1400) 0 min(130px, 100cqw * 130 / 1400);
  background: #000;
}
@media screen and (max-width: 750px) {
  .main .access {
    padding: 0 0 21.3333333333vw;
  }
}
.main .access .wrap {
  display: grid;
  grid-template-rows: auto auto;
  grid-template-columns: auto 1fr;
  gap: min(50px, 100cqw * 50 / 1400) 0;
}
@media screen and (max-width: 750px) {
  .main .access .wrap {
    display: block;
  }
}
.main .access .headline {
  grid-row: 1/2;
  grid-column: 1/2;
  color: #fff;
  font-weight: 900;
  letter-spacing: 0.05em;
  line-height: 1.44;
}
@media screen and (max-width: 750px) {
  .main .access .headline {
    text-align: center;
  }
}
.main .access .headline .title {
  font-size: min(48px, 100cqw * 48 / 1400);
}
@media screen and (max-width: 750px) {
  .main .access .headline .title {
    font-size: 8.5333333333vw;
  }
}
.main .access .headline .text {
  margin: min(20px, 100cqw * 20 / 1400) 0 0;
  font-size: min(20px, 100cqw * 20 / 1400);
}
@media screen and (max-width: 750px) {
  .main .access .headline .text {
    margin: 5.3333333333vw 0 0;
    font-size: 4.8vw;
  }
}
.main .access .image {
  grid-row: 2/3;
  grid-column: 1/3;
  width: min(700px, 100cqw * 700 / 1400);
  border-radius: min(20px, 100cqw * 20 / 1400);
  overflow: hidden;
}
@media screen and (min-width: 751px) {
  .main .access .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (max-width: 750px) {
  .main .access .image {
    width: auto;
    margin: 10.6666666667vw -5.3333333333vw 0;
    border-radius: 0;
  }
}
.main .access .image video {
  -o-object-fit: cover;
     object-fit: cover;
  display: none;
  width: 100%;
  height: 100%;
}
.main .access .image video.sp {
  height: 117.3333333333vw;
}
@media screen and (min-width: 751px) {
  .main .access .image video:is(body.movieActive *).pc {
    display: block;
  }
}
@media screen and (max-width: 750px) {
  .main .access .image video:is(body.movieActive *).sp {
    display: block;
  }
}
.main .access .image video:is(body.movieActive *) ~ picture {
  display: none;
}
.main .access .data {
  grid-row: 2/3;
  grid-column: 1/3;
  align-self: center;
  justify-self: end;
  width: min(600px, 100cqw * 600 / 1400);
  padding: min(40px, 100cqw * 40 / 1400);
  position: relative;
  background: #fff;
  border-radius: min(20px, 100cqw * 20 / 1400);
}
@media screen and (max-width: 750px) {
  .main .access .data {
    width: auto;
    margin: 6.9333333333vw 0 0;
    padding: 10.6666666667vw 8vw;
    border-radius: 2.6666666667vw;
  }
}
.main .access .data .data-desc-list {
  font-size: min(16px, 100cqw * 16 / 1400);
  line-height: 1.5;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 750px) {
  .main .access .data .data-desc-list {
    font-size: 4.2666666667vw;
  }
}
.main .access .data .data-desc-list > div {
  display: grid;
  grid-template-columns: min(160px, 100cqw * 160 / 1400) 1fr;
  padding: min(20px, 100cqw * 20 / 1400) 0;
}
@media screen and (max-width: 750px) {
  .main .access .data .data-desc-list > div {
    display: block;
    padding: 5.3333333333vw 0;
  }
}
.main .access .data .data-desc-list > div:nth-child(n+2) {
  border-top: min(1px, 100cqw * 1 / 1400) solid #E5E5E5;
}
@media screen and (max-width: 750px) {
  .main .access .data .data-desc-list > div:nth-child(n+2) {
    border-top-width: 0.2666666667vw;
  }
}
.main .access .data .data-desc-list .data-desc-term {
  grid-column: 1/2;
  align-self: center;
  font-weight: 700;
}
.main .access .data .data-desc-list .data-desc-details {
  grid-column: 2/3;
  font-weight: 500;
}
@media screen and (max-width: 750px) {
  .main .access .data .data-desc-list .data-desc-details {
    margin: 2.6666666667vw 0 0;
  }
}
.main .access .data .data-desc-list .data-desc-details .gmaps {
  display: flex;
  align-self: center;
  gap: 0.5em;
  margin: min(8px, 100cqw * 8 / 1400) 0 0;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  color: inherit;
  text-decoration: underline;
}
@media screen and (max-width: 750px) {
  .main .access .data .data-desc-list .data-desc-details .gmaps {
    margin: 2.6666666667vw 0 0;
    gap: 2.6666666667vw;
  }
}
.main .access .data .data-desc-list .data-desc-details .gmaps::before {
  content: "";
  display: block;
  width: min(20px, 100cqw * 20 / 1400);
  aspect-ratio: 20/24;
  background: url(https://yonasato.com/cms/img/yonayona_beerise2606/ico-pin.svg) center/contain no-repeat;
}
@media screen and (max-width: 750px) {
  .main .access .data .data-desc-list .data-desc-details .gmaps::before {
    width: 4.5333333333vw;
  }
}
.main .access .data::before, .main .access .data::after {
  display: block;
  position: absolute;
  background: center/contain no-repeat;
}
.main .access .data::before {
  content: "";
  width: min(202px, 100cqw * 202 / 1400);
  aspect-ratio: 202/103;
  background-image: url(https://yonasato.com/cms/img/yonayona_beerise2606/top/img20_sp.png);
  top: max(-67px, 100cqw * -67 / 1400);
  right: 0;
}
@media screen and (max-width: 750px) {
  .main .access .data::before {
    content: "ちょっと寄り道していく？";
    display: grid;
    place-items: center;
    width: 70.9333333333vw;
    padding: 0 0 2.4vw;
    aspect-ratio: 266/75;
    background-image: url(https://yonasato.com/cms/img/yonayona_beerise2606/top/balloon02_sp.svg);
    top: -12.2666666667vw;
    right: calc(50% - 35.4666666667vw);
    font-size: 4.8vw;
    font-weight: 900;
    line-height: 1.44;
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 750px) {
  .main .access .data::after {
    content: "";
    width: 35.7333333333vw;
    aspect-ratio: 268/136;
    background-image: url(https://yonasato.com/cms/img/yonayona_beerise2606/top/img20_sp.png);
    right: -3.7333333333vw;
    bottom: -4vw;
  }
}
.main .access .btn--detail {
  grid-row: 1/2;
  grid-column: 2/3;
  align-self: end;
  justify-self: end;
}
@media screen and (max-width: 750px) {
  .main .access .btn--detail {
    margin: 5.3333333333vw auto 0;
  }
}
.main .news {
  padding: min(100px, 100cqw * 100 / 1400) 0 0;
  position: relative;
  background: #fff;
}
.main .news::before {
  content: "";
  display: block;
  width: min(183px, 100cqw * 183 / 1400);
  aspect-ratio: 183/229;
  position: absolute;
  background: center/contain no-repeat;
  background-image: url(https://yonasato.com/cms/img/yonayona_beerise2606/top/img21.png);
  left: calc(50% + min(450px, 100cqw * 450 / 1400));
  top: max(-150px, 100cqw * -150 / 1400);
}
@media screen and (max-width: 750px) {
  .main .news::before {
    content: none;
  }
}
@media screen and (max-width: 750px) {
  .main .news {
    padding: 10.6666666667vw 0 0;
  }
}
.main .news .wrap {
  display: grid;
  grid-template-rows: auto 1fr;
  grid-template-columns: 1fr min(808px, 100cqw * 808 / 1400);
  gap: min(40px, 100cqw * 40 / 1400);
}
@media screen and (max-width: 750px) {
  .main .news .wrap {
    display: block;
  }
}
.main .news .title {
  grid-row: 1/2;
  grid-column: 1/2;
  font-size: min(48px, 100cqw * 48 / 1400);
  font-weight: 900;
  line-height: 1.44;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 750px) {
  .main .news .title {
    font-size: 8.5333333333vw;
    text-align: center;
  }
}
.main .news .list {
  grid-row: 1/3;
  grid-column: 2/3;
  display: flex;
  flex-direction: column;
  gap: min(30px, 100cqw * 30 / 1400);
}
.main .news .list li:nth-child(n+4) {
  display: none;
}
@media screen and (max-width: 750px) {
  .main .news .list {
    margin: 9.6vw 0 0;
    gap: 3.2vw;
    position: relative;
  }
  .main .news .list::after {
    content: "";
    display: block;
    position: absolute;
    width: 22.6666666667vw;
    aspect-ratio: 171/214;
    background: url(https://yonasato.com/cms/img/yonayona_beerise2606/top/img21.png) center/contain no-repeat;
    top: -21.3333333333vw;
    right: -5.3333333333vw;
  }
}
.main .news .list a {
  display: block;
  min-height: min(150px, 100cqw * 150 / 1400);
  border: min(4px, 100cqw * 4 / 1400) solid currentColor;
  padding: min(20px, 100cqw * 20 / 1400);
  position: relative;
  border-radius: min(10px, 100cqw * 10 / 1400);
  color: inherit;
  font-weight: 500;
  line-height: 1.5;
  overflow: hidden;
}
@media screen and (max-width: 750px) {
  .main .news .list a {
    border-width: 1.0666666667vw;
    padding: 5.3333333333vw;
    border-radius: 2.6666666667vw;
  }
}
.main .news .list a::before, .main .news .list a::after {
  content: "";
  display: block;
  position: absolute;
}
.main .news .list a::before {
  width: min(64px, 100cqw * 64 / 1400);
  aspect-ratio: 1;
  right: max(-28px, 100cqw * -28 / 1400);
  bottom: max(-30px, 100cqw * -30 / 1400);
  background: currentColor;
  border-radius: 50%;
}
@media screen and (max-width: 750px) {
  .main .news .list a::before {
    width: 17.0666666667vw;
    right: -7.4666666667vw;
    bottom: -8vw;
  }
}
.main .news .list a::after {
  width: min(13px, 100cqw * 13 / 1400);
  aspect-ratio: 13/8;
  right: min(10px, 100cqw * 10 / 1400);
  bottom: min(11px, 100cqw * 11 / 1400);
  background: url(https://yonasato.com/cms/img/yonayona_beerise2606/arw03_y.svg) center/contain no-repeat;
}
@media screen and (max-width: 750px) {
  .main .news .list a::after {
    width: 3.4666666667vw;
    right: 2.6666666667vw;
    bottom: 2.9333333333vw;
  }
}
@media screen and (hover: hover) and (pointer: fine) {
  .main .news .list a::after {
    transition: translate 0.4s;
  }
  .main .news .list a:hover::after {
    translate: 50% 0 0;
  }
}
.main .news .list .date {
  font-size: min(14px, 100cqw * 14 / 1400);
}
@media screen and (max-width: 750px) {
  .main .news .list .date {
    font-size: 3.2vw;
  }
}
.main .news .list .text {
  margin: min(10px, 100cqw * 10 / 1400) 0 0;
  font-size: min(16px, 100cqw * 16 / 1400);
}
@media screen and (max-width: 750px) {
  .main .news .list .text {
    margin: 2.6666666667vw 0 0;
    font-size: 4.2666666667vw;
  }
}
.main .news .btn--detail {
  grid-row: 2/3;
  grid-column: 1/2;
}
@media screen and (max-width: 750px) {
  .main .news .btn--detail {
    margin: 5.3333333333vw auto 0;
  }
}
.main .faq {
  padding: min(113px, 100cqw * 113 / 1400) 0 min(75px, 100cqw * 75 / 1400);
}
@media screen and (max-width: 750px) {
  .main .faq {
    padding: 0 0 24.5333333333vw;
  }
}
.main .joinUs .wave--bottom::before {
  /* background-image: url(https://yonasato.com/cms/img/yonayona_beerise2606/wave_bk.svg); */
}
.main .joinUs::after {
  content: "";
  display: block;
  width: min(258px, 100cqw * 258 / 1400);
  aspect-ratio: 258/291;
  position: absolute;
  bottom: min(42px, 100cqw * 42 / 1400);
  left: calc(50% + min(311px, 100cqw * 311 / 1400));
  background: url(https://yonasato.com/cms/img/yonayona_beerise2606/top/img26.png) center/contain no-repeat;
  pointer-events: none;
}
@media screen and (max-width: 750px) {
  .main .joinUs::after {
    width: 34.1333333333vw;
    aspect-ratio: 256/257;
    bottom: 22.9333333333vw;
    right: 1.3333333333vw;
    left: auto;
    background-image: url(https://yonasato.com/cms/img/yonayona_beerise2606/top/img26_sp.png);
  }
}
.main .journal {
  position: relative;
  background: #000;
}
.main .journal::before {
  content: "";
  display: block;
  width: min(111px, 100cqw * 111 / 1400);
  aspect-ratio: 111/192;
  position: absolute;
  top: max(-138px, 100cqw * -138 / 1400);
  right: calc(50% + min(179px, 100cqw * 179 / 1400));
  background: url(https://yonasato.com/cms/img/yonayona_beerise2606/top/img27.png) center/contain no-repeat;
}
@media screen and (max-width: 750px) {
  .main .journal::before {
    width: 14.6666666667vw;
    top: -25.0666666667vw;
    right: auto;
    left: 6.9333333333vw;
  }
}
.main .journal .wave-container {
  padding: min(10px, 100cqw * 10 / 1400) 0 min(115px, 100cqw * 115 / 1400);
}
@media screen and (max-width: 750px) {
  .main .journal .wave-container {
    padding: 0 0 32vw;
  }
}
.main .journal .wrap {
  display: grid;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr auto;
  gap: min(40px, 100cqw * 40 / 1400) 0;
}
@media screen and (max-width: 750px) {
  .main .journal .wrap {
    display: block;
  }
}
.main .journal .title {
  grid-row: 1/2;
  grid-column: 1/2;
  color: #FFF;
  font-size: min(48px, 100cqw * 48 / 1400);
  font-weight: 900;
  line-height: 1.44;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 750px) {
  .main .journal .title {
    font-size: 8.5333333333vw;
    text-align: center;
  }
}
.main .journal .slider {
  grid-row: 2/3;
  grid-column: 1/3;
}
@media screen and (max-width: 750px) {
  .main .journal .slider {
    width: 78.9333333333vw;
    margin: 9.6vw auto 0;
    position: relative;
  }
}
.main .journal .slider .swiper {
  overflow: visible;
}
.main .journal .slider .swiper-slide {
  width: min(413px, 100cqw * 413 / 1400);
  padding: 0 min(40px, 100cqw * 40 / 1400) 0 0;
  height: auto;
}
@media screen and (max-width: 750px) {
  .main .journal .slider .swiper-slide {
    width: 78.9333333333vw;
    padding: 0 1.0666666667vw;
    translate: 0 10.6666666667vw 0;
  }
}
@media screen and (max-width: 750px) and (prefers-reduced-motion: no-preference) {
  .main .journal .slider .swiper-slide {
    transition: translate 0.4s;
  }
}
@media screen and (max-width: 750px) {
  .main .journal .slider .swiper-slide-active {
    translate: 0 0 0;
  }
}
@media screen and (min-width: 751px) {
  .main .journal .slider .swiper-slide:nth-child(odd) {
    padding-bottom: min(60px, 100cqw * 60 / 1400);
  }
}
@media screen and (min-width: 751px) {
  .main .journal .slider .swiper-slide:nth-child(even) {
    padding-top: min(60px, 100cqw * 60 / 1400);
  }
}
.main .journal .slider .swiper-slide a {
  display: block;
  height: 100%;
  border: min(4px, 100cqw * 4 / 1400) solid #FFC341;
  padding: min(24px, 100cqw * 24 / 1400);
  background: #fff;
  border-radius: min(20px, 100cqw * 20 / 1400);
  color: #000;
  font-weight: 500;
  line-height: 1.5;
}
@media screen and (max-width: 750px) {
  .main .journal .slider .swiper-slide a {
    border-width: 1.0666666667vw;
    padding: 0;
    border-radius: 2.6666666667vw;
  }
}
.main .journal .slider .swiper-slide .image img {
  border-radius: min(20px, 100cqw * 20 / 1400);
}
@media screen and (max-width: 750px) {
  .main .journal .slider .swiper-slide .image img {
    border-radius: 2.6666666667vw 2.6666666667vw 0 0;
  }
}
.main .journal .slider .swiper-slide .data {
  display: grid;
  grid-template-rows: auto auto;
  grid-template-columns: 1f auto;
  gap: min(16px, 100cqw * 16 / 1400) 0;
  margin: min(20px, 100cqw * 20 / 1400) 0 0;
}
@media screen and (max-width: 750px) {
  .main .journal .slider .swiper-slide .data {
    gap: 2.6666666667vw 0;
    margin: 0;
    padding: 5.3333333333vw 5.3333333333vw 0;
  }
}
.main .journal .slider .swiper-slide .data .cat {
  grid-row: 1/2;
  grid-column: 1/2;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: min(5px, 100cqw * 5 / 1400) min(10px, 100cqw * 10 / 1400);
  background: #FFC341;
  border-radius: min(15px, 100cqw * 15 / 1400);
  font-size: min(14px, 100cqw * 14 / 1400);
  letter-spacing: 0.05em;
  white-space: nowrap;
}
@media screen and (max-width: 750px) {
  .main .journal .slider .swiper-slide .data .cat {
    padding: 0.5333333333vw 2.6666666667vw;
    border-radius: 3.2vw;
    font-size: 3.7333333333vw;
  }
}
.main .journal .slider .swiper-slide .data .date {
  grid-row: 1/2;
  grid-column: 2/3;
  align-self: center;
  justify-self: end;
  font-size: min(12px, 100cqw * 12 / 1400);
}
@media screen and (max-width: 750px) {
  .main .journal .slider .swiper-slide .data .date {
    font-size: 3.2vw;
  }
}
.main .journal .slider .swiper-slide .data .text {
  grid-row: 2/3;
  grid-column: 1/3;
  font-size: min(16px, 100cqw * 16 / 1400);
}
@media screen and (max-width: 750px) {
  .main .journal .slider .swiper-slide .data .text {
    font-size: 4.2666666667vw;
  }
}
.main .journal .slider .swiper-slide .avt {
  display: flex;
  align-items: center;
  gap: min(10px, 100cqw * 10 / 1400);
  margin: min(24px, 100cqw * 24 / 1400) 0 0;
}
@media screen and (max-width: 750px) {
  .main .journal .slider .swiper-slide .avt {
    gap: 2.6666666667vw;
    margin: 0;
    padding: 2.6666666667vw 5.3333333333vw 5.3333333333vw;
  }
}
.main .journal .slider .swiper-slide .avt img {
  width: min(62px, 100cqw * 62 / 1400);
}
@media screen and (max-width: 750px) {
  .main .journal .slider .swiper-slide .avt img {
    width: 16vw;
  }
}
.main .journal .slider .swiper-slide .avt figcaption {
  font-size: min(14px, 100cqw * 14 / 1400);
  letter-spacing: 0.05em;
}
@media screen and (max-width: 750px) {
  .main .journal .slider .swiper-slide .avt figcaption {
    font-size: 3.7333333333vw;
  }
}
.main .journal .slider .prev,
.main .journal .slider .next {
  display: none;
}
@media screen and (max-width: 750px) {
  .main .journal .slider .prev,
.main .journal .slider .next {
    display: block;
    width: 10.6666666667vw;
    height: 10.6666666667vw;
    border: none;
    padding: 0;
    position: absolute;
    top: 67.2vw;
    z-index: 1;
    background: transparent url(https://yonasato.com/cms/img/yonayona_beerise2606/arw05.svg) center/contain no-repeat;
  }
}
@media screen and (max-width: 750px) and (prefers-reduced-motion: no-preference) {
  .main .journal .slider .prev,
.main .journal .slider .next {
    transition: opacity 0.4s;
  }
}
@media screen and (max-width: 750px) {
  .main .journal .slider .prev.swiper-button-disabled,
.main .journal .slider .next.swiper-button-disabled {
    pointer-events: none;
    opacity: 0;
  }
}
@media screen and (max-width: 750px) {
  .main .journal .slider .prev {
    left: -5.3333333333vw;
    scale: -1 1;
  }
}
@media screen and (max-width: 750px) {
  .main .journal .slider .next {
    right: -5.3333333333vw;
  }
}
.main .journal .btn--detail {
  grid-row: 1/2;
  grid-column: 2/3;
  align-self: end;
}
@media screen and (max-width: 750px) {
  .main .journal .btn--detail {
    margin: 14.9333333333vw auto 0;
  }
}
@media screen and (max-width: 750px) {
  .main .animationSwitch {
    position: fixed;
    right: 2.6666666667vw;
    bottom: 16.5333333333vw;
    z-index: 8000;
  }
}
.main .animationSwitch .legend {
  color: #FFF;
  font-size: min(12px, 100cqw * 12 / 1400);
  font-weight: 700;
  line-height: 1;
  text-align: center;
}
@media screen and (max-width: 750px) {
  .main .animationSwitch .legend {
    font-size: 3.2vw;
  }
}
.main .animationSwitch .btn--movie {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(85px, 100cqw * 85 / 1400);
  height: min(26px, 100cqw * 26 / 1400);
  margin: min(5px, 100cqw * 5 / 1400) 0 0;
  padding: 0 min(8px, 100cqw * 8 / 1400);
  border: min(2px, 100cqw * 2 / 1400) solid #ddd;
  background: #fff;
  border-radius: min(13px, 100cqw * 13 / 1400);
}
@media screen and (max-width: 750px) {
  .main .animationSwitch .btn--movie {
    width: 22.6666666667vw;
    height: 6.9333333333vw;
    margin: 1.3333333333vw 0 0;
    padding: 0 2.1333333333vw;
    border-width: 0.5333333333vw;
    border-radius: 3.4666666667vw;
  }
}
.main .animationSwitch .btn--movie span {
  display: block;
  border: none;
  padding: 0;
  color: #DDD;
  font-size: min(14px, 100cqw * 14 / 1400);
  font-weight: 700;
  line-height: 144%;
}
@media screen and (max-width: 750px) {
  .main .animationSwitch .btn--movie span {
    font-size: 3.7333333333vw;
  }
}
.main .animationSwitch .btn--movie span.on:is(body.movieActive *) {
  color: #FFC341;
}
.main .animationSwitch .btn--movie span.off:not(.main .animationSwitch .btn--movie span.off:is(body.movieActive *)) {
  color: #FFC341;
}

.popup {
  border: none;
  background: transparent;
  overflow: hidden;
  opacity: 0;

  margin:0;
  width:100svw;
  height:100lvh;
  display:flex;
  justify-content:center;
  align-items:center;
}
@media (prefers-reduced-motion: no-preference) {
  .popup {
    transition: opacity 1s;
  }
}
.popup[open] {
  opacity: 1;
}
@starting-style {
  .popup[open] {
    opacity: 0;
  }
}
.popup.closing {
  opacity: 0;
}
.popup.closing::-webkit-backdrop {
  opacity: 0;
}
.popup.closing::backdrop {
  opacity: 0;
}
.popup .panel {
  width: min(800px, 100cqw * 800 / 1400);
  background: #fff;
  border-radius: min(20px, 100cqw * 20 / 1400);
  position: relative;
  z-index: 9000;
}
@media screen and (max-width: 750px) {
  .popup .panel {
    width: auto;
    border-radius: 5.3333333333vw;
  }
}
.popup .panel .inner {
  max-height: calc(100vh - 70px);
  padding: min(60px, 100cqw * 60 / 1400);
  overflow-y: scroll;
  overscroll-behavior: contain;
  outline: none;
}
@media screen and (max-width: 750px) {
  .popup .panel .inner {
    max-height: calc(100svh - 2.6666666667vw);
    padding: 5.3333333333vw;
  }
}
.popup .panel .image img {
  height: auto;
  border-radius: min(20px, 100cqw * 20 / 1400);
}
@media screen and (max-width: 750px) {
  .popup .panel .image img {
    border-radius: 5.3333333333vw;
  }
}
.popup .panel .slider {
  position: relative;
}
.popup .panel .slider .pager {
  display: flex;
  justify-content: center;
  gap: min(10px, 100cqw * 10 / 1400);
  margin: min(10px, 100cqw * 10 / 1400) 0 0;
}
@media screen and (max-width: 750px) {
  .popup .panel .slider .pager {
    gap: 2.6666666667vw;
    margin: 2.6666666667vw 0 0;
  }
}
.popup .panel .slider .pager .swiper-pagination-bullet {
  width: min(10px, 100cqw * 10 / 1400);
  height: min(10px, 100cqw * 10 / 1400);
  margin: 0;
  background: #000;
  border-radius: 50%;
  opacity: 1;
}
@media screen and (max-width: 750px) {
  .popup .panel .slider .pager .swiper-pagination-bullet {
    width: 2.6666666667vw;
    height: 2.6666666667vw;
  }
}
.popup .panel .slider .pager .swiper-pagination-bullet-active {
  background: #FFC341;
}
.popup .panel .text {
  margin: min(10px, 100cqw * 10 / 1400) 0 0;
}
@media screen and (max-width: 750px) {
  .popup .panel .text {
    margin: 2.6666666667vw 0 0;
  }
}
.popup .panel .text .cat {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: min(5px, 100cqw * 5 / 1400) min(10px, 100cqw * 10 / 1400);
  background: #FAEE00;
  border-radius: min(10px, 100cqw * 10 / 1400);
  font-size: min(16px, 100cqw * 16 / 1400);
  font-weight: 900;
  line-height: 1.44;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 750px) {
  .popup .panel .text .cat {
    padding: 1.3333333333vw 2.6666666667vw;
    border-radius: 2.6666666667vw;
    font-size: 4.2666666667vw;
  }
}
.popup .panel .text .name {
  margin: min(5px, 100cqw * 5 / 1400) 0 0;
  font-weight: 900;
  line-height: 1.44;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 750px) {
  .popup .panel .text .name {
    margin: 1.3333333333vw 0 0;
  }
}
.popup .panel .text .name .en {
  font-size: min(24px, 100cqw * 24 / 1400);
}
@media screen and (max-width: 750px) {
  .popup .panel .text .name .en {
    font-size: 6.4vw;
  }
}
.popup .panel .text .name .ja {
  margin: min(5px, 100cqw * 5 / 1400) 0 0;
  font-size: min(14px, 100cqw * 14 / 1400);
}
@media screen and (max-width: 750px) {
  .popup .panel .text .name .ja {
    margin: 1.3333333333vw 0 0;
    font-size: 3.7333333333vw;
  }
}
.popup .panel .text p {
  margin: min(20px, 100cqw * 20 / 1400) 0 0;
  font-size: min(16px, 100cqw * 16 / 1400);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 750px) {
  .popup .panel .text p {
    margin: 5.3333333333vw 0 0;
    font-size: 4.2666666667vw;
  }
}
.popup .panel .prev,
.popup .panel .next {
  width: min(40px, 100cqw * 40 / 1400);
  height: min(40px, 100cqw * 40 / 1400);
  border: none;
  padding: 0;
  position: absolute;
  top: min(297px, 100cqw * 297 / 1400);
  z-index: 1;
  background: url(https://yonasato.com/cms/img/yonayona_beerise2606/arw02.svg) center/contain no-repeat;
}
@media (prefers-reduced-motion: no-preference) {
  .popup .panel .prev,
.popup .panel .next {
    transition: opacity 0.4s;
  }
}
.popup .panel .prev.swiper-button-disabled,
.popup .panel .next.swiper-button-disabled {
  pointer-events: none;
  opacity: 0;
}
@media screen and (max-width: 750px) {
  .popup .panel .prev,
.popup .panel .next {
    width: 10.6666666667vw;
    height: 10.6666666667vw;
    top: 26.6666666667vw;
  }
}
.popup .panel .prev {
  scale: -1 1;
  left: min(10px, 100cqw * 10 / 1400);
}
@media screen and (max-width: 750px) {
  .popup .panel .prev {
    left: -3.2vw;
  }
}
.popup .panel .next {
  right: min(10px, 100cqw * 10 / 1400);
}
@media screen and (max-width: 750px) {
  .popup .panel .next {
    right: -3.2vw;
  }
}
.popup .panel .btn--close {
  width: min(24px, 100cqw * 24 / 1400);
  height: min(24px, 100cqw * 24 / 1400);
  border: none;
  padding: 0;
  position: absolute;
  top: 0;
  right: 0;
  background: transparent url(https://yonasato.com/cms/img/yonayona_beerise2606/close01.svg) center/contain no-repeat;
  translate: 50% -50%;
  outline: none;
}
@media screen and (max-width: 750px) {
  .popup .panel .btn--close {
    width: 6.4vw;
    height: 6.4vw;
  }
}
.popup::-webkit-backdrop {
  background: rgba(0, 0, 0, 0.5);
}
.popup::backdrop {
  background: rgba(0, 0, 0, 0.5);
}
@media (prefers-reduced-motion: no-preference) {
  .popup::-webkit-backdrop {
    -webkit-transition: opacity 1s;
    transition: opacity 1s;
  }
  .popup::backdrop {
    transition: opacity 1s;
  }
}
/*# sourceMappingURL=top.css.map */