html{
			min-width:380px;}	

			
			body{
			margin: 0;
			/*height: 100%;*/
			font-family: "Noto",san-serif;
			background: url("old-paper02s.jpg") center top;
			background-size: cover;
			background-repeat: repeat;
			overflow: scroll;
		}
		a{
			text-decoration:none;
			color:#000;
		}
		/*.main_container{
		}*/

		header{
			width:100%;
			height:60px;
			margin: 0 auto;
			/*padding: 0 10%;*/
			/*max-width:70%;*/
		}
		article{
			display: block;
			margin: 0 auto;
		}

		.title_container_top{
			width:100%;
			/*margin: 0 auto;*/
			padding-top: 10%;
			text-decroation:none;
			/*max-width:70%;*/
			
		
			
		}
		header .title_container {
			margin:20px 0 0;
		}

		.title_container a{
			display:block;
			text-decoration:none;
			color:rgba(0,0,0,0);
			width:280px;
			height:50px;
			background:url(./site-logo2.png) center center no-repeat;
			background-size:cover;
			text-indent:-999px;
		}

		.title{
			font-family: "HG正楷書体-PRO";
			text-align: left;
			/*padding: 4% 4% 0 4%;*/
			margin: 0 auto;
			white-space:nowrap;
			font-size: 1.2rem;
		}
		.title_top{
			font-family: "HG正楷書体-PRO";
			text-align: center;
			padding: 4% 4% 0 4%;
			margin: 0 auto;
			white-space:nowrap;
			font-size: 1.8rem;
		}

		.sub_title{
			font-family: "HG正楷書体-PRO";
			font-size: 0.6rem;
			text-align: left;
			/*padding: 2%;*/
			margin: 0 auto;
		}
		.sub_title_top{
			font-family: "HG正楷書体-PRO";
			font-size: 1.7rem;
			text-align: center;
			padding: 2%;
			margin: 0 auto;
		}

		.top_image_container{
			text-align: center;

		}

		.image_container{
			text-align: center;
			padding: 0 4%;
		}

		img {
			width: 100%;
		}

		.head_image{
			width: 100%;
		}

		.drawing_image{
			width: 100%;
			margin: 0 auto;
		}

		.input_container{
			display: flex;
			justify-content: center;
			padding: 4%;
			gap: 10px;
		}
		
		.input_container button{
			height:60px;
			width:60px;
			font-size:1.0rem;
		}
	
		#text_input{
			line-height:3;
		}

		.label{
			font-family: "HG正楷書体-PRO";;
			text-align: center;
		}

		table{
			border-collapse: collapse;
			border-spacing: 0;
		}

		.data{
			padding: 4% 4% 0 4%;
			align-content: center;
		}

		.data table{
			width: 280px;
			margin: 0 auto;
			border-top: 1px solid #7fb7ff;
			font-size:1.2em;
		}
		caption{
			font-size:1.0rem;
		}

		.information tr, .number tr{
			border-bottom: 1px solid #7fb7ff;
		}
	
		.information th{
			width: 33%;
			padding: 3px;
			text-align: right;
			font-weight:normal;
		}
		.information td{
			width: 33%;
			padding: 3px 6px;
			text-align: left;
		}

		.number th{
			width: 33%;
			padding: 3px;
			text-align: center;
			font-weight:normal;
		}
		.number td{
			width: 33%;
			padding: 3px;
			text-align: center;
		}

		
	
		.high-res{
			align-items: center;
		}

		.attention{
			font-size: 0.5rem;
			color:#aa11aa;
		}
	
		.data .high-res a{
			font-size: 0.8em;
			margin: 0 auto;
			display: block;
			width: 280px;
			padding: 5px 0;
			text-align: center;
			background-color: #aa11aa;
			color: white;
			text-decoration: none;
			box-shadow: 0px 2px 6px 1px rgba(0,0,0, 0.4);
		}

		.data .high-res  a span{
			font-size: 0.6rem;
		}


		.link_container{
			width: 95%;
			display: flex;
			justify-content: space-between;
			margin: 0 auto;
			padding-bottom: 4px;
		}
		
		.link_container button{
			font-size: 1.6em;
			line-height: 1.0;
			background-color: rgba(0, 0, 0, 0);
			color: #000000;
			text-align: center;
			border-radius: 3px;
			border: solid 2px #000000;
		}
		.link_container button:hover {
			background-color: rgba(0, 0, 0, 1);
			color: #ffffff;
			border-color:#ffffff;
		}


		.footer {
			margin: 0 auto;
			padding: 20px  4%; 0;
		}

		.footer p{
			font-family: "HG正楷書体-PRO";
			font-size: 0.8em;
		}

		.footer figure{
			text-align: center;
		}
		.logo{
			width: 20%;
		}
		
 

.year_link, .month_link{
display: flex;
justify-content: center;
gap:20px;
align-items:center;
font-size:1.6rem;
padding-bottom: 4px;
}
.year_label, .month_label{
width:120px;
font-size:1.6rem;
text-align:center;
margin:0;
background:#fff;
border:solid 0.5px #333;
border-radius:3px;
padding: 0 4px; 
}

.month_label{

}

.week{
font-size:1.0rem;
text-align:center;
grid-row: 1 / 2;
}

.week p{
margin:0;
font-weight:600;
}

.month_table{
margin: 0 auto;
border: solid 1px #000;
text-align:center;
table-layout:fixed;
width:95%;
}

.month_table tr{
border-bottom: solid 0.5px #000;
height: 80px;
width:auto;
}

.week_label{
height:30px!important;
}

.week_label td{
vertical-align:middle!important;
}

.month_table td{
vertical-align:top;
min-width:50px;
height:auto;
padding:0;
border-left:solid 0.5px #BBB;
box-sizing:border-box;
}

.month_table p{
font-size:1.0rem;
margin:0 ;
}

.month_table a{
	display:block;
 	padding:26px 0;
	text-decoration:none;
}

.month_table .null{
	background-color: rgba(190,190,190,0.7);
}

.breadcrumb *, .breadcrumb *:after, .breadcrumb *:before {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.breadcrumb {
  margin: 10px 10px 20px 10px;
  /*padding: 0% 0% 6% 6%;*/
  color: #000;
}
.breadcrumb a {
  text-decoration: none;
  color: #767676;
}
.breadcrumb .breadcrumbs {
  padding-left: 0;
  margin-top: 0;
  margin-bottom: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
}
.breadcrumb li {
  display: inline-block;
  position: relative;
  padding-right: calc(16px + 8px);
  margin-right: 8px;
  color: #7986CB;
}
.breadcrumb li::before {
  content: '>';
  width: 1em;
  height: 1em;
  line-height: 1;
  text-align: center;
  font-size: 1em;
  color: #7fb7ff;
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.breadcrumb li:last-child {
  margin-right: 0;
  padding-right: 0;
  color: #000000;
}
.breadcrumb li:last-child::before {
  content: normal;
}

		@media screen and (min-width:860px) {

			header{
				padding: 2% 0% 2% 0%;
				max-width:70%;

			}
			.logo{
		  		width:10%;}
			

			.title{
				padding: 0;
				font-size:3.0rem;
				text-align:center;

			}

			.sub_title{
				padding: 0;
				font-size:1.8rem;
				text-align:center;

			}
			.image_container{
				display: flex;
				width: 95%;
				padding: 1% 4%
			}

			.head_image{
				width: 50%;
			}

			.image{
				width: 60%;
			}
			.Data{
				width: 40%;
			}
			img{
				width: 80%;
			}

			.top_image{
				width: 50%!important;
			}

			.input_container{
				padding: 1%;
			}
			
			.data table{
				width: 100%;
				margin: 0 auto;
				border-top: 1px solid #7fb7ff;
				font-size:1.6em;
			}
			.data table th{
				width: 33%;
				text-align: center;
				}
			.data table td{
				width: 33%;
				text-align: center;
				}
			
			#information table th{
				width: 50%;
				padding: 13px;
				text-align: right;
				font-weight: normal;
			}

			#information table td{
				width: 50%;
				padding: 2px 2px 3px 16px;
			}

			.breadcrumb {
  				/*margin: 1em auto;*/
  				padding: 0% 0% 2% 6%;
  				color: #000;
			}
			.footer{
			padding:0px 4%;
}
			.month_table{
			width:80%
}
			.obs_thumb{
			width:60%
			}


		}