.plan-card {
 	 margin: 3rem auto;
		
    }

    /* --------------------------------------------------
       Grid Layout (PC / SP Common)
    -------------------------------------------------- */
    .plan-grid {
      display: grid;
      grid-template-columns: 1.5fr 0.5fr;
      gap: 1.5rem;
      align-items: start;
    }

    /* --------------------------------------------------
       Floor Plan Column (Left Side on PC)
    -------------------------------------------------- */
    .floorplan-col {
      display: flex;
      flex-direction: column;
      gap: 0.9375rem;
    }

    .floorplan-item {
      position: relative;
    }

    .floorplan-img-dummy {
      width: 100%;
      height: 20rem;
      background-color: #f9f9f9;
      border: 0.0625rem solid #e0e0e0;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #999999;
      font-size: 0.875rem;
    }

    .floorplan-tag {
      font-size: 0.8125rem;
      font-weight: bold;
      color: #000000;
      margin-top: 0.375rem;
      display: flex;
      align-items: center;
      gap: 0.25rem;
      text-align: left;
    }

    .floorplan-tag::before {
      content: "";
      display: inline-block;
      width: 0.625rem;
      height: 0.625rem;
      background-color: #000000;
      border-radius: 50%;
    }

@media print, screen and (min-width: 768px) {
   .floorplan-col {
 margin-top: 2rem;
    }
}
    /* --------------------------------------------------
       Info Column (Right Side on PC)
    -------------------------------------------------- */
    .info-col {
      display: flex;
      flex-direction: column;
      text-align: left;
    }

    /* Main Title Header */
    .plan-header {
      display: flex;
      align-items: center;
      gap: 0.75rem;
      margin-bottom: 1.25rem;
    }

    .plan-badge {
      background-color: #008eb0;
      color: #ffffff;
      padding: 0.5rem 0.75rem 0.25rem;
      text-align: left;
      font-size: 0.8125rem;
      font-weight: bold;
      line-height: 1.2;
    }

    .plan-badge-no {
      font-size: 1.375rem;
      font-weight: bold;
    }

    .plan-title {
      color: #008eb0;
      font-size: 2rem;
      font-weight: bold;
      letter-spacing: -0.03125rem;
      line-height: 1;
      text-align: left;
    }

    .plan-title-s {
      color: #008eb0;
      font-size: 1rem;
      font-weight: bold;
      letter-spacing: -0.03125rem;
      line-height: 1;
      text-align: left;
    }

    /* Price / Area Section */
    .price-section {
      display: flex;
      flex-direction: column;
      width: 100%;
    }

    .dashed-line {
      border-bottom: 0.0625rem dashed #999999;
      margin: 0.5rem 0;
      width: 100%;
    }

    /* 演算記号（＋・＝）入りの区切り線エリア */
    .operator-line-wrap {
      position: relative;
      width: 100%;
      height: 1.75rem;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0.25rem 0;
    }

    .operator-line-wrap::before {
      content: "";
      position: absolute;
      left: 0;
      top: 50%;
      width: 100%;
      border-bottom: 0.0625rem dashed #999999;
      transform: translateY(-50%);
      z-index: 1;
    }

    .operator-circle {
      position: relative;
      z-index: 2;
      width: 1.5rem;
      height: 1.5rem;
      background-color: #888888;
      color: #ffffff;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0.9375rem;
      font-weight: bold;
      line-height: 1;
      flex-shrink: 0;
    }

    /* PC時のレイアウト設定 */
    .flex-row-content {
      display: grid;
      grid-template-columns: 1fr auto 10.5rem;
      align-items: flex-end;
      width: 100%;
    }

    .info-block-left {
      display: flex;
      flex-direction: column;
      text-align: left;
      padding-right: 0.75rem;
    }

    .info-block-right {
      display: flex;
      flex-direction: column;
      text-align: left;
      padding-left: 0.75rem;
    }

    .info-label {
      font-size: 0.8125rem;
      font-weight: bold;
      color: #333333;
      margin-bottom: 0.125rem;
      line-height: 1.2;
      text-align: left;
      white-space: nowrap;
    }

    .info-label-total {
      font-size: 0.9375rem;
      font-weight: bold;
      color: #333333;
      margin-bottom: 0.125rem;
      line-height: 1.2;
      text-align: left;
      white-space: nowrap;
    }

    .info-val-large {
      font-size: 1.875rem;
      font-weight: bold;
      color: #000000;
      line-height: 1;
      text-align: left;
      white-space: nowrap;
    }

    .info-val-total {
      font-size: 2rem;
      font-weight: bold;
      color: #000000;
      line-height: 1;
      text-align: left;
      white-space: nowrap;
    }

    .info-val-unit {
      font-size: 0.875rem;
      font-weight: bold;
    }

    .info-val-sub {
      font-size: 0.75rem;
      font-weight: normal;
      color: #333333;
      display: inline;
    }

    .note-text-sm {
      font-size: 0.625rem;
      color: #333333;
      line-height: 1.3;
      margin-top: 0.375rem;
      text-align: left;
    }

    .note-text-right {
      text-align: left;
      font-size: 0.625rem;
      color: #333333;
      margin-top: 0.25rem;
      margin-bottom: 1.25rem;
    }

    /* 縦区切り線 */
    .vertical-line {
      width: 0.0625rem;
      background-color: #cccccc;
      align-self: stretch;
    }

    /* --------------------------------------------------
       Features / Points List
    -------------------------------------------------- */

    .features-container {
         display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem 0.5rem;
		 margin-top: 1rem;
    }


    .feature-item {
      display: flex;
      align-items: flex-start;
      gap: 0.625rem;
    }

    .feature-num {
      width: 1.75rem;
      height: 1.75rem;
      background-color: #5cb88a;
      color: #ffffff;
      font-size: 1.125rem;
      font-weight: bold;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .feature-text-wrap {
      display: flex;
      flex-direction: column;
      text-align: left;
    }

    .feature-title {
      color: #5cb88a;
      font-size: 0.9375rem;
      font-weight: bold;
      line-height: 1.3;
      text-align: left;
    }

    .feature-sub {
      color: #888888;
      font-size: 0.625rem;
      margin-top: 0.125rem;
      text-align: left;
    }


    /* --------------------------------------------------
       Responsive Styles (SP Mode)
    -------------------------------------------------- */
    @media (max-width: 1023px) {
		
	 .outer-i {
      max-width: 70%;
		margin: 0 auto;
    }	
		
   .price-section {
      display: flex;
      flex-direction: column;
    }
		
	  .plan-card {
   		  margin: 2rem auto;
      }

      .plan-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
      }

      .info-col {
        order: 1;
      }

      .floorplan-col {
        order: 2;
      }

      .plan-header {
        margin-bottom: 0.75rem;
      }

      .plan-title {
        font-size: 1.5rem;
      }
		
	     .plan-title-s {
        font-size: 1rem;
      }

      /* 
        スマホ専用設定：
        右列の幅を 8.8rem に拡張して左列(1fr)を一層狭くしつつ、
        右側の左右余白（padding）をしっかりと保持します。
      */
/*
      .flex-row-content {
        grid-template-columns: 1fr auto 8.8rem;
      }
*/

      .info-block-left {
         padding-right: 0; /*スマホ左列の右余白を極限まで縮小 */
      }

      .info-block-right {
        padding-left: 0.75rem;   /* 中央線と右列テキストの間のゆったり余白 */
        padding-right: 0.6rem;  /* 右端の適度な余白 */
      }

      .info-label {
/*        font-size: 0.65625rem;*/
      }

/*
      .info-label-total {
        font-size: 0.65625rem;
      }
*/

      .info-val-large {
        /*font-size: 0.9375rem;  左列が狭くなっても崩れない文字サイズ */
      }

      .info-val-total {
/*        font-size: 1.1875rem;*/
      }

      .info-val-unit {
/*        font-size: 0.65625rem;*/
      }

      .info-val-sub {
/*        font-size: 0.5625rem;*/
        display: inline;
      }

      
/*
      .feature-title {
        font-size: 0.8125rem;
      }
*/
    
    }

 @media (max-width: 767px) {
	 
	 .outer-i {
      max-width: 100%;
		margin: 0 auto;
    }
	 
   .price-section {
      display: flex;
      flex-direction: column;
      width: 100%;
    }
}