.main{
              width: 100%;              /* 幅指定                          */
              background-color: #88A476;   /* 背景色指定(黒色)                */
              text-align: center;       /* テキスト表示位置指定(中央寄せ)  */
}
 
.text{
              font-size:30px;           /* 文字サイズ指定                  */
              color: #fff;              /* 色指定(白色)                    */
}
body {
    background-color: #E6E6FA; /* アイボリーの背景色 */
    color: #000000; 
}
li {
    list-style-type: none;
}
.button {
  display       : inline-block;
  border-radius : 22%;          /* 角丸       */
  font-size     : 14pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 8px 36px;   /* 余白       */
  background    : #b0c4de;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 6px 6px 3px #666666;  /* 影の設定 */
  border        : 2px solid #b0c4de;    /* 枠の指定 */
}
.button:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #b0c4de;     /* 背景色     */
  background    : #ffffff;     /* 文字色     */
}