@charset "utf-8";

html.is-open {
  overflow: hidden;
}

body {
  background: #030303; /*#050505*/
  margin: 0;
  padding: 0;
  color: hsla(0, 0%, 100%, 1);
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-feature-settings: "palt";
  scroll-behavior: smooth;
}


a {
  text-decoration: none;
  cursor: pointer;
}

button {
  cursor: pointer;
}

img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

.container {
  padding: 0 min(4.285714285714286vw, 60px);
}

@media (max-width:768px) {
  .container {
    padding: 0 20px;
  }
}

.fadeIn {
  transform: translate3d(0, 50px, 0);
  transition: opacity 1s;
  opacity: 0;
}

.fadeIn.animated {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

/* FV */
.logo_container {
  padding: min(2.857142857142857vw, 40px) 0;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  position: relative;
}

@media (max-width:768px) {
  .logo_container {
    padding: 12.307692307692308vw 0;
  }
}

.fv_top_logo_img {
  transition-delay: 1.5s;
  width: 12.857142857142856vw;
  position: absolute;
  top: 5.72916667%;
  right: 0;
  left: 0;
  margin: 0 auto;
}


@media (max-width:920px) {
  .fv_top_logo_img {
    top: 48px;
    width: 46.15384615384615vw;
  }
}

.loading_fadeIn {
  opacity: 0;
  visibility: hidden;
  transition: opacity 1s;
  transition-delay: 1s;
}

.loading_fadeIn.delay {
  transition-delay: 2.5s; /*1.5s;*/
}

.loading_fadeIn.load {
  opacity: 1;
  visibility: visible;
}


.main_logo {
  /*width: 49.21875vh;
  height: 39.1992188vh;*/
  width: 41.84vh;
  height: 33.32vh;
  position: absolute;
  bottom: 33%; /*29.0364583%*/
  right: 0;
  left: 0;
  margin: 0 auto;
  display: block;
}

@media (max-width:920px) {

  .main_logo {
    width: 71.7948717949vw;
    height: 57.1794871795vw;
  }
}

@media (max-width:768px) {
  .main_logo {
    bottom: 33.17535545%;
    width: min(71.7948717949vw, 280px);
    height: min(57.1794871795vw, 223px);
  }
}

.main_logo img {
  height: 100%;
}

.fv_bottom_logo_img {
  transition-delay: 1.5s;
  position: absolute;
  bottom: 4.94791667%;
  right: 0;
  left: 0;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width:768px) {
  .fv_bottom_logo_img {
    bottom: 48px;
  }
}

.fv_logo_nagahama {
  transition: opacity .4s ease;
  width: 8.428571428571429vw;
}

.fv_logo_nagahama:hover {
  opacity: 0.6;
}

@media (max-width:920px) {
  .fv_logo_nagahama {
    width: 30.256410256410255vw;
  }
}

.fv_logo_project_of_japan {
  width: 6.857142857142858vw;
}

.fv_logo_project_of_japan:hover {
  opacity: 0.6;
}

@media (max-width:920px) {
  .fv_logo_project_of_japan {
    width: 24.615384615384617vw;
  }
}

.fv_logo_snowpeak {
  transition: opacity .4s ease;
  width: 8.428571428571429vw;
}

.fv_logo_snowpeak:hover {
  opacity: 0.6;
}

@media (max-width:920px) {
  .fv_logo_snowpeak {
    width: 30.256410256410255vw;
  }
}

.whisky {
  margin: min(17.142857142857142vw, 240px) 0 0;
  width: 100%;
}

@media (max-width:965px) {
  .whisky {
    margin: 27.56476683937824vw 0 13.043478260869565vw;
  }
}


@media (max-width:768px) {
  .whisky {
    margin: 40vw 0 30.76923076923077vw;
  }
}

.whisky_sticky {
  width: 100%;
  position: relative;
}


@media (max-width:768px) {
  .whisky_img {
    position: static;

  }
}

.fadeIn_whisky {
  transform: translate3d(0, 50px, 0);
  transition: opacity 1s;
  opacity: 0;
  position: sticky;
  top: 0;
  height: auto;
}

@media (max-width:965px) {
  .fadeIn_whisky {
    position: static;
  }
}

.fadeIn_whisky.animated {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

.whisky_img img {
  width: 100%;
  height: 100vh;
  object-fit: cover;
}

@media (max-width:768px) {
  .whisky_img img {
    width: auto;
    height: auto;
  }
}

@media (max-width:768px) {
  .whisky_img picture {
    width: 100%;
    /*width: 52.083333333333336vw;
    min-width: 390px;*/
    margin: 0 auto;
  }
}

@media (max-width:390px) {
  .whisky_img picture {
    width: 100%;
    min-width: auto;
  }
}

.whisky_explanation {
  max-width: 369px;
  width: 26.357142857142858vw;
  margin-left: 4.285714285714286vw;
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media (max-width:1045px) {
  .whisky_explanation {
    width: 28.428571428571427vw;
  }
}

@media (max-width:905px) {
  .whisky_explanation {
    width: 26.428571428571427vw;
  }
}

@media (max-width:965px) {
  .whisky_explanation {
    max-width: 400px;
    width: 100%;
    margin: 120px auto 0;
    padding: 0;
    position: static;
    height: auto;
  }
}


.whisky_title {
  font-family: "fot-tsukumin-pr6n", sans-serif;
  font-weight: 300;
  font-size: clamp(16px, 2vw, 28px);
  line-height: 1.65;
  letter-spacing: 0.04em;
}

@media (max-width:965px) {
  .whisky_title {
    text-align: center;
    font-weight: 300;
    font-size: 24px;
    line-height: 1.55;
    letter-spacing: 0.08em;
  }
}


.whisky_text_container {
  display: flex;
  flex-direction: column;
  gap: 16px;
  gap: clamp(8px, 1.1428571428571428vw, 16px);
  margin-top: min(2.2857142857142856vw, 32px);
}

@media (max-width:965px) {
  .whisky_text_container {
    gap: 16px;
    margin-top: 32px;
  }
}


.whisky_text_container p {
  font-size: clamp(12px, 1vw, 14px);
  line-height: 2;
  font-weight: 500;
}

@media (max-width:965px) {
  .whisky_text_container p {
    font-size: 14px;
    line-height: 1.75;
    letter-spacing: 0.02em;
    text-align: center;
  }
}



.whisky_detail {
  width: 100%;
  padding-right: 4.285714285714286vw;
  position: sticky;
  display: flex;
  justify-content: flex-end;
  top: 0;
  height: 100vh;
  align-items: center;
}


@media (max-width:965px) {
  .whisky_detail {
    position: static;
    width: 100%;
    margin: 60px auto 0;
    justify-content: center;
    padding: 0;
    position: static;
    height: auto;
  }
}


.whisky_detail_container {
  max-width: 300px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.detail_item {
  display: flex;
  gap: 40px;
  padding: clamp(18px, 1.4285714285714286vw, 20px) 0 6px;
  border-bottom: 1px solid hsla(0, 0%, 29%, 1);
  width: 100%;
}

@media (max-width:1000px) {
  .detail_item {
    display: flex;
    gap: 20px;
  }
}

@media (max-width:965px) {
  .detail_item {
    gap: 40px;
    padding: 12px 0 2px;
  }
}


.detail_bold {
  width: 6.857142857142858vw;
  max-width: 96px;
  font-size: clamp(12px, 1vw, 14px);
  line-height: 1.5;
  font-weight: 700;
}

@media (max-width:1050px) {
  .detail_bold {
    width: 7.857142857142858vw;
  }
}

@media (max-width:925px) {
  .detail_bold {
    width: 8.857142857142858vw;
  }
}

@media (max-width:965px) {
  .detail_bold {
    font-size: 14px;
    width: 96px;
  }
}


.detail_thin {
  font-size: clamp(12px, 1vw, 14px);
  line-height: 1.5;
  font-weight: 500;
  max-width: 164px;
}

@media (max-width:1360px) {
  .detail_thin {
    max-width: 140px;
  }
}

@media (max-width:1200px) {
  .detail_thin {
    max-width: 110px;
  }
}

@media (max-width:965px) {
  .detail_thin {
    font-size: 14px;
    max-width: 144px;
    width: auto;
  }
}


.whisky_sale_container {
  margin-top: min(1.4285714285714286vw, 20px);
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 8px;
}

@media (max-width:965px) {
  .whisky_sale_container {
    text-align: center;
    margin-top: 16px;
    gap: 4px;
  }
}


.whisky_sale_container_list {
  display: flex;
}

.whisky_detail_text {
  font-size: clamp(12px, 1vw, 14px);
  line-height: 1;
  font-weight: 500;
  position: relative;
  padding-right: 8px;
  padding-left: 8px;
  border-right: 1px solid hsla(0, 0%, 29%, 1);
}

.whisky_sale_container_list .first {
  padding-left: 0;
  font-weight: 700;
}

.whisky_sale_container_list :last-child {
  padding-right: 0;
  border-right: none;

}

@media (max-width:965px) {
  .whisky_detail_text {
    font-size: 14px;
    text-align: left;
  }
}


.whisky_detail_text span {
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
}

.store_list_outSidelink {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(8px, 1.2857142857142856vw, 18px);
  margin-top: clamp(12px, 1.4285714285714286vw, 20px);
  padding: clamp(10px, 1vw, 14px) clamp(10px, 1vw, 14px) clamp(10px, 1vw, 14px) clamp(12px, 1.1428571428571428vw, 16px);
  font-size: clamp(12px, 1vw, 14px);
  color: hsla(0, 0%, 100%, 1);
  line-height: 1.5;
  font-weight: 500;
  border: 1px solid hsla(0, 0%, 29%, 1);
  background: hsla(0, 0%, 0%, 0);
  transition: .4s ease;
}

@media (max-width:1040px) {
  .store_list_outSidelink {
    gap: 4px;
  }
}

@media (max-width:965px) {
  .store_list_outSidelink {
    gap: 18px;
    margin-top: 16px;
    padding: 14px 14px 14px 16px;
    font-size: 14px;
  }
}


.store_list_outSidelink:hover {
  color: hsla(0, 0%, 0%, 1);
  background: hsla(0, 0%, 100%, 1);
}


.arrow {
  position: relative;
  width: clamp(10px, 1.4285714285714286vw, 20px);
  height: clamp(10px, 1.4285714285714286vw, 20px);
}

.arrow::before {
  content: "";
  display: block;
  position: absolute;
  top: 28%;
  right: 50%;
  translate: 50% -50%;
  width: 10px;
  height: 10px;
  border-top: 1px solid #FFFFFF;
  border-right: 1px solid #FFFFFF;
  transform: rotate(135deg);

  transition: .4s ease;
}

@media (max-width:768px) {
  .arrow {
    position: relative;
    width: 20px;
    height: 20px;
  }
}

.store_list_outSidelink:hover .arrow::before {
  border-top: 2px solid #1E1E1E;
  border-right: 2px solid #1E1E1E;
}

/* swiper */
@keyframes zoomUp {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(1.15);
  }
}



.swiper-slide-active .swiper-img.fv_pc,
.swiper-slide-duplicate-active .swiper-img.fv_pc,
.swiper-slide-prev .swiper-img.fv_pc {
  animation: zoomUp 12s linear 0s normal both;
  overflow: hidden;
}

.swiper-slide.fv_pc img {
  height: auto;
  width: 100%;
  height: 100vh;
}

@media (max-width:768px) {
  .swiper-slide.fv_pc img {
    width: 100%;
  }
}



/* collaboration */
h2 {
  font-family: "fot-tsukumin-pr6n", sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 32px;
  line-height: 1.5;
  letter-spacing: 0.04em;
  color: hsla(0, 0%, 100%, 1);
  text-align: center;
  position: relative;
}

h2 br {
  display: none;
}


@media (max-width:768px) {
  h2 {
    font-size: 24px;
  }

  h2 br {
    display: block;
  }
}

h2::after {
  position: absolute;
  content: "";
  background-color: hsla(0, 0%, 100%, 1);
  width: 80px;
  max-width: 80px;
  height: 1px;
  bottom: -28px;
  left: 50%;
  transform: translateX(-50%);
}

@media (max-width:768px) {
  h2::after {
    width: 60px;
    bottom: -24px;
  }
}

.common_text {
  line-height: 1.9;
}

.bg-gray {
  background: #ECECEC;
}

.bg-beige {
  background: #f8f8f3;
}

@media (max-width: 599px) {
  .mobile-hidden {
    display: none !important;
  }
}

.tablet-visible {
  display: none !important;
}

@media (min-width: 600px) {
  .tablet-visible {
    display: block !important;
  }
}

@media (min-width: 600px) {
  .tablet-visible-inline {
    display: inline !important;
  }
}

@media (min-width: 600px) {
  .tablet-visible-inlineBlock {
    display: inline-block !important;
  }
}

@media (min-width: 600px) {
  .tablet-visible-flex {
    display: flex !important;
  }
}

@media (min-width: 600px) {
  .tablet-hidden {
    display: none !important;
  }
}

.tablet-h-visible {
  display: none !important;
}

@media (min-width: 980px) {
  .tablet-h-visible {
    display: block !important;
  }
}

@media (min-width: 980px) {
  .tablet-h-visible-inline {
    display: inline !important;
  }
}

@media (min-width: 980px) {
  .tablet-h-visible-inlineBlock {
    display: inline-block !important;
  }
}

@media (min-width: 980px) {
  .tablet-h-visible-flex {
    display: flex !important;
  }
}

@media (min-width: 980px) {
  .tablet-h-hidden {
    display: none !important;
  }
}

.laptop-visible {
  display: none !important;
}

@media (min-width: 1200px) {
  .laptop-visible {
    display: block !important;
  }
}

@media (min-width: 1200px) {
  .laptop-visible-inline {
    display: inline !important;
  }
}

@media (min-width: 1200px) {
  .laptop-visible-inlineBlock {
    display: inline-block !important;
  }
}

@media (min-width: 1200px) {
  .laptop-visible-flex {
    display: flex !important;
  }
}

@media (min-width: 1200px) {
  .laptop-hidden {
    display: none !important;
  }
}

.monitor-visible {
  display: none !important;
}

.text-bold {
  font-weight: 700 !important;
}

.text-regular {
  font-weight: 300 !important;
}

.text-note {
  font-size: 0.875em;
}

.text-left {
  text-align: left !important;
}

.text-center {
  text-align: center !important;
}

.text-right {
  text-align: right !important;
}

.text-justify {
  text-align: justify !important;
}

.delay-1ms {
  animation-delay: 0.1s;
}

.delay-2ms {
  animation-delay: 0.2s;
}

.delay-3ms {
  animation-delay: 0.3s;
}

.delay-4ms {
  animation-delay: 0.4s;
}

.delay-5ms {
  animation-delay: 0.5s;
}

.delay-6ms {
  animation-delay: 0.6s;
}

.delay-7ms {
  animation-delay: 0.7s;
}

.delay-8ms {
  animation-delay: 0.8s;
}

.delay-9ms {
  animation-delay: 0.9s;
}

.delay-10ms {
  animation-delay: 1s;
}

.delay-11ms {
  animation-delay: 1.1s;
}

.delay-12ms {
  animation-delay: 1.2s;
}

.delay-13ms {
  animation-delay: 1.3s;
}

.delay-14ms {
  animation-delay: 1.4s;
}

.delay-15ms {
  animation-delay: 1.5s;
}

.delay-16ms {
  animation-delay: 1.6s;
}

.delay-17ms {
  animation-delay: 1.7s;
}

.delay-18ms {
  animation-delay: 1.8s;
}

.delay-19ms {
  animation-delay: 1.9s;
}

.delay-20ms {
  animation-delay: 2s;
}

.delay-21ms {
  animation-delay: 2.1s;
}

.delay-22ms {
  animation-delay: 2.2s;
}

.delay-23ms {
  animation-delay: 2.3s;
}

.delay-24ms {
  animation-delay: 2.4s;
}

.delay-25ms {
  animation-delay: 2.5s;
}

.delay-26ms {
  animation-delay: 2.6s;
}

.delay-27ms {
  animation-delay: 2.7s;
}

.delay-28ms {
  animation-delay: 2.8s;
}

.delay-29ms {
  animation-delay: 2.9s;
}

.delay-30ms {
  animation-delay: 3s;
}

.delay-31ms {
  animation-delay: 3.1s;
}

.delay-32ms {
  animation-delay: 3.2s;
}

.delay-33ms {
  animation-delay: 3.3s;
}

.delay-34ms {
  animation-delay: 3.4s;
}

.delay-35ms {
  animation-delay: 3.5s;
}

.delay-36ms {
  animation-delay: 3.6s;
}

.delay-37ms {
  animation-delay: 3.7s;
}

.delay-38ms {
  animation-delay: 3.8s;
}

.delay-39ms {
  animation-delay: 3.9s;
}

.delay-40ms {
  animation-delay: 4s;
}

.delay-41ms {
  animation-delay: 4.1s;
}

.delay-42ms {
  animation-delay: 4.2s;
}

.delay-43ms {
  animation-delay: 4.3s;
}

.delay-44ms {
  animation-delay: 4.4s;
}

.delay-45ms {
  animation-delay: 4.5s;
}

.delay-46ms {
  animation-delay: 4.6s;
}

.delay-47ms {
  animation-delay: 4.7s;
}

.delay-48ms {
  animation-delay: 4.8s;
}

.delay-49ms {
  animation-delay: 4.9s;
}

.delay-50ms {
  animation-delay: 5s;
}

.collaborationGlass {
  margin-bottom: 120px;
  padding-top: 120px;
}

@media (min-width: 980px) {
  .collaborationGlass {
    padding-top: 200px; /*140px;*/
  }
}

.collaborationGlass_title {
  margin-bottom: 100px;
}

@media (min-width: 980px) {
  .collaborationGlass_title {
    /*position: absolute;*/
    /*top: 60px;*/
    width: 100%;
    margin-bottom: 68px;
  }
}

@media (min-width: 980px) {
  .collaborationGlass_sticky {
    position: sticky;
    top: 0;
    height: 100vh;
    padding: 60px 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 0;
  }
}

.collaborationGlass_images {
  position: relative;
}

@media (max-width: 979px) {
  .collaborationGlass_images {
    display: none;
  }
}

.collaborationGlass_image {
  width: min(50vw, 800px); /*min(50.857142857vw, 800px);*/
  height: 85vh; /*55vh;*/
  inset: 0;
  opacity: 0;
  transition: opacity 1s ease;
}

.collaborationGlass_image:nth-child(n+2) {
  position: absolute;
  top: 0;
  left: 0;
}

.collaborationGlass_image.is-active {
  opacity: 1;
}

.collaborationGlass_image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.glassSituation {
  max-width: 480px;
  margin: 0 auto;
  padding-left: 35px;
  padding-right: 35px;
}

@media (min-width: 980px) {
  .glassSituation {
    height: 100vh;
    max-width: 1920px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center; /*flex-end;*/
    padding-left: 60px;
    padding-right: 75px;
    position: relative;
    z-index: 1;
  }
}

.glassSituation+.glassSituation {
  margin-top: 100px;
}

@media (min-width: 980px) {
  .glassSituation+.glassSituation {
    margin-top: 50vh;
  }
}

@media (max-width: 979px) {
  .glassSituation_info {
    margin-bottom: 32px;
    padding-bottom: 32px;
    border-bottom: 1px solid #4A4A4A;
  }
}

@media (min-width: 980px) {
  .glassSituation_info {
    flex: 0 0 20%;
    min-width: 250px;
  }
  .glassSituation_info_container {
    width: 250px;
    margin: 0 0 0 auto;
  }
}

.glassSituation_title {
  text-align: center;
  margin-bottom: 24px;
}

@media (min-width: 980px) {
  .glassSituation_title {
    text-align: left;
    margin-top: 3vw;
  }
}

.glassSituation_title .ja {
  font-family: "fot-tsukumin-pr6n", serif;
  font-weight: 300;
  letter-spacing: 0.04em;
  font-size: 1.75rem;
}

@media (min-width: 980px) {
  .glassSituation_title .ja {
    font-size: 2.25rem;
  }
}

.glassSituation_title .en {
  font-family: "eb-garamond", serif;
  font-weight: 400;
  font-size: 0.875rem;
}

@media (min-width: 980px) {
  .glassSituation_title .en {
    font-size: 1rem;
  }
}

.glassSituation_img {
  margin-left: -35px;
  margin-right: -35px;
  margin-bottom: 24px;
}

@media (min-width: 980px) {
  .glassSituation_img {
    display: none;
  }
}

.glassSituation_desc {
  text-align: justify;
  line-height: 2;
}
@media (min-width: 980px) {
  .glassSituation_desc {
    margin-bottom: 24px;
  }
}

.glassSituation_point {
  text-align: center;
}

@media (min-width: 980px) {
  .glassSituation_point {
    text-align: left;
  }
}

.glassSituation_item {
  text-align: center;
}

@media (min-width: 980px) {
  .glassSituation_item {
    flex: 0 0 21.5%;
    min-width: 260px;
  }
  .glassSituation_item_container {
    width: 260px;
    margin: 0 auto 0 0;
  }
}

.glassSituation_glass {
  margin-bottom: 16px;
}

.glassSituation_glass img {
  display: inline-block;
  vertical-align: bottom;
  width: auto;
  height: 250px;
}

@media (min-width: 980px) {
  .glassSituation_glass img {
    height: min(14vw, 300px);
  }
}

.glassSituation_name {
  font-family: "fot-tsukumin-pr6n", serif;
  font-weight: 300;
  letter-spacing: 0.04em;
  font-size: 1.25rem;
}

@media (min-width: 980px) {
  .glassSituation_name {
    font-size: 1.5rem;
  }
}



/* モーダル */


.modal_btn {
  padding: 6px 8px 6px 16px;
  max-width: 102px;
  font: optional;
  border: 1px solid hsla(0, 0%, 29%, 1);
  border-radius: 20px;
  background: hsla(0, 0%, 0%, 0);
  transition: opacity .4s ease;
}

@media (max-width:768px) {
  .modal_btn {
    background: hsla(0, 0%, 100%, 1);
  }
}


@media (max-width:768px) {
  .modal_btn {
    margin: 24px auto 32px;
  }
}

@media (max-width:768px) {
  .modal_btn.twice {
    order: 4;
  }
}

@media (max-width:768px) {
  .modal_btn.highball {
    order: 9;
  }
}

@media (max-width:768px) {
  .modal_btn.rocks {
    order: 14;
  }
}

.modal_btn:hover {
  background: hsla(0, 0%, 100%, 1);
}

.collaboration_modal_open {
  max-width: 78px;
  display: flex;
  gap: 10px;
  align-items: center;
}

.modal_open_text {
  color: hsla(0, 0%, 100%, 1);
  font-size: clamp(12px, 1.0714285714285714vw, 15px);
  line-height: 1.5;
  font-weight: 500;
  max-width: 46px;
}

@media (max-width:768px) {
.modal_open_text {
    color: hsla(0, 0%, 0%, 1);
  }
}

.modal_btn:hover .modal_open_text {
  color: hsla(0, 0%, 0%, 1);
}

.modal_plus_btn {
  display: inline-block;
  border: 1px solid hsla(0, 0%, 100%, 1);
  border-radius: 50%;
  width: 20px;
  height: 20px;
  position: relative;
}

@media (max-width:768px) {
.modal_plus_btn {
    background: hsla(0, 0%, 100%, 1);
    border: 1px solid hsla(0, 0%, 0%, 1);
  }
}

/* プラスボタン */
.modal_btn:hover .modal_plus_btn {
  border: 1px solid hsla(0, 0%, 0%, 1);
  background: hsla(0, 0%, 100%, 1);
}

.modal_plus_btn::before,
.modal_plus_btn::after {
  content: '';
  display: inline-block;
  position: absolute;
  top: 8px;
  left: 4.5px;
  width: 9px;
  height: 1px;
  background-color: hsla(0, 0%, 100%, 1);
}

.modal_btn:hover .modal_plus_btn::before {
  background-color: hsla(0, 0%, 0%, 1);
}

.modal_btn:hover .modal_plus_btn::after {
  background-color: hsla(0, 0%, 0%, 1);
}

@media (max-width:768px) {
  .modal_plus_btn::before {
    background-color: hsla(0, 0%, 0%, 1);
  }

  .modal_plus_btn::after {
    background-color: hsla(0, 0%, 0%, 1);
  }
}

.modal_plus_btn::after {
  transform: rotate(90deg);
}

.collaboration_modal_content p {
  color: hsla(0, 0%, 12%, 1);
}

.modal_title {
  font-family: "fot-tsukumin-pr6n", sans-serif;
  font-size: clamp(16px, 1.7142857142857144vw, 24px);
  font-weight: 300;
  line-height: 1.6;
  text-align: center;
}

@media (max-width:768px) {
  .modal_title {
    font-size: 24px;
    line-height: 1.5;
  }
}

.modal_text {
  font-size: clamp(10px, 1.0714285714285714vw, 15px);
  font-weight: 500;
  line-height: 2;
  margin-top: min(1.7142857142857144vw, 24px);
  text-align: left;
}

@media (max-width:768px) {
  .modal_text {
    font-size: 14px;
  }
}

/* ------collaboration_modal css------ */
.collaboration_modal_wrapper {
  position: fixed;
  display: flex;
  align-items: center;
  width: 100%;
  height: 100vh;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: auto;
  border: none;
  opacity: 0;
  z-index: -1;
  pointer-events: none;
}

.collaboration_modal_wrapper.rocks {
  top: 101.16927083%;
}

/* モーダルの箱 */
.collaboration_modal_window {
  width: min(56.49999999999999vw, 791px);
  height: min(31.428571428571427vw, 440px);
  margin: auto;
  border-radius: 8px;
  background: #fff;
  z-index: 1;
  overflow-y: hidden;
}

@media (max-width:768px) {
  .collaboration_modal_window {
    width: 358px;
    height: 418px;
  }
}

.collaboration_modal_content {
  padding: min(9.142857142857142vw, 128px) min(10.428571428571429vw, 146px);
}

@media (max-width:768px) {
  .collaboration_modal_content {
    padding: 80px 60px;
  }
}

/* モーダル 背景の影 */
.collaboration_modal_mask {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.7);
}

/* close button */
.collaboration_modal_close {
  z-index: 300;
  position: absolute;
  top: 16px;
  right: 28px;
  cursor: pointer;
}

.collaboration_modal_close span {
  display: block;
  position: relative;
  width: 48px;
  height: 48px;
  pointer-events: all;
}

.collaboration_modal_close span::before,
.collaboration_modal_close span::after {
  /* 共通設定 */
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 50px;
  /* 棒の幅（太さ） */
  height: 1px;
  /* 棒の高さ */
  background: hsla(0, 0%, 12%, 1);
}

@media (max-width:768px) {

  .collaboration_modal_close span::before,
  .collaboration_modal_close span::after {
    /* 共通設定 */
    top: 15%;
    left: 75%;
  }
}

.collaboration_modal_close span::before {
  transform: translate(-50%, -50%) rotate(15deg);
}

.collaboration_modal_close span::after {
  transform: translate(-50%, -50%) rotate(-15deg);
}

.collaboration_modal_close:hover {
  color: hsla(0, 0%, 12%, 1);
  transition: all .5s;
}

html.is_open,
body.is_open {
  overflow: hidden;
}

.collaboration_modal_wrapper.is_open {
  animation: collaboration_modal_wrapper_open .5s ease forwards;
}

.collaboration_modal_wrapper.is_open .collaboration_modal_window {
  animation: collaboration_modal_window_open .5s ease forwards;
}

.collaboration_modal_wrapper.is_close {
  animation: collaboration_modal_wrapper_close .5s ease forwards;
}

.collaboration_modal_wrapper.is_close .collaboration_modal_window {
  animation: collaboration_modal_window_close .5s ease forwards;
}

@keyframes collaboration_modal_wrapper_open {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
    z-index: 300;
  }
}

@keyframes collaboration_modal_window_open {
  0% {
    opacity: 0;
    transform: translateY(-30px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes collaboration_modal_wrapper_close {
  0% {
    z-index: 300;
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes collaboration_modal_window_close {
  0% {
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    transform: translateY(-30px);
    opacity: 0;
  }
}

/* グラスモーダル */
/* グラスモーダルボタン */
.modal_btn.glass {
  margin: 20px auto 0;
  display: block;
  padding: 6px 8px 6px 16px;
}

/* グラスモーダル中身 */
.collaboration_modal_window.glass {
  width: min(64.14285714285714vw, 898px);
  height: min(42.857142857142854vw, 600px);
}

@media (max-width:920px) {
  .collaboration_modal_window.glass {
    width: min(63.69565217391304vw, 586px);
    height: min(33.69565217391305vw, 310px);
  }
}

@media (max-width:768px) {
  .collaboration_modal_window.glass {
    width: 358px;
    height: 558px;
  }
}

.collaboration_modal_content.glass {
  padding: min(3.571428571428571vw, 50px) min(3.571428571428571vw, 50px) min(3.571428571428571vw, 50px) min(20.142857142857142vw, 282px);
}

@media (max-width:768px) {
  .collaboration_modal_content.glass {
    padding: 20px 60px 40px;
  }
}

.modal_content_glass {
  display: flex;
  gap: clamp(12px, 1.6428571428571428vw, 23px);
  align-items: end;
}

@media (max-width:768px) {
  .modal_content_glass {
    flex-direction: column;
    align-items: center;
  }
}

.modal_glass_img {
  width: min(23.785714285714285vw, 333px);
}

@media (max-width:768px) {
  .modal_glass_img {
    width: 200px;
  }
}

.modal_glass_img picture img {
  width: 100%;
}

.modal_content_text {
  display: flex;
  flex-direction: column;
  gap: clamp(4px, 0.8571428571428572vw, 12px);
  margin-bottom: clamp(4px, 1.4285714285714286vw, 20px);
}

@media (max-width:768px) {
  .modal_content_text {
    margin-bottom: 0;
    gap: 12px;
  }
}

.modal_title.glass {
  font-size: clamp(14px, 1.7142857142857144vw, 24px);
  font-weight: 500;
  letter-spacing: 0.04em;
  line-height: 1.5;
  text-align: left;
}

@media (max-width:768px) {
  .modal_title.glass {
    font-size: 24px;
  }
}

.modal_glass_price,
.modal_glass_release {
  font-size: clamp(10px, 0.9285714285714286vw, 13px);
  line-height: 1;
  font-weight: 500;
  text-align: left;
}

@media (max-width:768px) {

  .modal_glass_price,
  .modal_glass_release {
    font-size: 13px;
  }
}


.modal_text.glass {
  font-size: clamp(10px, 0.9285714285714286vw, 13px);
  line-height: 1.6;
  font-weight: 500;
  max-width: 210px;
  margin-top: 0;
}

@media (max-width:920px) {
  .modal_text.glass {
    max-width: 250px;
  }
}

@media (max-width:830px) {
  .modal_text.glass {
    max-width: 275px;
  }
}

@media (max-width:785px) {
  .modal_text.glass {
    max-width: 290px;
  }
}

@media (max-width:768px) {
  .modal_text.glass {
    max-width: 238px;
    font-size: 13px;
  }
}

/* モーダルここまで */


/* takibi */
/* roop swiper */
.swiper.takibi {
  margin: max(5.285714285714286vw, 74px) 0 max(7.142857142857142vw, 240px);
}

@media (max-width:768px) {
  .swiper.takibi {
    margin: 0 0 120px;
  }
}

.swiper-slide.takibi {
  width: 1886px;
  height: 80px;
}

@media (max-width:768px) {
  .swiper-slide.takibi {
    width: 1179px;
    height: 50px;
  }
}

.swiper-slide.takibi img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}


/* スライドの動き等速 */
.swiper-wrapper.takibi {
  transition-timing-function: linear;
}



.takibi_img {
  padding: 0 60px;
  padding: 0 max(4.285714285714286vw, 60px);
}

@media (max-width:768px) {
  .takibi_img {
    padding: 0;
  }
}

.takibi_text {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: clamp(16px, 2.857142857142857vw, 40px);
  margin-top: -20px;
}

@media (max-width:768px) {
  .takibi_text {
    align-items: center;
    margin-top: -12px;
  }
}

.takibi_title {
  display: flex;
  flex-direction: column;
  gap: clamp(8px, 0.8571428571428572vw, 12px);
}

.takibi_title p {
  font-family: "fot-tsukumin-pr6n", sans-serif;
  font-weight: 550;
  font-size: clamp(16px, 1.7142857142857144vw, 24px);
  line-height: 1.5;
}

@media (max-width:768px) {
  .takibi_title p {
    font-size: 14px;
  }
}

.takibi_title h2 {
  font-family: "fot-tsukumin-pr6n", sans-serif;
  font-size: clamp(32px, 3.428571428571429vw, 48px);
  font-weight: 550;
  line-height: 1.5;
}

@media (max-width:768px) {
  .takibi_title h2 {
    font-size: 32px;
  }
}

.takibi_title h2::after {
  display: none;
}

.takibi_text_bottom {
  font-size: clamp(10px, 1.1428571428571428vw, 16px);
  line-height: 2;
  font-weight: 500;
}

@media (max-width:768px) {
  .takibi_text_bottom {
    font-size: 14px;
    line-height: 1.75;
    max-width: 400px;
  }
}

@media (max-width:440px) {
  .takibi_text_bottom {
    max-width: 300px;
  }
}

.campaign_container {
  display: flex;
  flex-direction: column;
  background: hsla(0, 0%, 17%, 1);
  border-radius: 8px;
  max-width: 700px;
  margin: 60px auto 0;
}

@media (max-width:768px) {
  .campaign_container {

    max-width: 400px;
    margin: 24px auto 0;
  }
}

@media (max-width:390px) {
  .campaign_container {
    max-width: 350px;
  }
}

.campaign_top {
  padding: 48px 82px 44px;
}

@media (max-width:768px) {
  .campaign_top {
    padding: 36px 25px 32px;
  }
}

.campaign_detail {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
}

.white_box {
  color: hsla(0, 0%, 12%, 1);
  font-weight: 700;
  font-size: 16px;
  line-height: 1.5;
  background: hsla(0, 0%, 100%, 1);
  border-radius: 4px;
  padding: 4px 12px;
}

@media (max-width:768px) {
  .white_box {
    font-size: 14px;
    position: relative;
    z-index: 99;
  }
}

.campaign_detail_container {
  display: flex;
  flex-direction: column;
  gap: 24px;
}



.campaign_detail_text {
  text-align: center;
  display: block;
  font-size: 20px;
  line-height: 1.75;
  font-weight: 500;
}


@media (max-width:768px) {
  .campaign_detail_text {
    font-size: 18px;
  }
}

br.sp {
  display: none;
}

@media (max-width:768px) {
  br.sp {
    display: block;
  }
}



.campaign_detail_text_container span {
  margin-top: 12px;
  font-size: 12px;
  line-height: 1.75;
  font-weight: 500;
  position: relative;
}

@media (max-width:768px) {
  .campaign_detail_text_container span {
    margin-top: 4px;
  }

}

.campaign_detail_text_container span::before {
  position: absolute;
  content: "※";
  width: 12px;
  height: 12px;
  top: -3px;
  left: -12px;
}

.campaign_detail_text.apply {
  font-size: 15px;
}

.campaign_detail_text.apply span {
  font-size: 13px;
  line-height: 1.5;
}

@media (max-width:768px) {
  .campaign_detail_text.apply {
    font-size: 16px;
    max-width: 330px;
  }
}

@media (max-width:375px) {
  .campaign_detail_text.apply {
    font-size: 15px;
  }
}


.sp {
  display: none;
}

@media (max-width:768px) {
  .sp {
    display: block;
  }
}

.application_container {
  display: flex;
  gap: 22px;
  align-items: end;
  padding: 24px;
  border: 1px solid hsla(0, 0%, 27%, 1);
  border-radius: 8px;
  max-width: 433px;
  margin: 16px auto 0;
}

@media (max-width:768px) {
  .application_container {
    justify-content: center;
    padding: 20px;
  }
}

.qr_img {
  max-width: 80px;
  max-height: 80px;
}

@media (max-width:768px) {
  .qr_img {
    display: none;
  }
}

.application_name {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 12px;
}

@media (max-width:768px) {
  .application_name {
    justify-content: center;
  }
}

.application_name img {
  max-width: 60px;
}

.application_name p {
  font-size: 20px;
  line-height: 1.5;
  font-weight: 700;
}

@media (max-width:768px) {
  .application_name p {
    font-size: 16px;
    line-height: 1.6;

  }
}

.application_link_container {
  display: flex;
  gap: 8px;
  align-items: center;
}

@media (max-width:768px) {

  .application_link_container {
    gap: 4px;
  }
}

.application_link_container a {
  transition: opacity .4s ease;
}

.application_link_container a:hover {
  opacity: 0.6;
}

.application_link_container a img {
  max-width: 135px;
}

.present {
  background: hsla(0, 0%, 27%, 1);
  display: flex;
  justify-content: space-between;
  gap: 50px;
  padding: 40px;
  width: 100%;
  border-radius: 0 0 8px 8px;
}

@media (max-width:768px) {
  .present {
    flex-direction: column-reverse;
    align-items: center;
    gap: 0;
    padding: 36px 26px;
  }
}

@media (max-width:768px) {
  .present_text_container {
    margin-top: -12px;
  }
}

.present_detail {
  margin-bottom: 40px;
}

@media (max-width:768px) {
  .present_detail {
    text-align: center;
    margin-bottom: 20px;
  }
}

.present_detail p {
  font-weight: 700;
  font-size: 20px;
  line-height: 1.5;
  margin-top: 12px;
  display: block;
}

@media (max-width:768px) {
  .present_detail p {
    font-size: 16px;
    line-height: 1.6;
  }
}

.memory {
  margin-top: 40px;
}

@media (max-width:768px) {
  .memory {
    text-align: center;
    margin-top: 20px;
  }
}

.memory_title {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  padding: 6px 12px;
  border: 1px solid hsla(0, 0%, 100%, 1);
  border-radius: 18px;
  margin-bottom: 12px;
  display: block;
  text-align: center;
  max-width: 197px;
}

@media (max-width:768px) {
  .memory_title {
    display: inline;
    font-size: 14px;
    max-width: 181px;
  }
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;

}

@media (max-width:768px) {
  ul {
    margin-top: 12px;
  }
}

.memory_list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.memory_list li {
  font-size: 15px;
  line-height: 1.5;
  font-weight: 500;
  padding-left: 16px;
  position: relative;
}

@media (max-width:768px) {
  .memory_list li {
    text-align: left;
    font-size: 14px;
    padding-left: 16px;
  }
}

.memory_list li:before {
  content: "";
  width: 4px;
  height: 4px;
  background: hsla(0, 0%, 100%, 1);
  border-radius: 50%;
  position: absolute;
  top: 10px;
  left: 4px;
}

@media (max-width:768px) {
  .memory_list li:before {
    left: 8px;
    top: 7px;
  }
}

.present_whisky_img {
  max-width: 198px;
}

/* buy */
.buy {
  padding: 236px 0 214px;
  padding: max(16.857142857142858vw, 236px) 0 max(15.285714285714286vw, 214px);
}

@media (max-width:768px) {
  .buy {
    padding: 120px 0 80px;
  }
}

.store_list_container {
  margin: max(6.2857142857142865vw, 88px) auto 0;
  max-width: 1117px;
}

@media (max-width:768px) {
  .store_list_container {
    margin: 56px auto 0;
    max-width: 500px;
  }
}

@media (max-width:455px) {
  .store_list_container {
    max-width: 380px;
  }
}

.region_list {
  display: flex;
  gap: clamp(4px, 1.4285714285714286vw, 20px);
  align-items: center;
  background: hsla(0, 0%, 17%, 1);
  border-radius: 4px;
  padding: 12px min(4.285714285714286vw, 64px);
  width: 100%;
  flex-wrap: wrap;
  justify-content: center;
}

@media (max-width:768px) {
  .region_list {
    padding: 16px 10px;
    gap: 8px;
    justify-content: center;
    margin: 64px auto 0;
  }
}



.region_list a {
  display: flex;
  gap: 4px;
  align-items: center;
  color: hsla(0, 0%, 100%, 1);
  line-height: 1.5;
  font-size: 16px;
  font-weight: 500;
  transition: opacity .4s ease;
}


.region_list a:hover {
  opacity: 0.6;
}

@media (max-width:768px) {
  .region_list a {
    gap: 2px;
  }
}

.region_list a img {
  max-width: 24px;
}

@media (max-width:768px) {
  .region_list a img {
    max-width: 16px;/
  }
}

.region {
  margin-top: min(4.285714285714286vw, 60px);
}

@media (max-width:768px) {
  .region {
    margin-top: 40px;
  }
}

.region h3 {
  font-weight: 500;
  font-size: clamp(16px, 1.4285714285714286vw, 20px);
  line-height: 1.5;
  color: hsla(0, 0%, 100%, 1);
  width: 100%;
  border-bottom: 1px solid hsla(0, 0%, 100%, 1);
  padding-bottom: 16px;
}

@media (max-width:768px) {
  .region h3 {
    font-weight: 500;
    font-size: 16px;
    line-height: 1.5;
    padding-bottom: 8px;
  }
}

.store_detail {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: min(1.7142857142857144vw, 24px) min(1.4285714285714286vw, 20px);
  border-bottom: 1px solid hsla(0, 0%, 29%, 1);
}

@media (max-width:768px) {
  .store_detail {
    flex-direction: column;
    gap: 8px;
    padding: 24px 8px 20px;
    align-items: flex-start;
  }
}

.store_name_link {
  max-width: 318px;
  width: 22.857142857142858vw;
  text-decoration: underline;
  color: hsla(0, 0%, 100%, 1);
  transition: opacity .4s ease;
}

.store_name_link:hover {
  opacity: 0.6;
}

@media (max-width:768px) {
  .store_name_link {
    max-width: none;
    width: 100%;
  }
}

.store_name_link p {
  font-size: clamp(12px, 1.0714285714285714vw, 15px);
  line-height: 1.5;
  font-weight: 700;
}

@media (max-width:768px) {
  .store_name_link p {
    font-size: 14px;
  }
}

.store_name_link p span {
  display: inline-block;
  position: relative;
  top: 2px;
  width: 16px;
  height: 16px;
}

.address_container {
  display: flex;
  gap: clamp(20px, 1.1428571428571428vw, 40px);
  align-items: center;
}

@media (max-width:768px) {
  .address_container {
    flex-direction: column;
    align-items: baseline;
    gap: 8px;
    width: 100%;
  }
}

.address {
  text-decoration: none;
  pointer-events: none;
  color: hsla(0, 0%, 100%, 1);
  font-size: clamp(12px, 1.0714285714285714vw, 15px);
  line-height: 1.5;
  font-weight: 500;
  max-width: 515px;
  width: min(36.78571428571429vw, 515px);
}

@media (max-width:768px) {
  .address {
    width: auto;
    font-size: 12px;
  }
}

.access {
  font-size: clamp(12px, 1.0714285714285714vw, 15px);
  color: hsla(0, 0%, 100%, 1);
  line-height: 1.5;
  font-weight: 500;
  width: 120px;
  text-align: left;
  text-decoration: none;
  pointer-events: none;
}

@media (max-width:768px) {
  .access {
    font-size: 14px;
  }
}


/* footer */
footer {
  border-top: 1px solid hsla(0, 0%, 29%, 1);
  padding: 90px 0 44px;
}

@media (max-width:768px) {
  footer {
    padding: 40px 0 28px;
  }
}

.back_to_top_btn {
  display: flex;
  gap: 8px;
  max-width: 128px;
  margin: 0 auto;
  color: hsla(0, 0%, 100%, 1);
  align-items: center;
  transition: opacity .4s ease;
}

.back_to_top_btn:hover {
  opacity: 0.6;
}

.back_to_top_btn img {
  width: 20px;
  height: 20px;
}

.back_to_top_btn span {
  font-size: 15px;
  line-height: 1;
  font-weight: 500;
  text-box-trim: trim-both;
}

@media (max-width:768px) {
  .back_to_top_btn span {
    font-size: 14px;
    line-height: 1;
    font-weight: 500;
    white-space: nowrap;
  }
}

.footer_logo {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 80px auto 60px;
}

@media (max-width:768px) {
  .footer_logo {
    margin: 32px auto;
    max-width: none;
  }
}

.footer_nagahama_logo {
  width: min(13.714285714285715vw, 192px);
  transition: opacity .4s ease;
}

.footer_nagahama_logo:hover {
  opacity: 0.6;
}

@media (max-width:768px) {
  .footer_nagahama_logo {
    width: 24.615384615384617vw;
  }
}

.footer_center_img {
  width: min(12.071428571428571vw, 169px);

}

@media (max-width:768px) {
  .footer_center_img {
    width: 21.794871794871796vw;

  }
}

.footer_snowpeak_logo {
  transition: opacity .4s ease;
  width: min(13.714285714285715vw, 192px);
}

@media (max-width:768px) {
  .footer_snowpeak_logo {
    transition: opacity .4s ease;
    width: 24.615384615384617vw;
  }
}

.footer_snowpeak_logo:hover {
  opacity: 0.6;
}

.attention {
  display: flex;
  margin: 0 auto;
  max-width: 917px;
  width: 65.5vw;
  margin-bottom: 40px;
}

@media (max-width:930px) {
  .attention {
    max-width: 612px;
    width: auto;
  }
}


@media (max-width:768px) {
  .attention {
    flex-direction: column;
  }
}

.attention li {
  list-style-type: none;
  font-size: clamp(10px, 1.0714285714285714vw, 15px);
  line-height: 1.5;
  font-weight: 500;
  padding: 0 24px;
  padding: 0 16px;
  padding: 0 clamp(8px, 1.1428571428571428vw, 16px);
  border-left: 1px solid hsla(0, 0%, 29%, 1);
  border-right: 1px solid hsla(0, 0%, 29%, 1);
}

@media (max-width:768px) {
  .attention li {
    font-size: 12px;
    font-weight: 500;
    border: none;
    border-left: none;
    border-right: none;
    margin: 0 auto;
    padding: 12px 0;
    position: relative;
  }

  .attention li::after {
    position: absolute;
    content: "";
    background-color: hsla(0, 0%, 29%, 1);
    width: 16px;
    height: 1px;
    bottom: -0px;
    left: 50%;
    transform: translateX(-50%);
  }
}

@media (max-width:375px) {
  .attention li {
    font-size: 10px;
    white-space: nowrap;
  }
}

.attention li:first-child {
  border-left: none;
}

.attention li:last-child {
  border-right: none;
}

@media (max-width:768px) {
  .attention li:last-child::after {
    display: none;
  }
}

small {
  font-size: 12px;
  line-height: 1;
  font-weight: 500;
  display: block;
  text-align: center;
}

@media (max-width:768px) {
  small {
    font-size: 10px;
    display: block;
    text-align: center;
  }
}

/* PCブラウザデフォルトのスムーススクロール無効化 */
@media (pointer: fine) {
  :where(html, body),
  :where([data-scroll-container], .scroll-container, .overflow-auto, .overflow-y-auto) {
    scroll-behavior: auto !important;
  }
}