body {
            font-family: Arial, sans-serif;
            line-height: 1.6;
            margin: 0;
            padding: 0;
            background-color: #f4f4f4;
        }
        header {
            background-color: #00B0F0;
            width: 100%;
            color: #fff;
            padding: 10px 0;
            text-align: center;
            position: fixed;
        }

        nav {
            background: #FFC000;
            width: 100%;
            height: 50px;
            color: #fff;
            padding: 5px 5px 10px 5px;
            top: 150px;
            text-align: center;
            font-size: 14px;
            position: fixed; /* ウィンドウを基準に画面に固定 */
        }

        nav a {
            color: #fff;
            margin: 5px 10px;
            text-decoration: none;
        }

        .container {
            padding-top: 200px;
            max-width: 800px;
            margin: auto;
        }
        .card {
            background: #fff;
            padding: 20px;
            margin: 20px 0;
            box-shadow: 0 0 10px rgba(0,0,0,0.1);
        }

        table {
            border-collapse: collapse;
        }

        table th, table td {
            border: solid 2px #808080;
           /*実線 1px 黒*/
       }

        table td { /*table内のtdに対して*/
          padding: 10px 10px;/*上下3pxで左右10px*/
       }
        footer {
            background-color: #00B0F0;
            color: #fff;
            text-align: center;
            padding: 10px 0;
            margin-top: 20px;
        }

        :root{
	     scroll-padding: 220px;
	     scroll-behavior: smooth;
        }

        img{
            max-width: 100%;  /* 最大幅を500ピクセルに設定 */
            height: auto;      /* 高さを自動調整 */
            border-radius: 10px;
        }