@charset "UTF-8";

@media (max-width: 768px) {

  /* Hero */
  .video-hero {
  aspect-ratio: 6 / 10;
  padding: 0;
    background:
      linear-gradient(
      180deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,0.50) 40%,
      rgba(255,255,255,0.75) 70%,
      rgba(255,255,255,0.88) 100%
    ),
    url("../img/video_FV_mbl.png") center center / cover no-repeat;
  }

  .video-hero .hero-copy .title {
    font-size: 30px;
    margin-bottom: 14px;
  }
    
.video-hero .hero-inner {
  align-items: flex-end;
  padding-bottom: 100px;
}

  /* For */
  .for-grid {
    grid-template-columns: 1fr;
    max-width: 100%;
  }

  /* Why */
  .why-inner {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .why-image {
    max-width: 180px;
  }

  .why-problem {
    padding: 24px 20px;
  }

  /* Contents */
  .contents-grid {
    grid-template-columns: 1fr;
    max-width: 100%;
  }

  .process-box {
    padding: 24px 20px;
  }

  .process-list {
    grid-template-columns: 1fr;
  }

  .double-grid {
    grid-template-columns: 1fr;
  }

  /* Profile */
  .video-profile .profile-inner {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .video-profile .profile-image {
    max-width: 180px;
  }

  .profile-name {
    font-size: 22px;
  }

  .profile-tags li {
    font-size: 11px;
    padding: 3px 10px;
  }

  /* Pricing */
  .pricing-row {
    grid-template-columns: 1fr;
  }

  .pricing-row dt {
    border-right: none;
    border-bottom: 1px solid var(--line);
    padding: 12px 16px;
  }

  .pricing-row dd {
    padding: 14px 16px;
  }

  .purchase-card {
    min-width: unset;
    width: 100%;
    padding: 28px 20px;
  }

  /* CTA */
  .video-line .cta-box {
    padding: 36px 20px;
  }

}