h3{
    margin-top:2.5rem;
     margin-left:23%;
     font-weight:normal;
}

.TextPlate{
    margin-top:20px;
    height:400px;
    width: 720px;
    border : 1px solid #ccc;    /*枠線*/
    background-color : #fff;    /*背景色*/
    box-shadow : 1px 2px 1px #ccc;
}

.box2{
    margin-top: 100px;
}

ul li{
    list-style:none;
}

ul{
    width:40%;
    margin:0 auto;
}

li{
    width:100%;
}

input[type='mail']{
    position: relative;
    width:100%;
    height:2em;
    transition: 0.3s;
	border: 1px solid #1b2538;
	border-radius: 4px;
	outline: none;
}

input[type='submit']{
    position: relative;
    display: block;
    color: black;
    top:0.3em;
    padding: 0.3em 1em;
    margin-left:auto;
}

#explain{
    position: relative;
    top:3rem;
    left:2.5rem;
    line-height : .5rem;
}

#annotation{
    position: relative;
    top:2.5em;
    left:2.5rem;
    line-height:.5rem;
}

#tag{
    position:relative;
    top:.5em;
}

#alret{
    position: relative;
}

#Failure{
    font-size:1%;
    position:relative;
    color:red;
    top: 50px;
    left:250px;
}

#succeed{
    font-size:5vw;
    position:relative;
    color:rgb(0, 255, 157);
    top: 50px;
    left:250px;
}

#top_return{
    position: relative;
}

/*ウィンドウ幅が800px以下に適用 */
@media screen and (max-width: 800px){ 
    .TextPlate{
      margin-left:5%; 
      margin-right:5%; 
    }

    h3{
        margin-left: 5%;
    }

    #top_return{
        margin-left: 5%;
    }

  }

  /*ウィンドウ幅が800px以上,900px以下に適用*/
  @media screen and (min-width: 800px) and (max-width: 900px){ 
    .TextPlate{
      margin-left:5%; 
      margin-right:5%; 
    }

    h3{
        margin-left: 5%;
    }

    #top_return{
        margin-left: 5%;
    }

    
  }

  /*ウィンドウ幅が901px以上,1000px以下に適用*/
  @media screen and (min-width: 901px) and (max-width: 1000px){ 
    .TextPlate{
      margin-right:12%; 
      margin-left:12%; 
    }

    h3{
        margin-left: 12%;
    }

    #top_return{
        margin-left: 12%;
    }
  }

  /*ウィンドウ幅が1001px以上,1100px以下に適用*/
  @media screen and (min-width: 1001px) and (max-width: 1100px){ 
    .TextPlate{
      margin-right:15%; 
      margin-left:15%; 
    }

    h3{
        margin-left: 15%;
    }

    #top_return{
        margin-left: 15%;
    }
    
  }

  /*ウィンドウ幅が1101px以上,1200px以下に適用*/
  @media screen and (min-width: 1101px) and (max-width: 1200px){ 
    .TextPlate{
      margin-right:20%; 
      margin-left:20%; 
    }

    h3{
        margin-left: 20%;
    }

    #top_return{
        margin-left: 20%;
    }
  }

  /*ウィンドウ幅が1201px以上,1400px以下に適用*/
  @media screen and (min-width: 1201px) and (max-width: 1400px){ 
    .TextPlate{
      margin-right:25%; 
      margin-left:25%; 
    }

    h3{
        margin-left: 25%;
    }

    #top_return{
        margin-left: 25%;
    }
  }

  /*ウィンドウ幅が1401px以上,1599px以下に適用*/
  @media screen and (min-width: 1401px) and (max-width: 1599px){ 
    .TextPlate{
      margin-right:30%; 
      margin-left:30%; 
    }

    h3{
        margin-left: 30%;
    }

    #top_return{
        margin-left: 30%;
    }
  }

  /*ウィンドウ幅が1600px以上に適用*/
  @media screen and (min-width: 1600px){ 
    .TextPlate{
      margin-right:35%; 
      margin-left:35%; 
    }

    h3{
        margin-left: 35%;
    }

    #top_return{
        margin-left: 35%;
    }
  }
