.progress-container{align-items:center;display:flex;justify-content:space-between;margin:20px auto;max-width:650px}@media screen and (max-width:768px){.progress-container{align-items:baseline;max-width:390px}}.progress-container .step{align-items:center;display:flex;flex-direction:column;text-align:center;width:30%;--circle-size:70px}@media screen and (max-width:768px){.progress-container .step{--circle-size:50px}}.progress-container .step .circle{align-items:center;background-color:#fff;border:2px solid #e9eff3;border-radius:50%;color:#cbd0d3;display:flex;font:normal normal 300 18px/14px Inter;height:var(--circle-size);justify-content:center;transition:background-color .3s,color .3s;width:var(--circle-size);z-index:1}@media screen and (max-width:768px){.progress-container .step .circle{font:normal normal 300 14px/8px Inter}}.progress-container .step .circle.active{background-color:#000;border:2px solid #000;color:#fff}.progress-container .step .label{color:#cbd0d3;font:normal normal normal 17px/32px Noto Sans JP;letter-spacing:0;margin-top:10px;word-break:keep-all}@media screen and (max-width:768px){.progress-container .step .label{font:normal normal normal 13px/18px Noto Sans JP;max-width:91px}}.progress-container .step .label.active{color:#000}.progress-container .step+.step{flex-grow:1;position:relative}.progress-container .step+.step:before{background-color:#e9eff3;content:"";height:2px;left:-50%;position:absolute;right:50%;top:calc(var(--circle-size)/2);transform:translateY(-50%)}