@media screen and (max-width:500px) {
  body {
    min-width: 320px;
    font-size: 16px;
  }

  .bubble,
  .ch {
    display: none;
  }

  .section_back_white,
  .section_back_green {
    overflow: visible;
  }


  .loading_tx {
    width: 50%;
  }

  /*ヘッダー画像*/
  .header_back {
    height: 120vw;
  }

  .hd_ch_01 {
    width: 33%;
    top: 2%;
    left: 66%;
  }

  .hd_ch_02 {
    width: 25%;
    top: 50%;
    left: 2%;
  }

  .hd_pnl_01 {
    width: 55%;
    top: 40%;
    left: 40%;
  }

  .hd_pnl_02 {
    width: 63%;
    top: 2%;
    left: 2%;
  }

  .logo_yumeniwa {
    width: 66%;
    top: 8%;
    left: calc(50% - 33%);

  }

  .tx_hd {
    width: 66%;
    top: 76%;
    left: calc(50% - 33%);
  }

  .topstorebutton {
    position: relative;
    display: flex;
    top: 88%;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 13vw;
    gap: 3vw;
  }

  .googlebutton {
    top: auto;
    left: auto;
    width: 37%;
    position: inherit;
  }

  .appbutton {
    top: auto;
    left: auto;
    width: 30%;
    position: inherit;
  }

  .googlebutton img,
  .appbutton img {
    position: initial;
  }

  /* 終了のお知らせ */
  .notice-service-termination {
    width: 40%;
    left: 29%;
    top: 76%;
  }

  /* 終了のお知らせ */
  .txt-service-termination {
    width: 90%;
    left: 5%;
    top: 87%;
  }

  /*ジャンプボタン*/
  .header_button_area {
    padding: 6% 0;
    background-size: cover;
    background-repeat: no-repeat;
  }

  .header_button_area .inner_container {
    flex-wrap: wrap;
    gap: 4vw;
  }

  .header_button_area img {
    width: 33vw;
  }

  .header_button span {
    font-size: 4.8vw;
  }

  /*-------------------------------------------
    topへ戻る
 -------------------------------------------*/
  .up_button {
    right: -16%;
    bottom: 1.5%;
  }

  .up_button img {
    width: 35%;
  }

  /*-------------------------------------------
　　共通クラス
　　-------------------------------------------*/

  /*共通パネル*/
  .section_caption {
    height: 50vw;
  }

  .section_ribbon {
    top: 1vw;
    width: 60vw;
  }

  .section_txtbox {
    border: 5.5vw solid transparent;
    border-image: url(./../image/pnl_grid_textbox_rp.png);
    border-image-slice: 181 fill;
    border-image-repeat: round;
    height: 25vw;
    width: 80vw;
    top: 8.2vw;
  }

  .section_ribbon_tx {
    font-size: 5vw;
    top: 5vw;
  }

  .section_main_tx {
    white-space: nowrap;
    font-size: 3.5vw;
    line-height: 5.5vw;
    top: 4vw;
  }

  /*グリッドパネル（S)*/
  .grid_s_caption {
    background-size: cover;
    max-width: 100%;
    height: auto;
  }

  .grid_s_tx {
    left: 9vw;
    font-size: 3vw;
    line-height: 4.5vw;
    display: inline-block;
  }

  .grid_s_caption .pc_only {
    display: none;
  }

  .grid_s_caption .mobile_only {
    display: inline-block;
  }

  /*pickupパネル*/
  .pickup_contents {
    height: 40vw;
    width: 100%;
  }

  .back_container {
    height: 43vw;
    width: 85vw;
  }

  .pickup_contents {
    height: 55vw;
  }

  .pickup_back {
    width: 85vw;
  }

  .pickup_top {
    margin-top: -7.5vw;
    width: 45vw;
  }

  .pickup_top_tx {
    margin-top: -5.5vw;
    left: 5vw;
    font-size: 3vw;
  }


  /*共通テキスト*/
  .green_tx {
    font-size: 3.5vw;
  }

  .lightgreen_tx {
    font-size: 2.8vw;
  }

  .underline {
    text-underline-offset: 1vw;
    text-decoration-thickness: 0.3vw;
    line-height: 2;
  }

  .pc_only {
    display: none;
  }

  .mobile_only {
    display: block;
  }


  /*-------------------------------------------
　　夢庭とは
　　-------------------------------------------*/
  .youtubelink iframe {
    width: 80vw;
    height: 46vw;
  }

  /*見守り通知*/
  .bell {
    top: 1.5vw;
    left: 28vw;
    width: 5vw;
  }

  .ria_s {
    top: 2vw;
    width: 26vw;
    left: 67vw;
  }

  .ria_name {
    top: 20vw;
    left: 75vw;
    width: 20vw;
  }

  .ria_name_back {
    top: 22vw;
    left: 76.5vw;
    width: 17vw;
  }

  /*-------------------------------------------
　　箱庭づくり
　　-------------------------------------------*/

  .garden_rank {
    width: 40vw;
    height: 20vw;
    top: 1vw;
    left: 60vw;
  }

  .gardenrank_back {
    top: 0;
    width: 37vw;
  }

  .gardenrank_tx {
    top: 28%;
    left: 6%;
    font-size: 2.5vw;
    line-height: 3.5vw;
  }

  .gardenrank_about {
    left: 8.5vw;
    font-size: 3vw;
    text-decoration-thickness: 0.4vw;
    line-height: 1;
  }

  .ria_l {
    display: none;
  }

  /*箱庭写真*/
  .garden_pic {
    gap: 1vw;
    height: 50vw;
  }

  /*矢印ボタン*/
  .back_button img,
  .next_button img {
    width: 6vw;
  }

  /*イメージ*/
  .garden_pic_container {
    width: 74vw;
    height: 40vw;
  }

  .pic_active,
  .pic {
    width: 100%;
  }

  /*デコの紹介*/
  .deco,
  .deco_active {
    width: 83vw;
  }

  /*-------------------------------------------
　　健康づくり
　　-------------------------------------------*/
  #healthcare .section_back_white {
    padding-bottom: 15%;
  }

  .healthcare_main_back {
    background-image: none;
    width: 90vw;
    height: 500vw;
    border-radius: 3px;
    overflow: hidden;
  }

  .healthcare_main_back::before {
    position: absolute;
    content: "";
    inset: 0;
    border: 20px solid transparent;
    border-image: url(./../image/pnl_map_back.png);
    border-image-slice: 173 fill;
    border-image-repeat: round;
  }

  /*共通クラス*/
  .title {
    left: 50%;
    transform: translateX(-50%);
    font-size: 4.5vw;
    line-height: 0;
  }

  .title::after {
    left: 50%;
    transform: translateX(-50%);
    top: 3vw;
    height: 0.4vw;
    width: 80vw;
  }

  .contents_main_tx,
  .minigame_tx {
    white-space: nowrap;
    left: 50%;
    transform: translateX(-50%);
    font-size: 3vw;
    line-height: 4.3vw;
  }

  #healthcare .green_tx {
    font-size: 3.5vw;
  }

  .contents_img {
    top: 38vw;
    left: 50%;
    transform: translateX(-50%);
    width: 50vw;
  }

  /*ミニゲーム*/
  .minigame {
    height: 165vw;
    width: 90vw;
  }

  .minigame_container {
    top: 35vw;
    width: 60vw;
    height: 125vw;
  }

  .game_res_active {
    width: 60vw;
    left: 50%;
    transform: translateX(-50%);
    right: auto;
  }

  .game_res_active:nth-of-type(1),
  .game_res_active:nth-of-type(2) {
    left: 50%;
    transform: translateX(-50%);
    right: auto;
  }

  .mng_next_button {
    top: 75vw;
    right: 5vw;
  }

  .mng_back_button {
    top: 75vw;
    left: 5vw;
  }

  .mng_back_button img,
  .mng_next_button img {
    width: 6.5vw;
  }

  @keyframes slideInLeft {
    from {
      transform: translateX(150%);
    }

    to {
      transform: translateX(-50%);
    }
  }

  @keyframes slideInRight {
    from {
      transform: translateX(-250%);
    }

    to {
      transform: translateX(-50%);
    }
  }

  @keyframes slideOutLeft {
    from {
      transform: translateX(-50%);
    }

    to {
      transform: translateX(-250%);
    }
  }

  @keyframes slideOutRight {
    from {
      transform: translateX(-50%);
    }

    to {
      transform: translateX(150%);
    }
  }

  /*脳トレ診断*/
  .report {
    height: 135vw;
    width: 90vw;
  }

  .report .title {
    left: 50%;
  }

  .noujii {
    display: none;
  }

  /*歩数連携*/
  .walk {
    height: 135vw;
    width: 90vw;
  }

  .walk .title {
    left: 50%;
  }

  /*ジモコラウォーク*/
  .jimokora_back {
    background-image: url(./../image/pnl_back_jimokora_res.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    height: 65vw;
    top: 131vw;
    text-align: center;
  }

  .jimokora_back img {
    display: none;
  }

  .jimokora_main_tx img {
    width: 60vw;
    top: 10vw;
    left: 50%;
    transform: translateX(-50%);
  }

  .jimokora_main_tx .pink_tx,
  .jimokora_main_tx .green_tx {
    left: 50%;
    transform: translateX(-50%);
  }

  .jimokora_main_tx .pink_tx {
    width: 74%;
    font-size: 3.5vw;
    top: 31vw
  }

  .jimokora_main_tx .green_tx {
    width: 78%;
    line-height: 4.5vw;
    top: 38vw;
  }

  .jimokora_main_tx img {
    display: block;
    top: 4vw;
  }

  /*-------------------------------------------
　　ファミリア
　　-------------------------------------------*/
  /*ファミリアの共通スタイル*/
  .familiar_name {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-size: 3.5vw;
    line-height: 3vw;

  }

  .dog_back,
  .byakko_back {
    width: 20vw;
  }

  .dog_name,
  .byakko_name {
    width: 60vw;
  }

  .dog_tx,
  .byakko_tx {
    text-align: left;
    font-size: 2.7vw;
    line-height: 4.5vw;
  }

  /*イヌ*/
  .dog_back {
    top: 9vw;
    left: 9.5vw;
  }

  .dog {
    width: 20vw;
    top: 8.5vw;
    left: 10vw;
  }

  .dog_name {
    top: 11vw;
    left: 30vw;
  }

  .dog_tx {
    top: 8.5vw;
    left: 35vw;
  }

  /*ビャッコ*/
  .byakko_back {
    top: 27vw;
    right: 9vw;
  }

  .byakko {
    top: 25.5vw;
    right: 9vw;
    width: 22vw;
  }

  .byakko_name {
    top: 30.5vw;
    left: 10vw;
  }

  .byakko_tx {
    top: 28vw;
    left: 12vw;
  }

  /*ファミリアの紹介*/
  #familiar .grid_s_tx {
    white-space: nowrap;
    left: 50%;
    transform: translateX(-50%);
  }

  .rag_01 {
    top: 20vw;
    width: 16.5vw;
    left: 8vw;
    z-index: 1;
  }

  .rag_02 {
    top: 20vw;
    width: 26vw;
    left: 67vw;
    z-index: 1;
  }


  /*-------------------------------------------
　　概要
　　-------------------------------------------*/
  .x_timeline_back {
    width: 100%;
    top: 15vw;
  }

  .x_hituji {
    display: none;
  }

  .x_tx_back {
    top: 0;
  }

  .x_timeline img {
    width: 23vw;
    z-index: 2;
  }

  .x_tx {
    line-height: 4vw;
    font-size: 3vw;
    right: 6vw;
    top: 7.5vw;
    z-index: 2;
  }

  .x_ria {
    top: 37vw;
    right: 15vw;
  }

  /*followボタン*/
  .follow_button {
    top: 47vw;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
  }

  .follow_button img {
    width: 35vw;
  }

  /*アプリ概要*/
  .application {
    width: 100%;
    height: 66vw;
    margin-top: 18vw;
  }

  .app_back {
    position: relative;
    height: 60vw;
    margin: auto;
    border-radius: 3px;
    overflow: hidden;
  }

  .app_back::before {
    position: absolute;
    content: "";
    inset: 0;
    border: 20px solid transparent;
    border-image: url(./../image/pnl_map_back.png);
    border-image-slice: 173 fill;
    border-image-repeat: round;
  }


  .yumeniwa_app {
    flex-direction: column;
    align-items: center;
    margin-top: 4%;
    gap: 1vw;
  }

  .yumeniwa_app img {
    width: 20vw;
  }

  .application .title {
    font-size: 3vw;
    line-height: 0;
    left: 50%;
    transform: translateX(-50%);
    top: 58vw;
  }

  .application .title::after {
    height: 0.4vw;
  }

  .info_table .row {
    font-size: 3vw;
  }

  /*ストア*/
  .storebutton {
    max-height: 14vw;
    top: 7vw;
  }

  /*-------------------------------------------
　　フッダー
　　-------------------------------------------*/
  .footer_link {
    width: 65%;
    flex-wrap: wrap;
    row-gap: 0;
    margin: auto;
  }

  .footer_link span {
    font-size: 3vw;
  }

  .company {
    top: 4vw;
    margin-bottom: 1vw;
  }

  .company a:first-child img {
    width: 18vw;
  }

  .company a:last-child img {
    width: 40vw;
  }

  .copyright {
    white-space: nowrap;
    font-size: 2.3vw;
  }
}