.main{
                  width: 100%;              /* 幅指定                          */
                  background-color: #6e5a40;   /* 背景色指定(黒色)                */
                  text-align: center;       /* テキスト表示位置指定(中央寄せ)  */
    }
     
    .text{
                  font-size:30px;           /* 文字サイズ指定                  */
                  color: #fff;              /* 色指定(白色)                    */
    }
    body {
        background-color: #eae7e7; /* アイボリーの背景色 */
        color: #000000; 
    }
    li {
        list-style-type: none;
    }
	h1{
           display: inline-block;
           position: relative;
           animation: clip-text  .5s 
           ease-in-out forwards;
           &::before{
		content: "";
		display: block;
		background-color: #000;
		position: absolute;
		inset: 0;
		animation: clip-cover  .5s
		ease-in-out forwards;
		animation-deley:  .5s
	}
	}
	@keyframes clip-cover{
		from{
			clip-path: inset(0 0 0 0);
		}
		to{
		  clip-path: inset(0 0 0 100%)
		}
	}