.line{
  height: 3px;
  width: 100vw;
  max-width: 900px;
  background: linear-gradient(to right, rgb(255,255,0), rgb(255,0,255));
}

.contents1{
  margin-top: 30px;
  margin-left: auto;
  margin-right: auto;
  max-width: 900px;
    background: radial-gradient(#f219A1, #EA6264);
    display: flex;
  align-items: center;
  text-shadow: 3px 3px 3px rgba(0,0,0,0.5);
}

.text{
   width: 100%;
    text-align: center;
    color: #fff;
    font-size: 13px;
}

.contents1 .text{
  width: 40vw;
  max-width: 360px;
    float: left;
}


.contents1 img{
  height: 60vw;
  max-height: 540px;
  width:60vw;
  max-width: 540px;
  float: right;
}

.text .strong{
   font-size: 22px;
   font-family: sans-serif;
}

.contents2{
  margin-left: auto;
  margin-right: auto;
  max-width: 900px;
    background: linear-gradient(#05FBFF, #1E00FF);
    display: flex;
    align-items: center;
    text-shadow: 3px 3px 3px rgba(0,0,0,0.5);
  }

.contents2 .text{
  width: 40vw;
  max-width: 360px;
    float: right;
}

.contents2 img{
  height: 60vw;
  max-height: 540px;
  width:60vw;
  max-width: 540px;
  float: left;
}

.not_float{
  height:50vw;
  max-height: 450px;
  width: 100vw;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 30px;
  background-color: rgba(255, 255, 255, 0.9) ;
}

.contents3, .contents4{
  display: flex;
  align-items: center;
  text-align: center;
  height:50vw;
  max-height: 450px;
  width: 49.5vw;
  max-width: 445.5px;
  color: #fff;
  text-shadow: 3px 3px 3px rgba(0,0,0,0.5);
}

.contents3{
  float:left;
  background: linear-gradient(120deg, #f6d365 0%, #fda085 100%);
}

.contents4{
  float:right;
  background: linear-gradient(to top, #ebbba7 0%, #cfc7f8 100%);
}