@media only screen and (max-width: 830px) {
  main section:nth-child(1) h1 {
    font-size: 11.5pt;
    line-height: 18pt; }
  main section {
    align-items: flex-start; }
    main section path {
      margin-left: 15vw; }
    main section .ball {
      margin-left: calc( 15vw - 1.25em); }
    main section .container {
      margin-left: calc(15vw - 0.75em); }
      main section .container .phase {
        justify-content: flex-start;
        margin-left: -0.5em; }
        main section .container .phase ul {
          width: 75%;
          margin-left: -0.5em; }
        main section .container .phase h1 {
          position: static;
          width: auto;
          margin-right: 0.5em; }
      main section .container li {
        justify-content: unset; }
        main section .container li .image {
          display: none; }
        main section .container li .point {
          position: static; }
        main section .container li .topic {
          margin-left: 2em;
          margin-right: 0;
          width: 100%;
          position: relative; }
  main section:nth-child(1) {
    align-items: center; }
  main section:nth-child(4) .container li:nth-child(2), main section:nth-child(4) .container .phase {
    text-align: left;
    flex-direction: row; }
    main section:nth-child(4) .container li:nth-child(2) ul, main section:nth-child(4) .container .phase ul {
      margin-left: -0.5em; }
    main section:nth-child(4) .container li:nth-child(2) .topic, main section:nth-child(4) .container .phase .topic {
      margin-left: 2em; }
  .scroll-process {
    margin-left: calc(15vw - 0.9em); } }

@media only screen and (max-width: 630px) {
  body {
    font-size: 11pt; }
  main section .container .phase ul h2, main section .container .phase ul h3 {
    font-size: 12pt; } }

@media only screen and (max-width: 430px) {
  body {
    font-size: 11pt; }
  .topic {
    font-size: 10pt; }
  main section .container .phase ul h2, main section .container .phase ul h3 {
    font-size: 12pt;
    width: 125%; } }