@charset "UTF-8";
:root {
  --theme-main-color: #D1433C; /* 暗度を増やした赤、深みのある赤色 */
  --theme-main-dark: #A5322D; /* メインカラーのさらに暗いシェード、より濃厚な赤 */
  --theme-main-pale: #EAA6A2; /* メインカラーの薄いティント、深みのある柔らかいピンクレッド */
  --theme-main-pale20: #F2B8B5; /* メインカラーの薄いティント、やや明るい柔らかいピンクレッド */
  --vivid-color: #C33D36; /* 暗度を増やした鮮やかな赤、深みと魅力のあるアクセントカラー */
  
  /* 調整した補色と関連色 
  --yellow-pale: #FCE5CD; /* 薄い黄色、赤色に調和するティント
  --yellow-color: #FFD966; /* 明るい黄色、赤色に調和する
  --yellow-dark: #E69138; /* 暗い黄色、赤色に調和するシェード

  --green-pale: #C9DA8B; /* 赤色と調和する薄い緑 
  --green-color: #9FC199; /* 赤色と調和する中間の緑 
  --green-dark: #6B8E23; /* 赤色と調和する暗い緑 
  */
}



.tabWrap {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-bottom:2px solid var(--vivid-color);
  margin-bottom: 0.75rem;
}
.tabWrap .tab#switching_tab_area {
  gap: 0.5rem;
}
.tabWrap .tab#switching_tab_area .tabItem {
  padding: 0.75rem 0.25rem;
  font-size: 1rem;
  line-height: 1.2;
  border-radius: 0.25rem 0.25rem 0 0;
  font-weight: bold;
}
.tabWrap .tab .tabItem:hover {
  background-color: var(--white-color);
}
.tabWrap .tab#switching_tab_area  .tabItem.select {
  background-color: var(--vivid-color);
  border-color: var(--vivid-color);
  color: var(--white-color);
  font-weight: bold;
}


/* .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotImage {
  display: none;
} */


@media screen and (max-width: 759.9px) {
  .HeroSection .HeroTitle {
    padding: 2rem 1rem;
    font-size: 3.4rem;
    letter-spacing: -2px;
  }



  /* MV確認用 */
  .slick-prev {
    top: auto;
    bottom:30%;
    left: 0.5rem !important;
  }

  .slick-next {
    top: auto;
    bottom:30%;
    right: 0.5rem !important;
  }

  /* 発地切り替え */

  .SectionChangeDept #switching_tab_menu li {
    width: calc(33.3% - 0.5rem);
  }

  .ImageMapWrap img {
    border-radius: 0;
  }

  /* スポット地図 都市名ボタンサイズ */
  .SpotSection .ImageMapWrap .SpotTitle {
    width: 90px;
    height: 90px;
  }
  /* スポット地図 都市名タイトル日本語 */
  .SpotSection .ImageMapWrap a .SpotTitle .SpotTitleJp {
    font-size: 1rem;
    letter-spacing: -1px;
  }
  .SpotSection .SpotTitle .SpotTitleEng {
    font-size: 1.1rem;
  }

  /* スポット地図 都市名ボタン位置調整 */
  .ImageMapWrap .SpotTitle.Spot01Button {
    margin-left: -45%;
    margin-top: -71%;
  }
  .ImageMapWrap .SpotTitle.Spot02Button {
    margin-left: 0%;
    margin-top: -23%;
  }
  .ImageMapWrap .SpotTitle.Spot03Button {
    margin-left: -33%;
    margin-top: -23%;
  }
  .ImageMapWrap .SpotTitle.Spot04Button {
    margin-left: -13%;
    margin-top: 37%;
  }
  .SpotSection .SpotTitle .SpotTitleJp {
    font-size: 1.4rem;
  }

  /* スポット都市説明テキスト */
  /* .SpotSection .SpotWrap#Spot03  .SpotHeaderWrap .SpotHeader .SpotTitle {
    top: -1.5rem;
    left: 0.5rem;
  } */
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle {
    /* width: 85%; */
    bottom: -0.75rem;
  }
}

@media screen and (min-width: 760px), print {
  /* MV確認用 */
  .HeroSlick > div:not(:first-child) {
    display: block;
  }
  /* DP こだわりタイトル */
  .DpSection .ItemBox .ItemBoxContent .ItemBoxContentInner .ItemBoxItemWrap .ItemBoxItemHeader .SectionTextTitle {
    max-width: 540px;
  }
  /* スポット地図 都市名タイトル日本語 */
  .SpotSection .ImageMapWrap a .SpotTitle .SpotTitleJp {
    font-size: 1.35rem;

  }
  /* スポット都市名タイトル日本語 */
  .SpotSection .SpotWrap .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleJp {
    font-size: 1.6rem;
  }
  /* スポット都市名タイトル英語 */
  .SpotSection .SpotWrap .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleEng {
    font-size: 1.5rem;
  }

  /* スポット地図 都市名ボタン位置調整 */
  .ImageMapWrap .SpotTitle.Spot01Button {
    margin-left: 31%;
    margin-top: -6%;
  }
  .ImageMapWrap .SpotTitle.Spot02Button {
    margin-left: 13%;
    margin-top: 9%;
  }
  .ImageMapWrap .SpotTitle.Spot03Button {
    margin-left: -9%;
    margin-top: 10%;
  }
  .ImageMapWrap .SpotTitle.Spot04Button {
    margin-left: -28%;
    margin-top: -1%;
  }

  /* スポット都市説明テキスト */
  /* .SpotSection .SpotWrap#Spot03  .SpotHeaderWrap .SpotHeader .SpotTitle {
    top: -4.5rem;
    left: 0;
  } */
}

/* Disney対応 */
@media screen and (min-width: 100px) {
  .SpotSection .SpotWra#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle {
    width: 90%;
  }
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle p span {
    font-size: 1rem;
  }
}
@media screen and (min-width: 400px) {
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle p span {
    font-size: 1.1rem;
  }
}
@media screen and (min-width: 470px) {
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle {
    width: 75%;
  }
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle p span {
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 624px) {
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle {
    width: 60%;
  }
}
@media screen and (min-width: 760px) {
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotTitle {
    width: 128px;
    height: 128px;
    top: -4rem;
  }
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleJp {
    font-size: 1.2rem;
  }
  /* スポット都市名タイトル英語 */
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleEng {
    font-size: 1.1rem;
  }
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle {
    width: 100%;
    bottom: -1.5rem;
  }
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle p span {
    font-size: 1.2rem;
  }
}

@media screen and (min-width: 825px) {
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotTitle {
    top: -3rem;
  }
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleJp {
    font-size: 1.4rem;
  }
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleEng {
    font-size: 1.3rem;
  }
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle {
    width: 94%;
    bottom: -1.1rem;
  }
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle p span {
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 986px) {
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotTitle {
    width: 136px;
    height: 136px;
    top: -2.5rem;
  }
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle {
    width: 90%;
    bottom: -1.25rem;
  }
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle p span {
    font-size: 1.4rem;
  }
}
@media screen and (min-width: 1160px) {
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle {
    width: 80%;
  }
}

@media screen and (min-width: 1290px) {
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotTitle {
    width: 144px;
    height: 144px;
    top: -0.5rem;
  }
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleJp {
    font-size: 1.5rem;
  }
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleEng {
    font-size: 1.4rem;
  }
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle {
    width: 70%;
    bottom: -0.75rem;
  }
  .SpotSection .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotSubTitle p span {
    font-size: 1.5rem;
  }
}

/*----- disney webcore banner // -----*/
.SectionBanner.dis_flex {
    display: flex;
    margin: auto;
    padding: 0;
}
@media screen and (max-width: 759.9px) {
	.SectionBanner.dis_flex {width: 85%;}
}
@media screen and (min-width: 760px),print {
	.SectionBanner.dis_flex {width: 500px;}
}
.SectionBanner.dis_flex a {
    width: 50%;
    margin-right: 3%;
}
.SectionBanner.dis_flex a:last-child {margin-right: 0;}
/*----- // disney webcore banner -----*/