/*フォント*/
body,
html {
  font-family: "fot-udmarugo-large-pr6n", sans-serif;
  font-weight: 700;
  font-style: normal;
  margin: 0;
}

.inner_container {
  position: relative;
  width: 100%;
  max-width: 1200px;
  /* これ以上中身が大きくならないコンテナ */
  margin: 0 auto;
}

.section_inner_top {
  padding-top: calc(var(--inner-vw)*5);
}

/*共通パネル*/
.section_caption {
  position: relative;
  width: 100%;
  height: calc(var(--inner-vw)*34);
}

.section_ribbon {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: calc(var(--inner-vw)*40);
  z-index: 1
}

.section_txtbox {
  position: relative;
  height: calc(var(--inner-vw)*15);
  width: calc(var(--inner-vw)*50);
  margin: auto;
  top: calc(var(--inner-vw)*4.5);
  border: calc(var(--inner-vw)*4) solid transparent;
  border-image: url(./../image/pnl_grid_textbox_rp.png);
  border-image-slice: 181 fill;
  border-image-repeat: round;
}

/*pickupパネル*/
.pickup_contents {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(var(--inner-vw)*40);
  width: 100%;
}

.back_container {
  position: relative;
  height: calc(var(--inner-vw)*30);
  width: calc(var(--inner-vw)*60);
  text-align: left;
}


.pickup_back {
  position: absolute;
  width: calc(var(--inner-vw)*60);
}

.pickup_top {
  position: absolute;
  margin-top: calc(var(--inner-vw)*-4.2);
  width: calc(var(--inner-vw)*26);
  z-index: 2;
}

.pickup_top_tx {
  position: absolute;
  margin-top: calc(var(--inner-vw)*-3.3);
  left: calc(var(--inner-vw)*2.5);
  font-size: calc(var(--inner-vw)*1.8);
  color: #ffffff;
  z-index: 3;
}

/*共通テキストスタイル*/
.section_ribbon_tx {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-size: calc(var(--inner-vw)*3);
  color: #ffffff;
  top: calc(var(--inner-vw)*3);
  z-index: 1;
}

.section_main_tx {
  white-space: nowrap;
  position: absolute;
  text-align: left;
  left: 50%;
  transform: translateX(-50%);
  font-size: calc(var(--inner-vw)*2);
  line-height: calc(var(--inner-vw)*3.8);
  z-index: 2;
  top: calc(var(--inner-vw)*1.5);
}

/*共通背景*/
.section_back_white {
  background-image: url(./../image/bg_white_rp.png);
  position: relative;
  background-position: center top;
  background-size: 25px;
  height: auto;
  text-align: center;
  overflow: hidden;
}

.section_back_green {
  position: relative;
  background-image: url(./../image/bg_green_rp.png);
  position: relative;
  background-position: center top;
  background-size: 25px;
  height: auto;
  text-align: center;
  overflow: hidden;
}

/*グリッドSパネル*/
.grid_s_caption {
  position: relative;
  background-image: url(./../image/pnl_grid_s.png);
  background-size: contain;
  background-position: bottom;
  background-repeat: repeat-x;
  width: 100%;
  text-align: left;
  margin-top: 3vw;
}

.grid_s_caption .mobile_only {
  display: none;
}

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

.grid_s_tx {
  position: relative;
  left: 17%;
  font-size: calc(var(--inner-vw)*1.8);
  line-height: calc(var(--inner-vw)*2.8);
  color: #008E78;
  display: inline-block;
  padding: 1% 0;
}

.pc_only {
  display: block;
}

.mobile_only {
  display: none;
}

/*飾り*/
.bubble {
  background: url(./../image/eff_bubble.png)no-repeat;
}

.bubble,
.ch {
  position: absolute;
  background-size: contain;
  animation: bound 3s ease-in-out infinite;
}


/*ホバー*/
@media (hover: hover) and (pointer: fine) {
  .up_button.active:hover {
    opacity: 0.8;
  }

  .googlebutton:hover,
  .appbutton:hover {
    transform: scale(0.98);
    opacity: 0.8;
  }

  .header_button:hover {
    transform: scale(0.98);
    opacity: 0.8;
  }

  .next_button:hover {
    transform: scale(0.95);
    opacity: 0.8;
  }

  .back_button:hover {
    transform: scaleX(-1) scale(0.95);
    opacity: 0.8;
  }

  .mng_next_button:hover {
    transform: scale(0.95);
    opacity: 0.8;
  }

  .mng_back_button:hover {
    transform: scaleX(-1) scale(0.95);
    opacity: 0.8;
  }

  .follow_button :hover {
    transform: scale(0.98);
    opacity: 0.8;
  }

  .storebutton a:hover img {
    transform: scale(0.98);
    opacity: 0.8;
  }

  .footer_link a:hover span {
    opacity: 0.7;
  }

}

/*-------------------------------------------
ローディング
-------------------------------------------*/
#loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #faffeb;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  z-index: 5;
  transition: 0.6s;
}

.loading_contents {
  position: relative;
  width: auto;
  margin: 0 auto;
  text-align: center;
}

.loading_ch {
  position: relative;
  width: 60%;
  z-index: 1;
  animation: fadeIn 1s ease-in forwards;

}

.loading_tx {
  width: 15%;
  animation: bound 3s ease-in-out infinite,
    fadeIn 1s ease-in forwards;
}

@keyframes bound {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(1vw);
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.loaded {
  opacity: 0;
}

body.no-scroll {
  overflow: hidden;
  height: 100%;
}

/*-------------------------------------------
topへ戻る
-------------------------------------------*/
.up_button {
  position: fixed;
  right: -2.5%;
  bottom: 0.5%;
  z-index: 3;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease-in-out,
    visibility 0.3s ease-in-out;
}

.up_button.active {
  visibility: visible;
  opacity: 1;
}

.up_button img {
  width: 60%;
}

/*-------------------------------------------
top
-------------------------------------------*/
#top {
  width: 100%;
  text-align: center;
}

.header_back {
  background-image: url("./../image/bg_sky.png");
  position: relative;
  text-align: center;
  height: 50vw;
  background-size: cover;
  background-repeat: no-repeat;
}

.hd_img {
  position: relative;
  width: 100%;
  height: 100%;
}

.hd_img img {
  position: absolute;
  max-width: 100%;
}

/*ひつじ*/
.hd_ch_01 {
  top: 6%;
  left: 40%;
  width: 18%;
  z-index: 2;
}

/*狐*/
.hd_ch_02 {
  top: 37%;
  left: 11%;
  width: 18%;
  z-index: 2;
}

/*spring*/
.hd_pnl_01 {
  top: 38%;
  left: 27%;
  width: 30%;
  z-index: 1;
}

/*sweet*/
.hd_pnl_02 {
  top: 7%;
  left: 9%;
  width: 30%;
}

/*夢庭ロゴ*/
.logo_yumeniwa {
  left: 59%;
  width: 30%;
  z-index: 3;
}

/*ヘッダーテキスト*/
.tx_hd {
  top: 67%;
  left: 61%;
  width: 26%;
}

/*ストアURL*/
.appbutton {
  position: absolute;
  top: 86%;
  left: 54.5%;
  width: 12%;
}

.googlebutton {
  position: absolute;
  top: 86%;
  left: 66.5%;
  width: 14.5%;
}

/* 終了のお知らせ */
.notice-service-termination {
  width: 24%;
  left: 20%;
  top:83%;
}

/* 終了のお知らせ */
.txt-service-termination {
  width: 60%;
  left: 20%;
  top: 82%;
}

/*-------------------------------------------
ヘッダーボタン
-------------------------------------------*/
/*button背景*/
.header_button_area {
  background-image: url("./../image/pnl_top_under.png");
  position: relative;
  height: auto;
  background-size: contain;
  padding: 2% 0;
}

.header_button_area img {
  display: block;
}

.header_button_area .inner_container {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(var(--inner-vw)*2);
  height: 100%;
}

.header_button_area a {
  position: relative;
}

.header_button_area img {
  flex: auto;
  max-width: 100%;
  width: calc(var(--inner-vw)*16);
  top: 13%;
}

.header_button span {
  position: absolute;
  font-size: calc(var(--inner-vw)*2.3);
  color: #fff;
  width: 100%;
  left: 0%;
  text-align: center;
  top: 8%;
}

/*説明文内の緑文字*/
.green_tx {
  font-size: calc(var(--inner-vw)*2.6);
  color: #008E78;
  display: inline-block;
}

/*説明文内のピンク文字*/
.pink_tx {
  color: #F33166;
  display: inline-block;
}

/*説明文内の薄緑文字*/
.lightgreen_tx {
  font-size: calc(var(--inner-vw)*1.4);
  color: #54B8A8;
  display: inline-block;
}

/*説明文内の白文字*/
.white_tx {
  color: #fff;
}

.underline {
  text-decoration: underline;
  text-underline-offset: calc(var(--inner-vw)*0.5);
  text-decoration-thickness: calc(var(--inner-vw)*0.2);
  line-height: 2;
}

/*-------------------------------------------
夢庭とは
-------------------------------------------*/
#about {
  width: 100;
  text-align: left;
}

.youtubelink iframe {
  width: calc(var(--inner-vw)*60);
  height: calc(var(--inner-vw)*35);
}

/*見守り通知*/
.bell {
  position: absolute;
  left: 28.5%;
  width: calc(var(--inner-vw)*2.8);
  top: 7%;
}

/*リアの紹介パネル*/
.ria_s {
  position: absolute;
  bottom: calc(var(--inner-vw)*3);
  left: calc(var(--inner-vw)*78);
  width: calc(var(--inner-vw)*13);
  z-index: 2;
}

.ria_name {
  position: absolute;
  bottom: calc(var(--inner-vw)*1.5);
  left: 83%;
  width: calc(var(--inner-vw)*11);
  z-index: 2;
}

.ria_name_back {
  position: absolute;
  bottom: calc(var(--inner-vw)*1);
  left: 83.5%;
  width: calc(var(--inner-vw)*10);
  z-index: 2;
}

#about .bb01 {
  width: 13%;
  height: 13%;
  top: 11%;
  left: 5%;
}

#about .bb02 {
  width: 8%;
  height: 8%;
  top: 6%;
  left: 13%;
}

#about .bb03 {
  width: 12%;
  height: 12%;
  top: 60%;
  left: 85%;
}


#about .ch01 {
  background: url(./../image/anime_ch_01.png)no-repeat;
  background-size: contain;
  width: 30%;
  height: 30%;
  top: 35%;
  left: -20%;
}

/*-------------------------------------------
箱庭づくり
-------------------------------------------*/
#garden {
  width: 100%;
  text-align: left;
}

/*箱庭ランク*/
.garden_rank {
  position: relative;
  top: 0%;
  width: 35%;
  height: calc(var(--inner-vw)*30);
  left: calc(var(--inner-vw)*56);
}

.gardenrank_back {
  position: absolute;
  left: calc(var(--inner-vw)*0);
  width: calc(var(--inner-vw)*22);
  z-index: 1;
}

.gardenrank_tx {
  position: absolute;
  text-align: center;
  left: calc(var(--inner-vw)*1.2);
  top: calc(var(--inner-vw)*3.5);
  font-size: calc(var(--inner-vw)*1.5);
  line-height: calc(var(--inner-vw)*2);
  color: #ffffff;
  z-index: 1;
}

.gardenrank_about {
  position: absolute;
  left: calc(var(--inner-vw)*5.5);
  top: calc(var(--inner-vw)*-4);
  font-size: calc(var(--inner-vw)*1.8);
  color: #FFF3A0;
  z-index: 1;

  text-decoration: underline;
  text-underline-offset: calc(var(--inner-vw)*0.6);
  text-decoration-thickness: calc(var(--inner-vw)*0.2);
  line-height: 2.1;
}

.ria_l {
  position: absolute;
  left: calc(var(--inner-vw)*13);
  top: calc(var(--inner-vw)*-14);
  width: calc(var(--inner-vw)*22);
}

/*箱庭写真*/
.garden_pic {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(var(--inner-vw)*2);
  width: 100%;
  height: calc(var(--inner-vw)*30);
}

/*矢印ボタン*/
.next_button,
.back_button {
  background-repeat: no-repeat;
  border: none;
  background: none;
  cursor: pointer;
  padding: 0;
  z-index: 1;
}

.back_button {
  transform: scaleX(-1);
}

.back_button img,
.next_button img {
  width: calc(var(--inner-vw)*5);
}

/*イメージ*/
.garden_pic_container {
  position: relative;
  overflow: hidden;
  width: calc(var(--inner-vw)*50);
  height: calc(var(--inner-vw)*30);
}

.pic_active,
.pic {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  transition: transform 0.7s cubic-bezier(0.7, -0.1, 0.7, 1.1);
  animation-fill-mode: forwards;
}

.pic {
  display: none;
}

.pic_active {
  display: block;
}

/*デコの紹介*/
.deco,
.deco_active {
  position: absolute;
  width: calc(var(--inner-vw)*59);
  display: block;
  transition: opacity 0.4s ease-in-out;
  animation-fill-mode: forwards;
}

.deco {
  opacity: 0;
}

.deco_active {
  opacity: 1;
}

/*飾り*/
#garden .bb01 {
  width: 8%;
  height: 8%;
  top: 11%;
  left: 6%;
}

#garden .bb02 {
  width: 8%;
  height: 8%;
  top: 60%;
  left: 87%;
}

#garden .bb03 {
  width: 4%;
  height: 4%;
  top: 66%;
  left: 85%;
}

#garden .bb04 {
  width: 5%;
  height: 5%;
  top: 90%;
  left: 6%;
}

/*-------------------------------------------
健康づくり
-------------------------------------------*/
#healthcare {
  position: relative;
  width: 100%;
}

.healthcare_main_back {
  position: relative;
  background-image: url(./../image/pnl_grid_l.png);
  background-repeat: no-repeat;
  background-size: 100%;
  text-align: left;
  width: calc(var(--inner-vw)*75);
  height: calc(var(--inner-vw)*240);
  margin: auto;
}

/*ミニゲーム説明*/
.minigame {
  position: relative;
  height: calc(var(--inner-vw)*92);
  width: calc(var(--inner-vw)*76);
  left: 50%;
  transform: translateX(-50%);
}

.title {
  position: absolute;
  color: #008E78;
  font-size: calc(var(--inner-vw)*2.6);
  line-height: calc(var(--inner-vw)*1);
}

.title::after {
  content: '';
  position: absolute;
  left: calc(var(--inner-vw)*0);
  top: calc(var(--inner-vw)*2.5);
  width: calc(var(--inner-vw)*50);
  height: calc(var(--inner-vw)*0.3);
  background-color: #008E78;
}

.minigame_tx {
  position: absolute;
  left: calc(var(--inner-vw)*13);
  top: calc(var(--inner-vw)*5);
  font-size: calc(var(--inner-vw)*2);
  line-height: calc(var(--inner-vw)*3.5);
}

/*ミニゲームスライド*/
.minigame_container {
  position: relative;
  top: calc(var(--inner-vw)*28);
  width: calc(var(--inner-vw)*56);
  height: calc(var(--inner-vw)*55);
  overflow: hidden;
  left: 50%;
  transform: translateX(-50%);
}

.game_res {
  display: none;
}

.game_res_active {
  position: absolute;
  width: calc(var(--inner-vw)*25);
  display: block;
}

.game_res_active:nth-of-type(1) {
  left: 0;
}

.game_res_active:nth-of-type(2) {
  right: 0;
}

/* アニメーション */
.slide-in-right {
  animation: slideInRight 0.7s cubic-bezier(0.7, -0.1, 0.7, 1.1);
}

.slide-in-left {
  animation: slideInLeft 0.7s cubic-bezier(0.7, -0.1, 0.7, 1.1);
}

.slide-out-right {
  animation: slideOutRight 0.7s cubic-bezier(0.7, -0.1, 0.7, 1.1);
}

.slide-out-left {
  animation: slideOutLeft 0.7s cubic-bezier(0.7, -0.1, 0.7, 1.1);
}

.slide-in-right,
.slide-in-left,
.slide-out-right,
.slide-out-left {
  animation-fill-mode: forwards;
}


@keyframes slideInRight {
  0% {
    transform: translateX(calc(var(--inner-vw)*-60));
  }

  100% {
    transform: translateX(0);
  }
}

@keyframes slideInLeft {
  0% {
    transform: translateX(calc(var(--inner-vw)*60));
  }

  100% {
    transform: translateX(0);
  }
}

@keyframes slideOutRight {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(calc(var(--inner-vw)*60));
  }
}

@keyframes slideOutLeft {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(calc(var(--inner-vw)*-60));
  }
}

.mng_next_button {
  position: absolute;
  background-repeat: no-repeat;
  top: calc(var(--inner-vw)*45);
  right: calc(var(--inner-vw)*3);
  border: none;
  background: none;
  cursor: pointer;
  padding: 0;
}

.mng_back_button {
  position: absolute;
  background-repeat: no-repeat;
  top: calc(var(--inner-vw)*45);
  left: calc(var(--inner-vw)*3);
  transform: scaleX(-1);
  border: none;
  background: none;
  cursor: pointer;
  padding: 0;
}

.mng_back_button img,
.mng_next_button img {
  width: calc(var(--inner-vw)*5);
}



/*健康づくり共通スタイル*/
.contents_main_tx {
  position: absolute;
  font-size: calc(var(--inner-vw)*2);
  line-height: calc(var(--inner-vw)*3.5);
  top: calc(var(--inner-vw)*5);
  left: calc(var(--inner-vw)*40);
}

.contents_img {
  position: absolute;
  top: calc(var(--inner-vw)*5);
  left: calc(var(--inner-vw)*11);
  width: calc(var(--inner-vw)*25);
}

.healthcare_main_back .green_tx {
  font-size: calc(var(--inner-vw)*2);
}

.lightgreen_tx:last-of-type {
  line-height: 1.4;
}

/*脳トレ診断*/
.report {
  position: relative;
  height: calc(var(--inner-vw)*62);
  width: calc(var(--inner-vw)*76);
  left: 50%;
  transform: translateX(-50%);
}

.report .title {
  left: calc(var(--inner-vw)*12.6);
}

.noujii {
  position: absolute;
  top: calc(var(--inner-vw)*38);
  left: calc(var(--inner-vw)*45);
  width: calc(var(--inner-vw)*25);
}

/*歩数連携*/
.walk {
  position: relative;
  height: calc(var(--inner-vw)*83);
  width: calc(var(--inner-vw)*75);
  left: 50%;
  transform: translateX(-50%);
}

.walk .title {
  left: calc(var(--inner-vw)*12.6);
}

/*ジモコラウォーク*/
.jimokora_back {
  position: relative;
  top: calc(var(--inner-vw)*57);
  text-align: center;
}

.jimokora_back img {
  width: calc(var(--inner-vw)*70);
}

/*ジモコラウォークテキスト*/
.jimokora_main_tx {
  text-align: left;
}

.jimokora_main_tx img {
  position: absolute;
  width: calc(var(--inner-vw)*26);
  top: calc(var(--inner-vw)*4.5);
  left: calc(var(--inner-vw)*3.6);
}

.jimokora_main_tx .pink_tx {
  position: absolute;
  font-size: calc(var(--inner-vw)*2);
  top: calc(var(--inner-vw)*0.5);
  right: calc(var(--inner-vw)*6.5);
  display: block;
}

.jimokora_main_tx .green_tx {
  position: absolute;
  font-size: calc(var(--inner-vw)*2);
  line-height: calc(var(--inner-vw)*3);
  right: calc(var(--inner-vw)*5);
  top: calc(var(--inner-vw)*4);
}

/*飾り*/
#healthcare .bb01 {
  width: 8%;
  height: 8%;
  top: 11%;
}

#healthcare .bb02 {
  width: 8%;
  height: 8%;
  top: 60%;
  left: 91%;
}

#healthcare .bb03 {
  width: 4%;
  height: 4%;
  top: 63%;
  left: 90%;
}

#healthcare .bb04 {
  width: 8%;
  height: 8%;
  top: 95%;
}

#healthcare .bb05 {
  width: 6%;
  height: 6%;
  top: 30%;
  left: 94%;
}

#healthcare .ch01 {
  background: url(./../image/anime_ch_02.png)no-repeat;
  background-size: contain;
  width: 18%;
  height: 18%;
  left: -20%;
  top: 35%;
}

#healthcare .ch02 {
  background: url(./../image/anime_ch_03.png)no-repeat;
  background-size: contain;
  width: 18%;
  height: 18%;
  right: -20%;
  top: 80%;
}

/*-------------------------------------------
ファミリア
-------------------------------------------*/
#familiar {
  width: 100%;
  text-align: left;
}

/*ファミリアpickup*/
.familiar_name {
  color: #f86c79;
  font-size: calc(var(--inner-vw)*2.5);
  line-height: calc(var(--inner-vw)*6);
}

/*ファミリアの共通スタイル*/
.dog_back,
.byakko_back {
  position: absolute;
  width: calc(var(--inner-vw)*14);
}

.dog_name,
.byakko_name {
  position: absolute;
  width: calc(var(--inner-vw)*35);
}

.dog_tx,
.byakko_tx {
  position: absolute;
  text-align: center;
  font-size: calc(var(--inner-vw)*1.8);
  letter-spacing: calc(var(--inner-vw)*-0.1);
  line-height: calc(var(--inner-vw)*2.8);
}

/*イヌ*/
.dog_back {
  top: calc(var(--inner-vw)*7);
  left: calc(var(--inner-vw)*21.5);
}

.dog {
  position: absolute;
  width: calc(var(--inner-vw)*14);
  top: calc(var(--inner-vw)*6.8);
  left: calc(var(--inner-vw)*22);
}

.dog_name {
  top: calc(var(--inner-vw)*9);
  left: calc(var(--inner-vw)*39);
}

.dog_tx {
  top: calc(var(--inner-vw)*5);
  left: calc(var(--inner-vw)*40);
}

/*ビャッコ*/
.byakko_back {
  top: calc(var(--inner-vw)*20);
  right: calc(var(--inner-vw)*21);
}

.byakko {
  position: absolute;
  top: calc(var(--inner-vw)*19.5);
  right: calc(var(--inner-vw)*21);
  width: calc(var(--inner-vw)*15);
}

.byakko_name {
  transform: scaleX(-1);
  top: calc(var(--inner-vw)*23);
  left: calc(var(--inner-vw)*25);
}

.byakko_tx {
  top: calc(var(--inner-vw)*18.5);
  left: calc(var(--inner-vw)*24);
}

/*ファミリアの紹介*/
.rag_01 {
  position: absolute;
  top: calc(var(--inner-vw)*-1);
  width: calc(var(--inner-vw)*9);
  left: calc(var(--inner-vw)*6);
}

.rag_02 {
  position: absolute;
  top: calc(var(--inner-vw)*-7.5);
  width: calc(var(--inner-vw)*15);
  left: calc(var(--inner-vw)*80);
}

/*飾り*/
#familiar .bb01 {
  width: 10%;
  height: 10%;
  top: 10%;
  left: 10%;
}

#familiar .bb02 {
  width: 6%;
  height: 6%;
  top: 20%;
  left: 6%;
}

#familiar .bb03 {
  width: 8%;
  height: 8%;
  top: 80%;
  left: 85%;
}

#familiar .ch01 {
  background: url(./../image/anime_ch_04.png)no-repeat;
  background-size: contain;
  width: 30%;
  height: 30%;
  left: -20%;
  top: 40%;
}

/*-------------------------------------------
その他詳細
-------------------------------------------*/
#overview {
  width: 100%;
  text-align: center;
}

/*Xリンク*/
.x_timeline_back {
  position: relative;
  width: 100%;
  top: calc(var(--inner-vw)*5);
  text-align: center
}

.x_timeline_back img {
  width: calc(var(--inner-vw)*75);
}

.x_timeline {
  width: 100%;
}

.x_hituji {
  position: absolute;
  top: calc(var(--inner-vw)*-3);
  left: calc(var(--inner-vw)*9);
}

.x_ria {
  position: absolute;
  top: calc(var(--inner-vw)*28);
  right: calc(var(--inner-vw)*12);
  z-index: 1;
}

.x_tx_back {
  position: absolute;
  top: calc(var(--inner-vw)*17);
  right: calc(var(--inner-vw)*5);
}

.x_tx {
  position: absolute;
  color: #ffffff;
  line-height: calc(var(--inner-vw)*2.8);
  font-size: calc(var(--inner-vw)*2);
  right: calc(var(--inner-vw)*6.5);
  top: calc(var(--inner-vw)*22);
}

.x_timeline img {
  width: calc(var(--inner-vw)*16.5);
}

.twitter-timeline {
  position: absolute;
  width: calc(var(--inner-vw)*50);
  height: calc(var(--inner-vw)*30);
  left: 50%;
  transform: translateX(-50%);
  top: calc(var(--inner-vw)*8);
  overflow: scroll;
  z-index: 1;
}

/*followボタン*/
.follow_button {
  position: absolute;
  top: calc(var(--inner-vw)*40);
  left: calc(var(--inner-vw)*0);
  width: 50%;
}

.follow_button img {
  width: calc(var(--inner-vw)*20);
}

/*アプリ概要*/
.application {
  position: relative;
  width: 100%;
  height: calc(var(--inner-vw)*30);
  /* margin-top: calc(var(--inner-vw)*14); */
}

.app_back {
  width: calc(var(--inner-vw)*80);
}

.yumeniwa_app {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(var(--inner-vw)*2);
  margin-top: calc(var(--inner-vw)*-21);
}

.yumeniwa_app img {
  width: calc(var(--inner-vw)*15);
}

.info_table .row {
  display: flex;
  align-items: flex-start;
  font-size: calc(var(--inner-vw)*2);
}

.info_table .label_wrap {
  display: flex;
  width: 4.5em;
  position: relative;
}

.info_table .label {
  flex-shrink: 0;
}

.info_table .colon {
  position: absolute;
  right: 0;
}

.info_table .value {
  flex: 1;
  text-align: left;
}

.application .title {
  position: absolute;
  text-align: center;
  color: #008E78;
  font-size: calc(var(--inner-vw)*2);
  line-height: calc(var(--inner-vw)*1);
  left: calc(var(--inner-vw)*36.5);
  top: calc(var(--inner-vw)*19);
}

.application .title::after {
  content: '';
  position: absolute;
  left: 50%;
  top: calc(var(--inner-vw)*2);
  transform: translateX(-50%);
  width: calc(var(--inner-vw)*60);
  height: calc(var(--inner-vw)*0.3);
  background-color: #008E78;
}

/*ストア*/
.storebutton {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(var(--inner-vw)*3);
  min-height: calc(var(--inner-vw)*11);
  top: calc(var(--inner-vw)*3.5);
}

.storebutton a:first-child img {
  width: calc(var(--inner-vw)*20);
  display: block;
}

.storebutton a:last-child img {
  width: calc(var(--inner-vw)*24.5);
  display: block;
}

/*-------------------------------------------
フッダー
-------------------------------------------*/
#footer {
  width: 100%;
  text-align: center;
}

.footer_back {
  background-image: url("./../image/pnl_under.png");
  position: relative;
  text-align: center;
  height: auto;
  background-size: cover;
  background-repeat: no-repeat;
}

/*フッダーリンク*/
.footer_link {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(var(--inner-vw)*4);
  top: calc(var(--inner-vw)*2.5);
}

.footer_link span {
  font-size: calc(var(--inner-vw)*1.8);
  color: #000000;
}

.footer_link a {
  text-decoration: none;
  line-height: calc(var(--inner-vw)*6);
}

/*会社ロゴ*/
.company {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(var(--inner-vw)*3);
  top: calc(var(--inner-vw)*3.5);
  margin-bottom: calc(var(--inner-vw)*4);
}

.company img {
  display: block;
}

.company a:first-child img {
  width: calc(var(--inner-vw)*12);
}

.company a:last-child img {
  width: calc(var(--inner-vw)*25);
}

.copyright {
  font-size: calc(var(--inner-vw)*1.5);
}

@media screen and (min-width: 1180px) and (max-width: 1500px) {
  #about .ch01 {
    left: 2%;
    width: 13%;
  }

  #healthcare .ch01 {
    width: 13%;
    left: 2%;
  }

  #healthcare .ch02 {
    width: 13%;
    right: 2%;
  }

  #familiar .ch01 {
    width: 15%;
    left: 2%;
  }
}