@charset "UTF-8";


#company {
  position: relative;
}
 .banner {
  position: absolute;
  top: 0;
  left: 0;
}
#container {
           margin: 0px auto;
           display: flex;
           flex-direction: row;
           background-color: white;
}
nav ul{
       margin: 10px 0 0;
       padding: 0;
       text-align: left;
       }
nav li{
       margin: 10px auto;
       flex-direction: row;
       display: inline;
       list-style-type: none;
       padding-right: 20px;
}
nav {
     font-size:14;
}

footer{
  color:yellow;
  background-color:blue;
}

/* ▼２カラム配置　*/
aside{
      width: 20%
      height: 100%
      color: brown;
      background-color:white;
}


main {
      width: 80%;
      height: 100%;
      margin: 10px auto;
      background-color:white;
}

/* ▼表全体の装飾 */
table {
  border-collapse: collapse; /* セルの境界線を共有 */
  width: auto;
  height: auto;
}

/* ▼各セルの装飾 */
td {
  
  border: 0px white;  /* 表の罫線(=セルの枠線) */
  padding: 0.3em 0.3em;       /* セル内側の余白量 */
}
.focus-effect img {
  filter: blur(10px); /* 最初はぼかす */
  animation: focusIn 4s ease-out forwards;
}

@keyframes focusIn {
  0% {
    filter: blur(10px);
  }
  100% {
    filter: blur(0px); /* ぼかしをなくして鮮明にする */
  }
}
h1 { font-size: 60px;}
h2 { font-size: 40px;}
h3 { font-size: 36px;}
h4 { font-size: 24px;}
h5 { font-size: 16px;}
h6 { font-size: 12px;}