@charset "UTF-8";
/*---------------------
セクション名
----------------------*/

.top #event {
  scroll-margin-top: -4px;
}
.mv {
  position: relative;
  margin-top: 70px;
}
.top .mv .mv-slider {
  position: relative;
}
.top .mv .mv-slider .text01 {
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 1;
}
.top .mv .mv-slider .text02 {
  position: absolute;
  bottom: 40px;
  left: 30px;
  z-index: 1;
}
.top .mv .slide-container {
  position: relative;
  width: 750px;
  height: 1100px;
  overflow: hidden;
}
.top .mv .slide-container .slide {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 1s;
}
.top .mv .slide-container .slide.active {
  opacity: 1;
}
.top .mv .slide-container .slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.top .mv .slide-container .slide:nth-child(2) {
  width: 900px;
}

/* 1枚目：ゆっくりスケールアニメーション */
.top .mv .slide-container .slide:nth-child(1) img {
    animation: upSlowScale 12s infinite;
}

@keyframes upSlowScale {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(1.15);
    }
}

/* 2枚目：右から左にゆっくり移動 */
.top .mv .slide-container .slide:nth-child(2) img {
    animation: slideRightToLeft 12s 4s infinite;
    width: 850px;
    height: auto;
}

@keyframes slideRightToLeft {
    0% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(-10%);
    }
}

/* 3枚目：ゆっくりスケールアニメーション */
.top .mv .slide-container .slide:nth-child(3) img {
    animation: downSlowScale 12s 8s infinite;
}

@keyframes downSlowScale {
    0% {
        transform: scale(1.15);
    }
    100% {
        transform: scale(1);
    }
}





.top .mv .btn01 {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: -300px 0 0;
}

.top .contents .btn02 {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: -100px 0 0;
}

.top .contents .btn03 {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: -330px 0 0;
}

.top .mv .btn04 {
    position: absolute;
    margin: -300px 30px 0;
}

.top .mv .btn05 {
    position: absolute;
    left: 265px;
    margin: -300px 0 0;
}

.top .mv .btn06 {
    position: absolute;
    margin: -300px 500px 0;
}

.top .contents .btn07 {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: -250px 0 0;
}
.top .contents .btn08 {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: -560px 0 0;
}
.top .contents .btn09 {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: -405px 0 0;
}
.top .contents .btn10 {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: -250px 0 0;
}


.fashion .contents .has_btn_box-0 {
  width: 750px;
  padding: 0px 0;
  background: url(https://www.jr-takashimaya.co.jp/cn/cp/2025a-anniversary/assets/img/fashion/contents02.jpg) no-repeat top center/cover;
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
}

.fashion.contents .has_btn_box-0 li {
  transition: all 0.3s;
}
.fashion.contents .has_btn_box-0 li:hover {
  filter: brightness(1.1);
}
.fashion.contents .has_btn_box-0 .deco {
  pointer-events: none;
}

/*---------------------
Modal
----------------------*/
.modal-thumbnails li {
  cursor: pointer;
}
.modal-container {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1099;
  inset: 0;
  display: none;
  transition: opacity 0.5s ease, visibility 0.5s ease;
  background: rgba(0 0 0 /60%);
  -webkit-overflow-scrolling: touch;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
.modal-container.active {
  display: flex;
}
.modal-container .mask {
  position: absolute;
  inset: 0;
  z-index: 0;
  cursor: pointer;
}
.modal-container .inner {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: white;
  width: 750px;
  position: relative;
  z-index: 1;
}
.modal-container .inner .btn-close {
  width: 70px;
  aspect-ratio: 1/1;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 10;
  background: url(https://www.jr-takashimaya.co.jp/cn/cp/2025a-anniversary/assets/img/common/ico-close.svg) no-repeat center center/20px auto;
}
.modal-container .modal-slider {
  width: 750px;
  position: relative;
  width: 100%;
  overflow: hidden;
  padding-bottom: 130px;
}
.modal-container .splide__slide {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  z-index: 1;
  width: 750px;
  height: 80svh;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: none;
  transition: opacity 0.5s 0.1sease;
}
.modal-container .splide__slide.modal-weston .wrap {
  position: relative;
}
.modal-container .splide__slide.modal-weston .wrap a {
  position: absolute;
  display: block;
  bottom: 168px;
  left: 263px;
  width: 157px;
  height: 34px;
}
.modal-container .splide__slide a {
  transition: opacity 0.3s;
}
.modal-container .splide__slide a:hover {
  opacity: 0.5;
}
.modal-container .modal__scrolltxt,
.modal-container .splide__arrow {
  font-family: Helvetica, Arial, sans-serif;
}
.modal-container .splide__arrow {
  top: auto;
  bottom: 20px;
  background: none;
  font-size: 20px;
  color: #000;
  opacity: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: opacity 0.3s;
  outline: none;
}
.modal-container .splide__arrow:hover {
  opacity: 0.6;
}
.modal-container .splide__arrow--prev {
  left: 70px;
}
.modal-container .splide__arrow--next {
  right: 70px;
}
.modal-container .splide__arrow--prev:before,
.modal-container .splide__arrow--next:after {
  content: "";
  display: block;
  flex: 0 0 12px;
  margin-top: -2px;
  aspect-ratio: 1/1;
  border-top: 2px solid #000;
  border-left: 2px solid #000;
}
.modal-container .splide__arrow--prev:before {
  transform: rotate(-45deg);
}
.modal-container .splide__arrow--next:after {
  transform: rotate(135deg);
}
.modal-container .scroll {
  position: absolute;
  left: 50%;
  bottom: 5px;
  z-index: 3;
  transform: translateX(-50%);
  width: 60px;
  height: 50px;
  transition: opacity 0.5s ease;
}
.modal-container .scroll.hide {
  opacity: 0;
}
.modal-container .scroll span {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -30px;
  opacity: 0;
  color: #000;
  font-size: 22px;
  letter-spacing: 0.05em;
  animation: txtmove 1.4s ease-in-out infinite;
  opacity: 0;
}
.modal-container .scroll::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 24px;
  aspect-ratio: 24 / 14;
  background: url(https://www.jr-takashimaya.co.jp/cn/cp/2025a-anniversary/assets/img/common/ico-scroll.svg) no-repeat center / contain;
  animation: pathmove01 1.4s ease-in-out infinite;
  opacity: 0;
}

@keyframes pathmove01 {
  0% {
    top: 0;
    opacity: 0;
  }

  30% {
    opacity: 1;
  }

  100% {
    top: 30px;
    opacity: 0;
  }
}
@keyframes txtmove {
  0%,
  100% {
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
}
/*------------------------
モーダル内のリンク
-------------------------*/
.link30 a {
  background: #fff;
  position: absolute;
  height: 40px;
  width: 200px;
  top: 1343px;
  left: 70px;
  opacity: 0;
}

/* 子スライダー専用スタイル */
.child-slider-container {
  width: 100%;
  margin: 0 auto;
  position: relative;
}

.child-slider {
  margin-inline: auto;
  max-width: 650px;
}

.child-slider .splide__slide {
  height: auto !important;
  overflow: visible !important;
  padding: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

.child-slider .splide__slide img {
  width: 100%;
  height: auto;
}

/* 子スライダーのページネーション */
.child-slider .splide__pagination__page {
  background: #fff;
  border: 1px solid #7e7e7f;
  width: 20px;
  height: 20px;
  margin: 0;
  border-radius: 50%;
  transition: all 0.3s ease;
  cursor: pointer;
}
.child-slider .splide__pagination__page:hover {
  background: #7e7e7f;
  transform: scale(1);
}

.child-slider .splide__pagination__page.is-active {
  background: #7e7e7f;
  transform: scale(1);
}
.child-slider .splide__pagination {
  bottom: auto !important;
  top: auto !important;
  position: relative !important;
  display: flex !important;
  justify-content: center !important;
  gap: 20px !important;
  margin: 25px 0 15px 0 !important;
  padding: 0 !important;
}

/* 子スライダーのサムネイル */
.child-thumbnails {
  display: flex;
  justify-content: flex-end;
  gap: 15px;
  margin-top: 15px;
  list-style: none;
  padding: 0;
  margin-inline: auto;
  max-width: 650px;
}

.child-thumbnails li {
  cursor: pointer;
  border-radius: 0;
  transition: all 0.3s ease;
}

.child-thumbnails li:hover {
  opacity: 1;
  transform: translateY(0);
}

.child-thumbnails li.active {
  opacity: 1;
}

.child-thumbnails img {
  width: 156px;
  height: 156px;
  display: block;
  border-radius: 0;
}

/* ↓アコーディオン */
.grid-accordion > button {
  position: relative;
  width: 100%;
	border: initial;
}
.grid-accordion > button::after {
  content: "";
  position: absolute;
  bottom: 30px;
  left: 50%;
  width: 52px;
  aspect-ratio: 26 / 15;
  background: url("https://www.jr-takashimaya.co.jp/cn/cp/2025a-anniversary/assets/img/top/arrow01.png") no-repeat center center / contain;
  transform: translateX(-50%) rotate(180deg);
  transition: transform 0.5s;
}
.grid-accordion button {
  cursor: pointer;
}
.grid-accordion > button.is-open-button::after {
  transform: translateX(-50%) rotate(0deg);
  transition: transform 0.5s;
}
.grid-accordion .grid-accordion-container {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.5s ease-out;
}
.grid-accordion .grid-accordion-container .grid-accordion-inner {
  overflow: hidden;
}
.grid-accordion .grid-accordion-container .grid-accordion-inner .grid-accordion-sub > button {
  position: relative;
  width: 100%;
	border: initial;
  scroll-padding-top: 70px;
}
.grid-accordion .grid-accordion-container .grid-accordion-inner .grid-accordion-sub .grid-accordion-inner-sub .wrap {
  position: relative;
}
.grid-accordion .grid-accordion-container .grid-accordion-inner .grid-accordion-sub .grid-accordion-inner-sub .wrap > button {
  position: absolute;
  bottom: 40px;
  left: 50%;
  width: 26px;
  height: 15px;
  z-index: 1;
  background: url("https://www.jr-takashimaya.co.jp/cn/cp/2025a-anniversary/assets/img/top/arrow02.png") no-repeat center center / contain;
  transform: translateX(-50%) rotate(0deg);
  transition: transform 0.5s;
}
.grid-accordion .grid-accordion-container .grid-accordion-inner .grid-accordion-sub .grid-accordion-inner-sub .wrap > button.is-open-sub-button {
  transform: translateX(-50%) rotate(180deg);
}
.grid-accordion .grid-accordion-container .grid-accordion-inner .grid-accordion-sub > button::after {
  content: "";
  position: absolute;
  right: 40px;
  top: 50%;
  width: 26px;
  height: 15px;
  background: url("https://www.jr-takashimaya.co.jp/cn/cp/2025a-anniversary/assets/img/top/arrow01.png") no-repeat center center / contain;
  transform: translateY(-50%) rotate(0deg);
  transition: transform 0.5s;
}
.grid-accordion .grid-accordion-container .grid-accordion-inner .grid-accordion-sub > button.is-open-sub-button::after {
  transform: translateY(-50%) rotate(180deg);
  transition: transform 0.5s;
}
.grid-accordion .grid-accordion-container .grid-accordion-inner .grid-accordion-sub .grid-accordion-container-sub {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.5s ease-out;
}
.grid-accordion .grid-accordion-container .grid-accordion-inner .grid-accordion-sub .grid-accordion-container-sub .grid-accordion-inner-sub {
  overflow: hidden;
}
.grid-accordion .grid-accordion-container .grid-accordion-inner .grid-accordion-sub .grid-accordion-container-sub.is-open-sub {
  grid-template-rows: 1fr;
}
.grid-accordion .grid-accordion-container.is-open {
  grid-template-rows: 1fr;
}
/* ↑アコーディオン */


#collection {
  scroll-margin-top: 70px;
}

.border-b {
  border-bottom: 1px solid #000;
}