body {
  background-color: #ffeeff;
  color: #505050;
  padding: 0px;
  margin: 100px 50px;
  font-size: 22px;
  font-family: serif;
  line-height: 250%;
  /*animation: bgFlash 5s infinite;*/ /* steps(1, end);*/
}


h1{
font-size: 42px;
margin-top: 50px;
}  
h1 rt{
font-size: 42px;
}

h2{
 margin: 50px 0px 80px 0; 
}

table{
  width: 100%;   
  border-collapse: collapse;
  line-height: 150%;
  overflow-wrap: break-word;
  margin: 0px;
}

tr{
  overflow-wrap: break-word;
  
}
th{
display: none;;
}
td{
  max-width: 100px;
  border: 10px dotted #080;
  overflow-wrap: break-word;
  animation: hoge 5s ease-in-out infinite;
  padding: 5px;
}

@keyframes hoge {
  0%{
    border: 10px dotted #080;    
  }
  33%{
    border: 10px double #080;
  }
  66%{
    border: 10px dashed #080;
  }
  
}




.row-header-wrapper{
  display: none;
  width: 0px;
  border: 0;
}






@media (max-width: 768px) {
  body {
    padding: 0px 10px;
    margin: 0 0;
  }
  td{
    border: 5px dotted #080;
  }  
  table {
    width: 1200px;
  }
}

a{
  text-underline-offset: 3px;
  text-decoration-line: 1px solid;;
}
a:hover{
  text-decoration: underline;
}

@keyframes bgFlash {
 0%   { background-color: #080; }
 33%  { background-color: #000; }
 66%  { background-color: #eee; }
 100% { background-color: #080; } 
}


#lang{
 margin: 0;
 padding: 0;
}


ruby{
  }
  rt{
    margin: 0;
    margin-bottom: 5px;
    margin-left: 0px;
    padding: 0;
    font-size: 20px;
    color: #0a0;
  }
.ja{
color: #505050;
}
.en{
  color: #0a0;
  font-family: sans-serif;
}

section{
 margin-top: 20px;
 margin-bottom: 20px;
}


footer{
  width: 100%;
  text-align: center;
  margin: 0px;
  margin-top: 100px;
  margin-bottom: 50px;
  padding: 0px;
}

.white{
  color: #fff;
}

.registration{
  border: 1px solid #000;
  border-radius: 100px;
  padding: 20px 10px;
}