@charset "UTF-8";
/*
import global components
*/
/*
#  scss mixin
1. background-image-retina
*/
/* about */
/*
    必須引数として「拡張子を除く画像パス」と「拡張子」を指定することで、メディアクエリのRetina対応コードを出力。
    */
/* usage */
/*
    // --- scss code
    .section--index.section--01.loaded {
        @include background-image-retina('../img/index/desktop/section--01', 'jpg');
        background-size: 1308px 600px;
    }

    // --- output css
    .section--index.section--01.loaded {
        background-image:url("../img/index/desktop/section--01.jpg");
        background-size:1308px 600px;
    }
    @media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi){
        .section--index.section--01.loaded {
            background-image:url("../img/index/desktop/section--01@2x.jpg");
        }
    }
    ---
    */
/*
import page components
*/
.billboard {
  overflow-x: hidden;
  overflow-y: visible;
  position: relative;
  padding: 0 0 40px 0;
}
.billboard .billboard-background {
  width: 100%;
  background: #0DB5C6;
  background: linear-gradient(138deg, rgb(0, 232, 254) 10%, rgb(35, 137, 150) 80%);
}
@media (max-width: 639px) {
  .billboard .billboard-background {
    height: 420px;
  }
}
@media (min-width: 640px) {
  .billboard .billboard-background {
    height: 690px;
  }
}
.billboard .billboard-background .billboard-typography {
  font-family: "Montserrat";
  position: absolute;
  top: -10px;
  left: 0;
  width: 140%;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  white-space: normal;
  overflow: hidden;
  font-weight: bold;
  color: #000;
  opacity: 0.3;
}
@media (max-width: 639px) {
  .billboard .billboard-background .billboard-typography {
    font-size: 90px;
    line-height: 80px;
    -webkit-line-clamp: 3;
  }
}
@media (min-width: 640px) {
  .billboard .billboard-background .billboard-typography {
    font-size: 240px;
    line-height: 210px;
    -webkit-line-clamp: 2;
  }
}
.billboard .billboard-background .shape-divider {
  position: absolute;
  bottom: 40px;
  left: 0;
  width: 100%;
  overflow: hidden;
  line-height: 0;
}
.billboard .billboard-background .shape-divider svg {
  position: relative;
  display: block;
  width: 100%;
}
@media (max-width: 639px) {
  .billboard .billboard-background .shape-divider svg {
    height: 103px;
  }
}
@media (min-width: 640px) {
  .billboard .billboard-background .shape-divider svg {
    height: 140px;
  }
}
.billboard .billboard-background .shape-divider .shape-fill {
  fill: #ffffff;
}
.billboard .billboard-image {
  position: absolute;
  left: 5%;
  width: 90%;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
}
@media (max-width: 639px) {
  .billboard .billboard-image {
    top: 20px;
    height: 400px;
  }
}
@media (min-width: 640px) {
  .billboard .billboard-image {
    top: 50px;
    height: 596px;
  }
}
.billboard .billboard-image img {
  max-width: 100%;
}
@media (max-width: 639px) {
  .billboard .billboard-image img {
    max-height: 360px;
    box-shadow: rgba(50, 50, 93, 0.45) 0px 30px 40px -12px, rgba(0, 0, 0, 0.6) 0px 18px 36px -18px;
  }
}
@media (min-width: 640px) {
  .billboard .billboard-image img {
    max-height: 596px;
    box-shadow: rgba(50, 50, 93, 0.45) 0px 30px 60px -12px, rgba(0, 0, 0, 0.6) 0px 18px 36px -18px;
  }
}

.overview {
  margin-top: -20px;
  padding: 0;
  text-align: center;
}
@media (max-width: 639px) {
  .overview > .view-area {
    width: 90%;
    margin: 0 auto;
    padding: 0;
  }
}
@media (min-width: 640px) {
  .overview > .view-area {
    overflow: visible;
    width: 90%;
    max-width: 1118px;
    margin: 0 auto;
    padding: 0;
  }
}
.overview .title {
  font-family: "Montserrat";
  font-weight: bold;
  color: #000;
}
@media (max-width: 639px) {
  .overview .title {
    font-size: 38px;
    line-height: 1;
  }
}
@media (min-width: 640px) {
  .overview .title {
    margin-bottom: 20px;
    font-size: 66px;
    line-height: 76px;
  }
}
.overview .tagline {
  margin-bottom: 40px;
  font-weight: normal;
  line-height: 1.5;
  color: #000;
}
@media (max-width: 639px) {
  .overview .tagline {
    font-size: 20px;
  }
}
@media (min-width: 640px) {
  .overview .tagline {
    font-size: 40px;
  }
}
.overview .introduction {
  text-align: left;
}
@media (min-width: 640px) {
  .overview .introduction {
    font-size: 20px;
  }
}

.main-video {
  position: relative;
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  background: #0DB5C6 no-repeat;
  background-position: center;
  background-size: cover;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22598.194%22%20height%3D%22567.764%22%20viewBox%3D%220%200%20598.194%20567.764%22%3E%3Cg%20transform%3D%22translate(0%20190.193)%20rotate(-20)%22%20opacity%3D%220.1%22%3E%3Cpath%20d%3D%22M158.039%2C260.228s-12.537-79.9-16.361-100.657c-3.272-18.536-5.757-33.21-11.21-57.93-4.913-22.514-6.444-29.226-11.9-45.119-2.731-7.508-6.882-17.464-16.706-17.464-8.729%2C0-13.213%2C9.988-15.936%2C17.936-4.912%2C15.452-7.1%2C23.9-11.468%2C44.646-4.91%2C23.392-7.5%2C36.748-11.872%2C58.375C58.222%2C182.53%2C51.848%2C220.99%2C46.768%2C260.228Z%22%20transform%3D%22translate(-46.768%20-39.059)%22%20fill-rule%3D%22evenodd%22%2F%3E%3Cg%20transform%3D%22translate(222.349)%22%3E%3Cpath%20d%3D%22M320.323%2C260.228s-12.537-79.9-16.36-100.657c-3.268-18.536-5.758-33.21-11.213-57.93-4.908-22.514-6.443-29.226-11.9-45.119-2.728-7.508-6.883-17.464-16.707-17.464-8.73%2C0-13.215%2C9.988-15.937%2C17.936-4.912%2C15.452-7.1%2C23.9-11.466%2C44.646-4.909%2C23.392-7.5%2C36.748-11.875%2C58.375C220.5%2C182.53%2C214.13%2C220.99%2C209.053%2C260.228Z%22%20transform%3D%22translate(-209.053%20-39.059)%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(444.81)%22%3E%3Cpath%20d%3D%22M482.695%2C260.228s-12.541-79.9-16.369-100.657c-3.266-18.536-5.758-33.21-11.209-57.93-4.912-22.514-6.447-29.226-11.9-45.119-2.728-7.508-6.884-17.464-16.7-17.464-8.729%2C0-13.215%2C9.988-15.942%2C17.936-4.905%2C15.452-7.1%2C23.9-11.464%2C44.646-4.912%2C23.392-7.5%2C36.748-11.87%2C58.375-4.367%2C22.514-10.739%2C60.973-15.816%2C100.212Z%22%20transform%3D%22translate(-371.419%20-39.059)%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(111.208%20221.105)%22%3E%3Cpath%20d%3D%22M127.935%2C200.436S140.48%2C280.344%2C144.3%2C301.094c3.268%2C18.531%2C5.76%2C33.209%2C11.212%2C57.931%2C4.91%2C22.517%2C6.44%2C29.222%2C11.9%2C45.119%2C2.728%2C7.508%2C6.886%2C17.466%2C16.707%2C17.466%2C8.73%2C0%2C13.217-9.989%2C15.939-17.938%2C4.911-15.451%2C7.094-23.9%2C11.462-44.648%2C4.915-23.392%2C7.507-36.749%2C11.875-58.377%2C4.365-22.508%2C10.739-60.97%2C15.814-100.212Z%22%20transform%3D%22translate(-127.935%20-200.436)%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(333.625%20221.105)%22%3E%3Cpath%20d%3D%22M290.27%2C200.436s12.548%2C79.908%2C16.363%2C100.658c3.272%2C18.531%2C5.763%2C33.209%2C11.215%2C57.931%2C4.911%2C22.517%2C6.44%2C29.222%2C11.9%2C45.119%2C2.728%2C7.508%2C6.883%2C17.466%2C16.7%2C17.466%2C8.726%2C0%2C13.214-9.989%2C15.942-17.938%2C4.9-15.451%2C7.1-23.9%2C11.462-44.648%2C4.913-23.392%2C7.5-36.749%2C11.871-58.377%2C4.368-22.508%2C10.741-60.97%2C15.817-100.212Z%22%20transform%3D%22translate(-290.27%20-200.436)%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  color: #fff;
}
@media (max-width: 639px) {
  .main-video {
    margin: 0;
    padding: 40px 5% 60px;
  }
}
@media (min-width: 640px) {
  .main-video {
    display: grid;
    gap: 20px;
    grid-template-columns: 1fr minmax(400px, 1fr);
    align-items: center;
    margin: 0;
    padding: 60px 5%;
  }
}
.main-video .title {
  font-family: "Montserrat";
}
@media (max-width: 639px) {
  .main-video .title {
    font-size: 38px;
  }
}
@media (min-width: 640px) {
  .main-video .title {
    margin-bottom: 10px;
    font-size: 60px;
    line-height: 0.9;
  }
}
@media (min-width: 640px) {
  .main-video .description {
    display: flex;
    align-items: center;
  }
}
@media (min-width: 640px) {
  .main-video .video {
    grid-row-start: 1;
  }
}
.main-video .youtube {
  z-index: 1;
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 10px 50px;
}
@media (max-width: 639px) {
  .main-video .youtube {
    margin-top: 40px;
  }
}
.main-video .youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.contents {
  background-color: #f8f8f8;
}
.contents > .view-area {
  padding: 0;
}
@media (max-width: 639px) {
  .contents > .view-area {
    width: 90%;
    margin: 0 auto;
  }
}
@media (min-width: 640px) {
  .contents > .view-area {
    overflow: visible;
    width: 90%;
    max-width: 1118px;
    margin: 0 auto;
  }
}
@media (max-width: 639px) {
  .contents > .view-area > .section {
    padding: 60px 0 0 0;
  }
}
@media (min-width: 640px) {
  .contents > .view-area > .section {
    padding: 80px 0 0 0;
  }
}
@media (max-width: 639px) {
  .contents > .view-area > .section:last-child {
    padding-bottom: 60px;
  }
}
@media (min-width: 640px) {
  .contents > .view-area > .section:last-child {
    padding-bottom: 80px;
  }
}

.section__features ul li {
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2014%2014%22%3E%3Cpath%20d%3D%22M7%2C0A6.957%2C6.957%2C0%2C0%2C0%2C0%2C7a6.957%2C6.957%2C0%2C0%2C0%2C7%2C7%2C6.957%2C6.957%2C0%2C0%2C0%2C7-7A6.957%2C6.957%2C0%2C0%2C0%2C7%2C0ZM9.9%2C6%2C6.8%2C9.1a1.421%2C1.421%2C0%2C0%2C1-.6.2.764.764%2C0%2C0%2C1-.5-.2L4.1%2C7.5A.778.778%2C0%2C0%2C1%2C5.2%2C6.4l1%2C1L8.8%2C4.8a.785.785%2C0%2C0%2C1%2C1.1%2C0A.91.91%2C0%2C0%2C1%2C9.9%2C6Z%22%20fill%3D%22%230db5c6%22%2F%3E%3C%2Fsvg%3E");
}
.section__features ul li:not(:last-child) {
  margin-bottom: 6px;
}
@media (max-width: 639px) {
  .section__features ul li {
    padding-left: 1.4rem;
    background-position: 2px 6px;
  }
}
@media (min-width: 640px) {
  .section__features ul li {
    padding-left: 1.6rem;
    background-position: 0 7px;
    background-size: 18px;
  }
}

@media (min-width: 640px) {
  .section__videos {
    padding-right: 0;
    padding-bottom: 50px;
  }
}

.section__contents {
  border-bottom: 1px solid #ddd;
}
.section__contents .title {
  font-weight: normal;
  line-height: 1.3;
}
@media (max-width: 639px) {
  .section__contents .title {
    margin-bottom: 10px;
    font-size: 1.62rem;
  }
}
@media (min-width: 640px) {
  .section__contents .title {
    margin-bottom: 20px;
    font-size: 2.5rem;
  }
}
@media (max-width: 639px) {
  .section__contents .title:not(:first-child) {
    padding-top: 40px;
  }
}
@media (min-width: 640px) {
  .section__contents .title:not(:first-child) {
    padding-top: 80px;
  }
}
.section__contents > p {
  margin-bottom: 20px;
}
.section__contents > .image_wrap {
  width: 100%;
  height: auto;
  max-height: 800px;
  margin: 0 auto 40px;
}
.section__contents > .image_wrap .image {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 800px;
  margin: 0 auto;
}

.section__systemrequirements {
  padding: 0;
  background-color: #f8f8f8;
}
.section__systemrequirements__SOUNDGRID {
  background-color: #eaeaea;
}
@media (max-width: 639px) {
  .section__systemrequirements > .view-area {
    width: 90%;
    margin: 0 auto;
    padding: 60px 0;
  }
}
@media (min-width: 640px) {
  .section__systemrequirements > .view-area {
    overflow: visible;
    width: 90%;
    max-width: 1118px;
    margin: 0 auto;
    padding: 80px 0;
  }
}
@media (min-width: 640px) {
  .section__systemrequirements > .view-area .title {
    margin-bottom: 20px;
  }
}
.section__systemrequirements > .view-area .subtitle {
  margin: 0;
  font-weight: bold;
  color: #000;
}
@media (max-width: 639px) {
  .section__systemrequirements > .view-area .subtitle {
    padding: 20px 0 0 0;
    font-size: 1.1rem;
  }
}
@media (min-width: 640px) {
  .section__systemrequirements > .view-area .subtitle {
    padding: 0;
    font-size: 18px;
  }
}
@media (min-width: 640px) {
  .section__systemrequirements > .view-area > div {
    display: grid;
    gap: 20px;
    grid-template-columns: 1fr 1fr;
  }
  .section__systemrequirements > .view-area > div:not(:last-child) {
    margin-bottom: 40px;
  }
}
.section__systemrequirements > .view-area ul {
  margin: 0;
  padding: 0;
  font-weight: bold;
  color: #000;
}
.section__systemrequirements > .view-area ul li {
  margin-left: 20px;
  font-size: 0.9rem;
  font-weight: normal;
  color: #707070;
}
.section__systemrequirements > .view-area a {
  color: #000;
  text-decoration: underline;
}
.section__systemrequirements > .view-area .notice p {
  font-size: 0.9rem;
  font-weight: normal;
  color: #ff0000;
}
.section__systemrequirements > .view-area .notice p:not(:last-child) {
  margin-bottom: 1em;
}

.bottom_cta {
  padding: 0;
}
.bottom_cta > .view-area {
  padding: 0;
}
@media (max-width: 639px) {
  .bottom_cta > .view-area {
    width: 90%;
    margin: 0 auto;
    padding: 60px 0 0;
  }
}
@media (min-width: 640px) {
  .bottom_cta > .view-area {
    overflow: visible;
    width: 90%;
    max-width: 1118px;
    margin: 0 auto;
    padding: 80px 0 0;
  }
}
.bottom_cta > .view-area > .cta {
  padding: 0;
}
@media (max-width: 639px) {
  .bottom_cta > .view-area > .cta > .requirements {
    display: none;
  }
}

.section__included_in {
  padding: 0;
}
@media (max-width: 639px) {
  .section__included_in > .view-area {
    width: 90%;
    margin: 0 auto;
    padding: 0 0 60px 0;
  }
}
@media (min-width: 640px) {
  .section__included_in > .view-area {
    overflow: visible;
    width: 90%;
    max-width: 1118px;
    margin: 0 auto;
    padding: 0 0 80px;
  }
}
@media (min-width: 640px) {
  .section__included_in > .view-area > .text {
    margin-bottom: 20px;
  }
}

.section__article {
  padding: 0;
}
@media (max-width: 639px) {
  .section__article > .view-area {
    width: 90%;
    margin: 0 auto;
    padding: 0 0 60px 0;
  }
}
@media (min-width: 640px) {
  .section__article > .view-area {
    overflow: visible;
    width: 90%;
    max-width: 1118px;
    margin: 0 auto;
    padding: 0 0 50px;
  }
}

.section__recomend_items {
  padding: 0;
}
@media (max-width: 639px) {
  .section__recomend_items > .view-area {
    width: 90%;
    margin: 0 auto;
    padding: 0 0 60px 0;
  }
}
@media (min-width: 640px) {
  .section__recomend_items > .view-area {
    overflow: visible;
    width: 90%;
    max-width: 1118px;
    margin: 0 auto;
    padding: 0 0 80px;
  }
}

.section__wup {
  padding: 0;
  background-color: #f8f8f8;
  text-align: center;
}
@media (max-width: 639px) {
  .section__wup > .view-area {
    width: 90%;
    margin: 0 auto;
    padding: 60px 0;
  }
}
@media (min-width: 640px) {
  .section__wup > .view-area {
    overflow: visible;
    width: 90%;
    max-width: 1118px;
    margin: 0 auto;
    padding: 80px 0;
  }
}
.section__wup > .view-area > svg {
  fill: #000;
}
@media (max-width: 639px) {
  .section__wup > .view-area > svg {
    width: 50px;
    height: 40px;
  }
}
@media (min-width: 640px) {
  .section__wup > .view-area > svg {
    width: 60px;
    height: 48px;
  }
}
.section__wup > .view-area .title {
  font-family: "Montserrat";
  font-weight: bold;
}
@media (max-width: 639px) {
  .section__wup > .view-area .title {
    font-size: 22px;
  }
}
@media (min-width: 640px) {
  .section__wup > .view-area .title {
    font-size: 36px;
  }
}
.section__wup > .view-area .text {
  text-align: left;
  padding-top: 20px;
}
.section__wup > .view-area ul {
  padding-top: 20px;
  text-align: left;
}
.section__wup > .view-area ul li {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2014%2014%22%3E%3Cpath%20d%3D%22M7%2C0A6.957%2C6.957%2C0%2C0%2C0%2C0%2C7a6.957%2C6.957%2C0%2C0%2C0%2C7%2C7%2C6.957%2C6.957%2C0%2C0%2C0%2C7-7A6.957%2C6.957%2C0%2C0%2C0%2C7%2C0ZM9.9%2C6%2C6.8%2C9.1a1.421%2C1.421%2C0%2C0%2C1-.6.2.764.764%2C0%2C0%2C1-.5-.2L4.1%2C7.5A.778.778%2C0%2C0%2C1%2C5.2%2C6.4l1%2C1L8.8%2C4.8a.785.785%2C0%2C0%2C1%2C1.1%2C0A.91.91%2C0%2C0%2C1%2C9.9%2C6Z%22%20fill%3D%22%230db5c6%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
}
@media (max-width: 639px) {
  .section__wup > .view-area ul li {
    padding-left: 1.4rem;
    background-position: 2px 6px;
  }
}
@media (min-width: 640px) {
  .section__wup > .view-area ul li {
    padding-left: 1.6rem;
    background-position: 0 7px;
  }
}
.section__wup > .view-area ul li:not(:last-child) {
  margin-bottom: 6px;
}

.cta {
  display: grid;
}
@media (max-width: 639px) {
  .cta {
    gap: 10px;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    grid-template-rows: auto auto;
    padding: 0;
  }
}
@media (min-width: 640px) {
  .cta {
    gap: 20px;
    grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
    padding: 80px 0 0;
  }
  .cta > div {
    position: relative;
  }
  .cta > div:not(:last-child)::after {
    content: "";
    position: absolute;
    width: 0;
    height: 100%;
    top: 0;
    right: 10px;
    margin: -20px;
  }
}
.cta .price {
  text-align: left;
  margin: 30px 20px 0 0;
}
.cta .price .licence {
  font-weight: bold;
}
.cta .price p.licence.nosbsc {
  display: none;
}
.cta .price .licence_detail {
  font-size: 12px;
}
.cta .price .licence_price {
  margin: 18px 0 0 0;
}
.cta .price .sbsc_wrap {
  display: flex;
}
.cta .price span.sbsc_e {
  display: block;
  width: 160px;
  height: 26px;
  padding: 6px;
  margin: 10px 5px 0 0;
  line-height: 10px;
  font-size: 15px;
  background: #24284b;
  color: white;
}
.cta .price span.sbsc_u {
  display: block;
  width: 200px;
  height: 26px;
  padding: 6px;
  margin: 10px 0;
  line-height: 10px;
  font-size: 15px;
  background: #ff7a00;
  color: white;
}
@media (max-width: 639px) {
  .cta .price {
    margin: 30px 0px 0 0;
  }
}
@media (min-width: 640px) {
  .cta .price {
    display: block;
    align-items: center;
  }
}
@media (max-width: 639px) {
  .cta .price .no-discount-label {
    font-size: 14px;
  }
}
@media (min-width: 640px) {
  .cta .price .no-discount-label {
    font-size: 16px;
  }
}
.cta .price .full_price {
  font-size: 16px;
}
.cta .price .full_price::before {
  content: "通常価格 ¥";
  font-size: 0.7em;
  padding-right: 2px;
}
.cta .price .full_price::after {
  content: "（税込）";
  position: relative;
  font-size: 0.7em;
  font-weight: normal;
}
.cta .price .discount {
  display: inline-block;
  position: relative;
  bottom: 5px;
  background-color: #000;
  font-size: 0.8em;
  color: #fff;
}
@media (max-width: 639px) {
  .cta .price .discount {
    padding: 0 0.5em 0 0.6em;
  }
}
@media (min-width: 640px) {
  .cta .price .discount {
    margin-right: 6px;
    padding: 0 0.7em 0 0.8em;
  }
}
.cta .price .current_price {
  font-weight: bold;
  color: #000;
}
@media (max-width: 639px) {
  .cta .price .current_price {
    font-size: 32px;
    line-height: 1.2;
  }
}
@media (min-width: 640px) {
  .cta .price .current_price {
    font-size: 40px;
    line-height: 0.8;
  }
}
.cta .price .current_price::before {
  content: "¥";
  padding-right: 2px;
  font-size: 0.7em;
  font-weight: normal;
}
.cta .price .current_price::after {
  content: "（税込）";
  position: relative;
  bottom: 2px;
  font-size: 10px;
  font-weight: normal;
}
@media only screen and (max-width: 400px) {
  .cta .price .current_price::after {
    display: none;
  }
}
.cta .price .open_price {
  font-weight: bold;
  color: #000;
}
@media (max-width: 639px) {
  .cta .price .open_price {
    font-size: 21px;
    line-height: 1.3;
  }
}
@media (min-width: 640px) {
  .cta .price .open_price {
    font-size: 30px;
    line-height: 1;
  }
}
.cta > .getfree {
  text-align: left;
}
.cta > .getfree > span {
  display: block;
  padding-top: 7px;
  text-transform: uppercase;
  font-weight: bold;
  color: #000;
}
@media (max-width: 639px) {
  .cta > .getfree > span {
    font-size: 32px;
    line-height: 1.2;
  }
}
@media (min-width: 640px) {
  .cta > .getfree > span {
    font-size: 45px;
    line-height: 0.8;
  }
}
.cta > .getfree > span::after {
  content: "無償で利用可能";
  position: relative;
  margin-left: 5px;
  font-weight: normal;
}
@media (max-width: 639px) {
  .cta > .getfree > span::after {
    font-size: 12px;
  }
}
@media (min-width: 640px) {
  .cta > .getfree > span::after {
    font-size: 16px;
  }
}
@media (max-width: 639px) {
  .cta > .getfree > .help {
    line-height: 1;
  }
}
@media (min-width: 640px) {
  .cta > .getfree > .help {
    padding-top: 4px;
  }
}
.cta > .getfree > .help a {
  color: #000;
}
@media (max-width: 639px) {
  .cta > .getfree > .help a {
    font-size: 12px;
  }
}
@media (min-width: 640px) {
  .cta > .getfree > .help a {
    font-size: 16px;
  }
}
.cta > .include_in {
  text-align: left;
}
@media (max-width: 639px) {
  .cta > .include_in {
    grid-column: 1/3;
  }
}
@media (min-width: 640px) {
  .cta > .include_in {
    grid-column: 2/4;
    display: flex;
    align-items: center;
  }
}
@media (max-width: 639px) {
  .cta > .include_in > p {
    font-size: 15px;
    line-height: 1.8;
  }
}
@media (min-width: 640px) {
  .cta > .include_in > p {
    padding-right: 20px;
    font-size: 16px;
    line-height: 1.4;
  }
}
.cta > .include_in > p > a {
  color: #000;
}
.cta .buy,
.cta .get {
  text-align: right;
}
.cta .buy a,
.cta .get a {
  position: relative;
  display: inline-block;
  height: 46px;
  border-radius: 23px;
  background-color: #0DB5C6;
  font-size: 20px;
  line-height: 46px;
  color: #fff;
  text-decoration: none;
  text-align: center;
}
@media (max-width: 639px) {
  .cta .buy a,
  .cta .get a {
    top: -50px;
    width: 100%;
    max-width: 110px;
  }
}
@media (min-width: 640px) {
  .cta .buy a,
  .cta .get a {
    top: -53px;
    left: -10px;
    width: 110px;
  }
}
.cta .buy.select a {
  top: -48px;
}
@media (max-width: 639px) {
  .cta .get a {
    top: 0;
  }
}
@media (min-width: 640px) {
  .cta .get a {
    top: 2px;
  }
}
.cta .grade_btn {
  display: flex;
  align-items: center;
}
.cta .ultimate_btn {
  float: left;
  padding: 5px;
  background: #ff7a00;
  color: white;
  font-weight: bold;
  border-radius: 10px;
  width: 150px;
  text-align: center;
}
.cta p.essential_btn {
  float: left;
  padding: 5px;
  background: #24284b;
  color: white;
  font-weight: bold;
  border-radius: 10px;
  width: 150px;
  margin-right: 10px;
  text-align: center;
}

.requirements {
  display: flex;
  align-items: center;
  margin: 0 auto 20px;
  justify-content: center;
}
@media (max-width: 639px) {
  .requirements {
    grid-column: 1/3;
    align-self: end;
    padding: 20px 0 60px 0;
  }
}
.requirements .icons {
  display: flex;
  align-items: center;
}
@media (max-width: 639px) {
  .requirements .icons {
    margin-right: 5px;
  }
}
@media (min-width: 640px) {
  .requirements .icons {
    margin-right: 10px;
  }
}
.requirements .icons > svg {
  margin-right: 5px;
}
@media (max-width: 639px) {
  .requirements .icons > svg {
    width: 30px;
    height: 30px;
  }
}
@media (min-width: 640px) {
  .requirements .icons > svg {
    width: 51px;
    height: 51px;
  }
}
.requirements .text {
  line-height: 1.4;
}
@media (max-width: 639px) {
  .requirements .text {
    font-size: 10px;
  }
}
@media (min-width: 640px) {
  .requirements .text {
    padding-right: 20px;
    font-size: 16px;
  }
}
.requirements .text .link {
  padding-left: 1rem;
  color: #000;
}

@media (max-width: 879px) {
  .no_subsc_wrap {
    margin: 60px 0;
  }
}
@media (min-width: 880px) {
  .no_subsc_wrap {
    display: flex;
    margin: 40px 0;
  }
}
@media (max-width: 879px) {
  .no_subsc_wrap .requirements.no_subsc {
    margin: 0;
    padding: 0;
    justify-content: flex-start;
  }
}
@media (min-width: 880px) {
  .no_subsc_wrap .requirements.no_subsc {
    min-width: 320px;
  }
}
@media (max-width: 879px) {
  .no_subsc_wrap .requirements.no_subsc .icons {
    width: 66px;
    height: 34.16px;
  }
}
@media (min-width: 880px) {
  .no_subsc_wrap .requirements.no_subsc .icons {
    width: 98.52px;
    height: 51px;
  }
}
.no_subsc_wrap .cta.no_subsc {
  display: grid;
}
.no_subsc_wrap .cta.no_subsc:not(:has(div)) {
  display: none;
}
.no_subsc_wrap .cta.no_subsc > div:not(:last-child)::after {
  display: none;
}
@media (max-width: 879px) {
  .no_subsc_wrap .cta.no_subsc {
    border: none;
    padding: 0;
  }
}
@media (min-width: 880px) {
  .no_subsc_wrap .cta.no_subsc {
    padding: 0 0 30px 40px;
    border-left: 1px solid #000;
  }
}
.no_subsc_wrap .cta.no_subsc .getfree {
  margin-top: 40px;
}
.no_subsc_wrap .cta.no_subsc .getfree + .get a {
  position: absolute;
  top: -70px;
  left: auto;
  right: 0;
}
.no_subsc_wrap .cta.no_subsc .price .buy a {
  position: absolute;
  top: auto;
  bottom: 0;
  left: auto;
  right: 0;
}

.price_content {
  padding: 0 0 0 30px;
}
@media (max-width: 639px) {
  .price_content {
    border-left: none;
    padding: 0;
  }
}

/*
Overwrite
*/
.content_class_plugin.soundgrid-rack-for-venue .cta .requirements {
  visibility: hidden;
}