*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

body{
  font-family:"Noto Sans JP", sans-serif;
}

.page{
  position:relative;
  width:100%;
  min-height:100svh;
  padding:26px 38px;
  display:flex;
  flex-direction:column;
}

@media (max-width:480px){
  
  .page{
    padding:26px 24px;
  }

}


/* 背景 */
.bg-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:-1;
}

/* ロゴ */
.logo{
  width:100%;
  max-width:600px;
  margin:0 auto clamp(8px, 2vh, 35px);
}

.logo img{
  width:250px;
  display:block;
}

@media (max-width:480px){
  
  .logo{
    max-width:100%;
  }

  .logo img{
    width:120px;
  }
  
}


/* メインヴィジュアル */
.main-visual-wrap{
  width:100vw;
  margin-left:calc(50% - 50vw);
}

.main-visual{
  width:100%;
  max-width:600px;
  margin:0 auto;
  aspect-ratio:3 / 4;
  overflow:hidden;
}

.main-visual img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}


/* 下部ボタン周り */
.bottom-area{
  display:flex;
  flex-direction:column;
  align-items:center;
  margin-top:clamp(8px, 2vh, 24px);
  margin-bottom:clamp(8px, 2vh, 40px);
}

/* 各SNS */
.sns-links{
  width:100%;
  max-width:400px;
  margin:0 auto clamp(22px, 3vw, 30px);
  display:flex;
  justify-content:center;
  align-items:center;
  gap:clamp(14px, 4vw, 28px);
}

.sns-button{
  display:block;
  width:22%;
  transition:transform .12s ease;
  transform-origin:center center;
}

.sns-button:active{
  transform:scale(.97);
}

.sns-button img{
  width:100%;
  display:block;
}

/* 遷移ボタン */
.transition-button{
  display:block;
  width:100%;
  max-width:600px;
  margin:0 auto;
  transition:transform .12s ease;
  transform-origin:center center;
}

.transition-button:active{
  transform:scale(.97);
}

.transition-button img{
  width:100%;
  display:block;
}

/* コピーライト */
.copyright{
  width:100%;
  max-width:600px;
  margin:4px auto 0;
  text-align:center;
  font-size:10px;
  line-height:1.5;
  color:#160013;
}