.bg_full{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.top_text {
    position: absolute;
    font-size: 2vw;
    background: #7386d5;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 10;
    color: white;
    padding: 1%;
}
.centertext {
    position: relative;
    top: 9%;
    transform: translateY(-50%);
    padding: 1% 1%;
    height: auto;
    background: #fffde3;
    width: 50%;
    top: 16%;
    left: 25%;
    border-radius: 1vmin;
    box-shadow: 1vmin 1vmin .1vmin .5vmin #ffecbc;
    font-size: 2vw;
}
.speech_left {
    top: 30%;
    left: 23%;
    width: 21%;
    color: #1155cc;
}
.speech_top_middle {
    top: 10%;
    left: 18%;
    width: 21%;
    color: blue;
}
.speech_right {
    color: blue;
    width: 22%;
    left: 59%;
    top: 21%;
}
.blue_bg{
  background: #6d9eeb;
}
.bottom_text {
    position: absolute;
    background: #fff7d1;
    width: 100%;
    font-size: 2vw;
    padding: 1%;
    top: 0;
    left: 0;
}
.click-1, .click-2, .click-3 {
    width: 30%;
    cursor: pointer;
    height: 28%;
}
.click-1:hover, .click-2:hover, .click-3:hover {
  transform: scale(1.1);
  transition: .2s;
}
.insidetext_cloud {
    top: 64% !important;
    position: absolute !important;
    color: blue;
}
.click-1 {
    top: 14%;
    left: 5%;
}
.click-2 {
    top: 34%;
    left: 35%;
}
.click-3 {
    top: 59%;
    left: 65%;
}
@media (min-aspect-ratio: 4/3){
	.top_text,.centertext{
		font-size: 5vmin;
	}
  .bottom_text{
    font-size: 4.5vmin;
  }
}