@charset "utf-8";
/* CSS Document */

/*　ーー　ローディング画面　ーー　*/
#loading {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  min-height: 100vh;
  min-height: 100dvh;
  background-color: #fff;
  transition: all 1.5s;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}
#loading img {
  width: 100px;
  opacity: .7;
}
#loading.loaded {
  opacity: 0;
  visibility: hidden;
}
/*　ーー　/ローディング画面　ーー　*/

/*　ーー　ハンバーガーメニュー　ーー　*/
.openbtn {
	position: relative;
	cursor: pointer;
  width: 58px;
}
.openbtn span {
  display: inline-block;
  transition: all .4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 2px;
  border-radius: 5px;
  background: #231815;
  width: 45%;
  }
.openbtn span:nth-of-type(1) {
	top:12px;	
}
.openbtn span:nth-of-type(2) {
	top:20px;
}
.openbtn span:nth-of-type(3) {
	top:28px;
}
.openbtn.active span:nth-of-type(1) {
  top: 18px;
  left: 50%;
  transform: translate(-50%,6px) rotate(-45deg);
  width: 30%;
}
.openbtn.active span:nth-of-type(2) {
	opacity: 0;
}
.openbtn.active span:nth-of-type(3){
  top: 30px;
  left: 50%;
  transform:  translate(-50%,-6px) rotate(45deg);
  width: 30%;
}
/*　ーー　/ハンバーガーメニュー　ーー　*/
/*　ーー　購入ボタン　ーー　*/
main .purchase_promotion {
	opacity: 0;
	transition: all 0.5s ease-out;
}
main .purchase_promotion.scroll_view {
	opacity: 1;
}
/*　ーー　/購入ボタン　ーー　*/

/* スクロールダウンの位置 */
.scroll {
  position: absolute;
  right: 50%;
  top: 30px;
  writing-mode: vertical-rl;
  z-index: 1;
}