#contentsAreaSection {
  margin-top: 0px !important;
}

.icon {
  width: 10px;
}

/* ------------フッター-------------- */
#bCustomS24 a {
  text-decoration: none;
  position: relative;
}
#bCustomS24 a::before {
  content: '';
  position: absolute;
  display: block;
  left: -12px;
  top: 45%;
  width: 5px;
  height: 5px;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
  transform: rotate(45deg);
}
#footerAreaSection {
  padding: 20px;
}

/* -------------矢印ボタンレイアウト---------------- */
/* ボタンベーススタイル */
.yajirushibtn a {
    position: relative;
    display: inline-block;
    overflow: visible;
}

/* 矢印の先端（斜め線） */
.yajirushibtn a::before {
    content: '';
    position: absolute;
    top: calc(50% - 1px);
    right: -15px;
    transform: translateY(calc(-50% - 2px)) rotate(30deg);
    width: 12px;
    height: 1.5px;
    background-color: #b2a8a4;
    transition: 0.3s;
}

/* 矢印の棒（横線） */
.yajirushibtn a::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -1em;
    transform: translateY(-50%);
    width: 50px;
    height: 1.5px;
    background-color: #b2a8a4;
    transition: 0.3s;
}

/* ホバー時 */
.yajirushibtn a:hover::before {
    right: -25px;
}
.yajirushibtn a:hover::after {
    right: -25px;
}


/*-------- jsアニメーション -----------------------------------------------*/
.fadeIn {
  opacity: 0;
  visibility: hidden;
  transform: translateX(0px);
  transition: all 1.5s;
}
.fadeIn.moveon {
  opacity: 1;
  visibility: visible;
  transform: translateX(0px);
}

/*-------- フェードアニメーション ----------------------------------------------*/
.fade {
  opacity: 0;
}
.fade {
animation-name:fadeInAnime;
animation-duration: 1.5s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes fadeInAnime{
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}


/*-------- ヘッダー背景 -----------------------------------------------*/
#headerAreaSection {
    transition: all 1s;
}
#headerAreaSection.scroll-nav {
    background-color: #000000b3 !important;
    transition: all 1s;
}



/*jsアニメーション ページ切り替え*/
.page-animate::before {
 content: '';
 position: fixed;
 top: 100%;
 width: 100%;
 height: 100%;
 background-image: url("/global-data/20250730124107740.svg"),
                  linear-gradient(#806555, #9e8e88);
background-repeat: no-repeat; 
background-position: center;
 z-index: 9999;
 pointer-events: none;
 -webkit-transition: right 2s cubic-bezier(0.4, 0, 0.2, 1);
 transition: top 2s cubic-bezier(0.4, 0, 0.2, 1);
}

.page-animate::after {
 content: '';
 position: fixed;
 bottom: 100%;
 width: 100%;
 height: 100%;
 background-image: url("/global-data/20250730124107740.svg"),
                  linear-gradient(#806555, #9e8e88);
background-repeat: no-repeat; 
background-position: center;
 z-index: 9999;
 pointer-events: none;
 -webkit-transition: left 2s cubic-bezier(0.4, 0, 0.2, 1);
 transition: bottom 2s cubic-bezier(0.4, 0, 0.2, 1);
}

.page-animate.is-slide-in::before {
 top: 0;
}

.page-animate.is-slide::after {
 bottom: 0;
}