:root
{
	--h1-bg-color:rgb(180,180,190);
	--h2-bg-color:rgb(180,180,190);
	--main-text-color:rgb(65,65,65);
  font-family:'Noto Sans JP', sans-serif;
}


main
{
	color:var(--main-text-color);
}

h1
{
	display:block;
	font-size:2rem;
	padding-left:1rem;
	color:rgb(240,240,240);
	background-color:var(--h1-bg-color);
	line-height:3rem;
}

h2
{
	margin:2rem 0 0 0;
	padding-left:1rem;
	font-size:1.5rem;
	color:rgb(240,240,240);
	background-color:var(--h2-bg-color);
  font-weight:bold;
	line-height:2rem;
	width:70%;
}

h3
{
	margin:2rem 0 0 0;
	padding:0;
	font-weight:bold;
	font-size:1.5rem;
}

section
{
	padding: 0 0 1rem 0;
	border-bottom-style:solid;
	border-bottom-width:3px;
	border-bottom-color:rgb(140,140,140);
}

section h2:first-child
{
	margin-top:0.6rem;	
}


p,li
{
font-size:1.2rem;
margin: 1rem 0 0 1rem;
line-height:1.4rem;
max-width:50rem;
}

b
{
	font-weight:600;
}

i
{
	font-style:italic;
	color:rgb(90,30,30);
}

sup
{
	vertical-align: super;
	font-size:0.6rem;
}

/*---------summary----------------*/


summary
{
	cursor:pointer;
}

details
{
	background-color:rgb(200,200,200);
}


/*--------images------------------*/

/*normal images*/
img,iframe
{
	max-width:100%;
	margin:2rem 0 0 1rem;	
}

img.nomargin
{
	margin:0;
}

.imgdes
{
	padding:0;
	margin:0 0 1rem 0;
	line-height:1rem;
	font-size:0.6rem;
	color:black;
}


.pimg img
{
	display:block;
	width:unset;
}

.pimg span
{
	display:block;
	 width:100%;
}

/* ----------------ULs---------------------*/

ul
{
	margin:1rem 0 2rem 0;
}

li
{
	list-style-type:decimal;
	list-style-position:inside;
	margin: 0.2rem 0 0.5rem 1em;
}

ul.nostyle li
{
  	list-style-type:none;
}

ul.circle li
{
  	list-style-type:disc;
}

ul.letter li
{
  	list-style-type: upper-alpha;
}

/*--------------------tables----------------------*/

table
{
	box-shadow:2px 2px 5px rgb(17,15,125);
	width:100%;
	max-width:100%;
}

td
{
	border:solid 1px black;
	padding:0.2rem;
	margin:0;
	font-size:1rem;
	text-align:left;
  vertical-align:middle;
	color:rgb(17,15,95);
}

td>img
{
	display:block;
	margin:auto;
	padding:0;
	max-width:unset;
}


@media only screen and (min-width:38rem)
{
	.pimg img
	{
		display:inline-block;
		vertical-align:middle;
		margin:0 3% 0 0;
	}

	.pimg span
	{
		display:inline-block;	
		vertical-align:middle;
		width:50%;
	}

}

@media only screen and (min-width:50rem)
{
  td
  {
	 padding:0.5rem;
	 font-size:1.5rem;
  }
	
	
p,li
{
	font-size:1.4rem;
  line-height:1.8rem;
}
	
sup
{
	font-size:0.9rem;
}
	

.imgdes
{
	font-size:0.7rem;
	line-height:1.3rem;
}


}
