html,body, .v-application{
	/*
	overflow-y: initial;
*/
	user-select: none;
	-webkit-user-select: none;
	font-family: "Google Sans",Roboto,RobotoDraft,Helvetica,Arial,sans-serif !important;
}

.hero-first-header {
  display: inline-block;
  padding-right: 40px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 25vw;
  border-top-right-radius: 200px;
  border-bottom-right-radius: 200px;
  box-shadow: 0 0 6px #00000010;
  font-size: calc(100vw / 70 + 100vh / 100 + 10px);
  font-weight: 700;
  color: #fefefe;
  background-color: #3E8C86;
  transform: rotate(3deg);
}

.hero-first-header-2{
  display: inline-block;
  margin-left: 10vw;
  top: -8vw;
  padding-right: 10px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 8vw;
  border-top-left-radius: 20px;
  border-bottom-left-radius: 20px;
  box-shadow: 0 0 6px #00000010;
  font-size: calc(100vw / 19 + 1px);
  font-weight: 700;
  color: #fefefe;
  background-color: #000000c0;
  width: calc(100% - 10vw);
  position: relative;
  font-size: clamp(8px, 4vw, 52px);
}

.hero-first-header-3{
  margin-right: 20px;
  margin-left: 0px;
  margin-top: 77px;
  padding-right: 40px;
  padding-left: 8vw;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  border-top-right-radius: 20px;
  border-bottom-right-radius: 20px;

  box-shadow: 0 0 6px #00000010;
  font-size: calc(100vw / 108 + 100vh / 170 + 10px);
  font-weight: 700;
  color: #fefefe;
  background-color: #000000c0;
  width: calc(100% - 10vw);
}

.hero-title-idea-on, .hero-title-idea-on-2 {
  margin-top: 0px;
  display: inline-block;
  text-align: center;
  font-size: calc(100vw / 24 + 100vh / 30 + 1px);
  font-weight: 900;
  color: #404242;
  xxxbackground-color: #e0e0e0;
  border-radius: 7px;
  xxxbackground: linear-gradient(330deg, #f8f8f6, #eaeaea, #e6e6e6, #f2efefff);
  /*text-shadow: 0px 0px 8px #420, 0px 0px 29px #000, 0px 0px 29px #000, 0px 0px 29px #000;*/
  xxxtext-shadow: 0px 0px 3px #884, 0px 0px 8px #000;
  xxxbackground-image: radial-gradient(circle,  #00116388, #123c, #1118, #2468, #0000, #0000, #0000, #0000);
  /*background-color: #ffffff7e;*/
  font-size: clamp(20px, 5vw, 42px);
  padding-right: 56px;
  padding-left: 56px;
  padding-top: 83px;
  padding-bottom: 83px;
  box-shadow: 20px 20px 28px #5555, 1px 1px 30px #fff;
  /*background-image: linear-gradient(to bottom, #fff, #f8f8f8); /* 上から下にグラデーション */
}

.hero-title-idea-on {
  background: linear-gradient(330deg, #fff, #faf9f9, #faf9f9, #faf9f9, #faf9f9, #faf9f9, #faf9f9, #faf9f9, #faf9f9)
}

.hero-title-idea-on3 {
  margin-top: 0px;
  display: inline-block;
  text-align: center;
  font-size: calc(100vw / 24 + 100vh / 30 + 1px);
  font-weight: 900;
  color: #010101;
  border-radius: 7px;
  /*text-shadow: 0px 0px 8px #420, 0px 0px 29px #000, 0px 0px 29px #000, 0px 0px 29px #000;*/
  /*text-shadow: 0px 0px 3px #884, 0px 0px 8px #000;*/
  /*background-image: radial-gradient(circle, #ffe0c0ff, #feac, #fea8, #ff68, #ff71, #0000, #0000, #0000);*/
  /*background-color: #ffffff7e;*/
  font-size: clamp(20px, 5vw, 42px);
  padding-right: 56px;
  padding-left: 56px;
  padding-top: 95px;
  padding-bottom: 83px;
  /*background-image: linear-gradient(to bottom, #fff, #f8f8f8); /* 上から下にグラデーション */
}

.hero-title-idea-on2 {
  margin-top: 0px;
  display: inline-block;
  max-width: 600px;
  text-align: center;
  font-size: calc(100vw / 24 + 100vh / 30 + 1px);
  font-weight: 900;
  color: #404040;
  border-radius: 10px;
  background: linear-gradient(330deg, #fff, #f7f6f6, #F6F9F6, #f6f6f7, #f7f6f6, #f6f7f6, #F6F6F7,  #c0E0c8);
  background: linear-gradient(330deg, #fff,#fff,#fdfcfc,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9,#faf9f9);
  text-shadow: 1px 1px 9px #f0f0e0a0;
  font-size: clamp(12px, 4vw, 22px);
  padding-right: 56px;
  padding-left: 56px;
  padding-top: 70px;
  padding-bottom: 70px;
  line-height: 1.9;
  box-shadow: 1px 1px 20px #555, 1px 1px 30px #fff;
}

.hero-title-idea-on-2 {
  color: #FF3D87;
  text-shadow: 0px 0px 9px #e0e0e0;
}

.hero-bottom-title {
  border-top-left-radius: 200px;
  border-bottom-left-radius: 200px;
  padding-right: 40px;
  padding-left: 100px;
  padding-top: 10px;
  padding-bottom: 10px;
  right: -5px;
  bottom: 17vh;
  padding-right: 5vw;
  background: linear-gradient(45deg, #fefefeff, #fefefeff);
  display: inline-block;
  position: absolute;
  margin-top: 2vh;
  font-size: calc(100vw / 70 + 100vh / 70);
  font-weight: 700;
  color: #faa010;
  box-shadow: 0 0 6px #00000010;
  text-shadow: 0px 0px 10px rgb(254 254 254);

  transform: rotate(3deg);

}

.hero-whiteboard {
  display: inline-block;
  padding: 20px;;
  padding-top: 10px;;
  padding-bottom: 10px;;
  background: linear-gradient(90deg, #fff4, #fff6);
 
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;

  box-shadow: 5px 5px 12px #00000020;
 
  text-align: center;
  font-size: calc(100vw / 160 + 100vh / 160 + 10px);
  color: #3E8C86;
}


.buruburu {
  display: inline-block;
  animation: hurueru 0.1s infinite;
  font-size: calc(100vw / 15 + 100vh / 55);
  text-shadow: 0px 0px 9px rgb(255 205 0), 0px 0px 19px rgb(255 245 0), 0px 0px 19px rgb(255 245 0), 0px 0px 19px rgb(255 245 0), 0px 0px 29px rgb(0 0 0);
}

.hero-img-common {
  position: absolute;
  z-index: 1;
  max-width: 70vw;
  max-height: 70vh;
  display: none;
  ;
}

.hero-anime-text {
  position: absolute;
  z-index: 1;
  width: 60vw;
  display: none;
  font-size:calc(100vw / 15);
  color: white;
  font-weight:900;
  bottom: 110vh;
  right: 101vw;
  text-align: center;
  background-color: #ffa500c8;
  background: linear-gradient(90deg, #fed000b0, #fe6030b0);
  border-radius: 20px;
  text-shadow: 0px 5px 10px rgb(250 150 50);
  padding: 10px;
  line-height: 110%;
}

.hero-note-img,
.hero-viz-img {
  box-shadow: 3px 3px 15px #333;
}

.hero-note-img {
  bottom: 110vh;
  left: 0vw;
}

.hero-viz-img {
  right: 120vw;
  top: 50vh;
}

.hero-img-3 {
  width: calc(100vw / 10);
  left: -15vw;
  top: 40vh;
}

.img-noshadow {
  max-width: 40vw;
  box-shadow: none;
}

.hero-angel {
  top: -100vh;
  left: 0vw;
  width: 30vw;
  filter: drop-shadow(0px 0px 30px #fece20);
}

.hero-img-5 {
  width: calc(13vw + 25vh);
  bottom: 110vh;
  right: 101vw;
}

.hero-img-6 {
  bottom: 50vh;
  right: 101vw;
  width: calc(5vw + 5vh);
}



@keyframes hurueru {
  0% {
    transform: translate(0px, 0px) rotateZ(3deg);
  }

  50% {
    transform: translate(0px, 0px) rotateZ(4deg);
  }

  100% {
    transform: translate(0px, 0px) rotateZ(3deg);
  }
}

@keyframes hurueru2 {
  5% {
    transform: translate(0px, 3px) rotateZ(0deg);
  }
  25% {
    transform: translate(33px, 10px) rotateZ(8deg);
  }

  35% {
    transform: translate(-10px, 8px) rotateZ(-2deg);
  }
  65% {
    transform: translate(23px, 6px) rotateZ(5deg);
  }

  75% {
    transform: translate(-30px, -10px) rotateZ(-8deg);
  }

}

.kyokan-text {
  display:inline-block;
  padding-left: 10vw;
  padding-right: 10vw;
  color: #fefefe;
  line-height: 140%;
  letter-spacing: 0px;
  font-size: calc(100vw / 100 + 100vh / 220 + 10px);
  font-weight: 700;
  margin-bottom: 40px;  
}

.kyokan-title {
  font-size: calc(100vw / 120 + 100vh / 120 + 10px);
  font-weight: 700;
  margin-bottom: 40px;  
  padding-right: 0vw;
  xxxbackground-color: #010101;
  xxxbackground: linear-gradient(210deg, #252515ff, #252515ff, #080808ff, #040404ff);
  border-radius: 2px;
  padding: 20px;
  xxxbox-shadow: 5px 5px 10px #010101;
  width: 90%;
  color:#101010;
}

.kyokan-small {
  padding-left: 12vw;
  font-size: calc(100vw / 280 + 100vh / 180 + 10px);
  color: #fefefe;
  margin-bottom: 70px;  
  font-weight: 400;
}

.kyokan-poem {
  font-size: calc(100vw / 90 + 100vh / 90);
  line-height:180%;
}

.solution-first-header {
  display: inline-block;
  width: 75vw;
  margin-top: 2vh;
  margin-right: -1vh;
  padding-right:40px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 40px;
 border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-top-left-radius: 20px;
  border-bottom-left-radius: 20px;
  background: linear-gradient(90deg, #fff, #fff);
  background: linear-gradient(90deg, #fef0e0, #fef0e0);
  background: linear-gradient(90deg, #fec020, #fe9080);
  box-shadow: 6px 6px 6px #00000020;
  font-size: calc(100vw / 50 + 100vh / 65);
  font-weight: 700;
  color: #fefefe;
  text-align: left;

  transform: rotate(-0.5deg);

}

.solution-whiteboard {
  display: inline-block;
  padding: 20px;;
  padding-top: 10px;;
  background: linear-gradient(90deg, #fff, #fff);
 
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;

  box-shadow: 5px 5px 12px #00000020;
 
  text-align: center;
  font-size: calc(100vw / 250 + 100vh / 200 + 10px);  
}

.compare-title {
  display: inline-block;
  margin: 5px;
  color: white;
  font-size: calc(100vw / 30 + 100vh / 40);
  font-weight: 700;
}

.compare-whiteboard {
  display: inline-block;
  color: #607060;
  font-size: calc(100vw / 100 + 100vh / 80);
  font-size: 21px;

  margin: 5px;
  padding: 20px;
  padding: 20px;
  width: 90%;
  border-radius: 2px;

  background: linear-gradient(90deg, #fff, #f4f6f4);

}
.compare-wb-title {
  display: inline-block;
  font-size: calc(100vw / 60 + 100vh / 70);
  font-size: 28px;
  margin-top: 30px;
  margin-bottom: 10px;
  font-weight: 700;
}

.compare-wb-title-sub {
  display: inline-block;
  font-size: calc(100vw / 60 + 100vh / 70);
  font-size: 25px;
  margin-top: 12px;
  margin-bottom: 10px;
  font-weight: 700;
}

.compare-whiteboard-text {
  display: inline-block;
  text-align: center;
  width: 100%;
  margin-bottom: 30px;
}

.irasshai, .irasshai-r {
  font-size: 20px;
  background: linear-gradient(90deg, #fef0f8, #fefef0);
  display: inline-block;
  margin:2vw;
  padding: 2vw;
  color: #ff8090;
  border-radius: 10px;
  border-style: none;
  border-width: 0.5px;;
  border-color: #ffd0f0;
}
