/* Chart.jsグラフのモバイル対応 - X軸余白完全削減 */

/* グラフコンテナのパディング調整 */
@media (max-width: 768px) {
  /* 03番目のsolution-image-placeholder内のグラフコンテナ */
  .solution-image-placeholder > div > div > div[style*="height: 600px"],
  .solution-image-placeholder > div > div > div[style*="padding: 40px"] {
    padding: 20px 5px 0px 0px !important;
    height: 450px !important;
    overflow: hidden !important;
    margin: 0 -5px !important;
  }
  
  /* グラフ下部の余白を完全に削除 */
  #elegantCostComparisonChart {
    margin-bottom: -50px !important;
    display: block !important;
    width: 100% !important;
  }
  
  /* グラフを含む親要素も調整 */
  .solution-image-placeholder > div > div {
    margin-bottom: 0px !important;
    padding-bottom: 0px !important;
  }
}

@media (max-width: 480px) {
  /* 03番目のsolution-image-placeholder内のグラフコンテナ */
  .solution-image-placeholder > div > div > div[style*="height: 600px"],
  .solution-image-placeholder > div > div > div[style*="height: 500px"],
  .solution-image-placeholder > div > div > div[style*="height: 450px"],
  .solution-image-placeholder > div > div > div[style*="height: 470px"],
  .solution-image-placeholder > div > div > div[style*="padding: 40px"] {
    padding: 10px 3px 0px 3px !important;
    height: 380px !important;
    overflow: hidden !important;
    margin: 0 -5px 0 -3px !important;
  }
  
  /* グラフ下部の余白を完全に削除 */
  #elegantCostComparisonChart {
    margin-bottom: -60px !important;
    margin-left: 0px !important;
    display: block !important;
    width: 100% !important;
    max-width: calc(100% + 8px) !important;
  }
  
  /* グラフを含む親要素も調整 */
  .solution-image-placeholder > div > div {
    margin-bottom: 0px !important;
    padding-bottom: 0px !important;
  }
}