.break-even-chart {
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
}

.break-even-chart__svg {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: initial;
}

/* グリッド線 */
.break-even-chart__grid line {
  stroke: var(--secondary-base-color-code);
  stroke-width: 1;
}

/* 軸 */
.break-even-chart__axis line {
  stroke: var(--main-color-code);
  stroke-width: 1.5;
}

.break-even-chart__axis text {
  fill: var(--main-color-code);
  font-size: 12px;
  font-family: var(--noto-sans-jp);
}

.break-even-chart__axis-label {
  font-size: 11px;
  fill: var(--main-color-code);
}

/* 直線 */
.break-even-chart__line {
  stroke-width: 2.5;
  fill: none;
}

.break-even-chart__line--sales {
  stroke: var(--main-color-code);
}

.break-even-chart__line--recovery {
  stroke: var(--accent-color-code);
  stroke-dasharray: 8, 4;
}

.break-even-chart__line--profit {
  stroke: #4a90a4;
}

/* 損益分岐点 */
.break-even-chart__breakeven-point {
  fill: var(--accent-color-code);
  animation: break-even-pulse 2s ease-in-out infinite;
}

.break-even-chart__breakeven-line {
  stroke: var(--accent-color-code);
  stroke-width: 1;
  stroke-dasharray: 4, 4;
  opacity: 0.6;
}

.break-even-chart__breakeven-label {
  fill: var(--main-color-code);
  font-size: 11px;
  font-family: var(--noto-sans-jp);
  font-weight: 500;
}

.break-even-chart__breakeven-value {
  fill: var(--accent-color-code);
  font-size: 14px;
  font-family: var(--noto-sans-jp);
  font-weight: 700;
}

/* 凡例 */
.break-even-chart__legend-text {
  fill: var(--main-color-code);
  font-size: 11px;
  font-family: var(--noto-sans-jp);
}

/* アニメーション */
@keyframes break-even-pulse {
  0%, 100% {
    r: 8;
    opacity: 1;
  }
  50% {
    r: 11;
    opacity: 0.8;
  }
}

/* レスポンシブ */
@media screen and (max-width: 959px) {
  .break-even-chart {
    max-width: 100%;
  }

  .break-even-chart__axis text {
    font-size: 10px;
  }

  .break-even-chart__axis-label {
    font-size: 9px;
  }

  .break-even-chart__breakeven-label {
    font-size: 9px;
  }

  .break-even-chart__breakeven-value {
    font-size: 12px;
  }

  .break-even-chart__legend-text {
    font-size: 9px;
  }
}