*{box-sizing:border-box;}

body{
  margin:0;
  background:#e8d1bf;
  font-family:"fot-udmincho-pr6n", serif;
  font-weight:700;
  color:#3b2a1a;
}

.lp-shell{
  display:flex;
  justify-content:center;
}

.lp-phone{
  width:100%;
  max-width:430px;
}

@media (min-width:768px){
  body{
    background:url("assets/img/pc_back.png") center / cover no-repeat fixed;
  }

  .lp-phone{
    background:#e8d1bf;
    border-radius:18px;
    box-shadow:
      0 12px 40px rgba(0,0,0,.18),
      0 4px 12px rgba(0,0,0,.10);
  }
}

.lp-section{
  margin:0;
}

img{
  display:block;
  height:auto;
}

.img-full{
  width:100%;
}

.lp-imgwrap{
  position:relative;
}

.lp-cta-overlay{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  width:min(96%, 420px);
  z-index:2;
  display:block;
}

.lp-cta-overlay::after{
  content:"";
  position:absolute;
  inset:-12px;
  background:transparent;
  border-radius:18px;
}

.lp-cta-overlay img{
  width:100%;
  height:auto;
  display:block;
  will-change:transform;
  transition:transform .18s ease, filter .18s ease;
  transform:scale(1.03);
  animation:ctaFloat 2.6s ease-in-out infinite;
}

@keyframes ctaFloat{
  0%{transform:scale(1.03) translateY(0);}
  50%{transform:scale(1.06) translateY(-2px);}
  100%{transform:scale(1.03) translateY(0);}
}

.lp-cta-overlay:hover img{
  transform:scale(1.08) translateY(-2px);
  filter:drop-shadow(0 10px 18px rgba(0,0,0,.22));
}

.lp-cta-overlay:active img{
  transform:scale(1.00);
}

.lp-cta-overlay--4 img{
  animation:ctaFloat4 2.6s ease-in-out infinite;
  will-change:transform;
}

@keyframes ctaFloat4{
  0%{transform:scale(0.94) translateY(0);}
  50%{transform:scale(0.97) translateY(-1px);}
  100%{transform:scale(0.94) translateY(0);}
}

.lp-cta-overlay--4:hover img{
  transform:scale(1.00) translateY(-2px);
}

.lp-cta-overlay--4:active img{
  transform:scale(0.96);
}

.lp-cta-overlay--1{top:24.5%;}
.lp-cta-overlay--2{top:97.5%;}
.lp-cta-overlay--3{top:96%;}
.lp-cta-overlay--4{top:74%;}
.lp-cta-overlay--5{top:97%;}

@media (prefers-reduced-motion: reduce){
  .lp-cta-overlay img{
    animation:none;
    transition:none;
  }
}

html, body{
  overflow-x: hidden;
}