html,
body { height: 100%; margin: 0; padding: 0; }
body.site-wrapper { margin: 0 auto; }
:root {
  --swipe-gutter: clamp(16px, 5.33vw, 24px);
  --swipe-bottom: calc(min(17.333333vw, 83.2px) + env(safe-area-inset-bottom));
}
.swipe-container {
  height: 100dvh;
  overflow-y: auto;
  overflow-x: hidden;
  scroll-snap-type: y mandatory;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.swipe-container::-webkit-scrollbar { display: none; }
.swipe-container:focus-visible { outline: 2px solid #ff7f4b; outline-offset: -2px; }
.swipe-section {
  box-sizing: border-box;
  position: relative;
  width: 100%;
  height: 100dvh;
  min-height: 100dvh;
  max-height: 100dvh;
  padding: max(16px, env(safe-area-inset-top)) var(--swipe-gutter) calc(var(--swipe-bottom) + 16px);
  scroll-snap-align: start;
  scroll-snap-stop: always;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-size: 100% auto;
}
.swipe-section:nth-of-type(3n + 2) { background-position: center 45%; }
.swipe-section:nth-of-type(3n) { background-position: center bottom; }
.swipe-section p { font-size: clamp(14px, 4vw, 16px); }
.swipe-section .tp-btn { font-size: 16px; padding: 15px 0; margin-top: 16px; }
.swipe-section .tp-btn::after { width: 13px; height: 11px; right: 24px; }
.swipe-hero { padding-inline: 0; padding-top: 0; justify-content: flex-start; }
.swipe-hero .c-header { position: relative; flex: 0 0 auto; width: 100%; padding: 12px 20px; z-index: 4; }
.swipe-hero .c-header_inner,
.swipe-hero .c-header_head { width: 100%; margin: 0; padding: 0; }
.swipe-hero .c-header_logo { width: 130px; margin: 0; }
.swipe-section .tp-vo_title { font-size: 34px; }
@media (max-height: 700px) {
  .swipe-section { padding-top: 12px; padding-bottom: calc(var(--swipe-bottom) + 10px); }
  .swipe-hero { padding-top: 0; }
  .swipe-section p { font-size: 14px; }
  .swipe-section .tp-btn { padding: 12px 0; margin-top: 12px; }
}
