/* ローディング */
body::after {
  content: '';
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: url("/global-data/20250716155932890.svg"),
                linear-gradient(#fff, #fff);
background-repeat: no-repeat; 
background-position: center;
background-size: 100%;
  z-index: 9999;  
  pointer-events: none;  
  opacity: 0;  
  -webkit-transition: opacity 1.3s ease;  
 -ms- transition: opacity 1.3s ease;
 -moz- transition: opacity 1.3s ease;
  transition: opacity 1.3s ease;
}
body.fadeout::after {
  opacity: 1;
}
body.fadeout article{
  -webkit-transform:scale(1.2);
  transform:scale(1.2);
}


/*-------- 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;
  }
}



#scrollArea {
  background-color: #fffbed;
}


/* --------------固定ボタン-------------------- */
#unit-3 {
  position: fixed;
  bottom: 80px;
  z-index: 100;
  width: 200px;
  }
#unit-4 {
  position: fixed;
  bottom: 0px;
  z-index: 100;
  width: 200px;
}

/* --------------バナーボタン（取りました）-------------------- */
.linkbanner1 {
position: fixed;
    left: 0px;
    bottom: 163px;
    z-index: 2;
}
.linkbanner2 {
position: fixed;
    left: 0px;
    bottom: 80px;
    z-index: 2;
}


.bCustomS .bcu_link>a, .bCustomS .bcu_link span {
  transition: 0.3s;
}
.icon {
  width: 28px;
}


/* --------------ボタン装飾-------------------- */
.bCustomS .bcu_link_inner span.bcu_link_content::after {
  content:"";
  display:inline-block;
  width: 20px;
  height: 1.5px;
  background-color: #966e5f;
  position: absolute;
  top: 50%;
  right: -60px;
}




/* --------------フッター-------------------- */
#footerAreaSection {
  display: none;
}
#bCustomS55 a {
  text-decoration: none;
  color: #966e5f;
  transition: 0.3s;
}
#bCustomS55 a:hover {
  color: #b39888;
}


/* --------------アイコンサイズ-------------------- */
.icon {
  width: 28px;
}




/* -----------ヘッダーエリア------------- */
#fixedArea {
  z-index: 5;
}

/* -----------ページトップボタン------------- */
#pagetop a span {
  background-color: #966e5f;
}


#bCustomS7 .bcu_link_inner span.bcu_link_content::after, #bCustomS6  .bcu_link_inner span.bcu_link_content::after, #bCustomS655 .bcu_link_inner span.bcu_link_content::after {
  width: 0!important;
}
/* -----------衣裳レンタルのボタングレー------------- */
#bCustomS507 .bcu_link_inner span.bcu_link_content::after {
   background-color: #7f7f7f;
}

.extMdlFormGnrtrBtn input.extBtnNext, .extMdlFormGnrtrBtn input.extBtnSend {
  background-color: #966e5f;
}
.extMdlFormGnrtrSP .extMdlFormGnrtrBtn input.extBtnNext, .extMdlFormGnrtrSP .extMdlFormGnrtrBtn input.extBtnSend {
  background-color: #966e5f;
}
.extMdlFormGnrtrBtn input.extBtnClear, .extMdlFormGnrtrBtn input.extBtnBack {
  background-color: #666;
}


/* -----------連載記事検索------------- */
.extSearch .checkBtnBox input[type="checkbox"]:checked + label.checkBtn {
    border-color: #966e5f;
    background-color: #966e5f;
}
.extSearch .checkBtnBox input[type="checkbox"] + label.checkBtn:hover {
    border-color: #af8c7d;
    background-color: #af8c7d;
}




#scrollArea {
  height: calc(-360px + 100vh)!important;
}

html {
    scroll-behavior: smooth;
}



/* -----------グローバルメニューが上部の時------------- */
#globalNaviAreaSection {
  justify-content: flex-end;
  margin-right: 130px;
}
.extCatList5Row_0 ul.extCatListUL li .extCatList5Inner {
  padding-left: 40px;
}

/* -----------上部固定ボタン------------- */
.koteibtn1 {
  background-color: #966e5f;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 90px;
  height: 90px;
  justify-content: center;
  text-decoration: none !important;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 10;
  transition: 0.3s;
}
.koteibtn2 {
  background-color: #af8c7d;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 90px;
  height: 90px;
  justify-content: center;
  text-decoration: none !important;
  position: absolute;
  top: 0;
  right: 90px;
  z-index: 10;
  transition: 0.3s;
}
.koteibtn1:hover, .koteibtn2:hover {
  opacity: 0.8;
}
