@font-face {
  font-family: YuGothicM;
  src: local("Yu Gothic Medium");
}

font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;

body {
  background-color:#f3f3f3;

  font-family: -apple-system, BlinkMacSystemFont,
               "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  
  /*  フォントのサイズ  */
  font-size: 16px;
  
  /*  フォントの色  */
  color: #333;
  
  /* カーニングの設定 */
  letter-spacing: 1.5px;
  
  /* 行間の設定 */
  line-height: 1.75;
}

a { text-decoration:none; }
a:link { color=#190602; }
a:visited { color: #333; }
a:hover { color: #4c1825; }
a:active { color: #7b2540; }


h1{
  font-size:25px;
}

.box{
  width:100%;
  background-color:#fff;
  padding: 10px 20px;
  margin-bottom:30px;
  animation: box-size 5s infinite;
  -webkit-animation: box-size 5s infinite;
  
}

@-webkit-keyframes box-size {
  0% { width:100%; }
  30% { width:30%; }
  40% { width:30%; }
  100% { width:100%; }
}
@keyframes box-size {
  0% { width:100%; }
  30% { width:30%; }
  40% { width:30%; }
  100% { width:100%; }
}