@charset "UTF-8";

/*
 common
===================================================== */
.black-container {
  background-color: #000000;
}

/*
 mainTtl
===================================================== */
.mainTtl__catch{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 48px;
  font-size: 26px;
  font-weight: bold;
  color: #fff;
  text-align: center;
  background-color: #ff8a2a;
}

/*
 cnt-ecm-floating-navi-container
===================================================== */
.cnt-ecm-floating-navi-container{
  height: 98px;
  background-color: #89b472;
}
.ecm-floating-navi-container.cnt-ecm-floating-navi-container[data-sticky=true]{
  top: 64px;
}
.cnt-ecm-floating-navi::before{
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 26px;
  background-color: #222;
}
.ecm-floating-navi-container[data-static=false][data-sticky=false]{
  border-bottom:none!important;
}
.cnt-ecm-floating-navi{
  height: 98px;
}

.cnt-ecm-floating-navi-item{
  flex:0 1 auto;
  position: relative;
  width: 100%;
  height: 98px;
  padding: 0;
  color: #222!important;
  border-bottom:solid 0!important;
}
.cnt-ecm-floating-navi > .cnt-ecm-floating-navi-item::before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background-color: #422c23;
}
.cnt-ecm-floating-navi > .cnt-ecm-floating-navi-item:last-child::after{
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 4px;
  height: 100%;
  background-color: #422c23;
}
.cnt-ecm-floating-navi-item:hover{opacity:.8;}
.cnt-ecm-floating-navi-item .navi__text{
  width: 100%;
  height: 72px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
}
.cnt-ecm-floating-navi-item .navi__arrow{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 26px;
}

/*
 mandalorian__title
===================================================== */
.mandalorian__title__catch img{
  width:initial;
  margin-left: 50%;
  transform:translateX(-50%);
}
.mandalorian__title h2{
  font-size: 32px;
  font-weight: bold;
  text-align: center;
  color: #333;
  margin-top: 26px;
}
.pointup-contents .mandalorian__title h2{
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 443px;
  height: 75px;
  margin: 0 auto;
  font-size: 22px;
  background: url(https://r.r10s.jp/evt/event/starwars/mandalorian/_pc/img/20260522/campaign_h2_bg.png) no-repeat;
  padding-top: 2px;
  margin-top: 32px;
}
.pointup-contents .mandalorian__title h2 > span{display: block;}
.movie-contents .mandalorian__title h2{
  width: 960px;
  margin: 32px auto 0;
}

/*
 contents
===================================================== */
.contents{
  padding-top: 80px;
  padding-bottom: 80px;
  overflow-x:hidden;
}

/*
 slider-contents
===================================================== */
.slider-contents{
  background-color: #f3b431;
}
.slider-contents .goods__lead{
  font-size: 16px;
  text-align: center;
  color: #333;
}
.glogu__subtitle{
  letter-spacing: -0.5em;
  margin-bottom: 18px;
  text-align: center;
}
.glogu__subtitle > *{
  display: inline-block;
  vertical-align: middle;
  letter-spacing: normal;
}
.glogu__subtitle > img{
  width:53px;
  height:49px;
}
.glogu__subtitle > h3{
  margin-left: 20px;
  font-size: 22px;
  font-weight: bold;
  color: #333;
  line-height: 1.3;
  text-align: left;
}
.glogu__subtitle > h3 > span{
  font-size: 32px;
}
.swiper[data-layout="sign"] .swiper-slide:not(.swiper-slide-active) .goods__sliderCatch{
  height: 0;
  padding-top: 104px;
  overflow:hidden;
}
.slider-contents .swiper-slide-active .goods__sliderCatch{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 538px;
  height: 80px;
  margin: 24px 0 0 -67px;
  background: url(https://r.r10s.jp/evt/event/starwars/mandalorian/_pc/img/20260522/slider_description_bg.png) no-repeat;
  background-size: 100% auto;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  line-height: 1.5;
  color: #333!important;
  letter-spacing: -0.04em;
}

/* definition */
.definition.-sign {
  -webkit-transform: none;
  transform: none;
}
.swiper[data-layout="sign"] {
  position: relative;
  width: 404px;
  height: 506px;
  margin-right: auto;
  margin-left: auto;
}
.swiper[data-layout="sign"] .swiper-container {
  position: relative;
  display: none;
  width: 100%;
  margin: 0 auto;
  overflow: visible;
}
.swiper[data-layout="sign"] .swiper-container-initialized {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.swiper[data-layout="sign"] .swiper-wrapper {
  align-items: center;
}
.swiper[data-layout="sign"] .swiper-slide {
  width: 404px;
  margin: 0 auto;
}
.swiper[data-layout="sign"] .swiper-slide:not(.swiper-slide-active) {
  position: relative;
  z-index: -1;
  transform:scale(0.92);
  opacity:0.5;
}
.swiper[data-layout="sign"] .swiper-slide:not(.swiper-slide-active) > * {
  display: block;
}
@media screen and (min-width: 415px) {
  .swiper[data-layout="sign"] .swiper-slide:not(.swiper-slide-active) > * {
    z-index: 1;
  }
}
.swiper[data-layout="sign"] .swiper-slide > * {
  transition: all 0.2s 0s ease;
}
.swiper[data-layout="sign"] .swiper-image {
  display: block;
  width: 100%;
  padding:0 4px;
}
.swiper[data-layout="sign"] .swiper-button-prev {
  top: 142px;
  left: 0;
  width: 39px;
  height: 75px;
  margin-top: 0;
  background-image: url(https://r.r10s.jp/evt/event/starwars/mandalorian/_pc/img/20260522/slider_prev.png);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  transform: scale(1, 1);
  z-index: 1 !important;
}
.swiper[data-layout="sign"] .swiper-button-next {
  top: 142px;
  right: 0;
  width: 39px;
  height: 75px;
  margin-top: 0;
  background-image: url(https://r.r10s.jp/evt/event/starwars/mandalorian/_pc/img/20260522/slider_next.png);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  transform: scale(1, 1);
  z-index: 1 !important;
}
.swiper[data-layout="sign"] .swiper-pagination {
  position: relative;
  bottom: 0;
  z-index: 1;
  text-align: center;
  display: flex;
  justify-content: center;
  margin-top: 24px;
}
.swiper[data-layout="sign"] .swiper-pagination-bullet {
  outline: none !important;
  border-radius: 8px;
  width: 16px;
  height: 16px;
  margin: 0 4px;
  background-color: #cccccc;
  opacity: 1;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent !important;
}
.swiper[data-layout="sign"] .swiper-pagination-bullet-active {
  background-color: #bf0000!important;
}
.slider-contents .definition.-sign .definition__link{
  display: flex;
  flex-wrap:wrap;
  width: 360px;
  height: 361px;
  margin: 0 auto;
  padding: 27px 25px 26px 27px;
  box-sizing: border-box;
  background-color: #fff;
  border:solid 7px #ffeeb1;
  position: relative;
}
.slider-contents .swiper-slide-active .definition.-sign .definition__link{
  background-image: url(https://r.r10s.jp/evt/event/starwars/mandalorian/_pc/img/20260522/slider_img_bg.png);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-color: inherit;
  border:none;
  border-radius: 0;
}
.definition.-sign .swiper-image{
  width: 100%;
}

/*
 pointup-contents
===================================================== */
.pointup__period{
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  line-height: 1.5;
}
.pointup__anchor{
  text-align: center;
  font-size: 14px;
  font-weight: bold;
}
.pointup-item__title{
  font-size: 32px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 18px;
}
.pointup-item__anchorWrap{
  width: 648px;
  margin-right: auto;
  margin-left: auto;
}
.pointup-item__anchor{
  border:solid 1px #4a5f86;
  background-color: #2a3e62;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 72px;
  padding-right: 37px;
  font-size: 16px;
  line-height: 1.5;
  font-weight: bold;
  text-align: center;
  color: #fff !important;
  position: relative;
}
.pointup-item__anchor:hover{
  opacity:.8;
  text-decoration: none;
}
.pointup-item__anchor::after{
  content: '';
  display: block;
  width: 21px;
  height: 16px;
  background: url(https://r.r10s.jp/evt/event/starwars/mandalorian/_pc/img/20260522/btn_arrow.png) no-repeat;
  top: auto;
  bottom: auto;
  left: auto;
  position: absolute;
  right:16px;
}
.pointup-item__subtitle{
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 26px;
}

/*
 movie-contents
===================================================== */
.movie-contents{
  background-color: #2a3e62;
}
.movie_copy_right{
  font-size: 14px;
  color:#ffffff;
  text-align: left;
  margin-top: 14px;
  margin-bottom: 24px;
}
.movie_about{
  font-size: 16px;
  text-align: left;
  line-height: 1.5;
  color: #fff;
}
.movie-character__area{
  position: relative;
  padding-right: 28px;
  padding-left: 28px;
  letter-spacing: -0.5em;
}
.movie-character__area.-grogu{margin-bottom: 20px;}
.movie-character__area > *{
  display: inline-block;
  vertical-align: middle;
  letter-spacing: normal;
}
.movie-character__area.-grogu .movie-character__image{
  width: 240px;
  margin-right: 30px;
}
.movie-character__area.-grogu .movie-character__text{
  width: calc(100% - 270px);
}
.movie-character__area.-mandalorian .movie-character__image{
  width: 240px;
  margin-left: 30px;
}
.movie-character__area.-mandalorian .movie-character__text{
  width: calc(100% - 270px);
}
.movie-character__name{
  font-size: 18px;
  font-weight: bold;
  color: #fff;
  margin-bottom: 8px;
}
.movie-character__profile{
  font-size: 16px;
  color: #fff;
  line-height: 1.5;
}

/* video */
.dzVideo {
  position: relative;
  width: 100%;
  height: 0;
  margin: 0 auto;
  padding-top: 56.25%;
}
.dzVideo > iframe {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  width: 100%!important;
  height: 100%!important;
}

/*
 mandalorian__goods-contents
===================================================== */
.mandalorian__goods-contents{
  background-color: #81aa60;
}
.mandalorian__goods__lead{
  font-size: 16px;
  text-align: center;
  color: #333;
  margin-bottom:32px;
}

/*
 moreBtn
===================================================== */
.moreBtn{
  width: 390px;
  margin: 0 auto;
}
.moreBtn > a{
  width: 100%;
  height: 72px;
  display: flex;
  border-radius: 36px;
  justify-content: center;
  align-items: center;
  font-size:24px;
  line-height: 1.2;
  text-align: center;
  position: relative;
}
.moreBtn > a:hover{
  opacity:.8;
  text-decoration: none;
}
.moreBtn > a > .arrow{
  display: block;
  position: absolute;
  right:37px;
  top: auto;
  bottom: auto;
  left: auto;
}
.moreBtn > a > .arrow .ecm-icon-chevron-right{
  font-weight: bold;
  font-size: 24px;
  line-height: 1.2;
}
.slider-contents .moreBtn{margin-top: 40px;}
.slider-contents .moreBtn > a{
  border:solid 2px #333333;
  color: #333!important;
}
.slider-contents .moreBtn > a > .arrow .ecm-icon-chevron-right{color: #333!important;}
.moreBtn > a > .arrow .ecm-icon-chevron-right{
  font-weight: bold;
  font-size: 18px;
}
.pointup-contents .moreBtn[data-layout="all"]{
  width: 686px;
  margin-top: 48px;
}
.pointup-contents .moreBtn[data-layout="all"] > a{
  height: 120px;
  border-radius: 60px;
  background-color: #89b472;
  color: #422c23!important;
  font-size: 26px;
  font-weight: bold;
}
.pointup-contents .moreBtn[data-layout="all"] > a > .arrow .ecm-icon-chevron-right{color: #422c23!important;}

/*
 copyright
===================================================== */
.copyright {
  font-size: 10.5px;
  text-align: right;
  color: #ffffff;
}

/*
 floating-right-btn
===================================================== */
.ecm-floating-menu.-sw_mandalorian .ecm-floating-nav-pill{
  width: 207px;
  height: 131px;
  padding: 0;
  border:solid 5px #FF8A2A;
  border-right:none!important;
  border-radius: 14px 0 0 14px;
  background-color: #fff;
  box-shadow: 0 0 5px #D9D9D905;
}

/*
 footer
===================================================== */
#event.ecm-container{
  padding-top: 98px;
}
/* マンダロリアンセクション専用のボタンデザイン */
.mandalorian__moreBtn {
  margin-top: 30px; /* 上のリストとの間隔 */
}

.mandalorian__moreBtn > a {
  border: solid 2px #333;      /* 枠線の色 */
  color: #333 !important;      /* 文字色 */
  text-decoration: none;
}

/* 矢印の色 */
.mandalorian__moreBtn > a > .arrow .ecm-icon-chevron-right {
  color: #333 !important;
}
