@charset "UTF-8";
:root {
  --theme-main-color: #D8739F; /* トーンダウンしたピンク色、ハワイの穏やかな雰囲気を表現 */
  --theme-main-dark: #B1457D; /* 濃いピンク色、より強い印象と安定感を提供 */
  --theme-main-pale: #F4C3D7; /* 非常に薄いピンク色、背景やサブ要素に使うことでメインカラーを引き立て */
  --vivid-color: #C2185B; /* 鮮やかながらも深みのあるピンク色、注意を引くためのアクセントカラー */
  --theme-main-pale20: #F8BBD0; /* ソフトなピンク色、装飾的な要素に使う */
  /* 
    --yellow-pale: #FCE5CD; /* 薄い黄色、橙色に近いティントで調整 
    --yellow-color: #FFD966; /* 明るい黄色、橙色に近い 
    --yellow-dark: #E69138; /* 暗い黄色、橙色に近いシェード 
    --green-pale: #C9DA8B; /* 橙色と調和する薄い緑 
    --green-color: #9FC199; /* 橙色と調和する中間の緑 
    --green-dark: #6B8E23; /* 橙色と調和する暗い緑 
  / */

}

.HeroSection .HeroTitle {
  text-shadow: 1px 1px 4px rgba(0, 0, 0, 1);
}
/* .Section {
  border-top: 16px solid;
  border-image: conic-gradient(#f5f551,#5eff5e,#84a1ff,#ff45ff,#ff5a5a,#ffbc41,#f5f551) 1;
} */

/* .NavSection {
  background: linear-gradient(to right,#e60000,#f39800,#fff100,#009944,#0068b7,#920783,#e60000) 0 / 100%;
    animation: 30s example4 linear infinite;
}
@keyframes example4{
  100% { background-position: 100%; }
} */

@media screen and (max-width: 759.9px) {
  .Section .SectionButton {
    padding: 1rem 2rem;
  }
  .DpSection .ItemBox .tabWrap .tab .tabItem a p {
    font-size: 0.875rem;
  }

  .SpotSection .ImageMapWrap .SpotTitle {
    width: 90px;
    height: 90px;
  }
  .SpotSection .ImageMapWrap a .SpotTitle .SpotTitleJp {
    font-size: 0.8rem;
    letter-spacing: -1px;
  }

  /* スポット都市名タイトル日本語 */
  .SpotSection .SpotWrap .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleJp {
    letter-spacing: 0;
    font-size: 1.2rem;
    padding-top: 0.25rem;
    line-height: 1.2;
  }
  .SpotSection .SpotWrap .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleJp span {
    font-size: 0.875rem;
  }
  /* スポット都市名タイトル英語 */
  .SpotSection .SpotWrap .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleEng {
    font-size: 1.4rem;
    padding-top: 0.25rem;
  }

  /* #Spot01*/
  .SpotWrap#Spot01 .SpotHeaderWrap .SpotHeader .SpotSubTitle {
    width: 80%;
  }

  /* #Spot02*/
  .SpotWrap#Spot02 .SpotHeaderWrap .SpotHeader .SpotSubTitle {
    width: 80%;
  }

  /* #Spot03*/
  .SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleJp {
    font-size: 1.1rem;
    letter-spacing: -2px;
  }

  /* .SpotSection .SpotWrap#Spot06 .SpotBody {
    margin-top: 0!important;
  } */

  .ImageMapWrap .SpotTitle.Spot01Button {
        margin-left: -15%;
        margin-top: 60%;
  }
  .ImageMapWrap .SpotTitle.Spot02Button {
		margin-left: 24%;
        margin-top: 16%;
  }
  .ImageMapWrap .SpotTitle.Spot03Button {
        margin-left: -36%;
        margin-top: -10%;
  }
  .ImageMapWrap .SpotTitle.Spot04Button {
        margin-left: -45%;
        margin-top: 60%;
  }
}

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

  /* スポット都市名タイトル日本語 */
  .SpotSection .SpotWrap .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleJp {
    letter-spacing: 0;
    font-size: 1.4rem;
    padding-top: 0.25rem;
    line-height: 1.2;
  }
  .SpotSection .SpotWrap .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleJp span {
    font-size: 0.875rem;
  }
  /* スポット都市名タイトル英語 */
  .SpotSection .SpotWrap .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleEng {
    font-size: 1.4rem;
    padding-top: 0.25rem;
  }

/* #Spot03*/
.SpotWrap#Spot03 .SpotHeaderWrap .SpotHeader .SpotTitle .SpotTitleJp {
	font-size: 1.2rem;
	letter-spacing: -1px;
}

  .ImageMapWrap .SpotTitle.Spot01Button {
		margin-left: -20%;
        margin-top: 24%;
  }
  .ImageMapWrap .SpotTitle.Spot02Button {
		margin-left: 6%;
        margin-top: 4%;
  }
  .ImageMapWrap .SpotTitle.Spot03Button {
		margin-left: -8%;
        margin-top: -8%;
  }
  .ImageMapWrap .SpotTitle.Spot04Button {
		margin-left: -40%;
        margin-top: 17%;
  }
}