/* 1336pxの場合　フォントサイズ以外
 min(1rem,calc(10vw/14)) */

 html {
 scroll-behavior: auto;
}

body {
 overflow: hidden;
}
main {
 isolation: isolate;
}

.load {
 width: 100%;
 height: 100vh;
 height: 100dvh;
 background: url(../images/load_bg.webp) no-repeat;
 background-size: cover;
 position: fixed;
 top: 0;
 left: 0;
 z-index: 999;
}
.load_ttl {
 width:  min(43rem, calc(430vw / 14));
 height:  min(5.2rem, calc(52vw / 14));
 background: url(../images/load_ttl.svg) no-repeat;
 background-size: cover;
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 left: 0;
 right: 0;
 margin: 0 auto;
}
.load_ttl span {
  display: inline-block;
  will-change: transform;
}
/*                     header                */
header {
 position: fixed;
 width: 100%;
 top: 0;
 left: 0;
 z-index: 99;
}
.hd_inner {
 padding: min(3.5rem, calc(35vw / 14));
}
.hd_flex {
 display: flex;
 justify-content: space-between;
 align-items: center;
}
.hd_copy {
 width: min(18.4rem, calc(184vw / 14));
position: relative;
}
.hd_copy a{
 display: block;
position: relative;
}
.hd_copy a::before {
 content: '';
 width: 100%;
 border: min(.1rem, calc(1vw / 14)) solid #000;
 position: absolute;
 bottom:  max(-.5rem, calc(-5vw / 14)) ;
 left: 0;
 transition: .4s;
 transform-origin: center;
 transform: scale(0,1);
}
.hd_btn {
 width: min(6rem, calc(60vw / 14));
 display: flex;
 justify-content: space-between;
 align-items: center;
}
.hd_btn a {
 font-size: 1.2rem;
 letter-spacing: 0.15em;
 color: #000000;
 line-height: 1;
}
.hd_btn a.now {
 color: #0000004d;
}
.hd_btn span {
 display: block;
 width: min(0.8rem, calc(8vw / 14));
 height: min(1rem, calc(10vw / 14));
 position: relative;
}
.hd_btn span::before {
 content: "";
 width: min(0.1rem, calc(1vw / 14));
 height: 100%;
 background-color: #000;
 position: absolute;
 top: 0;
 left: 0;
 right: 0;
 margin: 0 auto;
 transform: rotate(25deg);
}

@media (hover: hover) and (pointer: fine) {
 .hd_copy a:where(:any-link, :enabled, summary):hover::before {
  transform: scale(1);

 }
 .hd_btn a:where(:any-link, :enabled, summary):hover {
  color: #0000004d;
 }
}

.side_menu {
 width: min(16rem, calc(160vw / 14));
 position: fixed;
 bottom: min(3.5rem, calc(35vw / 14));
 right: min(4rem, calc(40vw / 14));
 z-index: 10;
 text-align: right;
 display: none;
}
.side_menu li {
 margin-top: min(1rem, calc(10vw / 14));
}
.side_menu a {
 font-size: 1.4rem;
 font-weight: normal;
 color: #706f6f;
 display: inline-block;
 position: relative;
}
.side_menu.no a {
 color: #0000004d;
}
.side_menu a::before {
 content: "";
 width: 100%;
 height: 0;
 border: min(0.1rem, calc(1vw / 14)) solid #000;
 position: absolute;
 bottom: 0;
 left: 0;
 transition: 0.7s;
 transform-origin: right;
 transform: scale(0);
}

@media (hover: hover) and (pointer: fine) {
 .side_menu a:where(:any-link, :enabled, summary):hover {
  opacity: 0.7;
  color: #000000;
 }
 .side_menu a:where(:any-link, :enabled, summary):hover::before {
  transform: scale(1);
 }
}

/*                     mv                */

.mv_inner {
 width: 100%;
 height: 400dvh;
 position: relative;
}
.mv_item {
 position: sticky;
 top: 0;
}
.mv_movie {
 width: 100%;
 height: 100vh;
 height: 100dvh;
 overflow: hidden;
}
.mv_movie video {
 width: 100%;
 object-fit: cover;
 object-position: center;
 height: 100% !important;
}
.mv_copy {
 width: 100%;
 height: 100%;
 background-color: #faf8f2d9;
 position: absolute;
 top: 0;
 left: 0;
 z-index: 10;
 display: none;
}
.mv_copy_item_01,
.mv_copy_item_02 {
 display: flex;
 justify-content: space-between;
 align-items: center;
 flex-direction: row-reverse;
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 left: 0;
 right: 0;
 margin: 0 auto;
 width: min(34rem, calc(340vw / 14));
 opacity: 0;
transition: 0.4s;

}
.mv_copy_item_01.show,
.mv_copy_item_02.show {
 opacity: 1;
 visibility: visible;
}
.mv_copy_item_01 .mv_copy_txt {
 font-size: 2.2rem;
 font-weight: 500;
 letter-spacing: 0.2em;
 writing-mode: vertical-rl;
 text-orientation: upright;
 text-align: left;
 line-height: 2.7;
 /* display: none; */
 display: block !important;
  opacity: 0;
  transition: 0.4s;
}
.mv_copy_item_01.show .mv_copy_txt {
  opacity: 1;
}
.mv_copy_item_01 .mv_copy_txt span ,
.mv_copy_item_01 .mv_copy_ttl span,
 .mv_copy_item_02 .mv_copy_txt span {
 display: inline-block;
 filter: blur(5px);
 transition: 2s;
 transition-delay: 0s;
 opacity: 0;
}
.mv_copy_item_01 .mv_copy_txt span:first-of-type{
 transition-delay: .2s;
}
.mv_copy_item_01 .mv_copy_txt span:last-of-type{
 transition-delay: .5s;
}
.mv_copy_item_01 .mv_copy_ttl span:first-of-type{
 transition-delay: 1s;
}
.mv_copy_item_01 .mv_copy_ttl span:last-of-type{
 transition-delay: 1s;
}
.mv_copy_item_02 .mv_copy_txt span:first-of-type{
 transition-delay: .2s;
}
.mv_copy_item_02 .mv_copy_txt span:last-of-type {
 transition-delay: .8s;
}
.mv_copy_item_01.show .mv_copy_txt span,
.mv_copy_item_01.show .mv_copy_ttl span,
 .mv_copy_item_02.show .mv_copy_txt span{
 filter: blur(0);
 opacity: 1;
}
.mv_copy_item_01 .mv_copy_ttl {
 font-size: 3.2rem;
 font-weight: 500;
 letter-spacing: 0.15em;
 writing-mode: vertical-rl;
 text-orientation: upright;
 text-align: left;
 line-height: 2;
}
.mv_copy_item_02 {
 width: min(45rem, calc(450vw / 14));
}
.mv_copy_item_02 .mv_copy_txt {
 font-size: 1.8rem;
 letter-spacing: 0.15em;
 line-height: 2.44;
 writing-mode: vertical-rl;
 text-orientation: upright;
 text-align: left;
 font-weight: normal;
 /* display: none; */
}


/*                     section_contents                */
.section_contents {
 background-color: #f6ebd6;
 position: relative;
 z-index: 1;
}
.section_contents::before {
 content: "";
 width: 100%;
 height: 100%;
 background: url(../images/texture_bg.webp);
 background-size: contain;
 position: absolute;
 top: 0;
 left: 0;
 mix-blend-mode: overlay;
 z-index: -1;
 opacity: .7;
}

/*                     project                */
.project_inner {
 padding-top: min(13.5rem, calc(135vw / 14));
}
.project_ttl {
 font-size: 2.4rem;
 font-weight: bold;
 letter-spacing: 0.1em;
 line-height: 1.8;
}
.project_ttl span {
 width: min(33rem, calc(330vw / 14));
 display: inline-block;
 position: relative;
}
.project_ttl span::before {
 content: "";
 width: 100%;
 height: min(0.2rem, calc(2vw / 14));
 background-color: #000;
 position: absolute;
 bottom: 0;
 left: 0;
}

.project_img {
 width: min(113rem, calc(1130vw / 14));
 margin: 0 auto;
 padding-top: min(5.5rem, calc(55vw / 14));
 display: flex;
 align-items: center;
 justify-content: space-between;
 opacity: 1;
}
.project_img span,
.project_img > div {
 display: block;
 transition: 2s;
}
.project_img > div:first-of-type {

 width: min(41rem, calc(410vw / 14));
 transition-delay: .8s;
 opacity: 0;

}
.project_img span {
 width: min(30rem, calc(300vw / 14));
 height: min(30rem, calc(300vw / 14));
 position: relative;
}
.project_img span::before,
.project_img span::after {
 content: '';
 width: 100%;
 height: 0;
 border:  min(.1rem, calc(1vw / 14)) solid #000000;
 position: absolute;
 top: 50%;
 left: 0;
 transform: rotate(45deg) translateY(-50%);
 clip-path: inset(0 100% 0 0);
 transition: 1s;
}
.project_img span::before{
 transition-delay: .4s;
}

.project_img span::after {
 left: auto;
 right: 0;
 transform: rotate(-45deg) translateY(-50%);
 clip-path: inset(0 0 0 100%);
}
.project_img > div:last-of-type {
 width: min(41rem, calc(410vw / 14));
 transition-delay: .8s;
 opacity: 0;
}
.scrollin.project_img span,
.scrollin.project_img > div{
 opacity: 1;
}
.scrollin.project_img span::before,
.scrollin.project_img span::after{
 clip-path: inset(0);
}
.project_flex {
 width: min(110rem, calc(1100vw / 14));
 margin: min(5rem, calc(50vw / 14)) auto 0;
 display: flex;
 justify-content: space-between;
}
.project_detail {
 width: min(25rem, calc(250vw / 14));
 text-align: justify;
 margin-top:  min(15rem, calc(150vw / 14));
}
.project_detail:first-of-type {
 align-self: flex-end;
}

.project_detail_ttl {
 font-size: 3rem;
 font-weight: 500;
 letter-spacing: 0.1em;
 line-height: 1.5;
 padding-top:  min(5rem, calc(50vw / 14));
}
.project_detail_ttl span {
 display: block;
 font-family: YakuHanJP, "Cormorant Garamond", serif;
 font-size: 2rem;
 font-weight: 500;
 letter-spacing: 0.1em;
}

.project_detail_txt {
 font-size: 1.4rem;
 font-weight: normal;
 line-height: 1.85;
 margin-top: min(2rem, calc(20vw / 14));
}

.project_txt {
 font-size: 2.4rem;
 font-weight: 500;
 letter-spacing: 0.05em;
 line-height: 2.9;
}

.project_txt p:first-of-type::after {
 content: '';
 width:  min(4.5rem, calc(45vw / 14));
 height:  min(.1rem, calc(1vw / 14));
 background-color: #000;
 display: inline-block;
 vertical-align: super;
 margin-left:  min(.5rem, calc(5vw / 14));
}
.project_txt p {
 margin-bottom: min(4rem, calc(40vw / 14));
}
.project_icon {
 width: min(8rem, calc(80vw / 14));
 margin-left: auto;
 margin-top: min(2rem, calc(20vw / 14));
}

/*                     movie                */
.movie_inner {
 padding: min(10rem, calc(100vw / 14)) 0 min(5rem, calc(50vw / 14));
}
.movie_btn {
 width: min(120rem, calc(1200vw / 14));
 margin: 0 auto;
 position: relative;
 overflow: hidden;
 transition:opacity 1.5s;
}
.movie_btn img {
 transition: 0.4s;
}
.movie_btn::before {
 content: "";
 width: min(13rem, calc(130vw / 14));
 height: min(13rem, calc(130vw / 14));
 background: url(../images/thum_icon.svg) no-repeat;
 margin: 0 auto;
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 left: 0;
 right: 0;
 z-index: 1;
}
@media (hover: hover) and (pointer: fine) {

 .movie_btn:where(:any-link, :enabled, summary):hover img {
  transform: scale(1.1);
 }
}

.movie_sns {
 width: min(10rem, calc(100vw / 14));
 display: flex;
 justify-content: space-between;
 margin: min(2rem, calc(20vw / 14)) auto 0;
}
.movie_sns li {
 width: min(3.3rem, calc(33vw / 14));
}
.movie_sns li a {
 display: block;
 width: 100%;
 border-radius: 50%;
 background-color: #000;
 box-sizing: border-box;
 border: min(0.1rem, calc(1vw / 14)) solid #000;
}
.movie_sns li a span {
 display: block;
 width: min(2rem, calc(20vw / 14));
 margin: 0 auto;
 padding: min(0.55rem, calc(5.5vw / 14)) 0;
 transition: 0.4s;
}
@media (hover: hover) and (pointer: fine) {
 .movie_sns li a:where(:any-link, :enabled, summary):hover {
  background-color: #fff;
 }
 .movie_sns li a:where(:any-link, :enabled, summary):hover span {
  filter: brightness(1) invert(1);
 }
}

/*                     story_copy                */

.story_copy_inner {
 width: 100%;
 height: 130vh;
 height: 130dvh;
 position: relative;
}
.story_copy_item {
 width: 100%;
 height: 100vh;
 height: 100dvh;
 position: sticky;
 top: 0;
 left: 0;
}
.story_catchphrase_img {
 width: 100%;
 overflow: hidden;
 position: absolute;
 bottom: 0;
 left: 0;
}
.story_catchphrase_img img{
 width: min(192rem, calc(1920vw / 14)) !important;
 height:100vh !important;
 object-fit: cover;
 object-position: bottom center;
 position: relative;
 top: 0;
 left: 50%;
 transform: translateX(-50%);
}



.story_copy_txt {
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
 background-color: #f8f5ee80;
 opacity: 0;
 filter: blur(1rem);
 visibility: hidden;
 transition: 1s;
}
.story_copy_txt.show {
 opacity: 1;
 filter: blur(0);
 visibility:visible;
}
.story_copy_txt p {
 width: fit-content;
 display: flex;
 justify-content: space-between;
 margin: 0 auto;
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 left: 0;
 right: 0;
 flex-direction: row-reverse;
 text-align: left;
}
.story_copy_txt span {
 font-size: 2.4rem;
 font-weight: 500;
 writing-mode: vertical-rl;
 text-orientation: upright;
 letter-spacing: 0.15em;
 line-height: 2.5;
}
.story_copy_txt span:last-of-type {
 margin-top: min(11rem, calc(110vw / 14));
}

/*                     story                */
.story_top {
 padding:  min(4rem, calc(40vw / 14)) 0 min(5rem, calc(50vw / 14));
}
#story.section_contents::before {
 background-size: contain;
}
.story_ttl {
 display: flex;
 align-items: center;
 justify-content: center;
 gap: 0 min(2rem, calc(20vw / 14));
}
.story_ttl::before,
.story_ttl::after {
 content: "";
 width: min(4.5rem, calc(45vw / 14));
 border-bottom: min(0.1rem, calc(1vw / 14)) solid #000;
}
.story_ttl span {
 font-size: 2rem;
 font-weight: bold;
 letter-spacing: 0.25em;
}
.story_menu_flex {
 width: min(108rem, calc(1080vw / 14));
 margin: min(2rem, calc(20vw / 14)) auto 0;
 display: flex;
 justify-content: space-between;
 position: relative;
 left: max(-6rem, calc(-60vw / 14));
}

.story_menu {
 width: min(50rem, calc(500vw / 14));
}


.story_menu:last-of-type {
 margin-top: min(4.5rem, calc(45vw / 14));
}
.story_menu_item {
 display: flex;
 justify-content: space-between;
 margin-bottom: min(1.5rem, calc(15vw / 14));
 transform: translateY(10%);
 transition: 2s;
}
.story_menu_item:nth-of-type(2) {
 transition-delay: .3s;
}
.story_menu_item:nth-of-type(3) {
 transition-delay: .6s;
}
.story_menu_item:nth-of-type(4) {
 transition-delay: .9s;
}
.story_menu_item.scrollin {
 transform: translate(0);
}
.story_menu_thum {
 width: min(43rem, calc(430vw / 14));
 overflow: hidden;
}
.story_menu_thum img {
 transition: 0.4s;
}
@media (hover: hover) and (pointer: fine) {
 .story_menu_item a:where(:any-link, :enabled, summary):hover img {
  transform: scale(1.1);
  opacity: 0.7;
 }
}
.story_menu_txt {
 display: flex;
 align-items: flex-start;
 flex-direction: row-reverse;
 gap: 0 min(1rem, calc(10vw / 14));
}
.story_menu_txt span {
 display: inline-block;
 font-size: 1.4rem;
 font-weight: 600;
 writing-mode: vertical-rl;
 text-orientation: upright;
 letter-spacing: 0.1em;
 color: #fff;
 background-color: #000000;
 line-height: 1.6;
 padding: min(0.5rem, calc(5vw / 14)) 0;
}
.story_menu_txt span:last-of-type {
  padding-bottom: 0;
 }
.story_menu_txt span.sp_blake {
 background-color: transparent;
 padding:  0;
 text-align: left;
}
.story_menu_txt span.sp_blake span:first-of-type {
 padding-bottom: 0;
}
.story_menu_txt span.sp_blake span:last-of-type {
 padding-top: 0;
}
.story_menu:last-of-type .story_menu_item:nth-of-type(2) .story_menu_txt span.sp_blake span {
letter-spacing: 0.01em;
}
.story_menu:last-of-type .story_menu_item:nth-of-type(2) .story_menu_txt span.sp_blake span:last-of-type  {
 padding-bottom: 0;
}
.story_menu:last-of-type .story_menu_item:nth-of-type(3) .story_menu_txt span:last-of-type  {
 padding-bottom: min(0.5rem, calc(5vw / 14));
}

.scroll_container {
  height: 800dvh;
  background-color: #f8f5ee;
}
.sticky_wrap {
  overflow: hidden;
  position: sticky;
  top: 0;
  height: 100dvh;
}
.horizontal_scroll {
  position: absolute;
  top: 0;
  height: 100%;
  width: 800vw;
  will-change: transform;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.scroll_contents {
  height: 100%;
  width: 100vw;
  position: relative;
}



.scroll_container::before {
 content: "";
 width: 100%;
 height: 100%;
 background: url(../images/texture_bg.webp);
 background-size: contain;
 position: absolute;
 top: 0;
 left: 0;
 mix-blend-mode: overlay;
 z-index: -1;
}
.scroll_container .story_ttl {
  position: absolute;
  top: min(2rem, calc(20vw / 14));
  left: 0;
  right: 0;
  margin: 0 auto;
 }
.scroll_container  .story_ttl span{
 text-indent: 0.3em;
 }



.horizontal-menu {
 position: absolute;
 top: min(8rem, calc(80vw / 14));
 right: min(3.5rem, calc(35vw / 14));
 display: flex;
 gap: 0 min(1.5rem, calc(15vw / 14));
 z-index: 100;
}

.horizontal-pagination li {
 margin-top: min(1rem, calc(10vw / 14));
}
.horizontal-pagination li a {
 font-size: 1rem;
 font-weight: 600;
 letter-spacing: 0.25em;
 color: #000;
 opacity: .5;
}
.horizontal-pagination li.is-active a{
 opacity: 1;
 font-weight: 700;
}

/* スクロールバー */
.horizontal-scrollbar {
 width: min(0.2rem, calc(2vw / 14));
 height: min(24rem, calc(240vw / 14));
 /* background: #c8c8c8; */
 z-index: 10;
}

.horizontal-scrollbar__thumb {
 display: flex;
 flex-direction: column;
 align-items: center;
}
.horizontal-scrollbar__thumb li {
 width: min(0.1rem, calc(1vw / 14));
  height: min(3rem, calc(30vw / 14));
  background: #c8c8c8;
  transition: .1s;
  margin: 0 auto;
 }
 .horizontal-scrollbar__thumb li.is-active {
  width: min(0.3rem, calc(3vw / 14));
 background: #000;
}


.story_flex {
 width: min(91rem, calc(910vw / 14));
 margin: 0 auto;
 display: flex;
 justify-content: space-between;
 align-items: center;
 position: absolute;
 top: 55%;
 transform: translateY(-50%);
 left: 0;
 right: 0;
}
.story_img {
 max-width: min(41rem, calc(410vw / 14));
 width:calc(100dvh - min(9rem, calc(90vw / 14)) - min(5rem, calc(50vw / 14)) - min(25rem, calc(250vw / 14)));
 box-shadow: 0 0 min(0.5rem, calc(5vw / 14)) #0000001a;
 transition: 1s;
 opacity: 0;
 filter: blur(1rem);
 transform: translateX(1rem);
}

.story_item_ttl {
 width: min(15rem, calc(150vw / 14));
 writing-mode: vertical-rl;
 text-orientation: upright;
 text-align: center;
 font-size: 2.5rem;
 font-weight: 600;
 letter-spacing: 0.25em;
 display: flex;
 justify-content: center;
 position: relative;
 padding: min(5rem, calc(50vw / 14)) 0  min(3rem, calc(30vw / 14));
 text-align: center;
 transition: 1s;
 transition-delay: .4s;
 opacity: 0;
 filter: blur(1rem);
 transform: translateX(1rem);
}
.story_item_ttl::before {
 content: "";
 width: min(5.5rem, calc(55vw / 14));
 height: min(7rem, calc(70vw / 14));
 background: url(../images/story_copy_icon_top.svg) no-repeat;
 background-size: cover;
 position: absolute;
 top: 0;
 right: 0;
}
.story_item_ttl::after {
 content: "";
 width: min(6.5rem, calc(65vw / 14));
 height: min(5rem, calc(50vw / 14));
 background: url(../images/story_copy_icon_bottom.svg) no-repeat;
 background-size: cover;
 position: absolute;
 bottom: 0;
 left: 0;
}
.story_item_ttl span {
 width: fit-content;
 display: block;
 margin: 0 auto;
 text-align: left;
}
.story_txt {
 width: fit-content;
 font-size: 1.6rem;
 font-weight: 500;
 letter-spacing: 0.075em;
 line-height: 1.87;
 writing-mode: vertical-rl;
 text-orientation: upright;
 text-align: left;
 transition: 1s;
 transition-delay: .8s;
 opacity: 0;
 filter: blur(1rem);
 transform: translateX(1rem);


}
.story_year {
 font-size: 2.5rem;
 letter-spacing: 0.25em;
 font-weight: 600;
 position: absolute;
 bottom: 0;
 right: 0;
 transition: 1s;
 transition-delay: 1.2s;
 opacity: 0;
 filter: blur(1rem);
 transform: translateX(1rem);
}

.scroll_contents:not(:first-of-type).show .story_img,
.scroll_contents:not(:first-of-type).show .story_item_ttl,
.scroll_contents:not(:first-of-type).show .story_txt,
.scroll_contents:not(:first-of-type).show .story_year{
 opacity: 1;
 filter: blur(0rem);
 transform: translateX(0rem);
}
.scroll_contents:first-of-type.scrollin .story_img,
.scroll_contents:first-of-type.scrollin .story_item_ttl,
.scroll_contents:first-of-type.scrollin .story_txt,
.scroll_contents:first-of-type.scrollin .story_year{
 opacity: 1;
 filter: blur(0rem);
 transform: translateX(0rem);
}


.skip_btn {
 width:min(9rem, calc(90vw / 14));
 position: absolute;
 bottom: min(2.5rem, calc(25vw / 14));
 left: 0;
 right: 0;
 margin: 0 auto;
 z-index: 5;
}
.skip_btn a {
 display: block;
}

@media (hover: hover) and (pointer: fine) {
 .skip_btn a:where(:any-link, :enabled, summary):hover  {
  transform: scale(1.05);
 }
}



/*                     spot_copy                */

.spot_copy_inner {
 width: 100%;
 height: 120vh;
 height: 120dvh;
 position: relative;
}
.spot_copy_item {
 width: 100%;
 height: 100vh;
 height: 100dvh;
 position: sticky;
 top: 0;
 left: 0;
}

.spot_petal {
 position: absolute;
 top: 0;
bottom: 0;
 left: 0;
 right: 0;
 margin:  auto;
 z-index: 1;
 height: fit-content;
 opacity: 0;
 transition: 1s;
}
.spot_petal.show {
 opacity: 1;
}
.spot_petal_01 {
 width:min(4rem, calc(40vw / 14));
 top: max(-43rem, calc(-430vw / 14));
 left: max(-21rem, calc(-210vw / 14));
}
.spot_petal_02 {
 width:min(4.8rem, calc(48vw / 14));
 top: max(-45rem, calc(-450vw / 14));
 right: max(-14rem, calc(-140vw / 14));
 transition-delay: .3s;
}
.spot_petal_03 {
 width:min(4rem, calc(40vw / 14));
 top: max(-13rem, calc(-130vw / 14));
 right: max(-28rem, calc(-280vw / 14));
 transition-delay: .6s;
}
.spot_petal_04 {
 width:min(6.7rem, calc(67vw / 14));
 bottom: max(-50rem, calc(-500vw / 14));
 left: max(-2rem, calc(-20vw / 14));
 transition-delay: .9s;
}

.spot_copy_txt p:first-of-type.show {
 transition-delay: 1.2s;

}

.spot_copy_txt {
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
 background-color: #f8f5ee80;
}
.spot_copy_txt p {
 width: fit-content;
 display: flex;
 justify-content: space-between;
 margin: 0 auto;
 position: absolute;
 top: 40%;
 transform: translateY(-50%);
 left: 0;
 right: 0;
 flex-direction: row-reverse;
 text-align: left;
 z-index: 1;
 opacity: 0;
 visibility: hidden;
 transition: 1s;
 filter: blur(1rem);
}
.spot_copy_txt p.show {
 opacity: 1;
 visibility: visible;
 filter: blur(0);

}
.spot_copy_txt span {
 font-size: 2.4rem;
 font-weight: 500;
 writing-mode: vertical-rl;
 text-orientation: upright;
 letter-spacing: 0.15em;
 line-height: 1;
}
.spot_copy_txt p:last-of-type {
 width: fit-content;
 font-size: 2rem;
 font-weight: normal;
 letter-spacing: 0.1em;
 line-height: 2.5;
 writing-mode: vertical-rl;
 text-orientation: upright;
 text-align: left;
 position: absolute;
 top: 44%;
 transform: none;
 left: max(-41rem, calc(-410vw / 14));
 right: 0;
 margin: 0 auto;
 z-index: 1;
}

/*                     spot                */
#spot {
 background-color: #f8f5ee;
}
.spot_inner {
 position: relative;
 padding: min(15rem, calc(150vw / 14)) 0 min(5rem, calc(50vw / 14));
 overflow: hidden;
}

.spot_flex {
 width: min(120rem, calc(1200vw / 14));
 display: flex;
 justify-content: space-between;
 margin: 0 auto;
 position: relative;
 z-index: 1;
 isolation: isolate;
}
.spot_flex_bg {
 content: "";
 width: 100vw;
 height: min(35rem, calc(350vw / 14));
 background-color: #f6ebd6;
 position: absolute;
 top: min(7.5rem, calc(75vw / 14));
 right: 0;
 left: min(20rem, calc(200vw / 14));
 margin: 0 auto;
 z-index: -1;
}
.spot_flex_bg::before {
 content: "";
 width: 100%;
 height: 100%;
 background: url(../images/texture_bg.webp);
 background-size: contain;
 position: absolute;
 top: 0;
 left: 0;
 mix-blend-mode: overlay;
 z-index: -1;
}
.spot_ttl {
 width: min(15rem, calc(150vw / 14));
 font-size: 3rem;
 font-weight: 500;
 letter-spacing: 0.1em;
 writing-mode: vertical-rl;
 text-orientation: upright;
}
.spot_item {
 width: min(90rem, calc(900vw / 14));
 display: flex;
 justify-content: space-between;
}
.spot_item_box {
 width: min(25rem, calc(250vw / 14));
}

.spot_item_ttl {
 font-size: 1.4rem;
 line-height: 1.8;
 letter-spacing: 0.1em;
 font-weight: 500;
 margin-top: min(1.5rem, calc(15vw / 14));
}
.spot_item_ttl span {
 display: block;
 font-size: 2rem;
 line-height: 1.6;
}

.spot_item_btn {
 width: min(12rem, calc(120vw / 14));
 margin: min(2rem, calc(20vw / 14)) auto 0;
}
.spot_item_btn a {
 width: 100%;
 display: flex;
 justify-content: space-between;
 align-items: center;
 font-size: 1.4rem;
 letter-spacing: 0.1em;
 line-height: 1.85;
 color: #000;
 position: relative;
}
.spot_item_btn a::after {
 content: "";
 width: min(1.3rem, calc(13vw / 14));
 height: min(0.7rem, calc(7vw / 14));
 background: url(../images/arrow.svg) no-repeat;
 background-size: cover;
 filter: brightness(1) invert(1);
}
.spot_item_btn a::before {
 content: "";
 width: 100%;
 height: 0;
 border-bottom: #c8c8c8 solid min(0.1rem, calc(1vw / 14));
 position: absolute;
 bottom: 0;
 left: 0;
 transition: 0.4s;
 transform-origin: left;
}

@keyframes btn_hover {
 0% {
  transform: scale(0);
 }
 1000% {
  transform: scale(1);
 }
}

@media (hover: hover) and (pointer: fine) {
 .spot_item_btn a:where(:any-link, :enabled, summary):hover {
  opacity: 0.7;
 }
 .spot_item_btn a:where(:any-link, :enabled, summary):hover::before {
  animation: btn_hover linear forwards 0.4s;
 }
}

/*                     gourmet                */

#gourmet {
 background-color: #f8f5ee;
}
.gourmet_inner {
 position: relative;
 padding: min(10rem, calc(100vw / 14)) 0 min(6rem, calc(60vw / 14));
 overflow: hidden;
}

.gourmet_flex {
 width: min(96rem, calc(960vw / 14));
 display: flex;
 justify-content: space-between;
 margin: 0 auto;
 position: relative;
 z-index: 1;
 isolation: isolate;
}
.gourmet_flex_bg {
 content: "";
 width: 100vw;
 height: min(35rem, calc(350vw / 14));
 background-color: #f6ebd6;
 position: absolute;
 top: min(7.5rem, calc(75vw / 14));
 right: min(28rem, calc(280vw / 14));
 margin: 0 auto;
 z-index: -1;
}
.gourmet_flex_bg::before {
 content: "";
 width: 100%;
 height: 100%;
 background: url(../images/texture_bg.webp);
 background-size: contain;
 position: absolute;
 top: 0;
 left: 0;
 mix-blend-mode: overlay;
 z-index: -1;
}
.gourmet_ttl {
 width: min(25rem, calc(250vw / 14));
 font-size: 3rem;
 font-weight: 500;
 letter-spacing: 0.1em;
 writing-mode: vertical-lr;
 text-orientation: upright;
}
.gourmet_item {
 width: min(57.5rem, calc(575vw / 14));
 display: flex;
 justify-content: space-between;
}
.gourmet_item_box {
 width: min(25rem, calc(250vw / 14));
}

.gourmet_item_ttl {
 font-size: 1.3rem;
 line-height: 1.8;
 letter-spacing: 0.1em;
 font-weight: 500;
 margin-top: min(1.5rem, calc(15vw / 14));
}
.gourmet_item_ttl span {
 display: block;
 font-size: 2rem;
 line-height: 1.6;
 letter-spacing: 0.1em;
}

.gourmet_item_btn {
 width: min(12rem, calc(120vw / 14));
 margin: min(2rem, calc(20vw / 14)) auto 0;
}
.gourmet_item_btn a {
 width: 100%;
 display: flex;
 justify-content: space-between;
 align-items: center;
 font-size: 1.4rem;
 letter-spacing: 0.1em;
 line-height: 1.85;
 color: #000;
 position: relative;
}
.gourmet_item_btn a::before {
 content: "";
 width: 100%;
 height: 0;
 border-bottom: #c8c8c8 solid min(0.1rem, calc(1vw / 14));
 position: absolute;
 bottom: 0;
 left: 0;
 transition: 0.4s;
 transform-origin: left;
}
.gourmet_item_btn a::after {
 content: "";
 width: min(1.3rem, calc(13vw / 14));
 height: min(0.7rem, calc(7vw / 14));
 background: url(../images/arrow.svg) no-repeat;
 background-size: cover;
 filter: brightness(1) invert(1);
}

@keyframes btn_hover {
 0% {
  transform: scale(0);
 }
 1000% {
  transform: scale(1);
 }
}

@media (hover: hover) and (pointer: fine) {
 .gourmet_item_btn a:where(:any-link, :enabled, summary):hover {
  opacity: 0.7;
 }
 .gourmet_item_btn a:where(:any-link, :enabled, summary):hover::before {
  animation: btn_hover linear forwards 0.4s;
 }
}

/*                     reserve                */

#reserve {
 background-color: #f8f5ee;
}
.reserve_inner {
 padding: min(9rem, calc(90vw / 14)) 0 min(15rem, calc(150vw / 14));
}
.reserve_ttl {
 font-size: 2.4rem;
 font-weight: 500;
 letter-spacing: 0.15em;
}
.reserve_txt {
 font-size: 1.8rem;
 font-weight: 600;
}
.reserve_txt span {
 display: inline-block;
 border-bottom: min(0.3rem, calc(3vw / 14)) solid #000;
 margin-top: min(2.5rem, calc(25vw / 14));
}

.reserve_btn {
 width: min(67rem, calc(670vw / 14));
 margin: min(4.5rem, calc(45vw / 14)) auto 0;
 display: flex;
 justify-content: space-between;
}
.reserve_btn a {
 width: min(32rem, calc(320vw / 14));
 box-sizing: border-box;
 font-size: 1.8rem;
 font-weight: 500;
 letter-spacing: 0.1em;
 color: #fff;
 background-color: #000000;
 border-radius: min(3.5rem, calc(35vw / 14));
 border: min(0.2rem, calc(2vw / 14)) solid #000;
 position: relative;
 padding: min(1.5rem, calc(15vw / 14)) 0;
}
.reserve_btn a::after {
 content: "";
 width: min(1.3rem, calc(13vw / 14));
 height: min(0.7rem, calc(7vw / 14));
 background: url(../images/arrow.svg) no-repeat;
 background-size: cover;
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 right: min(2.5rem, calc(25vw / 14));
 transition: .4s;
}


@media (hover: hover)  and (pointer: fine){
 .reserve_btn a:where(:any-link, :enabled, summary):hover {
  background-color: #fff;
  color: #000;
 }
 .reserve_btn a:where(:any-link, :enabled, summary):hover::after {

  filter: brightness(1) invert(1);
 }
}


/*                     last_copy                */

.last_copy_inner {
 width: 100%;
 height: 100vh;
 height: 100dvh;
 position: relative;
}
.last_copy_item {
 width: 100%;
 height: 100vh;
 height: 100dvh;
 position: sticky;
 top: 0;
 left: 0;
}

.last_img {
 width: min(25rem, calc(250vw / 14));
 position: absolute;
 bottom: min(14rem, calc(140vw / 14));
 left: 0;
 right: 0;
 margin: 0 auto;
 z-index: 1;
 transition: 1s;
 filter: blur(1rem);
 visibility: hidden;
 opacity: 0;
}
.last_copy_inner.show .last_img {
 filter: blur(0);
 visibility: visible;
 opacity: 1;
 transition-delay: .4s;
}

.last_copy_txt {
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
 background-color: #f8f5ee80;
 transition: 1s;
 filter: blur(1rem);
 visibility: hidden;
 opacity: 0;
}
.last_copy_inner.show .last_copy_txt {
 filter: blur(0);
 visibility: visible;
 opacity: 1;

}
.last_copy_txt p {
 width: fit-content;
 display: flex;
 justify-content: space-between;
 margin: 0 auto;
 position: absolute;
 top: 35%;
 transform: translateY(-50%);
 left: 0;
 right: 0;
 flex-direction: row-reverse;
 text-align: left;
}
.last_copy_txt span {
 font-size: 2.8rem;
 font-weight: 500;
 writing-mode: vertical-rl;
 text-orientation: upright;
 letter-spacing: 0.2em;
 line-height: 2.5;
}
.last_copy_txt span:last-of-type {
 margin-top: min(7rem, calc(70vw / 14));
}

/*                     footer                */
footer {
 position: relative;
}
.footer_inner {
 width: 100%;
 background-color: #fff;
 position: absolute;
 bottom: 0;left: 0;
 padding: min(1.5rem, calc(15vw / 14)) 0;
 z-index: 10;
}
.footer_flex {
 width: min(110rem, calc(1100vw / 14));
 margin: 0 auto;
 display: flex;
 justify-content: space-between;
 align-items: center;
}
.footer_logo {
 width: min(34rem, calc(340vw / 14));
 display: flex;
 align-items: center;
 justify-content: space-between;
}
.footer_logo span {
 width: min(7rem, calc(70vw / 14));
}
.footer_logo p {
 font-size: 1.6rem;
 font-weight: 500;
 letter-spacing: 0.1em;
}
.copy {
 font-size: 1rem;
 letter-spacing: 0.1em;
 font-family: "Manrope", sans-serif;
}

.move_modal {
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 height: 100vh;
 height: 100dvh;
 background-color: #ffffffd9;
 z-index: 100;
 display: none;
}
.move_modal_bg {
 width: 100%;
 height: 100%;
 position: fixed;
 top: 0;
 left: 0;
}
.move_modal_inner {
 width: min(86rem, calc(860vw / 13.66));
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 left: 0;
 right: 0;
 margin: 0 auto;
}
.move_modal_item {
 height: min(48.4rem, calc(484vw / 13.66));
}
.move_modal_item .popup_movie {
 width: 100%;
 height: 100%;
 border: none;
}

.close_btn {
 width: min(7rem, calc(70vw / 13.66));
 height: min(7rem, calc(70vw / 13.66));
 position: absolute;
 top: max(-7rem, calc(-70vw / 13.66));
 right: 0;
}
.close_btn::before {
 content: "";
 width: 100%;
 height: 0;
 border: min(0.1rem, calc(1vw / 13.66)) solid #000;
 position: absolute;
 top: min(3.2rem, calc(32vw / 13.66));
 left: 0;
 right: 0;
 margin: 0 auto;
 transform: rotate(45deg);
 box-sizing: border-box;
}
.close_btn::after {
 content: "";
 width: 100%;
 height: 0;
 border: min(0.1rem, calc(1vw / 13.66)) solid #000;
 position: absolute;
 bottom: min(3.6rem, calc(36vw / 13.66));
 left: 0;
 right: 0;
 margin: 0 auto;
 transform: rotate(-45deg);
 box-sizing: border-box;
}





@media screen and (max-width: 767px) {
 .load_ttl {
 width:25rem;
 height: 3rem;
}
 /*                     header                */
 .hd_inner {
  padding: 2rem;
 }
 .hd_flex {
  justify-content: flex-start;
 }
 .hd_copy {
  width: 14.3rem;
 }
 .hd_btn {
  margin-left: auto;
  width: 6.5rem;
  margin-right: 3rem;
 }
 .hd_btn a {
  font-size: 1.2rem;
  letter-spacing: 0.1em;
 }
 .hd_btn span {
  width: 0.7rem;
  height: 1.2rem;
 }
 .hd_btn span::before {
 width:.1rem;
}
 .side_menu {
  display: none !important;
 }

 .nav_btn {
  width: 2.5rem;
  position: relative;
  padding: 0.5rem 0;
  z-index: 5;
 }
 .nav_btn::before,
 .nav_btn::after {
  content: "";
  width: 100%;
  border: 0.1rem solid #000000;
  position: absolute;
  left: 0;
  transition: .4s;
 }
 .nav_btn::before {
  top: 0;
 }
 .nav_btn::after {
  bottom: 0;
 }
 .nav_btn.open::before {
  top: .4rem;
  transform: rotate(35deg);
 }
 .nav_btn.open::after {
  bottom: .4rem;
  transform: rotate(-35deg);
 }

 .nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  background-color: #faf8f2d9;
  display: none;
 }
 .nav_bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
 }
 .nav_menu {
  width: 32rem;
  position: absolute;
  bottom:3rem;
  left: 0;
  right: 0;
  margin: 0 auto;
 }
 .nav_menu li {
  text-align: right;
  margin-top: 2rem;
 }
 .nav_menu li a{
  font-size: 1.4rem;
  font-weight: normal;
  color: #000;
  letter-spacing: 0.05em;

 }

 /*                     mv                */

 .mv_inner {
  height: 400dvh;
 }
 .mv_copy_item_01,
 .mv_copy_item_02 {
  width: 23rem;
 }
 .mv_copy_item_01 .mv_copy_txt {
  font-size: 1.6rem;
  letter-spacing: 0.1em;
  line-height: 2.8;
 }
 .mv_copy_item_01 .mv_copy_ttl {
  font-size: 2.4rem;
  letter-spacing: 0.075em;
 }
 .mv_copy_item_02 {
  width: 26rem;
 }
 .mv_copy_item_02 .mv_copy_txt {
  font-size: 1.4rem;
  letter-spacing: 0.08em;
  line-height: 2.3;
 }


 .section_contents::before {
 background: url(../images/texture_bg_sp.webp);
 background-size: contain;
}

 /*                     project                */
 .project_inner {
  padding-top: 9.5rem;
 }
 .project_ttl {
  font-size: 1.6rem;
 }
 .project_ttl span {
  width: 21rem;
 }
 .project_ttl span::before {
  height: 0.1rem;
 }

 .project_img {
  width: 27rem;
  margin: 0 auto;
  padding-top: 7.5rem;
  flex-direction: column;
  gap:1rem 0;
 }
 .project_img span ,
 .project_img > div {
 display: block;
 transition: 1.5s;
}
.project_img >div:first-of-type {

 width: 22.6rem;
 transition-delay: .8s;

}
.project_img span {
 width:8.5rem;
 height:8.5rem;

}
.project_img span::before,
.project_img span::after {
 border: .1rem solid #000000;
}
.project_img > div:last-of-type {
 width: 26rem;
 transition-delay: .8s;
}

 .project_flex {
  width: 32.5rem;
  flex-direction: column;
  margin-top: 4rem;
  position: relative;
 }
 .project_detail {
  width: 29rem;
  margin: 0 auto;
  margin-top: 0;
  padding-top: 6rem;
 }
 .project_detail:first-child {
  position: absolute;
  top: 31.5rem;
  left: 0;
  right: 0;
  margin: 0 auto;
  padding-top: 0;
 }
 .project_detail_ttl {
  width: 29rem;
  margin: 0 auto;
  font-size: 2.4rem;
  line-height: 1.5;
  padding-top: 0;
 }
 .project_detail_ttl span {
  font-size: 1.4rem;
 }

 .project_detail_txt {
  width: 29rem;
  margin: 0 auto;
  font-size: 1.3rem;
  margin-top: 1rem;
 }

 .project_txt {
  font-size: 1.5rem;
  line-height: 2.3;
  margin-top: 0;
  margin-bottom: 30rem;
 }
 .project_txt p {
  margin-bottom: 2rem;
 }
 .project_txt p:first-of-type::after {
 width: 2rem;
 height: .1rem;
 margin-left: .5rem;
}
 .project_icon {
  width: 6.8rem;
  margin-top: 1rem;
  margin-left: 0;
 }

 /*                     movie                */
 .movie_inner {
  padding: 4.5rem 0 9.5rem;
 }
 .movie_btn {
  width: 32.5rem;
 }

 .movie_btn::before {
  width: 5rem;
  height: 5rem;
 }

 .movie_sns {
  width: 8rem;
  margin: 1.5rem auto 0;
 }
 .movie_sns li {
  width: 3rem;
 }
 .movie_sns li a {
  border: 0.1rem solid #000;
 }
 .movie_sns li a span {
  width: 1.7rem;
  padding: 0.55rem 0;
  font-size: 0;
 }
 /*                     story_copy_                */
#story {
 position: relative;
 z-index: 5;
}
 .story_catchphrase_img {
  width: 100%;
  left: auto;
  right: 0;
  margin: auto;
 }
 .story_catchphrase_img img{
 width: 100% !important;
 position: relative;
 top: 0;
 left: 0;
 transform: none;
}


 .story_copy_txt p {
  margin: 0 ;
  top: 14rem;
  transform:none;
  left: 6rem;
  right: auto;
 }
 .story_copy_txt span {
  font-size: 1.9rem;
  letter-spacing: 0.08em;
  line-height: 2.1;
 }
 .story_copy_txt span:last-of-type {
  margin-top: 8rem;
 }

 /*                     story                */
 .story_inner {
 padding: 0;
}
.story_top {
 padding: 7rem 0 3rem;
}
 .story_ttl {
  gap: 0 1rem;
 }
 .story_ttl::before,
 .story_ttl::after {
  width:2.5rem;
  border-bottom:.1rem solid #000;
 }
 .story_ttl span {
  font-size: 1.6rem;
  letter-spacing: 0.1em;
 }
 .story_menu_flex {
  width: 100%;
  margin: 4rem auto 0;
  flex-direction: column;
  left: 0;
 }

 .story_menu {
  width: 100%;
 }

 .story_menu:last-of-type {
  margin-top:2rem;
 }
 .story_menu_item {
  margin-bottom:2rem;
  position: relative;
 }
 .story_menu_item:nth-of-type(2) {
 transition-delay: 0s;
}
.story_menu_item:nth-of-type(3) {
 transition-delay: 0s;
}
.story_menu_item:nth-of-type(4) {
 transition-delay: 0s;
}
  .story_menu_item:last-of-type {
   margin-bottom: 0;
  }
 .story_menu_thum {
  width:100%;
 }
 .story_menu_txt {
  gap: 0 1rem;
  position: absolute;
  top: 0;
  right: 2.5rem;
 }
 .story_menu_txt span {
  font-size: 1.4rem;
  letter-spacing: 0.08em;
  padding: .5rem 0;
 }

 .story_menu_txt span.sp_blake {
 display: flex;
 flex-direction: column;
 align-items: flex-start;
 line-height: .7;
}
.story_menu_txt span.sp_blake span:first-of-type {
 padding-bottom: .5rem;
}
.story_menu_txt span.sp_blake span:last-of-type {
 padding-top: .5rem;
}
.story_menu:last-of-type .story_menu_item:nth-of-type(3) .story_menu_txt span:last-of-type  {
 padding-bottom: .5rem;
}



 .scroll_container {
  height: 1600dvh;
 }
 .scroll_container::before {
 background: url(../images/texture_bg_sp.webp);
 background-size: contain;
}


 .scroll_container .story_ttl {
  position: absolute;
  top: 6.5rem;
  left: 0;
  right: 0;
  margin: 0 auto;
 }

 .horizontal_scroll {
  width: 1600vw;

 }
 .scroll_contents {
  width: 200vw;
 }

 .horizontal-menu {
  width: 100%;
  top: auto;
  bottom: 4rem;
  right: 0;
  left: 0;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 0;
 }

 .horizontal-pagination {
  width: 32.5rem;
  margin: 0 auto;
  display: flex;
  gap: 0;
  justify-content: space-between;
 }
 .horizontal-pagination li {
  margin-top:0;
  width: 4rem;
 }
 .horizontal-pagination li a {
  width: fit-content;
  margin: 0 auto;
  font-size: 1.1rem;
  font-weight: 600;
  letter-spacing: 0.25em;
  writing-mode: vertical-rl;
  text-orientation: upright;
  transform-origin: bottom;
  text-align: center;
 }
 .horizontal-pagination li.is-active a{
  transform: scale(1.1);
 }

 /* スクロールバー */
 .horizontal-scrollbar {
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  height: .2rem;
  width: 32rem;
 }
.horizontal-scrollbar__thumb {
flex-direction: row;
}
.horizontal-scrollbar__thumb li {
  height: .1rem;
  width: 4rem;
 }
 .horizontal-scrollbar__thumb li.is-active {
  width: 4rem;
  padding:    0;
}


 .story_flex {
  width: 65rem;
  top: 50%;
 }
 .story_img {
  max-width: 26.3rem;
  width:calc(100dvh - 6rem - 9rem - 18rem);
  box-shadow: 0 0 .5rem #0000001a;
 }
 .story_item_ttl {
  width:11rem;
  font-size: 2.1rem;
  letter-spacing: 0.1em;
  padding: 3.5rem 0;
 }
 .story_item_ttl::before {
  width:4.1rem;
  height: 5.3rem;
 }
 .story_item_ttl::after {
  width: 4.8rem;
  height:3.7rem;
 }
 .story_txt {
  font-size: 1.4rem;
  line-height: 1.9;
 }
 .story_year {
  font-size: 1.6rem;
  letter-spacing: 0.1em;
 }


.skip_btn {
 width:6.5rem;
 bottom:1rem;
}
.skip_btn a {
 display: block;
}


 /*                     spot_copy                */
 .spot_petal {
  bottom: auto;
  left: auto;
  right: auto;
  margin: 0 auto;
 }

 .spot_petal_01 {
 width:2.7rem;
 top: 6.8rem;
 left:10rem;
}
.spot_petal_02 {
 width:3.3rem;
 top:5.4rem;
 right: 12.3rem;
}
.spot_petal_03 {
 width:2.8rem;
 top: 17rem;
 right:7.5rem;
}
.spot_petal_04 {
 width:4.8rem;
 bottom:auto;
 top: 32.3rem;
 left: 14.5rem;
}

 .spot_copy_txt p {
  top: 9.5rem;
  transform: none;
 }
 .spot_copy_txt span {
  font-size: 1.9rem;
  letter-spacing: 0.08em;
 }
 .spot_copy_txt p:last-of-type {
  font-size: 1.4rem;
  letter-spacing: 0.08em;
  line-height: 2.35;
  top: auto;
  bottom: 8rem;
  left: 0;
 }
 .min .spot_copy_txt p:last-of-type {
   bottom: 2rem;
 }

 /*                     spot                */

 .spot_inner {
  padding: 10rem 0 0;
 }

 .spot_flex {
  width:31rem;
  padding-bottom: 3.5rem;
 }
.spot_flex_bg::before {
 background: url(../images/texture_bg_sp.webp);
 background-size: contain;
}
 .spot_flex_bg {
  width: 29rem;
  height: 100%;
  top: 0;
  right: -3rem;
  left: auto;
  margin: 0 ;
 }
 .spot_ttl {
  width:fit-content;
  font-size: 2.1rem;
  line-height: 1;
  text-align: left;
 }
 .spot_item {
  width:21.5rem;
  flex-direction: column;
  gap: 5rem 0;
  margin-top: 3.5rem;
 }
 .spot_item_box {
  width: 100%;
 }

 .spot_item_ttl {
  font-size: 1.4rem;
  margin-top:1rem;
 }
 .spot_item_ttl span {
  font-size: 1.8rem;
 }

 .spot_item_btn {
  width:11rem;
  margin:1.5rem auto 0;
 }
 .spot_item_btn a {
  font-size: 1.3rem;
 }
 .spot_item_btn a::after {
  width: 1.2rem;
  height: .6rem;
 }
 .spot_item_btn a::before {
  border: none;
  border-bottom: .1rem solid #c8c8c8;
  bottom: -0.5rem;
 }

 /*                     gourmet                */

 .gourmet_inner {
  padding:10rem 0 0;
 }

 .gourmet_flex {
  width: 31rem;
  padding-bottom: 3.5rem;
 }
.gourmet_flex_bg{
  width: 29rem;
  height: 100%;
  top: 0;
  right: auto;
  left: -3rem;
  margin: 0 ;
 }
 .gourmet_flex_bg::before {
 content: "";
 width: 100%;
 height: 100%;
 background: url(../images/texture_bg.webp);
 background-size: contain;
 position: absolute;
 top: 0;
 left: 0;
 mix-blend-mode: overlay;
 z-index: -1;
}
 .gourmet_ttl {
  width:fit-content;
  font-size: 2.1rem;
  line-height: 1;
  text-align: left;
 }
 .gourmet_item {
  width: 21.5rem;
  flex-direction: column;
  gap: 5rem 0;
  margin-top: 3.5rem;
 }
 .gourmet_item_box {
  width: 100%;
 }

 .gourmet_item_ttl {
  font-size: 1.4rem;
  margin-top: 1rem;
  line-height: 1.5;
 }
 .gourmet_item_ttl span {
  font-size: 1.8rem;
  line-height: 1.7;

 }

 .gourmet_item_btn {
  width:11rem;
  margin:1.5rem auto 0;
 }
 .gourmet_item_btn a {
  font-size: 1.3rem;
 }
 .gourmet_item_btn a::after {
  width: 1.2rem;
  height: .6rem;
 }
 .gourmet_item_btn a::before {
  border: none;
  border-bottom: .1rem solid #c8c8c8;
  bottom: -.5rem;
 }


 /*                     reserve                */

 .reserve_inner {
  padding: 10rem 0 ;
 }
 .reserve_ttl {
  font-size: 1.8rem;
  letter-spacing: 0.1em;
 }
 .reserve_txt {
  font-size: 1.4rem;
 }
 .reserve_txt span {
  border-bottom:.2rem solid #000;
  margin-top:3rem;
 }

 .reserve_btn {
  width: 25rem;
  margin:3rem auto 0;
  gap: 1.5rem 0;
  flex-direction: column;
 }
 .reserve_btn a {
  width:100%;
  font-size: 1.4rem;
  border-radius:2.5rem;
  border:.1rem solid #000;
  position: relative;
  padding: 1rem  0;
 }
 .reserve_btn a::after {
  width:1.2rem;
  height: .6rem;
  right: 2rem;
 }

 /*                     last_copy                */

 .last_img {
  width:25rem;
  bottom:12.5rem;
 }


 .last_copy_txt p {
  top: 15rem;
  transform: none;
 }
 .min .last_copy_txt p  {
  top: 6rem;
 }
 .last_copy_txt span {
  font-size: 1.9rem;
  letter-spacing: 0.1em;
 }
 .last_copy_txt span:last-of-type {
  margin-top: 4.5rem;
 }

 /*                     footer                */
 .footer_inner {
  padding:1.5rem 0 1rem;
 }
 .footer_flex {
  width: 29rem;
  flex-direction: column;
  gap: 1.5rem 0;
 }
 .footer_logo {
  width:100%;
 }
 .footer_logo span {
  width:6rem;
 }
 .footer_logo p {
  font-size: 1.4rem;
 }
 .copy {
  font-size: 1rem;
 }

 .move_modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  background-color: #ffffffd9;
  z-index: 100;
  display: none;
 }
 .move_modal_bg {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
 }
 .move_modal_inner {
  width: 33.5rem;
 }
 .move_modal_item {
  height: 18.8rem;
 }

 .close_btn {
  width: 2.5rem;
  height: 2.5rem;
  top:-3rem;
 }
 .close_btn::before {
  border:.1rem solid #000;
  top: 1.2rem;
 }
 .close_btn::after {
  border:.1rem solid #000;
  bottom: 1.1rem;
 }

 .top_btn {
 width:6rem;
 position: fixed;
 bottom:1.5rem;
 right: 1.5rem;
 z-index: 5;
 opacity: 0;
 visibility: hidden;
 transition: .7s;
}
.top_btn.show {
 opacity: 1;
 visibility: visible;
}


}


.scrollbar {
 width: fit-content;
 display: flex;
 flex-direction: column;
 position: absolute;
 right: min(4rem, calc(40vw / 13.66));
 bottom: min(1rem, calc(10vw / 13.66));
 gap:  min(.5rem, calc(5vw / 13.66)) 0;
 transition: 1s;
 z-index: 10;
}
.scrollbar.show {
 opacity: 1;
}
.scrollbar p {
 font-size: 1rem;
 letter-spacing: 0.1em;
 color: #0000004d;
}

.scrollarrow {
 width: min(3.2rem, calc(32vw / 13.66));
 margin: 0 auto;
 animation-name: scroll_move;
 animation-duration: 1.5s;
 animation-timing-function:
 linear;
 animation-iteration-count: infinite;
 opacity: .3;
}


@keyframes scroll_move {
 0% {
  clip-path: inset(0 0 100% 0);
 }
 50% {
  clip-path: inset(0 0 0 0);
 }
 100% {
  clip-path: inset(100% 0 0 0);
 }
}




@media screen and (max-width: 767px) {

 .scrollbar {
  bottom:1rem;
  gap: .5rem 0;
  right: 2rem;
 }
 .scrollarrow {
  width:2rem;
 }
}