@charset "UTF-8";

html{
	font-size: 62.5%;
}

#main {
	margin: 0 auto;
	max-width: 980px;
	padding: 60px 0;
	font-size: 1.6rem;
	line-height: 1.5; 
	letter-spacing: 0.12em;
}

#main a:link,
#main a:visited{
	color: #117CEE;
}


#main header{
	padding-bottom: 24px;
	border-bottom: 1px solid #DDDDDB;
}

#main h1{
	margin-bottom: 16px;
	font-size: 2.8rem;
	line-height: 1.5; 
	font-weight: bold;
}

#main h2{
	margin-top: 48px;
	margin-bottom: 8px;
	font-size: 2rem;
	line-height: 1.5; 
	font-weight: bold;
}

#main .main-text {
	background: #F4F4F4;
	border: 1px solid #DDDDDB;
	padding: 10px 12px;
}
#main .table-style{
	border-right: 1px solid #DDDDDB;
	border-bottom: 1px solid #DDDDDB;
	font-size: 1.6rem;
	line-height: 1.5; 
}
#main .table-style dt{
	box-sizing: border-box;
	background: #F4F4F4;
	border-left: 1px solid #DDDDDB;
	border-top: 1px solid #DDDDDB;
	padding: 10px 12px;
	font-weight: bold;
}
#main .table-style dd{
	box-sizing: border-box;
	border-left: 1px solid #DDDDDB;
	border-top: 1px solid #DDDDDB;
	padding: 10px 12px;
}

#main .item-list li{
	list-style: disc;
	margin-left: 4rem;
	margin-bottom: 6px;
}


@media screen and (min-width: 641px) {
	#main .table-flex dl{
		width: 50%;
	}
	#main .table-flex dl dt,
	#main .table-flex dl dd{
		width: 100%;
	}
	#main .table-flex{
		display: flex;
		flex-wrap: wrap;
	}
	#main .table-flex dt{
		width: 25%;
	}
	#main .table-flex dd{
		width: 75%;
	}
}

@media screen and (max-width: 640px) {
	#main {
		padding: 48px 24px;
	}
}