* {
      margin: 0;
      padding: 0;
  }
  /*　iOSのデフォルトの設定を無効か */
  /* コンテキストメニューを無効化する */
  
  button,
  textarea,
  select {
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
  }
  
  body,
  html {
      margin: 0;
      padding: 0;
      width: 100%;
      height: 100%;
      font-family: sans-serif;
      background-color: #f5f3f3;
      scroll-behavior: smooth;
  }
  
  html {
      touch-action: manipulation;
  }
  
  @media screen and (max-width: 768px) {
      .parent {
          margin: 0 auto;
          width: 95%;
      }
  }
  
  @media screen and (min-width: 769px) {
      .parent {
          margin: 0 auto;
          width: 60%;
          max-width: 800px;
      }
  }
  
  @media screen and (max-width: 768px) {
      .parent_price {
          margin: 0 auto;
          width: 95%;
      }
  }
  
  @media screen and (min-width: 769px) {
      .parent_price {
          margin: 0 auto;
          width: 50%;
          max-width: 800px;
      }
  }
  
  .parent_black {
      margin: 0 auto;
      cursor: pointer;
      background-color: #000;
  }
  
  @media screen and (max-width: 768px) {
      .parent_black {
          width: 154px;
          height: fit-content;
      }
  }
  
  @media screen and (min-width: 769px) {
      .parent_black {
          width: fit-content;
          height: 204px;
      }
  }
  
  .send_btn_edit {
      text-align: center;
      font-weight: bold;
      font-size: 1em;
      padding: 5px 5px;
      cursor: pointer;
      border-radius: 6px;
      border-color: #89B700;
      width: 90px;
      color: #FFF;
      background: #89B700;
      margin-bottom: 5px;
      margin-top: 5px;
      box-shadow: none;
      border: none;
  }
  
  .edit_cancel {
      font-weight: bold;
      margin-left: 10px;
      font-size: 1em;
      padding: 5px 5px;
      cursor: pointer;
      border-radius: 6px;
      border-color: #464c5a;
      width: fit-content;
      color: #FFF;
      background: #464c5a;
      margin-bottom: 5px;
  }
  
  .send_btn {
      font-size: 1.1em;
      padding: 5px 5px;
      padding-left: 10px;
      padding-right: 10px;
      cursor: pointer;
      border-radius: 6px;
      border-color: #89B700;
      width: fit-content;
      color: #FFF;
      font-weight: bold;
      background: #89B700;
      border: 1px solid #89B700;
  }
  
  .send_btn2 {
      font-size: 1em;
      padding: 5px 5px;
      cursor: pointer;
      border-radius: 6px;
      border-color: #ff1493;
      width: fit-content;
      color: #FFF;
      background: #ff1493;
  }
  
  .beginner_q {
      border: none;
      padding: 5px 5px;
      margin-top: 3px;
      margin-right: 5px;
      margin-bottom: 8px;
      font-size: 0.9em;
      cursor: pointer;
      border-radius: 6px;
      width: fit-content;
      color: #FFF;
      background: #4a556b;
  }
  
  .beginner_q_close {
      border: none;
      padding: 5px 5px;
      margin-top: 3px;
      margin-right: 5px;
      margin-bottom: 8px;
      font-size: 0.9em;
      cursor: pointer;
      border-radius: 6px;
      width: fit-content;
      color: #FFF;
      background: #475c86;
  }
  
  .beginner_q_hikaku {
      background: #4a556b;
  }
  
  .beginner_q_kankeishi {
      background: #4a556b;
  }
  
  .beginner_q_mix {
      background: #4a556b;
  }
  
  .beginner_q_mirai {
      background: #4a556b;
  }
  
  .beginner_q_keiken {
      background: #4a556b;
  }
  
  .beginner_q_katei {
      background: #4a556b;
  }
  
  .beginner_q_kazu {
      background: #4a556b;
  }
  
  .beginner_q_kenko {
      background: #4a556b;
  }
  
  .beginner_q_hindo {
      background: #4a556b;
  }
  
  .beginner_q_kazoku {
      background: #4a556b;
  }
  
  .beginner_q_kimochi {
      background: #4a556b;
  }
  
  .beginner_q_shuukan {
      background: #4a556b;
  }
  
  .send_btn3 {
      font-size: 1em;
      padding: 5px 20px;
      cursor: pointer;
      border-radius: 6px;
      border-color: #ff1493;
      width: fit-content;
      color: #FFF;
      background: #ff1493;
  }
  
  #ok_button {
      margin-top: 5px;
      margin-bottom: 5px;
      font-size: 0.9em;
      padding: 4px 10px;
      cursor: pointer;
      height: 29px;
      border-radius: 4px;
      width: fit-content;
      color: #FFF;
      background: #464c5a;
      border-style: hidden;
  }
  
  #next_button {
      margin-bottom: 5px;
      font-size: 0.9em;
      padding: 4px 10px;
      cursor: pointer;
      border-radius: 4px;
      border-color: #464c5a;
      width: fit-content;
      color: #FFF;
      background: #464c5a;
      border-style: hidden;
  }
  
  #delete_button {
      margin-left: 10px;
      margin-bottom: 5px;
      font-size: 0.9em;
      padding: 4px 10px;
      cursor: pointer;
      border-radius: 4px;
      border-color: #464c5a;
      width: fit-content;
      color: #FFF;
      background: #464c5a;
      border-style: hidden;
  }
  
  .send_btn4 {
      margin-left: 20px;
      font-size: 1em;
      padding: 5px 15px;
      cursor: pointer;
      border-radius: 6px;
      border-color: #5c595a;
      width: fit-content;
      color: #FFF;
      background: #5c595a;
      border-style: hidden;
  }
  
  .btns {
      margin-top: 20px;
  }
  
  .score {
      position: absolute;
      width: fit-content;
      bottom: 0%;
      left: 0%;
      font-size: 0.9em;
      color: #FFF;
      padding: 3px 3px;
      font-weight: bold;
      text-align: left;
      border-radius: 8px;
      background-color: #6394bc;
      border: 1px solid white;
  }
  
  .score.inverted {
      color: #6394bc;
      background-color: #FFF;
  }
  
  h2 {
      margin-top: 5px;
      font-size: 1.2em;
      color: rgb(69, 64, 63);
      font-weight: bold;
  }
  
  .response {
      text-align: left;
  }
  
  .advice {
      color: #FF9900;
      font-weight: bold;
  }
  
  .container {
      text-align: center;
  }
  
  .mail_parent {
      margin-top: 20px;
      width: 100%;
      text-align: center;
  }
  
  #modoru {
      margin: 0 auto;
      text-align: center;
      width: 100px;
      cursor: pointer;
      background-color: #55575c;
      color: #FFF;
      border-radius: 6px;
      border-style: hidden;
      border: 2px solid #32545f;
      font-weight: bold;
  }
  
  .submit {
      cursor: pointer;
      width: fit-content;
      display: block;
      margin: 0 auto;
      text-align: center;
      font-size: 1em;
      padding: 5px 12px;
      color: #FFF;
      border-radius: 5px;
      font-weight: bold;
      background-color: #68889e;
  }
  
  #thanks {
      text-align: center;
  }
  
  .mail_parent2 {
      width: 90%;
      height: fit-content;
      text-align: center;
      position: fixed;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background-color: #fff;
      padding: 20px;
      border-radius: 10px;
      z-index: 100;
      display: none;
  }
  
  .modal-overlay {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background-color: rgba(0, 0, 0, 0.5);
      z-index: 99;
      display: none;
  }
  
  @media screen and (max-width: 768px) {
      .bigger {
          font-size: 1em;
      }
  }
  
  @media screen and (min-width: 769px) {
      .bigger {
          font-size: 1em;
      }
  }
  
  @media screen and (max-width: 768px) {
      .bigger6 {
          font-weight: bold;
          font-size: 1em;
      }
  }
  
  @media screen and (min-width: 769px) {
      .bigger6 {
          font-weight: bold;
          font-size: 1em;
      }
  }
  
  @media screen and (max-width: 768px) {
      #sound {
          width: 1em;
          height: auto;
      }
  }
  
  .bold {
      font-weight: bold;
  }
  
  h1 {
      padding-top: 5px;
      cursor: pointer;
      font-size: 1.4em;
      color: #5c8aaf;
      /*color: #6394bc;*/
  }
  
  @media screen and (max-width: 768px) {
      #user-input6 {
          border-radius: 6px;
          padding-left: 2px;
          padding-right: 2px;
          padding-top: 2px;
          width: 94%;
      }
  }
  
  @media screen and (min-width: 769px) {
      #user-input6 {
          border-radius: 6px;
          padding-left: 5px;
          padding-right: 5px;
          padding-top: 5px;
          padding-bottom: 2px;
          width: 70%;
      }
  }
  
  @media screen and (max-width: 768px) {
      #user-input7 {
          border-radius: 6px;
          padding-left: 2px;
          padding-right: 2px;
          padding-top: 2px;
          width: 94%;
      }
  }
  
  @media screen and (min-width: 769px) {
      #user-input7 {
          border-radius: 6px;
          padding-left: 5px;
          padding-right: 5px;
          padding-top: 5px;
          padding-bottom: 2px;
          width: 85%;
      }
  }
  
  #ai_any {
      border-radius: 6px;
      padding-left: 5px;
      padding-right: 22px;
      width: auto;
      font-size: 1.2em;
      height: 1.6em;
  }
  
  #ai_age {
      border-radius: 6px;
      padding-left: 5px;
      padding-right: 22px;
      width: auto;
      font-size: 1.2em;
      height: 1.6em;
  }
  
  #ai_kokuseki {
      border-radius: 6px;
      padding-left: 5px;
      padding-right: 22px;
      width: auto;
      font-size: 1.2em;
      height: 1.6em;
  }
  
  #name_man {
      width: fit-content;
      border-radius: 6px;
      padding-left: 5px;
      padding-right: 5px;
      font-size: 1.2em;
      height: 1.6em;
  }
  
  #name_woman {
      width: fit-content;
      border-radius: 6px;
      padding-left: 5px;
      padding-right: 5px;
      font-size: 1.2em;
      height: 1.6em;
  }
  
  #naiyou {
      border-radius: 6px;
      padding: 5px 5px;
  }
  
  #mailtext {
      border-radius: 6px;
      padding-left: 10px;
  }
  
  .mailtext {
      border-radius: 6px;
      padding-left: 10px;
  }
  
  @media screen and (max-width: 768px) {
      .container2 {
          margin-top: 8px;
          width: 95%;
          margin-left: 10px;
      }
  }
  
  @media screen and (min-width: 769px) {
      .container2 {
          margin-top: 15px;
          width: 95%;
          margin-left: 10px;
      }
  }
  
  .footer_link {
      padding-right: 10px;
  }
  
  .footer_logo {
      width: 80px;
      height: auto;
  }
  
  .footer_table {
      width: 100%;
      padding-right: 8px;
  }
  
  .footer_link a {
      color: #525050;
      text-decoration: none;
  }
  
  .logo_parts_hidari {
      width: fit-content;
      text-align: center;
  }
  
  .logo_parts_migi {
      width: fit-content;
  }
  
  .footer_table {
      width: 100%;
      padding-right: 8px;
  }
  
  .footer_link {
      padding-right: 10px;
  }
  
  .footer_logo {
      width: 80px;
      height: auto;
  }
  
  .footer_link a:hover {
      color: #525050;
  }
  
  .loading_bg {
      color: #4f8091;
      z-index: 100;
      position: absolute;
      background: #f7f5f5;
      top: 0;
      height: 100%;
      width: 100%;
      font-family: sans-serif;
      text-align: center;
      display: flex;
      justify-content: center;
      align-items: center;
  }
  
  @media screen and (max-width: 768px) {
      .loading_bg {
          font-size: 1.2em;
      }
  }
  
  @media screen and (min-width: 769px) {
      .loading_bg {
          font-size: 1.5em;
      }
  }
  
  .pcview {
      display: inline !important;
  }
  
  .spview {
      display: none !important;
  }
  
  @media screen and (max-width: 769px) {
      /*tablet , smart phone access*/
      .pcview {
          display: none !important;
      }
      .spview {
          display: inline !important;
      }
  }
  
  .btn3 {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      height: 22px;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      border-color: #ff1493;
      padding: 5px 10px;
      font-size: 0.8em;
      background-color: #ff1493;
      font-weight: 700;
  }
  
  .btn {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      border-color: #32597b;
      padding: 5px 10px;
      font-size: 1em;
      background-color: #32597b;
      font-weight: 700;
  }
  
  .btn_ok {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      border-color: #32597b;
      padding: 5px 10px;
      font-size: 1em;
      background-color: #32597b;
      font-weight: 700;
  }
  
  @media screen and (max-width: 768px) {
      #mailtext {
          padding: 5px;
          margin: 0 auto;
          width: 70%;
      }
  }
  
  @media screen and (min-width: 769px) {
      #mailtext {
          padding: 5px;
          margin: 0 auto;
          width: 40%;
          max-width: 800px;
          min-width: 300px;
      }
  }
  
  @media screen and (max-width: 768px) {
      .mailtext {
          padding: 5px;
          margin: 0 auto;
          width: 90%;
      }
  }
  
  @media screen and (min-width: 769px) {
      .mailtext {
          padding: 5px;
          margin: 0 auto;
          width: 40%;
          max-width: 800px;
          min-width: 300px;
      }
  }
  
  @media screen and (max-width: 768px) {
      #mailtext2 {
          margin: 0 auto;
          width: 95%;
      }
  }
  
  @media screen and (min-width: 769px) {
      #mailtext2 {
          margin: 0 auto;
          width: 50%;
          max-width: 800px;
      }
  }
  
  #mailtext2 {
      border-radius: 6px;
      padding: 5px;
      border-style: solid;
      border-width: 1px;
      border-color: rgb(80, 82, 90);
  }
  
  #niyou {
      padding: 5px;
  }
  
  #sound {
      position: relative;
      left: 50%;
      transform: translateX(-50%);
  }
  
  .advice2 {
      color: darkolivegreen;
      font-size: 0.8em;
      text-decoration: dotted;
  }
  
  .youup {
      width: 150px;
      height: auto;
  }
  
  .chara {
      font-size: 1.4em;
      text-decoration: dotted;
      color: darkolivegreen;
      font-weight: bold;
  }
  
  .chara_img {
      height: 30px;
      width: auto;
      margin-right: 10px;
  }
  
  @media screen and (max-width: 768px) {
      .alisa_rest {
          position: absolute;
          top: 2px;
          bottom: 0%;
          left: 50%;
          transform: translateX(-50%);
          margin-right: 1px;
          width: 240px;
          height: 240px;
          /*width: 130px;
      height: 120px;*/
      }
      .alisa_rip {
          position: absolute;
          top: 2px;
          bottom: 0%;
          left: 50%;
          transform: translateX(-50%);
          margin-right: 1px;
          width: 240px;
          height: 240px;
          /*width: 130px;
      height: 120px;*/
      }
  }
  
  @media screen and (min-width: 769px) {
      .alisa_rest {
          position: absolute;
          top: 2px;
          bottom: 0%;
          left: 50%;
          transform: translateX(-50%);
          margin-right: 1px;
          width: 240px;
          height: 240px;
          /*width: 130px;
      height: 120px;*/
      }
      .alisa_rip {
          position: absolute;
          top: 2px;
          bottom: 0%;
          left: 50%;
          transform: translateX(-50%);
          margin-right: 1px;
          width: 240px;
          height: 240px;
          /*width: 130px;
      height: 120px;*/
      }
  }
  
  #yaku_btn {
      color: darkolivegreen;
      text-decoration: underline;
      font-weight: bold;
  }
  
  #one_point {
      margin: 0 auto;
      width: fit-content;
      text-decoration: underline;
      font-size: 0.8em;
      cursor: pointer;
  }
  
  .kaiyaku {
      font-size: 0.9em;
  }
  
  #ai_kokuseki {
      font-size: 1em;
      border-width: 1px;
      border-color: rgb(80, 82, 90);
      color: #4a6888;
      font-weight: bold;
      background-color: #FFF;
  }
  
  #ai_any {
      font-size: 1em;
      border-width: 1px;
      border-color: rgb(80, 82, 90);
      color: #4a6888;
      font-weight: bold;
      background-color: #FFF;
  }
  
  .lang_select {
      font-size: 1em;
      border-width: 1px;
      border-color: rgb(80, 82, 90);
      color: #4a6888;
      font-weight: bold;
      background-color: #FFF;
  }
  
  .lang_select {
      border-radius: 6px;
      padding-left: 5px;
      padding-right: 22px;
      width: auto;
      font-size: 1.2em;
      height: 1.6em;
  }
  /*モダルウィンドウ言語セレクトSP*/
  
  .modal_lang {
      z-index: 5;
      height: 100vh;
      position: fixed;
      top: 0;
      width: 100%;
      text-align: center;
      display: flex;
      justify-content: center;
      align-items: center;
  }
  
  .modal_bg_lang {
      display: none;
      z-index: 3;
      background: rgba(52, 53, 54, 0.5);
      height: 100vh;
      position: absolute;
      width: 100%;
  }
  
  .modal_content_lang {
      display: none;
      z-index: 5;
      color: #FFF;
      text-align: left;
      display: inline-block;
      padding: 20px 30px;
      position: absolute;
      font-size: 15px;
      border-radius: 12px;
      background-color: #3c5461;
      border: medium solid #68889e;
      max-height: 90vh;
      max-width: 90%;
      width: fit-content;
      overflow: auto;
  }
  
  .modal_content_lang::-webkit-scrollbar {
      display: none;
  }
  
  #language {
      text-align: center;
      padding-left: 5px;
      height: 30px;
      font-size: 1.2em;
      background-color: #FFF;
  }
  
  #langselect {
      text-align: center;
      height: 28px;
      margin: 0;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      border-color: #89B700;
      padding: 5px 5px;
      font-size: 1.2em;
      background-color: #89B700;
      font-weight: 700;
  }
  
  .lang_select_text {
      text-align: left;
  }
  
  .tran_btn {
      height: 25px;
      width: auto;
  }
  
  .tran_btn_small {
      height: 20px;
      width: auto;
  }
  
  .honyaku_text {
      color: #484b53;
  }
  
  #jobs {
      margin-top: 5px;
      border-radius: 6px;
      padding-left: 5px;
      padding-right: 22px;
      width: auto;
      height: 1.6em;
  }
  
  #jobs {
      font-size: 1em;
      border-width: 1px;
      border-color: rgb(80, 82, 90);
      color: #4a6888;
      font-weight: bold;
      background-color: #FFF;
  }
  
  .red {
      color: red;
      font-weight: bold;
  }
  
  #button {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      padding: 5px 10px;
      height: 50px;
      font-size: 1em;
      background-color: #ff1493;
      font-weight: 700;
  }
  
  #button2 {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      padding: 5px 12px;
      height: 50px;
      font-size: 1.1em;
      background-color: #89B700;
      font-weight: 700;
  }
  
  #button3 {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      padding: 5px 12px;
      height: 50px;
      font-size: 1.1em;
      background-color: #ff1493;
      font-weight: 700;
  }
  
  #button5 {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 8px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      padding: 5px 10px;
      height: 50px;
      font-size: 1em;
      Width: 150px;
      background-color: #ff1493;
      font-weight: 700;
  }
  
  #button6 {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      padding: 5px 10px;
      height: 30px;
      font-size: 1em;
      background-color: #464c5a;
      font-weight: 700;
  }
  
  #button7 {
      margin-left: 10px;
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      padding: 5px 10px;
      height: 30px;
      font-size: 1em;
      background-color: #464c5a;
      font-weight: 700;
  }
  
  #button4 {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      padding: 5px 10px;
      height: 30px;
      font-size: 1em;
      background-color: #ff1493;
      font-weight: 700;
  }
  
  #start {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      padding: 5px 10px;
      height: 30px;
      font-size: 1em;
      background-color: #ff1493;
      font-weight: 700;
  }
  
  #start.inverted {
      color: #ff1493;
      background-color: #FFF;
  }
  
  .modal1 {
      display: none;
      z-index: 10;
      height: 100vh;
      position: fixed;
      top: 0;
      width: 100%;
      text-align: center;
      display: flex;
      justify-content: center;
      align-items: center;
  }
  
  .modal_bg1 {
      display: none;
      z-index: 9;
      background: rgba(52, 53, 54, 0.1);
      height: 100vh;
      position: absolute;
      width: 100%;
  }
  
  @media screen and (max-width: 768px) {
      .modal_content1 {
          display: none;
          z-index: 10;
          color: #000;
          background-color: #FFF;
          border: medium solid #68889e;
          border-radius: 6px;
          text-align: center;
          display: inline-block;
          padding: 10px;
          position: absolute;
          max-height: 90vh;
          width: 90%;
          overflow: auto;
      }
  }
  
  @media screen and (min-width: 769px) {
      .modal_content1 {
          display: none;
          z-index: 10;
          color: #000;
          background-color: #FFF;
          border: medium solid #68889e;
          border-radius: 6px;
          text-align: center;
          display: inline-block;
          padding: 10px;
          position: absolute;
          max-height: 90vh;
          max-width: 100%;
          width: fit-content;
          overflow: auto;
      }
  }
  
  .modal_content1::-webkit-scrollbar {
      display: none;
  }
  
  .mojide {
      color: #FFF;
      background-color: #89B700;
      font-weight: bold;
      cursor: pointer;
      border-radius: 6px;
      padding-left: 4px;
      padding-right: 4px;
  }
  
  .q {
      margin-left: 2px;
      margin-right: 2px;
      margin-top: 2px;
      width: 1.6em;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      display: inline-block;
      text-align: center;
      color: #fff;
      border-radius: 4px;
      border-style: hidden;
      padding: 3px 3px;
      padding-bottom: 4px;
      height: 25px;
      font-size: 1em;
      background-color: #464c5a;
      font-weight: 700;
  }
  
  .q_space {
      margin-left: 2px;
      margin-right: 2px;
      margin-top: 2px;
      width: fit-content;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      display: inline-block;
      text-align: center;
      color: #fff;
      border-radius: 4px;
      border-style: hidden;
      padding: 3px 3px;
      padding-bottom: 4px;
      height: 25px;
      font-size: 1em;
      background-color: #464c5a;
      font-weight: 700;
  }
  /*.edit {
      margin-left: 2px;
      margin-right: 2px;
      margin-top: 2px;
      width: fit-content;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      display: inline-block;
      text-align: center;
      color: #fff;
      cursor: pointer;
      border-style: hidden;
      border-radius: 4px;
      padding: 3px 3px;
      padding-bottom: 4px;
      height: 25px;
      font-size: 0.9em;
      background-color: #464c5a;
      font-weight: 700;
      vertical-align: bottom;
  }*/
  
  .edit {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 8px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      padding: 5px 10px;
      height: 50px;
      font-size: 1em;
      width: fit-content;
      background-color: #464c5a;
      font-weight: 700;
  }
  /*.q_yaku {
      margin-left: 2px;
      margin-right: 2px;
      margin-top: 2px;
      width: fit-content;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      display: inline-block;
      text-align: center;
      color: #fff;
      cursor: pointer;
      border-style: hidden;
      border-radius: 4px;
      padding: 3px 3px;
      padding-bottom: 4px;
      height: 25px;
      font-size: 0.9em;
      background-color: #464c5a;
      font-weight: 700;
      vertical-align: bottom;
  }
  
  .q_yaku2 {
      cursor: pointer;
      color: #fff;
      font-size: 0.9em;
      border-style: hidden;
      border-radius: 4px;
      padding: 3px 3px;
      padding-bottom: 4px;
      height: 25px;
      font-size: 0.9em;
      background-color: #464c5a;
  }*/
  
  #speaker {
      border-style: hidden;
  }
  
  .q_speaker {
      margin-top: 2px;
      cursor: pointer;
      width: 30px;
      height: 30px;
      vertical-align: bottom;
  }
  
  .center {
      text-align: center;
  }
  
  .explain_contents {
      padding: 11px;
      text-align: center;
      font-size: 1em;
      text-align: left;
  }
  
  .explain_parent {
      width: 100%;
      background-color: #FFF;
      border-radius: 6px;
  }
  
  .price_plan {
      width: 100%;
      background-color: #FFF;
      border-radius: 6px;
  }
  
  h3 {
      margin-left: 5px;
      margin-right: 5px;
      padding-top: 11px;
      font-weight: bold;
      font-size: 1.2em;
      color: #4c7ba1;
  }
  
  @media screen and (max-width: 768px) {
      h3 {
          text-align: left;
      }
  }
  
  @media screen and (min-width: 769px) {
      h3 {
          text-align: left;
      }
  }
  
  h4 {
      padding-top: 11px;
      font-weight: bold;
      text-align: center;
      font-size: 1.2em;
      color: #4c7ba1;
  }
  
  .h4-container {
      text-align: center;
      /* テキストと画像を中央揃え */
  }
  
  h5 {
      padding-top: 11px;
      font-weight: bold;
      text-align: center;
      font-size: 1.2em;
      color: #4c7ba1;
  }
  
  @media screen and (max-width: 768px) {
      h5 {
          text-align: left;
      }
  }
  
  @media screen and (min-width: 769px) {
      h5 {
          text-align: center;
      }
  }
  
  .main_blue {
      color: #4c7ba1;
      font-size: 1.1em;
  }
  
  .gray {
      color: #89B700;
  }
  
  .checkmark002 {
      padding-right: 5px;
      padding-left: 24px;
      position: relative;
  }
  
  .checkmark002:before,
  .checkmark002:after {
      content: "";
      display: block;
      position: absolute;
  }
  
  .checkmark002:before {
      width: 1.1em;
      height: 1.1em;
      border-radius: 0.7em;
      background: #89B700;
      border: 1px solid #89B700;
      left: 0;
      top: 0.1em;
  }
  
  .checkmark002:after {
      border-left: 3px solid #FFF;
      border-bottom: 3px solid #FFF;
      width: 0.5em;
      height: 0.3em;
      -webkit-transform: rotate(-45deg);
      transform: rotate(-45deg);
      left: 0.3em;
      top: 0.4em;
  }
  
  .checkmark003 {
      padding-right: 5px;
      padding-left: 24px;
      position: relative;
  }
  
  .checkmark003:before,
  .checkmark003:after {
      content: "";
      display: block;
      position: absolute;
  }
  
  .checkmark003:before {
      width: 1.1em;
      height: 1.1em;
      border-radius: 0.7em;
      background: #557005;
      border: 1px solid #557005;
      left: 0;
      top: 0.1em;
  }
  
  .checkmark003:after {
      border-left: 3px solid #FFF;
      border-bottom: 3px solid #FFF;
      width: 0.5em;
      height: 0.3em;
      -webkit-transform: rotate(-45deg);
      transform: rotate(-45deg);
      left: 0.3em;
      top: 0.4em;
  }
  
  .checkmark004 {
      padding-right: 5px;
      padding-left: 24px;
      position: relative;
  }
  
  .checkmark004:before,
  .checkmark004:after {
      content: "";
      display: block;
      position: absolute;
  }
  
  .checkmark004:before {
      width: 1.1em;
      height: 1.1em;
      border-radius: 0.7em;
      background: #FF9900;
      border: 1px solid #FF9900;
      left: 0;
      top: 0.1em;
  }
  
  .checkmark004:after {
      border-left: 3px solid #FFF;
      border-bottom: 3px solid #FFF;
      width: 0.5em;
      height: 0.3em;
      -webkit-transform: rotate(-45deg);
      transform: rotate(-45deg);
      left: 0.3em;
      top: 0.4em;
  }
  
  .checkmark005 {
      padding-right: 5px;
      padding-left: 24px;
      position: relative;
  }
  
  .checkmark005:before,
  .checkmark005:after {
      content: "";
      display: block;
      position: absolute;
  }
  
  .checkmark005:before {
      width: 1.1em;
      height: 1.1em;
      border-radius: 0.7em;
      background: #89B700;
      border: 1px solid #89B700;
      left: 0;
      top: 0.1em;
  }
  
  .checkmark005:after {
      border-left: 3px solid #FFF;
      border-bottom: 3px solid #FFF;
      width: 0.5em;
      height: 0.3em;
      -webkit-transform: rotate(-45deg);
      transform: rotate(-45deg);
      left: 0.3em;
      top: 0.4em;
  }
  
  .checkmark006 {
      padding-right: 5px;
      padding-left: 24px;
      position: relative;
  }
  
  .checkmark006:before,
  .checkmark006:after {
      content: "";
      display: block;
      position: absolute;
  }
  
  .checkmark006:before {
      width: 1.1em;
      height: 1.1em;
      border-radius: 0.7em;
      background: #6991bf;
      border: 1px solid #6991bf;
      left: 0;
      top: 0.1em;
  }
  
  .checkmark006:after {
      border-left: 3px solid #FFF;
      border-bottom: 3px solid #FFF;
      width: 0.5em;
      height: 0.3em;
      -webkit-transform: rotate(-45deg);
      transform: rotate(-45deg);
      left: 0.3em;
      top: 0.4em;
  }
  
  .please_plan {
      margin-left: 5px;
      font-size: 1.1em;
      color: #a61f1f;
      margin-bottom: 3px;
      margin-top: 3px;
      font-weight: bold;
  }
  
  .media_parts {
      font-size: 0.9em;
      width: 100%;
      background-color: #FFF;
      border-radius: 6px;
  }
  
  .news_parts {
      font-size: 0.9em;
      width: 100%;
      background-color: #FFF;
      border-radius: 6px;
  }
  
  .story {
      text-align: center;
      font-size: 0.9em;
      width: 100%;
      background-color: #FFF;
      border-radius: 6px;
  }
  
  @media screen and (max-width: 768px) {
      .news_text_contents {
          width: 100%;
      }
  }
  
  @media screen and (min-width: 769px) {
      .news_text_contents {
          width: fit-content;
      }
  }
  
  .media2 {
      padding: 10px;
  }
  
  .media a {
      color: black;
      text-decoration: none;
  }
  
  @media screen and (max-width: 768px) {
      .media_image {
          width: 90px;
          height: auto;
          margin-left: 7px;
          margin-right: 7px;
          margin-bottom: 5px;
          margin-top: 5px;
      }
  }
  
  @media screen and (min-width: 769px) {
      .media_image {
          width: 110px;
          height: auto;
          margin-left: 7px;
          margin-right: 7px;
          margin-bottom: 5px;
          margin-top: 5px;
      }
  }
  
  .media_logo {
      text-align: center;
  }
  
  .lets_ask {
      width: 100%;
      background-color: #FFF;
      border-radius: 6px;
  }
  
  .lets_ask2 {
      padding: 10px;
  }
  
  @media screen and (max-width: 768px) {
      .pub {
          display: block;
          margin: 0 auto;
          width: 150px;
          height: auto;
      }
  }
  
  @media screen and (min-width: 769px) {
      .pub {
          display: block;
          margin: 0 auto;
          width: 150px;
          height: auto;
      }
  }
  
  .p_ai0 {
      cursor: pointer;
      width: 85px;
      height: 85px;
      position: relative;
      display: inline-block;
  }
  
  .p_ai {
      cursor: pointer;
      position: relative;
      /* 追加: p_aiを相対位置指定の基準とする */
      width: 100%;
      /* 追加: p_aiの幅を親要素に合わせる */
      height: 100%;
      /* 追加: p_aiの高さを親要素に合わせる */
  }
  
  .p_ai img {
      width: 85px;
      /* 幅を指定 */
      height: 85px;
      /* 高さを指定 */
  }
  
  .p_ai2 {
      z-index: 2;
      position: absolute;
      bottom: 10px;
      /* 修正: 単位(px)を追加 */
      right: 11px;
      /* 修正: 単位(px)を追加 */
      width: 12px;
      height: 12px;
      background-color: #89B700;
      border-radius: 50%;
      border: 2px solid white;
  }
  
  .p_ai2_red {
      z-index: 2;
      position: absolute;
      bottom: 10px;
      /* 修正: 単位(px)を追加 */
      right: 11px;
      /* 修正: 単位(px)を追加 */
      width: 12px;
      height: 12px;
      background-color: #a70b1e;
      border-radius: 50%;
      border: 2px solid white;
      pointer-events: none;
  }
  
  .news {
      width: 100%;
      overflow: hidden;
      white-space: nowrap;
      position: relative;
  }
  
  .news-text {
      display: inline-block;
      /* 必須 */
      padding-left: 100%;
      /* 右端から文字をスタートさせるため */
      white-space: nowrap;
      /* 改行が起こらないように対策 */
      line-height: 1em;
      animation: scroll 10s linear 0s infinite;
  }
  
  @keyframes scroll {
      0% {
          transform: translateX(0)
      }
      100% {
          transform: translateX(-100%)
      }
  }
  
  .small_text {
      font-size: 0.8em;
  }
  
  .small_text2 {
      font-size: 0.9em;
  }
  
  @media screen and (max-width: 768px) {
      .chara_container {
          position: relative;
          height: 240px;
          width: 240px;
          margin: 0 auto;
      }
  }
  
  @media screen and (min-width: 769px) {
      .chara_container {
          position: relative;
          height: 240px;
          width: 240px;
          margin: 0 auto;
      }
  }
  
  .chara_name_container {
      position: absolute;
      top: 0%;
      left: 0%;
  }
  
  .chara_name {
      position: absolute;
      width: fit-content;
      top: 0%;
      left: 0%;
      font-size: 0.9em;
      color: #FFF;
      padding: 3px 3px;
      font-weight: bold;
      text-align: left;
      background-color: #000;
  }
  
  .zoon {
      position: absolute;
      width: fit-content;
      top: 0%;
      right: 0%;
      font-size: 0.9em;
      color: #FFF;
      padding: 3px 3px;
      font-weight: bold;
      text-align: right;
      width: 60px;
      height: auto;
  }
  
  .mike_zoon {
      z-index: 4;
      position: absolute;
      width: fit-content;
      bottom: 0%;
      right: 0%;
      font-size: 0.9em;
      color: #FFF;
      padding: 3px 3px;
      font-weight: bold;
      text-align: right;
      width: 40px;
      height: auto;
  }
  
  .ripple_zoon {
      z-index: 5;
      position: absolute;
      width: fit-content;
      bottom: 0%;
      right: 0%;
      font-size: 0.9em;
      color: #FFF;
      padding: 3px 3px;
      font-weight: bold;
      text-align: right;
      width: 40px;
      height: auto;
  }
  /* .image-container要素のスタイルを指定 */
  
  @media screen and (max-width: 768px) {
      .image-container {
          margin: 0 auto;
          height: 245px;
          width: 245px;
          background-color: #000;
      }
  }
  
  @media screen and (min-width: 769px) {
      .image-container {
          margin: 0 auto;
          height: 245px;
          width: 245px;
          background-color: #000;
      }
  }
  
  @media screen and (max-width: 768px) {
      .first_mess {
          text-align: left;
          width: 80%;
      }
  }
  
  @media screen and (min-width: 769px) {
      .first_mess {
          text-align: center;
          width: 50%;
      }
  }
  
  @media screen and (max-width: 768px) {
      .text_speak {
          padding-top: 3px;
          line-height: 1em;
          min-height: 10px;
          text-align: left;
      }
  }
  
  @media screen and (min-width: 769px) {
      .text_speak {
          padding-top: 10px;
          line-height: 1em;
          min-height: 20px;
          text-align: left;
      }
  }
  
  .text_honyaku {
      padding-top: 0px;
      display: flex;
      justify-content: center;
      text-align: center;
  }
  
  @media screen and (max-width: 768px) {
      .text_honyaku2 {
          padding-top: 0px;
          text-align: left;
      }
  }
  
  @media screen and (min-width: 769px) {
      .text_honyaku2 {
          padding-top: 0px;
          text-align: left;
      }
  }
  
  #yaku {
      text-align: left;
  }
  
  #interim_span {
      text-align: left;
      font-size: 1.1em;
      color: darkgreen;
  }
  
  hr {
      height: 0;
      margin: 0;
      padding: 0;
      border: 0;
  }
  
  hr {
      margin: 0 auto;
      width: 95%;
      border-top: 1px dotted #aaa;
  }
  
  @media screen and (max-width: 768px) {
      .auto_text {
          color: #324d72;
          text-align: left;
          font-size: 1em;
          font-weight: bold;
          width: 98%;
      }
  }
  
  @media screen and (min-width: 769px) {
      .auto_text {
          color: #324d72;
          text-align: left;
          font-size: 1em;
          font-weight: bold;
          width: 95%;
      }
  }
  
  .history_contents {
      color: #000;
      text-align: left;
  }
  
  #correct {
      width: 98%;
      text-align: left;
      color: #2d4b56;
      font-weight: bold;
      background-color: #FFF;
      padding: 5px 5px;
      border-radius: 6px;
      border: 1px solid #54685e;
  }
  
  .tutaeru {
      text-align: center;
  }
  
  .trial_text {
      text-align: left;
  }
  
  #user_in {
      font-weight: bold;
      color: darkgreen;
      text-align: left;
  }
  
  .topic_yaku {
      color: #6394bc;
      font-size: 0.9em;
      font-weight: bolder;
      text-decoration: underline;
  }
  
  .hitokuchi {
      margin: 0 auto;
      padding-top: 0px;
      display: flex;
      /*justify-content: center;*/
      width: 98%;
      text-align: center;
      margin-bottom: 6px;
  }
  
  .onsei_onoff {
      height: 1.2em;
      width: auto;
  }
  
  .onoff {
      text-align: left;
  }
  
  .onoff span {
      margin: 0 7px;
  }
  
  .topics_img {
      cursor: pointer;
      margin-right: 10px;
  }
  
  .button-container {
      display: flex;
  }
  
  .button-container2 {
      display: flex;
  }
  
  .topics_btn2 {
      height: 24px;
      display: flex;
      justify-content: center;
      align-items: center;
      cursor: pointer;
      border: none;
      padding-right: 15px;
      padding-left: 15px;
      margin-right: 5px;
      margin-top: 8px;
      font-size: 0.9em;
      border-radius: 6px;
      color: #FFF;
      font-weight: bold;
      background: #D91718;
  }
  
  .topics_btn {
      height: 24px;
      display: flex;
      justify-content: center;
      align-items: center;
      cursor: pointer;
      border: none;
      padding-right: 15px;
      padding-left: 15px;
      margin-right: 5px;
      margin-top: 8px;
      font-size: 0.9em;
      border-radius: 6px;
      color: #FFF;
      font-weight: bold;
      background: #D91718;
  }
  
  .begin_menu {
      margin-top: 15px;
  }
  
  .mike {
      position: relative;
      width: 40px;
      height: auto;
  }
  
  .photo {
      border-radius: 10px;
      background-color: #FFF;
      text-align: center;
  }
  
  .chara_review {
      margin-top: 5px;
      background-color: #000;
      width: 200px;
      height: auto;
      border: 2px solid black;
      padding: 2px;
  }
  
  .preview {
      display: block;
      margin: auto;
      width: 200px;
      height: auto;
  }
  
  .preview2 {
      display: block;
      margin: auto;
      width: 200px;
      height: auto;
      cursor: pointer;
  }
  
  .iphone_mike {
      width: 85%;
      height: auto;
  }
  
  .iphone_mike_for_faq {
      width: 70%;
      height: auto;
  }
  
  .iphone_mess {
      text-align: left;
  }
  
  .ripple2 {
      width: 30px;
      height: auto;
      margin-right: 5px;
  }
  
  #textInput {
      margin-right: 3px;
      border-radius: 5px;
      font-weight: bold;
      line-height: 1.2em;
      width: 85%;
      font-size: 0.9em;
      color: #000;
      background: #FFF;
  }
  
  @media screen and (max-width: 768px) {
      .bigger4 {
          font-size: 1em;
      }
  }
  
  @media screen and (min-width: 769px) {
      .bigger4 {
          font-size: 1.2em;
      }
  }
  
  @media screen and (max-width: 768px) {
      .bigger5 {
          font-size: 1em;
      }
  }
  
  @media screen and (min-width: 769px) {
      .bigger5 {
          font-size: 1.2em;
      }
  }
  
  .circle {
      display: inline-block;
      width: 1em;
      height: 1em;
      border-radius: 50%;
      background: rgb(200, 21, 80);
      color: #FFF;
      text-align: center;
      line-height: 1.2em;
      margin-right: 3px;
  }
  
  .circle2 {
      display: inline-block;
      width: 110px;
      height: 110px;
      border-radius: 50%;
      background: #b0c4de;
      text-align: center;
      line-height: 110px;
      color: #FFF;
      font-weight: bold;
  }
  
  .circle3 {
      display: inline-block;
      width: 110px;
      height: 110px;
      border-radius: 50%;
      background: #87ceeb;
      text-align: center;
      line-height: 110px;
      color: #FFF;
      font-weight: bold;
  }
  
  .circle3b {
      display: inline-block;
      width: 110px;
      height: 110px;
      border-radius: 50%;
      background: #b0c4de;
      text-align: center;
      line-height: 110px;
      color: #FFF;
      font-weight: bold;
  }
  
  .price_list {
      width: fit-content;
      margin: 0 auto;
      text-align: center;
  }
  
  .price_list_child {
      width: fit-content;
      text-align: left;
  }
  
  .price_list_child2 {
      width: 100%;
      text-align: left;
  }
  
  .check_box_center {
      display: flex;
      justify-content: center;
  }
  
  .check_box_center_child {
      text-align: left;
  }
  
  .ECM_CheckboxInput {
      padding: 12px 8px;
      display: flex;
      align-items: center;
      cursor: pointer;
  }
  
  .ECM_CheckboxInput-Input {
      margin: 0;
      width: 0;
      opacity: 0;
  }
  
  .ECM_CheckboxInput:hover>.ECM_CheckboxInput-DummyInput {
      background: #f6f4f4 !important;
      border: solid 2px #333333;
  }
  
  .ECM_CheckboxInput-Input:focus+.ECM_CheckboxInput-DummyInput {
      background: #f6f4f4 !important;
      border: solid 2px #333333;
  }
  
  .ECM_CheckboxInput-Input:checked+.ECM_CheckboxInput-DummyInput {
      border: solid 2px #333333;
      background: #FFFFFF;
  }
  
  .ECM_CheckboxInput-Input:checked+.ECM_CheckboxInput-DummyInput::before {
      content: "";
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJmZWF0aGVyIGZlYXRoZXItY2hlY2siPjxwb2x5bGluZSBwb2ludHM9IjIwIDYgOSAxNyA0IDEyIj48L3BvbHlsaW5lPjwvc3ZnPg==") no-repeat center;
      background-size: contain;
  }
  
  .ECM_CheckboxInput-DummyInput {
      position: relative;
      top: 0;
      left: 0;
      display: block;
      width: 32px;
      height: 32px;
      border: solid 2px #888888;
      background: #FFFFFF;
      border-radius: 4px;
  }
  
  .ECM_CheckboxInput-DummyInput.inverted {
      border: solid 2px rgb(115, 155, 184);
      background: #bdd5ef;
  }
  
  .ECM_CheckboxInput-LabelText {
      margin-left: 12px;
      display: block;
      font-size: 1em;
      font-weight: bold;
  }
  
  .ECM_CheckboxInput-Input:checked+.ECM_CheckboxInput-DummyInput2::before {
      content: "";
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJmZWF0aGVyIGZlYXRoZXItY2hlY2siPjxwb2x5bGluZSBwb2ludHM9IjIwIDYgOSAxNyA0IDEyIj48L3BvbHlsaW5lPjwvc3ZnPg==") no-repeat center;
      background-size: contain;
  }
  
  .ECM_CheckboxInput-DummyInput2 {
      position: relative;
      top: 0;
      left: 0;
      display: block;
      width: 32px;
      height: 32px;
      border: solid 2px #888888;
      background: #e5e3e3;
      border-radius: 4px;
  }
  
  #make_account_btn {
      display: inline-block;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 15px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      padding: 12px 20px;
      font-size: 1.1em;
      background-color: #68889e;
      font-weight: 700;
      cursor: pointer;
  }
  
  @media screen and (max-width: 768px) {
      .chuui_text {
          font-size: 0.9em;
          text-align: left;
          margin: 0 auto;
          max-width: 95%;
          margin-bottom: 10px;
      }
  }
  
  @media screen and (min-width: 769px) {
      .chuui_text {
          font-size: 0.9em;
          text-align: left;
          margin: 0 auto;
          max-width: 70%;
          margin-bottom: 15px;
      }
  }
  
  @media screen and (max-width: 768px) {
      .textarea_parent {
          display: flex;
          justify-content: center;
          align-items: center;
          width: 98%;
      }
  }
  
  @media screen and (min-width: 769px) {
      .textarea_parent {
          display: flex;
          justify-content: center;
          align-items: center;
          width: fit-content;
      }
  }
  
  .form_payment {
      padding-right: 40px;
  }
  
  .paytext {
      font-size: 1em;
      color: #464444;
  }
  
  #textInput {
      margin-right: 3px;
      border-radius: 5px;
      font-weight: bold;
      line-height: 1.2em;
      width: 85%;
      font-size: 0.9em;
      color: #FFF;
      background: #253256;
  }
  
  #inputadd {
      margin-right: 3px;
      border-radius: 5px;
      font-weight: bold;
      line-height: 1.2em;
      width: 85%;
      font-size: 0.9em;
      color: #FFF;
      background: #253256;
  }
  
   ::placeholder {
      color: #FFF;
  }
  
   ::-webkit-input-placeholder {
      color: #FFF;
  }
  
   :-ms-input-placeholder {
      color: #FFF;
  }
  
  textarea:focus::placeholder {
      color: #50a5c1;
  }
  
  #input_check {
      cursor: pointer;
      width: fit-content;
      border-style: hidden;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      padding: 12px 20px;
      font-size: 1em;
      background-color: #68889e;
      font-weight: 700;
  }
  
  #input_check2 {
      width: fit-content;
      border-style: hidden;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      padding: 5px 10px;
      font-size: 0.8em;
      background-color: #595658;
      font-weight: 700;
  }
  
  #input_check {
      display: block;
      margin: 0 auto;
      text-align: center;
  }
  
  #input_check2 {
      display: block;
      margin: 0 auto;
      text-align: center;
  }
  
  .input_check2_wrapper {
      text-align: center;
  }
  
  .input_check2 {
      display: inline-block;
      width: fit-content;
      border-style: hidden;
      text-align: center;
      margin-top: 5px;
      margin-left: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      padding: 5px 10px;
      font-size: 0.8em;
      background-color: #595658;
      font-weight: 700;
      box-shadow: 2px 2px 4px #595658;
  }
  
  .list-item {
      height: 60px;
  }
  
  .menu-title {
      text-align: center;
      color: #fff;
      font-size: 1.1em;
      height: 50px;
      padding-top: 18px;
      padding-bottom: 4px;
      font-weight: 600;
      font-family: sans-serif;
  }
  
  @media (min-width: 769px) {
      .list-item {
          height: 60px;
      }
      .menu-title {
          height: 50px;
          padding-top: 20px;
          padding-bottom: 20px;
      }
  }
  /*　ハンバーガーボタン　*/
  
  .hamburger {
      cursor: pointer;
      display: block;
      position: fixed;
      z-index: 13;
      right: 5px;
      top: 5px;
      width: 42px;
      height: 42px;
      cursor: pointer;
      text-align: center;
  }
  
  .hamburger span {
      display: block;
      position: absolute;
      width: 30px;
      height: 2px;
      left: 6px;
      background: #b75f5f;
      -webkit-transition: 0.5s ease-in-out;
      -moz-transition: 0.5s ease-in-out;
      transition: 0.5s ease-in-out;
  }
  
  .hamburger span:nth-child(1) {
      top: 10px;
  }
  
  .hamburger span:nth-child(2) {
      top: 20px;
  }
  
  .hamburger span:nth-child(3) {
      top: 30px;
  }
  
  @media (min-width: 769px) {
      .hamburger {
          display: block;
          position: fixed;
          z-index: 13;
          right: 13px;
          top: 12px;
          width: 42px;
          height: 42px;
          cursor: pointer;
          text-align: center;
      }
      .hamburger span {
          display: block;
          position: absolute;
          width: 30px;
          height: 2px;
          left: 6px;
          background: #b75f5f;
          -webkit-transition: 0.5s ease-in-out;
          -moz-transition: 0.5s ease-in-out;
          transition: 0.5s ease-in-out;
      }
      .hamburger span:nth-child(1) {
          top: 10px;
      }
      .hamburger span:nth-child(2) {
          top: 20px;
      }
      .hamburger span:nth-child(3) {
          top: 30px;
      }
  }
  /* ナビ開いてる時のボタン */
  
  .hamburger.active span:nth-child(1) {
      top: 16px;
      left: 6px;
      -webkit-transform: rotate(315deg);
      -moz-transform: rotate(315deg);
      transform: rotate(315deg);
  }
  
  .hamburger.active span:nth-child(2),
  .hamburger.active span:nth-child(3) {
      top: 16px;
      -webkit-transform: rotate(-315deg);
      -moz-transform: rotate(-315deg);
      transform: rotate(-315deg);
  }
  
  nav.globalMenuSp {
      position: fixed;
      z-index: 12;
      top: 0;
      left: 0;
      color: #000;
      background: #fff;
      text-align: center;
      transform: translateX(100%);
      transition: all 0.6s;
      width: 100%;
      overflow-y: scroll;
  }
  
  .globalMenuSp::-webkit-scrollbar {
      display: none;
  }
  
  nav.globalMenuSp ul {
      background: rgb(160, 159, 159);
      margin: 0 auto;
      padding: 0;
      width: 100%;
  }
  
  nav.globalMenuSp ul li {
      list-style-type: none;
      padding: 0;
      width: 100%;
      height: auto;
      border-bottom: 1px solid #fff;
  }
  
  nav.globalMenuSp ul li:last-child {
      padding-bottom: 0;
      border-bottom: none;
  }
  
  nav.globalMenuSp ul li:hover {
      background: #b0b0b0;
  }
  /* このクラスを、jQueryで付与・削除する */
  
  nav.globalMenuSp.active {
      transform: translateX(0%);
  }
  /* アコーディオン */
  
  .contents_menu {
      font-size: 1em;
      display: none;
      text-decoration: none;
  }
  
  .cencept_pa {
      width: 100%;
      text-align: center;
      display: inline-block;
  }
  
  .cencept_pa .concept {
      color: #fff;
      font-weight: bold;
      font-size: 16px;
      text-align: left;
      width: 98%;
      padding-left: 7px;
      padding-right: 7px;
      display: inline-block;
  }
  
  @media (min-width: 769px) {
      .cencept_pa .concept {
          width: 50%;
          text-align: left;
          display: inline-block;
      }
  }
  
  .account_item {
      margin-top: 1em;
      color: #2F96BB;
      font-weight: bold;
  }
  
  .small2 {
      font-size: 0.8em;
  }
  
  .account_item {
      margin-top: 1em;
      color: #2F96BB;
      font-weight: bold;
  }
  
  #account_mail1_code {
      margin-right: 3px;
  }
  
  .alert_msg {
      margin-top: 13px;
      font-size: 0.9em;
      padding-bottom: 10px;
      color: #4682b4;
      font-weight: bold;
  }
  
  #apply_msg {
      font-size: 0.9em;
      color: #4682b4;
      font-weight: bold;
  }
  
  .regist_kakunin {
      padding-top: 5px;
      font-weight: bold;
      font-size: 1.1em;
      color: #6f95c3;
  }
  
  .mail_reg_btn {
      cursor: pointer;
      font-size: 0.9em;
      padding: 5px;
      border-radius: 6px;
      border-color: #89B700;
      width: fit-content;
      color: #FFF;
      background: #89B700;
  }
  
  .anken_regist_kakunin {
      width: 100%;
  }
  
  #email3_code {
      margin-right: 5px;
  }
  
  .code_btn {
      cursor: pointer;
      margin-left: 5px;
  }
  
  .change_status2 {
      cursor: pointer;
      padding: 5px;
      border-radius: 6px;
      border-color: #68889e;
      width: fit-content;
      color: #FFF;
      background: #68889e;
  }
  
  .change_status {
      font-weight: bold;
      cursor: pointer;
      padding: 10px;
      border-radius: 6px;
      border-color: #89B700;
      width: fit-content;
      color: #FFF;
      background: #89B700;
  }
  
  .contact_list_btn {
      cursor: pointer;
      color: #2F96BB;
      text-decoration: underline;
      font-weight: bold;
  }
  
  .active {
      text-decoration: none;
  }
  
  #input_check {
      display: block;
      margin: 0 auto;
      text-align: center;
  }
  
  #input_check2 {
      display: block;
      margin: 0 auto;
      text-align: center;
  }
  
  .input_check2_wrapper {
      text-align: center;
  }
  
  .input_check2 {
      display: inline-block;
      width: fit-content;
      border-style: hidden;
      text-align: center;
      margin-top: 5px;
      margin-left: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      padding: 5px 10px;
      font-size: 0.8em;
      background-color: #595658;
      font-weight: 700;
  }
  
  #plan_box {
      font-size: 1.3em;
      margin-top: 10px;
      margin-bottom: 10px;
      font-weight: bold;
      text-align: center;
      color: #4c7ba1;
  }
  
  .bnts {
      margin-top: 15px;
      display: flex;
      justify-content: center;
  }
  
  .contact_change_btn:hover {
      background-color: #7e7979;
  }
  
  .contact_change_btn {
      margin: 0 auto;
      cursor: pointer;
      text-align: center;
      margin-top: 15px;
      margin-bottom: 10px;
      text-align: center;
      font-size: 0.9em;
      padding: 5px 15px;
      border-radius: 6px;
      border-color: #68889e;
      width: fit-content;
      color: #FFF;
      background: #68889e;
  }
  
  .id_change {
      margin-top: 15px;
  }
  
  #account_pass1 {
      margin: 0 auto;
  }
  
  .change_plan_btn {
      display: inline-block;
      vertical-align: middle;
      margin: 0 5px;
      text-align: center;
      width: fit-content;
      cursor: pointer;
      font-size: 1em;
      padding: 5px 21px;
      border-radius: 6px;
      border-color: #68889e;
      color: #FFF;
      background: #68889e;
  }
  
  .here {
      font-weight: bold;
      color: #2F96BB;
  }
  
  .mail2 {
      text-align: center;
  }
  
  #contact1 {
      margin-bottom: 10xp;
  }
  
  #stripe_status {
      text-align: center;
      font-size: 1.1em;
      color: #a70b1e;
      font-weight: bold;
      margin-top: 10px;
  }
  
  .close_btn_modal1 {
      cursor: pointer;
      font-size: 1em;
      z-index: 3;
      display: inline-block;
      text-align: center;
      color: #fff;
      border-radius: 8px;
      padding: 5px 10px;
      font-size: 0.8em;
      margin: 2px 0px 5px 0px;
      background-color: #54685e;
      border-style: hidden;
  }
  
  .history_close {
      cursor: pointer;
      font-size: 0.8em;
      display: inline-block;
      text-align: center;
      color: #fff;
      border-radius: 6px;
      padding: 3px 10px;
      background: #464c5a;
      border-style: hidden;
  }
  
  .tensaku_close {
      cursor: pointer;
      font-size: 0.9em;
      display: inline-block;
      text-align: center;
      color: #fff;
      border-radius: 2px;
      padding: 1px 2px;
      background: #b1b1b2;
      border-style: hidden;
  }
  
  #correct_yaku {
      text-align: left;
  }
  
  #history {
      text-decoration: underline;
  }
  
  .your_comment {
      color: darkgreen;
      font-weight: bold;
  }
  
  .history_contents {
      padding: 5px 5px;
      border-radius: 6px;
      border: 1px solid #54685e;
      background-color: #FFF;
      overflow-y: auto;
  }
  
  @media screen and (max-width: 768px) {
      .history_contents {
          max-height: 220px;
      }
  }
  
  @media screen and (min-width: 769px) {
      .history_contents {
          max-height: 220px;
      }
  }
  
  .each_word {
      padding-left: 7px;
      color: #2a657b;
  }
  
  .each_word input[type="checkbox"] {
      margin-right: 2px;
  }
  
  #word_list {
      margin-top: 5px;
  }
  
  .popup {
      text-align: center;
      display: none;
      position: fixed;
      bottom: 70px;
      right: 20px;
      z-index: 97;
      border: 2px solid #85b0c9;
      background-color: #f1f1f1;
      padding: 4px;
      border-radius: 15px;
      color: #FFF;
      font-size: 0.9em;
      font-weight: bolder;
      width: fit-content;
      height: fit-content;
      background-color: #2c8caf;
      box-shadow: 0px 2px 2px 1px #bebebe;
  }
  
  .popup {
      text-align: center;
      display: none;
      position: fixed;
      right: 20px;
      z-index: 97;
      border: 2px solid #85b0c9;
      background-color: #f1f1f1;
      padding: 4px;
      border-radius: 15px;
      color: #FFF;
      font-size: 0.9em;
      font-weight: bolder;
      width: fit-content;
      height: fit-content;
      background-color: #2c8caf;
      box-shadow: 0px 2px 2px 1px #bebebe;
  }
  
  @media screen and (max-width: 768px) {
      .popup {
          bottom: 5px;
      }
  }
  
  @media screen and (min-width: 769px) {
      .popup {
          bottom: 70px;
      }
  }
  
  @media screen and (max-width: 768px) {
      .tango_cho {
          font-size: 0.9em;
      }
  }
  
  @media screen and (min-width: 769px) {
      .tango_cho {
          font-size: 0.9em;
      }
  }
  
  @media screen and (max-width: 768px) {
      .eitango {
          margin-right: 3px;
          font-size: 1.4em;
          margin-top: 45px;
      }
      .jptango {
          margin-top: 20px;
          font-size: 1.3em;
          margin-bottom: 50px;
      }
  }
  
  @media screen and (min-width: 769px) {
      .eitango {
          margin-right: 3px;
          font-size: 1.4em;
          margin-top: 40px;
      }
      .jptango {
          margin-top: 20px;
          font-size: 1.3em;
          margin-bottom: 20px;
      }
  }
  
  .tango {
      width: 60px;
      height: auto;
  }
  /* SP吹き出し*/
  
  .bubble04 {
      position: relative;
      display: inline-block;
      width: fit-content;
      width: 250px;
      word-break: break-all;
      text-align: left;
      color: #FFF;
      padding: 9px;
      margin-left: 10px;
      background-color: #488aa0;
      border-radius: 12px;
  }
  
  .bubble04:before {
      content: '';
      position: absolute;
      display: block;
      border-style: solid;
      border-color: transparent #488aa0;
      border-width: 10px 10px 10px 0;
      top: 50%;
      left: -10px;
      margin-top: -10px;
  }
  
  @media (min-width: 769px) {
      /* left side */
      .bubble04 {
          position: relative;
          display: inline-block;
          width: fit-content;
          width: 250px;
          word-break: break-all;
          text-align: left;
          color: #FFF;
          padding: 9px;
          margin-left: 10px;
          background-color: #488aa0;
          border-radius: 12px;
      }
      .bubble04:before {
          content: '';
          position: absolute;
          display: block;
          border-style: solid;
          border-color: transparent #488aa0;
          border-width: 10px 10px 10px 0;
          top: 50%;
          left: -10px;
          margin-top: -10px;
      }
  }
  
  @media screen and (max-width: 768px) {
      .kessai {
          text-align: left;
          padding-left: 8px;
          padding-right: 8px;
      }
  }
  
  @media screen and (min-width: 769px) {
      .kessai {
          text-align: left;
          padding-left: 12px;
          padding-right: 12px;
      }
  }
  
  .kessai a {
      color: black;
  }
  
  .kessai a:visited {
      color: black;
  }
  
  @media screen and (max-width: 768px) {
      .faq_content {
          width: 100%;
          background-color: #FFF;
          border-radius: 6px;
          margin-bottom: 10px;
      }
  }
  
  @media screen and (min-width: 769px) {
      .faq_content {
          margin: 0 auto;
          width: 50%;
          background-color: #FFF;
          border-radius: 6px;
          margin-bottom: 10px;
      }
  }
  
  .faq_content2 {
      padding: 10px;
  }
  
  .faq_q {
      padding-left: 5px;
      padding-right: 5px;
      color: #FFF;
      font-weight: bold;
      width: 2em;
      height: 1.5em;
      border-radius: 40%;
      background-color: #89B700;
      /* 適宜、円形要素に影をつけるための設定 */
  }
  
  .faq_a {
      padding-left: 5px;
      padding-right: 5px;
      color: #FFF;
      font-weight: bold;
      width: 2em;
      height: 1.5em;
      border-radius: 40%;
      background-color: #bf1e1e;
      /* 適宜、円形要素に影をつけるための設定 */
  }
  
  .more {
      font-size: 1em;
      cursor: pointer;
      font-weight: bold;
      color: #535151;
      margin-top: 10px;
      text-decoration: underline;
  }
  
  .more_news_btn {
      text-align: center;
      font-size: 1em;
      cursor: pointer;
      font-weight: bold;
      color: #535151;
      margin-top: 10px;
      text-decoration: underline;
  }
  
  .more_dantai_btn {
      text-align: center;
      font-size: 1em;
      cursor: pointer;
      font-weight: bold;
      color: #535151;
      margin-top: 10px;
      text-decoration: underline;
  }
  
  @media screen and (max-width: 768px) {
      .mike_access {
          text-align: center;
          width: 70%;
          height: auto;
      }
  }
  
  @media screen and (min-width: 769px) {
      .mike_access {
          text-align: center;
          width: 350px;
          height: auto;
      }
  }
  
  .setting_icon {
      margin-top: 4px;
      width: 50px;
      height: auto;
  }
  
  @media screen and (max-width: 768px) {
      .setting_iphone {
          width: 80%;
          height: auto;
      }
  }
  
  @media screen and (min-width: 769px) {
      .setting_iphone {
          width: 432px;
          height: auto;
      }
  }
  
  .total_all_text_box {
      text-align: center;
  }
  
  .total_all_text {
      font-size: 2em;
      color: #a61f1f;
      font-weight: bold;
  }
  
  .total_all_text_ave {
      font-size: 2em;
      color: #a61f1f;
      font-weight: bold;
  }
  
  .total_all_study1 {
      font-size: 2em;
      color: #a61f1f;
      font-weight: bold;
  }
  
  .total_all_study2 {
      font-size: 2em;
      color: #a61f1f;
      font-weight: bold;
  }
  
  .total_all_text_kaiwa {
      font-size: 2em;
      color: #a61f1f;
      font-weight: bold;
  }
  
  .total_all_text2 {
      font-size: 1em;
      font-weight: bold;
      color: #434547;
  }
  
  #total_all_text {
      margin-top: 20px;
      width: 100%;
      background-color: #FFF;
      border-radius: 6px;
  }
  
  .total_all_text_parts {
      margin-top: 20px;
      width: 100%;
      background-color: #FFF;
      border-radius: 6px;
  }
  
  .speakL_data {
      text-align: center;
      font-size: 1.1em;
      color: #525050;
      margin-top: 10px;
      margin-bottom: 10px;
  }
  
  #one_point_loading {
      margin: 0 auto;
  }
  
  .one_point_loading {
      text-align: center;
      width: 40px;
      height: auto;
  }
  
  .left {
      padding-left: 8px;
      padding-right: 8px;
      text-align: left;
  }
  
  @media screen and (max-width: 768px) {
      .bigger_text {
          position: absolute;
          bottom: 40px;
          left: 50%;
          /* 横方向の中央配置 */
          transform: translateX(-50%);
          /* 横方向の中央配置 */
          font-size: 1em;
          font-weight: bold;
          color: #4b6b85;
      }
  }
  
  @media screen and (min-width: 769px) {
      .bigger_text {
          position: absolute;
          bottom: 80px;
          left: 50%;
          /* 横方向の中央配置 */
          transform: translateX(-50%);
          /* 横方向の中央配置 */
          font-size: 1.4em;
          font-weight: bold;
          color: #4b6b85;
      }
  }
  
  @media screen and (max-width: 768px) {
      .pub_said {
          text-align: left;
      }
  }
  
  @media screen and (min-width: 769px) {
      .pub_said {
          text-align: center;
      }
  }
  
  #button4.inverted {
      color: #ff1493;
      background-color: #FFF;
  }
  
  .onoff_btm {
      margin-bottom: 10px;
  }
  
  .advice_collect {
      color: #a52a2a;
      text-align: left;
      font-weight: bold;
  }
  
  .store {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 100%;
      margin: 0 auto;
  }
  
  .app_store {
      max-width: 40%;
      height: auto;
  }
  
  .store_text {
      padding-left: 5px;
      padding-right: 5px;
      margin-top: 15px;
      font-size: 0.9em;
  }
  
  .store_text a {
      color: black;
  }
  
  .store_text a:visited {
      color: black;
  }
  
  .custom-swal-qr {
      max-width: 80%;
  }
  
  .qr_code {
      text-align: center;
  }
  
  .apps {
      text-align: center;
  }
  
  a.apple_link,
  a.apple_link:visited {
      color: black;
  }
  
  .apple_link {
      text-decoration: underline;
  }
  
  .dantai {
      text-align: left;
      width: fit-content;
      margin: 0 auto;
      padding-left: 20xp;
  }
  
  .thinking {
      height: 6px;
      width: auto;
  }
  
  .clo {
      width: 20px;
      height: 20px;
  }
  
  #accent_ok {
      font-size: 1.2em;
      padding: 15px 8px;
      padding-left: 10px;
      padding-right: 10px;
      cursor: pointer;
      border-radius: 6px;
      border-color: #4a83b2;
      width: fit-content;
      color: #FFF;
      font-weight: bold;
      background: #4a83b2;
      border: 1px solid #4a83b2;
  }
  
  #accent_skip {
      font-weight: bold;
      font-size: 1.1em;
      padding: 5px 8px;
      cursor: pointer;
      border-radius: 6px;
      border-color: #728e1f;
      width: fit-content;
      color: #FFF;
      background: #728e1f;
      box-shadow: none;
      border: none;
  }
  
  #accent_result {
      font-size: 1.3em;
      color: #308aaa;
      font-weight: bold;
  }
  
  #button2_accent {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      padding: 5px 12px;
      height: 50px;
      font-size: 1.1em;
      background-color: #576676;
      font-weight: 700;
  }
  
  #accent_nigate {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      padding: 5px 12px;
      height: 50px;
      font-size: 1.1em;
      background-color: #375a81;
      font-weight: 700;
  }
  
  #button3_accent {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      padding: 5px 12px;
      height: 50px;
      font-size: 1.1em;
      background-color: #ff1493;
      font-weight: 700;
  }
  
  #accent_train {
      margin: 0 auto;
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 6px;
      border-style: hidden;
      padding: 5px 12px;
      height: 50px;
      font-size: 1.1em;
      background-color: #4a83b2;
      font-weight: 700;
  }
  
  #start_accent {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 50%;
      border-style: hidden;
      padding: 5px 12px;
      height: 100px;
      width: 100px;
      font-size: 1.1em;
      background-color: #4a83b2;
      font-weight: 700;
  }
  
  #stop_accent {
      cursor: pointer;
      display: inline-block;
      text-align: center;
      margin-top: 5px;
      margin-bottom: 5px;
      color: #fff;
      border-radius: 50%;
      border-style: hidden;
      padding: 5px 12px;
      height: 100px;
      width: 100px;
      font-size: 1.1em;
      background-color: #ca3309;
      font-weight: 700;
  }
  
  #accent_ok {
      font-size: 1.2em;
      padding: 15px 8px;
      padding-left: 10px;
      padding-right: 10px;
      cursor: pointer;
      border-radius: 6px;
      border-color: #4a83b2;
      width: fit-content;
      color: #FFF;
      font-weight: bold;
      background: #4a83b2;
      border: 1px solid #4a83b2;
  }
  
  #accent_skip {
      font-weight: bold;
      font-size: 1.1em;
      padding: 5px 8px;
      cursor: pointer;
      border-radius: 6px;
      border-color: #728e1f;
      width: fit-content;
      color: #FFF;
      background: #728e1f;
  }
  
  #accent_result {
      font-size: 1.3em;
      color: #308aaa;
      font-weight: bold;
  }
  
  .speak_turn {
      text-align: center;
      height: 25px;
      width: auto;
  }
  
  .voicetalk {
      width: 100%;
  }