/* -----------------------
  cost
----------------------- */
.cost {
  margin-top: max(-49.69vw, -373px);
}
.cost .grid-box {
  display: grid;
}
.cost .grid-box > * {
  grid-area: 1 / 1;
}

.cost > .ttl {
  background: url(../img/cost_ttl_bg.png) no-repeat center top / 100% auto;
}

.cost-01 h3 {
  margin-top: max(-12.4vw, -93px);
  position: relative;
}


.cost-01 .table{
	width: 68%;
	margin: 20% auto 0;
}


.cost-01 .graph-box .graph {
  height: min(55vw, 412px);
  transform: scaleY(0);
  transition: all 0.8s ease;
  transform-origin: 50% 100%;
}
.cost-01 .graph-box.trigger.move .graph {
  transform: scaleY(1);
}
.cost-01 .graph-box .balloon {
  width: min(20vw, 156px);
  margin: min(37vw, 246px) min(8.96vw, 8px) auto auto;
  animation-delay: 1s;
}

.cost-02 h3 {
  margin-top: max(-12.29vw, -92px);
  position: relative;
}
.cost-02 .before-box {
  background: url(../img/cost_02_before_box_bg.png) no-repeat center top / 100% auto;
  padding-bottom: min(15.94vw, 120px);
}
.cost-02 .after-box {
  background: url(../img/cost_02_after_box_bg.png) no-repeat center top / 100% auto;
  margin-top: max(-15.94vw, -120px);
  padding-bottom: max(9vw, 39px);	
}