/* -----------------------
  cost
----------------------- */
.cost {
  margin-top: max(-49.69vw, -477px);
}
.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, -119px);
  position: relative;
}


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


.cost-01 .graph-box .graph {
  height: min(55vw, 528px);
  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, 200px);
  margin: min(37vw, 315px) min(8.96vw, 10px) auto auto;
  animation-delay: 1s;
}

.cost-02 h3 {
  margin-top: max(-12.29vw, -118px);
  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, 153px);
}
.cost-02 .after-box {
  background: url(../img/cost_02_after_box_bg.png) no-repeat center top / 100% auto;
  margin-top: max(-15.94vw, -153px);
  padding-bottom: max(9vw, 50px);	
}


