/* =============================================================
   PC base styles
   ============================================================= */

/* =============================================================
   assistup - VPSページ専用スタイル
   ============================================================= */

/* VPSページ固有のCSS変数上書きはここに記述 */

/* =============================================================
   セクションタイトル個別余白
   font-size / font-weight / text-align は components/section.css の
   .section-title / .section-title--center が dual-class で提供する。
   ここではページ固有の margin-bottom 等のみを記述。
   ============================================================= */

   .vps-about__title,
   .vps-necessity__title,
   .vps-capabilities__title {
     margin-bottom: 24px;
   }
   
   .vps-problems__title,
   .vps-reasons__title,
   .vps-faq__title,
   .vps-comparison__title {
     margin-bottom: 60px;
   }
   
   .vps-problems__title {
     margin-bottom: 40px;
   }
   
   .vps-failures__title {
     margin-bottom: 0;
   }
   
   .vps-trust__title {
     margin-bottom: 30px !important;
   }
   
   /* =============================================================
      MV（メインビジュアル）セクション
      ============================================================= */
   
   .vps-mv {
     position: relative;
     overflow: hidden;
     min-height: 475px;
     padding-block: 45px;
     background: #FFCD00;
     background-size: cover;
     color: #ffffff;
   }
   
   .vps-mv__inner {
     position: relative;
     display: grid;
     grid-template-columns: minmax(0, 442px) minmax(0, 663px);
     align-items: center;
     justify-content: space-between;
     gap: 64px;
     max-width: 1200px;
   }
   
   .vps-mv__content {
     max-width: 442px;
   }
   
   .vps-mv__badge {
     display: inline-grid;
     grid-template-columns: 24px auto;
     align-items: center;
     gap: 9px;
     margin-bottom: 10px;
     font-size: 20px;
     font-weight: 700;
   }
   
   .vps-mv__badge img {
     width: 24px;
     height: 24px;
   }
   
   .vps-mv__title {
     font-size: 64px;
     font-weight: 700;
     line-height: 1;
     margin-bottom: 18px;
     white-space: nowrap;
     width: 100%;
   }
   
   .vps-mv__description {
     font-size: 22px;
     font-weight: 500;
     margin-bottom: 16px;
   }
   
   .vps-mv__price {
     display: inline-grid;
     grid-template-columns: auto auto;
     align-items: stretch;
     gap: 8px;
     margin: 24px 0;
     overflow: hidden;
     background: #ffffff;
     color: #111111;
     border-radius: 1px;
     padding-right: 8px;
   }
   
   .vps-mv__price-label {
     display: inline-grid;
     align-items: center;
     justify-content: center;
     background: #0068b7;
     color: white;
     font-size: 14px;
     font-weight: 700;
     padding: 3px 13px;
   }
   
   .vps-mv__price-value {
     font-size: 20px;
     font-weight: 700;
   }
   
   .vps-mv__price-unit {
     font-size: 12px;
   }
   
   .vps-mv__trial {
     position: relative;
     text-align: center;
   }
   
   .vps-mv__trial-heading {
     display: inline-block;
     font-size: 24px;
     font-weight: 700;
     margin-bottom: 10px;
     padding-bottom: 5px;
     border-bottom: 2px solid #ffd724;
   }
   
   .vps-mv__trial-heading strong {
     font-weight: 700;
   }
   
   .vps-mv__trial-footnote-inline {
     font-size: 10px;
     vertical-align: super;
     position: relative;
     top: -4px;
   }
   
   .vps-mv__trial-note {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 9px;
     font-size: 18px;
     font-weight: 700;
     margin-bottom: 8px;
     position: relative;
   }
   
   .vps-mv__trial-note::before,
   .vps-mv__trial-note::after {
     content: "";
     width: 8px;
     height: 15px;
     background-size: contain;
     background-repeat: no-repeat;
     background-position: center;
     flex-shrink: 0;
   }
   
   .vps-mv__trial-note::before {
     background-image: url("../../img/vps/mv-slash-right.svg");
   }
   
   .vps-mv__trial-note::after {
     background-image: url("../../img/vps/mv-slash-left.svg");
   }
   
   .vps-mv__trial-btn {
     display: inline-grid;
     grid-template-columns: auto 21px;
     align-items: center;
     justify-content: center;
     gap: 21px;
     width: 100%;
     max-width: 442px;
     height: 74px;
     background: #ff8802;
     color: #ffffff;
     font-size: 26px;
     font-weight: 700;
     text-decoration: none;
     border-radius: 10px;
     position: relative;
     overflow: hidden;
     transition: filter 0.2s ease;
     isolation: isolate;
   }
   
   .vps-mv__trial-btn::before {
     content: "";
     position: absolute;
     inset: 0;
     background: radial-gradient(ellipse 100% 100px at 50% -20%, rgba(255, 169, 89, 0.9) 0%, rgba(255, 169, 89, 0.9) 50%, rgba(255, 169, 89, 0.3) 55%, transparent 60%);
     pointer-events: none;
     z-index: -1;
   }
   
   .vps-mv__trial-btn::after {
     content: "";
     position: relative;
     z-index: 1;
     width: 21px;
     height: 21px;
     background: url("../../img/common/icon-arrow-b-white.svg") center / contain no-repeat;
   }
   
   .vps-mv__trial-btn:hover {
     filter: brightness(0.9);
   }
   
   .vps-mv__trial-footnote {
     font-size: 12px;
     font-weight: 500;
     text-align: right;
     margin-top: 8px;
   }
   
   .vps-mv__visual {
     display: grid;
     align-items: center;
     justify-content: center;
     /* max-width: 663px; */
   }
   
   .vps-mv__visual img {
     /*width: 100%;*/
     height: auto;
     max-width: 400px;
   }
   
   /* =============================================================
      共通セクションスタイル
      ============================================================= */
   
   .section-title {
     font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
     font-size: 32px;
     font-weight: 700;
     text-align: center;
     margin-bottom: 40px;
   }
   
   .section-lead {
     font-size: 18px;
     text-align: center;
     margin-bottom: 64px;
   }
   
   /* =============================================================
      VPSとは (PC_VPSとは)
      ============================================================= */
   
   .vps-about {
     padding: 100px 0;
     background: #FFF2B9;
   }
   
   .vps-about__header {
     text-align: center;
     margin-bottom: 60px;
   }
   
   .vps-about__illust {
     background: #ffffff;
     border: 1px solid #e4e4e4;
     border-radius: 10px;
     padding: 80px 120px;
     max-width: 1200px;
     margin: 0 auto;
   }
   
   .vps-about__illust-title {
     font-size: 22px;
     font-weight: 500;
     text-align: center;
     margin-bottom: 40px;
   }
   
   .vps-about__illust-content {
     margin-bottom: 40px;
     text-align: center;
   }
   
   .vps-about__illust-content img {
     max-width: 100%;
     margin: 0 auto;
     height: auto;
   }
   
   .vps-about__note {
     background: rgba(242, 244, 248, 0.6);
     border-radius: 5px;
     padding: 28px 67px;
   }
   
   .vps-about__note p {
     margin: 0;
   }
   
   /* =============================================================
      こんなお悩みありませんか？ (PC_お悩み)
      ============================================================= */
   
   .vps-problems {
     padding: 100px 0;
     background: #f4f4f5;
     position: relative;
   }
   
   .vps-problems__grid {
     display: grid;
     grid-template-columns: repeat(5, 202px);
     align-items: stretch;
     justify-content: center;
     gap: 20px;
   }
   
   .vps-problems__card {
     display: grid;
     grid-template-rows: 60px auto;
     align-items: center;
     justify-items: center;
     gap: 10px;
     background: #d9d9d9;
     border-radius: 9px;
     width: 202px;
     padding: 29px 25px;
     position: relative;
   }
   
   .vps-problems__icon {
     width: 60px;
     height: 60px;
     display: grid;
     align-items: center;
     justify-content: center;
   }
   
   .vps-problems__icon img {
     max-width: 100%;
     max-height: 100%;
     object-fit: contain;
   }
   
   .vps-problems__text {
     font-size: 14px;
     text-align: center;
     margin: 0;
   }
   
   .vps-problems__divider {
     width: 100%;
     height: 74px;
     display: grid;
     align-items: center;
     justify-content: center;
     position: relative;
   }
   
   .vps-problems__divider::before {
     content: "";
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translateX(-50%);
     width: 1px;
     height: 74px;
     background: #000;
   }
   
   .vps-problems__solution {
     background: #ffffff;
     border-radius: 10px;
     padding: 80px 0;
     max-width: 1200px;
     margin: 0 auto;
   }
   
   .vps-problems__solution-title {
     font-size: 32px;
     font-weight: 700;
     text-align: center;
     margin-bottom: 40px;
   }
   
   .vps-problems__solution-highlight {
     display: inline-block;
   }
   
   .vps-problems__solution-accent {
     color: #FFCD00;
   }
   
   .vps-problems__solution-grid {
     display: grid;
     grid-template-columns: repeat(5, 202px);
     align-items: stretch;
     gap: 18px;
     justify-content: center;
     padding: 0 60px;
   }
   
   .vps-problems__solution-card {
     display: grid;
     grid-template-rows: 46px auto;
     align-items: center;
     justify-items: center;
     background: #ffffff;
     border: 1px solid #dbe5f3;
     border-radius: 9px;
     width: 202px;
     padding: 33px 10px 20px;
     position: relative;
   }
   
   .vps-problems__solution-card::before {
     content: "";
     position: absolute;
     top: -17.5px;
     left: 50%;
     transform: translateX(-50%);
     width: 35px;
     height: 35px;
     background: url("../../img/common/icon-check-green.svg") center / contain no-repeat;
   }
   
   .vps-problems__solution-icon {
     width: 46px;
     height: 46px;
     display: grid;
     align-items: center;
     justify-content: center;
   }
   
   .vps-problems__solution-icon img {
     max-width: 100%;
     max-height: 100%;
     object-fit: contain;
   }
   
   .vps-problems__solution-text {
     font-size: 14px;
     text-align: center;
     margin: 0;
     padding: 15px 8px 0;
   }
   
   .vps-problems__solution-text strong {
     font-weight: 500;
   }
   
   /* =============================================================
      あなたの会社にVPSは本当に必要？ (PC_必要)
      ============================================================= */
   
   .vps-necessity {
     padding: 100px 0;
     background: #ffffff;
   }
   
   .vps-necessity__header {
     text-align: center;
     margin-bottom: 50px;
   }
   
   .vps-necessity__label {
     font-size: 22px;
     font-weight: 500;
     color: #FFCD00;
     margin-bottom: 0;
   }
   
   .vps-necessity__subtitle {
     font-size: 18px;
     font-weight: 500;
     margin-bottom: 0;
   }
   
   .vps-necessity__checklist {
     background: url("../../img/common/necessity-bg.svg") center / cover no-repeat;
     min-height: 266px;
     border-radius: 10px;
     margin-bottom: 24px;
     display: grid;
     grid-template-columns: 268px 1fr;
     align-items: center;
     gap: 20px;
     padding: 7px 172px 37px;
     max-width: 1080px;
     margin-left: auto;
     margin-right: auto;
   }
   
   .vps-necessity__visual img {
     width: 297px;
     height: 189px;
     object-fit: cover;
   }
   
   .vps-necessity__items {
     display: grid;
     gap: 0;
     padding-top: 20px;
   }
   
   .vps-necessity__item {
     font-size: 18px;
     font-weight: 500;
     margin: 0;
   }
   
   .vps-necessity__item:not(:last-child) {
     margin-bottom: 1em;
   }
   
   .vps-necessity__result {
     font-size: 18px;
     font-weight: 500;
     text-align: center;
     margin-bottom: 24px;
   }
   
   .vps-necessity__recommend {
     background: #eefafa;
     border-radius: 5px;
     padding: 10px;
     max-width: 779px;
     margin: 0 auto;
   }
   
   .vps-necessity__recommend-text {
     font-size: 22px;
     font-weight: 700;
     color: #31c0c5;
     text-align: center;
     margin: 0;
   }
   
   /* =============================================================
      VPSでできること (PC_できること)
      ============================================================= */
   
   .vps-capabilities {
     padding: 100px 0 70px;
     background: #FFF2B9;
   }
   
   .vps-capabilities__header {
     text-align: center;
     margin-bottom: 50px;
   }
   
   .vps-capabilities__subtitle {
     font-size: 18px;
     font-weight: 500;
   }
   
   .vps-capabilities__grid {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     gap: 24px;
     margin-bottom: 80px;
     max-width: 1200px;
     margin-left: auto;
     margin-right: auto;
   }
   
   .vps-capabilities__card {
     display: grid;
     grid-template-columns: 150px 1fr;
     background: #ffffff;
     border: 1px solid #dbe5f3;
     border-radius: 10px;
     align-items: center;
     gap: 70px;
     padding: 27px 65px;
   }
   
   .vps-capabilities__icon {
     width: 150px;
     height: 150px;
   }
   
   .vps-capabilities__icon img {
     width: 100%;
     height: 100%;
     object-fit: contain;
   }
   
   .vps-capabilities__card-title {
     font-size: 20px;
     margin: 0;
   }
   
   .vps-capabilities__scenes {
     margin-bottom: 70px;
   }
   
   .vps-capabilities__scenes-title {
     font-size: 32px;
     font-weight: 700;
     text-align: center;
     margin-bottom: 50px;
   }
   
   .vps-capabilities__scenes-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 25px;
     max-width: 1200px;
     margin: 0 auto;
   }
   
   .vps-capabilities__scene {
     text-align: center;
   }
   
   .vps-capabilities__scene img {
     width: 100%;
     height: auto;
     aspect-ratio: 281/265;
     border-radius: 10px;
     object-fit: cover;
     margin-bottom: 10px;
     /* 画像に青いオーバーレイをかける */
     filter: brightness(0.85);
   }
   
   .vps-capabilities__scene-title {
     font-size: 22px;
     font-weight: 500;
     margin: 0;
   }
   
   .vps-capabilities__cta {
     text-align: center;
     max-width: 385px;
     margin: 0 auto;
   }
   
   .vps-capabilities__cta-label {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 6px;
     font-weight: 700;
     margin-bottom: 6px;
     position: relative;
   }
   
   .vps-capabilities__cta-label::before,
   .vps-capabilities__cta-label::after {
     content: "";
     width: 8px;
     height: 14px;
     background-size: contain;
     background-repeat: no-repeat;
     background-position: center;
     flex-shrink: 0;
   }
   
   .vps-capabilities__cta-label::before {
     background-image: url("../../img/vps/mv-slash-right-black.svg");
   }
   
   .vps-capabilities__cta-label::after {
     background-image: url("../../img/vps/mv-slash-left-black.svg");
   }
   
   .vps-capabilities__cta-btn {
     display: grid;
     grid-template-columns: auto 16px;
     align-items: center;
     justify-content: center;
     gap: 16px;
     width: 100%;
     height: 65px;
     background: #ffffff;
     border: 2px solid #FFCD00;
     border-radius: 10px;
     font-size: 20px;
     font-weight: 700;
     color: #FFCD00;
     text-decoration: none;
     transition:
       background-color 0.2s ease,
       color 0.2s ease;
   }
   
   .vps-capabilities__cta-btn::after {
     content: "";
     width: 11px;
     height: 18px;
     background: url("../../img/common/icon_arrow-blue.svg") center / contain no-repeat;
   }
   
   .vps-capabilities__cta-btn:hover {
     background: #FFCD00;
     color: #ffffff;
   }
   
   .vps-capabilities__cta-btn:hover::after {
     background-image: url("../../img/common/icon_arrow-white.svg");
   }
   
   /* =============================================================
      VPSでよくある失敗 (PC_失敗)
      ============================================================= */
   
   .vps-failures {
     padding: 100px 0;
     margin: 100px 0;
     /* TODO: 画像を assets/img/vps/failures-bg.png として配置後、以下を有効化 */
     /* background: url("../../img/vps/failures-bg.png") no-repeat center; */
     /* background-size: cover; */
     background: #f2f4f8; /* 暫定: 薄グレー背景 */
   }
   
   .vps-failures__header {
     text-align: center;
     margin-bottom: 50px;
   }
   
   .vps-failures__subtitle {
     font-size: 24px;
     font-weight: 700;
   }
   
   .vps-failures__highlight {
     color: #FFCD00;
   }
   
   .vps-failures__grid {
     display: grid;
     grid-template-columns: repeat(3, minmax(0, 379px));
     gap: 32px;
     max-width: 1200px;
     margin: 0 auto;
     padding: 0 30px;
     justify-content: center;
   }
   
   .vps-failures__card {
     width: 100%;
     display: grid;
     grid-template-rows: auto auto;
     gap: 24px;
     align-items: start;
   }
   
   .vps-failures__icon {
     display: none;
   }
   
   .vps-failures__content {
     display: contents;
   }
   
   .vps-failures__problem {
     background: url("../../img/common/failure-problem-bg.svg") no-repeat center;
     background-size: cover;
     border-radius: 0px;
     min-height: 290px;
     display: grid;
     grid-template-rows: auto auto;
     align-items: center;
     justify-content: center;
     justify-items: center;
     padding: 44px 28px;
     position: relative;
   }
   
   .vps-failures__problem::before {
     content: "";
     grid-row: 1;
     width: 200px;
     height: 150px;
     background-size: contain;
     background-repeat: no-repeat;
     background-position: center;
     margin-bottom: 12px;
   }
   
   .vps-failures__card:nth-child(1) .vps-failures__problem::before {
     background-image: url("../../img/vps/icon-command.svg");
   }
   
   .vps-failures__card:nth-child(2) .vps-failures__problem::before {
     background-image: url("../../img/vps/icon-help.svg");
   }
   
   .vps-failures__card:nth-child(3) .vps-failures__problem::before {
     background-image: url("../../img/vps/icon-secure.svg");
   }
   
   .vps-failures__card:nth-child(4) .vps-failures__problem::before {
     background-image: url("../../img/vps/icon-eol.svg");
   }
   
   .vps-failures__card:nth-child(5) .vps-failures__problem::before {
     background-image: url("../../img/vps/icon-scale.svg");
   }
   
   .vps-failures__card:nth-child(6) .vps-failures__problem::before {
     background-image: url("../../img/vps/icon-migration.svg");
   }
   
   .vps-failures__problem-text {
     font-size: 20px;
     font-weight: 500;
     text-align: center;
     margin: 0;
     /* JS (initFailuresGrid) で全 6 つの高さが最大値に揃えられた時、
        テキストがその領域内で縦軸センターに来るよう grid + center */
     display: grid;
     align-items: center;
     justify-content: center;
   }
   
   .vps-failures__solution {
     background: #ffffff;
     display: grid;
     align-items: center;
     justify-content: center;
     padding: 16px;
   }
   
   .vps-failures__solution p {
     text-align: left;
     margin: 0;
   }
   
   .vps-failures__point {
     margin-top: 40px;
     background: transparent;
     font-size: 20px;
     font-weight: 700;
     text-align: center;
   }
   
   /* =============================================================
      Winserverが選ばれる5つの理由 (PC_5つの理由)
      ============================================================= */
   
   .vps-reasons {
     padding: 100px 0;
     background: #ffffff;
   }
   
   .vps-reasons__main {
     margin-bottom: 32px;
   }
   
   .vps-reasons__main-card {
     display: grid;
     grid-template-columns: 1fr 1fr;
     background: #FFF2B9;
     border-radius: 15px;
     min-height: 510px;
     max-width: 1200px;
     margin: 0 auto 32px;
     align-items: center;
     gap: 32px;
     padding: 50px 60px;
   }
   
   /* gridから通常のブロック要素に変更 
   .vps-reasons__main-content {
   }
   */
   
   .vps-reasons__number {
     font-family: "Barlow", sans-serif;
     font-size: 50px;
     font-weight: 600;
     color: #FFCD00;
     margin: 0 0;
   }
   
   .vps-reasons__main-title {
     font-size: 30px;
     font-weight: 700;
     margin: 0 0 20px;
   }
   
   .vps-reasons__main-text {
     margin: 0 0 36px;
   }
   
   .vps-reasons__main-features {
     background: #ffffff;
     border-radius: 3px;
     padding: 12px 29px;
     display: grid;
     gap: 4px;
   }
   
   .vps-reasons__feature {
     display: grid;
     grid-template-columns: 19px 1fr;
     align-items: center;
     gap: 12px;
     font-weight: 500;
   }
   
   .vps-reasons__feature::before {
     content: "";
     width: 19px;
     height: 19px;
     background: url("../../img/common/icon-check-deepblue.svg") center / contain no-repeat;
   }
   
   .vps-reasons__feature svg {
     display: none;
   }
   
   .vps-reasons__main-visual {
     width: 100%;
     height: auto;
   }
   
   .vps-reasons__main-visual img {
     width: 100%;
     height: auto;
     aspect-ratio: 588/330;
     object-fit: cover;
     border-radius: 10px;
   }
   
   .vps-reasons__grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 20px;
     max-width: 1200px;
     margin: 0 auto;
   }
   
   .vps-reasons__card {
     background: #FFF2B9;
     border-radius: 10px;
     padding: 23px;
   }
   
   .vps-reasons__card-number {
     font-family: "Barlow", sans-serif;
     font-size: 32px;
     font-weight: 600;
     line-height: 1;
     color: #FFCD00;
     margin: 0 0 8px;
   }
   
   .vps-reasons__card-title {
     font-size: 22px;
     font-weight: 700;
     margin: 0 0 8px;
   }
   
   .vps-reasons__card-text {
     margin: 0;
   }
   
   /* =============================================================
      FAQセクション
      ============================================================= */
   
   .vps-faq {
     padding: 0 0 100px 0;
     background: #ffffff;
   }
   
   .vps-faq__list {
     margin: 0 auto 60px;
   }
   
   .vps-faq__item {
     background: #f2f4f8;
     margin-bottom: 16px;
     overflow: hidden;
   }
   
   .vps-faq__question {
     display: grid;
     grid-template-columns: 40px 1fr 40px;
     align-items: center;
     gap: 40px;
     width: 100%;
     padding: 12px 50px;
     background: #f2f4f8;
     border: none;
     text-align: left;
     cursor: pointer;
     transition: background-color 0.3s ease;
   }
   
   .vps-faq__question:hover {
     background: #e8ecf0;
   }
   
   .vps-faq__question[aria-expanded="true"] {
     background: #f2f4f8;
   }
   
   .vps-faq__q-icon {
     display: flex;
     align-items: center;
     justify-content: center;
   }
   
   .vps-faq__q-icon img {
     width: 22px;
     height: auto;
   }
   
   .vps-faq__q-text {
     font-size: 18px;
     font-weight: 500;
     letter-spacing: 0.54px;
   }
   
   .vps-faq__toggle-icon {
     display: flex;
     align-items: center;
     justify-content: center;
     position: relative;
     width: 40px;
     height: 40px;
   }
   
   .vps-faq__toggle-icon img {
     position: absolute;
     width: 40px;
     height: 40px;
     transition: opacity 0.3s ease;
   }
   
   .vps-faq__question[aria-expanded="false"] .vps-faq__icon-minus {
     opacity: 0;
   }
   
   .vps-faq__question[aria-expanded="false"] .vps-faq__icon-plus {
     opacity: 1;
   }
   
   .vps-faq__question[aria-expanded="true"] .vps-faq__icon-minus {
     opacity: 1;
   }
   
   .vps-faq__question[aria-expanded="true"] .vps-faq__icon-plus {
     opacity: 0;
   }
   
   /* outer は height: 0 → JS が scrollHeight を inline で設定して transition。
      inner は padding 固定 (開いた時のレイアウト)。 */
   .vps-faq__answer {
     background: #ffffff;
     height: 0;
     overflow: hidden;
     transition: height 0.3s ease;
   }
   
   .vps-faq__answer-inner {
     display: grid;
     grid-template-columns: 40px 1fr;
     align-items: start;
     gap: 40px;
     padding: 46px 50px;
   }
   
   .vps-faq__a-icon {
     display: flex;
     align-items: center;
     justify-content: center;
   }
   
   .vps-faq__a-icon img {
     width: 22px;
     height: auto;
   }
   
   .vps-faq__a-text {
     font-size: 18px;
     font-weight: 500;
     letter-spacing: 0.54px;
   }
   
   /* =============================================================
      業界最高のコストパフォーマンス
      ============================================================= */
   
   .vps-comparison {
     padding: 100px 0;
     background: #ffffff;
   }
   
   /* テーブルラッパ: PC base は左右 20px の余白を常時確保。
      モバイルで横スクロールに切り替わる時 (@media 768) は右側だけ 0 にして
      テーブル右端をビューポート右端まで流す（左 20px は維持）。
   .vps-comparison__table-wrapper {
   }
   */
   
   .vps-comparison__table {
     width: 100%;
     max-width: 1195px;
     margin: 0 auto 16px;
     border-collapse: collapse;
     table-layout: fixed;
   }
   
   .vps-comparison__table th,
   .vps-comparison__table td {
     width: 20%;
   }
   
   .vps-comparison__header {
     height: 70px;
     text-align: center;
     font-size: 16px;
     font-weight: 500;
     vertical-align: middle;
   }
   
   .vps-comparison__header--feature {
     background: transparent;
   }
   
   .vps-comparison__header--winserver {
     color: #0068b7;
     font-size: 24px;
     font-weight: 500;
   }
   
   .vps-comparison__header--other {
     color: #111111;
     font-size: 16px;
     font-weight: 500;
   }
   
   .vps-comparison__cell {
     height: 70px;
     text-align: center;
     font-size: 16px;
     font-weight: 500;
     vertical-align: middle;
     border: 1px solid #dbe5f3;
   }
   
   .vps-comparison__cell--feature {
     color: #ffffff;
     font-size: 16px;
     font-weight: 500;
   }
   
   .vps-comparison tbody tr:nth-child(odd) .vps-comparison__cell--feature {
     background: #FFCD00;
     padding: 10px;
   }
   
   .vps-comparison tbody tr:nth-child(even) .vps-comparison__cell--feature {
     background: #6facfd;
     padding: 10px;
   }
   
   .vps-comparison__cell--winserver {
     background: #e0edff;
     color: #FFCD00;
     font-size: 18px;
     font-weight: 500;
   }
   
   .vps-comparison__note {
     text-align: right;
     font-size: 16px;
     color: #111111;
     margin: 0;
   }
   
   /* =============================================================
      WinserverのVPSが安心して使える理由
      ============================================================= */
   
   .vps-trust {
     padding: 100px 0 0;
     background: #ffffff;
   }
   
   .vps-trust__subtitle {
     text-align: center;
     margin: 0 0 32px;
   }
   
   .vps-trust__description {
     max-width: 1028px;
     margin: 40px auto 55px;
     text-align: center;
   }
   
   .vps-trust__description-title {
     font-size: 22px;
     font-weight: 500;
     margin: 0 0 16px;
   }
   
   .vps-trust__description-text {
     font-size: 16px;
     margin: 0;
   }
   
   .vps-trust__grid {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     column-gap: 20px;
     row-gap: 20px;
     max-width: 960px;
     margin: 0 auto;
   }
   
   .vps-trust__card {
     background: #ffffff;
     border: 1px solid #dbe5f3;
     border-radius: 5px;
     padding: 40px;
     text-align: center;
   }
   
   .vps-trust__icon {
     margin-bottom: 22px;
     text-align: center;
   }
   
   .vps-trust__icon img {
     width: 80px;
     height: 80px;
     display: block;
     margin: 0 auto;
   }
   
   .vps-trust__card-title {
     font-size: 22px;
     font-weight: 500;
     margin: 0 0 22px;
   }
   
   .vps-trust__card-text {
     margin: 0;
   }
   
   /* NOTE: 料金プランのスタイルは layout/vps-shared.css に移動されました */
   
   /* =============================================================
      トライアルCTA（VPS TOP）
      ============================================================= */
   
   .vps-trial-top-cta {
     padding: 60px 0;
     background-color: #FFF2B9;
   }
   
   /* =============================================================
      @media (max-width: 1024px)
      ============================================================= */
   
   @media (max-width: 1024px) {
     .vps-mv {
       min-height: auto;
       padding-block: 64px;
     }
   
     .vps-mv__inner {
       /* 既存タイポ var(--space-mg) を SP 値（32px）に揃えて修正 */
       gap: 32px;
     }
   
     .vps-mv__visual {
       width: 100%;
       max-width: 100%;
     }
   
     .vps-mv__visual img {
       width: 100%;
       height: auto;
     }
   
     .vps-about__illust {
       padding: 40px 60px;
     }
   
     .vps-problems__grid,
     .vps-problems__solution-grid {
       grid-template-columns: repeat(auto-fit, minmax(202px, 1fr));
       gap: 16px;
     }
   
     .vps-capabilities__grid {
       grid-template-columns: 1fr;
     }
   
     .vps-capabilities__scenes-grid {
       grid-template-columns: repeat(2, 1fr);
       gap: 20px;
     }
   
     .vps-necessity__checklist {
       padding: 7px 20px 37px;
       justify-content: center;
       grid-template-columns: 268px auto;
     }
   
     .vps-failures__grid {
       grid-template-columns: repeat(2, 1fr);
       gap: 24px;
       padding: 0 30px;
     }
   
     .vps-failures__card {
       width: 100%;
       max-width: 100%;
       grid-template-rows: auto auto;
       gap: 24px;
     }
   
     .vps-failures__problem {
       min-height: auto;
       padding: 32px 24px;
     }
   
     .vps-failures__problem::before {
       width: 150px;
       height: 120px;
     }
   
     .vps-reasons__main-card {
       grid-template-columns: 1fr;
       height: auto;
       min-height: auto;
       padding: 40px 30px;
     }
   
     .vps-reasons__main-visual {
       width: 100%;
       height: auto;
       order: -1;
     }
   
     .vps-reasons__grid {
       grid-template-columns: repeat(2, 1fr);
       gap: 20px;
     }
   
     .vps-trust__grid {
       grid-template-columns: 1fr;
     }
   
     .vps-mv__badge {
       font-size: 18px;
     }
     .vps-mv__description {
       font-size: 20px;
     }
     .vps-mv__price-value {
       font-size: 18px;
     }
     .vps-mv__trial-note {
       font-size: 16px;
     }
     .section-title {
       font-size: 26px;
     }
     .section-lead {
       font-size: 16px;
     }
     .vps-about__illust-title {
       font-size: 20px;
     }
     .vps-problems__solution-title {
       font-size: 26px;
     }
     .vps-necessity__label {
       font-size: 20px;
     }
     .vps-necessity__subtitle {
       font-size: 16px;
     }
     .vps-necessity__item {
       font-size: 16px;
     }
     .vps-necessity__result {
       font-size: 16px;
     }
     .vps-necessity__recommend-text {
       font-size: 20px;
     }
     .vps-capabilities__subtitle {
       font-size: 16px;
     }
     .vps-capabilities__card-title {
       font-size: 18px;
     }
     .vps-capabilities__scenes-title {
       font-size: 26px;
     }
     .vps-capabilities__scene-title {
       font-size: 20px;
     }
     .vps-capabilities__cta-btn {
       font-size: 18px;
     }
     .vps-failures__problem-text {
       font-size: 18px;
     }
     .vps-reasons__card-number {
       font-size: 26px;
     }
     .vps-reasons__card-title {
       font-size: 20px;
     }
     .vps-faq__q-text {
       font-size: 16px;
     }
     .vps-faq__a-text {
       font-size: 16px;
     }
     .vps-comparison__cell--winserver {
       font-size: 16px;
     }
     .vps-trust__description-title {
       font-size: 20px;
     }
     .vps-trust__card-title {
       font-size: 20px;
     }
   }
   
   /* =============================================================
      @media (max-width: 768px)
      ============================================================= */
   
   @media (max-width: 768px) {
     .vps-about__title,
     .vps-problems__title,
     .vps-necessity__title,
     .vps-capabilities__title,
     .vps-failures__title,
     .vps-reasons__title,
     .vps-faq__title,
     .vps-comparison__title,
     .vps-trust__title {
       margin-bottom: 16px;
     }
   
     .vps-problems__title,
     .vps-reasons__title,
     .vps-faq__title,
     .vps-comparison__title,
     .vps-trust__title {
       margin-bottom: 40px;
     }
   
     .vps-problems__title {
       margin-bottom: 32px;
     }
   
     .vps-mv__inner {
       position: relative;
       display: block;
       text-align: left;
       gap: 32px;
       width: 100%;
       padding-inline: 0;
     }
   
     .vps-mv__content {
       display: block;
       max-width: 100%;
     }
   
     .vps-mv__badge {
       justify-content: flex-start;
       gap: 8px;
       grid-template-columns: 30px auto;
       font-size: 24px;
       margin-bottom: 12px;
     }
   
     .vps-mv__title {
       text-align: left;
       margin-bottom: 12px;
       font-size: 42px;
     }
   
     .vps-mv__description {
       text-align: left;
       max-width: 100%;
       margin-bottom: 14px;
       font-size: 16px;
     }
   
     .vps-mv__price {
       justify-content: flex-start;
       margin-bottom: 68px;
     }
   
     .vps-mv__trial {
       max-width: 442px;
       margin: 0 auto;
     }
   
     .vps-mv__trial-btn {
       margin-inline: 0;
       font-size: 20px;
       height: 60px;
     }
   
     .vps-mv__trial-footnote-inline {
       top: -1px;
     }
   
     .vps-mv__trial-footnote {
       text-align: right;
       margin-top: 6px;
     }
   
     .vps-mv__visual {
       position: absolute;
       right: inherit;
       top: 194px;
       transform: translateY(-50%);
       width: 185px;
       max-width: 55%;
       left: 150px;
     }
   
     .vps-mv__visual img {
       width: 100%;
       height: auto;
     }
   
     .vps-mv {
       padding: 30px 20px;
     }
   
     .vps-mv__badge img {
       width: 30px;
       height: 30px;
     }
   
     .vps-mv__trial-heading {
       margin-bottom: 12px;
       padding-bottom: 12px;
       font-size: 16px;
     }
   
     .vps-mv__trial-note {
       gap: 8px;
       font-size: 15px;
     }
   
     .vps-about {
       padding: 60px 0;
     }
   
     .vps-about__header {
       margin-bottom: 40px;
       padding: 0;
     }
   
     .vps-about__title {
       text-align: center;
       padding: 0 20px;
     }
   
     .vps-about__description {
       padding: 0;
     }
   
     .vps-about__illust {
       padding: 20px 20px;
     }
   
     .vps-about__note {
       padding: 20px 20px;
     }
   
     .vps-problems {
       padding: 60px 0 0;
     }
   
     .vps-problems__grid {
       grid-template-columns: repeat(2, 1fr);
       gap: 12px;
       padding: 0;
     }
   
     .vps-problems__card {
       grid-template-columns: 40px 1fr;
       grid-template-rows: auto;
       align-items: center;
       justify-items: start;
       width: 100%;
       padding: 12px;
       gap: 8px;
       border-radius: 5px;
     }
   
     .vps-problems__icon {
       width: 40px;
       height: 40px;
       justify-self: center;
     }
   
     .vps-problems__text {
       font-size: 12px;
       text-align: left;
       justify-self: start;
     }
   
     .vps-problems__divider {
       height: 50px;
     }
   
     .vps-problems__divider::before {
       height: 50px;
     }
   
     .vps-problems__solution {
       padding: 60px 20px;
       width: 100vw;
       margin-left: -20px;
       border-radius: 0;
     }
   
     .vps-problems__solution-title {
       font-size: 16px;
       margin-bottom: 32px;
     }
   
     .vps-problems__solution-grid {
       grid-template-columns: repeat(2, 1fr);
       gap: 12px;
       padding: 0;
     }
   
     .vps-problems__solution-card {
       grid-template-columns: 1fr;
       grid-template-rows: 32px auto;
       align-items: center;
       justify-items: center;
       width: 100%;
       padding: 24px 8px 16px;
       border-radius: 5px;
     }
   
     .vps-problems__solution-card::before {
       width: 18px;
       height: 18px;
       top: 8px;
       left: 8px;
       transform: none;
     }
   
     .vps-problems__solution-icon {
       width: 32px;
       height: 32px;
     }
   
     .vps-problems__solution-text {
       font-size: 12px;
       text-align: left;
       padding: 12px 4px 0;
     }
   
     .vps-necessity {
       padding: 0px 0 60px;
     }
   
     .vps-necessity__header {
       margin-bottom: 32px;
     }
   
     .vps-necessity__label {
       font-size: 14px;
     }
   
     .vps-necessity__subtitle {
       font-size: 16px;
     }
   
     .vps-necessity__checklist {
       grid-template-columns: 1fr;
       border-radius: 5px;
       padding: 24px 20px;
       min-height: auto;
       gap: 16px;
       background: linear-gradient(180deg, #f5f5f5 0%, #e8e8e8 100%);
       position: relative;
     }
   
     .vps-necessity__checklist::after {
       content: "";
       position: absolute;
       bottom: -40px;
       left: 0;
       width: 100%;
       height: 40px;
       background: #e8e8e8;
       clip-path: polygon(0 0, 100% 0, 50% 100%);
     }
   
     .vps-necessity__visual img {
       width: 100%;
       height: auto;
       max-width: 297px;
       margin: 0 auto;
       display: block;
     }
   
     .vps-necessity__items {
       gap: 4px;
       padding-top: 0;
     }
   
     .vps-necessity__item {
       font-size: 14px;
       letter-spacing: -0.8px;
     }
   
     .vps-necessity__item:not(:last-child) {
       margin-bottom: 0.5em;
     }
   
     .vps-necessity__result {
       padding: 0 20px;
       margin-top: 60px;
     }
   
     .vps-necessity__recommend {
       padding: 16px 20px;
       margin: 0;
       max-width: 100%;
       width: 100%;
     }
   
     .vps-necessity__recommend-text {
       font-size: 14px;
     }
   
     .vps-capabilities {
       padding: 60px 0;
     }
   
     .vps-capabilities__header {
       margin-bottom: 32px;
     }
   
     .vps-capabilities__subtitle {
       font-size: 16px;
     }
   
     .vps-capabilities__grid {
       gap: 16px;
       margin-bottom: 60px;
     }
   
     .vps-capabilities__card {
       grid-template-columns: 60px 1fr;
       height: auto;
       gap: 10px;
       padding: 14px 16px;
       border-radius: 5px;
     }
   
     .vps-capabilities__icon {
       width: 52px;
       height: 52px;
     }
   
     .vps-capabilities__card-title {
       font-size: 16px;
     }
   
     .vps-capabilities__scenes {
       margin-bottom: 60px;
     }
   
     .vps-capabilities__scenes-title {
       margin-bottom: 32px;
     }
   
     .vps-capabilities__scenes-grid {
       grid-template-columns: repeat(2, 1fr);
       gap: 14px;
       padding: 0;
     }
   
     .vps-capabilities__scene img {
       width: 100%;
       height: auto;
       aspect-ratio: 167/158;
       object-fit: cover;
       border-radius: 5px;
     }
   
     .vps-capabilities__scene-title {
       font-size: 16px;
       margin-top: 6px;
     }
   
     .vps-capabilities__cta {
       padding: 0 20px;
     }
   
     .vps-capabilities__cta-label {
       font-size: 14px;
       margin-bottom: 12px;
     }
   
     .vps-capabilities__cta-btn {
       height: 52px;
     }
   
     .vps-failures {
       padding: 60px 0;
     }
   
     .vps-failures__header {
       margin-bottom: 32px;
     }
   
     .vps-failures__subtitle {
       font-size: 18px;
     }
   
     .vps-failures__grid {
       grid-template-columns: 1fr;
       gap: 24px;
       padding: 0;
     }
   
     .vps-failures__card {
       width: 100%;
       max-width: 100%;
       grid-template-columns: 80px 1fr;
       grid-template-rows: auto;
       gap: 12px;
       align-items: start;
     }
   
     .vps-failures__icon {
       display: grid;
       width: 80px;
       height: auto;
       padding: 0;
       align-items: center;
     }
   
     .vps-failures__icon img {
       max-height: 60px;
     }
   
     .vps-failures__content {
       display: grid;
       grid-template-rows: auto auto;
       gap: 12px;
     }
   
     .vps-failures__problem {
       margin-top: 0;
       padding: 12px 16px 16px;
       padding-top: 12px;
     }
   
     .vps-failures__problem-text {
       font-size: 14px;
     }
   
     .vps-failures__solution {
       padding: 12px;
       border-radius: 5px;
     }
   
     .vps-failures__solution p {
       font-size: 13px;
     }
   
     .vps-reasons {
       padding: 60px 0;
       padding-bottom: 0;
     }
   
     .vps-reasons__main {
       margin-bottom: 20px;
     }
   
     .vps-reasons__main-card {
       grid-template-columns: 1fr;
       height: auto;
       padding: 16px;
       gap: 14px;
       border-radius: 0px;
       margin-bottom: 0;
     }
   
     .vps-reasons__number {
       font-size: 30px;
     }
   
     .vps-reasons__main-title {
       font-size: 18px;
       margin-bottom: 16px;
     }
   
     .vps-reasons__main-text {
       font-size: 14px;
       margin-bottom: 24px;
     }
   
     .vps-reasons__main-features {
       padding: 16px;
     }
   
     .vps-reasons__feature {
       font-size: 14px;
     }
   
     .vps-reasons__main-visual {
       width: 100%;
       height: auto;
       order: -1;
     }
   
     .vps-reasons__grid {
       grid-template-columns: repeat(2, 1fr);
       gap: 16px;
       padding: 0;
     }
   
     .vps-reasons__card {
       padding: 16px;
       border-radius: 5px;
     }
   
     .vps-reasons__card-number {
       font-size: 24px;
       margin-bottom: 4px;
     }
   
     .vps-reasons__card-title {
       font-size: 15px;
       margin-bottom: 8px;
     }
   
     .vps-reasons__card-text {
       font-size: 14px;
     }
   
     .vps-faq {
       padding: 0 0 60px 0;
     }
   
     .vps-faq__question {
       grid-template-columns: 40px 1fr 30px;
     }
   
     .vps-faq__question {
       padding: 20px 10px;
       gap: 12px;
     }
   
     .vps-faq__toggle-icon {
       width: 30px;
       height: 30px;
     }
   
     .vps-faq__answer-inner {
       padding: 20px 10px;
       gap: 12px;
     }
   
     .vps-faq__a-text {
       font-size: 14px;
     }
   
     .vps-comparison {
       padding: 0 0 60px;
     }
   
     .vps-comparison__title {
       margin-bottom: 0;
     }
   
     .vps-comparison__table-wrapper {
       width: 100%;
       overflow-x: auto;
       -webkit-overflow-scrolling: touch;
       padding: 0 0 0 20px; /* 左 20 維持、右はビューポートまで流す */
     }
   
     .vps-comparison__table {
       font-size: 14px;
       width: 1000px;
       max-width: none;
     }
   
     .vps-comparison__table th,
     .vps-comparison__table td {
       width: auto;
       min-width: 100px;
     }
   
     .vps-comparison__header {
       height: 60px;
       font-size: 14px;
     }
   
     .vps-comparison__header--winserver {
       font-size: 16px;
     }
   
     .vps-comparison__cell {
       height: auto;
       font-size: 14px;
       padding: 8px 4px;
     }
   
     .vps-comparison__cell--winserver {
       font-size: 16px;
     }
   
     .vps-comparison__note {
       font-size: 12px;
       padding: 0;
     }
   
     .vps-trust {
       padding: 60px 0 0;
     }
   
     .vps-trust__title {
       margin-bottom: 20px !important;
     }
   
     .vps-trust__description {
       font-size: 14px;
       padding: 0;
       margin: 0 auto 30px;
     }
   
     .vps-trust__description-title {
       font-size: 18px;
     }
   
     /* グリッドを1カラムに、各カードを「アイコン左 60px + 見出し/テキスト右」の横レイアウト */
     .vps-trust__grid {
       grid-template-columns: 1fr;
     }
   
     .vps-trust__card {
       display: grid;
       grid-template-columns: 60px 1fr;
       grid-template-areas:
         "icon title"
         "icon text";
       align-items: flex-start;
       column-gap: 16px;
       padding: 20px;
       text-align: left;
     }
   
     .vps-trust__icon {
       grid-area: icon;
       width: 60px;
       margin-bottom: 0;
     }
   
     .vps-trust__icon img {
       width: 60px;
       height: 60px;
     }
   
     .vps-trust__card-title {
       grid-area: title;
       font-size: 16px;
       margin: 0 0 10px;
     }
   
     .vps-trust__card-text {
       grid-area: text;
       font-size: 14px;
     }
   
     /* ----- 個別調整 ----- */
   
     /* PC で <br> を入れている長文を mobile では1行化（手動<br>を消す） */
     .vps-problems__text br,
     .vps-problems__solution-text br,
     .vps-reasons__card-text br {
       display: none;
     }
   
     /* よくある失敗の人型イラスト(::before)はモバイルで非表示 */
     .vps-failures__problem::before {
       display: none;
     }
   
     /* FAQ リストと「その他のよくある質問はこちら」ボタンの間隔 */
     .vps-faq__list {
       margin-bottom: 30px;
     }
   
     .vps-mv__badge {
       font-size: 16px;
     }
   
     .vps-mv__trial-btn::after {
       width: 16px;
       height: 16px;
     }
   
     .vps-mv__price-value {
       font-size: 16px;
     }
     .vps-mv__trial-note {
       font-size: 14px;
     }
     .section-title {
       font-size: 22px;
     }
     .section-lead {
       font-size: 14px;
     }
     .vps-about__illust-title {
       font-size: 18px;
       margin-bottom: 20px;
     }
     .vps-problems__solution-title {
       font-size: 22px;
     }
     .vps-necessity__label {
       font-size: 18px;
     }
     .vps-necessity__subtitle {
       font-size: 14px;
     }
     .vps-necessity__item {
       font-size: 14px;
     }
     .vps-necessity__result {
       font-size: 14px;
     }
     .vps-necessity__recommend-text {
       font-size: 18px;
     }
     .vps-capabilities__subtitle {
       font-size: 14px;
     }
     .vps-capabilities__card-title {
       font-size: 16px;
     }
     .vps-capabilities__scenes-title {
       font-size: 22px;
     }
     .vps-capabilities__scene-title {
       font-size: 18px;
     }
     .vps-capabilities__cta-btn {
       font-size: 16px;
     }
   
     .vps-reasons__card-number {
       font-size: 22px;
     }
   
     .vps-faq__q-text {
       font-size: 14px;
     }
     .vps-faq__a-text {
       font-size: 14px;
     }
     .vps-comparison__cell--winserver {
       font-size: 14px;
     }
     .vps-trust__description-title {
       font-size: 18px;
     }
   
     .vps-about__illust-content {
       margin-bottom: 20px;
     }
   
     .vps-trial-top-cta {
       padding-top: 20px;
     }
   }
   
   @media (max-width: 480px) {
     .vps-comparison__table {
       width: 660px;
     }
   
     .vps-about__note p {
       font-size: 14px;
     }
   }
   
   /* ---- */
   
   .vps-mv__description > div {
     font-size: 80%;
   }
   .vps-about__content {
     display: grid;
     grid: auto-flow / 1fr 1fr 1fr;
     gap: 50px;
     & > div {
       background-color: white;
       text-align: center;
       border-radius: 50px;
       padding: 30px;
       & > div {
         width: 100%;
         margin-inline: auto;
       }
     }
     img {
       margin-inline: auto;
       height: 100px;
     }
     h3 {
       margin: 20px 0;
     }
   }
   
   .vps-about__note {
     padding: 0;
     margin: 20px 0;
     background-color: transparent;
     text-align: right;
   }
   
   @media (max-width: 480px) {
     .vps-about__content {
       display: flow;
       & > div {
         background-color: white;
         text-align: center;
         border-radius: 40px;
         padding: 30px;
         margin: 20px 10px;
       }
       img {
         margin-inline: auto;
         height: 100px;
       }
       h3 {
         margin: 20px 0;
       }
     }
   }
   
   .vps-survey {
     .vps-survey__graphs {
       & > div:first-child {
         display: flex;
       }
       & > div:not(:first-child) {
         border: solid 1px;
         border-top-width: 0;
       }
       input {
         display: none;
       }
       label {
         display: block;
         flex: 1;
         border: solid 1px grey;
         background-color: lightgrey;
         color: grey;
         border-top-left-radius: 10px;
         border-top-right-radius: 10px;
         font-weight: 600;
         text-align: center;
         padding: 5px 0;
         font-size: 16pt;
       }
       input:checked + label {
         border: solid 1px blue;
         background-color: white;
         color: blue;
       }
       img {
         display: none;
         margin-inline: auto;
       }
   
       div:has(#ping:checked) + div > img#ping-image {
         display: block;
       }
   
       div:has(#jitter:checked) + div > img#jitter-image {
         display: block;
       }
   
       div:has(#speed:checked) + div > img#speed-image {
         display: block;
       }
     }
   }
   
   .vps-pricing {
     margin-block: 20px;
   }
   .vps-pricing__service_header {
     display: flex;
     justify-content: center;
     align-items: center;
     gap: 10px;
     padding-bottom: 10px;  
     grid-column: span 2;
     font-size: 20px;
     &::before, &::after {
       content: "";
       width: 30px;
       height: 2px;
       box-sizing: border-box;
       background-color: #333333; 
     }
     &::before {
       rotate: 60deg;
     }
     &::after {
       rotate: -60deg;
     }
   }
   
   @media (max-width: 480px) {
     /* todo: レスポンシブでも表示させるようにする？ */
     .vps-pricing__service_header {
       display: none;
     }
   }
   
   .vps-pricing__features li {
     font-size: 16px;
   }
   .vps-pricing__card {
     &.vps {
       .vps-pricing__btn, .vps-pricing__header {
         color: #000;
         background-color: #F8BFD2;
       }
   
     }
     &.private {
       .vps-pricing__btn, .vps-pricing__header {
         color: #000;
         background-color: #FBDA94;
       }
     }
   
     .vps-pricing__btn::after {
       background: url("../../img/common/icon_arrow-black.svg") center / contain no-repeat;
     }
   }
   
   .vps-reasons {
     ul {
       list-style-type: none;
       li {
         background-color: #FFF2B9;
         border-radius: 20px;
         padding-left: 120px;
         position: relative;
         width: 66.6%;
         margin-inline: auto;
         margin-block: 20px;
         padding-block: 10px;
         &::before {
           content: attr(data-number);
           color: #FFCD00;
           background-color: white;
           position: absolute;
           left: 40px;
           top: 15px;
           font-size: 32px;
           width: 50px;
           height: 50px;
           border-radius: 25px;
           text-align: center;
         }
         div {
           font-size: 16px;
         }
         div:first-child {
           font-size: 24px;
           font-weight: 700;
         }
       }
     }
   }
   
   @media (max-width: 480px) {
     .vps-reasons {
       ul {
         list-style-type: none;
         li {
           padding: 75px 25px 15px;
           width: 90%;
           &::before {
             position: absolute;
             top: 15px;
             left: 0;
             right: 0;
             margin: auto;
             font-size: 30px;
             line-height: 48px;
           }
           display: flex;
           flex-direction: column;
           div {
             font-size: 15px;
             text-align: center;
           }
           div:first-child {
             font-size: 18px;
             margin: 10px 0 20px;
           }
         }
       }
     }
   }
   
   .fx-flow {
     padding: 100px 0 0;
     background-color: #FFF2B9;
     .fx_flow__list {
       display: flex;
       & > div {
         background-color: white;
         position: relative;
         height: 300px;
         width: 18%;
         display: inline-block;
         margin-left: 5%;
         text-align: center;
         padding: 50px 15px 20px;
         flex: 1;
         &::before {
           font-size: 28px;
           content: attr(data-number);
           position: absolute;
           left: 0;
           top: 0;
           width: 40px;
           height: 40px;
           color: white;
           background-color: #FFCD00;
         }
         &:first-child::before {
           background-color: #FF9900;
         }
   
         &::after {
           content: "";
           position: absolute;
           top: 0;
           left: 100%;
           
           width: 15%;
           height: 300px;
           
           background-color: white;
           
           /* 左上、左下、右の中央を結んで三角形に切り抜く */
           clip-path: polygon(0% 0%, 0% 100%, 100% 50%);
         }
   
         img {
           margin-inline: auto;
           height: 33%;
           width: auto;
           margin: 20px auto;
         }
         h3 {
           height: 60px;
           vertical-align: middle;
         }
       }
     }
   }
   
   @media (max-width: 480px) {
     .fx-flow {
       .fx_flow__list {
         flex-direction: column;
         & > div {
           width: 90%;
           margin-bottom: 20%;
           padding: 20px 20px 0px;
           &::before {
             font-size: 30px;
             font-weight: 700;
             line-height: 60px;
             color: #fff;
             width: 60px;
             height: 60px;
           }
           
           &::after {
             top: 100%;
             left: 0;
             
             width: 100%;
             height: 40px;
             
             background-color: #fff;
   
             /* 左上、右上、中央を結んで三角形に切り抜く */
             clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
           }
     
           img {
             margin-inline: auto;
             width: 40%;
             margin: 20px auto;
           }
           h3 {
             height: initial;
             font-size: 24px;
           }
         }
       }
     }
   }
   
   .vps-trial-top-cta.white {
     background-color: #FFFFFF;
   }
   
   .vps-trial-top-cta.apply {
     .vps-trial-cta__card-btn {
       height: 96px;
       &.vps {
           background-color: #FF3366;
   
       }
       &.private {
           background-color: #FF9900;
       }
     }
   }
   
   .vps-subpage-header {
     background-image: none;
     background-color: #FFCD00;
   }