* {
        padding: 0;
        margin: 0;
        box-sizing: border-box;
        user-select: none;
        -webkit-tap-highlight-color: transparent;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
      }

      html,
      body {
        height: 100%;
        min-height: 100%;
        margin: 0;
        -webkit-text-size-adjust: none;
      }
      #calc .line-header {
        margin-top: -20px;
      }
      .section {
        margin: 0 auto;
        width: 100%;
      }

      .inner_content {
        padding: 15px 0px;
      }

      .title {
        font-size: 30px;
        font-weight: bold;
      }
      .line-412 {
        width: 412px;
      }
      .line-449 {
        width: 449px;
      }
      .subtitle {
        font-size: 20px;
        margin-bottom: 15px;
      }

      .row {
        border-radius: 20px;
        min-height: 85px;
        display: flex;
        align-items: center;
        margin: 40px 0px 0px 0px;
      }

      .row-bg {
        background-color: #ffffff;
      }

      .grid12 {
        flex: 0 0 100%;
        max-width: 100%;
        padding-top: 15px;
        padding-bottom: 15px;
      }
      .grid6 {
        flex: 0 0 80%;
        max-width: 80%;
        padding-top: 15px;
        padding-bottom: 15px;
      }

      .grid3 {
        flex: 0 0 20%;
        max-width: 20%;
        padding-top: 15px;
        padding-bottom: 15px;
      }

      .row_title {
        margin: 0px 20px;
        font-size: 20px;
        font-family: Arial, Helvetica, sans-serif;
      }

      .row_button {
        cursor: pointer;
        outline: none;
        /*
    width: 100%;
    max-width: 100px;
    */
        font-size: 18px;
        font-family: Arial, Helvetica, sans-serif;
        border-radius: 20px;
        border: 1px solid #5a5560;
        background: #ffffff;
        transition: background 100ms;
        text-align: center;
        padding: 10px; /* 30px 5px 30px;*/
        vertical-align: middle;
        margin: 0px 10px;
        display: inline-block;
        width: 85px;
        color: #5a5560;
        transition: background-color 0.3s, color 0.3s;
      }
      .row_button:hover {
        background-color: #5a5560;
        color: #ffffff;
      }

      .text-center {
        text-align: center;
      }

      .num_space {
        width: 24px;
        display: inline-block;
      }

      .result_button:hover {
        border: 2px solid #cccccc;
      }

      .result_button {
        cursor: pointer;
        outline: none;
        font-size: 24px;
        font-family: Arial, Helvetica, sans-serif;
        border-radius: 30px;
        border: 2px solid #43354b !important;
        background-color: #43354b;
        transition: background 100ms;
        text-align: center;
        vertical-align: middle;
        display: inline-block;
        padding: 15px 30px;
        color: #ffffff;
      }

      .row_button_selected {
        background: #faed26;
      }

      .innerlist {
        padding-left: 30px;
      }

      .modal_close {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='53.7' height='53.7' viewBox='0 0 53.7 53.7'%3E%3Cpath opacity='1' fill='%23666E6E' d='M35.6 34.4L28 26.8l7.6-7.6c.2-.2.2-.5 0-.7l-.5-.5c-.2-.2-.5-.2-.7 0l-7.6 7.6-7.5-7.6c-.2-.2-.5-.2-.7 0l-.6.6c-.2.2-.2.5 0 .7l7.6 7.6-7.6 7.5c-.2.2-.2.5 0 .7l.5.5c.2.2.5.2.7 0l7.6-7.6 7.6 7.6c.2.2.5.2.7 0l.5-.5c.2-.2.2-.5 0-.7z'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-size: contain;
        position: absolute;
        cursor: pointer;
        outline: none;
        top: 0px;
        right: 0px;
        width: 50px;
        height: 50px;
      }

      .modal {
        display: none;
        position: fixed;
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
        padding: 30px;
      }
      .modal_visible {
        display: block;
      }
      .modal_message {
        position: relative;
        margin: 25% auto 25% auto;
        width: 100%;
        max-width: 570px;
        padding: 60px 30px 30px 30px;
        font-weight: bold;
        font-size: 24px;
        font-family: Arial, Helvetica, sans-serif;
        border-radius: 20px;
        background: #ffffff;
        box-shadow: 0px 0px 25px 25px rgba(0, 0, 0, 0.5);
      }

      .red_message {
        border: 8px solid #ff1f1f;
      }

      .green_message {
        border: 8px solid #87cf6e;
      }

      @media screen and (max-width: 500px) {
        .mobile_hide {
          display: none;
        }
        .num_space {
          width: auto;
        }
        .row {
          flex-direction: column;
        }
        /*
    .row_button {
        width: 100%;
        max-width: 100px;
        margin: 0px;
        padding: 10px 30px;
    }
    */
        .grid6,
        .grid3 {
          flex: 0 0 100%;
          max-width: 100%;
        }
        .modal_message {
          font-size: 18px;
        }
        .title {
          font-size: 20px;
        }
        .subtitle {
          font-size: 16px;
        }
        .row_title {
          font-size: 16px;
        }
        .row_button {
          font-size: 18px;
        }
        .result_button {
          font-size: 18px;
        }
        .modal_message {
          font-size: 18px;
        }
      }